@knpkv/rly 0.13.0 → 0.15.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 (51) hide show
  1. package/README.md +73 -1
  2. package/dist/{Dialog-B9Ub_gMT.js → Dialog-CU66FqWD.js} +325 -257
  3. package/dist/Dialog-CU66FqWD.js.map +1 -0
  4. package/dist/{PortalProvider-CN_81Fy3.js → PortalProvider-op07u8na.js} +20 -18
  5. package/dist/PortalProvider-op07u8na.js.map +1 -0
  6. package/dist/assets/relay-mark.svg +9 -0
  7. package/dist/components.css +1 -1
  8. package/dist/dts/foundations/Icon.d.ts +1 -1
  9. package/dist/dts/foundations/Icon.d.ts.map +1 -1
  10. package/dist/dts/internal/composedFocus.d.ts +11 -0
  11. package/dist/dts/internal/composedFocus.d.ts.map +1 -0
  12. package/dist/dts/internal/relaySummon.d.ts +50 -0
  13. package/dist/dts/internal/relaySummon.d.ts.map +1 -0
  14. package/dist/dts/patterns/Region.d.ts +2 -2
  15. package/dist/dts/patterns/Region.d.ts.map +1 -1
  16. package/dist/dts/patterns/RelayComposer.d.ts +65 -0
  17. package/dist/dts/patterns/RelayComposer.d.ts.map +1 -0
  18. package/dist/dts/patterns/RelayDock.d.ts.map +1 -1
  19. package/dist/dts/patterns/RelayLauncher.d.ts +67 -0
  20. package/dist/dts/patterns/RelayLauncher.d.ts.map +1 -0
  21. package/dist/dts/patterns/RelayMark.d.ts +35 -0
  22. package/dist/dts/patterns/RelayMark.d.ts.map +1 -0
  23. package/dist/dts/patterns/RelayPanel.d.ts +91 -0
  24. package/dist/dts/patterns/RelayPanel.d.ts.map +1 -0
  25. package/dist/dts/patterns/index.d.ts +8 -0
  26. package/dist/dts/patterns/index.d.ts.map +1 -1
  27. package/dist/dts/tokens/fonts.d.ts +13 -0
  28. package/dist/dts/tokens/fonts.d.ts.map +1 -0
  29. package/dist/dts/tokens/index.d.ts +2 -0
  30. package/dist/dts/tokens/index.d.ts.map +1 -1
  31. package/dist/fonts.css +83 -2
  32. package/dist/foundations/index.js +1 -1
  33. package/dist/generated-tokens.css +2 -2
  34. package/dist/index.js +6 -6
  35. package/dist/patterns/index.js +2 -2
  36. package/dist/{patterns-DPd5YlSW.js → patterns-CDBnXTUD.js} +1258 -756
  37. package/dist/patterns-CDBnXTUD.js.map +1 -0
  38. package/dist/primitives/index.js +3 -3
  39. package/dist/{primitives-Bd6WhE78.js → primitives-DgQybTyq.js} +254 -322
  40. package/dist/primitives-DgQybTyq.js.map +1 -0
  41. package/dist/tokens/index.js +2 -2
  42. package/dist/{tokens-B075JP3Z.js → tokens-Cf0jXIRg.js} +14 -8
  43. package/dist/tokens-Cf0jXIRg.js.map +1 -0
  44. package/package.json +2 -1
  45. package/registry/components.json +373 -0
  46. package/registry/search.json +88 -0
  47. package/dist/Dialog-B9Ub_gMT.js.map +0 -1
  48. package/dist/PortalProvider-CN_81Fy3.js.map +0 -1
  49. package/dist/patterns-DPd5YlSW.js.map +0 -1
  50. package/dist/primitives-Bd6WhE78.js.map +0 -1
  51. package/dist/tokens-B075JP3Z.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Dialog-CU66FqWD.js","names":["Predicate.isBoolean","Predicate.isObjectOrArray","layer","trigger","overlay","content","header","title","description","body","style","styles","Predicate.isString","RadixDialog","Predicate.isFunction","root","primary","secondary","quiet","dense","content","compact","defaultSize","principal","label","style","styles","Predicate.isNumber","Predicate.isString","root","neutral","positive","critical","caution","progress","compact","defaultSize","style","styles","toneIcons","root","defaultSize","large","circle","style","styles","Avatar","RadixAvatar","root","dense","compact","defaultSize","style","styles","trigger","dense","compact","defaultSize","content","style","styles","RadixSelect","Select","root","style","styles","root","content","title","description","style","styles","root","description","defaultSize","style","styles","Predicate.isString","Predicate.isFunction","Predicate.isObjectOrArray","defaultSize","style","styles","Tabs","RadixTabs","styles","Predicate.isFunction","RadixDialog","Dialog","Icon","isBoolean","isObjectOrArray","isString","cssClass","isFunction","defineVariants","isNumber","classNames","inertRecords","scrollLockRecords","ModalNestingContext","createContext","focusTransitionGeneration","useModalEntryMotion","committedCycleRef","useRef","requested","resolved","open","useLayoutEffect","hasHTMLElementInertContract","element","isHTMLElement","ModalNestingBoundary","isContentMounted","setContentMounted","useState","createElement","children","useParentModalReady","useContext","useParentModalPresent","useModalContentRegistration","retainInert","record","releaseInert","useModalIsolation","isOpen","layer","layerRef","retained","observedParents","MutationObserverConstructor","observer","synchronizeIsolation","current","parent","hasReachedCurrent","sibling","parentElement","host","retainScrollLock","ownerDocument","root","releaseScrollLock","useModalScrollLock","invalidateModalFocusRestore","restoreModalFocusAfterCleanup","generation","target","Sheet_module_default","style$10","name","RLY_SHEET_VARIANTS","RLY_SHEET_DEFAULT_VARIANTS","SheetStateContext","useSheetState","state","SheetLayer","entryMotion","requireVisibleAction","value","requireText","component","Sheet","props","className","Dialog","type","resolvedEntryMotion","visibleTitle","title","visibleDescription","description","accessibleCloseLabel","closeLabel","contentRef","setContentRef","useCallback","node","ref","PortalBoundary","side","event","activeElement","initialFocusRef","tabIndex","componentProps","defaultState","setDefaultState","defaultOpen","isParentModalReady","restoreFocusRef","resolvedOpen","previousOpenRef","requestOpenChange","nextOpen","onOpenChange","onClick","Button_module_default","style$9","RLY_BUTTON_VARIANTS","RLY_BUTTON_DEFAULT_VARIANTS","Button","ariaLabel","ariaLabelledBy","loading","variant","size","stretch","disabled","leadingIcon","trailingIcon","StateLabel_module_default","style$8","RLY_STATE_LABEL_VARIANTS","RLY_STATE_LABEL_DEFAULT_VARIANTS","toneIcons$1","StateLabel","tone","icon","label","Avatar_module_default","style$7","RLY_AVATAR_VARIANTS","RLY_AVATAR_DEFAULT_VARIANTS","Avatar$1","accessibleLabel","decorative","visibleFallback","fallback","Avatar","form","src","IconButton_module_default","style$6","RLY_ICON_BUTTON_VARIANTS","RLY_ICON_BUTTON_DEFAULT_VARIANTS","IconButton","registeredFieldControls","registerFieldControl","isRegisteredFieldControl","Select_module_default","style$5","RLY_SELECT_VARIANTS","RLY_SELECT_DEFAULT_VARIANTS","validateOptions","options","option","values","Select$1","valueControlled","ariaDescribedBy","ariaErrorMessage","ariaInvalid","ariaRequired","visiblePlaceholder","placeholder","selectedValue","defaultValue","selectedOption","selectedLabel","Select","autoComplete","onValueChange","required","Skeleton_module_default","style$4","RLY_SKELETON_VARIANTS","RLY_SKELETON_DEFAULT_VARIANTS","Skeleton","inlineStyle","dimensions","height","width","StatePanel_module_default","style$3","RLY_STATE_PANEL_VARIANTS","RLY_STATE_PANEL_DEFAULT_VARIANTS","toneIcons","StatePanel","role","announce","glyph","action","Field_module_default","style$2","semanticControlKeys","concreteControlElements","RLY_FIELD_VARIANTS","RLY_FIELD_DEFAULT_VARIANTS","Field","generatedId","useId","resolvedControlId","controlId","labelId","descriptionId","errorId","error","commonControlProps","id","controlProps","control","controlType","key","Tabs_module_default","style$1","RLY_TABS_VARIANTS","RLY_TABS_DEFAULT_VARIANTS","validateItems","items","firstEnabled","item","Tabs$1","selectedItem","selectionProps","directionProps","direction","Tabs","Dialog_module_default","style","DialogStateContext","useDialogState","assignRef","getActiveElement","RLY_DIALOG_VARIANTS","RLY_DIALOG_DEFAULT_VARIANTS","DialogLayer","Dialog$1","triggerRef","restoreTargetRef"],"sources":["../src/internal/modal.ts","../src/primitives/Sheet.module.css","../src/primitives/Sheet.tsx","../src/primitives/Button.module.css","../src/primitives/Button.tsx","../src/primitives/StateLabel.module.css","../src/primitives/StateLabel.tsx","../src/primitives/Avatar.module.css","../src/primitives/Avatar.tsx","../src/primitives/IconButton.module.css","../src/primitives/IconButton.tsx","../src/internal/field-control.ts","../src/primitives/Select.module.css","../src/primitives/Select.tsx","../src/primitives/Skeleton.module.css","../src/primitives/Skeleton.tsx","../src/primitives/StatePanel.module.css","../src/primitives/StatePanel.tsx","../src/primitives/Field.module.css","../src/primitives/Field.tsx","../src/primitives/Tabs.module.css","../src/primitives/Tabs.tsx","../src/primitives/Dialog.module.css","../src/primitives/Dialog.tsx"],"sourcesContent":["import {\n createContext,\n createElement,\n type ReactElement,\n type ReactNode,\n type RefObject,\n useContext,\n useLayoutEffect,\n useRef,\n useState\n} from \"react\"\nimport * as Predicate from \"./predicates.js\"\n\ninterface InertRecord {\n count: number\n readonly previous: boolean\n}\n\ninterface ScrollLockRecord {\n count: number\n readonly overflow: string\n readonly overscrollBehavior: string\n}\n\ninterface ModalNestingState {\n readonly isContentMounted: boolean\n readonly setContentMounted: (isMounted: boolean) => void\n}\n\ninterface ModalNestingBoundaryProps {\n readonly children: ReactNode\n}\n\nconst inertRecords = new WeakMap<HTMLElement, InertRecord>()\nconst scrollLockRecords = new WeakMap<Document, ScrollLockRecord>()\nconst ModalNestingContext = createContext<ModalNestingState | null>(null)\nlet focusTransitionGeneration = 0\n\n/** Entry-motion ownership sampled once for each closed-to-open modal cycle. */\nexport type ModalEntryMotion = \"external\" | \"intrinsic\"\n\n/** Keep entry ownership stable while a modal is open, then resample it for the next open cycle. */\nexport const useModalEntryMotion = (open: boolean, requested: ModalEntryMotion): ModalEntryMotion => {\n const committedCycleRef = useRef({ open, value: requested })\n const resolved = open && !committedCycleRef.current.open ? requested : committedCycleRef.current.value\n useLayoutEffect(() => {\n if (!open) committedCycleRef.current = { open: false, value: requested }\n else if (!committedCycleRef.current.open) committedCycleRef.current = { open: true, value: requested }\n }, [open, requested])\n return resolved\n}\n\nconst hasHTMLElementInertContract = <Value extends object>(element: Value): element is Value & HTMLElement =>\n \"inert\" in element && Predicate.isBoolean(element.inert)\n\n/** Narrows DOM elements through the HTML-only inert contract without relying on a realm-specific constructor. */\nexport const isHTMLElement = (element: Element | null): element is HTMLElement =>\n element !== null && hasHTMLElementInertContract(element)\n\n/** Stages nested default-open or controlled overlays until their parent content is mounted. */\nexport const ModalNestingBoundary = ({ children }: ModalNestingBoundaryProps): ReactElement => {\n const [isContentMounted, setContentMounted] = useState(false)\n return createElement(ModalNestingContext.Provider, { value: { isContentMounted, setContentMounted } }, children)\n}\n\n/** Reports whether a logical parent modal is ready to host a nested overlay. */\nexport const useParentModalReady = (): boolean => useContext(ModalNestingContext)?.isContentMounted ?? true\n\n/** Reports whether this component belongs to a logical parent modal. */\nexport const useParentModalPresent = (): boolean => useContext(ModalNestingContext) !== null\n\n/** Registers the current portal content so deeper overlays mount in logical stack order. */\nexport const useModalContentRegistration = (): void => {\n const setContentMounted = useContext(ModalNestingContext)?.setContentMounted\n useLayoutEffect(() => {\n setContentMounted?.(true)\n return () => setContentMounted?.(false)\n }, [setContentMounted])\n}\n\nconst retainInert = (element: HTMLElement): void => {\n const record = inertRecords.get(element)\n if (record === undefined) {\n inertRecords.set(element, { count: 1, previous: element.inert })\n element.inert = true\n return\n }\n record.count += 1\n}\n\nconst releaseInert = (element: HTMLElement): void => {\n const record = inertRecords.get(element)\n if (record === undefined) return\n if (record.count > 1) {\n record.count -= 1\n return\n }\n element.inert = record.previous\n inertRecords.delete(element)\n}\n\n/** Shares reference-counted background isolation across every rly modal primitive. */\nexport const useModalIsolation = (layerRef: RefObject<HTMLDivElement | null>, isOpen: boolean): void => {\n useLayoutEffect(() => {\n if (!isOpen) return\n const layer = layerRef.current\n if (layer === null) return\n const retained = new Set<HTMLElement>()\n const observedParents = new Set<Node>()\n const MutationObserverConstructor = layer.ownerDocument.defaultView?.MutationObserver\n let observer: MutationObserver | null = null\n\n const synchronizeIsolation = (): void => {\n let current: Element = layer\n while (true) {\n if (current === current.ownerDocument.body) break\n const parent = current.parentNode\n if (parent === null) break\n if (!observedParents.has(parent)) {\n observer?.observe(parent, { childList: true })\n observedParents.add(parent)\n }\n let hasReachedCurrent = false\n for (const sibling of parent.children) {\n if (sibling === current) {\n hasReachedCurrent = true\n continue\n }\n const isLaterModalLayer = hasReachedCurrent && sibling.hasAttribute(\"data-rly-modal-layer\")\n if (!isLaterModalLayer && isHTMLElement(sibling) && !retained.has(sibling)) {\n retainInert(sibling)\n retained.add(sibling)\n }\n }\n const parentElement = current.parentElement\n if (parentElement !== null) {\n current = parentElement\n continue\n }\n if (!(\"host\" in parent)) break\n const host = parent.host\n if (!Predicate.isObjectOrArray(host) || !hasHTMLElementInertContract(host)) break\n current = host\n }\n }\n\n if (MutationObserverConstructor !== undefined) observer = new MutationObserverConstructor(synchronizeIsolation)\n synchronizeIsolation()\n\n return () => {\n observer?.disconnect()\n for (const element of retained) releaseInert(element)\n }\n }, [isOpen, layerRef])\n}\n\nconst retainScrollLock = (ownerDocument: Document): void => {\n const record = scrollLockRecords.get(ownerDocument)\n if (record !== undefined) {\n record.count += 1\n return\n }\n const root = ownerDocument.documentElement\n scrollLockRecords.set(ownerDocument, {\n count: 1,\n overflow: root.style.overflow,\n overscrollBehavior: root.style.overscrollBehavior\n })\n root.style.overflow = \"hidden\"\n root.style.overscrollBehavior = \"none\"\n}\n\nconst releaseScrollLock = (ownerDocument: Document): void => {\n const record = scrollLockRecords.get(ownerDocument)\n if (record === undefined) return\n if (record.count > 1) {\n record.count -= 1\n return\n }\n const root = ownerDocument.documentElement\n root.style.overflow = record.overflow\n root.style.overscrollBehavior = record.overscrollBehavior\n scrollLockRecords.delete(ownerDocument)\n}\n\n/** Shares a reference-counted document scroll lock across custom rly modal surfaces. */\nexport const useModalScrollLock = (layerRef: RefObject<HTMLDivElement | null>, isOpen: boolean): void => {\n useLayoutEffect(() => {\n if (!isOpen) return\n const ownerDocument = layerRef.current?.ownerDocument\n if (ownerDocument === undefined) return\n retainScrollLock(ownerDocument)\n return () => releaseScrollLock(ownerDocument)\n }, [isOpen, layerRef])\n}\n\n/** Invalidates an older deferred restoration whenever a newer modal transition starts. */\nexport const invalidateModalFocusRestore = (): void => {\n focusTransitionGeneration += 1\n}\n\n/** Restores focus only after modal cleanup and only while this remains the newest transition. */\nexport const restoreModalFocusAfterCleanup = (target: HTMLElement | null): void => {\n const generation = ++focusTransitionGeneration\n setTimeout(() => {\n if (focusTransitionGeneration === generation && target !== null && target.isConnected === true) target.focus()\n }, 0)\n}\n","@layer rly.components {\n .layer {\n inset: var(--rly-space-0);\n isolation: isolate;\n pointer-events: none;\n position: fixed;\n z-index: 100;\n }\n\n .trigger,\n .close,\n .iconClose {\n align-items: center;\n appearance: none;\n background: var(--rly-color-surface-1);\n border: 1px solid var(--rly-color-border-2);\n color: var(--rly-color-text-1);\n cursor: pointer;\n display: inline-flex;\n font: var(--rly-type-label-weight) var(--rly-type-label-size) / var(--rly-type-label-line-height)\n var(--rly-type-label-font);\n justify-content: center;\n }\n\n .trigger,\n .close {\n border-radius: var(--rly-radius-field);\n min-block-size: var(--rly-space-40);\n padding: var(--rly-space-8) var(--rly-space-16);\n }\n\n .trigger:hover,\n .close:hover,\n .iconClose:hover {\n background: var(--rly-color-surface-2);\n }\n\n .trigger:active,\n .close:active,\n .iconClose:active {\n background: var(--rly-color-surface-3);\n }\n\n .trigger:disabled,\n .close:disabled,\n .iconClose:disabled {\n cursor: not-allowed;\n opacity: 0.58;\n }\n\n .overlay {\n animation: rly-sheet-overlay-out var(--rly-motion-standard-duration) var(--rly-motion-standard-easing);\n background: var(--rly-color-text-1);\n inset: var(--rly-space-0);\n opacity: 0.3;\n position: fixed;\n pointer-events: auto;\n z-index: 0;\n }\n\n .overlay[data-state=\"open\"] {\n animation-name: rly-sheet-overlay-in;\n }\n\n .content {\n background: var(--rly-color-surface-1);\n block-size: 100vh;\n block-size: 100dvh;\n color: var(--rly-color-text-1);\n display: flex;\n flex-direction: column;\n inset-block: var(--rly-space-0);\n max-inline-size: min(92vw, 30rem);\n overflow: hidden;\n pointer-events: auto;\n position: fixed;\n z-index: 1;\n }\n\n .end {\n animation: rly-sheet-end-out var(--rly-motion-standard-duration) var(--rly-motion-standard-easing);\n border-inline-start: 1px solid var(--rly-color-border-1);\n border-start-start-radius: var(--rly-radius-overlay);\n border-end-start-radius: var(--rly-radius-overlay);\n inset-inline-end: var(--rly-space-0);\n }\n\n .end[data-state=\"open\"] {\n animation-name: rly-sheet-end-in;\n }\n\n .start {\n animation: rly-sheet-start-out var(--rly-motion-standard-duration) var(--rly-motion-standard-easing);\n border-inline-end: 1px solid var(--rly-color-border-1);\n border-start-end-radius: var(--rly-radius-overlay);\n border-end-end-radius: var(--rly-radius-overlay);\n inset-inline-start: var(--rly-space-0);\n }\n\n .start[data-state=\"open\"] {\n animation-name: rly-sheet-start-in;\n }\n\n .layer[data-rly-sheet-entry-motion=\"external\"] .overlay[data-state=\"open\"],\n .layer[data-rly-sheet-entry-motion=\"external\"] .content[data-state=\"open\"] {\n animation: none;\n }\n\n .header {\n align-items: flex-start;\n border-block-end: 1px solid var(--rly-color-border-1);\n display: flex;\n flex: none;\n gap: var(--rly-space-16);\n justify-content: space-between;\n padding: var(--rly-space-20) var(--rly-space-24);\n }\n\n .heading {\n display: grid;\n gap: var(--rly-space-6);\n min-inline-size: var(--rly-space-0);\n }\n\n .title {\n font: var(--rly-type-card-title-weight) var(--rly-type-card-title-size) / var(--rly-type-card-title-line-height)\n var(--rly-type-card-title-font);\n letter-spacing: var(--rly-type-card-title-tracking);\n margin: var(--rly-space-0);\n overflow-wrap: break-word;\n }\n\n .description {\n color: var(--rly-color-text-2);\n font: var(--rly-type-body-weight) var(--rly-type-body-size) / var(--rly-type-body-line-height)\n var(--rly-type-body-font);\n margin: var(--rly-space-0);\n overflow-wrap: break-word;\n }\n\n .iconClose {\n border-radius: var(--rly-radius-field);\n flex: none;\n min-block-size: var(--rly-space-40);\n min-inline-size: var(--rly-space-40);\n padding: var(--rly-space-8);\n }\n\n .body {\n flex: 1 1 auto;\n min-block-size: var(--rly-space-0);\n min-inline-size: var(--rly-space-0);\n overflow: auto;\n overscroll-behavior: contain;\n padding: var(--rly-space-24);\n }\n\n .footer {\n align-items: center;\n border-block-start: 1px solid var(--rly-color-border-1);\n display: flex;\n flex: none;\n flex-wrap: wrap;\n gap: var(--rly-space-12);\n justify-content: flex-end;\n padding: var(--rly-space-16) var(--rly-space-24);\n }\n\n @media (max-width: 40rem) {\n .content {\n border: 0;\n border-radius: var(--rly-space-0);\n inline-size: 100vw;\n max-inline-size: none;\n }\n\n .header,\n .body {\n padding-inline: var(--rly-space-16);\n }\n\n .footer {\n padding: var(--rly-space-12) var(--rly-space-16);\n }\n }\n}\n\n@keyframes rly-sheet-overlay-in {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 0.3;\n }\n}\n\n@keyframes rly-sheet-overlay-out {\n from {\n opacity: 0.3;\n }\n\n to {\n opacity: 0;\n }\n}\n\n@keyframes rly-sheet-end-in {\n from {\n transform: translateX(100%);\n }\n\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes rly-sheet-end-out {\n from {\n transform: translateX(0);\n }\n\n to {\n transform: translateX(100%);\n }\n}\n\n@keyframes rly-sheet-start-in {\n from {\n transform: translateX(-100%);\n }\n\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes rly-sheet-start-out {\n from {\n transform: translateX(0);\n }\n\n to {\n transform: translateX(-100%);\n }\n}\n","import { Dialog as RadixDialog } from \"radix-ui\"\nimport {\n type ComponentPropsWithRef,\n createContext,\n type ReactElement,\n type ReactNode,\n type RefObject,\n useCallback,\n useContext,\n useLayoutEffect,\n useRef,\n useState\n} from \"react\"\nimport { Icon } from \"../foundations/Icon.js\"\nimport { PortalBoundary } from \"../foundations/PortalProvider.js\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport {\n invalidateModalFocusRestore,\n isHTMLElement,\n ModalNestingBoundary,\n restoreModalFocusAfterCleanup,\n useModalContentRegistration,\n useModalEntryMotion,\n useModalIsolation,\n useParentModalReady\n} from \"../internal/modal.js\"\nimport styles from \"./Sheet.module.css\"\nimport * as Predicate from \"../internal/predicates.js\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\n/** Semantic logical-side metadata for the sheet surface. */\nexport const RLY_SHEET_VARIANTS = defineVariants({\n side: {\n end: {\n className: style(\"end\"),\n purpose: \"Supporting detail that follows the current reading flow\",\n tokens: [\"color-surface-1\", \"radius-overlay\", \"motion-standard\"]\n },\n start: {\n className: style(\"start\"),\n purpose: \"Navigation or context that precedes the current reading flow\",\n tokens: [\"color-surface-1\", \"radius-overlay\", \"motion-standard\"]\n }\n }\n})\n\n/** Default logical edge used when no sheet side is selected. */\nexport const RLY_SHEET_DEFAULT_VARIANTS = defineVariants({ side: \"end\" })\n/** Logical inline edges supported by a sheet. */\nexport type RlySheetSide = keyof typeof RLY_SHEET_VARIANTS.side\n\ninterface SheetRootBaseProps {\n readonly children: ReactNode\n}\n\ntype ControlledSheetRootProps = SheetRootBaseProps & {\n readonly defaultOpen?: never\n readonly onOpenChange: (open: boolean) => void\n readonly open: boolean\n}\n\ntype DefaultSheetRootProps = SheetRootBaseProps & {\n readonly defaultOpen?: boolean\n readonly onOpenChange?: (open: boolean) => void\n readonly open?: never\n}\n\n/** Controlled-first or locally owned state for a sheet tree. */\nexport type SheetRootProps = ControlledSheetRootProps | DefaultSheetRootProps\n\n/** Props for the visible native button that opens a sheet. */\nexport type SheetTriggerProps = Omit<ComponentPropsWithRef<\"button\">, \"children\"> & {\n /** Visible text that identifies the panel being opened. */\n readonly children: number | string\n}\n\n/** Props for a visible native button that closes a sheet. */\nexport type SheetCloseProps = Omit<ComponentPropsWithRef<\"button\">, \"children\"> & {\n /** Visible text that identifies the close action. */\n readonly children: number | string\n}\n\n/** Accessible content, naming, focus, and logical placement for a sheet surface. */\nexport type SheetContentProps = Omit<\n ComponentPropsWithRef<\"div\">,\n \"aria-label\" | \"aria-labelledby\" | \"children\" | \"title\"\n> & {\n readonly children: ReactNode\n /** Accessible text for the built-in icon close action. */\n readonly closeLabel?: string\n /** Optional visible supporting description announced with the title. */\n readonly description?: string\n /**\n * Defaults to intrinsic and is sampled when the sheet opens. While open, changes apply to the next cycle.\n * External suppresses surface and overlay entry only; exit stays intrinsic and shared reduced-motion rules apply.\n */\n readonly entryMotion?: \"external\" | \"intrinsic\"\n /** Optional target for deterministic initial focus. Content receives focus by default. */\n readonly initialFocusRef?: RefObject<HTMLElement | null>\n readonly side?: RlySheetSide\n /** Required visible heading and accessible name for the sheet. */\n readonly title: string\n}\n\n/** Props for the independently scrolling sheet body. */\nexport type SheetBodyProps = ComponentPropsWithRef<\"div\">\n/** Props for the persistent sheet action footer. */\nexport type SheetFooterProps = ComponentPropsWithRef<\"footer\">\n\ninterface SheetState {\n readonly open: boolean\n readonly requestOpenChange: (open: boolean) => void\n readonly restoreFocusRef: RefObject<HTMLElement | null>\n}\n\nconst SheetStateContext = createContext<SheetState | null>(null)\n\nconst useSheetState = (): SheetState => {\n const state = useContext(SheetStateContext)\n if (state === null) throw new Error(\"Sheet compound components must be nested inside Sheet.Root\")\n return state\n}\n\nconst SheetLayer = ({\n children,\n entryMotion\n}: {\n readonly children: ReactNode\n readonly entryMotion: \"external\" | \"intrinsic\"\n}): ReactElement => {\n const state = useSheetState()\n const layerRef = useRef<HTMLDivElement>(null)\n useModalContentRegistration()\n useModalIsolation(layerRef, state.open)\n return (\n <div\n className={style(\"layer\")}\n data-rly-modal-layer=\"\"\n data-rly-sheet-entry-motion={entryMotion}\n data-rly-sheet-layer=\"\"\n ref={layerRef}\n >\n {children}\n </div>\n )\n}\n\nconst requireVisibleAction = (value: number | string, component: string): number | string => {\n if (Predicate.isString(value)) requireText(value, `${component} children`)\n return value\n}\n\nconst SheetRoot = (componentProps: SheetRootProps): ReactElement => {\n const { children, defaultOpen = false, onOpenChange, open } = componentProps\n const [defaultState, setDefaultState] = useState(defaultOpen)\n const isParentModalReady = useParentModalReady()\n const restoreFocusRef = useRef<HTMLElement | null>(null)\n const resolvedOpen = (open ?? defaultState) && isParentModalReady\n const previousOpenRef = useRef(resolvedOpen)\n const requestOpenChange = (nextOpen: boolean): void => {\n if (open === undefined) setDefaultState(nextOpen)\n onOpenChange?.(nextOpen)\n }\n\n useLayoutEffect(() => {\n if (previousOpenRef.current === resolvedOpen) return\n previousOpenRef.current = resolvedOpen\n if (resolvedOpen) invalidateModalFocusRestore()\n else restoreModalFocusAfterCleanup(restoreFocusRef.current)\n }, [resolvedOpen])\n\n return (\n <ModalNestingBoundary>\n <SheetStateContext.Provider value={{ open: resolvedOpen, requestOpenChange, restoreFocusRef }}>\n <RadixDialog.Root modal onOpenChange={requestOpenChange} open={resolvedOpen}>\n {children}\n </RadixDialog.Root>\n </SheetStateContext.Provider>\n </ModalNestingBoundary>\n )\n}\n\nconst SheetTrigger = ({ children, className, onClick, type, ...props }: SheetTriggerProps): ReactElement => {\n const state = useSheetState()\n return (\n <RadixDialog.Trigger\n {...props}\n className={classNames(style(\"trigger\"), className)}\n onClick={(event) => {\n state.restoreFocusRef.current = event.currentTarget\n onClick?.(event)\n }}\n type={type ?? \"button\"}\n >\n {requireVisibleAction(children, \"Sheet.Trigger\")}\n </RadixDialog.Trigger>\n )\n}\n\nconst SheetClose = ({ children, className, type, ...props }: SheetCloseProps): ReactElement => (\n <RadixDialog.Close {...props} className={classNames(style(\"close\"), className)} type={type ?? \"button\"}>\n {requireVisibleAction(children, \"Sheet.Close\")}\n </RadixDialog.Close>\n)\n\nconst SheetBody = ({ className, ...props }: SheetBodyProps): ReactElement => (\n <div {...props} className={classNames(style(\"body\"), className)} />\n)\n\nconst SheetFooter = ({ className, ...props }: SheetFooterProps): ReactElement => (\n <footer {...props} className={classNames(style(\"footer\"), className)} />\n)\n\nconst SheetContent = ({\n children,\n className,\n closeLabel,\n description,\n entryMotion = \"intrinsic\",\n initialFocusRef,\n ref,\n side = RLY_SHEET_DEFAULT_VARIANTS.side,\n tabIndex,\n title,\n ...props\n}: SheetContentProps): ReactElement => {\n const state = useSheetState()\n const resolvedEntryMotion = useModalEntryMotion(state.open, entryMotion)\n const visibleTitle = requireText(title, \"Sheet title\")\n const visibleDescription = description === undefined ? undefined : requireText(description, \"Sheet description\")\n const accessibleCloseLabel = requireText(closeLabel ?? `Close ${visibleTitle}`, \"Sheet closeLabel\")\n const contentRef = useRef<HTMLDivElement | null>(null)\n const setContentRef = useCallback(\n (node: HTMLDivElement | null): void => {\n contentRef.current = node\n if (Predicate.isFunction(ref)) ref(node)\n else if (ref !== null && ref !== undefined) ref.current = node\n },\n [ref]\n )\n\n return (\n <PortalBoundary>\n {(container) => (\n <RadixDialog.Portal container={container}>\n <SheetLayer entryMotion={resolvedEntryMotion}>\n <RadixDialog.Overlay\n className={style(\"overlay\")}\n data-rly-sheet-overlay=\"\"\n onPointerDown={() => state.requestOpenChange(false)}\n />\n <RadixDialog.Content\n {...props}\n {...(visibleDescription === undefined ? { \"aria-describedby\": undefined } : {})}\n className={classNames(style(\"content\"), RLY_SHEET_VARIANTS.side[side].className, className)}\n data-rly-sheet-side={side}\n onCloseAutoFocus={(event) => event.preventDefault()}\n onOpenAutoFocus={(event) => {\n event.preventDefault()\n const activeElement = contentRef.current?.ownerDocument.activeElement ?? null\n if (state.restoreFocusRef.current === null && isHTMLElement(activeElement)) {\n state.restoreFocusRef.current = activeElement\n }\n const target = initialFocusRef?.current ?? contentRef.current\n target?.focus()\n if (target !== contentRef.current && target?.ownerDocument.activeElement !== target)\n contentRef.current?.focus()\n }}\n ref={setContentRef}\n tabIndex={tabIndex ?? -1}\n >\n <div className={style(\"header\")}>\n <div className={style(\"heading\")}>\n <RadixDialog.Title className={style(\"title\")}>{visibleTitle}</RadixDialog.Title>\n {visibleDescription === undefined ? null : (\n <RadixDialog.Description className={style(\"description\")}>\n {visibleDescription}\n </RadixDialog.Description>\n )}\n </div>\n <RadixDialog.Close aria-label={accessibleCloseLabel} className={style(\"iconClose\")} type=\"button\">\n <Icon decorative name=\"close\" size=\"default\" />\n </RadixDialog.Close>\n </div>\n {children}\n </RadixDialog.Content>\n </SheetLayer>\n </RadixDialog.Portal>\n )}\n </PortalBoundary>\n )\n}\n\n/** Owned compound side panel with modal focus, dismissal, and portal behavior. */\nexport const Sheet = Object.freeze({\n Body: SheetBody,\n Close: SheetClose,\n Content: SheetContent,\n Footer: SheetFooter,\n Root: SheetRoot,\n Trigger: SheetTrigger\n})\n","@layer rly.components {\n .root {\n align-items: center;\n appearance: none;\n border: 1px solid var(--rly-color-border-2);\n border-radius: var(--rly-radius-control);\n box-sizing: border-box;\n cursor: pointer;\n display: inline-grid;\n font: var(--rly-type-label-weight) var(--rly-type-label-size) / var(--rly-type-label-line-height)\n var(--rly-type-label-font);\n justify-items: center;\n letter-spacing: var(--rly-type-label-tracking);\n max-inline-size: 100%;\n padding-inline: var(--rly-space-16);\n position: relative;\n text-align: center;\n }\n\n .root:disabled {\n cursor: not-allowed;\n opacity: 0.58;\n }\n .primary {\n background: var(--rly-color-action-background);\n border-color: var(--rly-color-action-background);\n color: var(--rly-color-action-foreground);\n }\n .secondary {\n background: var(--rly-color-surface-1);\n color: var(--rly-color-text-1);\n }\n .quiet {\n background: var(--rly-color-surface-2);\n border-color: var(--rly-color-surface-2);\n color: var(--rly-color-text-1);\n }\n /* Tool density: as tall as its text needs, a small radius, not a pill. Touch targets come from the token. */\n .dense {\n border-radius: var(--rly-radius-tag);\n min-block-size: var(--rly-control-height-dense);\n min-inline-size: var(--rly-control-height-dense);\n padding-inline: var(--rly-space-12);\n }\n .dense .content {\n padding-block: var(--rly-space-4);\n }\n .compact {\n min-block-size: var(--rly-control-height-compact);\n }\n .defaultSize {\n min-block-size: var(--rly-control-height-default);\n }\n .principal {\n min-block-size: var(--rly-control-height-principal);\n padding-inline: var(--rly-space-24);\n }\n .stretch {\n inline-size: 100%;\n }\n\n .content {\n align-items: center;\n display: inline-flex;\n gap: var(--rly-space-8);\n justify-content: center;\n min-inline-size: var(--rly-space-0);\n padding-block: var(--rly-space-8);\n }\n\n .label {\n min-inline-size: var(--rly-space-0);\n overflow-wrap: break-word;\n }\n .loadingContent {\n opacity: 0;\n }\n .loader {\n display: grid;\n inset: var(--rly-space-0);\n place-items: center;\n position: absolute;\n }\n\n @media (hover: hover) {\n .root:not(:disabled):hover {\n border-color: var(--rly-color-text-2);\n }\n .primary:not(:disabled):hover {\n background: var(--rly-color-text-2);\n }\n }\n\n /*\n * Forced colours repaint a primary or pressed button's fill and label to the same system colour,\n * leaving a solid box. Draw them as the system's selected pair instead, so the label stays readable.\n */\n @media (forced-colors: active) {\n .primary,\n .root[aria-pressed=\"true\"] {\n background: Highlight;\n border-color: Highlight;\n color: HighlightText;\n forced-color-adjust: none;\n }\n }\n\n :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"]) .primary,\n :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"]) .root[aria-pressed=\"true\"] {\n background: Highlight;\n border-color: Highlight;\n color: HighlightText;\n forced-color-adjust: none;\n }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { Icon, type RlyIconName } from \"../foundations/Icon.js\"\nimport { classNames, cssClass, defineVariants } from \"../internal/component.js\"\nimport styles from \"./Button.module.css\"\nimport * as Predicate from \"../internal/predicates.js\"\n\nconst style = (name: string): string => cssClass(styles, name)\nexport const RLY_BUTTON_VARIANTS = defineVariants({\n variant: {\n primary: {\n className: style(\"primary\"),\n purpose: \"Single principal action\",\n tokens: [\"color-action-background\", \"color-action-foreground\"]\n },\n secondary: {\n className: style(\"secondary\"),\n purpose: \"Default supporting action\",\n tokens: [\"color-surface-1\", \"color-border-2\"]\n },\n quiet: {\n className: style(\"quiet\"),\n purpose: \"Low-emphasis contextual action\",\n tokens: [\"color-text-1\", \"color-surface-2\"]\n }\n },\n size: {\n dense: {\n className: style(\"dense\"),\n purpose: \"Tool-density action sized to its text; the default\",\n tokens: [\"control-height-dense\", \"radius-tag\"]\n },\n compact: { className: style(\"compact\"), purpose: \"Dense text action\", tokens: [\"control-height-compact\"] },\n default: { className: style(\"defaultSize\"), purpose: \"Standard action\", tokens: [\"control-height-default\"] },\n principal: {\n className: style(\"principal\"),\n purpose: \"Prominent consequential action\",\n tokens: [\"control-height-principal\", \"space-8\"]\n }\n }\n})\nexport const RLY_BUTTON_DEFAULT_VARIANTS = defineVariants({ variant: \"secondary\", size: \"dense\" })\nexport type RlyButtonVariant = keyof typeof RLY_BUTTON_VARIANTS.variant\nexport type RlyButtonSize = keyof typeof RLY_BUTTON_VARIANTS.size\nexport type ButtonProps = Omit<ComponentPropsWithRef<\"button\">, \"children\"> & {\n /** Plain visible text. Use IconButton for an icon-only action. */\n readonly children: number | string\n readonly leadingIcon?: RlyIconName\n readonly loading?: boolean\n readonly size?: RlyButtonSize\n readonly stretch?: boolean\n readonly trailingIcon?: RlyIconName\n readonly variant?: RlyButtonVariant\n}\n\n/** Render a visible-text action with stable disabled and loading geometry. */\nexport const Button = ({\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n children,\n className,\n disabled,\n leadingIcon,\n loading = false,\n size = RLY_BUTTON_DEFAULT_VARIANTS.size,\n stretch = false,\n trailingIcon,\n type,\n variant = \"secondary\",\n ...props\n}: ButtonProps): ReactElement => {\n if (\n (!Predicate.isNumber(children) && !Predicate.isString(children)) ||\n (Predicate.isString(children) && children.trim().length === 0)\n ) {\n throw new Error(\"Button children must contain visible content\")\n }\n return (\n <button\n {...props}\n aria-busy={loading ? \"true\" : undefined}\n aria-label={loading && !ariaLabelledBy?.trim() ? (ariaLabel?.trim() ? ariaLabel : String(children)) : ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={classNames(\n style(\"root\"),\n RLY_BUTTON_VARIANTS.variant[variant].className,\n RLY_BUTTON_VARIANTS.size[size].className,\n stretch && style(\"stretch\"),\n className\n )}\n data-loading={loading ? \"true\" : undefined}\n disabled={disabled || loading}\n type={type ?? \"button\"}\n >\n <span className={classNames(style(\"content\"), loading && style(\"loadingContent\"))}>\n {leadingIcon === undefined ? null : (\n <Icon decorative name={leadingIcon} size={size === \"compact\" ? \"small\" : \"default\"} />\n )}\n <span className={style(\"label\")}>{children}</span>\n {trailingIcon === undefined ? null : (\n <Icon decorative name={trailingIcon} size={size === \"compact\" ? \"small\" : \"default\"} />\n )}\n </span>\n {loading ? (\n <span aria-hidden=\"true\" className={style(\"loader\")}>\n <Icon decorative name=\"loader\" size={size === \"compact\" ? \"small\" : \"default\"} />\n </span>\n ) : null}\n </button>\n )\n}\n","@layer rly.components {\n /*\n * A state is a word and its icon in the tone's ink: no border, tint or padding, so it never reads\n * as a chip. Words wrap only between words, so a squeezed row never splits one (\"Installe / d\").\n */\n .root {\n align-items: center;\n display: inline-flex;\n gap: var(--rly-space-6);\n max-inline-size: 100%;\n overflow-wrap: break-word;\n }\n\n .neutral {\n color: var(--rly-color-text-2);\n }\n .positive {\n color: var(--rly-color-success-ink);\n }\n .critical {\n color: var(--rly-color-blocked-ink);\n }\n .caution {\n color: var(--rly-color-held-ink);\n }\n .progress {\n color: var(--rly-color-deploying-ink);\n }\n .compact {\n font: var(--rly-type-meta-weight) var(--rly-type-meta-size) / var(--rly-type-meta-line-height)\n var(--rly-type-meta-font);\n }\n .defaultSize {\n font: var(--rly-type-label-weight) var(--rly-type-label-size) / var(--rly-type-label-line-height)\n var(--rly-type-label-font);\n }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { Icon, type RlyIconName } from \"../foundations/Icon.js\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./StateLabel.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\nexport type RlyStateTone = \"neutral\" | \"positive\" | \"critical\" | \"caution\" | \"progress\"\nexport const RLY_STATE_LABEL_VARIANTS = defineVariants({\n tone: {\n neutral: {\n className: style(\"neutral\"),\n purpose: \"Neutral or unavailable state\",\n tokens: [\"color-text-2\"]\n },\n positive: {\n className: style(\"positive\"),\n purpose: \"Positive state\",\n tokens: [\"color-success-ink\"]\n },\n critical: {\n className: style(\"critical\"),\n purpose: \"Critical state\",\n tokens: [\"color-blocked-ink\"]\n },\n caution: { className: style(\"caution\"), purpose: \"Caution state\", tokens: [\"color-held-ink\"] },\n progress: {\n className: style(\"progress\"),\n purpose: \"Work in progress\",\n tokens: [\"color-deploying-ink\"]\n }\n },\n size: {\n compact: { className: style(\"compact\"), purpose: \"Dense metadata state\", tokens: [\"type-meta\"] },\n default: { className: style(\"defaultSize\"), purpose: \"Standard explicit state\", tokens: [\"type-label\"] }\n }\n})\nexport const RLY_STATE_LABEL_DEFAULT_VARIANTS = defineVariants({ tone: \"neutral\", size: \"default\" })\nexport type RlyStateLabelSize = keyof typeof RLY_STATE_LABEL_VARIANTS.size\nconst toneIcons = {\n neutral: \"minus\",\n positive: \"check\",\n critical: \"alert\",\n caution: \"clock\",\n progress: \"loader\"\n} satisfies Readonly<Record<RlyStateTone, RlyIconName>>\nexport type StateLabelProps = Omit<ComponentPropsWithRef<\"span\">, \"children\"> & {\n readonly icon?: RlyIconName\n readonly label: string\n readonly size?: RlyStateLabelSize\n readonly tone?: RlyStateTone\n}\n\n/** Render state as a visible word and icon in the tone's ink, never as a chip. */\nexport const StateLabel = ({\n className,\n icon,\n label,\n size = \"default\",\n tone = \"neutral\",\n ...props\n}: StateLabelProps): ReactElement => (\n <span\n {...props}\n className={classNames(\n style(\"root\"),\n RLY_STATE_LABEL_VARIANTS.tone[tone].className,\n RLY_STATE_LABEL_VARIANTS.size[size].className,\n className\n )}\n >\n {/* A neutral state is the word alone unless the caller names an icon; a lone dash read as a stray mark. */}\n {icon === undefined && tone === \"neutral\" ? null : <Icon decorative name={icon ?? toneIcons[tone]} size=\"small\" />}\n <span>{requireText(label, \"StateLabel label\")}</span>\n </span>\n)\n","@layer rly.components {\n .root {\n align-items: center;\n background: var(--rly-color-surface-2);\n box-sizing: border-box;\n color: var(--rly-color-text-2);\n display: inline-flex;\n flex: none;\n justify-content: center;\n overflow: hidden;\n }\n\n .small {\n block-size: var(--rly-space-24);\n inline-size: var(--rly-space-24);\n }\n .defaultSize {\n block-size: var(--rly-space-32);\n inline-size: var(--rly-space-32);\n }\n .large {\n block-size: var(--rly-space-40);\n inline-size: var(--rly-space-40);\n }\n .hero {\n block-size: calc(var(--rly-space-48) + var(--rly-space-8));\n inline-size: calc(var(--rly-space-48) + var(--rly-space-8));\n }\n .circle {\n border-radius: var(--rly-radius-round);\n }\n .roundedSquare {\n border-radius: var(--rly-radius-field);\n }\n .image {\n block-size: 100%;\n inline-size: 100%;\n object-fit: cover;\n }\n\n .fallback {\n align-items: center;\n block-size: 100%;\n display: flex;\n font: var(--rly-type-meta-weight) var(--rly-type-meta-size) / var(--rly-type-meta-line-height)\n var(--rly-type-meta-font);\n inline-size: 100%;\n justify-content: center;\n overflow: hidden;\n text-transform: uppercase;\n }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { Avatar as RadixAvatar } from \"radix-ui\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./Avatar.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\nexport const RLY_AVATAR_VARIANTS = defineVariants({\n size: {\n small: { className: style(\"small\"), purpose: \"Compact supporting identity\", tokens: [\"space-24\"] },\n default: { className: style(\"defaultSize\"), purpose: \"Standard identity\", tokens: [\"space-32\"] },\n large: { className: style(\"large\"), purpose: \"Prominent identity\", tokens: [\"space-40\"] },\n hero: { className: style(\"hero\"), purpose: \"Page-level identity\", tokens: [\"space-48\", \"space-8\"] }\n },\n form: {\n circle: { className: style(\"circle\"), purpose: \"Human or general identity\", tokens: [\"radius-round\"] },\n \"rounded-square\": {\n className: style(\"roundedSquare\"),\n purpose: \"Non-human or system identity\",\n tokens: [\"radius-field\"]\n }\n }\n})\nexport const RLY_AVATAR_DEFAULT_VARIANTS = defineVariants({ size: \"default\", form: \"circle\" })\nexport type RlyAvatarSize = keyof typeof RLY_AVATAR_VARIANTS.size\nexport type RlyAvatarForm = keyof typeof RLY_AVATAR_VARIANTS.form\ntype AvatarBaseProps = Omit<ComponentPropsWithRef<\"span\">, \"aria-label\" | \"children\"> & {\n readonly fallback: string\n readonly form?: RlyAvatarForm\n readonly size?: RlyAvatarSize\n readonly src?: string\n}\nexport type AvatarProps = AvatarBaseProps &\n ({ readonly decorative: true; readonly label?: never } | { readonly decorative?: false; readonly label: string })\n\n/** Render a fixed-geometry image with deterministic fallback and owned accessible name. */\nexport const Avatar = ({\n className,\n decorative,\n fallback,\n form = \"circle\",\n label,\n size = \"default\",\n src,\n ...props\n}: AvatarProps): ReactElement => {\n const accessibleLabel = decorative ? undefined : requireText(label, \"Avatar label\")\n const visibleFallback = requireText(fallback, \"Avatar fallback\")\n return (\n <RadixAvatar.Root\n {...props}\n aria-hidden={decorative ? \"true\" : undefined}\n aria-label={accessibleLabel}\n className={classNames(\n style(\"root\"),\n RLY_AVATAR_VARIANTS.size[size].className,\n RLY_AVATAR_VARIANTS.form[form].className,\n className\n )}\n role={decorative ? undefined : \"img\"}\n >\n {src === undefined ? null : (\n <RadixAvatar.Image alt=\"\" className={style(\"image\")} decoding=\"async\" loading=\"lazy\" src={src} />\n )}\n <RadixAvatar.Fallback aria-hidden=\"true\" className={style(\"fallback\")}>\n {visibleFallback}\n </RadixAvatar.Fallback>\n </RadixAvatar.Root>\n )\n}\n","@layer rly.components {\n .root {\n appearance: none;\n border: 1px solid var(--rly-color-border-2);\n border-radius: var(--rly-radius-control);\n box-sizing: border-box;\n cursor: pointer;\n display: inline-grid;\n padding: var(--rly-space-0);\n place-items: center;\n }\n\n .root:disabled {\n cursor: not-allowed;\n opacity: 0.58;\n }\n .primary {\n background: var(--rly-color-action-background);\n border-color: var(--rly-color-action-background);\n color: var(--rly-color-action-foreground);\n }\n .secondary {\n background: var(--rly-color-surface-1);\n color: var(--rly-color-text-1);\n }\n .quiet {\n background: var(--rly-color-surface-2);\n border-color: var(--rly-color-surface-2);\n color: var(--rly-color-text-1);\n }\n .dense {\n block-size: var(--rly-control-height-dense);\n border-radius: var(--rly-radius-tag);\n inline-size: var(--rly-control-height-dense);\n }\n .compact {\n block-size: var(--rly-control-height-compact);\n inline-size: var(--rly-control-height-compact);\n }\n .defaultSize {\n block-size: var(--rly-control-height-default);\n inline-size: var(--rly-control-height-default);\n }\n .principal {\n block-size: var(--rly-control-height-principal);\n inline-size: var(--rly-control-height-principal);\n }\n\n @media (hover: hover) {\n .root:not(:disabled):hover {\n border-color: var(--rly-color-text-2);\n }\n .primary:not(:disabled):hover {\n background: var(--rly-color-text-2);\n }\n }\n\n /*\n * Forced colours: a primary icon button is the system's selected pair, and opts out of\n * adjustment, because Chromium paints a Canvas backplate behind adjusted text and icons.\n */\n @media (forced-colors: active) {\n .primary {\n background: Highlight;\n border-color: Highlight;\n color: HighlightText;\n forced-color-adjust: none;\n }\n }\n\n :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"]) .primary {\n background: Highlight;\n border-color: Highlight;\n color: HighlightText;\n forced-color-adjust: none;\n }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { Icon, type RlyIconName } from \"../foundations/Icon.js\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./IconButton.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\nexport const RLY_ICON_BUTTON_VARIANTS = defineVariants({\n variant: {\n primary: {\n className: style(\"primary\"),\n purpose: \"Principal icon action\",\n tokens: [\"color-action-background\", \"color-action-foreground\"]\n },\n secondary: {\n className: style(\"secondary\"),\n purpose: \"Default icon action\",\n tokens: [\"color-surface-1\", \"color-border-2\"]\n },\n quiet: {\n className: style(\"quiet\"),\n purpose: \"Low-emphasis icon action\",\n tokens: [\"color-text-1\", \"color-surface-2\"]\n }\n },\n size: {\n dense: {\n className: style(\"dense\"),\n purpose: \"Tool-density icon target; the default\",\n tokens: [\"control-height-dense\", \"radius-tag\"]\n },\n compact: {\n className: style(\"compact\"),\n purpose: \"Minimum accessible icon target\",\n tokens: [\"control-height-compact\"]\n },\n default: { className: style(\"defaultSize\"), purpose: \"Standard icon target\", tokens: [\"control-height-default\"] },\n principal: { className: style(\"principal\"), purpose: \"Prominent icon target\", tokens: [\"control-height-principal\"] }\n }\n})\nexport const RLY_ICON_BUTTON_DEFAULT_VARIANTS = defineVariants({ variant: \"secondary\", size: \"dense\" })\nexport type RlyIconButtonVariant = keyof typeof RLY_ICON_BUTTON_VARIANTS.variant\nexport type RlyIconButtonSize = keyof typeof RLY_ICON_BUTTON_VARIANTS.size\nexport type IconButtonProps = Omit<ComponentPropsWithRef<\"button\">, \"aria-label\" | \"children\"> & {\n readonly icon: RlyIconName\n readonly label: string\n readonly loading?: boolean\n readonly size?: RlyIconButtonSize\n readonly variant?: RlyIconButtonVariant\n}\n\n/** Render an icon-only action whose accessible name is mandatory and owned. */\nexport const IconButton = ({\n className,\n disabled,\n icon,\n label,\n loading = false,\n size = RLY_ICON_BUTTON_DEFAULT_VARIANTS.size,\n type,\n variant = \"secondary\",\n ...props\n}: IconButtonProps): ReactElement => (\n <button\n {...props}\n aria-busy={loading ? \"true\" : undefined}\n aria-label={requireText(label, \"IconButton label\")}\n className={classNames(\n style(\"root\"),\n RLY_ICON_BUTTON_VARIANTS.variant[variant].className,\n RLY_ICON_BUTTON_VARIANTS.size[size].className,\n className\n )}\n data-loading={loading ? \"true\" : undefined}\n disabled={disabled || loading}\n type={type ?? \"button\"}\n >\n <Icon decorative name={loading ? \"loader\" : icon} size={size === \"compact\" ? \"small\" : \"default\"} />\n </button>\n)\n","const registeredFieldControls = new WeakSet<object>()\n\n/** Register an owned control that applies Field semantics to its final DOM host. */\nexport const registerFieldControl = <Component extends object>(component: Component): Component => {\n registeredFieldControls.add(component)\n return component\n}\n\n/** Distinguish rly-owned controls from consumer components that may discard DOM semantics. */\nexport const isRegisteredFieldControl = <Component extends object>(component: Component): boolean =>\n registeredFieldControls.has(component)\n","@layer rly.components {\n .trigger {\n align-items: center;\n appearance: none;\n background: var(--rly-color-surface-1);\n border: 1px solid var(--rly-color-border-2);\n border-radius: var(--rly-radius-field);\n box-sizing: border-box;\n color: var(--rly-color-text-1);\n cursor: pointer;\n display: inline-flex;\n font: var(--rly-type-body-weight) var(--rly-type-body-size) / var(--rly-type-body-line-height)\n var(--rly-type-body-font);\n gap: var(--rly-space-12);\n inline-size: 100%;\n justify-content: space-between;\n max-inline-size: 100%;\n min-inline-size: var(--rly-space-0);\n padding: var(--rly-space-8) var(--rly-space-12);\n text-align: start;\n }\n\n .trigger[data-placeholder] {\n color: var(--rly-color-text-2);\n }\n\n .trigger > span:first-child {\n min-inline-size: var(--rly-space-0);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .trigger[data-state=\"open\"] {\n border-color: var(--rly-color-focus);\n }\n\n .trigger:disabled {\n cursor: not-allowed;\n opacity: 0.58;\n }\n\n .trigger[aria-invalid=\"true\"] {\n border-color: var(--rly-color-blocked-ink);\n }\n\n .dense {\n border-radius: var(--rly-radius-tag);\n font: var(--rly-type-label-weight) var(--rly-type-label-size) / var(--rly-type-label-line-height)\n var(--rly-type-label-font);\n min-block-size: var(--rly-control-height-dense);\n padding-block: var(--rly-space-4);\n }\n .compact {\n min-block-size: var(--rly-control-height-compact);\n padding-block: var(--rly-space-6);\n }\n\n .defaultSize {\n min-block-size: var(--rly-control-height-default);\n }\n\n .triggerIcon {\n display: inline-flex;\n flex: none;\n transition: transform var(--rly-motion-fast-duration) var(--rly-motion-fast-easing);\n }\n\n .trigger[data-state=\"open\"] .triggerIcon {\n transform: rotate(180deg);\n }\n\n .content {\n background: var(--rly-color-surface-1);\n border: 1px solid var(--rly-color-border-1);\n border-radius: var(--rly-radius-field);\n box-sizing: border-box;\n color: var(--rly-color-text-1);\n max-block-size: min(20rem, var(--radix-select-content-available-height));\n max-inline-size: min(calc(100vw - var(--rly-space-32)), 32rem);\n min-inline-size: var(--radix-select-trigger-width);\n overflow: hidden;\n transform-origin: var(--radix-select-content-transform-origin);\n z-index: 100;\n }\n\n .viewport {\n box-sizing: border-box;\n padding: var(--rly-space-4);\n }\n\n .item {\n align-items: center;\n border-radius: var(--rly-radius-tag);\n box-sizing: border-box;\n cursor: default;\n display: flex;\n gap: var(--rly-space-8);\n justify-content: space-between;\n min-block-size: var(--rly-space-40);\n min-inline-size: var(--rly-space-0);\n outline: none;\n overflow-wrap: break-word;\n padding: var(--rly-space-8) var(--rly-space-12);\n user-select: none;\n }\n\n .item[data-highlighted],\n .item[data-state=\"checked\"] {\n background: var(--rly-color-surface-2);\n }\n\n .item[data-disabled] {\n opacity: 0.58;\n }\n\n .itemIndicator {\n display: inline-flex;\n flex: none;\n }\n\n .scrollButton {\n align-items: center;\n color: var(--rly-color-text-2);\n display: flex;\n justify-content: center;\n min-block-size: var(--rly-space-32);\n }\n\n @media (max-width: 30rem) {\n .content {\n inline-size: var(--radix-select-trigger-width);\n max-inline-size: calc(100vw - var(--rly-space-16));\n }\n }\n}\n","import { Select as RadixSelect } from \"radix-ui\"\nimport type { AriaAttributes, ComponentPropsWithRef, ReactElement } from \"react\"\nimport { Icon } from \"../foundations/Icon.js\"\nimport { PortalBoundary } from \"../foundations/PortalProvider.js\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport { registerFieldControl } from \"../internal/field-control.js\"\nimport styles from \"./Select.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\nexport const RLY_SELECT_VARIANTS = defineVariants({\n size: {\n dense: {\n className: style(\"dense\"),\n purpose: \"Tool-density selection control; the default\",\n tokens: [\"control-height-dense\", \"radius-tag\"]\n },\n compact: {\n className: style(\"compact\"),\n purpose: \"Dense form rows\",\n tokens: [\"control-height-compact\", \"type-meta\"]\n },\n default: {\n className: style(\"defaultSize\"),\n purpose: \"Standard selection control\",\n tokens: [\"control-height-default\", \"type-body\"]\n }\n }\n})\n\nexport const RLY_SELECT_DEFAULT_VARIANTS = defineVariants({ size: \"dense\" })\nexport type RlySelectSize = keyof typeof RLY_SELECT_VARIANTS.size\n\nexport interface RlySelectOption {\n readonly disabled?: boolean\n readonly label: string\n readonly value: string\n}\n\ntype TriggerProps = Pick<\n ComponentPropsWithRef<\"button\">,\n \"className\" | \"id\" | \"onBlur\" | \"onFocus\" | \"onKeyDown\" | \"ref\" | \"tabIndex\"\n>\n\ntype SelectAccessibleName =\n | { readonly \"aria-label\": string; readonly \"aria-labelledby\"?: never }\n | { readonly \"aria-label\"?: never; readonly \"aria-labelledby\": string }\n\ntype SelectValueState =\n | {\n readonly defaultValue?: never\n readonly onValueChange: (value: string) => void\n readonly value: string | undefined\n }\n | {\n readonly defaultValue?: string\n readonly onValueChange?: (value: string) => void\n readonly value?: never\n }\n\ntype SelectOpenState =\n | {\n readonly defaultOpen?: never\n readonly onOpenChange: (open: boolean) => void\n readonly open: boolean\n }\n | {\n readonly defaultOpen?: boolean\n readonly onOpenChange?: (open: boolean) => void\n readonly open?: never\n }\n\ninterface SelectBaseProps extends TriggerProps {\n readonly \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"]\n readonly \"aria-errormessage\"?: AriaAttributes[\"aria-errormessage\"]\n readonly \"aria-invalid\"?: AriaAttributes[\"aria-invalid\"]\n readonly \"aria-required\"?: AriaAttributes[\"aria-required\"]\n readonly autoComplete?: string\n readonly disabled?: boolean\n readonly form?: string\n readonly name?: string\n readonly options: ReadonlyArray<RlySelectOption>\n readonly placeholder?: string\n readonly required?: boolean\n readonly size?: RlySelectSize\n}\n\nexport type SelectProps = SelectBaseProps & SelectAccessibleName & SelectValueState & SelectOpenState\n\nconst validateOptions = (options: ReadonlyArray<RlySelectOption>, disabled: boolean): void => {\n if (!disabled && !options.some((option) => !option.disabled)) {\n throw new Error(\"Select options must contain at least one enabled option\")\n }\n const values = new Set<string>()\n for (const option of options) {\n requireText(option.label, \"Select option label\")\n const value = requireText(option.value, \"Select option value\")\n if (values.has(value)) throw new Error(`Duplicate Select option value: ${value}`)\n values.add(value)\n }\n}\n\n/** Render an owned, portal-safe single-value selector without exposing Radix component shapes. */\nconst SelectImplementation = (componentProps: SelectProps): ReactElement => {\n const valueControlled = \"value\" in componentProps\n const {\n \"aria-describedby\": ariaDescribedBy,\n \"aria-errormessage\": ariaErrorMessage,\n \"aria-invalid\": ariaInvalid,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-required\": ariaRequired,\n autoComplete,\n className,\n defaultOpen,\n defaultValue,\n disabled = false,\n form,\n id,\n name,\n onBlur,\n onFocus,\n onKeyDown,\n onOpenChange,\n onValueChange,\n open,\n options,\n placeholder = \"Select an option\",\n ref,\n required = false,\n size = RLY_SELECT_DEFAULT_VARIANTS.size,\n tabIndex,\n value\n } = componentProps\n validateOptions(options, disabled)\n const accessibleName = ariaLabel ?? ariaLabelledBy\n requireText(accessibleName, ariaLabel === undefined ? \"Select aria-labelledby\" : \"Select aria-label\")\n const visiblePlaceholder = requireText(placeholder, \"Select placeholder\")\n const selectedValue = value ?? defaultValue\n const selectedOption =\n selectedValue === undefined ? undefined : options.find((option) => option.value === selectedValue)\n if (selectedValue !== undefined && selectedOption === undefined) {\n throw new Error(`Select value does not match an option: ${selectedValue}`)\n }\n // Only a controlled value is known on every render; an uncontrolled one is left to Radix to mirror.\n const selectedLabel = valueControlled ? selectedOption?.label : undefined\n\n return (\n <RadixSelect.Root\n {...(autoComplete === undefined ? {} : { autoComplete })}\n {...(defaultOpen === undefined ? {} : { defaultOpen })}\n {...(defaultValue === undefined ? {} : { defaultValue })}\n disabled={disabled}\n {...(form === undefined ? {} : { form })}\n {...(name === undefined ? {} : { name })}\n {...(onOpenChange === undefined ? {} : { onOpenChange })}\n {...(onValueChange === undefined ? {} : { onValueChange })}\n {...(open === undefined ? {} : { open })}\n required={required}\n {...(valueControlled ? { value: value ?? \"\" } : {})}\n >\n <RadixSelect.Trigger\n aria-describedby={ariaDescribedBy}\n aria-errormessage={ariaErrorMessage}\n aria-invalid={ariaInvalid}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-required={ariaRequired ?? (required ? true : undefined)}\n className={classNames(style(\"trigger\"), RLY_SELECT_VARIANTS.size[size].className, className)}\n id={id}\n onBlur={onBlur}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n ref={ref}\n tabIndex={tabIndex}\n >\n {/* Render the label directly so a controlled value shows before the list mounts, including on the server. */}\n <RadixSelect.Value placeholder={visiblePlaceholder}>{selectedLabel}</RadixSelect.Value>\n <RadixSelect.Icon asChild>\n <span aria-hidden=\"true\" className={style(\"triggerIcon\")}>\n <Icon decorative name=\"chevron-down\" size=\"small\" />\n </span>\n </RadixSelect.Icon>\n </RadixSelect.Trigger>\n <PortalBoundary>\n {(container) => (\n <RadixSelect.Portal container={container}>\n <RadixSelect.Content\n align=\"start\"\n className={classNames(style(\"content\"), RLY_SELECT_VARIANTS.size[size].className)}\n position=\"popper\"\n sideOffset={6}\n >\n <RadixSelect.ScrollUpButton aria-hidden=\"true\" className={style(\"scrollButton\")}>\n <Icon decorative name=\"chevron-up\" size=\"small\" />\n </RadixSelect.ScrollUpButton>\n <RadixSelect.Viewport className={style(\"viewport\")}>\n {options.map((option) => (\n <RadixSelect.Item\n className={style(\"item\")}\n {...(option.disabled === undefined ? {} : { disabled: option.disabled })}\n key={option.value}\n textValue={option.label}\n value={option.value}\n >\n <RadixSelect.ItemText>{option.label}</RadixSelect.ItemText>\n <RadixSelect.ItemIndicator className={style(\"itemIndicator\")}>\n <Icon decorative name=\"check\" size=\"small\" />\n </RadixSelect.ItemIndicator>\n </RadixSelect.Item>\n ))}\n </RadixSelect.Viewport>\n <RadixSelect.ScrollDownButton aria-hidden=\"true\" className={style(\"scrollButton\")}>\n <Icon decorative name=\"chevron-down\" size=\"small\" />\n </RadixSelect.ScrollDownButton>\n </RadixSelect.Content>\n </RadixSelect.Portal>\n )}\n </PortalBoundary>\n </RadixSelect.Root>\n )\n}\n\nexport const Select = /* @__PURE__ */ registerFieldControl(SelectImplementation)\n","@layer rly.components {\n .root {\n background: var(--rly-color-surface-3);\n border: 1px solid var(--rly-color-border-1);\n box-sizing: border-box;\n max-inline-size: 100%;\n }\n\n .text {\n block-size: var(--rly-type-body-line-height);\n border-radius: var(--rly-radius-tag);\n inline-size: 100%;\n }\n .block {\n border-radius: var(--rly-radius-control);\n inline-size: 100%;\n min-block-size: var(--rly-space-64);\n }\n .circle {\n aspect-ratio: 1;\n border-radius: var(--rly-radius-round);\n inline-size: var(--rly-space-48);\n }\n}\n","import type { ComponentPropsWithRef, CSSProperties, ReactElement } from \"react\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./Skeleton.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\nexport const RLY_SKELETON_VARIANTS = defineVariants({\n variant: {\n text: { className: style(\"text\"), purpose: \"A line of unavailable copy\", tokens: [\"type-body\", \"radius-tag\"] },\n block: {\n className: style(\"block\"),\n purpose: \"A rectangular unavailable region\",\n tokens: [\"space-64\", \"radius-control\"]\n },\n circle: { className: style(\"circle\"), purpose: \"A circular unavailable image\", tokens: [\"radius-round\"] }\n }\n})\n\nexport const RLY_SKELETON_DEFAULT_VARIANTS = defineVariants({ variant: \"text\" })\nexport type RlySkeletonVariant = keyof typeof RLY_SKELETON_VARIANTS.variant\n\ntype SkeletonBaseProps = Omit<ComponentPropsWithRef<\"div\">, \"aria-label\" | \"children\" | \"style\"> & {\n readonly height?: CSSProperties[\"blockSize\"]\n readonly style?: CSSProperties\n readonly variant?: RlySkeletonVariant\n readonly width?: CSSProperties[\"inlineSize\"]\n}\nexport type SkeletonProps = SkeletonBaseProps &\n ({ readonly decorative?: true; readonly label?: never } | { readonly decorative: false; readonly label: string })\n\n/** Reserve content geometry without suggesting progress or motion. */\nexport const Skeleton = ({\n className,\n decorative = true,\n height,\n label,\n style: inlineStyle,\n variant = \"text\",\n width,\n ...props\n}: SkeletonProps): ReactElement => {\n if (!decorative && label === undefined) throw new Error(\"Skeleton label must contain visible text\")\n const accessibleLabel = decorative || label === undefined ? undefined : requireText(label, \"Skeleton label\")\n const dimensions: CSSProperties = {\n ...(!(height === undefined) && { blockSize: height }),\n ...(!(width === undefined) && { inlineSize: width })\n }\n\n return (\n <div\n {...props}\n aria-busy={decorative ? undefined : \"true\"}\n aria-hidden={decorative ? \"true\" : undefined}\n aria-label={accessibleLabel}\n className={classNames(style(\"root\"), RLY_SKELETON_VARIANTS.variant[variant].className, className)}\n role={decorative ? \"presentation\" : \"status\"}\n style={{ ...inlineStyle, ...dimensions }}\n />\n )\n}\n","@layer rly.components {\n .root {\n background: var(--rly-color-surface-1);\n border: 1px solid var(--rly-state-panel-edge, var(--rly-state-panel-ink, var(--rly-color-border-2)));\n border-radius: var(--rly-radius-control);\n box-sizing: border-box;\n color: var(--rly-color-text-2);\n display: grid;\n gap: var(--rly-space-16);\n grid-template-columns: auto minmax(var(--rly-space-0), 1fr);\n max-inline-size: 100%;\n padding: var(--rly-space-24);\n }\n\n .root[data-icon=\"none\"] {\n grid-template-columns: minmax(var(--rly-space-0), 1fr);\n }\n\n /*\n * The tone colours the icon and the even border; the title stays in text ink and the copy in\n * secondary ink, on the plain surface, so a state panel never reads as a tinted block.\n */\n .neutral {\n --rly-state-panel-edge: var(--rly-color-border-2);\n --rly-state-panel-ink: var(--rly-color-text-2);\n }\n .positive {\n --rly-state-panel-ink: var(--rly-color-success-ink);\n }\n .critical {\n --rly-state-panel-ink: var(--rly-color-blocked-ink);\n }\n .caution {\n --rly-state-panel-ink: var(--rly-color-held-ink);\n }\n .progress {\n --rly-state-panel-ink: var(--rly-color-deploying-ink);\n }\n\n .icon {\n color: var(--rly-state-panel-ink, var(--rly-color-text-2));\n display: inline-flex;\n padding-block-start: var(--rly-space-2);\n }\n .content {\n color: var(--rly-color-text-1);\n display: grid;\n gap: var(--rly-space-8);\n min-inline-size: var(--rly-space-0);\n }\n\n .title {\n color: var(--rly-color-text-1);\n font: var(--rly-type-card-title-weight) var(--rly-type-card-title-size) / var(--rly-type-card-title-line-height)\n var(--rly-type-card-title-font);\n letter-spacing: var(--rly-type-card-title-tracking);\n margin: var(--rly-space-0);\n overflow-wrap: break-word;\n }\n\n .description {\n color: var(--rly-color-text-2);\n font: var(--rly-type-body-weight) var(--rly-type-body-size) / var(--rly-type-body-line-height)\n var(--rly-type-body-font);\n overflow-wrap: break-word;\n }\n .description > :first-child {\n margin-block-start: var(--rly-space-0);\n }\n .description > :last-child {\n margin-block-end: var(--rly-space-0);\n }\n .action {\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n gap: var(--rly-space-8);\n padding-block-start: var(--rly-space-8);\n }\n}\n","import type { ComponentPropsWithRef, ReactElement, ReactNode } from \"react\"\nimport { Icon, type RlyIconName } from \"../foundations/Icon.js\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./StatePanel.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\nexport const RLY_STATE_PANEL_VARIANTS = defineVariants({\n tone: {\n neutral: {\n className: style(\"neutral\"),\n purpose: \"Neutral explanatory state\",\n tokens: [\"color-text-2\", \"color-border-2\"]\n },\n positive: {\n className: style(\"positive\"),\n purpose: \"Positive outcome\",\n tokens: [\"color-success-ink\"]\n },\n critical: {\n className: style(\"critical\"),\n purpose: \"Critical outcome requiring attention\",\n tokens: [\"color-blocked-ink\"]\n },\n caution: {\n className: style(\"caution\"),\n purpose: \"Held outcome requiring review\",\n tokens: [\"color-held-ink\"]\n },\n progress: {\n className: style(\"progress\"),\n purpose: \"Work currently in progress\",\n tokens: [\"color-deploying-ink\"]\n }\n }\n})\n\nexport const RLY_STATE_PANEL_DEFAULT_VARIANTS = defineVariants({ tone: \"neutral\" })\nexport type RlyStatePanelTone = keyof typeof RLY_STATE_PANEL_VARIANTS.tone\nexport type RlyStatePanelAnnouncement = \"off\" | \"polite\" | \"assertive\"\n\n// Neutral has no glyph by default: a dash read as a stray mark, and the word already carries it.\nconst toneIcons = {\n neutral: undefined,\n positive: \"check\",\n critical: \"alert\",\n caution: \"clock\",\n progress: \"loader\"\n} satisfies Readonly<Record<RlyStatePanelTone, RlyIconName | undefined>>\n\nexport type StatePanelProps = Omit<ComponentPropsWithRef<\"section\">, \"aria-live\" | \"children\" | \"title\"> & {\n readonly action?: ReactNode\n readonly announce?: RlyStatePanelAnnouncement\n readonly description?: ReactNode\n readonly icon?: RlyIconName\n readonly title: string\n readonly tone?: RlyStatePanelTone\n}\n\n/**\n * Explain an outcome with redundant word, icon, ink, and tint cues. A neutral panel shows no\n * icon unless `icon` names one.\n *\n * `announce` makes the panel a live region. A polite status region reliably announces\n * changes only once it is already mounted: mount it persistently and swap its content.\n * An assertive alert may announce as soon as it is inserted. Keep `announce=\"off\"`\n * for static states.\n */\nexport const StatePanel = ({\n action,\n announce = \"off\",\n className,\n description,\n icon,\n title,\n tone = \"neutral\",\n ...props\n}: StatePanelProps): ReactElement => {\n // An announcing region owns its role; otherwise the caller's role (for example \"note\") stands.\n const role = announce === \"assertive\" ? \"alert\" : announce === \"polite\" ? \"status\" : props.role\n const glyph = icon ?? toneIcons[tone]\n\n return (\n <section\n {...props}\n aria-live={announce === \"off\" ? undefined : announce}\n className={classNames(style(\"root\"), RLY_STATE_PANEL_VARIANTS.tone[tone].className, className)}\n data-icon={glyph === undefined ? \"none\" : undefined}\n role={role}\n >\n {glyph === undefined ? null : (\n <span aria-hidden=\"true\" className={style(\"icon\")}>\n <Icon decorative name={glyph} />\n </span>\n )}\n <div className={style(\"content\")}>\n <strong className={style(\"title\")}>{requireText(title, \"StatePanel title\")}</strong>\n {description === undefined ? null : <div className={style(\"description\")}>{description}</div>}\n {action === undefined ? null : <div className={style(\"action\")}>{action}</div>}\n </div>\n </section>\n )\n}\n","@layer rly.components {\n .root {\n align-content: start;\n color: var(--rly-color-text-1);\n display: grid;\n gap: var(--rly-space-8);\n inline-size: 100%;\n max-inline-size: 100%;\n min-inline-size: var(--rly-space-0);\n }\n\n .label {\n align-items: baseline;\n display: flex;\n flex-wrap: wrap;\n font: var(--rly-type-label-weight) var(--rly-type-label-size) / var(--rly-type-label-line-height)\n var(--rly-type-label-font);\n gap: var(--rly-space-8);\n letter-spacing: var(--rly-type-label-tracking);\n }\n\n .required,\n .description,\n .error {\n font: var(--rly-type-meta-weight) var(--rly-type-meta-size) / var(--rly-type-meta-line-height)\n var(--rly-type-meta-font);\n letter-spacing: var(--rly-type-meta-tracking);\n margin: var(--rly-space-0);\n overflow-wrap: break-word;\n }\n\n .required,\n .description {\n color: var(--rly-color-text-2);\n }\n\n .error {\n color: var(--rly-color-blocked-ink);\n }\n\n .controlSlot {\n min-inline-size: var(--rly-space-0);\n }\n\n .control {\n appearance: none;\n background: var(--rly-color-surface-1);\n border: 1px solid var(--rly-color-border-2);\n border-radius: var(--rly-radius-field);\n box-sizing: border-box;\n color: var(--rly-color-text-1);\n font: var(--rly-type-body-weight) var(--rly-type-body-size) / var(--rly-type-body-line-height)\n var(--rly-type-body-font);\n inline-size: 100%;\n max-inline-size: 100%;\n min-inline-size: var(--rly-space-0);\n padding: var(--rly-space-8) var(--rly-space-12);\n }\n\n .control:is(textarea) {\n min-block-size: var(--rly-space-96);\n resize: vertical;\n }\n\n .dense .control {\n border-radius: var(--rly-radius-tag);\n min-block-size: var(--rly-control-height-dense);\n padding-block: var(--rly-space-2);\n }\n\n .compact .control {\n min-block-size: var(--rly-control-height-compact);\n padding-block: var(--rly-space-6);\n }\n\n .defaultSize .control {\n min-block-size: var(--rly-control-height-default);\n }\n\n .control:disabled,\n .control[aria-disabled=\"true\"] {\n cursor: not-allowed;\n opacity: 0.58;\n }\n\n .control[aria-invalid=\"true\"] {\n border-color: var(--rly-color-blocked-ink);\n }\n}\n","import { type AriaAttributes, type ComponentPropsWithRef, type ReactElement, useId } from \"react\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport { isRegisteredFieldControl } from \"../internal/field-control.js\"\nimport styles from \"./Field.module.css\"\nimport * as Predicate from \"../internal/predicates.js\"\n\nconst style = (name: string): string => cssClass(styles, name)\nconst semanticControlKeys: ReadonlyArray<keyof FieldControlProps> = [\n \"aria-describedby\",\n \"aria-errormessage\",\n \"aria-invalid\",\n \"aria-labelledby\",\n \"aria-required\",\n \"id\",\n \"required\"\n]\nconst concreteControlElements = new Set([\"button\", \"input\", \"select\", \"textarea\"])\n\nexport const RLY_FIELD_VARIANTS = defineVariants({\n size: {\n dense: {\n className: style(\"dense\"),\n purpose: \"Tool-density form controls; the default\",\n tokens: [\"control-height-dense\", \"radius-tag\"]\n },\n compact: {\n className: style(\"compact\"),\n purpose: \"Dense form rows\",\n tokens: [\"control-height-compact\", \"type-meta\"]\n },\n default: {\n className: style(\"defaultSize\"),\n purpose: \"Standard form controls\",\n tokens: [\"control-height-default\", \"type-label\"]\n }\n }\n})\n\nexport const RLY_FIELD_DEFAULT_VARIANTS = defineVariants({ size: \"dense\" })\nexport type RlyFieldSize = keyof typeof RLY_FIELD_VARIANTS.size\n\n/** DOM-neutral semantics to spread onto an input, textarea, native select, or rly Select. */\nexport interface FieldControlProps {\n readonly \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"]\n readonly \"aria-errormessage\"?: AriaAttributes[\"aria-errormessage\"]\n readonly \"aria-invalid\"?: AriaAttributes[\"aria-invalid\"]\n readonly \"aria-labelledby\": string\n readonly \"aria-required\"?: AriaAttributes[\"aria-required\"]\n readonly className: string\n readonly id: string\n readonly required?: true\n}\n\nexport type FieldProps = Omit<ComponentPropsWithRef<\"div\">, \"children\"> & {\n readonly children: (controlProps: FieldControlProps) => ReactElement<FieldControlProps>\n readonly controlId?: string\n readonly description?: string\n readonly error?: string\n readonly label: string\n readonly required?: boolean\n readonly size?: RlyFieldSize\n}\n\n/** Compose visible field context with control semantics without cloning an implementation-specific control. */\nexport const Field = ({\n children,\n className,\n controlId,\n description,\n error,\n label,\n required = false,\n size = RLY_FIELD_DEFAULT_VARIANTS.size,\n ...props\n}: FieldProps): ReactElement => {\n const generatedId = useId()\n const resolvedControlId = controlId ?? `rly-field-${generatedId}`\n const labelId = `${resolvedControlId}-label`\n const descriptionId = description === undefined ? undefined : `${resolvedControlId}-description`\n const errorId = error === undefined ? undefined : `${resolvedControlId}-error`\n const describedBy = [descriptionId, errorId].filter((id): id is string => id !== undefined).join(\" \") || undefined\n const commonControlProps: FieldControlProps = {\n \"aria-describedby\": describedBy,\n \"aria-errormessage\": errorId,\n \"aria-invalid\": error === undefined ? undefined : true,\n \"aria-labelledby\": labelId,\n \"aria-required\": required ? true : undefined,\n className: style(\"control\"),\n id: resolvedControlId\n }\n const controlProps: FieldControlProps = required ? { ...commonControlProps, required: true } : commonControlProps\n const control = children(controlProps)\n const controlType = control.type\n const supportedControl = Predicate.isString(controlType)\n ? concreteControlElements.has(controlType)\n : (Predicate.isFunction(controlType) || Predicate.isObjectOrArray(controlType)) &&\n controlType !== null &&\n isRegisteredFieldControl(controlType)\n if (!supportedControl) throw new Error(\"Field children must render one concrete or rly-owned control\")\n for (const key of semanticControlKeys) {\n if (control.props[key] !== controlProps[key]) throw new Error(`Field control must apply ${key}`)\n }\n if (!control.props.className.split(\" \").includes(controlProps.className)) {\n throw new Error(\"Field control must apply className\")\n }\n\n return (\n <div\n {...props}\n className={classNames(style(\"root\"), RLY_FIELD_VARIANTS.size[size].className, className)}\n data-error={error === undefined ? undefined : \"true\"}\n >\n <label className={style(\"label\")} htmlFor={resolvedControlId} id={labelId}>\n {requireText(label, \"Field label\")}\n {required ? <span className={style(\"required\")}>Required</span> : null}\n </label>\n {description === undefined ? null : (\n <p className={style(\"description\")} id={descriptionId}>\n {requireText(description, \"Field description\")}\n </p>\n )}\n <div className={style(\"controlSlot\")}>{control}</div>\n {error === undefined ? null : (\n <p className={style(\"error\")} id={errorId} role=\"alert\">\n {requireText(error, \"Field error\")}\n </p>\n )}\n </div>\n )\n}\n","@layer rly.components {\n .root {\n max-inline-size: 100%;\n min-inline-size: var(--rly-space-0);\n }\n\n /*\n * One row of tabs above a hairline. The selected tab is marked once, by text ink and a 2px\n * underline on the hairline; no grey track, no card. Tabs size to their label, so a count stays\n * beside its words.\n */\n .list {\n align-items: stretch;\n border-block-end: 1px solid var(--rly-color-border-1);\n display: flex;\n flex-wrap: wrap;\n gap: var(--rly-space-4);\n max-inline-size: 100%;\n }\n\n .trigger {\n appearance: none;\n background: transparent;\n border: var(--rly-space-0);\n border-radius: var(--rly-radius-tag) var(--rly-radius-tag) var(--rly-space-0) var(--rly-space-0);\n color: var(--rly-color-text-2);\n cursor: pointer;\n flex: 0 1 auto;\n max-inline-size: 100%;\n min-inline-size: var(--rly-space-0);\n overflow-wrap: break-word;\n padding: var(--rly-space-8) var(--rly-space-12);\n position: relative;\n text-align: start;\n }\n\n .trigger::after {\n background: var(--rly-color-text-1);\n block-size: var(--rly-space-2);\n content: \"\";\n inset-block-end: -1px;\n inset-inline: var(--rly-space-0);\n opacity: 0;\n position: absolute;\n }\n\n .trigger[data-state=\"active\"] {\n color: var(--rly-color-text-1);\n }\n\n .trigger[data-state=\"active\"]::after {\n opacity: 1;\n }\n /* Disabled stays readable (tertiary ink keeps 4.5:1); the cursor says it cannot be chosen. */\n .trigger:disabled {\n color: var(--rly-color-text-3);\n cursor: not-allowed;\n }\n\n .defaultSize .trigger {\n font: var(--rly-type-label-weight) var(--rly-type-label-size) / var(--rly-type-label-line-height)\n var(--rly-type-label-font);\n min-block-size: calc(var(--rly-space-40) + var(--rly-space-4));\n }\n\n .large .trigger {\n font: var(--rly-type-body-weight) var(--rly-type-body-size) / var(--rly-type-body-line-height)\n var(--rly-type-body-font);\n min-block-size: var(--rly-space-48);\n padding-inline: var(--rly-space-16);\n }\n\n .panel {\n color: var(--rly-color-text-1);\n min-inline-size: var(--rly-space-0);\n padding-block-start: var(--rly-space-24);\n }\n\n @media (hover: hover) {\n .trigger:not(:disabled, [data-state=\"active\"]):hover {\n color: var(--rly-color-text-1);\n }\n }\n\n /* Forced colours keep the underline as a system-colour bar. */\n @media (forced-colors: active) {\n .trigger::after {\n background: CanvasText;\n }\n }\n\n /*\n * Stacked on a phone, a full-width underline reads as a scrollbar, so the selected row is marked by\n * a quiet fill instead; still one treatment per layout. Forced colours keep the underline.\n */\n @media (max-width: 30rem) {\n .root:not([data-mobile-layout=\"single-row\"]) .trigger {\n border-radius: var(--rly-radius-tag);\n flex: 1 1 100%;\n }\n\n .root:not([data-mobile-layout=\"single-row\"]) .trigger[data-state=\"active\"] {\n background: var(--rly-color-surface-2);\n }\n\n .root:not([data-mobile-layout=\"single-row\"]) .trigger[data-state=\"active\"]::after {\n content: none;\n }\n\n :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"])\n .root:not([data-mobile-layout=\"single-row\"])\n .trigger[data-state=\"active\"]::after {\n content: \"\";\n }\n }\n\n @media (max-width: 30rem) and (forced-colors: active) {\n .root:not([data-mobile-layout=\"single-row\"]) .trigger[data-state=\"active\"]::after {\n content: \"\";\n }\n }\n\n .root[data-mobile-layout=\"single-row\"] .list {\n flex-wrap: nowrap;\n overflow-x: auto;\n }\n\n .root[data-mobile-layout=\"single-row\"] .trigger {\n flex: 1 0 auto;\n max-inline-size: none;\n white-space: nowrap;\n }\n}\n","import type { ComponentPropsWithRef, ReactElement, ReactNode } from \"react\"\nimport { Tabs as RadixTabs } from \"radix-ui\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./Tabs.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\nexport const RLY_TABS_VARIANTS = defineVariants({\n size: {\n default: {\n className: style(\"defaultSize\"),\n purpose: \"Standard section navigation\",\n tokens: [\"type-label\", \"space-40\", \"space-4\"]\n },\n large: {\n className: style(\"large\"),\n purpose: \"Prominent page-level navigation\",\n tokens: [\"type-body\", \"space-48\"]\n }\n }\n})\n\nexport const RLY_TABS_DEFAULT_VARIANTS = defineVariants({ size: \"default\" })\nexport type RlyTabsSize = keyof typeof RLY_TABS_VARIANTS.size\nexport type RlyTabsDirection = \"ltr\" | \"rtl\"\n\n/** One labelled tab and its presentation-only panel content. */\nexport interface RlyTabItem {\n readonly content: ReactNode\n readonly disabled?: boolean\n /** Retain this panel while inactive. Defaults to unmounting; the caller must style inactive panel visibility. */\n readonly forceMount?: true\n readonly label: string\n readonly value: string\n}\n\ntype TabsBaseProps = Omit<ComponentPropsWithRef<\"div\">, \"aria-label\" | \"children\" | \"defaultValue\" | \"dir\"> & {\n /** Accessible name for the tab list. */\n readonly \"aria-label\": string\n readonly direction?: RlyTabsDirection\n readonly items: ReadonlyArray<RlyTabItem>\n readonly size?: RlyTabsSize\n}\ntype ControlledTabsProps = TabsBaseProps & {\n readonly defaultValue?: never\n readonly onValueChange: (value: string) => void\n readonly value: string\n}\ntype DefaultTabsProps = TabsBaseProps & {\n readonly defaultValue?: string\n readonly onValueChange?: (value: string) => void\n readonly value?: never\n}\nexport type TabsProps = ControlledTabsProps | DefaultTabsProps\n\nconst validateItems = (items: ReadonlyArray<RlyTabItem>): RlyTabItem => {\n if (items.length === 0) throw new Error(\"Tabs items must contain at least one enabled tab\")\n\n const values = new Set<string>()\n let firstEnabled: RlyTabItem | undefined\n for (const item of items) {\n const value = requireText(item.value, \"Tab value\")\n requireText(item.label, `Tab label for ${value}`)\n if (values.has(value)) throw new Error(`Tabs item values must be unique: ${value}`)\n values.add(value)\n if (Boolean(item.disabled) === false && firstEnabled === undefined) firstEnabled = item\n }\n\n if (firstEnabled === undefined) throw new Error(\"Tabs items must contain at least one enabled tab\")\n return firstEnabled\n}\n\n/** Render labelled, keyboard-navigable panels with controlled-first selection. */\nexport const Tabs = ({\n \"aria-label\": ariaLabel,\n className,\n defaultValue,\n direction,\n items,\n onValueChange,\n ref,\n size = \"default\",\n value,\n ...props\n}: TabsProps): ReactElement => {\n const accessibleLabel = requireText(ariaLabel, \"Tabs aria-label\")\n const firstEnabled = validateItems(items)\n const selectedValue = value ?? defaultValue ?? firstEnabled.value\n const selectedItem = items.find((item) => item.value === selectedValue)\n if (selectedItem === undefined || Boolean(selectedItem.disabled) === true) {\n throw new Error(`Tabs selected value must identify an enabled tab: ${selectedValue}`)\n }\n\n const selectionProps =\n value === undefined\n ? onValueChange === undefined\n ? { defaultValue: selectedValue }\n : { defaultValue: selectedValue, onValueChange }\n : { onValueChange, value }\n const directionProps = direction === undefined ? {} : { dir: direction }\n\n return (\n <RadixTabs.Root\n {...props}\n {...selectionProps}\n {...directionProps}\n activationMode=\"automatic\"\n className={classNames(style(\"root\"), RLY_TABS_VARIANTS.size[size].className, className)}\n orientation=\"horizontal\"\n ref={ref}\n >\n <RadixTabs.List aria-label={accessibleLabel} className={style(\"list\")} loop>\n {items.map((item) => (\n <RadixTabs.Trigger\n className={style(\"trigger\")}\n data-tab-value={item.value}\n disabled={item.disabled}\n key={item.value}\n value={item.value}\n >\n {item.label}\n </RadixTabs.Trigger>\n ))}\n </RadixTabs.List>\n {items.map((item) => (\n <RadixTabs.Content\n className={style(\"panel\")}\n {...(item.forceMount === undefined ? {} : { forceMount: item.forceMount })}\n key={item.value}\n value={item.value}\n >\n {item.content}\n </RadixTabs.Content>\n ))}\n </RadixTabs.Root>\n )\n}\n","@layer rly.components {\n .layer {\n inset: var(--rly-space-0);\n isolation: isolate;\n pointer-events: none;\n position: fixed;\n z-index: 100;\n }\n\n .overlay {\n background: var(--rly-color-canvas);\n inset: var(--rly-space-0);\n opacity: 0.78;\n pointer-events: auto;\n position: fixed;\n z-index: 0;\n }\n\n .content {\n background: var(--rly-color-surface-1);\n border: 1px solid var(--rly-color-border-1);\n border-radius: var(--rly-radius-overlay);\n box-sizing: border-box;\n color: var(--rly-color-text-1);\n display: grid;\n gap: var(--rly-space-24);\n inset-block-start: 50%;\n inset-inline-start: 50%;\n max-block-size: calc(100dvh - var(--rly-space-32));\n max-inline-size: calc(100vw - var(--rly-space-32));\n overflow: auto;\n overscroll-behavior: contain;\n padding: var(--rly-space-32);\n pointer-events: auto;\n position: fixed;\n transform: translate(-50%, -50%);\n z-index: 1;\n }\n\n .defaultSize {\n inline-size: 32rem;\n }\n .wide {\n inline-size: 48rem;\n }\n\n .header {\n display: grid;\n gap: var(--rly-space-8);\n min-inline-size: var(--rly-space-0);\n }\n\n .title {\n font: var(--rly-type-section-title-weight) var(--rly-type-section-title-size) /\n var(--rly-type-section-title-line-height) var(--rly-type-section-title-font);\n letter-spacing: var(--rly-type-section-title-tracking);\n margin: var(--rly-space-0);\n overflow-wrap: break-word;\n text-wrap: balance;\n }\n\n .description {\n color: var(--rly-color-text-2);\n font: var(--rly-type-body-large-weight) var(--rly-type-body-large-size) / var(--rly-type-body-large-line-height)\n var(--rly-type-body-large-font);\n margin: var(--rly-space-0);\n overflow-wrap: break-word;\n text-wrap: pretty;\n }\n\n .body {\n min-inline-size: var(--rly-space-0);\n overflow-wrap: break-word;\n }\n\n .overlay[data-state=\"open\"] {\n animation: dialog-fade-in var(--rly-motion-standard-duration) var(--rly-motion-standard-easing);\n }\n .overlay[data-state=\"closed\"] {\n animation: dialog-fade-out var(--rly-motion-fast-duration) var(--rly-motion-fast-easing);\n }\n .content[data-state=\"open\"] {\n animation: dialog-enter var(--rly-motion-standard-duration) var(--rly-motion-standard-easing);\n }\n .content[data-state=\"closed\"] {\n animation: dialog-exit var(--rly-motion-fast-duration) var(--rly-motion-fast-easing);\n }\n\n .layer[data-rly-dialog-entry-motion=\"external\"] .overlay[data-state=\"open\"],\n .layer[data-rly-dialog-entry-motion=\"external\"] .content[data-state=\"open\"] {\n animation: none;\n }\n\n @keyframes dialog-fade-in {\n from {\n opacity: 0;\n }\n }\n @keyframes dialog-fade-out {\n to {\n opacity: 0;\n }\n }\n @keyframes dialog-enter {\n from {\n opacity: 0;\n transform: translate(-50%, calc(-50% + var(--rly-space-8)));\n }\n }\n @keyframes dialog-exit {\n to {\n opacity: 0;\n transform: translate(-50%, calc(-50% + var(--rly-space-8)));\n }\n }\n\n @media (max-width: 25rem) {\n .content {\n block-size: 100dvh;\n border: var(--rly-space-0);\n border-radius: var(--rly-space-0);\n inset: var(--rly-space-0);\n inline-size: 100%;\n max-block-size: none;\n max-inline-size: none;\n padding: var(--rly-space-20);\n transform: none;\n }\n\n .content[data-state=\"open\"] {\n animation-name: dialog-compact-in;\n }\n .content[data-state=\"closed\"] {\n animation-name: dialog-compact-out;\n }\n }\n\n @keyframes dialog-compact-in {\n from {\n opacity: 0;\n }\n }\n @keyframes dialog-compact-out {\n to {\n opacity: 0;\n }\n }\n}\n","import {\n type ComponentPropsWithRef,\n createContext,\n type ReactElement,\n type ReactNode,\n type Ref,\n type RefObject,\n useContext,\n useLayoutEffect,\n useRef,\n useState\n} from \"react\"\nimport { Dialog as RadixDialog } from \"radix-ui\"\nimport { PortalBoundary } from \"../foundations/PortalProvider.js\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport {\n invalidateModalFocusRestore,\n isHTMLElement,\n ModalNestingBoundary,\n restoreModalFocusAfterCleanup,\n useModalContentRegistration,\n useModalEntryMotion,\n useModalIsolation,\n useParentModalReady\n} from \"../internal/modal.js\"\nimport { Button, type ButtonProps } from \"./Button.js\"\nimport styles from \"./Dialog.module.css\"\nimport * as Predicate from \"../internal/predicates.js\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\ninterface DialogState {\n readonly open: boolean\n readonly requestOpenChange: (open: boolean) => void\n readonly restoreTargetRef: RefObject<HTMLElement | null>\n readonly triggerRef: RefObject<HTMLButtonElement | null>\n}\n\nconst DialogStateContext = createContext<DialogState | null>(null)\n\nconst useDialogState = (): DialogState => {\n const state = useContext(DialogStateContext)\n if (state === null) throw new Error(\"Dialog compound components must be nested inside Dialog\")\n return state\n}\n\nconst assignRef = <Element,>(ref: Ref<Element> | undefined, value: Element | null): void => {\n if (Predicate.isFunction(ref)) ref(value)\n else if (ref !== null && ref !== undefined) ref.current = value\n}\n\nconst getActiveElement = (): HTMLElement | null => {\n try {\n return isHTMLElement(document.activeElement) ? document.activeElement : null\n } catch {\n return null\n }\n}\n\n/** Semantic size metadata for the dialog surface. */\nexport const RLY_DIALOG_VARIANTS = defineVariants({\n size: {\n default: {\n className: style(\"defaultSize\"),\n purpose: \"Focused decision or short form\",\n tokens: [\"radius-overlay\", \"space-32\"]\n },\n wide: {\n className: style(\"wide\"),\n purpose: \"Detailed comparison or multi-section form\",\n tokens: [\"radius-overlay\", \"space-64\"]\n }\n }\n})\n\n/** Default dialog size used when no size is selected. */\nexport const RLY_DIALOG_DEFAULT_VARIANTS = defineVariants({ size: \"default\" })\n/** Available dialog surface sizes. */\nexport type RlyDialogSize = keyof typeof RLY_DIALOG_VARIANTS.size\n\ntype DialogBaseProps = { readonly children: ReactNode }\ntype ControlledDialogProps = DialogBaseProps & {\n readonly defaultOpen?: never\n readonly onOpenChange: (open: boolean) => void\n readonly open: boolean\n}\ntype DefaultDialogProps = DialogBaseProps & {\n readonly defaultOpen?: boolean\n readonly onOpenChange?: (open: boolean) => void\n readonly open?: never\n}\n/** Controlled-first or locally owned state for a dialog tree. */\nexport type DialogRootProps = ControlledDialogProps | DefaultDialogProps\n\n/** Props for the visible rly button that opens a dialog. */\nexport type DialogTriggerProps = ButtonProps\n/** Props for a visible rly button that closes a dialog. */\nexport type DialogCloseProps = ButtonProps\n\n/** Accessible content, naming, focus, and sizing for a modal dialog surface. */\nexport type DialogContentProps = Omit<\n ComponentPropsWithRef<\"div\">,\n \"aria-describedby\" | \"aria-label\" | \"aria-labelledby\" | \"children\" | \"title\"\n> & {\n readonly children: ReactNode\n readonly description?: string\n /**\n * Defaults to intrinsic and is sampled when the dialog opens. While open, changes apply to the next cycle.\n * External suppresses surface and overlay entry only; exit stays intrinsic and shared reduced-motion rules apply.\n */\n readonly entryMotion?: \"external\" | \"intrinsic\"\n readonly initialFocusRef?: RefObject<HTMLElement | null>\n readonly size?: RlyDialogSize\n readonly title: string\n}\n\nconst DialogLayer = ({\n children,\n entryMotion\n}: {\n readonly children: ReactNode\n readonly entryMotion: \"external\" | \"intrinsic\"\n}): ReactElement => {\n const state = useDialogState()\n const ref = useRef<HTMLDivElement>(null)\n useModalContentRegistration()\n useModalIsolation(ref, state.open)\n return (\n <div\n className={style(\"layer\")}\n data-rly-dialog-entry-motion={entryMotion}\n data-rly-dialog-layer=\"\"\n data-rly-modal-layer=\"\"\n ref={ref}\n >\n {children}\n </div>\n )\n}\n\n/** Own controlled or reusable default dialog state without exposing Radix contracts. */\nconst DialogRoot = ({ children, defaultOpen = false, onOpenChange, open }: DialogRootProps): ReactElement => {\n const [defaultState, setDefaultState] = useState(defaultOpen)\n const isParentModalReady = useParentModalReady()\n const resolvedOpen = (open ?? defaultState) && isParentModalReady\n const previousOpenRef = useRef(resolvedOpen)\n const triggerRef = useRef<HTMLButtonElement>(null)\n const restoreTargetRef = useRef<HTMLElement | null>(resolvedOpen ? getActiveElement() : null)\n if (resolvedOpen && !previousOpenRef.current) {\n restoreTargetRef.current = triggerRef.current ?? getActiveElement()\n }\n const requestOpenChange = (nextOpen: boolean): void => {\n if (nextOpen) restoreTargetRef.current = triggerRef.current ?? getActiveElement()\n if (open === undefined) setDefaultState(nextOpen)\n onOpenChange?.(nextOpen)\n }\n\n useLayoutEffect(() => {\n if (previousOpenRef.current === resolvedOpen) return\n previousOpenRef.current = resolvedOpen\n if (resolvedOpen) invalidateModalFocusRestore()\n else restoreModalFocusAfterCleanup(restoreTargetRef.current)\n }, [resolvedOpen])\n\n return (\n <ModalNestingBoundary>\n <DialogStateContext.Provider value={{ open: resolvedOpen, requestOpenChange, restoreTargetRef, triggerRef }}>\n <RadixDialog.Root modal onOpenChange={requestOpenChange} open={resolvedOpen}>\n {children}\n </RadixDialog.Root>\n </DialogStateContext.Provider>\n </ModalNestingBoundary>\n )\n}\n\n/** Render the explicit action that opens a dialog using rly Button semantics. */\nconst DialogTrigger = ({ ref, ...props }: DialogTriggerProps): ReactElement => {\n const state = useDialogState()\n return (\n <RadixDialog.Trigger asChild>\n <Button\n {...props}\n ref={(element) => {\n state.triggerRef.current = element\n assignRef(ref, element)\n }}\n />\n </RadixDialog.Trigger>\n )\n}\n\n/** Render the explicit action that closes the current dialog. */\nconst DialogClose = (props: DialogCloseProps): ReactElement => (\n <RadixDialog.Close asChild>\n <Button {...props} />\n </RadixDialog.Close>\n)\n\n/** Render a named modal surface in the application-controlled portal boundary. */\nconst DialogContent = ({\n children,\n className,\n description,\n entryMotion = \"intrinsic\",\n initialFocusRef,\n size = \"default\",\n title,\n ...props\n}: DialogContentProps): ReactElement => {\n const state = useDialogState()\n const resolvedEntryMotion = useModalEntryMotion(state.open, entryMotion)\n const visibleTitle = requireText(title, \"Dialog title\")\n const visibleDescription = description === undefined ? undefined : requireText(description, \"Dialog description\")\n\n return (\n <PortalBoundary>\n {(container) => (\n <RadixDialog.Portal container={container}>\n <DialogLayer entryMotion={resolvedEntryMotion}>\n <RadixDialog.Overlay\n className={style(\"overlay\")}\n data-rly-dialog-overlay=\"\"\n onPointerDown={() => {\n state.requestOpenChange(false)\n }}\n />\n <RadixDialog.Content\n {...props}\n {...(visibleDescription === undefined ? { \"aria-describedby\": undefined } : {})}\n className={classNames(style(\"content\"), RLY_DIALOG_VARIANTS.size[size].className, className)}\n onCloseAutoFocus={(event) => {\n event.preventDefault()\n }}\n onOpenAutoFocus={(event) => {\n const activeElement = getActiveElement()\n if (state.triggerRef.current === null && activeElement !== null) {\n state.restoreTargetRef.current = activeElement\n }\n const target = initialFocusRef?.current\n if (target !== null && target !== undefined) {\n event.preventDefault()\n target.focus()\n }\n }}\n >\n <header className={style(\"header\")}>\n <RadixDialog.Title className={style(\"title\")}>{visibleTitle}</RadixDialog.Title>\n {visibleDescription === undefined ? null : (\n <RadixDialog.Description className={style(\"description\")}>\n {visibleDescription}\n </RadixDialog.Description>\n )}\n </header>\n <div className={style(\"body\")}>{children}</div>\n </RadixDialog.Content>\n </DialogLayer>\n </RadixDialog.Portal>\n )}\n </PortalBoundary>\n )\n}\n\n/** Owned compound dialog API with no Radix types or slots in its public contract. */\nexport const Dialog = Object.freeze({\n Close: DialogClose,\n Content: DialogContent,\n Root: DialogRoot,\n Trigger: DialogTrigger\n})\n"],"mappings":"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"}
