@strapi/design-system 0.0.0-599b75fb-test → 0.0.0-622b91ef

package/dist/v2/MainNav/NavSections.js

@@ -1,25 +1,12 @@
-import e, { Children as m } from "react";
-import a from "prop-types";
-import d from "styled-components";
+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 c } from "../../Flex/Flex.js";
-const s = d(l)`
+import { Flex as a } from "../../Flex/Flex.js";
+const c = p(l)`
   flex-grow: 1;
   overflow-y: auto;
-`, f = ({ children: t, spacing: o = 4, horizontal: r = !1, ...i }) => /* @__PURE__ */ e.createElement(s, { paddingLeft: 3, paddingRight: 2, paddingTop: 3, paddingBottom: 8 }, /* @__PURE__ */ e.createElement(
-  c,
-  {
-    as: "ul",
-    gap: o,
-    direction: r ? "row" : "column",
-    alignItems: r ? "center" : "stretch",
-    ...i
-  },
-  m.map(t, (n, p) => /* @__PURE__ */ e.createElement("li", { key: p }, n))
-));
-f.propTypes = {
-  children: a.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.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("react"),f=require("prop-types"),y=require("styled-components"),v=require("./MainNavContext.cjs"),s=require("../../Avatar/Avatar.cjs");require("../../Avatar/AvatarGroup.cjs");const d=require("../../Box/Box.cjs"),g=require("../../Flex/Flex.cjs"),x=require("../../Typography/Typography.cjs"),m=require("../../VisuallyHidden/VisuallyHidden.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=l(p),r=l(f),q=l(y),j=q.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};
-`,a=t.default.forwardRef(({src:e,children:n,initials:i,...u},c)=>{const o=v.useMainNav();return t.default.createElement(j,{paddingTop:3,paddingBottom:3,paddingLeft:5,paddingRight:5,...u},t.default.createElement(g.Flex,{as:"button",justifyContent:o?"center":void 0,ref:c},e?t.default.createElement(s.Avatar,{src:e,alt:"","aria-hidden":!0}):t.default.createElement(s.Initials,null,i),o?t.default.createElement(m.VisuallyHidden,null,t.default.createElement("span",null,n)):t.default.createElement(d.Box,{width:`${130/16}rem`,paddingLeft:2,as:"span"},t.default.createElement(x.Typography,{ellipsis:!0,textColor:"neutral600"},n))))});a.displayName="NavUser";a.defaultProps={src:void 0,initials:void 0};a.propTypes={children:r.default.node.isRequired,initials:r.default.node,src:r.default.string};exports.NavUser=a;
+`,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,29 +1,18 @@
-import e from "react";
-import r from "prop-types";
-import m from "styled-components";
-import { useMainNav as s } from "./MainNavContext.js";
-import { Avatar as c, Initials as f } from "../../Avatar/Avatar.js";
-import "../../Avatar/AvatarGroup.js";
-import { Box as n } from "../../Box/Box.js";
-import { Flex as u } from "../../Flex/Flex.js";
-import { Typography as g } from "../../Typography/Typography.js";
-import { VisuallyHidden as v } from "../../VisuallyHidden/VisuallyHidden.js";
-const y = m(n)`
-  border-top: 1px solid ${({ theme: t }) => t.colors.neutral150};
-`, o = e.forwardRef(({ src: t, children: i, initials: l, ...p }, d) => {
-  const a = s();
-  return /* @__PURE__ */ e.createElement(y, { paddingTop: 3, paddingBottom: 3, paddingLeft: 5, paddingRight: 5, ...p }, /* @__PURE__ */ e.createElement(u, { as: "button", justifyContent: a ? "center" : void 0, ref: d }, t ? /* @__PURE__ */ e.createElement(c, { src: t, alt: "", "aria-hidden": !0 }) : /* @__PURE__ */ e.createElement(f, null, l), a ? /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement("span", null, i)) : /* @__PURE__ */ e.createElement(n, { width: `${130 / 16}rem`, paddingLeft: 2, as: "span" }, /* @__PURE__ */ e.createElement(g, { ellipsis: !0, textColor: "neutral600" }, i))));
+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 g = l(i)`
+  border-top: 1px solid ${({ theme: o }) => o.colors.neutral150};
+`, 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 }) })] }) });
 });
-o.displayName = "NavUser";
-o.defaultProps = {
-  src: void 0,
-  initials: void 0
-};
-o.propTypes = {
-  children: r.node.isRequired,
-  initials: r.node,
-  src: r.string
-};
 export {
-  o as NavUser
+  L as NavUser
 };

package/dist/v2/MainNav/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./MainNav.cjs"),a=require("./NavBrand.cjs"),n=require("./NavCondense.cjs"),v=require("./NavFooter.cjs"),o=require("./NavLink.cjs"),r=require("./NavSection.cjs"),s=require("./NavSections.cjs"),N=require("./NavUser.cjs");exports.MainNav=e.MainNav;exports.NavBrand=a.NavBrand;exports.NavCondense=n.NavCondense;exports.NavFooter=v.NavFooter;exports.NavLink=o.NavLink;exports.NavSection=r.NavSection;exports.NavSections=s.NavSections;exports.NavUser=N.NavUser;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./MainNav.cjs"),a=require("./NavBrand.cjs"),n=require("./NavCondense.cjs"),r=require("./NavFooter.cjs"),o=require("./NavLink.cjs"),v=require("./NavSection.cjs"),N=require("./NavSections.cjs"),i=require("./NavUser.cjs");exports.MainNav=e.MainNav;exports.NavBrand=a.NavBrand;exports.NavCondense=n.NavCondense;exports.NavFooter=r.NavFooter;exports.NavLink=o.NavLink;exports.NavSection=v.NavSection;exports.NavSections=N.NavSections;exports.NavUser=i.NavUser;

package/dist/v2/Pagination/Pagination.cjs

@@ -1,5 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("react"),f=require("prop-types"),g=require("styled-components"),m=require("./PaginationContext.cjs"),b=require("../../Flex/Flex.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function y(e){if(e&&e.__esModule)return e;const a=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(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const n=y(p),o=l(f),s=l(g),P=s.default.nav``,_=s.default(b.Flex)`
-  & > * + * {
-    margin-left: ${({theme:e})=>e.spaces[1]};
-  }
-`,i=({children:e,label:a,activePage:t,pageCount:r})=>{const u=n.useMemo(()=>({activePage:t,pageCount:r}),[t,r]);return n.createElement(m.PaginationContext.Provider,{value:u},n.createElement(P,{"aria-label":a},n.createElement(_,{as:"ul"},n.Children.map(e,(c,d)=>n.createElement("li",{key:d},c)))))};i.defaultProps={label:"pagination"};i.propTypes={activePage:o.default.number.isRequired,children:o.default.node.isRequired,label:o.default.string,pageCount:o.default.number.isRequired};exports.Pagination=i;
+"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,25 +1,12 @@
-import * as e from "react";
-import r from "prop-types";
-import i from "styled-components";
+import { jsx as r } from "react/jsx-runtime";
+import * as n from "react";
 import { PaginationContext as c } from "./PaginationContext.js";
-import { Flex as u } from "../../Flex/Flex.js";
-const d = i.nav``, f = i(u)`
-  & > * + * {
-    margin-left: ${({ theme: t }) => t.spaces[1]};
-  }
-`, o = ({ children: t, label: l, activePage: n, pageCount: a }) => {
-  const m = e.useMemo(() => ({ activePage: n, pageCount: a }), [n, a]);
-  return /* @__PURE__ */ e.createElement(c.Provider, { value: m }, /* @__PURE__ */ e.createElement(d, { "aria-label": l }, /* @__PURE__ */ e.createElement(f, { as: "ul" }, e.Children.map(t, (s, p) => /* @__PURE__ */ e.createElement("li", { key: p }, s)))));
-};
-o.defaultProps = {
-  label: "pagination"
-};
-o.propTypes = {
-  activePage: r.number.isRequired,
-  children: r.node.isRequired,
-  label: r.string,
-  pageCount: r.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 {
-  o as Pagination
+  u as Pagination
 };

package/dist/v2/Pagination/PaginationContext.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react"),t=e.createContext({activePage:1,pageCount:1}),n=()=>e.useContext(t);exports.PaginationContext=t;exports.usePagination=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),e=t.createContext({activePage:1,pageCount:1}),n=()=>t.useContext(e);exports.PaginationContext=e;exports.usePagination=n;

package/dist/v2/Pagination/components.cjs

@@ -1,22 +1,21 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const L=require("react"),g=require("@strapi/icons"),k=require("prop-types"),q=require("styled-components"),u=require("./PaginationContext.cjs"),T=require("../../BaseLink/BaseLink.cjs"),x=require("../../themes/utils.cjs"),E=require("../../Typography/Typography.cjs"),d=require("../../VisuallyHidden/VisuallyHidden.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=c(L),l=c(k),s=c(q),v=s.default(E.Typography)`
-  line-height: revert;
-`,w={active:!0},p=s.default(T.BaseLink).withConfig({shouldForwardProp:(e,t)=>!w[e]&&t(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:t})=>e?t.shadows.filterShadow:void 0};
+  box-shadow: ${({active:e,theme:i})=>e?i.shadows.filterShadow:void 0};
   text-decoration: none;
   display: flex;
 
-  ${x.buttonFocusStyle}
-`,R=s.default(p)`
-  color: ${({theme:e,active:t})=>t?e.colors.primary700:e.colors.neutral800};
-  background: ${({theme:e,active:t})=>t?e.colors.neutral0:void 0};
+  ${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};
   }
-`,m=s.default(p)`
-  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}
-`,$=s.default(p)`
-  color: ${({theme:e})=>e.colors.neutral800};
-`,f=a.default.forwardRef(({children:e,...t},n)=>{const{activePage:i}=u.usePagination(),r=i===1;return a.default.createElement(m,{ref:n,"aria-disabled":r,tabIndex:r?-1:void 0,...t},a.default.createElement(d.VisuallyHidden,null,e),a.default.createElement(g.ChevronLeft,{"aria-hidden":!0}))});f.displayName="PreviousLink";const y=a.default.forwardRef(({children:e,...t},n)=>{const{activePage:i,pageCount:r}=u.usePagination(),o=i===r;return a.default.createElement(m,{ref:n,"aria-disabled":o,tabIndex:o?-1:void 0,...t},a.default.createElement(d.VisuallyHidden,null,e),a.default.createElement(g.ChevronRight,{"aria-hidden":!0}))});y.displayName="NextLink";const h=a.default.forwardRef(({number:e,children:t,...n},i)=>{const{activePage:r}=u.usePagination(),o=r===e;return a.default.createElement(R,{ref:i,...n,active:o},a.default.createElement(d.VisuallyHidden,null,t),a.default.createElement(v,{"aria-hidden":!0,variant:"pi",fontWeight:o?"bold":null},e))});h.displayName="PageLink";const P=({children:e,...t})=>a.default.createElement($,{...t,as:"div"},a.default.createElement(d.VisuallyHidden,null,e),a.default.createElement(v,{"aria-hidden":!0,variant:"pi"},"\u2026"));h.propTypes={children:l.default.node.isRequired,number:l.default.number.isRequired};const b={children:l.default.node.isRequired};y.propTypes=b;f.propTypes=b;P.propTypes={children:l.default.node.isRequired};exports.Dots=P;exports.NextLink=y;exports.PageLink=h;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,17 +1,16 @@
-import t from "react";
-import { ChevronLeft as b, ChevronRight as y } from "@strapi/icons";
-import d from "prop-types";
-import s from "styled-components";
-import { usePagination as c } from "./PaginationContext.js";
-import { BaseLink as P } from "../../BaseLink/BaseLink.js";
-import { buttonFocusStyle as E } from "../../themes/utils.js";
-import { Typography as k } from "../../Typography/Typography.js";
-import { VisuallyHidden as l } from "../../VisuallyHidden/VisuallyHidden.js";
-const m = s(k)`
-  line-height: revert;
-`, w = {
+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
-}, p = s(P).withConfig({
+}, u = c(b).withConfig({
   shouldForwardProp: (e, r) => !w[e] && r(e)
 })`
   padding: ${({ theme: e }) => e.spaces[3]};
@@ -20,16 +19,17 @@ const m = s(k)`
   text-decoration: none;
   display: flex;
 
-  ${E}
-`, L = s(p)`
+  ${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};
   }
