@strapi/design-system 1.6.0 → 1.6.2

package/dist/SimpleMenu/SimpleMenu.js

@@ -110,7 +110,7 @@ const C = ({
   onReachEnd: u,
   ...g
 }) => {
-  const m = T(), R = Y("simplemenu", s), x = T(!1), [d, f] = B(!1), [D, I] = B(0), h = z.toArray(E), A = a || (c === "S" ? oe : $), S = !!u && typeof u == "function";
+  const d = T(), R = Y(s), x = T(!1), [m, f] = B(!1), [D, I] = B(0), h = z.toArray(E), A = a || (c === "S" ? oe : $), S = !!u && typeof u == "function";
   v(() => {
     if (["string", "number"].includes(typeof o)) {
       const n = h.findIndex((r) => r.props.children === o);
@@ -119,12 +119,12 @@ const C = ({
   }, [o]);
   const w = K(l), M = K(P);
   v(() => {
-    x?.current ? d ? w() : M() : x.current = !0;
-  }, [x, M, w, d]), v(() => {
-    t.isValidElement(o) && D === -1 && m.current.focus();
+    x?.current ? m ? w() : M() : x.current = !0;
+  }, [x, M, w, m]), v(() => {
+    t.isValidElement(o) && D === -1 && d.current.focus();
   }, [o, D]);
   const N = (n) => {
-    d && (n.key === i.ESCAPE && (n.stopPropagation(), f(!1), m.current.focus()), n.key === i.DOWN && I((r) => r === h.length - 1 ? 0 : r + 1), n.key === i.UP && I((r) => r === 0 ? h.length - 1 : r - 1));
+    m && (n.key === i.ESCAPE && (n.stopPropagation(), f(!1), d.current.focus()), n.key === i.DOWN && I((r) => r === h.length - 1 ? 0 : r + 1), n.key === i.UP && I((r) => r === 0 ? h.length - 1 : r - 1));
   }, F = (n) => {
     (n.key === i.ENTER || n.key === i.SPACE) && f((r) => !r);
   }, V = (n) => {
@@ -140,7 +140,7 @@ const C = ({
     role: "menuitem"
   }, j(n, {
     onClick() {
-      n.props.onClick(), f(!1), m.current.focus();
+      n.props.onClick(), f(!1), d.current.focus();
     },
     isFocused: D === r
   })));
@@ -149,21 +149,21 @@ const C = ({
   }, /* @__PURE__ */ t.createElement(A, {
     label: t.isValidElement(o) ? null : o,
     "aria-haspopup": !0,
-    "aria-expanded": d,
+    "aria-expanded": m,
     "aria-controls": R,
     onKeyDown: F,
     onMouseDown: q,
-    ref: m,
+    ref: d,
     type: "button",
     variant: "ghost",
     endIcon: /* @__PURE__ */ t.createElement(te, null, /* @__PURE__ */ t.createElement(U, {
       "aria-hidden": !0
     })),
     ...g
-  }, o), d && /* @__PURE__ */ t.createElement(X, {
+  }, o), m && /* @__PURE__ */ t.createElement(X, {
     onBlur: V,
     placement: p,
-    source: m,
+    source: d,
     onReachEnd: W,
     intersectionId: S ? `popover-${R}` : void 0,
     spacing: 4

package/dist/Stack/Stack.cjs

@@ -1,19 +1,19 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),u=require("react"),m=require("styled-components"),o=require("../Flex/Flex.cjs"),i=require("../helpers/theme.cjs"),f=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=f(m),l={size:!0},g=c.default(o.Flex).withConfig({shouldForwardProp:(e,t)=>!l[e]&&t(e)})`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),d=require("react"),m=require("styled-components"),i=require("../Flex/Flex.cjs"),o=require("../helpers/theme.cjs"),f=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=f(m),l={size:!0,spacing:!0},g=c.default(i.Flex).withConfig({shouldForwardProp:(e,t)=>!l[e]&&t(e)})`
   & > * {
     margin-top: 0;
     margin-bottom: 0;
   }
 
   & > * + * {
-    margin-top: ${({theme:e,spacing:t})=>i.extractStyleFromTheme(e.spaces,t,void 0)};
+    margin-top: ${({theme:e,spacing:t})=>o.extractStyleFromTheme(e.spaces,t,void 0)};
   }
-`,h=c.default(o.Flex).withConfig({shouldForwardProp:(e,t)=>!l[e]&&t(e)})`
+`,h=c.default(i.Flex).withConfig({shouldForwardProp:(e,t)=>!l[e]&&t(e)})`
   & > * {
     margin-left: 0;
     margin-right: 0;
   }
 
   & > * + * {
-    margin-left: ${({theme:e,spacing:t})=>i.extractStyleFromTheme(e.spaces,t,void 0)};
+    margin-left: ${({theme:e,spacing:t})=>o.extractStyleFromTheme(e.spaces,t,void 0)};
   }
-`,d=u.forwardRef(({horizontal:e=!1,spacing:t,size:r,...n},a)=>(r&&console.warn('Deprecation warning: Usage of "size" prop in Stack component is deprecated. This is discouraged and will be removed in the next major release. Please use "spacing" instead'),e?s.jsx(h,{ref:a,spacing:t||r,...n}):s.jsx(g,{direction:"column",alignItems:"stretch",ref:a,spacing:t||r,...n})));d.displayName="Stack";exports.Stack=d;
+`,u=d.forwardRef(({horizontal:e=!1,spacing:t,size:r,...n},a)=>(r&&console.warn('Deprecation warning: Usage of "size" prop in Stack component is deprecated. This is discouraged and will be removed in the next major release. Please use "spacing" instead'),e?s.jsx(h,{ref:a,spacing:t||r,...n}):s.jsx(g,{direction:"column",alignItems:"stretch",ref:a,spacing:t||r,...n})));u.displayName="Stack";exports.Stack=u;

package/dist/Stack/Stack.js

@@ -4,7 +4,8 @@ import a from "styled-components";
 import { Flex as s } from "../Flex/Flex.js";
 import { extractStyleFromTheme as m } from "../helpers/theme.js";
 const c = {
-  size: !0
+  size: !0,
+  spacing: !0
 }, f = a(s).withConfig({
   shouldForwardProp: (e, r) => !c[e] && r(e)
 })`
@@ -19,7 +20,7 @@ const c = {
   spacing: r
 }) => m(e.spaces, r, void 0)};
   }
-`, l = a(s).withConfig({
+`, g = a(s).withConfig({
   shouldForwardProp: (e, r) => !c[e] && r(e)
 })`
   & > * {
@@ -33,12 +34,12 @@ const c = {
   spacing: r
 }) => m(e.spaces, r, void 0)};
   }
-`, g = d(({
+`, l = d(({
   horizontal: e = !1,
   spacing: r,
   size: t,
   ...o
-}, i) => (t && console.warn('Deprecation warning: Usage of "size" prop in Stack component is deprecated. This is discouraged and will be removed in the next major release. Please use "spacing" instead'), e ? n(l, {
+}, i) => (t && console.warn('Deprecation warning: Usage of "size" prop in Stack component is deprecated. This is discouraged and will be removed in the next major release. Please use "spacing" instead'), e ? n(g, {
   ref: i,
   spacing: r || t,
   ...o
@@ -49,7 +50,7 @@ const c = {
   spacing: r || t,
   ...o
 })));
-g.displayName = "Stack";
+l.displayName = "Stack";
 export {
-  g as Stack
+  l as Stack
 };

package/dist/SubNav/SubNavHeader.cjs

@@ -1,4 +1,4 @@
 "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react"),C=require("prop-types"),I=require("styled-components"),R=require("@strapi/icons"),_=require("../Flex/Flex.cjs"),D=require("../Typography/Typography.cjs"),P=require("../IconButton/IconButton.cjs"),s=require("../Box/Box.cjs"),F=require("../Divider/Divider.cjs"),K=require("../Searchbar/Searchbar.cjs"),L=require("../Searchbar/SearchForm.cjs"),k=require("../helpers/useId.cjs"),w=require("../helpers/usePrevious.cjs"),O=require("../helpers/keyboardKeys.cjs"),d=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=d(o),r=d(C),H=d(I),h=H.default(F.Divider)`
   width: ${24/16}rem;
   background-color: ${({theme:t})=>t.colors.neutral200};
-`,i=({as:t,label:g,searchLabel:f,searchable:b,onChange:y,value:m,onClear:S,onSubmit:v,id:B})=>{const[n,l]=o.useState(!1),p=w.usePrevious(n),q=k.useId("subnav-searchbar-clear",B),c=o.useRef(),u=o.useRef();o.useEffect(()=>{n&&c.current&&c.current.focus(),p&&!n&&u.current&&u.current.focus()},[n,p]);const E=()=>{l(a=>!a)},j=a=>{S(a),c.current.focus()},T=a=>{a.relatedTarget?.id!==q&&l(!1)},x=a=>{a.key===O.KeyboardKeys.ESCAPE&&l(!1)};return n?e.default.createElement(s.Box,{paddingLeft:4,paddingTop:5,paddingBottom:2,paddingRight:4},e.default.createElement(L.SearchForm,null,e.default.createElement(K.Searchbar,{name:"searchbar",value:m,onChange:y,placeholder:"e.g: strapi-plugin-abcd",onKeyDown:x,ref:c,onBlur:T,onClear:j,onSubmit:v,clearLabel:"Clear",size:"S"},f)),e.default.createElement(s.Box,{paddingLeft:2,paddingTop:4},e.default.createElement(h,null))):e.default.createElement(s.Box,{paddingLeft:6,paddingTop:6,paddingBottom:2,paddingRight:4},e.default.createElement(_.Flex,{justifyContent:"space-between",alignItems:"flex-start"},e.default.createElement(D.Typography,{variant:"beta",as:t},g),b&&e.default.createElement(P.IconButton,{ref:u,onClick:E,label:f,icon:e.default.createElement(R.Search,null)})),e.default.createElement(s.Box,{paddingTop:4},e.default.createElement(h,null)))};i.defaultProps={as:"h2",searchable:!1,onChange(){},onClear(){},onSubmit(){},value:"",searchLabel:"",id:void 0};i.propTypes={as:r.default.string,id:r.default.string,label:r.default.string.isRequired,onChange:r.default.func,onClear:r.default.func,onSubmit:r.default.func,searchLabel:r.default.string,searchable:r.default.bool,value:r.default.string};exports.SubNavHeader=i;
+`,i=({as:t,label:g,searchLabel:f,searchable:y,onChange:b,value:m,onClear:S,onSubmit:v,id:B})=>{const[n,l]=o.useState(!1),p=w.usePrevious(n),q=k.useId(B),c=o.useRef(),u=o.useRef();o.useEffect(()=>{n&&c.current&&c.current.focus(),p&&!n&&u.current&&u.current.focus()},[n,p]);const E=()=>{l(a=>!a)},j=a=>{S(a),c.current.focus()},T=a=>{a.relatedTarget?.id!==q&&l(!1)},x=a=>{a.key===O.KeyboardKeys.ESCAPE&&l(!1)};return n?e.default.createElement(s.Box,{paddingLeft:4,paddingTop:5,paddingBottom:2,paddingRight:4},e.default.createElement(L.SearchForm,null,e.default.createElement(K.Searchbar,{name:"searchbar",value:m,onChange:b,placeholder:"e.g: strapi-plugin-abcd",onKeyDown:x,ref:c,onBlur:T,onClear:j,onSubmit:v,clearLabel:"Clear",size:"S"},f)),e.default.createElement(s.Box,{paddingLeft:2,paddingTop:4},e.default.createElement(h,null))):e.default.createElement(s.Box,{paddingLeft:6,paddingTop:6,paddingBottom:2,paddingRight:4},e.default.createElement(_.Flex,{justifyContent:"space-between",alignItems:"flex-start"},e.default.createElement(D.Typography,{variant:"beta",as:t},g),y&&e.default.createElement(P.IconButton,{ref:u,onClick:E,label:f,icon:e.default.createElement(R.Search,null)})),e.default.createElement(s.Box,{paddingTop:4},e.default.createElement(h,null)))};i.defaultProps={as:"h2",searchable:!1,onChange(){},onClear(){},onSubmit(){},value:"",searchLabel:"",id:void 0};i.propTypes={as:r.default.string,id:r.default.string,label:r.default.string.isRequired,onChange:r.default.func,onClear:r.default.func,onSubmit:r.default.func,searchLabel:r.default.string,searchable:r.default.bool,value:r.default.string};exports.SubNavHeader=i;

package/dist/SubNav/SubNavHeader.js

@@ -15,21 +15,21 @@ import { KeyboardKeys as j } from "../helpers/keyboardKeys.js";
 const d = x(k)`
   width: ${24 / 16}rem;
   background-color: ${({ theme: l }) => l.colors.neutral200};
-`, u = ({ as: l, label: f, searchLabel: s, searchable: g, onChange: h, value: b, onClear: E, onSubmit: S, id: y }) => {
-  const [a, c] = L(!1), m = $(a), C = _("subnav-searchbar-clear", y), o = p(), i = p();
+`, f = ({ as: l, label: u, searchLabel: s, searchable: g, onChange: h, value: b, onClear: E, onSubmit: S, id: y }) => {
+  const [o, i] = L(!1), m = $(o), C = _(y), a = p(), c = p();
   w(() => {
-    a && o.current && o.current.focus(), m && !a && i.current && i.current.focus();
-  }, [a, m]);
+    o && a.current && a.current.focus(), m && !o && c.current && c.current.focus();
+  }, [o, m]);
   const v = () => {
-    c((t) => !t);
+    i((t) => !t);
   }, B = (t) => {
-    E(t), o.current.focus();
+    E(t), a.current.focus();
   }, T = (t) => {
-    t.relatedTarget?.id !== C && c(!1);
+    t.relatedTarget?.id !== C && i(!1);
   }, R = (t) => {
-    t.key === j.ESCAPE && c(!1);
+    t.key === j.ESCAPE && i(!1);
   };
-  return a ? /* @__PURE__ */ e.createElement(n, {
+  return o ? /* @__PURE__ */ e.createElement(n, {
     paddingLeft: 4,
     paddingTop: 5,
     paddingBottom: 2,
@@ -40,7 +40,7 @@ const d = x(k)`
     onChange: h,
     placeholder: "e.g: strapi-plugin-abcd",
     onKeyDown: R,
-    ref: o,
+    ref: a,
     onBlur: T,
     onClear: B,
     onSubmit: S,
@@ -60,8 +60,8 @@ const d = x(k)`
   }, /* @__PURE__ */ e.createElement(K, {
     variant: "beta",
     as: l
-  }, f), g && /* @__PURE__ */ e.createElement(P, {
-    ref: i,
+  }, u), g && /* @__PURE__ */ e.createElement(P, {
+    ref: c,
     onClick: v,
     label: s,
     icon: /* @__PURE__ */ e.createElement(D, null)
@@ -69,7 +69,7 @@ const d = x(k)`
     paddingTop: 4
   }, /* @__PURE__ */ e.createElement(d, null)));
 };
-u.defaultProps = {
+f.defaultProps = {
   as: "h2",
   searchable: !1,
   onChange() {
@@ -82,7 +82,7 @@ u.defaultProps = {
   searchLabel: "",
   id: void 0
 };
-u.propTypes = {
+f.propTypes = {
   as: r.string,
   id: r.string,
   label: r.string.isRequired,
@@ -94,5 +94,5 @@ u.propTypes = {
   value: r.string
 };
 export {
-  u as SubNavHeader
+  f as SubNavHeader
 };

package/dist/SubNav/SubNavLinkSection.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react"),m=require("prop-types"),h=require("styled-components"),x=require("@strapi/icons"),l=require("../Box/Box.cjs"),b=require("../Flex/Flex.cjs"),v=require("../Typography/Typography.cjs"),S=require("../helpers/useId.cjs"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(o),r=d(m),i=d(h),E=i.default(l.Box)`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react"),m=require("prop-types"),h=require("styled-components"),x=require("@strapi/icons"),l=require("../Box/Box.cjs"),b=require("../Flex/Flex.cjs"),S=require("../Typography/Typography.cjs"),v=require("../helpers/useId.cjs"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(o),r=d(m),i=d(h),E=i.default(l.Box)`
   svg {
     height: ${4/16}rem;
     path {
@@ -16,4 +16,4 @@
   align-items: center;
   width: ${12/16}rem;
   transform: rotateX(${({rotated:e})=>e?"0deg":"180deg"});
-`,s=({label:e,children:c,id:p})=>{const[n,f]=o.useState(!0),u=S.useId("subnav-list",p),g=()=>{f(a=>!a)};return t.default.createElement(l.Box,null,t.default.createElement(E,{paddingLeft:7,paddingTop:2,paddingBottom:2,paddingRight:4},t.default.createElement(b.Flex,{justifyContent:"space-between"},t.default.createElement(k,{onClick:g,"aria-expanded":n,"aria-controls":u},t.default.createElement(q,{rotated:n},t.default.createElement(x.CarretDown,{"aria-hidden":!0})),t.default.createElement(l.Box,{paddingLeft:2},t.default.createElement(v.Typography,{as:"span",fontWeight:"semiBold",textColor:"neutral800"},e))))),n&&t.default.createElement("ul",{id:u},o.Children.map(c,(a,y)=>t.default.createElement("li",{key:y},a))))};s.defaultProps={children:void 0,id:void 0};s.propTypes={children:r.default.node,id:r.default.string,label:r.default.string.isRequired};exports.SubNavLinkSection=s;
+`,s=({label:e,children:u,id:p})=>{const[n,f]=o.useState(!0),c=v.useId(p),g=()=>{f(a=>!a)};return t.default.createElement(l.Box,null,t.default.createElement(E,{paddingLeft:7,paddingTop:2,paddingBottom:2,paddingRight:4},t.default.createElement(b.Flex,{justifyContent:"space-between"},t.default.createElement(k,{onClick:g,"aria-expanded":n,"aria-controls":c},t.default.createElement(q,{rotated:n},t.default.createElement(x.CarretDown,{"aria-hidden":!0})),t.default.createElement(l.Box,{paddingLeft:2},t.default.createElement(S.Typography,{as:"span",fontWeight:"semiBold",textColor:"neutral800"},e))))),n&&t.default.createElement("ul",{id:c},o.Children.map(u,(a,y)=>t.default.createElement("li",{key:y},a))))};s.defaultProps={children:void 0,id:void 0};s.propTypes={children:r.default.node,id:r.default.string,label:r.default.string.isRequired};exports.SubNavLinkSection=s;

package/dist/SubNav/SubNavLinkSection.js

@@ -4,8 +4,8 @@ import a from "styled-components";
 import { CarretDown as h } from "@strapi/icons";
 import { Box as i } from "../Box/Box.js";
 import { Flex as E } from "../Flex/Flex.js";
-import { Typography as b } from "../Typography/Typography.js";
-import { useId as y } from "../helpers/useId.js";
+import { Typography as y } from "../Typography/Typography.js";
+import { useId as b } from "../helpers/useId.js";
 const k = a(i)`
   svg {
     height: ${4 / 16}rem;
@@ -24,9 +24,9 @@ const k = a(i)`
   align-items: center;
   width: ${12 / 16}rem;
   transform: rotateX(${({ rotated: t }) => t ? "0deg" : "180deg"});
-`, l = ({ label: t, children: p, id: s }) => {
-  const [r, m] = f(!0), d = y("subnav-list", s), c = () => {
-    m((n) => !n);
+`, l = ({ label: t, children: p, id: m }) => {
+  const [r, s] = f(!0), d = b(m), c = () => {
+    s((n) => !n);
   };
   return /* @__PURE__ */ e.createElement(i, null, /* @__PURE__ */ e.createElement(k, {
     paddingLeft: 7,
@@ -45,7 +45,7 @@ const k = a(i)`
     "aria-hidden": !0
   })), /* @__PURE__ */ e.createElement(i, {
     paddingLeft: 2
-  }, /* @__PURE__ */ e.createElement(b, {
+  }, /* @__PURE__ */ e.createElement(y, {
     as: "span",
     fontWeight: "semiBold",
     textColor: "neutral800"

package/dist/SubNav/SubNavSection.cjs

@@ -5,4 +5,4 @@
       fill: ${({theme:e})=>e.colors.neutral500};
     }
   }
-`,s=({collapsable:e,label:u,badgeLabel:l,children:p,id:f})=>{const[i,g]=n.useState(!0),d=B.useId("subnav-list",f),S=()=>{g(o=>!o)};return t.default.createElement(k.Stack,{spacing:1},t.default.createElement(_,{paddingLeft:6,paddingTop:1,paddingBottom:1,paddingRight:4},t.default.createElement(c.Box,{position:"relative",paddingRight:l?6:0},t.default.createElement(y.SubNavSectionLabel,{onClick:S,ariaExpanded:i,ariaControls:d,collapsable:e,label:u}),l&&t.default.createElement(h.Badge,{backgroundColor:"neutral150",textColor:"neutral600",position:"absolute",right:0,top:"50%",transform:"translateY(-50%)"},l))),(!e||i)&&t.default.createElement("ol",{id:d},n.Children.map(p,(o,b)=>t.default.createElement("li",{key:b},o))))};s.defaultProps={badgeLabel:null,children:void 0,collapsable:!1,id:void 0};s.propTypes={badgeLabel:a.default.string,children:a.default.node,collapsable:a.default.bool,id:a.default.string,label:a.default.string.isRequired};exports.SubNavSection=s;
+`,s=({collapsable:e,label:u,badgeLabel:o,children:p,id:f})=>{const[d,g]=n.useState(!0),i=B.useId(f),S=()=>{g(l=>!l)};return t.default.createElement(k.Stack,{spacing:1},t.default.createElement(_,{paddingLeft:6,paddingTop:1,paddingBottom:1,paddingRight:4},t.default.createElement(c.Box,{position:"relative",paddingRight:o?6:0},t.default.createElement(y.SubNavSectionLabel,{onClick:S,ariaExpanded:d,ariaControls:i,collapsable:e,label:u}),o&&t.default.createElement(h.Badge,{backgroundColor:"neutral150",textColor:"neutral600",position:"absolute",right:0,top:"50%",transform:"translateY(-50%)"},o))),(!e||d)&&t.default.createElement("ol",{id:i},n.Children.map(p,(l,b)=>t.default.createElement("li",{key:b},l))))};s.defaultProps={badgeLabel:null,children:void 0,collapsable:!1,id:void 0};s.propTypes={badgeLabel:a.default.string,children:a.default.node,collapsable:a.default.bool,id:a.default.string,label:a.default.string.isRequired};exports.SubNavSection=s;

package/dist/SubNav/SubNavSection.js

@@ -1,20 +1,20 @@
-import e, { useState as f, Children as b } from "react";
+import e, { useState as f, Children as h } from "react";
 import t from "prop-types";
-import h from "styled-components";
+import b from "styled-components";
 import { Box as l } from "../Box/Box.js";
-import { Badge as v } from "../Badge/Badge.js";
-import { SubNavSectionLabel as E } from "./SubNavSectionLabel.js";
-import { useId as S } from "../helpers/useId.js";
+import { Badge as E } from "../Badge/Badge.js";
+import { SubNavSectionLabel as S } from "./SubNavSectionLabel.js";
+import { useId as v } from "../helpers/useId.js";
 import { Stack as k } from "../Stack/Stack.js";
-const C = h(l)`
+const C = b(l)`
   svg {
     height: ${4 / 16}rem;
     path {
       fill: ${({ theme: r }) => r.colors.neutral500};
     }
   }
-`, p = ({ collapsable: r, label: s, badgeLabel: o, children: d, id: m }) => {
-  const [n, c] = f(!0), a = S("subnav-list", m), u = () => {
+`, p = ({ collapsable: r, label: d, badgeLabel: o, children: s, id: m }) => {
+  const [n, c] = f(!0), a = v(m), u = () => {
     c((i) => !i);
   };
   return /* @__PURE__ */ e.createElement(k, {
@@ -27,13 +27,13 @@ const C = h(l)`
   }, /* @__PURE__ */ e.createElement(l, {
     position: "relative",
     paddingRight: o ? 6 : 0
-  }, /* @__PURE__ */ e.createElement(E, {
+  }, /* @__PURE__ */ e.createElement(S, {
     onClick: u,
     ariaExpanded: n,
     ariaControls: a,
     collapsable: r,
-    label: s
-  }), o && /* @__PURE__ */ e.createElement(v, {
+    label: d
+  }), o && /* @__PURE__ */ e.createElement(E, {
     backgroundColor: "neutral150",
     textColor: "neutral600",
     position: "absolute",
@@ -42,7 +42,7 @@ const C = h(l)`
     transform: "translateY(-50%)"
   }, o))), (!r || n) && /* @__PURE__ */ e.createElement("ol", {
     id: a
-  }, b.map(d, (i, g) => /* @__PURE__ */ e.createElement("li", {
+  }, h.map(s, (i, g) => /* @__PURE__ */ e.createElement("li", {
     key: g
   }, i))));
 };

package/dist/Table/Table.cjs

@@ -5,8 +5,6 @@
   width: 100%;
   white-space: nowrap;
 `,m=l.default(d.Box)`
-  position: relative;
-
   &:before {
     // TODO: make sure to add a token for this weird stuff
     background: linear-gradient(90deg, #c0c0cf 0%, rgba(0, 0, 0, 0) 100%);
@@ -33,4 +31,4 @@
   }
 `,S=l.default(d.Box)`
   overflow-x: auto;
-`,i=({colCount:e,rowCount:u,footer:f,...h})=>{const s=r.useRef(null),[b,o]=r.useState(),p=t=>{const g=t.target.scrollWidth-t.target.clientWidth;if(t.target.scrollLeft===0){o("right");return}if(t.target.scrollLeft===g){o("left");return}t.target.scrollLeft>0&&o("both")};return r.useEffect(()=>{s.current.scrollWidth>s.current.clientWidth&&o("right")},[]),a.default.createElement(y,{shadow:"tableShadow",hasRadius:!0,background:"neutral0"},a.default.createElement(m,{overflowing:b},a.default.createElement(S,{ref:s,onScroll:p,paddingLeft:6,paddingRight:6},a.default.createElement(R,{colCount:e,rowCount:u,...h}))),f)};i.defaultProps={footer:void 0};i.propTypes={colCount:n.default.number.isRequired,footer:n.default.node,rowCount:n.default.number.isRequired};exports.Table=i;
+`,i=({colCount:e,rowCount:u,footer:f,...h})=>{const s=r.useRef(null),[b,o]=r.useState(),p=t=>{const g=t.target.scrollWidth-t.target.clientWidth;if(t.target.scrollLeft===0){o("right");return}if(t.target.scrollLeft===g){o("left");return}t.target.scrollLeft>0&&o("both")};return r.useEffect(()=>{s.current.scrollWidth>s.current.clientWidth&&o("right")},[]),a.default.createElement(y,{shadow:"tableShadow",hasRadius:!0,background:"neutral0"},a.default.createElement(m,{overflowing:b,position:"relative"},a.default.createElement(S,{ref:s,onScroll:p,paddingLeft:6,paddingRight:6},a.default.createElement(R,{colCount:e,rowCount:u,...h}))),f)};i.defaultProps={footer:void 0};i.propTypes={colCount:n.default.number.isRequired,footer:n.default.node,rowCount:n.default.number.isRequired};exports.Table=i;

package/dist/Table/Table.js

@@ -10,8 +10,6 @@ const T = a(n)`
   width: 100%;
   white-space: nowrap;
 `, R = a(n)`
-  position: relative;
-
   &:before {
     // TODO: make sure to add a token for this weird stuff
     background: linear-gradient(90deg, #c0c0cf 0%, rgba(0, 0, 0, 0) 100%);
@@ -58,7 +56,8 @@ const T = a(n)`
     hasRadius: !0,
     background: "neutral0"
   }, /* @__PURE__ */ r.createElement(R, {
-    overflowing: h
+    overflowing: h,
+    position: "relative"
   }, /* @__PURE__ */ r.createElement(S, {
     ref: i,
     onScroll: u,

package/dist/Tabs/TabGroup.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),I=require("prop-types"),g=require("./TabsContext.cjs"),h=require("../helpers/useId.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},u=c(a),t=c(I),d=a.forwardRef(({id:e,initialSelectedTabIndex:n,label:p,onTabChange:f,variant:b,...i},T)=>{const v=h.useId("tabgroup",e),o=a.Children.toArray(i.children).find(s=>s.type.displayName==="Tabs");let r=n||0;o&&n===void 0&&(r=o.props.children.findIndex(s=>!s.props.disabled));const[y,l]=a.useState(r===-1?0:r);return a.useImperativeHandle(T,()=>({_handlers:{setSelectedTabIndex:l}})),u.default.createElement(g.TabsContext.Provider,{value:{id:v,selectedTabIndex:y,selectTabIndex:l,label:p,variant:b,onTabChange:f}},u.default.createElement("div",{...i}))});d.displayName="TabGroup";d.defaultProps={id:void 0,initialSelectedTabIndex:void 0,onTabChange(){},variant:void 0};d.propTypes={children:t.default.node.isRequired,id:t.default.string,initialSelectedTabIndex:t.default.number,label:t.default.string.isRequired,onTabChange:t.default.func,variant:t.default.oneOf(["simple"])};exports.TabGroup=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),I=require("prop-types"),h=require("./TabsContext.cjs"),m=require("../helpers/useId.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},u=c(a),t=c(I),d=a.forwardRef(({id:e,initialSelectedTabIndex:n,label:p,onTabChange:f,variant:b,...i},T)=>{const v=m.useId(e),l=a.Children.toArray(i.children).find(s=>s.type.displayName==="Tabs");let r=n||0;l&&n===void 0&&(r=l.props.children.findIndex(s=>!s.props.disabled));const[y,o]=a.useState(r===-1?0:r);return a.useImperativeHandle(T,()=>({_handlers:{setSelectedTabIndex:o}})),u.default.createElement(h.TabsContext.Provider,{value:{id:v,selectedTabIndex:y,selectTabIndex:o,label:p,variant:b,onTabChange:f}},u.default.createElement("div",{...i}))});d.displayName="TabGroup";d.defaultProps={id:void 0,initialSelectedTabIndex:void 0,onTabChange(){},variant:void 0};d.propTypes={children:t.default.node.isRequired,id:t.default.string,initialSelectedTabIndex:t.default.number,label:t.default.string.isRequired,onTabChange:t.default.func,variant:t.default.oneOf(["simple"])};exports.TabGroup=d;

package/dist/Tabs/TabGroup.js

@@ -1,29 +1,29 @@
-import s, { forwardRef as T, Children as v, useState as I, useImperativeHandle as h } from "react";
+import s, { forwardRef as u, Children as v, useState as I, useImperativeHandle as h } from "react";
 import e from "prop-types";
 import { TabsContext as x } from "./TabsContext.js";
 import { useId as y } from "../helpers/useId.js";
-const t = T(({ id: l, initialSelectedTabIndex: d, label: p, onTabChange: b, variant: c, ...i }, m) => {
-  const f = y("tabgroup", l), n = v.toArray(i.children).find((a) => a.type.displayName === "Tabs");
-  let r = d || 0;
-  n && d === void 0 && (r = n.props.children.findIndex((a) => !a.props.disabled));
-  const [u, o] = I(r === -1 ? 0 : r);
+const d = u(({ id: l, initialSelectedTabIndex: t, label: p, onTabChange: b, variant: c, ...i }, m) => {
+  const f = y(l), n = v.toArray(i.children).find((a) => a.type.displayName === "Tabs");
+  let r = t || 0;
+  n && t === void 0 && (r = n.props.children.findIndex((a) => !a.props.disabled));
+  const [T, o] = I(r === -1 ? 0 : r);
   return h(m, () => ({
     _handlers: { setSelectedTabIndex: o }
   })), /* @__PURE__ */ s.createElement(x.Provider, {
-    value: { id: f, selectedTabIndex: u, selectTabIndex: o, label: p, variant: c, onTabChange: b }
+    value: { id: f, selectedTabIndex: T, selectTabIndex: o, label: p, variant: c, onTabChange: b }
   }, /* @__PURE__ */ s.createElement("div", {
     ...i
   }));
 });
-t.displayName = "TabGroup";
-t.defaultProps = {
+d.displayName = "TabGroup";
+d.defaultProps = {
   id: void 0,
   initialSelectedTabIndex: void 0,
   onTabChange() {
   },
   variant: void 0
 };
-t.propTypes = {
+d.propTypes = {
   children: e.node.isRequired,
   id: e.string,
   initialSelectedTabIndex: e.number,
@@ -32,5 +32,5 @@ t.propTypes = {
   variant: e.oneOf(["simple"])
 };
 export {
-  t as TabGroup
+  d as TabGroup
 };

package/dist/TextInput/TextInput.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react"),v=require("prop-types"),y=require("../Field/Field.cjs"),I=require("../Field/FieldLabel.cjs"),g=require("../Field/FieldInput.cjs"),E=require("../Field/FieldHint.cjs"),T=require("../Field/FieldError.cjs");require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const A=require("../Stack/Stack.cjs"),_=require("../themes/sizes.cjs"),h=require("../helpers/useId.cjs"),o=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},t=o(d),e=o(v),i=t.default.forwardRef(({size:l,startAction:s,endAction:c,name:f,hint:p,error:F,label:r,labelAction:b,id:m,required:q,...a},n)=>{const j=h.useId("textinput",m),u=d.useRef(null);if(!r&&!a["aria-label"])throw new Error('The TextInput component needs a "label" or an "aria-label" props');return d.useImperativeHandle(n,()=>({inputWrapperRef:u})),t.default.createElement("div",{ref:u},t.default.createElement(y.Field,{name:f,hint:p,error:F,id:j,required:q},t.default.createElement(A.Stack,{spacing:1},r&&t.default.createElement(I.FieldLabel,{action:b},r),t.default.createElement(g.FieldInput,{size:l,ref:n,startAction:s,endAction:c,...a}),t.default.createElement(E.FieldHint,null),t.default.createElement(T.FieldError,null))))});i.displayName="TextInput";i.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,startAction:void 0,size:"M",endAction:void 0,required:!1};i.propTypes={"aria-label":e.default.string,endAction:e.default.element,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.string,label:e.default.string,labelAction:e.default.element,name:e.default.string.isRequired,required:e.default.bool,size:e.default.oneOf(Object.keys(_.sizes.input)),startAction:e.default.element};exports.TextInput=i;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react"),v=require("prop-types"),y=require("../Field/Field.cjs"),I=require("../Field/FieldLabel.cjs"),g=require("../Field/FieldInput.cjs"),E=require("../Field/FieldHint.cjs"),T=require("../Field/FieldError.cjs");require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const A=require("../Stack/Stack.cjs"),_=require("../themes/sizes.cjs"),h=require("../helpers/useId.cjs"),o=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},t=o(d),e=o(v),i=t.default.forwardRef(({size:l,startAction:s,endAction:c,name:f,hint:p,error:F,label:r,labelAction:b,id:m,required:q,...a},n)=>{const j=h.useId(m),u=d.useRef(null);if(!r&&!a["aria-label"])throw new Error('The TextInput component needs a "label" or an "aria-label" props');return d.useImperativeHandle(n,()=>({inputWrapperRef:u})),t.default.createElement("div",{ref:u},t.default.createElement(y.Field,{name:f,hint:p,error:F,id:j,required:q},t.default.createElement(A.Stack,{spacing:1},r&&t.default.createElement(I.FieldLabel,{action:b},r),t.default.createElement(g.FieldInput,{size:l,ref:n,startAction:s,endAction:c,...a}),t.default.createElement(E.FieldHint,null),t.default.createElement(T.FieldError,null))))});i.displayName="TextInput";i.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,startAction:void 0,size:"M",endAction:void 0,required:!1};i.propTypes={"aria-label":e.default.string,endAction:e.default.element,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.string,label:e.default.string,labelAction:e.default.element,name:e.default.string.isRequired,required:e.default.bool,size:e.default.oneOf(Object.keys(_.sizes.input)),startAction:e.default.element};exports.TextInput=i;

package/dist/TextInput/TextInput.js

@@ -1,41 +1,41 @@
-import t, { useRef as E, useImperativeHandle as g } from "react";
+import r, { useRef as E, useImperativeHandle as g } from "react";
 import e from "prop-types";
 import { Field as T } from "../Field/Field.js";
 import { FieldLabel as y } from "../Field/FieldLabel.js";
 import { FieldInput as I } from "../Field/FieldInput.js";
 import { FieldHint as A } from "../Field/FieldHint.js";
-import { FieldError as x } from "../Field/FieldError.js";
+import { FieldError as F } from "../Field/FieldError.js";
 import "../Field/FieldContext.js";
 import "../Field/FieldAction.js";
-import { Stack as F } from "../Stack/Stack.js";
-import { sizes as O } from "../themes/sizes.js";
-import { useId as R } from "../helpers/useId.js";
-const i = t.forwardRef(
-  ({ size: l, startAction: m, endAction: p, name: d, hint: s, error: c, label: r, labelAction: f, id: u, required: b, ...o }, n) => {
-    const v = R("textinput", u), a = E(null);
-    if (!r && !o["aria-label"])
+import { Stack as O } from "../Stack/Stack.js";
+import { sizes as R } from "../themes/sizes.js";
+import { useId as h } from "../helpers/useId.js";
+const i = r.forwardRef(
+  ({ size: l, startAction: m, endAction: d, name: p, hint: s, error: c, label: t, labelAction: f, id: u, required: b, ...o }, n) => {
+    const v = h(u), a = E(null);
+    if (!t && !o["aria-label"])
       throw new Error('The TextInput component needs a "label" or an "aria-label" props');
     return g(n, () => ({
       inputWrapperRef: a
-    })), /* @__PURE__ */ t.createElement("div", {
+    })), /* @__PURE__ */ r.createElement("div", {
       ref: a
-    }, /* @__PURE__ */ t.createElement(T, {
-      name: d,
+    }, /* @__PURE__ */ r.createElement(T, {
+      name: p,
       hint: s,
       error: c,
       id: v,
       required: b
-    }, /* @__PURE__ */ t.createElement(F, {
+    }, /* @__PURE__ */ r.createElement(O, {
       spacing: 1
-    }, r && /* @__PURE__ */ t.createElement(y, {
+    }, t && /* @__PURE__ */ r.createElement(y, {
       action: f
-    }, r), /* @__PURE__ */ t.createElement(I, {
+    }, t), /* @__PURE__ */ r.createElement(I, {
       size: l,
       ref: n,
       startAction: m,
-      endAction: p,
+      endAction: d,
       ...o
-    }), /* @__PURE__ */ t.createElement(A, null), /* @__PURE__ */ t.createElement(x, null))));
+    }), /* @__PURE__ */ r.createElement(A, null), /* @__PURE__ */ r.createElement(F, null))));
   }
 );
 i.displayName = "TextInput";
@@ -61,7 +61,7 @@ i.propTypes = {
   labelAction: e.element,
   name: e.string.isRequired,
   required: e.bool,
-  size: e.oneOf(Object.keys(O.input)),
+  size: e.oneOf(Object.keys(R.input)),
   startAction: e.element
 };
 export {

package/dist/Textarea/Textarea.cjs

@@ -12,4 +12,4 @@
     color: ${({theme:t})=>t.colors.neutral500};
     opacity: 1;
   }
-`,r=l.default.forwardRef(({name:t,hint:d,error:n,label:i,children:u,labelAction:o,id:s,required:c,...f},p)=>{const F=E.useId("textarea",s);return l.default.createElement(I,null,l.default.createElement(g.Field,{name:t,hint:d,error:n,id:F,required:c},l.default.createElement(b.Stack,{spacing:1},i&&l.default.createElement(v.Flex,null,l.default.createElement(x.FieldLabel,{action:o},i)),l.default.createElement(T.TextareaInput,{ref:p,as:"textarea",value:u,...f}),l.default.createElement(y.FieldHint,null),l.default.createElement(j.FieldError,null))))});r.displayName="Textarea";r.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,children:"",required:!1};r.propTypes={"aria-label":e.default.string,children:e.default.string,error:e.default.string,hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.string,label:e.default.string,labelAction:e.default.element,name:e.default.string.isRequired,required:e.default.bool};exports.Textarea=r;
+`,r=l.default.forwardRef(({name:t,hint:d,error:n,label:i,children:u,labelAction:o,id:s,required:c,...f},p)=>{const F=E.useId(s);return l.default.createElement(I,null,l.default.createElement(g.Field,{name:t,hint:d,error:n,id:F,required:c},l.default.createElement(b.Stack,{spacing:1},i&&l.default.createElement(v.Flex,null,l.default.createElement(x.FieldLabel,{action:o},i)),l.default.createElement(T.TextareaInput,{ref:p,as:"textarea",value:u,...f}),l.default.createElement(y.FieldHint,null),l.default.createElement(j.FieldError,null))))});r.displayName="Textarea";r.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,children:"",required:!1};r.propTypes={"aria-label":e.default.string,children:e.default.string,error:e.default.string,hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.string,label:e.default.string,labelAction:e.default.element,name:e.default.string.isRequired,required:e.default.bool};exports.Textarea=r;

package/dist/Textarea/Textarea.js

@@ -28,7 +28,7 @@ const F = h.div`
   }
 `, i = r.forwardRef(
   ({ name: t, hint: a, error: l, label: o, children: n, labelAction: m, id: d, required: p, ...c }, s) => {
-    const f = y("textarea", d);
+    const f = y(d);
     return /* @__PURE__ */ r.createElement(F, null, /* @__PURE__ */ r.createElement(u, {
       name: t,
       hint: a,

package/dist/TimePicker/TimePicker.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const I=require("react"),P=require("prop-types"),z=require("@strapi/icons"),E=require("styled-components"),R=require("../themes/sizes.cjs"),L=require("../Select/Select.cjs"),w=require("../Select/Option.cjs");require("../Select/OptGroup.cjs");require("../Select/MultiSelectNested.cjs");require("../Select/SelectList.cjs");const B=require("../helpers/useId.cjs"),d=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},n=d(I),e=d(P),x=d(E),D=x.default.div`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const P=require("react"),k=require("prop-types"),z=require("@strapi/icons"),E=require("styled-components"),R=require("../themes/sizes.cjs"),L=require("../Select/Select.cjs"),w=require("../Select/Option.cjs");require("../Select/OptGroup.cjs");require("../Select/MultiSelectNested.cjs");require("../Select/SelectList.cjs");const B=require("../helpers/useId.cjs"),d=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},n=d(P),e=d(k),x=d(E),D=x.default.div`
   display: flex;
   align-items: center;
   svg {
@@ -9,4 +9,4 @@
   svg path {
     fill: ${({theme:l})=>l.colors.neutral500};
   }
-`,c=({disabled:l,error:p,hint:m,id:b,onClear:y,onChange:h,value:i,clearLabel:g,label:q,required:v,selectButtonTitle:O,step:T,size:S,...j})=>{const M=B.useId("timepicker",b),_=24,s=[];let r=0;for(let t=0;t<_;t++)for(r=0;r<60;)s.push(`${t<10?`0${t}`:t}:${r<10?`0${r}`:r}`),r+=T;const $=()=>{const t=i.split(":")[0],f=i.split(":")[1],k=s.reduce((u,o)=>{const a=o.split(":")[0];return Math.abs(a-t)<Math.abs(u-t)?a:u},s[0].split(":")[0]),C=s.reduce((u,o)=>{const a=o.split(":")[1];return Math.abs(a-f)<Math.abs(u-f)?a:u},s[0].split(":")[1]);return`${k}:${C}`};return n.default.createElement(L.Select,{id:M,label:q,placeholder:"--:--",hint:m,onClear:y,clearLabel:g,error:p,value:i?$():null,size:S,onChange:h,disabled:l,required:v,selectButtonTitle:O,startIcon:n.default.createElement(D,null,n.default.createElement(z.Clock,null)),...j},s.map(t=>n.default.createElement(w.Option,{value:t,key:t},t)))};c.defaultProps={disabled:!1,error:void 0,hint:void 0,id:void 0,label:void 0,onClear:void 0,required:!1,size:"M",selectButtonTitle:void 0,step:15,value:void 0};c.propTypes={clearLabel:e.default.string.isRequired,disabled:e.default.bool,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.oneOfType([e.default.string,e.default.number]),label:e.default.string,onChange:e.default.func.isRequired,onClear:e.default.func,required:e.default.bool,selectButtonTitle:e.default.string,size:e.default.oneOf(Object.keys(R.sizes.input)),step:e.default.number,value:e.default.oneOfType([e.default.arrayOf(e.default.oneOfType([e.default.string,e.default.number])),e.default.string,e.default.number])};exports.TimePicker=c;
+`,c=({disabled:l,error:p,hint:b,id:m,onClear:y,onChange:h,value:o,clearLabel:g,label:q,required:v,selectButtonTitle:O,step:T,size:S,...j})=>{const M=B.useId(m),_=24,s=[];let u=0;for(let t=0;t<_;t++)for(u=0;u<60;)s.push(`${t<10?`0${t}`:t}:${u<10?`0${u}`:u}`),u+=T;const $=()=>{const t=o.split(":")[0],f=o.split(":")[1],C=s.reduce((r,i)=>{const a=i.split(":")[0];return Math.abs(a-t)<Math.abs(r-t)?a:r},s[0].split(":")[0]),I=s.reduce((r,i)=>{const a=i.split(":")[1];return Math.abs(a-f)<Math.abs(r-f)?a:r},s[0].split(":")[1]);return`${C}:${I}`};return n.default.createElement(L.Select,{id:M,label:q,placeholder:"--:--",hint:b,onClear:y,clearLabel:g,error:p,value:o?$():null,size:S,onChange:h,disabled:l,required:v,selectButtonTitle:O,startIcon:n.default.createElement(D,null,n.default.createElement(z.Clock,null)),...j},s.map(t=>n.default.createElement(w.Option,{value:t,key:t},t)))};c.defaultProps={disabled:!1,error:void 0,hint:void 0,id:void 0,label:void 0,onClear:void 0,required:!1,size:"M",selectButtonTitle:void 0,step:15,value:void 0};c.propTypes={clearLabel:e.default.string.isRequired,disabled:e.default.bool,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.oneOfType([e.default.string,e.default.number]),label:e.default.string,onChange:e.default.func.isRequired,onClear:e.default.func,required:e.default.bool,selectButtonTitle:e.default.string,size:e.default.oneOf(Object.keys(R.sizes.input)),step:e.default.number,value:e.default.oneOfType([e.default.arrayOf(e.default.oneOfType([e.default.string,e.default.number])),e.default.string,e.default.number])};exports.TimePicker=c;

package/dist/TimePicker/TimePicker.js

@@ -36,7 +36,7 @@ const _ = P.div`
   size: $,
   ...C
 }) => {
-  const M = B("timepicker", f), k = 24, r = [];
+  const M = B(f), k = 24, r = [];
   let o = 0;
   for (let t = 0; t < k; t++)
     for (o = 0; o < 60; )

package/dist/ToggleCheckbox/ToggleCheckbox.cjs

@@ -1,16 +1,16 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("react"),T=require("prop-types"),w=require("styled-components"),v=require("../themes/sizes.cjs"),k=require("../themes/utils.cjs"),p=require("../Typography/Typography.cjs"),R=require("../VisuallyHidden/VisuallyHidden.cjs"),L=require("../Box/Box.cjs");require("../Field/Field.cjs");require("../Field/FieldLabel.cjs");require("../Field/FieldInput.cjs");const _=require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const E=require("../Flex/Flex.cjs"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=d(m),o=d(T),i=d(w),$=i.default.label`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const k=require("react"),R=require("prop-types"),$=require("styled-components"),L=require("../themes/sizes.cjs"),_=require("../themes/utils.cjs"),g=require("../Typography/Typography.cjs"),E=require("../VisuallyHidden/VisuallyHidden.cjs"),z=require("../Box/Box.cjs");require("../Field/Field.cjs");require("../Field/FieldLabel.cjs");require("../Field/FieldInput.cjs");const B=require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const S=require("../Flex/Flex.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=c(k),o=c(R),i=c($),V=i.default.label`
   position: relative;
   display: inline-block;
   z-index: 0;
   width: 100%;
-`,z=i.default(L.Box)`
+`,W=i.default(z.Box)`
   cursor: ${({disabled:e})=>e?"not-allowed":void 0};
   // Masks the background of each value
   overflow: hidden;
   flex-wrap: wrap;
 
-  ${k.inputFocusStyle()}
-`,f=i.default(E.Flex).attrs({hasRadius:!0})`
+  ${_.inputFocusStyle()}
+`,h=i.default(S.Flex).attrs({hasRadius:!0})`
   background-color: ${({theme:e,checked:n,disabled:a})=>n?a?e.colors.neutral200:e.colors.neutral0:"transparent"};
   border: 1px solid
     ${({theme:e,checked:n,disabled:a})=>n&&n!==null?a?e.colors.neutral300:e.colors.neutral200:a?e.colors.neutral150:e.colors.neutral100};
@@ -25,7 +25,7 @@
   */
   padding-top: ${({size:e})=>`${e==="S"?"2px":"6px"}`};
   padding-bottom: ${({size:e})=>`${e==="S"?"2px":"6px"}`};
-`,B=i.default.input`
+`,H=i.default.input`
   height: 100%;
   left: 0;
   opacity: 0;
@@ -33,4 +33,4 @@
   top: 0;
   z-index: 1;
   width: 100%;
-`,u=l.default.forwardRef(({size:e,onLabel:n,offLabel:a,children:g,checked:t,disabled:r,onChange:h,...x},y)=>{const{name:b,required:C}=_.useField(),c="neutral600";let q=!t&&t!==null?"danger700":c,F=t?"primary600":c;const j=s=>{r||h(s)};return l.default.createElement($,null,l.default.createElement(R.VisuallyHidden,null,g),l.default.createElement(z,{hasRadius:!0,disabled:r,padding:1,display:"flex",background:r?"neutral150":"neutral100",borderStyle:"solid",borderWidth:"1px",borderColor:"neutral200"},l.default.createElement(f,{size:e,paddingLeft:3,paddingRight:3,justifyContent:"center",alignItems:"center","aria-hidden":!0,checked:t===null?!1:!t,disabled:r},l.default.createElement(p.Typography,{variant:"pi",fontWeight:"bold",textTransform:"uppercase",textColor:r?"neutral700":q},a)),l.default.createElement(f,{size:e,paddingLeft:3,paddingRight:3,justifyContent:"center",alignItems:"center","aria-hidden":!0,checked:t===null?!1:t,disabled:r},l.default.createElement(p.Typography,{variant:"pi",fontWeight:"bold",textTransform:"uppercase",textColor:r?"neutral700":F},n)),l.default.createElement(B,{type:"checkbox","aria-disabled":r,onChange:s=>j(s),name:b,ref:y,"aria-required":C,...x,checked:!(t===null||!t)})))});u.displayName="ToggleCheckbox";u.defaultProps={disabled:!1,checked:!1,onChange:void 0,size:"M"};u.propTypes={checked:o.default.bool,children:o.default.string.isRequired,disabled:o.default.bool,offLabel:o.default.string.isRequired,onChange:o.default.func,onLabel:o.default.string.isRequired,size:o.default.oneOf(Object.keys(v.sizes.input))};exports.ToggleCheckbox=u;
+`,u=r.default.forwardRef(({size:e,onLabel:n,offLabel:a,children:y,checked:t,disabled:l,onChange:x,...b},C)=>{const{error:q,hint:F,id:p,name:j,required:m}=B.useField(),f="neutral600";let T=!t&&t!==null?"danger700":f,w=t?"primary600":f;const v=d=>{l||x(d)};let s;return q?s=`${p}-error`:F&&(s=`${p}-hint`),r.default.createElement(V,null,r.default.createElement(E.VisuallyHidden,null,y),r.default.createElement(W,{hasRadius:!0,disabled:l,padding:1,display:"flex",background:l?"neutral150":"neutral100",borderStyle:"solid",borderWidth:"1px",borderColor:"neutral200"},r.default.createElement(h,{size:e,paddingLeft:3,paddingRight:3,justifyContent:"center",alignItems:"center","aria-hidden":!0,checked:t===null?!1:!t,disabled:l},r.default.createElement(g.Typography,{variant:"pi",fontWeight:"bold",textTransform:"uppercase",textColor:l?"neutral700":T},a)),r.default.createElement(h,{size:e,paddingLeft:3,paddingRight:3,justifyContent:"center",alignItems:"center","aria-hidden":!0,checked:t===null?!1:t,disabled:l},r.default.createElement(g.Typography,{variant:"pi",fontWeight:"bold",textTransform:"uppercase",textColor:l?"neutral700":w},n)),r.default.createElement(H,{type:"checkbox","aria-disabled":l,"aria-describedby":s,onChange:d=>v(d),name:j,ref:C,"aria-required":m,...b,checked:!(t===null||!t)})))});u.displayName="ToggleCheckbox";u.defaultProps={disabled:!1,checked:!1,onChange:void 0,size:"M"};u.propTypes={checked:o.default.bool,children:o.default.string.isRequired,disabled:o.default.bool,offLabel:o.default.string.isRequired,onChange:o.default.func,onLabel:o.default.string.isRequired,size:o.default.oneOf(Object.keys(L.sizes.input))};exports.ToggleCheckbox=u;