@strapi/design-system 0.0.0-jsoninput.0

package/dist/Alert/Alert.js

@@ -0,0 +1,130 @@
+var y = Object.defineProperty;
+var s = Object.getOwnPropertySymbols;
+var h = Object.prototype.hasOwnProperty, E = Object.prototype.propertyIsEnumerable;
+var u = (e, r, t) => r in e ? y(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, l = (e, r) => {
+  for (var t in r || (r = {}))
+    h.call(r, t) && u(e, t, r[t]);
+  if (s)
+    for (var t of s(r))
+      E.call(r, t) && u(e, t, r[t]);
+  return e;
+};
+var m = (e, r) => {
+  var t = {};
+  for (var n in e)
+    h.call(e, n) && r.indexOf(n) < 0 && (t[n] = e[n]);
+  if (e != null && s)
+    for (var n of s(e))
+      r.indexOf(n) < 0 && E.call(e, n) && (t[n] = e[n]);
+  return t;
+};
+import o from "react";
+import a from "prop-types";
+import d from "styled-components";
+import w from "@strapi/icons/Information";
+import B from "@strapi/icons/CheckCircle";
+import A from "@strapi/icons/ExclamationMarkCircle";
+import k from "@strapi/icons/Cross";
+import { Box as i } from "../Box/Box.js";
+import { Typography as x } from "../Typography/Typography.js";
+import { Flex as T } from "../Flex/Flex.js";
+import { handleBorderColor as q, handleBackgroundColor as I, handleIconColor as c } from "./utils.js";
+import { buttonFocusStyle as v } from "../themes/utils.js";
+const W = d(i)`
+  flex: 1;
+  flex-wrap: wrap;
+  display: flex;
+  flex-direction: row;
+`, z = d(i)`
+  border: 1px solid ${q};
+  background: ${I};
+  box-shadow: ${({ theme: e }) => e.shadows.filterShadow};
+`, F = d.button`
+  border: none;
+  background: transparent;
+  font-size: ${12 / 16}rem;
+  svg path {
+    fill: ${({ theme: e }) => e.colors.neutral700};
+  }
+  margin-top: ${({ theme: e }) => e.spaces[1]};
+  ${v};
+`, L = d(i)`
+  font-size: ${20 / 16}rem;
+  svg path {
+    fill: ${c};
+  }
+`, C = (t) => {
+  var n = t, { variant: e } = n, r = m(n, ["variant"]);
+  return e === "success" ? /* @__PURE__ */ o.createElement(B, l({}, r)) : e === "danger" || e === "warning" ? /* @__PURE__ */ o.createElement(A, l({}, r)) : /* @__PURE__ */ o.createElement(w, l({}, r));
+}, P = d(i)`
+  // Checked with the designers, validated
+  padding-top: 1px;
+
+  & a > span {
+    color: ${c};
+
+    svg path {
+      fill: ${c};
+    }
+  }
+`, f = (S) => {
+  var g = S, { title: e, children: r, variant: t, onClose: n, closeLabel: R, titleAs: $, action: p } = g, b = m(g, ["title", "children", "variant", "onClose", "closeLabel", "titleAs", "action"]);
+  return /* @__PURE__ */ o.createElement(z, l({
+    hasRadius: !0,
+    paddingLeft: 5,
+    paddingRight: 6,
+    paddingTop: 5,
+    variant: t
+  }, b), /* @__PURE__ */ o.createElement(T, {
+    alignItems: "flex-start"
+  }, /* @__PURE__ */ o.createElement(L, {
+    paddingRight: 3,
+    variant: t
+  }, /* @__PURE__ */ o.createElement(C, {
+    variant: t,
+    "aria-hidden": !0
+  })), /* @__PURE__ */ o.createElement(W, {
+    role: t === "danger" ? "alert" : "status"
+  }, /* @__PURE__ */ o.createElement(i, {
+    paddingBottom: 2,
+    paddingRight: 1
+  }, /* @__PURE__ */ o.createElement(x, {
+    fontWeight: "bold",
+    textColor: "neutral800",
+    as: $
+  }, e)), /* @__PURE__ */ o.createElement(i, {
+    paddingBottom: p ? 2 : 5,
+    paddingRight: 2
+  }, /* @__PURE__ */ o.createElement(x, {
+    as: "p",
+    textColor: "neutral800"
+  }, r)), p && /* @__PURE__ */ o.createElement(P, {
+    paddingBottom: 5,
+    variant: t
+  }, p)), /* @__PURE__ */ o.createElement(F, {
+    onClick: n,
+    "aria-label": R
+  }, /* @__PURE__ */ o.createElement(k, {
+    "aria-hidden": !0
+  }))));
+};
+f.defaultProps = {
+  action: void 0,
+  variant: "default",
+  titleAs: "p"
+};
+f.propTypes = {
+  action: a.element,
+  children: a.node.isRequired,
+  closeLabel: a.string.isRequired,
+  onClose: a.func.isRequired,
+  title: a.string.isRequired,
+  titleAs: a.string,
+  variant: a.oneOf(["danger", "success", "default", "warning"])
+};
+C.propTypes = {
+  variant: f.propTypes.variant.isRequired
+};
+export {
+  f as Alert
+};

package/dist/Alert/index.cjs

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

package/dist/Alert/index.js

@@ -0,0 +1,4 @@
+import { Alert as o } from "./Alert.js";
+export {
+  o as Alert
+};

package/dist/Alert/utils.cjs

@@ -0,0 +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;

package/dist/Alert/utils.js

@@ -0,0 +1,6 @@
+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;
+export {
+  s as handleBackgroundColor,
+  n as handleBorderColor,
+  c as handleIconColor
+};

package/dist/Avatar/Avatar.cjs

@@ -0,0 +1,29 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),f=require("styled-components"),v=require("prop-types"),t=require("./constants.cjs"),g=require("../Typography/Typography.cjs"),h=require("../Flex/Flex.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=s(c),o=s(f),a=s(v),y=o.default.img`
+  border-radius: 50%;
+  object-fit: cover;
+  display: block;
+  position: relative;
+`,m=o.default.div`
+  position: relative;
+  width: ${t.avatarSize/16}rem;
+  height: ${t.avatarSize/16}rem;
+  z-index: ${({hovering:e})=>e?1:void 0};
+`,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]};
+`,x=o.default.div`
+  z-index: 1;
+  border-radius: 30%;
+  position: absolute;
+  width: ${t.avatarSize/16}rem;
+  height: ${t.avatarSize/16}rem;
+  background: ${({theme:e})=>e.colors.neutral0};
+  opacity: 0.4;
+`,u=({src:e,alt:l,preview:r})=>{const[n,p]=c.useState(!1);return i.default.createElement("span",null,r&&n?i.default.createElement(b,{"aria-hidden":!0,alt:"",width:`${t.previewSize}px`,height:`${t.previewSize}px`,src:r===!0?e:r}):null,i.default.createElement(m,{hovering:r&&n,onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1)},r&&n?i.default.createElement(x,null):null,i.default.createElement(y,{src:e,alt:l,width:`${t.avatarSize}px`,height:`${t.avatarSize}px`})))},S=o.default(h.Flex)`
+  span {
+    line-height: 0;
+  }
+`,d=({children:e,background:l,textColor:r})=>i.default.createElement(S,{background:l,borderRadius:"50%",width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,justifyContent:"center"},i.default.createElement(g.Typography,{fontSize:0,fontWeight:"bold",textColor:r,textTransform:"uppercase"},e));d.defaultProps={background:"primary600",textColor:"buttonNeutral0"};d.propTypes={background:a.default.string,children:a.default.node.isRequired,textColor:a.default.string};u.defaultProps={alt:void 0,preview:void 0};u.propTypes={alt:a.default.string,preview:a.default.oneOfType([a.default.string,a.default.bool]),src:a.default.string.isRequired};exports.Avatar=u;exports.Initials=d;