-`, u = s(p)`
-  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};
   }
@@ -44,39 +44,19 @@ const m = s(k)`
   ${(e) => e["aria-disabled"] ? `
   pointer-events: none;
     ` : void 0}
-`, $ = s(p)`
-  color: ${({ theme: e }) => e.colors.neutral800};
-`, h = t.forwardRef(({ children: e, ...r }, a) => {
-  const { activePage: i } = c(), o = i === 1;
-  return /* @__PURE__ */ t.createElement(u, { ref: a, "aria-disabled": o, tabIndex: o ? -1 : void 0, ...r }, /* @__PURE__ */ t.createElement(l, null, e), /* @__PURE__ */ t.createElement(b, { "aria-hidden": !0 }));
-});
-h.displayName = "PreviousLink";
-const f = t.forwardRef(({ children: e, ...r }, a) => {
-  const { activePage: i, pageCount: o } = c(), n = i === o;
-  return /* @__PURE__ */ t.createElement(u, { ref: a, "aria-disabled": n, tabIndex: n ? -1 : void 0, ...r }, /* @__PURE__ */ t.createElement(l, null, e), /* @__PURE__ */ t.createElement(y, { "aria-hidden": !0 }));
-});
-f.displayName = "NextLink";
-const v = t.forwardRef(({ number: e, children: r, ...a }, i) => {
-  const { activePage: o } = c(), n = o === e;
-  return /* @__PURE__ */ t.createElement(L, { ref: i, ...a, active: n }, /* @__PURE__ */ t.createElement(l, null, r), /* @__PURE__ */ t.createElement(m, { "aria-hidden": !0, variant: "pi", fontWeight: n ? "bold" : null }, e));
-});
-v.displayName = "PageLink";
-const x = ({ children: e, ...r }) => /* @__PURE__ */ t.createElement($, { ...r, as: "div" }, /* @__PURE__ */ t.createElement(l, null, e), /* @__PURE__ */ t.createElement(m, { "aria-hidden": !0, variant: "pi" }, "\u2026"));
-v.propTypes = {
-  children: d.node.isRequired,
-  number: d.number.isRequired
-};
-const g = {
-  children: d.node.isRequired
-};
-f.propTypes = g;
-h.propTypes = g;
-x.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 {
-  x as Dots,
-  f as NextLink,
-  v as PageLink,
-  h as PreviousLink
+  I as Dots,
+  B as NextLink,
+  F as PageLink,
+  A as PreviousLink
 };

