@knpkv/rly 0.6.1 → 0.9.0

package/dist/primitives-Dj-qYrUZ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"primitives-Dj-qYrUZ.js","names":["root","item","style","styles","validateItems","root","style","styles","root","defaultSize","near","style","styles","root","style","styles","root","tonePrimary","toneSecondary","toneTertiary","style","styles","root","defaultSize","style","styles","validateItems","Tabs","RadixTabs","root","style","styles","Select","styles","root","item","style","styles","RadixRadioGroup","styles","decodeRlyTheme","Icon","requireText","cssClass","defineVariants","classNames","Select$1","Field","ChartLegend_module_default","style$8","name","RLY_SERIES","rlySeriesColor","series","validateItems$2","ids","item","items","id","ChartLegend","props","label","className","Divider_module_default","style$7","RLY_DIVIDER_VARIANTS","RLY_DIVIDER_DEFAULT_VARIANTS","Divider","decorative","accessibleLabel","orientation","strength","LimitTrack_module_default","style$6","RLY_LIMIT_TRACK_VARIANTS","RLY_LIMIT_TRACK_DEFAULT_VARIANTS","readingOf","value","requireFinite","limitTrackTone","mark","near","reading","percent","LimitTrack","rawValue","nearMark","accessible","accessibleValueText","valueText","meter","projection","projected","size","stale","Notice_module_default","style$5","RLY_NOTICE_VARIANTS","RLY_NOTICE_DEFAULT_VARIANTS","toneIcons","Notice","glyph","icon","tone","role","announce","action","Surface_module_default","style$4","RLY_SURFACE_VARIANTS","RLY_SURFACE_DEFAULT_VARIANTS","Surface","createElement","as","form","padding","children","Tabs_module_default","style$3","RLY_TABS_VARIANTS","RLY_TABS_DEFAULT_VARIANTS","validateItems$1","values","firstEnabled","Tabs$1","ariaLabel","selectedValue","defaultValue","selectedItem","selectionProps","onValueChange","directionProps","direction","Tabs","Text_module_default","style$2","RLY_TEXT_VARIANTS","RLY_TEXT_DEFAULT_VARIANTS","defaultElement","variant","Text","ThemeSelect_module_default","themeLabels","themeOptions","RLY_THEME_NAMES","ThemeSelect","onChange","theme","next","labelVisibility","controlProps","ToggleGroup_module_default","style$1","RLY_TOGGLE_GROUP_VARIANTS","RLY_TOGGLE_GROUP_DEFAULT_VARIANTS","stepOf","key","validateItems","itemValue","ToggleGroup","options","useRef","choose","step","event","from","RadioGroup","index","element","TrackKey_module_default","style","RLY_TRACK_KEY_MARKS","TrackKey","marks"],"sources":["../src/primitives/ChartLegend.module.css","../src/primitives/ChartLegend.tsx","../src/primitives/Divider.module.css","../src/primitives/Divider.tsx","../src/primitives/LimitTrack.module.css","../src/primitives/LimitTrack.tsx","../src/primitives/Notice.module.css","../src/primitives/Notice.tsx","../src/primitives/Surface.module.css","../src/primitives/Surface.tsx","../src/primitives/Tabs.module.css","../src/primitives/Tabs.tsx","../src/primitives/Text.module.css","../src/primitives/Text.tsx","../src/primitives/ThemeSelect.module.css","../src/primitives/ThemeSelect.tsx","../src/primitives/ToggleGroup.module.css","../src/primitives/ToggleGroup.tsx","../src/primitives/TrackKey.module.css","../src/primitives/TrackKey.tsx"],"sourcesContent":["@layer rly.components {\n  .root {\n    color: var(--rly-color-text-1);\n    display: flex;\n    flex-wrap: wrap;\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    gap: var(--rly-space-6) var(--rly-space-16);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n  .item {\n    align-items: center;\n    display: inline-flex;\n    gap: var(--rly-space-6);\n    min-inline-size: 0;\n  }\n  .swatch {\n    block-size: var(--rly-space-12);\n    border-radius: 2px;\n    flex: none;\n    inline-size: var(--rly-space-12);\n  }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { classNames, cssClass, requireText } from \"../internal/component.js\"\nimport styles from \"./ChartLegend.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n/** Chart series slots in assignment order, then the neutral remainder for folded series. */\nexport const RLY_SERIES: readonly [1, 2, 3, 4, 5, 6, 7, 8, \"other\"] = [1, 2, 3, 4, 5, 6, 7, 8, \"other\"]\nexport type RlySeries = (typeof RLY_SERIES)[number]\n\n/** The CSS colour of a series slot, for SVG fills and swatches alike. */\nexport const rlySeriesColor = (series: RlySeries): string => `var(--rly-color-series-${series})`\n\n/** One series in a legend: a stable id, the caller's words, and its colour slot. */\nexport interface RlyChartLegendItem {\n  readonly id: string\n  readonly label: string\n  readonly series: RlySeries\n}\n\ntype ChartLegendBaseProps = Omit<ComponentPropsWithRef<\"ul\">, \"aria-label\" | \"children\">\nexport type ChartLegendProps = ChartLegendBaseProps & {\n  /** Names the list for assistive technology, for example \"Bookings by colour\". */\n  readonly label: string\n  /** The series visible in the chart right now; keep each id on the same slot across updates. */\n  readonly items: ReadonlyArray<RlyChartLegendItem>\n}\n\nconst validateItems = (items: ReadonlyArray<RlyChartLegendItem>): void => {\n  const ids = new Set<string>()\n  for (const item of items) {\n    const id = requireText(item.id, \"ChartLegend item id\")\n    if (ids.has(id)) throw new Error(`ChartLegend item ids must be unique: ${id}`)\n    ids.add(id)\n  }\n}\n\n/** Which colour is which series. Shown with every multi-series chart; renders nothing without series. */\nexport const ChartLegend = ({ className, items, label, ...props }: ChartLegendProps): ReactElement | null => {\n  validateItems(items)\n  return items.length === 0 ? null : (\n    <ul\n      {...props}\n      aria-label={requireText(label, \"ChartLegend label\")}\n      className={classNames(style(\"root\"), className)}\n      // Flex styling with no list markers drops list semantics in WebKit, so the role is explicit.\n      role=\"list\"\n    >\n      {items.map((item) => (\n        <li className={style(\"item\")} key={item.id}>\n          <span\n            aria-hidden=\"true\"\n            className={style(\"swatch\")}\n            data-series={String(item.series)}\n            style={{ background: rlySeriesColor(item.series) }}\n          />\n          {requireText(item.label, \"ChartLegend item label\")}\n        </li>\n      ))}\n    </ul>\n  )\n}\n","@layer rly.components {\n  .root {\n    flex: none;\n  }\n  .horizontal {\n    block-size: 1px;\n    inline-size: 100%;\n  }\n  .vertical {\n    align-self: stretch;\n    inline-size: 1px;\n    min-block-size: var(--rly-space-20);\n  }\n  .subtle {\n    background: var(--rly-color-border-1);\n  }\n  .strong {\n    background: var(--rly-color-border-2);\n  }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./Divider.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\nexport const RLY_DIVIDER_VARIANTS = defineVariants({\n  orientation: {\n    horizontal: { className: style(\"horizontal\"), purpose: \"Separate stacked content\", tokens: [\"space-0\"] },\n    vertical: { className: style(\"vertical\"), purpose: \"Separate adjacent content\", tokens: [\"space-0\"] }\n  },\n  strength: {\n    subtle: { className: style(\"subtle\"), purpose: \"Quiet structural boundary\", tokens: [\"color-border-1\"] },\n    strong: { className: style(\"strong\"), purpose: \"Explicit structural boundary\", tokens: [\"color-border-2\"] }\n  }\n})\nexport const RLY_DIVIDER_DEFAULT_VARIANTS = defineVariants({ orientation: \"horizontal\", strength: \"subtle\" })\nexport type RlyDividerOrientation = keyof typeof RLY_DIVIDER_VARIANTS.orientation\nexport type RlyDividerStrength = keyof typeof RLY_DIVIDER_VARIANTS.strength\ntype DividerBaseProps = Omit<ComponentPropsWithRef<\"div\">, \"aria-label\" | \"children\" | \"role\">\nexport type DividerProps = DividerBaseProps & {\n  readonly orientation?: RlyDividerOrientation\n  readonly strength?: RlyDividerStrength\n} & ({ readonly decorative?: true; readonly label?: never } | { readonly decorative: false; readonly label: string })\n\n/** Separate content visually or, when explicitly labelled, semantically. */\nexport const Divider = ({\n  className,\n  decorative = true,\n  label,\n  orientation = \"horizontal\",\n  strength = \"subtle\",\n  ...props\n}: DividerProps): ReactElement => {\n  if (!decorative && label === undefined) throw new Error(\"Semantic Divider label must contain visible text\")\n  const accessibleLabel = decorative || label === undefined ? undefined : requireText(label, \"Semantic Divider label\")\n  return (\n    <div\n      {...props}\n      aria-hidden={decorative ? \"true\" : undefined}\n      aria-label={accessibleLabel}\n      aria-orientation={decorative ? undefined : orientation}\n      className={classNames(\n        style(\"root\"),\n        RLY_DIVIDER_VARIANTS.orientation[orientation].className,\n        RLY_DIVIDER_VARIANTS.strength[strength].className,\n        className\n      )}\n      role={decorative ? \"presentation\" : \"separator\"}\n    />\n  )\n}\n","@layer rly.components {\n  .root {\n    --rly-limit-track-ink: var(--rly-color-text-2);\n    background: var(--rly-color-surface-3);\n    border-radius: var(--rly-radius-tag);\n    display: block;\n    inline-size: 100%;\n    min-inline-size: var(--rly-space-48);\n    overflow: hidden;\n    position: relative;\n  }\n  .defaultSize {\n    block-size: var(--rly-space-12);\n  }\n  .slim {\n    block-size: var(--rly-space-6);\n  }\n  .fill {\n    background: var(--rly-limit-track-ink, var(--rly-color-text-2));\n    inset-block: 0;\n    inset-inline-start: 0;\n    position: absolute;\n  }\n  .root[data-tone=\"near\"] {\n    --rly-limit-track-ink: var(--rly-color-held-ink);\n  }\n  .root[data-tone=\"full\"] {\n    --rly-limit-track-ink: var(--rly-color-blocked-ink);\n  }\n  /*\n   * An old reading's empty track carries a faint 135° hatch, so even a 0% reading shows its age.\n   * It differs from no reading by angle (45°) and by the solid edge.\n   */\n  .root[data-stale=\"true\"] {\n    background: repeating-linear-gradient(135deg, var(--rly-color-border-2) 0 1px, transparent 1px 5px)\n      var(--rly-color-surface-3);\n  }\n  /* Old readings are hatched in the same ink, so the tone survives and the age is still visible. */\n  .root[data-stale=\"true\"] .fill {\n    background: repeating-linear-gradient(\n      135deg,\n      var(--rly-limit-track-ink, var(--rly-color-text-2)) 0 3px,\n      transparent 3px 6px\n    );\n  }\n  /*\n   * No reading is not an empty limit: a faint full-width hatch inside a dashed edge, so it never reads\n   * as 0%, and stays distinct from a stale reading, which hatches only its fill in the tone's ink.\n   */\n  .root[data-tone=\"unknown\"] {\n    background: repeating-linear-gradient(45deg, var(--rly-color-border-2) 0 1px, transparent 1px 5px)\n      var(--rly-color-surface-3);\n    outline: 1px dashed var(--rly-color-border-2);\n    outline-offset: -1px;\n  }\n  .projection {\n    border-block: 2px dotted var(--rly-color-held-ink);\n    box-sizing: border-box;\n    inset-block: 25%;\n    position: absolute;\n  }\n  /* A dark core on a light halo, so the mark reads over the empty track and over every fill. */\n  .near {\n    background: var(--rly-color-text-1);\n    box-shadow:\n      -1px 0 0 var(--rly-color-surface-1),\n      1px 0 0 var(--rly-color-surface-1);\n    inline-size: 1px;\n    inset-block: 0;\n    position: absolute;\n  }\n  /* The Storybook toolbar's forced-colours mode maps the tokens to system colours too; draw the same edge. */\n  :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"]) .root {\n    outline: 1px solid CanvasText;\n    outline-offset: -1px;\n  }\n  :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"]) .root[data-tone=\"unknown\"] {\n    outline-style: dashed;\n  }\n  @media (forced-colors: active) {\n    /*\n     * The system palette paints the empty track as Canvas, so an inset edge keeps the 0–100% scale\n     * visible without changing the track's geometry.\n     */\n    .root {\n      outline: 1px solid CanvasText;\n      outline-offset: -1px;\n    }\n    .root[data-stale=\"true\"] {\n      background: repeating-linear-gradient(135deg, CanvasText 0 1px, Canvas 1px 5px);\n      forced-color-adjust: none;\n    }\n    .root[data-tone=\"unknown\"] {\n      background: repeating-linear-gradient(45deg, CanvasText 0 1px, Canvas 1px 5px);\n      forced-color-adjust: none;\n      outline-style: dashed;\n    }\n    /* Keep the halo: forced colours drop box-shadow, and the tokens already map to system colours. */\n    .near {\n      forced-color-adjust: none;\n    }\n    /* Preserve the age cue with the user's palette when the browser removes background images. */\n    .root[data-stale=\"true\"] .fill {\n      background: repeating-linear-gradient(135deg, CanvasText 0 3px, Canvas 3px 6px);\n      forced-color-adjust: none;\n    }\n  }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./LimitTrack.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\nexport const RLY_LIMIT_TRACK_VARIANTS = defineVariants({\n  size: {\n    default: {\n      className: style(\"defaultSize\"),\n      purpose: \"A limit beside its numbers\",\n      tokens: [\"space-12\", \"radius-tag\"]\n    },\n    slim: { className: style(\"slim\"), purpose: \"A limit inside a dense row\", tokens: [\"space-6\", \"radius-tag\"] }\n  }\n})\nexport const RLY_LIMIT_TRACK_DEFAULT_VARIANTS = defineVariants({ size: \"default\" })\nexport type RlyLimitTrackSize = keyof typeof RLY_LIMIT_TRACK_VARIANTS.size\n/** How full a limit is: no reading, comfortable, past the near mark, or at the limit. */\nexport type RlyLimitTrackTone = \"unknown\" | \"ok\" | \"near\" | \"full\"\n\n/** A reading that is not a finite number (for example a failed division) is no reading at all. */\nconst readingOf = (value: number | null): number | null => (value !== null && Number.isFinite(value) ? value : null)\n\nconst requireFinite = (value: number, label: string): number => {\n  if (!Number.isFinite(value)) throw new Error(`${label} must be a finite number`)\n  return value\n}\n\n/**\n * Tone of a reading in percent against the near mark; 100% and above is full, a non-finite reading\n * is unknown, and a non-finite near mark throws, as it does on the component.\n */\nexport const limitTrackTone = (value: number | null, near: number): RlyLimitTrackTone => {\n  const mark = requireFinite(near, \"limitTrackTone near\")\n  const reading = readingOf(value)\n  return reading === null ? \"unknown\" : reading >= 100 ? \"full\" : reading >= mark ? \"near\" : \"ok\"\n}\n\nconst percent = (value: number): number => Math.min(100, Math.max(0, value))\n\ntype LimitTrackBaseProps = Omit<ComponentPropsWithRef<\"span\">, \"aria-label\" | \"children\" | \"role\">\nexport type LimitTrackProps = LimitTrackBaseProps & {\n  /**\n   * Latest reading in percent of the limit; `null` when there is none. Values past 100 fill the track.\n   * A non-finite value is drawn and announced as no reading.\n   */\n  readonly value: number | null\n  /** Where the caller expects the limit to stand later (for example at its reset), in percent. Non-finite draws none. */\n  readonly projected?: number\n  /** The near-limit mark in percent. Defaults to 80; a non-finite mark throws. */\n  readonly near?: number\n  /** The reading is old: it says how full the limit was, not how full it is. */\n  readonly stale?: boolean\n  readonly size?: RlyLimitTrackSize\n} & (\n    | { readonly decorative?: true; readonly label?: never; readonly valueText?: never }\n    | { readonly decorative: false; readonly label: string; readonly valueText: string }\n  )\n\n/**\n * A 0–100% limit track. The solid fill is the latest reading, a dotted extension shows a projected\n * level the caller computed, and a hairline marks the near threshold. A stale reading is hatched.\n * Decorative by default, because the caller prints the number beside it. A decorative track hides\n * everything it draws, so that adjacent text must also say when the reading is old and what the\n * projection is (for example \"61%, old reading\" or \"84%, about 103% at reset\"). Pass\n * `decorative={false}` with a label and the caller's own words for the value to expose it as a meter.\n * An unknown reading draws a faint full-width hatch in a dashed edge, never an empty (0%) track, and\n * when announced is a named image with the label and value description, without a numeric range.\n */\nexport const LimitTrack = ({\n  className,\n  decorative = true,\n  label,\n  near = 80,\n  projected,\n  size = RLY_LIMIT_TRACK_DEFAULT_VARIANTS.size,\n  stale = false,\n  value: rawValue,\n  valueText,\n  ...props\n}: LimitTrackProps): ReactElement => {\n  const value = readingOf(rawValue)\n  const nearMark = requireFinite(near, \"LimitTrack near\")\n  // An explicit `decorative={false}` is a promise to announce the track; a missing label or value\n  // text (possible from untyped callers) throws instead of quietly hiding it.\n  const accessible = !decorative\n  const accessibleLabel = accessible ? requireText(label ?? \"\", \"LimitTrack label\") : undefined\n  const accessibleValueText = accessible ? requireText(valueText ?? \"\", \"LimitTrack valueText\") : undefined\n  const meter = accessible && value !== null\n  const projection =\n    value !== null && projected !== undefined && Number.isFinite(projected) && projected > value\n      ? { start: percent(value), length: percent(projected) - percent(value) }\n      : null\n  return (\n    <span\n      {...props}\n      aria-hidden={accessible ? undefined : \"true\"}\n      aria-label={accessible && !meter ? `${accessibleLabel}: ${accessibleValueText}` : accessibleLabel}\n      aria-valuemax={meter ? 100 : undefined}\n      aria-valuemin={meter ? 0 : undefined}\n      aria-valuenow={meter && value !== null ? percent(value) : undefined}\n      aria-valuetext={meter ? accessibleValueText : undefined}\n      className={classNames(style(\"root\"), RLY_LIMIT_TRACK_VARIANTS.size[size].className, className)}\n      data-stale={stale ? \"true\" : undefined}\n      data-tone={limitTrackTone(value, nearMark)}\n      role={accessible ? (meter ? \"meter\" : \"img\") : undefined}\n    >\n      {value === null ? null : (\n        <span className={style(\"fill\")} data-part=\"fill\" style={{ inlineSize: `${percent(value)}%` }} />\n      )}\n      {projection === null ? null : (\n        <span\n          className={style(\"projection\")}\n          data-part=\"projection\"\n          style={{ inlineSize: `${projection.length}%`, insetInlineStart: `${projection.start}%` }}\n        />\n      )}\n      <span\n        className={style(\"near\")}\n        data-part=\"near\"\n        style={{ insetInlineStart: `min(${percent(nearMark)}%, 100% - 1px)` }}\n      />\n    </span>\n  )\n}\n","@layer rly.components {\n  .root {\n    align-items: flex-start;\n    /* Every tone keeps an edge, so the box survives forced colors, which drop backgrounds. */\n    border: 1px solid color-mix(in oklab, currentcolor 30%, transparent);\n    border-radius: var(--rly-radius-control);\n    box-sizing: border-box;\n    display: flex;\n    flex-wrap: wrap;\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    /* Row gap absorbs the action's negative block margin when it wraps below the message. */\n    gap: var(--rly-space-16) var(--rly-space-12);\n    margin: var(--rly-space-0);\n    max-inline-size: 100%;\n    padding: var(--rly-space-12);\n  }\n\n  .neutral {\n    background: var(--rly-color-surface-2);\n    border-color: var(--rly-color-border-1);\n    color: var(--rly-color-text-2);\n  }\n  .positive {\n    background: var(--rly-color-success-tint);\n    color: var(--rly-color-success-ink);\n  }\n  .critical {\n    background: var(--rly-color-blocked-tint);\n    color: var(--rly-color-blocked-ink);\n  }\n  .caution {\n    background: var(--rly-color-held-tint);\n    color: var(--rly-color-held-ink);\n  }\n  .progress {\n    background: var(--rly-color-deploying-tint);\n    color: var(--rly-color-deploying-ink);\n  }\n\n  .icon {\n    display: inline-flex;\n    flex: none;\n    /* Center the 16px glyph on the first line box. */\n    padding-block-start: calc((1lh - 16px) / 2);\n  }\n\n  .lead {\n    align-items: flex-start;\n    display: flex;\n    flex: 1 1 20ch;\n    gap: var(--rly-space-12);\n    min-inline-size: var(--rly-space-0);\n  }\n\n  .message {\n    flex: 1 1 0;\n    min-inline-size: var(--rly-space-0);\n    overflow-wrap: anywhere;\n  }\n  .message > :first-child {\n    margin-block-start: var(--rly-space-0);\n  }\n  .message > :last-child {\n    margin-block-end: var(--rly-space-0);\n  }\n\n  .action {\n    align-items: center;\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--rly-space-8);\n    /* Centre a compact control on the first text line without growing one-line notices. */\n    margin-block: calc((1lh - var(--rly-space-40)) / 2);\n    margin-inline-start: auto;\n  }\n}\n","import type { ComponentPropsWithRef, ReactElement, ReactNode } from \"react\"\nimport { Icon, type RlyIconName } from \"../foundations/Icon.js\"\nimport { classNames, cssClass, defineVariants } from \"../internal/component.js\"\nimport styles from \"./Notice.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\nexport const RLY_NOTICE_VARIANTS = defineVariants({\n  tone: {\n    neutral: {\n      className: style(\"neutral\"),\n      purpose: \"Neutral context\",\n      tokens: [\"color-text-2\", \"color-surface-2\", \"color-border-1\"]\n    },\n    positive: {\n      className: style(\"positive\"),\n      purpose: \"Completed outcome\",\n      tokens: [\"color-success-ink\", \"color-success-tint\"]\n    },\n    critical: {\n      className: style(\"critical\"),\n      purpose: \"Failure that needs attention\",\n      tokens: [\"color-blocked-ink\", \"color-blocked-tint\"]\n    },\n    caution: {\n      className: style(\"caution\"),\n      purpose: \"Limitation or warning\",\n      tokens: [\"color-held-ink\", \"color-held-tint\"]\n    },\n    progress: {\n      className: style(\"progress\"),\n      purpose: \"Work in progress\",\n      tokens: [\"color-deploying-ink\", \"color-deploying-tint\"]\n    }\n  }\n})\n\nexport const RLY_NOTICE_DEFAULT_VARIANTS = defineVariants({ tone: \"neutral\" })\nexport type RlyNoticeTone = keyof typeof RLY_NOTICE_VARIANTS.tone\nexport type RlyNoticeAnnouncement = \"off\" | \"polite\" | \"assertive\"\n\n// Neutral encodes nothing, so it carries no glyph unless the caller asks for one.\nconst toneIcons = {\n  neutral: undefined,\n  positive: \"check\",\n  critical: \"alert\",\n  caution: \"clock\",\n  progress: \"loader\"\n} satisfies Readonly<Record<RlyNoticeTone, RlyIconName | undefined>>\n\nexport type NoticeProps = Omit<ComponentPropsWithRef<\"div\">, \"aria-live\" | \"children\"> & {\n  readonly action?: ReactNode\n  readonly announce?: RlyNoticeAnnouncement\n  readonly children: ReactNode\n  readonly icon?: RlyIconName\n  readonly tone?: RlyNoticeTone\n}\n\n/**\n * Say one sentence of context or outcome inline, between controls and content.\n * Use `StatePanel` instead when the state needs a title and replaces a region.\n * The caller owns lifecycle: there is no dismiss control.\n *\n * The tone icon is decorative, so `children` must state the tone in words\n * (\"Sync failed: …\"), not rely on color and glyph.\n *\n * `announce` makes the notice a live region. A polite status region reliably announces\n * changes only once it is already mounted: mount it persistently and swap its children.\n * An assertive alert may announce as soon as it is inserted. Keep `announce=\"off\"`\n * for static text.\n *\n * @example\n * <Notice tone=\"caution\">Jira is read-only for this week.</Notice>\n * <Notice announce=\"assertive\" tone=\"critical\" action={<Button size=\"compact\">Retry</Button>}>\n *   Clockify rejected the entry.\n * </Notice>\n */\nexport const Notice = ({\n  action,\n  announce = \"off\",\n  children,\n  className,\n  icon,\n  tone = \"neutral\",\n  ...props\n}: NoticeProps): ReactElement => {\n  const glyph = icon ?? toneIcons[tone]\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\n  return (\n    <div\n      {...props}\n      aria-live={announce === \"off\" ? undefined : announce}\n      className={classNames(style(\"root\"), RLY_NOTICE_VARIANTS.tone[tone].className, className)}\n      role={role}\n    >\n      {/* Icon and message never separate; only the action wraps below them. */}\n      <div className={style(\"lead\")}>\n        {glyph === undefined ? null : (\n          <span aria-hidden=\"true\" className={style(\"icon\")}>\n            <Icon decorative name={glyph} size=\"small\" />\n          </span>\n        )}\n        <div className={style(\"message\")}>{children}</div>\n      </div>\n      {action === undefined ? null : <div className={style(\"action\")}>{action}</div>}\n    </div>\n  )\n}\n","@layer rly.components {\n  .root {\n    box-sizing: border-box;\n    color: var(--rly-color-text-1);\n    max-inline-size: 100%;\n    min-inline-size: var(--rly-space-0);\n  }\n\n  .tonePrimary {\n    background: var(--rly-color-surface-1);\n    border: 1px solid var(--rly-color-border-1);\n  }\n  .toneSecondary {\n    background: var(--rly-color-surface-2);\n  }\n  .toneTertiary {\n    background: var(--rly-color-surface-3);\n  }\n  .shapeCard {\n    border-radius: var(--rly-radius-control);\n  }\n  .shapeGrouped {\n    border-radius: var(--rly-radius-group);\n  }\n  .paddingNone {\n    padding: var(--rly-space-0);\n  }\n  .paddingCompact {\n    padding: var(--rly-space-16);\n  }\n  .paddingDefault {\n    padding: var(--rly-space-24);\n  }\n  .paddingSpacious {\n    padding: var(--rly-space-32);\n  }\n}\n","import { createElement, type ComponentPropsWithoutRef, type ReactElement, type ReactNode, type Ref } from \"react\"\nimport { classNames, cssClass, defineVariants } from \"../internal/component.js\"\nimport styles from \"./Surface.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\nexport const RLY_SURFACE_VARIANTS = defineVariants({\n  tone: {\n    primary: {\n      className: style(\"tonePrimary\"),\n      purpose: \"Primary bordered surface\",\n      tokens: [\"color-surface-1\", \"color-border-1\"]\n    },\n    secondary: { className: style(\"toneSecondary\"), purpose: \"Quiet secondary surface\", tokens: [\"color-surface-2\"] },\n    tertiary: { className: style(\"toneTertiary\"), purpose: \"Inset tertiary surface\", tokens: [\"color-surface-3\"] }\n  },\n  form: {\n    card: { className: style(\"shapeCard\"), purpose: \"Standard card geometry\", tokens: [\"radius-control\"] },\n    grouped: { className: style(\"shapeGrouped\"), purpose: \"Grouped content geometry\", tokens: [\"radius-group\"] }\n  },\n  padding: {\n    none: { className: style(\"paddingNone\"), purpose: \"Caller-owned internal layout\", tokens: [\"space-0\"] },\n    compact: { className: style(\"paddingCompact\"), purpose: \"Dense supporting content\", tokens: [\"space-16\"] },\n    default: { className: style(\"paddingDefault\"), purpose: \"Standard content\", tokens: [\"space-24\"] },\n    spacious: { className: style(\"paddingSpacious\"), purpose: \"Prominent grouped content\", tokens: [\"space-32\"] }\n  }\n})\nexport const RLY_SURFACE_DEFAULT_VARIANTS = defineVariants({ tone: \"primary\", form: \"card\", padding: \"default\" })\nexport type RlySurfaceTone = keyof typeof RLY_SURFACE_VARIANTS.tone\nexport type RlySurfaceForm = keyof typeof RLY_SURFACE_VARIANTS.form\nexport type RlySurfacePadding = keyof typeof RLY_SURFACE_VARIANTS.padding\nexport type RlySurfaceElement = \"div\" | \"section\" | \"article\" | \"aside\"\n\ntype RefTarget<Value> = Value extends Ref<infer Target> ? Target : never\ntype ExactRef<Expected, Value> =\n  Value extends Ref<Expected> ? (Expected extends RefTarget<Value> ? Value : never) : never\n\nexport type SurfaceProps<\n  Element extends RlySurfaceElement = \"div\",\n  ElementRef extends Ref<HTMLElementTagNameMap[Element]> = Ref<HTMLElementTagNameMap[Element]>\n> = Omit<ComponentPropsWithoutRef<Element>, \"children\" | \"color\"> & {\n  readonly as?: Element\n  readonly children: ReactNode\n  readonly padding?: RlySurfacePadding\n  readonly ref?: ExactRef<HTMLElementTagNameMap[Element], ElementRef>\n  readonly form?: RlySurfaceForm\n  readonly tone?: RlySurfaceTone\n}\n\n/** Render a quiet, non-interactive structural surface without elevation semantics. */\nexport const Surface = <\n  const Element extends RlySurfaceElement = \"div\",\n  ElementRef extends Ref<HTMLElementTagNameMap[Element]> = Ref<HTMLElementTagNameMap[Element]>\n>({\n  as,\n  children,\n  className,\n  form = \"card\",\n  padding = \"default\",\n  ref,\n  tone = \"primary\",\n  ...props\n}: SurfaceProps<Element, ElementRef>): ReactElement =>\n  createElement(\n    as ?? \"div\",\n    {\n      ...props,\n      className: classNames(\n        style(\"root\"),\n        RLY_SURFACE_VARIANTS.tone[tone].className,\n        RLY_SURFACE_VARIANTS.form[form].className,\n        RLY_SURFACE_VARIANTS.padding[padding].className,\n        className\n      ),\n      ref\n    },\n    children\n  )\n","@layer rly.components {\n  .root {\n    max-inline-size: 100%;\n    min-inline-size: var(--rly-space-0);\n  }\n\n  .list {\n    align-items: stretch;\n    background: var(--rly-color-surface-2);\n    border-radius: var(--rly-radius-field);\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--rly-space-2);\n    max-inline-size: 100%;\n    padding: var(--rly-space-4);\n  }\n\n  .trigger {\n    appearance: none;\n    background: var(--rly-color-surface-2);\n    border: var(--rly-space-0);\n    border-radius: var(--rly-radius-tag);\n    color: var(--rly-color-text-2);\n    cursor: pointer;\n    flex: 1 1 10rem;\n    max-inline-size: 100%;\n    min-inline-size: var(--rly-space-0);\n    overflow-wrap: anywhere;\n    padding: var(--rly-space-8) var(--rly-space-12);\n    position: relative;\n    text-align: center;\n  }\n\n  .trigger::after {\n    background: var(--rly-color-action-background);\n    block-size: var(--rly-space-2);\n    border-radius: var(--rly-radius-round);\n    content: \"\";\n    inset-block-end: var(--rly-space-2);\n    inset-inline: var(--rly-space-12);\n    opacity: 0;\n    position: absolute;\n  }\n\n  .trigger[data-state=\"active\"] {\n    background: var(--rly-color-surface-1);\n    color: var(--rly-color-text-1);\n  }\n\n  .trigger[data-state=\"active\"]::after {\n    opacity: 1;\n  }\n  .trigger:disabled {\n    cursor: not-allowed;\n    opacity: 0.58;\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      background: var(--rly-color-surface-3);\n      color: var(--rly-color-text-1);\n    }\n  }\n\n  @media (max-width: 30rem) {\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  .root {\n    margin: var(--rly-space-0);\n    min-inline-size: var(--rly-space-0);\n    overflow-wrap: anywhere;\n  }\n\n  .verdict,\n  .pageTitle,\n  .sectionTitle,\n  .cardTitle {\n    text-wrap: balance;\n  }\n\n  .bodyLarge,\n  .body {\n    text-wrap: pretty;\n  }\n\n  .verdict {\n    font: var(--rly-type-verdict-weight) var(--rly-type-verdict-size) / var(--rly-type-verdict-line-height)\n      var(--rly-type-verdict-font);\n    letter-spacing: var(--rly-type-verdict-tracking);\n  }\n\n  .pageTitle {\n    font: var(--rly-type-page-title-weight) var(--rly-type-page-title-size) / var(--rly-type-page-title-line-height)\n      var(--rly-type-page-title-font);\n    letter-spacing: var(--rly-type-page-title-tracking);\n  }\n\n  .sectionTitle {\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  }\n\n  .cardTitle {\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  }\n\n  .bodyLarge {\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    letter-spacing: var(--rly-type-body-large-tracking);\n  }\n\n  .body {\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    letter-spacing: var(--rly-type-body-tracking);\n  }\n\n  .label {\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    letter-spacing: var(--rly-type-label-tracking);\n  }\n\n  .meta {\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  }\n\n  .code {\n    font: var(--rly-type-code-weight) var(--rly-type-code-size) / var(--rly-type-code-line-height)\n      var(--rly-type-code-font);\n    font-variant-numeric: tabular-nums;\n    letter-spacing: var(--rly-type-code-tracking);\n    white-space: pre-wrap;\n  }\n\n  .tonePrimary {\n    color: var(--rly-color-text-1);\n  }\n  .toneSecondary {\n    color: var(--rly-color-text-2);\n  }\n  .toneTertiary {\n    color: var(--rly-color-text-3);\n  }\n  .toneInherit {\n    color: inherit;\n  }\n}\n","import {\n  createElement,\n  type ComponentPropsWithoutRef,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref\n} from \"react\"\nimport { classNames, cssClass, defineVariants } from \"../internal/component.js\"\nimport styles from \"./Text.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\nexport const RLY_TEXT_VARIANTS = defineVariants({\n  variant: {\n    verdict: { className: style(\"verdict\"), purpose: \"One restrained verdict thesis\", tokens: [\"type-verdict\"] },\n    \"page-title\": { className: style(\"pageTitle\"), purpose: \"Primary page title\", tokens: [\"type-page-title\"] },\n    \"section-title\": { className: style(\"sectionTitle\"), purpose: \"Section heading\", tokens: [\"type-section-title\"] },\n    \"card-title\": { className: style(\"cardTitle\"), purpose: \"Card or panel heading\", tokens: [\"type-card-title\"] },\n    \"body-large\": { className: style(\"bodyLarge\"), purpose: \"Leading explanatory copy\", tokens: [\"type-body-large\"] },\n    body: { className: style(\"body\"), purpose: \"Default interface copy\", tokens: [\"type-body\"] },\n    label: { className: style(\"label\"), purpose: \"Control and metadata labels\", tokens: [\"type-label\"] },\n    meta: { className: style(\"meta\"), purpose: \"Supporting metadata\", tokens: [\"type-meta\"] },\n    code: { className: style(\"code\"), purpose: \"Code and tabular data\", tokens: [\"type-code\"] }\n  },\n  tone: {\n    primary: { className: style(\"tonePrimary\"), purpose: \"Primary readable text\", tokens: [\"color-text-1\"] },\n    secondary: { className: style(\"toneSecondary\"), purpose: \"Supporting text\", tokens: [\"color-text-2\"] },\n    tertiary: { className: style(\"toneTertiary\"), purpose: \"Restricted tertiary text\", tokens: [\"color-text-3\"] },\n    inherit: { className: style(\"toneInherit\"), purpose: \"Inherit semantic context\", tokens: [] }\n  }\n})\n\nexport const RLY_TEXT_DEFAULT_VARIANTS = defineVariants({ variant: \"body\", tone: \"primary\" })\nexport type RlyTextVariant = keyof typeof RLY_TEXT_VARIANTS.variant\nexport type RlyTextTone = keyof typeof RLY_TEXT_VARIANTS.tone\nexport type RlyTextElement =\n  | \"h1\"\n  | \"h2\"\n  | \"h3\"\n  | \"h4\"\n  | \"h5\"\n  | \"h6\"\n  | \"p\"\n  | \"span\"\n  | \"strong\"\n  | \"small\"\n  | \"code\"\n  | \"pre\"\n  | \"time\"\n  | \"li\"\n  | \"dt\"\n  | \"dd\"\n\ntype HeadingVariant = \"page-title\" | \"section-title\" | \"card-title\"\ntype HeadingElement = \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"span\"\ntype OtherVariant = Exclude<RlyTextVariant, HeadingVariant>\ntype RefTarget<Value> = Value extends Ref<infer Target> ? Target : never\ntype ExactRef<Expected, Value> =\n  Value extends Ref<Expected> ? (Expected extends RefTarget<Value> ? Value : never) : never\ntype TextOwnProps = {\n  readonly children: ReactNode\n  readonly tone?: RlyTextTone\n}\ntype ExplicitVariantProps<Element extends RlyTextElement> =\n  { readonly variant?: OtherVariant } | (Element extends HeadingElement ? { readonly variant: HeadingVariant } : never)\ntype ExplicitTextProps<Element extends RlyTextElement, ElementRef extends Ref<HTMLElementTagNameMap[Element]>> = Omit<\n  ComponentPropsWithoutRef<Element>,\n  \"as\" | \"children\" | \"color\"\n> &\n  TextOwnProps &\n  ExplicitVariantProps<Element> & {\n    readonly as: Element\n    readonly ref?: ExactRef<HTMLElementTagNameMap[Element], ElementRef>\n  }\ntype ImplicitTextProps = Omit<HTMLAttributes<HTMLElement>, \"children\" | \"color\"> &\n  TextOwnProps & {\n    readonly as?: never\n    readonly ref?: never\n    readonly variant?: OtherVariant\n  }\nexport type TextProps<\n  Element extends RlyTextElement = RlyTextElement,\n  ElementRef extends Ref<HTMLElementTagNameMap[Element]> = Ref<HTMLElementTagNameMap[Element]>\n> = ExplicitTextProps<Element, ElementRef> | ImplicitTextProps\n\ntype TextComponent = <\n  const Element extends RlyTextElement = RlyTextElement,\n  ElementRef extends Ref<HTMLElementTagNameMap[Element]> = Ref<HTMLElementTagNameMap[Element]>\n>(\n  props: TextProps<Element, ElementRef>\n) => ReactElement\ntype TextRuntimeProps = Omit<HTMLAttributes<HTMLElement>, \"color\"> &\n  TextOwnProps & {\n    readonly as?: RlyTextElement\n    readonly ref?: Ref<HTMLElement>\n    readonly variant?: RlyTextVariant\n  }\n\nconst defaultElement = (variant: RlyTextVariant): RlyTextElement =>\n  variant === \"code\" ? \"code\" : variant === \"verdict\" ? \"p\" : variant === \"label\" || variant === \"meta\" ? \"span\" : \"p\"\n\n/** Render semantic typography while keeping visual role separate from document structure. */\nconst renderText = ({\n  as,\n  children,\n  className,\n  ref,\n  tone = RLY_TEXT_DEFAULT_VARIANTS.tone,\n  variant = RLY_TEXT_DEFAULT_VARIANTS.variant,\n  ...props\n}: TextRuntimeProps): ReactElement =>\n  createElement(\n    as ?? defaultElement(variant),\n    {\n      ...props,\n      className: classNames(\n        style(\"root\"),\n        RLY_TEXT_VARIANTS.variant[variant].className,\n        RLY_TEXT_VARIANTS.tone[tone].className,\n        className\n      ),\n      ref\n    },\n    children\n  )\n\nexport const Text: TextComponent = renderText\n","@layer rly.components {\n  /* A header control sizes to its longest option instead of filling the row. */\n  .intrinsic {\n    inline-size: max-content;\n    min-inline-size: calc(var(--rly-space-96) + var(--rly-space-48));\n  }\n}\n","import type { ReactElement } from \"react\"\nimport { decodeRlyTheme, RLY_THEME_NAMES, type RlyTheme } from \"../foundations/ThemeProvider.js\"\nimport { Field } from \"./Field.js\"\nimport { classNames, cssClass } from \"../internal/component.js\"\nimport { type RlySelectOption, type RlySelectSize, Select } from \"./Select.js\"\nimport styles from \"./ThemeSelect.module.css\"\n\nconst themeLabels = {\n  system: \"System\",\n  light: \"Light\",\n  dark: \"Dark\"\n} satisfies Readonly<Record<RlyTheme, string>>\n\nconst themeOptions: ReadonlyArray<RlySelectOption> = RLY_THEME_NAMES.map((value) => ({\n  label: themeLabels[value],\n  value\n}))\n\nexport type RlyThemeSelectLabelVisibility = \"visible\" | \"hidden\"\n\nexport interface ThemeSelectProps {\n  readonly className?: string\n  readonly label?: string\n  readonly labelVisibility?: RlyThemeSelectLabelVisibility\n  readonly onValueChange: (theme: RlyTheme) => void\n  readonly size?: RlySelectSize\n  readonly value: RlyTheme\n}\n\n/**\n * Let the viewer choose the system, light, or dark theme. Controlled; pair it with\n * `useStoredTheme` to remember the choice. Built on rly `Select` so every dropdown in\n * a product looks and behaves the same.\n *\n * Settings pages show the label and fill the field width. Compact headers pass\n * `labelVisibility=\"hidden\"`, which keeps the name for assistive technology through\n * `aria-label` and sizes the trigger to its longest option.\n *\n * @example\n * const [theme, setTheme] = useStoredTheme(\"jcf_theme\", browserStorage)\n * <ThemeSelect labelVisibility=\"hidden\" onValueChange={setTheme} size=\"compact\" value={theme} />\n */\nexport const ThemeSelect = ({\n  className,\n  label = \"Appearance\",\n  labelVisibility = \"visible\",\n  onValueChange,\n  size = \"compact\",\n  value\n}: ThemeSelectProps): ReactElement => {\n  const onChange = (next: string): void => {\n    // Select only reports values from themeOptions, so decoding always succeeds.\n    const theme = decodeRlyTheme(next)\n    if (theme !== undefined) onValueChange(theme)\n  }\n\n  if (labelVisibility === \"hidden\") {\n    return (\n      <Select\n        aria-label={label}\n        className={classNames(cssClass(styles, \"intrinsic\"), className)}\n        onValueChange={onChange}\n        options={themeOptions}\n        size={size}\n        value={value}\n      />\n    )\n  }\n  return (\n    <Field {...(className === undefined ? {} : { className })} label={label} size={size}>\n      {(controlProps) => (\n        <Select {...controlProps} onValueChange={onChange} options={themeOptions} size={size} value={value} />\n      )}\n    </Field>\n  )\n}\n","@layer rly.components {\n  .root {\n    background: var(--rly-color-surface-2);\n    border-radius: var(--rly-radius-field);\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--rly-space-2);\n    max-inline-size: 100%;\n    padding: var(--rly-space-2);\n  }\n\n  .item {\n    appearance: none;\n    background: transparent;\n    border: var(--rly-space-0);\n    border-radius: var(--rly-radius-tag);\n    color: var(--rly-color-text-2);\n    cursor: pointer;\n    font: inherit;\n    padding-inline: var(--rly-space-12);\n    white-space: nowrap;\n  }\n\n  .item[data-state=\"checked\"] {\n    background: var(--rly-color-surface-1);\n    box-shadow: inset 0 0 0 1px var(--rly-color-border-2);\n    color: var(--rly-color-text-1);\n  }\n\n  .item:focus-visible {\n    outline: 2px solid var(--rly-color-focus);\n    outline-offset: 1px;\n  }\n\n  .defaultSize .item {\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-space-40);\n  }\n\n  .compact .item {\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    min-block-size: var(--rly-space-32);\n    padding-inline: var(--rly-space-8);\n  }\n\n  /* Fingers need a bigger target than a pointer, whichever size the row uses. */\n  @media (pointer: coarse) {\n    .defaultSize .item,\n    .compact .item {\n      min-block-size: calc(var(--rly-space-40) + var(--rly-space-4));\n    }\n  }\n\n  @media (hover: hover) {\n    .item:not([data-state=\"checked\"]):hover {\n      background: var(--rly-color-surface-3);\n      color: var(--rly-color-text-1);\n    }\n  }\n\n  @media (forced-colors: active) {\n    .item[data-state=\"checked\"] {\n      outline: 2px solid CanvasText;\n    }\n  }\n}\n","import { type ComponentPropsWithRef, type KeyboardEvent, type ReactElement, useRef } from \"react\"\nimport { RadioGroup as RadixRadioGroup } from \"radix-ui\"\nimport { classNames, cssClass, defineVariants, requireText } from \"../internal/component.js\"\nimport styles from \"./ToggleGroup.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n\nexport const RLY_TOGGLE_GROUP_VARIANTS = defineVariants({\n  size: {\n    compact: {\n      className: style(\"compact\"),\n      purpose: \"Dense filter rows beside other controls\",\n      tokens: [\"type-meta\", \"space-32\", \"space-2\"]\n    },\n    default: {\n      className: style(\"defaultSize\"),\n      purpose: \"Standard view and filter choices\",\n      tokens: [\"type-label\", \"space-40\", \"space-2\"]\n    }\n  }\n})\n\nexport const RLY_TOGGLE_GROUP_DEFAULT_VARIANTS = defineVariants({ size: \"default\" })\nexport type RlyToggleGroupSize = keyof typeof RLY_TOGGLE_GROUP_VARIANTS.size\n\n/** One visibly labelled option. */\nexport interface RlyToggleItem {\n  readonly label: string\n  readonly value: string\n}\n\n/** Props for a controlled, single-select segmented choice. */\nexport type ToggleGroupProps = Omit<\n  ComponentPropsWithRef<\"div\">,\n  \"aria-label\" | \"children\" | \"defaultValue\" | \"dir\" | \"onChange\"\n> & {\n  /** Accessible name for the group, such as the filter it sets. */\n  readonly \"aria-label\": string\n  readonly items: ReadonlyArray<RlyToggleItem>\n  readonly onValueChange: (value: string) => void\n  readonly size?: RlyToggleGroupSize\n  readonly value: string\n}\n\n/** How far an arrow key moves the choice; null for any other key. */\nconst stepOf = (key: string): -1 | 1 | null =>\n  key === \"ArrowLeft\" || key === \"ArrowUp\" ? -1 : key === \"ArrowRight\" || key === \"ArrowDown\" ? 1 : null\n\nconst validateItems = (items: ReadonlyArray<RlyToggleItem>, value: string): void => {\n  const values = new Set<string>()\n  for (const item of items) {\n    const itemValue = requireText(item.value, \"ToggleGroup item value\")\n    requireText(item.label, `ToggleGroup item label for ${itemValue}`)\n    if (values.has(itemValue)) throw new Error(`ToggleGroup item values must be unique: ${itemValue}`)\n    values.add(itemValue)\n  }\n  if (!values.has(value)) throw new Error(`ToggleGroup value must identify an option: ${value}`)\n}\n\n/**\n * Choose one of a few peer options, such as a range or a measure, as a radio group: exactly one\n * option is always on, pressing it again changes nothing, and arrow keys move to the next option\n * and choose it.\n */\nexport const ToggleGroup = ({\n  \"aria-label\": ariaLabel,\n  className,\n  items,\n  onValueChange,\n  ref,\n  size = \"default\",\n  value,\n  ...props\n}: ToggleGroupProps): ReactElement => {\n  const accessibleLabel = requireText(ariaLabel, \"ToggleGroup aria-label\")\n  validateItems(items, value)\n  const options = useRef(new Map<string, HTMLButtonElement>())\n  // Radix moves focus a tick after the key and only chooses while the key is still down, so a quick\n  // tap would move focus without choosing. Arrows are handled here: the next option is chosen and\n  // focused in the same keystroke, wrapping at the ends.\n  const choose = (event: KeyboardEvent<HTMLButtonElement>, from: number) => {\n    const step = stepOf(event.key)\n    if (step === null) return\n    event.preventDefault()\n    const next = items[(from + step + items.length) % items.length]\n    if (next === undefined) return\n    // Landing on the chosen option (a group of one, or focus that had wandered off it) is no change\n    // to report, but focus still moves there.\n    if (next.value !== value) onValueChange(next.value)\n    options.current.get(next.value)?.focus()\n  }\n  return (\n    <RadixRadioGroup.Root\n      {...props}\n      aria-label={accessibleLabel}\n      className={classNames(style(\"root\"), RLY_TOGGLE_GROUP_VARIANTS.size[size].className, className)}\n      loop\n      onValueChange={onValueChange}\n      orientation=\"horizontal\"\n      ref={ref}\n      value={value}\n    >\n      {items.map((item, index) => (\n        <RadixRadioGroup.Item\n          className={style(\"item\")}\n          key={item.value}\n          onKeyDown={(event) => choose(event, index)}\n          ref={(element) => {\n            if (element === null) options.current.delete(item.value)\n            else options.current.set(item.value, element)\n          }}\n          value={item.value}\n        >\n          {item.label}\n        </RadixRadioGroup.Item>\n      ))}\n    </RadixRadioGroup.Root>\n  )\n}\n","@layer rly.components {\n  .root {\n    color: var(--rly-color-text-2);\n    display: flex;\n    flex-wrap: wrap;\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    gap: var(--rly-space-6) var(--rly-space-16);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n  .item {\n    align-items: center;\n    display: inline-flex;\n    gap: var(--rly-space-6);\n  }\n  /* Same two-tone mark as LimitTrack. */\n  .near {\n    background: var(--rly-color-text-1);\n    box-shadow:\n      -1px 0 0 var(--rly-color-surface-1),\n      1px 0 0 var(--rly-color-surface-1);\n    block-size: var(--rly-space-12);\n    inline-size: 1px;\n  }\n  .projected {\n    border-block: 2px dotted var(--rly-color-held-ink);\n    block-size: var(--rly-space-6);\n    box-sizing: border-box;\n    inline-size: var(--rly-space-16);\n  }\n  .stale {\n    background: repeating-linear-gradient(135deg, var(--rly-color-text-2) 0 3px, transparent 3px 6px);\n    block-size: var(--rly-space-8);\n    border-radius: var(--rly-radius-tag);\n    inline-size: var(--rly-space-16);\n  }\n  /* Same faint hatch and dashed edge as a LimitTrack with no reading. */\n  .unknown {\n    background: repeating-linear-gradient(45deg, var(--rly-color-border-2) 0 1px, transparent 1px 5px)\n      var(--rly-color-surface-3);\n    block-size: var(--rly-space-8);\n    border-radius: var(--rly-radius-tag);\n    inline-size: var(--rly-space-16);\n    outline: 1px dashed var(--rly-color-border-2);\n    outline-offset: -1px;\n  }\n  /* The Storybook toolbar's forced-colours mode: the same edges as under the media query. */\n  :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"]) .stale {\n    outline: 1px solid CanvasText;\n    outline-offset: -1px;\n  }\n  :where([data-forced-colors=\"active\"], [data-rly-forced-colors=\"active\"]) .unknown {\n    outline: 1px dashed CanvasText;\n  }\n  @media (forced-colors: active) {\n    /* Keep the halo: forced colours drop box-shadow, and the tokens already map to system colours. */\n    .near {\n      forced-color-adjust: none;\n    }\n    /* Match the system-colour hatch on stale LimitTracks. */\n    .stale {\n      background: repeating-linear-gradient(135deg, CanvasText 0 3px, Canvas 3px 6px);\n      forced-color-adjust: none;\n      outline: 1px solid CanvasText;\n      outline-offset: -1px;\n    }\n    .unknown {\n      background: repeating-linear-gradient(45deg, CanvasText 0 1px, Canvas 1px 5px);\n      forced-color-adjust: none;\n      outline: 1px dashed CanvasText;\n    }\n  }\n}\n","import type { ComponentPropsWithRef, ReactElement } from \"react\"\nimport { classNames, cssClass, requireText } from \"../internal/component.js\"\nimport styles from \"./TrackKey.module.css\"\n\nconst style = (name: string): string => cssClass(styles, name)\n/** The marks a LimitTrack can draw. */\nexport const RLY_TRACK_KEY_MARKS: readonly [\"near\", \"projected\", \"stale\", \"unknown\"] = [\n  \"near\",\n  \"projected\",\n  \"stale\",\n  \"unknown\"\n]\nexport type RlyTrackKeyMark = (typeof RLY_TRACK_KEY_MARKS)[number]\n\n/** One mark and the caller's words for it. */\nexport interface RlyTrackKeyItem {\n  readonly mark: RlyTrackKeyMark\n  readonly label: string\n}\n\ntype TrackKeyBaseProps = Omit<ComponentPropsWithRef<\"ul\">, \"aria-label\" | \"children\">\nexport type TrackKeyProps = TrackKeyBaseProps & {\n  /** Names the list for assistive technology, for example \"What the track marks mean\". */\n  readonly label: string\n  /** Only the marks the tracks above actually draw, in reading order. */\n  readonly items: ReadonlyArray<RlyTrackKeyItem>\n}\n\n/** One line under a set of LimitTracks explaining their marks; each mark sits before its own words. */\nexport const TrackKey = ({ className, items, label, ...props }: TrackKeyProps): ReactElement => {\n  if (items.length === 0) throw new Error(\"TrackKey needs at least one mark to explain\")\n  const marks = new Set<RlyTrackKeyMark>()\n  for (const item of items) {\n    if (marks.has(item.mark)) throw new Error(`TrackKey marks must be unique: ${item.mark}`)\n    marks.add(item.mark)\n  }\n  return (\n    // Flex styling with no list markers drops list semantics in WebKit, so the role is explicit.\n    <ul\n      {...props}\n      aria-label={requireText(label, \"TrackKey label\")}\n      className={classNames(style(\"root\"), className)}\n      role=\"list\"\n    >\n      {items.map((item) => (\n        <li className={style(\"item\")} key={item.mark}>\n          <span aria-hidden=\"true\" className={style(item.mark)} data-mark={item.mark} />\n          {requireText(item.label, \"TrackKey item label\")}\n        </li>\n      ))}\n    </ul>\n  )\n}\n"],"mappings":"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"}

