@strapi/design-system 1.5.0 → 1.6.0

package/dist/index.js

@@ -6,19 +6,19 @@ import { Alert as d } from "./Alert/Alert.js";
 import { Avatar as l, Initials as T } from "./Avatar/Avatar.js";
 import { AvatarGroup as c } from "./Avatar/AvatarGroup.js";
 import { Badge as C } from "./Badge/Badge.js";
-import { BaseButton as y, BaseButtonWrapper as B } from "./BaseButton/BaseButton.js";
-import { BaseCheckbox as v } from "./BaseCheckbox/BaseCheckbox.js";
-import { BaseLink as h } from "./BaseLink/BaseLink.js";
+import { BaseButton as y, BaseButtonWrapper as L } from "./BaseButton/BaseButton.js";
+import { BaseCheckbox as B } from "./BaseCheckbox/BaseCheckbox.js";
+import { BaseLink as N } from "./BaseLink/BaseLink.js";
 import { BaseRadio as k } from "./BaseRadio/BaseRadio.js";
 import { RadioGroup as A } from "./BaseRadio/RadioGroup.js";
 import { Box as I } from "./Box/Box.js";
-import { Breadcrumbs as R, Crumb as G } from "./Breadcrumbs/Breadcrumbs.js";
+import { Breadcrumbs as M, Crumb as G } from "./Breadcrumbs/Breadcrumbs.js";
 import { Button as D, ButtonWrapper as H } from "./Button/Button.js";
-import { Card as O } from "./Card/Card.js";
+import { Card as E } from "./Card/Card.js";
 import { CardAction as V } from "./Card/CardAction.js";
-import { CardAsset as K } from "./Card/CardAsset.js";
-import { CardBadge as _ } from "./Card/CardBadge.js";
-import { CardBody as q } from "./Card/CardBody.js";
+import { CardAsset as J } from "./Card/CardAsset.js";
+import { CardBadge as U } from "./Card/CardBadge.js";
+import { CardBody as j } from "./Card/CardBody.js";
 import { CardCheckbox as Q } from "./Card/CardCheckbox.js";
 import { CardContent as Y } from "./Card/CardContent.js";
 import { CardHeader as $ } from "./Card/CardHeader.js";
@@ -31,19 +31,19 @@ import { CarouselImage as lo } from "./CarouselInput/CarouselImage.js";
 import { CarouselSlide as so } from "./CarouselInput/CarouselSlide.js";
 import { Checkbox as bo } from "./Checkbox/Checkbox.js";
 import { Combobox as So, CreatableCombobox as yo } from "./Combobox/Combobox.js";
-import { ComboboxOption as Lo } from "./Combobox/ComboboxOption.js";
+import { ComboboxOption as vo } from "./Combobox/ComboboxOption.js";
 import { Dialog as go } from "./Dialog/Dialog.js";
-import { DialogBody as No } from "./Dialog/DialogBody.js";
+import { DialogBody as ho } from "./Dialog/DialogBody.js";
 import { DialogFooter as Fo } from "./Dialog/DialogFooter.js";
 import { DismissibleLayer as Po } from "./DismissibleLayer/DismissibleLayer.js";
-import { DatePicker as Mo } from "./DatePicker/DatePicker.js";
+import { DatePicker as Ro } from "./DatePicker/DatePicker.js";
 import { DateTimePicker as Go } from "./DateTimePicker/DateTimePicker.js";
 import { Divider as Do } from "./Divider/Divider.js";
-import { EmptyStateLayout as Eo } from "./EmptyStateLayout/EmptyStateLayout.js";
+import { EmptyStateLayout as Oo } from "./EmptyStateLayout/EmptyStateLayout.js";
 import { Field as Wo } from "./Field/Field.js";
 import { FieldLabel as zo } from "./Field/FieldLabel.js";
-import { FieldInput as Uo, InputWrapper as _o } from "./Field/FieldInput.js";
-import { FieldHint as qo } from "./Field/FieldHint.js";
+import { FieldInput as Ko, InputWrapper as Uo } from "./Field/FieldInput.js";
+import { FieldHint as jo } from "./Field/FieldHint.js";
 import { FieldError as Qo } from "./Field/FieldError.js";
 import { FieldContext as Yo, useField as Zo } from "./Field/FieldContext.js";
 import { FieldAction as or } from "./Field/FieldAction.js";
