@strapi/design-system 1.7.1 → 1.7.2-alpha.0

package/dist/Combobox/Combobox.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),re=require("react"),V=require("@strapi/icons"),n=require("@strapi/ui-primitives"),l=require("styled-components"),te=require("../hooks/useControllableState.cjs"),ne=require("../hooks/useId.cjs"),se=require("../hooks/useIntersection.cjs"),le=require("../themes/utils.cjs"),ie=require("../Loader/Loader.cjs"),k=require("../Box/Box.cjs"),b=require("../Typography/Typography.cjs"),ae=require("../Field/Field.cjs"),m=require("../Flex/Flex.cjs"),ce=require("../Field/FieldLabel.cjs"),de=require("../Field/FieldHint.cjs"),ue=require("../Field/FieldError.cjs");function he(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const i=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(r,s,i.get?i:{enumerable:!0,get:()=>e[s]})}}return r.default=e,Object.freeze(r)}const c=he(re),O=({children:e,clearLabel:r="clear",creatable:s=!1,createMessage:i=f=>`Create "${f}"`,disabled:d=!1,error:u,hasMoreItems:S=!1,hint:B,id:P,label:E,labelAction:z,loading:p=!1,loadingMessage:D="Loading content...",noOptionsMessage:H=()=>"No results found",onChange:C,onClear:g,onCreateOption:$,onInputChange:j,onLoadMore:y,placeholder:L="Select or enter a value",required:I=!1,defaultTextValue:N,textValue:_,value:W})=>{const[f,M]=c.useState(!1),[a,w]=te.useControllableState({prop:_,defaultProp:N}),[U,T]=c.useState(""),q=c.useRef(null),v=c.useRef(null),A=c.useRef(null),h=ne.useId(P),G=t=>{g&&!d&&(w(""),T(""),g(t),v.current.focus())},J=t=>{M(t)},K=t=>{w(t)},Q=t=>{T(t)},X=t=>{j&&j(t)},Y=t=>{C&&C(t)},F=`intersection-${CSS.escape(h)}`,Z=t=>{y&&S&&!p&&y(t)},R=()=>{$&&a&&$(a)};se.useIntersection(q,Z,{selectorToWatch:`#${F}`,skipWhen:!f});const ee=`${h}-hint`,oe=`${h}-error`;return o.jsx(ae.Field,{hint:B,error:u,id:h,required:I,children:o.jsxs(m.Flex,{direction:"column",alignItems:"stretch",gap:1,children:[o.jsx(ce.FieldLabel,{action:z,children:E}),o.jsxs(n.Combobox.Root,{autocomplete:s?"list":"both",onOpenChange:J,onTextValueChange:K,textValue:a,allowCustomValue:!0,disabled:d,required:I,value:W,onValueChange:Y,filterValue:U,onFilterValueChange:Q,children:[o.jsxs(pe,{$hasError:!!u,children:[o.jsx(ge,{placeholder:L,id:h,"aria-invalid":!!u,"aria-labelledby":`${ee} ${oe}`,onChange:X,ref:v}),o.jsxs(m.Flex,{as:"span",gap:3,children:[a&&g?o.jsx(xe,{as:"button",hasRadius:!0,background:"transparent",type:"button",onClick:G,"aria-disabled":d,"aria-label":r,title:r,ref:A,children:o.jsx(V.Cross,{})}):null,o.jsx(fe,{children:o.jsx(V.CarretDown,{})})]})]}),o.jsx(n.Combobox.Portal,{children:o.jsx(me,{sideOffset:4,children:o.jsxs(Ce,{ref:q,children:[e,s?o.jsx(n.Combobox.CreateItem,{onPointerUp:R,onClick:R,asChild:!0,children:o.jsx(x,{children:o.jsx(b.Typography,{children:i(a??"")})})}):null,!s&&!p?o.jsx(n.Combobox.NoValueFound,{asChild:!0,children:o.jsx(x,{$hasHover:!1,children:o.jsx(b.Typography,{children:H(a??"")})})}):null,p?o.jsx(m.Flex,{justifyContent:"center",alignItems:"center",paddingTop:2,paddingBottom:2,children:o.jsx(ie.Loader,{small:!0,children:D})}):null,o.jsx(k.Box,{id:F,width:"100%",height:"1px"})]})})})]}),o.jsx(de.FieldHint,{}),o.jsx(ue.FieldError,{})]})})},be=e=>o.jsx(O,{...e,creatable:!0}),xe=l(k.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),re=require("react"),V=require("@strapi/icons"),n=require("@strapi/ui-primitives"),te=require("styled-components"),ne=require("../hooks/useControllableState.cjs"),se=require("../hooks/useId.cjs"),le=require("../hooks/useIntersection.cjs"),ie=require("../themes/utils.cjs"),ae=require("../Loader/Loader.cjs"),k=require("../Box/Box.cjs"),b=require("../Typography/Typography.cjs"),ce=require("../Field/Field.cjs"),m=require("../Flex/Flex.cjs"),de=require("../Field/FieldLabel.cjs"),ue=require("../Field/FieldHint.cjs"),he=require("../Field/FieldError.cjs"),be=e=>e&&e.__esModule?e:{default:e};function xe(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const i=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(r,s,i.get?i:{enumerable:!0,get:()=>e[s]})}}return r.default=e,Object.freeze(r)}const c=xe(re),l=be(te),O=({children:e,clearLabel:r="clear",creatable:s=!1,createMessage:i=g=>`Create "${g}"`,disabled:d=!1,error:u,hasMoreItems:S=!1,hint:_,id:B,label:P,labelAction:E,loading:p=!1,loadingMessage:z="Loading content...",noOptionsMessage:D=()=>"No results found",onChange:C,onClear:f,onCreateOption:$,onInputChange:j,onLoadMore:y,placeholder:H="Select or enter a value",required:I=!1,defaultTextValue:L,textValue:M,value:N})=>{const[g,W]=c.useState(!1),[a,w]=ne.useControllableState({prop:M,defaultProp:L}),[U,T]=c.useState(""),q=c.useRef(null),v=c.useRef(null),A=c.useRef(null),h=se.useId(B),G=t=>{f&&!d&&(w(""),T(""),f(t),v.current.focus())},J=t=>{W(t)},K=t=>{w(t)},Q=t=>{T(t)},X=t=>{j&&j(t)},Y=t=>{C&&C(t)},F=`intersection-${CSS.escape(h)}`,Z=t=>{y&&S&&!p&&y(t)},R=()=>{$&&a&&$(a)};le.useIntersection(q,Z,{selectorToWatch:`#${F}`,skipWhen:!g});const ee=`${h}-hint`,oe=`${h}-error`;return o.jsx(ce.Field,{hint:_,error:u,id:h,required:I,children:o.jsxs(m.Flex,{direction:"column",alignItems:"stretch",gap:1,children:[o.jsx(de.FieldLabel,{action:E,children:P}),o.jsxs(n.Combobox.Root,{autocomplete:s?"list":"both",onOpenChange:J,onTextValueChange:K,textValue:a,allowCustomValue:!0,disabled:d,required:I,value:N,onValueChange:Y,filterValue:U,onFilterValueChange:Q,children:[o.jsxs(ge,{$hasError:!!u,children:[o.jsx(me,{placeholder:H,id:h,"aria-invalid":!!u,"aria-labelledby":`${ee} ${oe}`,onChange:X,ref:v}),o.jsxs(m.Flex,{as:"span",gap:3,children:[a&&f?o.jsx(fe,{as:"button",hasRadius:!0,background:"transparent",type:"button",onClick:G,"aria-disabled":d,"aria-label":r,title:r,ref:A,children:o.jsx(V.Cross,{})}):null,o.jsx(Ce,{children:o.jsx(V.CarretDown,{})})]})]}),o.jsx(n.Combobox.Portal,{children:o.jsx($e,{sideOffset:4,children:o.jsxs(je,{ref:q,children:[e,s?o.jsx(n.Combobox.CreateItem,{onPointerUp:R,onClick:R,asChild:!0,children:o.jsx(x,{children:o.jsx(b.Typography,{children:i(a??"")})})}):null,!s&&!p?o.jsx(n.Combobox.NoValueFound,{asChild:!0,children:o.jsx(x,{$hasHover:!1,children:o.jsx(b.Typography,{children:D(a??"")})})}):null,p?o.jsx(m.Flex,{justifyContent:"center",alignItems:"center",paddingTop:2,paddingBottom:2,children:o.jsx(ae.Loader,{small:!0,children:z})}):null,o.jsx(k.Box,{id:F,width:"100%",height:"1px"})]})})})]}),o.jsx(ue.FieldHint,{}),o.jsx(he.FieldError,{})]})})},pe=e=>o.jsx(O,{...e,creatable:!0}),fe=l.default(k.Box)`
   border: none;
 
   svg {
@@ -9,7 +9,7 @@
   svg path {
     fill: ${({theme:e})=>e.colors.neutral600};
   }
-`,pe=l(n.Combobox.Trigger)`
+`,ge=l.default(n.Combobox.Trigger)`
   position: relative;
   border: 1px solid ${({theme:e,$hasError:r})=>r?e.colors.danger600:e.colors.neutral200};
   padding-right: ${({theme:e})=>e.spaces[3]};
@@ -33,8 +33,8 @@
     outline: none;
   }
 
-  ${({theme:e,$hasError:r})=>le.inputFocusStyle()({theme:e,hasError:r})};
-`,ge=l(n.Combobox.TextInput)`
+  ${({theme:e,$hasError:r})=>ie.inputFocusStyle()({theme:e,hasError:r})};
+`,me=l.default(n.Combobox.TextInput)`
   width: 100%;
   font-size: ${14/16}rem;
   color: ${({theme:e})=>e.colors.neutral800};
@@ -49,7 +49,7 @@
   &[aria-disabled='true'] {
     cursor: inherit;
   }
-`,fe=l(n.Combobox.Icon)`
+`,Ce=l.default(n.Combobox.Icon)`
   & > svg {
     width: ${6/16}rem;
 
@@ -61,7 +61,7 @@
   &[aria-disabled='true'] {
     cursor: inherit;
   }
-`,me=l(n.Combobox.Content)`
+`,$e=l.default(n.Combobox.Content)`
   background: ${({theme:e})=>e.colors.neutral0};
   box-shadow: ${({theme:e})=>e.shadows.filterShadow};
   border: 1px solid ${({theme:e})=>e.colors.neutral150};
@@ -70,9 +70,9 @@
   /* This is from the design-system figma file. */
   max-height: 15rem;
   z-index: ${({theme:e})=>e.zIndices[1]};
-`,Ce=l(n.Combobox.Viewport)`
+`,je=l.default(n.Combobox.Viewport)`
   padding: ${({theme:e})=>e.spaces[1]};
-`,$e=c.forwardRef(({children:e,value:r,disabled:s,textValue:i,...d},u)=>o.jsx(n.Combobox.ComboboxItem,{asChild:!0,value:r,disabled:s,textValue:i,children:o.jsx(x,{ref:u,...d,children:o.jsx(n.Combobox.ItemText,{asChild:!0,children:o.jsx(b.Typography,{children:e})})})})),x=l.div`
+`,ye=c.forwardRef(({children:e,value:r,disabled:s,textValue:i,...d},u)=>o.jsx(n.Combobox.ComboboxItem,{asChild:!0,value:r,disabled:s,textValue:i,children:o.jsx(x,{ref:u,...d,children:o.jsx(n.Combobox.ItemText,{asChild:!0,children:o.jsx(b.Typography,{children:e})})})})),x=l.default.div`
   width: 100%;
   border: none;
   text-align: left;
@@ -103,4 +103,4 @@
       font-weight: bold;
     }
   }
-`;exports.Combobox=O;exports.CreatableCombobox=be;exports.Option=$e;exports.OptionBox=x;
+`;exports.Combobox=O;exports.CreatableCombobox=pe;exports.Option=ye;exports.OptionBox=x;

package/dist/DatePicker/DatePicker.cjs

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),p=require("react"),d=require("@strapi/icons"),h=require("styled-components"),R=require("./components.cjs"),P=require("./DatePickerCalendar.cjs"),S=require("./utils/formatDate.cjs"),v=require("../helpers/getDefaultLocale.cjs"),A=require("../TextInput/TextInput.cjs"),W=require("../Field/FieldAction.cjs"),$=({ariaLabel:t,onClear:a,clearLabel:D="Clear",initialDate:m,locale:x,maxDate:q,minDate:C,onChange:l,selectedDate:i,disabled:n=!1,...g})=>{const[s,o]=p.useState(!1),r=p.useRef(null),u=x||v.getDefaultLocale(),f=i?S.formatDate(i,u):"",j=()=>{n||o(c=>!c)},b=()=>{n||a&&(a(),r.current.inputWrapperRef.current.focus())},k=c=>{l&&l(c),o(!1)},y=()=>{o(!1)};return e.jsxs(R.DatePickerWrapper,{bold:s,children:[e.jsx(A.TextInput,{ref:r,onClick:j,onChange:()=>{},value:f,startAction:e.jsx(T,{"aria-hidden":!0}),endAction:a&&f?e.jsx(W.FieldAction,{label:D,onClick:b,"aria-disabled":n||void 0,children:e.jsx(I,{})}):void 0,"aria-autocomplete":"none","aria-label":t,disabled:n,type:"text",...g}),r.current&&r.current.inputWrapperRef&&s&&e.jsx(P.DatePickerCalendar,{selectedDate:i,initialDate:m,onChange:k,onEscape:y,locale:u,popoverSource:r.current.inputWrapperRef,minDate:C,maxDate:q})]})},I=h(d.Cross)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),d=require("react"),p=require("@strapi/icons"),R=require("styled-components"),P=require("./components.cjs"),S=require("./DatePickerCalendar.cjs"),_=require("./utils/formatDate.cjs"),v=require("../helpers/getDefaultLocale.cjs"),A=require("../TextInput/TextInput.cjs"),W=require("../Field/FieldAction.cjs"),$=e=>e&&e.__esModule?e:{default:e},h=$(R),I=({ariaLabel:e,onClear:a,clearLabel:D="Clear",initialDate:m,locale:x,maxDate:q,minDate:C,onChange:c,selectedDate:o,disabled:n=!1,...g})=>{const[s,i]=d.useState(!1),r=d.useRef(null),u=x||v.getDefaultLocale(),f=o?_.formatDate(o,u):"",j=()=>{n||i(l=>!l)},y=()=>{n||a&&(a(),r.current.inputWrapperRef.current.focus())},b=l=>{c&&c(l),i(!1)},k=()=>{i(!1)};return t.jsxs(P.DatePickerWrapper,{bold:s,children:[t.jsx(A.TextInput,{ref:r,onClick:j,onChange:()=>{},value:f,startAction:t.jsx(E,{"aria-hidden":!0}),endAction:a&&f?t.jsx(W.FieldAction,{label:D,onClick:y,"aria-disabled":n||void 0,children:t.jsx(T,{})}):void 0,"aria-autocomplete":"none","aria-label":e,disabled:n,type:"text",...g}),r.current&&r.current.inputWrapperRef&&s&&t.jsx(S.DatePickerCalendar,{selectedDate:o,initialDate:m,onChange:b,onEscape:k,locale:u,popoverSource:r.current.inputWrapperRef,minDate:C,maxDate:q})]})},T=h.default(p.Cross)`
   height: ${11/16}rem;
   width: ${11/16}rem;
 
   path {
-    fill: ${({theme:t})=>t.colors.neutral600};
+    fill: ${({theme:e})=>e.colors.neutral600};
   }
