@devalok/shilp-sutra 0.36.0 → 0.37.0-next.0

package/dist/ui/breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.js","names":[],"sources":["../../src/ui/breadcrumb.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@primitives/react-slot'\nimport { IconChevronRight, IconDots } from '@tabler/icons-react'\nimport * as React from 'react'\nimport { cn } from './lib/utils'\nimport { Icon } from './icon'\n\nconst Breadcrumb = React.forwardRef<\n  HTMLElement,\n  React.ComponentPropsWithoutRef<'nav'> & { separator?: React.ReactNode }\n>(({ ...props }, ref) => <nav ref={ref} aria-label=\"breadcrumb\" {...props} />)\nBreadcrumb.displayName = 'Breadcrumb'\n\nconst BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<'ol'>>(\n  ({ className, ...props }, ref) => (\n    <ol\n      ref={ref}\n      className={cn(\n        'flex flex-wrap items-center gap-ds-02b break-words text-ds-md text-surface-fg-muted sm:gap-ds-03',\n        className,\n      )}\n      {...props}\n    />\n  ),\n)\nBreadcrumbList.displayName = 'BreadcrumbList'\n\nconst BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n  ({ className, ...props }, ref) => (\n    <li ref={ref} className={cn('inline-flex items-center gap-ds-03', className)} {...props} />\n  ),\n)\nBreadcrumbItem.displayName = 'BreadcrumbItem'\n\nconst BreadcrumbLink = React.forwardRef<\n  HTMLAnchorElement,\n  React.ComponentPropsWithoutRef<'a'> & { asChild?: boolean }\n>(({ className, asChild = false, ...props }, ref) => {\n  const Comp = asChild ? Slot : 'a'\n\n  return (\n    <Comp\n      ref={ref}\n      className={cn(\n        'transition-colors duration-fast-01 ease-productive-standard hover:text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 rounded-ds-sm',\n        className,\n      )}\n      {...props}\n    />\n  )\n})\nBreadcrumbLink.displayName = 'BreadcrumbLink'\n\nconst BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n  ({ className, ...props }, ref) => (\n    <span\n      ref={ref}\n      aria-current=\"page\"\n      className={cn('font-medium text-surface-fg', className)}\n      {...props}\n    />\n  ),\n)\nBreadcrumbPage.displayName = 'BreadcrumbPage'\n\nconst BreadcrumbSeparator = ({ children, className, ...props }: React.ComponentProps<'li'>) => (\n  <li\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn('[&>svg]:h-ico-sm [&>svg]:w-ico-sm', className)}\n    {...props}\n  >\n    {children ?? <Icon icon={IconChevronRight} size=\"sm\" />}\n  </li>\n)\nBreadcrumbSeparator.displayName = 'BreadcrumbSeparator'\n\nconst BreadcrumbEllipsis = ({ className, ...props }: React.ComponentProps<'span'>) => (\n  <span\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn('flex h-ds-sm-plus w-ds-sm-plus items-center justify-center', className)}\n    {...props}\n  >\n    <Icon icon={IconDots} size=\"sm\" />\n    <span className=\"sr-only\">More</span>\n  </span>\n)\nBreadcrumbEllipsis.displayName = 'BreadcrumbEllipsis'\n\nexport type BreadcrumbProps = React.ComponentPropsWithoutRef<'nav'>\nexport type BreadcrumbLinkProps = React.ComponentPropsWithoutRef<'a'>\n\nexport {\n  Breadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n  BreadcrumbEllipsis,\n}\n"],"mappings":";;;;;;;;AAQA,IAAM,IAAa,EAAM,YAGtB,EAAE,GAAG,KAAS,MAAQ,kBAAC,OAAD;CAAU;CAAK,cAAW;CAAa,GAAI;CAAS,CAAA,CAAC;AAC9E,EAAW,cAAc;AAEzB,IAAM,IAAiB,EAAM,YAC1B,EAAE,cAAW,GAAG,KAAS,MACxB,kBAAC,MAAD;CACO;CACL,WAAW,EACT,oGACA,EACD;CACD,GAAI;CACJ,CAAA,CAEL;AACD,EAAe,cAAc;AAE7B,IAAM,IAAiB,EAAM,YAC1B,EAAE,cAAW,GAAG,KAAS,MACxB,kBAAC,MAAD;CAAS;CAAK,WAAW,EAAG,sCAAsC,EAAU;CAAE,GAAI;CAAS,CAAA,CAE9F;AACD,EAAe,cAAc;AAE7B,IAAM,IAAiB,EAAM,YAG1B,EAAE,cAAW,aAAU,IAAO,GAAG,KAAS,MAIzC,kBAHW,IAAU,IAAO,KAG5B;CACO;CACL,WAAW,EACT,iLACA,EACD;CACD,GAAI;CACJ,CAAA,CAEJ;AACF,EAAe,cAAc;AAE7B,IAAM,IAAiB,EAAM,YAC1B,EAAE,cAAW,GAAG,KAAS,MACxB,kBAAC,QAAD;CACO;CACL,gBAAa;CACb,WAAW,EAAG,+BAA+B,EAAU;CACvD,GAAI;CACJ,CAAA,CAEL;AACD,EAAe,cAAc;AAE7B,IAAM,KAAuB,EAAE,aAAU,cAAW,GAAG,QACrD,kBAAC,MAAD;CACE,MAAK;CACL,eAAY;CACZ,WAAW,EAAG,qCAAqC,EAAU;CAC7D,GAAI;WAEH,KAAY,kBAAC,GAAD;EAAM,MAAM;EAAkB,MAAK;EAAO,CAAA;CACpD,CAAA;AAEP,EAAoB,cAAc;AAElC,IAAM,KAAsB,EAAE,cAAW,GAAG,QAC1C,kBAAC,QAAD;CACE,MAAK;CACL,eAAY;CACZ,WAAW,EAAG,8DAA8D,EAAU;CACtF,GAAI;WAJN,CAME,kBAAC,GAAD;EAAM,MAAM;EAAU,MAAK;EAAO,CAAA,EAClC,kBAAC,QAAD;EAAM,WAAU;YAAU;EAAW,CAAA,CAChC;;AAET,EAAmB,cAAc"}
+{"version":3,"file":"breadcrumb.js","names":[],"sources":["../../src/ui/breadcrumb.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@primitives/react-slot'\nimport { IconChevronRight, IconDots } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { cn } from './lib/utils'\n\nconst Breadcrumb = React.forwardRef<\n  HTMLElement,\n  React.ComponentPropsWithoutRef<'nav'> & { separator?: React.ReactNode }\n>(({ ...props }, ref) => <nav ref={ref} aria-label=\"breadcrumb\" {...props} />)\nBreadcrumb.displayName = 'Breadcrumb'\n\nconst BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<'ol'>>(\n  ({ className, ...props }, ref) => (\n    <ol\n      ref={ref}\n      className={cn(\n        'flex flex-wrap items-center gap-ds-02b break-words text-ds-md text-surface-fg-muted sm:gap-ds-03',\n        className,\n      )}\n      {...props}\n    />\n  ),\n)\nBreadcrumbList.displayName = 'BreadcrumbList'\n\nconst BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n  ({ className, ...props }, ref) => (\n    <li ref={ref} className={cn('inline-flex items-center gap-ds-03', className)} {...props} />\n  ),\n)\nBreadcrumbItem.displayName = 'BreadcrumbItem'\n\nconst BreadcrumbLink = React.forwardRef<\n  HTMLAnchorElement,\n  React.ComponentPropsWithoutRef<'a'> & { asChild?: boolean }\n>(({ className, asChild = false, ...props }, ref) => {\n  const Comp = asChild ? Slot : 'a'\n\n  return (\n    <Comp\n      ref={ref}\n      className={cn(\n        'transition-colors duration-fast-01 ease-productive-standard hover:text-surface-fg focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 rounded-ds-sm',\n        className,\n      )}\n      {...props}\n    />\n  )\n})\nBreadcrumbLink.displayName = 'BreadcrumbLink'\n\nconst BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n  ({ className, ...props }, ref) => (\n    <span\n      ref={ref}\n      aria-current=\"page\"\n      className={cn('font-medium text-surface-fg', className)}\n      {...props}\n    />\n  ),\n)\nBreadcrumbPage.displayName = 'BreadcrumbPage'\n\nconst BreadcrumbSeparator = ({ children, className, ...props }: React.ComponentProps<'li'>) => (\n  <li\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn('[&>svg]:h-ico-sm [&>svg]:w-ico-sm', className)}\n    {...props}\n  >\n    {children ?? <Icon icon={IconChevronRight} size=\"sm\" />}\n  </li>\n)\nBreadcrumbSeparator.displayName = 'BreadcrumbSeparator'\n\nconst BreadcrumbEllipsis = ({ className, ...props }: React.ComponentProps<'span'>) => (\n  <span\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn('flex h-ds-sm-plus w-ds-sm-plus items-center justify-center', className)}\n    {...props}\n  >\n    <Icon icon={IconDots} size=\"sm\" />\n    <span className=\"sr-only\">More</span>\n  </span>\n)\nBreadcrumbEllipsis.displayName = 'BreadcrumbEllipsis'\n\nexport type BreadcrumbProps = React.ComponentPropsWithoutRef<'nav'>\nexport type BreadcrumbLinkProps = React.ComponentPropsWithoutRef<'a'>\n\nexport {\n  Breadcrumb,\n  BreadcrumbEllipsis,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n}\n"],"mappings":";;;;;;;;AASA,IAAM,IAAa,EAAM,YAGtB,EAAE,GAAG,KAAS,MAAQ,kBAAC,OAAD;CAAU;CAAK,cAAW;CAAa,GAAI;CAAS,CAAA,CAAC;AAC9E,EAAW,cAAc;AAEzB,IAAM,IAAiB,EAAM,YAC1B,EAAE,cAAW,GAAG,KAAS,MACxB,kBAAC,MAAD;CACO;CACL,WAAW,EACT,oGACA,EACD;CACD,GAAI;CACJ,CAAA,CAEL;AACD,EAAe,cAAc;AAE7B,IAAM,IAAiB,EAAM,YAC1B,EAAE,cAAW,GAAG,KAAS,MACxB,kBAAC,MAAD;CAAS;CAAK,WAAW,EAAG,sCAAsC,EAAU;CAAE,GAAI;CAAS,CAAA,CAE9F;AACD,EAAe,cAAc;AAE7B,IAAM,IAAiB,EAAM,YAG1B,EAAE,cAAW,aAAU,IAAO,GAAG,KAAS,MAIzC,kBAHW,IAAU,IAAO,KAG5B;CACO;CACL,WAAW,EACT,iLACA,EACD;CACD,GAAI;CACJ,CAAA,CAEJ;AACF,EAAe,cAAc;AAE7B,IAAM,IAAiB,EAAM,YAC1B,EAAE,cAAW,GAAG,KAAS,MACxB,kBAAC,QAAD;CACO;CACL,gBAAa;CACb,WAAW,EAAG,+BAA+B,EAAU;CACvD,GAAI;CACJ,CAAA,CAEL;AACD,EAAe,cAAc;AAE7B,IAAM,KAAuB,EAAE,aAAU,cAAW,GAAG,QACrD,kBAAC,MAAD;CACE,MAAK;CACL,eAAY;CACZ,WAAW,EAAG,qCAAqC,EAAU;CAC7D,GAAI;WAEH,KAAY,kBAAC,GAAD;EAAM,MAAM;EAAkB,MAAK;EAAO,CAAA;CACpD,CAAA;AAEP,EAAoB,cAAc;AAElC,IAAM,KAAsB,EAAE,cAAW,GAAG,QAC1C,kBAAC,QAAD;CACE,MAAK;CACL,eAAY;CACZ,WAAW,EAAG,8DAA8D,EAAU;CACtF,GAAI;WAJN,CAME,kBAAC,GAAD;EAAM,MAAM;EAAU,MAAK;EAAO,CAAA,EAClC,kBAAC,QAAD;EAAM,WAAU;YAAU;EAAW,CAAA,CAChC;;AAET,EAAmB,cAAc"}

