@mastra/playground-ui 68.0.0 → 69.0.0-alpha.0

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

@@ -1 +1 @@
-{"version":3,"file":"CommandPalette.es.js","names":[],"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, ScrollAreaViewport } from '@/ds/components/ScrollArea';\nimport { Txt } from '@/ds/components/Txt';\nimport { inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\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      size=\"xl\"\n      showOverlay={showOverlay}\n      overlayClassName={cn('bg-sidebar/40 backdrop-blur-none', overlayClassName)}\n      contentClassName={cn('command-palette-popup overflow-visible bg-transparent shadow-none', contentClassName)}\n      commandClassName={cn(\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        '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\">\n        <ScrollAreaViewport className=\"pr-1\">\n          <div className=\"flex flex-col gap-1\">{children}</div>\n        </ScrollAreaViewport>\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      <Txt\n        as=\"span\"\n        variant=\"meta\"\n        tone=\"muted\"\n        className=\"rounded-md border border-border bg-muted/70 px-1.5 py-0.5 leading-none\"\n      >\n        {count}\n      </Txt>\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      >\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        )}\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          <Txt as=\"span\" variant=\"label\" tone=\"ink\" className=\"truncate\">\n            {title}\n          </Txt>\n          {badge && (\n            <Txt\n              as=\"span\"\n              variant=\"meta\"\n              tone=\"muted\"\n              className=\"shrink-0 rounded-md border border-border bg-muted/60 px-1.5 py-0.5 leading-none uppercase\"\n            >\n              {badge}\n            </Txt>\n          )}\n        </span>\n        {(subtitle || path) && (\n          <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"flex min-w-0 items-center gap-2\">\n            {subtitle && <span className=\"truncate\">{subtitle}</span>}\n            {path && (\n              <Txt\n                as=\"span\"\n                variant=\"meta\"\n                tone=\"muted\"\n                font=\"mono\"\n                className=\"max-w-52 truncate rounded-md border border-border bg-muted/70 px-1.5 py-0.5 leading-none\"\n              >\n                {path}\n              </Txt>\n            )}\n          </Txt>\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"],"mappings":";;;;;;;;;;AAeA,SAAS,qBAAqB,EAC5B,UACA,kBACA,kBACA,cAAc,MACd,kBACA,GAAG,SACyB;CAC5B,OACE,oBAAC,eAAD;EACE,MAAK;EACQ;EACb,kBAAkB,GAAG,oCAAoC,gBAAgB;EACzE,kBAAkB,GAAG,qEAAqE,gBAAgB;EAC1G,kBAAkB,GAChB,iIACA,mEACA,wDACA,sHACA,iDACA,gBACF;EACA,GAAI;EAEH;CACY,CAAA;AAEnB;AAIA,SAAS,oBAAoB,EAAE,kBAAkB,GAAG,SAAmC;CACrF,OACE,oBAAC,cAAD;EACE,kBAAkB,GAChB,yDACA,iCACA,gDACA,gBACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,mBAAmB,EAAE,UAAU,WAAW,GAAG,SAAyC;CAC7F,OACE,oBAAC,OAAD;EAAK,WAAU;EACb,UAAA,oBAAC,OAAD;GACE,WAAW,GACT,iHACA,SACF;GACA,GAAI;GAEH;EACE,CAAA;CACF,CAAA;AAET;AAMA,SAAS,mBAAmB,EAAE,UAAU,WAAW,GAAG,SAAkC;CACtF,OACE,oBAAC,SAAD;EACE,WAAW,GACT,8JACA,qBACA,SACF;EACA,GAAI;EAEJ,UAAA,oBAAC,YAAD;GAAY,WAAU;GACpB,UAAA,oBAAC,oBAAD;IAAoB,WAAU;IAC5B,UAAA,oBAAC,OAAD;KAAK,WAAU;KAAuB;IAAc,CAAA;GAClC,CAAA;EACV,CAAA;CACP,CAAA;AAEX;AAEA,SAAS,oBAAoB,EAC3B,MACA,OACA,OACA,QACA,YAOC;CACD,OACE,qBAAC,UAAD;EACE,MAAK;EACL,WAAW,GACT,gBACA,sQAEA,8GACF;EACA,eAAa;EACb,gBAAc;EACd,SAAS;EAVX,UAAA;GAYE,oBAAC,QAAD;IAAM,WAAU;IAAmE,UAAA;GAAW,CAAA;GAC9F,oBAAC,QAAD;IAAM,WAAU;IAA2B,UAAA;GAAY,CAAA;GACvD,oBAAC,KAAD;IACE,IAAG;IACH,SAAQ;IACR,MAAK;IACL,WAAU;IAET,UAAA;GACE,CAAA;EACC;;AAEZ;AAQA,SAAS,sBAAsB,EAAE,UAAU,QAAQ,GAAG,SAAqC;CACzF,OACE,qBAAC,OAAD;EACE,MAAK;EACL,WAAW,GACT,2JACA,mBACF;EACA,GAAI;EANN,UAAA,CAQE,oBAAC,aAAD;GACE,YAAA;GACA,qBAAoB;GACpB,6BAA4B;GAC5B,WAAU;GAET;EACU,CAAA,GACZ,MACE;;AAET;AAWA,SAAS,mBAAmB,EAC1B,MACA,OACA,UACA,MACA,OACA,UACA,WACA,GAAG,SACuB;CAC1B,OACE,qBAAC,aAAD;EACE,WAAW,GACT,sHACA,SACF;EACA,GAAI;EALN,UAAA;GAOE,oBAAC,QAAD;IACE,WAAW,GACT,mLACF;IAEC,UAAA;GACG,CAAA;GACN,qBAAC,QAAD;IAAM,WAAU;IAAhB,UAAA,CACE,qBAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACE,oBAAC,KAAD;MAAK,IAAG;MAAO,SAAQ;MAAQ,MAAK;MAAM,WAAU;MACjD,UAAA;KACE,CAAA,GACJ,SACC,oBAAC,KAAD;MACE,IAAG;MACH,SAAQ;MACR,MAAK;MACL,WAAU;MAET,UAAA;KACE,CAAA,CAEH;IACJ,CAAA,IAAA,YAAY,SACZ,qBAAC,KAAD;KAAK,IAAG;KAAO,SAAQ;KAAO,MAAK;KAAQ,WAAU;KAArD,UAAA,CACG,YAAY,oBAAC,QAAD;MAAM,WAAU;MAAY,UAAA;KAAe,CAAA,GACvD,QACC,oBAAC,KAAD;MACE,IAAG;MACH,SAAQ;MACR,MAAK;MACL,MAAK;MACL,WAAU;MAET,UAAA;KACE,CAAA,CAEJ;IAEH,CAAA,CAAA;;GACL,YAAY,oBAAC,iBAAD,EAAA,UAAkB,SAA0B,CAAA;EAC9C;;AAEjB;AAEA,SAAS,qBAAqB,EAAE,SAA4B;CAC1D,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACE,oBAAC,QAAD;GAAM,WAAU;GAAY,UAAA;EAAY,CAAA,GACxC,qBAAC,QAAD;GAAM,WAAU;GAAhB,UAAA;IACE,oBAAC,KAAD;KAAK,MAAK;KAAK,UAAA;IAAM,CAAA;IACrB,oBAAC,KAAD;KAAK,MAAK;KAAK,UAAA;IAAM,CAAA;IACrB,oBAAC,KAAD;KAAK,MAAK;KAAK,UAAA;IAAM,CAAA;IACrB,oBAAC,KAAD;KAAK,MAAK;KAAK,UAAA;IAAQ,CAAA;GACnB;EACH,CAAA,CAAA;;AAET"}
+{"version":3,"file":"CommandPalette.es.js","names":[],"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, ScrollAreaViewport } from '@/ds/components/ScrollArea';\nimport { Txt } from '@/ds/components/Txt';\nimport { inputSurfaceAndFocusWithinStyle } from '@/ds/primitives/form-element';\nimport { overlaySurfaceStyle } from '@/ds/primitives/raised-surface';\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      size=\"xl\"\n      showOverlay={showOverlay}\n      overlayClassName={cn('bg-sidebar/40 backdrop-blur-none', overlayClassName)}\n      contentClassName={cn('command-palette-popup overflow-visible bg-transparent shadow-none', contentClassName)}\n      commandClassName={cn(\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        '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\">\n        <ScrollAreaViewport className=\"pr-1\">\n          <div className=\"flex flex-col gap-1\">{children}</div>\n        </ScrollAreaViewport>\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      <Txt\n        as=\"span\"\n        variant=\"meta\"\n        tone=\"muted\"\n        className=\"rounded-md border border-border bg-muted/70 px-1.5 py-0.5 leading-none\"\n      >\n        {count}\n      </Txt>\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      >\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?: ReactNode;\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        )}\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          <Txt as=\"span\" variant=\"label\" tone=\"ink\" className=\"truncate\">\n            {title}\n          </Txt>\n          {badge && (\n            <Txt\n              as=\"span\"\n              variant=\"meta\"\n              tone=\"muted\"\n              className=\"shrink-0 rounded-md border border-border bg-muted/60 px-1.5 py-0.5 leading-none uppercase\"\n            >\n              {badge}\n            </Txt>\n          )}\n        </span>\n        {(subtitle || path) && (\n          <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"flex min-w-0 items-center gap-2\">\n            {subtitle && <span className=\"min-w-0 truncate\">{subtitle}</span>}\n            {path && (\n              <Txt\n                as=\"span\"\n                variant=\"meta\"\n                tone=\"muted\"\n                font=\"mono\"\n                className=\"max-w-52 truncate rounded-md border border-border bg-muted/70 px-1.5 py-0.5 leading-none\"\n              >\n                {path}\n              </Txt>\n            )}\n          </Txt>\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"],"mappings":"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"}

