gridsmith-ui 0.21.0 → 0.22.0

package/dist/{chunk-EQDR57AM.js.map → chunk-EYMGLK4M.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../../showcase/src/components/CodeBlock.tsx","../../../showcase/src/components/Link.tsx","../../../showcase/src/components/Divider.tsx"],"names":["Link","jsxs","jsx"],"mappings":"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","file":"chunk-EQDR57AM.js","sourcesContent":["import { useState, useCallback } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../lib/icons\";\nimport { Badge } from \"./Badge\";\n\ninterface CodeBlockProps {\n  code: string;\n  language?: string;\n  showLineNumbers?: boolean;\n  /** Wrap long lines instead of scrolling sideways. Default: on for a single-line snippet (a tracking tag, a command), off for multi-line code. */\n  wrap?: boolean;\n  className?: string;\n}\n\nexport function CodeBlock({\n  code,\n  language,\n  showLineNumbers = false,\n  wrap,\n  className,\n}: CodeBlockProps) {\n  const [copied, setCopied] = useState(false);\n\n  const handleCopy = useCallback(async () => {\n    try {\n      await navigator.clipboard.writeText(code);\n      setCopied(true);\n      setTimeout(() => setCopied(false), 2000);\n    } catch {\n      /* clipboard not available */\n    }\n  }, [code]);\n\n  const lines = code.split(\"\\n\");\n  const wraps = wrap ?? lines.length === 1;\n  const gutterWidth = showLineNumbers ? `${String(lines.length).length + 1}ch` : undefined;\n\n  return (\n    <div\n      className={cn(\n        \"relative group\",\n        \"bg-[var(--ds-bg-surface)] text-[var(--ds-text-primary)]\",\n        \"border-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)]\",\n        \"rounded-[var(--ds-radius-md)]\",\n        \"shadow-[var(--ds-shadow-sm)]\",\n        \"overflow-hidden\",\n        className,\n      )}\n    >\n      <div className=\"flex items-center justify-between px-ds-4 py-ds-2 border-b-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)] bg-[var(--ds-bg-muted)]\">\n        <div className=\"flex items-center gap-ds-2\">\n          {language && <Badge variant=\"outline\" size=\"sm\">{language}</Badge>}\n        </div>\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className={cn(\n            \"inline-flex items-center gap-ds-1.5 px-ds-2 py-ds-1 text-xs font-medium cursor-pointer\",\n            \"text-[var(--ds-text-muted)] hover:text-[var(--ds-text-primary)]\",\n            \"rounded-[var(--ds-radius-sm)]\",\n            \"hover:bg-[var(--ds-bg-surface)]\",\n            \"transition-colors\",\n            \"focus-visible:shadow-[var(--ds-shadow-focus)] outline-none\",\n          )}\n          aria-label={copied ? \"Copied\" : \"Copy code\"}\n        >\n          <Icon name={copied ? \"check\" : \"folder\"} size={14} />\n          {copied ? \"Copied\" : \"Copy\"}\n        </button>\n      </div>\n\n      <div className={wraps ? undefined : \"overflow-x-auto\"} data-wrap={wraps ? \"true\" : undefined}>\n        <pre className={cn(\"p-ds-4 text-sm leading-relaxed font-[family-name:var(--ds-font-mono)]\", wraps && \"whitespace-pre-wrap break-words\")}>\n          <code>\n            {lines.map((line, i) => (\n              // with line numbers each line is a two-column row, so a wrapped line continues under its text, not under the gutter\n              <span key={i} className={showLineNumbers ? \"grid grid-cols-[max-content_1fr]\" : \"block\"}>\n                {showLineNumbers && (\n                  <span\n                    className=\"text-right text-[var(--ds-text-muted)] select-none mr-ds-4 opacity-50\"\n                    style={{ width: gutterWidth }}\n                  >\n                    {i + 1}\n                  </span>\n                )}\n                <span className=\"min-w-0\">{line || \" \"}</span>\n              </span>\n            ))}\n          </code>\n        </pre>\n      </div>\n    </div>\n  );\n}\n","import { forwardRef, type AnchorHTMLAttributes, type ComponentType, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\n\ntype LinkUnderline = \"hover\" | \"always\" | \"none\";\ntype LinkTone = \"accent\" | \"muted\" | \"inherit\";\n\nexport interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n  href: string;\n  children: ReactNode;\n  /** When to show the underline. Default \"hover\". */\n  underline?: LinkUnderline;\n  /** Colour: accent (default), muted for secondary links, inherit to match surrounding text. */\n  tone?: LinkTone;\n  /** Opens in a new tab with rel=\"noopener noreferrer\". Default false. */\n  external?: boolean;\n  /**\n   * Render through a router link component instead of a plain anchor\n   * (e.g. `component={RouterLink}` from react-router or next/link). The\n   * component receives the same props; `href` is also passed as `to` for\n   * react-router compatibility.\n   */\n  component?: ComponentType<Record<string, unknown>>;\n  iconLeft?: ReactNode;\n  iconRight?: ReactNode;\n}\n\nconst toneStyles: Record<LinkTone, string> = {\n  accent: \"text-[var(--ds-accent-primary)] hover:text-[var(--ds-accent-primary-hover)] active:text-[var(--ds-accent-primary-active)]\",\n  muted: \"text-[var(--ds-text-secondary)] hover:text-[var(--ds-text-primary)]\",\n  inherit: \"text-inherit hover:text-[var(--ds-accent-primary)]\",\n};\n\nconst underlineStyles: Record<LinkUnderline, string> = {\n  hover: \"no-underline hover:underline\",\n  always: \"underline underline-offset-2\",\n  none: \"no-underline\",\n};\n\n/**\n * Navigation link. Renders a real <a> (or a router link via `component`) so\n * middle-click, open-in-new-tab, right-click \"copy link\" and screen readers\n * all behave correctly. Visually identical to Button variant=\"link\".\n *\n * Use Link for NAVIGATION (to a page or URL). Use Button variant=\"link\" for an\n * ACTION that should look like a link (show more, resend code). Never use a\n * ghost Button for inline text — its padding breaks the line.\n */\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  { href, children, underline = \"hover\", tone = \"accent\", external = false, component: Component, iconLeft, iconRight, className, target, rel, ...props },\n  ref,\n) {\n  const classes = cn(\n    \"inline-flex items-center gap-ds-1 font-medium cursor-pointer\",\n    \"transition-colors duration-[var(--ds-transition-speed)]\",\n    \"focus-visible:outline-2 focus-visible:outline-[var(--ds-accent-primary)] focus-visible:outline-offset-2 rounded-[var(--ds-radius-sm)]\",\n    toneStyles[tone],\n    underlineStyles[underline],\n    className,\n  );\n  const resolvedTarget = external ? \"_blank\" : target;\n  const resolvedRel = external ? cn(\"noopener noreferrer\", rel) : rel;\n  const content = (\n    <>\n      {iconLeft}\n      {children}\n      {iconRight}\n    </>\n  );\n\n  if (Component) {\n    return (\n      <Component ref={ref} href={href} to={href} className={classes} target={resolvedTarget} rel={resolvedRel} {...props}>\n        {content}\n      </Component>\n    );\n  }\n\n  return (\n    <a ref={ref} href={href} className={classes} target={resolvedTarget} rel={resolvedRel} {...props}>\n      {content}\n    </a>\n  );\n});\n","import { cn } from \"../lib/utils\";\nimport type { ReactNode } from \"react\";\n\ntype Orientation = \"horizontal\" | \"vertical\";\n\ninterface DividerProps {\n  orientation?: Orientation;\n  label?: ReactNode;\n  className?: string;\n}\n\nexport function Divider({\n  orientation = \"horizontal\",\n  label,\n  className,\n}: DividerProps) {\n  if (orientation === \"vertical\") {\n    return (\n      <div\n        role=\"separator\"\n        aria-orientation=\"vertical\"\n        className={cn(\n          \"inline-block self-stretch min-h-[1em]\",\n          \"w-[var(--ds-divider-width)]\",\n          \"bg-[var(--ds-border-default)]\",\n          className,\n        )}\n      />\n    );\n  }\n\n  if (label) {\n    return (\n      <div\n        role=\"separator\"\n        className={cn(\"flex items-center gap-ds-3\", className)}\n      >\n        <span className=\"flex-1 h-[var(--ds-divider-width)] bg-[var(--ds-border-default)]\" />\n        <span className=\"text-xs font-medium text-[var(--ds-text-muted)] shrink-0\">\n          {label}\n        </span>\n        <span className=\"flex-1 h-[var(--ds-divider-width)] bg-[var(--ds-border-default)]\" />\n      </div>\n    );\n  }\n\n  return (\n    <hr\n      role=\"separator\"\n      className={cn(\n        \"border-none w-full\",\n        \"h-[var(--ds-divider-width)]\",\n        \"bg-[var(--ds-border-default)]\",\n        className,\n      )}\n    />\n  );\n}\n"]}
+{"version":3,"sources":["../../../showcase/src/components/CodeBlock.tsx","../../../showcase/src/components/Link.tsx","../../../showcase/src/components/Divider.tsx"],"names":["Link","jsxs","jsx"],"mappings":";;;;;;AAcO,SAAS,SAAA,CAAU;AAAA,EACxB,IAAA;AAAA,EACA,QAAA;AAAA,EACA,eAAA,GAAkB,KAAA;AAAA,EAClB,IAAA;AAAA,EACA;AACF,CAAA,EAAmB;AACjB,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAS,KAAK,CAAA;AAE1C,EAAA,MAAM,UAAA,GAAa,YAAY,YAAY;AACzC,IAAA,IAAI;AACF,MAAA,MAAM,SAAA,CAAU,SAAA,CAAU,SAAA,CAAU,IAAI,CAAA;AACxC,MAAA,SAAA,CAAU,IAAI,CAAA;AACd,MAAA,UAAA,CAAW,MAAM,SAAA,CAAU,KAAK,CAAA,EAAG,GAAI,CAAA;AAAA,IACzC,CAAA,CAAA,MAAQ;AAAA,IAER;AAAA,EACF,CAAA,EAAG,CAAC,IAAI,CAAC,CAAA;AAET,EAAA,MAAM,KAAA,GAAQ,IAAA,CAAK,KAAA,CAAM,IAAI,CAAA;AAC7B,EAAA,MAAM,KAAA,GAAQ,IAAA,IAAQ,KAAA,CAAM,MAAA,KAAW,CAAA;AACvC,EAAA,MAAM,WAAA,GAAc,kBAAkB,CAAA,EAAG,MAAA,CAAO,MAAM,MAAM,CAAA,CAAE,MAAA,GAAS,CAAC,CAAA,EAAA,CAAA,GAAO,MAAA;AAE/E,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,gBAAA;AAAA,QACA,yDAAA;AAAA,QACA,yEAAA;AAAA,QACA,+BAAA;AAAA,QACA,8BAAA;AAAA,QACA,iBAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,qJAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4BAAA,EACZ,QAAA,EAAA,QAAA,oBAAY,GAAA,CAAC,KAAA,EAAA,EAAM,OAAA,EAAQ,SAAA,EAAU,IAAA,EAAK,IAAA,EAAM,QAAA,EAAA,QAAA,EAAS,CAAA,EAC5D,CAAA;AAAA,0BACA,IAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,IAAA,EAAK,QAAA;AAAA,cACL,OAAA,EAAS,UAAA;AAAA,cACT,SAAA,EAAW,EAAA;AAAA,gBACT,wFAAA;AAAA,gBACA,iEAAA;AAAA,gBACA,+BAAA;AAAA,gBACA,iCAAA;AAAA,gBACA,mBAAA;AAAA,gBACA;AAAA,eACF;AAAA,cACA,YAAA,EAAY,SAAS,QAAA,GAAW,WAAA;AAAA,cAEhC,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,QAAK,IAAA,EAAM,MAAA,GAAS,OAAA,GAAU,QAAA,EAAU,MAAM,EAAA,EAAI,CAAA;AAAA,gBAClD,SAAS,QAAA,GAAW;AAAA;AAAA;AAAA;AACvB,SAAA,EACF,CAAA;AAAA,wBAEA,GAAA,CAAC,SAAI,SAAA,EAAW,KAAA,GAAQ,SAAY,iBAAA,EAAmB,WAAA,EAAW,KAAA,GAAQ,MAAA,GAAS,MAAA,EACjF,QAAA,kBAAA,GAAA,CAAC,SAAI,SAAA,EAAW,EAAA,CAAG,uEAAA,EAAyE,KAAA,IAAS,iCAAiC,CAAA,EACpI,8BAAC,MAAA,EAAA,EACE,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,CAAA;AAAA;AAAA,0BAEhB,IAAA,CAAC,MAAA,EAAA,EAAa,SAAA,EAAW,eAAA,GAAkB,qCAAqC,OAAA,EAC7E,QAAA,EAAA;AAAA,YAAA,eAAA,oBACC,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAU,uEAAA;AAAA,gBACV,KAAA,EAAO,EAAE,KAAA,EAAO,WAAA,EAAY;AAAA,gBAE3B,QAAA,EAAA,CAAA,GAAI;AAAA;AAAA,aACP;AAAA,4BAEF,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,SAAA,EAAW,kBAAQ,GAAA,EAAI;AAAA,WAAA,EAAA,EAT9B,CAUX;AAAA,SACD,CAAA,EACH,GACF,CAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ;ACnEA,IAAM,UAAA,GAAuC;AAAA,EAC3C,MAAA,EAAQ,2HAAA;AAAA,EACR,KAAA,EAAO,qEAAA;AAAA,EACP,OAAA,EAAS;AACX,CAAA;AAEA,IAAM,eAAA,GAAiD;AAAA,EACrD,KAAA,EAAO,8BAAA;AAAA,EACP,MAAA,EAAQ,8BAAA;AAAA,EACR,IAAA,EAAM;AACR,CAAA;AAWO,IAAM,IAAA,GAAO,WAAyC,SAASA,KAAAA,CACpE,EAAE,IAAA,EAAM,QAAA,EAAU,SAAA,GAAY,OAAA,EAAS,IAAA,GAAO,QAAA,EAAU,WAAW,KAAA,EAAO,SAAA,EAAW,SAAA,EAAW,QAAA,EAAU,SAAA,EAAW,SAAA,EAAW,QAAQ,GAAA,EAAK,GAAG,KAAA,EAAM,EACtJ,GAAA,EACA;AACA,EAAA,MAAM,OAAA,GAAU,EAAA;AAAA,IACd,8DAAA;AAAA,IACA,yDAAA;AAAA,IACA,uIAAA;AAAA,IACA,WAAW,IAAI,CAAA;AAAA,IACf,gBAAgB,SAAS,CAAA;AAAA,IACzB;AAAA,GACF;AACA,EAAA,MAAM,cAAA,GAAiB,WAAW,QAAA,GAAW,MAAA;AAC7C,EAAA,MAAM,WAAA,GAAc,QAAA,GAAW,EAAA,CAAG,qBAAA,EAAuB,GAAG,CAAA,GAAI,GAAA;AAChE,EAAA,MAAM,OAAA,mBACJC,IAAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,GAAA,EACH,CAAA;AAGF,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,uBACEC,GAAAA,CAAC,SAAA,EAAA,EAAU,GAAA,EAAU,MAAY,EAAA,EAAI,IAAA,EAAM,SAAA,EAAW,OAAA,EAAS,QAAQ,cAAA,EAAgB,GAAA,EAAK,WAAA,EAAc,GAAG,OAC1G,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEA,GAAAA,CAAC,GAAA,EAAA,EAAE,GAAA,EAAU,IAAA,EAAY,SAAA,EAAW,OAAA,EAAS,MAAA,EAAQ,cAAA,EAAgB,GAAA,EAAK,WAAA,EAAc,GAAG,OACxF,QAAA,EAAA,OAAA,EACH,CAAA;AAEJ,CAAC;ACvEM,SAAS,OAAA,CAAQ;AAAA,EACtB,WAAA,GAAc,YAAA;AAAA,EACd,KAAA;AAAA,EACA;AACF,CAAA,EAAiB;AACf,EAAA,IAAI,gBAAgB,UAAA,EAAY;AAC9B,IAAA,uBACEA,GAAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,WAAA;AAAA,QACL,kBAAA,EAAiB,UAAA;AAAA,QACjB,SAAA,EAAW,EAAA;AAAA,UACT,uCAAA;AAAA,UACA,6BAAA;AAAA,UACA,+BAAA;AAAA,UACA;AAAA;AACF;AAAA,KACF;AAAA,EAEJ;AAEA,EAAA,IAAI,KAAA,EAAO;AACT,IAAA,uBACED,IAAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,WAAA;AAAA,QACL,SAAA,EAAW,EAAA,CAAG,4BAAA,EAA8B,SAAS,CAAA;AAAA,QAErD,QAAA,EAAA;AAAA,0BAAAC,GAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kEAAA,EAAmE,CAAA;AAAA,0BACnFA,GAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4DACb,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,0BACAA,GAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kEAAA,EAAmE;AAAA;AAAA;AAAA,KACrF;AAAA,EAEJ;AAEA,EAAA,uBACEA,GAAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,WAAA;AAAA,MACL,SAAA,EAAW,EAAA;AAAA,QACT,oBAAA;AAAA,QACA,6BAAA;AAAA,QACA,+BAAA;AAAA,QACA;AAAA;AACF;AAAA,GACF;AAEJ","file":"chunk-EYMGLK4M.js","sourcesContent":["import { useState, useCallback } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../lib/icons\";\nimport { Badge } from \"./Badge\";\n\ninterface CodeBlockProps {\n  code: string;\n  language?: string;\n  showLineNumbers?: boolean;\n  /** Wrap long lines instead of scrolling sideways. Default: on for a single-line snippet (a tracking tag, a command), off for multi-line code. */\n  wrap?: boolean;\n  className?: string;\n}\n\nexport function CodeBlock({\n  code,\n  language,\n  showLineNumbers = false,\n  wrap,\n  className,\n}: CodeBlockProps) {\n  const [copied, setCopied] = useState(false);\n\n  const handleCopy = useCallback(async () => {\n    try {\n      await navigator.clipboard.writeText(code);\n      setCopied(true);\n      setTimeout(() => setCopied(false), 2000);\n    } catch {\n      /* clipboard not available */\n    }\n  }, [code]);\n\n  const lines = code.split(\"\\n\");\n  const wraps = wrap ?? lines.length === 1;\n  const gutterWidth = showLineNumbers ? `${String(lines.length).length + 1}ch` : undefined;\n\n  return (\n    <div\n      className={cn(\n        \"relative group\",\n        \"bg-[var(--ds-bg-surface)] text-[var(--ds-text-primary)]\",\n        \"border-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)]\",\n        \"rounded-[var(--ds-radius-md)]\",\n        \"shadow-[var(--ds-shadow-sm)]\",\n        \"overflow-hidden\",\n        className,\n      )}\n    >\n      <div className=\"flex items-center justify-between px-ds-4 py-ds-2 border-b-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)] bg-[var(--ds-bg-muted)]\">\n        <div className=\"flex items-center gap-ds-2\">\n          {language && <Badge variant=\"outline\" size=\"sm\">{language}</Badge>}\n        </div>\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className={cn(\n            \"inline-flex items-center gap-ds-1.5 px-ds-2 py-ds-1 text-xs font-medium cursor-pointer\",\n            \"text-[var(--ds-text-muted)] hover:text-[var(--ds-text-primary)]\",\n            \"rounded-[var(--ds-radius-sm)]\",\n            \"hover:bg-[var(--ds-bg-surface)]\",\n            \"transition-colors\",\n            \"focus-visible:shadow-[var(--ds-shadow-focus)] outline-none\",\n          )}\n          aria-label={copied ? \"Copied\" : \"Copy code\"}\n        >\n          <Icon name={copied ? \"check\" : \"folder\"} size={14} />\n          {copied ? \"Copied\" : \"Copy\"}\n        </button>\n      </div>\n\n      <div className={wraps ? undefined : \"overflow-x-auto\"} data-wrap={wraps ? \"true\" : undefined}>\n        <pre className={cn(\"p-ds-4 text-sm leading-relaxed font-[family-name:var(--ds-font-mono)]\", wraps && \"whitespace-pre-wrap break-words\")}>\n          <code>\n            {lines.map((line, i) => (\n              // with line numbers each line is a two-column row, so a wrapped line continues under its text, not under the gutter\n              <span key={i} className={showLineNumbers ? \"grid grid-cols-[max-content_1fr]\" : \"block\"}>\n                {showLineNumbers && (\n                  <span\n                    className=\"text-right text-[var(--ds-text-muted)] select-none mr-ds-4 opacity-50\"\n                    style={{ width: gutterWidth }}\n                  >\n                    {i + 1}\n                  </span>\n                )}\n                <span className=\"min-w-0\">{line || \" \"}</span>\n              </span>\n            ))}\n          </code>\n        </pre>\n      </div>\n    </div>\n  );\n}\n","import { forwardRef, type AnchorHTMLAttributes, type ComponentType, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\n\ntype LinkUnderline = \"hover\" | \"always\" | \"none\";\ntype LinkTone = \"accent\" | \"muted\" | \"inherit\";\n\nexport interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n  href: string;\n  children: ReactNode;\n  /** When to show the underline. Default \"hover\". */\n  underline?: LinkUnderline;\n  /** Colour: accent (default), muted for secondary links, inherit to match surrounding text. */\n  tone?: LinkTone;\n  /** Opens in a new tab with rel=\"noopener noreferrer\". Default false. */\n  external?: boolean;\n  /**\n   * Render through a router link component instead of a plain anchor\n   * (e.g. `component={RouterLink}` from react-router or next/link). The\n   * component receives the same props; `href` is also passed as `to` for\n   * react-router compatibility.\n   */\n  component?: ComponentType<Record<string, unknown>>;\n  iconLeft?: ReactNode;\n  iconRight?: ReactNode;\n}\n\nconst toneStyles: Record<LinkTone, string> = {\n  accent: \"text-[var(--ds-accent-primary)] hover:text-[var(--ds-accent-primary-hover)] active:text-[var(--ds-accent-primary-active)]\",\n  muted: \"text-[var(--ds-text-secondary)] hover:text-[var(--ds-text-primary)]\",\n  inherit: \"text-inherit hover:text-[var(--ds-accent-primary)]\",\n};\n\nconst underlineStyles: Record<LinkUnderline, string> = {\n  hover: \"no-underline hover:underline\",\n  always: \"underline underline-offset-2\",\n  none: \"no-underline\",\n};\n\n/**\n * Navigation link. Renders a real <a> (or a router link via `component`) so\n * middle-click, open-in-new-tab, right-click \"copy link\" and screen readers\n * all behave correctly. Visually identical to Button variant=\"link\".\n *\n * Use Link for NAVIGATION (to a page or URL). Use Button variant=\"link\" for an\n * ACTION that should look like a link (show more, resend code). Never use a\n * ghost Button for inline text — its padding breaks the line.\n */\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  { href, children, underline = \"hover\", tone = \"accent\", external = false, component: Component, iconLeft, iconRight, className, target, rel, ...props },\n  ref,\n) {\n  const classes = cn(\n    \"inline-flex items-center gap-ds-1 font-medium cursor-pointer\",\n    \"transition-colors duration-[var(--ds-transition-speed)]\",\n    \"focus-visible:outline-2 focus-visible:outline-[var(--ds-accent-primary)] focus-visible:outline-offset-2 rounded-[var(--ds-radius-sm)]\",\n    toneStyles[tone],\n    underlineStyles[underline],\n    className,\n  );\n  const resolvedTarget = external ? \"_blank\" : target;\n  const resolvedRel = external ? cn(\"noopener noreferrer\", rel) : rel;\n  const content = (\n    <>\n      {iconLeft}\n      {children}\n      {iconRight}\n    </>\n  );\n\n  if (Component) {\n    return (\n      <Component ref={ref} href={href} to={href} className={classes} target={resolvedTarget} rel={resolvedRel} {...props}>\n        {content}\n      </Component>\n    );\n  }\n\n  return (\n    <a ref={ref} href={href} className={classes} target={resolvedTarget} rel={resolvedRel} {...props}>\n      {content}\n    </a>\n  );\n});\n","import { cn } from \"../lib/utils\";\nimport type { ReactNode } from \"react\";\n\ntype Orientation = \"horizontal\" | \"vertical\";\n\ninterface DividerProps {\n  orientation?: Orientation;\n  label?: ReactNode;\n  className?: string;\n}\n\nexport function Divider({\n  orientation = \"horizontal\",\n  label,\n  className,\n}: DividerProps) {\n  if (orientation === \"vertical\") {\n    return (\n      <div\n        role=\"separator\"\n        aria-orientation=\"vertical\"\n        className={cn(\n          \"inline-block self-stretch min-h-[1em]\",\n          \"w-[var(--ds-divider-width)]\",\n          \"bg-[var(--ds-border-default)]\",\n          className,\n        )}\n      />\n    );\n  }\n\n  if (label) {\n    return (\n      <div\n        role=\"separator\"\n        className={cn(\"flex items-center gap-ds-3\", className)}\n      >\n        <span className=\"flex-1 h-[var(--ds-divider-width)] bg-[var(--ds-border-default)]\" />\n        <span className=\"text-xs font-medium text-[var(--ds-text-muted)] shrink-0\">\n          {label}\n        </span>\n        <span className=\"flex-1 h-[var(--ds-divider-width)] bg-[var(--ds-border-default)]\" />\n      </div>\n    );\n  }\n\n  return (\n    <hr\n      role=\"separator\"\n      className={cn(\n        \"border-none w-full\",\n        \"h-[var(--ds-divider-width)]\",\n        \"bg-[var(--ds-border-default)]\",\n        className,\n      )}\n    />\n  );\n}\n"]}