-`,T=h(d.Calendar)`
+`,E=h.default(p.Calendar)`
   & > path {
-    fill: ${({theme:t})=>t.colors.neutral500};
+    fill: ${({theme:e})=>e.colors.neutral500};
   }
-`;exports.DatePicker=$;
+`;exports.DatePicker=I;

package/dist/DatePicker/DatePickerTd.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),c=require("styled-components"),s=require("../RawTable/RawCell.cjs"),i=require("../Typography/Typography.cjs"),u=c.button`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),u=require("styled-components"),s=require("../RawTable/RawCell.cjs"),l=require("../Typography/Typography.cjs"),c=e=>e&&e.__esModule?e:{default:e},d=c(u),f=d.default.button`
   border: none;
   background: ${({theme:e,$isSelected:r})=>r?e.colors.primary100:e.colors.neutral0};
   height: ${32/16}rem;
@@ -13,7 +13,7 @@
     background: ${({theme:e})=>e.colors.primary100};
   }
 
-  &:hover > ${i.Typography} {
+  &:hover > ${l.Typography} {
     color: ${({theme:e})=>e.colors.primary600};
   }
-`,d=({children:e,outsideMonth:r=!1,onSelectDay:l,isSelected:o=!1,...a})=>{let t="neutral900";return o?t="primary600":r&&(t="neutral600"),n.jsx(s.RawTd,{...a,children:n.jsx(u,{tabIndex:-1,onClick:l,$isSelected:o,type:"button",children:n.jsx(i.Typography,{variant:"pi",textColor:t,fontWeight:o?"bold":void 0,children:e})})})};exports.DatePickerTd=d;
+`,p=({children:e,outsideMonth:r=!1,onSelectDay:i,isSelected:t=!1,...a})=>{let o="neutral900";return t?o="primary600":r&&(o="neutral600"),n.jsx(s.RawTd,{...a,children:n.jsx(f,{tabIndex:-1,onClick:i,$isSelected:t,type:"button",children:n.jsx(l.Typography,{variant:"pi",textColor:o,fontWeight:t?"bold":void 0,children:e})})})};exports.DatePickerTd=p;

package/dist/DatePicker/DatePickerTh.cjs

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("styled-components"),n=require("../RawTable/RawCell.cjs"),o=require("../Flex/Flex.cjs"),s=require("../Typography/Typography.cjs"),a=require("../VisuallyHidden/VisuallyHidden.cjs"),l=t(n.RawTh)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("styled-components"),n=require("../RawTable/RawCell.cjs"),s=require("../Flex/Flex.cjs"),l=require("../Typography/Typography.cjs"),a=require("../VisuallyHidden/VisuallyHidden.cjs"),u=e=>e&&e.__esModule?e:{default:e},r=u(o),c=r.default(n.RawTh)`
   // Trick to prevent the outline from overflowing because of the general outline-offset
   outline-offset: -2px;
-  border-radius: ${({theme:r})=>r.borderRadius};
+  border-radius: ${({theme:e})=>e.borderRadius};
   text-transform: capitalize;
-`,c=t(o.Flex)`
+`,d=r.default(s.Flex)`
   height: ${24/16}rem;
   width: ${32/16}rem;
-`,u=({children:r,...i})=>e.jsx(l,{...i,children:e.jsxs(c,{justifyContent:"center",children:[e.jsx(s.Typography,{variant:"pi",fontWeight:"bold",color:"neutral800","aria-hidden":!0,children:r.substr(0,2)}),e.jsx(a.VisuallyHidden,{children:e.jsx("span",{children:r})})]})});exports.DatePickerTh=u;
+`,h=({children:e,...i})=>t.jsx(c,{...i,children:t.jsxs(d,{justifyContent:"center",children:[t.jsx(l.Typography,{variant:"pi",fontWeight:"bold",color:"neutral800","aria-hidden":!0,children:e.substr(0,2)}),t.jsx(a.VisuallyHidden,{children:t.jsx("span",{children:e})})]})});exports.DatePickerTh=h;

package/dist/DatePicker/components.cjs

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),t=require("../Field/FieldInput.cjs"),n=require("../Popover/Popover.cjs"),i=require("../Box/Box.cjs"),a=r(n.Popover)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),n=require("../Field/FieldInput.cjs"),a=require("../Popover/Popover.cjs"),i=require("../Box/Box.cjs"),d=e=>e&&e.__esModule?e:{default:e},r=d(o),s=r.default(a.Popover)`
   max-height: ${3*6}rem;
   overflow: hidden;
 `;/**
  * @preserve
  * @deprecated This component will be removed in the next major version
- */const s=r.button`
+ */const l=r.default.button`
   border: none;
   background: transparent;
   border-radius: ${({theme:e})=>e.borderRadius};
@@ -13,16 +13,16 @@
   & svg path {
     fill: ${({theme:e})=>e.colors.neutral500};
   }
-`,c=r.div`
-  ${({bold:e,theme:o})=>e?r.css`
-          & ${t.InputWrapper} {
-            border: 1px solid ${o.colors.primary600};
+`,u=r.default.div`
+  ${({bold:e,theme:t})=>e?o.css`
+          & ${n.InputWrapper} {
+            border: 1px solid ${t.colors.primary600};
           }
         `:""}
 `;/**
  * @preserve
  * @deprecated This component will be removed in the next major version
- */const d=r(i.Box)`
+ */const c=r.default(i.Box)`
   background: transparent;
   border: none;
   position: relative;
@@ -36,4 +36,4 @@
   svg path {
     fill: ${({theme:e})=>e.colors.neutral600};
   }
-`;exports.DatePickerButton=s;exports.DatePickerPopover=a;exports.DatePickerWrapper=c;exports.IconBox=d;
+`;exports.DatePickerButton=l;exports.DatePickerPopover=s;exports.DatePickerWrapper=u;exports.IconBox=c;

package/dist/Dialog/Dialog.cjs

@@ -1,11 +1,11 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("prop-types"),s=require("styled-components"),g=require("../DismissibleLayer/index.cjs"),x=require("../helpers/setOpacity.cjs"),y=require("../hooks/useId.cjs"),h=require("../hooks/useLockScroll.cjs"),q=require("../FocusTrap/FocusTrap.cjs"),n=require("../Box/Box.cjs"),b=require("../Flex/Flex.cjs"),j=require("../Portal/Portal.cjs"),m=require("../Typography/Typography.cjs"),D=s(n.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const g=require("prop-types"),x=require("styled-components"),y=require("../DismissibleLayer/index.cjs"),h=require("../helpers/setOpacity.cjs"),q=require("../hooks/useId.cjs"),b=require("../hooks/useLockScroll.cjs"),j=require("../FocusTrap/FocusTrap.cjs"),i=require("../Box/Box.cjs"),m=require("../Flex/Flex.cjs"),D=require("../Portal/Portal.cjs"),T=require("../Typography/Typography.cjs"),l=e=>e&&e.__esModule?e:{default:e},o=l(g),s=l(x),P=s.default(i.Box)`
   inset: 0;
-  background: ${({theme:o})=>x.setOpacity(o.colors.neutral800,.2)};
-`,f=s(n.Box)`
+  background: ${({theme:e})=>h.setOpacity(e.colors.neutral800,.2)};
+`,_=s.default(i.Box)`
   max-width: ${412/16}rem;
   margin: 0 auto;
   overflow: hidden;
   margin-top: 10%;
-`,T=s(b.Flex)`
-  border-bottom: 1px solid ${({theme:o})=>o.colors.neutral150};
-`,i=({onClose:o,title:l,as:d,isOpen:t,id:u,...c})=>{const p=y.useId(u);if(h(t),!t)return null;const a=`${p}-label`;return e.jsx(j.Portal,{children:e.jsx(D,{padding:8,position:"fixed",zIndex:4,children:e.jsx(q.FocusTrap,{children:e.jsx(g.DismissibleLayer,{onEscapeKeyDown:o,onPointerDownOutside:o,children:e.jsxs(f,{"aria-labelledby":a,"aria-modal":!0,background:"neutral0",hasRadius:!0,shadow:"popupShadow",role:"dialog",children:[e.jsx(T,{padding:6,justifyContent:"center",children:e.jsx(m.Typography,{variant:"beta",as:d||"h2",id:a,children:l})}),e.jsx(n.Box,{...c})]})})})})})};i.displayName="Dialog";i.defaultProps={as:"h2",id:void 0};i.propTypes={as:r.string,id:r.oneOfType([r.string,r.number]),isOpen:r.bool.isRequired,onClose:r.func.isRequired,title:r.string.isRequired};exports.Dialog=i;
+`,w=s.default(m.Flex)`
+  border-bottom: 1px solid ${({theme:e})=>e.colors.neutral150};
+`,t=({onClose:e,title:d,as:u,isOpen:a,id:c,...p})=>{const f=q.useId(c);if(b(a),!a)return null;const n=`${f}-label`;return r.jsx(D.Portal,{children:r.jsx(P,{padding:8,position:"fixed",zIndex:4,children:r.jsx(j.FocusTrap,{children:r.jsx(y.DismissibleLayer,{onEscapeKeyDown:e,onPointerDownOutside:e,children:r.jsxs(_,{"aria-labelledby":n,"aria-modal":!0,background:"neutral0",hasRadius:!0,shadow:"popupShadow",role:"dialog",children:[r.jsx(w,{padding:6,justifyContent:"center",children:r.jsx(T.Typography,{variant:"beta",as:u||"h2",id:n,children:d})}),r.jsx(i.Box,{...p})]})})})})})};t.displayName="Dialog";t.defaultProps={as:"h2",id:void 0};t.propTypes={as:o.default.string,id:o.default.oneOfType([o.default.string,o.default.number]),isOpen:o.default.bool.isRequired,onClose:o.default.func.isRequired,title:o.default.string.isRequired};exports.Dialog=t;

package/dist/Dialog/DialogBody.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime");require("react");const n=require("prop-types"),d=require("styled-components"),r=require("../Box/Box.cjs"),s=require("../Flex/Flex.cjs"),c=d(r.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const r=require("prop-types"),l=require("styled-components"),n=require("../Box/Box.cjs"),a=require("../Flex/Flex.cjs"),s=e=>e&&e.__esModule?e:{default:e},i=s(r),c=s(l),u=c.default(n.Box)`
   svg {
     width: ${({theme:e})=>e.spaces[6]};
     height: ${({theme:e})=>e.spaces[6]};
@@ -7,4 +7,4 @@
       fill: ${({theme:e})=>e.colors.danger600};
     }
   }
-`,o=({children:e,icon:t})=>i.jsxs(r.Box,{paddingTop:8,paddingBottom:8,paddingLeft:6,paddingRight:6,children:[t&&i.jsx(c,{paddingBottom:2,children:i.jsx(s.Flex,{justifyContent:"center",children:t})}),e]});o.displayName="DialogBody";o.defaultProps={icon:void 0};o.propTypes={children:n.node.isRequired,icon:n.node};exports.DialogBody=o;
+`,o=({children:e,icon:d})=>t.jsxs(n.Box,{paddingTop:8,paddingBottom:8,paddingLeft:6,paddingRight:6,children:[d&&t.jsx(u,{paddingBottom:2,children:t.jsx(a.Flex,{justifyContent:"center",children:d})}),e]});o.displayName="DialogBody";o.defaultProps={icon:void 0};o.propTypes={children:i.default.node.isRequired,icon:i.default.node};exports.DialogBody=o;

package/dist/Dialog/DialogFooter.cjs

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const r=require("prop-types"),n=require("styled-components"),s=require("../Box/Box.cjs"),d=require("../Flex/Flex.cjs"),l=n(s.Box)`
-  border-top: 1px solid ${({theme:o})=>o.colors.neutral150};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const s=require("prop-types"),l=require("styled-components"),d=require("../Box/Box.cjs"),u=require("../Flex/Flex.cjs"),n=e=>e&&e.__esModule?e:{default:e},r=n(s),a=n(l),c=a.default(d.Box)`
+  border-top: 1px solid ${({theme:e})=>e.colors.neutral150};
 
   button {
     width: 100%;
     display: inline-flex;
     justify-content: center;
   }
-`,e=({startAction:o,endAction:i})=>t.jsx(l,{padding:4,children:t.jsxs(d.Flex,{gap:2,children:[o,i]})});e.displayName="DialogFooter";e.defaultProps={endAction:void 0,startAction:void 0};e.propTypes={endAction:r.node,startAction:r.node};exports.DialogFooter=e;
+`,t=({startAction:e,endAction:i})=>o.jsx(c,{padding:4,children:o.jsxs(u.Flex,{gap:2,children:[e,i]})});t.displayName="DialogFooter";t.defaultProps={endAction:void 0,startAction:void 0};t.propTypes={endAction:r.default.node,startAction:r.default.node};exports.DialogFooter=t;

package/dist/DismissibleLayer/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("@radix-ui/react-dismissable-layer");function o(e){const i=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(i,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return i.default=e,Object.freeze(i)}const n=o(s),a=n.Root;exports.DismissibleLayer=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("@radix-ui/react-dismissable-layer");function o(e){if(e&&e.__esModule)return e;const i=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(i,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return i.default=e,Object.freeze(i)}const n=o(s),c=n.Root;exports.DismissibleLayer=c;

package/dist/Divider/Divider.cjs

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime");require("react");const n=require("prop-types"),o=require("styled-components"),s=require("../Box/Box.cjs"),u=o(s.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime");require("react");const s=require("prop-types"),u=require("styled-components"),a=require("../Box/Box.cjs"),n=e=>e&&e.__esModule?e:{default:e},r=n(s),d=n(u),l=d.default(a.Box)`
   height: 1px;
   border: none;
   /* If contained in a Flex parent we want to prevent the Divider to shink */
   flex-shrink: 0;
   ${({unsetMargin:e})=>e?"margin: 0;":""}
-`,r=({unsetMargin:e,...t})=>i.jsx(u,{...t,as:"hr",unsetMargin:e});r.defaultProps={background:"neutral150",unsetMargin:!0};r.propTypes={background:n.string,unsetMargin:n.bool};exports.Divider=r;
+`,t=({unsetMargin:e,...o})=>i.jsx(l,{...o,as:"hr",unsetMargin:e});t.defaultProps={background:"neutral150",unsetMargin:!0};t.propTypes={background:r.default.string,unsetMargin:r.default.bool};exports.Divider=t;

package/dist/EmptyStateLayout/EmptyStateLayout.cjs

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const e=require("prop-types"),a=require("styled-components"),r=require("../Box/Box.cjs"),u=require("../Typography/Typography.cjs"),c=a(r.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime");require("react");const p=require("prop-types"),c=require("styled-components"),o=require("../Box/Box.cjs"),y=require("../Typography/Typography.cjs"),n=e=>e&&e.__esModule?e:{default:e},t=n(p),d=n(c),f=d.default(o.Box)`
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
-`,l=a(r.Box)`
+`,g=d.default(o.Box)`
   svg {
     height: ${88/16}rem;
   }
-`,o=({icon:i,content:n,action:s,hasRadius:d,shadow:p})=>t.jsxs(c,{padding:11,background:"neutral0",hasRadius:d,shadow:p,children:[t.jsx(l,{paddingBottom:6,"aria-hidden":!0,children:i}),t.jsx(r.Box,{paddingBottom:4,children:t.jsx(u.Typography,{variant:"delta",as:"p",textColor:"neutral600",children:n})}),s]});o.defaultProps={action:void 0,hasRadius:!0,shadow:"tableShadow"};o.propTypes={action:e.node,content:e.string.isRequired,hasRadius:e.bool,icon:e.node.isRequired,shadow:e.string};exports.EmptyStateLayout=o;
+`,r=({icon:e,content:i,action:s,hasRadius:u,shadow:l})=>a.jsxs(f,{padding:11,background:"neutral0",hasRadius:u,shadow:l,children:[a.jsx(g,{paddingBottom:6,"aria-hidden":!0,children:e}),a.jsx(o.Box,{paddingBottom:4,children:a.jsx(y.Typography,{variant:"delta",as:"p",textColor:"neutral600",children:i})}),s]});r.defaultProps={action:void 0,hasRadius:!0,shadow:"tableShadow"};r.propTypes={action:t.default.node,content:t.default.string.isRequired,hasRadius:t.default.bool,icon:t.default.node.isRequired,shadow:t.default.string};exports.EmptyStateLayout=r;

package/dist/Field/FieldAction.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),o=require("styled-components"),l=require("../Flex/Flex.cjs"),d=require("../VisuallyHidden/VisuallyHidden.cjs"),a=o(l.Flex)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("react"),i=require("styled-components"),l=require("../Flex/Flex.cjs"),d=require("../VisuallyHidden/VisuallyHidden.cjs"),u=e=>e&&e.__esModule?e:{default:e},a=u(i),c=a.default(l.Flex)`
   font-size: 1.6rem;
   padding: 0;
-`,c=t.forwardRef(({label:n,children:r,...i},s)=>e.jsxs(a,{justifyContent:"unset",background:"transparent",borderStyle:"none",type:"button",...i,as:"button",ref:s,children:[e.jsx(d.VisuallyHidden,{as:"span",children:n}),t.cloneElement(r,{"aria-hidden":!0,focusable:!1})]}));exports.FieldAction=c;
+`,f=n.forwardRef(({label:e,children:r,...s},o)=>t.jsxs(c,{justifyContent:"unset",background:"transparent",borderStyle:"none",type:"button",...s,as:"button",ref:o,children:[t.jsx(d.VisuallyHidden,{as:"span",children:e}),n.cloneElement(r,{"aria-hidden":!0,focusable:!1})]}));exports.FieldAction=f;

package/dist/Field/FieldInput.cjs

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),R=require("react"),t=require("styled-components"),j=require("./FieldContext.cjs"),m=require("../themes/utils.cjs"),u=require("../Box/Box.cjs"),F=require("../Flex/Flex.cjs"),c={S:6.5,M:10.5},I=R.forwardRef(({endAction:e,startAction:r,disabled:o=!1,onChange:d,size:f="M",...g},$)=>{const{id:i,error:s,hint:b,name:h,required:x}=j.useField();let a;s?a=`${i}-error`:b&&(a=`${i}-hint`);const l=!!s,q=y=>{!o&&d&&d(y)};return n.jsxs(p,{justifyContent:"space-between",hasError:l,disabled:o,children:[r?n.jsx(u.Box,{paddingLeft:3,paddingRight:2,children:r}):null,n.jsx(w,{id:i,name:h,ref:$,"aria-describedby":a,"aria-invalid":l,"aria-disabled":o,disabled:o,"data-disabled":o?"":void 0,hasLeftAction:!!r,hasRightAction:!!e,onChange:q,"aria-required":x,$size:f,...g}),e?n.jsx(u.Box,{paddingLeft:2,paddingRight:3,children:e}):null]})}),w=t.input`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),j=require("react"),c=require("styled-components"),m=require("./FieldContext.cjs"),F=require("../themes/utils.cjs"),l=require("../Box/Box.cjs"),I=require("../Flex/Flex.cjs"),w=e=>e&&e.__esModule?e:{default:e},p=w(c),u={S:6.5,M:10.5},B=j.forwardRef(({endAction:e,startAction:r,disabled:o=!1,onChange:a,size:g="M",...$},b)=>{const{id:i,error:d,hint:h,name:x,required:y}=m.useField();let t;d?t=`${i}-error`:h&&(t=`${i}-hint`);const s=!!d,q=R=>{!o&&a&&a(R)};return n.jsxs(f,{justifyContent:"space-between",hasError:s,disabled:o,children:[r?n.jsx(l.Box,{paddingLeft:3,paddingRight:2,children:r}):null,n.jsx(_,{id:i,name:x,ref:b,"aria-describedby":t,"aria-invalid":s,"aria-disabled":o,disabled:o,"data-disabled":o?"":void 0,hasLeftAction:!!r,hasRightAction:!!e,onChange:q,"aria-required":y,$size:g,...$}),e?n.jsx(l.Box,{paddingLeft:2,paddingRight:3,children:e}):null]})}),_=p.default.input`
   border: none;
   border-radius: ${({theme:e})=>e.borderRadius};
-  padding-bottom: ${({$size:e})=>`${c[e]/16}rem`};
+  padding-bottom: ${({$size:e})=>`${u[e]/16}rem`};
   padding-left: ${({theme:e,hasLeftAction:r})=>r?0:e.spaces[4]};
   padding-right: ${({theme:e,hasRightAction:r})=>r?0:e.spaces[4]};
-  padding-top: ${({$size:e})=>`${c[e]/16}rem`};
+  padding-top: ${({$size:e})=>`${u[e]/16}rem`};
   cursor: ${e=>e["aria-disabled"]?"not-allowed":void 0};
 
   color: ${({theme:e})=>e.colors.neutral800};
@@ -28,14 +28,14 @@
     outline: none;
     box-shadow: none;
   }
-`,p=t(F.Flex)`
+`,f=p.default(I.Flex)`
   border: 1px solid ${({theme:e,hasError:r})=>r?e.colors.danger600:e.colors.neutral200};
   border-radius: ${({theme:e})=>e.borderRadius};
   background: ${({theme:e})=>e.colors.neutral0};
-  ${m.inputFocusStyle()}
+  ${F.inputFocusStyle()}
 
-  ${({theme:e,disabled:r})=>r?t.css`
+  ${({theme:e,disabled:r})=>r?c.css`
           color: ${e.colors.neutral600};
           background: ${e.colors.neutral150};
         `:void 0}
