@fluidattacks/design 3.1.13 → 3.1.14

package/dist/components/content-card/index.js

@@ -1,168 +1,6 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import z, { useTheme as b } from "styled-components";
-import { CategoryTag as k } from "./category-tag/index.js";
-import { EventDate as u } from "./event-date/index.js";
-import { Button as C } from "../button/index.js";
-import { M as v } from "../../index-maWH3JYC.mjs";
-import { Container as c } from "../container/index.js";
-import { Icon as S } from "../icon/index.js";
-import { Heading as j } from "../typography/heading/index.js";
-import "../typography/span/index.js";
-import { Text as f } from "../typography/text/index.js";
-const I = z.div`
-  ${({ theme: t }) => `
-    align-items: flex-start;
-    display: flex;
-    flex-direction: column;
-    gap: ${t.spacing[1.5]};
-    width: 384px;
-
-    img {
-      height: 100%;
-      width: 100%;
-    }
-
-    #card-image {
-      border-radius: ${t.spacing[1]};
-      height: 240px;
-      overflow: hidden;
-    }
-
-    &:hover {
-      img {
-        transform: scale(1.2);
-      }
-
-      > #card-content {
-        > .title-dark {
-          color: ${t.palette.gray[400]};
-        }
-        > .title-light {
-          background: ${t.palette.gradients["01"]};
-          background-clip: text;
-          -webkit-background-clip: text;
-          -webkit-text-fill-color: transparent;
-        }
-      }
-    }
-
-    @media screen and (max-width: ${t.breakpoints.mobile}) {
-      width: 320px;
-
-      #card-image {
-        height: 200px;
-      }
-    }
-  `}
-`, G = ({
-  author: t,
-  buttonText: g,
-  description: x,
-  eventDate: h,
-  href: a,
-  imageId: d,
-  mode: y = "light",
-  publishDate: s,
-  readingTime: m,
-  tag: p,
-  tagPosition: r = "top",
-  title: w
-}) => {
-  const i = b(), o = s == null ? void 0 : s.split("-"), n = y === "dark", $ = /* @__PURE__ */ l(I, { "data-testid": `content-card-${w}`, children: [
-    d || h || p && r === "top" ? /* @__PURE__ */ l(c, { id: "card-image", position: "relative", children: [
-      d && /* @__PURE__ */ e(v, { publicId: d }),
-      r === "top" && /* @__PURE__ */ e(k, { tag: p, tagPosition: r }),
-      /* @__PURE__ */ e(u, { eventDate: h })
-    ] }) : void 0,
-    /* @__PURE__ */ l(
-      c,
-      {
-        alignItems: "flex-start",
-        display: "flex",
-        flexDirection: "column",
-        gap: 0.5,
-        id: "card-content",
-        children: [
-          r === "bottom" && /* @__PURE__ */ e(k, { tag: p, tagPosition: r }),
-          t || o || m ? /* @__PURE__ */ l(c, { display: "flex", justify: "space-between", width: "100%", children: [
-            t && o && /* @__PURE__ */ e(
-              f,
-              {
-                color: i.palette.gray[n ? 300 : 400],
-                fontWeight: "semibold",
-                size: "sm",
-                sizeSm: "xs",
-                children: t + ` • ${o[0]} ${o[1]}, ${o[2]}`
-              }
-            ),
-            m && /* @__PURE__ */ l(
-              c,
-              {
-                alignItems: "center",
-                display: "flex",
-                gap: 0.25,
-                justify: "center",
-                minWidth: "60px",
-                children: [
-                  /* @__PURE__ */ e(
-                    S,
-                    {
-                      icon: "eye",
-                      iconColor: i.palette.gray[n ? 300 : 400],
-                      iconSize: "xs",
-                      iconType: "fa-light"
-                    }
-                  ),
-                  /* @__PURE__ */ e(
-                    f,
-                    {
-                      color: i.palette.gray[n ? 300 : 400],
-                      size: "sm",
-                      sizeSm: "xs",
-                      textAlign: "right",
-                      children: m
-                    }
-                  )
-                ]
-              }
-            )
-          ] }) : void 0,
-          /* @__PURE__ */ e(
-            j,
-            {
-              className: `title-${y}`,
-              color: n ? i.palette.white : i.palette.gray[800],
-              fontWeight: "semibold",
-              size: "sm",
-              sizeSm: "xs",
-              children: w
-            }
-          ),
-          x && /* @__PURE__ */ e(
-            f,
-            {
-              color: i.palette.gray[n ? 100 : 600],
-              size: "md",
-              sizeSm: "sm",
-              children: x
-            }
-          ),
-          g && a && /* @__PURE__ */ e(C, { href: a, variant: "link", children: g })
-        ]
-      }
-    )
-  ] });
-  return a ? /* @__PURE__ */ e(
-    "a",
-    {
-      className: "flex w-fit",
-      href: a,
-      rel: "noopener noreferrer",
-      target: "_self",
-      children: $
-    }
-  ) : $;
-};
+import "react/jsx-runtime";
+import "styled-components";
+import { bg as p } from "../../components-C2JBXbtI.mjs";
 export {
-  G as ContentCard
+  p as ContentCard
 };