package/dist/chunk-IVCVNAXG.js

@@ -0,0 +1,115 @@
+import { useTextOverflow, Tooltip } from './chunk-CXMV7SXJ.js';
+import { cn } from './chunk-M2QRNBDQ.js';
+import { useRef, useState, useLayoutEffect, Fragment } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// ../../showcase/src/lib/table-utils.ts
+var DATE_ISO = /^\d{4}-\d{2}-\d{2}$/;
+var DATE_US = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
+var MONTH = "[A-Z][a-z]{2,8}\\.?";
+var DATE_TEXT_MDY = new RegExp(`^${MONTH}\\s+\\d{1,2},?\\s+\\d{4}$`);
+var DATE_TEXT_DMY = new RegExp(`^\\d{1,2}\\s+${MONTH}\\s+\\d{4}$`);
+var MONTH_NAME = "(?:Jan(?:uary)?|Feb(?:ruary)?|Mar(?:ch)?|Apr(?:il)?|May|June?|July?|Aug(?:ust)?|Sep(?:t(?:ember)?)?|Oct(?:ober)?|Nov(?:ember)?|Dec(?:ember)?)\\.?";
+var DATE_TEXT_MD = new RegExp(`^${MONTH_NAME}\\s+\\d{1,2}$`);
+var DATE_TEXT_DM = new RegExp(`^\\d{1,2}\\s+${MONTH_NAME}$`);
+var NUMBER_RE = /^[$€£¥]?\s?[\d,]+\.?\d*\s?(?:%|[KMGTP]i?B|B|bytes?|ms|s|sec|min|h|hrs?|kg|g|km|m|°[CF])?$/i;
+var IDENTIFIER_RE = /^\d{13,}$/;
+var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+function isDate(v) {
+  return DATE_ISO.test(v) || DATE_US.test(v) || DATE_TEXT_MDY.test(v) || DATE_TEXT_DMY.test(v) || DATE_TEXT_MD.test(v) || DATE_TEXT_DM.test(v);
+}
+function isJsx(v) {
+  return typeof v === "object" && v !== null;
+}
+function detectKind(values) {
+  const present = values.filter((v) => v != null);
+  if (present.length === 0) return void 0;
+  if (present.some(isJsx)) return void 0;
+  if (present.every((v) => typeof v === "string" && isDate(v))) return "date";
+  if (present.every((v) => typeof v === "string" && IDENTIFIER_RE.test(v) || typeof v === "number" && Math.abs(v) >= 1e13 && Number.isInteger(v))) return "identifier";
+  if (present.every((v) => typeof v === "number")) return "number";
+  if (present.every((v) => typeof v === "string" && NUMBER_RE.test(v))) return "number";
+  if (present.every((v) => typeof v === "string" && EMAIL_RE.test(v))) return "email";
+  if (present.every((v) => typeof v === "string" && v.length <= 20 && !/[\n\r]/.test(v))) return "label";
+  return "text";
+}
+function kindOfRenderedText(texts) {
+  const kind = detectKind(texts.map((t) => t.trim()).filter(Boolean));
+  return kind === "date" || kind === "number" ? kind : void 0;
+}
+function inferColumnKinds(data, columnKeys, maxSample = 50) {
+  const sample = data.length > maxSample ? data.slice(0, maxSample) : data;
+  const result = /* @__PURE__ */ new Map();
+  for (const key of columnKeys) {
+    const values = sample.map((row) => row[key]);
+    const kind = detectKind(values);
+    if (kind) result.set(key, kind);
+  }
+  return result;
+}
+var CARD_VALUE_CLASS = cn(
+  "min-w-0 text-right text-[var(--ds-text-primary)]",
+  "[overflow-wrap:break-word] [&_*]:min-w-0 [&_*]:[overflow-wrap:break-word]",
+  // A hand-rolled avatar cell (div > Avatar + text) keeps its row and sits against the value column's right edge,
+  // like EntityCell (round 7: the stacked cell was replaced).
+  "[&:has([data-avatar])>*]:flex [&:has([data-avatar])>*]:items-center [&:has([data-avatar])>*]:justify-end [&:has([data-avatar])>*]:text-right"
+);
+var BREAK_AFTER = /([@./-])/g;
+function breakable(text) {
+  const parts = text.split(BREAK_AFTER);
+  if (parts.length === 1) return text;
+  return parts.map((part, i) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    part,
+    i % 2 === 1 && /* @__PURE__ */ jsx("wbr", {})
+  ] }, i));
+}
+function CardStringValue({ text }) {
+  const { ref, isTruncated } = useTextOverflow({ lines: 2, content: text });
+  const el = /* @__PURE__ */ jsx("span", { ref, className: "block line-clamp-2", children: breakable(text) });
+  return isTruncated ? /* @__PURE__ */ jsx(Tooltip, { content: text, children: el }) : el;
+}
+function CardValue({ value, id }) {
+  return /* @__PURE__ */ jsx("span", { id, className: CARD_VALUE_CLASS, children: typeof value === "string" ? /* @__PURE__ */ jsx(CardStringValue, { text: value }) : value });
+}
+var CARDS_BELOW = 440;
+var CARDS_HYSTERESIS = 40;
+function useCardsSwitch(narrowScreen, cardsBelow = CARDS_BELOW, remeasure) {
+  const rootRef = useRef(null);
+  const [narrowBox, setNarrowBox] = useState(false);
+  const needed = useRef(0);
+  const cards = narrowScreen || narrowBox;
+  useLayoutEffect(() => {
+    const root = rootRef.current;
+    if (!root || cardsBelow <= 0) {
+      setNarrowBox(false);
+      return;
+    }
+    const measure = () => {
+      const width = root.getBoundingClientRect().width;
+      if (width === 0) return;
+      if (narrowBox) {
+        if (width >= Math.min(needed.current, cardsBelow + CARDS_HYSTERESIS)) setNarrowBox(false);
+        return;
+      }
+      if (cards) return;
+      const frame = root.querySelector("[data-table-scroll]") ?? root;
+      const over = frame.scrollWidth - frame.clientWidth;
+      if (width < cardsBelow && over > 1) {
+        needed.current = width + over;
+        setNarrowBox(true);
+      }
+    };
+    measure();
+    if (typeof ResizeObserver === "undefined") return;
+    const observer = new ResizeObserver(measure);
+    observer.observe(root);
+    const table = root.querySelector("[data-table-scroll] > *");
+    if (table) observer.observe(table);
+    return () => observer.disconnect();
+  }, [cardsBelow, cards, narrowBox, remeasure]);
+  return { cards, rootRef };
+}
+
+export { CARDS_BELOW, CardValue, inferColumnKinds, kindOfRenderedText, useCardsSwitch };
+//# sourceMappingURL=chunk-IVCVNAXG.js.map
+//# sourceMappingURL=chunk-IVCVNAXG.js.map

