@strapi/design-system 0.0.0-599b75fb-test

package/dist/Button/Button.js

@@ -0,0 +1,98 @@
+import { jsxs as h, jsx as t } from "react/jsx-runtime";
+import b from "react";
+import { Loader as y } from "@strapi/icons";
+import s, { keyframes as v } from "styled-components";
+import { DEFAULT as B, BUTTON_SIZES as S } from "./constants.js";
+import { getDisabledStyle as l, getHoverStyle as $, getActiveStyle as x, getVariantStyle as C } from "./utils.js";
+import { BaseButton as k } from "../BaseButton/BaseButton.js";
+import { Box as L } from "../Box/Box.js";
+import { Flex as T } from "../Flex/Flex.js";
+import { Typography as j } from "../Typography/Typography.js";
+const w = v`
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(359deg);
+  }
+`, D = s.div`
+  animation: ${w} 2s infinite linear;
+  will-change: transform;
+`, N = s(k)`
+  height: ${({
+  theme: i,
+  size: e
+}) => i.sizes.button[e]};
+
+  &[aria-disabled='true'] {
+    ${l}
+
+    &:active {
+      ${l}
+    }
+  }
+
+  &:hover {
+    ${$}
+  }
+
+  &:active {
+    ${x}
+  }
+
+  ${C}
+`, R = b.forwardRef(({
+  variant: i = B,
+  startIcon: e,
+  endIcon: n,
+  disabled: f = !1,
+  children: p,
+  onClick: d,
+  size: m = S[0],
+  loading: o = !1,
+  fullWidth: r = !1,
+  ...c
+}, u) => {
+  const a = f || o;
+  return h(N, {
+    ref: u,
+    "aria-disabled": a,
+    disabled: a,
+    size: m,
+    variant: i,
+    onClick: (g) => {
+      !a && d && d(g);
+    },
+    fullWidth: r,
+    alignItems: "center",
+    background: "buttonPrimary600",
+    borderColor: "buttonPrimary600",
+    gap: 2,
+    inline: r,
+    justifyContent: r ? "center" : void 0,
+    paddingLeft: 4,
+    paddingRight: 4,
+    width: r ? "100%" : void 0,
+    ...c,
+    children: [(e || o) && t(L, {
+      "aria-hidden": !0,
+      children: o ? t(D, {
+        children: t(y, {})
+      }) : e
+    }), t(j, {
+      variant: m === "S" ? "pi" : void 0,
+      fontWeight: "bold",
+      lineHeight: 0,
+      textColor: "buttonNeutral0",
+      children: p
+    }), n && t(T, {
+      "aria-hidden": !0,
+      children: n
+    })]
+  });
+});
+R.displayName = "Button";
+export {
+  R as Button,
+  N as ButtonWrapper
+};

package/dist/Button/constants.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const S="success-light",t="danger-light",s="default",T="tertiary",e="secondary",c="danger",o="success",A="ghost",n=[S,t],E=[s,T,e,c,o,A,...n],I=["S","M","L"];exports.BUTTON_SIZES=I;exports.DANGER=c;exports.DANGER_LIGHT=t;exports.DEFAULT=s;exports.GHOST=A;exports.LIGHT_VARIANTS=n;exports.SECONDARY=e;exports.SUCCESS=o;exports.SUCCESS_LIGHT=S;exports.TERTIARY=T;exports.VARIANTS=E;

package/dist/Button/constants.js

@@ -0,0 +1,14 @@
+const s = "success-light", t = "danger-light", c = "default", n = "tertiary", o = "secondary", S = "danger", T = "success", A = "ghost", e = [s, t], E = [c, n, o, S, T, A, ...e], I = ["S", "M", "L"];
+export {
+  I as BUTTON_SIZES,
+  S as DANGER,
+  t as DANGER_LIGHT,
+  c as DEFAULT,
+  A as GHOST,
+  e as LIGHT_VARIANTS,
+  o as SECONDARY,
+  T as SUCCESS,
+  s as SUCCESS_LIGHT,
+  n as TERTIARY,
+  E as VARIANTS
+};

package/dist/Button/index.cjs

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

package/dist/Button/index.js

@@ -0,0 +1,5 @@
+import { Button as r, ButtonWrapper as p } from "./Button.js";
+export {
+  r as Button,
+  p as ButtonWrapper
+};