package/dist/styles.css

@@ -1,4 +1,4 @@
-@layer rly.fonts, rly.tokens, rly.reset, rly.base, rly.components;
+@layer rly.fonts, rly.tokens, rly.reset, rly.base, rly.components, rly.state;
 
 @import "./fonts.css" layer(rly.fonts);
 @import "./generated-tokens.css";

package/dist/tokens/index.js

@@ -1,4 +1,4 @@
-import { a as e, i as t, n, r, t as i } from "../tokens-CjK9bxo7.js";
+import { a as e, i as t, n, r, t as i } from "../tokens-DaF1m6rr.js";
 export { i as RLY_COLOR_TOKEN_NAMES, n as RLY_MOTION_TOKEN_NAMES, r as RLY_RADIUS_TOKEN_NAMES, t as RLY_SPACE_TOKEN_NAMES, e as RLY_TYPE_TOKEN_NAMES };
 
 //# sourceMappingURL=index.js.map

package/dist/{tokens-CjK9bxo7.js → tokens-DaF1m6rr.js}

@@ -1,5 +1,5 @@
 //#region src/tokens/semantic-tokens.ts
-var e = (e) => e, t = e(/* @__PURE__ */ "canvas.surface-1.surface-2.surface-3.text-1.text-2.text-3.border-1.border-2.action-background.action-foreground.focus.agent.success-ink.success-tint.blocked-ink.blocked-tint.held-ink.held-tint.deploying-ink.deploying-tint.service-codecommit.service-codepipeline.service-jira.service-confluence.service-clockify".split(".")), n = e([
+var e = (e) => e, t = e(/* @__PURE__ */ "canvas.surface-1.surface-2.surface-3.text-1.text-2.text-3.border-1.border-2.action-background.action-foreground.focus.agent.success-ink.success-tint.blocked-ink.blocked-tint.held-ink.held-tint.deploying-ink.deploying-tint.service-codecommit.service-codepipeline.service-jira.service-confluence.service-clockify.series-1.series-2.series-3.series-4.series-5.series-6.series-7.series-8.series-other".split(".")), n = e([
 	"0",
 	"2",
 	"4",
@@ -41,4 +41,4 @@ var e = (e) => e, t = e(/* @__PURE__ */ "canvas.surface-1.surface-2.surface-3.te
 //#endregion
 export { i as a, n as i, a as n, r, t };
 
-//# sourceMappingURL=tokens-CjK9bxo7.js.map
+//# sourceMappingURL=tokens-DaF1m6rr.js.map

package/dist/tokens-DaF1m6rr.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens-DaF1m6rr.js","names":["tokenNames","names","RLY_COLOR_TOKEN_NAMES","RLY_SPACE_TOKEN_NAMES","RLY_RADIUS_TOKEN_NAMES","RLY_TYPE_TOKEN_NAMES","RLY_MOTION_TOKEN_NAMES"],"sources":["../src/tokens/semantic-tokens.ts"],"sourcesContent":["// @generated by scripts/generate-contract.ts; do not edit.\nconst tokenNames = <const Names extends ReadonlyArray<string>>(names: Names): Names => names\n\nexport const RLY_COLOR_TOKEN_NAMES = tokenNames([\n  \"canvas\",\n  \"surface-1\",\n  \"surface-2\",\n  \"surface-3\",\n  \"text-1\",\n  \"text-2\",\n  \"text-3\",\n  \"border-1\",\n  \"border-2\",\n  \"action-background\",\n  \"action-foreground\",\n  \"focus\",\n  \"agent\",\n  \"success-ink\",\n  \"success-tint\",\n  \"blocked-ink\",\n  \"blocked-tint\",\n  \"held-ink\",\n  \"held-tint\",\n  \"deploying-ink\",\n  \"deploying-tint\",\n  \"service-codecommit\",\n  \"service-codepipeline\",\n  \"service-jira\",\n  \"service-confluence\",\n  \"service-clockify\",\n  \"series-1\",\n  \"series-2\",\n  \"series-3\",\n  \"series-4\",\n  \"series-5\",\n  \"series-6\",\n  \"series-7\",\n  \"series-8\",\n  \"series-other\"\n])\nexport type RlyColorToken = (typeof RLY_COLOR_TOKEN_NAMES)[number]\n\nexport const RLY_SPACE_TOKEN_NAMES = tokenNames([\n  \"0\",\n  \"2\",\n  \"4\",\n  \"6\",\n  \"8\",\n  \"12\",\n  \"16\",\n  \"20\",\n  \"24\",\n  \"32\",\n  \"40\",\n  \"48\",\n  \"64\",\n  \"80\",\n  \"96\"\n])\nexport type RlySpaceToken = (typeof RLY_SPACE_TOKEN_NAMES)[number]\n\nexport const RLY_RADIUS_TOKEN_NAMES = tokenNames([\n  \"tag\",\n  \"field\",\n  \"control\",\n  \"group\",\n  \"overlay\",\n  \"round\"\n])\nexport type RlyRadiusToken = (typeof RLY_RADIUS_TOKEN_NAMES)[number]\n\nexport const RLY_TYPE_TOKEN_NAMES = tokenNames([\n  \"verdict\",\n  \"page-title\",\n  \"section-title\",\n  \"card-title\",\n  \"body-large\",\n  \"body\",\n  \"label\",\n  \"meta\",\n  \"code\"\n])\nexport type RlyTypeToken = (typeof RLY_TYPE_TOKEN_NAMES)[number]\n\nexport const RLY_MOTION_TOKEN_NAMES = tokenNames([\n  \"fast\",\n  \"standard\",\n  \"deliberate\",\n  \"slow\"\n])\nexport type RlyMotionToken = (typeof RLY_MOTION_TOKEN_NAMES)[number]\n"],"mappings":";AACA,IAAMA,KAAyD,MAAwBC,GAE1EC,IAAwBF,EAAW,uaAoChD,CAAC,GAGYG,IAAwBH,EAAW;CAC9C;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,GAGYI,IAAyBJ,EAAW;CAC/C;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,GAGYK,IAAuBL,EAAW;CAC7C;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,GAGYM,IAAyBN,EAAW;CAC/C;CACA;CACA;CACA;AACF,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knpkv/rly",
-  "version": "0.6.1",
+  "version": "0.9.0",
   "description": "Release-oriented design system for human and agent collaboration",
   "license": "MIT",
   "author": "knpkv",
@@ -96,7 +96,8 @@
     "tsx": "^4.23.15",
     "typescript": "npm:@typescript/typescript6@^6.0.2",
     "vite": "^8.3.2",
-    "vitest": "^5.0.3"
+    "vitest": "^5.0.3",
+    "@knpkv/storybook-config": "0.0.0"
   },
   "dependencies": {
     "@fontsource-variable/geist": "5.3.0",