@ps1ui/core 0.0.1 → 0.2.0

package/README.md

@@ -0,0 +1,49 @@
+<h1 align="center">
+@ps1ui/core
+</h1>
+
+<p align="center">
+<i>For engineers who think in monospace.</i>
+</p>
+
+<p align="center">
+<a href="https://koki-develop.github.io/ps1ui/">Documentation</a> | <a href="https://koki-develop.github.io/ps1ui/getting-started/">Getting Started</a> | <a href="https://koki-develop.github.io/ps1ui/components/">Components</a> | <a href="https://koki-develop.github.io/ps1ui/storybook/">Storybook</a>
+</p>
+
+## Install
+
+React 19 is a peer dependency — install it alongside the package.
+
+```bash
+pnpm add @ps1ui/core react react-dom
+```
+
+## Getting Started
+
+Import the stylesheet once at your app's entry point. The JS entry ships no styles — the CSS brings the design tokens, the dark canvas, and every component's styles.
+
+```tsx
+import "@ps1ui/core/styles.css";
+```
+
+Wrap your tree in `PS1Root`. It establishes the container-query context that responsive props resolve against — without it, responsive props silently fall back to their `base` values.
+
+```tsx
+import "@ps1ui/core/styles.css";
+import { PS1Root, Button, Heading } from "@ps1ui/core";
+
+export function App() {
+  return (
+    <PS1Root>
+      <Heading level={1}>Hello, PS1 UI</Heading>
+      <Button variant="primary">Click me</Button>
+    </PS1Root>
+  );
+}
+```
+
+Browse the full component catalog at [koki-develop.github.io/ps1ui/components](https://koki-develop.github.io/ps1ui/components/).
+
+## License
+
+[MIT](./LICENSE)

package/dist/base.css

@@ -19,6 +19,17 @@
   --ps1ui-color-primary-active: #3fb950;
   --ps1ui-color-primary-fg: #0b0f14;
   --ps1ui-color-accent: #ffa657;
+  /* Destructive / error signalling. Hue sits in the rose-coral band the code
+     palette already inhabits (--ps1ui-code-keyword / -tag / -deleted) so the
+     surface reads as one system; luminance is tuned so the base color hits
+     ≥ 4.5:1 vs BOTH --ps1ui-color-bg and --ps1ui-color-surface (verified by
+     Text.contrast.test.tsx) and danger-fg on each danger-* fill hits the
+     same threshold (verified by Button.contrast.test.tsx). Hover/active
+     progressively darken while staying above contrast. */
+  --ps1ui-color-danger: #ff7d8d;
+  --ps1ui-color-danger-hover: #f0637a;
+  --ps1ui-color-danger-active: #e04a60;
+  --ps1ui-color-danger-fg: #0b0f14;
   --ps1ui-color-focus-ring-soft: color-mix(in srgb, var(--ps1ui-color-primary) 14%, transparent);
   --ps1ui-shadow-focus-ring: 0 0 0 3px var(--ps1ui-color-focus-ring-soft);
 
@@ -88,6 +99,7 @@
 
   --ps1ui-transition-fast: 120ms ease;
 }
+
 /* ==========================================================================
  * Reset
  * --------------------------------------------------------------------------
@@ -107,6 +119,7 @@
  * layouts unless you set display:inline explicitly), <ul>/<ol> lose their
  * bullets. Locked in by src/styles/reset.test.tsx.
  * ========================================================================== */
+
 /* Box model + border baseline. Applied to `*` only — NOT to ::before/::after
    /::backdrop/::file-selector-button. Pseudo-elements with border-drawn
    glyphs (the classic rotated-L checkmark, tooltip carets, radio-dot rings)
@@ -120,6 +133,7 @@
   box-sizing: border-box;
   border: 0 solid;
 }
+
 body,
 blockquote,
 dl,
@@ -140,6 +154,7 @@ pre,
 ul {
   margin: 0;
 }
+
 fieldset,
 legend,
 menu,
@@ -147,6 +162,7 @@ ol,
 ul {
   padding: 0;
 }
+
 html {
   color-scheme: dark;
   line-height: 1.5;
@@ -157,11 +173,13 @@ html {
        tab-size: 4;
   text-rendering: optimizeLegibility;
 }
+
 body {
   min-height: 100dvh;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
+
 /* Heading responsibility belongs to <Heading>; raw h1..h6 inherit so a bare
    <h1> outside <Heading> doesn't blow up to the UA default. */
 h1,
@@ -175,15 +193,18 @@ h6 {
   text-wrap: balance;
   overflow-wrap: break-word;
 }
+
 p {
   text-wrap: pretty;
   overflow-wrap: break-word;
 }
+
 ol,
 ul,
 menu {
   list-style: none;
 }
+
 img,
 svg,
 video,
@@ -195,17 +216,20 @@ object {
   display: block;
   vertical-align: middle;
 }
+
 img,
 video {
   max-width: 100%;
   height: auto;
 }
+
 /* Anchor responsibility belongs to <Anchor>; raw <a> inherits color/decoration
    so it doesn't paint as UA blue underline against the dark canvas. */
 a {
   color: inherit;
   text-decoration: inherit;
 }
+
 /* UA still refuses to inherit font/color into form controls in 2026.
    Inherit font-feature-settings / font-variation-settings too so JetBrains
    Mono Variable's axes stay live inside <input> / <textarea>. */
@@ -224,13 +248,16 @@ textarea,
   border-radius: 0;
   opacity: 1;
 }
+
 :where(select:is([multiple], [size])) optgroup {
   font-weight: bolder;
 }
+
 button,
 select {
   text-transform: none;
 }
+
 button,
 input:where([type="button"], [type="reset"], [type="submit"]),
 ::file-selector-button {
@@ -238,12 +265,15 @@ input:where([type="button"], [type="reset"], [type="submit"]),
        appearance: button;
   -webkit-appearance: button;
 }
+
 button {
   cursor: pointer;
 }
+
 textarea {
   resize: vertical;
 }