package/dist/Button/utils.cjs

@@ -0,0 +1,87 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("./constants.cjs"),s=require("../Typography/Typography.cjs"),c=o=>o===l.SUCCESS_LIGHT||o===l.DANGER_LIGHT?`${o.substring(0,o.lastIndexOf("-"))}`:o===l.TERTIARY?"neutral":o===l.DEFAULT||o===l.SECONDARY||l.VARIANTS.every(r=>r!==o)?"primary":`${o}`,u=({theme:o})=>`
+    border: 1px solid ${o.colors.neutral200};
+    background: ${o.colors.neutral150};
+    ${s.Typography} {
+      color: ${o.colors.neutral600};
+    }
+    svg {
+      > g, path {
+        fill: ${o.colors.neutral600};
+      }
+    }
+  `,$=({theme:o,variant:r})=>[...l.LIGHT_VARIANTS,l.SECONDARY].includes(r)?`
+      background-color: ${o.colors.neutral0};
+    `:r===l.TERTIARY?`
+      background-color: ${o.colors.neutral100};
+    `:r===l.GHOST?`
+      background-color: ${o.colors.neutral100};
+    `:r===l.DEFAULT?`
+      border: 1px solid ${o.colors.buttonPrimary500};
+      background: ${o.colors.buttonPrimary500};
+    `:`
+    border: 1px solid ${o.colors[`${c(r)}500`]};
+    background: ${o.colors[`${c(r)}500`]};
+  `,n=({theme:o,variant:r})=>[...l.LIGHT_VARIANTS,l.SECONDARY].includes(r)?`
+      background-color: ${o.colors.neutral0};
+      border: 1px solid ${o.colors[`${c(r)}600`]};
+      ${s.Typography} {
+        color: ${o.colors[`${c(r)}600`]};
+      }
+      svg {
+        > g, path {
+          fill: ${o.colors[`${c(r)}600`]};
+        }
+      }
+    `:r===l.TERTIARY?`
+      background-color: ${o.colors.neutral150};
+    `:`
+    border: 1px solid ${o.colors[`${c(r)}600`]};
+    background: ${o.colors[`${c(r)}600`]};
+  `,g=({theme:o,variant:r})=>{switch(r){case l.DANGER_LIGHT:case l.SUCCESS_LIGHT:case l.SECONDARY:return`
+          border: 1px solid ${o.colors[`${c(r)}200`]};
+          background: ${o.colors[`${c(r)}100`]};
+          ${s.Typography} {
+            color: ${o.colors[`${c(r)}700`]};
+          }
+          svg {
+            > g, path {
+              fill: ${o.colors[`${c(r)}700`]};
+            }
+          }
+        `;case l.TERTIARY:return`
+          border: 1px solid ${o.colors.neutral200};
+          background: ${o.colors.neutral0};
+          ${s.Typography} {
+            color: ${o.colors.neutral800};
+          }
+          svg {
+            > g, path {
+              fill: ${o.colors.neutral800};
+            }
+          }
+        `;case l.GHOST:return`
+        border: 1px solid transparent;
+        background: transparent;
+
+        ${s.Typography} {
+          color: ${o.colors.neutral800};
+        }
+
+        svg {
+          > g, path {
+            fill: ${o.colors.neutral500};
+          }
+        }
+      `;case l.SUCCESS:case l.DANGER:return`
+          border: 1px solid ${o.colors[`${c(r)}600`]};
+          background: ${o.colors[`${c(r)}600`]};
+          ${s.Typography} {
+            color: ${o.colors.neutral0};
+          }
+        `;default:return`
+          svg {
+            > g, path {
+              fill: ${o.colors.buttonNeutral0};
+            }
+          }
+        `}};exports.getActiveStyle=n;exports.getDisabledStyle=u;exports.getHoverStyle=$;exports.getVariantColorName=c;exports.getVariantStyle=g;

package/dist/Button/utils.js

