@strapi/design-system 0.0.0-jsoninput.0

package/dist/SubNav/index.js

@@ -0,0 +1,15 @@
+import { SubNav as e, subNavWidth as t } from "./SubNav.js";
+import { SubNavHeader as a } from "./SubNavHeader.js";
+import { SubNavLink as u } from "./SubNavLink.js";
+import { SubNavLinkSection as N } from "./SubNavLinkSection.js";
+import { SubNavSection as i } from "./SubNavSection.js";
+import { SubNavSections as p } from "./SubNavSections.js";
+export {
+  e as SubNav,
+  a as SubNavHeader,
+  u as SubNavLink,
+  N as SubNavLinkSection,
+  i as SubNavSection,
+  p as SubNavSections,
+  t as subNavWidth
+};

package/dist/Switch/Switch.cjs

@@ -0,0 +1,42 @@
+"use strict";var x=Object.defineProperty;var l=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable;var p=(e,r,t)=>r in e?x(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,g=(e,r)=>{for(var t in r||(r={}))b.call(r,t)&&p(e,t,r[t]);if(l)for(var t of l(r))m.call(r,t)&&p(e,t,r[t]);return e};var h=(e,r)=>{var t={};for(var a in e)b.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&l)for(var a of l(e))r.indexOf(a)<0&&m.call(e,a)&&(t[a]=e[a]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const _=require("react"),k=require("prop-types"),q=require("styled-components"),S=require("../Flex/Flex.cjs"),E=require("../Box/Box.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},o=c(_),n=c(k),y=c(q),d=y.default.div`
+  background: ${({theme:e})=>e.colors.danger500};
+  border: none;
+  border-radius: 16px;
+  position: relative;
+  height: ${24/16}rem;
+  width: ${40/16}rem;
+
+  & span {
+    font-size: ${({visibleLabels:e})=>e?"1rem":0};
+  }
+
+  &:before {
+    content: '';
+    background: ${({theme:e})=>e.colors.neutral0};
+    width: 1rem;
+    height: 1rem;
+    border-radius: 50%;
+    position: absolute;
+    transition: all 0.5s;
+    left: ${({theme:e})=>e.spaces[1]};
+    top: ${({theme:e})=>e.spaces[1]};
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    &:before {
+      transition: none;
+    }
+  }
+`,R=y.default.button`
+  background: transparent;
+  padding: 0;
+  border: none;
+
+  &[aria-checked='true'] ${d} {
+    background: ${({theme:e})=>e.colors.success500};
+  }
+
+  &[aria-checked='true'] ${d}:before {
+    transform: translateX(1rem);
+  }
+`,s=o.default.forwardRef((v,w)=>{var f=v,{label:e,onChange:r,onLabel:t,offLabel:a,selected:u,visibleLabels:i}=f,$=h(f,["label","onChange","onLabel","offLabel","selected","visibleLabels"]);return o.default.createElement(R,g({ref:w,role:"switch","aria-checked":u,"aria-label":e,onClick:r,visibleLabels:i,type:"button"},$),o.default.createElement(S.Flex,null,o.default.createElement(d,null,o.default.createElement("span",null,t),o.default.createElement("span",null,a)),i&&o.default.createElement(E.Box,{as:"span","aria-hidden":!0,paddingLeft:2,color:u?"success600":"danger600"},u?t:a)))});s.defaultProps={onLabel:"On",offLabel:"Off",visibleLabels:!1};s.propTypes={label:n.default.string.isRequired,offLabel:n.default.string,onChange:n.default.func.isRequired,onLabel:n.default.string,selected:n.default.bool.isRequired,visibleLabels:n.default.bool};s.displayName="Switch";exports.Switch=s;

package/dist/Switch/Switch.js

@@ -0,0 +1,102 @@
+var w = Object.defineProperty;
+var i = Object.getOwnPropertySymbols;
+var m = Object.prototype.hasOwnProperty, f = Object.prototype.propertyIsEnumerable;
+var p = (e, t, r) => t in e ? w(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, b = (e, t) => {
+  for (var r in t || (t = {}))
+    m.call(t, r) && p(e, r, t[r]);
+  if (i)
+    for (var r of i(t))
+      f.call(t, r) && p(e, r, t[r]);
+  return e;
+};
+var h = (e, t) => {
+  var r = {};
+  for (var o in e)
+    m.call(e, o) && t.indexOf(o) < 0 && (r[o] = e[o]);
+  if (e != null && i)
+    for (var o of i(e))
+      t.indexOf(o) < 0 && f.call(e, o) && (r[o] = e[o]);
+  return r;
+};
+import n from "react";
+import a from "prop-types";
+import g from "styled-components";
+import { Flex as E } from "../Flex/Flex.js";
+import { Box as y } from "../Box/Box.js";
+const l = g.div`
+  background: ${({ theme: e }) => e.colors.danger500};
+  border: none;
+  border-radius: 16px;
+  position: relative;
+  height: ${24 / 16}rem;
+  width: ${40 / 16}rem;
+
+  & span {
+    font-size: ${({ visibleLabels: e }) => e ? "1rem" : 0};
+  }
+
+  &:before {
+    content: '';
+    background: ${({ theme: e }) => e.colors.neutral0};
+    width: 1rem;
+    height: 1rem;
+    border-radius: 50%;
+    position: absolute;
+    transition: all 0.5s;
+    left: ${({ theme: e }) => e.spaces[1]};
+    top: ${({ theme: e }) => e.spaces[1]};
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    &:before {
+      transition: none;
+    }
+  }
+`, R = g.button`
+  background: transparent;
+  padding: 0;
+  border: none;
+
+  &[aria-checked='true'] ${l} {
+    background: ${({ theme: e }) => e.colors.success500};
+  }
+
+  &[aria-checked='true'] ${l}:before {
+    transform: translateX(1rem);
+  }
+`, c = n.forwardRef(
+  (x, k) => {
+    var u = x, { label: e, onChange: t, onLabel: r, offLabel: o, selected: s, visibleLabels: d } = u, $ = h(u, ["label", "onChange", "onLabel", "offLabel", "selected", "visibleLabels"]);
+    return /* @__PURE__ */ n.createElement(R, b({
+      ref: k,
+      role: "switch",
+      "aria-checked": s,
+      "aria-label": e,
+      onClick: t,
+      visibleLabels: d,
+      type: "button"
+    }, $), /* @__PURE__ */ n.createElement(E, null, /* @__PURE__ */ n.createElement(l, null, /* @__PURE__ */ n.createElement("span", null, r), /* @__PURE__ */ n.createElement("span", null, o)), d && /* @__PURE__ */ n.createElement(y, {
+      as: "span",
+      "aria-hidden": !0,
+      paddingLeft: 2,
+      color: s ? "success600" : "danger600"
+    }, s ? r : o)));
+  }
+);
+c.defaultProps = {
+  onLabel: "On",
+  offLabel: "Off",
+  visibleLabels: !1
+};
+c.propTypes = {
+  label: a.string.isRequired,
+  offLabel: a.string,
+  onChange: a.func.isRequired,
+  onLabel: a.string,
+  selected: a.bool.isRequired,
+  visibleLabels: a.bool
+};
+c.displayName = "Switch";
+export {
+  c as Switch
+};

package/dist/Switch/index.cjs

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

package/dist/Switch/index.js

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

package/dist/Table/Cell.cjs

@@ -0,0 +1,17 @@
+"use strict";var _=Object.defineProperty;var o=Object.getOwnPropertySymbols;var i=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var d=(e,l,t)=>l in e?_(e,l,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[l]=t,n=(e,l)=>{for(var t in l||(l={}))i.call(l,t)&&d(e,t,l[t]);if(o)for(var t of o(l))p.call(l,t)&&d(e,t,l[t]);return e};var f=(e,l)=>{var t={};for(var a in e)i.call(e,a)&&l.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&o)for(var a of o(e))l.indexOf(a)<0&&p.call(e,a)&&(t[a]=e[a]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("react"),R=require("styled-components"),x=require("prop-types"),b=require("../Flex/Flex.cjs"),y=require("../RawTable/RawCell.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},r=c(h),g=c(R),T=c(x),m=g.default(y.RawTd)`
+  vertical-align: middle;
+  text-align: left;
+  color: ${({theme:e})=>e.colors.neutral600};
+  outline-offset: -4px;
+
+  /**
+  * Hack to make sure the checkbox looks aligned
+  */
+  input {
+    vertical-align: sub;
+  }
+`,q=g.default.span`
+  svg {
+    height: ${4/16}rem;
+  }
+`,s=a=>{var u=a,{children:e,action:l}=u,t=f(u,["children","action"]);return r.default.createElement(m,n({as:y.RawTh},t),r.default.createElement(b.Flex,null,e,r.default.createElement(q,null,l)))};s.defaultProps={action:void 0};s.propTypes={action:T.default.node,children:T.default.node.isRequired};const v=e=>r.default.createElement(m,n({},e));exports.Td=v;exports.Th=s;

package/dist/Table/Cell.js

@@ -0,0 +1,59 @@
+var g = Object.defineProperty;
+var l = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, m = Object.prototype.propertyIsEnumerable;
+var c = (e, r, t) => r in e ? g(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, a = (e, r) => {
+  for (var t in r || (r = {}))
+    p.call(r, t) && c(e, t, r[t]);
+  if (l)
+    for (var t of l(r))
+      m.call(r, t) && c(e, t, r[t]);
+  return e;
+};
+var s = (e, r) => {
+  var t = {};
+  for (var o in e)
+    p.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && l)
+    for (var o of l(e))
+      r.indexOf(o) < 0 && m.call(e, o) && (t[o] = e[o]);
+  return t;
+};
+import n from "react";
+import u from "styled-components";
+import d from "prop-types";
+import { Flex as T } from "../Flex/Flex.js";
+import { RawTd as x, RawTh as k } from "../RawTable/RawCell.js";
+const f = u(x)`
+  vertical-align: middle;
+  text-align: left;
+  color: ${({ theme: e }) => e.colors.neutral600};
+  outline-offset: -4px;
+
+  /**
+  * Hack to make sure the checkbox looks aligned
+  */
+  input {
+    vertical-align: sub;
+  }
+`, v = u.span`
+  svg {
+    height: ${4 / 16}rem;
+  }
+`, h = (o) => {
+  var i = o, { children: e, action: r } = i, t = s(i, ["children", "action"]);
+  return /* @__PURE__ */ n.createElement(f, a({
+    as: k
+  }, t), /* @__PURE__ */ n.createElement(T, null, e, /* @__PURE__ */ n.createElement(v, null, r)));
+};
+h.defaultProps = {
+  action: void 0
+};
+h.propTypes = {
+  action: d.node,
+  children: d.node.isRequired
+};
+const W = (e) => /* @__PURE__ */ n.createElement(f, a({}, e));
+export {
+  W as Td,
+  h as Th
+};

package/dist/Table/TFooter.cjs

@@ -0,0 +1,22 @@
+"use strict";var h=Object.defineProperty;var i=Object.getOwnPropertySymbols;var s=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable;var u=(e,r,t)=>r in e?h(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,p=(e,r)=>{for(var t in r||(r={}))s.call(r,t)&&u(e,t,r[t]);if(i)for(var t of i(r))c.call(r,t)&&u(e,t,r[t]);return e};var y=(e,r)=>{var t={};for(var o in e)s.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&i)for(var o of i(e))r.indexOf(o)<0&&c.call(e,o)&&(t[o]=e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("react"),b=require("prop-types"),v=require("styled-components"),d=require("../Box/Box.cjs"),T=require("../Divider/Divider.cjs"),q=require("../Typography/Typography.cjs"),B=require("../Flex/Flex.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=l(x),f=l(b),g=l(v),_=g.default(d.Box)`
+  height: ${24/16}rem;
+  width: ${24/16}rem;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  svg {
+    height: ${10/16}rem;
+    width: ${10/16}rem;
+  }
+
+  svg path {
+    fill: ${({theme:e})=>e.colors.primary600};
+  }
+`,j=g.default(d.Box)`
+  border-radius: 0 0 ${({theme:e})=>e.borderRadius} ${({theme:e})=>e.borderRadius};
+  display: block;
+  width: 100%;
+  border: none;
+`,m=o=>{var n=o,{children:e,icon:r}=n,t=y(n,["children","icon"]);return a.default.createElement("div",null,a.default.createElement(T.Divider,null),a.default.createElement(j,p({as:"button",background:"primary100",padding:5},t),a.default.createElement(B.Flex,null,a.default.createElement(_,{"aria-hidden":!0,background:"primary200"},r),a.default.createElement(d.Box,{paddingLeft:3},a.default.createElement(q.Typography,{variant:"pi",fontWeight:"bold",textColor:"primary600"},e)))))};m.propTypes={children:f.default.string.isRequired,icon:f.default.node.isRequired};exports.TFooter=m;

package/dist/Table/TFooter.js

@@ -0,0 +1,72 @@
+var g = Object.defineProperty;
+var n = Object.getOwnPropertySymbols;
+var l = Object.prototype.hasOwnProperty, p = Object.prototype.propertyIsEnumerable;
+var m = (e, t, r) => t in e ? g(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, c = (e, t) => {
+  for (var r in t || (t = {}))
+    l.call(t, r) && m(e, r, t[r]);
+  if (n)
+    for (var r of n(t))
+      p.call(t, r) && m(e, r, t[r]);
+  return e;
+};
+var s = (e, t) => {
+  var r = {};
+  for (var o in e)
+    l.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 && p.call(e, o) && (r[o] = e[o]);
+  return r;
+};
+import i from "react";
+import u from "prop-types";
+import f from "styled-components";
+import { Box as a } from "../Box/Box.js";
+import { Divider as h } from "../Divider/Divider.js";
+import { Typography as y } from "../Typography/Typography.js";
+import { Flex as b } from "../Flex/Flex.js";
+const x = f(a)`
+  height: ${24 / 16}rem;
+  width: ${24 / 16}rem;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  svg {
+    height: ${10 / 16}rem;
+    width: ${10 / 16}rem;
+  }
+
+  svg path {
+    fill: ${({ theme: e }) => e.colors.primary600};
+  }
+`, E = f(a)`
+  border-radius: 0 0 ${({ theme: e }) => e.borderRadius} ${({ theme: e }) => e.borderRadius};
+  display: block;
+  width: 100%;
+  border: none;
+`, $ = (o) => {
+  var d = o, { children: e, icon: t } = d, r = s(d, ["children", "icon"]);
+  return /* @__PURE__ */ i.createElement("div", null, /* @__PURE__ */ i.createElement(h, null), /* @__PURE__ */ i.createElement(E, c({
+    as: "button",
+    background: "primary100",
+    padding: 5
+  }, r), /* @__PURE__ */ i.createElement(b, null, /* @__PURE__ */ i.createElement(x, {
+    "aria-hidden": !0,
+    background: "primary200"
+  }, t), /* @__PURE__ */ i.createElement(a, {
+    paddingLeft: 3
+  }, /* @__PURE__ */ i.createElement(y, {
+    variant: "pi",
+    fontWeight: "bold",
+    textColor: "primary600"
+  }, e)))));
+};
+$.propTypes = {
+  children: u.string.isRequired,
+  icon: u.node.isRequired
+};
+export {
+  $ as TFooter
+};

package/dist/Table/Table.cjs

@@ -0,0 +1,36 @@
+"use strict";var _=Object.defineProperty;var s=Object.getOwnPropertySymbols;var w=Object.prototype.hasOwnProperty,T=Object.prototype.propertyIsEnumerable;var g=(e,o,t)=>o in e?_(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,x=(e,o)=>{for(var t in o||(o={}))w.call(o,t)&&g(e,t,o[t]);if(s)for(var t of s(o))T.call(o,t)&&g(e,t,o[t]);return e};var y=(e,o)=>{var t={};for(var a in e)w.call(e,a)&&o.indexOf(a)<0&&(t[a]=e[a]);if(e!=null&&s)for(var a of s(e))o.indexOf(a)<0&&T.call(e,a)&&(t[a]=e[a]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react"),v=require("prop-types"),k=require("styled-components"),q=require("../RawTable/RawTable.cjs"),f=require("../Box/Box.cjs"),h=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=h(d),u=h(v),c=h(k),B=c.default(f.Box)`
+  overflow: hidden;
+  border: 1px solid ${({theme:e})=>e.colors.neutral150};
+`,$=c.default(q.RawTable)`
+  width: 100%;
+  white-space: nowrap;
+`,L=c.default(f.Box)`
+  position: relative;
+
+  &:before {
+    // TODO: make sure to add a token for this weird stuff
+    background: linear-gradient(90deg, #c0c0cf 0%, rgba(0, 0, 0, 0) 100%);
+    opacity: 0.2;
+    position: absolute;
+    height: 100%;
+    content: ${({overflowing:e})=>e==="both"||e==="left"?"''":void 0};
+    box-shadow: ${({theme:e})=>e.shadows.tableShadow};
+    width: ${({theme:e})=>e.spaces[2]};
+    left: 0;
+  }
+
+  &:after {
+    // TODO: make sure to add a token for this weird stuff
+    background: linear-gradient(270deg, #c0c0cf 0%, rgba(0, 0, 0, 0) 100%);
+    opacity: 0.2;
+    position: absolute;
+    height: 100%;
+    content: ${({overflowing:e})=>e==="both"||e==="right"?"''":void 0};
+    box-shadow: ${({theme:e})=>e.shadows.tableShadow};
+    width: ${({theme:e})=>e.spaces[2]};
+    right: 0;
+    top: 0;
+  }
+`,O=c.default(f.Box)`
+  overflow-x: auto;
+`,b=E=>{var p=E,{colCount:e,rowCount:o,footer:t}=p,a=y(p,["colCount","rowCount","footer"]);const i=d.useRef(null),[R,l]=d.useState(),m=r=>{const S=r.target.scrollWidth-r.target.clientWidth;if(r.target.scrollLeft===0){l("right");return}if(r.target.scrollLeft===S){l("left");return}r.target.scrollLeft>0&&l("both")};return d.useEffect(()=>{i.current.scrollWidth>i.current.clientWidth&&l("right")},[]),n.default.createElement(B,{shadow:"tableShadow",hasRadius:!0,background:"neutral0"},n.default.createElement(L,{overflowing:R},n.default.createElement(O,{ref:i,onScroll:m,paddingLeft:6,paddingRight:6},n.default.createElement($,x({colCount:e,rowCount:o},a)))),t)};b.defaultProps={footer:void 0};b.propTypes={colCount:u.default.number.isRequired,footer:u.default.node,rowCount:u.default.number.isRequired};exports.Table=b;

package/dist/Table/Table.js

@@ -0,0 +1,103 @@
+var S = Object.defineProperty;
+var l = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, b = Object.prototype.propertyIsEnumerable;
+var u = (t, o, e) => o in t ? S(t, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[o] = e, g = (t, o) => {
+  for (var e in o || (o = {}))
+    p.call(o, e) && u(t, e, o[e]);
+  if (l)
+    for (var e of l(o))
+      b.call(o, e) && u(t, e, o[e]);
+  return t;
+};
+var m = (t, o) => {
+  var e = {};
+  for (var r in t)
+    p.call(t, r) && o.indexOf(r) < 0 && (e[r] = t[r]);
+  if (t != null && l)
+    for (var r of l(t))
+      o.indexOf(r) < 0 && b.call(t, r) && (e[r] = t[r]);
+  return e;
+};
+import n, { useRef as k, useState as $, useEffect as v } from "react";
+import c from "prop-types";
+import s from "styled-components";
+import { RawTable as y } from "../RawTable/RawTable.js";
+import { Box as f } from "../Box/Box.js";
+const E = s(f)`
+  overflow: hidden;
+  border: 1px solid ${({ theme: t }) => t.colors.neutral150};
+`, L = s(y)`
+  width: 100%;
+  white-space: nowrap;
+`, O = s(f)`
+  position: relative;
+
+  &:before {
+    // TODO: make sure to add a token for this weird stuff
+    background: linear-gradient(90deg, #c0c0cf 0%, rgba(0, 0, 0, 0) 100%);
+    opacity: 0.2;
+    position: absolute;
+    height: 100%;
+    content: ${({ overflowing: t }) => t === "both" || t === "left" ? "''" : void 0};
+    box-shadow: ${({ theme: t }) => t.shadows.tableShadow};
+    width: ${({ theme: t }) => t.spaces[2]};
+    left: 0;
+  }
+
+  &:after {
+    // TODO: make sure to add a token for this weird stuff
+    background: linear-gradient(270deg, #c0c0cf 0%, rgba(0, 0, 0, 0) 100%);
+    opacity: 0.2;
+    position: absolute;
+    height: 100%;
+    content: ${({ overflowing: t }) => t === "both" || t === "right" ? "''" : void 0};
+    box-shadow: ${({ theme: t }) => t.shadows.tableShadow};
+    width: ${({ theme: t }) => t.spaces[2]};
+    right: 0;
+    top: 0;
+  }
+`, W = s(f)`
+  overflow-x: auto;
+`, w = (C) => {
+  var h = C, { colCount: t, rowCount: o, footer: e } = h, r = m(h, ["colCount", "rowCount", "footer"]);
+  const d = k(null), [T, i] = $(), x = (a) => {
+    const R = a.target.scrollWidth - a.target.clientWidth;
+    if (a.target.scrollLeft === 0) {
+      i("right");
+      return;
+    }
+    if (a.target.scrollLeft === R) {
+      i("left");
+      return;
+    }
+    a.target.scrollLeft > 0 && i("both");
+  };
+  return v(() => {
+    d.current.scrollWidth > d.current.clientWidth && i("right");
+  }, []), /* @__PURE__ */ n.createElement(E, {
+    shadow: "tableShadow",
+    hasRadius: !0,
+    background: "neutral0"
+  }, /* @__PURE__ */ n.createElement(O, {
+    overflowing: T
+  }, /* @__PURE__ */ n.createElement(W, {
+    ref: d,
+    onScroll: x,
+    paddingLeft: 6,
+    paddingRight: 6
+  }, /* @__PURE__ */ n.createElement(L, g({
+    colCount: t,
+    rowCount: o
+  }, r)))), e);
+};
+w.defaultProps = {
+  footer: void 0
+};
+w.propTypes = {
+  colCount: c.number.isRequired,
+  footer: c.node,
+  rowCount: c.number.isRequired
+};
+export {
+  w as Table
+};

package/dist/Table/Tbody.cjs

@@ -0,0 +1,5 @@
+"use strict";var l=Object.defineProperty;var a=Object.getOwnPropertySymbols;var n=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable;var r=(e,t,o)=>t in e?l(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,d=(e,t)=>{for(var o in t||(t={}))n.call(t,o)&&r(e,o,t[o]);if(a)for(var o of a(t))s.call(t,o)&&r(e,o,t[o]);return e};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react"),y=require("styled-components"),b=require("../RawTable/RawTbody.cjs"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},f=c(u),i=c(y),T=i.default(b.RawTbody)`
+  & tr:last-of-type {
+    border-bottom: none;
+  }
+`,p=e=>f.default.createElement(T,d({},e));exports.Tbody=p;

package/dist/Table/Tbody.js

@@ -0,0 +1,22 @@
+var a = Object.defineProperty;
+var e = Object.getOwnPropertySymbols;
+var d = Object.prototype.hasOwnProperty, n = Object.prototype.propertyIsEnumerable;
+var m = (r, o, t) => o in r ? a(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t, p = (r, o) => {
+  for (var t in o || (o = {}))
+    d.call(o, t) && m(r, t, o[t]);
+  if (e)
+    for (var t of e(o))
+      n.call(o, t) && m(r, t, o[t]);
+  return r;
+};
+import b from "react";
+import f from "styled-components";
+import { RawTbody as y } from "../RawTable/RawTbody.js";
+const c = f(y)`
+  & tr:last-of-type {
+    border-bottom: none;
+  }
+`, u = (r) => /* @__PURE__ */ b.createElement(c, p({}, r));
+export {
+  u as Tbody
+};

package/dist/Table/Thead.cjs

@@ -0,0 +1,3 @@
+"use strict";var c=Object.defineProperty;var o=Object.getOwnPropertySymbols;var s=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable;var r=(e,t,a)=>t in e?c(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a,d=(e,t)=>{for(var a in t||(t={}))s.call(t,a)&&r(e,a,t[a]);if(o)for(var a of o(t))u.call(t,a)&&r(e,a,t[a]);return e};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react"),i=require("styled-components"),f=require("../RawTable/RawThead.cjs"),l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},T=l(n),p=l(i),_=p.default(f.RawThead)`
+  border-bottom: 1px solid ${({theme:e})=>e.colors.neutral150};
+`,b=e=>T.default.createElement(_,d({},e));exports.Thead=b;

package/dist/Table/Thead.js

@@ -0,0 +1,20 @@
+var d = Object.defineProperty;
+var t = Object.getOwnPropertySymbols;
+var p = Object.prototype.hasOwnProperty, l = Object.prototype.propertyIsEnumerable;
+var a = (r, e, o) => e in r ? d(r, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : r[e] = o, m = (r, e) => {
+  for (var o in e || (e = {}))
+    p.call(e, o) && a(r, o, e[o]);
+  if (t)
+    for (var o of t(e))
+      l.call(e, o) && a(r, o, e[o]);
+  return r;
+};
+import c from "react";
+import n from "styled-components";
+import { RawThead as s } from "../RawTable/RawThead.js";
+const f = n(s)`
+  border-bottom: 1px solid ${({ theme: r }) => r.colors.neutral150};
+`, b = (r) => /* @__PURE__ */ c.createElement(f, m({}, r));
+export {
+  b as Thead
+};

package/dist/Table/Tr.cjs

@@ -0,0 +1,20 @@
+"use strict";var n=Object.defineProperty;var r=Object.getOwnPropertySymbols;var i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable;var o=(t,e,a)=>e in t?n(t,e,{enumerable:!0,configurable:!0,writable:!0,value:a}):t[e]=a,d=(t,e)=>{for(var a in e||(e={}))i.call(e,a)&&o(t,a,e[a]);if(r)for(var a of r(e))c.call(e,a)&&o(t,a,e[a]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),u=require("styled-components"),p=require("../RawTable/RawTr.cjs"),s=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},f=s(l),g=s(u),y=g.default(p.RawTr)`
+  border-bottom: 1px solid ${({theme:t})=>t.colors.neutral150};
+
+  & td,
+  & th {
+    padding: ${({theme:t})=>t.spaces[4]};
+  }
+
+  & td:first-of-type,
+  & th:first-of-type {
+    padding: 0 ${({theme:t})=>t.spaces[1]};
+  }
+
+  // Resetting padding values and fixing a height
+  th {
+    padding-top: 0;
+    padding-bottom: 0;
+    height: ${56/16}rem;
+  }
+`,T=t=>f.default.createElement(y,d({},t));exports.Tr=T;

package/dist/Table/Tr.js

@@ -0,0 +1,37 @@
+var a = Object.defineProperty;
+var o = Object.getOwnPropertySymbols;
+var i = Object.prototype.hasOwnProperty, n = Object.prototype.propertyIsEnumerable;
+var d = (t, e, r) => e in t ? a(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r, p = (t, e) => {
+  for (var r in e || (e = {}))
+    i.call(e, r) && d(t, r, e[r]);
+  if (o)
+    for (var r of o(e))
+      n.call(e, r) && d(t, r, e[r]);
+  return t;
+};
+import s from "react";
+import m from "styled-components";
+import { RawTr as f } from "../RawTable/RawTr.js";
+const g = m(f)`
+  border-bottom: 1px solid ${({ theme: t }) => t.colors.neutral150};
+
+  & td,
+  & th {
+    padding: ${({ theme: t }) => t.spaces[4]};
+  }
+
+  & td:first-of-type,
+  & th:first-of-type {
+    padding: 0 ${({ theme: t }) => t.spaces[1]};
+  }
+
+  // Resetting padding values and fixing a height
+  th {
+    padding-top: 0;
+    padding-bottom: 0;
+    height: ${56 / 16}rem;
+  }
+`, $ = (t) => /* @__PURE__ */ s.createElement(g, p({}, t));
+export {
+  $ as Tr
+};

package/dist/Table/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("./Table.cjs"),T=require("./Tbody.cjs"),o=require("./Thead.cjs"),t=require("./Tr.cjs"),e=require("./Cell.cjs"),s=require("./TFooter.cjs");exports.Table=r.Table;exports.Tbody=T.Tbody;exports.Thead=o.Thead;exports.Tr=t.Tr;exports.Td=e.Td;exports.Th=e.Th;exports.TFooter=s.TFooter;

package/dist/Table/index.js

@@ -0,0 +1,15 @@
+import { Table as e } from "./Table.js";
+import { Tbody as T } from "./Tbody.js";
+import { Thead as m } from "./Thead.js";
+import { Tr as x } from "./Tr.js";
+import { Td as a, Th as b } from "./Cell.js";
+import { TFooter as l } from "./TFooter.js";
+export {
+  l as TFooter,
+  e as Table,
+  T as Tbody,
+  a as Td,
+  b as Th,
+  m as Thead,
+  x as Tr
+};

package/dist/Tabs/TabGroup.cjs

@@ -0,0 +1 @@
+"use strict";var C=Object.defineProperty;var n=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var b=(e,t,a)=>t in e?C(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a,y=(e,t)=>{for(var a in t||(t={}))T.call(t,a)&&b(e,a,t[a]);if(n)for(var a of n(t))v.call(t,a)&&b(e,a,t[a]);return e};var I=(e,t)=>{var a={};for(var d in e)T.call(e,d)&&t.indexOf(d)<0&&(a[d]=e[d]);if(e!=null&&n)for(var d of n(e))t.indexOf(d)<0&&v.call(e,d)&&(a[d]=e[d]);return a};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),S=require("prop-types"),P=require("./TabsContext.cjs"),R=require("../helpers/useId.cjs"),h=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},g=h(s),r=h(S),i=s.forwardRef((j,x)=>{var c=j,{id:e,initialSelectedTabIndex:t,label:a,onTabChange:d,variant:m}=c,u=I(c,["id","initialSelectedTabIndex","label","onTabChange","variant"]);const _=R.useId("tabgroup",e),p=s.Children.toArray(u.children).find(l=>l.type.displayName==="Tabs");let o=t||0;p&&t===void 0&&(o=p.props.children.findIndex(l=>!l.props.disabled));const[q,f]=s.useState(o===-1?0:o);return s.useImperativeHandle(x,()=>({_handlers:{setSelectedTabIndex:f}})),g.default.createElement(P.TabsContext.Provider,{value:{id:_,selectedTabIndex:q,selectTabIndex:f,label:a,variant:m,onTabChange:d}},g.default.createElement("div",y({},u)))});i.displayName="TabGroup";i.defaultProps={id:void 0,initialSelectedTabIndex:void 0,onTabChange(){},variant:void 0};i.propTypes={children:r.default.node.isRequired,id:r.default.string,initialSelectedTabIndex:r.default.number,label:r.default.string.isRequired,onTabChange:r.default.func,variant:r.default.oneOf(["simple"])};exports.TabGroup=i;