+
 /* `in srgb` for consistency with the library's other color-mix calls. The
    space is irrelevant when mixing with `transparent` (premultiplied-alpha
    interpolation, CSS Color 4), so diverging from Tailwind Preflight's oklab
@@ -256,23 +286,28 @@ textarea {
   opacity: 1;
   color: color-mix(in srgb, currentcolor 55%, transparent);
 }
+
 ::-webkit-date-and-time-value {
   min-height: 1lh;
   text-align: inherit;
 }
+
 ::-webkit-datetime-edit {
   display: inline-flex;
   padding: 0;
 }
+
 ::-webkit-datetime-edit-fields-wrapper {
   padding: 0;
 }
+
 ::-webkit-inner-spin-button,
 ::-webkit-outer-spin-button {
   -webkit-appearance: none;
   margin: 0;
   height: auto;
 }
+
 /* number spinner: Chromium is already handled by ::-webkit-inner/outer-spin-button
    { appearance: none } above. Firefox needs its own vendor prefix — the unprefixed
    `appearance: textfield` is deprecated per CSS UI Level 4 (moved to compatibility
@@ -280,27 +315,34 @@ textarea {
 input[type="number"] {
   -moz-appearance: textfield;
 }
+
 [type="search"] {
   -webkit-appearance: textfield;
   outline-offset: -2px;
 }
+
 ::-webkit-search-decoration,
 ::-webkit-search-cancel-button {
   -webkit-appearance: none;
 }
+
 :-moz-ui-invalid {
   box-shadow: none;
 }
+
 :-moz-focusring:where(:not(iframe)) {
   outline: auto;
 }
+
 b,
 strong {
   font-weight: bolder;
 }
+
 small {
   font-size: 80%;
 }
+
 code,
 kbd,
 samp,
@@ -308,14 +350,17 @@ pre {
   font-family: var(--ps1ui-font-mono);
   font-size: 1em;
 }
+
 abbr:where([title]) {
   -webkit-text-decoration: underline dotted;
           text-decoration: underline dotted;
 }
+
 q::before,
 q::after {
   content: "";
 }
+
 /* Keeps sub/sup from expanding the parent line-height. */
 sub,
 sup {
@@ -324,34 +369,42 @@ sup {
   position: relative;
   vertical-align: baseline;
 }
+
 sub {
   bottom: -0.25em;
 }
+
 sup {
   top: -0.5em;
 }
+
 table {
   text-indent: 0;
   border-color: inherit;
   border-collapse: collapse;
 }
+
 hr {
   height: 0;
   color: inherit;
   border-top: 1px solid;
 }
+
 summary {
   display: list-item;
 }
+
 /* [hidden] would lose to `display: flex` etc. without this. */
 [hidden]:where(:not([hidden="until-found"])) {
   display: none !important;
 }
+
 @media (prefers-reduced-motion: no-preference) {
   html {
     interpolate-size: allow-keywords;
   }
 }
+
 /* ==========================================================================
  * Ambient environment
  * --------------------------------------------------------------------------
@@ -363,15 +416,18 @@ summary {
  * area would reveal the light UA default and flash white on scroll. `color`
  * and `font-family` cascade down to `body` and descendants naturally.
  * ========================================================================== */
+
 html {
   background: var(--ps1ui-color-bg);
   color: var(--ps1ui-color-fg);
   font-family: var(--ps1ui-font-mono);
 }
+
 ::-moz-selection {
   background: var(--ps1ui-color-primary);
   color: var(--ps1ui-color-primary-fg);
 }
+
 ::selection {
   background: var(--ps1ui-color-primary);
   color: var(--ps1ui-color-primary-fg);

package/dist/components/Anchor/Anchor.d.mts

@@ -2,7 +2,9 @@ import { ComponentPropsWithoutRef, ElementType } from "react";
 //#region src/components/Anchor/Anchor.d.ts
 type AnchorVariant = "primary" | "subtle";
 type AnchorOwnProps<E extends ElementType> = {
+  /** Element or component to render instead of the native <a> — e.g. a router Link. */
   as?: E;
+  /** Visual style: "primary" for standalone links, "subtle" for links inside running text. */
   variant?: AnchorVariant;
 };
 type AnchorProps<E extends ElementType = "a"> = AnchorOwnProps<E> & Omit<ComponentPropsWithoutRef<E>, keyof AnchorOwnProps<E>>;

package/dist/components/Anchor/Anchor.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Anchor.mjs","names":[],"sources":["../../../src/components/Anchor/Anchor.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementType } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type AnchorVariant = \"primary\" | \"subtle\";\n\ntype AnchorOwnProps<E extends ElementType> = {\n  as?: E;\n  variant?: AnchorVariant;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Text: with a polymorphic `as` prop TypeScript cannot correctly narrow the\n// `ref` prop's type. Anchor accepts both string tags and React component types (`as={NextLink}`),\n// so a loose ref type would silently accept mismatched refs; dropping ref from the prop type is\n// safer than a misleading loose type.\nexport type AnchorProps<E extends ElementType = \"a\"> = AnchorOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof AnchorOwnProps<E>>;\n\nexport function Anchor<E extends ElementType = \"a\">({\n  as,\n  variant = \"primary\",\n  className,\n  ...rest\n}: AnchorProps<E>) {\n  const tag = as ?? \"a\";\n  const classes = cx(\"ps1ui-anchor\", `ps1ui-anchor--${variant}`, className);\n  return createElement(tag, { ...rest, className: classes });\n}\n"],"mappings":";;;AAmBA,SAAgB,OAAoC,EAClD,IACA,UAAU,WACV,WACA,GAAG,QACc;CACjB,MAAM,MAAM,MAAM;CAClB,MAAM,UAAU,GAAG,gBAAgB,iBAAiB,WAAW,SAAS;CACxE,OAAO,cAAc,KAAK;EAAE,GAAG;EAAM,WAAW;CAAQ,CAAC;AAC3D"}
+{"version":3,"file":"Anchor.mjs","names":[],"sources":["../../../src/components/Anchor/Anchor.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementType } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type AnchorVariant = \"primary\" | \"subtle\";\n\ntype AnchorOwnProps<E extends ElementType> = {\n  /** Element or component to render instead of the native <a> — e.g. a router Link. */\n  as?: E;\n  /** Visual style: \"primary\" for standalone links, \"subtle\" for links inside running text. */\n  variant?: AnchorVariant;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Text: with a polymorphic `as` prop TypeScript cannot correctly narrow the\n// `ref` prop's type. Anchor accepts both string tags and React component types (`as={NextLink}`),\n// so a loose ref type would silently accept mismatched refs; dropping ref from the prop type is\n// safer than a misleading loose type.\nexport type AnchorProps<E extends ElementType = \"a\"> = AnchorOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof AnchorOwnProps<E>>;\n\nexport function Anchor<E extends ElementType = \"a\">({\n  as,\n  variant = \"primary\",\n  className,\n  ...rest\n}: AnchorProps<E>) {\n  const tag = as ?? \"a\";\n  const classes = cx(\"ps1ui-anchor\", `ps1ui-anchor--${variant}`, className);\n  return createElement(tag, { ...rest, className: classes });\n}\n"],"mappings":";;;AAqBA,SAAgB,OAAoC,EAClD,IACA,UAAU,WACV,WACA,GAAG,QACc;CACjB,MAAM,MAAM,MAAM;CAClB,MAAM,UAAU,GAAG,gBAAgB,iBAAiB,WAAW,SAAS;CACxE,OAAO,cAAc,KAAK;EAAE,GAAG;EAAM,WAAW;CAAQ,CAAC;AAC3D"}

package/dist/components/Button/Button.d.mts

@@ -1,8 +1,10 @@
 import { ComponentPropsWithoutRef, ElementType } from "react";
 //#region src/components/Button/Button.d.ts
-type ButtonVariant = "primary" | "secondary";
+type ButtonVariant = "primary" | "secondary" | "danger";
 type ButtonOwnProps<E extends ElementType> = {
+  /** Element or component to render instead of the native <button> — e.g. "a" or a router Link. */
   as?: E;
+  /** Visual style: "primary" for the main action, "secondary" for supporting actions, "danger" for destructive actions. */
   variant?: ButtonVariant;
 };
 /**
@@ -16,6 +18,10 @@ type ButtonOwnProps<E extends ElementType> = {
  * unavailable, render a native `<Button disabled>` (or no link at all) instead of a
  * link. Untyped JS callers and `as={Component}` escapes that pass `disabled` anyway
  * get a leaked no-op attribute — no visual or behavioral disabling happens.
+ *
+ * `type` on the native tag: when rendering a native <button>, `type` defaults to
+ * "button" (not the browser's implicit "submit"), so a Button inside a <form>
+ * never submits implicitly — pass type="submit" explicitly to submit.
  */
 type ButtonProps<E extends ElementType = "button"> = ButtonOwnProps<E> & Omit<ComponentPropsWithoutRef<E>, keyof ButtonOwnProps<E>>;
 declare function Button<E extends ElementType = "button">({ as, variant, className, ...rest }: ButtonProps<E>): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;