@@ -0,0 +1,112 @@
+import { SUCCESS_LIGHT as $, DANGER_LIGHT as n, TERTIARY as s, DEFAULT as d, SECONDARY as u, VARIANTS as p, LIGHT_VARIANTS as g, GHOST as b, DANGER as t, SUCCESS as f } from "./constants.js";
+import { Typography as c } from "../Typography/Typography.js";
+const l = (o) => o === $ || o === n ? `${o.substring(0, o.lastIndexOf("-"))}` : o === s ? "neutral" : o === d || o === u || p.every((r) => r !== o) ? "primary" : `${o}`, k = ({ theme: o }) => `
+    border: 1px solid ${o.colors.neutral200};
+    background: ${o.colors.neutral150};
+    ${c} {
+      color: ${o.colors.neutral600};
+    }
+    svg {
+      > g, path {
+        fill: ${o.colors.neutral600};
+      }
+    }
+  `, i = ({ theme: o, variant: r }) => [...g, u].includes(r) ? `
+      background-color: ${o.colors.neutral0};
+    ` : r === s ? `
+      background-color: ${o.colors.neutral100};
+    ` : r === b ? `
+      background-color: ${o.colors.neutral100};
+    ` : r === d ? `
+      border: 1px solid ${o.colors.buttonPrimary500};
+      background: ${o.colors.buttonPrimary500};
+    ` : `
+    border: 1px solid ${o.colors[`${l(r)}500`]};
+    background: ${o.colors[`${l(r)}500`]};
+  `, x = ({ theme: o, variant: r }) => [...g, u].includes(r) ? `
+      background-color: ${o.colors.neutral0};
+      border: 1px solid ${o.colors[`${l(r)}600`]};
+      ${c} {
+        color: ${o.colors[`${l(r)}600`]};
+      }
+      svg {
+        > g, path {
+          fill: ${o.colors[`${l(r)}600`]};
+        }
+      }
+    ` : r === s ? `
+      background-color: ${o.colors.neutral150};
+    ` : `
+    border: 1px solid ${o.colors[`${l(r)}600`]};
+    background: ${o.colors[`${l(r)}600`]};
+  `, a = ({ theme: o, variant: r }) => {
+  switch (r) {
+    case n:
+    case $:
+    case u:
+      return `
+          border: 1px solid ${o.colors[`${l(r)}200`]};
+          background: ${o.colors[`${l(r)}100`]};
+          ${c} {
+            color: ${o.colors[`${l(r)}700`]};
+          }
+          svg {
+            > g, path {
+              fill: ${o.colors[`${l(r)}700`]};
+            }
+          }
+        `;
+    case s:
+      return `
+          border: 1px solid ${o.colors.neutral200};
+          background: ${o.colors.neutral0};
+          ${c} {
+            color: ${o.colors.neutral800};
+          }
+          svg {
+            > g, path {
+              fill: ${o.colors.neutral800};
+            }
+          }
+        `;
+    case b:
+      return `
+        border: 1px solid transparent;
+        background: transparent;
+
+        ${c} {
+          color: ${o.colors.neutral800};
+        }
+
+        svg {
+          > g, path {
+            fill: ${o.colors.neutral500};
+          }
+        }
+      `;
+    case f:
+    case t:
+      return `
+          border: 1px solid ${o.colors[`${l(r)}600`]};
+          background: ${o.colors[`${l(r)}600`]};
+          ${c} {
+            color: ${o.colors.neutral0};
+          }
+        `;
+    default:
+      return `
+          svg {
+            > g, path {
+              fill: ${o.colors.buttonNeutral0};
+            }
+          }
+        `;
+  }
+};
+export {
+  x as getActiveStyle,
+  k as getDisabledStyle,
+  i as getHoverStyle,
+  l as getVariantColorName,
+  a as getVariantStyle
+};

package/dist/Card/Card.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),a=require("react"),d=require("./CardContext.cjs"),u=require("../Box/Box.cjs"),n=require("../hooks/useId.cjs"),c=({id:r,...o})=>{const e=n.useId(r),s=a.useMemo(()=>({id:e}),[e]);return t.jsx(d.CardContext.Provider,{value:s,children:t.jsx(u.Box,{id:r,tabIndex:0,hasRadius:!0,background:"neutral0",borderStyle:"solid",borderWidth:"1px",borderColor:"neutral150",shadow:"tableShadow",as:"article","aria-labelledby":`${e}-title`,...o})})};exports.Card=c;

package/dist/Card/Card.js

