react-animated-select 0.8.0 → 0.8.1

package/dist/utils.js

@@ -52,7 +52,7 @@ const C = {
     }
   });
   return typeof t == "string" ? /* @__PURE__ */ i("img", { src: t, ...n(), className: m("rac-icon", e?.className), alt: "" }) : p(t) ? w(t, n(t.props)) : typeof t == "function" || typeof t == "object" && t.$$typeof ? /* @__PURE__ */ i(t, { ...n() }) : null;
-}, M = (t, e) => `${t}-${String(e).replace(/[^A-Za-z0-9-]/gu, (n) => `_${n.codePointAt(0).toString(36)}_`)}`, b = (t) => t ? "" : void 0, m = (t, e) => e ? `${t} ${e}` : t, L = (t, e, n) => t.jsx || (e && "original" in t ? e(t.original, { selected: n, disabled: !!t.disabled }) : null), j = /* @__PURE__ */ f("span", { className: "rac-dots", "aria-hidden": "true", children: [
+}, M = (t, e) => `${t}-${String(e).replace(/[^A-Za-z0-9-]/gu, (n) => `_${n.codePointAt(0).toString(36)}_`)}`, b = (t) => t ? "" : void 0, m = (t, e) => e ? `${t} ${e}` : t, L = (t, e, n) => t.jsx || (e && "original" in t ? e(t.original, { selected: n, disabled: !!t.disabled }) : null), S = /* @__PURE__ */ f("span", { className: "rac-dots", "aria-hidden": "true", children: [
   /* @__PURE__ */ i("i", {}),
   /* @__PURE__ */ i("i", {}),
   /* @__PURE__ */ i("i", {})
@@ -62,38 +62,38 @@ const C = {
   } catch {
     return !1;
   }
-})(), d = /* @__PURE__ */ new Set(), z = (t, e) => {
+})(), d = /* @__PURE__ */ new Set(), j = (t, e) => {
   !v || d.has(t) || (d.add(t), console.warn(`[react-animated-select] ${e}`));
-}, D = (t) => {
+}, z = (t) => {
   t?.stopPropagation(), t?.preventDefault();
-}, S = (t, e) => {
+}, D = (t, e) => {
   t?.currentTarget.contains(document.activeElement) && e.current?.focus();
 }, h = "(prefers-reduced-motion: reduce)", y = () => !!window.matchMedia?.(h).matches, N = (t) => {
   const e = window.matchMedia?.(h);
   return e?.addEventListener("change", t), () => e?.removeEventListener("change", t);
 }, A = (t, e, n, r, u, s) => {
   if (!t || n === e.value) return;
-  const o = getComputedStyle(t), c = e.anim ? o.height : e.root;
+  const o = getComputedStyle(t), a = e.anim?.playState === "running" ? o.height : e.root;
   e.anim?.cancel(), s && Object.assign(s.style, { height: `${n}px`, boxSizing: "border-box" }), e.root = o.height, s && Object.assign(s.style, { height: "", boxSizing: "" });
-  const g = !e.value || c === e.root || !t.animate || y();
+  const g = !e.value || a === e.root || !t.animate || y();
   if (e.value = n, e.anim = null, g) return;
-  const a = { overflow: "hidden", alignItems: "flex-start" }, l = e.anim = t.animate([{ ...a, height: c }, { ...a, height: e.root }], { duration: r, easing: u });
+  const c = { overflow: "hidden", alignItems: "flex-start" }, l = e.anim = t.animate([{ ...c, height: a }, { ...c, height: e.root }], { duration: r, easing: u });
   l.onfinish = () => {
     e.anim === l && (e.anim = null);
   };
 };
 export {
-  j as dots,
+  S as dots,
   b as flag,
   A as followHeight,
   C as icons,
   L as optionContent,
   M as optionDomId,
   y as reducedMotion,
-  S as refocus,
+  D as refocus,
   $ as renderIcon,
-  D as stopEvent,
-  z as warnOnce,
+  z as stopEvent,
+  j as warnOnce,
   N as watchMotion,
   m as withClass
 };

package/index.d.ts

@@ -43,6 +43,11 @@ export interface SelectIcons {
     checkbox: SelectIcon
 }
 
+/** An extension passed to `<Select plugins={[...]}/>`: use the built-in `chips` and `paging`. */
+export interface SelectPlugin {
+    readonly [key: string]: unknown
+}
+
 export interface SelectProps extends AriaAttributes {
     [key: `data-${string}`]: string | number | boolean | undefined
 
@@ -58,6 +63,8 @@ export interface SelectProps extends AriaAttributes {
     /** value: an array item as given (an object stays the whole object), an <Option/> as its `value`; a controlled value must have the shape of its source. */
     onChange?: (value: any, ids: any) => void
     multiple?: boolean
+    /** Optional features: `[chips]` for chips in a multiple Select, `[paging]` for `hasMore` / `loadMore` / `loadButton`. */
+    plugins?: SelectPlugin[]
     childrenFirst?: boolean
     groupsClosed?: boolean
 
@@ -158,6 +165,12 @@ export interface SelectProps extends AriaAttributes {
 
 export const Select: FC<SelectProps>
 
+/** Plugin: chips for the selected values of a multiple Select. */
+export const chips: SelectPlugin
+
+/** Plugin: loading more options (`hasMore`, `loadMore`, `loadButton`, `loadOffset`, `loadAhead`). */
+export const paging: SelectPlugin
+
 export interface OptionProps {
     value?: any
     id?: any

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-animated-select",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "type": "module",
   "author": {
     "name": "l1nway",