package/dist/components/Button/Button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.mjs","names":[],"sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementType } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type ButtonVariant = \"primary\" | \"secondary\";\n\ntype ButtonOwnProps<E extends ElementType> = {\n  as?: E;\n  variant?: ButtonVariant;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Anchor / Text: with a polymorphic `as` prop TypeScript cannot correctly\n// narrow the `ref` prop's type against the resolved element E. Button accepts both string tags\n// (`as=\"a\"`) and React component types (`as={NextLink}`) so consumers can render a link that\n// looks like a button; a loose ref type would silently accept mismatched refs, so dropping ref\n// from the prop type is safer than a misleading loose type.\n/**\n * Props for {@link Button}. Derived from the props of the rendered element `E`,\n * so what's accepted follows the `as` target.\n *\n * `disabled` and polymorphism: `disabled` only exists on form elements, so\n * `<Button as=\"a\" href=\"…\" disabled>` is a type error (`ComponentPropsWithoutRef<\"a\">`\n * has no `disabled` — locked in by `Button.test-d.tsx`). This is intentional and\n * matches the ARIA Authoring Practices: links are not disabled. When the action is\n * unavailable, render a native `<Button disabled>` (or no link at all) instead of a\n * link. Untyped JS callers and `as={Component}` escapes that pass `disabled` anyway\n * get a leaked no-op attribute — no visual or behavioral disabling happens.\n */\nexport type ButtonProps<E extends ElementType = \"button\"> = ButtonOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof ButtonOwnProps<E>>;\n\nexport function Button<E extends ElementType = \"button\">({\n  as,\n  variant = \"primary\",\n  className,\n  ...rest\n}: ButtonProps<E>) {\n  const tag: ElementType = as ?? \"button\";\n  const classes = cx(\"ps1ui-button\", `ps1ui-button--${variant}`, className);\n  const props: Record<string, unknown> = { ...rest, className: classes };\n  // `type=\"button\"` is a defensive default so a native <button> inside a <form> never\n  // submits implicitly. It only makes sense on the native tag — <a>, <NextLink>, and\n  // other host/component targets have no such attribute, and stamping one on them\n  // would leak an invalid attribute through to the DOM. Explicit callers still win.\n  if (tag === \"button\" && props.type === undefined) {\n    props.type = \"button\";\n  }\n  return createElement(tag, props);\n}\n"],"mappings":";;;AAgCA,SAAgB,OAAyC,EACvD,IACA,UAAU,WACV,WACA,GAAG,QACc;CACjB,MAAM,MAAmB,MAAM;CAC/B,MAAM,UAAU,GAAG,gBAAgB,iBAAiB,WAAW,SAAS;CACxE,MAAM,QAAiC;EAAE,GAAG;EAAM,WAAW;CAAQ;CAKrE,IAAI,QAAQ,YAAY,MAAM,SAAS,KAAA,GACrC,MAAM,OAAO;CAEf,OAAO,cAAc,KAAK,KAAK;AACjC"}
+{"version":3,"file":"Button.mjs","names":[],"sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementType } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type ButtonVariant = \"primary\" | \"secondary\" | \"danger\";\n\ntype ButtonOwnProps<E extends ElementType> = {\n  /** Element or component to render instead of the native <button> — e.g. \"a\" or a router Link. */\n  as?: E;\n  /** Visual style: \"primary\" for the main action, \"secondary\" for supporting actions, \"danger\" for destructive actions. */\n  variant?: ButtonVariant;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Anchor / Text: with a polymorphic `as` prop TypeScript cannot correctly\n// narrow the `ref` prop's type against the resolved element E. Button accepts both string tags\n// (`as=\"a\"`) and React component types (`as={NextLink}`) so consumers can render a link that\n// looks like a button; a loose ref type would silently accept mismatched refs, so dropping ref\n// from the prop type is safer than a misleading loose type.\n/**\n * Props for {@link Button}. Derived from the props of the rendered element `E`,\n * so what's accepted follows the `as` target.\n *\n * `disabled` and polymorphism: `disabled` only exists on form elements, so\n * `<Button as=\"a\" href=\"…\" disabled>` is a type error (`ComponentPropsWithoutRef<\"a\">`\n * has no `disabled` — locked in by `Button.test-d.tsx`). This is intentional and\n * matches the ARIA Authoring Practices: links are not disabled. When the action is\n * unavailable, render a native `<Button disabled>` (or no link at all) instead of a\n * link. Untyped JS callers and `as={Component}` escapes that pass `disabled` anyway\n * get a leaked no-op attribute — no visual or behavioral disabling happens.\n *\n * `type` on the native tag: when rendering a native <button>, `type` defaults to\n * \"button\" (not the browser's implicit \"submit\"), so a Button inside a <form>\n * never submits implicitly — pass type=\"submit\" explicitly to submit.\n */\nexport type ButtonProps<E extends ElementType = \"button\"> = ButtonOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof ButtonOwnProps<E>>;\n\nexport function Button<E extends ElementType = \"button\">({\n  as,\n  variant = \"primary\",\n  className,\n  ...rest\n}: ButtonProps<E>) {\n  const tag: ElementType = as ?? \"button\";\n  const classes = cx(\"ps1ui-button\", `ps1ui-button--${variant}`, className);\n  const props: Record<string, unknown> = { ...rest, className: classes };\n  // `type=\"button\"` is a defensive default so a native <button> inside a <form> never\n  // submits implicitly. It only makes sense on the native tag — <a>, <NextLink>, and\n  // other host/component targets have no such attribute, and stamping one on them\n  // would leak an invalid attribute through to the DOM. Explicit callers still win.\n  if (tag === \"button\" && props.type === undefined) {\n    props.type = \"button\";\n  }\n  return createElement(tag, props);\n}\n"],"mappings":";;;AAsCA,SAAgB,OAAyC,EACvD,IACA,UAAU,WACV,WACA,GAAG,QACc;CACjB,MAAM,MAAmB,MAAM;CAC/B,MAAM,UAAU,GAAG,gBAAgB,iBAAiB,WAAW,SAAS;CACxE,MAAM,QAAiC;EAAE,GAAG;EAAM,WAAW;CAAQ;CAKrE,IAAI,QAAQ,YAAY,MAAM,SAAS,KAAA,GACrC,MAAM,OAAO;CAEf,OAAO,cAAc,KAAK,KAAK;AACjC"}

package/dist/components/Checkbox/Checkbox.d.mts

@@ -1,6 +1,7 @@
 import { ComponentProps } from "react";
 //#region src/components/Checkbox/Checkbox.d.ts
 type CheckboxProps = Omit<ComponentProps<"input">, "type"> & {
+  /** Render the indeterminate ("mixed") visual state. Purely visual — checked is unaffected. */
   indeterminate?: boolean;
 };
 declare function Checkbox({ className, indeterminate, ref: forwardedRef, ...rest }: CheckboxProps): import("react").JSX.Element;

package/dist/components/Checkbox/Checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.mjs","names":[],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { useLayoutEffect, useRef, type ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { useMergedRef } from \"../../utils/useMergedRef\";\n\nexport type CheckboxProps = Omit<ComponentProps<\"input\">, \"type\"> & {\n  indeterminate?: boolean;\n};\n\nexport function Checkbox({\n  className,\n  indeterminate = false,\n  ref: forwardedRef,\n  ...rest\n}: CheckboxProps) {\n  const localRef = useRef<HTMLInputElement>(null);\n\n  // useLayoutEffect syncs .indeterminate before paint, avoiding a ✓-glyph flash on mount.\n  useLayoutEffect(() => {\n    localRef.current!.indeterminate = indeterminate;\n  }, [indeterminate]);\n\n  // Both the indeterminate sync above and the caller get the <input> node.\n  const mergedRef = useMergedRef(localRef, forwardedRef);\n\n  return (\n    <input {...rest} ref={mergedRef} type=\"checkbox\" className={cx(\"ps1ui-checkbox\", className)} />\n  );\n}\n"],"mappings":";;;;;;AAUA,SAAgB,SAAS,EACvB,WACA,gBAAgB,OAChB,KAAK,cACL,GAAG,QACa;CAChB,MAAM,WAAW,OAAyB,IAAI;CAG9C,sBAAsB;EACpB,SAAS,QAAS,gBAAgB;CACpC,GAAG,CAAC,aAAa,CAAC;CAGlB,MAAM,YAAY,aAAa,UAAU,YAAY;CAErD,OACE,oBAAC,SAAD;EAAO,GAAI;EAAM,KAAK;EAAW,MAAK;EAAW,WAAW,GAAG,kBAAkB,SAAS;CAAI,CAAA;AAElG"}
+{"version":3,"file":"Checkbox.mjs","names":[],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { useLayoutEffect, useRef, type ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { useMergedRef } from \"../../utils/useMergedRef\";\n\nexport type CheckboxProps = Omit<ComponentProps<\"input\">, \"type\"> & {\n  /** Render the indeterminate (\"mixed\") visual state. Purely visual — checked is unaffected. */\n  indeterminate?: boolean;\n};\n\nexport function Checkbox({\n  className,\n  indeterminate = false,\n  ref: forwardedRef,\n  ...rest\n}: CheckboxProps) {\n  const localRef = useRef<HTMLInputElement>(null);\n\n  // useLayoutEffect syncs .indeterminate before paint, avoiding a ✓-glyph flash on mount.\n  useLayoutEffect(() => {\n    localRef.current!.indeterminate = indeterminate;\n  }, [indeterminate]);\n\n  // Both the indeterminate sync above and the caller get the <input> node.\n  const mergedRef = useMergedRef(localRef, forwardedRef);\n\n  return (\n    <input {...rest} ref={mergedRef} type=\"checkbox\" className={cx(\"ps1ui-checkbox\", className)} />\n  );\n}\n"],"mappings":";;;;;;AAWA,SAAgB,SAAS,EACvB,WACA,gBAAgB,OAChB,KAAK,cACL,GAAG,QACa;CAChB,MAAM,WAAW,OAAyB,IAAI;CAG9C,sBAAsB;EACpB,SAAS,QAAS,gBAAgB;CACpC,GAAG,CAAC,aAAa,CAAC;CAGlB,MAAM,YAAY,aAAa,UAAU,YAAY;CAErD,OACE,oBAAC,SAAD;EAAO,GAAI;EAAM,KAAK;EAAW,MAAK;EAAW,WAAW,GAAG,kBAAkB,SAAS;CAAI,CAAA;AAElG"}

package/dist/components/CodeBlock/CodeBlock.d.mts

