@strapi/design-system 1.7.7 → 1.7.8

package/dist/v2/MainNav/NavLink.js

@@ -1,27 +1,26 @@
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import f from "react";
-import e from "prop-types";
+import $ from "react";
 import t from "styled-components";
-import { useMainNav as y } from "./MainNavContext.js";
-import { Box as b } from "../../Box/Box.js";
+import { useMainNav as f } from "./MainNavContext.js";
+import { Box as g } from "../../Box/Box.js";
 import { BaseLink as v } from "../../BaseLink/BaseLink.js";
-import { Typography as i } from "../../Typography/Typography.js";
-import { Flex as $ } from "../../Flex/Flex.js";
-import { Badge as k } from "../../Badge/Badge.js";
-import { Tooltip as x } from "../../Tooltip/Tooltip.js";
-const m = t(b)`
+import { Typography as e } from "../../Typography/Typography.js";
+import { Flex as h } from "../../Flex/Flex.js";
+import { Badge as y } from "../../Badge/Badge.js";
+import { Tooltip as b } from "../../Tooltip/Tooltip.js";
+const p = t(g)`
   svg {
     width: 1rem;
     height: 1rem;
   }
-`, u = t(v)`
+`, d = t(v)`
   position: relative;
   text-decoration: none;
   display: block;
   border-radius: ${({ theme: r }) => r.borderRadius};
   background: ${({ theme: r }) => r.colors.neutral0};
 
-  ${i} {
+  ${e} {
     color: ${({ theme: r }) => r.colors.neutral600};
   }
 
@@ -32,7 +31,7 @@ const m = t(b)`
   &:hover {
     background: ${({ theme: r }) => r.colors.neutral100};
 
-    ${i} {
+    ${e} {
       color: ${({ theme: r }) => r.colors.neutral700};
     }
 
@@ -48,22 +47,22 @@ const m = t(b)`
       fill: ${({ theme: r }) => r.colors.primary600};
     }
 
-    ${i} {
+    ${e} {
       color: ${({ theme: r }) => r.colors.primary600};
       font-weight: 500;
     }
   }
-`, h = t($)`
+`, m = t(h)`
   padding: ${({ theme: r }) => `${r.spaces[2]} ${r.spaces[3]}`};