-`;exports.FieldInput=I;exports.InputWrapper=p;
+`;exports.FieldInput=B;exports.InputWrapper=f;

package/dist/Field/FieldLabel.cjs

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("react"),i=require("styled-components"),p=require("./FieldContext.cjs"),h=require("../helpers/deprecations.cjs"),o=require("../Typography/Typography.cjs"),g=require("../Flex/Flex.cjs"),y=h.once(console.warn),q=u.forwardRef(({children:e,action:t,required:n,...l},s)=>{const{id:a,required:d}=p.useField(),c=d||n;return n!==void 0&&y('Deprecation warning: Usage of "required" prop in FieldLabel component is deprecated. This is discouraged and will be removed in the next major release. Please use the Field component to share the required prop.'),r.jsxs(x,{ref:s,variant:"pi",textColor:"neutral800",htmlFor:a,fontWeight:"bold",as:"label",...l,children:[e,c&&r.jsx(f,{textColor:"danger600",children:"*"}),t&&r.jsx(F,{marginLeft:1,children:t})]})}),x=i(o.Typography)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("react"),p=require("styled-components"),h=require("./FieldContext.cjs"),f=require("../helpers/deprecations.cjs"),o=require("../Typography/Typography.cjs"),g=require("../Flex/Flex.cjs"),y=e=>e&&e.__esModule?e:{default:e},t=y(p),q=f.once(console.warn),x=u.forwardRef(({children:e,action:n,required:i,...l},s)=>{const{id:a,required:d}=h.useField(),c=d||i;return i!==void 0&&q('Deprecation warning: Usage of "required" prop in FieldLabel component is deprecated. This is discouraged and will be removed in the next major release. Please use the Field component to share the required prop.'),r.jsxs(F,{ref:s,variant:"pi",textColor:"neutral800",htmlFor:a,fontWeight:"bold",as:"label",...l,children:[e,c&&r.jsx(m,{textColor:"danger600",children:"*"}),n&&r.jsx(b,{marginLeft:1,children:n})]})}),F=t.default(o.Typography)`
   display: flex;
   align-items: center;
-`,f=i(o.Typography)`
+`,m=t.default(o.Typography)`
   line-height: 0;
-`,F=i(g.Flex)`
+`,b=t.default(g.Flex)`
   line-height: 0;
 
   svg path {
     fill: ${({theme:e})=>e.colors.neutral500};
   }
-`;exports.FieldLabel=q;
+`;exports.FieldLabel=x;

package/dist/Flex/Flex.cjs

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),n=require("../helpers/handleResponsiveValues.cjs"),r=require("../Box/Box.cjs"),o={direction:!0},s=i(r.Box).withConfig({shouldForwardProp:(e,t)=>!o[e]&&t(e)})`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("styled-components"),o=require("../helpers/handleResponsiveValues.cjs"),l=require("../Box/Box.cjs"),i=e=>e&&e.__esModule?e:{default:e},r=i(n),s={direction:!0},u=r.default(l.Box).withConfig({shouldForwardProp:(e,t)=>!s[e]&&t(e)})`
   align-items: ${({alignItems:e="center"})=>e};
   display: ${({inline:e})=>e?"inline-flex":"flex"};
   flex-direction: ${({direction:e="row"})=>e};
   flex-shrink: ${({shrink:e})=>e};
   flex-wrap: ${({wrap:e})=>e};
-  ${({gap:e,theme:t})=>n("gap",e,t)};
+  ${({gap:e,theme:t})=>o("gap",e,t)};
   justify-content: ${({justifyContent:e})=>e};
-`;exports.Flex=s;
+`;exports.Flex=u;

package/dist/Grid/Grid.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),i=require("react"),n=require("prop-types"),u=require("styled-components"),a=require("./GridContext.cjs"),l=require("../helpers/handleResponsiveValues.cjs"),p=require("../Box/Box.cjs");function d(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const f=d(i),m=u(p.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("react"),l=require("prop-types"),d=require("styled-components"),i=require("./GridContext.cjs"),f=require("../helpers/handleResponsiveValues.cjs"),p=require("../Box/Box.cjs"),a=e=>e&&e.__esModule?e:{default:e};function y(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const m=y(c),o=a(l),_=a(d),b=_.default(p.Box)`
   display: grid;
   grid-template-columns: repeat(${({gridCols:e})=>e}, 1fr);