@@ -2,8 +2,11 @@ import { CodeBlockLanguage } from "./refractor.mjs";
 import { ComponentProps } from "react";
 //#region src/components/CodeBlock/CodeBlock.d.ts
 type CodeBlockProps = Omit<ComponentProps<"pre">, "children"> & {
+  /** Code to render. Takes precedence over children; use it where JSX children get rewrapped (e.g. Astro islands). */
   code?: string;
+  /** Code to render, as the element's only child. */
   children?: string;
+  /** Prism language name or alias. Unknown or omitted values render as plain text. */
   language?: CodeBlockLanguage | (string & {});
 };
 declare function CodeBlock({ code, children, language, className, onBlur, ref: forwardedRef, ...rest }: CodeBlockProps): import("react").JSX.Element;

package/dist/components/CodeBlock/CodeBlock.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.mjs","names":[],"sources":["../../../src/components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["\"use client\";\n\nimport { Fragment, useLayoutEffect, useMemo, type ComponentProps } from \"react\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nimport { toJsxRuntime } from \"hast-util-to-jsx-runtime\";\nimport { cx } from \"../../utils/cx\";\nimport { useMergedRef } from \"../../utils/useMergedRef\";\nimport { useScrollableFocus } from \"../../utils/useScrollableFocus\";\nimport { refractor, type CodeBlockLanguage } from \"./refractor\";\n\nexport type { CodeBlockLanguage };\n\n// `language` is a new prop (not the native HTML `lang` attribute). HTML `lang`\n// is a BCP47 natural-language tag (\"en\", \"ja\") — a different concept that\n// remains part of the base <pre> attrs and passes through untouched. See\n// CodeBlock.test.tsx for the passthrough assertion.\n//\n// `code` is an alternative to `children` for environments that wrap JSX\n// children on the way to a React tree — e.g. Astro's `.astro` → React island\n// boundary rewraps `children` as an AstroComponentInstance, breaking the\n// `children: string` contract. Named props are passed through as-is, so\n// `<CodeBlock code={snippet}>` survives that boundary. `code` wins when both\n// are supplied; the same string appears in the rendered DOM either way.\nexport type CodeBlockProps = Omit<ComponentProps<\"pre\">, \"children\"> & {\n  code?: string;\n  children?: string;\n  // `CodeBlockLanguage | (string & {})` is TypeScript's \"loose union\" pattern:\n  // canonical language names surface in autocomplete, but aliases (`ts`, `html`, ...)\n  // and dynamically-sourced strings (e.g. from a markdown fenced-code parser) still\n  // pass through the type and are resolved at runtime via refractor's alias table.\n  language?: CodeBlockLanguage | (string & {});\n};\n\nexport function CodeBlock({\n  code,\n  children,\n  language,\n  className,\n  onBlur,\n  ref: forwardedRef,\n  ...rest\n}: CodeBlockProps) {\n  // `code` takes precedence — see the type doc for the Astro/RSC-wrapped-children\n  // rationale. Empty string is the \"neither provided\" fallback so the component\n  // renders a valid empty <pre> instead of throwing on `.highlight(undefined)`.\n  const source = code ?? children ?? \"\";\n  // `registered` captures both \"language was provided\" and \"refractor knows it\" —\n  // used for the highlight path, the language-<x> class, and to keep the class\n  // off unhighlighted blocks (so downstream tools and consumer Prism themes\n  // don't mistake a raw-text fallback for a highlighted block).\n  //\n  // useMemo keyed on (children, language) collapses repeated tokenization when a\n  // frequently-re-rendering parent forces this component to re-render with the\n  // same code — Prism tokenization of a multi-KB snippet + hast → JSX rebuild\n  // is not cheap.\n  const { highlighted, registered } = useMemo(() => {\n    const isRegistered = !!language && refractor.registered(language);\n    return {\n      registered: isRegistered,\n      highlighted: isRegistered\n        ? toJsxRuntime(refractor.highlight(source, language), { Fragment, jsx, jsxs })\n        : source,\n    };\n  }, [source, language]);\n\n  // Keyboard reachability of the <pre> (its own scroll container) — tabIndex\n  // only while the code actually overflows, kept while focused, safe-side\n  // under static SSR — is the shared useScrollableFocus contract (see the\n  // hook's header for the full account). The overflowing content is the\n  // inline <code>, whose box a ResizeObserver can't watch, so content-driven\n  // re-measures are keyed on the source string instead.\n  const { scrollerRef, tabIndex, measure } = useScrollableFocus<HTMLPreElement>();\n  useLayoutEffect(() => measure(), [measure, source]);\n\n  // Merge the caller's ref with the hook's so both get the <pre> node.\n  const mergedRef = useMergedRef(scrollerRef, forwardedRef);\n\n  return (\n    <pre\n      // oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- axe scrollable-region-focusable requires the <pre> be keyboard-reachable when its content overflows; useScrollableFocus gates this on measured overflow so short snippets stay out of the tab order.\n      tabIndex={tabIndex}\n      {...rest}\n      ref={mergedRef}\n      className={cx(\"ps1ui-codeblock\", className)}\n      // Chained (not spread) so the caller's handler still runs: the\n      // re-measure drops the kept-while-focused tab stop once focus leaves —\n      // see useScrollableFocus.\n      onBlur={(event) => {\n        onBlur?.(event);\n        measure();\n      }}\n    >\n      <code className={registered ? `language-${language}` : undefined}>{highlighted}</code>\n    </pre>\n  );\n}\n"],"mappings":";;;;;;;;;AAiCA,SAAgB,UAAU,EACxB,MACA,UACA,UACA,WACA,QACA,KAAK,cACL,GAAG,QACc;CAIjB,MAAM,SAAS,QAAQ,YAAY;CAUnC,MAAM,EAAE,aAAa,eAAe,cAAc;EAChD,MAAM,eAAe,CAAC,CAAC,YAAY,UAAU,WAAW,QAAQ;EAChE,OAAO;GACL,YAAY;GACZ,aAAa,eACT,aAAa,UAAU,UAAU,QAAQ,QAAQ,GAAG;IAAE;IAAU;IAAK;GAAK,CAAC,IAC3E;EACN;CACF,GAAG,CAAC,QAAQ,QAAQ,CAAC;CAQrB,MAAM,EAAE,aAAa,UAAU,YAAY,mBAAmC;CAC9E,sBAAsB,QAAQ,GAAG,CAAC,SAAS,MAAM,CAAC;CAGlD,MAAM,YAAY,aAAa,aAAa,YAAY;CAExD,OACE,oBAAC,OAAD;EAEY;EACV,GAAI;EACJ,KAAK;EACL,WAAW,GAAG,mBAAmB,SAAS;EAI1C,SAAS,UAAU;GACjB,SAAS,KAAK;GACd,QAAQ;EACV;YAEA,oBAAC,QAAD;GAAM,WAAW,aAAa,YAAY,aAAa,KAAA;aAAY;EAAkB,CAAA;CAClF,CAAA;AAET"}
+{"version":3,"file":"CodeBlock.mjs","names":[],"sources":["../../../src/components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["\"use client\";\n\nimport { Fragment, useLayoutEffect, useMemo, type ComponentProps } from \"react\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nimport { toJsxRuntime } from \"hast-util-to-jsx-runtime\";\nimport { cx } from \"../../utils/cx\";\nimport { useMergedRef } from \"../../utils/useMergedRef\";\nimport { useScrollableFocus } from \"../../utils/useScrollableFocus\";\nimport { refractor, type CodeBlockLanguage } from \"./refractor\";\n\nexport type { CodeBlockLanguage };\n\n// `language` is a new prop (not the native HTML `lang` attribute). HTML `lang`\n// is a BCP47 natural-language tag (\"en\", \"ja\") — a different concept that\n// remains part of the base <pre> attrs and passes through untouched. See\n// CodeBlock.test.tsx for the passthrough assertion.\n//\n// `code` is an alternative to `children` for environments that wrap JSX\n// children on the way to a React tree — e.g. Astro's `.astro` → React island\n// boundary rewraps `children` as an AstroComponentInstance, breaking the\n// `children: string` contract. Named props are passed through as-is, so\n// `<CodeBlock code={snippet}>` survives that boundary. `code` wins when both\n// are supplied; the same string appears in the rendered DOM either way.\nexport type CodeBlockProps = Omit<ComponentProps<\"pre\">, \"children\"> & {\n  /** Code to render. Takes precedence over children; use it where JSX children get rewrapped (e.g. Astro islands). */\n  code?: string;\n  /** Code to render, as the element's only child. */\n  children?: string;\n  // `CodeBlockLanguage | (string & {})` is TypeScript's \"loose union\" pattern:\n  // canonical language names surface in autocomplete, but aliases (`ts`, `html`, ...)\n  // and dynamically-sourced strings (e.g. from a markdown fenced-code parser) still\n  // pass through the type and are resolved at runtime via refractor's alias table.\n  /** Prism language name or alias. Unknown or omitted values render as plain text. */\n  language?: CodeBlockLanguage | (string & {});\n};\n\nexport function CodeBlock({\n  code,\n  children,\n  language,\n  className,\n  onBlur,\n  ref: forwardedRef,\n  ...rest\n}: CodeBlockProps) {\n  // `code` takes precedence — see the type doc for the Astro/RSC-wrapped-children\n  // rationale. Empty string is the \"neither provided\" fallback so the component\n  // renders a valid empty <pre> instead of throwing on `.highlight(undefined)`.\n  const source = code ?? children ?? \"\";\n  // `registered` captures both \"language was provided\" and \"refractor knows it\" —\n  // used for the highlight path, the language-<x> class, and to keep the class\n  // off unhighlighted blocks (so downstream tools and consumer Prism themes\n  // don't mistake a raw-text fallback for a highlighted block).\n  //\n  // useMemo keyed on (children, language) collapses repeated tokenization when a\n  // frequently-re-rendering parent forces this component to re-render with the\n  // same code — Prism tokenization of a multi-KB snippet + hast → JSX rebuild\n  // is not cheap.\n  const { highlighted, registered } = useMemo(() => {\n    const isRegistered = !!language && refractor.registered(language);\n    return {\n      registered: isRegistered,\n      highlighted: isRegistered\n        ? toJsxRuntime(refractor.highlight(source, language), { Fragment, jsx, jsxs })\n        : source,\n    };\n  }, [source, language]);\n\n  // Keyboard reachability of the <pre> (its own scroll container) — tabIndex\n  // only while the code actually overflows, kept while focused, safe-side\n  // under static SSR — is the shared useScrollableFocus contract (see the\n  // hook's header for the full account). The overflowing content is the\n  // inline <code>, whose box a ResizeObserver can't watch, so content-driven\n  // re-measures are keyed on the source string instead.\n  const { scrollerRef, tabIndex, measure } = useScrollableFocus<HTMLPreElement>();\n  useLayoutEffect(() => measure(), [measure, source]);\n\n  // Merge the caller's ref with the hook's so both get the <pre> node.\n  const mergedRef = useMergedRef(scrollerRef, forwardedRef);\n\n  return (\n    <pre\n      // oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex -- axe scrollable-region-focusable requires the <pre> be keyboard-reachable when its content overflows; useScrollableFocus gates this on measured overflow so short snippets stay out of the tab order.\n      tabIndex={tabIndex}\n      {...rest}\n      ref={mergedRef}\n      className={cx(\"ps1ui-codeblock\", className)}\n      // Chained (not spread) so the caller's handler still runs: the\n      // re-measure drops the kept-while-focused tab stop once focus leaves —\n      // see useScrollableFocus.\n      onBlur={(event) => {\n        onBlur?.(event);\n        measure();\n      }}\n    >\n      <code className={registered ? `language-${language}` : undefined}>{highlighted}</code>\n    </pre>\n  );\n}\n"],"mappings":";;;;;;;;;AAoCA,SAAgB,UAAU,EACxB,MACA,UACA,UACA,WACA,QACA,KAAK,cACL,GAAG,QACc;CAIjB,MAAM,SAAS,QAAQ,YAAY;CAUnC,MAAM,EAAE,aAAa,eAAe,cAAc;EAChD,MAAM,eAAe,CAAC,CAAC,YAAY,UAAU,WAAW,QAAQ;EAChE,OAAO;GACL,YAAY;GACZ,aAAa,eACT,aAAa,UAAU,UAAU,QAAQ,QAAQ,GAAG;IAAE;IAAU;IAAK;GAAK,CAAC,IAC3E;EACN;CACF,GAAG,CAAC,QAAQ,QAAQ,CAAC;CAQrB,MAAM,EAAE,aAAa,UAAU,YAAY,mBAAmC;CAC9E,sBAAsB,QAAQ,GAAG,CAAC,SAAS,MAAM,CAAC;CAGlD,MAAM,YAAY,aAAa,aAAa,YAAY;CAExD,OACE,oBAAC,OAAD;EAEY;EACV,GAAI;EACJ,KAAK;EACL,WAAW,GAAG,mBAAmB,SAAS;EAI1C,SAAS,UAAU;GACjB,SAAS,KAAK;GACd,QAAQ;EACV;YAEA,oBAAC,QAAD;GAAM,WAAW,aAAa,YAAY,aAAa,KAAA;aAAY;EAAkB,CAAA;CAClF,CAAA;AAET"}

