@strapi/design-system 1.7.6 → 1.7.8

package/dist/Layout/TwoColsLayout.js

@@ -1,17 +1,8 @@
-import { jsxs as s, jsx as r } from "react/jsx-runtime";
-import "react";
-import o from "prop-types";
-import { Grid as a } from "../Grid/Grid.js";
-import { GridItem as e } from "../Grid/GridItem.js";
-import { Box as d } from "../Box/Box.js";
-const l = ({ startCol: i, endCol: t }) => /* @__PURE__ */ s(a, { gap: 4, children: [
-  /* @__PURE__ */ r(e, { col: 9, s: 12, children: /* @__PURE__ */ r(d, { hasRadius: !0, background: "neutral0", shadow: "tableShadow", children: i }) }),
-  /* @__PURE__ */ r(e, { col: 3, s: 12, children: /* @__PURE__ */ r(d, { hasRadius: !0, background: "neutral0", shadow: "tableShadow", children: t }) })
-] });
-l.propTypes = {
-  endCol: o.node.isRequired,
-  startCol: o.node.isRequired
-};
+import { jsxs as e, jsx as r } from "react/jsx-runtime";
+import { Grid as i } from "../Grid/Grid.js";
+import { GridItem as o } from "../Grid/GridItem.js";
+import { Box as a } from "../Box/Box.js";
+const c = ({ startCol: d, endCol: t }) => e(i, { gap: 4, children: [r(o, { col: 9, s: 12, children: r(a, { hasRadius: !0, background: "neutral0", shadow: "tableShadow", children: d }) }), r(o, { col: 3, s: 12, children: r(a, { hasRadius: !0, background: "neutral0", shadow: "tableShadow", children: t }) })] });
 export {
-  l as TwoColsLayout
+  c as TwoColsLayout
 };

package/dist/ModalLayout/ModalBody.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const t=require("styled-components"),r=require("../Box/Box.cjs"),d=e=>e&&e.__esModule?e:{default:e},u=d(t),l=u.default(r.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),t=require("styled-components"),d=require("../Box/Box.cjs"),r=e=>e&&e.__esModule?e:{default:e},l=r(t),s=l.default(d.Box)`
   overflow: auto;
   max-height: 60vh;
-`,s=e=>o.jsx(l,{padding:7,...e});exports.ModalBody=s;
+`,u=e=>o.jsx(s,{padding:7,...e});exports.ModalBody=u;

package/dist/ModalLayout/ModalBody.js

@@ -1,11 +1,10 @@
 import { jsx as r } from "react/jsx-runtime";
-import "react";
 import t from "styled-components";
-import { Box as m } from "../Box/Box.js";
-const p = t(m)`
+import { Box as d } from "../Box/Box.js";
+const m = t(d)`
   overflow: auto;
   max-height: 60vh;
-`, f = (o) => /* @__PURE__ */ r(p, { padding: 7, ...o });
+`, i = (o) => r(m, { padding: 7, ...o });
 export {
-  f as ModalBody
+  i as ModalBody
 };

package/dist/ModalLayout/ModalContext.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=e.createContext(),o=()=>e.useContext(t);exports.ModalContext=t;exports.useModal=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=e.createContext(()=>{}),o=()=>e.useContext(t);exports.ModalContext=t;exports.useModal=o;

package/dist/ModalLayout/ModalContext.js

@@ -1,5 +1,6 @@
 import { createContext as t, useContext as o } from "react";
-const e = t(), r = () => o(e);
+const e = t(() => {
+}), r = () => o(e);
 export {
   e as ModalContext,
   r as useModal

package/dist/ModalLayout/ModalFooter.cjs

@@ -1,8 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const l=require("prop-types"),u=require("styled-components"),c=require("../Box/Box.cjs"),s=require("../Flex/Flex.cjs"),n=e=>e&&e.__esModule?e:{default:e},r=n(l),i=n(u),p=i.default(c.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),d=require("styled-components"),n=require("../Box/Box.cjs"),r=require("../Flex/Flex.cjs"),s=e=>e&&e.__esModule?e:{default:e},l=s(d),a=l.default(n.Box)`
   border-radius: 0 0 ${({theme:e})=>e.borderRadius} ${({theme:e})=>e.borderRadius};
   border-top: 1px solid ${({theme:e})=>e.colors.neutral150};
-`,d=i.default(s.Flex)`
-  & > * + * {
-    margin-left: ${({theme:e})=>e.spaces[2]};
-  }
-`,o=({startActions:e,endActions:a})=>t.jsx(p,{paddingTop:4,paddingBottom:4,paddingLeft:5,paddingRight:5,background:"neutral100",children:t.jsxs(s.Flex,{justifyContent:"space-between",children:[t.jsx(d,{children:e}),t.jsx(d,{children:a})]})});o.defaultProps={endActions:void 0,startActions:void 0};o.propTypes={endActions:r.default.node,startActions:r.default.node};exports.ModalFooter=o;
+`,i=({startActions:e,endActions:t})=>o.jsx(a,{paddingTop:4,paddingBottom:4,paddingLeft:5,paddingRight:5,background:"neutral100",children:o.jsxs(r.Flex,{justifyContent:"space-between",children:[o.jsx(r.Flex,{gap:2,children:e}),o.jsx(r.Flex,{gap:2,children:t})]})});exports.ModalFooter=i;

package/dist/ModalLayout/ModalFooter.js