package/dist/v2/Pagination/index.cjs

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

package/dist/v2/SimpleMenu/Menu.cjs

@@ -0,0 +1,65 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("react"),y=require("@radix-ui/react-dropdown-menu"),d=require("@strapi/icons"),c=require("styled-components"),S=require("../../helpers/theme.cjs"),w=require("../Link/Link.cjs"),j=require("../../Button/Button.cjs"),m=require("../../Box/Box.cjs"),u=require("../../Flex/Flex.cjs"),a=require("../../Typography/Typography.cjs"),T=e=>e&&e.__esModule?e:{default:e};function C(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const i=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(r,o,i.get?i:{enumerable:!0,get:()=>e[o]})}}return r.default=e,Object.freeze(r)}const n=C(y),l=T(c),R=n.Root,v=s.forwardRef(({size:e,endIcon:r=t.jsx(d.CarretDown,{width:`${6/16}rem`,height:`${4/16}rem`,"aria-hidden":!0}),...o},i)=>t.jsx(n.Trigger,{asChild:!0,children:t.jsx(j.Button,{ref:i,type:"button",variant:"ghost",endIcon:r,paddingTop:e==="S"?1:2,paddingBottom:e==="S"?1:2,paddingLeft:e==="S"?3:4,paddingRight:e==="S"?3:4,...o})})),$=s.forwardRef(({children:e,intersectionId:r,popoverPlacement:o="bottom-start",...i},f)=>{const[p,x]=o.split("-");return t.jsx(n.Portal,{children:t.jsx(n.Content,{align:x,side:p,loop:!0,asChild:!0,children:t.jsxs(h,{ref:f,direction:"column",borderStyle:"solid",borderWidth:"1px",borderColor:"neutral150",hasRadius:!0,background:"neutral0",shadow:"filterShadow",maxHeight:"15rem",padding:1,alignItems:"flex-start",position:"relative",overflow:"auto",...i,children:[e,t.jsx(m.Box,{id:r,width:"100%",height:"1px"})]})})})}),h=l.default(u.Flex)`
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  -webkit-overflow-scrolling: touch;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+`,k=({onSelect:e,disabled:r=!1,...o})=>t.jsx(n.Item,{asChild:!0,onSelect:e,disabled:r,children:o.isLink||o.isExternal?t.jsx(M,{color:"neutral800",...o,isExternal:o.isExternal??!1,children:t.jsx(a.Typography,{children:o.children})}):t.jsx(b,{cursor:"pointer",color:"neutral800",background:"transparent",borderStyle:"none",...o,children:t.jsx(a.Typography,{children:o.children})})}),g=({theme:e})=>c.css`
+  text-align: left;
+  width: 100%;
+  border-radius: ${e.borderRadius};
+  padding: ${e.spaces[2]} ${e.spaces[4]};
+
+  ${a.Typography} {
+    color: inherit;
+  }
+
+  &[aria-disabled] {
+    cursor: not-allowed;
+
+    ${a.Typography} {
+      color: ${e.colors.neutral500};
+    }
+  }
+
+  &[data-highlighted] {
+    background-color: ${e.colors.primary100};
+  }
+
+  &:focus-visible {
+    outline: none;
+
+    &:after {
+      content: none;
+    }
+  }
+`,b=l.default(u.Flex)`
+  ${g}
+`,M=l.default(w.Link)`
+  /* We include this here again because typically when people use OptionLink they provide an as prop which cancels the Box props */
+  color: ${({theme:e,color:r})=>S.extractStyleFromTheme(e.colors,r,void 0)};
+  text-decoration: none;
+
+  &:hover {
+    color: unset;
+  }
+
+  svg > path,
+  &:focus-visible svg > path {
+    fill: currentColor;
+  }
+
+  ${g}
+`,q=s.forwardRef((e,r)=>t.jsx(n.Label,{asChild:!0,children:t.jsx(L,{ref:r,variant:"sigma",textColor:"neutral600",...e})})),L=l.default(a.Typography)`
+  padding: ${({theme:e})=>e.spaces[2]} ${({theme:e})=>e.spaces[4]};
+`,O=n.Sub,_=s.forwardRef(({disabled:e=!1,...r},o)=>t.jsx(n.SubTrigger,{asChild:!0,disabled:e,children:t.jsxs(B,{ref:o,color:"neutral800",as:"button",type:"button",background:"transparent",borderStyle:"none",gap:5,...r,children:[t.jsx(a.Typography,{children:r.children}),t.jsx(I,{height:12,width:12})]})})),B=l.default(b)`
+  &[data-state='open'] {
+    background-color: ${({theme:e})=>e.colors.primary100};
+  }
+`,I=l.default(d.ChevronRight)`
+  path {
+    fill: ${({theme:e})=>e.colors.neutral500};
+  }
+`,D=s.forwardRef((e,r)=>t.jsx(n.Portal,{children:t.jsx(n.SubContent,{sideOffset:8,asChild:!0,children:t.jsx(h,{ref:r,direction:"column",borderStyle:"solid",borderWidth:"1px",borderColor:"neutral150",hasRadius:!0,background:"neutral0",shadow:"filterShadow",maxHeight:"15rem",padding:1,alignItems:"flex-start",overflow:"auto",...e})})})),P=R,F=v,E=$,W=k,H=q,A=O,N=_,V=D;exports.Content=E;exports.Item=W;exports.Label=H;exports.Root=P;exports.SubContent=V;exports.SubRoot=A;exports.SubTrigger=N;exports.Trigger=F;