package/dist/components/Container/Container.d.mts

@@ -4,7 +4,15 @@ import { ComponentProps } from "react";
 //#region src/components/Container/Container.d.ts
 type ContainerSize = "sm" | "md" | "lg" | "xl" | "full";
 type ContainerProps = ComponentProps<"div"> & {
+  /**
+   * Max-width preset; "full" removes the cap.
+   * @default "lg"
+   */
   size?: Responsive<ContainerSize>;
+  /**
+   * Horizontal padding on the space scale.
+   * @default "lg"
+   */
   px?: Responsive<SpaceScale>;
 };
 declare function Container({ size, px, className, style, ...rest }: ContainerProps): import("react").JSX.Element;

package/dist/components/Container/Container.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Container.mjs","names":[],"sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { resolveResponsive, type Responsive } from \"../../utils/responsive\";\nimport { spaceToVar, type SpaceScale } from \"../../utils/spacing\";\n\nexport type ContainerSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\";\n\nexport type ContainerProps = ComponentProps<\"div\"> & {\n  size?: Responsive<ContainerSize>;\n  px?: Responsive<SpaceScale>;\n};\n\n// size → max-width. `full` maps to `none` (unbounded), the rest reference\n// the --ps1ui-container-* max-width tokens in tokens.css.\nconst sizeToVar = (v: ContainerSize): string =>\n  v === \"full\" ? \"none\" : `var(--ps1ui-container-${v})`;\n\nexport function Container({ size, px, className, style, ...rest }: ContainerProps) {\n  const sizeVars = resolveResponsive(size, \"--_container-size\", sizeToVar);\n  const pxVars = resolveResponsive(px, \"--_container-px\", spaceToVar);\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...sizeVars,\n    ...pxVars,\n  } as CSSProperties;\n  return <div {...rest} className={cx(\"ps1ui-container\", className)} style={mergedStyle} />;\n}\n"],"mappings":";;;;;AAcA,MAAM,aAAa,MACjB,MAAM,SAAS,SAAS,yBAAyB,EAAE;AAErD,SAAgB,UAAU,EAAE,MAAM,IAAI,WAAW,OAAO,GAAG,QAAwB;CACjF,MAAM,WAAW,kBAAkB,MAAM,qBAAqB,SAAS;CACvE,MAAM,SAAS,kBAAkB,IAAI,mBAAmB,UAAU;CAGlE,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;EACH,GAAG;CACL;CACA,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW,GAAG,mBAAmB,SAAS;EAAG,OAAO;CAAc,CAAA;AAC1F"}
+{"version":3,"file":"Container.mjs","names":[],"sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { resolveResponsive, type Responsive } from \"../../utils/responsive\";\nimport { spaceToVar, type SpaceScale } from \"../../utils/spacing\";\n\nexport type ContainerSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"full\";\n\nexport type ContainerProps = ComponentProps<\"div\"> & {\n  /**\n   * Max-width preset; \"full\" removes the cap.\n   * @default \"lg\"\n   */\n  size?: Responsive<ContainerSize>;\n  /**\n   * Horizontal padding on the space scale.\n   * @default \"lg\"\n   */\n  px?: Responsive<SpaceScale>;\n};\n\n// size → max-width. `full` maps to `none` (unbounded), the rest reference\n// the --ps1ui-container-* max-width tokens in tokens.css.\nconst sizeToVar = (v: ContainerSize): string =>\n  v === \"full\" ? \"none\" : `var(--ps1ui-container-${v})`;\n\nexport function Container({ size, px, className, style, ...rest }: ContainerProps) {\n  const sizeVars = resolveResponsive(size, \"--_container-size\", sizeToVar);\n  const pxVars = resolveResponsive(px, \"--_container-px\", spaceToVar);\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...sizeVars,\n    ...pxVars,\n  } as CSSProperties;\n  return <div {...rest} className={cx(\"ps1ui-container\", className)} style={mergedStyle} />;\n}\n"],"mappings":";;;;;AAsBA,MAAM,aAAa,MACjB,MAAM,SAAS,SAAS,yBAAyB,EAAE;AAErD,SAAgB,UAAU,EAAE,MAAM,IAAI,WAAW,OAAO,GAAG,QAAwB;CACjF,MAAM,WAAW,kBAAkB,MAAM,qBAAqB,SAAS;CACvE,MAAM,SAAS,kBAAkB,IAAI,mBAAmB,UAAU;CAGlE,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;EACH,GAAG;CACL;CACA,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW,GAAG,mBAAmB,SAAS;EAAG,OAAO;CAAc,CAAA;AAC1F"}

