@embleema/design-system 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/README.md +2 -0
  2. package/dist/Accordion.d.ts +42 -0
  3. package/dist/Alert.d.ts +46 -0
  4. package/dist/Badge.d.ts +45 -0
  5. package/dist/Barcode.d.ts +38 -0
  6. package/dist/Boolean.d.ts +48 -0
  7. package/dist/Button.d.ts +55 -0
  8. package/dist/Cards.d.ts +95 -0
  9. package/dist/Checkbox.d.ts +47 -0
  10. package/dist/Chip.d.ts +63 -0
  11. package/dist/DateField.d.ts +44 -0
  12. package/dist/Dropdown.d.ts +68 -0
  13. package/dist/Field.d.ts +48 -0
  14. package/dist/FormStatusChip.d.ts +47 -0
  15. package/dist/Label.d.ts +39 -0
  16. package/dist/Link.d.ts +38 -0
  17. package/dist/Loading.d.ts +46 -0
  18. package/dist/MedicationCard.d.ts +54 -0
  19. package/dist/MenuDropdown.d.ts +51 -0
  20. package/dist/MenuItem.d.ts +38 -0
  21. package/dist/MenuTrigger.d.ts +37 -0
  22. package/dist/Modals.d.ts +96 -0
  23. package/dist/NativeBottomNav.d.ts +53 -0
  24. package/dist/ObjectGroupField.d.ts +63 -0
  25. package/dist/ParticipantActivityStatus.d.ts +39 -0
  26. package/dist/ProgressBar.d.ts +56 -0
  27. package/dist/Radio.d.ts +45 -0
  28. package/dist/Scrim.d.ts +34 -0
  29. package/dist/SectionHeader.d.ts +37 -0
  30. package/dist/Selector.d.ts +64 -0
  31. package/dist/SelectorOption.d.ts +44 -0
  32. package/dist/SelectorOptionGroup.d.ts +61 -0
  33. package/dist/SliderBar.d.ts +46 -0
  34. package/dist/SliderField.d.ts +47 -0
  35. package/dist/Snackbar.d.ts +67 -0
  36. package/dist/Spinner.d.ts +34 -0
  37. package/dist/StatusBadge.d.ts +40 -0
  38. package/dist/StatusMessage.d.ts +40 -0
  39. package/dist/StudyProgressSymbol.d.ts +29 -0
  40. package/dist/Tab.d.ts +64 -0
  41. package/dist/Table.d.ts +85 -0
  42. package/dist/Tag.d.ts +54 -0
  43. package/dist/TaskStatus.d.ts +35 -0
  44. package/dist/TaskStatusIcon.d.ts +29 -0
  45. package/dist/TextArea.d.ts +56 -0
  46. package/dist/TextField.d.ts +48 -0
  47. package/dist/TimePicker.d.ts +46 -0
  48. package/dist/Toggle.d.ts +42 -0
  49. package/dist/Tooltip.d.ts +59 -0
  50. package/dist/Upload.d.ts +50 -0
  51. package/dist/WebTopNav.d.ts +46 -0
  52. package/dist/index.cjs.js +9609 -0
  53. package/dist/index.cjs.js.map +1 -0
  54. package/dist/index.d.ts +50 -0
  55. package/dist/index.es.js +19521 -0
  56. package/dist/index.es.js.map +1 -0
  57. package/package.json +34 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs.js","sources":["../src/components/Accordion.tsx","../src/components/Button.tsx","../src/components/Alert.tsx","../src/components/Badge.tsx","../src/components/Field.tsx","../src/components/Barcode.tsx","../src/components/Radio.tsx","../src/components/Checkbox.tsx","../src/components/SelectorOption.tsx","../src/components/Boolean.tsx","../src/components/Cards.tsx","../src/components/Chip.tsx","../src/components/DateField.tsx","../src/components/Selector.tsx","../src/components/Dropdown.tsx","../src/components/StatusBadge.tsx","../src/components/FormStatusChip.tsx","../src/components/Tooltip.tsx","../src/components/Label.tsx","../src/components/Link.tsx","../src/components/Spinner.tsx","../src/components/Loading.tsx","../src/components/TextField.tsx","../src/components/TextArea.tsx","../src/components/MedicationCard.tsx","../src/components/MenuItem.tsx","../src/components/MenuTrigger.tsx","../src/components/MenuDropdown.tsx","../src/components/Modals.tsx","../src/components/NativeBottomNav.tsx","../src/components/ObjectGroupField.tsx","../src/components/ParticipantActivityStatus.tsx","../src/components/ProgressBar.tsx","../src/components/Scrim.tsx","../src/components/SectionHeader.tsx","../src/components/SelectorOptionGroup.tsx","../src/components/SliderBar.tsx","../src/components/SliderField.tsx","../src/components/Snackbar.tsx","../src/components/StatusMessage.tsx","../src/components/StudyProgressSymbol.tsx","../src/components/Tab.tsx","../src/components/Table.tsx","../src/components/Tag.tsx","../src/components/TaskStatusIcon.tsx","../src/components/TaskStatus.tsx","../src/components/TimePicker.tsx","../src/components/Toggle.tsx","../src/components/Upload.tsx","../src/components/WebTopNav.tsx"],"sourcesContent":["/**\n * Accordion — React port of Embleema Design System 2.0's\n * Layout/Accordion Data component set (Figma node 61:198).\n *\n * Expandable content container for progressive disclosure. Two states per\n * the Figma source:\n * - Toggle=Closed → header row only (label + circled plus)\n * - Toggle=Open → header row (label + circled minus) + expanded content\n *\n * Layout (per Figma):\n * - Container : width 350 px default (min 200, max 550), Border/Focus\n * 2 px bottom rule, overflow hidden\n * - Header row : Background/Default, padding 12 px vertical / 8 px\n * horizontal, flex items-center\n * - Label : Nunito Light 16 / 1.5, Text/Primary, ellipsis\n * - Toggle icon : 24 × 24, Action/Primary (#306AE8) — circled +/- glyph\n * - Expanded content : Background/Default, padding 8 px top / 8 px sides /\n * 20 px bottom, Nunito Light 16 / 1.5 Text/Primary,\n * preserves explicit line breaks\n *\n * Accessibility (per Figma docs):\n * - The toggle row is a <button> with role implicit, aria-expanded reflects\n * open/closed and aria-controls points at the content region id.\n * - The expanded content region uses role=\"region\" + aria-labelledby\n * pointing at the toggle id so screen readers announce the section.\n */\n\nimport * as React from \"react\";\n\nexport type AccordionProps = {\n /** Header label (Body Medium Light). */\n label: string;\n /** Content shown when open. */\n children: React.ReactNode;\n /** Controlled open state. */\n open?: boolean;\n defaultOpen?: boolean;\n onToggle?: (open: boolean) => void;\n id?: string;\n className?: string;\n};\n\nlet idCounter = 0;\nfunction useGeneratedId(prefix: string, provided?: string) {\n const [id] = React.useState(() => provided ?? `${prefix}-${++idCounter}`);\n return id;\n}\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --acc-background-default: #FEFEFE;\n --acc-text-primary: #0E0E0E;\n --acc-border-focus: #306AE8;\n --acc-action-primary: #306AE8;\n --acc-border-focus-ring: #A2BDF5;\n}\n\n.eds-acc {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n width: 350px;\n min-width: 200px;\n max-width: 550px;\n border-bottom: 2px solid var(--acc-border-focus);\n overflow: hidden;\n background: var(--acc-background-default);\n font-family: Nunito, sans-serif;\n}\n\n/* Header — clickable row that toggles the panel. */\n.eds-acc__header {\n display: flex;\n align-items: center;\n gap: 0;\n width: 100%;\n padding: 12px 8px;\n background: var(--acc-background-default);\n border: 0;\n cursor: pointer;\n font-family: inherit;\n text-align: left;\n color: var(--acc-text-primary);\n outline: 0;\n}\n.eds-acc__header:focus-visible {\n outline: 2px solid var(--acc-border-focus-ring);\n outline-offset: -2px;\n}\n\n.eds-acc__label {\n flex: 1 1 0;\n min-width: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--acc-text-primary);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.eds-acc__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n color: var(--acc-action-primary);\n}\n.eds-acc__icon svg { display: block; width: 24px; height: 24px; }\n\n/* Expanded content — same Background/Default fill, body/md-light type. */\n.eds-acc__content {\n background: var(--acc-background-default);\n padding: 8px 8px 20px;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--acc-text-primary);\n white-space: pre-wrap;\n}\n.eds-acc__content > * { margin: 0; }\n.eds-acc__content > * + * { margin-top: 16px; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-acc-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-acc-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-acc-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-acc-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-acc-matrix__stage {\n padding: 24px;\n background: #F8F8F8;\n border-radius: 8px;\n display: flex;\n justify-content: flex-start;\n align-items: flex-start;\n flex-wrap: wrap;\n gap: 32px;\n}\n.eds-acc-matrix__list {\n display: flex;\n flex-direction: column;\n gap: 12px;\n width: 100%;\n max-width: 550px;\n}\n.eds-acc-matrix__readout {\n font-size: 12px;\n color: #5E5E5E;\n margin: 12px 0 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-accordion]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-accordion\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — the canonical Icon/Action/Plus (Figma node 4052:3254) and\n// Icon/Action/Minus (Figma node 5145:22). Single-path SVGs exported verbatim\n// from the design system icon library, fills rebound to currentColor. Both\n// share a 20×20 viewBox and the same outer ring + stroke weight, so the glyph\n// swaps cleanly when toggling open/closed.\n// ---------------------------------------------------------------------------\nfunction PlusIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M9.21053 10.7895V14.2105C9.21053 14.4342 9.28623 14.6217 9.43763 14.7729C9.58904 14.9243 9.77658 15 10.0003 15C10.2241 15 10.4116 14.9243 10.5626 14.7729C10.7139 14.6217 10.7895 14.4342 10.7895 14.2105V10.7895H14.2105C14.4342 10.7895 14.6217 10.7138 14.7729 10.5624C14.9243 10.411 15 10.2234 15 9.99974C15 9.77588 14.9243 9.58842 14.7729 9.43737C14.6217 9.28614 14.4342 9.21053 14.2105 9.21053H10.7895V5.78947C10.7895 5.56579 10.7138 5.37833 10.5624 5.22711C10.411 5.0757 10.2234 5 9.99974 5C9.77588 5 9.58842 5.0757 9.43737 5.22711C9.28614 5.37833 9.21053 5.56579 9.21053 5.78947V9.21053H5.78947C5.56579 9.21053 5.37833 9.28623 5.22711 9.43763C5.0757 9.58904 5 9.77658 5 10.0003C5 10.2241 5.0757 10.4116 5.22711 10.5626C5.37833 10.7139 5.56579 10.7895 5.78947 10.7895H9.21053ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </svg>\n );\n}\n\nfunction MinusIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M5.78947 10.7895H14.2105C14.4342 10.7895 14.6217 10.7137 14.7729 10.5623C14.9243 10.4109 15 10.2234 15 9.99972C15 9.77592 14.9243 9.58842 14.7729 9.43732C14.6217 9.28612 14.4342 9.21052 14.2105 9.21052H5.78947C5.56579 9.21052 5.37833 9.28622 5.22711 9.43762C5.0757 9.58902 5 9.77662 5 10.0002C5 10.2241 5.0757 10.4116 5.22711 10.5626C5.37833 10.7138 5.56579 10.7895 5.78947 10.7895ZM10.0018 20C8.6187 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9753 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.78763 13.901C0.26254 12.6845 0 11.3848 0 10.0018C0 8.61872 0.26246 7.31859 0.78737 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.78763C7.31544 0.26254 8.6152 0 9.9982 0C11.3813 0 12.6814 0.26245 13.8984 0.78737C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88245 19.2124 6.09894C19.7375 7.31544 20 8.61522 20 9.99812C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2123C12.6846 19.7374 11.3848 20 10.0018 20ZM10 18.421C12.3509 18.421 14.3421 17.6052 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02631C14.3421 2.39473 12.3509 1.57894 10 1.57894C7.64912 1.57894 5.65789 2.39473 4.02632 4.02631C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6052 7.64912 18.421 10 18.421Z\"\n />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Accordion = React.forwardRef<HTMLDivElement, AccordionProps>(\n function Accordion(\n { label, children, open, defaultOpen = false, onToggle, id, className },\n ref\n ) {\n ensureStyles();\n\n const isControlled = open !== undefined;\n const [internal, setInternal] = React.useState<boolean>(defaultOpen);\n const isOpen = isControlled ? !!open : internal;\n\n const baseId = useGeneratedId(\"eds-acc\", id);\n const headerId = `${baseId}-header`;\n const contentId = `${baseId}-content`;\n\n const toggle = () => {\n const next = !isOpen;\n if (!isControlled) setInternal(next);\n onToggle?.(next);\n };\n\n const wrapperClass = \"eds-acc\" + (className ? ` ${className}` : \"\");\n\n return (\n <div ref={ref} id={baseId} className={wrapperClass} data-open={isOpen || undefined}>\n <button\n type=\"button\"\n id={headerId}\n className=\"eds-acc__header\"\n aria-expanded={isOpen}\n aria-controls={contentId}\n onClick={toggle}\n >\n <span className=\"eds-acc__label\">{label}</span>\n <span className=\"eds-acc__icon\" aria-hidden>\n {isOpen ? <MinusIcon /> : <PlusIcon />}\n </span>\n </button>\n {isOpen && (\n <div\n id={contentId}\n className=\"eds-acc__content\"\n role=\"region\"\n aria-labelledby={headerId}\n >\n {children}\n </div>\n )}\n </div>\n );\n }\n);\n\nexport default Accordion;\n\n// ---------------------------------------------------------------------------\n// AccordionMatrix — interactive showcase. The first row is an FAQ-style list\n// where each item toggles independently; the second row forces a closed +\n// open variant side by side for visual QA.\n// ---------------------------------------------------------------------------\nconst FAQ_ITEMS: { label: string; content: React.ReactNode }[] = [\n {\n label: \"What does Embleema do?\",\n content: (\n <>\n <p>\n Embleema builds software for decentralized clinical trials, patient\n registries, and real-world evidence programs. The platform includes\n an EDC/eCRF system for electronic data capture and a Wastewater\n Biosurveillance tool for public health monitoring.\n </p>\n <p>\n The design system serves both products with shared tokens,\n components, and accessibility patterns.\n </p>\n </>\n ),\n },\n {\n label: \"How do I switch between Open and Closed states?\",\n content: (\n <p>\n Click the header row, or focus it with the keyboard and press Enter or\n Space. The toggle button carries aria-expanded and aria-controls so\n assistive tech announces the section name when it opens.\n </p>\n ),\n },\n {\n label: \"When should I avoid using an Accordion?\",\n content: (\n <p>\n Skip it when 80%+ of users will need to expand the content anyway,\n when the content is short enough to show inline, or when you need\n navigation (use the Navigation components instead). And never nest\n accordions inside accordions.\n </p>\n ),\n },\n];\n\nconst LOREM = `Lorem ipsum dolor sit amet consectetur. Interdum urna et nulla mollis in id dapibus volutpat. Turpis at cursus at dui ac vel. Eget enim libero nam nulla lacus mattis in. Facilisis felis praesent pharetra enim augue amet faucibus fames erat.\n\nVolutpat velit feugiat suscipit gravida nisi integer. Sed enim viverra non quis ipsum laoreet quis bibendum quis. Accumsan lectus quis quis quis libero aenean.`;\n\nexport function AccordionMatrix() {\n ensureStyles();\n const [openCount, setOpenCount] = React.useState(0);\n\n return (\n <div className=\"eds-acc-matrix\">\n <section className=\"eds-acc-matrix__section\">\n <h3 className=\"eds-acc-matrix__heading\">Interactive · FAQ list</h3>\n <p className=\"eds-acc-matrix__sub\">\n Each row toggles independently. Click any header (or focus it with\n the keyboard and press Enter / Space) to expand. The icon swaps\n between Icon/Action/Plus and Icon/Action/Minus per Figma.\n </p>\n <div className=\"eds-acc-matrix__stage\">\n <div className=\"eds-acc-matrix__list\">\n {FAQ_ITEMS.map((item, i) => (\n <Accordion\n key={i}\n label={item.label}\n defaultOpen={i === 0}\n onToggle={(open) =>\n setOpenCount((n) => n + (open ? 1 : -1))\n }\n >\n {item.content}\n </Accordion>\n ))}\n </div>\n </div>\n <p className=\"eds-acc-matrix__readout\">\n Toggle events fired since mount: <strong>{openCount}</strong>\n </p>\n </section>\n\n <section className=\"eds-acc-matrix__section\">\n <h3 className=\"eds-acc-matrix__heading\">Toggle · Closed vs Open (static)</h3>\n <p className=\"eds-acc-matrix__sub\">\n Side-by-side variants matching the Figma source: a closed accordion\n on the left and an open one on the right, both at the default 350 px\n width with placeholder body copy.\n </p>\n <div className=\"eds-acc-matrix__stage\">\n <Accordion label=\"Placeholder\" defaultOpen={false}>\n <p>{LOREM}</p>\n </Accordion>\n <Accordion label=\"Placeholder\" defaultOpen>\n <p>{LOREM}</p>\n </Accordion>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Button — React port of the Embleema Design System 2.0 Action/Button component\n * (Figma node 5013:7). Variant, Kind (Figma's \"Type\"), Size, LeadingIcon, and\n * TrailingIcon are props; Default / Hover / Focus / Disabled are wired to real\n * browser states via :hover, :focus-visible, and :disabled.\n *\n * Colors mirror the bindings extracted directly from the Figma component:\n * - Semantic tokens where the Figma fill is bound to a semantic variable\n * (Action/Primary/Background, Action/Disabled/Text, Feedback/Error/Background, …).\n * - Primitive tokens where the Figma fill is bound directly to a primitive\n * (Blue/100, Blue/300, Red/100, Red/300, Neutral/50, Neutral/200, Neutral/300).\n * - Border/FocusRing for the 4px outside focus ring.\n *\n * Sizes:\n * - Large : 46px tall, 12 / 20 padding, 8px gap, 20×20 icon, button/lg (18 / 120%)\n * - Medium: 39px tall, 10 / 20 padding, 6px gap, 18×18 icon, button/md (16 / 120%)\n * - Small : 33px tall, 8 / 16 padding, 4px gap, 16×16 icon, button/sm (14 / 120%)\n *\n * Inverse buttons render light fills/text on the assumption the surrounding\n * surface is dark.\n */\n\nimport * as React from \"react\";\n\nexport type ButtonVariant = \"Primary\" | \"Destructive\" | \"Inverse\";\nexport type ButtonKind = \"Filled\" | \"Outlined\" | \"Text\";\nexport type ButtonSize = \"Large\" | \"Medium\" | \"Small\";\n\nexport type ButtonProps = {\n variant?: ButtonVariant;\n /** Figma's \"Type\" property. Renamed to avoid clashing with HTML <button type>. */\n kind?: ButtonKind;\n size?: ButtonSize;\n disabled?: boolean;\n leadingIcon?: React.ReactNode;\n trailingIcon?: React.ReactNode;\n children?: React.ReactNode;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n /** HTML <button type>. Defaults to \"button\". */\n type?: \"button\" | \"submit\" | \"reset\";\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — injected once into document.head so each <Button> doesn't\n// re-emit it. Values come straight from the Figma matrix extract.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n /* Semantic tokens */\n --action-primary-background: #306AE8;\n --action-primary-text: #FEFEFE;\n --action-destructive-background: #E02020;\n --action-destructive-text: #FEFEFE;\n --action-disabled-background: #DDDDDD;\n --action-disabled-text: #848484;\n --feedback-error-background: #FFE2E2;\n --text-primary: #0E0E0E;\n --text-inverse: #FEFEFE;\n --text-error: #E02020;\n --border-focus-ring: #A2BDF5;\n\n /* Primitives used directly by Figma for hover/state-layer treatments */\n --blue-100: #E3ECFF;\n --blue-300: #6994EE;\n --red-100: #FFE2E2;\n --red-300: #E64C4C;\n --neutral-50: #FEFEFE;\n --neutral-200: #F1F1F1;\n --neutral-300: #DDDDDD;\n\n /* Gradient/Secondary — purple #644AD4 → Embleema blue #306AE8.\n Stop positions reverse-engineered from the Figma gradient transform so\n the visible portion of the gradient on the rendered shape matches what\n Figma renders. */\n --gradient-secondary: linear-gradient(to top, #644AD4 73%, #306AE8 155%);\n}\n\n.eds-btn {\n /* Layout */\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n border-radius: 8px;\n border: 1px solid transparent;\n cursor: pointer;\n user-select: none;\n -webkit-font-smoothing: antialiased;\n\n /* Typography */\n font-family: \"Nunito\", sans-serif;\n font-weight: 500;\n line-height: 120%;\n text-decoration: none;\n white-space: nowrap;\n\n /* Animation */\n transition: background-color 120ms ease-out,\n color 120ms ease-out,\n border-color 120ms ease-out,\n box-shadow 120ms ease-out,\n filter 120ms ease-out;\n\n background-color: transparent;\n outline: none;\n}\n\n.eds-btn:disabled { cursor: not-allowed; }\n\n/* ----- Size ----- */\n.eds-btn[data-size=\"Large\"] { padding: 12px 20px; font-size: 18px; gap: 8px; min-height: 46px; }\n.eds-btn[data-size=\"Medium\"] { padding: 10px 20px; font-size: 16px; gap: 6px; min-height: 39px; }\n.eds-btn[data-size=\"Small\"] { padding: 8px 16px; font-size: 14px; gap: 4px; min-height: 33px; }\n\n.eds-btn__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n.eds-btn[data-size=\"Large\"] .eds-btn__icon { width: 20px; height: 20px; }\n.eds-btn[data-size=\"Medium\"] .eds-btn__icon { width: 18px; height: 18px; }\n.eds-btn[data-size=\"Small\"] .eds-btn__icon { width: 16px; height: 16px; }\n.eds-btn__icon svg { width: 100%; height: 100%; display: block; }\n\n/* Focus ring (applies to every enabled variant on keyboard focus) */\n.eds-btn:focus-visible:not(:disabled) {\n box-shadow: 0 0 0 4px var(--border-focus-ring);\n}\n\n/* =============================================================\n Primary\n ============================================================= */\n\n/* Primary / Filled */\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Filled\"] {\n background-color: var(--action-primary-background);\n color: var(--action-primary-text);\n}\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Filled\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Filled\"]:focus-visible:not(:disabled) {\n background-color: var(--blue-300);\n}\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Filled\"]:disabled {\n background-color: var(--action-disabled-background);\n color: var(--action-disabled-text);\n}\n\n/* Primary / Outlined */\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Outlined\"] {\n background-color: transparent;\n border-color: var(--action-primary-background);\n color: var(--action-primary-background);\n}\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Outlined\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Outlined\"]:focus-visible:not(:disabled) {\n background-color: var(--blue-100);\n}\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Outlined\"]:disabled {\n border-color: var(--neutral-300);\n color: var(--action-disabled-text);\n}\n\n/* Primary / Text */\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Text\"] {\n background-color: transparent;\n color: var(--action-primary-background);\n}\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Text\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Text\"]:focus-visible:not(:disabled) {\n background-color: var(--blue-100);\n}\n.eds-btn[data-variant=\"Primary\"][data-kind=\"Text\"]:disabled {\n color: var(--action-disabled-text);\n}\n\n/* =============================================================\n Destructive\n ============================================================= */\n\n/* Destructive / Filled */\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Filled\"] {\n background-color: var(--action-destructive-background);\n color: var(--action-destructive-text);\n}\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Filled\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Filled\"]:focus-visible:not(:disabled) {\n background-color: var(--red-300);\n}\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Filled\"]:disabled {\n background-color: var(--feedback-error-background);\n color: var(--text-error);\n}\n\n/* Destructive / Outlined */\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Outlined\"] {\n background-color: transparent;\n border-color: var(--action-destructive-background);\n color: var(--action-destructive-background);\n}\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Outlined\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Outlined\"]:focus-visible:not(:disabled) {\n background-color: var(--red-100);\n}\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Outlined\"]:disabled {\n border-color: var(--text-error);\n color: var(--text-error);\n opacity: 0.5;\n}\n\n/* Destructive / Text */\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Text\"] {\n background-color: transparent;\n color: var(--action-destructive-background);\n}\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Text\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Text\"]:focus-visible:not(:disabled) {\n background-color: var(--red-100);\n}\n.eds-btn[data-variant=\"Destructive\"][data-kind=\"Text\"]:disabled {\n color: var(--text-error);\n opacity: 0.5;\n}\n\n/* =============================================================\n Inverse — designed for dark surfaces\n ============================================================= */\n\n/* Inverse / Filled */\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Filled\"] {\n background-color: var(--neutral-50);\n color: var(--action-primary-background);\n}\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Filled\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Filled\"]:focus-visible:not(:disabled) {\n background-color: var(--neutral-200);\n}\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Filled\"]:disabled {\n background-color: rgba(255, 255, 255, 0.12);\n color: rgba(255, 255, 255, 0.38);\n}\n\n/* Inverse / Outlined */\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Outlined\"] {\n background-color: transparent;\n border-color: var(--neutral-50);\n color: var(--neutral-50);\n}\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Outlined\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Outlined\"]:focus-visible:not(:disabled) {\n background-color: rgba(255, 255, 255, 0.08);\n}\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Outlined\"]:disabled {\n border-color: rgba(255, 255, 255, 0.38);\n color: rgba(255, 255, 255, 0.38);\n}\n\n/* Inverse / Text */\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Text\"] {\n background-color: transparent;\n color: var(--neutral-50);\n}\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Text\"]:hover:not(:disabled),\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Text\"]:focus-visible:not(:disabled) {\n background-color: rgba(255, 255, 255, 0.08);\n}\n.eds-btn[data-variant=\"Inverse\"][data-kind=\"Text\"]:disabled {\n color: rgba(255, 255, 255, 0.38);\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-btn-matrix {\n font-family: \"Nunito\", sans-serif;\n color: #0E0E0E;\n padding: 32px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-btn-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-btn-matrix__heading {\n font-size: 14px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-btn-matrix__row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }\n.eds-btn-matrix__inverse {\n background: var(--gradient-secondary);\n padding: 24px;\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n.eds-btn-matrix__inverse .eds-btn-matrix__heading {\n color: var(--text-inverse);\n}\n`;\n\n// Inject (or refresh) the style block. Survives HMR by reusing the same\n// <style data-eds-button> element instead of stacking duplicates.\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return; // SSR safety\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-button]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-button\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n variant = \"Primary\",\n kind = \"Filled\",\n size = \"Medium\",\n disabled = false,\n leadingIcon,\n trailingIcon,\n children,\n onClick,\n type = \"button\",\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const cls = \"eds-btn\" + (className ? ` ${className}` : \"\");\n\n return (\n <button\n ref={ref}\n type={type}\n className={cls}\n data-variant={variant}\n data-kind={kind}\n data-size={size}\n disabled={disabled}\n onClick={onClick}\n aria-label={ariaLabel}\n >\n {leadingIcon && (\n <span className=\"eds-btn__icon\" aria-hidden>\n {leadingIcon}\n </span>\n )}\n {children != null && <span>{children}</span>}\n {trailingIcon && (\n <span className=\"eds-btn__icon\" aria-hidden>\n {trailingIcon}\n </span>\n )}\n </button>\n );\n }\n);\n\nexport default Button;\n\n// ---------------------------------------------------------------------------\n// ButtonMatrix — renders every Variant × Kind × Size combination, with two\n// rows showing Default + Disabled. Hover and Focus are real browser states,\n// so they only trigger when you mouse over or tab to a button.\n// ---------------------------------------------------------------------------\nconst VARIANTS: ButtonVariant[] = [\"Primary\", \"Destructive\", \"Inverse\"];\nconst KINDS: ButtonKind[] = [\"Filled\", \"Outlined\", \"Text\"];\nconst SIZES: ButtonSize[] = [\"Large\", \"Medium\", \"Small\"];\n\n/**\n * Embleema icon set ports. SVG path data was extracted directly from the\n * Icons page (node 18:451) of the Design System 2.0 Figma file:\n * - Icon/Action/Add — node 4052:2912 (vector at 4052:2913)\n * - Icon/Navigation/ArrowRight — node 4052:2944 (vector at 4052:2945)\n * Both icons live inside a 24×24 component frame in Figma; the vector\n * itself is 18×18 (Add) / 20×20 (ArrowRight), positioned at offset 3,3\n * (Add) / 2,2 (ArrowRight) inside the frame. The translate keeps the\n * react-rendered icons visually identical to the Figma source.\n */\nexport function IconAdd() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(3 3)\">\n <path d=\"M7.962 10.038H1.038C0.744 10.038 0.498 9.939 0.299 9.74C0.1 9.541 0 9.294 0 9C0 8.705 0.1 8.459 0.299 8.26C0.498 8.061 0.744 7.962 1.038 7.962H7.962V1.038C7.962 0.744 8.061 0.498 8.26 0.299C8.459 0.1 8.706 0 9 0C9.295 0 9.541 0.1 9.74 0.299C9.939 0.498 10.038 0.744 10.038 1.038V7.962H16.962C17.256 7.962 17.502 8.061 17.701 8.26C17.9 8.459 18 8.706 18 9C18 9.295 17.9 9.541 17.701 9.74C17.502 9.939 17.256 10.038 16.962 10.038H10.038V16.962C10.038 17.256 9.939 17.502 9.74 17.701C9.541 17.9 9.294 18 9 18C8.705 18 8.459 17.9 8.26 17.701C8.061 17.502 7.962 17.256 7.962 16.962V10.038Z\" />\n </g>\n </svg>\n );\n}\n\nexport function IconArrowRight() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2)\">\n <path d=\"M16.586 11.118H1.026C0.735 11.118 0.491 11.017 0.295 10.817C0.098 10.616 0 10.367 0 10.069C0 9.771 0.098 9.522 0.295 9.321C0.491 9.12 0.735 9.02 1.026 9.02H16.586L9.516 1.789C9.313 1.581 9.212 1.338 9.215 1.059C9.218 0.78 9.325 0.532 9.537 0.315C9.749 0.112 9.99 0.008 10.258 0C10.526 -0.007 10.766 0.098 10.979 0.315L19.65 9.184C19.778 9.315 19.869 9.453 19.921 9.598C19.974 9.743 20 9.9 20 10.069C20 10.237 19.974 10.394 19.921 10.54C19.869 10.685 19.778 10.823 19.65 10.954L10.979 19.823C10.789 20.016 10.555 20.115 10.275 20.12C9.995 20.124 9.749 20.025 9.537 19.823C9.325 19.606 9.219 19.356 9.219 19.075C9.219 18.793 9.325 18.544 9.537 18.327L16.586 11.118Z\" />\n </g>\n </svg>\n );\n}\n\nexport function ButtonMatrix() {\n ensureStyles();\n\n const renderRow = (variant: ButtonVariant) => (\n <>\n <p className=\"eds-btn-matrix__heading\">{variant} · Default</p>\n {SIZES.map((size) => (\n <div key={`${variant}-${size}-d`} className=\"eds-btn-matrix__row\">\n {KINDS.map((kind) => (\n <Button\n key={kind}\n variant={variant}\n kind={kind}\n size={size}\n leadingIcon={<IconAdd />}\n trailingIcon={<IconArrowRight />}\n >\n {kind} {size}\n </Button>\n ))}\n </div>\n ))}\n <p className=\"eds-btn-matrix__heading\">{variant} · Disabled</p>\n {SIZES.map((size) => (\n <div key={`${variant}-${size}-x`} className=\"eds-btn-matrix__row\">\n {KINDS.map((kind) => (\n <Button key={kind} variant={variant} kind={kind} size={size} disabled>\n {kind} {size}\n </Button>\n ))}\n </div>\n ))}\n </>\n );\n\n return (\n <div className=\"eds-btn-matrix\">\n {VARIANTS.filter((v) => v !== \"Inverse\").map((variant) => (\n <section key={variant} className=\"eds-btn-matrix__section\">\n {renderRow(variant)}\n </section>\n ))}\n\n {/* Inverse renders on a dark surface so the white treatments read. */}\n <section className=\"eds-btn-matrix__section\">\n <div className=\"eds-btn-matrix__inverse\">{renderRow(\"Inverse\")}</div>\n </section>\n </div>\n );\n}\n","/**\n * Alert — React port of Embleema Design System 2.0's Feedback/Alert\n * component (Figma node 4668:4909). Per-type background, leading icon, and\n * icon fill are pulled directly from the live Figma extraction.\n *\n * Five types: Success, Information, AI, Warning, Error. Each has:\n * - Background fill (Feedback/{Type}/Background) — AI is a special stack:\n * solid white with Gradient/AI overlaid at 40% opacity.\n * - Accent color (Feedback/{Type}/Text) used for the icon and the action\n * button text. AI uses the Gradient/AI as the icon fill.\n * - Type-specific leading icon (24×24): Check / Info / Sparkles /\n * Warning triangle / Close-circle.\n * - No border — Figma alerts are borderless.\n *\n * Props:\n * - type : Success | Information | AI | Warning | Error\n * - title : optional bold first line\n * - message : body text (or use children for richer content)\n * - closeButton : show the X (default true). Color: Text/Secondary.\n * - actionButton : show a text-link action (default false)\n * - actionLabel : label for the action button (default \"View\")\n * - onActionClick : action callback\n * - onClose : dismiss callback\n * - visible : controlled visibility\n * - defaultVisible: uncontrolled initial visibility (default true)\n */\n\nimport * as React from \"react\";\nimport { Button } from \"./Button\";\n\nexport type AlertType =\n | \"Success\"\n | \"Information\"\n | \"AI\"\n | \"Warning\"\n | \"Error\";\n\nexport type AlertProps = {\n type?: AlertType;\n title?: string;\n message?: string;\n children?: React.ReactNode;\n closeButton?: boolean;\n actionButton?: boolean;\n actionLabel?: string;\n onActionClick?: () => void;\n onClose?: () => void;\n visible?: boolean;\n defaultVisible?: boolean;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --alert-success-bg: #D7F3D7;\n --alert-success-accent: #288028;\n --alert-info-bg: #E3ECFF;\n --alert-info-accent: #2655BA;\n --alert-warning-bg: #FFE6D5;\n --alert-warning-accent: #E15A00;\n --alert-error-bg: #FFE2E2;\n --alert-error-accent: #B31A1A;\n --alert-ai-accent: #6F59CF;\n --alert-text-primary: #0E0E0E;\n --alert-text-secondary: #5E5E5E;\n}\n\n.eds-alert {\n --alert-bg: var(--alert-success-bg);\n --alert-accent: var(--alert-success-accent);\n\n display: flex;\n align-items: flex-start;\n gap: 12px;\n padding: 8px 12px;\n border-radius: 8px;\n background: var(--alert-bg);\n /* No border — Figma alerts are borderless, distinction comes from the\n background tint and the leading icon. */\n border: none;\n font-family: Nunito, sans-serif;\n color: var(--alert-text-primary);\n box-sizing: border-box;\n width: 100%;\n max-width: 668px;\n}\n.eds-alert[data-type=\"Success\"] {\n --alert-bg: var(--alert-success-bg);\n --alert-accent: var(--alert-success-accent);\n}\n.eds-alert[data-type=\"Information\"] {\n --alert-bg: var(--alert-info-bg);\n --alert-accent: var(--alert-info-accent);\n}\n.eds-alert[data-type=\"Warning\"] {\n --alert-bg: var(--alert-warning-bg);\n --alert-accent: var(--alert-warning-accent);\n}\n.eds-alert[data-type=\"Error\"] {\n --alert-bg: var(--alert-error-bg);\n --alert-accent: var(--alert-error-accent);\n}\n/* AI — solid white base with Gradient/AI (#90B3FF → #6F59CF, vertical, stop\n at ~79%) layered on top at 40% paint opacity. Stacking via two backgrounds\n in one declaration: the gradient (semi-transparent via per-stop alpha) is\n listed first so it sits on top of the white. */\n.eds-alert[data-type=\"AI\"] {\n --alert-accent: var(--alert-ai-accent);\n background:\n linear-gradient(\n to bottom,\n rgba(144, 179, 255, 0.4) 0%,\n rgba(111, 89, 207, 0.4) 79%\n ),\n #FEFEFE;\n}\n\n.eds-alert__icon {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--alert-accent);\n margin-top: 10px; /* aligns visually with the body text */\n}\n.eds-alert__icon svg { width: 100%; height: 100%; display: block; }\n\n.eds-alert__body {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 2px;\n padding: 10px 0;\n font-size: 16px;\n line-height: 150%;\n font-weight: 400;\n color: var(--alert-text-primary);\n}\n.eds-alert__title {\n font-weight: 600;\n}\n\n/* Action button — uses the shared Action/Button component\n (Variant=Primary, Type=Filled, Size=Small). Centered vertically within\n the alert so it stays aligned with the close icon as the alert grows. */\n.eds-alert__action-btn {\n align-self: center;\n flex-shrink: 0;\n margin: 0 4px;\n}\n\n/* Close — Text/Secondary (#5E5E5E), independent of the alert's accent.\n Centered vertically alongside the action button. */\n.eds-alert__close {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n border: none;\n background: transparent;\n cursor: pointer;\n padding: 0;\n align-self: center;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--alert-text-secondary);\n border-radius: 4px;\n transition: background-color 120ms ease-out;\n}\n.eds-alert__close:hover {\n background: rgba(0, 0, 0, 0.06);\n}\n.eds-alert__close:focus-visible {\n outline: 2px solid var(--alert-text-secondary);\n outline-offset: 1px;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-alert-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 24px;\n background: #FEFEFE;\n}\n.eds-alert-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-alert-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-alert-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-alert-matrix__list { display: flex; flex-direction: column; gap: 12px; }\n.eds-alert-matrix__restore {\n align-self: flex-start;\n padding: 6px 12px;\n background: transparent;\n border: 1px solid #DDDDDD;\n border-radius: 4px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 14px;\n color: #306AE8;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-alert]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-alert\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — exact vectors extracted from the live Figma file (file key\n// 1mno96R4R0afWIQQIq8w0F) via MCP. Each glyph keeps its native viewBox and is\n// translated inside a 24×24 frame to match the Figma inset, so geometry stays\n// pixel-accurate to the source.\n// Success → Icon/Status/Check (node 4052:2995)\n// Information → Icon/Status/Info (node 4052:3158)\n// AI → Icon/Status/ArtificialIntelligence (node 4052:2950)\n// Warning → Icon/Status/Alert (node 4052:2918)\n// Error → Icon/Action/CloseCircle (node 4052:3036)\n// ---------------------------------------------------------------------------\nfunction CheckIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 5)\">\n <path\n fill=\"currentColor\"\n d=\"M6.72489 11.8595L18.2793 0.305087C18.4781 0.106016 18.7108 0.00436262 18.9774 0.000127067C19.2441 -0.00410849 19.4811 0.0975446 19.6887 0.305087C19.8962 0.512629 20 0.750935 20 1.02C20 1.2893 19.8962 1.52771 19.6887 1.73525L7.57122 13.8735C7.32934 14.1151 7.04723 14.2359 6.72489 14.2359C6.40254 14.2359 6.12043 14.1151 5.87856 13.8735L0.294313 8.28922C0.0954648 8.09014 -0.00262182 7.85384 5.32649e-05 7.58032C0.00250543 7.30701 0.107502 7.06659 0.315045 6.85905C0.522587 6.6515 0.760892 6.54773 1.02996 6.54773C1.29925 6.54773 1.53767 6.6515 1.74521 6.85905L6.72489 11.8595Z\"\n />\n </g>\n </svg>\n );\n}\nfunction InfoIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10.0003 15C10.2241 15 10.4116 14.9243 10.5626 14.7729C10.7139 14.6217 10.7895 14.4342 10.7895 14.2105V9.73684C10.7895 9.51316 10.7138 9.32561 10.5624 9.17421C10.411 9.02298 10.2234 8.94737 9.99974 8.94737C9.77588 8.94737 9.58842 9.02298 9.43737 9.17421C9.28614 9.32561 9.21053 9.51316 9.21053 9.73684V14.2105C9.21053 14.4342 9.28623 14.6217 9.43763 14.7729C9.58904 14.9243 9.77658 15 10.0003 15ZM10 7.14579C10.2409 7.14579 10.4428 7.0643 10.6058 6.90132C10.7688 6.73833 10.8503 6.5364 10.8503 6.29553C10.8503 6.05465 10.7688 5.85272 10.6058 5.68974C10.4428 5.52693 10.2409 5.44553 10 5.44553C9.75912 5.44553 9.55719 5.52693 9.39421 5.68974C9.23123 5.85272 9.14974 6.05465 9.14974 6.29553C9.14974 6.5364 9.23123 6.73833 9.39421 6.90132C9.55719 7.0643 9.75912 7.14579 10 7.14579ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\nfunction AIIcon() {\n // Three-sparkle cluster (one large, two small) with the Gradient/AI fill\n // (#90B3FF → #6F59CF, vertical, stop at 79%).\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <defs>\n <linearGradient id=\"eds-alert-ai-grad\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop offset=\"0%\" stopColor=\"#90B3FF\" />\n <stop offset=\"79%\" stopColor=\"#6F59CF\" />\n </linearGradient>\n </defs>\n <g transform=\"translate(4.0008 0)\">\n <path\n fill=\"url(#eds-alert-ai-grad)\"\n d=\"M5.85325 5.88724L6.37928 7.34896C6.9643 8.97127 8.24172 10.2486 9.86399 10.8337L11.3257 11.3597C11.4576 11.4072 11.4576 11.594 11.3257 11.6416L9.86399 12.1676C8.24168 12.7526 6.96432 14.03 6.37928 15.6523L5.85325 17.114C5.80573 17.2459 5.61892 17.2459 5.5714 17.114L5.04537 15.6523C4.46035 14.03 3.18293 12.7526 1.56066 12.1676L0.0989369 11.6416C-0.032979 11.594 -0.032979 11.4072 0.0989369 11.3597L1.56066 10.8337C3.18296 10.2487 4.46033 8.97123 5.04537 7.34896L5.5714 5.88724C5.61892 5.7545 5.80573 5.7545 5.85325 5.88724Z\"\n />\n <path\n fill=\"url(#eds-alert-ai-grad)\"\n d=\"M12.4335 0.0510043L12.7006 0.790876C12.9972 1.61187 13.6436 2.25915 14.4655 2.55578L15.2053 2.82288C15.2725 2.84746 15.2725 2.94169 15.2053 2.96545L14.4655 3.23255C13.6445 3.52916 12.9972 4.17562 12.7006 4.99746L12.4335 5.73733C12.4089 5.80452 12.3147 5.80452 12.2909 5.73733L12.0238 4.99746C11.7272 4.17646 11.0807 3.52918 10.2589 3.23255L9.51901 2.96545C9.45183 2.94087 9.45183 2.84664 9.51901 2.82288L10.2589 2.55578C11.0799 2.25917 11.7272 1.61271 12.0238 0.790876L12.2909 0.0510043C12.3147 -0.0170014 12.4097 -0.0170014 12.4335 0.0510043Z\"\n />\n <path\n fill=\"url(#eds-alert-ai-grad)\"\n d=\"M12.4335 17.2633L12.7006 18.0032C12.9972 18.8242 13.6436 19.4714 14.4655 19.7681L15.2053 20.0352C15.2725 20.0597 15.2725 20.154 15.2053 20.1777L14.4655 20.4448C13.6445 20.7414 12.9972 21.3879 12.7006 22.2097L12.4335 22.9496C12.4089 23.0168 12.3147 23.0168 12.2909 22.9496L12.0238 22.2097C11.7272 21.3887 11.0807 20.7415 10.2589 20.4448L9.51901 20.1777C9.45183 20.1532 9.45183 20.0589 9.51901 20.0352L10.2589 19.7681C11.0799 19.4715 11.7272 18.825 12.0238 18.0032L12.2909 17.2633C12.3147 17.1961 12.4097 17.1961 12.4335 17.2633Z\"\n />\n </g>\n </svg>\n );\n}\nfunction WarningIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2)\">\n <path\n fill=\"currentColor\"\n d=\"M10 14.9797C10.2409 14.9797 10.4428 14.8982 10.6058 14.7353C10.7688 14.5723 10.8503 14.3704 10.8503 14.1295C10.8503 13.8886 10.7688 13.6867 10.6058 13.5237C10.4428 13.3609 10.2409 13.2795 10 13.2795C9.75912 13.2795 9.55719 13.3609 9.39421 13.5237C9.23123 13.6867 9.14974 13.8886 9.14974 14.1295C9.14974 14.3704 9.23123 14.5723 9.39421 14.7353C9.55719 14.8982 9.75912 14.9797 10 14.9797ZM10.0003 11.1337C10.2241 11.1337 10.4116 11.058 10.5626 10.9066C10.7139 10.7554 10.7895 10.5679 10.7895 10.3442V5.60737C10.7895 5.38368 10.7138 5.19614 10.5624 5.04474C10.411 4.89351 10.2234 4.8179 9.99974 4.8179C9.77588 4.8179 9.58842 4.89351 9.43737 5.04474C9.28614 5.19614 9.21053 5.38368 9.21053 5.60737V10.3442C9.21053 10.5679 9.28623 10.7554 9.43763 10.9066C9.58904 11.058 9.77658 11.1337 10.0003 11.1337ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\nfunction CloseCircleIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10 11.1092L13.2347 14.3442C13.3805 14.4898 13.5638 14.5644 13.7845 14.5679C14.005 14.5712 14.1916 14.4967 14.3442 14.3442C14.4967 14.1916 14.5729 14.0067 14.5729 13.7895C14.5729 13.5723 14.4967 13.3874 14.3442 13.2347L11.1092 10L14.3442 6.76526C14.4898 6.61947 14.5644 6.43623 14.5679 6.21553C14.5712 5.995 14.4967 5.80842 14.3442 5.65579C14.1916 5.50333 14.0067 5.4271 13.7895 5.4271C13.5723 5.4271 13.3874 5.50333 13.2347 5.65579L10 8.89079L6.76526 5.65579C6.61947 5.51018 6.43623 5.43561 6.21553 5.4321C5.995 5.42877 5.80842 5.50333 5.65579 5.65579C5.50333 5.80842 5.42711 5.99333 5.42711 6.21053C5.42711 6.42772 5.50333 6.61263 5.65579 6.76526L8.89079 10L5.65579 13.2347C5.51018 13.3805 5.43561 13.5638 5.43211 13.7845C5.42877 14.005 5.50333 14.1916 5.65579 14.3442C5.80842 14.4967 5.99333 14.5729 6.21053 14.5729C6.42772 14.5729 6.61263 14.4967 6.76526 14.3442L10 11.1092ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\nfunction CloseGlyph() {\n return (\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\" />\n </svg>\n );\n}\n\nconst ICON_BY_TYPE: Record<AlertType, React.ComponentType> = {\n Success: CheckIcon,\n Information: InfoIcon,\n AI: AIIcon,\n Warning: WarningIcon,\n Error: CloseCircleIcon,\n};\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n function Alert(\n {\n type = \"Information\",\n title,\n message,\n children,\n closeButton = true,\n actionButton = false,\n actionLabel = \"View\",\n onActionClick,\n onClose,\n visible,\n defaultVisible = true,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = visible !== undefined;\n const [internalVisible, setInternalVisible] = React.useState(defaultVisible);\n const isVisible = isControlled ? !!visible : internalVisible;\n\n if (!isVisible) return null;\n\n const Icon = ICON_BY_TYPE[type];\n const wrapperClass = \"eds-alert\" + (className ? ` ${className}` : \"\");\n\n const handleClose = () => {\n if (!isControlled) setInternalVisible(false);\n onClose?.();\n };\n\n return (\n <div\n ref={ref}\n className={wrapperClass}\n data-type={type}\n role=\"alert\"\n aria-label={ariaLabel ?? `${type} alert`}\n >\n <span className=\"eds-alert__icon\" aria-hidden>\n <Icon />\n </span>\n <div className=\"eds-alert__body\">\n {title && <span className=\"eds-alert__title\">{title}</span>}\n {children ?? (message ? <span>{message}</span> : null)}\n </div>\n {actionButton && (\n <Button\n variant=\"Primary\"\n kind=\"Filled\"\n size=\"Small\"\n onClick={onActionClick}\n className=\"eds-alert__action-btn\"\n >\n {actionLabel}\n </Button>\n )}\n {closeButton && (\n <button\n type=\"button\"\n className=\"eds-alert__close\"\n onClick={handleClose}\n aria-label=\"Dismiss alert\"\n >\n <CloseGlyph />\n </button>\n )}\n </div>\n );\n }\n);\n\nexport default Alert;\n\n// ---------------------------------------------------------------------------\n// AlertMatrix\n// ---------------------------------------------------------------------------\nconst TYPES: AlertType[] = [\n \"Success\",\n \"Information\",\n \"AI\",\n \"Warning\",\n \"Error\",\n];\n\nconst MESSAGE_BY_TYPE: Record<AlertType, string> = {\n Success: \"Form saved successfully.\",\n Information:\n \"This is an informational message. Use it to share context without alarming the user.\",\n AI: \"Suggested by AI based on similar past entries. Review before submitting.\",\n Warning: \"You have unsaved changes. They will be lost if you navigate away.\",\n Error: \"Something went wrong. Try again or contact support.\",\n};\n\nexport function AlertMatrix() {\n ensureStyles();\n const [resetKey, setResetKey] = React.useState(0);\n\n return (\n <div className=\"eds-alert-matrix\">\n <section className=\"eds-alert-matrix__section\">\n <h3 className=\"eds-alert-matrix__heading\">Interactive · dismissible</h3>\n <p className=\"eds-alert-matrix__sub\">\n Click the X to dismiss. Restore button below resets the component.\n </p>\n <Alert\n key={resetKey}\n type=\"Information\"\n title=\"Welcome\"\n message=\"Click the X to dismiss this alert. Use the Restore button to bring it back.\"\n />\n <button\n type=\"button\"\n className=\"eds-alert-matrix__restore\"\n onClick={() => setResetKey((k) => k + 1)}\n >\n Restore alert\n </button>\n </section>\n\n <section className=\"eds-alert-matrix__section\">\n <h3 className=\"eds-alert-matrix__heading\">All types · close + action</h3>\n <div className=\"eds-alert-matrix__list\">\n {TYPES.map((type) => (\n <Alert\n key={type}\n type={type}\n title={type}\n message={MESSAGE_BY_TYPE[type]}\n actionButton\n actionLabel=\"View\"\n onActionClick={() => {\n /* demo only */\n }}\n visible\n onClose={() => {\n /* no-op in matrix */\n }}\n />\n ))}\n </div>\n </section>\n\n <section className=\"eds-alert-matrix__section\">\n <h3 className=\"eds-alert-matrix__heading\">Boolean toggles</h3>\n <p className=\"eds-alert-matrix__sub\">CloseButton: on / off; ActionButton: on / off</p>\n <Alert type=\"Success\" message=\"Just close.\" visible />\n <Alert\n type=\"Warning\"\n message=\"Close + action.\"\n actionButton\n actionLabel=\"Undo\"\n visible\n />\n <Alert\n type=\"Error\"\n message=\"No close, just action.\"\n closeButton={false}\n actionButton\n actionLabel=\"Retry\"\n visible\n />\n <Alert\n type=\"AI\"\n message=\"No close, no action — purely informational.\"\n closeButton={false}\n visible\n />\n </section>\n </div>\n );\n}\n","/**\n * Badge — React port of Embleema Design System 2.0's Feedback/Badge component\n * (Figma node 4860:38).\n *\n * Notification indicator for counts, status, or alerts anchored to nav items,\n * tabs, or avatars. Three sizes × five semantic types.\n *\n * Sizes:\n * - Dot → 6 × 6 solid circle, no content. Use for \"unread\" indicators.\n * - Count → 16 × variable pill, numeric label (Nunito Bold 10/12). Falls\n * back to \"3\" if no `label` is supplied (matches Figma default).\n * - Icon → 16 × 16 circle with a 12 × 12 icon centered. Defaults to the\n * Status/Alert glyph; pass a custom React node via `icon` to swap.\n *\n * Types (background colors):\n * - Default → Action/Primary/Background (#306AE8) [semantic]\n * - Error → Feedback/Error/Text (#B31A1A) [semantic]\n * - Warning → Feedback/Warning/Text (#E15A00) [semantic]\n * - Success → Feedback/Success/Text (#288028) [semantic]\n * - Neutral → Text/Secondary (#5E5E5E) [semantic]\n *\n * Foreground (count text + icon fill) is always Text/Inverse (#FEFEFE).\n *\n * Props:\n * - size : Dot | Count | Icon\n * - type : Default | Error | Warning | Success | Neutral\n * - label : string or number — only rendered for size=Count\n * - icon : React node — only rendered for size=Icon; defaults to the\n * Status/Alert glyph from the icon library\n */\n\nimport * as React from \"react\";\n\nexport type BadgeSize = \"Dot\" | \"Count\" | \"Icon\";\nexport type BadgeType =\n | \"Default\"\n | \"Error\"\n | \"Warning\"\n | \"Success\"\n | \"Neutral\";\n\nexport type BadgeProps = {\n size?: BadgeSize;\n type?: BadgeType;\n label?: string | number;\n icon?: React.ReactNode;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — color tokens come directly from the Figma extraction. All five\n// semantic types map to existing semantic aliases in the design system, so\n// there are no primitive fallbacks here (unlike Tag, which uses Teal/400 and\n// Pink/400 directly).\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@600&display=swap\");\n\n:root {\n --badge-text-inverse: #FEFEFE;\n --badge-action-primary: #306AE8;\n --badge-feedback-error: #B31A1A;\n --badge-feedback-warning: #E15A00;\n --badge-feedback-success: #288028;\n --badge-text-secondary: #5E5E5E;\n}\n\n.eds-badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 999px;\n background: var(--badge-bg, var(--badge-action-primary));\n color: var(--badge-text-inverse);\n font-family: Nunito, sans-serif;\n font-weight: 600;\n line-height: 12px;\n box-sizing: border-box;\n user-select: none;\n}\n\n/* ---------- Per-type backgrounds ---------- */\n.eds-badge[data-type=\"Default\"] { --badge-bg: var(--badge-action-primary); }\n.eds-badge[data-type=\"Error\"] { --badge-bg: var(--badge-feedback-error); }\n.eds-badge[data-type=\"Warning\"] { --badge-bg: var(--badge-feedback-warning); }\n.eds-badge[data-type=\"Success\"] { --badge-bg: var(--badge-feedback-success); }\n.eds-badge[data-type=\"Neutral\"] { --badge-bg: var(--badge-text-secondary); }\n\n/* ---------- Dot ---------- */\n.eds-badge[data-size=\"Dot\"] {\n width: 6px;\n height: 6px;\n min-width: 6px;\n padding: 0;\n font-size: 0; /* no children, but suppress any stray text */\n}\n\n/* ---------- Count ---------- */\n.eds-badge[data-size=\"Count\"] {\n width: 16px;\n min-width: 14px;\n padding: 2px 4px;\n font-size: 10px;\n text-align: center;\n}\n\n/* ---------- Icon ---------- */\n.eds-badge[data-size=\"Icon\"] {\n width: 16px;\n height: 16px;\n min-width: 16px;\n padding: 0;\n overflow: hidden;\n}\n.eds-badge__icon {\n width: 12px;\n height: 12px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--badge-text-inverse);\n}\n.eds-badge__icon svg { display: block; width: 100%; height: 100%; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-badge-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-badge-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-badge-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-badge-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-badge-matrix__grid {\n display: grid;\n grid-template-columns: 100px repeat(5, minmax(80px, 1fr));\n gap: 0;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n overflow: hidden;\n align-items: stretch;\n}\n.eds-badge-matrix__cell {\n border-right: 1px solid #EEEEEE;\n border-bottom: 1px solid #EEEEEE;\n background: #FEFEFE;\n min-height: 56px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.eds-badge-matrix__cell:last-child { border-right: none; }\n.eds-badge-matrix__cell--head {\n background: #F8F8F8;\n padding: 8px 12px;\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-badge-matrix__anchor {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n border-radius: 8px;\n background: #F1F1F1;\n color: #5E5E5E;\n font-weight: 600;\n font-size: 14px;\n}\n.eds-badge-matrix__anchor .eds-badge {\n position: absolute;\n top: -4px;\n right: -4px;\n}\n.eds-badge-matrix__row {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 16px;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-badge]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-badge\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Default Icon glyph — Status/Alert (Figma node 4052:2918). Same path used in\n// Alert (Warning type). Translated inside a 24-viewBox to match Figma's\n// 8.33% inset; then scaled down to fit the 12×12 inner slot.\n// ---------------------------------------------------------------------------\nfunction AlertGlyph() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2)\">\n <path\n fill=\"currentColor\"\n d=\"M10 14.9797C10.2409 14.9797 10.4428 14.8982 10.6058 14.7353C10.7688 14.5723 10.8503 14.3704 10.8503 14.1295C10.8503 13.8886 10.7688 13.6867 10.6058 13.5237C10.4428 13.3609 10.2409 13.2795 10 13.2795C9.75912 13.2795 9.55719 13.3609 9.39421 13.5237C9.23123 13.6867 9.14974 13.8886 9.14974 14.1295C9.14974 14.3704 9.23123 14.5723 9.39421 14.7353C9.55719 14.8982 9.75912 14.9797 10 14.9797ZM10.0003 11.1337C10.2241 11.1337 10.4116 11.058 10.5626 10.9066C10.7139 10.7554 10.7895 10.5679 10.7895 10.3442V5.60737C10.7895 5.38368 10.7138 5.19614 10.5624 5.04474C10.411 4.89351 10.2234 4.8179 9.99974 4.8179C9.77588 4.8179 9.58842 4.89351 9.43737 5.04474C9.28614 5.19614 9.21053 5.38368 9.21053 5.60737V10.3442C9.21053 10.5679 9.28623 10.7554 9.43763 10.9066C9.58904 11.058 9.77658 11.1337 10.0003 11.1337ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction defaultAriaLabel(size: BadgeSize, type: BadgeType, label?: string | number) {\n if (size === \"Count\") return `${label ?? \"\"} notifications`;\n if (size === \"Icon\") return `${type} alert`;\n return `${type} indicator`;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n function Badge(\n {\n size = \"Dot\",\n type = \"Default\",\n label,\n icon,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const wrapperClass = \"eds-badge\" + (className ? ` ${className}` : \"\");\n const finalAriaLabel = ariaLabel ?? defaultAriaLabel(size, type, label);\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-size={size}\n data-type={type}\n role=\"status\"\n aria-label={finalAriaLabel}\n >\n {size === \"Count\" && <span>{label ?? \"3\"}</span>}\n {size === \"Icon\" && (\n <span className=\"eds-badge__icon\" aria-hidden>\n {icon ?? <AlertGlyph />}\n </span>\n )}\n </span>\n );\n }\n);\n\nexport default Badge;\n\n// ---------------------------------------------------------------------------\n// BadgeMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst TYPES: BadgeType[] = [\n \"Default\",\n \"Error\",\n \"Warning\",\n \"Success\",\n \"Neutral\",\n];\nconst SIZES: BadgeSize[] = [\"Dot\", \"Count\", \"Icon\"];\n\nexport function BadgeMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-badge-matrix\">\n <section className=\"eds-badge-matrix__section\">\n <h3 className=\"eds-badge-matrix__heading\">Size × Type</h3>\n <p className=\"eds-badge-matrix__sub\">\n Backgrounds bind to semantic feedback tokens (Action/Primary,\n Feedback/Error/Warning/Success, Text/Secondary). Foreground is\n always Text/Inverse.\n </p>\n <div className=\"eds-badge-matrix__grid\">\n <div className=\"eds-badge-matrix__cell eds-badge-matrix__cell--head\">\n Size\n </div>\n {TYPES.map((t) => (\n <div\n key={t}\n className=\"eds-badge-matrix__cell eds-badge-matrix__cell--head\"\n >\n {t}\n </div>\n ))}\n {SIZES.map((s) => (\n <React.Fragment key={s}>\n <div className=\"eds-badge-matrix__cell eds-badge-matrix__cell--head\">\n {s}\n </div>\n {TYPES.map((t) => (\n <div key={`${s}-${t}`} className=\"eds-badge-matrix__cell\">\n <Badge size={s} type={t} label={s === \"Count\" ? 3 : undefined} />\n </div>\n ))}\n </React.Fragment>\n ))}\n </div>\n </section>\n\n <section className=\"eds-badge-matrix__section\">\n <h3 className=\"eds-badge-matrix__heading\">Count label values</h3>\n <p className=\"eds-badge-matrix__sub\">\n Label accepts a string or number. For larger counts, format the\n label yourself (e.g. \"9+\") since the badge's default width is fixed.\n </p>\n <div className=\"eds-badge-matrix__row\">\n {[1, 3, 9, \"12\", \"99\", \"9+\"].map((n) => (\n <Badge key={String(n)} size=\"Count\" type=\"Default\" label={n} />\n ))}\n </div>\n </section>\n\n <section className=\"eds-badge-matrix__section\">\n <h3 className=\"eds-badge-matrix__heading\">Anchored to a target</h3>\n <p className=\"eds-badge-matrix__sub\">\n The intended use: anchored to the top-right of a nav item, tab, or\n avatar. Position via the parent (here using <code>absolute</code>{\" \"}\n inside a <code>position: relative</code> anchor).\n </p>\n <div className=\"eds-badge-matrix__row\">\n {TYPES.map((t) => (\n <span key={t} className=\"eds-badge-matrix__anchor\" aria-label=\"Inbox\">\n <span aria-hidden>!</span>\n <Badge size=\"Dot\" type={t} />\n </span>\n ))}\n {TYPES.map((t) => (\n <span key={`c-${t}`} className=\"eds-badge-matrix__anchor\" aria-label=\"Inbox\">\n <span aria-hidden>#</span>\n <Badge size=\"Count\" type={t} label={3} />\n </span>\n ))}\n {TYPES.map((t) => (\n <span key={`i-${t}`} className=\"eds-badge-matrix__anchor\" aria-label=\"Inbox\">\n <span aria-hidden>!</span>\n <Badge size=\"Icon\" type={t} />\n </span>\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Field — React port of Embleema Design System 2.0's Input/Field (base atom)\n * component (Figma node 4127:5556). This is the visual shell that wraps an\n * input, leading/trailing icons, and an optional inline button.\n *\n * Props:\n * - state : Default | Hover | Focused | Pressed | Disabled | ReadOnly\n * When omitted, browser pseudo-classes (:hover, :focus-within)\n * drive Hover/Focused automatically. The Pressed/Disabled/\n * ReadOnly forms can also be passed as `state` to force them\n * for previews — but `disabled` and `readOnly` HTML attrs\n * are also supported and produce the same look.\n * - validation : None | Error | Warning | Success | AI\n * - appearance : Filled | Outlined (renamed from Figma's \"Style\" to avoid\n * collision with React's reserved `style` prop)\n * - leadingIcon : React node rendered to the left of the input\n * - trailingIcon: React node rendered to the right (after the inline button)\n * - inlineButton: React node rendered between input and trailing icon\n *\n * Sizes/structure match the Figma source: 12 px padding all sides, 4 px gap,\n * 4 px border radius, 20×20 icon slots, body/md-light typography.\n */\n\nimport * as React from \"react\";\n\nexport type FieldState =\n | \"Default\"\n | \"Hover\"\n | \"Focused\"\n | \"Pressed\"\n | \"Disabled\"\n | \"ReadOnly\";\nexport type FieldValidation = \"None\" | \"Error\" | \"Warning\" | \"Success\" | \"AI\";\nexport type FieldAppearance = \"Filled\" | \"Outlined\";\n\nexport type FieldProps = {\n state?: FieldState;\n validation?: FieldValidation;\n appearance?: FieldAppearance;\n leadingIcon?: React.ReactNode;\n trailingIcon?: React.ReactNode;\n inlineButton?: React.ReactNode;\n placeholder?: string;\n value?: string;\n defaultValue?: string;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n disabled?: boolean;\n readOnly?: boolean;\n className?: string;\n id?: string;\n name?: string;\n type?: \"text\" | \"email\" | \"password\" | \"number\" | \"tel\" | \"url\" | \"search\";\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — colors mirror the live Figma extraction for the Field base atom.\n// CSS custom properties on the wrapper are toggled by [data-state],\n// [data-validation], and [data-appearance] attributes, so styles cascade\n// cleanly without combinatorial-rule explosion.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n /* Semantic tokens used by the Field matrix */\n --field-background-default: #FEFEFE;\n --field-background-field: #F8F8F8;\n --field-background-primary: #F8F8F8;\n --field-background-disabled: #F1F1F1;\n --field-border-default: #DDDDDD;\n --field-border-strong: #848484;\n --field-border-subtle: #F1F1F1;\n --field-border-focus: #306AE8;\n --field-border-focus-ring: #A2BDF5;\n --field-border-error: #E02020;\n --field-feedback-error-background: #FFE2E2;\n --field-feedback-warning-indicator: #FA6400;\n --field-feedback-success-indicator: #32A032;\n --field-action-secondary-text: #306AE8;\n --field-action-primary-background: #306AE8;\n --field-text-primary: #0E0E0E;\n --field-text-placeholder: #848484;\n --field-text-disabled: #848484;\n\n /* Gradient/AI — light blue (#90B3FF) → violet (#6F59CF). Two flavors:\n -ai: vertical, matching Figma's gradientTransform direction. Used as the\n rectangular border on AI Filled (renders the full transition on\n the four-sided border).\n -ai-h: horizontal. Used on the AI Outlined underline strip, where a\n vertical gradient on a 2 px tall band would sample only one\n slice of the gradient and read as a single color. */\n --field-gradient-ai: linear-gradient(to bottom, #90B3FF 0%, #6F59CF 79%);\n --field-gradient-ai-h: linear-gradient(to right, #90B3FF 0%, #6F59CF 100%);\n\n /* AI glow — CSS box-shadow can't take a gradient, so we approximate the\n Gradient/AI stops with two stacked shadows: light blue on top, violet on\n the bottom. Replaces the original solid purple drop-shadow so the glow\n reads as the same gradient as the border. */\n --field-ai-glow:\n 0 -3px 6px 0 rgba(144, 179, 255, 0.5),\n 0 3px 6px 0 rgba(111, 89, 207, 0.5);\n}\n\n.eds-field-wrap {\n --eds-bg: transparent;\n --eds-border: var(--field-border-default);\n --eds-border-width: 1px;\n --eds-border-image: none;\n --eds-ring: 0 0 0 0 transparent;\n --eds-ai-glow: 0 0 0 0 transparent;\n /* Default off. Filled opts in to Elevation/100 below; Outlined never lifts;\n Disabled and ReadOnly stay flat in either appearance. */\n --eds-elevation: 0 0 0 0 transparent;\n /* Input text color defaults to Text/Primary so user-entered values render\n in primary black at rest. The placeholder text is coloured separately by\n the ::placeholder rule below, so an empty field still reads as the\n lighter Text/Placeholder gray. */\n --eds-text: var(--field-text-primary);\n --eds-leading: var(--field-action-secondary-text);\n --eds-trailing: var(--field-text-primary);\n\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 12px;\n border-radius: 4px;\n border: var(--eds-border-width) solid var(--eds-border);\n border-image: var(--eds-border-image);\n background-color: var(--eds-bg);\n /* Three stackable shadows: AI's purple glow + the focus ring + the\n Elevation/200 lift. Each defaults to a 0/0/0/transparent shadow so they\n can layer without an invalid \"none, none\" expression. */\n box-shadow: var(--eds-ai-glow), var(--eds-ring), var(--eds-elevation);\n width: 400px;\n max-width: 100%;\n box-sizing: border-box;\n font-family: Nunito, sans-serif;\n cursor: text;\n transition: border-color 120ms ease-out,\n border-width 120ms ease-out,\n background-color 120ms ease-out,\n box-shadow 120ms ease-out,\n color 120ms ease-out;\n}\n\n/* Outlined renders only a bottom border (Material-style underline field).\n The top/left/right widths get zeroed out, the corners go square, and the\n AI variant's gradient stroke is drawn as a ::after strip instead of a\n border-image so it stays bottom-only. */\n.eds-field-wrap[data-appearance=\"Outlined\"] {\n border-top-width: 0;\n border-left-width: 0;\n border-right-width: 0;\n border-radius: 0;\n border-image: none;\n}\n/* AI Outlined — gradient underline. Sits on top of the regular bottom border\n so the underlying border can show through in states where ::after is\n hidden (Focused → focus-ring color, Disabled → muted gray). Height matches\n the Figma strokeBottomWeight of 2 px. Uses the horizontal flavor of the\n gradient so it reads as a transition on the 2 px strip. */\n.eds-field-wrap[data-appearance=\"Outlined\"][data-validation=\"AI\"]::after {\n content: \"\";\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n height: 2px;\n background: var(--field-gradient-ai-h);\n pointer-events: none;\n}\n.eds-field-wrap[data-appearance=\"Outlined\"][data-validation=\"AI\"][data-state=\"Focused\"]::after,\n.eds-field-wrap[data-appearance=\"Outlined\"][data-validation=\"AI\"]:focus-within::after,\n.eds-field-wrap[data-appearance=\"Outlined\"][data-validation=\"AI\"][data-state=\"Disabled\"]::after {\n display: none;\n}\n\n.eds-field-wrap[data-state=\"Disabled\"],\n.eds-field-wrap[data-state=\"ReadOnly\"] {\n cursor: default;\n}\n\n.eds-field-wrap__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n}\n.eds-field-wrap__icon svg { width: 100%; height: 100%; display: block; }\n.eds-field-wrap__icon--leading { color: var(--eds-leading); }\n.eds-field-wrap__icon--trailing { color: var(--eds-trailing); }\n\n.eds-field-wrap__input {\n flex: 1;\n min-width: 0;\n border: none;\n outline: none;\n padding: 0;\n background: transparent;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 150%;\n color: var(--eds-text);\n}\n.eds-field-wrap__input::placeholder { color: var(--field-text-placeholder); }\n.eds-field-wrap__input:disabled { cursor: not-allowed; color: var(--field-text-disabled); -webkit-text-fill-color: var(--field-text-disabled); }\n.eds-field-wrap__input:read-only { cursor: default; }\n\n.eds-field-wrap__inline-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: 25px;\n padding: 4px 6px;\n border-radius: 8px;\n border: 1px solid var(--field-border-focus);\n background: transparent;\n color: var(--field-action-primary-background);\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 14px;\n line-height: 120%;\n cursor: pointer;\n flex-shrink: 0;\n white-space: nowrap;\n}\n.eds-field-wrap__inline-button:hover { background: rgba(48, 106, 232, 0.06); }\n.eds-field-wrap[data-state=\"Disabled\"] .eds-field-wrap__inline-button,\n.eds-field-wrap[data-state=\"ReadOnly\"] .eds-field-wrap__inline-button {\n border-color: var(--field-border-subtle);\n color: var(--field-text-disabled);\n cursor: not-allowed;\n}\n\n/* =============================================================\n Appearance: Filled fills the background; Outlined leaves it transparent.\n ============================================================= */\n.eds-field-wrap[data-appearance=\"Filled\"] { --eds-bg: var(--field-background-field); }\n/* Elevation/100 lift on Filled fields in Default, Hover, Focused, and\n Pressed states. Disabled and ReadOnly stay flat (their own rules below\n reset --eds-elevation to transparent). Outlined never lifts. */\n.eds-field-wrap[data-appearance=\"Filled\"]:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]) {\n --eds-elevation: 0 0 4px 0 rgba(0, 0, 0, 0.08);\n}\n\n/* =============================================================\n Validation overrides — applied in Default state. State overrides below\n re-apply on top.\n ============================================================= */\n.eds-field-wrap[data-validation=\"None\"][data-appearance=\"Outlined\"] {\n --eds-border: var(--field-border-strong);\n}\n.eds-field-wrap[data-validation=\"Error\"] {\n --eds-border: var(--field-border-error);\n --eds-border-width: 1.5px;\n --eds-leading: var(--field-border-error);\n}\n.eds-field-wrap[data-validation=\"Error\"][data-appearance=\"Filled\"] {\n --eds-bg: var(--field-feedback-error-background);\n}\n.eds-field-wrap[data-validation=\"Warning\"] {\n --eds-border: var(--field-feedback-warning-indicator);\n --eds-border-width: 1.5px;\n}\n.eds-field-wrap[data-validation=\"Success\"] {\n --eds-border: var(--field-feedback-success-indicator);\n --eds-border-width: 1.5px;\n}\n/* AI validation\n - Filled gets a true Gradient/AI rectangular border that preserves\n rounded corners. We can't use border-image (it squares the corners), so\n we use the padding-box/border-box background trick: layer the field's\n fill color clipped to padding-box on top of the gradient clipped to\n border-box, then leave the actual border transparent. The gradient\n only shows through the transparent border ring. Visible in every active\n state. Disabled is excluded so it collapses to the muted gray frame\n per the Figma source.\n - Outlined keeps the gradient underline via ::after (defined further up).\n We don't override --eds-border on Outlined so Focused / Disabled fall\n through to the focus-ring / gray border per cascade; the ::after\n gradient sits on top in active states.\n*/\n.eds-field-wrap[data-validation=\"AI\"][data-appearance=\"Filled\"]:not([data-state=\"Disabled\"]) {\n background:\n linear-gradient(var(--field-background-field), var(--field-background-field))\n padding-box,\n var(--field-gradient-ai) border-box;\n border: 1.5px solid transparent;\n border-image: none;\n --eds-border-width: 1.5px;\n --eds-ai-glow: var(--field-ai-glow);\n}\n\n/* =============================================================\n Hover state — applied via real :hover OR forced data-state=\"Hover\".\n Switches text from placeholder to primary; tints border focus blue when\n validation is None.\n ============================================================= */\n.eds-field-wrap:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):hover,\n.eds-field-wrap[data-state=\"Hover\"] {\n --eds-text: var(--field-text-primary);\n}\n.eds-field-wrap:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):hover[data-validation=\"None\"],\n.eds-field-wrap[data-state=\"Hover\"][data-validation=\"None\"] {\n --eds-border: var(--field-border-focus);\n --eds-border-width: 1.5px;\n}\n\n/* =============================================================\n Focused state — additive: the field's original inner stroke is preserved.\n - Filled: 4 px halo on all four sides (box-shadow spread).\n - Outlined: 4 px stroke pinned to the bottom edge only (box-shadow with\n y-offset, zero spread) — so it stays an underline field, not a haloed\n rectangle.\n In both cases the inner stroke (border / border-bottom) underneath is\n untouched and the text color shifts to primary.\n ============================================================= */\n.eds-field-wrap:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):focus-within,\n.eds-field-wrap[data-state=\"Focused\"] {\n --eds-ring: 0 0 0 4px var(--field-border-focus-ring);\n --eds-text: var(--field-text-primary);\n}\n.eds-field-wrap[data-appearance=\"Outlined\"]:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):focus-within,\n.eds-field-wrap[data-appearance=\"Outlined\"][data-state=\"Focused\"] {\n --eds-ring: 0 4px 0 0 var(--field-border-focus-ring);\n}\n\n/* =============================================================\n Pressed state (must be forced via state=\"Pressed\"). Per the Figma source,\n Pressed mostly keeps Default's background and shifts the BORDER to the\n focus blue (for None) or keeps the validation color. Text becomes primary.\n The None/Filled variant nudges the background up to pure white.\n ============================================================= */\n.eds-field-wrap[data-state=\"Pressed\"] {\n --eds-text: var(--field-text-primary);\n}\n.eds-field-wrap[data-state=\"Pressed\"][data-validation=\"None\"][data-appearance=\"Filled\"] {\n --eds-bg: var(--field-background-default);\n --eds-border: var(--field-border-focus);\n --eds-border-width: 1.5px;\n}\n.eds-field-wrap[data-state=\"Pressed\"][data-validation=\"None\"][data-appearance=\"Outlined\"] {\n --eds-border: var(--field-border-focus);\n --eds-border-width: 1.5px;\n}\n/* Pressed + (Error|Warning|Success|AI) reuse the validation Default fill,\n so we intentionally do NOT override --eds-bg here. */\n\n/* =============================================================\n Disabled state — uniform across validation. Triggered by the HTML disabled\n attribute, or forced via data-state=\"Disabled\". All colors collapse to the\n disabled gray.\n ============================================================= */\n.eds-field-wrap[data-state=\"Disabled\"] {\n --eds-text: var(--field-text-disabled);\n --eds-leading: var(--field-text-disabled);\n --eds-trailing: var(--field-text-disabled);\n --eds-border: var(--field-border-subtle);\n --eds-border-width: 1.5px;\n --eds-border-image: none;\n}\n.eds-field-wrap[data-state=\"Disabled\"][data-appearance=\"Filled\"] {\n --eds-bg: var(--field-background-disabled);\n}\n.eds-field-wrap[data-state=\"Disabled\"][data-appearance=\"Outlined\"] {\n --eds-bg: transparent;\n}\n\n/* =============================================================\n ReadOnly state — like Disabled visually but the text reads as primary, not\n disabled. Triggered by the HTML readonly attribute, or forced via\n data-state=\"ReadOnly\".\n ============================================================= */\n.eds-field-wrap[data-state=\"ReadOnly\"] {\n --eds-text: var(--field-text-primary);\n --eds-leading: var(--field-text-placeholder);\n --eds-trailing: var(--field-text-placeholder);\n --eds-border-image: none;\n}\n.eds-field-wrap[data-state=\"ReadOnly\"][data-appearance=\"Filled\"] {\n --eds-bg: var(--field-background-disabled);\n --eds-border: var(--field-border-subtle);\n --eds-border-width: 1.5px;\n}\n.eds-field-wrap[data-state=\"ReadOnly\"][data-appearance=\"Outlined\"] {\n --eds-bg: transparent;\n --eds-border: var(--field-border-strong);\n --eds-border-width: 1px;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-field-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-field-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-field-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-field-matrix__sub {\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-field-matrix__row { display: flex; flex-direction: column; gap: 8px; }\n.eds-field-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-field-matrix__pair {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 12px;\n}\n.eds-field-matrix .eds-field-wrap { width: 100%; }\n`;\n\n// Inject (or refresh) the style block, surviving HMR.\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-field]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-field\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Field = React.forwardRef<HTMLInputElement, FieldProps>(\n function Field(\n {\n state,\n validation = \"None\",\n appearance = \"Filled\",\n leadingIcon,\n trailingIcon,\n inlineButton,\n placeholder = \"Placeholder\",\n value,\n defaultValue,\n onChange,\n disabled = false,\n readOnly = false,\n className,\n id,\n name,\n type = \"text\",\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n // Resolve the effective forced state. HTML disabled/readonly map directly\n // to data-state so styling matches whichever path is used.\n let effectiveState: FieldState | undefined = state;\n if (!effectiveState) {\n if (disabled) effectiveState = \"Disabled\";\n else if (readOnly) effectiveState = \"ReadOnly\";\n }\n\n const isDisabled = disabled || effectiveState === \"Disabled\";\n const isReadOnly = readOnly || effectiveState === \"ReadOnly\";\n\n const wrapperClass = \"eds-field-wrap\" + (className ? ` ${className}` : \"\");\n\n return (\n <label\n className={wrapperClass}\n data-state={effectiveState}\n data-validation={validation}\n data-appearance={appearance}\n htmlFor={id}\n >\n {leadingIcon && (\n <span\n className=\"eds-field-wrap__icon eds-field-wrap__icon--leading\"\n aria-hidden\n >\n {leadingIcon}\n </span>\n )}\n <input\n ref={ref}\n id={id}\n name={name}\n type={type}\n className=\"eds-field-wrap__input\"\n placeholder={placeholder}\n value={value}\n defaultValue={defaultValue}\n onChange={onChange}\n disabled={isDisabled}\n readOnly={isReadOnly}\n aria-label={ariaLabel}\n aria-invalid={validation === \"Error\" || undefined}\n />\n {inlineButton && (\n <button\n type=\"button\"\n className=\"eds-field-wrap__inline-button\"\n disabled={isDisabled || isReadOnly}\n tabIndex={-1}\n >\n {inlineButton}\n </button>\n )}\n {trailingIcon && (\n <span\n className=\"eds-field-wrap__icon eds-field-wrap__icon--trailing\"\n aria-hidden\n >\n {trailingIcon}\n </span>\n )}\n </label>\n );\n }\n);\n\nexport default Field;\n\n// ---------------------------------------------------------------------------\n// FieldMatrix — renders the full State × Validation × Appearance grid, plus a\n// section showing boolean prop toggles (LeadingIcon, TrailingIcon, InlineButton).\n// Hover and Focused are real browser states, so even though they appear in the\n// grid, you can also trigger them naturally by mousing over / clicking into\n// any field whose forced state is left blank.\n// ---------------------------------------------------------------------------\nconst STATES: FieldState[] = [\n \"Default\",\n \"Hover\",\n \"Focused\",\n \"Pressed\",\n \"Disabled\",\n \"ReadOnly\",\n];\nconst VALIDATIONS: FieldValidation[] = [\n \"None\",\n \"Error\",\n \"Warning\",\n \"Success\",\n \"AI\",\n];\n\nfunction IconSearch() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15.5 14h-.79l-.28-.27A6.5 6.5 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" />\n </svg>\n );\n}\n\nfunction IconClose() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\" />\n </svg>\n );\n}\n\nexport function FieldMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-field-matrix\">\n {VALIDATIONS.map((validation) => (\n <section key={validation} className=\"eds-field-matrix__section\">\n <h3 className=\"eds-field-matrix__heading\">Validation · {validation}</h3>\n {STATES.map((state) => (\n <div key={state} className=\"eds-field-matrix__row\">\n <p className=\"eds-field-matrix__row-label\">{state}</p>\n <div className=\"eds-field-matrix__pair\">\n <Field\n state={state}\n validation={validation}\n appearance=\"Filled\"\n leadingIcon={<IconSearch />}\n trailingIcon={<IconClose />}\n placeholder={`${state} ${validation} Filled`}\n />\n <Field\n state={state}\n validation={validation}\n appearance=\"Outlined\"\n leadingIcon={<IconSearch />}\n trailingIcon={<IconClose />}\n placeholder={`${state} ${validation} Outlined`}\n />\n </div>\n </div>\n ))}\n </section>\n ))}\n\n <section className=\"eds-field-matrix__section\">\n <h3 className=\"eds-field-matrix__heading\">Boolean toggles</h3>\n <p className=\"eds-field-matrix__sub\">\n Default state, None validation. Click into any field to see the\n Focused ring; mouse over for Hover.\n </p>\n <div className=\"eds-field-matrix__row\">\n <p className=\"eds-field-matrix__row-label\">No icons or inline button</p>\n <Field placeholder=\"Plain field\" />\n </div>\n <div className=\"eds-field-matrix__row\">\n <p className=\"eds-field-matrix__row-label\">Leading icon only</p>\n <Field leadingIcon={<IconSearch />} placeholder=\"With leading icon\" />\n </div>\n <div className=\"eds-field-matrix__row\">\n <p className=\"eds-field-matrix__row-label\">Trailing icon only</p>\n <Field trailingIcon={<IconClose />} placeholder=\"With trailing icon\" />\n </div>\n <div className=\"eds-field-matrix__row\">\n <p className=\"eds-field-matrix__row-label\">Inline button only</p>\n <Field inlineButton=\"Apply\" placeholder=\"With inline button\" />\n </div>\n <div className=\"eds-field-matrix__row\">\n <p className=\"eds-field-matrix__row-label\">All three</p>\n <Field\n leadingIcon={<IconSearch />}\n inlineButton=\"Apply\"\n trailingIcon={<IconClose />}\n placeholder=\"Search…\"\n />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Barcode — React port of the Embleema Design System 2.0 Input/Barcode\n * component (Figma node 4454:7). A molecule that wraps the base Field atom\n * with a \"Scan\" primary button beside it and (when state=\"Complete\") a\n * BarcodePreview card showing the rendered barcode bars + scanned number.\n *\n * State handling:\n * - Default / Hover / Focused / Disabled / ReadOnly are forwarded to Field's\n * own state prop, so the browser's :hover and :focus pseudo-classes light\n * up the field interactively (the explicit prop wins when supplied)\n * - Error sets the field's validation to Error and tints the helper text\n * - Complete renders the BarcodePreview card below the field/helper\n */\n\nimport * as React from \"react\";\nimport { Field } from \"./Field\";\nimport type { FieldAppearance } from \"./Field\";\n\nexport type BarcodeState =\n | \"Default\"\n | \"Hover\"\n | \"Focused\"\n | \"Complete\"\n | \"Error\"\n | \"Disabled\"\n | \"ReadOnly\";\nexport type BarcodeStyle = FieldAppearance;\nexport type BarcodeLabelPosition = \"Top\" | \"Left\";\n\nexport type BarcodeProps = {\n state?: BarcodeState;\n style?: BarcodeStyle;\n labelPosition?: BarcodeLabelPosition;\n label?: boolean | string;\n helperText?: boolean | string;\n required?: boolean;\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n /** Fires when the user clicks the Scan button. */\n onScan?: () => void;\n id?: string;\n name?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Barcode\";\nconst DEFAULT_HELPER: Record<BarcodeState, string> = {\n Default: \"Helper text\",\n Hover: \"Helper text\",\n Focused: \"Helper text\",\n Complete: \"Barcode scanned successfully\",\n Error: \"Invalid barcode — try again\",\n Disabled: \"Helper text\",\n ReadOnly: \"Helper text\",\n};\nconst LEFT_LABEL_WIDTH = 120;\n\n// ---------------------------------------------------------------------------\n// Styles\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n --bc-text-primary: #0E0E0E;\n --bc-text-secondary: #5E5E5E;\n --bc-text-error: #E02020;\n --bc-feedback-error-text: #B31A1A;\n --bc-feedback-success-text: #288028;\n --bc-feedback-success-indicator: #32A032;\n --bc-action-primary-bg: #306AE8;\n --bc-action-primary-bg-hover: #6994EE;\n --bc-action-primary-text: #FEFEFE;\n --bc-border-subtle: #F1F1F1;\n}\n\n.eds-bc {\n display: flex;\n font-family: Nunito, sans-serif;\n}\n.eds-bc[data-label-position=\"Top\"] {\n flex-direction: column;\n gap: 8px;\n width: 100%;\n}\n.eds-bc[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n}\n\n.eds-bc__label-slot[data-label-position=\"Left\"] {\n width: ${LEFT_LABEL_WIDTH}px;\n flex-shrink: 0;\n padding-top: 12px;\n}\n.eds-bc__label-text {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--bc-text-primary);\n margin: 0;\n display: inline-flex;\n align-items: baseline;\n gap: 2px;\n}\n.eds-bc[data-state=\"Error\"] .eds-bc__label-text { color: var(--bc-text-error); }\n.eds-bc__required { color: var(--bc-feedback-error-text); }\n\n.eds-bc__content {\n display: flex;\n flex-direction: column;\n gap: 8px;\n min-width: 0;\n flex: 1 1 auto;\n}\n\n/* Row: Field + Scan button */\n.eds-bc__row {\n display: flex;\n align-items: center;\n gap: 16px;\n width: 100%;\n}\n.eds-bc__row > .eds-field-wrap {\n flex: 1 1 0;\n min-width: 0;\n}\n\n.eds-bc__scan {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n height: 44px;\n width: 100px;\n padding: 10px 20px;\n border: 0;\n background: var(--bc-action-primary-bg);\n color: var(--bc-action-primary-text);\n border-radius: 8px;\n cursor: pointer;\n filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.08));\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 16px;\n line-height: 1.2;\n flex-shrink: 0;\n transition: background 120ms;\n}\n.eds-bc__scan:hover:not(:disabled) { background: var(--bc-action-primary-bg-hover); }\n.eds-bc__scan:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n.eds-bc__scan:disabled { cursor: not-allowed; opacity: 0.5; }\n.eds-bc__scan-icon {\n display: inline-flex;\n width: 18px;\n height: 18px;\n flex-shrink: 0;\n}\n.eds-bc__scan-icon svg { width: 100%; height: 100%; display: block; color: currentColor; }\n\n/* Helper text */\n.eds-bc__helper {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.4;\n color: var(--bc-text-secondary);\n}\n.eds-bc[data-state=\"Error\"] .eds-bc__helper { color: var(--bc-feedback-error-text); }\n.eds-bc[data-state=\"Complete\"] .eds-bc__helper { color: var(--bc-feedback-success-text); }\n\n/* BarcodePreview card */\n.eds-bc__preview {\n display: flex;\n flex-direction: column;\n gap: 4px;\n align-items: flex-start;\n padding: 12px;\n border: 1px solid var(--bc-border-subtle);\n border-radius: 8px;\n background: #FFFFFF;\n}\n.eds-bc__preview-bars {\n display: flex;\n align-items: stretch;\n gap: 0;\n height: 60px;\n overflow: hidden;\n width: 100%;\n max-width: 100%;\n justify-content: flex-start;\n}\n.eds-bc__preview-bar {\n height: 100%;\n background: var(--bc-text-primary);\n margin-right: 1px;\n}\n.eds-bc__preview-bar[data-empty=\"true\"] {\n background: transparent;\n}\n.eds-bc__preview-number {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 1.4;\n color: var(--bc-text-primary);\n letter-spacing: 0.04em;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-barcode]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-barcode\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Icons — Icon/Action/Camera, sourced verbatim from the Embleema Design\n// System 2.0 Figma file (node 5158:25, componentKey\n// 2820d7120a396c32e9179019f2c86fb70912ad50). Path data preserved as exported;\n// fill swapped to currentColor so the button color flows through.\n// ---------------------------------------------------------------------------\nfunction ScanIcon() {\n return (\n <svg viewBox=\"0 0 20 17.8947\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M10 14.3318C11.2079 14.3318 12.2318 13.9118 13.0718 13.0718C13.9118 12.2318 14.3318 11.2079 14.3318 10C14.3318 8.79212 13.9118 7.76812 13.0718 6.92812C12.2318 6.08816 11.2079 5.66816 10 5.66816C8.7921 5.66816 7.76816 6.08816 6.92816 6.92812C6.08816 7.76812 5.66816 8.79212 5.66816 10C5.66816 11.2079 6.08816 12.2318 6.92816 13.0718C7.76816 13.9118 8.7921 14.3318 10 14.3318ZM10 12.7531C9.2226 12.7531 8.5695 12.4886 8.0405 11.9595C7.5114 11.4305 7.24684 10.7773 7.24684 10C7.24684 9.22262 7.5114 8.56952 8.0405 8.04052C8.5695 7.51142 9.2226 7.24682 10 7.24682C10.7774 7.24682 11.4305 7.51142 11.9595 8.04052C12.4886 8.56952 12.7532 9.22262 12.7532 10C12.7532 10.7773 12.4886 11.4305 11.9595 11.9595C11.4305 12.4886 10.7774 12.7531 10 12.7531ZM1.90289 17.8947C1.37114 17.8947 0.92105 17.7105 0.55263 17.3421C0.18421 16.9737 0 16.5236 0 15.9918V4.00816C0 3.4764 0.18421 3.02631 0.55263 2.65789C0.92105 2.28947 1.37114 2.10526 1.90289 2.10526H5.11737L6.49395 0.61342C6.66675 0.42307 6.87561 0.27324 7.12053 0.16394C7.36544 0.05465 7.62351 0 7.89474 0H12.1053C12.3765 0 12.6346 0.05465 12.8795 0.16394C13.1244 0.27324 13.3332 0.42307 13.5061 0.61342L14.8826 2.10526H18.0971C18.6289 2.10526 19.0789 2.28947 19.4474 2.65789C19.8158 3.02631 20 3.4764 20 4.00816V15.9918C20 16.5236 19.8158 16.9737 19.4474 17.3421C19.0789 17.7105 18.6289 17.8947 18.0971 17.8947H1.90289ZM1.90289 16.3158H18.0971C18.1917 16.3158 18.2693 16.2854 18.33 16.2247C18.3907 16.164 18.4211 16.0864 18.4211 15.9918V4.00816C18.4211 3.91359 18.3907 3.83596 18.33 3.77526C18.2693 3.71456 18.1917 3.68421 18.0971 3.68421H14.1782L12.2468 1.57894H7.75316L5.82184 3.68421H1.90289C1.80833 3.68421 1.7307 3.71456 1.67 3.77526C1.6093 3.83596 1.57895 3.91359 1.57895 4.00816V15.9918C1.57895 16.0864 1.6093 16.164 1.67 16.2247C1.7307 16.2854 1.80833 16.3158 1.90289 16.3158Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n\n// Generate a stable bar pattern from a string so the preview re-renders\n// deterministically for the same value. Returns an array of {width, filled}\n// segments. Approximate, decorative only — not a real barcode encoder.\nfunction generateBars(value: string): { width: number; filled: boolean }[] {\n const out: { width: number; filled: boolean }[] = [];\n if (!value) return out;\n let seed = 0;\n for (let i = 0; i < value.length; i++) seed = (seed * 31 + value.charCodeAt(i)) & 0xffff;\n const widths = [1, 2, 3];\n for (let i = 0; i < 48; i++) {\n seed = (seed * 1103515245 + 12345) & 0x7fffffff;\n const w = widths[seed % widths.length];\n const filled = i % 2 === 0;\n out.push({ width: w, filled });\n }\n return out;\n}\n\n// Map external Barcode state → Field state. Error and Complete fall back to\n// Default (Complete keeps a real input that the user can still focus into;\n// Error is signalled via Field's validation prop and the preview/helper UI).\nfunction mapFieldState(s: BarcodeState): \"Default\" | \"Hover\" | \"Focused\" | \"Disabled\" | \"ReadOnly\" {\n switch (s) {\n case \"Hover\":\n case \"Focused\":\n case \"Disabled\":\n case \"ReadOnly\":\n return s;\n default:\n return \"Default\";\n }\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Barcode = React.forwardRef<HTMLInputElement, BarcodeProps>(\n function Barcode(\n {\n state = \"Default\",\n style = \"Filled\",\n labelPosition = \"Top\",\n label = true,\n helperText = false,\n required = false,\n value,\n defaultValue,\n onChange,\n onScan,\n id,\n name,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = value !== undefined;\n const [internal, setInternal] = React.useState<string>(defaultValue ?? \"\");\n const current = isControlled ? value : internal;\n\n const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n const next = e.target.value;\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const handleScan = () => {\n if (state === \"Disabled\" || state === \"ReadOnly\") return;\n onScan?.();\n };\n\n const wrapperClass = \"eds-bc\" + (className ? ` ${className}` : \"\");\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n const helperContent =\n typeof helperText === \"string\" ? helperText : DEFAULT_HELPER[state];\n\n const fieldEl = (\n <Field\n ref={ref}\n state={mapFieldState(state)}\n validation={state === \"Error\" ? \"Error\" : \"None\"}\n appearance={style}\n placeholder=\"Scan or enter barcode\"\n value={current}\n onChange={handleInputChange}\n disabled={state === \"Disabled\"}\n readOnly={state === \"ReadOnly\"}\n id={id}\n name={name}\n type=\"text\"\n aria-label={ariaLabel ?? (typeof label === \"string\" ? label : \"Barcode\")}\n />\n );\n\n const scanButton = (\n <button\n type=\"button\"\n className=\"eds-bc__scan\"\n onClick={handleScan}\n disabled={state === \"Disabled\" || state === \"ReadOnly\"}\n >\n <span className=\"eds-bc__scan-icon\"><ScanIcon /></span>\n <span>Scan</span>\n </button>\n );\n\n const labelEl = label ? (\n <div className=\"eds-bc__label-slot\" data-label-position={labelPosition}>\n <label className=\"eds-bc__label-text\" htmlFor={id}>\n {required && <span className=\"eds-bc__required\" aria-hidden>*</span>}\n {labelText}\n </label>\n </div>\n ) : null;\n\n const helperEl = helperText ? (\n <div className=\"eds-bc__helper\" role={state === \"Error\" ? \"alert\" : undefined}>\n {helperContent}\n </div>\n ) : null;\n\n const previewEl =\n state === \"Complete\" && current ? (\n <div className=\"eds-bc__preview\" aria-label={`Scanned barcode ${current}`}>\n <div className=\"eds-bc__preview-bars\" aria-hidden>\n {generateBars(current).map((b, i) => (\n <span\n key={i}\n className=\"eds-bc__preview-bar\"\n data-empty={!b.filled || undefined}\n style={{ width: `${b.width}px` }}\n />\n ))}\n </div>\n <span className=\"eds-bc__preview-number\">{current}</span>\n </div>\n ) : null;\n\n return (\n <div className={wrapperClass} data-state={state} data-label-position={labelPosition}>\n {labelEl}\n <div className=\"eds-bc__content\">\n <div className=\"eds-bc__row\">\n {fieldEl}\n {scanButton}\n </div>\n {helperEl}\n {previewEl}\n </div>\n </div>\n );\n }\n);\n\nexport default Barcode;\n\n// ---------------------------------------------------------------------------\n// BarcodeMatrix — interactive showcase. The first row is fully interactive:\n// typing a value and clicking Scan flips it into the Complete state with a\n// preview. The grids below show every State × Style combination statically.\n// ---------------------------------------------------------------------------\nexport function BarcodeMatrix() {\n ensureStyles();\n const [scanned, setScanned] = React.useState(\"\");\n const [pending, setPending] = React.useState(\"\");\n\n const states: BarcodeState[] = [\n \"Default\", \"Hover\", \"Focused\", \"Complete\", \"Error\", \"Disabled\", \"ReadOnly\",\n ];\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (type or paste a value, then click Scan)\n </p>\n <div style={{ maxWidth: 520 }}>\n <Barcode\n label\n helperText\n state={scanned ? \"Complete\" : \"Default\"}\n value={pending}\n onChange={setPending}\n onScan={() => setScanned(pending || \"1234567890\")}\n />\n </div>\n </section>\n\n {([\"Filled\", \"Outlined\"] as BarcodeStyle[]).map((s) => (\n <section key={s} style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Style = {s} · LabelPosition = Top\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(440px, 1fr))\", gap: 16 }}>\n {states.map((st) => (\n <Barcode\n key={st}\n state={st}\n style={s}\n label\n helperText\n defaultValue={st === \"Complete\" || st === \"ReadOnly\" ? \"1234567890\" : \"\"}\n />\n ))}\n </div>\n </section>\n ))}\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n LabelPosition = Left\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 16, maxWidth: 700 }}>\n {states.map((st) => (\n <Barcode\n key={st}\n state={st}\n label\n helperText\n labelPosition=\"Left\"\n defaultValue={st === \"Complete\" || st === \"ReadOnly\" ? \"1234567890\" : \"\"}\n />\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Radio — React port of Embleema Design System 2.0's Selector/Radio component\n * (Figma node 4258:824).\n *\n * Structure mirrors the Figma source:\n * wrapper (HORIZONTAL, gap 8)\n * ├── container (32×32 circle)\n * │ └── state-layer (32×32, padding 4 — fills with a tint on\n * │ hover/focus/pressed)\n * │ ├── UncheckedIcon (20×20 hollow circle, visible when not selected)\n * │ └── CheckedIcon (20×20 ring + dot, visible when selected)\n * └── label (optional, body/md)\n *\n * Real `<input type=\"radio\">` sits invisibly underneath the wrapper so that\n * native group behaviour works: radios sharing a `name` attribute auto-deselect\n * each other, keyboard arrow navigation works, screen readers announce the\n * right semantics. Pass the same `name` to every Radio in a group.\n *\n * Props:\n * - state : forced override for previews (Pressed/Hover/etc.)\n * - selected : controlled checked state\n * - defaultSelected : uncontrolled initial state\n * - label : label string (clicking the label selects the radio)\n * - disabled : maps to data-state=\"Disabled\" + HTML disabled\n * - name, value : standard HTML — required for grouping\n * - onChange : called with the new selected boolean (true on selection)\n */\n\nimport * as React from \"react\";\n\nexport type RadioState =\n | \"Default\"\n | \"Hover\"\n | \"Focused\"\n | \"Pressed\"\n | \"Disabled\";\n\nexport type RadioProps = {\n state?: RadioState;\n selected?: boolean;\n defaultSelected?: boolean;\n label?: string;\n disabled?: boolean;\n onChange?: (selected: boolean) => void;\n name?: string;\n value?: string;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — colors come from the live Figma extraction:\n// - Unchecked vector: Text/Secondary (#5E5E5E), Text/Disabled (#848484)\n// in the Disabled state.\n// - Checked vector (ring + dot): Action/Primary/Background (#306AE8),\n// Text/Secondary (#5E5E5E) in the Disabled state.\n// - State-layer tint: Background/Selected (#E3ECFF) on Hover,\n// Blue/200 (#A2BDF5) on Focused/Pressed.\n// - Label: Text/Primary, Text/Disabled in the Disabled state.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --rb-text-primary: #0E0E0E;\n --rb-text-secondary: #5E5E5E;\n --rb-text-disabled: #848484;\n --rb-action-primary: #306AE8;\n --rb-background-selected: #E3ECFF;\n --rb-blue-200: #A2BDF5;\n}\n\n.eds-rb {\n --rb-state-layer: transparent;\n --rb-unchecked: var(--rb-text-secondary);\n --rb-checked: var(--rb-action-primary);\n --rb-label: var(--rb-text-primary);\n\n display: inline-flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n user-select: none;\n position: relative;\n}\n.eds-rb[data-state=\"Disabled\"],\n.eds-rb:has(input:disabled) {\n cursor: not-allowed;\n}\n\n/* Hidden native input — keeps semantics, group behavior, keyboard nav */\n.eds-rb__input {\n position: absolute;\n inset: 0;\n opacity: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n cursor: inherit;\n}\n.eds-rb__input:disabled { cursor: not-allowed; }\n\n/* State layer = the 32×32 circle tint behind the radio glyph. */\n.eds-rb__state-layer {\n width: 32px;\n height: 32px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background: var(--rb-state-layer);\n transition: background-color 120ms ease-out;\n flex-shrink: 0;\n}\n\n.eds-rb__icon {\n width: 20px;\n height: 20px;\n display: block;\n color: var(--rb-unchecked);\n}\n.eds-rb[data-checked=\"true\"] .eds-rb__icon {\n color: var(--rb-checked);\n}\n\n.eds-rb__label {\n font-size: 16px;\n line-height: 150%;\n font-weight: 400;\n color: var(--rb-label);\n}\n\n/* =============================================================\n States — natural :hover / :focus-within, or forced data-state.\n ============================================================= */\n\n/* Hover tint */\n.eds-rb:not([data-state=\"Disabled\"]):hover .eds-rb__state-layer,\n.eds-rb[data-state=\"Hover\"] .eds-rb__state-layer {\n background: var(--rb-background-selected);\n}\n\n/* Focused / Pressed tint — darker blue. Once the radio is selected, the\n focus tint is suppressed so the selected dot reads cleanly without a\n residual highlight after clicking. */\n.eds-rb:not([data-state=\"Disabled\"]):not([data-checked=\"true\"]):focus-within .eds-rb__state-layer,\n.eds-rb[data-state=\"Focused\"]:not([data-checked=\"true\"]) .eds-rb__state-layer,\n.eds-rb[data-state=\"Pressed\"]:not([data-checked=\"true\"]) .eds-rb__state-layer {\n background: var(--rb-blue-200);\n}\n\n/* Disabled palette */\n.eds-rb[data-state=\"Disabled\"] {\n --rb-unchecked: var(--rb-text-disabled);\n --rb-checked: var(--rb-text-secondary);\n --rb-label: var(--rb-text-disabled);\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-rb-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-rb-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-rb-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-rb-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-rb-matrix__row {\n display: grid;\n grid-template-columns: 120px 1fr 1fr;\n align-items: center;\n gap: 12px;\n}\n.eds-rb-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-rb-matrix__col-head {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-rb-matrix__group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-radio]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-radio\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\nfunction RadioGlyph({ checked }: { checked: boolean }) {\n return (\n <svg\n className=\"eds-rb__icon\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <circle\n cx=\"10\"\n cy=\"10\"\n r=\"9\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n />\n {checked && <circle cx=\"10\" cy=\"10\" r=\"5\" fill=\"currentColor\" />}\n </svg>\n );\n}\n\nlet idCounter = 0;\nfunction useGeneratedId(provided?: string) {\n const [id] = React.useState(() => provided ?? `eds-rb-${++idCounter}`);\n return id;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Radio = React.forwardRef<HTMLInputElement, RadioProps>(\n function Radio(\n {\n state,\n selected,\n defaultSelected = false,\n label,\n disabled = false,\n onChange,\n name,\n value,\n id: providedId,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const id = useGeneratedId(providedId);\n\n const isControlled = selected !== undefined;\n const [internal, setInternal] = React.useState(defaultSelected);\n const checked = isControlled ? !!selected : internal;\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const next = e.target.checked;\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const effectiveState: RadioState | undefined =\n state ?? (disabled ? \"Disabled\" : undefined);\n const isDisabled = disabled || effectiveState === \"Disabled\";\n const wrapperClass = \"eds-rb\" + (className ? ` ${className}` : \"\");\n\n return (\n <label\n className={wrapperClass}\n data-state={effectiveState}\n data-checked={checked || undefined}\n htmlFor={id}\n >\n <input\n ref={ref}\n id={id}\n name={name}\n value={value}\n type=\"radio\"\n className=\"eds-rb__input\"\n checked={checked}\n disabled={isDisabled}\n onChange={handleChange}\n aria-label={ariaLabel ?? (label ? undefined : \"Radio\")}\n />\n <span className=\"eds-rb__state-layer\">\n <RadioGlyph checked={checked} />\n </span>\n {label && <span className=\"eds-rb__label\">{label}</span>}\n </label>\n );\n }\n);\n\nexport default Radio;\n\n// ---------------------------------------------------------------------------\n// RadioMatrix — State × Selected grid, plus an interactive group that\n// demonstrates native single-selection behaviour. The Default row is fully\n// interactive (no forced state) so you can click the unselected one to\n// promote it.\n// ---------------------------------------------------------------------------\nconst STATES: RadioState[] = [\n \"Default\",\n \"Hover\",\n \"Focused\",\n \"Pressed\",\n \"Disabled\",\n];\n\nfunction StateRow({ state }: { state: RadioState }) {\n // Default row stays naturally interactive; the others force the visual.\n const forced = state !== \"Default\";\n // Each row uses its own name so the Default row stays a self-contained group\n // (Selected radio in the row stays selected without affecting other rows).\n const groupName = `eds-rb-row-${state}`;\n return (\n <div className=\"eds-rb-matrix__row\">\n <p className=\"eds-rb-matrix__row-label\">{state}</p>\n <Radio\n name={groupName}\n value=\"unselected\"\n label=\"Label\"\n {...(forced ? { state } : {})}\n />\n <Radio\n name={groupName}\n value=\"selected\"\n label=\"Label\"\n defaultSelected\n {...(forced ? { state } : {})}\n />\n </div>\n );\n}\n\nexport function RadioMatrix() {\n ensureStyles();\n\n // Real interactive group at the bottom — three radios sharing a name.\n const [picked, setPicked] = React.useState<string>(\"medium\");\n\n return (\n <div className=\"eds-rb-matrix\">\n <section className=\"eds-rb-matrix__section\">\n <h3 className=\"eds-rb-matrix__heading\">State × Selected</h3>\n <p className=\"eds-rb-matrix__sub\">\n Each row is a self-contained group. The Default row is fully\n interactive — click the unselected radio to promote it; tab into\n either to see the focus tint.\n </p>\n <div className=\"eds-rb-matrix__row\">\n <span className=\"eds-rb-matrix__col-head\">State</span>\n <span className=\"eds-rb-matrix__col-head\">Unselected</span>\n <span className=\"eds-rb-matrix__col-head\">Selected</span>\n </div>\n {STATES.map((state) => (\n <StateRow key={state} state={state} />\n ))}\n </section>\n\n <section className=\"eds-rb-matrix__section\">\n <h3 className=\"eds-rb-matrix__heading\">Interactive group</h3>\n <p className=\"eds-rb-matrix__sub\">\n Three radios sharing the same <code>name</code>. Picking one\n deselects the others. Try arrow-key navigation when focus is on\n any radio.\n </p>\n <div className=\"eds-rb-matrix__group\" role=\"radiogroup\" aria-label=\"Size\">\n <Radio\n name=\"eds-rb-demo-size\"\n value=\"small\"\n label=\"Small\"\n selected={picked === \"small\"}\n onChange={(s) => s && setPicked(\"small\")}\n />\n <Radio\n name=\"eds-rb-demo-size\"\n value=\"medium\"\n label=\"Medium\"\n selected={picked === \"medium\"}\n onChange={(s) => s && setPicked(\"medium\")}\n />\n <Radio\n name=\"eds-rb-demo-size\"\n value=\"large\"\n label=\"Large\"\n selected={picked === \"large\"}\n onChange={(s) => s && setPicked(\"large\")}\n />\n </div>\n <p className=\"eds-rb-matrix__sub\">\n Picked: <strong>{picked}</strong>\n </p>\n </section>\n\n <section className=\"eds-rb-matrix__section\">\n <h3 className=\"eds-rb-matrix__heading\">Without label</h3>\n <div className=\"eds-rb-matrix__row\">\n <p className=\"eds-rb-matrix__row-label\">Default</p>\n <Radio name=\"eds-rb-nolabel\" value=\"a\" />\n <Radio name=\"eds-rb-nolabel\" value=\"b\" defaultSelected />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Checkbox — React port of Embleema Design System 2.0's Selector/Checkbox\n * component (Figma node 4258:271).\n *\n * Structure mirrors the Figma source:\n * wrapper (HORIZONTAL, gap 8)\n * ├── state-layer (34×34 circle, padding 8 — shows tint on hover/focus/pressed)\n * │ └── container (18×18 rounded-2 square with 2px border, fills on\n * │ selected/indeterminate, holds the check or dash icon)\n * └── label (optional, body/md)\n *\n * Props:\n * - state (forced) : Default | Hover | Focused | Pressed | Disabled\n * Omit to let real browser :hover / :focus-within drive\n * Hover and Focused naturally.\n * - validation : None | Error (None = neutral palette, Error = red palette)\n * - selected : controlled checked state\n * - defaultSelected: uncontrolled initial state\n * - indeterminate : forces the dash icon and the indeterminate fill,\n * regardless of selected. Also sets the HTML\n * `indeterminate` property via ref so screen readers\n * announce the right state.\n * - label : label string (clicking the label toggles the checkbox)\n * - disabled : maps to data-state=\"Disabled\" + HTML disabled\n * - onChange : called with the new selected boolean\n */\n\nimport * as React from \"react\";\n\nexport type CheckboxState =\n | \"Default\"\n | \"Hover\"\n | \"Focused\"\n | \"Pressed\"\n | \"Disabled\";\nexport type CheckboxValidation = \"None\" | \"Error\";\n\nexport type CheckboxProps = {\n state?: CheckboxState;\n validation?: CheckboxValidation;\n selected?: boolean;\n defaultSelected?: boolean;\n indeterminate?: boolean;\n label?: string;\n disabled?: boolean;\n onChange?: (selected: boolean) => void;\n id?: string;\n name?: string;\n value?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — colors come from the live Figma extraction:\n// - Container stroke: Text/Secondary in None, Feedback/Error/Text in Error,\n// Text/Tertiary in Disabled.\n// - Selected/Indeterminate fill: Action/Primary/Background in None,\n// Feedback/Error/Text in Error, Text/Secondary in Disabled.\n// - State-layer tint: Background/Selected in None hover/focus/pressed,\n// Feedback/Error/Background in Error hover/focus/pressed.\n// - Icon color: Text/Primary (#0E0E0E) — yes, the checkmark/dash is dark\n// on top of the colored fill in this design system.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --cb-text-primary: #0E0E0E;\n --cb-text-secondary: #5E5E5E;\n --cb-text-tertiary: #848484;\n --cb-text-disabled: #848484;\n --cb-text-inverse: #FEFEFE;\n --cb-action-primary: #306AE8;\n --cb-feedback-error-text: #B31A1A;\n --cb-feedback-error-background: #FFE2E2;\n --cb-background-selected: #E3ECFF;\n}\n\n.eds-cb {\n --cb-state-layer: transparent;\n --cb-container-border: var(--cb-text-secondary);\n --cb-fill: var(--cb-action-primary);\n --cb-icon: var(--cb-text-inverse);\n --cb-label: var(--cb-text-primary);\n\n display: inline-flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n user-select: none;\n position: relative;\n}\n.eds-cb[data-state=\"Disabled\"],\n.eds-cb:has(input:disabled) {\n cursor: not-allowed;\n}\n\n/* Hidden native input — keeps semantics + keyboard focus working */\n.eds-cb__input {\n position: absolute;\n inset: 0;\n opacity: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n cursor: inherit;\n}\n.eds-cb__input:disabled { cursor: not-allowed; }\n\n/* State layer = the 34×34 circle tint behind the 18×18 box. */\n.eds-cb__state-layer {\n width: 34px;\n height: 34px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background: var(--cb-state-layer);\n transition: background-color 120ms ease-out;\n flex-shrink: 0;\n}\n\n/* The 18×18 container box. */\n.eds-cb__box {\n position: relative;\n width: 18px;\n height: 18px;\n box-sizing: border-box;\n border-radius: 2px;\n border: 2px solid var(--cb-container-border);\n background: transparent;\n transition: background-color 120ms ease-out,\n border-color 120ms ease-out;\n}\n/* When checked OR indeterminate, the box fills with the selected fill. */\n.eds-cb[data-checked=\"true\"] .eds-cb__box,\n.eds-cb[data-indeterminate=\"true\"] .eds-cb__box {\n background: var(--cb-fill);\n border-color: var(--cb-fill);\n}\n\n/* Check / dash icons centered inside the 18×18 box. Color uses currentColor\n so the SVGs pick up --cb-icon via .eds-cb__icon-wrap. */\n.eds-cb__icon-wrap {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--cb-icon);\n pointer-events: none;\n}\n.eds-cb__icon-wrap svg { display: block; }\n\n/* Label text — body/md (16/150% Nunito Regular). */\n.eds-cb__label {\n font-size: 16px;\n line-height: 150%;\n font-weight: 400;\n color: var(--cb-label);\n}\n\n/* =============================================================\n Validation — Error swaps the container/fill colors to red.\n ============================================================= */\n.eds-cb[data-validation=\"Error\"] {\n --cb-container-border: var(--cb-feedback-error-text);\n --cb-fill: var(--cb-feedback-error-text);\n}\n\n/* =============================================================\n States — applied via real :hover / :focus-within OR forced data-state.\n Disabled and forced states should NOT pick up the natural hover/focus\n styles, so the selectors guard against them.\n ============================================================= */\n\n/* Hover / Focused / Pressed: light tint behind the box. */\n.eds-cb:not([data-state=\"Disabled\"]):hover .eds-cb__state-layer,\n.eds-cb:not([data-state=\"Disabled\"]):focus-within .eds-cb__state-layer,\n.eds-cb[data-state=\"Hover\"] .eds-cb__state-layer,\n.eds-cb[data-state=\"Focused\"] .eds-cb__state-layer,\n.eds-cb[data-state=\"Pressed\"] .eds-cb__state-layer {\n background: var(--cb-background-selected);\n}\n.eds-cb[data-validation=\"Error\"]:not([data-state=\"Disabled\"]):hover .eds-cb__state-layer,\n.eds-cb[data-validation=\"Error\"]:not([data-state=\"Disabled\"]):focus-within .eds-cb__state-layer,\n.eds-cb[data-validation=\"Error\"][data-state=\"Hover\"] .eds-cb__state-layer,\n.eds-cb[data-validation=\"Error\"][data-state=\"Focused\"] .eds-cb__state-layer,\n.eds-cb[data-validation=\"Error\"][data-state=\"Pressed\"] .eds-cb__state-layer {\n background: var(--cb-feedback-error-background);\n}\n\n/* Disabled: gray container border, gray fill, gray label. */\n.eds-cb[data-state=\"Disabled\"] {\n --cb-container-border: var(--cb-text-tertiary);\n --cb-fill: var(--cb-text-secondary);\n --cb-label: var(--cb-text-disabled);\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-cb-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-cb-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-cb-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-cb-matrix__row {\n display: grid;\n grid-template-columns: 120px 1fr 1fr 1fr;\n align-items: center;\n gap: 12px;\n}\n.eds-cb-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-cb-matrix__sub {\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-cb-matrix__col-head {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-checkbox]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-checkbox\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\nfunction CheckIcon() {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <path\n d=\"M3 7.2 L5.7 10 L11 4.5\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n\nfunction DashIcon() {\n return (\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <line\n x1=\"3\"\n y1=\"7\"\n x2=\"11\"\n y2=\"7\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n}\n\nlet idCounter = 0;\nfunction useGeneratedId(provided?: string) {\n const [id] = React.useState(() => provided ?? `eds-cb-${++idCounter}`);\n return id;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Checkbox = React.forwardRef<HTMLInputElement, CheckboxProps>(\n function Checkbox(\n {\n state,\n validation = \"None\",\n selected,\n defaultSelected = false,\n indeterminate = false,\n label,\n disabled = false,\n onChange,\n id: providedId,\n name,\n value,\n className,\n \"aria-label\": ariaLabel,\n },\n forwardedRef\n ) {\n ensureStyles();\n const id = useGeneratedId(providedId);\n const isControlled = selected !== undefined;\n const [internalSelected, setInternalSelected] = React.useState(defaultSelected);\n const checked = isControlled ? !!selected : internalSelected;\n\n // Wire the HTML `indeterminate` property (only settable via JS).\n const inputRef = React.useRef<HTMLInputElement | null>(null);\n React.useEffect(() => {\n if (inputRef.current) inputRef.current.indeterminate = indeterminate;\n }, [indeterminate]);\n\n const setRefs = React.useCallback(\n (node: HTMLInputElement | null) => {\n inputRef.current = node;\n if (typeof forwardedRef === \"function\") forwardedRef(node);\n else if (forwardedRef) forwardedRef.current = node;\n },\n [forwardedRef]\n );\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const next = e.target.checked;\n if (!isControlled) setInternalSelected(next);\n onChange?.(next);\n };\n\n const effectiveState: CheckboxState | undefined =\n state ?? (disabled ? \"Disabled\" : undefined);\n const isDisabled = disabled || effectiveState === \"Disabled\";\n const wrapperClass = \"eds-cb\" + (className ? ` ${className}` : \"\");\n\n return (\n <label\n className={wrapperClass}\n data-state={effectiveState}\n data-validation={validation}\n data-checked={checked || undefined}\n data-indeterminate={indeterminate || undefined}\n htmlFor={id}\n >\n <input\n ref={setRefs}\n id={id}\n name={name}\n value={value}\n type=\"checkbox\"\n className=\"eds-cb__input\"\n checked={checked}\n disabled={isDisabled}\n onChange={handleChange}\n aria-label={ariaLabel ?? (label ? undefined : \"Checkbox\")}\n aria-checked={indeterminate ? \"mixed\" : checked}\n aria-invalid={validation === \"Error\" || undefined}\n />\n <span className=\"eds-cb__state-layer\">\n <span className=\"eds-cb__box\">\n {(checked || indeterminate) && (\n <span className=\"eds-cb__icon-wrap\">\n {indeterminate ? <DashIcon /> : <CheckIcon />}\n </span>\n )}\n </span>\n </span>\n {label && <span className=\"eds-cb__label\">{label}</span>}\n </label>\n );\n }\n);\n\nexport default Checkbox;\n\n// ---------------------------------------------------------------------------\n// CheckboxMatrix — interactive showcase. Each row pairs the boolean toggles\n// (Unselected, Selected, Indeterminate) across the State × Validation matrix.\n// The Default-state row at the top is fully interactive (no forced state) so\n// you can click to toggle and tab to focus.\n// ---------------------------------------------------------------------------\nconst STATES: CheckboxState[] = [\n \"Default\",\n \"Hover\",\n \"Focused\",\n \"Pressed\",\n \"Disabled\",\n];\nconst VALIDATIONS: CheckboxValidation[] = [\"None\", \"Error\"];\n\nfunction MatrixRow({\n state,\n validation,\n showLabel,\n forced,\n}: {\n state: CheckboxState;\n validation: CheckboxValidation;\n showLabel?: boolean;\n forced?: boolean;\n}) {\n const stateProp = forced ? { state } : {};\n const labelProp = showLabel ? { label: \"Label text\" } : {};\n return (\n <div className=\"eds-cb-matrix__row\">\n <p className=\"eds-cb-matrix__row-label\">{state}</p>\n <Checkbox validation={validation} {...stateProp} {...labelProp} />\n <Checkbox\n validation={validation}\n defaultSelected\n {...stateProp}\n {...labelProp}\n />\n <Checkbox\n validation={validation}\n indeterminate\n {...stateProp}\n {...labelProp}\n />\n </div>\n );\n}\n\nexport function CheckboxMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-cb-matrix\">\n {VALIDATIONS.map((validation) => (\n <section key={validation} className=\"eds-cb-matrix__section\">\n <h3 className=\"eds-cb-matrix__heading\">Validation · {validation}</h3>\n <p className=\"eds-cb-matrix__sub\">\n With label visible. The Default row is fully interactive — click\n to toggle, tab to focus.\n </p>\n <div className=\"eds-cb-matrix__row\">\n <span className=\"eds-cb-matrix__col-head\">State</span>\n <span className=\"eds-cb-matrix__col-head\">Unselected</span>\n <span className=\"eds-cb-matrix__col-head\">Selected</span>\n <span className=\"eds-cb-matrix__col-head\">Indeterminate</span>\n </div>\n {STATES.map((state) => (\n <MatrixRow\n key={`${validation}-${state}`}\n state={state}\n validation={validation}\n showLabel\n forced={state !== \"Default\" && state !== \"Disabled\" ? true : state === \"Disabled\"}\n />\n ))}\n </section>\n ))}\n\n <section className=\"eds-cb-matrix__section\">\n <h3 className=\"eds-cb-matrix__heading\">Without label (None / Default)</h3>\n <div className=\"eds-cb-matrix__row\">\n <span className=\"eds-cb-matrix__col-head\">State</span>\n <span className=\"eds-cb-matrix__col-head\">Unselected</span>\n <span className=\"eds-cb-matrix__col-head\">Selected</span>\n <span className=\"eds-cb-matrix__col-head\">Indeterminate</span>\n </div>\n <MatrixRow state=\"Default\" validation=\"None\" />\n </section>\n </div>\n );\n}\n","/**\n * SelectorOption — React port of the Embleema Design System 2.0\n * Selector/Selector Option component (Figma node 4485:7). A card-style\n * row option used inside Boolean fields, option grids, and card-based\n * selection patterns. Supports a leading icon, a Radio indicator, a\n * Checkbox indicator, and a plain text label.\n *\n * Color bindings (Figma extraction):\n * - Default: bg Background/Field (#F8F8F8) + 1px Border/Default (#DDDDDD)\n * - Hover: 1px Border/Focus (#306AE8), Background/Field\n * - Focused: 1.5px Border/Focus (#306AE8) + focus ring\n * - Selected: bg Background/Selected (#E3ECFF) + 1.5px Border/Focus\n * - Error: bg Feedback/Error/Background + 1.5px Border/Error\n * - Warning: bg Feedback/Warning/Background + 1.5px Feedback/Warning/Indicator\n * - Success: bg Feedback/Success/Background + 1.5px Feedback/Success/Indicator\n * - AI: bg Feedback/AI/Background (#C7D9FF) + 1.5px AI/Light (#90B3FF)\n * - Disabled*: bg Background/Disabled (#F1F1F1) + 1.5px Border/Subtle\n * - ReadOnly*: same chrome as Disabled but selection (if any) stays visible\n */\n\nimport * as React from \"react\";\nimport { Radio } from \"./Radio\";\nimport { Checkbox } from \"./Checkbox\";\n\nexport type SelectorOptionState =\n | \"Default\"\n | \"Hover\"\n | \"Focused\"\n | \"Selected\"\n | \"Error\"\n | \"Warning\"\n | \"Success\"\n | \"AI\"\n | \"DisabledUnselected\"\n | \"DisabledSelected\"\n | \"ReadOnlyUnselected\"\n | \"ReadOnlySelected\";\n\nexport type SelectorOptionProps = {\n /** Force a visual state. When omitted, derived from selected + interaction. */\n state?: SelectorOptionState;\n label?: boolean | string;\n leadingIcon?: boolean | React.ReactNode;\n /** Render a Radio indicator inside the option. Mutually exclusive with checkbox. */\n radio?: boolean;\n /** Render a Checkbox indicator inside the option. */\n checkbox?: boolean;\n /** Controlled selection. */\n selected?: boolean;\n defaultSelected?: boolean;\n onChange?: (selected: boolean) => void;\n /** Underlying value passed to onChange via parent groups (not used internally). */\n value?: string;\n id?: string;\n name?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Option\";\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n --so-text-primary: #0E0E0E;\n --so-text-tertiary: #848484;\n --so-text-disabled: #848484;\n --so-bg-field: #F8F8F8;\n --so-bg-default: #FEFEFE;\n --so-bg-selected: #E3ECFF;\n --so-bg-disabled: #F1F1F1;\n --so-border-default: #DDDDDD;\n --so-border-subtle: #F1F1F1;\n --so-border-focus: #306AE8;\n --so-border-focus-ring: #A2BDF5;\n --so-border-error: #E02020;\n --so-feedback-error-bg: #FFE2E2;\n --so-feedback-warning-bg: #FFE6D5;\n --so-feedback-warning-indicator: #FA6400;\n --so-feedback-success-bg: #D7F3D7;\n --so-feedback-success-indicator: #32A032;\n --so-feedback-ai-bg: #C7D9FF;\n --so-ai-light: #90B3FF;\n --so-action-primary: #306AE8;\n}\n\n.eds-so {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 12px;\n background: var(--so-bg-field);\n border: 1px solid var(--so-border-default);\n border-radius: 12px;\n cursor: pointer;\n filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.12));\n transition: background 100ms, border-color 100ms;\n font-family: Nunito, sans-serif;\n text-align: left;\n width: 100%;\n box-sizing: border-box;\n outline: 0;\n}\n.eds-so:hover:not([data-locked=\"true\"]) {\n border-color: var(--so-border-focus);\n}\n.eds-so:focus-visible:not([data-locked=\"true\"]) {\n border: 1.5px solid var(--so-border-focus);\n box-shadow: 0 0 0 3px var(--so-bg-selected);\n}\n\n/* Forced state styles */\n.eds-so[data-state=\"Hover\"] { border-color: var(--so-border-focus); }\n.eds-so[data-state=\"Focused\"] {\n border: 1.5px solid var(--so-border-focus);\n box-shadow: 0 0 0 3px var(--so-bg-selected);\n}\n.eds-so[data-state=\"Selected\"],\n.eds-so[data-selected=\"true\"]:not([data-state=\"Error\"]):not([data-state=\"Warning\"]):not([data-state=\"Success\"]):not([data-state=\"AI\"]):not([data-state=\"DisabledUnselected\"]):not([data-state=\"ReadOnlyUnselected\"]):not([data-locked-unselected=\"true\"]) {\n background: var(--so-bg-selected);\n border: 1.5px solid var(--so-border-focus);\n}\n.eds-so[data-state=\"Error\"] {\n background: var(--so-feedback-error-bg);\n border: 1.5px solid var(--so-border-error);\n}\n.eds-so[data-state=\"Warning\"] {\n background: var(--so-feedback-warning-bg);\n border: 1.5px solid var(--so-feedback-warning-indicator);\n}\n.eds-so[data-state=\"Success\"] {\n background: var(--so-feedback-success-bg);\n border: 1.5px solid var(--so-feedback-success-indicator);\n}\n.eds-so[data-state=\"AI\"] {\n background: var(--so-feedback-ai-bg);\n border: 1.5px solid var(--so-ai-light);\n}\n.eds-so[data-state=\"DisabledUnselected\"],\n.eds-so[data-state=\"DisabledSelected\"] {\n background: var(--so-bg-disabled);\n border: 1.5px solid var(--so-border-subtle);\n cursor: not-allowed;\n filter: none;\n}\n.eds-so[data-state=\"DisabledSelected\"] {\n border-color: var(--so-border-default);\n}\n.eds-so[data-state=\"ReadOnlyUnselected\"],\n.eds-so[data-state=\"ReadOnlySelected\"] {\n background: var(--so-bg-disabled);\n border: 1.5px solid var(--so-border-subtle);\n cursor: default;\n filter: none;\n}\n.eds-so[data-state=\"ReadOnlySelected\"] {\n border-color: var(--so-border-default);\n}\n\n/* Leading icon */\n.eds-so__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n color: var(--so-action-primary);\n}\n.eds-so__icon svg { width: 20px; height: 20px; display: block; }\n.eds-so[data-locked=\"true\"] .eds-so__icon { color: var(--so-text-tertiary); }\n.eds-so[data-state=\"Error\"] .eds-so__icon { color: var(--so-border-error); }\n.eds-so[data-state=\"Warning\"] .eds-so__icon { color: var(--so-feedback-warning-indicator); }\n.eds-so[data-state=\"Success\"] .eds-so__icon { color: var(--so-feedback-success-indicator); }\n\n/* Label */\n.eds-so__label {\n flex: 1 1 0;\n min-width: 0;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--so-text-primary);\n word-break: break-word;\n}\n.eds-so[data-locked=\"true\"] .eds-so__label { color: var(--so-text-disabled); }\n\n/* Indicator slot — Radio/Checkbox are display-only here. pointer-events\n are disabled so every click anywhere in the row reaches the wrapping\n button's onClick (single toggle source). */\n.eds-so__indicator {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n pointer-events: none;\n}\n\n/* Default leading-icon glyph (settings cog) — only used when leadingIcon=true. */\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-selector-option]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-selector-option\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// Default leading icon (small Settings glyph) — kept simple, matches the\n// generic Figma placeholder. Override by passing a ReactNode for leadingIcon.\nfunction DefaultLeadingIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"10\" cy=\"10\" r=\"2.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path\n d=\"M10 1.5v2M10 16.5v2M3.5 10h-2M18.5 10h-2M5.4 5.4l-1.4-1.4M16 16l-1.4-1.4M14.6 5.4L16 4M4 16l1.4-1.4\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n}\n\nfunction renderLeading(value: boolean | React.ReactNode | undefined): React.ReactNode {\n if (!value) return null;\n if (value === true) {\n return <span className=\"eds-so__icon\" aria-hidden><DefaultLeadingIcon /></span>;\n }\n return <span className=\"eds-so__icon\" aria-hidden>{value}</span>;\n}\n\n// ---------------------------------------------------------------------------\n// Helpers — derive locked + selected from an explicit `state` prop.\n// ---------------------------------------------------------------------------\nfunction stateSelected(s: SelectorOptionState | undefined): boolean | undefined {\n if (s === \"Selected\" || s === \"DisabledSelected\" || s === \"ReadOnlySelected\") return true;\n if (s === \"DisabledUnselected\" || s === \"ReadOnlyUnselected\") return false;\n return undefined;\n}\nfunction stateLocked(s: SelectorOptionState | undefined): boolean {\n return s === \"DisabledUnselected\" || s === \"DisabledSelected\"\n || s === \"ReadOnlyUnselected\" || s === \"ReadOnlySelected\";\n}\nfunction stateDisabled(s: SelectorOptionState | undefined): boolean {\n return s === \"DisabledUnselected\" || s === \"DisabledSelected\";\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const SelectorOption = React.forwardRef<HTMLButtonElement, SelectorOptionProps>(\n function SelectorOption(\n {\n state,\n label = true,\n leadingIcon = false,\n radio = false,\n checkbox = false,\n selected,\n defaultSelected,\n onChange,\n value,\n id,\n name,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = selected !== undefined;\n const [internal, setInternal] = React.useState<boolean>(defaultSelected ?? false);\n // Forced state-prop selection wins; then controlled; then internal.\n const forcedSel = stateSelected(state);\n const current = forcedSel !== undefined ? forcedSel : (isControlled ? selected! : internal);\n\n const locked = stateLocked(state);\n const disabled = stateDisabled(state);\n const isError = state === \"Error\";\n\n const toggle = () => {\n if (locked) return;\n const next = !current;\n if (!isControlled && forcedSel === undefined) setInternal(next);\n onChange?.(next);\n };\n\n const handleClick: React.MouseEventHandler<HTMLButtonElement> = () => {\n // The entire row is the tap target — always toggle when the row is\n // clicked, including clicks that land on the Radio / Checkbox glyph.\n // The indicator children are display-only (no onChange passed), so\n // there's no double-toggle from a nested handler firing alongside.\n toggle();\n };\n\n const handleKey: React.KeyboardEventHandler<HTMLButtonElement> = (e) => {\n if (locked) return;\n if (e.key === \" \" || e.key === \"Enter\") {\n e.preventDefault();\n toggle();\n }\n };\n\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n\n // Map our SelectorOption state to the child Radio/Checkbox `state`. Most\n // states leave the child in Default; lock states forward to Disabled.\n const childInteractive = !locked;\n\n // Indicator children are display-only: no onChange, pointer-events\n // pass through to the SelectorOption button so the row's own click\n // handler is the single source of truth for toggling.\n const indicatorEl =\n radio ? (\n <span className=\"eds-so__indicator\" aria-hidden>\n <Radio\n selected={current}\n disabled={disabled}\n name={name}\n value={value}\n id={id ? `${id}-radio` : undefined}\n aria-label={ariaLabel ?? labelText}\n />\n </span>\n ) : checkbox ? (\n <span className=\"eds-so__indicator\" aria-hidden>\n <Checkbox\n selected={current}\n disabled={disabled}\n validation={isError ? \"Error\" : \"None\"}\n name={name}\n value={value}\n id={id ? `${id}-checkbox` : undefined}\n aria-label={ariaLabel ?? labelText}\n />\n </span>\n ) : null;\n\n const wrapperClass = \"eds-so\" + (className ? ` ${className}` : \"\");\n // Some states semantically imply selected/unselected for chrome rendering.\n const dataSelected = state === undefined ? current : forcedSel ?? current;\n const role = radio ? \"radio\" : checkbox ? \"checkbox\" : \"button\";\n\n return (\n <button\n ref={ref}\n type=\"button\"\n className={wrapperClass}\n data-state={state}\n data-selected={dataSelected || undefined}\n data-locked={locked || undefined}\n disabled={disabled}\n onClick={handleClick}\n onKeyDown={handleKey}\n role={role}\n aria-checked={role !== \"button\" ? !!dataSelected : undefined}\n aria-pressed={role === \"button\" && !radio && !checkbox ? !!dataSelected : undefined}\n aria-disabled={disabled || undefined}\n aria-label={ariaLabel}\n tabIndex={locked ? -1 : 0}\n id={id}\n >\n {renderLeading(leadingIcon)}\n {indicatorEl}\n {label && <span className=\"eds-so__label\">{labelText}</span>}\n </button>\n );\n }\n);\n\nexport default SelectorOption;\n\n// ---------------------------------------------------------------------------\n// SelectorOptionMatrix — interactive showcase across States × Modes.\n// ---------------------------------------------------------------------------\nexport function SelectorOptionMatrix() {\n ensureStyles();\n const [a, setA] = React.useState(false);\n const [b, setB] = React.useState(true);\n const [c, setC] = React.useState(false);\n\n const states: SelectorOptionState[] = [\n \"Default\", \"Hover\", \"Focused\", \"Selected\", \"Error\", \"Warning\",\n \"Success\", \"AI\", \"DisabledUnselected\", \"DisabledSelected\",\n \"ReadOnlyUnselected\", \"ReadOnlySelected\",\n ];\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (click to select)\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 12, maxWidth: 320 }}>\n <SelectorOption label=\"Yes\" radio selected={a} onChange={setA} />\n <SelectorOption label=\"Confirm enrollment\" checkbox selected={b} onChange={setB} />\n <SelectorOption label=\"Plain row\" leadingIcon selected={c} onChange={setC} />\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n All states · plain row\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(220px, 1fr))\", gap: 12 }}>\n {states.map((st) => (\n <SelectorOption key={st} state={st} label={st} />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n All states · with Radio\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(220px, 1fr))\", gap: 12 }}>\n {states.map((st) => (\n <SelectorOption key={st} state={st} label={st} radio />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n All states · with Checkbox\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(220px, 1fr))\", gap: 12 }}>\n {states.map((st) => (\n <SelectorOption key={st} state={st} label={st} checkbox />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Leading icon (default)\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(220px, 1fr))\", gap: 12 }}>\n {([\"Default\", \"Selected\", \"Error\", \"Warning\", \"Success\", \"AI\"] as SelectorOptionState[]).map((st) => (\n <SelectorOption key={st} state={st} label={st} leadingIcon />\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Boolean — React port of the Embleema Design System 2.0 Input/Boolean\n * component (Figma node 4498:1262). A binary yes/no toggle field used in\n * clinical forms and surveys. Renders two card-style selector options with\n * radio indicators, plus an optional label, in vertical or horizontal\n * layouts, with the label positioned above or to the left.\n *\n * Color bindings:\n * - Option card bg: Background/Field (#F8F8F8)\n * - Option border: Border/Default (#DDDDDD) (Error: Border/Error 1.5px)\n * - Selected radio: Action/Primary/Background (#306AE8) ring + dot\n * - Error bg/border: Feedback/Error/Background / Border/Error\n * - Error helper: Feedback/Error/Text (#B31A1A), body/sm-semibold\n * - Disabled bg: Background/Disabled (#F1F1F1)\n * - Label text: Text/Primary (#0E0E0E); Error → with red asterisk\n * - ReadOnly: Background/Disabled fill, locked, but selection stays\n */\n\nimport * as React from \"react\";\nimport { SelectorOption } from \"./SelectorOption\";\nimport type { SelectorOptionState } from \"./SelectorOption\";\n\nexport type BooleanState = \"Default\" | \"Error\" | \"Disabled\" | \"ReadOnly\";\nexport type BooleanDirection = \"Vertical\" | \"Horizontal\";\nexport type BooleanLabelPosition = \"Top\" | \"Left\";\n\nexport type BooleanProps = {\n state?: BooleanState;\n direction?: BooleanDirection;\n labelPosition?: BooleanLabelPosition;\n label?: boolean | string;\n required?: boolean;\n /** Display text for the two options. Defaults to \"Yes\" / \"No\". */\n yesLabel?: string;\n noLabel?: string;\n /** Underlying values returned via onChange. Defaults to true / false. */\n yesValue?: boolean | string;\n noValue?: boolean | string;\n /** Controlled value. */\n value?: boolean | string | null;\n defaultValue?: boolean | string | null;\n onChange?: (value: boolean | string | null) => void;\n /** Override the default error/helper text. */\n helperText?: string;\n id?: string;\n name?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Label or question\";\nconst DEFAULT_ERROR_HELPER = \"This question is required\";\nconst LEFT_LABEL_WIDTH = 220;\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --bo-text-primary: #0E0E0E;\n --bo-text-secondary: #5E5E5E;\n --bo-text-tertiary: #848484;\n --bo-text-error: #E02020;\n --bo-text-disabled: #848484;\n --bo-text-info-icon: #306AE8;\n --bo-feedback-error-bg: #FFE2E2;\n --bo-feedback-error-text: #B31A1A;\n --bo-action-primary: #306AE8;\n --bo-bg-field: #F8F8F8;\n --bo-bg-default: #FEFEFE;\n --bo-bg-disabled: #F1F1F1;\n --bo-border-default: #DDDDDD;\n --bo-border-subtle: #F1F1F1;\n --bo-border-error: #E02020;\n}\n\n.eds-bool {\n display: flex;\n width: 100%;\n font-family: Nunito, sans-serif;\n}\n.eds-bool[data-label-position=\"Top\"] {\n flex-direction: column;\n align-items: stretch;\n gap: 12px;\n}\n.eds-bool[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 8px;\n}\n\n/* Label */\n.eds-bool__label-slot[data-label-position=\"Left\"] {\n width: ${LEFT_LABEL_WIDTH}px;\n flex-shrink: 0;\n padding-top: 14px;\n}\n.eds-bool__label {\n display: inline-flex;\n align-items: center;\n gap: 2px;\n}\n.eds-bool__required {\n color: var(--bo-feedback-error-text);\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n}\n.eds-bool__label-icon {\n display: inline-flex;\n align-items: center;\n width: 16px;\n height: 16px;\n color: var(--bo-text-info-icon);\n flex-shrink: 0;\n}\n.eds-bool__label-icon svg { width: 16px; height: 16px; display: block; }\n.eds-bool__label-text {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--bo-text-primary);\n margin: 0;\n}\n.eds-bool[data-state=\"Disabled\"] .eds-bool__label-text { color: var(--bo-text-disabled); }\n\n/* Body (the options + helper column) */\n.eds-bool__body {\n display: flex;\n flex-direction: column;\n gap: 8px;\n flex: 1 1 auto;\n min-width: 0;\n}\n\n/* Options group — wraps SelectorOption children. Vertical stacks them\n (each SelectorOption is width:100% by default); Horizontal puts them\n side-by-side with flex:1 so they share the row evenly. */\n.eds-bool__options {\n display: flex;\n gap: 12px;\n width: 100%;\n}\n.eds-bool[data-direction=\"Vertical\"] .eds-bool__options { flex-direction: column; }\n.eds-bool[data-direction=\"Horizontal\"] .eds-bool__options { flex-direction: row; }\n.eds-bool[data-direction=\"Horizontal\"] .eds-bool__options > .eds-so { flex: 1 1 0; }\n\n/* Selector option card */\n.eds-bool__option {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 12px;\n background: var(--bo-bg-field);\n border: 1px solid var(--bo-border-default);\n border-radius: 12px;\n cursor: pointer;\n filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.12));\n transition: background 100ms, border-color 100ms;\n font-family: Nunito, sans-serif;\n text-align: left;\n box-sizing: border-box;\n width: 100%;\n}\n.eds-bool__option:hover:not(:disabled) {\n border-color: var(--bo-action-primary);\n}\n.eds-bool__option:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n.eds-bool__option[data-selected=\"true\"] {\n border-color: var(--bo-action-primary);\n}\n\n.eds-bool[data-state=\"Error\"] .eds-bool__option {\n background: var(--bo-feedback-error-bg);\n border: 1.5px solid var(--bo-border-error);\n}\n.eds-bool[data-state=\"Disabled\"] .eds-bool__option {\n background: var(--bo-bg-disabled);\n border: 1.5px solid var(--bo-border-subtle);\n cursor: not-allowed;\n filter: none;\n}\n.eds-bool[data-state=\"ReadOnly\"] .eds-bool__option {\n background: var(--bo-bg-disabled);\n border: 1.5px solid var(--bo-border-subtle);\n cursor: default;\n filter: none;\n}\n\n/* Radio indicator — 32×32 outer with 24×24 SVG */\n.eds-bool__radio {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n flex-shrink: 0;\n position: relative;\n color: var(--bo-action-primary);\n}\n.eds-bool__radio svg { width: 24px; height: 24px; display: block; }\n.eds-bool[data-state=\"Disabled\"] .eds-bool__radio,\n.eds-bool[data-state=\"ReadOnly\"] .eds-bool__radio { color: var(--bo-text-tertiary); }\n.eds-bool[data-state=\"Error\"] .eds-bool__option[data-selected=\"true\"] .eds-bool__radio {\n color: var(--bo-border-error);\n}\n\n.eds-bool__option-label {\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--bo-text-primary);\n flex: 1 1 0;\n min-width: 0;\n word-break: break-word;\n}\n.eds-bool[data-state=\"Disabled\"] .eds-bool__option-label,\n.eds-bool[data-state=\"ReadOnly\"] .eds-bool__option-label {\n color: var(--bo-text-disabled);\n}\n\n/* Helper / error text */\n.eds-bool__helper {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 1px 0;\n width: 100%;\n}\n.eds-bool__helper-icon {\n display: inline-flex;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n color: var(--bo-feedback-error-text);\n}\n.eds-bool__helper-icon svg { width: 100%; height: 100%; display: block; }\n.eds-bool__helper-text {\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 14px;\n line-height: 1.5;\n color: var(--bo-feedback-error-text);\n margin: 0;\n flex: 1 1 0;\n min-width: 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-boolean]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-boolean\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Icons — radio (unchecked) / radio-checked / info / error close-circle\n// ---------------------------------------------------------------------------\nfunction RadioUnchecked() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" strokeWidth=\"2\" />\n </svg>\n );\n}\nfunction RadioChecked() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" strokeWidth=\"2\" />\n <circle cx=\"12\" cy=\"12\" r=\"5\" fill=\"currentColor\" />\n </svg>\n );\n}\nfunction InfoIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M10 14.5C10.21 14.5 10.39 14.43 10.53 14.28C10.68 14.14 10.75 13.96 10.75 13.75V9.75C10.75 9.54 10.68 9.36 10.53 9.22C10.39 9.07 10.21 9 10 9C9.79 9 9.61 9.07 9.47 9.22C9.32 9.36 9.25 9.54 9.25 9.75V13.75C9.25 13.96 9.32 14.14 9.47 14.28C9.61 14.43 9.79 14.5 10 14.5ZM10 7.5C10.21 7.5 10.39 7.43 10.53 7.28C10.68 7.14 10.75 6.96 10.75 6.75C10.75 6.54 10.68 6.36 10.53 6.22C10.39 6.07 10.21 6 10 6C9.79 6 9.61 6.07 9.47 6.22C9.32 6.36 9.25 6.54 9.25 6.75C9.25 6.96 9.32 7.14 9.47 7.28C9.61 7.43 9.79 7.5 10 7.5ZM10 19C8.75 19 7.58 18.76 6.48 18.29C5.38 17.81 4.42 17.17 3.61 16.36C2.79 15.54 2.15 14.59 1.68 13.49C1.2 12.39 0.96 11.21 0.96 9.96C0.96 8.71 1.2 7.54 1.68 6.44C2.15 5.34 2.79 4.38 3.61 3.57C4.42 2.76 5.38 2.11 6.48 1.64C7.58 1.16 8.75 0.93 10 0.93C11.25 0.93 12.42 1.16 13.52 1.64C14.62 2.11 15.58 2.76 16.39 3.57C17.21 4.38 17.85 5.34 18.32 6.44C18.8 7.54 19.04 8.71 19.04 9.96C19.04 11.21 18.8 12.39 18.32 13.49C17.85 14.59 17.21 15.54 16.39 16.36C15.58 17.17 14.62 17.81 13.52 18.29C12.42 18.76 11.25 19 10 19ZM10 17.5C12.1 17.5 13.87 16.77 15.32 15.32C16.77 13.87 17.5 12.1 17.5 10C17.5 7.9 16.77 6.12 15.32 4.67C13.87 3.22 12.1 2.5 10 2.5C7.9 2.5 6.12 3.22 4.67 4.67C3.22 6.12 2.5 7.9 2.5 10C2.5 12.1 3.22 13.87 4.67 15.32C6.12 16.77 7.9 17.5 10 17.5Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nfunction CloseCircleGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"8\" cy=\"8\" r=\"6\" stroke=\"#B31A1A\" strokeWidth=\"1.5\" />\n <path d=\"M6 6L10 10M10 6L6 10\" stroke=\"#B31A1A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Boolean_ = React.forwardRef<HTMLDivElement, BooleanProps>(\n function Boolean_(\n {\n state = \"Default\",\n direction = \"Vertical\",\n labelPosition = \"Top\",\n label = true,\n required = false,\n yesLabel = \"Yes\",\n noLabel = \"No\",\n yesValue = true,\n noValue = false,\n value,\n defaultValue,\n onChange,\n helperText,\n id,\n name,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = value !== undefined;\n const [internal, setInternal] = React.useState<boolean | string | null>(\n defaultValue ?? null\n );\n const current = isControlled ? value ?? null : internal;\n\n const disabled = state === \"Disabled\";\n const readOnly = state === \"ReadOnly\";\n const locked = disabled || readOnly;\n const isError = state === \"Error\";\n\n const select = (v: boolean | string) => {\n if (locked) return;\n if (!isControlled) setInternal(v);\n onChange?.(v);\n };\n\n const wrapperClass = \"eds-bool\" + (className ? ` ${className}` : \"\");\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n const helperContent = helperText ?? DEFAULT_ERROR_HELPER;\n\n const yesSelected = current === yesValue;\n const noSelected = current === noValue;\n\n // Map the Boolean field's state to the per-option SelectorOption state.\n // Selected and unselected options need different state names because\n // SelectorOption distinguishes them for Disabled/ReadOnly.\n const optionState = (selected: boolean): SelectorOptionState | undefined => {\n if (state === \"Error\") return \"Error\";\n if (state === \"Disabled\") return selected ? \"DisabledSelected\" : \"DisabledUnselected\";\n if (state === \"ReadOnly\") return selected ? \"ReadOnlySelected\" : \"ReadOnlyUnselected\";\n return selected ? \"Selected\" : \"Default\";\n };\n\n const renderOption = (\n val: boolean | string,\n text: string,\n selected: boolean,\n optionId?: string\n ) => (\n <SelectorOption\n key={String(val)}\n id={optionId}\n name={name}\n label={text}\n radio\n state={optionState(selected)}\n selected={selected}\n onChange={() => select(val)}\n aria-label={text}\n />\n );\n\n const labelEl = label ? (\n <div className=\"eds-bool__label-slot\" data-label-position={labelPosition}>\n <div className=\"eds-bool__label\">\n {(required || isError) && (\n <span className=\"eds-bool__required\" aria-hidden>*</span>\n )}\n <span className=\"eds-bool__label-icon\" aria-hidden><InfoIcon /></span>\n <p className=\"eds-bool__label-text\" id={id ? `${id}-label` : undefined}>\n {labelText}\n </p>\n </div>\n </div>\n ) : null;\n\n const helperEl = isError ? (\n <div className=\"eds-bool__helper\" role=\"alert\">\n <span className=\"eds-bool__helper-icon\"><CloseCircleGlyph /></span>\n <p className=\"eds-bool__helper-text\">{helperContent}</p>\n </div>\n ) : null;\n\n return (\n <div\n ref={ref}\n className={wrapperClass}\n data-state={state}\n data-direction={direction}\n data-label-position={labelPosition}\n role=\"radiogroup\"\n aria-labelledby={label && id ? `${id}-label` : undefined}\n aria-label={!label ? ariaLabel ?? \"Boolean question\" : undefined}\n >\n {labelEl}\n <div className=\"eds-bool__body\">\n <div className=\"eds-bool__options\">\n {renderOption(yesValue, yesLabel, yesSelected, id ? `${id}-yes` : undefined)}\n {renderOption(noValue, noLabel, noSelected, id ? `${id}-no` : undefined)}\n </div>\n {helperEl}\n </div>\n </div>\n );\n }\n);\n\n// Export under both \"Boolean\" alias (the design-system name) and as default.\n// \"Boolean\" is a JS built-in, so the implementation is named Boolean_ above.\nexport { Boolean_ as Boolean };\nexport default Boolean_;\n\n// ---------------------------------------------------------------------------\n// BooleanMatrix — interactive showcase across State × Direction × LabelPosition.\n// ---------------------------------------------------------------------------\nexport function BooleanMatrix() {\n ensureStyles();\n const [v1, setV1] = React.useState<boolean | string | null>(null);\n const [v2, setV2] = React.useState<boolean | string | null>(true);\n\n const states: BooleanState[] = [\"Default\", \"Error\", \"Disabled\", \"ReadOnly\"];\n const directions: BooleanDirection[] = [\"Vertical\", \"Horizontal\"];\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (click to select)\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 24, maxWidth: 520 }}>\n <Boolean_\n label=\"Has the participant taken any medication today?\"\n value={v1}\n onChange={setV1}\n direction=\"Vertical\"\n />\n <Boolean_\n label=\"Did the participant complete the questionnaire?\"\n value={v2}\n onChange={setV2}\n direction=\"Horizontal\"\n labelPosition=\"Top\"\n />\n </div>\n </section>\n\n {directions.map((dir) => (\n <section key={dir} style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Direction = {dir} · LabelPosition = Top\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: dir === \"Vertical\" ? \"repeat(auto-fit, minmax(220px, 1fr))\" : \"repeat(auto-fit, minmax(380px, 1fr))\", gap: 24 }}>\n {states.map((st) => (\n <Boolean_\n key={st}\n state={st}\n direction={dir}\n label\n defaultValue={st === \"ReadOnly\" ? true : null}\n />\n ))}\n </div>\n </section>\n ))}\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n LabelPosition = Left\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 16, maxWidth: 620 }}>\n {states.map((st) => (\n <Boolean_\n key={st}\n state={st}\n direction=\"Horizontal\"\n labelPosition=\"Left\"\n label\n defaultValue={st === \"ReadOnly\" ? true : null}\n />\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Cards — React ports of Embleema Design System 2.0's Layout card components:\n * - TaskCard (Figma node 4985:211) — gradient task card with 5 colors\n * - NavigationCard (Figma node 4986:77) — Stacked or Horizontal nav card\n * - ContentCard (Figma node 5077:7) — tappable content card with logo,\n * text, action buttons, chevron,\n * and optional corner decoration\n *\n * Each export reads its layout, spacing, typography, icons, and colors from\n * the Figma source directly. Hover affordances are added on top of the spec\n * for interactivity (subtle lift via box-shadow + transform).\n *\n * Color tokens used (per embleema-design-system.md):\n * - Background/Default #FEFEFE\n * - Neutral/200 #F1F1F1\n * - Text/Primary #0E0E0E\n * - Text/Secondary #5E5E5E\n * - Text/Inverse #FEFEFE (white on the Task Card gradients)\n * - Action/Primary/Background #306AE8 (Content Card buttons)\n *\n * Task Card gradients are hardcoded per the Figma source (the spec notes the\n * gradients cannot be variable-bound in Figma).\n */\n\nimport * as React from \"react\";\n\n// ===========================================================================\n// Shared inline icons\n// ===========================================================================\nfunction HomeIcon() {\n return (\n <svg viewBox=\"0 0 18.2457 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M1.82457 18.1754H5.89487V12.0467C5.89487 11.7353 6.00019 11.4742 6.21083 11.2634C6.42167 11.0527 6.68278 10.9474 6.99418 10.9474H11.2515C11.5629 10.9474 11.824 11.0527 12.0348 11.2634C12.2455 11.4742 12.3508 11.7353 12.3508 12.0467V18.1754H16.4211V7.41504C16.4211 7.35281 16.4074 7.29635 16.3801 7.24566C16.3529 7.19498 16.3159 7.15008 16.2691 7.11095L9.34513 1.90637C9.28269 1.85184 9.20859 1.82457 9.12284 1.82457C9.03708 1.82457 8.96299 1.85184 8.90055 1.90637L1.97661 7.11095C1.92978 7.15008 1.89279 7.19498 1.86562 7.24566C1.83825 7.29635 1.82457 7.35281 1.82457 7.41504V18.1754ZM0 18.1754V7.41504C0 7.06696 0.077848 6.73722 0.233544 6.42582C0.389444 6.11423 0.604743 5.85767 0.879442 5.65616L7.80368 0.439721C8.18785 0.146574 8.62696 0 9.12101 0C9.61507 0 10.0554 0.146574 10.442 0.439721L17.3662 5.65616C17.6409 5.85767 17.8562 6.11423 18.0121 6.42582C18.1678 6.73722 18.2457 7.06696 18.2457 7.41504V18.1754C18.2457 18.6729 18.066 19.1014 17.7065 19.4608C17.3471 19.8203 16.9186 20 16.4211 20H11.6258C11.3142 20 11.0531 19.8946 10.8425 19.6837C10.6317 19.4731 10.5262 19.212 10.5262 18.9004V12.772H7.71944V18.9004C7.71944 19.212 7.61402 19.4731 7.40318 19.6837C7.19255 19.8946 6.93143 20 6.61984 20H1.82457C1.32707 20 0.898599 19.8203 0.53916 19.4608C0.17972 19.1014 0 18.6729 0 18.1754Z\"\n />\n </svg>\n );\n}\n\nfunction ClockIcon() {\n // Icon/Utility/AccessTime approximation — 20×20 viewBox, simple stroke-based\n // clock face. Inherits currentColor.\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.6\" />\n <path d=\"M10 5.8V10l3 2\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n );\n}\n\nfunction PlusIcon() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M8 2.5v11M2.5 8h11\" stroke=\"currentColor\" strokeWidth=\"1.8\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\nfunction ChevronRightIcon() {\n // Icon/Navigation/ChevronRight (Figma 4052:3010). Simple chevron path.\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M9 6l6 6-6 6\" stroke=\"currentColor\" strokeWidth=\"1.8\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n );\n}\n\nfunction SettingsCogIcon() {\n // Icon/Action/Settings approximation for the corner decoration.\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"8\" cy=\"8\" r=\"2\" stroke=\"currentColor\" strokeWidth=\"1.2\" />\n <path\n d=\"M8 1.5v1.7M8 12.8v1.7M3 3l1.2 1.2M11.8 11.8l1.2 1.2M1.5 8h1.7M12.8 8h1.7M3 13l1.2-1.2M11.8 4.2L13 3\"\n stroke=\"currentColor\"\n strokeWidth=\"1.2\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n}\n\n// ===========================================================================\n// Shared stylesheet\n// ===========================================================================\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --card-background-default: #FEFEFE;\n --card-neutral-200: #F1F1F1;\n --card-text-primary: #0E0E0E;\n --card-text-secondary: #5E5E5E;\n --card-text-inverse: #FEFEFE;\n --card-action-primary: #306AE8;\n}\n\n/* ------------------------------------------------------------------ *\n * Task Card — static container per spec. Only the buttons inside are *\n * interactive; the card itself doesn't lift or change cursor. *\n * ------------------------------------------------------------------ */\n.eds-task-card {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n justify-content: space-between;\n width: 400px;\n height: 203px;\n padding: 20px 16px;\n border-radius: 8px;\n color: var(--card-text-inverse);\n font-family: Nunito, sans-serif;\n box-sizing: border-box;\n position: relative;\n}\n\n/* Gradient backgrounds — hardcoded per Figma. */\n.eds-task-card[data-color=\"DarkBlue\"] {\n background: linear-gradient(to right, #1d408b, #306ae8);\n}\n.eds-task-card[data-color=\"Blue\"] {\n background: linear-gradient(to right, #644ad4 25%, #306ae8);\n}\n.eds-task-card[data-color=\"Green\"] {\n background: linear-gradient(to right, #0a595c, #028388 50%, #00afb2);\n}\n.eds-task-card[data-color=\"Magenta\"] {\n background: linear-gradient(to right, #c20a72 16%, #34208c);\n}\n.eds-task-card[data-color=\"Purple\"] {\n background: linear-gradient(to right, #8170cb, #34208c);\n}\n\n.eds-task-card__top {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n width: 100%;\n}\n.eds-task-card__text {\n flex: 1 1 0;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n overflow: hidden;\n}\n.eds-task-card__header {\n display: flex;\n align-items: center;\n gap: 12px;\n width: 100%;\n}\n.eds-task-card__heading {\n flex: 1 1 0;\n min-width: 0;\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 20px;\n line-height: 1.3;\n color: var(--card-text-inverse);\n}\n.eds-task-card__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 36px;\n height: 36px;\n flex-shrink: 0;\n color: var(--card-text-inverse);\n}\n.eds-task-card__icon svg { display: block; width: 100%; height: 100%; }\n.eds-task-card__body {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--card-text-inverse);\n}\n\n.eds-task-card__actions {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n width: 100%;\n}\n.eds-task-card__time {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 14px;\n line-height: 1.5;\n color: var(--card-text-inverse);\n white-space: nowrap;\n}\n.eds-task-card__time-icon {\n width: 20px;\n height: 20px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--card-text-inverse);\n}\n.eds-task-card__time-icon svg { display: block; width: 100%; height: 100%; }\n\n.eds-task-card__buttons {\n display: flex;\n align-items: stretch;\n gap: 12px;\n margin-left: auto;\n}\n.eds-task-card__btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n padding: 8px 16px;\n border-radius: 8px;\n border: 1px solid var(--card-text-inverse);\n background: transparent;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 14px;\n line-height: 1.2;\n letter-spacing: 0.01em;\n color: var(--card-text-inverse);\n transition: background-color 120ms ease-out;\n flex-shrink: 0;\n}\n.eds-task-card__btn:hover { background: rgba(255, 255, 255, 0.12); }\n.eds-task-card__btn svg { width: 16px; height: 16px; display: block; }\n\n/* ------------------------------------------------------------------ *\n * Navigation Card — static container per spec; the matrix demo no *\n * longer wires onClick on the card itself. *\n * ------------------------------------------------------------------ */\n.eds-nav-card {\n display: inline-flex;\n align-items: center;\n gap: 12px;\n padding: 20px;\n background: var(--card-background-default);\n border-radius: 8px;\n filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.12));\n font-family: Nunito, sans-serif;\n color: var(--card-text-primary);\n text-align: left;\n}\n.eds-nav-card[data-type=\"Stacked\"] {\n flex-direction: column;\n}\n.eds-nav-card[data-type=\"Horizontal\"] {\n flex-direction: row;\n width: 400px;\n align-items: center;\n}\n\n/* Image slot — 80 × 80 circular placeholder per the updated Figma source.\n Pass an image element via the image prop to swap in real artwork. */\n.eds-nav-card__image {\n position: relative;\n width: 80px;\n height: 80px;\n flex-shrink: 0;\n border-radius: 999px;\n overflow: hidden;\n background-color: var(--card-neutral-200);\n background-image:\n linear-gradient(45deg, #E0E0E0 25%, transparent 25%),\n linear-gradient(-45deg, #E0E0E0 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, #E0E0E0 75%),\n linear-gradient(-45deg, transparent 75%, #E0E0E0 75%);\n background-size: 12px 12px;\n background-position: 0 0, 0 6px, 6px -6px, -6px 0;\n}\n.eds-nav-card__image > * {\n width: 100%;\n height: 100%;\n display: block;\n border-radius: 999px;\n object-fit: cover;\n}\n\n.eds-nav-card__stacked-label {\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 16px;\n line-height: 1.5;\n color: var(--card-text-primary);\n white-space: nowrap;\n}\n\n.eds-nav-card__text {\n flex: 1 1 0;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 4px;\n overflow: hidden;\n}\n.eds-nav-card__label {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 18px;\n line-height: 1.5;\n color: var(--card-text-primary);\n}\n.eds-nav-card__body {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 14px;\n line-height: 1.5;\n color: var(--card-text-secondary);\n}\n.eds-nav-card__chevron {\n width: 24px;\n height: 24px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n color: var(--card-text-secondary);\n}\n.eds-nav-card__chevron svg { display: block; width: 100%; height: 100%; }\n\n/* ------------------------------------------------------------------ *\n * Content Card — static container per spec. Only the action buttons *\n * within the card carry interactive states. *\n * ------------------------------------------------------------------ */\n.eds-content-card {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 16px;\n width: 400px;\n padding: 40px 20px 20px;\n background: var(--card-background-default);\n border-radius: 8px;\n box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);\n overflow: hidden;\n font-family: Nunito, sans-serif;\n color: var(--card-text-primary);\n text-align: left;\n}\n\n.eds-content-card__row {\n display: flex;\n align-items: center;\n gap: 20px;\n width: 100%;\n}\n.eds-content-card__logo {\n width: 80px;\n height: 80px;\n flex-shrink: 0;\n background: var(--card-neutral-200);\n border-radius: 8px;\n}\n.eds-content-card__text {\n flex: 1 1 0;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n overflow: hidden;\n}\n.eds-content-card__header {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 20px;\n line-height: 1.3;\n color: var(--card-text-primary);\n}\n.eds-content-card__body {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 18px;\n line-height: 1.5;\n color: var(--card-text-secondary);\n}\n.eds-content-card__tertiary {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--card-text-secondary);\n}\n.eds-content-card__divider {\n height: 1px;\n width: 100%;\n background: var(--card-neutral-200);\n}\n.eds-content-card__actions {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n width: 100%;\n}\n.eds-content-card__buttons {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.eds-content-card__btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n padding: 8px 16px;\n border-radius: 8px;\n border: 0;\n background: transparent;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 14px;\n line-height: 1.2;\n letter-spacing: 0.01em;\n color: var(--card-action-primary);\n transition: background-color 120ms ease-out;\n width: 100px;\n}\n.eds-content-card__btn:hover { background: rgba(48, 106, 232, 0.08); }\n.eds-content-card__btn svg { width: 16px; height: 16px; display: block; }\n\n.eds-content-card__chevron {\n width: 24px;\n height: 24px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n color: var(--card-text-secondary);\n}\n.eds-content-card__chevron svg { display: block; width: 100%; height: 100%; }\n\n/* Corner decoration — 48×48 triangular gradient flag in the top-left corner,\n with a small icon overlaid. Approximated with a clipped div + linear\n gradient instead of the Figma binary asset. */\n.eds-content-card__corner {\n position: absolute;\n top: 0;\n left: 0;\n width: 48px;\n height: 48px;\n pointer-events: none;\n}\n.eds-content-card__corner-bg {\n position: absolute;\n inset: 0;\n background: linear-gradient(135deg, #c20a72 0%, #34208c 100%);\n clip-path: polygon(0 0, 100% 0, 0 100%);\n}\n.eds-content-card__corner-icon {\n position: absolute;\n top: 6px;\n left: 6px;\n width: 16px;\n height: 16px;\n color: #FEFEFE;\n}\n.eds-content-card__corner-icon svg { display: block; width: 100%; height: 100%; }\n\n/* ------------------------------------------------------------------ *\n * Survey Card — native mobile card with gradient background, status *\n * tag, time frame, completion counter, title, start button, and *\n * optional time estimate row. *\n * ------------------------------------------------------------------ */\n.eds-survey-card {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n width: 328px;\n padding: 20px;\n border-radius: 8px;\n background: linear-gradient(to bottom, #644AD4 23%, #306AE8 90%);\n color: var(--card-text-inverse);\n font-family: Nunito, sans-serif;\n box-sizing: border-box;\n}\n.eds-survey-card__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n width: 100%;\n}\n.eds-survey-card__tag-time {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n min-width: 0;\n}\n.eds-survey-card__tag {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 4px 12px;\n background: #C20A72;\n color: var(--card-text-inverse);\n border-radius: 999px;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 12px;\n line-height: 1.4;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n white-space: nowrap;\n}\n.eds-survey-card__time-frame {\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 14px;\n line-height: 1.5;\n color: var(--card-text-inverse);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.eds-survey-card__counter {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.5;\n color: var(--card-text-inverse);\n white-space: nowrap;\n flex-shrink: 0;\n}\n.eds-survey-card__title {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 20px;\n line-height: 1.3;\n color: var(--card-text-inverse);\n width: 100%;\n}\n.eds-survey-card__btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n padding: 8px 16px;\n border: 1px solid var(--card-text-inverse);\n background: transparent;\n border-radius: 8px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 14px;\n line-height: 1.2;\n letter-spacing: 0.01em;\n color: var(--card-text-inverse);\n transition: background-color 100ms ease-out;\n}\n.eds-survey-card__btn:hover { background: rgba(255, 255, 255, 0.12); }\n.eds-survey-card__btn:focus-visible {\n outline: 2px solid var(--card-text-inverse);\n outline-offset: 2px;\n}\n.eds-survey-card__btn svg { width: 16px; height: 16px; display: block; }\n.eds-survey-card__time {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 14px;\n line-height: 1.5;\n color: var(--card-text-inverse);\n}\n.eds-survey-card__time-icon {\n width: 20px;\n height: 20px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.eds-survey-card__time-icon svg { display: block; width: 100%; height: 100%; }\n\n/* ------------------------------------------------------------------ *\n * Matrix showcase *\n * ------------------------------------------------------------------ */\n.eds-cards-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-cards-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-cards-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-cards-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-cards-matrix__row {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: 24px;\n padding: 8px 0;\n}\n.eds-cards-matrix__controls {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: center;\n}\n.eds-cards-matrix__chip {\n padding: 6px 14px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n transition: background-color 120ms;\n}\n.eds-cards-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-cards-matrix__chip[data-active=\"true\"] {\n background: #306AE8;\n color: #FEFEFE;\n border-color: #306AE8;\n}\n.eds-cards-matrix__toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #0E0E0E;\n}\n.eds-cards-matrix__toggle input { accent-color: #306AE8; }\n.eds-cards-matrix__readout {\n font-size: 12px;\n color: #5E5E5E;\n margin: 4px 0 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-cards]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-cards\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ===========================================================================\n// TaskCard\n// ===========================================================================\nexport type TaskCardColor = \"DarkBlue\" | \"Blue\" | \"Green\" | \"Magenta\" | \"Purple\";\n\nexport type TaskCardAction = {\n label: string;\n leadingIcon?: React.ReactNode | boolean;\n onClick?: () => void;\n};\n\nexport type TaskCardProps = {\n header: string;\n body: string;\n color?: TaskCardColor;\n headerIcon?: React.ReactNode;\n /** Show the time-estimate row in the action band. */\n timeEstimate?: boolean;\n time?: string;\n primaryAction?: TaskCardAction;\n secondaryAction?: TaskCardAction;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_TASK_ACTION: TaskCardAction = { label: \"Button\" };\n\nfunction renderTaskButton(action: TaskCardAction) {\n const leading = action.leadingIcon;\n const showIcon = leading !== false;\n const iconNode = leading === true || leading === undefined ? <PlusIcon /> : leading;\n return (\n <button\n type=\"button\"\n className=\"eds-task-card__btn\"\n onClick={() => action.onClick?.()}\n >\n {showIcon && iconNode}\n <span>{action.label}</span>\n </button>\n );\n}\n\nexport const TaskCard = React.forwardRef<HTMLDivElement, TaskCardProps>(\n function TaskCard(\n {\n header,\n body,\n color = \"DarkBlue\",\n headerIcon,\n timeEstimate = true,\n time = \"time estimate\",\n primaryAction = DEFAULT_TASK_ACTION,\n secondaryAction = DEFAULT_TASK_ACTION,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-task-card\" + (className ? ` ${className}` : \"\");\n const icon = headerIcon ?? <HomeIcon />;\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-color={color}\n role=\"article\"\n aria-label={ariaLabel ?? `${header}${timeEstimate ? `, ${time}` : \"\"}`}\n >\n <div className=\"eds-task-card__top\">\n <div className=\"eds-task-card__text\">\n <div className=\"eds-task-card__header\">\n <p className=\"eds-task-card__heading\">{header}</p>\n <span className=\"eds-task-card__icon\" aria-hidden>\n {icon}\n </span>\n </div>\n <p className=\"eds-task-card__body\">{body}</p>\n </div>\n </div>\n <div className=\"eds-task-card__actions\">\n {timeEstimate && (\n <span className=\"eds-task-card__time\">\n <span className=\"eds-task-card__time-icon\" aria-hidden>\n <ClockIcon />\n </span>\n <span>{time}</span>\n </span>\n )}\n <div className=\"eds-task-card__buttons\">\n {renderTaskButton(primaryAction)}\n {renderTaskButton(secondaryAction)}\n </div>\n </div>\n </div>\n );\n }\n);\n\n// ===========================================================================\n// NavigationCard\n// ===========================================================================\nexport type NavigationCardType = \"Stacked\" | \"Horizontal\";\n\nexport type NavigationCardProps = {\n label: string;\n /** Only used on Horizontal. */\n body?: string;\n type?: NavigationCardType;\n /** Optional image to fill the 80 × 80 circular image slot. Pass an <img>\n or any node; omit to render the checkered placeholder per Figma. */\n image?: React.ReactNode;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nexport const NavigationCard = React.forwardRef<HTMLDivElement, NavigationCardProps>(\n function NavigationCard(\n {\n label,\n body = \"\",\n type = \"Stacked\",\n image,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-nav-card\" + (className ? ` ${className}` : \"\");\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n role=\"article\"\n aria-label={ariaLabel ?? label}\n >\n <span className=\"eds-nav-card__image\" aria-hidden>\n {image}\n </span>\n {type === \"Stacked\" ? (\n <span className=\"eds-nav-card__stacked-label\">{label}</span>\n ) : (\n <>\n <span className=\"eds-nav-card__text\">\n <p className=\"eds-nav-card__label\">{label}</p>\n {body && <p className=\"eds-nav-card__body\">{body}</p>}\n </span>\n <span className=\"eds-nav-card__chevron\" aria-hidden>\n <ChevronRightIcon />\n </span>\n </>\n )}\n </div>\n );\n }\n);\n\n// ===========================================================================\n// ContentCard\n// ===========================================================================\nexport type ContentCardAction = {\n label: string;\n leadingIcon?: React.ReactNode | boolean;\n onClick?: () => void;\n};\n\nexport type ContentCardProps = {\n header: string;\n body: string;\n tertiary?: string;\n logo?: boolean | React.ReactNode;\n tertiaryText?: boolean;\n cornerDecoration?: boolean;\n cornerIcon?: React.ReactNode;\n divider?: boolean;\n primaryAction?: ContentCardAction;\n secondaryAction?: ContentCardAction;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nfunction renderContentButton(action: ContentCardAction) {\n const leading = action.leadingIcon;\n const showIcon = leading !== false;\n const iconNode = leading === true || leading === undefined ? <PlusIcon /> : leading;\n return (\n <button\n type=\"button\"\n className=\"eds-content-card__btn\"\n onClick={() => action.onClick?.()}\n >\n {showIcon && iconNode}\n <span>{action.label}</span>\n </button>\n );\n}\n\nexport const ContentCard = React.forwardRef<HTMLDivElement, ContentCardProps>(\n function ContentCard(\n {\n header,\n body,\n tertiary = \"Tertiary text\",\n logo = true,\n tertiaryText = false,\n cornerDecoration = false,\n cornerIcon,\n divider = true,\n primaryAction = { label: \"Action\" },\n secondaryAction,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-content-card\" + (className ? ` ${className}` : \"\");\n const logoNode =\n logo === false\n ? null\n : logo === true\n ? <span className=\"eds-content-card__logo\" aria-hidden />\n : logo;\n const cornerIconNode = cornerIcon ?? <SettingsCogIcon />;\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n role=\"article\"\n aria-label={ariaLabel ?? header}\n >\n <div className=\"eds-content-card__row\">\n {logoNode}\n <div className=\"eds-content-card__text\">\n <p className=\"eds-content-card__header\">{header}</p>\n <p className=\"eds-content-card__body\">{body}</p>\n {tertiaryText && <p className=\"eds-content-card__tertiary\">{tertiary}</p>}\n </div>\n </div>\n {divider && <div className=\"eds-content-card__divider\" aria-hidden />}\n <div className=\"eds-content-card__actions\">\n <div className=\"eds-content-card__buttons\">\n {renderContentButton(primaryAction)}\n {secondaryAction && renderContentButton(secondaryAction)}\n </div>\n <span className=\"eds-content-card__chevron\" aria-hidden>\n <ChevronRightIcon />\n </span>\n </div>\n {cornerDecoration && (\n <div className=\"eds-content-card__corner\" aria-hidden>\n <div className=\"eds-content-card__corner-bg\" />\n <div className=\"eds-content-card__corner-icon\">{cornerIconNode}</div>\n </div>\n )}\n </div>\n );\n }\n);\n\n// ===========================================================================\n// SurveyCard — native mobile survey card (Figma node 4990:69)\n// ===========================================================================\nfunction CalendarIcon() {\n // Calendar/month glyph approximation for the time-estimate row.\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <rect x=\"2.5\" y=\"4\" width=\"15\" height=\"13.5\" rx=\"1.5\" stroke=\"currentColor\" strokeWidth=\"1.4\" />\n <path d=\"M2.5 8.2h15\" stroke=\"currentColor\" strokeWidth=\"1.4\" strokeLinecap=\"round\" />\n <path d=\"M6.5 2.5v3M13.5 2.5v3\" stroke=\"currentColor\" strokeWidth=\"1.4\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\nexport type SurveyCardProps = {\n title: string;\n tagLabel?: string;\n timeFrame?: string;\n counter?: string;\n primaryLabel?: string;\n onStartClick?: () => void;\n timeEstimate?: boolean;\n time?: string;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nexport const SurveyCard = React.forwardRef<HTMLDivElement, SurveyCardProps>(\n function SurveyCard(\n {\n title,\n tagLabel = \"Open\",\n timeFrame = \"Open for 5 days\",\n counter = \"0/10\",\n primaryLabel = \"Start\",\n onStartClick,\n timeEstimate = true,\n time = \"5 min\",\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-survey-card\" + (className ? ` ${className}` : \"\");\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n role=\"article\"\n aria-label={\n ariaLabel ??\n `${title}, ${counter} completed, ${timeFrame}${timeEstimate ? `, ${time}` : \"\"}`\n }\n >\n <div className=\"eds-survey-card__header\">\n <div className=\"eds-survey-card__tag-time\">\n <span className=\"eds-survey-card__tag\">{tagLabel}</span>\n <span className=\"eds-survey-card__time-frame\">{timeFrame}</span>\n </div>\n <span className=\"eds-survey-card__counter\">{counter}</span>\n </div>\n <p className=\"eds-survey-card__title\">{title}</p>\n <button\n type=\"button\"\n className=\"eds-survey-card__btn\"\n onClick={onStartClick}\n >\n <PlusIcon />\n <span>{primaryLabel}</span>\n </button>\n {timeEstimate && (\n <span className=\"eds-survey-card__time\">\n <span className=\"eds-survey-card__time-icon\" aria-hidden>\n <CalendarIcon />\n </span>\n <span>{time}</span>\n </span>\n )}\n </div>\n );\n }\n);\n\n// ===========================================================================\n// CardsMatrix\n// ===========================================================================\nconst TASK_COLORS: TaskCardColor[] = [\"DarkBlue\", \"Blue\", \"Green\", \"Magenta\", \"Purple\"];\n\nexport function CardsMatrix() {\n ensureStyles();\n const [taskClicks, setTaskClicks] = React.useState(0);\n const [contentClicks, setContentClicks] = React.useState(0);\n const [contentLogo, setContentLogo] = React.useState(true);\n const [contentTertiary, setContentTertiary] = React.useState(false);\n const [contentCorner, setContentCorner] = React.useState(false);\n const [contentDivider, setContentDivider] = React.useState(true);\n const [contentSecondary, setContentSecondary] = React.useState(false);\n\n return (\n <div className=\"eds-cards-matrix\">\n {/* -------------------------------------------------------------- */}\n <section className=\"eds-cards-matrix__section\">\n <h3 className=\"eds-cards-matrix__heading\">Task Card · 5 color variants</h3>\n <p className=\"eds-cards-matrix__sub\">\n Gradient card for actionable to-do items. Colors are hardcoded per\n Figma. Cards are tappable; the two action buttons fire their own\n handlers without bubbling.\n </p>\n <div className=\"eds-cards-matrix__row\">\n {TASK_COLORS.map((c) => (\n <TaskCard\n key={c}\n color={c}\n header=\"Card Header\"\n body=\"Body text description for this task card.\"\n time=\"time estimate\"\n primaryAction={{\n label: \"Button\",\n onClick: () => setTaskClicks((n) => n + 1),\n }}\n secondaryAction={{\n label: \"Button\",\n onClick: () => setTaskClicks((n) => n + 1),\n }}\n />\n ))}\n </div>\n <p className=\"eds-cards-matrix__readout\">\n Button taps fired: <strong>{taskClicks}</strong>\n </p>\n </section>\n\n {/* -------------------------------------------------------------- */}\n <section className=\"eds-cards-matrix__section\">\n <h3 className=\"eds-cards-matrix__heading\">Navigation Card · Stacked + Horizontal</h3>\n <p className=\"eds-cards-matrix__sub\">\n Each variant has an 80 × 80 circular image placeholder per the\n latest Figma source. The card is a static container; navigation\n behavior lives on the parent surface.\n </p>\n <div className=\"eds-cards-matrix__row\" style={{ alignItems: \"flex-start\" }}>\n <NavigationCard type=\"Stacked\" label=\"Home\" />\n <NavigationCard type=\"Stacked\" label=\"Health\" />\n <NavigationCard\n type=\"Horizontal\"\n label=\"Studies\"\n body=\"Track your enrolled studies and upcoming visits.\"\n />\n <NavigationCard\n type=\"Horizontal\"\n label=\"Profile\"\n body=\"Manage your account, notifications, and connected devices.\"\n />\n </div>\n </section>\n\n {/* -------------------------------------------------------------- */}\n <section className=\"eds-cards-matrix__section\">\n <h3 className=\"eds-cards-matrix__heading\">Content Card · interactive booleans</h3>\n <p className=\"eds-cards-matrix__sub\">\n Tappable navigation card with optional logo, tertiary text, corner\n decoration, divider, and secondary action. Toggle the booleans to\n see how the layout reflows.\n </p>\n <div className=\"eds-cards-matrix__controls\">\n <label className=\"eds-cards-matrix__toggle\">\n <input type=\"checkbox\" checked={contentLogo} onChange={(e) => setContentLogo(e.target.checked)} />\n Logo\n </label>\n <label className=\"eds-cards-matrix__toggle\">\n <input type=\"checkbox\" checked={contentTertiary} onChange={(e) => setContentTertiary(e.target.checked)} />\n TertiaryText\n </label>\n <label className=\"eds-cards-matrix__toggle\">\n <input type=\"checkbox\" checked={contentCorner} onChange={(e) => setContentCorner(e.target.checked)} />\n CornerDecoration\n </label>\n <label className=\"eds-cards-matrix__toggle\">\n <input type=\"checkbox\" checked={contentDivider} onChange={(e) => setContentDivider(e.target.checked)} />\n Divider\n </label>\n <label className=\"eds-cards-matrix__toggle\">\n <input type=\"checkbox\" checked={contentSecondary} onChange={(e) => setContentSecondary(e.target.checked)} />\n SecondaryButton\n </label>\n </div>\n <div className=\"eds-cards-matrix__row\">\n <ContentCard\n header=\"Card Header\"\n body=\"Card body description text.\"\n tertiary=\"Tertiary Text\"\n logo={contentLogo}\n tertiaryText={contentTertiary}\n cornerDecoration={contentCorner}\n divider={contentDivider}\n secondaryAction={\n contentSecondary\n ? {\n label: \"Action\",\n onClick: () => setContentClicks((n) => n + 1),\n }\n : undefined\n }\n primaryAction={{\n label: \"Action\",\n onClick: () => setContentClicks((n) => n + 1),\n }}\n />\n </div>\n <p className=\"eds-cards-matrix__readout\">\n Button taps fired: <strong>{contentClicks}</strong>\n </p>\n </section>\n\n {/* -------------------------------------------------------------- */}\n <section className=\"eds-cards-matrix__section\">\n <h3 className=\"eds-cards-matrix__heading\">Survey Card · native mobile</h3>\n <p className=\"eds-cards-matrix__sub\">\n Fixed 328 px width gradient card for native app survey lists.\n Tag, time frame, counter, title, and start action live on the\n card; toggle TimeEstimate to show or hide the duration row.\n </p>\n <div className=\"eds-cards-matrix__row\">\n <SurveyCard\n title=\"Daily wellness check\"\n tagLabel=\"Open\"\n timeFrame=\"Open for 3 days\"\n counter=\"0/10\"\n time=\"5 min\"\n timeEstimate\n />\n <SurveyCard\n title=\"Medication adherence survey\"\n tagLabel=\"New\"\n timeFrame=\"Open for 2 weeks\"\n counter=\"3/8\"\n time=\"10 min\"\n timeEstimate\n />\n <SurveyCard\n title=\"Quarterly quality of life\"\n tagLabel=\"Closing soon\"\n timeFrame=\"Closes tomorrow\"\n counter=\"0/20\"\n timeEstimate={false}\n />\n </div>\n </section>\n\n {/* -------------------------------------------------------------- */}\n <section className=\"eds-cards-matrix__section\">\n <h3 className=\"eds-cards-matrix__heading\">Content Card · preset configurations</h3>\n <p className=\"eds-cards-matrix__sub\">\n Two configurations called out in the Figma docs: Image Card (Logo on,\n CornerDecoration off) and Corner Icon Card (Logo off, CornerDecoration on).\n </p>\n <div className=\"eds-cards-matrix__row\">\n <ContentCard\n header=\"Image Card\"\n body=\"Logo on, CornerDecoration off.\"\n tertiary=\"Image Card\"\n tertiaryText\n logo\n cornerDecoration={false}\n primaryAction={{ label: \"Action\" }}\n secondaryAction={{ label: \"Action\" }}\n />\n <ContentCard\n header=\"Corner Icon Card\"\n body=\"Logo off, CornerDecoration on.\"\n logo={false}\n cornerDecoration\n primaryAction={{ label: \"Action\" }}\n />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Chip — React port of Embleema Design System 2.0's Selector/Chip component\n * (Figma node 5072:56).\n *\n * Interactive selection chip used for filtering, multi-select, and toggleable\n * options. For read-only metadata labels, use Feedback/Tag — chips are\n * interactive, tags are not.\n *\n * Structure mirrors the Figma source:\n * chip (rounded pill, horizontal flex)\n * ├── leading icon (optional, 16px, currentColor)\n * ├── label (Nunito 16/150% — Regular by default, SemiBold on Selected)\n * └── close button (optional, 16px)\n *\n * State coverage (all driven by data-checked + real :hover/:focus-visible):\n * - Default → Background/Default + Border/Strong (1px)\n * - Hover → Background/Default + Action/Primary/Background (1.5px) + 2px drop-shadow\n * - Focus → Default chip + 2.5px Border/FocusRing outline\n * - Selected → Blue/100 + Action/Primary/Background (2px), label SemiBold, 2px drop-shadow\n * - SelectedHover → Blue/200 + Action/Primary/Background (2px), label Regular, 2px drop-shadow\n * - SelectedFocus → Selected chip + 2.5px Border/FocusRing outline\n * - Disabled → Action/Disabled/Background + Neutral/300 (border), text Action/Disabled/Text\n *\n * The borders use inset box-shadow rather than real CSS borders, so the\n * 1 / 1.5 / 2 / 2.5 px width changes between states don't cause layout shift.\n *\n * Props:\n * - state : forced visual override for previews (matches Figma's\n * seven-state matrix). Omit in production — natural\n * :hover / :focus-visible / disabled drive everything.\n * - label : chip text (or pass children for richer content)\n * - selected : controlled selection\n * - defaultSelected: uncontrolled initial selection\n * - disabled : non-interactive, gray fill\n * - leadingIcon : boolean → default placeholder glyph; ReactNode → custom\n * - dismissible : show the close button\n * - onChange : called with the new selected boolean\n * - onDismiss : called when the close button is clicked\n * - visible : controlled visibility (for dismissal)\n * - defaultVisible : uncontrolled initial visibility (default true)\n */\n\nimport * as React from \"react\";\n\nexport type ChipState =\n | \"Default\"\n | \"Hover\"\n | \"Focus\"\n | \"Selected\"\n | \"SelectedHover\"\n | \"SelectedFocus\"\n | \"Disabled\";\n\nexport type ChipProps = {\n state?: ChipState;\n label?: string;\n children?: React.ReactNode;\n selected?: boolean;\n defaultSelected?: boolean;\n disabled?: boolean;\n leadingIcon?: boolean | React.ReactNode;\n dismissible?: boolean;\n onChange?: (selected: boolean) => void;\n onDismiss?: () => void;\n visible?: boolean;\n defaultVisible?: boolean;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — all colors come from the live Figma extraction. Two primitives\n// (Blue/100 + Blue/200) are referenced directly because the semantic layer\n// doesn't have aliases for them yet — flagged in comments.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600&display=swap\");\n\n:root {\n --chip-background-default: #FEFEFE;\n --chip-text-primary: #0E0E0E;\n --chip-action-primary: #306AE8;\n --chip-action-disabled-bg: #DDDDDD;\n --chip-action-disabled-text: #848484;\n --chip-neutral-300: #DDDDDD;\n --chip-border-strong: #848484;\n --chip-border-focus-ring: #A2BDF5;\n --chip-blue-100: #E3ECFF;\n --chip-blue-200: #A2BDF5;\n --chip-drop-shadow: 0 0 2px rgba(0, 0, 0, 0.08);\n}\n\n.eds-chip {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n padding: 4px 12px;\n border: 0;\n border-radius: 16px;\n background: var(--chip-background-default);\n color: var(--chip-text-primary);\n font-family: Nunito, sans-serif;\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5;\n cursor: pointer;\n user-select: none;\n white-space: nowrap;\n box-sizing: border-box;\n /* Border via inset shadow — no layout shift when width changes per state */\n box-shadow: inset 0 0 0 1px var(--chip-border-strong);\n transition:\n background-color 120ms ease-out,\n box-shadow 120ms ease-out,\n color 120ms ease-out;\n}\n.eds-chip:focus { outline: none; }\n.eds-chip:disabled,\n.eds-chip[data-state=\"Disabled\"] {\n cursor: not-allowed;\n}\n\n/* ---------- Hover (unselected) ---------- */\n.eds-chip:not(:disabled):not([data-state=\"Disabled\"]):not([data-state=\"Focus\"]):not([data-state=\"Selected\"]):not([data-state=\"SelectedHover\"]):not([data-state=\"SelectedFocus\"]):not([data-checked=\"true\"]):hover,\n.eds-chip[data-state=\"Hover\"] {\n box-shadow:\n inset 0 0 0 1.5px var(--chip-action-primary),\n var(--chip-drop-shadow);\n}\n\n/* ---------- Focus (unselected) — 2.5px ring outside the chip ---------- */\n.eds-chip:not(:disabled):not([data-state]):focus-visible,\n.eds-chip[data-state=\"Focus\"] {\n /* Inner chip keeps its current border; outline sits outside as the ring. */\n outline: 2.5px solid var(--chip-border-focus-ring);\n outline-offset: 0;\n}\n\n/* ---------- Selected ---------- */\n.eds-chip[data-checked=\"true\"]:not([data-state=\"Disabled\"]),\n.eds-chip[data-state=\"Selected\"] {\n background: var(--chip-blue-100);\n font-weight: 600;\n box-shadow:\n inset 0 0 0 2px var(--chip-action-primary),\n var(--chip-drop-shadow);\n}\n\n/* ---------- SelectedHover ---------- */\n.eds-chip[data-checked=\"true\"]:not(:disabled):not([data-state=\"Disabled\"]):not([data-state=\"Selected\"]):not([data-state=\"SelectedFocus\"]):hover,\n.eds-chip[data-state=\"SelectedHover\"] {\n background: var(--chip-blue-200);\n font-weight: 400;\n box-shadow:\n inset 0 0 0 2px var(--chip-action-primary),\n var(--chip-drop-shadow);\n}\n\n/* ---------- SelectedFocus ---------- */\n.eds-chip[data-checked=\"true\"]:not(:disabled):not([data-state]):focus-visible,\n.eds-chip[data-state=\"SelectedFocus\"] {\n background: var(--chip-blue-100);\n font-weight: 600;\n box-shadow:\n inset 0 0 0 2px var(--chip-action-primary),\n var(--chip-drop-shadow);\n outline: 2.5px solid var(--chip-border-focus-ring);\n outline-offset: 0;\n}\n\n/* ---------- Disabled ---------- */\n.eds-chip:disabled,\n.eds-chip[data-state=\"Disabled\"] {\n background: var(--chip-action-disabled-bg);\n color: var(--chip-action-disabled-text);\n font-weight: 400;\n box-shadow: inset 0 0 0 1px var(--chip-neutral-300);\n}\n\n/* ---------- Leading icon (16px slot, currentColor) ---------- */\n.eds-chip__icon {\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: currentColor;\n}\n.eds-chip__icon svg { display: block; width: 100%; height: 100%; }\n\n/* ---------- Close button ---------- */\n.eds-chip__close {\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n border: 0;\n padding: 0;\n background: transparent;\n color: currentColor;\n cursor: inherit;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 999px;\n transition: background-color 120ms ease-out;\n}\n.eds-chip__close:hover {\n background: rgba(0, 0, 0, 0.06);\n}\n.eds-chip__close:focus-visible {\n outline: 2px solid var(--chip-action-primary);\n outline-offset: 1px;\n}\n.eds-chip__close svg { display: block; width: 100%; height: 100%; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-chip-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-chip-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-chip-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-chip-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-chip-matrix__row {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 12px;\n padding: 8px 0;\n}\n.eds-chip-matrix__row-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n width: 120px;\n flex-shrink: 0;\n}\n.eds-chip-matrix__restore {\n align-self: flex-start;\n padding: 6px 12px;\n background: transparent;\n border: 1px solid #DDDDDD;\n border-radius: 4px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 14px;\n color: #306AE8;\n}\n.eds-chip-matrix__readout {\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-chip]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-chip\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — Close glyph from Icon/Action/Close (Figma node 4052:3034). The path\n// is in a 0-16 viewBox but the chip's 16×16 frame should only show the inner\n// ~10.67×10.67 portion (per Figma's 17.75% / 16.67% inset), so we wrap it in\n// a 0-24 viewBox and translate by the inset values. That matches the visible\n// X size in the Figma source exactly.\n// ---------------------------------------------------------------------------\nfunction CloseGlyph() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(4 4.26)\">\n <path\n fill=\"currentColor\"\n d=\"M8 9.70342L2.03802 15.6654C1.81496 15.8885 1.53105 16 1.18631 16C0.841572 16 0.557668 15.8885 0.334601 15.6654C0.111534 15.4423 0 15.1584 0 14.8137C0 14.4689 0.111534 14.185 0.334601 13.962L6.29658 8L0.334601 2.03802C0.111534 1.81496 0 1.53105 0 1.18631C0 0.841572 0.111534 0.557668 0.334601 0.334601C0.557668 0.111534 0.841572 0 1.18631 0C1.53105 0 1.81496 0.111534 2.03802 0.334601L8 6.29658L13.962 0.334601C14.185 0.111534 14.4689 0 14.8137 0C15.1584 0 15.4423 0.111534 15.6654 0.334601C15.8885 0.557668 16 0.841572 16 1.18631C16 1.53105 15.8885 1.81496 15.6654 2.03802L9.70342 8L15.6654 13.962C15.8885 14.185 16 14.4689 16 14.8137C16 15.1584 15.8885 15.4423 15.6654 15.6654C15.4423 15.8885 15.1584 16 14.8137 16C14.4689 16 14.185 15.8885 13.962 15.6654L8 9.70342Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction PlaceholderIcon() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M8 1.2l1.98 4.01 4.42.64-3.2 3.12.76 4.4L8 11.3l-3.96 2.08.76-4.4L1.6 5.85l4.42-.64L8 1.2z\" />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Chip = React.forwardRef<HTMLDivElement, ChipProps>(\n function Chip(\n {\n state,\n label,\n children,\n selected,\n defaultSelected = false,\n disabled = false,\n leadingIcon = false,\n dismissible = false,\n onChange,\n onDismiss,\n visible,\n defaultVisible = true,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n // --- visibility (for dismissal) ---\n const visibleControlled = visible !== undefined;\n const [internalVisible, setInternalVisible] = React.useState(defaultVisible);\n const isVisible = visibleControlled ? !!visible : internalVisible;\n\n // --- selection ---\n const selectedControlled = selected !== undefined;\n const [internalSelected, setInternalSelected] = React.useState(defaultSelected);\n const forcedSelectedByState =\n state === \"Selected\" || state === \"SelectedHover\" || state === \"SelectedFocus\";\n const checked = state\n ? forcedSelectedByState\n : selectedControlled\n ? !!selected\n : internalSelected;\n\n const isDisabled = disabled || state === \"Disabled\";\n\n if (!isVisible) return null;\n\n const handleToggle = () => {\n if (isDisabled) return;\n const next = !checked;\n if (!selectedControlled) setInternalSelected(next);\n onChange?.(next);\n };\n\n const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {\n // Ignore clicks that originated inside the dismiss button — it has its\n // own handler that calls stopPropagation, but defensive guard anyway.\n const target = e.target as HTMLElement;\n if (target.closest(\".eds-chip__close\")) return;\n handleToggle();\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n if (isDisabled) return;\n if (e.key === \"Enter\" || e.key === \" \") {\n // Don't intercept space when focus is on the inner close button — it\n // should activate the button instead.\n const target = e.target as HTMLElement;\n if (target.closest(\".eds-chip__close\")) return;\n e.preventDefault();\n handleToggle();\n }\n };\n\n const handleDismiss = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n if (!visibleControlled) setInternalVisible(false);\n onDismiss?.();\n };\n\n const wrapperClass = \"eds-chip\" + (className ? ` ${className}` : \"\");\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-state={state}\n data-checked={checked || undefined}\n role=\"button\"\n aria-pressed={checked}\n aria-disabled={isDisabled || undefined}\n aria-label={ariaLabel}\n tabIndex={isDisabled ? -1 : 0}\n onClick={isDisabled ? undefined : handleClick}\n onKeyDown={handleKeyDown}\n >\n {leadingIcon && (\n <span className=\"eds-chip__icon\" aria-hidden>\n {typeof leadingIcon === \"boolean\" ? <PlaceholderIcon /> : leadingIcon}\n </span>\n )}\n <span>{children ?? label ?? \"Chip\"}</span>\n {dismissible && (\n <button\n type=\"button\"\n className=\"eds-chip__close\"\n onClick={handleDismiss}\n onMouseDown={(e) => e.stopPropagation()}\n disabled={isDisabled}\n aria-label={`Remove ${label ?? \"chip\"}`}\n tabIndex={isDisabled ? -1 : 0}\n >\n <CloseGlyph />\n </button>\n )}\n </div>\n );\n }\n);\n\nexport default Chip;\n\n// ---------------------------------------------------------------------------\n// ChipMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst ALL_STATES: ChipState[] = [\n \"Default\",\n \"Hover\",\n \"Focus\",\n \"Selected\",\n \"SelectedHover\",\n \"SelectedFocus\",\n \"Disabled\",\n];\n\nexport function ChipMatrix() {\n ensureStyles();\n const [picked, setPicked] = React.useState<Set<string>>(\n () => new Set([\"javascript\"])\n );\n const toggle = (key: string) =>\n setPicked((prev) => {\n const next = new Set(prev);\n if (next.has(key)) next.delete(key);\n else next.add(key);\n return next;\n });\n\n const [tags, setTags] = React.useState<string[]>([\n \"Phase II\",\n \"Oncology\",\n \"Multi-site\",\n \"Adult\",\n \"Q1 2027\",\n ]);\n const [resetKey, setResetKey] = React.useState(0);\n\n return (\n <div className=\"eds-chip-matrix\">\n <section className=\"eds-chip-matrix__section\">\n <h3 className=\"eds-chip-matrix__heading\">State matrix (forced)</h3>\n <p className=\"eds-chip-matrix__sub\">\n Each row shows a forced visual state for QA. In production these are\n driven by real :hover and :focus-visible. Border widths transition\n via box-shadow inset so the chip's outer dimensions stay fixed\n across states.\n </p>\n {ALL_STATES.map((s) => (\n <div key={s} className=\"eds-chip-matrix__row\">\n <span className=\"eds-chip-matrix__row-label\">{s}</span>\n <Chip state={s} label={s} />\n <Chip state={s} label={s} leadingIcon />\n <Chip state={s} label={s} dismissible />\n <Chip state={s} label={s} leadingIcon dismissible />\n </div>\n ))}\n </section>\n\n <section className=\"eds-chip-matrix__section\">\n <h3 className=\"eds-chip-matrix__heading\">Interactive · filter group</h3>\n <p className=\"eds-chip-matrix__sub\">\n Click a chip to toggle. Real :hover and :focus-visible drive Hover,\n SelectedHover, Focus, and SelectedFocus naturally.\n </p>\n <div className=\"eds-chip-matrix__row\">\n {[\n { key: \"javascript\", label: \"JavaScript\" },\n { key: \"typescript\", label: \"TypeScript\" },\n { key: \"python\", label: \"Python\" },\n { key: \"go\", label: \"Go\" },\n { key: \"rust\", label: \"Rust\" },\n { key: \"java\", label: \"Java\", disabled: true },\n ].map((opt) => (\n <Chip\n key={opt.key}\n label={opt.label}\n selected={picked.has(opt.key)}\n disabled={opt.disabled}\n onChange={() => toggle(opt.key)}\n />\n ))}\n </div>\n <p className=\"eds-chip-matrix__readout\">\n picked: [{Array.from(picked).join(\", \")}]\n </p>\n </section>\n\n <section className=\"eds-chip-matrix__section\">\n <h3 className=\"eds-chip-matrix__heading\">Interactive · dismissible tags</h3>\n <p className=\"eds-chip-matrix__sub\">\n Each chip's X removes it from the list. Restore brings the original\n set back. Clicking the chip body toggles selection independently.\n </p>\n <div className=\"eds-chip-matrix__row\" key={resetKey}>\n {tags.map((t) => (\n <Chip\n key={t}\n label={t}\n dismissible\n onDismiss={() => setTags((prev) => prev.filter((x) => x !== t))}\n />\n ))}\n </div>\n <button\n type=\"button\"\n className=\"eds-chip-matrix__restore\"\n onClick={() => {\n setTags([\"Phase II\", \"Oncology\", \"Multi-site\", \"Adult\", \"Q1 2027\"]);\n setResetKey((k) => k + 1);\n }}\n >\n Restore all\n </button>\n </section>\n\n <section className=\"eds-chip-matrix__section\">\n <h3 className=\"eds-chip-matrix__heading\">Booleans · LeadingIcon × Dismissible</h3>\n <p className=\"eds-chip-matrix__sub\">\n LeadingIcon accepts a custom React node. Default placeholder is a\n star glyph.\n </p>\n <div className=\"eds-chip-matrix__row\">\n <Chip label=\"Plain\" />\n <Chip label=\"With icon\" leadingIcon />\n <Chip\n label=\"Custom icon\"\n leadingIcon={\n <svg viewBox=\"0 0 16 16\" width=\"16\" height=\"16\" aria-hidden>\n <circle cx=\"8\" cy=\"8\" r=\"6\" fill=\"#306AE8\" />\n </svg>\n }\n />\n <Chip label=\"Dismissible\" dismissible />\n <Chip label=\"Icon + dismiss\" leadingIcon dismissible />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * DateField — React port of the Embleema Design System 2.0 Input/Date Field\n * component (Figma node 4621:1143). A molecule that wraps the base Field atom\n * and adds:\n * - \"mm/dd/yyyy\" placeholder\n * - An inline \"Today\" button (Action/Link/Default blue outline) that fills\n * in today's date\n * - A calendar_month trailing icon that opens an inline Date Picker\n * overlay (Figma node 4512:3325) anchored below the field\n * - Optional Input/Label above (LabelPosition=Top) or to the left\n * (LabelPosition=Left, fixed 120px column width per Figma)\n * - Optional helper / error / warning / success message below the field\n *\n * The Date Picker (with Calendar / Month / Year views) and the Calendar\n * Cell (Figma node 4583:7) are private sub-components — they only ship as\n * part of DateField, not as standalone catalog entries.\n */\n\nimport * as React from \"react\";\nimport { Field } from \"./Field\";\nimport type { FieldValidation } from \"./Field\";\n\nexport type DateFieldValidation = FieldValidation;\nexport type DateFieldLabelPosition = \"Top\" | \"Left\";\n\nexport type DateFieldProps = {\n validation?: DateFieldValidation;\n labelPosition?: DateFieldLabelPosition;\n /** true → renders the default \"Date\" label. String → custom label text. */\n label?: boolean | string;\n /** true → renders the default helper / validation message. String → custom. */\n helperText?: boolean | string;\n required?: boolean;\n /** Controlled date string in mm/dd/yyyy format. */\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n onTodayClick?: (todayValue: string) => void;\n id?: string;\n name?: string;\n disabled?: boolean;\n readOnly?: boolean;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Date\";\nconst DEFAULT_HELPER = {\n None: \"Helper text\",\n AI: \"Helper text\",\n Error: \"Error message\",\n Warning: \"Warning message\",\n Success: \"Success message\",\n} as const;\nconst LEFT_LABEL_WIDTH = 120;\n\nconst MONTH_NAMES = [\n \"January\", \"February\", \"March\", \"April\", \"May\", \"June\",\n \"July\", \"August\", \"September\", \"October\", \"November\", \"December\",\n];\nconst MONTH_NAMES_SHORT = [\n \"Jan\", \"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\",\n \"Jul\", \"Aug\", \"Sep\", \"Oct\", \"Nov\", \"Dec\",\n];\nconst DAY_HEADERS = [\"S\", \"M\", \"T\", \"W\", \"T\", \"F\", \"S\"];\n\n// ---------------------------------------------------------------------------\n// Styles — injected once. CSS variables map to embleema-design-system.md\n// semantic tokens.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n --df-text-primary: #0E0E0E;\n --df-text-secondary: #5E5E5E;\n --df-text-tertiary: #848484;\n --df-text-inverse: #FEFEFE;\n --df-text-error: #E02020;\n --df-feedback-error-text: #B31A1A;\n --df-action-link-default: #306AE8;\n --df-action-link-hover: #6994EE;\n --df-action-primary-background: #306AE8;\n --df-action-primary-text: #FEFEFE;\n --df-bg-default: #FEFEFE;\n --df-bg-primary: #F8F8F8;\n --df-bg-selected: #E3ECFF;\n --df-border-default: #DDDDDD;\n}\n\n.eds-df {\n display: flex;\n position: relative;\n font-family: Nunito, sans-serif;\n}\n.eds-df[data-label-position=\"Top\"] {\n flex-direction: column;\n align-items: stretch;\n gap: 4px;\n width: 100%;\n}\n.eds-df[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n}\n\n.eds-df__label-slot[data-label-position=\"Left\"] {\n width: ${LEFT_LABEL_WIDTH}px;\n flex-shrink: 0;\n padding-top: 12px;\n}\n.eds-df__label-slot[data-label-position=\"Top\"] {\n display: flex;\n}\n.eds-df__label-text {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--df-text-primary);\n margin: 0;\n display: inline-flex;\n align-items: baseline;\n gap: 2px;\n}\n.eds-df[data-validation=\"Error\"] .eds-df__label-text {\n color: var(--df-text-error);\n}\n.eds-df__required {\n color: var(--df-feedback-error-text);\n}\n\n.eds-df__content {\n display: flex;\n flex-direction: column;\n gap: 4px;\n min-width: 0;\n flex: 1 1 auto;\n position: relative;\n}\n\n/* Calendar trailing icon button */\n.eds-df__cal {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n padding: 0;\n border: 0;\n background: transparent;\n color: var(--df-text-primary);\n cursor: pointer;\n border-radius: 4px;\n transition: color 120ms;\n}\n.eds-df__cal:hover:not(:disabled) { color: var(--df-action-link-default); }\n.eds-df__cal[aria-expanded=\"true\"] { color: var(--df-action-link-default); }\n.eds-df__cal:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n.eds-df__cal:disabled { cursor: not-allowed; opacity: 0.5; }\n.eds-df__cal svg { width: 100%; height: 100%; display: block; }\n\n/* Helper text */\n.eds-df__helper {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 1.4;\n letter-spacing: 0.01em;\n color: var(--df-text-primary);\n}\n.eds-df[data-validation=\"Error\"] .eds-df__helper {\n color: var(--df-feedback-error-text);\n}\n.eds-df__helper-icon {\n display: inline-flex;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.eds-df__helper-icon svg { width: 100%; height: 100%; display: block; }\n\n/* ---------- Date Picker overlay ---------- */\n.eds-dp {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n z-index: 30;\n width: 360px;\n min-width: 288px;\n background: var(--df-bg-default);\n border: 1px solid var(--df-border-default);\n border-radius: 16px;\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.08), 0 6px 16px 0 rgba(0, 0, 0, 0.12);\n display: flex;\n flex-direction: column;\n overflow: hidden;\n font-family: Nunito, sans-serif;\n}\n.eds-dp__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 64px;\n width: 100%;\n}\n.eds-dp__header--bordered {\n border-bottom: 1px solid var(--df-border-default);\n padding: 0 52px;\n}\n.eds-dp__nav {\n display: flex;\n flex: 1 1 0;\n align-items: center;\n justify-content: center;\n min-width: 0;\n}\n.eds-dp__nav--faded { flex: 0 0 auto; opacity: 0.38; padding-left: 8px; }\n.eds-dp__icon-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 48px;\n height: 48px;\n padding: 0;\n border: 0;\n background: transparent;\n cursor: pointer;\n border-radius: 100px;\n color: var(--df-text-primary);\n transition: background 120ms;\n}\n.eds-dp__icon-btn:hover { background: var(--df-bg-primary); }\n.eds-dp__icon-btn:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: -2px;\n}\n.eds-dp__icon-btn svg { width: 24px; height: 24px; display: block; }\n.eds-dp__menu-btn {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 10px 4px 10px 8px;\n border: 0;\n background: transparent;\n border-radius: 100px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 14px;\n line-height: 1.5;\n color: var(--df-text-primary);\n transition: background 120ms;\n}\n.eds-dp__menu-btn:hover { background: var(--df-bg-primary); }\n.eds-dp__menu-btn:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n.eds-dp__menu-btn svg { width: 12px; height: 12px; display: block; }\n.eds-dp__menu-btn[data-disabled=\"true\"] {\n cursor: default;\n opacity: 0.6;\n pointer-events: none;\n}\n\n/* Calendar grid */\n.eds-dp__grid {\n display: flex;\n flex-direction: column;\n padding: 0 12px 4px;\n width: 100%;\n box-sizing: border-box;\n}\n.eds-dp__weekrow,\n.eds-dp__weekhead {\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n}\n.eds-dp__weekhead-cell {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 48px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 1.4;\n letter-spacing: 0.01em;\n color: var(--df-text-tertiary);\n}\n\n/* Calendar cell (Figma node 4583:7) — 48×48 outer with 40×40 inner circle */\n.eds-dp__cell {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 48px;\n padding: 0;\n border: 0;\n background: transparent;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1;\n color: var(--df-text-primary);\n}\n.eds-dp__cell-circle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n border-radius: 100px;\n background: transparent;\n transition: background 100ms, color 100ms;\n}\n.eds-dp__cell:hover:not([data-type=\"prev-next\"]) .eds-dp__cell-circle {\n background: var(--df-bg-selected);\n}\n.eds-dp__cell:focus-visible .eds-dp__cell-circle {\n outline: 2px solid #A2BDF5;\n outline-offset: -2px;\n}\n.eds-dp__cell[data-type=\"prev-next\"] { color: var(--df-text-tertiary); cursor: pointer; }\n.eds-dp__cell[data-type=\"selected\"] .eds-dp__cell-circle {\n background: var(--df-action-primary-background);\n color: var(--df-action-primary-text);\n}\n.eds-dp__cell[data-type=\"today\"]:not([data-type=\"selected\"]) .eds-dp__cell-circle {\n border: 1px solid var(--df-action-primary-background);\n color: var(--df-action-primary-background);\n font-weight: 600;\n}\n\n/* Month / Year list */\n.eds-dp__list {\n height: 336px;\n overflow-y: auto;\n overflow-x: hidden;\n width: 100%;\n display: flex;\n flex-direction: column;\n}\n.eds-dp__list-item {\n display: flex;\n align-items: center;\n gap: 16px;\n height: 48px;\n padding: 4px 24px 4px 16px;\n border: 0;\n background: transparent;\n cursor: pointer;\n width: 100%;\n text-align: left;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 24px;\n color: var(--df-text-primary);\n transition: background 120ms;\n}\n.eds-dp__list-item:hover { background: var(--df-bg-selected); }\n.eds-dp__list-item:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: -2px;\n}\n.eds-dp__list-item[data-selected=\"true\"] {\n background: var(--df-bg-selected);\n}\n.eds-dp__list-icon {\n width: 24px;\n height: 24px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n color: var(--df-text-primary);\n}\n.eds-dp__list-icon svg { width: 100%; height: 100%; display: block; }\n\n/* Footer */\n.eds-dp__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 12px;\n width: 100%;\n box-sizing: border-box;\n}\n.eds-dp__footer-right { display: inline-flex; gap: 8px; }\n.eds-dp__text-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: 40px;\n padding: 10px 12px;\n border: 0;\n background: transparent;\n border-radius: 100px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 14px;\n line-height: 1.5;\n color: var(--df-action-link-default);\n transition: background 120ms;\n}\n.eds-dp__text-btn:hover { background: var(--df-bg-selected); }\n.eds-dp__text-btn:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-datefield]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-datefield\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Icons\n// ---------------------------------------------------------------------------\nfunction CalendarMonth() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M4.587 18.083c-.41 0-.762-.147-1.057-.44a1.443 1.443 0 01-.443-1.057V4.413c0-.41.148-.762.443-1.057.295-.295.647-.443 1.057-.443H5.5V1.448c0-.227.077-.418.232-.572A.78.78 0 016.302.643a.78.78 0 01.572.233.778.778 0 01.233.572V2.913h6V1.428a.755.755 0 01.222-.555.755.755 0 01.555-.223.755.755 0 01.555.223.755.755 0 01.222.555V2.913h.913c.41 0 .762.148 1.057.443.295.295.443.647.443 1.057v12.173c0 .41-.148.762-.443 1.057-.295.293-.647.44-1.057.44H4.587zm0-1.5h10.826a.146.146 0 00.107-.043.146.146 0 00.043-.107V8.083H4.437v8.35a.146.146 0 00.043.107.146.146 0 00.107.043zM4.437 6.583h11.126V4.413a.146.146 0 00-.043-.107.146.146 0 00-.107-.043H4.587a.146.146 0 00-.107.043.146.146 0 00-.043.107v2.17z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nfunction ChevronLeft() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M14 7l-5 5 5 5 1-1-4-4 4-4-1-1z\" fill=\"currentColor\" />\n </svg>\n );\n}\nfunction ChevronRight() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M10 7l5 5-5 5-1-1 4-4-4-4 1-1z\" fill=\"currentColor\" />\n </svg>\n );\n}\n// Icon/Navigation/Dropdown — Figma node 4052:3068. Used as the month-picker\n// and year-picker dropdown indicators inside the date picker header. Path\n// data verbatim from the Figma export; fill rebound to currentColor.\nfunction ChevronDown() {\n return (\n <svg\n viewBox=\"0 0 12.7745 7\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n preserveAspectRatio=\"xMidYMid meet\"\n aria-hidden\n >\n <path\n fill=\"currentColor\"\n d=\"M5.57468 6.64642L0.23713 1.3093C0.163733 1.23562 0.105862 1.15333 0.063517 1.06243C0.0211723 0.971812 0 0.874559 0 0.770674C0 0.563185 0.0701511 0.382795 0.210453 0.229507C0.350755 0.076502 0.535661 0 0.765169 0H12.0094C12.2389 0 12.4238 0.0773488 12.5641 0.232048C12.7044 0.386465 12.7745 0.566713 12.7745 0.772791C12.7745 0.824451 12.6954 1.00329 12.537 1.3093L7.19987 6.64642C7.07735 6.76922 6.9506 6.85885 6.81961 6.91531C6.68862 6.97177 6.54451 7 6.38727 7C6.23003 7 6.08592 6.97177 5.95493 6.91531C5.82395 6.85885 5.69719 6.76922 5.57468 6.64642Z\"\n />\n </svg>\n );\n}\nfunction CheckGlyph() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z\" fill=\"currentColor\" />\n </svg>\n );\n}\nfunction WarningGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M1.333 14L8 2.667 14.667 14H1.333zM8 12.667a.5.5 0 100-1 .5.5 0 000 1zm-.5-2h1V7h-1v3.667z\" fill=\"#FA6400\" />\n </svg>\n );\n}\nfunction ErrorGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M1.333 14L8 2.667 14.667 14H1.333zM8 12.667a.5.5 0 100-1 .5.5 0 000 1zm-.5-2h1V7h-1v3.667z\" fill=\"#B31A1A\" />\n </svg>\n );\n}\nfunction SuccessGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M6.55 11.467l-3-3 .933-.934 2.067 2.067 4.866-4.867.934.934-5.8 5.8z\" fill=\"#288028\" />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Date helpers\n// ---------------------------------------------------------------------------\nfunction pad2(n: number): string { return String(n).padStart(2, \"0\"); }\nfunction formatMMDDYYYY(d: Date): string {\n return `${pad2(d.getMonth() + 1)}/${pad2(d.getDate())}/${d.getFullYear()}`;\n}\nfunction formatToday(): string { return formatMMDDYYYY(new Date()); }\nfunction parseMMDDYYYY(s: string): Date | null {\n const m = /^(\\d{1,2})\\/(\\d{1,2})\\/(\\d{4})$/.exec(s.trim());\n if (!m) return null;\n const mm = parseInt(m[1], 10);\n const dd = parseInt(m[2], 10);\n const yyyy = parseInt(m[3], 10);\n if (mm < 1 || mm > 12 || dd < 1 || dd > 31) return null;\n const d = new Date(yyyy, mm - 1, dd);\n if (d.getMonth() !== mm - 1 || d.getDate() !== dd) return null;\n return d;\n}\nfunction isSameDay(a: Date, b: Date): boolean {\n return (\n a.getFullYear() === b.getFullYear() &&\n a.getMonth() === b.getMonth() &&\n a.getDate() === b.getDate()\n );\n}\ntype CalCell = { date: Date; day: number; type: \"current\" | \"prev-next\" };\nfunction buildCalendarCells(year: number, month: number): CalCell[] {\n const first = new Date(year, month, 1);\n const firstDow = first.getDay();\n const start = new Date(year, month, 1 - firstDow);\n const out: CalCell[] = [];\n for (let i = 0; i < 42; i++) {\n const d = new Date(start.getFullYear(), start.getMonth(), start.getDate() + i);\n out.push({\n date: d,\n day: d.getDate(),\n type: d.getMonth() === month ? \"current\" : \"prev-next\",\n });\n }\n return out;\n}\n\nfunction getHelperGlyph(validation: DateFieldValidation): React.ReactNode {\n switch (validation) {\n case \"Error\": return <ErrorGlyph />;\n case \"Warning\": return <WarningGlyph />;\n case \"Success\": return <SuccessGlyph />;\n default: return null;\n }\n}\n\n// ---------------------------------------------------------------------------\n// DatePicker — private sub-component. Three views: Calendar / Month / Year.\n// ---------------------------------------------------------------------------\ntype PickerView = \"Calendar\" | \"Month\" | \"Year\";\n\ntype DatePickerProps = {\n value: string;\n onPick: (value: string) => void;\n onCancel: () => void;\n onClear: () => void;\n};\n\nfunction DatePicker({ value, onPick, onCancel, onClear }: DatePickerProps) {\n const initial = React.useMemo(() => parseMMDDYYYY(value) ?? new Date(), [value]);\n const [view, setView] = React.useState<PickerView>(\"Calendar\");\n const [year, setYear] = React.useState<number>(initial.getFullYear());\n const [month, setMonth] = React.useState<number>(initial.getMonth());\n // Draft selection — only fires onPick when user clicks OK or clicks a day.\n const [draft, setDraft] = React.useState<Date | null>(parseMMDDYYYY(value));\n\n const today = React.useMemo(() => new Date(), []);\n const cells = React.useMemo(() => buildCalendarCells(year, month), [year, month]);\n const yearListStart = year - 4;\n const years = React.useMemo(\n () => Array.from({ length: 16 }, (_, i) => yearListStart + i),\n [yearListStart]\n );\n\n const prevMonth = () => {\n const m = month - 1;\n if (m < 0) { setMonth(11); setYear(year - 1); }\n else setMonth(m);\n };\n const nextMonth = () => {\n const m = month + 1;\n if (m > 11) { setMonth(0); setYear(year + 1); }\n else setMonth(m);\n };\n const prevYear = () => setYear((y) => y - 1);\n const nextYear = () => setYear((y) => y + 1);\n\n const pickDay = (d: Date) => {\n setDraft(d);\n onPick(formatMMDDYYYY(d));\n };\n const pickMonth = (m: number) => { setMonth(m); setView(\"Calendar\"); };\n const pickYear = (y: number) => { setYear(y); setView(\"Calendar\"); };\n\n const handleOk = () => {\n if (draft) onPick(formatMMDDYYYY(draft));\n else onCancel();\n };\n\n const renderHeader = () => {\n if (view === \"Calendar\") {\n return (\n <div className=\"eds-dp__header\">\n <div className=\"eds-dp__nav\">\n <button type=\"button\" className=\"eds-dp__icon-btn\" onClick={prevMonth} aria-label=\"Previous month\">\n <ChevronLeft />\n </button>\n <button\n type=\"button\"\n className=\"eds-dp__menu-btn\"\n onClick={() => setView(\"Month\")}\n >\n {MONTH_NAMES_SHORT[month]}\n <ChevronDown />\n </button>\n <button type=\"button\" className=\"eds-dp__icon-btn\" onClick={nextMonth} aria-label=\"Next month\">\n <ChevronRight />\n </button>\n </div>\n <div className=\"eds-dp__nav\">\n <button type=\"button\" className=\"eds-dp__icon-btn\" onClick={prevYear} aria-label=\"Previous year\">\n <ChevronLeft />\n </button>\n <button\n type=\"button\"\n className=\"eds-dp__menu-btn\"\n onClick={() => setView(\"Year\")}\n >\n {year}\n <ChevronDown />\n </button>\n <button type=\"button\" className=\"eds-dp__icon-btn\" onClick={nextYear} aria-label=\"Next year\">\n <ChevronRight />\n </button>\n </div>\n </div>\n );\n }\n if (view === \"Month\") {\n return (\n <div className=\"eds-dp__header eds-dp__header--bordered\">\n <button\n type=\"button\"\n className=\"eds-dp__menu-btn\"\n onClick={() => setView(\"Calendar\")}\n >\n {MONTH_NAMES_SHORT[month]}\n <ChevronDown />\n </button>\n <span className=\"eds-dp__menu-btn\" data-disabled=\"true\">{year}</span>\n </div>\n );\n }\n return (\n <div className=\"eds-dp__header eds-dp__header--bordered\">\n <span className=\"eds-dp__menu-btn\" data-disabled=\"true\">{MONTH_NAMES_SHORT[month]}</span>\n <button\n type=\"button\"\n className=\"eds-dp__menu-btn\"\n onClick={() => setView(\"Calendar\")}\n >\n {year}\n <ChevronDown />\n </button>\n </div>\n );\n };\n\n const renderCalendar = () => (\n <>\n <div className=\"eds-dp__grid\">\n <div className=\"eds-dp__weekhead\">\n {DAY_HEADERS.map((d, i) => (\n <div key={i} className=\"eds-dp__weekhead-cell\">{d}</div>\n ))}\n </div>\n {Array.from({ length: 6 }, (_, w) => (\n <div key={w} className=\"eds-dp__weekrow\">\n {cells.slice(w * 7, w * 7 + 7).map((cell) => {\n const isSelected = draft != null && isSameDay(cell.date, draft);\n const isToday = isSameDay(cell.date, today);\n const dataType = isSelected\n ? \"selected\"\n : cell.type === \"prev-next\"\n ? \"prev-next\"\n : isToday\n ? \"today\"\n : \"current\";\n return (\n <button\n key={cell.date.toISOString()}\n type=\"button\"\n className=\"eds-dp__cell\"\n data-type={dataType}\n onClick={() => pickDay(cell.date)}\n >\n <span className=\"eds-dp__cell-circle\">{cell.day}</span>\n </button>\n );\n })}\n </div>\n ))}\n </div>\n <div className=\"eds-dp__footer\">\n <button type=\"button\" className=\"eds-dp__text-btn\" onClick={onClear}>Clear</button>\n <div className=\"eds-dp__footer-right\">\n <button type=\"button\" className=\"eds-dp__text-btn\" onClick={onCancel}>Cancel</button>\n <button type=\"button\" className=\"eds-dp__text-btn\" onClick={handleOk}>OK</button>\n </div>\n </div>\n </>\n );\n\n const renderMonthList = () => (\n <div className=\"eds-dp__list\">\n {MONTH_NAMES.map((name, i) => (\n <button\n key={name}\n type=\"button\"\n className=\"eds-dp__list-item\"\n data-selected={i === month}\n onClick={() => pickMonth(i)}\n >\n <span className=\"eds-dp__list-icon\">{i === month ? <CheckGlyph /> : null}</span>\n {name}\n </button>\n ))}\n </div>\n );\n\n const renderYearList = () => (\n <div className=\"eds-dp__list\">\n {years.map((y) => (\n <button\n key={y}\n type=\"button\"\n className=\"eds-dp__list-item\"\n data-selected={y === year}\n onClick={() => pickYear(y)}\n >\n <span className=\"eds-dp__list-icon\">{y === year ? <CheckGlyph /> : null}</span>\n {y}\n </button>\n ))}\n </div>\n );\n\n return (\n <div className=\"eds-dp\" role=\"dialog\" aria-label=\"Date picker\" onMouseDown={(e) => e.stopPropagation()}>\n {renderHeader()}\n {view === \"Calendar\" && renderCalendar()}\n {view === \"Month\" && renderMonthList()}\n {view === \"Year\" && renderYearList()}\n </div>\n );\n}\n\n// ---------------------------------------------------------------------------\n// DateField — public component\n// ---------------------------------------------------------------------------\nexport const DateField = React.forwardRef<HTMLInputElement, DateFieldProps>(\n function DateField(\n {\n validation = \"None\",\n labelPosition = \"Top\",\n label = true,\n helperText = false,\n required = false,\n value,\n defaultValue,\n onChange,\n onTodayClick,\n id,\n name,\n disabled = false,\n readOnly = false,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = value !== undefined;\n const [internal, setInternal] = React.useState<string>(defaultValue ?? \"\");\n const current = isControlled ? value : internal;\n\n const [open, setOpen] = React.useState(false);\n const wrapperRef = React.useRef<HTMLDivElement | null>(null);\n\n // Close picker on outside click or Escape.\n React.useEffect(() => {\n if (!open) return;\n const onDown = (e: MouseEvent) => {\n if (!wrapperRef.current) return;\n if (!wrapperRef.current.contains(e.target as Node)) setOpen(false);\n };\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(\"mousedown\", onDown);\n document.addEventListener(\"keydown\", onKey);\n return () => {\n document.removeEventListener(\"mousedown\", onDown);\n document.removeEventListener(\"keydown\", onKey);\n };\n }, [open]);\n\n const commit = (next: string) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (e) =>\n commit(e.target.value);\n\n const fillToday = () => {\n const today = formatToday();\n commit(today);\n onTodayClick?.(today);\n };\n\n const handleCalendarClick = () => {\n if (disabled || readOnly) return;\n setOpen((o) => !o);\n };\n\n const wrapperClass = \"eds-df\" + (className ? ` ${className}` : \"\");\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n const helperContent =\n typeof helperText === \"string\"\n ? helperText\n : DEFAULT_HELPER[validation as keyof typeof DEFAULT_HELPER] ?? DEFAULT_HELPER.None;\n\n // Today is rendered as Field's own inlineButton (Field wraps a string in\n // its own <button>; passing a <button> here would nest buttons and the\n // chip would appear twice). Click handling is wired via event delegation\n // on the content wrapper below.\n const calendarButton = (\n <button\n type=\"button\"\n className=\"eds-df__cal\"\n onClick={handleCalendarClick}\n disabled={disabled || readOnly}\n aria-label={open ? \"Close date picker\" : \"Open date picker\"}\n aria-expanded={open}\n aria-haspopup=\"dialog\"\n tabIndex={disabled ? -1 : 0}\n >\n <CalendarMonth />\n </button>\n );\n\n const fieldEl = (\n <Field\n ref={ref}\n validation={validation}\n appearance=\"Filled\"\n placeholder=\"mm/dd/yyyy\"\n value={current}\n onChange={handleInputChange}\n disabled={disabled}\n readOnly={readOnly}\n id={id}\n name={name}\n type=\"text\"\n inlineButton=\"Today\"\n trailingIcon={calendarButton}\n aria-label={ariaLabel ?? (typeof label === \"string\" ? label : \"Date\")}\n />\n );\n\n const labelEl = label ? (\n <div className=\"eds-df__label-slot\" data-label-position={labelPosition}>\n <label className=\"eds-df__label-text\" htmlFor={id}>\n {required && (\n <span className=\"eds-df__required\" aria-hidden>*</span>\n )}\n {labelText}\n </label>\n </div>\n ) : null;\n\n const helperEl = helperText ? (\n <div className=\"eds-df__helper\" role={validation === \"Error\" ? \"alert\" : undefined}>\n {getHelperGlyph(validation) && (\n <span className=\"eds-df__helper-icon\">{getHelperGlyph(validation)}</span>\n )}\n <span>{helperContent}</span>\n </div>\n ) : null;\n\n return (\n <div\n className={wrapperClass}\n data-validation={validation}\n data-label-position={labelPosition}\n ref={wrapperRef}\n >\n {labelEl}\n <div\n className=\"eds-df__content\"\n onClick={(e) => {\n const target = e.target as HTMLElement;\n if (target.closest(\".eds-field-wrap__inline-button\")) {\n e.preventDefault();\n fillToday();\n }\n }}\n >\n {fieldEl}\n {helperEl}\n {open && (\n <DatePicker\n value={current}\n onPick={(v) => {\n commit(v);\n setOpen(false);\n }}\n onCancel={() => setOpen(false)}\n onClear={() => {\n commit(\"\");\n setOpen(false);\n }}\n />\n )}\n </div>\n </div>\n );\n }\n);\n\nexport default DateField;\n\n// ---------------------------------------------------------------------------\n// DateFieldMatrix — interactive showcase. The calendar icon in the first row\n// opens the inline picker; clicking a day fills the field and closes the\n// picker. The validation grids below show all states statically.\n// ---------------------------------------------------------------------------\nexport function DateFieldMatrix() {\n ensureStyles();\n const validations: DateFieldValidation[] = [\"None\", \"Error\", \"Warning\", \"Success\", \"AI\"];\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (click the calendar icon)\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 16, maxWidth: 520 }}>\n <DateField label helperText />\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n LabelPosition = Top · all validations\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(420px, 1fr))\", gap: 16 }}>\n {validations.map((v) => (\n <DateField key={v} validation={v} label helperText labelPosition=\"Top\" />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n LabelPosition = Left · all validations\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 16, maxWidth: 600 }}>\n {validations.map((v) => (\n <DateField key={v} validation={v} label helperText labelPosition=\"Left\" />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Booleans (no label, no helper)\n </p>\n <div style={{ display: \"flex\", gap: 24, flexWrap: \"wrap\", maxWidth: 800 }}>\n <DateField label={false} helperText={false} />\n <DateField label={false} helperText={false} disabled />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Selector — React port of Embleema Design System 2.0's Selector/Selector\n * component (Figma node 4240:53).\n *\n * A single option row. Used standalone or composed inside a Dropdown Menu's\n * option list. Supports four content types and four states.\n *\n * Structure mirrors the Figma source:\n * row (HORIZONTAL, gap 8, min-h 40, px 12, py 8)\n * ├── (Checkbox type) Checkbox glyph (no built-in label)\n * ├── (Radio type) Radio glyph (no built-in label)\n * ├── (Icon type) LeadingIcon (20×20, optional)\n * ├── label text (body/md, Nunito Light)\n * └── trailing tooltip icon (20×20, optional info glyph)\n *\n * Selection model:\n * - Plain / Icon : the whole row is the toggle. Click toggles `selected`.\n * On Selected, the row gets the Background/Selected tint.\n * - Checkbox : the Checkbox component owns the selected state visually.\n * Clicking anywhere on the row toggles the checkbox.\n * The row itself does NOT add the selected tint (the\n * checkbox fill communicates selection).\n * - Radio : same pattern as Checkbox but uses the Radio component\n * and group `name` for native single-selection.\n *\n * Props:\n * - type : Plain | Icon | Checkbox | Radio\n * - state : forced visual override (Default | Hover | Selected | Disabled)\n * - label : option text (defaults to \"Option\")\n * - leadingIcon : when type=Icon — `true` renders the default placeholder\n * glyph, or pass a React node for a custom icon\n * - tooltip : show the trailing info icon\n * - tooltipText : title text revealed on the trailing icon's :title\n * - selected : controlled selection\n * - defaultSelected : uncontrolled initial selection\n * - disabled : maps to data-state=\"Disabled\"\n * - name, value : Radio group support (required for Radio type)\n * - onChange : called with the new selected boolean\n * - onClick : passthrough for row click\n */\n\nimport * as React from \"react\";\nimport { Checkbox } from \"./Checkbox\";\nimport { Radio } from \"./Radio\";\n\nexport type SelectorType = \"Plain\" | \"Icon\" | \"Checkbox\" | \"Radio\";\nexport type SelectorState = \"Default\" | \"Hover\" | \"Selected\" | \"Disabled\";\n\nexport type SelectorProps = {\n type?: SelectorType;\n state?: SelectorState;\n label?: string;\n leadingIcon?: boolean | React.ReactNode;\n tooltip?: boolean;\n tooltipText?: string;\n selected?: boolean;\n defaultSelected?: boolean;\n disabled?: boolean;\n onChange?: (selected: boolean) => void;\n onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\n name?: string;\n value?: string;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — colors come from the live Figma extraction:\n// - Row tint on Hover / Plain+Selected / Icon+Selected: Background/Selected\n// (#E3ECFF).\n// - Label: Text/Primary (#0E0E0E), Text/Disabled (#848484) when disabled.\n// - Trailing tooltip icon: Text/Secondary (#5E5E5E), Text/Disabled when\n// disabled.\n// - Type: body/md-light (Nunito Light 16/150%).\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --sel-text-primary: #0E0E0E;\n --sel-text-secondary: #5E5E5E;\n --sel-text-disabled: #848484;\n --sel-background-selected: #E3ECFF;\n}\n\n.eds-selector {\n display: flex;\n align-items: center;\n gap: 8px;\n min-height: 40px;\n padding: 8px 12px;\n background: transparent;\n font-family: Nunito, sans-serif;\n color: var(--sel-text-primary);\n cursor: pointer;\n user-select: none;\n box-sizing: border-box;\n transition: background-color 120ms ease-out;\n position: relative;\n}\n\n/* Hover tint — natural :hover OR forced data-state=\"Hover\" */\n.eds-selector:not([data-state=\"Disabled\"]):hover,\n.eds-selector[data-state=\"Hover\"] {\n background: var(--sel-background-selected);\n}\n\n/* Selected tint — only applies to Plain and Icon types. Checkbox and Radio\n show selection through the control itself, so the row stays transparent. */\n.eds-selector[data-type=\"Plain\"][data-state=\"Selected\"],\n.eds-selector[data-type=\"Plain\"][data-selected=\"true\"]:not([data-state=\"Hover\"]):not([data-state=\"Disabled\"]),\n.eds-selector[data-type=\"Icon\"][data-state=\"Selected\"],\n.eds-selector[data-type=\"Icon\"][data-selected=\"true\"]:not([data-state=\"Hover\"]):not([data-state=\"Disabled\"]) {\n background: var(--sel-background-selected);\n}\n\n/* Disabled */\n.eds-selector[data-state=\"Disabled\"] {\n cursor: not-allowed;\n color: var(--sel-text-disabled);\n}\n\n.eds-selector__label {\n font-size: 16px;\n line-height: 150%;\n font-weight: 300; /* body/md-light */\n word-break: break-word;\n white-space: nowrap;\n flex-shrink: 0;\n}\n.eds-selector[data-state=\"Disabled\"] .eds-selector__label {\n color: var(--sel-text-disabled);\n}\n\n/* 20×20 icon slot for leading and trailing icons */\n.eds-selector__icon {\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--sel-text-secondary);\n}\n.eds-selector__icon svg { display: block; }\n.eds-selector[data-state=\"Disabled\"] .eds-selector__icon {\n color: var(--sel-text-disabled);\n}\n\n/* The trailing tooltip icon sits last in the row */\n.eds-selector__tooltip {\n margin-left: auto;\n}\n\n/* When the row hosts a Checkbox/Radio, the control's own state-layer handles\n the hover halo; we just want the row's bg tint not to clip the control. */\n.eds-selector .eds-cb,\n.eds-selector .eds-rb {\n flex-shrink: 0;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-selector-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-selector-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-selector-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-selector-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-selector-matrix__grid {\n display: grid;\n grid-template-columns: 100px repeat(4, minmax(180px, 1fr));\n gap: 0;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n overflow: hidden;\n}\n.eds-selector-matrix__cell {\n border-right: 1px solid #EEEEEE;\n border-bottom: 1px solid #EEEEEE;\n background: #FEFEFE;\n min-height: 56px;\n display: flex;\n align-items: center;\n}\n.eds-selector-matrix__cell:last-child { border-right: none; }\n.eds-selector-matrix__cell--head {\n background: #F8F8F8;\n padding: 8px 12px;\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-selector-matrix__list {\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n background: #FEFEFE;\n padding: 4px 0;\n max-width: 320px;\n}\n.eds-selector-matrix__pre {\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-selector]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-selector\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — trailing tooltip uses Icon/Status/Info (node 4052:3158). The default\n// placeholder for leadingIcon={true} is a simple star glyph (Icon/Status/\n// ArtificialIntelligence stem). Consumers should normally pass a real icon\n// element via `leadingIcon={<TheirIcon />}`.\n// ---------------------------------------------------------------------------\nfunction InfoIcon() {\n return (\n <svg\n viewBox=\"0 0 24 24\"\n width=\"20\"\n height=\"20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10.0003 15C10.2241 15 10.4116 14.9243 10.5626 14.7729C10.7139 14.6217 10.7895 14.4342 10.7895 14.2105V9.73684C10.7895 9.51316 10.7138 9.32561 10.5624 9.17421C10.411 9.02298 10.2234 8.94737 9.99974 8.94737C9.77588 8.94737 9.58842 9.02298 9.43737 9.17421C9.28614 9.32561 9.21053 9.51316 9.21053 9.73684V14.2105C9.21053 14.4342 9.28623 14.6217 9.43763 14.7729C9.58904 14.9243 9.77658 15 10.0003 15ZM10 7.14579C10.2409 7.14579 10.4428 7.0643 10.6058 6.90132C10.7688 6.73833 10.8503 6.5364 10.8503 6.29553C10.8503 6.05465 10.7688 5.85272 10.6058 5.68974C10.4428 5.52693 10.2409 5.44553 10 5.44553C9.75912 5.44553 9.55719 5.52693 9.39421 5.68974C9.23123 5.85272 9.14974 6.05465 9.14974 6.29553C9.14974 6.5364 9.23123 6.73833 9.39421 6.90132C9.55719 7.0643 9.75912 7.14579 10 7.14579ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction PlaceholderIcon() {\n // Simple filled star — only used when leadingIcon={true} and no custom\n // node is supplied. Most consumers pass their own icon node.\n return (\n <svg\n viewBox=\"0 0 20 20\"\n width=\"20\"\n height=\"20\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <path d=\"M10 1.5l2.47 5.01 5.53.8-4 3.9.94 5.5L10 14.1l-4.94 2.6.94-5.5-4-3.9 5.53-.8L10 1.5z\" />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Selector = React.forwardRef<HTMLDivElement, SelectorProps>(\n function Selector(\n {\n type = \"Plain\",\n state,\n label = \"Option\",\n leadingIcon = false,\n tooltip = false,\n tooltipText,\n selected,\n defaultSelected = false,\n disabled = false,\n onChange,\n onClick,\n name,\n value,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = selected !== undefined;\n const [internal, setInternal] = React.useState(defaultSelected);\n const checked = isControlled ? !!selected : internal;\n\n const effectiveState: SelectorState | undefined =\n state ?? (disabled ? \"Disabled\" : checked ? \"Selected\" : undefined);\n const isDisabled = disabled || effectiveState === \"Disabled\";\n\n const toggle = () => {\n if (isDisabled) return;\n const next = !checked;\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const handleRowClick = (e: React.MouseEvent<HTMLDivElement>) => {\n // For Checkbox/Radio types, we let the inner control handle clicks on\n // itself (it already toggles via its own native input). Clicking the\n // surrounding row should also toggle, so we synthesize a click on the\n // input if the click target wasn't the input itself.\n if (isDisabled) return;\n if (type === \"Checkbox\" || type === \"Radio\") {\n const target = e.target as HTMLElement;\n const isInput = target.tagName === \"INPUT\";\n if (!isInput) {\n const input = e.currentTarget.querySelector<HTMLInputElement>(\n 'input[type=\"checkbox\"], input[type=\"radio\"]'\n );\n input?.click();\n }\n } else {\n toggle();\n }\n onClick?.(e);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n if (isDisabled) return;\n // Plain/Icon: Enter or Space activates. Checkbox/Radio types delegate\n // keyboard handling to their inner inputs (focus moves there naturally).\n if (type === \"Plain\" || type === \"Icon\") {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n toggle();\n }\n }\n };\n\n const role =\n type === \"Checkbox\" || type === \"Radio\"\n ? \"presentation\"\n : \"option\";\n\n const ariaSelected =\n type === \"Plain\" || type === \"Icon\" ? checked : undefined;\n\n // For Plain/Icon types the row itself is the interactive element. For\n // Checkbox/Radio, the inner input owns focus, so we keep the row out of\n // the tab order to avoid duplicate tab stops.\n const tabIndex =\n isDisabled || type === \"Checkbox\" || type === \"Radio\" ? -1 : 0;\n\n const wrapperClass = \"eds-selector\" + (className ? ` ${className}` : \"\");\n\n const renderLeading = () => {\n if (type === \"Checkbox\") {\n return (\n <Checkbox\n selected={checked}\n disabled={isDisabled}\n state={\n effectiveState === \"Hover\"\n ? \"Hover\"\n : effectiveState === \"Disabled\"\n ? \"Disabled\"\n : undefined\n }\n onChange={(next) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n }}\n name={name}\n value={value}\n aria-label={ariaLabel ?? label}\n />\n );\n }\n if (type === \"Radio\") {\n return (\n <Radio\n selected={checked}\n disabled={isDisabled}\n state={\n effectiveState === \"Hover\"\n ? \"Hover\"\n : effectiveState === \"Disabled\"\n ? \"Disabled\"\n : undefined\n }\n onChange={(next) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n }}\n name={name}\n value={value}\n aria-label={ariaLabel ?? label}\n />\n );\n }\n if (type === \"Icon\" && leadingIcon) {\n return (\n <span className=\"eds-selector__icon eds-selector__leading\">\n {typeof leadingIcon === \"boolean\" ? <PlaceholderIcon /> : leadingIcon}\n </span>\n );\n }\n return null;\n };\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n data-state={effectiveState}\n data-selected={checked || undefined}\n role={role}\n aria-selected={ariaSelected}\n aria-disabled={isDisabled || undefined}\n aria-label={ariaLabel}\n tabIndex={tabIndex}\n onClick={handleRowClick}\n onKeyDown={handleKeyDown}\n >\n {renderLeading()}\n <span className=\"eds-selector__label\">{label}</span>\n {tooltip && (\n <span\n className=\"eds-selector__icon eds-selector__tooltip\"\n title={tooltipText}\n aria-label={tooltipText ? `More info: ${tooltipText}` : \"More info\"}\n role=\"img\"\n >\n <InfoIcon />\n </span>\n )}\n </div>\n );\n }\n);\n\nexport default Selector;\n\n// ---------------------------------------------------------------------------\n// SelectorMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst TYPES: SelectorType[] = [\"Plain\", \"Icon\", \"Checkbox\", \"Radio\"];\nconst STATES: SelectorState[] = [\"Default\", \"Hover\", \"Selected\", \"Disabled\"];\n\nexport function SelectorMatrix() {\n ensureStyles();\n\n // Interactive single-select list (Plain)\n const [pickedPlain, setPickedPlain] = React.useState<string>(\"two\");\n // Interactive multi-select list (Checkbox)\n const [pickedCheck, setPickedCheck] = React.useState<Set<string>>(\n () => new Set([\"banana\"])\n );\n const togglePick = (key: string) =>\n setPickedCheck((prev) => {\n const next = new Set(prev);\n if (next.has(key)) next.delete(key);\n else next.add(key);\n return next;\n });\n // Interactive radio group\n const [pickedRadio, setPickedRadio] = React.useState<string>(\"medium\");\n\n return (\n <div className=\"eds-selector-matrix\">\n <section className=\"eds-selector-matrix__section\">\n <h3 className=\"eds-selector-matrix__heading\">Type × State (forced)</h3>\n <p className=\"eds-selector-matrix__sub\">\n Each cell shows a forced state for QA. Hover and Selected get the\n Background/Selected tint for Plain/Icon. Checkbox/Radio types show\n selection through the control itself.\n </p>\n <div className=\"eds-selector-matrix__grid\">\n <div className=\"eds-selector-matrix__cell eds-selector-matrix__cell--head\">\n State\n </div>\n {TYPES.map((t) => (\n <div\n key={t}\n className=\"eds-selector-matrix__cell eds-selector-matrix__cell--head\"\n >\n {t}\n </div>\n ))}\n {STATES.map((s) => (\n <React.Fragment key={s}>\n <div className=\"eds-selector-matrix__cell eds-selector-matrix__cell--head\">\n {s}\n </div>\n {TYPES.map((t) => (\n <div key={`${s}-${t}`} className=\"eds-selector-matrix__cell\">\n <Selector\n type={t}\n state={s}\n label=\"Option\"\n leadingIcon={t === \"Icon\"}\n selected={s === \"Selected\"}\n disabled={s === \"Disabled\"}\n />\n </div>\n ))}\n </React.Fragment>\n ))}\n </div>\n </section>\n\n <section className=\"eds-selector-matrix__section\">\n <h3 className=\"eds-selector-matrix__heading\">\n Interactive · single-select (Plain)\n </h3>\n <p className=\"eds-selector-matrix__sub\">\n Clicking a row selects it and deselects the others. The row tints\n blue when selected.\n </p>\n <div className=\"eds-selector-matrix__list\" role=\"listbox\">\n {[\"one\", \"two\", \"three\", \"four\"].map((key) => (\n <Selector\n key={key}\n type=\"Plain\"\n label={`Option ${key}`}\n selected={pickedPlain === key}\n onChange={(s) => s && setPickedPlain(key)}\n />\n ))}\n </div>\n <p className=\"eds-selector-matrix__pre\">picked: {pickedPlain}</p>\n </section>\n\n <section className=\"eds-selector-matrix__section\">\n <h3 className=\"eds-selector-matrix__heading\">\n Interactive · multi-select (Checkbox)\n </h3>\n <p className=\"eds-selector-matrix__sub\">\n Click anywhere on the row to toggle the checkbox. The third row has a\n tooltip; hover the info icon.\n </p>\n <div className=\"eds-selector-matrix__list\" role=\"group\">\n {[\n { key: \"apple\", label: \"Apple\", tooltip: false },\n { key: \"banana\", label: \"Banana\", tooltip: false },\n {\n key: \"cherry\",\n label: \"Cherry\",\n tooltip: true,\n tooltipText: \"Stone fruit — pairs well with chocolate.\",\n },\n { key: \"date\", label: \"Date\", tooltip: false },\n ].map((opt) => (\n <Selector\n key={opt.key}\n type=\"Checkbox\"\n label={opt.label}\n tooltip={opt.tooltip}\n tooltipText={opt.tooltipText}\n selected={pickedCheck.has(opt.key)}\n onChange={() => togglePick(opt.key)}\n />\n ))}\n </div>\n <p className=\"eds-selector-matrix__pre\">\n picked: [{Array.from(pickedCheck).join(\", \")}]\n </p>\n </section>\n\n <section className=\"eds-selector-matrix__section\">\n <h3 className=\"eds-selector-matrix__heading\">\n Interactive · radio group (Radio)\n </h3>\n <p className=\"eds-selector-matrix__sub\">\n Three radios sharing a group name. Picking one deselects the others.\n </p>\n <div\n className=\"eds-selector-matrix__list\"\n role=\"radiogroup\"\n aria-label=\"Size\"\n >\n {[\n { key: \"small\", label: \"Small\" },\n { key: \"medium\", label: \"Medium\" },\n { key: \"large\", label: \"Large\" },\n ].map((opt) => (\n <Selector\n key={opt.key}\n type=\"Radio\"\n label={opt.label}\n name=\"eds-selector-demo-size\"\n value={opt.key}\n selected={pickedRadio === opt.key}\n onChange={(s) => s && setPickedRadio(opt.key)}\n />\n ))}\n </div>\n <p className=\"eds-selector-matrix__pre\">picked: {pickedRadio}</p>\n </section>\n\n <section className=\"eds-selector-matrix__section\">\n <h3 className=\"eds-selector-matrix__heading\">Booleans · LeadingIcon × Tooltip</h3>\n <p className=\"eds-selector-matrix__sub\">\n LeadingIcon applies to Type=Icon. Tooltip applies to any type and\n sits at the trailing edge.\n </p>\n <div className=\"eds-selector-matrix__list\">\n <Selector type=\"Plain\" label=\"Plain · no tooltip\" />\n <Selector\n type=\"Plain\"\n label=\"Plain · with tooltip\"\n tooltip\n tooltipText=\"Extra info about this option.\"\n />\n <Selector type=\"Icon\" label=\"Icon · default placeholder\" leadingIcon />\n <Selector\n type=\"Icon\"\n label=\"Icon · custom node\"\n leadingIcon={\n <svg viewBox=\"0 0 20 20\" width=\"20\" height=\"20\" aria-hidden>\n <circle cx=\"10\" cy=\"10\" r=\"7\" fill=\"#306AE8\" />\n </svg>\n }\n />\n <Selector\n type=\"Icon\"\n label=\"Icon · with tooltip\"\n leadingIcon\n tooltip\n tooltipText=\"Has both leading icon and trailing tooltip.\"\n />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Dropdown — React port of Embleema Design System 2.0's Input/Dropdown\n * (Figma node 4208:353) + Input/Dropdown Menu (Figma node 4278:501).\n *\n * Composes <Field /> as the visual trigger and renders a floating menu\n * below when open. Supports Single and Multi selection, optional search,\n * keyboard navigation, click-outside-to-close, and full controlled or\n * uncontrolled value/open state.\n *\n * Dropdown props:\n * - options : DropdownOption[] (value + label, optional disabled)\n * - type : \"Single\" | \"Multi\"\n * - search : show search input at top of menu, filters options\n * - value : controlled selection (string for Single, string[] for Multi)\n * - defaultValue : uncontrolled initial selection\n * - onChange : called with the new selection\n * - open / defaultOpen / onOpenChange : open-state passthrough\n * - validation, appearance, labelPosition, label, required, helperText:\n * Field-level props, behave identically to TextField\n * - placeholder, disabled, state, id, name, aria-label\n *\n * Keyboard:\n * - Click trigger or ArrowDown when closed → opens menu, highlights first option\n * - ArrowDown / ArrowUp → move highlight\n * - Enter / Space → select highlighted option (Multi: toggle; Single: select + close)\n * - Escape → close menu\n * - Tab → close menu, return focus to trigger\n * - Typing in search input filters options (search-only mode)\n */\n\nimport * as React from \"react\";\nimport {\n Field,\n type FieldState,\n type FieldValidation,\n type FieldAppearance,\n} from \"./Field\";\nimport { Selector } from \"./Selector\";\n\nexport type DropdownType = \"Single\" | \"Multi\";\nexport type DropdownLabelPosition = \"Top\" | \"Left\";\n\nexport type DropdownOption = {\n value: string;\n label: string;\n disabled?: boolean;\n};\n\nexport type DropdownProps = {\n options: DropdownOption[];\n type?: DropdownType;\n /** Search is auto-enabled when options.length > 5. Override here only if\n * you need to force it on (e.g., async-loaded options) or off. */\n search?: boolean;\n searchPlaceholder?: string;\n\n value?: string | string[];\n defaultValue?: string | string[];\n onChange?: (value: string | string[]) => void;\n\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n\n validation?: FieldValidation;\n appearance?: FieldAppearance;\n labelPosition?: DropdownLabelPosition;\n label?: string;\n required?: boolean;\n helperText?: string;\n placeholder?: string;\n state?: FieldState;\n disabled?: boolean;\n\n id?: string;\n name?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — menu surface uses Background/Default + Border/Default, options\n// hover/highlight on Background/Selected, no-results text in Text/Tertiary.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --dd-text-primary: #0E0E0E;\n --dd-text-secondary: #5E5E5E;\n --dd-text-tertiary: #848484;\n --dd-text-placeholder: #848484;\n --dd-text-disabled: #848484;\n --dd-text-inverse: #FEFEFE;\n --dd-action-primary: #306AE8;\n --dd-feedback-error-text: #B31A1A;\n --dd-background-default: #FEFEFE;\n --dd-background-primary: #F8F8F8;\n --dd-background-field: #F8F8F8;\n --dd-background-selected: #E3ECFF;\n --dd-border-default: #DDDDDD;\n --dd-border-focus: #306AE8;\n --dd-border-focus-ring: #A2BDF5;\n --dd-blue-100: #E3ECFF;\n}\n\n/* ---------------- Multi-select chip field ----------------\n When type=Multi has selections, the dropdown trigger swaps from the\n plain Field (which would join labels into a single string) to this\n chip-field that mirrors the Field's chrome and renders each selection\n as a removable chip/pill. Matches Background/Field + Border/Default at\n rest; lights up the focus ring on :focus-within or while the menu is\n open. Chips use the system Chip's pill styling. */\n.eds-dd__chip-field {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 6px;\n width: 100%;\n min-height: 48px;\n padding: 10px 12px;\n border-radius: 4px;\n border: 1px solid var(--dd-border-default);\n background: var(--dd-background-field);\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.08);\n font-family: Nunito, sans-serif;\n color: var(--dd-text-primary);\n box-sizing: border-box;\n cursor: pointer;\n transition: border-color 120ms ease-out, box-shadow 120ms ease-out;\n}\n.eds-dd__chip-field[data-open=\"true\"] {\n border-color: var(--dd-border-focus);\n box-shadow: 0 0 0 4px var(--dd-border-focus-ring), 0 0 4px 0 rgba(0, 0, 0, 0.08);\n}\n.eds-dd__chip-field[data-disabled=\"true\"] {\n cursor: not-allowed;\n opacity: 0.6;\n}\n\n.eds-dd__chip {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 4px 4px 4px 12px;\n border-radius: 16px;\n background: var(--dd-blue-100);\n color: var(--dd-text-primary);\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 14px;\n line-height: 1.2;\n max-width: 100%;\n min-width: 0;\n}\n.eds-dd__chip-label {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n}\n.eds-dd__chip-close {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n border: 0;\n background: transparent;\n cursor: pointer;\n color: var(--dd-action-primary);\n border-radius: 999px;\n padding: 0;\n flex-shrink: 0;\n transition: background-color 100ms ease-out;\n}\n.eds-dd__chip-close:hover { background: rgba(48, 106, 232, 0.15); }\n.eds-dd__chip-close:focus-visible {\n outline: 2px solid var(--dd-action-primary);\n outline-offset: 1px;\n}\n.eds-dd__chip-close svg { display: block; width: 12px; height: 12px; }\n\n/* The trailing chevron in the chip field sits to the right of all chips,\n pushed by margin-left: auto on its container. */\n.eds-dd__chip-field-spacer { flex: 1 1 0; min-width: 0; }\n.eds-dd__chip-field-chevron {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n color: var(--dd-text-primary);\n flex-shrink: 0;\n}\n.eds-dd__chip-field-chevron svg { display: block; width: 20px; height: 20px; }\n\n.eds-dd__chip-placeholder {\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--dd-text-placeholder);\n}\n\n.eds-dd {\n font-family: Nunito, sans-serif;\n display: flex;\n gap: 4px;\n width: 100%;\n max-width: 520px;\n box-sizing: border-box;\n}\n.eds-dd[data-label-position=\"Top\"] {\n flex-direction: column;\n max-width: 400px;\n}\n.eds-dd[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 8px;\n}\n\n.eds-dd__label {\n display: inline-flex;\n align-items: center;\n gap: 2px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 150%;\n color: var(--dd-label-color, var(--dd-text-primary));\n cursor: default;\n}\n.eds-dd[data-validation=\"Error\"] .eds-dd__label {\n color: var(--dd-feedback-error-text);\n}\n.eds-dd[data-state=\"Disabled\"] .eds-dd__label {\n color: var(--dd-text-disabled);\n}\n.eds-dd[data-label-position=\"Left\"] .eds-dd__label {\n width: 120px;\n flex-shrink: 0;\n padding-top: 12px;\n}\n.eds-dd__required { color: var(--dd-feedback-error-text); }\n\n.eds-dd__content {\n display: flex;\n flex-direction: column;\n gap: 4px;\n flex: 1;\n min-width: 0;\n}\n\n.eds-dd__anchor {\n position: relative;\n width: 100%;\n cursor: pointer;\n}\n.eds-dd__anchor .eds-field-wrap {\n width: 100%;\n cursor: pointer;\n}\n/* When the trigger is the read-only field, keep the input pointer-cursor too\n instead of the default text cursor a read-only input would otherwise show. */\n.eds-dd__anchor .eds-field-wrap__input {\n cursor: pointer;\n pointer-events: none; /* Field clicks bubble to the anchor wrapper */\n}\n/* In search mode the trigger Field becomes an actual editable search input.\n Re-enable pointer events + text cursor so the user can click into it and\n type. The wrapper also flips its own cursor to text. */\n.eds-dd__anchor[data-searching=\"true\"],\n.eds-dd__anchor[data-searching=\"true\"] .eds-field-wrap {\n cursor: text;\n}\n.eds-dd__anchor[data-searching=\"true\"] .eds-field-wrap__input {\n cursor: text;\n pointer-events: auto;\n}\n.eds-dd[data-state=\"Disabled\"] .eds-dd__anchor,\n.eds-dd[data-state=\"Disabled\"] .eds-dd__anchor .eds-field-wrap,\n.eds-dd[data-state=\"Disabled\"] .eds-dd__anchor .eds-field-wrap__input {\n cursor: not-allowed;\n}\n\n.eds-dd__chevron {\n width: 20px;\n height: 20px;\n display: block;\n transition: transform 180ms ease-out;\n color: var(--dd-text-primary);\n}\n.eds-dd[data-state=\"Disabled\"] .eds-dd__chevron {\n color: var(--dd-text-disabled);\n}\n.eds-dd[data-open=\"true\"] .eds-dd__chevron {\n transform: rotate(180deg);\n}\n\n.eds-dd__helper {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 140%;\n color: var(--dd-text-primary);\n}\n.eds-dd[data-validation=\"Error\"] .eds-dd__helper {\n color: var(--dd-feedback-error-text);\n}\n.eds-dd[data-state=\"Disabled\"] .eds-dd__helper {\n color: var(--dd-text-disabled);\n}\n\n/* =============================================================\n Menu surface\n ============================================================= */\n.eds-dd__menu {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n right: 0;\n z-index: 100;\n background: var(--dd-background-default);\n border: 1px solid var(--dd-border-default);\n border-radius: 4px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);\n display: flex;\n flex-direction: column;\n overflow: hidden;\n font-family: Nunito, sans-serif;\n}\n\n.eds-dd__options {\n list-style: none;\n margin: 0;\n padding: 4px 0;\n max-height: 240px;\n overflow-y: auto;\n}\n\n/* Menu rows wrap a Selector (Radio for Single, Checkbox for Multi). The LI\n owns interactivity (mousedown preventDefault keeps focus in the trigger,\n highlight on mouseenter); the Selector inside is pointer-events: none and\n purely visual. Highlight tint comes from passing state=\"Hover\" to the\n Selector, which uses the same Background/Selected token the rest of the\n menu does — so hover/focus styling stays consistent. */\n.eds-dd__menu-item {\n list-style: none;\n margin: 0;\n padding: 0;\n cursor: pointer;\n}\n.eds-dd__menu-item[aria-disabled=\"true\"] {\n cursor: not-allowed;\n}\n.eds-dd__menu-selector {\n pointer-events: none;\n width: 100%;\n}\n\n.eds-dd__no-results {\n padding: 12px;\n color: var(--dd-text-tertiary);\n font-size: 16px;\n line-height: 150%;\n}\n\n/* =============================================================\n Matrix\n ============================================================= */\n.eds-dd-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-dd-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-dd-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-dd-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-dd-matrix__row {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.eds-dd-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-dd-matrix__pair {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n align-items: start;\n}\n/* The matrix is taller than usual when dropdowns are open; give the section\n breathing room so menus don't overlap the row below. */\n.eds-dd-matrix__row { min-height: 96px; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-dropdown]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-dropdown\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — DropdownIcon path data is extracted directly from\n// Icon/Navigation/Dropdown (Figma node 4052:3068). It's a solid downward\n// caret, 13×7 vector positioned at (6, 8) inside a 24×24 frame.\n// ---------------------------------------------------------------------------\nfunction DropdownIcon() {\n return (\n <svg\n className=\"eds-dd__chevron\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <g transform=\"translate(6 8)\">\n <path d=\"M5.575 6.646 0.237 1.309C0.164 1.236 0.106 1.153 0.064 1.062 0.021 0.972 0 0.875 0 0.771 0 0.563 0.07 0.383 0.21 0.23 0.351 0.077 0.536 0 0.765 0L12.009 0C12.239 0 12.424 0.077 12.564 0.232 12.704 0.386 12.775 0.567 12.775 0.773 12.775 0.824 12.695 1.003 12.537 1.309L7.2 6.646C7.077 6.769 6.951 6.859 6.82 6.915 6.689 6.972 6.545 7 6.387 7 6.23 7 6.086 6.972 5.955 6.915 5.824 6.859 5.697 6.769 5.575 6.646Z\" />\n </g>\n </svg>\n );\n}\n\nfunction SearchIcon() {\n return (\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <path d=\"M15.5 14h-.79l-.28-.27A6.5 6.5 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" />\n </svg>\n );\n}\n\n// Small close glyph used as the X on multi-select chips.\nfunction ChipCloseIcon() {\n return (\n <svg viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M3 3l6 6M9 3l-6 6\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\nlet idCounter = 0;\nfunction useGeneratedId(provided?: string) {\n const [id] = React.useState(() => provided ?? `eds-dd-${++idCounter}`);\n return id;\n}\n\nfunction valueToSet(v: string | string[] | undefined): Set<string> {\n if (v === undefined || v === null) return new Set();\n if (Array.isArray(v)) return new Set(v);\n if (v === \"\") return new Set();\n return new Set([v]);\n}\n\n// ---------------------------------------------------------------------------\n// DropdownMenu — the floating panel with options. Exported separately so it\n// can be composed standalone in non-Dropdown contexts.\n// ---------------------------------------------------------------------------\ntype DropdownMenuProps = {\n type: DropdownType;\n selected: Set<string>;\n filteredOptions: DropdownOption[];\n highlightedIndex: number;\n onHighlight: (index: number) => void;\n onSelect: (option: DropdownOption) => void;\n showNoResults: boolean;\n listboxId: string;\n};\n\nfunction DropdownMenu({\n type,\n selected,\n filteredOptions,\n highlightedIndex,\n onHighlight,\n onSelect,\n showNoResults,\n listboxId,\n}: DropdownMenuProps) {\n const listRef = React.useRef<HTMLUListElement>(null);\n\n // Multi mode embeds real <input type=\"checkbox\"> elements via Selector that\n // default to tabIndex=0. The dropdown's trigger owns keyboard nav, so menu\n // items must not be tab stops — flip them all to -1 after every render.\n React.useLayoutEffect(() => {\n if (!listRef.current) return;\n listRef.current\n .querySelectorAll<HTMLInputElement>(\"input\")\n .forEach((input) => {\n input.tabIndex = -1;\n });\n });\n\n // Single → plain text rows (no radio); Multi → checkbox rows. Radios are\n // intentionally NOT used in dropdowns — single-select communicates the\n // active choice through the tinted row + closed menu, not a control.\n const selectorType: \"Plain\" | \"Checkbox\" =\n type === \"Multi\" ? \"Checkbox\" : \"Plain\";\n\n return (\n <div className=\"eds-dd__menu\">\n {showNoResults ? (\n <div className=\"eds-dd__no-results\" role=\"status\">\n No results\n </div>\n ) : (\n <ul\n ref={listRef}\n id={listboxId}\n className=\"eds-dd__options\"\n role=\"listbox\"\n aria-multiselectable={type === \"Multi\"}\n >\n {filteredOptions.map((option, i) => {\n const isSelected = selected.has(option.value);\n const isHighlighted = i === highlightedIndex;\n return (\n <li\n key={option.value}\n className=\"eds-dd__menu-item\"\n role=\"option\"\n aria-selected={isSelected}\n aria-disabled={option.disabled || undefined}\n data-highlighted={isHighlighted || undefined}\n onMouseEnter={() => onHighlight(i)}\n onMouseDown={(e) => {\n e.preventDefault(); // keep focus in trigger / search\n if (!option.disabled) onSelect(option);\n }}\n >\n <Selector\n type={selectorType}\n label={option.label}\n selected={isSelected}\n disabled={option.disabled}\n state={isHighlighted ? \"Hover\" : undefined}\n value={option.value}\n className=\"eds-dd__menu-selector\"\n />\n </li>\n );\n })}\n </ul>\n )}\n </div>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Dropdown — main component\n// ---------------------------------------------------------------------------\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n function Dropdown(\n {\n options,\n type = \"Single\",\n search,\n searchPlaceholder = \"Search…\",\n value,\n defaultValue,\n onChange,\n open,\n defaultOpen = false,\n onOpenChange,\n validation = \"None\",\n appearance = \"Filled\",\n labelPosition = \"Top\",\n label,\n required = false,\n helperText,\n placeholder = \"Select…\",\n state,\n disabled = false,\n id: providedId,\n name,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const id = useGeneratedId(providedId);\n\n // Search is auto-enabled when there are more than 5 options. An explicit\n // `search` prop overrides this heuristic in either direction.\n const SEARCH_THRESHOLD = 5;\n const searchEnabled = search ?? options.length > SEARCH_THRESHOLD;\n\n // --- open state ---\n const openControlled = open !== undefined;\n const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n const isOpen = openControlled ? !!open : internalOpen;\n const setOpen = React.useCallback(\n (next: boolean) => {\n if (!openControlled) setInternalOpen(next);\n onOpenChange?.(next);\n },\n [openControlled, onOpenChange]\n );\n\n // --- value state ---\n const valueControlled = value !== undefined;\n const [internalSelected, setInternalSelected] = React.useState<Set<string>>(\n () => valueToSet(defaultValue)\n );\n const selected = valueControlled ? valueToSet(value) : internalSelected;\n const setSelected = (next: Set<string>) => {\n if (!valueControlled) setInternalSelected(next);\n onChange?.(type === \"Multi\" ? Array.from(next) : Array.from(next)[0] ?? \"\");\n };\n\n // --- search query ---\n const [query, setQuery] = React.useState(\"\");\n const filteredOptions = React.useMemo(() => {\n if (!searchEnabled || !query) return options;\n const q = query.toLowerCase();\n return options.filter((o) => o.label.toLowerCase().includes(q));\n }, [options, query, searchEnabled]);\n\n // --- highlighted option (keyboard) ---\n const [highlightedIndex, setHighlightedIndex] = React.useState(0);\n React.useEffect(() => {\n if (isOpen) {\n // When opening, highlight first selected option if any, else 0.\n const firstSelected = filteredOptions.findIndex((o) =>\n selected.has(o.value)\n );\n setHighlightedIndex(firstSelected >= 0 ? firstSelected : 0);\n }\n }, [isOpen]); // eslint-disable-line react-hooks/exhaustive-deps\n React.useEffect(() => {\n // Clamp highlight if filtered list shrinks below current index.\n if (highlightedIndex >= filteredOptions.length) {\n setHighlightedIndex(Math.max(0, filteredOptions.length - 1));\n }\n }, [filteredOptions.length, highlightedIndex]);\n\n // --- refs ---\n const wrapperRef = React.useRef<HTMLDivElement | null>(null);\n const triggerRef = React.useRef<HTMLDivElement | null>(null);\n const menuRef = React.useRef<HTMLDivElement | null>(null);\n const fieldInputRef = React.useRef<HTMLInputElement | null>(null);\n\n // True only when the trigger Field is acting as the search input.\n const isSearching = isOpen && searchEnabled;\n\n // --- click-outside ---\n React.useEffect(() => {\n if (!isOpen) return;\n const onDocMouseDown = (e: MouseEvent) => {\n if (\n wrapperRef.current &&\n !wrapperRef.current.contains(e.target as Node)\n ) {\n setOpen(false);\n }\n };\n document.addEventListener(\"mousedown\", onDocMouseDown);\n return () => document.removeEventListener(\"mousedown\", onDocMouseDown);\n }, [isOpen, setOpen]);\n\n // --- autofocus the Field input when menu opens with search enabled ---\n React.useEffect(() => {\n if (isOpen && searchEnabled) {\n // microtask so the input has been mounted as editable\n Promise.resolve().then(() => fieldInputRef.current?.focus());\n }\n if (!isOpen) setQuery(\"\");\n }, [isOpen, searchEnabled]);\n\n // Reset the highlight to the first option whenever the filter changes,\n // so arrow-key nav starts from a sensible spot after typing.\n React.useEffect(() => {\n setHighlightedIndex(0);\n }, [query]);\n\n // --- selection helper ---\n const handleSelect = (option: DropdownOption) => {\n if (option.disabled) return;\n const next = new Set(selected);\n if (type === \"Multi\") {\n if (next.has(option.value)) next.delete(option.value);\n else next.add(option.value);\n } else {\n next.clear();\n next.add(option.value);\n }\n setSelected(next);\n if (type === \"Single\") setOpen(false);\n };\n\n // --- keyboard handlers ---\n const moveHighlight = (delta: number) => {\n if (filteredOptions.length === 0) return;\n let next = highlightedIndex + delta;\n // skip disabled\n let attempts = 0;\n while (\n attempts < filteredOptions.length &&\n filteredOptions[((next % filteredOptions.length) + filteredOptions.length) % filteredOptions.length]\n ?.disabled\n ) {\n next += delta;\n attempts++;\n }\n const wrapped =\n ((next % filteredOptions.length) + filteredOptions.length) %\n filteredOptions.length;\n setHighlightedIndex(wrapped);\n };\n\n // Single keyboard handler on the anchor — covers both the anchor (when not\n // searching) and the inner Field input (events bubble). When the input is\n // focused, Space must NOT be intercepted so the user can type spaces.\n const onTriggerKeyDown: React.KeyboardEventHandler<HTMLDivElement> = (e) => {\n if (disabled) return;\n const inputFocused = e.target === fieldInputRef.current;\n\n if (!isOpen) {\n if (\n e.key === \"ArrowDown\" ||\n e.key === \"Enter\" ||\n (e.key === \" \" && !inputFocused)\n ) {\n e.preventDefault();\n setOpen(true);\n }\n return;\n }\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n moveHighlight(1);\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n moveHighlight(-1);\n } else if (e.key === \"Enter\") {\n e.preventDefault();\n const option = filteredOptions[highlightedIndex];\n if (option) handleSelect(option);\n } else if (e.key === \" \" && !inputFocused) {\n e.preventDefault();\n const option = filteredOptions[highlightedIndex];\n if (option) handleSelect(option);\n } else if (e.key === \"Escape\") {\n e.preventDefault();\n setOpen(false);\n triggerRef.current?.focus();\n } else if (e.key === \"Tab\") {\n setOpen(false);\n }\n };\n\n // --- display value in the trigger field ---\n const displayValue = React.useMemo(() => {\n if (selected.size === 0) return \"\";\n if (type === \"Multi\") {\n return Array.from(selected)\n .map((v) => options.find((o) => o.value === v)?.label)\n .filter(Boolean)\n .join(\", \");\n }\n return options.find((o) => selected.has(o.value))?.label ?? \"\";\n }, [selected, options, type]);\n\n // --- effective state ---\n // When user passes `state`, honor it. Otherwise: Disabled if disabled,\n // Focused if menu open, undefined to let browser drive Default/Hover/Focus.\n const effectiveFieldState: FieldState | undefined =\n state ?? (disabled ? \"Disabled\" : isOpen ? \"Focused\" : \"Default\");\n const effectiveWrapperState = state ?? (disabled ? \"Disabled\" : undefined);\n const wrapperClass = \"eds-dd\" + (className ? ` ${className}` : \"\");\n\n const labelEl = label ? (\n <label className=\"eds-dd__label\" htmlFor={id}>\n {required && (\n <span className=\"eds-dd__required\" aria-hidden>\n *\n </span>\n )}\n <span>{label}</span>\n </label>\n ) : null;\n\n const showNoResults =\n isSearching && query.length > 0 && filteredOptions.length === 0;\n\n const fieldEl = (\n <div\n ref={triggerRef}\n className=\"eds-dd__anchor\"\n data-searching={isSearching || undefined}\n tabIndex={disabled ? -1 : 0}\n role=\"combobox\"\n aria-expanded={isOpen}\n aria-haspopup=\"listbox\"\n aria-controls={isOpen ? `${id}-listbox` : undefined}\n aria-label={ariaLabel ?? (label ? undefined : \"Dropdown\")}\n onMouseDown={(e) => {\n if (disabled) return;\n // Skip mousedowns inside the open menu — option selection has its\n // own handler.\n if (menuRef.current?.contains(e.target as Node)) return;\n\n const targetEl = e.target as HTMLElement;\n const isChevronClick = !!targetEl.closest(\n \".eds-field-wrap__icon--trailing\"\n );\n const isInputClick = targetEl === fieldInputRef.current;\n\n // Chevron always toggles, regardless of search mode.\n if (isChevronClick) {\n e.preventDefault();\n setOpen(!isOpen);\n if (!isOpen && searchEnabled) {\n Promise.resolve().then(() => fieldInputRef.current?.focus());\n } else {\n triggerRef.current?.focus();\n }\n return;\n }\n\n // In search mode: clicking the input area lets native focus take\n // over; clicking elsewhere (e.g. leading icon padding) routes focus\n // to the input so typing keeps working.\n if (isSearching) {\n if (!isInputClick) {\n e.preventDefault();\n fieldInputRef.current?.focus();\n }\n return;\n }\n\n // Closed (or open without search): toggle. preventDefault avoids\n // the browser's synthetic label->input click that would otherwise\n // double-fire and cancel the toggle.\n e.preventDefault();\n setOpen(!isOpen);\n if (!isOpen && searchEnabled) {\n Promise.resolve().then(() => fieldInputRef.current?.focus());\n } else {\n triggerRef.current?.focus();\n }\n }}\n onKeyDown={onTriggerKeyDown}\n >\n {type === \"Multi\" && selected.size > 0 && !isSearching ? (\n <div\n className=\"eds-dd__chip-field\"\n data-open={isOpen || undefined}\n data-disabled={disabled || undefined}\n role=\"presentation\"\n >\n {Array.from(selected).map((value) => {\n const opt = options.find((o) => o.value === value);\n const labelText = opt?.label ?? value;\n return (\n <span key={value} className=\"eds-dd__chip\">\n <span className=\"eds-dd__chip-label\">{labelText}</span>\n <button\n type=\"button\"\n className=\"eds-dd__chip-close\"\n aria-label={`Remove ${labelText}`}\n onMouseDown={(e) => {\n // Stop the trigger's mousedown from toggling the menu.\n e.preventDefault();\n e.stopPropagation();\n }}\n onClick={(e) => {\n e.stopPropagation();\n const next = new Set(selected);\n next.delete(value);\n onChange?.(\n type === \"Multi\" ? Array.from(next) : Array.from(next)[0] ?? \"\"\n );\n }}\n >\n <ChipCloseIcon />\n </button>\n </span>\n );\n })}\n <span className=\"eds-dd__chip-field-spacer\" aria-hidden />\n <span className=\"eds-dd__chip-field-chevron\" aria-hidden>\n <DropdownIcon />\n </span>\n </div>\n ) : (\n <Field\n ref={fieldInputRef}\n id={id}\n state={effectiveFieldState}\n validation={validation}\n appearance={appearance}\n placeholder={isSearching ? searchPlaceholder : placeholder}\n value={isSearching ? query : displayValue}\n onChange={(e) => {\n if (isSearching) setQuery(e.target.value);\n }}\n readOnly={!isSearching}\n aria-label={ariaLabel ?? (label ? undefined : \"Dropdown\")}\n leadingIcon={isSearching ? <SearchIcon /> : undefined}\n trailingIcon={<DropdownIcon />}\n />\n )}\n {isOpen && (\n <div ref={menuRef}>\n <DropdownMenu\n type={type}\n selected={selected}\n filteredOptions={filteredOptions}\n highlightedIndex={highlightedIndex}\n onHighlight={setHighlightedIndex}\n onSelect={handleSelect}\n showNoResults={showNoResults}\n listboxId={`${id}-listbox`}\n />\n </div>\n )}\n </div>\n );\n\n const helperEl = helperText ? (\n <div className=\"eds-dd__helper\">{helperText}</div>\n ) : null;\n\n // --- composition ---\n return (\n <div\n ref={(el) => {\n wrapperRef.current = el;\n if (typeof ref === \"function\") ref(el);\n else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = el;\n }}\n className={wrapperClass}\n data-label-position={labelPosition}\n data-validation={validation}\n data-state={effectiveWrapperState}\n data-open={isOpen || undefined}\n >\n {labelPosition === \"Top\" ? (\n <>\n {labelEl}\n {fieldEl}\n {helperEl}\n </>\n ) : (\n <>\n {labelEl}\n <div className=\"eds-dd__content\">\n {fieldEl}\n {helperEl}\n </div>\n </>\n )}\n </div>\n );\n }\n);\n\nexport default Dropdown;\n\n// ---------------------------------------------------------------------------\n// DropdownMatrix — interactive showcase\n// ---------------------------------------------------------------------------\n// 9 options — over the 5-item threshold, so search auto-shows.\nconst SAMPLE_OPTIONS: DropdownOption[] = [\n { value: \"ecrf\", label: \"eCRF (Electronic Case Report Form)\" },\n { value: \"consent\", label: \"Informed Consent\" },\n { value: \"demographics\", label: \"Demographics\" },\n { value: \"vitals\", label: \"Vital Signs\" },\n { value: \"labs\", label: \"Laboratory Results\" },\n { value: \"ae\", label: \"Adverse Events\" },\n { value: \"meds\", label: \"Concomitant Medications\" },\n { value: \"qol\", label: \"Quality of Life\" },\n { value: \"withdrawn\", label: \"Withdrawn\", disabled: true },\n];\n\n// 4 options — under the threshold, so search stays hidden.\nconst SHORT_OPTIONS: DropdownOption[] = [\n { value: \"yes\", label: \"Yes\" },\n { value: \"no\", label: \"No\" },\n { value: \"unsure\", label: \"Unsure\" },\n { value: \"na\", label: \"N/A\" },\n];\n\nconst VALIDATIONS: FieldValidation[] = [\n \"None\",\n \"Error\",\n \"Warning\",\n \"Success\",\n \"AI\",\n];\n\nexport function DropdownMatrix() {\n ensureStyles();\n const [single, setSingle] = React.useState<string>(\"\");\n const [multi, setMulti] = React.useState<string[]>([\"demographics\", \"vitals\"]);\n\n return (\n <div className=\"eds-dd-matrix\">\n <section className=\"eds-dd-matrix__section\">\n <h3 className=\"eds-dd-matrix__heading\">Long list (9 options)</h3>\n <p className=\"eds-dd-matrix__sub\">\n Over 5 options → the trigger field itself transforms into a search\n input when open (magnifying-glass icon appears on the left, the\n placeholder switches to \"Search…\", you can type to filter). The\n menu below shows only options. Arrow keys to navigate, Enter to\n select, Escape to close.\n </p>\n <Dropdown\n label=\"Form type\"\n required\n helperText=\"Pick the form you want to load.\"\n options={SAMPLE_OPTIONS}\n type=\"Single\"\n value={single}\n onChange={(v) => setSingle(v as string)}\n />\n </section>\n\n <section className=\"eds-dd-matrix__section\">\n <h3 className=\"eds-dd-matrix__heading\">Short list (4 options)</h3>\n <p className=\"eds-dd-matrix__sub\">\n Five or fewer options → no search; the menu is just the options.\n </p>\n <Dropdown\n label=\"Are you eligible?\"\n required\n options={SHORT_OPTIONS}\n type=\"Single\"\n />\n </section>\n\n <section className=\"eds-dd-matrix__section\">\n <h3 className=\"eds-dd-matrix__heading\">Single-select vs Multi-select with chips</h3>\n <p className=\"eds-dd-matrix__sub\">\n Single-select renders the chosen label as plain text. Multi-select\n renders each selection as a removable chip/pill inside the field —\n click the X on a chip to drop just that value, or use the menu to\n add more. Both pull from the same options list.\n </p>\n <div\n style={{\n display: \"grid\",\n gridTemplateColumns: \"minmax(0, 1fr) minmax(0, 1fr)\",\n gap: 24,\n alignItems: \"start\",\n }}\n >\n <Dropdown\n label=\"Single-select\"\n helperText=\"One value only.\"\n options={SAMPLE_OPTIONS}\n type=\"Single\"\n value={single}\n onChange={(v) => setSingle(v as string)}\n />\n <Dropdown\n label=\"Multi-select with chips\"\n helperText=\"Pick any number — each lands as a removable chip.\"\n options={SAMPLE_OPTIONS}\n type=\"Multi\"\n value={multi}\n onChange={(v) => setMulti(v as string[])}\n />\n </div>\n </section>\n\n <section className=\"eds-dd-matrix__section\">\n <h3 className=\"eds-dd-matrix__heading\">Validation × Style</h3>\n <p className=\"eds-dd-matrix__sub\">\n The label and field-border tints follow the same rules as the Text\n Field component.\n </p>\n {VALIDATIONS.map((validation) => (\n <div key={validation} className=\"eds-dd-matrix__row\">\n <p className=\"eds-dd-matrix__row-label\">{validation}</p>\n <div className=\"eds-dd-matrix__pair\">\n <Dropdown\n label=\"Form type\"\n required\n helperText={\n validation === \"Error\"\n ? \"Selection is required.\"\n : \"Pick one.\"\n }\n options={SAMPLE_OPTIONS}\n type=\"Single\"\n validation={validation}\n appearance=\"Filled\"\n />\n <Dropdown\n label=\"Form type\"\n required\n helperText={\n validation === \"Error\"\n ? \"Selection is required.\"\n : \"Pick one.\"\n }\n options={SAMPLE_OPTIONS}\n type=\"Single\"\n validation={validation}\n appearance=\"Outlined\"\n />\n </div>\n </div>\n ))}\n </section>\n\n <section className=\"eds-dd-matrix__section\">\n <h3 className=\"eds-dd-matrix__heading\">LabelPosition · Left</h3>\n <Dropdown\n label=\"Form type\"\n helperText=\"Label sits on the left.\"\n options={SAMPLE_OPTIONS}\n type=\"Single\"\n labelPosition=\"Left\"\n />\n </section>\n\n <section className=\"eds-dd-matrix__section\">\n <h3 className=\"eds-dd-matrix__heading\">Disabled</h3>\n <Dropdown\n label=\"Locked form\"\n helperText=\"Cannot be changed.\"\n options={SAMPLE_OPTIONS}\n defaultValue=\"ecrf\"\n disabled\n />\n </section>\n </div>\n );\n}\n","/**\n * StatusBadge — React port of Embleema Design System 2.0's Clinical/Status\n * Badge component (Figma node 4698:19).\n *\n * Small gradient indicator (16 × 16 pill inside a 20 × 20 padded frame) that\n * communicates a clinical form's completion state. Per the Figma description,\n * this is intended to be composed inside Clinical/FormStatusChip and form\n * navigation surfaces — not used standalone — but it exports cleanly so the\n * higher-level components can drop it in.\n *\n * Five types, each with a distinct gradient pulled directly from Figma:\n * - NotStarted → #FEFEFE 23.66% → #D8D8D8 98.58% (top → bottom)\n * + 1 px Border/Default outline\n * - Valid → #0A595C 11.79% → #028388 55.28% → #00AFB2 99.99%\n * (bottom → top)\n * - WarningsFlagged → #FCA266 → #FA6400 100% (top → bottom)\n * - ErrorsFlagged → #FA6400 → #E02020 56.5% → #FF66AB 100%\n * (top → bottom)\n * - LockedSubmitted → #644AD4 23.07% → #2760DE 90.48% (top → bottom)\n * + 12 × 12 white lock icon (Icon/Utility/Lock)\n *\n * Note on tokens: the gradient stops are stored as raw hex values in the\n * Figma source — none of them bind to semantic variables (Figma can't\n * variable-bind gradient stops). Only NotStarted's border binds to\n * Border/Default. The badge's surrounding 20 × 20 frame is inert chrome.\n *\n * Props:\n * - type : NotStarted | Valid | WarningsFlagged | ErrorsFlagged | LockedSubmitted\n */\n\nimport * as React from \"react\";\n\nexport type StatusBadgeType =\n | \"NotStarted\"\n | \"Valid\"\n | \"WarningsFlagged\"\n | \"ErrorsFlagged\"\n | \"LockedSubmitted\";\n\nexport type StatusBadgeProps = {\n type?: StatusBadgeType;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n:root {\n --statusbadge-border-default: #DDDDDD;\n}\n\n.eds-statusbadge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n padding: 2px;\n box-sizing: border-box;\n flex-shrink: 0;\n}\n\n.eds-statusbadge__pill {\n width: 16px;\n height: 16px;\n border-radius: 999px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 2px;\n box-sizing: border-box;\n overflow: hidden;\n}\n\n/* NotStarted — only type with a border + light gradient */\n.eds-statusbadge[data-type=\"NotStarted\"] .eds-statusbadge__pill {\n background: linear-gradient(to bottom, #FEFEFE 23.66%, #D8D8D8 98.58%);\n border: 1px solid var(--statusbadge-border-default);\n}\n\n/* Valid — teal stack, bottom → top */\n.eds-statusbadge[data-type=\"Valid\"] .eds-statusbadge__pill {\n background: linear-gradient(\n to top,\n #0A595C 11.79%,\n #028388 55.28%,\n #00AFB2 99.99%\n );\n}\n\n/* WarningsFlagged — orange */\n.eds-statusbadge[data-type=\"WarningsFlagged\"] .eds-statusbadge__pill {\n background: linear-gradient(to bottom, #FCA266 0%, #FA6400 100%);\n}\n\n/* ErrorsFlagged — orange → red → pink */\n.eds-statusbadge[data-type=\"ErrorsFlagged\"] .eds-statusbadge__pill {\n background: linear-gradient(\n to bottom,\n #FA6400 0%,\n #E02020 56.5%,\n #FF66AB 100%\n );\n}\n\n/* LockedSubmitted — purple → blue, holds the lock icon */\n.eds-statusbadge[data-type=\"LockedSubmitted\"] .eds-statusbadge__pill {\n background: linear-gradient(to bottom, #644AD4 23.07%, #2760DE 90.48%);\n}\n\n.eds-statusbadge__icon {\n width: 12px;\n height: 12px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: #FAFAFA;\n}\n.eds-statusbadge__icon svg { display: block; width: 100%; height: 100%; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-statusbadge-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-statusbadge-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-statusbadge-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-statusbadge-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-statusbadge-matrix__grid {\n display: grid;\n grid-template-columns: repeat(5, 1fr);\n gap: 16px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-statusbadge-matrix__cell {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n.eds-statusbadge-matrix__cell-label {\n font-family: Nunito, sans-serif;\n font-size: 11px;\n font-weight: 600;\n color: #5E5E5E;\n text-align: center;\n}\n.eds-statusbadge-matrix__list {\n display: flex;\n flex-direction: column;\n gap: 0;\n background: #FEFEFE;\n border: 1px solid #DDDDDD;\n border-radius: 8px;\n overflow: hidden;\n max-width: 360px;\n}\n.eds-statusbadge-matrix__row {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 10px 16px;\n border-bottom: 1px solid #EEEEEE;\n}\n.eds-statusbadge-matrix__row:last-child { border-bottom: none; }\n.eds-statusbadge-matrix__row-text {\n font-family: Nunito, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.4;\n color: #0E0E0E;\n flex: 1;\n}\n.eds-statusbadge-matrix__row-meta {\n font-family: Nunito, sans-serif;\n font-size: 12px;\n font-weight: 400;\n color: #5E5E5E;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-statusbadge]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-statusbadge\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Lock icon — exact Figma path from Icon/Utility/Lock (referenced via\n// 5189:12 inside the Status Badge). Native viewBox is 8.46 × 11; wrapped in\n// a 12-viewBox with the Figma inset offsets so the visible glyph matches the\n// source.\n// ---------------------------------------------------------------------------\nfunction LockIcon() {\n return (\n <svg viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(1.75 0.5)\">\n <path\n fill=\"currentColor\"\n d=\"M1.01975 11C0.738455 11 0.49815 10.9004 0.298835 10.7011C0.09961 10.5018 0 10.2616 0 9.98025V4.6864C0 4.40512 0.09961 4.16481 0.298835 3.9655C0.49815 3.76628 0.738455 3.66667 1.01975 3.66667H1.69231V2.53846C1.69231 1.83408 1.93929 1.23491 2.43326 0.74095C2.92722 0.246985 3.5264 0 4.23075 0C4.93515 0 5.5343 0.246985 6.0283 0.74095C6.52225 1.23491 6.76925 1.83408 6.76925 2.53846V3.66667H7.4418C7.7231 3.66667 7.9634 3.76628 8.1627 3.9655C8.36195 4.16481 8.46155 4.40512 8.46155 4.6864V9.98025C8.46155 10.2616 8.36195 10.5018 8.1627 10.7011C7.9634 10.9004 7.7231 11 7.4418 11H1.01975ZM1.01975 10.1538H7.4418C7.49245 10.1538 7.53405 10.1376 7.5666 10.1051C7.5991 10.0725 7.6154 10.0309 7.6154 9.98025V4.6864C7.6154 4.63575 7.5991 4.59415 7.5666 4.5616C7.53405 4.5291 7.49245 4.5128 7.4418 4.5128H1.01975C0.96908 4.5128 0.92748 4.5291 0.89495 4.5616C0.86242 4.59415 0.846155 4.63575 0.846155 4.6864V9.98025C0.846155 10.0309 0.86242 10.0725 0.89495 10.1051C0.92748 10.1376 0.96908 10.1538 1.01975 10.1538ZM4.23075 8.3205C4.50485 8.3205 4.7379 8.2245 4.92995 8.03255C5.12195 7.84045 5.21795 7.6074 5.21795 7.33335C5.21795 7.05925 5.12195 6.8262 4.92995 6.63415C4.7379 6.44215 4.50485 6.34615 4.23075 6.34615C3.9567 6.34615 3.72365 6.44215 3.53155 6.63415C3.3396 6.8262 3.24359 7.05925 3.24359 7.33335C3.24359 7.6074 3.3396 7.84045 3.53155 8.03255C3.72365 8.2245 3.9567 8.3205 4.23075 8.3205ZM2.53846 3.66667H5.9231V2.53846C5.9231 2.06838 5.75855 1.66881 5.4295 1.33975C5.10045 1.01069 4.70085 0.846155 4.23075 0.846155C3.7607 0.846155 3.3611 1.01069 3.03205 1.33975C2.70299 1.66881 2.53846 2.06838 2.53846 2.53846V3.66667ZM4.23075 7.33335Z\"\n />\n </g>\n </svg>\n );\n}\n\nconst HUMAN_LABEL: Record<StatusBadgeType, string> = {\n NotStarted: \"Not started\",\n Valid: \"Valid\",\n WarningsFlagged: \"Warnings flagged\",\n ErrorsFlagged: \"Errors flagged\",\n LockedSubmitted: \"Locked, submitted\",\n};\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const StatusBadge = React.forwardRef<HTMLSpanElement, StatusBadgeProps>(\n function StatusBadge(\n { type = \"NotStarted\", id, className, \"aria-label\": ariaLabel },\n ref\n ) {\n ensureStyles();\n\n const wrapperClass =\n \"eds-statusbadge\" + (className ? ` ${className}` : \"\");\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n role=\"img\"\n aria-label={ariaLabel ?? `Status: ${HUMAN_LABEL[type]}`}\n >\n <span className=\"eds-statusbadge__pill\">\n {type === \"LockedSubmitted\" && (\n <span className=\"eds-statusbadge__icon\" aria-hidden>\n <LockIcon />\n </span>\n )}\n </span>\n </span>\n );\n }\n);\n\nexport default StatusBadge;\n\n// ---------------------------------------------------------------------------\n// StatusBadgeMatrix — showcase\n// ---------------------------------------------------------------------------\nconst TYPES: StatusBadgeType[] = [\n \"NotStarted\",\n \"Valid\",\n \"WarningsFlagged\",\n \"ErrorsFlagged\",\n \"LockedSubmitted\",\n];\n\nexport function StatusBadgeMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-statusbadge-matrix\">\n <section className=\"eds-statusbadge-matrix__section\">\n <h3 className=\"eds-statusbadge-matrix__heading\">All five types</h3>\n <p className=\"eds-statusbadge-matrix__sub\">\n Each badge is a 16 px gradient pill inside a 20 × 20 padded frame.\n Only LockedSubmitted carries an icon (the lock). NotStarted is the\n only variant with a border — every other type has enough gradient\n contrast to read on a light surface without one.\n </p>\n <div className=\"eds-statusbadge-matrix__grid\">\n {TYPES.map((t) => (\n <div key={t} className=\"eds-statusbadge-matrix__cell\">\n <StatusBadge type={t} />\n <span className=\"eds-statusbadge-matrix__cell-label\">\n {HUMAN_LABEL[t]}\n </span>\n </div>\n ))}\n </div>\n </section>\n\n <section className=\"eds-statusbadge-matrix__section\">\n <h3 className=\"eds-statusbadge-matrix__heading\">In context · form list</h3>\n <p className=\"eds-statusbadge-matrix__sub\">\n Typical usage: paired with a form name in a navigation list, just\n like Clinical/FormStatusChip composes it.\n </p>\n <div className=\"eds-statusbadge-matrix__list\">\n <div className=\"eds-statusbadge-matrix__row\">\n <StatusBadge type=\"LockedSubmitted\" />\n <span className=\"eds-statusbadge-matrix__row-text\">\n Informed Consent\n </span>\n <span className=\"eds-statusbadge-matrix__row-meta\">Submitted Apr 12</span>\n </div>\n <div className=\"eds-statusbadge-matrix__row\">\n <StatusBadge type=\"Valid\" />\n <span className=\"eds-statusbadge-matrix__row-text\">Demographics</span>\n <span className=\"eds-statusbadge-matrix__row-meta\">Complete</span>\n </div>\n <div className=\"eds-statusbadge-matrix__row\">\n <StatusBadge type=\"WarningsFlagged\" />\n <span className=\"eds-statusbadge-matrix__row-text\">Vital Signs</span>\n <span className=\"eds-statusbadge-matrix__row-meta\">2 warnings</span>\n </div>\n <div className=\"eds-statusbadge-matrix__row\">\n <StatusBadge type=\"ErrorsFlagged\" />\n <span className=\"eds-statusbadge-matrix__row-text\">\n Laboratory Results\n </span>\n <span className=\"eds-statusbadge-matrix__row-meta\">1 error</span>\n </div>\n <div className=\"eds-statusbadge-matrix__row\">\n <StatusBadge type=\"NotStarted\" />\n <span className=\"eds-statusbadge-matrix__row-text\">\n Quality of Life\n </span>\n <span className=\"eds-statusbadge-matrix__row-meta\">Not started</span>\n </div>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * FormStatusChip — React port of Embleema Design System 2.0's Clinical/Form\n * Status Chip component (Figma node 4700:102).\n *\n * Pill-shaped status indicator for eCRF forms. Composes a StatusBadge with a\n * label and a sync indicator for the Saving state.\n *\n * Layout (per Figma):\n * pill (h 32, padding 4 vertical / 16 horizontal, gap 12, radius 999)\n * ├── status group (gap 8):\n * │ ├── StatusBadge (20 × 20 padded, 16 × 16 inner pill)\n * │ └── label (Nunito Regular 16/1.5, Text/Primary)\n * └── sync icon (optional, only when state=\"Saving\")\n *\n * Type → border color (1.5 px). The chip's body stays Background/Default;\n * type identity comes from the badge gradient + a matching border tint:\n * - NotStarted → Border/Default\n * - Valid → #0A595C (darkest teal in Valid badge)\n * - WarningsFlagged → #FCA266 (light orange in WarningsFlagged badge)\n * - ErrorsFlagged → #FA6400 (orange in ErrorsFlagged badge)\n * - LockedSubmitted → #644AD4 (purple in LockedSubmitted badge)\n *\n * Saving state: rotates the sync icon at 1.2 s per turn (linear infinite)\n * plus a subtle background pulse on the chip body. Both honor\n * `prefers-reduced-motion`.\n *\n * Props:\n * - type : NotStarted | Valid | WarningsFlagged | ErrorsFlagged | LockedSubmitted\n * - state : Default | Saving\n * - label : override the auto-generated label text\n */\n\nimport * as React from \"react\";\nimport { StatusBadge, type StatusBadgeType } from \"./StatusBadge\";\n\nexport type FormStatusChipType = StatusBadgeType;\nexport type FormStatusChipState = \"Default\" | \"Saving\";\n\n// Backwards-compat alias for the old name used by SiteCoordinatorDashboard.\nexport type FormStatusType = FormStatusChipType;\n\nexport type FormStatusChipProps = {\n type?: FormStatusChipType;\n state?: FormStatusChipState;\n label?: string;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL: Record<FormStatusChipType, string> = {\n NotStarted: \"Not Started\",\n Valid: \"Valid\",\n WarningsFlagged: \"Warnings Flagged\",\n ErrorsFlagged: \"Errors Flagged\",\n LockedSubmitted: \"Locked and Submitted\",\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600&display=swap\");\n\n:root {\n --fsc-bg-default: #FEFEFE;\n --fsc-text-primary: #0E0E0E;\n --fsc-text-secondary: #5E5E5E;\n --fsc-border-default: #DDDDDD;\n}\n\n.eds-fsc {\n display: inline-flex;\n align-items: center;\n gap: 12px;\n height: 32px;\n padding: 4px 16px;\n background: var(--fsc-bg-default);\n border: 1.5px solid var(--fsc-border-default);\n border-radius: 999px;\n box-sizing: border-box;\n font-family: Nunito, sans-serif;\n color: var(--fsc-text-primary);\n user-select: none;\n /* Hug content. Without this, the chip stretches when placed in a flex /\n grid parent that justifies items to \"stretch\" (the default for grid\n items). max-width keeps it responsive when the container is narrower\n than the content. */\n width: max-content;\n max-width: 100%;\n}\n\n/* Border tint per type — pulled from each badge's gradient stops. We pick\n the most semantically identifying stop so the border reads as the type\n color at a glance:\n - Valid : Teal/600 #0A595C (Figma's chosen stop — dark teal)\n - WarningsFlagged : Orange/500 #FA6400 (darker stop in the Warnings\n gradient; Figma's stop #FCA266 is too pale on\n white to read as a status indicator)\n - ErrorsFlagged : Red/500 #E02020 (middle stop of the Errors\n gradient; Figma's #FA6400 reads as orange, which\n doesn't carry \"error\" semantics in most contexts)\n - LockedSubmitted : Purple/500 #644AD4 (Figma's chosen stop) */\n.eds-fsc[data-type=\"Valid\"] { border-color: #0A595C; }\n.eds-fsc[data-type=\"WarningsFlagged\"] { border-color: #FA6400; }\n.eds-fsc[data-type=\"ErrorsFlagged\"] { border-color: #E02020; }\n.eds-fsc[data-type=\"LockedSubmitted\"] { border-color: #644AD4; }\n/* NotStarted intentionally keeps Border/Default */\n\n.eds-fsc__group {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.eds-fsc__label {\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5;\n color: var(--fsc-text-primary);\n white-space: nowrap;\n}\n\n/* ---------- Sync icon (Saving state) ----------\n Per Figma, the icon slot is 20 × 20 but the visible glyph inside is\n ~16.67 × 16.5 (left/right insets of 8.33% plus a 15.5/15.346 aspect ratio).\n We keep the slot at 20 px so the chip's overall geometry matches the\n source, and size the inner SVG to the glyph's actual dimensions. */\n.eds-fsc__sync {\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--fsc-text-secondary);\n animation: eds-fsc-spin 1200ms linear infinite;\n}\n.eds-fsc__sync svg {\n display: block;\n width: 16.6667px;\n height: 16.5011px;\n}\n\n@keyframes eds-fsc-spin {\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n}\n\n/* Subtle background pulse on the chip during Saving so the indicator is\n noticeable at a glance. Stays under a 4% luminance drop so it never\n overpowers the per-type identity. */\n.eds-fsc[data-state=\"Saving\"] {\n animation: eds-fsc-pulse 1800ms ease-in-out infinite;\n}\n@keyframes eds-fsc-pulse {\n 0%, 100% { background: var(--fsc-bg-default); }\n 50% { background: #F4F4F4; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .eds-fsc__sync { animation-duration: 3s; }\n .eds-fsc[data-state=\"Saving\"] { animation: none; }\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-fsc-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-fsc-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-fsc-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-fsc-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-fsc-matrix__grid {\n display: grid;\n grid-template-columns: 140px repeat(2, minmax(220px, 1fr));\n gap: 12px 16px;\n align-items: center;\n}\n.eds-fsc-matrix__grid-head {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-fsc-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #5E5E5E;\n}\n.eds-fsc-matrix__controls {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-fsc-matrix__toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #0E0E0E;\n}\n.eds-fsc-matrix__toggle input { accent-color: #306AE8; }\n.eds-fsc-matrix__counter {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: 13px;\n color: #0E0E0E;\n}\n.eds-fsc-matrix__counter input {\n width: 48px;\n height: 28px;\n padding: 2px 8px;\n border: 1px solid #DDDDDD;\n border-radius: 4px;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n}\n.eds-fsc-matrix__pill-row {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n align-items: center;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-formstatuschip]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-formstatuschip\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Sync icon — exact path from Icon/Action/Sync (referenced via 5262:9941 in\n// the FormStatusChip). Native viewBox is 16.6667 × 16.5011. The CSS\n// animation rotates the wrapper, so the SVG keeps its natural geometry.\n// ---------------------------------------------------------------------------\nfunction SyncGlyph() {\n return (\n <svg\n viewBox=\"0 0 16.6667 16.5011\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <path\n fill=\"currentColor\"\n d=\"M0.0827957 16.5011V14.8882H3.22581L2.44409 14.1398C1.56057 13.3222 0.932348 12.4072 0.559409 11.3946C0.186469 10.3821 0 9.35887 0 8.325C0 6.46676 0.544175 4.80045 1.63253 3.32608C2.72088 1.8517 4.14803 0.839515 5.91398 0.289515V1.98925C4.61667 2.49642 3.57554 3.32733 2.79059 4.48199C2.00547 5.63647 1.6129 6.91747 1.6129 8.325C1.6129 9.16586 1.77213 9.98262 2.09059 10.7753C2.40905 11.5679 2.90466 12.3006 3.57742 12.9734L4.25968 13.6559V10.7113H5.87258V16.5011H0.0827957ZM10.7527 16.2116V14.5118C12.05 14.0047 13.0911 13.1737 13.8761 12.0191C14.6612 10.8646 15.0538 9.5836 15.0538 8.17608C15.0538 7.33522 14.8945 6.51846 14.5761 5.72581C14.2576 4.93315 13.762 4.20045 13.0892 3.52769L12.407 2.84516V5.78979H10.7941V0H16.5839V1.6129H13.4409L14.2226 2.36129C15.0731 3.21201 15.6931 4.13531 16.0825 5.13118C16.472 6.12724 16.6667 7.1422 16.6667 8.17608C16.6667 10.0343 16.1225 11.7006 15.0341 13.175C13.9458 14.6494 12.5186 15.6616 10.7527 16.2116Z\"\n />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const FormStatusChip = React.forwardRef<HTMLSpanElement, FormStatusChipProps>(\n function FormStatusChip(\n {\n type = \"NotStarted\",\n state = \"Default\",\n label,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const text = label ?? DEFAULT_LABEL[type];\n const wrapperClass = \"eds-fsc\" + (className ? ` ${className}` : \"\");\n const effectiveAria =\n ariaLabel ?? `${text}${state === \"Saving\" ? \", saving\" : \"\"}`;\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n data-state={state}\n role=\"status\"\n aria-label={effectiveAria}\n >\n <span className=\"eds-fsc__group\">\n <StatusBadge type={type} aria-label=\"\" />\n <span className=\"eds-fsc__label\">{text}</span>\n </span>\n {state === \"Saving\" && (\n <span className=\"eds-fsc__sync\" aria-hidden>\n <SyncGlyph />\n </span>\n )}\n </span>\n );\n }\n);\n\nexport default FormStatusChip;\n\n// ---------------------------------------------------------------------------\n// FormStatusChipMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst TYPES: FormStatusChipType[] = [\n \"NotStarted\",\n \"Valid\",\n \"WarningsFlagged\",\n \"ErrorsFlagged\",\n \"LockedSubmitted\",\n];\n\nexport function FormStatusChipMatrix() {\n ensureStyles();\n\n const [saving, setSaving] = React.useState(false);\n\n return (\n <div className=\"eds-fsc-matrix\">\n <section className=\"eds-fsc-matrix__section\">\n <h3 className=\"eds-fsc-matrix__heading\">Interactive · drive all five types</h3>\n <p className=\"eds-fsc-matrix__sub\">\n Toggle Saving to see the spinning sync icon and subtle background\n pulse across every type.\n </p>\n <div className=\"eds-fsc-matrix__controls\">\n <label className=\"eds-fsc-matrix__toggle\">\n <input\n type=\"checkbox\"\n checked={saving}\n onChange={(e) => setSaving(e.target.checked)}\n />\n Saving state\n </label>\n </div>\n <div className=\"eds-fsc-matrix__pill-row\">\n {TYPES.map((t) => (\n <FormStatusChip\n key={t}\n type={t}\n state={saving ? \"Saving\" : \"Default\"}\n />\n ))}\n </div>\n </section>\n\n <section className=\"eds-fsc-matrix__section\">\n <h3 className=\"eds-fsc-matrix__heading\">Type × State (static)</h3>\n <p className=\"eds-fsc-matrix__sub\">\n Full matrix for QA. Saving state animates continuously; Default is\n static.\n </p>\n <div className=\"eds-fsc-matrix__grid\">\n <span className=\"eds-fsc-matrix__grid-head\">Type</span>\n <span className=\"eds-fsc-matrix__grid-head\">Default</span>\n <span className=\"eds-fsc-matrix__grid-head\">Saving</span>\n {TYPES.map((t) => (\n <React.Fragment key={t}>\n <span className=\"eds-fsc-matrix__row-label\">{DEFAULT_LABEL[t]}</span>\n <FormStatusChip type={t} state=\"Default\" />\n <FormStatusChip type={t} state=\"Saving\" />\n </React.Fragment>\n ))}\n </div>\n </section>\n\n <section className=\"eds-fsc-matrix__section\">\n <h3 className=\"eds-fsc-matrix__heading\">Custom label</h3>\n <p className=\"eds-fsc-matrix__sub\">\n Override the per-type label when the form name is more useful than\n the status word.\n </p>\n <div className=\"eds-fsc-matrix__pill-row\">\n <FormStatusChip type=\"Valid\" label=\"Demographics\" />\n <FormStatusChip type=\"WarningsFlagged\" label=\"Vital Signs\" />\n <FormStatusChip type=\"ErrorsFlagged\" label=\"Laboratory Results\" />\n <FormStatusChip type=\"LockedSubmitted\" label=\"Informed Consent\" />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Tooltip — React port of Embleema Design System 2.0's Feedback/Tooltip\n * component (Figma node 4944:48).\n *\n * Contextual overlay triggered by hover or focus on a UI element. Wraps any\n * child trigger and pops a styled card above (Top) or below (Bottom) it.\n *\n * Card structure (per Figma):\n * - Background/Primary (#F8F8F8) + 1 px Border/Default\n * - 8 px radius\n * - 12 px padding all sides, 4 px gap between rows\n * - drop-shadow: 0 0 3px rgba(0,0,0,0.12)\n * - Optional title: body/sm-semibold (Nunito SemiBold 14/1.5, Text/Primary)\n * - Body: body/sm-light (Nunito Light 14/1.5, Text/Secondary)\n * - Optional action: 14 px Nunito Regular, Action/Primary/Background\n *\n * Arrow: 12 × 6 px triangle pointing back at the trigger, fill matches the\n * card background, 1 px Border/Default stroke. Positioned so its inner edge\n * overlaps the card's border by 1 px (hides the stroke seam).\n *\n * Visibility:\n * - Driven by real :hover and :focus-within on the wrapper by default, so\n * keyboard users see the tooltip too.\n * - Pass `open` (with optional `onOpenChange`) for controlled visibility.\n * - Subtle 150 ms opacity transition.\n *\n * Props:\n * - position : Top | Bottom (default Top)\n * - title : show the title row (default true)\n * - titleText : title content (default \"Title\")\n * - bodyText : body content (default \"Tooltip description text\")\n * - actionButton : show the action button (default false)\n * - actionLabel : action label (default \"Button\")\n * - onActionClick : action callback\n * - arrow : show the directional arrow (default true)\n * - open : controlled visibility — disables the natural hover model\n * - defaultOpen : uncontrolled initial visibility (debugging / matrix use)\n * - children : the trigger element to wrap\n */\n\nimport * as React from \"react\";\n\nexport type TooltipPosition = \"Top\" | \"Bottom\";\n\nexport type TooltipProps = {\n position?: TooltipPosition;\n title?: boolean;\n titleText?: string;\n bodyText?: string;\n actionButton?: boolean;\n actionLabel?: string;\n onActionClick?: () => void;\n arrow?: boolean;\n open?: boolean;\n defaultOpen?: boolean;\n children?: React.ReactNode;\n id?: string;\n className?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600&display=swap\");\n\n:root {\n --tt-bg-primary: #F8F8F8;\n --tt-border-default: #DDDDDD;\n --tt-text-primary: #0E0E0E;\n --tt-text-secondary: #5E5E5E;\n --tt-action-primary: #306AE8;\n}\n\n.eds-tt {\n position: relative;\n display: inline-block;\n font-family: Nunito, sans-serif;\n}\n\n/* Popup wrapper — vertically stacks the card + arrow with the card on top\n when position=Top, arrow on top when position=Bottom. align-items center\n keeps the arrow horizontally centered relative to the trigger. */\n.eds-tt__pop {\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n width: 250px;\n max-width: calc(100vw - 16px);\n display: flex;\n flex-direction: column;\n align-items: center;\n z-index: 50;\n pointer-events: none;\n opacity: 0;\n visibility: hidden;\n transition: opacity 150ms ease-out, visibility 0s linear 150ms;\n}\n\n.eds-tt[data-position=\"Top\"] .eds-tt__pop { bottom: 100%; padding-bottom: 0; }\n.eds-tt[data-position=\"Bottom\"] .eds-tt__pop { top: 100%; padding-top: 0; }\n\n/* Show on hover/focus when not controlled, or when forced open via prop */\n.eds-tt:not([data-open=\"false\"]):hover .eds-tt__pop,\n.eds-tt:not([data-open=\"false\"]):focus-within .eds-tt__pop,\n.eds-tt[data-open=\"true\"] .eds-tt__pop {\n opacity: 1;\n visibility: visible;\n transition: opacity 150ms ease-out, visibility 0s linear 0s;\n pointer-events: auto;\n}\n\n/* ---------- Card ---------- */\n.eds-tt__card {\n width: 100%;\n background: var(--tt-bg-primary);\n border: 1px solid var(--tt-border-default);\n border-radius: 8px;\n padding: 12px;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 4px;\n box-shadow: 0 0 3px rgba(0, 0, 0, 0.12);\n box-sizing: border-box;\n}\n\n.eds-tt__title {\n margin: 0;\n width: 100%;\n font-size: 14px;\n font-weight: 600;\n line-height: 1.5;\n color: var(--tt-text-primary);\n word-break: break-word;\n}\n.eds-tt__body {\n margin: 0;\n width: 100%;\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: var(--tt-text-secondary);\n word-break: break-word;\n}\n\n/* Action button — text-link style: no fill, no border, no padding chrome.\n Reads as an inline link in the action color with an underline on hover. */\n.eds-tt__action {\n align-self: flex-start;\n margin-top: 4px;\n border: 0;\n background: transparent;\n padding: 0;\n color: var(--tt-action-primary);\n font-family: Nunito, sans-serif;\n font-size: 14px;\n font-weight: 600;\n line-height: 1.5;\n cursor: pointer;\n white-space: nowrap;\n text-decoration: none;\n border-radius: 2px;\n transition: text-decoration-color 120ms ease-out;\n}\n.eds-tt__action:hover {\n text-decoration: underline;\n text-underline-offset: 3px;\n}\n.eds-tt__action:focus-visible {\n outline: 2px solid var(--tt-action-primary);\n outline-offset: 2px;\n}\n\n/* ---------- Arrow ----------\n 12×6 triangle that overlaps the card's border by 1 px so the stroke seam\n between card and arrow disappears. The SVG draws the two slanted sides\n with stroke; the flat side overlaps the card. */\n.eds-tt__arrow {\n width: 12px;\n height: 6px;\n flex-shrink: 0;\n display: block;\n}\n.eds-tt__arrow svg { display: block; width: 100%; height: 100%; overflow: visible; }\n.eds-tt[data-position=\"Top\"] .eds-tt__arrow { margin-top: -1px; }\n.eds-tt[data-position=\"Bottom\"] .eds-tt__arrow { margin-bottom: -1px; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-tt-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-tt-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-tt-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-tt-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n/* Each tooltip variant gets its own card with enough vertical room for the\n popup to appear without overlapping the next card. 160 px clears the\n tallest tooltip (title + body + action) at the 250 px popup width. */\n.eds-tt-matrix__card {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 8px;\n padding: 24px 24px;\n background: #F8F8F8;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n min-height: 80px;\n}\n.eds-tt-matrix__card--top { padding-top: 160px; }\n.eds-tt-matrix__card--bottom { padding-bottom: 160px; }\n.eds-tt-matrix__cards {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n gap: 16px;\n}\n.eds-tt-matrix__card-caption {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-tt-matrix__trigger {\n padding: 8px 14px;\n background: #306AE8;\n color: #FEFEFE;\n border: 0;\n border-radius: 6px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 14px;\n font-weight: 500;\n}\n.eds-tt-matrix__trigger:hover { filter: brightness(0.95); }\n.eds-tt-matrix__helpicon {\n width: 18px;\n height: 18px;\n border-radius: 999px;\n background: #5E5E5E;\n color: #FEFEFE;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 12px;\n font-weight: 600;\n cursor: help;\n border: 0;\n font-family: Nunito, sans-serif;\n}\n.eds-tt-matrix__hint {\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n font-style: italic;\n}\n.eds-tt-matrix__toggles {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n padding: 12px;\n background: #FEFEFE;\n border: 1px solid #DDDDDD;\n border-radius: 6px;\n font-size: 13px;\n}\n.eds-tt-matrix__toggles label {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n}\n.eds-tt-matrix__toggles input { accent-color: #306AE8; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-tooltip]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-tooltip\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Arrow glyph — drawn inline as SVG so it can pick up the same fill +\n// stroke as the card via CSS variables. `vector-effect: non-scaling-stroke`\n// keeps the 1 px stroke crisp regardless of element size.\n//\n// Top: flat edge on top (joins the card's bottom border), apex at bottom.\n// Bottom: flat edge on bottom (joins the card's top border), apex at top.\n// ---------------------------------------------------------------------------\nfunction ArrowDown() {\n return (\n <svg viewBox=\"0 0 12 6\" preserveAspectRatio=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n {/* Fill triangle */}\n <path d=\"M0 0 L12 0 L6 6 Z\" fill=\"var(--tt-bg-primary)\" />\n {/* Two slanted strokes only — leaves the flat edge unstroked so it\n blends into the card border above. */}\n <path d=\"M0 0 L6 6 L12 0\" fill=\"none\" stroke=\"var(--tt-border-default)\" strokeWidth=\"1\" vectorEffect=\"non-scaling-stroke\" />\n </svg>\n );\n}\n\nfunction ArrowUp() {\n return (\n <svg viewBox=\"0 0 12 6\" preserveAspectRatio=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M0 6 L12 6 L6 0 Z\" fill=\"var(--tt-bg-primary)\" />\n <path d=\"M0 6 L6 0 L12 6\" fill=\"none\" stroke=\"var(--tt-border-default)\" strokeWidth=\"1\" vectorEffect=\"non-scaling-stroke\" />\n </svg>\n );\n}\n\nlet idCounter = 0;\nfunction useTooltipId(provided?: string) {\n const [id] = React.useState(() => provided ?? `eds-tt-${++idCounter}`);\n return id;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Tooltip = React.forwardRef<HTMLSpanElement, TooltipProps>(\n function Tooltip(\n {\n position = \"Top\",\n title = true,\n titleText = \"Title\",\n bodyText = \"Tooltip description text\",\n actionButton = false,\n actionLabel = \"Button\",\n onActionClick,\n arrow = true,\n open,\n defaultOpen = false,\n children,\n id: providedId,\n className,\n },\n ref\n ) {\n ensureStyles();\n const id = useTooltipId(providedId);\n\n // When `open` is provided, take over visibility from :hover/:focus and let\n // the parent component drive it. defaultOpen seeds the initial state for\n // showcase use; with controlled mode that prop is ignored.\n const isControlled = open !== undefined;\n const dataOpen = isControlled\n ? open\n ? \"true\"\n : \"false\"\n : defaultOpen\n ? \"true\"\n : undefined;\n\n const wrapperClass = \"eds-tt\" + (className ? ` ${className}` : \"\");\n\n const cardEl = (\n <div className=\"eds-tt__card\" role=\"tooltip\" id={id}>\n {title && <p className=\"eds-tt__title\">{titleText}</p>}\n <p className=\"eds-tt__body\">{bodyText}</p>\n {actionButton && (\n <button\n type=\"button\"\n className=\"eds-tt__action\"\n onClick={onActionClick}\n >\n {actionLabel}\n </button>\n )}\n </div>\n );\n\n const arrowEl = arrow ? (\n <span className=\"eds-tt__arrow\">\n {position === \"Top\" ? <ArrowDown /> : <ArrowUp />}\n </span>\n ) : null;\n\n return (\n <span\n ref={ref}\n className={wrapperClass}\n data-position={position}\n data-open={dataOpen}\n aria-describedby={id}\n >\n {children}\n <span className=\"eds-tt__pop\">\n {position === \"Top\" ? (\n <>\n {cardEl}\n {arrowEl}\n </>\n ) : (\n <>\n {arrowEl}\n {cardEl}\n </>\n )}\n </span>\n </span>\n );\n }\n);\n\nexport default Tooltip;\n\n// ---------------------------------------------------------------------------\n// TooltipMatrix — interactive showcase\n// ---------------------------------------------------------------------------\n// Each variant gets a dedicated card so the popups never overlap. Tooltips\n// are visible only on hover/focus — no forced-open states — which matches\n// real-world behavior and keeps the page from being cluttered with floating\n// cards.\ntype VariantConfig = {\n caption: string;\n position: TooltipPosition;\n title?: boolean;\n arrow?: boolean;\n actionButton?: boolean;\n actionLabel?: string;\n titleText?: string;\n bodyText?: string;\n triggerLabel: string;\n};\n\nconst VARIANTS_TOP: VariantConfig[] = [\n {\n caption: \"Top · full\",\n position: \"Top\",\n title: true,\n arrow: true,\n titleText: \"Form types\",\n bodyText: \"Choose the kind of form you want to load for this participant.\",\n triggerLabel: \"Hover me\",\n },\n {\n caption: \"Top · body only\",\n position: \"Top\",\n title: false,\n arrow: true,\n bodyText: \"Body-only tooltip — no title row when the description stands on its own.\",\n triggerLabel: \"Hover me\",\n },\n {\n caption: \"Top · no arrow\",\n position: \"Top\",\n title: true,\n arrow: false,\n titleText: \"Floating tip\",\n bodyText: \"Drops the directional arrow when there's no specific anchor to point at.\",\n triggerLabel: \"Hover me\",\n },\n {\n caption: \"Top · with action\",\n position: \"Top\",\n title: true,\n arrow: true,\n actionButton: true,\n actionLabel: \"Learn more\",\n titleText: \"What is an eCRF?\",\n bodyText: \"Electronic Case Report Form — a digital version of the paper CRF used to capture study data.\",\n triggerLabel: \"Hover me\",\n },\n];\n\nconst VARIANTS_BOTTOM: VariantConfig[] = [\n {\n caption: \"Bottom · full\",\n position: \"Bottom\",\n title: true,\n arrow: true,\n titleText: \"Auto-save\",\n bodyText: \"Your changes are saved automatically every 30 seconds. Press ⌘S to save manually.\",\n triggerLabel: \"Hover me\",\n },\n {\n caption: \"Bottom · body only\",\n position: \"Bottom\",\n title: false,\n arrow: true,\n bodyText: \"Required field — date of birth is needed for eligibility checks.\",\n triggerLabel: \"Hover me\",\n },\n {\n caption: \"Bottom · with action\",\n position: \"Bottom\",\n title: true,\n arrow: true,\n actionButton: true,\n actionLabel: \"Open guide\",\n titleText: \"Need help?\",\n bodyText: \"Read the full study coordinator guide for this section. Action below is a text link.\",\n triggerLabel: \"Hover me\",\n },\n];\n\nfunction VariantCard({\n caption,\n position,\n title,\n arrow,\n actionButton,\n actionLabel,\n titleText,\n bodyText,\n triggerLabel,\n}: VariantConfig) {\n const isBottom = position === \"Bottom\";\n const className =\n \"eds-tt-matrix__card \" +\n (isBottom ? \"eds-tt-matrix__card--bottom\" : \"eds-tt-matrix__card--top\");\n return (\n <div className={className}>\n <Tooltip\n position={position}\n title={title}\n arrow={arrow}\n actionButton={actionButton}\n actionLabel={actionLabel}\n titleText={titleText}\n bodyText={bodyText}\n >\n <button type=\"button\" className=\"eds-tt-matrix__trigger\">\n {triggerLabel}\n </button>\n </Tooltip>\n <p className=\"eds-tt-matrix__card-caption\">{caption}</p>\n </div>\n );\n}\n\nexport function TooltipMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-tt-matrix\">\n <section className=\"eds-tt-matrix__section\">\n <h3 className=\"eds-tt-matrix__heading\">Position · Top</h3>\n <p className=\"eds-tt-matrix__sub\">\n Hover (or keyboard-focus) any trigger to reveal its tooltip above.\n Each variant lives in its own card with 160 px of headroom so the\n popups never overlap.\n </p>\n <div className=\"eds-tt-matrix__cards\">\n {VARIANTS_TOP.map((v) => (\n <VariantCard key={v.caption} {...v} />\n ))}\n </div>\n </section>\n\n <section className=\"eds-tt-matrix__section\">\n <h3 className=\"eds-tt-matrix__heading\">Position · Bottom</h3>\n <p className=\"eds-tt-matrix__sub\">\n Same variants anchored below the trigger. Arrow flips to point up.\n </p>\n <div className=\"eds-tt-matrix__cards\">\n {VARIANTS_BOTTOM.map((v) => (\n <VariantCard key={v.caption} {...v} />\n ))}\n </div>\n </section>\n\n <section className=\"eds-tt-matrix__section\">\n <h3 className=\"eds-tt-matrix__heading\">In context · field helper icon</h3>\n <p className=\"eds-tt-matrix__sub\">\n Typical usage: a question-mark icon next to a form label. Hover the\n icon to reveal the description.\n </p>\n <div className=\"eds-tt-matrix__card eds-tt-matrix__card--top\">\n <div\n style={{\n display: \"inline-flex\",\n alignItems: \"center\",\n gap: 6,\n padding: \"12px 16px\",\n background: \"#FFFFFF\",\n border: \"1px solid #DDDDDD\",\n borderRadius: 8,\n fontSize: 14,\n fontWeight: 600,\n color: \"#0E0E0E\",\n }}\n >\n Date of birth\n <Tooltip\n position=\"Top\"\n title\n arrow\n titleText=\"Why we need this\"\n bodyText=\"Date of birth is used to verify eligibility and to age-adjust certain measurements.\"\n >\n <button\n type=\"button\"\n className=\"eds-tt-matrix__helpicon\"\n aria-label=\"Why is this required?\"\n >\n ?\n </button>\n </Tooltip>\n </div>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Label — React port of the Embleema Design System 2.0 Input/Label component\n * (Figma node 4220:977). Reusable form label that supports a required\n * asterisk and an info tooltip. Two sizes (Small for standard inputs, Large\n * for section headers).\n *\n * Layout in Figma (order = asterisk → info icon → label text, gap = Space/2 = 2px):\n * [* (required)] [ⓘ info icon (tooltip)] [Label text]\n *\n * Color bindings:\n * - Required asterisk: Feedback/Error/Text = #B31A1A\n * - Label text: Text/Primary = #0E0E0E\n * - Info icon: currentColor (inherits Text/Primary)\n *\n * Typography:\n * - Small: body/md, Nunito Regular 16px / 150%\n * - Large: Nunito Regular 20px / 120%\n *\n * Tooltip is rendered via the existing Tooltip component, so hover/focus,\n * positioning, and accessibility (aria-describedby) are handled there.\n */\n\nimport * as React from \"react\";\nimport { Tooltip } from \"./Tooltip\";\n\nexport type LabelSize = \"Small\" | \"Large\";\n\nexport type LabelProps = {\n size?: LabelSize;\n required?: boolean;\n tooltip?: boolean;\n /** Tooltip title shown when `tooltip` is true. */\n tooltipTitle?: string;\n /** Tooltip body shown when `tooltip` is true. */\n tooltipText?: string;\n /** htmlFor target — links the label to a form control by id. */\n htmlFor?: string;\n children?: React.ReactNode;\n className?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — injected once.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400&display=swap\");\n\n:root {\n --label-text-primary: #0E0E0E;\n --label-feedback-error-text: #B31A1A;\n --label-info-icon: #306AE8;\n}\n\n.eds-label {\n display: inline-flex;\n align-items: center;\n gap: 2px; /* Space/2 */\n font-family: Nunito, sans-serif;\n font-weight: 400;\n color: var(--label-text-primary);\n}\n\n.eds-label[data-size=\"Small\"] {\n font-size: 16px;\n line-height: 1.5;\n}\n.eds-label[data-size=\"Large\"] {\n font-size: 20px;\n line-height: 1.2;\n}\n\n.eds-label__required {\n color: var(--label-feedback-error-text);\n font-weight: 400;\n line-height: 1.5;\n user-select: none;\n}\n.eds-label[data-size=\"Small\"] .eds-label__required { font-size: 16px; }\n.eds-label[data-size=\"Large\"] .eds-label__required { font-size: 20px; line-height: 1.2; }\n\n.eds-label__info {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n line-height: 0;\n}\n/* The Tooltip primitive wraps its trigger in <span class=\"eds-tt\"> which\n defaults to display: inline-block. Inside the Label, force it to be a\n flex container so its child icon sits on the same vertical center as\n the label text. */\n.eds-label .eds-tt {\n display: inline-flex;\n align-items: center;\n line-height: 0;\n}\n\n.eds-label__icon {\n width: 16px;\n height: 16px;\n max-width: 16px;\n max-height: 16px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--label-info-icon);\n}\n.eds-label__icon svg {\n width: 16px;\n height: 16px;\n display: block;\n}\n\n.eds-label__text {\n display: inline-block;\n word-break: break-word;\n}\n\n/* LabelMatrix preview */\n.eds-label-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n background: #FEFEFE;\n padding: 32px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n}\n.eds-label-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-label-matrix__heading {\n font-size: 14px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-label-matrix__grid {\n display: grid;\n grid-template-columns: 140px repeat(2, minmax(220px, 1fr));\n column-gap: 32px;\n row-gap: 16px;\n align-items: center;\n}\n.eds-label-matrix__col-head {\n font-size: 11px;\n font-weight: 700;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: #848484;\n}\n.eds-label-matrix__row-head {\n font-size: 12px;\n font-weight: 600;\n color: #5E5E5E;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-label]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-label\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// Icon/Status/Info — outlined info glyph, 20×20, inherits currentColor.\n// Path geometry pulled from the Figma asset for the same component\n// (node I4220:990;4052:3159) and converted to a clean 20×20 viewBox.\nfunction InfoIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M10 14.5C10.2125 14.5 10.3906 14.4281 10.5344 14.2843C10.6781 14.1406 10.75 13.9625 10.75 13.75V9.75C10.75 9.5375 10.6781 9.35935 10.5344 9.2156C10.3906 9.07185 10.2125 9 10 9C9.7875 9 9.60938 9.07185 9.46563 9.2156C9.32188 9.35935 9.25 9.5375 9.25 9.75V13.75C9.25 13.9625 9.32188 14.1406 9.46563 14.2843C9.60938 14.4281 9.7875 14.5 10 14.5ZM10 7.5C10.2125 7.5 10.3906 7.42815 10.5344 7.2844C10.6781 7.14065 10.75 6.9625 10.75 6.75C10.75 6.5375 10.6781 6.35935 10.5344 6.2156C10.3906 6.07185 10.2125 6 10 6C9.7875 6 9.60938 6.07185 9.46563 6.2156C9.32188 6.35935 9.25 6.5375 9.25 6.75C9.25 6.9625 9.32188 7.14065 9.46563 7.2844C9.60938 7.42815 9.7875 7.5 10 7.5ZM10 19C8.75 19 7.575 18.7625 6.475 18.2875C5.375 17.8125 4.41875 17.1688 3.60625 16.3563C2.79375 15.5438 2.15 14.5875 1.675 13.4875C1.2 12.3875 0.962 11.2125 0.962 9.9625C0.962 8.7125 1.2 7.5375 1.675 6.4375C2.15 5.3375 2.79375 4.38125 3.60625 3.56875C4.41875 2.75625 5.375 2.1125 6.475 1.6375C7.575 1.1625 8.75 0.925 10 0.925C11.25 0.925 12.425 1.1625 13.525 1.6375C14.625 2.1125 15.5813 2.75625 16.3938 3.56875C17.2063 4.38125 17.85 5.3375 18.325 6.4375C18.8 7.5375 19.0375 8.7125 19.0375 9.9625C19.0375 11.2125 18.8 12.3875 18.325 13.4875C17.85 14.5875 17.2063 15.5438 16.3938 16.3563C15.5813 17.1688 14.625 17.8125 13.525 18.2875C12.425 18.7625 11.25 19 10 19ZM10 17.5C12.1 17.5 13.875 16.775 15.325 15.325C16.775 13.875 17.5 12.1 17.5 10C17.5 7.9 16.775 6.125 15.325 4.675C13.875 3.225 12.1 2.5 10 2.5C7.9 2.5 6.125 3.225 4.675 4.675C3.225 6.125 2.5 7.9 2.5 10C2.5 12.1 3.225 13.875 4.675 15.325C6.125 16.775 7.9 17.5 10 17.5Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Label = React.forwardRef<HTMLLabelElement, LabelProps>(\n function Label(\n {\n size = \"Small\",\n required = false,\n tooltip = false,\n tooltipTitle = \"Help\",\n tooltipText = \"Additional information about this field.\",\n htmlFor,\n children,\n className,\n },\n ref\n ) {\n ensureStyles();\n const cls = \"eds-label\" + (className ? ` ${className}` : \"\");\n\n const infoSlot = tooltip && (\n <span className=\"eds-label__info\">\n <Tooltip\n position=\"Top\"\n titleText={tooltipTitle}\n bodyText={tooltipText}\n arrow\n >\n <span className=\"eds-label__icon\" aria-label=\"More information\">\n <InfoIcon />\n </span>\n </Tooltip>\n </span>\n );\n\n return (\n <label ref={ref} className={cls} data-size={size} htmlFor={htmlFor}>\n {required && (\n <span className=\"eds-label__required\" aria-hidden>\n *\n </span>\n )}\n {infoSlot}\n <span className=\"eds-label__text\">{children ?? \"Label\"}</span>\n </label>\n );\n }\n);\n\nexport default Label;\n\n// ---------------------------------------------------------------------------\n// LabelMatrix — Size × {Required / Tooltip / Both / Neither} preview.\n// ---------------------------------------------------------------------------\nexport function LabelMatrix() {\n ensureStyles();\n const sizes: LabelSize[] = [\"Small\", \"Large\"];\n return (\n <div className=\"eds-label-matrix\">\n {sizes.map((size) => (\n <section key={size} className=\"eds-label-matrix__section\">\n <p className=\"eds-label-matrix__heading\">{size}</p>\n <div className=\"eds-label-matrix__grid\">\n <div />\n <div className=\"eds-label-matrix__col-head\">Optional</div>\n <div className=\"eds-label-matrix__col-head\">Required</div>\n\n <div className=\"eds-label-matrix__row-head\">No tooltip</div>\n <div><Label size={size}>Participant ID</Label></div>\n <div><Label size={size} required>Participant ID</Label></div>\n\n <div className=\"eds-label-matrix__row-head\">Tooltip</div>\n <div>\n <Label\n size={size}\n tooltip\n tooltipTitle=\"Participant ID\"\n tooltipText=\"Unique alphanumeric identifier assigned at enrollment. Hover for details.\"\n >\n Participant ID\n </Label>\n </div>\n <div>\n <Label\n size={size}\n required\n tooltip\n tooltipTitle=\"Participant ID\"\n tooltipText=\"Unique alphanumeric identifier assigned at enrollment. Required for submission.\"\n >\n Participant ID\n </Label>\n </div>\n </div>\n </section>\n ))}\n </div>\n );\n}\n","/**\n * Link — React port of the Embleema Design System 2.0 Action/Link component\n * (Figma node 4682:7). Size and the icon/disabled booleans are props;\n * Default / Hover / Pressed are wired to real browser :hover and :active\n * states. Disabled prevents interaction via aria-disabled + pointer-events.\n *\n * Color bindings from the Figma component:\n * - Default text: Action/Link/Default = Blue/400 (#306AE8)\n * - Hover / Pressed text: Action/Link/Hover = Blue/300 (#6994EE)\n * - Hover bg: Feedback/Information/Background = Blue/100 (#E3ECFF)\n * - Pressed bg: Feedback/AI/Background = AI/Tint (#C7D9FF)\n * - Disabled text: Text/Disabled = Neutral/500 (#848484)\n * - Disabled underline: Border/Default = Neutral/300 (#DDDDDD)\n *\n * Sizes:\n * - Medium: 16px Medium (button/md), 16×16 icon\n * - Small: 14px Medium (button/sm) with 0.01em letter-spacing, 14×14 icon\n */\n\nimport * as React from \"react\";\n\nexport type LinkSize = \"Medium\" | \"Small\";\n\nexport type LinkProps = {\n size?: LinkSize;\n disabled?: boolean;\n /** true → default arrow-back glyph. Pass a ReactNode to inject a custom icon. */\n leadingIcon?: boolean | React.ReactNode;\n /** true → default arrow-forward glyph. Pass a ReactNode to inject a custom icon. */\n trailingIcon?: boolean | React.ReactNode;\n href?: string;\n target?: string;\n rel?: string;\n onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;\n children?: React.ReactNode;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — injected once into <head>.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@500;600&display=swap\");\n\n:root {\n --link-default: #306AE8;\n --link-hover: #6994EE;\n --link-hover-bg: #E3ECFF;\n --link-pressed-bg: #C7D9FF;\n --link-disabled-text: #848484;\n --link-disabled-underline: #DDDDDD;\n --link-focus-ring: #A2BDF5;\n}\n\n.eds-link {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n padding: 2px 8px 4px;\n border-radius: 8px;\n background: transparent;\n color: var(--link-default);\n font-family: Nunito, sans-serif;\n font-weight: 500;\n line-height: 1.2;\n text-decoration: none;\n cursor: pointer;\n user-select: none;\n position: relative;\n transition: background 120ms ease-in-out, color 120ms ease-in-out;\n -webkit-tap-highlight-color: transparent;\n}\n.eds-link[data-size=\"Medium\"] {\n font-size: 16px;\n letter-spacing: 0;\n}\n.eds-link[data-size=\"Small\"] {\n font-size: 14px;\n letter-spacing: 0.01em;\n}\n\n/* Underline lives under the label so we can show/hide it per state. We use\n a pseudo-element on the label, not text-decoration, so the underline\n color animates with the link color. */\n.eds-link__label {\n position: relative;\n display: inline-block;\n}\n.eds-link__label::after {\n content: \"\";\n position: absolute;\n left: 0;\n right: 0;\n bottom: -1px;\n height: 1px;\n background: currentColor;\n opacity: 0;\n transition: opacity 120ms ease-in-out;\n}\n\n/* Interactive states — driven by real browser pseudo-classes so hover and\n pressed light up in the page. */\n.eds-link:hover:not([aria-disabled=\"true\"]) {\n background: var(--link-hover-bg);\n color: var(--link-hover);\n}\n.eds-link:hover:not([aria-disabled=\"true\"]) .eds-link__label::after {\n opacity: 1;\n}\n.eds-link:active:not([aria-disabled=\"true\"]) {\n background: var(--link-pressed-bg);\n color: var(--link-hover);\n}\n.eds-link:active:not([aria-disabled=\"true\"]) .eds-link__label::after {\n opacity: 1;\n}\n.eds-link:focus-visible {\n outline: 2px solid var(--link-focus-ring);\n outline-offset: 2px;\n}\n\n/* Disabled — opaque tone, persistent underline matching the Figma frame. */\n.eds-link[aria-disabled=\"true\"] {\n color: var(--link-disabled-text);\n cursor: not-allowed;\n pointer-events: none;\n}\n.eds-link[aria-disabled=\"true\"] .eds-link__label::after {\n background: var(--link-disabled-underline);\n opacity: 1;\n}\n\n/* Forced-state hooks used by the LinkMatrix preview so designers can see\n Hover and Pressed without having to mouse over each tile. */\n.eds-link[data-force=\"Hover\"]:not([aria-disabled=\"true\"]) {\n background: var(--link-hover-bg);\n color: var(--link-hover);\n}\n.eds-link[data-force=\"Hover\"]:not([aria-disabled=\"true\"]) .eds-link__label::after {\n opacity: 1;\n}\n.eds-link[data-force=\"Pressed\"]:not([aria-disabled=\"true\"]) {\n background: var(--link-pressed-bg);\n color: var(--link-hover);\n}\n.eds-link[data-force=\"Pressed\"]:not([aria-disabled=\"true\"]) .eds-link__label::after {\n opacity: 1;\n}\n\n/* Icon slots — size with the parent link size. */\n.eds-link__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n color: inherit;\n}\n.eds-link[data-size=\"Medium\"] .eds-link__icon {\n width: 16px;\n height: 16px;\n}\n.eds-link[data-size=\"Small\"] .eds-link__icon {\n width: 14px;\n height: 14px;\n}\n.eds-link__icon svg {\n width: 100%;\n height: 100%;\n display: block;\n}\n\n/* LinkMatrix preview */\n.eds-link-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n background: #FEFEFE;\n padding: 32px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n}\n.eds-link-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-link-matrix__heading {\n font-size: 14px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-link-matrix__grid {\n display: grid;\n grid-template-columns: 96px repeat(3, minmax(120px, 1fr));\n column-gap: 24px;\n row-gap: 16px;\n align-items: center;\n}\n.eds-link-matrix__col-head {\n font-size: 11px;\n font-weight: 700;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: #848484;\n}\n.eds-link-matrix__row-head {\n font-size: 12px;\n font-weight: 600;\n color: #5E5E5E;\n}\n.eds-link-matrix__cell { display: flex; align-items: center; }\n.eds-link-matrix__row {\n display: flex;\n gap: 16px;\n align-items: center;\n flex-wrap: wrap;\n}\n.eds-link-matrix__caption {\n font-size: 11px;\n font-weight: 600;\n color: #5E5E5E;\n min-width: 96px;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-link]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-link\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// Default icon glyphs — Material-style arrows so links without custom icons\n// still feel anchored. Both inherit color via currentColor.\nfunction ArrowBack() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M10 18L4 12L10 6L11.4 7.45L7.85 11H20V13H7.85L11.4 16.55L10 18Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nfunction ArrowForward() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M14 18L12.6 16.55L16.15 13H4V11H16.15L12.6 7.45L14 6L20 12L14 18Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n\nfunction renderIconSlot(value: boolean | React.ReactNode, fallback: React.ReactNode) {\n if (value === false || value === undefined || value === null) return null;\n if (value === true) {\n return <span className=\"eds-link__icon\" aria-hidden>{fallback}</span>;\n }\n return <span className=\"eds-link__icon\" aria-hidden>{value}</span>;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n function Link(\n {\n size = \"Medium\",\n disabled = false,\n leadingIcon = false,\n trailingIcon = false,\n href,\n target,\n rel,\n onClick,\n children,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const cls = \"eds-link\" + (className ? ` ${className}` : \"\");\n const handleClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n if (disabled) {\n e.preventDefault();\n return;\n }\n onClick?.(e);\n };\n return (\n <a\n ref={ref}\n className={cls}\n data-size={size}\n href={disabled ? undefined : href}\n target={target}\n rel={rel}\n aria-disabled={disabled || undefined}\n tabIndex={disabled ? -1 : 0}\n onClick={handleClick}\n aria-label={ariaLabel}\n >\n {renderIconSlot(leadingIcon, <ArrowBack />)}\n {children != null && <span className=\"eds-link__label\">{children}</span>}\n {renderIconSlot(trailingIcon, <ArrowForward />)}\n </a>\n );\n }\n);\n\nexport default Link;\n\n// ---------------------------------------------------------------------------\n// LinkMatrix — every Size × State combination, plus the Disabled toggle and\n// the leading/trailing icon variants. Includes a real interactive row so the\n// hover and pressed states can be exercised in the browser.\n// ---------------------------------------------------------------------------\ntype ForcedState = \"Default\" | \"Hover\" | \"Pressed\";\n\nfunction ForcedLink({\n size,\n state,\n disabled,\n leadingIcon,\n trailingIcon,\n label,\n}: {\n size: LinkSize;\n state: ForcedState;\n disabled?: boolean;\n leadingIcon?: boolean;\n trailingIcon?: boolean;\n label: string;\n}) {\n // Inline link with a forced state-class so designers can see Hover and\n // Pressed without mousing over. Still uses the real Link markup.\n ensureStyles();\n return (\n <a\n className=\"eds-link\"\n data-size={size}\n data-force={disabled ? undefined : state}\n href={disabled ? undefined : \"#\"}\n aria-disabled={disabled || undefined}\n tabIndex={disabled ? -1 : 0}\n onClick={(e) => e.preventDefault()}\n >\n {leadingIcon && (\n <span className=\"eds-link__icon\" aria-hidden>\n <ArrowBack />\n </span>\n )}\n <span className=\"eds-link__label\">{label}</span>\n {trailingIcon && (\n <span className=\"eds-link__icon\" aria-hidden>\n <ArrowForward />\n </span>\n )}\n </a>\n );\n}\n\nexport function LinkMatrix() {\n const sizes: LinkSize[] = [\"Medium\", \"Small\"];\n const states: ForcedState[] = [\"Default\", \"Hover\", \"Pressed\"];\n\n return (\n <div className=\"eds-link-matrix\">\n <section className=\"eds-link-matrix__section\">\n <p className=\"eds-link-matrix__heading\">Interactive (hover / press in browser)</p>\n <div className=\"eds-link-matrix__row\">\n <Link href=\"#\" onClick={(e) => e.preventDefault()}>View details</Link>\n <Link href=\"#\" leadingIcon onClick={(e) => e.preventDefault()}>\n Back to studies\n </Link>\n <Link href=\"#\" trailingIcon onClick={(e) => e.preventDefault()}>\n Continue\n </Link>\n <Link href=\"#\" size=\"Small\" onClick={(e) => e.preventDefault()}>\n Learn more\n </Link>\n <Link href=\"#\" size=\"Small\" leadingIcon trailingIcon onClick={(e) => e.preventDefault()}>\n Open\n </Link>\n <Link href=\"#\" disabled>Unavailable</Link>\n </div>\n </section>\n\n {sizes.map((size) => (\n <section key={size} className=\"eds-link-matrix__section\">\n <p className=\"eds-link-matrix__heading\">{size} · forced states</p>\n <div className=\"eds-link-matrix__grid\">\n <div />\n {states.map((s) => (\n <div key={s} className=\"eds-link-matrix__col-head\">{s}</div>\n ))}\n\n <div className=\"eds-link-matrix__row-head\">Label only</div>\n {states.map((s) => (\n <div key={s} className=\"eds-link-matrix__cell\">\n <ForcedLink size={size} state={s} label=\"View details\" />\n </div>\n ))}\n\n <div className=\"eds-link-matrix__row-head\">Leading icon</div>\n {states.map((s) => (\n <div key={s} className=\"eds-link-matrix__cell\">\n <ForcedLink size={size} state={s} leadingIcon label=\"Back\" />\n </div>\n ))}\n\n <div className=\"eds-link-matrix__row-head\">Trailing icon</div>\n {states.map((s) => (\n <div key={s} className=\"eds-link-matrix__cell\">\n <ForcedLink size={size} state={s} trailingIcon label=\"Continue\" />\n </div>\n ))}\n\n <div className=\"eds-link-matrix__row-head\">Both icons</div>\n {states.map((s) => (\n <div key={s} className=\"eds-link-matrix__cell\">\n <ForcedLink size={size} state={s} leadingIcon trailingIcon label=\"Open\" />\n </div>\n ))}\n </div>\n </section>\n ))}\n\n <section className=\"eds-link-matrix__section\">\n <p className=\"eds-link-matrix__heading\">Disabled</p>\n <div className=\"eds-link-matrix__row\">\n <ForcedLink size=\"Medium\" state=\"Default\" disabled label=\"Disabled\" />\n <ForcedLink size=\"Medium\" state=\"Default\" disabled leadingIcon label=\"Disabled\" />\n <ForcedLink size=\"Medium\" state=\"Default\" disabled trailingIcon label=\"Disabled\" />\n <ForcedLink size=\"Small\" state=\"Default\" disabled label=\"Disabled\" />\n <ForcedLink size=\"Small\" state=\"Default\" disabled leadingIcon trailingIcon label=\"Disabled\" />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Spinner — React port of Embleema Design System 2.0's Feedback/SpinnerIcon\n * component (Figma node 4885:25).\n *\n * Animated loading glyph. Used standalone, inside buttons / fields, or wrapped\n * by Feedback/Loading.\n *\n * Sizes:\n * - Small → 16 px\n * - Medium → 20 px\n * - Large → 32 px\n *\n * Styles:\n * - Default → solid dots in Blue/400 (#306AE8)\n * - AI → solid dots in AI/Base (#6F59CF)\n *\n * Visual treatment: a ring of 12 dots placed evenly around a circle. Each\n * dot's opacity fades from 1.0 at the \"head\" down to ~0.15 at the tail, so\n * when the wrapping <g> rotates clockwise the user sees a bright leading dot\n * with a fading trail behind it. Animation is a 1.4 s linear infinite spin.\n */\n\nimport * as React from \"react\";\n\nexport type SpinnerSize = \"Small\" | \"Medium\" | \"Large\";\nexport type SpinnerStyle = \"Default\" | \"AI\";\n\nexport type SpinnerProps = {\n size?: SpinnerSize;\n style?: SpinnerStyle;\n className?: string;\n id?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Geometry — 12 dots, evenly spaced around a circle inside a 24×24 viewBox.\n// The dot at index 0 sits at the top and is the brightest; subsequent dots\n// step clockwise and fade out, so rotation reveals a head-and-trail pattern.\n// ---------------------------------------------------------------------------\nconst DOT_COUNT = 12;\nconst VIEW_BOX_SIZE = 24;\nconst CENTER = VIEW_BOX_SIZE / 2;\nconst RING_RADIUS = 9;\nconst DOT_RADIUS = 1.8;\nconst MIN_OPACITY = 0.15;\n\nconst DOTS = Array.from({ length: DOT_COUNT }, (_, i) => {\n // -90deg shifts the start to the top of the circle. Positive angle steps\n // walk clockwise (in SVG coordinates where +y points down).\n const angleDeg = (360 * i) / DOT_COUNT - 90;\n const angleRad = (angleDeg * Math.PI) / 180;\n const cx = CENTER + RING_RADIUS * Math.cos(angleRad);\n const cy = CENTER + RING_RADIUS * Math.sin(angleRad);\n const opacity = 1 - (i / DOT_COUNT) * (1 - MIN_OPACITY);\n return { cx, cy, opacity };\n});\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n:root {\n --spinner-default: #306AE8;\n --spinner-ai: #6F59CF;\n}\n\n.eds-spinner {\n display: inline-block;\n flex-shrink: 0;\n color: var(--spinner-default);\n line-height: 0;\n}\n.eds-spinner[data-style=\"AI\"] { color: var(--spinner-ai); }\n\n.eds-spinner svg { display: block; width: 100%; height: 100%; }\n.eds-spinner__ring {\n transform-origin: ${CENTER}px ${CENTER}px;\n animation: eds-spinner-rotate 1400ms linear infinite;\n}\n\n.eds-spinner[data-size=\"Small\"] { width: 16px; height: 16px; }\n.eds-spinner[data-size=\"Medium\"] { width: 20px; height: 20px; }\n.eds-spinner[data-size=\"Large\"] { width: 32px; height: 32px; }\n\n@keyframes eds-spinner-rotate {\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n}\n\n/* Slow the spin way down when the user prefers reduced motion. */\n@media (prefers-reduced-motion: reduce) {\n .eds-spinner__ring { animation-duration: 3s; }\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-spinner-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-spinner-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-spinner-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-spinner-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-spinner-matrix__grid {\n display: grid;\n grid-template-columns: 100px repeat(3, minmax(120px, 1fr));\n gap: 0;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n overflow: hidden;\n align-items: stretch;\n}\n.eds-spinner-matrix__cell {\n border-right: 1px solid #EEEEEE;\n border-bottom: 1px solid #EEEEEE;\n background: #FEFEFE;\n min-height: 80px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.eds-spinner-matrix__cell:last-child { border-right: none; }\n.eds-spinner-matrix__cell--head {\n background: #F8F8F8;\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-spinner]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-spinner\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Spinner = React.forwardRef<HTMLSpanElement, SpinnerProps>(\n function Spinner(\n { size = \"Small\", style = \"Default\", className, id, \"aria-label\": ariaLabel },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-spinner\" + (className ? ` ${className}` : \"\");\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-size={size}\n data-style={style}\n role=\"status\"\n aria-label={ariaLabel ?? \"Loading\"}\n >\n <svg\n viewBox={`0 0 ${VIEW_BOX_SIZE} ${VIEW_BOX_SIZE}`}\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden\n >\n <g className=\"eds-spinner__ring\">\n {DOTS.map((d, i) => (\n <circle\n key={i}\n cx={d.cx}\n cy={d.cy}\n r={DOT_RADIUS}\n fill=\"currentColor\"\n opacity={d.opacity}\n />\n ))}\n </g>\n </svg>\n </span>\n );\n }\n);\n\nexport default Spinner;\n\n// ---------------------------------------------------------------------------\n// SpinnerMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst SIZES: SpinnerSize[] = [\"Small\", \"Medium\", \"Large\"];\nconst STYLES: SpinnerStyle[] = [\"Default\", \"AI\"];\n\nexport function SpinnerMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-spinner-matrix\">\n <section className=\"eds-spinner-matrix__section\">\n <h3 className=\"eds-spinner-matrix__heading\">Size × Style</h3>\n <p className=\"eds-spinner-matrix__sub\">\n A ring of 12 dots that fades from full opacity at the head down to{\" \"}\n {MIN_OPACITY * 100}% at the tail. Default uses Blue/400 (#306AE8);\n AI uses AI/Base (#6F59CF). Rotation is 1.4 s linear infinite, slowed\n to 3 s when <code>prefers-reduced-motion</code> is set.\n </p>\n <div className=\"eds-spinner-matrix__grid\">\n <div className=\"eds-spinner-matrix__cell eds-spinner-matrix__cell--head\">\n Style\n </div>\n {SIZES.map((s) => (\n <div\n key={s}\n className=\"eds-spinner-matrix__cell eds-spinner-matrix__cell--head\"\n >\n {s}\n </div>\n ))}\n {STYLES.map((st) => (\n <React.Fragment key={st}>\n <div className=\"eds-spinner-matrix__cell eds-spinner-matrix__cell--head\">\n {st}\n </div>\n {SIZES.map((s) => (\n <div key={`${st}-${s}`} className=\"eds-spinner-matrix__cell\">\n <Spinner size={s} style={st} />\n </div>\n ))}\n </React.Fragment>\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Loading — React port of Embleema Design System 2.0's Feedback/Loading\n * component (Figma node 4887:67).\n *\n * Composes Feedback/SpinnerIcon with an optional text label. Used as a\n * standalone loading indicator for content regions, page-level loads, or any\n * surface where the spinner alone isn't expressive enough.\n *\n * Sizes (spinner + label scale together):\n * - Small → 16 px spinner, 14 px label (body/sm)\n * - Medium → 20 px spinner, 16 px label (body/md)\n * - Large → 32 px spinner, 18 px label (body/lg)\n *\n * Style:\n * - Default → solid stroke (Action/Primary/Background) + Text/Primary label\n * - AI → gradient stroke (#90B3FF → #6F59CF) + Text/Primary label\n *\n * Layout:\n * - Horizontal → spinner and label side by side, gap 8\n * - Vertical → spinner above label, items centered, gap 8\n *\n * Props:\n * - size : Small | Medium | Large\n * - style : Default | AI\n * - layout : Horizontal | Vertical\n * - label : show the label (default true)\n * - labelText : label string (default \"Loading...\")\n */\n\nimport * as React from \"react\";\nimport { Spinner, type SpinnerSize, type SpinnerStyle } from \"./Spinner\";\n\nexport type LoadingSize = SpinnerSize;\nexport type LoadingStyle = SpinnerStyle;\nexport type LoadingLayout = \"Horizontal\" | \"Vertical\";\n\nexport type LoadingProps = {\n size?: LoadingSize;\n style?: LoadingStyle;\n layout?: LoadingLayout;\n label?: boolean;\n labelText?: string;\n className?: string;\n id?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400&display=swap\");\n\n:root {\n --loading-text-primary: #0E0E0E;\n}\n\n.eds-loading {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n line-height: 1.5;\n color: var(--loading-text-primary);\n}\n.eds-loading[data-layout=\"Vertical\"] {\n flex-direction: column;\n text-align: center;\n}\n\n/* Label sizing follows body/sm, body/md, body/lg per the Figma source */\n.eds-loading[data-size=\"Small\"] .eds-loading__label { font-size: 14px; }\n.eds-loading[data-size=\"Medium\"] .eds-loading__label { font-size: 16px; }\n.eds-loading[data-size=\"Large\"] .eds-loading__label { font-size: 18px; }\n\n.eds-loading__label {\n white-space: nowrap;\n word-break: break-word;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-loading-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-loading-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-loading-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-loading-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-loading-matrix__row {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: 32px;\n padding: 8px 0;\n}\n.eds-loading-matrix__row-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n width: 100px;\n flex-shrink: 0;\n padding-top: 6px;\n}\n.eds-loading-matrix__grid {\n display: grid;\n grid-template-columns: 100px repeat(3, minmax(160px, 1fr));\n gap: 0;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n overflow: hidden;\n align-items: stretch;\n}\n.eds-loading-matrix__cell {\n border-right: 1px solid #EEEEEE;\n border-bottom: 1px solid #EEEEEE;\n background: #FEFEFE;\n min-height: 96px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n}\n.eds-loading-matrix__cell:last-child { border-right: none; }\n.eds-loading-matrix__cell--head {\n background: #F8F8F8;\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-loading]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-loading\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Loading = React.forwardRef<HTMLSpanElement, LoadingProps>(\n function Loading(\n {\n size = \"Small\",\n style = \"Default\",\n layout = \"Horizontal\",\n label = true,\n labelText = \"Loading...\",\n className,\n id,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const wrapperClass = \"eds-loading\" + (className ? ` ${className}` : \"\");\n const effectiveAria =\n ariaLabel ?? (label ? labelText : \"Loading\");\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-size={size}\n data-style={style}\n data-layout={layout}\n role=\"status\"\n aria-live=\"polite\"\n aria-label={effectiveAria}\n >\n <Spinner size={size} style={style} aria-label=\"\" />\n {label && <span className=\"eds-loading__label\">{labelText}</span>}\n </span>\n );\n }\n);\n\nexport default Loading;\n\n// ---------------------------------------------------------------------------\n// LoadingMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst SIZES: LoadingSize[] = [\"Small\", \"Medium\", \"Large\"];\nconst STYLES: LoadingStyle[] = [\"Default\", \"AI\"];\nconst LAYOUTS: LoadingLayout[] = [\"Horizontal\", \"Vertical\"];\n\nexport function LoadingMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-loading-matrix\">\n <section className=\"eds-loading-matrix__section\">\n <h3 className=\"eds-loading-matrix__heading\">Size × Style</h3>\n <p className=\"eds-loading-matrix__sub\">\n Horizontal layout, label visible. Labels scale by size: body/sm,\n body/md, body/lg.\n </p>\n <div className=\"eds-loading-matrix__grid\">\n <div className=\"eds-loading-matrix__cell eds-loading-matrix__cell--head\">\n Style\n </div>\n {SIZES.map((s) => (\n <div\n key={s}\n className=\"eds-loading-matrix__cell eds-loading-matrix__cell--head\"\n >\n {s}\n </div>\n ))}\n {STYLES.map((st) => (\n <React.Fragment key={st}>\n <div className=\"eds-loading-matrix__cell eds-loading-matrix__cell--head\">\n {st}\n </div>\n {SIZES.map((s) => (\n <div key={`${st}-${s}`} className=\"eds-loading-matrix__cell\">\n <Loading size={s} style={st} layout=\"Horizontal\" />\n </div>\n ))}\n </React.Fragment>\n ))}\n </div>\n </section>\n\n <section className=\"eds-loading-matrix__section\">\n <h3 className=\"eds-loading-matrix__heading\">Layout · Vertical</h3>\n <p className=\"eds-loading-matrix__sub\">\n Spinner stacked above the label, both centered. Useful for full-pane\n or modal-content loading states.\n </p>\n <div className=\"eds-loading-matrix__row\">\n {SIZES.map((s) => (\n <div key={s} className=\"eds-loading-matrix__row\">\n <span className=\"eds-loading-matrix__row-label\">{s}</span>\n <Loading size={s} style=\"Default\" layout=\"Vertical\" />\n <Loading size={s} style=\"AI\" layout=\"Vertical\" />\n </div>\n ))}\n </div>\n </section>\n\n <section className=\"eds-loading-matrix__section\">\n <h3 className=\"eds-loading-matrix__heading\">Label · boolean</h3>\n <p className=\"eds-loading-matrix__sub\">\n When <code>label=false</code> the component renders just the\n spinner. Equivalent to using <code>Spinner</code> directly.\n </p>\n <div className=\"eds-loading-matrix__row\">\n {LAYOUTS.map((l) => (\n <React.Fragment key={l}>\n <Loading layout={l} size=\"Medium\" label />\n <Loading layout={l} size=\"Medium\" label={false} />\n </React.Fragment>\n ))}\n </div>\n </section>\n\n <section className=\"eds-loading-matrix__section\">\n <h3 className=\"eds-loading-matrix__heading\">Custom label text</h3>\n <p className=\"eds-loading-matrix__sub\">\n <code>labelText</code> overrides the default \"Loading...\" string.\n </p>\n <div className=\"eds-loading-matrix__row\">\n <Loading size=\"Medium\" labelText=\"Saving form...\" />\n <Loading size=\"Medium\" style=\"AI\" labelText=\"Generating draft...\" />\n <Loading size=\"Large\" layout=\"Vertical\" labelText=\"Uploading 3 of 12 files...\" />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * TextField — React port of Embleema Design System 2.0's Input/Text Field\n * (Figma node 4201:149). Composes the lower-level <Field> base atom and\n * adds an optional label group + helper text.\n *\n * Props:\n * - validation : None | Error | Warning | Success | AI (passed to Field;\n * also tints the label in Error and the helper text in Error)\n * - appearance : Filled | Outlined (passed straight through to Field)\n * - labelPosition : Top | Left (Top stacks; Left puts a 120 px label column\n * on the left of a stack containing field + helper)\n * - label : label string. Omit to hide the label.\n * - required : adds a red \"*\" before the label\n * - helperText : helper text string. Omit to hide.\n * - state : optional forced state for previews (Pressed etc.)\n * - plus the full Field passthrough: leadingIcon, trailingIcon, inlineButton,\n * placeholder, value/defaultValue, onChange, disabled, readOnly, id, name,\n * type, className, aria-label, etc.\n */\n\nimport * as React from \"react\";\nimport {\n Field,\n type FieldState,\n type FieldValidation,\n type FieldAppearance,\n} from \"./Field\";\n\nexport type TextFieldLabelPosition = \"Top\" | \"Left\";\n\nexport type TextFieldProps = {\n validation?: FieldValidation;\n appearance?: FieldAppearance;\n labelPosition?: TextFieldLabelPosition;\n label?: string;\n required?: boolean;\n helperText?: string;\n state?: FieldState;\n\n // Field pass-through\n leadingIcon?: React.ReactNode;\n trailingIcon?: React.ReactNode;\n inlineButton?: React.ReactNode;\n placeholder?: string;\n value?: string;\n defaultValue?: string;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n disabled?: boolean;\n readOnly?: boolean;\n id?: string;\n name?: string;\n type?: \"text\" | \"email\" | \"password\" | \"number\" | \"tel\" | \"url\" | \"search\";\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — kept independent of Field's CSS. Colors come from the live\n// Figma extraction for the Text Field component: label uses body/md\n// (Text/Primary by default, Feedback/Error/Text in Error). Helper uses\n// body/xs (Text/Primary by default, Feedback/Error/Text in Error).\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --tf-text-primary: #0E0E0E;\n --tf-text-placeholder: #848484;\n --tf-text-disabled: #848484;\n --tf-feedback-error-text: #B31A1A;\n}\n\n.eds-tf {\n --tf-label-color: var(--tf-text-primary);\n --tf-helper-color: var(--tf-text-primary);\n\n font-family: Nunito, sans-serif;\n display: flex;\n gap: 4px;\n width: 100%;\n max-width: 520px;\n box-sizing: border-box;\n}\n.eds-tf[data-label-position=\"Top\"] {\n flex-direction: column;\n max-width: 400px;\n}\n.eds-tf[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 8px;\n}\n\n.eds-tf[data-validation=\"Error\"] {\n --tf-label-color: var(--tf-feedback-error-text);\n --tf-helper-color: var(--tf-feedback-error-text);\n}\n.eds-tf[data-state=\"Disabled\"],\n.eds-tf[data-state=\"ReadOnly\"] {\n --tf-label-color: var(--tf-text-disabled);\n --tf-helper-color: var(--tf-text-disabled);\n}\n\n.eds-tf__label {\n display: inline-flex;\n align-items: center;\n gap: 2px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 150%;\n color: var(--tf-label-color);\n cursor: default;\n}\n.eds-tf[data-label-position=\"Left\"] .eds-tf__label {\n width: 120px;\n flex-shrink: 0;\n padding-top: 12px; /* align with field's text baseline */\n}\n.eds-tf__required {\n color: var(--tf-feedback-error-text);\n}\n\n.eds-tf__content {\n display: flex;\n flex-direction: column;\n gap: 4px;\n flex: 1;\n min-width: 0;\n}\n\n.eds-tf__helper {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 140%;\n color: var(--tf-helper-color);\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-tf-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-tf-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-tf-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-tf-matrix__row {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.eds-tf-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-tf-matrix__pair {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n}\n.eds-tf-matrix .eds-tf { width: 100%; max-width: none; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-textfield]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-textfield\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// Auto-id when none provided so <label htmlFor> can target the input.\nlet idCounter = 0;\nfunction useGeneratedId(provided?: string) {\n const [id] = React.useState(() => provided ?? `eds-tf-${++idCounter}`);\n return id;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const TextField = React.forwardRef<HTMLInputElement, TextFieldProps>(\n function TextField(\n {\n validation = \"None\",\n appearance = \"Filled\",\n labelPosition = \"Top\",\n label,\n required = false,\n helperText,\n state,\n leadingIcon,\n trailingIcon,\n inlineButton,\n placeholder = \"Placeholder\",\n value,\n defaultValue,\n onChange,\n disabled = false,\n readOnly = false,\n id: providedId,\n name,\n type = \"text\",\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const id = useGeneratedId(providedId);\n const helperId = helperText ? `${id}-helper` : undefined;\n\n // Effective state mirrors Field's logic so the label/helper grays out too.\n let effectiveState: FieldState | undefined = state;\n if (!effectiveState) {\n if (disabled) effectiveState = \"Disabled\";\n else if (readOnly) effectiveState = \"ReadOnly\";\n }\n\n const wrapperClass = \"eds-tf\" + (className ? ` ${className}` : \"\");\n\n const labelEl = label ? (\n <label className=\"eds-tf__label\" htmlFor={id}>\n {required && (\n <span className=\"eds-tf__required\" aria-hidden>\n *\n </span>\n )}\n <span>{label}</span>\n </label>\n ) : null;\n\n const fieldEl = (\n <Field\n ref={ref}\n id={id}\n name={name}\n type={type}\n state={state}\n validation={validation}\n appearance={appearance}\n leadingIcon={leadingIcon}\n trailingIcon={trailingIcon}\n inlineButton={inlineButton}\n placeholder={placeholder}\n value={value}\n defaultValue={defaultValue}\n onChange={onChange}\n disabled={disabled}\n readOnly={readOnly}\n aria-label={ariaLabel ?? (label ? undefined : \"Text field\")}\n />\n );\n\n const helperEl = helperText ? (\n <div className=\"eds-tf__helper\" id={helperId}>\n {helperText}\n </div>\n ) : null;\n\n return (\n <div\n className={wrapperClass}\n data-label-position={labelPosition}\n data-validation={validation}\n data-state={effectiveState}\n >\n {labelPosition === \"Top\" ? (\n <>\n {labelEl}\n {fieldEl}\n {helperEl}\n </>\n ) : (\n <>\n {labelEl}\n <div className=\"eds-tf__content\">\n {fieldEl}\n {helperEl}\n </div>\n </>\n )}\n </div>\n );\n }\n);\n\nexport default TextField;\n\n// ---------------------------------------------------------------------------\n// TextFieldMatrix — renders every Validation × Style combination, with both\n// LabelPositions and the Label/HelperText booleans toggled on. Hover/Focus\n// are real browser states, so mouse over and tab into the fields to see them.\n// ---------------------------------------------------------------------------\nconst VALIDATIONS: FieldValidation[] = [\n \"None\",\n \"Error\",\n \"Warning\",\n \"Success\",\n \"AI\",\n];\n\nconst HELPER_BY_VALIDATION: Record<FieldValidation, string> = {\n None: \"Helper text\",\n Error: \"Error message\",\n Warning: \"Warning message\",\n Success: \"Success message\",\n AI: \"Helper text\",\n};\n\nexport function TextFieldMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-tf-matrix\">\n <section className=\"eds-tf-matrix__section\">\n <h3 className=\"eds-tf-matrix__heading\">LabelPosition · Top</h3>\n {VALIDATIONS.map((validation) => (\n <div key={validation} className=\"eds-tf-matrix__row\">\n <p className=\"eds-tf-matrix__row-label\">{validation}</p>\n <div className=\"eds-tf-matrix__pair\">\n <TextField\n label=\"Label\"\n validation={validation}\n appearance=\"Filled\"\n labelPosition=\"Top\"\n required\n helperText={HELPER_BY_VALIDATION[validation]}\n placeholder={`${validation} Filled`}\n />\n <TextField\n label=\"Label\"\n validation={validation}\n appearance=\"Outlined\"\n labelPosition=\"Top\"\n required\n helperText={HELPER_BY_VALIDATION[validation]}\n placeholder={`${validation} Outlined`}\n />\n </div>\n </div>\n ))}\n </section>\n\n <section className=\"eds-tf-matrix__section\">\n <h3 className=\"eds-tf-matrix__heading\">LabelPosition · Left</h3>\n {VALIDATIONS.map((validation) => (\n <div key={validation} className=\"eds-tf-matrix__row\">\n <p className=\"eds-tf-matrix__row-label\">{validation}</p>\n <TextField\n label=\"Label\"\n validation={validation}\n appearance=\"Filled\"\n labelPosition=\"Left\"\n required\n helperText={HELPER_BY_VALIDATION[validation]}\n placeholder={`${validation} Filled`}\n />\n <TextField\n label=\"Label\"\n validation={validation}\n appearance=\"Outlined\"\n labelPosition=\"Left\"\n required\n helperText={HELPER_BY_VALIDATION[validation]}\n placeholder={`${validation} Outlined`}\n />\n </div>\n ))}\n </section>\n\n <section className=\"eds-tf-matrix__section\">\n <h3 className=\"eds-tf-matrix__heading\">Boolean toggles</h3>\n <p className=\"eds-tf-matrix__row-label\">No label, no helper</p>\n <TextField placeholder=\"Plain\" />\n <p className=\"eds-tf-matrix__row-label\">Label only</p>\n <TextField label=\"Label only\" />\n <p className=\"eds-tf-matrix__row-label\">Helper text only</p>\n <TextField helperText=\"Helper text only\" placeholder=\"Helper-only field\" />\n <p className=\"eds-tf-matrix__row-label\">Disabled with everything</p>\n <TextField\n label=\"Disabled label\"\n required\n helperText=\"Disabled helper\"\n disabled\n placeholder=\"Disabled\"\n />\n <p className=\"eds-tf-matrix__row-label\">ReadOnly with everything</p>\n <TextField\n label=\"Read-only label\"\n required\n helperText=\"Read-only helper\"\n readOnly\n defaultValue=\"Read-only value\"\n />\n </section>\n </div>\n );\n}\n","/**\n * TextArea — React port of Embleema Design System 2.0's Input/Text Area\n * component (Figma node 4308:378). Composes the <Field> design language\n * (same validation/state palette, label-group layout, helper-text rules) but\n * wraps a multi-line <textarea> instead of an <input>.\n *\n * Structure mirrors the Figma source:\n * wrapper\n * ├── label (optional, body/md, htmlFor=textarea id)\n * ├── textarea-field wrapper (rounded box with border/fill — matches Field)\n * │ └── <textarea> (resizable, fills the wrapper)\n * └── footer\n * ├── helper text (optional)\n * └── character counter (optional, \"X/max\" or \"X\")\n *\n * Props:\n * - validation : None | Error | Warning | Success | AI\n * - appearance : Filled | Outlined (renamed from Figma's \"Style\")\n * - labelPosition : Top | Left\n * - label, required, helperText\n * - characterCounter : show the live \"X/max\" counter at footer-right\n * - maxLength : forwarded to <textarea> and shown in the counter\n * - rows : initial height in lines (default 4)\n * - resize : none | vertical | horizontal | both (default \"vertical\")\n * - plus standard textarea pass-through: value/defaultValue/onChange,\n * placeholder, disabled, readOnly, id, name, aria-label\n */\n\nimport * as React from \"react\";\nimport type {\n FieldState,\n FieldValidation,\n FieldAppearance,\n} from \"./Field\";\n\nexport type TextAreaLabelPosition = \"Top\" | \"Left\";\n\nexport type TextAreaProps = {\n validation?: FieldValidation;\n appearance?: FieldAppearance;\n labelPosition?: TextAreaLabelPosition;\n label?: string;\n required?: boolean;\n helperText?: string;\n characterCounter?: boolean;\n maxLength?: number;\n rows?: number;\n resize?: \"none\" | \"vertical\" | \"horizontal\" | \"both\";\n state?: FieldState;\n\n value?: string;\n defaultValue?: string;\n onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;\n placeholder?: string;\n disabled?: boolean;\n readOnly?: boolean;\n id?: string;\n name?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — the wrapper visual deliberately mirrors Field's. Colors and\n// state rules are duplicated rather than inherited so TextArea is fully\n// self-contained (loads cleanly even when Field isn't rendered on the page).\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --ta-background-default: #FEFEFE;\n --ta-background-field: #F8F8F8;\n --ta-background-primary: #F8F8F8;\n --ta-background-disabled: #F1F1F1;\n --ta-border-default: #DDDDDD;\n --ta-border-strong: #848484;\n --ta-border-subtle: #F1F1F1;\n --ta-border-focus: #306AE8;\n --ta-border-focus-ring: #A2BDF5;\n --ta-border-error: #E02020;\n --ta-feedback-error-background: #FFE2E2;\n --ta-feedback-error-text: #B31A1A;\n --ta-feedback-warning-indicator: #FA6400;\n --ta-feedback-success-indicator: #32A032;\n --ta-text-primary: #0E0E0E;\n --ta-text-secondary: #5E5E5E;\n --ta-text-tertiary: #848484;\n --ta-text-placeholder: #848484;\n --ta-text-disabled: #848484;\n --ta-action-secondary: #306AE8;\n\n /* Gradient/AI — same as Field. */\n --ta-gradient-ai: linear-gradient(to bottom, #90B3FF 0%, #6F59CF 79%);\n --ta-gradient-ai-h: linear-gradient(to right, #90B3FF 0%, #6F59CF 100%);\n --ta-ai-glow:\n 0 -3px 6px 0 rgba(144, 179, 255, 0.5),\n 0 3px 6px 0 rgba(111, 89, 207, 0.5);\n}\n\n.eds-ta {\n font-family: Nunito, sans-serif;\n display: flex;\n gap: 4px;\n width: 100%;\n max-width: 520px;\n box-sizing: border-box;\n}\n.eds-ta[data-label-position=\"Top\"] {\n flex-direction: column;\n max-width: 400px;\n}\n.eds-ta[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 8px;\n}\n\n.eds-ta__label {\n display: inline-flex;\n align-items: center;\n gap: 2px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 150%;\n color: var(--ta-label-color, var(--ta-text-primary));\n cursor: default;\n}\n.eds-ta[data-validation=\"Error\"] .eds-ta__label {\n color: var(--ta-feedback-error-text);\n}\n.eds-ta[data-state=\"Disabled\"] .eds-ta__label {\n color: var(--ta-text-disabled);\n}\n.eds-ta[data-label-position=\"Left\"] .eds-ta__label {\n width: 120px;\n flex-shrink: 0;\n padding-top: 12px;\n}\n.eds-ta__required {\n color: var(--ta-feedback-error-text);\n}\n\n.eds-ta__content {\n display: flex;\n flex-direction: column;\n gap: 4px;\n flex: 1;\n min-width: 0;\n}\n\n/* Field-like wrapper around the textarea. Same CSS-variable pattern as\n Field so validation/state rules can override --eds-ta-* cleanly. */\n.eds-ta__field {\n --ta-bg: transparent;\n --ta-border: var(--ta-border-default);\n --ta-border-width: 1px;\n --ta-ring: 0 0 0 0 transparent;\n --ta-ai-glow-applied: 0 0 0 0 transparent;\n --ta-text: var(--ta-text-placeholder);\n\n position: relative;\n display: block;\n border-radius: 4px;\n border: var(--ta-border-width) solid var(--ta-border);\n background-color: var(--ta-bg);\n box-shadow: var(--ta-ai-glow-applied), var(--ta-ring);\n width: 100%;\n box-sizing: border-box;\n transition: border-color 120ms ease-out,\n border-width 120ms ease-out,\n background-color 120ms ease-out,\n box-shadow 120ms ease-out,\n color 120ms ease-out;\n}\n\n.eds-ta__textarea {\n display: block;\n width: 100%;\n box-sizing: border-box;\n padding: 12px;\n border: none;\n outline: none;\n background: transparent;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 150%;\n color: var(--ta-text);\n resize: vertical;\n min-height: 96px;\n border-radius: inherit;\n}\n.eds-ta__textarea::placeholder { color: var(--ta-text-placeholder); }\n.eds-ta__textarea:disabled {\n cursor: not-allowed;\n color: var(--ta-text-disabled);\n -webkit-text-fill-color: var(--ta-text-disabled);\n resize: none;\n}\n.eds-ta__textarea:read-only { resize: none; }\n\n.eds-ta__footer {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 12px;\n min-height: 17px;\n}\n.eds-ta__helper {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 140%;\n color: var(--ta-text-primary);\n flex: 1;\n min-width: 0;\n}\n.eds-ta[data-validation=\"Error\"] .eds-ta__helper {\n color: var(--ta-feedback-error-text);\n}\n.eds-ta[data-state=\"Disabled\"] .eds-ta__helper {\n color: var(--ta-text-disabled);\n}\n.eds-ta__counter {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 140%;\n color: var(--ta-text-tertiary);\n white-space: nowrap;\n flex-shrink: 0;\n}\n.eds-ta__counter[data-over-limit=\"true\"] {\n color: var(--ta-feedback-error-text);\n font-weight: 600;\n}\n.eds-ta[data-state=\"Disabled\"] .eds-ta__counter {\n color: var(--ta-text-disabled);\n}\n\n/* =============================================================\n Appearance: Filled = field-fill background; Outlined = bottom underline\n only, matching Field's underline pattern.\n ============================================================= */\n.eds-ta__field[data-appearance=\"Filled\"] { --ta-bg: var(--ta-background-field); }\n\n.eds-ta__field[data-appearance=\"Outlined\"] {\n border-top-width: 0;\n border-left-width: 0;\n border-right-width: 0;\n border-radius: 0;\n}\n.eds-ta__field[data-appearance=\"Outlined\"] .eds-ta__textarea {\n border-radius: 0;\n}\n.eds-ta__field[data-validation=\"None\"][data-appearance=\"Outlined\"] {\n --ta-border: var(--ta-border-strong);\n}\n\n/* Validation tints (Default state) */\n.eds-ta__field[data-validation=\"Error\"] {\n --ta-border: var(--ta-border-error);\n --ta-border-width: 1.5px;\n}\n.eds-ta__field[data-validation=\"Error\"][data-appearance=\"Filled\"] {\n --ta-bg: var(--ta-feedback-error-background);\n}\n.eds-ta__field[data-validation=\"Warning\"] {\n --ta-border: var(--ta-feedback-warning-indicator);\n --ta-border-width: 1.5px;\n}\n.eds-ta__field[data-validation=\"Success\"] {\n --ta-border: var(--ta-feedback-success-indicator);\n --ta-border-width: 1.5px;\n}\n\n/* AI — gradient border via padding-box/border-box trick (preserves radius).\n Outlined uses ::after for the bottom strip. */\n.eds-ta__field[data-validation=\"AI\"][data-appearance=\"Filled\"]:not([data-state=\"Disabled\"]) {\n background:\n linear-gradient(var(--ta-background-field), var(--ta-background-field))\n padding-box,\n var(--ta-gradient-ai) border-box;\n border: 1.5px solid transparent;\n --ta-border-width: 1.5px;\n --ta-ai-glow-applied: var(--ta-ai-glow);\n}\n.eds-ta__field[data-appearance=\"Outlined\"][data-validation=\"AI\"]::after {\n content: \"\";\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n height: 2px;\n background: var(--ta-gradient-ai-h);\n pointer-events: none;\n}\n.eds-ta__field[data-appearance=\"Outlined\"][data-validation=\"AI\"][data-state=\"Focused\"]::after,\n.eds-ta__field[data-appearance=\"Outlined\"][data-validation=\"AI\"]:focus-within::after,\n.eds-ta__field[data-appearance=\"Outlined\"][data-validation=\"AI\"][data-state=\"Disabled\"]::after {\n display: none;\n}\n\n/* =============================================================\n States — natural :hover / :focus-within plus forced data-state for previews.\n ============================================================= */\n.eds-ta__field:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):hover,\n.eds-ta__field[data-state=\"Hover\"] {\n --ta-text: var(--ta-text-primary);\n}\n.eds-ta__field:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):hover[data-validation=\"None\"],\n.eds-ta__field[data-state=\"Hover\"][data-validation=\"None\"] {\n --ta-border: var(--ta-border-focus);\n --ta-border-width: 1.5px;\n}\n\n/* Focused — Filled gets a 4 px halo, Outlined gets a thick bottom focus stroke.\n The inner border stays put. */\n.eds-ta__field:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):focus-within,\n.eds-ta__field[data-state=\"Focused\"] {\n --ta-text: var(--ta-text-primary);\n}\n.eds-ta__field[data-appearance=\"Filled\"]:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):focus-within,\n.eds-ta__field[data-appearance=\"Filled\"][data-state=\"Focused\"] {\n --ta-ring: 0 0 0 4px var(--ta-border-focus-ring);\n}\n.eds-ta__field[data-appearance=\"Outlined\"]:not([data-state=\"Disabled\"]):not([data-state=\"ReadOnly\"]):not([data-state=\"Pressed\"]):focus-within,\n.eds-ta__field[data-appearance=\"Outlined\"][data-state=\"Focused\"] {\n --ta-ring: 0 4px 0 0 var(--ta-border-focus-ring);\n}\n\n/* Pressed (forced) */\n.eds-ta__field[data-state=\"Pressed\"] {\n --ta-text: var(--ta-text-primary);\n}\n.eds-ta__field[data-state=\"Pressed\"][data-validation=\"None\"][data-appearance=\"Filled\"] {\n --ta-bg: var(--ta-background-default);\n --ta-border: var(--ta-border-focus);\n --ta-border-width: 1.5px;\n}\n.eds-ta__field[data-state=\"Pressed\"][data-validation=\"None\"][data-appearance=\"Outlined\"] {\n --ta-border: var(--ta-border-focus);\n --ta-border-width: 1.5px;\n}\n\n/* Disabled */\n.eds-ta__field[data-state=\"Disabled\"] {\n --ta-text: var(--ta-text-disabled);\n --ta-border: var(--ta-border-subtle);\n --ta-border-width: 1.5px;\n --ta-ai-glow-applied: 0 0 0 0 transparent;\n}\n.eds-ta__field[data-state=\"Disabled\"][data-appearance=\"Filled\"] {\n --ta-bg: var(--ta-background-disabled);\n}\n\n/* ReadOnly */\n.eds-ta__field[data-state=\"ReadOnly\"] {\n --ta-text: var(--ta-text-primary);\n}\n.eds-ta__field[data-state=\"ReadOnly\"][data-appearance=\"Filled\"] {\n --ta-bg: var(--ta-background-disabled);\n --ta-border: var(--ta-border-subtle);\n --ta-border-width: 1.5px;\n}\n.eds-ta__field[data-state=\"ReadOnly\"][data-appearance=\"Outlined\"] {\n --ta-border: var(--ta-border-strong);\n --ta-border-width: 1px;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-ta-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-ta-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-ta-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-ta-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-ta-matrix__row { display: flex; flex-direction: column; gap: 8px; }\n.eds-ta-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-ta-matrix__pair {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n align-items: start;\n}\n.eds-ta-matrix .eds-ta { width: 100%; max-width: none; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-textarea]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-textarea\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\nlet idCounter = 0;\nfunction useGeneratedId(provided?: string) {\n const [id] = React.useState(() => provided ?? `eds-ta-${++idCounter}`);\n return id;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea(\n {\n validation = \"None\",\n appearance = \"Filled\",\n labelPosition = \"Top\",\n label,\n required = false,\n helperText,\n characterCounter = false,\n maxLength,\n rows = 4,\n resize = \"vertical\",\n state,\n value,\n defaultValue,\n onChange,\n placeholder = \"Start typing…\",\n disabled = false,\n readOnly = false,\n id: providedId,\n name,\n className,\n \"aria-label\": ariaLabel,\n },\n forwardedRef\n ) {\n ensureStyles();\n const id = useGeneratedId(providedId);\n const helperId = helperText ? `${id}-helper` : undefined;\n\n // Track current length for the counter. Works for controlled +\n // uncontrolled both — we mirror the textarea's value into local state on\n // every change so the counter updates without a render dance.\n const isControlled = value !== undefined;\n const [internalValue, setInternalValue] = React.useState(\n defaultValue ?? \"\"\n );\n const currentValue = isControlled ? (value as string) : internalValue;\n const currentLength = currentValue.length;\n const overLimit = maxLength != null && currentLength > maxLength;\n\n const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (!isControlled) setInternalValue(e.target.value);\n onChange?.(e);\n };\n\n // Effective state mirrors Field's logic so label/helper colors track too.\n let effectiveState: FieldState | undefined = state;\n if (!effectiveState) {\n if (disabled) effectiveState = \"Disabled\";\n else if (readOnly) effectiveState = \"ReadOnly\";\n }\n const isDisabled = disabled || effectiveState === \"Disabled\";\n const isReadOnly = readOnly || effectiveState === \"ReadOnly\";\n\n const wrapperClass = \"eds-ta\" + (className ? ` ${className}` : \"\");\n\n const labelEl = label ? (\n <label className=\"eds-ta__label\" htmlFor={id}>\n {required && (\n <span className=\"eds-ta__required\" aria-hidden>\n *\n </span>\n )}\n <span>{label}</span>\n </label>\n ) : null;\n\n const fieldEl = (\n <div\n className=\"eds-ta__field\"\n data-validation={validation}\n data-appearance={appearance}\n data-state={effectiveState}\n >\n <textarea\n ref={forwardedRef}\n id={id}\n name={name}\n className=\"eds-ta__textarea\"\n placeholder={placeholder}\n value={isControlled ? (value as string) : undefined}\n defaultValue={isControlled ? undefined : defaultValue}\n onChange={handleChange}\n disabled={isDisabled}\n readOnly={isReadOnly}\n rows={rows}\n maxLength={maxLength}\n style={{ resize: isDisabled || isReadOnly ? \"none\" : resize }}\n aria-label={ariaLabel ?? (label ? undefined : \"Text area\")}\n aria-invalid={validation === \"Error\" || undefined}\n aria-describedby={helperId}\n />\n </div>\n );\n\n const footerEl =\n helperText || characterCounter ? (\n <div className=\"eds-ta__footer\">\n {helperText ? (\n <div className=\"eds-ta__helper\" id={helperId}>\n {helperText}\n </div>\n ) : (\n <span />\n )}\n {characterCounter && (\n <div\n className=\"eds-ta__counter\"\n data-over-limit={overLimit || undefined}\n aria-live=\"polite\"\n >\n {maxLength != null\n ? `${currentLength}/${maxLength}`\n : `${currentLength}`}\n </div>\n )}\n </div>\n ) : null;\n\n return (\n <div\n className={wrapperClass}\n data-label-position={labelPosition}\n data-validation={validation}\n data-state={effectiveState}\n >\n {labelPosition === \"Top\" ? (\n <>\n {labelEl}\n {fieldEl}\n {footerEl}\n </>\n ) : (\n <>\n {labelEl}\n <div className=\"eds-ta__content\">\n {fieldEl}\n {footerEl}\n </div>\n </>\n )}\n </div>\n );\n }\n);\n\nexport default TextArea;\n\n// ---------------------------------------------------------------------------\n// TextAreaMatrix — Validation × Style grid, LabelPosition variants, and a\n// live character-counter example that demonstrates the over-limit transition.\n// ---------------------------------------------------------------------------\nconst VALIDATIONS: FieldValidation[] = [\n \"None\",\n \"Error\",\n \"Warning\",\n \"Success\",\n \"AI\",\n];\n\nconst HELPER_BY_VALIDATION: Record<FieldValidation, string> = {\n None: \"Optional helper text.\",\n Error: \"This field has an error.\",\n Warning: \"Heads up — review your input.\",\n Success: \"Looks good.\",\n AI: \"AI-assisted field.\",\n};\n\nexport function TextAreaMatrix() {\n ensureStyles();\n\n const [liveValue, setLiveValue] = React.useState(\n \"Type into this field to watch the counter tick up live.\"\n );\n\n return (\n <div className=\"eds-ta-matrix\">\n <section className=\"eds-ta-matrix__section\">\n <h3 className=\"eds-ta-matrix__heading\">Interactive · live counter</h3>\n <p className=\"eds-ta-matrix__sub\">\n Counter updates every keystroke. Crosses {120} chars to see the\n over-limit treatment (red, semibold).\n </p>\n <TextArea\n label=\"Tell us more\"\n required\n helperText=\"Up to 120 characters.\"\n characterCounter\n maxLength={120}\n value={liveValue}\n onChange={(e) => setLiveValue(e.target.value)}\n />\n </section>\n\n <section className=\"eds-ta-matrix__section\">\n <h3 className=\"eds-ta-matrix__heading\">LabelPosition · Top</h3>\n {VALIDATIONS.map((validation) => (\n <div key={validation} className=\"eds-ta-matrix__row\">\n <p className=\"eds-ta-matrix__row-label\">{validation}</p>\n <div className=\"eds-ta-matrix__pair\">\n <TextArea\n label=\"Label\"\n required\n helperText={HELPER_BY_VALIDATION[validation]}\n characterCounter\n maxLength={500}\n validation={validation}\n appearance=\"Filled\"\n placeholder={`${validation} Filled`}\n />\n <TextArea\n label=\"Label\"\n required\n helperText={HELPER_BY_VALIDATION[validation]}\n characterCounter\n maxLength={500}\n validation={validation}\n appearance=\"Outlined\"\n placeholder={`${validation} Outlined`}\n />\n </div>\n </div>\n ))}\n </section>\n\n <section className=\"eds-ta-matrix__section\">\n <h3 className=\"eds-ta-matrix__heading\">LabelPosition · Left</h3>\n <TextArea\n label=\"Notes\"\n helperText=\"Label sits in a 120 px column on the left.\"\n characterCounter\n maxLength={500}\n labelPosition=\"Left\"\n />\n </section>\n\n <section className=\"eds-ta-matrix__section\">\n <h3 className=\"eds-ta-matrix__heading\">Boolean toggles</h3>\n <p className=\"eds-ta-matrix__row-label\">No label, no helper, no counter</p>\n <TextArea placeholder=\"Plain field\" />\n <p className=\"eds-ta-matrix__row-label\">Label only</p>\n <TextArea label=\"Label only\" />\n <p className=\"eds-ta-matrix__row-label\">Counter only (no maxLength)</p>\n <TextArea characterCounter placeholder=\"Counter shows raw count\" />\n <p className=\"eds-ta-matrix__row-label\">Disabled with everything</p>\n <TextArea\n label=\"Disabled label\"\n required\n helperText=\"Disabled helper\"\n characterCounter\n maxLength={500}\n disabled\n defaultValue=\"Cannot be edited.\"\n />\n <p className=\"eds-ta-matrix__row-label\">ReadOnly with everything</p>\n <TextArea\n label=\"Read-only label\"\n required\n helperText=\"Read-only helper\"\n characterCounter\n maxLength={500}\n readOnly\n defaultValue=\"Read-only content. Resize handle is suppressed.\"\n />\n </section>\n </div>\n );\n}\n","/**\n * MedicationCard — React port of Embleema Design System 2.0's\n * Clinical/Medication Card component (Figma node 4718:1611).\n *\n * Pre-composed form card for medication data entry. Lays out medication\n * name, dosage, unit, frequency, dates, reason-for-change, and comments\n * across a responsive 3-column (Desktop) or 1-column (Tablet) grid.\n *\n * Per Figma:\n * - Card: Background/Default, 8 px radius, Elevation 0 0 4 rgba(0,0,0,0.08)\n * - Header: 16 px top/horizontal padding, status badge + 3-dot menu\n * - Each cell: 16 px / 20 px padding, label + 48 px field\n * - Field: Background/Field (#F8F8F8), 1 px Border/Default, 4 px radius,\n * 4 px gap, 12 px padding, body/md Light placeholder\n * - Footer: ActionButton (text-link primary, small)\n *\n * State drives the card's outer affordance:\n * - Default → standard shadow, neutral border\n * - Error → 2 px Feedback/Error/Text outline + faint red halo\n *\n * Size:\n * - Desktop → 1000 px wide, three 3-cell rows\n * - Tablet → 400 px wide, all cells stacked single-column\n *\n * Props:\n * - state : forced visual override (Default | Error)\n * - size : Desktop | Tablet\n * - medicationName : value shown in the first field (placeholder when empty)\n * - dosage / unit / frequency / startDate / endDate / reasonForChange /\n * comments : same — each accepts an optional string\n * - onRemove : destructive footer button callback (removes the card)\n */\n\nimport * as React from \"react\";\nimport { Button } from \"./Button\";\nimport { Dropdown } from \"./Dropdown\";\nimport type { DropdownOption } from \"./Dropdown\";\nimport { DateField as DateFieldComponent } from \"./DateField\";\nimport { TextField } from \"./TextField\";\nimport { TextArea } from \"./TextArea\";\n\n// Reasonable starter option sets for the three Dropdown fields. Real\n// installations would pass these in via props or fetch them; baking\n// sensible defaults in keeps the component drop-in usable.\nconst MED_NAME_OPTIONS: DropdownOption[] = [\n { value: \"ibuprofen\", label: \"Ibuprofen\" },\n { value: \"acetaminophen\", label: \"Acetaminophen\" },\n { value: \"amoxicillin\", label: \"Amoxicillin\" },\n { value: \"lisinopril\", label: \"Lisinopril\" },\n { value: \"metformin\", label: \"Metformin\" },\n { value: \"atorvastatin\", label: \"Atorvastatin\" },\n];\nconst FREQUENCY_OPTIONS: DropdownOption[] = [\n { value: \"qd\", label: \"Once daily\" },\n { value: \"bid\", label: \"Twice daily\" },\n { value: \"tid\", label: \"Three times daily\" },\n { value: \"qid\", label: \"Four times daily\" },\n { value: \"prn\", label: \"As needed (PRN)\" },\n];\nconst REASON_OPTIONS: DropdownOption[] = [\n { value: \"new\", label: \"New prescription\" },\n { value: \"dose_change\", label: \"Dose change\" },\n { value: \"frequency_change\", label: \"Frequency change\" },\n { value: \"discontinued\", label: \"Discontinued\" },\n { value: \"adverse_event\", label: \"Adverse event\" },\n];\n\nexport type MedicationCardSize = \"Desktop\" | \"Tablet\";\nexport type MedicationCardState = \"Default\" | \"Error\";\n\nexport type MedicationCardProps = {\n state?: MedicationCardState;\n size?: MedicationCardSize;\n medicationName?: string;\n dosage?: string;\n unit?: string;\n frequency?: string;\n startDate?: string;\n endDate?: string;\n reasonForChange?: string;\n comments?: string;\n onRemove?: () => void;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --mc-bg-default: #FEFEFE;\n --mc-bg-field: #F8F8F8;\n --mc-bg-primary: #F8F8F8;\n --mc-text-primary: #0E0E0E;\n --mc-text-placeholder: #848484;\n --mc-action-primary: #306AE8;\n --mc-border-default: #DDDDDD;\n --mc-border-focus-ring: #A2BDF5;\n --mc-feedback-error: #B31A1A;\n --mc-feedback-error-bg: #FFE2E2;\n}\n\n.eds-mc {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n background: var(--mc-bg-default);\n border-radius: 8px;\n overflow: hidden;\n font-family: Nunito, sans-serif;\n color: var(--mc-text-primary);\n box-sizing: border-box;\n position: relative;\n /* Outer affordance via box-shadow so the border width can change per state\n without shifting the card's layout. The inset rule simulates the border;\n the outset rule is the elevation. */\n box-shadow:\n inset 0 0 0 1px transparent,\n 0 0 4px rgba(0, 0, 0, 0.08);\n transition: box-shadow 120ms ease-out;\n}\n\n.eds-mc[data-size=\"Desktop\"] { width: 1000px; max-width: 100%; }\n.eds-mc[data-size=\"Tablet\"] { width: 400px; max-width: 100%; }\n\n/* ---------- State affordance ----------\n The card wrapper is a static container — no hover/focus chrome at the\n card level. Focus indicators live on the individual field components\n below. Error still gets a subtle red outline so the card communicates\n form-level validation. */\n.eds-mc[data-state=\"Error\"] {\n box-shadow:\n inset 0 0 0 2px var(--mc-feedback-error),\n 0 0 0 4px var(--mc-feedback-error-bg),\n 0 0 4px rgba(0, 0, 0, 0.08);\n}\n\n/* ---------- Header ---------- */\n.eds-mc__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 16px 0;\n flex-shrink: 0;\n}\n.eds-mc__status-badge {\n width: 20px;\n height: 20px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 2px;\n box-sizing: border-box;\n flex-shrink: 0;\n}\n.eds-mc__status-pill {\n width: 16px;\n height: 16px;\n border-radius: 999px;\n background: linear-gradient(to bottom, #FEFEFE 23.66%, #D8D8D8 98.58%);\n border: 1px solid var(--mc-border-default);\n box-sizing: border-box;\n}\n.eds-mc__menu {\n width: 24px;\n height: 24px;\n background: transparent;\n border: 0;\n padding: 0;\n cursor: pointer;\n color: var(--mc-text-primary);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n flex-shrink: 0;\n}\n.eds-mc__menu:hover { background: rgba(0, 0, 0, 0.04); }\n.eds-mc__menu svg { display: block; width: 100%; height: 100%; }\n\n/* ---------- Rows + cells ---------- */\n.eds-mc__row {\n display: grid;\n width: 100%;\n align-items: start;\n}\n.eds-mc[data-size=\"Desktop\"] .eds-mc__row {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.eds-mc[data-size=\"Tablet\"] .eds-mc__row {\n grid-template-columns: minmax(0, 1fr);\n}\n.eds-mc__cell {\n padding: 20px 16px;\n border-radius: 8px;\n min-width: 0;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n}\n/* The last row's third Desktop cell is intentionally empty per Figma */\n.eds-mc__cell--spacer { padding-top: 0; padding-bottom: 0; min-height: 100px; }\n\n/* ---------- Field molecule (label + input shell) ---------- */\n.eds-mc__field {\n display: flex;\n flex-direction: column;\n gap: 4px;\n width: 100%;\n}\n.eds-mc__field-label {\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5;\n color: var(--mc-text-primary);\n margin: 0;\n}\n.eds-mc__field-input {\n display: flex;\n align-items: center;\n gap: 4px;\n height: 48px;\n padding: 12px;\n background: var(--mc-bg-field);\n border: 1px solid var(--mc-border-default);\n border-radius: 4px;\n box-sizing: border-box;\n box-shadow: 0 0 3px rgba(0, 0, 0, 0.12);\n cursor: text;\n transition: border-color 120ms ease-out;\n}\n.eds-mc__field-input:focus-within {\n border-color: var(--mc-action-primary);\n outline: none;\n}\n.eds-mc__field-input--readonly { cursor: default; }\n.eds-mc__field-input input {\n flex: 1 0 0;\n min-width: 0;\n height: 100%;\n border: 0;\n background: transparent;\n outline: none;\n font-family: Nunito, sans-serif;\n font-size: 16px;\n font-weight: 300;\n line-height: 1.5;\n color: var(--mc-text-primary);\n}\n.eds-mc__field-input input::placeholder {\n color: var(--mc-text-placeholder);\n font-weight: 300;\n}\n\n.eds-mc__field-icon {\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--mc-text-placeholder);\n}\n.eds-mc__field-icon svg { display: block; width: 100%; height: 100%; }\n\n/* \"Today\" inline button on date fields */\n.eds-mc__today {\n flex-shrink: 0;\n padding: 6px 8px;\n background: transparent;\n border: 1px solid var(--mc-action-primary);\n border-radius: 8px;\n color: var(--mc-action-primary);\n font-family: Nunito, sans-serif;\n font-size: 14px;\n font-weight: 500;\n line-height: 1.2;\n letter-spacing: 0.14px;\n cursor: pointer;\n box-shadow: 0 0 2px rgba(0, 0, 0, 0.08);\n}\n.eds-mc__today:hover { background: rgba(48, 106, 232, 0.06); }\n\n/* ---------- Text Area ---------- */\n.eds-mc__textarea {\n min-height: 120px;\n padding: 12px;\n background: var(--mc-bg-field);\n border: 1px solid var(--mc-border-default);\n border-radius: 4px;\n box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);\n font-family: Nunito, sans-serif;\n font-size: 16px;\n font-weight: 300;\n line-height: 1.5;\n color: var(--mc-text-primary);\n resize: vertical;\n outline: none;\n box-sizing: border-box;\n width: 100%;\n transition: border-color 120ms ease-out;\n}\n.eds-mc__textarea::placeholder { color: var(--mc-text-placeholder); }\n.eds-mc__textarea:focus-within,\n.eds-mc__textarea:focus { border-color: var(--mc-action-primary); }\n\n/* ---------- Footer (Remove action) ----------\n The button itself is the shared Action/Button component (Destructive /\n Text / Small). This rule just controls its placement within the card. */\n.eds-mc__footer {\n display: flex;\n align-items: center;\n padding: 0 16px 16px;\n flex-shrink: 0;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-mc-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-mc-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-mc-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-mc-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-mc-matrix__row {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 32px 8px;\n}\n.eds-mc-matrix__row-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-mc-matrix__controls {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n padding: 12px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-mc-matrix__chip {\n padding: 6px 12px;\n background: transparent;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n}\n.eds-mc-matrix__chip[data-active=\"true\"] {\n background: #E3ECFF;\n border-color: #306AE8;\n color: #306AE8;\n}\n.eds-mc-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-medicationcard]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-medicationcard\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — minimal inline SVGs sized to match the Figma slots. We don't reuse\n// the full Material library here since the card is a presentational sample;\n// these icons are visually identifying without pulling more dependencies.\n// ---------------------------------------------------------------------------\nfunction ChevronDown() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M5 7.5L10 12.5L15 7.5\"\n stroke=\"currentColor\"\n strokeWidth=\"1.6\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n\nfunction SearchIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"9\" cy=\"9\" r=\"5\" stroke=\"currentColor\" strokeWidth=\"1.6\" />\n <path d=\"M13 13 L17 17\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\nfunction CloseCircleIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"10\" cy=\"10\" r=\"7.5\" stroke=\"currentColor\" strokeWidth=\"1.4\" />\n <path\n d=\"M7.5 7.5L12.5 12.5M12.5 7.5L7.5 12.5\"\n stroke=\"currentColor\"\n strokeWidth=\"1.4\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n}\n\nfunction CalendarIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <rect\n x=\"3\"\n y=\"4.5\"\n width=\"14\"\n height=\"13\"\n rx=\"2\"\n stroke=\"currentColor\"\n strokeWidth=\"1.4\"\n />\n <path\n d=\"M3 8 L17 8\"\n stroke=\"currentColor\"\n strokeWidth=\"1.4\"\n />\n <path\n d=\"M7 2.5 L7 6 M13 2.5 L13 6\"\n stroke=\"currentColor\"\n strokeWidth=\"1.4\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n}\n\nfunction MenuVertIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"12\" cy=\"6\" r=\"1.6\" fill=\"currentColor\" />\n <circle cx=\"12\" cy=\"12\" r=\"1.6\" fill=\"currentColor\" />\n <circle cx=\"12\" cy=\"18\" r=\"1.6\" fill=\"currentColor\" />\n </svg>\n );\n}\n\n// Delete icon — exact path from Icon/Action/Delete (Figma node 4052:3058).\n// Native viewBox is 17.7678 × 20, translated inside a 24-viewBox to match the\n// Figma 9.41% / 13.47% / 7.25% / 12.5% inset.\nfunction DeleteIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(3 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M3.32583 20C2.73693 20 2.23282 19.7903 1.8135 19.371C1.39418 18.9517 1.18452 18.4476 1.18452 17.8587V2.82448H0.888389C0.636679 2.82448 0.425736 2.7393 0.25556 2.56892C0.0851867 2.39855 0 2.18751 0 1.9358C0 1.68389 0.0851867 1.47295 0.25556 1.30297C0.425736 1.13279 0.636679 1.04771 0.888389 1.04771H5.33033C5.33033 0.757697 5.4325 0.510528 5.63683 0.306199C5.84096 0.102067 6.08803 0 6.37804 0H11.3897C11.6797 0 11.9268 0.102067 12.1309 0.306199C12.3353 0.510528 12.4374 0.757697 12.4374 1.04771H16.8794C17.1311 1.04771 17.342 1.13289 17.5122 1.30327C17.6826 1.47364 17.7678 1.68468 17.7678 1.93639C17.7678 2.1883 17.6826 2.39924 17.5122 2.56922C17.342 2.7394 17.1311 2.82448 16.8794 2.82448H16.5833V17.8587C16.5833 18.4476 16.3736 18.9517 15.9543 19.371C15.535 19.7903 15.0308 20 14.4419 20H3.32583ZM14.8065 2.82448H2.9613V17.8587C2.9613 17.9651 2.99545 18.0525 3.06376 18.1208C3.13206 18.1891 3.21942 18.2232 3.32583 18.2232H14.4419C14.5484 18.2232 14.6357 18.1891 14.704 18.1208C14.7723 18.0525 14.8065 17.9651 14.8065 17.8587V2.82448ZM6.69756 15.8542C6.94927 15.8542 7.16022 15.7691 7.33039 15.5989C7.50037 15.4285 7.58536 15.2175 7.58536 14.9658V6.08191C7.58536 5.8302 7.50017 5.61916 7.3298 5.44878C7.15962 5.27861 6.94858 5.19352 6.69667 5.19352C6.44496 5.19352 6.23402 5.27861 6.06385 5.44878C5.89387 5.61916 5.80888 5.8302 5.80888 6.08191V14.9658C5.80888 15.2175 5.89397 15.4285 6.06414 15.5989C6.23451 15.7691 6.44566 15.8542 6.69756 15.8542ZM11.0711 15.8542C11.3228 15.8542 11.5338 15.7691 11.7039 15.5989C11.8739 15.4285 11.9589 15.2175 11.9589 14.9658V6.08191C11.9589 5.8302 11.8738 5.61916 11.7036 5.44878C11.5333 5.27861 11.3221 5.19352 11.0702 5.19352C10.8185 5.19352 10.6076 5.27861 10.4374 5.44878C10.2674 5.61916 10.1824 5.8302 10.1824 6.08191V14.9658C10.1824 15.2175 10.2676 15.4285 10.438 15.5989C10.6082 15.7691 10.8192 15.8542 11.0711 15.8542Z\"\n />\n </g>\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Internal field helpers\n// ---------------------------------------------------------------------------\ntype DropdownFieldProps = {\n label: string;\n value: string;\n placeholder?: string;\n onChange?: (v: string) => void;\n};\nfunction DropdownField({\n label,\n value,\n placeholder = \"Select…\",\n onChange,\n}: DropdownFieldProps) {\n return (\n <div className=\"eds-mc__field\">\n <label className=\"eds-mc__field-label\">{label}</label>\n <div className=\"eds-mc__field-input\">\n <input\n type=\"text\"\n value={value}\n onChange={(e) => onChange?.(e.target.value)}\n placeholder={placeholder}\n />\n <span className=\"eds-mc__field-icon\">\n <ChevronDown />\n </span>\n </div>\n </div>\n );\n}\n\ntype SearchFieldProps = {\n label: string;\n value: string;\n placeholder?: string;\n onChange?: (v: string) => void;\n};\nfunction SearchField({\n label,\n value,\n placeholder = \"Placeholder\",\n onChange,\n}: SearchFieldProps) {\n return (\n <div className=\"eds-mc__field\">\n <label className=\"eds-mc__field-label\">{label}</label>\n <div className=\"eds-mc__field-input\">\n <span className=\"eds-mc__field-icon\">\n <SearchIcon />\n </span>\n <input\n type=\"text\"\n value={value}\n onChange={(e) => onChange?.(e.target.value)}\n placeholder={placeholder}\n />\n <span className=\"eds-mc__field-icon\">\n <CloseCircleIcon />\n </span>\n </div>\n </div>\n );\n}\n\ntype DateFieldProps = {\n label: string;\n value: string;\n onChange?: (v: string) => void;\n onToday?: () => void;\n};\nfunction DateField({ label, value, onChange, onToday }: DateFieldProps) {\n return (\n <div className=\"eds-mc__field\">\n <label className=\"eds-mc__field-label\">{label}</label>\n <div className=\"eds-mc__field-input\">\n <input\n type=\"text\"\n value={value}\n onChange={(e) => onChange?.(e.target.value)}\n placeholder=\"mm/dd/yyyy\"\n />\n <button\n type=\"button\"\n className=\"eds-mc__today\"\n onClick={(e) => {\n e.stopPropagation();\n onToday?.();\n }}\n >\n Today\n </button>\n <span className=\"eds-mc__field-icon\">\n <CalendarIcon />\n </span>\n </div>\n </div>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const MedicationCard = React.forwardRef<HTMLDivElement, MedicationCardProps>(\n function MedicationCard(\n {\n state,\n size = \"Desktop\",\n medicationName = \"\",\n dosage = \"\",\n unit = \"\",\n frequency = \"\",\n startDate = \"\",\n endDate = \"\",\n reasonForChange = \"\",\n comments = \"\",\n onRemove,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const [med, setMed] = React.useState(medicationName);\n const [dos, setDos] = React.useState(dosage);\n const [un, setUn] = React.useState(unit);\n const [freq, setFreq] = React.useState(frequency);\n const [sd, setSd] = React.useState(startDate);\n const [ed, setEd] = React.useState(endDate);\n const [reason, setReason] = React.useState(reasonForChange);\n const [com, setCom] = React.useState(comments);\n\n const today = () => {\n const d = new Date();\n const pad = (n: number) => String(n).padStart(2, \"0\");\n return `${pad(d.getMonth() + 1)}/${pad(d.getDate())}/${d.getFullYear()}`;\n };\n\n const wrapperClass = \"eds-mc\" + (className ? ` ${className}` : \"\");\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-size={size}\n data-state={state}\n role=\"group\"\n aria-label={ariaLabel ?? \"Medication entry\"}\n >\n <div className=\"eds-mc__header\">\n <div\n className=\"eds-mc__status-badge\"\n role=\"img\"\n aria-label=\"Status: Not started\"\n >\n <span className=\"eds-mc__status-pill\" />\n </div>\n <button\n type=\"button\"\n className=\"eds-mc__menu\"\n aria-label=\"Medication options\"\n >\n <MenuVertIcon />\n </button>\n </div>\n\n <div className=\"eds-mc__row\">\n <div className=\"eds-mc__cell\">\n <Dropdown\n label=\"Medication Name\"\n type=\"Single\"\n options={MED_NAME_OPTIONS}\n value={med}\n onChange={(v) => setMed(v as string)}\n placeholder=\"Select medication\"\n />\n </div>\n <div className=\"eds-mc__cell\">\n <TextField\n label=\"Dosage\"\n value={dos}\n onChange={(e) => setDos(e.target.value)}\n placeholder=\"Search dosage\"\n trailingIcon={<SearchIcon />}\n />\n </div>\n <div className=\"eds-mc__cell\">\n <TextField\n label=\"Unit\"\n value={un}\n onChange={(e) => setUn(e.target.value)}\n placeholder=\"Search unit\"\n trailingIcon={<SearchIcon />}\n />\n </div>\n </div>\n\n <div className=\"eds-mc__row\">\n <div className=\"eds-mc__cell\">\n <Dropdown\n label=\"Frequency\"\n type=\"Single\"\n options={FREQUENCY_OPTIONS}\n value={freq}\n onChange={(v) => setFreq(v as string)}\n placeholder=\"Select frequency\"\n />\n </div>\n <div className=\"eds-mc__cell\">\n <DateFieldComponent\n label=\"Start Date\"\n value={sd}\n onChange={setSd}\n />\n </div>\n <div className=\"eds-mc__cell\">\n <DateFieldComponent\n label=\"End Date\"\n value={ed}\n onChange={setEd}\n />\n </div>\n </div>\n\n <div className=\"eds-mc__row\">\n <div className=\"eds-mc__cell\">\n <Dropdown\n label=\"Reason(s) for change\"\n type=\"Single\"\n options={REASON_OPTIONS}\n value={reason}\n onChange={(v) => setReason(v as string)}\n placeholder=\"Select reason\"\n />\n </div>\n <div className=\"eds-mc__cell\">\n <TextArea\n label=\"Comments\"\n value={com}\n onChange={(e) => setCom(e.target.value)}\n placeholder=\"Add a note about this medication\"\n rows={3}\n />\n </div>\n {size === \"Desktop\" && (\n <div className=\"eds-mc__cell eds-mc__cell--spacer\" aria-hidden />\n )}\n </div>\n\n <div className=\"eds-mc__footer\">\n <Button\n variant=\"Destructive\"\n kind=\"Text\"\n size=\"Small\"\n leadingIcon={<DeleteIcon />}\n onClick={onRemove}\n aria-label=\"Remove medication\"\n >\n Remove\n </Button>\n </div>\n </div>\n );\n }\n);\n\nexport default MedicationCard;\n\n// ---------------------------------------------------------------------------\n// MedicationCardMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst STATES: MedicationCardState[] = [\"Default\", \"Error\"];\n\nexport function MedicationCardMatrix() {\n ensureStyles();\n const [size, setSize] = React.useState<MedicationCardSize>(\"Desktop\");\n const [state, setState] = React.useState<MedicationCardState>(\"Default\");\n\n return (\n <div className=\"eds-mc-matrix\">\n <section className=\"eds-mc-matrix__section\">\n <h3 className=\"eds-mc-matrix__heading\">Interactive · live card</h3>\n <p className=\"eds-mc-matrix__sub\">\n Toggle Size to switch between Desktop (3-column) and Tablet\n (single-column). Toggle State to swap between the default chrome\n and the Error outline. All field inputs are editable.\n </p>\n <div className=\"eds-mc-matrix__controls\" aria-label=\"Size\">\n {([\"Desktop\", \"Tablet\"] as MedicationCardSize[]).map((s) => (\n <button\n key={s}\n type=\"button\"\n className=\"eds-mc-matrix__chip\"\n data-active={size === s || undefined}\n onClick={() => setSize(s)}\n >\n {s}\n </button>\n ))}\n </div>\n <div className=\"eds-mc-matrix__controls\" aria-label=\"State\">\n {STATES.map((s) => (\n <button\n key={s}\n type=\"button\"\n className=\"eds-mc-matrix__chip\"\n data-active={state === s || undefined}\n onClick={() => setState(s)}\n >\n {s}\n </button>\n ))}\n </div>\n <div style={{ padding: \"32px 8px\" }}>\n <MedicationCard size={size} state={state} />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * MenuItem — React port of Embleema Design System 2.0's\n * Navigation/Menu/Item component set (Figma node 5121:65).\n *\n * Single row inside a Navigation/Menu/Dropdown. 40 px tall, 240 px wide by\n * default, with a 20 px leading icon, a body-size label, and an optional\n * trailing shortcut/text slot.\n *\n * Color mapping (semantic tokens from embleema-design-system.md):\n * Default : transparent + Text/Primary label\n * Hover : Background/Selected + Text/Primary label\n * Focus : Background/Selected + 2 px Border/FocusRing outline + Text/Primary label\n * Active : Background/Selected + Action/Primary/Background label\n * Disabled : transparent + Action/Disabled/Text label, no interaction\n *\n * Typography:\n * Label : body/sm — Nunito Regular 14 / 1.5, Text/Primary (or per state)\n * Shortcut : body/xs — Nunito Regular 12 / 1.4, letter-spacing 0.01em\n */\n\nimport * as React from \"react\";\n\nexport type MenuItemState =\n | \"Default\"\n | \"Hover\"\n | \"Focus\"\n | \"Active\"\n | \"Disabled\";\n\nexport type MenuItemProps = {\n label: string;\n state?: MenuItemState;\n /** true → default settings glyph; false → no icon; ReactNode → custom. */\n leadingIcon?: boolean | React.ReactNode;\n /** true → render shortcut slot with `shortcut`; false → hidden. */\n trailingText?: boolean;\n /** Text shown in the trailing slot when trailingText is true. */\n shortcut?: string;\n onClick?: () => void;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_SHORTCUT = \"⌘K\";\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n --mi-text-primary: #0E0E0E;\n --mi-text-disabled: #848484;\n --mi-action-primary: #306AE8;\n --mi-background-selected: #E3ECFF;\n --mi-border-focus-ring: #A2BDF5;\n}\n\n.eds-mi {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n width: 240px;\n height: 40px;\n padding: 10px 16px;\n box-sizing: border-box;\n border: 0;\n background: transparent;\n color: var(--mi-text-primary);\n font-family: Nunito, sans-serif;\n cursor: pointer;\n text-align: left;\n outline: 0;\n position: relative;\n transition: background-color 100ms ease-out, color 100ms ease-out;\n}\n\n/* Hover — real :hover OR forced data-state=\"Hover\". */\n.eds-mi:not([data-locked=\"true\"]):hover,\n.eds-mi[data-state=\"Hover\"]:not([data-locked=\"true\"]) {\n background: var(--mi-background-selected);\n}\n\n/* Focus — additive 2 px Border/FocusRing outline, same Background/Selected\n fill as Hover. Real keyboard focus and the forced state share the rule. */\n.eds-mi:not([data-locked=\"true\"]):focus-visible,\n.eds-mi[data-state=\"Focus\"]:not([data-locked=\"true\"]) {\n background: var(--mi-background-selected);\n outline: 2px solid var(--mi-border-focus-ring);\n outline-offset: -2px;\n}\n\n/* Active — bold blue label on Background/Selected. */\n.eds-mi[data-state=\"Active\"] {\n background: var(--mi-background-selected);\n color: var(--mi-action-primary);\n}\n\n/* Disabled — muted label, pointer suppressed, no hover/focus chrome. */\n.eds-mi[data-state=\"Disabled\"],\n.eds-mi[data-locked=\"true\"] {\n color: var(--mi-text-disabled);\n cursor: not-allowed;\n}\n.eds-mi[data-state=\"Disabled\"]:hover,\n.eds-mi[data-locked=\"true\"]:hover {\n background: transparent;\n}\n\n/* Leading icon slot */\n.eds-mi__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n color: inherit;\n}\n.eds-mi__icon svg { display: block; width: 20px; height: 20px; }\n\n/* Label */\n.eds-mi__label {\n flex: 1 1 0;\n min-width: 0;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.5;\n color: inherit;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* Trailing shortcut */\n.eds-mi__shortcut {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 1.4;\n letter-spacing: 0.01em;\n color: inherit;\n flex-shrink: 0;\n text-align: right;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-mi-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-mi-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-mi-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-mi-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-mi-matrix__controls {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: center;\n}\n.eds-mi-matrix__chip {\n padding: 6px 14px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n transition: background-color 120ms;\n}\n.eds-mi-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-mi-matrix__chip[data-active=\"true\"] {\n background: #306AE8;\n color: #FEFEFE;\n border-color: #306AE8;\n}\n.eds-mi-matrix__toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #0E0E0E;\n}\n.eds-mi-matrix__toggle input { accent-color: #306AE8; }\n.eds-mi-matrix__stage {\n padding: 24px;\n background: #F8F8F8;\n border-radius: 8px;\n display: flex;\n flex-wrap: wrap;\n gap: 32px;\n align-items: flex-start;\n}\n.eds-mi-matrix__panel {\n display: inline-flex;\n flex-direction: column;\n background: #FEFEFE;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n padding: 8px 0;\n box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.06);\n}\n/* Scroll wrapper: the inner grid is ~1100 px+ wide (1 label column + 5\n state columns each fitting a 240 px MenuItem). Wrapping it in an\n overflow-x: auto container keeps every state visible at any viewport\n width without forcing the MenuItem chrome to shrink. */\n.eds-mi-matrix__grid-scroll {\n overflow-x: auto;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n}\n.eds-mi-matrix__grid {\n display: grid;\n grid-template-columns: 100px repeat(5, minmax(256px, max-content));\n gap: 0;\n align-items: stretch;\n min-width: max-content;\n}\n.eds-mi-matrix__cell {\n border-right: 1px solid #EEEEEE;\n border-bottom: 1px solid #EEEEEE;\n background: #FEFEFE;\n min-height: 64px;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n padding: 8px;\n}\n.eds-mi-matrix__cell:last-child { border-right: none; }\n.eds-mi-matrix__cell--head {\n background: #F8F8F8;\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n justify-content: center;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-menu-item]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-menu-item\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Default leading-icon glyph (settings cog) — matches the Figma placeholder.\n// Override by passing a ReactNode for leadingIcon.\n// ---------------------------------------------------------------------------\nfunction DefaultLeadingIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"10\" cy=\"10\" r=\"2.5\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n <path\n d=\"M10 1.5v2M10 16.5v2M3.5 10h-2M18.5 10h-2M5.4 5.4l-1.4-1.4M16 16l-1.4-1.4M14.6 5.4L16 4M4 16l1.4-1.4\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n />\n </svg>\n );\n}\n\nfunction renderLeading(value: MenuItemProps[\"leadingIcon\"]): React.ReactNode {\n if (value === false || value === null || value === undefined) return null;\n if (value === true) {\n return (\n <span className=\"eds-mi__icon\" aria-hidden>\n <DefaultLeadingIcon />\n </span>\n );\n }\n return (\n <span className=\"eds-mi__icon\" aria-hidden>\n {value}\n </span>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const MenuItem = React.forwardRef<HTMLButtonElement, MenuItemProps>(\n function MenuItem(\n {\n label,\n state = \"Default\",\n leadingIcon = true,\n trailingText = false,\n shortcut = DEFAULT_SHORTCUT,\n onClick,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isDisabled = state === \"Disabled\";\n const isActive = state === \"Active\";\n const wrapperClass = \"eds-mi\" + (className ? ` ${className}` : \"\");\n\n return (\n <button\n ref={ref}\n type=\"button\"\n id={id}\n className={wrapperClass}\n data-state={state}\n data-locked={isDisabled || undefined}\n role=\"menuitem\"\n aria-current={isActive || undefined}\n aria-disabled={isDisabled || undefined}\n disabled={isDisabled}\n tabIndex={isDisabled ? -1 : 0}\n onClick={isDisabled ? undefined : onClick}\n aria-label={ariaLabel}\n >\n {renderLeading(leadingIcon)}\n <span className=\"eds-mi__label\">{label}</span>\n {trailingText && <span className=\"eds-mi__shortcut\">{shortcut}</span>}\n </button>\n );\n }\n);\n\nexport default MenuItem;\n\n// ---------------------------------------------------------------------------\n// MenuItemMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst MI_STATES: MenuItemState[] = [\n \"Default\",\n \"Hover\",\n \"Focus\",\n \"Active\",\n \"Disabled\",\n];\n\nconst SAMPLE_LABEL = \"Settings\";\nconst SAMPLE_SHORTCUT = \"⌘,\";\n\nexport function MenuItemMatrix() {\n ensureStyles();\n const [state, setState] = React.useState<MenuItemState>(\"Default\");\n const [leadingIcon, setLeadingIcon] = React.useState(true);\n const [trailingText, setTrailingText] = React.useState(false);\n const [labelText, setLabelText] = React.useState(SAMPLE_LABEL);\n\n return (\n <div className=\"eds-mi-matrix\">\n <section className=\"eds-mi-matrix__section\">\n <h3 className=\"eds-mi-matrix__heading\">Interactive · single item</h3>\n <p className=\"eds-mi-matrix__sub\">\n Toggle the State chip to force a specific visual. The booleans\n control whether the leading icon and trailing shortcut slots are\n rendered. Label is editable.\n </p>\n <div className=\"eds-mi-matrix__controls\" aria-label=\"State\">\n {MI_STATES.map((s) => (\n <button\n key={s}\n type=\"button\"\n className=\"eds-mi-matrix__chip\"\n data-active={state === s || undefined}\n onClick={() => setState(s)}\n >\n {s}\n </button>\n ))}\n </div>\n <div className=\"eds-mi-matrix__controls\">\n <label className=\"eds-mi-matrix__toggle\">\n <input\n type=\"checkbox\"\n checked={leadingIcon}\n onChange={(e) => setLeadingIcon(e.target.checked)}\n />\n LeadingIcon\n </label>\n <label className=\"eds-mi-matrix__toggle\">\n <input\n type=\"checkbox\"\n checked={trailingText}\n onChange={(e) => setTrailingText(e.target.checked)}\n />\n TrailingText\n </label>\n <label className=\"eds-mi-matrix__toggle\">\n Label:&nbsp;\n <input\n type=\"text\"\n value={labelText}\n onChange={(e) => setLabelText(e.target.value)}\n style={{\n fontFamily: \"Nunito, sans-serif\",\n fontSize: 13,\n padding: \"4px 8px\",\n border: \"1px solid #DDDDDD\",\n borderRadius: 4,\n width: 160,\n }}\n />\n </label>\n </div>\n <div className=\"eds-mi-matrix__stage\">\n <div className=\"eds-mi-matrix__panel\">\n <MenuItem\n label={labelText}\n state={state}\n leadingIcon={leadingIcon}\n trailingText={trailingText}\n shortcut={SAMPLE_SHORTCUT}\n />\n </div>\n </div>\n </section>\n\n <section className=\"eds-mi-matrix__section\">\n <h3 className=\"eds-mi-matrix__heading\">State × Booleans (static)</h3>\n <p className=\"eds-mi-matrix__sub\">\n Every state rendered with LeadingIcon + TrailingText on, then with\n both off, for visual QA.\n </p>\n <div className=\"eds-mi-matrix__grid-scroll\">\n <div className=\"eds-mi-matrix__grid\">\n <div className=\"eds-mi-matrix__cell eds-mi-matrix__cell--head\">\n Booleans\n </div>\n {MI_STATES.map((s) => (\n <div\n key={s}\n className=\"eds-mi-matrix__cell eds-mi-matrix__cell--head\"\n >\n {s}\n </div>\n ))}\n <div className=\"eds-mi-matrix__cell eds-mi-matrix__cell--head\">\n Icon + Shortcut\n </div>\n {MI_STATES.map((s) => (\n <div key={`with-${s}`} className=\"eds-mi-matrix__cell\">\n <MenuItem\n label=\"Settings\"\n state={s}\n leadingIcon\n trailingText\n shortcut={SAMPLE_SHORTCUT}\n />\n </div>\n ))}\n <div className=\"eds-mi-matrix__cell eds-mi-matrix__cell--head\">\n Label only\n </div>\n {MI_STATES.map((s) => (\n <div key={`only-${s}`} className=\"eds-mi-matrix__cell\">\n <MenuItem\n label=\"Settings\"\n state={s}\n leadingIcon={false}\n trailingText={false}\n />\n </div>\n ))}\n </div>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * MenuTrigger — React port of Embleema Design System 2.0's\n * Navigation/Menu/Trigger component set (Figma node 5104:70).\n *\n * The clickable button that opens a Navigation/Menu/Dropdown. 20 px leading\n * icon (Icon/People/User by default), label, and a chevron that points down\n * by default and rotates 180° on the Open state.\n *\n * Color mapping (semantic tokens from embleema-design-system.md):\n * Default : transparent + Text/Primary label\n * Hover : Background/Selected + Text/Primary label\n * Focus : Background/Selected + 4 px Border/FocusRing outline + Text/Primary label\n * Open : Background/Selected + Text/Primary label + chevron rotated 180°\n *\n * Geometry:\n * - Padding: 8 / 12\n * - Gap: 8\n * - Corner radius: 4 (Radius/s)\n * - Leading icon: 20 × 20\n * - Chevron: 20 × 20 (CSS-rotated on Open, same Icon/Navigation/Dropdown asset)\n */\n\nimport * as React from \"react\";\n\nexport type MenuTriggerState = \"Default\" | \"Hover\" | \"Focus\" | \"Open\";\n\nexport type MenuTriggerProps = {\n label: string;\n state?: MenuTriggerState;\n /** true → default person glyph; false → no icon; ReactNode → custom. */\n leadingIcon?: boolean | React.ReactNode;\n onClick?: () => void;\n id?: string;\n className?: string;\n \"aria-controls\"?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n --mt-text-primary: #0E0E0E;\n --mt-background-selected: #E3ECFF;\n --mt-border-focus-ring: #A2BDF5;\n}\n\n.eds-mt {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n border-radius: 4px;\n border: 0;\n background: transparent;\n color: var(--mt-text-primary);\n font-family: Nunito, sans-serif;\n cursor: pointer;\n text-align: left;\n outline: 0;\n position: relative;\n transition: background-color 100ms ease-out;\n}\n\n/* Hover — real :hover OR forced data-state=\"Hover\". */\n.eds-mt:hover,\n.eds-mt[data-state=\"Hover\"] {\n background: var(--mt-background-selected);\n}\n\n/* Focus — Background/Selected fill + 4 px Border/FocusRing outline. Real\n keyboard focus and the forced state share the rule. */\n.eds-mt:focus-visible,\n.eds-mt[data-state=\"Focus\"] {\n background: var(--mt-background-selected);\n outline: 4px solid var(--mt-border-focus-ring);\n outline-offset: -4px;\n}\n\n/* Open — same fill, no outline. The chevron rotation is handled below. */\n.eds-mt[data-state=\"Open\"] {\n background: var(--mt-background-selected);\n}\n\n/* Leading icon slot */\n.eds-mt__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n color: inherit;\n}\n.eds-mt__icon svg { display: block; width: 20px; height: 20px; }\n\n/* Label */\n.eds-mt__label {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.5;\n color: inherit;\n white-space: nowrap;\n}\n\n/* Chevron — Icon/Navigation/Dropdown rendered at 12 × 12 to match the\n compact size used in WebTopNav. Rotates 180° on Open per the Figma spec;\n transition is smooth so the affordance reads as a single icon flipping\n rather than swapping. */\n.eds-mt__chevron {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 12px;\n height: 12px;\n flex-shrink: 0;\n color: inherit;\n transition: transform 160ms ease-out;\n}\n.eds-mt__chevron svg { display: block; width: 12px; height: 12px; }\n.eds-mt[data-state=\"Open\"] .eds-mt__chevron {\n transform: rotate(180deg);\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-mt-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-mt-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-mt-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-mt-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-mt-matrix__controls {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: center;\n}\n.eds-mt-matrix__chip {\n padding: 6px 14px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n transition: background-color 120ms;\n}\n.eds-mt-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-mt-matrix__chip[data-active=\"true\"] {\n background: #306AE8;\n color: #FEFEFE;\n border-color: #306AE8;\n}\n.eds-mt-matrix__toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #0E0E0E;\n}\n.eds-mt-matrix__toggle input { accent-color: #306AE8; }\n.eds-mt-matrix__stage {\n padding: 32px;\n background: #F8F8F8;\n border-radius: 8px;\n display: flex;\n flex-wrap: wrap;\n gap: 32px;\n align-items: center;\n justify-content: flex-start;\n}\n.eds-mt-matrix__cluster {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n.eds-mt-matrix__cluster-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-menu-trigger]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-menu-trigger\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — verbatim from Figma:\n// PersonIcon : Icon/People/User (node 4052:3387)\n// ChevronIcon : Icon/Navigation/Dropdown (node 4052:3068)\n// ---------------------------------------------------------------------------\nfunction PersonIcon() {\n return (\n <svg\n viewBox=\"0 0 20 18.0544\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n preserveAspectRatio=\"xMidYMid meet\"\n aria-hidden\n >\n <path\n fill=\"currentColor\"\n d=\"M10 8.64706C8.71667 8.64706 7.61811 8.22376 6.70433 7.37718C5.79033 6.53038 5.33333 5.5125 5.33333 4.32353C5.33333 3.13456 5.79033 2.11678 6.70433 1.27019C7.61811 0.423397 8.71667 0 10 0C11.2833 0 12.3819 0.423397 13.2957 1.27019C14.2097 2.11678 14.6667 3.13456 14.6667 4.32353C14.6667 5.5125 14.2097 6.53038 13.2957 7.37718C12.3819 8.22376 11.2833 8.64706 10 8.64706ZM0 16.1777V15.3081C0 14.7032 0.177334 14.143 0.532 13.6275C0.886667 13.1119 1.36067 12.7156 1.954 12.4385C3.27178 11.84 4.60122 11.3911 5.94233 11.0917C7.28344 10.7924 8.636 10.6427 10 10.6427C11.364 10.6427 12.7166 10.7924 14.0577 11.0917C15.3988 11.3911 16.7282 11.84 18.046 12.4385C18.6393 12.7156 19.1133 13.1119 19.468 13.6275C19.8227 14.143 20 14.7032 20 15.3081V16.1777C20 16.6986 19.803 17.1417 19.409 17.5069C19.015 17.8719 18.5368 18.0544 17.9743 18.0544H2.02567C1.46322 18.0544 0.985 17.8719 0.591 17.5069C0.197 17.1417 0 16.6986 0 16.1777ZM2 16.2015H18V15.3081C18 15.0579 17.9218 14.8263 17.7653 14.6132C17.6089 14.4003 17.3966 14.2266 17.1283 14.0919C15.9794 13.5677 14.8081 13.1706 13.6143 12.9005C12.4203 12.6306 11.2156 12.4956 10 12.4956C8.78444 12.4956 7.57967 12.6306 6.38567 12.9005C5.19189 13.1706 4.02056 13.5677 2.87167 14.0919C2.60344 14.2266 2.39111 14.4003 2.23467 14.6132C2.07822 14.8263 2 15.0579 2 15.3081V16.2015ZM10 6.79412C10.7333 6.79412 11.3611 6.5522 11.8833 6.06838C12.4056 5.58456 12.6667 5.00294 12.6667 4.32353C12.6667 3.64412 12.4056 3.0625 11.8833 2.57868C11.3611 2.09485 10.7333 1.85294 10 1.85294C9.26667 1.85294 8.63889 2.09485 8.11667 2.57868C7.59444 3.0625 7.33333 3.64412 7.33333 4.32353C7.33333 5.00294 7.59444 5.58456 8.11667 6.06838C8.63889 6.5522 9.26667 6.79412 10 6.79412Z\"\n />\n </svg>\n );\n}\n\nfunction ChevronIcon() {\n return (\n <svg\n viewBox=\"0 0 12.7745 7\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n preserveAspectRatio=\"xMidYMid meet\"\n aria-hidden\n >\n <path\n fill=\"currentColor\"\n d=\"M5.57468 6.64642L0.23713 1.3093C0.163733 1.23562 0.105862 1.15333 0.063517 1.06243C0.0211723 0.971812 0 0.874559 0 0.770674C0 0.563185 0.0701511 0.382795 0.210453 0.229507C0.350755 0.076502 0.535661 0 0.765169 0H12.0094C12.2389 0 12.4238 0.0773488 12.5641 0.232048C12.7044 0.386465 12.7745 0.566713 12.7745 0.772791C12.7745 0.824451 12.6954 1.00329 12.537 1.3093L7.19987 6.64642C7.07735 6.76922 6.9506 6.85885 6.81961 6.91531C6.68862 6.97177 6.54451 7 6.38727 7C6.23003 7 6.08592 6.97177 5.95493 6.91531C5.82395 6.85885 5.69719 6.76922 5.57468 6.64642Z\"\n />\n </svg>\n );\n}\n\nfunction renderLeading(value: MenuTriggerProps[\"leadingIcon\"]): React.ReactNode {\n if (value === false || value === null || value === undefined) return null;\n if (value === true) {\n return (\n <span className=\"eds-mt__icon\" aria-hidden>\n <PersonIcon />\n </span>\n );\n }\n return (\n <span className=\"eds-mt__icon\" aria-hidden>\n {value}\n </span>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const MenuTrigger = React.forwardRef<HTMLButtonElement, MenuTriggerProps>(\n function MenuTrigger(\n {\n label,\n state = \"Default\",\n leadingIcon = true,\n onClick,\n id,\n className,\n \"aria-controls\": ariaControls,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isOpen = state === \"Open\";\n const wrapperClass = \"eds-mt\" + (className ? ` ${className}` : \"\");\n\n return (\n <button\n ref={ref}\n type=\"button\"\n id={id}\n className={wrapperClass}\n data-state={state}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n aria-controls={ariaControls}\n aria-label={ariaLabel}\n onClick={onClick}\n >\n {renderLeading(leadingIcon)}\n <span className=\"eds-mt__label\">{label}</span>\n <span className=\"eds-mt__chevron\" aria-hidden>\n <ChevronIcon />\n </span>\n </button>\n );\n }\n);\n\nexport default MenuTrigger;\n\n// ---------------------------------------------------------------------------\n// MenuTriggerMatrix — interactive showcase. The first row is fully\n// interactive — clicking the trigger toggles between Default and Open so the\n// chevron rotation animates live.\n// ---------------------------------------------------------------------------\nconst MT_STATES: MenuTriggerState[] = [\"Default\", \"Hover\", \"Focus\", \"Open\"];\n\nexport function MenuTriggerMatrix() {\n ensureStyles();\n const [state, setState] = React.useState<MenuTriggerState>(\"Default\");\n const [leadingIcon, setLeadingIcon] = React.useState(true);\n const [labelText, setLabelText] = React.useState(\"Username\");\n const [liveOpen, setLiveOpen] = React.useState(false);\n\n return (\n <div className=\"eds-mt-matrix\">\n <section className=\"eds-mt-matrix__section\">\n <h3 className=\"eds-mt-matrix__heading\">Interactive · live trigger</h3>\n <p className=\"eds-mt-matrix__sub\">\n Click the trigger below to toggle between Default and Open — the\n chevron rotates 180° via a 160 ms transform transition.\n </p>\n <div className=\"eds-mt-matrix__stage\">\n <MenuTrigger\n label=\"Account\"\n state={liveOpen ? \"Open\" : \"Default\"}\n onClick={() => setLiveOpen((v) => !v)}\n />\n </div>\n </section>\n\n <section className=\"eds-mt-matrix__section\">\n <h3 className=\"eds-mt-matrix__heading\">Forced state · single trigger</h3>\n <p className=\"eds-mt-matrix__sub\">\n Pick a state and toggle the LeadingIcon to inspect each variant.\n </p>\n <div className=\"eds-mt-matrix__controls\" aria-label=\"State\">\n {MT_STATES.map((s) => (\n <button\n key={s}\n type=\"button\"\n className=\"eds-mt-matrix__chip\"\n data-active={state === s || undefined}\n onClick={() => setState(s)}\n >\n {s}\n </button>\n ))}\n </div>\n <div className=\"eds-mt-matrix__controls\">\n <label className=\"eds-mt-matrix__toggle\">\n <input\n type=\"checkbox\"\n checked={leadingIcon}\n onChange={(e) => setLeadingIcon(e.target.checked)}\n />\n LeadingIcon\n </label>\n <label className=\"eds-mt-matrix__toggle\">\n Label:&nbsp;\n <input\n type=\"text\"\n value={labelText}\n onChange={(e) => setLabelText(e.target.value)}\n style={{\n fontFamily: \"Nunito, sans-serif\",\n fontSize: 13,\n padding: \"4px 8px\",\n border: \"1px solid #DDDDDD\",\n borderRadius: 4,\n width: 160,\n }}\n />\n </label>\n </div>\n <div className=\"eds-mt-matrix__stage\">\n <MenuTrigger\n label={labelText}\n state={state}\n leadingIcon={leadingIcon}\n />\n </div>\n </section>\n\n <section className=\"eds-mt-matrix__section\">\n <h3 className=\"eds-mt-matrix__heading\">All states (static)</h3>\n <p className=\"eds-mt-matrix__sub\">\n Every state rendered side by side with the default User icon for\n visual QA.\n </p>\n <div className=\"eds-mt-matrix__stage\">\n {MT_STATES.map((s) => (\n <div key={s} className=\"eds-mt-matrix__cluster\">\n <span className=\"eds-mt-matrix__cluster-label\">{s}</span>\n <MenuTrigger label=\"Username\" state={s} />\n </div>\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * MenuDropdown — React port of Embleema Design System 2.0's\n * Navigation/Menu/Dropdown component (Figma node 5125:7).\n *\n * The panel container that hosts a column of Navigation/Menu/Item rows. Opens\n * below a Navigation/Menu/Trigger. The component renders only the panel —\n * popover positioning, click-outside, and Escape-to-close live in the parent\n * (see the matrix demo below for a complete trigger + dropdown wiring).\n *\n * Panel styling (semantic tokens from embleema-design-system.md):\n * - Background : Background/Default (#FEFEFE)\n * - Corner radius : Radius/m (8 px)\n * - Shadow : Elevation/300 (0 4 12 rgba(0,0,0,0.12))\n * - Padding : 8 px vertical, 0 horizontal\n * - Min-width : 200 px (hugs the longest MenuItem label otherwise)\n */\n\nimport * as React from \"react\";\nimport { MenuItem, type MenuItemState } from \"./MenuItem\";\nimport { MenuTrigger, type MenuTriggerState } from \"./MenuTrigger\";\n\nexport type MenuDropdownItem = {\n /** Stable id used as the active key + onItemClick payload. */\n value: string;\n label: string;\n /** Controls the leading icon slot on the MenuItem row. */\n leadingIcon?: boolean | React.ReactNode;\n /** When true, the row renders the trailing slot with `shortcut`. */\n trailingText?: boolean;\n shortcut?: string;\n disabled?: boolean;\n};\n\nexport type MenuDropdownProps = {\n items: MenuDropdownItem[];\n /** Currently selected value — controls which row gets the Active state. */\n activeValue?: string;\n onItemClick?: (value: string) => void;\n /** Optional override of the min panel width (200 px per Figma default). */\n minWidth?: number;\n id?: string;\n className?: string;\n /** Forwarded to the panel for ARIA association with a MenuTrigger. */\n \"aria-labelledby\"?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n:root {\n --md-background-default: #FEFEFE;\n}\n\n.eds-md {\n display: inline-flex;\n flex-direction: column;\n align-items: stretch;\n background: var(--md-background-default);\n border-radius: 8px;\n box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12);\n padding: 8px 0;\n overflow: hidden;\n font-family: Nunito, sans-serif;\n min-width: 200px;\n}\n\n/* When children are real MenuItem buttons, stretch them edge-to-edge inside\n the panel — they're 240 px wide by default and stretch via the panel's\n min-width when the panel grows. */\n.eds-md > button.eds-mi { width: 100%; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-menu-dropdown]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-menu-dropdown\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const MenuDropdown = React.forwardRef<HTMLDivElement, MenuDropdownProps>(\n function MenuDropdown(\n {\n items,\n activeValue,\n onItemClick,\n minWidth,\n id,\n className,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-md\" + (className ? ` ${className}` : \"\");\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n role=\"menu\"\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n style={minWidth ? { minWidth } : undefined}\n >\n {items.map((item) => {\n const isActive = item.value === activeValue;\n const state: MenuItemState = item.disabled\n ? \"Disabled\"\n : isActive\n ? \"Active\"\n : \"Default\";\n return (\n <MenuItem\n key={item.value}\n label={item.label}\n state={state}\n leadingIcon={item.leadingIcon ?? true}\n trailingText={item.trailingText ?? Boolean(item.shortcut)}\n shortcut={item.shortcut}\n onClick={() => onItemClick?.(item.value)}\n />\n );\n })}\n </div>\n );\n }\n);\n\nexport default MenuDropdown;\n\n// ---------------------------------------------------------------------------\n// Demo stylesheet — only loaded by the matrix below.\n// ---------------------------------------------------------------------------\nconst demoStyles = `\n.eds-md-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-md-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-md-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-md-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-md-matrix__stage {\n padding: 64px 24px;\n background: #F8F8F8;\n border-radius: 8px;\n display: flex;\n justify-content: center;\n /* flex-start so the inline popover wrapper hugs the trigger's height\n instead of stretching to the stage's min-height. Without this the\n panel's position: absolute; top: 100% anchors to the stage's bottom\n edge rather than the trigger. */\n align-items: flex-start;\n min-height: 320px;\n}\n.eds-md-matrix__popover {\n position: relative;\n display: inline-flex;\n flex-direction: column;\n align-items: stretch;\n}\n.eds-md-matrix__panel {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n z-index: 10;\n}\n.eds-md-matrix__readout {\n font-size: 12px;\n color: #5E5E5E;\n text-align: center;\n margin: 12px 0 0;\n}\n`;\n\nfunction ensureDemoStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-menu-dropdown-demo]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-menu-dropdown-demo\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== demoStyles) el.textContent = demoStyles;\n}\n\n// ---------------------------------------------------------------------------\n// MenuDropdownMatrix — interactive demo combining all three Menu components.\n//\n// Behavior:\n// - Clicking the MenuTrigger toggles the dropdown open/closed and rotates\n// the chevron via the Trigger's Open state.\n// - Clicking a MenuItem inside the dropdown sets that item as the Active\n// value and closes the panel.\n// - Pressing Escape closes the dropdown.\n// - Clicking anywhere outside the popover closes the dropdown.\n// ---------------------------------------------------------------------------\nconst DEMO_ITEMS: MenuDropdownItem[] = [\n { value: \"dashboard\", label: \"Dashboard\" },\n { value: \"settings\", label: \"Settings\" },\n { value: \"profile\", label: \"Profile\" },\n { value: \"logout\", label: \"Log Out\" },\n];\n\n/**\n * MenuComposedDemo — the interactive popover demo combining MenuTrigger,\n * MenuDropdown, and MenuItem. Exported separately so it can be reused on\n * pages that aggregate the whole Menu family (e.g. the consolidated \"Menu\"\n * page) without duplicating the popover logic.\n */\nexport function MenuComposedDemo() {\n ensureStyles();\n ensureDemoStyles();\n\n const [open, setOpen] = React.useState(false);\n const [active, setActive] = React.useState<string>(\"dashboard\");\n const [triggerHover, setTriggerHover] = React.useState(false);\n\n const popoverRef = React.useRef<HTMLDivElement | null>(null);\n\n // Close on outside click.\n React.useEffect(() => {\n if (!open) return;\n const onDocClick = (e: MouseEvent) => {\n const root = popoverRef.current;\n if (!root) return;\n if (!root.contains(e.target as Node)) setOpen(false);\n };\n document.addEventListener(\"mousedown\", onDocClick);\n return () => document.removeEventListener(\"mousedown\", onDocClick);\n }, [open]);\n\n // Close on Escape.\n React.useEffect(() => {\n if (!open) return;\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [open]);\n\n // Trigger state reflects open + hover. Hover only paints when the panel\n // is closed so it doesn't fight the Open chrome.\n const triggerState: MenuTriggerState = open\n ? \"Open\"\n : triggerHover\n ? \"Hover\"\n : \"Default\";\n\n const activeLabel = DEMO_ITEMS.find((i) => i.value === active)?.label ?? \"—\";\n\n return (\n <section className=\"eds-md-matrix__section\">\n <h3 className=\"eds-md-matrix__heading\">Interactive · all three Menu components</h3>\n <p className=\"eds-md-matrix__sub\">\n Click the trigger to toggle the dropdown. Picking an item closes\n the panel and marks the row Active. Clicking outside the popover\n or pressing Escape also closes it. The chevron rotates 180° on\n Open via a 160 ms transform transition.\n </p>\n <div className=\"eds-md-matrix__stage\">\n <div\n ref={popoverRef}\n className=\"eds-md-matrix__popover\"\n onMouseEnter={() => setTriggerHover(true)}\n onMouseLeave={() => setTriggerHover(false)}\n >\n <MenuTrigger\n id=\"menu-demo-trigger\"\n label=\"Account\"\n state={triggerState}\n aria-controls=\"menu-demo-panel\"\n onClick={() => setOpen((v) => !v)}\n />\n {open && (\n <div className=\"eds-md-matrix__panel\">\n <MenuDropdown\n id=\"menu-demo-panel\"\n aria-labelledby=\"menu-demo-trigger\"\n items={DEMO_ITEMS}\n activeValue={active}\n onItemClick={(value) => {\n setActive(value);\n setOpen(false);\n }}\n />\n </div>\n )}\n </div>\n </div>\n <p className=\"eds-md-matrix__readout\">\n State: <strong>{open ? \"Open\" : \"Closed\"}</strong>\n {\" · \"}Active item: <strong>{activeLabel}</strong>\n </p>\n </section>\n );\n}\n\nexport function MenuDropdownMatrix() {\n ensureStyles();\n ensureDemoStyles();\n\n return (\n <div className=\"eds-md-matrix\">\n <MenuComposedDemo />\n\n <section className=\"eds-md-matrix__section\">\n <h3 className=\"eds-md-matrix__heading\">Dropdown panel · static</h3>\n <p className=\"eds-md-matrix__sub\">\n The panel rendered on its own (without the trigger) so the\n Background/Default fill, 8 px radius, and Elevation/300 shadow are\n easy to inspect. Shipping default has Dashboard Active.\n </p>\n <div className=\"eds-md-matrix__stage\">\n <MenuDropdown\n items={DEMO_ITEMS}\n activeValue=\"dashboard\"\n onItemClick={() => {\n /* no-op in matrix */\n }}\n />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Modals — React ports of Embleema Design System 2.0's Layout modal family:\n * - Modal (Figma node 5036:86) — feedback modal with Success /\n * Warning / Error types\n * - ModalNavigation (Figma node 5040:111) — native onboarding card with\n * General / Medications / Labs /\n * CareTeam types\n * - ModalSurvey (Figma node 5038:7) — survey modal with prompt, slot\n * for options, and optional\n * free-text response area\n *\n * All three accept an `inline` prop. When `inline` is set, the modal renders\n * as a static panel (no Scrim, no Overlay) — useful for design-system pages\n * that want to display every variant side by side. When `inline` is omitted,\n * the modal renders inside a Scrim overlay with click-to-dismiss + Escape.\n *\n * Color tokens used (per embleema-design-system.md):\n * - Background/Default #FEFEFE\n * - Background/Primary #F8F8F8\n * - Background/Field #F8F8F8\n * - Text/Primary #0E0E0E\n * - Text/Secondary #5E5E5E\n * - Text/Placeholder #848484\n * - Text/Inverse #FEFEFE\n * - Action/Primary/Background #306AE8\n * - Action/Primary/Text #FEFEFE\n * - Feedback/Success/Indicator #32A032\n * - Feedback/Warning/Indicator #FA6400\n * - Feedback/Error/Text #B31A1A\n * - Purple/400 (ModalNav border) #644AD4\n * - AI/Light (Survey textarea) #90B3FF\n */\n\nimport * as React from \"react\";\n\n// ===========================================================================\n// Inline icons\n// ===========================================================================\nfunction CloseIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M6 6l12 12M18 6L6 18\" stroke=\"currentColor\" strokeWidth=\"1.8\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\nfunction PlusIcon() {\n return (\n <svg viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M9 3v12M3 9h12\" stroke=\"currentColor\" strokeWidth=\"1.8\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\n// Icon/Status/Check — circular check used for Success modals.\nfunction CheckCircleIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 5)\">\n <path\n fill=\"currentColor\"\n d=\"M6.72489 11.8595L18.2793 0.305087C18.4781 0.106016 18.7108 0.00436262 18.9774 0.000127067C19.2441 -0.00410849 19.4811 0.0975446 19.6887 0.305087C19.8962 0.512629 20 0.750935 20 1.02C20 1.2893 19.8962 1.52771 19.6887 1.73525L7.57122 13.8735C7.32934 14.1151 7.04723 14.2359 6.72489 14.2359C6.40254 14.2359 6.12043 14.1151 5.87856 13.8735L0.294313 8.28922C0.0954648 8.09014 -0.00262182 7.85384 5.32649e-05 7.58032C0.00250543 7.30701 0.107502 7.06659 0.315045 6.85905C0.522587 6.6515 0.760892 6.54773 1.02996 6.54773C1.29925 6.54773 1.53767 6.6515 1.74521 6.85905L6.72489 11.8595Z\"\n />\n </g>\n </svg>\n );\n}\n\n// Icon/Status/Alert — Warning glyph.\nfunction AlertIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2)\">\n <path\n fill=\"currentColor\"\n d=\"M10 14.9797C10.2409 14.9797 10.4428 14.8982 10.6058 14.7353C10.7688 14.5723 10.8503 14.3704 10.8503 14.1295C10.8503 13.8886 10.7688 13.6867 10.6058 13.5237C10.4428 13.3609 10.2409 13.2795 10 13.2795C9.75912 13.2795 9.55719 13.3609 9.39421 13.5237C9.23123 13.6867 9.14974 13.8886 9.14974 14.1295C9.14974 14.3704 9.23123 14.5723 9.39421 14.7353C9.55719 14.8982 9.75912 14.9797 10 14.9797ZM10.0003 11.1337C10.2241 11.1337 10.4116 11.058 10.5626 10.9066C10.7139 10.7554 10.7895 10.5679 10.7895 10.3442V5.60737C10.7895 5.38368 10.7138 5.19614 10.5624 5.04474C10.411 4.89351 10.2234 4.8179 9.99974 4.8179C9.77588 4.8179 9.58842 4.89351 9.43737 5.04474C9.28614 5.19614 9.21053 5.38368 9.21053 5.60737V10.3442C9.21053 10.5679 9.28623 10.7554 9.43763 10.9066C9.58904 11.058 9.77658 11.1337 10.0003 11.1337ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\n// Icon/Action/CloseCircle — Error glyph.\nfunction CloseCircleIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10 11.1092L13.2347 14.3442C13.3805 14.4898 13.5638 14.5644 13.7845 14.5679C14.005 14.5712 14.1916 14.4967 14.3442 14.3442C14.4967 14.1916 14.5729 14.0067 14.5729 13.7895C14.5729 13.5723 14.4967 13.3874 14.3442 13.2347L11.1092 10L14.3442 6.76526C14.4898 6.61947 14.5644 6.43623 14.5679 6.21553C14.5712 5.995 14.4967 5.80842 14.3442 5.65579C14.1916 5.50333 14.0067 5.4271 13.7895 5.4271C13.5723 5.4271 13.3874 5.50333 13.2347 5.65579L10 8.89079L6.76526 5.65579C6.61947 5.51018 6.43623 5.43561 6.21553 5.4321C5.995 5.42877 5.80842 5.50333 5.65579 5.65579C5.50333 5.80842 5.42711 5.99333 5.42711 6.21053C5.42711 6.42772 5.50333 6.61263 5.65579 6.76526L8.89079 10L5.65579 13.2347C5.51018 13.3805 5.43561 13.5638 5.43211 13.7845C5.42877 14.005 5.50333 14.1916 5.65579 14.3442C5.80842 14.4967 5.99333 14.5729 6.21053 14.5729C6.42772 14.5729 6.61263 14.4967 6.76526 14.3442L10 11.1092ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\n// Small info glyph used in the Modal Survey label tooltip slot.\nfunction InfoIcon() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <circle cx=\"8\" cy=\"8\" r=\"7\" stroke=\"currentColor\" strokeWidth=\"1.2\" />\n <circle cx=\"8\" cy=\"5.4\" r=\"0.8\" fill=\"currentColor\" />\n <path d=\"M8 7.6v3.5\" stroke=\"currentColor\" strokeWidth=\"1.4\" strokeLinecap=\"round\" />\n </svg>\n );\n}\n\n// ===========================================================================\n// Stylesheet\n// ===========================================================================\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700&display=swap\");\n\n:root {\n --modal-background-default: #FEFEFE;\n --modal-background-primary: #F8F8F8;\n --modal-background-field: #F8F8F8;\n --modal-text-primary: #0E0E0E;\n --modal-text-secondary: #5E5E5E;\n --modal-text-placeholder: #848484;\n --modal-text-inverse: #FEFEFE;\n --modal-action-primary: #306AE8;\n --modal-feedback-success: #32A032;\n --modal-feedback-warning: #FA6400;\n --modal-feedback-error: #B31A1A;\n --modal-purple-400: #644AD4;\n --modal-ai-light: #90B3FF;\n}\n\n/* ---------------- Scrim ---------------- */\n.eds-scrim {\n position: fixed;\n inset: 0;\n background: rgba(14, 14, 14, 0.32);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n animation: eds-scrim-in 120ms ease-out;\n}\n@keyframes eds-scrim-in {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n/* ---------------- Modal (feedback) ---------------- */\n.eds-modal {\n width: 750px;\n max-width: 100%;\n box-sizing: border-box;\n background: var(--modal-background-default);\n border-radius: 20px;\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n padding: 24px 24px 32px;\n display: flex;\n flex-direction: column;\n align-items: center;\n font-family: Nunito, sans-serif;\n color: var(--modal-text-primary);\n}\n.eds-modal--overlay { animation: eds-modal-in 160ms ease-out; }\n@keyframes eds-modal-in {\n from { opacity: 0; transform: translateY(8px) scale(0.98); }\n to { opacity: 1; transform: translateY(0) scale(1); }\n}\n.eds-modal__close-row {\n display: flex;\n justify-content: flex-end;\n width: 100%;\n}\n.eds-modal__close {\n width: 24px;\n height: 24px;\n border: 0;\n background: transparent;\n padding: 0;\n cursor: pointer;\n color: var(--modal-text-primary);\n border-radius: 4px;\n}\n.eds-modal__close:hover { background: rgba(0, 0, 0, 0.05); }\n.eds-modal__close:focus-visible {\n outline: 2px solid var(--modal-action-primary);\n outline-offset: 2px;\n}\n.eds-modal__close svg { display: block; width: 100%; height: 100%; }\n\n.eds-modal__content {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 20px;\n width: 100%;\n}\n.eds-modal__status-icon {\n width: 48px;\n height: 48px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.eds-modal__status-icon svg { display: block; width: 100%; height: 100%; }\n.eds-modal[data-type=\"Success\"] .eds-modal__status-icon { color: var(--modal-feedback-success); }\n.eds-modal[data-type=\"Warning\"] .eds-modal__status-icon { color: var(--modal-feedback-warning); }\n.eds-modal[data-type=\"Error\"] .eds-modal__status-icon { color: var(--modal-feedback-error); }\n\n.eds-modal__header {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 20px;\n line-height: 28px;\n color: var(--modal-text-primary);\n text-align: center;\n}\n.eds-modal__body {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 18px;\n line-height: 1.5;\n color: var(--modal-text-primary);\n text-align: center;\n}\n\n.eds-modal__spacer { height: 40px; flex-shrink: 0; }\n\n.eds-modal__buttons {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 12px;\n width: 240px;\n}\n\n/* ---------------- Modal Navigation ---------------- */\n.eds-modal-nav {\n width: 358px;\n max-width: 100%;\n height: 240px;\n box-sizing: border-box;\n background: var(--modal-background-default);\n border: 2px solid var(--modal-purple-400);\n border-radius: 8px;\n box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);\n padding: 12px 12px 20px;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n font-family: Nunito, sans-serif;\n color: var(--modal-text-primary);\n overflow: hidden;\n}\n.eds-modal-nav--overlay { animation: eds-modal-in 160ms ease-out; }\n.eds-modal-nav__top {\n display: flex;\n flex-direction: column;\n gap: 8px;\n width: 100%;\n}\n.eds-modal-nav__close-row {\n display: flex;\n justify-content: flex-end;\n width: 100%;\n}\n.eds-modal-nav__close {\n width: 16px;\n height: 16px;\n border: 0;\n background: transparent;\n padding: 0;\n cursor: pointer;\n color: var(--modal-text-primary);\n}\n.eds-modal-nav__close svg { display: block; width: 100%; height: 100%; }\n.eds-modal-nav__title-row {\n display: flex;\n align-items: center;\n gap: 16px;\n width: 100%;\n}\n.eds-modal-nav__feature-icon {\n width: 56px;\n height: 56px;\n flex-shrink: 0;\n background: var(--modal-background-primary);\n border-radius: 4px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 10px;\n color: var(--modal-text-placeholder);\n text-align: center;\n padding: 4px;\n box-sizing: border-box;\n}\n.eds-modal-nav__title {\n flex: 1 1 0;\n min-width: 0;\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 20px;\n line-height: 1.3;\n color: var(--modal-text-primary);\n}\n.eds-modal-nav__body {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 18px;\n line-height: 1.5;\n color: var(--modal-text-secondary);\n}\n.eds-modal-nav__buttons {\n display: flex;\n align-items: stretch;\n gap: 16px;\n width: 100%;\n}\n.eds-modal-nav__buttons .eds-modal__btn--primary { flex: 1 1 0; }\n\n/* ---------------- Modal Survey ---------------- */\n.eds-modal-survey {\n width: 750px;\n max-width: 100%;\n box-sizing: border-box;\n background: var(--modal-background-default);\n border-radius: 20px;\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n padding: 24px 24px 32px;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 20px;\n font-family: Nunito, sans-serif;\n color: var(--modal-text-primary);\n overflow: hidden;\n}\n.eds-modal-survey--overlay { animation: eds-modal-in 160ms ease-out; }\n.eds-modal-survey__close-row {\n display: flex;\n justify-content: flex-end;\n width: 100%;\n}\n.eds-modal-survey__text {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n width: 100%;\n}\n.eds-modal-survey__header {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 20px;\n line-height: 28px;\n color: var(--modal-text-primary);\n width: 100%;\n}\n.eds-modal-survey__body {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 18px;\n line-height: 1.5;\n color: var(--modal-text-secondary);\n width: 100%;\n}\n.eds-modal-survey__content {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 16px;\n width: 100%;\n}\n.eds-modal-survey__prompt {\n margin: 0;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 18px;\n line-height: 1.5;\n color: var(--modal-text-primary);\n}\n.eds-modal-survey__options {\n min-height: 100px;\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.eds-modal-survey__option {\n display: inline-flex;\n align-items: center;\n gap: 12px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--modal-text-primary);\n}\n.eds-modal-survey__option input { accent-color: var(--modal-action-primary); }\n.eds-modal-survey__textarea-wrap {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 4px;\n width: 100%;\n}\n.eds-modal-survey__label {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--modal-text-primary);\n}\n.eds-modal-survey__label-info {\n width: 16px;\n height: 16px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--modal-action-primary);\n}\n.eds-modal-survey__label-info svg { display: block; width: 100%; height: 100%; }\n.eds-modal-survey__textarea {\n width: 100%;\n min-height: 120px;\n padding: 12px;\n border-radius: 4px;\n border: 1px solid var(--modal-ai-light);\n background: var(--modal-background-field);\n box-shadow: 0 0 3px rgba(100, 74, 212, 0.5);\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--modal-text-primary);\n resize: vertical;\n box-sizing: border-box;\n}\n.eds-modal-survey__textarea::placeholder { color: var(--modal-text-placeholder); }\n.eds-modal-survey__textarea:focus { outline: none; border-color: var(--modal-action-primary); }\n.eds-modal-survey__buttons {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 12px;\n width: 100%;\n}\n.eds-modal-survey__buttons .eds-modal__btn { width: 100px; }\n\n/* ---------------- Shared button styles ---------------- */\n.eds-modal__btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n padding: 10px 20px;\n border-radius: 8px;\n border: 0;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 16px;\n line-height: 1.2;\n transition: background-color 100ms ease-out;\n white-space: nowrap;\n}\n.eds-modal__btn:focus-visible {\n outline: 2px solid var(--modal-action-primary);\n outline-offset: 2px;\n}\n.eds-modal__btn svg { width: 18px; height: 18px; display: block; }\n\n.eds-modal__btn--primary {\n background: var(--modal-action-primary);\n color: var(--modal-text-inverse);\n filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.08));\n}\n.eds-modal__btn--primary:hover { background: #5083e8; }\n\n.eds-modal__btn--secondary {\n background: transparent;\n color: var(--modal-action-primary);\n border: 1px solid var(--modal-action-primary);\n}\n.eds-modal__btn--secondary:hover { background: rgba(48, 106, 232, 0.06); }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-modals-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-modals-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-modals-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-modals-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-modals-matrix__row {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: 24px;\n padding: 8px 0;\n}\n.eds-modals-matrix__variant-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0 0 8px;\n}\n.eds-modals-matrix__variant {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-modals]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-modals\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ===========================================================================\n// Shared overlay primitive — only used when `inline` is false.\n// ===========================================================================\ntype OverlayProps = {\n open: boolean;\n onClose?: () => void;\n children: React.ReactNode;\n};\n\nfunction Overlay({ open, onClose, children }: OverlayProps) {\n React.useEffect(() => {\n if (!open) return;\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") onClose?.();\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [open, onClose]);\n\n if (!open) return null;\n return (\n <div\n className=\"eds-scrim\"\n role=\"presentation\"\n onClick={(e) => {\n if (e.target === e.currentTarget) onClose?.();\n }}\n >\n {children}\n </div>\n );\n}\n\n// ===========================================================================\n// Modal (feedback)\n// ===========================================================================\nexport type ModalType = \"Success\" | \"Warning\" | \"Error\";\n\nexport type ModalProps = {\n type?: ModalType;\n header: string;\n body: string;\n primaryLabel?: string;\n onPrimaryClick?: () => void;\n secondaryLabel?: string;\n onSecondaryClick?: () => void;\n closeButton?: boolean;\n secondaryButton?: boolean;\n /** When true, render the panel inline (no Scrim, ignores open/onClose). */\n inline?: boolean;\n /** Only used when inline is false. */\n open?: boolean;\n onClose?: () => void;\n id?: string;\n};\n\nconst STATUS_ICON: Record<ModalType, React.ReactNode> = {\n Success: <CheckCircleIcon />,\n Warning: <AlertIcon />,\n Error: <CloseCircleIcon />,\n};\n\nfunction ModalPanel({\n type = \"Success\",\n header,\n body,\n primaryLabel = \"Confirm\",\n onPrimaryClick,\n secondaryLabel = \"Cancel\",\n onSecondaryClick,\n closeButton = true,\n secondaryButton = true,\n onClose,\n id,\n className,\n}: ModalProps & { className?: string }) {\n const baseId = id ?? \"eds-modal\";\n const headerId = `${baseId}-header`;\n const bodyId = `${baseId}-body`;\n\n return (\n <div\n id={baseId}\n className={\"eds-modal\" + (className ? ` ${className}` : \"\")}\n data-type={type}\n role=\"alertdialog\"\n aria-modal=\"true\"\n aria-labelledby={headerId}\n aria-describedby={bodyId}\n >\n {closeButton && (\n <div className=\"eds-modal__close-row\">\n <button\n type=\"button\"\n className=\"eds-modal__close\"\n onClick={onClose}\n aria-label=\"Close dialog\"\n >\n <CloseIcon />\n </button>\n </div>\n )}\n <div className=\"eds-modal__content\">\n <span className=\"eds-modal__status-icon\" aria-hidden>\n {STATUS_ICON[type]}\n </span>\n <h2 id={headerId} className=\"eds-modal__header\">{header}</h2>\n <p id={bodyId} className=\"eds-modal__body\">{body}</p>\n </div>\n <div className=\"eds-modal__spacer\" aria-hidden />\n <div className=\"eds-modal__buttons\">\n <button\n type=\"button\"\n className=\"eds-modal__btn eds-modal__btn--primary\"\n onClick={() => {\n onPrimaryClick?.();\n onClose?.();\n }}\n >\n <PlusIcon />\n <span>{primaryLabel}</span>\n </button>\n {secondaryButton && (\n <button\n type=\"button\"\n className=\"eds-modal__btn eds-modal__btn--secondary\"\n onClick={() => {\n onSecondaryClick?.();\n onClose?.();\n }}\n >\n <PlusIcon />\n <span>{secondaryLabel}</span>\n </button>\n )}\n </div>\n </div>\n );\n}\n\nexport function Modal(props: ModalProps) {\n ensureStyles();\n if (props.inline) return <ModalPanel {...props} />;\n return (\n <Overlay open={!!props.open} onClose={props.onClose}>\n <ModalPanel {...props} className=\"eds-modal--overlay\" />\n </Overlay>\n );\n}\n\n// ===========================================================================\n// ModalNavigation (native onboarding)\n// ===========================================================================\nexport type ModalNavigationType = \"General\" | \"Medications\" | \"Labs\" | \"CareTeam\";\n\nexport type ModalNavigationProps = {\n type?: ModalNavigationType;\n title: string;\n body: string;\n primaryLabel?: string;\n onPrimaryClick?: () => void;\n secondaryLabel?: string;\n onSecondaryClick?: () => void;\n closeButton?: boolean;\n secondaryButton?: boolean;\n featureIcon?: React.ReactNode;\n inline?: boolean;\n open?: boolean;\n onClose?: () => void;\n id?: string;\n};\n\nconst FEATURE_LABEL: Record<ModalNavigationType, string> = {\n General: \"general\",\n Medications: \"medications\",\n Labs: \"labs\",\n CareTeam: \"care_team\",\n};\n\nfunction ModalNavigationPanel({\n type = \"General\",\n title,\n body,\n primaryLabel = \"Get Started\",\n onPrimaryClick,\n secondaryLabel = \"Not Now\",\n onSecondaryClick,\n closeButton = true,\n secondaryButton = false,\n featureIcon,\n onClose,\n id,\n className,\n}: ModalNavigationProps & { className?: string }) {\n const baseId = id ?? \"eds-modal-nav\";\n const titleId = `${baseId}-title`;\n const bodyId = `${baseId}-body`;\n\n return (\n <div\n id={baseId}\n className={\"eds-modal-nav\" + (className ? ` ${className}` : \"\")}\n data-type={type}\n role=\"alertdialog\"\n aria-modal=\"true\"\n aria-labelledby={titleId}\n aria-describedby={bodyId}\n >\n <div className=\"eds-modal-nav__top\">\n {closeButton && (\n <div className=\"eds-modal-nav__close-row\">\n <button\n type=\"button\"\n className=\"eds-modal-nav__close\"\n onClick={onClose}\n aria-label=\"Close dialog\"\n >\n <CloseIcon />\n </button>\n </div>\n )}\n <div className=\"eds-modal-nav__title-row\">\n <span className=\"eds-modal-nav__feature-icon\" aria-hidden>\n {featureIcon ?? FEATURE_LABEL[type]}\n </span>\n <h2 id={titleId} className=\"eds-modal-nav__title\">{title}</h2>\n </div>\n </div>\n <p id={bodyId} className=\"eds-modal-nav__body\">{body}</p>\n <div className=\"eds-modal-nav__buttons\">\n <button\n type=\"button\"\n className=\"eds-modal__btn eds-modal__btn--primary\"\n onClick={() => {\n onPrimaryClick?.();\n onClose?.();\n }}\n >\n <PlusIcon />\n <span>{primaryLabel}</span>\n </button>\n {secondaryButton && (\n <button\n type=\"button\"\n className=\"eds-modal__btn eds-modal__btn--secondary\"\n style={{ width: 159 }}\n onClick={() => {\n onSecondaryClick?.();\n onClose?.();\n }}\n >\n <PlusIcon />\n <span>{secondaryLabel}</span>\n </button>\n )}\n </div>\n </div>\n );\n}\n\nexport function ModalNavigation(props: ModalNavigationProps) {\n ensureStyles();\n if (props.inline) return <ModalNavigationPanel {...props} />;\n return (\n <Overlay open={!!props.open} onClose={props.onClose}>\n <ModalNavigationPanel {...props} className=\"eds-modal-nav--overlay\" />\n </Overlay>\n );\n}\n\n// ===========================================================================\n// ModalSurvey\n// ===========================================================================\nexport type SurveyOption = { value: string; label: string };\n\nexport type ModalSurveyProps = {\n header: string;\n body: string;\n prompt?: string;\n options?: SurveyOption[];\n /** Show the free-text response textarea. */\n textInput?: boolean;\n textInputLabel?: string;\n textInputPlaceholder?: string;\n primaryLabel?: string;\n onPrimaryClick?: (selected: string[], text: string) => void;\n secondaryLabel?: string;\n onSecondaryClick?: () => void;\n closeButton?: boolean;\n secondaryButton?: boolean;\n inline?: boolean;\n open?: boolean;\n onClose?: () => void;\n id?: string;\n};\n\nfunction ModalSurveyPanel({\n header,\n body,\n prompt = \"Please provide a reason. Check all that apply:\",\n options = [],\n textInput = true,\n textInputLabel = \"Label\",\n textInputPlaceholder = \"Placeholder\",\n primaryLabel = \"Submit\",\n onPrimaryClick,\n secondaryLabel = \"Cancel\",\n onSecondaryClick,\n closeButton = true,\n secondaryButton = true,\n onClose,\n id,\n className,\n}: ModalSurveyProps & { className?: string }) {\n const baseId = id ?? \"eds-modal-survey\";\n const headerId = `${baseId}-header`;\n const bodyId = `${baseId}-body`;\n const promptId = `${baseId}-prompt`;\n const [selected, setSelected] = React.useState<string[]>([]);\n const [text, setText] = React.useState(\"\");\n\n const toggle = (value: string) => {\n setSelected((prev) =>\n prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value]\n );\n };\n\n return (\n <div\n id={baseId}\n className={\"eds-modal-survey\" + (className ? ` ${className}` : \"\")}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={headerId}\n aria-describedby={bodyId}\n >\n {closeButton && (\n <div className=\"eds-modal-survey__close-row\">\n <button\n type=\"button\"\n className=\"eds-modal__close\"\n onClick={onClose}\n aria-label=\"Close dialog\"\n >\n <CloseIcon />\n </button>\n </div>\n )}\n <div className=\"eds-modal-survey__text\">\n <h2 id={headerId} className=\"eds-modal-survey__header\">{header}</h2>\n <p id={bodyId} className=\"eds-modal-survey__body\">{body}</p>\n </div>\n <div className=\"eds-modal-survey__content\">\n <p id={promptId} className=\"eds-modal-survey__prompt\">{prompt}</p>\n <div\n className=\"eds-modal-survey__options\"\n role=\"group\"\n aria-labelledby={promptId}\n >\n {options.map((opt) => (\n <label key={opt.value} className=\"eds-modal-survey__option\">\n <input\n type=\"checkbox\"\n checked={selected.includes(opt.value)}\n onChange={() => toggle(opt.value)}\n />\n {opt.label}\n </label>\n ))}\n </div>\n {textInput && (\n <div className=\"eds-modal-survey__textarea-wrap\">\n <span className=\"eds-modal-survey__label\">\n <span className=\"eds-modal-survey__label-info\" aria-hidden>\n <InfoIcon />\n </span>\n {textInputLabel}\n </span>\n <textarea\n className=\"eds-modal-survey__textarea\"\n placeholder={textInputPlaceholder}\n value={text}\n onChange={(e) => setText(e.target.value)}\n />\n </div>\n )}\n </div>\n <div className=\"eds-modal-survey__buttons\">\n {secondaryButton && (\n <button\n type=\"button\"\n className=\"eds-modal__btn eds-modal__btn--secondary\"\n onClick={() => {\n onSecondaryClick?.();\n onClose?.();\n }}\n >\n <PlusIcon />\n <span>{secondaryLabel}</span>\n </button>\n )}\n <button\n type=\"button\"\n className=\"eds-modal__btn eds-modal__btn--primary\"\n onClick={() => {\n onPrimaryClick?.(selected, text);\n onClose?.();\n }}\n >\n <PlusIcon />\n <span>{primaryLabel}</span>\n </button>\n </div>\n </div>\n );\n}\n\nexport function ModalSurvey(props: ModalSurveyProps) {\n ensureStyles();\n if (props.inline) return <ModalSurveyPanel {...props} />;\n return (\n <Overlay open={!!props.open} onClose={props.onClose}>\n <ModalSurveyPanel {...props} className=\"eds-modal-survey--overlay\" />\n </Overlay>\n );\n}\n\n// ===========================================================================\n// ModalsMatrix — static previews of every variant.\n// ===========================================================================\nconst MODAL_TYPES: ModalType[] = [\"Success\", \"Warning\", \"Error\"];\nconst NAV_TYPES: ModalNavigationType[] = [\n \"General\",\n \"Medications\",\n \"Labs\",\n \"CareTeam\",\n];\n\nconst MODAL_COPY: Record<ModalType, { header: string; body: string }> = {\n Success: {\n header: \"Form submitted successfully\",\n body: \"Your enrollment form has been received. We'll email you a copy and the next steps within 24 hours.\",\n },\n Warning: {\n header: \"Connection unstable\",\n body: \"Some of your most recent edits may not have synced. Reconnect to the internet to confirm everything was saved.\",\n },\n Error: {\n header: \"Unable to save form\",\n body: \"Something went wrong on our end. Check your connection and try again. If the problem persists, contact support.\",\n },\n};\n\nconst NAV_COPY: Record<ModalNavigationType, { title: string; body: string }> = {\n General: {\n title: \"Your health, organized\",\n body: \"Everything you need in one place — appointments, results, medications, and study activity.\",\n },\n Medications: {\n title: \"Track every medication\",\n body: \"Log doses, set reminders, and share your medication list with your care team.\",\n },\n Labs: {\n title: \"Lab results at a glance\",\n body: \"View trends over time, get alerts when results land, and download for your records.\",\n },\n CareTeam: {\n title: \"Stay connected to your team\",\n body: \"Message your clinicians, schedule visits, and keep loved ones in the loop with shared access.\",\n },\n};\n\nconst SURVEY_OPTIONS: SurveyOption[] = [\n { value: \"not-useful\", label: \"Not useful for my care\" },\n { value: \"too-complex\", label: \"Too complex to navigate\" },\n { value: \"missing-feature\", label: \"Missing a feature I need\" },\n { value: \"switched-provider\", label: \"Switched providers\" },\n { value: \"other\", label: \"Other\" },\n];\n\nexport function ModalsMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-modals-matrix\">\n {/* -------------------------------------------------------- */}\n <section className=\"eds-modals-matrix__section\">\n <h3 className=\"eds-modals-matrix__heading\">Modal · feedback dialog (3 types)</h3>\n <p className=\"eds-modals-matrix__sub\">\n Centered layout with a status icon, header, body, and up to two\n action buttons. Type drives the status icon color (Success →\n Feedback/Success, Warning → Feedback/Warning, Error → Feedback/Error).\n </p>\n <div className=\"eds-modals-matrix__row\">\n {MODAL_TYPES.map((t) => (\n <div key={t} className=\"eds-modals-matrix__variant\">\n <p className=\"eds-modals-matrix__variant-label\">{t}</p>\n <Modal\n inline\n type={t}\n header={MODAL_COPY[t].header}\n body={MODAL_COPY[t].body}\n id={`preview-modal-${t.toLowerCase()}`}\n />\n </div>\n ))}\n </div>\n </section>\n\n {/* -------------------------------------------------------- */}\n <section className=\"eds-modals-matrix__section\">\n <h3 className=\"eds-modals-matrix__heading\">Modal Navigation · feature cards (4 types)</h3>\n <p className=\"eds-modals-matrix__sub\">\n Native-app onboarding modal pinned to a fixed 358 px width. Four\n types use the same chrome with a different placeholder feature icon.\n </p>\n <div className=\"eds-modals-matrix__row\">\n {NAV_TYPES.map((t) => (\n <div key={t} className=\"eds-modals-matrix__variant\">\n <p className=\"eds-modals-matrix__variant-label\">{t}</p>\n <ModalNavigation\n inline\n type={t}\n title={NAV_COPY[t].title}\n body={NAV_COPY[t].body}\n id={`preview-modal-nav-${t.toLowerCase()}`}\n />\n </div>\n ))}\n </div>\n </section>\n\n {/* -------------------------------------------------------- */}\n <section className=\"eds-modals-matrix__section\">\n <h3 className=\"eds-modals-matrix__heading\">Modal Survey · structured feedback</h3>\n <p className=\"eds-modals-matrix__sub\">\n Multi-select checkboxes plus an optional free-text response. Use for\n exit surveys, reason-for-action prompts, and structured feedback.\n </p>\n <div className=\"eds-modals-matrix__row\">\n <div className=\"eds-modals-matrix__variant\">\n <p className=\"eds-modals-matrix__variant-label\">With text input</p>\n <ModalSurvey\n inline\n header=\"Tell us why you're leaving\"\n body=\"Your feedback helps us improve. None of your answers are tied to your medical record.\"\n prompt=\"Please provide a reason. Check all that apply:\"\n options={SURVEY_OPTIONS}\n textInput\n textInputLabel=\"Additional comments\"\n textInputPlaceholder=\"Anything else you'd like us to know?\"\n id=\"preview-modal-survey-with-text\"\n />\n </div>\n <div className=\"eds-modals-matrix__variant\">\n <p className=\"eds-modals-matrix__variant-label\">Checkboxes only</p>\n <ModalSurvey\n inline\n header=\"Which study topics interest you?\"\n body=\"Pick any number — we'll prioritize matches when new studies open.\"\n prompt=\"Select topics:\"\n options={[\n { value: \"cardio\", label: \"Cardiovascular health\" },\n { value: \"neuro\", label: \"Neurological conditions\" },\n { value: \"onco\", label: \"Oncology\" },\n { value: \"metab\", label: \"Metabolic and endocrine\" },\n { value: \"mental\", label: \"Mental health\" },\n ]}\n textInput={false}\n id=\"preview-modal-survey-no-text\"\n />\n </div>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * NativeBottomNav — React port of Embleema Design System 2.0's\n * Navigation/BottomNav component (Figma node 5113:7) and the underlying\n * Navigation/NavItem variant set (5112:15).\n *\n * Native app bottom navigation bar with 5 fixed sections (Home, Health,\n * Studies, Tokens, Profile). Exactly one item is Active at a time; the icon\n * and label both highlight in Action/Primary/Background when Active.\n *\n * Layout (per Figma):\n * Bar:\n * - bg Background/Default\n * - shadow Elevation/100 (0 0 3 rgba(0,0,0,0.12))\n * - flex items-center justify-between\n * - padding 8 top, 24 bottom (safe-area), 24 horizontal\n * - 390 px reference width (responsive FILL in production)\n * NavItem:\n * - flex-col items-center, gap 4\n * - 24 × 24 icon\n * - 12 / 16 Nunito Bold label, text-center, color per state\n * - 44 × 44 minimum tap target (CSS padding inflates the visual 24-px\n * icon column to meet the spec)\n * Colors:\n * - Active → Action/Primary/Background (#306AE8)\n * - Inactive → Text/Placeholder (#848484)\n *\n * Accessibility (per Figma docs):\n * - role=\"navigation\" + aria-label=\"Main navigation\" on the bar\n * - role=\"tablist\" inside; role=\"tab\" on each item\n * - Active item: aria-selected=\"true\" + aria-current=\"page\"\n * - Icons aria-hidden; label carries the accessible name\n */\n\nimport * as React from \"react\";\n\nexport type NativeBottomNavValue =\n | \"home\"\n | \"health\"\n | \"studies\"\n | \"tokens\"\n | \"profile\";\n\nexport type NativeBottomNavItem = {\n value: NativeBottomNavValue;\n label: string;\n icon: React.ReactNode;\n};\n\nexport type NativeBottomNavProps = {\n /** Override the 5 default Embleema sections. */\n items?: NativeBottomNavItem[];\n /** Controlled active value. */\n value?: NativeBottomNavValue | string;\n defaultValue?: NativeBottomNavValue | string;\n onChange?: (value: string) => void;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700&display=swap\");\n\n:root {\n --nbn-background-default: #FEFEFE;\n --nbn-text-placeholder: #848484;\n --nbn-action-primary: #306AE8;\n}\n\n.eds-nbn {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 24px 24px;\n width: 390px;\n max-width: 100%;\n box-sizing: border-box;\n background: var(--nbn-background-default);\n filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.12));\n font-family: Nunito, sans-serif;\n}\n\n.eds-nbn__item {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 4px;\n /* The visual stack is 24 + 16 = ~44 px tall and ~44 px wide thanks to the\n icon + label combo; explicit min sizes guarantee the WCAG 2.5.5 target. */\n min-width: 44px;\n min-height: 44px;\n padding: 0;\n border: 0;\n background: transparent;\n cursor: pointer;\n color: var(--nbn-text-placeholder);\n text-decoration: none;\n flex-shrink: 0;\n transition: color 100ms ease-out;\n}\n.eds-nbn__item[data-active=\"true\"] {\n color: var(--nbn-action-primary);\n}\n.eds-nbn__item:focus-visible {\n outline: 2px solid var(--nbn-action-primary);\n outline-offset: 2px;\n border-radius: 4px;\n}\n\n.eds-nbn__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n color: inherit;\n}\n.eds-nbn__icon svg { display: block; width: 24px; height: 24px; }\n\n.eds-nbn__label {\n font-family: Nunito, sans-serif;\n font-weight: 700;\n font-size: 12px;\n line-height: 16px;\n color: inherit;\n text-align: center;\n white-space: nowrap;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-nbn-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-nbn-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-nbn-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-nbn-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-nbn-matrix__stage {\n display: flex;\n justify-content: center;\n padding: 32px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-nbn-matrix__phone {\n width: 390px;\n max-width: 100%;\n border-radius: 32px;\n overflow: hidden;\n background: #FEFEFE;\n box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);\n display: flex;\n flex-direction: column;\n min-height: 540px;\n}\n.eds-nbn-matrix__screen {\n flex: 1 1 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 32px 24px;\n color: #5E5E5E;\n font-family: Nunito, sans-serif;\n font-size: 14px;\n text-align: center;\n background: linear-gradient(180deg, #FEFEFE 0%, #F1F1F1 100%);\n}\n.eds-nbn-matrix__readout {\n font-size: 12px;\n color: #5E5E5E;\n text-align: center;\n margin: 12px 0 0;\n}\n.eds-nbn-matrix__states {\n display: grid;\n grid-template-columns: 100px max-content;\n gap: 16px;\n align-items: center;\n}\n.eds-nbn-matrix__states-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-native-bottom-nav]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-native-bottom-nav\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — verbatim from the design system's Icon/Navigation set:\n// Home : 4052:3146\n// Health : 5111:7\n// Studies : 5111:9\n// Tokens : 5262:9956\n// Profile : 5111:13\n// All five fills are rebound to currentColor so each item inherits the\n// Active / Inactive color set on its parent button.\n// ---------------------------------------------------------------------------\nfunction HomeIcon() {\n return (\n <svg viewBox=\"0 0 18.2457 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M1.82457 18.1754H5.89487V12.0467C5.89487 11.7353 6.00019 11.4742 6.21083 11.2634C6.42167 11.0527 6.68278 10.9474 6.99418 10.9474H11.2515C11.5629 10.9474 11.824 11.0527 12.0348 11.2634C12.2455 11.4742 12.3508 11.7353 12.3508 12.0467V18.1754H16.4211V7.41504C16.4211 7.35281 16.4074 7.29635 16.3801 7.24566C16.3529 7.19498 16.3159 7.15008 16.2691 7.11095L9.34513 1.90637C9.28269 1.85184 9.20859 1.82457 9.12284 1.82457C9.03708 1.82457 8.96299 1.85184 8.90055 1.90637L1.97661 7.11095C1.92978 7.15008 1.89279 7.19498 1.86562 7.24566C1.83825 7.29635 1.82457 7.35281 1.82457 7.41504V18.1754ZM0 18.1754V7.41504C0 7.06696 0.077848 6.73722 0.233544 6.42582C0.389444 6.11423 0.604743 5.85767 0.879442 5.65616L7.80368 0.439721C8.18785 0.146574 8.62696 0 9.12101 0C9.61507 0 10.0554 0.146574 10.442 0.439721L17.3662 5.65616C17.6409 5.85767 17.8562 6.11423 18.0121 6.42582C18.1678 6.73722 18.2457 7.06696 18.2457 7.41504V18.1754C18.2457 18.6729 18.066 19.1014 17.7065 19.4608C17.3471 19.8203 16.9186 20 16.4211 20H11.6258C11.3142 20 11.0531 19.8946 10.8425 19.6837C10.6317 19.4731 10.5262 19.212 10.5262 18.9004V12.772H7.71944V18.9004C7.71944 19.212 7.61402 19.4731 7.40318 19.6837C7.19255 19.8946 6.93143 20 6.61984 20H1.82457C1.32707 20 0.898599 19.8203 0.53916 19.4608C0.17972 19.1014 0 18.6729 0 18.1754Z\"\n />\n </svg>\n );\n}\n\nfunction HealthIcon() {\n return (\n <svg viewBox=\"0 0 16.0413 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M6.68387 10.7805V12.6419C6.68387 12.872 6.76176 13.0648 6.91753 13.2204C7.07313 13.3762 7.26599 13.4541 7.49609 13.4541H8.54519C8.77957 13.4541 8.97349 13.3762 9.12695 13.2204C9.28059 13.0648 9.35741 12.872 9.35741 12.6419V10.7805H11.2187C11.4531 10.7805 11.647 10.7027 11.8005 10.5469C11.9541 10.3913 12.031 10.1984 12.031 9.96832V8.91922C12.031 8.68484 11.9541 8.49092 11.8005 8.33745C11.647 8.18382 11.4531 8.107 11.2187 8.107H9.35741V6.24567C9.35741 6.01129 9.28059 5.81737 9.12695 5.66391C8.97349 5.51027 8.77957 5.43345 8.54519 5.43345H7.49609C7.26599 5.43345 7.07313 5.51027 6.91753 5.66391C6.76176 5.81737 6.68387 6.01129 6.68387 6.24567V8.107H4.82254C4.59244 8.107 4.39959 8.18382 4.24399 8.33745C4.08821 8.49092 4.01032 8.68484 4.01032 8.91922V9.96832C4.01032 10.1984 4.08821 10.3913 4.24399 10.5469C4.39959 10.7027 4.59244 10.7805 4.82254 10.7805H6.68387ZM8.02064 20C7.9096 20 7.80061 19.9911 7.69366 19.9733C7.58672 19.9554 7.48317 19.9287 7.383 19.8931C5.12777 19.091 3.33347 17.6689 2.00008 15.6269C0.666693 13.5846 0 11.381 0 9.016V4.19961C0 3.79341 0.116834 3.42775 0.350502 3.10265C0.583992 2.77773 0.886013 2.54219 1.25657 2.39603L7.34396 0.123518C7.573 0.0411725 7.79856 0 8.02064 0C8.24272 0 8.46828 0.0411725 8.69731 0.123518L14.7847 2.39603C15.1553 2.54219 15.4573 2.77773 15.6908 3.10265C15.9244 3.42775 16.0413 3.79341 16.0413 4.19961V9.016C16.0413 11.381 15.3746 13.5846 14.0412 15.6269C12.7078 17.6689 10.9135 19.091 8.65828 19.8931C8.55811 19.9287 8.45456 19.9554 8.34761 19.9733C8.24067 19.9911 8.13168 20 8.02064 20ZM8.02064 18.4269C9.8743 17.8387 11.4071 16.6623 12.6191 14.8978C13.8311 13.1333 14.4372 11.1727 14.4372 9.016V4.18918C14.4372 4.12074 14.4183 4.05907 14.3805 4.00417C14.3429 3.94927 14.2897 3.9081 14.2211 3.88065L8.13373 1.60814C8.09951 1.59441 8.06181 1.58755 8.02064 1.58755C7.97947 1.58755 7.94177 1.59441 7.90755 1.60814L1.82015 3.88065C1.75153 3.9081 1.69841 3.94927 1.66081 4.00417C1.62302 4.05907 1.60413 4.12074 1.60413 4.18918V9.016C1.60413 11.1727 2.21013 13.1333 3.42214 14.8978C4.63415 16.6623 6.16698 17.8387 8.02064 18.4269Z\"\n />\n </svg>\n );\n}\n\nfunction StudiesIcon() {\n return (\n <svg viewBox=\"0 0 14.3468 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M5.46942 18.3592V15.6245H5.19594C3.7584 15.6245 2.53307 15.1178 1.51995 14.1045C0.50665 13.0914 0 11.8661 0 10.4285C0 9.36691 0.298357 8.40101 0.89507 7.53083C1.49197 6.66064 2.28895 6.02637 3.28603 5.62802C3.37572 4.94507 3.69751 4.40514 4.25138 4.00825C4.80543 3.61135 5.41199 3.47252 6.07105 3.59175L5.73031 2.66605C5.63915 2.40443 5.64936 2.15494 5.76094 1.91757C5.87233 1.68037 6.05984 1.51055 6.32347 1.40809L6.44571 1.36625L6.37187 1.16634C6.28363 0.941912 6.29065 0.722224 6.39293 0.507276C6.4952 0.292328 6.6705 0.140368 6.91881 0.051399C7.14324 -0.0257197 7.36375 -0.0160572 7.58034 0.0803869C7.79674 0.176831 7.94232 0.343831 8.01707 0.581386L8.09063 0.781293L8.1538 0.760237C8.41032 0.664886 8.66128 0.675734 8.90667 0.79278C9.15225 0.910007 9.32617 1.09688 9.42845 1.35339L11.6077 7.31724C11.7102 7.57394 11.7056 7.82216 11.5941 8.06191C11.4827 8.30165 11.2986 8.47275 11.0419 8.57521L10.9514 8.60666L11.0252 8.80657C11.1135 9.0423 11.1065 9.27056 11.0042 9.49134C10.9019 9.7123 10.7266 9.8669 10.4783 9.95514C10.2539 10.0323 10.0334 10.0226 9.81678 9.92616C9.60037 9.82971 9.4548 9.66271 9.38005 9.42516L9.30648 9.22525L9.22225 9.26736C8.95863 9.36964 8.70175 9.36272 8.45161 9.24658C8.20166 9.13045 8.02664 8.93966 7.92655 8.67421L7.58991 7.71897C7.34451 8.00229 7.04752 8.2218 6.69894 8.37749C6.35054 8.53319 5.987 8.59982 5.60834 8.5774C5.17917 8.55497 4.7861 8.42662 4.42913 8.19235C4.07234 7.95808 3.78383 7.66145 3.5636 7.30248C2.97327 7.60129 2.50517 8.02836 2.15933 8.58369C1.81366 9.13902 1.64082 9.75396 1.64082 10.4285C1.64082 11.4161 1.98649 12.2555 2.67783 12.9466C3.36916 13.638 4.20853 13.9836 5.19594 13.9836H12.8531C13.0856 13.9836 13.2805 14.0623 13.4378 14.2196C13.595 14.377 13.6735 14.5719 13.6735 14.8043C13.6735 15.037 13.595 15.2318 13.4378 15.3887C13.2805 15.5459 13.0856 15.6245 12.8531 15.6245H7.78353V18.3592H13.5264C13.7589 18.3592 13.9537 18.4378 14.1108 18.5952C14.2682 18.7525 14.3468 18.9474 14.3468 19.1799C14.3468 19.4125 14.2682 19.6073 14.1108 19.7643C13.9537 19.9214 13.7589 20 13.5264 20H0.820412C0.587962 20 0.39316 19.9213 0.236005 19.764C0.0786686 19.6067 0 19.4118 0 19.1793C0 18.9467 0.0786686 18.7519 0.236005 18.5949C0.39316 18.4378 0.587962 18.3592 0.820412 18.3592H5.46942ZM9.06255 7.91669L10.2573 7.44988L8.31351 2.077L7.06402 2.52303L9.06255 7.91669ZM5.74234 7.27322C6.08782 7.27322 6.37761 7.15635 6.6117 6.92263C6.84598 6.6889 6.96311 6.3993 6.96311 6.05381C6.96311 5.70833 6.84625 5.41845 6.61252 5.18417C6.3788 4.9499 6.08919 4.83276 5.74371 4.83276C5.39822 4.83276 5.10834 4.94963 4.87407 5.18335C4.63998 5.41708 4.52293 5.70668 4.52293 6.05217C4.52293 6.39765 4.6398 6.68753 4.87352 6.92181C5.10725 7.15608 5.39686 7.27322 5.74234 7.27322Z\"\n />\n </svg>\n );\n}\n\nfunction TokensIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M10 12.9232L12.7592 15.0121C12.9494 15.1458 13.1413 15.1502 13.335 15.0253C13.5287 14.9005 13.5884 14.7254 13.5142 14.5L12.4697 11.0445L15.1647 9.12789C15.3626 8.98053 15.4227 8.79684 15.345 8.57684C15.2675 8.35702 15.113 8.24711 14.8816 8.24711H11.5829L10.4595 4.61737C10.3789 4.39211 10.2259 4.27947 10.0003 4.27947C9.77465 4.27947 9.6214 4.39211 9.54053 4.61737L8.41711 8.24711H5.11842C4.88702 8.24711 4.73254 8.35702 4.655 8.57684C4.57728 8.79684 4.63737 8.98053 4.83526 9.12789L7.53026 11.0445L6.48579 14.5C6.41158 14.7254 6.47132 14.9005 6.665 15.0253C6.85868 15.1502 7.05061 15.1458 7.24079 15.0121L10 12.9232ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3333 18.4211 14.3202 17.6009 15.9605 15.9605C17.6009 14.3202 18.4211 12.3333 18.4211 10C18.4211 7.66667 17.6009 5.67982 15.9605 4.03947C14.3202 2.39912 12.3333 1.57895 10 1.57895C7.66667 1.57895 5.67982 2.39912 4.03947 4.03947C2.39912 5.67982 1.57895 7.66667 1.57895 10C1.57895 12.3333 2.39912 14.3202 4.03947 15.9605C5.67982 17.6009 7.66667 18.4211 10 18.4211Z\"\n />\n </svg>\n );\n}\n\nfunction ProfileIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"xMidYMid meet\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M3.70842 15.5708C4.60316 14.9069 5.57789 14.3826 6.63263 13.9979C7.68719 13.6133 8.80965 13.4211 10 13.4211C11.1904 13.4211 12.3128 13.6133 13.3674 13.9979C14.4221 14.3826 15.3968 14.9069 16.2916 15.5708C16.946 14.8515 17.4645 14.0189 17.8471 13.0729C18.2297 12.1269 18.4211 11.1026 18.4211 10C18.4211 7.66667 17.6009 5.67982 15.9605 4.03947C14.3202 2.39912 12.3333 1.57895 10 1.57895C7.66667 1.57895 5.67982 2.39912 4.03947 4.03947C2.39912 5.67982 1.57895 7.66667 1.57895 10C1.57895 11.1026 1.77026 12.1269 2.15289 13.0729C2.53553 14.0189 3.05404 14.8515 3.70842 15.5708ZM10.0003 10.7895C9.03921 10.7895 8.22877 10.4596 7.56895 9.8C6.90895 9.14018 6.57895 8.32974 6.57895 7.36868C6.57895 6.40763 6.90877 5.59719 7.56842 4.93737C8.22825 4.27737 9.03868 3.94737 9.99974 3.94737C10.9608 3.94737 11.7712 4.27719 12.4311 4.93684C13.0911 5.59667 13.4211 6.40711 13.4211 7.36816C13.4211 8.32921 13.0912 9.13965 12.4316 9.79947C11.7718 10.4595 10.9613 10.7895 10.0003 10.7895ZM10 20C8.6114 20 7.30877 19.7389 6.09211 19.2166C4.87544 18.6943 3.81711 17.9831 2.91711 17.0829C2.01693 16.1829 1.3057 15.1246 0.783421 13.9079C0.26114 12.6912 0 11.3886 0 10C0 8.6114 0.26114 7.30877 0.783421 6.09211C1.3057 4.87544 2.01693 3.8171 2.91711 2.9171C3.81711 2.01693 4.87544 1.3057 6.09211 0.783422C7.30877 0.261141 8.6114 0 10 0C11.3886 0 12.6912 0.261141 13.9079 0.783422C15.1246 1.3057 16.1829 2.01693 17.0829 2.9171C17.9831 3.8171 18.6943 4.87544 19.2166 6.09211C19.7389 7.30877 20 8.6114 20 10C20 11.3886 19.7389 12.6912 19.2166 13.9079C18.6943 15.1246 17.9831 16.1829 17.0829 17.0829C16.1829 17.9831 15.1246 18.6943 13.9079 19.2166C12.6912 19.7389 11.3886 20 10 20ZM10 18.4211C10.95 18.4211 11.866 18.2682 12.7479 17.9626C13.6298 17.6568 14.4129 17.2294 15.0971 16.6803C14.4129 16.1511 13.64 15.7389 12.7784 15.4434C11.9167 15.1478 10.9905 15 10 15C9.00947 15 8.08167 15.1461 7.21658 15.4382C6.35149 15.7304 5.58026 16.1445 4.90289 16.6803C5.58711 17.2294 6.37018 17.6568 7.2521 17.9626C8.13403 18.2682 9.05 18.4211 10 18.4211Z\"\n />\n </svg>\n );\n}\n\nconst DEFAULT_ITEMS: NativeBottomNavItem[] = [\n { value: \"home\", label: \"Home\", icon: <HomeIcon /> },\n { value: \"health\", label: \"Health\", icon: <HealthIcon /> },\n { value: \"studies\", label: \"Studies\", icon: <StudiesIcon /> },\n { value: \"tokens\", label: \"Tokens\", icon: <TokensIcon /> },\n { value: \"profile\", label: \"Profile\", icon: <ProfileIcon /> },\n];\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const NativeBottomNav = React.forwardRef<HTMLElement, NativeBottomNavProps>(\n function NativeBottomNav(\n {\n items = DEFAULT_ITEMS,\n value,\n defaultValue,\n onChange,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = value !== undefined;\n const fallback = defaultValue ?? items[0]?.value ?? \"\";\n const [internal, setInternal] = React.useState<string>(String(fallback));\n const current = isControlled ? String(value) : internal;\n\n const handleSelect = (next: string) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const wrapperClass = \"eds-nbn\" + (className ? ` ${className}` : \"\");\n\n return (\n <nav\n ref={ref}\n id={id}\n className={wrapperClass}\n aria-label={ariaLabel ?? \"Main navigation\"}\n >\n <div\n role=\"tablist\"\n aria-label={ariaLabel ?? \"Main navigation\"}\n style={{\n display: \"contents\",\n }}\n >\n {items.map((item) => {\n const active = item.value === current;\n return (\n <button\n key={item.value}\n type=\"button\"\n role=\"tab\"\n className=\"eds-nbn__item\"\n data-active={active || undefined}\n aria-selected={active}\n aria-current={active ? \"page\" : undefined}\n onClick={() => handleSelect(item.value)}\n >\n <span className=\"eds-nbn__icon\" aria-hidden>\n {item.icon}\n </span>\n <span className=\"eds-nbn__label\">{item.label}</span>\n </button>\n );\n })}\n </div>\n </nav>\n );\n }\n);\n\nexport default NativeBottomNav;\n\n// ---------------------------------------------------------------------------\n// NativeBottomNavMatrix — interactive demo with a \"phone\" frame so the bar\n// sits flush against the bottom of a screen-sized container.\n// ---------------------------------------------------------------------------\nexport function NativeBottomNavMatrix() {\n ensureStyles();\n const [active, setActive] = React.useState<string>(\"home\");\n const activeLabel =\n DEFAULT_ITEMS.find((i) => i.value === active)?.label ?? \"—\";\n\n return (\n <div className=\"eds-nbn-matrix\">\n <section className=\"eds-nbn-matrix__section\">\n <h3 className=\"eds-nbn-matrix__heading\">Interactive · tap to switch sections</h3>\n <p className=\"eds-nbn-matrix__sub\">\n Tap a nav item to make it Active. Icon and label both highlight in\n Action/Primary/Background; inactive items use Text/Placeholder. The\n first row in this Embleema configuration is Home, with Health,\n Studies, Tokens, and Profile rounding out the 5 fixed sections.\n </p>\n <div className=\"eds-nbn-matrix__stage\">\n <div className=\"eds-nbn-matrix__phone\">\n <div className=\"eds-nbn-matrix__screen\">\n <span>\n <strong style={{ color: \"#0E0E0E\" }}>{activeLabel}</strong>\n {\" — screen placeholder\"}\n </span>\n </div>\n <NativeBottomNav value={active} onChange={setActive} />\n </div>\n </div>\n <p className=\"eds-nbn-matrix__readout\">\n Active section: <strong>{activeLabel}</strong>\n </p>\n </section>\n\n <section className=\"eds-nbn-matrix__section\">\n <h3 className=\"eds-nbn-matrix__heading\">Bar in isolation (each section Active)</h3>\n <p className=\"eds-nbn-matrix__sub\">\n Same bar rendered five times with a different section forced Active,\n for visual QA of the Active/Inactive state pairing on every item.\n </p>\n <div className=\"eds-nbn-matrix__stage\" style={{ flexDirection: \"column\", gap: 16 }}>\n {DEFAULT_ITEMS.map((it) => (\n <div key={it.value} className=\"eds-nbn-matrix__states\">\n <span className=\"eds-nbn-matrix__states-label\">{it.label} active</span>\n <NativeBottomNav defaultValue={it.value} onChange={() => { /* no-op */ }} />\n </div>\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * ObjectGroupField — React port of Embleema Design System 2.0's\n * Clinical/Object Group Field component (Figma node 4730:460).\n *\n * Grouped measurement input for clinical data: a section heading plus one\n * or more value fields and a unit-selector dropdown. Pre-configured for\n * Weight / Height / Temperature / Other; responsive via Direction.\n *\n * Type → field set (per Figma):\n * - Weight : [Value field labeled \"Weight\"] + [Unit dropdown]\n * - Height : [Feet field] + [Inches field] + [Unit dropdown]\n * - Temperature : [Value field labeled \"Value\"] + [Unit dropdown]\n * - Other : [Value field labeled \"Value\"] + [Unit dropdown]\n *\n * Direction:\n * - Horizontal → fields laid out side-by-side, each flex-1\n * - Vertical → fields stacked full-width\n *\n * Composition: the unit picker uses the shared <Dropdown /> component so it\n * inherits search, keyboard navigation, click-outside-to-close, and validation\n * styling. The numeric value inputs are rendered inline (a plain styled\n * <input>) since they don't need the full TextField molecule's chrome —\n * simpler markup, closer to the Figma source.\n *\n * Props:\n * - type / direction\n * - heading : override the section heading (default per type)\n * - value : controlled numeric value (Weight / Temperature / Other)\n * - defaultValue : uncontrolled initial value\n * - onValueChange\n * - feetValue / defaultFeetValue / onFeetChange (Height only)\n * - inchesValue / defaultInchesValue / onInchesChange (Height only)\n * - unit / defaultUnit / onUnitChange\n * - unitOptions : override the per-type default unit list\n */\n\nimport * as React from \"react\";\nimport { Dropdown, type DropdownOption } from \"./Dropdown\";\nimport { Field } from \"./Field\";\n\nexport type ObjectGroupFieldType = \"Weight\" | \"Height\" | \"Temperature\" | \"Other\";\nexport type ObjectGroupFieldDirection = \"Horizontal\" | \"Vertical\";\n\nexport type ObjectGroupFieldProps = {\n type?: ObjectGroupFieldType;\n direction?: ObjectGroupFieldDirection;\n heading?: string;\n // Single-value types (Weight, Temperature, Other)\n value?: string;\n defaultValue?: string;\n onValueChange?: (next: string) => void;\n // Height-specific\n feetValue?: string;\n defaultFeetValue?: string;\n onFeetChange?: (next: string) => void;\n inchesValue?: string;\n defaultInchesValue?: string;\n onInchesChange?: (next: string) => void;\n // Unit\n unit?: string;\n defaultUnit?: string;\n onUnitChange?: (next: string) => void;\n unitOptions?: DropdownOption[];\n // Standard\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_HEADING: Record<ObjectGroupFieldType, string> = {\n Weight: \"Weight\",\n Height: \"Height\",\n Temperature: \"Temperature\",\n Other: \"Other\",\n};\n\n// Value-field labels per Figma. Weight uses its own type word; Height\n// splits into Feet + Inches; everything else uses generic \"Value\".\nconst VALUE_LABEL: Record<ObjectGroupFieldType, string> = {\n Weight: \"Weight\",\n Height: \"Feet\",\n Temperature: \"Value\",\n Other: \"Value\",\n};\n\n// Sensible default unit lists per type. Consumers can override via the\n// unitOptions prop.\nconst DEFAULT_UNITS: Record<ObjectGroupFieldType, DropdownOption[]> = {\n Weight: [\n { value: \"kg\", label: \"kg\" },\n { value: \"lbs\", label: \"lbs\" },\n { value: \"g\", label: \"g\" },\n ],\n Height: [\n { value: \"ft-in\", label: \"ft + in\" },\n { value: \"cm\", label: \"cm\" },\n { value: \"in\", label: \"in\" },\n { value: \"m\", label: \"m\" },\n ],\n Temperature: [\n { value: \"C\", label: \"°C\" },\n { value: \"F\", label: \"°F\" },\n ],\n Other: [],\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400&display=swap\");\n\n:root {\n --ogf-bg-field: #F8F8F8;\n --ogf-text-primary: #0E0E0E;\n --ogf-text-placeholder: #848484;\n --ogf-action-primary: #306AE8;\n --ogf-border-default: #DDDDDD;\n}\n\n.eds-ogf {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 16px;\n width: 100%;\n max-width: 600px;\n box-sizing: border-box;\n font-family: Nunito, sans-serif;\n color: var(--ogf-text-primary);\n}\n\n.eds-ogf__heading {\n font-size: 20px;\n font-weight: 400;\n line-height: 1.2;\n color: var(--ogf-text-primary);\n margin: 0;\n}\n\n/* Fields row/column container */\n.eds-ogf__fields {\n display: flex;\n align-items: flex-start;\n gap: 24px;\n width: 100%;\n}\n.eds-ogf[data-direction=\"Horizontal\"] .eds-ogf__fields {\n flex-direction: row;\n}\n.eds-ogf[data-direction=\"Vertical\"] .eds-ogf__fields {\n flex-direction: column;\n}\n\n/* Each field cell (value or unit). In Horizontal, cells share remaining\n width via flex 1. In Vertical, each cell takes full width. */\n.eds-ogf__cell {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 4px;\n min-width: 0;\n}\n.eds-ogf[data-direction=\"Horizontal\"] .eds-ogf__cell { flex: 1 1 0; }\n.eds-ogf[data-direction=\"Vertical\"] .eds-ogf__cell { width: 100%; }\n\n/* Field label above the input */\n.eds-ogf__label {\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5;\n color: var(--ogf-text-primary);\n margin: 0;\n}\n\n/* The value cells use the shared <Field /> component directly, so its\n built-in :focus-within treatment (border swap + halo) drives the focused\n state. Just stretch the Field's wrapper to fill the cell. */\n.eds-ogf__value .eds-field-wrap { width: 100%; }\n\n/* Unit dropdown's wrapper — strip the .eds-dd outer max-width so it fills\n its parent cell, since the Object Group Field controls width itself. */\n.eds-ogf__unit { width: 100%; }\n.eds-ogf__unit .eds-dd { max-width: none; width: 100%; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-ogf-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-ogf-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-ogf-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-ogf-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-ogf-matrix__row {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-ogf-matrix__row-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-ogf-matrix__controls {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n}\n.eds-ogf-matrix__chip {\n padding: 6px 12px;\n background: transparent;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n}\n.eds-ogf-matrix__chip[data-active=\"true\"] {\n background: #E3ECFF;\n border-color: #306AE8;\n color: #306AE8;\n}\n.eds-ogf-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-ogf-matrix__readout {\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-objectgroupfield]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-objectgroupfield\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Internal value-input cell\n// ---------------------------------------------------------------------------\nfunction ValueCell({\n label,\n value,\n onChange,\n placeholder = \"Placeholder\",\n id,\n}: {\n label: string;\n value: string;\n onChange: (v: string) => void;\n placeholder?: string;\n id?: string;\n}) {\n // Generate a stable id so the <label> properly associates with Field's\n // inner <input>. Field forwards id through to that input.\n const generatedId = React.useId();\n const inputId = id ?? `ogf-field-${generatedId}`;\n return (\n <div className=\"eds-ogf__cell eds-ogf__value\">\n <label className=\"eds-ogf__label\" htmlFor={inputId}>\n {label}\n </label>\n <Field\n id={inputId}\n type=\"text\"\n value={value}\n onChange={(e) => onChange(e.target.value)}\n placeholder={placeholder}\n aria-label={label}\n />\n </div>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const ObjectGroupField = React.forwardRef<HTMLDivElement, ObjectGroupFieldProps>(\n function ObjectGroupField(\n {\n type = \"Weight\",\n direction = \"Horizontal\",\n heading,\n value,\n defaultValue = \"\",\n onValueChange,\n feetValue,\n defaultFeetValue = \"\",\n onFeetChange,\n inchesValue,\n defaultInchesValue = \"\",\n onInchesChange,\n unit,\n defaultUnit,\n onUnitChange,\n unitOptions,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n // Single-value controlled/uncontrolled state\n const valueControlled = value !== undefined;\n const [internalValue, setInternalValue] = React.useState(defaultValue);\n const currentValue = valueControlled ? value : internalValue;\n const setValue = (next: string) => {\n if (!valueControlled) setInternalValue(next);\n onValueChange?.(next);\n };\n\n // Height-specific feet + inches\n const feetControlled = feetValue !== undefined;\n const [internalFeet, setInternalFeet] = React.useState(defaultFeetValue);\n const currentFeet = feetControlled ? feetValue : internalFeet;\n const setFeet = (next: string) => {\n if (!feetControlled) setInternalFeet(next);\n onFeetChange?.(next);\n };\n\n const inchesControlled = inchesValue !== undefined;\n const [internalInches, setInternalInches] = React.useState(defaultInchesValue);\n const currentInches = inchesControlled ? inchesValue : internalInches;\n const setInches = (next: string) => {\n if (!inchesControlled) setInternalInches(next);\n onInchesChange?.(next);\n };\n\n // Unit controlled/uncontrolled\n const unitControlled = unit !== undefined;\n const [internalUnit, setInternalUnit] = React.useState(defaultUnit ?? \"\");\n const currentUnit = unitControlled ? unit : internalUnit;\n const setUnit = (next: string) => {\n if (!unitControlled) setInternalUnit(next);\n onUnitChange?.(next);\n };\n\n const wrapperClass = \"eds-ogf\" + (className ? ` ${className}` : \"\");\n const heading_ = heading ?? DEFAULT_HEADING[type];\n const opts = unitOptions ?? DEFAULT_UNITS[type];\n const labelBase = VALUE_LABEL[type];\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n data-direction={direction}\n role=\"group\"\n aria-label={ariaLabel ?? heading_}\n >\n <p className=\"eds-ogf__heading\">{heading_}</p>\n\n <div className=\"eds-ogf__fields\">\n {type === \"Height\" ? (\n <>\n <ValueCell\n label=\"Feet\"\n value={currentFeet}\n onChange={setFeet}\n />\n <ValueCell\n label=\"Inches\"\n value={currentInches}\n onChange={setInches}\n />\n </>\n ) : (\n <ValueCell\n label={labelBase}\n value={currentValue}\n onChange={setValue}\n />\n )}\n\n <div className=\"eds-ogf__cell eds-ogf__unit\">\n <Dropdown\n label=\"Unit\"\n labelPosition=\"Top\"\n options={opts}\n value={currentUnit}\n onChange={(v) => setUnit(v as string)}\n placeholder=\"Placeholder\"\n />\n </div>\n </div>\n </div>\n );\n }\n);\n\nexport default ObjectGroupField;\n\n// ---------------------------------------------------------------------------\n// ObjectGroupFieldMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst TYPES: ObjectGroupFieldType[] = [\"Weight\", \"Height\", \"Temperature\", \"Other\"];\n\nexport function ObjectGroupFieldMatrix() {\n ensureStyles();\n const [direction, setDirection] = React.useState<ObjectGroupFieldDirection>(\"Horizontal\");\n\n // One live group for free-form play\n const [weight, setWeight] = React.useState(\"\");\n const [weightUnit, setWeightUnit] = React.useState(\"kg\");\n const [feet, setFeet] = React.useState(\"\");\n const [inches, setInches] = React.useState(\"\");\n const [heightUnit, setHeightUnit] = React.useState(\"ft-in\");\n const [temp, setTemp] = React.useState(\"\");\n const [tempUnit, setTempUnit] = React.useState(\"F\");\n\n return (\n <div className=\"eds-ogf-matrix\">\n <section className=\"eds-ogf-matrix__section\">\n <h3 className=\"eds-ogf-matrix__heading\">Interactive · live entries</h3>\n <p className=\"eds-ogf-matrix__sub\">\n Toggle Direction to flip every group between Horizontal (side-by-side\n fields) and Vertical (stacked). Each group has its own controlled\n state.\n </p>\n <div className=\"eds-ogf-matrix__controls\" aria-label=\"Direction\">\n {([\"Horizontal\", \"Vertical\"] as ObjectGroupFieldDirection[]).map((d) => (\n <button\n key={d}\n type=\"button\"\n className=\"eds-ogf-matrix__chip\"\n data-active={direction === d || undefined}\n onClick={() => setDirection(d)}\n >\n {d}\n </button>\n ))}\n </div>\n\n <div className=\"eds-ogf-matrix__row\">\n <span className=\"eds-ogf-matrix__row-label\">Weight</span>\n <ObjectGroupField\n type=\"Weight\"\n direction={direction}\n value={weight}\n onValueChange={setWeight}\n unit={weightUnit}\n onUnitChange={setWeightUnit}\n />\n <p className=\"eds-ogf-matrix__readout\">\n weight: {weight || \"—\"} {weightUnit}\n </p>\n </div>\n\n <div className=\"eds-ogf-matrix__row\">\n <span className=\"eds-ogf-matrix__row-label\">Height</span>\n <ObjectGroupField\n type=\"Height\"\n direction={direction}\n feetValue={feet}\n onFeetChange={setFeet}\n inchesValue={inches}\n onInchesChange={setInches}\n unit={heightUnit}\n onUnitChange={setHeightUnit}\n />\n <p className=\"eds-ogf-matrix__readout\">\n height: {feet || \"—\"} ft {inches || \"—\"} in ({heightUnit})\n </p>\n </div>\n\n <div className=\"eds-ogf-matrix__row\">\n <span className=\"eds-ogf-matrix__row-label\">Temperature</span>\n <ObjectGroupField\n type=\"Temperature\"\n direction={direction}\n value={temp}\n onValueChange={setTemp}\n unit={tempUnit}\n onUnitChange={setTempUnit}\n />\n <p className=\"eds-ogf-matrix__readout\">\n temp: {temp || \"—\"} °{tempUnit}\n </p>\n </div>\n\n <div className=\"eds-ogf-matrix__row\">\n <span className=\"eds-ogf-matrix__row-label\">Other</span>\n <ObjectGroupField\n type=\"Other\"\n direction={direction}\n heading=\"Blood pressure\"\n unitOptions={[\n { value: \"mmHg\", label: \"mmHg\" },\n { value: \"kPa\", label: \"kPa\" },\n ]}\n defaultUnit=\"mmHg\"\n />\n <p className=\"eds-ogf-matrix__readout\">\n heading + unitOptions overridden via props\n </p>\n </div>\n </section>\n\n <section className=\"eds-ogf-matrix__section\">\n <h3 className=\"eds-ogf-matrix__heading\">Type × Direction (static)</h3>\n <p className=\"eds-ogf-matrix__sub\">\n Full coverage matrix for QA. Empty inputs to show placeholder\n treatment.\n </p>\n {TYPES.map((t) => (\n <div key={t} className=\"eds-ogf-matrix__row\">\n <span className=\"eds-ogf-matrix__row-label\">{t} · Horizontal</span>\n <ObjectGroupField type={t} direction=\"Horizontal\" />\n <span\n className=\"eds-ogf-matrix__row-label\"\n style={{ marginTop: 16 }}\n >\n {t} · Vertical\n </span>\n <ObjectGroupField type={t} direction=\"Vertical\" />\n </div>\n ))}\n </section>\n </div>\n );\n}\n","/**\n * ParticipantActivityStatus — React port of Embleema Design System 2.0's\n * Clinical/ParticipantActivityStatus component (Figma node 4740:31).\n *\n * Participant enrollment indicator: 24 × 24 icon + label showing where a\n * participant sits in the study lifecycle. Used in participant lists,\n * dashboards, and detail headers.\n *\n * Status → icon + label + fill (per Figma):\n * - PendingAccount → person + gear → \"Pending Sign-Up\" → orange gradient #FCA266 → #FA6400\n * - Onboarding → person + pencil → \"Onboarding\" → pink → blue #FF66AB → #6694FA\n * - Participating → people + check → \"Active\" → teal stack #0A5A5C → #028388 → #00AFB2\n * - NotParticipating → people + X → \"Inactive\" → Neutral/500 flat #B0B0B0\n * - StudyComplete → check in circle → \"Study Complete\" → purple → blue #644AD4 → #2760DE\n * - Ineligible → X in circle → \"Ineligible\" → Neutral/500 flat #B0B0B0\n *\n * The label is always Text/Primary; status identity is carried by the icon's\n * gradient or flat fill, all of which are baked into the Figma source as raw\n * primitives (gradient stops cannot be variable-bound in Figma, so we inline\n * the same hex values).\n *\n * Type style: body/sm (Nunito Regular 14 / 1.5).\n *\n * Props:\n * - status : PendingAccount | Onboarding | Participating | NotParticipating | StudyComplete | Ineligible\n * - label : optional override (defaults to the per-status label)\n */\n\nimport * as React from \"react\";\n\nexport type ParticipantActivityStatusType =\n | \"PendingAccount\"\n | \"Onboarding\"\n | \"Participating\"\n | \"NotParticipating\"\n | \"StudyComplete\"\n | \"Ineligible\";\n\nexport type ParticipantActivityStatusProps = {\n status?: ParticipantActivityStatusType;\n label?: string;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL: Record<ParticipantActivityStatusType, string> = {\n PendingAccount: \"Pending Sign-Up\",\n Onboarding: \"Onboarding\",\n Participating: \"Active\",\n NotParticipating: \"Inactive\",\n StudyComplete: \"Study Complete\",\n Ineligible: \"Ineligible\",\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400&display=swap\");\n\n:root {\n --pas-text-primary: #0E0E0E;\n --pas-neutral-500: #B0B0B0;\n}\n\n.eds-pas {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: Nunito, sans-serif;\n}\n\n.eds-pas__icon {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.eds-pas__icon svg { display: block; width: 100%; height: 100%; }\n\n.eds-pas__label {\n font-size: 14px;\n font-weight: 400;\n line-height: 1.5;\n color: var(--pas-text-primary);\n white-space: nowrap;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-pas-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-pas-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-pas-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-pas-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-pas-matrix__stack {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n/* The table is wrapped in a scroll container so the Type Key column can\n stay readable on narrow viewports without truncating. The track widths\n below assume the table is at least ~620 px wide; below that, the wrapper\n scrolls horizontally. */\n.eds-pas-matrix__table-wrap {\n width: 100%;\n overflow-x: auto;\n border: 1px solid #DDDDDD;\n border-radius: 8px;\n background: #FEFEFE;\n}\n.eds-pas-matrix__table {\n display: grid;\n grid-template-columns:\n minmax(180px, 1.1fr)\n minmax(220px, 2fr)\n minmax(160px, auto);\n min-width: 620px;\n}\n.eds-pas-matrix__cell {\n padding: 12px 16px;\n border-bottom: 1px solid #EEEEEE;\n border-right: 1px solid #EEEEEE;\n display: flex;\n align-items: center;\n font-family: Nunito, sans-serif;\n font-size: 14px;\n color: #0E0E0E;\n min-width: 0;\n}\n.eds-pas-matrix__cell:nth-child(3n) { border-right: none; }\n.eds-pas-matrix__cell--head {\n background: #F8F8F8;\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-pas-matrix__cell--last { border-bottom: none; }\n/* Type-key column: monospace, allow it to take the natural width of the\n longest key (PendingAccount / NotParticipating) without truncation. */\n.eds-pas-matrix__typekey {\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 12px;\n color: #5E5E5E;\n white-space: nowrap;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-pas]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-pas\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Per-status icons — each is the exact path from Figma's status icon library,\n// translated inside a 24-viewBox to match the source's inset percentages.\n// Gradient stops are inlined (Figma can't variable-bind gradient stops).\n// Gradient ids are uniquified via the `gradId` prop so multiple instances\n// on a page don't clobber each other.\n// ---------------------------------------------------------------------------\nfunction PendingAccountIcon({ gradId }: { gradId: string }) {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <defs>\n <linearGradient id={gradId} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"16.7831\" gradientUnits=\"userSpaceOnUse\">\n <stop stopColor=\"#FCA266\" />\n <stop offset=\"1\" stopColor=\"#FA6400\" />\n </linearGradient>\n </defs>\n <g transform=\"translate(2 3.2592)\">\n <path\n fill={`url(#${gradId})`}\n d=\"M8.19716 7.65068C7.14519 7.65068 6.24469 7.27617 5.49565 6.52713C4.74643 5.77791 4.37182 4.87731 4.37182 3.82534C4.37182 2.77337 4.74643 1.87287 5.49565 1.12383C6.24469 0.37461 7.14519 0 8.19716 0C9.24913 0 10.1496 0.37461 10.8987 1.12383C11.6479 1.87287 12.0225 2.77337 12.0225 3.82534C12.0225 4.87731 11.6479 5.77791 10.8987 6.52713C10.1496 7.27617 9.24913 7.65068 8.19716 7.65068ZM0 14.3136V13.5442C0 12.9922 0.142631 12.4924 0.427892 12.0446C0.712971 11.5969 1.10425 11.247 1.60173 10.9949C2.58812 10.4946 3.61039 10.1065 4.66856 9.83031C5.72672 9.55434 6.81048 9.41635 7.91982 9.41635H8.07748C8.30974 9.41635 8.50437 9.49805 8.66139 9.66145C8.81842 9.82503 8.89693 10.0227 8.89693 10.2544C8.89693 10.4859 8.81842 10.6802 8.66139 10.8372C8.50437 10.994 8.30974 11.0725 8.07748 11.0725H7.91982C6.9338 11.0725 5.97865 11.1912 5.05437 11.4288C4.12991 11.6663 3.22977 12.0128 2.35395 12.4682C2.14392 12.5802 1.97233 12.7287 1.83917 12.9138C1.70601 13.0987 1.63943 13.3088 1.63943 13.5442V14.3347H8.07748C8.30974 14.3347 8.50437 14.4133 8.66139 14.5705C8.81842 14.7275 8.89693 14.9222 8.89693 15.1546C8.89693 15.3871 8.81842 15.5817 8.66139 15.7386C8.50437 15.8956 8.30974 15.9741 8.07748 15.9741H1.66047C1.19943 15.9741 0.80742 15.8126 0.484452 15.4896C0.161484 15.1665 0 14.7745 0 14.3136ZM14.759 16.1506L14.6267 15.3328C14.3661 15.2557 14.1208 15.1549 13.8909 15.0303C13.6612 14.9055 13.4426 14.7492 13.2351 14.5614L12.422 14.8601C12.2482 14.9189 12.0802 14.9153 11.9181 14.8492C11.7562 14.783 11.6299 14.6774 11.5391 14.5322L11.3941 14.2756C11.3015 14.1201 11.2684 13.9506 11.2946 13.7671C11.3208 13.5837 11.4058 13.4331 11.5495 13.3152L12.2034 12.796C12.1249 12.513 12.0856 12.2341 12.0856 11.9594C12.0856 11.6849 12.1249 11.4061 12.2034 11.123L11.5602 10.5828C11.4159 10.4679 11.329 10.3225 11.2995 10.1467C11.27 9.97075 11.3015 9.80508 11.3941 9.6497L11.5558 9.37646C11.6485 9.2311 11.7744 9.12535 11.9334 9.05923C12.0923 8.99329 12.2586 8.98974 12.4324 9.04857L13.2351 9.34695C13.4355 9.15914 13.6524 9.00467 13.8857 8.88354C14.1191 8.76222 14.3661 8.66303 14.6267 8.58598L14.759 7.75151C14.7927 7.56662 14.8789 7.41779 15.0177 7.30504C15.1564 7.19228 15.3181 7.1359 15.503 7.1359H15.7932C15.9781 7.1359 16.1399 7.1951 16.2787 7.31351C16.4174 7.43191 16.5035 7.58356 16.5372 7.76845L16.6591 8.58598C16.9198 8.66303 17.1668 8.76504 17.4001 8.89201C17.6333 9.01879 17.85 9.18164 18.0504 9.38056L18.8199 9.08218C19.0048 9.01205 19.1806 9.01023 19.3475 9.07672C19.5142 9.14339 19.6434 9.25277 19.7352 9.40488L19.8926 9.67129C19.9844 9.82357 20.0156 9.99043 19.9863 10.1719C19.9568 10.3533 19.8699 10.5015 19.7256 10.6164L19.0824 11.1566C19.161 11.4195 19.2002 11.6933 19.2002 11.978C19.2002 12.2627 19.161 12.5354 19.0824 12.796L19.7363 13.3152C19.8806 13.4301 19.9656 13.5772 19.9915 13.7565C20.0174 13.9359 19.9841 14.1034 19.8918 14.259L19.7297 14.5322C19.6387 14.6774 19.5151 14.783 19.359 14.8492C19.2027 14.9153 19.0376 14.9189 18.8639 14.8601L18.0504 14.5614C17.8431 14.7492 17.6245 14.9055 17.3946 15.0303C17.1649 15.1549 16.9198 15.2557 16.6591 15.3328L16.5372 16.1673C16.5035 16.3523 16.4174 16.5013 16.2787 16.614C16.1399 16.7268 15.9781 16.7831 15.7932 16.7831H15.503C15.3181 16.7831 15.1564 16.7239 15.0177 16.6055C14.8789 16.4871 14.7927 16.3355 14.759 16.1506ZM15.6385 14.0404C16.2111 14.0404 16.7008 13.8365 17.1077 13.4289C17.5149 13.0212 17.7184 12.5311 17.7184 11.9586C17.7184 11.386 17.5146 10.8963 17.1069 10.4894C16.6993 10.0822 16.2092 9.87867 15.6366 9.87867C15.0643 9.87867 14.5746 10.0825 14.1674 10.4902C13.7603 10.8979 13.5567 11.388 13.5567 11.9605C13.5567 12.5328 13.7606 13.0226 14.1682 13.4297C14.5759 13.8368 15.066 14.0404 15.6385 14.0404ZM8.19716 6.01125C8.79829 6.01125 9.31289 5.79722 9.74096 5.36914C10.169 4.94107 10.3831 4.42647 10.3831 3.82534C10.3831 3.22422 10.169 2.70962 9.74096 2.28154C9.31289 1.85347 8.79829 1.63943 8.19716 1.63943C7.59604 1.63943 7.08144 1.85347 6.65336 2.28154C6.22529 2.70962 6.01125 3.22422 6.01125 3.82534C6.01125 4.42647 6.22529 4.94107 6.65336 5.36914C7.08144 5.79722 7.59604 6.01125 8.19716 6.01125Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction OnboardingIcon({ gradId }: { gradId: string }) {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <defs>\n <linearGradient id={gradId} x1=\"0.682887\" y1=\"-4.54099\" x2=\"-0.748308\" y2=\"15.1087\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0.145\" stopColor=\"#FF66AB\" />\n <stop offset=\"1\" stopColor=\"#6694FA\" />\n </linearGradient>\n </defs>\n <g transform=\"translate(2 3.2592)\">\n <path\n fill={`url(#${gradId})`}\n d=\"M0 15.235V13.7692C0 13.2251 0.147778 12.7212 0.443334 12.2575C0.738889 11.7938 1.13389 11.4373 1.62833 11.1881C2.72648 10.6497 3.83435 10.2459 4.95194 9.97667C6.06954 9.70741 7.19667 9.57278 8.33333 9.57278C8.92593 9.57278 9.51463 9.60907 10.0994 9.68167C10.6841 9.75426 11.2706 9.86537 11.8589 10.015L10.4681 11.4231C10.1031 11.3706 9.74722 11.3269 9.40056 11.2919C9.05389 11.2569 8.69815 11.2394 8.33333 11.2394C7.32037 11.2394 6.31639 11.3608 5.32139 11.6036C4.32657 11.8466 3.35046 12.2038 2.39306 12.6753C2.16954 12.7964 1.99259 12.9527 1.86222 13.1442C1.73185 13.3358 1.66667 13.5442 1.66667 13.7692V14.5728H8.24778V16.2394H1.00444C0.719815 16.2394 0.481296 16.1431 0.288889 15.9506C0.0962961 15.7581 0 15.5196 0 15.235ZM10.6839 16.5597V15.4594C10.6839 15.1885 10.7387 14.9303 10.8483 14.6847C10.958 14.4392 11.104 14.2252 11.2864 14.0428L16.7158 8.62389C16.854 8.48574 17.0031 8.38852 17.1633 8.33222C17.3235 8.27611 17.4837 8.24806 17.6439 8.24806C17.8185 8.24806 17.9875 8.28074 18.1508 8.34611C18.3142 8.41167 18.4626 8.51 18.5961 8.64111L19.6239 9.67944C19.7435 9.81778 19.8361 9.96741 19.9017 10.1283C19.9672 10.2893 20 10.4502 20 10.6111C20 10.772 19.9701 10.9358 19.9103 11.1025C19.8505 11.2692 19.755 11.4216 19.6239 11.5597L14.205 16.9786C14.0228 17.161 13.8089 17.3042 13.5633 17.4081C13.3178 17.5121 13.0594 17.5642 12.7883 17.5642H11.6881C11.4034 17.5642 11.1649 17.4679 10.9725 17.2753C10.7801 17.0829 10.6839 16.8444 10.6839 16.5597ZM12.0086 16.2394H13.0642L16.6708 12.6153L16.1603 12.0875L15.6431 11.5664L12.0086 15.1839V16.2394ZM16.1603 12.0875L15.6431 11.5664L16.6708 12.6153L16.1603 12.0875ZM8.33333 7.77778C7.26389 7.77778 6.34843 7.39704 5.58694 6.63556C4.82528 5.87389 4.44444 4.95833 4.44444 3.88889C4.44444 2.81944 4.82528 1.90398 5.58694 1.1425C6.34843 0.380833 7.26389 0 8.33333 0C9.40278 0 10.3182 0.380833 11.0797 1.1425C11.8414 1.90398 12.2222 2.81944 12.2222 3.88889C12.2222 4.95833 11.8414 5.87389 11.0797 6.63556C10.3182 7.39704 9.40278 7.77778 8.33333 7.77778ZM8.33333 6.11111C8.94444 6.11111 9.46759 5.89352 9.90278 5.45833C10.338 5.02315 10.5556 4.5 10.5556 3.88889C10.5556 3.27778 10.338 2.75463 9.90278 2.31944C9.46759 1.88426 8.94444 1.66667 8.33333 1.66667C7.72222 1.66667 7.19907 1.88426 6.76389 2.31944C6.3287 2.75463 6.11111 3.27778 6.11111 3.88889C6.11111 4.5 6.3287 5.02315 6.76389 5.45833C7.19907 5.89352 7.72222 6.11111 8.33333 6.11111Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction ParticipatingIcon({ gradId }: { gradId: string }) {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <defs>\n <linearGradient id={gradId} x1=\"13.392\" y1=\"15.5202\" x2=\"13.392\" y2=\"0\" gradientUnits=\"userSpaceOnUse\">\n <stop stopColor=\"#0A5A5C\" />\n <stop offset=\"0.6\" stopColor=\"#028388\" />\n <stop offset=\"0.9999\" stopColor=\"#00AFB2\" />\n </linearGradient>\n </defs>\n <g transform=\"translate(2 5.2584)\">\n <path\n fill={`url(#${gradId})`}\n d=\"M15.2459 4.59609L18.7679 1.05961C18.9091 0.918395 19.0768 0.847786 19.2711 0.847786C19.4654 0.847786 19.6362 0.918395 19.7836 1.05961C19.9308 1.20083 20.0029 1.37007 19.9999 1.56734C19.9969 1.7646 19.9248 1.93392 19.7836 2.07529L15.8469 6.00266C15.6752 6.17443 15.4748 6.26032 15.2459 6.26032C15.017 6.26032 14.8166 6.17443 14.6448 6.00266L12.7268 4.08457C12.5855 3.94335 12.5134 3.77712 12.5104 3.58587C12.5074 3.39478 12.5795 3.22554 12.7268 3.07815C12.8704 2.93693 13.0378 2.86632 13.229 2.86632C13.4203 2.86632 13.5866 2.93693 13.728 3.07815L15.2459 4.59609ZM7.12425 6.6493C6.20997 6.6493 5.42733 6.3238 4.77634 5.6728C4.12518 5.02165 3.7996 4.23893 3.7996 3.32465C3.7996 2.41037 4.12518 1.62773 4.77634 0.976735C5.42733 0.325578 6.20997 0 7.12425 0C8.03853 0 8.82117 0.325578 9.47217 0.976735C10.1233 1.62773 10.4489 2.41037 10.4489 3.32465C10.4489 4.23893 10.1233 5.02165 9.47217 5.6728C8.82117 6.3238 8.03853 6.6493 7.12425 6.6493ZM0 12.4401V11.7714C0 11.3063 0.126337 10.8755 0.37901 10.4791C0.631684 10.0826 0.969373 9.77788 1.39208 9.56478C2.3309 9.10456 3.27803 8.75935 4.23347 8.52915C5.18891 8.29896 6.1525 8.18386 7.12425 8.18386C8.096 8.18386 9.05959 8.29896 10.015 8.52915C10.9705 8.75935 11.9176 9.10456 12.8564 9.56478C13.2791 9.77788 13.6168 10.0826 13.8695 10.4791C14.1222 10.8755 14.2485 11.3063 14.2485 11.7714V12.4401C14.2485 12.8407 14.1082 13.1814 13.8275 13.4622C13.5468 13.7429 13.2061 13.8833 12.8054 13.8833H1.44314C1.04244 13.8833 0.701739 13.7429 0.421043 13.4622C0.140348 13.1814 0 12.8407 0 12.4401ZM1.42485 12.4584H12.8237V11.7714C12.8237 11.579 12.7679 11.4009 12.6565 11.2371C12.545 11.0734 12.3937 10.9398 12.2027 10.8362C11.3842 10.4331 10.5497 10.1278 9.69919 9.92005C8.84856 9.71249 7.99024 9.60871 7.12425 9.60871C6.25826 9.60871 5.39995 9.71249 4.54931 9.92005C3.69883 10.1278 2.86434 10.4331 2.04585 10.8362C1.85476 10.9398 1.70349 11.0734 1.59203 11.2371C1.48058 11.4009 1.42485 11.579 1.42485 11.7714V12.4584ZM7.12425 5.22445C7.6467 5.22445 8.09394 5.03843 8.46599 4.66638C8.83803 4.29434 9.02405 3.8471 9.02405 3.32465C9.02405 2.80221 8.83803 2.35496 8.46599 1.98292C8.09394 1.61087 7.6467 1.42485 7.12425 1.42485C6.60181 1.42485 6.15456 1.61087 5.78252 1.98292C5.41047 2.35496 5.22445 2.80221 5.22445 3.32465C5.22445 3.8471 5.41047 4.29434 5.78252 4.66638C6.15456 5.03843 6.60181 5.22445 7.12425 5.22445Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction NotParticipatingIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 5.2584)\">\n <path\n fill=\"var(--pas-neutral-500)\"\n d=\"M18 5.8865L16.427 7.43475C16.2885 7.57308 16.117 7.64642 15.9125 7.65475C15.708 7.66308 15.5275 7.589 15.371 7.4325C15.2275 7.289 15.1557 7.11408 15.1557 6.90775C15.1557 6.70142 15.2282 6.52575 15.373 6.38075L16.9307 4.80775L15.373 3.25975C15.2282 3.12292 15.1557 2.95183 15.1557 2.7465C15.1557 2.54117 15.2275 2.36092 15.371 2.20575C15.5275 2.05075 15.7064 1.97325 15.9078 1.97325C16.1089 1.97325 16.2871 2.05075 16.4423 2.20575L18 3.7635L19.548 2.1905C19.6848 2.03533 19.8559 1.95775 20.0613 1.95775C20.2666 1.95775 20.4468 2.03533 20.602 2.1905C20.757 2.34567 20.8345 2.52383 20.8345 2.725C20.8345 2.92633 20.757 3.10458 20.602 3.25975L19.0538 4.80775L20.6173 6.38075C20.7659 6.52958 20.8393 6.70367 20.8375 6.903C20.8355 7.10233 20.757 7.28025 20.602 7.43675C20.4468 7.58025 20.2712 7.65458 20.075 7.65975C19.8788 7.66475 19.7032 7.58975 19.548 7.43475L18 5.8865ZM7.5 7C6.5375 7 5.71358 6.65733 5.02825 5.972C4.34275 5.2865 4 4.4625 4 3.5C4 2.5375 4.34275 1.71358 5.02825 1.02825C5.71358 0.34275 6.5375 0 7.5 0C8.4625 0 9.28642 0.34275 9.97175 1.02825C10.6573 1.71358 11 2.5375 11 3.5C11 4.4625 10.6573 5.2865 9.97175 5.972C9.28642 6.65733 8.4625 7 7.5 7ZM0 13.0962V12.3923C0 11.9026 0.133 11.4491 0.399 11.0317C0.665 10.6144 1.0205 10.2936 1.4655 10.0692C2.45383 9.58475 3.45092 9.22133 4.45675 8.979C5.46258 8.73667 6.477 8.6155 7.5 8.6155C8.523 8.6155 9.53742 8.73667 10.5433 8.979C11.5491 9.22133 12.5462 9.58475 13.5345 10.0692C13.9795 10.2936 14.335 10.6144 14.601 11.0317C14.867 11.4491 15 11.9026 15 12.3923V13.0962C15 13.5179 14.8523 13.8766 14.5568 14.1723C14.2613 14.4678 13.9026 14.6155 13.4807 14.6155H1.51925C1.09742 14.6155 0.73875 14.4678 0.44325 14.1723C0.14775 13.8766 0 13.5179 0 13.0962ZM1.5 13.1155H13.5V12.3923C13.5 12.1898 13.4413 12.0023 13.324 11.8298C13.2067 11.6574 13.0474 11.5168 12.8462 11.4078C11.9846 10.9834 11.1061 10.6619 10.2107 10.4433C9.31525 10.2248 8.41167 10.1155 7.5 10.1155C6.58833 10.1155 5.68475 10.2248 4.78925 10.4433C3.89392 10.6619 3.01542 10.9834 2.15375 11.4078C1.95258 11.5168 1.79333 11.6574 1.676 11.8298C1.55867 12.0023 1.5 12.1898 1.5 12.3923V13.1155ZM7.5 5.5C8.05 5.5 8.52083 5.30417 8.9125 4.9125C9.30417 4.52083 9.5 4.05 9.5 3.5C9.5 2.95 9.30417 2.47917 8.9125 2.0875C8.52083 1.69583 8.05 1.5 7.5 1.5C6.95 1.5 6.47917 1.69583 6.0875 2.0875C5.69583 2.47917 5.5 2.95 5.5 3.5C5.5 4.05 5.69583 4.52083 6.0875 4.9125C6.47917 5.30417 6.95 5.5 7.5 5.5Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction StudyCompleteIcon({ gradId }: { gradId: string }) {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <defs>\n <linearGradient id={gradId} x1=\"0.95228\" y1=\"0\" x2=\"0.95228\" y2=\"18.0954\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0.255\" stopColor=\"#644AD4\" />\n <stop offset=\"1\" stopColor=\"#2760DE\" />\n </linearGradient>\n </defs>\n <g transform=\"translate(2 2)\">\n <path\n fill={`url(#${gradId})`}\n d=\"M8.50605 12.2592L6.06079 9.81368C5.915 9.66807 5.73175 9.59351 5.51105 9.59C5.29053 9.58667 5.10395 9.66123 4.95132 9.81368C4.79886 9.96632 4.72263 10.1512 4.72263 10.3684C4.72263 10.5856 4.79886 10.7705 4.95132 10.9232L7.84 13.8118C8.03035 14.002 8.25237 14.0971 8.50605 14.0971C8.75974 14.0971 8.98175 14.002 9.17211 13.8118L15.0284 7.95553C15.174 7.80974 15.2486 7.62649 15.2521 7.40579C15.2554 7.18526 15.1809 6.99868 15.0284 6.84605C14.8758 6.6936 14.6909 6.61737 14.4737 6.61737C14.2565 6.61737 14.0716 6.6936 13.9189 6.84605L8.50605 12.2592ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction IneligibleIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"var(--pas-neutral-500)\"\n d=\"M10 11.1092L13.2347 14.3442C13.3805 14.4898 13.5638 14.5644 13.7845 14.5679C14.005 14.5712 14.1916 14.4967 14.3442 14.3442C14.4967 14.1916 14.5729 14.0067 14.5729 13.7895C14.5729 13.5723 14.4967 13.3874 14.3442 13.2347L11.1092 10L14.3442 6.76526C14.4898 6.61947 14.5644 6.43623 14.5679 6.21553C14.5712 5.995 14.4967 5.80842 14.3442 5.65579C14.1916 5.50333 14.0067 5.4271 13.7895 5.4271C13.5723 5.4271 13.3874 5.50333 13.2347 5.65579L10 8.89079L6.76526 5.65579C6.61947 5.51018 6.43623 5.43561 6.21553 5.4321C5.995 5.42877 5.80842 5.50333 5.65579 5.65579C5.50333 5.80842 5.42711 5.99333 5.42711 6.21053C5.42711 6.42772 5.50333 6.61263 5.65579 6.76526L8.89079 10L5.65579 13.2347C5.51018 13.3805 5.43561 13.5638 5.43211 13.7845C5.42877 14.005 5.50333 14.1916 5.65579 14.3442C5.80842 14.4967 5.99333 14.5729 6.21053 14.5729C6.42772 14.5729 6.61263 14.4967 6.76526 14.3442L10 11.1092ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const ParticipantActivityStatus = React.forwardRef<\n HTMLSpanElement,\n ParticipantActivityStatusProps\n>(function ParticipantActivityStatus(\n { status = \"PendingAccount\", label, id, className, \"aria-label\": ariaLabel },\n ref\n) {\n ensureStyles();\n\n // useId gives every instance its own gradient namespace so multiple cards\n // on a page don't collide on the SVG <defs> ids.\n const uid = React.useId().replace(/:/g, \"\");\n const gradId = `eds-pas-grad-${status}-${uid}`;\n\n const text = label ?? DEFAULT_LABEL[status];\n const wrapperClass = \"eds-pas\" + (className ? ` ${className}` : \"\");\n\n let iconEl: React.ReactNode = null;\n switch (status) {\n case \"PendingAccount\":\n iconEl = <PendingAccountIcon gradId={gradId} />;\n break;\n case \"Onboarding\":\n iconEl = <OnboardingIcon gradId={gradId} />;\n break;\n case \"Participating\":\n iconEl = <ParticipatingIcon gradId={gradId} />;\n break;\n case \"NotParticipating\":\n iconEl = <NotParticipatingIcon />;\n break;\n case \"StudyComplete\":\n iconEl = <StudyCompleteIcon gradId={gradId} />;\n break;\n case \"Ineligible\":\n iconEl = <IneligibleIcon />;\n break;\n }\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-status={status}\n role=\"status\"\n aria-label={ariaLabel ?? `Participant status: ${text}`}\n >\n <span className=\"eds-pas__icon\" aria-hidden>\n {iconEl}\n </span>\n <span className=\"eds-pas__label\">{text}</span>\n </span>\n );\n});\n\nexport default ParticipantActivityStatus;\n\n// ---------------------------------------------------------------------------\n// ParticipantActivityStatusMatrix — showcase\n// ---------------------------------------------------------------------------\nconst STATUSES: ParticipantActivityStatusType[] = [\n \"PendingAccount\",\n \"Onboarding\",\n \"Participating\",\n \"NotParticipating\",\n \"StudyComplete\",\n \"Ineligible\",\n];\n\nconst STATUS_HINT: Record<ParticipantActivityStatusType, string> = {\n PendingAccount: \"Awaiting account creation / first sign-in\",\n Onboarding: \"Reviewing study materials, signing consent\",\n Participating: \"Actively enrolled, submitting data\",\n NotParticipating: \"Paused or withdrawn from active data entry\",\n StudyComplete: \"Finished the study protocol\",\n Ineligible: \"Did not meet eligibility criteria\",\n};\n\nexport function ParticipantActivityStatusMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-pas-matrix\">\n <section className=\"eds-pas-matrix__section\">\n <h3 className=\"eds-pas-matrix__heading\">All statuses</h3>\n <p className=\"eds-pas-matrix__sub\">\n Icon + label combo. Gradient stops are inlined from Figma since they\n can't be variable-bound; the Neutral/500 statuses (Inactive,\n Ineligible) use a flat fill so they read as \"muted\" against the\n colored states.\n </p>\n <div className=\"eds-pas-matrix__stack\">\n {STATUSES.map((s) => (\n <ParticipantActivityStatus key={s} status={s} />\n ))}\n </div>\n </section>\n\n <section className=\"eds-pas-matrix__section\">\n <h3 className=\"eds-pas-matrix__heading\">Lifecycle reference</h3>\n <p className=\"eds-pas-matrix__sub\">\n What each status means in a typical participant journey.\n </p>\n <div className=\"eds-pas-matrix__table-wrap\">\n <div className=\"eds-pas-matrix__table\">\n <div className=\"eds-pas-matrix__cell eds-pas-matrix__cell--head\">Status</div>\n <div className=\"eds-pas-matrix__cell eds-pas-matrix__cell--head\">Meaning</div>\n <div className=\"eds-pas-matrix__cell eds-pas-matrix__cell--head\">Type key</div>\n {STATUSES.map((s, i) => {\n const last = i === STATUSES.length - 1;\n const cellClass =\n \"eds-pas-matrix__cell\" + (last ? \" eds-pas-matrix__cell--last\" : \"\");\n return (\n <React.Fragment key={s}>\n <div className={cellClass}>\n <ParticipantActivityStatus status={s} />\n </div>\n <div className={cellClass}>{STATUS_HINT[s]}</div>\n <div className={`${cellClass} eds-pas-matrix__typekey`}>{s}</div>\n </React.Fragment>\n );\n })}\n </div>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * ProgressBar — React port of Embleema Design System 2.0's Feedback/ProgressBar\n * component (Figma node 4897:157).\n *\n * Determinate progress indicator. For unknown-duration loading, use Spinner\n * or Loading instead.\n *\n * Sizes (track height per Figma):\n * - Small → 4 px, 4 px radius\n * - Medium → 7 px, pill radius\n * - Large → 12 px, pill radius\n *\n * Styles:\n * - Default → fill in Action/Primary/Background (#306AE8)\n * - AI → fill is the Gradient/AI treatment (#90B3FF → #6F59CF)\n *\n * Track:\n * - bg Background/Secondary (#F1F1F1), 1 px Border/Default outline.\n *\n * Label (optional, right of the bar):\n * - Small → 12 px Nunito Regular 1.4\n * - Medium → 14 px Nunito Regular 1.5\n * - Large → 16 px Nunito Regular 1.5\n * All in Text/Secondary.\n *\n * Props:\n * - progress : 0–100 (number, clamped). Accepts any continuous value, not\n * just the five Figma stops.\n * - size : Small | Medium | Large\n * - style : Default | AI\n * - label : show the label (default false)\n * - labelText : overrides the default \"<progress>%\" string\n *\n * NOTE: Figma defines a discrete \"Medium / 100% / Default\" variant with a 4 px\n * track radius (the rest of Medium uses pill). That looks like a designer\n * inconsistency and creates a visible \"snap\" when sliding through 100%, so\n * we keep Medium at pill radius across all progress values. Verified\n * intentional with: this matches the Medium/AI and Medium/<100% behavior;\n * only the single Medium/100%/Default cell differs in the source.\n */\n\nimport * as React from \"react\";\n\nexport type ProgressBarSize = \"Small\" | \"Medium\" | \"Large\";\nexport type ProgressBarStyle = \"Default\" | \"AI\";\n\nexport type ProgressBarProps = {\n progress?: number;\n size?: ProgressBarSize;\n style?: ProgressBarStyle;\n label?: boolean;\n labelText?: string;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400&display=swap\");\n\n:root {\n --pb-action-primary: #306AE8;\n --pb-background-secondary: #F1F1F1;\n --pb-border-default: #DDDDDD;\n --pb-text-secondary: #5E5E5E;\n --pb-ai-from: #90B3FF;\n --pb-ai-to: #6F59CF;\n}\n\n.eds-pb {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n max-width: 320px;\n box-sizing: border-box;\n font-family: Nunito, sans-serif;\n}\n\n.eds-pb__track {\n position: relative;\n flex: 1 0 0;\n min-width: 1px;\n background: var(--pb-background-secondary);\n border: 1px solid var(--pb-border-default);\n overflow: hidden;\n box-sizing: border-box;\n}\n\n.eds-pb[data-size=\"Small\"] .eds-pb__track { height: 4px; border-radius: 4px; }\n.eds-pb[data-size=\"Medium\"] .eds-pb__track { height: 7px; border-radius: 999px; }\n.eds-pb[data-size=\"Large\"] .eds-pb__track { height: 12px; border-radius: 999px; }\n\n.eds-pb__fill {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n background: var(--pb-action-primary);\n transition: width 240ms ease-out;\n /* match the track's radius so the leading edge stays rounded as it fills */\n border-radius: inherit;\n}\n.eds-pb[data-size=\"Small\"] .eds-pb__fill { border-radius: 4px; }\n.eds-pb[data-size=\"Medium\"] .eds-pb__fill { border-radius: 999px; }\n.eds-pb[data-size=\"Large\"] .eds-pb__fill { border-radius: 999px; }\n\n.eds-pb[data-style=\"AI\"] .eds-pb__fill {\n background: linear-gradient(to right, var(--pb-ai-from), var(--pb-ai-to));\n}\n\n.eds-pb__label {\n flex-shrink: 0;\n color: var(--pb-text-secondary);\n font-weight: 400;\n white-space: nowrap;\n}\n.eds-pb[data-size=\"Small\"] .eds-pb__label { font-size: 12px; line-height: 1.4; letter-spacing: 0.12px; }\n.eds-pb[data-size=\"Medium\"] .eds-pb__label { font-size: 14px; line-height: 1.5; }\n.eds-pb[data-size=\"Large\"] .eds-pb__label { font-size: 16px; line-height: 1.5; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-pb-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-pb-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-pb-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-pb-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-pb-matrix__controls {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n flex-wrap: wrap;\n}\n.eds-pb-matrix__slider {\n flex: 1;\n min-width: 200px;\n accent-color: #306AE8;\n}\n.eds-pb-matrix__readout {\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 13px;\n font-weight: 600;\n color: #0E0E0E;\n min-width: 56px;\n text-align: right;\n}\n.eds-pb-matrix__quickset {\n display: inline-flex;\n gap: 4px;\n}\n.eds-pb-matrix__quickset-btn {\n padding: 4px 10px;\n background: transparent;\n border: 1px solid #DDDDDD;\n border-radius: 4px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 12px;\n color: #5E5E5E;\n}\n.eds-pb-matrix__quickset-btn[data-active=\"true\"] {\n background: #E3ECFF;\n border-color: #306AE8;\n color: #306AE8;\n}\n.eds-pb-matrix__live-grid {\n display: grid;\n grid-template-columns: 100px 1fr 1fr;\n gap: 16px 24px;\n align-items: center;\n}\n.eds-pb-matrix__live-label {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-pb-matrix__live-head {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-pb-matrix__grid {\n display: grid;\n grid-template-columns: 80px repeat(5, 1fr);\n gap: 12px 16px;\n align-items: center;\n}\n.eds-pb-matrix__grid-head {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n text-align: left;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-pb]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-pb\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\nfunction clamp(n: number) {\n if (Number.isNaN(n)) return 0;\n if (n < 0) return 0;\n if (n > 100) return 100;\n return n;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const ProgressBar = React.forwardRef<HTMLDivElement, ProgressBarProps>(\n function ProgressBar(\n {\n progress = 0,\n size = \"Small\",\n style = \"Default\",\n label = false,\n labelText,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const value = clamp(progress);\n const text = labelText ?? `${Math.round(value)}%`;\n const wrapperClass = \"eds-pb\" + (className ? ` ${className}` : \"\");\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-size={size}\n data-style={style}\n >\n <div\n className=\"eds-pb__track\"\n role=\"progressbar\"\n aria-valuenow={value}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-label={ariaLabel ?? labelText ?? `${Math.round(value)} percent`}\n >\n <div className=\"eds-pb__fill\" style={{ width: `${value}%` }} />\n </div>\n {label && <span className=\"eds-pb__label\">{text}</span>}\n </div>\n );\n }\n);\n\nexport default ProgressBar;\n\n// ---------------------------------------------------------------------------\n// ProgressBarMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst SIZES: ProgressBarSize[] = [\"Small\", \"Medium\", \"Large\"];\nconst STYLES: ProgressBarStyle[] = [\"Default\", \"AI\"];\nconst STOPS = [0, 25, 50, 75, 100];\n\nexport function ProgressBarMatrix() {\n ensureStyles();\n\n const [value, setValue] = React.useState(35);\n\n return (\n <div className=\"eds-pb-matrix\">\n <section className=\"eds-pb-matrix__section\">\n <h3 className=\"eds-pb-matrix__heading\">Interactive · live progress</h3>\n <p className=\"eds-pb-matrix__sub\">\n Drag the slider or click a quick-set value to drive every bar below.\n The component accepts any continuous 0–100, not just the five Figma\n stops.\n </p>\n <div className=\"eds-pb-matrix__controls\">\n <input\n type=\"range\"\n min={0}\n max={100}\n value={value}\n onChange={(e) => setValue(Number(e.target.value))}\n className=\"eds-pb-matrix__slider\"\n aria-label=\"Progress value\"\n />\n <span className=\"eds-pb-matrix__readout\">{Math.round(value)}%</span>\n <div className=\"eds-pb-matrix__quickset\" role=\"group\" aria-label=\"Quick set\">\n {STOPS.map((s) => (\n <button\n key={s}\n type=\"button\"\n className=\"eds-pb-matrix__quickset-btn\"\n data-active={value === s || undefined}\n onClick={() => setValue(s)}\n >\n {s}%\n </button>\n ))}\n </div>\n </div>\n\n <div className=\"eds-pb-matrix__live-grid\">\n <span className=\"eds-pb-matrix__live-head\">Size</span>\n <span className=\"eds-pb-matrix__live-head\">Default</span>\n <span className=\"eds-pb-matrix__live-head\">AI</span>\n {SIZES.map((s) => (\n <React.Fragment key={s}>\n <span className=\"eds-pb-matrix__live-label\">{s}</span>\n <ProgressBar progress={value} size={s} style=\"Default\" label />\n <ProgressBar progress={value} size={s} style=\"AI\" label />\n </React.Fragment>\n ))}\n </div>\n </section>\n\n <section className=\"eds-pb-matrix__section\">\n <h3 className=\"eds-pb-matrix__heading\">Progress × Size × Style (static)</h3>\n <p className=\"eds-pb-matrix__sub\">\n The five Figma stops across all size/style combinations. Label\n hidden here so the bars are easier to compare visually.\n </p>\n {STYLES.map((st) => (\n <div key={st}>\n <p className=\"eds-pb-matrix__sub\" style={{ marginBottom: 6 }}>\n Style · {st}\n </p>\n <div className=\"eds-pb-matrix__grid\">\n <span className=\"eds-pb-matrix__grid-head\">Size</span>\n {STOPS.map((s) => (\n <span key={s} className=\"eds-pb-matrix__grid-head\">\n {s}%\n </span>\n ))}\n {SIZES.map((sz) => (\n <React.Fragment key={sz}>\n <span className=\"eds-pb-matrix__live-label\">{sz}</span>\n {STOPS.map((stop) => (\n <ProgressBar\n key={`${st}-${sz}-${stop}`}\n progress={stop}\n size={sz}\n style={st}\n />\n ))}\n </React.Fragment>\n ))}\n </div>\n </div>\n ))}\n </section>\n\n <section className=\"eds-pb-matrix__section\">\n <h3 className=\"eds-pb-matrix__heading\">Label · boolean</h3>\n <p className=\"eds-pb-matrix__sub\">\n With <code>label</code>, the bar shows the percentage to the right.\n Pass <code>labelText</code> to override (e.g. \"3 of 12 uploaded\").\n </p>\n <ProgressBar progress={value} size=\"Medium\" label />\n <ProgressBar progress={value} size=\"Medium\" style=\"AI\" label />\n <ProgressBar progress={value} size=\"Large\" label labelText={`Step ${Math.round(value / 25) + 1} of 5`} />\n </section>\n </div>\n );\n}\n","/**\n * Scrim — React port of Embleema Design System 2.0's Layout/Scrim component\n * (Figma node 5050:7). Full-screen dim overlay used behind modals and\n * dialogs. Single component, no variants.\n *\n * Spec from Figma:\n * - Fill: rgba(14, 14, 14, 0.32) — Text/Primary at 32 % opacity\n * - No blur\n * - Stretches to fill its positioning ancestor (default: viewport via\n * position: fixed)\n *\n * The component is purely decorative (aria-hidden) per Figma's accessibility\n * note. Pair it with a modal that owns the focus trap. Optional `onClick`\n * lets the parent dismiss the modal when the user taps the scrim area.\n */\n\nimport * as React from \"react\";\n\nexport type ScrimProps = {\n /** Render only when true. Default true (let callers handle visibility). */\n visible?: boolean;\n /** Fires when the scrim is clicked — wire to your modal's close handler. */\n onClick?: () => void;\n /** Position mode. \"fixed\" covers the viewport; \"absolute\" fills the nearest\n * positioned ancestor (use for in-page previews). Default \"fixed\". */\n position?: \"fixed\" | \"absolute\";\n /** Stack order. Default 999. */\n zIndex?: number;\n id?: string;\n className?: string;\n /** Optional content to render inside the scrim (e.g. a modal). */\n children?: React.ReactNode;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n:root {\n --scrim-fill: rgba(14, 14, 14, 0.32);\n}\n\n.eds-scrim-overlay {\n inset: 0;\n background: var(--scrim-fill);\n display: flex;\n align-items: center;\n justify-content: center;\n animation: eds-scrim-overlay-in 120ms ease-out;\n}\n.eds-scrim-overlay[data-position=\"fixed\"] { position: fixed; }\n.eds-scrim-overlay[data-position=\"absolute\"] { position: absolute; }\n\n@keyframes eds-scrim-overlay-in {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-scrim-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-scrim-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-scrim-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-scrim-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-scrim-matrix__controls {\n display: inline-flex;\n flex-wrap: wrap;\n gap: 8px;\n align-items: center;\n}\n.eds-scrim-matrix__chip {\n padding: 6px 14px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n transition: background-color 120ms;\n}\n.eds-scrim-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-scrim-matrix__chip[data-active=\"true\"] {\n background: #306AE8;\n color: #FEFEFE;\n border-color: #306AE8;\n}\n.eds-scrim-matrix__hint {\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n\n/* Demo stage — a fake \"screen\" with content behind the scrim. The scrim\n here is absolutely positioned so it fills the stage instead of the\n whole viewport (so the design-system website chrome stays interactive). */\n.eds-scrim-matrix__stage {\n position: relative;\n width: 100%;\n height: 380px;\n background:\n linear-gradient(180deg, #F8F8F8 0%, #FEFEFE 100%);\n border: 1px solid #EEEEEE;\n border-radius: 12px;\n overflow: hidden;\n isolation: isolate;\n}\n.eds-scrim-matrix__content {\n padding: 24px;\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n}\n.eds-scrim-matrix__panel {\n background: #FEFEFE;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n padding: 16px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.eds-scrim-matrix__panel-title {\n font-size: 14px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-scrim-matrix__panel-body {\n font-size: 13px;\n color: #5E5E5E;\n margin: 0;\n line-height: 1.5;\n}\n.eds-scrim-matrix__dialog {\n width: 280px;\n background: #FEFEFE;\n border-radius: 12px;\n box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);\n padding: 20px;\n text-align: center;\n font-family: Nunito, sans-serif;\n}\n.eds-scrim-matrix__dialog-title {\n font-size: 16px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0 0 8px;\n}\n.eds-scrim-matrix__dialog-body {\n font-size: 13px;\n color: #5E5E5E;\n margin: 0 0 16px;\n line-height: 1.5;\n}\n.eds-scrim-matrix__dialog-btn {\n padding: 8px 16px;\n border-radius: 8px;\n background: #306AE8;\n color: #FEFEFE;\n border: 0;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 14px;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-scrim]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-scrim\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Scrim = React.forwardRef<HTMLDivElement, ScrimProps>(\n function Scrim(\n {\n visible = true,\n onClick,\n position = \"fixed\",\n zIndex = 999,\n id,\n className,\n children,\n },\n ref\n ) {\n ensureStyles();\n if (!visible) return null;\n const wrapperClass = \"eds-scrim-overlay\" + (className ? ` ${className}` : \"\");\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-position={position}\n style={{ zIndex }}\n onClick={(e) => {\n if (e.target === e.currentTarget) onClick?.();\n }}\n aria-hidden\n >\n {children}\n </div>\n );\n }\n);\n\nexport default Scrim;\n\n// ---------------------------------------------------------------------------\n// ScrimMatrix — interactive showcase. A fake \"screen\" with content behind\n// the scrim; toggle the scrim on/off and click the scrim to dismiss.\n// ---------------------------------------------------------------------------\nexport function ScrimMatrix() {\n ensureStyles();\n const [open, setOpen] = React.useState(false);\n\n return (\n <div className=\"eds-scrim-matrix\">\n <section className=\"eds-scrim-matrix__section\">\n <h3 className=\"eds-scrim-matrix__heading\">Interactive · toggle scrim over content</h3>\n <p className=\"eds-scrim-matrix__sub\">\n The scrim is a 32 % opacity Text/Primary overlay (\n <code>rgba(14, 14, 14, 0.32)</code>). Click \"Show scrim\" to dim the\n stage below; click the scrim itself or the close button on the demo\n dialog to dismiss. Scoped to the stage with{\" \"}\n <code>position: absolute</code> so the page chrome stays interactive.\n </p>\n <div className=\"eds-scrim-matrix__controls\">\n <button\n type=\"button\"\n className=\"eds-scrim-matrix__chip\"\n data-active={open || undefined}\n onClick={() => setOpen((v) => !v)}\n >\n {open ? \"Hide scrim\" : \"Show scrim\"}\n </button>\n </div>\n <div className=\"eds-scrim-matrix__stage\">\n <div className=\"eds-scrim-matrix__content\">\n <div className=\"eds-scrim-matrix__panel\">\n <p className=\"eds-scrim-matrix__panel-title\">Background panel A</p>\n <p className=\"eds-scrim-matrix__panel-body\">\n Content behind the scrim is visible but visually dimmed so the\n modal in front reads as the active layer.\n </p>\n </div>\n <div className=\"eds-scrim-matrix__panel\">\n <p className=\"eds-scrim-matrix__panel-title\">Background panel B</p>\n <p className=\"eds-scrim-matrix__panel-body\">\n In production, pair the scrim with a focus-trapping modal so\n keyboard users stay inside the dialog while it's open.\n </p>\n </div>\n <div className=\"eds-scrim-matrix__panel\">\n <p className=\"eds-scrim-matrix__panel-title\">Background panel C</p>\n <p className=\"eds-scrim-matrix__panel-body\">\n The scrim itself is decorative (aria-hidden) — accessibility\n comes from the modal it sits behind.\n </p>\n </div>\n <div className=\"eds-scrim-matrix__panel\">\n <p className=\"eds-scrim-matrix__panel-title\">Background panel D</p>\n <p className=\"eds-scrim-matrix__panel-body\">\n Click the scrim to dismiss — the matrix's onClick handler\n closes the overlay.\n </p>\n </div>\n </div>\n <Scrim\n visible={open}\n position=\"absolute\"\n zIndex={5}\n onClick={() => setOpen(false)}\n >\n <div className=\"eds-scrim-matrix__dialog\" onClick={(e) => e.stopPropagation()}>\n <p className=\"eds-scrim-matrix__dialog-title\">Demo dialog</p>\n <p className=\"eds-scrim-matrix__dialog-body\">\n In real usage this would be a Modal, ModalFlexible, ModalSurvey,\n or any custom dialog. The scrim sits at z-index 5; the dialog\n renders inside it.\n </p>\n <button\n type=\"button\"\n className=\"eds-scrim-matrix__dialog-btn\"\n onClick={() => setOpen(false)}\n >\n Close\n </button>\n </div>\n </Scrim>\n </div>\n <p className=\"eds-scrim-matrix__hint\">\n State: <strong>{open ? \"Visible\" : \"Hidden\"}</strong>\n </p>\n </section>\n </div>\n );\n}\n","/**\n * SectionHeader — Disclosure header for eCRF clinical forms.\n *\n * React port of Embleema Design System 2.0's Clinical/Section Header\n * (Figma node 5017:38). A full-width row with the label left-aligned and\n * a chevron right-aligned that toggles the section open/closed.\n *\n * Layout (matches Figma exactly):\n * button (px 16, py 12, gap 8, radius 8, bg Background/Primary #F8F8F8)\n * ├── label (Nunito Regular 20 / 1.2, Text/Primary, flex: 1, left)\n * └── chevron (24 × 24, Neutral/500 #848484, right)\n * - Collapsed: chevron-down (▼)\n * - Expanded: chevron-up (▲) — same SVG rotated 180°\n *\n * Props:\n * - state : forced override (Collapsed | Expanded)\n * - defaultState : uncontrolled initial state (default \"Collapsed\")\n * - onStateChange : called with the new state on click / keyboard activate\n * - label : section label text (default \"Label\")\n * - children : content rendered below the header when Expanded; omit\n * for a header-only element\n */\n\nimport * as React from \"react\";\n\nexport type SectionHeaderState = \"Collapsed\" | \"Expanded\";\n\nexport type SectionHeaderProps = {\n state?: SectionHeaderState;\n defaultState?: SectionHeaderState;\n onStateChange?: (next: SectionHeaderState) => void;\n label?: string;\n children?: React.ReactNode;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400&display=swap\");\n\n:root {\n --sh-bg-primary: #F8F8F8;\n --sh-bg-hover: #F1F1F1;\n --sh-text-primary: #0E0E0E;\n --sh-chevron: #848484; /* Neutral/500 */\n --sh-action-primary: #306AE8;\n --sh-border-default: #DDDDDD;\n}\n\n.eds-sh {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n padding: 12px 16px;\n background: var(--sh-bg-primary);\n border: 0;\n border-radius: 8px;\n width: 100%;\n box-sizing: border-box;\n font-family: Nunito, sans-serif;\n color: var(--sh-text-primary);\n cursor: pointer;\n user-select: none;\n text-align: left;\n transition: background-color 120ms ease-out;\n}\n.eds-sh:hover { background: var(--sh-bg-hover); }\n.eds-sh:focus-visible {\n outline: 2px solid var(--sh-action-primary);\n outline-offset: 2px;\n}\n\n/* Label sits on the left and stretches; chevron sits on the right. */\n.eds-sh__label {\n flex: 1 1 0;\n min-width: 0;\n font-size: 20px;\n font-weight: 400;\n line-height: 1.2;\n color: var(--sh-text-primary);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 0;\n}\n\n/* Trailing chevron — Neutral/500 gray. One SVG, rotated 180° between\n states with a short transition so the toggle reads as continuous motion. */\n.eds-sh__chevron {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--sh-chevron);\n transform: rotate(0deg); /* Collapsed → points down */\n transition: transform 180ms ease-out;\n}\n.eds-sh[data-state=\"Expanded\"] .eds-sh__chevron {\n transform: rotate(180deg); /* Expanded → points up */\n}\n.eds-sh__chevron svg { display: block; width: 100%; height: 100%; }\n\n/* Disclosure body — only rendered when Expanded AND children are provided. */\n.eds-sh__body {\n padding: 16px;\n background: #FEFEFE;\n border: 1px solid var(--sh-border-default);\n border-top: 0;\n border-radius: 0 0 8px 8px;\n margin-top: -8px;\n}\n\n/* =============================================================\n Matrix showcase — interactive only.\n ============================================================= */\n.eds-sh-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 32px;\n display: flex;\n flex-direction: column;\n gap: 16px;\n background: #FEFEFE;\n}\n.eds-sh-matrix__stack {\n display: flex;\n flex-direction: column;\n gap: 8px;\n max-width: 680px;\n}\n.eds-sh-matrix__filler {\n font-size: 14px;\n color: #5E5E5E;\n line-height: 1.5;\n margin: 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-sectionheader]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-sectionheader\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Chevron — single down-pointing chevron path (Figma node 4052:3006).\n// CSS rotation flips it 180° in the Expanded state.\n// ---------------------------------------------------------------------------\nfunction Chevron() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(3 7)\">\n <path\n fill=\"currentColor\"\n d=\"M8.86793 10C8.6678 10 8.48152 9.96803 8.30907 9.90409C8.13663 9.84015 7.97263 9.73054 7.81707 9.57525L0.353086 2.11127C0.123344 1.88126 0.00570474 1.59214 0.00016879 1.24393C-0.00509036 0.895994 0.112549 0.601619 0.353086 0.360806C0.593899 0.120269 0.885643 0 1.22832 0C1.57099 0 1.86274 0.120269 2.10355 0.360806L8.86793 7.1256L15.6323 0.360806C15.8623 0.131064 16.1514 0.0134248 16.4996 0.00788883C16.8476 0.00262968 17.142 0.120269 17.3828 0.360806C17.6233 0.601619 17.7436 0.893365 17.7436 1.23604C17.7436 1.57871 17.6233 1.87046 17.3828 2.11127L9.91879 9.57525C9.76323 9.73054 9.59923 9.84015 9.42678 9.90409C9.25434 9.96803 9.06805 10 8.86793 10Z\"\n />\n </g>\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const SectionHeader = React.forwardRef<HTMLButtonElement, SectionHeaderProps>(\n function SectionHeader(\n {\n state,\n defaultState = \"Collapsed\",\n onStateChange,\n label = \"Label\",\n children,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = state !== undefined;\n const [internalState, setInternalState] =\n React.useState<SectionHeaderState>(defaultState);\n const current: SectionHeaderState = isControlled ? state : internalState;\n const isExpanded = current === \"Expanded\";\n\n const toggle = () => {\n const next: SectionHeaderState = isExpanded ? \"Collapsed\" : \"Expanded\";\n if (!isControlled) setInternalState(next);\n onStateChange?.(next);\n };\n\n const wrapperClass = \"eds-sh\" + (className ? ` ${className}` : \"\");\n\n const headerButton = (\n <button\n ref={ref}\n id={id}\n type=\"button\"\n className={wrapperClass}\n data-state={current}\n aria-expanded={isExpanded}\n aria-label={ariaLabel ?? label}\n onClick={toggle}\n >\n <span className=\"eds-sh__label\">{label}</span>\n <span className=\"eds-sh__chevron\" aria-hidden>\n <Chevron />\n </span>\n </button>\n );\n\n if (!children) return headerButton;\n\n return (\n <div>\n {headerButton}\n {isExpanded && <div className=\"eds-sh__body\">{children}</div>}\n </div>\n );\n }\n);\n\nexport default SectionHeader;\n\n// ---------------------------------------------------------------------------\n// SectionHeaderMatrix — interactive showcase (click to toggle).\n// ---------------------------------------------------------------------------\nexport function SectionHeaderMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-sh-matrix\">\n <div className=\"eds-sh-matrix__stack\">\n <SectionHeader label=\"Demographics\">\n <p className=\"eds-sh-matrix__filler\">\n Section body content goes here. Could be a stack of form fields,\n a list, or any other content the parent app composes.\n </p>\n <p className=\"eds-sh-matrix__filler\">\n Click the header again to collapse this panel.\n </p>\n </SectionHeader>\n\n <SectionHeader label=\"Vital Signs\" />\n <SectionHeader label=\"Laboratory Results\" />\n <SectionHeader label=\"Informed Consent\" />\n <SectionHeader label=\"Adverse Events\" />\n </div>\n </div>\n );\n}\n","/**\n * SelectorOptionGroup — React port of Embleema Design System 2.0's\n * Input/Selector Option Group (Figma node 4659:953). Groups multiple\n * SelectorOption rows together with a shared label, single- or multi-select\n * behavior, and group-level validation.\n *\n * Structure (per Figma):\n * wrapper (LabelPosition=Top)\n * ├── Label\n * ├── Options column (gap 12)\n * │ └── SelectorOption × N\n * └── HelperText (Error only) ── Alert icon + message\n *\n * wrapper (LabelPosition=Left)\n * ├── Label slot (fixed 120 px column)\n * └── Right column\n * ├── Options column\n * └── HelperText (Error only)\n *\n * Selection model:\n * - SelectionType=\"Single\" → radio behavior. `value` is a single string.\n * - SelectionType=\"Multi\" → checkbox behavior. `value` is a string[].\n *\n * Group state propagation to each SelectorOption:\n * - Default → child renders as Default / Selected based on per-option state\n * - Error → child gets state=\"Error\"\n * - Disabled → child gets state=\"DisabledSelected\" or \"DisabledUnselected\"\n * - ReadOnly → child gets state=\"ReadOnlySelected\" or \"ReadOnlyUnselected\"\n */\n\nimport * as React from \"react\";\nimport { SelectorOption } from \"./SelectorOption\";\nimport type { SelectorOptionState } from \"./SelectorOption\";\nimport { Label } from \"./Label\";\n\nexport type SelectorOptionGroupState =\n | \"Default\"\n | \"Error\"\n | \"Disabled\"\n | \"ReadOnly\";\nexport type SelectorOptionGroupLabelPosition = \"Top\" | \"Left\";\nexport type SelectorOptionGroupSelectionType = \"Single\" | \"Multi\";\n\nexport type SelectorOptionItem = {\n value: string;\n label: string;\n};\n\nexport type SelectorOptionGroupProps = {\n state?: SelectorOptionGroupState;\n labelPosition?: SelectorOptionGroupLabelPosition;\n selectionType?: SelectorOptionGroupSelectionType;\n /** false hides the label, true uses DEFAULT_LABEL, string overrides. */\n label?: boolean | string;\n required?: boolean;\n /** Controlled. Single → string. Multi → string[]. */\n value?: string | string[];\n /** Uncontrolled initial selection. */\n defaultValue?: string | string[];\n onChange?: (next: string | string[]) => void;\n options: SelectorOptionItem[];\n /** Shown beneath the options when state=\"Error\". */\n helperText?: string;\n /** Shared `name` for the underlying inputs (radio grouping in Single mode). */\n name?: string;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Label\";\nconst DEFAULT_ERROR_HELPER = \"This question is required\";\nconst LEFT_LABEL_WIDTH = 120;\n\n// ---------------------------------------------------------------------------\n// Styles\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --sog-text-primary: #0E0E0E;\n --sog-feedback-error-text: #B31A1A;\n --sog-border-error: #E02020;\n}\n\n.eds-sog {\n display: flex;\n font-family: Nunito, sans-serif;\n color: var(--sog-text-primary);\n width: 100%;\n box-sizing: border-box;\n}\n.eds-sog[data-label-position=\"Top\"] {\n flex-direction: column;\n align-items: stretch;\n gap: 12px;\n}\n.eds-sog[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 16px;\n}\n\n.eds-sog__label-slot {\n display: flex;\n align-items: center;\n}\n.eds-sog[data-label-position=\"Left\"] .eds-sog__label-slot {\n width: ${LEFT_LABEL_WIDTH}px;\n flex-shrink: 0;\n padding-top: 12px;\n}\n\n.eds-sog__content {\n display: flex;\n flex-direction: column;\n gap: 12px;\n min-width: 0;\n flex: 1 1 auto;\n}\n\n.eds-sog__options {\n display: flex;\n flex-direction: column;\n gap: 12px;\n align-items: stretch;\n width: 100%;\n}\n\n/* HelperText row — alert icon + message, Feedback/Error/Text. Shown only\n in the Error state. */\n.eds-sog__helper {\n display: flex;\n align-items: flex-start;\n gap: 4px;\n padding: 1px 0;\n color: var(--sog-feedback-error-text);\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 14px;\n line-height: 1.5;\n}\n.eds-sog__helper-icon {\n display: inline-flex;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n}\n.eds-sog__helper-icon svg { width: 100%; height: 100%; display: block; }\n.eds-sog__helper-text { flex: 1 1 0; min-width: 0; word-break: break-word; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-selector-option-group]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-selector-option-group\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — inline Icon/Status/Alert (4052:2918) for the error helper row. Same\n// path data the Snackbar/Alert components use.\n// ---------------------------------------------------------------------------\nfunction AlertIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2)\">\n <path\n fill=\"currentColor\"\n d=\"M10 14.9797C10.2409 14.9797 10.4428 14.8982 10.6058 14.7353C10.7688 14.5723 10.8503 14.3704 10.8503 14.1295C10.8503 13.8886 10.7688 13.6867 10.6058 13.5237C10.4428 13.3609 10.2409 13.2795 10 13.2795C9.75912 13.2795 9.55719 13.3609 9.39421 13.5237C9.23123 13.6867 9.14974 13.8886 9.14974 14.1295C9.14974 14.3704 9.23123 14.5723 9.39421 14.7353C9.55719 14.8982 9.75912 14.9797 10 14.9797ZM10.0003 11.1337C10.2241 11.1337 10.4116 11.058 10.5626 10.9066C10.7139 10.7554 10.7895 10.5679 10.7895 10.3442V5.60737C10.7895 5.38368 10.7138 5.19614 10.5624 5.04474C10.411 4.89351 10.2234 4.8179 9.99974 4.8179C9.77588 4.8179 9.58842 4.89351 9.43737 5.04474C9.28614 5.19614 9.21053 5.38368 9.21053 5.60737V10.3442C9.21053 10.5679 9.28623 10.7554 9.43763 10.9066C9.58904 11.058 9.77658 11.1337 10.0003 11.1337ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\nfunction isMultiValue(v: string | string[] | undefined): v is string[] {\n return Array.isArray(v);\n}\n\nfunction normalizeValue(\n v: string | string[] | undefined,\n selectionType: SelectorOptionGroupSelectionType\n): string | string[] {\n if (selectionType === \"Multi\") {\n if (v === undefined) return [];\n return isMultiValue(v) ? v : [v];\n }\n if (v === undefined) return \"\";\n return isMultiValue(v) ? (v[0] ?? \"\") : v;\n}\n\nfunction isSelected(\n optionValue: string,\n current: string | string[],\n selectionType: SelectorOptionGroupSelectionType\n): boolean {\n if (selectionType === \"Multi\") {\n return isMultiValue(current) ? current.includes(optionValue) : false;\n }\n return current === optionValue;\n}\n\n// Translate the group-level state + per-option selected boolean into the\n// SelectorOption `state` enum that controls the child's chrome.\nfunction childState(\n groupState: SelectorOptionGroupState,\n selected: boolean\n): SelectorOptionState | undefined {\n switch (groupState) {\n case \"Error\":\n return \"Error\";\n case \"Disabled\":\n return selected ? \"DisabledSelected\" : \"DisabledUnselected\";\n case \"ReadOnly\":\n return selected ? \"ReadOnlySelected\" : \"ReadOnlyUnselected\";\n default:\n return undefined; // let the child derive from `selected` itself\n }\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const SelectorOptionGroup = React.forwardRef<HTMLDivElement, SelectorOptionGroupProps>(\n function SelectorOptionGroup(\n {\n state = \"Default\",\n labelPosition = \"Top\",\n selectionType = \"Single\",\n label = true,\n required = false,\n value,\n defaultValue,\n onChange,\n options,\n helperText,\n name,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = value !== undefined;\n const [internal, setInternal] = React.useState<string | string[]>(() =>\n normalizeValue(defaultValue, selectionType)\n );\n const current = normalizeValue(\n isControlled ? value : internal,\n selectionType\n );\n\n const isError = state === \"Error\";\n const isLocked = state === \"Disabled\" || state === \"ReadOnly\";\n\n const commit = (next: string | string[]) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const handleOptionChange = (optionValue: string, nextSelected: boolean) => {\n if (isLocked) return;\n if (selectionType === \"Single\") {\n // Radio: selecting always sets; clicking the already-selected option\n // is a no-op (no toggle-off, matching native radio behavior).\n if (nextSelected) commit(optionValue);\n return;\n }\n // Multi: toggle membership.\n const arr = isMultiValue(current) ? current : [];\n const next = nextSelected\n ? arr.includes(optionValue) ? arr : [...arr, optionValue]\n : arr.filter((v) => v !== optionValue);\n commit(next);\n };\n\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n const wrapperClass = \"eds-sog\" + (className ? ` ${className}` : \"\");\n const groupRole = selectionType === \"Single\" ? \"radiogroup\" : \"group\";\n\n const labelEl = label ? (\n <div className=\"eds-sog__label-slot\">\n <Label\n size=\"Small\"\n required={required}\n tooltip={false}\n htmlFor={id}\n >\n {labelText}\n </Label>\n </div>\n ) : null;\n\n const optionsEl = (\n <div className=\"eds-sog__options\" role={groupRole} aria-label={ariaLabel ?? labelText}>\n {options.map((opt) => {\n const selected = isSelected(opt.value, current, selectionType);\n const forcedState = childState(state, selected);\n return (\n <SelectorOption\n key={opt.value}\n label={opt.label}\n value={opt.value}\n name={name}\n radio={selectionType === \"Single\"}\n checkbox={selectionType === \"Multi\"}\n selected={selected}\n state={forcedState}\n onChange={(s) => handleOptionChange(opt.value, s)}\n />\n );\n })}\n </div>\n );\n\n const helperEl = isError ? (\n <div className=\"eds-sog__helper\" role=\"alert\">\n <span className=\"eds-sog__helper-icon\" aria-hidden><AlertIcon /></span>\n <span className=\"eds-sog__helper-text\">\n {helperText ?? DEFAULT_ERROR_HELPER}\n </span>\n </div>\n ) : null;\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-state={state}\n data-label-position={labelPosition}\n data-selection-type={selectionType}\n >\n {labelEl}\n {labelPosition === \"Top\" ? (\n <>\n {optionsEl}\n {helperEl}\n </>\n ) : (\n <div className=\"eds-sog__content\">\n {optionsEl}\n {helperEl}\n </div>\n )}\n </div>\n );\n }\n);\n\nexport default SelectorOptionGroup;\n\n// ---------------------------------------------------------------------------\n// SelectorOptionGroupMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst SAMPLE_OPTIONS: SelectorOptionItem[] = [\n { value: \"option-1\", label: \"Option 1\" },\n { value: \"option-2\", label: \"Option 2\" },\n { value: \"option-3\", label: \"Option 3\" },\n { value: \"option-4\", label: \"Option 4\" },\n { value: \"option-5\", label: \"Option 5\" },\n];\n\nconst STATES: SelectorOptionGroupState[] = [\"Default\", \"Error\", \"Disabled\", \"ReadOnly\"];\n\nexport function SelectorOptionGroupMatrix() {\n ensureStyles();\n const [single, setSingle] = React.useState<string>(\"option-2\");\n const [multi, setMulti] = React.useState<string[]>([\"option-1\", \"option-3\"]);\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive — Single (radio)\n </p>\n <div style={{ maxWidth: 320 }}>\n <SelectorOptionGroup\n label=\"Pick one option\"\n selectionType=\"Single\"\n options={SAMPLE_OPTIONS}\n value={single}\n onChange={(v) => setSingle(v as string)}\n name=\"sog-demo-single\"\n />\n </div>\n <p style={{ fontSize: 12, color: \"#5E5E5E\", margin: 0 }}>\n Current value: <strong>{single}</strong>\n </p>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive — Multi (checkbox)\n </p>\n <div style={{ maxWidth: 320 }}>\n <SelectorOptionGroup\n label=\"Pick all that apply\"\n selectionType=\"Multi\"\n options={SAMPLE_OPTIONS}\n value={multi}\n onChange={(v) => setMulti(v as string[])}\n name=\"sog-demo-multi\"\n />\n </div>\n <p style={{ fontSize: 12, color: \"#5E5E5E\", margin: 0 }}>\n Current value: <strong>{multi.join(\", \") || \"(none)\"}</strong>\n </p>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n State · Single · LabelPosition=Top\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(220px, 1fr))\", gap: 24, alignItems: \"start\" }}>\n {STATES.map((st) => (\n <SelectorOptionGroup\n key={st}\n label={st}\n required={st === \"Error\"}\n state={st}\n selectionType=\"Single\"\n options={SAMPLE_OPTIONS}\n defaultValue={st === \"Default\" ? \"option-1\" : \"option-2\"}\n />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n State · Multi · LabelPosition=Top\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(220px, 1fr))\", gap: 24, alignItems: \"start\" }}>\n {STATES.map((st) => (\n <SelectorOptionGroup\n key={st}\n label={st}\n required={st === \"Error\"}\n state={st}\n selectionType=\"Multi\"\n options={SAMPLE_OPTIONS}\n defaultValue={st === \"Default\" ? [\"option-1\"] : [\"option-2\", \"option-4\"]}\n />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n LabelPosition=Left · Single + Multi\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 24, maxWidth: 600 }}>\n <SelectorOptionGroup\n label=\"Single\"\n labelPosition=\"Left\"\n selectionType=\"Single\"\n options={SAMPLE_OPTIONS}\n defaultValue=\"option-3\"\n />\n <SelectorOptionGroup\n label=\"Multi\"\n labelPosition=\"Left\"\n selectionType=\"Multi\"\n options={SAMPLE_OPTIONS}\n defaultValue={[\"option-2\", \"option-5\"]}\n />\n <SelectorOptionGroup\n label=\"Error\"\n labelPosition=\"Left\"\n state=\"Error\"\n required\n selectionType=\"Single\"\n options={SAMPLE_OPTIONS}\n />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * SliderBar — React port of the Embleema Design System 2.0 Input/Slider Bar\n * (Figma node 4543:141). Interactive slider with four types:\n * - Continuous: smooth dragging from min to max\n * - Discrete: snaps to evenly-spaced steps (tick marks on the track)\n * - Range: two thumbs for min/max selection\n * - Scale: continuous-style drag, but track shows a blue→pink gradient\n *\n * Dimensions and color bindings pulled directly from Figma:\n * - Track: 8px tall, 100px radius\n * - Thumb: 24px circle, Action/Primary/Background (#306AE8) by default,\n * Neutral/300 (#DDDDDD) when disabled, white-bordered when Scale\n * - Track bg: Background/Selected (#E3ECFF) with Border/Focus-Ring\n * (#A2BDF5) 1px outline\n * - Active fill: gradient Blue/300 (#6694FA) → Blue/200 (#A2BDF5)\n * - Scale track: linear gradient that mimics the radial blue→pink asset\n * - Disabled track: Background/Disabled (#F1F1F1) with Neutral/300 fill\n * - Number bubble (Active): Action/Primary/Background border, 4px radius\n *\n * \"Active\" state in Figma is forced for layout — at runtime it lights up\n * automatically while the user is dragging a thumb.\n */\n\nimport * as React from \"react\";\n\nexport type SliderBarType = \"Continuous\" | \"Discrete\" | \"Range\" | \"Scale\";\nexport type SliderBarState = \"Default\" | \"Active\" | \"Disabled\";\n\nexport type SliderBarProps = {\n type?: SliderBarType;\n /** Force a visual state. When omitted, Active is derived from drag state. */\n state?: SliderBarState;\n min?: number;\n max?: number;\n /** Step for Discrete (default 1). Continuous/Scale/Range ignore. */\n step?: number;\n /** Number of tick marks for Discrete/Range (default 11 — 0,10,…,100). */\n ticks?: number;\n /** Single value (Continuous / Discrete / Scale) or [min, max] (Range). */\n value?: number | [number, number];\n defaultValue?: number | [number, number];\n onChange?: (value: number | [number, number]) => void;\n disabled?: boolean;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — injected once.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500&display=swap\");\n\n:root {\n --sb-text-primary: #0E0E0E;\n --sb-text-tertiary: #848484;\n --sb-action-primary: #306AE8;\n --sb-action-primary-text: #FEFEFE;\n --sb-bg-default: #FEFEFE;\n --sb-bg-selected: #E3ECFF;\n --sb-bg-field: #F8F8F8;\n --sb-bg-disabled: #F1F1F1;\n --sb-border-focusring: #A2BDF5;\n --sb-neutral-300: #DDDDDD;\n --sb-fill-blue-300: #6694FA;\n --sb-fill-blue-200: #A2BDF5;\n --sb-fill-pink-400: #C20A72;\n --sb-fill-pink-500: #9B085B;\n}\n\n.eds-sb {\n position: relative;\n width: 100%;\n min-width: 200px;\n height: 24px;\n font-family: Nunito, sans-serif;\n touch-action: none;\n user-select: none;\n}\n.eds-sb[data-disabled=\"true\"] { cursor: not-allowed; }\n\n.eds-sb__track {\n position: absolute;\n top: 8px;\n left: 0;\n right: 0;\n height: 8px;\n border-radius: 100px;\n background: var(--sb-bg-selected);\n border: 1px solid var(--sb-border-focusring);\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.08);\n box-sizing: border-box;\n overflow: hidden;\n}\n.eds-sb[data-disabled=\"true\"] .eds-sb__track {\n background: var(--sb-bg-disabled);\n border-color: var(--sb-bg-disabled);\n}\n.eds-sb[data-type=\"Scale\"] .eds-sb__track {\n background: linear-gradient(to right, #A2BDF5 0%, #6694FA 28%, #6F59CF 50%, #C20A72 78%, #9B085B 100%);\n overflow: visible;\n}\n.eds-sb[data-type=\"Scale\"][data-disabled=\"true\"] .eds-sb__track {\n background: var(--sb-bg-disabled);\n}\n\n.eds-sb__fill {\n position: absolute;\n top: 0;\n bottom: 0;\n border-radius: 100px;\n background: linear-gradient(to bottom, var(--sb-fill-blue-300) 0%, var(--sb-fill-blue-200) 100%);\n}\n.eds-sb[data-disabled=\"true\"] .eds-sb__fill {\n background: var(--sb-neutral-300);\n}\n.eds-sb[data-type=\"Scale\"] .eds-sb__fill { display: none; }\n\n.eds-sb__ticks {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 8px;\n pointer-events: none;\n}\n.eds-sb__tick {\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background: var(--sb-action-primary);\n}\n.eds-sb[data-disabled=\"true\"] .eds-sb__tick {\n background: var(--sb-neutral-300);\n}\n\n.eds-sb__thumb {\n position: absolute;\n top: 0;\n width: 24px;\n height: 24px;\n border-radius: 50%;\n background: var(--sb-action-primary);\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.08);\n cursor: grab;\n transform: translateX(-50%);\n z-index: 2;\n transition: box-shadow 100ms;\n box-sizing: border-box;\n}\n.eds-sb__thumb:focus-visible {\n outline: 2px solid var(--sb-border-focusring);\n outline-offset: 2px;\n}\n.eds-sb__thumb:active,\n.eds-sb__thumb[data-dragging=\"true\"] {\n cursor: grabbing;\n box-shadow: 0 0 0 6px rgba(48, 106, 232, 0.16), 0 0 4px 0 rgba(0, 0, 0, 0.08);\n}\n.eds-sb[data-disabled=\"true\"] .eds-sb__thumb {\n background: var(--sb-neutral-300);\n cursor: not-allowed;\n}\n.eds-sb[data-type=\"Scale\"] .eds-sb__thumb {\n background: var(--sb-bg-default);\n border: 4px solid var(--sb-action-primary);\n}\n.eds-sb[data-type=\"Scale\"][data-disabled=\"true\"] .eds-sb__thumb {\n background: var(--sb-bg-default);\n border-color: var(--sb-neutral-300);\n}\n\n/* Active number bubble — anchored to the thumb, floats 34px above it. */\n.eds-sb__bubble {\n position: absolute;\n bottom: calc(100% + 6px);\n left: 50%;\n transform: translateX(-50%);\n background: var(--sb-bg-field);\n border: 1px solid var(--sb-action-primary);\n border-radius: 4px;\n padding: 2px 8px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.4;\n color: var(--sb-text-primary);\n filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.12));\n white-space: nowrap;\n pointer-events: none;\n}\n.eds-sb__bubble::after {\n content: \"\";\n position: absolute;\n top: 100%;\n left: 50%;\n transform: translateX(-50%);\n width: 0;\n height: 0;\n border-left: 5px solid transparent;\n border-right: 5px solid transparent;\n border-top: 6px solid var(--sb-action-primary);\n}\n.eds-sb__bubble::before {\n content: \"\";\n position: absolute;\n top: calc(100% - 1px);\n left: 50%;\n transform: translateX(-50%);\n width: 0;\n height: 0;\n border-left: 4px solid transparent;\n border-right: 4px solid transparent;\n border-top: 5px solid var(--sb-bg-field);\n z-index: 1;\n}\n\n/* Scale ticks — labeled marks at min, 25%, 50%, 75%, max. */\n.eds-sb__scale-labels {\n position: absolute;\n top: 22px;\n left: 0;\n right: 0;\n display: flex;\n justify-content: space-between;\n font-family: Nunito, sans-serif;\n font-size: 11px;\n color: var(--sb-text-tertiary);\n pointer-events: none;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-slider-bar]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-slider-bar\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\nfunction clamp(v: number, min: number, max: number): number {\n return Math.max(min, Math.min(max, v));\n}\nfunction snap(v: number, min: number, step: number): number {\n return min + Math.round((v - min) / step) * step;\n}\nfunction pctOf(v: number, min: number, max: number): number {\n return ((v - min) / (max - min)) * 100;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const SliderBar = React.forwardRef<HTMLDivElement, SliderBarProps>(\n function SliderBar(\n {\n type = \"Continuous\",\n state,\n min = 0,\n max = 100,\n step = 1,\n ticks = 11,\n value,\n defaultValue,\n onChange,\n disabled = false,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isRange = type === \"Range\";\n const isControlled = value !== undefined;\n\n // Internal state holds either a single number or a tuple. Seeded from\n // defaults that respect the type.\n const [internal, setInternal] = React.useState<number | [number, number]>(() => {\n if (defaultValue !== undefined) return defaultValue;\n if (isRange) return [min, max];\n return min;\n });\n const current = isControlled ? value! : internal;\n\n // Track which thumb is being dragged (\"min\" / \"max\" for Range, \"single\"\n // for the other types). Null means not dragging.\n const [dragging, setDragging] = React.useState<null | \"single\" | \"min\" | \"max\">(null);\n\n const trackRef = React.useRef<HTMLDivElement | null>(null);\n\n const commit = (next: number | [number, number]) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n // Convert a pointer client X to a value, snapping for Discrete.\n const xToValue = (clientX: number): number => {\n const trackEl = trackRef.current;\n if (!trackEl) return min;\n const rect = trackEl.getBoundingClientRect();\n const pct = clamp((clientX - rect.left) / rect.width, 0, 1);\n let v = min + pct * (max - min);\n if (type === \"Discrete\") v = snap(v, min, step);\n return clamp(v, min, max);\n };\n\n // Pointer move while dragging — global listener so cursor can leave the\n // track and the drag still tracks.\n React.useEffect(() => {\n if (!dragging || disabled) return;\n const onMove = (e: PointerEvent) => {\n const v = xToValue(e.clientX);\n if (isRange && Array.isArray(current)) {\n const [lo, hi] = current;\n if (dragging === \"min\") commit([Math.min(v, hi), hi]);\n else if (dragging === \"max\") commit([lo, Math.max(v, lo)]);\n } else {\n commit(v);\n }\n };\n const onUp = () => setDragging(null);\n document.addEventListener(\"pointermove\", onMove);\n document.addEventListener(\"pointerup\", onUp);\n document.addEventListener(\"pointercancel\", onUp);\n return () => {\n document.removeEventListener(\"pointermove\", onMove);\n document.removeEventListener(\"pointerup\", onUp);\n document.removeEventListener(\"pointercancel\", onUp);\n };\n }, [dragging, disabled, isRange, current, min, max, step, type]); // eslint-disable-line\n\n const startDrag = (which: \"single\" | \"min\" | \"max\") => (e: React.PointerEvent) => {\n if (disabled) return;\n (e.target as HTMLElement).setPointerCapture?.(e.pointerId);\n setDragging(which);\n };\n\n // Click on the track (not on a thumb) — jump the nearest thumb there.\n const handleTrackPointerDown: React.PointerEventHandler<HTMLDivElement> = (e) => {\n if (disabled) return;\n // Ignore clicks on the thumb itself (its own handler takes over).\n if ((e.target as HTMLElement).classList.contains(\"eds-sb__thumb\")) return;\n const v = xToValue(e.clientX);\n if (isRange && Array.isArray(current)) {\n const [lo, hi] = current;\n // Move whichever thumb is closer.\n const which = Math.abs(v - lo) <= Math.abs(v - hi) ? \"min\" : \"max\";\n if (which === \"min\") commit([Math.min(v, hi), hi]);\n else commit([lo, Math.max(v, lo)]);\n setDragging(which);\n } else {\n commit(v);\n setDragging(\"single\");\n }\n };\n\n const handleKey = (which: \"single\" | \"min\" | \"max\") => (\n e: React.KeyboardEvent<HTMLDivElement>\n ) => {\n if (disabled) return;\n const delta = e.key === \"ArrowRight\" || e.key === \"ArrowUp\" ? 1\n : e.key === \"ArrowLeft\" || e.key === \"ArrowDown\" ? -1\n : 0;\n if (!delta) return;\n e.preventDefault();\n const incr = type === \"Discrete\" ? step : (max - min) / 100;\n if (isRange && Array.isArray(current)) {\n const [lo, hi] = current;\n if (which === \"min\") commit([clamp(lo + delta * incr, min, hi), hi]);\n else commit([lo, clamp(hi + delta * incr, lo, max)]);\n } else if (typeof current === \"number\") {\n commit(clamp(current + delta * incr, min, max));\n }\n };\n\n // Derived display state. If `state` is forced, use it; otherwise Active\n // appears while a thumb is being dragged.\n const visualState: SliderBarState =\n state ?? (disabled ? \"Disabled\" : dragging ? \"Active\" : \"Default\");\n\n const wrapperClass = \"eds-sb\" + (className ? ` ${className}` : \"\");\n\n const formatLabel = (v: number) => {\n if (type === \"Discrete\" && step >= 1) return String(Math.round(v));\n return String(Math.round(v));\n };\n\n const renderThumb = (\n key: string,\n which: \"single\" | \"min\" | \"max\",\n pct: number,\n v: number\n ) => {\n const forceActive = state === \"Active\";\n const isActive = forceActive || dragging === which;\n return (\n <div\n key={key}\n role=\"slider\"\n tabIndex={disabled ? -1 : 0}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={v}\n aria-disabled={disabled || undefined}\n aria-label={\n ariaLabel\n ? `${ariaLabel}${which !== \"single\" ? ` ${which}` : \"\"}`\n : which === \"min\" ? \"Minimum\"\n : which === \"max\" ? \"Maximum\"\n : \"Value\"\n }\n className=\"eds-sb__thumb\"\n data-dragging={dragging === which || undefined}\n style={{ left: `${pct}%` }}\n onPointerDown={startDrag(which)}\n onKeyDown={handleKey(which)}\n >\n {isActive && !disabled && (\n <span className=\"eds-sb__bubble\">{formatLabel(v)}</span>\n )}\n </div>\n );\n };\n\n const showTicks = type === \"Discrete\" || type === \"Range\";\n\n return (\n <div\n ref={ref}\n className={wrapperClass}\n data-type={type}\n data-state={visualState}\n data-disabled={disabled || undefined}\n >\n <div\n className=\"eds-sb__track\"\n ref={trackRef}\n onPointerDown={handleTrackPointerDown}\n >\n {/* Fill — between 0 and thumb, or between thumbs for Range. */}\n {!isRange && typeof current === \"number\" && type !== \"Scale\" && (\n <div\n className=\"eds-sb__fill\"\n style={{ left: 0, width: `${pctOf(current, min, max)}%` }}\n />\n )}\n {isRange && Array.isArray(current) && (\n <div\n className=\"eds-sb__fill\"\n style={{\n left: `${pctOf(current[0], min, max)}%`,\n width: `${pctOf(current[1], min, max) - pctOf(current[0], min, max)}%`,\n }}\n />\n )}\n\n {/* Tick marks for Discrete and Range. */}\n {showTicks && (\n <div className=\"eds-sb__ticks\">\n {Array.from({ length: ticks }, (_, i) => (\n <span key={i} className=\"eds-sb__tick\" />\n ))}\n </div>\n )}\n </div>\n\n {/* Thumbs */}\n {!isRange && typeof current === \"number\" &&\n renderThumb(\"single\", \"single\", pctOf(current, min, max), current)}\n {isRange && Array.isArray(current) && (\n <>\n {renderThumb(\"min\", \"min\", pctOf(current[0], min, max), current[0])}\n {renderThumb(\"max\", \"max\", pctOf(current[1], min, max), current[1])}\n </>\n )}\n\n {/* Scale axis labels — five evenly-spaced values along the bottom. */}\n {type === \"Scale\" && (\n <div className=\"eds-sb__scale-labels\" aria-hidden>\n {Array.from({ length: 5 }, (_, i) => {\n const v = min + ((max - min) * i) / 4;\n return <span key={i}>{Math.round(v)}</span>;\n })}\n </div>\n )}\n </div>\n );\n }\n);\n\nexport default SliderBar;\n\n// ---------------------------------------------------------------------------\n// SliderBarMatrix — interactive showcase covering Type × State × Value.\n// ---------------------------------------------------------------------------\nexport function SliderBarMatrix() {\n ensureStyles();\n const [c, setC] = React.useState<number>(35);\n const [d, setD] = React.useState<number>(40);\n const [r, setR] = React.useState<[number, number]>([25, 75]);\n const [s, setS] = React.useState<number>(60);\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (drag thumbs · click track · arrow keys)\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 28, maxWidth: 480 }}>\n <div>\n <p style={{ fontSize: 12, color: \"#5E5E5E\", margin: \"0 0 12px\" }}>Continuous · value {Math.round(c)}</p>\n <SliderBar type=\"Continuous\" value={c} onChange={(v) => setC(v as number)} aria-label=\"Continuous\" />\n </div>\n <div>\n <p style={{ fontSize: 12, color: \"#5E5E5E\", margin: \"0 0 12px\" }}>Discrete · step 10 · value {Math.round(d)}</p>\n <SliderBar type=\"Discrete\" step={10} value={d} onChange={(v) => setD(v as number)} aria-label=\"Discrete\" />\n </div>\n <div>\n <p style={{ fontSize: 12, color: \"#5E5E5E\", margin: \"0 0 12px\" }}>Range · {r[0]} – {r[1]}</p>\n <SliderBar type=\"Range\" value={r} onChange={(v) => setR(v as [number, number])} aria-label=\"Range\" />\n </div>\n <div>\n <p style={{ fontSize: 12, color: \"#5E5E5E\", margin: \"0 0 24px\" }}>Scale · value {Math.round(s)}</p>\n <SliderBar type=\"Scale\" value={s} onChange={(v) => setS(v as number)} aria-label=\"Scale\" />\n </div>\n </div>\n </section>\n\n {([\"Continuous\", \"Discrete\", \"Range\", \"Scale\"] as SliderBarType[]).map((t) => (\n <section key={t} style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n {t} · State × Value\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"120px repeat(3, minmax(320px, 1fr))\", gap: 24, alignItems: \"center\" }}>\n <div />\n <div style={{ fontSize: 11, fontWeight: 700, letterSpacing: \"0.06em\", textTransform: \"uppercase\", color: \"#848484\" }}>Value 0</div>\n <div style={{ fontSize: 11, fontWeight: 700, letterSpacing: \"0.06em\", textTransform: \"uppercase\", color: \"#848484\" }}>Value 50</div>\n <div style={{ fontSize: 11, fontWeight: 700, letterSpacing: \"0.06em\", textTransform: \"uppercase\", color: \"#848484\" }}>Value 100</div>\n\n {([\"Default\", \"Active\", \"Disabled\"] as SliderBarState[]).map((st) => (\n <React.Fragment key={st}>\n <div style={{ fontSize: 12, fontWeight: 600, color: \"#5E5E5E\" }}>{st}</div>\n {[0, 50, 100].map((v) => {\n if (t === \"Range\") {\n const rv: [number, number] = v === 0 ? [0, 20] : v === 50 ? [40, 60] : [80, 100];\n return (\n <div key={v} style={{ padding: \"16px 0\" }}>\n <SliderBar\n type={t}\n state={st}\n defaultValue={rv}\n disabled={st === \"Disabled\"}\n />\n </div>\n );\n }\n return (\n <div key={v} style={{ padding: t === \"Scale\" ? \"24px 0\" : \"16px 0\" }}>\n <SliderBar\n type={t}\n state={st}\n defaultValue={v}\n disabled={st === \"Disabled\"}\n />\n </div>\n );\n })}\n </React.Fragment>\n ))}\n </div>\n </section>\n ))}\n </div>\n );\n}\n","/**\n * SliderField — React port of the Embleema Design System 2.0\n * Input/Slider Field component (Figma node 4634:231). A molecule that wraps\n * the SliderBar atom with a label, 3 scale labels under the track, one or\n * two numeric input fields, and a helper / error message row.\n *\n * Type mapping to SliderBar:\n * - Slider → SliderBar type=\"Discrete\" + a single numeric field below\n * - Range → SliderBar type=\"Range\" + two numeric fields (min / max)\n * - Scale → SliderBar type=\"Scale\", no numeric field\n *\n * Color bindings:\n * - Default label: Text/Secondary (#5E5E5E) — per Figma\n * - Error label: Text/Error (#E02020)\n * - Disabled label: Text/Disabled (#848484)\n * - Error field: Feedback/Error/Background (#FFE2E2) + Border/Error (#E02020)\n * - Disabled field: Background/Disabled (#F1F1F1) + Border/Subtle (#F1F1F1)\n * - Helper (error): Feedback/Error/Text (#B31A1A)\n */\n\nimport * as React from \"react\";\nimport { SliderBar } from \"./SliderBar\";\n\nexport type SliderFieldType = \"Slider\" | \"Range\" | \"Scale\";\nexport type SliderFieldState = \"Default\" | \"Error\" | \"Disabled\" | \"ReadOnly\";\n\nexport type SliderFieldProps = {\n type?: SliderFieldType;\n state?: SliderFieldState;\n label?: boolean | string;\n helperText?: boolean | string;\n required?: boolean;\n min?: number;\n max?: number;\n step?: number;\n /** Number of evenly-spaced tick marks on the track (Slider/Range). */\n ticks?: number;\n /** Single value (Slider/Scale) or [min, max] (Range). */\n value?: number | [number, number];\n defaultValue?: number | [number, number];\n onChange?: (value: number | [number, number]) => void;\n /** Three labels positioned start / middle / end under the track. */\n scaleLabels?: [string, string, string];\n id?: string;\n name?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Label\";\nconst DEFAULT_HELPER = {\n Default: \"Helper text\",\n Error: \"Error message\",\n Disabled: \"Helper text\",\n ReadOnly: \"Helper text\",\n} as const;\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --sf-text-primary: #0E0E0E;\n --sf-text-secondary: #5E5E5E;\n --sf-text-tertiary: #848484;\n --sf-text-disabled: #848484;\n --sf-text-placeholder: #848484;\n --sf-text-error: #E02020;\n --sf-text-info-icon: #306AE8;\n --sf-feedback-error-bg: #FFE2E2;\n --sf-feedback-error-text: #B31A1A;\n --sf-border-default: #DDDDDD;\n --sf-border-subtle: #F1F1F1;\n --sf-border-error: #E02020;\n --sf-bg-field: #F8F8F8;\n --sf-bg-disabled: #F1F1F1;\n}\n\n.eds-sf {\n display: flex;\n flex-direction: column;\n gap: 4px;\n width: 100%;\n font-family: Nunito, sans-serif;\n}\n\n/* Label row */\n.eds-sf__label-row {\n display: inline-flex;\n align-items: flex-start;\n gap: 2px;\n width: 100%;\n}\n.eds-sf__label-icon {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n padding: 2px 0;\n}\n.eds-sf__label-icon-svg {\n width: 20px;\n height: 20px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--sf-text-info-icon);\n}\n.eds-sf__label-icon-svg svg { width: 100%; height: 100%; display: block; }\n.eds-sf__label-text {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--sf-text-secondary);\n margin: 0;\n}\n.eds-sf[data-state=\"Error\"] .eds-sf__label-text { color: var(--sf-text-error); }\n.eds-sf[data-state=\"Disabled\"] .eds-sf__label-text { color: var(--sf-text-disabled); }\n.eds-sf__required { color: var(--sf-feedback-error-text); }\n\n/* Body */\n.eds-sf__body {\n display: flex;\n flex-direction: column;\n gap: 20px;\n width: 100%;\n}\n.eds-sf[data-type=\"Scale\"] .eds-sf__body { gap: 0; }\n\n.eds-sf__slider-section {\n display: flex;\n flex-direction: column;\n gap: 8px;\n width: 100%;\n}\n\n/* Three scale labels under the track (justify-between). */\n.eds-sf__labels {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.5;\n color: var(--sf-text-primary);\n width: 100%;\n}\n.eds-sf[data-state=\"ReadOnly\"] .eds-sf__labels,\n.eds-sf[data-state=\"Disabled\"] .eds-sf__labels {\n color: var(--sf-text-tertiary);\n}\n\n/* Field rows for Slider and Range types. */\n.eds-sf__fields {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n width: 100%;\n}\n.eds-sf__fields--single .eds-sf__field { flex: 1 1 100%; width: 100%; }\n.eds-sf__fields--range { gap: 8px; }\n.eds-sf__fields--range .eds-sf__field { flex: 1 1 0; min-width: 0; }\n\n.eds-sf__field {\n display: flex;\n align-items: center;\n gap: 4px;\n height: 48px;\n padding: 12px;\n border: 1px solid var(--sf-border-default);\n background: var(--sf-bg-field);\n border-radius: 4px;\n box-sizing: border-box;\n filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.12));\n font-family: Nunito, sans-serif;\n}\n.eds-sf__field-input {\n flex: 1 1 0;\n min-width: 0;\n border: 0;\n outline: 0;\n background: transparent;\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--sf-text-primary);\n -moz-appearance: textfield;\n}\n.eds-sf__field-input::-webkit-outer-spin-button,\n.eds-sf__field-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.eds-sf__field-input::placeholder { color: var(--sf-text-placeholder); }\n\n.eds-sf[data-state=\"Error\"] .eds-sf__field {\n background: var(--sf-feedback-error-bg);\n border: 1.5px solid var(--sf-border-error);\n}\n.eds-sf[data-state=\"Disabled\"] .eds-sf__field {\n background: var(--sf-bg-disabled);\n border: 1.5px solid var(--sf-border-subtle);\n filter: none;\n}\n.eds-sf[data-state=\"Disabled\"] .eds-sf__field-input {\n color: var(--sf-text-placeholder);\n opacity: 0.8;\n cursor: not-allowed;\n}\n.eds-sf[data-state=\"ReadOnly\"] .eds-sf__field {\n background: var(--sf-bg-disabled);\n border: 1.5px solid var(--sf-border-subtle);\n filter: none;\n}\n.eds-sf[data-state=\"ReadOnly\"] .eds-sf__field-input {\n color: var(--sf-text-placeholder);\n opacity: 0.8;\n cursor: default;\n}\n.eds-sf__range-sep {\n display: inline-flex;\n align-items: center;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--sf-text-secondary);\n flex-shrink: 0;\n}\n\n/* Helper text */\n.eds-sf__helper {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 1.4;\n letter-spacing: 0.01em;\n color: var(--sf-text-primary);\n}\n.eds-sf[data-state=\"Error\"] .eds-sf__helper { color: var(--sf-feedback-error-text); }\n.eds-sf__helper-icon {\n display: inline-flex;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.eds-sf__helper-icon svg { width: 100%; height: 100%; display: block; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-sliderfield]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-sliderfield\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Icons\n// ---------------------------------------------------------------------------\nfunction InfoIcon() {\n return (\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M10 14.5C10.2125 14.5 10.3906 14.4281 10.5344 14.2843C10.6781 14.1406 10.75 13.9625 10.75 13.75V9.75C10.75 9.5375 10.6781 9.35935 10.5344 9.2156C10.3906 9.07185 10.2125 9 10 9C9.7875 9 9.60938 9.07185 9.46563 9.2156C9.32188 9.35935 9.25 9.5375 9.25 9.75V13.75C9.25 13.9625 9.32188 14.1406 9.46563 14.2843C9.60938 14.4281 9.7875 14.5 10 14.5ZM10 7.5C10.2125 7.5 10.3906 7.42815 10.5344 7.2844C10.6781 7.14065 10.75 6.9625 10.75 6.75C10.75 6.5375 10.6781 6.35935 10.5344 6.2156C10.3906 6.07185 10.2125 6 10 6C9.7875 6 9.60938 6.07185 9.46563 6.2156C9.32188 6.35935 9.25 6.5375 9.25 6.75C9.25 6.9625 9.32188 7.14065 9.46563 7.2844C9.60938 7.42815 9.7875 7.5 10 7.5ZM10 19C8.75 19 7.575 18.7625 6.475 18.2875C5.375 17.8125 4.41875 17.1688 3.60625 16.3563C2.79375 15.5438 2.15 14.5875 1.675 13.4875C1.2 12.3875 0.962 11.2125 0.962 9.9625C0.962 8.7125 1.2 7.5375 1.675 6.4375C2.15 5.3375 2.79375 4.38125 3.60625 3.56875C4.41875 2.75625 5.375 2.1125 6.475 1.6375C7.575 1.1625 8.75 0.925 10 0.925C11.25 0.925 12.425 1.1625 13.525 1.6375C14.625 2.1125 15.5813 2.75625 16.3938 3.56875C17.2063 4.38125 17.85 5.3375 18.325 6.4375C18.8 7.5375 19.0375 8.7125 19.0375 9.9625C19.0375 11.2125 18.8 12.3875 18.325 13.4875C17.85 14.5875 17.2063 15.5438 16.3938 16.3563C15.5813 17.1688 14.625 17.8125 13.525 18.2875C12.425 18.7625 11.25 19 10 19ZM10 17.5C12.1 17.5 13.875 16.775 15.325 15.325C16.775 13.875 17.5 12.1 17.5 10C17.5 7.9 16.775 6.125 15.325 4.675C13.875 3.225 12.1 2.5 10 2.5C7.9 2.5 6.125 3.225 4.675 4.675C3.225 6.125 2.5 7.9 2.5 10C2.5 12.1 3.225 13.875 4.675 15.325C6.125 16.775 7.9 17.5 10 17.5Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nfunction ErrorGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M1.333 14L8 2.667 14.667 14H1.333zM8 12.667a.5.5 0 100-1 .5.5 0 000 1zm-.5-2h1V7h-1v3.667z\" fill=\"#B31A1A\" />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\nfunction clamp(v: number, lo: number, hi: number): number {\n return Math.max(lo, Math.min(hi, v));\n}\nfunction defaultFor(type: SliderFieldType, min: number, max: number): number | [number, number] {\n if (type === \"Range\") return [min, max];\n return min;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const SliderField = React.forwardRef<HTMLDivElement, SliderFieldProps>(\n function SliderField(\n {\n type = \"Slider\",\n state = \"Default\",\n label = true,\n helperText = false,\n required = false,\n min = 0,\n max = 100,\n step = 1,\n ticks = 11,\n value,\n defaultValue,\n onChange,\n scaleLabels = [\"#\", \"#\", \"#\"],\n id,\n name,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isRange = type === \"Range\";\n const isControlled = value !== undefined;\n const disabled = state === \"Disabled\";\n const readOnly = state === \"ReadOnly\";\n const interactionLocked = disabled || readOnly;\n\n const [internal, setInternal] = React.useState<number | [number, number]>(\n defaultValue ?? defaultFor(type, min, max)\n );\n const current = isControlled ? value! : internal;\n\n const commit = (next: number | [number, number]) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const handleSliderChange = (v: number | [number, number]) => {\n if (interactionLocked) return;\n commit(v);\n };\n\n // Numeric field handlers — sync typed values back into the slider.\n const handleFieldInput = (which: \"single\" | \"min\" | \"max\"): React.ChangeEventHandler<HTMLInputElement> => (e) => {\n if (interactionLocked) return;\n const n = parseFloat(e.target.value);\n if (Number.isNaN(n)) return; // ignore non-numeric input mid-typing\n if (isRange && Array.isArray(current)) {\n const [lo, hi] = current;\n if (which === \"min\") commit([clamp(Math.min(n, hi), min, hi), hi]);\n else if (which === \"max\") commit([lo, clamp(Math.max(n, lo), lo, max)]);\n } else if (typeof current === \"number\") {\n commit(clamp(n, min, max));\n }\n };\n\n const wrapperClass = \"eds-sf\" + (className ? ` ${className}` : \"\");\n\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n const helperContent =\n typeof helperText === \"string\"\n ? helperText\n : DEFAULT_HELPER[state as keyof typeof DEFAULT_HELPER] ?? DEFAULT_HELPER.Default;\n\n // SliderBar type mapping (Slider → Discrete to get tick marks)\n const sliderBarType = type === \"Slider\" ? \"Discrete\" : type === \"Range\" ? \"Range\" : \"Scale\";\n\n const labelEl = label ? (\n <div className=\"eds-sf__label-row\">\n <span className=\"eds-sf__label-icon\">\n <span className=\"eds-sf__label-icon-svg\" aria-hidden>\n <InfoIcon />\n </span>\n </span>\n <label className=\"eds-sf__label-text\" htmlFor={id}>\n {required && <span className=\"eds-sf__required\" aria-hidden>*</span>}\n {labelText}\n </label>\n </div>\n ) : null;\n\n const helperEl = helperText ? (\n <div className=\"eds-sf__helper\" role={state === \"Error\" ? \"alert\" : undefined}>\n {state === \"Error\" && (\n <span className=\"eds-sf__helper-icon\"><ErrorGlyph /></span>\n )}\n <span>{helperContent}</span>\n </div>\n ) : null;\n\n const formatVal = (v: number) => (step >= 1 ? String(Math.round(v)) : String(v));\n const singleValue = typeof current === \"number\" ? current : 0;\n const rangeValue: [number, number] = Array.isArray(current) ? current : [min, max];\n\n const fieldsEl =\n type === \"Slider\" ? (\n <div className=\"eds-sf__fields eds-sf__fields--single\">\n <div className=\"eds-sf__field\">\n <input\n id={id}\n name={name}\n type=\"number\"\n className=\"eds-sf__field-input\"\n value={formatVal(singleValue)}\n min={min}\n max={max}\n step={step}\n onChange={handleFieldInput(\"single\")}\n disabled={disabled}\n readOnly={readOnly}\n aria-label={ariaLabel ?? \"Value\"}\n tabIndex={interactionLocked ? -1 : 0}\n />\n </div>\n </div>\n ) : type === \"Range\" ? (\n <div className=\"eds-sf__fields eds-sf__fields--range\">\n <div className=\"eds-sf__field\">\n <input\n id={id ? `${id}-min` : undefined}\n name={name ? `${name}-min` : undefined}\n type=\"number\"\n className=\"eds-sf__field-input\"\n value={formatVal(rangeValue[0])}\n min={min}\n max={rangeValue[1]}\n step={step}\n onChange={handleFieldInput(\"min\")}\n disabled={disabled}\n readOnly={readOnly}\n aria-label=\"Minimum\"\n tabIndex={interactionLocked ? -1 : 0}\n />\n </div>\n <span className=\"eds-sf__range-sep\" aria-hidden>to</span>\n <div className=\"eds-sf__field\">\n <input\n id={id ? `${id}-max` : undefined}\n name={name ? `${name}-max` : undefined}\n type=\"number\"\n className=\"eds-sf__field-input\"\n value={formatVal(rangeValue[1])}\n min={rangeValue[0]}\n max={max}\n step={step}\n onChange={handleFieldInput(\"max\")}\n disabled={disabled}\n readOnly={readOnly}\n aria-label=\"Maximum\"\n tabIndex={interactionLocked ? -1 : 0}\n />\n </div>\n </div>\n ) : null;\n\n return (\n <div ref={ref} className={wrapperClass} data-type={type} data-state={state}>\n {labelEl}\n <div className=\"eds-sf__body\">\n <div className=\"eds-sf__slider-section\">\n <SliderBar\n type={sliderBarType}\n state={readOnly ? \"Disabled\" : disabled ? \"Disabled\" : undefined}\n min={min}\n max={max}\n step={step}\n ticks={ticks}\n value={current}\n onChange={handleSliderChange}\n disabled={interactionLocked}\n aria-label={ariaLabel ?? (typeof label === \"string\" ? label : \"Slider\")}\n />\n <div className=\"eds-sf__labels\" aria-hidden>\n <p>{scaleLabels[0]}</p>\n <p>{scaleLabels[1]}</p>\n <p>{scaleLabels[2]}</p>\n </div>\n </div>\n {fieldsEl}\n </div>\n {helperEl}\n </div>\n );\n }\n);\n\nexport default SliderField;\n\n// ---------------------------------------------------------------------------\n// SliderFieldMatrix — interactive showcase across Type × State.\n// ---------------------------------------------------------------------------\nexport function SliderFieldMatrix() {\n ensureStyles();\n const [a, setA] = React.useState<number>(50);\n const [b, setB] = React.useState<[number, number]>([25, 75]);\n const [c, setC] = React.useState<number>(60);\n\n const states: SliderFieldState[] = [\"Default\", \"Error\", \"Disabled\", \"ReadOnly\"];\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (drag slider · type in field)\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 32, maxWidth: 480 }}>\n <SliderField\n type=\"Slider\"\n label=\"Volume\"\n helperText\n value={a}\n onChange={(v) => setA(v as number)}\n scaleLabels={[\"0\", \"50\", \"100\"]}\n />\n <SliderField\n type=\"Range\"\n label=\"Price range\"\n helperText\n value={b}\n onChange={(v) => setB(v as [number, number])}\n scaleLabels={[\"$0\", \"$50\", \"$100\"]}\n />\n <SliderField\n type=\"Scale\"\n label=\"Pain level\"\n helperText\n value={c}\n onChange={(v) => setC(v as number)}\n scaleLabels={[\"None\", \"Moderate\", \"Severe\"]}\n />\n </div>\n </section>\n\n {([\"Slider\", \"Range\", \"Scale\"] as SliderFieldType[]).map((t) => (\n <section key={t} style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n {t} · all states\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(380px, 1fr))\", gap: 24 }}>\n {states.map((s) => (\n <SliderField\n key={s}\n type={t}\n state={s}\n label\n helperText\n defaultValue={t === \"Range\" ? [25, 75] : 50}\n scaleLabels={[\"#\", \"#\", \"#\"]}\n />\n ))}\n </div>\n </section>\n ))}\n </div>\n );\n}\n","/**\n * Snackbar — React port of Embleema Design System 2.0's Feedback/Snackbar\n * component (Figma node 4913:219).\n *\n * Transient feedback toast. Single layout for short messages; Stacked layout\n * (Figma calls it \"Snackbar\") wraps the action/close buttons onto a second\n * row for longer text.\n *\n * Structure:\n * Single (one row, items-center, gap 8, padding 8/12):\n * [StatusIcon] [supporting text — flex 1] [(Action)] [(Close)]\n *\n * Stacked (flex-col, gap 4, padding 12):\n * [StatusIcon] [supporting text — flex 1]\n * [(Action)] [(Close)] (right-aligned)\n *\n * Type → border color + status icon (same icon set as Alert):\n * - Success → Feedback/Success/Text + Icon/Status/Check (4052:2995)\n * - Information → Feedback/Information/Text + Icon/Status/Info (4052:3158)\n * - Warning → Feedback/Warning/Text + Icon/Status/Alert (4052:2918)\n * - Error → Feedback/Error/Text + Icon/Action/CloseCircle (4052:3036)\n *\n * Fixed visual properties (per Figma):\n * - Background: Background/Primary (#F8F8F8)\n * - Width: 346px\n * - Border: 2px solid (per type)\n * - Radius: 4px\n * - Drop shadow: 0 0 2px rgba(0,0,0,0.08)\n * - Body text: body/md (Nunito Regular 16/1.5, Text/Primary)\n * - Action text: 14 px Nunito Regular 1.5, Action/Primary/Background\n *\n * Props:\n * - type : Success | Information | Warning | Error\n * - layout : Single | Stacked\n * - message : supporting text (or use children for richer content)\n * - actionButton : show the text-button action (default false)\n * - actionLabel : action label (default \"Button\")\n * - onActionClick : action callback\n * - closeButton : show the X (default true)\n * - onClose : close callback\n * - visible : controlled visibility\n * - defaultVisible : uncontrolled initial visibility (default true)\n * - duration : auto-dismiss ms (0 = never; default 0)\n */\n\nimport * as React from \"react\";\n\nexport type SnackbarType = \"Success\" | \"Information\" | \"Warning\" | \"Error\";\nexport type SnackbarLayout = \"Single\" | \"Stacked\";\n\nexport type SnackbarProps = {\n type?: SnackbarType;\n layout?: SnackbarLayout;\n message?: string;\n children?: React.ReactNode;\n actionButton?: boolean;\n actionLabel?: string;\n onActionClick?: () => void;\n closeButton?: boolean;\n onClose?: () => void;\n visible?: boolean;\n defaultVisible?: boolean;\n duration?: number;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — every border color binds to a Feedback/<Type>/Text semantic\n// token. Body / action text use Text/Primary and Action/Primary/Background.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400&display=swap\");\n\n:root {\n --sb-bg-primary: #F8F8F8;\n --sb-text-primary: #0E0E0E;\n --sb-text-secondary: #5E5E5E;\n --sb-action-primary: #306AE8;\n --sb-feedback-success: #288028;\n --sb-feedback-information: #2655BA;\n --sb-feedback-warning: #E15A00;\n --sb-feedback-error: #B31A1A;\n}\n\n.eds-sb {\n display: flex;\n width: 346px;\n max-width: 100%;\n box-sizing: border-box;\n background: var(--sb-bg-primary);\n border: 2px solid var(--sb-border, var(--sb-feedback-information));\n border-radius: 4px;\n box-shadow: 0 0 2px rgba(0, 0, 0, 0.08);\n font-family: Nunito, sans-serif;\n color: var(--sb-text-primary);\n}\n\n.eds-sb[data-type=\"Success\"] { --sb-border: var(--sb-feedback-success); }\n.eds-sb[data-type=\"Information\"] { --sb-border: var(--sb-feedback-information); }\n.eds-sb[data-type=\"Warning\"] { --sb-border: var(--sb-feedback-warning); }\n.eds-sb[data-type=\"Error\"] { --sb-border: var(--sb-feedback-error); }\n\n/* ---------- Single layout ----------\n One row, vertically centered. Padding 12 all around per spec. The message\n stays on one line (nowrap + ellipsis) so action/close can never overlap it\n when the text grows long. For multi-line messages, use layout=\"Stacked\". */\n.eds-sb[data-layout=\"Single\"] {\n flex-direction: row;\n align-items: center;\n gap: 8px;\n padding: 12px;\n}\n.eds-sb[data-layout=\"Single\"] .eds-sb__message {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: normal;\n}\n\n/* ---------- Stacked layout ----------\n Two rows, 4px apart, 12px padding. Row 1: icon + message (message can wrap).\n Row 2: action + close, right-aligned with 12px gap. */\n.eds-sb[data-layout=\"Stacked\"] {\n flex-direction: column;\n align-items: stretch;\n gap: 4px;\n padding: 12px;\n}\n.eds-sb__text-row {\n display: flex;\n /* flex-start so the icon top-aligns with the first line when the message\n wraps to multiple lines, instead of drifting to the middle of the block. */\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n}\n.eds-sb__action-row {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 12px;\n width: 100%;\n}\n\n/* ---------- Status icon ---------- */\n.eds-sb__icon {\n width: 24px;\n height: 24px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--sb-border);\n}\n.eds-sb__icon svg { display: block; width: 100%; height: 100%; }\n\n/* ---------- Body text ----------\n margin: 0 is critical: with align-items: flex-start, default p-element\n margins shift the text box 1em below the icon, which reads as the message\n being wrapped under the icon even though they share a flex row. Resetting\n to 0 plants the first text baseline level with the icon's top. */\n.eds-sb__message {\n flex: 1 0 0;\n min-width: 0;\n margin: 0;\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5;\n color: var(--sb-text-primary);\n word-break: break-word;\n}\n\n/* ---------- Action button ---------- */\n.eds-sb__action {\n flex-shrink: 0;\n border: 0;\n background: transparent;\n padding: 8px 20px;\n border-radius: 8px;\n color: var(--sb-action-primary);\n font-family: Nunito, sans-serif;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.5;\n cursor: pointer;\n white-space: nowrap;\n transition: background-color 120ms ease-out;\n}\n.eds-sb__action:hover { background: rgba(48, 106, 232, 0.08); }\n.eds-sb__action:focus-visible {\n outline: 2px solid var(--sb-action-primary);\n outline-offset: 1px;\n}\n\n/* ---------- Close button ---------- */\n.eds-sb__close {\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n border: 0;\n padding: 0;\n background: transparent;\n cursor: pointer;\n color: var(--sb-text-secondary);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n transition: background-color 120ms ease-out;\n}\n.eds-sb__close:hover { background: rgba(0, 0, 0, 0.06); }\n.eds-sb__close:focus-visible {\n outline: 2px solid var(--sb-text-secondary);\n outline-offset: 1px;\n}\n.eds-sb__close svg { display: block; width: 100%; height: 100%; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-sb-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-sb-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-sb-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-sb-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n/* Static showcase grid: two equal columns (Single | Stacked) at wide widths\n and a single column on narrow screens. Snackbars inside a column stack\n vertically with consistent 12px spacing so cards never overlap or crowd. */\n.eds-sb-matrix__grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(346px, 1fr));\n gap: 24px;\n align-items: start;\n}\n.eds-sb-matrix__col {\n display: flex;\n flex-direction: column;\n gap: 12px;\n min-width: 0;\n}\n.eds-sb-matrix__col-title {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0 0 4px;\n}\n.eds-sb-matrix__controls {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 8px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-sb-matrix__trigger {\n padding: 6px 12px;\n background: #306AE8;\n border: 0;\n border-radius: 4px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 600;\n color: #FEFEFE;\n}\n.eds-sb-matrix__trigger[data-type=\"Success\"] { background: #288028; }\n.eds-sb-matrix__trigger[data-type=\"Warning\"] { background: #E15A00; }\n.eds-sb-matrix__trigger[data-type=\"Error\"] { background: #B31A1A; }\n.eds-sb-matrix__trigger:hover { filter: brightness(0.92); }\n.eds-sb-matrix__toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #0E0E0E;\n}\n.eds-sb-matrix__toggle input { accent-color: #306AE8; }\n.eds-sb-matrix__queue {\n position: fixed;\n bottom: 24px;\n right: 24px;\n z-index: 200;\n display: flex;\n flex-direction: column;\n gap: 8px;\n pointer-events: none;\n}\n.eds-sb-matrix__queue > * { pointer-events: auto; }\n@keyframes eds-sb-pop-in {\n from { opacity: 0; transform: translateY(8px); }\n to { opacity: 1; transform: translateY(0); }\n}\n.eds-sb-matrix__queue .eds-sb {\n animation: eds-sb-pop-in 180ms ease-out;\n}\n.eds-sb-matrix__hint {\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-snackbar]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-snackbar\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — reuse the exact Figma paths I pulled earlier for Alert (status\n// glyphs) and Tag/Chip (Close glyph). Each translates inside a 24-viewBox\n// so the visible portion matches Figma's inset percentages.\n// ---------------------------------------------------------------------------\nfunction CheckIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 5)\">\n <path\n fill=\"currentColor\"\n d=\"M6.72489 11.8595L18.2793 0.305087C18.4781 0.106016 18.7108 0.00436262 18.9774 0.000127067C19.2441 -0.00410849 19.4811 0.0975446 19.6887 0.305087C19.8962 0.512629 20 0.750935 20 1.02C20 1.2893 19.8962 1.52771 19.6887 1.73525L7.57122 13.8735C7.32934 14.1151 7.04723 14.2359 6.72489 14.2359C6.40254 14.2359 6.12043 14.1151 5.87856 13.8735L0.294313 8.28922C0.0954648 8.09014 -0.00262182 7.85384 5.32649e-05 7.58032C0.00250543 7.30701 0.107502 7.06659 0.315045 6.85905C0.522587 6.6515 0.760892 6.54773 1.02996 6.54773C1.29925 6.54773 1.53767 6.6515 1.74521 6.85905L6.72489 11.8595Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction InfoIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10.0003 15C10.2241 15 10.4116 14.9243 10.5626 14.7729C10.7139 14.6217 10.7895 14.4342 10.7895 14.2105V9.73684C10.7895 9.51316 10.7138 9.32561 10.5624 9.17421C10.411 9.02298 10.2234 8.94737 9.99974 8.94737C9.77588 8.94737 9.58842 9.02298 9.43737 9.17421C9.28614 9.32561 9.21053 9.51316 9.21053 9.73684V14.2105C9.21053 14.4342 9.28623 14.6217 9.43763 14.7729C9.58904 14.9243 9.77658 15 10.0003 15ZM10 7.14579C10.2409 7.14579 10.4428 7.0643 10.6058 6.90132C10.7688 6.73833 10.8503 6.5364 10.8503 6.29553C10.8503 6.05465 10.7688 5.85272 10.6058 5.68974C10.4428 5.52693 10.2409 5.44553 10 5.44553C9.75912 5.44553 9.55719 5.52693 9.39421 5.68974C9.23123 5.85272 9.14974 6.05465 9.14974 6.29553C9.14974 6.5364 9.23123 6.73833 9.39421 6.90132C9.55719 7.0643 9.75912 7.14579 10 7.14579ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction AlertIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2)\">\n <path\n fill=\"currentColor\"\n d=\"M10 14.9797C10.2409 14.9797 10.4428 14.8982 10.6058 14.7353C10.7688 14.5723 10.8503 14.3704 10.8503 14.1295C10.8503 13.8886 10.7688 13.6867 10.6058 13.5237C10.4428 13.3609 10.2409 13.2795 10 13.2795C9.75912 13.2795 9.55719 13.3609 9.39421 13.5237C9.23123 13.6867 9.14974 13.8886 9.14974 14.1295C9.14974 14.3704 9.23123 14.5723 9.39421 14.7353C9.55719 14.8982 9.75912 14.9797 10 14.9797ZM10.0003 11.1337C10.2241 11.1337 10.4116 11.058 10.5626 10.9066C10.7139 10.7554 10.7895 10.5679 10.7895 10.3442V5.60737C10.7895 5.38368 10.7138 5.19614 10.5624 5.04474C10.411 4.89351 10.2234 4.8179 9.99974 4.8179C9.77588 4.8179 9.58842 4.89351 9.43737 5.04474C9.28614 5.19614 9.21053 5.38368 9.21053 5.60737V10.3442C9.21053 10.5679 9.28623 10.7554 9.43763 10.9066C9.58904 11.058 9.77658 11.1337 10.0003 11.1337ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction CloseCircleIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10 11.1092L13.2347 14.3442C13.3805 14.4898 13.5638 14.5644 13.7845 14.5679C14.005 14.5712 14.1916 14.4967 14.3442 14.3442C14.4967 14.1916 14.5729 14.0067 14.5729 13.7895C14.5729 13.5723 14.4967 13.3874 14.3442 13.2347L11.1092 10L14.3442 6.76526C14.4898 6.61947 14.5644 6.43623 14.5679 6.21553C14.5712 5.995 14.4967 5.80842 14.3442 5.65579C14.1916 5.50333 14.0067 5.4271 13.7895 5.4271C13.5723 5.4271 13.3874 5.50333 13.2347 5.65579L10 8.89079L6.76526 5.65579C6.61947 5.51018 6.43623 5.43561 6.21553 5.4321C5.995 5.42877 5.80842 5.50333 5.65579 5.65579C5.50333 5.80842 5.42711 5.99333 5.42711 6.21053C5.42711 6.42772 5.50333 6.61263 5.65579 6.76526L8.89079 10L5.65579 13.2347C5.51018 13.3805 5.43561 13.5638 5.43211 13.7845C5.42877 14.005 5.50333 14.1916 5.65579 14.3442C5.80842 14.4967 5.99333 14.5729 6.21053 14.5729C6.42772 14.5729 6.61263 14.4967 6.76526 14.3442L10 11.1092ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\n// Small 20-px close X (Icon/Action/Close 4052:3034) — same one used by Tag\n// and Chip. Translated inside a 24-viewBox so the visible glyph matches\n// Figma's 17.75% / 16.67% inset.\nfunction CloseGlyph() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(4 4.26)\">\n <path\n fill=\"currentColor\"\n d=\"M8 9.70342L2.03802 15.6654C1.81496 15.8885 1.53105 16 1.18631 16C0.841572 16 0.557668 15.8885 0.334601 15.6654C0.111534 15.4423 0 15.1584 0 14.8137C0 14.4689 0.111534 14.185 0.334601 13.962L6.29658 8L0.334601 2.03802C0.111534 1.81496 0 1.53105 0 1.18631C0 0.841572 0.111534 0.557668 0.334601 0.334601C0.557668 0.111534 0.841572 0 1.18631 0C1.53105 0 1.81496 0.111534 2.03802 0.334601L8 6.29658L13.962 0.334601C14.185 0.111534 14.4689 0 14.8137 0C15.1584 0 15.4423 0.111534 15.6654 0.334601C15.8885 0.557668 16 0.841572 16 1.18631C16 1.53105 15.8885 1.81496 15.6654 2.03802L9.70342 8L15.6654 13.962C15.8885 14.185 16 14.4689 16 14.8137C16 15.1584 15.8885 15.4423 15.6654 15.6654C15.4423 15.8885 15.1584 16 14.8137 16C14.4689 16 14.185 15.8885 13.962 15.6654L8 9.70342Z\"\n />\n </g>\n </svg>\n );\n}\n\nconst ICON_BY_TYPE: Record<SnackbarType, React.ComponentType> = {\n Success: CheckIcon,\n Information: InfoIcon,\n Warning: AlertIcon,\n Error: CloseCircleIcon,\n};\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Snackbar = React.forwardRef<HTMLDivElement, SnackbarProps>(\n function Snackbar(\n {\n type = \"Information\",\n layout = \"Single\",\n message,\n children,\n actionButton = false,\n actionLabel = \"Button\",\n onActionClick,\n closeButton = true,\n onClose,\n visible,\n defaultVisible = true,\n duration = 0,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = visible !== undefined;\n const [internalVisible, setInternalVisible] = React.useState(defaultVisible);\n const isVisible = isControlled ? !!visible : internalVisible;\n\n const handleClose = React.useCallback(() => {\n if (!isControlled) setInternalVisible(false);\n onClose?.();\n }, [isControlled, onClose]);\n\n // Auto-dismiss after `duration` ms when > 0. Restart the timer if the\n // duration changes or the snackbar becomes visible again.\n React.useEffect(() => {\n if (!isVisible || !duration || duration <= 0) return;\n const t = window.setTimeout(handleClose, duration);\n return () => window.clearTimeout(t);\n }, [isVisible, duration, handleClose]);\n\n if (!isVisible) return null;\n\n const Icon = ICON_BY_TYPE[type];\n const wrapperClass = \"eds-sb\" + (className ? ` ${className}` : \"\");\n const body = children ?? message;\n\n const iconEl = (\n <span className=\"eds-sb__icon\" aria-hidden>\n <Icon />\n </span>\n );\n const messageEl = <p className=\"eds-sb__message\">{body}</p>;\n const actionEl = actionButton ? (\n <button\n type=\"button\"\n className=\"eds-sb__action\"\n onClick={onActionClick}\n >\n {actionLabel}\n </button>\n ) : null;\n const closeEl = closeButton ? (\n <button\n type=\"button\"\n className=\"eds-sb__close\"\n onClick={handleClose}\n aria-label=\"Dismiss\"\n >\n <CloseGlyph />\n </button>\n ) : null;\n\n return (\n <div\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n data-layout={layout}\n role=\"status\"\n aria-live=\"polite\"\n aria-label={ariaLabel ?? `${type} snackbar`}\n >\n {layout === \"Single\" ? (\n <>\n {iconEl}\n {messageEl}\n {actionEl}\n {closeEl}\n </>\n ) : (\n <>\n <div className=\"eds-sb__text-row\">\n {iconEl}\n {messageEl}\n </div>\n {(actionEl || closeEl) && (\n <div className=\"eds-sb__action-row\">\n {actionEl}\n {closeEl}\n </div>\n )}\n </>\n )}\n </div>\n );\n }\n);\n\nexport default Snackbar;\n\n// ---------------------------------------------------------------------------\n// SnackbarMatrix — interactive showcase + trigger-based queue\n// ---------------------------------------------------------------------------\nconst TYPES: SnackbarType[] = [\"Success\", \"Information\", \"Warning\", \"Error\"];\nconst LAYOUTS: SnackbarLayout[] = [\"Single\", \"Stacked\"];\n\nconst MESSAGE_BY_TYPE: Record<SnackbarType, string> = {\n Success: \"Form saved successfully.\",\n Information: \"Reminder: you have 3 unsubmitted entries waiting in your queue.\",\n Warning: \"Connection unstable. Some changes may not have synced yet.\",\n Error: \"Could not save form. Check your network and try again.\",\n};\n\ntype QueuedItem = {\n id: number;\n type: SnackbarType;\n layout: SnackbarLayout;\n message: string;\n actionButton: boolean;\n};\n\nlet nextQueueId = 1;\n\nexport function SnackbarMatrix() {\n ensureStyles();\n\n const [queue, setQueue] = React.useState<QueuedItem[]>([]);\n const [withAction, setWithAction] = React.useState(false);\n const [stacked, setStacked] = React.useState(false);\n\n const push = (type: SnackbarType) => {\n const item: QueuedItem = {\n id: nextQueueId++,\n type,\n layout: stacked ? \"Stacked\" : \"Single\",\n message: MESSAGE_BY_TYPE[type],\n actionButton: withAction,\n };\n setQueue((prev) => [...prev, item]);\n };\n\n const dismiss = (id: number) => {\n setQueue((prev) => prev.filter((it) => it.id !== id));\n };\n\n return (\n <div className=\"eds-sb-matrix\">\n <section className=\"eds-sb-matrix__section\">\n <h3 className=\"eds-sb-matrix__heading\">Interactive · trigger queue</h3>\n <p className=\"eds-sb-matrix__sub\">\n Click a type button to show a snackbar in the bottom-right corner.\n Each snackbar auto-dismisses after 5 seconds; the X dismisses it\n immediately. Toggle ActionButton and Stacked to see how new ones\n render.\n </p>\n <div className=\"eds-sb-matrix__controls\">\n {TYPES.map((t) => (\n <button\n key={t}\n type=\"button\"\n className=\"eds-sb-matrix__trigger\"\n data-type={t}\n onClick={() => push(t)}\n >\n Show {t}\n </button>\n ))}\n <label className=\"eds-sb-matrix__toggle\">\n <input\n type=\"checkbox\"\n checked={withAction}\n onChange={(e) => setWithAction(e.target.checked)}\n />\n ActionButton\n </label>\n <label className=\"eds-sb-matrix__toggle\">\n <input\n type=\"checkbox\"\n checked={stacked}\n onChange={(e) => setStacked(e.target.checked)}\n />\n Stacked layout\n </label>\n </div>\n <p className=\"eds-sb-matrix__hint\">\n Active in the queue: {queue.length}\n </p>\n\n {queue.length > 0 && (\n <div className=\"eds-sb-matrix__queue\" role=\"region\" aria-label=\"Snackbar queue\">\n {queue.map((it) => (\n <Snackbar\n key={it.id}\n type={it.type}\n layout={it.layout}\n message={it.message}\n actionButton={it.actionButton}\n actionLabel=\"Undo\"\n duration={5000}\n onClose={() => dismiss(it.id)}\n />\n ))}\n </div>\n )}\n </section>\n\n <section className=\"eds-sb-matrix__section\">\n <h3 className=\"eds-sb-matrix__heading\">Type × Layout (static)</h3>\n <p className=\"eds-sb-matrix__sub\">\n All four types in both layouts with the action button on. Single\n stays on one line; Stacked wraps long messages onto multiple lines\n with action + close on a second row.\n </p>\n <div className=\"eds-sb-matrix__grid\">\n {LAYOUTS.map((l) => (\n <div key={l} className=\"eds-sb-matrix__col\">\n <p className=\"eds-sb-matrix__col-title\">Layout · {l}</p>\n {TYPES.map((t) => (\n <Snackbar\n key={`${l}-${t}`}\n type={t}\n layout={l}\n message={MESSAGE_BY_TYPE[t]}\n actionButton\n actionLabel=\"Undo\"\n visible\n />\n ))}\n </div>\n ))}\n </div>\n </section>\n\n <section className=\"eds-sb-matrix__section\">\n <h3 className=\"eds-sb-matrix__heading\">Booleans · CloseButton × ActionButton</h3>\n <p className=\"eds-sb-matrix__sub\">\n Either button can be hidden independently. All shown in Stacked\n layout so long messages stay readable.\n </p>\n <div className=\"eds-sb-matrix__col\">\n <Snackbar\n type=\"Success\"\n layout=\"Stacked\"\n message=\"Form saved successfully.\"\n visible\n />\n <Snackbar\n type=\"Information\"\n layout=\"Stacked\"\n message=\"Item moved to archive.\"\n actionButton\n actionLabel=\"Undo\"\n visible\n />\n <Snackbar\n type=\"Warning\"\n layout=\"Stacked\"\n message=\"Connection unstable. Last save may not have synced.\"\n closeButton={false}\n actionButton\n actionLabel=\"Retry\"\n visible\n />\n <Snackbar\n type=\"Error\"\n layout=\"Stacked\"\n message=\"Upload failed. No further action available — purely informational.\"\n closeButton={false}\n visible\n />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * StatusMessage — React port of Embleema Design System 2.0's Feedback/Status\n * Message component (Figma node 4921:27).\n *\n * Inline status text with a leading icon. Used for form-field validation\n * feedback, helper messages, and contextual status indicators. Intentionally\n * lightweight — no background, no border, no dismiss control.\n *\n * Structure:\n * [20-px status icon] [12-px Nunito Regular text]\n *\n * Type → icon + text color (per Figma):\n * - Error → Icon/Action/CloseCircle + Feedback/Error/Text (red icon AND red text)\n * - Success → Icon/Status/Check + Text/Primary (green icon, neutral text)\n * - Warning → Icon/Status/Alert + Text/Primary (orange icon, neutral text)\n * - Information → Icon/Status/Info + Text/Primary (blue icon, neutral text)\n *\n * Per the Figma description, the Error variant is the only one that tints the\n * text — every other type keeps Text/Primary so the message reads as standard\n * helper copy with a colored marker.\n *\n * Type style: body/xs (Nunito Regular 12 / 1.4 / 0.12 px letter-spacing).\n *\n * Props:\n * - type : Error | Success | Warning | Information\n * - message : status text (or pass children for richer content)\n */\n\nimport * as React from \"react\";\n\nexport type StatusMessageType = \"Error\" | \"Success\" | \"Warning\" | \"Information\";\n\nexport type StatusMessageProps = {\n type?: StatusMessageType;\n message?: string;\n children?: React.ReactNode;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400&display=swap\");\n\n:root {\n --sm-text-primary: #0E0E0E;\n --sm-feedback-error: #B31A1A;\n --sm-feedback-success: #288028;\n --sm-feedback-warning: #E15A00;\n --sm-feedback-information: #2655BA;\n}\n\n.eds-sm {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 1px 0;\n font-family: Nunito, sans-serif;\n box-sizing: border-box;\n}\n\n/* Per-type colors. Error tints both icon and text; the rest tint icon only. */\n.eds-sm[data-type=\"Error\"] { --sm-icon: var(--sm-feedback-error); --sm-text: var(--sm-feedback-error); }\n.eds-sm[data-type=\"Success\"] { --sm-icon: var(--sm-feedback-success); --sm-text: var(--sm-text-primary); }\n.eds-sm[data-type=\"Warning\"] { --sm-icon: var(--sm-feedback-warning); --sm-text: var(--sm-text-primary); }\n.eds-sm[data-type=\"Information\"] { --sm-icon: var(--sm-feedback-information); --sm-text: var(--sm-text-primary); }\n\n.eds-sm__icon {\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--sm-icon);\n}\n.eds-sm__icon svg { display: block; width: 100%; height: 100%; }\n\n.eds-sm__text {\n font-size: 12px;\n font-weight: 400;\n line-height: 1.4;\n letter-spacing: 0.12px;\n color: var(--sm-text);\n word-break: break-word;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-sm-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-sm-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-sm-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-sm-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-sm-matrix__stack {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-sm-matrix__field {\n display: flex;\n flex-direction: column;\n gap: 4px;\n padding: 12px 16px;\n background: #FEFEFE;\n border: 1px solid #DDDDDD;\n border-radius: 8px;\n max-width: 360px;\n}\n.eds-sm-matrix__field-label {\n font-size: 14px;\n font-weight: 600;\n color: #0E0E0E;\n}\n.eds-sm-matrix__field-input {\n height: 32px;\n padding: 6px 10px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 6px;\n font-family: Nunito, sans-serif;\n font-size: 14px;\n color: #5E5E5E;\n pointer-events: none; /* preview only */\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-statusmessage]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-statusmessage\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — reuse the exact Figma paths used by Alert / Snackbar. Each glyph is\n// translated inside a 24-viewBox so it matches the Figma inset percentages\n// (the per-type insets in the source map to: Check 20.83/19.85, Alert 8.33,\n// Info 9.41/7.25, CloseCircle 9.41/7.25 with horizontal centering).\n// ---------------------------------------------------------------------------\nfunction CheckIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 5)\">\n <path\n fill=\"currentColor\"\n d=\"M6.72489 11.8595L18.2793 0.305087C18.4781 0.106016 18.7108 0.00436262 18.9774 0.000127067C19.2441 -0.00410849 19.4811 0.0975446 19.6887 0.305087C19.8962 0.512629 20 0.750935 20 1.02C20 1.2893 19.8962 1.52771 19.6887 1.73525L7.57122 13.8735C7.32934 14.1151 7.04723 14.2359 6.72489 14.2359C6.40254 14.2359 6.12043 14.1151 5.87856 13.8735L0.294313 8.28922C0.0954648 8.09014 -0.00262182 7.85384 5.32649e-05 7.58032C0.00250543 7.30701 0.107502 7.06659 0.315045 6.85905C0.522587 6.6515 0.760892 6.54773 1.02996 6.54773C1.29925 6.54773 1.53767 6.6515 1.74521 6.85905L6.72489 11.8595Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction InfoIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10.0003 15C10.2241 15 10.4116 14.9243 10.5626 14.7729C10.7139 14.6217 10.7895 14.4342 10.7895 14.2105V9.73684C10.7895 9.51316 10.7138 9.32561 10.5624 9.17421C10.411 9.02298 10.2234 8.94737 9.99974 8.94737C9.77588 8.94737 9.58842 9.02298 9.43737 9.17421C9.28614 9.32561 9.21053 9.51316 9.21053 9.73684V14.2105C9.21053 14.4342 9.28623 14.6217 9.43763 14.7729C9.58904 14.9243 9.77658 15 10.0003 15ZM10 7.14579C10.2409 7.14579 10.4428 7.0643 10.6058 6.90132C10.7688 6.73833 10.8503 6.5364 10.8503 6.29553C10.8503 6.05465 10.7688 5.85272 10.6058 5.68974C10.4428 5.52693 10.2409 5.44553 10 5.44553C9.75912 5.44553 9.55719 5.52693 9.39421 5.68974C9.23123 5.85272 9.14974 6.05465 9.14974 6.29553C9.14974 6.5364 9.23123 6.73833 9.39421 6.90132C9.55719 7.0643 9.75912 7.14579 10 7.14579ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction AlertIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2)\">\n <path\n fill=\"currentColor\"\n d=\"M10 14.9797C10.2409 14.9797 10.4428 14.8982 10.6058 14.7353C10.7688 14.5723 10.8503 14.3704 10.8503 14.1295C10.8503 13.8886 10.7688 13.6867 10.6058 13.5237C10.4428 13.3609 10.2409 13.2795 10 13.2795C9.75912 13.2795 9.55719 13.3609 9.39421 13.5237C9.23123 13.6867 9.14974 13.8886 9.14974 14.1295C9.14974 14.3704 9.23123 14.5723 9.39421 14.7353C9.55719 14.8982 9.75912 14.9797 10 14.9797ZM10.0003 11.1337C10.2241 11.1337 10.4116 11.058 10.5626 10.9066C10.7139 10.7554 10.7895 10.5679 10.7895 10.3442V5.60737C10.7895 5.38368 10.7138 5.19614 10.5624 5.04474C10.411 4.89351 10.2234 4.8179 9.99974 4.8179C9.77588 4.8179 9.58842 4.89351 9.43737 5.04474C9.28614 5.19614 9.21053 5.38368 9.21053 5.60737V10.3442C9.21053 10.5679 9.28623 10.7554 9.43763 10.9066C9.58904 11.058 9.77658 11.1337 10.0003 11.1337ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nfunction CloseCircleIcon() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10 11.1092L13.2347 14.3442C13.3805 14.4898 13.5638 14.5644 13.7845 14.5679C14.005 14.5712 14.1916 14.4967 14.3442 14.3442C14.4967 14.1916 14.5729 14.0067 14.5729 13.7895C14.5729 13.5723 14.4967 13.3874 14.3442 13.2347L11.1092 10L14.3442 6.76526C14.4898 6.61947 14.5644 6.43623 14.5679 6.21553C14.5712 5.995 14.4967 5.80842 14.3442 5.65579C14.1916 5.50333 14.0067 5.4271 13.7895 5.4271C13.5723 5.4271 13.3874 5.50333 13.2347 5.65579L10 8.89079L6.76526 5.65579C6.61947 5.51018 6.43623 5.43561 6.21553 5.4321C5.995 5.42877 5.80842 5.50333 5.65579 5.65579C5.50333 5.80842 5.42711 5.99333 5.42711 6.21053C5.42711 6.42772 5.50333 6.61263 5.65579 6.76526L8.89079 10L5.65579 13.2347C5.51018 13.3805 5.43561 13.5638 5.43211 13.7845C5.42877 14.005 5.50333 14.1916 5.65579 14.3442C5.80842 14.4967 5.99333 14.5729 6.21053 14.5729C6.42772 14.5729 6.61263 14.4967 6.76526 14.3442L10 11.1092ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\nconst ICON_BY_TYPE: Record<StatusMessageType, React.ComponentType> = {\n Error: CloseCircleIcon,\n Success: CheckIcon,\n Warning: AlertIcon,\n Information: InfoIcon,\n};\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const StatusMessage = React.forwardRef<HTMLSpanElement, StatusMessageProps>(\n function StatusMessage(\n {\n type = \"Error\",\n message,\n children,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const Icon = ICON_BY_TYPE[type];\n const wrapperClass = \"eds-sm\" + (className ? ` ${className}` : \"\");\n // Error is more urgent than the others — assertive announcement vs polite.\n const role = type === \"Error\" ? \"alert\" : \"status\";\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n role={role}\n aria-label={ariaLabel}\n >\n <span className=\"eds-sm__icon\" aria-hidden>\n <Icon />\n </span>\n <span className=\"eds-sm__text\">{children ?? message ?? \"Status message\"}</span>\n </span>\n );\n }\n);\n\nexport default StatusMessage;\n\n// ---------------------------------------------------------------------------\n// StatusMessageMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst TYPES: StatusMessageType[] = [\"Error\", \"Success\", \"Warning\", \"Information\"];\n\nconst SAMPLE_BY_TYPE: Record<StatusMessageType, string> = {\n Error: \"Date of birth is required.\",\n Success: \"Form saved successfully.\",\n Warning: \"Some entries are missing optional details.\",\n Information: \"Changes are auto-saved every 30 seconds.\",\n};\n\nexport function StatusMessageMatrix() {\n ensureStyles();\n\n return (\n <div className=\"eds-sm-matrix\">\n <section className=\"eds-sm-matrix__section\">\n <h3 className=\"eds-sm-matrix__heading\">All types</h3>\n <p className=\"eds-sm-matrix__sub\">\n Inline status text with a 20-px leading icon. No background or\n border — sits flush with surrounding copy. Error tints both icon\n and text red; the others tint the icon only.\n </p>\n <div className=\"eds-sm-matrix__stack\">\n {TYPES.map((t) => (\n <StatusMessage key={t} type={t} message={SAMPLE_BY_TYPE[t]} />\n ))}\n </div>\n </section>\n\n <section className=\"eds-sm-matrix__section\">\n <h3 className=\"eds-sm-matrix__heading\">In context · field helper</h3>\n <p className=\"eds-sm-matrix__sub\">\n Sits beneath an input field as validation feedback. The text style\n (body/xs) is intentionally smaller than the input label so it reads\n as helper copy.\n </p>\n\n <div className=\"eds-sm-matrix__field\">\n <span className=\"eds-sm-matrix__field-label\">Date of birth</span>\n <span className=\"eds-sm-matrix__field-input\">MM / DD / YYYY</span>\n <StatusMessage type=\"Error\" message=\"Date of birth is required.\" />\n </div>\n\n <div className=\"eds-sm-matrix__field\">\n <span className=\"eds-sm-matrix__field-label\">Email</span>\n <span className=\"eds-sm-matrix__field-input\">jane@example.com</span>\n <StatusMessage type=\"Success\" message=\"Email verified.\" />\n </div>\n\n <div className=\"eds-sm-matrix__field\">\n <span className=\"eds-sm-matrix__field-label\">Phone</span>\n <span className=\"eds-sm-matrix__field-input\">+1 555 123 4567</span>\n <StatusMessage\n type=\"Warning\"\n message=\"We won't send SMS reminders unless you opt in.\"\n />\n </div>\n\n <div className=\"eds-sm-matrix__field\">\n <span className=\"eds-sm-matrix__field-label\">Study site</span>\n <span className=\"eds-sm-matrix__field-input\">Boston General Hospital</span>\n <StatusMessage\n type=\"Information\"\n message=\"Assigned automatically based on your ZIP code.\"\n />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * StudyProgressSymbol — Embleema Design System 2.0 Clinical/Study Progress\n * Symbol (Figma node 4753:7).\n *\n * Layout: 40×40 circular badge with a colored gradient background and a\n * 24×24 white icon inside. The only exception is Late, which is a\n * 43×40 rounded warning triangle with a white warning mark.\n *\n * Background colors are pulled directly from the Figma source per status.\n * Inactive variants (Skipped, FutureVisit, FutureSurvey, Labwork,\n * AdverseEvent, Medication, Withdrawal, Other, NA) use Figma's\n * white-to-light-gray gradient and carry a 1px Border/Default outline so\n * the circle reads against a white surface — the white icon inside will\n * appear faint against that nearly-white background. Flag for review if\n * those inactive variants need stronger backgrounds.\n */\n\nimport * as React from \"react\";\n\nexport type StudyProgressStatus =\n | \"Complete\"\n | \"Incomplete\"\n | \"Current\"\n | \"Add\"\n | \"Late\"\n | \"StudyCompletion\"\n | \"Skipped\"\n | \"FutureVisit\"\n | \"FutureSurvey\"\n | \"Labwork\"\n | \"AdverseEvent\"\n | \"Medication\"\n | \"Withdrawal\"\n | \"Other\"\n | \"NA\";\n\nexport type StudyProgressSymbolProps = {\n status: StudyProgressStatus;\n /** Accessible label. Defaults to \"Status: <status>\". */\n \"aria-label\"?: string;\n onClick?: React.MouseEventHandler<HTMLElement>;\n className?: string;\n title?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — circle backgrounds use the exact Figma gradient stops.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n.eds-sps {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n padding: 0;\n border: 0;\n background: transparent;\n cursor: default;\n flex-shrink: 0;\n font-family: Nunito, sans-serif;\n}\n.eds-sps[role=\"button\"] { cursor: pointer; border-radius: 999px; }\n.eds-sps[role=\"button\"]:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n\n/* Circle container — used by everything except Late. */\n.eds-sps__circle {\n width: 40px;\n height: 40px;\n border-radius: 999px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: #FEFEFE;\n box-sizing: border-box;\n}\n\n/* Active gradient circles. */\n.eds-sps__circle--complete {\n background: linear-gradient(to top, #00AFB2 0%, #028388 55%, #0A595C 100%);\n}\n.eds-sps__circle--incomplete {\n background: linear-gradient(to bottom, #C20A72 20%, #34208C 99%);\n}\n.eds-sps__circle--current {\n background: linear-gradient(184.7deg, #FF66AB 1.4%, #6694FA 87%);\n}\n.eds-sps__circle--add {\n background: linear-gradient(177.9deg, #6694FA 1.8%, #A2BDF5 105%);\n}\n.eds-sps__circle--studyCompletion {\n background: linear-gradient(to bottom, #644AD4 23%, #2760DE 90%);\n}\n/* Inactive / future — light gray (Neutral/200) circle. */\n.eds-sps__circle--inactive {\n background: #F1F1F1; /* Neutral/200 */\n color: #848484; /* Neutral/500 — overrides white default for inactive icons */\n}\n\n/* Inner icon — always 24×24, color inherits from the parent circle. */\n.eds-sps__glyph {\n width: 24px;\n height: 24px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: inherit;\n}\n.eds-sps__glyph svg { width: 24px; height: 24px; display: block; }\n\n/* Late — rounded warning triangle (43×40), not a circle. Inner SVG has\n its own gradient on the triangle path; currentColor controls the white\n warning mark inside. */\n.eds-sps--late { width: 43px; }\n.eds-sps__late-wrap {\n display: inline-flex;\n width: 43px;\n height: 40px;\n color: #FEFEFE;\n}\n.eds-sps__late { display: block; width: 43px; height: 40px; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-study-progress]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-study-progress\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — exact SVGs exported from each Figma variant (node 4753:7).\n// Path data preserved verbatim so the design-system's rounded-stroke\n// icons render correctly. Inactive (gray-circle) variants use\n// currentColor and inherit Neutral/500 from the circle; gradient-circle\n// variants also use currentColor and inherit white from the circle.\n// Late carries its native 43×40 viewBox so it can render as the\n// standalone warning triangle (no circle container).\n// ---------------------------------------------------------------------------\nconst FIGMA_GLYPHS: Record<StudyProgressStatus, string> = {\n Complete: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(2 5)\"><path d=\"M6.72489 11.8595L18.2793 0.305087C18.4781 0.106016 18.7108 0.00436262 18.9774 0.000127067C19.2441 -0.00410849 19.4811 0.0975446 19.6887 0.305087C19.8962 0.512629 20 0.750935 20 1.02C20 1.2893 19.8962 1.52771 19.6887 1.73525L7.57122 13.8735C7.32934 14.1151 7.04723 14.2359 6.72489 14.2359C6.40254 14.2359 6.12043 14.1151 5.87856 13.8735L0.294313 8.28922C0.0954648 8.09014 -0.00262182 7.85384 5.32649e-05 7.58032C0.00250543 7.30701 0.107502 7.06659 0.315045 6.85905C0.522587 6.6515 0.760892 6.54773 1.02996 6.54773C1.29925 6.54773 1.53767 6.6515 1.74521 6.85905L6.72489 11.8595Z\" fill=\"currentColor\"/></g></svg>`,\n Incomplete: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(4 4.26)\"><path d=\"M8 9.70342L2.03802 15.6654C1.81496 15.8885 1.53105 16 1.18631 16C0.841572 16 0.557668 15.8885 0.334601 15.6654C0.111534 15.4423 0 15.1584 0 14.8137C0 14.4689 0.111534 14.185 0.334601 13.962L6.29658 8L0.334601 2.03802C0.111534 1.81496 0 1.53105 0 1.18631C0 0.841572 0.111534 0.557668 0.334601 0.334601C0.557668 0.111534 0.841572 0 1.18631 0C1.53105 0 1.81496 0.111534 2.03802 0.334601L8 6.29658L13.962 0.334601C14.185 0.111534 14.4689 0 14.8137 0C15.1584 0 15.4423 0.111534 15.6654 0.334601C15.8885 0.557668 16 0.841572 16 1.18631C16 1.53105 15.8885 1.81496 15.6654 2.03802L9.70342 8L15.6654 13.962C15.8885 14.185 16 14.4689 16 14.8137C16 15.1584 15.8885 15.4423 15.6654 15.6654C15.4423 15.8885 15.1584 16 14.8137 16C14.4689 16 14.185 15.8885 13.962 15.6654L8 9.70342Z\" fill=\"currentColor\"/></g></svg>`,\n Current: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(4 10.26)\"><path d=\"M1.65079 3.3016C1.19682 3.3016 0.80824 3.1399 0.48506 2.8165C0.16169 2.4933 0 2.1047 0 1.6508C0 1.1968 0.16169 0.8082 0.48506 0.485C0.80824 0.1617 1.19682 0 1.65079 0C2.10476 0 2.49342 0.1617 2.8168 0.485C3.13998 0.8082 3.30158 1.1968 3.30158 1.6508C3.30158 2.1047 3.13998 2.4933 2.8168 2.8165C2.49342 3.1399 2.10476 3.3016 1.65079 3.3016ZM8 3.3016C7.546 3.3016 7.1575 3.1399 6.8343 2.8165C6.5109 2.4933 6.3492 2.1047 6.3492 1.6508C6.3492 1.1968 6.5109 0.8082 6.8343 0.485C7.1575 0.1617 7.546 0 8 0C8.454 0 8.8425 0.1617 9.1657 0.485C9.4891 0.8082 9.6508 1.1968 9.6508 1.6508C9.6508 2.1047 9.4891 2.4933 9.1657 2.8165C8.8425 3.1399 8.454 3.3016 8 3.3016ZM14.3492 3.3016C13.8952 3.3016 13.5066 3.1399 13.1832 2.8165C12.86 2.4933 12.6984 2.1047 12.6984 1.6508C12.6984 1.1968 12.86 0.8082 13.1832 0.485C13.5066 0.1617 13.8952 0 14.3492 0C14.8032 0 15.1918 0.1617 15.5149 0.485C15.8383 0.8082 16 1.1968 16 1.6508C16 2.1047 15.8383 2.4933 15.5149 2.8165C15.1918 3.1399 14.8032 3.3016 14.3492 3.3016Z\" fill=\"currentColor\"/></g></svg>`,\n Add: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(3 3)\"><path d=\"M7.96154 10.0385H1.03846C0.744231 10.0385 0.497654 9.93888 0.298731 9.73973C0.0995771 9.54058 0 9.29388 0 8.99965C0 8.70519 0.0995771 8.45862 0.298731 8.25992C0.497654 8.061 0.744231 7.96154 1.03846 7.96154H7.96154V1.03846C7.96154 0.744231 8.06112 0.497654 8.26027 0.298731C8.45942 0.0995771 8.70612 0 9.00035 0C9.29481 0 9.54139 0.0995771 9.74008 0.298731C9.939 0.497654 10.0385 0.744231 10.0385 1.03846V7.96154H16.9615C17.2558 7.96154 17.5023 8.06112 17.7013 8.26027C17.9004 8.45942 18 8.70612 18 9.00035C18 9.29481 17.9004 9.54139 17.7013 9.74008C17.5023 9.939 17.2558 10.0385 16.9615 10.0385H10.0385V16.9615C10.0385 17.2558 9.93888 17.5023 9.73973 17.7013C9.54058 17.9004 9.29388 18 8.99965 18C8.70519 18 8.45862 17.9004 8.25992 17.7013C8.061 17.5023 7.96154 17.2558 7.96154 16.9615V10.0385Z\" fill=\"currentColor\"/></g></svg>`,\n Late: `<svg class=\"eds-sps__late\" viewBox=\"0 0 43 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><defs><linearGradient id=\"eds-sps-late-fill\" x1=\"21.5\" y1=\"0\" x2=\"21.5\" y2=\"40\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0\" stop-color=\"#FCA266\"/><stop offset=\"1\" stop-color=\"#FA6400\"/></linearGradient></defs><path d=\"M42.6879 36.4601L22.7921 1.18247C21.8867 -0.422891 19.6068 -0.386263 18.7512 1.24738L0.276525 36.525C-0.547196 38.0979 0.568373 40 2.31459 40H40.6852C42.4635 40 43.5757 38.0342 42.6879 36.4601Z\" fill=\"url(#eds-sps-late-fill)\"/><path d=\"M21.2244 35.6598C21.7812 35.6598 22.2479 35.4673 22.6246 35.0825C23.0014 34.6977 23.1897 34.2209 23.1897 33.6521C23.1897 33.0834 23.0014 32.6066 22.6246 32.2217C22.2479 31.8373 21.7812 31.6451 21.2244 31.6451C20.6677 31.6451 20.2009 31.8373 19.8242 32.2217C19.4475 32.6066 19.2592 33.0834 19.2592 33.6521C19.2592 34.2209 19.4475 34.6977 19.8242 35.0825C20.2009 35.4673 20.6677 35.6598 21.2244 35.6598ZM21.225 26.5785C21.7425 26.5785 22.1758 26.3998 22.5249 26.0423C22.8744 25.6852 23.0492 25.2426 23.0492 24.7144V13.5298C23.0492 13.0017 22.8742 12.5588 22.5243 12.2014C22.1743 11.8443 21.7408 11.6657 21.2238 11.6657C20.7064 11.6657 20.2731 11.8443 19.924 12.2014C19.5744 12.5588 19.3997 13.0017 19.3997 13.5298V24.7144C19.3997 25.2426 19.5746 25.6852 19.9246 26.0423C20.2745 26.3998 20.708 26.5785 21.225 26.5785Z\" fill=\"currentColor\"/></svg>`,\n StudyCompletion: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(2 5)\"><path d=\"M6.72489 11.8595L18.2793 0.305087C18.4781 0.106016 18.7108 0.00436262 18.9774 0.000127067C19.2441 -0.00410849 19.4811 0.0975446 19.6887 0.305087C19.8962 0.512629 20 0.750935 20 1.02C20 1.2893 19.8962 1.52771 19.6887 1.73525L7.57122 13.8735C7.32934 14.1151 7.04723 14.2359 6.72489 14.2359C6.40254 14.2359 6.12043 14.1151 5.87856 13.8735L0.294313 8.28922C0.0954648 8.09014 -0.00262182 7.85384 5.32649e-05 7.58032C0.00250543 7.30701 0.107502 7.06659 0.315045 6.85905C0.522587 6.6515 0.760892 6.54773 1.02996 6.54773C1.29925 6.54773 1.53767 6.6515 1.74521 6.85905L6.72489 11.8595Z\" fill=\"currentColor\"/></g></svg>`,\n Skipped: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(2 3)\"><path d=\"M9.8637 18C8.8194 18 7.9313 17.6385 7.1995 16.9155C6.4674 16.1926 6.1014 15.3147 6.1014 14.282C6.1014 13.2491 6.4669 12.3707 7.1978 11.6468C7.9287 10.9227 8.8162 10.5607 9.8603 10.5607C10.9046 10.5607 11.7927 10.9222 12.5245 11.6451C13.2566 12.3681 13.6227 13.2459 13.6227 14.2786C13.6227 15.3116 13.2572 16.19 12.5263 16.9138C11.7953 17.6379 10.9078 18 9.8637 18ZM17.144 6.50294C16.4497 5.19024 15.4618 4.12936 14.1803 3.32028C12.8987 2.51143 11.4593 2.107 9.862 2.107C8.11 2.107 6.5401 2.60171 5.15235 3.59114C3.76433 4.58056 2.77449 5.85121 2.18282 7.40312C2.08003 7.70042 1.92162 7.96292 1.70761 8.19062C1.49337 8.41812 1.23719 8.53182 0.939069 8.53182C0.623639 8.53182 0.373379 8.40742 0.188319 8.15852C0.00324936 7.90962 -0.045411 7.64122 0.042329 7.35342C0.662949 5.23612 1.86613 3.49431 3.65186 2.12797C5.43736 0.7614 7.496 0.07811 9.8278 0.07811C11.5092 0.07811 13.0519 0.44534 14.4561 1.1798C15.8606 1.91426 17.0248 2.89534 17.9487 4.12305V1.01444C17.9487 0.72702 18.0471 0.48614 18.2438 0.29182C18.4405 0.0972701 18.6841 0 18.9747 0C19.2655 0 19.5091 0.0972701 19.7053 0.29182C19.9018 0.48614 20 0.72702 20 1.01444V7.30942C20 7.65572 19.8815 7.94602 19.6444 8.18052C19.4076 8.41472 19.1141 8.53182 18.7638 8.53182H12.3998C12.1092 8.53182 11.8656 8.43452 11.6692 8.24002C11.4725 8.04542 11.3741 7.80452 11.3741 7.51702C11.3741 7.22942 11.4725 6.98852 11.6692 6.79442C11.8656 6.6001 12.1092 6.50294 12.3998 6.50294H17.144Z\" fill=\"currentColor\"/></g></svg>`,\n FutureVisit: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(2 2.26)\"><path d=\"M11.4781 20C9.7027 20 8.1902 19.3774 6.9408 18.1322C5.69138 16.8871 5.06667 15.3763 5.06667 13.6V13.0173C3.62667 12.8301 2.42222 12.1881 1.45333 11.0912C0.48444 9.99452 0 8.69742 0 7.2V2.03093C0 1.75769 0.09236 1.52871 0.27707 1.344C0.46196 1.15911 0.69093 1.06666 0.964 1.06666H3.2V0.8C3.2 0.57333 3.27671 0.38338 3.43013 0.23013C3.58356 0.07671 3.7736 0 4.00027 0C4.22711 0 4.41707 0.07671 4.57013 0.23013C4.72338 0.38338 4.8 0.57333 4.8 0.8V2.93333C4.8 3.16 4.72329 3.35004 4.56987 3.50346C4.41644 3.65671 4.22631 3.73333 3.99947 3.73333C3.7728 3.73333 3.58284 3.65671 3.4296 3.50346C3.27653 3.35004 3.2 3.16 3.2 2.93333V2.66666H1.6V7.2C1.6 8.37332 2.01778 9.37782 2.85333 10.2133C3.68889 11.0489 4.69333 11.4666 5.86667 11.4666C7.04 11.4666 8.0444 11.0489 8.88 10.2133C9.7156 9.37782 10.1333 8.37332 10.1333 7.2V2.66666H8.5333V2.93333C8.5333 3.16 8.4566 3.35004 8.3032 3.50346C8.1498 3.65671 7.95964 3.73333 7.7328 3.73333C7.50613 3.73333 7.31618 3.65671 7.16293 3.50346C7.00987 3.35004 6.93333 3.16 6.93333 2.93333V0.8C6.93333 0.57333 7.01004 0.38338 7.16347 0.23013C7.31671 0.07671 7.50676 0 7.7336 0C7.96027 0 8.1502 0.07671 8.3035 0.23013C8.4567 0.38338 8.5333 0.57333 8.5333 0.8V1.06666H10.7691C11.0423 1.06666 11.2713 1.15911 11.456 1.344C11.6409 1.52871 11.7333 1.75769 11.7333 2.03093V7.2C11.7333 8.69742 11.2489 9.99452 10.28 11.0912C9.3111 12.1881 8.1067 12.8301 6.66667 13.0173V13.6C6.66667 14.9333 7.13431 16.0666 8.0696 17C9.0049 17.9333 10.1406 18.4 11.4768 18.4C12.8101 18.4 13.9435 17.9333 14.8768 17C15.8101 16.0666 16.2768 14.9333 16.2768 13.6V11.8749C15.7161 11.6986 15.2546 11.3726 14.8923 10.897C14.5298 10.4215 14.3485 9.87972 14.3485 9.27172C14.3485 8.51402 14.614 7.86992 15.1448 7.33946C15.6755 6.80897 16.3199 6.54373 17.0781 6.54373C17.8362 6.54373 18.4802 6.80897 19.0101 7.33946C19.5401 7.86992 19.8051 8.51402 19.8051 9.27172C19.8051 9.87972 19.6238 10.4215 19.2613 10.897C18.899 11.3726 18.4375 11.6986 17.8768 11.8749V13.6C17.8768 15.3763 17.2542 16.8871 16.0091 18.1322C14.7639 19.3774 13.2536 20 11.4781 20ZM17.0768 10.4C17.3927 10.4 17.6597 10.2909 17.8779 10.0728C18.096 9.85462 18.2051 9.58762 18.2051 9.27172C18.2051 8.95582 18.096 8.68892 17.8779 8.47092C17.6597 8.25282 17.3927 8.14372 17.0768 8.14372C16.7609 8.14372 16.4939 8.25282 16.2757 8.47092C16.0576 8.68892 15.9485 8.95582 15.9485 9.27172C15.9485 9.58762 16.0576 9.85462 16.2757 10.0728C16.4939 10.2909 16.7609 10.4 17.0768 10.4Z\" fill=\"currentColor\"/></g></svg>`,\n FutureSurvey: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(3 2.26)\"><path d=\"M1.90289 20C1.37956 20 0.931579 19.8137 0.558948 19.4411C0.186316 19.0684 0 18.6204 0 18.0971V4.00816C0 3.48482 0.186316 3.03684 0.558948 2.66421C0.931579 2.29158 1.37956 2.10526 1.90289 2.10526H6.58711C6.65325 1.52088 6.90833 1.02395 7.35237 0.614473C7.79623 0.204824 8.32956 0 8.95237 0C9.57518 0 10.1086 0.204824 10.5526 0.614473C10.9967 1.02395 11.2483 1.52088 11.3076 2.10526H15.9918C16.5152 2.10526 16.9632 2.29158 17.3358 2.66421C17.7084 3.03684 17.8947 3.48482 17.8947 4.00816V18.0971C17.8947 18.6204 17.7084 19.0684 17.3358 19.4411C16.9632 19.8137 16.5152 20 15.9918 20H1.90289ZM1.90289 18.4211H15.9918C16.0729 18.4211 16.1471 18.3873 16.2145 18.3197C16.282 18.2524 16.3158 18.1782 16.3158 18.0971V4.00816C16.3158 3.92711 16.282 3.85289 16.2145 3.78553C16.1471 3.71798 16.0729 3.68421 15.9918 3.68421H1.90289C1.82184 3.68421 1.74763 3.71798 1.68026 3.78553C1.61272 3.85289 1.57895 3.92711 1.57895 4.00816V18.0971C1.57895 18.1782 1.61272 18.2524 1.68026 18.3197C1.74763 18.3873 1.82184 18.4211 1.90289 18.4211ZM4.73684 15.9311H10C10.2237 15.9311 10.4111 15.8554 10.5624 15.7039C10.7138 15.5527 10.7895 15.3652 10.7895 15.1413C10.7895 14.9176 10.7138 14.7302 10.5624 14.5789C10.4111 14.4279 10.2237 14.3524 10 14.3524H4.73684C4.51316 14.3524 4.3257 14.428 4.17447 14.5792C4.02307 14.7306 3.94737 14.9182 3.94737 15.1421C3.94737 15.3658 4.02307 15.5532 4.17447 15.7045C4.3257 15.8555 4.51316 15.9311 4.73684 15.9311ZM4.73684 11.8421H13.1579C13.3816 11.8421 13.569 11.7664 13.7203 11.615C13.8717 11.4636 13.9474 11.2761 13.9474 11.0524C13.9474 10.8285 13.8717 10.6411 13.7203 10.49C13.569 10.3388 13.3816 10.2632 13.1579 10.2632H4.73684C4.51316 10.2632 4.3257 10.3389 4.17447 10.4903C4.02307 10.6417 3.94737 10.8292 3.94737 11.0529C3.94737 11.2768 4.02307 11.4642 4.17447 11.6153C4.3257 11.7665 4.51316 11.8421 4.73684 11.8421ZM4.73684 7.75289H13.1579C13.3816 7.75289 13.569 7.67728 13.7203 7.52605C13.8717 7.37465 13.9474 7.18702 13.9474 6.96316C13.9474 6.73947 13.8717 6.55202 13.7203 6.40079C13.569 6.24974 13.3816 6.17421 13.1579 6.17421H4.73684C4.51316 6.17421 4.3257 6.24991 4.17447 6.40132C4.02307 6.55254 3.94737 6.74009 3.94737 6.96395C3.94737 7.18763 4.02307 7.37509 4.17447 7.52632C4.3257 7.67737 4.51316 7.75289 4.73684 7.75289ZM8.94737 2.99605C9.17544 2.99605 9.36404 2.92149 9.51316 2.77237C9.66228 2.62324 9.73684 2.43465 9.73684 2.20658C9.73684 1.97851 9.66228 1.78991 9.51316 1.64079C9.36404 1.49167 9.17544 1.4171 8.94737 1.4171C8.7193 1.4171 8.5307 1.49167 8.38158 1.64079C8.23246 1.78991 8.15789 1.97851 8.15789 2.20658C8.15789 2.43465 8.23246 2.62324 8.38158 2.77237C8.5307 2.92149 8.7193 2.99605 8.94737 2.99605Z\" fill=\"currentColor\"/></g></svg>`,\n Labwork: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(4.8 1.2)\"><path d=\"M7.2 21.6C5.7672 21.6 4.54625 21.0877 3.53714 20.063C2.52822 19.0385 2.02375 17.7945 2.02375 16.331V6.05596C1.46418 6.05596 0.987046 5.85512 0.592338 5.45343C0.197446 5.05194 0 4.56404 0 3.98975V2.07701C0 1.50272 0.197446 1.01302 0.592338 0.607927C0.987046 0.202643 1.46418 0 2.02375 0H12.3657C12.9251 0 13.404 0.202643 13.8024 0.607927C14.2008 1.01302 14.4 1.50272 14.4 2.07701V3.98975C14.4 4.56404 14.2008 5.05194 13.8024 5.45343C13.404 5.85512 12.9251 6.05596 12.3657 6.05596V16.495C12.3231 17.9219 11.8008 19.1295 10.7989 20.1178C9.79699 21.1059 8.59735 21.6 7.2 21.6ZM2.02375 4.3507H12.3657C12.465 4.3507 12.552 4.31602 12.6266 4.24667C12.7012 4.17752 12.7385 4.09187 12.7385 3.98975V2.07701C12.7385 1.97488 12.7012 1.88744 12.6266 1.81468C12.552 1.74174 12.465 1.70526 12.3657 1.70526H2.02375C1.92425 1.70526 1.83905 1.74174 1.76815 1.81468C1.69708 1.88744 1.66154 1.97488 1.66154 2.07701V3.98975C1.66154 4.09187 1.69708 4.17752 1.76815 4.24667C1.83905 4.31602 1.92425 4.3507 2.02375 4.3507ZM7.2 19.8947C8.17274 19.8947 9 19.5504 9.68179 18.8616C10.3634 18.1731 10.7042 17.3295 10.7042 16.331V15.9047H8.10526C7.86951 15.9047 7.67215 15.8231 7.5132 15.66C7.35406 15.4967 7.27449 15.294 7.27449 15.0521C7.27449 14.8103 7.35406 14.6078 7.5132 14.4444C7.67215 14.2813 7.86951 14.1997 8.10526 14.1997H10.7042V11.4449H8.10526C7.86951 11.4449 7.67215 11.3633 7.5132 11.2002C7.35406 11.0368 7.27449 10.8342 7.27449 10.5922C7.27449 10.3503 7.35406 10.1477 7.5132 9.9846C7.67215 9.82127 7.86951 9.73961 8.10526 9.73961H10.7042V6.05596H3.68529V16.331C3.68529 17.3295 4.02785 18.1731 4.71295 18.8616C5.39825 19.5504 6.22726 19.8947 7.2 19.8947Z\" fill=\"currentColor\"/></g></svg>`,\n AdverseEvent: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(23.3 2.4) scale(-1 1)\"><path d=\"M10.6992 19.2C10.4407 19.2 10.1891 19.1517 9.94435 19.055C9.69958 18.9583 9.48409 18.8132 9.29789 18.6197L1.96865 11.2623C1.31168 10.6053 0.819334 9.85997 0.4916 9.02619C0.163867 8.19221 0 7.3298 0 6.43895C0 4.66457 0.567433 3.14782 1.7023 1.88869C2.83717 0.629562 4.24205 0 5.91694 0C6.75298 0 7.54819 0.16931 8.30258 0.50793C9.05716 0.84655 9.72971 1.32051 10.3202 1.9298L10.6992 2.33045L11.0565 1.95148C11.6427 1.32773 12.3149 0.84655 13.073 0.50793C13.831 0.16931 14.6244 0 15.4533 0C17.1282 0 18.5378 0.629562 19.682 1.88869C20.8263 3.14782 21.3984 4.65519 21.3984 6.41079C21.3984 7.30896 21.2316 8.17494 20.8981 9.00873C20.5645 9.8427 20.0751 10.5882 19.4298 11.2451L12.0724 18.6197C11.8788 18.8132 11.6662 18.9583 11.4344 19.055C11.2027 19.1517 10.9577 19.2 10.6992 19.2ZM11.8254 5.39296C11.9698 5.39296 12.1047 5.42722 12.2303 5.49573C12.3561 5.56443 12.455 5.65584 12.5271 5.76997L14.5174 8.77166H19.1482C19.3445 8.39474 19.4918 8.00779 19.59 7.61079C19.6881 7.2138 19.7336 6.8138 19.7265 6.41079C19.6961 5.11563 19.2752 4.0107 18.4637 3.09601C17.6523 2.18132 16.6488 1.72398 15.4533 1.72398C14.857 1.72398 14.2804 1.84205 13.7237 2.07818C13.1672 2.31431 12.6846 2.65903 12.2759 3.11234L11.3856 4.06964C11.2991 4.17513 11.1952 4.25349 11.074 4.30474C10.9527 4.35598 10.8278 4.3816 10.6992 4.3816C10.5706 4.3816 10.4439 4.35411 10.3191 4.29911C10.1943 4.2443 10.0828 4.16781 9.98461 4.06964L9.09432 3.11234C8.68569 2.65903 8.20591 2.30849 7.655 2.06072C7.10427 1.81314 6.52492 1.68935 5.91694 1.68935C4.72145 1.68935 3.71797 2.15251 2.90652 3.07884C2.09507 4.00497 1.68935 5.11563 1.68935 6.41079C1.68935 6.82093 1.73552 7.22271 1.82787 7.61614C1.92041 8.00957 2.06119 8.39474 2.25021 8.77166H7.32051C7.46485 8.77166 7.59803 8.80591 7.72004 8.87442C7.84205 8.94312 7.93918 9.03454 8.01145 9.14866L9.32182 11.0999L11.0264 5.98649C11.087 5.81173 11.1887 5.66917 11.3316 5.5588C11.4746 5.44824 11.6392 5.39296 11.8254 5.39296ZM12.0766 8.1328L10.372 13.2462C10.3114 13.4209 10.205 13.5635 10.0527 13.6739C9.90033 13.7844 9.73102 13.8397 9.54482 13.8397C9.40047 13.8397 9.26729 13.8054 9.14528 13.7369C9.02328 13.6682 8.92614 13.5768 8.85387 13.4627L6.85284 10.461H3.55833L10.5021 17.4155C10.5397 17.453 10.5725 17.4765 10.6007 17.4859C10.6288 17.4953 10.6617 17.5 10.6992 17.5C10.7367 17.5 10.7696 17.4953 10.7977 17.4859C10.8259 17.4765 10.8588 17.453 10.8963 17.4155L17.8226 10.461H14.0779C13.9336 10.461 13.7986 10.4249 13.673 10.3526C13.5473 10.2805 13.4425 10.1874 13.3588 10.0733L12.0766 8.1328Z\" fill=\"currentColor\"/></g></svg>`,\n Medication: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(2.33 1.2)\"><path d=\"M4.1233 15.2603H2.97553C2.42605 15.2603 1.95569 15.0647 1.56444 14.6735C1.17319 14.2822 0.977568 13.8118 0.977568 13.2624V5.10087H0.828915C0.594056 5.10087 0.397143 5.02138 0.238175 4.86242C0.0793918 4.70345 0 4.50654 0 4.27168C0 4.03663 0.0793918 3.83981 0.238175 3.68121C0.397143 3.52243 0.594056 3.44304 0.828915 3.44304H4.1233V1.65783H3.40076C3.1659 1.65783 2.96899 1.57835 2.81002 1.41938C2.65124 1.26041 2.57185 1.06341 2.57185 0.828362C2.57185 0.593503 2.65124 0.396682 2.81002 0.237898C2.96899 0.0792992 3.1659 0 3.40076 0H6.50367C6.73853 0 6.93544 0.0794839 7.09441 0.238451C7.25319 0.397235 7.33258 0.594148 7.33258 0.829192C7.33258 1.06424 7.25319 1.26106 7.09441 1.41966C6.93544 1.57844 6.73853 1.65783 6.50367 1.65783H5.78113V3.44304H9.07552C9.31038 3.44304 9.5072 3.52252 9.66598 3.68149C9.82495 3.84046 9.90443 4.03737 9.90443 4.27223C9.90443 4.50727 9.82495 4.70409 9.66598 4.86269C9.5072 5.02148 9.31038 5.10087 9.07552 5.10087H8.92659V13.2624C8.92659 13.8118 8.73097 14.2822 8.33972 14.6735C7.94847 15.0647 7.4782 15.2603 6.9289 15.2603H5.78113V19.9683C5.78113 20.1361 5.7046 20.262 5.55152 20.346C5.39845 20.43 5.25109 20.416 5.10943 20.304L4.45487 19.8108C4.34582 19.7286 4.2633 19.6314 4.2073 19.519C4.1513 19.4065 4.1233 19.2799 4.1233 19.1394V15.2603ZM15.3642 20.2338C14.2706 20.2338 13.3352 19.8447 12.5581 19.0664C11.7809 18.288 11.3923 17.3522 11.3923 16.2592V7.9703C11.3923 6.87723 11.7817 5.94157 12.5606 5.16331C13.3394 4.38487 14.2756 3.99565 15.3692 3.99565C16.4628 3.99565 17.3982 4.38487 18.1753 5.16331C18.9527 5.94157 19.3414 6.87723 19.3414 7.9703V16.2592C19.3414 17.3522 18.952 18.288 18.1731 19.0664C17.3941 19.8447 16.4578 20.2338 15.3642 20.2338ZM2.97553 13.6025H6.9289C7.028 13.6025 7.10942 13.5706 7.17316 13.5069C7.23708 13.4432 7.26903 13.3617 7.26903 13.2624V11.6471H5.22852C5.05279 11.6471 4.89907 11.5812 4.76737 11.4495C4.63548 11.3178 4.56953 11.1641 4.56953 10.9884C4.56953 10.8126 4.63548 10.6589 4.76737 10.5272C4.89907 10.3953 5.05279 10.3294 5.22852 10.3294H7.26903V8.37398H5.22852C5.05279 8.37398 4.89907 8.30813 4.76737 8.17642C4.63548 8.04453 4.56953 7.89081 4.56953 7.71527C4.56953 7.53954 4.63548 7.38573 4.76737 7.25384C4.89907 7.12213 5.05279 7.05628 5.22852 7.05628H7.26903V5.10087H2.6354V13.2624C2.6354 13.3617 2.66726 13.4432 2.731 13.5069C2.79492 13.5706 2.87643 13.6025 2.97553 13.6025ZM15.372 5.65348C14.7322 5.65348 14.1853 5.87876 13.7313 6.32932C13.277 6.77988 13.0499 7.32687 13.0499 7.9703V8.2466H17.6835V7.9703C17.6835 7.32687 17.4582 6.77988 17.0077 6.32932C16.5569 5.87876 16.0117 5.65348 15.372 5.65348ZM13.0499 14.3253H17.6835V9.90443H13.0499V14.3253ZM15.3667 18.576C16.0099 18.576 16.5569 18.3491 17.0077 17.8955C17.4582 17.4418 17.6835 16.8963 17.6835 16.2592V15.9829H13.0499V16.2592C13.0499 16.8963 13.2767 17.4418 13.7304 17.8955C14.1841 18.3491 14.7295 18.576 15.3667 18.576Z\" fill=\"currentColor\"/></g></svg>`,\n Withdrawal: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(3.5 3.5)\"><path d=\"M1.80775 17C1.30258 17 0.875 16.825 0.525 16.475C0.175 16.125 0 15.6974 0 15.1923V1.80775C0 1.30258 0.175 0.875 0.525 0.525C0.875 0.175 1.30258 0 1.80775 0H7.7598C7.9724 0 8.1506 0.0718301 8.2943 0.2155C8.4378 0.359 8.5095 0.53717 8.5095 0.75C8.5095 0.96283 8.4378 1.141 8.2943 1.2845C8.1506 1.42817 7.9724 1.5 7.7598 1.5H1.80775C1.73075 1.5 1.66025 1.53208 1.59625 1.59625C1.53208 1.66025 1.5 1.73075 1.5 1.80775V15.1923C1.5 15.2692 1.53208 15.3398 1.59625 15.4038C1.66025 15.4679 1.73075 15.5 1.80775 15.5H7.7598C7.9724 15.5 8.1506 15.5718 8.2943 15.7155C8.4378 15.859 8.5095 16.0372 8.5095 16.25C8.5095 16.4628 8.4378 16.641 8.2943 16.7845C8.1506 16.9282 7.9724 17 7.7598 17H1.80775ZM14.1173 9.25H6.34625C6.13342 9.25 5.95517 9.1782 5.8115 9.0345C5.668 8.891 5.59625 8.7128 5.59625 8.5C5.59625 8.2872 5.668 8.109 5.8115 7.9655C5.95517 7.8218 6.13342 7.75 6.34625 7.75H14.1173L12.1943 5.827C12.0558 5.6885 11.9849 5.51958 11.9818 5.32025C11.9786 5.12092 12.0494 4.94367 12.1943 4.7885C12.3391 4.63333 12.5148 4.55317 12.7213 4.548C12.9276 4.543 13.1083 4.618 13.2635 4.773L16.3578 7.8672C16.5384 8.0481 16.6288 8.259 16.6288 8.5C16.6288 8.741 16.5384 8.9519 16.3578 9.1328L13.2635 12.227C13.1148 12.3757 12.9383 12.449 12.7338 12.447C12.5293 12.4452 12.3494 12.3667 12.1943 12.2115C12.0494 12.0563 11.9796 11.8782 11.9848 11.677C11.9898 11.4757 12.0648 11.3026 12.2098 11.1578L14.1173 9.25Z\" fill=\"currentColor\"/></g></svg>`,\n Other: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(3.03 3)\"><path d=\"M11.3703 14.4218C11.5531 14.4218 11.7108 14.3555 11.8435 14.223C11.9761 14.0903 12.0423 13.9325 12.0423 13.7498C12.0423 13.5668 11.9761 13.4091 11.8435 13.2766C11.7108 13.144 11.5531 13.0778 11.3703 13.0778C11.1874 13.0778 11.0297 13.144 10.8971 13.2766C10.7646 13.4091 10.6983 13.5668 10.6983 13.7498C10.6983 13.9325 10.7646 14.0903 10.8971 14.223C11.0297 14.3555 11.1874 14.4218 11.3703 14.4218ZM13.6952 14.4218C13.8781 14.4218 14.0359 14.3555 14.1684 14.223C14.301 14.0903 14.3672 13.9325 14.3672 13.7498C14.3672 13.5668 14.301 13.4091 14.1684 13.2766C14.0359 13.144 13.8781 13.0778 13.6952 13.0778C13.5123 13.0778 13.3546 13.144 13.222 13.2766C13.0895 13.4091 13.0232 13.5668 13.0232 13.7498C13.0232 13.9325 13.0895 14.0903 13.222 14.223C13.3546 14.3555 13.5123 14.4218 13.6952 14.4218ZM16.0201 14.4218C16.203 14.4218 16.3607 14.3555 16.4933 14.223C16.6258 14.0903 16.6921 13.9325 16.6921 13.7498C16.6921 13.5668 16.6258 13.4091 16.4933 13.2766C16.3607 13.144 16.203 13.0778 16.0201 13.0778C15.8373 13.0778 15.6796 13.144 15.5469 13.2766C15.4144 13.4091 15.3481 13.5668 15.3481 13.7498C15.3481 13.9325 15.4144 14.0903 15.5469 14.223C15.6796 14.3555 15.8373 14.4218 16.0201 14.4218ZM1.70742 16.0565C1.23784 16.0565 0.83588 15.8893 0.501528 15.5549C0.167176 15.2206 0 14.8186 0 14.349V1.70742C0 1.23784 0.167176 0.83588 0.501528 0.501528C0.83588 0.167176 1.23784 0 1.70742 0H14.349C14.8186 0 15.2206 0.167176 15.5549 0.501528C15.8893 0.83588 16.0565 1.23784 16.0565 1.70742V6.48445C16.0565 6.68515 15.9885 6.85335 15.8527 6.98905C15.7168 7.1249 15.5486 7.19282 15.3478 7.19282C15.147 7.19282 14.9788 7.1249 14.8433 6.98905C14.7076 6.85335 14.6397 6.68515 14.6397 6.48445V1.70742C14.6397 1.63469 14.6094 1.5681 14.5488 1.50765C14.4884 1.44705 14.4218 1.41675 14.349 1.41675H1.70742C1.63469 1.41675 1.5681 1.44705 1.50765 1.50765C1.44705 1.5681 1.41675 1.63469 1.41675 1.70742V14.349C1.41675 14.4218 1.44705 14.4884 1.50765 14.5488C1.5681 14.6094 1.63469 14.6397 1.70742 14.6397H6.48445C6.68515 14.6397 6.85335 14.7076 6.98905 14.8435C7.1249 14.9793 7.19282 15.1476 7.19282 15.3483C7.19282 15.5492 7.1249 15.7174 6.98905 15.8529C6.85335 15.9886 6.68515 16.0565 6.48445 16.0565H1.70742ZM1.41675 13.6983V14.6397V1.41675V7.26366V7.19282V13.6983ZM3.54187 11.6976C3.54187 11.8983 3.60979 12.0665 3.74564 12.2022C3.88133 12.3377 4.04953 12.4055 4.25024 12.4055H6.62778C6.82848 12.4055 6.99676 12.3376 7.13261 12.2017C7.2683 12.066 7.33615 11.8978 7.33615 11.6969C7.33615 11.4962 7.2683 11.328 7.13261 11.1923C6.99676 11.0568 6.82848 10.989 6.62778 10.989H4.25024C4.04953 10.989 3.88133 11.0568 3.74564 11.1925C3.60979 11.3284 3.54187 11.4967 3.54187 11.6976ZM3.54187 8.02847C3.54187 8.22933 3.60979 8.39753 3.74564 8.53306C3.88133 8.66876 4.04953 8.7366 4.25024 8.7366H9.67213C9.87283 8.7366 10.041 8.66868 10.1767 8.53283C10.3126 8.39698 10.3805 8.2287 10.3805 8.02799C10.3805 7.82713 10.3126 7.65893 10.1767 7.5234C10.041 7.3877 9.87283 7.31986 9.67213 7.31986H4.25024C4.04953 7.31986 3.88133 7.38778 3.74564 7.52363C3.60979 7.65948 3.54187 7.82776 3.54187 8.02847ZM3.54187 4.35957C3.54187 4.56027 3.60979 4.72847 3.74564 4.86416C3.88133 4.9997 4.04953 5.06747 4.25024 5.06747H11.8062C12.0069 5.06747 12.1751 4.99962 12.3108 4.86393C12.4467 4.72808 12.5146 4.55972 12.5146 4.35886C12.5146 4.15815 12.4467 3.98995 12.3108 3.85426C12.1751 3.71872 12.0069 3.65096 11.8062 3.65096H4.25024C4.04953 3.65096 3.88133 3.71888 3.74564 3.85473C3.60979 3.99042 3.54187 4.1587 3.54187 4.35957ZM13.6952 18C12.5159 18 11.5126 17.5865 10.6856 16.7594C9.85851 15.9323 9.44498 14.9291 9.44498 13.7498C9.44498 12.5704 9.85851 11.5672 10.6856 10.7401C11.5126 9.91305 12.5159 9.49952 13.6952 9.49952C14.8746 9.49952 15.8778 9.91305 16.7049 10.7401C17.5319 11.5672 17.9455 12.5704 17.9455 13.7498C17.9455 14.9291 17.5319 15.9323 16.7049 16.7594C15.8778 17.5865 14.8746 18 13.6952 18Z\" fill=\"currentColor\"/></g></svg>`,\n NA: `<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(3.67 3.67)\"><path d=\"M8.33483 16.6667C7.18225 16.6667 6.09883 16.4479 5.08465 16.0105C4.07047 15.5731 3.1883 14.9795 2.43816 14.2296C1.68801 13.4798 1.09408 12.5979 0.656358 11.5842C0.218783 10.5705 0 9.48733 0 8.33483C0 7.18225 0.218717 6.09883 0.656142 5.08465C1.09357 4.07047 1.68721 3.1883 2.43706 2.43816C3.18692 1.68801 4.06872 1.09408 5.08246 0.656358C6.0962 0.218783 7.17933 0 8.33183 0C9.48442 0 10.5678 0.218717 11.582 0.656142C12.5962 1.09357 13.4783 1.68721 14.2285 2.43706C14.9787 3.18692 15.5726 4.06872 16.0103 5.08246C16.4479 6.0962 16.6667 7.17933 16.6667 8.33183C16.6667 9.48442 16.4479 10.5678 16.0105 11.582C15.5731 12.5962 14.9795 13.4783 14.2296 14.2285C13.4798 14.9787 12.5979 15.5726 11.5842 16.0103C10.5705 16.4479 9.48733 16.6667 8.33483 16.6667ZM8.33333 15.3509C9.15625 15.3509 9.94883 15.2117 10.711 14.9333C11.4729 14.655 12.1693 14.2521 12.8002 13.7247L2.94188 3.86645C2.4201 4.49729 2.01864 5.19372 1.7375 5.9557C1.45636 6.71783 1.31579 7.51042 1.31579 8.33333C1.31579 10.2924 1.99562 11.9517 3.35527 13.3114C4.71491 14.6711 6.37427 15.3509 8.33333 15.3509ZM13.7247 12.8002C14.2521 12.1693 14.655 11.4729 14.9333 10.711C15.2117 9.94883 15.3509 9.15625 15.3509 8.33333C15.3509 6.37427 14.6711 4.71491 13.3114 3.35527C11.9517 1.99562 10.2924 1.31579 8.33333 1.31579C7.50833 1.31579 6.71392 1.45358 5.95 1.72917C5.18626 2.00461 4.49174 2.40884 3.86645 2.94188L13.7247 12.8002Z\" fill=\"currentColor\"/></g></svg>`,\n};\n\n// ---------------------------------------------------------------------------\n// Status → render config.\n// ---------------------------------------------------------------------------\ntype CircleVariant =\n | \"complete\"\n | \"incomplete\"\n | \"current\"\n | \"add\"\n | \"studyCompletion\"\n | \"inactive\";\n\nconst CIRCLE_STATUSES: Record<Exclude<StudyProgressStatus, \"Late\">, CircleVariant> = {\n Complete: \"complete\",\n StudyCompletion: \"studyCompletion\",\n Incomplete: \"incomplete\",\n Current: \"current\",\n Add: \"add\",\n Skipped: \"inactive\",\n FutureVisit: \"inactive\",\n FutureSurvey: \"inactive\",\n Labwork: \"inactive\",\n AdverseEvent: \"inactive\",\n Medication: \"inactive\",\n Withdrawal: \"inactive\",\n Other: \"inactive\",\n NA: \"inactive\",\n};\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const StudyProgressSymbol = React.forwardRef<HTMLElement, StudyProgressSymbolProps>(\n function StudyProgressSymbol(\n { status, \"aria-label\": ariaLabel, onClick, className, title },\n ref\n ) {\n ensureStyles();\n\n const isButton = !!onClick;\n const wrapperClass =\n \"eds-sps\" +\n (status === \"Late\" ? \" eds-sps--late\" : \"\") +\n (className ? ` ${className}` : \"\");\n const ariaText = ariaLabel ?? `Status: ${status}`;\n const commonProps = {\n className: wrapperClass,\n title: title ?? ariaText,\n \"aria-label\": ariaText,\n };\n\n const inner = status === \"Late\" ? (\n <span\n className=\"eds-sps__late-wrap\"\n dangerouslySetInnerHTML={{ __html: FIGMA_GLYPHS.Late }}\n />\n ) : (\n (() => {\n const variant = CIRCLE_STATUSES[status];\n return (\n <span className={`eds-sps__circle eds-sps__circle--${variant}`}>\n <span\n className=\"eds-sps__glyph\"\n dangerouslySetInnerHTML={{ __html: FIGMA_GLYPHS[status] }}\n />\n </span>\n );\n })()\n );\n\n if (isButton) {\n return (\n <button\n ref={ref as React.Ref<HTMLButtonElement>}\n type=\"button\"\n role=\"button\"\n onClick={onClick}\n {...commonProps}\n >\n {inner}\n </button>\n );\n }\n return (\n <span\n ref={ref as React.Ref<HTMLSpanElement>}\n role=\"img\"\n {...commonProps}\n >\n {inner}\n </span>\n );\n }\n);\n\nexport default StudyProgressSymbol;\n\n// ---------------------------------------------------------------------------\n// StudyProgressSymbolMatrix — showcase grid of all 15 statuses.\n// ---------------------------------------------------------------------------\nexport function StudyProgressSymbolMatrix() {\n ensureStyles();\n const statuses: StudyProgressStatus[] = [\n \"Complete\", \"Incomplete\", \"Current\", \"Add\", \"Late\",\n \"StudyCompletion\", \"Skipped\", \"FutureVisit\", \"FutureSurvey\",\n \"Labwork\", \"AdverseEvent\", \"Medication\", \"Withdrawal\", \"Other\", \"NA\",\n ];\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\" }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: \"0 0 24px\" }}>\n All statuses\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fill, minmax(160px, 1fr))\", gap: 24 }}>\n {statuses.map((s) => (\n <div key={s} style={{ display: \"flex\", alignItems: \"center\", gap: 12 }}>\n <StudyProgressSymbol status={s} />\n <span style={{ fontSize: 14, color: \"#0E0E0E\" }}>{s}</span>\n </div>\n ))}\n </div>\n\n </div>\n );\n}\n","/**\n * Tab — React port of Embleema Design System 2.0's Navigation/TabItem\n * (Figma node 5099:22) and Navigation/TabBar (Figma node 5331:38).\n *\n * Two exports:\n * - <TabItem /> : the individual underline-style tab item.\n * - <TabBar /> : an interactive horizontal bar of TabItems with a\n * shared active value and onChange callback.\n *\n * TabItem layout (per Figma):\n * flex flex-col items-center justify-center gap 6, pt 8, px 12\n * - Label: 14 px Nunito, uppercase, letter-spacing 0.06em\n * - Active label: Nunito SemiBold; Inactive: Regular\n * - Active underline: 2 px strip, full width\n *\n * Color mapping:\n * Default : Text/Secondary (#5E5E5E)\n * Hover : Text/Primary (#0E0E0E) + Background/Selected fill\n * Focus : Text/Primary + Background/Selected fill\n * + 4 px Border/FocusRing outline\n * Disabled : Text/Disabled (#B0B0B0)\n * Primary Active : Text/Primary + Accent/Brand (#C20A72) underline\n * Secondary Active: Blue/500 (#2655BA) + Blue/500 underline\n *\n * TabBar (per Figma):\n * bg Background/Default, border-bottom 1 px Border/Default,\n * gap 20, padding 0 40.\n */\n\nimport * as React from \"react\";\n\nexport type TabType = \"Primary\" | \"Secondary\";\nexport type TabState = \"Default\" | \"Active\" | \"Hover\" | \"Focus\" | \"Disabled\";\n\nexport type TabItemProps = {\n label: string;\n type?: TabType;\n state?: TabState;\n /** When true, ignores `state` and renders as Active. Used by TabBar. */\n active?: boolean;\n /** When true, ignores `state` and renders as Disabled. */\n disabled?: boolean;\n onClick?: () => void;\n id?: string;\n className?: string;\n \"aria-controls\"?: string;\n};\n\nexport type TabBarItem = {\n /** Stable id used as the active key. */\n value: string;\n label: string;\n disabled?: boolean;\n};\n\nexport type TabBarProps = {\n items: TabBarItem[];\n /** Controlled active value. Falls back to the first item when omitted. */\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n type?: TabType;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600&display=swap\");\n\n:root {\n --tab-text-primary: #0E0E0E;\n --tab-text-secondary: #5E5E5E;\n --tab-text-disabled: #B0B0B0;\n --tab-background-default: #FEFEFE;\n --tab-background-selected: #E3ECFF;\n --tab-border-default: #DDDDDD;\n --tab-border-focus-ring: #A2BDF5;\n --tab-accent-brand: #C20A72;\n --tab-blue-500: #2655BA;\n}\n\n.eds-tab {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 6px;\n padding: 8px 12px 0;\n border: 0;\n background: transparent;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.2;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: var(--tab-text-secondary);\n white-space: nowrap;\n flex-shrink: 0;\n transition: color 120ms ease-out, background-color 120ms ease-out;\n outline: 0;\n}\n.eds-tab__label { display: inline-block; }\n.eds-tab__underline {\n height: 2px;\n width: 100%;\n background: transparent;\n}\n\n/* Hover — fill with Background/Selected, label flips to Text/Primary. */\n.eds-tab:not([data-locked=\"true\"]):hover,\n.eds-tab[data-state=\"Hover\"]:not([data-locked=\"true\"]) {\n background: var(--tab-background-selected);\n color: var(--tab-text-primary);\n}\n/* Focus — same fill as Hover plus a 4 px Border/FocusRing outline. Real\n keyboard focus and the forced data-state=\"Focus\" both trigger this. */\n.eds-tab:not([data-locked=\"true\"]):focus-visible,\n.eds-tab[data-state=\"Focus\"]:not([data-locked=\"true\"]) {\n background: var(--tab-background-selected);\n color: var(--tab-text-primary);\n outline: 4px solid var(--tab-border-focus-ring);\n outline-offset: -4px;\n}\n\n/* Disabled — gray label, no interaction. */\n.eds-tab[data-state=\"Disabled\"],\n.eds-tab[data-locked=\"true\"] {\n color: var(--tab-text-disabled);\n cursor: not-allowed;\n}\n.eds-tab[data-state=\"Disabled\"]:hover,\n.eds-tab[data-locked=\"true\"]:hover {\n background: transparent;\n color: var(--tab-text-disabled);\n}\n\n/* Active — bold label + underline. Color depends on Type. */\n.eds-tab[data-active=\"true\"] {\n font-weight: 600;\n cursor: default;\n}\n.eds-tab[data-active=\"true\"]:hover,\n.eds-tab[data-active=\"true\"]:focus-visible {\n background: transparent;\n outline: 0;\n}\n.eds-tab[data-active=\"true\"][data-type=\"Primary\"] {\n color: var(--tab-text-primary);\n}\n.eds-tab[data-active=\"true\"][data-type=\"Primary\"] .eds-tab__underline {\n background: var(--tab-accent-brand);\n}\n.eds-tab[data-active=\"true\"][data-type=\"Secondary\"] {\n color: var(--tab-blue-500);\n}\n.eds-tab[data-active=\"true\"][data-type=\"Secondary\"] .eds-tab__underline {\n background: var(--tab-blue-500);\n}\n\n/* ---------- TabBar ---------- */\n.eds-tabbar {\n display: flex;\n gap: 20px;\n align-items: flex-end;\n padding: 0 40px;\n border-bottom: 1px solid var(--tab-border-default);\n background: var(--tab-background-default);\n width: 100%;\n box-sizing: border-box;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-tab-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-tab-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-tab-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-tab-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-tab-matrix__grid {\n display: grid;\n grid-template-columns: 100px repeat(5, minmax(120px, 1fr));\n gap: 0;\n border: 1px solid #EEEEEE;\n border-radius: 8px;\n overflow: hidden;\n align-items: stretch;\n}\n.eds-tab-matrix__cell {\n border-right: 1px solid #EEEEEE;\n border-bottom: 1px solid #EEEEEE;\n background: #FEFEFE;\n min-height: 64px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 8px;\n}\n.eds-tab-matrix__cell:last-child { border-right: none; }\n.eds-tab-matrix__cell--head {\n background: #F8F8F8;\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-tab-matrix__stage {\n padding: 24px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-tab-matrix__frame {\n background: #FEFEFE;\n border-radius: 4px;\n overflow: hidden;\n}\n.eds-tab-matrix__controls { display: inline-flex; gap: 8px; flex-wrap: wrap; }\n.eds-tab-matrix__chip {\n padding: 6px 14px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n transition: background-color 120ms;\n}\n.eds-tab-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-tab-matrix__chip[data-active=\"true\"] {\n background: #306AE8;\n color: #FEFEFE;\n border-color: #306AE8;\n}\n.eds-tab-matrix__caption {\n font-size: 11px;\n color: #5E5E5E;\n text-align: center;\n margin: 8px 0 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-tab]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-tab\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// TabItem\n// ---------------------------------------------------------------------------\nexport const TabItem = React.forwardRef<HTMLButtonElement, TabItemProps>(\n function TabItem(\n {\n label,\n type = \"Primary\",\n state = \"Default\",\n active,\n disabled,\n onClick,\n id,\n className,\n \"aria-controls\": ariaControls,\n },\n ref\n ) {\n ensureStyles();\n\n // Active / Disabled boolean props win over the catch-all `state` enum.\n const isActive = active ?? state === \"Active\";\n const isDisabled = disabled ?? state === \"Disabled\";\n const dataState =\n isActive ? \"Active\" : isDisabled ? \"Disabled\" : state;\n\n const wrapperClass = \"eds-tab\" + (className ? ` ${className}` : \"\");\n\n return (\n <button\n ref={ref}\n type=\"button\"\n id={id}\n className={wrapperClass}\n data-type={type}\n data-state={dataState}\n data-active={isActive || undefined}\n data-locked={isDisabled || undefined}\n role=\"tab\"\n aria-selected={isActive}\n aria-disabled={isDisabled || undefined}\n disabled={isDisabled}\n tabIndex={isDisabled ? -1 : isActive ? 0 : 0}\n onClick={isDisabled ? undefined : onClick}\n aria-controls={ariaControls}\n >\n <span className=\"eds-tab__label\">{label}</span>\n <span className=\"eds-tab__underline\" aria-hidden />\n </button>\n );\n }\n);\n\n// ---------------------------------------------------------------------------\n// TabBar\n// ---------------------------------------------------------------------------\nexport const TabBar = React.forwardRef<HTMLDivElement, TabBarProps>(\n function TabBar(\n {\n items,\n value,\n defaultValue,\n onChange,\n type = \"Primary\",\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = value !== undefined;\n const fallback = defaultValue ?? items[0]?.value ?? \"\";\n const [internal, setInternal] = React.useState<string>(fallback);\n const current = isControlled ? (value as string) : internal;\n\n const handleSelect = (next: string) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const wrapperClass = \"eds-tabbar\" + (className ? ` ${className}` : \"\");\n\n return (\n <div\n ref={ref}\n className={wrapperClass}\n role=\"tablist\"\n aria-label={ariaLabel ?? \"Tabs\"}\n data-type={type}\n >\n {items.map((it) => (\n <TabItem\n key={it.value}\n label={it.label}\n type={type}\n active={it.value === current}\n disabled={it.disabled}\n onClick={() => handleSelect(it.value)}\n />\n ))}\n </div>\n );\n }\n);\n\nexport default TabBar;\n\n// ---------------------------------------------------------------------------\n// TabMatrix — every TabItem variant in a Type × State grid, plus interactive\n// TabBars for Primary and Secondary types.\n// ---------------------------------------------------------------------------\nconst TAB_STATES: TabState[] = [\"Default\", \"Active\", \"Hover\", \"Focus\", \"Disabled\"];\nconst TAB_TYPES: TabType[] = [\"Primary\", \"Secondary\"];\n\nconst DEMO_ITEMS: TabBarItem[] = [\n { value: \"tab-1\", label: \"Tab 1\" },\n { value: \"tab-2\", label: \"Connect Records\" },\n { value: \"tab-3\", label: \"My Health\" },\n];\n\nexport function TabMatrix() {\n ensureStyles();\n const [primaryValue, setPrimaryValue] = React.useState(\"tab-1\");\n const [secondaryValue, setSecondaryValue] = React.useState(\"tab-1\");\n const [activeType, setActiveType] = React.useState<TabType>(\"Primary\");\n\n const liveValue = activeType === \"Primary\" ? primaryValue : secondaryValue;\n const setLive = activeType === \"Primary\" ? setPrimaryValue : setSecondaryValue;\n\n return (\n <div className=\"eds-tab-matrix\">\n <section className=\"eds-tab-matrix__section\">\n <h3 className=\"eds-tab-matrix__heading\">Tab Item · Type × State (static)</h3>\n <p className=\"eds-tab-matrix__sub\">\n Every state is rendered with the forced <code>state</code> prop so\n Hover, Focus, and Disabled show consistently for QA. Active uses\n Accent/Brand pink for Primary and Blue/500 for Secondary.\n </p>\n <div className=\"eds-tab-matrix__grid\">\n <div className=\"eds-tab-matrix__cell eds-tab-matrix__cell--head\">Type</div>\n {TAB_STATES.map((s) => (\n <div\n key={s}\n className=\"eds-tab-matrix__cell eds-tab-matrix__cell--head\"\n >\n {s}\n </div>\n ))}\n {TAB_TYPES.map((t) => (\n <React.Fragment key={t}>\n <div className=\"eds-tab-matrix__cell eds-tab-matrix__cell--head\">\n {t}\n </div>\n {TAB_STATES.map((s) => (\n <div key={`${t}-${s}`} className=\"eds-tab-matrix__cell\">\n <TabItem label=\"Tab Label\" type={t} state={s} />\n </div>\n ))}\n </React.Fragment>\n ))}\n </div>\n </section>\n\n <section className=\"eds-tab-matrix__section\">\n <h3 className=\"eds-tab-matrix__heading\">Tab Bar · interactive</h3>\n <p className=\"eds-tab-matrix__sub\">\n Click a tab to switch the active value. Toggle the Type chip to see\n Primary (Accent/Brand pink) versus Secondary (Blue/500) underlines.\n </p>\n <div className=\"eds-tab-matrix__controls\" aria-label=\"Type\">\n {TAB_TYPES.map((t) => (\n <button\n key={t}\n type=\"button\"\n className=\"eds-tab-matrix__chip\"\n data-active={activeType === t || undefined}\n onClick={() => setActiveType(t)}\n >\n {t}\n </button>\n ))}\n </div>\n <div className=\"eds-tab-matrix__stage\">\n <div className=\"eds-tab-matrix__frame\">\n <TabBar\n items={DEMO_ITEMS}\n type={activeType}\n value={liveValue}\n onChange={setLive}\n />\n </div>\n </div>\n <p className=\"eds-tab-matrix__caption\">\n Active tab:{\" \"}\n <strong>\n {DEMO_ITEMS.find((it) => it.value === liveValue)?.label ?? \"—\"}\n </strong>\n </p>\n </section>\n\n <section className=\"eds-tab-matrix__section\">\n <h3 className=\"eds-tab-matrix__heading\">Tab Bar · both types (static)</h3>\n <p className=\"eds-tab-matrix__sub\">\n Default content rendered at each Type for side-by-side QA.\n </p>\n <div\n className=\"eds-tab-matrix__stage\"\n style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}\n >\n <div className=\"eds-tab-matrix__frame\">\n <TabBar\n items={DEMO_ITEMS}\n type=\"Primary\"\n defaultValue=\"tab-1\"\n />\n </div>\n <div className=\"eds-tab-matrix__frame\">\n <TabBar\n items={DEMO_ITEMS}\n type=\"Secondary\"\n defaultValue=\"tab-1\"\n />\n </div>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Table — React port of Embleema Design System 2.0's Layout/Table component\n * (Figma node 813:3098). Responsive data table for structured records with\n * sorting, row selection, inline row actions, navigation chevron, and\n * pagination.\n *\n * Variants (per Figma):\n * - Desktop (519:8918) — traditional row/column layout, ~1000 px wide\n * - Mobile (813:3027) — card-based editable layout, 328 px wide\n *\n * Color tokens used (per embleema-design-system.md):\n * - Background/Default #FEFEFE\n * - Background/Primary #F8F8F8 — header band + pagination control\n * - Border/Default #DDDDDD — row dividers + container outline\n * - Border/Dark #0E0E0E — pagination control outline\n * - Text/Primary #0E0E0E — body text and labels\n * - Text/Secondary #5E5E5E — subtext and helper copy\n * - Action/Primary/Background #306AE8 — checkbox fill + focus rings\n *\n * Typography:\n * - Headers : body/md-semibold (Nunito SemiBold 16 / 1.5)\n * - Rows : body/md (Nunito Regular 16 / 1.5)\n * - Footer : body/sm (Nunito Regular 14 / 1.5)\n */\n\nimport * as React from \"react\";\n\n// ===========================================================================\n// Public types\n// ===========================================================================\nexport type SortDirection = \"asc\" | \"desc\" | null;\n\nexport type TableColumn<R> = {\n /** Stable key used for sort state + cell access. */\n key: string;\n /** Header label. */\n label: string;\n /** Whether the column can be sorted. Default false. */\n sortable?: boolean;\n /** Cell renderer. Receives the row + key; default returns `row[key]` as string. */\n render?: (row: R) => React.ReactNode;\n /** Optional subtext renderer (line two of the cell). */\n subtext?: (row: R) => React.ReactNode;\n /** Sort comparator. Default does a string compare on `render` output. */\n compare?: (a: R, b: R) => number;\n};\n\nexport type TableSize = \"Desktop\" | \"Mobile\";\n\nexport type TableProps<R extends { id: string }> = {\n columns: TableColumn<R>[];\n rows: R[];\n size?: TableSize;\n /** Show the selection checkbox column + bulk-select header. Default true. */\n selectable?: boolean;\n /** Controlled selected ids. */\n selectedIds?: string[];\n defaultSelectedIds?: string[];\n onSelectionChange?: (ids: string[]) => void;\n /** Controlled sort state. */\n sort?: { key: string; direction: SortDirection };\n onSortChange?: (next: { key: string; direction: SortDirection }) => void;\n /** Show the \"Actions\" column with per-row action callbacks. Default true. */\n showActions?: boolean;\n actionLabel?: string;\n onAction?: (row: R) => void;\n onActionMenu?: (row: R) => void;\n /** Show the trailing chevron-right column (per-row navigation). Default true. */\n showRowChevron?: boolean;\n onRowNavigate?: (row: R) => void;\n /** Pagination controls. */\n page?: number;\n pageSize?: number;\n totalCount?: number;\n onPageChange?: (page: number) => void;\n /** Custom \"Showing X-Y of N\" string (overrides the default). */\n paginationLabel?: string;\n id?: string;\n className?: string;\n};\n\n// ===========================================================================\n// Stylesheet\n// ===========================================================================\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700&display=swap\");\n\n:root {\n --tbl-background-default: #FEFEFE;\n --tbl-background-primary: #F8F8F8;\n --tbl-border-default: #DDDDDD;\n --tbl-border-dark: #0E0E0E;\n --tbl-text-primary: #0E0E0E;\n --tbl-text-secondary: #5E5E5E;\n --tbl-action-primary: #306AE8;\n --tbl-hover-fill: rgba(48, 106, 232, 0.04);\n}\n\n.eds-table {\n font-family: Nunito, sans-serif;\n background: var(--tbl-background-default);\n border: 1px solid var(--tbl-border-default);\n border-radius: 8px;\n box-shadow: 0 0 4px rgba(0, 0, 0, 0.08);\n overflow: hidden;\n box-sizing: border-box;\n color: var(--tbl-text-primary);\n}\n/* Desktop: stretch to the full available width so rows breathe. */\n.eds-table[data-size=\"Desktop\"] {\n width: 100%;\n display: flex;\n flex-direction: column;\n}\n.eds-table[data-size=\"Mobile\"] {\n width: 328px;\n max-width: 100%;\n display: flex;\n flex-direction: column;\n}\n\n/* ---------------- Desktop header ---------------- *\n * Header padding bumped to 16px horizontal / 8px vertical per the updated\n * Figma source. */\n.eds-table__header {\n display: flex;\n align-items: stretch;\n gap: 20px;\n padding: 8px 16px;\n background: var(--tbl-background-primary);\n border-top: 1px solid var(--tbl-text-secondary);\n}\n.eds-table__select-col {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n}\n.eds-table__col {\n flex: 1 1 0;\n min-width: 0;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 8px 0;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 16px;\n line-height: 1.5;\n color: var(--tbl-text-primary);\n background: transparent;\n border: 0;\n cursor: default;\n text-align: left;\n}\n.eds-table__col[data-sortable=\"true\"] {\n cursor: pointer;\n}\n.eds-table__col[data-sortable=\"true\"]:focus-visible {\n outline: 2px solid var(--tbl-action-primary);\n outline-offset: -2px;\n border-radius: 2px;\n}\n.eds-table__col-label {\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 16px;\n line-height: 1.5;\n color: var(--tbl-text-primary);\n white-space: nowrap;\n}\n.eds-table__col-sort {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n color: var(--tbl-text-primary);\n opacity: 0.55;\n transition: opacity 100ms ease-out, transform 160ms ease-out;\n}\n.eds-table__col[data-sortable=\"true\"]:hover .eds-table__col-sort { opacity: 1; }\n.eds-table__col[data-direction=\"asc\"] .eds-table__col-sort {\n opacity: 1;\n color: var(--tbl-action-primary);\n transform: rotate(180deg);\n}\n.eds-table__col[data-direction=\"desc\"] .eds-table__col-sort {\n opacity: 1;\n color: var(--tbl-action-primary);\n}\n.eds-table__col-sort svg { display: block; width: 16px; height: 16px; }\n\n.eds-table__actions-col {\n flex: 1 1 0;\n min-width: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 8px 0;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 16px;\n line-height: 1.5;\n color: var(--tbl-text-primary);\n}\n.eds-table__nav-col {\n width: 20px;\n flex-shrink: 0;\n}\n\n/* ---------------- Desktop rows ---------------- *\n * Row padding bumped to 16px horizontal / 12px vertical per the updated\n * Figma source — gives rows visibly more breathing room. */\n.eds-table__row {\n display: flex;\n align-items: center;\n gap: 20px;\n padding: 12px 16px;\n border-top: 1px solid var(--tbl-border-default);\n background: var(--tbl-background-default);\n transition: background-color 100ms ease-out;\n}\n.eds-table__row:hover { background: var(--tbl-hover-fill); }\n.eds-table__row[data-selected=\"true\"] { background: rgba(48, 106, 232, 0.06); }\n\n.eds-table__cell {\n flex: 1 1 0;\n min-width: 0;\n height: 42px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n}\n.eds-table__cell-text {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--tbl-text-primary);\n margin: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.eds-table__cell-subtext {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--tbl-text-secondary);\n margin: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.eds-table__actions {\n flex: 1 1 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n}\n.eds-table__action-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 6px 8px;\n height: 28px;\n border: 1px solid var(--tbl-background-default);\n background: transparent;\n border-radius: 8px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 16px;\n line-height: 1.2;\n color: var(--tbl-text-primary);\n transition: background-color 100ms ease-out, border-color 100ms ease-out;\n}\n.eds-table__action-btn:hover {\n background: rgba(0, 0, 0, 0.04);\n border-color: var(--tbl-border-default);\n}\n.eds-table__action-btn:focus-visible {\n outline: 2px solid var(--tbl-action-primary);\n outline-offset: 2px;\n}\n.eds-table__action-menu {\n width: 28px;\n height: 28px;\n border-radius: 999px;\n border: 1px solid var(--tbl-border-default);\n background: transparent;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--tbl-text-primary);\n}\n.eds-table__action-menu:hover { background: rgba(0, 0, 0, 0.04); }\n.eds-table__action-menu:focus-visible {\n outline: 2px solid var(--tbl-action-primary);\n outline-offset: 2px;\n}\n.eds-table__action-menu svg { display: block; width: 14px; height: 14px; }\n\n.eds-table__nav-btn {\n width: 20px;\n height: 20px;\n border: 0;\n background: transparent;\n padding: 0;\n cursor: pointer;\n color: var(--tbl-text-primary);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.eds-table__nav-btn:hover { color: var(--tbl-action-primary); }\n.eds-table__nav-btn:focus-visible {\n outline: 2px solid var(--tbl-action-primary);\n outline-offset: 2px;\n border-radius: 2px;\n}\n.eds-table__nav-btn svg { display: block; width: 20px; height: 20px; }\n\n/* ---------------- Pagination footer ---------------- */\n.eds-table__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px 16px;\n border-top: 1px solid var(--tbl-text-secondary);\n background: var(--tbl-background-default);\n}\n.eds-table__footer-label {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.5;\n color: var(--tbl-text-secondary);\n padding: 12px 0;\n}\n.eds-table__pager {\n display: inline-flex;\n align-items: center;\n gap: 12px;\n padding: 8px 12px;\n background: var(--tbl-background-primary);\n border: 1px solid var(--tbl-border-dark);\n border-radius: 8px;\n}\n.eds-table__pager-btn {\n width: 20px;\n height: 20px;\n border: 0;\n background: transparent;\n padding: 0;\n cursor: pointer;\n color: var(--tbl-text-primary);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.eds-table__pager-btn:hover:not(:disabled) { color: var(--tbl-action-primary); }\n.eds-table__pager-btn:disabled { opacity: 0.35; cursor: not-allowed; }\n.eds-table__pager-btn:focus-visible {\n outline: 2px solid var(--tbl-action-primary);\n outline-offset: 2px;\n border-radius: 2px;\n}\n.eds-table__pager-divider {\n width: 1px;\n height: 16px;\n background: var(--tbl-text-secondary);\n}\n.eds-table__pager-btn svg { display: block; width: 20px; height: 20px; }\n\n/* ---------------- Checkbox primitive ---------------- */\n.eds-table__check {\n appearance: none;\n -webkit-appearance: none;\n width: 18px;\n height: 18px;\n border: 2px solid var(--tbl-text-secondary);\n border-radius: 2px;\n background: var(--tbl-background-default);\n cursor: pointer;\n position: relative;\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n transition: background-color 80ms ease-out, border-color 80ms ease-out;\n}\n.eds-table__check:checked,\n.eds-table__check:indeterminate {\n background: var(--tbl-action-primary);\n border-color: var(--tbl-action-primary);\n}\n.eds-table__check:checked::after {\n content: \"\";\n width: 10px;\n height: 5px;\n border-left: 2px solid #FEFEFE;\n border-bottom: 2px solid #FEFEFE;\n transform: rotate(-45deg) translate(1px, -1px);\n}\n.eds-table__check:indeterminate::after {\n content: \"\";\n width: 10px;\n height: 2px;\n background: #FEFEFE;\n}\n.eds-table__check:focus-visible {\n outline: 2px solid var(--tbl-action-primary);\n outline-offset: 2px;\n}\n\n/* ---------------- Mobile card layout ---------------- */\n.eds-table__mobile-card {\n display: flex;\n flex-direction: column;\n border-top: 1px solid var(--tbl-border-default);\n background: var(--tbl-background-default);\n padding: 12px 16px;\n gap: 8px;\n}\n.eds-table__mobile-card[data-selected=\"true\"] {\n background: rgba(48, 106, 232, 0.06);\n}\n.eds-table__mobile-card-top {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 12px;\n}\n.eds-table__mobile-card-rows {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n.eds-table__mobile-card-row {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: 12px;\n}\n.eds-table__mobile-card-label {\n font-family: Nunito, sans-serif;\n font-weight: 600;\n font-size: 14px;\n line-height: 1.5;\n color: var(--tbl-text-secondary);\n flex-shrink: 0;\n}\n.eds-table__mobile-card-value {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.5;\n color: var(--tbl-text-primary);\n text-align: right;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.eds-table__mobile-card-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n padding-top: 4px;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-table-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-table-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-table-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-table-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-table-matrix__readout {\n font-size: 12px;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-table-matrix__row {\n display: flex;\n flex-wrap: wrap;\n align-items: flex-start;\n gap: 24px;\n}\n.eds-table-matrix__chip {\n padding: 6px 14px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n}\n.eds-table-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-table-matrix__chip[data-active=\"true\"] {\n background: #306AE8;\n color: #FEFEFE;\n border-color: #306AE8;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-table]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-table\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ===========================================================================\n// Inline icons\n// ===========================================================================\nfunction ChevronDownIcon() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M4 6l4 4 4-4\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n );\n}\nfunction ChevronLeftIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M12.5 4.5L7 10l5.5 5.5\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n );\n}\nfunction ChevronRightIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M7.5 4.5L13 10l-5.5 5.5\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n );\n}\nfunction ArrowDropDownIcon() {\n // arrow_drop_down circle/triangle for the per-row action menu trigger.\n return (\n <svg viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M3.5 5.5L7 9l3.5-3.5\" stroke=\"currentColor\" strokeWidth=\"1.6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n );\n}\n\n// ===========================================================================\n// Helpers\n// ===========================================================================\nfunction defaultCellValue<R>(row: R, key: string): React.ReactNode {\n const value = (row as Record<string, unknown>)[key];\n if (value == null) return \"\";\n return String(value);\n}\n\nfunction defaultCompare<R>(a: R, b: R, key: string): number {\n const av = String(defaultCellValue(a, key));\n const bv = String(defaultCellValue(b, key));\n return av.localeCompare(bv, undefined, { numeric: true, sensitivity: \"base\" });\n}\n\nfunction nextDirection(direction: SortDirection): SortDirection {\n if (direction === null) return \"asc\";\n if (direction === \"asc\") return \"desc\";\n return null;\n}\n\n// ===========================================================================\n// Component\n// ===========================================================================\nexport function Table<R extends { id: string }>({\n columns,\n rows,\n size = \"Desktop\",\n selectable = true,\n selectedIds,\n defaultSelectedIds = [],\n onSelectionChange,\n sort,\n onSortChange,\n showActions = true,\n actionLabel = \"Action\",\n onAction,\n onActionMenu,\n showRowChevron = true,\n onRowNavigate,\n page = 1,\n pageSize = 5,\n totalCount,\n onPageChange,\n paginationLabel,\n id,\n className,\n}: TableProps<R>) {\n ensureStyles();\n\n // Sort state (controlled / uncontrolled).\n const [internalSort, setInternalSort] = React.useState<{\n key: string;\n direction: SortDirection;\n }>({ key: \"\", direction: null });\n const sortState = sort ?? internalSort;\n\n const handleSort = (key: string) => {\n const nextDir = key === sortState.key ? nextDirection(sortState.direction) : \"asc\";\n const next = { key: nextDir === null ? \"\" : key, direction: nextDir };\n if (!sort) setInternalSort(next);\n onSortChange?.(next);\n };\n\n // Selection state (controlled / uncontrolled).\n const [internalSelected, setInternalSelected] = React.useState<string[]>(defaultSelectedIds);\n const selected = selectedIds ?? internalSelected;\n const setSelection = (next: string[]) => {\n if (!selectedIds) setInternalSelected(next);\n onSelectionChange?.(next);\n };\n\n // Apply sort + pagination locally if no explicit handlers were provided.\n const sortedRows = React.useMemo(() => {\n if (!sortState.direction || !sortState.key) return rows;\n const col = columns.find((c) => c.key === sortState.key);\n if (!col || !col.sortable) return rows;\n const cmp = col.compare ?? ((a: R, b: R) => defaultCompare(a, b, sortState.key));\n const sorted = [...rows].sort(cmp);\n if (sortState.direction === \"desc\") sorted.reverse();\n return sorted;\n }, [rows, columns, sortState]);\n\n const total = totalCount ?? sortedRows.length;\n const pageStart = (page - 1) * pageSize;\n const visibleRows = totalCount == null\n ? sortedRows.slice(pageStart, pageStart + pageSize)\n : sortedRows;\n\n const firstShown = total === 0 ? 0 : pageStart + 1;\n const lastShown = Math.min(pageStart + visibleRows.length, total);\n\n const visibleIds = visibleRows.map((r) => r.id);\n const allSelected = visibleIds.length > 0 && visibleIds.every((rid) => selected.includes(rid));\n const someSelected = visibleIds.some((rid) => selected.includes(rid)) && !allSelected;\n\n // Wire indeterminate state via ref since checkboxes can't take it as a prop.\n const selectAllRef = React.useRef<HTMLInputElement | null>(null);\n React.useEffect(() => {\n if (selectAllRef.current) selectAllRef.current.indeterminate = someSelected;\n }, [someSelected]);\n\n const toggleAll = () => {\n if (allSelected) {\n setSelection(selected.filter((sid) => !visibleIds.includes(sid)));\n } else {\n const merged = Array.from(new Set([...selected, ...visibleIds]));\n setSelection(merged);\n }\n };\n const toggleRow = (rid: string) => {\n if (selected.includes(rid)) {\n setSelection(selected.filter((sid) => sid !== rid));\n } else {\n setSelection([...selected, rid]);\n }\n };\n\n const wrapperClass = \"eds-table\" + (className ? ` ${className}` : \"\");\n\n // -----------------------------------------------------------------------\n // Mobile card layout — same data, restacked\n // -----------------------------------------------------------------------\n if (size === \"Mobile\") {\n return (\n <div ref={undefined} id={id} className={wrapperClass} data-size=\"Mobile\" role=\"list\">\n {visibleRows.map((row) => {\n const isSel = selected.includes(row.id);\n return (\n <div\n key={row.id}\n role=\"listitem\"\n className=\"eds-table__mobile-card\"\n data-selected={isSel || undefined}\n >\n <div className=\"eds-table__mobile-card-top\">\n {selectable && (\n <input\n type=\"checkbox\"\n className=\"eds-table__check\"\n checked={isSel}\n onChange={() => toggleRow(row.id)}\n aria-label={`Select row ${row.id}`}\n />\n )}\n {showRowChevron && (\n <button\n type=\"button\"\n className=\"eds-table__nav-btn\"\n onClick={() => onRowNavigate?.(row)}\n aria-label={`View details for ${row.id}`}\n >\n <ChevronRightIcon />\n </button>\n )}\n </div>\n <div className=\"eds-table__mobile-card-rows\">\n {columns.map((col) => (\n <div key={col.key} className=\"eds-table__mobile-card-row\">\n <span className=\"eds-table__mobile-card-label\">{col.label}</span>\n <span className=\"eds-table__mobile-card-value\">\n {col.render ? col.render(row) : defaultCellValue(row, col.key)}\n </span>\n </div>\n ))}\n </div>\n {showActions && (onAction || onActionMenu) && (\n <div className=\"eds-table__mobile-card-actions\">\n <button\n type=\"button\"\n className=\"eds-table__action-btn\"\n onClick={() => onAction?.(row)}\n >\n {actionLabel}\n </button>\n {onActionMenu && (\n <button\n type=\"button\"\n className=\"eds-table__action-menu\"\n onClick={() => onActionMenu(row)}\n aria-label=\"Row actions\"\n >\n <ArrowDropDownIcon />\n </button>\n )}\n </div>\n )}\n </div>\n );\n })}\n {totalCount != null && (\n <div className=\"eds-table__footer\">\n <span className=\"eds-table__footer-label\">\n {paginationLabel ?? `Showing ${firstShown}-${lastShown} of ${total}`}\n </span>\n </div>\n )}\n </div>\n );\n }\n\n // -----------------------------------------------------------------------\n // Desktop layout\n // -----------------------------------------------------------------------\n const maxPage = Math.max(1, Math.ceil(total / pageSize));\n return (\n <div id={id} className={wrapperClass} data-size=\"Desktop\" role=\"table\">\n <div className=\"eds-table__header\" role=\"row\">\n {selectable && (\n <span className=\"eds-table__select-col\" role=\"columnheader\">\n <input\n ref={selectAllRef}\n type=\"checkbox\"\n className=\"eds-table__check\"\n checked={allSelected}\n onChange={toggleAll}\n aria-label=\"Select all rows\"\n />\n </span>\n )}\n {columns.map((col) => {\n const isSorted = sortState.key === col.key && sortState.direction !== null;\n const direction = isSorted ? sortState.direction : null;\n return (\n <button\n key={col.key}\n type=\"button\"\n role=\"columnheader\"\n aria-sort={\n direction === \"asc\"\n ? \"ascending\"\n : direction === \"desc\"\n ? \"descending\"\n : \"none\"\n }\n className=\"eds-table__col\"\n data-sortable={col.sortable || undefined}\n data-direction={direction ?? undefined}\n onClick={col.sortable ? () => handleSort(col.key) : undefined}\n disabled={!col.sortable}\n >\n <span className=\"eds-table__col-label\">{col.label}</span>\n {col.sortable && (\n <span className=\"eds-table__col-sort\" aria-hidden>\n <ChevronDownIcon />\n </span>\n )}\n </button>\n );\n })}\n {showActions && (\n <span className=\"eds-table__actions-col\" role=\"columnheader\">Actions</span>\n )}\n {showRowChevron && <span className=\"eds-table__nav-col\" aria-hidden />}\n </div>\n {visibleRows.map((row) => {\n const isSel = selected.includes(row.id);\n return (\n <div\n key={row.id}\n role=\"row\"\n className=\"eds-table__row\"\n data-selected={isSel || undefined}\n >\n {selectable && (\n <span className=\"eds-table__select-col\">\n <input\n type=\"checkbox\"\n className=\"eds-table__check\"\n checked={isSel}\n onChange={() => toggleRow(row.id)}\n aria-label={`Select row ${row.id}`}\n />\n </span>\n )}\n {columns.map((col) => (\n <div key={col.key} role=\"cell\" className=\"eds-table__cell\">\n <p className=\"eds-table__cell-text\">\n {col.render ? col.render(row) : defaultCellValue(row, col.key)}\n </p>\n {col.subtext && (\n <p className=\"eds-table__cell-subtext\">{col.subtext(row)}</p>\n )}\n </div>\n ))}\n {showActions && (\n <div className=\"eds-table__actions\" role=\"cell\">\n <button\n type=\"button\"\n className=\"eds-table__action-btn\"\n onClick={() => onAction?.(row)}\n >\n {actionLabel}\n </button>\n {onActionMenu && (\n <button\n type=\"button\"\n className=\"eds-table__action-menu\"\n onClick={() => onActionMenu(row)}\n aria-label=\"Row actions\"\n >\n <ArrowDropDownIcon />\n </button>\n )}\n </div>\n )}\n {showRowChevron && (\n <span className=\"eds-table__nav-col\" role=\"cell\">\n <button\n type=\"button\"\n className=\"eds-table__nav-btn\"\n onClick={() => onRowNavigate?.(row)}\n aria-label={`View details for ${row.id}`}\n >\n <ChevronRightIcon />\n </button>\n </span>\n )}\n </div>\n );\n })}\n {totalCount != null && (\n <div className=\"eds-table__footer\" role=\"row\" aria-label=\"Pagination\">\n <span className=\"eds-table__footer-label\" role=\"cell\" aria-live=\"polite\">\n {paginationLabel ?? `Showing ${firstShown}-${lastShown} of ${total}`}\n </span>\n <div className=\"eds-table__pager\">\n <button\n type=\"button\"\n className=\"eds-table__pager-btn\"\n disabled={page <= 1}\n onClick={() => onPageChange?.(page - 1)}\n aria-label=\"Previous page\"\n >\n <ChevronLeftIcon />\n </button>\n <span className=\"eds-table__pager-divider\" aria-hidden />\n <button\n type=\"button\"\n className=\"eds-table__pager-btn\"\n disabled={page >= maxPage}\n onClick={() => onPageChange?.(page + 1)}\n aria-label=\"Next page\"\n >\n <ChevronRightIcon />\n </button>\n </div>\n </div>\n )}\n </div>\n );\n}\n\nexport default Table;\n\n// ===========================================================================\n// TableMatrix — interactive showcase with a tiny clinical-task dataset.\n// ===========================================================================\ntype DemoRow = {\n id: string;\n patient: string;\n patientId: string;\n visit: string;\n visitDate: string;\n status: string;\n statusNote: string;\n assignee: string;\n assigneeRole: string;\n};\n\nconst DEMO_ROWS: DemoRow[] = [\n {\n id: \"row-1\",\n patient: \"Avery Chen\",\n patientId: \"PT-001847\",\n visit: \"Screening visit\",\n visitDate: \"2026-05-12\",\n status: \"In progress\",\n statusNote: \"2 of 4 forms\",\n assignee: \"Jordan Reyes\",\n assigneeRole: \"Coordinator\",\n },\n {\n id: \"row-2\",\n patient: \"Bella Marquez\",\n patientId: \"PT-001848\",\n visit: \"Baseline labs\",\n visitDate: \"2026-05-13\",\n status: \"Complete\",\n statusNote: \"Submitted 5/10\",\n assignee: \"Priya Patel\",\n assigneeRole: \"Nurse\",\n },\n {\n id: \"row-3\",\n patient: \"Carter Ng\",\n patientId: \"PT-001849\",\n visit: \"Week 4 follow-up\",\n visitDate: \"2026-05-14\",\n status: \"Not started\",\n statusNote: \"Due tomorrow\",\n assignee: \"Sam Brooks\",\n assigneeRole: \"Coordinator\",\n },\n {\n id: \"row-4\",\n patient: \"Devi Krishnan\",\n patientId: \"PT-001850\",\n visit: \"Adverse event review\",\n visitDate: \"2026-05-15\",\n status: \"Late\",\n statusNote: \"Overdue 1 day\",\n assignee: \"Jordan Reyes\",\n assigneeRole: \"Coordinator\",\n },\n {\n id: \"row-5\",\n patient: \"Elena Park\",\n patientId: \"PT-001851\",\n visit: \"Medication review\",\n visitDate: \"2026-05-16\",\n status: \"Complete\",\n statusNote: \"Submitted 5/11\",\n assignee: \"Priya Patel\",\n assigneeRole: \"Nurse\",\n },\n {\n id: \"row-6\",\n patient: \"Felix Howard\",\n patientId: \"PT-001852\",\n visit: \"Screening visit\",\n visitDate: \"2026-05-17\",\n status: \"In progress\",\n statusNote: \"1 of 4 forms\",\n assignee: \"Sam Brooks\",\n assigneeRole: \"Coordinator\",\n },\n {\n id: \"row-7\",\n patient: \"Gia Romano\",\n patientId: \"PT-001853\",\n visit: \"Baseline labs\",\n visitDate: \"2026-05-18\",\n status: \"Not started\",\n statusNote: \"Awaiting consent\",\n assignee: \"Priya Patel\",\n assigneeRole: \"Nurse\",\n },\n {\n id: \"row-8\",\n patient: \"Henry Brooks\",\n patientId: \"PT-001854\",\n visit: \"Withdrawal\",\n visitDate: \"2026-05-19\",\n status: \"Complete\",\n statusNote: \"Submitted 5/12\",\n assignee: \"Jordan Reyes\",\n assigneeRole: \"Coordinator\",\n },\n {\n id: \"row-9\",\n patient: \"Iris Lopez\",\n patientId: \"PT-001855\",\n visit: \"Week 8 follow-up\",\n visitDate: \"2026-05-20\",\n status: \"In progress\",\n statusNote: \"3 of 4 forms\",\n assignee: \"Sam Brooks\",\n assigneeRole: \"Coordinator\",\n },\n {\n id: \"row-10\",\n patient: \"Jamie O'Connor\",\n patientId: \"PT-001856\",\n visit: \"Lab review\",\n visitDate: \"2026-05-21\",\n status: \"Late\",\n statusNote: \"Overdue 2 days\",\n assignee: \"Priya Patel\",\n assigneeRole: \"Nurse\",\n },\n];\n\nconst DEMO_COLUMNS: TableColumn<DemoRow>[] = [\n {\n key: \"patient\",\n label: \"Patient\",\n sortable: true,\n render: (row) => row.patient,\n subtext: (row) => row.patientId,\n },\n {\n key: \"visit\",\n label: \"Visit\",\n sortable: true,\n render: (row) => row.visit,\n subtext: (row) => row.visitDate,\n },\n {\n key: \"status\",\n label: \"Status\",\n sortable: true,\n render: (row) => row.status,\n subtext: (row) => row.statusNote,\n },\n {\n key: \"assignee\",\n label: \"Assignee\",\n sortable: true,\n render: (row) => row.assignee,\n subtext: (row) => row.assigneeRole,\n },\n];\n\nexport function TableMatrix() {\n ensureStyles();\n const [size, setSize] = React.useState<TableSize>(\"Desktop\");\n const [page, setPage] = React.useState(1);\n const [selected, setSelected] = React.useState<string[]>([]);\n const [actionLog, setActionLog] = React.useState<string>(\"—\");\n\n const pageSize = 5;\n const total = DEMO_ROWS.length;\n const start = (page - 1) * pageSize;\n const pageRows = DEMO_ROWS.slice(start, start + pageSize);\n\n return (\n <div className=\"eds-table-matrix\">\n <section className=\"eds-table-matrix__section\">\n <h3 className=\"eds-table-matrix__heading\">Interactive table</h3>\n <p className=\"eds-table-matrix__sub\">\n Click a column header to sort (asc → desc → none). Tick the select-all\n checkbox to toggle every visible row. The select-all goes\n indeterminate when only some are selected. Pagination wraps a sample\n dataset of 10 records into pages of 5.\n </p>\n <div className=\"eds-table-matrix__row\">\n {([\"Desktop\", \"Mobile\"] as TableSize[]).map((s) => (\n <button\n key={s}\n type=\"button\"\n className=\"eds-table-matrix__chip\"\n data-active={size === s || undefined}\n onClick={() => setSize(s)}\n >\n {s}\n </button>\n ))}\n </div>\n <Table<DemoRow>\n size={size}\n columns={DEMO_COLUMNS}\n rows={pageRows}\n selectedIds={selected}\n onSelectionChange={setSelected}\n page={page}\n pageSize={pageSize}\n totalCount={total}\n onPageChange={setPage}\n onAction={(row) => setActionLog(`Action · ${row.patient}`)}\n onActionMenu={(row) => setActionLog(`Action menu · ${row.patient}`)}\n onRowNavigate={(row) => setActionLog(`Navigate · ${row.patient}`)}\n />\n <p className=\"eds-table-matrix__readout\">\n Selected: <strong>{selected.length}</strong> · Page <strong>{page}</strong> of{\" \"}\n <strong>{Math.max(1, Math.ceil(total / pageSize))}</strong> · Last action:{\" \"}\n <strong>{actionLog}</strong>\n </p>\n </section>\n\n <section className=\"eds-table-matrix__section\">\n <h3 className=\"eds-table-matrix__heading\">Static · without selection or actions</h3>\n <p className=\"eds-table-matrix__sub\">\n Toggle the booleans off for read-only data displays — no checkbox\n column, no row actions, no chevron, no pagination.\n </p>\n <Table<DemoRow>\n columns={DEMO_COLUMNS}\n rows={DEMO_ROWS.slice(0, 5)}\n selectable={false}\n showActions={false}\n showRowChevron={false}\n />\n </section>\n </div>\n );\n}\n","/**\n * Tag — React port of Embleema Design System 2.0's Feedback/Tag component\n * (Figma node 4935:104).\n *\n * Read-only metadata label for categorization, status, or content tagging.\n * Not interactive beyond optional dismissal. For interactive selection or\n * filtering, use Selector/Chip instead.\n *\n * Structure mirrors the Figma source:\n * pill (rounded-full, horizontal flex, padded)\n * ├── leading icon (optional, 12px for Small / 16px for Medium)\n * ├── label (Nunito Bold, uppercase, tracked — overline/sm or overline/lg)\n * └── close button (optional, 10px for Small / 12px for Medium)\n *\n * Per-type backgrounds come directly from the Figma extraction:\n * - Default → Action/Primary/Background (#306AE8) [semantic]\n * - Success → Feedback/Success/Text (#288028) [semantic]\n * - Warning → Feedback/Warning/Text (#E15A00) [semantic]\n * - Error → Feedback/Error/Text (#B31A1A) [semantic]\n * - Info → Teal/400 (#028388) [primitive — no semantic alias yet]\n * - Brand → Pink/400 (#C20A72) [primitive — no semantic alias yet]\n * Text on all types is Text/Inverse (#FEFEFE).\n *\n * Props:\n * - type : Default | Success | Warning | Info | Error | Brand\n * - size : Small (12px) | Medium (14px)\n * - label : tag text (or use children for richer content)\n * - leadingIcon : boolean → renders the default Status/Info glyph;\n * React node → renders a custom icon at the right size\n * - dismissible : show the close button\n * - onDismiss : called when the close button is clicked\n * - visible : controlled visibility\n * - defaultVisible : uncontrolled initial visibility (default true)\n */\n\nimport * as React from \"react\";\n\nexport type TagType =\n | \"Default\"\n | \"Success\"\n | \"Warning\"\n | \"Info\"\n | \"Error\"\n | \"Brand\";\nexport type TagSize = \"Small\" | \"Medium\";\n\nexport type TagProps = {\n type?: TagType;\n size?: TagSize;\n label?: string;\n children?: React.ReactNode;\n leadingIcon?: boolean | React.ReactNode;\n dismissible?: boolean;\n onDismiss?: () => void;\n visible?: boolean;\n defaultVisible?: boolean;\n id?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — color tokens come directly from the Figma extraction. The two\n// non-semantic primitives (Teal/400 for Info, Pink/400 for Brand) are inlined\n// since the semantic layer doesn't have aliases for them yet.\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@600&display=swap\");\n\n:root {\n --tag-text-inverse: #FEFEFE;\n --tag-action-primary: #306AE8;\n --tag-feedback-success: #288028;\n --tag-feedback-warning: #E15A00;\n --tag-feedback-error: #B31A1A;\n --tag-teal-400: #028388;\n --tag-pink-400: #C20A72;\n}\n\n.eds-tag {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 999px;\n font-family: Nunito, sans-serif;\n font-weight: 600;\n line-height: 1.4;\n color: var(--tag-text-inverse);\n text-transform: uppercase;\n white-space: nowrap;\n user-select: none;\n box-sizing: border-box;\n background: var(--tag-bg, var(--tag-action-primary));\n}\n\n/* Per-type backgrounds */\n.eds-tag[data-type=\"Default\"] { --tag-bg: var(--tag-action-primary); }\n.eds-tag[data-type=\"Success\"] { --tag-bg: var(--tag-feedback-success); }\n.eds-tag[data-type=\"Warning\"] { --tag-bg: var(--tag-feedback-warning); }\n.eds-tag[data-type=\"Error\"] { --tag-bg: var(--tag-feedback-error); }\n.eds-tag[data-type=\"Info\"] { --tag-bg: var(--tag-teal-400); }\n.eds-tag[data-type=\"Brand\"] { --tag-bg: var(--tag-pink-400); }\n\n/* Sizes — Small uses overline/sm (12 / 0.08em), Medium uses overline/lg\n (14 / 0.06em). Gaps differ on purpose: 8 for Small, 6 for Medium, matching\n the Figma source. */\n.eds-tag[data-size=\"Small\"] {\n font-size: 12px;\n letter-spacing: 0.96px; /* 12 * 0.08 */\n padding: 4px 12px;\n gap: 8px;\n}\n.eds-tag[data-size=\"Medium\"] {\n font-size: 14px;\n letter-spacing: 0.84px; /* 14 * 0.06 */\n padding: 4px 16px;\n gap: 6px;\n}\n\n.eds-tag__icon {\n flex-shrink: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--tag-text-inverse);\n}\n.eds-tag__icon svg { display: block; width: 100%; height: 100%; }\n\n.eds-tag[data-size=\"Small\"] .eds-tag__icon { width: 12px; height: 12px; }\n.eds-tag[data-size=\"Medium\"] .eds-tag__icon { width: 16px; height: 16px; }\n\n.eds-tag__close {\n flex-shrink: 0;\n border: 0;\n padding: 0;\n background: transparent;\n color: var(--tag-text-inverse);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 999px;\n transition: background-color 120ms ease-out;\n}\n.eds-tag__close:hover { background: rgba(255, 255, 255, 0.18); }\n.eds-tag__close:focus-visible {\n outline: 2px solid var(--tag-text-inverse);\n outline-offset: 1px;\n}\n.eds-tag[data-size=\"Small\"] .eds-tag__close { width: 10px; height: 10px; }\n.eds-tag[data-size=\"Medium\"] .eds-tag__close { width: 12px; height: 12px; }\n.eds-tag__close svg { display: block; width: 100%; height: 100%; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-tag-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-tag-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-tag-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-tag-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-tag-matrix__row {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 8px;\n}\n.eds-tag-matrix__restore {\n align-self: flex-start;\n padding: 6px 12px;\n background: transparent;\n border: 1px solid #DDDDDD;\n border-radius: 4px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 14px;\n color: #306AE8;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-tag]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-tag\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — paths extracted from the live Figma file via MCP.\n// Close glyph → Icon/Action/Close (node 4052:3034)\n// Default leading icon → Icon/Status/Info (node 4052:3158)\n// ---------------------------------------------------------------------------\nfunction CloseGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n fill=\"currentColor\"\n d=\"M8 9.70342L2.03802 15.6654C1.81496 15.8885 1.53105 16 1.18631 16C0.841572 16 0.557668 15.8885 0.334601 15.6654C0.111534 15.4423 0 15.1584 0 14.8137C0 14.4689 0.111534 14.185 0.334601 13.962L6.29658 8L0.334601 2.03802C0.111534 1.81496 0 1.53105 0 1.18631C0 0.841572 0.111534 0.557668 0.334601 0.334601C0.557668 0.111534 0.841572 0 1.18631 0C1.53105 0 1.81496 0.111534 2.03802 0.334601L8 6.29658L13.962 0.334601C14.185 0.111534 14.4689 0 14.8137 0C15.1584 0 15.4423 0.111534 15.6654 0.334601C15.8885 0.557668 16 0.841572 16 1.18631C16 1.53105 15.8885 1.81496 15.6654 2.03802L9.70342 8L15.6654 13.962C15.8885 14.185 16 14.4689 16 14.8137C16 15.1584 15.8885 15.4423 15.6654 15.6654C15.4423 15.8885 15.1584 16 14.8137 16C14.4689 16 14.185 15.8885 13.962 15.6654L8 9.70342Z\"\n />\n </svg>\n );\n}\n\nfunction InfoGlyph() {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <g transform=\"translate(2 2.2584)\">\n <path\n fill=\"currentColor\"\n d=\"M10.0003 15C10.2241 15 10.4116 14.9243 10.5626 14.7729C10.7139 14.6217 10.7895 14.4342 10.7895 14.2105V9.73684C10.7895 9.51316 10.7138 9.32561 10.5624 9.17421C10.411 9.02298 10.2234 8.94737 9.99974 8.94737C9.77588 8.94737 9.58842 9.02298 9.43737 9.17421C9.28614 9.32561 9.21053 9.51316 9.21053 9.73684V14.2105C9.21053 14.4342 9.28623 14.6217 9.43763 14.7729C9.58904 14.9243 9.77658 15 10.0003 15ZM10 7.14579C10.2409 7.14579 10.4428 7.0643 10.6058 6.90132C10.7688 6.73833 10.8503 6.5364 10.8503 6.29553C10.8503 6.05465 10.7688 5.85272 10.6058 5.68974C10.4428 5.52693 10.2409 5.44553 10 5.44553C9.75912 5.44553 9.55719 5.52693 9.39421 5.68974C9.23123 5.85272 9.14974 6.05465 9.14974 6.29553C9.14974 6.5364 9.23123 6.73833 9.39421 6.90132C9.55719 7.0643 9.75912 7.14579 10 7.14579ZM10.0018 20C8.61868 20 7.3186 19.7375 6.10158 19.2126C4.88456 18.6877 3.82596 17.9754 2.92579 17.0755C2.02561 16.1757 1.31289 15.1175 0.787631 13.9011C0.262544 12.6846 0 11.3848 0 10.0018C0 8.61868 0.262456 7.3186 0.787368 6.10158C1.31228 4.88456 2.02465 3.82596 2.92447 2.92579C3.8243 2.02561 4.88246 1.31289 6.09895 0.787631C7.31544 0.262544 8.61518 0 9.99816 0C11.3813 0 12.6814 0.262456 13.8984 0.787368C15.1154 1.31228 16.174 2.02465 17.0742 2.92447C17.9744 3.8243 18.6871 4.88246 19.2124 6.09895C19.7375 7.31544 20 8.61518 20 9.99816C20 11.3813 19.7375 12.6814 19.2126 13.8984C18.6877 15.1154 17.9754 16.174 17.0755 17.0742C16.1757 17.9744 15.1175 18.6871 13.9011 19.2124C12.6846 19.7375 11.3848 20 10.0018 20ZM10 18.4211C12.3509 18.4211 14.3421 17.6053 15.9737 15.9737C17.6053 14.3421 18.4211 12.3509 18.4211 10C18.4211 7.64912 17.6053 5.65789 15.9737 4.02632C14.3421 2.39474 12.3509 1.57895 10 1.57895C7.64912 1.57895 5.65789 2.39474 4.02632 4.02632C2.39474 5.65789 1.57895 7.64912 1.57895 10C1.57895 12.3509 2.39474 14.3421 4.02632 15.9737C5.65789 17.6053 7.64912 18.4211 10 18.4211Z\"\n />\n </g>\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Tag = React.forwardRef<HTMLSpanElement, TagProps>(\n function Tag(\n {\n type = \"Default\",\n size = \"Small\",\n label,\n children,\n leadingIcon = false,\n dismissible = false,\n onDismiss,\n visible,\n defaultVisible = true,\n id,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = visible !== undefined;\n const [internalVisible, setInternalVisible] = React.useState(defaultVisible);\n const isVisible = isControlled ? !!visible : internalVisible;\n\n if (!isVisible) return null;\n\n const handleDismiss = () => {\n if (!isControlled) setInternalVisible(false);\n onDismiss?.();\n };\n\n const wrapperClass = \"eds-tag\" + (className ? ` ${className}` : \"\");\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-type={type}\n data-size={size}\n role=\"status\"\n aria-label={ariaLabel}\n >\n {leadingIcon && (\n <span className=\"eds-tag__icon\" aria-hidden>\n {typeof leadingIcon === \"boolean\" ? <InfoGlyph /> : leadingIcon}\n </span>\n )}\n <span>{children ?? label ?? \"Tag\"}</span>\n {dismissible && (\n <button\n type=\"button\"\n className=\"eds-tag__close\"\n onClick={handleDismiss}\n aria-label={`Dismiss ${label ?? \"tag\"}`}\n >\n <CloseGlyph />\n </button>\n )}\n </span>\n );\n }\n);\n\nexport default Tag;\n\n// ---------------------------------------------------------------------------\n// TagMatrix — interactive showcase\n// ---------------------------------------------------------------------------\nconst TYPES: TagType[] = [\n \"Default\",\n \"Success\",\n \"Warning\",\n \"Info\",\n \"Error\",\n \"Brand\",\n];\nconst SIZES: TagSize[] = [\"Small\", \"Medium\"];\n\nconst LABEL_BY_TYPE: Record<TagType, string> = {\n Default: \"Default\",\n Success: \"Success\",\n Warning: \"Warning\",\n Info: \"Info\",\n Error: \"Error\",\n Brand: \"Brand\",\n};\n\nexport function TagMatrix() {\n ensureStyles();\n const [resetKey, setResetKey] = React.useState(0);\n\n return (\n <div className=\"eds-tag-matrix\">\n <section className=\"eds-tag-matrix__section\">\n <h3 className=\"eds-tag-matrix__heading\">Type × Size</h3>\n <p className=\"eds-tag-matrix__sub\">\n All six types at both sizes. Backgrounds bind to the same semantic\n tokens used elsewhere in the system (Feedback/*/Text for success/\n warning/error, Action/Primary/Background for default); Info and\n Brand pull primitives directly until semantic aliases exist.\n </p>\n {SIZES.map((size) => (\n <div key={size}>\n <p className=\"eds-tag-matrix__sub\" style={{ marginBottom: 6 }}>\n Size · {size}\n </p>\n <div className=\"eds-tag-matrix__row\">\n {TYPES.map((type) => (\n <Tag key={`${size}-${type}`} type={type} size={size} label={LABEL_BY_TYPE[type]} />\n ))}\n </div>\n </div>\n ))}\n </section>\n\n <section className=\"eds-tag-matrix__section\">\n <h3 className=\"eds-tag-matrix__heading\">LeadingIcon</h3>\n <p className=\"eds-tag-matrix__sub\">\n The default placeholder is Status/Info. Pass any React node via\n <code> leadingIcon</code> to use a custom glyph.\n </p>\n <div className=\"eds-tag-matrix__row\">\n {TYPES.map((type) => (\n <Tag key={type} type={type} size=\"Small\" label={LABEL_BY_TYPE[type]} leadingIcon />\n ))}\n </div>\n <div className=\"eds-tag-matrix__row\">\n {TYPES.map((type) => (\n <Tag key={type} type={type} size=\"Medium\" label={LABEL_BY_TYPE[type]} leadingIcon />\n ))}\n </div>\n </section>\n\n <section className=\"eds-tag-matrix__section\">\n <h3 className=\"eds-tag-matrix__heading\">Dismissible · interactive</h3>\n <p className=\"eds-tag-matrix__sub\">\n Click the close button to remove a tag. Use Restore to bring them\n all back.\n </p>\n <div className=\"eds-tag-matrix__row\" key={resetKey}>\n {TYPES.map((type) => (\n <Tag\n key={type}\n type={type}\n size=\"Small\"\n label={LABEL_BY_TYPE[type]}\n dismissible\n />\n ))}\n </div>\n <div className=\"eds-tag-matrix__row\" key={`m-${resetKey}`}>\n {TYPES.map((type) => (\n <Tag\n key={type}\n type={type}\n size=\"Medium\"\n label={LABEL_BY_TYPE[type]}\n dismissible\n leadingIcon\n />\n ))}\n </div>\n <button\n type=\"button\"\n className=\"eds-tag-matrix__restore\"\n onClick={() => setResetKey((k) => k + 1)}\n >\n Restore all\n </button>\n </section>\n </div>\n );\n}\n","/**\n * TaskStatusIcon — Embleema Design System 2.0 Task Status Icon (Figma\n * node 5142:4723). Compact 20×20 glyph-only indicator used alongside task\n * labels and in tight UI contexts like table cells.\n *\n * Variant families (read from Figma):\n * - Gradient family — colored gradients applied directly to the glyph fill:\n * Incomplete : Red (orange → red → pink, Gradient/Red)\n * InProgress : Pink → blue (Gradient/Pink)\n * InProgressLate : Orange (Gradient/Orange)\n * Complete : Teal (Gradient/Green — Figma name; renders teal)\n * - Gray family — flat #848484 (Neutral/500, text/disabled), no gradient:\n * Skipped, NotApplicable, Upcoming\n *\n * InProgress and InProgressLate share the same clipboard-with-clock glyph\n * (Icon/Files/ClipboardPending); only the gradient differs.\n */\n\nimport * as React from \"react\";\n\nexport type TaskStatusState =\n | \"Incomplete\"\n | \"InProgress\"\n | \"InProgressLate\"\n | \"Complete\"\n | \"Skipped\"\n | \"NotApplicable\"\n | \"Upcoming\";\n\nexport type TaskStatusIconProps = {\n state: TaskStatusState;\n /** Accessible label. Defaults to \"Status: <state>\". */\n \"aria-label\"?: string;\n title?: string;\n className?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n --tsi-gray: #848484;\n}\n\n.eds-tsi {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n font-family: Nunito, sans-serif;\n color: var(--tsi-gray);\n}\n.eds-tsi svg {\n width: 20px;\n height: 20px;\n display: block;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-task-status-icon]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-task-status-icon\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — exact SVGs exported from each Figma variant (node 5142:4723).\n// Path data preserved verbatim so the design-system's rounded-stroke icons\n// render correctly. Gradient variants (Incomplete, InProgress,\n// InProgressLate, Complete) carry their own <defs><linearGradient> blocks\n// with variant-scoped ids. Gray variants (Skipped, NotApplicable, Upcoming)\n// use currentColor and inherit the wrapper's --tsi-gray.\n// ---------------------------------------------------------------------------\nconst FIGMA_GLYPHS: Record<TaskStatusState, string> = {\n Incomplete: `<svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><defs><linearGradient id=\"tsi-incomplete-grad\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"13.3333\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FA6400\"/><stop offset=\"0.565\" stop-color=\"#E02020\"/><stop offset=\"1\" stop-color=\"#FF66AB\"/></linearGradient></defs><g transform=\"translate(3.33 3.55)\"><path d=\"M6.66667 8.08618L1.69835 13.0545C1.51246 13.2404 1.27588 13.3333 0.988593 13.3333C0.70131 13.3333 0.464723 13.2404 0.278834 13.0545C0.0929447 12.8686 0 12.632 0 12.3447C0 12.0575 0.0929447 11.8209 0.278834 11.635L5.24715 6.66666L0.278834 1.69835C0.0929447 1.51246 0 1.27588 0 0.988593C0 0.701309 0.0929447 0.464723 0.278834 0.278834C0.464723 0.0929446 0.70131 0 0.988593 0C1.27588 0 1.51246 0.0929446 1.69835 0.278834L6.66667 5.24715L11.635 0.278834C11.8209 0.0929446 12.0575 0 12.3447 0C12.632 0 12.8686 0.0929446 13.0545 0.278834C13.2404 0.464723 13.3333 0.701309 13.3333 0.988593C13.3333 1.27588 13.2404 1.51246 13.0545 1.69835L8.08618 6.66666L13.0545 11.635C13.2404 11.8209 13.3333 12.0575 13.3333 12.3447C13.3333 12.632 13.2404 12.8686 13.0545 13.0545C12.8686 13.2404 12.632 13.3333 12.3447 13.3333C12.0575 13.3333 11.8209 13.2404 11.635 13.0545L6.66667 8.08618Z\" fill=\"url(#tsi-incomplete-grad)\"/></g></svg>`,\n InProgress: `<svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><defs><linearGradient id=\"tsi-inprogress-grad\" x1=\"0.525725\" y1=\"-4.30895\" x2=\"-1.14361\" y2=\"14.2857\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0.145\" stop-color=\"#FF66AB\"/><stop offset=\"1\" stop-color=\"#6694FA\"/></linearGradient></defs><g transform=\"translate(2.5 1.88)\"><path d=\"M11.5885 16.6667C10.5317 16.6667 9.63274 16.2961 8.89161 15.555C8.15048 14.8139 7.77992 13.9149 7.77992 12.8581C7.77992 11.8012 8.15048 10.9023 8.89161 10.1611C9.63274 9.42002 10.5317 9.04946 11.5885 9.04946C12.6455 9.04946 13.5445 9.42002 14.2854 10.1611C15.0266 10.9023 15.3971 11.8012 15.3971 12.8581C15.3971 13.9149 15.0266 14.8139 14.2854 15.555C13.5445 16.2961 12.6455 16.6667 11.5885 16.6667ZM11.963 12.7034V10.7422C11.963 10.6423 11.9256 10.555 11.8507 10.4802C11.7758 10.4053 11.6884 10.3679 11.5885 10.3679C11.4888 10.3679 11.4015 10.4053 11.3266 10.4802C11.2517 10.555 11.2142 10.6423 11.2142 10.7422V12.692C11.2142 12.7917 11.2327 12.8882 11.2697 12.9816C11.3065 13.075 11.3645 13.1613 11.4438 13.2406L12.7345 14.5313C12.8083 14.6051 12.8948 14.6433 12.9941 14.646C13.0933 14.6487 13.1825 14.6104 13.2618 14.5313C13.3411 14.452 13.3807 14.3642 13.3807 14.2677C13.3807 14.171 13.3411 14.0831 13.2618 14.0038L11.963 12.7034ZM1.53 15.8203C1.10922 15.8203 0.749026 15.6705 0.449416 15.3709C0.149805 15.0713 0 14.7111 0 14.2903V2.96225C0 2.54147 0.149805 2.18127 0.449416 1.88166C0.749026 1.58205 1.10922 1.43225 1.53 1.43225H5.25884C5.37606 1.01993 5.61558 0.678143 5.97739 0.406886C6.33921 0.135628 6.74476 0 7.19403 0C7.66066 0 8.07269 0.135628 8.43014 0.406886C8.78772 0.678143 9.02512 1.01993 9.14235 1.43225H12.8581C13.2788 1.43225 13.639 1.58205 13.9386 1.88166C14.2383 2.18127 14.3881 2.54147 14.3881 2.96225V6.68939C14.3881 6.86924 14.3272 7.02003 14.2055 7.14177C14.0837 7.26336 13.9329 7.32416 13.7531 7.32416C13.5731 7.32416 13.4224 7.26336 13.3009 7.14177C13.1793 7.02003 13.1185 6.86924 13.1185 6.68939V2.96225C13.1185 2.89708 13.0914 2.83741 13.0371 2.78324C12.9829 2.72894 12.9232 2.70178 12.8581 2.70178H11.0026V4.15032C11.0026 4.36713 10.9296 4.54881 10.7836 4.69537C10.6376 4.84194 10.4567 4.91522 10.2409 4.91522H4.14694C3.93111 4.91522 3.75028 4.84194 3.60442 4.69537C3.45843 4.54881 3.38543 4.36713 3.38543 4.15032V2.70178H1.53C1.46483 2.70178 1.40516 2.72894 1.351 2.78324C1.29669 2.83741 1.26954 2.89708 1.26954 2.96225V14.2903C1.26954 14.3663 1.29394 14.4288 1.34275 14.4776C1.39155 14.5264 1.45397 14.5508 1.53 14.5508H5.90016C6.08001 14.5508 6.23074 14.6116 6.35233 14.7334C6.47406 14.8551 6.53493 15.0059 6.53493 15.1858C6.53493 15.3657 6.47406 15.5165 6.35233 15.6379C6.23074 15.7595 6.08001 15.8203 5.90016 15.8203H1.53ZM7.19551 2.79954C7.4126 2.79954 7.59415 2.72604 7.74014 2.57906C7.886 2.43222 7.95893 2.25018 7.95893 2.03295C7.95893 1.81586 7.8855 1.63432 7.73866 1.48832C7.59182 1.34246 7.40978 1.26953 7.19255 1.26953C6.97546 1.26953 6.79392 1.34296 6.64792 1.4898C6.50206 1.63678 6.42914 1.81882 6.42914 2.03591C6.42914 2.253 6.50256 2.43455 6.6494 2.58054C6.79624 2.72654 6.97828 2.79954 7.19551 2.79954Z\" fill=\"url(#tsi-inprogress-grad)\"/></g></svg>`,\n InProgressLate: `<svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><defs><linearGradient id=\"tsi-inprogresslate-grad\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"16.6667\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FCA266\"/><stop offset=\"1\" stop-color=\"#FA6400\"/></linearGradient></defs><g transform=\"translate(2.5 1.88)\"><path d=\"M11.5885 16.6667C10.5317 16.6667 9.63274 16.2961 8.89161 15.555C8.15048 14.8139 7.77992 13.9149 7.77992 12.8581C7.77992 11.8012 8.15048 10.9023 8.89161 10.1611C9.63274 9.42002 10.5317 9.04946 11.5885 9.04946C12.6455 9.04946 13.5445 9.42002 14.2854 10.1611C15.0266 10.9023 15.3971 11.8012 15.3971 12.8581C15.3971 13.9149 15.0266 14.8139 14.2854 15.555C13.5445 16.2961 12.6455 16.6667 11.5885 16.6667ZM11.963 12.7034V10.7422C11.963 10.6423 11.9256 10.555 11.8507 10.4802C11.7758 10.4053 11.6884 10.3679 11.5885 10.3679C11.4888 10.3679 11.4015 10.4053 11.3266 10.4802C11.2517 10.555 11.2142 10.6423 11.2142 10.7422V12.692C11.2142 12.7917 11.2327 12.8882 11.2697 12.9816C11.3065 13.075 11.3645 13.1613 11.4438 13.2406L12.7345 14.5313C12.8083 14.6051 12.8948 14.6433 12.9941 14.646C13.0933 14.6487 13.1825 14.6104 13.2618 14.5313C13.3411 14.452 13.3807 14.3642 13.3807 14.2677C13.3807 14.171 13.3411 14.0831 13.2618 14.0038L11.963 12.7034ZM1.53 15.8203C1.10922 15.8203 0.749026 15.6705 0.449416 15.3709C0.149805 15.0713 0 14.7111 0 14.2903V2.96225C0 2.54147 0.149805 2.18127 0.449416 1.88166C0.749026 1.58205 1.10922 1.43225 1.53 1.43225H5.25884C5.37606 1.01993 5.61558 0.678143 5.97739 0.406886C6.33921 0.135628 6.74476 0 7.19403 0C7.66066 0 8.07269 0.135628 8.43014 0.406886C8.78772 0.678143 9.02512 1.01993 9.14235 1.43225H12.8581C13.2788 1.43225 13.639 1.58205 13.9386 1.88166C14.2383 2.18127 14.3881 2.54147 14.3881 2.96225V6.68939C14.3881 6.86924 14.3272 7.02003 14.2055 7.14177C14.0837 7.26336 13.9329 7.32416 13.7531 7.32416C13.5731 7.32416 13.4224 7.26336 13.3009 7.14177C13.1793 7.02003 13.1185 6.86924 13.1185 6.68939V2.96225C13.1185 2.89708 13.0914 2.83741 13.0371 2.78324C12.9829 2.72894 12.9232 2.70178 12.8581 2.70178H11.0026V4.15032C11.0026 4.36713 10.9296 4.54881 10.7836 4.69537C10.6376 4.84194 10.4567 4.91522 10.2409 4.91522H4.14694C3.93111 4.91522 3.75028 4.84194 3.60442 4.69537C3.45843 4.54881 3.38543 4.36713 3.38543 4.15032V2.70178H1.53C1.46483 2.70178 1.40516 2.72894 1.351 2.78324C1.29669 2.83741 1.26954 2.89708 1.26954 2.96225V14.2903C1.26954 14.3663 1.29394 14.4288 1.34275 14.4776C1.39155 14.5264 1.45397 14.5508 1.53 14.5508H5.90016C6.08001 14.5508 6.23074 14.6116 6.35233 14.7334C6.47406 14.8551 6.53493 15.0059 6.53493 15.1858C6.53493 15.3657 6.47406 15.5165 6.35233 15.6379C6.23074 15.7595 6.08001 15.8203 5.90016 15.8203H1.53ZM7.19551 2.79954C7.4126 2.79954 7.59415 2.72604 7.74014 2.57906C7.886 2.43222 7.95893 2.25018 7.95893 2.03295C7.95893 1.81586 7.8855 1.63432 7.73866 1.48832C7.59182 1.34246 7.40978 1.26953 7.19255 1.26953C6.97546 1.26953 6.79392 1.34296 6.64792 1.4898C6.50206 1.63678 6.42914 1.81882 6.42914 2.03591C6.42914 2.253 6.50256 2.43455 6.6494 2.58054C6.79624 2.72654 6.97828 2.79954 7.19551 2.79954Z\" fill=\"url(#tsi-inprogresslate-grad)\"/></g></svg>`,\n Complete: `<svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><defs><linearGradient id=\"tsi-complete-grad\" x1=\"11.16\" y1=\"13.262\" x2=\"11.16\" y2=\"0\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#0A595C\"/><stop offset=\"0.6\" stop-color=\"#028388\"/><stop offset=\"0.9999\" stop-color=\"#00AFB2\"/></linearGradient></defs><g transform=\"translate(1.67 4.17)\"><path d=\"M5.60407 9.88288L15.2327 0.254239C15.3984 0.0883465 15.5924 0.00363552 15.8145 0.000105889C16.0367 -0.00342374 16.2343 0.0812872 16.4072 0.254239C16.5802 0.427191 16.6667 0.625779 16.6667 0.850003C16.6667 1.07441 16.5802 1.27309 16.4072 1.44604L6.30935 11.5612C6.10779 11.7626 5.87269 11.8633 5.60407 11.8633C5.33545 11.8633 5.10036 11.7626 4.8988 11.5612L0.245261 6.90768C0.079554 6.74179 -0.00218485 6.54487 4.43874e-05 6.31693C0.00208786 6.08918 0.0895854 5.88882 0.262537 5.71587C0.435489 5.54292 0.634077 5.45645 0.858301 5.45645C1.08271 5.45645 1.28139 5.54292 1.45434 5.71587L5.60407 9.88288Z\" fill=\"url(#tsi-complete-grad)\"/></g></svg>`,\n Skipped: `<svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(1.67 2.5)\"><path d=\"M8.21975 15C7.3495 15 6.60942 14.6988 5.99958 14.0963C5.3895 13.4939 5.0845 12.7623 5.0845 11.9017C5.0845 11.0409 5.38908 10.3089 5.99817 9.70568C6.60725 9.10227 7.34683 8.8006 8.21692 8.8006C9.08717 8.8006 9.82725 9.10185 10.4371 9.70427C11.0472 10.3068 11.3522 11.0383 11.3522 11.8989C11.3522 12.7597 11.0477 13.4917 10.4386 14.0948C9.82942 14.6983 9.08983 15 8.21975 15ZM14.2867 5.41912C13.7081 4.3252 12.8848 3.44113 11.8169 2.7669C10.7489 2.09286 9.54942 1.75583 8.21833 1.75583C6.75833 1.75583 5.45008 2.16809 4.29362 2.99262C3.13694 3.81713 2.31207 4.87601 1.81902 6.16927C1.73336 6.41702 1.60135 6.63577 1.42301 6.82552C1.24447 7.0151 1.03099 7.10985 0.782558 7.10985C0.519699 7.10985 0.311149 7.00618 0.156933 6.79877C0.0027078 6.59135 -0.0378425 6.36768 0.0352741 6.12785C0.552457 4.36343 1.55511 2.91192 3.04322 1.77331C4.53113 0.6345 6.24667 0.0650916 8.18983 0.0650916C9.591 0.0650916 10.8766 0.371117 12.0467 0.983167C13.2172 1.59522 14.1873 2.41278 14.9572 3.43587V0.845366C14.9572 0.60585 15.0392 0.405117 15.2032 0.243183C15.3671 0.0810584 15.5701 0 15.8123 0C16.0546 0 16.2576 0.0810584 16.4211 0.243183C16.5848 0.405117 16.6667 0.60585 16.6667 0.845366V6.09118C16.6667 6.37977 16.5679 6.62168 16.3703 6.8171C16.173 7.01227 15.9284 7.10985 15.6365 7.10985H10.3332C10.091 7.10985 9.888 7.02877 9.72433 6.86668C9.56042 6.70452 9.47842 6.50377 9.47842 6.26418C9.47842 6.02452 9.56042 5.82377 9.72433 5.66202C9.888 5.50008 10.091 5.41912 10.3332 5.41912H14.2867Z\" fill=\"currentColor\"/></g></svg>`,\n NotApplicable: `<svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(1.67 1.67)\"><path d=\"M8.33483 16.6667C7.18225 16.6667 6.09883 16.4479 5.08465 16.0105C4.07047 15.5731 3.1883 14.9795 2.43816 14.2296C1.68801 13.4798 1.09408 12.5979 0.656358 11.5842C0.218783 10.5705 0 9.48733 0 8.33483C0 7.18225 0.218717 6.09883 0.656142 5.08465C1.09357 4.07047 1.68721 3.1883 2.43706 2.43816C3.18692 1.68801 4.06872 1.09408 5.08246 0.656358C6.0962 0.218783 7.17933 0 8.33183 0C9.48442 0 10.5678 0.218717 11.582 0.656142C12.5962 1.09357 13.4783 1.68721 14.2285 2.43706C14.9787 3.18692 15.5726 4.06872 16.0103 5.08246C16.4479 6.0962 16.6667 7.17933 16.6667 8.33183C16.6667 9.48442 16.4479 10.5678 16.0105 11.582C15.5731 12.5962 14.9795 13.4783 14.2296 14.2285C13.4798 14.9787 12.5979 15.5726 11.5842 16.0103C10.5705 16.4479 9.48733 16.6667 8.33483 16.6667ZM8.33333 15.3509C9.15625 15.3509 9.94883 15.2117 10.711 14.9333C11.4729 14.655 12.1693 14.2521 12.8002 13.7247L2.94188 3.86645C2.4201 4.49729 2.01864 5.19372 1.7375 5.9557C1.45636 6.71783 1.31579 7.51042 1.31579 8.33333C1.31579 10.2924 1.99562 11.9517 3.35527 13.3114C4.71491 14.6711 6.37427 15.3509 8.33333 15.3509ZM13.7247 12.8002C14.2521 12.1693 14.655 11.4729 14.9333 10.711C15.2117 9.94883 15.3509 9.15625 15.3509 8.33333C15.3509 6.37427 14.6711 4.71491 13.3114 3.35527C11.9517 1.99562 10.2924 1.31579 8.33333 1.31579C7.50833 1.31579 6.71392 1.45358 5.95 1.72917C5.18626 2.00461 4.49174 2.40884 3.86645 2.94188L13.7247 12.8002Z\" fill=\"currentColor\"/></g></svg>`,\n Upcoming: `<svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden><g transform=\"translate(2 0.26)\"><path d=\"M15.4035 17.3337H12.8306C12.6426 17.3337 12.4853 17.2686 12.3586 17.1383C12.2317 17.0082 12.1682 16.8466 12.1682 16.6536C12.1682 16.4606 12.2317 16.299 12.3586 16.1689C12.4853 16.0386 12.6426 15.9735 12.8306 15.9735H15.4035C15.4715 15.9735 15.5338 15.9444 15.5903 15.8862C15.647 15.8282 15.6753 15.7643 15.6753 15.6944V7.18458H3.31169V10.0793C3.31169 10.2723 3.24825 10.4339 3.12138 10.5642C2.99465 10.6943 2.83731 10.7594 2.64935 10.7594C2.46139 10.7594 2.30405 10.6943 2.17732 10.5642C2.05045 10.4339 1.98701 10.2723 1.98701 10.0793V3.55738C1.98701 3.09929 2.14156 2.71156 2.45065 2.39418C2.75974 2.0768 3.13735 1.91811 3.58347 1.91811H4.80614V0.69733C4.80614 0.49859 4.87098 0.332645 5.00065 0.199496C5.13032 0.066499 5.29193 0 5.48548 0C5.67918 0 5.84079 0.066499 5.97031 0.199496C6.09998 0.332645 6.16482 0.49859 6.16482 0.69733V1.91811H12.8562V0.680101C12.8562 0.487103 12.9196 0.325466 13.0463 0.195189C13.1732 0.065063 13.3306 0 13.5185 0C13.7065 0 13.8638 0.065063 13.9906 0.195189C14.1174 0.325466 14.1809 0.487103 14.1809 0.680101V1.91811H15.4035C15.8497 1.91811 16.2273 2.0768 16.5364 2.39418C16.8455 2.71156 17 3.09929 17 3.55738V15.6944C17 16.1525 16.8455 16.5402 16.5364 16.8576C16.2273 17.175 15.8497 17.3337 15.4035 17.3337ZM7.52526 15.7468H0.66234C0.47438 15.7468 0.31704 15.6817 0.19031 15.5514C0.06344 15.4213 0 15.2597 0 15.0667C0 14.8737 0.06344 14.7121 0.19031 14.582C0.31704 14.4517 0.47438 14.3866 0.66234 14.3866H7.52526L5.49564 12.2713C5.37347 12.1457 5.31011 11.9917 5.30555 11.8092C5.30098 11.6267 5.36435 11.468 5.49564 11.3332C5.61795 11.2076 5.77168 11.1448 5.95684 11.1448C6.14186 11.1448 6.29552 11.2076 6.41783 11.3332L9.5037 14.4929C9.6634 14.6569 9.7432 14.8482 9.7432 15.0667C9.7432 15.2852 9.6634 15.4765 9.5037 15.6405L6.41783 18.8091C6.29552 18.9345 6.14414 18.9981 5.96369 18.9999C5.78309 19.0016 5.62707 18.935 5.49564 18.8002C5.37347 18.6746 5.31239 18.5183 5.31239 18.3312C5.31239 18.1441 5.37347 17.9877 5.49564 17.8621L7.52526 15.7468ZM3.31169 5.82438H15.6753V3.55738C15.6753 3.48755 15.647 3.42362 15.5903 3.36559C15.5338 3.3074 15.4715 3.27831 15.4035 3.27831H3.58347C3.51547 3.27831 3.45321 3.3074 3.39669 3.36559C3.34002 3.42362 3.31169 3.48755 3.31169 3.55738V5.82438Z\" fill=\"currentColor\"/></g></svg>`,\n};\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const TaskStatusIcon = React.forwardRef<HTMLSpanElement, TaskStatusIconProps>(\n function TaskStatusIcon(\n { state, \"aria-label\": ariaLabel, title, className },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-tsi\" + (className ? ` ${className}` : \"\");\n const label = ariaLabel ?? `Status: ${state}`;\n return (\n <span\n ref={ref}\n role=\"img\"\n className={wrapperClass}\n aria-label={label}\n title={title ?? label}\n data-state={state}\n dangerouslySetInnerHTML={{ __html: FIGMA_GLYPHS[state] }}\n />\n );\n }\n);\n\nexport default TaskStatusIcon;\n\n// ---------------------------------------------------------------------------\n// TaskStatusIconMatrix — showcase all 7 states.\n// ---------------------------------------------------------------------------\nexport function TaskStatusIconMatrix() {\n ensureStyles();\n const states: TaskStatusState[] = [\n \"Incomplete\", \"InProgress\", \"InProgressLate\", \"Complete\",\n \"Skipped\", \"NotApplicable\", \"Upcoming\",\n ];\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\" }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: \"0 0 24px\" }}>\n All states\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fill, minmax(160px, 1fr))\", gap: 24 }}>\n {states.map((s) => (\n <div key={s} style={{ display: \"flex\", alignItems: \"center\", gap: 12 }}>\n <TaskStatusIcon state={s} />\n <span style={{ fontSize: 14, color: \"#0E0E0E\" }}>{s}</span>\n </div>\n ))}\n </div>\n </div>\n );\n}\n","/**\n * TaskStatus — React port of Embleema Design System 2.0's Task Status\n * component (Figma node 5142:4683). Pairs a 20px TaskStatusIcon glyph with\n * a Nunito Light status label, optionally followed by an AI sparkle badge\n * when AI=true.\n *\n * Layout (per Figma):\n * wrapper (flex, items-center, gap 4, height 24)\n * ├── icon slot (20 × 20)\n * └── Status + AI (flex, items-center, gap 4)\n * ├── label (Body Medium/Light: Nunito 300, 16/24, Text/Primary)\n * └── AI badge (Icon/Status/ArtificialIntelligence, visible when AI=true)\n *\n * Status → glyph mapping. TaskStatusIcon doesn't ship an explicit\n * \"IncompleteLate\" variant because the Figma source reuses the Incomplete\n * X glyph for both Incomplete and Incomplete Late (only the label differs).\n *\n * AI marker: Icon/Status/ArtificialIntelligence (Figma node 4052:2950)\n * inlined as a 16-px tall sparkle that picks up the surrounding text color.\n */\n\nimport * as React from \"react\";\nimport { TaskStatusIcon } from \"./TaskStatusIcon\";\nimport type { TaskStatusState as TaskStatusIconState } from \"./TaskStatusIcon\";\n\nexport type TaskStatusValue =\n | \"Complete\"\n | \"InProgress\"\n | \"InProgressLate\"\n | \"Incomplete\"\n | \"IncompleteLate\"\n | \"Skipped\"\n | \"NotApplicable\"\n | \"Upcoming\";\n\nexport type TaskStatusProps = {\n status: TaskStatusValue;\n /** When true, render the AI sparkle badge after the label. */\n ai?: boolean;\n /** Override the default human-readable label. */\n label?: string;\n className?: string;\n id?: string;\n \"aria-label\"?: string;\n};\n\nconst LABEL_BY_STATUS: Record<TaskStatusValue, string> = {\n Complete: \"Complete\",\n InProgress: \"In Progress\",\n InProgressLate: \"In Progress Late\",\n Incomplete: \"Incomplete\",\n IncompleteLate: \"Incomplete Late\",\n Skipped: \"Skipped\",\n NotApplicable: \"Not Applicable\",\n Upcoming: \"Upcoming\",\n};\n\n// Map our 8 statuses onto TaskStatusIcon's 7 glyphs — Incomplete and\n// IncompleteLate share the same red X per Figma.\nconst ICON_BY_STATUS: Record<TaskStatusValue, TaskStatusIconState> = {\n Complete: \"Complete\",\n InProgress: \"InProgress\",\n InProgressLate: \"InProgressLate\",\n Incomplete: \"Incomplete\",\n IncompleteLate: \"Incomplete\",\n Skipped: \"Skipped\",\n NotApplicable: \"NotApplicable\",\n Upcoming: \"Upcoming\",\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --ts-text-primary: #0E0E0E;\n}\n\n.eds-ts {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n height: 24px;\n font-family: Nunito, sans-serif;\n color: var(--ts-text-primary);\n}\n\n.eds-ts__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n}\n\n.eds-ts__status {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n min-width: 0;\n}\n\n.eds-ts__label {\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 24px;\n color: var(--ts-text-primary);\n white-space: nowrap;\n margin: 0;\n}\n\n.eds-ts__ai {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.eds-ts__ai svg { display: block; width: 100%; height: 100%; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-task-status]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-task-status\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// Icon/Status/ArtificialIntelligence (Figma node 4052:2950). Path data\n// preserved verbatim from the Figma export; fill bound to the system's\n// Gradient/AI (AI/Light #90B3FF → AI/Base #6F59CF, top → bottom, matching\n// the Field component's vertical AI gradient stops). The gradient id is\n// uniquified with React.useId so multiple sparkles on the same page don't\n// step on each other's <defs>.\nfunction AISparkleIcon() {\n const reactId = React.useId().replace(/:/g, \"\");\n const gradientId = `eds-ts-ai-grad-${reactId}`;\n const fill = `url(#${gradientId})`;\n return (\n <svg\n viewBox=\"0 0 15.2557 23\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n preserveAspectRatio=\"xMidYMid meet\"\n aria-hidden\n >\n <defs>\n <linearGradient id={gradientId} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop offset=\"0%\" stopColor=\"#90B3FF\" />\n <stop offset=\"79%\" stopColor=\"#6F59CF\" />\n </linearGradient>\n </defs>\n <path\n fill={fill}\n d=\"M5.85325 5.88724L6.37928 7.34896C6.9643 8.97127 8.24172 10.2486 9.86399 10.8337L11.3257 11.3597C11.4576 11.4072 11.4576 11.594 11.3257 11.6416L9.86399 12.1676C8.24168 12.7526 6.96432 14.03 6.37928 15.6523L5.85325 17.114C5.80573 17.2459 5.61892 17.2459 5.5714 17.114L5.04537 15.6523C4.46035 14.03 3.18293 12.7526 1.56066 12.1676L0.0989369 11.6416C-0.032979 11.594 -0.032979 11.4072 0.0989369 11.3597L1.56066 10.8337C3.18296 10.2487 4.46033 8.97123 5.04537 7.34896L5.5714 5.88724C5.61892 5.7545 5.80573 5.7545 5.85325 5.88724Z\"\n />\n <path\n fill={fill}\n d=\"M12.4335 0.0510043L12.7006 0.790876C12.9972 1.61187 13.6436 2.25915 14.4655 2.55578L15.2053 2.82288C15.2725 2.84746 15.2725 2.94169 15.2053 2.96545L14.4655 3.23255C13.6445 3.52916 12.9972 4.17562 12.7006 4.99746L12.4335 5.73733C12.4089 5.80452 12.3147 5.80452 12.2909 5.73733L12.0238 4.99746C11.7272 4.17646 11.0807 3.52918 10.2589 3.23255L9.51901 2.96545C9.45183 2.94087 9.45183 2.84664 9.51901 2.82288L10.2589 2.55578C11.0799 2.25917 11.7272 1.61271 12.0238 0.790876L12.2909 0.0510043C12.3147 -0.0170014 12.4097 -0.0170014 12.4335 0.0510043Z\"\n />\n <path\n fill={fill}\n d=\"M12.4335 17.2633L12.7006 18.0032C12.9972 18.8242 13.6436 19.4714 14.4655 19.7681L15.2053 20.0352C15.2725 20.0597 15.2725 20.154 15.2053 20.1777L14.4655 20.4448C13.6445 20.7414 12.9972 21.3879 12.7006 22.2097L12.4335 22.9496C12.4089 23.0168 12.3147 23.0168 12.2909 22.9496L12.0238 22.2097C11.7272 21.3887 11.0807 20.7415 10.2589 20.4448L9.51901 20.1777C9.45183 20.1532 9.45183 20.0589 9.51901 20.0352L10.2589 19.7681C11.0799 19.4715 11.7272 18.825 12.0238 18.0032L12.2909 17.2633C12.3147 17.1961 12.4097 17.1961 12.4335 17.2633Z\"\n />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const TaskStatus = React.forwardRef<HTMLSpanElement, TaskStatusProps>(\n function TaskStatus(\n { status, ai = false, label, className, id, \"aria-label\": ariaLabel },\n ref\n ) {\n ensureStyles();\n\n const labelText = label ?? LABEL_BY_STATUS[status];\n const iconState = ICON_BY_STATUS[status];\n const wrapperClass = \"eds-ts\" + (className ? ` ${className}` : \"\");\n const a11y =\n ariaLabel ?? `Task status: ${labelText}${ai ? \" (AI-processed)\" : \"\"}`;\n\n return (\n <span\n ref={ref}\n id={id}\n className={wrapperClass}\n data-status={status}\n data-ai={ai || undefined}\n role=\"status\"\n aria-label={a11y}\n >\n <span className=\"eds-ts__icon\" aria-hidden>\n <TaskStatusIcon state={iconState} aria-label={labelText} />\n </span>\n <span className=\"eds-ts__status\">\n <p className=\"eds-ts__label\">{labelText}</p>\n {ai && (\n <span className=\"eds-ts__ai\" aria-hidden>\n <AISparkleIcon />\n </span>\n )}\n </span>\n </span>\n );\n }\n);\n\nexport default TaskStatus;\n\n// ---------------------------------------------------------------------------\n// TaskStatusMatrix — every status, with and without AI.\n// ---------------------------------------------------------------------------\nconst STATUSES: TaskStatusValue[] = [\n \"Complete\",\n \"InProgress\",\n \"InProgressLate\",\n \"Incomplete\",\n \"IncompleteLate\",\n \"Skipped\",\n \"NotApplicable\",\n \"Upcoming\",\n];\n\nexport function TaskStatusMatrix() {\n ensureStyles();\n return (\n <div\n style={{\n fontFamily: \"Nunito, sans-serif\",\n padding: 32,\n background: \"#FEFEFE\",\n display: \"flex\",\n flexDirection: \"column\",\n gap: 40,\n }}\n >\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p\n style={{\n fontSize: 14,\n fontWeight: 600,\n letterSpacing: \"0.08em\",\n textTransform: \"uppercase\",\n color: \"#5E5E5E\",\n margin: 0,\n }}\n >\n All statuses\n </p>\n <div\n style={{\n display: \"grid\",\n gridTemplateColumns: \"max-content max-content\",\n columnGap: 48,\n rowGap: 12,\n alignItems: \"center\",\n }}\n >\n <span\n style={{\n fontSize: 11,\n fontWeight: 600,\n letterSpacing: \"0.04em\",\n textTransform: \"uppercase\",\n color: \"#5E5E5E\",\n }}\n >\n AI = false\n </span>\n <span\n style={{\n fontSize: 11,\n fontWeight: 600,\n letterSpacing: \"0.04em\",\n textTransform: \"uppercase\",\n color: \"#5E5E5E\",\n }}\n >\n AI = true\n </span>\n {STATUSES.map((s) => (\n <React.Fragment key={s}>\n <TaskStatus status={s} />\n <TaskStatus status={s} ai />\n </React.Fragment>\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * TimePicker — React port of the Embleema Design System 2.0 Input/TimePicker\n * component (Figma node 4341:901). A molecule that wraps the base Field atom\n * with a clock icon, an AM/PM segmented toggle (Figma node 4355:225), and\n * the Time Picker Overlay (Figma node 4357:300) — a two-column scrolling\n * Hour / Minute picker (using the Time Option atom, Figma node 4356:193).\n *\n * The overlay, toggle, and time-option chrome are all embedded as private\n * sub-components — they only ship as part of TimePicker, not as standalone\n * catalog entries.\n *\n * Behavior:\n * - Clicking the field (or the clock icon) opens the overlay anchored\n * below the field\n * - Scrolling/clicking an hour or minute updates the draft selection\n * - Cancel closes without writing; OK commits and closes\n * - Toggling AM/PM updates the field's PM half directly\n * - Outside click / Escape closes the overlay\n */\n\nimport * as React from \"react\";\nimport { Field } from \"./Field\";\nimport type { FieldValidation, FieldAppearance } from \"./Field\";\n\nexport type TimePickerValidation = FieldValidation;\nexport type TimePickerStyle = FieldAppearance;\nexport type TimePickerLabelPosition = \"Top\" | \"Left\";\nexport type TimePickerMeridiem = \"AM\" | \"PM\";\n\nexport type TimePickerProps = {\n validation?: TimePickerValidation;\n style?: TimePickerStyle;\n labelPosition?: TimePickerLabelPosition;\n label?: boolean | string;\n helperText?: boolean | string;\n required?: boolean;\n /** Controlled time string formatted \"HH:MM AM/PM\". */\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n id?: string;\n name?: string;\n disabled?: boolean;\n readOnly?: boolean;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Time\";\nconst DEFAULT_HELPER = {\n None: \"Helper text\",\n AI: \"Helper text\",\n Error: \"Error message\",\n Warning: \"Warning message\",\n Success: \"Success message\",\n} as const;\nconst LEFT_LABEL_WIDTH = 120;\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap\");\n\n:root {\n --tp-text-primary: #0E0E0E;\n --tp-text-tertiary: #848484;\n --tp-text-error: #E02020;\n --tp-feedback-error-text: #B31A1A;\n --tp-action-link-default: #306AE8;\n --tp-action-primary-background: #306AE8;\n --tp-bg-default: #FEFEFE;\n --tp-bg-selected: #E3ECFF;\n --tp-bg-primary: #F8F8F8;\n --tp-border-default: #DDDDDD;\n --tp-border-subtle: #F1F1F1;\n}\n\n.eds-tp {\n display: flex;\n position: relative;\n font-family: Nunito, sans-serif;\n}\n.eds-tp[data-label-position=\"Top\"] {\n flex-direction: column;\n align-items: stretch;\n gap: 4px;\n width: 100%;\n}\n.eds-tp[data-label-position=\"Left\"] {\n flex-direction: row;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n}\n\n.eds-tp__label-slot[data-label-position=\"Left\"] {\n width: ${LEFT_LABEL_WIDTH}px;\n flex-shrink: 0;\n padding-top: 12px;\n}\n.eds-tp__label-text {\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--tp-text-primary);\n margin: 0;\n display: inline-flex;\n align-items: baseline;\n gap: 2px;\n}\n.eds-tp[data-validation=\"Error\"] .eds-tp__label-text {\n color: var(--tp-text-error);\n}\n.eds-tp__required { color: var(--tp-feedback-error-text); }\n\n.eds-tp__content {\n display: flex;\n flex-direction: column;\n gap: 4px;\n min-width: 0;\n flex: 1 1 auto;\n position: relative;\n}\n\n/* FieldRow lays the Field + AM/PM toggle side by side. */\n.eds-tp__field-row {\n display: flex;\n align-items: center;\n gap: 16px;\n width: 100%;\n position: relative;\n}\n.eds-tp__field-row > .eds-field-wrap {\n flex: 1 1 0;\n min-width: 0;\n}\n\n/* AM/PM toggle (Figma node 4355:225) */\n.eds-tp__ampm {\n display: inline-flex;\n align-items: stretch;\n height: 48px;\n flex-shrink: 0;\n background: var(--tp-bg-default);\n border: 1px solid var(--tp-border-default);\n border-radius: 4px;\n overflow: hidden;\n}\n.eds-tp__ampm-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 50px;\n height: 100%;\n padding: 0 12px;\n border: 0;\n background: transparent;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 16px;\n line-height: 1.2;\n color: var(--tp-text-primary);\n transition: background 100ms, color 100ms;\n}\n.eds-tp__ampm-btn:hover:not(:disabled) { background: var(--tp-bg-primary); }\n.eds-tp__ampm-btn:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: -2px;\n}\n.eds-tp__ampm-btn[data-selected=\"true\"] {\n background: var(--tp-bg-selected);\n color: var(--tp-action-primary-background);\n}\n.eds-tp__ampm-btn:disabled { cursor: not-allowed; opacity: 0.5; }\n.eds-tp__ampm-divider {\n width: 1px;\n background: var(--tp-border-default);\n}\n\n/* Clock trailing icon button */\n.eds-tp__clock {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n padding: 0;\n border: 0;\n background: transparent;\n color: var(--tp-text-primary);\n cursor: pointer;\n border-radius: 4px;\n transition: color 120ms;\n}\n.eds-tp__clock:hover:not(:disabled) { color: var(--tp-action-link-default); }\n.eds-tp__clock[aria-expanded=\"true\"] { color: var(--tp-action-link-default); }\n.eds-tp__clock:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n.eds-tp__clock:disabled { cursor: not-allowed; opacity: 0.5; }\n.eds-tp__clock svg { width: 100%; height: 100%; display: block; }\n\n/* Helper text */\n.eds-tp__helper {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 1.4;\n letter-spacing: 0.01em;\n color: var(--tp-text-primary);\n}\n.eds-tp[data-validation=\"Error\"] .eds-tp__helper {\n color: var(--tp-feedback-error-text);\n}\n.eds-tp__helper-icon {\n display: inline-flex;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.eds-tp__helper-icon svg { width: 100%; height: 100%; display: block; }\n\n/* ---------- Overlay (Figma node 4357:300) ---------- */\n.eds-tp__overlay {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n z-index: 30;\n width: 200px;\n background: var(--tp-bg-default);\n border-radius: 12px;\n box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.12);\n display: flex;\n flex-direction: column;\n overflow: hidden;\n font-family: Nunito, sans-serif;\n}\n.eds-tp__overlay-cols {\n display: flex;\n height: 320px;\n overflow: hidden;\n width: 100%;\n}\n.eds-tp__overlay-col {\n flex: 1 1 0;\n height: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n}\n.eds-tp__overlay-col::-webkit-scrollbar { width: 6px; }\n.eds-tp__overlay-col::-webkit-scrollbar-thumb {\n background: var(--tp-text-tertiary);\n border-radius: 3px;\n}\n.eds-tp__overlay-col::-webkit-scrollbar-track { background: transparent; }\n\n/* Time option (Figma node 4356:193) */\n.eds-tp__option {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 44px;\n width: 100%;\n padding: 0;\n border: 0;\n background: transparent;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--tp-text-primary);\n transition: background 100ms;\n}\n.eds-tp__option:hover { background: var(--tp-bg-primary); }\n.eds-tp__option:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: -2px;\n}\n.eds-tp__option[data-selected=\"true\"] {\n background: var(--tp-bg-selected);\n font-weight: 600;\n}\n\n.eds-tp__overlay-divider {\n height: 1px;\n width: 100%;\n background: var(--tp-border-subtle);\n}\n.eds-tp__overlay-actions {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 20px;\n width: 100%;\n box-sizing: border-box;\n}\n.eds-tp__overlay-btn {\n background: transparent;\n border: 0;\n padding: 0;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 16px;\n line-height: 1.2;\n color: var(--tp-action-link-default);\n}\n.eds-tp__overlay-btn:hover { text-decoration: underline; }\n.eds-tp__overlay-btn:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-timepicker]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-timepicker\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Icons\n// ---------------------------------------------------------------------------\nfunction ClockIcon() {\n return (\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M10 18.083c-1.117 0-2.165-.212-3.146-.636a8.143 8.143 0 01-2.562-1.74 8.156 8.156 0 01-1.74-2.561A7.94 7.94 0 011.917 10c0-1.117.212-2.165.635-3.146a8.156 8.156 0 011.74-2.562 8.143 8.143 0 012.562-1.74A7.94 7.94 0 0110 1.917c1.117 0 2.165.212 3.146.635a8.156 8.156 0 012.562 1.74 8.156 8.156 0 011.74 2.562A7.94 7.94 0 0118.083 10c0 1.117-.212 2.166-.635 3.146a8.156 8.156 0 01-1.74 2.562 8.156 8.156 0 01-2.562 1.74A7.94 7.94 0 0110 18.083zM10 16.5c1.806 0 3.34-.632 4.604-1.896C15.868 13.34 16.5 11.806 16.5 10c0-1.806-.632-3.34-1.896-4.604C13.34 4.132 11.806 3.5 10 3.5c-1.806 0-3.34.632-4.604 1.896C4.132 6.66 3.5 8.194 3.5 10c0 1.806.632 3.34 1.896 4.604C6.66 15.868 8.194 16.5 10 16.5zm2.71-3.16l.63-.63L10.625 10V6.25h-.917v4.125l3.002 2.965z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nfunction WarningGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M1.333 14L8 2.667 14.667 14H1.333zM8 12.667a.5.5 0 100-1 .5.5 0 000 1zm-.5-2h1V7h-1v3.667z\" fill=\"#FA6400\" />\n </svg>\n );\n}\nfunction ErrorGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M1.333 14L8 2.667 14.667 14H1.333zM8 12.667a.5.5 0 100-1 .5.5 0 000 1zm-.5-2h1V7h-1v3.667z\" fill=\"#B31A1A\" />\n </svg>\n );\n}\nfunction SuccessGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M6.55 11.467l-3-3 .933-.934 2.067 2.067 4.866-4.867.934.934-5.8 5.8z\" fill=\"#288028\" />\n </svg>\n );\n}\nfunction getHelperGlyph(v: TimePickerValidation): React.ReactNode {\n switch (v) {\n case \"Error\": return <ErrorGlyph />;\n case \"Warning\": return <WarningGlyph />;\n case \"Success\": return <SuccessGlyph />;\n default: return null;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Parse / format helpers. Canonical value is \"HH:MM AM/PM\" (12-hour).\n// ---------------------------------------------------------------------------\ntype ParsedTime = { hour12: number; minute: number; meridiem: TimePickerMeridiem };\n\nfunction parseTime(s: string): ParsedTime | null {\n const m = /^\\s*(\\d{1,2}):(\\d{2})(?:\\s*(AM|PM))?\\s*$/i.exec(s);\n if (!m) return null;\n const h = parseInt(m[1], 10);\n const min = parseInt(m[2], 10);\n if (min < 0 || min > 59) return null;\n if (h < 1 || h > 12) return null;\n const mer = (m[3]?.toUpperCase() as TimePickerMeridiem) ?? \"AM\";\n return { hour12: h, minute: min, meridiem: mer };\n}\nfunction formatField(p: ParsedTime | null): string {\n if (!p) return \"\";\n const hh = String(p.hour12).padStart(2, \"0\");\n const mm = String(p.minute).padStart(2, \"0\");\n return `${hh}:${mm} ${p.meridiem}`;\n}\nfunction fieldDisplay(s: string): string {\n // What's actually shown inside the Field input — just HH:MM (toggle owns AM/PM).\n const p = parseTime(s);\n if (!p) return \"\";\n return `${String(p.hour12).padStart(2, \"0\")}:${String(p.minute).padStart(2, \"0\")}`;\n}\n\nconst HOURS = Array.from({ length: 12 }, (_, i) => i + 1); // 1..12\nconst MINUTES = Array.from({ length: 60 }, (_, i) => i); // 0..59\n\n// ---------------------------------------------------------------------------\n// Overlay — private sub-component embedding the AM/PM toggle's selection\n// logic separately (the toggle is the row-level toggle, not in the overlay).\n// ---------------------------------------------------------------------------\ntype OverlayProps = {\n draft: ParsedTime;\n onChange: (p: ParsedTime) => void;\n onCancel: () => void;\n onOk: () => void;\n};\n\nfunction TimeOverlay({ draft, onChange, onCancel, onOk }: OverlayProps) {\n const hourRef = React.useRef<HTMLDivElement | null>(null);\n const minuteRef = React.useRef<HTMLDivElement | null>(null);\n\n // Scroll the active option into view on mount.\n React.useEffect(() => {\n const scrollTo = (col: HTMLDivElement | null, idx: number) => {\n if (!col) return;\n const item = col.children[idx] as HTMLElement | undefined;\n if (item) col.scrollTop = item.offsetTop - col.clientHeight / 2 + item.clientHeight / 2;\n };\n scrollTo(hourRef.current, HOURS.indexOf(draft.hour12));\n scrollTo(minuteRef.current, draft.minute);\n }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <div className=\"eds-tp__overlay\" role=\"dialog\" aria-label=\"Time picker\" onMouseDown={(e) => e.stopPropagation()}>\n <div className=\"eds-tp__overlay-cols\">\n <div className=\"eds-tp__overlay-col\" ref={hourRef}>\n {HOURS.map((h) => (\n <button\n key={h}\n type=\"button\"\n className=\"eds-tp__option\"\n data-selected={h === draft.hour12}\n onClick={() => onChange({ ...draft, hour12: h })}\n >\n {h}\n </button>\n ))}\n </div>\n <div className=\"eds-tp__overlay-col\" ref={minuteRef}>\n {MINUTES.map((m) => (\n <button\n key={m}\n type=\"button\"\n className=\"eds-tp__option\"\n data-selected={m === draft.minute}\n onClick={() => onChange({ ...draft, minute: m })}\n >\n {String(m).padStart(2, \"0\")}\n </button>\n ))}\n </div>\n </div>\n <div className=\"eds-tp__overlay-divider\" />\n <div className=\"eds-tp__overlay-actions\">\n <button type=\"button\" className=\"eds-tp__overlay-btn\" onClick={onCancel}>Cancel</button>\n <button type=\"button\" className=\"eds-tp__overlay-btn\" onClick={onOk}>OK</button>\n </div>\n </div>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const TimePicker = React.forwardRef<HTMLInputElement, TimePickerProps>(\n function TimePicker(\n {\n validation = \"None\",\n style = \"Filled\",\n labelPosition = \"Top\",\n label = true,\n helperText = false,\n required = false,\n value,\n defaultValue,\n onChange,\n id,\n name,\n disabled = false,\n readOnly = false,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = value !== undefined;\n const [internal, setInternal] = React.useState<string>(defaultValue ?? \"\");\n const current = isControlled ? value : internal;\n\n const parsed = parseTime(current);\n // Meridiem is stateful so it can be toggled while the user is still\n // mid-typing the HH:MM portion (before any canonical commit happens).\n const [meridiem, setMeridiem] = React.useState<TimePickerMeridiem>(\n parsed?.meridiem ?? \"AM\"\n );\n React.useEffect(() => {\n const p = parseTime(current);\n if (p && p.meridiem !== meridiem) setMeridiem(p.meridiem);\n }, [current]); // eslint-disable-line react-hooks/exhaustive-deps\n\n // Input buffer mirrors what's visible in the <input>. Decoupled from\n // canonical value so the user's mid-typing state (\"02\", \"02:\", \"02:3\")\n // isn't blown away by a re-render every keystroke.\n const [inputBuf, setInputBuf] = React.useState<string>(() => fieldDisplay(current));\n React.useEffect(() => {\n const display = fieldDisplay(current);\n // Only sync when the canonical value actually differs from what the\n // buffer represents — keeps user typing intact between renders.\n const bufDigits = inputBuf.replace(/\\D/g, \"\");\n const displayDigits = display.replace(/\\D/g, \"\");\n if (bufDigits !== displayDigits) setInputBuf(display);\n }, [current]); // eslint-disable-line react-hooks/exhaustive-deps\n\n const [open, setOpen] = React.useState(false);\n const [draft, setDraft] = React.useState<ParsedTime>(\n parsed ?? { hour12: 12, minute: 0, meridiem: \"AM\" }\n );\n\n React.useEffect(() => {\n if (open) {\n setDraft(parseTime(current) ?? { hour12: 12, minute: 0, meridiem });\n }\n }, [open]); // eslint-disable-line react-hooks/exhaustive-deps\n\n const wrapperRef = React.useRef<HTMLDivElement | null>(null);\n React.useEffect(() => {\n if (!open) return;\n const onDown = (e: MouseEvent) => {\n if (!wrapperRef.current) return;\n if (!wrapperRef.current.contains(e.target as Node)) setOpen(false);\n };\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") setOpen(false);\n };\n document.addEventListener(\"mousedown\", onDown);\n document.addEventListener(\"keydown\", onKey);\n return () => {\n document.removeEventListener(\"mousedown\", onDown);\n document.removeEventListener(\"keydown\", onKey);\n };\n }, [open]);\n\n const commit = (next: string) => {\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n // Format raw digits into \"HH\" / \"HH:\" / \"HH:M\" / \"HH:MM\", clamping\n // hours to 01-12 and minutes to 00-59 as the user types. Returns the\n // formatted display string plus the underlying hours/minutes parts.\n const formatTyping = (raw: string): { display: string; hours: string; minutes: string } => {\n // Split on \":\" first so single-digit hours with explicit colon parse\n // correctly (e.g. \"2:30\" → hours \"2\", minutes \"30\").\n let hoursRaw: string, minutesRaw: string;\n if (raw.includes(\":\")) {\n const [h = \"\", m = \"\"] = raw.split(\":\");\n hoursRaw = h.replace(/\\D/g, \"\").slice(0, 2);\n minutesRaw = m.replace(/\\D/g, \"\").slice(0, 2);\n } else {\n const digits = raw.replace(/\\D/g, \"\").slice(0, 4);\n hoursRaw = digits.slice(0, 2);\n minutesRaw = digits.slice(2, 4);\n }\n\n // Hour clamp: 01-12. If the first hour digit is > 1, auto-pad with 0.\n let hours = hoursRaw;\n if (hours.length === 1 && parseInt(hours, 10) > 1) hours = \"0\" + hours;\n if (hours.length === 2) {\n const h = parseInt(hours, 10);\n if (h === 0) hours = \"01\";\n else if (h > 12) hours = \"12\";\n }\n\n // Minute clamp: 00-59. If the first minute digit is > 5, auto-pad with 0.\n let minutes = minutesRaw;\n if (minutes.length === 1 && parseInt(minutes, 10) > 5) minutes = \"0\" + minutes;\n if (minutes.length === 2) {\n const m = parseInt(minutes, 10);\n if (m > 59) minutes = \"59\";\n }\n\n // Display: insert \":\" once hours is complete (2 digits) OR once any\n // minute digit has been typed. This is the \"auto-advance from hours\n // to minutes\" affordance.\n let display = hours;\n if (hours.length === 2 || minutes.length > 0) display += \":\";\n display += minutes;\n\n return { display, hours, minutes };\n };\n\n const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n const { display, hours, minutes } = formatTyping(e.target.value);\n setInputBuf(display);\n\n // Commit canonical value only when both halves are complete. Empty\n // input clears the field; partial input is held in the buffer until\n // the user finishes (or blurs).\n if (hours.length === 2 && minutes.length === 2) {\n commit(`${hours}:${minutes} ${meridiem}`);\n } else if (display === \"\") {\n commit(\"\");\n }\n };\n\n const handleInputBlur: React.FocusEventHandler<HTMLInputElement> = () => {\n // If the user typed a partial value (e.g. \"02:3\"), pad it on blur so\n // we don't leave the field in a half-formed state.\n const { hours, minutes } = formatTyping(inputBuf);\n if (!hours && !minutes) return;\n const padHours = hours.length === 1 ? \"0\" + hours : hours;\n const padMinutes = minutes.length === 1 ? \"0\" + minutes : minutes.padEnd(2, \"0\");\n if (padHours.length === 2 && padMinutes.length === 2) {\n const canonical = `${padHours}:${padMinutes} ${meridiem}`;\n setInputBuf(`${padHours}:${padMinutes}`);\n commit(canonical);\n }\n };\n\n const handleMeridiemSelect = (m: TimePickerMeridiem) => {\n if (disabled || readOnly) return;\n setMeridiem(m);\n // Only re-commit if we already have a valid canonical value. Toggling\n // AM/PM while mid-typing just remembers the choice for the eventual\n // commit.\n if (parsed) commit(formatField({ ...parsed, meridiem: m }));\n };\n\n const clockButton = (\n <button\n type=\"button\"\n className=\"eds-tp__clock\"\n onClick={(e) => {\n e.stopPropagation();\n setOpen((o) => !o);\n }}\n disabled={disabled || readOnly}\n aria-label={open ? \"Close time picker\" : \"Open time picker\"}\n aria-expanded={open}\n aria-haspopup=\"dialog\"\n tabIndex={disabled ? -1 : 0}\n >\n <ClockIcon />\n </button>\n );\n\n const wrapperClass = \"eds-tp\" + (className ? ` ${className}` : \"\");\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n const helperContent =\n typeof helperText === \"string\"\n ? helperText\n : DEFAULT_HELPER[validation as keyof typeof DEFAULT_HELPER] ?? DEFAULT_HELPER.None;\n\n const fieldEl = (\n <Field\n ref={ref}\n validation={validation}\n appearance={style}\n placeholder=\"--:--\"\n value={inputBuf}\n onChange={handleInputChange}\n disabled={disabled}\n readOnly={readOnly}\n id={id}\n name={name}\n type=\"text\"\n trailingIcon={clockButton}\n aria-label={ariaLabel ?? (typeof label === \"string\" ? label : \"Time\")}\n />\n );\n\n const ampmToggle = (\n <div className=\"eds-tp__ampm\" role=\"group\" aria-label=\"AM or PM\">\n <button\n type=\"button\"\n className=\"eds-tp__ampm-btn\"\n data-selected={meridiem === \"AM\"}\n onClick={() => handleMeridiemSelect(\"AM\")}\n disabled={disabled || readOnly}\n >\n AM\n </button>\n <div className=\"eds-tp__ampm-divider\" aria-hidden />\n <button\n type=\"button\"\n className=\"eds-tp__ampm-btn\"\n data-selected={meridiem === \"PM\"}\n onClick={() => handleMeridiemSelect(\"PM\")}\n disabled={disabled || readOnly}\n >\n PM\n </button>\n </div>\n );\n\n const labelEl = label ? (\n <div className=\"eds-tp__label-slot\" data-label-position={labelPosition}>\n <label className=\"eds-tp__label-text\" htmlFor={id}>\n {required && <span className=\"eds-tp__required\" aria-hidden>*</span>}\n {labelText}\n </label>\n </div>\n ) : null;\n\n const helperEl = helperText ? (\n <div className=\"eds-tp__helper\" role={validation === \"Error\" ? \"alert\" : undefined}>\n {getHelperGlyph(validation) && (\n <span className=\"eds-tp__helper-icon\">{getHelperGlyph(validation)}</span>\n )}\n <span>{helperContent}</span>\n </div>\n ) : null;\n\n return (\n <div\n className={wrapperClass}\n data-validation={validation}\n data-label-position={labelPosition}\n ref={wrapperRef}\n >\n {labelEl}\n <div className=\"eds-tp__content\">\n <div\n className=\"eds-tp__field-row\"\n onBlur={(e) => {\n // React's onBlur bubbles via focusout; fire pad-on-blur only\n // when the input itself lost focus, not the AM/PM buttons.\n const t = e.target as HTMLElement;\n if (t.classList.contains(\"eds-field-wrap__input\")) {\n handleInputBlur(e as React.FocusEvent<HTMLInputElement>);\n }\n }}\n >\n {fieldEl}\n {ampmToggle}\n </div>\n {helperEl}\n {open && (\n <TimeOverlay\n draft={draft}\n onChange={setDraft}\n onCancel={() => setOpen(false)}\n onOk={() => {\n commit(formatField(draft));\n setOpen(false);\n }}\n />\n )}\n </div>\n </div>\n );\n }\n);\n\nexport default TimePicker;\n\n// ---------------------------------------------------------------------------\n// TimePickerMatrix — interactive showcase across Validation × Style ×\n// LabelPosition. The interactive top row opens the overlay on focus.\n// ---------------------------------------------------------------------------\nexport function TimePickerMatrix() {\n ensureStyles();\n const validations: TimePickerValidation[] = [\"None\", \"Error\", \"Warning\", \"Success\", \"AI\"];\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (focus the field or click the clock)\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 16, maxWidth: 520 }}>\n <TimePicker label helperText defaultValue=\"08:30 AM\" />\n </div>\n </section>\n\n {([\"Filled\", \"Outlined\"] as TimePickerStyle[]).map((s) => (\n <section key={s} style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Style = {s} · LabelPosition = Top\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(440px, 1fr))\", gap: 16 }}>\n {validations.map((v) => (\n <TimePicker key={v} validation={v} style={s} label helperText labelPosition=\"Top\" />\n ))}\n </div>\n </section>\n ))}\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n LabelPosition = Left\n </p>\n <div style={{ display: \"flex\", flexDirection: \"column\", gap: 16, maxWidth: 620 }}>\n {validations.map((v) => (\n <TimePicker key={v} validation={v} label helperText labelPosition=\"Left\" />\n ))}\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Booleans\n </p>\n <div style={{ display: \"flex\", gap: 24, flexWrap: \"wrap\", maxWidth: 800 }}>\n <TimePicker label={false} helperText={false} />\n <TimePicker label={false} helperText={false} disabled />\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Toggle — React port of Embleema Design System 2.0's Selector/Toggle\n * component (Figma node 5221:23).\n *\n * Structure mirrors the Figma source:\n * wrapper (<label>)\n * ├── input (visually hidden, role=switch via aria-checked)\n * └── track (52×32 pill)\n * └── thumb (24×24 circle, slides via transform: translateX)\n *\n * Real `<input type=\"checkbox\">` underneath provides keyboard support\n * (Space toggles), form integration, and screen-reader semantics\n * (announced as a switch because of role/aria-checked).\n *\n * Props:\n * - state : forced override for previews\n * (Default | Hover | Focus | Disabled)\n * Omit to let real browser :hover / :focus-within\n * drive Hover and Focus automatically.\n * - selected : controlled on/off state (true = On, false = Off)\n * - defaultSelected : uncontrolled initial state\n * - disabled : maps to data-state=\"Disabled\" + HTML disabled\n * - onChange : called with the new selected boolean\n * - name, value, id, aria-label : standard HTML passthrough\n */\n\nimport * as React from \"react\";\n\nexport type ToggleState = \"Default\" | \"Hover\" | \"Focus\" | \"Disabled\";\n\nexport type ToggleProps = {\n state?: ToggleState;\n selected?: boolean;\n defaultSelected?: boolean;\n disabled?: boolean;\n onChange?: (selected: boolean) => void;\n id?: string;\n name?: string;\n value?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet — colors come from the live Figma extraction:\n//\n// Track:\n// On / Default | Hover | Focus : Action/Primary (Default), Blue/300 (Hover/Focus)\n// On / Disabled : Action/Disabled/Background (#DDDDDD)\n// Off / Default : Background/Secondary fill + Border/Default 1.5px\n// Off / Hover | Focus : Background/Secondary fill + Border/Strong 1.5px\n// Off / Disabled : Action/Disabled/Background fill + Border/Default 1.5px\n//\n// Thumb:\n// On / Default | Hover | Focus : Background/Default (#FEFEFE), no stroke\n// On / Disabled : Background/Secondary (#F1F1F1), no stroke\n// Off / Default | Hover | Focus : Background/Default + Border/Strong 1px outline\n// Off / Disabled : Background/Secondary, no stroke\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --tg-action-primary: #306AE8;\n --tg-blue-300: #6994EE;\n --tg-action-disabled-bg: #DDDDDD;\n --tg-background-default: #FEFEFE;\n --tg-background-secondary: #F1F1F1;\n --tg-border-default: #DDDDDD;\n --tg-border-strong: #848484;\n --tg-border-focus-ring: #A2BDF5;\n}\n\n.eds-tg {\n --tg-track-bg: var(--tg-background-secondary);\n --tg-track-border: var(--tg-border-default);\n --tg-track-border-width: 1.5px;\n --tg-thumb-bg: var(--tg-background-default);\n --tg-thumb-border: var(--tg-border-strong);\n --tg-thumb-border-width: 1px;\n --tg-thumb-translate: 0px;\n\n display: inline-flex;\n align-items: center;\n font-family: Nunito, sans-serif;\n cursor: pointer;\n user-select: none;\n position: relative;\n}\n.eds-tg[data-state=\"Disabled\"],\n.eds-tg:has(input:disabled) {\n cursor: not-allowed;\n}\n\n/* Visually hidden but still focusable native input */\n.eds-tg__input {\n position: absolute;\n inset: 0;\n opacity: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n cursor: inherit;\n}\n.eds-tg__input:disabled { cursor: not-allowed; }\n\n/* Track — the 52×32 pill */\n.eds-tg__track {\n position: relative;\n width: 52px;\n height: 32px;\n flex-shrink: 0;\n box-sizing: border-box;\n border-radius: 999px;\n background-color: var(--tg-track-bg);\n border: var(--tg-track-border-width) solid var(--tg-track-border);\n /* Outer focus halo. Transparent by default; lights up via --tg-ring\n in the focus rules below. Matches Field's focus-ring pattern. */\n box-shadow: var(--tg-ring, 0 0 0 0 transparent);\n transition: background-color 180ms ease-out,\n border-color 180ms ease-out,\n box-shadow 120ms ease-out;\n}\n\n/* Thumb — the 24×24 circle. translateX moves it from off (left) to on (right).\n With track 52px, padding 4px on each side, thumb 24px: slide distance =\n 52 - 4 - 24 - 4 = 20px. */\n.eds-tg__thumb {\n position: absolute;\n top: 50%;\n left: 4px;\n width: 24px;\n height: 24px;\n border-radius: 50%;\n box-sizing: border-box;\n background-color: var(--tg-thumb-bg);\n border: var(--tg-thumb-border-width) solid var(--tg-thumb-border);\n transform: translate(var(--tg-thumb-translate), -50%);\n transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1),\n background-color 180ms ease-out,\n border-color 180ms ease-out,\n border-width 180ms ease-out;\n}\n/* Track has a 1.5px border, so the thumb sits inside a slightly smaller\n interior. Adjust left to keep the thumb visually centered against the\n track's inner edge. */\n.eds-tg__track {\n /* leaves padding 4 inside the 1.5px border = 2.5px from outer edge */\n}\n\n/* =============================================================\n Selected = On — blue track, white thumb (no outline), slid right.\n ============================================================= */\n.eds-tg[data-selected=\"true\"] {\n --tg-track-bg: var(--tg-action-primary);\n --tg-track-border: transparent;\n --tg-track-border-width: 0;\n --tg-thumb-bg: var(--tg-background-default);\n --tg-thumb-border: transparent;\n --tg-thumb-border-width: 0;\n --tg-thumb-translate: 20px;\n}\n\n/* =============================================================\n States — natural :hover / :focus-within OR forced data-state.\n ============================================================= */\n\n/* Off + Hover/Focus: stroke darkens */\n.eds-tg:not([data-state=\"Disabled\"]):not([data-selected=\"true\"]):hover,\n.eds-tg:not([data-state=\"Disabled\"]):not([data-selected=\"true\"]):focus-within,\n.eds-tg[data-state=\"Hover\"]:not([data-selected=\"true\"]),\n.eds-tg[data-state=\"Focus\"]:not([data-selected=\"true\"]) {\n --tg-track-border: var(--tg-border-strong);\n}\n\n/* Focus: outer 4px Blue/200 (#A2BDF5) halo on the track, applied additively\n so the inner stroke/border treatment from the rule above (Off) or the\n selected track color (On) still reads through. Fires on either real keyboard\n focus (:focus-within) or the forced data-state=\"Focus\" preview override.\n Disabled toggles never show the ring. */\n.eds-tg:not([data-state=\"Disabled\"]):focus-within,\n.eds-tg[data-state=\"Focus\"]:not([data-state=\"Disabled\"]) {\n --tg-ring: 0 0 0 4px var(--tg-border-focus-ring);\n}\n\n/* On + Hover/Focus: track stays at Action/Primary (#306AE8). The lighter\n Blue/300 from the Figma source is intentionally not applied so the brand\n blue reads consistently across Default/Hover/Focus when toggled on. */\n\n/* Disabled — both On and Off collapse to grays */\n.eds-tg[data-state=\"Disabled\"]:not([data-selected=\"true\"]) {\n --tg-track-bg: var(--tg-action-disabled-bg);\n --tg-track-border: var(--tg-border-default);\n --tg-track-border-width: 1.5px;\n --tg-thumb-bg: var(--tg-background-secondary);\n --tg-thumb-border: transparent;\n --tg-thumb-border-width: 0;\n}\n.eds-tg[data-state=\"Disabled\"][data-selected=\"true\"] {\n --tg-track-bg: var(--tg-action-disabled-bg);\n --tg-track-border: transparent;\n --tg-track-border-width: 0;\n --tg-thumb-bg: var(--tg-background-secondary);\n --tg-thumb-border: transparent;\n --tg-thumb-border-width: 0;\n}\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-tg-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 40px;\n background: #FEFEFE;\n}\n.eds-tg-matrix__section { display: flex; flex-direction: column; gap: 16px; }\n.eds-tg-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-tg-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-tg-matrix__row {\n display: grid;\n grid-template-columns: 120px 1fr 1fr;\n align-items: center;\n gap: 12px;\n}\n.eds-tg-matrix__row-label {\n font-size: 12px;\n font-weight: 600;\n color: #0E0E0E;\n margin: 0;\n}\n.eds-tg-matrix__col-head {\n font-size: 11px;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: #5E5E5E;\n}\n.eds-tg-matrix__group {\n display: flex;\n flex-direction: column;\n gap: 12px;\n padding: 16px;\n background: #F8F8F8;\n border-radius: 8px;\n}\n.eds-tg-matrix__live {\n display: flex;\n align-items: center;\n gap: 12px;\n font-size: 14px;\n}\n.eds-tg-matrix__live span { color: #5E5E5E; }\n.eds-tg-matrix__live strong { font-weight: 600; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-toggle]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-toggle\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\nlet idCounter = 0;\nfunction useGeneratedId(provided?: string) {\n const [id] = React.useState(() => provided ?? `eds-tg-${++idCounter}`);\n return id;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Toggle = React.forwardRef<HTMLInputElement, ToggleProps>(\n function Toggle(\n {\n state,\n selected,\n defaultSelected = false,\n disabled = false,\n onChange,\n id: providedId,\n name,\n value,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const id = useGeneratedId(providedId);\n\n const isControlled = selected !== undefined;\n const [internal, setInternal] = React.useState(defaultSelected);\n const checked = isControlled ? !!selected : internal;\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const next = e.target.checked;\n if (!isControlled) setInternal(next);\n onChange?.(next);\n };\n\n const effectiveState: ToggleState | undefined =\n state ?? (disabled ? \"Disabled\" : undefined);\n const isDisabled = disabled || effectiveState === \"Disabled\";\n const wrapperClass = \"eds-tg\" + (className ? ` ${className}` : \"\");\n\n return (\n <label\n className={wrapperClass}\n data-state={effectiveState}\n data-selected={checked || undefined}\n htmlFor={id}\n >\n <input\n ref={ref}\n id={id}\n name={name}\n value={value}\n type=\"checkbox\"\n role=\"switch\"\n className=\"eds-tg__input\"\n checked={checked}\n disabled={isDisabled}\n onChange={handleChange}\n aria-checked={checked}\n aria-label={ariaLabel ?? \"Toggle\"}\n />\n <span className=\"eds-tg__track\">\n <span className=\"eds-tg__thumb\" />\n </span>\n </label>\n );\n }\n);\n\nexport default Toggle;\n\n// ---------------------------------------------------------------------------\n// ToggleMatrix — State × Selected grid plus an interactive live toggle.\n// ---------------------------------------------------------------------------\nconst STATES: ToggleState[] = [\"Default\", \"Hover\", \"Focus\", \"Disabled\"];\n\nfunction StateRow({ state }: { state: ToggleState }) {\n const forced = state !== \"Default\";\n return (\n <div className=\"eds-tg-matrix__row\">\n <p className=\"eds-tg-matrix__row-label\">{state}</p>\n <Toggle {...(forced ? { state } : {})} aria-label={`${state} off`} />\n <Toggle\n defaultSelected\n {...(forced ? { state } : {})}\n aria-label={`${state} on`}\n />\n </div>\n );\n}\n\nexport function ToggleMatrix() {\n ensureStyles();\n const [live, setLive] = React.useState(false);\n\n return (\n <div className=\"eds-tg-matrix\">\n <section className=\"eds-tg-matrix__section\">\n <h3 className=\"eds-tg-matrix__heading\">State × Selected</h3>\n <p className=\"eds-tg-matrix__sub\">\n The Default row is fully interactive — click to flip the toggle and\n watch the thumb slide. Tab in to see the focus stroke.\n </p>\n <div className=\"eds-tg-matrix__row\">\n <span className=\"eds-tg-matrix__col-head\">State</span>\n <span className=\"eds-tg-matrix__col-head\">Off</span>\n <span className=\"eds-tg-matrix__col-head\">On</span>\n </div>\n {STATES.map((state) => (\n <StateRow key={state} state={state} />\n ))}\n </section>\n\n <section className=\"eds-tg-matrix__section\">\n <h3 className=\"eds-tg-matrix__heading\">Interactive</h3>\n <p className=\"eds-tg-matrix__sub\">\n Controlled toggle wired to React state. Click to flip; the value\n updates below.\n </p>\n <div className=\"eds-tg-matrix__group\">\n <div className=\"eds-tg-matrix__live\">\n <Toggle\n selected={live}\n onChange={setLive}\n aria-label=\"Live toggle\"\n />\n <span>\n Current value: <strong>{live ? \"On\" : \"Off\"}</strong>\n </span>\n </div>\n </div>\n </section>\n </div>\n );\n}\n","/**\n * Upload — React port of the Embleema Design System 2.0 Input/Upload\n * component (Figma node 4434:95). A drag-and-drop file zone with primary\n * instructions, file-format hint, and a \"Choose File\" button.\n *\n * State handling:\n * - Default: white bg, dashed Border/Strong (#848484) outline\n * - Hover: derived automatically when a file is being dragged over;\n * swaps to Background/Selected fill + dashed Action/Primary outline\n * - Focused: keyboard focus on the zone, dashed Action/Primary outline\n * - HasFile: shows file preview card (thumbnail + name + Remove) plus a\n * secondary drop zone for additional files\n * - Error: Feedback/Error/Background fill + dashed Border/Error outline,\n * error helper row in Feedback/Error/Text\n * - Disabled / ReadOnly: muted, pointer-events suppressed\n *\n * Interaction:\n * - Click on the zone (or the button) → opens the native file browser\n * - Drag a file over the zone → flips to Hover state\n * - Drop a file → flips to HasFile, fires onFileChange(file)\n * - Remove → clears the file and fires onFileChange(null)\n */\n\nimport * as React from \"react\";\nimport { Label } from \"./Label\";\n\nexport type UploadState =\n | \"Default\"\n | \"Hover\"\n | \"Focused\"\n | \"HasFile\"\n | \"Error\"\n | \"Disabled\"\n | \"ReadOnly\";\n\nexport type UploadProps = {\n /** Force a visual state. When omitted, state is derived from drag + file. */\n state?: UploadState;\n label?: boolean | string;\n helperText?: boolean | string;\n required?: boolean;\n /** Primary instructions inside the drop zone. */\n instructions?: string;\n /** File-format hint shown beneath instructions. */\n fileFormat?: string;\n /** MIME / extension filter passed to the <input type=\"file\">. */\n accept?: string;\n multiple?: boolean;\n /** Controlled file (or first of multi). */\n file?: File | null;\n /** Uncontrolled initial file. */\n defaultFile?: File | null;\n onFileChange?: (file: File | null) => void;\n id?: string;\n name?: string;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_LABEL = \"Label\";\nconst DEFAULT_INSTRUCTIONS = \"Drag and drop a file here, or click to browse\";\nconst DEFAULT_FILE_FORMAT = \"PDF, PNG, JPG up to 10MB\";\nconst DEFAULT_HELPER: Record<UploadState, string> = {\n Default: \"Helper text\",\n Hover: \"Helper text\",\n Focused: \"Helper text\",\n HasFile: \"Helper text\",\n Error: \"Upload failed. Please try again.\",\n Disabled: \"Helper text\",\n ReadOnly: \"Helper text\",\n};\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600&display=swap\");\n\n:root {\n --up-text-primary: #0E0E0E;\n --up-text-secondary: #5E5E5E;\n --up-text-tertiary: #848484;\n --up-text-error: #E02020;\n --up-text-info-icon: #306AE8;\n --up-feedback-error-bg: #FFE2E2;\n --up-feedback-error-text: #B31A1A;\n --up-action-primary: #306AE8;\n --up-action-primary-hover: #6994EE;\n --up-action-primary-text: #FEFEFE;\n --up-action-destructive: #E02020;\n --up-bg-default: #FEFEFE;\n --up-bg-primary: #F8F8F8;\n --up-bg-selected: #E3ECFF;\n --up-bg-disabled: #F1F1F1;\n --up-border-default: #DDDDDD;\n --up-border-strong: #848484;\n --up-border-error: #E02020;\n}\n\n.eds-up {\n display: flex;\n flex-direction: column;\n gap: 4px;\n width: 100%;\n font-family: Nunito, sans-serif;\n}\n\n/* Label wrapper — Label component renders the inline label + info icon. */\n.eds-up__label-row {\n display: inline-flex;\n align-items: center;\n width: 100%;\n margin-bottom: 8px;\n}\n\n/* Drop zone — Figma node 4431:32:\n - Default: white bg, 1px dashed Neutral/300 (#DDDDDD), Elevation/100 shadow\n - 40px top/bottom padding (Figma uses 20px; user spec is \"more padding\")\n - 24px gap between text block → button (Figma has no leading icon)\n - Min-height 200px */\n.eds-up__zone {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 24px;\n min-height: 200px;\n padding: 40px 20px;\n background: var(--up-bg-default);\n border: 1px dashed var(--up-border-default);\n border-radius: 4px;\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.08);\n cursor: pointer;\n transition: background 120ms, border-color 120ms, box-shadow 120ms;\n outline: 0;\n}\n.eds-up__zone:focus-visible {\n border-color: var(--up-action-primary);\n box-shadow: 0 0 0 3px var(--up-bg-selected);\n}\n/* Hover (drag-over) — Figma uses white bg + blue dashed border + stronger\n shadow. Not Background/Selected as I had it before. */\n.eds-up[data-state=\"Hover\"] .eds-up__zone {\n background: var(--up-bg-default);\n border-color: var(--up-action-primary);\n box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.12);\n}\n.eds-up[data-state=\"Focused\"] .eds-up__zone {\n border-color: var(--up-action-primary);\n box-shadow: 0 0 0 3px var(--up-bg-selected);\n}\n.eds-up[data-state=\"Error\"] .eds-up__zone {\n background: var(--up-feedback-error-bg);\n border-color: var(--up-border-error);\n}\n.eds-up[data-state=\"Disabled\"] .eds-up__zone,\n.eds-up[data-state=\"ReadOnly\"] .eds-up__zone {\n background: var(--up-bg-disabled);\n border-color: var(--up-border-default);\n cursor: not-allowed;\n box-shadow: none;\n}\n\n.eds-up__text-block {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n text-align: center;\n width: 100%;\n font-family: Nunito, sans-serif;\n}\n.eds-up__instructions {\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n color: var(--up-text-primary);\n margin: 0;\n}\n.eds-up[data-state=\"Disabled\"] .eds-up__instructions,\n.eds-up[data-state=\"ReadOnly\"] .eds-up__instructions { color: var(--up-text-tertiary); }\n.eds-up__format {\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--up-text-tertiary);\n margin: 0;\n}\n\n/* Choose File button — Action/Primary filled, padding 20×8, rounded 8px,\n body/sm Nunito Regular 14, Action/Primary/Text fill. */\n.eds-up__choose {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 8px 20px;\n border: 0;\n background: var(--up-action-primary);\n color: var(--up-action-primary-text);\n border-radius: 8px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.5;\n cursor: pointer;\n filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.08));\n transition: background 120ms;\n}\n.eds-up__choose:hover:not(:disabled) { background: var(--up-action-primary-hover); }\n.eds-up__choose:focus-visible {\n outline: 2px solid #A2BDF5;\n outline-offset: 2px;\n}\n.eds-up__choose:disabled { cursor: not-allowed; opacity: 0.5; }\n\n/* HasFile preview card */\n.eds-up__zone--has-file {\n flex-direction: column;\n align-items: stretch;\n justify-content: flex-start;\n gap: 16px;\n cursor: default;\n}\n.eds-up__preview {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 12px;\n background: var(--up-bg-primary);\n border-radius: 4px;\n}\n.eds-up__thumb {\n width: 100px;\n height: 100px;\n flex-shrink: 0;\n background: var(--up-bg-default);\n border: 1px solid var(--up-border-default);\n box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.12);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--up-text-tertiary);\n}\n.eds-up__thumb svg { width: 48px; height: 48px; display: block; }\n.eds-up__file-info {\n display: flex;\n flex-direction: column;\n justify-content: center;\n gap: 16px;\n flex: 1 1 0;\n min-width: 0;\n}\n.eds-up__file-text {\n display: flex;\n flex-direction: column;\n gap: 4px;\n font-family: Nunito, sans-serif;\n color: var(--up-text-primary);\n overflow: hidden;\n}\n.eds-up__file-name {\n font-weight: 400;\n font-size: 16px;\n line-height: 1.5;\n margin: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.eds-up__file-meta {\n font-weight: 300;\n font-size: 14px;\n line-height: 1.5;\n color: var(--up-text-tertiary);\n margin: 0;\n}\n.eds-up__remove {\n align-self: flex-start;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 8px 20px;\n background: transparent;\n border: 1px solid var(--up-action-destructive);\n color: var(--up-action-destructive);\n border-radius: 8px;\n font-family: Nunito, sans-serif;\n font-weight: 500;\n font-size: 14px;\n line-height: 1.5;\n cursor: pointer;\n transition: background 120ms;\n}\n.eds-up__remove:hover:not(:disabled) { background: rgba(224, 32, 32, 0.06); }\n.eds-up__remove:focus-visible {\n outline: 2px solid var(--up-action-destructive);\n outline-offset: 2px;\n}\n.eds-up__remove:disabled { cursor: not-allowed; opacity: 0.5; }\n\n.eds-up__secondary-zone {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 20px;\n background: var(--up-bg-default);\n border: 1px dashed var(--up-border-strong);\n border-radius: 4px;\n cursor: pointer;\n transition: background 120ms, border-color 120ms;\n}\n.eds-up[data-state=\"Hover\"] .eds-up__secondary-zone {\n background: var(--up-bg-selected);\n border-color: var(--up-action-primary);\n}\n.eds-up__secondary-zone-text {\n font-family: Nunito, sans-serif;\n font-weight: 300;\n font-size: 16px;\n line-height: 1.5;\n color: var(--up-text-tertiary);\n text-align: center;\n margin: 0;\n}\n.eds-up[data-state=\"Disabled\"] .eds-up__secondary-zone,\n.eds-up[data-state=\"ReadOnly\"] .eds-up__secondary-zone {\n cursor: not-allowed;\n}\n\n/* Hide the native input (still focusable by click). */\n.eds-up__input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n}\n\n/* Helper text */\n.eds-up__helper {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding-top: 4px;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 12px;\n line-height: 1.4;\n letter-spacing: 0.01em;\n color: var(--up-text-tertiary);\n}\n.eds-up[data-state=\"Error\"] .eds-up__helper { color: var(--up-feedback-error-text); }\n.eds-up__helper-icon {\n display: inline-flex;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.eds-up__helper-icon svg { width: 100%; height: 100%; display: block; }\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-upload]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-upload\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) {\n el.textContent = styles;\n }\n}\n\n// ---------------------------------------------------------------------------\n// Icons\n// ---------------------------------------------------------------------------\nfunction InfoIcon() {\n return (\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M10 14.5C10.2125 14.5 10.3906 14.4281 10.5344 14.2843C10.6781 14.1406 10.75 13.9625 10.75 13.75V9.75C10.75 9.5375 10.6781 9.35935 10.5344 9.2156C10.3906 9.07185 10.2125 9 10 9C9.7875 9 9.60938 9.07185 9.46563 9.2156C9.32188 9.35935 9.25 9.5375 9.25 9.75V13.75C9.25 13.9625 9.32188 14.1406 9.46563 14.2843C9.60938 14.4281 9.7875 14.5 10 14.5ZM10 7.5C10.2125 7.5 10.3906 7.42815 10.5344 7.2844C10.6781 7.14065 10.75 6.9625 10.75 6.75C10.75 6.5375 10.6781 6.35935 10.5344 6.2156C10.3906 6.07185 10.2125 6 10 6C9.7875 6 9.60938 6.07185 9.46563 6.2156C9.32188 6.35935 9.25 6.5375 9.25 6.75C9.25 6.9625 9.32188 7.14065 9.46563 7.2844C9.60938 7.42815 9.7875 7.5 10 7.5ZM10 19C8.75 19 7.575 18.7625 6.475 18.2875C5.375 17.8125 4.41875 17.1688 3.60625 16.3563C2.79375 15.5438 2.15 14.5875 1.675 13.4875C1.2 12.3875 0.962 11.2125 0.962 9.9625C0.962 8.7125 1.2 7.5375 1.675 6.4375C2.15 5.3375 2.79375 4.38125 3.60625 3.56875C4.41875 2.75625 5.375 2.1125 6.475 1.6375C7.575 1.1625 8.75 0.925 10 0.925C11.25 0.925 12.425 1.1625 13.525 1.6375C14.625 2.1125 15.5813 2.75625 16.3938 3.56875C17.2063 4.38125 17.85 5.3375 18.325 6.4375C18.8 7.5375 19.0375 8.7125 19.0375 9.9625C19.0375 11.2125 18.8 12.3875 18.325 13.4875C17.85 14.5875 17.2063 15.5438 16.3938 16.3563C15.5813 17.1688 14.625 17.8125 13.525 18.2875C12.425 18.7625 11.25 19 10 19ZM10 17.5C12.1 17.5 13.875 16.775 15.325 15.325C16.775 13.875 17.5 12.1 17.5 10C17.5 7.9 16.775 6.125 15.325 4.675C13.875 3.225 12.1 2.5 10 2.5C7.9 2.5 6.125 3.225 4.675 4.675C3.225 6.125 2.5 7.9 2.5 10C2.5 12.1 3.225 13.875 4.675 15.325C6.125 16.775 7.9 17.5 10 17.5Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\nfunction FileIcon() {\n return (\n <svg viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n d=\"M14 6h16l10 10v22a4 4 0 01-4 4H14a4 4 0 01-4-4V10a4 4 0 014-4z\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinejoin=\"round\"\n />\n <path\n d=\"M30 6v10h10\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\nfunction ErrorGlyph() {\n return (\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path d=\"M1.333 14L8 2.667 14.667 14H1.333zM8 12.667a.5.5 0 100-1 .5.5 0 000 1zm-.5-2h1V7h-1v3.667z\" fill=\"#B31A1A\" />\n </svg>\n );\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\nfunction formatBytes(b: number): string {\n if (b < 1024) return `${b} B`;\n if (b < 1024 * 1024) return `${(b / 1024).toFixed(1)} KB`;\n return `${(b / (1024 * 1024)).toFixed(2)} MB`;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const Upload = React.forwardRef<HTMLDivElement, UploadProps>(\n function Upload(\n {\n state,\n label = true,\n helperText = false,\n required = false,\n instructions = DEFAULT_INSTRUCTIONS,\n fileFormat = DEFAULT_FILE_FORMAT,\n accept,\n multiple = false,\n file,\n defaultFile,\n onFileChange,\n id,\n name,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n\n const isControlled = file !== undefined;\n const [internalFile, setInternalFile] = React.useState<File | null>(defaultFile ?? null);\n const current = isControlled ? file ?? null : internalFile;\n\n const [dragOver, setDragOver] = React.useState(false);\n const [focused, setFocused] = React.useState(false);\n const inputRef = React.useRef<HTMLInputElement | null>(null);\n\n // Derive the visual state: explicit prop wins, otherwise compute from\n // drag state + file state + focus.\n const computed: UploadState =\n state ??\n (dragOver ? \"Hover\"\n : current ? \"HasFile\"\n : focused ? \"Focused\"\n : \"Default\");\n\n const disabled = computed === \"Disabled\";\n const readOnly = computed === \"ReadOnly\";\n const locked = disabled || readOnly;\n const isError = computed === \"Error\";\n\n const commit = (next: File | null) => {\n if (!isControlled) setInternalFile(next);\n onFileChange?.(next);\n };\n\n const openBrowser = () => {\n if (locked) return;\n inputRef.current?.click();\n };\n\n const handleNativeChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n const f = e.target.files?.[0] ?? null;\n commit(f);\n // Reset value so picking the same file twice still fires onChange.\n if (inputRef.current) inputRef.current.value = \"\";\n };\n\n const handleDragOver: React.DragEventHandler<HTMLDivElement> = (e) => {\n if (locked) return;\n e.preventDefault();\n e.dataTransfer.dropEffect = \"copy\";\n if (!dragOver) setDragOver(true);\n };\n const handleDragLeave: React.DragEventHandler<HTMLDivElement> = (e) => {\n // Only flip off when leaving the actual zone (not bubbling from child).\n if (e.currentTarget.contains(e.relatedTarget as Node)) return;\n setDragOver(false);\n };\n const handleDrop: React.DragEventHandler<HTMLDivElement> = (e) => {\n if (locked) return;\n e.preventDefault();\n setDragOver(false);\n const f = e.dataTransfer.files?.[0] ?? null;\n if (f) commit(f);\n };\n const handleKey: React.KeyboardEventHandler<HTMLDivElement> = (e) => {\n if (locked) return;\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n openBrowser();\n }\n };\n\n const wrapperClass = \"eds-up\" + (className ? ` ${className}` : \"\");\n const labelText = typeof label === \"string\" ? label : DEFAULT_LABEL;\n const helperContent =\n typeof helperText === \"string\"\n ? helperText\n : DEFAULT_HELPER[computed] ?? DEFAULT_HELPER.Default;\n\n const labelEl = label ? (\n <div className=\"eds-up__label-row\">\n <Label\n size=\"Small\"\n required={required}\n tooltip\n tooltipTitle={labelText}\n tooltipText=\"Drag a file onto the zone or click to browse your device.\"\n htmlFor={id}\n >\n {labelText}\n </Label>\n </div>\n ) : null;\n\n const helperEl = helperText ? (\n <div className=\"eds-up__helper\" role={isError ? \"alert\" : undefined}>\n {isError && (\n <span className=\"eds-up__helper-icon\"><ErrorGlyph /></span>\n )}\n <span>{helperContent}</span>\n </div>\n ) : null;\n\n const renderEmpty = () => (\n <>\n <div className=\"eds-up__text-block\">\n <p className=\"eds-up__instructions\">{instructions}</p>\n <p className=\"eds-up__format\">{fileFormat}</p>\n </div>\n <button\n type=\"button\"\n className=\"eds-up__choose\"\n onClick={(e) => {\n e.stopPropagation();\n openBrowser();\n }}\n disabled={locked}\n tabIndex={-1}\n >\n Choose File\n </button>\n </>\n );\n\n const renderHasFile = () => (\n <>\n <div className=\"eds-up__preview\">\n <div className=\"eds-up__thumb\" aria-hidden><FileIcon /></div>\n <div className=\"eds-up__file-info\">\n <div className=\"eds-up__file-text\">\n <p className=\"eds-up__file-name\" title={current?.name}>\n {current?.name ?? \"File\"}\n </p>\n <p className=\"eds-up__file-meta\">\n {current ? formatBytes(current.size) : \"\"}\n </p>\n </div>\n {!readOnly && (\n <button\n type=\"button\"\n className=\"eds-up__remove\"\n onClick={(e) => {\n e.stopPropagation();\n commit(null);\n }}\n disabled={disabled}\n >\n Remove\n </button>\n )}\n </div>\n </div>\n {!readOnly && (\n <div\n className=\"eds-up__secondary-zone\"\n onClick={openBrowser}\n role=\"button\"\n tabIndex={-1}\n >\n <p className=\"eds-up__secondary-zone-text\">\n Drag and drop additional documents\n </p>\n </div>\n )}\n </>\n );\n\n const hasFile = computed === \"HasFile\" || (current !== null && !isError);\n const zoneClass =\n \"eds-up__zone\" + (hasFile && !isError ? \" eds-up__zone--has-file\" : \"\");\n\n return (\n <div ref={ref} className={wrapperClass} data-state={computed}>\n {labelEl}\n <div\n className={zoneClass}\n role={hasFile ? undefined : \"button\"}\n tabIndex={locked ? -1 : 0}\n aria-disabled={disabled || undefined}\n aria-label={ariaLabel ?? \"File upload\"}\n onClick={hasFile ? undefined : openBrowser}\n onDragOver={handleDragOver}\n onDragEnter={handleDragOver}\n onDragLeave={handleDragLeave}\n onDrop={handleDrop}\n onKeyDown={handleKey}\n onFocus={() => setFocused(true)}\n onBlur={() => setFocused(false)}\n >\n {hasFile && !isError ? renderHasFile() : renderEmpty()}\n <input\n ref={inputRef}\n id={id}\n name={name}\n type=\"file\"\n className=\"eds-up__input\"\n accept={accept}\n multiple={multiple}\n onChange={handleNativeChange}\n disabled={locked}\n tabIndex={-1}\n aria-hidden\n />\n </div>\n {helperEl}\n </div>\n );\n }\n);\n\nexport default Upload;\n\n// ---------------------------------------------------------------------------\n// UploadMatrix — interactive showcase. The first row is fully interactive;\n// drop a file or click to pick one to see the HasFile state. Below it sits a\n// static grid showing every state.\n// ---------------------------------------------------------------------------\nexport function UploadMatrix() {\n ensureStyles();\n const states: UploadState[] = [\n \"Default\", \"Hover\", \"Focused\", \"HasFile\", \"Error\", \"Disabled\", \"ReadOnly\",\n ];\n // Build a fake File for the HasFile/ReadOnly static demos so they show the\n // preview card without requiring the user to actually drop anything.\n const fakeFile = React.useMemo(\n () => new File([new Blob([\"sample\"])], \"Site_Coordinator_Report.pdf\", { type: \"application/pdf\" }),\n []\n );\n\n return (\n <div style={{ fontFamily: \"Nunito, sans-serif\", padding: 32, background: \"#FEFEFE\", display: \"flex\", flexDirection: \"column\", gap: 40 }}>\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n Interactive (drag a file, drop, or click to browse)\n </p>\n <div style={{ maxWidth: 550 }}>\n <Upload label helperText />\n </div>\n </section>\n\n <section style={{ display: \"flex\", flexDirection: \"column\", gap: 16 }}>\n <p style={{ fontSize: 14, fontWeight: 600, letterSpacing: \"0.08em\", textTransform: \"uppercase\", color: \"#5E5E5E\", margin: 0 }}>\n All states (forced)\n </p>\n <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fit, minmax(440px, 1fr))\", gap: 24 }}>\n {states.map((st) => (\n <Upload\n key={st}\n state={st}\n label\n helperText\n defaultFile={st === \"HasFile\" || st === \"ReadOnly\" ? fakeFile : null}\n />\n ))}\n </div>\n </section>\n </div>\n );\n}\n","/**\n * WebTopNav — React port of Embleema Design System 2.0's\n * Navigation/Web Top Nav (Figma node 5109:52). Top-of-page navigation bar\n * with two breakpoint layouts:\n *\n * Desktop (full bar, 1280 px reference)\n * ├── TopRow (logo, flex spacer, Account menu trigger)\n * └── TabBar (horizontal tabs with brand-pink active underline)\n *\n * Mobile (condensed, 390 px reference)\n * └── Row (logo, hamburger toggle)\n *\n * Colors map to the semantic tokens from embleema-design-system.md:\n * - Background/Default (#FEFEFE) — bar surface\n * - Border/Default (#DDDDDD) — TabBar bottom border\n * - Text/Primary (#0E0E0E) — active tab + Account label\n * - Text/Secondary (#5E5E5E) — inactive tab labels\n * - Accent/Brand (#C20A72) — active tab underline\n * - Action/Primary/Background (#306AE8) — logo + hamburger\n *\n * Tabs use the Primary TabBar style: 14 px Nunito, uppercase, letter-spacing\n * 0.06em. Active tab is Nunito SemiBold with a 2 px pink underline; inactive\n * tabs are Nunito Regular in Text/Secondary.\n */\n\nimport * as React from \"react\";\nimport { MenuTrigger } from \"./MenuTrigger\";\n\nexport type WebTopNavBreakpoint = \"Desktop\" | \"Mobile\";\n\nexport type WebTopNavTab = {\n label: string;\n active?: boolean;\n onClick?: () => void;\n};\n\nexport type WebTopNavProps = {\n breakpoint?: WebTopNavBreakpoint;\n /** Override the default 3-tab sample (Tab 1 / Connect Records / My Health). */\n tabs?: WebTopNavTab[];\n /** Account trigger label, shown on Desktop. Default \"Account\". */\n accountLabel?: string;\n onAccountClick?: () => void;\n /** Fired when the Mobile hamburger is tapped. */\n onMenuToggle?: () => void;\n className?: string;\n \"aria-label\"?: string;\n};\n\nconst DEFAULT_TABS: WebTopNavTab[] = [\n { label: \"Tab 1\", active: true },\n { label: \"Connect Records\" },\n { label: \"My Health\" },\n];\n\n// ---------------------------------------------------------------------------\n// Stylesheet\n// ---------------------------------------------------------------------------\nconst styles = `\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600&display=swap\");\n\n:root {\n --wtn-background-default: #FEFEFE;\n --wtn-border-default: #DDDDDD;\n --wtn-text-primary: #0E0E0E;\n --wtn-text-secondary: #5E5E5E;\n --wtn-accent-brand: #C20A72;\n --wtn-action-primary: #306AE8;\n}\n\n.eds-wtn {\n display: flex;\n background: var(--wtn-background-default);\n box-shadow: 0 2px 2px rgba(0, 0, 0, 0.08);\n font-family: Nunito, sans-serif;\n color: var(--wtn-text-primary);\n width: 100%;\n box-sizing: border-box;\n}\n.eds-wtn[data-breakpoint=\"Desktop\"] {\n flex-direction: column;\n align-items: stretch;\n /* 20 px breathing room between the logo/account row and the tab bar so\n the two horizontal rules read as distinct strips. */\n gap: 20px;\n}\n.eds-wtn[data-breakpoint=\"Mobile\"] {\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: 12px 16px;\n}\n\n/* ---------- Top row (Desktop) ---------- */\n.eds-wtn__top {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 12px 24px;\n width: 100%;\n box-sizing: border-box;\n}\n.eds-wtn__spacer { flex: 1 0 0; min-width: 0; }\n\n/* ---------- Logo ----------\n The full Embleema wordmark (Type_Wordmark_Color_Blue) rendered at 140×20.\n The SVG is self-coloured (Action/Primary blue baked into each path), so\n the wrapper doesn't need a color value. */\n.eds-wtn__logo {\n display: inline-flex;\n align-items: center;\n height: 20px;\n flex-shrink: 0;\n text-decoration: none;\n}\n.eds-wtn__logo svg { display: block; height: 20px; width: auto; }\n\n/* Account trigger renders via the shared MenuTrigger component, which owns\n its own chrome (8/12 padding, 4 px radius, Background/Selected hover/focus\n fills, 12 × 12 chevron). Nothing to add here. */\n\n/* ---------- Tab bar (Desktop) ---------- */\n.eds-wtn__tabs {\n display: flex;\n gap: 20px;\n align-items: flex-end;\n padding: 0 40px;\n border-bottom: 1px solid var(--wtn-border-default);\n width: 100%;\n box-sizing: border-box;\n background: var(--wtn-background-default);\n}\n.eds-wtn__tab {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 6px;\n padding: 8px 12px 0;\n border: 0;\n background: transparent;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 1.2;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: var(--wtn-text-secondary);\n white-space: nowrap;\n flex-shrink: 0;\n transition: color 120ms ease-out;\n}\n.eds-wtn__tab:hover { color: var(--wtn-text-primary); }\n.eds-wtn__tab:focus-visible {\n outline: 2px solid var(--wtn-action-primary);\n outline-offset: 2px;\n border-radius: 2px;\n}\n.eds-wtn__tab[data-active=\"true\"] {\n font-weight: 600;\n color: var(--wtn-text-primary);\n}\n.eds-wtn__tab-underline {\n height: 2px;\n width: 100%;\n background: transparent;\n}\n.eds-wtn__tab[data-active=\"true\"] .eds-wtn__tab-underline {\n background: var(--wtn-accent-brand);\n}\n\n/* ---------- Hamburger (Mobile) ---------- */\n.eds-wtn__hamburger {\n width: 24px;\n height: 24px;\n border: 0;\n padding: 0;\n background: transparent;\n cursor: pointer;\n color: var(--wtn-action-primary);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n}\n.eds-wtn__hamburger:hover { background: rgba(48, 106, 232, 0.08); }\n.eds-wtn__hamburger:focus-visible {\n outline: 2px solid var(--wtn-action-primary);\n outline-offset: 2px;\n}\n.eds-wtn__hamburger svg { width: 18px; height: 12px; display: block; }\n\n/* =============================================================\n Matrix showcase\n ============================================================= */\n.eds-wtn-matrix {\n font-family: Nunito, sans-serif;\n color: #0E0E0E;\n padding: 24px;\n display: flex;\n flex-direction: column;\n gap: 32px;\n background: #FEFEFE;\n}\n.eds-wtn-matrix__section { display: flex; flex-direction: column; gap: 12px; }\n.eds-wtn-matrix__heading {\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #5E5E5E;\n margin: 0;\n}\n.eds-wtn-matrix__sub { font-size: 12px; color: #5E5E5E; margin: 0; }\n.eds-wtn-matrix__controls { display: inline-flex; gap: 8px; flex-wrap: wrap; }\n.eds-wtn-matrix__chip {\n padding: 6px 14px;\n background: #F8F8F8;\n border: 1px solid #DDDDDD;\n border-radius: 999px;\n cursor: pointer;\n font-family: Nunito, sans-serif;\n font-size: 13px;\n font-weight: 500;\n color: #0E0E0E;\n transition: background-color 120ms;\n}\n.eds-wtn-matrix__chip:hover:not([data-active=\"true\"]) { background: #F1F1F1; }\n.eds-wtn-matrix__chip[data-active=\"true\"] {\n background: #306AE8;\n color: #FEFEFE;\n border-color: #306AE8;\n}\n.eds-wtn-matrix__stage {\n padding: 24px;\n background: #F8F8F8;\n border-radius: 8px;\n display: flex;\n justify-content: center;\n}\n.eds-wtn-matrix__frame {\n background: #FEFEFE;\n border-radius: 4px;\n overflow: hidden;\n transition: width 220ms ease-out;\n}\n.eds-wtn-matrix__frame[data-breakpoint=\"Desktop\"] { width: 100%; max-width: 1280px; }\n.eds-wtn-matrix__frame[data-breakpoint=\"Mobile\"] { width: 390px; max-width: 100%; }\n.eds-wtn-matrix__caption {\n font-size: 11px;\n color: #5E5E5E;\n text-align: center;\n margin: 8px 0 0;\n}\n`;\n\nfunction ensureStyles() {\n if (typeof document === \"undefined\") return;\n let el = document.querySelector<HTMLStyleElement>(\"style[data-eds-web-top-nav]\");\n if (!el) {\n el = document.createElement(\"style\");\n el.setAttribute(\"data-eds-web-top-nav\", \"\");\n document.head.appendChild(el);\n }\n if (el.textContent !== styles) el.textContent = styles;\n}\n\n// ---------------------------------------------------------------------------\n// Icons — small inline SVGs sized to match the Figma slots.\n// ---------------------------------------------------------------------------\nfunction HamburgerIcon() {\n return (\n <svg viewBox=\"0 0 18 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden>\n <path\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n d=\"M1 1h16M1 6h16M1 11h16\"\n />\n </svg>\n );\n}\n\n// Type_Wordmark__Color_Blue.svg — the same Embleema wordmark used by the\n// design-system website's foundation pages. Inlined verbatim so it ships\n// without a separate asset file.\nconst WORDMARK_SVG = `<svg width=\"140\" height=\"20\" viewBox=\"0 0 187 27\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M28.7764 6.66599L29.0842 6.37197C29.6134 5.86642 29.8238 5.52568 29.9433 5.14919C30.0627 4.7727 30.0627 4.38768 29.9433 4.01119C29.8238 3.6347 29.6134 3.29396 29.0842 2.78841L28.8042 2.52088C28.347 2.08416 27.9064 1.82553 27.4486 1.69297C26.9907 1.56041 26.5225 1.56041 26.0647 1.69297C25.6069 1.82553 25.1663 2.08416 24.7091 2.52088L24.4014 2.8149C23.8722 3.32045 23.6617 3.6612 23.5423 4.03769C23.4228 4.41417 23.4228 4.7992 23.5423 5.17569C23.6617 5.55217 23.8722 5.89292 24.4014 6.39847L24.6814 6.66599C25.1385 7.10272 25.5792 7.36134 26.037 7.49391C26.4948 7.62647 26.963 7.62647 27.4208 7.4939C27.8786 7.36134 28.3193 7.10272 28.7764 6.66599Z\" fill=\"#306AE8\"/><path d=\"M8.06503 6.66599L7.75725 6.37197C7.22806 5.86642 7.01764 5.52568 6.89819 5.14919C6.77874 4.7727 6.77874 4.38768 6.89819 4.01119C7.01764 3.6347 7.22806 3.29396 7.75725 2.78841L8.03729 2.52088C8.49444 2.08416 8.93507 1.82553 9.39289 1.69297C9.85071 1.56041 10.3189 1.56041 10.7767 1.69297C11.2345 1.82554 11.6752 2.08416 12.1323 2.52088L12.4401 2.8149C12.9693 3.32045 13.1797 3.6612 13.2992 4.03769C13.4186 4.41417 13.4186 4.7992 13.2992 5.17569C13.1797 5.55217 12.9693 5.89292 12.4401 6.39847L12.1601 6.66599C11.7029 7.10272 11.2623 7.36134 10.8045 7.49391C10.3466 7.62647 9.87844 7.62647 9.42062 7.49391C8.9628 7.36134 8.52218 7.10272 8.06503 6.66599Z\" fill=\"#306AE8\"/><path d=\"M5.36083 11.4287L5.66318 11.1296C6.18306 10.6153 6.38723 10.2711 6.49978 9.89265C6.61233 9.51423 6.6053 9.12926 6.47899 8.75483C6.35268 8.38039 6.13606 8.0432 5.59772 7.54655L5.31284 7.28374C4.84778 6.8547 4.40249 6.60346 3.94232 6.47855C3.48215 6.35364 3.01402 6.36145 2.55869 6.50163C2.10337 6.6418 1.66753 6.90773 1.21843 7.35201L0.916076 7.65112C0.396201 8.16541 0.192035 8.50962 0.0794819 8.88804C-0.0330707 9.26646 -0.0260369 9.65143 0.100271 10.0259C0.22658 10.4003 0.443196 10.7375 0.981543 11.2341L1.26642 11.497C1.73148 11.926 2.17677 12.1772 2.63694 12.3021C3.09711 12.427 3.56524 12.4192 4.02057 12.2791C4.47589 12.1389 4.91173 11.873 5.36083 11.4287Z\" fill=\"#306AE8\"/><path d=\"M31.7562 11.3584L31.4649 11.0494C30.9642 10.5181 30.7727 10.1673 30.674 9.78532C30.5754 9.40338 30.5965 9.01888 30.7364 8.64888C30.8763 8.27888 31.1051 7.94912 31.6613 7.47072L31.9556 7.21757C32.436 6.80429 32.8902 6.56806 33.3547 6.45857C33.8191 6.34907 34.2867 6.37248 34.7366 6.52776C35.1865 6.68303 35.6124 6.96332 36.045 7.42231L36.3362 7.73131C36.837 8.26263 37.0285 8.61343 37.1271 8.99537C37.2258 9.37732 37.2047 9.76181 37.0648 10.1318C36.9249 10.5018 36.6961 10.8316 36.1399 11.31L35.8456 11.5631C35.3651 11.9764 34.911 12.2126 34.4465 12.3221C33.982 12.4316 33.5145 12.4082 33.0646 12.2529C32.6146 12.0977 32.1888 11.8174 31.7562 11.3584Z\" fill=\"#306AE8\"/><path d=\"M14.6179 9.03779L17.8471 12.1228C18.1205 12.3839 18.5588 12.3839 18.8321 12.1228L22.0337 9.06429C22.3102 8.8001 22.3139 8.36821 22.0419 8.09962L22.0337 8.09164L18.8044 5.00662C18.5311 4.74552 18.0927 4.74552 17.8194 5.00662L14.6179 8.06514C14.3413 8.32932 14.3376 8.76122 14.6096 9.02981L14.6179 9.03779Z\" fill=\"#306AE8\"/><path d=\"M19.0138 17.3283L13.1473 11.7095C12.1003 10.7068 10.4028 10.7068 9.35586 11.7095L7.5039 13.4832C6.45699 14.486 6.45699 16.1118 7.50396 17.1146L17.04 26.2479C17.5834 26.7683 18.3019 27.0187 19.0138 26.9989C19.7258 27.0187 20.4443 26.7683 20.9877 26.2479L30.5237 17.1146C31.5707 16.1118 31.5707 14.486 30.5238 13.4832L28.6718 11.7095C27.6249 10.7068 25.9274 10.7068 24.8804 11.7095L19.0138 17.3283Z\" fill=\"#306AE8\"/><path d=\"M53.4231 22.9573C51.902 22.9573 50.5596 22.6372 49.3958 21.9969C48.2423 21.3465 47.3388 20.4217 46.6855 19.2225C46.0424 18.0233 45.7208 16.5955 45.7208 14.939C45.7208 13.3231 46.0117 11.8902 46.5936 10.6402C47.1857 9.38006 48.0381 8.38921 49.1508 7.66767C50.2738 6.94613 51.6264 6.58535 53.2087 6.58535C54.7706 6.58535 56.0824 6.91564 57.1441 7.57621C58.2058 8.23677 59.0123 9.16157 59.5635 10.3506C60.1148 11.5294 60.3904 12.9116 60.3904 14.4969V15.625H49.4418C49.4316 16.5193 49.5745 17.312 49.8705 18.003C50.1666 18.6941 50.6056 19.2378 51.1874 19.6341C51.7693 20.0203 52.489 20.2134 53.3465 20.2134C54.2245 20.2134 54.985 20.0203 55.6281 19.6341C56.2815 19.2378 56.7154 18.6382 56.9297 17.8353H60.3292C60.1454 18.9329 59.7064 19.8628 59.0123 20.625C58.3283 21.3872 57.4912 21.9664 56.501 22.3628C55.521 22.7591 54.495 22.9573 53.4231 22.9573ZM49.4265 13.3231H56.8685C56.8685 12.561 56.7307 11.875 56.455 11.2652C56.1896 10.6453 55.7864 10.1575 55.2453 9.80181C54.7043 9.43596 54.0203 9.25303 53.1934 9.25303C52.3767 9.25303 51.6877 9.4512 51.1262 9.84754C50.5647 10.2439 50.1411 10.7571 49.8552 11.3872C49.5694 12.0071 49.4265 12.6524 49.4265 13.3231Z\" fill=\"#306AE8\"/><path d=\"M63.0324 22.6524V6.89023H66.6615V9.14632C67.1209 8.45527 67.7436 7.85568 68.5296 7.34755C69.3259 6.83942 70.3365 6.58535 71.5616 6.58535C72.123 6.58535 72.6896 6.6819 73.2613 6.87499C73.8432 7.06808 74.3791 7.35263 74.8691 7.72864C75.3693 8.10466 75.7675 8.57214 76.0635 9.13108C76.5637 8.38921 77.2273 7.77946 78.0542 7.30181C78.8913 6.82417 79.8305 6.58535 80.8717 6.58535C81.4434 6.58535 82.0304 6.67682 82.6327 6.85974C83.2452 7.04267 83.8067 7.34755 84.3171 7.77437C84.8275 8.2012 85.241 8.78555 85.5574 9.52742C85.8739 10.2591 86.0321 11.1788 86.0321 12.2866V22.6524H82.3111V12.7286C82.3111 11.9461 82.1733 11.3313 81.8977 10.8841C81.6221 10.437 81.2648 10.1219 80.8258 9.939C80.397 9.74592 79.9377 9.64937 79.4476 9.64937C79.0087 9.64937 78.5493 9.73575 78.0695 9.90852C77.5999 10.0813 77.1967 10.3658 76.8598 10.7622C76.5331 11.1585 76.3698 11.6921 76.3698 12.3628V22.6524H72.6488V12.1341C72.6488 11.5853 72.5059 11.128 72.22 10.7622C71.9342 10.3963 71.5718 10.1219 71.1328 9.939C70.704 9.74592 70.2651 9.64937 69.8159 9.64937C69.3565 9.64937 68.8869 9.74592 68.4071 9.939C67.9375 10.1321 67.5445 10.4268 67.2281 10.8231C66.9116 11.2195 66.7534 11.7327 66.7534 12.3628V22.6524H63.0324Z\" fill=\"#306AE8\"/><path d=\"M97.4811 22.9573C96.6338 22.9573 95.9089 22.8455 95.3066 22.6219C94.7043 22.3983 94.199 22.1087 93.7907 21.753C93.3925 21.3973 93.071 21.0162 92.826 20.6097C92.5912 20.193 92.4125 19.7967 92.29 19.4207L91.8613 22.6524H89.1203V0H92.8566V9.19206C93.0199 8.88718 93.2445 8.5823 93.5304 8.27742C93.8264 7.97255 94.1837 7.69307 94.6023 7.43901C95.0208 7.18495 95.4955 6.98169 96.0264 6.82925C96.5674 6.66665 97.1646 6.58535 97.8179 6.58535C99.7882 6.58535 101.345 7.28149 102.488 8.67376C103.632 10.066 104.203 12.0731 104.203 14.6951C104.203 16.3516 103.948 17.7998 103.438 19.0396C102.938 20.2794 102.187 21.2449 101.187 21.9359C100.197 22.6168 98.9613 22.9573 97.4811 22.9573ZM96.7154 20.2286C97.8281 20.2286 98.7418 19.7865 99.4564 18.9024C100.171 18.0183 100.528 16.5853 100.528 14.6036C100.528 12.876 100.191 11.5701 99.5177 10.686C98.8439 9.79165 97.8945 9.34449 96.6695 9.34449C95.7915 9.34449 95.0719 9.54266 94.5104 9.939C93.9591 10.3353 93.5457 10.9248 93.2701 11.7073C93.0046 12.4898 92.8668 13.4553 92.8566 14.6036C92.8566 16.6158 93.1628 18.0589 93.7754 18.9329C94.3981 19.7967 95.3781 20.2286 96.7154 20.2286Z\" fill=\"#306AE8\"/><path d=\"M111.218 22.8811C110.197 22.8811 109.38 22.754 108.768 22.5C108.155 22.2459 107.696 21.9054 107.39 21.4786C107.083 21.0518 106.884 20.5741 106.792 20.0457C106.701 19.5071 106.655 18.9583 106.655 18.3994V0H110.299V17.9725C110.299 18.6534 110.437 19.1819 110.712 19.5579C110.998 19.9339 111.458 20.1524 112.091 20.2134L112.887 20.2439V22.5762C112.611 22.6575 112.331 22.7286 112.045 22.7896C111.759 22.8506 111.483 22.8811 111.218 22.8811Z\" fill=\"#306AE8\"/><path d=\"M121.616 22.9573C120.095 22.9573 118.753 22.6372 117.589 21.9969C116.436 21.3465 115.532 20.4217 114.879 19.2225C114.236 18.0233 113.914 16.5955 113.914 14.939C113.914 13.3231 114.205 11.8902 114.787 10.6402C115.379 9.38006 116.231 8.38921 117.344 7.66767C118.467 6.94613 119.82 6.58535 121.402 6.58535C122.964 6.58535 124.276 6.91564 125.337 7.57621C126.399 8.23677 127.206 9.16157 127.757 10.3506C128.308 11.5294 128.584 12.9116 128.584 14.4969V15.625H117.635C117.625 16.5193 117.768 17.312 118.064 18.003C118.36 18.6941 118.799 19.2378 119.381 19.6341C119.963 20.0203 120.682 20.2134 121.54 20.2134C122.418 20.2134 123.178 20.0203 123.821 19.6341C124.475 19.2378 124.909 18.6382 125.123 17.8353H128.522C128.339 18.9329 127.9 19.8628 127.206 20.625C126.522 21.3872 125.684 21.9664 124.694 22.3628C123.714 22.7591 122.688 22.9573 121.616 22.9573ZM117.62 13.3231H125.062C125.062 12.561 124.924 11.875 124.648 11.2652C124.383 10.6453 123.98 10.1575 123.439 9.80181C122.898 9.43596 122.214 9.25303 121.387 9.25303C120.57 9.25303 119.881 9.4512 119.319 9.84754C118.758 10.2439 118.334 10.7571 118.049 11.3872C117.763 12.0071 117.62 12.6524 117.62 13.3231Z\" fill=\"#306AE8\"/><path d=\"M138.224 22.9573C136.702 22.9573 135.36 22.6372 134.196 21.9969C133.043 21.3465 132.139 20.4217 131.486 19.2225C130.843 18.0233 130.521 16.5955 130.521 14.939C130.521 13.3231 130.812 11.8902 131.394 10.6402C131.986 9.38006 132.839 8.38921 133.951 7.66767C135.074 6.94613 136.427 6.58535 138.009 6.58535C139.571 6.58535 140.883 6.91564 141.945 7.57621C143.006 8.23677 143.813 9.16157 144.364 10.3506C144.915 11.5294 145.191 12.9116 145.191 14.4969V15.625H134.242C134.232 16.5193 134.375 17.312 134.671 18.003C134.967 18.6941 135.406 19.2378 135.988 19.6341C136.57 20.0203 137.289 20.2134 138.147 20.2134C139.025 20.2134 139.785 20.0203 140.429 19.6341C141.082 19.2378 141.516 18.6382 141.73 17.8353H145.13C144.946 18.9329 144.507 19.8628 143.813 20.625C143.129 21.3872 142.292 21.9664 141.301 22.3628C140.321 22.7591 139.295 22.9573 138.224 22.9573ZM134.227 13.3231H141.669C141.669 12.561 141.531 11.875 141.255 11.2652C140.99 10.6453 140.587 10.1575 140.046 9.80181C139.505 9.43596 138.821 9.25303 137.994 9.25303C137.177 9.25303 136.488 9.4512 135.927 9.84754C135.365 10.2439 134.942 10.7571 134.656 11.3872C134.37 12.0071 134.227 12.6524 134.227 13.3231Z\" fill=\"#306AE8\"/><path d=\"M147.833 22.6524V6.89023H151.462V9.14632C151.921 8.45527 152.544 7.85568 153.33 7.34755C154.126 6.83942 155.137 6.58535 156.362 6.58535C156.923 6.58535 157.49 6.6819 158.062 6.87499C158.644 7.06808 159.18 7.35263 159.67 7.72864C160.17 8.10466 160.568 8.57214 160.864 9.13108C161.364 8.38921 162.028 7.77946 162.855 7.30181C163.692 6.82417 164.631 6.58535 165.672 6.58535C166.244 6.58535 166.831 6.67682 167.433 6.85974C168.046 7.04267 168.607 7.34755 169.118 7.77437C169.628 8.2012 170.041 8.78555 170.358 9.52742C170.674 10.2591 170.833 11.1788 170.833 12.2866V22.6524H167.112V12.7286C167.112 11.9461 166.974 11.3313 166.698 10.8841C166.423 10.437 166.065 10.1219 165.626 9.939C165.197 9.74592 164.738 9.64937 164.248 9.64937C163.809 9.64937 163.35 9.73575 162.87 9.90852C162.4 10.0813 161.997 10.3658 161.66 10.7622C161.334 11.1585 161.17 11.6921 161.17 12.3628V22.6524H157.449V12.1341C157.449 11.5853 157.306 11.128 157.02 10.7622C156.735 10.3963 156.372 10.1219 155.933 9.939C155.505 9.74592 155.066 9.64937 154.616 9.64937C154.157 9.64937 153.687 9.74592 153.208 9.939C152.738 10.1321 152.345 10.4268 152.028 10.8231C151.712 11.2195 151.554 11.7327 151.554 12.3628V22.6524H147.833Z\" fill=\"#306AE8\"/><path d=\"M178.41 22.9573C177.399 22.9573 176.49 22.7743 175.684 22.4085C174.888 22.0325 174.26 21.4989 173.8 20.8079C173.351 20.1067 173.127 19.2581 173.127 18.2622C173.127 16.5244 173.754 15.2134 175.01 14.3292C176.276 13.4451 178.287 12.9827 181.043 12.942L183.417 12.8811V11.814C183.417 10.9807 183.167 10.3303 182.666 9.86279C182.176 9.38514 181.411 9.16157 180.37 9.16157C179.594 9.17173 178.889 9.35466 178.256 9.71035C177.623 10.0559 177.205 10.6402 177.001 11.4634H173.831C173.892 10.3862 174.204 9.48677 174.765 8.76523C175.337 8.03352 176.118 7.48982 177.108 7.13413C178.098 6.76828 179.242 6.58535 180.538 6.58535C182.049 6.58535 183.279 6.78352 184.228 7.17986C185.178 7.5762 185.877 8.15039 186.326 8.90242C186.775 9.64429 187 10.5437 187 11.6006V22.6524H183.861L183.555 19.817C182.993 21.0061 182.273 21.8292 181.396 22.2865C180.528 22.7337 179.532 22.9573 178.41 22.9573ZM179.619 20.442C180.079 20.442 180.533 20.3607 180.982 20.1981C181.431 20.0254 181.834 19.7967 182.192 19.5122C182.559 19.2174 182.85 18.8922 183.065 18.5365C183.289 18.1809 183.407 17.8099 183.417 17.4237V14.939L181.472 14.9695C180.512 14.9796 179.67 15.0813 178.945 15.2744C178.231 15.4674 177.675 15.7774 177.276 16.2042C176.878 16.6209 176.679 17.1798 176.679 17.8811C176.679 18.6839 176.96 19.314 177.521 19.7713C178.083 20.2185 178.782 20.442 179.619 20.442Z\" fill=\"#306AE8\"/></svg>`;\n\nfunction Logo() {\n return (\n <span\n className=\"eds-wtn__logo\"\n role=\"img\"\n aria-label=\"Embleema\"\n dangerouslySetInnerHTML={{ __html: WORDMARK_SVG }}\n />\n );\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\nexport const WebTopNav = React.forwardRef<HTMLElement, WebTopNavProps>(\n function WebTopNav(\n {\n breakpoint = \"Desktop\",\n tabs = DEFAULT_TABS,\n accountLabel = \"Account\",\n onAccountClick,\n onMenuToggle,\n className,\n \"aria-label\": ariaLabel,\n },\n ref\n ) {\n ensureStyles();\n const wrapperClass = \"eds-wtn\" + (className ? ` ${className}` : \"\");\n\n return (\n <nav\n ref={ref}\n className={wrapperClass}\n data-breakpoint={breakpoint}\n aria-label={ariaLabel ?? \"Top navigation\"}\n >\n {breakpoint === \"Desktop\" ? (\n <>\n <div className=\"eds-wtn__top\">\n <Logo />\n <span className=\"eds-wtn__spacer\" aria-hidden />\n <MenuTrigger\n label={accountLabel}\n leadingIcon\n onClick={onAccountClick}\n />\n </div>\n <div className=\"eds-wtn__tabs\" role=\"tablist\">\n {tabs.map((t, i) => (\n <button\n key={`${t.label}-${i}`}\n type=\"button\"\n className=\"eds-wtn__tab\"\n data-active={t.active || undefined}\n role=\"tab\"\n aria-selected={!!t.active}\n onClick={t.onClick}\n >\n <span>{t.label}</span>\n <span className=\"eds-wtn__tab-underline\" aria-hidden />\n </button>\n ))}\n </div>\n </>\n ) : (\n <>\n <Logo />\n <button\n type=\"button\"\n className=\"eds-wtn__hamburger\"\n onClick={onMenuToggle}\n aria-label=\"Open menu\"\n aria-expanded={false}\n >\n <HamburgerIcon />\n </button>\n </>\n )}\n </nav>\n );\n }\n);\n\nexport default WebTopNav;\n\n// ---------------------------------------------------------------------------\n// WebTopNavMatrix — interactive showcase. Lets users toggle between Desktop\n// and Mobile breakpoints and watch the frame resize live.\n// ---------------------------------------------------------------------------\nexport function WebTopNavMatrix() {\n ensureStyles();\n const [breakpoint, setBreakpoint] =\n React.useState<WebTopNavBreakpoint>(\"Desktop\");\n const [activeTab, setActiveTab] = React.useState(0);\n const [accountClicks, setAccountClicks] = React.useState(0);\n const [menuClicks, setMenuClicks] = React.useState(0);\n\n const liveTabs: WebTopNavTab[] = DEFAULT_TABS.map((t, i) => ({\n ...t,\n active: i === activeTab,\n onClick: () => setActiveTab(i),\n }));\n\n return (\n <div className=\"eds-wtn-matrix\">\n <section className=\"eds-wtn-matrix__section\">\n <h3 className=\"eds-wtn-matrix__heading\">Interactive · breakpoint toggle</h3>\n <p className=\"eds-wtn-matrix__sub\">\n Switch the breakpoint to see Desktop (logo + tab bar + Account menu)\n collapse into the Mobile layout (logo + hamburger). Tabs are\n clickable; Account and the hamburger fire callbacks.\n </p>\n <div className=\"eds-wtn-matrix__controls\" aria-label=\"Breakpoint\">\n {([\"Desktop\", \"Mobile\"] as WebTopNavBreakpoint[]).map((b) => (\n <button\n key={b}\n type=\"button\"\n className=\"eds-wtn-matrix__chip\"\n data-active={breakpoint === b || undefined}\n onClick={() => setBreakpoint(b)}\n >\n {b}\n </button>\n ))}\n </div>\n <div className=\"eds-wtn-matrix__stage\">\n <div className=\"eds-wtn-matrix__frame\" data-breakpoint={breakpoint}>\n <WebTopNav\n breakpoint={breakpoint}\n tabs={liveTabs}\n onAccountClick={() => setAccountClicks((n) => n + 1)}\n onMenuToggle={() => setMenuClicks((n) => n + 1)}\n />\n </div>\n </div>\n <p className=\"eds-wtn-matrix__caption\">\n Frame width: {breakpoint === \"Desktop\" ? \"fluid up to 1280 px\" : \"390 px\"}\n {\" · \"}Active tab: <strong>{DEFAULT_TABS[activeTab].label}</strong>\n {\" · \"}Account opens: <strong>{accountClicks}</strong>\n {\" · \"}Menu opens: <strong>{menuClicks}</strong>\n </p>\n </section>\n\n <section className=\"eds-wtn-matrix__section\">\n <h3 className=\"eds-wtn-matrix__heading\">Both breakpoints (static)</h3>\n <p className=\"eds-wtn-matrix__sub\">\n Default content rendered at each breakpoint, side by side for visual\n QA.\n </p>\n <div className=\"eds-wtn-matrix__stage\" style={{ flexDirection: \"column\", gap: 16 }}>\n <div className=\"eds-wtn-matrix__frame\" data-breakpoint=\"Desktop\">\n <WebTopNav breakpoint=\"Desktop\" />\n </div>\n <div className=\"eds-wtn-matrix__frame\" data-breakpoint=\"Mobile\">\n <WebTopNav breakpoint=\"Mobile\" />\n </div>\n </div>\n </section>\n </div>\n );\n}\n"],"names":["idCounter","useGeneratedId","prefix","provided","id","React","styles","ensureStyles","el","PlusIcon","jsx","MinusIcon","Accordion","label","children","open","defaultOpen","onToggle","className","ref","isControlled","internal","setInternal","isOpen","baseId","headerId","contentId","toggle","next","wrapperClass","jsxs","FAQ_ITEMS","Fragment","LOREM","AccordionMatrix","openCount","setOpenCount","item","n","Button","variant","kind","size","disabled","leadingIcon","trailingIcon","onClick","type","ariaLabel","cls","VARIANTS","KINDS","SIZES","IconAdd","IconArrowRight","ButtonMatrix","renderRow","v","CheckIcon","InfoIcon","AIIcon","WarningIcon","CloseCircleIcon","CloseGlyph","ICON_BY_TYPE","Alert","title","message","closeButton","actionButton","actionLabel","onActionClick","onClose","visible","defaultVisible","internalVisible","setInternalVisible","Icon","handleClose","TYPES","MESSAGE_BY_TYPE","AlertMatrix","resetKey","setResetKey","k","AlertGlyph","defaultAriaLabel","Badge","icon","finalAriaLabel","BadgeMatrix","s","t","Field","state","validation","appearance","inlineButton","placeholder","value","defaultValue","onChange","readOnly","name","effectiveState","isDisabled","isReadOnly","STATES","VALIDATIONS","IconSearch","IconClose","FieldMatrix","DEFAULT_LABEL","DEFAULT_HELPER","LEFT_LABEL_WIDTH","ScanIcon","generateBars","out","seed","i","widths","w","filled","mapFieldState","Barcode","style","labelPosition","helperText","required","onScan","current","handleInputChange","e","handleScan","labelText","helperContent","fieldEl","scanButton","labelEl","helperEl","previewEl","b","BarcodeMatrix","scanned","setScanned","pending","setPending","states","st","RadioGlyph","checked","Radio","selected","defaultSelected","providedId","handleChange","StateRow","forced","groupName","RadioMatrix","picked","setPicked","DashIcon","Checkbox","indeterminate","forwardedRef","internalSelected","setInternalSelected","inputRef","setRefs","node","MatrixRow","showLabel","stateProp","labelProp","CheckboxMatrix","DefaultLeadingIcon","renderLeading","stateSelected","stateLocked","stateDisabled","SelectorOption","radio","checkbox","forcedSel","locked","isError","handleClick","handleKey","indicatorEl","dataSelected","role","SelectorOptionMatrix","a","setA","setB","c","setC","DEFAULT_ERROR_HELPER","CloseCircleGlyph","Boolean_","direction","yesLabel","noLabel","yesValue","noValue","select","yesSelected","noSelected","optionState","renderOption","val","text","optionId","BooleanMatrix","v1","setV1","v2","setV2","directions","dir","HomeIcon","ClockIcon","ChevronRightIcon","SettingsCogIcon","DEFAULT_TASK_ACTION","renderTaskButton","action","leading","showIcon","iconNode","_a","TaskCard","header","body","color","headerIcon","timeEstimate","time","primaryAction","secondaryAction","NavigationCard","image","renderContentButton","ContentCard","tertiary","logo","tertiaryText","cornerDecoration","cornerIcon","divider","logoNode","cornerIconNode","CalendarIcon","SurveyCard","tagLabel","timeFrame","counter","primaryLabel","onStartClick","TASK_COLORS","CardsMatrix","taskClicks","setTaskClicks","contentClicks","setContentClicks","contentLogo","setContentLogo","contentTertiary","setContentTertiary","contentCorner","setContentCorner","contentDivider","setContentDivider","contentSecondary","setContentSecondary","PlaceholderIcon","Chip","dismissible","onDismiss","visibleControlled","isVisible","selectedControlled","handleToggle","handleKeyDown","handleDismiss","ALL_STATES","ChipMatrix","key","prev","tags","setTags","opt","x","MONTH_NAMES","MONTH_NAMES_SHORT","DAY_HEADERS","CalendarMonth","ChevronLeft","ChevronRight","ChevronDown","CheckGlyph","WarningGlyph","ErrorGlyph","SuccessGlyph","pad2","formatMMDDYYYY","d","formatToday","parseMMDDYYYY","m","mm","dd","yyyy","isSameDay","buildCalendarCells","year","month","firstDow","start","getHelperGlyph","DatePicker","onPick","onCancel","onClear","initial","view","setView","setYear","setMonth","draft","setDraft","today","cells","yearListStart","years","_","prevMonth","nextMonth","prevYear","y","nextYear","pickDay","pickMonth","pickYear","handleOk","renderHeader","renderCalendar","cell","isSelected","isToday","dataType","renderMonthList","renderYearList","DateField","onTodayClick","setOpen","wrapperRef","onDown","onKey","commit","fillToday","handleCalendarClick","o","calendarButton","DateFieldMatrix","validations","Selector","tooltip","tooltipText","handleRowClick","input","ariaSelected","tabIndex","SelectorMatrix","pickedPlain","setPickedPlain","pickedCheck","setPickedCheck","togglePick","pickedRadio","setPickedRadio","DropdownIcon","SearchIcon","ChipCloseIcon","valueToSet","DropdownMenu","filteredOptions","highlightedIndex","onHighlight","onSelect","showNoResults","listboxId","listRef","selectorType","option","isHighlighted","Dropdown","options","search","searchPlaceholder","onOpenChange","searchEnabled","openControlled","internalOpen","setInternalOpen","valueControlled","setSelected","query","setQuery","q","setHighlightedIndex","firstSelected","triggerRef","menuRef","fieldInputRef","isSearching","onDocMouseDown","handleSelect","moveHighlight","delta","attempts","wrapped","onTriggerKeyDown","inputFocused","displayValue","effectiveFieldState","effectiveWrapperState","targetEl","isChevronClick","isInputClick","_b","_c","_d","SAMPLE_OPTIONS","SHORT_OPTIONS","DropdownMatrix","single","setSingle","multi","setMulti","LockIcon","HUMAN_LABEL","StatusBadge","StatusBadgeMatrix","SyncGlyph","FormStatusChip","effectiveAria","FormStatusChipMatrix","saving","setSaving","ArrowDown","ArrowUp","useTooltipId","Tooltip","position","titleText","bodyText","arrow","dataOpen","cardEl","arrowEl","VARIANTS_TOP","VARIANTS_BOTTOM","VariantCard","caption","triggerLabel","TooltipMatrix","Label","tooltipTitle","htmlFor","infoSlot","LabelMatrix","sizes","ArrowBack","ArrowForward","renderIconSlot","fallback","Link","href","target","rel","ForcedLink","LinkMatrix","DOT_COUNT","VIEW_BOX_SIZE","CENTER","RING_RADIUS","DOT_RADIUS","MIN_OPACITY","DOTS","angleRad","cx","cy","opacity","Spinner","STYLES","SpinnerMatrix","Loading","layout","LAYOUTS","LoadingMatrix","l","TextField","helperId","HELPER_BY_VALIDATION","TextFieldMatrix","TextArea","characterCounter","maxLength","rows","resize","internalValue","setInternalValue","currentLength","overLimit","footerEl","TextAreaMatrix","liveValue","setLiveValue","MED_NAME_OPTIONS","FREQUENCY_OPTIONS","REASON_OPTIONS","MenuVertIcon","DeleteIcon","MedicationCard","medicationName","dosage","unit","frequency","startDate","endDate","reasonForChange","comments","onRemove","med","setMed","dos","setDos","un","setUn","freq","setFreq","sd","setSd","ed","setEd","reason","setReason","com","setCom","DateFieldComponent","MedicationCardMatrix","setSize","setState","DEFAULT_SHORTCUT","MenuItem","trailingText","shortcut","isActive","MI_STATES","SAMPLE_LABEL","SAMPLE_SHORTCUT","MenuItemMatrix","setLeadingIcon","setTrailingText","setLabelText","PersonIcon","ChevronIcon","MenuTrigger","ariaControls","MT_STATES","MenuTriggerMatrix","liveOpen","setLiveOpen","MenuDropdown","items","activeValue","onItemClick","minWidth","ariaLabelledBy","demoStyles","ensureDemoStyles","DEMO_ITEMS","MenuComposedDemo","active","setActive","triggerHover","setTriggerHover","popoverRef","onDocClick","root","triggerState","activeLabel","MenuDropdownMatrix","CloseIcon","CheckCircleIcon","AlertIcon","Overlay","STATUS_ICON","ModalPanel","onPrimaryClick","secondaryLabel","onSecondaryClick","secondaryButton","bodyId","Modal","props","FEATURE_LABEL","ModalNavigationPanel","featureIcon","titleId","ModalNavigation","ModalSurveyPanel","prompt","textInput","textInputLabel","textInputPlaceholder","promptId","setText","ModalSurvey","MODAL_TYPES","NAV_TYPES","MODAL_COPY","NAV_COPY","SURVEY_OPTIONS","ModalsMatrix","HealthIcon","StudiesIcon","TokensIcon","ProfileIcon","DEFAULT_ITEMS","NativeBottomNav","NativeBottomNavMatrix","it","DEFAULT_HEADING","VALUE_LABEL","DEFAULT_UNITS","ValueCell","generatedId","inputId","ObjectGroupField","heading","onValueChange","feetValue","defaultFeetValue","onFeetChange","inchesValue","defaultInchesValue","onInchesChange","defaultUnit","onUnitChange","unitOptions","currentValue","setValue","feetControlled","internalFeet","setInternalFeet","currentFeet","setFeet","inchesControlled","internalInches","setInternalInches","currentInches","setInches","unitControlled","internalUnit","setInternalUnit","currentUnit","setUnit","heading_","opts","labelBase","ObjectGroupFieldMatrix","setDirection","weight","setWeight","weightUnit","setWeightUnit","feet","inches","heightUnit","setHeightUnit","temp","setTemp","tempUnit","setTempUnit","PendingAccountIcon","gradId","OnboardingIcon","ParticipatingIcon","NotParticipatingIcon","StudyCompleteIcon","IneligibleIcon","ParticipantActivityStatus","status","uid","iconEl","STATUSES","STATUS_HINT","ParticipantActivityStatusMatrix","cellClass","clamp","ProgressBar","progress","STOPS","ProgressBarMatrix","sz","stop","Scrim","zIndex","ScrimMatrix","Chevron","SectionHeader","defaultState","onStateChange","internalState","setInternalState","isExpanded","headerButton","SectionHeaderMatrix","isMultiValue","normalizeValue","selectionType","optionValue","childState","groupState","SelectorOptionGroup","isLocked","handleOptionChange","nextSelected","arr","groupRole","optionsEl","forcedState","SelectorOptionGroupMatrix","min","max","snap","step","pctOf","SliderBar","ticks","isRange","dragging","setDragging","trackRef","xToValue","clientX","trackEl","rect","pct","onMove","lo","hi","onUp","startDrag","which","handleTrackPointerDown","incr","visualState","formatLabel","renderThumb","showTicks","SliderBarMatrix","setD","setR","setS","rv","defaultFor","SliderField","scaleLabels","interactionLocked","handleSliderChange","handleFieldInput","sliderBarType","formatVal","singleValue","rangeValue","fieldsEl","SliderFieldMatrix","Snackbar","duration","messageEl","actionEl","closeEl","nextQueueId","SnackbarMatrix","queue","setQueue","withAction","setWithAction","stacked","setStacked","push","dismiss","StatusMessage","SAMPLE_BY_TYPE","StatusMessageMatrix","FIGMA_GLYPHS","CIRCLE_STATUSES","StudyProgressSymbol","isButton","ariaText","commonProps","inner","StudyProgressSymbolMatrix","statuses","TabItem","dataState","TabBar","TAB_STATES","TAB_TYPES","TabMatrix","primaryValue","setPrimaryValue","secondaryValue","setSecondaryValue","activeType","setActiveType","setLive","ChevronDownIcon","ChevronLeftIcon","ArrowDropDownIcon","defaultCellValue","row","defaultCompare","av","bv","nextDirection","Table","columns","selectable","selectedIds","defaultSelectedIds","onSelectionChange","sort","onSortChange","showActions","onAction","onActionMenu","showRowChevron","onRowNavigate","page","pageSize","totalCount","onPageChange","paginationLabel","internalSort","setInternalSort","sortState","handleSort","nextDir","setSelection","sortedRows","col","cmp","sorted","total","pageStart","visibleRows","firstShown","lastShown","visibleIds","r","allSelected","rid","someSelected","selectAllRef","toggleAll","sid","merged","toggleRow","isSel","maxPage","DEMO_ROWS","DEMO_COLUMNS","TableMatrix","setPage","actionLog","setActionLog","pageRows","InfoGlyph","Tag","LABEL_BY_TYPE","TagMatrix","TaskStatusIcon","TaskStatusIconMatrix","LABEL_BY_STATUS","ICON_BY_STATUS","AISparkleIcon","gradientId","fill","TaskStatus","ai","iconState","a11y","TaskStatusMatrix","parseTime","h","mer","formatField","p","hh","fieldDisplay","HOURS","MINUTES","TimeOverlay","onOk","hourRef","minuteRef","scrollTo","idx","TimePicker","parsed","meridiem","setMeridiem","inputBuf","setInputBuf","display","bufDigits","displayDigits","formatTyping","raw","hoursRaw","minutesRaw","digits","hours","minutes","handleInputBlur","padHours","padMinutes","canonical","handleMeridiemSelect","clockButton","ampmToggle","TimePickerMatrix","Toggle","ToggleMatrix","live","DEFAULT_INSTRUCTIONS","DEFAULT_FILE_FORMAT","FileIcon","formatBytes","Upload","instructions","fileFormat","accept","multiple","file","defaultFile","onFileChange","internalFile","setInternalFile","dragOver","setDragOver","focused","setFocused","computed","openBrowser","handleNativeChange","f","handleDragOver","handleDragLeave","handleDrop","renderEmpty","renderHasFile","hasFile","zoneClass","UploadMatrix","fakeFile","DEFAULT_TABS","HamburgerIcon","WORDMARK_SVG","Logo","WebTopNav","breakpoint","tabs","accountLabel","onAccountClick","onMenuToggle","WebTopNavMatrix","setBreakpoint","activeTab","setActiveTab","accountClicks","setAccountClicks","menuClicks","setMenuClicks","liveTabs"],"mappings":"saA0CA,IAAIA,GAAY,EAChB,SAASC,GAAeC,EAAgBC,EAAmB,CACzD,KAAM,CAACC,CAAE,EAAIC,EAAM,SAAS,IAAMF,GAAY,GAAGD,CAAM,IAAI,EAAEF,EAAS,EAAE,EACxE,OAAOI,CACT,CAKA,MAAME,GAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgIf,SAASC,IAAe,CACtB,GAAI,OAAO,SAAa,IAAa,OACrC,IAAIC,EAAK,SAAS,cAAgC,2BAA2B,EACxEA,IACHA,EAAK,SAAS,cAAc,OAAO,EACnCA,EAAG,aAAa,qBAAsB,EAAE,EACxC,SAAS,KAAK,YAAYA,CAAE,GAE1BA,EAAG,cAAgBF,KAAQE,EAAG,YAAcF,GAClD,CASA,SAASG,IAAW,CAClB,OACEC,EAAAA,IAAC,MAAA,CAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,oBAAoB,gBAAgB,cAAW,GACrH,SAAAA,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,+0DAAA,CAAA,EAEN,CAEJ,CAEA,SAASC,IAAY,CACnB,OACED,EAAAA,IAAC,MAAA,CAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,oBAAoB,gBAAgB,cAAW,GACrH,SAAAA,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,q7CAAA,CAAA,EAEN,CAEJ,CAKO,MAAME,GAAYP,EAAM,WAC7B,SACE,CAAE,MAAAQ,EAAO,SAAAC,EAAU,KAAAC,EAAM,YAAAC,EAAc,GAAO,SAAAC,EAAU,GAAAb,EAAI,UAAAc,CAAA,EAC5DC,EACA,CACAZ,GAAA,EAEA,MAAMa,EAAeL,IAAS,OACxB,CAACM,EAAUC,CAAW,EAAIjB,EAAM,SAAkBW,CAAW,EAC7DO,EAASH,EAAe,CAAC,CAACL,EAAOM,EAEjCG,EAASvB,GAAe,UAAWG,CAAE,EACrCqB,EAAW,GAAGD,CAAM,UACpBE,EAAY,GAAGF,CAAM,WAErBG,EAAS,IAAM,CACnB,MAAMC,EAAO,CAACL,EACTH,GAAcE,EAAYM,CAAI,EACnCX,GAAA,MAAAA,EAAWW,EACb,EAEMC,EAAe,WAAaX,EAAY,IAAIA,CAAS,GAAK,IAEhE,OACEY,OAAC,OAAI,IAAAX,EAAU,GAAIK,EAAQ,UAAWK,EAAc,YAAWN,GAAU,OACvE,SAAA,CAAAO,EAAAA,KAAC,SAAA,CACC,KAAK,SACL,GAAIL,EACJ,UAAU,kBACV,gBAAeF,EACf,gBAAeG,EACf,QAASC,EAET,SAAA,CAAAjB,EAAAA,IAAC,OAAA,CAAK,UAAU,iBAAkB,SAAAG,EAAM,EACxCH,EAAAA,IAAC,OAAA,CAAK,UAAU,gBAAgB,cAAW,GACxC,SAAAa,EAASb,EAAAA,IAACC,GAAA,CAAA,CAAU,EAAKD,EAAAA,IAACD,GAAA,CAAA,CAAS,CAAA,CACtC,CAAA,CAAA,CAAA,EAEDc,GACCb,EAAAA,IAAC,MAAA,CACC,GAAIgB,EACJ,UAAU,mBACV,KAAK,SACL,kBAAiBD,EAEhB,SAAAX,CAAA,CAAA,CACH,EAEJ,CAEJ,CACF,EASMiB,GAA2D,CAC/D,CACE,MAAO,yBACP,QACED,EAAAA,KAAAE,WAAA,CACE,SAAA,CAAAtB,EAAAA,IAAC,KAAE,SAAA,4PAAA,CAKH,EACAA,EAAAA,IAAC,KAAE,SAAA,oGAAA,CAGH,CAAA,CAAA,CACF,CAAA,EAGJ,CACE,MAAO,kDACP,QACEA,EAAAA,IAAC,IAAA,CAAE,SAAA,qMAAA,CAIH,CAAA,EAGJ,CACE,MAAO,0CACP,QACEA,EAAAA,IAAC,IAAA,CAAE,SAAA,uOAAA,CAKH,CAAA,CAGN,EAEMuB,GAAQ;AAAA;AAAA,iKAIP,SAASC,IAAkB,CAChC3B,GAAA,EACA,KAAM,CAAC4B,EAAWC,CAAY,EAAI/B,EAAM,SAAS,CAAC,EAElD,OACEyB,EAAAA,KAAC,MAAA,CAAI,UAAU,iBACb,SAAA,CAAAA,EAAAA,KAAC,UAAA,CAAQ,UAAU,0BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,0BAA0B,SAAA,yBAAsB,EAC9DA,EAAAA,IAAC,IAAA,CAAE,UAAU,sBAAsB,SAAA,+LAInC,EACAA,EAAAA,IAAC,MAAA,CAAI,UAAU,wBACb,SAAAA,EAAAA,IAAC,MAAA,CAAI,UAAU,uBACZ,SAAAqB,GAAU,IAAI,CAACM,EAAM,IACpB3B,EAAAA,IAACE,GAAA,CAEC,MAAOyB,EAAK,MACZ,YAAa,IAAM,EACnB,SAAWtB,GACTqB,EAAcE,GAAMA,GAAKvB,EAAO,EAAI,GAAG,EAGxC,SAAAsB,EAAK,OAAA,EAPD,CAAA,CASR,EACH,CAAA,CACF,EACAP,EAAAA,KAAC,IAAA,CAAE,UAAU,0BAA0B,SAAA,CAAA,oCACJpB,EAAAA,IAAC,UAAQ,SAAAyB,CAAA,CAAU,CAAA,CAAA,CACtD,CAAA,EACF,EAEAL,EAAAA,KAAC,UAAA,CAAQ,UAAU,0BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,0BAA0B,SAAA,mCAAgC,EACxEA,EAAAA,IAAC,IAAA,CAAE,UAAU,sBAAsB,SAAA,6KAInC,EACAoB,EAAAA,KAAC,MAAA,CAAI,UAAU,wBACb,SAAA,CAAApB,EAAAA,IAACE,GAAA,CAAU,MAAM,cAAc,YAAa,GAC1C,SAAAF,EAAAA,IAAC,IAAA,CAAG,YAAM,CAAA,CACZ,EACAA,EAAAA,IAACE,IAAU,MAAM,cAAc,YAAW,GACxC,SAAAF,EAAAA,IAAC,IAAA,CAAG,SAAAuB,EAAA,CAAM,CAAA,CACZ,CAAA,CAAA,CACF,CAAA,CAAA,CACF,CAAA,EACF,CAEJ,CC3UA,MAAM3B,GAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAuQf,SAASC,IAAe,CACtB,GAAI,OAAO,SAAa,IAAa,OACrC,IAAIC,EAAK,SAAS,cAAgC,wBAAwB,EACrEA,IACHA,EAAK,SAAS,cAAc,OAAO,EACnCA,EAAG,aAAa,kBAAmB,EAAE,EACrC,SAAS,KAAK,YAAYA,CAAE,GAE1BA,EAAG,cAAgBF,KACrBE,EAAG,YAAcF,GAErB,CAKO,MAAMiC,GAASlC,EAAM,WAC1B,SACE,CACE,QAAAmC,EAAU,UACV,KAAAC,EAAO,SACP,KAAAC,EAAO,SACP,SAAAC,EAAW,GACX,YAAAC,EACA,aAAAC,EACA,SAAA/B,EACA,QAAAgC,EACA,KAAAC,EAAO,SACP,UAAA7B,EACA,aAAc8B,CAAA,EAEhB7B,EACA,CACAZ,GAAA,EACA,MAAM0C,EAAM,WAAa/B,EAAY,IAAIA,CAAS,GAAK,IAEvD,OACEY,EAAAA,KAAC,SAAA,CACC,IAAAX,EACA,KAAA4B,EACA,UAAWE,EACX,eAAcT,EACd,YAAWC,EACX,YAAWC,EACX,SAAAC,EACA,QAAAG,EACA,aAAYE,EAEX,SAAA,CAAAJ,SACE,OAAA,CAAK,UAAU,gBAAgB,cAAW,GACxC,SAAAA,EACH,EAED9B,GAAY,MAAQJ,EAAAA,IAAC,OAAA,CAAM,SAAAI,CAAA,CAAS,EACpC+B,GACCnC,EAAAA,IAAC,OAAA,CAAK,UAAU,gBAAgB,cAAW,GACxC,SAAAmC,CAAA,CACH,CAAA,CAAA,CAAA,CAIR,CACF,EASMK,GAA4B,CAAC,UAAW,cAAe,SAAS,EAChEC,GAAsB,CAAC,SAAU,WAAY,MAAM,EACnDC,GAAsB,CAAC,QAAS,SAAU,OAAO,EAYhD,SAASC,IAAU,CACxB,aACG,MAAA,CAAI,QAAQ,YAAY,KAAK,eAAe,MAAM,6BAA6B,cAAW,GACzF,SAAA3C,MAAC,IAAA,CAAE,UAAU,iBACX,SAAAA,EAAAA,IAAC,QAAK,EAAE,2kBAA2kB,EACrlB,CAAA,CACF,CAEJ,CAEO,SAAS4C,IAAiB,CAC/B,aACG,MAAA,CAAI,QAAQ,YAAY,KAAK,eAAe,MAAM,6BAA6B,cAAW,GACzF,SAAA5C,MAAC,IAAA,CAAE,UAAU,iBACX,SAAAA,EAAAA,IAAC,QAAK,EAAE,0pBAA0pB,EACpqB,CAAA,CACF,CAEJ,CAEO,SAAS6C,IAAe,CAC7BhD,GAAA,EAEA,MAAMiD,EAAahB,GACjBV,EAAAA,KAAAE,EAAAA,SAAA,CACE,SAAA,CAAAF,EAAAA,KAAC,IAAA,CAAE,UAAU,0BAA2B,SAAA,CAAAU,EAAQ,YAAA,EAAU,EACzDY,GAAM,IAAKV,GACVhC,EAAAA,IAAC,MAAA,CAAiC,UAAU,sBACzC,SAAAyC,GAAM,IAAKV,GACVX,EAAAA,KAACS,GAAA,CAEC,QAAAC,EACA,KAAAC,EACA,KAAAC,EACA,kBAAcW,GAAA,EAAQ,EACtB,mBAAeC,GAAA,EAAe,EAE7B,SAAA,CAAAb,EAAK,IAAEC,CAAA,CAAA,EAPHD,CAAA,CASR,CAAA,EAZO,GAAGD,CAAO,IAAIE,CAAI,IAa5B,CACD,EACDZ,EAAAA,KAAC,IAAA,CAAE,UAAU,0BAA2B,SAAA,CAAAU,EAAQ,aAAA,EAAW,EAC1DY,GAAM,IAAKV,GACVhC,EAAAA,IAAC,MAAA,CAAiC,UAAU,sBACzC,SAAAyC,GAAM,IAAKV,GACVX,OAACS,GAAA,CAAkB,QAAAC,EAAkB,KAAAC,EAAY,KAAAC,EAAY,SAAQ,GAClE,SAAA,CAAAD,EAAK,IAAEC,CAAA,GADGD,CAEb,CACD,GALO,GAAGD,CAAO,IAAIE,CAAI,IAM5B,CACD,CAAA,EACH,EAGF,OACEZ,EAAAA,KAAC,MAAA,CAAI,UAAU,iBACZ,SAAA,CAAAoB,GAAS,OAAQO,GAAMA,IAAM,SAAS,EAAE,IAAKjB,GAC5C9B,EAAAA,IAAC,WAAsB,UAAU,0BAC9B,WAAU8B,CAAO,CAAA,EADNA,CAEd,CACD,EAGD9B,EAAAA,IAAC,UAAA,CAAQ,UAAU,0BACjB,SAAAA,EAAAA,IAAC,MAAA,CAAI,UAAU,0BAA2B,SAAA8C,EAAU,SAAS,CAAA,CAAE,CAAA,CACjE,CAAA,EACF,CAEJ,CCzZA,MAAMlD,GAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAsKf,SAASC,IAAe,CACtB,GAAI,OAAO,SAAa,IAAa,OACrC,IAAIC,EAAK,SAAS,cAAgC,uBAAuB,EACpEA,IACHA,EAAK,SAAS,cAAc,OAAO,EACnCA,EAAG,aAAa,iBAAkB,EAAE,EACpC,SAAS,KAAK,YAAYA,CAAE,GAE1BA,EAAG,cAAgBF,KAAQE,EAAG,YAAcF,GAClD,CAaA,SAASoD,IAAY,CACnB,OACEhD,EAAAA,IAAC,MAAA,CAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,cAAW,GACjF,SAAAA,MAAC,IAAA,CAAE,UAAU,iBACX,SAAAA,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,kkBAAA,CAAA,EAEN,CAAA,CACF,CAEJ,CACA,SAASiD,IAAW,CAClB,OACEjD,EAAAA,IAAC,MAAA,CAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,cAAW,GACjF,SAAAA,MAAC,IAAA,CAAE,UAAU,sBACX,SAAAA,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,g1DAAA,CAAA,EAEN,CAAA,CACF,CAEJ,CACA,SAASkD,IAAS,CAGhB,OACE9B,OAAC,OAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,cAAW,GACjF,SAAA,CAAApB,EAAAA,IAAC,OAAA,CACC,SAAAoB,EAAAA,KAAC,iBAAA,CAAe,GAAG,oBAAoB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAC7D,SAAA,CAAApB,EAAAA,IAAC,OAAA,CAAK,OAAO,KAAK,UAAU,UAAU,EACtCA,EAAAA,IAAC,OAAA,CAAK,OAAO,MAAM,UAAU,SAAA,CAAU,CAAA,CAAA,CACzC,CAAA,CACF,EACAoB,EAAAA,KAAC,IAAA,CAAE,UAAU,sBACX,SAAA,CAAApB,EAAAA,IAAC,OAAA,CACC,KAAK,0BACL,EAAE,8gBAAA,CAAA,EAEJA,EAAAA,IAAC,OAAA,CACC,KAAK,0BACL,EAAE,iiBAAA,CAAA,EAEJA,EAAAA,IAAC,OAAA,CACC,KAAK,0BACL,EAAE,ihBAAA,CAAA,CACJ,CAAA,CACF,CAAA,EACF,CAEJ,CACA,SAASmD,IAAc,CACrB,OACEnD,EAAAA,IAAC,MAAA,CAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,cAAW,GACjF,SAAAA,MAAC,IAAA,CAAE,UAAU,iBACX,SAAAA,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,m2DAAA,CAAA,EAEN,CAAA,CACF,CAEJ,CACA,SAASoD,IAAkB,CACzB,OACEpD,EAAAA,IAAC,MAAA,CAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,cAAW,GACjF,SAAAA,MAAC,IAAA,CAAE,UAAU,sBACX,SAAAA,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,o7DAAA,CAAA,EAEN,CAAA,CACF,CAEJ,CACA,SAASqD,IAAa,CACpB,aACG,MAAA,CAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,eAAe,MAAM,6BAA6B,cAAW,GAChH,eAAC,OAAA,CAAK,EAAE,gHAAgH,EAC1H,CAEJ,CAEA,MAAMC,GAAuD,CAC3D,QAASN,GACT,YAAaC,GACb,GAAIC,GACJ,QAASC,GACT,MAAOC,EACT,EAKaG,GAAQ5D,EAAM,WACzB,SACE,CACE,KAAA0C,EAAO,cACP,MAAAmB,EACA,QAAAC,EACA,SAAArD,EACA,YAAAsD,EAAc,GACd,aAAAC,EAAe,GACf,YAAAC,EAAc,OACd,cAAAC,EACA,QAAAC,EACA,QAAAC,EACA,eAAAC,EAAiB,GACjB,UAAAxD,EACA,aAAc8B,CAAA,EAEhB7B,EACA,CACAZ,GAAA,EAEA,MAAMa,EAAeqD,IAAY,OAC3B,CAACE,EAAiBC,CAAkB,EAAIvE,EAAM,SAASqE,CAAc,EAG3E,GAAI,EAFctD,EAAe,CAAC,CAACqD,EAAUE,GAE7B,OAAO,KAEvB,MAAME,EAAOb,GAAajB,CAAI,EACxBlB,EAAe,aAAeX,EAAY,IAAIA,CAAS,GAAK,IAE5D4D,EAAc,IAAM,CACnB1D,GAAcwD,EAAmB,EAAK,EAC3CJ,GAAA,MAAAA,GACF,EAEA,OACE1C,EAAAA,KAAC,MAAA,CACC,IAAAX,EACA,UAAWU,EACX,YAAWkB,EACX,KAAK,QACL,aAAYC,GAAa,GAAGD,CAAI,SAEhC,SAAA,CAAArC,EAAAA,IAAC,QAAK,UAAU,kBAAkB,cAAW,GAC3C,SAAAA,EAAAA,IAACmE,IAAK,CAAA,CACR,EACA/C,EAAAA,KAAC,MAAA,CAAI,UAAU,kBACZ,SAAA,CAAAoC,GAASxD,EAAAA,IAAC,OAAA,CAAK,UAAU,mBAAoB,SAAAwD,EAAM,EACnDpD,IAAaqD,EAAUzD,MAAC,OAAA,CAAM,WAAQ,EAAU,KAAA,EACnD,EACC2D,GACC3D,EAAAA,IAAC6B,GAAA,CACC,QAAQ,UACR,KAAK,SACL,KAAK,QACL,QAASgC,EACT,UAAU,wBAET,SAAAD,CAAA,CAAA,EAGJF,GACC1D,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,mBACV,QAASoE,EACT,aAAW,gBAEX,eAACf,GAAA,CAAA,CAAW,CAAA,CAAA,CACd,CAAA,CAAA,CAIR,CACF,EAOMgB,GAAqB,CACzB,UACA,cACA,KACA,UACA,OACF,EAEMC,GAA6C,CACjD,QAAS,2BACT,YACE,uFACF,GAAI,2EACJ,QAAS,oEACT,MAAO,qDACT,EAEO,SAASC,IAAc,CAC5B1E,GAAA,EACA,KAAM,CAAC2E,EAAUC,CAAW,EAAI9E,EAAM,SAAS,CAAC,EAEhD,OACEyB,EAAAA,KAAC,MAAA,CAAI,UAAU,mBACb,SAAA,CAAAA,EAAAA,KAAC,UAAA,CAAQ,UAAU,4BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,4BAA4B,SAAA,4BAAyB,EACnEA,EAAAA,IAAC,IAAA,CAAE,UAAU,wBAAwB,SAAA,qEAErC,EACAA,EAAAA,IAACuD,GAAA,CAEC,KAAK,cACL,MAAM,UACN,QAAQ,6EAAA,EAHHiB,CAAA,EAKPxE,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,4BACV,QAAS,IAAMyE,EAAaC,GAAMA,EAAI,CAAC,EACxC,SAAA,eAAA,CAAA,CAED,EACF,EAEAtD,EAAAA,KAAC,UAAA,CAAQ,UAAU,4BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,4BAA4B,SAAA,6BAA0B,QACnE,MAAA,CAAI,UAAU,yBACZ,SAAAqE,GAAM,IAAKhC,GACVrC,EAAAA,IAACuD,GAAA,CAEC,KAAAlB,EACA,MAAOA,EACP,QAASiC,GAAgBjC,CAAI,EAC7B,aAAY,GACZ,YAAY,OACZ,cAAe,IAAM,CAErB,EACA,QAAO,GACP,QAAS,IAAM,CAEf,CAAA,EAZKA,CAAA,CAcR,CAAA,CACH,CAAA,EACF,EAEAjB,EAAAA,KAAC,UAAA,CAAQ,UAAU,4BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,4BAA4B,SAAA,kBAAe,EACzDA,EAAAA,IAAC,IAAA,CAAE,UAAU,wBAAwB,SAAA,gDAA6C,QACjFuD,GAAA,CAAM,KAAK,UAAU,QAAQ,cAAc,QAAO,GAAC,EACpDvD,EAAAA,IAACuD,GAAA,CACC,KAAK,UACL,QAAQ,kBACR,aAAY,GACZ,YAAY,OACZ,QAAO,EAAA,CAAA,EAETvD,EAAAA,IAACuD,GAAA,CACC,KAAK,QACL,QAAQ,yBACR,YAAa,GACb,aAAY,GACZ,YAAY,QACZ,QAAO,EAAA,CAAA,EAETvD,EAAAA,IAACuD,GAAA,CACC,KAAK,KACL,QAAQ,8CACR,YAAa,GACb,QAAO,EAAA,CAAA,CACT,CAAA,CACF,CAAA,EACF,CAEJ,CCzcA,MAAM3D,GAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiJf,SAASC,IAAe,CACtB,GAAI,OAAO,SAAa,IAAa,OACrC,IAAIC,EAAK,SAAS,cAAgC,uBAAuB,EACpEA,IACHA,EAAK,SAAS,cAAc,OAAO,EACnCA,EAAG,aAAa,iBAAkB,EAAE,EACpC,SAAS,KAAK,YAAYA,CAAE,GAE1BA,EAAG,cAAgBF,KAAQE,EAAG,YAAcF,GAClD,CAOA,SAAS+E,IAAa,CACpB,OACE3E,EAAAA,IAAC,MAAA,CAAI,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA6B,cAAW,GACjF,SAAAA,MAAC,IAAA,CAAE,UAAU,iBACX,SAAAA,EAAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,m2DAAA,CAAA,EAEN,CAAA,CACF,CAEJ,CAEA,SAAS4E,GAAiB5C,EAAiBK,EAAiBlC,EAAyB,CACnF,OAAI6B,IAAS,QAAgB,GAAG7B,GAAS,EAAE,iBACvC6B,IAAS,OAAe,GAAGK,CAAI,SAC5B,GAAGA,CAAI,YAChB,CAKO,MAAMwC,GAAQlF,EAAM,WACzB,SACE,CACE,KAAAqC,EAAO,MACP,KAAAK,EAAO,UACP,MAAAlC,EACA,KAAA2E,EACA,GAAApF,EACA,UAAAc,EACA,aAAc8B,CAAA,EAEhB7B,EACA,CACAZ,GAAA,EAEA,MAAMsB,EAAe,aAAeX,EAAY,IAAIA,CAAS,GAAK,IAC5DuE,EAAiBzC,GAAasC,GAAiB5C,EAAMK,EAAMlC,CAAK,EAEtE,OACEiB,EAAAA,KAAC,OAAA,CACC,IAAAX,EACA,GAAAf,EACA,UAAWyB,EACX,YAAWa,EACX,YAAWK,EACX,KAAK,SACL,aAAY0C,EAEX,SAAA,CAAA/C,IAAS,SAAWhC,MAAC,OAAA,CAAM,SAAAG,GAAS,IAAI,EACxC6B,IAAS,QACRhC,EAAAA,IAAC,OAAA,CAAK,UAAU,kBAAkB,cAAW,GAC1C,SAAA8E,GAAQ9E,EAAAA,IAAC2E,GAAA,CAAA,CAAW,CAAA,CACvB,CAAA,CAAA,CAAA,CAIR,CACF,EAOMN,GAAqB,CACzB,UACA,QACA,UACA,UACA,SACF,EACM3B,GAAqB,CAAC,MAAO,QAAS,MAAM,EAE3C,SAASsC,IAAc,CAC5BnF,OAAAA,GAAA,EAGEuB,EAAAA,KAAC,MAAA,CAAI,UAAU,mBACb,SAAA,CAAAA,EAAAA,KAAC,UAAA,CAAQ,UAAU,4BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,4BAA4B,SAAA,cAAW,EACrDA,EAAAA,IAAC,IAAA,CAAE,UAAU,wBAAwB,SAAA,oJAIrC,EACAoB,EAAAA,KAAC,MAAA,CAAI,UAAU,yBACb,SAAA,CAAApB,EAAAA,IAAC,MAAA,CAAI,UAAU,sDAAsD,SAAA,OAErE,EACCqE,GAAM,IAAK,GACVrE,EAAAA,IAAC,MAAA,CAEC,UAAU,sDAET,SAAA,CAAA,EAHI,CAAA,CAKR,EACA0C,GAAM,IAAKuC,GACV7D,EAAAA,KAACzB,EAAM,SAAN,CACC,SAAA,CAAAK,EAAAA,IAAC,MAAA,CAAI,UAAU,sDACZ,SAAAiF,EACH,EACCZ,GAAM,IAAKa,GACVlF,EAAAA,IAAC,OAAsB,UAAU,yBAC/B,SAAAA,EAAAA,IAAC6E,GAAA,CAAM,KAAMI,EAAG,KAAMC,EAAG,MAAOD,IAAM,QAAU,EAAI,OAAW,CAAA,EADvD,GAAGA,CAAC,IAAIC,CAAC,EAEnB,CACD,CAAA,CAAA,EARkBD,CASrB,CACD,CAAA,CAAA,CACH,CAAA,EACF,EAEA7D,EAAAA,KAAC,UAAA,CAAQ,UAAU,4BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,4BAA4B,SAAA,qBAAkB,EAC5DA,EAAAA,IAAC,IAAA,CAAE,UAAU,wBAAwB,SAAA,uIAGrC,EACAA,EAAAA,IAAC,MAAA,CAAI,UAAU,wBACZ,SAAA,CAAC,EAAG,EAAG,EAAG,KAAM,KAAM,IAAI,EAAE,IAAK4B,GAChC5B,EAAAA,IAAC6E,GAAA,CAAsB,KAAK,QAAQ,KAAK,UAAU,MAAOjD,CAAA,EAA9C,OAAOA,CAAC,CAAyC,CAC9D,CAAA,CACH,CAAA,EACF,EAEAR,EAAAA,KAAC,UAAA,CAAQ,UAAU,4BACjB,SAAA,CAAApB,EAAAA,IAAC,KAAA,CAAG,UAAU,4BAA4B,SAAA,uBAAoB,EAC9DoB,EAAAA,KAAC,IAAA,CAAE,UAAU,wBAAwB,SAAA,CAAA,kHAESpB,EAAAA,IAAC,QAAK,SAAA,UAAA,CAAQ,EAAQ,IAAI,YAC7DA,EAAAA,IAAC,QAAK,SAAA,oBAAA,CAAkB,EAAO,WAAA,EAC1C,EACAoB,EAAAA,KAAC,MAAA,CAAI,UAAU,wBACZ,SAAA,CAAAiD,GAAM,IAAK,GACVjD,OAAC,QAAa,UAAU,2BAA2B,aAAW,QAC5D,SAAA,CAAApB,EAAAA,IAAC,OAAA,CAAK,cAAW,GAAC,SAAA,IAAC,EACnBA,EAAAA,IAAC6E,GAAA,CAAM,KAAK,MAAM,KAAM,CAAA,CAAG,CAAA,CAAA,EAFlB,CAGX,CACD,EACAR,GAAM,IAAK,UACT,OAAA,CAAoB,UAAU,2BAA2B,aAAW,QACnE,SAAA,CAAArE,EAAAA,IAAC,OAAA,CAAK,cAAW,GAAC,SAAA,IAAC,QAClB6E,GAAA,CAAM,KAAK,QAAQ,KAAM,EAAG,MAAO,CAAA,CAAG,CAAA,CAAA,EAF9B,KAAK,CAAC,EAGjB,CACD,EACAR,GAAM,IAAK,UACT,OAAA,CAAoB,UAAU,2BAA2B,aAAW,QACnE,SAAA,CAAArE,EAAAA,IAAC,OAAA,CAAK,cAAW,GAAC,SAAA,IAAC,EACnBA,EAAAA,IAAC6E,GAAA,CAAM,KAAK,OAAO,KAAM,CAAA,CAAG,CAAA,CAAA,EAFnB,KAAK,CAAC,EAGjB,CACD,CAAA,CAAA,CACH,CAAA,CAAA,CACF,CAAA,EACF,CAEJ,CC1TA,MAAMjF,GAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;A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AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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A;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAA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AA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA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AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;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"}