package/dist/Avatar/Avatar.js

@@ -0,0 +1,86 @@
+import i, { useState as m } from "react";
+import a from "styled-components";
+import r from "prop-types";
+import { avatarSize as t, previewSize as l } from "./constants.js";
+import { Typography as u } from "../Typography/Typography.js";
+import { Flex as g } from "../Flex/Flex.js";
+const h = a.img`
+  border-radius: 50%;
+  object-fit: cover;
+  display: block;
+  position: relative;
+`, f = a.div`
+  position: relative;
+  width: ${t / 16}rem;
+  height: ${t / 16}rem;
+  z-index: ${({ hovering: e }) => e ? 1 : void 0};
+`, v = a.img`
+  border-radius: 50%;
+  object-fit: cover;
+  position: absolute;
+  transform: translate(-${(l - t) / 2}px, -100%);
+  margin-top: -${({ theme: e }) => e.spaces[1]};
+`, b = a.div`
+  z-index: 1;
+  border-radius: 30%;
+  position: absolute;
+  width: ${t / 16}rem;
+  height: ${t / 16}rem;
+  background: ${({ theme: e }) => e.colors.neutral0};
+  opacity: 0.4;
+`, d = ({ src: e, alt: n, preview: o }) => {
+  const [s, p] = m(!1);
+  return /* @__PURE__ */ i.createElement("span", null, o && s ? /* @__PURE__ */ i.createElement(v, {
+    "aria-hidden": !0,
+    alt: "",
+    width: `${l}px`,
+    height: `${l}px`,
+    src: o === !0 ? e : o
+  }) : null, /* @__PURE__ */ i.createElement(f, {
+    hovering: o && s,
+    onMouseEnter: () => p(!0),
+    onMouseLeave: () => p(!1)
+  }, o && s ? /* @__PURE__ */ i.createElement(b, null) : null, /* @__PURE__ */ i.createElement(h, {
+    src: e,
+    alt: n,
+    width: `${t}px`,
+    height: `${t}px`
+  })));
+}, x = a(g)`
+  span {
+    line-height: 0;
+  }
+`, c = ({ children: e, background: n, textColor: o }) => /* @__PURE__ */ i.createElement(x, {
+  background: n,
+  borderRadius: "50%",
+  width: `${t}px`,
+  height: `${t}px`,
+  justifyContent: "center"
+}, /* @__PURE__ */ i.createElement(u, {
+  fontSize: 0,
+  fontWeight: "bold",
+  textColor: o,
+  textTransform: "uppercase"
+}, e));
+c.defaultProps = {
+  background: "primary600",
+  textColor: "buttonNeutral0"
+};
+c.propTypes = {
+  background: r.string,
+  children: r.node.isRequired,
+  textColor: r.string
+};
+d.defaultProps = {
+  alt: void 0,
+  preview: void 0
+};
+d.propTypes = {
+  alt: r.string,
+  preview: r.oneOfType([r.string, r.bool]),
+  src: r.string.isRequired
+};
+export {
+  d as Avatar,
+  c as Initials
+};

