react-animated-select 0.7.5 → 0.8.0

package/dist/state.js

@@ -0,0 +1,50 @@
+"use client";
+import { createContext as o, useState as l, useRef as i, useInsertionEffect as f } from "react";
+const p = /* @__PURE__ */ o(null), b = /* @__PURE__ */ o(null), a = /* @__PURE__ */ o(null), g = (e, t) => {
+  const s = typeof t == "function" ? t(e) : t;
+  return s === e ? e : Object.keys(s).some((n) => !Object.is(s[n], e[n])) ? { ...e, ...s } : e;
+}, h = (e) => {
+  let t = e;
+  const s = /* @__PURE__ */ new Set();
+  return {
+    get: () => t,
+    set: (c) => {
+      Object.keys(c).every((n) => Object.is(c[n], t[n])) || (t = { ...t, ...c }, s.forEach((n) => n()));
+    },
+    subscribe: (c) => (s.add(c), () => s.delete(c))
+  };
+}, E = (e) => {
+  const t = i(e);
+  f(() => {
+    t.current = e;
+  });
+  const [s] = l(() => Object.fromEntries(
+    Object.keys(e).map((c) => [c, (...n) => t.current[c](...n)])
+  ));
+  return s;
+}, u = (e, t) => {
+  const [s, c] = l(e);
+  return s === e || t(s, e) ? s : (c(e), e);
+}, y = (e, t) => e === t || !!e && !!t && Object.keys(e).length === Object.keys(t).length && Object.keys(e).every((s) => Object.is(e[s], t[s])), r = (e, t, s = 0) => {
+  if (Object.is(e, t)) return !0;
+  if (s > 12 || typeof e != "object" || typeof t != "object" || e === null || t === null || Array.isArray(e) !== Array.isArray(t)) return !1;
+  if (e.$$typeof || t.$$typeof) return e.$$typeof === t.$$typeof && e.type === t.type && e.key === t.key && r(e.props, t.props, s + 1);
+  const c = Object.keys(e);
+  return c.length === Object.keys(t).length && c.every((n) => Object.hasOwn(t, n) && r(e[n], t[n], s + 1));
+}, j = /* @__PURE__ */ new Set(["style", "texts", "icons", "attrs"]), O = (e, t) => {
+  const s = Object.keys(t);
+  return s.length === Object.keys(e).length && s.every(
+    (c) => j.has(c) ? y(e[c], t[c]) : Object.is(e[c], t[c])
+  );
+}, $ = (e) => u(e, O), m = (e) => u(e, r);
+export {
+  b as SelectActionsContext,
+  p as SelectConfigContext,
+  a as SelectStateContext,
+  g as compactReducer,
+  h as createStore,
+  r as deepEqual,
+  m as useDeepStable,
+  $ as useShallowStable,
+  E as useStableActions
+};

package/dist/style.css