-  ${({theme:e,gap:r})=>l("gap",r,e)}
-`,s=({gap:e,gridCols:r,...t})=>{const o=f.useMemo(()=>({gap:e,gridCols:r}),[e,r]);return c.jsx(a.GridContext.Provider,{value:o,children:c.jsx(m,{gap:e,gridCols:r,...t})})};s.defaultProps={gap:0,gridCols:12};s.propTypes={gap:n.oneOfType([n.number,n.arrayOf(n.number)]),gridCols:n.number};exports.Grid=s;
+  ${({theme:e,gap:t})=>f("gap",t,e)}
+`,u=({gap:e,gridCols:t,...r})=>{const n=m.useMemo(()=>({gap:e,gridCols:t}),[e,t]);return s.jsx(i.GridContext.Provider,{value:n,children:s.jsx(b,{gap:e,gridCols:t,...r})})};u.defaultProps={gap:0,gridCols:12};u.propTypes={gap:o.default.oneOfType([o.default.number,o.default.arrayOf(o.default.number)]),gridCols:o.default.number};exports.Grid=u;

package/dist/Grid/GridItem.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const r=require("prop-types"),c=require("styled-components"),m=require("./GridContext.cjs"),l=require("../Box/Box.cjs"),p=c.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const a=require("prop-types"),c=require("styled-components"),p=require("./GridContext.cjs"),m=require("../Box/Box.cjs"),s=e=>e&&e.__esModule?e:{default:e},r=s(a),f=s(c),x=f.default.div`
   grid-column: span ${({col:e})=>e};
   max-width: 100%;
 
@@ -9,4 +9,4 @@
   ${({theme:e})=>e.mediaQueries.mobile} {
     grid-column: span ${({xs:e})=>e};
   }
-`,i=({col:e,xs:s,s:t,...n})=>{const{gap:d,gridCols:u}=m.useGrid();return o.jsx(p,{gap:d,gridCols:u,col:e,xs:s,s:t,children:o.jsx(l.Box,{...n})})};i.defaultProps={col:void 0,s:void 0,xs:void 0};i.propTypes={col:r.number,s:r.number,xs:r.number};exports.GridItem=i;
+`,t=({col:e,xs:i,s:d,...u})=>{const{gap:n,gridCols:l}=p.useGrid();return o.jsx(x,{gap:n,gridCols:l,col:e,xs:i,s:d,children:o.jsx(m.Box,{...u})})};t.defaultProps={col:void 0,s:void 0,xs:void 0};t.propTypes={col:r.default.number,s:r.default.number,xs:r.default.number};exports.GridItem=t;

package/dist/Icon/Icon.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),s=require("react"),i=require("styled-components"),l=require("../helpers/theme.cjs"),u=require("../Box/Box.cjs"),a=i(u.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),s=require("react"),u=require("styled-components"),a=require("../helpers/theme.cjs"),d=require("../Box/Box.cjs"),o=e=>e&&e.__esModule?e:{default:e},i=o(s),f=o(u),m=f.default(d.Box)`
   path {
-    fill: ${({color:e,theme:r})=>l.extractStyleFromTheme(r.colors,e,void 0)};
+    fill: ${({color:e,theme:t})=>a.extractStyleFromTheme(t.colors,e,void 0)};
   }
