@strapi/design-system 0.0.0-typescript.0 → 0.0.0-typescript.2

package/dist/v2/Pagination/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Pagination";
+export * from "./components";

package/dist/v2/SimpleMenu/SimpleMenu.cjs

@@ -1,33 +1,19 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),N=require("prop-types"),V=require("styled-components"),D=require("@radix-ui/react-use-callback-ref"),W=require("@strapi/icons/CarretDown"),z=require("../Link/Link.cjs"),T=require("../../Typography/Typography.cjs"),b=require("../../Box/Box.cjs"),U=require("../../Flex/Flex.cjs"),I=require("../../Button/Button.cjs"),G=require("../../BaseLink/BaseLink.cjs"),L=require("../../Popover/Popover.cjs"),q=require("./utils.cjs"),H=require("../../helpers/useId.cjs"),l=require("../../helpers/keyboardKeys.cjs"),h=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=h(s),t=h(N),m=h(V),J=h(W),Q=m.default.button`
+"use strict";var Q=Object.defineProperty;var b=Object.getOwnPropertySymbols;var j=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable;var M=(e,s,t)=>s in e?Q(e,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[s]=t,m=(e,s)=>{for(var t in s||(s={}))j.call(s,t)&&M(e,t,s[t]);if(b)for(var t of b(s))_.call(s,t)&&M(e,t,s[t]);return e};var D=(e,s)=>{var t={};for(var a in e)j.call(e,a)&&s.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&b)for(var a of b(e))s.indexOf(a)<0&&_.call(e,a)&&(t[a]=e[a]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),X=require("prop-types"),Y=require("styled-components"),L=require("@radix-ui/react-use-callback-ref"),Z=require("@strapi/icons/CarretDown"),F=require("../../Typography/Typography.cjs"),I=require("../../Box/Box.cjs"),ee=require("../../Flex/Flex.cjs"),A=require("../../Button/Button.cjs"),te=require("../../BaseLink/BaseLink.cjs"),N=require("../../Popover/Popover.cjs"),$=require("./utils.cjs"),ne=require("../../helpers/useId.cjs"),d=require("../../helpers/keyboardKeys.cjs"),K=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=K(l),o=K(X),B=K(Y),oe=K(Z),se=B.default.button`
   border: none;
   padding: 0;
   background: transparent;
   cursor: pointer;
-  ${q.getOptionStyle}
-`,X=m.default(G.BaseLink)`
+  ${$.getOptionStyle}
+`,ae=B.default(te.BaseLink)`
   text-decoration: none;