-`, g = t(k)`
-  ${({ theme: r, condensed: a }) => a && `
+`, u = t(y)`
+  ${({ theme: r, condensed: i }) => i && `
 	  position: absolute;
     // Values based on visual aspect 
     top: -${r.spaces[3]};
     right:  -${r.spaces[1]};
   `}
 
-  ${i} {
+  ${e} {
     //find a solution to remove !important
     color: ${({ theme: r }) => r.colors.neutral0} !important;
     line-height: 0;
@@ -77,27 +76,7 @@ const m = t(b)`
   padding: ${({ theme: r }) => `0 ${r.spaces[2]}`};
   border-radius: ${({ theme: r }) => r.spaces[10]};
   background: ${({ theme: r }) => r.colors.primary600};
-`, l = f.forwardRef(({ children: r, icon: a, badgeContent: n, badgeAriaLabel: c, ...d }, p) => y() ? /* @__PURE__ */ o(u, { ref: p, ...d, children: /* @__PURE__ */ o(x, { position: "right", label: r, children: /* @__PURE__ */ s(h, { as: "span", justifyContent: "center", children: [
-  /* @__PURE__ */ o(m, { "aria-hidden": !0, paddingRight: 0, as: "span", children: a }),
-  n && /* @__PURE__ */ o(g, { condensed: !0, "aria-label": c, children: n })
-] }) }) }) : /* @__PURE__ */ o(u, { ref: p, ...d, children: /* @__PURE__ */ s(h, { as: "span", justifyContent: "space-between", children: [
-  /* @__PURE__ */ s($, { children: [
-    /* @__PURE__ */ o(m, { "aria-hidden": !0, paddingRight: 3, as: "span", children: a }),
-    /* @__PURE__ */ o(i, { children: r })
-  ] }),
-  n && /* @__PURE__ */ o(g, { justifyContent: "center", "aria-label": c, children: n })
-] }) }));
-l.displayName = "NavLink";
-l.defaultProps = {
-  badgeContent: void 0,
-  badgeAriaLabel: void 0
-};
-l.propTypes = {
-  badgeAriaLabel: e.string,
-  badgeContent: e.oneOfType([e.string, e.number]),
-  children: e.string.isRequired,
-  icon: e.node.isRequired
-};
+`, C = $.forwardRef(({ children: r, icon: i, badgeContent: a, badgeAriaLabel: n, ...l }, c) => f() ? o(d, { ref: c, ...l, children: o(b, { position: "right", label: r, children: s(m, { as: "span", justifyContent: "center", children: [o(p, { "aria-hidden": !0, paddingRight: 0, as: "span", children: i }), a && o(u, { condensed: !0, "aria-label": n, children: a })] }) }) }) : o(d, { ref: c, ...l, children: s(m, { as: "span", justifyContent: "space-between", children: [s(h, { children: [o(p, { "aria-hidden": !0, paddingRight: 3, as: "span", children: i }), o(e, { children: r })] }), a && o(u, { justifyContent: "center", "aria-label": n, children: a })] }) }));
 export {
-  l as NavLink
+  C as NavLink
 };

package/dist/v2/MainNav/NavSection.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),x=require("prop-types"),g=require("./MainNavContext.cjs"),i=require("../../Flex/Flex.cjs"),l=require("../../Box/Box.cjs"),h=require("../../Divider/Divider.cjs"),m=require("../../VisuallyHidden/VisuallyHidden.cjs"),j=require("../../Typography/Typography.cjs"),q=n=>n&&n.__esModule?n:{default:n},u=q(x),p=({label:n,children:d,horizontal:r=!1,spacing:a=2,...c})=>g.useMainNav()?e.jsxs(i.Flex,{direction:"column",alignItems:"stretch",gap:2,children:[e.jsxs(l.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",hasRadius:!0,as:"span",children:[e.jsx(h.Divider,{}),e.jsx(m.VisuallyHidden,{children:e.jsx("span",{children:n})})]}),e.jsx(i.Flex,{as:"ul",gap:a,direction:r?"row":"column",alignItems:r?"center":"stretch",...c,children:o.Children.map(d,(t,s)=>e.jsx("li",{children:t},s))})]}):e.jsxs(i.Flex,{direction:"column",alignItems:"stretch",gap:2,children:[e.jsx(l.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",paddingRight:3,paddingLeft:3,hasRadius:!0,as:"span",children:e.jsx(j.Typography,{variant:"sigma",textColor:"neutral600",children:n})}),e.jsx(i.Flex,{as:"ul",gap:a,direction:r?"row":"column",alignItems:r?"center":"stretch",...c,children:o.Children.map(d,(t,s)=>e.jsx("li",{children:t},s))})]});p.propTypes={children:u.default.node.isRequired,label:u.default.string.isRequired};exports.NavSection=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),u=require("./MainNavContext.cjs"),r=require("../../Flex/Flex.cjs"),l=require("../../Box/Box.cjs"),x=require("../../Divider/Divider.cjs"),g=require("../../VisuallyHidden/VisuallyHidden.cjs"),p=require("../../Typography/Typography.cjs"),h=({label:s,children:a,horizontal:n=!1,spacing:d=2,...c})=>u.useMainNav()?e.jsxs(r.Flex,{direction:"column",alignItems:"stretch",gap:2,children:[e.jsxs(l.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",hasRadius:!0,as:"span",children:[e.jsx(x.Divider,{}),e.jsx(g.VisuallyHidden,{children:e.jsx("span",{children:s})})]}),e.jsx(r.Flex,{as:"ul",gap:d,direction:n?"row":"column",alignItems:n?"center":"stretch",...c,children:o.Children.map(a,(i,t)=>e.jsx("li",{children:i},t))})]}):e.jsxs(r.Flex,{direction:"column",alignItems:"stretch",gap:2,children:[e.jsx(l.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",paddingRight:3,paddingLeft:3,hasRadius:!0,as:"span",children:e.jsx(p.Typography,{variant:"sigma",textColor:"neutral600",children:s})}),e.jsx(r.Flex,{as:"ul",gap:d,direction:n?"row":"column",alignItems:n?"center":"stretch",...c,children:o.Children.map(a,(i,t)=>e.jsx("li",{children:i},t))})]});exports.NavSection=h;

package/dist/v2/MainNav/NavSection.js

@@ -1,46 +1,12 @@
 import { jsxs as d, jsx as r } from "react/jsx-runtime";
-import { Children as m } from "react";
-import p from "prop-types";
-import { useMainNav as u } from "./MainNavContext.js";
-import { Flex as i } from "../../Flex/Flex.js";
+import { Children as s } from "react";
+import { useMainNav as p } from "./MainNavContext.js";
+import { Flex as e } from "../../Flex/Flex.js";
 import { Box as l } from "../../Box/Box.js";