-  ${({theme:e,colors:r})=>r(e)}
-`,o=s.forwardRef(({color:e="neutral600",colors:r=()=>"",...t},c)=>n.jsx(a,{ref:c,color:e,colors:r,...t}));o.displayName="Icon";exports.Icon=o;
+  ${({theme:e,colors:t})=>t(e)}
+`,r=i.default.forwardRef(({color:e="neutral600",colors:t=()=>"",...c},n)=>l.jsx(m,{ref:n,color:e,colors:t,...c}));r.displayName="Icon";exports.Icon=r;

package/dist/IconButton/IconButton.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),v=require("react"),i=require("styled-components"),j=require("../VisuallyHidden/VisuallyHidden.cjs"),y=require("../Tooltip/Tooltip.cjs"),B=require("../BaseButton/BaseButton.cjs"),m=require("../Flex/Flex.cjs");function R(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const c=R(v),q=c.forwardRef(({label:e,background:t,borderWidth:r,noBorder:o=!1,children:d,icon:f,disabled:l=!1,onClick:a,"aria-label":p,...b},g)=>{const $=h=>{!l&&a&&a(h)},s=n.jsxs(u,{"aria-disabled":l,background:l?"neutral150":t,borderWidth:o?0:r,justifyContent:"center",height:"2rem",width:"2rem",...b,ref:g,onClick:$,children:[n.jsx(j.VisuallyHidden,{as:"span",children:e??p}),c.cloneElement(f||d,{"aria-hidden":!0,focusable:!1})]});return e?n.jsx(y.Tooltip,{label:e,children:s}):s}),u=i(B.BaseButton)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),v=require("react"),j=require("styled-components"),y=require("../VisuallyHidden/VisuallyHidden.cjs"),_=require("../Tooltip/Tooltip.cjs"),B=require("../BaseButton/BaseButton.cjs"),m=require("../Flex/Flex.cjs"),R=e=>e&&e.__esModule?e:{default:e};function q(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const u=q(v),c=R(j),x=u.forwardRef(({label:e,background:t,borderWidth:r,noBorder:o=!1,children:d,icon:f,disabled:l=!1,onClick:a,"aria-label":p,...b},g)=>{const $=h=>{!l&&a&&a(h)},s=n.jsxs(i,{"aria-disabled":l,background:l?"neutral150":t,borderWidth:o?0:r,justifyContent:"center",height:"2rem",width:"2rem",...b,ref:g,onClick:$,children:[n.jsx(y.VisuallyHidden,{as:"span",children:e??p}),u.cloneElement(f||d,{"aria-hidden":!0,focusable:!1})]});return e?n.jsx(_.Tooltip,{label:e,children:s}):s}),i=c.default(B.BaseButton)`
   svg {
     > g,
     path {
@@ -31,7 +31,7 @@
       }
     }
   }
-`,x=i(m.Flex)`
+`,O=c.default(m.Flex)`
   & span:first-child button {
     border-left: 1px solid ${({theme:e})=>e.colors.neutral200};
     border-radius: ${({theme:e})=>`${e.borderRadius} 0 0 ${e.borderRadius}`};
@@ -41,7 +41,7 @@
     border-radius: ${({theme:e})=>`0 ${e.borderRadius} ${e.borderRadius} 0`};
   }
 
-  & ${u} {
+  & ${i} {
     border-radius: 0;
     border-left: none;
 
@@ -78,4 +78,4 @@
       }
     }
   }
-`;exports.IconButton=q;exports.IconButtonGroup=x;
+`;exports.IconButton=x;exports.IconButtonGroup=O;

package/dist/JSONInput/JSONInputContainer.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("styled-components"),o=require("../themes/utils.cjs"),c=require("../Flex/Flex.cjs"),n=t(c.Flex)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),o=require("../themes/utils.cjs"),s=require("../Flex/Flex.cjs"),n=e=>e&&e.__esModule?e:{default:e},c=n(r),l=c.default(s.Flex)`
   line-height: ${({theme:e})=>e.lineHeights[2]};
 
   .cm-editor {
@@ -12,7 +12,7 @@
   }
 
   .cm-scroller {
-    border: 1px solid ${({theme:e,hasError:r})=>r?e.colors.danger600:e.colors.neutral200};
+    border: 1px solid ${({theme:e,hasError:t})=>t?e.colors.danger600:e.colors.neutral200};
     /* inputFocusStyle will receive hasError prop */
     ${o.inputFocusStyle()}
   }
@@ -30,4 +30,4 @@
      */
     background-color: #4a4a6a;
   }