@@ -1,28 +1,11 @@
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
-import "react";
-import t from "prop-types";
-import d from "styled-components";
-import { Box as a } from "../Box/Box.js";
-import { Flex as i } from "../Flex/Flex.js";
-const c = d(a)`
-  border-radius: 0 0 ${({ theme: o }) => o.borderRadius} ${({ theme: o }) => o.borderRadius};
-  border-top: 1px solid ${({ theme: o }) => o.colors.neutral150};
-`, e = d(i)`
-  & > * + * {
-    margin-left: ${({ theme: o }) => o.spaces[2]};
-  }
-`, n = ({ startActions: o, endActions: p }) => /* @__PURE__ */ r(c, { paddingTop: 4, paddingBottom: 4, paddingLeft: 5, paddingRight: 5, background: "neutral100", children: /* @__PURE__ */ s(i, { justifyContent: "space-between", children: [
-  /* @__PURE__ */ r(e, { children: o }),
-  /* @__PURE__ */ r(e, { children: p })
-] }) });
-n.defaultProps = {
-  endActions: void 0,
-  startActions: void 0
-};
-n.propTypes = {
-  endActions: t.node,
-  startActions: t.node
-};
+import { jsx as o, jsxs as t } from "react/jsx-runtime";
+import i from "styled-components";
+import { Box as n } from "../Box/Box.js";
+import { Flex as d } from "../Flex/Flex.js";
+const p = i(n)`
+  border-radius: 0 0 ${({ theme: r }) => r.borderRadius} ${({ theme: r }) => r.borderRadius};
+  border-top: 1px solid ${({ theme: r }) => r.colors.neutral150};
+`, m = ({ startActions: r, endActions: e }) => o(p, { paddingTop: 4, paddingBottom: 4, paddingLeft: 5, paddingRight: 5, background: "neutral100", children: t(d, { justifyContent: "space-between", children: [o(d, { gap: 2, children: r }), o(d, { gap: 2, children: e })] }) });
 export {
-  n as ModalFooter
+  m as ModalFooter
 };