package/dist/ui/button-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.d.ts","sourceRoot":"","sources":["../../src/ui/button-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAI3C,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAA;AAEtE,UAAU,uBAAuB;IAC/B,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAChC,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAA;IAC9B,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAGD,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,mBAAmB,CAAA;CAC9B;AAGD,QAAA,MAAM,sBAAsB,8CAA2D,CAAA;AAEvF,wBAAgB,cAAc,4BAE7B;AAED,wBAAgB,kBAAkB,kCAEjC;AAID;;;;GAIG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,mBAAmB,EAC7B,WAAW,EAAE,YAAY,GAAG,UAAU,GACrC,KAAK,CAAC,aAAa,GAAG,SAAS,CAsBjC;AAID,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC3F,2EAA2E;IAC3E,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAChC,yEAAyE;IACzE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAA;IAC9B,yEAAyE;IACzE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,wEAAwE;IACxE,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8CAA8C;IAC9C,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,oFAAoF;IACpF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAyBD,QAAA,MAAM,WAAW,yFA6DhB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"button-group.d.ts","sourceRoot":"","sources":["../../src/ui/button-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAK3C,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAA;AAEtE,UAAU,uBAAuB;IAC/B,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAChC,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAA;IAC9B,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAGD,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,mBAAmB,CAAA;CAC9B;AAGD,QAAA,MAAM,sBAAsB,8CAA2D,CAAA;AAEvF,wBAAgB,cAAc,4BAE7B;AAED,wBAAgB,kBAAkB,kCAEjC;AAID;;;;GAIG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,mBAAmB,EAC7B,WAAW,EAAE,YAAY,GAAG,UAAU,GACrC,KAAK,CAAC,aAAa,GAAG,SAAS,CAsBjC;AAID,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC3F,2EAA2E;IAC3E,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAChC,yEAAyE;IACzE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAA;IAC9B,yEAAyE;IACzE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC5B,wEAAwE;IACxE,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8CAA8C;IAC9C,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,oFAAoF;IACpF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAyBD,QAAA,MAAM,WAAW,yFA6DhB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/ui/button-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.js","names":[],"sources":["../../src/ui/button-group.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cn } from './lib/utils'\nimport type { ButtonProps } from './button'\n\n// ── Context ─────────────────────────────────────────────────────\n\nexport type ButtonGroupPosition = 'first' | 'middle' | 'last' | 'only'\n\ninterface ButtonGroupContextValue {\n  variant?: ButtonProps['variant']\n  color?: ButtonProps['color']\n  weight?: ButtonProps['weight']\n  shape?: ButtonProps['shape']\n  size?: ButtonProps['size']\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  attached?: boolean\n  /** Internal: signals Button children to stretch to fill available width */\n  _stretch?: boolean\n}\n\n// Separate context for position (changes per child) vs group settings (same for all)\ninterface ButtonGroupItemContext {\n  position: ButtonGroupPosition\n}\n\nconst ButtonGroupContext = React.createContext<ButtonGroupContextValue>({})\nconst ButtonGroupItemContext = React.createContext<ButtonGroupItemContext | null>(null)\n\nexport function useButtonGroup() {\n  return React.useContext(ButtonGroupContext)\n}\n\nexport function useButtonGroupItem() {\n  return React.useContext(ButtonGroupItemContext)\n}\n\n// ── Radius helper (consumed by Button internally) ───────────────\n\n/**\n * Returns inline style for border-radius AND border-collapse based on position\n * in an attached ButtonGroup. Inner borders are removed (not overlapped) to\n * guarantee consistent 1px borders regardless of wrapper nesting.\n */\nexport function getGroupPositionStyle(\n  position: ButtonGroupPosition,\n  orientation: 'horizontal' | 'vertical',\n): React.CSSProperties | undefined {\n  if (position === 'only') return undefined\n\n  if (orientation === 'horizontal') {\n    switch (position) {\n      case 'first':\n        return { borderTopRightRadius: 0, borderBottomRightRadius: 0, borderRightWidth: 0 }\n      case 'middle':\n        return { borderRadius: 0, borderRightWidth: 0 }\n      case 'last':\n        return { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 }\n    }\n  } else {\n    switch (position) {\n      case 'first':\n        return { borderBottomLeftRadius: 0, borderBottomRightRadius: 0, borderBottomWidth: 0 }\n      case 'middle':\n        return { borderRadius: 0, borderBottomWidth: 0 }\n      case 'last':\n        return { borderTopLeftRadius: 0, borderTopRightRadius: 0 }\n    }\n  }\n}\n\n// ── Props ───────────────────────────────────────────────────────\n\nexport interface ButtonGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'> {\n  /** Shared variant applied to all child Buttons (children can override). */\n  variant?: ButtonProps['variant']\n  /** Shared color applied to all child Buttons (children can override). */\n  color?: ButtonProps['color']\n  /** Shared weight applied to all child Buttons (children can override). */\n  weight?: ButtonProps['weight']\n  /** Shared shape applied to all child Buttons (children can override). */\n  shape?: ButtonProps['shape']\n  /** Shared size applied to all child Buttons (children can override). */\n  size?: ButtonProps['size']\n  /** Disable all child Buttons. */\n  disabled?: boolean\n  /** Layout direction. @default 'horizontal' */\n  orientation?: 'horizontal' | 'vertical'\n  /** Whether buttons are visually attached (merged) or spaced apart. @default true */\n  attached?: boolean\n  /** Stretch to full width of parent container. */\n  fullWidth?: boolean\n}\n\n// ── Divider colors (for non-outline variants that lack visible borders) ──\n\nfunction getDividerColor(variant?: string, color?: string): string {\n  if (variant === 'solid') {\n    const map: Record<string, string> = {\n      accent: 'bg-accent-11/20', error: 'bg-error-11/20', success: 'bg-success-11/20',\n      warning: 'bg-warning-11/20', neutral: 'bg-neutral-8/30',\n    }\n    return map[color ?? 'accent'] ?? map.accent\n  }\n  if (variant === 'soft') {\n    const map: Record<string, string> = {\n      accent: 'bg-accent-5', error: 'bg-error-5', success: 'bg-success-5',\n      warning: 'bg-warning-5', neutral: 'bg-neutral-4',\n    }\n    return map[color ?? 'accent'] ?? map.accent\n  }\n  // ghost, link, etc.\n  return 'bg-surface-border'\n}\n\n// ── Component ───────────────────────────────────────────────────\n\nconst ButtonGroup = React.forwardRef<HTMLDivElement, ButtonGroupProps>(\n  ({ className, variant, color, weight, shape, size, disabled, orientation = 'horizontal', attached = true, fullWidth, children, ...props }, ref) => {\n    const shouldStretch = fullWidth || orientation === 'vertical'\n    const groupValue = React.useMemo(\n      () => ({ variant, color, weight, shape, size, disabled, orientation, attached, _stretch: shouldStretch }),\n      [variant, color, weight, shape, size, disabled, orientation, attached, shouldStretch],\n    )\n\n    const validChildren = React.Children.toArray(children).filter(React.isValidElement)\n    const total = validChildren.length\n\n    function getPosition(index: number): ButtonGroupPosition {\n      if (total === 1) return 'only'\n      if (index === 0) return 'first'\n      if (index === total - 1) return 'last'\n      return 'middle'\n    }\n\n    return (\n      <ButtonGroupContext.Provider value={groupValue}>\n        <div\n          ref={ref}\n          role=\"group\"\n          className={cn(\n            'inline-flex',\n            fullWidth && 'w-full',\n            fullWidth && orientation === 'horizontal' && '[&>*]:flex-1',\n            orientation === 'horizontal' ? 'flex-row' : 'flex-col items-stretch',\n            !attached && 'gap-ds-02',\n            // Focus isolation — lift focused/hovered button above siblings\n            '[&>*:focus-within]:z-10 [&>*:hover]:z-10',\n            className,\n          )}\n          {...props}\n        >\n          {attached\n            ? validChildren.map((child, i) => {\n                const needsDivider = i > 0 && variant !== 'outline'\n                return (\n                  <React.Fragment key={i}>\n                    {needsDivider && (\n                      <div\n                        aria-hidden\n                        className={cn(\n                          'shrink-0 self-stretch',\n                          orientation === 'horizontal' ? 'w-px' : 'h-px',\n                          getDividerColor(variant ?? undefined, color ?? undefined),\n                        )}\n                      />\n                    )}\n                    <ButtonGroupItemContext.Provider value={{ position: getPosition(i) }}>\n                      {child}\n                    </ButtonGroupItemContext.Provider>\n                  </React.Fragment>\n                )\n              })\n            : children}\n        </div>\n      </ButtonGroupContext.Provider>\n    )\n  },\n)\nButtonGroup.displayName = 'ButtonGroup'\n\nexport { ButtonGroup }\n"],"mappings":";;;;;AA4BA,IAAM,IAAqB,EAAM,cAAuC,EAAE,CAAC,EACrE,IAAyB,EAAM,cAA6C,KAAK;AAEvF,SAAgB,IAAiB;AAC/B,QAAO,EAAM,WAAW,EAAmB;;AAG7C,SAAgB,IAAqB;AACnC,QAAO,EAAM,WAAW,EAAuB;;AAUjD,SAAgB,EACd,GACA,GACiC;AAC7B,WAAa,OAEjB,KAAI,MAAgB,aAClB,SAAQ,GAAR;EACE,KAAK,QACH,QAAO;GAAE,sBAAsB;GAAG,yBAAyB;GAAG,kBAAkB;GAAG;EACrF,KAAK,SACH,QAAO;GAAE,cAAc;GAAG,kBAAkB;GAAG;EACjD,KAAK,OACH,QAAO;GAAE,qBAAqB;GAAG,wBAAwB;GAAG;;KAGhE,SAAQ,GAAR;EACE,KAAK,QACH,QAAO;GAAE,wBAAwB;GAAG,yBAAyB;GAAG,mBAAmB;GAAG;EACxF,KAAK,SACH,QAAO;GAAE,cAAc;GAAG,mBAAmB;GAAG;EAClD,KAAK,OACH,QAAO;GAAE,qBAAqB;GAAG,sBAAsB;GAAG;;;AA8BlE,SAAS,EAAgB,GAAkB,GAAwB;AACjE,KAAI,MAAY,SAAS;EACvB,IAAM,IAA8B;GAClC,QAAQ;GAAmB,OAAO;GAAkB,SAAS;GAC7D,SAAS;GAAoB,SAAS;GACvC;AACD,SAAO,EAAI,KAAS,aAAa,EAAI;;AAEvC,KAAI,MAAY,QAAQ;EACtB,IAAM,IAA8B;GAClC,QAAQ;GAAe,OAAO;GAAc,SAAS;GACrD,SAAS;GAAgB,SAAS;GACnC;AACD,SAAO,EAAI,KAAS,aAAa,EAAI;;AAGvC,QAAO;;AAKT,IAAM,IAAc,EAAM,YACvB,EAAE,cAAW,YAAS,UAAO,WAAQ,UAAO,SAAM,aAAU,iBAAc,cAAc,cAAW,IAAM,cAAW,aAAU,GAAG,KAAS,MAAQ;CACjJ,IAAM,IAAgB,KAAa,MAAgB,YAC7C,IAAa,EAAM,eAChB;EAAE;EAAS;EAAO;EAAQ;EAAO;EAAM;EAAU;EAAa;EAAU,UAAU;EAAe,GACxG;EAAC;EAAS;EAAO;EAAQ;EAAO;EAAM;EAAU;EAAa;EAAU;EAAc,CACtF,EAEK,IAAgB,EAAM,SAAS,QAAQ,EAAS,CAAC,OAAO,EAAM,eAAe,EAC7E,IAAQ,EAAc;CAE5B,SAAS,EAAY,GAAoC;AAIvD,SAHI,MAAU,IAAU,SACpB,MAAU,IAAU,UACpB,MAAU,IAAQ,IAAU,SACzB;;AAGT,QACE,kBAAC,EAAmB,UAApB;EAA6B,OAAO;YAClC,kBAAC,OAAD;GACO;GACL,MAAK;GACL,WAAW,EACT,eACA,KAAa,UACb,KAAa,MAAgB,gBAAgB,gBAC7C,MAAgB,eAAe,aAAa,0BAC5C,CAAC,KAAY,aAEb,4CACA,EACD;GACD,GAAI;aAEH,IACG,EAAc,KAAK,GAAO,MAAM;IAC9B,IAAM,IAAe,IAAI,KAAK,MAAY;AAC1C,WACE,kBAAC,EAAM,UAAP,EAAA,UAAA,CACG,KACC,kBAAC,OAAD;KACE,eAAA;KACA,WAAW,EACT,yBACA,MAAgB,eAAe,SAAS,QACxC,EAAgB,KAAW,KAAA,GAAW,KAAS,KAAA,EAAU,CAC1D;KACD,CAAA,EAEJ,kBAAC,EAAuB,UAAxB;KAAiC,OAAO,EAAE,UAAU,EAAY,EAAE,EAAE;eACjE;KAC+B,CAAA,CACnB,EAAA,EAdI,EAcJ;KAEnB,GACF;GACA,CAAA;EACsB,CAAA;EAGnC;AACD,EAAY,cAAc"}
+{"version":3,"file":"button-group.js","names":[],"sources":["../../src/ui/button-group.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\n\nimport type { ButtonProps } from './button'\nimport { cn } from './lib/utils'\n\n// ── Context ─────────────────────────────────────────────────────\n\nexport type ButtonGroupPosition = 'first' | 'middle' | 'last' | 'only'\n\ninterface ButtonGroupContextValue {\n  variant?: ButtonProps['variant']\n  color?: ButtonProps['color']\n  weight?: ButtonProps['weight']\n  shape?: ButtonProps['shape']\n  size?: ButtonProps['size']\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  attached?: boolean\n  /** Internal: signals Button children to stretch to fill available width */\n  _stretch?: boolean\n}\n\n// Separate context for position (changes per child) vs group settings (same for all)\ninterface ButtonGroupItemContext {\n  position: ButtonGroupPosition\n}\n\nconst ButtonGroupContext = React.createContext<ButtonGroupContextValue>({})\nconst ButtonGroupItemContext = React.createContext<ButtonGroupItemContext | null>(null)\n\nexport function useButtonGroup() {\n  return React.useContext(ButtonGroupContext)\n}\n\nexport function useButtonGroupItem() {\n  return React.useContext(ButtonGroupItemContext)\n}\n\n// ── Radius helper (consumed by Button internally) ───────────────\n\n/**\n * Returns inline style for border-radius AND border-collapse based on position\n * in an attached ButtonGroup. Inner borders are removed (not overlapped) to\n * guarantee consistent 1px borders regardless of wrapper nesting.\n */\nexport function getGroupPositionStyle(\n  position: ButtonGroupPosition,\n  orientation: 'horizontal' | 'vertical',\n): React.CSSProperties | undefined {\n  if (position === 'only') return undefined\n\n  if (orientation === 'horizontal') {\n    switch (position) {\n      case 'first':\n        return { borderTopRightRadius: 0, borderBottomRightRadius: 0, borderRightWidth: 0 }\n      case 'middle':\n        return { borderRadius: 0, borderRightWidth: 0 }\n      case 'last':\n        return { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 }\n    }\n  } else {\n    switch (position) {\n      case 'first':\n        return { borderBottomLeftRadius: 0, borderBottomRightRadius: 0, borderBottomWidth: 0 }\n      case 'middle':\n        return { borderRadius: 0, borderBottomWidth: 0 }\n      case 'last':\n        return { borderTopLeftRadius: 0, borderTopRightRadius: 0 }\n    }\n  }\n}\n\n// ── Props ───────────────────────────────────────────────────────\n\nexport interface ButtonGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'> {\n  /** Shared variant applied to all child Buttons (children can override). */\n  variant?: ButtonProps['variant']\n  /** Shared color applied to all child Buttons (children can override). */\n  color?: ButtonProps['color']\n  /** Shared weight applied to all child Buttons (children can override). */\n  weight?: ButtonProps['weight']\n  /** Shared shape applied to all child Buttons (children can override). */\n  shape?: ButtonProps['shape']\n  /** Shared size applied to all child Buttons (children can override). */\n  size?: ButtonProps['size']\n  /** Disable all child Buttons. */\n  disabled?: boolean\n  /** Layout direction. @default 'horizontal' */\n  orientation?: 'horizontal' | 'vertical'\n  /** Whether buttons are visually attached (merged) or spaced apart. @default true */\n  attached?: boolean\n  /** Stretch to full width of parent container. */\n  fullWidth?: boolean\n}\n\n// ── Divider colors (for non-outline variants that lack visible borders) ──\n\nfunction getDividerColor(variant?: string, color?: string): string {\n  if (variant === 'solid') {\n    const map: Record<string, string> = {\n      accent: 'bg-accent-11/20', error: 'bg-error-11/20', success: 'bg-success-11/20',\n      warning: 'bg-warning-11/20', neutral: 'bg-neutral-8/30',\n    }\n    return map[color ?? 'accent'] ?? map.accent\n  }\n  if (variant === 'soft') {\n    const map: Record<string, string> = {\n      accent: 'bg-accent-5', error: 'bg-error-5', success: 'bg-success-5',\n      warning: 'bg-warning-5', neutral: 'bg-neutral-4',\n    }\n    return map[color ?? 'accent'] ?? map.accent\n  }\n  // ghost, link, etc.\n  return 'bg-surface-border'\n}\n\n// ── Component ───────────────────────────────────────────────────\n\nconst ButtonGroup = React.forwardRef<HTMLDivElement, ButtonGroupProps>(\n  ({ className, variant, color, weight, shape, size, disabled, orientation = 'horizontal', attached = true, fullWidth, children, ...props }, ref) => {\n    const shouldStretch = fullWidth || orientation === 'vertical'\n    const groupValue = React.useMemo(\n      () => ({ variant, color, weight, shape, size, disabled, orientation, attached, _stretch: shouldStretch }),\n      [variant, color, weight, shape, size, disabled, orientation, attached, shouldStretch],\n    )\n\n    const validChildren = React.Children.toArray(children).filter(React.isValidElement)\n    const total = validChildren.length\n\n    function getPosition(index: number): ButtonGroupPosition {\n      if (total === 1) return 'only'\n      if (index === 0) return 'first'\n      if (index === total - 1) return 'last'\n      return 'middle'\n    }\n\n    return (\n      <ButtonGroupContext.Provider value={groupValue}>\n        <div\n          ref={ref}\n          role=\"group\"\n          className={cn(\n            'inline-flex',\n            fullWidth && 'w-full',\n            fullWidth && orientation === 'horizontal' && '[&>*]:flex-1',\n            orientation === 'horizontal' ? 'flex-row' : 'flex-col items-stretch',\n            !attached && 'gap-ds-02',\n            // Focus isolation — lift focused/hovered button above siblings\n            '[&>*:focus-within]:z-10 [&>*:hover]:z-10',\n            className,\n          )}\n          {...props}\n        >\n          {attached\n            ? validChildren.map((child, i) => {\n                const needsDivider = i > 0 && variant !== 'outline'\n                return (\n                  <React.Fragment key={i}>\n                    {needsDivider && (\n                      <div\n                        aria-hidden\n                        className={cn(\n                          'shrink-0 self-stretch',\n                          orientation === 'horizontal' ? 'w-px' : 'h-px',\n                          getDividerColor(variant ?? undefined, color ?? undefined),\n                        )}\n                      />\n                    )}\n                    <ButtonGroupItemContext.Provider value={{ position: getPosition(i) }}>\n                      {child}\n                    </ButtonGroupItemContext.Provider>\n                  </React.Fragment>\n                )\n              })\n            : children}\n        </div>\n      </ButtonGroupContext.Provider>\n    )\n  },\n)\nButtonGroup.displayName = 'ButtonGroup'\n\nexport { ButtonGroup }\n"],"mappings":";;;;;AA6BA,IAAM,IAAqB,EAAM,cAAuC,EAAE,CAAC,EACrE,IAAyB,EAAM,cAA6C,KAAK;AAEvF,SAAgB,IAAiB;AAC/B,QAAO,EAAM,WAAW,EAAmB;;AAG7C,SAAgB,IAAqB;AACnC,QAAO,EAAM,WAAW,EAAuB;;AAUjD,SAAgB,EACd,GACA,GACiC;AAC7B,WAAa,OAEjB,KAAI,MAAgB,aAClB,SAAQ,GAAR;EACE,KAAK,QACH,QAAO;GAAE,sBAAsB;GAAG,yBAAyB;GAAG,kBAAkB;GAAG;EACrF,KAAK,SACH,QAAO;GAAE,cAAc;GAAG,kBAAkB;GAAG;EACjD,KAAK,OACH,QAAO;GAAE,qBAAqB;GAAG,wBAAwB;GAAG;;KAGhE,SAAQ,GAAR;EACE,KAAK,QACH,QAAO;GAAE,wBAAwB;GAAG,yBAAyB;GAAG,mBAAmB;GAAG;EACxF,KAAK,SACH,QAAO;GAAE,cAAc;GAAG,mBAAmB;GAAG;EAClD,KAAK,OACH,QAAO;GAAE,qBAAqB;GAAG,sBAAsB;GAAG;;;AA8BlE,SAAS,EAAgB,GAAkB,GAAwB;AACjE,KAAI,MAAY,SAAS;EACvB,IAAM,IAA8B;GAClC,QAAQ;GAAmB,OAAO;GAAkB,SAAS;GAC7D,SAAS;GAAoB,SAAS;GACvC;AACD,SAAO,EAAI,KAAS,aAAa,EAAI;;AAEvC,KAAI,MAAY,QAAQ;EACtB,IAAM,IAA8B;GAClC,QAAQ;GAAe,OAAO;GAAc,SAAS;GACrD,SAAS;GAAgB,SAAS;GACnC;AACD,SAAO,EAAI,KAAS,aAAa,EAAI;;AAGvC,QAAO;;AAKT,IAAM,IAAc,EAAM,YACvB,EAAE,cAAW,YAAS,UAAO,WAAQ,UAAO,SAAM,aAAU,iBAAc,cAAc,cAAW,IAAM,cAAW,aAAU,GAAG,KAAS,MAAQ;CACjJ,IAAM,IAAgB,KAAa,MAAgB,YAC7C,IAAa,EAAM,eAChB;EAAE;EAAS;EAAO;EAAQ;EAAO;EAAM;EAAU;EAAa;EAAU,UAAU;EAAe,GACxG;EAAC;EAAS;EAAO;EAAQ;EAAO;EAAM;EAAU;EAAa;EAAU;EAAc,CACtF,EAEK,IAAgB,EAAM,SAAS,QAAQ,EAAS,CAAC,OAAO,EAAM,eAAe,EAC7E,IAAQ,EAAc;CAE5B,SAAS,EAAY,GAAoC;AAIvD,SAHI,MAAU,IAAU,SACpB,MAAU,IAAU,UACpB,MAAU,IAAQ,IAAU,SACzB;;AAGT,QACE,kBAAC,EAAmB,UAApB;EAA6B,OAAO;YAClC,kBAAC,OAAD;GACO;GACL,MAAK;GACL,WAAW,EACT,eACA,KAAa,UACb,KAAa,MAAgB,gBAAgB,gBAC7C,MAAgB,eAAe,aAAa,0BAC5C,CAAC,KAAY,aAEb,4CACA,EACD;GACD,GAAI;aAEH,IACG,EAAc,KAAK,GAAO,MAAM;IAC9B,IAAM,IAAe,IAAI,KAAK,MAAY;AAC1C,WACE,kBAAC,EAAM,UAAP,EAAA,UAAA,CACG,KACC,kBAAC,OAAD;KACE,eAAA;KACA,WAAW,EACT,yBACA,MAAgB,eAAe,SAAS,QACxC,EAAgB,KAAW,KAAA,GAAW,KAAS,KAAA,EAAU,CAC1D;KACD,CAAA,EAEJ,kBAAC,EAAuB,UAAxB;KAAiC,OAAO,EAAE,UAAU,EAAY,EAAE,EAAE;eACjE;KAC+B,CAAA,CACnB,EAAA,EAdI,EAcJ;KAEnB,GACF;GACA,CAAA;EACsB,CAAA;EAGnC;AACD,EAAY,cAAc"}