-import { Divider as g } from "../../Divider/Divider.js";
-import { VisuallyHidden as h } from "../../VisuallyHidden/VisuallyHidden.js";
-import { Typography as f } from "../../Typography/Typography.js";
-const x = ({ label: o, children: a, horizontal: e = !1, spacing: s = 2, ...c }) => u() ? /* @__PURE__ */ d(i, { direction: "column", alignItems: "stretch", gap: 2, children: [
-  /* @__PURE__ */ d(l, { paddingTop: 1, paddingBottom: 1, background: "neutral0", hasRadius: !0, as: "span", children: [
-    /* @__PURE__ */ r(g, {}),
-    /* @__PURE__ */ r(h, { children: /* @__PURE__ */ r("span", { children: o }) })
-  ] }),
-  /* @__PURE__ */ r(
-    i,
-    {
-      as: "ul",
-      gap: s,
-      direction: e ? "row" : "column",
-      alignItems: e ? "center" : "stretch",
-      ...c,
-      children: m.map(a, (n, t) => /* @__PURE__ */ r("li", { children: n }, t))
-    }
-  )
-] }) : /* @__PURE__ */ d(i, { direction: "column", alignItems: "stretch", gap: 2, children: [
-  /* @__PURE__ */ r(l, { paddingTop: 1, paddingBottom: 1, background: "neutral0", paddingRight: 3, paddingLeft: 3, hasRadius: !0, as: "span", children: /* @__PURE__ */ r(f, { variant: "sigma", textColor: "neutral600", children: o }) }),
-  /* @__PURE__ */ r(
-    i,
-    {
-      as: "ul",
-      gap: s,
-      direction: e ? "row" : "column",
-      alignItems: e ? "center" : "stretch",
-      ...c,
-      children: m.map(a, (n, t) => /* @__PURE__ */ r("li", { children: n }, t))
-    }
-  )
-] });
-x.propTypes = {
-  children: p.node.isRequired,
-  label: p.string.isRequired
-};
+import { Divider as u } from "../../Divider/Divider.js";
+import { VisuallyHidden as g } from "../../VisuallyHidden/VisuallyHidden.js";
+import { Typography as h } from "../../Typography/Typography.js";
+const k = ({ label: o, children: a, horizontal: n = !1, spacing: c = 2, ...m }) => p() ? d(e, { direction: "column", alignItems: "stretch", gap: 2, children: [d(l, { paddingTop: 1, paddingBottom: 1, background: "neutral0", hasRadius: !0, as: "span", children: [r(u, {}), r(g, { children: r("span", { children: o }) })] }), r(e, { as: "ul", gap: c, direction: n ? "row" : "column", alignItems: n ? "center" : "stretch", ...m, children: s.map(a, (i, t) => r("li", { children: i }, t)) })] }) : d(e, { direction: "column", alignItems: "stretch", gap: 2, children: [r(l, { paddingTop: 1, paddingBottom: 1, background: "neutral0", paddingRight: 3, paddingLeft: 3, hasRadius: !0, as: "span", children: r(h, { variant: "sigma", textColor: "neutral600", children: o }) }), r(e, { as: "ul", gap: c, direction: n ? "row" : "column", alignItems: n ? "center" : "stretch", ...m, children: s.map(a, (i, t) => r("li", { children: i }, t)) })] });
 export {
-  x as NavSection
+  k as NavSection
 };

