@skdx/react 0.30.0 → 0.32.0

package/dist/checkbox-group/CheckboxGroupItem.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 import type { CheckboxGroupItemProps } from './types.js';
 /**
  * One checkbox in a {@link CheckboxGroup}, wrapping {@link Checkbox} with `checked` driven by whether its `value` is in the group's value.
+ * Any children beyond the indicator render as a `<label>` beside the box, not inside it.
  *
  * @example
  * ```tsx
@@ -12,6 +13,6 @@ import type { CheckboxGroupItemProps } from './types.js';
  * ```
  */
 export declare const CheckboxGroupItem: {
-    ({ value, disabled: disabledProp, ref: forwardedRef, ...props }: CheckboxGroupItemProps): React.ReactNode;
+    ({ value, disabled: disabledProp, children, asChild, className, ref: forwardedRef, ...props }: CheckboxGroupItemProps): React.ReactNode;
     displayName: string;
 };

package/dist/checkbox-group/CheckboxGroupSelectAll.d.cts

@@ -1,7 +1,8 @@
-import type * as React from 'react';
+import * as React from 'react';
 import type { CheckboxGroupSelectAllProps } from './types.cjs';
 /**
  * Tri-state parent checkbox: checked when every enabled item is checked, indeterminate when some are, unchecked otherwise.
+ * Any children beyond the indicator render as a `<label>` beside the box, not inside it.
  *
  * @example
  * ```tsx
@@ -12,6 +13,6 @@ import type { CheckboxGroupSelectAllProps } from './types.cjs';
  * ```
  */
 export declare const CheckboxGroupSelectAll: {
-    ({ disabled: disabledProp, ref: forwardedRef, ...props }: CheckboxGroupSelectAllProps): React.ReactNode;
+    ({ disabled: disabledProp, children, asChild, className, ref: forwardedRef, ...props }: CheckboxGroupSelectAllProps): React.ReactNode;
     displayName: string;
 };

package/dist/checkbox-group/CheckboxGroupSelectAll.d.ts

@@ -1,7 +1,8 @@
-import type * as React from 'react';
+import * as React from 'react';
 import type { CheckboxGroupSelectAllProps } from './types.js';
 /**
  * Tri-state parent checkbox: checked when every enabled item is checked, indeterminate when some are, unchecked otherwise.
+ * Any children beyond the indicator render as a `<label>` beside the box, not inside it.
  *
  * @example
  * ```tsx
@@ -12,6 +13,6 @@ import type { CheckboxGroupSelectAllProps } from './types.js';
  * ```
  */
 export declare const CheckboxGroupSelectAll: {
-    ({ disabled: disabledProp, ref: forwardedRef, ...props }: CheckboxGroupSelectAllProps): React.ReactNode;
+    ({ disabled: disabledProp, children, asChild, className, ref: forwardedRef, ...props }: CheckboxGroupSelectAllProps): React.ReactNode;
     displayName: string;
 };

package/dist/chip/Chip.cjs

@@ -0,0 +1,2 @@
+'use client';
+"use strict";var e=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var s=Object.prototype.hasOwnProperty;var a=(p,o)=>{for(var t in o)e(p,t,{get:o[t],enumerable:!0})},n=(p,o,t,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of C(o))!s.call(p,r)&&r!==t&&e(p,r,{get:()=>o[r],enumerable:!(m=y(o,r))||m.enumerable});return p};var P=p=>n(e({},"__esModule",{value:!0}),p);var d={};a(d,{Chip:()=>i});module.exports=P(d);var f=require("../badge/Badge.cjs"),h=require("react/jsx-runtime");function i(p){return(0,h.jsx)(f.Badge,{...p})}i.displayName="Chip";0&&(module.exports={Chip});

package/dist/chip/Chip.d.cts

@@ -0,0 +1,9 @@
+import type { JSX } from 'react';
+import type { ChipProps } from './types.cjs';
+/**
+ * Chip alias of {@link Badge}: the same component under the name MUI users look for, with nothing changed. Every Badge prop applies; reach for Badge itself for full control.
+ */
+export declare function Chip(props: ChipProps): JSX.Element;
+export declare namespace Chip {
+    var displayName: string;
+}

package/dist/chip/Chip.d.ts

@@ -0,0 +1,9 @@
+import type { JSX } from 'react';
+import type { ChipProps } from './types.js';
+/**
+ * Chip alias of {@link Badge}: the same component under the name MUI users look for, with nothing changed. Every Badge prop applies; reach for Badge itself for full control.
+ */
+export declare function Chip(props: ChipProps): JSX.Element;
+export declare namespace Chip {
+    var displayName: string;
+}

package/dist/chip/Chip.js

@@ -0,0 +1,2 @@
+'use client';
+import{Badge as r}from"../badge/Badge.js";import{jsx as t}from"react/jsx-runtime";function p(o){return t(r,{...o})}p.displayName="Chip";export{p as Chip};

package/dist/chip/index.d.cts

@@ -0,0 +1,2 @@
+export { Chip } from './Chip.cjs';
+export type { ChipProps } from './types.cjs';

package/dist/chip/index.d.ts

@@ -0,0 +1,2 @@
+export { Chip } from './Chip.js';
+export type { ChipProps } from './types.js';

package/dist/chip/types.d.cts

@@ -0,0 +1,3 @@
+import type { BadgeProps } from '../badge/types.cjs';
+/** Props for {@link Chip}: every Badge prop. */
+export type ChipProps = BadgeProps;

package/dist/chip/types.d.ts

@@ -0,0 +1,3 @@
+import type { BadgeProps } from '../badge/types.js';
+/** Props for {@link Chip}: every Badge prop. */
+export type ChipProps = BadgeProps;