-`;exports.JSONInputContainer=n;
+`;exports.JSONInputContainer=l;

package/dist/Layout/ActionLayout.cjs

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const r=require("prop-types"),s=require("styled-components"),l=require("../Flex/Flex.cjs"),i=require("../Box/Box.cjs"),c=s(l.Flex)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");require("react");const a=require("prop-types"),c=require("styled-components"),l=require("../Flex/Flex.cjs"),r=require("../Box/Box.cjs"),i=e=>e&&e.__esModule?e:{default:e},s=i(a),d=i(c),u=d.default(l.Flex)`
   & > * + * {
     margin-left: ${({theme:e})=>e.spaces[2]};
   }
 
   margin-left: ${({pullRight:e})=>e?"auto":void 0};
-`,d=s(c)`
+`,p=d.default(u)`
   flex-shrink: 0;
-`,o=({startActions:e,endActions:n})=>e||n?t.jsx(i.Box,{paddingLeft:10,paddingRight:10,children:t.jsx(i.Box,{paddingBottom:4,children:t.jsxs(l.Flex,{justifyContent:"space-between",alignItems:"flex-start",children:[e&&t.jsx(c,{wrap:"wrap",children:e}),n&&t.jsx(d,{pullRight:!0,children:n})]})})}):null;o.defaultProps={endActions:void 0,startActions:void 0};o.propTypes={endActions:r.node,startActions:r.node};exports.ActionLayout=o;
+`,n=({startActions:e,endActions:o})=>e||o?t.jsx(r.Box,{paddingLeft:10,paddingRight:10,children:t.jsx(r.Box,{paddingBottom:4,children:t.jsxs(l.Flex,{justifyContent:"space-between",alignItems:"flex-start",children:[e&&t.jsx(u,{wrap:"wrap",children:e}),o&&t.jsx(p,{pullRight:!0,children:o})]})})}):null;n.defaultProps={endActions:void 0,startActions:void 0};n.propTypes={endActions:s.default.node,startActions:s.default.node};exports.ActionLayout=n;