package/dist/components/Details/Details.d.mts

@@ -1,6 +1,7 @@
 import { ComponentProps, ReactNode } from "react";
 //#region src/components/Details/Details.d.ts
 type DetailsProps = ComponentProps<"details"> & {
+  /** Content of the always-visible summary row. */
   summary: ReactNode;
 };
 declare function Details({ summary, children, className, ...rest }: DetailsProps): import("react").JSX.Element;

package/dist/components/Details/Details.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Details.mjs","names":[],"sources":["../../../src/components/Details/Details.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type DetailsProps = ComponentProps<\"details\"> & {\n  summary: ReactNode;\n};\n\nexport function Details({ summary, children, className, ...rest }: DetailsProps) {\n  return (\n    <details {...rest} className={cx(\"ps1ui-details\", className)}>\n      <summary className=\"ps1ui-details__summary\">{summary}</summary>\n      <div className=\"ps1ui-details__body\">{children}</div>\n    </details>\n  );\n}\n"],"mappings":";;;AAOA,SAAgB,QAAQ,EAAE,SAAS,UAAU,WAAW,GAAG,QAAsB;CAC/E,OACE,qBAAC,WAAD;EAAS,GAAI;EAAM,WAAW,GAAG,iBAAiB,SAAS;YAA3D,CACE,oBAAC,WAAD;GAAS,WAAU;aAA0B;EAAiB,CAAA,GAC9D,oBAAC,OAAD;GAAK,WAAU;GAAuB;EAAc,CAAA,CAC7C;;AAEb"}
+{"version":3,"file":"Details.mjs","names":[],"sources":["../../../src/components/Details/Details.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type DetailsProps = ComponentProps<\"details\"> & {\n  /** Content of the always-visible summary row. */\n  summary: ReactNode;\n};\n\nexport function Details({ summary, children, className, ...rest }: DetailsProps) {\n  return (\n    <details {...rest} className={cx(\"ps1ui-details\", className)}>\n      <summary className=\"ps1ui-details__summary\">{summary}</summary>\n      <div className=\"ps1ui-details__body\">{children}</div>\n    </details>\n  );\n}\n"],"mappings":";;;AAQA,SAAgB,QAAQ,EAAE,SAAS,UAAU,WAAW,GAAG,QAAsB;CAC/E,OACE,qBAAC,WAAD;EAAS,GAAI;EAAM,WAAW,GAAG,iBAAiB,SAAS;YAA3D,CACE,oBAAC,WAAD;GAAS,WAAU;aAA0B;EAAiB,CAAA,GAC9D,oBAAC,OAAD;GAAK,WAAU;GAAuB;EAAc,CAAA,CAC7C;;AAEb"}

package/dist/components/Grid/Grid.d.mts

@@ -4,7 +4,15 @@ import { ComponentProps } from "react";
 //#region src/components/Grid/Grid.d.ts
 type GridGap = SpaceScale;
 type GridProps = ComponentProps<"div"> & {
+  /**
+   * Number of equal-width columns.
+   * @default 1
+   */
   columns?: Responsive<number>;
+  /**
+   * Gap between cells on the space scale.
+   * @default "md"
+   */
   gap?: Responsive<GridGap>;
 };
 declare function Grid({ columns, gap, className, style, ...rest }: GridProps): import("react").JSX.Element;

package/dist/components/Grid/Grid.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.mjs","names":[],"sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { safePositiveInt } from \"../../utils/numbers\";\nimport { resolveResponsive, type Responsive } from \"../../utils/responsive\";\nimport { spaceToVar, type SpaceScale } from \"../../utils/spacing\";\n\nexport type GridGap = SpaceScale;\n\nexport type GridProps = ComponentProps<\"div\"> & {\n  columns?: Responsive<number>;\n  gap?: Responsive<GridGap>;\n};\n\nexport function Grid({ columns, gap, className, style, ...rest }: GridProps) {\n  // `repeat(N, ...)` requires N ≥ 1 integer — `safePositiveInt` clamps at\n  // the system boundary. See utils/numbers.ts for the full rationale.\n  const columnsVars = resolveResponsive(columns, \"--_grid-columns\", safePositiveInt);\n  const gapVars = resolveResponsive(gap, \"--_grid-gap\", spaceToVar);\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...columnsVars,\n    ...gapVars,\n  } as CSSProperties;\n  return <div {...rest} className={cx(\"ps1ui-grid\", className)} style={mergedStyle} />;\n}\n"],"mappings":";;;;;;AAaA,SAAgB,KAAK,EAAE,SAAS,KAAK,WAAW,OAAO,GAAG,QAAmB;CAG3E,MAAM,cAAc,kBAAkB,SAAS,mBAAmB,eAAe;CACjF,MAAM,UAAU,kBAAkB,KAAK,eAAe,UAAU;CAGhE,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;EACH,GAAG;CACL;CACA,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW,GAAG,cAAc,SAAS;EAAG,OAAO;CAAc,CAAA;AACrF"}
+{"version":3,"file":"Grid.mjs","names":[],"sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { safePositiveInt } from \"../../utils/numbers\";\nimport { resolveResponsive, type Responsive } from \"../../utils/responsive\";\nimport { spaceToVar, type SpaceScale } from \"../../utils/spacing\";\n\nexport type GridGap = SpaceScale;\n\nexport type GridProps = ComponentProps<\"div\"> & {\n  /**\n   * Number of equal-width columns.\n   * @default 1\n   */\n  columns?: Responsive<number>;\n  /**\n   * Gap between cells on the space scale.\n   * @default \"md\"\n   */\n  gap?: Responsive<GridGap>;\n};\n\nexport function Grid({ columns, gap, className, style, ...rest }: GridProps) {\n  // `repeat(N, ...)` requires N ≥ 1 integer — `safePositiveInt` clamps at\n  // the system boundary. See utils/numbers.ts for the full rationale.\n  const columnsVars = resolveResponsive(columns, \"--_grid-columns\", safePositiveInt);\n  const gapVars = resolveResponsive(gap, \"--_grid-gap\", spaceToVar);\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...columnsVars,\n    ...gapVars,\n  } as CSSProperties;\n  return <div {...rest} className={cx(\"ps1ui-grid\", className)} style={mergedStyle} />;\n}\n"],"mappings":";;;;;;AAqBA,SAAgB,KAAK,EAAE,SAAS,KAAK,WAAW,OAAO,GAAG,QAAmB;CAG3E,MAAM,cAAc,kBAAkB,SAAS,mBAAmB,eAAe;CACjF,MAAM,UAAU,kBAAkB,KAAK,eAAe,UAAU;CAGhE,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;EACH,GAAG;CACL;CACA,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW,GAAG,cAAc,SAAS;EAAG,OAAO;CAAc,CAAA;AACrF"}

package/dist/components/GridItem/GridItem.d.mts

@@ -2,6 +2,10 @@ import { Responsive } from "../../utils/responsive.mjs";
 import { ComponentProps } from "react";
 //#region src/components/GridItem/GridItem.d.ts
 type GridItemProps = ComponentProps<"div"> & {
+  /**
+   * Number of grid columns the item spans.
+   * @default 1
+   */
   colSpan?: Responsive<number>;
 };
 declare function GridItem({ colSpan, className, style, ...rest }: GridItemProps): import("react").JSX.Element;