@@ -0,0 +1,4 @@
+@layer rac.base, rac.theme;
+@layer rac.base,rac.theme;@property --rac-list-max-height{syntax: "<length>"; inherits: true; initial-value: 250px;}@layer rac.base{:root{--rac-row: 2em}.rac-select,.rac-options{--rac-duration-fast: calc(var(--rac-duration) * .5)}@media(prefers-reduced-motion:reduce){.rac-select,.rac-options{--rac-duration: 1ms !important}.rac-dots i{animation:none}}.rac-select{position:relative;display:flex;align-items:center;box-sizing:border-box;min-width:0;max-width:100%;cursor:pointer}.rac-select:not([aria-haspopup]){cursor:default}.rac-select[aria-busy=true]{cursor:progress}.rac-select[aria-disabled=true]{cursor:not-allowed}.rac-select[aria-disabled=true][aria-busy=true]{cursor:wait}.rac-value{flex:1;min-width:0;min-height:var(--rac-row);display:flex;flex-wrap:wrap;align-items:center}.rac-title{min-width:0;max-width:calc(100% - .25px);overflow-x:clip;white-space:nowrap;text-overflow:ellipsis}.rac-dots{display:inline-flex;gap:.17em;margin-inline-start:.25em}.rac-dots i{width:.25em;height:.25em;border-radius:50%;background:currentColor;animation:rac-blink 1.4s infinite both}.rac-dots i:nth-child(2){animation-delay:.2s}.rac-dots i:nth-child(3){animation-delay:.4s}.rac-clear,.rac-arrow{display:grid;place-items:center;align-self:center}.rac-clear{padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}.rac-arrow,.rac-group-arrow{transition:rotate var(--rac-duration) var(--rac-ease)}.rac-select:not([data-placement=top],[aria-expanded=true]) .rac-arrow,.rac-select[data-placement=top][aria-expanded=true] .rac-arrow{rotate:180deg}.rac-icon{height:1em}.rac-input{position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;pointer-events:none}.rac-live{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(any-pointer:coarse){.rac-clear{position:relative}.rac-arrow{pointer-events:none}.rac-clear:before{content:"";position:absolute;inset:min(0px,50% - 12px)}}.rac-options{box-sizing:border-box;z-index:2147483647;overflow:clip}.rac-options{transition:opacity var(--rac-duration) var(--rac-ease),visibility 0s}.rac-options[data-offscreen]{opacity:0;visibility:hidden;transition-delay:0s,var(--rac-duration)}.rac-list{max-height:var(--rac-list-max-height);overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable;scroll-behavior:smooth}.rac-option{display:flex;justify-content:space-between;align-items:center;overflow-wrap:anywhere;cursor:pointer}.rac-option[aria-disabled=true]{cursor:not-allowed}.rac-option[data-error]{cursor:default}.rac-option[data-loading]{justify-content:start;align-items:baseline;cursor:wait}.rac-check{position:relative;display:flex;justify-content:center;align-items:center}.rac-check[data-default]{width:1em;height:1em;border:1px solid}.rac-checkmark{position:absolute;width:auto;height:1em;opacity:0;scale:0;transition:opacity var(--rac-duration) var(--rac-ease),scale var(--rac-duration) var(--rac-ease)}.rac-option[aria-selected=true] .rac-checkmark{opacity:1;scale:1}.rac-group{display:flex;justify-content:space-between;align-items:center;cursor:pointer}.rac-group[data-disabled]{cursor:not-allowed}.rac-group-arrow{display:grid}.rac-group[data-open]>.rac-group-arrow{rotate:180deg}@keyframes rac-blink{0%{opacity:.2}20%{opacity:1}to{opacity:.2}}}
+@layer rac.base,rac.theme;@layer rac.theme{:root{--rac-bg: color-mix(in srgb, Canvas 98%, CanvasText 2%);--rac-fg: CanvasText;--rac-danger: #e7000b;--rac-success: #4caf50;--rac-radius: 0px}.rac-select,.rac-options{--rac-tint-1: color-mix(in srgb, var(--rac-fg) 5%, var(--rac-bg));--rac-tint-2: color-mix(in srgb, var(--rac-fg) 10%, var(--rac-bg));--rac-tint-3: color-mix(in srgb, var(--rac-fg) 20%, var(--rac-bg));--rac-muted: color-mix(in srgb, var(--rac-fg) 55%, var(--rac-bg))}.rac-select,.rac-options{border-radius:var(--rac-radius)}.rac-select{padding:0 .5em;border:2px solid var(--rac-bg);background-color:var(--rac-bg);color:var(--rac-fg);transition:background-color var(--rac-duration) var(--rac-ease),border-color var(--rac-duration) var(--rac-ease),opacity var(--rac-duration) var(--rac-ease)}.rac-select[aria-haspopup]:not([aria-disabled=true]):hover{background-color:var(--rac-tint-1)}.rac-select[aria-haspopup]:not([aria-disabled=true],[data-error],[data-invalid]):hover{border-color:var(--rac-tint-1)}.rac-select[aria-disabled=true]{opacity:.75}.rac-select:is([data-error],[data-invalid]){border-color:var(--rac-danger)}.rac-select[aria-busy=true]:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--rac-muted),transparent) 0 100% / 40% 2px no-repeat;animation:rac-busy 1.5s ease-in-out infinite;pointer-events:none}@media(prefers-reduced-motion:reduce){.rac-select[aria-busy=true]:after{animation:none;background-size:100% 2px}}:is(.rac-title,.rac-option)[data-bool=true]{color:var(--rac-success)}:is(.rac-title,.rac-option)[data-bool=false]{color:var(--rac-danger)}.rac-list{background-color:var(--rac-bg);color:var(--rac-fg);scrollbar-color:var(--rac-tint-2) var(--rac-tint-1);scrollbar-width:thin;scroll-padding-block:.5em}.rac-option{gap:.5em;padding:.5em;transition:background-color var(--rac-duration-fast) var(--rac-ease)}.rac-option[data-highlighted]{background-color:var(--rac-tint-2)}.rac-option[aria-selected=true]{background-color:var(--rac-tint-3)}.rac-option[aria-selected=true][data-highlighted]{background-color:color-mix(in srgb,var(--rac-fg) 30%,var(--rac-bg))}.rac-option[aria-disabled=true]{color:var(--rac-muted)}.rac-option[data-invalid]{color:var(--rac-danger)}.rac-option[data-loading]{gap:0;color:var(--rac-muted)}.rac-option[data-error]{color:var(--rac-danger)}.rac-check{margin-inline-end:.2em}.rac-check[data-default]{border-color:var(--rac-muted)}.rac-group{padding:.5em;font-size:1.25em;font-weight:700;transition:background-color var(--rac-duration-fast) var(--rac-ease)}.rac-group[data-highlighted]{background-color:var(--rac-tint-2)}.rac-group[data-disabled]{color:var(--rac-muted)}.rac-group-items{padding-inline-start:1em}@keyframes rac-busy{0%{background-position-x:-100%}to{background-position-x:200%}}}
+@layer rac.base,rac.theme;@layer rac.base{.rac-chip-slot{display:flex;align-items:center;max-width:100%}.rac-chip-text,.rac-chip>.rac-option-jsx{min-width:0;overflow-x:clip}.rac-chip-text{text-overflow:ellipsis}.rac-chip{position:relative;display:inline-flex;flex-shrink:0;align-items:center;box-sizing:border-box;max-width:inherit;white-space:nowrap;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y}.rac-chip-del{position:absolute;flex-shrink:0;inset-inline-end:0;height:100%;display:grid;align-items:center;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}.rac-chip-del:disabled{cursor:inherit}.rac-select:is([data-deleting],[data-inline-delete]) .rac-chip-del{position:relative}@media(any-pointer:coarse){.rac-chip-del:before{content:"";position:absolute;inset:min(0px,50% - 12px)}}.rac-spacer{flex-basis:100%;height:0;margin-inline-end:1px}}@layer rac.theme{.rac-chip{min-height:calc(var(--rac-row) - .5em);margin-block:.25em;margin-inline-end:.5em;padding-inline:.25em;border-radius:calc(var(--rac-radius) / 2);line-height:normal;background-color:var(--rac-tint-2);transition:background-color var(--rac-duration-fast) var(--rac-ease)}@media(hover:hover){.rac-chip:hover{background-color:var(--rac-tint-3)}}.rac-select[data-deleting] .rac-chip{background-color:color-mix(in srgb,var(--rac-danger) 15%,var(--rac-bg));animation:rac-shake .3s infinite}@media(prefers-reduced-motion:reduce){.rac-select[data-deleting] .rac-chip{animation:none}}.rac-chip-del{border-start-end-radius:inherit;border-end-end-radius:inherit;background-color:color-mix(in srgb,var(--rac-danger) 30%,var(--rac-bg));transition:color var(--rac-duration) var(--rac-ease),background-color var(--rac-duration) var(--rac-ease)}.rac-chip-del:hover{color:var(--rac-danger)}.rac-select:is([data-deleting],[data-inline-delete]) .rac-chip-del{background-color:transparent}@keyframes rac-shake{0%{transform:rotate(0)}25%{transform:rotate(-1deg)}75%{transform:rotate(1deg)}to{transform:rotate(0)}}}

package/dist/theme.css

@@ -0,0 +1 @@
+@layer rac.base,rac.theme;@layer rac.theme{:root{--rac-bg: color-mix(in srgb, Canvas 98%, CanvasText 2%);--rac-fg: CanvasText;--rac-danger: #e7000b;--rac-success: #4caf50;--rac-radius: 0px}.rac-select,.rac-options{--rac-tint-1: color-mix(in srgb, var(--rac-fg) 5%, var(--rac-bg));--rac-tint-2: color-mix(in srgb, var(--rac-fg) 10%, var(--rac-bg));--rac-tint-3: color-mix(in srgb, var(--rac-fg) 20%, var(--rac-bg));--rac-muted: color-mix(in srgb, var(--rac-fg) 55%, var(--rac-bg))}.rac-select,.rac-options{border-radius:var(--rac-radius)}.rac-select{padding:0 .5em;border:2px solid var(--rac-bg);background-color:var(--rac-bg);color:var(--rac-fg);transition:background-color var(--rac-duration) var(--rac-ease),border-color var(--rac-duration) var(--rac-ease),opacity var(--rac-duration) var(--rac-ease)}.rac-select[aria-haspopup]:not([aria-disabled=true]):hover{background-color:var(--rac-tint-1)}.rac-select[aria-haspopup]:not([aria-disabled=true],[data-error],[data-invalid]):hover{border-color:var(--rac-tint-1)}.rac-select[aria-disabled=true]{opacity:.75}.rac-select:is([data-error],[data-invalid]){border-color:var(--rac-danger)}.rac-select[aria-busy=true]:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--rac-muted),transparent) 0 100% / 40% 2px no-repeat;animation:rac-busy 1.5s ease-in-out infinite;pointer-events:none}@media(prefers-reduced-motion:reduce){.rac-select[aria-busy=true]:after{animation:none;background-size:100% 2px}}:is(.rac-title,.rac-option)[data-bool=true]{color:var(--rac-success)}:is(.rac-title,.rac-option)[data-bool=false]{color:var(--rac-danger)}.rac-list{background-color:var(--rac-bg);color:var(--rac-fg);scrollbar-color:var(--rac-tint-2) var(--rac-tint-1);scrollbar-width:thin;scroll-padding-block:.5em}.rac-option{gap:.5em;padding:.5em;transition:background-color var(--rac-duration-fast) var(--rac-ease)}.rac-option[data-highlighted]{background-color:var(--rac-tint-2)}.rac-option[aria-selected=true]{background-color:var(--rac-tint-3)}.rac-option[aria-selected=true][data-highlighted]{background-color:color-mix(in srgb,var(--rac-fg) 30%,var(--rac-bg))}.rac-option[aria-disabled=true]{color:var(--rac-muted)}.rac-option[data-invalid]{color:var(--rac-danger)}.rac-option[data-loading]{gap:0;color:var(--rac-muted)}.rac-option[data-error]{color:var(--rac-danger)}.rac-check{margin-inline-end:.2em}.rac-check[data-default]{border-color:var(--rac-muted)}.rac-group{padding:.5em;font-size:1.25em;font-weight:700;transition:background-color var(--rac-duration-fast) var(--rac-ease)}.rac-group[data-highlighted]{background-color:var(--rac-tint-2)}.rac-group[data-disabled]{color:var(--rac-muted)}.rac-group-items{padding-inline-start:1em}@keyframes rac-busy{0%{background-position-x:-100%}to{background-position-x:200%}}}

package/dist/trigger.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),b=require("./state.cjs"),o=require("./utils.cjs"),e=require("react"),L=require("./useSelectBehavior.cjs"),z=require("./model.cjs"),R=require("./motion.cjs"),K=[],M=()=>{},_=h=>h==null?"":typeof h=="object"?z.toJSON(h)??"":String(h),G=e.memo(function(){const{selectRef:m,multiple:r,name:d,form:g,required:f}=e.useContext(b.SelectConfigContext),{selected:C,selectedIDs:S,disabled:p,fieldsetDisabled:s}=e.useContext(b.SelectStateContext),{reset:n,markInvalid:v}=e.useContext(b.SelectActionsContext),c=e.useRef(null);e.useEffect(()=>{const t=c.current?.getRootNode();let l;const y=w=>{w.target===c.current?.form&&(clearTimeout(l),l=setTimeout(()=>w.defaultPrevented||n()))};return t?.addEventListener("reset",y,!0),()=>{clearTimeout(l),t?.removeEventListener("reset",y,!0)}},[n]);const x=r?S:C?[C]:K,u=!f&&(!d||r&&!x.length),a=u||!x.length?[""]:x.map(t=>_(t.original)),j=()=>m.current?.focus();return a.map((t,l)=>i.jsx("input",{className:"rac-input",ref:l?void 0:c,name:u?void 0:d,form:g,value:t,hidden:u,required:f&&!l,disabled:p&&!s,tabIndex:-1,"aria-hidden":"true",autoComplete:"off",onChange:M,onInvalid:v,onFocus:j},l))}),O=e.memo(function({hidden:m,settle:r}){const{multiple:d,selectedText:g,valueAsOption:f,renderOption:C,texts:S}=e.useContext(b.SelectConfigContext),{selectedIDs:p,title:s,valueOption:n,hasActualValue:v,loading:c,error:x}=e.useContext(b.SelectStateContext),[u]=e.useState(()=>new Set),a=f&&n?o.optionContent(n,C,!0):null,j=c&&!x&&!v,t=d&&p.length>0&&!g,l=`${t?"picked":a?n.id:s}${j?"-loading":""}`,y=n?.type==="boolean"?String(n.raw):void 0;return i.jsx(R.Presence,{children:!m&&i.jsxs(R.Collapse,{axis:"x",fade:!0,group:u,className:o.withClass("rac-title",a&&n.className),style:a?n.style:void 0,"data-bool":y,onEntered:r,onExited:r,children:[a?i.jsx("div",{className:"rac-option-jsx",children:a}):t?p.map(w=>w.name||S.emptyOption).join(", "):s,j&&o.dots]},l)})}),J=e.memo(function(){const{selectRef:m,multiple:r,valueAsOption:d,duration:g,easing:f,ext:C}=e.useContext(b.SelectConfigContext),S=r?C.Value:void 0,p=e.useRef(null),[s,n]=e.useState(d);d&&!s&&n(!0);const v=e.useRef({duration:g,easing:f});return e.useLayoutEffect(()=>{v.current={duration:g,easing:f}},[g,f]),e.useLayoutEffect(()=>{const c=p.current;if(!s||r||!c||typeof ResizeObserver>"u")return;const x={value:0,root:"",anim:null},u=new ResizeObserver(()=>o.followHeight(m.current,x,c.offsetHeight,v.current.duration,v.current.easing));return u.observe(c),()=>{u.disconnect(),x.anim?.cancel()}},[s,r,m]),S?i.jsx(S,{}):i.jsx("div",{className:"rac-value",ref:p,children:i.jsx(O,{})})}),Q=e.memo(function(){const{selectRef:m,selectId:r,highlightStore:d,className:g,style:f,duration:C,easing:S,deleteInline:p,icons:s,texts:n,placeholder:v,id:c,required:x,popup:u,attrs:a}=e.useContext(b.SelectConfigContext),{visibility:j,active:t,hasActualValue:l,deleting:y,loading:w,loadPending:T,error:N,invalid:q,normalizedOptions:E}=e.useContext(b.SelectStateContext),{handleBlur:A,handleFocus:D,handleKeyDown:F,toggleVisibility:P,clear:V}=e.useContext(b.SelectActionsContext),k=e.useSyncExternalStore(d.subscribe,()=>{const I=j?E[L.effectiveHighlight(d.get())]:null;return I?o.optionDomId(r,I.id):void 0},()=>{}),$=!!s.clear&&l&&t&&!y,B=!!s.arrow&&t&&!y&&u,H=u?{role:"combobox","aria-haspopup":"listbox","aria-controls":`${r}-listbox`,"aria-expanded":j,"aria-activedescendant":k,"aria-required":x||void 0}:{role:"group"};return i.jsxs("div",{...a,id:c,ref:m,style:{"--rac-duration":`${C}ms`,"--rac-ease":S,...f},className:o.withClass("rac-select",g),...t&&{onKeyDown:F,onFocus:D,onClick:P,onBlur:A},...H,"aria-disabled":!t,tabIndex:t?0:-1,"aria-busy":w||T||void 0,"aria-label":a["aria-label"]??(a["aria-labelledby"]?void 0:v),"aria-invalid":q||a["aria-invalid"],"aria-describedby":[a["aria-describedby"],N&&`${r}-error`].filter(Boolean).join(" ")||void 0,"data-inline-delete":o.flag(p),"data-empty":o.flag(!l),"data-deleting":o.flag(y),"data-error":o.flag(N),"data-invalid":o.flag(q),children:[i.jsx(J,{}),i.jsxs(R.Presence,{children:[$&&i.jsx(R.Collapse,{as:"button",type:"button",axis:"x",className:"rac-clear",tabIndex:-1,"aria-label":n.clear,onMouseDown:o.stopEvent,onClick:I=>{o.refocus(I,m),V(I)},children:o.renderIcon(s.clear)},"clear"),B&&i.jsx(R.Collapse,{axis:"x",className:"rac-arrow","aria-hidden":"true",children:o.renderIcon(s.arrow)},"arrow")]}),i.jsx(G,{})]})});exports.Title=O;exports.default=Q;

package/dist/trigger.js

@@ -0,0 +1,94 @@
+"use client";
+import { jsxs as R, jsx as u } from "react/jsx-runtime";
+import { SelectConfigContext as N, SelectStateContext as F, SelectActionsContext as k } from "./state.js";
+import { optionDomId as W, flag as I, withClass as P, renderIcon as V, stopEvent as X, refocus as Y, optionContent as Z, dots as ee, followHeight as te } from "./utils.js";
+import { memo as O, useContext as g, useSyncExternalStore as oe, useState as $, useRef as D, useLayoutEffect as j, useEffect as ne } from "react";
+import { effectiveHighlight as re } from "./useSelectBehavior.js";
+import { toJSON as ie } from "./model.js";
+import { Presence as q, Collapse as E } from "./motion.js";
+const ae = [], le = () => {
+}, se = (b) => b == null ? "" : typeof b == "object" ? ie(b) ?? "" : String(b), ce = /* @__PURE__ */ O(function() {
+  const { selectRef: m, multiple: o, name: s, form: p, required: c } = g(N), { selected: h, selectedIDs: x, disabled: f, fieldsetDisabled: n } = g(F), { reset: t, markInvalid: v } = g(k), a = D(null);
+  ne(() => {
+    const e = a.current?.getRootNode();
+    let i;
+    const y = (C) => {
+      C.target === a.current?.form && (clearTimeout(i), i = setTimeout(() => C.defaultPrevented || t()));
+    };
+    return e?.addEventListener("reset", y, !0), () => {
+      clearTimeout(i), e?.removeEventListener("reset", y, !0);
+    };
+  }, [t]);
+  const d = o ? x : h ? [h] : ae, l = !c && (!s || o && !d.length), r = l || !d.length ? [""] : d.map((e) => se(e.original)), w = () => m.current?.focus();
+  return r.map(
+    (e, i) => /* @__PURE__ */ u("input", { className: "rac-input", ref: i ? void 0 : a, name: l ? void 0 : s, form: p, value: e, hidden: l, required: c && !i, disabled: f && !n, tabIndex: -1, "aria-hidden": "true", autoComplete: "off", onChange: le, onInvalid: v, onFocus: w }, i)
+  );
+}), de = /* @__PURE__ */ O(function({ hidden: m, settle: o }) {
+  const { multiple: s, selectedText: p, valueAsOption: c, renderOption: h, texts: x } = g(N), { selectedIDs: f, title: n, valueOption: t, hasActualValue: v, loading: a, error: d } = g(F), [l] = $(() => /* @__PURE__ */ new Set()), r = c && t ? Z(t, h, !0) : null, w = a && !d && !v, e = s && f.length > 0 && !p, i = `${e ? "picked" : r ? t.id : n}${w ? "-loading" : ""}`, y = t?.type === "boolean" ? String(t.raw) : void 0;
+  return /* @__PURE__ */ u(q, { children: !m && /* @__PURE__ */ R(E, { axis: "x", fade: !0, group: l, className: P("rac-title", r && t.className), style: r ? t.style : void 0, "data-bool": y, onEntered: o, onExited: o, children: [
+    r ? /* @__PURE__ */ u("div", { className: "rac-option-jsx", children: r }) : e ? f.map((C) => C.name || x.emptyOption).join(", ") : n,
+    w && ee
+  ] }, i) });
+}), ue = /* @__PURE__ */ O(function() {
+  const { selectRef: m, multiple: o, valueAsOption: s, duration: p, easing: c, ext: h } = g(N), x = o ? h.Value : void 0, f = D(null), [n, t] = $(s);
+  s && !n && t(!0);
+  const v = D({ duration: p, easing: c });
+  return j(() => {
+    v.current = { duration: p, easing: c };
+  }, [p, c]), j(() => {
+    const a = f.current;
+    if (!n || o || !a || typeof ResizeObserver > "u") return;
+    const d = { value: 0, root: "", anim: null }, l = new ResizeObserver(() => te(m.current, d, a.offsetHeight, v.current.duration, v.current.easing));
+    return l.observe(a), () => {
+      l.disconnect(), d.anim?.cancel();
+    };
+  }, [n, o, m]), x ? /* @__PURE__ */ u(x, {}) : /* @__PURE__ */ u("div", { className: "rac-value", ref: f, children: /* @__PURE__ */ u(de, {}) });
+}), xe = /* @__PURE__ */ O(function() {
+  const { selectRef: m, selectId: o, highlightStore: s, className: p, style: c, duration: h, easing: x, deleteInline: f, icons: n, texts: t, placeholder: v, id: a, required: d, popup: l, attrs: r } = g(N), { visibility: w, active: e, hasActualValue: i, deleting: y, loading: C, loadPending: H, error: T, invalid: A, normalizedOptions: z } = g(F), { handleBlur: B, handleFocus: K, handleKeyDown: L, toggleVisibility: G, clear: J } = g(k), M = oe(s.subscribe, () => {
+    const S = w ? z[re(s.get())] : null;
+    return S ? W(o, S.id) : void 0;
+  }, () => {
+  }), _ = !!n.clear && i && e && !y, Q = !!n.arrow && e && !y && l, U = l ? { role: "combobox", "aria-haspopup": "listbox", "aria-controls": `${o}-listbox`, "aria-expanded": w, "aria-activedescendant": M, "aria-required": d || void 0 } : { role: "group" };
+  return /* @__PURE__ */ R(
+    "div",
+    {
+      ...r,
+      id: a,
+      ref: m,
+      style: { "--rac-duration": `${h}ms`, "--rac-ease": x, ...c },
+      className: P("rac-select", p),
+      ...e && {
+        onKeyDown: L,
+        onFocus: K,
+        onClick: G,
+        onBlur: B
+      },
+      ...U,
+      "aria-disabled": !e,
+      tabIndex: e ? 0 : -1,
+      "aria-busy": C || H || void 0,
+      "aria-label": r["aria-label"] ?? (r["aria-labelledby"] ? void 0 : v),
+      "aria-invalid": A || r["aria-invalid"],
+      "aria-describedby": [r["aria-describedby"], T && `${o}-error`].filter(Boolean).join(" ") || void 0,
+      "data-inline-delete": I(f),
+      "data-empty": I(!i),
+      "data-deleting": I(y),
+      "data-error": I(T),
+      "data-invalid": I(A),
+      children: [
+        /* @__PURE__ */ u(ue, {}),
+        /* @__PURE__ */ R(q, { children: [
+          _ && /* @__PURE__ */ u(E, { as: "button", type: "button", axis: "x", className: "rac-clear", tabIndex: -1, "aria-label": t.clear, onMouseDown: X, onClick: (S) => {
+            Y(S, m), J(S);
+          }, children: V(n.clear) }, "clear"),
+          Q && /* @__PURE__ */ u(E, { axis: "x", className: "rac-arrow", "aria-hidden": "true", children: V(n.arrow) }, "arrow")
+        ] }),
+        /* @__PURE__ */ u(ce, {})
+      ]
+    }
+  );
+});
+export {
+  de as Title,
+  xe as default
+};

package/dist/useChipLayout.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),F=require("react-dom"),R=require("./state.cjs"),g=require("./utils.cjs"),J=require("./model.cjs"),o=require("./chipGeometry.cjs"),Q=.25,U={hoverId:null,swipedId:null,held:!1,breaks:o.NONE},G=(i,a)=>{const u=new Set(i.map(l=>l.id)),c=new Map(a.map(([l,v])=>[v.id,l])),p=a.filter(([,l])=>!u.has(l.id)),E=new Set(a.map(([l])=>l));return i.map(l=>{if(c.has(l.id))return[c.get(l.id),l];const v=p.findIndex(([,k])=>J.sameValue(k.original,l.original));if(v>=0)return[p.splice(v,1)[0][0],l];let w=l.id;for(;E.has(w);)w+="~";return E.add(w),[w,l]})},X=i=>{const[a,u]=n.useState(()=>({chips:i,keyed:G(i,[])}));if(a.chips===i)return a.keyed;const c=G(i,a.keyed);return u({chips:i,keyed:c}),c};function Y(i){const{selectRef:a,duration:u,easing:c,deleteInline:p,deleteAlways:E,icons:l,valueAsOption:v,renderOption:w}=n.useContext(R.SelectConfigContext),{selectedIDs:k,deleting:C,visibility:B,active:L}=n.useContext(R.SelectStateContext),{setDeleting:q,setVisibility:H}=n.useContext(R.SelectActionsContext),[j,V]=n.useState(0),[s]=n.useState(()=>R.createStore(U)),[W]=n.useState(()=>new Set),A=n.useSyncExternalStore(s.subscribe,()=>s.get().held,()=>!1),O=n.useSyncExternalStore(s.subscribe,()=>s.get().breaks,()=>o.NONE),_=n.useSyncExternalStore(g.watchMotion,g.reducedMotion,()=>!1),S=n.useRef({rows:null,reserve:0,chips:i,swap:!1,duration:u,easing:c}),m=n.useRef(null),h=n.useRef({value:0,root:"",anim:null}),d=n.useRef(null),D=n.useRef(null),N=p&&!E&&!C&&!!l.remove,K=N?j+Q:0,z=N&&!j&&i.length>0,x=v?w?2:1:0,I=n.useEffectEvent((e,t)=>{const r=d.current,f=S.current;if(!r)return;const b=o.isResizing(r);if(b&&t)return;e&&s.get().held&&o.freeze(s,r,f);const y=f.swap?f.duration/2:f.duration;b?f.fit!=null&&g.followHeight(a.current,h.current,f.fit,y,f.easing,r):(t||h.current.value)&&g.followHeight(a.current,h.current,r.offsetHeight,y,f.easing),s.get().held||s.set({breaks:o.restBreaks(s,r,f.chips,f.reserve)})});n.useLayoutEffect(()=>{Object.assign(S.current,{duration:u,easing:c})},[u,c]),n.useLayoutEffect(()=>{const e=S.current,t=d.current,r=e.chips!==i;Object.assign(e,{chips:i,reserve:K}),r&&t&&o.isBusy(t)&&o.freeze(s,t,e),I(!r)},[i,K,s]),n.useLayoutEffect(()=>{const e=()=>I(!0,!0),t=typeof ResizeObserver>"u"?null:new ResizeObserver(e);return t?t.observe(d.current):e(),document.fonts?.addEventListener("loadingdone",e),()=>{t?.disconnect(),document.fonts?.removeEventListener("loadingdone",e)}},[]);const M=n.useCallback(()=>{const e=d.current;if(!e||!s.get().held||o.isBusy(e))return;const t=S.current,r=o.slotsOf(e),f=r.map(y=>y.getBoundingClientRect()),b=o.restBreaks(s,e,t.chips,t.reserve);Object.assign(t,{rows:null,floor:null,fit:null}),F.flushSync(()=>s.set({held:!1,breaks:b})),t.swap=o.isBusy(e),t.swap&&F.flushSync(()=>o.freeze(s,e,t)),g.reducedMotion()||r.forEach((y,T)=>y.isConnected&&o.flip(y,f[T],t.swap?u/2:u,c))},[s,u,c]),P=n.useCallback(e=>{d.current&&(m.current=o.snapOf(d.current,e))},[]);return n.useLayoutEffect(()=>{const e=d.current,t=S.current;if(!e||!m.current||!u||g.reducedMotion())return;const r=o.resizesOf(m.current);r.length&&(t.floor=new Map(r.map(({id:f,from:b})=>[f,b.width])),o.freeze(s,e,t),g.followHeight(a.current,h.current,t.fit,u,c,e),o.resize(r,u,c,()=>{M(),I(!1,!0)}))},[x,s,u,c,a,M]),n.useLayoutEffect(()=>{const e=m.current;!e||O!==s.get().breaks||(m.current=null,g.reducedMotion()||e.forEach((t,r)=>r.isConnected&&o.flip(r,t,u,c)))},[O,i,x,s,u,c]),n.useLayoutEffect(()=>{const e=d.current,t=S.current;!e||!h.current.value||o.isResizing(e)||g.followHeight(a.current,h.current,e.offsetHeight,t.swap?t.duration/2:t.duration,t.easing)},[O,A,a]),n.useEffect(()=>()=>h.current.anim?.cancel(),[]),n.useEffect(()=>{C&&B&&H(!1),C&&(!k.length||!L)&&q(!1),s.set({hoverId:null,...!L&&{swipedId:null}})},[k.length,C,B,L,q,H,s]),n.useLayoutEffect(()=>{const e=D.current;if(!z||!e)return;const t=getComputedStyle(e);V(e.getBoundingClientRect().width+parseFloat(t.marginLeft)+parseFloat(t.marginRight))},[z]),{chipStore:s,delGroup:W,valueRef:d,delIconRef:D,probe:z,settle:M,held:A,snapshot:P,look:x,wait:u>0&&!_}}exports.default=Y;exports.useChipKeys=X;

package/dist/useChipLayout.js

@@ -0,0 +1,78 @@
+"use client";
+import { useContext as j, useState as I, useSyncExternalStore as D, useRef as b, useEffectEvent as se, useLayoutEffect as g, useCallback as P, useEffect as Q } from "react";
+import { flushSync as T } from "react-dom";
+import { SelectConfigContext as oe, SelectStateContext as le, SelectActionsContext as ie, createStore as ce } from "./state.js";
+import { watchMotion as ue, reducedMotion as R, followHeight as O } from "./utils.js";
+import { sameValue as ae } from "./model.js";
+import { NONE as _, isResizing as U, freeze as E, restBreaks as X, isBusy as H, slotsOf as fe, flip as Y, snapOf as de, resizesOf as ge, resize as he } from "./chipGeometry.js";
+const me = 0.25, pe = { hoverId: null, swipedId: null, held: !1, breaks: _ }, Z = (i, c) => {
+  const s = new Set(i.map((o) => o.id)), l = new Map(c.map(([o, h]) => [h.id, o])), y = c.filter(([, o]) => !s.has(o.id)), k = new Set(c.map(([o]) => o));
+  return i.map((o) => {
+    if (l.has(o.id)) return [l.get(o.id), o];
+    const h = y.findIndex(([, S]) => ae(S.original, o.original));
+    if (h >= 0) return [y.splice(h, 1)[0][0], o];
+    let m = o.id;
+    for (; k.has(m); ) m += "~";
+    return k.add(m), [m, o];
+  });
+}, Ce = (i) => {
+  const [c, s] = I(() => ({ chips: i, keyed: Z(i, []) }));
+  if (c.chips === i) return c.keyed;
+  const l = Z(i, c.keyed);
+  return s({ chips: i, keyed: l }), l;
+};
+function Re(i) {
+  const { selectRef: c, duration: s, easing: l, deleteInline: y, deleteAlways: k, icons: o, valueAsOption: h, renderOption: m } = j(oe), { selectedIDs: S, deleting: C, visibility: F, active: x } = j(le), { setDeleting: K, setVisibility: N } = j(ie), [V, $] = I(0), [n] = I(() => ce(pe)), [ee] = I(() => /* @__PURE__ */ new Set()), W = D(n.subscribe, () => n.get().held, () => !1), z = D(n.subscribe, () => n.get().breaks, () => _), te = D(ue, R, () => !1), p = b({ rows: null, reserve: 0, chips: i, swap: !1, duration: s, easing: l }), w = b(null), f = b({ value: 0, root: "", anim: null }), a = b(null), G = b(null), q = y && !k && !C && !!o.remove, J = q ? V + me : 0, L = q && !V && i.length > 0, A = h ? m ? 2 : 1 : 0, B = se((e, t) => {
+    const r = a.current, u = p.current;
+    if (!r) return;
+    const v = U(r);
+    if (v && t) return;
+    e && n.get().held && E(n, r, u);
+    const d = u.swap ? u.duration / 2 : u.duration;
+    v ? u.fit != null && O(c.current, f.current, u.fit, d, u.easing, r) : (t || f.current.value) && O(c.current, f.current, r.offsetHeight, d, u.easing), n.get().held || n.set({ breaks: X(n, r, u.chips, u.reserve) });
+  });
+  g(() => {
+    Object.assign(p.current, { duration: s, easing: l });
+  }, [s, l]), g(() => {
+    const e = p.current, t = a.current, r = e.chips !== i;
+    Object.assign(e, { chips: i, reserve: J }), r && t && H(t) && E(n, t, e), B(!r);
+  }, [i, J, n]), g(() => {
+    const e = () => B(!0, !0), t = typeof ResizeObserver > "u" ? null : new ResizeObserver(e);
+    return t ? t.observe(a.current) : e(), document.fonts?.addEventListener("loadingdone", e), () => {
+      t?.disconnect(), document.fonts?.removeEventListener("loadingdone", e);
+    };
+  }, []);
+  const M = P(() => {
+    const e = a.current;
+    if (!e || !n.get().held || H(e)) return;
+    const t = p.current, r = fe(e), u = r.map((d) => d.getBoundingClientRect()), v = X(n, e, t.chips, t.reserve);
+    Object.assign(t, { rows: null, floor: null, fit: null }), T(() => n.set({ held: !1, breaks: v })), t.swap = H(e), t.swap && T(() => E(n, e, t)), R() || r.forEach((d, re) => d.isConnected && Y(d, u[re], t.swap ? s / 2 : s, l));
+  }, [n, s, l]), ne = P((e) => {
+    a.current && (w.current = de(a.current, e));
+  }, []);
+  return g(() => {
+    const e = a.current, t = p.current;
+    if (!e || !w.current || !s || R()) return;
+    const r = ge(w.current);
+    r.length && (t.floor = new Map(r.map(({ id: u, from: v }) => [u, v.width])), E(n, e, t), O(c.current, f.current, t.fit, s, l, e), he(r, s, l, () => {
+      M(), B(!1, !0);
+    }));
+  }, [A, n, s, l, c, M]), g(() => {
+    const e = w.current;
+    !e || z !== n.get().breaks || (w.current = null, R() || e.forEach((t, r) => r.isConnected && Y(r, t, s, l)));
+  }, [z, i, A, n, s, l]), g(() => {
+    const e = a.current, t = p.current;
+    !e || !f.current.value || U(e) || O(c.current, f.current, e.offsetHeight, t.swap ? t.duration / 2 : t.duration, t.easing);
+  }, [z, W, c]), Q(() => () => f.current.anim?.cancel(), []), Q(() => {
+    C && F && N(!1), C && (!S.length || !x) && K(!1), n.set({ hoverId: null, ...!x && { swipedId: null } });
+  }, [S.length, C, F, x, K, N, n]), g(() => {
+    const e = G.current;
+    if (!L || !e) return;
+    const t = getComputedStyle(e);
+    $(e.getBoundingClientRect().width + parseFloat(t.marginLeft) + parseFloat(t.marginRight));
+  }, [L]), { chipStore: n, delGroup: ee, valueRef: a, delIconRef: G, probe: L, settle: M, held: W, snapshot: ne, look: A, wait: s > 0 && !te };
+}
+export {
+  Re as default,
+  Ce as useChipKeys
+};

package/dist/useSelect.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react"),M=require("./state.cjs"),O=require("./utils.cjs"),J=require("./useSelectBehavior.cjs"),Q=require("./useSelectModel.cjs"),ne=[],se=t=>{const p=M.useShallowStable(Array.isArray(t)?t:ne);return e.useMemo(()=>p.reduce((l,n)=>{for(const o in n)o in l&&O.warnOnce(`plugin ${o}`,`Two plugins provide \`${o}\`; the last one wins. Pass each plugin once.`);return Object.assign(l,n)},{}),[p])},le=t=>({internalVisibility:!1,deleting:!1,loadPending:!1,toggledGroups:new Set,internalValue:t.defaultValue,picked:Q.NO_PICK,fieldsetDisabled:!1,invalid:!1});function ae(t,p){const[l,n]=e.useReducer(M.compactReducer,t,le),{internalVisibility:o,deleting:D,loadPending:m,fieldsetDisabled:v}=l,d=e.useMemo(()=>v&&!t.disabled?{...t,disabled:!0}:t,[t,v]),{ref:W,open:L,onOpenChange:X,popup:$,hasMore:Y,loadButton:Z,error:C,disabled:V,loading:w,required:q,texts:B}=d,N=e.useId(),P=e.useMemo(()=>N.replace(/:/g,""),[N]),a=e.useRef(null);e.useImperativeHandle(W,()=>a.current),e.useLayoutEffect(()=>{const i=a.current?.querySelector(".rac-input");if(!i)return;const s=()=>n({fieldsetDisabled:!t.disabled&&i.matches(":disabled")});s();const U=new MutationObserver(s);for(let h=i.parentElement;h;h=h.parentElement)h.tagName==="FIELDSET"&&U.observe(h,{attributeFilter:["disabled"]});return()=>U.disconnect()},[t.disabled]);const[f]=e.useState(()=>M.createStore(J.initialHighlight)),g=se(t.plugins);t.multiple&&(t.deleteInline||t.deleteAlways)&&!g.Value&&O.warnOnce("no chips","`deleteInline` and `deleteAlways` act on chips, which need the `chips` plugin: `plugins={[chips]}`."),(t.hasMore||t.loadButton||t.loadMore)&&!g.request&&O.warnOnce("no paging","`hasMore`, `loadMore` and `loadButton` need the `paging` plugin: `plugins={[paging]}`.");const y=L!==void 0,_=y?!!L:o,G=e.useRef(!1),T=e.useRef(!1),c=M.useStableActions({setVisibility:i=>{i===_||i&&!$||(y||n({internalVisibility:i}),X?.(i))},loadMoreOnce:()=>g.request?.({props:d,lock:G,setPending:i=>n({loadPending:i})}),setListReady:i=>f.set({ready:i}),setDeleting:i=>n({deleting:i}),markInvalid:()=>n({invalid:!0})}),ee=Q.default({props:d,jsxOptions:p,state:l,setState:n,ext:g,setVisibility:c.setVisibility,loadMoreOnce:c.loadMoreOnce}),{normalizedOptions:S,expandedGroups:E,selected:I,selectedIDs:k,hasOptions:j,active:r,hasActualValue:b,title:x,valueOption:F,actions:R}=ee,u=r&&_&&$,H=J.default({props:d,state:l,setState:n,normalizedOptions:S,expandedGroups:E,selected:I,selectedIDs:k,visibility:u,highlightStore:f,setVisibility:c.setVisibility,modelActions:R});e.useEffect(()=>{n({loadPending:!1})},[S.length,Y,Z]),e.useEffect(()=>{m||(G.current=!1)},[m]),e.useEffect(()=>{u&&a.current&&document.activeElement!==a.current&&a.current.focus(),u||f.set({index:-1,ready:!1})},[u,f]),e.useEffect(()=>{T.current&&!r&&c.setVisibility(!1),T.current=r},[r,c]);const A=e.useRef(null),z=d.value!==void 0;e.useEffect(()=>{const i={value:z,open:y};for(const s in i)A.current&&A.current[s]!==i[s]&&O.warnOnce(`switch ${s}`,`\`${s}\` switched between controlled and uncontrolled (\`undefined\`) after mount. Pick one mode for the lifetime of the Select, like a React input${s==="value"?"; clear a controlled value with `null` or `[]`":""}.`);A.current=i},[z,y]),e.useLayoutEffect(()=>{a.current?.querySelector(".rac-input")?.setCustomValidity(q&&!b&&B.required||"")},[q,b,B.required]);const K=l.invalid&&q&&!b&&!V,te=e.useMemo(()=>({...c,...R,...H}),[c,R,H]),ie=e.useMemo(()=>({visibility:u,deleting:D,loadPending:m,expandedGroups:E,selectedIDs:k,normalizedOptions:S,selected:I,hasOptions:j,active:r,hasActualValue:b,title:x,valueOption:F,disabled:V,fieldsetDisabled:v,invalid:K,loading:w,error:C}),[u,D,m,E,k,S,I,j,r,b,x,F,V,v,K,w,C]);return{selectId:P,selectRef:a,highlightStore:f,ext:g,state:ie,actions:te}}exports.default=ae;

package/dist/useSelect.js

@@ -0,0 +1,100 @@
+"use client";
+import { useReducer as ne, useMemo as b, useId as le, useRef as O, useImperativeHandle as se, useLayoutEffect as Q, useState as ae, useEffect as h } from "react";
+import { compactReducer as re, createStore as ce, useStableActions as oe, useShallowStable as de } from "./state.js";
+import { warnOnce as I } from "./utils.js";
+import ue, { initialHighlight as fe } from "./useSelectBehavior.js";
+import ge, { NO_PICK as pe } from "./useSelectModel.js";
+const he = [], be = (e) => {
+  const m = de(Array.isArray(e) ? e : he);
+  return b(() => m.reduce((l, i) => {
+    for (const o in i) o in l && I(`plugin ${o}`, `Two plugins provide \`${o}\`; the last one wins. Pass each plugin once.`);
+    return Object.assign(l, i);
+  }, {}), [m]);
+}, me = (e) => ({
+  internalVisibility: !1,
+  deleting: !1,
+  loadPending: !1,
+  toggledGroups: /* @__PURE__ */ new Set(),
+  internalValue: e.defaultValue,
+  picked: pe,
+  fieldsetDisabled: !1,
+  invalid: !1
+});
+function Ie(e, m) {
+  const [l, i] = ne(re, e, me), { internalVisibility: o, deleting: C, loadPending: v, fieldsetDisabled: y } = l, d = b(() => y && !e.disabled ? { ...e, disabled: !0 } : e, [e, y]), { ref: W, open: L, onOpenChange: X, popup: $, hasMore: Y, loadButton: Z, error: B, disabled: M, loading: N, required: k, texts: x } = d, G = le(), P = b(() => G.replace(/:/g, ""), [G]), s = O(null);
+  se(W, () => s.current), Q(() => {
+    const t = s.current?.querySelector(".rac-input");
+    if (!t) return;
+    const n = () => i({ fieldsetDisabled: !e.disabled && t.matches(":disabled") });
+    n();
+    const J = new MutationObserver(n);
+    for (let p = t.parentElement; p; p = p.parentElement) p.tagName === "FIELDSET" && J.observe(p, { attributeFilter: ["disabled"] });
+    return () => J.disconnect();
+  }, [e.disabled]);
+  const [u] = ae(() => ce(fe)), f = be(e.plugins);
+  e.multiple && (e.deleteInline || e.deleteAlways) && !f.Value && I("no chips", "`deleteInline` and `deleteAlways` act on chips, which need the `chips` plugin: `plugins={[chips]}`."), (e.hasMore || e.loadButton || e.loadMore) && !f.request && I("no paging", "`hasMore`, `loadMore` and `loadButton` need the `paging` plugin: `plugins={[paging]}`.");
+  const S = L !== void 0, F = S ? !!L : o, H = O(!1), T = O(!1), a = oe({
+    // [DOC: select-store]
+    setVisibility: (t) => {
+      t === F || t && !$ || (S || i({ internalVisibility: t }), X?.(t));
+    },
+    // [DOC: paging]
+    loadMoreOnce: () => f.request?.({ props: d, lock: H, setPending: (t) => i({ loadPending: t }) }),
+    setListReady: (t) => u.set({ ready: t }),
+    setDeleting: (t) => i({ deleting: t }),
+    // [DOC: form-field]
+    markInvalid: () => i({ invalid: !0 })
+  }), ee = ge({ props: d, jsxOptions: m, state: l, setState: i, ext: f, setVisibility: a.setVisibility, loadMoreOnce: a.loadMoreOnce }), { normalizedOptions: V, expandedGroups: q, selected: A, selectedIDs: E, hasOptions: _, active: r, hasActualValue: g, title: j, valueOption: w, actions: D } = ee, c = r && F && $, z = ue({
+    props: d,
+    state: l,
+    setState: i,
+    normalizedOptions: V,
+    expandedGroups: q,
+    selected: A,
+    selectedIDs: E,
+    visibility: c,
+    highlightStore: u,
+    setVisibility: a.setVisibility,
+    modelActions: D
+  });
+  h(() => {
+    i({ loadPending: !1 });
+  }, [V.length, Y, Z]), h(() => {
+    v || (H.current = !1);
+  }, [v]), h(() => {
+    c && s.current && document.activeElement !== s.current && s.current.focus(), c || u.set({ index: -1, ready: !1 });
+  }, [c, u]), h(() => {
+    T.current && !r && a.setVisibility(!1), T.current = r;
+  }, [r, a]);
+  const R = O(null), K = d.value !== void 0;
+  h(() => {
+    const t = { value: K, open: S };
+    for (const n in t) R.current && R.current[n] !== t[n] && I(`switch ${n}`, `\`${n}\` switched between controlled and uncontrolled (\`undefined\`) after mount. Pick one mode for the lifetime of the Select, like a React input${n === "value" ? "; clear a controlled value with `null` or `[]`" : ""}.`);
+    R.current = t;
+  }, [K, S]), Q(() => {
+    s.current?.querySelector(".rac-input")?.setCustomValidity(k && !g && x.required || "");
+  }, [k, g, x.required]);
+  const U = l.invalid && k && !g && !M, te = b(() => ({ ...a, ...D, ...z }), [a, D, z]), ie = b(() => ({
+    visibility: c,
+    deleting: C,
+    loadPending: v,
+    expandedGroups: q,
+    selectedIDs: E,
+    normalizedOptions: V,
+    selected: A,
+    hasOptions: _,
+    active: r,
+    hasActualValue: g,
+    title: j,
+    valueOption: w,
+    disabled: M,
+    fieldsetDisabled: y,
+    invalid: U,
+    loading: N,
+    error: B
+  }), [c, C, v, q, E, V, A, _, r, g, j, w, M, y, U, N, B]);
+  return { selectId: P, selectRef: s, highlightStore: u, ext: f, state: ie, actions: te };
+}
+export {
+  Ie as default
+};

package/dist/useSelectBehavior.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("react"),L=require("./state.cjs"),D=require("./utils.cjs"),S={index:-1,fallback:-1,ready:!1},F=({index:r,fallback:f})=>r===-1?f:r,U=10,C=500,V=new Set(["ArrowDown","ArrowUp","PageDown","PageUp","Home","End"]),_=(r,f)=>h.useMemo(()=>{const c=new Set(r.map(n=>n.group).filter(Boolean)),i=n=>!!n&&!n.disabled&&!n.loading&&(n.groupHeader?c.has(n.name):!n.group||f.has(n.group));return{reach:i,list:r.flatMap((n,o)=>i(n)?[o]:[])}},[r,f]),z=(r,f,c,i)=>{const n=r.length-1;if(n<0)return-1;if(c==="Home")return r[0];if(c==="End")return r[n];const o=c==="ArrowUp"||c==="PageUp"?-1:1,l=r.indexOf(f);if(l===-1)return r[o>0?0:n];const s=l+o*(c.startsWith("Page")?U:1);return s>=0&&s<=n?r[s]:c.startsWith("Page")||i?r[s<0?0:n]:r[(s+r.length)%r.length]},R=(r,f,c,i)=>{const n=[...i].every(u=>u===i[0]),o=n?i[0]:i,l=f.filter(u=>"original"in r[u]),s=Math.max(l.indexOf(c)+(n?1:0),0);for(let u=0;u<l.length;u++){const T=l[(s+u)%l.length];if(String(r[T].name).toLowerCase().startsWith(o))return T}return-1};function I({props:r,state:f,setState:c,normalizedOptions:i,expandedGroups:n,selected:o,selectedIDs:l,visibility:s,setVisibility:u,modelActions:T,highlightStore:w}){const{disabled:E,multiple:y,hasMore:P,loadButton:k,icons:x,onFocus:q,onBlur:M,onKeyDown:A}=r,{selectOption:B,clear:W,removeOption:p}=T,{deleting:v}=f,{reach:H,list:m}=_(i,n),d=h.useRef({lastWindowFocusTime:0,justFocused:!1,focusTimeout:null,query:"",queryTimeout:null}),j=h.useMemo(()=>{const e=new Set(y?l.map(a=>a.id):o?[o.id]:[]),t=e.size?i.findIndex(a=>e.has(a.id)&&H(a)):-1;return t!==-1?t:m.find(a=>!i[a].groupHeader)??m[0]??-1},[i,o,l,y,H,m]);h.useLayoutEffect(()=>{const{index:e}=w.get();w.set({fallback:j,index:e!==-1&&H(i[e])?e:-1})}),h.useEffect(()=>{const e=d.current,t=()=>e.lastWindowFocusTime=Date.now();return window.addEventListener("focus",t),()=>{window.removeEventListener("focus",t),clearTimeout(e.focusTimeout),clearTimeout(e.queryTimeout)}},[]);const b=e=>w.set({index:e}),K=(e,t)=>{const a=d.current;clearTimeout(a.queryTimeout),a.queryTimeout=setTimeout(()=>a.query="",C),a.query+=e.toLowerCase();const g=R(i,m,t,a.query);g!==-1&&b(g),s||u(!0)};return L.useStableActions({highlight:b,handleBlur:e=>{const t=e.relatedTarget?.closest(".rac-options");e.currentTarget.contains(e.relatedTarget)||t||(M?.(e),v&&c({deleting:!1}),s&&u(!1))},handleFocus:e=>{const t=e.currentTarget.contains(e.relatedTarget);t||q?.(e),!(t||e.target!==e.currentTarget||s||E||v||document.hidden||Date.now()-d.current.lastWindowFocusTime<100)&&(clearTimeout(d.current.focusTimeout),d.current.focusTimeout=setTimeout(()=>d.current.justFocused=!1,200),d.current.justFocused=!0,u(!0))},toggleVisibility:e=>{if(v){D.stopEvent(e),c({deleting:!1});return}E||d.current.justFocused||u(!s)},handleKeyDown:e=>{if(A?.(e),e.defaultPrevented||E||e.nativeEvent?.isComposing)return;const{key:t}=e;if(e.target!==e.currentTarget&&(t==="Enter"||t.length===1))return;const a=F(w.get());if(t.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(t!==" "||d.current.query)){e.preventDefault(),K(t,a);return}if(V.has(t)){e.preventDefault(),(s||t==="Home"||t==="End")&&b(z(m,a,t,!k&&P)),s||u(!0);return}switch(t){case"Enter":case" ":e.preventDefault(),s?a!==-1&&i[a]&&(b(a),B(i[a],e)):u(!0);break;case"Escape":if(v)c({deleting:!1});else if(s)u(!1);else break;D.stopEvent(e);break;case"Tab":s&&u(!1);break;case"Backspace":case"Delete":{const g=l.at(-1);if(y&&t==="Backspace"&&x.remove&&g)p(g.id);else if(x.clear&&(o||g))W();else break;e.preventDefault();break}}}})}exports.default=I;exports.effectiveHighlight=F;exports.initialHighlight=S;

package/dist/useSelectBehavior.js

@@ -0,0 +1,109 @@
+"use client";
+import { useMemo as F, useRef as L, useLayoutEffect as j, useEffect as U } from "react";
+import { useStableActions as C } from "./state.js";
+import { stopEvent as D } from "./utils.js";
+const Q = { index: -1, fallback: -1, ready: !1 }, S = ({ index: r, fallback: f }) => r === -1 ? f : r, V = 10, z = 500, R = /* @__PURE__ */ new Set(["ArrowDown", "ArrowUp", "PageDown", "PageUp", "Home", "End"]), I = (r, f) => F(() => {
+  const u = new Set(r.map((n) => n.group).filter(Boolean)), i = (n) => !!n && !n.disabled && !n.loading && (n.groupHeader ? u.has(n.name) : !n.group || f.has(n.group));
+  return { reach: i, list: r.flatMap((n, o) => i(n) ? [o] : []) };
+}, [r, f]), Y = (r, f, u, i) => {
+  const n = r.length - 1;
+  if (n < 0) return -1;
+  if (u === "Home") return r[0];
+  if (u === "End") return r[n];
+  const o = u === "ArrowUp" || u === "PageUp" ? -1 : 1, l = r.indexOf(f);
+  if (l === -1) return r[o > 0 ? 0 : n];
+  const s = l + o * (u.startsWith("Page") ? V : 1);
+  return s >= 0 && s <= n ? r[s] : u.startsWith("Page") || i ? r[s < 0 ? 0 : n] : r[(s + r.length) % r.length];
+}, _ = (r, f, u, i) => {
+  const n = [...i].every((c) => c === i[0]), o = n ? i[0] : i, l = f.filter((c) => "original" in r[c]), s = Math.max(l.indexOf(u) + (n ? 1 : 0), 0);
+  for (let c = 0; c < l.length; c++) {
+    const h = l[(s + c) % l.length];
+    if (String(r[h].name).toLowerCase().startsWith(o)) return h;
+  }
+  return -1;
+};
+function X({ props: r, state: f, setState: u, normalizedOptions: i, expandedGroups: n, selected: o, selectedIDs: l, visibility: s, setVisibility: c, modelActions: h, highlightStore: T }) {
+  const { disabled: v, multiple: E, hasMore: k, loadButton: H, icons: x, onFocus: P, onBlur: p, onKeyDown: A } = r, { selectOption: B, clear: W, removeOption: q } = h, { deleting: w } = f, { reach: y, list: g } = I(i, n), d = L({ lastWindowFocusTime: 0, justFocused: !1, focusTimeout: null, query: "", queryTimeout: null }), M = F(() => {
+    const e = new Set(E ? l.map((a) => a.id) : o ? [o.id] : []), t = e.size ? i.findIndex((a) => e.has(a.id) && y(a)) : -1;
+    return t !== -1 ? t : g.find((a) => !i[a].groupHeader) ?? g[0] ?? -1;
+  }, [i, o, l, E, y, g]);
+  j(() => {
+    const { index: e } = T.get();
+    T.set({ fallback: M, index: e !== -1 && y(i[e]) ? e : -1 });
+  }), U(() => {
+    const e = d.current, t = () => e.lastWindowFocusTime = Date.now();
+    return window.addEventListener("focus", t), () => {
+      window.removeEventListener("focus", t), clearTimeout(e.focusTimeout), clearTimeout(e.queryTimeout);
+    };
+  }, []);
+  const b = (e) => T.set({ index: e }), K = (e, t) => {
+    const a = d.current;
+    clearTimeout(a.queryTimeout), a.queryTimeout = setTimeout(() => a.query = "", z), a.query += e.toLowerCase();
+    const m = _(i, g, t, a.query);
+    m !== -1 && b(m), s || c(!0);
+  };
+  return C({
+    highlight: b,
+    handleBlur: (e) => {
+      const t = e.relatedTarget?.closest(".rac-options");
+      e.currentTarget.contains(e.relatedTarget) || t || (p?.(e), w && u({ deleting: !1 }), s && c(!1));
+    },
+    // [DOC: select-behavior]
+    handleFocus: (e) => {
+      const t = e.currentTarget.contains(e.relatedTarget);
+      t || P?.(e), !(t || e.target !== e.currentTarget || s || v || w || document.hidden || Date.now() - d.current.lastWindowFocusTime < 100) && (clearTimeout(d.current.focusTimeout), d.current.focusTimeout = setTimeout(() => d.current.justFocused = !1, 200), d.current.justFocused = !0, c(!0));
+    },
+    toggleVisibility: (e) => {
+      if (w) {
+        D(e), u({ deleting: !1 });
+        return;
+      }
+      v || d.current.justFocused || c(!s);
+    },
+    handleKeyDown: (e) => {
+      if (A?.(e), e.defaultPrevented || v || e.nativeEvent?.isComposing) return;
+      const { key: t } = e;
+      if (e.target !== e.currentTarget && (t === "Enter" || t.length === 1)) return;
+      const a = S(T.get());
+      if (t.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && (t !== " " || d.current.query)) {
+        e.preventDefault(), K(t, a);
+        return;
+      }
+      if (R.has(t)) {
+        e.preventDefault(), (s || t === "Home" || t === "End") && b(Y(g, a, t, !H && k)), s || c(!0);
+        return;
+      }
+      switch (t) {
+        case "Enter":
+        case " ":
+          e.preventDefault(), s ? a !== -1 && i[a] && (b(a), B(i[a], e)) : c(!0);
+          break;
+        // [DOC: select-behavior]
+        case "Escape":
+          if (w) u({ deleting: !1 });
+          else if (s) c(!1);
+          else break;
+          D(e);
+          break;
+        case "Tab":
+          s && c(!1);
+          break;
+        // [DOC: select-behavior]
+        case "Backspace":
+        case "Delete": {
+          const m = l.at(-1);
+          if (E && t === "Backspace" && x.remove && m) q(m.id);
+          else if (x.clear && (o || m)) W();
+          else break;
+          e.preventDefault();
+          break;
+        }
+      }
+    }
+  });
+}
+export {
+  X as default,
+  S as effectiveHighlight,
+  Q as initialHighlight
+};

package/dist/useSelectModel.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("./model.cjs"),O=require("./state.cjs"),b=require("./utils.cjs"),c=require("react"),I=[];function oe({props:m,jsxOptions:G,state:X,setState:y,ext:q,setVisibility:C,loadMoreOnce:Y}){const{onChange:Z,disabled:S,loading:E,error:w,multiple:n,childrenFirst:A,groupsClosed:D,hasMore:P,loadButton:T,placeholder:_,selectedText:g,texts:i}=m,{disabledOption:k,emptyOption:V,invalidOption:z,emptyGroup:H,loadMore:K,loadingMore:N}=i,{loadPending:j,internalValue:$,toggledGroups:x,picked:B}=X,F=O.useDeepStable(m.options),J=O.useDeepStable(m.value),L=J!==void 0,s=L?J:$,Q=c.useMemo(()=>q.row?.({hasMore:P,loadButton:T,loadPending:j,moreText:K,pendingText:N})??null,[q,P,T,j,K,N]),o=c.useMemo(()=>h.normalizeOptions({options:F,jsxOptions:G,childrenFirst:A,tail:Q,emptyOption:V,invalidOption:z,disabledOption:k,emptyGroup:H}),[F,G,A,Q,V,z,k,H]),ee=c.useMemo(()=>new Set(o.filter(e=>e.groupHeader&&!e.disabled&&D===x.has(e.name)).map(e=>e.name)),[o,x,D]),{selected:r,selectedIDs:d}=c.useMemo(()=>h.resolveSelection(s,o,n,B),[s,o,n,B]),p=o.length>0,te=!S&&p,f=s!=null&&!(Array.isArray(s)&&!s.length)&&!(h.isPlain(s)&&!Object.keys(s).length),le=f&&g?null:r,ne=c.useMemo(()=>f&&g?g:r?r.name:w?i.error:E?i.loading:S?i.disabled:p?_:i.empty,[w,E,S,f,g,r,p,_,i]),R=e=>y(t=>{const l=new Set(t.toggledGroups);return l.has(e)?l.delete(e):l.add(e),{toggledGroups:l}}),v=(e,t,l)=>{y(L?{picked:l}:{internalValue:e,picked:l}),Z?.(e,t)},U=e=>v(e.map(t=>t.original),e.map(t=>t.userId),e.map(t=>t.id)),se=O.useStableActions({toggleGroup:R,selectOption:(e,t)=>{if(e.groupHeader){b.stopEvent(t),e.disabled||R(e.name);return}if(e.disabled||e.loadMore){b.stopEvent(t),e.loadMore&&!e.loading&&Y();return}if(n){b.stopEvent(t);const l=d.some(a=>a.id===e.id);U(l?d.filter(a=>a.id!==e.id):[...d,e]);return}r?.id!==e.id&&v(e.original,e.userId,[e.id]),C(!1)},clear:e=>{b.stopEvent(e),v(n?[]:null,n?[]:null,I)},removeOption:e=>U(d.filter(t=>t.id!==e)),reset:()=>{y({deleting:!1,invalid:!1}),C(!1);const e=n?[]:null,t=m.defaultValue??e,{selected:l,selectedIDs:a}=h.resolveSelection(t,o,n,I),M=n?a:l?[l]:[],W=n?d:r?[r]:[];O.deepEqual(s??e,t)&&M.length===W.length&&M.every((u,re)=>u.id===W[re].id)||v(t,n?M.map(u=>u.userId):l?.userId??null,M.map(u=>u.id))}});return{normalizedOptions:o,expandedGroups:ee,selected:r,selectedIDs:d,hasOptions:p,active:te,hasActualValue:f,title:ne,valueOption:le,actions:se}}exports.NO_PICK=I;exports.default=oe;

package/dist/useSelectModel.js

@@ -0,0 +1,59 @@
+"use client";
+import { normalizeOptions as oe, resolveSelection as R, isPlain as de } from "./model.js";
+import { useDeepStable as U, useStableActions as ie, deepEqual as ae } from "./state.js";
+import { stopEvent as O } from "./utils.js";
+import { useMemo as c } from "react";
+const W = [];
+function ge({ props: m, jsxOptions: M, state: X, setState: b, ext: I, setVisibility: G, loadMoreOnce: Y }) {
+  const { onChange: Z, disabled: y, loading: S, error: w, multiple: n, childrenFirst: A, groupsClosed: C, hasMore: k, loadButton: D, placeholder: T, selectedText: f, texts: d } = m, { disabledOption: V, emptyOption: x, invalidOption: z, emptyGroup: E, loadMore: H, loadingMore: P } = d, { loadPending: q, internalValue: $, toggledGroups: B, picked: F } = X, K = U(m.options), N = U(m.value), _ = N !== void 0, r = _ ? N : $, j = c(() => I.row?.({ hasMore: k, loadButton: D, loadPending: q, moreText: H, pendingText: P }) ?? null, [I, k, D, q, H, P]), o = c(() => oe({
+    options: K,
+    jsxOptions: M,
+    childrenFirst: A,
+    tail: j,
+    emptyOption: x,
+    invalidOption: z,
+    disabledOption: V,
+    emptyGroup: E
+  }), [K, M, A, j, x, z, V, E]), ee = c(() => new Set(
+    o.filter((e) => e.groupHeader && !e.disabled && C === B.has(e.name)).map((e) => e.name)
+  ), [o, B, C]), { selected: s, selectedIDs: i } = c(() => R(r, o, n, F), [r, o, n, F]), g = o.length > 0, le = !y && g, p = r != null && !(Array.isArray(r) && !r.length) && !(de(r) && !Object.keys(r).length), te = p && f ? null : s, ne = c(() => p && f ? f : s ? s.name : w ? d.error : S ? d.loading : y ? d.disabled : g ? T : d.empty, [w, S, y, p, f, s, g, T, d]), J = (e) => b((l) => {
+    const t = new Set(l.toggledGroups);
+    return t.has(e) ? t.delete(e) : t.add(e), { toggledGroups: t };
+  }), h = (e, l, t) => {
+    b(_ ? { picked: t } : { internalValue: e, picked: t }), Z?.(e, l);
+  }, L = (e) => h(e.map((l) => l.original), e.map((l) => l.userId), e.map((l) => l.id)), re = ie({
+    toggleGroup: J,
+    selectOption: (e, l) => {
+      if (e.groupHeader) {
+        O(l), e.disabled || J(e.name);
+        return;
+      }
+      if (e.disabled || e.loadMore) {
+        O(l), e.loadMore && !e.loading && Y();
+        return;
+      }
+      if (n) {
+        O(l);
+        const t = i.some((a) => a.id === e.id);
+        L(t ? i.filter((a) => a.id !== e.id) : [...i, e]);
+        return;
+      }
+      s?.id !== e.id && h(e.original, e.userId, [e.id]), G(!1);
+    },
+    clear: (e) => {
+      O(e), h(n ? [] : null, n ? [] : null, W);
+    },
+    removeOption: (e) => L(i.filter((l) => l.id !== e)),
+    // [DOC: form-field]
+    reset: () => {
+      b({ deleting: !1, invalid: !1 }), G(!1);
+      const e = n ? [] : null, l = m.defaultValue ?? e, { selected: t, selectedIDs: a } = R(l, o, n, W), v = n ? a : t ? [t] : [], Q = n ? i : s ? [s] : [];
+      ae(r ?? e, l) && v.length === Q.length && v.every((u, se) => u.id === Q[se].id) || h(l, n ? v.map((u) => u.userId) : t?.userId ?? null, v.map((u) => u.id));
+    }
+  });
+  return { normalizedOptions: o, expandedGroups: ee, selected: s, selectedIDs: i, hasOptions: g, active: le, hasActualValue: p, title: ne, valueOption: te, actions: re };
+}
+export {
+  W as NO_PICK,
+  ge as default
+};

package/dist/utils.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),d=require("react"),p={XMark:({className:t="",...e})=>n.jsx("svg",{className:t,viewBox:"0 0 320 512",fill:"currentColor","aria-hidden":"true",height:"1em",width:"1em",...e,children:n.jsx("path",{d:"M310.6 361.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L160 301.3 54.6 406.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L114.7 256 9.4 150.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 210.7 265.4 105.4c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3L205.3 256l105.3 105.4z"})}),ArrowUp:({className:t="",...e})=>n.jsx("svg",{className:t,viewBox:"0 0 448 512",fill:"currentColor","aria-hidden":"true",height:"1em",width:"1em",...e,children:n.jsx("path",{d:"M34.9 289.5l175.9-175.8c9.4-9.4 24.6-9.4 33.9 0L420.1 289.5c15.1 15.1 4.4 41-17 41H51.9c-21.4 0-32.1-25.9-17-41z"})}),Checkmark:({className:t="",...e})=>n.jsx("svg",{className:t,viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true",height:"1em",width:"1em",...e,children:n.jsx("path",{d:"M20.285 6.708a1 1 0 0 0-1.414-1.416l-9.192 9.192-4.243-4.244a1 1 0 1 0-1.414 1.416l5 5a1 1 0 0 0 1.414 0l9.849-9.948z"})})},j=(t,e)=>{if(!t)return null;const i=(s={})=>({...e,...s,style:{...e?.style,...s?.style}});if(typeof t=="string")return n.jsx("img",{src:t,...i(),className:u("rac-icon",e?.className),alt:""});if(d.isValidElement(t))return d.cloneElement(t,i(t.props));if(typeof t=="function"||typeof t=="object"&&t.$$typeof){const s=t;return n.jsx(s,{...i()})}return null},v=(t,e)=>`${t}-${String(e).replace(/[^A-Za-z0-9-]/gu,i=>`_${i.codePointAt(0).toString(36)}_`)}`,m=t=>t?"":void 0,u=(t,e)=>e?`${t} ${e}`:t,y=(t,e,i)=>t.jsx||(e&&"original"in t?e(t.original,{selected:i,disabled:!!t.disabled}):null),E=n.jsxs("span",{className:"rac-dots","aria-hidden":"true",children:[n.jsx("i",{}),n.jsx("i",{}),n.jsx("i",{})]}),C=(()=>{try{return process.env.NODE_ENV!=="production"}catch{return!1}})(),h=new Set,M=(t,e)=>{!C||h.has(t)||(h.add(t),console.warn(`[react-animated-select] ${e}`))},b=t=>{t?.stopPropagation(),t?.preventDefault()},$=(t,e)=>{t?.currentTarget.contains(document.activeElement)&&e.current?.focus()},g="(prefers-reduced-motion: reduce)",f=()=>!!window.matchMedia?.(g).matches,S=t=>{const e=window.matchMedia?.(g);return e?.addEventListener("change",t),()=>e?.removeEventListener("change",t)},D=(t,e,i,s,w,r)=>{if(!t||i===e.value)return;const o=getComputedStyle(t),c=e.anim?o.height:e.root;e.anim?.cancel(),r&&Object.assign(r.style,{height:`${i}px`,boxSizing:"border-box"}),e.root=o.height,r&&Object.assign(r.style,{height:"",boxSizing:""});const x=!e.value||c===e.root||!t.animate||f();if(e.value=i,e.anim=null,x)return;const a={overflow:"hidden",alignItems:"flex-start"},l=e.anim=t.animate([{...a,height:c},{...a,height:e.root}],{duration:s,easing:w});l.onfinish=()=>{e.anim===l&&(e.anim=null)}};exports.dots=E;exports.flag=m;exports.followHeight=D;exports.icons=p;exports.optionContent=y;exports.optionDomId=v;exports.reducedMotion=f;exports.refocus=$;exports.renderIcon=j;exports.stopEvent=b;exports.warnOnce=M;exports.watchMotion=S;exports.withClass=u;