@mastra/playground-ui 56.0.0 → 57.0.0-alpha.1

package/dist/components/Breadcrumb.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.cjs.js","sources":["../../src/ds/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { SlashIcon } from '../../icons/SlashIcon';\nimport { Skeleton } from '@/ds/components/Skeleton';\nimport { controlSizeClasses } from '@/ds/primitives/control-size';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nexport interface BreadcrumbProps {\n  children?: React.ReactNode;\n  label?: string;\n  className?: string;\n  listClassName?: string;\n}\n\nexport const Breadcrumb = ({ children, label, className, listClassName }: BreadcrumbProps) => {\n  return (\n    <nav aria-label={label} className={className}>\n      <ol className={cn('flex items-center gap-0.5', listClassName)}>{children}</ol>\n    </nav>\n  );\n};\n\nexport interface CrumbProps {\n  isCurrent?: boolean;\n  as: React.ElementType;\n  className?: string;\n  to?: string;\n  prefetch?: boolean | null;\n  children?: React.ReactNode;\n  /** Prefix icon (bare SVG). The crumb wraps it in `<Icon>` and aligns it like a Button adornment. */\n  icon?: React.ReactNode;\n  /** Renders `CrumbSkeleton` in place of the label. */\n  isLoading?: boolean;\n  /**\n   * Sibling control rendered next to the label (never inside it). Expected to be a\n   * `size=\"icon-sm\"` ghost control: an icon-only Combobox switcher, a CopyButton, …\n   */\n  action?: React.ReactNode;\n  'data-testid'?: string;\n}\n\nexport const CrumbSkeleton = (props: { 'data-testid'?: string }) => <Skeleton className=\"h-3 w-24\" {...props} />;\n\nexport const Crumb = ({ className, as, isCurrent, action, icon, isLoading, children, ...props }: CrumbProps) => {\n  const Root = as || 'span';\n\n  return (\n    <>\n      <li className={cn('group flex h-control-sm min-w-0 items-center', isCurrent ? 'shrink' : 'shrink-0')}>\n        <Root\n          aria-current={isCurrent ? 'page' : undefined}\n          className={cn(\n            // Same box as `buttonVariants({ variant: 'ghost', size: 'sm' })` so a label and an\n            // icon-sm control sitting next to it share height, radius, padding and colors.\n            'inline-flex min-w-0 items-center gap-2 overflow-hidden rounded-full px-[.9em]',\n            controlSizeClasses.sm,\n            controlStateColorTransition,\n            // Long labels truncate: the current crumb gets more room than nav crumbs.\n            isCurrent\n              ? 'max-w-xs cursor-default text-foreground'\n              : cn(quietTextHover, 'max-w-48 cursor-pointer hover:bg-fill-subtle active:bg-fill'),\n            className,\n          )}\n          {...props}\n        >\n          {icon && (\n            <Icon\n              className={cn(\n                '-ml-[.3em] shrink-0 opacity-50 group-hover:opacity-100',\n                'transition-opacity duration-normal ease-out-custom',\n              )}\n            >\n              {icon}\n            </Icon>\n          )}\n          {isLoading ? (\n            <CrumbSkeleton />\n          ) : (\n            // `text-overflow` needs a block container, so the label truncates in its\n            // own box rather than on the flex Root. Works for plain strings and for\n            // components that resolve to a string (route-header `Component` crumbs).\n            <span className=\"min-w-0 flex-1 truncate\">{children}</span>\n          )}\n        </Root>\n        {action && <span className=\"h-control-sm -ml-1 flex shrink-0 items-center\">{action}</span>}\n      </li>\n      {!isCurrent && (\n        <li role=\"separator\" className=\"flex h-full items-center\">\n          <Icon className=\"text-placeholder\">\n            <SlashIcon />\n          </Icon>\n        </li>\n      )}\n    </>\n  );\n};\n"],"names":["jsx","cn","Skeleton","jsxs","Fragment","controlSizeClasses","controlStateColorTransition","quietTextHover","Icon","SlashIcon"],"mappings":";;;;;;;;;;;;;AAiBO,MAAM,aAAa,CAAC,EAAE,UAAU,KAAA,EAAO,SAAA,EAAW,eAAc,KAAuB;AAC5F,EAAA,uBACEA,cAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAY,KAAA,EAAO,SAAA,EACtB,QAAA,kBAAAA,cAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAWC,WAAA,CAAG,2BAAA,EAA6B,aAAa,CAAA,EAAI,UAAS,CAAA,EAC3E,CAAA;AAEJ;AAqBO,MAAM,aAAA,GAAgB,CAAC,KAAA,qBAAsCD,cAAA,CAACE,qBAAS,SAAA,EAAU,UAAA,EAAY,GAAG,KAAA,EAAO;AAEvG,MAAM,KAAA,GAAQ,CAAC,EAAE,SAAA,EAAW,EAAA,EAAI,SAAA,EAAW,MAAA,EAAQ,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,EAAM,KAAkB;AAC9G,EAAA,MAAM,OAAO,EAAA,IAAM,MAAA;AAEnB,EAAA,uBACEC,eAAA,CAAAC,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAAD,eAAA,CAAC,QAAG,SAAA,EAAWF,WAAA,CAAG,gDAAgD,SAAA,GAAY,QAAA,GAAW,UAAU,CAAA,EACjG,QAAA,EAAA;AAAA,sBAAAE,eAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,cAAA,EAAc,YAAY,MAAA,GAAS,MAAA;AAAA,UACnC,SAAA,EAAWF,WAAA;AAAA;AAAA;AAAA,YAGT,+EAAA;AAAA,YACAI,yCAAA,CAAmB,EAAA;AAAA,YACnBC,kDAAA;AAAA;AAAA,YAEA,SAAA,GACI,yCAAA,GACAL,WAAA,CAAGM,oCAAA,EAAgB,6DAA6D,CAAA;AAAA,YACpF;AAAA,WACF;AAAA,UACC,GAAG,KAAA;AAAA,UAEH,QAAA,EAAA;AAAA,YAAA,IAAA,oBACCP,cAAA;AAAA,cAACQ,eAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAWP,WAAA;AAAA,kBACT,wDAAA;AAAA,kBACA;AAAA,iBACF;AAAA,gBAEC,QAAA,EAAA;AAAA;AAAA,aACH;AAAA,YAED,SAAA,kCACE,aAAA,EAAA,EAAc,CAAA;AAAA;AAAA;AAAA;AAAA,8BAKfD,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAA,EAA2B,QAAA,EAAS;AAAA;AAAA;AAAA;AAAA,OAExD;AAAA,MACC,MAAA,oBAAUA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iDAAiD,QAAA,EAAA,MAAA,EAAO;AAAA,KAAA,EACrF,CAAA;AAAA,IACC,CAAC,SAAA,oBACAA,cAAA,CAAC,IAAA,EAAA,EAAG,MAAK,WAAA,EAAY,SAAA,EAAU,0BAAA,EAC7B,QAAA,kBAAAA,cAAA,CAACQ,mBAAK,SAAA,EAAU,kBAAA,EACd,QAAA,kBAAAR,cAAA,CAACS,yBAAA,EAAA,EAAU,GACb,CAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;;;"}
+{"version":3,"file":"Breadcrumb.cjs.js","sources":["../../src/ds/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { SlashIcon } from '../../icons/SlashIcon';\nimport { Skeleton } from '@/ds/components/Skeleton';\nimport { controlSizeClasses } from '@/ds/primitives/control-size';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nexport interface BreadcrumbProps {\n  children?: React.ReactNode;\n  label?: string;\n  className?: string;\n  listClassName?: string;\n}\n\nexport const Breadcrumb = ({ children, label, className, listClassName }: BreadcrumbProps) => {\n  return (\n    <nav aria-label={label} className={className}>\n      <ol className={cn('flex items-center gap-0.5', listClassName)}>{children}</ol>\n    </nav>\n  );\n};\n\nexport interface CrumbProps {\n  isCurrent?: boolean;\n  as: React.ElementType;\n  className?: string;\n  to?: string;\n  prefetch?: boolean | null;\n  children?: React.ReactNode;\n  /** Prefix icon (bare SVG). The crumb wraps it in `<Icon>` and aligns it like a Button adornment. */\n  icon?: React.ReactNode;\n  /** Renders `CrumbSkeleton` in place of the label. */\n  isLoading?: boolean;\n  /**\n   * Sibling control rendered next to the label (never inside it). Expected to be a\n   * `size=\"icon-sm\"` ghost control: an icon-only Combobox switcher, a CopyButton, …\n   */\n  action?: React.ReactNode;\n  'data-testid'?: string;\n}\n\nexport const CrumbSkeleton = (props: { 'data-testid'?: string }) => <Skeleton className=\"h-3 w-24\" {...props} />;\n\nexport const Crumb = ({ className, as, isCurrent, action, icon, isLoading, children, ...props }: CrumbProps) => {\n  const Root = as || 'span';\n\n  return (\n    <>\n      <li className={cn('group flex h-control-sm min-w-0 items-center', isCurrent ? 'shrink' : 'shrink-0')}>\n        <Root\n          aria-current={isCurrent ? 'page' : undefined}\n          className={cn(\n            // Same box as `buttonVariants({ variant: 'ghost', size: 'sm' })` so a label and an\n            // icon-sm control sitting next to it share height, radius, padding and colors.\n            'inline-flex min-w-0 items-center gap-2 overflow-hidden rounded-full px-[.9em]',\n            controlSizeClasses.sm,\n            controlStateColorTransition,\n            // Long labels truncate: the current crumb gets more room than nav crumbs.\n            isCurrent\n              ? 'max-w-xs cursor-default text-foreground'\n              : cn(quietTextHover, 'max-w-48 cursor-pointer hover:bg-fill-subtle active:bg-fill'),\n            className,\n          )}\n          {...props}\n        >\n          {icon && (\n            <Icon\n              className={cn(\n                '-ml-[.3em] shrink-0 opacity-50 group-hover:opacity-100',\n                'transition-opacity duration-normal ease-out-custom',\n              )}\n            >\n              {icon}\n            </Icon>\n          )}\n          {isLoading ? (\n            <CrumbSkeleton />\n          ) : (\n            // `text-overflow` needs a block container, so the label truncates in its\n            // own box rather than on the flex Root. Works for plain strings and for\n            // components that resolve to a string (route-header `Component` crumbs).\n            <span className=\"min-w-0 flex-1 truncate\">{children}</span>\n          )}\n        </Root>\n        {action && <span className=\"-ml-1 flex h-control-sm shrink-0 items-center\">{action}</span>}\n      </li>\n      {!isCurrent && (\n        <li role=\"separator\" className=\"flex h-full items-center\">\n          <Icon className=\"text-placeholder\">\n            <SlashIcon />\n          </Icon>\n        </li>\n      )}\n    </>\n  );\n};\n"],"names":["jsx","cn","Skeleton","jsxs","Fragment","controlSizeClasses","controlStateColorTransition","quietTextHover","Icon","SlashIcon"],"mappings":";;;;;;;;;;;;;AAiBO,MAAM,aAAa,CAAC,EAAE,UAAU,KAAA,EAAO,SAAA,EAAW,eAAc,KAAuB;AAC5F,EAAA,uBACEA,cAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAY,KAAA,EAAO,SAAA,EACtB,QAAA,kBAAAA,cAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAWC,WAAA,CAAG,2BAAA,EAA6B,aAAa,CAAA,EAAI,UAAS,CAAA,EAC3E,CAAA;AAEJ;AAqBO,MAAM,aAAA,GAAgB,CAAC,KAAA,qBAAsCD,cAAA,CAACE,qBAAS,SAAA,EAAU,UAAA,EAAY,GAAG,KAAA,EAAO;AAEvG,MAAM,KAAA,GAAQ,CAAC,EAAE,SAAA,EAAW,EAAA,EAAI,SAAA,EAAW,MAAA,EAAQ,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,EAAM,KAAkB;AAC9G,EAAA,MAAM,OAAO,EAAA,IAAM,MAAA;AAEnB,EAAA,uBACEC,eAAA,CAAAC,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAAD,eAAA,CAAC,QAAG,SAAA,EAAWF,WAAA,CAAG,gDAAgD,SAAA,GAAY,QAAA,GAAW,UAAU,CAAA,EACjG,QAAA,EAAA;AAAA,sBAAAE,eAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,cAAA,EAAc,YAAY,MAAA,GAAS,MAAA;AAAA,UACnC,SAAA,EAAWF,WAAA;AAAA;AAAA;AAAA,YAGT,+EAAA;AAAA,YACAI,yCAAA,CAAmB,EAAA;AAAA,YACnBC,kDAAA;AAAA;AAAA,YAEA,SAAA,GACI,yCAAA,GACAL,WAAA,CAAGM,oCAAA,EAAgB,6DAA6D,CAAA;AAAA,YACpF;AAAA,WACF;AAAA,UACC,GAAG,KAAA;AAAA,UAEH,QAAA,EAAA;AAAA,YAAA,IAAA,oBACCP,cAAA;AAAA,cAACQ,eAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAWP,WAAA;AAAA,kBACT,wDAAA;AAAA,kBACA;AAAA,iBACF;AAAA,gBAEC,QAAA,EAAA;AAAA;AAAA,aACH;AAAA,YAED,SAAA,kCACE,aAAA,EAAA,EAAc,CAAA;AAAA;AAAA;AAAA;AAAA,8BAKfD,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAA,EAA2B,QAAA,EAAS;AAAA;AAAA;AAAA;AAAA,OAExD;AAAA,MACC,MAAA,oBAAUA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iDAAiD,QAAA,EAAA,MAAA,EAAO;AAAA,KAAA,EACrF,CAAA;AAAA,IACC,CAAC,SAAA,oBACAA,cAAA,CAAC,IAAA,EAAA,EAAG,MAAK,WAAA,EAAY,SAAA,EAAU,0BAAA,EAC7B,QAAA,kBAAAA,cAAA,CAACQ,mBAAK,SAAA,EAAU,kBAAA,EACd,QAAA,kBAAAR,cAAA,CAACS,yBAAA,EAAA,EAAU,GACb,CAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;;;"}