package/dist/components/content-card-carousel/index.js

@@ -1,95 +1,6 @@
-import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { useRef as d } from "react";
-import { O as p, S as r } from "../../index-CAIe8hBv.mjs";
-import { Container as n } from "../container/index.js";
-import { ContentCard as f } from "../content-card/index.js";
-import { Heading as x } from "../typography/heading/index.js";
-import "../typography/span/index.js";
-import { Text as g } from "../typography/text/index.js";
-const j = ({
-  description: a,
-  items: o,
-  title: s,
-  titleHighlighted: m
-}) => {
-  const t = d(null);
-  return /* @__PURE__ */ i(p, { "data-testid": "content-card-carousel", children: [
-    /* @__PURE__ */ i(
-      n,
-      {
-        alignItems: "flex-start",
-        display: "flex",
-        justify: "space-between",
-        children: [
-          /* @__PURE__ */ i(
-            n,
-            {
-              alignItems: "flex-start",
-              display: "flex",
-              flexDirection: "column",
-              gap: 0.625,
-              maxWidth: "800px",
-              children: [
-                /* @__PURE__ */ i(
-                  x,
-                  {
-                    display: "inline",
-                    fontWeight: "semibold",
-                    lineSpacing: 2.25,
-                    lineSpacingSm: 1.75,
-                    size: "lg",
-                    sizeSm: "md",
-                    children: [
-                      s + " ",
-                      " ",
-                      /* @__PURE__ */ e("span", { className: "inline", children: m })
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ e(
-                  g,
-                  {
-                    lineSpacing: 1.5,
-                    lineSpacingSm: 1.25,
-                    size: "md",
-                    sizeSm: "sm",
-                    children: a
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ e(r, { containerRef: t, id: "desktop" })
-        ]
-      }
-    ),
-    /* @__PURE__ */ e(
-      n,
-      {
-        alignSelf: "stretch",
-        display: "flex",
-        id: "carousel",
-        pb: 1,
-        pr: 2.25,
-        ref: t,
-        scroll: "x",
-        children: /* @__PURE__ */ e(
-          n,
-          {
-            alignItems: "flex-start",
-            display: "flex",
-            gap: 1.5,
-            width: "max-content",
-            children: o.map(
-              (l, c) => /* @__PURE__ */ e(f, { ...l }, `${c}-${l.title}`)
-            )
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ e(r, { containerRef: t, id: "mobile" })
-  ] });
-};
+import "react/jsx-runtime";
+import "react";
+import { bh as e } from "../../components-C2JBXbtI.mjs";
 export {
-  j as ContentCardCarousel
+  e as ContentCardCarousel
 };

package/dist/components/content-card-carousel/scroll-buttons/index.js

@@ -1,9 +1,7 @@
 import "react/jsx-runtime";
 import "react";
 import "styled-components";
-import { S as s } from "../../../index-CAIe8hBv.mjs";
-import "../../container/index.js";
-import "../../icon/index.js";
+import { bd as i } from "../../../components-C2JBXbtI.mjs";
 export {
-  s as ScrollButtons
+  i as ScrollButtons
 };

package/dist/components/divider/index.js

@@ -1,25 +1,6 @@
-import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { theme as p } from "../colors/index.js";
-import { Container as n } from "../container/index.js";
-const h = f(function({
-  color: r = p.palette.gray[100],
-  mt: o = 0.5,
-  mb: t = 0.5,
-  ...e
-}, i) {
-  return /* @__PURE__ */ m(
-    n,
-    {
-      as: "hr",
-      border: `1px solid ${r}`,
-      mb: t,
-      mt: o,
-      ref: i,
-      ...e
-    }
-  );
-});
+import "react/jsx-runtime";
+import "react";
+import { F as p } from "../../components-C2JBXbtI.mjs";
 export {
-  h as Divider
+  p as Divider
 };

package/dist/components/empty-state/empty-button/index.js

@@ -1,6 +1,5 @@
-import { jsx as r } from "react/jsx-runtime";
-import { Button as n } from "../../button/index.js";
-const c = ({ buttonProps: t, variant: o }) => /* @__PURE__ */ r(n, { onClick: t.onClick, variant: o, children: t.text });
+import "react/jsx-runtime";
+import { bi as p } from "../../../components-C2JBXbtI.mjs";
 export {
-  c as EmptyButton
+  p as EmptyButton
 };

package/dist/components/empty-state/index.js

@@ -1,85 +1,5 @@
-import { jsxs as d, jsx as t } from "react/jsx-runtime";
-import { EmptyButton as m } from "./empty-button/index.js";
-import { styled as n } from "styled-components";
-import { M as g } from "../../index-maWH3JYC.mjs";
-import { Heading as f } from "../typography/heading/index.js";
-import "../typography/span/index.js";
-import { Text as x } from "../typography/text/index.js";
-const h = n.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: ${({ theme: i, $padding: e }) => i.spacing[e]};
-  max-width: 900px;
-  white-space: pre-line;
-  margin: 0 auto;
-`, y = n.div`
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  background-color: transparent;
-  width: 96px;
-  height: 96px;
-  margin-bottom: ${({ theme: i }) => i.spacing[2]};
-
-  > img {
-    width: 100%;
-  }
-`, u = n.div`
-  display: flex;
-  flex-direction: row;
-  margin: 0;
-  margin-bottom: ${({ theme: i }) => i.spacing[2]};
-
-  > * {
-    margin-right: ${({ theme: i }) => i.spacing[0.75]};
-  }
-
-  > *:last-child {
-    margin-right: 0;
-  }
-`, a = {
-  md: { description: "md", title: "lg" },
-  sm: { description: "sm", title: "xs" }
-}, C = ({
-  cancelButton: i = void 0,
-  confirmButton: e = void 0,
-  description: p,
-  imageSrc: s = "integrates/empty/addRoot",
-  padding: l = 1.25,
-  title: c,
-  size: r = "md"
-}) => {
-  const o = (e ?? i) !== void 0;
-  return /* @__PURE__ */ d(h, { $padding: l, children: [
-    /* @__PURE__ */ t(y, { children: /* @__PURE__ */ t(g, { alt: "empty-icon", publicId: s }) }),
-    /* @__PURE__ */ t(
-      f,
-      {
-        fontWeight: "bold",
-        lineSpacing: 1.75,
-        mb: 0.25,
-        size: a[r].title,
-        textAlign: "center",
-        children: c
-      }
-    ),
-    /* @__PURE__ */ t(
-      x,
-      {
-        mb: o ? 2 : void 0,
-        size: a[r].description,
-        textAlign: "center",
-        children: p
-      }
-    ),
-    o ? /* @__PURE__ */ d(u, { children: [
-      i && /* @__PURE__ */ t(m, { buttonProps: i, variant: "tertiary" }),
-      e && /* @__PURE__ */ t(m, { buttonProps: e, variant: "primary" })
-    ] }) : void 0
-  ] });
-};
+import "react/jsx-runtime";
+import { G as p } from "../../components-C2JBXbtI.mjs";
 export {
-  C as EmptyState
+  p as EmptyState
 };

package/dist/components/file-preview/index.js

@@ -1,44 +1,5 @@
-import { jsx as i, jsxs as c } from "react/jsx-runtime";
-import { styled as p } from "styled-components";
-import { Container as a } from "../container/index.js";
-import n from "lodash";
-import { Link as m } from "../link/index.js";
-const d = p(a).attrs(
-  ({ ...e }) => ({
-    display: "inline-block",
-    position: "relative",
-    ...e
-  })
-)`
-  & img {
-    display: block;
-  }
-
-  &::after {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    pointer-events: none;
-    ${({ $opacity: e = 0 }) => `background-color: rgba(0, 0, 0, ${e});`}
-  }
-`, u = (e) => {
-  if (n.isNil(e)) return "";
-  const t = e.split(".");
-  return (t.length > 1 ? n.last(t) : "").toLowerCase();
-}, f = (e, t) => n.isUndefined(t) ? !1 : n.includes(e, u(t)), w = ({
-  alt: e,
-  fileType: t,
-  width: r = "100%",
-  opacity: s = 0,
-  src: o,
-  height: l = "auto"
-}) => t === "video" || f(["webm"], o) ? /* @__PURE__ */ i(d, { $opacity: s, children: /* @__PURE__ */ c("video", { controls: !0, height: l, muted: !0, width: r, children: [
-  /* @__PURE__ */ i("source", { src: o, type: "video/webm" }),
-  /* @__PURE__ */ i(m, { href: o, iconPosition: "hidden", children: o })
-] }) }) : /* @__PURE__ */ i(d, { $opacity: s, children: /* @__PURE__ */ i("img", { alt: e, height: l, src: o, width: r }) });
+import "react/jsx-runtime";
+import { H as o } from "../../components-C2JBXbtI.mjs";
 export {
-  w as FilePreview
+  o as FilePreview
 };

package/dist/components/form/index.js

@@ -1,63 +1,6 @@
-import { jsx as t, jsxs as l } from "react/jsx-runtime";
-import { forwardRef as x } from "react";
-import { styled as y } from "styled-components";
-import { Button as a } from "../button/index.js";
-import { Container as n } from "../container/index.js";
-const b = y.form`
-  ${({ theme: i }) => `
-    align-items: flex-start;
-    align-self: stretch;
-    display: flex;
-    flex-direction: column;
-    gap: ${i.spacing[0.5]};
-
-    &:has(button[type="reset"]) {
-      &:last-child {
-        margin-top: ${i.spacing[1]};
-      }
-    }
-  `}
-`, F = x(function({
-  cancelLabel: m,
-  children: c,
-  id: o = "modal-confirm",
-  onCancel: e,
-  onConfirm: r = "submit",
-  submitLabel: d,
-  submitDisabled: f = !1,
-  ...p
-}, u) {
-  const s = r === "submit", h = [e, r].some(Boolean);
-  return /* @__PURE__ */ t(b, { ref: u, ...p, children: /* @__PURE__ */ l(n, { children: [
-    /* @__PURE__ */ t(n, { display: "flex", flexDirection: "column", gap: 0.5, mb: 1.5, children: c }),
-    h && /* @__PURE__ */ l(n, { display: "flex", gap: 0.75, maxWidth: "392px", children: [
-      e ? /* @__PURE__ */ t(
-        a,
-        {
-          id: `${o}-cancel`,
-          justify: "center",
-          onClick: e,
-          type: "reset",
-          variant: "tertiary",
-          width: "100%",
-          children: m ?? "Cancel"
-        }
-      ) : void 0,
-      /* @__PURE__ */ t(
-        a,
-        {
-          disabled: f,
-          id: o,
-          justify: "center",
-          onClick: s ? void 0 : r,
-          type: s ? "submit" : "button",
-          width: "100%",
-          children: d ?? "Confirm"
-        }
-      )
-    ] })
-  ] }) });
-});
+import "react/jsx-runtime";
+import "react";
+import { I as t } from "../../components-C2JBXbtI.mjs";
 export {
-  F as Form
+  t as Form
 };

package/dist/components/grid-container/index.js

@@ -1,48 +1,6 @@
-import { jsx as d } from "react/jsx-runtime";
-import { forwardRef as $ } from "react";
-import { styled as s } from "styled-components";
-import { B as l } from "../../styles-CplEd2kw.mjs";
-const f = s(l)`
-  display: grid;
-  gap: ${({ $gap: r = 1.25 }) => `${r}rem`};
-  grid-template-columns: ${({ $sm: r }) => `repeat(${r}, 1fr)`};
-
-  ${({ theme: r, $xl: t, $lg: e, $md: i }) => `
-    @media (width >= ${r.breakpoints.sm}) {
-      grid-template-columns: repeat(${i}, 1fr);
-    }
-
-    @media (width >= ${r.breakpoints.md}) {
-      grid-template-columns: repeat(${e}, 1fr);
-    }
-
-    @media (width >= ${r.breakpoints.lg}) {
-      grid-template-columns: repeat(${t}, 1fr);
-    }
-  `}
-`, C = $(function({
-  children: t,
-  md: e,
-  sm: i,
-  lg: o,
-  xl: a,
-  gap: m,
-  ...n
-}, p) {
-  return /* @__PURE__ */ d(
-    f,
-    {
-      $gap: m,
-      $lg: o,
-      $md: e,
-      $sm: i,
-      $xl: a,
-      ref: p,
-      ...n,
-      children: t
-    }
-  );
-});
+import "react/jsx-runtime";
+import "react";
+import { J as m } from "../../components-C2JBXbtI.mjs";
 export {
-  C as GridContainer
+  m as GridContainer
 };