@@ -52,112 +52,114 @@ import { Grid as pr } from "./Grid/Grid.js";
 import { GridItem as xr } from "./Grid/GridItem.js";
 import { Icon as ar } from "./Icon/Icon.js";
 import { IconButton as nr, IconButtonGroup as dr } from "./IconButton/IconButton.js";
-import { KeyboardNavigable as lr } from "./KeyboardNavigable/KeyboardNavigable.js";
-import { Layout as sr } from "./Layout/Layout.js";
-import { ActionLayout as br } from "./Layout/ActionLayout.js";
-import { ContentLayout as Sr } from "./Layout/ContentLayout.js";
-import { BaseHeaderLayout as Br, HeaderLayout as Lr } from "./Layout/HeaderLayout.js";
-import { TwoColsLayout as gr } from "./Layout/TwoColsLayout.js";
-import { GridLayout as Nr } from "./Layout/GridLayout.js";
-import { Link as Fr } from "./Link/Link.js";
-import { LinkButton as Pr } from "./LinkButton/LinkButton.js";
-import { useNotifyAT as Mr } from "./LiveRegions/useNotifyAT.js";
-import { Loader as Gr } from "./Loader/Loader.js";
-import { Main as Dr } from "./Main/Main.js";
-import { SkipToContent as Er } from "./Main/SkipToContent.js";
-import { MainNav as Wr } from "./MainNav/MainNav.js";
-import { NavBrand as zr } from "./MainNav/NavBrand.js";
-import { NavCondense as Ur } from "./MainNav/NavCondense.js";
-import { NavFooter as jr } from "./MainNav/NavFooter.js";
-import { NavLink as Jr } from "./MainNav/NavLink.js";
-import { NavSection as Xr } from "./MainNav/NavSection.js";
-import { NavSections as Zr } from "./MainNav/NavSections.js";
-import { NavUser as oe } from "./MainNav/NavUser.js";
-import { ModalLayout as ee } from "./ModalLayout/ModalLayout.js";
-import { ModalHeader as pe } from "./ModalLayout/ModalHeader.js";
-import { ModalFooter as xe } from "./ModalLayout/ModalFooter.js";
-import { ModalBody as ae } from "./ModalLayout/ModalBody.js";
-import { NumberInput as ne } from "./NumberInput/NumberInput.js";
-import { Pagination as ue } from "./Pagination/Pagination.js";
-import { Dots as Te, NextLink as se, PageLink as ce, PreviousLink as be } from "./Pagination/components.js";
-import { POPOVER_PLACEMENTS as Se, Popover as ye } from "./Popover/Popover.js";
-import { Portal as Le } from "./Portal/Portal.js";
-import { ProgressBar as ge } from "./ProgressBar/ProgressBar.js";
-import { Radio as Ne } from "./Radio/Radio.js";
-import { RawTable as Fe } from "./RawTable/RawTable.js";
-import { RawTd as Pe, RawTh as Ie } from "./RawTable/RawCell.js";
-import { RawThead as Re } from "./RawTable/RawThead.js";
-import { RawTbody as we } from "./RawTable/RawTbody.js";
-import { RawTr as He } from "./RawTable/RawTr.js";
-import { Flex as Oe } from "./Flex/Flex.js";
-import { Searchbar as Ve } from "./Searchbar/Searchbar.js";
-import { SearchForm as Ke } from "./Searchbar/SearchForm.js";
-import { Select as _e } from "./Select/Select.js";
-import { Option as qe } from "./Select/Option.js";
-import { OptGroup as Qe } from "./Select/OptGroup.js";
-import { MultiSelectNested as Ye } from "./Select/MultiSelectNested.js";
-import { SelectList as $e } from "./Select/SelectList.js";
-import { MenuItem as rt, SimpleMenu as et } from "./SimpleMenu/SimpleMenu.js";
-import { Stack as pt } from "./Stack/Stack.js";
-import { Status as xt } from "./Status/Status.js";
-import { SubNav as at, subNavWidth as it } from "./SubNav/SubNav.js";
-import { SubNavHeader as dt } from "./SubNav/SubNavHeader.js";
-import { SubNavLink as lt } from "./SubNav/SubNavLink.js";
-import { SubNavLinkSection as st } from "./SubNav/SubNavLinkSection.js";
-import { SubNavSection as bt } from "./SubNav/SubNavSection.js";
-import { SubNavSections as St } from "./SubNav/SubNavSections.js";
-import { Switch as Bt } from "./Switch/Switch.js";
-import { Tab as vt, Tabs as gt } from "./Tabs/Tabs.js";
-import { TabPanel as Nt, TabPanels as kt } from "./Tabs/TabPanels.js";
-import { TabGroup as At } from "./Tabs/TabGroup.js";
-import { Table as It } from "./Table/Table.js";
-import { Tbody as Rt } from "./Table/Tbody.js";
-import { Thead as wt } from "./Table/Thead.js";
-import { Tr as Ht } from "./Table/Tr.js";
-import { Td as Ot, Th as Wt } from "./Table/Cell.js";
-import { TFooter as zt } from "./Table/TFooter.js";
-import { Tag as Ut } from "./Tag/Tag.js";
-import { TextButton as jt } from "./TextButton/TextButton.js";
-import { TextInput as Jt } from "./TextInput/TextInput.js";
-import { Textarea as Xt } from "./Textarea/Textarea.js";
-import { ThemeProvider as Zt } from "./ThemeProvider/ThemeProvider.js";
-import { useTheme as op } from "./ThemeProvider/hooks.js";
-import { TimePicker as ep } from "./TimePicker/TimePicker.js";
-import { ToggleCheckbox as pp } from "./ToggleCheckbox/ToggleCheckbox.js";
-import { ToggleInput as xp } from "./ToggleInput/ToggleInput.js";
-import { Tooltip as ap } from "./Tooltip/Tooltip.js";
-import { Typography as np } from "./Typography/Typography.js";
-import { VisuallyHidden as up } from "./VisuallyHidden/VisuallyHidden.js";
-import { lightTheme as Tp } from "./themes/lightTheme/index.js";
-import { darkTheme as cp } from "./themes/darkTheme/index.js";
-import { extendTheme as Cp } from "./themes/extendTheme.js";
-import { buttonFocusStyle as yp, getThemeSize as Bp, inputFocusStyle as Lp } from "./themes/utils.js";
+import { JSONInput as lr } from "./JSONInput/JSONInput.js";
+import { KeyboardNavigable as sr } from "./KeyboardNavigable/KeyboardNavigable.js";
+import { Layout as br } from "./Layout/Layout.js";
+import { ActionLayout as Sr } from "./Layout/ActionLayout.js";
+import { ContentLayout as Lr } from "./Layout/ContentLayout.js";
+import { BaseHeaderLayout as Br, HeaderLayout as gr } from "./Layout/HeaderLayout.js";
+import { TwoColsLayout as hr } from "./Layout/TwoColsLayout.js";
+import { GridLayout as Fr } from "./Layout/GridLayout.js";
+import { Link as Pr } from "./Link/Link.js";
+import { LinkButton as Rr } from "./LinkButton/LinkButton.js";
+import { useNotifyAT as Gr } from "./LiveRegions/useNotifyAT.js";
+import { LiveRegions as Dr } from "./LiveRegions/LiveRegions.js";
+import { Loader as Or } from "./Loader/Loader.js";
+import { Main as Wr } from "./Main/Main.js";
+import { SkipToContent as zr } from "./Main/SkipToContent.js";
+import { MainNav as Kr } from "./MainNav/MainNav.js";
+import { NavBrand as _r } from "./MainNav/NavBrand.js";
+import { NavCondense as qr } from "./MainNav/NavCondense.js";
+import { NavFooter as Xr } from "./MainNav/NavFooter.js";
+import { NavLink as Zr } from "./MainNav/NavLink.js";
+import { NavSection as oe } from "./MainNav/NavSection.js";
+import { NavSections as ee } from "./MainNav/NavSections.js";
+import { NavUser as pe } from "./MainNav/NavUser.js";
+import { ModalLayout as xe } from "./ModalLayout/ModalLayout.js";
+import { ModalHeader as ae } from "./ModalLayout/ModalHeader.js";
+import { ModalFooter as ne } from "./ModalLayout/ModalFooter.js";
+import { ModalBody as ue } from "./ModalLayout/ModalBody.js";
+import { NumberInput as Te } from "./NumberInput/NumberInput.js";
+import { Pagination as ce } from "./Pagination/Pagination.js";
+import { Dots as Ce, NextLink as Se, PageLink as ye, PreviousLink as Le } from "./Pagination/components.js";
+import { POPOVER_PLACEMENTS as Be, Popover as ge } from "./Popover/Popover.js";
+import { Portal as he } from "./Portal/Portal.js";
+import { ProgressBar as Fe } from "./ProgressBar/ProgressBar.js";
+import { Radio as Pe } from "./Radio/Radio.js";
+import { RawTable as Re } from "./RawTable/RawTable.js";
+import { RawTd as Ge, RawTh as we } from "./RawTable/RawCell.js";
+import { RawThead as He } from "./RawTable/RawThead.js";
+import { RawTbody as Ee } from "./RawTable/RawTbody.js";
+import { RawTr as Ve } from "./RawTable/RawTr.js";
+import { Flex as Je } from "./Flex/Flex.js";
+import { Searchbar as Ue } from "./Searchbar/Searchbar.js";
+import { SearchForm as je } from "./Searchbar/SearchForm.js";
+import { Select as Qe } from "./Select/Select.js";
+import { Option as Ye } from "./Select/Option.js";
+import { OptGroup as $e } from "./Select/OptGroup.js";
+import { MultiSelectNested as rt } from "./Select/MultiSelectNested.js";
+import { SelectList as tt } from "./Select/SelectList.js";
+import { MenuItem as mt, SimpleMenu as xt } from "./SimpleMenu/SimpleMenu.js";
+import { Stack as at } from "./Stack/Stack.js";
+import { Status as nt } from "./Status/Status.js";
+import { SubNav as ut, subNavWidth as lt } from "./SubNav/SubNav.js";
+import { SubNavHeader as st } from "./SubNav/SubNavHeader.js";
+import { SubNavLink as bt } from "./SubNav/SubNavLink.js";
+import { SubNavLinkSection as St } from "./SubNav/SubNavLinkSection.js";
+import { SubNavSection as Lt } from "./SubNav/SubNavSection.js";
+import { SubNavSections as Bt } from "./SubNav/SubNavSections.js";
+import { Switch as Nt } from "./Switch/Switch.js";
+import { Tab as kt, Tabs as Ft } from "./Tabs/Tabs.js";
+import { TabPanel as Pt, TabPanels as It } from "./Tabs/TabPanels.js";
+import { TabGroup as Mt } from "./Tabs/TabGroup.js";
+import { Table as wt } from "./Table/Table.js";
+import { Tbody as Ht } from "./Table/Tbody.js";
+import { Thead as Et } from "./Table/Thead.js";
+import { Tr as Vt } from "./Table/Tr.js";
+import { Td as Jt, Th as Kt } from "./Table/Cell.js";
+import { TFooter as _t } from "./Table/TFooter.js";
+import { Tag as qt } from "./Tag/Tag.js";
+import { TextButton as Xt } from "./TextButton/TextButton.js";
+import { TextInput as Zt } from "./TextInput/TextInput.js";
+import { Textarea as op } from "./Textarea/Textarea.js";
+import { ThemeProvider as ep } from "./ThemeProvider/ThemeProvider.js";
+import { useTheme as pp } from "./ThemeProvider/hooks.js";
+import { TimePicker as xp } from "./TimePicker/TimePicker.js";
+import { ToggleCheckbox as ap } from "./ToggleCheckbox/ToggleCheckbox.js";
+import { ToggleInput as np } from "./ToggleInput/ToggleInput.js";
+import { Tooltip as up } from "./Tooltip/Tooltip.js";
+import { Typography as Tp } from "./Typography/Typography.js";
+import { VisuallyHidden as cp } from "./VisuallyHidden/VisuallyHidden.js";
+import { lightTheme as Cp } from "./themes/lightTheme/index.js";
+import { darkTheme as yp } from "./themes/darkTheme/index.js";
+import { extendTheme as vp } from "./themes/extendTheme.js";
+import { buttonFocusStyle as gp, getThemeSize as Np, inputFocusStyle as hp } from "./themes/utils.js";
 export {
   e as Accordion,
   m as AccordionContent,
   i as AccordionGroup,
   f as AccordionToggle,
   t as AccordionTypography,
-  br as ActionLayout,
+  Sr as ActionLayout,
   d as Alert,
   l as Avatar,
   c as AvatarGroup,
   C as Badge,
   y as BaseButton,
-  B as BaseButtonWrapper,
-  v as BaseCheckbox,
+  L as BaseButtonWrapper,
+  B as BaseCheckbox,
   Br as BaseHeaderLayout,
-  h as BaseLink,
+  N as BaseLink,
   k as BaseRadio,
   I as Box,
-  R as Breadcrumbs,
+  M as Breadcrumbs,
   D as Button,
   H as ButtonWrapper,
-  O as Card,
+  E as Card,
   V as CardAction,
-  K as CardAsset,
-  _ as CardBadge,
-  q as CardBody,
+  J as CardAsset,
+  U as CardBadge,
+  j as CardBody,
   Q as CardCheckbox,
   Y as CardContent,
   $ as CardHeader,
@@ -171,123 +173,125 @@ export {
   so as CarouselSlide,
   bo as Checkbox,
   So as Combobox,
-  Lo as ComboboxOption,
-  Sr as ContentLayout,
+  vo as ComboboxOption,
+  Lr as ContentLayout,
   yo as CreatableCombobox,
   G as Crumb,
-  Mo as DatePicker,
+  Ro as DatePicker,
   Go as DateTimePicker,
   go as Dialog,
-  No as DialogBody,
+  ho as DialogBody,
   Fo as DialogFooter,
   Po as DismissibleLayer,
   Do as Divider,
-  Te as Dots,
-  Eo as EmptyStateLayout,
+  Ce as Dots,
+  Oo as EmptyStateLayout,
   Wo as Field,
   or as FieldAction,
   Yo as FieldContext,
   Qo as FieldError,
-  qo as FieldHint,
-  Uo as FieldInput,
+  jo as FieldHint,
+  Ko as FieldInput,
   zo as FieldLabel,
-  Oe as Flex,
+  Je as Flex,
   er as FocusTrap,
   pr as Grid,
   xr as GridItem,
-  Nr as GridLayout,
-  Lr as HeaderLayout,
+  Fr as GridLayout,
+  gr as HeaderLayout,
   ar as Icon,
   nr as IconButton,
   dr as IconButtonGroup,
   T as Initials,
-  _o as InputWrapper,
-  lr as KeyboardNavigable,
-  sr as Layout,
-  Fr as Link,
-  Pr as LinkButton,
-  Gr as Loader,
-  Dr as Main,
-  Wr as MainNav,
-  rt as MenuItem,
-  ae as ModalBody,
-  xe as ModalFooter,
-  pe as ModalHeader,
-  ee as ModalLayout,
-  Ye as MultiSelectNested,
-  zr as NavBrand,
-  Ur as NavCondense,
-  jr as NavFooter,
-  Jr as NavLink,
-  Xr as NavSection,
-  Zr as NavSections,
-  oe as NavUser,
-  se as NextLink,
-  ne as NumberInput,
-  Qe as OptGroup,
-  qe as Option,
-  Se as POPOVER_PLACEMENTS,
-  ce as PageLink,
-  ue as Pagination,
-  ye as Popover,
-  Le as Portal,
-  be as PreviousLink,
-  ge as ProgressBar,
-  Ne as Radio,
+  Uo as InputWrapper,
+  lr as JSONInput,
+  sr as KeyboardNavigable,
+  br as Layout,
+  Pr as Link,
+  Rr as LinkButton,
+  Dr as LiveRegions,
+  Or as Loader,
+  Wr as Main,
+  Kr as MainNav,
+  mt as MenuItem,
+  ue as ModalBody,
+  ne as ModalFooter,
+  ae as ModalHeader,
+  xe as ModalLayout,
+  rt as MultiSelectNested,
+  _r as NavBrand,
+  qr as NavCondense,
+  Xr as NavFooter,
+  Zr as NavLink,
+  oe as NavSection,
+  ee as NavSections,
+  pe as NavUser,
+  Se as NextLink,
+  Te as NumberInput,
+  $e as OptGroup,
+  Ye as Option,
+  Be as POPOVER_PLACEMENTS,
+  ye as PageLink,
+  ce as Pagination,
+  ge as Popover,
+  he as Portal,
+  Le as PreviousLink,
+  Fe as ProgressBar,
+  Pe as Radio,
   A as RadioGroup,
-  Fe as RawTable,
-  we as RawTbody,
-  Pe as RawTd,
-  Ie as RawTh,
-  Re as RawThead,
-  He as RawTr,
-  Ke as SearchForm,
-  Ve as Searchbar,
-  _e as Select,
-  $e as SelectList,
-  et as SimpleMenu,
-  Er as SkipToContent,
-  pt as Stack,
-  xt as Status,
-  at as SubNav,
-  dt as SubNavHeader,
-  lt as SubNavLink,
-  st as SubNavLinkSection,
-  bt as SubNavSection,
-  St as SubNavSections,
-  Bt as Switch,
-  zt as TFooter,
-  vt as Tab,
-  At as TabGroup,
-  Nt as TabPanel,
-  kt as TabPanels,
-  It as Table,
-  gt as Tabs,
-  Ut as Tag,
-  Rt as Tbody,
-  Ot as Td,
-  jt as TextButton,
-  Jt as TextInput,
-  Xt as Textarea,
-  Wt as Th,
-  wt as Thead,
-  Zt as ThemeProvider,
-  ep as TimePicker,
-  pp as ToggleCheckbox,
-  xp as ToggleInput,
-  ap as Tooltip,
-  Ht as Tr,
-  gr as TwoColsLayout,
-  np as Typography,
-  up as VisuallyHidden,
-  yp as buttonFocusStyle,
-  cp as darkTheme,
-  Cp as extendTheme,
-  Bp as getThemeSize,
-  Lp as inputFocusStyle,
-  Tp as lightTheme,
-  it as subNavWidth,
+  Re as RawTable,
+  Ee as RawTbody,
+  Ge as RawTd,
+  we as RawTh,
+  He as RawThead,
+  Ve as RawTr,
+  je as SearchForm,
+  Ue as Searchbar,
+  Qe as Select,
+  tt as SelectList,
+  xt as SimpleMenu,
+  zr as SkipToContent,
+  at as Stack,
+  nt as Status,
+  ut as SubNav,
+  st as SubNavHeader,
+  bt as SubNavLink,
+  St as SubNavLinkSection,
+  Lt as SubNavSection,
+  Bt as SubNavSections,
+  Nt as Switch,
+  _t as TFooter,
+  kt as Tab,
+  Mt as TabGroup,
+  Pt as TabPanel,
+  It as TabPanels,
+  wt as Table,
+  Ft as Tabs,
+  qt as Tag,
+  Ht as Tbody,
+  Jt as Td,
+  Xt as TextButton,
+  Zt as TextInput,
+  op as Textarea,
+  Kt as Th,
+  Et as Thead,
+  ep as ThemeProvider,
+  xp as TimePicker,
+  ap as ToggleCheckbox,
+  np as ToggleInput,
+  up as Tooltip,
+  Vt as Tr,
+  hr as TwoColsLayout,
+  Tp as Typography,
+  cp as VisuallyHidden,
+  gp as buttonFocusStyle,
+  yp as darkTheme,
+  vp as extendTheme,
+  Np as getThemeSize,
+  hp as inputFocusStyle,
+  Cp as lightTheme,
+  lt as subNavWidth,
   Zo as useField,
-  Mr as useNotifyAT,
-  op as useTheme
+  Gr as useNotifyAT,
+  pp as useTheme
 };

package/dist/themes/extendTheme.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("./lightTheme/index.cjs"),s=e=>`
-${e}
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("../helpers/objects.cjs"),s=require("./lightTheme/index.cjs"),n=t=>`
+${t}
 
 The following is an example:
 
@@ -7,7 +7,7 @@ The following is an example:
 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(s.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},u=(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=u;
+`,h=(t,e)=>{if(!r.isObject(t)){const o=n("The first argument should be an object and corresponds to the theme you want to extend.");throw new Error(o)}if(!r.isObject(e)){const o=n("The second argument should be an object and corresponds to the keys of the theme you want to override.");throw new Error(o)}return r.mergeDeep(t??{},e??{})};exports.extendTheme=h;

package/dist/themes/extendTheme.js

@@ -1,6 +1,7 @@
-import { lightTheme as c } from "./lightTheme/index.js";
-const h = (e) => `
-${e}
+import { isObject as r, mergeDeep as h } from "../helpers/objects.js";
+import { lightTheme as m } from "./lightTheme/index.js";
+const n = (t) => `
+${t}
 
 The following is an example:
 
@@ -8,28 +9,19 @@ The following is an example:
 import { lightTheme, extendTheme } from '@strapi/design-system';
 
 const myCustomTheme = extendTheme(lightTheme, {
-    ${Object.keys(c).map((t) => `${t}: /* put the overrides for the ${t} key */,`).join(`
+    ${Object.keys(m).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(
-      "The first argument should be an object and corresponds to the theme you want to extend."
-    );
-    throw new Error(n);
-  }
+`, a = (t, e) => {
   if (!r(t)) {
-    const n = h(
-      "The second argument should be an object and corresponds to the keys of the theme you want to override."
-    );
-    throw new Error(n);
+    const o = n("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 = n("The second argument should be an object and corresponds to the keys of the theme you want to override.");
+    throw new Error(o);
   }
-  return s(e, t);
+  return h(t ?? {}, e ?? {});
 };
 export {
   a as extendTheme

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("@strapi/icons/CarretDown"),d=require("../../Button/Button.cjs"),i=require("../SimpleMenu/SimpleMenu.cjs"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=r(l),o=r(a),p=r(s),f=r(c),m=p.default(d.Button)`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("prop-types"),s=require("react"),a=require("styled-components"),c=require("@strapi/icons"),i=require("../../Button/Button.cjs"),d=require("../SimpleMenu/SimpleMenu.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=u(l),n=u(s),p=u(a),f=p.default(i.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(i.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;
+`,o=({children:e,...r})=>n.default.createElement(d.SimpleMenu,{noBorder:!0,icon:n.default.createElement(c.CarretDown,null),as:f,size:"S",...r},e);o.displayName="CrumbSimpleMenu";o.propTypes={"aria-label":t.default.string.isRequired,children:t.default.oneOfType([t.default.arrayOf(t.default.node),t.default.node]).isRequired};exports.CrumbSimpleMenu=o;

package/dist/v2/Breadcrumbs/CrumbSimpleMenu.js

@@ -1,7 +1,7 @@
 import r from "prop-types";
 import o from "react";
 import i from "styled-components";
-import p from "@strapi/icons/CarretDown";
+import { CarretDown as p } from "@strapi/icons";
 import { Button as m } from "../../Button/Button.js";
 import { SimpleMenu as a } from "../SimpleMenu/SimpleMenu.js";
 const l = i(m)`

package/dist/v2/Link/Link.cjs

@@ -1,4 +1,4 @@
-"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";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"),h=require("../../Typography/Typography.cjs"),v=require("../../Box/Box.cjs"),L=require("../../themes/utils.cjs"),k=require("../../BaseLink/BaseLink.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=l(f),a=l(y),u=l(m),q=u.default(k.BaseLink)`
   display: inline-flex;
   align-items: center;
   text-decoration: none;
@@ -17,7 +17,7 @@
     color: ${({theme:e})=>e.colors.primary800};
   }
 
-  ${v.buttonFocusStyle};
-`,s=u.default(h.Box)`
+  ${L.buttonFocusStyle};
+`,s=u.default(v.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;
+`,n=t.default.forwardRef(({children:e,href:r,disabled:i,startIcon:d,endIcon:o,...c},p)=>t.default.createElement(q,{ref:p,href:r,disabled:i,...c},d&&t.default.createElement(s,{as:"span","aria-hidden":!0,paddingRight:2},d),t.default.createElement(h.Typography,{textColor:i?"neutral600":"primary600"},e),o&&t.default.createElement(s,{as:"span","aria-hidden":!0,paddingLeft:2},o),r&&!o&&t.default.createElement(s,{as:"span","aria-hidden":!0,paddingLeft:2},t.default.createElement(g.ExternalLink,null))));n.displayName="Link";n.defaultProps={as:void 0,href:void 0,disabled:!1,startIcon:void 0,endIcon:void 0};n.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=n;

package/dist/v2/Link/Link.js

@@ -1,7 +1,7 @@
 import r from "react";
 import t from "prop-types";
 import s from "styled-components";
-import c from "@strapi/icons/ExternalLink";
+import { ExternalLink as c } from "@strapi/icons";
 import { Typography as f } from "../../Typography/Typography.js";
 import { Box as y } from "../../Box/Box.js";
 import { buttonFocusStyle as u } from "../../themes/utils.js";