@strapi/design-system 1.3.1 → 1.4.0-beta.1

package/dist/Combobox/Combobox.js

@@ -1,15 +1,15 @@
-var we = Object.defineProperty, $e = Object.defineProperties;
-var ke = Object.getOwnPropertyDescriptors;
+var Le = Object.defineProperty, we = Object.defineProperties;
+var $e = Object.getOwnPropertyDescriptors;
 var w = Object.getOwnPropertySymbols;
 var G = Object.prototype.hasOwnProperty, J = Object.prototype.propertyIsEnumerable;
-var W = (o, i, a) => i in o ? we(o, i, { enumerable: !0, configurable: !0, writable: !0, value: a }) : o[i] = a, D = (o, i) => {
+var W = (o, i, a) => i in o ? Le(o, i, { enumerable: !0, configurable: !0, writable: !0, value: a }) : o[i] = a, D = (o, i) => {
   for (var a in i || (i = {}))
     G.call(i, a) && W(o, a, i[a]);
   if (w)
     for (var a of w(i))
       J.call(i, a) && W(o, a, i[a]);
   return o;
-}, F = (o, i) => $e(o, ke(i));
+}, F = (o, i) => we(o, $e(i));
 var Q = (o, i) => {
   var a = {};
   for (var p in o)
@@ -19,16 +19,16 @@ var Q = (o, i) => {
       i.indexOf(p) < 0 && J.call(o, p) && (a[p] = o[p]);
   return a;
 };
-import r, { useState as O, useRef as y, useEffect as X, useLayoutEffect as Be, Children as Y, cloneElement as Re } from "react";
+import r, { useState as k, useRef as y, useEffect as X, useLayoutEffect as Re, Children as Y, cloneElement as Se } from "react";
 import e from "prop-types";
-import { useId as Se } from "../helpers/useId.js";
-import De from "@strapi/icons/CarretDown";
-import Fe from "@strapi/icons/Cross";
-import { filterOptions as Z, maintainScrollVisibility as Te, getActionFromKey as Ae, MenuActions as C, getUpdatedIndex as T } from "./utils.js";
+import Be from "@strapi/icons/CarretDown";
+import De from "@strapi/icons/Cross";
+import { useId as Fe } from "../helpers/useId.js";
+import { filterOptions as Z, maintainScrollVisibility as Te, getActionFromKey as Ae, MenuActions as h, getUpdatedIndex as T } from "./utils.js";
 import { Flex as ee } from "../Flex/Flex.js";
-import { IconBox as Ve, CaretBox as Ke } from "../Select/components.js";
-import { Popover as Ne } from "../Popover/Popover.js";
-import { Box as Pe } from "../Box/Box.js";
+import { IconBox as Pe, CaretBox as Ve } from "../Select/components.js";
+import { Popover as Ke } from "../Popover/Popover.js";
+import { Box as Ne } from "../Box/Box.js";
 import { Typography as te } from "../Typography/Typography.js";
 import { Loader as qe } from "../Loader/Loader.js";
 import { MainRow as He, InputContainer as Ue, ValueContainer as _e, Input as je } from "./components.js";
@@ -44,30 +44,30 @@ import "../Field/FieldAction.js";
 import { Stack as Ye } from "../Stack/Stack.js";
 import { KeyboardKeys as Ze } from "../helpers/keyboardKeys.js";
 import { VisuallyHidden as et } from "../VisuallyHidden/VisuallyHidden.js";
-const $ = (tt) => {
-  var P = tt, {
+const O = (tt) => {
+  var N = tt, {
     children: o,
     clearLabel: i,
     creatable: a,
     createMessage: p,
-    disabled: f,
-    error: k,
+    disabled: u,
+    error: $,
     hasMoreItems: re,
     hint: A,
-    label: h,
+    label: E,
     labelAction: ne,
-    loading: B,
+    loading: R,
     loadingMessage: ae,
     noOptionsMessage: ie,
-    onChange: V,
-    onClear: K,
+    onChange: P,
+    onClear: V,
     onCreateOption: le,
-    onInputChange: N,
+    onInputChange: K,
     onLoadMore: se,
     placeholder: ce,
     required: pe,
     value: m
-  } = P, ue = Q(P, [
+  } = N, de = Q(N, [
     "children",
     "clearLabel",
     "creatable",
@@ -90,78 +90,95 @@ const $ = (tt) => {
     "required",
     "value"
   ]);
-  const de = () => {
+  const fe = () => {
     var t;
     return (t = o.find((n) => {
       var l;
       return ((l = n.props) == null ? void 0 : l.value.toLowerCase()) === m.toLowerCase();
     }).props) == null ? void 0 : t.children;
-  }, [c, q] = O(0), [fe, me] = O(null), [d, H] = O(o), [E, ge] = O(!1), [s, M] = O(""), x = y(), L = y(!1), I = y(), U = y(), be = y(), _ = y(!0), u = Se("combobox"), R = `${u}-label`;
-  if (!h && !ue["aria-label"])
+  }, [c, q] = k(0), [ue, me] = k(null), [f, H] = k(o), [g, be] = k(!1), [s, M] = k(""), x = y(), L = y(!1), I = y(), U = y(), ge = y(), _ = y(!0), d = Fe("combobox"), S = `${d}-label`;
+  if (!E && !de["aria-label"])
     throw new Error('The Combobox component needs a "label" or an "aria-label" props');
   X(() => {
     H(Z(o, s));
   }, [s, o]), X(() => {
-    E && x.current && Te(x.current);
-  }, [c]), Be(() => {
-    if (_.current) {
-      _.current = !1;
-      return;
-    }
+    g && x.current && Te(x.current);
+  }, [c, g]), Re(() => {
+    _.current && (_.current = !1);
   }, [m]);
-  const Ce = E ? `${u}-${c}` : "", j = () => {
-    V(null), M("");
+  const Ce = g ? `${d}-${c}` : "", j = () => {
+    P(null), M("");
   }, he = (t) => {
-    N && N(t);
+    K && K(t);
     const n = I.current.value;
-    H(Z(o, n)), q(0), me(null), s !== n && M(n), E || g(!0, !1);
+    H(Z(o, n)), q(0), me(null), s !== n && M(n), g || b(!0, !1);
   }, Ee = (t) => {
-    const { key: n } = t, l = a && s ? d.length : d.length - 1, v = Ae(n, E);
+    const { key: n } = t, l = a && s ? f.length : f.length - 1, v = Ae(n, g);
     switch (m && !s && n === Ze.BACKSPACE && j(), v) {
-      case C.Next:
-        return b(c === l ? 0 : T(c, l, v));
-      case C.Previous:
-        return b(c === 0 ? l : T(c, l, v));
-      case C.Last:
-      case C.First:
-        return b(c === l ? 0 : T(c, l, v));
-      case C.CloseSelect:
-        t.preventDefault(), S(c);
-        return;
-      case C.Close:
-        return t.preventDefault(), g(!1);
-      case C.Open:
-        return g(!0);
-      default:
-        return;
+      case h.Next: {
+        if (c === l) {
+          C(0);
+          break;
+        }
+        C(T(c, l, v));
+        break;
+      }
+      case h.Previous: {
+        if (c === 0) {
+          C(l);
+          break;
+        }
+        C(T(c, l, v));
+        break;
+      }
+      case h.Last:
+      case h.First: {
+        if (c === l) {
+          C(0);
+          break;
+        }
+        C(T(c, l, v));
+        break;
+      }
+      case h.CloseSelect:
+        t.preventDefault(), B(c);
+        break;
+      case h.Close:
+        t.preventDefault(), b(!1);
+        break;
+      case h.Open:
+        b(!0);
+        break;
     }
   }, xe = (t) => {
     if (t.preventDefault(), m && !L.current && M(""), L.current) {
       L.current = !1;
       return;
     }
-    g(!1, !1);
-  }, b = (t) => {
+    b(!1, !1);
+  }, C = (t) => {
     q(t);
   }, ve = (t) => {
-    b(t), S(t);
+    C(t), B(t);
   }, z = () => {
     L.current = !0;
-  }, S = (t) => {
-    const n = d[t];
-    if (M(""), n)
-      return V(n.props.value), g(!1);
-    a && (le(s), g(!1));
-  }, g = (t, n = !0) => {
-    ge(t), n && I.current.focus();
-  }, ye = Y.toArray(d).map((t, n) => {
+  }, B = (t) => {
+    const n = f[t];
+    if (M(""), n) {
+      P(n.props.value), b(!1);
+      return;
+    }
+    a && (le(s), b(!1));
+  }, b = (t, n = !0) => {
+    be(t), n && I.current.focus();
+  }, ye = Y.toArray(f).map((t, n) => {
     const l = c === n;
-    return Re(t, {
-      id: `${u}-${n}`,
-      "aria-selected": fe === n,
+    return Se(t, {
+      id: `${d}-${n}`,
+      "aria-selected": ue === n,
       "aria-posinset": n + 1,
-      "aria-setsize": Y.toArray(d).length,
-      ref: (v) => {
+      "aria-setsize": Y.toArray(f).length,
+      ref(v) {
         l && (x.current = v);
       },
       onClick: () => ve(n),
@@ -169,55 +186,55 @@ const $ = (tt) => {
       isSelected: l
     });
   }), Ie = () => {
-    I.current.focus(), K && K(), j();
+    I.current.focus(), V && V(), j();
+  }, ke = () => {
+    I.current.focus(), b(!0);
   }, Oe = () => {
-    I.current.focus(), g(!0);
-  }, Me = () => {
-    const t = d.findIndex((n) => {
+    const t = f.findIndex((n) => {
       var l;
       return ((l = n.props) == null ? void 0 : l.children) === s;
     });
     return s && t === -1;
-  }, Le = (t) => {
-    t.preventDefault(), g(t, !0);
+  }, Me = (t) => {
+    t.preventDefault(), b(t, !0);
   };
   return /* @__PURE__ */ r.createElement(Ge, {
     hint: A,
-    error: k,
-    id: u
+    error: $,
+    id: d
   }, /* @__PURE__ */ r.createElement(et, {
     "aria-live": "polite",
     "aria-atomic": "false",
     "aria-relevant": "additions text"
   }, m), /* @__PURE__ */ r.createElement(Ye, {
-    spacing: h || A || k ? 1 : 0
-  }, h && /* @__PURE__ */ r.createElement(Je, {
+    spacing: E || A || $ ? 1 : 0
+  }, E && /* @__PURE__ */ r.createElement(Je, {
     action: ne,
     required: pe,
-    id: R
-  }, h), /* @__PURE__ */ r.createElement(He, {
+    id: S
+  }, E), /* @__PURE__ */ r.createElement(He, {
     ref: U,
-    $disabled: f,
-    hasError: k
+    $disabled: u,
+    hasError: $
   }, /* @__PURE__ */ r.createElement(Ue, {
     wrap: "wrap"
   }, !s && m && /* @__PURE__ */ r.createElement(_e, {
-    id: `${u}-selected-value`
-  }, /* @__PURE__ */ r.createElement(te, null, de())), /* @__PURE__ */ r.createElement(je, {
+    id: `${d}-selected-value`
+  }, /* @__PURE__ */ r.createElement(te, null, fe())), /* @__PURE__ */ r.createElement(je, {
     "aria-activedescendant": Ce,
     "aria-autocomplete": "list",
-    "aria-controls": `${u}-listbox`,
-    "aria-disabled": f,
-    "aria-expanded": E,
+    "aria-controls": `${d}-listbox`,
+    "aria-disabled": u,
+    "aria-expanded": g,
     "aria-haspopup": "listbox",
-    "aria-labelledby": h ? R : void 0,
-    id: u,
-    onBlur: f ? void 0 : xe,
-    onClick: f ? void 0 : Le,
-    onInput: f ? void 0 : he,
-    onKeyDown: f ? void 0 : Ee,
+    "aria-labelledby": E ? S : void 0,
+    id: d,
+    onBlur: u ? void 0 : xe,
+    onClick: u ? void 0 : Me,
+    onInput: u ? void 0 : he,
+    onKeyDown: u ? void 0 : Ee,
     placeholder: m ? "" : ce,
-    readOnly: f,
+    readOnly: u,
     ref: I,
     role: "combobox",
     autoComplete: "off",
@@ -225,46 +242,46 @@ const $ = (tt) => {
     spellCheck: "off",
     type: "text",
     value: s
-  })), /* @__PURE__ */ r.createElement(ee, null, (m || s) && /* @__PURE__ */ r.createElement(Ve, {
-    id: `${u}-clear`,
+  })), /* @__PURE__ */ r.createElement(ee, null, (m || s) && /* @__PURE__ */ r.createElement(Pe, {
+    id: `${d}-clear`,
     "aria-label": i,
-    disabled: f,
+    disabled: u,
     paddingLeft: 3,
     as: "button",
     onClick: Ie,
     type: "button"
-  }, /* @__PURE__ */ r.createElement(Fe, null)), /* @__PURE__ */ r.createElement(Ke, {
-    disabled: f,
+  }, /* @__PURE__ */ r.createElement(De, null)), /* @__PURE__ */ r.createElement(Ve, {
+    disabled: u,
     paddingLeft: 3,
     "aria-hidden": !0,
     as: "button",
-    onClick: Oe,
+    onClick: ke,
     tabIndex: -1,
     type: "button"
-  }, /* @__PURE__ */ r.createElement(De, null)))), /* @__PURE__ */ r.createElement(Qe, null), /* @__PURE__ */ r.createElement(Xe, null)), E && /* @__PURE__ */ r.createElement(Ne, {
-    id: `${u}-popover`,
+  }, /* @__PURE__ */ r.createElement(Be, null)))), /* @__PURE__ */ r.createElement(Qe, null), /* @__PURE__ */ r.createElement(Xe, null)), g && /* @__PURE__ */ r.createElement(Ke, {
+    id: `${d}-popover`,
     source: U,
     spacing: 4,
     fullWidth: !0,
-    intersectionId: `${u}-listbox-popover-intersection`,
-    onReachEnd: re && !B ? se : void 0
+    intersectionId: `${d}-listbox-popover-intersection`,
+    onReachEnd: re && !R ? se : void 0
   }, /* @__PURE__ */ r.createElement("div", {
     role: "listbox",
-    ref: be,
-    id: `${u}-listbox`,
-    "aria-labelledby": h ? R : void 0
-  }, (Boolean(d.length) || a) && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(We, {
+    ref: ge,
+    id: `${d}-listbox`,
+    "aria-labelledby": E ? S : void 0
+  }, (Boolean(f.length) || a) && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(We, {
     activeOptionRef: x,
     options: ye
-  }), Me() && a && /* @__PURE__ */ r.createElement(ze, {
-    isSelected: c === d.length,
+  }), Oe() && a && /* @__PURE__ */ r.createElement(ze, {
+    isSelected: c === f.length,
     ref: (t) => {
-      c === d.length && (x.current = t);
+      c === f.length && (x.current = t);
     },
     onMouseDown: z,
-    onClick: () => S(),
+    onClick: () => B(),
     taindex: 0
-  }, p(s))), !Boolean(d.length) && !a && !B && /* @__PURE__ */ r.createElement(Pe, {
+  }, p(s))), !f.length && !a && !R && /* @__PURE__ */ r.createElement(Ne, {
     paddingLeft: 4,
     paddingRight: 4,
     paddingTop: 2,
@@ -272,7 +289,7 @@ const $ = (tt) => {
     ref: x
   }, /* @__PURE__ */ r.createElement(te, {
     textColor: "neutral800"
-  }, ie(s))), B && /* @__PURE__ */ r.createElement(ee, {
+  }, ie(s))), R && /* @__PURE__ */ r.createElement(ee, {
     justifyContent: "center",
     alignItems: "center",
     paddingTop: 2,
@@ -280,10 +297,10 @@ const $ = (tt) => {
   }, /* @__PURE__ */ r.createElement(qe, {
     small: !0
   }, ae)))));
-}, oe = (o) => /* @__PURE__ */ r.createElement($, F(D({}, o), {
+}, oe = (o) => /* @__PURE__ */ r.createElement(O, F(D({}, o), {
   creatable: !0
 }));
-$.defaultProps = oe.defaultProps = {
+O.defaultProps = {
   "aria-label": void 0,
   clearLabel: "clear",
   creatable: !1,
@@ -303,7 +320,8 @@ $.defaultProps = oe.defaultProps = {
   placeholder: "Select or enter a value",
   value: void 0
 };
-$.propTypes = {
+oe.defaultProps = O.defaultProps;
+O.propTypes = {
   "aria-label": e.string,
   children: e.oneOfType([e.arrayOf(e.node), e.node]),
   clearLabel: e.string,
@@ -326,10 +344,10 @@ $.propTypes = {
   placeholder: e.string,
   value: e.string
 };
-oe.propTypes = F(D({}, $.propTypes), {
+oe.propTypes = F(D({}, O.propTypes), {
   onCreateOption: e.func.isRequired
 });
 export {
-  $ as Combobox,
+  O as Combobox,
   oe as CreatableCombobox
 };

package/dist/Combobox/ComboboxList.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react"),i=require("prop-types"),s=require("./utils.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=u(i),t=({options:e,activeOptionRef:o})=>(r.useEffect(()=>{o.current&&s.maintainScrollVisibility(o.current)},[]),e);t.defaultProps={activeOptionRef:void 0};t.propTypes={options:c.default.array.isRequired};exports.ComboboxList=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react"),s=require("prop-types"),i=require("./utils.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=u(s),o=({options:e,activeOptionRef:t})=>(r.useEffect(()=>{t.current&&i.maintainScrollVisibility(t.current)},[t]),e);o.defaultProps={activeOptionRef:void 0};o.propTypes={options:c.default.array.isRequired};exports.ComboboxList=o;

package/dist/Combobox/ComboboxList.js

@@ -1,14 +1,14 @@
 import { useEffect as t } from "react";
-import e from "prop-types";
-import { maintainScrollVisibility as p } from "./utils.js";
+import p from "prop-types";
+import { maintainScrollVisibility as e } from "./utils.js";
 const o = ({ options: i, activeOptionRef: r }) => (t(() => {
-  r.current && p(r.current);
-}, []), i);
+  r.current && e(r.current);
+}, [r]), i);
 o.defaultProps = {
   activeOptionRef: void 0
 };
 o.propTypes = {
-  options: e.array.isRequired
+  options: p.array.isRequired
 };
 export {
   o as ComboboxList

package/dist/Combobox/components.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("../Box/Box.cjs"),n=require("../Flex/Flex.cjs"),i=require("styled-components"),l=require("../themes/utils.cjs"),a=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},t=a(i),s=t.default(n.Flex)`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("styled-components"),i=require("../Box/Box.cjs"),n=require("../Flex/Flex.cjs"),l=require("../themes/utils.cjs"),a=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},t=a(r),s=t.default(n.Flex)`
   position: relative;
   border: 1px solid ${({theme:o,hasError:e})=>e?o.colors.danger600:o.colors.neutral200};
   padding-right: ${({theme:o})=>o.spaces[3]};
@@ -40,7 +40,7 @@
     color: inherit;
     cursor: not-allowed;
   }
-`,p=t.default(r.Box)`
+`,p=t.default(i.Box)`
   width: 100%;
   border: none;
   text-align: left;

package/dist/Combobox/components.js

@@ -1,6 +1,6 @@
+import n from "styled-components";
 import { Box as i } from "../Box/Box.js";
 import { Flex as e } from "../Flex/Flex.js";
-import n from "styled-components";
 import { inputFocusStyle as t } from "../themes/utils.js";
 const c = n(e)`
   position: relative;

package/dist/Combobox/utils.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("compute-scroll-into-view"),o=require("../helpers/keyboardKeys.cjs"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=a(l),t={Close:"Close",CloseSelect:"CloseSelect",First:"First",Last:"Last",Next:"Next",Open:"Open",PageDown:"PageDown",PageUp:"PageUp",Previous:"Previous",Select:"Select",Space:"Space",Type:"Type"},u={Close:"Close",First:"First",Last:"Last",Next:"Next",Open:"Open",Previous:"Previous",Select:"Select",UpLevel:"UpLevel"};function d(e=[],s,r=[]){const n=String(s!=null?s:"").toLowerCase();return n?e.filter(i=>i.props.children.toString().toLowerCase().includes(n)&&r.indexOf(i)<0):e}function p(e,s){if(!s&&e===o.KeyboardKeys.DOWN)return t.Open;if(e===o.KeyboardKeys.DOWN)return t.Next;if(e===o.KeyboardKeys.UP)return t.Previous;if(e===o.KeyboardKeys.HOME)return t.First;if(e===o.KeyboardKeys.END)return t.Last;if(e===o.KeyboardKeys.ESCAPE)return t.Close;if(e===o.KeyboardKeys.ENTER)return t.CloseSelect;if(e===o.KeyboardKeys.BACKSPACE||e===o.KeyboardKeys.CLEAR||e.length===1)return t.Type}function f(e,s,r){switch(r){case t.First:return 0;case t.Last:return s;case t.Previous:return Math.max(0,e-1);case t.Next:return Math.min(s,e+1);default:return e}}function y(e){c.default(e,{scrollMode:"if-needed",block:"nearest",inline:"nearest"}).forEach(({el:r,top:n,left:i})=>{r.scrollTop=n,r.scrollLeft=i})}exports.MenuActions=t;exports.TreeActions=u;exports.filterOptions=d;exports.getActionFromKey=p;exports.getUpdatedIndex=f;exports.maintainScrollVisibility=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("compute-scroll-into-view"),r=require("../helpers/keyboardKeys.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=l(a),t={Close:"Close",CloseSelect:"CloseSelect",First:"First",Last:"Last",Next:"Next",Open:"Open",PageDown:"PageDown",PageUp:"PageUp",Previous:"Previous",Select:"Select",Space:"Space",Type:"Type"},u={Close:"Close",First:"First",Last:"Last",Next:"Next",Open:"Open",Previous:"Previous",Select:"Select",UpLevel:"UpLevel"};function d(e=[],o=null,s=[]){const n=String(o!=null?o:"").toLowerCase();return n?e.filter(i=>i.props.children.toString().toLowerCase().includes(n)&&s.indexOf(i)<0):e}function p(e,o){if(!o&&e===r.KeyboardKeys.DOWN)return t.Open;if(e===r.KeyboardKeys.DOWN)return t.Next;if(e===r.KeyboardKeys.UP)return t.Previous;if(e===r.KeyboardKeys.HOME)return t.First;if(e===r.KeyboardKeys.END)return t.Last;if(e===r.KeyboardKeys.ESCAPE)return t.Close;if(e===r.KeyboardKeys.ENTER)return t.CloseSelect;if(e===r.KeyboardKeys.BACKSPACE||e===r.KeyboardKeys.CLEAR||e.length===1)return t.Type}function f(e,o,s){switch(s){case t.First:return 0;case t.Last:return o;case t.Previous:return Math.max(0,e-1);case t.Next:return Math.min(o,e+1);default:return e}}function y(e){c.default(e,{scrollMode:"if-needed",block:"nearest",inline:"nearest"}).forEach(({el:s,top:n,left:i})=>{s.scrollTop=n,s.scrollLeft=i})}exports.MenuActions=t;exports.TreeActions=u;exports.filterOptions=d;exports.getActionFromKey=p;exports.getUpdatedIndex=f;exports.maintainScrollVisibility=y;

package/dist/Combobox/utils.js

@@ -1,5 +1,5 @@
-import l from "compute-scroll-into-view";
-import { KeyboardKeys as s } from "../helpers/keyboardKeys.js";
+import c from "compute-scroll-into-view";
+import { KeyboardKeys as n } from "../helpers/keyboardKeys.js";
 const t = {
   Close: "Close",
   CloseSelect: "CloseSelect",
@@ -23,30 +23,30 @@ const t = {
   Select: "Select",
   UpLevel: "UpLevel"
 };
-function d(e = [], r, n = []) {
-  const o = String(r != null ? r : "").toLowerCase();
-  return o ? e.filter((i) => i.props.children.toString().toLowerCase().includes(o) && n.indexOf(i) < 0) : e;
+function d(e = [], r = null, o = []) {
+  const s = String(r != null ? r : "").toLowerCase();
+  return s ? e.filter((i) => i.props.children.toString().toLowerCase().includes(s) && o.indexOf(i) < 0) : e;
 }
 function C(e, r) {
-  if (!r && e === s.DOWN)
+  if (!r && e === n.DOWN)
     return t.Open;
-  if (e === s.DOWN)
+  if (e === n.DOWN)
     return t.Next;
-  if (e === s.UP)
+  if (e === n.UP)
     return t.Previous;
-  if (e === s.HOME)
+  if (e === n.HOME)
     return t.First;
-  if (e === s.END)
+  if (e === n.END)
     return t.Last;
-  if (e === s.ESCAPE)
+  if (e === n.ESCAPE)
     return t.Close;
-  if (e === s.ENTER)
+  if (e === n.ENTER)
     return t.CloseSelect;
-  if (e === s.BACKSPACE || e === s.CLEAR || e.length === 1)
+  if (e === n.BACKSPACE || e === n.CLEAR || e.length === 1)
     return t.Type;
 }
-function S(e, r, n) {
-  switch (n) {
+function S(e, r, o) {
+  switch (o) {
     case t.First:
       return 0;
     case t.Last:
@@ -60,12 +60,12 @@ function S(e, r, n) {
   }
 }
 function P(e) {
-  l(e, {
+  c(e, {
     scrollMode: "if-needed",
     block: "nearest",
     inline: "nearest"
-  }).forEach(({ el: n, top: o, left: i }) => {
-    n.scrollTop = o, n.scrollLeft = i;
+  }).forEach(({ el: o, top: s, left: i }) => {
+    o.scrollTop = s, o.scrollLeft = i;
   });
 }
 export {

package/dist/DatePicker/DatePicker.cjs

@@ -1 +1 @@
-"use strict";var W=Object.defineProperty;var i=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable;var P=(e,a,t)=>a in e?W(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,j=(e,a)=>{for(var t in a||(a={}))I.call(a,t)&&P(e,t,a[t]);if(i)for(var t of i(a))_.call(a,t)&&P(e,t,a[t]);return e};var y=(e,a)=>{var t={};for(var r in e)I.call(e,r)&&a.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&i)for(var r of i(e))a.indexOf(r)<0&&_.call(e,r)&&(t[r]=e[r]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),A=require("prop-types"),V=require("@strapi/icons/Calendar"),w=require("@strapi/icons/Cross"),F=require("../themes/sizes.cjs"),G=require("../TextInput/TextInput.cjs"),D=require("./components.cjs"),H=require("./DatePickerCalendar.cjs"),R=require("./utils/formatDate.cjs"),J=require("../helpers/useId.cjs"),K=require("../helpers/getDefaultLocale.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=u(c),n=u(A),N=u(V),Q=u(w),b=U=>{var m=U,{ariaLabel:e,initialDate:a,selectedDate:t,onChange:r,label:d,locale:E,selectedDateLabel:L,onClear:g,clearLabel:T,disabled:o,id:O}=m,x=y(m,["ariaLabel","initialDate","selectedDate","onChange","label","locale","selectedDateLabel","onClear","clearLabel","disabled","id"]);const z=J.useId("datepicker",O),[C,f]=c.useState(!1),s=c.useRef(null),h=c.useRef(null),k=E||K.getDefaultLocale(),q=t?R.formatDate(t,k):"",v=()=>{o||f(p=>!p)},S=()=>{o||(g(),h.current.focus())},B=p=>{r(p),f(!1)},M=()=>{f(!1)};return l.default.createElement(D.DatePickerWrapper,{bold:C},l.default.createElement(G.TextInput,j({ref:s,onClick:v,onChange:()=>{},value:q,startAction:l.default.createElement(D.DatePickerButton,{ref:h,onClick:v,"aria-label":t?L(R.formatDate(t,k)):d,type:"button","aria-disabled":o},l.default.createElement(N.default,{"aria-hidden":!0})),endAction:g&&q?l.default.createElement(D.IconBox,{as:"button",onClick:S,"aria-label":T,"aria-disabled":o},l.default.createElement(Q.default,null)):void 0,"aria-autocomplete":"none",label:d,"aria-label":e,disabled:o,id:z},x)),s.current&&s.current.inputWrapperRef&&C&&l.default.createElement(H.DatePickerCalendar,{selectedDate:t,initialDate:a,onChange:B,onEscape:M,popoverSource:s.current.inputWrapperRef,label:d||e}))};b.defaultProps={ariaLabel:void 0,clearLabel:void 0,disabled:!1,id:void 0,label:void 0,initialDate:new Date,onClear:void 0,placeholder:void 0,selectedDate:void 0,size:"M"};b.propTypes={ariaLabel:n.default.string,clearLabel:n.default.string,disabled:n.default.bool,id:n.default.string,initialDate:n.default.instanceOf(Date),label:n.default.string,locale:n.default.string,maxDate:n.default.instanceOf(Date),minDate:n.default.instanceOf(Date),onChange:n.default.func.isRequired,onClear:n.default.func,placeholder:n.default.string,selectedDate:n.default.instanceOf(Date),selectedDateLabel:n.default.func.isRequired,size:n.default.oneOf(Object.keys(F.sizes.input))};exports.DatePicker=b;
+"use strict";var W=Object.defineProperty;var c=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable;var P=(e,a,t)=>a in e?W(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,j=(e,a)=>{for(var t in a||(a={}))I.call(a,t)&&P(e,t,a[t]);if(c)for(var t of c(a))_.call(a,t)&&P(e,t,a[t]);return e};var y=(e,a)=>{var t={};for(var n in e)I.call(e,n)&&a.indexOf(n)<0&&(t[n]=e[n]);if(e!=null&&c)for(var n of c(e))a.indexOf(n)<0&&_.call(e,n)&&(t[n]=e[n]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react"),A=require("prop-types"),V=require("@strapi/icons/Calendar"),w=require("@strapi/icons/Cross"),F=require("../themes/sizes.cjs"),G=require("../TextInput/TextInput.cjs"),D=require("./components.cjs"),H=require("./DatePickerCalendar.cjs"),R=require("./utils/formatDate.cjs"),J=require("../helpers/useId.cjs"),K=require("../helpers/getDefaultLocale.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=u(i),r=u(A),N=u(V),Q=u(w),g=U=>{var C=U,{ariaLabel:e,initialDate:a,selectedDate:t,onChange:n,label:d,locale:E,selectedDateLabel:T,onClear:b,clearLabel:L,disabled:o,id:x}=C,z=y(C,["ariaLabel","initialDate","selectedDate","onChange","label","locale","selectedDateLabel","onClear","clearLabel","disabled","id"]);const O=J.useId("datepicker",x),[m,f]=i.useState(!1),s=i.useRef(null),v=i.useRef(null),h=E||K.getDefaultLocale(),k=t?R.formatDate(t,h):"",q=()=>{o||f(p=>!p)},S=()=>{o||(b(),v.current.focus())},B=p=>{n(p),f(!1)},M=()=>{f(!1)};return l.default.createElement(D.DatePickerWrapper,{bold:m},l.default.createElement(G.TextInput,j({ref:s,onClick:q,onChange:()=>{},value:k,startAction:l.default.createElement(D.DatePickerButton,{ref:v,onClick:q,"aria-label":t?T(R.formatDate(t,h)):d||e,type:"button","aria-disabled":o},l.default.createElement(N.default,{"aria-hidden":!0})),endAction:b&&k?l.default.createElement(D.IconBox,{as:"button",onClick:S,"aria-label":L,"aria-disabled":o},l.default.createElement(Q.default,null)):void 0,"aria-autocomplete":"none",label:d,"aria-label":e,disabled:o,id:O},z)),s.current&&s.current.inputWrapperRef&&m&&l.default.createElement(H.DatePickerCalendar,{selectedDate:t,initialDate:a,onChange:B,onEscape:M,popoverSource:s.current.inputWrapperRef,label:d||e}))};g.defaultProps={ariaLabel:void 0,clearLabel:void 0,disabled:!1,id:void 0,label:void 0,locale:void 0,initialDate:new Date,onClear:void 0,placeholder:void 0,selectedDate:void 0,size:"M"};g.propTypes={ariaLabel:r.default.string,clearLabel:r.default.string,disabled:r.default.bool,id:r.default.string,initialDate:r.default.instanceOf(Date),label:r.default.string,locale:r.default.string,onChange:r.default.func.isRequired,onClear:r.default.func,placeholder:r.default.string,selectedDate:r.default.instanceOf(Date),selectedDateLabel:r.default.func.isRequired,size:r.default.oneOf(Object.keys(F.sizes.input))};exports.DatePicker=g;