@strapi/design-system 1.4.0-beta.0 → 1.4.0-beta.1

package/dist/themes/darkTheme/index.js

@@ -1,11 +1,21 @@
-import { darkColorTokenObject as o } from "./dark-colors.js";
-import { darkShadowTokenObject as r } from "./dark-shadows.js";
-import { commonTheme as m } from "../common-theme.js";
-const c = {
-  colors: o.color,
-  shadows: r.shadow,
-  ...m
+var c = Object.defineProperty;
+var e = Object.getOwnPropertySymbols;
+var d = Object.prototype.hasOwnProperty, h = Object.prototype.propertyIsEnumerable;
+var t = (m, o, r) => o in m ? c(m, o, { enumerable: !0, configurable: !0, writable: !0, value: r }) : m[o] = r, a = (m, o) => {
+  for (var r in o || (o = {}))
+    d.call(o, r) && t(m, r, o[r]);
+  if (e)
+    for (var r of e(o))
+      h.call(o, r) && t(m, r, o[r]);
+  return m;
 };
+import { darkColorTokenObject as k } from "./dark-colors.js";
+import { darkShadowTokenObject as s } from "./dark-shadows.js";
+import { commonTheme as n } from "../common-theme.js";
+const l = a({
+  colors: k.color,
+  shadows: s.shadow
+}, n);
 export {
-  c as darkTheme
+  l as darkTheme
 };

package/dist/themes/extendTheme.cjs

@@ -1,13 +1,13 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("./lightTheme/index.cjs"),s=e=>`
-${e}
+"use strict";var m=Object.defineProperty;var s=Object.getOwnPropertySymbols;var a=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable;var h=(t,e,o)=>e in t?m(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,c=(t,e)=>{for(var o in e||(e={}))a.call(e,o)&&h(t,o,e[o]);if(s)for(var o of s(e))l.call(e,o)&&h(t,o,e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("./lightTheme/index.cjs"),u=t=>`
+${t}
 
 The following is an example:
 
 
-import { lightTheme, extendTheme } from '@strapi/design-system/themes';
+import { lightTheme, extendTheme } from '@strapi/design-system';
 
 const myCustomTheme = extendTheme(lightTheme, {
-    ${Object.keys(c.lightTheme).map(t=>`${t}: /* put the overrides for the ${t} key */,`).join(`
+    ${Object.keys(d.lightTheme).map(e=>`${e}: /* put the overrides for the ${e} key */,`).join(`
 `)}
 })
-`,r=e=>e&&typeof e=="object"&&!Array.isArray(e),h=(e,t)=>{const n={...e};return r(e)&&r(t)&&Object.keys(t).forEach(o=>{r(t[o])&&e.hasOwnProperty(o)?n[o]=h(e[o],t[o]):n[o]=t[o]}),n},m=(e,t)=>{if(!r(e)){const n=s("The first argument should be an object and corresponds to the theme you want to extend.");throw new Error(n)}if(!r(t)){const n=s("The second argument should be an object and corresponds to the keys of the theme you want to override.");throw new Error(n)}return h(e,t)};exports.extendTheme=m;
+`,r=t=>t&&typeof t=="object"&&!Array.isArray(t),i=(t,e)=>{const o=c({},t);return r(t)&&r(e)&&Object.keys(e).forEach(n=>{r(e[n])&&t.hasOwnProperty(n)?o[n]=i(t[n],e[n]):o[n]=e[n]}),o},f=(t,e)=>{if(!r(t)){const o=u("The first argument should be an object and corresponds to the theme you want to extend.");throw new Error(o)}if(!r(e)){const o=u("The second argument should be an object and corresponds to the keys of the theme you want to override.");throw new Error(o)}return i(t,e)};exports.extendTheme=f;

package/dist/themes/extendTheme.js

@@ -1,36 +1,47 @@
-import { lightTheme as m } from "./lightTheme/index.js";
-const h = (e) => `
-${e}
+var f = Object.defineProperty;
+var h = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, u = Object.prototype.propertyIsEnumerable;
+var s = (t, e, o) => e in t ? f(t, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[e] = o, c = (t, e) => {
+  for (var o in e || (e = {}))
+    p.call(e, o) && s(t, o, e[o]);
+  if (h)
+    for (var o of h(e))
+      u.call(e, o) && s(t, o, e[o]);
+  return t;
+};
+import { lightTheme as i } from "./lightTheme/index.js";
+const m = (t) => `
+${t}
 
 The following is an example:
 
 
-import { lightTheme, extendTheme } from '@strapi/design-system/themes';
+import { lightTheme, extendTheme } from '@strapi/design-system';
 
 const myCustomTheme = extendTheme(lightTheme, {
-    ${Object.keys(m).map((t) => `${t}: /* put the overrides for the ${t} key */,`).join(`
+    ${Object.keys(i).map((e) => `${e}: /* put the overrides for the ${e} key */,`).join(`
 `)}
 })
-`, r = (e) => e && typeof e == "object" && !Array.isArray(e), s = (e, t) => {
-  const n = { ...e };
-  return r(e) && r(t) && Object.keys(t).forEach((o) => {
-    r(t[o]) && e.hasOwnProperty(o) ? n[o] = s(e[o], t[o]) : n[o] = t[o];
-  }), n;
-}, a = (e, t) => {
-  if (!r(e)) {
-    const n = h(
+`, r = (t) => t && typeof t == "object" && !Array.isArray(t), a = (t, e) => {
+  const o = c({}, t);
+  return r(t) && r(e) && Object.keys(e).forEach((n) => {
+    r(e[n]) && t.hasOwnProperty(n) ? o[n] = a(t[n], e[n]) : o[n] = e[n];
+  }), o;
+}, b = (t, e) => {
+  if (!r(t)) {
+    const o = m(
       "The first argument should be an object and corresponds to the theme you want to extend."
     );
-    throw new Error(n);
+    throw new Error(o);
   }
-  if (!r(t)) {
-    const n = h(
+  if (!r(e)) {
+    const o = m(
       "The second argument should be an object and corresponds to the keys of the theme you want to override."
     );
-    throw new Error(n);
+    throw new Error(o);
   }
-  return s(e, t);
+  return a(t, e);
 };
 export {
-  a as extendTheme
+  b as extendTheme
 };

package/dist/themes/lightTheme/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./light-colors.cjs"),o=require("./light-shadows.cjs"),t=require("../common-theme.cjs"),s={colors:e.lightColorTokenObject.color,shadows:o.lightShadowTokenObject.shadow,...t.commonTheme};exports.lightTheme=s;
+"use strict";var c=Object.defineProperty;var s=Object.getOwnPropertySymbols;var r=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;var h=(t,e,o)=>e in t?c(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,l=(t,e)=>{for(var o in e||(e={}))r.call(e,o)&&h(t,o,e[o]);if(s)for(var o of s(e))i.call(e,o)&&h(t,o,e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("./light-colors.cjs"),n=require("./light-shadows.cjs"),g=require("../common-theme.cjs"),u=l({colors:m.lightColorTokenObject.color,shadows:n.lightShadowTokenObject.shadow},g.commonTheme);exports.lightTheme=u;

package/dist/themes/lightTheme/index.js

@@ -1,11 +1,21 @@
-import { lightColorTokenObject as o } from "./light-colors.js";
-import { lightShadowTokenObject as m } from "./light-shadows.js";
-import { commonTheme as r } from "../common-theme.js";
-const c = {
-  colors: o.color,
-  shadows: m.shadow,
-  ...r
+var c = Object.defineProperty;
+var t = Object.getOwnPropertySymbols;
+var i = Object.prototype.hasOwnProperty, l = Object.prototype.propertyIsEnumerable;
+var e = (r, o, m) => o in r ? c(r, o, { enumerable: !0, configurable: !0, writable: !0, value: m }) : r[o] = m, h = (r, o) => {
+  for (var m in o || (o = {}))
+    i.call(o, m) && e(r, m, o[m]);
+  if (t)
+    for (var m of t(o))
+      l.call(o, m) && e(r, m, o[m]);
+  return r;
 };
+import { lightColorTokenObject as s } from "./light-colors.js";
+import { lightShadowTokenObject as n } from "./light-shadows.js";
+import { commonTheme as p } from "../common-theme.js";
+const g = h({
+  colors: s.color,
+  shadows: n.shadow
+}, p);
 export {
-  c as lightTheme
+  g as lightTheme
 };

package/dist/themes/sizes.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={input:{S:`${32/16}rem`,M:`${40/16}rem`},accordions:{S:`${48/16}rem`,M:`${88/16}rem`},button:{S:`${32/16}rem`,M:`${36/16}rem`,L:`${40/16}rem`}};exports.sizes=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={input:{S:`${32/16}rem`,M:`${40/16}rem`},accordions:{S:`${48/16}rem`,M:`${88/16}rem`},badge:{S:`${16/16}rem`,M:`${24/16}rem`},button:{S:`${32/16}rem`,M:`${36/16}rem`,L:`${40/16}rem`}};exports.sizes=e;

package/dist/themes/sizes.js

@@ -7,6 +7,10 @@ const e = {
     S: `${3}rem`,
     M: `${5.5}rem`
   },
+  badge: {
+    S: `${1}rem`,
+    M: `${1.5}rem`
+  },
   button: {
     S: `${2}rem`,
     M: `${2.25}rem`,

package/dist/v2/Breadcrumbs/Breadcrumbs.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),h=require("prop-types"),p=require("styled-components"),m=require("../../Box/Box.cjs"),y=require("./Divider.cjs"),s=require("../../Flex/Flex.cjs"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=i(l),t=i(h),b=i(p),g=b.default(s.Flex)`
+"use strict";var _=Object.defineProperty;var i=Object.getOwnPropertySymbols;var h=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var f=(e,r,t)=>r in e?_(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,m=(e,r)=>{for(var t in r||(r={}))h.call(r,t)&&f(e,t,r[t]);if(i)for(var t of i(r))p.call(r,t)&&f(e,t,r[t]);return e};var y=(e,r)=>{var t={};for(var a in e)h.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&i)for(var a of i(e))r.indexOf(a)<0&&p.call(e,a)&&(t[a]=e[a]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react"),q=require("prop-types"),B=require("styled-components"),D=require("../../Box/Box.cjs"),T=require("./Divider.cjs"),b=require("../../Flex/Flex.cjs"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=d(o),l=d(q),j=d(B),F=j.default(b.Flex)`
   // CrumbLinks do have padding-x, because they need to have a
   // interaction effect, which mis-aligns the breadcrumbs on the left.
   // This normalizes the behavior by moving the first item to left by
@@ -6,4 +6,4 @@
   :first-child {
     margin-left: ${({theme:e})=>`calc(-1*${e.spaces[2]})`};
   }
-`,n=({label:e,children:o,...d})=>{const a=l.Children.toArray(o);return r.default.createElement(m.Box,{"aria-label":e,...d},r.default.createElement(g,{as:"ol",horizontal:!0},l.Children.map(a,(c,u)=>{const f=a.length>1&&u+1<a.length;return r.default.createElement(s.Flex,{inline:!0,as:"li"},c,f&&r.default.createElement(y.Divider,null))})))};n.displayName="Breadcrumbs";n.propTypes={children:t.default.oneOfType([t.default.arrayOf(t.default.node),t.default.node]).isRequired,label:t.default.string.isRequired};exports.Breadcrumbs=n;
+`,c=a=>{var u=a,{label:e,children:r}=u,t=y(u,["label","children"]);const s=o.Children.toArray(r);return n.default.createElement(D.Box,m({"aria-label":e},t),n.default.createElement(F,{as:"ol",horizontal:!0},o.Children.map(s,(g,v)=>{const x=s.length>1&&v+1<s.length;return n.default.createElement(b.Flex,{inline:!0,as:"li"},g,x&&n.default.createElement(T.Divider,null))})))};c.displayName="Breadcrumbs";c.propTypes={children:l.default.oneOfType([l.default.arrayOf(l.default.node),l.default.node]).isRequired,label:l.default.string.isRequired};exports.Breadcrumbs=c;

package/dist/v2/Breadcrumbs/Breadcrumbs.js

@@ -1,38 +1,58 @@
-import r, { Children as a } from "react";
-import e from "prop-types";
-import h from "styled-components";
-import { Box as p } from "../../Box/Box.js";
-import { Divider as f } from "./Divider.js";
-import { Flex as n } from "../../Flex/Flex.js";
-const u = h(n)`
+var x = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var d = Object.prototype.hasOwnProperty, c = Object.prototype.propertyIsEnumerable;
+var m = (e, t, r) => t in e ? x(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, h = (e, t) => {
+  for (var r in t || (t = {}))
+    d.call(t, r) && m(e, r, t[r]);
+  if (n)
+    for (var r of n(t))
+      c.call(t, r) && m(e, r, t[r]);
+  return e;
+};
+var p = (e, t) => {
+  var r = {};
+  for (var i in e)
+    d.call(e, i) && t.indexOf(i) < 0 && (r[i] = e[i]);
+  if (e != null && n)
+    for (var i of n(e))
+      t.indexOf(i) < 0 && c.call(e, i) && (r[i] = e[i]);
+  return r;
+};
+import o, { Children as f } from "react";
+import a from "prop-types";
+import E from "styled-components";
+import { Box as T } from "../../Box/Box.js";
+import { Divider as A } from "./Divider.js";
+import { Flex as u } from "../../Flex/Flex.js";
+const B = E(u)`
   // CrumbLinks do have padding-x, because they need to have a
   // interaction effect, which mis-aligns the breadcrumbs on the left.
   // This normalizes the behavior by moving the first item to left by
   // the same amount it has inner padding
   :first-child {
-    margin-left: ${({ theme: t }) => `calc(-1*${t.spaces[2]})`};
+    margin-left: ${({ theme: e }) => `calc(-1*${e.spaces[2]})`};
   }
-`, o = ({ label: t, children: l, ...s }) => {
-  const i = a.toArray(l);
-  return /* @__PURE__ */ r.createElement(p, {
-    "aria-label": t,
-    ...s
-  }, /* @__PURE__ */ r.createElement(u, {
+`, y = (i) => {
+  var s = i, { label: e, children: t } = s, r = p(s, ["label", "children"]);
+  const l = f.toArray(t);
+  return /* @__PURE__ */ o.createElement(T, h({
+    "aria-label": e
+  }, r), /* @__PURE__ */ o.createElement(B, {
     as: "ol",
     horizontal: !0
-  }, a.map(i, (m, d) => {
-    const c = i.length > 1 && d + 1 < i.length;
-    return /* @__PURE__ */ r.createElement(n, {
+  }, f.map(l, (b, g) => {
+    const v = l.length > 1 && g + 1 < l.length;
+    return /* @__PURE__ */ o.createElement(u, {
       inline: !0,
       as: "li"
-    }, m, c && /* @__PURE__ */ r.createElement(f, null));
+    }, b, v && /* @__PURE__ */ o.createElement(A, null));
   })));
 };
-o.displayName = "Breadcrumbs";
-o.propTypes = {
-  children: e.oneOfType([e.arrayOf(e.node), e.node]).isRequired,
-  label: e.string.isRequired
+y.displayName = "Breadcrumbs";
+y.propTypes = {
+  children: a.oneOfType([a.arrayOf(a.node), a.node]).isRequired,
+  label: a.string.isRequired
 };
 export {
-  o as Breadcrumbs
+  y as Breadcrumbs
 };

package/dist/v2/Breadcrumbs/Crumb.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),d=require("prop-types"),l=require("../../Box/Box.cjs"),i=require("../../Typography/Typography.cjs"),p=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=p(n),a=p(d),t=({children:e,isCurrent:o,...u})=>r.default.createElement(l.Box,{paddingLeft:2,paddingRight:2,paddingTop:1,paddingBottom:1},r.default.createElement(i.Typography,{variant:"pi",textColor:"neutral800",fontWeight:o?"bold":"normal","aria-current":o,...u},e));t.displayName="Crumb";t.defaultProps={isCurrent:!1};t.propTypes={children:a.default.node.isRequired,isCurrent:a.default.bool};exports.Crumb=t;
+"use strict";var g=Object.defineProperty;var a=Object.getOwnPropertySymbols;var d=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable;var n=(e,t,o)=>t in e?g(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,i=(e,t)=>{for(var o in t||(t={}))d.call(t,o)&&n(e,o,t[o]);if(a)for(var o of a(t))l.call(t,o)&&n(e,o,t[o]);return e};var s=(e,t)=>{var o={};for(var r in e)d.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&a)for(var r of a(e))t.indexOf(r)<0&&l.call(e,r)&&(o[r]=e[r]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("react"),T=require("prop-types"),b=require("../../Box/Box.cjs"),h=require("../../Typography/Typography.cjs"),f=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=f(m),y=f(T),p=r=>{var u=r,{children:e,isCurrent:t}=u,o=s(u,["children","isCurrent"]);return c.default.createElement(b.Box,{paddingLeft:2,paddingRight:2,paddingTop:1,paddingBottom:1},c.default.createElement(h.Typography,i({variant:"pi",textColor:"neutral800",fontWeight:t?"bold":"normal","aria-current":t},o),e))};p.displayName="Crumb";p.defaultProps={isCurrent:!1};p.propTypes={children:y.default.node.isRequired,isCurrent:y.default.bool};exports.Crumb=p;

package/dist/v2/Breadcrumbs/Crumb.js

@@ -1,27 +1,49 @@
-import o from "react";
-import t from "prop-types";
-import { Box as i } from "../../Box/Box.js";
-import { Typography as d } from "../../Typography/Typography.js";
-const r = ({ children: p, isCurrent: e, ...a }) => /* @__PURE__ */ o.createElement(i, {
-  paddingLeft: 2,
-  paddingRight: 2,
-  paddingTop: 1,
-  paddingBottom: 1
-}, /* @__PURE__ */ o.createElement(d, {
-  variant: "pi",
-  textColor: "neutral800",
-  fontWeight: e ? "bold" : "normal",
-  "aria-current": e,
-  ...a
-}, p));
-r.displayName = "Crumb";
-r.defaultProps = {
+var g = Object.defineProperty;
+var p = Object.getOwnPropertySymbols;
+var m = Object.prototype.hasOwnProperty, n = Object.prototype.propertyIsEnumerable;
+var d = (r, e, o) => e in r ? g(r, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : r[e] = o, l = (r, e) => {
+  for (var o in e || (e = {}))
+    m.call(e, o) && d(r, o, e[o]);
+  if (p)
+    for (var o of p(e))
+      n.call(e, o) && d(r, o, e[o]);
+  return r;
+};
+var f = (r, e) => {
+  var o = {};
+  for (var t in r)
+    m.call(r, t) && e.indexOf(t) < 0 && (o[t] = r[t]);
+  if (r != null && p)
+    for (var t of p(r))
+      e.indexOf(t) < 0 && n.call(r, t) && (o[t] = r[t]);
+  return o;
+};
+import s from "react";
+import u from "prop-types";
+import { Box as c } from "../../Box/Box.js";
+import { Typography as y } from "../../Typography/Typography.js";
+const a = (t) => {
+  var i = t, { children: r, isCurrent: e } = i, o = f(i, ["children", "isCurrent"]);
+  return /* @__PURE__ */ s.createElement(c, {
+    paddingLeft: 2,
+    paddingRight: 2,
+    paddingTop: 1,
+    paddingBottom: 1
+  }, /* @__PURE__ */ s.createElement(y, l({
+    variant: "pi",
+    textColor: "neutral800",
+    fontWeight: e ? "bold" : "normal",
+    "aria-current": e
+  }, o), r));
+};
+a.displayName = "Crumb";
+a.defaultProps = {
   isCurrent: !1
 };
-r.propTypes = {
-  children: t.node.isRequired,
-  isCurrent: t.bool
+a.propTypes = {
+  children: u.node.isRequired,
+  isCurrent: u.bool
 };
 export {
-  r as Crumb
+  a as Crumb
 };

package/dist/v2/Breadcrumbs/CrumbLink.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),a=require("prop-types"),i=require("styled-components"),l=require("../../BaseLink/BaseLink.cjs"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=o(n),r=o(a),u=o(i),d=u.default(l.BaseLink)`
+"use strict";var f=Object.defineProperty;var s=Object.getOwnPropertySymbols;var l=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable;var i=(e,t,o)=>t in e?f(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,u=(e,t)=>{for(var o in t||(t={}))l.call(t,o)&&i(e,o,t[o]);if(s)for(var o of s(t))c.call(t,o)&&i(e,o,t[o]);return e};var d=(e,t)=>{var o={};for(var r in e)l.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&s)for(var r of s(e))t.indexOf(r)<0&&c.call(e,r)&&(o[r]=e[r]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("react"),b=require("prop-types"),k=require("styled-components"),L=require("../../BaseLink/BaseLink.cjs"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},_=a(y),p=a(b),$=a(k),g=$.default(L.BaseLink)`
   border-radius: ${({theme:e})=>e.borderRadius};
   color: ${({theme:e})=>e.colors.neutral600};
   font-size: ${({theme:e})=>e.fontSizes[1]};
@@ -11,4 +11,4 @@
     background-color: ${({theme:e})=>e.colors.neutral200};
     color: ${({theme:e})=>e.colors.neutral700};
   }
-`,t=({children:e,...s})=>c.default.createElement(d,{...s},e);t.displayName="CrumbLink";t.defaultProps={to:void 0};t.propTypes={children:r.default.node.isRequired,to:r.default.string};exports.CrumbLink=t;
+`,n=o=>{var r=o,{children:e}=r,t=d(r,["children"]);return _.default.createElement(g,u({},t),e)};n.displayName="CrumbLink";n.defaultProps={to:void 0};n.propTypes={children:p.default.node.isRequired,to:p.default.string};exports.CrumbLink=n;

package/dist/v2/Breadcrumbs/CrumbLink.js

@@ -1,8 +1,28 @@
-import i from "react";
-import e from "prop-types";
-import s from "styled-components";
-import { BaseLink as n } from "../../BaseLink/BaseLink.js";
-const l = s(n)`
+var u = Object.defineProperty;
+var i = Object.getOwnPropertySymbols;
+var l = Object.prototype.hasOwnProperty, a = Object.prototype.propertyIsEnumerable;
+var n = (o, r, e) => r in o ? u(o, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[r] = e, d = (o, r) => {
+  for (var e in r || (r = {}))
+    l.call(r, e) && n(o, e, r[e]);
+  if (i)
+    for (var e of i(r))
+      a.call(r, e) && n(o, e, r[e]);
+  return o;
+};
+var c = (o, r) => {
+  var e = {};
+  for (var t in o)
+    l.call(o, t) && r.indexOf(t) < 0 && (e[t] = o[t]);
+  if (o != null && i)
+    for (var t of i(o))
+      r.indexOf(t) < 0 && a.call(o, t) && (e[t] = o[t]);
+  return e;
+};
+import m from "react";
+import p from "prop-types";
+import f from "styled-components";
+import { BaseLink as $ } from "../../BaseLink/BaseLink.js";
+const b = f($)`
   border-radius: ${({ theme: o }) => o.borderRadius};
   color: ${({ theme: o }) => o.colors.neutral600};
   font-size: ${({ theme: o }) => o.fontSizes[1]};
@@ -15,17 +35,18 @@ const l = s(n)`
     background-color: ${({ theme: o }) => o.colors.neutral200};
     color: ${({ theme: o }) => o.colors.neutral700};
   }
-`, r = ({ children: o, ...t }) => /* @__PURE__ */ i.createElement(l, {
-  ...t
-}, o);
-r.displayName = "CrumbLink";
-r.defaultProps = {
+`, s = (e) => {
+  var t = e, { children: o } = t, r = c(t, ["children"]);
+  return /* @__PURE__ */ m.createElement(b, d({}, r), o);
+};
+s.displayName = "CrumbLink";
+s.defaultProps = {
   to: void 0
 };
-r.propTypes = {
-  children: e.node.isRequired,
-  to: e.string
+s.propTypes = {
+  children: p.node.isRequired,
+  to: p.string
 };
 export {
-  r as CrumbLink
+  s as CrumbLink
 };

package/dist/v2/Breadcrumbs/CrumbSimpleMenu.cjs

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("prop-types"),a=require("react"),s=require("styled-components"),c=require("../../Button/Button.cjs"),d=require("../SimpleMenu/SimpleMenu.cjs"),i=require("@strapi/icons/CarretDown"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=r(l),o=r(a),p=r(s),f=r(i),m=p.default(c.Button)`
+"use strict";var m=Object.defineProperty;var n=Object.getOwnPropertySymbols;var c=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var s=(e,t,r)=>t in e?m(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,i=(e,t)=>{for(var r in t||(t={}))c.call(t,r)&&s(e,r,t[r]);if(n)for(var r of n(t))d.call(t,r)&&s(e,r,t[r]);return e};var p=(e,t)=>{var r={};for(var u in e)c.call(e,u)&&t.indexOf(u)<0&&(r[u]=e[u]);if(e!=null&&n)for(var u of n(e))t.indexOf(u)<0&&d.call(e,u)&&(r[u]=e[u]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("prop-types"),S=require("react"),_=require("styled-components"),M=require("@strapi/icons/CarretDown"),b=require("../../Button/Button.cjs"),q=require("../SimpleMenu/SimpleMenu.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=l(y),f=l(S),g=l(_),B=l(M),C=g.default(b.Button)`
   padding: ${({theme:e})=>`${e.spaces[1]} ${e.spaces[3]}`};
 
   :hover,
   :focus {
     background-color: ${({theme:e})=>e.colors.neutral200};
   }
-`,u=({children:e,...n})=>o.default.createElement(d.SimpleMenu,{noBorder:!0,icon:o.default.createElement(f.default,null),as:m,size:"S",...n},e);u.displayName="CrumbSimpleMenu";u.propTypes={"aria-label":t.default.string.isRequired,children:t.default.oneOfType([t.default.arrayOf(t.default.node),t.default.node]).isRequired};exports.CrumbSimpleMenu=u;
+`,a=r=>{var u=r,{children:e}=u,t=p(u,["children"]);return f.default.createElement(q.SimpleMenu,i({noBorder:!0,icon:f.default.createElement(B.default,null),as:C,size:"S"},t),e)};a.displayName="CrumbSimpleMenu";a.propTypes={"aria-label":o.default.string.isRequired,children:o.default.oneOfType([o.default.arrayOf(o.default.node),o.default.node]).isRequired};exports.CrumbSimpleMenu=a;

package/dist/v2/Breadcrumbs/CrumbSimpleMenu.js

@@ -1,28 +1,50 @@
-import r from "prop-types";
-import o from "react";
-import i from "styled-components";
-import { Button as p } from "../../Button/Button.js";
-import { SimpleMenu as m } from "../SimpleMenu/SimpleMenu.js";
-import a from "@strapi/icons/CarretDown";
-const l = i(p)`
+var d = Object.defineProperty;
+var i = Object.getOwnPropertySymbols;
+var m = Object.prototype.hasOwnProperty, a = Object.prototype.propertyIsEnumerable;
+var p = (e, r, o) => r in e ? d(e, r, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[r] = o, l = (e, r) => {
+  for (var o in r || (r = {}))
+    m.call(r, o) && p(e, o, r[o]);
+  if (i)
+    for (var o of i(r))
+      a.call(r, o) && p(e, o, r[o]);
+  return e;
+};
+var s = (e, r) => {
+  var o = {};
+  for (var t in e)
+    m.call(e, t) && r.indexOf(t) < 0 && (o[t] = e[t]);
+  if (e != null && i)
+    for (var t of i(e))
+      r.indexOf(t) < 0 && a.call(e, t) && (o[t] = e[t]);
+  return o;
+};
+import n from "prop-types";
+import u from "react";
+import f from "styled-components";
+import y from "@strapi/icons/CarretDown";
+import { Button as S } from "../../Button/Button.js";
+import { SimpleMenu as b } from "../SimpleMenu/SimpleMenu.js";
+const $ = f(S)`
   padding: ${({ theme: e }) => `${e.spaces[1]} ${e.spaces[3]}`};
 
   :hover,
   :focus {
     background-color: ${({ theme: e }) => e.colors.neutral200};
   }
-`, t = ({ children: e, ...n }) => /* @__PURE__ */ o.createElement(m, {
-  noBorder: !0,
-  icon: /* @__PURE__ */ o.createElement(a, null),
-  as: l,
-  size: "S",
-  ...n
-}, e);
-t.displayName = "CrumbSimpleMenu";
-t.propTypes = {
-  "aria-label": r.string.isRequired,
-  children: r.oneOfType([r.arrayOf(r.node), r.node]).isRequired
+`, c = (o) => {
+  var t = o, { children: e } = t, r = s(t, ["children"]);
+  return /* @__PURE__ */ u.createElement(b, l({
+    noBorder: !0,
+    icon: /* @__PURE__ */ u.createElement(y, null),
+    as: $,
+    size: "S"
+  }, r), e);
+};
+c.displayName = "CrumbSimpleMenu";
+c.propTypes = {
+  "aria-label": n.string.isRequired,
+  children: n.oneOfType([n.arrayOf(n.node), n.node]).isRequired
 };
 export {
-  t as CrumbSimpleMenu
+  c as CrumbSimpleMenu
 };

package/dist/v2/Link/Link.cjs

@@ -1,11 +1,11 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react"),y=require("prop-types"),m=require("styled-components"),g=require("@strapi/icons/ExternalLink"),L=require("../../Typography/Typography.cjs"),h=require("../../Box/Box.cjs"),v=require("../../themes/utils.cjs"),k=require("../../BaseLink/BaseLink.cjs"),n=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=n(f),a=n(y),u=n(m),x=n(g),_=u.default(k.BaseLink)`
+"use strict";var k=Object.defineProperty;var l=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(e,t,a)=>t in e?k(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a,m=(e,t)=>{for(var a in t||(t={}))f.call(t,a)&&p(e,a,t[a]);if(l)for(var a of l(t))y.call(t,a)&&p(e,a,t[a]);return e};var g=(e,t)=>{var a={};for(var r in e)f.call(e,r)&&t.indexOf(r)<0&&(a[r]=e[r]);if(e!=null&&l)for(var r of l(e))t.indexOf(r)<0&&y.call(e,r)&&(a[r]=e[r]);return a};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("react"),_=require("prop-types"),q=require("styled-components"),E=require("@strapi/icons/ExternalLink"),T=require("../../Typography/Typography.cjs"),B=require("../../Box/Box.cjs"),b=require("../../themes/utils.cjs"),j=require("../../BaseLink/BaseLink.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=s(x),o=s(_),L=s(q),R=s(E),$=L.default(j.BaseLink)`
   display: inline-flex;
   align-items: center;
   text-decoration: none;
   pointer-events: ${({disabled:e})=>e?"none":void 0};
 
   svg path {
-    fill: ${({disabled:e,theme:r})=>e?r.colors.neutral600:r.colors.primary600};
+    fill: ${({disabled:e,theme:t})=>e?t.colors.neutral600:t.colors.primary600};
   }
 
   svg {
@@ -17,7 +17,7 @@
     color: ${({theme:e})=>e.colors.primary800};
   }
 
-  ${v.buttonFocusStyle};
-`,s=u.default(h.Box)`
+  ${b.buttonFocusStyle};
+`,u=L.default(B.Box)`
   display: flex;
-`,o=t.default.forwardRef(({children:e,href:r,disabled:i,startIcon:d,endIcon:l,...c},p)=>t.default.createElement(_,{ref:p,href:r,disabled:i,...c},d&&t.default.createElement(s,{as:"span","aria-hidden":!0,paddingRight:2},d),t.default.createElement(L.Typography,{textColor:i?"neutral600":"primary600"},e),l&&t.default.createElement(s,{as:"span","aria-hidden":!0,paddingLeft:2},l),r&&!l&&t.default.createElement(s,{as:"span","aria-hidden":!0,paddingLeft:2},t.default.createElement(x.default,null))));o.displayName="Link";o.defaultProps={as:void 0,href:void 0,disabled:!1,startIcon:void 0,endIcon:void 0};o.propTypes={as:a.default.elementType,children:a.default.node.isRequired,disabled:a.default.bool,endIcon:a.default.element,href:a.default.string,startIcon:a.default.element};exports.Link=o;
+`,i=n.default.forwardRef((P,v)=>{var c=P,{children:e,href:t,disabled:a,startIcon:r,endIcon:d}=c,h=g(c,["children","href","disabled","startIcon","endIcon"]);return n.default.createElement($,m({ref:v,href:t,disabled:a},h),r&&n.default.createElement(u,{as:"span","aria-hidden":!0,paddingRight:2},r),n.default.createElement(T.Typography,{textColor:a?"neutral600":"primary600"},e),d&&n.default.createElement(u,{as:"span","aria-hidden":!0,paddingLeft:2},d),t&&!d&&n.default.createElement(u,{as:"span","aria-hidden":!0,paddingLeft:2},n.default.createElement(R.default,null)))});i.displayName="Link";i.defaultProps={as:void 0,href:void 0,disabled:!1,startIcon:void 0,endIcon:void 0};i.propTypes={as:o.default.elementType,children:o.default.node.isRequired,disabled:o.default.bool,endIcon:o.default.element,href:o.default.string,startIcon:o.default.element};exports.Link=i;