@strapi/design-system 0.0.0-599b75fb-test → 0.0.0-622b91ef

package/dist/Alert/Alert.js

@@ -1,118 +1,40 @@
-import { jsx as r, jsxs as a } from "react/jsx-runtime";
-import { Cross as f, CheckCircle as m, ExclamationMarkCircle as u, Information as x } from "@strapi/icons";
-import d from "styled-components";
-import { handleBorderColor as C, handleBackgroundColor as $, handleIconColor as l } from "./utils.js";
-import { Box as t } from "../Box/Box.js";
-import { Flex as b } from "../Flex/Flex.js";
-import { buttonFocusStyle as B } from "../themes/utils.js";
-import { Typography as s } from "../Typography/Typography.js";
-const w = d(t)`
-  flex: 1;
-  flex-wrap: wrap;
-  display: flex;
-  flex-direction: row;
-`, k = d(t)`
-  border: 1px solid ${C};
-  background: ${$};
-  box-shadow: ${({
-  theme: o
-}) => o.shadows.filterShadow};
-`, y = d.button`
-  border: none;
-  background: transparent;
-  font-size: ${12 / 16}rem;
-  svg path {
-    fill: ${({
-  theme: o
-}) => o.colors.neutral700};
-  }
-  margin-top: ${({
-  theme: o
-}) => o.spaces[1]};
-  ${B};
-`, A = d(t)`
-  font-size: ${20 / 16}rem;
-  svg path {
-    fill: ${l};
+import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import { Cross as u, CheckCircle as f, ExclamationMarkCircle as C, Information as x } from "@strapi/icons";
+import a from "styled-components";
+import { handleIconColor as n, handleBackgroundColor as w, handleBorderColor as b } from "./utils.js";
+import { buttonFocusStyle as $ } from "../themes/utils.js";
+import { Box as s } from "../Box/Box.js";
+import { Flex as i } from "../Flex/Flex.js";
+import { Typography as h } from "../Typography/Typography.js";
+const k = a(s)`
+  svg {
+    height: 100%;
+    width: 100%;
+
+    path {
+      fill: ${({ theme: o }) => o.colors.neutral700};
+    }
   }
-`, I = ({
-  variant: o,
-  ...e
-}) => o === "success" ? r(m, {
-  ...e
-}) : o === "danger" || o === "warning" ? r(u, {
-  ...e
-}) : r(x, {
-  ...e
-}), R = d(t)`
-  // Checked with the designers, validated
-  padding-top: 1px;
 
