@strapi/design-system 1.7.0 → 1.7.2-alpha.0

package/dist/Layout/HeaderLayout.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),E=require("prop-types"),v=require("styled-components"),d=require("../Box/Box.cjs"),u=require("../Flex/Flex.cjs"),B=require("../hooks/useElementOnScreen.cjs"),b=require("../hooks/useResizeObserver.cjs"),s=require("../Typography/Typography.cjs"),p=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=p(c),a=p(E),R=p(v),T=()=>{const e=c.useRef(null),[l,r]=c.useState(null),[n,o]=B.useElementOnScreen({root:null,rootMargin:"0px",threshold:0});return b.useResizeObserver(n,()=>{n.current&&r(n.current.getBoundingClientRect())}),c.useEffect(()=>{e.current&&r(e.current.getBoundingClientRect())},[e]),{containerRef:n,isVisible:o,baseHeaderLayoutRef:e,headerSize:l}},f=e=>{const{containerRef:l,isVisible:r,baseHeaderLayoutRef:n,headerSize:o}=T();return t.default.createElement(t.default.Fragment,null,t.default.createElement("div",{style:{height:o?.height},ref:l},r&&t.default.createElement(i,{ref:n,...e})),!r&&t.default.createElement(i,{...e,sticky:!0,width:o?.width}))};f.displayName="HeaderLayout";const L=R.default(d.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),v=require("prop-types"),B=require("styled-components"),R=require("../hooks/useElementOnScreen.cjs"),b=require("../hooks/useResizeObserver.cjs"),r=require("../Box/Box.cjs"),l=require("../Flex/Flex.cjs"),u=require("../Typography/Typography.cjs"),f=e=>e&&e.__esModule?e:{default:e},m=f(c),i=f(v),T=f(B),L=()=>{const e=c.useRef(null),[a,n]=c.useState(null),[d,o]=R.useElementOnScreen({root:null,rootMargin:"0px",threshold:0});return b.useResizeObserver(d,()=>{d.current&&n(d.current.getBoundingClientRect())}),c.useEffect(()=>{e.current&&n(e.current.getBoundingClientRect())},[e]),{containerRef:d,isVisible:o,baseHeaderLayoutRef:e,headerSize:a}},p=e=>{const{containerRef:a,isVisible:n,baseHeaderLayoutRef:d,headerSize:o}=L();return t.jsxs(t.Fragment,{children:[t.jsx("div",{style:{height:o?.height},ref:a,children:n&&t.jsx(s,{ref:d,...e})}),!n&&t.jsx(s,{...e,sticky:!0,width:o?.width})]})};p.displayName="HeaderLayout";const S=T.default(r.Box)`
   width: ${e=>e.width}px;
   z-index: ${({theme:e})=>e.zIndices[1]};
-`,i=t.default.forwardRef(({navigationAction:e,primaryAction:l,secondaryAction:r,subtitle:n,title:o,sticky:m,width:h,...y},x)=>{const g=typeof n=="string";return m?t.default.createElement(L,{paddingLeft:6,paddingRight:6,paddingTop:3,paddingBottom:3,position:"fixed",top:0,right:0,background:"neutral0",shadow:"tableShadow",width:h,"data-strapi-header-sticky":!0},t.default.createElement(u.Flex,{justifyContent:"space-between"},t.default.createElement(u.Flex,null,e&&t.default.createElement(d.Box,{paddingRight:3},e),t.default.createElement(d.Box,null,t.default.createElement(s.Typography,{variant:"beta",as:"h1",...y},o),g?t.default.createElement(s.Typography,{variant:"pi",textColor:"neutral600"},n):n),r?t.default.createElement(d.Box,{paddingLeft:4},r):null),t.default.createElement(u.Flex,null,l?t.default.createElement(d.Box,{paddingLeft:2},l):void 0))):t.default.createElement(d.Box,{ref:x,paddingLeft:10,paddingRight:10,paddingBottom:8,paddingTop:e?6:8,background:"neutral100","data-strapi-header":!0},e?t.default.createElement(d.Box,{paddingBottom:2},e):null,t.default.createElement(u.Flex,{justifyContent:"space-between"},t.default.createElement(u.Flex,{minWidth:0},t.default.createElement(s.Typography,{as:"h1",variant:"alpha",...y},o),r?t.default.createElement(d.Box,{paddingLeft:4},r):null),l),g?t.default.createElement(s.Typography,{variant:"epsilon",textColor:"neutral600",as:"p"},n):n)});i.displayName="BaseHeaderLayout";i.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0,sticky:!1,width:void 0};i.propTypes={navigationAction:a.default.node,primaryAction:a.default.node,secondaryAction:a.default.node,sticky:a.default.bool,subtitle:a.default.oneOfType([a.default.string,a.default.node]),title:a.default.string.isRequired,width:a.default.number};f.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0};f.propTypes={navigationAction:a.default.node,primaryAction:a.default.node,secondaryAction:a.default.node,subtitle:a.default.oneOfType([a.default.string,a.default.node]),title:a.default.string.isRequired};exports.BaseHeaderLayout=i;exports.HeaderLayout=f;
+`,s=m.default.forwardRef(({navigationAction:e,primaryAction:a,secondaryAction:n,subtitle:d,title:o,sticky:y,width:g,...h},j)=>{const x=typeof d=="string";return y?t.jsx(S,{paddingLeft:6,paddingRight:6,paddingTop:3,paddingBottom:3,position:"fixed",top:0,right:0,background:"neutral0",shadow:"tableShadow",width:g,"data-strapi-header-sticky":!0,children:t.jsxs(l.Flex,{justifyContent:"space-between",children:[t.jsxs(l.Flex,{children:[e&&t.jsx(r.Box,{paddingRight:3,children:e}),t.jsxs(r.Box,{children:[t.jsx(u.Typography,{variant:"beta",as:"h1",...h,children:o}),x?t.jsx(u.Typography,{variant:"pi",textColor:"neutral600",children:d}):d]}),n?t.jsx(r.Box,{paddingLeft:4,children:n}):null]}),t.jsx(l.Flex,{children:a?t.jsx(r.Box,{paddingLeft:2,children:a}):void 0})]})}):t.jsxs(r.Box,{ref:j,paddingLeft:10,paddingRight:10,paddingBottom:8,paddingTop:e?6:8,background:"neutral100","data-strapi-header":!0,children:[e?t.jsx(r.Box,{paddingBottom:2,children:e}):null,t.jsxs(l.Flex,{justifyContent:"space-between",children:[t.jsxs(l.Flex,{minWidth:0,children:[t.jsx(u.Typography,{as:"h1",variant:"alpha",...h,children:o}),n?t.jsx(r.Box,{paddingLeft:4,children:n}):null]}),a]}),x?t.jsx(u.Typography,{variant:"epsilon",textColor:"neutral600",as:"p",children:d}):d]})});s.displayName="BaseHeaderLayout";s.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0,sticky:!1,width:void 0};s.propTypes={navigationAction:i.default.node,primaryAction:i.default.node,secondaryAction:i.default.node,sticky:i.default.bool,subtitle:i.default.oneOfType([i.default.string,i.default.node]),title:i.default.string.isRequired,width:i.default.number};p.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0};p.propTypes={navigationAction:i.default.node,primaryAction:i.default.node,secondaryAction:i.default.node,subtitle:i.default.oneOfType([i.default.string,i.default.node]),title:i.default.string.isRequired};exports.BaseHeaderLayout=s;exports.HeaderLayout=p;

package/dist/Layout/HeaderLayout.js

@@ -1,40 +1,44 @@
-import e, { useRef as h, useState as E, useEffect as v } from "react";
-import n from "prop-types";
-import R from "styled-components";
-import { Box as a } from "../Box/Box.js";
+import { jsx as i, jsxs as s, Fragment as v } from "react/jsx-runtime";
+import R, { useRef as b, useState as x, useEffect as w } from "react";
+import t from "prop-types";
+import L from "styled-components";
+import { useElementOnScreen as S } from "../hooks/useElementOnScreen.js";
+import { useResizeObserver as B } from "../hooks/useResizeObserver.js";
+import { Box as d } from "../Box/Box.js";
 import { Flex as l } from "../Flex/Flex.js";
-import { useElementOnScreen as b } from "../hooks/useElementOnScreen.js";
-import { useResizeObserver as w } from "../hooks/useResizeObserver.js";
-import { Typography as c } from "../Typography/Typography.js";
-const L = () => {
-  const t = h(null), [o, i] = E(null), [r, d] = b({
+import { Typography as p } from "../Typography/Typography.js";
+const H = () => {
+  const e = b(null), [o, n] = x(null), [r, a] = S({
     root: null,
     rootMargin: "0px",
     threshold: 0
   });
-  return w(r, () => {
-    r.current && i(r.current.getBoundingClientRect());
-  }), v(() => {
-    t.current && i(t.current.getBoundingClientRect());
-  }, [t]), {
+  return B(r, () => {
+    r.current && n(r.current.getBoundingClientRect());
+  }), w(() => {
+    e.current && n(e.current.getBoundingClientRect());
+  }, [e]), {
     containerRef: r,
-    isVisible: d,
-    baseHeaderLayoutRef: t,
+    isVisible: a,
+    baseHeaderLayoutRef: e,
     headerSize: o
   };
-}, p = (t) => {
-  const { containerRef: o, isVisible: i, baseHeaderLayoutRef: r, headerSize: d } = L();
-  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { style: { height: d?.height }, ref: o }, i && /* @__PURE__ */ e.createElement(s, { ref: r, ...t })), !i && /* @__PURE__ */ e.createElement(s, { ...t, sticky: !0, width: d?.width }));
+}, h = (e) => {
+  const { containerRef: o, isVisible: n, baseHeaderLayoutRef: r, headerSize: a } = H();
+  return /* @__PURE__ */ s(v, { children: [
+    /* @__PURE__ */ i("div", { style: { height: a?.height }, ref: o, children: n && /* @__PURE__ */ i(c, { ref: r, ...e }) }),
+    !n && /* @__PURE__ */ i(c, { ...e, sticky: !0, width: a?.width })
+  ] });
 };
-p.displayName = "HeaderLayout";
-const x = R(a)`
-  width: ${(t) => t.width}px;
-  z-index: ${({ theme: t }) => t.zIndices[1]};
-`, s = e.forwardRef(
-  ({ navigationAction: t, primaryAction: o, secondaryAction: i, subtitle: r, title: d, sticky: f, width: g, ...u }, y) => {
-    const m = typeof r == "string";
-    return f ? /* @__PURE__ */ e.createElement(
-      x,
+h.displayName = "HeaderLayout";
+const T = L(d)`
+  width: ${(e) => e.width}px;
+  z-index: ${({ theme: e }) => e.zIndices[1]};
+`, c = R.forwardRef(
+  ({ navigationAction: e, primaryAction: o, secondaryAction: n, subtitle: r, title: a, sticky: g, width: m, ...u }, y) => {
+    const f = typeof r == "string";
+    return g ? /* @__PURE__ */ i(
+      T,
       {
         paddingLeft: 6,
         paddingRight: 6,
@@ -45,29 +49,47 @@ const x = R(a)`
         right: 0,
         background: "neutral0",
         shadow: "tableShadow",