@@ -0,0 +1,32 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useMemo as a } from "react";
+import { CardContext as i } from "./CardContext.js";
+import { Box as l } from "../Box/Box.js";
+import { useId as n } from "../hooks/useId.js";
+const p = ({
+  id: o,
+  ...t
+}) => {
+  const r = n(o), d = a(() => ({
+    id: r
+  }), [r]);
+  return e(i.Provider, {
+    value: d,
+    children: e(l, {
+      id: o,
+      tabIndex: 0,
+      hasRadius: !0,
+      background: "neutral0",
+      borderStyle: "solid",
+      borderWidth: "1px",
+      borderColor: "neutral150",
+      shadow: "tableShadow",
+      as: "article",
+      "aria-labelledby": `${r}-title`,
+      ...t
+    })
+  });
+};
+export {
+  p as Card
+};

package/dist/Card/CardAction.cjs

@@ -0,0 +1,6 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("styled-components"),r=require("../Stack/Stack.cjs"),s=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},a=s(n),o=a.default(r.Stack).attrs({horizontal:!0,spacing:2})`
+  position: absolute;
+  top: ${({theme:t})=>t.spaces[3]};
+  right: ${({position:t,theme:e})=>{if(t==="end")return e.spaces[3]}};
+  left: ${({position:t,theme:e})=>{if(t==="start")return e.spaces[3]}};
+`;exports.CardAction=o;

package/dist/Card/CardAction.js

@@ -0,0 +1,20 @@
+import e from "styled-components";
+import { Stack as n } from "../Stack/Stack.js";
+const i = e(n).attrs({
+  horizontal: !0,
+  spacing: 2
+})`
+  position: absolute;
+  top: ${({ theme: t }) => t.spaces[3]};
+  right: ${({ position: t, theme: r }) => {
+  if (t === "end")
+    return r.spaces[3];
+}};
+  left: ${({ position: t, theme: r }) => {
+  if (t === "start")
+    return r.spaces[3];
+}};
+`;
+export {
+  i as CardAction
+};

package/dist/Card/CardAsset.cjs

@@ -0,0 +1,19 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),a=require("styled-components"),o=require("../Flex/Flex.cjs"),n=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=n(a),d=i.default.img`
+  // inline flows is based on typography and displays an extra white space below the image
+  // switch to block is required in order to make the img stick the bottom of the container
+  // addition infos: https://stackoverflow.com/questions/5804256/image-inside-div-has-extra-space-below-the-image
+  margin: 0;
+  padding: 0;
+  max-height: 100%;
+  max-width: 100%;
+  object-fit: contain;
+`,c={S:88,M:164},l=i.default.div`
+  display: flex;
+  justify-content: center;
+  height: ${({size:e})=>c[e]/16}rem;
+  width: 100%;
+  background: repeating-conic-gradient(${({theme:e})=>e.colors.neutral100} 0% 25%, transparent 0% 50%) 50% / 20px
+    20px;
+  border-top-left-radius: ${({theme:e})=>e.borderRadius};
+  border-top-right-radius: ${({theme:e})=>e.borderRadius};
+`,u=({size:e="M",children:s,...r})=>t.jsx(l,{size:e,children:s?t.jsx(o.Flex,{children:s}):t.jsx(d,{...r,"aria-hidden":!0})});exports.CardAsset=u;

package/dist/Card/CardAsset.js

@@ -0,0 +1,48 @@
+import { jsx as t } from "react/jsx-runtime";
+import r from "styled-components";
+import { Flex as s } from "../Flex/Flex.js";
+const a = r.img`
+  // inline flows is based on typography and displays an extra white space below the image
+  // switch to block is required in order to make the img stick the bottom of the container
+  // addition infos: https://stackoverflow.com/questions/5804256/image-inside-div-has-extra-space-below-the-image
+  margin: 0;
+  padding: 0;
+  max-height: 100%;
+  max-width: 100%;
+  object-fit: contain;
+`, n = {
+  S: 88,
+  M: 164
+}, d = r.div`
+  display: flex;
+  justify-content: center;
+  height: ${({
+  size: e
+}) => n[e] / 16}rem;
+  width: 100%;
+  background: repeating-conic-gradient(${({
+  theme: e
+}) => e.colors.neutral100} 0% 25%, transparent 0% 50%) 50% / 20px
+    20px;
+  border-top-left-radius: ${({
+  theme: e
+}) => e.borderRadius};
+  border-top-right-radius: ${({
+  theme: e
+}) => e.borderRadius};
+`, m = ({
+  size: e = "M",
+  children: i,
+  ...o
+}) => t(d, {
+  size: e,
+  children: i ? t(s, {
+    children: i
+  }) : t(a, {
+    ...o,
+    "aria-hidden": !0
+  })
+});
+export {
+  m as CardAsset
+};