-  & a > span {
-    color: ${l};
+  ${$};
+`, I = a(i)`
+  svg {
+    height: 100%;
+    width: 100%;
 
-    svg path {
-      fill: ${l};
+    path {
+      fill: ${n};
     }
   }
-`, L = ({
-  title: o,
-  children: e,
-  variant: n = "default",
-  onClose: p,
-  closeLabel: c,
-  titleAs: h = "p",
-  action: i,
-  ...g
-}) => r(k, {
-  hasRadius: !0,
-  paddingLeft: 5,
-  paddingRight: 6,
-  paddingTop: 5,
-  variant: n,
-  ...g,
-  children: a(b, {
-    alignItems: "flex-start",
-    children: [r(A, {
-      paddingRight: 3,
-      variant: n,
-      children: r(I, {
-        variant: n,
-        "aria-hidden": !0
-      })
-    }), a(w, {
-      role: n === "danger" ? "alert" : "status",
-      children: [r(t, {
-        paddingBottom: 2,
-        paddingRight: 1,
-        children: r(s, {
-          fontWeight: "bold",
-          textColor: "neutral800",
-          as: h,
-          children: o
-        })
-      }), r(t, {
-        paddingBottom: i ? 2 : 5,
-        paddingRight: 2,
-        children: r(s, {
-          as: "p",
-          textColor: "neutral800",
-          children: e
-        })
-      }), i && r(R, {
-        paddingBottom: 5,
-        variant: n,
-        children: i
-      })]
-    }), r(y, {
-      onClick: p,
-      "aria-label": c,
-      children: r(f, {
-        "aria-hidden": !0
-      })
-    })]
-  })
-});
+`, B = ({ variant: o, ...e }) => o === "success" ? r(f, { ...e }) : o === "danger" || o === "warning" ? r(C, { ...e }) : r(x, { ...e }), y = a(s)`
+  & a > span {
+    color: ${n};
+  }
+
+  svg path {
+    fill: ${n};
+  }
+`, M = ({ title: o, children: e, variant: t = "default", onClose: c, closeLabel: m, titleAs: g = "p", action: l, ...p }) => d(i, { alignItems: "flex-start", background: w(t), borderColor: b(t), boxShadow: "filterShadow", gap: 3, hasRadius: !0, padding: 5, paddingRight: 6, variant: t, ...p, children: [r(I, { height: `${20 / 16}rem`, shrink: 0, variant: t, width: `${20 / 16}rem`, children: r(B, { "aria-hidden": !0, variant: t }) }), d(i, { alignItems: "start", gap: l ? 2 : 1, wrap: "wrap", role: t === "danger" ? "alert" : "status", width: "100%", children: [r(h, { fontWeight: "bold", textColor: "neutral800", as: g, children: o }), r(h, { as: "p", textColor: "neutral800", children: e }), l && r(y, { variant: t, children: l })] }), r(k, { as: "button", background: "transparent", borderColor: void 0, height: `${12 / 16}rem`, marginTop: 1, onClick: c, width: `${12 / 16}rem`, "aria-label": m, children: r(u, { "aria-hidden": !0 }) })] });
 export {
-  L as Alert
+  M as Alert
 };

package/dist/Alert/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Alert.cjs");exports.Alert=e.Alert;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Alert.cjs");exports.Alert=e.Alert;

package/dist/Alert/utils.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=({theme:r,variant:o})=>o==="danger"?r.colors.danger100:o==="success"?r.colors.success100:o==="warning"?r.colors.warning100:r.colors.primary100,s=({theme:r,variant:o})=>o==="danger"?r.colors.danger200:o==="success"?r.colors.success200:o==="warning"?r.colors.warning200:r.colors.primary200,c=({theme:r,variant:o})=>o==="danger"?r.colors.danger700:o==="success"?r.colors.success700:o==="warning"?r.colors.warning700:r.colors.primary700;exports.handleBackgroundColor=n;exports.handleBorderColor=s;exports.handleIconColor=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=r=>{switch(r){case"danger":return"danger100";case"success":return"success100";case"warning":return"warning100";default:return"primary100"}},e=r=>o(r).replace("100","200"),c=({theme:r,variant:n})=>n==="danger"?r.colors.danger700:n==="success"?r.colors.success700:n==="warning"?r.colors.warning700:r.colors.primary700;exports.handleBackgroundColor=o;exports.handleBorderColor=e;exports.handleIconColor=c;

package/dist/Alert/utils.js

@@ -1,6 +1,17 @@
-const s = ({ theme: r, variant: o }) => o === "danger" ? r.colors.danger100 : o === "success" ? r.colors.success100 : o === "warning" ? r.colors.warning100 : r.colors.primary100, n = ({ theme: r, variant: o }) => o === "danger" ? r.colors.danger200 : o === "success" ? r.colors.success200 : o === "warning" ? r.colors.warning200 : r.colors.primary200, c = ({ theme: r, variant: o }) => o === "danger" ? r.colors.danger700 : o === "success" ? r.colors.success700 : o === "warning" ? r.colors.warning700 : r.colors.primary700;
+const s = (r) => {
+  switch (r) {
+    case "danger":
+      return "danger100";
+    case "success":
+      return "success100";
+    case "warning":
+      return "warning100";
+    default:
+      return "primary100";
+  }
+}, c = (r) => s(r).replace("100", "200"), e = ({ theme: r, variant: n }) => n === "danger" ? r.colors.danger700 : n === "success" ? r.colors.success700 : n === "warning" ? r.colors.warning700 : r.colors.primary700;
 export {
   s as handleBackgroundColor,
-  n as handleBorderColor,
-  c as handleIconColor
+  c as handleBorderColor,
+  e as handleIconColor
 };

package/dist/Avatar/Avatar.cjs

@@ -1,18 +1,18 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),u=require("react"),d=require("styled-components"),t=require("./constants.cjs"),l=require("../Box/Box.cjs"),p=require("../Flex/Flex.cjs"),x=require("../Typography/Typography.cjs"),f=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function g(e){if(e&&e.__esModule)return e;const a=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(a,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return a.default=e,Object.freeze(a)}const h=g(u),n=f(d),v=n.default.img`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),c=require("react"),d=require("styled-components"),t=require("./constants.cjs"),u=require("../Box/Box.cjs"),p=require("../Flex/Flex.cjs"),f=require("../Typography/Typography.cjs"),x=e=>e&&e.__esModule?e:{default:e};function h(e){if(e&&e.__esModule)return e;const a=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(a,r,n.get?n:{enumerable:!0,get:()=>e[r]})}}return a.default=e,Object.freeze(a)}const g=h(c),o=x(d),v=o.default.img`
   border-radius: 50%;
   object-fit: cover;
   display: block;
   position: relative;
-`,b=n.default.img`
+`,b=o.default.img`
   border-radius: 50%;
   object-fit: cover;
   position: absolute;
   transform: translate(-${(t.previewSize-t.avatarSize)/2}px, -100%);
   margin-top: -${({theme:e})=>e.spaces[1]};
-`,y=n.default(l.Box)`
+`,S=o.default(u.Box)`
   opacity: 0.4;
-`,j=({src:e,alt:a,preview:r})=>{const[o,c]=h.useState(!1),s=Boolean(r&&o);return i.jsxs("span",{children:[s?i.jsx(b,{"aria-hidden":!0,alt:"",width:`${t.previewSize}px`,height:`${t.previewSize}px`,src:r===!0?e:typeof r=="string"?r:""}):null,i.jsxs(l.Box,{zIndex:s?1:void 0,position:"relative",onMouseEnter:()=>c(!0),onMouseLeave:()=>c(!1),width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,children:[s?i.jsx(y,{background:"neutral0",borderRadius:"50%",position:"absolute",width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,zIndex:1}):null,i.jsx(v,{src:e,alt:a,width:`${t.avatarSize}px`,height:`${t.avatarSize}px`})]})]})},S=n.default(p.Flex)`
+`,y=({src:e,alt:a,preview:r})=>{const[n,l]=g.useState(!1),s=!!(r&&n);return i.jsxs("span",{children:[s?i.jsx(b,{"aria-hidden":!0,alt:"",width:`${t.previewSize}px`,height:`${t.previewSize}px`,src:r===!0?e:typeof r=="string"?r:""}):null,i.jsxs(u.Box,{zIndex:s?1:void 0,position:"relative",onMouseEnter:()=>l(!0),onMouseLeave:()=>l(!1),width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,children:[s?i.jsx(S,{background:"neutral0",borderRadius:"50%",position:"absolute",width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,zIndex:1}):null,i.jsx(v,{src:e,alt:a,width:`${t.avatarSize}px`,height:`${t.avatarSize}px`})]})]})},j=o.default(p.Flex)`
   span {
     line-height: 0;
   }
-`,z=({children:e,background:a="primary600",textColor:r="buttonNeutral0"})=>i.jsx(S,{background:a,borderRadius:"50%",width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,justifyContent:"center",children:i.jsx(x.Typography,{fontSize:0,fontWeight:"bold",textColor:r,textTransform:"uppercase",children:e})});exports.Avatar=j;exports.Initials=z;
+`,z=({children:e,background:a="primary600",textColor:r="buttonNeutral0"})=>i.jsx(j,{background:a,borderRadius:"50%",width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,justifyContent:"center",children:i.jsx(f.Typography,{fontSize:0,fontWeight:"bold",textColor:r,textTransform:"uppercase",children:e})});exports.Avatar=y;exports.Initials=z;

package/dist/Avatar/Avatar.js

@@ -15,68 +15,24 @@ const x = o.img`
   object-fit: cover;
   position: absolute;
   transform: translate(-${(s - t) / 2}px, -100%);
-  margin-top: -${({
-  theme: e
-}) => e.spaces[1]};
+  margin-top: -${({ theme: e }) => e.spaces[1]};
 `, g = o(d)`
   opacity: 0.4;
-`, I = ({
-  src: e,
-  alt: n,
-  preview: r
-}) => {
-  const [c, p] = h.useState(!1), a = Boolean(r && c);
-  return l("span", {
-    children: [a ? i(f, {
-      "aria-hidden": !0,
-      alt: "",
-      width: `${s}px`,
-      height: `${s}px`,
-      src: r === !0 ? e : typeof r == "string" ? r : ""
-    }) : null, l(d, {
-      zIndex: a ? 1 : void 0,
-      position: "relative",
-      onMouseEnter: () => p(!0),
-      onMouseLeave: () => p(!1),
-      width: `${t}px`,
-      height: `${t}px`,
-      children: [a ? i(g, {
-        background: "neutral0",
-        borderRadius: "50%",
-        position: "absolute",
-        width: `${t}px`,
-        height: `${t}px`,
-        zIndex: 1
-      }) : null, i(x, {
-        src: e,
-        alt: n,
-        width: `${t}px`,
-        height: `${t}px`
-      })]
-    })]
-  });
+`, I = ({ src: e, alt: n, preview: r }) => {
+  const [c, p] = h.useState(!1), a = !!(r && c);
+  return l("span", { children: [a ? i(f, {
+    "aria-hidden": !0,
+    alt: "",
+    width: `${s}px`,
+    height: `${s}px`,
+    // eslint-disable-next-line no-nested-ternary
+    src: r === !0 ? e : typeof r == "string" ? r : ""
+  }) : null, l(d, { zIndex: a ? 1 : void 0, position: "relative", onMouseEnter: () => p(!0), onMouseLeave: () => p(!1), width: `${t}px`, height: `${t}px`, children: [a ? i(g, { background: "neutral0", borderRadius: "50%", position: "absolute", width: `${t}px`, height: `${t}px`, zIndex: 1 }) : null, i(x, { src: e, alt: n, width: `${t}px`, height: `${t}px` })] })] });
 }, b = o(u)`
   span {
     line-height: 0;
   }
-`, S = ({
-  children: e,
-  background: n = "primary600",
-  textColor: r = "buttonNeutral0"
-}) => i(b, {
-  background: n,
-  borderRadius: "50%",
-  width: `${t}px`,
-  height: `${t}px`,
-  justifyContent: "center",
-  children: i(m, {
-    fontSize: 0,
-    fontWeight: "bold",
-    textColor: r,
-    textTransform: "uppercase",
-    children: e
-  })
-});
+`, S = ({ children: e, background: n = "primary600", textColor: r = "buttonNeutral0" }) => i(b, { background: n, borderRadius: "50%", width: `${t}px`, height: `${t}px`, justifyContent: "center", children: i(m, { fontSize: 0, fontWeight: "bold", textColor: r, textTransform: "uppercase", children: e }) });
 export {
   I as Avatar,
   S as Initials

package/dist/Avatar/AvatarGroup.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("styled-components"),o=require("./constants.cjs"),s=require("../Flex/Flex.cjs"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=a(t),r=l.default(s.Flex)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),r=require("./constants.cjs"),a=require("../Flex/Flex.cjs"),o=t=>t&&t.__esModule?t:{default:t},l=o(e),s=l.default(a.Flex)`
   & > * + * {
-    margin-left: -${o.avatarSize/2}px;
+    margin-left: -${r.avatarSize/2}px;
   }
-`;exports.AvatarGroup=r;
+`;exports.AvatarGroup=s;

package/dist/Avatar/constants.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=32,t=64;exports.avatarSize=e;exports.previewSize=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=32,t=64;exports.avatarSize=e;exports.previewSize=t;

package/dist/Avatar/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("./Avatar.cjs"),r=require("./AvatarGroup.cjs");exports.Avatar=a.Avatar;exports.Initials=a.Initials;exports.AvatarGroup=r.AvatarGroup;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./Avatar.cjs"),a=require("./AvatarGroup.cjs");exports.Avatar=r.Avatar;exports.Initials=r.Initials;exports.AvatarGroup=a.AvatarGroup;

package/dist/Badge/Badge.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),l=require("styled-components"),u=require("../Flex/Flex.cjs"),c=require("../Typography/Typography.cjs"),g=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},p=g(l),y=p.default(u.Flex)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),u=require("styled-components"),l=require("../Flex/Flex.cjs"),c=require("../Typography/Typography.cjs"),g=e=>e&&e.__esModule?e:{default:e},p=g(u),y=p.default(l.Flex)`
   border-radius: ${({theme:e,size:t})=>t==="S"?"2px":e.borderRadius};
   height: ${({size:e,theme:t})=>t.sizes.badge[e]};
-`,f=({active:e=!1,size:t="M",textColor:a="neutral600",backgroundColor:i="neutral150",children:s,minWidth:o=5,...d})=>{const r=t==="S"?1:2;return n.jsx(y,{inline:!0,alignItem:"center",justifyContent:"center",minWidth:o,paddingLeft:r,paddingRight:r,background:e?"primary200":i,size:t,...d,children:n.jsx(c.Typography,{variant:"sigma",textColor:e?"primary600":a,children:s})})};exports.Badge=f;
+`,f=({active:e=!1,size:t="M",textColor:i="neutral600",backgroundColor:a="neutral150",children:d,minWidth:s=5,...o})=>{const r=t==="S"?1:2;return n.jsx(y,{inline:!0,alignItem:"center",justifyContent:"center",minWidth:s,paddingLeft:r,paddingRight:r,background:e?"primary200":a,size:t,...o,children:n.jsx(c.Typography,{variant:"sigma",textColor:e?"primary600":i,children:d})})};exports.Badge=f;

package/dist/Badge/Badge.js

@@ -3,40 +3,11 @@ import p from "styled-components";
 import { Flex as s } from "../Flex/Flex.js";
 import { Typography as g } from "../Typography/Typography.js";
 const l = p(s)`
-  border-radius: ${({
-  theme: r,
-  size: e
-}) => e === "S" ? "2px" : r.borderRadius};
-  height: ${({
-  size: r,
-  theme: e
-}) => e.sizes.badge[r]};
-`, y = ({
-  active: r = !1,
-  size: e = "M",
-  textColor: n = "neutral600",
-  backgroundColor: o = "neutral150",
-  children: a,
-  minWidth: d = 5,
-  ...m
-}) => {
+  border-radius: ${({ theme: r, size: e }) => e === "S" ? "2px" : r.borderRadius};
+  height: ${({ size: r, theme: e }) => e.sizes.badge[r]};
+`, y = ({ active: r = !1, size: e = "M", textColor: n = "neutral600", backgroundColor: o = "neutral150", children: a, minWidth: d = 5, ...m }) => {
   const t = e === "S" ? 1 : 2;
-  return i(l, {
-    inline: !0,
-    alignItem: "center",
-    justifyContent: "center",
-    minWidth: d,
-    paddingLeft: t,
-    paddingRight: t,
-    background: r ? "primary200" : o,
-    size: e,
-    ...m,
-    children: i(g, {
-      variant: "sigma",
-      textColor: r ? "primary600" : n,
-      children: a
-    })
-  });
+  return i(l, { inline: !0, alignItem: "center", justifyContent: "center", minWidth: d, paddingLeft: t, paddingRight: t, background: r ? "primary200" : o, size: e, ...m, children: i(g, { variant: "sigma", textColor: r ? "primary600" : n, children: a }) });
 };
 export {
   y as Badge

package/dist/Badge/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Badge.cjs");exports.Badge=e.Badge;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Badge.cjs");exports.Badge=e.Badge;

package/dist/BaseButton/BaseButton.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),l=require("react"),c=require("styled-components"),i=require("../Flex/Flex.cjs"),d=require("../themes/utils.cjs"),t=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},p=t(l),f=t(c),s=f.default(i.Flex)`
-  svg {
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),l=require("react"),c=require("styled-components"),i=require("../themes/utils.cjs"),d=require("../Flex/Flex.cjs"),p=e=>e&&e.__esModule?e:{default:e};function f(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 b=f(l),g=p(c),o=g.default(d.Flex)`
+  > svg {
     height: ${({theme:e})=>e.spaces[3]};
     width: ${({theme:e})=>e.spaces[3]};
 
@@ -13,5 +13,5 @@
     pointer-events: none;
   }
 
-  ${d.buttonFocusStyle}
-`,r=p.default.forwardRef(({disabled:e,children:a,...o},u)=>n.jsx(s,{ref:u,"aria-disabled":e,as:"button",type:"button",disabled:e,padding:2,hasRadius:!0,background:"neutral0",borderColor:"neutral200",cursor:"pointer",...o,children:a}));r.displayName="BaseButton";exports.BaseButton=r;exports.BaseButtonWrapper=s;
+  ${i.buttonFocusStyle}
+`,a=b.forwardRef(({disabled:e,children:r,background:t="neutral0",...n},s)=>u.jsx(o,{ref:s,"aria-disabled":e,as:"button",type:"button",disabled:e,padding:2,hasRadius:!0,background:t,borderColor:"neutral200",cursor:"pointer",...n,children:r}));a.displayName="BaseButton";exports.BaseButton=a;exports.BaseButtonWrapper=o;

package/dist/BaseButton/BaseButton.js

@@ -1,22 +1,16 @@
-import { jsx as a } from "react/jsx-runtime";
-import s from "react";
-import n from "styled-components";
-import { Flex as i } from "../Flex/Flex.js";
-import { buttonFocusStyle as u } from "../themes/utils.js";
-const p = n(i)`
-  svg {
-    height: ${({
-  theme: t
-}) => t.spaces[3]};
-    width: ${({
-  theme: t
-}) => t.spaces[3]};
+import { jsx as s } from "react/jsx-runtime";
+import * as n from "react";
+import i from "styled-components";
+import { buttonFocusStyle as p } from "../themes/utils.js";
+import { Flex as u } from "../Flex/Flex.js";
+const d = i(u)`
+  > svg {
+    height: ${({ theme: t }) => t.spaces[3]};
+    width: ${({ theme: t }) => t.spaces[3]};
 
     > g,
     path {
-      fill: ${({
-  theme: t
-}) => t.colors.neutral0};
+      fill: ${({ theme: t }) => t.colors.neutral0};
     }
   }
 
@@ -24,27 +18,10 @@ const p = n(i)`
     pointer-events: none;
   }
 
-  ${u}
-`, d = s.forwardRef(({
-  disabled: t,
-  children: r,
-  ...e
-}, o) => a(p, {
-  ref: o,
-  "aria-disabled": t,
-  as: "button",
-  type: "button",
-  disabled: t,
-  padding: 2,
-  hasRadius: !0,
-  background: "neutral0",
-  borderColor: "neutral200",
-  cursor: "pointer",
-  ...e,
-  children: r
-}));
-d.displayName = "BaseButton";
+  ${p}
+`, l = n.forwardRef(({ disabled: t, children: r, background: e = "neutral0", ...o }, a) => s(d, { ref: a, "aria-disabled": t, as: "button", type: "button", disabled: t, padding: 2, hasRadius: !0, background: e, borderColor: "neutral200", cursor: "pointer", ...o, children: r }));
+l.displayName = "BaseButton";
 export {
-  d as BaseButton,
-  p as BaseButtonWrapper
+  l as BaseButton,
+  d as BaseButtonWrapper
 };

package/dist/BaseButton/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./BaseButton.cjs");exports.BaseButton=e.BaseButton;exports.BaseButtonWrapper=e.BaseButtonWrapper;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./BaseButton.cjs");exports.BaseButton=t.BaseButton;exports.BaseButtonWrapper=t.BaseButtonWrapper;

package/dist/BaseCheckbox/BaseCheckbox.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),b=require("react"),p=require("styled-components"),f=require("./assets/checkmark-black.cjs"),k=require("./assets/checkmark.cjs"),s=require("./utils.cjs"),h=require("../Box/Box.cjs"),x=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function g(e){if(e&&e.__esModule)return e;const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const l=g(b),m=x(p),y=m.default.input`
-  height: ${s.getCheckboxSize};
-  min-width: ${s.getCheckboxSize};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),b=require("react"),p=require("styled-components"),f=require("./assets/checkmark-black.svg.cjs"),k=require("./assets/checkmark.svg.cjs"),l=require("./utils.cjs"),h=require("../Box/Box.cjs"),g=e=>e&&e.__esModule?e:{default:e};function x(e){if(e&&e.__esModule)return e;const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const s=x(b),m=g(p),$=m.default.input`
+  height: ${l.getCheckboxSize};
+  min-width: ${l.getCheckboxSize};
   margin: 0;
   border-radius: ${({theme:e})=>e.borderRadius};
   border: 1px solid ${({theme:e})=>e.colors.neutral300};
@@ -59,4 +59,4 @@
       }
     }
   }
-`,i=({indeterminate:e=!1,size:o="M",name:r,value:t=!1,onValueChange:a,...u})=>{const c=l.useRef(null);l.useEffect(()=>{c.current&&e?c.current.indeterminate=e:c.current.indeterminate=!1},[e]);const d=()=>{a&&a(!t)};return n.jsx(h.Box,{children:n.jsx(y,{size:o,checked:t,onChange:d,type:"checkbox",ref:c,name:r,...u})})};i.displayName="BaseCheckbox";exports.BaseCheckbox=i;
+`,i=({indeterminate:e=!1,size:o="M",name:r,value:t=!1,onValueChange:n,...u})=>{const c=s.useRef(null);s.useEffect(()=>{c.current&&e?c.current.indeterminate=e:c.current.indeterminate=!1},[e]);const d=()=>{n&&n(!t)};return a.jsx(h.Box,{children:a.jsx($,{size:o,checked:t,onChange:d,type:"checkbox",ref:c,name:r,...u})})};i.displayName="BaseCheckbox";exports.BaseCheckbox=i;

package/dist/BaseCheckbox/BaseCheckbox.js

@@ -1,33 +1,23 @@
 import { jsx as a } from "react/jsx-runtime";
 import * as c from "react";
 import d from "styled-components";
-import p from "./assets/checkmark-black.js";
-import u from "./assets/checkmark.js";
+import p from "./assets/checkmark-black.svg.js";
+import u from "./assets/checkmark.svg.js";
 import { getCheckboxSize as n } from "./utils.js";
 import { Box as b } from "../Box/Box.js";
 const m = d.input`
   height: ${n};
   min-width: ${n};
   margin: 0;
-  border-radius: ${({
-  theme: r
-}) => r.borderRadius};
-  border: 1px solid ${({
-  theme: r
-}) => r.colors.neutral300};
+  border-radius: ${({ theme: r }) => r.borderRadius};
+  border: 1px solid ${({ theme: r }) => r.colors.neutral300};
   -webkit-appearance: none;
-  background-color: ${({
-  theme: r
-}) => r.colors.neutral0};
+  background-color: ${({ theme: r }) => r.colors.neutral0};
   cursor: pointer;
 
   &:checked {
-    background-color: ${({
-  theme: r
-}) => r.colors.primary600};
-    border: 1px solid ${({
-  theme: r
-}) => r.colors.primary600};
+    background-color: ${({ theme: r }) => r.colors.primary600};
+    border: 1px solid ${({ theme: r }) => r.colors.primary600};
 
     &:after {
       content: '';
@@ -47,21 +37,13 @@ const m = d.input`
   }
 
   &:disabled {
-    background-color: ${({
-  theme: r
-}) => r.colors.neutral200};
-    border: 1px solid ${({
-  theme: r
-}) => r.colors.neutral300};
+    background-color: ${({ theme: r }) => r.colors.neutral200};
+    border: 1px solid ${({ theme: r }) => r.colors.neutral300};
   }
 
   &:indeterminate {
-    background-color: ${({
-  theme: r
-}) => r.colors.primary600};
-    border: 1px solid ${({
-  theme: r
-}) => r.colors.primary600};
+    background-color: ${({ theme: r }) => r.colors.primary600};
+    border: 1px solid ${({ theme: r }) => r.colors.primary600};
 
     &:after {
       content: '';
@@ -70,52 +52,27 @@ const m = d.input`
       color: white;
       height: 2px;
       width: 10px;
-      background-color: ${({
-  theme: r
-}) => r.colors.neutral0};
+      background-color: ${({ theme: r }) => r.colors.neutral0};
       left: 50%;
       top: 50%;
       transform: translateX(-50%) translateY(-50%);
     }
 
     &:disabled {
-      background-color: ${({
-  theme: r
-}) => r.colors.neutral200};
-      border: 1px solid ${({
-  theme: r
-}) => r.colors.neutral300};
+      background-color: ${({ theme: r }) => r.colors.neutral200};
+      border: 1px solid ${({ theme: r }) => r.colors.neutral300};
       &:after {
-        background-color: ${({
-  theme: r
-}) => r.colors.neutral500};
+        background-color: ${({ theme: r }) => r.colors.neutral500};
       }
     }
   }
-`, f = ({
-  indeterminate: r = !1,
-  size: l = "M",
-  name: s,
-  value: e = !1,
-  onValueChange: t,
-  ...i
-}) => {
+`, f = ({ indeterminate: r = !1, size: l = "M", name: s, value: e = !1, onValueChange: t, ...i }) => {
   const o = c.useRef(null);
   return c.useEffect(() => {
     o.current && r ? o.current.indeterminate = r : o.current.indeterminate = !1;
-  }, [r]), a(b, {
-    children: a(m, {
-      size: l,
-      checked: e,
-      onChange: () => {
-        t && t(!e);
-      },
-      type: "checkbox",
-      ref: o,
-      name: s,
-      ...i
-    })
-  });
+  }, [r]), a(b, { children: a(m, { size: l, checked: e, onChange: () => {
+    t && t(!e);
+  }, type: "checkbox", ref: o, name: s, ...i }) });
 };
 f.displayName = "BaseCheckbox";
 export {

package/dist/BaseCheckbox/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./BaseCheckbox.cjs");exports.BaseCheckbox=e.BaseCheckbox;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./BaseCheckbox.cjs");exports.BaseCheckbox=e.BaseCheckbox;

package/dist/BaseCheckbox/utils.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=({size:e})=>e==="M"?"18px":"20px";exports.getCheckboxSize=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=({size:e})=>e==="M"?"18px":"20px";exports.getCheckboxSize=t;

package/dist/BaseLink/BaseLink.cjs

@@ -1,3 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react/jsx-runtime"),f=require("react"),i=require("styled-components"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=a(f),_=a(i),p=_.default.a`
-  cursor: pointer;
-`,n=d.default.forwardRef(({href:e,rel:s="noreferrer noopener",target:o="_self",disabled:t=!1,isExternal:r=!1,...u},l)=>c.jsx(p,{ref:l,target:r?"_blank":o,rel:r?s:void 0,href:t?"#":e,"aria-disabled":t,...u}));n.displayName="BaseLink";exports.BaseLink=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react/jsx-runtime"),i=require("react"),l=require("../Box/Box.cjs"),c=e=>e&&e.__esModule?e:{default:e},d=c(i),a=d.default.forwardRef(({href:e,rel:n="noreferrer noopener",target:o="_self",disabled:r=!1,isExternal:t=!1,...s},u)=>f.jsx(l.Box,{as:"a",ref:u,target:t?"_blank":o,rel:t?n:void 0,href:r?"#":e,"aria-disabled":r,cursor:"pointer",...s}));a.displayName="BaseLink";exports.BaseLink=a;