package/dist/color-picker/ColorPicker.cjs

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var vo=Object.create;var z=Object.defineProperty;var So=Object.getOwnPropertyDescriptor;var wo=Object.getOwnPropertyNames;var go=Object.getPrototypeOf,Eo=Object.prototype.hasOwnProperty;var Do=(e,o)=>{for(var r in o)z(e,r,{get:o[r],enumerable:!0})},Ae=(e,o,r,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let t of wo(o))!Eo.call(e,t)&&t!==r&&z(e,t,{get:()=>o[t],enumerable:!(a=So(o,t))||a.enumerable});return e};var A=(e,o,r)=>(r=e!=null?vo(go(e)):{},Ae(o||!e||!e.__esModule?z(r,"default",{value:e,enumerable:!0}):r,e)),Ao=e=>Ae(z({},"__esModule",{value:!0}),e);var $o={};Do($o,{ColorPicker:()=>Re,ColorPickerAlphaSlider:()=>J,ColorPickerAlphaSliderThumb:()=>Y,ColorPickerArea:()=>j,ColorPickerAreaThumb:()=>oe,ColorPickerEyeDropper:()=>te,ColorPickerFormatSelect:()=>ko,ColorPickerHueSlider:()=>ae,ColorPickerHueSliderThumb:()=>ne,ColorPickerInput:()=>ie,ColorPickerProvider:()=>ho,ColorPickerSwatch:()=>ue,ColorPickerSwatchGroup:()=>de,ColorPickerSwatchGroupProvider:()=>to,SWATCH_SELECTOR:()=>be,useColorPickerContext:()=>d,useColorPickerSwatchGroupContext:()=>ye});module.exports=Ao($o);var b=A(require("react"),1),so=require("../utils/appearance.cjs"),E=require("../utils/color.cjs"),uo=require("../utils/createContext.cjs"),mo=require("../utils/liveAnnouncer.cjs"),po=require("../utils/part.cjs"),fo=require("../utils/primitive.cjs"),Co=require("../utils/useCallbackRef.cjs"),xe=require("../utils/useControllableState.cjs");var Te=require("../utils/color.cjs"),Ne=require("../utils/part.cjs"),L=require("../utils/primitive.cjs");var He=require("../utils/clamp.cjs"),_=require("../utils/direction.cjs");var g=A(require("react"),1),Ce=require("../utils/clamp.cjs");function X(e){let o=g.useRef(e);g.useEffect(()=>{o.current=e});let[r,a]=g.useState(!1),t=g.useRef(null),i=(c,s)=>{let n=s.getBoundingClientRect();return{x:n.width?(0,Ce.clamp)((c.clientX-n.left)/n.width,0,1):0,y:n.height?(0,Ce.clamp)((c.clientY-n.top)/n.height,0,1):0}},l=c=>{if(t.current)return;let s=c.currentTarget,{pointerId:n}=c;s.setPointerCapture?.(n);let m=i(c,s);a(!0),o.current.onRatioChange(m,c.nativeEvent);let f=h=>{if(h.pointerId!==n)return;let x=i(h,s);x.x===m.x&&x.y===m.y||(m=x,o.current.onRatioChange(x,h))},P=h=>{h.pointerId===n&&(t.current?.(),a(!1),o.current.onRatioChangeEnd?.(h))},C=s.ownerDocument;C.addEventListener("pointermove",f),C.addEventListener("pointerup",P),C.addEventListener("pointercancel",P),t.current=()=>{C.removeEventListener("pointermove",f),C.removeEventListener("pointerup",P),C.removeEventListener("pointercancel",P),t.current=null}};return g.useEffect(()=>()=>t.current?.(),[]),{onPointerDown:l,dragging:r}}var Ho=10;function S(e){return Math.round(e*100)/100}function H(e,o,r){let a=o>0?Math.round(Math.round(e/o)*o*1e6)/1e6:e;return(0,He.clamp)(a,0,r)}function he(e){return e>0?e:1}function q(e){let{channel:o,consumerName:r,max:a,value:t,orientation:i,defaultLabel:l,valueText:c,onChange:s}=e,n=d(r),m=(0,_.useDirection)(),f=e.limit??a,P=u=>H(u,n.step,f),{onPointerDown:C,dragging:h}=X({onRatioChange:u=>{let v=i==="horizontal"?u.x:1-u.y;s(P(v*a))},onRatioChangeEnd:()=>n.commit()}),x=u=>{if(!n.interactive)return;let v=(0,_.directionalKey)(u.key,u.currentTarget,m);if(v==="Home"||v==="End"){u.preventDefault(),s(v==="Home"?0:f);return}let D=he(n.step),G=Math.max(a/10,D),R={ArrowRight:D,ArrowUp:D,ArrowLeft:-D,ArrowDown:-D,PageUp:G,PageDown:-G}[v];if(R===void 0)return;u.preventDefault();let $=u.shiftKey&&v.startsWith("Arrow")?Ho:1;s(P(t+R*$))};return{props:{role:"slider","aria-label":l,"aria-valuemin":0,"aria-valuemax":a,"aria-valuenow":S(t),"aria-valuetext":c(t),"aria-orientation":i,"aria-disabled":n.disabled||void 0,"aria-readonly":n.readOnly||void 0,tabIndex:n.disabled?-1:0,"data-channel":o,"data-orientation":i,"data-value":S(t),"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,"data-dragging":h?"":void 0},onKeyDown:x,onPointerDown:u=>{n.interactive&&C(u)},style:{touchAction:"none"},dragging:h}}var Fe=require("react/jsx-runtime"),J=({orientation:e="horizontal",label:o="Opacity",ref:r,...a})=>{let t=d("ColorPickerAlphaSlider"),{color:i}=t,l=q({channel:"alpha",consumerName:"ColorPickerAlphaSlider",max:100,value:i.a*100,orientation:e,defaultLabel:o,valueText:c=>`${Math.round(c)}% opaque, ${(0,Te.formatColor)(i,"hex",!1)}`,onChange:c=>t.setColor({...i,a:c/100})});return t.alpha?(0,Fe.jsx)(L.Primitive.div,{...l.props,...a,...(0,Ne.skdxPart)("color-picker","alpha-slider",a.className),ref:r,onKeyDown:(0,L.composeEventHandlers)(a.onKeyDown,l.onKeyDown),onPointerDown:(0,L.composeEventHandlers)(a.onPointerDown,l.onPointerDown),style:{...l.style,...a.style}}):null};J.displayName="ColorPickerAlphaSlider";var Oe=require("../utils/part.cjs"),Ve=require("../utils/primitive.cjs");var Le=require("react/jsx-runtime"),Y=({ref:e,...o})=>{let r=d("ColorPickerAlphaSliderThumb");return(0,Le.jsx)(Ve.Primitive.div,{"aria-hidden":!0,"data-channel":"alpha","data-value":S(r.color.a*100),"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,...o,...(0,Oe.skdxPart)("color-picker","alpha-slider-thumb",o.className),ref:e})};Y.displayName="ColorPickerAlphaSliderThumb";var Q=A(require("react"),1),Ie=require("../utils/part.cjs"),Z=require("../utils/primitive.cjs");var Ke=require("react/jsx-runtime"),j=({ref:e,...o})=>{let r=d("ColorPickerArea"),a=Q.useRef(r.color);Q.useInsertionEffect(()=>{a.current=r.color});let{onPointerDown:t,dragging:i}=X({onRatioChange:({x:l,y:c})=>r.setColor({...a.current,s:H(l*100,r.step,100),b:H((1-c)*100,r.step,100)}),onRatioChangeEnd:()=>r.commit()});return(0,Ke.jsx)(Z.Primitive.div,{"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,"data-dragging":i?"":void 0,...o,...(0,Ie.skdxPart)("color-picker","area",o.className),ref:e,onPointerDown:(0,Z.composeEventHandlers)(o.onPointerDown,l=>{r.interactive&&t(l)}),style:{touchAction:"none",...o.style}})};j.displayName="ColorPickerArea";var ee=require("../utils/direction.cjs"),Ge=require("../utils/part.cjs"),Pe=require("../utils/primitive.cjs");var T=require("react/jsx-runtime"),To=10;function Me({axis:e,label:o}){let r=d("ColorPickerAreaThumb"),a=(0,ee.useDirection)(),{color:t,step:i}=r,l=e==="saturation"?t.s:t.b,c=s=>{if(!r.interactive)return;let n=(0,ee.directionalKey)(s.key,s.currentTarget,a),m=he(i),f=s.shiftKey?m*To:m,P=(u,v)=>H(u+v,i,100),C=null,h=n==="ArrowRight"||n==="ArrowUp";if(h||(n==="ArrowLeft"||n==="ArrowDown")){let u=h?f:-f;C=e==="saturation"?{...t,s:P(t.s,u)}:{...t,b:P(t.b,u)}}else if(n==="Home"||n==="End"){let u=n==="Home"?0:100;C=e==="saturation"?{...t,s:u}:{...t,b:u}}C&&(s.preventDefault(),r.setColor(C))};return(0,T.jsx)(Pe.Primitive.span,{role:"slider","aria-label":o,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":S(l),"aria-valuetext":`${Math.round(t.s)}% saturation, ${Math.round(t.b)}% brightness, ${r.describe(t)}`,"aria-orientation":e==="saturation"?"horizontal":"vertical","aria-disabled":r.disabled||void 0,"aria-readonly":r.readOnly||void 0,tabIndex:r.disabled?-1:0,"data-channel":e,"data-value":S(l),"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,onKeyDown:c})}var oe=({saturationLabel:e="Saturation",brightnessLabel:o="Brightness",children:r,ref:a,...t})=>{let i=d("ColorPickerAreaThumb");return(0,T.jsxs)(Pe.Primitive.div,{"data-value":i.value,"data-disabled":i.disabled?"":void 0,"data-readonly":i.readOnly?"":void 0,...t,...(0,Ge.skdxPart)("color-picker","area-thumb",t.className),ref:a,children:[(0,T.jsx)(Me,{axis:"saturation",label:e}),(0,T.jsx)(Me,{axis:"brightness",label:o}),r]})};oe.displayName="ColorPickerAreaThumb";var $e=A(require("react"),1),Ue=require("../utils/color.cjs"),Be=require("../utils/part.cjs"),re=require("../utils/primitive.cjs");var We=require("react/jsx-runtime"),No=()=>()=>{},Fo=()=>typeof window<"u"&&"EyeDropper"in window,Oo=()=>!1,te=({ref:e,...o})=>{let r=d("ColorPickerEyeDropper"),a=$e.useSyncExternalStore(No,Fo,Oo),t=()=>{let i=window.EyeDropper;i&&new i().open().then(({sRGBHex:l})=>{let c=(0,Ue.parseColor)(l);c&&r.setColor({...c,a:r.color.a},{announce:!0})}).catch(()=>{})};return a?(0,We.jsx)(re.Primitive.button,{type:"button","aria-label":"Pick a colour from the screen","data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,disabled:r.disabled,...o,...(0,Be.skdxPart)("color-picker","eye-dropper",o.className),ref:e,onClick:(0,re.composeEventHandlers)(o.onClick,()=>{r.interactive&&t()})}):null};te.displayName="ColorPickerEyeDropper";var ze=require("../utils/part.cjs"),I=require("../utils/primitive.cjs");var Xe=require("react/jsx-runtime"),ae=({orientation:e="horizontal",label:o="Hue",ref:r,...a})=>{let t=d("ColorPickerHueSlider"),{color:i,step:l}=t,c=l>0?Math.floor(359/l)*l:359,s=q({channel:"hue",consumerName:"ColorPickerHueSlider",max:360,limit:c,value:i.h,orientation:e,defaultLabel:o,valueText:n=>`${Math.round(n)} degrees, ${t.describe(i)}`,onChange:n=>t.setColor({...i,h:n})});return(0,Xe.jsx)(I.Primitive.div,{...s.props,...a,...(0,ze.skdxPart)("color-picker","hue-slider",a.className),ref:r,onKeyDown:(0,I.composeEventHandlers)(a.onKeyDown,s.onKeyDown),onPointerDown:(0,I.composeEventHandlers)(a.onPointerDown,s.onPointerDown),style:{...s.style,...a.style}})};ae.displayName="ColorPickerHueSlider";var _e=require("../utils/part.cjs"),qe=require("../utils/primitive.cjs");var Je=require("react/jsx-runtime"),ne=({ref:e,...o})=>{let r=d("ColorPickerHueSliderThumb");return(0,Je.jsx)(qe.Primitive.div,{"aria-hidden":!0,"data-channel":"hue","data-value":S(r.color.h),"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,...o,...(0,_e.skdxPart)("color-picker","hue-slider-thumb",o.className),ref:e})};ne.displayName="ColorPickerHueSliderThumb";var Ye=A(require("react"),1),Qe=require("../utils/clamp.cjs"),p=require("../utils/color.cjs"),Ze=require("../utils/part.cjs"),N=require("../utils/primitive.cjs");var je=require("react/jsx-runtime"),Vo={red:{max:255,label:"Red",read:e=>(0,p.hsbToRgb)(e).r,write:(e,o)=>(0,p.rgbToHsb)({...(0,p.hsbToRgb)(e),r:o})},green:{max:255,label:"Green",read:e=>(0,p.hsbToRgb)(e).g,write:(e,o)=>(0,p.rgbToHsb)({...(0,p.hsbToRgb)(e),g:o})},blue:{max:255,label:"Blue",read:e=>(0,p.hsbToRgb)(e).b,write:(e,o)=>(0,p.rgbToHsb)({...(0,p.hsbToRgb)(e),b:o})},hue:{max:360,label:"Hue",read:e=>e.h,write:(e,o)=>({...e,h:o})},saturation:{max:100,label:"Saturation",read:e=>e.s,write:(e,o)=>({...e,s:o})},brightness:{max:100,label:"Brightness",read:e=>e.b,write:(e,o)=>({...e,b:o})},lightness:{max:100,label:"Lightness",read:e=>(0,p.hsbToHsl)(e).l,write:(e,o)=>(0,p.hslToHsb)({...(0,p.hsbToHsl)(e),l:o})},alpha:{max:100,label:"Opacity",read:e=>e.a*100,write:(e,o)=>({...e,a:o/100})}},ie=({channel:e,ref:o,...r})=>{let a=d("ColorPickerInput"),[t,i]=Ye.useState(null),l=e&&e!=="hex"?Vo[e]:null,c=a.value;l?c=String(Math.round(l.read(a.color))):e==="hex"&&(c=(0,p.formatColor)(a.color,"hex",a.alpha));let s=n=>{if(!a.interactive)return!1;if(l){let f=Number(n.trim());return n.trim()===""||!Number.isFinite(f)?!1:(a.setColor(l.write(a.color,(0,Qe.clamp)(f,0,l.max)),{announce:!0}),!0)}let m=(0,p.parseColor)(n);return m?(a.setColor(m,{announce:!0}),!0):!1};return(0,je.jsx)(N.Primitive.input,{type:"text",inputMode:l?"numeric":"text",autoComplete:"off",spellCheck:!1,"aria-label":l?l.label:"Colour value","data-channel":e??"value","data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,disabled:a.disabled,readOnly:a.readOnly,...r,...(0,Ze.skdxPart)("color-picker","input",r.className),ref:o,value:t??c,onChange:(0,N.composeEventHandlers)(r.onChange,n=>i(n.target.value)),onKeyDown:(0,N.composeEventHandlers)(r.onKeyDown,n=>{n.key==="Enter"?(n.preventDefault(),s(t??c),i(null)):n.key==="Escape"&&i(null)}),onBlur:(0,N.composeEventHandlers)(r.onBlur,()=>{t!==null&&s(t),i(null)})})};ie.displayName="ColorPickerInput";var ao=A(require("react"),1),K=require("../utils/color.cjs"),no=require("../utils/part.cjs"),M=require("../utils/primitive.cjs"),io=require("../utils/useRovingFocus.cjs");var le=A(require("react"),1),eo=require("../utils/composeRefs.cjs"),oo=require("../utils/createContext.cjs"),ro=require("../utils/part.cjs"),ce=require("../utils/primitive.cjs"),se=require("../utils/useRovingFocus.cjs");var ke=require("react/jsx-runtime"),be="[data-skdx-color-picker-swatch]",[to,ye]=(0,oo.createSafeContext)("ColorPickerSwatchGroup"),de=({loop:e=!0,ref:o,...r})=>{let a=d("ColorPickerSwatchGroup"),t=le.useRef(null),i=(0,eo.useComposedRefs)(o,t),[l,c]=le.useState(null),s=(0,se.useRovingFocus)({orientation:"both",loop:e,itemSelector:be});return(0,se.useRovingTabStop)(t,be,"data-value",l,c),(0,ke.jsx)(to,{activeValue:l,setActiveValue:c,children:(0,ke.jsx)(ce.Primitive.div,{role:"radiogroup","aria-disabled":a.disabled||void 0,"aria-readonly":a.readOnly||void 0,"data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,...r,...(0,ro.skdxPart)("color-picker","swatch-group",r.className),ref:i,onKeyDown:(0,ce.composeEventHandlers)(r.onKeyDown,s)})})};de.displayName="ColorPickerSwatchGroup";var lo=require("react/jsx-runtime"),ue=({value:e,disabled:o,ref:r,...a})=>{let t=d("ColorPickerSwatch"),i=ye("ColorPickerSwatch"),l=(0,K.parseColor)(e),c=t.disabled||o||l===null,s=l?(0,K.formatColor)(l,"hex",t.alpha):e,n=l!==null&&s===(0,K.formatColor)(t.color,"hex",t.alpha);ao.useLayoutEffect(()=>{n&&i.setActiveValue(e)},[n,e,i]);let m={"--skdx-color-picker-swatch-value":s,...a.style};return(0,lo.jsx)(M.Primitive.button,{type:"button",role:"radio","aria-checked":n,"aria-label":s,"aria-disabled":c||void 0,tabIndex:(0,io.rovingTabIndex)(i.activeValue!==null,i.activeValue===e,c),"data-skdx-color-picker-swatch":"","data-value":e,"data-state":n?"checked":"unchecked","data-disabled":c?"":void 0,"data-readonly":t.readOnly?"":void 0,disabled:c,...a,...(0,no.skdxPart)("color-picker","swatch",a.className),ref:r,onFocus:(0,M.composeEventHandlers)(a.onFocus,()=>{i.setActiveValue(e),!n&&l&&t.setColor(l,{announce:!0})}),onClick:(0,M.composeEventHandlers)(a.onClick,()=>{l&&t.setColor(l,{announce:!0})}),style:m})};ue.displayName="ColorPickerSwatch";var k=require("react/jsx-runtime"),co=({showInput:e,showSwatches:o,showEyeDropper:r,swatches:a=[]})=>(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(j,{children:(0,k.jsx)(oe,{})}),(0,k.jsx)(ae,{children:(0,k.jsx)(ne,{})}),(0,k.jsx)(J,{children:(0,k.jsx)(Y,{})}),e?(0,k.jsx)(ie,{}):null,o&&a.length>0?(0,k.jsx)(de,{"aria-label":"Preset colours",children:a.map(t=>(0,k.jsx)(ue,{value:t},t))}):null,r?(0,k.jsx)(te,{}):null]});var me=require("react/jsx-runtime"),Lo={h:0,s:0,b:0,a:1};function F(e){return Math.round(e*1e3)/1e3}var[ho,d]=(0,uo.createSafeContext)("ColorPicker");function Io(e,o){return{"data-disabled":e?"":void 0,"data-readonly":o?"":void 0}}function Ko({value:e,defaultValue:o,onValueChange:r,format:a,defaultFormat:t,onFormatChange:i}){let[l="hex",c]=(0,xe.useControllableState)({prop:a,defaultProp:t,onChange:i}),[s=o,n]=(0,xe.useControllableState)({prop:e,defaultProp:o,onChange:r}),[m,f]=b.useState(()=>(0,E.parseColor)(e??o)??Lo),[P,C]=b.useState(s);if(s!==P){C(s);let u=(0,E.parseColor)(s);u&&f(u)}let h=b.useRef(s);b.useInsertionEffect(()=>{h.current=s});let x=b.useRef(m);return b.useInsertionEffect(()=>{x.current=m}),{format:l,setFormatState:c,value:s,setValue:n,color:m,setColorState:f,setOwnValue:C,valueRef:h,colorRef:x}}var Re=({ref:e,...o})=>{let{value:r,defaultValue:a="#000000",onValueChange:t,onValueCommit:i,format:l,defaultFormat:c="hex",onFormatChange:s,alpha:n=!0,step:m=1,disabled:f=!1,readOnly:P=!1,showInput:C=!0,showSwatches:h=!0,showEyeDropper:x=!0,swatches:u=[],children:v,fullWidth:D,size:G,...O}=o,{format:R,setFormatState:$,value:Se,setValue:U,color:w,setColorState:we,setOwnValue:B,valueRef:pe,colorRef:ge}=Ko({value:r,defaultValue:a,onValueChange:t,format:l,defaultFormat:c,onFormatChange:s}),V=!f&&!P,fe=b.useCallback(y=>{let W=(0,E.formatColor)(y,"hex",!1);return n&&y.a<1?`${W}, ${Math.round(y.a*100)}% opaque`:W},[n]),yo=b.useCallback((y,W)=>{if(!V)return;let De=(0,E.formatColor)(y,R,n);we(y),B(De),U(De),W?.announce&&(0,mo.announce)(fe(y))},[V,R,n,U,fe,we,B]),xo=b.useCallback(y=>{V&&$(y)},[V,$]),Ee=b.useRef(R);b.useEffect(()=>{if(Ee.current===R)return;Ee.current=R;let y=(0,E.formatColor)(ge.current,R,n);y!==pe.current&&(B(y),U(y))},[R,n,U,ge,pe,B]);let Ro=(0,Co.useCallbackRef)(()=>i?.(pe.current));return(0,me.jsx)(ho,{color:w,value:Se,format:R,alpha:n,step:m,disabled:f,readOnly:P,interactive:V,describe:fe,setColor:yo,commit:Ro,setFormat:xo,children:(0,me.jsx)(fo.Primitive.div,{"data-value":Se,"data-format":R,...Io(f,P),...O,...(0,so.appearanceAttrs)({fullWidth:D,size:G},O),...(0,po.skdxPart)("color-picker","root",O.className),ref:e,style:{"--skdx-color-picker-hue":`${F(w.h)}deg`,"--skdx-color-picker-hue-position":`${F(w.h/360*100)}%`,"--skdx-color-picker-saturation":`${F(w.s)}%`,"--skdx-color-picker-brightness":`${F(w.b)}%`,"--skdx-color-picker-alpha":F(w.a),"--skdx-color-picker-alpha-position":`${F(w.a*100)}%`,"--skdx-color-picker-value":(0,E.formatColor)(w,"hex",n),...O.style},children:v??(0,me.jsx)(co,{showInput:C,showSwatches:h,showEyeDropper:x,swatches:u})})})};Re.displayName="ColorPicker";var Po=require("../utils/part.cjs"),bo=require("../utils/primitive.cjs");var ve=require("react/jsx-runtime"),Mo=["hex","rgb","hsl","hsb"],Go={hex:"HEX",rgb:"RGB",hsl:"HSL",hsb:"HSB"},ko=({formats:e=Mo,children:o,ref:r,...a})=>{let t=d("ColorPickerFormatSelect");return(0,ve.jsx)("select",{"aria-label":"Colour format","aria-readonly":t.readOnly||void 0,"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,disabled:t.disabled,...a,...(0,Po.skdxPart)("color-picker","format-select",a.className),ref:r,value:t.format,onChange:(0,bo.composeEventHandlers)(a.onChange,i=>t.setFormat(i.target.value)),children:o??e.map(i=>(0,ve.jsx)("option",{value:i,children:Go[i]},i))})};ko.displayName="ColorPickerFormatSelect";0&&(module.exports={ColorPicker,ColorPickerAlphaSlider,ColorPickerAlphaSliderThumb,ColorPickerArea,ColorPickerAreaThumb,ColorPickerEyeDropper,ColorPickerFormatSelect,ColorPickerHueSlider,ColorPickerHueSliderThumb,ColorPickerInput,ColorPickerProvider,ColorPickerSwatch,ColorPickerSwatchGroup,ColorPickerSwatchGroupProvider,SWATCH_SELECTOR,useColorPickerContext,useColorPickerSwatchGroupContext});
+"use strict";var So=Object.create;var W=Object.defineProperty;var wo=Object.getOwnPropertyDescriptor;var go=Object.getOwnPropertyNames;var Eo=Object.getPrototypeOf,Do=Object.prototype.hasOwnProperty;var Ao=(e,o)=>{for(var r in o)W(e,r,{get:o[r],enumerable:!0})},He=(e,o,r,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let t of go(o))!Do.call(e,t)&&t!==r&&W(e,t,{get:()=>o[t],enumerable:!(a=wo(o,t))||a.enumerable});return e};var H=(e,o,r)=>(r=e!=null?So(Eo(e)):{},He(o||!e||!e.__esModule?W(r,"default",{value:e,enumerable:!0}):r,e)),Ho=e=>He(W({},"__esModule",{value:!0}),e);var Uo={};Ao(Uo,{ColorPicker:()=>xe,ColorPickerAlphaSlider:()=>q,ColorPickerAlphaSliderThumb:()=>J,ColorPickerArea:()=>Z,ColorPickerAreaThumb:()=>ee,ColorPickerEyeDropper:()=>re,ColorPickerFormatSelect:()=>yo,ColorPickerHueSlider:()=>te,ColorPickerHueSliderThumb:()=>ae,ColorPickerInput:()=>ne,ColorPickerProvider:()=>Po,ColorPickerSwatch:()=>de,ColorPickerSwatchGroup:()=>ce,ColorPickerSwatchGroupProvider:()=>ao,SWATCH_SELECTOR:()=>Pe,useColorPickerContext:()=>d,useColorPickerSwatchGroupContext:()=>ke});module.exports=Ho(Uo);var h=H(require("react"),1),uo=require("../utils/appearance.cjs"),E=require("../utils/color.cjs"),mo=require("../utils/createContext.cjs"),po=require("../utils/liveAnnouncer.cjs"),fo=require("../utils/part.cjs"),Co=require("../utils/primitive.cjs"),ho=require("../utils/useCallbackRef.cjs"),ye=require("../utils/useControllableState.cjs");var Ne=require("../utils/color.cjs"),Fe=require("../utils/part.cjs"),L=require("../utils/primitive.cjs");var Te=require("../utils/clamp.cjs"),X=require("../utils/direction.cjs");var g=H(require("react"),1),fe=require("../utils/clamp.cjs");function z(e){let o=g.useRef(e);g.useEffect(()=>{o.current=e});let[r,a]=g.useState(!1),t=g.useRef(null),i=(s,c)=>{let n=c.getBoundingClientRect();return{x:n.width?(0,fe.clamp)((s.clientX-n.left)/n.width,0,1):0,y:n.height?(0,fe.clamp)((s.clientY-n.top)/n.height,0,1):0}},l=s=>{if(t.current)return;let c=s.currentTarget,{pointerId:n}=s;c.setPointerCapture?.(n);let m=i(s,c);a(!0),o.current.onRatioChange(m,s.nativeEvent);let f=P=>{if(P.pointerId!==n)return;let R=i(P,c);R.x===m.x&&R.y===m.y||(m=R,o.current.onRatioChange(R,P))},b=P=>{P.pointerId===n&&(t.current?.(),a(!1),o.current.onRatioChangeEnd?.(P))},C=c.ownerDocument;C.addEventListener("pointermove",f),C.addEventListener("pointerup",b),C.addEventListener("pointercancel",b),t.current=()=>{C.removeEventListener("pointermove",f),C.removeEventListener("pointerup",b),C.removeEventListener("pointercancel",b),t.current=null}};return g.useEffect(()=>()=>t.current?.(),[]),{onPointerDown:l,dragging:r}}var To=10;function S(e){return Math.round(e*100)/100}function T(e,o,r){let a=o>0?Math.round(Math.round(e/o)*o*1e6)/1e6:e;return(0,Te.clamp)(a,0,r)}function Ce(e){return e>0?e:1}function _(e){let{channel:o,consumerName:r,max:a,value:t,orientation:i,defaultLabel:l,valueText:s,onChange:c}=e,n=d(r),m=(0,X.useDirection)(),f=e.limit??a,b=u=>T(u,n.step,f),{onPointerDown:C,dragging:P}=z({onRatioChange:u=>{let y=i==="horizontal"?u.x:1-u.y;c(b(y*a))},onRatioChangeEnd:()=>n.commit()}),R=u=>{if(!n.interactive)return;let y=(0,X.directionalKey)(u.key,u.currentTarget,m);if(y==="Home"||y==="End"){u.preventDefault(),c(y==="Home"?0:f);return}let D=Ce(n.step),G=Math.max(a/10,D),A={ArrowRight:D,ArrowUp:D,ArrowLeft:-D,ArrowDown:-D,PageUp:G,PageDown:-G}[y];if(A===void 0)return;u.preventDefault();let v=u.shiftKey&&y.startsWith("Arrow")?To:1;c(b(t+A*v))};return{props:{role:"slider","aria-label":l,"aria-valuemin":0,"aria-valuemax":a,"aria-valuenow":S(t),"aria-valuetext":s(t),"aria-orientation":i,"aria-disabled":n.disabled||void 0,"aria-readonly":n.readOnly||void 0,tabIndex:n.disabled?-1:0,"data-channel":o,"data-orientation":i,"data-value":S(t),"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,"data-dragging":P?"":void 0},onKeyDown:R,onPointerDown:u=>{n.interactive&&C(u)},style:{touchAction:"none"},dragging:P}}var Oe=require("react/jsx-runtime"),q=({orientation:e="horizontal",label:o="Opacity",ref:r,...a})=>{let t=d("ColorPickerAlphaSlider"),{color:i}=t,l=_({channel:"alpha",consumerName:"ColorPickerAlphaSlider",max:100,value:i.a*100,orientation:e,defaultLabel:o,valueText:s=>`${Math.round(s)}% opaque, ${(0,Ne.formatColor)(i,"hex",!1)}`,onChange:s=>t.setColor({...i,a:s/100})});return t.alpha?(0,Oe.jsx)(L.Primitive.div,{...l.props,...a,...(0,Fe.skdxPart)("color-picker","alpha-slider",a.className),ref:r,onKeyDown:(0,L.composeEventHandlers)(a.onKeyDown,l.onKeyDown),onPointerDown:(0,L.composeEventHandlers)(a.onPointerDown,l.onPointerDown),style:{...l.style,...a.style}}):null};q.displayName="ColorPickerAlphaSlider";var Ve=require("../utils/part.cjs"),Le=require("../utils/primitive.cjs");var Ie=require("react/jsx-runtime"),J=({ref:e,...o})=>{let r=d("ColorPickerAlphaSliderThumb");return(0,Ie.jsx)(Le.Primitive.div,{"aria-hidden":!0,"data-channel":"alpha","data-value":S(r.color.a*100),"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,...o,...(0,Ve.skdxPart)("color-picker","alpha-slider-thumb",o.className),ref:e})};J.displayName="ColorPickerAlphaSliderThumb";var Y=H(require("react"),1),Ke=require("../utils/part.cjs"),Q=require("../utils/primitive.cjs");var Me=require("react/jsx-runtime"),Z=({ref:e,...o})=>{let r=d("ColorPickerArea"),a=Y.useRef(r.color);Y.useInsertionEffect(()=>{a.current=r.color});let{onPointerDown:t,dragging:i}=z({onRatioChange:({x:l,y:s})=>r.setColor({...a.current,s:T(l*100,r.step,100),b:T((1-s)*100,r.step,100)}),onRatioChangeEnd:()=>r.commit()});return(0,Me.jsx)(Q.Primitive.div,{"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,"data-dragging":i?"":void 0,...o,...(0,Ke.skdxPart)("color-picker","area",o.className),ref:e,onPointerDown:(0,Q.composeEventHandlers)(o.onPointerDown,l=>{r.interactive&&t(l)}),style:{touchAction:"none",...o.style}})};Z.displayName="ColorPickerArea";var j=require("../utils/direction.cjs"),$e=require("../utils/part.cjs"),he=require("../utils/primitive.cjs");var N=require("react/jsx-runtime"),No=10;function Ge({axis:e,label:o}){let r=d("ColorPickerAreaThumb"),a=(0,j.useDirection)(),{color:t,step:i}=r,l=e==="saturation"?t.s:t.b,s=c=>{if(!r.interactive)return;let n=(0,j.directionalKey)(c.key,c.currentTarget,a),m=Ce(i),f=c.shiftKey?m*No:m,b=(u,y)=>T(u+y,i,100),C=null,P=n==="ArrowRight"||n==="ArrowUp";if(P||(n==="ArrowLeft"||n==="ArrowDown")){let u=P?f:-f;C=e==="saturation"?{...t,s:b(t.s,u)}:{...t,b:b(t.b,u)}}else if(n==="Home"||n==="End"){let u=n==="Home"?0:100;C=e==="saturation"?{...t,s:u}:{...t,b:u}}C&&(c.preventDefault(),r.setColor(C))};return(0,N.jsx)(he.Primitive.span,{role:"slider","aria-label":o,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":S(l),"aria-valuetext":`${Math.round(t.s)}% saturation, ${Math.round(t.b)}% brightness, ${r.describe(t)}`,"aria-orientation":e==="saturation"?"horizontal":"vertical","aria-disabled":r.disabled||void 0,"aria-readonly":r.readOnly||void 0,tabIndex:r.disabled?-1:0,"data-channel":e,"data-value":S(l),"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,onKeyDown:s})}var ee=({saturationLabel:e="Saturation",brightnessLabel:o="Brightness",children:r,ref:a,...t})=>{let i=d("ColorPickerAreaThumb");return(0,N.jsxs)(he.Primitive.div,{"data-value":i.value,"data-disabled":i.disabled?"":void 0,"data-readonly":i.readOnly?"":void 0,...t,...(0,$e.skdxPart)("color-picker","area-thumb",t.className),ref:a,children:[(0,N.jsx)(Ge,{axis:"saturation",label:e}),(0,N.jsx)(Ge,{axis:"brightness",label:o}),r]})};ee.displayName="ColorPickerAreaThumb";var Ue=H(require("react"),1),Be=require("../utils/color.cjs"),We=require("../utils/part.cjs"),oe=require("../utils/primitive.cjs");var ze=require("react/jsx-runtime"),Fo=()=>()=>{},Oo=()=>typeof window<"u"&&"EyeDropper"in window,Vo=()=>!1,re=({ref:e,...o})=>{let r=d("ColorPickerEyeDropper"),a=Ue.useSyncExternalStore(Fo,Oo,Vo),t=()=>{let i=window.EyeDropper;i&&new i().open().then(({sRGBHex:l})=>{let s=(0,Be.parseColor)(l);s&&r.setColor({...s,a:r.color.a},{announce:!0})}).catch(()=>{})};return a?(0,ze.jsx)(oe.Primitive.button,{type:"button","aria-label":"Pick a colour from the screen","data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,disabled:r.disabled,...o,...(0,We.skdxPart)("color-picker","eye-dropper",o.className),ref:e,onClick:(0,oe.composeEventHandlers)(o.onClick,()=>{r.interactive&&t()})}):null};re.displayName="ColorPickerEyeDropper";var Xe=require("../utils/part.cjs"),I=require("../utils/primitive.cjs");var _e=require("react/jsx-runtime"),te=({orientation:e="horizontal",label:o="Hue",ref:r,...a})=>{let t=d("ColorPickerHueSlider"),{color:i,step:l}=t,s=l>0?Math.floor(359/l)*l:359,c=_({channel:"hue",consumerName:"ColorPickerHueSlider",max:360,limit:s,value:i.h,orientation:e,defaultLabel:o,valueText:n=>`${Math.round(n)} degrees, ${t.describe(i)}`,onChange:n=>t.setColor({...i,h:n})});return(0,_e.jsx)(I.Primitive.div,{...c.props,...a,...(0,Xe.skdxPart)("color-picker","hue-slider",a.className),ref:r,onKeyDown:(0,I.composeEventHandlers)(a.onKeyDown,c.onKeyDown),onPointerDown:(0,I.composeEventHandlers)(a.onPointerDown,c.onPointerDown),style:{...c.style,...a.style}})};te.displayName="ColorPickerHueSlider";var qe=require("../utils/part.cjs"),Je=require("../utils/primitive.cjs");var Ye=require("react/jsx-runtime"),ae=({ref:e,...o})=>{let r=d("ColorPickerHueSliderThumb");return(0,Ye.jsx)(Je.Primitive.div,{"aria-hidden":!0,"data-channel":"hue","data-value":S(r.color.h),"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,...o,...(0,qe.skdxPart)("color-picker","hue-slider-thumb",o.className),ref:e})};ae.displayName="ColorPickerHueSliderThumb";var Qe=H(require("react"),1),Ze=require("../utils/clamp.cjs"),p=require("../utils/color.cjs"),je=require("../utils/part.cjs"),F=require("../utils/primitive.cjs");var eo=require("react/jsx-runtime"),Lo={red:{max:255,label:"Red",read:e=>(0,p.hsbToRgb)(e).r,write:(e,o)=>(0,p.rgbToHsb)({...(0,p.hsbToRgb)(e),r:o})},green:{max:255,label:"Green",read:e=>(0,p.hsbToRgb)(e).g,write:(e,o)=>(0,p.rgbToHsb)({...(0,p.hsbToRgb)(e),g:o})},blue:{max:255,label:"Blue",read:e=>(0,p.hsbToRgb)(e).b,write:(e,o)=>(0,p.rgbToHsb)({...(0,p.hsbToRgb)(e),b:o})},hue:{max:360,label:"Hue",read:e=>e.h,write:(e,o)=>({...e,h:o})},saturation:{max:100,label:"Saturation",read:e=>e.s,write:(e,o)=>({...e,s:o})},brightness:{max:100,label:"Brightness",read:e=>e.b,write:(e,o)=>({...e,b:o})},lightness:{max:100,label:"Lightness",read:e=>(0,p.hsbToHsl)(e).l,write:(e,o)=>(0,p.hslToHsb)({...(0,p.hsbToHsl)(e),l:o})},alpha:{max:100,label:"Opacity",read:e=>e.a*100,write:(e,o)=>({...e,a:o/100})}},ne=({channel:e,ref:o,...r})=>{let a=d("ColorPickerInput"),[t,i]=Qe.useState(null),l=e&&e!=="hex"?Lo[e]:null,s=a.value;l?s=String(Math.round(l.read(a.color))):e==="hex"&&(s=(0,p.formatColor)(a.color,"hex",a.alpha));let c=n=>{if(!a.interactive)return!1;if(l){let f=Number(n.trim());return n.trim()===""||!Number.isFinite(f)?!1:(a.setColor(l.write(a.color,(0,Ze.clamp)(f,0,l.max)),{announce:!0}),!0)}let m=(0,p.parseColor)(n);return m?(a.setColor(m,{announce:!0}),!0):!1};return(0,eo.jsx)(F.Primitive.input,{type:"text",inputMode:l?"numeric":"text",autoComplete:"off",spellCheck:!1,"aria-label":l?l.label:"Colour value","data-channel":e??"value","data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,disabled:a.disabled,readOnly:a.readOnly,...r,...(0,je.skdxPart)("color-picker","input",r.className),ref:o,value:t??s,onChange:(0,F.composeEventHandlers)(r.onChange,n=>i(n.target.value)),onKeyDown:(0,F.composeEventHandlers)(r.onKeyDown,n=>{n.key==="Enter"?(n.preventDefault(),c(t??s),i(null)):n.key==="Escape"&&i(null)}),onBlur:(0,F.composeEventHandlers)(r.onBlur,()=>{t!==null&&c(t),i(null)})})};ne.displayName="ColorPickerInput";var no=H(require("react"),1),K=require("../utils/color.cjs"),io=require("../utils/part.cjs"),M=require("../utils/primitive.cjs"),lo=require("../utils/useRovingFocus.cjs");var ie=H(require("react"),1),oo=require("../utils/composeRefs.cjs"),ro=require("../utils/createContext.cjs"),to=require("../utils/part.cjs"),le=require("../utils/primitive.cjs"),se=require("../utils/useRovingFocus.cjs");var be=require("react/jsx-runtime"),Pe="[data-skdx-color-picker-swatch]",[ao,ke]=(0,ro.createSafeContext)("ColorPickerSwatchGroup"),ce=({loop:e=!0,ref:o,...r})=>{let a=d("ColorPickerSwatchGroup"),t=ie.useRef(null),i=(0,oo.useComposedRefs)(o,t),[l,s]=ie.useState(null),c=(0,se.useRovingFocus)({orientation:"both",loop:e,itemSelector:Pe});return(0,se.useRovingTabStop)(t,Pe,"data-value",l,s),(0,be.jsx)(ao,{activeValue:l,setActiveValue:s,children:(0,be.jsx)(le.Primitive.div,{role:"radiogroup","aria-disabled":a.disabled||void 0,"aria-readonly":a.readOnly||void 0,"data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,...r,...(0,to.skdxPart)("color-picker","swatch-group",r.className),ref:i,onKeyDown:(0,le.composeEventHandlers)(r.onKeyDown,c)})})};ce.displayName="ColorPickerSwatchGroup";var so=require("react/jsx-runtime"),de=({value:e,disabled:o,ref:r,...a})=>{let t=d("ColorPickerSwatch"),i=ke("ColorPickerSwatch"),l=(0,K.parseColor)(e),s=t.disabled||o||l===null,c=l?(0,K.formatColor)(l,"hex",t.alpha):e,n=l!==null&&c===(0,K.formatColor)(t.color,"hex",t.alpha);no.useLayoutEffect(()=>{n&&i.setActiveValue(e)},[n,e,i]);let m={"--skdx-color-picker-swatch-value":c,...a.style};return(0,so.jsx)(M.Primitive.button,{type:"button",role:"radio","aria-checked":n,"aria-label":c,"aria-disabled":s||void 0,tabIndex:(0,lo.rovingTabIndex)(i.activeValue!==null,i.activeValue===e,s),"data-skdx-color-picker-swatch":"","data-value":e,"data-state":n?"checked":"unchecked","data-disabled":s?"":void 0,"data-readonly":t.readOnly?"":void 0,disabled:s,...a,...(0,io.skdxPart)("color-picker","swatch",a.className),ref:r,onFocus:(0,M.composeEventHandlers)(a.onFocus,()=>{i.setActiveValue(e),!n&&l&&t.setColor(l,{announce:!0})}),onClick:(0,M.composeEventHandlers)(a.onClick,()=>{l&&t.setColor(l,{announce:!0})}),style:m})};de.displayName="ColorPickerSwatch";var k=require("react/jsx-runtime"),co=({showInput:e,showSwatches:o,showEyeDropper:r,swatches:a=[]})=>(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(Z,{children:(0,k.jsx)(ee,{})}),(0,k.jsx)(te,{children:(0,k.jsx)(ae,{})}),(0,k.jsx)(q,{children:(0,k.jsx)(J,{})}),e?(0,k.jsx)(ne,{}):null,o&&a.length>0?(0,k.jsx)(ce,{"aria-label":"Preset colours",children:a.map(t=>(0,k.jsx)(de,{value:t},t))}):null,r?(0,k.jsx)(re,{}):null]});var ue=require("react/jsx-runtime"),Io={h:0,s:0,b:0,a:1};function O(e){return Math.round(e*1e3)/1e3}var[Po,d]=(0,mo.createSafeContext)("ColorPicker");function Ko(e,o){return{"data-disabled":e?"":void 0,"data-readonly":o?"":void 0}}function Mo({value:e,defaultValue:o,onValueChange:r,format:a,defaultFormat:t,onFormatChange:i}){let[l="hex",s]=(0,ye.useControllableState)({prop:a,defaultProp:t,onChange:i}),[c=o,n]=(0,ye.useControllableState)({prop:e,defaultProp:o,onChange:r}),[m,f]=h.useState(()=>(0,E.parseColor)(e??o)??Io),[b,C]=h.useState(c);if(c!==b){C(c);let u=(0,E.parseColor)(c);u&&f(u)}let P=h.useRef(c);h.useInsertionEffect(()=>{P.current=c});let R=h.useRef(m);return h.useInsertionEffect(()=>{R.current=m}),{format:l,setFormatState:s,value:c,setValue:n,color:m,setColorState:f,setOwnValue:C,valueRef:P,colorRef:R}}var xe=({ref:e,...o})=>{let{value:r,defaultValue:a="#000000",onValueChange:t,onValueCommit:i,format:l,defaultFormat:s="hex",onFormatChange:c,alpha:n=!0,step:m=1,disabled:f=!1,readOnly:b=!1,showInput:C=!0,showSwatches:P=!0,showEyeDropper:R=!0,swatches:u=[],children:y,fullWidth:D,size:G,asChild:ve,...A}=o,{format:v,setFormatState:Se,value:we,setValue:$,color:w,setColorState:ge,setOwnValue:U,valueRef:me,colorRef:Ee}=Mo({value:r,defaultValue:a,onValueChange:t,format:l,defaultFormat:s,onFormatChange:c}),V=!f&&!b,pe=h.useCallback(x=>{let B=(0,E.formatColor)(x,"hex",!1);return n&&x.a<1?`${B}, ${Math.round(x.a*100)}% opaque`:B},[n]),xo=h.useCallback((x,B)=>{if(!V)return;let Ae=(0,E.formatColor)(x,v,n);ge(x),U(Ae),$(Ae),B?.announce&&(0,po.announce)(pe(x))},[V,v,n,$,pe,ge,U]),Ro=h.useCallback(x=>{V&&Se(x)},[V,Se]),De=h.useRef(v);h.useEffect(()=>{if(De.current===v)return;De.current=v;let x=(0,E.formatColor)(Ee.current,v,n);x!==me.current&&(U(x),$(x))},[v,n,$,Ee,me,U]);let vo=(0,ho.useCallbackRef)(()=>i?.(me.current));return(0,ue.jsx)(Po,{color:w,value:we,format:v,alpha:n,step:m,disabled:f,readOnly:b,interactive:V,describe:pe,setColor:xo,commit:vo,setFormat:Ro,children:(0,ue.jsx)(Co.Primitive.div,{"data-value":we,"data-format":v,...Ko(f,b),...A,...(0,uo.appearanceAttrs)({fullWidth:D,size:G},A),...(0,fo.skdxPart)("color-picker","root",A.className),asChild:y&&h.Children.count(y)===1?ve:!1,ref:e,style:{"--skdx-color-picker-hue":`${O(w.h)}deg`,"--skdx-color-picker-hue-position":`${O(w.h/360*100)}%`,"--skdx-color-picker-saturation":`${O(w.s)}%`,"--skdx-color-picker-brightness":`${O(w.b)}%`,"--skdx-color-picker-alpha":O(w.a),"--skdx-color-picker-alpha-position":`${O(w.a*100)}%`,"--skdx-color-picker-value":(0,E.formatColor)(w,"hex",n),...A.style},children:y??(0,ue.jsx)(co,{showInput:C,showSwatches:P,showEyeDropper:R,swatches:u})})})};xe.displayName="ColorPicker";var bo=require("../utils/part.cjs"),ko=require("../utils/primitive.cjs");var Re=require("react/jsx-runtime"),Go=["hex","rgb","hsl","hsb"],$o={hex:"HEX",rgb:"RGB",hsl:"HSL",hsb:"HSB"},yo=({formats:e=Go,children:o,ref:r,...a})=>{let t=d("ColorPickerFormatSelect");return(0,Re.jsx)("select",{"aria-label":"Colour format","aria-readonly":t.readOnly||void 0,"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,disabled:t.disabled,...a,...(0,bo.skdxPart)("color-picker","format-select",a.className),ref:r,value:t.format,onChange:(0,ko.composeEventHandlers)(a.onChange,i=>t.setFormat(i.target.value)),children:o??e.map(i=>(0,Re.jsx)("option",{value:i,children:$o[i]},i))})};yo.displayName="ColorPickerFormatSelect";0&&(module.exports={ColorPicker,ColorPickerAlphaSlider,ColorPickerAlphaSliderThumb,ColorPickerArea,ColorPickerAreaThumb,ColorPickerEyeDropper,ColorPickerFormatSelect,ColorPickerHueSlider,ColorPickerHueSliderThumb,ColorPickerInput,ColorPickerProvider,ColorPickerSwatch,ColorPickerSwatchGroup,ColorPickerSwatchGroupProvider,SWATCH_SELECTOR,useColorPickerContext,useColorPickerSwatchGroupContext});

package/dist/color-picker/ColorPicker.js

@@ -1,2 +1,2 @@
 'use client';
-import*as P from"react";import{appearanceAttrs as Lo}from"../utils/appearance.js";import{formatColor as $,parseColor as we}from"../utils/color.js";import{createSafeContext as Io}from"../utils/createContext.js";import{announce as Ko}from"../utils/liveAnnouncer.js";import{skdxPart as Mo}from"../utils/part.js";import{Primitive as Go}from"../utils/primitive.js";import{useCallbackRef as $o}from"../utils/useCallbackRef.js";import{useControllableState as ge}from"../utils/useControllableState.js";import{formatColor as Le}from"../utils/color.js";import{skdxPart as Ie}from"../utils/part.js";import{composeEventHandlers as ue,Primitive as Ke}from"../utils/primitive.js";import{clamp as Ne}from"../utils/clamp.js";import{directionalKey as Fe,useDirection as Oe}from"../utils/direction.js";import*as w from"react";import{clamp as de}from"../utils/clamp.js";function I(e){let o=w.useRef(e);w.useEffect(()=>{o.current=e});let[t,a]=w.useState(!1),r=w.useRef(null),i=(c,s)=>{let n=s.getBoundingClientRect();return{x:n.width?de((c.clientX-n.left)/n.width,0,1):0,y:n.height?de((c.clientY-n.top)/n.height,0,1):0}},l=c=>{if(r.current)return;let s=c.currentTarget,{pointerId:n}=c;s.setPointerCapture?.(n);let m=i(c,s);a(!0),o.current.onRatioChange(m,c.nativeEvent);let p=C=>{if(C.pointerId!==n)return;let k=i(C,s);k.x===m.x&&k.y===m.y||(m=k,o.current.onRatioChange(k,C))},h=C=>{C.pointerId===n&&(r.current?.(),a(!1),o.current.onRatioChangeEnd?.(C))},f=s.ownerDocument;f.addEventListener("pointermove",p),f.addEventListener("pointerup",h),f.addEventListener("pointercancel",h),r.current=()=>{f.removeEventListener("pointermove",p),f.removeEventListener("pointerup",h),f.removeEventListener("pointercancel",h),r.current=null}};return w.useEffect(()=>()=>r.current?.(),[]),{onPointerDown:l,dragging:t}}var Ve=10;function v(e){return Math.round(e*100)/100}function E(e,o,t){let a=o>0?Math.round(Math.round(e/o)*o*1e6)/1e6:e;return Ne(a,0,t)}function W(e){return e>0?e:1}function K(e){let{channel:o,consumerName:t,max:a,value:r,orientation:i,defaultLabel:l,valueText:c,onChange:s}=e,n=u(t),m=Oe(),p=e.limit??a,h=d=>E(d,n.step,p),{onPointerDown:f,dragging:C}=I({onRatioChange:d=>{let x=i==="horizontal"?d.x:1-d.y;s(h(x*a))},onRatioChangeEnd:()=>n.commit()}),k=d=>{if(!n.interactive)return;let x=Fe(d.key,d.currentTarget,m);if(x==="Home"||x==="End"){d.preventDefault(),s(x==="Home"?0:p);return}let g=W(n.step),N=Math.max(a/10,g),y={ArrowRight:g,ArrowUp:g,ArrowLeft:-g,ArrowDown:-g,PageUp:N,PageDown:-N}[x];if(y===void 0)return;d.preventDefault();let F=d.shiftKey&&x.startsWith("Arrow")?Ve:1;s(h(r+y*F))};return{props:{role:"slider","aria-label":l,"aria-valuemin":0,"aria-valuemax":a,"aria-valuenow":v(r),"aria-valuetext":c(r),"aria-orientation":i,"aria-disabled":n.disabled||void 0,"aria-readonly":n.readOnly||void 0,tabIndex:n.disabled?-1:0,"data-channel":o,"data-orientation":i,"data-value":v(r),"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,"data-dragging":C?"":void 0},onKeyDown:k,onPointerDown:d=>{n.interactive&&f(d)},style:{touchAction:"none"},dragging:C}}import{jsx as Me}from"react/jsx-runtime";var z=({orientation:e="horizontal",label:o="Opacity",ref:t,...a})=>{let r=u("ColorPickerAlphaSlider"),{color:i}=r,l=K({channel:"alpha",consumerName:"ColorPickerAlphaSlider",max:100,value:i.a*100,orientation:e,defaultLabel:o,valueText:c=>`${Math.round(c)}% opaque, ${Le(i,"hex",!1)}`,onChange:c=>r.setColor({...i,a:c/100})});return r.alpha?Me(Ke.div,{...l.props,...a,...Ie("color-picker","alpha-slider",a.className),ref:t,onKeyDown:ue(a.onKeyDown,l.onKeyDown),onPointerDown:ue(a.onPointerDown,l.onPointerDown),style:{...l.style,...a.style}}):null};z.displayName="ColorPickerAlphaSlider";import{skdxPart as Ge}from"../utils/part.js";import{Primitive as $e}from"../utils/primitive.js";import{jsx as Ue}from"react/jsx-runtime";var X=({ref:e,...o})=>{let t=u("ColorPickerAlphaSliderThumb");return Ue($e.div,{"aria-hidden":!0,"data-channel":"alpha","data-value":v(t.color.a*100),"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,...o,...Ge("color-picker","alpha-slider-thumb",o.className),ref:e})};X.displayName="ColorPickerAlphaSliderThumb";import*as M from"react";import{skdxPart as Be}from"../utils/part.js";import{composeEventHandlers as We,Primitive as ze}from"../utils/primitive.js";import{jsx as Xe}from"react/jsx-runtime";var _=({ref:e,...o})=>{let t=u("ColorPickerArea"),a=M.useRef(t.color);M.useInsertionEffect(()=>{a.current=t.color});let{onPointerDown:r,dragging:i}=I({onRatioChange:({x:l,y:c})=>t.setColor({...a.current,s:E(l*100,t.step,100),b:E((1-c)*100,t.step,100)}),onRatioChangeEnd:()=>t.commit()});return Xe(ze.div,{"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,"data-dragging":i?"":void 0,...o,...Be("color-picker","area",o.className),ref:e,onPointerDown:We(o.onPointerDown,l=>{t.interactive&&r(l)}),style:{touchAction:"none",...o.style}})};_.displayName="ColorPickerArea";import{directionalKey as _e,useDirection as qe}from"../utils/direction.js";import{skdxPart as Je}from"../utils/part.js";import{Primitive as pe}from"../utils/primitive.js";import{jsx as q,jsxs as Qe}from"react/jsx-runtime";var Ye=10;function me({axis:e,label:o}){let t=u("ColorPickerAreaThumb"),a=qe(),{color:r,step:i}=t,l=e==="saturation"?r.s:r.b,c=s=>{if(!t.interactive)return;let n=_e(s.key,s.currentTarget,a),m=W(i),p=s.shiftKey?m*Ye:m,h=(d,x)=>E(d+x,i,100),f=null,C=n==="ArrowRight"||n==="ArrowUp";if(C||(n==="ArrowLeft"||n==="ArrowDown")){let d=C?p:-p;f=e==="saturation"?{...r,s:h(r.s,d)}:{...r,b:h(r.b,d)}}else if(n==="Home"||n==="End"){let d=n==="Home"?0:100;f=e==="saturation"?{...r,s:d}:{...r,b:d}}f&&(s.preventDefault(),t.setColor(f))};return q(pe.span,{role:"slider","aria-label":o,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":v(l),"aria-valuetext":`${Math.round(r.s)}% saturation, ${Math.round(r.b)}% brightness, ${t.describe(r)}`,"aria-orientation":e==="saturation"?"horizontal":"vertical","aria-disabled":t.disabled||void 0,"aria-readonly":t.readOnly||void 0,tabIndex:t.disabled?-1:0,"data-channel":e,"data-value":v(l),"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,onKeyDown:c})}var J=({saturationLabel:e="Saturation",brightnessLabel:o="Brightness",children:t,ref:a,...r})=>{let i=u("ColorPickerAreaThumb");return Qe(pe.div,{"data-value":i.value,"data-disabled":i.disabled?"":void 0,"data-readonly":i.readOnly?"":void 0,...r,...Je("color-picker","area-thumb",r.className),ref:a,children:[q(me,{axis:"saturation",label:e}),q(me,{axis:"brightness",label:o}),t]})};J.displayName="ColorPickerAreaThumb";import*as fe from"react";import{parseColor as Ze}from"../utils/color.js";import{skdxPart as je}from"../utils/part.js";import{composeEventHandlers as eo,Primitive as oo}from"../utils/primitive.js";import{jsx as no}from"react/jsx-runtime";var ro=()=>()=>{},to=()=>typeof window<"u"&&"EyeDropper"in window,ao=()=>!1,Y=({ref:e,...o})=>{let t=u("ColorPickerEyeDropper"),a=fe.useSyncExternalStore(ro,to,ao),r=()=>{let i=window.EyeDropper;i&&new i().open().then(({sRGBHex:l})=>{let c=Ze(l);c&&t.setColor({...c,a:t.color.a},{announce:!0})}).catch(()=>{})};return a?no(oo.button,{type:"button","aria-label":"Pick a colour from the screen","data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,disabled:t.disabled,...o,...je("color-picker","eye-dropper",o.className),ref:e,onClick:eo(o.onClick,()=>{t.interactive&&r()})}):null};Y.displayName="ColorPickerEyeDropper";import{skdxPart as io}from"../utils/part.js";import{composeEventHandlers as Ce,Primitive as lo}from"../utils/primitive.js";import{jsx as co}from"react/jsx-runtime";var Q=({orientation:e="horizontal",label:o="Hue",ref:t,...a})=>{let r=u("ColorPickerHueSlider"),{color:i,step:l}=r,c=l>0?Math.floor(359/l)*l:359,s=K({channel:"hue",consumerName:"ColorPickerHueSlider",max:360,limit:c,value:i.h,orientation:e,defaultLabel:o,valueText:n=>`${Math.round(n)} degrees, ${r.describe(i)}`,onChange:n=>r.setColor({...i,h:n})});return co(lo.div,{...s.props,...a,...io("color-picker","hue-slider",a.className),ref:t,onKeyDown:Ce(a.onKeyDown,s.onKeyDown),onPointerDown:Ce(a.onPointerDown,s.onPointerDown),style:{...s.style,...a.style}})};Q.displayName="ColorPickerHueSlider";import{skdxPart as so}from"../utils/part.js";import{Primitive as uo}from"../utils/primitive.js";import{jsx as mo}from"react/jsx-runtime";var Z=({ref:e,...o})=>{let t=u("ColorPickerHueSliderThumb");return mo(uo.div,{"aria-hidden":!0,"data-channel":"hue","data-value":v(t.color.h),"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,...o,...so("color-picker","hue-slider-thumb",o.className),ref:e})};Z.displayName="ColorPickerHueSliderThumb";import*as Pe from"react";import{clamp as po}from"../utils/clamp.js";import{formatColor as fo,hsbToHsl as he,hsbToRgb as D,hslToHsb as Co,parseColor as ho,rgbToHsb as j}from"../utils/color.js";import{skdxPart as Po}from"../utils/part.js";import{composeEventHandlers as ee,Primitive as bo}from"../utils/primitive.js";import{jsx as yo}from"react/jsx-runtime";var ko={red:{max:255,label:"Red",read:e=>D(e).r,write:(e,o)=>j({...D(e),r:o})},green:{max:255,label:"Green",read:e=>D(e).g,write:(e,o)=>j({...D(e),g:o})},blue:{max:255,label:"Blue",read:e=>D(e).b,write:(e,o)=>j({...D(e),b:o})},hue:{max:360,label:"Hue",read:e=>e.h,write:(e,o)=>({...e,h:o})},saturation:{max:100,label:"Saturation",read:e=>e.s,write:(e,o)=>({...e,s:o})},brightness:{max:100,label:"Brightness",read:e=>e.b,write:(e,o)=>({...e,b:o})},lightness:{max:100,label:"Lightness",read:e=>he(e).l,write:(e,o)=>Co({...he(e),l:o})},alpha:{max:100,label:"Opacity",read:e=>e.a*100,write:(e,o)=>({...e,a:o/100})}},oe=({channel:e,ref:o,...t})=>{let a=u("ColorPickerInput"),[r,i]=Pe.useState(null),l=e&&e!=="hex"?ko[e]:null,c=a.value;l?c=String(Math.round(l.read(a.color))):e==="hex"&&(c=fo(a.color,"hex",a.alpha));let s=n=>{if(!a.interactive)return!1;if(l){let p=Number(n.trim());return n.trim()===""||!Number.isFinite(p)?!1:(a.setColor(l.write(a.color,po(p,0,l.max)),{announce:!0}),!0)}let m=ho(n);return m?(a.setColor(m,{announce:!0}),!0):!1};return yo(bo.input,{type:"text",inputMode:l?"numeric":"text",autoComplete:"off",spellCheck:!1,"aria-label":l?l.label:"Colour value","data-channel":e??"value","data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,disabled:a.disabled,readOnly:a.readOnly,...t,...Po("color-picker","input",t.className),ref:o,value:r??c,onChange:ee(t.onChange,n=>i(n.target.value)),onKeyDown:ee(t.onKeyDown,n=>{n.key==="Enter"?(n.preventDefault(),s(r??c),i(null)):n.key==="Escape"&&i(null)}),onBlur:ee(t.onBlur,()=>{r!==null&&s(r),i(null)})})};oe.displayName="ColorPickerInput";import*as ve from"react";import{formatColor as xe,parseColor as Ao}from"../utils/color.js";import{skdxPart as Ho}from"../utils/part.js";import{composeEventHandlers as Re,Primitive as To}from"../utils/primitive.js";import{rovingTabIndex as No}from"../utils/useRovingFocus.js";import*as G from"react";import{useComposedRefs as xo}from"../utils/composeRefs.js";import{createSafeContext as Ro}from"../utils/createContext.js";import{skdxPart as vo}from"../utils/part.js";import{composeEventHandlers as So,Primitive as wo}from"../utils/primitive.js";import{useRovingFocus as go,useRovingTabStop as Eo}from"../utils/useRovingFocus.js";import{jsx as ke}from"react/jsx-runtime";var be="[data-skdx-color-picker-swatch]",[Do,ye]=Ro("ColorPickerSwatchGroup"),re=({loop:e=!0,ref:o,...t})=>{let a=u("ColorPickerSwatchGroup"),r=G.useRef(null),i=xo(o,r),[l,c]=G.useState(null),s=go({orientation:"both",loop:e,itemSelector:be});return Eo(r,be,"data-value",l,c),ke(Do,{activeValue:l,setActiveValue:c,children:ke(wo.div,{role:"radiogroup","aria-disabled":a.disabled||void 0,"aria-readonly":a.readOnly||void 0,"data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,...t,...vo("color-picker","swatch-group",t.className),ref:i,onKeyDown:So(t.onKeyDown,s)})})};re.displayName="ColorPickerSwatchGroup";import{jsx as Fo}from"react/jsx-runtime";var te=({value:e,disabled:o,ref:t,...a})=>{let r=u("ColorPickerSwatch"),i=ye("ColorPickerSwatch"),l=Ao(e),c=r.disabled||o||l===null,s=l?xe(l,"hex",r.alpha):e,n=l!==null&&s===xe(r.color,"hex",r.alpha);ve.useLayoutEffect(()=>{n&&i.setActiveValue(e)},[n,e,i]);let m={"--skdx-color-picker-swatch-value":s,...a.style};return Fo(To.button,{type:"button",role:"radio","aria-checked":n,"aria-label":s,"aria-disabled":c||void 0,tabIndex:No(i.activeValue!==null,i.activeValue===e,c),"data-skdx-color-picker-swatch":"","data-value":e,"data-state":n?"checked":"unchecked","data-disabled":c?"":void 0,"data-readonly":r.readOnly?"":void 0,disabled:c,...a,...Ho("color-picker","swatch",a.className),ref:t,onFocus:Re(a.onFocus,()=>{i.setActiveValue(e),!n&&l&&r.setColor(l,{announce:!0})}),onClick:Re(a.onClick,()=>{l&&r.setColor(l,{announce:!0})}),style:m})};te.displayName="ColorPickerSwatch";import{Fragment as Oo,jsx as R,jsxs as Vo}from"react/jsx-runtime";var Se=({showInput:e,showSwatches:o,showEyeDropper:t,swatches:a=[]})=>Vo(Oo,{children:[R(_,{children:R(J,{})}),R(Q,{children:R(Z,{})}),R(z,{children:R(X,{})}),e?R(oe,{}):null,o&&a.length>0?R(re,{"aria-label":"Preset colours",children:a.map(r=>R(te,{value:r},r))}):null,t?R(Y,{}):null]});import{jsx as ae}from"react/jsx-runtime";var Uo={h:0,s:0,b:0,a:1};function A(e){return Math.round(e*1e3)/1e3}var[Bo,u]=Io("ColorPicker");function Wo(e,o){return{"data-disabled":e?"":void 0,"data-readonly":o?"":void 0}}function zo({value:e,defaultValue:o,onValueChange:t,format:a,defaultFormat:r,onFormatChange:i}){let[l="hex",c]=ge({prop:a,defaultProp:r,onChange:i}),[s=o,n]=ge({prop:e,defaultProp:o,onChange:t}),[m,p]=P.useState(()=>we(e??o)??Uo),[h,f]=P.useState(s);if(s!==h){f(s);let d=we(s);d&&p(d)}let C=P.useRef(s);P.useInsertionEffect(()=>{C.current=s});let k=P.useRef(m);return P.useInsertionEffect(()=>{k.current=m}),{format:l,setFormatState:c,value:s,setValue:n,color:m,setColorState:p,setOwnValue:f,valueRef:C,colorRef:k}}var Ee=({ref:e,...o})=>{let{value:t,defaultValue:a="#000000",onValueChange:r,onValueCommit:i,format:l,defaultFormat:c="hex",onFormatChange:s,alpha:n=!0,step:m=1,disabled:p=!1,readOnly:h=!1,showInput:f=!0,showSwatches:C=!0,showEyeDropper:k=!0,swatches:d=[],children:x,fullWidth:g,size:N,...H}=o,{format:y,setFormatState:F,value:ne,setValue:O,color:S,setColorState:ie,setOwnValue:V,valueRef:U,colorRef:le}=zo({value:t,defaultValue:a,onValueChange:r,format:l,defaultFormat:c,onFormatChange:s}),T=!p&&!h,B=P.useCallback(b=>{let L=$(b,"hex",!1);return n&&b.a<1?`${L}, ${Math.round(b.a*100)}% opaque`:L},[n]),Ae=P.useCallback((b,L)=>{if(!T)return;let se=$(b,y,n);ie(b),V(se),O(se),L?.announce&&Ko(B(b))},[T,y,n,O,B,ie,V]),He=P.useCallback(b=>{T&&F(b)},[T,F]),ce=P.useRef(y);P.useEffect(()=>{if(ce.current===y)return;ce.current=y;let b=$(le.current,y,n);b!==U.current&&(V(b),O(b))},[y,n,O,le,U,V]);let Te=$o(()=>i?.(U.current));return ae(Bo,{color:S,value:ne,format:y,alpha:n,step:m,disabled:p,readOnly:h,interactive:T,describe:B,setColor:Ae,commit:Te,setFormat:He,children:ae(Go.div,{"data-value":ne,"data-format":y,...Wo(p,h),...H,...Lo({fullWidth:g,size:N},H),...Mo("color-picker","root",H.className),ref:e,style:{"--skdx-color-picker-hue":`${A(S.h)}deg`,"--skdx-color-picker-hue-position":`${A(S.h/360*100)}%`,"--skdx-color-picker-saturation":`${A(S.s)}%`,"--skdx-color-picker-brightness":`${A(S.b)}%`,"--skdx-color-picker-alpha":A(S.a),"--skdx-color-picker-alpha-position":`${A(S.a*100)}%`,"--skdx-color-picker-value":$(S,"hex",n),...H.style},children:x??ae(Se,{showInput:f,showSwatches:C,showEyeDropper:k,swatches:d})})})};Ee.displayName="ColorPicker";import{skdxPart as Xo}from"../utils/part.js";import{composeEventHandlers as _o}from"../utils/primitive.js";import{jsx as De}from"react/jsx-runtime";var qo=["hex","rgb","hsl","hsb"],Jo={hex:"HEX",rgb:"RGB",hsl:"HSL",hsb:"HSB"},Yo=({formats:e=qo,children:o,ref:t,...a})=>{let r=u("ColorPickerFormatSelect");return De("select",{"aria-label":"Colour format","aria-readonly":r.readOnly||void 0,"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,disabled:r.disabled,...a,...Xo("color-picker","format-select",a.className),ref:t,value:r.format,onChange:_o(a.onChange,i=>r.setFormat(i.target.value)),children:o??e.map(i=>De("option",{value:i,children:Jo[i]},i))})};Yo.displayName="ColorPickerFormatSelect";export{Ee as ColorPicker,z as ColorPickerAlphaSlider,X as ColorPickerAlphaSliderThumb,_ as ColorPickerArea,J as ColorPickerAreaThumb,Y as ColorPickerEyeDropper,Yo as ColorPickerFormatSelect,Q as ColorPickerHueSlider,Z as ColorPickerHueSliderThumb,oe as ColorPickerInput,Bo as ColorPickerProvider,te as ColorPickerSwatch,re as ColorPickerSwatchGroup,Do as ColorPickerSwatchGroupProvider,be as SWATCH_SELECTOR,u as useColorPickerContext,ye as useColorPickerSwatchGroupContext};
+import*as C from"react";import{appearanceAttrs as Io}from"../utils/appearance.js";import{formatColor as G,parseColor as ge}from"../utils/color.js";import{createSafeContext as Ko}from"../utils/createContext.js";import{announce as Mo}from"../utils/liveAnnouncer.js";import{skdxPart as Go}from"../utils/part.js";import{Primitive as $o}from"../utils/primitive.js";import{useCallbackRef as Uo}from"../utils/useCallbackRef.js";import{useControllableState as Ee}from"../utils/useControllableState.js";import{formatColor as Ie}from"../utils/color.js";import{skdxPart as Ke}from"../utils/part.js";import{composeEventHandlers as me,Primitive as Me}from"../utils/primitive.js";import{clamp as Fe}from"../utils/clamp.js";import{directionalKey as Oe,useDirection as Ve}from"../utils/direction.js";import*as w from"react";import{clamp as ue}from"../utils/clamp.js";function L(e){let o=w.useRef(e);w.useEffect(()=>{o.current=e});let[t,a]=w.useState(!1),r=w.useRef(null),i=(s,c)=>{let n=c.getBoundingClientRect();return{x:n.width?ue((s.clientX-n.left)/n.width,0,1):0,y:n.height?ue((s.clientY-n.top)/n.height,0,1):0}},l=s=>{if(r.current)return;let c=s.currentTarget,{pointerId:n}=s;c.setPointerCapture?.(n);let m=i(s,c);a(!0),o.current.onRatioChange(m,s.nativeEvent);let p=h=>{if(h.pointerId!==n)return;let y=i(h,c);y.x===m.x&&y.y===m.y||(m=y,o.current.onRatioChange(y,h))},P=h=>{h.pointerId===n&&(r.current?.(),a(!1),o.current.onRatioChangeEnd?.(h))},f=c.ownerDocument;f.addEventListener("pointermove",p),f.addEventListener("pointerup",P),f.addEventListener("pointercancel",P),r.current=()=>{f.removeEventListener("pointermove",p),f.removeEventListener("pointerup",P),f.removeEventListener("pointercancel",P),r.current=null}};return w.useEffect(()=>()=>r.current?.(),[]),{onPointerDown:l,dragging:t}}var Le=10;function v(e){return Math.round(e*100)/100}function D(e,o,t){let a=o>0?Math.round(Math.round(e/o)*o*1e6)/1e6:e;return Fe(a,0,t)}function B(e){return e>0?e:1}function I(e){let{channel:o,consumerName:t,max:a,value:r,orientation:i,defaultLabel:l,valueText:s,onChange:c}=e,n=u(t),m=Ve(),p=e.limit??a,P=d=>D(d,n.step,p),{onPointerDown:f,dragging:h}=L({onRatioChange:d=>{let b=i==="horizontal"?d.x:1-d.y;c(P(b*a))},onRatioChangeEnd:()=>n.commit()}),y=d=>{if(!n.interactive)return;let b=Oe(d.key,d.currentTarget,m);if(b==="Home"||b==="End"){d.preventDefault(),c(b==="Home"?0:p);return}let g=B(n.step),N=Math.max(a/10,g),E={ArrowRight:g,ArrowUp:g,ArrowLeft:-g,ArrowDown:-g,PageUp:N,PageDown:-N}[b];if(E===void 0)return;d.preventDefault();let x=d.shiftKey&&b.startsWith("Arrow")?Le:1;c(P(r+E*x))};return{props:{role:"slider","aria-label":l,"aria-valuemin":0,"aria-valuemax":a,"aria-valuenow":v(r),"aria-valuetext":s(r),"aria-orientation":i,"aria-disabled":n.disabled||void 0,"aria-readonly":n.readOnly||void 0,tabIndex:n.disabled?-1:0,"data-channel":o,"data-orientation":i,"data-value":v(r),"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,"data-dragging":h?"":void 0},onKeyDown:y,onPointerDown:d=>{n.interactive&&f(d)},style:{touchAction:"none"},dragging:h}}import{jsx as Ge}from"react/jsx-runtime";var W=({orientation:e="horizontal",label:o="Opacity",ref:t,...a})=>{let r=u("ColorPickerAlphaSlider"),{color:i}=r,l=I({channel:"alpha",consumerName:"ColorPickerAlphaSlider",max:100,value:i.a*100,orientation:e,defaultLabel:o,valueText:s=>`${Math.round(s)}% opaque, ${Ie(i,"hex",!1)}`,onChange:s=>r.setColor({...i,a:s/100})});return r.alpha?Ge(Me.div,{...l.props,...a,...Ke("color-picker","alpha-slider",a.className),ref:t,onKeyDown:me(a.onKeyDown,l.onKeyDown),onPointerDown:me(a.onPointerDown,l.onPointerDown),style:{...l.style,...a.style}}):null};W.displayName="ColorPickerAlphaSlider";import{skdxPart as $e}from"../utils/part.js";import{Primitive as Ue}from"../utils/primitive.js";import{jsx as Be}from"react/jsx-runtime";var z=({ref:e,...o})=>{let t=u("ColorPickerAlphaSliderThumb");return Be(Ue.div,{"aria-hidden":!0,"data-channel":"alpha","data-value":v(t.color.a*100),"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,...o,...$e("color-picker","alpha-slider-thumb",o.className),ref:e})};z.displayName="ColorPickerAlphaSliderThumb";import*as K from"react";import{skdxPart as We}from"../utils/part.js";import{composeEventHandlers as ze,Primitive as Xe}from"../utils/primitive.js";import{jsx as _e}from"react/jsx-runtime";var X=({ref:e,...o})=>{let t=u("ColorPickerArea"),a=K.useRef(t.color);K.useInsertionEffect(()=>{a.current=t.color});let{onPointerDown:r,dragging:i}=L({onRatioChange:({x:l,y:s})=>t.setColor({...a.current,s:D(l*100,t.step,100),b:D((1-s)*100,t.step,100)}),onRatioChangeEnd:()=>t.commit()});return _e(Xe.div,{"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,"data-dragging":i?"":void 0,...o,...We("color-picker","area",o.className),ref:e,onPointerDown:ze(o.onPointerDown,l=>{t.interactive&&r(l)}),style:{touchAction:"none",...o.style}})};X.displayName="ColorPickerArea";import{directionalKey as qe,useDirection as Je}from"../utils/direction.js";import{skdxPart as Ye}from"../utils/part.js";import{Primitive as fe}from"../utils/primitive.js";import{jsx as _,jsxs as Ze}from"react/jsx-runtime";var Qe=10;function pe({axis:e,label:o}){let t=u("ColorPickerAreaThumb"),a=Je(),{color:r,step:i}=t,l=e==="saturation"?r.s:r.b,s=c=>{if(!t.interactive)return;let n=qe(c.key,c.currentTarget,a),m=B(i),p=c.shiftKey?m*Qe:m,P=(d,b)=>D(d+b,i,100),f=null,h=n==="ArrowRight"||n==="ArrowUp";if(h||(n==="ArrowLeft"||n==="ArrowDown")){let d=h?p:-p;f=e==="saturation"?{...r,s:P(r.s,d)}:{...r,b:P(r.b,d)}}else if(n==="Home"||n==="End"){let d=n==="Home"?0:100;f=e==="saturation"?{...r,s:d}:{...r,b:d}}f&&(c.preventDefault(),t.setColor(f))};return _(fe.span,{role:"slider","aria-label":o,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":v(l),"aria-valuetext":`${Math.round(r.s)}% saturation, ${Math.round(r.b)}% brightness, ${t.describe(r)}`,"aria-orientation":e==="saturation"?"horizontal":"vertical","aria-disabled":t.disabled||void 0,"aria-readonly":t.readOnly||void 0,tabIndex:t.disabled?-1:0,"data-channel":e,"data-value":v(l),"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,onKeyDown:s})}var q=({saturationLabel:e="Saturation",brightnessLabel:o="Brightness",children:t,ref:a,...r})=>{let i=u("ColorPickerAreaThumb");return Ze(fe.div,{"data-value":i.value,"data-disabled":i.disabled?"":void 0,"data-readonly":i.readOnly?"":void 0,...r,...Ye("color-picker","area-thumb",r.className),ref:a,children:[_(pe,{axis:"saturation",label:e}),_(pe,{axis:"brightness",label:o}),t]})};q.displayName="ColorPickerAreaThumb";import*as Ce from"react";import{parseColor as je}from"../utils/color.js";import{skdxPart as eo}from"../utils/part.js";import{composeEventHandlers as oo,Primitive as ro}from"../utils/primitive.js";import{jsx as io}from"react/jsx-runtime";var to=()=>()=>{},ao=()=>typeof window<"u"&&"EyeDropper"in window,no=()=>!1,J=({ref:e,...o})=>{let t=u("ColorPickerEyeDropper"),a=Ce.useSyncExternalStore(to,ao,no),r=()=>{let i=window.EyeDropper;i&&new i().open().then(({sRGBHex:l})=>{let s=je(l);s&&t.setColor({...s,a:t.color.a},{announce:!0})}).catch(()=>{})};return a?io(ro.button,{type:"button","aria-label":"Pick a colour from the screen","data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,disabled:t.disabled,...o,...eo("color-picker","eye-dropper",o.className),ref:e,onClick:oo(o.onClick,()=>{t.interactive&&r()})}):null};J.displayName="ColorPickerEyeDropper";import{skdxPart as lo}from"../utils/part.js";import{composeEventHandlers as he,Primitive as so}from"../utils/primitive.js";import{jsx as co}from"react/jsx-runtime";var Y=({orientation:e="horizontal",label:o="Hue",ref:t,...a})=>{let r=u("ColorPickerHueSlider"),{color:i,step:l}=r,s=l>0?Math.floor(359/l)*l:359,c=I({channel:"hue",consumerName:"ColorPickerHueSlider",max:360,limit:s,value:i.h,orientation:e,defaultLabel:o,valueText:n=>`${Math.round(n)} degrees, ${r.describe(i)}`,onChange:n=>r.setColor({...i,h:n})});return co(so.div,{...c.props,...a,...lo("color-picker","hue-slider",a.className),ref:t,onKeyDown:he(a.onKeyDown,c.onKeyDown),onPointerDown:he(a.onPointerDown,c.onPointerDown),style:{...c.style,...a.style}})};Y.displayName="ColorPickerHueSlider";import{skdxPart as uo}from"../utils/part.js";import{Primitive as mo}from"../utils/primitive.js";import{jsx as po}from"react/jsx-runtime";var Q=({ref:e,...o})=>{let t=u("ColorPickerHueSliderThumb");return po(mo.div,{"aria-hidden":!0,"data-channel":"hue","data-value":v(t.color.h),"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,...o,...uo("color-picker","hue-slider-thumb",o.className),ref:e})};Q.displayName="ColorPickerHueSliderThumb";import*as be from"react";import{clamp as fo}from"../utils/clamp.js";import{formatColor as Co,hsbToHsl as Pe,hsbToRgb as A,hslToHsb as ho,parseColor as Po,rgbToHsb as Z}from"../utils/color.js";import{skdxPart as bo}from"../utils/part.js";import{composeEventHandlers as j,Primitive as ko}from"../utils/primitive.js";import{jsx as xo}from"react/jsx-runtime";var yo={red:{max:255,label:"Red",read:e=>A(e).r,write:(e,o)=>Z({...A(e),r:o})},green:{max:255,label:"Green",read:e=>A(e).g,write:(e,o)=>Z({...A(e),g:o})},blue:{max:255,label:"Blue",read:e=>A(e).b,write:(e,o)=>Z({...A(e),b:o})},hue:{max:360,label:"Hue",read:e=>e.h,write:(e,o)=>({...e,h:o})},saturation:{max:100,label:"Saturation",read:e=>e.s,write:(e,o)=>({...e,s:o})},brightness:{max:100,label:"Brightness",read:e=>e.b,write:(e,o)=>({...e,b:o})},lightness:{max:100,label:"Lightness",read:e=>Pe(e).l,write:(e,o)=>ho({...Pe(e),l:o})},alpha:{max:100,label:"Opacity",read:e=>e.a*100,write:(e,o)=>({...e,a:o/100})}},ee=({channel:e,ref:o,...t})=>{let a=u("ColorPickerInput"),[r,i]=be.useState(null),l=e&&e!=="hex"?yo[e]:null,s=a.value;l?s=String(Math.round(l.read(a.color))):e==="hex"&&(s=Co(a.color,"hex",a.alpha));let c=n=>{if(!a.interactive)return!1;if(l){let p=Number(n.trim());return n.trim()===""||!Number.isFinite(p)?!1:(a.setColor(l.write(a.color,fo(p,0,l.max)),{announce:!0}),!0)}let m=Po(n);return m?(a.setColor(m,{announce:!0}),!0):!1};return xo(ko.input,{type:"text",inputMode:l?"numeric":"text",autoComplete:"off",spellCheck:!1,"aria-label":l?l.label:"Colour value","data-channel":e??"value","data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,disabled:a.disabled,readOnly:a.readOnly,...t,...bo("color-picker","input",t.className),ref:o,value:r??s,onChange:j(t.onChange,n=>i(n.target.value)),onKeyDown:j(t.onKeyDown,n=>{n.key==="Enter"?(n.preventDefault(),c(r??s),i(null)):n.key==="Escape"&&i(null)}),onBlur:j(t.onBlur,()=>{r!==null&&c(r),i(null)})})};ee.displayName="ColorPickerInput";import*as Se from"react";import{formatColor as Re,parseColor as Ho}from"../utils/color.js";import{skdxPart as To}from"../utils/part.js";import{composeEventHandlers as ve,Primitive as No}from"../utils/primitive.js";import{rovingTabIndex as Fo}from"../utils/useRovingFocus.js";import*as M from"react";import{useComposedRefs as Ro}from"../utils/composeRefs.js";import{createSafeContext as vo}from"../utils/createContext.js";import{skdxPart as So}from"../utils/part.js";import{composeEventHandlers as wo,Primitive as go}from"../utils/primitive.js";import{useRovingFocus as Eo,useRovingTabStop as Do}from"../utils/useRovingFocus.js";import{jsx as ye}from"react/jsx-runtime";var ke="[data-skdx-color-picker-swatch]",[Ao,xe]=vo("ColorPickerSwatchGroup"),oe=({loop:e=!0,ref:o,...t})=>{let a=u("ColorPickerSwatchGroup"),r=M.useRef(null),i=Ro(o,r),[l,s]=M.useState(null),c=Eo({orientation:"both",loop:e,itemSelector:ke});return Do(r,ke,"data-value",l,s),ye(Ao,{activeValue:l,setActiveValue:s,children:ye(go.div,{role:"radiogroup","aria-disabled":a.disabled||void 0,"aria-readonly":a.readOnly||void 0,"data-disabled":a.disabled?"":void 0,"data-readonly":a.readOnly?"":void 0,...t,...So("color-picker","swatch-group",t.className),ref:i,onKeyDown:wo(t.onKeyDown,c)})})};oe.displayName="ColorPickerSwatchGroup";import{jsx as Oo}from"react/jsx-runtime";var re=({value:e,disabled:o,ref:t,...a})=>{let r=u("ColorPickerSwatch"),i=xe("ColorPickerSwatch"),l=Ho(e),s=r.disabled||o||l===null,c=l?Re(l,"hex",r.alpha):e,n=l!==null&&c===Re(r.color,"hex",r.alpha);Se.useLayoutEffect(()=>{n&&i.setActiveValue(e)},[n,e,i]);let m={"--skdx-color-picker-swatch-value":c,...a.style};return Oo(No.button,{type:"button",role:"radio","aria-checked":n,"aria-label":c,"aria-disabled":s||void 0,tabIndex:Fo(i.activeValue!==null,i.activeValue===e,s),"data-skdx-color-picker-swatch":"","data-value":e,"data-state":n?"checked":"unchecked","data-disabled":s?"":void 0,"data-readonly":r.readOnly?"":void 0,disabled:s,...a,...To("color-picker","swatch",a.className),ref:t,onFocus:ve(a.onFocus,()=>{i.setActiveValue(e),!n&&l&&r.setColor(l,{announce:!0})}),onClick:ve(a.onClick,()=>{l&&r.setColor(l,{announce:!0})}),style:m})};re.displayName="ColorPickerSwatch";import{Fragment as Vo,jsx as R,jsxs as Lo}from"react/jsx-runtime";var we=({showInput:e,showSwatches:o,showEyeDropper:t,swatches:a=[]})=>Lo(Vo,{children:[R(X,{children:R(q,{})}),R(Y,{children:R(Q,{})}),R(W,{children:R(z,{})}),e?R(ee,{}):null,o&&a.length>0?R(oe,{"aria-label":"Preset colours",children:a.map(r=>R(re,{value:r},r))}):null,t?R(J,{}):null]});import{jsx as te}from"react/jsx-runtime";var Bo={h:0,s:0,b:0,a:1};function H(e){return Math.round(e*1e3)/1e3}var[Wo,u]=Ko("ColorPicker");function zo(e,o){return{"data-disabled":e?"":void 0,"data-readonly":o?"":void 0}}function Xo({value:e,defaultValue:o,onValueChange:t,format:a,defaultFormat:r,onFormatChange:i}){let[l="hex",s]=Ee({prop:a,defaultProp:r,onChange:i}),[c=o,n]=Ee({prop:e,defaultProp:o,onChange:t}),[m,p]=C.useState(()=>ge(e??o)??Bo),[P,f]=C.useState(c);if(c!==P){f(c);let d=ge(c);d&&p(d)}let h=C.useRef(c);C.useInsertionEffect(()=>{h.current=c});let y=C.useRef(m);return C.useInsertionEffect(()=>{y.current=m}),{format:l,setFormatState:s,value:c,setValue:n,color:m,setColorState:p,setOwnValue:f,valueRef:h,colorRef:y}}var De=({ref:e,...o})=>{let{value:t,defaultValue:a="#000000",onValueChange:r,onValueCommit:i,format:l,defaultFormat:s="hex",onFormatChange:c,alpha:n=!0,step:m=1,disabled:p=!1,readOnly:P=!1,showInput:f=!0,showSwatches:h=!0,showEyeDropper:y=!0,swatches:d=[],children:b,fullWidth:g,size:N,asChild:ae,...E}=o,{format:x,setFormatState:ne,value:ie,setValue:F,color:S,setColorState:le,setOwnValue:O,valueRef:$,colorRef:se}=Xo({value:t,defaultValue:a,onValueChange:r,format:l,defaultFormat:s,onFormatChange:c}),T=!p&&!P,U=C.useCallback(k=>{let V=G(k,"hex",!1);return n&&k.a<1?`${V}, ${Math.round(k.a*100)}% opaque`:V},[n]),He=C.useCallback((k,V)=>{if(!T)return;let de=G(k,x,n);le(k),O(de),F(de),V?.announce&&Mo(U(k))},[T,x,n,F,U,le,O]),Te=C.useCallback(k=>{T&&ne(k)},[T,ne]),ce=C.useRef(x);C.useEffect(()=>{if(ce.current===x)return;ce.current=x;let k=G(se.current,x,n);k!==$.current&&(O(k),F(k))},[x,n,F,se,$,O]);let Ne=Uo(()=>i?.($.current));return te(Wo,{color:S,value:ie,format:x,alpha:n,step:m,disabled:p,readOnly:P,interactive:T,describe:U,setColor:He,commit:Ne,setFormat:Te,children:te($o.div,{"data-value":ie,"data-format":x,...zo(p,P),...E,...Io({fullWidth:g,size:N},E),...Go("color-picker","root",E.className),asChild:b&&C.Children.count(b)===1?ae:!1,ref:e,style:{"--skdx-color-picker-hue":`${H(S.h)}deg`,"--skdx-color-picker-hue-position":`${H(S.h/360*100)}%`,"--skdx-color-picker-saturation":`${H(S.s)}%`,"--skdx-color-picker-brightness":`${H(S.b)}%`,"--skdx-color-picker-alpha":H(S.a),"--skdx-color-picker-alpha-position":`${H(S.a*100)}%`,"--skdx-color-picker-value":G(S,"hex",n),...E.style},children:b??te(we,{showInput:f,showSwatches:h,showEyeDropper:y,swatches:d})})})};De.displayName="ColorPicker";import{skdxPart as _o}from"../utils/part.js";import{composeEventHandlers as qo}from"../utils/primitive.js";import{jsx as Ae}from"react/jsx-runtime";var Jo=["hex","rgb","hsl","hsb"],Yo={hex:"HEX",rgb:"RGB",hsl:"HSL",hsb:"HSB"},Qo=({formats:e=Jo,children:o,ref:t,...a})=>{let r=u("ColorPickerFormatSelect");return Ae("select",{"aria-label":"Colour format","aria-readonly":r.readOnly||void 0,"data-disabled":r.disabled?"":void 0,"data-readonly":r.readOnly?"":void 0,disabled:r.disabled,...a,..._o("color-picker","format-select",a.className),ref:t,value:r.format,onChange:qo(a.onChange,i=>r.setFormat(i.target.value)),children:o??e.map(i=>Ae("option",{value:i,children:Yo[i]},i))})};Qo.displayName="ColorPickerFormatSelect";export{De as ColorPicker,W as ColorPickerAlphaSlider,z as ColorPickerAlphaSliderThumb,X as ColorPickerArea,q as ColorPickerAreaThumb,J as ColorPickerEyeDropper,Qo as ColorPickerFormatSelect,Y as ColorPickerHueSlider,Q as ColorPickerHueSliderThumb,ee as ColorPickerInput,Wo as ColorPickerProvider,re as ColorPickerSwatch,oe as ColorPickerSwatchGroup,Ao as ColorPickerSwatchGroupProvider,ke as SWATCH_SELECTOR,u as useColorPickerContext,xe as useColorPickerSwatchGroupContext};

package/dist/combobox/Combobox.cjs

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var Mo=Object.create;var K=Object.defineProperty;var So=Object.getOwnPropertyDescriptor;var Lo=Object.getOwnPropertyNames;var No=Object.getPrototypeOf,Go=Object.prototype.hasOwnProperty;var Ao=(o,t)=>{for(var n in t)K(o,n,{get:t[n],enumerable:!0})},he=(o,t,n,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of Lo(t))!Go.call(o,e)&&e!==n&&K(o,e,{get:()=>t[e],enumerable:!(i=So(t,e))||i.enumerable});return o};var ae=(o,t,n)=>(n=o!=null?Mo(No(o)):{},he(t||!o||!o.__esModule?K(n,"default",{value:o,enumerable:!0}):n,o)),Fo=o=>he(K({},"__esModule",{value:!0}),o);var Yo={};Ao(Yo,{Combobox:()=>no,ComboboxAnatomy:()=>me,ComboboxClear:()=>mo,ComboboxContent:()=>q,ComboboxEmpty:()=>B,ComboboxGroup:()=>W,ComboboxGroupLabel:()=>z,ComboboxGroupProvider:()=>Se,ComboboxInput:()=>U,ComboboxItem:()=>_,ComboboxPortal:()=>$,ComboboxProvider:()=>to,ComboboxTrigger:()=>io,OPTION_SELECTOR:()=>J,defaultGetResultCountLabel:()=>oo,defaultOptionsFilter:()=>Y,useComboboxContext:()=>C,useComboboxGroupContext:()=>le});module.exports=Fo(Yo);var s=ae(require("react"),1),$e=require("../utils/createContext.cjs"),Q=require("../utils/formControl.cjs"),Ye=require("../utils/hiddenInput.cjs"),Qe=require("../utils/liveAnnouncer.cjs"),Ze=require("../utils/popper.cjs"),ue=require("../utils/recipeAxis.cjs"),w=require("../utils/scoredFilter.cjs"),ce=require("../utils/useControllableState.cjs"),je=require("../utils/useOpenChangeComplete.cjs"),eo=require("../utils/useSelection.cjs");var ye=require("../utils/composeRefs.cjs"),Pe=require("../utils/part.cjs"),Ie=require("../utils/popper.cjs"),Oe=require("../utils/primitive.cjs"),ve=require("../utils/useDismiss.cjs");var Ee=require("react/jsx-runtime"),q=({forceMount:o,side:t="bottom",align:n="start",sideOffset:i=4,onEscapeKeyDown:e,onPointerDownOutside:a,onFocusOutside:m,onInteractOutside:u,ref:p,...c})=>{let l=C("ComboboxContent"),x=(0,ye.useComposedRefs)(p,l.contentRef);return(0,ve.useDismiss)({enabled:l.open,onEscapeKeyDown:b=>{e?.(b),b.defaultPrevented||l.onOpenChange(!1)},onInteractOutside:u,onPointerDownOutside:b=>{a?.(b),b.defaultPrevented||l.onOpenChange(!1)},onFocusOutside:b=>{m?.(b),b.defaultPrevented||l.onOpenChange(!1)}},[l.contentRef,l.inputRef,l.triggerRef]),o||l.open?(0,Ee.jsx)(Ie.PopperContent,{component:"combobox",role:"listbox",id:l.contentId,"aria-multiselectable":l.multiple?!0:void 0,"aria-busy":l.loading?!0:void 0,"data-state":l.open?"open":"closed","data-loading":l.loading?"":void 0,"data-multiple":l.multiple?"":void 0,side:t,align:n,sideOffset:i,...c,...(0,Pe.skdxPart)("combobox","content",c.className),ref:x,onMouseDown:(0,Oe.composeEventHandlers)(c.onMouseDown,b=>b.preventDefault())}):null};q.displayName="ComboboxContent";var ke=require("../utils/part.cjs"),He=require("../utils/primitive.cjs");var Ve=require("react/jsx-runtime"),B=({ref:o,...t})=>C("ComboboxEmpty").itemCount===0?(0,Ve.jsx)(He.Primitive.div,{role:"presentation",...t,...(0,ke.skdxPart)("combobox","empty",t.className),ref:o}):null;B.displayName="ComboboxEmpty";var Te=ae(require("react"),1),we=require("../utils/createContext.cjs"),De=require("../utils/part.cjs"),Me=require("../utils/primitive.cjs"),ie=require("react/jsx-runtime"),[Se,le]=(0,we.createSafeContext)("ComboboxGroup"),W=({ref:o,...t})=>{let n=Te.useId();return(0,ie.jsx)(Se,{labelId:n,children:(0,ie.jsx)(Me.Primitive.div,{role:"group","aria-labelledby":n,...t,...(0,De.skdxPart)("combobox","group",t.className),ref:o})})};W.displayName="ComboboxGroup";var Le=require("../utils/part.cjs"),Ne=require("../utils/primitive.cjs");var Ge=require("react/jsx-runtime"),z=({ref:o,...t})=>{let n=le("ComboboxGroupLabel");return(0,Ge.jsx)(Ne.Primitive.div,{id:n.labelId,...t,...(0,Le.skdxPart)("combobox","label",t.className),ref:o})};z.displayName="ComboboxGroupLabel";var Ae=require("../utils/appearance.cjs"),Fe=require("../utils/composeRefs.cjs"),Ke=require("../utils/part.cjs"),qe=require("../utils/popper.cjs"),O=require("../utils/primitive.cjs"),Be=require("../utils/scoredFilter.cjs");var se=require("react/jsx-runtime"),Ko=new Set(["Home","End","PageUp","PageDown"]),U=({ref:o,shape:t,size:n,...i})=>{let e=C("ComboboxInput"),a=(0,Fe.useComposedRefs)(o,e.inputRef),m=r=>{r&&(e.setActiveId(r.id,"keyboard"),r.scrollIntoView?.({block:"nearest"}))},u=()=>{let r=e.contentRef.current;return r?(0,Be.sortByOrder)(Array.from(r.querySelectorAll(J)),e.itemOrder):[]},p=r=>{let f=u();if(f.length===0)return;let I=f.findIndex(v=>v.id===e.activeId),d=I;I===-1&&(d=r===1?-1:0);let g=e.loop?(d+r+f.length)%f.length:Math.min(f.length-1,Math.max(0,d+r));m(f[g])},c=()=>{if(!e.activeId)return;let r=e.getItem(e.activeId);r&&e.selectItem(r.value,r.text||r.value,"keyboard")},l=r=>r.altKey&&r.key==="ArrowDown"?(r.preventDefault(),e.open||e.onOpenChange(!0),!0):r.altKey&&r.key==="ArrowUp"?(r.preventDefault(),e.activeId&&c(),e.open&&e.onOpenChange(!1),!0):!1,x=r=>{if(r.key==="ArrowDown")return r.preventDefault(),e.open?p(1):e.openWithHighlight("first"),!0;if(r.key==="ArrowUp")return r.preventDefault(),e.open?p(-1):e.openWithHighlight("last"),!0;if(Ko.has(r.key)&&e.open){r.preventDefault();let f=u(),I=r.key==="Home"||r.key==="PageUp";return m(I?f[0]:f[f.length-1]),!0}return!1},b=r=>{r.key==="Enter"?e.activeId?(r.preventDefault(),c()):e.allowCustomValue&&e.inputValue!==""?(r.preventDefault(),e.selectItem(e.inputValue,e.inputValue,"keyboard")):e.open&&e.onOpenChange(!1):r.key==="Escape"&&e.open&&!e.contentRef.current&&(r.preventDefault(),e.onOpenChange(!1))};return(0,se.jsx)(qe.PopperAnchor,{asChild:!0,children:(0,se.jsx)(O.Primitive.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.contentId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",readOnly:e.readOnly,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"aria-invalid":e.invalid?!0:void 0,"aria-required":e.required?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"aria-busy":e.loading?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-loading":e.loading?"":void 0,"data-multiple":e.multiple?"":void 0,...i,...(0,Ae.appearanceAttrs)({shape:t,size:n},i),...(0,Ke.skdxPart)("combobox","input",i.className),ref:a,value:e.inputValue,onChange:(0,O.composeEventHandlers)(i.onChange,r=>{e.onInputValueChange(r.target.value),e.open||e.onOpenChange(!0)}),onClick:(0,O.composeEventHandlers)(i.onClick,()=>{e.openOn==="type"||e.readOnly||e.open||e.onOpenChange(!0)}),onFocus:(0,O.composeEventHandlers)(i.onFocus,()=>{e.openOn!=="focus"||e.readOnly||e.open||e.onOpenChange(!0)}),onBlur:(0,O.composeEventHandlers)(i.onBlur,r=>{let f=r.relatedTarget;f&&(f===r.currentTarget||e.contentRef.current?.contains(f))||e.reconcileDraftText()}),onKeyDown:(0,O.composeEventHandlers)(i.onKeyDown,r=>{l(r)||x(r)||b(r)})})})};U.displayName="ComboboxInput";var X=ae(require("react"),1),We=require("../utils/composeRefs.cjs"),ze=require("../utils/part.cjs"),M=require("../utils/primitive.cjs"),Ue=require("../utils/useOptionCollection.cjs");var Je=require("react/jsx-runtime"),_=({value:o,disabled:t,textValue:n,ref:i,...e})=>{let a=C("ComboboxItem"),m=X.useId(),u=X.useRef(null),p=(0,We.useComposedRefs)(i,u),c=a.isSelected(o),l=a.activeId===m,x=a.itemOrder?.get(m),{text:b,visible:r}=(0,Ue.useOptionEntry)({id:m,value:o,textValue:n,itemRef:u,matchesFilter:a.matchesFilter,registerItem:a.registerItem,unregisterItem:a.unregisterItem}),f=()=>{t||(a.selectItem(o,b??o,"pointer"),a.inputRef.current?.focus())};return r?(0,Je.jsx)(M.Primitive.div,{role:"option",id:m,"data-value":o,"aria-selected":c,"data-state":c?"checked":"unchecked","data-highlighted":l?"":void 0,"aria-disabled":t||void 0,"data-disabled":t?"":void 0,...e,...(0,ze.skdxPart)("combobox","item",e.className),ref:p,onClick:(0,M.composeEventHandlers)(e.onClick,f),onPointerEnter:(0,M.composeEventHandlers)(e.onPointerEnter,()=>{t||a.setActiveId(m,"pointer")}),style:x!==void 0?{order:x,...e.style}:e.style}):null};_.displayName="ComboboxItem";var Xe=require("../utils/portal.cjs");var _e=require("react/jsx-runtime"),$=({forceMount:o,children:t,...n})=>{let i=C("ComboboxPortal");return o||i.open?(0,_e.jsx)(Xe.Portal,{...n,children:t}):null};$.displayName="ComboboxPortal";var R=require("react/jsx-runtime"),qo=o=>"options"in o;function Y(o,t){return o.toLowerCase().includes(t.trim().toLowerCase())}var me=({shape:o,size:t,options:n,renderOption:i,placeholder:e,ariaLabel:a,passThrough:m})=>{let u=C("Combobox"),p=a??e,c=l=>(0,R.jsx)(_,{value:l.value,disabled:l.disabled,textValue:l.label,children:i?i(l,{selected:u.isSelected(l.value)}):l.label??l.value},l.value);return(0,R.jsxs)(R.Fragment,{children:[(0,R.jsx)(U,{...m,shape:o,size:t,"aria-label":p,placeholder:e}),(0,R.jsx)($,{children:(0,R.jsxs)(q,{"aria-label":p,children:[n.map(l=>qo(l)?(0,R.jsxs)(W,{children:[(0,R.jsx)(z,{children:l.label}),l.options.map(c)]},l.label):c(l)),(0,R.jsx)(B,{children:"No results"})]})})]})};var T=require("react/jsx-runtime"),J='[role="option"]:not([data-disabled])';function Bo(o,t){let n=o.querySelector('[data-part="viewport"]')??o;if(n===t||!n.contains(t))return;let i=n.getBoundingClientRect(),e=t.getBoundingClientRect();n.scrollTop+=e.top-i.top-(i.height-e.height)/2}function oo(o){return`${o} result${o===1?"":"s"} available`}var[to,C]=(0,$e.createSafeContext)("Combobox");function Wo(o,t){return o??(t?Y:"manual")}function zo(){let[o,t]=s.useState(()=>new Map),n=s.useCallback((a,m)=>{t(u=>{let p=u.get(a);if(p?.value===m.value&&p.text===m.text)return u;let c=new Map(u);return c.set(a,m),c})},[]),i=s.useCallback(a=>{t(m=>{if(!m.has(a))return m;let u=new Map(m);return u.delete(a),u})},[]),e=s.useCallback(a=>o.get(a),[o]);return{items:o,itemCount:o.size,registerItem:n,unregisterItem:i,getItem:e}}function Uo({value:o,defaultValue:t,onValueChange:n,multiple:i}){let e=s.useRef("programmatic"),a=s.useRef([]),{selectedValues:m,isSelected:u,selectItem:p,setSelection:c}=(0,eo.useSelection)({value:o,defaultValue:t,onValueChange:b=>n?.({value:b.value,previousValue:a.current,reason:e.current,selectedValue:b.selectedValue}),multiple:i,label:"Combobox"}),l=s.useCallback((b,r)=>{a.current=m,e.current=r,p(b)},[p,m]),x=s.useCallback((b,r)=>{a.current=m,e.current=r,c(b)},[c,m]);return{selectedValues:m,isSelected:u,commitSelection:l,setSelection:x}}function Jo({inputValue:o,defaultInputValue:t="",onInputValueChange:n,inputRef:i,defaultValue:e,setSelection:a}){let[m="",u]=(0,ce.useControllableState)({prop:o,defaultProp:t,onChange:n});return(0,Q.useFormReset)(i,()=>{e!==void 0&&a(e,"programmatic"),u(t)}),[m,u]}function Xo({open:o,defaultOpen:t=!1,onOpenChange:n,setActiveId:i}){let[e=!1,a]=(0,ce.useControllableState)({prop:o,defaultProp:t,onChange:n}),[m,u]=s.useState(e);return e!==m&&(u(e),e||i(null)),[e,a]}function _o({open:o,setOpen:t,autoHighlight:n,itemCount:i,items:e,contentRef:a,orderedOptions:m,onHighlightChange:u,activeId:p,setActiveId:c}){let l=s.useRef(null);s.useEffect(()=>{if(!o)return;let d=requestAnimationFrame(()=>{let g=l.current;if(l.current=null,!g)return;let v=a.current,E=m(v);if(!v||E.length===0)return;let N=g==="last"?E[E.length-1]:E[0];c(Z=>Z??N.id),Bo(v,N)});return()=>cancelAnimationFrame(d)},[o,m,a,c]);let x=s.useRef("auto"),b=s.useRef(null),r=s.useCallback((d,g="auto")=>{x.current=g,c(d)},[c]),f=p?e.get(p)?.value??null:null;s.useEffect(()=>{let d=b.current;f!==d&&(b.current=f,u?.({value:f,previousValue:d,reason:x.current}))},[f,u]),s.useLayoutEffect(()=>{if(p===null)return;let d=m(a.current);d.some(g=>g.id===p)||c(d[0]?.id??null)}),s.useEffect(()=>{if(!n||!o||p!==null)return;let d=requestAnimationFrame(()=>{let g=m(a.current)[0];g&&c(g.id)});return()=>cancelAnimationFrame(d)},[n,o,p,i,m,a,c]);let I=s.useCallback(d=>{l.current=d,t(!0)},[t]);return{setActiveIdWithReason:r,openWithHighlight:I}}function $o(o,t,n,i){s.useEffect(()=>{!o||t||(0,Qe.announce)(i(n))},[o,t,n,i])}var no=function({children:t,value:n,defaultValue:i,onValueChange:e,multiple:a=!1,allowCustomValue:m=!1,filter:u,autoHighlight:p=!1,loop:c=!0,openOn:l="type",onHighlightChange:x,loading:b=!1,inputValue:r,defaultInputValue:f,onInputValueChange:I,open:d,defaultOpen:g,onOpenChange:v,onOpenChangeComplete:E,invalid:N=!1,readOnly:Z=!1,disabled:be=!1,getResultCountLabel:co=oo,name:bo,form:po,required:pe=!1,options:fe,renderOption:fo,placeholder:Co,"aria-label":xo,shape:go,size:Ro,ref:ho,...j}){let k=Wo(u,fe),de=s.useRef(null),yo=s.useRef(null),Ce=s.useRef(null),ee=s.useRef(null),[xe,ge]=s.useState(null),{items:H,itemCount:oe,registerItem:Po,unregisterItem:Io,getItem:Oo}=zo(),{selectedValues:V,isSelected:vo,commitSelection:Re,setSelection:te}=Uo({value:n,defaultValue:i,onValueChange:e,multiple:a}),[D,y]=Jo({inputValue:r,defaultInputValue:f,onInputValueChange:I,inputRef:de,defaultValue:i,setSelection:te}),[G,A]=Xo({open:d,defaultOpen:g,onOpenChange:v,setActiveId:ge});(0,je.useOpenChangeComplete)(G,ee,E);let ne=s.useMemo(()=>k==="manual"?null:(0,w.rankByScore)([...H.keys()],h=>{let P=H.get(h);if(!P)return null;let F=k(P.text,D);return typeof F=="number"?F:null}),[k,D,H]),Eo=s.useCallback(h=>(0,w.sortByOrder)(Array.from(h?.querySelectorAll(J)??[]),ne),[ne]),{setActiveIdWithReason:ko,openWithHighlight:Ho}=_o({open:G,setOpen:A,autoHighlight:p,itemCount:oe,items:H,contentRef:ee,orderedOptions:Eo,onHighlightChange:x,activeId:xe,setActiveId:ge});$o(G,b,oe,co);let Vo=s.useCallback(h=>k==="manual"||(0,w.filterKeeps)(k(h,D)),[k,D]),re=s.useRef(null),To=s.useCallback((h,P,F)=>{if(Re(h,F),!a){re.current=P,y(P),A(!1);return}y("")},[Re,a,y,A]),wo=s.useCallback(()=>{V.length>0&&te([],"pointer"),re.current=null,y("")},[V.length,te,y]),Do=s.useCallback(()=>{if(m)return;let h=a?void 0:V[0];if(h===void 0){y("");return}for(let P of H.values())if(P.value===h){y(P.text||P.value);return}y(re.current??h)},[m,a,V,H,y]);return s.useImperativeHandle(ho,()=>(0,Q.formValidityHandle)(Ce),[]),(0,T.jsx)(Ze.PopperRoot,{children:(0,T.jsxs)(to,{inputRef:de,triggerRef:yo,contentRef:ee,contentId:s.useId(),multiple:a,selectedValues:V,isSelected:vo,selectItem:To,clear:wo,inputValue:D,onInputValueChange:y,open:G,onOpenChange:A,activeId:xe,itemOrder:ne,setActiveId:ko,openWithHighlight:Ho,loop:c,openOn:l,reconcileDraftText:Do,itemCount:oe,registerItem:Po,unregisterItem:Io,getItem:Oo,matchesFilter:Vo,invalid:N,readOnly:Z,disabled:be,loading:b,allowCustomValue:m,required:pe,children:[t??(0,T.jsx)(me,{shape:(0,ue.recipeAxis)(go,j,"data-shape"),size:(0,ue.recipeAxis)(Ro,j,"data-size"),options:fe??[],renderOption:fo,placeholder:Co,ariaLabel:xo,passThrough:j}),(0,T.jsx)(Ye.MirroredValues,{name:bo,values:V,required:pe,disabled:be,form:po,singleValued:!a,controlRef:Ce})]})})};no.displayName="Combobox";var ro=require("../utils/composeRefs.cjs"),ao=require("../utils/part.cjs"),S=require("../utils/primitive.cjs");var lo=require("react/jsx-runtime"),io=({ref:o,...t})=>{let n=C("ComboboxTrigger"),i=(0,ro.useComposedRefs)(o,n.triggerRef);return(0,lo.jsx)(S.Primitive.button,{type:"button",tabIndex:-1,"aria-expanded":n.open,"aria-controls":n.open?n.contentId:void 0,disabled:n.disabled,"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,"data-state":n.open?"open":"closed",...t,...(0,ao.skdxPart)("combobox","trigger",t.className),ref:i,onMouseDown:(0,S.composeEventHandlers)(t.onMouseDown,e=>e.preventDefault()),onClick:(0,S.composeEventHandlers)(t.onClick,()=>{n.readOnly||(n.onOpenChange(!n.open),n.inputRef.current?.focus())})})};io.displayName="ComboboxTrigger";var so=require("../utils/part.cjs"),L=require("../utils/primitive.cjs");var uo=require("react/jsx-runtime"),mo=({ref:o,...t})=>{let n=C("ComboboxClear"),i=n.selectedValues.length===0&&n.inputValue==="";return(0,uo.jsx)(L.Primitive.button,{type:"button",tabIndex:-1,disabled:n.disabled||n.readOnly||i,"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,...t,...(0,so.skdxPart)("combobox","clear",t.className),ref:o,onMouseDown:(0,L.composeEventHandlers)(t.onMouseDown,e=>e.preventDefault()),onClick:(0,L.composeEventHandlers)(t.onClick,()=>{n.clear(),n.inputRef.current?.focus()})})};mo.displayName="ComboboxClear";0&&(module.exports={Combobox,ComboboxAnatomy,ComboboxClear,ComboboxContent,ComboboxEmpty,ComboboxGroup,ComboboxGroupLabel,ComboboxGroupProvider,ComboboxInput,ComboboxItem,ComboboxPortal,ComboboxProvider,ComboboxTrigger,OPTION_SELECTOR,defaultGetResultCountLabel,defaultOptionsFilter,useComboboxContext,useComboboxGroupContext});
+"use strict";var So=Object.create;var q=Object.defineProperty;var Lo=Object.getOwnPropertyDescriptor;var No=Object.getOwnPropertyNames;var Go=Object.getPrototypeOf,Ao=Object.prototype.hasOwnProperty;var Fo=(t,o)=>{for(var n in o)q(t,n,{get:o[n],enumerable:!0})},ye=(t,o,n,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of No(o))!Ao.call(t,e)&&e!==n&&q(t,e,{get:()=>o[e],enumerable:!(a=Lo(o,e))||a.enumerable});return t};var se=(t,o,n)=>(n=t!=null?So(Go(t)):{},ye(o||!t||!t.__esModule?q(n,"default",{value:t,enumerable:!0}):n,t)),Ko=t=>ye(q({},"__esModule",{value:!0}),t);var jo={};Fo(jo,{Combobox:()=>ro,ComboboxAnatomy:()=>be,ComboboxClear:()=>mo,ComboboxContent:()=>B,ComboboxEmpty:()=>W,ComboboxGroup:()=>z,ComboboxGroupLabel:()=>U,ComboboxGroupProvider:()=>Le,ComboboxInput:()=>J,ComboboxItem:()=>$,ComboboxPortal:()=>Y,ComboboxProvider:()=>no,ComboboxTrigger:()=>lo,OPTION_SELECTOR:()=>X,defaultGetResultCountLabel:()=>to,defaultOptionsFilter:()=>Q,useComboboxContext:()=>C,useComboboxGroupContext:()=>me});module.exports=Ko(jo);var l=se(require("react"),1),Ye=require("../utils/createContext.cjs"),Z=require("../utils/formControl.cjs"),Qe=require("../utils/hiddenInput.cjs"),Ze=require("../utils/liveAnnouncer.cjs"),je=require("../utils/popper.cjs"),pe=require("../utils/recipeAxis.cjs"),w=require("../utils/scoredFilter.cjs"),fe=require("../utils/useControllableState.cjs"),eo=require("../utils/useOpenChangeComplete.cjs"),oo=require("../utils/useSelection.cjs");var Pe=require("../utils/composeRefs.cjs"),Ie=require("../utils/part.cjs"),ve=require("../utils/popper.cjs"),Oe=require("../utils/primitive.cjs"),Ee=require("../utils/useDismiss.cjs");var ke=require("react/jsx-runtime"),B=({forceMount:t,side:o="bottom",align:n="start",sideOffset:a=4,onEscapeKeyDown:e,onPointerDownOutside:i,onFocusOutside:s,onInteractOutside:m,ref:b,...c})=>{let u=C("ComboboxContent"),g=(0,Pe.useComposedRefs)(b,u.contentRef);return(0,Ee.useDismiss)({enabled:u.open,onEscapeKeyDown:p=>{e?.(p),p.defaultPrevented||u.onOpenChange(!1)},onInteractOutside:m,onPointerDownOutside:p=>{i?.(p),p.defaultPrevented||u.onOpenChange(!1)},onFocusOutside:p=>{s?.(p),p.defaultPrevented||u.onOpenChange(!1)}},[u.contentRef,u.inputRef,u.triggerRef]),t||u.open?(0,ke.jsx)(ve.PopperContent,{component:"combobox",role:"listbox",id:u.contentId,"aria-multiselectable":u.multiple?!0:void 0,"aria-busy":u.loading?!0:void 0,"data-state":u.open?"open":"closed","data-loading":u.loading?"":void 0,"data-multiple":u.multiple?"":void 0,side:o,align:n,sideOffset:a,...c,...(0,Ie.skdxPart)("combobox","content",c.className),ref:g,onMouseDown:(0,Oe.composeEventHandlers)(c.onMouseDown,p=>p.preventDefault())}):null};B.displayName="ComboboxContent";var He=require("../utils/part.cjs"),Te=require("../utils/primitive.cjs");var Ve=require("react/jsx-runtime"),W=({ref:t,...o})=>C("ComboboxEmpty").itemCount===0?(0,Ve.jsx)(Te.Primitive.div,{role:"presentation",...o,...(0,He.skdxPart)("combobox","empty",o.className),ref:t}):null;W.displayName="ComboboxEmpty";var we=se(require("react"),1),De=require("../utils/createContext.cjs"),Me=require("../utils/part.cjs"),Se=require("../utils/primitive.cjs"),ue=require("react/jsx-runtime"),[Le,me]=(0,De.createSafeContext)("ComboboxGroup"),z=({ref:t,...o})=>{let n=we.useId();return(0,ue.jsx)(Le,{labelId:n,children:(0,ue.jsx)(Se.Primitive.div,{role:"group","aria-labelledby":n,...o,...(0,Me.skdxPart)("combobox","group",o.className),ref:t})})};z.displayName="ComboboxGroup";var Ne=require("../utils/part.cjs"),Ge=require("../utils/primitive.cjs");var Ae=require("react/jsx-runtime"),U=({ref:t,...o})=>{let n=me("ComboboxGroupLabel");return(0,Ae.jsx)(Ge.Primitive.div,{id:n.labelId,...o,...(0,Ne.skdxPart)("combobox","label",o.className),ref:t})};U.displayName="ComboboxGroupLabel";var Fe=require("../utils/appearance.cjs"),Ke=require("../utils/composeRefs.cjs"),qe=require("../utils/part.cjs"),Be=require("../utils/popper.cjs"),v=require("../utils/primitive.cjs"),We=require("../utils/scoredFilter.cjs");var ce=require("react/jsx-runtime"),qo=new Set(["Home","End","PageUp","PageDown"]),J=({ref:t,shape:o,size:n,...a})=>{let e=C("ComboboxInput"),i=(0,Ke.useComposedRefs)(t,e.inputRef),s=r=>{r&&(e.setActiveId(r.id,"keyboard"),r.scrollIntoView?.({block:"nearest"}))},m=()=>{let r=e.contentRef.current;return r?(0,We.sortByOrder)(Array.from(r.querySelectorAll(X)),e.itemOrder):[]},b=r=>{let f=m();if(f.length===0)return;let I=f.findIndex(O=>O.id===e.activeId),d=I;I===-1&&(d=r===1?-1:0);let R=e.loop?(d+r+f.length)%f.length:Math.min(f.length-1,Math.max(0,d+r));s(f[R])},c=()=>{if(!e.activeId)return;let r=e.getItem(e.activeId);r&&e.selectItem(r.value,r.text||r.value,"keyboard")},u=r=>r.altKey&&r.key==="ArrowDown"?(r.preventDefault(),e.open||e.onOpenChange(!0),!0):r.altKey&&r.key==="ArrowUp"?(r.preventDefault(),e.activeId&&c(),e.open&&e.onOpenChange(!1),!0):!1,g=r=>{if(r.key==="ArrowDown")return r.preventDefault(),e.open?b(1):e.openWithHighlight("first"),!0;if(r.key==="ArrowUp")return r.preventDefault(),e.open?b(-1):e.openWithHighlight("last"),!0;if(qo.has(r.key)&&e.open){r.preventDefault();let f=m(),I=r.key==="Home"||r.key==="PageUp";return s(I?f[0]:f[f.length-1]),!0}return!1},p=r=>{r.key==="Enter"?e.activeId?(r.preventDefault(),c()):e.allowCustomValue&&e.inputValue!==""?(r.preventDefault(),e.selectItem(e.inputValue,e.inputValue,"keyboard")):e.open&&e.onOpenChange(!1):r.key==="Escape"&&e.open&&!e.contentRef.current&&(r.preventDefault(),e.onOpenChange(!1))};return(0,ce.jsx)(Be.PopperAnchor,{asChild:!0,children:(0,ce.jsx)(v.Primitive.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.contentId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",readOnly:e.readOnly,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"aria-invalid":e.invalid?!0:void 0,"aria-required":e.required?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"aria-busy":e.loading?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-loading":e.loading?"":void 0,"data-multiple":e.multiple?"":void 0,...a,...(0,Fe.appearanceAttrs)({shape:o,size:n},a),...(0,qe.skdxPart)("combobox","input",a.className),ref:i,value:e.inputValue,onChange:(0,v.composeEventHandlers)(a.onChange,r=>{e.onInputValueChange(r.target.value),e.open||e.onOpenChange(!0)}),onClick:(0,v.composeEventHandlers)(a.onClick,()=>{e.openOn==="type"||e.readOnly||e.open||e.onOpenChange(!0)}),onFocus:(0,v.composeEventHandlers)(a.onFocus,()=>{e.openOn!=="focus"||e.readOnly||e.open||e.onOpenChange(!0)}),onBlur:(0,v.composeEventHandlers)(a.onBlur,r=>{let f=r.relatedTarget;f&&(f===r.currentTarget||e.contentRef.current?.contains(f))||e.reconcileDraftText()}),onKeyDown:(0,v.composeEventHandlers)(a.onKeyDown,r=>{u(r)||g(r)||p(r)})})})};J.displayName="ComboboxInput";var _=se(require("react"),1),ze=require("../utils/composeRefs.cjs"),Ue=require("../utils/part.cjs"),M=require("../utils/primitive.cjs"),Je=require("../utils/useOptionCollection.cjs");var Xe=require("react/jsx-runtime"),$=({value:t,disabled:o,textValue:n,ref:a,...e})=>{let i=C("ComboboxItem"),s=_.useId(),m=_.useRef(null),b=(0,ze.useComposedRefs)(a,m),c=i.isSelected(t),u=i.activeId===s,g=i.itemOrder?.get(s),{text:p,visible:r}=(0,Je.useOptionEntry)({id:s,value:t,textValue:n,itemRef:m,matchesFilter:i.matchesFilter,registerItem:i.registerItem,unregisterItem:i.unregisterItem}),f=()=>{o||(i.selectItem(t,p??t,"pointer"),i.inputRef.current?.focus())};return r?(0,Xe.jsx)(M.Primitive.div,{role:"option",id:s,"data-value":t,"aria-selected":c,"data-state":c?"checked":"unchecked","data-highlighted":u?"":void 0,"aria-disabled":o||void 0,"data-disabled":o?"":void 0,...e,...(0,Ue.skdxPart)("combobox","item",e.className),ref:b,onClick:(0,M.composeEventHandlers)(e.onClick,f),onPointerEnter:(0,M.composeEventHandlers)(e.onPointerEnter,()=>{o||i.setActiveId(s,"pointer")}),style:g!==void 0?{order:g,...e.style}:e.style}):null};$.displayName="ComboboxItem";var _e=require("../utils/portal.cjs");var $e=require("react/jsx-runtime"),Y=({forceMount:t,children:o,...n})=>{let a=C("ComboboxPortal");return t||a.open?(0,$e.jsx)(_e.Portal,{...n,children:o}):null};Y.displayName="ComboboxPortal";var h=require("react/jsx-runtime"),Bo=t=>"options"in t;function Q(t,o){return t.toLowerCase().includes(o.trim().toLowerCase())}var be=({shape:t,size:o,options:n,renderOption:a,placeholder:e,ariaLabel:i,passThrough:s})=>{let m=C("Combobox"),b=i??e,c=u=>(0,h.jsx)($,{value:u.value,disabled:u.disabled,textValue:u.label,children:a?a(u,{selected:m.isSelected(u.value)}):u.label??u.value},u.value);return(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(J,{...s,shape:t,size:o,"aria-label":b,placeholder:e}),(0,h.jsx)(Y,{children:(0,h.jsxs)(B,{"aria-label":b,children:[n.map(u=>Bo(u)?(0,h.jsxs)(z,{children:[(0,h.jsx)(U,{children:u.label}),u.options.map(c)]},u.label):c(u)),(0,h.jsx)(W,{children:"No results"})]})})]})};var V=require("react/jsx-runtime"),X='[role="option"]:not([data-disabled])';function Wo(t,o){let n=t.querySelector('[data-part="viewport"]')??t;if(n===o||!n.contains(o))return;let a=n.getBoundingClientRect(),e=o.getBoundingClientRect();n.scrollTop+=e.top-a.top-(a.height-e.height)/2}function to(t){return`${t} result${t===1?"":"s"} available`}var[no,C]=(0,Ye.createSafeContext)("Combobox");function zo(t,o){return t??(o?Q:"manual")}function Uo(t,o){for(let n of t??[])for(let a of"options"in n?n.options:[n])if(a.value===o)return a.label??a.value}function Jo(){let[t,o]=l.useState(()=>new Map),n=l.useCallback((i,s)=>{o(m=>{let b=m.get(i);if(b?.value===s.value&&b.text===s.text)return m;let c=new Map(m);return c.set(i,s),c})},[]),a=l.useCallback(i=>{o(s=>{if(!s.has(i))return s;let m=new Map(s);return m.delete(i),m})},[]),e=l.useCallback(i=>t.get(i),[t]);return{items:t,itemCount:t.size,registerItem:n,unregisterItem:a,getItem:e}}function Xo({value:t,defaultValue:o,onValueChange:n,multiple:a}){let e=l.useRef("programmatic"),i=l.useRef([]),{selectedValues:s,isSelected:m,selectItem:b,setSelection:c}=(0,oo.useSelection)({value:t,defaultValue:o,onValueChange:p=>n?.({value:p.value,previousValue:i.current,reason:e.current,selectedValue:p.selectedValue}),multiple:a,label:"Combobox"}),u=l.useCallback((p,r)=>{i.current=s,e.current=r,b(p)},[b,s]),g=l.useCallback((p,r)=>{i.current=s,e.current=r,c(p)},[c,s]);return{selectedValues:s,isSelected:m,commitSelection:u,setSelection:g}}function _o({inputValue:t,defaultInputValue:o="",onInputValueChange:n,inputRef:a,defaultValue:e,setSelection:i}){let[s="",m]=(0,fe.useControllableState)({prop:t,defaultProp:o,onChange:n});return(0,Z.useFormReset)(a,()=>{e!==void 0&&i(e,"programmatic"),m(o)}),[s,m]}function $o({open:t,defaultOpen:o=!1,onOpenChange:n,setActiveId:a}){let[e=!1,i]=(0,fe.useControllableState)({prop:t,defaultProp:o,onChange:n}),[s,m]=l.useState(e);return e!==s&&(m(e),e||a(null)),[e,i]}function Yo({open:t,setOpen:o,autoHighlight:n,itemCount:a,items:e,contentRef:i,orderedOptions:s,onHighlightChange:m,activeId:b,setActiveId:c}){let u=l.useRef(null);l.useEffect(()=>{if(!t)return;let d=requestAnimationFrame(()=>{let R=u.current;if(u.current=null,!R)return;let O=i.current,k=s(O);if(!O||k.length===0)return;let N=R==="last"?k[k.length-1]:k[0];c(j=>j??N.id),Wo(O,N)});return()=>cancelAnimationFrame(d)},[t,s,i,c]);let g=l.useRef("auto"),p=l.useRef(null),r=l.useCallback((d,R="auto")=>{g.current=R,c(d)},[c]),f=b?e.get(b)?.value??null:null;l.useEffect(()=>{let d=p.current;f!==d&&(p.current=f,m?.({value:f,previousValue:d,reason:g.current}))},[f,m]),l.useLayoutEffect(()=>{if(b===null)return;let d=s(i.current);d.some(R=>R.id===b)||c(d[0]?.id??null)}),l.useEffect(()=>{if(!n||!t||b!==null)return;let d=requestAnimationFrame(()=>{let R=s(i.current)[0];R&&c(R.id)});return()=>cancelAnimationFrame(d)},[n,t,b,a,s,i,c]);let I=l.useCallback(d=>{u.current=d,o(!0)},[o]);return{setActiveIdWithReason:r,openWithHighlight:I}}function Qo(t,o,n,a){l.useEffect(()=>{!t||o||(0,Ze.announce)(a(n))},[t,o,n,a])}function Zo({enabled:t,selected:o,inputRef:n,selectedText:a,setInputValue:e}){let i=l.useRef(o);l.useEffect(()=>{if(!t)return;let s=o!==i.current;if(i.current=o,o===void 0)return;let m=n.current;if(m&&m.ownerDocument.activeElement===m||!s&&m?.value)return;let b=a(o);b!==void 0&&e(b)},[t,o,n,a,e])}var ro=function({children:o,value:n,defaultValue:a,onValueChange:e,multiple:i=!1,allowCustomValue:s=!1,filter:m,autoHighlight:b=!1,loop:c=!0,openOn:u="type",onHighlightChange:g,loading:p=!1,inputValue:r,defaultInputValue:f,onInputValueChange:I,open:d,defaultOpen:R,onOpenChange:O,onOpenChangeComplete:k,invalid:N=!1,readOnly:j=!1,disabled:de=!1,getResultCountLabel:bo=to,name:po,form:fo,required:Ce=!1,options:G,renderOption:Co,placeholder:xo,"aria-label":go,shape:Ro,size:ho,ref:yo,...ee}){let H=zo(m,G),oe=l.useRef(null),Po=l.useRef(null),xe=l.useRef(null),te=l.useRef(null),[ge,Re]=l.useState(null),{items:T,itemCount:ne,registerItem:Io,unregisterItem:vo,getItem:Oo}=Jo(),{selectedValues:E,isSelected:Eo,commitSelection:he,setSelection:re}=Xo({value:n,defaultValue:a,onValueChange:e,multiple:i}),[D,y]=_o({inputValue:r,defaultInputValue:f,onInputValueChange:I,inputRef:oe,defaultValue:a,setSelection:re}),[A,F]=$o({open:d,defaultOpen:R,onOpenChange:O,setActiveId:Re});(0,eo.useOpenChangeComplete)(A,te,k);let ae=l.useMemo(()=>H==="manual"?null:(0,w.rankByScore)([...T.keys()],x=>{let P=T.get(x);if(!P)return null;let K=H(P.text,D);return typeof K=="number"?K:null}),[H,D,T]),ko=l.useCallback(x=>(0,w.sortByOrder)(Array.from(x?.querySelectorAll(X)??[]),ae),[ae]),{setActiveIdWithReason:Ho,openWithHighlight:To}=Yo({open:A,setOpen:F,autoHighlight:b,itemCount:ne,items:T,contentRef:te,orderedOptions:ko,onHighlightChange:g,activeId:ge,setActiveId:Re});Qo(A,p,ne,bo);let Vo=l.useCallback(x=>H==="manual"||(0,w.filterKeeps)(H(x,D)),[H,D]),ie=l.useRef(null),wo=l.useCallback((x,P,K)=>{if(he(x,K),!i){ie.current=P,y(P),F(!1);return}y("")},[he,i,y,F]),Do=l.useCallback(()=>{E.length>0&&re([],"pointer"),ie.current=null,y("")},[E.length,re,y]),le=l.useCallback(x=>{for(let P of T.values())if(P.value===x)return P.text||P.value;return Uo(G,x)??ie.current??void 0},[T,G]),Mo=l.useCallback(()=>{if(s)return;let x=i?void 0:E[0];y(x===void 0?"":le(x)??x)},[s,i,E,le,y]);return Zo({enabled:!s&&!i,selected:E[0],inputRef:oe,selectedText:le,setInputValue:y}),l.useImperativeHandle(yo,()=>(0,Z.formValidityHandle)(xe),[]),(0,V.jsx)(je.PopperRoot,{children:(0,V.jsxs)(no,{inputRef:oe,triggerRef:Po,contentRef:te,contentId:l.useId(),multiple:i,selectedValues:E,isSelected:Eo,selectItem:wo,clear:Do,inputValue:D,onInputValueChange:y,open:A,onOpenChange:F,activeId:ge,itemOrder:ae,setActiveId:Ho,openWithHighlight:To,loop:c,openOn:u,reconcileDraftText:Mo,itemCount:ne,registerItem:Io,unregisterItem:vo,getItem:Oo,matchesFilter:Vo,invalid:N,readOnly:j,disabled:de,loading:p,allowCustomValue:s,required:Ce,children:[o??(0,V.jsx)(be,{shape:(0,pe.recipeAxis)(Ro,ee,"data-shape"),size:(0,pe.recipeAxis)(ho,ee,"data-size"),options:G??[],renderOption:Co,placeholder:xo,ariaLabel:go,passThrough:ee}),(0,V.jsx)(Qe.MirroredValues,{name:po,values:E,required:Ce,disabled:de,form:fo,singleValued:!i,controlRef:xe})]})})};ro.displayName="Combobox";var ao=require("../utils/composeRefs.cjs"),io=require("../utils/part.cjs"),S=require("../utils/primitive.cjs");var so=require("react/jsx-runtime"),lo=({ref:t,...o})=>{let n=C("ComboboxTrigger"),a=(0,ao.useComposedRefs)(t,n.triggerRef);return(0,so.jsx)(S.Primitive.button,{type:"button",tabIndex:-1,"aria-expanded":n.open,"aria-controls":n.open?n.contentId:void 0,disabled:n.disabled,"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,"data-state":n.open?"open":"closed",...o,...(0,io.skdxPart)("combobox","trigger",o.className),ref:a,onMouseDown:(0,S.composeEventHandlers)(o.onMouseDown,e=>e.preventDefault()),onClick:(0,S.composeEventHandlers)(o.onClick,()=>{n.readOnly||(n.onOpenChange(!n.open),n.inputRef.current?.focus())})})};lo.displayName="ComboboxTrigger";var uo=require("../utils/part.cjs"),L=require("../utils/primitive.cjs");var co=require("react/jsx-runtime"),mo=({ref:t,...o})=>{let n=C("ComboboxClear"),a=n.selectedValues.length===0&&n.inputValue==="";return(0,co.jsx)(L.Primitive.button,{type:"button",tabIndex:-1,disabled:n.disabled||n.readOnly||a,"data-disabled":n.disabled?"":void 0,"data-readonly":n.readOnly?"":void 0,...o,...(0,uo.skdxPart)("combobox","clear",o.className),ref:t,onMouseDown:(0,L.composeEventHandlers)(o.onMouseDown,e=>e.preventDefault()),onClick:(0,L.composeEventHandlers)(o.onClick,()=>{n.clear(),n.inputRef.current?.focus()})})};mo.displayName="ComboboxClear";0&&(module.exports={Combobox,ComboboxAnatomy,ComboboxClear,ComboboxContent,ComboboxEmpty,ComboboxGroup,ComboboxGroupLabel,ComboboxGroupProvider,ComboboxInput,ComboboxItem,ComboboxPortal,ComboboxProvider,ComboboxTrigger,OPTION_SELECTOR,defaultGetResultCountLabel,defaultOptionsFilter,useComboboxContext,useComboboxGroupContext});

package/dist/combobox/Combobox.js

@@ -1,2 +1,2 @@
 'use client';
-import*as l from"react";import{createSafeContext as go}from"../utils/createContext.js";import{formValidityHandle as Ro,useFormReset as ho}from"../utils/formControl.js";import{MirroredValues as yo}from"../utils/hiddenInput.js";import{announce as Po}from"../utils/liveAnnouncer.js";import{PopperRoot as Io}from"../utils/popper.js";import{recipeAxis as fe}from"../utils/recipeAxis.js";import{filterKeeps as Oo,rankByScore as vo,sortByOrder as Eo}from"../utils/scoredFilter.js";import{useControllableState as de}from"../utils/useControllableState.js";import{useOpenChangeComplete as ko}from"../utils/useOpenChangeComplete.js";import{useSelection as Ho}from"../utils/useSelection.js";import{useComposedRefs as Fe}from"../utils/composeRefs.js";import{skdxPart as Ke}from"../utils/part.js";import{PopperContent as qe}from"../utils/popper.js";import{composeEventHandlers as Be}from"../utils/primitive.js";import{useDismiss as We}from"../utils/useDismiss.js";import{jsx as ze}from"react/jsx-runtime";var W=({forceMount:r,side:t="bottom",align:o="start",sideOffset:s=4,onEscapeKeyDown:e,onPointerDownOutside:a,onFocusOutside:m,onInteractOutside:u,ref:p,...c})=>{let i=C("ComboboxContent"),x=Fe(p,i.contentRef);return We({enabled:i.open,onEscapeKeyDown:b=>{e?.(b),b.defaultPrevented||i.onOpenChange(!1)},onInteractOutside:u,onPointerDownOutside:b=>{a?.(b),b.defaultPrevented||i.onOpenChange(!1)},onFocusOutside:b=>{m?.(b),b.defaultPrevented||i.onOpenChange(!1)}},[i.contentRef,i.inputRef,i.triggerRef]),r||i.open?ze(qe,{component:"combobox",role:"listbox",id:i.contentId,"aria-multiselectable":i.multiple?!0:void 0,"aria-busy":i.loading?!0:void 0,"data-state":i.open?"open":"closed","data-loading":i.loading?"":void 0,"data-multiple":i.multiple?"":void 0,side:t,align:o,sideOffset:s,...c,...Ke("combobox","content",c.className),ref:x,onMouseDown:Be(c.onMouseDown,b=>b.preventDefault())}):null};W.displayName="ComboboxContent";import{skdxPart as Ue}from"../utils/part.js";import{Primitive as Je}from"../utils/primitive.js";import{jsx as Xe}from"react/jsx-runtime";var z=({ref:r,...t})=>C("ComboboxEmpty").itemCount===0?Xe(Je.div,{role:"presentation",...t,...Ue("combobox","empty",t.className),ref:r}):null;z.displayName="ComboboxEmpty";import*as me from"react";import{createSafeContext as _e}from"../utils/createContext.js";import{skdxPart as $e}from"../utils/part.js";import{Primitive as Ye}from"../utils/primitive.js";import{jsx as se}from"react/jsx-runtime";var[Qe,ue]=_e("ComboboxGroup"),U=({ref:r,...t})=>{let o=me.useId();return se(Qe,{labelId:o,children:se(Ye.div,{role:"group","aria-labelledby":o,...t,...$e("combobox","group",t.className),ref:r})})};U.displayName="ComboboxGroup";import{skdxPart as Ze}from"../utils/part.js";import{Primitive as je}from"../utils/primitive.js";import{jsx as eo}from"react/jsx-runtime";var J=({ref:r,...t})=>{let o=ue("ComboboxGroupLabel");return eo(je.div,{id:o.labelId,...t,...Ze("combobox","label",t.className),ref:r})};J.displayName="ComboboxGroupLabel";import{appearanceAttrs as oo}from"../utils/appearance.js";import{useComposedRefs as to}from"../utils/composeRefs.js";import{skdxPart as no}from"../utils/part.js";import{PopperAnchor as ro}from"../utils/popper.js";import{composeEventHandlers as V,Primitive as ao}from"../utils/primitive.js";import{sortByOrder as io}from"../utils/scoredFilter.js";import{jsx as ce}from"react/jsx-runtime";var lo=new Set(["Home","End","PageUp","PageDown"]),X=({ref:r,shape:t,size:o,...s})=>{let e=C("ComboboxInput"),a=to(r,e.inputRef),m=n=>{n&&(e.setActiveId(n.id,"keyboard"),n.scrollIntoView?.({block:"nearest"}))},u=()=>{let n=e.contentRef.current;return n?io(Array.from(n.querySelectorAll(_)),e.itemOrder):[]},p=n=>{let f=u();if(f.length===0)return;let P=f.findIndex(I=>I.id===e.activeId),d=P;P===-1&&(d=n===1?-1:0);let g=e.loop?(d+n+f.length)%f.length:Math.min(f.length-1,Math.max(0,d+n));m(f[g])},c=()=>{if(!e.activeId)return;let n=e.getItem(e.activeId);n&&e.selectItem(n.value,n.text||n.value,"keyboard")},i=n=>n.altKey&&n.key==="ArrowDown"?(n.preventDefault(),e.open||e.onOpenChange(!0),!0):n.altKey&&n.key==="ArrowUp"?(n.preventDefault(),e.activeId&&c(),e.open&&e.onOpenChange(!1),!0):!1,x=n=>{if(n.key==="ArrowDown")return n.preventDefault(),e.open?p(1):e.openWithHighlight("first"),!0;if(n.key==="ArrowUp")return n.preventDefault(),e.open?p(-1):e.openWithHighlight("last"),!0;if(lo.has(n.key)&&e.open){n.preventDefault();let f=u(),P=n.key==="Home"||n.key==="PageUp";return m(P?f[0]:f[f.length-1]),!0}return!1},b=n=>{n.key==="Enter"?e.activeId?(n.preventDefault(),c()):e.allowCustomValue&&e.inputValue!==""?(n.preventDefault(),e.selectItem(e.inputValue,e.inputValue,"keyboard")):e.open&&e.onOpenChange(!1):n.key==="Escape"&&e.open&&!e.contentRef.current&&(n.preventDefault(),e.onOpenChange(!1))};return ce(ro,{asChild:!0,children:ce(ao.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.contentId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",readOnly:e.readOnly,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"aria-invalid":e.invalid?!0:void 0,"aria-required":e.required?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"aria-busy":e.loading?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-loading":e.loading?"":void 0,"data-multiple":e.multiple?"":void 0,...s,...oo({shape:t,size:o},s),...no("combobox","input",s.className),ref:a,value:e.inputValue,onChange:V(s.onChange,n=>{e.onInputValueChange(n.target.value),e.open||e.onOpenChange(!0)}),onClick:V(s.onClick,()=>{e.openOn==="type"||e.readOnly||e.open||e.onOpenChange(!0)}),onFocus:V(s.onFocus,()=>{e.openOn!=="focus"||e.readOnly||e.open||e.onOpenChange(!0)}),onBlur:V(s.onBlur,n=>{let f=n.relatedTarget;f&&(f===n.currentTarget||e.contentRef.current?.contains(f))||e.reconcileDraftText()}),onKeyDown:V(s.onKeyDown,n=>{i(n)||x(n)||b(n)})})})};X.displayName="ComboboxInput";import*as L from"react";import{useComposedRefs as so}from"../utils/composeRefs.js";import{skdxPart as mo}from"../utils/part.js";import{composeEventHandlers as be,Primitive as uo}from"../utils/primitive.js";import{useOptionEntry as co}from"../utils/useOptionCollection.js";import{jsx as bo}from"react/jsx-runtime";var $=({value:r,disabled:t,textValue:o,ref:s,...e})=>{let a=C("ComboboxItem"),m=L.useId(),u=L.useRef(null),p=so(s,u),c=a.isSelected(r),i=a.activeId===m,x=a.itemOrder?.get(m),{text:b,visible:n}=co({id:m,value:r,textValue:o,itemRef:u,matchesFilter:a.matchesFilter,registerItem:a.registerItem,unregisterItem:a.unregisterItem}),f=()=>{t||(a.selectItem(r,b??r,"pointer"),a.inputRef.current?.focus())};return n?bo(uo.div,{role:"option",id:m,"data-value":r,"aria-selected":c,"data-state":c?"checked":"unchecked","data-highlighted":i?"":void 0,"aria-disabled":t||void 0,"data-disabled":t?"":void 0,...e,...mo("combobox","item",e.className),ref:p,onClick:be(e.onClick,f),onPointerEnter:be(e.onPointerEnter,()=>{t||a.setActiveId(m,"pointer")}),style:x!==void 0?{order:x,...e.style}:e.style}):null};$.displayName="ComboboxItem";import{Portal as po}from"../utils/portal.js";import{jsx as fo}from"react/jsx-runtime";var Y=({forceMount:r,children:t,...o})=>{let s=C("ComboboxPortal");return r||s.open?fo(po,{...o,children:t}):null};Y.displayName="ComboboxPortal";import{Fragment as xo,jsx as T,jsxs as Q}from"react/jsx-runtime";var Co=r=>"options"in r;function Z(r,t){return r.toLowerCase().includes(t.trim().toLowerCase())}var pe=({shape:r,size:t,options:o,renderOption:s,placeholder:e,ariaLabel:a,passThrough:m})=>{let u=C("Combobox"),p=a??e,c=i=>T($,{value:i.value,disabled:i.disabled,textValue:i.label,children:s?s(i,{selected:u.isSelected(i.value)}):i.label??i.value},i.value);return Q(xo,{children:[T(X,{...m,shape:r,size:t,"aria-label":p,placeholder:e}),T(Y,{children:Q(W,{"aria-label":p,children:[o.map(i=>Co(i)?Q(U,{children:[T(J,{children:i.label}),i.options.map(c)]},i.label):c(i)),T(z,{children:"No results"})]})})]})};import{jsx as j,jsxs as Ko}from"react/jsx-runtime";var _='[role="option"]:not([data-disabled])';function Vo(r,t){let o=r.querySelector('[data-part="viewport"]')??r;if(o===t||!o.contains(t))return;let s=o.getBoundingClientRect(),e=t.getBoundingClientRect();o.scrollTop+=e.top-s.top-(s.height-e.height)/2}function To(r){return`${r} result${r===1?"":"s"} available`}var[wo,C]=go("Combobox");function Do(r,t){return r??(t?Z:"manual")}function Mo(){let[r,t]=l.useState(()=>new Map),o=l.useCallback((a,m)=>{t(u=>{let p=u.get(a);if(p?.value===m.value&&p.text===m.text)return u;let c=new Map(u);return c.set(a,m),c})},[]),s=l.useCallback(a=>{t(m=>{if(!m.has(a))return m;let u=new Map(m);return u.delete(a),u})},[]),e=l.useCallback(a=>r.get(a),[r]);return{items:r,itemCount:r.size,registerItem:o,unregisterItem:s,getItem:e}}function So({value:r,defaultValue:t,onValueChange:o,multiple:s}){let e=l.useRef("programmatic"),a=l.useRef([]),{selectedValues:m,isSelected:u,selectItem:p,setSelection:c}=Ho({value:r,defaultValue:t,onValueChange:b=>o?.({value:b.value,previousValue:a.current,reason:e.current,selectedValue:b.selectedValue}),multiple:s,label:"Combobox"}),i=l.useCallback((b,n)=>{a.current=m,e.current=n,p(b)},[p,m]),x=l.useCallback((b,n)=>{a.current=m,e.current=n,c(b)},[c,m]);return{selectedValues:m,isSelected:u,commitSelection:i,setSelection:x}}function Lo({inputValue:r,defaultInputValue:t="",onInputValueChange:o,inputRef:s,defaultValue:e,setSelection:a}){let[m="",u]=de({prop:r,defaultProp:t,onChange:o});return ho(s,()=>{e!==void 0&&a(e,"programmatic"),u(t)}),[m,u]}function No({open:r,defaultOpen:t=!1,onOpenChange:o,setActiveId:s}){let[e=!1,a]=de({prop:r,defaultProp:t,onChange:o}),[m,u]=l.useState(e);return e!==m&&(u(e),e||s(null)),[e,a]}function Go({open:r,setOpen:t,autoHighlight:o,itemCount:s,items:e,contentRef:a,orderedOptions:m,onHighlightChange:u,activeId:p,setActiveId:c}){let i=l.useRef(null);l.useEffect(()=>{if(!r)return;let d=requestAnimationFrame(()=>{let g=i.current;if(i.current=null,!g)return;let I=a.current,O=m(I);if(!I||O.length===0)return;let w=g==="last"?O[O.length-1]:O[0];c(N=>N??w.id),Vo(I,w)});return()=>cancelAnimationFrame(d)},[r,m,a,c]);let x=l.useRef("auto"),b=l.useRef(null),n=l.useCallback((d,g="auto")=>{x.current=g,c(d)},[c]),f=p?e.get(p)?.value??null:null;l.useEffect(()=>{let d=b.current;f!==d&&(b.current=f,u?.({value:f,previousValue:d,reason:x.current}))},[f,u]),l.useLayoutEffect(()=>{if(p===null)return;let d=m(a.current);d.some(g=>g.id===p)||c(d[0]?.id??null)}),l.useEffect(()=>{if(!o||!r||p!==null)return;let d=requestAnimationFrame(()=>{let g=m(a.current)[0];g&&c(g.id)});return()=>cancelAnimationFrame(d)},[o,r,p,s,m,a,c]);let P=l.useCallback(d=>{i.current=d,t(!0)},[t]);return{setActiveIdWithReason:n,openWithHighlight:P}}function Ao(r,t,o,s){l.useEffect(()=>{!r||t||Po(s(o))},[r,t,o,s])}var Fo=function({children:t,value:o,defaultValue:s,onValueChange:e,multiple:a=!1,allowCustomValue:m=!1,filter:u,autoHighlight:p=!1,loop:c=!0,openOn:i="type",onHighlightChange:x,loading:b=!1,inputValue:n,defaultInputValue:f,onInputValueChange:P,open:d,defaultOpen:g,onOpenChange:I,onOpenChangeComplete:O,invalid:w=!1,readOnly:N=!1,disabled:ee=!1,getResultCountLabel:ge=To,name:Re,form:he,required:oe=!1,options:te,renderOption:ye,placeholder:Pe,"aria-label":Ie,shape:Oe,size:ve,ref:Ee,...G}){let v=Do(u,te),ne=l.useRef(null),ke=l.useRef(null),re=l.useRef(null),A=l.useRef(null),[ae,ie]=l.useState(null),{items:E,itemCount:F,registerItem:He,unregisterItem:Ve,getItem:Te}=Mo(),{selectedValues:k,isSelected:we,commitSelection:le,setSelection:K}=So({value:o,defaultValue:s,onValueChange:e,multiple:a}),[H,h]=Lo({inputValue:n,defaultInputValue:f,onInputValueChange:P,inputRef:ne,defaultValue:s,setSelection:K}),[D,M]=No({open:d,defaultOpen:g,onOpenChange:I,setActiveId:ie});ko(D,A,O);let q=l.useMemo(()=>v==="manual"?null:vo([...E.keys()],R=>{let y=E.get(R);if(!y)return null;let S=v(y.text,H);return typeof S=="number"?S:null}),[v,H,E]),De=l.useCallback(R=>Eo(Array.from(R?.querySelectorAll(_)??[]),q),[q]),{setActiveIdWithReason:Me,openWithHighlight:Se}=Go({open:D,setOpen:M,autoHighlight:p,itemCount:F,items:E,contentRef:A,orderedOptions:De,onHighlightChange:x,activeId:ae,setActiveId:ie});Ao(D,b,F,ge);let Le=l.useCallback(R=>v==="manual"||Oo(v(R,H)),[v,H]),B=l.useRef(null),Ne=l.useCallback((R,y,S)=>{if(le(R,S),!a){B.current=y,h(y),M(!1);return}h("")},[le,a,h,M]),Ge=l.useCallback(()=>{k.length>0&&K([],"pointer"),B.current=null,h("")},[k.length,K,h]),Ae=l.useCallback(()=>{if(m)return;let R=a?void 0:k[0];if(R===void 0){h("");return}for(let y of E.values())if(y.value===R){h(y.text||y.value);return}h(B.current??R)},[m,a,k,E,h]);return l.useImperativeHandle(Ee,()=>Ro(re),[]),j(Io,{children:Ko(wo,{inputRef:ne,triggerRef:ke,contentRef:A,contentId:l.useId(),multiple:a,selectedValues:k,isSelected:we,selectItem:Ne,clear:Ge,inputValue:H,onInputValueChange:h,open:D,onOpenChange:M,activeId:ae,itemOrder:q,setActiveId:Me,openWithHighlight:Se,loop:c,openOn:i,reconcileDraftText:Ae,itemCount:F,registerItem:He,unregisterItem:Ve,getItem:Te,matchesFilter:Le,invalid:w,readOnly:N,disabled:ee,loading:b,allowCustomValue:m,required:oe,children:[t??j(pe,{shape:fe(Oe,G,"data-shape"),size:fe(ve,G,"data-size"),options:te??[],renderOption:ye,placeholder:Pe,ariaLabel:Ie,passThrough:G}),j(yo,{name:Re,values:k,required:oe,disabled:ee,form:he,singleValued:!a,controlRef:re})]})})};Fo.displayName="Combobox";import{useComposedRefs as qo}from"../utils/composeRefs.js";import{skdxPart as Bo}from"../utils/part.js";import{composeEventHandlers as Ce,Primitive as Wo}from"../utils/primitive.js";import{jsx as Uo}from"react/jsx-runtime";var zo=({ref:r,...t})=>{let o=C("ComboboxTrigger"),s=qo(r,o.triggerRef);return Uo(Wo.button,{type:"button",tabIndex:-1,"aria-expanded":o.open,"aria-controls":o.open?o.contentId:void 0,disabled:o.disabled,"data-disabled":o.disabled?"":void 0,"data-readonly":o.readOnly?"":void 0,"data-state":o.open?"open":"closed",...t,...Bo("combobox","trigger",t.className),ref:s,onMouseDown:Ce(t.onMouseDown,e=>e.preventDefault()),onClick:Ce(t.onClick,()=>{o.readOnly||(o.onOpenChange(!o.open),o.inputRef.current?.focus())})})};zo.displayName="ComboboxTrigger";import{skdxPart as Jo}from"../utils/part.js";import{composeEventHandlers as xe,Primitive as Xo}from"../utils/primitive.js";import{jsx as $o}from"react/jsx-runtime";var _o=({ref:r,...t})=>{let o=C("ComboboxClear"),s=o.selectedValues.length===0&&o.inputValue==="";return $o(Xo.button,{type:"button",tabIndex:-1,disabled:o.disabled||o.readOnly||s,"data-disabled":o.disabled?"":void 0,"data-readonly":o.readOnly?"":void 0,...t,...Jo("combobox","clear",t.className),ref:r,onMouseDown:xe(t.onMouseDown,e=>e.preventDefault()),onClick:xe(t.onClick,()=>{o.clear(),o.inputRef.current?.focus()})})};_o.displayName="ComboboxClear";export{Fo as Combobox,pe as ComboboxAnatomy,_o as ComboboxClear,W as ComboboxContent,z as ComboboxEmpty,U as ComboboxGroup,J as ComboboxGroupLabel,Qe as ComboboxGroupProvider,X as ComboboxInput,$ as ComboboxItem,Y as ComboboxPortal,wo as ComboboxProvider,zo as ComboboxTrigger,_ as OPTION_SELECTOR,To as defaultGetResultCountLabel,Z as defaultOptionsFilter,C as useComboboxContext,ue as useComboboxGroupContext};
+import*as l from"react";import{createSafeContext as Ro}from"../utils/createContext.js";import{formValidityHandle as ho,useFormReset as yo}from"../utils/formControl.js";import{MirroredValues as Po}from"../utils/hiddenInput.js";import{announce as Io}from"../utils/liveAnnouncer.js";import{PopperRoot as vo}from"../utils/popper.js";import{recipeAxis as de}from"../utils/recipeAxis.js";import{filterKeeps as Oo,rankByScore as Eo,sortByOrder as ko}from"../utils/scoredFilter.js";import{useControllableState as Ce}from"../utils/useControllableState.js";import{useOpenChangeComplete as Ho}from"../utils/useOpenChangeComplete.js";import{useSelection as To}from"../utils/useSelection.js";import{useComposedRefs as Ke}from"../utils/composeRefs.js";import{skdxPart as qe}from"../utils/part.js";import{PopperContent as Be}from"../utils/popper.js";import{composeEventHandlers as We}from"../utils/primitive.js";import{useDismiss as ze}from"../utils/useDismiss.js";import{jsx as Ue}from"react/jsx-runtime";var J=({forceMount:n,side:o="bottom",align:t="start",sideOffset:i=4,onEscapeKeyDown:e,onPointerDownOutside:a,onFocusOutside:s,onInteractOutside:m,ref:b,...c})=>{let u=C("ComboboxContent"),g=Ke(b,u.contentRef);return ze({enabled:u.open,onEscapeKeyDown:p=>{e?.(p),p.defaultPrevented||u.onOpenChange(!1)},onInteractOutside:m,onPointerDownOutside:p=>{a?.(p),p.defaultPrevented||u.onOpenChange(!1)},onFocusOutside:p=>{s?.(p),p.defaultPrevented||u.onOpenChange(!1)}},[u.contentRef,u.inputRef,u.triggerRef]),n||u.open?Ue(Be,{component:"combobox",role:"listbox",id:u.contentId,"aria-multiselectable":u.multiple?!0:void 0,"aria-busy":u.loading?!0:void 0,"data-state":u.open?"open":"closed","data-loading":u.loading?"":void 0,"data-multiple":u.multiple?"":void 0,side:o,align:t,sideOffset:i,...c,...qe("combobox","content",c.className),ref:g,onMouseDown:We(c.onMouseDown,p=>p.preventDefault())}):null};J.displayName="ComboboxContent";import{skdxPart as Je}from"../utils/part.js";import{Primitive as Xe}from"../utils/primitive.js";import{jsx as _e}from"react/jsx-runtime";var X=({ref:n,...o})=>C("ComboboxEmpty").itemCount===0?_e(Xe.div,{role:"presentation",...o,...Je("combobox","empty",o.className),ref:n}):null;X.displayName="ComboboxEmpty";import*as me from"react";import{createSafeContext as $e}from"../utils/createContext.js";import{skdxPart as Ye}from"../utils/part.js";import{Primitive as Qe}from"../utils/primitive.js";import{jsx as ue}from"react/jsx-runtime";var[Ze,ce]=$e("ComboboxGroup"),_=({ref:n,...o})=>{let t=me.useId();return ue(Ze,{labelId:t,children:ue(Qe.div,{role:"group","aria-labelledby":t,...o,...Ye("combobox","group",o.className),ref:n})})};_.displayName="ComboboxGroup";import{skdxPart as je}from"../utils/part.js";import{Primitive as eo}from"../utils/primitive.js";import{jsx as oo}from"react/jsx-runtime";var $=({ref:n,...o})=>{let t=ce("ComboboxGroupLabel");return oo(eo.div,{id:t.labelId,...o,...je("combobox","label",o.className),ref:n})};$.displayName="ComboboxGroupLabel";import{appearanceAttrs as to}from"../utils/appearance.js";import{useComposedRefs as no}from"../utils/composeRefs.js";import{skdxPart as ro}from"../utils/part.js";import{PopperAnchor as ao}from"../utils/popper.js";import{composeEventHandlers as T,Primitive as io}from"../utils/primitive.js";import{sortByOrder as lo}from"../utils/scoredFilter.js";import{jsx as be}from"react/jsx-runtime";var so=new Set(["Home","End","PageUp","PageDown"]),Y=({ref:n,shape:o,size:t,...i})=>{let e=C("ComboboxInput"),a=no(n,e.inputRef),s=r=>{r&&(e.setActiveId(r.id,"keyboard"),r.scrollIntoView?.({block:"nearest"}))},m=()=>{let r=e.contentRef.current;return r?lo(Array.from(r.querySelectorAll(Q)),e.itemOrder):[]},b=r=>{let f=m();if(f.length===0)return;let P=f.findIndex(I=>I.id===e.activeId),d=P;P===-1&&(d=r===1?-1:0);let R=e.loop?(d+r+f.length)%f.length:Math.min(f.length-1,Math.max(0,d+r));s(f[R])},c=()=>{if(!e.activeId)return;let r=e.getItem(e.activeId);r&&e.selectItem(r.value,r.text||r.value,"keyboard")},u=r=>r.altKey&&r.key==="ArrowDown"?(r.preventDefault(),e.open||e.onOpenChange(!0),!0):r.altKey&&r.key==="ArrowUp"?(r.preventDefault(),e.activeId&&c(),e.open&&e.onOpenChange(!1),!0):!1,g=r=>{if(r.key==="ArrowDown")return r.preventDefault(),e.open?b(1):e.openWithHighlight("first"),!0;if(r.key==="ArrowUp")return r.preventDefault(),e.open?b(-1):e.openWithHighlight("last"),!0;if(so.has(r.key)&&e.open){r.preventDefault();let f=m(),P=r.key==="Home"||r.key==="PageUp";return s(P?f[0]:f[f.length-1]),!0}return!1},p=r=>{r.key==="Enter"?e.activeId?(r.preventDefault(),c()):e.allowCustomValue&&e.inputValue!==""?(r.preventDefault(),e.selectItem(e.inputValue,e.inputValue,"keyboard")):e.open&&e.onOpenChange(!1):r.key==="Escape"&&e.open&&!e.contentRef.current&&(r.preventDefault(),e.onOpenChange(!1))};return be(ao,{asChild:!0,children:be(io.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.contentId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",readOnly:e.readOnly,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"aria-invalid":e.invalid?!0:void 0,"aria-required":e.required?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"aria-busy":e.loading?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-loading":e.loading?"":void 0,"data-multiple":e.multiple?"":void 0,...i,...to({shape:o,size:t},i),...ro("combobox","input",i.className),ref:a,value:e.inputValue,onChange:T(i.onChange,r=>{e.onInputValueChange(r.target.value),e.open||e.onOpenChange(!0)}),onClick:T(i.onClick,()=>{e.openOn==="type"||e.readOnly||e.open||e.onOpenChange(!0)}),onFocus:T(i.onFocus,()=>{e.openOn!=="focus"||e.readOnly||e.open||e.onOpenChange(!0)}),onBlur:T(i.onBlur,r=>{let f=r.relatedTarget;f&&(f===r.currentTarget||e.contentRef.current?.contains(f))||e.reconcileDraftText()}),onKeyDown:T(i.onKeyDown,r=>{u(r)||g(r)||p(r)})})})};Y.displayName="ComboboxInput";import*as N from"react";import{useComposedRefs as uo}from"../utils/composeRefs.js";import{skdxPart as mo}from"../utils/part.js";import{composeEventHandlers as pe,Primitive as co}from"../utils/primitive.js";import{useOptionEntry as bo}from"../utils/useOptionCollection.js";import{jsx as po}from"react/jsx-runtime";var Z=({value:n,disabled:o,textValue:t,ref:i,...e})=>{let a=C("ComboboxItem"),s=N.useId(),m=N.useRef(null),b=uo(i,m),c=a.isSelected(n),u=a.activeId===s,g=a.itemOrder?.get(s),{text:p,visible:r}=bo({id:s,value:n,textValue:t,itemRef:m,matchesFilter:a.matchesFilter,registerItem:a.registerItem,unregisterItem:a.unregisterItem}),f=()=>{o||(a.selectItem(n,p??n,"pointer"),a.inputRef.current?.focus())};return r?po(co.div,{role:"option",id:s,"data-value":n,"aria-selected":c,"data-state":c?"checked":"unchecked","data-highlighted":u?"":void 0,"aria-disabled":o||void 0,"data-disabled":o?"":void 0,...e,...mo("combobox","item",e.className),ref:b,onClick:pe(e.onClick,f),onPointerEnter:pe(e.onPointerEnter,()=>{o||a.setActiveId(s,"pointer")}),style:g!==void 0?{order:g,...e.style}:e.style}):null};Z.displayName="ComboboxItem";import{Portal as fo}from"../utils/portal.js";import{jsx as Co}from"react/jsx-runtime";var j=({forceMount:n,children:o,...t})=>{let i=C("ComboboxPortal");return n||i.open?Co(fo,{...t,children:o}):null};j.displayName="ComboboxPortal";import{Fragment as go,jsx as V,jsxs as ee}from"react/jsx-runtime";var xo=n=>"options"in n;function oe(n,o){return n.toLowerCase().includes(o.trim().toLowerCase())}var fe=({shape:n,size:o,options:t,renderOption:i,placeholder:e,ariaLabel:a,passThrough:s})=>{let m=C("Combobox"),b=a??e,c=u=>V(Z,{value:u.value,disabled:u.disabled,textValue:u.label,children:i?i(u,{selected:m.isSelected(u.value)}):u.label??u.value},u.value);return ee(go,{children:[V(Y,{...s,shape:n,size:o,"aria-label":b,placeholder:e}),V(j,{children:ee(J,{"aria-label":b,children:[t.map(u=>xo(u)?ee(_,{children:[V($,{children:u.label}),u.options.map(c)]},u.label):c(u)),V(X,{children:"No results"})]})})]})};import{jsx as te,jsxs as Wo}from"react/jsx-runtime";var Q='[role="option"]:not([data-disabled])';function Vo(n,o){let t=n.querySelector('[data-part="viewport"]')??n;if(t===o||!t.contains(o))return;let i=t.getBoundingClientRect(),e=o.getBoundingClientRect();t.scrollTop+=e.top-i.top-(i.height-e.height)/2}function wo(n){return`${n} result${n===1?"":"s"} available`}var[Do,C]=Ro("Combobox");function Mo(n,o){return n??(o?oe:"manual")}function So(n,o){for(let t of n??[])for(let i of"options"in t?t.options:[t])if(i.value===o)return i.label??i.value}function Lo(){let[n,o]=l.useState(()=>new Map),t=l.useCallback((a,s)=>{o(m=>{let b=m.get(a);if(b?.value===s.value&&b.text===s.text)return m;let c=new Map(m);return c.set(a,s),c})},[]),i=l.useCallback(a=>{o(s=>{if(!s.has(a))return s;let m=new Map(s);return m.delete(a),m})},[]),e=l.useCallback(a=>n.get(a),[n]);return{items:n,itemCount:n.size,registerItem:t,unregisterItem:i,getItem:e}}function No({value:n,defaultValue:o,onValueChange:t,multiple:i}){let e=l.useRef("programmatic"),a=l.useRef([]),{selectedValues:s,isSelected:m,selectItem:b,setSelection:c}=To({value:n,defaultValue:o,onValueChange:p=>t?.({value:p.value,previousValue:a.current,reason:e.current,selectedValue:p.selectedValue}),multiple:i,label:"Combobox"}),u=l.useCallback((p,r)=>{a.current=s,e.current=r,b(p)},[b,s]),g=l.useCallback((p,r)=>{a.current=s,e.current=r,c(p)},[c,s]);return{selectedValues:s,isSelected:m,commitSelection:u,setSelection:g}}function Go({inputValue:n,defaultInputValue:o="",onInputValueChange:t,inputRef:i,defaultValue:e,setSelection:a}){let[s="",m]=Ce({prop:n,defaultProp:o,onChange:t});return yo(i,()=>{e!==void 0&&a(e,"programmatic"),m(o)}),[s,m]}function Ao({open:n,defaultOpen:o=!1,onOpenChange:t,setActiveId:i}){let[e=!1,a]=Ce({prop:n,defaultProp:o,onChange:t}),[s,m]=l.useState(e);return e!==s&&(m(e),e||i(null)),[e,a]}function Fo({open:n,setOpen:o,autoHighlight:t,itemCount:i,items:e,contentRef:a,orderedOptions:s,onHighlightChange:m,activeId:b,setActiveId:c}){let u=l.useRef(null);l.useEffect(()=>{if(!n)return;let d=requestAnimationFrame(()=>{let R=u.current;if(u.current=null,!R)return;let I=a.current,O=s(I);if(!I||O.length===0)return;let w=R==="last"?O[O.length-1]:O[0];c(G=>G??w.id),Vo(I,w)});return()=>cancelAnimationFrame(d)},[n,s,a,c]);let g=l.useRef("auto"),p=l.useRef(null),r=l.useCallback((d,R="auto")=>{g.current=R,c(d)},[c]),f=b?e.get(b)?.value??null:null;l.useEffect(()=>{let d=p.current;f!==d&&(p.current=f,m?.({value:f,previousValue:d,reason:g.current}))},[f,m]),l.useLayoutEffect(()=>{if(b===null)return;let d=s(a.current);d.some(R=>R.id===b)||c(d[0]?.id??null)}),l.useEffect(()=>{if(!t||!n||b!==null)return;let d=requestAnimationFrame(()=>{let R=s(a.current)[0];R&&c(R.id)});return()=>cancelAnimationFrame(d)},[t,n,b,i,s,a,c]);let P=l.useCallback(d=>{u.current=d,o(!0)},[o]);return{setActiveIdWithReason:r,openWithHighlight:P}}function Ko(n,o,t,i){l.useEffect(()=>{!n||o||Io(i(t))},[n,o,t,i])}function qo({enabled:n,selected:o,inputRef:t,selectedText:i,setInputValue:e}){let a=l.useRef(o);l.useEffect(()=>{if(!n)return;let s=o!==a.current;if(a.current=o,o===void 0)return;let m=t.current;if(m&&m.ownerDocument.activeElement===m||!s&&m?.value)return;let b=i(o);b!==void 0&&e(b)},[n,o,t,i,e])}var Bo=function({children:o,value:t,defaultValue:i,onValueChange:e,multiple:a=!1,allowCustomValue:s=!1,filter:m,autoHighlight:b=!1,loop:c=!0,openOn:u="type",onHighlightChange:g,loading:p=!1,inputValue:r,defaultInputValue:f,onInputValueChange:P,open:d,defaultOpen:R,onOpenChange:I,onOpenChangeComplete:O,invalid:w=!1,readOnly:G=!1,disabled:ne=!1,getResultCountLabel:Re=wo,name:he,form:ye,required:re=!1,options:D,renderOption:Pe,placeholder:Ie,"aria-label":ve,shape:Oe,size:Ee,ref:ke,...A}){let E=Mo(m,D),F=l.useRef(null),He=l.useRef(null),ae=l.useRef(null),K=l.useRef(null),[ie,le]=l.useState(null),{items:k,itemCount:q,registerItem:Te,unregisterItem:Ve,getItem:we}=Lo(),{selectedValues:v,isSelected:De,commitSelection:se,setSelection:B}=No({value:t,defaultValue:i,onValueChange:e,multiple:a}),[H,h]=Go({inputValue:r,defaultInputValue:f,onInputValueChange:P,inputRef:F,defaultValue:i,setSelection:B}),[M,S]=Ao({open:d,defaultOpen:R,onOpenChange:I,setActiveId:le});Ho(M,K,O);let W=l.useMemo(()=>E==="manual"?null:Eo([...k.keys()],x=>{let y=k.get(x);if(!y)return null;let L=E(y.text,H);return typeof L=="number"?L:null}),[E,H,k]),Me=l.useCallback(x=>ko(Array.from(x?.querySelectorAll(Q)??[]),W),[W]),{setActiveIdWithReason:Se,openWithHighlight:Le}=Fo({open:M,setOpen:S,autoHighlight:b,itemCount:q,items:k,contentRef:K,orderedOptions:Me,onHighlightChange:g,activeId:ie,setActiveId:le});Ko(M,p,q,Re);let Ne=l.useCallback(x=>E==="manual"||Oo(E(x,H)),[E,H]),z=l.useRef(null),Ge=l.useCallback((x,y,L)=>{if(se(x,L),!a){z.current=y,h(y),S(!1);return}h("")},[se,a,h,S]),Ae=l.useCallback(()=>{v.length>0&&B([],"pointer"),z.current=null,h("")},[v.length,B,h]),U=l.useCallback(x=>{for(let y of k.values())if(y.value===x)return y.text||y.value;return So(D,x)??z.current??void 0},[k,D]),Fe=l.useCallback(()=>{if(s)return;let x=a?void 0:v[0];h(x===void 0?"":U(x)??x)},[s,a,v,U,h]);return qo({enabled:!s&&!a,selected:v[0],inputRef:F,selectedText:U,setInputValue:h}),l.useImperativeHandle(ke,()=>ho(ae),[]),te(vo,{children:Wo(Do,{inputRef:F,triggerRef:He,contentRef:K,contentId:l.useId(),multiple:a,selectedValues:v,isSelected:De,selectItem:Ge,clear:Ae,inputValue:H,onInputValueChange:h,open:M,onOpenChange:S,activeId:ie,itemOrder:W,setActiveId:Se,openWithHighlight:Le,loop:c,openOn:u,reconcileDraftText:Fe,itemCount:q,registerItem:Te,unregisterItem:Ve,getItem:we,matchesFilter:Ne,invalid:w,readOnly:G,disabled:ne,loading:p,allowCustomValue:s,required:re,children:[o??te(fe,{shape:de(Oe,A,"data-shape"),size:de(Ee,A,"data-size"),options:D??[],renderOption:Pe,placeholder:Ie,ariaLabel:ve,passThrough:A}),te(Po,{name:he,values:v,required:re,disabled:ne,form:ye,singleValued:!a,controlRef:ae})]})})};Bo.displayName="Combobox";import{useComposedRefs as zo}from"../utils/composeRefs.js";import{skdxPart as Uo}from"../utils/part.js";import{composeEventHandlers as xe,Primitive as Jo}from"../utils/primitive.js";import{jsx as _o}from"react/jsx-runtime";var Xo=({ref:n,...o})=>{let t=C("ComboboxTrigger"),i=zo(n,t.triggerRef);return _o(Jo.button,{type:"button",tabIndex:-1,"aria-expanded":t.open,"aria-controls":t.open?t.contentId:void 0,disabled:t.disabled,"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,"data-state":t.open?"open":"closed",...o,...Uo("combobox","trigger",o.className),ref:i,onMouseDown:xe(o.onMouseDown,e=>e.preventDefault()),onClick:xe(o.onClick,()=>{t.readOnly||(t.onOpenChange(!t.open),t.inputRef.current?.focus())})})};Xo.displayName="ComboboxTrigger";import{skdxPart as $o}from"../utils/part.js";import{composeEventHandlers as ge,Primitive as Yo}from"../utils/primitive.js";import{jsx as Zo}from"react/jsx-runtime";var Qo=({ref:n,...o})=>{let t=C("ComboboxClear"),i=t.selectedValues.length===0&&t.inputValue==="";return Zo(Yo.button,{type:"button",tabIndex:-1,disabled:t.disabled||t.readOnly||i,"data-disabled":t.disabled?"":void 0,"data-readonly":t.readOnly?"":void 0,...o,...$o("combobox","clear",o.className),ref:n,onMouseDown:ge(o.onMouseDown,e=>e.preventDefault()),onClick:ge(o.onClick,()=>{t.clear(),t.inputRef.current?.focus()})})};Qo.displayName="ComboboxClear";export{Bo as Combobox,fe as ComboboxAnatomy,Qo as ComboboxClear,J as ComboboxContent,X as ComboboxEmpty,_ as ComboboxGroup,$ as ComboboxGroupLabel,Ze as ComboboxGroupProvider,Y as ComboboxInput,Z as ComboboxItem,j as ComboboxPortal,Do as ComboboxProvider,Xo as ComboboxTrigger,Q as OPTION_SELECTOR,wo as defaultGetResultCountLabel,oe as defaultOptionsFilter,C as useComboboxContext,ce as useComboboxGroupContext};

package/dist/date-picker/DatePicker.cjs

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var Me=Object.create;var b=Object.defineProperty;var Ae=Object.getOwnPropertyDescriptor;var we=Object.getOwnPropertyNames;var qe=Object.getPrototypeOf,$e=Object.prototype.hasOwnProperty;var Be=(e,r)=>{for(var t in r)b(e,t,{get:r[t],enumerable:!0})},U=(e,r,t,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let n of we(r))!$e.call(e,n)&&n!==t&&b(e,n,{get:()=>r[n],enumerable:!(a=Ae(r,n))||a.enumerable});return e};var W=(e,r,t)=>(t=e!=null?Me(qe(e)):{},U(r||!e||!e.__esModule?b(t,"default",{value:e,enumerable:!0}):t,e)),Je=e=>U(b({},"__esModule",{value:!0}),e);var Ye={};Be(Ye,{DatePicker:()=>J,DatePickerCalendar:()=>O,DatePickerClose:()=>Ve,DatePickerContent:()=>V,DatePickerInput:()=>T,DatePickerPortal:()=>E,DatePickerProvider:()=>Oe,DatePickerTimeField:()=>H,DatePickerTrigger:()=>N,useDatePickerContext:()=>i});module.exports=Je(Ye);var d=W(require("react"),1),p=require("../calendar/Calendar.cjs"),he=require("../utils/createContext.cjs"),q=require("../utils/date-value.cjs"),L=require("../utils/formControl.cjs"),$=require("../utils/hiddenInput.cjs"),be=require("../utils/popper.cjs"),B=require("../utils/useControllableState.cjs"),xe=require("../utils/useOpenChangeComplete.cjs");var Ce=require("../calendar/Calendar.cjs");var x=require("../calendar/Calendar.cjs"),Y=require("../utils/part.cjs");var Z=require("react/jsx-runtime");function Xe(e){return Array.isArray(e)?!1:(0,x.isDateRange)(e)?e.end!==null:e!==null}var O=({ref:e,...r})=>{let t=i("DatePickerCalendar");return(0,Z.jsx)(x.Calendar,{...r,readOnly:r.readOnly||t.readOnly,value:t.value,selectionMode:t.selectionMode,...(0,Y.skdxPart)("date-picker","calendar",r.className),ref:e,onValueChange:a=>{t.onValueChange(a),t.closeOnSelect&&t.granularity==="day"&&Xe(a)&&t.onOpenChange(!1)}})};O.displayName="DatePickerCalendar";var g=W(require("react"),1),S=require("../calendar/Calendar.cjs"),ne=require("../utils/composeRefs.cjs"),A=require("../utils/dismissal.cjs"),oe=require("../utils/part.cjs"),ie=require("../utils/popper.cjs"),le=require("../utils/useDismiss.cjs");var te=require("../calendar/Calendar.cjs"),re=require("../utils/tabbable.cjs");function j(e,r){return e.querySelector(`[data-skdx-calendar-cell="${r}"]:not([disabled])`)}function ee(e){let r=document.activeElement;return r!==null&&r!==document.body&&e.contains(r)}function ae(e,r){let t=[r?j(e,r):null,j(e,(0,te.toISODateString)(new Date)),e.querySelector('[role="gridcell"][tabindex="0"]'),e.querySelector(re.TABBABLE_SELECTOR)];for(let a of t)if(a&&(a.focus({preventScroll:!0}),ee(e)))return document.activeElement;return e.hasAttribute("tabindex")||(e.tabIndex=-1),e.focus({preventScroll:!0}),ee(e)?e:null}var ce=require("react/jsx-runtime"),V=({forceMount:e,onEscapeKeyDown:r,onPointerDownOutside:t,onFocusOutside:a,onInteractOutside:n,onOpenAutoFocus:l,onCloseAutoFocus:s,sideOffset:m=4,ref:y,...f})=>{let o=i("DatePickerContent"),C=(0,ne.useComposedRefs)(y,o.contentRef),R=(0,S.anchorOf)(o.value),h=R?(0,S.toISODateString)(R):null,k=g.useRef({onOpenAutoFocus:l,onCloseAutoFocus:s,anchorISO:h});g.useEffect(()=>{k.current={onOpenAutoFocus:l,onCloseAutoFocus:s,anchorISO:h}});let D=g.useRef(!1);return g.useEffect(()=>{if(!o.open)return;let c=o.contentRef.current;if(!c)return;D.current=!1;let M=requestAnimationFrame(()=>{c.contains(document.activeElement)||(0,A.autoFocusEvent)("open-auto-focus",k.current.onOpenAutoFocus)&&ae(c,k.current.anchorISO)});return()=>{cancelAnimationFrame(M),!D.current&&(0,A.autoFocusEvent)("close-auto-focus",k.current.onCloseAutoFocus)&&o.triggerRef.current?.focus({preventScroll:!0})}},[o.open,o.contentRef,o.triggerRef]),(0,le.useDismiss)({enabled:o.open,onEscapeKeyDown:c=>{r?.(c),c.defaultPrevented||o.onOpenChange(!1)},onInteractOutside:n,onPointerDownOutside:c=>{t?.(c),!c.defaultPrevented&&(D.current=!0,o.onOpenChange(!1))},onFocusOutside:c=>{a?.(c),!c.defaultPrevented&&(D.current=!0,o.onOpenChange(!1))}},[o.contentRef,o.triggerRef]),e||o.open?(0,ce.jsx)(ie.PopperContent,{role:"dialog","aria-labelledby":f["aria-label"]||f["aria-labelledby"]?void 0:o.triggerId,id:o.contentId,"data-state":o.open?"open":"closed","data-invalid":o.invalid?"":void 0,"data-readonly":o.readOnly?"":void 0,sideOffset:m,...f,...(0,oe.skdxPart)("date-picker","content",f.className),ref:C}):null};V.displayName="DatePickerContent";var se=require("../date-field/DateField.cjs"),de=require("../utils/part.cjs");var ue=require("react/jsx-runtime"),T=({ref:e,...r})=>{let t=i("DatePickerInput");return t.selectionMode!=="single"?null:(0,ue.jsx)(se.DateField,{...r,readOnly:r.readOnly||t.readOnly,granularity:t.granularity,value:t.value,onValueChange:a=>t.onValueChange(a),...(0,de.skdxPart)("date-picker","input",r.className),ref:e})};T.displayName="DatePickerInput";var me=require("../utils/portal.cjs");var fe=require("react/jsx-runtime"),E=({forceMount:e,children:r,...t})=>{let a=i("DatePickerPortal");return e||a.open?(0,fe.jsx)(me.Portal,{...t,children:r}):null};E.displayName="DatePickerPortal";var pe=require("../time-field/TimeField.cjs"),Pe=require("../utils/part.cjs");var ye=require("react/jsx-runtime");function Ke(e,r){if(!e)return null;let t=n=>String(n).padStart(2,"0"),a=`${t(e.getHours())}:${t(e.getMinutes())}`;return r?`${a}:${t(e.getSeconds())}`:a}var H=({ref:e,...r})=>{let t=i("DatePickerTimeField"),{granularity:a}=t;if(a==="day"||t.selectionMode!=="single")return null;let n=t.value??null;return(0,ye.jsx)(pe.TimeField,{...r,readOnly:r.readOnly||t.readOnly,granularity:a,value:Ke(n,a==="second"),onValueChange:l=>{if(!n||l===null)return;let[s=0,m=0,y=0]=l.split(":").map(Number),f=new Date(n);f.setHours(s,m,y,0),t.onValueChange(f)},...(0,Pe.skdxPart)("date-picker","time-field",r.className),ref:e})};H.displayName="DatePickerTimeField";var ke=require("../utils/composeRefs.cjs"),De=require("../utils/part.cjs"),ge=require("../utils/popper.cjs"),v=require("../utils/primitive.cjs");var w=require("react/jsx-runtime"),N=({ref:e,...r})=>{let t=i("DatePickerTrigger"),a=(0,ke.useComposedRefs)(e,t.triggerRef),n=t.disabled||r.disabled;return(0,w.jsx)(ge.PopperAnchor,{asChild:!0,children:(0,w.jsx)(v.Primitive.button,{type:"button",id:t.triggerId,"aria-haspopup":"dialog","aria-expanded":t.open,"aria-controls":t.contentId,"data-state":t.open?"open":"closed","data-disabled":n?"":void 0,"aria-invalid":t.invalid?!0:void 0,"data-invalid":t.invalid?"":void 0,...r,...(0,De.skdxPart)("date-picker","trigger",r.className),disabled:n,ref:a,onClick:(0,v.composeEventHandlers)(r.onClick,()=>{n||t.onOpenChange(!t.open)})})})};N.displayName="DatePickerTrigger";var u=require("react/jsx-runtime"),I=(e,r,t)=>e.toLocaleString(r,{dateStyle:"medium",...t?{timeStyle:"short"}:{}});function _e(e,r,t){if(!e)return null;if(Array.isArray(e))return e.length?e.map(a=>I(a,r,t)).join(", "):null;if((0,Ce.isDateRange)(e)){let a=I(e.start,r,t);return e.end?`${a} \u2013 ${I(e.end,r,t)}`:a}return I(e,r,t)}var Re=({placeholder:e,locale:r,showInput:t,passThrough:a})=>{let{value:n,granularity:l}=i("DatePickerAnatomy"),s=_e(n,r,l!=="day");return(0,u.jsxs)(u.Fragment,{children:[(0,u.jsx)(N,{...a,children:s??e}),(0,u.jsx)(E,{children:(0,u.jsxs)(V,{...a?.id?{"aria-labelledby":a.id}:{},children:[t?(0,u.jsx)(T,{}):null,(0,u.jsx)(O,{}),(0,u.jsx)(H,{})]})})]})};var P=require("react/jsx-runtime"),ze=()=>{};function Ge(e){return e?Array.isArray(e)?e:(0,p.isDateRange)(e)?e.end===null?[]:[e.start,e.end]:[e]:[]}var[Oe,i]=(0,he.createSafeContext)("DatePicker");function Qe({value:e,defaultValue:r,selectionMode:t,onValueChange:a}){let n=d.useMemo(()=>(0,q.toCalendarValue)(e,t,"value"),[e,t]),l=d.useMemo(()=>(0,q.toCalendarValue)(r,t,"defaultValue"),[r,t]),[s=(0,p.emptySelection)(t),m]=(0,B.useControllableState)({prop:n,defaultProp:l??(0,p.emptySelection)(t),onChange:y=>a?.(y??(0,p.emptySelection)(t))});return{value:s,setValue:m,defaultValue:l}}function Ue(e,r,t){return{open:e?!1:r,onOpenChange:e?ze:t}}function We({name:e,value:r,required:t,form:a,formControlRef:n}){let l=Ge(r);return l.length===0?(0,P.jsx)($.HiddenInput,{ref:n,type:"text",name:e,value:"",required:t,form:a}):l.map((s,m)=>(0,P.jsx)($.HiddenInput,{ref:m===0?n:void 0,type:"text",name:e,value:(0,p.toISODateString)(s),required:t,form:a},m))}var J=function({children:r,selectionMode:t="single",granularity:a="day",value:n,defaultValue:l,onValueChange:s,open:m,defaultOpen:y=!1,onOpenChange:f,onOpenChangeComplete:o,name:C,form:R,required:h=!1,disabled:k=!1,closeOnSelect:D=!0,readOnly:c=!1,invalid:M=!1,placeholder:Ee="Select date",locale:He,showInput:ve=!1,ref:Ne,...Ie}){let X=d.useRef(null),K=d.useRef(null),_=d.useRef(null),{value:z,setValue:G,defaultValue:Le}=Qe({value:n,defaultValue:l,selectionMode:t,onValueChange:s}),[Q=!1,Fe]=(0,B.useControllableState)({prop:m,defaultProp:y,onChange:f});return(0,xe.useOpenChangeComplete)(Q,K,o),d.useImperativeHandle(Ne,()=>(0,L.formValidityHandle)(_),[]),(0,L.useFormReset)(X,()=>G(Le??(0,p.emptySelection)(t))),(0,P.jsx)(be.PopperRoot,{children:(0,P.jsxs)(Oe,{triggerRef:X,contentRef:K,contentId:d.useId(),triggerId:d.useId(),value:z,selectionMode:t,granularity:a,closeOnSelect:D,readOnly:c,invalid:M,onValueChange:G,...Ue(k,Q,Fe),disabled:k,children:[r??(0,P.jsx)(Re,{placeholder:Ee,locale:He,showInput:ve,passThrough:Ie}),C?(0,P.jsx)(We,{name:C,value:z,required:h,form:R,formControlRef:_}):null]})})};J.displayName="DatePicker";var Se=require("../utils/part.cjs"),F=require("../utils/primitive.cjs");var Te=require("react/jsx-runtime"),Ve=({ref:e,...r})=>{let t=i("DatePickerClose");return(0,Te.jsx)(F.Primitive.button,{type:"button",...r,...(0,Se.skdxPart)("date-picker","close",r.className),ref:e,onClick:(0,F.composeEventHandlers)(r.onClick,()=>t.onOpenChange(!1))})};Ve.displayName="DatePickerClose";0&&(module.exports={DatePicker,DatePickerCalendar,DatePickerClose,DatePickerContent,DatePickerInput,DatePickerPortal,DatePickerProvider,DatePickerTimeField,DatePickerTrigger,useDatePickerContext});
+"use strict";var Ae=Object.create;var b=Object.defineProperty;var we=Object.getOwnPropertyDescriptor;var qe=Object.getOwnPropertyNames;var $e=Object.getPrototypeOf,Be=Object.prototype.hasOwnProperty;var Je=(e,r)=>{for(var t in r)b(e,t,{get:r[t],enumerable:!0})},Q=(e,r,t,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let n of qe(r))!Be.call(e,n)&&n!==t&&b(e,n,{get:()=>r[n],enumerable:!(a=we(r,n))||a.enumerable});return e};var W=(e,r,t)=>(t=e!=null?Ae($e(e)):{},Q(r||!e||!e.__esModule?b(t,"default",{value:e,enumerable:!0}):t,e)),Xe=e=>Q(b({},"__esModule",{value:!0}),e);var Ze={};Je(Ze,{DatePicker:()=>J,DatePickerCalendar:()=>O,DatePickerClose:()=>Ve,DatePickerContent:()=>S,DatePickerInput:()=>V,DatePickerPortal:()=>E,DatePickerProvider:()=>Te,DatePickerTimeField:()=>v,DatePickerTrigger:()=>I,useDatePickerContext:()=>i});module.exports=Xe(Ze);var d=W(require("react"),1),p=require("../calendar/Calendar.cjs"),be=require("../utils/createContext.cjs"),q=require("../utils/date-value.cjs"),L=require("../utils/formControl.cjs"),$=require("../utils/hiddenInput.cjs"),xe=require("../utils/popper.cjs"),B=require("../utils/useControllableState.cjs"),Oe=require("../utils/useOpenChangeComplete.cjs");var Re=require("../calendar/Calendar.cjs");var x=require("../calendar/Calendar.cjs"),Y=require("../utils/part.cjs");var Z=require("react/jsx-runtime");function _e(e){return Array.isArray(e)?!1:(0,x.isDateRange)(e)?e.end!==null:e!==null}var O=({ref:e,...r})=>{let t=i("DatePickerCalendar");return(0,Z.jsx)(x.Calendar,{...r,readOnly:r.readOnly||t.readOnly,value:t.value,selectionMode:t.selectionMode,...(0,Y.skdxPart)("date-picker","calendar",r.className),ref:e,onValueChange:a=>{t.onValueChange(a),t.closeOnSelect&&t.granularity==="day"&&_e(a)&&t.onOpenChange(!1)}})};O.displayName="DatePickerCalendar";var g=W(require("react"),1),T=require("../calendar/Calendar.cjs"),ne=require("../utils/composeRefs.cjs"),A=require("../utils/dismissal.cjs"),oe=require("../utils/part.cjs"),ie=require("../utils/popper.cjs"),le=require("../utils/useDismiss.cjs");var te=require("../calendar/Calendar.cjs"),re=require("../utils/tabbable.cjs");function j(e,r){return e.querySelector(`[data-skdx-calendar-cell="${r}"]:not([disabled])`)}function ee(e){let r=document.activeElement;return r!==null&&r!==document.body&&e.contains(r)}function ae(e,r){let t=[r?j(e,r):null,j(e,(0,te.toISODateString)(new Date)),e.querySelector('[role="gridcell"][tabindex="0"]'),e.querySelector(re.TABBABLE_SELECTOR)];for(let a of t)if(a&&(a.focus({preventScroll:!0}),ee(e)))return document.activeElement;return e.hasAttribute("tabindex")||(e.tabIndex=-1),e.focus({preventScroll:!0}),ee(e)?e:null}var ce=require("react/jsx-runtime"),S=({forceMount:e,onEscapeKeyDown:r,onPointerDownOutside:t,onFocusOutside:a,onInteractOutside:n,onOpenAutoFocus:l,onCloseAutoFocus:s,sideOffset:m=4,ref:y,...f})=>{let o=i("DatePickerContent"),C=(0,ne.useComposedRefs)(y,o.contentRef),R=(0,T.anchorOf)(o.value),h=R?(0,T.toISODateString)(R):null,k=g.useRef({onOpenAutoFocus:l,onCloseAutoFocus:s,anchorISO:h});g.useEffect(()=>{k.current={onOpenAutoFocus:l,onCloseAutoFocus:s,anchorISO:h}});let D=g.useRef(!1);return g.useEffect(()=>{if(!o.open)return;let c=o.contentRef.current;if(!c)return;D.current=!1;let M=requestAnimationFrame(()=>{c.contains(document.activeElement)||(0,A.autoFocusEvent)("open-auto-focus",k.current.onOpenAutoFocus)&&ae(c,k.current.anchorISO)});return()=>{cancelAnimationFrame(M),!D.current&&(0,A.autoFocusEvent)("close-auto-focus",k.current.onCloseAutoFocus)&&o.triggerRef.current?.focus({preventScroll:!0})}},[o.open,o.contentRef,o.triggerRef]),(0,le.useDismiss)({enabled:o.open,onEscapeKeyDown:c=>{r?.(c),c.defaultPrevented||o.onOpenChange(!1)},onInteractOutside:n,onPointerDownOutside:c=>{t?.(c),!c.defaultPrevented&&(D.current=!0,o.onOpenChange(!1))},onFocusOutside:c=>{a?.(c),!c.defaultPrevented&&(D.current=!0,o.onOpenChange(!1))}},[o.contentRef,o.triggerRef]),e||o.open?(0,ce.jsx)(ie.PopperContent,{role:"dialog","aria-labelledby":f["aria-label"]||f["aria-labelledby"]?void 0:o.triggerId,id:o.contentId,"data-state":o.open?"open":"closed","data-invalid":o.invalid?"":void 0,"data-readonly":o.readOnly?"":void 0,sideOffset:m,...f,...(0,oe.skdxPart)("date-picker","content",f.className),ref:C}):null};S.displayName="DatePickerContent";var se=require("../date-field/DateField.cjs"),de=require("../utils/part.cjs");var ue=require("react/jsx-runtime"),V=({ref:e,...r})=>{let t=i("DatePickerInput");return t.selectionMode!=="single"?null:(0,ue.jsx)(se.DateField,{...r,readOnly:r.readOnly||t.readOnly,granularity:t.granularity,value:t.value,onValueChange:a=>t.onValueChange(a),...(0,de.skdxPart)("date-picker","input",r.className),ref:e})};V.displayName="DatePickerInput";var me=require("../utils/portal.cjs");var fe=require("react/jsx-runtime"),E=({forceMount:e,children:r,...t})=>{let a=i("DatePickerPortal");return e||a.open?(0,fe.jsx)(me.Portal,{...t,children:r}):null};E.displayName="DatePickerPortal";var pe=require("../time-field/TimeField.cjs"),Pe=require("../utils/part.cjs");var ye=require("react/jsx-runtime");function Ke(e,r){if(!e)return null;let t=n=>String(n).padStart(2,"0"),a=`${t(e.getHours())}:${t(e.getMinutes())}`;return r?`${a}:${t(e.getSeconds())}`:a}var v=({ref:e,...r})=>{let t=i("DatePickerTimeField"),{granularity:a}=t;if(a==="day"||t.selectionMode!=="single")return null;let n=t.value??null;return(0,ye.jsx)(pe.TimeField,{...r,readOnly:r.readOnly||t.readOnly,granularity:a,value:Ke(n,a==="second"),onValueChange:l=>{if(!n||l===null)return;let[s=0,m=0,y=0]=l.split(":").map(Number),f=new Date(n);f.setHours(s,m,y,0),t.onValueChange(f)},...(0,Pe.skdxPart)("date-picker","time-field",r.className),ref:e})};v.displayName="DatePickerTimeField";var ke=require("../utils/composeRefs.cjs"),De=require("../utils/field-core.cjs"),ge=require("../utils/part.cjs"),Ce=require("../utils/popper.cjs"),H=require("../utils/primitive.cjs");var w=require("react/jsx-runtime"),I=({ref:e,...r})=>{let t=i("DatePickerTrigger"),a=(0,ke.useComposedRefs)(e,t.triggerRef),n=t.disabled||r.disabled;return(0,w.jsx)(Ce.PopperAnchor,{asChild:!0,children:(0,w.jsx)(H.Primitive.button,{type:"button",id:t.triggerId,[De.FIELD_CONTROL_ATTRIBUTE]:"","aria-haspopup":"dialog","aria-expanded":t.open,"aria-controls":t.contentId,"data-state":t.open?"open":"closed","data-disabled":n?"":void 0,"aria-invalid":t.invalid?!0:void 0,"data-invalid":t.invalid?"":void 0,...r,...(0,ge.skdxPart)("date-picker","trigger",r.className),disabled:n,ref:a,onClick:(0,H.composeEventHandlers)(r.onClick,()=>{n||t.onOpenChange(!t.open)})})})};I.displayName="DatePickerTrigger";var u=require("react/jsx-runtime"),N=(e,r,t)=>e.toLocaleString(r,{dateStyle:"medium",...t?{timeStyle:"short"}:{}});function Ue(e,r,t){if(!e)return null;if(Array.isArray(e))return e.length?e.map(a=>N(a,r,t)).join(", "):null;if((0,Re.isDateRange)(e)){let a=N(e.start,r,t);return e.end?`${a} \u2013 ${N(e.end,r,t)}`:a}return N(e,r,t)}var he=({placeholder:e,locale:r,showInput:t,passThrough:a})=>{let{value:n,granularity:l}=i("DatePickerAnatomy"),s=Ue(n,r,l!=="day");return(0,u.jsxs)(u.Fragment,{children:[(0,u.jsx)(I,{...a,children:s??e}),(0,u.jsx)(E,{children:(0,u.jsxs)(S,{...a?.id?{"aria-labelledby":a.id}:{},children:[t?(0,u.jsx)(V,{}):null,(0,u.jsx)(O,{}),(0,u.jsx)(v,{})]})})]})};var P=require("react/jsx-runtime"),ze=()=>{};function Ge(e){return e?Array.isArray(e)?e:(0,p.isDateRange)(e)?e.end===null?[]:[e.start,e.end]:[e]:[]}var[Te,i]=(0,be.createSafeContext)("DatePicker");function Qe({value:e,defaultValue:r,selectionMode:t,onValueChange:a}){let n=d.useMemo(()=>(0,q.toCalendarValue)(e,t,"value"),[e,t]),l=d.useMemo(()=>(0,q.toCalendarValue)(r,t,"defaultValue"),[r,t]),[s=(0,p.emptySelection)(t),m]=(0,B.useControllableState)({prop:n,defaultProp:l??(0,p.emptySelection)(t),onChange:y=>a?.(y??(0,p.emptySelection)(t))});return{value:s,setValue:m,defaultValue:l}}function We(e,r,t){return{open:e?!1:r,onOpenChange:e?ze:t}}function Ye({name:e,value:r,required:t,form:a,formControlRef:n}){let l=Ge(r);return l.length===0?(0,P.jsx)($.HiddenInput,{ref:n,type:"text",name:e,value:"",required:t,form:a}):l.map((s,m)=>(0,P.jsx)($.HiddenInput,{ref:m===0?n:void 0,type:"text",name:e,value:(0,p.toISODateString)(s),required:t,form:a},m))}var J=function({children:r,selectionMode:t="single",granularity:a="day",value:n,defaultValue:l,onValueChange:s,open:m,defaultOpen:y=!1,onOpenChange:f,onOpenChangeComplete:o,name:C,form:R,required:h=!1,disabled:k=!1,closeOnSelect:D=!0,readOnly:c=!1,invalid:M=!1,placeholder:ve="Select date",locale:He,showInput:Ie=!1,ref:Ne,...Le}){let X=d.useRef(null),_=d.useRef(null),K=d.useRef(null),{value:U,setValue:z,defaultValue:Fe}=Qe({value:n,defaultValue:l,selectionMode:t,onValueChange:s}),[G=!1,Me]=(0,B.useControllableState)({prop:m,defaultProp:y,onChange:f});return(0,Oe.useOpenChangeComplete)(G,_,o),d.useImperativeHandle(Ne,()=>(0,L.formValidityHandle)(K),[]),(0,L.useFormReset)(X,()=>z(Fe??(0,p.emptySelection)(t))),(0,P.jsx)(xe.PopperRoot,{children:(0,P.jsxs)(Te,{triggerRef:X,contentRef:_,contentId:d.useId(),triggerId:d.useId(),value:U,selectionMode:t,granularity:a,closeOnSelect:D,readOnly:c,invalid:M,onValueChange:z,...We(k,G,Me),disabled:k,children:[r??(0,P.jsx)(he,{placeholder:ve,locale:He,showInput:Ie,passThrough:Le}),C?(0,P.jsx)(Ye,{name:C,value:U,required:h,form:R,formControlRef:K}):null]})})};J.displayName="DatePicker";var Se=require("../utils/part.cjs"),F=require("../utils/primitive.cjs");var Ee=require("react/jsx-runtime"),Ve=({ref:e,...r})=>{let t=i("DatePickerClose");return(0,Ee.jsx)(F.Primitive.button,{type:"button",...r,...(0,Se.skdxPart)("date-picker","close",r.className),ref:e,onClick:(0,F.composeEventHandlers)(r.onClick,()=>t.onOpenChange(!1))})};Ve.displayName="DatePickerClose";0&&(module.exports={DatePicker,DatePickerCalendar,DatePickerClose,DatePickerContent,DatePickerInput,DatePickerPortal,DatePickerProvider,DatePickerTimeField,DatePickerTrigger,useDatePickerContext});