package/dist/Layout/ContentLayout.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const o=require("prop-types"),n=require("../Box/Box.cjs"),e=({children:t})=>r.jsx(n.Box,{paddingLeft:10,paddingRight:10,children:t});e.propTypes={children:o.node.isRequired};exports.ContentLayout=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const r=require("prop-types"),n=require("../Box/Box.cjs"),u=e=>e&&e.__esModule?e:{default:e},i=u(r),t=({children:e})=>o.jsx(n.Box,{paddingLeft:10,paddingRight:10,children:e});t.propTypes={children:i.default.node.isRequired};exports.ContentLayout=t;

package/dist/Layout/GridLayout.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("prop-types"),t=require("styled-components"),e=t.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("prop-types"),o=require("styled-components"),t=e=>e&&e.__esModule?e:{default:e},s=t(d),i=t(o),r=i.default.div`
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
-  grid-gap: ${({theme:r})=>r.spaces[4]};
-`;e.propTypes={children:i.node.isRequired};exports.GridLayout=e;
+  grid-gap: ${({theme:e})=>e.spaces[4]};
+`;r.propTypes={children:s.default.node.isRequired};exports.GridLayout=r;

package/dist/Layout/HeaderLayout.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),i=require("prop-types"),j=require("styled-components"),v=require("../hooks/useElementOnScreen.cjs"),B=require("../hooks/useResizeObserver.cjs"),d=require("../Box/Box.cjs"),l=require("../Flex/Flex.cjs"),c=require("../Typography/Typography.cjs"),b=()=>{const t=u.useRef(null),[o,n]=u.useState(null),[r,s]=v.useElementOnScreen({root:null,rootMargin:"0px",threshold:0});return B.useResizeObserver(r,()=>{r.current&&n(r.current.getBoundingClientRect())}),u.useEffect(()=>{t.current&&n(t.current.getBoundingClientRect())},[t]),{containerRef:r,isVisible:s,baseHeaderLayoutRef:t,headerSize:o}},p=t=>{const{containerRef:o,isVisible:n,baseHeaderLayoutRef:r,headerSize:s}=b();return e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{height:s?.height},ref:o,children:n&&e.jsx(a,{ref:r,...t})}),!n&&e.jsx(a,{...t,sticky:!0,width:s?.width})]})};p.displayName="HeaderLayout";const R=j(d.Box)`
-  width: ${t=>t.width}px;
-  z-index: ${({theme:t})=>t.zIndices[1]};
-`,a=u.forwardRef(({navigationAction:t,primaryAction:o,secondaryAction:n,subtitle:r,title:s,sticky:g,width:y,...h},f)=>{const x=typeof r=="string";return g?e.jsx(R,{paddingLeft:6,paddingRight:6,paddingTop:3,paddingBottom:3,position:"fixed",top:0,right:0,background:"neutral0",shadow:"tableShadow",width:y,"data-strapi-header-sticky":!0,children:e.jsxs(l.Flex,{justifyContent:"space-between",children:[e.jsxs(l.Flex,{children:[t&&e.jsx(d.Box,{paddingRight:3,children:t}),e.jsxs(d.Box,{children:[e.jsx(c.Typography,{variant:"beta",as:"h1",...h,children:s}),x?e.jsx(c.Typography,{variant:"pi",textColor:"neutral600",children:r}):r]}),n?e.jsx(d.Box,{paddingLeft:4,children:n}):null]}),e.jsx(l.Flex,{children:o?e.jsx(d.Box,{paddingLeft:2,children:o}):void 0})]})}):e.jsxs(d.Box,{ref:f,paddingLeft:10,paddingRight:10,paddingBottom:8,paddingTop:t?6:8,background:"neutral100","data-strapi-header":!0,children:[t?e.jsx(d.Box,{paddingBottom:2,children:t}):null,e.jsxs(l.Flex,{justifyContent:"space-between",children:[e.jsxs(l.Flex,{minWidth:0,children:[e.jsx(c.Typography,{as:"h1",variant:"alpha",...h,children:s}),n?e.jsx(d.Box,{paddingLeft:4,children:n}):null]}),o]}),x?e.jsx(c.Typography,{variant:"epsilon",textColor:"neutral600",as:"p",children:r}):r]})});a.displayName="BaseHeaderLayout";a.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0,sticky:!1,width:void 0};a.propTypes={navigationAction:i.node,primaryAction:i.node,secondaryAction:i.node,sticky:i.bool,subtitle:i.oneOfType([i.string,i.node]),title:i.string.isRequired,width:i.number};p.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0};p.propTypes={navigationAction:i.node,primaryAction:i.node,secondaryAction:i.node,subtitle:i.oneOfType([i.string,i.node]),title:i.string.isRequired};exports.BaseHeaderLayout=a;exports.HeaderLayout=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),c=require("react"),v=require("prop-types"),B=require("styled-components"),R=require("../hooks/useElementOnScreen.cjs"),b=require("../hooks/useResizeObserver.cjs"),r=require("../Box/Box.cjs"),l=require("../Flex/Flex.cjs"),u=require("../Typography/Typography.cjs"),f=e=>e&&e.__esModule?e:{default:e},m=f(c),i=f(v),T=f(B),L=()=>{const e=c.useRef(null),[a,n]=c.useState(null),[d,o]=R.useElementOnScreen({root:null,rootMargin:"0px",threshold:0});return b.useResizeObserver(d,()=>{d.current&&n(d.current.getBoundingClientRect())}),c.useEffect(()=>{e.current&&n(e.current.getBoundingClientRect())},[e]),{containerRef:d,isVisible:o,baseHeaderLayoutRef:e,headerSize:a}},p=e=>{const{containerRef:a,isVisible:n,baseHeaderLayoutRef:d,headerSize:o}=L();return t.jsxs(t.Fragment,{children:[t.jsx("div",{style:{height:o?.height},ref:a,children:n&&t.jsx(s,{ref:d,...e})}),!n&&t.jsx(s,{...e,sticky:!0,width:o?.width})]})};p.displayName="HeaderLayout";const S=T.default(r.Box)`
+  width: ${e=>e.width}px;
+  z-index: ${({theme:e})=>e.zIndices[1]};
+`,s=m.default.forwardRef(({navigationAction:e,primaryAction:a,secondaryAction:n,subtitle:d,title:o,sticky:y,width:g,...h},j)=>{const x=typeof d=="string";return y?t.jsx(S,{paddingLeft:6,paddingRight:6,paddingTop:3,paddingBottom:3,position:"fixed",top:0,right:0,background:"neutral0",shadow:"tableShadow",width:g,"data-strapi-header-sticky":!0,children:t.jsxs(l.Flex,{justifyContent:"space-between",children:[t.jsxs(l.Flex,{children:[e&&t.jsx(r.Box,{paddingRight:3,children:e}),t.jsxs(r.Box,{children:[t.jsx(u.Typography,{variant:"beta",as:"h1",...h,children:o}),x?t.jsx(u.Typography,{variant:"pi",textColor:"neutral600",children:d}):d]}),n?t.jsx(r.Box,{paddingLeft:4,children:n}):null]}),t.jsx(l.Flex,{children:a?t.jsx(r.Box,{paddingLeft:2,children:a}):void 0})]})}):t.jsxs(r.Box,{ref:j,paddingLeft:10,paddingRight:10,paddingBottom:8,paddingTop:e?6:8,background:"neutral100","data-strapi-header":!0,children:[e?t.jsx(r.Box,{paddingBottom:2,children:e}):null,t.jsxs(l.Flex,{justifyContent:"space-between",children:[t.jsxs(l.Flex,{minWidth:0,children:[t.jsx(u.Typography,{as:"h1",variant:"alpha",...h,children:o}),n?t.jsx(r.Box,{paddingLeft:4,children:n}):null]}),a]}),x?t.jsx(u.Typography,{variant:"epsilon",textColor:"neutral600",as:"p",children:d}):d]})});s.displayName="BaseHeaderLayout";s.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0,sticky:!1,width:void 0};s.propTypes={navigationAction:i.default.node,primaryAction:i.default.node,secondaryAction:i.default.node,sticky:i.default.bool,subtitle:i.default.oneOfType([i.default.string,i.default.node]),title:i.default.string.isRequired,width:i.default.number};p.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0};p.propTypes={navigationAction:i.default.node,primaryAction:i.default.node,secondaryAction:i.default.node,subtitle:i.default.oneOfType([i.default.string,i.default.node]),title:i.default.string.isRequired};exports.BaseHeaderLayout=s;exports.HeaderLayout=p;

package/dist/Layout/Layout.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const t=require("prop-types"),i=require("styled-components"),n=require("../Box/Box.cjs"),d=i(n.Box)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime");require("react");const u=require("prop-types"),l=require("styled-components"),d=require("../Box/Box.cjs"),s=e=>e&&e.__esModule?e:{default:e},r=s(u),n=s(l),a=n.default(d.Box)`
   display: grid;
   grid-template-columns: ${({hasSideNav:e})=>e?"auto 1fr":"1fr"};