package/dist/Card/CardBadge.cjs

@@ -0,0 +1,6 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),s=require("styled-components"),d=require("../Badge/Badge.cjs"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=r(s),n=a.default.div`
+  margin-left: auto;
+  flex-shrink: 0;
+`,o=a.default(d.Badge)`
+  margin-left: ${({theme:e})=>e.spaces[1]};
+`,i=e=>t.jsx(n,{children:t.jsx(o,{...e})});exports.CardBadge=i;

package/dist/Card/CardBadge.js

@@ -0,0 +1,18 @@
+import { jsx as o } from "react/jsx-runtime";
+import e from "styled-components";
+import { Badge as t } from "../Badge/Badge.js";
+const a = e.div`
+  margin-left: auto;
+  flex-shrink: 0;
+`, i = e(t)`
+  margin-left: ${({
+  theme: r
+}) => r.spaces[1]};
+`, n = (r) => o(a, {
+  children: o(i, {
+    ...r
+  })
+});
+export {
+  n as CardBadge
+};

package/dist/Card/CardBody.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),r=require("../Box/Box.cjs"),o=require("../Flex/Flex.cjs"),d=t=>e.jsx(r.Box,{paddingLeft:3,paddingRight:3,paddingTop:2,paddingBottom:2,children:e.jsx(o.Flex,{...t,alignItems:"flex-start"})});exports.CardBody=d;

package/dist/Card/CardBody.js

@@ -0,0 +1,16 @@
+import { jsx as o } from "react/jsx-runtime";
+import { Box as r } from "../Box/Box.js";
+import { Flex as d } from "../Flex/Flex.js";
+const n = (t) => o(r, {
+  paddingLeft: 3,
+  paddingRight: 3,
+  paddingTop: 2,
+  paddingBottom: 2,
+  children: o(d, {
+    ...t,
+    alignItems: "flex-start"
+  })
+});
+export {
+  n as CardBody
+};

package/dist/Card/CardCheckbox.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("./CardAction.cjs"),s=require("./CardContext.cjs"),c=require("../BaseCheckbox/BaseCheckbox.cjs"),a=t=>{const{id:r}=s.useCard();return e.jsx(o.CardAction,{position:"start",children:e.jsx(c.BaseCheckbox,{"aria-labelledby":`${r}-title`,...t})})};exports.CardCheckbox=a;

package/dist/Card/CardCheckbox.js

@@ -0,0 +1,19 @@
+import { jsx as r } from "react/jsx-runtime";
+import { CardAction as i } from "./CardAction.js";
+import { useCard as e } from "./CardContext.js";
+import { BaseCheckbox as a } from "../BaseCheckbox/BaseCheckbox.js";
+const n = (o) => {
+  const {
+    id: t
+  } = e();
+  return r(i, {
+    position: "start",
+    children: r(a, {
+      "aria-labelledby": `${t}-title`,
+      ...o
+    })
+  });
+};
+export {
+  n as CardCheckbox
+};

package/dist/Card/CardContent.cjs