package/dist/v2/SimpleMenu/Menu.js

@@ -0,0 +1,89 @@
+import { jsx as e, jsxs as s } from "react/jsx-runtime";
+import { forwardRef as a } from "react";
+import * as n from "@radix-ui/react-dropdown-menu";
+import { CarretDown as f, ChevronRight as S } from "@strapi/icons";
+import l, { css as w } from "styled-components";
+import { extractStyleFromTheme as x } from "../../helpers/theme.js";
+import { Link as y } from "../Link/Link.js";
+import { Button as C } from "../../Button/Button.js";
+import { Box as $ } from "../../Box/Box.js";
+import { Flex as c } from "../../Flex/Flex.js";
+import { Typography as i } from "../../Typography/Typography.js";
+const v = n.Root, k = a(({ size: r, endIcon: o = e(f, { width: `${6 / 16}rem`, height: `${4 / 16}rem`, "aria-hidden": !0 }), ...t }, d) => e(n.Trigger, { asChild: !0, children: e(C, { ref: d, type: "button", variant: "ghost", endIcon: o, paddingTop: r === "S" ? 1 : 2, paddingBottom: r === "S" ? 1 : 2, paddingLeft: r === "S" ? 3 : 4, paddingRight: r === "S" ? 3 : 4, ...t }) })), R = a(({ children: r, intersectionId: o, popoverPlacement: t = "bottom-start", ...d }, p) => {
+  const [b, m] = t.split("-");
+  return e(n.Portal, { children: e(n.Content, { align: m, side: b, loop: !0, asChild: !0, children: s(u, { ref: p, direction: "column", borderStyle: "solid", borderWidth: "1px", borderColor: "neutral150", hasRadius: !0, background: "neutral0", shadow: "filterShadow", maxHeight: "15rem", padding: 1, alignItems: "flex-start", position: "relative", overflow: "auto", ...d, children: [r, e($, { id: o, width: "100%", height: "1px" })] }) }) });
+}), u = l(c)`
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  -webkit-overflow-scrolling: touch;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+`, T = ({ onSelect: r, disabled: o = !1, ...t }) => e(n.Item, { asChild: !0, onSelect: r, disabled: o, children: t.isLink || t.isExternal ? e(L, { color: "neutral800", ...t, isExternal: t.isExternal ?? !1, children: e(i, { children: t.children }) }) : e(g, { cursor: "pointer", color: "neutral800", background: "transparent", borderStyle: "none", ...t, children: e(i, { children: t.children }) }) }), h = ({ theme: r }) => w`
+  text-align: left;
+  width: 100%;
+  border-radius: ${r.borderRadius};
+  padding: ${r.spaces[2]} ${r.spaces[4]};
+
+  ${i} {
+    color: inherit;
+  }
+
+  &[aria-disabled] {
+    cursor: not-allowed;
+
+    ${i} {
+      color: ${r.colors.neutral500};
+    }
+  }
+
+  &[data-highlighted] {
+    background-color: ${r.colors.primary100};
+  }
+
+  &:focus-visible {
+    outline: none;
+
+    &:after {
+      content: none;
+    }
+  }
+`, g = l(c)`
+  ${h}
+`, L = l(y)`
+  /* We include this here again because typically when people use OptionLink they provide an as prop which cancels the Box props */
+  color: ${({ theme: r, color: o }) => x(r.colors, o, void 0)};
+  text-decoration: none;
+
+  &:hover {
+    color: unset;
+  }
+
+  svg > path,
+  &:focus-visible svg > path {
+    fill: currentColor;
+  }
+
+  ${h}
+`, M = a((r, o) => e(n.Label, { asChild: !0, children: e(I, { ref: o, variant: "sigma", textColor: "neutral600", ...r }) })), I = l(i)`
+  padding: ${({ theme: r }) => r.spaces[2]} ${({ theme: r }) => r.spaces[4]};
+`, B = n.Sub, O = a(({ disabled: r = !1, ...o }, t) => e(n.SubTrigger, { asChild: !0, disabled: r, children: s(E, { ref: t, color: "neutral800", as: "button", type: "button", background: "transparent", borderStyle: "none", gap: 5, ...o, children: [e(i, { children: o.children }), e(W, { height: 12, width: 12 })] }) })), E = l(g)`
+  &[data-state='open'] {
+    background-color: ${({ theme: r }) => r.colors.primary100};
+  }
+`, W = l(S)`
+  path {
+    fill: ${({ theme: r }) => r.colors.neutral500};
+  }
+`, j = a((r, o) => e(n.Portal, { children: e(n.SubContent, { sideOffset: 8, asChild: !0, children: e(u, { ref: o, direction: "column", borderStyle: "solid", borderWidth: "1px", borderColor: "neutral150", hasRadius: !0, background: "neutral0", shadow: "filterShadow", maxHeight: "15rem", padding: 1, alignItems: "flex-start", overflow: "auto", ...r }) }) })), N = v, Q = k, U = R, X = T, Y = M, Z = B, _ = O, z = j;
+export {
+  U as Content,
+  X as Item,
+  Y as Label,
+  N as Root,
+  z as SubContent,
+  Z as SubRoot,
+  _ as SubTrigger,
+  Q as Trigger
+};

