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

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

@@ -0,0 +1,40 @@
+export function SubNavHeader({ as, label, searchLabel, searchable, onChange, value, onClear, onSubmit, id }: {
+    as: any;
+    label: any;
+    searchLabel: any;
+    searchable: any;
+    onChange: any;
+    value: any;
+    onClear: any;
+    onSubmit: any;
+    id: any;
+}): JSX.Element;
+export namespace SubNavHeader {
+    namespace defaultProps {
+        const as: string;
+        const searchable: boolean;
+        function onChange(): void;
+        function onClear(): void;
+        function onSubmit(): void;
+        const value: string;
+        const searchLabel: string;
+        const id: undefined;
+    }
+    namespace propTypes {
+        const as_1: PropTypes.Requireable<string>;
+        export { as_1 as as };
+        const id_1: PropTypes.Requireable<string>;
+        export { id_1 as id };
+        export const label: PropTypes.Validator<string>;
+        export const onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onClear: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onSubmit: PropTypes.Requireable<(...args: any[]) => any>;
+        const searchLabel_1: PropTypes.Requireable<string>;
+        export { searchLabel_1 as searchLabel };
+        const searchable_1: PropTypes.Requireable<boolean>;
+        export { searchable_1 as searchable };
+        const value_1: PropTypes.Requireable<string>;
+        export { value_1 as value };
+    }
+}
+import PropTypes from "prop-types";

package/dist/v2/SubNav/SubNavHeader.js

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