package/dist/components/Comment.cjs.js

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_Comment = require("../Comment-Cg0f7eLa.cjs");
+const require_Comment = require("../Comment-rQxuMDQv.cjs");
 exports.Comment = require_Comment.Comment;
 exports.CommentArrival = require_Comment.CommentArrival;
 exports.CommentComposer = require_Comment.CommentComposer;

package/dist/components/Comment.es.js

@@ -1 +1 @@
-export { s as Comment, o as CommentArrival, r as CommentComposer, i as CommentComposerInput, a as CommentComposerSend, n as CommentEditor, c as CommentItem, l as CommentItemActions, u as CommentItemAuthor, d as CommentItemAvatar, f as CommentItemBody, p as CommentItemContent, m as CommentItemHeader, h as CommentItemTimestamp, g as CommentList, t as CommentQuote } from "../Comment-0n98b_f_.js";
+export { s as Comment, o as CommentArrival, r as CommentComposer, i as CommentComposerInput, a as CommentComposerSend, n as CommentEditor, c as CommentItem, l as CommentItemActions, u as CommentItemAuthor, d as CommentItemAvatar, f as CommentItemBody, p as CommentItemContent, m as CommentItemHeader, h as CommentItemTimestamp, g as CommentList, t as CommentQuote } from "../Comment-2q9SomE2.js";