package/dist/components/GridItem/GridItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"GridItem.mjs","names":[],"sources":["../../../src/components/GridItem/GridItem.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { safePositiveInt } from \"../../utils/numbers\";\nimport { resolveResponsive, type Responsive } from \"../../utils/responsive\";\n\nexport type GridItemProps = ComponentProps<\"div\"> & {\n  colSpan?: Responsive<number>;\n};\n\nexport function GridItem({ colSpan, className, style, ...rest }: GridItemProps) {\n  // `grid-column: span N` requires N ≥ 1 integer — `safePositiveInt` clamps\n  // at the system boundary. See utils/numbers.ts for the full rationale.\n  const colSpanVars = resolveResponsive(colSpan, \"--_griditem-col-span\", safePositiveInt);\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...colSpanVars,\n  } as CSSProperties;\n  return <div {...rest} className={cx(\"ps1ui-griditem\", className)} style={mergedStyle} />;\n}\n"],"mappings":";;;;;AASA,SAAgB,SAAS,EAAE,SAAS,WAAW,OAAO,GAAG,QAAuB;CAG9E,MAAM,cAAc,kBAAkB,SAAS,wBAAwB,eAAe;CAGtF,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;CACL;CACA,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW,GAAG,kBAAkB,SAAS;EAAG,OAAO;CAAc,CAAA;AACzF"}
+{"version":3,"file":"GridItem.mjs","names":[],"sources":["../../../src/components/GridItem/GridItem.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { safePositiveInt } from \"../../utils/numbers\";\nimport { resolveResponsive, type Responsive } from \"../../utils/responsive\";\n\nexport type GridItemProps = ComponentProps<\"div\"> & {\n  /**\n   * Number of grid columns the item spans.\n   * @default 1\n   */\n  colSpan?: Responsive<number>;\n};\n\nexport function GridItem({ colSpan, className, style, ...rest }: GridItemProps) {\n  // `grid-column: span N` requires N ≥ 1 integer — `safePositiveInt` clamps\n  // at the system boundary. See utils/numbers.ts for the full rationale.\n  const colSpanVars = resolveResponsive(colSpan, \"--_griditem-col-span\", safePositiveInt);\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...colSpanVars,\n  } as CSSProperties;\n  return <div {...rest} className={cx(\"ps1ui-griditem\", className)} style={mergedStyle} />;\n}\n"],"mappings":";;;;;AAaA,SAAgB,SAAS,EAAE,SAAS,WAAW,OAAO,GAAG,QAAuB;CAG9E,MAAM,cAAc,kBAAkB,SAAS,wBAAwB,eAAe;CAGtF,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;CACL;CACA,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW,GAAG,kBAAkB,SAAS;EAAG,OAAO;CAAc,CAAA;AACzF"}

package/dist/components/Heading/Heading.d.mts

@@ -7,9 +7,13 @@ type HeadingElement = "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
 type HeadingSize = "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
 type HeadingWeight = FontWeight;
 type HeadingOwnProps<E extends HeadingElement> = {
+  /** Semantic level: renders the matching h1–h6 tag and sets the default size and weight. */
   level: HeadingLevel;
+  /** Heading tag to render when it should differ from level — visual defaults stay driven by level. */
   as?: E;
+  /** Font size. Defaults to the level's size. */
   size?: Responsive<HeadingSize>;
+  /** Font weight. Defaults to the level's weight. */
   weight?: Responsive<HeadingWeight>;
 };
 type HeadingProps<E extends HeadingElement = HeadingElement> = HeadingOwnProps<E> & Omit<ComponentPropsWithoutRef<E>, keyof HeadingOwnProps<E>>;

package/dist/components/Heading/Heading.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.mjs","names":[],"sources":["../../../src/components/Heading/Heading.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { resolveResponsive, withResponsiveBase, type Responsive } from \"../../utils/responsive\";\nimport { fontSizeToVar, weightToValue, type FontWeight } from \"../../utils/typography\";\n\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\nexport type HeadingElement = \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n\nexport type HeadingSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\";\n// HeadingWeight is a re-export of the shared FontWeight scale. Keeping a\n// component-local alias preserves the public type name (backwards compat)\n// while the underlying scale stays single-sourced in utils/typography.ts.\nexport type HeadingWeight = FontWeight;\n\ntype HeadingOwnProps<E extends HeadingElement> = {\n  level: HeadingLevel;\n  as?: E;\n  size?: Responsive<HeadingSize>;\n  weight?: Responsive<HeadingWeight>;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Text: with a polymorphic `as` prop TypeScript cannot correctly narrow the\n// `ref` type. All h1-h6 do resolve to HTMLHeadingElement so ref would happen to work today, but\n// keeping the polymorphic pattern consistent avoids surprises if the tag set ever widens.\nexport type HeadingProps<E extends HeadingElement = HeadingElement> = HeadingOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof HeadingOwnProps<E>>;\n\n// Exhaustive over HeadingLevel so a new level cannot be added without classifying its defaults.\nconst LEVEL_DEFAULTS: Record<HeadingLevel, { size: HeadingSize; weight: HeadingWeight }> = {\n  1: { size: \"3xl\", weight: \"bold\" },\n  2: { size: \"2xl\", weight: \"semibold\" },\n  3: { size: \"xl\", weight: \"semibold\" },\n  4: { size: \"lg\", weight: \"semibold\" },\n  5: { size: \"md\", weight: \"medium\" },\n  6: { size: \"sm\", weight: \"medium\" },\n};\n\nexport function Heading<E extends HeadingElement = HeadingElement>({\n  level,\n  as,\n  size: sizeProp,\n  weight: weightProp,\n  className,\n  style,\n  ...rest\n}: HeadingProps<E>) {\n  const tag = as ?? (`h${level}` as HeadingElement);\n  const defaults = LEVEL_DEFAULTS[level];\n  // `withResponsiveBase` bakes the level's default in at the `base`\n  // breakpoint when the caller either omits the prop entirely or passes a\n  // responsive object with no `base` entry. Concretely, `<Heading level={1}\n  // size={{ md: \"2xl\" }}>` renders as level 1's default `3xl` at base, then\n  // `2xl` at the md breakpoint — matching the intuition \"level sets the\n  // default; the object overrides at specific widths\".\n  const size = withResponsiveBase(sizeProp, defaults.size);\n  const weight = withResponsiveBase(weightProp, defaults.weight);\n\n  const sizeVars = resolveResponsive(size, \"--_heading-size\", fontSizeToVar);\n  const weightVars = resolveResponsive(weight, \"--_heading-weight\", weightToValue);\n\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...sizeVars,\n    ...weightVars,\n  } as CSSProperties;\n\n  return createElement(tag, {\n    ...rest,\n    className: cx(\"ps1ui-heading\", className),\n    style: mergedStyle,\n  });\n}\n"],"mappings":";;;;;AA8BA,MAAM,iBAAqF;CACzF,GAAG;EAAE,MAAM;EAAO,QAAQ;CAAO;CACjC,GAAG;EAAE,MAAM;EAAO,QAAQ;CAAW;CACrC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAW;CACpC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAW;CACpC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAS;CAClC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAS;AACpC;AAEA,SAAgB,QAAmD,EACjE,OACA,IACA,MAAM,UACN,QAAQ,YACR,WACA,OACA,GAAG,QACe;CAClB,MAAM,MAAM,MAAO,IAAI;CACvB,MAAM,WAAW,eAAe;CAOhC,MAAM,OAAO,mBAAmB,UAAU,SAAS,IAAI;CACvD,MAAM,SAAS,mBAAmB,YAAY,SAAS,MAAM;CAE7D,MAAM,WAAW,kBAAkB,MAAM,mBAAmB,aAAa;CACzE,MAAM,aAAa,kBAAkB,QAAQ,qBAAqB,aAAa;CAI/E,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;EACH,GAAG;CACL;CAEA,OAAO,cAAc,KAAK;EACxB,GAAG;EACH,WAAW,GAAG,iBAAiB,SAAS;EACxC,OAAO;CACT,CAAC;AACH"}
+{"version":3,"file":"Heading.mjs","names":[],"sources":["../../../src/components/Heading/Heading.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, CSSProperties } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { resolveResponsive, withResponsiveBase, type Responsive } from \"../../utils/responsive\";\nimport { fontSizeToVar, weightToValue, type FontWeight } from \"../../utils/typography\";\n\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\nexport type HeadingElement = \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n\nexport type HeadingSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\";\n// HeadingWeight is a re-export of the shared FontWeight scale. Keeping a\n// component-local alias preserves the public type name (backwards compat)\n// while the underlying scale stays single-sourced in utils/typography.ts.\nexport type HeadingWeight = FontWeight;\n\ntype HeadingOwnProps<E extends HeadingElement> = {\n  /** Semantic level: renders the matching h1–h6 tag and sets the default size and weight. */\n  level: HeadingLevel;\n  /** Heading tag to render when it should differ from level — visual defaults stay driven by level. */\n  as?: E;\n  /** Font size. Defaults to the level's size. */\n  size?: Responsive<HeadingSize>;\n  /** Font weight. Defaults to the level's weight. */\n  weight?: Responsive<HeadingWeight>;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Text: with a polymorphic `as` prop TypeScript cannot correctly narrow the\n// `ref` type. All h1-h6 do resolve to HTMLHeadingElement so ref would happen to work today, but\n// keeping the polymorphic pattern consistent avoids surprises if the tag set ever widens.\nexport type HeadingProps<E extends HeadingElement = HeadingElement> = HeadingOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof HeadingOwnProps<E>>;\n\n// Exhaustive over HeadingLevel so a new level cannot be added without classifying its defaults.\nconst LEVEL_DEFAULTS: Record<HeadingLevel, { size: HeadingSize; weight: HeadingWeight }> = {\n  1: { size: \"3xl\", weight: \"bold\" },\n  2: { size: \"2xl\", weight: \"semibold\" },\n  3: { size: \"xl\", weight: \"semibold\" },\n  4: { size: \"lg\", weight: \"semibold\" },\n  5: { size: \"md\", weight: \"medium\" },\n  6: { size: \"sm\", weight: \"medium\" },\n};\n\nexport function Heading<E extends HeadingElement = HeadingElement>({\n  level,\n  as,\n  size: sizeProp,\n  weight: weightProp,\n  className,\n  style,\n  ...rest\n}: HeadingProps<E>) {\n  const tag = as ?? (`h${level}` as HeadingElement);\n  const defaults = LEVEL_DEFAULTS[level];\n  // `withResponsiveBase` bakes the level's default in at the `base`\n  // breakpoint when the caller either omits the prop entirely or passes a\n  // responsive object with no `base` entry. Concretely, `<Heading level={1}\n  // size={{ md: \"2xl\" }}>` renders as level 1's default `3xl` at base, then\n  // `2xl` at the md breakpoint — matching the intuition \"level sets the\n  // default; the object overrides at specific widths\".\n  const size = withResponsiveBase(sizeProp, defaults.size);\n  const weight = withResponsiveBase(weightProp, defaults.weight);\n\n  const sizeVars = resolveResponsive(size, \"--_heading-size\", fontSizeToVar);\n  const weightVars = resolveResponsive(weight, \"--_heading-weight\", weightToValue);\n\n  // Caller style first, internal `--_*` vars win — see Text.tsx. Cast because\n  // csstype has no index signature for `--*` keys (React 19 included).\n  const mergedStyle: CSSProperties = {\n    ...style,\n    ...sizeVars,\n    ...weightVars,\n  } as CSSProperties;\n\n  return createElement(tag, {\n    ...rest,\n    className: cx(\"ps1ui-heading\", className),\n    style: mergedStyle,\n  });\n}\n"],"mappings":";;;;;AAkCA,MAAM,iBAAqF;CACzF,GAAG;EAAE,MAAM;EAAO,QAAQ;CAAO;CACjC,GAAG;EAAE,MAAM;EAAO,QAAQ;CAAW;CACrC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAW;CACpC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAW;CACpC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAS;CAClC,GAAG;EAAE,MAAM;EAAM,QAAQ;CAAS;AACpC;AAEA,SAAgB,QAAmD,EACjE,OACA,IACA,MAAM,UACN,QAAQ,YACR,WACA,OACA,GAAG,QACe;CAClB,MAAM,MAAM,MAAO,IAAI;CACvB,MAAM,WAAW,eAAe;CAOhC,MAAM,OAAO,mBAAmB,UAAU,SAAS,IAAI;CACvD,MAAM,SAAS,mBAAmB,YAAY,SAAS,MAAM;CAE7D,MAAM,WAAW,kBAAkB,MAAM,mBAAmB,aAAa;CACzE,MAAM,aAAa,kBAAkB,QAAQ,qBAAqB,aAAa;CAI/E,MAAM,cAA6B;EACjC,GAAG;EACH,GAAG;EACH,GAAG;CACL;CAEA,OAAO,cAAc,KAAK;EACxB,GAAG;EACH,WAAW,GAAG,iBAAiB,SAAS;EACxC,OAAO;CACT,CAAC;AACH"}