package/dist/chunk-IVCVNAXG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../showcase/src/lib/table-utils.ts","../../../showcase/src/lib/card-cell.tsx","../../../showcase/src/lib/use-cards-switch.ts"],"names":[],"mappings":"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","file":"chunk-IVCVNAXG.js","sourcesContent":["/** Shared column-kind inference for Table and DataGrid. */\n\n/**\n * What a column holds, which decides how its cells lay out: numbers and dates shrink to their content and stay whole,\n * an identifier (a long run of digits: a barcode, an ID) may wrap anywhere, an email truncates, text wraps at spaces.\n */\nexport type ColumnKind = \"date\" | \"number\" | \"email\" | \"label\" | \"text\" | \"identifier\";\n\nconst DATE_ISO = /^\\d{4}-\\d{2}-\\d{2}$/;\nconst DATE_US = /^\\d{1,2}\\/\\d{1,2}\\/\\d{4}$/;\n// a month's name or its short form, with or without a full stop: \"Jan\", \"Sept\", \"Sep.\", \"September\" (Sprint 25.13 A35)\nconst MONTH = \"[A-Z][a-z]{2,8}\\\\.?\";\nconst DATE_TEXT_MDY = new RegExp(`^${MONTH}\\\\s+\\\\d{1,2},?\\\\s+\\\\d{4}$`);   // \"Jan 12, 2024\" or \"Sept 12 2024\"\nconst DATE_TEXT_DMY = new RegExp(`^\\\\d{1,2}\\\\s+${MONTH}\\\\s+\\\\d{4}$`);      // \"12 Jan 2024\", \"24 Sept 2026\"\n// a date this year, with no year: \"Sep 16\", \"16 Sept\" (the review of 30 September). Only a month's own name, so \"Room 12\"\n// isn't a date.\nconst MONTH_NAME = \"(?:Jan(?:uary)?|Feb(?:ruary)?|Mar(?:ch)?|Apr(?:il)?|May|June?|July?|Aug(?:ust)?|Sep(?:t(?:ember)?)?|Oct(?:ober)?|Nov(?:ember)?|Dec(?:ember)?)\\\\.?\";\nconst DATE_TEXT_MD = new RegExp(`^${MONTH_NAME}\\\\s+\\\\d{1,2}$`);\nconst DATE_TEXT_DM = new RegExp(`^\\\\d{1,2}\\\\s+${MONTH_NAME}$`);\n// a number, with a currency before or a unit after it: \"$1,200\", \"12%\", \"18 KB\", \"1.2 MB\", \"250 ms\" (Sprint 25.13 A35)\nconst NUMBER_RE = /^[$€£¥]?\\s?[\\d,]+\\.?\\d*\\s?(?:%|[KMGTP]i?B|B|bytes?|ms|s|sec|min|h|hrs?|kg|g|km|m|°[CF])?$/i;\n// a long run of digits is an identifier, never a quantity: a barcode or an account number (Sprint 25.13 A35)\nconst IDENTIFIER_RE = /^\\d{13,}$/;\nconst EMAIL_RE = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\n\nfunction isDate(v: string): boolean {\n  return DATE_ISO.test(v) || DATE_US.test(v) || DATE_TEXT_MDY.test(v) || DATE_TEXT_DMY.test(v) || DATE_TEXT_MD.test(v) || DATE_TEXT_DM.test(v);\n}\n\nfunction isJsx(v: unknown): boolean {\n  return typeof v === \"object\" && v !== null;\n}\n\nfunction detectKind(values: unknown[]): ColumnKind | undefined {\n  // Filter out null/undefined\n  const present = values.filter((v) => v != null);\n  if (present.length === 0) return undefined;\n\n  // Any JSX value means no kind\n  if (present.some(isJsx)) return undefined;\n\n  // Check date (strings only)\n  if (present.every((v) => typeof v === \"string\" && isDate(v))) return \"date\";\n\n  // A long run of digits, as text or as a number too large to be one: an identifier\n  if (present.every((v) => (typeof v === \"string\" && IDENTIFIER_RE.test(v)) || (typeof v === \"number\" && Math.abs(v) >= 1e13 && Number.isInteger(v)))) return \"identifier\";\n\n  // Check number: all typeof number, or all strings matching the number pattern\n  if (present.every((v) => typeof v === \"number\")) return \"number\";\n  if (present.every((v) => typeof v === \"string\" && NUMBER_RE.test(v))) return \"number\";\n\n  // Check email\n  if (present.every((v) => typeof v === \"string\" && EMAIL_RE.test(v))) return \"email\";\n\n  // Check label: strings <= 20 chars, no line breaks\n  if (present.every((v) => typeof v === \"string\" && v.length <= 20 && !/[\\n\\r]/.test(v))) return \"label\";\n\n  // Fallback\n  return \"text\";\n}\n\n/**\n * The kind of a column from the words its cells show (Sprint 25.13 A35): a column of elements has no kind from its\n * values, so the Table reads what they render. Only a date or a number counts from rendered text, to keep it whole.\n */\nexport function kindOfRenderedText(texts: string[]): ColumnKind | undefined {\n  const kind = detectKind(texts.map((t) => t.trim()).filter(Boolean));\n  return kind === \"date\" || kind === \"number\" ? kind : undefined;\n}\n\n/**\n * Sample data rows and infer a ColumnKind for each key.\n * Returns a Map of key -> kind for columns that matched a pattern.\n * Columns with mixed types or JSX values get no entry.\n */\nexport function inferColumnKinds(\n  data: Record<string, unknown>[],\n  columnKeys: string[],\n  maxSample = 50,\n): Map<string, ColumnKind> {\n  const sample = data.length > maxSample ? data.slice(0, maxSample) : data;\n  const result = new Map<string, ColumnKind>();\n\n  for (const key of columnKeys) {\n    const values = sample.map((row) => row[key]);\n    const kind = detectKind(values);\n    if (kind) result.set(key, kind);\n  }\n\n  return result;\n}\n","/**\n * The value cell of a Table or DataGrid in card mode (Sprint 25.4 C-2, C-4).\n *\n * A card row is `label | value`, the value right-aligned. Three things a value must do on a phone:\n * - wrap a long single string at sensible points first (after @, ., /, -) and mid-word only as a last resort\n *   (`overflow-wrap: break-word` breaks inside a word only when the word alone cannot fit a line);\n * - clamp after two lines with the full text in a tooltip;\n * - reach the builder's own markup: a nested flex row (icon + name) keeps `min-width: auto` and overflows unless\n *   every descendant is told `min-width: 0` and given the same break rule.\n *\n * A cell that holds an Avatar stacks: the avatar above, the primary text, then the secondary, aligned to the value\n * column. The rule is CSS (`:has([data-avatar])`) on the value cell's direct child, so a hand-rolled\n * `<div class=\"flex\"><Avatar/><div>…</div></div>` stacks the same way EntityCell does.\n */\nimport { Fragment, type ReactNode } from \"react\";\nimport { cn } from \"./utils\";\nimport { Tooltip } from \"../components/Tooltip\";\nimport { useTextOverflow } from \"./use-text-overflow\";\n\nexport const CARD_VALUE_CLASS = cn(\n  \"min-w-0 text-right text-[var(--ds-text-primary)]\",\n  \"[overflow-wrap:break-word] [&_*]:min-w-0 [&_*]:[overflow-wrap:break-word]\",\n  // A hand-rolled avatar cell (div > Avatar + text) keeps its row and sits against the value column's right edge,\n  // like EntityCell (round 7: the stacked cell was replaced).\n  \"[&:has([data-avatar])>*]:flex [&:has([data-avatar])>*]:items-center [&:has([data-avatar])>*]:justify-end [&:has([data-avatar])>*]:text-right\",\n);\n\nconst BREAK_AFTER = /([@./-])/g;\n\n/** The string with a soft break opportunity after each @, ., / and -, so a long email or path wraps there first. */\nexport function breakable(text: string): ReactNode {\n  const parts = text.split(BREAK_AFTER);\n  if (parts.length === 1) return text;\n  return parts.map((part, i) => (\n    <Fragment key={i}>{part}{i % 2 === 1 && <wbr />}</Fragment>\n  ));\n}\n\n/** A string value: sensible breaks, two lines, the full text as a tooltip once it clamps. */\nexport function CardStringValue({ text }: { text: string }) {\n  const { ref, isTruncated } = useTextOverflow({ lines: 2, content: text });\n  const el = <span ref={ref} className=\"block line-clamp-2\">{breakable(text)}</span>;\n  return isTruncated ? <Tooltip content={text}>{el}</Tooltip> : el;\n}\n\nexport function CardValue({ value, id }: { value: ReactNode; id?: string }) {\n  return (\n    <span id={id} className={CARD_VALUE_CLASS}>\n      {typeof value === \"string\" ? <CardStringValue text={value} /> : value}\n    </span>\n  );\n}\n","import { useLayoutEffect, useRef, useState } from \"react\";\n\n/**\n * Sprint 25.13 A35: below this width of its own, about a phone's, a table that doesn't fit shows cards; it goes back to\n * a table once it has the room the table needed, or this much more, so a width near the line can't flip it back and\n * forth.\n */\nexport const CARDS_BELOW = 440;\nexport const CARDS_HYSTERESIS = 40;\n\n/**\n * Whether a table (Table, DataGrid) shows cards (Sprint 25.13 A35): on a narrow screen, as before, and anywhere else\n * only when its own width is under `cardsBelow` and the table doesn't fit it — measured on the element `rootRef` holds,\n * never against the screen's breakpoint, so a table in a pane, a drawer or a dialog stays a table and scrolls sideways,\n * and a table that fits stays a table however narrow its box. 0 never switches by width. The root is whichever element\n * renders, so the measure follows the mode and `remeasure` (a titled table's root differs). A width of 0 (not laid out\n * yet, or no layout at all) decides nothing.\n *\n * The review of 30 September: the switch measured the root in both modes, and in a box that sizes to its content (a\n * flex item, an inline-block, a grid item placed at its start) the table's width said cards and the cards' width said\n * table, so it flipped on every commit until React stopped the page. It now decides each way from what the other mode\n * can't change: a table goes to cards when it overflows its frame (a box sized to its content never makes it overflow),\n * and cards go back once the root has the width the table needed then, which the cards can't make it overflow again.\n */\nexport function useCardsSwitch(narrowScreen: boolean, cardsBelow: number = CARDS_BELOW, remeasure?: unknown) {\n  const rootRef = useRef<HTMLElement | null>(null);\n  const [narrowBox, setNarrowBox] = useState(false);\n  // the root's width at which the table fits its frame, read when it went to cards\n  const needed = useRef(0);\n  const cards = narrowScreen || narrowBox;\n  useLayoutEffect(() => {\n    const root = rootRef.current;\n    if (!root || cardsBelow <= 0) { setNarrowBox(false); return; }\n    const measure = () => {\n      const width = root.getBoundingClientRect().width;\n      if (width === 0) return;\n      if (narrowBox) {\n        if (width >= Math.min(needed.current, cardsBelow + CARDS_HYSTERESIS)) setNarrowBox(false);\n        return;\n      }\n      // cards shown for a narrow screen measure nothing: the table isn't drawn to read\n      if (cards) return;\n      const frame = root.querySelector<HTMLElement>(\"[data-table-scroll]\") ?? root;\n      const over = frame.scrollWidth - frame.clientWidth;\n      if (width < cardsBelow && over > 1) {\n        needed.current = width + over;\n        setNarrowBox(true);\n      }\n    };\n    measure();\n    if (typeof ResizeObserver === \"undefined\") return;\n    const observer = new ResizeObserver(measure);\n    observer.observe(root);\n    // the table's own width too: rows arriving can make it overflow a frame that keeps its size\n    const table = root.querySelector(\"[data-table-scroll] > *\");\n    if (table) observer.observe(table);\n    return () => observer.disconnect();\n  }, [cardsBelow, cards, narrowBox, remeasure]);\n  return { cards, rootRef };\n}\n"]}