-  ${q.getOptionStyle}
-`,Y=m.default(z.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;
-  }
-  ${q.getOptionStyle}
-`,Z=m.default.span`
+  ${$.getOptionStyle}
+`,re=B.default.span`
   display: flex;
   align-items: center;
   svg {
     height: 4px;
     width: 6px;
   }
-`,ee=m.default(I.Button)`
+`,ue=B.default(A.Button)`
   padding: ${({theme:e})=>`${e.spaces[1]} ${e.spaces[3]}`};
-`,O=({as:e,children:u,onClick:g,isFocused:i,isLink:x,isExternal:B,...C})=>{const c=s.useRef();s.useEffect(()=>{i&&c.current&&c.current.focus()},[i]);const d={tabIndex:i?0:-1,ref:c,role:"menuitem",...C},r=f=>{(f.key===l.KeyboardKeys.SPACE||f.key===l.KeyboardKeys.ENTER)&&g()};return x?o.default.createElement(X,{as:e,...d},o.default.createElement(b.Box,{padding:2},o.default.createElement(T.Typography,null,u))):B?o.default.createElement(Y,{isExternal:!0,...d},o.default.createElement(b.Box,{padding:2},o.default.createElement(T.Typography,null,u))):o.default.createElement(Q,{onKeyDown:r,onMouseDown:g,type:"button",...d},o.default.createElement(b.Box,{padding:2},o.default.createElement(T.Typography,null,u)))};O.defaultProps={as:void 0,onClick(){},isExternal:!1,isFocused:!1,isLink:!1};O.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 E=({label:e,children:u,id:g,as:i,onOpen:x=()=>{},onClose:B=()=>{},size:C,popoverPlacement:c,...d})=>{const r=s.useRef(),f=H.useId("simplemenu",g),K=s.useRef(!1),[p,y]=s.useState(!1),[v,P]=s.useState(0),k=s.Children.toArray(u),M=C==="S"?ee:I.Button,j=i||M;s.useEffect(()=>{if(["string","number"].includes(typeof e)){const n=k.findIndex(a=>a.props.children===e);n!==-1&&P(n)}},[e]);const R=D.useCallbackRef(x),S=D.useCallbackRef(B);s.useEffect(()=>{K?.current?p?R():S():K.current=!0},[K,p,R,S]),s.useEffect(()=>{o.default.isValidElement(e)&&v===-1&&r.current.focus()},[e,v]);const w=n=>{p&&(n.key===l.KeyboardKeys.ESCAPE&&(n.stopPropagation(),y(!1),r.current.focus()),n.key===l.KeyboardKeys.DOWN&&P(a=>a===k.length-1?0:a+1),n.key===l.KeyboardKeys.UP&&P(a=>a===0?k.length-1:a-1))},_=n=>{(n.key===l.KeyboardKeys.ENTER||n.key===l.KeyboardKeys.SPACE)&&y(a=>!a)},F=n=>{n.preventDefault(),n.currentTarget.contains(n.relatedTarget)||y(!1)},$=n=>{n.preventDefault(),y(a=>!a)},A=k.map((n,a)=>o.default.createElement(U.Flex,{as:"li",key:a,justifyContent:"center",role:"menuitem"},s.cloneElement(n,{onClick(){n.props.onClick(),y(!1),r.current.focus()},isFocused:v===a})));return o.default.createElement("div",{onKeyDown:w},o.default.createElement(j,{label:o.default.isValidElement(e)?null:e,"aria-haspopup":!0,"aria-expanded":p,"aria-controls":f,onKeyDown:_,onMouseDown:$,ref:r,type:"button",variant:"ghost",endIcon:o.default.createElement(Z,null,o.default.createElement(J.default,{"aria-hidden":!0})),...d},e),p&&o.default.createElement(L.Popover,{onBlur:F,placement:c,source:r,spacing:4},o.default.createElement(b.Box,{role:"menu",as:"ul",padding:1,id:f},A)))};E.defaultProps={as:void 0};E.displayName="SimpleMenu";E.defaultProps={id:void 0,onClose(){},onOpen(){},popoverPlacement:"bottom-start",size:"M"};E.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,popoverPlacement:t.default.oneOf(L.POPOVER_PLACEMENTS),size:t.default.oneOf(["S","M"])};exports.MenuItem=O;exports.SimpleMenu=E;
+`,S=O=>{var g=O,{as:e,children:s,onClick:t,isFocused:a,isLink:C}=g,P=D(g,["as","children","onClick","isFocused","isLink"]);const i=l.useRef();l.useEffect(()=>{a&&i.current&&i.current.focus()},[a]);const x=m({tabIndex:a?0:-1,ref:i,role:"menuitem"},P),h=c=>{(c.key===d.KeyboardKeys.SPACE||c.key===d.KeyboardKeys.ENTER)&&t()};return C?r.default.createElement(ae,m({as:e},x),r.default.createElement(I.Box,{padding:2},r.default.createElement(F.Typography,null,s))):r.default.createElement(se,m({onKeyDown:h,onMouseDown:t,type:"button"},x),r.default.createElement(I.Box,{padding:2},r.default.createElement(F.Typography,null,s)))};S.defaultProps={as:void 0,onClick(){},isFocused:!1,isLink:!1};S.propTypes={as:o.default.elementType,children:o.default.node.isRequired,isFocused:o.default.bool,isLink:o.default.bool,onClick:o.default.func};const E=x=>{var h=x,{label:e,children:s,id:t,as:a,onOpen:C=()=>{},onClose:P=()=>{},size:O,popoverPlacement:g}=h,i=D(h,["label","children","id","as","onOpen","onClose","size","popoverPlacement"]);const c=l.useRef(),R=ne.useId("simplemenu",t),f=l.useRef(!1),[p,y]=l.useState(!1),[T,q]=l.useState(0),k=l.Children.toArray(s),V=O==="S"?ue:A.Button,W=a||V;l.useEffect(()=>{if(["string","number"].includes(typeof e)){const n=k.findIndex(u=>u.props.children===e);n!==-1&&q(n)}},[e]);const v=L.useCallbackRef(C),w=L.useCallbackRef(P);l.useEffect(()=>{f!=null&&f.current?p?v():w():f.current=!0},[f,p,v,w]),l.useEffect(()=>{r.default.isValidElement(e)&&T===-1&&c.current.focus()},[e,T]);const z=n=>{p&&(n.key===d.KeyboardKeys.ESCAPE&&(n.stopPropagation(),y(!1),c.current.focus()),n.key===d.KeyboardKeys.DOWN&&q(u=>u===k.length-1?0:u+1),n.key===d.KeyboardKeys.UP&&q(u=>u===0?k.length-1:u-1))},U=n=>{(n.key===d.KeyboardKeys.ENTER||n.key===d.KeyboardKeys.SPACE)&&y(u=>!u)},G=n=>{n.preventDefault(),n.currentTarget.contains(n.relatedTarget)||y(!1)},H=n=>{n.preventDefault(),y(u=>!u)},J=k.map((n,u)=>r.default.createElement(ee.Flex,{as:"li",key:u,justifyContent:"center",role:"menuitem"},l.cloneElement(n,{onClick(){n.props.onClick(),y(!1),c.current.focus()},isFocused:T===u})));return r.default.createElement("div",{onKeyDown:z},r.default.createElement(W,m({label:r.default.isValidElement(e)?null:e,"aria-haspopup":!0,"aria-expanded":p,"aria-controls":R,onKeyDown:U,onMouseDown:H,ref:c,type:"button",variant:"ghost",endIcon:r.default.createElement(re,null,r.default.createElement(oe.default,{"aria-hidden":!0}))},i),e),p&&r.default.createElement(N.Popover,{onBlur:G,placement:g,source:c,spacing:4},r.default.createElement(I.Box,{role:"menu",as:"ul",padding:1,id:R},J)))};E.defaultProps={as:void 0};E.displayName="SimpleMenu";E.defaultProps={id:void 0,onClose(){},onOpen(){},popoverPlacement:"bottom-start",size:"M"};E.propTypes={as:o.default.any,children:o.default.oneOfType([o.default.arrayOf(o.default.node),o.default.node]).isRequired,id:o.default.string,label:o.default.oneOfType([o.default.string,o.default.number,o.default.element]).isRequired,onClose:o.default.func,onOpen:o.default.func,popoverPlacement:o.default.oneOf(N.POPOVER_PLACEMENTS),size:o.default.oneOf(["S","M"])};exports.MenuItem=S;exports.SimpleMenu=E;

package/dist/v2/SimpleMenu/SimpleMenu.d.ts

@@ -0,0 +1,70 @@
+export function MenuItem({ as, children, onClick, isFocused, isLink, ...props }: {
+    [x: string]: any;
+    as: any;
+    children: any;
+    onClick: any;
+    isFocused: any;
+    isLink: any;
+}): JSX.Element;
+export namespace MenuItem {
+    namespace defaultProps {
+        const as: undefined;
+        function onClick(): void;
+        const isFocused: boolean;
+        const isLink: boolean;
+    }
+    namespace propTypes {
+        const as_1: PropTypes.Requireable<PropTypes.ReactComponentLike>;
+        export { as_1 as as };
+        export const children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+        const isFocused_1: PropTypes.Requireable<boolean>;
+        export { isFocused_1 as isFocused };
+        const isLink_1: PropTypes.Requireable<boolean>;
+        export { isLink_1 as isLink };
+        export const onClick: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+}
+export function SimpleMenu({ label, children, id, as: asComp, onOpen, onClose, size, popoverPlacement, ...props }: {
+    [x: string]: any;
+    label: any;
+    children: any;
+    id: any;
+    as: any;
+    onOpen?: (() => void) | undefined;
+    onClose?: (() => void) | undefined;
+    size: any;
+    popoverPlacement: any;
+}): JSX.Element;
+export namespace SimpleMenu {
+    const defaultProps_1: {
+        as: undefined;
+        id?: undefined;
+        onClose?: undefined;
+        onOpen?: undefined;
+        popoverPlacement?: undefined;
+        size?: undefined;
+    } | {
+        id: undefined;
+        onClose(): void;
+        onOpen(): void;
+        popoverPlacement: string;
+        size: string;
+        as?: undefined;
+    };
+    export { defaultProps_1 as defaultProps };
+    export const displayName: string;
+    export namespace propTypes_1 {
+        const as_2: PropTypes.Requireable<any>;
+        export { as_2 as as };
+        const children_1: PropTypes.Validator<NonNullable<NonNullable<PropTypes.ReactNodeLike>>>;
+        export { children_1 as children };
+        export const id: PropTypes.Requireable<string>;
+        export const label: PropTypes.Validator<NonNullable<NonNullable<string | number | PropTypes.ReactElementLike | null | undefined>>>;
+        export const onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onOpen: PropTypes.Requireable<(...args: any[]) => any>;
+        export const popoverPlacement: PropTypes.Requireable<string>;
+        export const size: PropTypes.Requireable<string>;
+    }
+    export { propTypes_1 as propTypes };
+}
+import PropTypes from "prop-types";

package/dist/v2/SimpleMenu/SimpleMenu.js

@@ -1,176 +1,180 @@
-import t, { useRef as I, useEffect as g, useState as w, Children as q, cloneElement as W } from "react";
-import e from "prop-types";
-import d from "styled-components";
-import { useCallbackRef as M } from "@radix-ui/react-use-callback-ref";
-import _ from "@strapi/icons/CarretDown";
-import { Link as z } from "../Link/Link.js";
-import { Typography as b } from "../../Typography/Typography.js";
-import { Box as k } from "../../Box/Box.js";
-import { Flex as j } from "../../Flex/Flex.js";
-import { Button as B } from "../../Button/Button.js";
-import { BaseLink as U } from "../../BaseLink/BaseLink.js";
-import { POPOVER_PLACEMENTS as G, Popover as H } from "../../Popover/Popover.js";
-import { getOptionStyle as R } from "./utils.js";
-import { useId as J } from "../../helpers/useId.js";
-import { KeyboardKeys as i } from "../../helpers/keyboardKeys.js";
-const Q = d.button`
+var J = Object.defineProperty;
+var h = Object.getOwnPropertySymbols;
+var A = Object.prototype.hasOwnProperty, L = Object.prototype.propertyIsEnumerable;
+var K = (e, r, n) => r in e ? J(e, r, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[r] = n, d = (e, r) => {
+  for (var n in r || (r = {}))
+    A.call(r, n) && K(e, n, r[n]);
+  if (h)
+    for (var n of h(r))
+      L.call(r, n) && K(e, n, r[n]);
+  return e;
+};
+var w = (e, r) => {
+  var n = {};
+  for (var s in e)
+    A.call(e, s) && r.indexOf(s) < 0 && (n[s] = e[s]);
+  if (e != null && h)
+    for (var s of h(e))
+      r.indexOf(s) < 0 && L.call(e, s) && (n[s] = e[s]);
+  return n;
+};
+import i, { useRef as x, useEffect as C, useState as N, Children as Q, cloneElement as X } from "react";
+import o from "prop-types";
+import k from "styled-components";
+import { useCallbackRef as $ } from "@radix-ui/react-use-callback-ref";
+import Y from "@strapi/icons/CarretDown";
+import { Typography as F } from "../../Typography/Typography.js";
+import { Box as R } from "../../Box/Box.js";
+import { Flex as Z } from "../../Flex/Flex.js";
+import { Button as V } from "../../Button/Button.js";
+import { BaseLink as ee } from "../../BaseLink/BaseLink.js";
+import { POPOVER_PLACEMENTS as ne, Popover as te } from "../../Popover/Popover.js";
+import { getOptionStyle as q } from "./utils.js";
+import { useId as oe } from "../../helpers/useId.js";
+import { KeyboardKeys as c } from "../../helpers/keyboardKeys.js";
+const re = k.button`
   border: none;
   padding: 0;
   background: transparent;
   cursor: pointer;
-  ${R}
-`, X = d(U)`
+  ${q}
+`, se = k(ee)`
   text-decoration: none;
-  ${R}
-`, Y = d(z)`
-  &:focus-visible {
-    /* Removes Link focus-visible after properties and reset to global outline */
-    outline: 2px solid ${({ theme: o }) => o.colors.primary600};
-    outline-offset: 2px;
-    &:after {
-      content: none;
-    }
-  }
-  /* Removes Link svg color */
-  svg path {
-    fill: currentColor;
-  }
-  ${R}
-`, Z = d.span`
+  ${q}
+`, ie = k.span`
   display: flex;
   align-items: center;
   svg {
     height: 4px;
     width: 6px;
   }
-`, ee = d(B)`
-  padding: ${({ theme: o }) => `${o.spaces[1]} ${o.spaces[3]}`};
-`, L = ({ as: o, children: a, onClick: y, isFocused: l, isLink: C, isExternal: x, ...v }) => {
-  const c = I();
-  g(() => {
-    l && c.current && c.current.focus();
-  }, [l]);
-  const p = {
-    tabIndex: l ? 0 : -1,
-    ref: c,
-    role: "menuitem",
-    ...v
-  }, s = (u) => {
-    (u.key === i.SPACE || u.key === i.ENTER) && y();
+`, ae = k(V)`
+  padding: ${({ theme: e }) => `${e.spaces[1]} ${e.spaces[3]}`};
+`, W = (b) => {
+  var y = b, { as: e, children: r, onClick: n, isFocused: s, isLink: D } = y, I = w(y, ["as", "children", "onClick", "isFocused", "isLink"]);
+  const p = x();
+  C(() => {
+    s && p.current && p.current.focus();
+  }, [s]);
+  const O = d({
+    tabIndex: s ? 0 : -1,
+    ref: p,
+    role: "menuitem"
+  }, I), E = (l) => {
+    (l.key === c.SPACE || l.key === c.ENTER) && n();
   };
-  return C ? /* @__PURE__ */ t.createElement(X, {
-    as: o,
-    ...p
-  }, /* @__PURE__ */ t.createElement(k, {
+  return D ? /* @__PURE__ */ i.createElement(se, d({
+    as: e
+  }, O), /* @__PURE__ */ i.createElement(R, {
     padding: 2
-  }, /* @__PURE__ */ t.createElement(b, null, a))) : x ? /* @__PURE__ */ t.createElement(Y, {
-    isExternal: !0,
-    ...p
-  }, /* @__PURE__ */ t.createElement(k, {
+  }, /* @__PURE__ */ i.createElement(F, null, r))) : /* @__PURE__ */ i.createElement(re, d({
+    onKeyDown: E,
+    onMouseDown: n,
+    type: "button"
+  }, O), /* @__PURE__ */ i.createElement(R, {
     padding: 2
-  }, /* @__PURE__ */ t.createElement(b, null, a))) : /* @__PURE__ */ t.createElement(Q, {
-    onKeyDown: s,
-    onMouseDown: y,
-    type: "button",
-    ...p
-  }, /* @__PURE__ */ t.createElement(k, {
-    padding: 2
-  }, /* @__PURE__ */ t.createElement(b, null, a)));
+  }, /* @__PURE__ */ i.createElement(F, null, r)));
 };
-L.defaultProps = {
+W.defaultProps = {
   as: void 0,
   onClick() {
   },
-  isExternal: !1,
   isFocused: !1,
   isLink: !1
 };
-L.propTypes = {
-  as: e.elementType,
-  children: e.node.isRequired,
-  isExternal: e.bool,
-  isFocused: e.bool,
-  isLink: e.bool,
-  onClick: e.func
+W.propTypes = {
+  as: o.elementType,
+  children: o.node.isRequired,
+  isFocused: o.bool,
+  isLink: o.bool,
+  onClick: o.func
 };
-const h = ({
-  label: o,
-  children: a,
-  id: y,
-  as: l,
-  onOpen: C = () => {
-  },
-  onClose: x = () => {
-  },
-  size: v,
-  popoverPlacement: c,
-  ...p
-}) => {
-  const s = I(), u = J("simplemenu", y), P = I(!1), [m, f] = w(!1), [D, O] = w(0), E = q.toArray(a), K = l || (v === "S" ? ee : B);
-  g(() => {
-    if (["string", "number"].includes(typeof o)) {
-      const n = E.findIndex((r) => r.props.children === o);
-      n !== -1 && O(n);
+const P = (O) => {
+  var E = O, {
+    label: e,
+    children: r,
+    id: n,
+    as: s,
+    onOpen: D = () => {
+    },
+    onClose: I = () => {
+    },
+    size: b,
+    popoverPlacement: y
+  } = E, p = w(E, [
+    "label",
+    "children",
+    "id",
+    "as",
+    "onOpen",
+    "onClose",
+    "size",
+    "popoverPlacement"
+  ]);
+  const l = x(), v = oe("simplemenu", n), u = x(!1), [m, f] = N(!1), [T, S] = N(0), g = Q.toArray(r), _ = s || (b === "S" ? ae : V);
+  C(() => {
+    if (["string", "number"].includes(typeof e)) {
+      const t = g.findIndex((a) => a.props.children === e);
+      t !== -1 && S(t);
     }
-  }, [o]);
-  const T = M(C), S = M(x);
-  g(() => {
-    P?.current ? m ? T() : S() : P.current = !0;
-  }, [P, m, T, S]), g(() => {
-    t.isValidElement(o) && D === -1 && s.current.focus();
-  }, [o, D]);
-  const $ = (n) => {
-    m && (n.key === i.ESCAPE && (n.stopPropagation(), f(!1), s.current.focus()), n.key === i.DOWN && O((r) => r === E.length - 1 ? 0 : r + 1), n.key === i.UP && O((r) => r === 0 ? E.length - 1 : r - 1));
-  }, A = (n) => {
-    (n.key === i.ENTER || n.key === i.SPACE) && f((r) => !r);
-  }, N = (n) => {
-    n.preventDefault(), n.currentTarget.contains(n.relatedTarget) || f(!1);
-  }, F = (n) => {
-    n.preventDefault(), f((r) => !r);
-  }, V = E.map((n, r) => /* @__PURE__ */ t.createElement(j, {
+  }, [e]);
+  const B = $(D), M = $(I);
+  C(() => {
+    u != null && u.current ? m ? B() : M() : u.current = !0;
+  }, [u, m, B, M]), C(() => {
+    i.isValidElement(e) && T === -1 && l.current.focus();
+  }, [e, T]);
+  const z = (t) => {
+    m && (t.key === c.ESCAPE && (t.stopPropagation(), f(!1), l.current.focus()), t.key === c.DOWN && S((a) => a === g.length - 1 ? 0 : a + 1), t.key === c.UP && S((a) => a === 0 ? g.length - 1 : a - 1));
+  }, j = (t) => {
+    (t.key === c.ENTER || t.key === c.SPACE) && f((a) => !a);
+  }, U = (t) => {
+    t.preventDefault(), t.currentTarget.contains(t.relatedTarget) || f(!1);
+  }, G = (t) => {
+    t.preventDefault(), f((a) => !a);
+  }, H = g.map((t, a) => /* @__PURE__ */ i.createElement(Z, {
     as: "li",
-    key: r,
+    key: a,
     justifyContent: "center",
     role: "menuitem"
-  }, W(n, {
+  }, X(t, {
     onClick() {
-      n.props.onClick(), f(!1), s.current.focus();
+      t.props.onClick(), f(!1), l.current.focus();
     },
-    isFocused: D === r
+    isFocused: T === a
   })));
-  return /* @__PURE__ */ t.createElement("div", {
-    onKeyDown: $
-  }, /* @__PURE__ */ t.createElement(K, {
-    label: t.isValidElement(o) ? null : o,
+  return /* @__PURE__ */ i.createElement("div", {
+    onKeyDown: z
+  }, /* @__PURE__ */ i.createElement(_, d({
+    label: i.isValidElement(e) ? null : e,
     "aria-haspopup": !0,
     "aria-expanded": m,
-    "aria-controls": u,
-    onKeyDown: A,
-    onMouseDown: F,
-    ref: s,
+    "aria-controls": v,
+    onKeyDown: j,
+    onMouseDown: G,
+    ref: l,
     type: "button",
     variant: "ghost",
-    endIcon: /* @__PURE__ */ t.createElement(Z, null, /* @__PURE__ */ t.createElement(_, {
+    endIcon: /* @__PURE__ */ i.createElement(ie, null, /* @__PURE__ */ i.createElement(Y, {
       "aria-hidden": !0
-    })),
-    ...p
-  }, o), m && /* @__PURE__ */ t.createElement(H, {
-    onBlur: N,
-    placement: c,
-    source: s,
+    }))
+  }, p), e), m && /* @__PURE__ */ i.createElement(te, {
+    onBlur: U,
+    placement: y,
+    source: l,
     spacing: 4
-  }, /* @__PURE__ */ t.createElement(k, {
+  }, /* @__PURE__ */ i.createElement(R, {
     role: "menu",
     as: "ul",
     padding: 1,
-    id: u
-  }, V)));
+    id: v
+  }, H)));
 };
-h.defaultProps = {
+P.defaultProps = {
   as: void 0
 };
-h.displayName = "SimpleMenu";
-h.defaultProps = {
+P.displayName = "SimpleMenu";
+P.defaultProps = {
   id: void 0,
   onClose() {
   },
@@ -179,17 +183,17 @@ h.defaultProps = {
   popoverPlacement: "bottom-start",
   size: "M"
 };
-h.propTypes = {
-  as: e.any,
-  children: e.oneOfType([e.arrayOf(e.node), e.node]).isRequired,
-  id: e.string,
-  label: e.oneOfType([e.string, e.number, e.element]).isRequired,
-  onClose: e.func,
-  onOpen: e.func,
-  popoverPlacement: e.oneOf(G),
-  size: e.oneOf(["S", "M"])
+P.propTypes = {
+  as: o.any,
+  children: o.oneOfType([o.arrayOf(o.node), o.node]).isRequired,
+  id: o.string,
+  label: o.oneOfType([o.string, o.number, o.element]).isRequired,
+  onClose: o.func,
+  onOpen: o.func,
+  popoverPlacement: o.oneOf(ne),
+  size: o.oneOf(["S", "M"])
 };
 export {
-  L as MenuItem,
-  h as SimpleMenu
+  W as MenuItem,
+  P as SimpleMenu
 };

package/dist/v2/SimpleMenu/index.d.ts

@@ -0,0 +1 @@
+export * from "./SimpleMenu";

package/dist/v2/SimpleMenu/utils.d.ts

@@ -0,0 +1,3 @@
+export function getOptionStyle({ theme }: {
+    theme: any;
+}): string;

package/dist/v2/SubNav/SubNav.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),i=require("styled-components"),u=require("prop-types"),d=require("../../Grid/Grid.cjs");require("../../Grid/GridItem.cjs");const t=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=t(s),c=t(i),n=t(u),r=`${232/16}rem`,p=c.default(d.Grid)`
-  width: ${r};
+"use strict";var b=Object.defineProperty;var a=Object.getOwnPropertySymbols;var u=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var i=(e,t,r)=>t in e?b(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,l=(e,t)=>{for(var r in t||(t={}))u.call(t,r)&&i(e,r,t[r]);if(a)for(var r of a(t))d.call(t,r)&&i(e,r,t[r]);return e};var c=(e,t)=>{var r={};for(var o in e)u.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(e!=null&&a)for(var o of a(e))t.indexOf(o)<0&&d.call(e,o)&&(r[o]=e[o]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react"),y=require("styled-components"),v=require("prop-types"),_=require("../../Grid/Grid.cjs");require("../../Grid/GridItem.cjs");const s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},g=s(f),h=s(y),q=s(v),n=`${232/16}rem`,G=h.default(_.Grid)`
+  width: ${n};
   background: ${({theme:e})=>e.colors.neutral100};
   position: sticky;
   top: 0;
@@ -7,4 +7,4 @@
   overflow-y: auto;
   border-right: 1px solid ${({theme:e})=>e.colors.neutral200};
   z-index: 1;
-`,o=({ariaLabel:e,...a})=>l.default.createElement(p,{"aria-label":e,as:"nav",...a});o.propTypes={ariaLabel:n.default.string.isRequired};exports.SubNav=o;exports.subNavWidth=r;
+`,p=r=>{var o=r,{ariaLabel:e}=o,t=c(o,["ariaLabel"]);return g.default.createElement(G,l({"aria-label":e,as:"nav"},t))};p.propTypes={ariaLabel:q.default.string.isRequired};exports.SubNav=p;exports.subNavWidth=n;

package/dist/v2/SubNav/SubNav.d.ts

@@ -0,0 +1,11 @@
+export const subNavWidth: string;
+export function SubNav({ ariaLabel, ...props }: {
+    [x: string]: any;
+    ariaLabel: any;
+}): JSX.Element;
+export namespace SubNav {
+    namespace propTypes {
+        const ariaLabel: PropTypes.Validator<string>;
+    }
+}
+import PropTypes from "prop-types";

package/dist/v2/SubNav/SubNav.js

@@ -1,10 +1,30 @@
-import t from "react";
-import e from "styled-components";
-import i from "prop-types";
-import { Grid as a } from "../../Grid/Grid.js";
+var m = Object.defineProperty;
+var i = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, s = Object.prototype.propertyIsEnumerable;
+var a = (r, o, t) => o in r ? m(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t, l = (r, o) => {
+  for (var t in o || (o = {}))
+    p.call(o, t) && a(r, t, o[t]);
+  if (i)
+    for (var t of i(o))
+      s.call(o, t) && a(r, t, o[t]);
+  return r;
+};
+var n = (r, o) => {
+  var t = {};
+  for (var e in r)
+    p.call(r, e) && o.indexOf(e) < 0 && (t[e] = r[e]);
+  if (r != null && i)
+    for (var e of i(r))
+      o.indexOf(e) < 0 && s.call(r, e) && (t[e] = r[e]);
+  return t;
+};
+import d from "react";
+import u from "styled-components";
+import c from "prop-types";
+import { Grid as b } from "../../Grid/Grid.js";
 import "../../Grid/GridItem.js";
-const p = `${232 / 16}rem`, s = e(a)`
-  width: ${p};
+const f = `${232 / 16}rem`, h = u(b)`
+  width: ${f};
   background: ${({ theme: r }) => r.colors.neutral100};
   position: sticky;
   top: 0;
@@ -12,15 +32,17 @@ const p = `${232 / 16}rem`, s = e(a)`
   overflow-y: auto;
   border-right: 1px solid ${({ theme: r }) => r.colors.neutral200};
   z-index: 1;
-`, l = ({ ariaLabel: r, ...o }) => /* @__PURE__ */ t.createElement(s, {
-  "aria-label": r,
-  as: "nav",
-  ...o
-});
-l.propTypes = {
-  ariaLabel: i.string.isRequired
+`, v = (t) => {
+  var e = t, { ariaLabel: r } = e, o = n(e, ["ariaLabel"]);
+  return /* @__PURE__ */ d.createElement(h, l({
+    "aria-label": r,
+    as: "nav"
+  }, o));
+};
+v.propTypes = {
+  ariaLabel: c.string.isRequired
 };
 export {
-  l as SubNav,
-  p as subNavWidth
+  v as SubNav,
+  f as subNavWidth
 };

package/dist/v2/SubNav/SubNavHeader.cjs

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