package/dist/components/CompactNumber.cjs.js

@@ -1,7 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_utils = require("../utils-uDc1ofX1.cjs");
+const require_tooltip = require("../tooltip-BsExuMO8.cjs");
 const require_cost = require("../cost-CDXUhpb_.cjs");
-const require_tooltip = require("../tooltip-BiRLT3Th.cjs");
+const require_utils = require("../utils-uDc1ofX1.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/ds/components/CompactNumber/compact-number.tsx
 function CompactNumber({ value, currency, className }) {

package/dist/components/CompactNumber.es.js

@@ -1,6 +1,6 @@
-import { t as cn } from "../utils-DQx8TpNT.js";
+import { i as TooltipTrigger, n as TooltipContent, t as Tooltip } from "../tooltip-DJcze2VZ.js";
 import { r as formatFullNumber, t as formatCompactNumber } from "../cost-C2vDb3o7.js";
-import { i as TooltipTrigger, n as TooltipContent, t as Tooltip } from "../tooltip-HzcLyGtV.js";
+import { t as cn } from "../utils-DQx8TpNT.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 // src/ds/components/CompactNumber/compact-number.tsx
 function CompactNumber({ value, currency, className }) {

package/dist/components/Composer.cjs.js

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_Composer = require("../Composer-BcueJvdX.cjs");
+const require_Composer = require("../Composer-u1K6edoZ.cjs");
 exports.Composer = require_Composer.Composer;
 exports.ComposerActions = require_Composer.ComposerActions;
 exports.ComposerAttachments = require_Composer.ComposerAttachments;

package/dist/components/Composer.es.js

@@ -1 +1 @@
-export { l as Composer, u as ComposerActions, d as ComposerAttachments, f as ComposerBox, a as ComposerHeader, o as ComposerHeaderActions, s as ComposerHeaderContent, c as ComposerHeaderRow, p as ComposerInput, m as ComposerRing, i as ComposerSuggestions, h as ComposerToneLabel, n as matchCommandOptions, r as matchCommands, t as useComposerCommands } from "../Composer-D1gF-0jZ.js";
+export { l as Composer, u as ComposerActions, d as ComposerAttachments, f as ComposerBox, a as ComposerHeader, o as ComposerHeaderActions, s as ComposerHeaderContent, c as ComposerHeaderRow, p as ComposerInput, m as ComposerRing, i as ComposerSuggestions, h as ComposerToneLabel, n as matchCommandOptions, r as matchCommands, t as useComposerCommands } from "../Composer-bVE8qK52.js";

package/dist/components/ContextMenu.cjs.js

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_context_menu = require("../context-menu-DTFPCyae.cjs");
+const require_context_menu = require("../context-menu-DwB7u7fB.cjs");
 exports.ContextMenu = require_context_menu.ContextMenu;

package/dist/components/ContextMenu.es.js

@@ -1 +1 @@
-export { t as ContextMenu } from "../context-menu-Dv0NU0oM.js";
+export { t as ContextMenu } from "../context-menu-6_Kcs8kj.js";

package/dist/components/CopyButton.cjs.js

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_copy_button = require("../copy-button-DJAQ6_3o.cjs");
+const require_copy_button = require("../copy-button-DuEUYvS2.cjs");
 exports.CopyButton = require_copy_button.CopyButton;

package/dist/components/CopyButton.es.js

@@ -1 +1 @@
-export { t as CopyButton } from "../copy-button-BXrbevLn.js";
+export { t as CopyButton } from "../copy-button-B-_Z6N6y.js";

package/dist/components/DataCodeSection.cjs.js

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_DataCodeSection = require("../DataCodeSection-CFxXsQWH.cjs");
+const require_DataCodeSection = require("../DataCodeSection-7SvRJj6f.cjs");
 exports.DataCodeSection = require_DataCodeSection.DataCodeSection;

package/dist/components/DataCodeSection.es.js

@@ -1 +1 @@
-export { t as DataCodeSection } from "../DataCodeSection-PY9XEg2C.js";
+export { t as DataCodeSection } from "../DataCodeSection-CTodi9wg.js";

package/dist/components/DataDetailsPanel.cjs.js

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_DataDetailsPanel = require("../DataDetailsPanel-DiyjEXqK.cjs");
+const require_DataDetailsPanel = require("../DataDetailsPanel-BDoD6pxx.cjs");
 exports.DataDetailsPanel = require_DataDetailsPanel.DataDetailsPanel;

package/dist/components/DataDetailsPanel.es.js

@@ -1 +1 @@
-export { t as DataDetailsPanel } from "../DataDetailsPanel-CohEKPm4.js";
+export { t as DataDetailsPanel } from "../DataDetailsPanel-BU05psHL.js";

package/dist/components/DataKeysAndValues.cjs.js

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_DataKeysAndValues = require("../DataKeysAndValues-DsH6AbAo.cjs");
+const require_DataKeysAndValues = require("../DataKeysAndValues-BbKeVxrQ.cjs");
 exports.DataKeysAndValues = require_DataKeysAndValues.DataKeysAndValues;

package/dist/components/DataKeysAndValues.es.js

@@ -1 +1 @@
-export { t as DataKeysAndValues } from "../DataKeysAndValues-PwOmGxyp.js";
+export { t as DataKeysAndValues } from "../DataKeysAndValues-B56je3sK.js";

package/dist/components/DataList.cjs.js

@@ -1,7 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_data_list = require("../data-list-C4Vmq5HA.cjs");
-const require_DataList = require("../DataList-Cj0mfk19.cjs");
-const require_tabbed_container = require("../tabbed-container-B4lCBgRP.cjs");
+const require_data_list = require("../data-list-072hHK9L.cjs");
+const require_DataList = require("../DataList-DTIdllb-.cjs");
+const require_tabbed_container = require("../tabbed-container-Bhfi-DWr.cjs");
 const require_use_data_list_keyboard = require("../use-data-list-keyboard-BCLBdaWR.cjs");
 exports.DataList = require_data_list.DataList;
 exports.DataListSkeleton = require_DataList.DataListSkeleton;

package/dist/components/DataList.es.js

@@ -1,5 +1,5 @@
-import { t as DataList } from "../data-list-DHCOoLmj.js";
-import { i as DataListSkeletonRows, n as ScoresDataList, r as DataListSkeleton, t as TracesDataList } from "../DataList-CUhRQAv6.js";
-import { t as TabbedContainer } from "../tabbed-container-DI1GI1Qv.js";
+import { t as DataList } from "../data-list-GzbzPmYR.js";
+import { i as DataListSkeletonRows, n as ScoresDataList, r as DataListSkeleton, t as TracesDataList } from "../DataList-B7ho6PrJ.js";
+import { t as TabbedContainer } from "../tabbed-container-DOkHshha.js";
 import { t as useDataListKeyboard } from "../use-data-list-keyboard-fJXq2T3y.js";
 export { DataList, DataListSkeleton, DataListSkeletonRows, ScoresDataList, TabbedContainer, TracesDataList, useDataListKeyboard };

package/dist/components/DataPanel.cjs.js

@@ -1,3 +1,3 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_DataPanel = require("../DataPanel-Coc9h35I.cjs");
+const require_DataPanel = require("../DataPanel-BRRAvWYQ.cjs");
 exports.DataPanel = require_DataPanel.DataPanel;

package/dist/components/DataPanel.es.js

@@ -1 +1 @@
-export { t as DataPanel } from "../DataPanel-IgB9D5PO.js";
+export { t as DataPanel } from "../DataPanel-pVr5LVaK.js";

package/dist/components/DateRangeTimeline.cjs.js

@@ -1,10 +1,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_Button = require("../Button-BfICfyxD.cjs");
+const require_components_DateTimePicker = require("./DateTimePicker.cjs.js");
+const require_popover = require("../popover-D9AfJmla.cjs");
+const require_Txt = require("../Txt-_00wWxTd.cjs");
 const require_utils = require("../utils-uDc1ofX1.cjs");
 const require_primitives_transitions = require("../primitives/transitions.cjs.js");
-const require_Button = require("../Button-DLcMcuUL.cjs");
-const require_Txt = require("../Txt-BnoSqxKE.cjs");
-const require_popover = require("../popover-BJqa6Hz6.cjs");
-const require_components_DateTimePicker = require("./DateTimePicker.cjs.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let lucide_react = require("lucide-react");
@@ -190,8 +190,8 @@ function DateRangeBoundaryPicker({ boundary, value, min, max, onSelect }) {
 				mode: "single",
 				selected: selectedDate,
 				defaultMonth: selectedDate,
-				fromMonth: firstDate,
-				toMonth: lastDate,
+				startMonth: firstDate,
+				endMonth: lastDate,
 				disabled: firstDate && lastDate ? {
 					before: firstDate,
 					after: lastDate
@@ -321,7 +321,7 @@ function DateRangeTicks({ ticks, min, max }) {
 	const timelineLabel = `Visible from ${formatBoundaryDate(firstTick.date)} through ${formatBoundaryDate(lastTick.date)}. Available from ${formatBoundaryDate(min)} through ${formatBoundaryDate(max)}`;
 	if (firstTick.date === lastTick.date) {
 		const date = formatBoundaryDate(firstTick.date);
-		const singleLabel = firstTick.date === min && firstTick.date === max ? `Created today · ${date}` : firstTick.date === min ? `Created · ${date}` : firstTick.date === max ? `Today · ${date}` : date;
+		const singleLabel = firstTick.date === min && firstTick.date === max ? `Created today (${date})` : firstTick.date === min ? `Created ${date}` : firstTick.date === max ? `Today (${date})` : date;
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			role: "group",
 			"aria-label": timelineLabel,
@@ -334,8 +334,8 @@ function DateRangeTicks({ ticks, min, max }) {
 			})
 		});
 	}
-	const startLabel = firstTick.date === min ? `Created · ${formatBoundaryDate(min)}` : firstTick.label;
-	const endLabel = lastTick.date === max ? `Today · ${formatBoundaryDate(max)}` : lastTick.label;
+	const startLabel = firstTick.date === min ? `Created ${formatBoundaryDate(min)}` : firstTick.label;
+	const endLabel = lastTick.date === max ? `Today (${formatBoundaryDate(max)})` : lastTick.label;
 	const middleTicks = ticks.slice(1, -1);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		role: "group",