package/dist/chunk-RG4KUCRS.js

@@ -0,0 +1,9 @@
+import { createContext } from 'react';
+
+// ../../showcase/src/lib/surface-context.ts
+var SplitPaneCtx = createContext(false);
+var TableCardCtx = createContext(false);
+
+export { SplitPaneCtx, TableCardCtx };
+//# sourceMappingURL=chunk-RG4KUCRS.js.map
+//# sourceMappingURL=chunk-RG4KUCRS.js.map

package/dist/chunk-RG4KUCRS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../showcase/src/lib/surface-context.ts"],"names":[],"mappings":";;;AAMO,IAAM,YAAA,GAAe,cAAc,KAAK;AAOxC,IAAM,YAAA,GAAe,cAAc,KAAK","file":"chunk-RG4KUCRS.js","sourcesContent":["import { createContext } from \"react\";\n\n/**\n * True inside a SplitView pane (list, detail, aside). A StackedList reads it to take its inset from the pane\n * (Sprint 25.4 C-5): rows keep their padding so the selection rail sits at the pane's edge and never touches content.\n */\nexport const SplitPaneCtx = createContext(false);\n\n/**\n * True inside a Table or DataGrid card (the phone layout below mobileBreakpoint). An EntityCell reads it to keep\n * the avatar beside the text and align to the value column (Sprint 25.4, round 7: the stacked cell made the card\n * three lines taller than it needed to be).\n */\nexport const TableCardCtx = createContext(false);\n"]}