package/dist/v2/MainNav/NavSections.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),u=require("prop-types"),a=require("styled-components"),p=require("../../Box/Box.cjs"),f=require("../../Flex/Flex.cjs"),o=e=>e&&e.__esModule?e:{default:e},g=o(u),x=o(a),y=x.default(p.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),l=require("react"),c=require("styled-components"),d=require("../../Box/Box.cjs"),u=require("../../Flex/Flex.cjs"),a=e=>e&&e.__esModule?e:{default:e},g=a(c),x=g.default(d.Box)`
   flex-grow: 1;
   overflow-y: auto;
-`,n=({children:e,spacing:s=4,horizontal:r=!1,...i})=>t.jsx(y,{paddingLeft:3,paddingRight:2,paddingTop:3,paddingBottom:8,children:t.jsx(f.Flex,{as:"ul",gap:s,direction:r?"row":"column",alignItems:r?"center":"stretch",...i,children:c.Children.map(e,(d,l)=>t.jsx("li",{children:d},l))})});n.propTypes={children:g.default.node.isRequired};exports.NavSections=n;
+`,f=({children:e,spacing:r=4,horizontal:o=!1,...n})=>t.jsx(x,{paddingLeft:3,paddingRight:2,paddingTop:3,paddingBottom:8,children:t.jsx(u.Flex,{as:"ul",gap:r,direction:o?"row":"column",alignItems:o?"center":"stretch",...n,children:l.Children.map(e,(i,s)=>t.jsx("li",{children:i},s))})});exports.NavSections=f;

package/dist/v2/MainNav/NavSections.js

@@ -1,26 +1,12 @@
-import { jsx as r } from "react/jsx-runtime";
-import { Children as d } from "react";
-import m from "prop-types";
-import l from "styled-components";
-import { Box as s } from "../../Box/Box.js";
-import { Flex as c } from "../../Flex/Flex.js";
-const a = l(s)`
+import { jsx as o } from "react/jsx-runtime";
+import { Children as m } from "react";
+import p from "styled-components";
+import { Box as l } from "../../Box/Box.js";
+import { Flex as a } from "../../Flex/Flex.js";
+const c = p(l)`
   flex-grow: 1;
   overflow-y: auto;
-`, f = ({ children: e, spacing: i = 4, horizontal: o = !1, ...t }) => /* @__PURE__ */ r(a, { paddingLeft: 3, paddingRight: 2, paddingTop: 3, paddingBottom: 8, children: /* @__PURE__ */ r(
-  c,
-  {
-    as: "ul",
-    gap: i,
-    direction: o ? "row" : "column",
-    alignItems: o ? "center" : "stretch",
-    ...t,
-    children: d.map(e, (p, n) => /* @__PURE__ */ r("li", { children: p }, n))
-  }
-) });
-f.propTypes = {
-  children: m.node.isRequired
-};
+`, u = ({ children: t, spacing: e = 4, horizontal: r = !1, ...i }) => o(c, { paddingLeft: 3, paddingRight: 2, paddingTop: 3, paddingBottom: 8, children: o(a, { as: "ul", gap: e, direction: r ? "row" : "column", alignItems: r ? "center" : "stretch", ...i, children: m.map(t, (n, d) => o("li", { children: n }, d)) }) });
 export {
-  f as NavSections
+  u as NavSections
 };

package/dist/v2/MainNav/NavUser.cjs

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("react"),x=require("prop-types"),f=require("styled-components"),y=require("./MainNavContext.cjs"),d=require("../../Box/Box.cjs"),v=require("../../Flex/Flex.cjs"),a=require("../../Avatar/Avatar.cjs"),g=require("../../VisuallyHidden/VisuallyHidden.cjs"),j=require("../../Typography/Typography.cjs"),i=e=>e&&e.__esModule?e:{default:e},q=i(p),s=i(x),h=i(f),_=h.default(d.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),u=require("react"),c=require("styled-components"),x=require("./MainNavContext.cjs"),i=require("../../Box/Box.cjs"),p=require("../../Flex/Flex.cjs"),s=require("../../Avatar/Avatar.cjs"),f=require("../../VisuallyHidden/VisuallyHidden.cjs"),h=require("../../Typography/Typography.cjs"),o=e=>e&&e.__esModule?e:{default:e},j=o(u),y=o(c),g=y.default(i.Box)`
   border-top: 1px solid ${({theme:e})=>e.colors.neutral150};
-`,r=q.default.forwardRef(({src:e,children:n,initials:l,...u},c)=>{const o=y.useMainNav();return t.jsx(_,{paddingTop:3,paddingBottom:3,paddingLeft:5,paddingRight:5,...u,children:t.jsxs(v.Flex,{as:"button",justifyContent:o?"center":void 0,ref:c,children:[e?t.jsx(a.Avatar,{src:e,alt:"","aria-hidden":!0}):t.jsx(a.Initials,{children:l}),o?t.jsx(g.VisuallyHidden,{children:t.jsx("span",{children:n})}):t.jsx(d.Box,{width:`${130/16}rem`,paddingLeft:2,as:"span",children:t.jsx(j.Typography,{ellipsis:!0,textColor:"neutral600",children:n})})]})})});r.displayName="NavUser";r.defaultProps={src:void 0,initials:void 0};r.propTypes={children:s.default.node.isRequired,initials:s.default.node,src:s.default.string};exports.NavUser=r;
+`,q=j.default.forwardRef(({src:e,children:r,initials:a,...d},l)=>{const n=x.useMainNav();return t.jsx(g,{paddingTop:3,paddingBottom:3,paddingLeft:5,paddingRight:5,...d,children:t.jsxs(p.Flex,{as:"button",justifyContent:n?"center":void 0,ref:l,children:[e?t.jsx(s.Avatar,{src:e,alt:"","aria-hidden":!0}):t.jsx(s.Initials,{children:a}),n?t.jsx(f.VisuallyHidden,{children:t.jsx("span",{children:r})}):t.jsx(i.Box,{width:`${130/16}rem`,paddingLeft:2,as:"span",children:t.jsx(h.Typography,{ellipsis:!0,textColor:"neutral600",children:r})})]})})});exports.NavUser=q;

