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

package/dist/Alert/Alert.cjs

@@ -1,35 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("react"),y=require("prop-types"),C=require("styled-components"),E=require("@strapi/icons/Information"),B=require("@strapi/icons/CheckCircle"),_=require("@strapi/icons/ExclamationMarkCircle"),q=require("@strapi/icons/Cross"),l=require("../Box/Box.cjs"),u=require("../Typography/Typography.cjs"),b=require("../Flex/Flex.cjs"),s=require("./utils.cjs"),T=require("../themes/utils.cjs"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=r(x),a=r(y),d=r(C),$=r(E),k=r(B),R=r(_),A=r(q),I=d.default(l.Box)`
-  flex: 1;
-  flex-wrap: wrap;
-  display: flex;
-  flex-direction: row;
-`,j=d.default(l.Box)`
-  border: 1px solid ${s.handleBorderColor};
-  background: ${s.handleBackgroundColor};
-  box-shadow: ${({theme:e})=>e.shadows.filterShadow};
-`,w=d.default.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]};
-  ${T.buttonFocusStyle};
-`,v=d.default(l.Box)`
-  font-size: ${20/16}rem;
-  svg path {
-    fill: ${s.handleIconColor};
-  }
-`,f=({variant:e,...o})=>e==="success"?t.default.createElement(k.default,{...o}):e==="danger"?t.default.createElement(R.default,{...o}):t.default.createElement($.default,{...o}),F=d.default(l.Box)`
-  // Checked with the designers, validated
-  padding-top: 1px;
-
-  & a > span {
-    color: ${s.handleIconColor};
-
-    svg path {
-      fill: ${s.handleIconColor};
-    }
-  }
-`,i=({title:e,children:o,variant:n,onClose:p,closeLabel:g,titleAs:h,action:c,...m})=>t.default.createElement(j,{hasRadius:!0,paddingLeft:5,paddingRight:6,paddingTop:5,variant:n,...m},t.default.createElement(b.Flex,{alignItems:"flex-start"},t.default.createElement(v,{paddingRight:3,variant:n},t.default.createElement(f,{variant:n,"aria-hidden":!0})),t.default.createElement(I,{role:n==="danger"?"alert":"status"},t.default.createElement(l.Box,{paddingBottom:2,paddingRight:1},t.default.createElement(u.Typography,{fontWeight:"bold",textColor:"neutral800",as:h},e)),t.default.createElement(l.Box,{paddingBottom:c?2:5,paddingRight:2},t.default.createElement(u.Typography,{as:"p",textColor:"neutral800"},o)),c&&t.default.createElement(F,{paddingBottom:5,variant:n},c)),t.default.createElement(w,{onClick:p,"aria-label":g},t.default.createElement(A.default,{"aria-hidden":!0}))));i.defaultProps={action:void 0,variant:"default",titleAs:"p"};i.propTypes={action:a.default.element,children:a.default.node.isRequired,closeLabel:a.default.string.isRequired,onClose:a.default.func.isRequired,title:a.default.string.isRequired,titleAs:a.default.string,variant:a.default.oneOf(["danger","success","default"])};f.propTypes={variant:i.propTypes.variant};exports.Alert=i;

package/dist/Alert/Alert.js

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

package/dist/Alert/index.cjs

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

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

package/dist/Alert/utils.cjs

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

package/dist/Alert/utils.js

@@ -1,6 +0,0 @@
-const s = ({ theme: r, variant: o }) => o === "danger" ? r.colors.danger100 : o === "success" ? r.colors.success100 : r.colors.primary100, c = ({ theme: r, variant: o }) => o === "danger" ? r.colors.danger200 : o === "success" ? r.colors.success200 : r.colors.primary200, n = ({ theme: r, variant: o }) => o === "danger" ? r.colors.danger700 : o === "success" ? r.colors.success700 : r.colors.primary700;
-export {
-  s as handleBackgroundColor,
-  c as handleBorderColor,
-  n as handleIconColor
-};

package/dist/Avatar/Avatar.cjs

@@ -1,29 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=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},a=s(d),o=s(f),r=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]};
-`,S=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;
-`,l=({src:e,alt:c,preview:i})=>{const[n,u]=d.useState(!1);return a.default.createElement("span",null,i&&n?a.default.createElement(b,{"aria-hidden":!0,alt:"",width:`${t.previewSize}px`,height:`${t.previewSize}px`,src:i===!0?e:i}):null,a.default.createElement(m,{hovering:i&&n,onMouseEnter:()=>u(!0),onMouseLeave:()=>u(!1)},i&&n?a.default.createElement(S,null):null,a.default.createElement(y,{src:e,alt:c,width:`${t.avatarSize}px`,height:`${t.avatarSize}px`})))},x=o.default(h.Flex)`
-  span {
-    line-height: 0;
-  }
-`,p=({children:e})=>a.default.createElement(x,{borderRadius:"50%",width:`${t.avatarSize}px`,height:`${t.avatarSize}px`,background:"primary600",justifyContent:"center"},a.default.createElement(g.Typography,{fontWeight:"bold",textColor:"buttonNeutral0",fontSize:0,textTransform:"uppercase"},e));p.propTypes={children:r.default.node.isRequired};l.defaultProps={preview:void 0};l.propTypes={alt:r.default.string.isRequired,preview:r.default.oneOfType([r.default.string,r.default.bool]),src:r.default.string.isRequired};exports.Avatar=l;exports.Initials=p;

package/dist/Avatar/Avatar.js

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

package/dist/Avatar/AvatarGroup.cjs

@@ -1,5 +0,0 @@
-"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

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

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

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

package/dist/Avatar/index.cjs

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

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

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),c=require("prop-types"),p=require("../Flex/Flex.cjs"),f=require("../Typography/Typography.cjs"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=o(s),t=o(c),r=({active:e,textColor:l,backgroundColor:n,children:u,minWidth:i,...d})=>a.default.createElement(p.Flex,{inline:!0,alignItem:"center",justifyContent:"center",minWidth:i,padding:1,background:e?"primary100":n,hasRadius:!0,...d},a.default.createElement(f.Typography,{variant:"sigma",textColor:e?"primary600":l},u));r.defaultProps={active:!1,backgroundColor:"neutral100",minWidth:5,textColor:"neutral600"};r.propTypes={active:t.default.bool,backgroundColor:t.default.string,children:t.default.oneOfType([t.default.number,t.default.string]).isRequired,minWidth:t.default.number,textColor:t.default.string};exports.Badge=r;

package/dist/Badge/Badge.js

@@ -1,33 +0,0 @@
-import t from "react";
-import r from "prop-types";
-import { Flex as p } from "../Flex/Flex.js";
-import { Typography as u } from "../Typography/Typography.js";
-const o = ({ active: e, textColor: n, backgroundColor: i, children: a, minWidth: m, ...l }) => /* @__PURE__ */ t.createElement(p, {
-  inline: !0,
-  alignItem: "center",
-  justifyContent: "center",
-  minWidth: m,
-  padding: 1,
-  background: e ? "primary100" : i,
-  hasRadius: !0,
-  ...l
-}, /* @__PURE__ */ t.createElement(u, {
-  variant: "sigma",
-  textColor: e ? "primary600" : n
-}, a));
-o.defaultProps = {
-  active: !1,
-  backgroundColor: "neutral100",
-  minWidth: 5,
-  textColor: "neutral600"
-};
-o.propTypes = {
-  active: r.bool,
-  backgroundColor: r.string,
-  children: r.oneOfType([r.number, r.string]).isRequired,
-  minWidth: r.number,
-  textColor: r.string
-};
-export {
-  o as Badge
-};

package/dist/Badge/index.cjs

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

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

package/dist/BaseButton/BaseButton.cjs

@@ -1,23 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),i=require("prop-types"),c=require("styled-components"),p=require("../themes/utils.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=s(n),r=s(i),f=s(c),a=f.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;
-  }
-
-  ${p.buttonFocusStyle}
-`,t=o.default.forwardRef(({disabled:e,children:u,...l},d)=>o.default.createElement(a,{ref:d,"aria-disabled":e,type:"button",disabled:e,...l},u));t.displayName="BaseButton";t.defaultProps={disabled:!1};t.propTypes={children:r.default.node.isRequired,disabled:r.default.bool};exports.BaseButton=t;exports.BaseButtonWrapper=a;

