@strapi/design-system 0.0.0-jsoninput.0

package/dist/DateTimePicker/DateTimePicker.js

@@ -0,0 +1,145 @@
+var G = Object.defineProperty;
+var g = Object.getOwnPropertySymbols;
+var M = Object.prototype.hasOwnProperty, w = Object.prototype.propertyIsEnumerable;
+var H = (t, r, i) => r in t ? G(t, r, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[r] = i, y = (t, r) => {
+  for (var i in r || (r = {}))
+    M.call(r, i) && H(t, i, r[i]);
+  if (g)
+    for (var i of g(r))
+      w.call(r, i) && H(t, i, r[i]);
+  return t;
+};
+var F = (t, r) => {
+  var i = {};
+  for (var a in t)
+    M.call(t, a) && r.indexOf(a) < 0 && (i[a] = t[a]);
+  if (t != null && g)
+    for (var a of g(t))
+      r.indexOf(a) < 0 && w.call(t, a) && (i[a] = t[a]);
+  return i;
+};
+import n, { useState as h, useEffect as J } from "react";
+import { Stack as V } from "../Stack/Stack.js";
+import { DatePicker as K } from "../DatePicker/DatePicker.js";
+import { TimePicker as N } from "../TimePicker/TimePicker.js";
+import { Field as O } from "../Field/Field.js";
+import { FieldLabel as Q } from "../Field/FieldLabel.js";
+import "../Field/FieldInput.js";
+import { FieldHint as U } from "../Field/FieldHint.js";
+import { FieldError as W } from "../Field/FieldError.js";
+import "../Field/FieldContext.js";
+import "../Field/FieldAction.js";
+import { useId as I } from "../helpers/useId.js";
+import { parseDate as _ } from "./parseDate.js";
+import { dateTimePickerDefaultProps as X, dateTimePickerPropTypes as Y } from "./DateTimePickerProps.js";
+const b = (Z) => {
+  var P = Z, {
+    ariaLabel: t,
+    clearLabel: r,
+    disabled: i,
+    error: a,
+    hint: v,
+    label: f,
+    labelAction: x,
+    onChange: m,
+    onClear: T,
+    name: k,
+    required: E,
+    selectButtonTitle: C,
+    size: $,
+    step: L,
+    value: d
+  } = P, u = F(P, [
+    "ariaLabel",
+    "clearLabel",
+    "disabled",
+    "error",
+    "hint",
+    "label",
+    "labelAction",
+    "onChange",
+    "onClear",
+    "name",
+    "required",
+    "selectButtonTitle",
+    "size",
+    "step",
+    "value"
+  ]);
+  const c = _(d), [s, p] = h(c), [D, l] = h(
+    c ? `${c.getHours()}:${c.getMinutes()}:${c.getSeconds()}` : null
+  ), R = (e) => {
+    p(e);
+    let o;
+    D ? (o = new Date(e), o.setHours(D.split(":")[0]), o.setMinutes(D.split(":")[1])) : (o = new Date(e), l(`${o.getHours()}:${o.getMinutes()}:${o.getSeconds()}`)), m && m(o);
+  }, j = (e) => {
+    l(e);
+    const o = s ? new Date(s) : new Date();
+    o.setHours(e.split(":")[0]), o.setMinutes(e.split(":")[1]), s || p(o), m && m(o);
+  }, z = () => {
+    p(void 0), l(void 0), T();
+  }, A = () => {
+    l(void 0);
+    let e;
+    s && (e = new Date(s), e.setHours("00"), e.setMinutes("00")), m && m(e);
+  };
+  J(() => {
+    if (d && +d != +s) {
+      const e = _(d);
+      p(e), l(
+        e ? `${e.getHours()}:${e.getMinutes()}:${e.getSeconds()}` : null
+      );
+    } else
+      d || (p(void 0), l(void 0));
+  }, [d, s]);
+  const S = I("datetime-label", u == null ? void 0 : u.id), B = I("datetimepicker");
+  return /* @__PURE__ */ n.createElement(O, {
+    name: k,
+    role: "group",
+    id: S,
+    "aria-labelledby": S,
+    hint: v,
+    error: a,
+    required: E
+  }, /* @__PURE__ */ n.createElement(V, {
+    spacing: 1
+  }, f && /* @__PURE__ */ n.createElement(Q, {
+    action: x
+  }, f), /* @__PURE__ */ n.createElement(V, {
+    horizontal: !0,
+    spacing: 2
+  }, /* @__PURE__ */ n.createElement(K, y({
+    "data-testid": "datetimepicker-date",
+    name: k,
+    ariaLabel: f || t,
+    error: typeof a == "string",
+    selectedDate: s,
+    selectedDateLabel: (e) => `Date picker, current is ${e}`,
+    onChange: R,
+    required: E,
+    size: $,
+    onClear: T && z,
+    clearLabel: r,
+    disabled: i
+  }, u)), /* @__PURE__ */ n.createElement(N, {
+    "data-testid": "datetimepicker-time",
+    size: $,
+    "aria-label": f || t,
+    error: typeof a == "string",
+    value: D,
+    onChange: j,
+    onClear: T && A,
+    clearLabel: r,
+    required: E,
+    selectButtonTitle: C,
+    disabled: i,
+    step: L
+  })), /* @__PURE__ */ n.createElement(U, null), /* @__PURE__ */ n.createElement(W, {
+    id: B
+  })));
+};
+b.defaultProps = X;
+b.propTypes = Y;
+export {
+  b as DateTimePicker
+};

package/dist/DateTimePicker/DateTimePickerProps.cjs

@@ -0,0 +1 @@
+"use strict";var f=Object.defineProperty;var i=Object.getOwnPropertySymbols;var c=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var o=(t,a,l)=>a in t?f(t,a,{enumerable:!0,configurable:!0,writable:!0,value:l}):t[a]=l,d=(t,a)=>{for(var l in a||(a={}))c.call(a,l)&&o(t,l,a[l]);if(i)for(var l of i(a))p.call(a,l)&&o(t,l,a[l]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("react"),P=require("prop-types"),u=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},T=u(b),e=u(P),r=t=>T.default.createElement("div",d({},t)),s={ariaLabel:void 0,clearLabel:"clear",disabled:!1,error:void 0,hint:void 0,label:void 0,labelAction:void 0,onClear:void 0,required:!1,selectButtonTitle:"select",size:"M",step:1,value:void 0},n={ariaLabel:e.default.string,clearLabel:e.default.string,disabled:e.default.bool,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.string,label:e.default.string,labelAction:e.default.element,name:e.default.string.isRequired,onChange:e.default.func.isRequired,onClear:e.default.func,required:e.default.bool,selectButtonTitle:e.default.string,size:e.default.oneOf(["S","M"]),step:e.default.number,value:e.default.instanceOf(Date)};r.defaultProps=s;r.propTypes=n;exports.DateTimePickerProps=r;exports.dateTimePickerDefaultProps=s;exports.dateTimePickerPropTypes=n;

package/dist/DateTimePicker/DateTimePickerProps.js

@@ -0,0 +1,51 @@
+var s = Object.defineProperty;
+var o = Object.getOwnPropertySymbols;
+var d = Object.prototype.hasOwnProperty, c = Object.prototype.propertyIsEnumerable;
+var l = (t, i, r) => i in t ? s(t, i, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[i] = r, a = (t, i) => {
+  for (var r in i || (i = {}))
+    d.call(i, r) && l(t, r, i[r]);
+  if (o)
+    for (var r of o(i))
+      c.call(i, r) && l(t, r, i[r]);
+  return t;
+};
+import p from "react";
+import e from "prop-types";
+const n = (t) => /* @__PURE__ */ p.createElement("div", a({}, t)), b = {
+  ariaLabel: void 0,
+  clearLabel: "clear",
+  disabled: !1,
+  error: void 0,
+  hint: void 0,
+  label: void 0,
+  labelAction: void 0,
+  onClear: void 0,
+  required: !1,
+  selectButtonTitle: "select",
+  size: "M",
+  step: 1,
+  value: void 0
+}, u = {
+  ariaLabel: e.string,
+  clearLabel: e.string,
+  disabled: e.bool,
+  error: e.oneOfType([e.string, e.bool]),
+  hint: e.string,
+  label: e.string,
+  labelAction: e.element,
+  name: e.string.isRequired,
+  onChange: e.func.isRequired,
+  onClear: e.func,
+  required: e.bool,
+  selectButtonTitle: e.string,
+  size: e.oneOf(["S", "M"]),
+  step: e.number,
+  value: e.instanceOf(Date)
+};
+n.defaultProps = b;
+n.propTypes = u;
+export {
+  n as DateTimePickerProps,
+  b as dateTimePickerDefaultProps,
+  u as dateTimePickerPropTypes
+};

package/dist/DateTimePicker/__tests__/parseDate.test.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("../parseDate.cjs");describe("parseDate",()=>{it("should return a date",()=>{expect(e.parseDate("2021-11-05T15:37:29.592Z")instanceof Date).toBeTruthy()}),it("should return null if the passed params has not the right format",()=>{expect(e.parseDate("test")).toBeNull()})});

package/dist/DateTimePicker/__tests__/parseDate.test.js

@@ -0,0 +1,8 @@
+import { parseDate as t } from "../parseDate.js";
+describe("parseDate", () => {
+  it("should return a date", () => {
+    expect(t("2021-11-05T15:37:29.592Z") instanceof Date).toBeTruthy();
+  }), it("should return null if the passed params has not the right format", () => {
+    expect(t("test")).toBeNull();
+  });
+});

package/dist/DateTimePicker/index.cjs

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

package/dist/DateTimePicker/index.js

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

package/dist/DateTimePicker/parseDate.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=t=>{const e=Date.parse(t);return Number.isNaN(e)?null:new Date(e)};exports.parseDate=r;

package/dist/DateTimePicker/parseDate.js

@@ -0,0 +1,7 @@
+const r = (t) => {
+  const e = Date.parse(t);
+  return Number.isNaN(e) ? null : new Date(e);
+};
+export {
+  r as parseDate
+};

package/dist/Dialog/Dialog.cjs

@@ -0,0 +1,14 @@
+"use strict";var D=Object.defineProperty;var s=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(e,a,t)=>a in e?D(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,g=(e,a)=>{for(var t in a||(a={}))f.call(a,t)&&p(e,t,a[t]);if(s)for(var t of s(a))y.call(a,t)&&p(e,t,a[t]);return e};var m=(e,a)=>{var t={};for(var r in e)f.call(e,r)&&a.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&s)for(var r of s(e))a.indexOf(r)<0&&y.call(e,r)&&(t[r]=e[r]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const T=require("prop-types"),j=require("react"),E=require("styled-components"),b=require("../Box/Box.cjs"),P=require("../FocusTrap/FocusTrap.cjs"),_=require("../Portal/Portal.cjs"),F=require("../Flex/Flex.cjs"),L=require("../Typography/Typography.cjs"),v=require("../DismissibleLayer/DismissibleLayer.cjs"),w=require("../helpers/setOpacity.cjs"),B=require("../helpers/useLockScroll.cjs"),O=require("../helpers/useId.cjs"),u=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=u(T),o=u(j),n=u(E),R=n.default.div`
+  position: fixed;
+  z-index: 4;
+  inset: 0;
+  background: ${({theme:e})=>w.setOpacity(e.colors.neutral800,.2)};
+  padding: 0 ${({theme:e})=>e.spaces[8]};
+`,S=n.default(b.Box)`
+  max-width: ${412/16}rem;
+  margin: 0 auto;
+  overflow: hidden;
+  margin-top: 10%;
+`,$=n.default(F.Flex)`
+  border-bottom: 1px solid ${({theme:e})=>e.colors.neutral150};
+`,i=k=>{var d=k,{onClose:e,title:a,as:t,isOpen:r,id:q}=d,h=m(d,["onClose","title","as","isOpen","id"]);const x=O.useId("dialog",q);if(B(r),!r)return null;const c=`${x}-label`;return o.default.createElement(_.Portal,null,o.default.createElement(R,null,o.default.createElement(P.FocusTrap,null,o.default.createElement(v.DismissibleLayer,{onEscapeKeyDown:e,onPointerDownOutside:e},o.default.createElement(S,{"aria-labelledby":c,"aria-modal":!0,background:"neutral0",hasRadius:!0,shadow:"popupShadow",role:"dialog"},o.default.createElement($,{padding:6,justifyContent:"center"},o.default.createElement(L.Typography,{variant:"beta",as:t||"h2",id:c},a)),o.default.createElement(b.Box,g({},h)))))))};i.displayName="Dialog";i.defaultProps={as:"h2",id:void 0};i.propTypes={as:l.default.string,id:l.default.oneOfType([l.default.string,l.default.number]),isOpen:l.default.bool.isRequired,onClose:l.default.func.isRequired,title:l.default.string.isRequired};exports.Dialog=i;

package/dist/Dialog/Dialog.js

@@ -0,0 +1,85 @@
+var D = Object.defineProperty;
+var l = Object.getOwnPropertySymbols;
+var u = Object.prototype.hasOwnProperty, c = Object.prototype.propertyIsEnumerable;
+var p = (e, r, o) => r in e ? D(e, r, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[r] = o, f = (e, r) => {
+  for (var o in r || (r = {}))
+    u.call(r, o) && p(e, o, r[o]);
+  if (l)
+    for (var o of l(r))
+      c.call(r, o) && p(e, o, r[o]);
+  return e;
+};
+var g = (e, r) => {
+  var o = {};
+  for (var t in e)
+    u.call(e, t) && r.indexOf(t) < 0 && (o[t] = e[t]);
+  if (e != null && l)
+    for (var t of l(e))
+      r.indexOf(t) < 0 && c.call(e, t) && (o[t] = e[t]);
+  return o;
+};
+import i from "prop-types";
+import a from "react";
+import n from "styled-components";
+import { Box as y } from "../Box/Box.js";
+import { FocusTrap as x } from "../FocusTrap/FocusTrap.js";
+import { Portal as w } from "../Portal/Portal.js";
+import { Flex as R } from "../Flex/Flex.js";
+import { Typography as T } from "../Typography/Typography.js";
+import { DismissibleLayer as $ } from "../DismissibleLayer/DismissibleLayer.js";
+import { setOpacity as v } from "../helpers/setOpacity.js";
+import P from "../helpers/useLockScroll.js";
+import { useId as k } from "../helpers/useId.js";
+const q = n.div`
+  position: fixed;
+  z-index: 4;
+  inset: 0;
+  background: ${({ theme: e }) => v(e.colors.neutral800, 0.2)};
+  padding: 0 ${({ theme: e }) => e.spaces[8]};
+`, O = n(y)`
+  max-width: ${412 / 16}rem;
+  margin: 0 auto;
+  overflow: hidden;
+  margin-top: 10%;
+`, B = n(R)`
+  border-bottom: 1px solid ${({ theme: e }) => e.colors.neutral150};
+`, m = (C) => {
+  var s = C, { onClose: e, title: r, as: o, isOpen: t, id: b } = s, E = g(s, ["onClose", "title", "as", "isOpen", "id"]);
+  const h = k("dialog", b);
+  if (P(t), !t)
+    return null;
+  const d = `${h}-label`;
+  return /* @__PURE__ */ a.createElement(w, null, /* @__PURE__ */ a.createElement(q, null, /* @__PURE__ */ a.createElement(x, null, /* @__PURE__ */ a.createElement($, {
+    onEscapeKeyDown: e,
+    onPointerDownOutside: e
+  }, /* @__PURE__ */ a.createElement(O, {
+    "aria-labelledby": d,
+    "aria-modal": !0,
+    background: "neutral0",
+    hasRadius: !0,
+    shadow: "popupShadow",
+    role: "dialog"
+  }, /* @__PURE__ */ a.createElement(B, {
+    padding: 6,
+    justifyContent: "center"
+  }, /* @__PURE__ */ a.createElement(T, {
+    variant: "beta",
+    as: o || "h2",
+    id: d
+  }, r)), /* @__PURE__ */ a.createElement(y, f({}, E)))))));
+};
+m.displayName = "Dialog";
+m.defaultProps = {
+  as: "h2",
+  id: void 0
+};
+m.propTypes = {
+  as: i.string,
+  id: i.oneOfType([i.string, i.number]),
+  isOpen: i.bool.isRequired,
+  onClose: i.func.isRequired,
+  title: i.string.isRequired
+};
+export {
+  m as Dialog
+};

package/dist/Dialog/DialogBody.cjs

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

package/dist/Dialog/DialogBody.js

@@ -0,0 +1,35 @@
+import o from "react";
+import n from "styled-components";
+import i from "prop-types";
+import { Box as d } from "../Box/Box.js";
+import { Flex as p } from "../Flex/Flex.js";
+const a = n(d)`
+  svg {
+    width: ${({ theme: e }) => e.spaces[6]};
+    height: ${({ theme: e }) => e.spaces[6]};
+
+    path {
+      fill: ${({ theme: e }) => e.colors.danger600};
+    }
+  }
+`, t = ({ children: e, icon: r }) => /* @__PURE__ */ o.createElement(d, {
+  paddingTop: 8,
+  paddingBottom: 8,
+  paddingLeft: 6,
+  paddingRight: 6
+}, r && /* @__PURE__ */ o.createElement(a, {
+  paddingBottom: 2
+}, /* @__PURE__ */ o.createElement(p, {
+  justifyContent: "center"
+}, r)), e);
+t.displayName = "DialogBody";
+t.defaultProps = {
+  icon: void 0
+};
+t.propTypes = {
+  children: i.node.isRequired,
+  icon: i.node
+};
+export {
+  t as DialogBody
+};

package/dist/Dialog/DialogFooter.cjs

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

package/dist/Dialog/DialogFooter.js

@@ -0,0 +1,31 @@
+import e from "react";
+import n from "styled-components";
+import r from "prop-types";
+import { Box as p } from "../Box/Box.js";
+import { Stack as a } from "../Stack/Stack.js";
+const d = n(p)`
+  border-top: 1px solid ${({ theme: o }) => o.colors.neutral150};
+
+  button {
+    width: 100%;
+    display: inline-flex;
+    justify-content: center;
+  }
+`, t = ({ startAction: o, endAction: i }) => /* @__PURE__ */ e.createElement(d, {
+  padding: 4
+}, /* @__PURE__ */ e.createElement(a, {
+  horizontal: !0,
+  spacing: 2
+}, o, i));
+t.displayName = "DialogFooter";
+t.defaultProps = {
+  endAction: void 0,
+  startAction: void 0
+};
+t.propTypes = {
+  endAction: r.node,
+  startAction: r.node
+};
+export {
+  t as DialogFooter
+};

package/dist/Dialog/index.cjs

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

package/dist/Dialog/index.js

@@ -0,0 +1,8 @@
+import { Dialog as e } from "./Dialog.js";
+import { DialogBody as a } from "./DialogBody.js";
+import { DialogFooter as g } from "./DialogFooter.js";
+export {
+  e as Dialog,
+  a as DialogBody,
+  g as DialogFooter
+};

package/dist/DismissibleLayer/DismissibleLayer.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react"),i=require("@radix-ui/react-use-callback-ref"),R=require("prop-types"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},b=l(a),s=l(R),o=({children:e,className:d,onEscapeKeyDown:f,onPointerDownOutside:p})=>{const r=a.useRef(null),c=i.useCallbackRef(f),u=i.useCallbackRef(p);return a.useEffect(()=>{const t=n=>{n.key==="Escape"&&c(n)};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[c]),a.useEffect(()=>{const t=n=>{const y=r.current.closest("[data-react-portal]"),m=n.target.closest("[data-react-portal]");r.current&&!r.current.contains(n.target)&&y===m&&u()};return document.addEventListener("pointerdown",t),()=>document.removeEventListener("pointerdown",t)},[u]),b.default.createElement("div",{ref:r,className:d},e)};o.defaultProps={className:void 0};o.propTypes={children:s.default.node.isRequired,className:s.default.string,onEscapeKeyDown:s.default.func.isRequired,onPointerDownOutside:s.default.func.isRequired};exports.DismissibleLayer=o;

package/dist/DismissibleLayer/DismissibleLayer.js

@@ -0,0 +1,33 @@
+import y, { useRef as w, useEffect as a } from "react";
+import { useCallbackRef as c } from "@radix-ui/react-use-callback-ref";
+import r from "prop-types";
+const i = ({ children: d, className: u, onEscapeKeyDown: l, onPointerDownOutside: m }) => {
+  const n = w(null), o = c(l), s = c(m);
+  return a(() => {
+    const e = (t) => {
+      t.key === "Escape" && o(t);
+    };
+    return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+  }, [o]), a(() => {
+    const e = (t) => {
+      const p = n.current.closest("[data-react-portal]"), f = t.target.closest("[data-react-portal]");
+      n.current && !n.current.contains(t.target) && p === f && s();
+    };
+    return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
+  }, [s]), /* @__PURE__ */ y.createElement("div", {
+    ref: n,
+    className: u
+  }, d);
+};
+i.defaultProps = {
+  className: void 0
+};
+i.propTypes = {
+  children: r.node.isRequired,
+  className: r.string,
+  onEscapeKeyDown: r.func.isRequired,
+  onPointerDownOutside: r.func.isRequired
+};
+export {
+  i as DismissibleLayer
+};

package/dist/DismissibleLayer/index.cjs

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

package/dist/DismissibleLayer/index.js

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

package/dist/Divider/Divider.cjs

@@ -0,0 +1,5 @@
+"use strict";var g=Object.defineProperty,y=Object.defineProperties;var _=Object.getOwnPropertyDescriptors;var n=Object.getOwnPropertySymbols;var c=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var u=(e,t,r)=>t in e?g(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,l=(e,t)=>{for(var r in t||(t={}))c.call(t,r)&&u(e,r,t[r]);if(n)for(var r of n(t))d.call(t,r)&&u(e,r,t[r]);return e},i=(e,t)=>y(e,_(t));var p=(e,t)=>{var r={};for(var o in e)c.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(e!=null&&n)for(var o of n(e))t.indexOf(o)<0&&d.call(e,o)&&(r[o]=e[o]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("react"),v=require("prop-types"),x=require("styled-components"),m=require("../Box/Box.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},q=s(b),f=s(v),B=s(x),D=B.default(m.Box)`
+  height: 1px;
+  border: none;
+  ${({unsetMargin:e})=>e?"margin: 0;":""}
+`,a=r=>{var o=r,{unsetMargin:e}=o,t=p(o,["unsetMargin"]);return q.default.createElement(D,i(l({},t),{as:"hr",unsetMargin:e}))};a.defaultProps={background:"neutral150",unsetMargin:!0};a.propTypes={background:f.default.string,unsetMargin:f.default.bool};exports.Divider=a;

package/dist/Divider/Divider.js

@@ -0,0 +1,47 @@
+var c = Object.defineProperty, f = Object.defineProperties;
+var l = Object.getOwnPropertyDescriptors;
+var n = Object.getOwnPropertySymbols;
+var i = Object.prototype.hasOwnProperty, a = Object.prototype.propertyIsEnumerable;
+var p = (r, e, o) => e in r ? c(r, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : r[e] = o, m = (r, e) => {
+  for (var o in e || (e = {}))
+    i.call(e, o) && p(r, o, e[o]);
+  if (n)
+    for (var o of n(e))
+      a.call(e, o) && p(r, o, e[o]);
+  return r;
+}, s = (r, e) => f(r, l(e));
+var d = (r, e) => {
+  var o = {};
+  for (var t in r)
+    i.call(r, t) && e.indexOf(t) < 0 && (o[t] = r[t]);
+  if (r != null && n)
+    for (var t of n(r))
+      e.indexOf(t) < 0 && a.call(r, t) && (o[t] = r[t]);
+  return o;
+};
+import b from "react";
+import u from "prop-types";
+import h from "styled-components";
+import { Box as x } from "../Box/Box.js";
+const y = h(x)`
+  height: 1px;
+  border: none;
+  ${({ unsetMargin: r }) => r ? "margin: 0;" : ""}
+`, g = (o) => {
+  var t = o, { unsetMargin: r } = t, e = d(t, ["unsetMargin"]);
+  return /* @__PURE__ */ b.createElement(y, s(m({}, e), {
+    as: "hr",
+    unsetMargin: r
+  }));
+};
+g.defaultProps = {
+  background: "neutral150",
+  unsetMargin: !0
+};
+g.propTypes = {
+  background: u.string,
+  unsetMargin: u.bool
+};
+export {
+  g as Divider
+};

package/dist/Divider/index.cjs

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

package/dist/Divider/index.js

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

package/dist/EmptyStateLayout/EmptyStateLayout.cjs

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

package/dist/EmptyStateLayout/EmptyStateLayout.js

@@ -0,0 +1,44 @@
+import e from "react";
+import t from "prop-types";
+import r from "styled-components";
+import { Typography as s } from "../Typography/Typography.js";
+import { Box as o } from "../Box/Box.js";
+const l = r(o)`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+`, c = r(o)`
+  svg {
+    height: ${88 / 16}rem;
+  }
+`, a = ({ icon: n, content: i, action: p, hasRadius: d, shadow: m }) => /* @__PURE__ */ e.createElement(l, {
+  padding: 11,
+  background: "neutral0",
+  hasRadius: d,
+  shadow: m
+}, /* @__PURE__ */ e.createElement(c, {
+  paddingBottom: 6,
+  "aria-hidden": !0
+}, n), /* @__PURE__ */ e.createElement(o, {
+  paddingBottom: 4
+}, /* @__PURE__ */ e.createElement(s, {
+  variant: "delta",
+  as: "p",
+  textColor: "neutral600"
+}, i)), p);
+a.defaultProps = {
+  action: void 0,
+  hasRadius: !0,
+  shadow: "tableShadow"
+};
+a.propTypes = {
+  action: t.node,
+  content: t.string.isRequired,
+  hasRadius: t.bool,
+  icon: t.node.isRequired,
+  shadow: t.string
+};
+export {
+  a as EmptyStateLayout
+};

package/dist/EmptyStateLayout/index.cjs

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

package/dist/EmptyStateLayout/index.js

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

package/dist/EmptyStateLayout/story-assets/Illo.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),d=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=d(l),C=()=>e.default.createElement("svg",{width:"159",height:"88",viewBox:"0 0 159 88",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M134.933 17.417C137.768 17.417 140.067 19.7153 140.067 22.5503C140.067 25.3854 137.768 27.6837 134.933 27.6837H105.6C108.435 27.6837 110.733 29.9819 110.733 32.817C110.733 35.6521 108.435 37.9503 105.6 37.9503H121.733C124.568 37.9503 126.867 40.2486 126.867 43.0837C126.867 45.9187 124.568 48.217 121.733 48.217H114.272C110.698 48.217 107.8 50.5153 107.8 53.3503C107.8 55.2404 109.267 56.9515 112.2 58.4837C115.035 58.4837 117.333 60.7819 117.333 63.617C117.333 66.4521 115.035 68.7503 112.2 68.7503H51.3333C48.4982 68.7503 46.2 66.4521 46.2 63.617C46.2 60.7819 48.4982 58.4837 51.3333 58.4837H22.7333C19.8982 58.4837 17.6 56.1854 17.6 53.3503C17.6 50.5153 19.8982 48.217 22.7333 48.217H52.0666C54.9017 48.217 57.2 45.9187 57.2 43.0837C57.2 40.2486 54.9017 37.9503 52.0666 37.9503H33.7333C30.8982 37.9503 28.6 35.6521 28.6 32.817C28.6 29.9819 30.8982 27.6837 33.7333 27.6837H63.0666C60.2316 27.6837 57.9333 25.3854 57.9333 22.5503C57.9333 19.7153 60.2316 17.417 63.0666 17.417H134.933ZM134.933 37.9503C137.768 37.9503 140.067 40.2486 140.067 43.0837C140.067 45.9187 137.768 48.217 134.933 48.217C132.098 48.217 129.8 45.9187 129.8 43.0837C129.8 40.2486 132.098 37.9503 134.933 37.9503Z",fill:"#DBDBFA"}),e.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M95.826 16.6834L102.647 66.4348L103.26 71.4261C103.458 73.034 102.314 74.4976 100.706 74.695L57.7621 79.9679C56.1542 80.1653 54.6906 79.0219 54.4932 77.4139L47.8816 23.5671C47.7829 22.7631 48.3546 22.0313 49.1586 21.9326C49.1637 21.932 49.1688 21.9313 49.1739 21.9307L52.7367 21.5311L95.826 16.6834ZM55.6176 21.208L58.9814 20.8306Z",fill:"white"}),e.default.createElement("path",{d:"M55.6176 21.208L58.9814 20.8306M95.826 16.6834L102.647 66.4348L103.26 71.4261C103.458 73.034 102.314 74.4976 100.706 74.695L57.7621 79.9679C56.1542 80.1653 54.6906 79.0219 54.4932 77.4139L47.8816 23.5671C47.7829 22.7631 48.3546 22.0313 49.1586 21.9326C49.1637 21.932 49.1688 21.9313 49.1739 21.9307L52.7367 21.5311L95.826 16.6834Z",stroke:"#7E7BF6",strokeWidth:"2.5"}),e.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M93.9695 19.8144L100.144 64.9025L100.699 69.4258C100.878 70.8831 99.8559 72.2077 98.416 72.3845L59.9585 77.1065C58.5185 77.2833 57.2062 76.2453 57.0272 74.7881L51.0506 26.112C50.9519 25.308 51.5236 24.5762 52.3276 24.4775L57.0851 23.8934",fill:"#F0F0FF"}),e.default.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M97.701 7.33301H64.2927C63.7358 7.33301 63.2316 7.55873 62.8667 7.92368C62.5017 8.28862 62.276 8.79279 62.276 9.34967V65.083C62.276 65.6399 62.5017 66.1441 62.8667 66.509C63.2316 66.874 63.7358 67.0997 64.2927 67.0997H107.559C108.116 67.0997 108.62 66.874 108.985 66.509C109.35 66.1441 109.576 65.6399 109.576 65.083V19.202C109.576 18.6669 109.363 18.1537 108.985 17.7755L99.1265 7.92324C98.7484 7.54531 98.2356 7.33301 97.701 7.33301Z",fill:"white",stroke:"#7F7CFA",strokeWidth:"2.5"}),e.default.createElement("path",{d:"M98.026 8.17871V16.6833C98.026 17.8983 99.011 18.8833 100.226 18.8833H106.044",stroke:"#807EFA",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"}),e.default.createElement("path",{d:"M70.1594 56.2838H89.2261M70.1594 18.8838H89.2261H70.1594ZM70.1594 27.6838H101.693H70.1594ZM70.1594 37.2171H101.693H70.1594ZM70.1594 46.7505H101.693H70.1594Z",stroke:"#817FFA",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round"}));exports.Illo=C;