package/dist/components/Breadcrumb.es.js

@@ -50,7 +50,7 @@ const Crumb = ({ className, as, isCurrent, action, icon, isLoading, children, ..
           ]
         }
       ),
-      action && /* @__PURE__ */ jsx("span", { className: "h-control-sm -ml-1 flex shrink-0 items-center", children: action })
+      action && /* @__PURE__ */ jsx("span", { className: "-ml-1 flex h-control-sm shrink-0 items-center", children: action })
     ] }),
     !isCurrent && /* @__PURE__ */ jsx("li", { role: "separator", className: "flex h-full items-center", children: /* @__PURE__ */ jsx(Icon, { className: "text-placeholder", children: /* @__PURE__ */ jsx(SlashIcon, {}) }) })
   ] });

package/dist/components/Breadcrumb.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.es.js","sources":["../../src/ds/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { SlashIcon } from '../../icons/SlashIcon';\nimport { Skeleton } from '@/ds/components/Skeleton';\nimport { controlSizeClasses } from '@/ds/primitives/control-size';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nexport interface BreadcrumbProps {\n  children?: React.ReactNode;\n  label?: string;\n  className?: string;\n  listClassName?: string;\n}\n\nexport const Breadcrumb = ({ children, label, className, listClassName }: BreadcrumbProps) => {\n  return (\n    <nav aria-label={label} className={className}>\n      <ol className={cn('flex items-center gap-0.5', listClassName)}>{children}</ol>\n    </nav>\n  );\n};\n\nexport interface CrumbProps {\n  isCurrent?: boolean;\n  as: React.ElementType;\n  className?: string;\n  to?: string;\n  prefetch?: boolean | null;\n  children?: React.ReactNode;\n  /** Prefix icon (bare SVG). The crumb wraps it in `<Icon>` and aligns it like a Button adornment. */\n  icon?: React.ReactNode;\n  /** Renders `CrumbSkeleton` in place of the label. */\n  isLoading?: boolean;\n  /**\n   * Sibling control rendered next to the label (never inside it). Expected to be a\n   * `size=\"icon-sm\"` ghost control: an icon-only Combobox switcher, a CopyButton, …\n   */\n  action?: React.ReactNode;\n  'data-testid'?: string;\n}\n\nexport const CrumbSkeleton = (props: { 'data-testid'?: string }) => <Skeleton className=\"h-3 w-24\" {...props} />;\n\nexport const Crumb = ({ className, as, isCurrent, action, icon, isLoading, children, ...props }: CrumbProps) => {\n  const Root = as || 'span';\n\n  return (\n    <>\n      <li className={cn('group flex h-control-sm min-w-0 items-center', isCurrent ? 'shrink' : 'shrink-0')}>\n        <Root\n          aria-current={isCurrent ? 'page' : undefined}\n          className={cn(\n            // Same box as `buttonVariants({ variant: 'ghost', size: 'sm' })` so a label and an\n            // icon-sm control sitting next to it share height, radius, padding and colors.\n            'inline-flex min-w-0 items-center gap-2 overflow-hidden rounded-full px-[.9em]',\n            controlSizeClasses.sm,\n            controlStateColorTransition,\n            // Long labels truncate: the current crumb gets more room than nav crumbs.\n            isCurrent\n              ? 'max-w-xs cursor-default text-foreground'\n              : cn(quietTextHover, 'max-w-48 cursor-pointer hover:bg-fill-subtle active:bg-fill'),\n            className,\n          )}\n          {...props}\n        >\n          {icon && (\n            <Icon\n              className={cn(\n                '-ml-[.3em] shrink-0 opacity-50 group-hover:opacity-100',\n                'transition-opacity duration-normal ease-out-custom',\n              )}\n            >\n              {icon}\n            </Icon>\n          )}\n          {isLoading ? (\n            <CrumbSkeleton />\n          ) : (\n            // `text-overflow` needs a block container, so the label truncates in its\n            // own box rather than on the flex Root. Works for plain strings and for\n            // components that resolve to a string (route-header `Component` crumbs).\n            <span className=\"min-w-0 flex-1 truncate\">{children}</span>\n          )}\n        </Root>\n        {action && <span className=\"h-control-sm -ml-1 flex shrink-0 items-center\">{action}</span>}\n      </li>\n      {!isCurrent && (\n        <li role=\"separator\" className=\"flex h-full items-center\">\n          <Icon className=\"text-placeholder\">\n            <SlashIcon />\n          </Icon>\n        </li>\n      )}\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAiBO,MAAM,aAAa,CAAC,EAAE,UAAU,KAAA,EAAO,SAAA,EAAW,eAAc,KAAuB;AAC5F,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAY,KAAA,EAAO,SAAA,EACtB,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAW,EAAA,CAAG,2BAAA,EAA6B,aAAa,CAAA,EAAI,UAAS,CAAA,EAC3E,CAAA;AAEJ;AAqBO,MAAM,aAAA,GAAgB,CAAC,KAAA,qBAAsC,GAAA,CAAC,YAAS,SAAA,EAAU,UAAA,EAAY,GAAG,KAAA,EAAO;AAEvG,MAAM,KAAA,GAAQ,CAAC,EAAE,SAAA,EAAW,EAAA,EAAI,SAAA,EAAW,MAAA,EAAQ,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,EAAM,KAAkB;AAC9G,EAAA,MAAM,OAAO,EAAA,IAAM,MAAA;AAEnB,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,QAAG,SAAA,EAAW,EAAA,CAAG,gDAAgD,SAAA,GAAY,QAAA,GAAW,UAAU,CAAA,EACjG,QAAA,EAAA;AAAA,sBAAA,IAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,cAAA,EAAc,YAAY,MAAA,GAAS,MAAA;AAAA,UACnC,SAAA,EAAW,EAAA;AAAA;AAAA;AAAA,YAGT,+EAAA;AAAA,YACA,kBAAA,CAAmB,EAAA;AAAA,YACnB,2BAAA;AAAA;AAAA,YAEA,SAAA,GACI,yCAAA,GACA,EAAA,CAAG,cAAA,EAAgB,6DAA6D,CAAA;AAAA,YACpF;AAAA,WACF;AAAA,UACC,GAAG,KAAA;AAAA,UAEH,QAAA,EAAA;AAAA,YAAA,IAAA,oBACC,GAAA;AAAA,cAAC,IAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAW,EAAA;AAAA,kBACT,wDAAA;AAAA,kBACA;AAAA,iBACF;AAAA,gBAEC,QAAA,EAAA;AAAA;AAAA,aACH;AAAA,YAED,SAAA,uBACE,aAAA,EAAA,EAAc,CAAA;AAAA;AAAA;AAAA;AAAA,8BAKf,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAA,EAA2B,QAAA,EAAS;AAAA;AAAA;AAAA;AAAA,OAExD;AAAA,MACC,MAAA,oBAAU,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iDAAiD,QAAA,EAAA,MAAA,EAAO;AAAA,KAAA,EACrF,CAAA;AAAA,IACC,CAAC,SAAA,oBACA,GAAA,CAAC,IAAA,EAAA,EAAG,MAAK,WAAA,EAAY,SAAA,EAAU,0BAAA,EAC7B,QAAA,kBAAA,GAAA,CAAC,QAAK,SAAA,EAAU,kBAAA,EACd,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,GACb,CAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Breadcrumb.es.js","sources":["../../src/ds/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { SlashIcon } from '../../icons/SlashIcon';\nimport { Skeleton } from '@/ds/components/Skeleton';\nimport { controlSizeClasses } from '@/ds/primitives/control-size';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nexport interface BreadcrumbProps {\n  children?: React.ReactNode;\n  label?: string;\n  className?: string;\n  listClassName?: string;\n}\n\nexport const Breadcrumb = ({ children, label, className, listClassName }: BreadcrumbProps) => {\n  return (\n    <nav aria-label={label} className={className}>\n      <ol className={cn('flex items-center gap-0.5', listClassName)}>{children}</ol>\n    </nav>\n  );\n};\n\nexport interface CrumbProps {\n  isCurrent?: boolean;\n  as: React.ElementType;\n  className?: string;\n  to?: string;\n  prefetch?: boolean | null;\n  children?: React.ReactNode;\n  /** Prefix icon (bare SVG). The crumb wraps it in `<Icon>` and aligns it like a Button adornment. */\n  icon?: React.ReactNode;\n  /** Renders `CrumbSkeleton` in place of the label. */\n  isLoading?: boolean;\n  /**\n   * Sibling control rendered next to the label (never inside it). Expected to be a\n   * `size=\"icon-sm\"` ghost control: an icon-only Combobox switcher, a CopyButton, …\n   */\n  action?: React.ReactNode;\n  'data-testid'?: string;\n}\n\nexport const CrumbSkeleton = (props: { 'data-testid'?: string }) => <Skeleton className=\"h-3 w-24\" {...props} />;\n\nexport const Crumb = ({ className, as, isCurrent, action, icon, isLoading, children, ...props }: CrumbProps) => {\n  const Root = as || 'span';\n\n  return (\n    <>\n      <li className={cn('group flex h-control-sm min-w-0 items-center', isCurrent ? 'shrink' : 'shrink-0')}>\n        <Root\n          aria-current={isCurrent ? 'page' : undefined}\n          className={cn(\n            // Same box as `buttonVariants({ variant: 'ghost', size: 'sm' })` so a label and an\n            // icon-sm control sitting next to it share height, radius, padding and colors.\n            'inline-flex min-w-0 items-center gap-2 overflow-hidden rounded-full px-[.9em]',\n            controlSizeClasses.sm,\n            controlStateColorTransition,\n            // Long labels truncate: the current crumb gets more room than nav crumbs.\n            isCurrent\n              ? 'max-w-xs cursor-default text-foreground'\n              : cn(quietTextHover, 'max-w-48 cursor-pointer hover:bg-fill-subtle active:bg-fill'),\n            className,\n          )}\n          {...props}\n        >\n          {icon && (\n            <Icon\n              className={cn(\n                '-ml-[.3em] shrink-0 opacity-50 group-hover:opacity-100',\n                'transition-opacity duration-normal ease-out-custom',\n              )}\n            >\n              {icon}\n            </Icon>\n          )}\n          {isLoading ? (\n            <CrumbSkeleton />\n          ) : (\n            // `text-overflow` needs a block container, so the label truncates in its\n            // own box rather than on the flex Root. Works for plain strings and for\n            // components that resolve to a string (route-header `Component` crumbs).\n            <span className=\"min-w-0 flex-1 truncate\">{children}</span>\n          )}\n        </Root>\n        {action && <span className=\"-ml-1 flex h-control-sm shrink-0 items-center\">{action}</span>}\n      </li>\n      {!isCurrent && (\n        <li role=\"separator\" className=\"flex h-full items-center\">\n          <Icon className=\"text-placeholder\">\n            <SlashIcon />\n          </Icon>\n        </li>\n      )}\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAiBO,MAAM,aAAa,CAAC,EAAE,UAAU,KAAA,EAAO,SAAA,EAAW,eAAc,KAAuB;AAC5F,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAY,KAAA,EAAO,SAAA,EACtB,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAW,EAAA,CAAG,2BAAA,EAA6B,aAAa,CAAA,EAAI,UAAS,CAAA,EAC3E,CAAA;AAEJ;AAqBO,MAAM,aAAA,GAAgB,CAAC,KAAA,qBAAsC,GAAA,CAAC,YAAS,SAAA,EAAU,UAAA,EAAY,GAAG,KAAA,EAAO;AAEvG,MAAM,KAAA,GAAQ,CAAC,EAAE,SAAA,EAAW,EAAA,EAAI,SAAA,EAAW,MAAA,EAAQ,IAAA,EAAM,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,EAAM,KAAkB;AAC9G,EAAA,MAAM,OAAO,EAAA,IAAM,MAAA;AAEnB,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,QAAG,SAAA,EAAW,EAAA,CAAG,gDAAgD,SAAA,GAAY,QAAA,GAAW,UAAU,CAAA,EACjG,QAAA,EAAA;AAAA,sBAAA,IAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,cAAA,EAAc,YAAY,MAAA,GAAS,MAAA;AAAA,UACnC,SAAA,EAAW,EAAA;AAAA;AAAA;AAAA,YAGT,+EAAA;AAAA,YACA,kBAAA,CAAmB,EAAA;AAAA,YACnB,2BAAA;AAAA;AAAA,YAEA,SAAA,GACI,yCAAA,GACA,EAAA,CAAG,cAAA,EAAgB,6DAA6D,CAAA;AAAA,YACpF;AAAA,WACF;AAAA,UACC,GAAG,KAAA;AAAA,UAEH,QAAA,EAAA;AAAA,YAAA,IAAA,oBACC,GAAA;AAAA,cAAC,IAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAW,EAAA;AAAA,kBACT,wDAAA;AAAA,kBACA;AAAA,iBACF;AAAA,gBAEC,QAAA,EAAA;AAAA;AAAA,aACH;AAAA,YAED,SAAA,uBACE,aAAA,EAAA,EAAc,CAAA;AAAA;AAAA;AAAA;AAAA,8BAKf,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAA,EAA2B,QAAA,EAAS;AAAA;AAAA;AAAA;AAAA,OAExD;AAAA,MACC,MAAA,oBAAU,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iDAAiD,QAAA,EAAA,MAAA,EAAO;AAAA,KAAA,EACrF,CAAA;AAAA,IACC,CAAC,SAAA,oBACA,GAAA,CAAC,IAAA,EAAA,EAAG,MAAK,WAAA,EAAY,SAAA,EAAU,0BAAA,EAC7B,QAAA,kBAAA,GAAA,CAAC,QAAK,SAAA,EAAU,kBAAA,EACd,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,GACb,CAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;"}