package/dist/ui/button-processing.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-processing.d.ts","sourceRoot":"","sources":["../../src/ui/button-processing.tsx"],"names":[],"mappings":"AAQA,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;AAE9D,UAAU,sBAAsB;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,KAAK,EAAE,eAAe,CAAA;IACtB,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAA;CACd;AAwBD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,sBAAsB,2CA0GjF"}
+{"version":3,"file":"button-processing.d.ts","sourceRoot":"","sources":["../../src/ui/button-processing.tsx"],"names":[],"mappings":"AASA,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;AAE9D,UAAU,sBAAsB;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,KAAK,EAAE,eAAe,CAAA;IACtB,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAA;CACd;AAwBD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,sBAAsB,2CA0GjF"}

package/dist/ui/button-processing.js

@@ -1,8 +1,8 @@
 "use client";
-import { a as e, c as t } from "../_chunks/framer.js";
-import { durations as n } from "./lib/motion.js";
-import * as r from "react";
-import { jsx as i } from "react/jsx-runtime";
+import { durations as e } from "./lib/motion.js";
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { AnimatePresence as r, motion as i } from "framer-motion";
 //#region src/ui/button-processing.tsx
 var a = {
 	accent: "var(--color-accent-11)",
@@ -16,11 +16,11 @@ var a = {
 	urgent: 1
 };
 function s({ active: s, speed: l, color: u }) {
-	let d = a[u] ?? a.accent, f = c(), p = o[l], m = r.useRef(null), [h, g] = r.useState(8), [_, v] = r.useState({
+	let d = a[u] ?? a.accent, f = c(), p = o[l], m = t.useRef(null), [h, g] = t.useState(8), [_, v] = t.useState({
 		array: "8 6",
 		cycle: 14
-	}), [y, b] = r.useState(null);
-	r.useEffect(() => {
+	}), [y, b] = t.useState(null);
+	t.useEffect(() => {
 		let e = m.current?.closest("span")?.previousElementSibling;
 		if (!e) return;
 		let t = () => {
@@ -42,25 +42,25 @@ function s({ active: s, speed: l, color: u }) {
 		return n?.observe(e), () => n?.disconnect();
 	}, [s]);
 	let x = y?.w ?? 0, S = y?.h ?? 0;
-	return /* @__PURE__ */ i(t, { children: s && /* @__PURE__ */ i(e.span, {
+	return /* @__PURE__ */ n(r, { children: s && /* @__PURE__ */ n(i.span, {
 		initial: { opacity: 0 },
 		animate: { opacity: 1 },
 		exit: { opacity: 0 },
-		transition: { duration: n.moderate01b },
+		transition: { duration: e.moderate01b },
 		"aria-hidden": "true",
 		className: "absolute top-0 left-0 pointer-events-none",
 		style: {
 			width: x,
 			height: S
 		},
-		children: /* @__PURE__ */ i("svg", {
+		children: /* @__PURE__ */ n("svg", {
 			width: x,
 			height: S,
 			style: {
 				overflow: "visible",
 				display: "block"
 			},
-			children: /* @__PURE__ */ i(e.rect, {
+			children: /* @__PURE__ */ n(i.rect, {
 				ref: m,
 				x: 1,
 				y: 1,
@@ -84,10 +84,10 @@ function s({ active: s, speed: l, color: u }) {
 	}, "processing-ants") });
 }
 function c() {
-	let [e, t] = r.useState(() => typeof window > "u" ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches);
-	return r.useEffect(() => {
-		let e = window.matchMedia("(prefers-reduced-motion: reduce)"), n = (e) => t(e.matches);
-		return e.addEventListener("change", n), () => e.removeEventListener("change", n);
+	let [e, n] = t.useState(() => typeof window > "u" ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+	return t.useEffect(() => {
+		let e = window.matchMedia("(prefers-reduced-motion: reduce)"), t = (e) => n(e.matches);
+		return e.addEventListener("change", t), () => e.removeEventListener("change", t);
 	}, []), e;
 }
 //#endregion

package/dist/ui/button-processing.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-processing.js","names":[],"sources":["../../src/ui/button-processing.tsx"],"sourcesContent":["'use client'\n\nimport { motion, AnimatePresence } from 'framer-motion'\nimport * as React from 'react'\nimport { durations } from './lib/motion'\n\n// ── Types ──────────────────────────────────────────────────────────\n\nexport type ProcessingSpeed = 'ambient' | 'working' | 'urgent'\n\ninterface ProcessingOverlayProps {\n  active: boolean\n  speed: ProcessingSpeed\n  /** Resolved color name — maps to CSS token `--color-{name}-9` */\n  color: string\n}\n\n// ── Color mapping ──────────────────────────────────────────────────\n\n// Use text-level color tokens (step 11) so ants match the button's text color.\n// This ensures visibility on all variants — especially neutral where step-9 is too close to the soft bg.\nconst COLOR_MAP: Record<string, string> = {\n  accent:  'var(--color-accent-11)',\n  error:   'var(--color-error-11)',\n  success: 'var(--color-success-11)',\n  warning: 'var(--color-warning-11)',\n  neutral: 'var(--color-surface-fg)',\n}\n\n// ── Speed → duration (seconds) ─────────────────────────────────────\n\nconst SPEED_SECONDS: Record<ProcessingSpeed, number> = {\n  ambient: 3,\n  working: 2,\n  urgent:  1,\n}\n\n// ── Component ──────────────────────────────────────────────────────\n\n/**\n * Internal overlay component for button processing state.\n * Renders marching ants (SVG dashed rect with animated stroke-dashoffset).\n * Not exported from the barrel — used only by Button.\n */\nexport function ProcessingOverlay({ active, speed, color }: ProcessingOverlayProps) {\n  const solidColor = COLOR_MAP[color] ?? COLOR_MAP.accent\n  const prefersReduced = useReducedMotion()\n  const duration = SPEED_SECONDS[speed]\n  const svgRef = React.useRef<SVGRectElement>(null)\n  const [borderRadius, setBorderRadius] = React.useState(8)\n  const [dashInfo, setDashInfo] = React.useState({ array: '8 6', cycle: 14 })\n  // Explicit pixel dimensions of the button — drives BOTH the SVG box and the\n  // rect geometry. Relying on CSS `w-full`/`calc(100% - 2px)` made the ants'\n  // outline depend on the wrapper's rendered size, which can drift from the\n  // button's own size during width transitions — leaving a visible gap\n  // between the button edge and the ants.\n  const [size, setSize] = React.useState<{ w: number; h: number } | null>(null)\n\n  // Read the button's dimensions + border-radius, compute dash pattern\n  React.useEffect(() => {\n    const wrapper = svgRef.current?.closest('span')\n    const btnEl = wrapper?.previousElementSibling as HTMLElement | null\n    if (!btnEl) return\n\n    const measure = () => {\n      const style = getComputedStyle(btnEl)\n      const rawR = parseFloat(style.borderRadius) || 8\n      const btnW = btnEl.offsetWidth\n      const btnH = btnEl.offsetHeight\n      if (btnW === 0 || btnH === 0) return\n      // Inset 1px so the 2px stroke (centered on the edge) lands exactly on\n      // the button's visual border instead of outside it.\n      const w = btnW - 2\n      const h = btnH - 2\n      // Cap radius at half the shorter dimension (pill buttons report 9999px)\n      const r = Math.min(rawR, h / 2, w / 2)\n      setBorderRadius(r)\n      setSize({ w: btnW, h: btnH })\n\n      // Perimeter of a rounded rect:\n      // 4 straight edges + 4 quarter-circle arcs (= one full circle of radius r)\n      const perimeter = 2 * (w - 2 * r) + 2 * (h - 2 * r) + 2 * Math.PI * r\n\n      // Target: 8px dash, 6px gap — adjust gap so dashes fit evenly (no seam)\n      const dashPx = 8\n      const gapPx = 6\n      const approxCycle = dashPx + gapPx\n      const count = Math.round(perimeter / approxCycle)\n      const adjustedGap = (perimeter - count * dashPx) / count\n      const finalGap = Math.max(2, adjustedGap)\n      setDashInfo({ array: `${dashPx} ${finalGap.toFixed(1)}`, cycle: dashPx + finalGap })\n    }\n\n    measure()\n    // Keep the ants glued to the button when it resizes (text change,\n    // async-feedback icon swap, layout animation settling).\n    const ro = typeof ResizeObserver !== 'undefined' ? new ResizeObserver(measure) : null\n    ro?.observe(btnEl)\n    return () => ro?.disconnect()\n  }, [active])\n\n  // Render the overlay even before the first measurement settles — the\n  // aria-hidden anchor must exist for discoverability, and the SVG harmlessly\n  // renders at 0x0 until measurement lands a real size (one animation frame).\n  const w = size?.w ?? 0\n  const h = size?.h ?? 0\n\n  return (\n    <AnimatePresence>\n      {active && (\n        <motion.span\n          key=\"processing-ants\"\n          initial={{ opacity: 0 }}\n          animate={{ opacity: 1 }}\n          exit={{ opacity: 0 }}\n          transition={{ duration: durations.moderate01b }}\n          aria-hidden=\"true\"\n          className=\"absolute top-0 left-0 pointer-events-none\"\n          style={{ width: w, height: h }}\n        >\n          <svg\n            width={w}\n            height={h}\n            style={{ overflow: 'visible', display: 'block' }}\n          >\n            <motion.rect\n              ref={svgRef}\n              x={1}\n              y={1}\n              width={Math.max(0, w - 2)}\n              height={Math.max(0, h - 2)}\n              rx={borderRadius}\n              ry={borderRadius}\n              fill=\"none\"\n              stroke={solidColor}\n              strokeWidth={2}\n              strokeDasharray={dashInfo.array}\n              style={{ transition: 'stroke 0.3s ease' }}\n              animate={prefersReduced ? {} : { strokeDashoffset: [0, -dashInfo.cycle] }}\n              transition={prefersReduced ? {} : {\n                duration,\n                ease: 'linear',\n                repeat: Infinity,\n              }}\n            />\n          </svg>\n        </motion.span>\n      )}\n    </AnimatePresence>\n  )\n}\n\n// ── Reduced motion hook ────────────────────────────────────────────\n\nfunction useReducedMotion(): boolean {\n  const [reduced, setReduced] = React.useState(() => {\n    if (typeof window === 'undefined') return false\n    return window.matchMedia('(prefers-reduced-motion: reduce)').matches\n  })\n\n  React.useEffect(() => {\n    const mql = window.matchMedia('(prefers-reduced-motion: reduce)')\n    const handler = (e: MediaQueryListEvent) => setReduced(e.matches)\n    mql.addEventListener('change', handler)\n    return () => mql.removeEventListener('change', handler)\n  }, [])\n\n  return reduced\n}\n"],"mappings":"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"}
+{"version":3,"file":"button-processing.js","names":[],"sources":["../../src/ui/button-processing.tsx"],"sourcesContent":["'use client'\n\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { durations } from './lib/motion'\n\n// ── Types ──────────────────────────────────────────────────────────\n\nexport type ProcessingSpeed = 'ambient' | 'working' | 'urgent'\n\ninterface ProcessingOverlayProps {\n  active: boolean\n  speed: ProcessingSpeed\n  /** Resolved color name — maps to CSS token `--color-{name}-9` */\n  color: string\n}\n\n// ── Color mapping ──────────────────────────────────────────────────\n\n// Use text-level color tokens (step 11) so ants match the button's text color.\n// This ensures visibility on all variants — especially neutral where step-9 is too close to the soft bg.\nconst COLOR_MAP: Record<string, string> = {\n  accent:  'var(--color-accent-11)',\n  error:   'var(--color-error-11)',\n  success: 'var(--color-success-11)',\n  warning: 'var(--color-warning-11)',\n  neutral: 'var(--color-surface-fg)',\n}\n\n// ── Speed → duration (seconds) ─────────────────────────────────────\n\nconst SPEED_SECONDS: Record<ProcessingSpeed, number> = {\n  ambient: 3,\n  working: 2,\n  urgent:  1,\n}\n\n// ── Component ──────────────────────────────────────────────────────\n\n/**\n * Internal overlay component for button processing state.\n * Renders marching ants (SVG dashed rect with animated stroke-dashoffset).\n * Not exported from the barrel — used only by Button.\n */\nexport function ProcessingOverlay({ active, speed, color }: ProcessingOverlayProps) {\n  const solidColor = COLOR_MAP[color] ?? COLOR_MAP.accent\n  const prefersReduced = useReducedMotion()\n  const duration = SPEED_SECONDS[speed]\n  const svgRef = React.useRef<SVGRectElement>(null)\n  const [borderRadius, setBorderRadius] = React.useState(8)\n  const [dashInfo, setDashInfo] = React.useState({ array: '8 6', cycle: 14 })\n  // Explicit pixel dimensions of the button — drives BOTH the SVG box and the\n  // rect geometry. Relying on CSS `w-full`/`calc(100% - 2px)` made the ants'\n  // outline depend on the wrapper's rendered size, which can drift from the\n  // button's own size during width transitions — leaving a visible gap\n  // between the button edge and the ants.\n  const [size, setSize] = React.useState<{ w: number; h: number } | null>(null)\n\n  // Read the button's dimensions + border-radius, compute dash pattern\n  React.useEffect(() => {\n    const wrapper = svgRef.current?.closest('span')\n    const btnEl = wrapper?.previousElementSibling as HTMLElement | null\n    if (!btnEl) return\n\n    const measure = () => {\n      const style = getComputedStyle(btnEl)\n      const rawR = parseFloat(style.borderRadius) || 8\n      const btnW = btnEl.offsetWidth\n      const btnH = btnEl.offsetHeight\n      if (btnW === 0 || btnH === 0) return\n      // Inset 1px so the 2px stroke (centered on the edge) lands exactly on\n      // the button's visual border instead of outside it.\n      const w = btnW - 2\n      const h = btnH - 2\n      // Cap radius at half the shorter dimension (pill buttons report 9999px)\n      const r = Math.min(rawR, h / 2, w / 2)\n      setBorderRadius(r)\n      setSize({ w: btnW, h: btnH })\n\n      // Perimeter of a rounded rect:\n      // 4 straight edges + 4 quarter-circle arcs (= one full circle of radius r)\n      const perimeter = 2 * (w - 2 * r) + 2 * (h - 2 * r) + 2 * Math.PI * r\n\n      // Target: 8px dash, 6px gap — adjust gap so dashes fit evenly (no seam)\n      const dashPx = 8\n      const gapPx = 6\n      const approxCycle = dashPx + gapPx\n      const count = Math.round(perimeter / approxCycle)\n      const adjustedGap = (perimeter - count * dashPx) / count\n      const finalGap = Math.max(2, adjustedGap)\n      setDashInfo({ array: `${dashPx} ${finalGap.toFixed(1)}`, cycle: dashPx + finalGap })\n    }\n\n    measure()\n    // Keep the ants glued to the button when it resizes (text change,\n    // async-feedback icon swap, layout animation settling).\n    const ro = typeof ResizeObserver !== 'undefined' ? new ResizeObserver(measure) : null\n    ro?.observe(btnEl)\n    return () => ro?.disconnect()\n  }, [active])\n\n  // Render the overlay even before the first measurement settles — the\n  // aria-hidden anchor must exist for discoverability, and the SVG harmlessly\n  // renders at 0x0 until measurement lands a real size (one animation frame).\n  const w = size?.w ?? 0\n  const h = size?.h ?? 0\n\n  return (\n    <AnimatePresence>\n      {active && (\n        <motion.span\n          key=\"processing-ants\"\n          initial={{ opacity: 0 }}\n          animate={{ opacity: 1 }}\n          exit={{ opacity: 0 }}\n          transition={{ duration: durations.moderate01b }}\n          aria-hidden=\"true\"\n          className=\"absolute top-0 left-0 pointer-events-none\"\n          style={{ width: w, height: h }}\n        >\n          <svg\n            width={w}\n            height={h}\n            style={{ overflow: 'visible', display: 'block' }}\n          >\n            <motion.rect\n              ref={svgRef}\n              x={1}\n              y={1}\n              width={Math.max(0, w - 2)}\n              height={Math.max(0, h - 2)}\n              rx={borderRadius}\n              ry={borderRadius}\n              fill=\"none\"\n              stroke={solidColor}\n              strokeWidth={2}\n              strokeDasharray={dashInfo.array}\n              style={{ transition: 'stroke 0.3s ease' }}\n              animate={prefersReduced ? {} : { strokeDashoffset: [0, -dashInfo.cycle] }}\n              transition={prefersReduced ? {} : {\n                duration,\n                ease: 'linear',\n                repeat: Infinity,\n              }}\n            />\n          </svg>\n        </motion.span>\n      )}\n    </AnimatePresence>\n  )\n}\n\n// ── Reduced motion hook ────────────────────────────────────────────\n\nfunction useReducedMotion(): boolean {\n  const [reduced, setReduced] = React.useState(() => {\n    if (typeof window === 'undefined') return false\n    return window.matchMedia('(prefers-reduced-motion: reduce)').matches\n  })\n\n  React.useEffect(() => {\n    const mql = window.matchMedia('(prefers-reduced-motion: reduce)')\n    const handler = (e: MediaQueryListEvent) => setReduced(e.matches)\n    mql.addEventListener('change', handler)\n    return () => mql.removeEventListener('change', handler)\n  }, [])\n\n  return reduced\n}\n"],"mappings":"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"}

package/dist/ui/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/ui/button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAW9B,eAAO,MAAM,cAAc;;;;;8EAiF1B,CAAA;AAoDD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,CAAC,EAClE,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IAC1B,sEAAsE;IACtE,SAAS,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;IACrC,qEAAqE;IACrE,OAAO,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;IACnC,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yFAAyF;IACzF,eAAe,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;IAC5C,sCAAsC;IACtC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxE,oFAAoF;IACpF,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAE9B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IAEvD,2EAA2E;IAC3E,eAAe,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;IAExE,+FAA+F;IAC/F,kBAAkB,CAAC,EAAE,OAAO,CAAA;CAC7B;AAED,QAAA,MAAM,MAAM,uFAgSX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,CAAA"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/ui/button.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAY9B,eAAO,MAAM,cAAc;;;;;8EAiF1B,CAAA;AAoDD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,CAAC,EAClE,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IAC1B,sEAAsE;IACtE,SAAS,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;IACrC,qEAAqE;IACrE,OAAO,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;IACnC,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yFAAyF;IACzF,eAAe,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;IAC5C,sCAAsC;IACtC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxE,oFAAoF;IACpF,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAE9B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IAEvD,2EAA2E;IAC3E,eAAe,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;IAExE,+FAA+F;IAC/F,kBAAkB,CAAC,EAAE,OAAO,CAAA;CAC7B;AAED,QAAA,MAAM,MAAM,uFAgSX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/dist/ui/button.js

@@ -1,17 +1,17 @@
 "use client";
 import { Hn as e, Un as t } from "../_chunks/primitives.js";
-import { a as n, n as ee } from "../_chunks/framer.js";
-import { motionProps as te } from "./lib/motion.js";
+import { IconProvider as n } from "./icon-context.js";
+import { motionProps as ee } from "./lib/motion.js";
 import { t as r } from "../_chunks/vendor-utils.js";
 import { cn as i } from "./lib/utils.js";
 import { Spinner as a } from "./spinner.js";
-import { IconProvider as o } from "./icon-context.js";
-import { Icon as ne } from "./icon.js";
-import { getGroupPositionStyle as re, useButtonGroup as ie, useButtonGroupItem as ae } from "./button-group.js";
-import { ProcessingOverlay as s } from "./button-processing.js";
-import * as c from "react";
-import { Fragment as oe, jsx as l, jsxs as u } from "react/jsx-runtime";
-import { IconCheck as se, IconX as ce } from "@tabler/icons-react";
+import { Icon as te } from "./icon.js";
+import { getGroupPositionStyle as o, useButtonGroup as ne, useButtonGroupItem as re } from "./button-group.js";
+import { ProcessingOverlay as ie } from "./button-processing.js";
+import * as s from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+import { IconCheck as ae, IconX as oe } from "@tabler/icons-react";
+import { motion as se, useReducedMotion as ce } from "framer-motion";
 //#region src/ui/button.tsx
 var d = r("relative inline-flex items-center justify-center whitespace-nowrap font-sans select-none overflow-hidden isolate focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled disabled:cursor-not-allowed disabled:saturate-[0.3] [&>span:not([data-grain])]:relative [&>span:not([data-grain])]:z-[2]", {
 	variants: {
@@ -264,72 +264,72 @@ var d = r("relative inline-flex items-center justify-center whitespace-nowrap fo
 	"icon-sm": "sm",
 	"icon-md": "md",
 	"icon-lg": "lg"
-}, m = c.forwardRef(({ className: r, variant: m, color: h, weight: de, size: fe, asChild: pe = !1, shape: me, startIcon: g, endIcon: _, loading: v = !1, loadingPosition: y = "start", fullWidth: b = !1, disabled: he, onClick: ge, onClickAsync: x, asyncFeedbackDuration: _e = 1500, processing: S, processingColor: ve, processingDisabled: C = !0, children: w, ...T }, E) => {
-	let D = ie(), O = ae(), k = m ?? D.variant, A = h ?? D.color, j = de ?? D.weight ?? "semibold", M = me ?? D.shape ?? "default", N = fe ?? D.size ?? "md", P = he ?? D.disabled, F = O && D.attached !== !1 ? re(O.position, D.orientation ?? "horizontal") : void 0, I = D._stretch ?? !1, L = ee(), R = c.useRef(null), z = c.useRef(null), B = c.useRef(void 0);
-	c.useEffect(() => {
-		let e = z.current, t = R.current;
-		if (!(!e || !t || b || I || L)) return B.current = requestAnimationFrame(() => {
+}, m = s.forwardRef(({ className: r, variant: m, color: de, weight: fe, size: pe, asChild: me = !1, shape: he, startIcon: h, endIcon: g, loading: ge = !1, loadingPosition: _ = "start", fullWidth: v = !1, disabled: _e, onClick: ve, onClickAsync: y, asyncFeedbackDuration: b = 1500, processing: x, processingColor: ye, processingDisabled: S = !0, children: C, ...w }, T) => {
+	let E = ne(), D = re(), O = m ?? E.variant, k = de ?? E.color, A = fe ?? E.weight ?? "semibold", j = he ?? E.shape ?? "default", M = pe ?? E.size ?? "md", N = _e ?? E.disabled, P = D && E.attached !== !1 ? o(D.position, E.orientation ?? "horizontal") : void 0, F = E._stretch ?? !1, I = ce(), L = s.useRef(null), R = s.useRef(null), z = s.useRef(void 0);
+	s.useEffect(() => {
+		let e = R.current, t = L.current;
+		if (!(!e || !t || v || F || I)) return z.current = requestAnimationFrame(() => {
 			t.style.width = "auto";
 			let n = e.offsetWidth;
 			n > 0 && (t.getBoundingClientRect(), t.style.width = `${n}px`);
 		}), () => {
-			B.current && cancelAnimationFrame(B.current);
+			z.current && cancelAnimationFrame(z.current);
 		};
 	});
-	let [V, H] = c.useState("idle"), U = c.useRef(void 0), W = c.useRef(!0);
-	c.useEffect(() => () => {
-		W.current = !1, clearTimeout(U.current);
+	let [B, V] = s.useState("idle"), H = s.useRef(void 0), U = s.useRef(!0);
+	s.useEffect(() => () => {
+		U.current = !1, clearTimeout(H.current);
 	}, []);
-	let ye = (e) => {
-		!x || V !== "idle" || (H("loading"), x(e).then(() => {
-			W.current && H("success");
+	let be = (e) => {
+		!y || B !== "idle" || (V("loading"), y(e).then(() => {
+			U.current && V("success");
 		}).catch(() => {
-			W.current && H("error");
+			U.current && V("error");
 		}).finally(() => {
-			W.current && (U.current = setTimeout(() => {
-				W.current && H("idle");
-			}, _e));
+			U.current && (H.current = setTimeout(() => {
+				U.current && V("idle");
+			}, b));
 		}));
-	}, G = !!x, K = G ? V === "loading" : v, q = V === "success" || V === "error", J = q ? void 0 : S === !0 ? "working" : S === !1 || !S ? G && V === "loading" && !S ? "working" : void 0 : S, Y = !!J, be = ve ?? A ?? "accent";
-	if (pe) return /* @__PURE__ */ l(e, {
+	}, W = !!y, G = W ? B === "loading" : ge, K = B === "success" || B === "error", q = K ? void 0 : x === !0 ? "working" : x === !1 || !x ? W && B === "loading" && !x ? "working" : void 0 : x, J = !!q, xe = ye ?? k ?? "accent";
+	if (me) return /* @__PURE__ */ l(e, {
 		className: i(d({
-			variant: k,
-			color: A,
-			weight: j,
-			size: N
-		}), M === "pill" && "rounded-full", M === "pill" && f[N], (b || I) && "w-full", r),
-		ref: E,
-		disabled: P || K,
-		"aria-busy": K || void 0,
-		...T,
-		children: /* @__PURE__ */ l(t, { children: w })
+			variant: O,
+			color: k,
+			weight: A,
+			size: M
+		}), j === "pill" && "rounded-full", j === "pill" && f[M], (v || F) && "w-full", r),
+		ref: T,
+		disabled: N || G,
+		"aria-busy": G || void 0,
+		...w,
+		children: /* @__PURE__ */ l(t, { children: C })
 	});
-	let X = le[N] ?? {
+	let Y = le[M] ?? {
 		start: "",
 		end: ""
-	}, Z = k === "solid" || k === "soft" || k === "outline", xe = () => K && y === "start" ? /* @__PURE__ */ l("span", {
-		className: i("inline-flex shrink-0 items-center justify-center", g && X.start),
+	}, X = O === "solid" || O === "soft" || O === "outline", Z = () => G && _ === "start" ? /* @__PURE__ */ l("span", {
+		className: i("inline-flex shrink-0 items-center justify-center", h && Y.start),
 		children: /* @__PURE__ */ l(a, {
-			size: p[N],
+			size: p[M],
 			variant: "bare"
 		})
-	}) : g ? /* @__PURE__ */ l("span", {
-		className: i("inline-flex shrink-0 items-center justify-center pointer-events-none", X.start, Z && "opacity-90"),
-		children: g
-	}) : null, Se = () => K && y === "end" ? /* @__PURE__ */ l("span", {
-		className: i("inline-flex shrink-0 items-center justify-center", _ && X.end),
+	}) : h ? /* @__PURE__ */ l("span", {
+		className: i("inline-flex shrink-0 items-center justify-center pointer-events-none", Y.start, X && "opacity-90"),
+		children: h
+	}) : null, Se = () => G && _ === "end" ? /* @__PURE__ */ l("span", {
+		className: i("inline-flex shrink-0 items-center justify-center", g && Y.end),
 		children: /* @__PURE__ */ l(a, {
-			size: p[N],
+			size: p[M],
 			variant: "bare"
 		})
-	}) : _ ? /* @__PURE__ */ l("span", {
-		className: i("inline-flex shrink-0 items-center justify-center pointer-events-none", X.end, Z && "opacity-90"),
-		children: _
-	}) : null, Ce = c.Children.toArray(w), Q = [], $ = [];
+	}) : g ? /* @__PURE__ */ l("span", {
+		className: i("inline-flex shrink-0 items-center justify-center pointer-events-none", Y.end, X && "opacity-90"),
+		children: g
+	}) : null, Ce = s.Children.toArray(C), Q = [], $ = [];
 	Ce.forEach((e) => {
-		c.isValidElement(e) && e.type?.displayName === "DevalokGrain" ? Q.push(e) : $.push(e);
+		s.isValidElement(e) && e.type?.displayName === "DevalokGrain" ? Q.push(e) : $.push(e);
 	});
-	let we = () => K && y === "center" ? /* @__PURE__ */ u("span", {
+	let we = () => G && _ === "center" ? /* @__PURE__ */ u("span", {
 		className: "relative inline-flex items-center justify-center",
 		children: [/* @__PURE__ */ l("span", {
 			className: "invisible",
@@ -337,55 +337,55 @@ var d = r("relative inline-flex items-center justify-center whitespace-nowrap fo
 		}), /* @__PURE__ */ l("span", {
 			className: "absolute inset-0 flex items-center justify-center",
 			children: /* @__PURE__ */ l(a, {
-				size: p[N],
+				size: p[M],
 				variant: "bare"
 			})
 		})]
-	}) : Q.length > 0 ? /* @__PURE__ */ l("span", { children: $ }) : /* @__PURE__ */ l(oe, { children: $ }), Te = q ? V === "success" ? "bg-success-9 text-success-fg border-transparent hover:bg-success-9" : "bg-error-9 text-error-fg border-transparent hover:bg-error-9" : void 0, Ee = q ? /* @__PURE__ */ l("span", {
-		className: i("inline-flex shrink-0 items-center justify-center pointer-events-none", g && X.start),
-		children: /* @__PURE__ */ l(ne, {
-			icon: V === "success" ? se : ce,
+	}) : Q.length > 0 ? /* @__PURE__ */ l("span", { children: $ }) : /* @__PURE__ */ l(c, { children: $ }), Te = K ? B === "success" ? "bg-success-9 text-success-fg border-transparent hover:bg-success-9" : "bg-error-9 text-error-fg border-transparent hover:bg-error-9" : void 0, Ee = K ? /* @__PURE__ */ l("span", {
+		className: i("inline-flex shrink-0 items-center justify-center pointer-events-none", h && Y.start),
+		children: /* @__PURE__ */ l(te, {
+			icon: B === "success" ? ae : oe,
 			animate: "draw"
 		})
-	}) : null, De = ue[N] ?? "md", Oe = /* @__PURE__ */ u(n.button, {
-		...te(T),
+	}) : null, De = ue[M] ?? "md", Oe = /* @__PURE__ */ u(se.button, {
+		...ee(w),
 		style: {
-			...T.style,
-			...F
+			...w.style,
+			...P
 		},
 		className: i(d({
-			variant: Y && !q && k !== "ghost" && k !== "outline" && k !== "link" ? "soft" : k,
-			color: A,
-			weight: j,
-			size: N
-		}), M === "pill" && "rounded-full", M === "pill" && f[N], (b || I) && "w-full", !K && !q && "transition-[color,background-color,border-color,box-shadow,transform,filter] duration-moderate-01 ease-productive-exit", !K && !q && "hover:duration-fast-02 hover:ease-productive-entrance", !K && !q && "active:scale-[0.95] active:brightness-[0.92] active:saturate-[1.1] active:duration-[0ms]", Te, q && "transition-colors duration-moderate-01 ease-productive-standard", Y && C && "pointer-events-none cursor-default", r),
+			variant: J && !K && O !== "ghost" && O !== "outline" && O !== "link" ? "soft" : O,
+			color: k,
+			weight: A,
+			size: M
+		}), j === "pill" && "rounded-full", j === "pill" && f[M], (v || F) && "w-full", !G && !K && "transition-[color,background-color,border-color,box-shadow,transform,filter] duration-moderate-01 ease-productive-exit", !G && !K && "hover:duration-fast-02 hover:ease-productive-entrance", !G && !K && "active:scale-[0.95] active:brightness-[0.92] active:saturate-[1.1] active:duration-[0ms]", Te, K && "transition-colors duration-moderate-01 ease-productive-standard", J && S && "pointer-events-none cursor-default", r),
 		ref: (e) => {
-			z.current = e, typeof E == "function" ? E(e) : E && (E.current = e);
+			R.current = e, typeof T == "function" ? T(e) : T && (T.current = e);
 		},
-		disabled: P || K && !Y,
-		"aria-busy": K || Y || void 0,
-		"aria-disabled": Y && C || void 0,
-		onClick: G ? ye : Y && C ? void 0 : ge,
+		disabled: N || G && !J,
+		"aria-busy": G || J || void 0,
+		"aria-disabled": J && S || void 0,
+		onClick: W ? be : J && S ? void 0 : ve,
 		children: [
 			Q,
-			q ? Ee : xe(),
-			q ? $ : we(),
-			q ? null : Se()
+			K ? Ee : Z(),
+			K ? $ : we(),
+			K ? null : Se()
 		]
 	});
-	return /* @__PURE__ */ l(o, {
+	return /* @__PURE__ */ l(n, {
 		size: De,
 		children: /* @__PURE__ */ u("span", {
-			ref: R,
-			className: i("relative inline-flex", b && "w-full"),
+			ref: L,
+			className: i("relative inline-flex", v && "w-full"),
 			style: {
-				...b || I || L ? void 0 : { transition: "width 0.2s cubic-bezier(0.25, 0.1, 0.25, 1)" },
-				...F
+				...v || F || I ? void 0 : { transition: "width 0.2s cubic-bezier(0.25, 0.1, 0.25, 1)" },
+				...P
 			},
-			children: [Oe, /* @__PURE__ */ l(s, {
-				active: Y,
-				speed: J ?? "working",
-				color: be
+			children: [Oe, /* @__PURE__ */ l(ie, {
+				active: J,
+				speed: q ?? "working",
+				color: xe
 			})]
 		})
 	});