@womp/kookie-ui 0.22.1 → 0.23.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (126) hide show
  1. package/components.css +57 -2
  2. package/dist/cjs/components/_internal/base-button.d.ts.map +1 -1
  3. package/dist/cjs/components/_internal/base-button.js +1 -1
  4. package/dist/cjs/components/_internal/base-button.js.map +4 -4
  5. package/dist/cjs/components/button.js +1 -1
  6. package/dist/cjs/components/button.js.map +4 -4
  7. package/dist/cjs/components/chatbar.js +1 -1
  8. package/dist/cjs/components/chatbar.js.map +4 -4
  9. package/dist/cjs/components/image.d.ts +23 -0
  10. package/dist/cjs/components/image.d.ts.map +1 -0
  11. package/dist/cjs/components/image.js +2 -0
  12. package/dist/cjs/components/image.js.map +7 -0
  13. package/dist/cjs/components/image.props.d.ts +19 -0
  14. package/dist/cjs/components/image.props.d.ts.map +1 -0
  15. package/dist/cjs/components/image.props.js +2 -0
  16. package/dist/cjs/components/image.props.js.map +7 -0
  17. package/dist/cjs/components/index.d.ts +1 -0
  18. package/dist/cjs/components/index.d.ts.map +1 -1
  19. package/dist/cjs/components/index.js +3 -3
  20. package/dist/cjs/components/index.js.map +4 -4
  21. package/dist/cjs/components/message-scroller.js +1 -1
  22. package/dist/cjs/components/message-scroller.js.map +4 -4
  23. package/dist/cjs/components/notice.js +1 -1
  24. package/dist/cjs/components/notice.js.map +4 -4
  25. package/dist/cjs/components/select.d.ts +1 -2
  26. package/dist/cjs/components/select.d.ts.map +1 -1
  27. package/dist/cjs/components/select.js +1 -1
  28. package/dist/cjs/components/select.js.map +3 -3
  29. package/dist/cjs/components/slider.d.ts.map +1 -1
  30. package/dist/cjs/components/slider.js +1 -1
  31. package/dist/cjs/components/slider.js.map +2 -2
  32. package/dist/cjs/components/spinner.d.ts.map +1 -1
  33. package/dist/cjs/components/spinner.js +1 -1
  34. package/dist/cjs/components/spinner.js.map +2 -2
  35. package/dist/cjs/components/toggle.js +2 -2
  36. package/dist/cjs/components/toggle.js.map +4 -4
  37. package/dist/cjs/components/toolbar.js +1 -1
  38. package/dist/cjs/components/toolbar.js.map +4 -4
  39. package/dist/cjs/index.js +4 -4
  40. package/dist/cjs/index.js.map +4 -4
  41. package/dist/esm/{chunk-PNAB6KCN.js → chunk-6DDOR73D.js} +2 -2
  42. package/dist/esm/{chunk-PNAB6KCN.js.map → chunk-6DDOR73D.js.map} +1 -1
  43. package/dist/esm/{chunk-LC5AK2ZD.js → chunk-BOL3VVSN.js} +2 -2
  44. package/dist/esm/chunk-EZYXYLR2.js +2 -0
  45. package/dist/esm/chunk-EZYXYLR2.js.map +7 -0
  46. package/dist/esm/{chunk-WKSXMFFF.js → chunk-FYT7TYGS.js} +2 -2
  47. package/dist/esm/chunk-GLV7VGBH.js +2 -0
  48. package/dist/esm/{chunk-KMDXIZAG.js.map → chunk-GLV7VGBH.js.map} +2 -2
  49. package/dist/esm/{chunk-NLXJZJNN.js → chunk-L2R62BOB.js} +2 -2
  50. package/dist/esm/chunk-M7I6ISPL.js +2 -0
  51. package/dist/esm/chunk-M7I6ISPL.js.map +7 -0
  52. package/dist/esm/chunk-MYYXOFU5.js +1 -0
  53. package/dist/esm/chunk-NQDMTOGB.js +2 -0
  54. package/dist/esm/chunk-NQDMTOGB.js.map +7 -0
  55. package/dist/esm/{chunk-YK3ZUMRQ.js → chunk-Q6MFPATL.js} +2 -2
  56. package/dist/esm/{chunk-T62PRLPN.js → chunk-QGCXTULQ.js} +2 -2
  57. package/dist/esm/chunk-UE3HATOA.js +2 -0
  58. package/dist/esm/chunk-UE3HATOA.js.map +7 -0
  59. package/dist/esm/chunk-XRCMPBAY.js +2 -0
  60. package/dist/esm/chunk-XRCMPBAY.js.map +7 -0
  61. package/dist/esm/{chunk-TJL47GIO.js → chunk-ZEX2DECM.js} +2 -2
  62. package/dist/esm/components/_internal/base-button.d.ts.map +1 -1
  63. package/dist/esm/components/_internal/base-button.js +1 -1
  64. package/dist/esm/components/button.js +1 -1
  65. package/dist/esm/components/chatbar.js +1 -1
  66. package/dist/esm/components/combobox.js +1 -1
  67. package/dist/esm/components/image.d.ts +23 -0
  68. package/dist/esm/components/image.d.ts.map +1 -0
  69. package/dist/esm/components/image.js +2 -0
  70. package/dist/esm/components/image.js.map +7 -0
  71. package/dist/esm/components/image.props.d.ts +19 -0
  72. package/dist/esm/components/image.props.d.ts.map +1 -0
  73. package/dist/esm/components/image.props.js +2 -0
  74. package/dist/esm/components/image.props.js.map +7 -0
  75. package/dist/esm/components/index.d.ts +1 -0
  76. package/dist/esm/components/index.d.ts.map +1 -1
  77. package/dist/esm/components/index.js +1 -1
  78. package/dist/esm/components/message-scroller.js +1 -1
  79. package/dist/esm/components/notice.js +1 -1
  80. package/dist/esm/components/select.d.ts +1 -2
  81. package/dist/esm/components/select.d.ts.map +1 -1
  82. package/dist/esm/components/select.js +1 -1
  83. package/dist/esm/components/slider.d.ts.map +1 -1
  84. package/dist/esm/components/slider.js +1 -1
  85. package/dist/esm/components/spinner.d.ts.map +1 -1
  86. package/dist/esm/components/spinner.js +1 -1
  87. package/dist/esm/components/toggle.js +1 -1
  88. package/dist/esm/components/toolbar.js +1 -1
  89. package/dist/esm/helpers/index.js +1 -1
  90. package/dist/esm/index.js +1 -1
  91. package/dist/esm/props/index.js +1 -1
  92. package/package.json +1 -1
  93. package/src/components/_internal/base-button.css +6 -0
  94. package/src/components/_internal/base-button.tsx +5 -5
  95. package/src/components/accordion.css +0 -1
  96. package/src/components/combobox.css +13 -0
  97. package/src/components/image.css +33 -0
  98. package/src/components/image.props.ts +18 -0
  99. package/src/components/image.tsx +71 -0
  100. package/src/components/index.css +1 -0
  101. package/src/components/index.tsx +1 -0
  102. package/src/components/select.tsx +77 -29
  103. package/src/components/shell.css +12 -0
  104. package/src/components/slider.css +1 -0
  105. package/src/components/slider.tsx +3 -12
  106. package/src/components/spinner.css +19 -1
  107. package/src/components/spinner.tsx +11 -9
  108. package/src/styles/tokens/color.css +1 -22
  109. package/styles.css +57 -23
  110. package/tokens/base.css +0 -21
  111. package/tokens.css +0 -21
  112. package/dist/esm/chunk-3YWVE5GL.js +0 -2
  113. package/dist/esm/chunk-3YWVE5GL.js.map +0 -7
  114. package/dist/esm/chunk-A3YQIJDA.js +0 -2
  115. package/dist/esm/chunk-A3YQIJDA.js.map +0 -7
  116. package/dist/esm/chunk-D3U4MWDZ.js +0 -1
  117. package/dist/esm/chunk-IJRBX6EV.js +0 -2
  118. package/dist/esm/chunk-IJRBX6EV.js.map +0 -7
  119. package/dist/esm/chunk-KMDXIZAG.js +0 -2
  120. /package/dist/esm/{chunk-LC5AK2ZD.js.map → chunk-BOL3VVSN.js.map} +0 -0
  121. /package/dist/esm/{chunk-WKSXMFFF.js.map → chunk-FYT7TYGS.js.map} +0 -0
  122. /package/dist/esm/{chunk-NLXJZJNN.js.map → chunk-L2R62BOB.js.map} +0 -0
  123. /package/dist/esm/{chunk-D3U4MWDZ.js.map → chunk-MYYXOFU5.js.map} +0 -0
  124. /package/dist/esm/{chunk-YK3ZUMRQ.js.map → chunk-Q6MFPATL.js.map} +0 -0
  125. /package/dist/esm/{chunk-T62PRLPN.js.map → chunk-QGCXTULQ.js.map} +0 -0
  126. /package/dist/esm/{chunk-TJL47GIO.js.map → chunk-ZEX2DECM.js.map} +0 -0
