@strapi/design-system 1.6.3 → 1.6.4

package/dist/v2/MainNav/NavSection.js

@@ -1,45 +1,12 @@
 import e, { Children as m } from "react";
 import p from "prop-types";
+import { useMainNav as d } from "./MainNavContext.js";
 import { Box as l } from "../../Box/Box.js";
-import { Typography as d } from "../../Typography/Typography.js";
+import { Divider as s } from "../../Divider/Divider.js";
 import { Stack as t } from "../../Stack/Stack.js";
-import { useMainNav as s } from "./MainNavContext.js";
-import { VisuallyHidden as c } from "../../VisuallyHidden/VisuallyHidden.js";
-import { Divider as u } from "../../Divider/Divider.js";
-const g = ({ label: n, children: i, ...o }) => s() ? /* @__PURE__ */ e.createElement(t, {
-  spacing: 2
-}, /* @__PURE__ */ e.createElement(l, {
-  paddingTop: 1,
-  paddingBottom: 1,
-  background: "neutral0",
-  hasRadius: !0,
-  as: "span"
-}, /* @__PURE__ */ e.createElement(u, null), /* @__PURE__ */ e.createElement(c, null, /* @__PURE__ */ e.createElement("span", null, n))), /* @__PURE__ */ e.createElement(t, {
-  as: "ul",
-  spacing: 2,
-  ...o
-}, m.map(i, (r, a) => /* @__PURE__ */ e.createElement("li", {
-  key: a
-}, r)))) : /* @__PURE__ */ e.createElement(t, {
-  spacing: 2
-}, /* @__PURE__ */ e.createElement(l, {
-  paddingTop: 1,
-  paddingBottom: 1,
-  background: "neutral0",
-  paddingRight: 3,
-  paddingLeft: 3,
-  hasRadius: !0,
-  as: "span"
-}, /* @__PURE__ */ e.createElement(d, {
-  variant: "sigma",
-  textColor: "neutral600"
-}, n)), /* @__PURE__ */ e.createElement(t, {
-  as: "ul",
-  spacing: 2,
-  ...o
-}, m.map(i, (r, a) => /* @__PURE__ */ e.createElement("li", {
-  key: a
-}, r))));
+import { Typography as c } from "../../Typography/Typography.js";
+import { VisuallyHidden as u } from "../../VisuallyHidden/VisuallyHidden.js";
+const g = ({ label: n, children: i, ...o }) => d() ? /* @__PURE__ */ e.createElement(t, { spacing: 2 }, /* @__PURE__ */ e.createElement(l, { paddingTop: 1, paddingBottom: 1, background: "neutral0", hasRadius: !0, as: "span" }, /* @__PURE__ */ e.createElement(s, null), /* @__PURE__ */ e.createElement(u, null, /* @__PURE__ */ e.createElement("span", null, n))), /* @__PURE__ */ e.createElement(t, { as: "ul", spacing: 2, ...o }, m.map(i, (r, a) => /* @__PURE__ */ e.createElement("li", { key: a }, r)))) : /* @__PURE__ */ e.createElement(t, { spacing: 2 }, /* @__PURE__ */ e.createElement(l, { paddingTop: 1, paddingBottom: 1, background: "neutral0", paddingRight: 3, paddingLeft: 3, hasRadius: !0, as: "span" }, /* @__PURE__ */ e.createElement(c, { variant: "sigma", textColor: "neutral600" }, n)), /* @__PURE__ */ e.createElement(t, { as: "ul", spacing: 2, ...o }, m.map(i, (r, a) => /* @__PURE__ */ e.createElement("li", { key: a }, r))));
 g.propTypes = {
   children: p.node.isRequired,
   label: p.string.isRequired

package/dist/v2/MainNav/NavSections.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),d=require("prop-types"),l=require("styled-components"),u=require("../../Stack/Stack.cjs"),i=require("../../Box/Box.cjs"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=o(a),p=o(d),f=o(l),y=f.default(i.Box)`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),d=require("prop-types"),l=require("styled-components"),u=require("../../Box/Box.cjs"),i=require("../../Stack/Stack.cjs"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=o(a),p=o(d),f=o(l),y=f.default(u.Box)`
   flex-grow: 1;
   overflow-y: auto;
-`,r=({children:e,...c})=>t.default.createElement(y,{paddingLeft:3,paddingRight:2,paddingTop:3,paddingBottom:8},t.default.createElement(u.Stack,{as:"ul",spacing:4,...c},a.Children.map(e,(n,s)=>t.default.createElement("li",{key:s},n))));r.propTypes={children:p.default.node.isRequired};exports.NavSections=r;
+`,r=({children:e,...c})=>t.default.createElement(y,{paddingLeft:3,paddingRight:2,paddingTop:3,paddingBottom:8},t.default.createElement(i.Stack,{as:"ul",spacing:4,...c},a.Children.map(e,(n,s)=>t.default.createElement("li",{key:s},n))));r.propTypes={children:p.default.node.isRequired};exports.NavSections=r;

package/dist/v2/MainNav/NavSections.js

@@ -1,23 +1,12 @@
 import e, { Children as i } from "react";
 import n from "prop-types";
 import a from "styled-components";
-import { Stack as m } from "../../Stack/Stack.js";
-import { Box as d } from "../../Box/Box.js";
-const l = a(d)`
+import { Box as m } from "../../Box/Box.js";
+import { Stack as d } from "../../Stack/Stack.js";
+const l = a(m)`
   flex-grow: 1;
   overflow-y: auto;
-`, c = ({ children: o, ...r }) => /* @__PURE__ */ e.createElement(l, {
-  paddingLeft: 3,
-  paddingRight: 2,
-  paddingTop: 3,
-  paddingBottom: 8
-}, /* @__PURE__ */ e.createElement(m, {
-  as: "ul",
-  spacing: 4,
-  ...r
-}, i.map(o, (t, p) => /* @__PURE__ */ e.createElement("li", {
-  key: p
-}, t))));
+`, c = ({ children: o, ...r }) => /* @__PURE__ */ e.createElement(l, { paddingLeft: 3, paddingRight: 2, paddingTop: 3, paddingBottom: 8 }, /* @__PURE__ */ e.createElement(d, { as: "ul", spacing: 4, ...r }, i.map(o, (t, p) => /* @__PURE__ */ e.createElement("li", { key: p }, t))));
 c.propTypes = {
   children: n.node.isRequired
 };

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"),s=require("../../Avatar/Avatar.cjs");require("../../Avatar/AvatarGroup.cjs");const v=require("../../Typography/Typography.cjs"),g=require("../../Flex/Flex.cjs"),d=require("../../Box/Box.cjs"),x=require("./MainNavContext.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.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)`
   border-top: 1px solid ${({theme:e})=>e.colors.neutral150};
-`,a=t.default.forwardRef(({src:e,children:n,initials:i,...u},c)=>{const o=x.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(v.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;
+`,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;

package/dist/v2/MainNav/NavUser.js

@@ -1,39 +1,18 @@
 import e from "react";
 import r from "prop-types";
 import m from "styled-components";
-import { Avatar as s, Initials as c } from "../../Avatar/Avatar.js";
+import { useMainNav as s } from "./MainNavContext.js";
+import { Avatar as c, Initials as f } from "../../Avatar/Avatar.js";
 import "../../Avatar/AvatarGroup.js";
-import { Typography as f } from "../../Typography/Typography.js";
-import { Flex as u } from "../../Flex/Flex.js";
 import { Box as n } from "../../Box/Box.js";
-import { useMainNav as g } from "./MainNavContext.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 = g();
-  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(s, {
-    src: t,
-    alt: "",
-    "aria-hidden": !0
-  }) : /* @__PURE__ */ e.createElement(c, 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(f, {
-    ellipsis: !0,
-    textColor: "neutral600"
-  }, i))));
+  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))));
 });
 o.displayName = "NavUser";
 o.defaultProps = {

package/dist/v2/Pagination/Pagination.cjs

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

package/dist/v2/Pagination/Pagination.js

@@ -1,30 +1,25 @@
-import e, { Children as s } from "react";
-import a from "styled-components";
+import * as e from "react";
 import r from "prop-types";
-import { Flex as u } from "../../Flex/Flex.js";
+import i from "styled-components";
 import { PaginationContext as c } from "./PaginationContext.js";
-const d = a.nav``, g = a(u)`
+import { Flex as u } from "../../Flex/Flex.js";
+const d = i.nav``, f = i(u)`
   & > * + * {
     margin-left: ${({ theme: t }) => t.spaces[1]};
   }
-`, i = ({ children: t, label: n, activePage: o, pageCount: l }) => /* @__PURE__ */ e.createElement(c.Provider, {
-  value: { activePage: o, pageCount: l }
-}, /* @__PURE__ */ e.createElement(d, {
-  "aria-label": n
-}, /* @__PURE__ */ e.createElement(g, {
-  as: "ul"
-}, s.map(t, (m, p) => /* @__PURE__ */ e.createElement("li", {
-  key: p
-}, m)))));
-i.defaultProps = {
+`, 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"
 };
-i.propTypes = {
+o.propTypes = {
   activePage: r.number.isRequired,
   children: r.node.isRequired,
   label: r.string,
   pageCount: r.number.isRequired
 };
 export {
-  i as Pagination
+  o as Pagination
 };

package/dist/v2/Pagination/components.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const L=require("react"),k=require("styled-components"),q=require("prop-types"),g=require("@strapi/icons"),d=require("../../VisuallyHidden/VisuallyHidden.cjs"),u=require("./PaginationContext.cjs"),T=require("../../Typography/Typography.cjs"),x=require("../../themes/utils.cjs"),E=require("../../BaseLink/BaseLink.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=c(L),s=c(k),l=c(q),v=s.default(T.Typography)`
+"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(E.BaseLink).withConfig({shouldForwardProp:(e,t)=>!w[e]&&t(e)})`
+`,w={active:!0},p=s.default(T.BaseLink).withConfig({shouldForwardProp:(e,t)=>!w[e]&&t(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};

package/dist/v2/Pagination/components.js

@@ -1,17 +1,17 @@
 import t from "react";
-import s from "styled-components";
-import d from "prop-types";
 import { ChevronLeft as b, ChevronRight as y } from "@strapi/icons";
-import { VisuallyHidden as l } from "../../VisuallyHidden/VisuallyHidden.js";
+import d from "prop-types";
+import s from "styled-components";
 import { usePagination as c } from "./PaginationContext.js";
-import { Typography as P } from "../../Typography/Typography.js";
+import { BaseLink as P } from "../../BaseLink/BaseLink.js";
 import { buttonFocusStyle as E } from "../../themes/utils.js";
-import { BaseLink as k } from "../../BaseLink/BaseLink.js";
-const m = s(P)`
+import { Typography as k } from "../../Typography/Typography.js";
+import { VisuallyHidden as l } from "../../VisuallyHidden/VisuallyHidden.js";
+const m = s(k)`
   line-height: revert;
 `, w = {
   active: !0
-}, p = s(k).withConfig({
+}, p = s(P).withConfig({
   shouldForwardProp: (e, r) => !w[e] && r(e)
 })`
   padding: ${({ theme: e }) => e.spaces[3]};
@@ -48,48 +48,20 @@ const m = 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
-  }));
+  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
-  }));
+  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));
+  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"));
+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

package/dist/v2/SimpleMenu/SimpleMenu.cjs

@@ -1,13 +1,13 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),z=require("prop-types"),U=require("styled-components"),D=require("@radix-ui/react-use-callback-ref"),H=require("@strapi/icons"),G=require("../Link/Link.cjs"),C=require("../../Typography/Typography.cjs"),k=require("../../Box/Box.cjs"),J=require("../../Flex/Flex.cjs"),M=require("../../Button/Button.cjs"),Q=require("../../BaseLink/BaseLink.cjs"),j=require("../../Popover/Popover.cjs"),T=require("./utils.cjs"),X=require("../../helpers/useId.cjs"),u=require("../../helpers/keyboardKeys.cjs"),q=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=q(a),t=q(z),y=q(U),Y=y.default.button`
+"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("../../helpers/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(Q.BaseLink)`
+`,Z=y.default(G.BaseLink)`
   text-decoration: none;
   ${T.getOptionStyle}
-`,ee=y.default(G.Link)`
+`,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};
@@ -30,4 +30,4 @@
   }
 `,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=X.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(H.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;
+`,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;

package/dist/v2/SimpleMenu/SimpleMenu.js

@@ -1,28 +1,28 @@
 import t, { useRef as b, useEffect as E, useState as B, Children as z, cloneElement as j } from "react";
-import e from "prop-types";
-import m from "styled-components";
 import { useCallbackRef as L } from "@radix-ui/react-use-callback-ref";
 import { CarretDown as H } from "@strapi/icons";
-import { Link as U } from "../Link/Link.js";
-import { Typography as O } from "../../Typography/Typography.js";
+import e from "prop-types";
+import m from "styled-components";
+import { getOptionStyle as T } from "./utils.js";
+import { BaseLink as U } from "../../BaseLink/BaseLink.js";
 import { Box as g } from "../../Box/Box.js";
-import { Flex as G } from "../../Flex/Flex.js";
 import { Button as K } from "../../Button/Button.js";
-import { BaseLink as J } from "../../BaseLink/BaseLink.js";
-import { POPOVER_PLACEMENTS as Q, Popover as X } from "../../Popover/Popover.js";
-import { getOptionStyle as T } from "./utils.js";
-import { useId as Y } from "../../helpers/useId.js";
+import { Flex as G } from "../../Flex/Flex.js";
 import { KeyboardKeys as a } from "../../helpers/keyboardKeys.js";
+import { useId as J } from "../../helpers/useId.js";
+import { POPOVER_PLACEMENTS as Q, Popover as X } from "../../Popover/Popover.js";
+import { Typography as O } from "../../Typography/Typography.js";
+import { Link as Y } from "../Link/Link.js";
 const Z = m.button`
   border: none;
   padding: 0;
   background: transparent;
   cursor: pointer;
   ${T}
-`, ee = m(J)`
+`, ee = m(U)`
   text-decoration: none;
   ${T}
-`, ne = m(U)`
+`, ne = m(Y)`
   &:focus-visible {
     /* Removes Link focus-visible after properties and reset to global outline */
     outline: 2px solid ${({ theme: o }) => o.colors.primary600};
@@ -58,24 +58,7 @@ const Z = m.button`
   }, x = (s) => {
     (s.key === a.SPACE || s.key === a.ENTER) && d();
   };
-  return k ? /* @__PURE__ */ t.createElement(ee, {
-    as: o,
-    ...i
-  }, /* @__PURE__ */ t.createElement(g, {
-    padding: 2
-  }, /* @__PURE__ */ t.createElement(O, null, l))) : v ? /* @__PURE__ */ t.createElement(ne, {
-    isExternal: !0,
-    ...i
-  }, /* @__PURE__ */ t.createElement(g, {
-    padding: 2
-  }, /* @__PURE__ */ t.createElement(O, null, l))) : /* @__PURE__ */ t.createElement(Z, {
-    onKeyDown: x,
-    onMouseDown: d,
-    type: "button",
-    ...i
-  }, /* @__PURE__ */ t.createElement(g, {
-    padding: 2
-  }, /* @__PURE__ */ t.createElement(O, null, l)));
+  return k ? /* @__PURE__ */ t.createElement(ee, { as: o, ...i }, /* @__PURE__ */ t.createElement(g, { padding: 2 }, /* @__PURE__ */ t.createElement(O, null, l))) : v ? /* @__PURE__ */ t.createElement(ne, { isExternal: !0, ...i }, /* @__PURE__ */ t.createElement(g, { padding: 2 }, /* @__PURE__ */ t.createElement(O, null, l))) : /* @__PURE__ */ t.createElement(Z, { onKeyDown: x, onMouseDown: d, type: "button", ...i }, /* @__PURE__ */ t.createElement(g, { padding: 2 }, /* @__PURE__ */ t.createElement(O, null, l)));
 };
 $.defaultProps = {
   as: void 0,
@@ -107,7 +90,7 @@ const h = ({
   onReachEnd: i,
   ...x
 }) => {
-  const s = b(), P = Y(d), R = b(!1), [u, f] = B(!1), [D, I] = B(0), y = z.toArray(l), A = c || (C === "S" ? oe : K), S = !!i && typeof i == "function";
+  const s = b(), P = J(d), R = b(!1), [u, f] = B(!1), [D, I] = B(0), y = z.toArray(l), A = c || (C === "S" ? oe : K), S = !!i && typeof i == "function";
   E(() => {
     if (["string", "number"].includes(typeof o)) {
       const n = y.findIndex((r) => r.props.children === o);
@@ -130,46 +113,40 @@ const h = ({
     n.preventDefault(), f((r) => !r);
   }, W = () => {
     S && i();
-  }, _ = y.map((n, r) => /* @__PURE__ */ t.createElement(G, {
-    as: "li",
-    key: r,
-    justifyContent: "center",
-    role: "menuitem"
-  }, j(n, {
+  }, _ = y.map((n, r) => /* @__PURE__ */ t.createElement(G, { as: "li", key: r, justifyContent: "center", role: "menuitem" }, j(n, {
     onClick() {
       n.props.onClick(), f(!1), s.current.focus();
     },
     isFocused: D === r
   })));
-  return /* @__PURE__ */ t.createElement("div", {
-    onKeyDown: N
-  }, /* @__PURE__ */ t.createElement(A, {
-    label: t.isValidElement(o) ? null : o,
-    "aria-haspopup": !0,
-    "aria-expanded": u,
-    "aria-controls": P,
-    onKeyDown: F,
-    onMouseDown: q,
-    ref: s,
-    type: "button",
-    variant: "ghost",
-    endIcon: /* @__PURE__ */ t.createElement(te, null, /* @__PURE__ */ t.createElement(H, {
-      "aria-hidden": !0
-    })),
-    ...x
-  }, o), u && /* @__PURE__ */ t.createElement(X, {
-    onBlur: V,
-    placement: p,
-    source: s,
-    onReachEnd: W,
-    intersectionId: S ? `popover-${P}` : void 0,
-    spacing: 4
-  }, /* @__PURE__ */ t.createElement(g, {
-    role: "menu",
-    as: "ul",
-    padding: 1,
-    id: P
-  }, _)));
+  return /* @__PURE__ */ t.createElement("div", { onKeyDown: N }, /* @__PURE__ */ t.createElement(
+    A,
+    {
+      label: t.isValidElement(o) ? null : o,
+      "aria-haspopup": !0,
+      "aria-expanded": u,
+      "aria-controls": P,
+      onKeyDown: F,
+      onMouseDown: q,
+      ref: s,
+      type: "button",
+      variant: "ghost",
+      endIcon: /* @__PURE__ */ t.createElement(te, null, /* @__PURE__ */ t.createElement(H, { "aria-hidden": !0 })),
+      ...x
+    },
+    o
+  ), u && /* @__PURE__ */ t.createElement(
+    X,
+    {
+      onBlur: V,
+      placement: p,
+      source: s,
+      onReachEnd: W,
+      intersectionId: S ? `popover-${P}` : void 0,
+      spacing: 4
+    },
+    /* @__PURE__ */ t.createElement(g, { role: "menu", as: "ul", padding: 1, id: P }, _)
+  ));
 };
 h.defaultProps = {
   as: void 0

package/dist/v2/SubNav/SubNav.cjs

@@ -1,4 +1,4 @@
-"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)`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),i=require("prop-types"),u=require("styled-components"),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=n.default(d.Grid)`
   width: ${r};
   background: ${({theme:e})=>e.colors.neutral100};
   position: sticky;
@@ -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;
+`,o=({ariaLabel:e,...a})=>l.default.createElement(p,{"aria-label":e,as:"nav",...a});o.propTypes={ariaLabel:c.default.string.isRequired};exports.SubNav=o;exports.subNavWidth=r;

package/dist/v2/SubNav/SubNav.js

@@ -1,9 +1,9 @@
 import t from "react";
-import e from "styled-components";
-import i from "prop-types";
+import e from "prop-types";
+import i from "styled-components";
 import { Grid as a } from "../../Grid/Grid.js";
 import "../../Grid/GridItem.js";
-const p = `${232 / 16}rem`, s = e(a)`
+const p = `${232 / 16}rem`, s = i(a)`
   width: ${p};
   background: ${({ theme: r }) => r.colors.neutral100};
   position: sticky;
@@ -12,13 +12,9 @@ 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 = ({ ariaLabel: r, ...o }) => /* @__PURE__ */ t.createElement(s, { "aria-label": r, as: "nav", ...o });
 l.propTypes = {
-  ariaLabel: i.string.isRequired
+  ariaLabel: e.string.isRequired
 };
 export {
   l as SubNav,

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