{
  "version": 1,
  "name": "Tessera UI",
  "items": [
    {
      "name": "Accordion",
      "type": "component",
      "description": "A stack of AccordionItems that share a border and spacing.",
      "sha256": "661d27d5168b06ffb43f57ca53cae55bb68f2fd673455593e760589a74e4b794",
      "components": [
        "AccordionItem"
      ],
      "tokens": [
        "color.border.default",
        "color.surface.default"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Accordion.tess",
        "Accordion.docs.md"
      ]
    },
    {
      "name": "AccordionItem",
      "type": "component",
      "description": "A heading that shows and hides a region of content. Use several inside an Accordion.",
      "sha256": "271514db3c76efde0611ce29153c66b077722b4c2852daee78411fac1c355fac",
      "tokens": [
        "color.action.primary.text",
        "color.border.default",
        "color.focus.ring",
        "color.text.default",
        "color.text.muted",
        "font.size.base",
        "font.weight.bold",
        "opacity.disabled",
        "space.4"
      ],
      "minTessera": "0.9.0",
      "files": [
        "AccordionItem.tess",
        "AccordionItem.docs.md"
      ]
    },
    {
      "name": "Alert",
      "type": "component",
      "description": "A message the person should notice, announced when it appears. Use it for what happened or what to fix, not for decoration.",
      "sha256": "6539e35e90e4d90207c3c7bff322df3571fb4e1777f3f303997088eb4de0f7ff",
      "components": [
        "Icon"
      ],
      "tokens": [
        "color.action.danger.text",
        "color.action.primary.text",
        "color.border.default",
        "color.surface.raised",
        "color.text.default",
        "color.text.muted",
        "font.size.sm",
        "font.weight.bold",
        "radius.md",
        "space.3",
        "space.4"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Alert.tess",
        "Alert.docs.md"
      ]
    },
    {
      "name": "Avatar",
      "type": "component",
      "description": "A person or a thing as a picture, or as initials when there is no picture or it does not load.",
      "sha256": "75fa071cce6df7483b4751469a9f4602317976f66b30a18c8c7f0864a6298f6a",
      "tokens": [
        "color.surface.hover",
        "color.text.default",
        "font.size.lg",
        "font.size.sm",
        "font.size.xs",
        "font.weight.bold",
        "radius.full",
        "space.12",
        "space.6",
        "space.8"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Avatar.tess",
        "Avatar.docs.md"
      ]
    },
    {
      "name": "Badge",
      "type": "component",
      "description": "A small label for a status or category.",
      "sha256": "7dd5f44017eef02d2174f54e5f06941f27897f01eab7898957834794147852f5",
      "tokens": [
        "color.action.danger.bg",
        "color.action.danger.fg",
        "color.action.primary.bg",
        "color.action.primary.fg",
        "color.surface.hover",
        "color.text.default",
        "font.size.xs",
        "radius.sm",
        "space.1",
        "space.3"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Badge.tess",
        "Badge.docs.md"
      ]
    },
    {
      "name": "Button",
      "type": "component",
      "description": "Triggers an action. Press it with a mouse, a finger, Enter or Space.",
      "sha256": "9205bc828f63b9642398a6cd3ddc4250f0bbd00ca6a96a89f8ac2db0532f333f",
      "tokens": [
        "color.action.danger.bg",
        "color.action.danger.bg-hover",
        "color.action.danger.fg",
        "color.action.danger.text",
        "color.action.primary.bg",
        "color.action.primary.bg-hover",
        "color.action.primary.fg",
        "color.action.primary.text",
        "color.focus.ring",
        "color.surface.hover",
        "color.surface.raised",
        "color.text.default",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.md",
        "space.1",
        "space.2",
        "space.3",
        "space.4",
        "space.6"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Button.tess",
        "Button.docs.md"
      ]
    },
    {
      "name": "Card",
      "type": "component",
      "description": "A raised surface that groups related content, with an optional heading.",
      "sha256": "b664e33160dc80b8739f0c106707ac291bd32c4508b78c60f42e3963ae4456cd",
      "tokens": [
        "color.border.default",
        "color.surface.raised",
        "color.text.default",
        "color.text.muted",
        "font.size.base",
        "font.size.lg",
        "radius.lg",
        "shadow.sm",
        "space.3",
        "space.4",
        "space.6",
        "space.8"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Card.tess",
        "Card.docs.md"
      ]
    },
    {
      "name": "Checkbox",
      "type": "component",
      "description": "A choice that is on or off. Press it, or use Space.",
      "sha256": "c96b2b256a3631f80eb3c6ec384903ee663b85319dfe6c2dc8210dc3936189ef",
      "tokens": [
        "color.action.primary.bg",
        "color.action.primary.bg-hover",
        "color.action.primary.fg",
        "color.border.strong",
        "color.focus.ring",
        "color.surface.default",
        "color.surface.hover",
        "color.text.default",
        "font.size.sm",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.sm",
        "space.1",
        "space.2",
        "space.4",
        "space.5"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Checkbox.tess",
        "Checkbox.docs.md"
      ]
    },
    {
      "name": "Combobox",
      "type": "component",
      "description": "A text field with a list of options that narrows as you type, for choosing from many. Use a Select for a short fixed list.",
      "sha256": "ef531fa82057f18f7261e315474408b186734c0fef069eab9fedf466a4ce6944",
      "tokens": [
        "color.border.default",
        "color.border.strong",
        "color.focus.ring",
        "color.surface.default",
        "color.surface.hover",
        "color.text.default",
        "color.text.muted",
        "font.size.sm",
        "font.weight.bold",
        "opacity.disabled",
        "radius.md",
        "radius.sm",
        "shadow.md",
        "space.1",
        "space.2",
        "space.3"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Combobox.tess",
        "Combobox.docs.md"
      ]
    },
    {
      "name": "Dialog",
      "type": "component",
      "description": "A modal dialog: it takes focus, makes the page behind it inert and stops it scrolling, and gives focus back when it closes.",
      "sha256": "a07fb388b78003b2ba2de4f0cce5de10c0cb2e27d889c1667a9e35c6091b50fd",
      "components": [
        "Button"
      ],
      "tokens": [
        "color.border.default",
        "color.surface.default",
        "color.surface.inverse",
        "color.text.default",
        "color.text.muted",
        "font.size.base",
        "font.size.lg",
        "font.weight.bold",
        "opacity.disabled",
        "radius.lg",
        "shadow.md",
        "space.2",
        "space.4",
        "space.6"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Dialog.tess",
        "Dialog.docs.md"
      ]
    },
    {
      "name": "Form",
      "type": "component",
      "description": "A form that checks what the person entered before it lets it through. On submit it runs your rules: a valid form fires submit with the values, an invalid one fires invalid with the errors and moves focus to the first field with one.",
      "sha256": "4dc86bb89d48253bd912cebd7cde9199f5982b6019bf12d62a5422db9f30cc46",
      "components": [
        "Button",
        "TextField"
      ],
      "tokens": [
        "color.text.default",
        "space.4"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Form.tess",
        "Form.docs.md"
      ]
    },
    {
      "name": "FormField",
      "type": "component",
      "description": "A label, a hint and an error around a control that has none of its own: a native input, or a control you built. It connects them for assistive technology, so the control is named, described and marked invalid.",
      "sha256": "f8e7a1909d405237448d406e1bae662d4775e1b02e6f448d036fd5d86abcf195",
      "tokens": [
        "color.action.danger.text",
        "color.text.default",
        "color.text.muted",
        "font.size.sm",
        "font.weight.bold",
        "space.1"
      ],
      "minTessera": "0.9.0",
      "files": [
        "FormField.tess",
        "FormField.docs.md"
      ]
    },
    {
      "name": "Icon",
      "type": "component",
      "description": "A small drawing that stands for an action or a thing, from Lucide. Give it a label when it says something on its own; without one it is decoration and hidden from assistive technology.",
      "sha256": "8208c784222be71b19e6c6299f4e3de39aab207dd6d353c38e09de309bf316f5",
      "npm": {
        "lucide": "1.62.0"
      },
      "tokens": [
        "space.4",
        "space.5",
        "space.6"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Icon.tess",
        "Icon.docs.md",
        "icons.ts"
      ]
    },
    {
      "name": "Kbd",
      "type": "component",
      "description": "A key or a shortcut, shown as it is on a keyboard.",
      "sha256": "e1280ad24d5519edb828fa509a58503c8edb6a354d7fac3cc0cae633dccce298",
      "tokens": [
        "color.border.default",
        "color.surface.raised",
        "color.text.default",
        "font.size.sm",
        "radius.sm",
        "space.0-5",
        "space.1",
        "space.2",
        "space.5",
        "space.6"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Kbd.tess",
        "Kbd.docs.md"
      ]
    },
    {
      "name": "Popover",
      "type": "component",
      "description": "A panel that opens next to a button and holds more than a tooltip can: text, a form, a few actions. It closes with Escape or a click outside, and the button always says whether it is open.",
      "sha256": "bf94b2ff6edf5b97adfae11004f39229e14d329053fd5ea770696f5d5deec543",
      "tokens": [
        "color.border.default",
        "color.border.strong",
        "color.focus.ring",
        "color.surface.default",
        "color.surface.raised",
        "color.text.default",
        "font.size.sm",
        "motion.duration.fast",
        "radius.md",
        "shadow.md",
        "space.2",
        "space.4"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Popover.tess",
        "Popover.docs.md"
      ]
    },
    {
      "name": "Progress",
      "type": "component",
      "description": "How far along something is. Give it a value from 0 to max, or leave the value out when the length of the wait is not known.",
      "sha256": "6f6fe2f23130a727357aac86bedb1e6334ef1a045474051dd604fed57bd6455f",
      "tokens": [
        "color.action.danger.bg",
        "color.action.primary.bg",
        "color.surface.hover",
        "color.text.muted",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.full",
        "space.1",
        "space.2"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Progress.tess",
        "Progress.docs.md"
      ]
    },
    {
      "name": "RadioGroup",
      "type": "component",
      "description": "A set of options where exactly one can be chosen. Arrow keys move through them and choose; Tab leaves the group.",
      "sha256": "04c15ae344c8e1301eee5cea626d63e1dedffd307edccd615915595b7f8ab935",
      "tokens": [
        "color.action.danger.text",
        "color.action.primary.bg",
        "color.action.primary.fg",
        "color.border.strong",
        "color.focus.ring",
        "color.surface.default",
        "color.text.default",
        "color.text.muted",
        "font.size.sm",
        "font.weight.bold",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.full",
        "space.1",
        "space.2",
        "space.4"
      ],
      "minTessera": "0.9.0",
      "files": [
        "RadioGroup.tess",
        "RadioGroup.docs.md"
      ]
    },
    {
      "name": "Select",
      "type": "component",
      "description": "A list of options that opens from a field and takes one, on the browser's own select. Use a Combobox to search a long list.",
      "sha256": "a2a7e52d99e169896261531b4d6c865c587bcc876a3bce901bd353b56b669210",
      "tokens": [
        "color.border.strong",
        "color.focus.ring",
        "color.surface.default",
        "color.text.default",
        "font.size.sm",
        "font.weight.bold",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.md",
        "space.1",
        "space.2",
        "space.3"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Select.tess",
        "Select.docs.md"
      ]
    },
    {
      "name": "Separator",
      "type": "component",
      "description": "A thin line that divides content, horizontally or vertically.",
      "sha256": "bf39ed95c03c03ee858b13a00a569b3700954692d26e7e5017754736c941e16b",
      "tokens": [
        "color.border.default",
        "space.4"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Separator.tess",
        "Separator.docs.md"
      ]
    },
    {
      "name": "Skeleton",
      "type": "component",
      "description": "A placeholder in the shape of content that has not loaded yet. It is hidden from assistive technology: announce the loading with a Spinner or a live region.",
      "sha256": "3a1560352526c7eb7e9969fd1cf06e02320d034efa4a130b55c63c0c7ea8692d",
      "tokens": [
        "color.surface.hover",
        "opacity.disabled",
        "radius.full",
        "radius.md",
        "radius.sm",
        "space.10",
        "space.16",
        "space.4"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Skeleton.tess",
        "Skeleton.docs.md"
      ]
    },
    {
      "name": "Spinner",
      "type": "component",
      "description": "Shows that something is loading. It is announced to a screen reader with the label.",
      "sha256": "5a3ba65ebd28880ba0d1edded2df849045404a1eb51cb335058e706f891d2271",
      "tokens": [
        "color.border.default",
        "color.text.default",
        "radius.full",
        "space.4",
        "space.5",
        "space.8"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Spinner.tess",
        "Spinner.docs.md"
      ]
    },
    {
      "name": "Switch",
      "type": "component",
      "description": "A setting that is on or off, and takes effect at once. Press it, or use Space or Enter.",
      "sha256": "835aadba60256765642688a06ba48c0a56109325fabc9fea12a98366b0cd5aeb",
      "tokens": [
        "color.action.primary.bg",
        "color.action.primary.fg",
        "color.border.strong",
        "color.focus.ring",
        "color.surface.hover",
        "color.text.default",
        "color.text.muted",
        "font.size.sm",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.full",
        "space.0-5",
        "space.1",
        "space.3",
        "space.4",
        "space.5",
        "space.6",
        "space.8"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Switch.tess",
        "Switch.docs.md"
      ]
    },
    {
      "name": "TextField",
      "type": "component",
      "description": "A text input with a visible label and an optional hint. The label is required: it is what assistive technology reads.",
      "sha256": "cc179afa8c4c5ae16fe908c6937edf5dad05fc5f2c9704f183a7af62417e41e4",
      "tokens": [
        "color.action.danger.text",
        "color.border.strong",
        "color.focus.ring",
        "color.surface.default",
        "color.text.default",
        "color.text.muted",
        "font.size.sm",
        "font.weight.bold",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.md",
        "space.1",
        "space.2",
        "space.3"
      ],
      "minTessera": "0.9.0",
      "files": [
        "TextField.tess",
        "TextField.docs.md"
      ]
    },
    {
      "name": "Textarea",
      "type": "component",
      "description": "A text box for more than one line, with a visible label, an optional hint and an optional error. The label is required: it is what assistive technology reads.",
      "sha256": "b9cf09701d21e05dd2ffc3b79112d8d317e2a6efaefd40e12554bfb7cfd5931e",
      "tokens": [
        "color.action.danger.text",
        "color.border.strong",
        "color.focus.ring",
        "color.surface.default",
        "color.text.default",
        "color.text.muted",
        "font.size.sm",
        "font.weight.bold",
        "motion.duration.fast",
        "opacity.disabled",
        "radius.md",
        "space.1",
        "space.2",
        "space.3"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Textarea.tess",
        "Textarea.docs.md"
      ]
    },
    {
      "name": "Tooltip",
      "type": "component",
      "description": "A short hint for a control, shown when the pointer rests on it or it has focus. It adds a description, never the only name: a control that needs a label has one of its own.",
      "sha256": "705cecd323a7850cf5913a8b975065e867143993e402dda6abbcfd131e8f1399",
      "components": [
        "Button"
      ],
      "tokens": [
        "color.surface.default",
        "color.surface.inverse",
        "font.size.sm",
        "radius.sm",
        "space.1",
        "space.2",
        "space.3"
      ],
      "minTessera": "0.9.0",
      "files": [
        "Tooltip.tess",
        "Tooltip.docs.md"
      ]
    },
    {
      "name": "tokens:tailwind",
      "type": "tokens",
      "description": "The default theme of Tailwind CSS (every color, the spacing scale, radii, type, shadows) as Tessera tokens, with a light and a dark semantic layer.",
      "sha256": "f24a7248ab90681e7fd7400863920f4c25d5c7e7789e518e87e4d5150cc54bdf",
      "minTessera": "0.9.0",
      "files": [
        "README.md",
        "TAILWIND-LICENSE",
        "colors.tokens.json",
        "effects.tokens.json",
        "layout.tokens.json",
        "scale.tokens.json",
        "semantic.tokens.json",
        "themes/dark.tokens.json"
      ]
    },
    {
      "name": "tokens:unstyled",
      "type": "tokens",
      "description": "The token names the components use, with plain values: black on white, square corners, no shadows. A blank page to design on.",
      "sha256": "7d230adaa730876f934858950ee6a9e0f8ae640b6f51a72cde3015126e5ddfd9",
      "minTessera": "0.9.0",
      "files": [
        "README.md",
        "colors.tokens.json",
        "effects.tokens.json",
        "scale.tokens.json",
        "themes/dark.tokens.json"
      ]
    },
    {
      "name": "tokens:tessera",
      "type": "tokens",
      "description": "The Tessera look: warm neutrals and a green accent, with a light and a dark theme.",
      "sha256": "232d6e20d0f30c6344f7354929333a95bb20b247c2c48bc21ed6153a67b089af",
      "minTessera": "0.9.0",
      "files": [
        "README.md",
        "colors.tokens.json",
        "effects.tokens.json",
        "scale.tokens.json",
        "semantic.tokens.json",
        "themes/dark.tokens.json"
      ]
    }
  ]
}