package/dist/v2/MainNav/NavUser.js

@@ -1,32 +1,18 @@
-import { jsx as r, jsxs as l } from "react/jsx-runtime";
-import m from "react";
-import i from "prop-types";
-import f from "styled-components";
-import { useMainNav as c } from "./MainNavContext.js";
-import { Box as n } from "../../Box/Box.js";
-import { Flex as u } from "../../Flex/Flex.js";
-import { Avatar as h, Initials as g } from "../../Avatar/Avatar.js";
-import { VisuallyHidden as v } from "../../VisuallyHidden/VisuallyHidden.js";
+import { jsx as r, jsxs as p } from "react/jsx-runtime";
+import s from "react";
+import l from "styled-components";
+import { useMainNav as m } from "./MainNavContext.js";
+import { Box as i } from "../../Box/Box.js";
+import { Flex as f } from "../../Flex/Flex.js";
+import { Avatar as c, Initials as u } from "../../Avatar/Avatar.js";
+import { VisuallyHidden as h } from "../../VisuallyHidden/VisuallyHidden.js";
 import { Typography as x } from "../../Typography/Typography.js";
-const y = f(n)`
+const g = l(i)`
   border-top: 1px solid ${({ theme: o }) => o.colors.neutral150};
-`, t = m.forwardRef(({ src: o, children: e, initials: a, ...s }, p) => {
-  const d = c();
-  return /* @__PURE__ */ r(y, { paddingTop: 3, paddingBottom: 3, paddingLeft: 5, paddingRight: 5, ...s, children: /* @__PURE__ */ l(u, { as: "button", justifyContent: d ? "center" : void 0, ref: p, children: [
-    o ? /* @__PURE__ */ r(h, { src: o, alt: "", "aria-hidden": !0 }) : /* @__PURE__ */ r(g, { children: a }),
-    d ? /* @__PURE__ */ r(v, { children: /* @__PURE__ */ r("span", { children: e }) }) : /* @__PURE__ */ r(n, { width: `${130 / 16}rem`, paddingLeft: 2, as: "span", children: /* @__PURE__ */ r(x, { ellipsis: !0, textColor: "neutral600", children: e }) })
-  ] }) });
+`, L = s.forwardRef(({ src: o, children: t, initials: n, ...d }, a) => {
+  const e = m();
+  return r(g, { paddingTop: 3, paddingBottom: 3, paddingLeft: 5, paddingRight: 5, ...d, children: p(f, { as: "button", justifyContent: e ? "center" : void 0, ref: a, children: [o ? r(c, { src: o, alt: "", "aria-hidden": !0 }) : r(u, { children: n }), e ? r(h, { children: r("span", { children: t }) }) : r(i, { width: `${130 / 16}rem`, paddingLeft: 2, as: "span", children: r(x, { ellipsis: !0, textColor: "neutral600", children: t }) })] }) });
 });
-t.displayName = "NavUser";
-t.defaultProps = {
-  src: void 0,
-  initials: void 0
-};
-t.propTypes = {
-  children: i.node.isRequired,
-  initials: i.node,
-  src: i.string
-};
 export {
-  t as NavUser
+  L as NavUser
 };

package/dist/v2/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/v2/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/v2/Pagination/components.cjs