package/dist/components/Button.cjs.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const Button = require('../Button-CVewl8nT.cjs');
+const Button = require('../Button-C0DBEBcJ.cjs');
 const jsxRuntime = require('react/jsx-runtime');
 const lucideReact = require('lucide-react');
 const React = require('react');
-const kbd = require('../kbd-B-Z2sNvK.cjs');
+const kbd = require('../kbd-BptPsKP6.cjs');
 const keyboard_useKeydown = require('../keyboard/use-keydown.cjs.js');
 require('../keyboard/keyboard-shortcuts-context.cjs.js');
 

package/dist/components/Button.es.js

@@ -1,9 +1,9 @@
-import { B as Button } from '../Button-cWcBEd-G.js';
-export { b as buttonVariants, i as isIconButtonSize } from '../Button-cWcBEd-G.js';
+import { B as Button } from '../Button-C9cvaVFG.js';
+export { b as buttonVariants, i as isIconButtonSize } from '../Button-C9cvaVFG.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Plus } from 'lucide-react';
 import React__default, { useRef } from 'react';
-import { K as Kbd } from '../kbd-CINtikLh.js';
+import { K as Kbd } from '../kbd-BDVTQHD_.js';
 import { useKeydown } from '../keyboard/use-keydown.es.js';
 import '../keyboard/keyboard-shortcuts-context.es.js';
 

package/dist/components/ButtonsGroup.cjs.js

@@ -2,11 +2,10 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const buttonsGroup = require('../buttons-group-BiLEV_Ak.cjs');
+const buttonsGroup = require('../buttons-group-CoZP3lJt.cjs');
 
 
 
 exports.ButtonsGroup = buttonsGroup.ButtonsGroup;
-exports.ButtonsGroupSeparator = buttonsGroup.ButtonsGroupSeparator;
 exports.ButtonsGroupText = buttonsGroup.ButtonsGroupText;
 //# sourceMappingURL=ButtonsGroup.cjs.js.map

package/dist/components/ButtonsGroup.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonsGroup.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"ButtonsGroup.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/components/ButtonsGroup.es.js