-        width: g,
-        "data-strapi-header-sticky": !0
-      },
-      /* @__PURE__ */ e.createElement(l, { justifyContent: "space-between" }, /* @__PURE__ */ e.createElement(l, null, t && /* @__PURE__ */ e.createElement(a, { paddingRight: 3 }, t), /* @__PURE__ */ e.createElement(a, null, /* @__PURE__ */ e.createElement(c, { variant: "beta", as: "h1", ...u }, d), m ? /* @__PURE__ */ e.createElement(c, { variant: "pi", textColor: "neutral600" }, r) : r), i ? /* @__PURE__ */ e.createElement(a, { paddingLeft: 4 }, i) : null), /* @__PURE__ */ e.createElement(l, null, o ? /* @__PURE__ */ e.createElement(a, { paddingLeft: 2 }, o) : void 0))
-    ) : /* @__PURE__ */ e.createElement(
-      a,
+        width: m,
+        "data-strapi-header-sticky": !0,
+        children: /* @__PURE__ */ s(l, { justifyContent: "space-between", children: [
+          /* @__PURE__ */ s(l, { children: [
+            e && /* @__PURE__ */ i(d, { paddingRight: 3, children: e }),
+            /* @__PURE__ */ s(d, { children: [
+              /* @__PURE__ */ i(p, { variant: "beta", as: "h1", ...u, children: a }),
+              f ? /* @__PURE__ */ i(p, { variant: "pi", textColor: "neutral600", children: r }) : r
+            ] }),
+            n ? /* @__PURE__ */ i(d, { paddingLeft: 4, children: n }) : null
+          ] }),
+          /* @__PURE__ */ i(l, { children: o ? /* @__PURE__ */ i(d, { paddingLeft: 2, children: o }) : void 0 })
+        ] })
+      }
+    ) : /* @__PURE__ */ s(
+      d,
       {
         ref: y,
         paddingLeft: 10,
         paddingRight: 10,
         paddingBottom: 8,
-        paddingTop: t ? 6 : 8,
+        paddingTop: e ? 6 : 8,
         background: "neutral100",
-        "data-strapi-header": !0
-      },
-      t ? /* @__PURE__ */ e.createElement(a, { paddingBottom: 2 }, t) : null,
-      /* @__PURE__ */ e.createElement(l, { justifyContent: "space-between" }, /* @__PURE__ */ e.createElement(l, { minWidth: 0 }, /* @__PURE__ */ e.createElement(c, { as: "h1", variant: "alpha", ...u }, d), i ? /* @__PURE__ */ e.createElement(a, { paddingLeft: 4 }, i) : null), o),
-      m ? /* @__PURE__ */ e.createElement(c, { variant: "epsilon", textColor: "neutral600", as: "p" }, r) : r
+        "data-strapi-header": !0,
+        children: [
+          e ? /* @__PURE__ */ i(d, { paddingBottom: 2, children: e }) : null,
+          /* @__PURE__ */ s(l, { justifyContent: "space-between", children: [
+            /* @__PURE__ */ s(l, { minWidth: 0, children: [
+              /* @__PURE__ */ i(p, { as: "h1", variant: "alpha", ...u, children: a }),
+              n ? /* @__PURE__ */ i(d, { paddingLeft: 4, children: n }) : null
+            ] }),
+            o
+          ] }),
+          f ? /* @__PURE__ */ i(p, { variant: "epsilon", textColor: "neutral600", as: "p", children: r }) : r
+        ]
+      }
     );
   }
 );