@@ -1,22 +1,21 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),L=require("react"),g=require("@strapi/icons"),j=require("prop-types"),q=require("styled-components"),u=require("./PaginationContext.cjs"),R=require("../../themes/utils.cjs"),m=require("../../Typography/Typography.cjs"),w=require("../../BaseLink/BaseLink.cjs"),l=require("../../VisuallyHidden/VisuallyHidden.cjs"),c=e=>e&&e.__esModule?e:{default:e},p=c(L),d=c(j),n=c(q),x=n.default(m.Typography)`
-  line-height: revert;
-`,T={active:!0},h=n.default(w.BaseLink).withConfig({shouldForwardProp:(e,i)=>!T[e]&&i(e)})`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),p=require("react"),c=require("@strapi/icons"),v=require("styled-components"),d=require("./PaginationContext.cjs"),y=require("../../themes/utils.cjs"),b=require("../../BaseLink/BaseLink.cjs"),s=require("../../VisuallyHidden/VisuallyHidden.cjs"),h=require("../../Typography/Typography.cjs"),P=require("../../Box/Box.cjs"),f=e=>e&&e.__esModule?e:{default:e},l=f(p),u=f(v),j={active:!0},g=u.default(b.BaseLink).withConfig({shouldForwardProp:(e,i)=>!j[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;
 
-  ${R.buttonFocusStyle}
-`,$=n.default(h)`
+  ${y.buttonFocusStyle}
+`,k=u.default(g)`
   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};
   }
-`,P=n.default(h)`
-  font-size: 0.7rem;
+`,x=u.default(g)`
+  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}
-`,_=n.default(h)`
-  color: ${({theme:e})=>e.colors.neutral800};
-`,f=p.default.forwardRef(({children:e,...i},a)=>{const{activePage:s}=u.usePagination(),t=s===1;return r.jsxs(P,{ref:a,"aria-disabled":t,tabIndex:t?-1:void 0,...i,children:[r.jsx(l.VisuallyHidden,{children:e}),r.jsx(g.ChevronLeft,{"aria-hidden":!0})]})});f.displayName="PreviousLink";const v=p.default.forwardRef(({children:e,...i},a)=>{const{activePage:s,pageCount:t}=u.usePagination(),o=s===t;return r.jsxs(P,{ref:a,"aria-disabled":o,tabIndex:o?-1:void 0,...i,children:[r.jsx(l.VisuallyHidden,{children:e}),r.jsx(g.ChevronRight,{"aria-hidden":!0})]})});v.displayName="NextLink";const y=p.default.forwardRef(({number:e,children:i,...a},s)=>{const{activePage:t}=u.usePagination(),o=t===e;return r.jsxs($,{ref:s,...a,active:o,children:[r.jsx(l.VisuallyHidden,{children:i}),r.jsx(x,{"aria-hidden":!0,variant:"pi",fontWeight:o?"bold":null,children:e})]})});y.displayName="PageLink";const b=({children:e,...i})=>r.jsxs(_,{...i,as:"div",children:[r.jsx(l.VisuallyHidden,{children:e}),r.jsx(x,{"aria-hidden":!0,variant:"pi",children:"…"})]});y.propTypes={children:d.default.node.isRequired,number:d.default.number.isRequired};const k={children:d.default.node.isRequired};v.propTypes=k;f.propTypes=k;b.propTypes={children:d.default.node.isRequired};exports.Dots=b;exports.NextLink=v;exports.PageLink=y;exports.PreviousLink=f;
+`,L=l.default.forwardRef(({children:e,...i},t)=>{const{activePage:a}=d.usePagination(),r=a===1;return n.jsxs(x,{ref:t,"aria-disabled":r,tabIndex:r?-1:void 0,...i,children:[n.jsx(s.VisuallyHidden,{children:e}),n.jsx(c.ChevronLeft,{"aria-hidden":!0})]})}),w=l.default.forwardRef(({children:e,...i},t)=>{const{activePage:a,pageCount:r}=d.usePagination(),o=a===r;return n.jsxs(x,{ref:t,"aria-disabled":o,tabIndex:o?-1:void 0,...i,children:[n.jsx(s.VisuallyHidden,{children:e}),n.jsx(c.ChevronRight,{"aria-hidden":!0})]})}),$=l.default.forwardRef(({number:e,children:i,...t},a)=>{const{activePage:r}=d.usePagination(),o=r===e;return n.jsxs(k,{ref:a,...t,active:o,children:[n.jsx(s.VisuallyHidden,{children:i}),n.jsx(h.Typography,{"aria-hidden":!0,fontWeight:o?"bold":void 0,lineHeight:"revert",variant:"pi",children:e})]})}),q=({children:e,...i})=>n.jsxs(P.Box,{...i,children:[n.jsx(s.VisuallyHidden,{children:e}),n.jsx(h.Typography,{"aria-hidden":!0,lineHeight:"revert",textColor:"neutral800",variant:"pi",children:"…"})]});exports.Dots=q;exports.NextLink=w;exports.PageLink=$;exports.PreviousLink=L;

package/dist/v2/Pagination/components.js

@@ -1,19 +1,17 @@
-import { jsxs as l, jsx as o } from "react/jsx-runtime";
-import p from "react";
-import { ChevronLeft as P, ChevronRight as x } from "@strapi/icons";
-import d from "prop-types";
-import s from "styled-components";
-import { usePagination as h } from "./PaginationContext.js";
-import { buttonFocusStyle as k } from "../../themes/utils.js";
-import { Typography as w } from "../../Typography/Typography.js";
-import { BaseLink as L } from "../../BaseLink/BaseLink.js";
-import { VisuallyHidden as c } from "../../VisuallyHidden/VisuallyHidden.js";
-const m = s(w)`
-  line-height: revert;
-`, $ = {
+import { jsxs as d, jsx as o } from "react/jsx-runtime";
+import l from "react";
+import { ChevronLeft as m, ChevronRight as v } from "@strapi/icons";
+import c from "styled-components";
+import { usePagination as f } from "./PaginationContext.js";
+import { buttonFocusStyle as g } from "../../themes/utils.js";
+import { BaseLink as b } from "../../BaseLink/BaseLink.js";
+import { VisuallyHidden as s } from "../../VisuallyHidden/VisuallyHidden.js";
+import { Typography as h } from "../../Typography/Typography.js";
+import { Box as x } from "../../Box/Box.js";
+const w = {
   active: !0
-}, u = s(L).withConfig({
-  shouldForwardProp: (e, r) => !$[e] && r(e)
+}, u = c(b).withConfig({
+  shouldForwardProp: (e, r) => !w[e] && r(e)
 })`
   padding: ${({ theme: e }) => e.spaces[3]};
   border-radius: ${({ theme: e }) => e.borderRadius};