@@ -1,2 +1,2 @@
-export { B as ButtonsGroup, a as ButtonsGroupSeparator, b as ButtonsGroupText } from '../buttons-group-CaA7KAWf.js';
+export { B as ButtonsGroup, a as ButtonsGroupText } from '../buttons-group-DsZgrZBZ.js';
 //# sourceMappingURL=ButtonsGroup.es.js.map

package/dist/components/Card.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const Card = require('../Card-D0kFp9j9.cjs');
+const Card = require('../Card-DwGasv0K.cjs');
 
 
 

package/dist/components/Card.es.js

@@ -1,2 +1,2 @@
-export { C as Card, a as CardContent, b as CardDescription, c as CardFooter, d as CardHeader, e as CardLink, f as CardTitle } from '../Card-DEvGFj-Z.js';
+export { C as Card, a as CardContent, b as CardDescription, c as CardFooter, d as CardHeader, e as CardLink, f as CardTitle } from '../Card-B_buJ5yF.js';
 //# sourceMappingURL=Card.es.js.map

package/dist/components/ClampedText.cjs.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
 const React = require('react');
-const Button = require('../Button-CVewl8nT.cjs');
+const Button = require('../Button-C0DBEBcJ.cjs');
 const Txt = require('../Txt-B4-2nLaI.cjs');
 const icons_ChevronIcon = require('../icons/ChevronIcon.cjs.js');
 const hooks_useIsClamped = require('../hooks/use-is-clamped.cjs.js');

package/dist/components/ClampedText.es.js

@@ -1,6 +1,6 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
-import { B as Button } from '../Button-cWcBEd-G.js';
+import { B as Button } from '../Button-C9cvaVFG.js';
 import { T as Txt } from '../Txt-DTh3Pa_a.js';
 import { ChevronIcon } from '../icons/ChevronIcon.es.js';
 import { useIsClamped } from '../hooks/use-is-clamped.es.js';

package/dist/components/CodeBlock.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const codeBlock = require('../code-block-Cd4u7Bo9.cjs');
+const codeBlock = require('../code-block-D2q4w1t-.cjs');
 
 
 

package/dist/components/CodeBlock.es.js

@@ -1,2 +1,2 @@
-export { C as CodeBlock } from '../code-block-CSqjpBvb.js';
+export { C as CodeBlock } from '../code-block-D3BWud_S.js';
 //# sourceMappingURL=CodeBlock.es.js.map

package/dist/components/CodeDiff.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const codeDiff = require('../code-diff-DBtbPe9D.cjs');
+const codeDiff = require('../code-diff-CG8veSa-.cjs');
 
 
 

package/dist/components/CodeDiff.es.js

@@ -1,2 +1,2 @@
-export { C as CodeDiff } from '../code-diff-C5uY-3Hz.js';
+export { C as CodeDiff } from '../code-diff-BHZTS4Zh.js';
 //# sourceMappingURL=CodeDiff.es.js.map

package/dist/components/CodeEditor.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const codeEditor = require('../code-editor-DgY7d8kg.cjs');
+const codeEditor = require('../code-editor-Ce1FXyFV.cjs');
 const highlight = require('../highlight-DK1dn-Fh.cjs');
 
 

package/dist/components/CodeEditor.es.js

@@ -1,3 +1,3 @@
-export { C as CodeEditor, V as VARIABLE_PATTERN, c as codeLanguages, a as createVariableAutocomplete, f as flattenSchemaToVariables, u as useCodemirrorTheme, v as variableHighlight } from '../code-editor-vCt7l9Bl.js';
+export { C as CodeEditor, V as VARIABLE_PATTERN, c as codeLanguages, a as createVariableAutocomplete, f as flattenSchemaToVariables, u as useCodemirrorTheme, v as variableHighlight } from '../code-editor-7wJJDE9d.js';
 export { h as highlight, l as languageForPath } from '../highlight-BmpoELR4.js';
 //# sourceMappingURL=CodeEditor.es.js.map

package/dist/components/Collapsible.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const collapsible = require('../collapsible-BvrI6XnN.cjs');
+const collapsible = require('../collapsible-BFSJouuI.cjs');
 
 
 

package/dist/components/Collapsible.es.js

@@ -1,2 +1,2 @@
-export { C as Collapsible, a as CollapsibleContent, b as CollapsibleTrigger } from '../collapsible-B2uUy8w5.js';
+export { C as Collapsible, a as CollapsibleContent, b as CollapsibleTrigger } from '../collapsible-DhhP5p1j.js';
 //# sourceMappingURL=Collapsible.es.js.map

package/dist/components/Columns.cjs.js

@@ -6,7 +6,7 @@ const jsxRuntime = require('react/jsx-runtime');
 const utils_cn = require('../cn-DG0X1KEP.cjs');
 const lucideReact = require('lucide-react');
 const React = require('react');
-const Button = require('../Button-CVewl8nT.cjs');
+const Button = require('../Button-C0DBEBcJ.cjs');
 
 function ColumnContent({ children, className }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn(`grid content-start gap-4 overflow-y-auto`, className), children });

package/dist/components/Columns.es.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { c as cn } from '../cn-65Adrsfj.js';
 import { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';
 import { useRef, useState, useCallback, useEffect } from 'react';
-import { B as Button } from '../Button-cWcBEd-G.js';
+import { B as Button } from '../Button-C9cvaVFG.js';
 
 function ColumnContent({ children, className }) {
   return /* @__PURE__ */ jsx("div", { className: cn(`grid content-start gap-4 overflow-y-auto`, className), children });

package/dist/components/Combobox.cjs.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const combobox = require('../combobox-BWM3VH-n.cjs');
-const comboboxStyles = require('../combobox-styles-DYlNNjKC.cjs');
+const combobox = require('../combobox-Dw3W6EHS.cjs');
+const comboboxStyles = require('../combobox-styles-ExU7SMb7.cjs');
 const combobox$1 = require('@base-ui/react/combobox');
 
 

package/dist/components/Combobox.es.js

@@ -1,4 +1,4 @@
-export { C as Combobox } from '../combobox-D7xJFZuO.js';
-export { c as comboboxStyles } from '../combobox-styles-CRebmeht.js';
+export { C as Combobox } from '../combobox-CV-Ue388.js';
+export { c as comboboxStyles } from '../combobox-styles-Dgc_Jp-E.js';
 export { Combobox as ComboboxPrimitive } from '@base-ui/react/combobox';
 //# sourceMappingURL=Combobox.es.js.map

package/dist/components/Command.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const command = require('../command-DuT06mTw.cjs');
+const command = require('../command-BJrGchxZ.cjs');
 
 
 

package/dist/components/Command.es.js

@@ -1,2 +1,2 @@
-export { C as Command, a as CommandDialog, b as CommandEmpty, c as CommandGroup, d as CommandInput, e as CommandItem, f as CommandList, g as CommandSeparator, h as CommandShortcut } from '../command-jRiL1vXM.js';
+export { C as Command, a as CommandDialog, b as CommandEmpty, c as CommandGroup, d as CommandInput, e as CommandItem, f as CommandList, g as CommandSeparator, h as CommandShortcut } from '../command-kHnYspgO.js';
 //# sourceMappingURL=Command.es.js.map

package/dist/components/CommandPalette.cjs.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 require('../CommandPalette.css');const jsxRuntime = require('react/jsx-runtime');
-const command = require('../command-DuT06mTw.cjs');
-const kbd = require('../kbd-B-Z2sNvK.cjs');
-const scrollArea = require('../scroll-area-Qjf7e0Ik.cjs');
+const command = require('../command-BJrGchxZ.cjs');
+const kbd = require('../kbd-BptPsKP6.cjs');
+const scrollArea = require('../scroll-area-BzOyuS8Y.cjs');
 const primitives_formElement = require('../primitives/form-element.cjs.js');
 const primitives_raisedSurface = require('../primitives/raised-surface.cjs.js');
 const primitives_transitions = require('../primitives/transitions.cjs.js');
@@ -99,9 +99,9 @@ function CommandPaletteScope({
       type: "button",
       className: utils_cn.cn(
         primitives_typography.quietTextHover,
-        "text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left",
+        "flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground",
         // eslint-disable-next-line tailwindcss/no-unnecessary-arbitrary-value -- v4 emits nothing for `scale-0.99`
-        "transition-[color,transform] duration-fast ease-out-custom motion-reduce:transition-none active:scale-[0.99]"
+        "transition-[color,transform] duration-fast ease-out-custom active:scale-[0.99] motion-reduce:transition-none"
       ),
       "data-active": active,
       "aria-pressed": active,
@@ -109,7 +109,7 @@ function CommandPaletteScope({
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-4 shrink-0 items-center justify-center [&>svg]:size-4", children: icon }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate", children: label }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-border bg-muted/70 text-meta text-muted-foreground rounded-md border px-1.5 py-0.5 leading-none", children: count })
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded-md border border-border bg-muted/70 px-1.5 py-0.5 text-meta leading-none text-muted-foreground", children: count })
       ]
     }
   );
@@ -164,7 +164,7 @@ function CommandPaletteItem({
           "span",
           {
             className: utils_cn.cn(
-              "text-muted-foreground group-data-[selected=true]:text-foreground mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center [&>svg]:!size-4 [&>svg]:shrink-0",
+              "mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center text-muted-foreground group-data-[selected=true]:text-foreground [&>svg]:!size-4 [&>svg]:shrink-0",
               primitives_transitions.controlStateColorTransition
             ),
             children: icon
@@ -172,12 +172,12 @@ function CommandPaletteItem({
         ),
         /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
           /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-label text-foreground truncate", children: title }),
-            badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-border bg-muted/60 text-meta text-muted-foreground shrink-0 rounded-md border px-1.5 py-0.5 leading-none uppercase", children: badge })
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-label text-foreground", children: title }),
+            badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 rounded-md border border-border bg-muted/60 px-1.5 py-0.5 text-meta leading-none text-muted-foreground uppercase", children: badge })
           ] }),
-          (subtitle || path) && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-meta text-muted-foreground flex min-w-0 items-center gap-2", children: [
+          (subtitle || path) && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 items-center gap-2 text-meta text-muted-foreground", children: [
             subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: subtitle }),
-            path && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-border bg-muted/70 text-meta text-muted-foreground max-w-52 truncate rounded-md border px-1.5 py-0.5 font-mono leading-none", children: path })
+            path && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-52 truncate rounded-md border border-border bg-muted/70 px-1.5 py-0.5 font-mono text-meta leading-none text-muted-foreground", children: path })
           ] })
         ] }),
         shortcut && /* @__PURE__ */ jsxRuntime.jsx(command.CommandShortcut, { children: shortcut })