package/dist/v2/SubNav/SubNavLink.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("react"),b=require("prop-types"),h=require("styled-components"),x=require("@strapi/icons/Dot"),n=require("../../Box/Box.cjs"),c=require("../../Typography/Typography.cjs"),i=require("../../Flex/Flex.cjs"),B=require("../../BaseLink/BaseLink.cjs"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=r(m),o=r(b),s=r(h),$=r(x),v=s.default(n.Box)`
+"use strict";var L=Object.defineProperty;var n=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(e,t,l)=>t in e?L(e,t,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[t]=l,g=(e,t)=>{for(var l in t||(t={}))f.call(t,l)&&p(e,l,t[l]);if(n)for(var l of n(t))y.call(t,l)&&p(e,l,t[l]);return e};var m=(e,t)=>{var l={};for(var o in e)f.call(e,o)&&t.indexOf(o)<0&&(l[o]=e[o]);if(e!=null&&n)for(var o of n(e))t.indexOf(o)<0&&y.call(e,o)&&(l[o]=e[o]);return l};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const T=require("react"),_=require("prop-types"),k=require("styled-components"),S=require("@strapi/icons/Dot"),u=require("../../Box/Box.cjs"),x=require("../../Typography/Typography.cjs"),b=require("../../Flex/Flex.cjs"),q=require("../../BaseLink/BaseLink.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=s(T),a=s(_),c=s(k),E=s(S),j=c.default(u.Box)`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -15,7 +15,7 @@
       svg > * {
         fill: ${e.colors.primary700};
       }
-      ${c.Typography} {
+      ${x.Typography} {
         color: ${e.colors.primary700};
         font-weight: 500;
       }
@@ -25,15 +25,15 @@
   &:focus-visible {
     outline-offset: -2px;
   }
-`,u=s.default($.default)`
+`,h=c.default(E.default)`
   width: ${12/16}rem;
   height: ${4/16}rem;
   * {
-    fill: ${({theme:e,$active:l})=>l?e.colors.primary600:e.colors.neutral600};
+    fill: ${({theme:e,$active:t})=>t?e.colors.primary600:e.colors.neutral600};
   }
-`,L=s.default.div`
+`,w=c.default.div`
   svg {
     height: ${12/16}rem;
     width: ${12/16}rem;
   }
-`,a=t.default.forwardRef(({children:e,icon:l,withBullet:d,as:p,isSubSectionChild:f,...y},g)=>t.default.createElement(v,{as:p,icon:l,background:"neutral100",paddingLeft:f?9:7,paddingBottom:2,paddingTop:2,ref:g,...y},t.default.createElement(i.Flex,null,l?t.default.createElement(L,null,l):t.default.createElement(u,null),t.default.createElement(n.Box,{paddingLeft:2},t.default.createElement(c.Typography,{as:"span"},e))),d&&t.default.createElement(n.Box,{as:i.Flex,paddingRight:4},t.default.createElement(u,{$active:!0}))));a.displayName="SubNavLink";a.defaultProps={as:B.BaseLink,icon:null,isSubSectionChild:!1,withBullet:!1};a.propTypes={as:o.default.elementType,children:o.default.node.isRequired,icon:o.default.element,isSubSectionChild:o.default.bool,withBullet:o.default.bool};exports.SubNavLink=a;
+`,i=r.default.forwardRef((F,v)=>{var d=F,{children:e,icon:t,withBullet:l,as:o,isSubSectionChild:B}=d,$=m(d,["children","icon","withBullet","as","isSubSectionChild"]);return r.default.createElement(j,g({as:o,icon:t,background:"neutral100",paddingLeft:B?9:7,paddingBottom:2,paddingTop:2,ref:v},$),r.default.createElement(b.Flex,null,t?r.default.createElement(w,null,t):r.default.createElement(h,null),r.default.createElement(u.Box,{paddingLeft:2},r.default.createElement(x.Typography,{as:"span"},e))),l&&r.default.createElement(u.Box,{as:b.Flex,paddingRight:4},r.default.createElement(h,{$active:!0})))});i.displayName="SubNavLink";i.defaultProps={as:q.BaseLink,icon:null,isSubSectionChild:!1,withBullet:!1};i.propTypes={as:a.default.elementType,children:a.default.node.isRequired,icon:a.default.element,isSubSectionChild:a.default.bool,withBullet:a.default.bool};exports.SubNavLink=i;

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

@@ -0,0 +1,2 @@
+export const SubNavLink: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from "react";

package/dist/v2/SubNav/SubNavLink.js

@@ -1,12 +1,32 @@
-import r from "react";
-import t from "prop-types";
-import i from "styled-components";
-import g from "@strapi/icons/Dot";
-import { Box as l } from "../../Box/Box.js";
-import { Typography as p } from "../../Typography/Typography.js";
-import { Flex as a } from "../../Flex/Flex.js";
-import { BaseLink as y } from "../../BaseLink/BaseLink.js";
-const $ = i(l)`
+var w = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var d = Object.prototype.hasOwnProperty, u = Object.prototype.propertyIsEnumerable;
+var m = (e, r, o) => r in e ? w(e, r, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[r] = o, f = (e, r) => {
+  for (var o in r || (r = {}))
+    d.call(r, o) && m(e, o, r[o]);
+  if (n)
+    for (var o of n(r))
+      u.call(r, o) && m(e, o, r[o]);
+  return e;
+};
+var g = (e, r) => {
+  var o = {};
+  for (var t in e)
+    d.call(e, t) && r.indexOf(t) < 0 && (o[t] = e[t]);
+  if (e != null && n)
+    for (var t of n(e))
+      r.indexOf(t) < 0 && u.call(e, t) && (o[t] = e[t]);
+  return o;
+};
+import l from "react";
+import i from "prop-types";
+import s from "styled-components";
+import x from "@strapi/icons/Dot";
+import { Box as a } from "../../Box/Box.js";
+import { Typography as b } from "../../Typography/Typography.js";
+import { Flex as y } from "../../Flex/Flex.js";
+import { BaseLink as S } from "../../BaseLink/BaseLink.js";
+const k = s(a)`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -23,7 +43,7 @@ const $ = i(l)`
       svg > * {
         fill: ${e.colors.primary700};
       }
-      ${p} {
+      ${b} {
         color: ${e.colors.primary700};
         font-weight: 500;
       }
@@ -33,50 +53,52 @@ const $ = i(l)`
   &:focus-visible {
     outline-offset: -2px;
   }
-`, s = i(g)`
+`, $ = s(x)`
   width: ${12 / 16}rem;
   height: ${4 / 16}rem;
   * {
-    fill: ${({ theme: e, $active: o }) => o ? e.colors.primary600 : e.colors.neutral600};
+    fill: ${({ theme: e, $active: r }) => r ? e.colors.primary600 : e.colors.neutral600};
   }
-`, b = i.div`
+`, B = s.div`
   svg {
     height: ${12 / 16}rem;
     width: ${12 / 16}rem;
   }
-`, n = r.forwardRef(({ children: e, icon: o, withBullet: c, as: m, isSubSectionChild: d, ...u }, f) => /* @__PURE__ */ r.createElement($, {
-  as: m,
-  icon: o,
-  background: "neutral100",
-  paddingLeft: d ? 9 : 7,
-  paddingBottom: 2,
-  paddingTop: 2,
-  ref: f,
-  ...u
-}, /* @__PURE__ */ r.createElement(a, null, o ? /* @__PURE__ */ r.createElement(b, null, o) : /* @__PURE__ */ r.createElement(s, null), /* @__PURE__ */ r.createElement(l, {
-  paddingLeft: 2
-}, /* @__PURE__ */ r.createElement(p, {
-  as: "span"
-}, e))), c && /* @__PURE__ */ r.createElement(l, {
-  as: a,
-  paddingRight: 4
-}, /* @__PURE__ */ r.createElement(s, {
-  $active: !0
-}))));
-n.displayName = "SubNavLink";
-n.defaultProps = {
-  as: y,
+`, p = l.forwardRef((L, E) => {
+  var c = L, { children: e, icon: r, withBullet: o, as: t, isSubSectionChild: h } = c, v = g(c, ["children", "icon", "withBullet", "as", "isSubSectionChild"]);
+  return /* @__PURE__ */ l.createElement(k, f({
+    as: t,
+    icon: r,
+    background: "neutral100",
+    paddingLeft: h ? 9 : 7,
+    paddingBottom: 2,
+    paddingTop: 2,
+    ref: E
+  }, v), /* @__PURE__ */ l.createElement(y, null, r ? /* @__PURE__ */ l.createElement(B, null, r) : /* @__PURE__ */ l.createElement($, null), /* @__PURE__ */ l.createElement(a, {
+    paddingLeft: 2
+  }, /* @__PURE__ */ l.createElement(b, {
+    as: "span"
+  }, e))), o && /* @__PURE__ */ l.createElement(a, {
+    as: y,
+    paddingRight: 4
+  }, /* @__PURE__ */ l.createElement($, {
+    $active: !0
+  })));
+});
+p.displayName = "SubNavLink";
+p.defaultProps = {
+  as: S,
   icon: null,
   isSubSectionChild: !1,
   withBullet: !1
 };
-n.propTypes = {
-  as: t.elementType,
-  children: t.node.isRequired,
-  icon: t.element,
-  isSubSectionChild: t.bool,
-  withBullet: t.bool
+p.propTypes = {
+  as: i.elementType,
+  children: i.node.isRequired,
+  icon: i.element,
+  isSubSectionChild: i.bool,
+  withBullet: i.bool
 };
 export {
-  n as SubNavLink
+  p as SubNavLink
 };

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

@@ -0,0 +1,17 @@
+export function SubNavLinkSection({ label, children, id }: {
+    label: any;
+    children: any;
+    id: any;
+}): JSX.Element;
+export namespace SubNavLinkSection {
+    namespace defaultProps {
+        const id: undefined;
+    }
+    namespace propTypes {
+        export const children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+        const id_1: PropTypes.Requireable<string>;
+        export { id_1 as id };
+        export const label: PropTypes.Validator<string>;
+    }
+}
+import PropTypes from "prop-types";

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

@@ -0,0 +1,25 @@
+export function SubNavSection({ collapsable, label, badgeLabel, children, id }: {
+    collapsable: any;
+    label: any;
+    badgeLabel: any;
+    children: any;
+    id: any;
+}): JSX.Element;
+export namespace SubNavSection {
+    namespace defaultProps {
+        const badgeLabel: null;
+        const collapsable: boolean;
+        const id: undefined;
+    }
+    namespace propTypes {
+        const badgeLabel_1: PropTypes.Requireable<string>;
+        export { badgeLabel_1 as badgeLabel };
+        export const children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+        const collapsable_1: PropTypes.Requireable<boolean>;
+        export { collapsable_1 as collapsable };
+        const id_1: PropTypes.Requireable<string>;
+        export { id_1 as id };
+        export const label: PropTypes.Validator<string>;
+    }
+}
+import PropTypes from "prop-types";

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

@@ -0,0 +1,26 @@
+export function SubNavSectionLabel({ collapsable, label, onClick, ariaExpanded, ariaControls }: {
+    collapsable: any;
+    label: any;
+    onClick: any;
+    ariaExpanded: any;
+    ariaControls: any;
+}): JSX.Element;
+export namespace SubNavSectionLabel {
+    namespace defaultProps {
+        const ariaControls: null;
+        const ariaExpanded: null;
+        const collapsable: boolean;
+        function onClick(): void;
+    }
+    namespace propTypes {
+        const ariaControls_1: PropTypes.Requireable<string>;
+        export { ariaControls_1 as ariaControls };
+        const ariaExpanded_1: PropTypes.Requireable<boolean>;
+        export { ariaExpanded_1 as ariaExpanded };
+        const collapsable_1: PropTypes.Requireable<boolean>;
+        export { collapsable_1 as collapsable };
+        export const label: PropTypes.Validator<string>;
+        export const onClick: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+}
+import PropTypes from "prop-types";

package/dist/v2/SubNav/SubNavSections.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react"),s=require("prop-types"),l=require("../../Stack/Stack.cjs"),i=require("../../Box/Box.cjs"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=a(o),d=a(s),r=({children:e,...c})=>t.default.createElement(i.Box,{paddingTop:2,paddingBottom:4},t.default.createElement(l.Stack,{as:"ol",spacing:2,...c},o.Children.map(e,(n,u)=>t.default.createElement("li",{key:u},n))));r.propTypes={children:d.default.node.isRequired};exports.SubNavSections=r;
+"use strict";var _=Object.defineProperty;var r=Object.getOwnPropertySymbols;var u=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable;var n=(e,t,o)=>t in e?_(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,l=(e,t)=>{for(var o in t||(t={}))u.call(t,o)&&n(e,o,t[o]);if(r)for(var o of r(t))s.call(t,o)&&n(e,o,t[o]);return e};var i=(e,t)=>{var o={};for(var a in e)u.call(e,a)&&t.indexOf(a)<0&&(o[a]=e[a]);if(e!=null&&r)for(var a of r(e))t.indexOf(a)<0&&s.call(e,a)&&(o[a]=e[a]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react"),g=require("prop-types"),m=require("../../Stack/Stack.cjs"),b=require("../../Box/Box.cjs"),p=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=p(d),k=p(g),f=o=>{var a=o,{children:e}=a,t=i(a,["children"]);return c.default.createElement(b.Box,{paddingTop:2,paddingBottom:4},c.default.createElement(m.Stack,l({as:"ol",spacing:2},t),d.Children.map(e,(S,y)=>c.default.createElement("li",{key:y},S))))};f.propTypes={children:k.default.node.isRequired};exports.SubNavSections=f;

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

@@ -0,0 +1,10 @@
+export function SubNavSections({ children, ...props }: {
+    [x: string]: any;
+    children: any;
+}): JSX.Element;
+export namespace SubNavSections {
+    namespace propTypes {
+        const children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+    }
+}
+import PropTypes from "prop-types";

package/dist/v2/SubNav/SubNavSections.js

@@ -1,20 +1,42 @@
-import e, { Children as i } from "react";
-import m from "prop-types";
-import { Stack as n } from "../../Stack/Stack.js";
-import { Box as a } from "../../Box/Box.js";
-const c = ({ children: r, ...t }) => /* @__PURE__ */ e.createElement(a, {
-  paddingTop: 2,
-  paddingBottom: 4
-}, /* @__PURE__ */ e.createElement(n, {
-  as: "ol",
-  spacing: 2,
-  ...t
-}, i.map(r, (o, p) => /* @__PURE__ */ e.createElement("li", {
-  key: p
-}, o))));
-c.propTypes = {
-  children: m.node.isRequired
+var f = Object.defineProperty;
+var p = Object.getOwnPropertySymbols;
+var n = Object.prototype.hasOwnProperty, a = Object.prototype.propertyIsEnumerable;
+var m = (e, r, t) => r in e ? f(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, c = (e, r) => {
+  for (var t in r || (r = {}))
+    n.call(r, t) && m(e, t, r[t]);
+  if (p)
+    for (var t of p(r))
+      a.call(r, t) && m(e, t, r[t]);
+  return e;
+};
+var d = (e, r) => {
+  var t = {};
+  for (var o in e)
+    n.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && p)
+    for (var o of p(e))
+      r.indexOf(o) < 0 && a.call(e, o) && (t[o] = e[o]);
+  return t;
+};
+import i, { Children as u } from "react";
+import g from "prop-types";
+import { Stack as y } from "../../Stack/Stack.js";
+import { Box as E } from "../../Box/Box.js";
+const S = (t) => {
+  var o = t, { children: e } = o, r = d(o, ["children"]);
+  return /* @__PURE__ */ i.createElement(E, {
+    paddingTop: 2,
+    paddingBottom: 4
+  }, /* @__PURE__ */ i.createElement(y, c({
+    as: "ol",
+    spacing: 2
+  }, r), u.map(e, (l, s) => /* @__PURE__ */ i.createElement("li", {
+    key: s
+  }, l))));
+};
+S.propTypes = {
+  children: g.node.isRequired
 };
 export {
-  c as SubNavSections
+  S as SubNavSections
 };

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

@@ -0,0 +1,6 @@
+export * from "./SubNav";
+export * from "./SubNavHeader";
+export * from "./SubNavLink";
+export * from "./SubNavLinkSection";
+export * from "./SubNavSection";
+export * from "./SubNavSections";

package/dist/v2/index.d.ts

@@ -0,0 +1,7 @@
+export * from "./Breadcrumbs";
+export * from "./Link";
+export * from "./LinkButton";
+export * from "./MainNav";
+export * from "./Pagination";
+export * from "./SimpleMenu";
+export * from "./SubNav";

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@strapi/design-system",
-  "version": "0.0.0-typescript.0",
+  "version": "0.0.0-typescript.2",
   "license": "MIT",
   "type": "module",
   "sideEffects": false,
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "import": "./dist/index.js",
@@ -31,7 +32,7 @@
     "@storybook/addon-essentials": "^6.5.13",
     "@storybook/addon-links": "^6.5.13",
     "@storybook/react": "^6.5.13",
-    "@strapi/icons": "^0.0.0-typescript.0",
+    "@strapi/icons": "^0.0.0-typescript.2",
     "@swc/core": "^1.3.11",
     "@swc/jest": "^0.2.23",
     "@testing-library/jest-dom": "5.16.5",
@@ -80,5 +81,5 @@
     "@types/react": "17.0.2",
     "@types/react-dom": "17.0.2"
   },
-  "gitHead": "bfa8be35e4b6abf4175b17e2dce6ef0977f56d7a"
+  "gitHead": "256edd45151f2187f79a5a7b86d6faba4904ba9a"
 }

package/dist/Box/BoxProps.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react"),l=require("prop-types"),a=d=>d&&typeof d=="object"&&"default"in d?d:{default:d},r=a(u),e=a(l),t=d=>r.default.createElement("div",{...d}),o={background:void 0,borderColor:void 0,color:void 0,hiddenS:!1,hiddenXS:!1,padding:void 0,paddingTop:void 0,paddingRight:void 0,paddingBottom:void 0,paddingLeft:void 0,hasRadius:!1,shadow:void 0,children:null,shrink:void 0,grow:void 0,basis:void 0,flex:void 0,_hover:()=>{}},f={_hover:e.default.func,background:e.default.string,basis:e.default.oneOfType([e.default.string,e.default.string]),borderColor:e.default.string,children:e.default.oneOfType([e.default.node,e.default.string]),color:e.default.string,flex:e.default.oneOfType([e.default.string,e.default.string]),grow:e.default.oneOfType([e.default.string,e.default.string]),hasRadius:e.default.bool,hiddenS:e.default.bool,hiddenXS:e.default.bool,padding:e.default.oneOfType([e.default.number,e.default.arrayOf(e.default.number)]),paddingBottom:e.default.oneOfType([e.default.number,e.default.arrayOf(e.default.number)]),paddingLeft:e.default.oneOfType([e.default.number,e.default.arrayOf(e.default.number)]),paddingRight:e.default.oneOfType([e.default.number,e.default.arrayOf(e.default.number)]),paddingTop:e.default.oneOfType([e.default.number,e.default.arrayOf(e.default.number)]),shadow:e.default.string,shrink:e.default.oneOfType([e.default.string,e.default.string])};t.defaultProps=o;t.propTypes=f;exports.BoxProps=t;exports.boxDefaultProps=o;exports.boxPropTypes=f;

package/dist/Box/BoxProps.js

@@ -1,51 +0,0 @@
-import n from "react";
-import o from "prop-types";
-const r = (e) => /* @__PURE__ */ n.createElement("div", {
-  ...e
-}), d = {
-  background: void 0,
-  borderColor: void 0,
-  color: void 0,
-  hiddenS: !1,
-  hiddenXS: !1,
-  padding: void 0,
-  paddingTop: void 0,
-  paddingRight: void 0,
-  paddingBottom: void 0,
-  paddingLeft: void 0,
-  hasRadius: !1,
-  shadow: void 0,
-  children: null,
-  shrink: void 0,
-  grow: void 0,
-  basis: void 0,
-  flex: void 0,
-  _hover: () => {
-  }
-}, i = {
-  _hover: o.func,
-  background: o.string,
-  basis: o.oneOfType([o.string, o.string]),
-  borderColor: o.string,
-  children: o.oneOfType([o.node, o.string]),
-  color: o.string,
-  flex: o.oneOfType([o.string, o.string]),
-  grow: o.oneOfType([o.string, o.string]),
-  hasRadius: o.bool,
-  hiddenS: o.bool,
-  hiddenXS: o.bool,
-  padding: o.oneOfType([o.number, o.arrayOf(o.number)]),
-  paddingBottom: o.oneOfType([o.number, o.arrayOf(o.number)]),
-  paddingLeft: o.oneOfType([o.number, o.arrayOf(o.number)]),
-  paddingRight: o.oneOfType([o.number, o.arrayOf(o.number)]),
-  paddingTop: o.oneOfType([o.number, o.arrayOf(o.number)]),
-  shadow: o.string,
-  shrink: o.oneOfType([o.string, o.string])
-};
-r.defaultProps = d;
-r.propTypes = i;
-export {
-  r as BoxProps,
-  d as boxDefaultProps,
-  i as boxPropTypes
-};

package/dist/Flex/FlexProps.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),u=require("prop-types"),l=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},n=l(s),e=l(u),a=t=>n.default.createElement("div",{...t}),r={alignItems:"center",basis:void 0,direction:"row",gap:void 0,inline:!1,justifyContent:void 0,reverse:!1,shrink:void 0,wrap:void 0},o={alignItems:e.default.string,basis:e.default.oneOfType([e.default.string,e.default.number]),direction:e.default.string,gap:e.default.oneOfType([e.default.shape({desktop:e.default.number,mobile:e.default.number,tablet:e.default.number}),e.default.number,e.default.arrayOf(e.default.number),e.default.string]),inline:e.default.bool,justifyContent:e.default.string,reverse:e.default.bool,shrink:e.default.number,wrap:e.default.string};a.defaultProps=r;a.propTypes=o;exports.FlexProps=a;exports.flexDefaultProps=r;exports.flexPropTypes=o;