@kismet-ux/constellation 1.1.0 → 1.2.0

package/dist/navigation/Sheet/sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.js","sources":["../../../src/navigation/Sheet/sheet.tsx"],"sourcesContent":["import { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { XIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { Slot } from '../../internal/slot';\nimport { useAnimationState } from '../../internal/use-animation-state';\nimport { useFocusTrap } from '../../internal/use-focus-trap';\nimport { useScrollLock } from '../../internal/use-scroll-lock';\nimport s from './sheet.module.scss';\n\n// ── Context ──────────────────────────────────────────────\n\ntype SheetContextValue = {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  titleId: string;\n  descriptionId: string;\n};\n\nconst SheetContext = React.createContext<SheetContextValue | null>(null);\n\nfunction useSheet() {\n  const ctx = React.useContext(SheetContext);\n  if (!ctx) throw new Error('Sheet compound components must be used within <Sheet>');\n  return ctx;\n}\n\n// ── Root ─────────────────────────────────────────────────\n\nexport interface SheetProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nfunction Sheet({ open: controlledOpen, defaultOpen = false, onOpenChange, children }: SheetProps) {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : internalOpen;\n  const titleId = React.useId();\n  const descriptionId = React.useId();\n\n  const handleOpenChange = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  return (\n    <SheetContext.Provider value={{ open, onOpenChange: handleOpenChange, titleId, descriptionId }}>\n      {children}\n    </SheetContext.Provider>\n  );\n}\n\n// ── Trigger ──────────────────────────────────────────────\n\nexport interface SheetTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetTrigger = React.forwardRef<HTMLButtonElement, SheetTriggerProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(true);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-trigger'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetTrigger.displayName = 'SheetTrigger';\n\n// ── Close ────────────────────────────────────────────────\n\nexport interface SheetCloseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetClose = React.forwardRef<HTMLButtonElement, SheetCloseProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(false);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-close'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetClose.displayName = 'SheetClose';\n\n// ── Content ──────────────────────────────────────────────\n\nconst sideClassMap = {\n  right: s['content-right'],\n  left: s['content-left'],\n  top: s['content-top'],\n  bottom: s['content-bottom'],\n} as const;\n\ntype SheetSide = keyof typeof sideClassMap;\n\nexport type SheetContentProps = React.HTMLAttributes<HTMLDivElement> & {\n  side?: SheetSide;\n};\n\nconst SheetContent = React.forwardRef<HTMLDivElement, SheetContentProps>(\n  ({ className, children, side = 'right', ...props }, ref) => {\n    const { open, onOpenChange, titleId, descriptionId } = useSheet();\n    const { mounted, state } = useAnimationState(open, 250);\n    const focusTrapRef = useFocusTrap(open);\n    useScrollLock(mounted);\n\n    React.useEffect(() => {\n      if (!open) return;\n\n      const handleKeyDown = (e: KeyboardEvent) => {\n        // A nested layer (an open Select, DatePicker or menu) marks Escape as\n        // handled with preventDefault. Escape should dismiss the topmost layer\n        // only, so the modal ignores an event something inside it already took.\n        if (e.key === 'Escape' && !e.defaultPrevented) {\n          onOpenChange(false);\n        }\n      };\n\n      document.addEventListener('keydown', handleKeyDown);\n      return () => document.removeEventListener('keydown', handleKeyDown);\n    }, [open, onOpenChange]);\n\n    if (!mounted || state === 'idle') return null;\n\n    return createPortal(\n      <div ref={focusTrapRef}>\n        <div\n          data-slot={'sheet-overlay'}\n          data-state={state}\n          className={s.overlay}\n          onClick={() => onOpenChange(false)}\n          aria-hidden={'true'}\n        />\n        <div\n          ref={ref}\n          data-slot={'sheet-content'}\n          data-state={state}\n          role={'dialog'}\n          aria-modal={'true'}\n          aria-labelledby={titleId}\n          aria-describedby={descriptionId}\n          className={cn(s['sheet-content'], sideClassMap[side], className)}\n          onClick={e => e.stopPropagation()}\n          {...props}\n        >\n          {children}\n          <SheetClose className={s['close-button']} asChild>\n            <Button variant={'ghost'} theme={'inherit'} iconOnly size={'sm'}>\n              <XIcon />\n              <span className={'srOnly'}>Close</span>\n            </Button>\n          </SheetClose>\n        </div>\n      </div>,\n      document.body,\n    );\n  },\n);\nSheetContent.displayName = 'SheetContent';\n\n// ── Semantic sub-components ──────────────────────────────\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-header'} className={cn(s.header, className)} {...props} />;\n}\n\nfunction SheetBody({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-body'} className={cn(s.body, className)} {...props} />;\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-footer'} className={cn(s.footer, className)} {...props} />;\n}\n\nfunction SheetTitle({ className, ...props }: React.ComponentProps<'h2'>) {\n  const { titleId } = useSheet();\n\n  return (\n    <h2 id={titleId} data-slot={'sheet-title'} className={cn(s.title, className)} {...props} />\n  );\n}\n\nfunction SheetDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  const { descriptionId } = useSheet();\n\n  return (\n    <p\n      id={descriptionId}\n      data-slot={'sheet-description'}\n      className={cn(s.description, className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Sheet,\n  SheetBody,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"sheet.js","sources":["../../../src/navigation/Sheet/sheet.tsx"],"sourcesContent":["import { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { XIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { Slot } from '../../internal/slot';\nimport { useAnimationState } from '../../internal/use-animation-state';\nimport { useFocusTrap } from '../../internal/use-focus-trap';\nimport { useScrollLock } from '../../internal/use-scroll-lock';\nimport s from './sheet.module.scss';\n\n// ── Context ──────────────────────────────────────────────\n\ntype SheetContextValue = {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  titleId: string;\n  descriptionId: string;\n};\n\nconst SheetContext = React.createContext<SheetContextValue | null>(null);\n\nfunction useSheet() {\n  const ctx = React.useContext(SheetContext);\n  if (!ctx) throw new Error('Sheet compound components must be used within <Sheet>');\n  return ctx;\n}\n\n// ── Root ─────────────────────────────────────────────────\n\nexport interface SheetProps {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  children?: React.ReactNode;\n}\n\nfunction Sheet({ open: controlledOpen, defaultOpen = false, onOpenChange, children }: SheetProps) {\n  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : internalOpen;\n  const titleId = React.useId();\n  const descriptionId = React.useId();\n\n  const handleOpenChange = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  return (\n    <SheetContext.Provider value={{ open, onOpenChange: handleOpenChange, titleId, descriptionId }}>\n      {children}\n    </SheetContext.Provider>\n  );\n}\n\n// ── Trigger ──────────────────────────────────────────────\n\nexport interface SheetTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetTrigger = React.forwardRef<HTMLButtonElement, SheetTriggerProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(true);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-trigger'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetTrigger.displayName = 'SheetTrigger';\n\n// ── Close ────────────────────────────────────────────────\n\nexport interface SheetCloseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean;\n}\n\nconst SheetClose = React.forwardRef<HTMLButtonElement, SheetCloseProps>(\n  ({ asChild, onClick, children, ...props }, ref) => {\n    const { onOpenChange } = useSheet();\n    const Comp = asChild ? Slot : 'button';\n\n    const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick?.(e);\n      onOpenChange(false);\n    };\n\n    return (\n      <Comp ref={ref} data-slot={'sheet-close'} onClick={handleClick} {...props}>\n        {children}\n      </Comp>\n    );\n  },\n);\nSheetClose.displayName = 'SheetClose';\n\n// ── Content ──────────────────────────────────────────────\n\nconst sideClassMap = {\n  right: s['content-right'],\n  left: s['content-left'],\n  top: s['content-top'],\n  bottom: s['content-bottom'],\n} as const;\n\ntype SheetSide = keyof typeof sideClassMap;\n\nexport type SheetContentProps = React.HTMLAttributes<HTMLDivElement> & {\n  side?: SheetSide;\n};\n\nconst SheetContent = React.forwardRef<HTMLDivElement, SheetContentProps>(\n  ({ className, children, side = 'right', ...props }, ref) => {\n    const { open, onOpenChange, titleId, descriptionId } = useSheet();\n    const { mounted, state } = useAnimationState(open, 250);\n    const focusTrapRef = useFocusTrap(open);\n    useScrollLock(mounted);\n\n    React.useEffect(() => {\n      if (!open) return;\n\n      const handleKeyDown = (e: KeyboardEvent) => {\n        // A nested layer (an open Select, DatePicker or menu) marks Escape as\n        // handled with preventDefault. Escape should dismiss the topmost layer\n        // only, so the modal ignores an event something inside it already took.\n        if (e.key === 'Escape' && !e.defaultPrevented) {\n          onOpenChange(false);\n        }\n      };\n\n      document.addEventListener('keydown', handleKeyDown);\n      return () => document.removeEventListener('keydown', handleKeyDown);\n    }, [open, onOpenChange]);\n\n    if (!mounted || state === 'idle') return null;\n\n    return createPortal(\n      <div ref={focusTrapRef}>\n        <div\n          data-slot={'sheet-overlay'}\n          data-state={state}\n          className={s.overlay}\n          onClick={() => onOpenChange(false)}\n          aria-hidden={'true'}\n        />\n        <div\n          ref={ref}\n          data-slot={'sheet-content'}\n          data-state={state}\n          role={'dialog'}\n          aria-modal={'true'}\n          aria-labelledby={titleId}\n          aria-describedby={descriptionId}\n          className={cn(s['sheet-content'], sideClassMap[side], className)}\n          onClick={e => e.stopPropagation()}\n          {...props}\n        >\n          {children}\n          <SheetClose className={s['close-button']} asChild>\n            <Button variant={'ghost'} theme={'inherit'} iconOnly size={'sm'}>\n              <XIcon />\n              <span className={'srOnly'}>Close</span>\n            </Button>\n          </SheetClose>\n        </div>\n      </div>,\n      document.body,\n    );\n  },\n);\nSheetContent.displayName = 'SheetContent';\n\n// ── Semantic sub-components ──────────────────────────────\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-header'} className={cn(s.header, className)} {...props} />;\n}\n\nfunction SheetBody({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-body'} className={cn(s.body, className)} {...props} />;\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return <div data-slot={'sheet-footer'} className={cn(s.footer, className)} {...props} />;\n}\n\nfunction SheetTitle({ className, ...props }: React.ComponentProps<'h2'>) {\n  const { titleId } = useSheet();\n\n  return (\n    <h2 id={titleId} data-slot={'sheet-title'} className={cn(s.title, className)} {...props} />\n  );\n}\n\nfunction SheetDescription({ className, ...props }: React.ComponentProps<'p'>) {\n  const { descriptionId } = useSheet();\n\n  return (\n    <p\n      id={descriptionId}\n      data-slot={'sheet-description'}\n      className={cn(s.description, className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Sheet,\n  SheetBody,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/navigation.d.ts

@@ -62,7 +62,7 @@ declare function DropdownMenuSubContent({ className, ...props }: React.HTMLAttri
 declare const linkVariants: (props?: ({
     underline?: boolean | null | undefined;
     hover?: "default" | "none" | null | undefined;
-    theme?: "destructive" | "inherit" | "primary" | "secondary" | "warning" | "success" | "info" | "slate" | null | undefined;
+    theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 
 interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'onClick'>, VariantProps<typeof linkVariants> {

package/dist/settings/AppearanceTabs/appearance-tabs.js

@@ -21,6 +21,8 @@ import '../../ui/Pagination/pagination.js';
 import '../../ui/ProgressBar/progress-bar.js';
 import '../../ui/Separator/separator.js';
 import '../../ui/StatCard/stat-card.js';
+import '../../ui/StatusDot/status-dot.js';
+import '../../ui/StatusDot/status-dot-variants.js';
 import '../../ui/StepProgress/step-progress.js';
 import '../../ui/Switch/switch.js';
 import '../../ui/Table/table.js';

package/dist/settings/AppearanceTabs/appearance-tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"appearance-tabs.js","sources":["../../../src/settings/AppearanceTabs/appearance-tabs.tsx"],"sourcesContent":["import { type Appearance, useAppearance } from '@constellation/hooks';\nimport { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { type LucideIcon, MonitorIcon, MoonIcon, SunIcon } from 'lucide-react';\nimport * as React from 'react';\nimport s from './appearance-tabs.module.scss';\n\ntype AppearanceTabsProps = React.HTMLAttributes<HTMLDivElement> & {\n  iconOnly?: boolean;\n};\n\nexport function AppearanceTabs({\n  className = '',\n  iconOnly = false,\n  ...props\n}: AppearanceTabsProps) {\n  const { appearance, updateAppearance } = useAppearance();\n\n  const tabs: { value: Appearance; icon: LucideIcon; label: string }[] = [\n    { value: 'light', icon: SunIcon, label: 'Light' },\n    { value: 'dark', icon: MoonIcon, label: 'Dark' },\n    { value: 'system', icon: MonitorIcon, label: 'System' },\n  ];\n\n  return (\n    <div data-slot={'appearance-tabs'} className={cn(s['tabs-root'], className)} {...props}>\n      {tabs.map(({ value, icon: Icon, label }) => (\n        <Button\n          key={value}\n          variant={'ghost'}\n          theme={'inherit'}\n          rounded\n          onClick={() => updateAppearance(value)}\n          aria-label={label}\n          iconOnly={iconOnly}\n          aria-pressed={appearance === value}\n          className={cn(s['tab-button'], appearance === value && s['tab-button-active'])}\n          title={iconOnly ? label : undefined}\n        >\n          <Icon />\n          {!iconOnly && <span>{label}</span>}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWM,SAAU,cAAc,CAAC,EAC7B,SAAS,GAAG,EAAE,EACd,QAAQ,GAAG,KAAK,EAChB,GAAG,KAAK,EACY,EAAA;IACpB,MAAM,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAAG,aAAa,EAAE;AAExD,IAAA,MAAM,IAAI,GAA6D;QACrE,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;QACjD,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE;QAChD,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;KACxD;IAED,QACEA,GAAA,CAAA,KAAA,EAAA,EAAA,WAAA,EAAgB,iBAAiB,EAAE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC,EAAA,GAAM,KAAK,EAAA,QAAA,EACnF,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MACrCC,IAAA,CAAC,MAAM,EAAA,EAEL,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAA,IAAA,EACP,OAAO,EAAE,MAAM,gBAAgB,CAAC,KAAK,CAAC,gBAC1B,KAAK,EACjB,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,UAAU,KAAK,KAAK,EAClC,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,UAAU,KAAK,KAAK,IAAI,CAAC,CAAC,mBAAmB,CAAC,CAAC,EAC9E,KAAK,EAAE,QAAQ,GAAG,KAAK,GAAG,SAAS,EAAA,QAAA,EAAA,CAEnCD,GAAA,CAAC,IAAI,EAAA,EAAA,CAAG,EACP,CAAC,QAAQ,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAO,KAAK,EAAA,CAAQ,CAAA,EAAA,EAZ7B,KAAK,CAaH,CACV,CAAC,EAAA,CACE;AAEV;;"}
+{"version":3,"file":"appearance-tabs.js","sources":["../../../src/settings/AppearanceTabs/appearance-tabs.tsx"],"sourcesContent":["import { type Appearance, useAppearance } from '@constellation/hooks';\nimport { Button } from '@constellation/ui';\nimport cn from 'clsx';\nimport { type LucideIcon, MonitorIcon, MoonIcon, SunIcon } from 'lucide-react';\nimport * as React from 'react';\nimport s from './appearance-tabs.module.scss';\n\ntype AppearanceTabsProps = React.HTMLAttributes<HTMLDivElement> & {\n  iconOnly?: boolean;\n};\n\nexport function AppearanceTabs({\n  className = '',\n  iconOnly = false,\n  ...props\n}: AppearanceTabsProps) {\n  const { appearance, updateAppearance } = useAppearance();\n\n  const tabs: { value: Appearance; icon: LucideIcon; label: string }[] = [\n    { value: 'light', icon: SunIcon, label: 'Light' },\n    { value: 'dark', icon: MoonIcon, label: 'Dark' },\n    { value: 'system', icon: MonitorIcon, label: 'System' },\n  ];\n\n  return (\n    <div data-slot={'appearance-tabs'} className={cn(s['tabs-root'], className)} {...props}>\n      {tabs.map(({ value, icon: Icon, label }) => (\n        <Button\n          key={value}\n          variant={'ghost'}\n          theme={'inherit'}\n          rounded\n          onClick={() => updateAppearance(value)}\n          aria-label={label}\n          iconOnly={iconOnly}\n          aria-pressed={appearance === value}\n          className={cn(s['tab-button'], appearance === value && s['tab-button-active'])}\n          title={iconOnly ? label : undefined}\n        >\n          <Icon />\n          {!iconOnly && <span>{label}</span>}\n        </Button>\n      ))}\n    </div>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWM,SAAU,cAAc,CAAC,EAC7B,SAAS,GAAG,EAAE,EACd,QAAQ,GAAG,KAAK,EAChB,GAAG,KAAK,EACY,EAAA;IACpB,MAAM,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAAG,aAAa,EAAE;AAExD,IAAA,MAAM,IAAI,GAA6D;QACrE,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;QACjD,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE;QAChD,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;KACxD;IAED,QACEA,GAAA,CAAA,KAAA,EAAA,EAAA,WAAA,EAAgB,iBAAiB,EAAE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC,EAAA,GAAM,KAAK,EAAA,QAAA,EACnF,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MACrCC,IAAA,CAAC,MAAM,EAAA,EAEL,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAA,IAAA,EACP,OAAO,EAAE,MAAM,gBAAgB,CAAC,KAAK,CAAC,gBAC1B,KAAK,EACjB,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,UAAU,KAAK,KAAK,EAClC,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,UAAU,KAAK,KAAK,IAAI,CAAC,CAAC,mBAAmB,CAAC,CAAC,EAC9E,KAAK,EAAE,QAAQ,GAAG,KAAK,GAAG,SAAS,EAAA,QAAA,EAAA,CAEnCD,GAAA,CAAC,IAAI,EAAA,EAAA,CAAG,EACP,CAAC,QAAQ,IAAIA,GAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAO,KAAK,EAAA,CAAQ,CAAA,EAAA,EAZ7B,KAAK,CAaH,CACV,CAAC,EAAA,CACE;AAEV;;"}

package/dist/{tooltip-zOT3UHCF.d.ts → tooltip-DoCbTucr.d.ts}

@@ -3,9 +3,9 @@ import * as React from 'react';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 
 declare const buttonVariants: (props?: ({
-    variant?: "contained" | "outlined" | "ghost" | null | undefined;
-    theme?: "destructive" | "inherit" | "primary" | "secondary" | "warning" | "success" | "info" | "slate" | null | undefined;
-    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+    variant?: "outlined" | "contained" | "ghost" | null | undefined;
+    theme?: "inherit" | "primary" | "secondary" | "success" | "destructive" | "warning" | "info" | "slate" | null | undefined;
+    size?: "lg" | "md" | "sm" | "xs" | null | undefined;
     iconOnly?: boolean | null | undefined;
     rounded?: boolean | "extra" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;

package/dist/ui/Chip/chip-variants.d.ts

@@ -1,6 +1,11 @@
 export declare const chipVariants: (props?: ({
     theme?: "inherit" | "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | null | undefined;
-    size?: "sm" | "md" | null | undefined;
+    variant?: "solid" | "soft" | "outline" | null | undefined;
+    size?: "sm" | "md" | "xs" | "2xs" | null | undefined;
+    shape?: "rounded" | "pill" | null | undefined;
+    dashed?: boolean | null | undefined;
+    mono?: boolean | null | undefined;
+    uppercase?: boolean | null | undefined;
     wrap?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //# sourceMappingURL=chip-variants.d.ts.map

package/dist/ui/Chip/chip-variants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chip-variants.d.ts","sourceRoot":"","sources":["../../../src/ui/Chip/chip-variants.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;;8EAyBvB,CAAC"}
+{"version":3,"file":"chip-variants.d.ts","sourceRoot":"","sources":["../../../src/ui/Chip/chip-variants.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;;;;;;;8EA0CvB,CAAC"}

package/dist/ui/Chip/chip-variants.js

@@ -13,17 +13,34 @@ const chipVariants = cva(s.chip, {
             slate: s['chip--slate'],
             inherit: s['chip--inherit'],
         },
+        variant: {
+            soft: s['chip--soft'],
+            outline: s['chip--outline'],
+            solid: s['chip--solid'],
+        },
         size: {
+            '2xs': s['chip--2xs'],
+            xs: s['chip--xs'],
             sm: s['chip--sm'],
             md: s['chip--md'],
         },
-        wrap: {
-            true: s['chip--wrap'],
+        shape: {
+            pill: undefined,
+            rounded: s['chip--rounded'],
         },
+        dashed: { true: s['chip--dashed'] },
+        mono: { true: s['chip--mono'] },
+        uppercase: { true: s['chip--uppercase'] },
+        wrap: { true: s['chip--wrap'] },
     },
     defaultVariants: {
         theme: 'primary',
+        variant: 'soft',
         size: 'md',
+        shape: 'pill',
+        dashed: false,
+        mono: false,
+        uppercase: false,
         wrap: false,
     },
 });

package/dist/ui/Chip/chip-variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip-variants.js","sources":["../../../src/ui/Chip/chip-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport s from './chip.module.scss';\n\nexport const chipVariants = cva(s.chip, {\n  variants: {\n    theme: {\n      primary: s['chip--primary'],\n      secondary: s['chip--secondary'],\n      destructive: s['chip--destructive'],\n      warning: s['chip--warning'],\n      success: s['chip--success'],\n      info: s['chip--info'],\n      slate: s['chip--slate'],\n      inherit: s['chip--inherit'],\n    },\n    size: {\n      sm: s['chip--sm'],\n      md: s['chip--md'],\n    },\n    wrap: {\n      true: s['chip--wrap'],\n    },\n  },\n  defaultVariants: {\n    theme: 'primary',\n    size: 'md',\n    wrap: false,\n  },\n});\n"],"names":[],"mappings":";;;MAGa,YAAY,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE;AACtC,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC3B,YAAA,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC;AAC/B,YAAA,WAAW,EAAE,CAAC,CAAC,mBAAmB,CAAC;AACnC,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC3B,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC3B,YAAA,IAAI,EAAE,CAAC,CAAC,YAAY,CAAC;AACrB,YAAA,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC;AACvB,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC5B,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC;AACjB,YAAA,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC;AAClB,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,IAAI,EAAE,CAAC,CAAC,YAAY,CAAC;AACtB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,IAAI,EAAE,KAAK;AACZ,KAAA;AACF,CAAA;;"}
+{"version":3,"file":"chip-variants.js","sources":["../../../src/ui/Chip/chip-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport s from './chip.module.scss';\n\nexport const chipVariants = cva(s.chip, {\n  variants: {\n    theme: {\n      primary: s['chip--primary'],\n      secondary: s['chip--secondary'],\n      destructive: s['chip--destructive'],\n      warning: s['chip--warning'],\n      success: s['chip--success'],\n      info: s['chip--info'],\n      slate: s['chip--slate'],\n      inherit: s['chip--inherit'],\n    },\n    variant: {\n      soft: s['chip--soft'],\n      outline: s['chip--outline'],\n      solid: s['chip--solid'],\n    },\n    size: {\n      '2xs': s['chip--2xs'],\n      xs: s['chip--xs'],\n      sm: s['chip--sm'],\n      md: s['chip--md'],\n    },\n    shape: {\n      pill: undefined,\n      rounded: s['chip--rounded'],\n    },\n    dashed: { true: s['chip--dashed'] },\n    mono: { true: s['chip--mono'] },\n    uppercase: { true: s['chip--uppercase'] },\n    wrap: { true: s['chip--wrap'] },\n  },\n  defaultVariants: {\n    theme: 'primary',\n    variant: 'soft',\n    size: 'md',\n    shape: 'pill',\n    dashed: false,\n    mono: false,\n    uppercase: false,\n    wrap: false,\n  },\n});\n"],"names":[],"mappings":";;;MAGa,YAAY,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE;AACtC,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC3B,YAAA,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC;AAC/B,YAAA,WAAW,EAAE,CAAC,CAAC,mBAAmB,CAAC;AACnC,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC3B,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC3B,YAAA,IAAI,EAAE,CAAC,CAAC,YAAY,CAAC;AACrB,YAAA,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC;AACvB,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC5B,SAAA;AACD,QAAA,OAAO,EAAE;AACP,YAAA,IAAI,EAAE,CAAC,CAAC,YAAY,CAAC;AACrB,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC3B,YAAA,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC;AACxB,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,KAAK,EAAE,CAAC,CAAC,WAAW,CAAC;AACrB,YAAA,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC;AACjB,YAAA,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC;AACjB,YAAA,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC;AAClB,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,IAAI,EAAE,SAAS;AACf,YAAA,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC;AAC5B,SAAA;QACD,MAAM,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,cAAc,CAAC,EAAE;QACnC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,YAAY,CAAC,EAAE;QAC/B,SAAS,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAE;QACzC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,YAAY,CAAC,EAAE;AAChC,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,MAAM,EAAE,KAAK;AACb,QAAA,IAAI,EAAE,KAAK;AACX,QAAA,SAAS,EAAE,KAAK;AAChB,QAAA,IAAI,EAAE,KAAK;AACZ,KAAA;AACF,CAAA;;"}

package/dist/ui/Chip/chip.css

@@ -1,3 +1,4 @@
+@charset "UTF-8";
 /**
  * Size config. `icon-size` scales SVGs rendered as direct children to match
  * the chip's visual weight. `padding-with-icon` trims horizontal padding
@@ -22,6 +23,43 @@
 .chip-module_chip--wrap__YvZ3D {
   white-space: normal;
 }
+.chip-module_chip--mono__SMCPR {
+  font-family: var(--font-mono), monospace;
+  font-variant-numeric: tabular-nums;
+}
+.chip-module_chip--uppercase__bLI8t {
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+.chip-module_chip--rounded__epRJb {
+  border-radius: var(--radius-xs);
+}
+.chip-module_chip--dashed__trSp1 {
+  border-style: dashed;
+}
+.chip-module_chip--2xs__GJtZF {
+  font-size: 0.56rem;
+  padding: 0 0.25rem;
+}
+.chip-module_chip--2xs__GJtZF > svg {
+  height: 0.6rem;
+  width: 0.6rem;
+}
+.chip-module_chip--2xs__GJtZF:has(> svg) {
+  padding: 0 0.2rem;
+}
+.chip-module_chip--xs__Smd5u {
+  font-size: 0.66rem;
+  padding: 0.1rem 0.4rem;
+}
+.chip-module_chip--xs__Smd5u > svg {
+  height: 0.7rem;
+  width: 0.7rem;
+}
+.chip-module_chip--xs__Smd5u:has(> svg) {
+  padding: 0.1rem 0.32rem;
+}
 .chip-module_chip--sm___bJkU {
   font-size: 0.72rem;
   padding: 0.15rem 0.5rem;
@@ -44,12 +82,14 @@
 .chip-module_chip--md__N7LAU:has(> svg) {
   padding: 0.25rem 0.55rem;
 }
-.chip-module_chip__u4PJ9.chip-module_chip--inherit__HjU_P {
-  border-color: currentColor;
-  color: currentColor;
-}
-.chip-module_chip__u4PJ9.chip-module_chip--inherit__HjU_P:hover {
-  background-color: var(--themed-hover, var(--action-hover));
+.chip-module_chip__u4PJ9 {
+  /**
+   * Each theme resolves four roles. Every one is written as
+   * `var(--chip-color, <token>)`, so setting a single `--chip-color` on the
+   * element overrides the whole set — that is the escape hatch for a colour
+   * the theme scale does not have (a diet marker, a category hue), without
+   * needing a bespoke component.
+   */
 }
 .chip-module_chip__u4PJ9.chip-module_chip--primary__kBS6M {
   --themed-main: var(--primary-main);
@@ -62,12 +102,10 @@
   --themed-focus-visible: var(--primary-focus-visible);
   --themed-outlined-border: var(--primary-outlined-border);
   --themed-selected: var(--primary-selected);
-  background-color: color-mix(in srgb, var(--primary-hover) 20%, transparent);
-  border-color: var(--primary-outlined-border);
-  color: var(--primary-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--primary__kBS6M:hover {
-  background-color: color-mix(in srgb, var(--primary-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--primary-outlined-border));
+  --chip-fill: var(--chip-color, var(--primary-main));
+  --chip-wash: var(--chip-color, var(--primary-hover));
+  --chip-on-fill: var(--primary-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--secondary__eyfdz {
   --themed-main: var(--secondary-main);
@@ -80,12 +118,10 @@
   --themed-focus-visible: var(--secondary-focus-visible);
   --themed-outlined-border: var(--secondary-outlined-border);
   --themed-selected: var(--secondary-selected);
-  background-color: color-mix(in srgb, var(--secondary-hover) 20%, transparent);
-  border-color: var(--secondary-outlined-border);
-  color: var(--secondary-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--secondary__eyfdz:hover {
-  background-color: color-mix(in srgb, var(--secondary-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--secondary-outlined-border));
+  --chip-fill: var(--chip-color, var(--secondary-main));
+  --chip-wash: var(--chip-color, var(--secondary-hover));
+  --chip-on-fill: var(--secondary-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--destructive__80JrW {
   --themed-main: var(--destructive-main);
@@ -98,12 +134,10 @@
   --themed-focus-visible: var(--destructive-focus-visible);
   --themed-outlined-border: var(--destructive-outlined-border);
   --themed-selected: var(--destructive-selected);
-  background-color: color-mix(in srgb, var(--destructive-hover) 20%, transparent);
-  border-color: var(--destructive-outlined-border);
-  color: var(--destructive-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--destructive__80JrW:hover {
-  background-color: color-mix(in srgb, var(--destructive-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--destructive-outlined-border));
+  --chip-fill: var(--chip-color, var(--destructive-main));
+  --chip-wash: var(--chip-color, var(--destructive-hover));
+  --chip-on-fill: var(--destructive-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--warning__3oxvl {
   --themed-main: var(--warning-main);
@@ -116,12 +150,10 @@
   --themed-focus-visible: var(--warning-focus-visible);
   --themed-outlined-border: var(--warning-outlined-border);
   --themed-selected: var(--warning-selected);
-  background-color: color-mix(in srgb, var(--warning-hover) 20%, transparent);
-  border-color: var(--warning-outlined-border);
-  color: var(--warning-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--warning__3oxvl:hover {
-  background-color: color-mix(in srgb, var(--warning-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--warning-outlined-border));
+  --chip-fill: var(--chip-color, var(--warning-main));
+  --chip-wash: var(--chip-color, var(--warning-hover));
+  --chip-on-fill: var(--warning-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--success__VF1tZ {
   --themed-main: var(--success-main);
@@ -134,12 +166,10 @@
   --themed-focus-visible: var(--success-focus-visible);
   --themed-outlined-border: var(--success-outlined-border);
   --themed-selected: var(--success-selected);
-  background-color: color-mix(in srgb, var(--success-hover) 20%, transparent);
-  border-color: var(--success-outlined-border);
-  color: var(--success-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--success__VF1tZ:hover {
-  background-color: color-mix(in srgb, var(--success-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--success-outlined-border));
+  --chip-fill: var(--chip-color, var(--success-main));
+  --chip-wash: var(--chip-color, var(--success-hover));
+  --chip-on-fill: var(--success-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--info__Jgnsc {
   --themed-main: var(--info-main);
@@ -152,12 +182,10 @@
   --themed-focus-visible: var(--info-focus-visible);
   --themed-outlined-border: var(--info-outlined-border);
   --themed-selected: var(--info-selected);
-  background-color: color-mix(in srgb, var(--info-hover) 20%, transparent);
-  border-color: var(--info-outlined-border);
-  color: var(--info-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--info__Jgnsc:hover {
-  background-color: color-mix(in srgb, var(--info-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--info-outlined-border));
+  --chip-fill: var(--chip-color, var(--info-main));
+  --chip-wash: var(--chip-color, var(--info-hover));
+  --chip-on-fill: var(--info-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--slate__vmQ7R {
   --themed-main: var(--slate-main);
@@ -170,10 +198,32 @@
   --themed-focus-visible: var(--slate-focus-visible);
   --themed-outlined-border: var(--slate-outlined-border);
   --themed-selected: var(--slate-selected);
-  background-color: color-mix(in srgb, var(--slate-hover) 20%, transparent);
-  border-color: var(--slate-outlined-border);
-  color: var(--slate-outlined-border);
+  --chip-ink: var(--chip-color, var(--slate-outlined-border));
+  --chip-fill: var(--chip-color, var(--slate-main));
+  --chip-wash: var(--chip-color, var(--slate-hover));
+  --chip-on-fill: var(--slate-contrast);
 }
-.chip-module_chip__u4PJ9.chip-module_chip--slate__vmQ7R:hover {
-  background-color: color-mix(in srgb, var(--slate-hover) 40%, transparent);
+.chip-module_chip__u4PJ9.chip-module_chip--inherit__HjU_P {
+  --chip-ink: var(--chip-color, currentColor);
+  --chip-fill: var(--chip-color, currentColor);
+  --chip-wash: var(--chip-color, var(--themed-hover, var(--action-hover)));
+  --chip-on-fill: var(--themed-contrast, var(--background-default));
+}
+.chip-module_chip--soft__zYBtU {
+  background-color: color-mix(in srgb, var(--chip-wash) 20%, transparent);
+  border-color: var(--chip-ink);
+  color: var(--chip-ink);
+}
+.chip-module_chip--soft__zYBtU:hover {
+  background-color: color-mix(in srgb, var(--chip-wash) 40%, transparent);
+}
+.chip-module_chip--outline__TO-HF {
+  background-color: transparent;
+  border-color: color-mix(in srgb, var(--chip-ink) 55%, transparent);
+  color: var(--chip-ink);
+}
+.chip-module_chip--solid__F89cD {
+  background-color: var(--chip-fill);
+  border-color: var(--chip-fill);
+  color: var(--chip-on-fill);
 }

package/dist/ui/Chip/chip.d.ts

@@ -2,7 +2,21 @@ import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 import { chipVariants } from './chip-variants';
 export interface ChipProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof chipVariants> {
+    /**
+     * Any colour outside the theme scale — a category hue, a dietary marker.
+     * Overrides the whole set of colour roles the theme would otherwise supply,
+     * so one value is enough for every `variant`.
+     */
+    color?: string;
 }
+/**
+ * A small status marker.
+ *
+ * `variant` chooses how much weight it carries: `soft` (a tinted fill, the
+ * default) reads as ambient, `outline` recedes further, and `solid` is a claim.
+ * `dashed` marks the value as provisional — a guess rather than a reading —
+ * which is a distinction worth drawing without spending a second colour on it.
+ */
 declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLSpanElement>>;
 export { Chip };
 //# sourceMappingURL=chip.d.ts.map

package/dist/ui/Chip/chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../src/ui/Chip/chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,MAAM,WAAW,SACf,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,YAAY,CAAC,OAAO,YAAY,CAAC;CAAG;AAErF,QAAA,MAAM,IAAI,mFAaT,CAAC;AAGF,OAAO,EAAE,IAAI,EAAE,CAAC"}
+{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../src/ui/Chip/chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,MAAM,WAAW,SACf,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,YAAY,CAAC,OAAO,YAAY,CAAC;IAChF;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;GAOG;AACH,QAAA,MAAM,IAAI,mFAkCT,CAAC;AAGF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/ui/Chip/chip.js

@@ -4,8 +4,16 @@ import * as React from 'react';
 import { withAriaHiddenChildren } from '../../internal/with-aria-hidden-children.js';
 import { chipVariants } from './chip-variants.js';
 
-const Chip = React.forwardRef(({ className, size, theme, wrap, children, ...props }, ref) => {
-    return (jsx("span", { "data-slot": 'chip', ref: ref, className: cn(chipVariants({ size, theme, wrap }), className), ...props, children: withAriaHiddenChildren(children) }));
+/**
+ * A small status marker.
+ *
+ * `variant` chooses how much weight it carries: `soft` (a tinted fill, the
+ * default) reads as ambient, `outline` recedes further, and `solid` is a claim.
+ * `dashed` marks the value as provisional — a guess rather than a reading —
+ * which is a distinction worth drawing without spending a second colour on it.
+ */
+const Chip = React.forwardRef(({ className, size, theme, variant, shape, dashed, mono, uppercase, wrap, color, style, children, ...props }, ref) => {
+    return (jsx("span", { "data-slot": 'chip', ref: ref, className: cn(chipVariants({ size, theme, variant, shape, dashed, mono, uppercase, wrap }), className), style: color ? { ...style, '--chip-color': color } : style, ...props, children: withAriaHiddenChildren(children) }));
 });
 Chip.displayName = 'Chip';
 

package/dist/ui/Chip/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sources":["../../../src/ui/Chip/chip.tsx"],"sourcesContent":["import { type VariantProps } from 'class-variance-authority';\nimport cn from 'clsx';\nimport * as React from 'react';\nimport { withAriaHiddenChildren } from '../../internal/with-aria-hidden-children';\nimport { chipVariants } from './chip-variants';\n\nexport interface ChipProps\n  extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof chipVariants> {}\n\nconst Chip = React.forwardRef<HTMLSpanElement, ChipProps>(\n  ({ className, size, theme, wrap, children, ...props }, ref) => {\n    return (\n      <span\n        data-slot={'chip'}\n        ref={ref}\n        className={cn(chipVariants({ size, theme, wrap }), className)}\n        {...props}\n      >\n        {withAriaHiddenChildren(children)}\n      </span>\n    );\n  },\n);\nChip.displayName = 'Chip';\n\nexport { Chip };\n"],"names":["_jsx"],"mappings":";;;;;;AASA,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAC3B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC5D,IAAA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAA,WAAA,EACa,MAAM,EACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,EAAA,GACzD,KAAK,EAAA,QAAA,EAER,sBAAsB,CAAC,QAAQ,CAAC,EAAA,CAC5B;AAEX,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM;;"}
+{"version":3,"file":"chip.js","sources":["../../../src/ui/Chip/chip.tsx"],"sourcesContent":["import { type VariantProps } from 'class-variance-authority';\nimport cn from 'clsx';\nimport * as React from 'react';\nimport { withAriaHiddenChildren } from '../../internal/with-aria-hidden-children';\nimport { chipVariants } from './chip-variants';\n\nexport interface ChipProps\n  extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof chipVariants> {\n  /**\n   * Any colour outside the theme scale — a category hue, a dietary marker.\n   * Overrides the whole set of colour roles the theme would otherwise supply,\n   * so one value is enough for every `variant`.\n   */\n  color?: string;\n}\n\n/**\n * A small status marker.\n *\n * `variant` chooses how much weight it carries: `soft` (a tinted fill, the\n * default) reads as ambient, `outline` recedes further, and `solid` is a claim.\n * `dashed` marks the value as provisional — a guess rather than a reading —\n * which is a distinction worth drawing without spending a second colour on it.\n */\nconst Chip = React.forwardRef<HTMLSpanElement, ChipProps>(\n  (\n    {\n      className,\n      size,\n      theme,\n      variant,\n      shape,\n      dashed,\n      mono,\n      uppercase,\n      wrap,\n      color,\n      style,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <span\n        data-slot={'chip'}\n        ref={ref}\n        className={cn(\n          chipVariants({ size, theme, variant, shape, dashed, mono, uppercase, wrap }),\n          className,\n        )}\n        style={color ? ({ ...style, '--chip-color': color } as React.CSSProperties) : style}\n        {...props}\n      >\n        {withAriaHiddenChildren(children)}\n      </span>\n    );\n  },\n);\nChip.displayName = 'Chip';\n\nexport { Chip };\n"],"names":["_jsx"],"mappings":";;;;;;AAgBA;;;;;;;AAOG;AACH,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAC3B,CACE,EACE,SAAS,EACT,IAAI,EACJ,KAAK,EACL,OAAO,EACP,KAAK,EACL,MAAM,EACN,IAAI,EACJ,SAAS,EACT,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAA,WAAA,EACa,MAAM,EACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,YAAY,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAC5E,SAAS,CACV,EACD,KAAK,EAAE,KAAK,GAAI,EAAE,GAAG,KAAK,EAAE,cAAc,EAAE,KAAK,EAA0B,GAAG,KAAK,EAAA,GAC/E,KAAK,EAAA,QAAA,EAER,sBAAsB,CAAC,QAAQ,CAAC,EAAA,CAC5B;AAEX,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM;;"}

package/dist/ui/Chip/chip.module.scss.js

@@ -1,6 +1,6 @@
 import './chip.css';
 
-var s = {"chip":"chip-module_chip__u4PJ9","chip--wrap":"chip-module_chip--wrap__YvZ3D","chip--sm":"chip-module_chip--sm___bJkU","chip--md":"chip-module_chip--md__N7LAU","chip--inherit":"chip-module_chip--inherit__HjU_P","chip--primary":"chip-module_chip--primary__kBS6M","chip--secondary":"chip-module_chip--secondary__eyfdz","chip--destructive":"chip-module_chip--destructive__80JrW","chip--warning":"chip-module_chip--warning__3oxvl","chip--success":"chip-module_chip--success__VF1tZ","chip--info":"chip-module_chip--info__Jgnsc","chip--slate":"chip-module_chip--slate__vmQ7R"};
+var s = {"chip":"chip-module_chip__u4PJ9","chip--wrap":"chip-module_chip--wrap__YvZ3D","chip--mono":"chip-module_chip--mono__SMCPR","chip--uppercase":"chip-module_chip--uppercase__bLI8t","chip--rounded":"chip-module_chip--rounded__epRJb","chip--dashed":"chip-module_chip--dashed__trSp1","chip--2xs":"chip-module_chip--2xs__GJtZF","chip--xs":"chip-module_chip--xs__Smd5u","chip--sm":"chip-module_chip--sm___bJkU","chip--md":"chip-module_chip--md__N7LAU","chip--primary":"chip-module_chip--primary__kBS6M","chip--secondary":"chip-module_chip--secondary__eyfdz","chip--destructive":"chip-module_chip--destructive__80JrW","chip--warning":"chip-module_chip--warning__3oxvl","chip--success":"chip-module_chip--success__VF1tZ","chip--info":"chip-module_chip--info__Jgnsc","chip--slate":"chip-module_chip--slate__vmQ7R","chip--inherit":"chip-module_chip--inherit__HjU_P","chip--soft":"chip-module_chip--soft__zYBtU","chip--outline":"chip-module_chip--outline__TO-HF","chip--solid":"chip-module_chip--solid__F89cD"};
 
 export { s as default };
 //# sourceMappingURL=chip.module.scss.js.map

package/dist/ui/StatusDot/index.d.ts

@@ -0,0 +1,3 @@
+export * from './status-dot';
+export * from './status-dot-variants';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/StatusDot/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/StatusDot/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC"}

package/dist/ui/StatusDot/status-dot-variants.d.ts

@@ -0,0 +1,7 @@
+export declare const statusDotVariants: (props?: ({
+    theme?: "inherit" | "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+    glow?: boolean | null | undefined;
+    pulse?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//# sourceMappingURL=status-dot-variants.d.ts.map

package/dist/ui/StatusDot/status-dot-variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot-variants.d.ts","sourceRoot":"","sources":["../../../src/ui/StatusDot/status-dot-variants.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB;;;;;8EAqB5B,CAAC"}

package/dist/ui/StatusDot/status-dot-variants.js

@@ -0,0 +1,28 @@
+import { cva } from 'class-variance-authority';
+import s from './status-dot.module.scss.js';
+
+const statusDotVariants = cva(s['status-dot'], {
+    variants: {
+        theme: {
+            primary: s['status-dot--primary'],
+            secondary: s['status-dot--secondary'],
+            destructive: s['status-dot--destructive'],
+            warning: s['status-dot--warning'],
+            success: s['status-dot--success'],
+            info: s['status-dot--info'],
+            slate: s['status-dot--slate'],
+            inherit: s['status-dot--inherit'],
+        },
+        size: {
+            sm: s['status-dot--sm'],
+            md: s['status-dot--md'],
+            lg: s['status-dot--lg'],
+        },
+        glow: { true: s['status-dot--glow'] },
+        pulse: { true: s['status-dot--pulse'] },
+    },
+    defaultVariants: { theme: 'slate', size: 'md', glow: false, pulse: false },
+});
+
+export { statusDotVariants };
+//# sourceMappingURL=status-dot-variants.js.map

package/dist/ui/StatusDot/status-dot-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot-variants.js","sources":["../../../src/ui/StatusDot/status-dot-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport s from './status-dot.module.scss';\n\nexport const statusDotVariants = cva(s['status-dot'], {\n  variants: {\n    theme: {\n      primary: s['status-dot--primary'],\n      secondary: s['status-dot--secondary'],\n      destructive: s['status-dot--destructive'],\n      warning: s['status-dot--warning'],\n      success: s['status-dot--success'],\n      info: s['status-dot--info'],\n      slate: s['status-dot--slate'],\n      inherit: s['status-dot--inherit'],\n    },\n    size: {\n      sm: s['status-dot--sm'],\n      md: s['status-dot--md'],\n      lg: s['status-dot--lg'],\n    },\n    glow: { true: s['status-dot--glow'] },\n    pulse: { true: s['status-dot--pulse'] },\n  },\n  defaultVariants: { theme: 'slate', size: 'md', glow: false, pulse: false },\n});\n"],"names":[],"mappings":";;;AAGO,MAAM,iBAAiB,GAAG,GAAG,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE;AACpD,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AACjC,YAAA,SAAS,EAAE,CAAC,CAAC,uBAAuB,CAAC;AACrC,YAAA,WAAW,EAAE,CAAC,CAAC,yBAAyB,CAAC;AACzC,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AACjC,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AACjC,YAAA,IAAI,EAAE,CAAC,CAAC,kBAAkB,CAAC;AAC3B,YAAA,KAAK,EAAE,CAAC,CAAC,mBAAmB,CAAC;AAC7B,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AAClC,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC;AACvB,YAAA,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC;AACvB,YAAA,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC;AACxB,SAAA;QACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,kBAAkB,CAAC,EAAE;QACrC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,mBAAmB,CAAC,EAAE;AACxC,KAAA;AACD,IAAA,eAAe,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE;AAC3E,CAAA;;"}

package/dist/ui/StatusDot/status-dot.css

@@ -0,0 +1,61 @@
+.status-dot-module_status-dot__MoSd6 {
+  background-color: var(--dot-color);
+  border-radius: 50%;
+  display: inline-block;
+  flex-shrink: 0;
+  height: var(--dot-size);
+  width: var(--dot-size);
+}
+.status-dot-module_status-dot--primary__DoTcY {
+  --dot-color: var(--primary-main);
+}
+.status-dot-module_status-dot--secondary__pnRMx {
+  --dot-color: var(--secondary-main);
+}
+.status-dot-module_status-dot--destructive__z-jPU {
+  --dot-color: var(--destructive-main);
+}
+.status-dot-module_status-dot--warning__ZFtBS {
+  --dot-color: var(--warning-main);
+}
+.status-dot-module_status-dot--success__cYB5i {
+  --dot-color: var(--success-main);
+}
+.status-dot-module_status-dot--info__sAXNn {
+  --dot-color: var(--info-main);
+}
+.status-dot-module_status-dot--slate__bapda {
+  --dot-color: var(--slate-main);
+}
+.status-dot-module_status-dot--inherit__6o2O9 {
+  --dot-color: currentColor;
+}
+.status-dot-module_status-dot--sm__lPs5V {
+  --dot-size: 5px;
+}
+.status-dot-module_status-dot--md__CELtX {
+  --dot-size: 6px;
+}
+.status-dot-module_status-dot--lg__7M2z0 {
+  --dot-size: 9px;
+}
+.status-dot-module_status-dot--glow__Tbf-5 {
+  box-shadow: 0 0 8px var(--dot-color);
+}
+.status-dot-module_status-dot--pulse__Vw5aP {
+  animation: status-dot-module_status-dot-pulse__zH12Y 1.5s ease-in-out infinite;
+}
+
+@keyframes status-dot-module_status-dot-pulse__zH12Y {
+  0%, 100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.35;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  .status-dot-module_status-dot--pulse__Vw5aP {
+    animation: none;
+  }
+}

package/dist/ui/StatusDot/status-dot.d.ts

@@ -0,0 +1,23 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import { statusDotVariants } from './status-dot-variants';
+export interface StatusDotProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'>, VariantProps<typeof statusDotVariants> {
+    /** A colour outside the theme scale. */
+    color?: string;
+    /** Accessible name. Omit only when adjacent text already says the state. */
+    label?: string;
+}
+/**
+ * The dot that says what state a connection or process is in.
+ *
+ * Deliberately not a `Chip`: a chip is a bordered object that holds a word,
+ * where this is a single mark that usually sits *beside* one. Pairing it with
+ * text is the caller's job, which keeps the wording — and its translation —
+ * out of here.
+ *
+ * `glow` is for the state worth catching in peripheral vision (a save landing);
+ * `pulse` for one that is still in flight.
+ */
+declare const StatusDot: React.ForwardRefExoticComponent<StatusDotProps & React.RefAttributes<HTMLSpanElement>>;
+export { StatusDot };
+//# sourceMappingURL=status-dot.d.ts.map

package/dist/ui/StatusDot/status-dot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot.d.ts","sourceRoot":"","sources":["../../../src/ui/StatusDot/status-dot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE1D,MAAM,WAAW,cACf,SACE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,OAAO,CAAC,EACpD,YAAY,CAAC,OAAO,iBAAiB,CAAC;IACxC,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;GAUG;AACH,QAAA,MAAM,SAAS,wFAed,CAAC;AAGF,OAAO,EAAE,SAAS,EAAE,CAAC"}