-`,u=i(n.Box)`
+`,c=n.default(d.Box)`
   overflow-x: hidden;
-`,o=({sideNav:e,children:s})=>r.jsxs(d,{hasSideNav:!!e,children:[e,r.jsx(u,{paddingBottom:10,children:s})]});o.defaultProps={sideNav:void 0};o.propTypes={children:t.node.isRequired,sideNav:t.node};exports.Layout=o;
+`,t=({sideNav:e,children:i})=>o.jsxs(a,{hasSideNav:!!e,children:[e,o.jsx(c,{paddingBottom:10,children:i})]});t.defaultProps={sideNav:void 0};t.propTypes={children:r.default.node.isRequired,sideNav:r.default.node};exports.Layout=t;

package/dist/Layout/TwoColsLayout.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("prop-types"),u=require("../Grid/Grid.cjs"),o=require("../Grid/GridItem.cjs"),s=require("../Box/Box.cjs"),t=({startCol:i,endCol:d})=>e.jsxs(u.Grid,{gap:4,children:[e.jsx(o.GridItem,{col:9,s:12,children:e.jsx(s.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:i})}),e.jsx(o.GridItem,{col:3,s:12,children:e.jsx(s.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:d})})]});t.propTypes={endCol:r.node.isRequired,startCol:r.node.isRequired};exports.TwoColsLayout=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const i=require("prop-types"),a=require("../Grid/Grid.cjs"),o=require("../Grid/GridItem.cjs"),t=require("../Box/Box.cjs"),n=e=>e&&e.__esModule?e:{default:e},s=n(i),d=({startCol:e,endCol:u})=>r.jsxs(a.Grid,{gap:4,children:[r.jsx(o.GridItem,{col:9,s:12,children:r.jsx(t.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:e})}),r.jsx(o.GridItem,{col:3,s:12,children:r.jsx(t.Box,{hasRadius:!0,background:"neutral0",shadow:"tableShadow",children:u})})]});d.propTypes={endCol:s.default.node.isRequired,startCol:s.default.node.isRequired};exports.TwoColsLayout=d;

package/dist/Link/Link.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),g=require("react"),y=require("@strapi/icons"),m=require("react-router-dom"),c=require("styled-components"),x=require("../themes/utils.cjs"),l=require("../Typography/Typography.cjs"),j=require("../Box/Box.cjs");function h(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,t.get?t:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const b=h(g),q=c.a`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),g=require("react"),y=require("@strapi/icons"),m=require("react-router-dom"),x=require("styled-components"),j=require("../themes/utils.cjs"),c=require("../Typography/Typography.cjs"),_=require("../Box/Box.cjs"),h=e=>e&&e.__esModule?e:{default:e};function b(e){if(e&&e.__esModule)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const q=b(g),l=h(x),v=l.default.a`
   display: inline-flex;
   align-items: center;
   text-decoration: none;
@@ -14,7 +14,7 @@
     font-size: ${10/16}rem;
   }
 
-  ${l.Typography} {
+  ${c.Typography} {
     transition: color 150ms ease-out;
     color: currentColor;
   }
@@ -27,7 +27,7 @@
     color: ${({theme:e})=>e.colors.primary700};
   }
 
-  ${x.buttonFocusStyle};
-`,i=c(j.Box)`
+  ${j.buttonFocusStyle};
+`,i=l.default(_.Box)`
   display: flex;
-`,v=b.forwardRef(({children:e,href:r,to:n,disabled:t=!1,startIcon:a,endIcon:s,...u},d)=>{const p=r?"_blank":void 0,f=r?"noreferrer noopener":void 0;return o.jsxs(q,{as:n&&!t?m.NavLink:"a",target:p,rel:f,to:t?void 0:n,href:t?"#":r,disabled:t,ref:d,...u,children:[a&&o.jsx(i,{as:"span","aria-hidden":!0,paddingRight:2,children:a}),o.jsx(l.Typography,{children:e}),s&&!r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:s}),r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:o.jsx(y.ExternalLink,{})})]})});exports.Link=v;
+`,k=q.forwardRef(({children:e,href:r,to:t,disabled:n=!1,startIcon:a,endIcon:s,...u},d)=>{const p=r?"_blank":void 0,f=r?"noreferrer noopener":void 0;return o.jsxs(v,{as:t&&!n?m.NavLink:"a",target:p,rel:f,to:n?void 0:t,href:n?"#":r,disabled:n,ref:d,...u,children:[a&&o.jsx(i,{as:"span","aria-hidden":!0,paddingRight:2,children:a}),o.jsx(c.Typography,{children:e}),s&&!r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:s}),r&&o.jsx(i,{as:"span","aria-hidden":!0,paddingLeft:2,children:o.jsx(y.ExternalLink,{})})]})});exports.Link=k;