package/dist/{chunk-XYDIBW3J.js → chunk-SBTBMAIU.js}

@@ -1,4 +1,4 @@
-import { useTextOverflow, Tooltip } from './chunk-ILIODA7W.js';
+import { useTextOverflow, Tooltip } from './chunk-CXMV7SXJ.js';
 import { Icon } from './chunk-4LDYR7QP.js';
 import { cn } from './chunk-M2QRNBDQ.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -72,6 +72,7 @@ function Badge({ variant = "default", severity, size = "md", color, iconLeft, ic
   const badge = /* @__PURE__ */ jsxs(
     "span",
     {
+      "data-gs-badge": "",
       className: cn(
         "inline-flex items-center font-medium max-w-full whitespace-nowrap shrink-0",
         "rounded-[var(--ds-radius-full)]",
@@ -97,5 +98,5 @@ function Badge({ variant = "default", severity, size = "md", color, iconLeft, ic
 }
 
 export { Badge };
-//# sourceMappingURL=chunk-XYDIBW3J.js.map
-//# sourceMappingURL=chunk-XYDIBW3J.js.map
+//# sourceMappingURL=chunk-SBTBMAIU.js.map
+//# sourceMappingURL=chunk-SBTBMAIU.js.map

package/dist/chunk-SBTBMAIU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../showcase/src/components/Badge.tsx"],"names":[],"mappings":"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","file":"chunk-SBTBMAIU.js","sourcesContent":["import { cn } from \"../lib/utils\";\nimport { Icon, type IconName } from \"../lib/icons\";\nimport { Tooltip } from \"./Tooltip\";\nimport { useTextOverflow } from \"../lib/use-text-overflow\";\nimport type { ReactNode } from \"react\";\n\nexport type BadgeVariant =\n  | \"default\"\n  | \"neutral\"\n  | \"subtle\"\n  | \"success\"\n  | \"success-soft\"\n  | \"warning\"\n  | \"warning-soft\"\n  | \"error\"\n  | \"error-soft\"\n  | \"outline\";\n\nexport type BadgeSize = \"xs\" | \"sm\" | \"md\";\nexport type BadgePaletteColor = 1 | 2 | 3 | 4 | 5;\nexport type BadgeSeverity = \"info\" | \"low\" | \"medium\" | \"high\" | \"critical\";\n\nconst severityToVariant: Record<BadgeSeverity, BadgeVariant> = {\n  info: \"neutral\",\n  low: \"success-soft\",\n  medium: \"warning-soft\",\n  high: \"error-soft\",\n  critical: \"error\",\n};\n\nconst variantStyles: Record<BadgeVariant, string> = {\n  default: \"bg-[var(--ds-accent-primary)] [background-image:var(--ds-gradient)] text-[var(--ds-text-on-primary)]\",\n  neutral: \"bg-[var(--ds-text-muted)]/[0.12] text-[var(--ds-text-secondary)]\",\n  subtle: \"bg-[var(--ds-bg-muted)] text-[var(--ds-text-secondary)]\",\n  success: \"bg-[var(--ds-status-success)] text-[var(--ds-text-on-success)]\",\n  \"success-soft\": \"bg-[var(--ds-status-success-bg)] text-[var(--ds-status-success)] border-[length:var(--ds-border-width)] border-[var(--ds-status-success)]/[0.2]\",\n  warning: \"bg-[var(--ds-status-warning)] text-[var(--ds-text-on-warning)]\",\n  \"warning-soft\": \"bg-[var(--ds-status-warning-bg)] text-[var(--ds-status-warning-text)] border-[length:var(--ds-border-width)] border-[var(--ds-status-warning)]/[0.2]\",\n  error: \"bg-[var(--ds-status-error)] text-[var(--ds-text-on-error)]\",\n  \"error-soft\": \"bg-[var(--ds-status-error-bg)] text-[var(--ds-status-error)] border-[length:var(--ds-border-width)] border-[var(--ds-status-error)]/[0.2]\",\n  outline: \"bg-transparent text-[var(--ds-text-primary)] border-[length:var(--ds-border-width)] border-[var(--ds-border-default)]\",\n};\n\nconst sizeStyles: Record<BadgeSize, string> = {\n  xs: \"px-ds-1.5 py-[1px] text-[length:10px] gap-[3px]\",\n  sm: \"px-ds-2 py-ds-0.5 text-[length:var(--ds-font-size-xs)] gap-ds-1\",\n  md: \"px-ds-2.5 py-ds-0.5 text-[length:var(--ds-font-size-xs)] gap-ds-1\",\n};\n\nconst iconSizes: Record<BadgeSize, number> = {\n  xs: 10,\n  sm: 12,\n  md: 12,\n};\n\ntype PaletteStyleFn = (n: BadgePaletteColor) => string;\n\nconst paletteByVariant: Record<string, PaletteStyleFn> = {\n  default: (n) => paletteDefault[n],\n  neutral: (n) => paletteSubtle[n],\n  subtle: (n) => paletteSubtle[n],\n  outline: (n) => paletteOutline[n],\n};\n\nconst paletteDefault: Record<BadgePaletteColor, string> = {\n  1: \"bg-[var(--ds-palette-1-bold)] text-[var(--ds-palette-1-on-bold)]\",\n  2: \"bg-[var(--ds-palette-2-bold)] text-[var(--ds-palette-2-on-bold)]\",\n  3: \"bg-[var(--ds-palette-3-bold)] text-[var(--ds-palette-3-on-bold)]\",\n  4: \"bg-[var(--ds-palette-4-bold)] text-[var(--ds-palette-4-on-bold)]\",\n  5: \"bg-[var(--ds-palette-5-bold)] text-[var(--ds-palette-5-on-bold)]\",\n};\n\nconst paletteSubtle: Record<BadgePaletteColor, string> = {\n  1: \"bg-[var(--ds-palette-1-bg)] text-[var(--ds-palette-1-text)]\",\n  2: \"bg-[var(--ds-palette-2-bg)] text-[var(--ds-palette-2-text)]\",\n  3: \"bg-[var(--ds-palette-3-bg)] text-[var(--ds-palette-3-text)]\",\n  4: \"bg-[var(--ds-palette-4-bg)] text-[var(--ds-palette-4-text)]\",\n  5: \"bg-[var(--ds-palette-5-bg)] text-[var(--ds-palette-5-text)]\",\n};\n\nconst paletteOutline: Record<BadgePaletteColor, string> = {\n  1: \"bg-transparent text-[var(--ds-palette-1-bold)] border-[length:var(--ds-border-width)] border-[var(--ds-palette-1-bold)]\",\n  2: \"bg-transparent text-[var(--ds-palette-2-bold)] border-[length:var(--ds-border-width)] border-[var(--ds-palette-2-bold)]\",\n  3: \"bg-transparent text-[var(--ds-palette-3-bold)] border-[length:var(--ds-border-width)] border-[var(--ds-palette-3-bold)]\",\n  4: \"bg-transparent text-[var(--ds-palette-4-bold)] border-[length:var(--ds-border-width)] border-[var(--ds-palette-4-bold)]\",\n  5: \"bg-transparent text-[var(--ds-palette-5-bold)] border-[length:var(--ds-border-width)] border-[var(--ds-palette-5-bold)]\",\n};\n\nfunction getPaletteClasses(color: BadgePaletteColor, variant: BadgeVariant): string {\n  const styleFn = paletteByVariant[variant] ?? paletteByVariant.default;\n  return styleFn(color);\n}\n\ninterface BadgeProps {\n  variant?: BadgeVariant;\n  /** Severity shorthand — maps to a variant. When set, overrides `variant`. */\n  severity?: BadgeSeverity;\n  size?: BadgeSize;\n  /** Palette colour (1-5). Overrides variant colour with decorative palette tokens. */\n  color?: BadgePaletteColor;\n  /** Icon to show before the label */\n  iconLeft?: IconName;\n  /** Icon to show after the label */\n  iconRight?: IconName;\n  /** Max width before truncation (e.g. \"120px\", \"16ch\"). Shows tooltip when truncated. */\n  maxWidth?: string;\n  className?: string;\n  children?: ReactNode;\n}\n\nexport function Badge({ variant = \"default\", severity, size = \"md\", color, iconLeft, iconRight, maxWidth, className, children }: BadgeProps) {\n  // severity sets the variant and variant is ignored when both are written\n  const resolvedVariant = severity ? severityToVariant[severity] : variant;\n  const { ref: truncRef, isTruncated } = useTextOverflow({ lines: 1, disabled: !maxWidth });\n  const iconSize = iconSizes[size];\n  const isIconOnly = (iconLeft || iconRight) && !children;\n\n  const colorClasses = color\n    ? getPaletteClasses(color, resolvedVariant)\n    : variantStyles[resolvedVariant];\n\n  const badge = (\n    <span\n      // Sprint 25.13 A1: a card header reads this to put a badge in its actions beside the title (D1a), and a card grid\n      // to size from what its headers hold (A2)\n      data-gs-badge=\"\"\n      className={cn(\n        \"inline-flex items-center font-medium max-w-full whitespace-nowrap shrink-0\",\n        \"rounded-[var(--ds-radius-full)]\",\n        sizeStyles[size],\n        isIconOnly && size === \"xs\" && \"px-[3px]\",\n        isIconOnly && size === \"sm\" && \"px-ds-1\",\n        isIconOnly && size === \"md\" && \"px-ds-1.5\",\n        colorClasses,\n        className\n      )}\n      style={maxWidth ? { maxWidth } : undefined}\n    >\n      {iconLeft && <Icon name={iconLeft} size={iconSize} className=\"shrink-0\" />}\n      {maxWidth ? (\n        <span ref={truncRef} className=\"truncate\">{children}</span>\n      ) : (\n        children\n      )}\n      {iconRight && <Icon name={iconRight} size={iconSize} className=\"shrink-0\" />}\n    </span>\n  );\n\n  if (isTruncated) {\n    return <Tooltip content={children}>{badge}</Tooltip>;\n  }\n  return badge;\n}\n"]}

package/dist/data-grid.d.ts

@@ -1,6 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ColumnDef } from '@tanstack/react-table';
-import { B as BreakpointKey, C as ColumnKind } from './table-utils-GounRE6s.js';
+import { B as BreakpointKey, C as ColumnKind } from './table-utils-BkjNEWts.js';
+import { P as Pager } from './use-pagination-DiJo0aW5.js';
 import 'react';
 
 /** Column meta for opt-in truncation. Set on ColumnDef.meta. */
@@ -19,17 +20,50 @@ interface DataGridColumnMeta {
     kind?: ColumnKind;
     /** Horizontal alignment of the header and the cells; a block element (a Checkbox, a Button) is laid out with flex so it follows too (round 14). Default: numbers right, everything else left. */
     align?: "left" | "center" | "right";
+    /** In an editable grid, whether this column's cells edit (default true); false for a column that shows (a status, actions). */
+    editable?: boolean;
+    /**
+     * In an editable grid, the value onCellEdit gets from the text typed (default the text itself): a number column's
+     * `(text) => Number(text)`, so a salary stays a number (the review of 30 September).
+     */
+    parse?: (text: string) => unknown;
 }
 interface DataGridProps<T> {
     data: T[];
     columns: ColumnDef<T, any>[];
+    /**
+     * Rows a page, over the project's (dataDisplay.itemsPerPage), for a grid the user asked to page differently. Leave it
+     * out: the grid pages as the project says, with the project's control (Sprint 25.13 A5; it was 10).
+     */
     pageSize?: number;
+    /**
+     * Cells edit in place, as the APG's grid (Sprint 25.13 A5): the grid is one Tab stop and the arrow keys move between
+     * cells; Enter or F2 (or a double-click) opens a cell's editor, Enter or leaving it saves and Escape cancels, and a
+     * brief tick, announced as "Saved", shows the save. A grid saves as you go, so it never marks a form around it.
+     */
     editable?: boolean;
-    onCellEdit?: (rowIndex: number, columnId: string, value: unknown) => void;
-    /** Breakpoint at which the grid switches to card layout. Defaults to "md" (768px). */
+    /**
+     * A saved edit: the row's index in `data`, the column's id and the new value (the text typed, or the column's
+     * `meta.parse` of it). Called only when the value changed. Return a promise to have the tick and "Saved" wait for it:
+     * a rejection is announced as "Not saved", and the page says why and keeps the old value.
+     */
+    onCellEdit?: (rowIndex: number, columnId: string, value: unknown) => void | Promise<unknown>;
+    /** The screen width below which the grid shows cards: the project's responsive.tableToCardsBreakpoint, else "md". */
     mobileBreakpoint?: BreakpointKey;
+    /**
+     * The grid's own width below which it shows cards when it doesn't fit, in px (Sprint 25.13 A35): about a phone's; 0
+     * never switches by width. An editable grid never shows cards: it stays the APG's grid, scrolling sideways.
+     */
+    cardsBelow?: number;
+    /**
+     * The list's pager (Sprint 25.13 A3), from `usePagination(data)` over the same rows: pass it when the page also shows
+     * the count (TableToolbar). Without it the grid pages itself the same way.
+     */
+    pager?: Pager<unknown>;
+    /** The grid's name for assistive tech. */
+    "aria-label"?: string;
     className?: string;
 }
-declare function DataGrid<T>({ data, columns, pageSize, editable, onCellEdit, mobileBreakpoint: mobileBreakpointProp, className, }: DataGridProps<T>): react_jsx_runtime.JSX.Element;
+declare function DataGrid<T>({ data, columns, pageSize, editable, onCellEdit, mobileBreakpoint: mobileBreakpointProp, cardsBelow, pager: pagerProp, "aria-label": ariaLabel, className, }: DataGridProps<T>): react_jsx_runtime.JSX.Element;
 
 export { DataGrid, type DataGridColumnMeta };