package/dist/BaseButton/BaseButton.js

@@ -1,45 +0,0 @@
-import o from "react";
-import t from "prop-types";
-import p from "styled-components";
-import { buttonFocusStyle as i } from "../themes/utils.js";
-const l = p.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;
-  }
-
-  ${i}
-`, r = o.forwardRef(({ disabled: e, children: s, ...a }, d) => /* @__PURE__ */ o.createElement(l, {
-  ref: d,
-  "aria-disabled": e,
-  type: "button",
-  disabled: e,
-  ...a
-}, s));
-r.displayName = "BaseButton";
-r.defaultProps = {
-  disabled: !1
-};
-r.propTypes = {
-  children: t.node.isRequired,
-  disabled: t.bool
-};
-export {
-  r as BaseButton,
-  l as BaseButtonWrapper
-};

package/dist/BaseButton/index.cjs

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

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

package/dist/BaseCheckbox/BaseCheckbox.cjs

@@ -1,62 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),b=require("prop-types"),f=require("styled-components"),n=require("./utils.cjs"),k=require("./assets/checkmark.cjs"),h=require("./assets/checkmark-black.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},g=c(a),r=c(b),m=c(f),y=m.default.input`
-  margin: 0;
-  height: ${n.getCheckboxSize};
-  min-width: ${n.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(${k}) no-repeat no-repeat center center;
-      width: 10px;
-      height: 10px;
-      left: 50%;
-      top: 50%;
-      transform: translateX(-50%) translateY(-50%);
-    }
-
-    &:disabled:after {
-      background: url(${h}) 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};
-      }
-    }
-  }
-`,t=({indeterminate:e,size:s,name:u,value:l,onValueChange:i,...d})=>{const o=a.useRef();a.useEffect(()=>{o.current&&e?o.current.indeterminate=e:o.current.indeterminate=!1},[e]);const p=()=>{i(!l)};return g.default.createElement(y,{size:s,checked:l,onChange:p,type:"checkbox",ref:o,name:u,...d})};t.displayName="BaseCheckbox";t.defaultProps={indeterminate:!1,name:null,onValueChange:()=>{},size:"M",value:!1};t.propTypes={indeterminate:r.default.bool,name:r.default.string,onValueChange:r.default.func,size:r.default.oneOf(["M","L"]),value:r.default.bool};exports.BaseCheckbox=t;

package/dist/BaseCheckbox/BaseCheckbox.js

@@ -1,104 +0,0 @@
-import p, { useRef as u, useEffect as b } from "react";
-import r from "prop-types";
-import m from "styled-components";
-import { getCheckboxSize as n } from "./utils.js";
-import f from "./assets/checkmark.js";
-import h from "./assets/checkmark-black.js";
-const k = m.input`
-  margin: 0;
-  height: ${n};
-  min-width: ${n};
-  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(${f}) no-repeat no-repeat center center;
-      width: 10px;
-      height: 10px;
-      left: 50%;
-      top: 50%;
-      transform: translateX(-50%) translateY(-50%);
-    }
-
-    &:disabled:after {
-      background: url(${h}) 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};
-      }
-    }
-  }
-`, t = ({ indeterminate: e, size: l, name: c, value: a, onValueChange: s, ...i }) => {
-  const o = u();
-  b(() => {
-    o.current && e ? o.current.indeterminate = e : o.current.indeterminate = !1;
-  }, [e]);
-  const d = () => {
-    s(!a);
-  };
-  return /* @__PURE__ */ p.createElement(k, {
-    size: l,
-    checked: a,
-    onChange: d,
-    type: "checkbox",
-    ref: o,
-    name: c,
-    ...i
-  });
-};
-t.displayName = "BaseCheckbox";
-t.defaultProps = {
-  indeterminate: !1,
-  name: null,
-  onValueChange: () => {
-  },
-  size: "M",
-  value: !1
-};
-t.propTypes = {
-  indeterminate: r.bool,
-  name: r.string,
-  onValueChange: r.func,
-  size: r.oneOf(["M", "L"]),
-  value: r.bool
-};
-export {
-  t as BaseCheckbox
-};

package/dist/BaseCheckbox/assets/checkmark-black.cjs

@@ -1 +0,0 @@
-"use strict";const M="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSIjOEU4RUE5IgogIC8+Cjwvc3ZnPg==";module.exports=M;

package/dist/BaseCheckbox/assets/checkmark-black.js

@@ -1,4 +0,0 @@
-const M = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSIjOEU4RUE5IgogIC8+Cjwvc3ZnPg==";
-export {
-  M as default
-};

package/dist/BaseCheckbox/assets/checkmark.cjs

@@ -1 +0,0 @@
-"use strict";const M="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSJ3aGl0ZSIKICAvPgo8L3N2Zz4=";module.exports=M;

package/dist/BaseCheckbox/assets/checkmark.js

@@ -1,4 +0,0 @@
-const M = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSJ3aGl0ZSIKICAvPgo8L3N2Zz4=";
-export {
-  M as default
-};

package/dist/BaseCheckbox/index.cjs

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

package/dist/BaseCheckbox/index.js

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

package/dist/BaseCheckbox/utils.cjs

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

package/dist/BaseCheckbox/utils.js

@@ -1,4 +0,0 @@
-const r = ({ size: e }) => e === "M" ? "18px" : "20px";
-export {
-  r as getCheckboxSize
-};