-s.displayName = "BaseHeaderLayout";
-s.defaultProps = {
+c.displayName = "BaseHeaderLayout";
+c.defaultProps = {
   navigationAction: void 0,
   primaryAction: void 0,
   secondaryAction: void 0,
@@ -75,29 +97,31 @@ s.defaultProps = {
   sticky: !1,
   width: void 0
 };
-s.propTypes = {
-  navigationAction: n.node,
-  primaryAction: n.node,
-  secondaryAction: n.node,
-  sticky: n.bool,
-  subtitle: n.oneOfType([n.string, n.node]),
-  title: n.string.isRequired,
-  width: n.number
+c.propTypes = {
+  navigationAction: t.node,
+  primaryAction: t.node,
+  secondaryAction: t.node,
+  sticky: t.bool,
+  // TODO V2: Remove the string fallback
+  subtitle: t.oneOfType([t.string, t.node]),
+  title: t.string.isRequired,
+  width: t.number
 };
-p.defaultProps = {
+h.defaultProps = {
   navigationAction: void 0,
   primaryAction: void 0,
   secondaryAction: void 0,
   subtitle: void 0
 };
-p.propTypes = {
-  navigationAction: n.node,
-  primaryAction: n.node,
-  secondaryAction: n.node,
-  subtitle: n.oneOfType([n.string, n.node]),
-  title: n.string.isRequired
+h.propTypes = {
+  navigationAction: t.node,
+  primaryAction: t.node,
+  secondaryAction: t.node,
+  // TODO V2: Remove the string fallback
+  subtitle: t.oneOfType([t.string, t.node]),
+  title: t.string.isRequired
 };
 export {
-  s as BaseHeaderLayout,
-  p as HeaderLayout
+  c as BaseHeaderLayout,
+  h as HeaderLayout
 };

package/dist/Layout/Layout.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),u=require("prop-types"),c=require("styled-components"),d=require("../Box/Box.cjs"),t=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=t(s),a=t(u),l=t(c),i=l.default(d.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const u=require("prop-types"),l=require("styled-components"),d=require("../Box/Box.cjs"),s=e=>e&&e.__esModule?e:{default:e},r=s(u),n=s(l),a=n.default(d.Box)`
   display: grid;
   grid-template-columns: ${({hasSideNav:e})=>e?"auto 1fr":"1fr"};
-`,f=l.default(d.Box)`
+`,c=n.default(d.Box)`
   overflow-x: hidden;
-`,o=({sideNav:e,children:n})=>r.default.createElement(i,{hasSideNav:Boolean(e)},e,r.default.createElement(f,{paddingBottom:10},n));o.defaultProps={sideNav:void 0};o.propTypes={children:a.default.node.isRequired,sideNav:a.default.node};exports.Layout=o;
+`,t=({sideNav:e,children:i})=>o.jsxs(a,{hasSideNav:!!e,children:[e,o.jsx(c,{paddingBottom:10,children:i})]});t.defaultProps={sideNav:void 0};t.propTypes={children:r.default.node.isRequired,sideNav:r.default.node};exports.Layout=t;

package/dist/Layout/Layout.js

@@ -1,20 +1,24 @@
-import o from "react";
+import { jsxs as n, jsx as p } from "react/jsx-runtime";
+import "react";
 import r from "prop-types";
-import t from "styled-components";
-import { Box as d } from "../Box/Box.js";
-const a = t(d)`
+import e from "styled-components";
+import { Box as i } from "../Box/Box.js";
+const s = e(i)`
   display: grid;
-  grid-template-columns: ${({ hasSideNav: e }) => e ? "auto 1fr" : "1fr"};
-`, m = t(d)`
+  grid-template-columns: ${({ hasSideNav: o }) => o ? "auto 1fr" : "1fr"};
+`, m = e(i)`
   overflow-x: hidden;
-`, i = ({ sideNav: e, children: n }) => /* @__PURE__ */ o.createElement(a, { hasSideNav: Boolean(e) }, e, /* @__PURE__ */ o.createElement(m, { paddingBottom: 10 }, n));
-i.defaultProps = {
+`, t = ({ sideNav: o, children: d }) => /* @__PURE__ */ n(s, { hasSideNav: !!o, children: [
+  o,
+  /* @__PURE__ */ p(m, { paddingBottom: 10, children: d })
+] });
+t.defaultProps = {
   sideNav: void 0
 };
-i.propTypes = {
+t.propTypes = {
   children: r.node.isRequired,
   sideNav: r.node
 };
 export {
-  i as Layout
+  t as Layout
 };

package/dist/Layout/TwoColsLayout.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),c=require("prop-types"),r=require("../Box/Box.cjs"),i=require("../Grid/Grid.cjs"),o=require("../Grid/GridItem.cjs"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(l),a=d(c),u=({startCol:e,endCol:s})=>t.default.createElement(i.Grid,{gap:4},t.default.createElement(o.GridItem,{col:9,s:12},t.default.createElement(r.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow"},e)),t.default.createElement(o.GridItem,{col:3,s:12},t.default.createElement(r.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow"},s)));u.propTypes={endCol:a.default.node.isRequired,startCol:a.default.node.isRequired};exports.TwoColsLayout=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const i=require("prop-types"),a=require("../Grid/Grid.cjs"),o=require("../Grid/GridItem.cjs"),t=require("../Box/Box.cjs"),n=e=>e&&e.__esModule?e:{default:e},s=n(i),d=({startCol:e,endCol:u})=>r.jsxs(a.Grid,{gap:4,children:[r.jsx(o.GridItem,{col:9,s:12,children:r.jsx(t.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:e})}),r.jsx(o.GridItem,{col:3,s:12,children:r.jsx(t.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:u})})]});d.propTypes={endCol:s.default.node.isRequired,startCol:s.default.node.isRequired};exports.TwoColsLayout=d;

package/dist/Layout/TwoColsLayout.js

@@ -1,12 +1,16 @@
-import e from "react";
-import r from "prop-types";
-import { Box as o } from "../Box/Box.js";
-import { Grid as m } from "../Grid/Grid.js";
-import { GridItem as t } from "../Grid/GridItem.js";
-const l = ({ startCol: a, endCol: d }) => /* @__PURE__ */ e.createElement(m, { gap: 4 }, /* @__PURE__ */ e.createElement(t, { col: 9, s: 12 }, /* @__PURE__ */ e.createElement(o, { hasRadius: !0, background: "neutral0", shadow: "tableShadow" }, a)), /* @__PURE__ */ e.createElement(t, { col: 3, s: 12 }, /* @__PURE__ */ e.createElement(o, { hasRadius: !0, background: "neutral0", shadow: "tableShadow" }, d)));
+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: r.node.isRequired,
-  startCol: r.node.isRequired
+  endCol: o.node.isRequired,
+  startCol: o.node.isRequired
 };
 export {
   l as TwoColsLayout

package/dist/Layout/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("./Layout.cjs"),e=require("./ActionLayout.cjs"),u=require("./ContentLayout.cjs"),o=require("./HeaderLayout.cjs"),a=require("./TwoColsLayout.cjs"),r=require("./GridLayout.cjs");exports.Layout=t.Layout;exports.ActionLayout=e.ActionLayout;exports.ContentLayout=u.ContentLayout;exports.BaseHeaderLayout=o.BaseHeaderLayout;exports.HeaderLayout=o.HeaderLayout;exports.TwoColsLayout=a.TwoColsLayout;exports.GridLayout=r.GridLayout;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./Layout.cjs"),e=require("./ActionLayout.cjs"),a=require("./ContentLayout.cjs"),o=require("./HeaderLayout.cjs"),u=require("./TwoColsLayout.cjs"),r=require("./GridLayout.cjs");exports.Layout=t.Layout;exports.ActionLayout=e.ActionLayout;exports.ContentLayout=a.ContentLayout;exports.BaseHeaderLayout=o.BaseHeaderLayout;exports.HeaderLayout=o.HeaderLayout;exports.TwoColsLayout=u.TwoColsLayout;exports.GridLayout=r.GridLayout;

package/dist/Link/Link.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),y=require("react"),g=require("@strapi/icons"),j=require("react-router-dom"),m=require("styled-components"),x=require("../Box/Box.cjs"),h=require("../themes/utils.cjs"),c=require("../Typography/Typography.cjs"),_=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function b(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const v=b(y),l=_(m),q=l.default.a`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),g=require("react"),y=require("@strapi/icons"),m=require("react-router-dom"),x=require("styled-components"),j=require("../themes/utils.cjs"),c=require("../Typography/Typography.cjs"),_=require("../Box/Box.cjs"),h=e=>e&&e.__esModule?e:{default:e};function b(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const q=b(g),l=h(x),v=l.default.a`
   display: inline-flex;
   align-items: center;
   text-decoration: none;
@@ -27,7 +27,7 @@
     color: ${({theme:e})=>e.colors.primary700};
   }
 
-  ${h.buttonFocusStyle};
-`,s=l.default(x.Box)`
+  ${j.buttonFocusStyle};
+`,i=l.default(_.Box)`
   display: flex;
-`,L=v.forwardRef(({children:e,href:r,to:t,disabled:n=!1,startIcon:i,endIcon:a,...u},d)=>{const p=r?"_blank":void 0,f=r?"noreferrer noopener":void 0;return o.jsxs(q,{as:t&&!n?j.NavLink:"a",target:p,rel:f,to:n?void 0:t,href:n?"#":r,disabled:n,ref:d,...u,children:[i&&o.jsx(s,{as:"span","aria-hidden":!0,paddingRight:2,children:i}),o.jsx(c.Typography,{children:e}),a&&!r&&o.jsx(s,{as:"span","aria-hidden":!0,paddingLeft:2,children:a}),r&&o.jsx(s,{as:"span","aria-hidden":!0,paddingLeft:2,children:o.jsx(g.ExternalLink,{})})]})});exports.Link=L;
+`,k=q.forwardRef(({children:e,href:r,to:t,disabled:n=!1,startIcon:a,endIcon:s,...u},d)=>{const p=r?"_blank":void 0,f=r?"noreferrer noopener":void 0;return o.jsxs(v,{as:t&&!n?m.NavLink:"a",target:p,rel:f,to:n?void 0:t,href:n?"#":r,disabled:n,ref:d,...u,children:[a&&o.jsx(i,{as:"span","aria-hidden":!0,paddingRight:2,children:a}),o.jsx(c.Typography,{children:e}),s&&!r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:s}),r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:o.jsx(y.ExternalLink,{})})]})});exports.Link=k;

package/dist/Link/Link.js

@@ -3,20 +3,15 @@ import * as f from "react";
 import { ExternalLink as u } from "@strapi/icons";
 import { NavLink as g } from "react-router-dom";
 import s from "styled-components";
-import { Box as y } from "../Box/Box.js";
-import { buttonFocusStyle as h } from "../themes/utils.js";
+import { buttonFocusStyle as y } from "../themes/utils.js";
 import { Typography as p } from "../Typography/Typography.js";
+import { Box as h } from "../Box/Box.js";
 const x = s.a`
   display: inline-flex;
   align-items: center;
   text-decoration: none;
-  pointer-events: ${({
-  disabled: r
-}) => r ? "none" : void 0};
-  color: ${({
-  disabled: r,
-  theme: o
-}) => r ? o.colors.neutral600 : o.colors.primary600};
+  pointer-events: ${({ disabled: r }) => r ? "none" : void 0};
+  color: ${({ disabled: r, theme: o }) => r ? o.colors.neutral600 : o.colors.primary600};
 
   svg path {
     transition: fill 150ms ease-out;
@@ -33,56 +28,17 @@ const x = s.a`
   }
 
   &:hover {
-    color: ${({
-  theme: r
-}) => r.colors.primary500};
+    color: ${({ theme: r }) => r.colors.primary500};
   }
 
   &:active {
-    color: ${({
-  theme: r
-}) => r.colors.primary700};
+    color: ${({ theme: r }) => r.colors.primary700};
   }
 
-  ${h};
-`, t = s(y)`
+  ${y};
+`, t = s(h)`
   display: flex;
-`, z = f.forwardRef(({
-  children: r,
-  href: o,
-  to: i,
-  disabled: n = !1,
-  startIcon: a,
-  endIcon: l,
-  ...c
-}, d) => m(x, {
-  as: i && !n ? g : "a",
-  target: o ? "_blank" : void 0,
-  rel: o ? "noreferrer noopener" : void 0,
-  to: n ? void 0 : i,
-  href: n ? "#" : o,
-  disabled: n,
-  ref: d,
-  ...c,
-  children: [a && e(t, {
-    as: "span",
-    "aria-hidden": !0,
-    paddingRight: 2,
-    children: a
-  }), e(p, {
-    children: r
-  }), l && !o && e(t, {
-    as: "span",
-    "aria-hidden": !0,
-    paddingLeft: 2,
-    children: l
-  }), o && e(t, {
-    as: "span",
-    "aria-hidden": !0,
-    paddingLeft: 2,
-    children: e(u, {})
-  })]
-}));
+`, z = f.forwardRef(({ children: r, href: o, to: i, disabled: n = !1, startIcon: a, endIcon: l, ...c }, d) => m(x, { as: i && !n ? g : "a", target: o ? "_blank" : void 0, rel: o ? "noreferrer noopener" : void 0, to: n ? void 0 : i, href: n ? "#" : o, disabled: n, ref: d, ...c, children: [a && e(t, { as: "span", "aria-hidden": !0, paddingRight: 2, children: a }), e(p, { children: r }), l && !o && e(t, { as: "span", "aria-hidden": !0, paddingLeft: 2, children: l }), o && e(t, { as: "span", "aria-hidden": !0, paddingLeft: 2, children: e(u, {}) })] }));
 export {
   z as Link
 };

package/dist/Link/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Link.cjs");exports.Link=e.Link;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Link.cjs");exports.Link=e.Link;

package/dist/LinkButton/LinkButton.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),j=require("react"),h=require("react-router-dom"),m=require("styled-components"),x=require("../BaseButton/BaseButton.cjs"),o=require("../Button/utils.cjs"),l=require("../Flex/Flex.cjs"),v=require("../Typography/Typography.cjs"),B=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function S(e){if(e&&e.__esModule)return e;const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const _=S(j),q=B(m),k=q.default(x.BaseButtonWrapper)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),S=require("react"),h=require("react-router-dom"),v=require("styled-components"),o=require("../Button/utils.cjs"),_=require("../BaseButton/BaseButton.cjs"),c=require("../Flex/Flex.cjs"),j=require("../Typography/Typography.cjs"),m=e=>e&&e.__esModule?e:{default:e};function x(e){if(e&&e.__esModule)return e;const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return n.default=e,Object.freeze(n)}const q=x(S),k=m(v),B=k.default(_.BaseButtonWrapper)`
   &[aria-disabled='true'] {
     ${o.getDisabledStyle}
     &:active {
@@ -12,4 +12,4 @@
     ${o.getActiveStyle}
   }
   ${o.getVariantStyle}
-`,R=_.forwardRef(({variant:e="default",startIcon:n,endIcon:r,disabled:t=!1,children:p,size:i="S",href:u,to:s,...g},f)=>{const y=u?"_blank":void 0,b=u?"noreferrer noopener":void 0,c=i==="S"?2:"10px",d=4;return a.jsxs(k,{ref:f,"aria-disabled":t,size:i,variant:e,target:y,rel:b,to:t?void 0:s,href:t?"#":u,background:"buttonPrimary600",borderColor:"buttonPrimary600",hasRadius:!0,gap:2,inline:!0,paddingBottom:c,paddingLeft:d,paddingRight:d,paddingTop:c,pointerEvents:t?"none":void 0,...g,as:s&&!t?h.NavLink:"a",children:[n&&a.jsx(l.Flex,{"aria-hidden":!0,children:n}),a.jsx(v.Typography,{variant:i==="S"?"pi":void 0,fontWeight:"bold",textColor:"buttonNeutral0",children:p}),r&&a.jsx(l.Flex,{"aria-hidden":!0,children:r})]})});exports.LinkButton=R;
+`,R=q.forwardRef(({variant:e="default",startIcon:n,endIcon:r,disabled:t=!1,children:p,size:i="S",href:u,to:d,...f},g)=>{const y=u?"_blank":void 0,b=u?"noreferrer noopener":void 0,l=i==="S"?2:"10px",s=4;return a.jsxs(B,{ref:g,"aria-disabled":t,size:i,variant:e,target:y,rel:b,to:t?void 0:d,href:t?"#":u,background:"buttonPrimary600",borderColor:"buttonPrimary600",hasRadius:!0,gap:2,inline:!0,paddingBottom:l,paddingLeft:s,paddingRight:s,paddingTop:l,pointerEvents:t?"none":void 0,...f,as:d&&!t?h.NavLink:"a",children:[n&&a.jsx(c.Flex,{"aria-hidden":!0,children:n}),a.jsx(j.Typography,{variant:i==="S"?"pi":void 0,fontWeight:"bold",textColor:"buttonNeutral0",children:p}),r&&a.jsx(c.Flex,{"aria-hidden":!0,children:r})]})});exports.LinkButton=R;

package/dist/LinkButton/LinkButton.js

@@ -2,11 +2,11 @@ import { jsxs as v, jsx as n } from "react/jsx-runtime";
 import * as y from "react";
 import { NavLink as S } from "react-router-dom";
 import b from "styled-components";
-import { BaseButtonWrapper as x } from "../BaseButton/BaseButton.js";
-import { getDisabledStyle as f, getHoverStyle as k, getActiveStyle as $, getVariantStyle as B } from "../Button/utils.js";
+import { getDisabledStyle as f, getHoverStyle as x, getActiveStyle as k, getVariantStyle as $ } from "../Button/utils.js";
+import { BaseButtonWrapper as B } from "../BaseButton/BaseButton.js";
 import { Flex as u } from "../Flex/Flex.js";
 import { Typography as L } from "../Typography/Typography.js";
-const R = b(x)`
+const R = b(B)`
   &[aria-disabled='true'] {
     ${f}
     &:active {
@@ -14,58 +14,15 @@ const R = b(x)`
     }
   }
   &:hover {
-    ${k}
+    ${x}
   }
   &:active {
-    ${$}
+    ${k}
   }
-  ${B}
-`, A = y.forwardRef(({
-  variant: l = "default",
-  startIcon: o,
-  endIcon: i,
-  disabled: r = !1,
-  children: m,
-  size: t = "S",
-  href: e,
-  to: a,
-  ...g
-}, s) => {
+  ${$}
+`, A = y.forwardRef(({ variant: l = "default", startIcon: o, endIcon: i, disabled: r = !1, children: m, size: t = "S", href: e, to: a, ...g }, s) => {
   const c = e ? "_blank" : void 0, h = e ? "noreferrer noopener" : void 0, d = t === "S" ? 2 : "10px", p = 4;
-  return v(R, {
-    ref: s,
-    "aria-disabled": r,
-    size: t,
-    variant: l,
-    target: c,
-    rel: h,
-    to: r ? void 0 : a,
-    href: r ? "#" : e,
-    background: "buttonPrimary600",
-    borderColor: "buttonPrimary600",
-    hasRadius: !0,
-    gap: 2,
-    inline: !0,
-    paddingBottom: d,
-    paddingLeft: p,
-    paddingRight: p,
-    paddingTop: d,
-    pointerEvents: r ? "none" : void 0,
-    ...g,
-    as: a && !r ? S : "a",
-    children: [o && n(u, {
-      "aria-hidden": !0,
-      children: o
-    }), n(L, {
-      variant: t === "S" ? "pi" : void 0,
-      fontWeight: "bold",
-      textColor: "buttonNeutral0",
-      children: m
-    }), i && n(u, {
-      "aria-hidden": !0,
-      children: i
-    })]
-  });
+  return v(R, { ref: s, "aria-disabled": r, size: t, variant: l, target: c, rel: h, to: r ? void 0 : a, href: r ? "#" : e, background: "buttonPrimary600", borderColor: "buttonPrimary600", hasRadius: !0, gap: 2, inline: !0, paddingBottom: d, paddingLeft: p, paddingRight: p, paddingTop: d, pointerEvents: r ? "none" : void 0, ...g, as: a && !r ? S : "a", children: [o && n(u, { "aria-hidden": !0, children: o }), n(L, { variant: t === "S" ? "pi" : void 0, fontWeight: "bold", textColor: "buttonNeutral0", children: m }), i && n(u, { "aria-hidden": !0, children: i })] });
 });
 export {
   A as LinkButton

package/dist/LinkButton/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("./LinkButton.cjs");exports.LinkButton=t.LinkButton;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./LinkButton.cjs");exports.LinkButton=t.LinkButton;

package/dist/LiveRegions/LiveRegions.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),i=require("./constants.cjs"),s=require("../VisuallyHidden/VisuallyHidden.cjs"),l=()=>e.jsxs(s.VisuallyHidden,{children:[e.jsx("p",{role:"log","aria-live":"polite",id:i.LiveRegionIds.Log,"aria-relevant":"all"}),e.jsx("p",{role:"status","aria-live":"polite",id:i.LiveRegionIds.Status,"aria-relevant":"all"}),e.jsx("p",{role:"alert","aria-live":"assertive",id:i.LiveRegionIds.Alert,"aria-relevant":"all"})]});exports.LiveRegions=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("./constants.cjs"),l=require("../VisuallyHidden/VisuallyHidden.cjs"),r=()=>e.jsxs(l.VisuallyHidden,{children:[e.jsx("p",{role:"log","aria-live":"polite",id:i.LiveRegionIds.Log,"aria-relevant":"all"}),e.jsx("p",{role:"status","aria-live":"polite",id:i.LiveRegionIds.Status,"aria-relevant":"all"}),e.jsx("p",{role:"alert","aria-live":"assertive",id:i.LiveRegionIds.Alert,"aria-relevant":"all"})]});exports.LiveRegions=r;

package/dist/LiveRegions/LiveRegions.js

@@ -1,24 +1,7 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
 import { LiveRegionIds as i } from "./constants.js";
 import { VisuallyHidden as a } from "../VisuallyHidden/VisuallyHidden.js";
-const s = () => r(a, {
-  children: [e("p", {
-    role: "log",
-    "aria-live": "polite",
-    id: i.Log,
-    "aria-relevant": "all"
-  }), e("p", {
-    role: "status",
-    "aria-live": "polite",
-    id: i.Status,
-    "aria-relevant": "all"
-  }), e("p", {
-    role: "alert",
-    "aria-live": "assertive",
-    id: i.Alert,
-    "aria-relevant": "all"
-  })]
-});
+const s = () => r(a, { children: [e("p", { role: "log", "aria-live": "polite", id: i.Log, "aria-relevant": "all" }), e("p", { role: "status", "aria-live": "polite", id: i.Status, "aria-relevant": "all" }), e("p", { role: "alert", "aria-live": "assertive", id: i.Alert, "aria-relevant": "all" })] });
 export {
   s as LiveRegions
 };

package/dist/LiveRegions/constants.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={Log:"live-region-log",Status:"live-region-status",Alert:"live-region-alert"};exports.LiveRegionIds=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={Log:"live-region-log",Status:"live-region-status",Alert:"live-region-alert"};exports.LiveRegionIds=e;

package/dist/LiveRegions/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./useNotifyAT.cjs"),i=require("./LiveRegions.cjs");exports.useNotifyAT=e.useNotifyAT;exports.LiveRegions=i.LiveRegions;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useNotifyAT.cjs"),i=require("./LiveRegions.cjs");exports.useNotifyAT=e.useNotifyAT;exports.LiveRegions=i.LiveRegions;

package/dist/LiveRegions/useNotifyAT.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),o=require("./constants.cjs"),n=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Log}`);e&&(e.innerText=t)},s=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Status}`);e&&(e.innerText=t)},r=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Alert}`);e&&(e.innerText=t)},i=()=>(c.useEffect(()=>()=>{n(""),r(""),s("")},[]),{notifyLog:n,notifyAlert:r,notifyStatus:s});exports.useNotifyAT=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react"),o=require("./constants.cjs"),n=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Log}`);e&&(e.innerText=t)},r=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Status}`);e&&(e.innerText=t)},s=t=>{const e=document.querySelector(`#${o.LiveRegionIds.Alert}`);e&&(e.innerText=t)},c=()=>(i.useEffect(()=>()=>{n(""),s(""),r("")},[]),{notifyLog:n,notifyAlert:s,notifyStatus:r});exports.useNotifyAT=c;

package/dist/Loader/Loader.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),o=require("react"),n=require("styled-components"),i=require("./assets/loader.cjs"),l=require("../VisuallyHidden/VisuallyHidden.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function d(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const u=d(o),f=c(n),m=n.keyframes`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),s=require("react"),o=require("styled-components"),i=require("./assets/loader.svg.cjs"),l=require("../VisuallyHidden/VisuallyHidden.cjs"),c=e=>e&&e.__esModule?e:{default:e};function d(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const u=d(s),f=c(o),m=o.keyframes`
   from {
     transform: rotate(0deg);
   }
@@ -9,4 +9,4 @@
   animation: ${m} 1s infinite linear;
   will-change: transform;
   ${({small:e,theme:t})=>e&&`width: ${t.spaces[6]}; height: ${t.spaces[6]};`}
-`,y=u.forwardRef(({children:e,small:t=!1,...r},a)=>s.jsxs("div",{role:"alert","aria-live":"assertive",ref:a,...r,children:[s.jsx(l.VisuallyHidden,{children:e}),s.jsx(g,{src:i,"aria-hidden":!0,small:t})]}));exports.Loader=y;
+`,p=u.forwardRef(({children:e,small:t=!1,...r},n)=>a.jsxs("div",{role:"alert","aria-live":"assertive",ref:n,...r,children:[a.jsx(l.VisuallyHidden,{children:e}),a.jsx(g,{src:i,"aria-hidden":!0,small:t})]}));exports.Loader=p;