@@ -0,0 +1,3 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),r=require("styled-components"),n=require("../Box/Box.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},u=s(r),a=u.default(n.Box)`
+  word-break: break-all;
+`,l=({children:e,...t})=>o.jsx(a,{...t,children:e});exports.CardContent=l;

package/dist/Card/CardContent.js

@@ -0,0 +1,15 @@
+import { jsx as t } from "react/jsx-runtime";
+import e from "styled-components";
+import { Box as m } from "../Box/Box.js";
+const n = e(m)`
+  word-break: break-all;
+`, l = ({
+  children: r,
+  ...o
+}) => t(n, {
+  ...o,
+  children: r
+});
+export {
+  l as CardContent
+};

package/dist/Card/CardContext.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react"),t=e.createContext({id:""}),r=()=>e.useContext(t);exports.CardContext=t;exports.useCard=r;

package/dist/Card/CardContext.js

@@ -0,0 +1,8 @@
+import { createContext as t, useContext as e } from "react";
+const o = t({
+  id: ""
+}), n = () => e(o);
+export {
+  o as CardContext,
+  n as useCard
+};

package/dist/Card/CardHeader.cjs

@@ -0,0 +1,3 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),r=require("styled-components"),o=require("../Flex/Flex.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=s(r),n=l.default(o.Flex)`
+  border-bottom: 1px solid ${({theme:e})=>e.colors.neutral150};
+`,a=e=>t.jsx(n,{position:"relative",justifyContent:"center",...e});exports.CardHeader=a;

package/dist/Card/CardHeader.js

@@ -0,0 +1,15 @@
+import { jsx as o } from "react/jsx-runtime";
+import t from "styled-components";
+import { Flex as e } from "../Flex/Flex.js";
+const i = t(e)`
+  border-bottom: 1px solid ${({
+  theme: r
+}) => r.colors.neutral150};
+`, a = (r) => o(i, {
+  position: "relative",
+  justifyContent: "center",
+  ...r
+});
+export {
+  a as CardHeader
+};

package/dist/Card/CardTimer.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),t=require("../Box/Box.cjs"),a=require("../Typography/Typography.cjs"),i=({children:r,...o})=>e.jsx(t.Box,{as:"time",background:"neutral800",bottom:1,right:1,color:"neutral0",hasRadius:!0,position:"absolute",padding:1,...o,children:e.jsx(a.Typography,{variant:"pi",textColor:"neutral0",children:r})});exports.CardTimer=i;

package/dist/Card/CardTimer.js

@@ -0,0 +1,25 @@
+import { jsx as r } from "react/jsx-runtime";
+import { Box as i } from "../Box/Box.js";
+import { Typography as a } from "../Typography/Typography.js";
+const p = ({
+  children: o,
+  ...t
+}) => r(i, {
+  as: "time",
+  background: "neutral800",
+  bottom: 1,
+  right: 1,
+  color: "neutral0",
+  hasRadius: !0,
+  position: "absolute",
+  padding: 1,
+  ...t,
+  children: r(a, {
+    variant: "pi",
+    textColor: "neutral0",
+    children: o
+  })
+});
+export {
+  p as CardTimer
+};

package/dist/Card/CardTitle.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("./CardContext.cjs"),r=require("../Typography/Typography.cjs"),i=t=>{const{id:a}=o.useCard();return e.jsx(r.Typography,{variant:"pi",id:`${a}-title`,textColor:"neutral800",fontWeight:"bold",as:"div",...t})},n=t=>e.jsx(r.Typography,{variant:"pi",...t,textColor:"neutral600",as:"div"});exports.CardSubtitle=n;exports.CardTitle=i;

package/dist/Card/CardTitle.js

@@ -0,0 +1,25 @@
+import { jsx as r } from "react/jsx-runtime";
+import { useCard as a } from "./CardContext.js";
+import { Typography as o } from "../Typography/Typography.js";
+const l = (t) => {
+  const {
+    id: i
+  } = a();
+  return r(o, {
+    variant: "pi",
+    id: `${i}-title`,
+    textColor: "neutral800",
+    fontWeight: "bold",
+    as: "div",
+    ...t
+  });
+}, p = (t) => r(o, {
+  variant: "pi",
+  ...t,
+  textColor: "neutral600",
+  as: "div"
+});
+export {
+  p as CardSubtitle,
+  l as CardTitle
+};

package/dist/Card/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./Card.cjs"),d=require("./CardAction.cjs"),a=require("./CardAsset.cjs"),C=require("./CardBadge.cjs"),t=require("./CardBody.cjs"),s=require("./CardCheckbox.cjs"),o=require("./CardContent.cjs"),c=require("./CardHeader.cjs"),i=require("./CardTimer.cjs"),r=require("./CardTitle.cjs");exports.Card=e.Card;exports.CardAction=d.CardAction;exports.CardAsset=a.CardAsset;exports.CardBadge=C.CardBadge;exports.CardBody=t.CardBody;exports.CardCheckbox=s.CardCheckbox;exports.CardContent=o.CardContent;exports.CardHeader=c.CardHeader;exports.CardTimer=i.CardTimer;exports.CardSubtitle=r.CardSubtitle;exports.CardTitle=r.CardTitle;