@@ -21,16 +19,17 @@ const m = s(w)`
   text-decoration: none;
   display: flex;
 
-  ${k}
-`, R = s(u)`
+  ${g}
+`, $ = c(u)`
   color: ${({ theme: e, active: r }) => r ? e.colors.primary700 : e.colors.neutral800};
   background: ${({ theme: e, active: r }) => r ? e.colors.neutral0 : void 0};
 
   &:hover {
     box-shadow: ${({ theme: e }) => e.shadows.filterShadow};
   }
-`, f = s(u)`
-  font-size: 0.7rem;
+`, p = c(u)`
+  font-size: ${11 / 16}rem;
+
   svg path {
     fill: ${(e) => e["aria-disabled"] ? e.theme.colors.neutral300 : e.theme.colors.neutral600};
   }
@@ -45,51 +44,19 @@ const m = s(w)`
   ${(e) => e["aria-disabled"] ? `
   pointer-events: none;
     ` : void 0}
-`, T = s(u)`
-  color: ${({ theme: e }) => e.colors.neutral800};
-`, v = p.forwardRef(({ children: e, ...r }, a) => {
-  const { activePage: t } = h(), i = t === 1;
-  return /* @__PURE__ */ l(f, { ref: a, "aria-disabled": i, tabIndex: i ? -1 : void 0, ...r, children: [
-    /* @__PURE__ */ o(c, { children: e }),
-    /* @__PURE__ */ o(P, { "aria-hidden": !0 })
-  ] });
-});
-v.displayName = "PreviousLink";
-const g = p.forwardRef(({ children: e, ...r }, a) => {
-  const { activePage: t, pageCount: i } = h(), n = t === i;
-  return /* @__PURE__ */ l(f, { ref: a, "aria-disabled": n, tabIndex: n ? -1 : void 0, ...r, children: [
-    /* @__PURE__ */ o(c, { children: e }),
-    /* @__PURE__ */ o(x, { "aria-hidden": !0 })
-  ] });
-});
-g.displayName = "NextLink";
-const b = p.forwardRef(({ number: e, children: r, ...a }, t) => {
-  const { activePage: i } = h(), n = i === e;
-  return /* @__PURE__ */ l(R, { ref: t, ...a, active: n, children: [
-    /* @__PURE__ */ o(c, { children: r }),
-    /* @__PURE__ */ o(m, { "aria-hidden": !0, variant: "pi", fontWeight: n ? "bold" : null, children: e })
-  ] });
-});
-b.displayName = "PageLink";
-const N = ({ children: e, ...r }) => /* @__PURE__ */ l(T, { ...r, as: "div", children: [
-  /* @__PURE__ */ o(c, { children: e }),
-  /* @__PURE__ */ o(m, { "aria-hidden": !0, variant: "pi", children: "…" })
-] });
-b.propTypes = {
-  children: d.node.isRequired,
-  number: d.number.isRequired
-};
-const y = {
-  children: d.node.isRequired
-};
-g.propTypes = y;
-v.propTypes = y;
-N.propTypes = {
-  children: d.node.isRequired
-};
+`, A = l.forwardRef(({ children: e, ...r }, t) => {
+  const { activePage: n } = f(), i = n === 1;
+  return d(p, { ref: t, "aria-disabled": i, tabIndex: i ? -1 : void 0, ...r, children: [o(s, { children: e }), o(m, { "aria-hidden": !0 })] });
+}), B = l.forwardRef(({ children: e, ...r }, t) => {
+  const { activePage: n, pageCount: i } = f(), a = n === i;
+  return d(p, { ref: t, "aria-disabled": a, tabIndex: a ? -1 : void 0, ...r, children: [o(s, { children: e }), o(v, { "aria-hidden": !0 })] });
+}), F = l.forwardRef(({ number: e, children: r, ...t }, n) => {
+  const { activePage: i } = f(), a = i === e;
+  return d($, { ref: n, ...t, active: a, children: [o(s, { children: r }), o(h, { "aria-hidden": !0, fontWeight: a ? "bold" : void 0, lineHeight: "revert", variant: "pi", children: e })] });
+}), I = ({ children: e, ...r }) => d(x, { ...r, children: [o(s, { children: e }), o(h, { "aria-hidden": !0, lineHeight: "revert", textColor: "neutral800", variant: "pi", children: "…" })] });
 export {
-  N as Dots,
-  g as NextLink,
-  b as PageLink,
-  v as PreviousLink
+  I as Dots,
+  B as NextLink,
+  F as PageLink,
+  A as PreviousLink
 };