package/dist/Avatar/AvatarGroup.cjs

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

package/dist/Avatar/AvatarGroup.js

@@ -0,0 +1,11 @@
+import r from "styled-components";
+import { Flex as o } from "../Flex/Flex.js";
+import { avatarSize as t } from "./constants.js";
+const e = r(o)`
+  & > * + * {
+    margin-left: -${t / 2}px;
+  }
+`;
+export {
+  e as AvatarGroup
+};

package/dist/Avatar/constants.cjs

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

package/dist/Avatar/constants.js

@@ -0,0 +1,5 @@
+const e = 26, t = 64;
+export {
+  e as avatarSize,
+  t as previewSize
+};

package/dist/Avatar/index.cjs

@@ -0,0 +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;

package/dist/Avatar/index.js

@@ -0,0 +1,7 @@
+import { Avatar as o, Initials as t } from "./Avatar.js";
+import { AvatarGroup as e } from "./AvatarGroup.js";
+export {
+  o as Avatar,
+  e as AvatarGroup,
+  t as Initials
+};

package/dist/Badge/Badge.cjs

@@ -0,0 +1,4 @@
+"use strict";var T=Object.defineProperty;var n=Object.getOwnPropertySymbols;var c=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var i=(e,t,r)=>t in e?T(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,f=(e,t)=>{for(var r in t||(t={}))c.call(t,r)&&i(e,r,t[r]);if(n)for(var r of n(t))p.call(t,r)&&i(e,r,t[r]);return e};var g=(e,t)=>{var r={};for(var a in e)c.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(e!=null&&n)for(var a of n(e))t.indexOf(a)<0&&p.call(e,a)&&(r[a]=e[a]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const _=require("react"),x=require("prop-types"),q=require("styled-components"),C=require("../Flex/Flex.cjs"),j=require("../Typography/Typography.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},y=l(_),o=l(x),R=l(q),S=R.default(C.Flex)`
+  border-radius: ${({theme:e,size:t})=>t==="S"?"2px":e.borderRadius};
+  height: ${({size:e,theme:t})=>t.sizes.badge[e]};
+`,d=v=>{var u=v,{active:e,size:t,textColor:r,backgroundColor:a,children:b,minWidth:m}=u,h=g(u,["active","size","textColor","backgroundColor","children","minWidth"]);const s=t==="S"?1:2;return y.default.createElement(S,f({inline:!0,alignItem:"center",justifyContent:"center",minWidth:m,paddingLeft:s,paddingRight:s,background:e?"primary200":a,size:t},h),y.default.createElement(j.Typography,{variant:"sigma",textColor:e?"primary600":r},b))};d.defaultProps={active:!1,backgroundColor:"neutral150",minWidth:5,size:"M",textColor:"neutral600"};d.propTypes={active:o.default.bool,backgroundColor:o.default.string,children:o.default.oneOfType([o.default.number,o.default.string]).isRequired,minWidth:o.default.number,size:o.default.oneOf(["S","M"]),textColor:o.default.string};exports.Badge=d;

package/dist/Badge/Badge.js

@@ -0,0 +1,63 @@
+var h = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var m = Object.prototype.hasOwnProperty, s = Object.prototype.propertyIsEnumerable;
+var p = (e, r, t) => r in e ? h(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, l = (e, r) => {
+  for (var t in r || (r = {}))
+    m.call(r, t) && p(e, t, r[t]);
+  if (n)
+    for (var t of n(r))
+      s.call(r, t) && p(e, t, r[t]);
+  return e;
+};
+var g = (e, r) => {
+  var t = {};
+  for (var o in e)
+    m.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && n)
+    for (var o of n(e))
+      r.indexOf(o) < 0 && s.call(e, o) && (t[o] = e[o]);
+  return t;
+};
+import u from "react";
+import i from "prop-types";
+import x from "styled-components";
+import { Flex as C } from "../Flex/Flex.js";
+import { Typography as R } from "../Typography/Typography.js";
+const T = x(C)`
+  border-radius: ${({ theme: e, size: r }) => r === "S" ? "2px" : e.borderRadius};
+  height: ${({ size: e, theme: r }) => r.sizes.badge[e]};
+`, c = (k) => {
+  var a = k, { active: e, size: r, textColor: t, backgroundColor: o, children: f, minWidth: b } = a, y = g(a, ["active", "size", "textColor", "backgroundColor", "children", "minWidth"]);
+  const d = r === "S" ? 1 : 2;
+  return /* @__PURE__ */ u.createElement(T, l({
+    inline: !0,
+    alignItem: "center",
+    justifyContent: "center",
+    minWidth: b,
+    paddingLeft: d,
+    paddingRight: d,
+    background: e ? "primary200" : o,
+    size: r
+  }, y), /* @__PURE__ */ u.createElement(R, {
+    variant: "sigma",
+    textColor: e ? "primary600" : t
+  }, f));
+};
+c.defaultProps = {
+  active: !1,
+  backgroundColor: "neutral150",
+  minWidth: 5,
+  size: "M",
+  textColor: "neutral600"
+};
+c.propTypes = {
+  active: i.bool,
+  backgroundColor: i.string,
+  children: i.oneOfType([i.number, i.string]).isRequired,
+  minWidth: i.number,
+  size: i.oneOf(["S", "M"]),
+  textColor: i.string
+};
+export {
+  c as Badge
+};

package/dist/Badge/index.cjs

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

package/dist/Badge/index.js

@@ -0,0 +1,4 @@
+import { Badge as r } from "./Badge.js";
+export {
+  r as Badge
+};

package/dist/BaseButton/BaseButton.cjs

@@ -0,0 +1,23 @@
+"use strict";var B=Object.defineProperty;var r=Object.getOwnPropertySymbols;var n=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;var d=(e,s,t)=>s in e?B(e,s,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[s]=t,c=(e,s)=>{for(var t in s||(s={}))n.call(s,t)&&d(e,t,s[t]);if(r)for(var t of r(s))i.call(s,t)&&d(e,t,s[t]);return e};var p=(e,s)=>{var t={};for(var o in e)n.call(e,o)&&s.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&r)for(var o of r(e))s.indexOf(o)<0&&i.call(e,o)&&(t[o]=e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("react"),_=require("prop-types"),$=require("styled-components"),h=require("../themes/utils.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},f=u(g),b=u(_),m=u($),y=m.default.button`
+  display: flex;
+  cursor: pointer;
+  padding: ${({theme:e})=>e.spaces[2]};
+  border-radius: ${({theme:e})=>e.borderRadius};
+  background: ${({theme:e})=>e.colors.neutral0};
+  border: 1px solid ${({theme:e})=>e.colors.neutral200};
+  svg {
+    height: ${({theme:e})=>e.spaces[3]};
+    width: ${({theme:e})=>e.spaces[3]};
+  }
+  svg {
+    > g,
+    path {
+      fill: ${({theme:e})=>e.colors.neutral0};
+    }
+  }
+  &[aria-disabled='true'] {
+    pointer-events: none;
+  }
+
+  ${h.buttonFocusStyle}
+`,a=f.default.forwardRef((q,o)=>{var l=q,{disabled:e,children:s}=l,t=p(l,["disabled","children"]);return f.default.createElement(y,c({ref:o,"aria-disabled":e,type:"button",disabled:e},t),s)});a.displayName="BaseButton";a.defaultProps={disabled:!1};a.propTypes={children:b.default.node.isRequired,disabled:b.default.bool};exports.BaseButton=a;exports.BaseButtonWrapper=y;

package/dist/BaseButton/BaseButton.js

@@ -0,0 +1,67 @@
+var f = Object.defineProperty;
+var s = Object.getOwnPropertySymbols;
+var i = Object.prototype.hasOwnProperty, l = Object.prototype.propertyIsEnumerable;
+var p = (e, o, r) => o in e ? f(e, o, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[o] = r, n = (e, o) => {
+  for (var r in o || (o = {}))
+    i.call(o, r) && p(e, r, o[r]);
+  if (s)
+    for (var r of s(o))
+      l.call(o, r) && p(e, r, o[r]);
+  return e;
+};
+var u = (e, o) => {
+  var r = {};
+  for (var t in e)
+    i.call(e, t) && o.indexOf(t) < 0 && (r[t] = e[t]);
+  if (e != null && s)
+    for (var t of s(e))
+      o.indexOf(t) < 0 && l.call(e, t) && (r[t] = e[t]);
+  return r;
+};
+import c from "react";
+import b from "prop-types";
+import m from "styled-components";
+import { buttonFocusStyle as $ } from "../themes/utils.js";
+const y = m.button`
+  display: flex;
+  cursor: pointer;
+  padding: ${({ theme: e }) => e.spaces[2]};
+  border-radius: ${({ theme: e }) => e.borderRadius};
+  background: ${({ theme: e }) => e.colors.neutral0};
+  border: 1px solid ${({ theme: e }) => e.colors.neutral200};
+  svg {
+    height: ${({ theme: e }) => e.spaces[3]};
+    width: ${({ theme: e }) => e.spaces[3]};
+  }
+  svg {
+    > g,
+    path {
+      fill: ${({ theme: e }) => e.colors.neutral0};
+    }
+  }
+  &[aria-disabled='true'] {
+    pointer-events: none;
+  }
+
+  ${$}
+`, a = c.forwardRef((g, t) => {
+  var d = g, { disabled: e, children: o } = d, r = u(d, ["disabled", "children"]);
+  return /* @__PURE__ */ c.createElement(y, n({
+    ref: t,
+    "aria-disabled": e,
+    type: "button",
+    disabled: e
+  }, r), o);
+});
+a.displayName = "BaseButton";
+a.defaultProps = {
+  disabled: !1
+};
+a.propTypes = {
+  children: b.node.isRequired,
+  disabled: b.bool
+};
+export {
+  a as BaseButton,
+  y as BaseButtonWrapper
+};

package/dist/BaseButton/index.cjs

@@ -0,0 +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;

package/dist/BaseButton/index.js

@@ -0,0 +1,5 @@
+import { BaseButton as o, BaseButtonWrapper as r } from "./BaseButton.js";
+export {
+  o as BaseButton,
+  r as BaseButtonWrapper
+};

package/dist/BaseCheckbox/BaseCheckbox.cjs

@@ -0,0 +1,62 @@
+"use strict";var $=Object.defineProperty;var l=Object.getOwnPropertySymbols;var p=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable;var d=(e,o,r)=>o in e?$(e,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[o]=r,f=(e,o)=>{for(var r in o||(o={}))p.call(o,r)&&d(e,r,o[r]);if(l)for(var r of l(o))b.call(o,r)&&d(e,r,o[r]);return e};var k=(e,o)=>{var r={};for(var t in e)p.call(e,t)&&o.indexOf(t)<0&&(r[t]=e[t]);if(e!=null&&l)for(var t of l(e))o.indexOf(t)<0&&b.call(e,t)&&(r[t]=e[t]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),C=require("prop-types"),_=require("styled-components"),B=require("../Box/Box.cjs"),h=require("./utils.cjs"),q=require("./assets/checkmark.cjs"),j=require("./assets/checkmark-black.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},g=u(s),a=u(C),v=u(_),w=v.default.input`
+  margin: 0;
+  height: ${h.getCheckboxSize};
+  min-width: ${h.getCheckboxSize};
+  border-radius: ${({theme:e})=>e.borderRadius};
+  border: 1px solid ${({theme:e})=>e.colors.neutral300};
+  -webkit-appearance: none;
+  background-color: ${({theme:e})=>e.colors.neutral0};
+  cursor: pointer;
+
+  &:checked {
+    background-color: ${({theme:e})=>e.colors.primary600};
+    border: 1px solid ${({theme:e})=>e.colors.primary600};
+
+    &:after {
+      content: '';
+      display: block;
+      position: relative;
+      background: url(${q}) no-repeat no-repeat center center;
+      width: 10px;
+      height: 10px;
+      left: 50%;
+      top: 50%;
+      transform: translateX(-50%) translateY(-50%);
+    }
+
+    &:disabled:after {
+      background: url(${j}) no-repeat no-repeat center center;
+    }
+  }
+
+  &:disabled {
+    background-color: ${({theme:e})=>e.colors.neutral200};
+    border: 1px solid ${({theme:e})=>e.colors.neutral300};
+  }
+
+  &:indeterminate {
+    background-color: ${({theme:e})=>e.colors.primary600};
+    border: 1px solid ${({theme:e})=>e.colors.primary600};
+
+    &:after {
+      content: '';
+      display: block;
+      position: relative;
+      color: white;
+      height: 2px;
+      width: 10px;
+      background-color: ${({theme:e})=>e.colors.neutral0};
+      left: 50%;
+      top: 50%;
+      transform: translateX(-50%) translateY(-50%);
+    }
+
+    &:disabled {
+      background-color: ${({theme:e})=>e.colors.neutral200};
+      border: 1px solid ${({theme:e})=>e.colors.neutral300};
+      &:after {
+        background-color: ${({theme:e})=>e.colors.neutral500};
+      }
+    }
+  }
+`,n=R=>{var i=R,{indeterminate:e,size:o,name:r,value:t,onValueChange:m}=i,x=k(i,["indeterminate","size","name","value","onValueChange"]);const c=s.useRef();s.useEffect(()=>{c.current&&e?c.current.indeterminate=e:c.current.indeterminate=!1},[e]);const y=()=>{m(!t)};return g.default.createElement(B.Box,null,g.default.createElement(w,f({size:o,checked:t,onChange:y,type:"checkbox",ref:c,name:r},x)))};n.displayName="BaseCheckbox";n.defaultProps={indeterminate:!1,name:null,onValueChange(){},size:"M",value:!1};n.propTypes={indeterminate:a.default.bool,name:a.default.string,onValueChange:a.default.func,size:a.default.oneOf(["M","L"]),value:a.default.bool};exports.BaseCheckbox=n;