@@ -186,7 +186,7 @@ function CommandPaletteItem({
   );
 }
 function CommandPaletteFooter({ label }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "command-palette-footer text-meta text-muted-foreground pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "command-palette-footer pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2 text-meta text-muted-foreground", children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: label }),
     /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex shrink-0 items-center gap-1.5", children: [
       /* @__PURE__ */ jsxRuntime.jsx(kbd.Kbd, { size: "sm", children: "↑" }),

package/dist/components/CommandPalette.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandPalette.cjs.js","sources":["../../src/ds/components/CommandPalette/command-palette.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, HTMLAttributes, ReactNode } from 'react';\n\nimport { CommandDialog, CommandInput, CommandItem, CommandList, CommandShortcut } from '@/ds/components/Command';\nimport { Kbd } from '@/ds/components/Kbd';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nimport './command-palette.css';\n\ntype CommandPaletteDialogProps = ComponentPropsWithoutRef<typeof CommandDialog>;\n\nfunction CommandPaletteDialog({\n  children,\n  contentClassName,\n  commandClassName,\n  showOverlay = true,\n  overlayClassName,\n  ...props\n}: CommandPaletteDialogProps) {\n  return (\n    <CommandDialog\n      showOverlay={showOverlay}\n      overlayClassName={cn('bg-sidebar/40 backdrop-blur-none', overlayClassName)}\n      contentClassName={cn(\n        'command-palette-popup max-w-[min(56rem,calc(100vw-2rem))] overflow-visible border-none bg-transparent p-0 shadow-none backdrop-blur-none sm:max-w-[min(56rem,calc(100vw-2rem))]',\n        contentClassName,\n      )}\n      commandClassName={cn(\n        // Height lives in `.command-palette-shell` — see command-palette.css.\n        'command-palette-shell gap-2 overflow-visible rounded-none bg-transparent text-muted-foreground shadow-none backdrop-blur-none',\n        '[&_[data-slot=command-input-wrapper]_svg]:text-muted-foreground',\n        '**:[[cmdk-input]]:h-full **:[[cmdk-input]]:text-body',\n        '**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-2 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group]]:p-0',\n        '**:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-1.5',\n        commandClassName,\n      )}\n      {...props}\n    >\n      {children}\n    </CommandDialog>\n  );\n}\n\ntype CommandPaletteInputProps = ComponentPropsWithoutRef<typeof CommandInput>;\n\nfunction CommandPaletteInput({ wrapperClassName, ...props }: CommandPaletteInputProps) {\n  return (\n    <CommandInput\n      wrapperClassName={cn(\n        'command-palette-surface command-palette-surface-input',\n        inputSurfaceAndFocusWithinStyle,\n        // `border-0` because `CommandInput`'s own `border-b` is the separator of a single-panel\n        // Command; here the input is a detached pill and the material already carries its rim.\n        'h-11 shrink-0 rounded-xl border-0 px-3 pr-11',\n        wrapperClassName,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction CommandPaletteBody({ children, className, ...props }: HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div className=\"min-h-0 flex-1\">\n      <div\n        className={cn(\n          'grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-2 md:grid-cols-[13rem_minmax(0,1fr)] md:grid-rows-none',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n\ntype CommandPaletteRailProps = ComponentPropsWithoutRef<'aside'> & {\n  'aria-label': string;\n};\n\nfunction CommandPaletteRail({ children, className, ...props }: CommandPaletteRailProps) {\n  return (\n    <aside\n      className={cn(\n        'command-palette-surface command-palette-surface-rail flex max-h-[min(14rem,32dvh)] min-h-0 flex-col overflow-hidden rounded-xl p-2 md:h-full md:max-h-none',\n        overlaySurfaceStyle,\n        className,\n      )}\n      {...props}\n    >\n      <ScrollArea className=\"-m-1 min-h-0 flex-1 p-1\" viewPortClassName=\"pr-1\">\n        <div className=\"flex flex-col gap-1\">{children}</div>\n      </ScrollArea>\n    </aside>\n  );\n}\n\nfunction CommandPaletteScope({\n  icon,\n  label,\n  count,\n  active,\n  onSelect,\n}: {\n  icon: ReactNode;\n  label: string;\n  count: number;\n  active: boolean;\n  onSelect: () => void;\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        quietTextHover,\n        'text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left',\n        // eslint-disable-next-line tailwindcss/no-unnecessary-arbitrary-value -- v4 emits nothing for `scale-0.99`\n        'transition-[color,transform] duration-fast ease-out-custom motion-reduce:transition-none active:scale-[0.99]',\n      )}\n      data-active={active}\n      aria-pressed={active}\n      onClick={onSelect}\n    >\n      <span className=\"flex size-4 shrink-0 items-center justify-center [&>svg]:size-4\">{icon}</span>\n      <span className=\"min-w-0 flex-1 truncate\">{label}</span>\n      <span className=\"border-border bg-muted/70 text-meta text-muted-foreground rounded-md border px-1.5 py-0.5 leading-none\">\n        {count}\n      </span>\n    </button>\n  );\n}\n\ntype CommandPaletteResultsProps = {\n  'aria-label': string;\n  children: ReactNode;\n  footer?: ReactNode;\n};\n\nfunction CommandPaletteResults({ children, footer, ...props }: CommandPaletteResultsProps) {\n  return (\n    <div\n      role=\"region\"\n      className={cn(\n        'command-palette-surface command-palette-surface-results command-palette-results-panel relative flex min-h-0 min-w-0 flex-col overflow-hidden rounded-xl',\n        overlaySurfaceStyle,\n      )}\n      {...props}\n    >\n      <CommandList\n        scrollArea\n        scrollAreaClassName=\"min-h-0 flex-1 rounded-none\"\n        scrollAreaViewportClassName=\"command-palette-scroll-viewport\"\n        className=\"command-palette-list max-h-none rounded-none border-none bg-transparent shadow-none\"\n        highlightClassName=\"rounded-lg\"\n      >\n        {children}\n      </CommandList>\n      {footer}\n    </div>\n  );\n}\n\ntype CommandPaletteItemProps = Omit<ComponentPropsWithoutRef<typeof CommandItem>, 'children'> & {\n  icon: ReactNode;\n  title: string;\n  subtitle?: string;\n  path?: string;\n  badge?: string;\n  shortcut?: ReactNode;\n};\n\nfunction CommandPaletteItem({\n  icon,\n  title,\n  subtitle,\n  path,\n  badge,\n  shortcut,\n  className,\n  ...props\n}: CommandPaletteItemProps) {\n  return (\n    <CommandItem\n      className={cn(\n        'group h-auto items-start gap-3 rounded-lg border border-transparent px-3 py-2.5 data-[selected=true]:border-border',\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className={cn(\n          'text-muted-foreground group-data-[selected=true]:text-foreground mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center [&>svg]:!size-4 [&>svg]:shrink-0',\n          controlStateColorTransition,\n        )}\n      >\n        {icon}\n      </span>\n      <span className=\"flex min-w-0 flex-1 flex-col gap-1\">\n        <span className=\"flex min-w-0 items-center gap-2\">\n          <span className=\"text-label text-foreground truncate\">{title}</span>\n          {badge && (\n            <span className=\"border-border bg-muted/60 text-meta text-muted-foreground shrink-0 rounded-md border px-1.5 py-0.5 leading-none uppercase\">\n              {badge}\n            </span>\n          )}\n        </span>\n        {(subtitle || path) && (\n          <span className=\"text-meta text-muted-foreground flex min-w-0 items-center gap-2\">\n            {subtitle && <span className=\"truncate\">{subtitle}</span>}\n            {path && (\n              <span className=\"border-border bg-muted/70 text-meta text-muted-foreground max-w-52 truncate rounded-md border px-1.5 py-0.5 font-mono leading-none\">\n                {path}\n              </span>\n            )}\n          </span>\n        )}\n      </span>\n      {shortcut && <CommandShortcut>{shortcut}</CommandShortcut>}\n    </CommandItem>\n  );\n}\n\nfunction CommandPaletteFooter({ label }: { label: string }) {\n  return (\n    <div className=\"command-palette-footer text-meta text-muted-foreground pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2\">\n      <span className=\"truncate\">{label}</span>\n      <span className=\"flex shrink-0 items-center gap-1.5\">\n        <Kbd size=\"sm\">↑</Kbd>\n        <Kbd size=\"sm\">↓</Kbd>\n        <Kbd size=\"sm\">↵</Kbd>\n        <Kbd size=\"sm\">Esc</Kbd>\n      </span>\n    </div>\n  );\n}\n\nexport {\n  CommandPaletteBody,\n  CommandPaletteDialog,\n  CommandPaletteFooter,\n  CommandPaletteInput,\n  CommandPaletteItem,\n  CommandPaletteRail,\n  CommandPaletteResults,\n  CommandPaletteScope,\n};\n"],"names":["jsx","CommandDialog","cn","CommandInput","inputSurfaceAndFocusWithinStyle","overlaySurfaceStyle","ScrollArea","jsxs","quietTextHover","CommandList","CommandItem","controlStateColorTransition","CommandShortcut","Kbd"],"mappings":"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"}
+{"version":3,"file":"CommandPalette.cjs.js","sources":["../../src/ds/components/CommandPalette/command-palette.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, HTMLAttributes, ReactNode } from 'react';\n\nimport { CommandDialog, CommandInput, CommandItem, CommandList, CommandShortcut } from '@/ds/components/Command';\nimport { Kbd } from '@/ds/components/Kbd';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nimport './command-palette.css';\n\ntype CommandPaletteDialogProps = ComponentPropsWithoutRef<typeof CommandDialog>;\n\nfunction CommandPaletteDialog({\n  children,\n  contentClassName,\n  commandClassName,\n  showOverlay = true,\n  overlayClassName,\n  ...props\n}: CommandPaletteDialogProps) {\n  return (\n    <CommandDialog\n      showOverlay={showOverlay}\n      overlayClassName={cn('bg-sidebar/40 backdrop-blur-none', overlayClassName)}\n      contentClassName={cn(\n        'command-palette-popup max-w-[min(56rem,calc(100vw-2rem))] overflow-visible border-none bg-transparent p-0 shadow-none backdrop-blur-none sm:max-w-[min(56rem,calc(100vw-2rem))]',\n        contentClassName,\n      )}\n      commandClassName={cn(\n        // Height lives in `.command-palette-shell` — see command-palette.css.\n        'command-palette-shell gap-2 overflow-visible rounded-none bg-transparent text-muted-foreground shadow-none backdrop-blur-none',\n        '[&_[data-slot=command-input-wrapper]_svg]:text-muted-foreground',\n        '**:[[cmdk-input]]:h-full **:[[cmdk-input]]:text-body',\n        '**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-2 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group]]:p-0',\n        '**:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-1.5',\n        commandClassName,\n      )}\n      {...props}\n    >\n      {children}\n    </CommandDialog>\n  );\n}\n\ntype CommandPaletteInputProps = ComponentPropsWithoutRef<typeof CommandInput>;\n\nfunction CommandPaletteInput({ wrapperClassName, ...props }: CommandPaletteInputProps) {\n  return (\n    <CommandInput\n      wrapperClassName={cn(\n        'command-palette-surface command-palette-surface-input',\n        inputSurfaceAndFocusWithinStyle,\n        // `border-0` because `CommandInput`'s own `border-b` is the separator of a single-panel\n        // Command; here the input is a detached pill and the material already carries its rim.\n        'h-11 shrink-0 rounded-xl border-0 px-3 pr-11',\n        wrapperClassName,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction CommandPaletteBody({ children, className, ...props }: HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div className=\"min-h-0 flex-1\">\n      <div\n        className={cn(\n          'grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-2 md:grid-cols-[13rem_minmax(0,1fr)] md:grid-rows-none',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n\ntype CommandPaletteRailProps = ComponentPropsWithoutRef<'aside'> & {\n  'aria-label': string;\n};\n\nfunction CommandPaletteRail({ children, className, ...props }: CommandPaletteRailProps) {\n  return (\n    <aside\n      className={cn(\n        'command-palette-surface command-palette-surface-rail flex max-h-[min(14rem,32dvh)] min-h-0 flex-col overflow-hidden rounded-xl p-2 md:h-full md:max-h-none',\n        overlaySurfaceStyle,\n        className,\n      )}\n      {...props}\n    >\n      <ScrollArea className=\"-m-1 min-h-0 flex-1 p-1\" viewPortClassName=\"pr-1\">\n        <div className=\"flex flex-col gap-1\">{children}</div>\n      </ScrollArea>\n    </aside>\n  );\n}\n\nfunction CommandPaletteScope({\n  icon,\n  label,\n  count,\n  active,\n  onSelect,\n}: {\n  icon: ReactNode;\n  label: string;\n  count: number;\n  active: boolean;\n  onSelect: () => void;\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        quietTextHover,\n        'flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground',\n        // eslint-disable-next-line tailwindcss/no-unnecessary-arbitrary-value -- v4 emits nothing for `scale-0.99`\n        'transition-[color,transform] duration-fast ease-out-custom active:scale-[0.99] motion-reduce:transition-none',\n      )}\n      data-active={active}\n      aria-pressed={active}\n      onClick={onSelect}\n    >\n      <span className=\"flex size-4 shrink-0 items-center justify-center [&>svg]:size-4\">{icon}</span>\n      <span className=\"min-w-0 flex-1 truncate\">{label}</span>\n      <span className=\"rounded-md border border-border bg-muted/70 px-1.5 py-0.5 text-meta leading-none text-muted-foreground\">\n        {count}\n      </span>\n    </button>\n  );\n}\n\ntype CommandPaletteResultsProps = {\n  'aria-label': string;\n  children: ReactNode;\n  footer?: ReactNode;\n};\n\nfunction CommandPaletteResults({ children, footer, ...props }: CommandPaletteResultsProps) {\n  return (\n    <div\n      role=\"region\"\n      className={cn(\n        'command-palette-surface command-palette-surface-results command-palette-results-panel relative flex min-h-0 min-w-0 flex-col overflow-hidden rounded-xl',\n        overlaySurfaceStyle,\n      )}\n      {...props}\n    >\n      <CommandList\n        scrollArea\n        scrollAreaClassName=\"min-h-0 flex-1 rounded-none\"\n        scrollAreaViewportClassName=\"command-palette-scroll-viewport\"\n        className=\"command-palette-list max-h-none rounded-none border-none bg-transparent shadow-none\"\n        highlightClassName=\"rounded-lg\"\n      >\n        {children}\n      </CommandList>\n      {footer}\n    </div>\n  );\n}\n\ntype CommandPaletteItemProps = Omit<ComponentPropsWithoutRef<typeof CommandItem>, 'children'> & {\n  icon: ReactNode;\n  title: string;\n  subtitle?: string;\n  path?: string;\n  badge?: string;\n  shortcut?: ReactNode;\n};\n\nfunction CommandPaletteItem({\n  icon,\n  title,\n  subtitle,\n  path,\n  badge,\n  shortcut,\n  className,\n  ...props\n}: CommandPaletteItemProps) {\n  return (\n    <CommandItem\n      className={cn(\n        'group h-auto items-start gap-3 rounded-lg border border-transparent px-3 py-2.5 data-[selected=true]:border-border',\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className={cn(\n          'mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center text-muted-foreground group-data-[selected=true]:text-foreground [&>svg]:!size-4 [&>svg]:shrink-0',\n          controlStateColorTransition,\n        )}\n      >\n        {icon}\n      </span>\n      <span className=\"flex min-w-0 flex-1 flex-col gap-1\">\n        <span className=\"flex min-w-0 items-center gap-2\">\n          <span className=\"truncate text-label text-foreground\">{title}</span>\n          {badge && (\n            <span className=\"shrink-0 rounded-md border border-border bg-muted/60 px-1.5 py-0.5 text-meta leading-none text-muted-foreground uppercase\">\n              {badge}\n            </span>\n          )}\n        </span>\n        {(subtitle || path) && (\n          <span className=\"flex min-w-0 items-center gap-2 text-meta text-muted-foreground\">\n            {subtitle && <span className=\"truncate\">{subtitle}</span>}\n            {path && (\n              <span className=\"max-w-52 truncate rounded-md border border-border bg-muted/70 px-1.5 py-0.5 font-mono text-meta leading-none text-muted-foreground\">\n                {path}\n              </span>\n            )}\n          </span>\n        )}\n      </span>\n      {shortcut && <CommandShortcut>{shortcut}</CommandShortcut>}\n    </CommandItem>\n  );\n}\n\nfunction CommandPaletteFooter({ label }: { label: string }) {\n  return (\n    <div className=\"command-palette-footer pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2 text-meta text-muted-foreground\">\n      <span className=\"truncate\">{label}</span>\n      <span className=\"flex shrink-0 items-center gap-1.5\">\n        <Kbd size=\"sm\">↑</Kbd>\n        <Kbd size=\"sm\">↓</Kbd>\n        <Kbd size=\"sm\">↵</Kbd>\n        <Kbd size=\"sm\">Esc</Kbd>\n      </span>\n    </div>\n  );\n}\n\nexport {\n  CommandPaletteBody,\n  CommandPaletteDialog,\n  CommandPaletteFooter,\n  CommandPaletteInput,\n  CommandPaletteItem,\n  CommandPaletteRail,\n  CommandPaletteResults,\n  CommandPaletteScope,\n};\n"],"names":["jsx","CommandDialog","cn","CommandInput","inputSurfaceAndFocusWithinStyle","overlaySurfaceStyle","ScrollArea","jsxs","quietTextHover","CommandList","CommandItem","controlStateColorTransition","CommandShortcut","Kbd"],"mappings":"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"}

package/dist/components/CommandPalette.es.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { a as CommandDialog, d as CommandInput, e as CommandItem, h as CommandShortcut, f as CommandList } from '../command-jRiL1vXM.js';
-import { K as Kbd } from '../kbd-CINtikLh.js';
-import { S as ScrollArea } from '../scroll-area-CdQ_5bLm.js';
+import { a as CommandDialog, d as CommandInput, e as CommandItem, h as CommandShortcut, f as CommandList } from '../command-kHnYspgO.js';
+import { K as Kbd } from '../kbd-BDVTQHD_.js';
+import { S as ScrollArea } from '../scroll-area-DyTZoISq.js';
 import { inputSurfaceAndFocusWithinStyle } from '../primitives/form-element.es.js';
 import { overlaySurfaceStyle } from '../primitives/raised-surface.es.js';
 import { controlStateColorTransition } from '../primitives/transitions.es.js';
@@ -95,9 +95,9 @@ function CommandPaletteScope({
       type: "button",
       className: cn(
         quietTextHover,
-        "text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left",
+        "flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground",
         // eslint-disable-next-line tailwindcss/no-unnecessary-arbitrary-value -- v4 emits nothing for `scale-0.99`
-        "transition-[color,transform] duration-fast ease-out-custom motion-reduce:transition-none active:scale-[0.99]"
+        "transition-[color,transform] duration-fast ease-out-custom active:scale-[0.99] motion-reduce:transition-none"
       ),
       "data-active": active,
       "aria-pressed": active,
@@ -105,7 +105,7 @@ function CommandPaletteScope({
       children: [
         /* @__PURE__ */ jsx("span", { className: "flex size-4 shrink-0 items-center justify-center [&>svg]:size-4", children: icon }),
         /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: label }),
-        /* @__PURE__ */ jsx("span", { className: "border-border bg-muted/70 text-meta text-muted-foreground rounded-md border px-1.5 py-0.5 leading-none", children: count })
+        /* @__PURE__ */ jsx("span", { className: "rounded-md border border-border bg-muted/70 px-1.5 py-0.5 text-meta leading-none text-muted-foreground", children: count })
       ]
     }
   );
@@ -160,7 +160,7 @@ function CommandPaletteItem({
           "span",
           {
             className: cn(
-              "text-muted-foreground group-data-[selected=true]:text-foreground mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center [&>svg]:!size-4 [&>svg]:shrink-0",
+              "mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center text-muted-foreground group-data-[selected=true]:text-foreground [&>svg]:!size-4 [&>svg]:shrink-0",
               controlStateColorTransition
             ),
             children: icon
@@ -168,12 +168,12 @@ function CommandPaletteItem({
         ),
         /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
           /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-label text-foreground truncate", children: title }),
-            badge && /* @__PURE__ */ jsx("span", { className: "border-border bg-muted/60 text-meta text-muted-foreground shrink-0 rounded-md border px-1.5 py-0.5 leading-none uppercase", children: badge })
+            /* @__PURE__ */ jsx("span", { className: "truncate text-label text-foreground", children: title }),
+            badge && /* @__PURE__ */ jsx("span", { className: "shrink-0 rounded-md border border-border bg-muted/60 px-1.5 py-0.5 text-meta leading-none text-muted-foreground uppercase", children: badge })
           ] }),
-          (subtitle || path) && /* @__PURE__ */ jsxs("span", { className: "text-meta text-muted-foreground flex min-w-0 items-center gap-2", children: [
+          (subtitle || path) && /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-2 text-meta text-muted-foreground", children: [
             subtitle && /* @__PURE__ */ jsx("span", { className: "truncate", children: subtitle }),
-            path && /* @__PURE__ */ jsx("span", { className: "border-border bg-muted/70 text-meta text-muted-foreground max-w-52 truncate rounded-md border px-1.5 py-0.5 font-mono leading-none", children: path })
+            path && /* @__PURE__ */ jsx("span", { className: "max-w-52 truncate rounded-md border border-border bg-muted/70 px-1.5 py-0.5 font-mono text-meta leading-none text-muted-foreground", children: path })
           ] })
         ] }),
         shortcut && /* @__PURE__ */ jsx(CommandShortcut, { children: shortcut })
@@ -182,7 +182,7 @@ function CommandPaletteItem({
   );
 }
 function CommandPaletteFooter({ label }) {
-  return /* @__PURE__ */ jsxs("div", { className: "command-palette-footer text-meta text-muted-foreground pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "command-palette-footer pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2 text-meta text-muted-foreground", children: [
     /* @__PURE__ */ jsx("span", { className: "truncate", children: label }),
     /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-1.5", children: [
       /* @__PURE__ */ jsx(Kbd, { size: "sm", children: "↑" }),

package/dist/components/CommandPalette.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandPalette.es.js","sources":["../../src/ds/components/CommandPalette/command-palette.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, HTMLAttributes, ReactNode } from 'react';\n\nimport { CommandDialog, CommandInput, CommandItem, CommandList, CommandShortcut } from '@/ds/components/Command';\nimport { Kbd } from '@/ds/components/Kbd';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nimport './command-palette.css';\n\ntype CommandPaletteDialogProps = ComponentPropsWithoutRef<typeof CommandDialog>;\n\nfunction CommandPaletteDialog({\n  children,\n  contentClassName,\n  commandClassName,\n  showOverlay = true,\n  overlayClassName,\n  ...props\n}: CommandPaletteDialogProps) {\n  return (\n    <CommandDialog\n      showOverlay={showOverlay}\n      overlayClassName={cn('bg-sidebar/40 backdrop-blur-none', overlayClassName)}\n      contentClassName={cn(\n        'command-palette-popup max-w-[min(56rem,calc(100vw-2rem))] overflow-visible border-none bg-transparent p-0 shadow-none backdrop-blur-none sm:max-w-[min(56rem,calc(100vw-2rem))]',\n        contentClassName,\n      )}\n      commandClassName={cn(\n        // Height lives in `.command-palette-shell` — see command-palette.css.\n        'command-palette-shell gap-2 overflow-visible rounded-none bg-transparent text-muted-foreground shadow-none backdrop-blur-none',\n        '[&_[data-slot=command-input-wrapper]_svg]:text-muted-foreground',\n        '**:[[cmdk-input]]:h-full **:[[cmdk-input]]:text-body',\n        '**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-2 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group]]:p-0',\n        '**:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-1.5',\n        commandClassName,\n      )}\n      {...props}\n    >\n      {children}\n    </CommandDialog>\n  );\n}\n\ntype CommandPaletteInputProps = ComponentPropsWithoutRef<typeof CommandInput>;\n\nfunction CommandPaletteInput({ wrapperClassName, ...props }: CommandPaletteInputProps) {\n  return (\n    <CommandInput\n      wrapperClassName={cn(\n        'command-palette-surface command-palette-surface-input',\n        inputSurfaceAndFocusWithinStyle,\n        // `border-0` because `CommandInput`'s own `border-b` is the separator of a single-panel\n        // Command; here the input is a detached pill and the material already carries its rim.\n        'h-11 shrink-0 rounded-xl border-0 px-3 pr-11',\n        wrapperClassName,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction CommandPaletteBody({ children, className, ...props }: HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div className=\"min-h-0 flex-1\">\n      <div\n        className={cn(\n          'grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-2 md:grid-cols-[13rem_minmax(0,1fr)] md:grid-rows-none',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n\ntype CommandPaletteRailProps = ComponentPropsWithoutRef<'aside'> & {\n  'aria-label': string;\n};\n\nfunction CommandPaletteRail({ children, className, ...props }: CommandPaletteRailProps) {\n  return (\n    <aside\n      className={cn(\n        'command-palette-surface command-palette-surface-rail flex max-h-[min(14rem,32dvh)] min-h-0 flex-col overflow-hidden rounded-xl p-2 md:h-full md:max-h-none',\n        overlaySurfaceStyle,\n        className,\n      )}\n      {...props}\n    >\n      <ScrollArea className=\"-m-1 min-h-0 flex-1 p-1\" viewPortClassName=\"pr-1\">\n        <div className=\"flex flex-col gap-1\">{children}</div>\n      </ScrollArea>\n    </aside>\n  );\n}\n\nfunction CommandPaletteScope({\n  icon,\n  label,\n  count,\n  active,\n  onSelect,\n}: {\n  icon: ReactNode;\n  label: string;\n  count: number;\n  active: boolean;\n  onSelect: () => void;\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        quietTextHover,\n        'text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left',\n        // eslint-disable-next-line tailwindcss/no-unnecessary-arbitrary-value -- v4 emits nothing for `scale-0.99`\n        'transition-[color,transform] duration-fast ease-out-custom motion-reduce:transition-none active:scale-[0.99]',\n      )}\n      data-active={active}\n      aria-pressed={active}\n      onClick={onSelect}\n    >\n      <span className=\"flex size-4 shrink-0 items-center justify-center [&>svg]:size-4\">{icon}</span>\n      <span className=\"min-w-0 flex-1 truncate\">{label}</span>\n      <span className=\"border-border bg-muted/70 text-meta text-muted-foreground rounded-md border px-1.5 py-0.5 leading-none\">\n        {count}\n      </span>\n    </button>\n  );\n}\n\ntype CommandPaletteResultsProps = {\n  'aria-label': string;\n  children: ReactNode;\n  footer?: ReactNode;\n};\n\nfunction CommandPaletteResults({ children, footer, ...props }: CommandPaletteResultsProps) {\n  return (\n    <div\n      role=\"region\"\n      className={cn(\n        'command-palette-surface command-palette-surface-results command-palette-results-panel relative flex min-h-0 min-w-0 flex-col overflow-hidden rounded-xl',\n        overlaySurfaceStyle,\n      )}\n      {...props}\n    >\n      <CommandList\n        scrollArea\n        scrollAreaClassName=\"min-h-0 flex-1 rounded-none\"\n        scrollAreaViewportClassName=\"command-palette-scroll-viewport\"\n        className=\"command-palette-list max-h-none rounded-none border-none bg-transparent shadow-none\"\n        highlightClassName=\"rounded-lg\"\n      >\n        {children}\n      </CommandList>\n      {footer}\n    </div>\n  );\n}\n\ntype CommandPaletteItemProps = Omit<ComponentPropsWithoutRef<typeof CommandItem>, 'children'> & {\n  icon: ReactNode;\n  title: string;\n  subtitle?: string;\n  path?: string;\n  badge?: string;\n  shortcut?: ReactNode;\n};\n\nfunction CommandPaletteItem({\n  icon,\n  title,\n  subtitle,\n  path,\n  badge,\n  shortcut,\n  className,\n  ...props\n}: CommandPaletteItemProps) {\n  return (\n    <CommandItem\n      className={cn(\n        'group h-auto items-start gap-3 rounded-lg border border-transparent px-3 py-2.5 data-[selected=true]:border-border',\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className={cn(\n          'text-muted-foreground group-data-[selected=true]:text-foreground mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center [&>svg]:!size-4 [&>svg]:shrink-0',\n          controlStateColorTransition,\n        )}\n      >\n        {icon}\n      </span>\n      <span className=\"flex min-w-0 flex-1 flex-col gap-1\">\n        <span className=\"flex min-w-0 items-center gap-2\">\n          <span className=\"text-label text-foreground truncate\">{title}</span>\n          {badge && (\n            <span className=\"border-border bg-muted/60 text-meta text-muted-foreground shrink-0 rounded-md border px-1.5 py-0.5 leading-none uppercase\">\n              {badge}\n            </span>\n          )}\n        </span>\n        {(subtitle || path) && (\n          <span className=\"text-meta text-muted-foreground flex min-w-0 items-center gap-2\">\n            {subtitle && <span className=\"truncate\">{subtitle}</span>}\n            {path && (\n              <span className=\"border-border bg-muted/70 text-meta text-muted-foreground max-w-52 truncate rounded-md border px-1.5 py-0.5 font-mono leading-none\">\n                {path}\n              </span>\n            )}\n          </span>\n        )}\n      </span>\n      {shortcut && <CommandShortcut>{shortcut}</CommandShortcut>}\n    </CommandItem>\n  );\n}\n\nfunction CommandPaletteFooter({ label }: { label: string }) {\n  return (\n    <div className=\"command-palette-footer text-meta text-muted-foreground pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2\">\n      <span className=\"truncate\">{label}</span>\n      <span className=\"flex shrink-0 items-center gap-1.5\">\n        <Kbd size=\"sm\">↑</Kbd>\n        <Kbd size=\"sm\">↓</Kbd>\n        <Kbd size=\"sm\">↵</Kbd>\n        <Kbd size=\"sm\">Esc</Kbd>\n      </span>\n    </div>\n  );\n}\n\nexport {\n  CommandPaletteBody,\n  CommandPaletteDialog,\n  CommandPaletteFooter,\n  CommandPaletteInput,\n  CommandPaletteItem,\n  CommandPaletteRail,\n  CommandPaletteResults,\n  CommandPaletteScope,\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"CommandPalette.es.js","sources":["../../src/ds/components/CommandPalette/command-palette.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, HTMLAttributes, ReactNode } from 'react';\n\nimport { CommandDialog, CommandInput, CommandItem, CommandList, CommandShortcut } from '@/ds/components/Command';\nimport { Kbd } from '@/ds/components/Kbd';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nimport './command-palette.css';\n\ntype CommandPaletteDialogProps = ComponentPropsWithoutRef<typeof CommandDialog>;\n\nfunction CommandPaletteDialog({\n  children,\n  contentClassName,\n  commandClassName,\n  showOverlay = true,\n  overlayClassName,\n  ...props\n}: CommandPaletteDialogProps) {\n  return (\n    <CommandDialog\n      showOverlay={showOverlay}\n      overlayClassName={cn('bg-sidebar/40 backdrop-blur-none', overlayClassName)}\n      contentClassName={cn(\n        'command-palette-popup max-w-[min(56rem,calc(100vw-2rem))] overflow-visible border-none bg-transparent p-0 shadow-none backdrop-blur-none sm:max-w-[min(56rem,calc(100vw-2rem))]',\n        contentClassName,\n      )}\n      commandClassName={cn(\n        // Height lives in `.command-palette-shell` — see command-palette.css.\n        'command-palette-shell gap-2 overflow-visible rounded-none bg-transparent text-muted-foreground shadow-none backdrop-blur-none',\n        '[&_[data-slot=command-input-wrapper]_svg]:text-muted-foreground',\n        '**:[[cmdk-input]]:h-full **:[[cmdk-input]]:text-body',\n        '**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-2 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group]]:p-0',\n        '**:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-1.5',\n        commandClassName,\n      )}\n      {...props}\n    >\n      {children}\n    </CommandDialog>\n  );\n}\n\ntype CommandPaletteInputProps = ComponentPropsWithoutRef<typeof CommandInput>;\n\nfunction CommandPaletteInput({ wrapperClassName, ...props }: CommandPaletteInputProps) {\n  return (\n    <CommandInput\n      wrapperClassName={cn(\n        'command-palette-surface command-palette-surface-input',\n        inputSurfaceAndFocusWithinStyle,\n        // `border-0` because `CommandInput`'s own `border-b` is the separator of a single-panel\n        // Command; here the input is a detached pill and the material already carries its rim.\n        'h-11 shrink-0 rounded-xl border-0 px-3 pr-11',\n        wrapperClassName,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction CommandPaletteBody({ children, className, ...props }: HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div className=\"min-h-0 flex-1\">\n      <div\n        className={cn(\n          'grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-2 md:grid-cols-[13rem_minmax(0,1fr)] md:grid-rows-none',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n\ntype CommandPaletteRailProps = ComponentPropsWithoutRef<'aside'> & {\n  'aria-label': string;\n};\n\nfunction CommandPaletteRail({ children, className, ...props }: CommandPaletteRailProps) {\n  return (\n    <aside\n      className={cn(\n        'command-palette-surface command-palette-surface-rail flex max-h-[min(14rem,32dvh)] min-h-0 flex-col overflow-hidden rounded-xl p-2 md:h-full md:max-h-none',\n        overlaySurfaceStyle,\n        className,\n      )}\n      {...props}\n    >\n      <ScrollArea className=\"-m-1 min-h-0 flex-1 p-1\" viewPortClassName=\"pr-1\">\n        <div className=\"flex flex-col gap-1\">{children}</div>\n      </ScrollArea>\n    </aside>\n  );\n}\n\nfunction CommandPaletteScope({\n  icon,\n  label,\n  count,\n  active,\n  onSelect,\n}: {\n  icon: ReactNode;\n  label: string;\n  count: number;\n  active: boolean;\n  onSelect: () => void;\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        quietTextHover,\n        'flex h-9 w-full cursor-pointer items-center gap-2 rounded-lg border border-transparent px-2.5 text-left text-body-sm hover:border-border hover:bg-fill-subtle data-[active=true]:border-border data-[active=true]:bg-fill-hover data-[active=true]:text-foreground',\n        // eslint-disable-next-line tailwindcss/no-unnecessary-arbitrary-value -- v4 emits nothing for `scale-0.99`\n        'transition-[color,transform] duration-fast ease-out-custom active:scale-[0.99] motion-reduce:transition-none',\n      )}\n      data-active={active}\n      aria-pressed={active}\n      onClick={onSelect}\n    >\n      <span className=\"flex size-4 shrink-0 items-center justify-center [&>svg]:size-4\">{icon}</span>\n      <span className=\"min-w-0 flex-1 truncate\">{label}</span>\n      <span className=\"rounded-md border border-border bg-muted/70 px-1.5 py-0.5 text-meta leading-none text-muted-foreground\">\n        {count}\n      </span>\n    </button>\n  );\n}\n\ntype CommandPaletteResultsProps = {\n  'aria-label': string;\n  children: ReactNode;\n  footer?: ReactNode;\n};\n\nfunction CommandPaletteResults({ children, footer, ...props }: CommandPaletteResultsProps) {\n  return (\n    <div\n      role=\"region\"\n      className={cn(\n        'command-palette-surface command-palette-surface-results command-palette-results-panel relative flex min-h-0 min-w-0 flex-col overflow-hidden rounded-xl',\n        overlaySurfaceStyle,\n      )}\n      {...props}\n    >\n      <CommandList\n        scrollArea\n        scrollAreaClassName=\"min-h-0 flex-1 rounded-none\"\n        scrollAreaViewportClassName=\"command-palette-scroll-viewport\"\n        className=\"command-palette-list max-h-none rounded-none border-none bg-transparent shadow-none\"\n        highlightClassName=\"rounded-lg\"\n      >\n        {children}\n      </CommandList>\n      {footer}\n    </div>\n  );\n}\n\ntype CommandPaletteItemProps = Omit<ComponentPropsWithoutRef<typeof CommandItem>, 'children'> & {\n  icon: ReactNode;\n  title: string;\n  subtitle?: string;\n  path?: string;\n  badge?: string;\n  shortcut?: ReactNode;\n};\n\nfunction CommandPaletteItem({\n  icon,\n  title,\n  subtitle,\n  path,\n  badge,\n  shortcut,\n  className,\n  ...props\n}: CommandPaletteItemProps) {\n  return (\n    <CommandItem\n      className={cn(\n        'group h-auto items-start gap-3 rounded-lg border border-transparent px-3 py-2.5 data-[selected=true]:border-border',\n        className,\n      )}\n      {...props}\n    >\n      <span\n        className={cn(\n          'mt-0.5 flex size-4 max-w-4 min-w-4 shrink-0 basis-4 items-center justify-center text-muted-foreground group-data-[selected=true]:text-foreground [&>svg]:!size-4 [&>svg]:shrink-0',\n          controlStateColorTransition,\n        )}\n      >\n        {icon}\n      </span>\n      <span className=\"flex min-w-0 flex-1 flex-col gap-1\">\n        <span className=\"flex min-w-0 items-center gap-2\">\n          <span className=\"truncate text-label text-foreground\">{title}</span>\n          {badge && (\n            <span className=\"shrink-0 rounded-md border border-border bg-muted/60 px-1.5 py-0.5 text-meta leading-none text-muted-foreground uppercase\">\n              {badge}\n            </span>\n          )}\n        </span>\n        {(subtitle || path) && (\n          <span className=\"flex min-w-0 items-center gap-2 text-meta text-muted-foreground\">\n            {subtitle && <span className=\"truncate\">{subtitle}</span>}\n            {path && (\n              <span className=\"max-w-52 truncate rounded-md border border-border bg-muted/70 px-1.5 py-0.5 font-mono text-meta leading-none text-muted-foreground\">\n                {path}\n              </span>\n            )}\n          </span>\n        )}\n      </span>\n      {shortcut && <CommandShortcut>{shortcut}</CommandShortcut>}\n    </CommandItem>\n  );\n}\n\nfunction CommandPaletteFooter({ label }: { label: string }) {\n  return (\n    <div className=\"command-palette-footer pointer-events-none absolute inset-x-0 bottom-0 z-20 flex items-end justify-between gap-3 px-3 pt-3 pb-2 text-meta text-muted-foreground\">\n      <span className=\"truncate\">{label}</span>\n      <span className=\"flex shrink-0 items-center gap-1.5\">\n        <Kbd size=\"sm\">↑</Kbd>\n        <Kbd size=\"sm\">↓</Kbd>\n        <Kbd size=\"sm\">↵</Kbd>\n        <Kbd size=\"sm\">Esc</Kbd>\n      </span>\n    </div>\n  );\n}\n\nexport {\n  CommandPaletteBody,\n  CommandPaletteDialog,\n  CommandPaletteFooter,\n  CommandPaletteInput,\n  CommandPaletteItem,\n  CommandPaletteRail,\n  CommandPaletteResults,\n  CommandPaletteScope,\n};\n"],"names":[],"mappings":"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"}