package/dist/v2/SimpleMenu/SimpleMenu.cjs

@@ -1,33 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),D=require("@radix-ui/react-use-callback-ref"),z=require("@strapi/icons"),U=require("prop-types"),H=require("styled-components"),T=require("./utils.cjs"),G=require("../../BaseLink/BaseLink.cjs"),k=require("../../Box/Box.cjs"),M=require("../../Button/Button.cjs"),J=require("../../Flex/Flex.cjs"),u=require("../../helpers/keyboardKeys.cjs"),Q=require("../../hooks/useId.cjs"),j=require("../../Popover/Popover.cjs"),C=require("../../Typography/Typography.cjs"),X=require("../Link/Link.cjs"),q=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=q(a),t=q(U),y=q(H),Y=y.default.button`
-  border: none;
-  padding: 0;
-  background: transparent;
-  cursor: pointer;
-  ${T.getOptionStyle}
-`,Z=y.default(G.BaseLink)`
-  text-decoration: none;
-  ${T.getOptionStyle}
-`,ee=y.default(X.Link)`
-  &:focus-visible {
-    /* Removes Link focus-visible after properties and reset to global outline */
-    outline: 2px solid ${({theme:e})=>e.colors.primary600};
-    outline-offset: 2px;
-    &:after {
-      content: none;
-    }
-  }
-  /* Removes Link svg color */
-  svg path {
-    fill: currentColor;
-  }
-  ${T.getOptionStyle}
-`,te=y.default.span`
-  display: flex;
-  align-items: center;
-  svg {
-    height: 4px;
-    width: 6px;
-  }
-`,ne=y.default(M.Button)`
-  padding: ${({theme:e})=>`${e.spaces[1]} ${e.spaces[3]}`};
-`,I=({as:e,children:i,onClick:E,isFocused:c,isLink:h,isExternal:b,...x})=>{const d=a.useRef();a.useEffect(()=>{c&&d.current&&d.current.focus()},[c]);const l={tabIndex:c?0:-1,ref:d,role:"menuitem",...x},v=r=>{(r.key===u.KeyboardKeys.SPACE||r.key===u.KeyboardKeys.ENTER)&&E()};return h?o.default.createElement(Z,{as:e,...l},o.default.createElement(k.Box,{padding:2},o.default.createElement(C.Typography,null,i))):b?o.default.createElement(ee,{isExternal:!0,...l},o.default.createElement(k.Box,{padding:2},o.default.createElement(C.Typography,null,i))):o.default.createElement(Y,{onKeyDown:v,onMouseDown:E,type:"button",...l},o.default.createElement(k.Box,{padding:2},o.default.createElement(C.Typography,null,i)))};I.defaultProps={as:void 0,onClick(){},isExternal:!1,isFocused:!1,isLink:!1};I.propTypes={as:t.default.elementType,children:t.default.node.isRequired,isExternal:t.default.bool,isFocused:t.default.bool,isLink:t.default.bool,onClick:t.default.func};const m=({label:e,children:i,id:E,as:c,onOpen:h=()=>{},onClose:b=()=>{},size:x,popoverPlacement:d,onReachEnd:l,...v})=>{const r=a.useRef(),B=Q.useId(E),K=a.useRef(!1),[f,p]=a.useState(!1),[P,R]=a.useState(0),g=a.Children.toArray(i),w=x==="S"?ne:M.Button,_=c||w,O=!!l&&typeof l=="function";a.useEffect(()=>{if(["string","number"].includes(typeof e)){const n=g.findIndex(s=>s.props.children===e);n!==-1&&R(n)}},[e]);const S=D.useCallbackRef(h),L=D.useCallbackRef(b);a.useEffect(()=>{K?.current?f?S():L():K.current=!0},[K,f,S,L]),a.useEffect(()=>{o.default.isValidElement(e)&&P===-1&&r.current.focus()},[e,P]);const $=n=>{f&&(n.key===u.KeyboardKeys.ESCAPE&&(n.stopPropagation(),p(!1),r.current.focus()),n.key===u.KeyboardKeys.DOWN&&R(s=>s===g.length-1?0:s+1),n.key===u.KeyboardKeys.UP&&R(s=>s===0?g.length-1:s-1))},F=n=>{(n.key===u.KeyboardKeys.ENTER||n.key===u.KeyboardKeys.SPACE)&&p(s=>!s)},A=n=>{n.preventDefault(),n.currentTarget.contains(n.relatedTarget)||p(!1)},N=n=>{n.preventDefault(),p(s=>!s)},V=()=>{O&&l()},W=g.map((n,s)=>o.default.createElement(J.Flex,{as:"li",key:s,justifyContent:"center",role:"menuitem"},a.cloneElement(n,{onClick(){n.props.onClick(),p(!1),r.current.focus()},isFocused:P===s})));return o.default.createElement("div",{onKeyDown:$},o.default.createElement(_,{label:o.default.isValidElement(e)?null:e,"aria-haspopup":!0,"aria-expanded":f,"aria-controls":B,onKeyDown:F,onMouseDown:N,ref:r,type:"button",variant:"ghost",endIcon:o.default.createElement(te,null,o.default.createElement(z.CarretDown,{"aria-hidden":!0})),...v},e),f&&o.default.createElement(j.Popover,{onBlur:A,placement:d,source:r,onReachEnd:V,intersectionId:O?`popover-${B}`:void 0,spacing:4},o.default.createElement(k.Box,{role:"menu",as:"ul",padding:1,id:B},W)))};m.defaultProps={as:void 0};m.displayName="SimpleMenu";m.defaultProps={id:void 0,onClose(){},onOpen(){},onReachEnd:void 0,popoverPlacement:"bottom-start",size:"M"};m.propTypes={as:t.default.any,children:t.default.oneOfType([t.default.arrayOf(t.default.node),t.default.node]).isRequired,id:t.default.string,label:t.default.oneOfType([t.default.string,t.default.number,t.default.element]).isRequired,onClose:t.default.func,onOpen:t.default.func,onReachEnd:t.default.func,popoverPlacement:t.default.oneOf(j.POPOVER_PLACEMENTS),size:t.default.oneOf(["S","M"])};exports.MenuItem=I;exports.SimpleMenu=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),u=require("react"),n=require("./Menu.cjs"),p=require("../../helpers/strings.cjs"),M=require("../../hooks/useId.cjs"),q=require("../../hooks/useIntersection.cjs"),R=({children:l,onOpen:s,onClose:r,popoverPlacement:a,onReachEnd:o,...c})=>{const d=u.useRef(null),[I,f]=u.useState(!1),h=e=>{o&&o(e)},g=e=>{e&&typeof s=="function"?s():!e&&typeof r=="function"&&r(),f(e)},m=M.useId(),i=`intersection-${p.stripReactIdOfColon(m)}`;return q.useIntersection(d,h,{selectorToWatch:`#${i}`,skipWhen:!I}),t.jsxs(n.Root,{onOpenChange:g,children:[t.jsx(n.Trigger,{...c,children:c.label}),t.jsx(n.Content,{intersectionId:i,popoverPlacement:a,children:l})]})},j=n.Item;exports.Menu=n;exports.MenuItem=j;exports.SimpleMenu=R;