package/dist/v2/SubNav/SubNav.cjs

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime");require("react");const u=require("prop-types"),a=require("styled-components"),n=require("../../Grid/Grid.cjs"),t=e=>e&&e.__esModule?e:{default:e},l=t(u),d=t(a),r=`${232/16}rem`,c=d.default(n.Grid)`
-  width: ${r};
-  background: ${({theme:e})=>e.colors.neutral100};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),s=require("styled-components"),u=require("../../Grid/Grid.cjs"),a=t=>t&&t.__esModule?t:{default:t},i=a(s),e=`${232/16}rem`,n=i.default(u.Grid)`
+  width: ${e};
+  background: ${({theme:t})=>t.colors.neutral100};
   position: sticky;
   top: 0;
   height: 100vh;
   overflow-y: auto;
-  border-right: 1px solid ${({theme:e})=>e.colors.neutral200};
+  border-right: 1px solid ${({theme:t})=>t.colors.neutral200};
   z-index: 1;
-`,o=({ariaLabel:e,...s})=>i.jsx(c,{"aria-label":e,as:"nav",...s});o.propTypes={ariaLabel:l.default.string.isRequired};exports.SubNav=o;exports.subNavWidth=r;
+`,l=({ariaLabel:t,...r})=>o.jsx(n,{"aria-label":t,as:"nav",...r});exports.SubNav=l;exports.subNavWidth=e;

package/dist/v2/SubNav/SubNav.js

@@ -1,22 +1,17 @@
 import { jsx as t } from "react/jsx-runtime";
-import "react";
-import i from "prop-types";
-import e from "styled-components";
+import i from "styled-components";
 import { Grid as a } from "../../Grid/Grid.js";
-const p = `${232 / 16}rem`, s = e(a)`
-  width: ${p};
-  background: ${({ theme: r }) => r.colors.neutral100};
+const e = `${232 / 16}rem`, s = i(a)`
+  width: ${e};
+  background: ${({ theme: o }) => o.colors.neutral100};
   position: sticky;
   top: 0;
   height: 100vh;
   overflow-y: auto;
-  border-right: 1px solid ${({ theme: r }) => r.colors.neutral200};
+  border-right: 1px solid ${({ theme: o }) => o.colors.neutral200};
   z-index: 1;
-`, n = ({ ariaLabel: r, ...o }) => /* @__PURE__ */ t(s, { "aria-label": r, as: "nav", ...o });
-n.propTypes = {
-  ariaLabel: i.string.isRequired
-};
+`, d = ({ ariaLabel: o, ...r }) => t(s, { "aria-label": o, as: "nav", ...r });
 export {
-  n as SubNav,
-  p as subNavWidth
+  d as SubNav,
+  e as subNavWidth
 };

package/dist/v2/SubNav/SubNavHeader.cjs

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