@@ -1,8 +1,8 @@
1
1
  import { AccessibleIcon as e } from "radix-ui";
2
2
  import { createContext as t, useContext as n, useState as r } from "react";
3
3
  import { jsx as i, jsxs as a } from "react/jsx-runtime";
4
- import { ArrowDown as o, ArrowLeft as s, ArrowRight as c, ArrowUp as l, Check as u, ChevronDown as d, ChevronLeft as f, ChevronRight as p, ChevronUp as m, CircleAlert as h, Clock as g, ExternalLink as _, File as v, Link as y, LoaderCircle as b, Menu as x, Minus as S, Plus as C, Search as w, User as T, X as E } from "lucide-react";
5
- var D = ((e) => e)([
4
+ import { ArrowDown as o, ArrowLeft as s, ArrowRight as c, ArrowUp as l, Check as u, ChevronDown as d, ChevronLeft as f, ChevronRight as p, ChevronUp as m, CircleAlert as h, Clock as g, ExternalLink as _, File as v, Link as y, LoaderCircle as b, Menu as x, Minus as S, Pin as C, Plus as w, Search as T, User as E, X as D } from "lucide-react";
5
+ var O = ((e) => e)([
6
6
  "arrow-down",
7
7
  "arrow-left",
8
8
  "arrow-right",
@@ -23,8 +23,9 @@ var D = ((e) => e)([
23
23
  "plus",
24
24
  "search",
25
25
  "user",
26
- "close"
27
- ]), O = { size: {
26
+ "close",
27
+ "pin"
28
+ ]), k = { size: {
28
29
  small: {
29
30
  pixels: 16,
30
31
  purpose: "Dense metadata and supporting controls"
@@ -37,7 +38,7 @@ var D = ((e) => e)([
37
38
  pixels: 24,
38
39
  purpose: "Prominent standalone indicators"
39
40
  }
40
- } }, k = { size: "default" }, A = {
41
+ } }, A = { size: "default" }, j = {
41
42
  "arrow-down": o,
42
43
  "arrow-left": s,
43
44
  "arrow-right": c,
@@ -55,12 +56,13 @@ var D = ((e) => e)([
55
56
  loader: b,
56
57
  menu: x,
57
58
  minus: S,
58
- plus: C,
59
- search: w,
60
- user: T,
61
- close: E
62
- }, j = (e) => O.size[e ?? k.size].pixels, M = (t) => {
63
- let n = A[t.name], r = j(t.size), a = {
59
+ plus: w,
60
+ search: T,
61
+ user: E,
62
+ close: D,
63
+ pin: C
64
+ }, M = (e) => k.size[e ?? A.size].pixels, N = (t) => {
65
+ let n = j[t.name], r = M(t.size), a = {
64
66
  className: t.className,
65
67
  color: "currentColor",
66
68
  focusable: !1,
@@ -77,15 +79,15 @@ var D = ((e) => e)([
77
79
  label: t.label,
78
80
  children: /* @__PURE__ */ i(n, { ...a })
79
81
  });
80
- }, N = { available: !1 }, P = t(N), F = () => n(P), I = ({ children: e }) => {
81
- let t = F();
82
+ }, P = { available: !1 }, F = t(P), I = () => n(F), L = ({ children: e }) => {
83
+ let t = I();
82
84
  return t.available ? e(t.container) : null;
83
- }, L = ({ children: e, container: t }) => {
84
- let [n, o] = r(null), s = t === void 0 ? n : t, c = s === null ? N : {
85
+ }, R = ({ children: e, container: t }) => {
86
+ let [n, o] = r(null), s = t === void 0 ? n : t, c = s === null ? P : {
85
87
  available: !0,
86
88
  container: s
87
89
  };
88
- return /* @__PURE__ */ a(P.Provider, {
90
+ return /* @__PURE__ */ a(F.Provider, {
89
91
  value: c,
90
92
  children: [e, t === void 0 ? /* @__PURE__ */ i("div", {
91
93
  "data-rly-portal-root": "",
@@ -94,6 +96,6 @@ var D = ((e) => e)([
94
96
  });
95
97
  };
96
98
  //#endregion
97
- export { k as a, M as i, L as n, D as o, F as r, O as s, I as t };
99
+ export { A as a, N as i, R as n, O as o, I as r, k as s, L as t };
98
100
 
99
- //# sourceMappingURL=PortalProvider-CN_81Fy3.js.map
101
+ //# sourceMappingURL=PortalProvider-op07u8na.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PortalProvider-op07u8na.js","names":["RLY_ICON_NAMES","names","RLY_ICON_VARIANTS","RLY_ICON_DEFAULT_VARIANTS","glyphs","ArrowDown","ArrowLeft","ArrowRight","ArrowUp","Check","ChevronDown","ChevronLeft","ChevronRight","ChevronUp","CircleAlert","Clock","ExternalLink","File","Link","LoaderCircle","Menu","Minus","Plus","Search","User","X","Pin","iconSize","size","Icon","Glyph","props","common","AccessibleIcon","unavailableTarget","PortalTargetContext","createContext","usePortalTarget","useContext","PortalBoundary","target","children","PortalProvider","ownedContainer","setOwnedContainer","useState","resolvedContainer","container"],"sources":["../src/foundations/Icon.tsx","../src/foundations/PortalProvider.tsx"],"sourcesContent":["import type { ComponentType, ReactElement, SVGProps } from \"react\"\nimport { AccessibleIcon } from \"radix-ui\"\nimport {\n ArrowDown,\n ArrowLeft,\n ArrowRight,\n ArrowUp,\n Check,\n ChevronDown,\n ChevronLeft,\n ChevronRight,\n ChevronUp,\n CircleAlert,\n Clock,\n ExternalLink,\n File,\n Link,\n LoaderCircle,\n Menu,\n Minus,\n Pin,\n Plus,\n Search,\n User,\n X\n} from \"lucide-react\"\n\nconst defineNames = <const Names extends ReadonlyArray<string>>(names: Names): Names => names\n\n/** Stable, presentation-only glyph names supported by rly. */\nexport const RLY_ICON_NAMES = defineNames([\n \"arrow-down\",\n \"arrow-left\",\n \"arrow-right\",\n \"arrow-up\",\n \"check\",\n \"chevron-down\",\n \"chevron-left\",\n \"chevron-right\",\n \"chevron-up\",\n \"alert\",\n \"clock\",\n \"external-link\",\n \"file\",\n \"link\",\n \"loader\",\n \"menu\",\n \"minus\",\n \"plus\",\n \"search\",\n \"user\",\n \"close\",\n \"pin\"\n])\n\n/** A stable glyph name owned by rly rather than its icon implementation. */\nexport type RlyIconName = (typeof RLY_ICON_NAMES)[number]\n\n/** Machine-readable icon size variants. */\nexport const RLY_ICON_VARIANTS = {\n size: {\n small: { pixels: 16, purpose: \"Dense metadata and supporting controls\" },\n default: { pixels: 20, purpose: \"Standard interface controls\" },\n large: { pixels: 24, purpose: \"Prominent standalone indicators\" }\n }\n} satisfies Readonly<\n Record<\n \"size\",\n Readonly<\n Record<\n string,\n {\n readonly pixels: number\n readonly purpose: string\n }\n >\n >\n >\n>\n\n/** Default icon variants used when no visual size is supplied. */\nexport const RLY_ICON_DEFAULT_VARIANTS = {\n size: \"default\"\n} satisfies Readonly<Record<keyof typeof RLY_ICON_VARIANTS, keyof typeof RLY_ICON_VARIANTS.size>>\n\n/** Semantic size supported by Icon. */\nexport type RlyIconSize = keyof typeof RLY_ICON_VARIANTS.size\n\ntype Glyph = ComponentType<SVGProps<SVGSVGElement>>\n\nconst glyphs = {\n \"arrow-down\": ArrowDown,\n \"arrow-left\": ArrowLeft,\n \"arrow-right\": ArrowRight,\n \"arrow-up\": ArrowUp,\n check: Check,\n \"chevron-down\": ChevronDown,\n \"chevron-left\": ChevronLeft,\n \"chevron-right\": ChevronRight,\n \"chevron-up\": ChevronUp,\n alert: CircleAlert,\n clock: Clock,\n \"external-link\": ExternalLink,\n file: File,\n link: Link,\n loader: LoaderCircle,\n menu: Menu,\n minus: Minus,\n plus: Plus,\n search: Search,\n user: User,\n close: X,\n pin: Pin\n} satisfies Readonly<Record<RlyIconName, Glyph>>\n\ninterface IconSharedProps {\n /** Optional class applied directly to the SVG. */\n readonly className?: string\n /** Stable glyph name selected from rly's owned icon catalog. */\n readonly name: RlyIconName\n /** Semantic rendered size. */\n readonly size?: RlyIconSize\n}\n\ninterface DecorativeIconProps {\n /** Marks an icon as redundant with nearby visible content. */\n readonly decorative: true\n readonly label?: never\n}\n\ninterface InformativeIconProps {\n /** Informative icons are exposed as labelled images. */\n readonly decorative?: false\n /** Concise accessible meaning for the icon. */\n readonly label: string\n}\n\n/** Props for an owned, current-color interface icon. */\nexport type IconProps = IconSharedProps & (DecorativeIconProps | InformativeIconProps)\n\nconst iconSize = (size: RlyIconSize | undefined): number =>\n RLY_ICON_VARIANTS.size[size ?? RLY_ICON_DEFAULT_VARIANTS.size].pixels\n\n/** Render an accessible interface glyph without exposing the underlying icon library. */\nexport const Icon = (props: IconProps): ReactElement => {\n const Glyph = glyphs[props.name]\n const size = iconSize(props.size)\n const common = {\n className: props.className,\n color: \"currentColor\",\n focusable: false,\n height: size,\n strokeWidth: 1.75,\n width: size\n }\n\n if (props.decorative) return <Glyph {...common} aria-hidden=\"true\" />\n\n if (props.label.trim().length === 0) {\n throw new Error(\"Informative Icon labels must contain visible text\")\n }\n\n return (\n <AccessibleIcon.Root label={props.label}>\n <Glyph {...common} />\n </AccessibleIcon.Root>\n )\n}\n","import { createContext, type ReactElement, type ReactNode, useContext, useState } from \"react\"\n\n/** A controlled browser portal target supported by React and Radix portals. */\nexport type RlyPortalContainer = Element | DocumentFragment\n\nexport interface PortalProviderProps {\n readonly children: ReactNode\n /** A cross-document target must load Rly styles before it becomes available. */\n readonly container?: RlyPortalContainer | null\n}\n\nexport type RlyPortalTarget =\n { readonly available: false } | { readonly available: true; readonly container: RlyPortalContainer }\n\ninterface PortalBoundaryProps {\n readonly children: (container: RlyPortalContainer) => ReactElement\n}\n\nconst unavailableTarget: RlyPortalTarget = { available: false }\nconst PortalTargetContext = createContext<RlyPortalTarget>(unavailableTarget)\n\n/** Internal target state for rly overlays. Consumers must prove availability before obtaining a container. */\nexport const usePortalTarget = (): RlyPortalTarget => useContext(PortalTargetContext)\n\n/** Prevents portal implementations from mounting while their controlled target is unavailable. */\nexport const PortalBoundary = ({ children }: PortalBoundaryProps): ReactElement | null => {\n const target = usePortalTarget()\n return target.available ? children(target.container) : null\n}\n\n/** Supplies a custom portal target or owns an in-tree target without assuming a global body. */\nexport const PortalProvider = ({ children, container }: PortalProviderProps): ReactElement => {\n const [ownedContainer, setOwnedContainer] = useState<HTMLDivElement | null>(null)\n const resolvedContainer = container === undefined ? ownedContainer : container\n const target: RlyPortalTarget =\n resolvedContainer === null ? unavailableTarget : { available: true, container: resolvedContainer }\n\n return (\n <PortalTargetContext.Provider value={target}>\n {children}\n {container === undefined ? <div data-rly-portal-root=\"\" ref={setOwnedContainer} /> : null}\n </PortalTargetContext.Provider>\n )\n}\n"],"mappings":";;;;AA8BA,IAAaA,MAHmD,MAAwBC,EAG1D,CAAY;CACxC;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,GAMYC,IAAoB,EAC/B,MAAM;CACJ,OAAO;EAAE,QAAQ;EAAI,SAAS;CAAyC;CACvE,SAAS;EAAE,QAAQ;EAAI,SAAS;CAA8B;CAC9D,OAAO;EAAE,QAAQ;EAAI,SAAS;CAAkC;AAClE,EACF,GAgBaC,IAA4B,EACvC,MAAM,UACR,GAOMC,IAAS;CACb,cAAcC;CACd,cAAcC;CACd,eAAeC;CACf,YAAYC;CACZ,OAAOC;CACP,gBAAgBC;CAChB,gBAAgBC;CAChB,iBAAiBC;CACjB,cAAcC;CACd,OAAOC;CACP,OAAOC;CACP,iBAAiBC;CACjB,MAAMC;CACN,MAAMC;CACN,QAAQC;CACR,MAAMC;CACN,OAAOC;CACP,MAAMC;CACN,QAAQC;CACR,MAAMC;CACN,OAAOC;CACP,KAAKC;AACP,GA2BMC,KAAY,MAChBzB,EAAkB,KAAK0B,KAAQzB,EAA0B,KAAK,CAAC,QAGpD0B,KAAQ,MAAmC;CACtD,IAAMC,IAAQ1B,EAAO2B,EAAM,OACrBH,IAAOD,EAASI,EAAM,IAAI,GAC1BC,IAAS;EACb,WAAWD,EAAM;EACjB,OAAO;EACP,WAAW;EACX,QAAQH;EACR,aAAa;EACb,OAAOA;CACT;CAEA,IAAIG,EAAM,YAAY,OAAO,kBAACD,GAAD;EAAO,GAAIE;EAAQ,eAAY;CAAQ,CAAA;CAEpE,IAAID,EAAM,MAAM,KAAK,CAAC,CAAC,WAAW,GAChC,MAAU,MAAM,mDAAmD;CAGrE,OACE,kBAACE,EAAe,MAAhB;EAAqB,OAAOF,EAAM;EAChC,UAAA,kBAACD,GAAD,EAAO,GAAIE,EAAS,CAAA;CACD,CAAA;AAEzB,GCrJME,IAAqC,EAAE,WAAW,GAAM,GACxDC,IAAsBC,EAA+BF,CAAiB,GAG/DG,UAAyCC,EAAWH,CAAmB,GAGvEI,KAAkB,EAAE,kBAAyD;CACxF,IAAMC,IAASH,EAAgB;CAC/B,OAAOG,EAAO,YAAYC,EAASD,EAAO,SAAS,IAAI;AACzD,GAGaE,KAAkB,EAAE,aAAU,mBAAmD;CAC5F,IAAM,CAACC,GAAgBC,KAAqBC,EAAgC,IAAI,GAC1EC,IAAoBC,MAAc,KAAA,IAAYJ,IAAiBI,GAC/DP,IACJM,MAAsB,OAAOZ,IAAoB;EAAE,WAAW;EAAM,WAAWY;CAAkB;CAEnG,OACE,kBAACX,EAAoB,UAArB;EAA8B,OAAOK;EAArC,UAAA,CACGC,GACAM,MAAc,KAAA,IAAY,kBAAC,OAAD;GAAK,wBAAqB;GAAG,KAAKH;EAAoB,CAAA,IAAI,IACzD;;AAElC"}
@@ -0,0 +1,9 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32">
2
+ <title>Relay</title>
3
+ <rect width="32" height="32" rx="9.6" fill="#6741A5"/>
4
+ <g transform="translate(8 8) scale(0.6667)" fill="none" stroke="#FFFFFF" stroke-width="2.75" stroke-linecap="round" stroke-linejoin="round">
5
+ <path d="M4 20V9.5A5.5 5.5 0 0 1 9.5 4H13"/>
6
+ <path d="M20 4v10.5a5.5 5.5 0 0 1-5.5 5.5H11"/>
7
+ <path d="M10 14 14 10"/>
8
+ </g>
9
+ </svg>