package/tokens.css CHANGED
@@ -3475,30 +3475,9 @@
3475
3475
  }
3476
3476
  .kui-theme,
3477
3477
  [data-accent-color]:where(:not([data-accent-color=''], [data-accent-color='gray'])) {
3478
- --focus-1: var(--accent-1);
3479
- --focus-2: var(--accent-2);
3480
- --focus-3: var(--accent-3);
3481
- --focus-4: var(--accent-4);
3482
- --focus-5: var(--accent-5);
3483
- --focus-6: var(--accent-6);
3484
- --focus-7: var(--accent-7);
3485
3478
  --focus-8: var(--accent-8);
3486
- --focus-9: var(--accent-9);
3487
- --focus-10: var(--accent-10);
3488
- --focus-11: var(--accent-11);
3489
- --focus-12: var(--accent-12);
3490
- --focus-a1: var(--accent-a1);
3491
3479
  --focus-a2: var(--accent-a2);
3492
- --focus-a3: var(--accent-a3);
3493
- --focus-a4: var(--accent-a4);
3494
3480
  --focus-a5: var(--accent-a5);
3495
- --focus-a6: var(--accent-a6);
3496
- --focus-a7: var(--accent-a7);
3497
- --focus-a8: var(--accent-a8);
3498
- --focus-a9: var(--accent-a9);
3499
- --focus-a10: var(--accent-a10);
3500
- --focus-a11: var(--accent-a11);
3501
- --focus-a12: var(--accent-a12);
3502
3481
  --accent-ink-mix: 45%;
3503
3482
  --accent-ink: color-mix(in oklab, var(--accent-11), var(--accent-12) var(--accent-ink-mix));
3504
3483
  --accent-ink-muted: color-mix(in oklab, var(--accent-ink) 74%, transparent);
@@ -1,2 +0,0 @@
1
- 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};
2
- //# sourceMappingURL=chunk-3YWVE5GL.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/_internal/base-button.tsx"],
4
- "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"],
5
- "mappings": "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",
6
- "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"]
7
- }
@@ -1,2 +0,0 @@
1
- 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};
2
- //# sourceMappingURL=chunk-A3YQIJDA.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/spinner.tsx"],
4
- "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"],
5
- "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",
6
- "names": ["React", "classNames", "Spinner", "props", "forwardedRef", "className", "children", "loading", "spinnerProps", "extractProps", "spinnerPropDefs", "spinner", "classNames", "Flex"]
7
- }
@@ -1 +0,0 @@
1
- //# sourceMappingURL=chunk-D3U4MWDZ.js.map
@@ -1,2 +0,0 @@
1
- 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};
2
- //# sourceMappingURL=chunk-IJRBX6EV.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/components/select.tsx"],
4
- "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"],
5
- "mappings": "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",
6
- "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"]
7
- }
@@ -1,2 +0,0 @@
1
- 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};
2
- //# sourceMappingURL=chunk-KMDXIZAG.js.map