package/dist/components/List/List.d.mts

@@ -1,8 +1,10 @@
 import { ComponentProps, ReactElement } from "react";
 //#region src/components/List/List.d.ts
 type ListProps = ({
+  /** Render an <ol> with numbered markers instead of an <ul>. */
   ordered?: false;
 } & ComponentProps<"ul">) | ({
+  /** Render an <ol> with numbered markers instead of an <ul>. */
   ordered: true;
 } & Omit<ComponentProps<"ol">, "type">);
 declare function List(props: ListProps): ReactElement;

package/dist/components/List/List.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"List.mjs","names":[],"sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentProps, ReactElement } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\n// Discriminated union: an unordered <List> shouldn't typecheck with <ol>-only\n// attributes (start / reversed) and shouldn't type its ref as HTMLOListElement.\n// `type` is dropped from the ordered variant because the visible marker is\n// drawn by `::before`, not the browser's `::marker`, so `type=\"a\"` would\n// silently not affect the visible numbering.\nexport type ListProps =\n  | ({ ordered?: false } & ComponentProps<\"ul\">)\n  | ({ ordered: true } & Omit<ComponentProps<\"ol\">, \"type\">);\n\n// Return type annotated so tsdown emits a small ReactElement in the .d.mts\n// instead of the wide DetailedReactHTMLElement createElement infers for a\n// `\"ol\" | \"ul\"` tag union.\nexport function List(props: ListProps): ReactElement {\n  const { ordered = false, className, ...rest } = props;\n  const tag = ordered ? \"ol\" : \"ul\";\n  return createElement(tag, {\n    // Safari's a11y tree drops list semantics (\"list, N items\") when the\n    // computed `list-style-type` is `none` — the global reset applies that,\n    // so `role=\"list\"` restores VoiceOver's announcement. Placed before\n    // `...rest` so a caller can override with a different role.\n    role: \"list\",\n    ...rest,\n    className: cx(\n      \"ps1ui-list\",\n      ordered ? \"ps1ui-list--ordered\" : \"ps1ui-list--unordered\",\n      className,\n    ),\n  });\n}\n"],"mappings":";;;AAgBA,SAAgB,KAAK,OAAgC;CACnD,MAAM,EAAE,UAAU,OAAO,WAAW,GAAG,SAAS;CAEhD,OAAO,cADK,UAAU,OAAO,MACH;EAKxB,MAAM;EACN,GAAG;EACH,WAAW,GACT,cACA,UAAU,wBAAwB,yBAClC,SACF;CACF,CAAC;AACH"}
+{"version":3,"file":"List.mjs","names":[],"sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentProps, ReactElement } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\n// Discriminated union: an unordered <List> shouldn't typecheck with <ol>-only\n// attributes (start / reversed) and shouldn't type its ref as HTMLOListElement.\n// `type` is dropped from the ordered variant because the visible marker is\n// drawn by `::before`, not the browser's `::marker`, so `type=\"a\"` would\n// silently not affect the visible numbering.\nexport type ListProps =\n  | ({\n      /** Render an <ol> with numbered markers instead of an <ul>. */\n      ordered?: false;\n    } & ComponentProps<\"ul\">)\n  | ({\n      /** Render an <ol> with numbered markers instead of an <ul>. */\n      ordered: true;\n    } & Omit<ComponentProps<\"ol\">, \"type\">);\n\n// Return type annotated so tsdown emits a small ReactElement in the .d.mts\n// instead of the wide DetailedReactHTMLElement createElement infers for a\n// `\"ol\" | \"ul\"` tag union.\nexport function List(props: ListProps): ReactElement {\n  const { ordered = false, className, ...rest } = props;\n  const tag = ordered ? \"ol\" : \"ul\";\n  return createElement(tag, {\n    // Safari's a11y tree drops list semantics (\"list, N items\") when the\n    // computed `list-style-type` is `none` — the global reset applies that,\n    // so `role=\"list\"` restores VoiceOver's announcement. Placed before\n    // `...rest` so a caller can override with a different role.\n    role: \"list\",\n    ...rest,\n    className: cx(\n      \"ps1ui-list\",\n      ordered ? \"ps1ui-list--ordered\" : \"ps1ui-list--unordered\",\n      className,\n    ),\n  });\n}\n"],"mappings":";;;AAsBA,SAAgB,KAAK,OAAgC;CACnD,MAAM,EAAE,UAAU,OAAO,WAAW,GAAG,SAAS;CAEhD,OAAO,cADK,UAAU,OAAO,MACH;EAKxB,MAAM;EACN,GAAG;EACH,WAAW,GACT,cACA,UAAU,wBAAwB,yBAClC,SACF;CACF,CAAC;AACH"}