package/dist/ModalLayout/ModalHeader.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const l=require("@strapi/icons"),a=require("prop-types"),i=require("styled-components"),u=require("./ModalContext.cjs"),c=require("../IconButton/IconButton.cjs"),p=require("../Box/Box.cjs"),b=require("../Flex/Flex.cjs"),s=e=>e&&e.__esModule?e:{default:e},t=s(a),f=s(i),x=f.default(p.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),n=require("@strapi/icons"),d=require("styled-components"),s=require("./ModalContext.cjs"),a=require("../IconButton/IconButton.cjs"),l=require("../Box/Box.cjs"),i=require("../Flex/Flex.cjs"),u=e=>e&&e.__esModule?e:{default:e},c=u(d),p=c.default(l.Box)`
   border-radius: ${({theme:e})=>e.borderRadius} ${({theme:e})=>e.borderRadius} 0 0;
   border-bottom: 1px solid ${({theme:e})=>e.colors.neutral150};
-`,r=({children:e,closeLabel:d})=>{const n=u.useModal();return o.jsx(x,{paddingTop:4,paddingBottom:4,paddingLeft:5,paddingRight:5,background:"neutral100",children:o.jsxs(b.Flex,{justifyContent:"space-between",children:[e,o.jsx(c.IconButton,{onClick:n,"aria-label":d,icon:o.jsx(l.Cross,{})})]})})};r.defaultProps={closeLabel:"Close the modal"};r.propTypes={children:t.default.node.isRequired,closeLabel:t.default.string};exports.ModalHeader=r;
+`,x=({children:e,closeLabel:t="Close the modal"})=>{const r=s.useModal();return o.jsx(p,{paddingTop:4,paddingBottom:4,paddingLeft:5,paddingRight:5,background:"neutral100",children:o.jsxs(i.Flex,{justifyContent:"space-between",children:[e,o.jsx(a.IconButton,{onClick:r,"aria-label":t,icon:o.jsx(n.Cross,{})})]})})};exports.ModalHeader=x;

package/dist/ModalLayout/ModalHeader.js

@@ -1,29 +1,17 @@
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
-import "react";
-import { Cross as p } from "@strapi/icons";
-import e from "prop-types";
+import { jsx as r, jsxs as d } from "react/jsx-runtime";
+import { Cross as i } from "@strapi/icons";
 import a from "styled-components";
 import { useModal as n } from "./ModalContext.js";
-import { IconButton as l } from "../IconButton/IconButton.js";
-import { Box as m } from "../Box/Box.js";
-import { Flex as c } from "../Flex/Flex.js";
-const u = a(m)`
+import { IconButton as s } from "../IconButton/IconButton.js";
+import { Box as l } from "../Box/Box.js";
+import { Flex as m } from "../Flex/Flex.js";
+const p = a(l)`
   border-radius: ${({ theme: o }) => o.borderRadius} ${({ theme: o }) => o.borderRadius} 0 0;
   border-bottom: 1px solid ${({ theme: o }) => o.colors.neutral150};
-`, t = ({ children: o, closeLabel: d }) => {
-  const i = n();
-  return /* @__PURE__ */ r(u, { paddingTop: 4, paddingBottom: 4, paddingLeft: 5, paddingRight: 5, background: "neutral100", children: /* @__PURE__ */ s(c, { justifyContent: "space-between", children: [
-    o,
-    /* @__PURE__ */ r(l, { onClick: i, "aria-label": d, icon: /* @__PURE__ */ r(p, {}) })
-  ] }) });
-};
-t.defaultProps = {
-  closeLabel: "Close the modal"
-};
-t.propTypes = {
-  children: e.node.isRequired,
-  closeLabel: e.string
+`, h = ({ children: o, closeLabel: e = "Close the modal" }) => {
+  const t = n();
+  return r(p, { paddingTop: 4, paddingBottom: 4, paddingLeft: 5, paddingRight: 5, background: "neutral100", children: d(m, { justifyContent: "space-between", children: [o, r(s, { onClick: t, "aria-label": e, icon: r(i, {}) })] }) });
 };
 export {
-  t as ModalHeader
+  h as ModalHeader
 };

package/dist/ModalLayout/ModalLayout.cjs

@@ -1,6 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const u=require("prop-types"),d=require("styled-components"),c=require("./ModalContext.cjs"),p=require("../DismissibleLayer/index.cjs"),x=require("../hooks/useLockScroll.cjs"),y=require("../Flex/Flex.cjs"),f=require("../Box/Box.cjs"),q=require("../Portal/Portal.cjs"),g=require("../FocusTrap/FocusTrap.cjs"),t=e=>e&&e.__esModule?e:{default:e},r=t(u),n=t(d),h=n.default(y.Flex)`
-  inset: 0;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),i=require("styled-components"),a=require("./ModalContext.cjs"),s=require("../DismissibleLayer/index.cjs"),d=require("../hooks/useLockScroll.cjs"),l=require("../Flex/Flex.cjs"),u=require("../Portal/Portal.cjs"),c=require("../FocusTrap/FocusTrap.cjs"),x=require("../Box/Box.cjs"),p=e=>e&&e.__esModule?e:{default:e},h=p(i),y=h.default(l.Flex)`
   background: ${({theme:e})=>`${e.colors.neutral800}1F`};
-`,j=n.default(f.Box)`
-  width: ${830/16}rem;
-`,s=({onClose:e,labelledBy:i,...a})=>(x(!0),o.jsx(q.Portal,{children:o.jsx(c.ModalContext.Provider,{value:e,children:o.jsx(h,{justifyContent:"center",paddingLeft:8,paddingRight:8,position:"fixed",zIndex:4,children:o.jsx(g.FocusTrap,{children:o.jsx(p.DismissibleLayer,{onEscapeKeyDown:e,onPointerDownOutside:e,children:o.jsx(j,{"aria-labelledby":i,onClick:l=>l.stopPropagation(),background:"neutral0",hasRadius:!0,shadow:"popupShadow",role:"dialog","aria-modal":!0,...a})})})})})}));s.propTypes={labelledBy:r.default.string.isRequired,onClose:r.default.func.isRequired};exports.ModalLayout=s;
+  inset: 0;
+`,g=({onClose:e,labelledBy:r,...t})=>(d(!0),o.jsx(u.Portal,{children:o.jsx(a.ModalContext.Provider,{value:e,children:o.jsx(y,{justifyContent:"center",paddingLeft:8,paddingRight:8,position:"fixed",zIndex:4,children:o.jsx(c.FocusTrap,{children:o.jsx(s.DismissibleLayer,{onEscapeKeyDown:e,onPointerDownOutside:e,children:o.jsx(x.Box,{"aria-labelledby":r,"aria-modal":!0,onClick:n=>n.stopPropagation(),background:"neutral0",hasRadius:!0,role:"dialog",shadow:"popupShadow",width:`${830/16}rem`,...t})})})})})}));exports.ModalLayout=g;

package/dist/ModalLayout/ModalLayout.js

@@ -1,36 +1,16 @@
 import { jsx as o } from "react/jsx-runtime";
-import "react";
-import e from "prop-types";
-import i from "styled-components";
+import a from "styled-components";
 import { ModalContext as d } from "./ModalContext.js";
-import { DismissibleLayer as p } from "../DismissibleLayer/index.js";
+import { DismissibleLayer as n } from "../DismissibleLayer/index.js";
 import l from "../hooks/useLockScroll.js";
-import { Flex as m } from "../Flex/Flex.js";
-import { Box as s } from "../Box/Box.js";
-import { Portal as u } from "../Portal/Portal.js";
-import { FocusTrap as c } from "../FocusTrap/FocusTrap.js";
-const f = i(m)`
-  inset: 0;
+import { Flex as p } from "../Flex/Flex.js";
+import { Portal as m } from "../Portal/Portal.js";
+import { FocusTrap as s } from "../FocusTrap/FocusTrap.js";
+import { Box as c } from "../Box/Box.js";
+const u = a(p)`
   background: ${({ theme: r }) => `${r.colors.neutral800}1F`};
-`, h = i(s)`
-  width: ${830 / 16}rem;
-`, y = ({ onClose: r, labelledBy: t, ...n }) => (l(!0), /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o(d.Provider, { value: r, children: /* @__PURE__ */ o(f, { justifyContent: "center", paddingLeft: 8, paddingRight: 8, position: "fixed", zIndex: 4, children: /* @__PURE__ */ o(c, { children: /* @__PURE__ */ o(p, { onEscapeKeyDown: r, onPointerDownOutside: r, children: /* @__PURE__ */ o(
-  h,
-  {
-    "aria-labelledby": t,
-    onClick: (a) => a.stopPropagation(),
-    background: "neutral0",
-    hasRadius: !0,
-    shadow: "popupShadow",
-    role: "dialog",
-    "aria-modal": !0,
-    ...n
-  }
-) }) }) }) }) }));
-y.propTypes = {
-  labelledBy: e.string.isRequired,
-  onClose: e.func.isRequired
-};
+  inset: 0;
+`, P = ({ onClose: r, labelledBy: t, ...i }) => (l(!0), o(m, { children: o(d.Provider, { value: r, children: o(u, { justifyContent: "center", paddingLeft: 8, paddingRight: 8, position: "fixed", zIndex: 4, children: o(s, { children: o(n, { onEscapeKeyDown: r, onPointerDownOutside: r, children: o(c, { "aria-labelledby": t, "aria-modal": !0, onClick: (e) => e.stopPropagation(), background: "neutral0", hasRadius: !0, role: "dialog", shadow: "popupShadow", width: `${830 / 16}rem`, ...i }) }) }) }) }) }));
 export {
-  y as ModalLayout
+  P as ModalLayout
 };

package/dist/NumberInput/NumberInput.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),f=require("react"),x=require("@internationalized/number"),q=require("@strapi/icons"),$=require("prop-types"),z=require("styled-components"),B=require("../helpers/getDefaultLocale.cjs"),N=require("../helpers/keyboardKeys.cjs"),E=require("../hooks/useControllableState.cjs"),M=require("../hooks/useId.cjs"),U=require("../themes/sizes.cjs"),H=require("../Field/Field.cjs"),W=require("../Flex/Flex.cjs"),X=require("../Field/FieldLabel.cjs"),Y=require("../Field/FieldInput.cjs"),v=require("../Icon/Icon.cjs"),G=require("../Field/FieldHint.cjs"),J=require("../Field/FieldError.cjs"),m=r=>r&&r.__esModule?r:{default:r},Q=m(f),t=m($),Z=m(z),I=Z.default.button`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),l=require("react"),x=require("@internationalized/number"),g=require("@strapi/icons"),v=require("styled-components"),M=require("../helpers/getDefaultLocale.cjs"),h=require("../helpers/keyboardKeys.cjs"),B=require("../hooks/useControllableState.cjs"),E=require("../hooks/useId.cjs"),U=require("../Field/Field.cjs"),H=require("../Flex/Flex.cjs"),O=require("../Field/FieldLabel.cjs"),T=require("../Field/FieldInput.cjs"),N=require("../Icon/Icon.cjs"),z=require("../Field/FieldHint.cjs"),W=require("../Field/FieldError.cjs"),q=r=>r&&r.__esModule?r:{default:r},X=q(l),Y=q(v),y=Y.default.button`
   display: flex;
   height: 1rem;
   align-items: ${({reverse:r})=>r?"flex-end":"flex-start"};
@@ -9,4 +9,4 @@
     height: ${4/16}rem;
     transform: ${({reverse:r})=>r?"rotateX(180deg)":void 0};
   }
-`,ee="",c=Q.default.forwardRef(({size:r,startAction:F,name:w,hint:j,error:D,label:p,labelAction:A,locale:V,id:C,onValueChange:R,value:b,step:s,required:_,disabled:u,...P},k)=>{const K=M.useId(C),g=V||B.getDefaultLocale(),l=f.useRef(new x.NumberParser(g,{style:"decimal"})),d=f.useRef(new x.NumberFormatter(g,{maximumFractionDigits:20})),[o,S]=E.useControllableState({prop(e){const a=String(b);return isNaN(a)||a!==e&&e!==""?e:d.current.format(b)},defaultProp:ee,onChange(e){const a=l.current.parse(e);R(isNaN(a)?void 0:a)}}),i=e=>{S(String(e))},L=({target:{value:e}})=>{l.current.isValidPartialNumber(e)&&i(e)},y=()=>{if(!o){i(s);return}const e=l.current.parse(o),a=isNaN(e)?s:e+s;i(d.current.format(a))},h=()=>{if(!o){i(-s);return}const e=l.current.parse(o),a=isNaN(e)?-s:e-s;i(d.current.format(a))},O=e=>{if(!u)switch(e.key){case N.KeyboardKeys.DOWN:{e.preventDefault(),h();break}case N.KeyboardKeys.UP:{e.preventDefault(),y();break}}},T=()=>{if(o){const e=l.current.parse(o),a=isNaN(e)?"":d.current.format(e);i(a)}};return n.jsx(H.Field,{name:w,hint:j,error:D,id:K,required:_,children:n.jsxs(W.Flex,{direction:"column",alignItems:"stretch",gap:1,children:[p&&n.jsx(X.FieldLabel,{action:A,children:p}),n.jsx(Y.FieldInput,{ref:k,startAction:F,disabled:u,type:"text",inputmode:"decimal",onChange:L,onKeyDown:O,onBlur:T,value:o,size:r,endAction:n.jsxs(n.Fragment,{children:[n.jsx(I,{disabled:u,"aria-hidden":!0,reverse:!0,onClick:y,tabIndex:-1,type:"button","data-testid":"ArrowUp",children:n.jsx(v.Icon,{as:q.CarretDown,color:"neutral500"})}),n.jsx(I,{disabled:u,"aria-hidden":!0,onClick:h,tabIndex:-1,type:"button","data-testid":"ArrowDown",children:n.jsx(v.Icon,{as:q.CarretDown,color:"neutral500"})})]}),...P}),n.jsx(G.FieldHint,{}),n.jsx(J.FieldError,{})]})})});c.displayName="NumberInput";c.defaultProps={"aria-label":void 0,disabled:!1,error:void 0,hint:void 0,id:void 0,label:void 0,labelAction:void 0,locale:void 0,required:!1,size:"M",startAction:void 0,step:1,value:void 0};c.propTypes={"aria-label":t.default.string,disabled:t.default.bool,error:t.default.string,hint:t.default.oneOfType([t.default.string,t.default.node,t.default.arrayOf(t.default.node)]),id:t.default.string,label:t.default.string,labelAction:t.default.element,locale:t.default.string,name:t.default.string.isRequired,onValueChange:t.default.func.isRequired,required:t.default.bool,size:t.default.oneOf(Object.keys(U.sizes.input)),startAction:t.default.element,step:t.default.number,value:t.default.number};exports.NumberInput=c;
+`,G="",J=X.default.forwardRef(({size:r="M",startAction:I,name:F,hint:w,error:j,label:d,labelAction:D,locale:V,id:C,onValueChange:A,value:f,step:a=1,required:R=!1,disabled:u=!1,..._},k)=>{const K=E.useId(C),m=V||M.getDefaultLocale(),i=l.useRef(new x.NumberParser(m,{style:"decimal"})),c=l.useRef(new x.NumberFormatter(m,{maximumFractionDigits:20})),[o,S]=B.useControllableState({prop(e){const n=String(f);return isNaN(Number(n))||n!==e&&e!==""?e:c.current.format(Number(f))},defaultProp:G,onChange(e){const n=i.current.parse(e??"");A(isNaN(n)?void 0:n)}}),s=e=>{S(String(e))},L=({target:{value:e}})=>{i.current.isValidPartialNumber(e)&&s(e)},b=()=>{if(!o){s(a);return}const e=i.current.parse(o),n=isNaN(e)?a:e+a;s(c.current.format(n))},p=()=>{if(!o){s(-a);return}const e=i.current.parse(o),n=isNaN(e)?-a:e-a;s(c.current.format(n))},P=e=>{if(!u)switch(e.key){case h.KeyboardKeys.DOWN:{e.preventDefault(),p();break}case h.KeyboardKeys.UP:{e.preventDefault(),b();break}}},$=()=>{if(o){const e=i.current.parse(o),n=isNaN(e)?"":c.current.format(e);s(n)}};return t.jsx(U.Field,{name:F,hint:w,error:j,id:K,required:R,children:t.jsxs(H.Flex,{direction:"column",alignItems:"stretch",gap:1,children:[d&&t.jsx(O.FieldLabel,{action:D,children:d}),t.jsx(T.FieldInput,{ref:k,startAction:I,disabled:u,type:"text",inputMode:"decimal",onChange:L,onKeyDown:P,onBlur:$,value:o,size:r,endAction:t.jsxs(t.Fragment,{children:[t.jsx(y,{disabled:u,"aria-hidden":!0,reverse:!0,onClick:b,tabIndex:-1,type:"button","data-testid":"ArrowUp",children:t.jsx(N.Icon,{as:g.CarretDown,color:"neutral500"})}),t.jsx(y,{disabled:u,"aria-hidden":!0,onClick:p,tabIndex:-1,type:"button","data-testid":"ArrowDown",children:t.jsx(N.Icon,{as:g.CarretDown,color:"neutral500"})})]}),..._}),t.jsx(z.FieldHint,{}),t.jsx(W.FieldError,{})]})})});exports.NumberInput=J;

package/dist/NumberInput/NumberInput.js

@@ -1,179 +1,79 @@
-import { jsx as n, jsxs as h, Fragment as L } from "react/jsx-runtime";
-import S, { useRef as y } from "react";
-import { NumberParser as T, NumberFormatter as j } from "@internationalized/number";
+import { jsx as n, jsxs as h, Fragment as U } from "react/jsx-runtime";
+import _, { useRef as b } from "react";
+import { NumberParser as j, NumberFormatter as E } from "@internationalized/number";
 import { CarretDown as N } from "@strapi/icons";
-import r from "prop-types";
-import z from "styled-components";
-import { getDefaultLocale as U } from "../helpers/getDefaultLocale.js";
-import { KeyboardKeys as v } from "../helpers/keyboardKeys.js";
-import { useControllableState as _ } from "../hooks/useControllableState.js";
-import { useId as E } from "../hooks/useId.js";
-import { sizes as H } from "../themes/sizes.js";
-import { Field as M } from "../Field/Field.js";
-import { Flex as W } from "../Flex/Flex.js";
-import { FieldLabel as X } from "../Field/FieldLabel.js";
-import { FieldInput as Y } from "../Field/FieldInput.js";
+import M from "styled-components";
+import { getDefaultLocale as q } from "../helpers/getDefaultLocale.js";
+import { KeyboardKeys as g } from "../helpers/keyboardKeys.js";
+import { useControllableState as z } from "../hooks/useControllableState.js";
+import { useId as H } from "../hooks/useId.js";
+import { Field as O } from "../Field/Field.js";
+import { Flex as T } from "../Flex/Flex.js";
+import { FieldLabel as W } from "../Field/FieldLabel.js";
+import { FieldInput as X } from "../Field/FieldInput.js";
 import { Icon as w } from "../Icon/Icon.js";
-import { FieldHint as G } from "../Field/FieldHint.js";
-import { FieldError as J } from "../Field/FieldError.js";
-const x = z.button`
+import { FieldHint as Y } from "../Field/FieldHint.js";
+import { FieldError as G } from "../Field/FieldError.js";
+const x = M.button`
   display: flex;
   height: 1rem;
-  align-items: ${({ reverse: o }) => o ? "flex-end" : "flex-start"};
-  transform: translateY(${({ reverse: o }) => o ? "-2px" : "2px"});
-  cursor: ${({ disabled: o }) => o ? "not-allowed" : void 0};
+  align-items: ${({ reverse: t }) => t ? "flex-end" : "flex-start"};
+  transform: translateY(${({ reverse: t }) => t ? "-2px" : "2px"});
+  cursor: ${({ disabled: t }) => t ? "not-allowed" : void 0};
   svg {
     display: block;
     height: ${4 / 16}rem;
-    transform: ${({ reverse: o }) => o ? "rotateX(180deg)" : void 0};
+    transform: ${({ reverse: t }) => t ? "rotateX(180deg)" : void 0};
   }
-`, Q = "", u = S.forwardRef(
-  ({
-    size: o,
-    startAction: I,
-    name: A,
-    hint: V,
-    error: D,
-    label: c,
-    labelAction: F,
-    locale: C,
-    id: k,
-    onValueChange: P,
-    value: p,
-    step: i,
-    required: R,
-    disabled: d,
-    ...K
-  }, O) => {
-    const $ = E(k), f = C || U(), s = y(new T(f, { style: "decimal" })), m = y(new j(f, { maximumFractionDigits: 20 })), [a, q] = _({
-      prop(e) {
-        const t = String(p);
-        return isNaN(t) || t !== e && e !== "" ? e : m.current.format(p);
-      },
-      defaultProp: Q,
-      onChange(e) {
-        const t = s.current.parse(e);
-        P(isNaN(t) ? void 0 : t);
-      }
-    }), l = (e) => {
-      q(String(e));
-    }, B = ({ target: { value: e } }) => {
-      s.current.isValidPartialNumber(e) && l(e);
-    }, b = () => {
-      if (!a) {
-        l(i);
-        return;
-      }
-      const e = s.current.parse(a), t = isNaN(e) ? i : e + i;
-      l(m.current.format(t));
-    }, g = () => {
-      if (!a) {
-        l(-i);
-        return;
-      }
-      const e = s.current.parse(a), t = isNaN(e) ? -i : e - i;
-      l(m.current.format(t));
-    };
-    return /* @__PURE__ */ n(M, { name: A, hint: V, error: D, id: $, required: R, children: /* @__PURE__ */ h(W, { direction: "column", alignItems: "stretch", gap: 1, children: [
-      c && /* @__PURE__ */ n(X, { action: F, children: c }),
-      /* @__PURE__ */ n(
-        Y,
-        {
-          ref: O,
-          startAction: I,
-          disabled: d,
-          type: "text",
-          inputmode: "decimal",
-          onChange: B,
-          onKeyDown: (e) => {
-            if (!d)
-              switch (e.key) {
-                case v.DOWN: {
-                  e.preventDefault(), g();
-                  break;
-                }
-                case v.UP: {
-                  e.preventDefault(), b();
-                  break;
-                }
-              }
-          },
-          onBlur: () => {
-            if (a) {
-              const e = s.current.parse(a), t = isNaN(e) ? "" : m.current.format(e);
-              l(t);
-            }
-          },
-          value: a,
-          size: o,
-          endAction: /* @__PURE__ */ h(L, { children: [
-            /* @__PURE__ */ n(
-              x,
-              {
-                disabled: d,
-                "aria-hidden": !0,
-                reverse: !0,
-                onClick: b,
-                tabIndex: -1,
-                type: "button",
-                "data-testid": "ArrowUp",
-                children: /* @__PURE__ */ n(w, { as: N, color: "neutral500" })
-              }
-            ),
-            /* @__PURE__ */ n(
-              x,
-              {
-                disabled: d,
-                "aria-hidden": !0,
-                onClick: g,
-                tabIndex: -1,
-                type: "button",
-                "data-testid": "ArrowDown",
-                children: /* @__PURE__ */ n(w, { as: N, color: "neutral500" })
-              }
-            )
-          ] }),
-          ...K
+`, J = "", pr = _.forwardRef(({ size: t = "M", startAction: y, name: I, hint: F, error: V, label: c, labelAction: D, locale: A, id: C, onValueChange: k, value: d, step: a = 1, required: P = !1, disabled: m = !1, ...R }, $) => {
+  const K = H(C), u = A || q(), s = b(new j(u, { style: "decimal" })), l = b(new E(u, { maximumFractionDigits: 20 })), [o, L] = z({
+    prop(r) {
+      const e = String(d);
+      return isNaN(Number(e)) || e !== r && r !== "" ? r : l.current.format(Number(d));
+    },
+    defaultProp: J,
+    onChange(r) {
+      const e = s.current.parse(r ?? "");
+      k(isNaN(e) ? void 0 : e);
+    }
+  }), i = (r) => {
+    L(String(r));
+  }, S = ({ target: { value: r } }) => {
+    s.current.isValidPartialNumber(r) && i(r);
+  }, f = () => {
+    if (!o) {
+      i(a);
+      return;
+    }
+    const r = s.current.parse(o), e = isNaN(r) ? a : r + a;
+    i(l.current.format(e));
+  }, p = () => {
+    if (!o) {
+      i(-a);
+      return;
+    }
+    const r = s.current.parse(o), e = isNaN(r) ? -a : r - a;
+    i(l.current.format(e));
+  }, v = (r) => {
+    if (!m)
+      switch (r.key) {
+        case g.DOWN: {
+          r.preventDefault(), p();
+          break;
         }
-      ),
-      /* @__PURE__ */ n(G, {}),
-      /* @__PURE__ */ n(J, {})
-    ] }) });
-  }
-);
-u.displayName = "NumberInput";
-u.defaultProps = {
-  "aria-label": void 0,
-  disabled: !1,
-  error: void 0,
-  hint: void 0,
-  id: void 0,
-  label: void 0,
-  labelAction: void 0,
-  locale: void 0,
-  required: !1,
-  size: "M",
-  startAction: void 0,
-  step: 1,
-  value: void 0
-};
-u.propTypes = {
-  "aria-label": r.string,
-  disabled: r.bool,
-  error: r.string,
-  hint: r.oneOfType([r.string, r.node, r.arrayOf(r.node)]),
-  id: r.string,
-  label: r.string,
-  labelAction: r.element,
-  locale: r.string,
-  name: r.string.isRequired,
-  onValueChange: r.func.isRequired,
-  required: r.bool,
-  size: r.oneOf(Object.keys(H.input)),
-  startAction: r.element,
-  step: r.number,
-  value: r.number
-};
+        case g.UP: {
+          r.preventDefault(), f();
+          break;
+        }
+      }
+  }, B = () => {
+    if (o) {
+      const r = s.current.parse(o), e = isNaN(r) ? "" : l.current.format(r);
+      i(e);
+    }
+  };
+  return n(O, { name: I, hint: F, error: V, id: K, required: P, children: h(T, { direction: "column", alignItems: "stretch", gap: 1, children: [c && n(W, { action: D, children: c }), n(X, { ref: $, startAction: y, disabled: m, type: "text", inputMode: "decimal", onChange: S, onKeyDown: v, onBlur: B, value: o, size: t, endAction: h(U, { children: [n(x, { disabled: m, "aria-hidden": !0, reverse: !0, onClick: f, tabIndex: -1, type: "button", "data-testid": "ArrowUp", children: n(w, { as: N, color: "neutral500" }) }), n(x, { disabled: m, "aria-hidden": !0, onClick: p, tabIndex: -1, type: "button", "data-testid": "ArrowDown", children: n(w, { as: N, color: "neutral500" }) })] }), ...R }), n(Y, {}), n(G, {})] }) });
+});
 export {
-  u as NumberInput
+  pr as NumberInput
 };

package/dist/Pagination/Pagination.cjs

@@ -1,5 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),p=require("react"),g=require("prop-types"),b=require("styled-components"),P=require("./PaginationContext.cjs"),_=require("../Flex/Flex.cjs"),s=e=>e&&e.__esModule?e:{default:e};function m(e){if(e&&e.__esModule)return e;const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const l=m(p),a=s(g),u=s(b),j=u.default.nav``,x=u.default(_.Flex)`
-  & > * + * {
-    margin-left: ${({theme:e})=>e.spaces[1]};
-  }
-`,o=({children:e,label:n,activePage:t,pageCount:r})=>{const c=l.useMemo(()=>({activePage:t,pageCount:r}),[t,r]);return i.jsx(P.PaginationContext.Provider,{value:c,children:i.jsx(j,{"aria-label":n,children:i.jsx(x,{as:"ul",children:l.Children.map(e,(d,f)=>i.jsx("li",{children:d},f))})})})};o.defaultProps={label:"pagination"};o.propTypes={activePage:a.default.number.isRequired,children:a.default.node.isRequired,label:a.default.string,pageCount:a.default.number.isRequired};exports.Pagination=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),l=require("react"),u=require("./PaginationContext.cjs"),d=require("../Box/Box.cjs"),x=require("../Flex/Flex.cjs");function g(e){if(e&&e.__esModule)return e;const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const i=g(l),f=({children:e,label:n="Pagination",activePage:t,pageCount:r})=>{const a=i.useMemo(()=>({activePage:t,pageCount:r}),[t,r]);return o.jsx(u.PaginationContext.Provider,{value:a,children:o.jsx(d.Box,{"aria-label":n,as:"nav",children:o.jsx(x.Flex,{as:"ol",gap:1,children:i.Children.map(e,(c,s)=>o.jsx("li",{children:c},s))})})})};exports.Pagination=f;

package/dist/Pagination/Pagination.js

@@ -1,26 +1,12 @@
 import { jsx as r } from "react/jsx-runtime";
-import * as t from "react";
-import e from "prop-types";
-import a from "styled-components";
+import * as n from "react";
 import { PaginationContext as c } from "./PaginationContext.js";
-import { Flex as u } from "../Flex/Flex.js";
-const f = a.nav``, g = a(u)`
-  & > * + * {
-    margin-left: ${({ theme: i }) => i.spaces[1]};
-  }
-`, l = ({ children: i, label: s, activePage: n, pageCount: o }) => {
-  const p = t.useMemo(() => ({ activePage: n, pageCount: o }), [n, o]);
-  return /* @__PURE__ */ r(c.Provider, { value: p, children: /* @__PURE__ */ r(f, { "aria-label": s, children: /* @__PURE__ */ r(g, { as: "ul", children: t.Children.map(i, (m, d) => /* @__PURE__ */ r("li", { children: m }, d)) }) }) });
-};
-l.defaultProps = {
-  label: "pagination"
-};
-l.propTypes = {
-  activePage: e.number.isRequired,
-  children: e.node.isRequired,
-  label: e.string,
-  pageCount: e.number.isRequired
+import { Box as p } from "../Box/Box.js";
+import { Flex as s } from "../Flex/Flex.js";
+const u = ({ children: t, label: a = "Pagination", activePage: o, pageCount: i }) => {
+  const e = n.useMemo(() => ({ activePage: o, pageCount: i }), [o, i]);
+  return r(c.Provider, { value: e, children: r(p, { "aria-label": a, as: "nav", children: r(s, { as: "ol", gap: 1, children: n.Children.map(t, (m, l) => r("li", { children: m }, l)) }) }) });
 };
 export {
-  l as Pagination
+  u as Pagination
 };

package/dist/Pagination/components.cjs

@@ -1,22 +1,21 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const g=require("@strapi/icons"),q=require("prop-types"),j=require("react-router-dom"),k=require("styled-components"),u=require("./PaginationContext.cjs"),L=require("../themes/utils.cjs"),m=require("../Typography/Typography.cjs"),d=require("../VisuallyHidden/VisuallyHidden.cjs"),y=e=>e&&e.__esModule?e:{default:e},a=y(q),n=y(k),f=n.default(m.Typography)`
-  line-height: revert;
-`,T={active:!0},c=n.default(j.NavLink).withConfig({shouldForwardProp:(e,i)=>!T[e]&&i(e)})`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),u=require("@strapi/icons"),v=require("react-router-dom"),y=require("styled-components"),d=require("./PaginationContext.cjs"),b=require("../themes/utils.cjs"),o=require("../VisuallyHidden/VisuallyHidden.cjs"),c=require("../Typography/Typography.cjs"),P=require("../Box/Box.cjs"),j=e=>e&&e.__esModule?e:{default:e},l=j(y),k={active:!0},h=l.default(v.NavLink).withConfig({shouldForwardProp:(e,i)=>!k[e]&&i(e)})`
   padding: ${({theme:e})=>e.spaces[3]};
   border-radius: ${({theme:e})=>e.borderRadius};
   box-shadow: ${({active:e,theme:i})=>e?i.shadows.filterShadow:void 0};
   text-decoration: none;
   display: flex;
 
-  ${L.buttonFocusStyle}
-`,$=n.default(c)`
+  ${b.buttonFocusStyle}
+`,L=l.default(h)`
   color: ${({theme:e,active:i})=>i?e.colors.primary700:e.colors.neutral800};
   background: ${({theme:e,active:i})=>i?e.colors.neutral0:void 0};
 
   &:hover {
     box-shadow: ${({theme:e})=>e.shadows.filterShadow};
   }
-`,x=n.default(c)`
-  font-size: 0.7rem;
+`,g=l.default(h)`
+  font-size: ${11/16}rem;
+
   svg path {
     fill: ${e=>e["aria-disabled"]?e.theme.colors.neutral300:e.theme.colors.neutral600};
   }
@@ -31,6 +30,4 @@
   ${e=>e["aria-disabled"]?`
   pointer-events: none;
     `:void 0}
-`,R=n.default(c)`
-  color: ${({theme:e})=>e.colors.neutral800};
-`,p=({children:e,to:i,...o})=>{const{activePage:s}=u.usePagination(),t=s===1;return r.jsxs(x,{to:t?"#":i,"aria-disabled":t,tabIndex:t?-1:void 0,...o,children:[r.jsx(d.VisuallyHidden,{children:e}),r.jsx(g.ChevronLeft,{"aria-hidden":!0})]})};p.displayName="PreviousLink";const h=({children:e,to:i,...o})=>{const{activePage:s,pageCount:t}=u.usePagination(),l=s===t;return r.jsxs(x,{to:l?"#":i,"aria-disabled":l,tabIndex:l?-1:void 0,...o,children:[r.jsx(d.VisuallyHidden,{children:e}),r.jsx(g.ChevronRight,{"aria-hidden":!0})]})};h.displayName="NextLink";const v=({number:e,children:i,...o})=>{const{activePage:s}=u.usePagination(),t=s===e;return r.jsxs($,{...o,active:t,children:[r.jsx(d.VisuallyHidden,{children:i}),r.jsx(f,{"aria-hidden":!0,variant:"pi",fontWeight:t?"bold":null,children:e})]})};v.displayName="PageLink";const P=({children:e,...i})=>r.jsxs(R,{...i,as:"div",children:[r.jsx(d.VisuallyHidden,{children:e}),r.jsx(f,{"aria-hidden":!0,variant:"pi",children:"…"})]});v.propTypes={children:a.default.node.isRequired,number:a.default.number.isRequired};const b={children:a.default.node.isRequired,to:a.default.string.isRequired};h.propTypes=b;p.propTypes=b;P.propTypes={children:a.default.node.isRequired};exports.Dots=P;exports.NextLink=h;exports.PageLink=v;exports.PreviousLink=p;
+`,x=({children:e,to:i,...r})=>{const{activePage:a}=d.usePagination(),t=a===1;return n.jsxs(g,{to:t?"#":i,"aria-disabled":t,tabIndex:t?-1:void 0,...r,children:[n.jsx(o.VisuallyHidden,{children:e}),n.jsx(u.ChevronLeft,{"aria-hidden":!0})]})};x.displayName="PreviousLink";const f=({children:e,to:i,...r})=>{const{activePage:a,pageCount:t}=d.usePagination(),s=a===t;return n.jsxs(g,{to:s?"#":i,"aria-disabled":s,tabIndex:s?-1:void 0,...r,children:[n.jsx(o.VisuallyHidden,{children:e}),n.jsx(u.ChevronRight,{"aria-hidden":!0})]})};f.displayName="NextLink";const p=({number:e,children:i,...r})=>{const{activePage:a}=d.usePagination(),t=a===e;return n.jsxs(L,{...r,active:t,children:[n.jsx(o.VisuallyHidden,{children:i}),n.jsx(c.Typography,{"aria-hidden":!0,fontWeight:t?"bold":void 0,lineHeight:"revert",variant:"pi",children:e})]})};p.displayName="PageLink";const $=({children:e,...i})=>n.jsxs(P.Box,{...i,children:[n.jsx(o.VisuallyHidden,{children:e}),n.jsx(c.Typography,{"aria-hidden":!0,lineHeight:"revert",textColor:"neutral800",variant:"pi",children:"…"})]});exports.Dots=$;exports.NextLink=f;exports.PageLink=p;exports.PreviousLink=x;