@womp/kookie-ui 0.22.0 → 0.23.0

package/styles.css

@@ -3480,30 +3480,9 @@
 }
 .kui-theme,
 [data-accent-color]:where(:not([data-accent-color=''], [data-accent-color='gray'])) {
-  --focus-1: var(--accent-1);
-  --focus-2: var(--accent-2);
-  --focus-3: var(--accent-3);
-  --focus-4: var(--accent-4);
-  --focus-5: var(--accent-5);
-  --focus-6: var(--accent-6);
-  --focus-7: var(--accent-7);
   --focus-8: var(--accent-8);
-  --focus-9: var(--accent-9);
-  --focus-10: var(--accent-10);
-  --focus-11: var(--accent-11);
-  --focus-12: var(--accent-12);
-  --focus-a1: var(--accent-a1);
   --focus-a2: var(--accent-a2);
-  --focus-a3: var(--accent-a3);
-  --focus-a4: var(--accent-a4);
   --focus-a5: var(--accent-a5);
-  --focus-a6: var(--accent-a6);
-  --focus-a7: var(--accent-a7);
-  --focus-a8: var(--accent-a8);
-  --focus-a9: var(--accent-a9);
-  --focus-a10: var(--accent-a10);
-  --focus-a11: var(--accent-a11);
-  --focus-a12: var(--accent-a12);
   --accent-ink-mix: 45%;
   --accent-ink: color-mix(in oklab, var(--accent-11), var(--accent-12) var(--accent-ink-mix));
   --accent-ink-muted: color-mix(in oklab, var(--accent-ink) 74%, transparent);
@@ -4705,14 +4684,14 @@
   --radius-row-2: var(--radius-control-2);
   --radius-row-3: var(--radius-control-3);
   --radius-row-4: var(--radius-control-4);
-  --radius-surface-1: calc(10px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-2: calc(16px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-3: calc(22px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-4: calc(28px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-1: calc(14px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-2: calc(20px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-3: calc(24px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-4: calc(28px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-1: calc(8px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-2: calc(12px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-3: calc(16px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-4: calc(20px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-1: calc(12px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-2: calc(16px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-3: calc(20px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-4: calc(24px * var(--scale) * var(--radius-surface-factor));
 }
 [data-radius='none'] {
   --radius-factor: 0;
@@ -5915,7 +5894,6 @@
   line-height: var(--line-height-4);
   -webkit-transform-origin: top;
           transform-origin: top;
-  will-change: height, opacity, transform;
 }
 .kui-AccordionContentInner {
   padding: 0 var(--space-5) var(--space-4);
@@ -7489,6 +7467,10 @@
   position: relative;
   cursor: progress;
 }
+.kui-BaseButton :where(.kui-BaseButtonContent) {
+  display: contents;
+  visibility: hidden;
+}
 .kui-BaseButton :where(svg) {
   width: var(--base-button-icon-size);
   height: var(--base-button-icon-size);
@@ -11099,6 +11081,8 @@
 }
 .kui-ComboboxContent {
   --combobox-list-max-height: calc(300px * var(--scale));
+  -ms-scroll-chaining: none;
+      overscroll-behavior: contain;
   min-width: var(--radix-popover-trigger-width);
   max-height: var(--radix-popover-content-available-height);
   -webkit-transform-origin: var(--radix-popover-content-transform-origin);
@@ -11143,6 +11127,12 @@
   scrollbar-width: thin;
   scrollbar-color: var(--neutral-a8) transparent;
 }
+@supports (-webkit-app-region: drag) {
+  .kui-ComboboxScrollArea {
+    -ms-scroll-chaining: chained;
+        overscroll-behavior: auto;
+  }
+}
 .kui-ComboboxList {
   outline: 0;
 }
@@ -11506,6 +11496,32 @@
     letter-spacing: calc(var(--letter-spacing-9) + var(--heading-letter-spacing));
   }
 }
+.kui-Image {
+  display: block;
+  max-width: 100%;
+  -o-object-fit: var(--image-object-fit, cover);
+     object-fit: var(--image-object-fit, cover);
+  border-radius: var(--radius-2);
+  background-color: var(--neutral-a3);
+}
+.kui-Image:where([data-status='loaded']) {
+  background-color: transparent;
+}
+.kui-Image:where(.kui-r-fit-cover) {
+  --image-object-fit: cover;
+}
+.kui-Image:where(.kui-r-fit-contain) {
+  --image-object-fit: contain;
+}
+.kui-Image:where(.kui-r-fit-fill) {
+  --image-object-fit: fill;
+}
+.kui-Image:where(.kui-r-fit-scale-down) {
+  --image-object-fit: scale-down;
+}
+.kui-Image:where(.kui-r-fit-none) {
+  --image-object-fit: none;
+}
 .kui-Kbd {
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
@@ -16370,6 +16386,12 @@
       overscroll-behavior: contain;
   isolation: isolate;
 }
+@supports (-webkit-app-region: drag) {
+  .kui-ShellContent {
+    -ms-scroll-chaining: chained;
+        overscroll-behavior: auto;
+  }
+}
 .kui-ShellPane {
   --kui-pane-inset-start: initial;
   --kui-pane-inset-end: initial;
@@ -17418,6 +17440,8 @@
 .kui-SliderTick {
   position: absolute;
   top: 0;
+  -webkit-transform: translateX(-50%);
+          transform: translateX(-50%);
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -17481,6 +17505,12 @@
   position: relative;
   width: var(--space-5);
   height: var(--space-5);
+  contain: paint;
+  overflow-clip-margin: 4px;
+}
+.kui-SpinnerWheel {
+  position: absolute;
+  inset: 0;
   opacity: var(--spinner-opacity);
   -webkit-animation: kui-spinner-rotate var(--spinner-animation-duration) steps(8, end) infinite;
           animation: kui-spinner-rotate var(--spinner-animation-duration) steps(8, end) infinite;
@@ -17553,11 +17583,15 @@
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .kui-Spinner {
+  .kui-SpinnerWheel {
     -webkit-animation-duration: calc(var(--spinner-animation-duration) * 3);
             animation-duration: calc(var(--spinner-animation-duration) * 3);
   }
 }
+.kui-SpinnerHiddenChildren {
+  display: contents;
+  visibility: hidden;
+}
 .kui-SwitchRoot {
   position: relative;
   display: -webkit-inline-box;

package/tokens/base.css

@@ -129,30 +129,9 @@
 }
 .kui-theme,
 [data-accent-color]:where(:not([data-accent-color=''], [data-accent-color='gray'])) {
-  --focus-1: var(--accent-1);
-  --focus-2: var(--accent-2);
-  --focus-3: var(--accent-3);
-  --focus-4: var(--accent-4);
-  --focus-5: var(--accent-5);
-  --focus-6: var(--accent-6);
-  --focus-7: var(--accent-7);
   --focus-8: var(--accent-8);
-  --focus-9: var(--accent-9);
-  --focus-10: var(--accent-10);
-  --focus-11: var(--accent-11);
-  --focus-12: var(--accent-12);
-  --focus-a1: var(--accent-a1);
   --focus-a2: var(--accent-a2);
-  --focus-a3: var(--accent-a3);
-  --focus-a4: var(--accent-a4);
   --focus-a5: var(--accent-a5);
-  --focus-a6: var(--accent-a6);
-  --focus-a7: var(--accent-a7);
-  --focus-a8: var(--accent-a8);
-  --focus-a9: var(--accent-a9);
-  --focus-a10: var(--accent-a10);
-  --focus-a11: var(--accent-a11);
-  --focus-a12: var(--accent-a12);
   --accent-ink-mix: 45%;
   --accent-ink: color-mix(in oklab, var(--accent-11), var(--accent-12) var(--accent-ink-mix));
   --accent-ink-muted: color-mix(in oklab, var(--accent-ink) 74%, transparent);
@@ -1342,14 +1321,14 @@
   --radius-row-2: var(--radius-control-2);
   --radius-row-3: var(--radius-control-3);
   --radius-row-4: var(--radius-control-4);
-  --radius-surface-1: calc(10px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-2: calc(16px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-3: calc(22px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-4: calc(28px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-1: calc(14px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-2: calc(20px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-3: calc(24px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-4: calc(28px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-1: calc(8px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-2: calc(12px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-3: calc(16px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-4: calc(20px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-1: calc(12px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-2: calc(16px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-3: calc(20px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-4: calc(24px * var(--scale) * var(--radius-surface-factor));
 }
 [data-radius='none'] {
   --radius-factor: 0;

package/tokens.css

@@ -3475,30 +3475,9 @@
 }
 .kui-theme,
 [data-accent-color]:where(:not([data-accent-color=''], [data-accent-color='gray'])) {
-  --focus-1: var(--accent-1);
-  --focus-2: var(--accent-2);
-  --focus-3: var(--accent-3);
-  --focus-4: var(--accent-4);
-  --focus-5: var(--accent-5);
-  --focus-6: var(--accent-6);
-  --focus-7: var(--accent-7);
   --focus-8: var(--accent-8);
-  --focus-9: var(--accent-9);
-  --focus-10: var(--accent-10);
-  --focus-11: var(--accent-11);
-  --focus-12: var(--accent-12);
-  --focus-a1: var(--accent-a1);
   --focus-a2: var(--accent-a2);
-  --focus-a3: var(--accent-a3);
-  --focus-a4: var(--accent-a4);
   --focus-a5: var(--accent-a5);
-  --focus-a6: var(--accent-a6);
-  --focus-a7: var(--accent-a7);
-  --focus-a8: var(--accent-a8);
-  --focus-a9: var(--accent-a9);
-  --focus-a10: var(--accent-a10);
-  --focus-a11: var(--accent-a11);
-  --focus-a12: var(--accent-a12);
   --accent-ink-mix: 45%;
   --accent-ink: color-mix(in oklab, var(--accent-11), var(--accent-12) var(--accent-ink-mix));
   --accent-ink-muted: color-mix(in oklab, var(--accent-ink) 74%, transparent);
@@ -4688,14 +4667,14 @@
   --radius-row-2: var(--radius-control-2);
   --radius-row-3: var(--radius-control-3);
   --radius-row-4: var(--radius-control-4);
-  --radius-surface-1: calc(10px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-2: calc(16px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-3: calc(22px * var(--scale) * var(--radius-surface-factor));
-  --radius-surface-4: calc(28px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-1: calc(14px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-2: calc(20px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-3: calc(24px * var(--scale) * var(--radius-surface-factor));
-  --radius-overlay-4: calc(28px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-1: calc(8px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-2: calc(12px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-3: calc(16px * var(--scale) * var(--radius-surface-factor));
+  --radius-surface-4: calc(20px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-1: calc(12px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-2: calc(16px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-3: calc(20px * var(--scale) * var(--radius-surface-factor));
+  --radius-overlay-4: calc(24px * var(--scale) * var(--radius-surface-factor));
 }
 [data-radius='none'] {
   --radius-factor: 0;

package/dist/esm/chunk-3YWVE5GL.js

@@ -1,2 +0,0 @@
-import{a as k}from"./chunk-A3YQIJDA.js";import{a as T}from"./chunk-BJUCBOGU.js";import{a as x}from"./chunk-AGAQC4HH.js";import{e as D}from"./chunk-3YLYGKFB.js";import{a as E}from"./chunk-BWLCTTTN.js";import{a as N}from"./chunk-ELAW7ZUG.js";import*as e from"react";import W from"classnames";import{Slot as X}from"radix-ui";import{useComposedRefs as $,useLayoutEffect as q}from"radix-ui/internal";var J=e.forwardRef((l,p)=>{let t=D(l,E.size),{className:h,children:n,asChild:a,as:r,color:M,radius:v,disabled:u,...b}=N(t,E),d=!!t.loading,R=!!u||d,{onClick:P,"aria-describedby":g}=b,w=e.useCallback(o=>{if(R){o.preventDefault();return}P?.(o)},[R,P]),O=e.useMemo(()=>{let o=a&&e.isValidElement(n)?n.props.children:n,c=m=>e.Children.toArray(m).flatMap(f=>e.isValidElement(f)&&f.type===e.Fragment?c(f.props.children):[f]),i=c(o),s=m=>e.isValidElement(m)&&m.type==="svg";return{iconStart:s(i[0]),iconEnd:s(i[i.length-1])}},[a,n]),[H,L]=e.useState(null),C=e.useRef(null),I=$(p,C);q(()=>{let o=C.current;if(!o||d)return;let c=S(o,"start"),i=S(o,"end");L(s=>s&&s.iconStart===c&&s.iconEnd===i?s:{iconStart:c,iconEnd:i})});let{iconStart:V,iconEnd:j}=H??O,A=a?X.Root:r||"button",y=a||!r||["button","input","textarea","select"].includes(r),F=!a&&(!r||r==="button"),_="type"in b,z=e.useId(),B=d?`${z}-loading`:void 0,G=e.useMemo(()=>d?{"aria-busy":!0,"aria-disabled":!0,"aria-describedby":[g,B].filter(Boolean).join(" ")}:u&&(!y||a)?{"aria-disabled":!0}:{},[d,B,g,u,y,a]);return e.createElement(A,{"data-accent-color":M,"data-radius":v,"data-icon-start":V||void 0,"data-icon-end":j||void 0,...b,...G,"data-disabled":R||void 0,onClick:w,ref:I,className:W("kui-reset","kui-BaseButton",h),...y&&{disabled:u},...F&&!_?{type:"button"}:{}},t.loading?e.createElement(e.Fragment,null,e.createElement("span",{style:{display:"contents",visibility:"hidden"},"aria-hidden":!0},n),e.createElement(x,null,e.createElement("span",{id:B,"aria-hidden":!0},"Loading"),n),e.createElement(T,{asChild:!0,align:"center",justify:"center",position:"absolute",inset:"0"},e.createElement("span",null,e.createElement(k,{"aria-hidden":"true"})))):n)});J.displayName="BaseButton";function S(l,p){let t=p==="start"?l.firstChild:l.lastChild;for(;t&&(t.nodeType===Node.COMMENT_NODE||t.nodeType===Node.TEXT_NODE&&!t.textContent?.trim());)t=p==="start"?t.nextSibling:t.previousSibling;return t?.nodeType===Node.ELEMENT_NODE&&t.localName==="svg"}export{J as a};
-//# sourceMappingURL=chunk-3YWVE5GL.js.map

package/dist/esm/chunk-3YWVE5GL.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/_internal/base-button.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\nimport { Slot } from 'radix-ui';\nimport { useComposedRefs, useLayoutEffect } from 'radix-ui/internal';\n\nimport { baseButtonPropDefs } from './base-button.props.js';\nimport { Flex } from '../flex.js';\nimport { Spinner } from '../spinner.js';\nimport { VisuallyHidden } from '../visually-hidden.js';\nimport { extractProps } from '../../helpers/extract-props.js';\nimport { useThemeSizeProps } from '../../helpers/theme-size.js';\n\nimport type { ComponentPropsWithout, RemovedProps } from '../../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../../props/prop-def.js';\n\ntype BaseButtonElement = React.ElementRef<'button'>;\ntype BaseButtonOwnProps = GetPropDefTypes<typeof baseButtonPropDefs>;\n\n/**\n * Polymorphic BaseButton props that support rendering as different HTML elements\n * Uses the proper ComponentPropsWithout pattern for type safety\n * @template C - The element type to render as (defaults to 'button')\n */\ntype PolymorphicBaseButtonProps<C extends React.ElementType = 'button'> = {\n  /** Element type to render as (e.g., 'a', 'span', etc.) */\n  as?: C;\n} & BaseButtonOwnProps &\n  ComponentPropsWithout<C, RemovedProps | keyof BaseButtonOwnProps | 'as'>;\n\n/**\n * BaseButton props interface that combines all available props\n */\ninterface BaseButtonProps extends PolymorphicBaseButtonProps {}\n\n/**\n * BaseButton component that provides the core button functionality\n *\n * This is the foundational button component that handles all the complex logic\n * including loading states, accessibility, performance optimizations, and\n * polymorphic rendering. It's used by Button and Toggle to ensure consistent behavior across the design system.\n *\n * Key features:\n * - Loading state with spinner and accessibility announcements\n * - Comprehensive accessibility support\n * - Polymorphic rendering support\n *\n * @example\n * ```tsx\n * // Basic usage\n * <BaseButton>Click me</BaseButton>\n *\n * // With loading state\n * <BaseButton loading>Processing...</BaseButton>\n *\n * // Polymorphic rendering\n * <BaseButton as=\"a\" href=\"/link\">Link Button</BaseButton>\n * ```\n */\nconst BaseButton = React.forwardRef<BaseButtonElement, BaseButtonProps>((ownProps, forwardedRef) => {\n  const props = useThemeSizeProps(ownProps, baseButtonPropDefs.size);\n\n  // Extract button-specific props from the combined props object\n  const {\n    className,\n    children,\n    asChild,\n    as,\n    color,\n    radius,\n    disabled: nativeDisabled,\n    ...baseButtonProps\n  } = extractProps(props, baseButtonPropDefs);\n\n  // Loading blocks activation but keeps the native `disabled` off, so the button keeps focus\n  // and its place in the tab order (aria-disabled carries the state). An explicit `disabled`\n  // stays native on form controls; on anything else (a link, an asChild child) the `disabled`\n  // attribute does nothing, so aria-disabled carries the state and the click is stopped here.\n  const loading = Boolean(props.loading);\n  const disabled = Boolean(nativeDisabled) || loading;\n  const { onClick, 'aria-describedby': ariaDescribedByProp } = baseButtonProps as {\n    onClick?: React.MouseEventHandler<HTMLElement>;\n    'aria-describedby'?: string;\n  };\n  const handleClick = React.useCallback(\n    (event: React.MouseEvent<HTMLElement>) => {\n      if (disabled) {\n        event.preventDefault();\n        return;\n      }\n      onClick?.(event);\n    },\n    [disabled, onClick],\n  );\n\n  // Which edges start or end with an icon. A bare edge pads wider under a full radius; an edge\n  // holding an icon keeps the plain padding (the icon already stands between text and curve).\n  // Only an svg is an icon. Rendering reads the children for an svg element at either end, so\n  // the server output is right for inline svgs; after mount the rendered DOM settles it, which\n  // also catches icon components (they render an svg) and rules out wrapped text (`<Text>`,\n  // `<Kbd>`, `<Trans>`), whose first node is not an svg.\n  const childEdges = React.useMemo(() => {\n    const content =\n      asChild && React.isValidElement(children) ? (children.props as { children?: React.ReactNode }).children : children;\n    // Fragments are see-through: their own first and last children are the edges.\n    const flatten = (nodes: React.ReactNode): React.ReactNode[] =>\n      React.Children.toArray(nodes).flatMap((node) =>\n        React.isValidElement(node) && node.type === React.Fragment\n          ? flatten((node.props as { children?: React.ReactNode }).children)\n          : [node],\n      );\n    const items = flatten(content);\n    const isIcon = (node: React.ReactNode) => React.isValidElement(node) && node.type === 'svg';\n    return { iconStart: isIcon(items[0]), iconEnd: isIcon(items[items.length - 1]) };\n  }, [asChild, children]);\n  const [domEdges, setDomEdges] = React.useState<{ iconStart: boolean; iconEnd: boolean } | null>(null);\n  const elementRef = React.useRef<HTMLElement>(null);\n  const composedRef = useComposedRefs(forwardedRef, elementRef as React.Ref<BaseButtonElement>);\n  useLayoutEffect(() => {\n    const element = elementRef.current;\n    // While loading the label sits in a wrapper; keep the edges read before it.\n    if (!element || loading) return;\n    const iconStart = edgeIsSvg(element, 'start');\n    const iconEnd = edgeIsSvg(element, 'end');\n    setDomEdges((prev) => (prev && prev.iconStart === iconStart && prev.iconEnd === iconEnd ? prev : { iconStart, iconEnd }));\n  });\n  const { iconStart, iconEnd } = domEdges ?? childEdges;\n\n  // asChild takes precedence over as prop for Radix Slot integration\n  // When asChild is true, we use Slot.Root to merge props onto the child element\n  // When asChild is false, we render as the specified element (or button by default)\n  const Comp = asChild ? Slot.Root : (as || 'button');\n\n  // Only pass disabled for elements that support it\n  // This prevents invalid HTML attributes on unsupported elements\n  const shouldPassDisabled = asChild || !as || ['button', 'input', 'textarea', 'select'].includes(as);\n\n  // Determine if we are rendering a real <button> element so we can set a safe\n  // default type. Native <button> defaults to type=\"submit\" which can cause\n  // accidental form submissions. We default to type=\"button\" unless the user\n  // explicitly provided a type or we're using asChild (unknown underlying node).\n  const isNativeButtonElement = !asChild && (!as || as === 'button');\n  const hasExplicitTypeAttribute = 'type' in (baseButtonProps as Record<string, unknown>);\n\n  // Generate unique ID for loading announcements\n  const loadingId = React.useId();\n  const describedById = loading ? `${loadingId}-loading` : undefined;\n\n  // Loading keeps the caller's name (aria-label, aria-labelledby or the label text) and adds\n  // aria-busy plus a description, as v2 does. A disabled element with no native `disabled`\n  // announces itself through aria-disabled.\n  const accessibilityProps = React.useMemo(() => {\n    if (loading) {\n      return {\n        'aria-busy': true,\n        'aria-disabled': true,\n        'aria-describedby': [ariaDescribedByProp, describedById].filter(Boolean).join(' '),\n      };\n    }\n    if (nativeDisabled && (!shouldPassDisabled || asChild)) {\n      return { 'aria-disabled': true };\n    }\n    return {};\n  }, [loading, describedById, ariaDescribedByProp, nativeDisabled, shouldPassDisabled, asChild]);\n\n  return (\n    <Comp\n      data-accent-color={color}\n      data-radius={radius}\n      data-icon-start={iconStart || undefined}\n      data-icon-end={iconEnd || undefined}\n      {...baseButtonProps}\n      {...accessibilityProps}\n      // After the spread: `data-disabled` styles `<Button asChild disabled>`, and a wrapping\n      // Radix Toggle (asChild) passes `data-disabled={undefined}` that must not erase it.\n      data-disabled={disabled || undefined}\n      onClick={handleClick}\n      ref={composedRef}\n      className={classNames('kui-reset', 'kui-BaseButton', className)}\n      {...(shouldPassDisabled && { disabled: nativeDisabled })}\n      {...(isNativeButtonElement && !hasExplicitTypeAttribute ? { type: 'button' } : {})}\n    >\n      {props.loading ? (\n        <>\n          {/**\n           * We need a wrapper to set `visibility: hidden` to hide the button content whilst we show the `Spinner`.\n           * The button is a flex container with a `gap`, so we use `display: contents` to ensure the correct flex layout.\n           *\n           * However, `display: contents` removes the content from the accessibility tree in some browsers,\n           * so we force remove it with `aria-hidden` and re-add it in the tree with `VisuallyHidden`\n           */}\n          <span style={{ display: 'contents', visibility: 'hidden' }} aria-hidden>\n            {children}\n          </span>\n\n          {/* The label stays the name; the hidden \"Loading\" only describes (aria-describedby reads hidden text). */}\n          <VisuallyHidden>\n            <span id={describedById} aria-hidden>\n              Loading\n            </span>\n            {children}\n          </VisuallyHidden>\n\n          {/* Centered spinner overlay during loading state */}\n          <Flex asChild align=\"center\" justify=\"center\" position=\"absolute\" inset=\"0\">\n            <span>\n              <Spinner aria-hidden=\"true\" />\n            </span>\n          </Flex>\n        </>\n      ) : (\n        children\n      )}\n    </Comp>\n  );\n});\nBaseButton.displayName = 'BaseButton';\n\n/** Whether the first or last rendered node of `element` (blank text and comments skipped) is an svg. */\nfunction edgeIsSvg(element: Element, edge: 'start' | 'end'): boolean {\n  let node = edge === 'start' ? element.firstChild : element.lastChild;\n  while (node) {\n    const blank =\n      node.nodeType === Node.COMMENT_NODE || (node.nodeType === Node.TEXT_NODE && !node.textContent?.trim());\n    if (!blank) break;\n    node = edge === 'start' ? node.nextSibling : node.previousSibling;\n  }\n  return node?.nodeType === Node.ELEMENT_NODE && (node as Element).localName === 'svg';\n}\n\nexport { BaseButton };\nexport type { BaseButtonProps };\n"],
-  "mappings": "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",
-  "names": ["React", "classNames", "Slot", "useComposedRefs", "useLayoutEffect", "BaseButton", "ownProps", "forwardedRef", "props", "useThemeSizeProps", "baseButtonPropDefs", "className", "children", "asChild", "as", "color", "radius", "nativeDisabled", "baseButtonProps", "extractProps", "loading", "disabled", "onClick", "ariaDescribedByProp", "handleClick", "event", "childEdges", "content", "flatten", "nodes", "node", "items", "isIcon", "domEdges", "setDomEdges", "elementRef", "composedRef", "useComposedRefs", "useLayoutEffect", "element", "iconStart", "edgeIsSvg", "iconEnd", "prev", "Comp", "Slot", "shouldPassDisabled", "isNativeButtonElement", "hasExplicitTypeAttribute", "loadingId", "describedById", "accessibilityProps", "classNames", "VisuallyHidden", "Flex", "Spinner", "edge"]
-}

package/dist/esm/chunk-A3YQIJDA.js

@@ -1,2 +0,0 @@
-import{a as i}from"./chunk-HIEGLLY7.js";import{a as p}from"./chunk-BJUCBOGU.js";import{a as r}from"./chunk-ELAW7ZUG.js";import*as e from"react";import l from"classnames";var c=e.forwardRef((a,o)=>{let{className:t,children:n,loading:m,...f}=r(a,i);if(!m)return n;let s=e.createElement("span",{...f,ref:o,className:l("kui-Spinner",t)},e.createElement("span",{className:"kui-SpinnerLeaf"}),e.createElement("span",{className:"kui-SpinnerLeaf"}),e.createElement("span",{className:"kui-SpinnerLeaf"}),e.createElement("span",{className:"kui-SpinnerLeaf"}),e.createElement("span",{className:"kui-SpinnerLeaf"}),e.createElement("span",{className:"kui-SpinnerLeaf"}),e.createElement("span",{className:"kui-SpinnerLeaf"}),e.createElement("span",{className:"kui-SpinnerLeaf"}));return n===void 0?s:e.createElement(p,{asChild:!0,position:"relative",align:"center",justify:"center"},e.createElement("span",null,e.createElement("span",{"aria-hidden":!0,style:{display:"contents",visibility:"hidden"},inert:void 0},n),e.createElement(p,{asChild:!0,align:"center",justify:"center",position:"absolute",inset:"0"},e.createElement("span",null,s))))});c.displayName="Spinner";export{c as a};
-//# sourceMappingURL=chunk-A3YQIJDA.js.map

package/dist/esm/chunk-A3YQIJDA.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/spinner.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { Flex } from './flex.js';\nimport { spinnerPropDefs } from './spinner.props.js';\nimport { extractProps } from '../helpers/extract-props.js';\n\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype SpinnerElement = React.ElementRef<'span'>;\ntype SpinnerOwnProps = GetPropDefTypes<typeof spinnerPropDefs>;\ninterface SpinnerProps\n  extends ComponentPropsWithout<'span', RemovedProps>,\n    SpinnerOwnProps {}\nconst Spinner = React.forwardRef<SpinnerElement, SpinnerProps>((props, forwardedRef) => {\n  const { className, children, loading, ...spinnerProps } = extractProps(\n    props,\n    spinnerPropDefs\n  );\n\n  if (!loading) return children;\n\n  const spinner = (\n    <span {...spinnerProps} ref={forwardedRef} className={classNames('kui-Spinner', className)}>\n      <span className=\"kui-SpinnerLeaf\" />\n      <span className=\"kui-SpinnerLeaf\" />\n      <span className=\"kui-SpinnerLeaf\" />\n      <span className=\"kui-SpinnerLeaf\" />\n      <span className=\"kui-SpinnerLeaf\" />\n      <span className=\"kui-SpinnerLeaf\" />\n      <span className=\"kui-SpinnerLeaf\" />\n      <span className=\"kui-SpinnerLeaf\" />\n    </span>\n  );\n\n  if (children === undefined) return spinner;\n\n  return (\n    <Flex asChild position=\"relative\" align=\"center\" justify=\"center\">\n      <span>\n        {/**\n         * `display: contents` removes the content from the accessibility tree in some browsers,\n         * so we force remove it with `aria-hidden`\n         */}\n        <span aria-hidden style={{ display: 'contents', visibility: 'hidden' }} inert={undefined}>\n          {children}\n        </span>\n\n        <Flex asChild align=\"center\" justify=\"center\" position=\"absolute\" inset=\"0\">\n          <span>{spinner}</span>\n        </Flex>\n      </span>\n    </Flex>\n  );\n});\nSpinner.displayName = 'Spinner';\n\nexport { Spinner };\nexport type { SpinnerProps };\n"],
-  "mappings": "wHAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAcvB,IAAMC,EAAgB,aAAyC,CAACC,EAAOC,IAAiB,CACtF,GAAM,CAAE,UAAAC,EAAW,SAAAC,EAAU,QAAAC,EAAS,GAAGC,CAAa,EAAIC,EACxDN,EACAO,CACF,EAEA,GAAI,CAACH,EAAS,OAAOD,EAErB,IAAMK,EACJ,gBAAC,QAAM,GAAGH,EAAc,IAAKJ,EAAc,UAAWQ,EAAW,cAAeP,CAAS,GACvF,gBAAC,QAAK,UAAU,kBAAkB,EAClC,gBAAC,QAAK,UAAU,kBAAkB,EAClC,gBAAC,QAAK,UAAU,kBAAkB,EAClC,gBAAC,QAAK,UAAU,kBAAkB,EAClC,gBAAC,QAAK,UAAU,kBAAkB,EAClC,gBAAC,QAAK,UAAU,kBAAkB,EAClC,gBAAC,QAAK,UAAU,kBAAkB,EAClC,gBAAC,QAAK,UAAU,kBAAkB,CACpC,EAGF,OAAIC,IAAa,OAAkBK,EAGjC,gBAACE,EAAA,CAAK,QAAO,GAAC,SAAS,WAAW,MAAM,SAAS,QAAQ,UACvD,gBAAC,YAKC,gBAAC,QAAK,cAAW,GAAC,MAAO,CAAE,QAAS,WAAY,WAAY,QAAS,EAAG,MAAO,QAC5EP,CACH,EAEA,gBAACO,EAAA,CAAK,QAAO,GAAC,MAAM,SAAS,QAAQ,SAAS,SAAS,WAAW,MAAM,KACtE,gBAAC,YAAMF,CAAQ,CACjB,CACF,CACF,CAEJ,CAAC,EACDT,EAAQ,YAAc",
-  "names": ["React", "classNames", "Spinner", "props", "forwardedRef", "className", "children", "loading", "spinnerProps", "extractProps", "spinnerPropDefs", "spinner", "classNames", "Flex"]
-}

package/dist/esm/chunk-D3U4MWDZ.js

@@ -1 +0,0 @@
-//# sourceMappingURL=chunk-D3U4MWDZ.js.map

package/dist/esm/chunk-IJRBX6EV.js

@@ -1,2 +0,0 @@
-import{a as P,b as L,c as G}from"./chunk-HCBR74BW.js";import{b as w,c as E}from"./chunk-IX5HIHVI.js";import{b as N,c as x}from"./chunk-PPZY7PJA.js";import{a as b}from"./chunk-IWCFJJBI.js";import{d as T}from"./chunk-3YLYGKFB.js";import{a as R}from"./chunk-ELAW7ZUG.js";import{a as j}from"./chunk-OS3FCYZY.js";var F={};j(F,{Content:()=>V,Group:()=>O,Item:()=>A,Label:()=>W,Root:()=>D,Separator:()=>B,Trigger:()=>z});import*as e from"react";import s from"classnames";import{Select as a,ScrollArea as u}from"radix-ui";var C=e.createContext({}),D=t=>{let{children:o,size:r,...i}=t,l=T(r,P.size);return e.createElement(a.Root,{...i},e.createElement(C.Provider,{value:e.useMemo(()=>({size:l}),[l])},o))};D.displayName="Select.Root";var z=e.forwardRef((t,o)=>{let r=e.useContext(C),{children:i,className:l,color:n,radius:d,placeholder:f,error:m,loading:c,disabled:p,readOnly:v,...y}=R({size:r?.size,...t},{size:P.size},L),{"aria-invalid":S,"aria-busy":g,"aria-disabled":h,"aria-readonly":I}=y,k=!!m||S===!0||S==="true",M=e.useMemo(()=>({"aria-invalid":k?!0:S,"aria-busy":c||g,"aria-disabled":p||h,"aria-readonly":v||I}),[k,S,c,g,p,h,v,I]);return e.createElement(a.Trigger,{asChild:!0,disabled:p},e.createElement("button",{"data-accent-color":n,"data-radius":d,"data-error":m,"data-loading":c,...y,...M,ref:o,className:s("kui-reset","kui-SelectTrigger",l)},e.createElement("span",{className:"kui-SelectTriggerInner"},e.createElement(a.Value,{placeholder:f},i)),e.createElement(a.Icon,{asChild:!0},c?e.createElement("div",{className:"kui-SelectIcon kui-SelectLoadingIcon","aria-hidden":"true"},e.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none"},e.createElement("circle",{cx:"8",cy:"8",r:"7",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeDasharray:"32",strokeDashoffset:"32",className:"kui-SelectLoadingIconCircle"}))):e.createElement(E,{className:"kui-SelectIcon"}))))});z.displayName="Select.Trigger";var V=e.forwardRef((t,o)=>{let r=e.useContext(C),{className:i,children:l,color:n,container:d,...f}=R({size:r?.size,...t},{size:P.size},G),m=N(),c=n||m.accentColor,p=b();return e.createElement(a.Portal,{container:d},e.createElement(x,{asChild:!0},e.createElement(a.Content,{"data-accent-color":c,sideOffset:4,...f,asChild:!1,ref:o,className:s("kui-PopperContent","kui-BaseMenuContent","kui-variant-soft","kui-SelectContent",i)},e.createElement(u.Root,{type:"auto",className:"kui-ScrollAreaRoot"},e.createElement(a.Viewport,{asChild:!0,className:s("kui-BaseMenuViewport","kui-SelectViewport")},e.createElement(u.Viewport,{ref:p,className:"kui-ScrollAreaViewport",style:{overflowY:void 0}},l)),e.createElement(u.Scrollbar,{className:"kui-ScrollAreaScrollbar",orientation:"vertical"},e.createElement(u.Thumb,{className:"kui-ScrollAreaThumb"}))))))});V.displayName="Select.Content";var A=e.forwardRef((t,o)=>{let{className:r,children:i,...l}=t,n=typeof i!="string";return e.createElement(a.Item,{...l,asChild:!1,ref:o,className:s("kui-reset","kui-BaseMenuItem","kui-SelectItem",{"kui-SelectItemRich":n},r)},e.createElement(a.ItemIndicator,{className:"kui-SelectItemIndicator"},e.createElement(w,{className:"kui-SelectItemIndicatorIcon"})),e.createElement(a.ItemText,null,i))});A.displayName="Select.Item";var O=e.forwardRef(({className:t,...o},r)=>e.createElement(a.Group,{...o,asChild:!1,ref:r,className:s("kui-SelectGroup",t)}));O.displayName="Select.Group";var W=e.forwardRef(({className:t,...o},r)=>e.createElement(a.Label,{...o,asChild:!1,ref:r,className:s("kui-BaseMenuLabel","kui-SelectLabel",t)}));W.displayName="Select.Label";var B=e.forwardRef(({className:t,...o},r)=>e.createElement(a.Separator,{...o,asChild:!1,ref:r,className:s("kui-BaseMenuSeparator","kui-SelectSeparator",t)}));B.displayName="Select.Separator";export{D as a,z as b,V as c,A as d,O as e,W as f,B as g,F as h};
-//# sourceMappingURL=chunk-IJRBX6EV.js.map

package/dist/esm/chunk-IJRBX6EV.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/select.tsx"],
-  "sourcesContent": ["'use client';\n\nimport { warnDeprecated } from '../helpers/warn-deprecated.js';\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Select as SelectPrimitive, ScrollArea as ScrollAreaPrimitive } from 'radix-ui';\n\nimport { extractProps } from '../helpers/extract-props.js';\nimport { useThemeSize } from '../helpers/theme-size.js';\nimport { ChevronDownIcon, ThickCheckIcon } from './icons.js';\nimport {\n  selectRootPropDefs,\n  selectTriggerPropDefs,\n  selectContentPropDefs,\n} from './select.props.js';\nimport { useThemeContext, Theme } from './theme.js';\nimport { useThumbSync } from '../hooks/use-thumb-sync.js';\n\nimport type { GetPropDefTypes } from '../props/prop-def.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\n\ntype SelectRootOwnProps = GetPropDefTypes<typeof selectRootPropDefs>;\n\ntype SelectContextValue = SelectRootOwnProps;\nconst SelectContext = React.createContext<SelectContextValue>({});\n\ninterface SelectRootProps extends SelectPrimitive.SelectProps, SelectContextValue {}\nconst SelectRoot: React.FC<SelectRootProps> = (props) => {\n  const { children, size: sizeProp, ...rootProps } = props;\n  const size = useThemeSize(sizeProp, selectRootPropDefs.size);\n  return (\n    <SelectPrimitive.Root {...rootProps}>\n      <SelectContext.Provider value={React.useMemo(() => ({ size }), [size])}>\n        {children}\n      </SelectContext.Provider>\n    </SelectPrimitive.Root>\n  );\n};\nSelectRoot.displayName = 'Select.Root';\n\ntype SelectTriggerElement = React.ElementRef<typeof SelectPrimitive.Trigger>;\ntype SelectTriggerOwnProps = GetPropDefTypes<typeof selectTriggerPropDefs>;\ninterface SelectTriggerProps\n  extends ComponentPropsWithout<typeof SelectPrimitive.Trigger, RemovedProps>,\n    SelectTriggerOwnProps {}\nconst SelectTrigger = React.forwardRef<SelectTriggerElement, SelectTriggerProps>(\n  (props, forwardedRef) => {\n    const context = React.useContext(SelectContext);\n    const {\n      children,\n      className,\n      color,\n      radius,\n      placeholder,\n      error,\n      loading,\n      disabled,\n      readOnly,\n      ...triggerProps\n    } = extractProps(\n      // Pass size value from the context to generate styles\n      { size: context?.size, ...props },\n      // Pass size prop def to allow it to be extracted\n      { size: selectRootPropDefs.size },\n      selectTriggerPropDefs,\n    );\n\n\n    // The props win when set; otherwise a caller's own aria-* (a form library's aria-invalid)\n    // stays, so both paths reach the accessibility tree and the CSS, as on TextField.\n    const {\n      'aria-invalid': ariaInvalid,\n      'aria-busy': ariaBusy,\n      'aria-disabled': ariaDisabled,\n      'aria-readonly': ariaReadOnly,\n    } = triggerProps;\n    const isInvalid = Boolean(error) || ariaInvalid === true || ariaInvalid === 'true';\n    const ariaProps = React.useMemo(\n      () => ({\n        'aria-invalid': isInvalid ? true : ariaInvalid,\n        'aria-busy': loading || ariaBusy,\n        'aria-disabled': disabled || ariaDisabled,\n        'aria-readonly': readOnly || ariaReadOnly,\n      }),\n      [isInvalid, ariaInvalid, loading, ariaBusy, disabled, ariaDisabled, readOnly, ariaReadOnly],\n    );\n\n    return (\n      // `disabled` goes to Radix, which merges it with Root's and sets the native attribute.\n      <SelectPrimitive.Trigger asChild disabled={disabled}>\n        <button\n          data-accent-color={color}\n          data-radius={radius}\n          data-error={error}\n          data-loading={loading}\n          {...triggerProps}\n          {...ariaProps}\n          ref={forwardedRef}\n          className={classNames('kui-reset', 'kui-SelectTrigger', className)}\n        >\n          <span className=\"kui-SelectTriggerInner\">\n            <SelectPrimitive.Value placeholder={placeholder}>{children}</SelectPrimitive.Value>\n          </span>\n          <SelectPrimitive.Icon asChild>\n            {loading ? (\n              <div className=\"kui-SelectIcon kui-SelectLoadingIcon\" aria-hidden=\"true\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n                  <circle\n                    cx=\"8\"\n                    cy=\"8\"\n                    r=\"7\"\n                    stroke=\"currentColor\"\n                    strokeWidth=\"2\"\n                    strokeLinecap=\"round\"\n                    strokeDasharray=\"32\"\n                    strokeDashoffset=\"32\"\n                    className=\"kui-SelectLoadingIconCircle\"\n                  />\n                </svg>\n              </div>\n            ) : (\n              <ChevronDownIcon className=\"kui-SelectIcon\" />\n            )}\n          </SelectPrimitive.Icon>\n        </button>\n      </SelectPrimitive.Trigger>\n    );\n  },\n);\nSelectTrigger.displayName = 'Select.Trigger';\n\ntype SelectContentElement = React.ElementRef<typeof SelectPrimitive.Content>;\ntype SelectContentOwnProps = GetPropDefTypes<typeof selectContentPropDefs>;\ninterface SelectContentProps\n  extends ComponentPropsWithout<typeof SelectPrimitive.Content, RemovedProps>,\n    SelectContentOwnProps {\n  container?: React.ComponentPropsWithoutRef<typeof SelectPrimitive.Portal>['container'];\n}\nconst SelectContent = React.forwardRef<SelectContentElement, SelectContentProps>(\n  (props, forwardedRef) => {\n    const context = React.useContext(SelectContext);\n    const { className, children, color, container, ...contentProps } = extractProps(\n      // Pass size value from the context to generate styles\n      { size: context?.size, ...props },\n      // Pass size prop def to allow it to be extracted\n      { size: selectRootPropDefs.size },\n      selectContentPropDefs,\n    );\n    const themeContext = useThemeContext();\n    const resolvedColor = color || themeContext.accentColor;\n    const setThumbViewport = useThumbSync<HTMLDivElement>();\n    return (\n      <SelectPrimitive.Portal container={container}>\n        <Theme asChild>\n          <SelectPrimitive.Content\n            data-accent-color={resolvedColor}\n            sideOffset={4}\n            {...contentProps}\n            asChild={false}\n            ref={forwardedRef}\n            className={classNames(\n              'kui-PopperContent',\n              'kui-BaseMenuContent',\n          'kui-variant-soft',\n              'kui-SelectContent',\n              className,\n            )}\n          >\n            <ScrollAreaPrimitive.Root type=\"auto\" className=\"kui-ScrollAreaRoot\">\n              <SelectPrimitive.Viewport\n                asChild\n                className={classNames('kui-BaseMenuViewport', 'kui-SelectViewport')}\n              >\n                <ScrollAreaPrimitive.Viewport\n                  ref={setThumbViewport}\n                  className=\"kui-ScrollAreaViewport\"\n                  style={{ overflowY: undefined }}\n                >\n                  {children}\n                </ScrollAreaPrimitive.Viewport>\n              </SelectPrimitive.Viewport>\n              <ScrollAreaPrimitive.Scrollbar\n                className=\"kui-ScrollAreaScrollbar\"\n                orientation=\"vertical\"\n              >\n                <ScrollAreaPrimitive.Thumb className=\"kui-ScrollAreaThumb\" />\n              </ScrollAreaPrimitive.Scrollbar>\n            </ScrollAreaPrimitive.Root>\n          </SelectPrimitive.Content>\n        </Theme>\n      </SelectPrimitive.Portal>\n    );\n  },\n);\nSelectContent.displayName = 'Select.Content';\n\ntype SelectItemElement = React.ElementRef<typeof SelectPrimitive.Item>;\ninterface SelectItemProps\n  extends ComponentPropsWithout<typeof SelectPrimitive.Item, RemovedProps> {}\nconst SelectItem = React.forwardRef<SelectItemElement, SelectItemProps>((props, forwardedRef) => {\n  const { className, children, ...itemProps } = props;\n\n  // Detect if this is rich content (not just a string)\n  const isRichContent = typeof children !== 'string';\n\n  return (\n    <SelectPrimitive.Item\n      {...itemProps}\n      asChild={false}\n      ref={forwardedRef}\n      className={classNames(\n        'kui-reset',\n        'kui-BaseMenuItem',\n        'kui-SelectItem',\n        { 'kui-SelectItemRich': isRichContent },\n        className,\n      )}\n    >\n      <SelectPrimitive.ItemIndicator className=\"kui-SelectItemIndicator\">\n        <ThickCheckIcon className=\"kui-SelectItemIndicatorIcon\" />\n      </SelectPrimitive.ItemIndicator>\n      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n    </SelectPrimitive.Item>\n  );\n});\nSelectItem.displayName = 'Select.Item';\n\ntype SelectGroupElement = React.ElementRef<typeof SelectPrimitive.Group>;\ninterface SelectGroupProps\n  extends ComponentPropsWithout<typeof SelectPrimitive.Group, RemovedProps> {}\nconst SelectGroup = React.forwardRef<SelectGroupElement, SelectGroupProps>(\n  ({ className, ...props }, forwardedRef) => (\n    <SelectPrimitive.Group\n      {...props}\n      asChild={false}\n      ref={forwardedRef}\n      className={classNames('kui-SelectGroup', className)}\n    />\n  ),\n);\nSelectGroup.displayName = 'Select.Group';\n\ntype SelectLabelElement = React.ElementRef<typeof SelectPrimitive.Label>;\ninterface SelectLabelProps\n  extends ComponentPropsWithout<typeof SelectPrimitive.Label, RemovedProps> {}\nconst SelectLabel = React.forwardRef<SelectLabelElement, SelectLabelProps>(\n  ({ className, ...props }, forwardedRef) => (\n    <SelectPrimitive.Label\n      {...props}\n      asChild={false}\n      ref={forwardedRef}\n      className={classNames('kui-BaseMenuLabel', 'kui-SelectLabel', className)}\n    />\n  ),\n);\nSelectLabel.displayName = 'Select.Label';\n\ntype SelectSeparatorElement = React.ElementRef<typeof SelectPrimitive.Separator>;\ninterface SelectSeparatorProps\n  extends ComponentPropsWithout<typeof SelectPrimitive.Separator, RemovedProps> {}\nconst SelectSeparator = React.forwardRef<SelectSeparatorElement, SelectSeparatorProps>(\n  ({ className, ...props }, forwardedRef) => (\n    <SelectPrimitive.Separator\n      {...props}\n      asChild={false}\n      ref={forwardedRef}\n      className={classNames('kui-BaseMenuSeparator', 'kui-SelectSeparator', className)}\n    />\n  ),\n);\nSelectSeparator.displayName = 'Select.Separator';\n\nexport {\n  SelectRoot as Root,\n  SelectTrigger as Trigger,\n  SelectContent as Content,\n  SelectItem as Item,\n  SelectGroup as Group,\n  SelectLabel as Label,\n  SelectSeparator as Separator,\n};\n\nexport type {\n  SelectRootProps as RootProps,\n  SelectTriggerProps as TriggerProps,\n  SelectContentProps as ContentProps,\n  SelectItemProps as ItemProps,\n  SelectGroupProps as GroupProps,\n  SelectLabelProps as LabelProps,\n  SelectSeparatorProps as SeparatorProps,\n};\n"],
-  "mappings": "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",
-  "names": ["select_exports", "__export", "SelectContent", "SelectGroup", "SelectItem", "SelectLabel", "SelectRoot", "SelectSeparator", "SelectTrigger", "React", "classNames", "SelectPrimitive", "ScrollAreaPrimitive", "SelectContext", "SelectRoot", "props", "children", "sizeProp", "rootProps", "size", "useThemeSize", "selectRootPropDefs", "SelectPrimitive", "SelectTrigger", "forwardedRef", "context", "className", "color", "radius", "placeholder", "error", "loading", "disabled", "readOnly", "triggerProps", "extractProps", "selectTriggerPropDefs", "ariaInvalid", "ariaBusy", "ariaDisabled", "ariaReadOnly", "isInvalid", "ariaProps", "classNames", "ChevronDownIcon", "SelectContent", "container", "contentProps", "selectContentPropDefs", "themeContext", "useThemeContext", "resolvedColor", "setThumbViewport", "useThumbSync", "Theme", "ScrollAreaPrimitive", "SelectItem", "itemProps", "isRichContent", "ThickCheckIcon", "SelectGroup", "SelectLabel", "SelectSeparator"]
-}

package/dist/esm/chunk-KMDXIZAG.js

@@ -1,2 +0,0 @@
-import{a as S}from"./chunk-PJR6GRZC.js";import{e as x}from"./chunk-3YLYGKFB.js";import{a as P}from"./chunk-ELAW7ZUG.js";import*as t from"react";import G from"classnames";import{Slider as b}from"radix-ui";var L=t.forwardRef((C,N)=>{let v=x(C,S.size),{className:A,color:V,radius:M,tabIndex:y,...n}=P(v,S),{ticks:o,showTickLabels:w,snapToTicks:p,unit:l}=v,u=n.min??0,s=n.max??100,c=n.value??n.defaultValue??[u],R=Array.isArray(c)&&c.length>1,D=n.step,i=t.useMemo(()=>o?[...o].sort((e,r)=>e.value-r.value):[],[o]),T=t.useCallback(e=>{if(!p||!i.length)return e;let r=0,a=i.length-1;if(e<=i[r].value)return i[r].value;if(e>=i[a].value)return i[a].value;for(;r<=a;){let f=Math.floor((r+a)/2);if(i[f].value===e)return e;i[f].value<e?r=f+1:a=f-1}let E=Math.abs(e-i[a].value),j=Math.abs(e-i[r].value);return E<=j?i[a].value:i[r].value},[p,i]),h=t.useCallback(e=>{let r=a=>l?`${a} ${l}`:a.toString();return e.length===1?`${r(e[0])} out of ${r(s)}`:e.length===2?`${r(e[0])} to ${r(e[1])} out of ${r(s)}`:`${e.map(r).join(", ")} out of ${r(s)}`},[l,s]),$=t.useMemo(()=>o?o.map((e,r)=>({...e,percentage:(e.value-u)/(s-u)*100,index:r})):null,[o,u,s]),m=t.useRef(null),d=t.useRef(null),{onValueChange:g}=n,k=t.useCallback(e=>{let r=p&&o?e.map(a=>T(a)):e;if(m.current){let a=h(r);m.current.textContent=a,d.current&&clearTimeout(d.current),d.current=setTimeout(()=>{m.current&&(m.current.textContent="")},1e3)}g?.(r)},[p,o,T,h,g]);return t.useEffect(()=>()=>{d.current&&clearTimeout(d.current)},[]),t.createElement("div",{className:"kui-SliderContainer"},t.createElement("div",{ref:m,"aria-live":"polite","aria-atomic":"true",className:"sr-only",style:{position:"absolute",left:"-10000px",width:"1px",height:"1px",overflow:"hidden"}}),t.createElement(b.Root,{"data-accent-color":V,"data-radius":M,ref:N,...n,step:D,onValueChange:k,asChild:!1,className:G("kui-SliderRoot",A),"aria-valuemin":u,"aria-valuemax":s,"aria-valuenow":Array.isArray(c)?c[0]:c,"aria-valuetext":h(c),"aria-label":v["aria-label"]||`${R?"Range":"Value"} slider`},t.createElement(b.Track,{className:"kui-SliderTrack"},t.createElement(b.Range,{className:"kui-SliderRange","data-inverted":n.inverted?"":void 0})),(n.value??n.defaultValue??[]).map((e,r)=>t.createElement(b.Thumb,{key:r,className:"kui-SliderThumb",...y!==void 0?{tabIndex:y}:void 0,"aria-label":R?`${r===0?"Minimum":r===1?"Maximum":`Thumb ${r+1}`} value: ${l?`${e} ${l}`:e}`:`Slider value: ${l?`${e} ${l}`:e}`,"aria-valuetext":l?`${e} ${l}`:e.toString()}))),$&&t.createElement("div",{className:"kui-SliderTicks",role:"group","aria-label":"Slider tick marks"},$.map(e=>t.createElement("button",{key:e.index,className:"kui-SliderTick",style:{left:`${e.percentage}%`,transform:"translateX(-50%)"},onClick:()=>{let r=n.value??n.defaultValue??[u],a=Array.isArray(r)?r.map(()=>e.value):[e.value];k(a)},"aria-label":`Set to ${e.label||(l?`${e.value} ${l}`:e.value)}`,"aria-describedby":e.label?void 0:`tick-${e.index}-value`,type:"button"},t.createElement("div",{className:"kui-SliderTickMark"}),e.label&&w!==!1&&t.createElement("div",{className:"kui-SliderTickLabel"},e.label),!e.label&&t.createElement("span",{id:`tick-${e.index}-value`,className:"sr-only"},l?`${e.value} ${l}`:e.value)))))});L.displayName="Slider";export{L as a};
-//# sourceMappingURL=chunk-KMDXIZAG.js.map