@fluidattacks/design 3.1.13 → 3.2.0

package/dist/styles-CROOwXEH.mjs

@@ -1,76 +0,0 @@
-import { styled as i } from "styled-components";
-const t = i.div`
-  ${({ theme: n }) => `
-    background-color: ${n.palette.gray[100]};
-    border-radius: ${n.spacing[0.25]};
-    display: inline-flex;
-    padding: ${n.spacing[1]};
-    position: relative;
-    width: fit-content;
-
-    .line-highlight.language-none {
-      background: ${n.palette.gray[100]};
-    }
-
-    .line-highlight {
-      background: hsl(354deg 88% 93% / 50%);
-      font-family: ${n.typography.type.mono};
-      font-size: ${n.typography.text.xs};
-      line-height: ${n.spacing[1]};
-    }
-
-    .line-highlight::before,
-    .line-highlight[data-end]::after {
-      background: ${n.palette.primary[300]};
-      background-color: hsl(355deg 89% 36%);
-      color: ${n.palette.white};
-    }
-
-    pre code {
-      color: #161616;
-      font-family: ${n.typography.type.mono};
-      font-size: ${n.typography.text.xs};
-      line-height: ${n.spacing[1]};
-    }
-
-    pre:not(.line-highlight) {
-      margin-top: unset;
-      margin-bottom: unset;
-      padding: unset;
-      width: 100%;
-    }
-
-    span:hover {
-      background-color: ${n.palette.gray[200]};
-    }
-
-    .no-data,
-    pre.line-highlight {
-      background-color: ${n.palette.gray[100]};
-      padding-top: unset;
-      padding-bottom: unset;
-    }
-  `}
-`, a = i.div`
-  ${({ theme: n }) => `
-    align-items: end;
-    background-color: ${n.palette.gray[100]};
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    min-width: 103px;
-    margin-right: ${n.spacing[1]};
-    padding-top: ${n.spacing[1]};
-    padding-bottom: ${n.spacing[1]};
-    position: relative;
-    padding-left: unset;
-
-    button:hover:not([disabled]) {
-      background-color: ${n.palette.gray[200]};
-    }
-  `}
-`;
-export {
-  a as B,
-  t as C
-};

package/dist/styles-CplEd2kw.mjs

@@ -1,228 +0,0 @@
-import { styled as g } from "styled-components";
-import { theme as n } from "./components/colors/index.js";
-const G = [
-  // IPaddingModifiable
-  "padding",
-  "px",
-  "py",
-  "pl",
-  "pr",
-  "pt",
-  "pb",
-  // IMarginModifiable
-  "margin",
-  "mx",
-  "my",
-  "ml",
-  "mr",
-  "mt",
-  "mb",
-  // IPositionModifiable
-  "zIndex",
-  "position",
-  "top",
-  "right",
-  "bottom",
-  "left",
-  // IBorderModifiable
-  "border",
-  "borderTop",
-  "borderRight",
-  "borderBottom",
-  "borderLeft",
-  "borderColor",
-  "borderRadius",
-  // IDisplayModifiable
-  "scroll",
-  "visibility",
-  "display",
-  "height",
-  "width",
-  "maxHeight",
-  "maxWidth",
-  "minHeight",
-  "minWidth",
-  "shadow",
-  "bgColor",
-  "bgGradient",
-  "gap",
-  "flexDirection",
-  "flexGrow",
-  "justify",
-  "justifySelf",
-  "alignItems",
-  "alignSelf",
-  "wrap",
-  // ITextModifiable
-  "color",
-  "fontFamily",
-  "fontSize",
-  "fontWeight",
-  "textAlign",
-  "whiteSpace",
-  "letterSpacing",
-  "lineSpacing",
-  "textDecoration",
-  "textOverflow",
-  "whiteSpace",
-  "wordBreak",
-  "wordWrap",
-  // IInteractionModifiable
-  "cursor",
-  "transition",
-  "borderColorHover",
-  "bgColorHover",
-  "shadowHover"
-], o = (t, e) => e === void 0 ? "" : `${t}: ${e};`, $ = (t) => {
-  const e = t.py ?? t.pt ?? 0, i = t.px ?? t.pr ?? 0, r = t.py ?? t.pb ?? 0, c = t.px ?? t.pl ?? 0;
-  if (t.padding) {
-    const [a, s, d, l] = t.padding;
-    return `padding: ${n.spacing[a]} ${n.spacing[s]} ${n.spacing[d]} ${n.spacing[l]};`;
-  }
-  return `padding: ${n.spacing[e]} ${n.spacing[i]} ${n.spacing[r]} ${n.spacing[c]};`;
-}, f = (t) => {
-  const e = t.my ?? t.mt ?? 0, i = t.mx ?? t.mr ?? 0, r = t.my ?? t.mb ?? 0, c = t.mx ?? t.ml ?? 0;
-  if (t.margin) {
-    const [a, s, d, l] = t.margin;
-    return `margin: ${n.spacing[a]} ${n.spacing[s]} ${n.spacing[d]} ${n.spacing[l]};`;
-  }
-  return `margin: ${n.spacing[e]} ${n.spacing[i]} ${n.spacing[r]} ${n.spacing[c]};`;
-}, h = (t) => {
-  const e = o("position", t.position), i = o("top", t.top), r = o("right", t.right), c = o("bottom", t.bottom), a = o("left", t.left), s = o("z-index", t.zIndex);
-  return `
-    ${e}
-    ${i}
-    ${r}
-    ${c}
-    ${a}
-    ${s}
-  `;
-}, m = (t) => {
-  const e = o("border", t.border), i = o("border-top", t.borderTop), r = o("border-right", t.borderRight), c = o("border-bottom", t.borderBottom), a = o("border-left", t.borderLeft), s = o("border-color", t.borderColor), d = o("border-radius", t.borderRadius);
-  return `
-    ${e}
-    ${i}
-    ${r}
-    ${c}
-    ${a}
-    ${s}
-    ${d}
-  `;
-}, R = (t) => t.includes("x") ? "overflow-x: auto;" : "", P = (t) => t.includes("y") ? "overflow-y: auto;" : "", b = (t) => {
-  const e = t.scroll ? `
-      ${R(t.scroll)}
-      ${P(t.scroll)}
-    ` : "", i = o("visibility", t.visibility), r = o("display", t.display), c = o("height", t.height), a = o("width", t.width), s = o("max-height", t.maxHeight), d = o("max-width", t.maxWidth), l = o("min-height", t.minHeight), y = o("min-width", t.minWidth), S = o(
-    "box-shadow",
-    t.shadow ? n.shadows[t.shadow] : void 0
-  ), v = o(
-    "gap",
-    t.gap === void 0 ? void 0 : n.spacing[t.gap]
-  ), C = o("background-color", t.bgColor), H = o("background", t.bgGradient), B = o("flex-direction", t.flexDirection), W = o("flex-grow", t.flexGrow), j = o("justify-content", t.justify), k = o("justify-self", t.justifySelf), z = o("align-items", t.alignItems), I = o("align-self", t.alignSelf), D = o("flex-wrap", t.wrap);
-  return `
-    ${e}
-    ${i}
-    ${r}
-    ${c}
-    ${a}
-    ${s}
-    ${d}
-    ${l}
-    ${y}
-    ${S}
-    ${C}
-    ${H}
-    ${v}
-    ${B}
-    ${W}
-    ${j}
-    ${k}
-    ${z}
-    ${I}
-    ${D}
-  `;
-}, w = (t) => {
-  const e = o("color", t.color), i = o("font-family", t.fontFamily), r = o("font-size", t.fontSize), c = o("font-weight", t.fontWeight), a = o("line-spacing", t.letterSpacing), s = o("line-height", t.lineSpacing), d = o("text-align", t.textAlign), l = o("text-decoration", t.textDecoration), y = o("text-overflow", t.textOverflow), S = o("white-space", t.whiteSpace), v = o("word-break", t.wordBreak), C = o("word-wrap", t.wordWrap);
-  return `
-    ${e}
-    ${i}
-    ${r}
-    ${c}
-    ${a}
-    ${s}
-    ${d}
-    ${l}
-    ${y}
-    ${S}
-    ${v}
-    ${C}
-  `;
-}, x = (t) => {
-  const e = o("cursor", t.cursor), i = o("border-color", t.borderColorHover), r = o("background-color", t.bgColorHover), c = o(
-    "box-shadow",
-    t.shadowHover === void 0 ? void 0 : n.shadows[t.shadowHover]
-  ), a = o("transition", t.transition);
-  return `
-    ${e}
-
-    &:hover {
-      ${a || "transition: all 0.2s;"}
-      ${i}
-      ${r}
-      ${c}
-    }
-  `;
-}, u = () => ({
-  shouldForwardProp: (t) => !G.includes(t)
-}), A = g.div.withConfig(u())`
-  ${$}
-  ${f}
-  ${h}
-  ${b}
-  ${w}
-  ${m}
-  ${x}
-`, L = g.button.withConfig(
-  u()
-)`
-  ${$}
-  ${f}
-  ${h}
-  ${b}
-  ${w}
-  ${m}
-  ${x}
-`, O = g.p.withConfig(u())`
-  ${$}
-  ${f}
-  ${h}
-  ${b}
-  ${w}
-  ${m}
-  ${x}
-`, M = g.span.withConfig(
-  u()
-)`
-  ${$}
-  ${f}
-  ${h}
-  ${b}
-  ${w}
-  ${m}
-  ${x}
-`;
-export {
-  A as B,
-  L as a,
-  O as b,
-  M as c,
-  w as d,
-  f as e,
-  x as f,
-  h as g,
-  G as h,
-  b as i,
-  m as j,
-  u as k,
-  $ as s
-};

package/dist/styles-D1eTIklB.mjs

@@ -1,110 +0,0 @@
-import { styled as i, css as e } from "styled-components";
-import { a as s } from "./styles-CplEd2kw.mjs";
-import "react/jsx-runtime";
-const d = i(s)`
-  align-items: center;
-  background-color: inherit;
-  border-color: inherit;
-  display: flex;
-  height: 38px;
-  justify-content: center;
-  width: 40px;
-  margin: ${({ $margin: t = "0" }) => e`
-    ${t}
-  `};
-
-  &:hover:not(:disabled) {
-    background-color: ${({ theme: t }) => t.palette.gray[100]};
-    cursor: pointer;
-  }
-`, g = i.div`
-  ${({ theme: t }) => `
-    align-items: flex-start;
-    background: ${t.palette.white};
-    border: 1px solid ${t.palette.gray[200]};
-    border-radius: ${t.spacing[0.5]};
-    box-shadow: ${t.shadows.md};
-    display: inline-flex;
-    flex-direction: column;
-    gap: ${t.spacing[0.25]};
-    height: auto;
-    padding: ${t.spacing[0.25]};
-    width: 292px;
-  `}
-`, u = i.button`
-  ${({ theme: t, $disabled: o, $focus: a, $header: n }) => {
-  const r = a ? "34px" : "40px";
-  return `
-      align-items: center;
-      border-radius: ${n ? `0 ${t.spacing[0.5]} ${t.spacing[0.5]} 0` : "4px"};
-      border-left: inherit;
-      display: flex;
-      height: ${n ? "38px" : r};
-      justify-content: center;
-      outline: none;
-      width: ${n ? "38px" : "40px"};
-
-      &:hover {
-        background-color: ${t.palette.gray[o ? 500 : 100]};
-      }
-    `;
-}}
-`, $ = i.div`
-  ${({ theme: t }) => `
-    align-items: center;
-    background: transparent;
-    border-radius: ${t.spacing[0.5]} 0 0 ${t.spacing[0.5]};
-    border-color: inherit;
-    display: flex;
-    height: 100%;
-    justify-content: space-between;
-    width: calc(100% - 40px);
-  `}
-`, x = i.div`
-  align-items: center;
-  display: flex;
-  justify-content: flex-end;
-  gap: ${({ theme: t }) => t.spacing[0.5]};
-  flex: 1 0 0;
-`, y = i.div`
-  ${({ theme: t }) => `
-    align-items: center;
-    align-self: stretch;
-    background-color: ${t.palette.gray[200]};
-    border-radius: ${t.spacing[0.25]};
-    display: flex;
-    font-family: ${t.typography.type.primary};
-    gap: ${t.spacing[0.25]};
-    line-height: ${t.spacing[1.5]};
-    padding: 2px ${t.spacing[0.25]};
-  `}
-`, b = i.button`
-  ${({ theme: t }) => `
-    align-items: center;
-    background-color: inherit;
-    border: 0.5px solid ${t.palette.gray[200]};
-    border-radius: 7px;
-    color: ${t.palette.gray[800]};
-    cursor: pointer;
-    display: flex;
-    font-weight: ${t.typography.weight.regular};
-    justify-content: center;
-    gap: 10px;
-    padding: 2px 10px;
-
-    &#active {
-      background-color: ${t.palette.white};
-      box-shadow: ${t.shadows.md};
-      font-weight: ${t.typography.weight.bold};
-    }
-  `}
-`;
-export {
-  u as C,
-  g as D,
-  $ as I,
-  d as S,
-  x as T,
-  y as a,
-  b
-};

package/dist/styles-ePGii_9g.mjs

@@ -1,74 +0,0 @@
-import { NavLink as o } from "react-router-dom";
-import { styled as t } from "styled-components";
-const p = t.button`
-  ${({ theme: a }) => `
-    align-items: center;
-    color: ${a.palette.gray[500]};
-    display: flex;
-    gap: ${a.spacing[0.625]};
-    justify-content: center;
-    padding: ${a.spacing[0.75]};
-    text-align: center;
-    width: 151px;
-
-    &.active {
-      color: ${a.palette.gray[800]};
-      border-bottom: 3px solid ${a.palette.primary[400]};
-    }
-
-    &:hover {
-      color: ${a.palette.gray[800]};
-    }
-  `}
-`, n = t.div`
-  ${({ theme: a }) => `
-    align-items: center;
-    border-bottom: 2px solid ${a.palette.gray[200]};
-    display: flex;
-    gap: ${a.spacing[3]};
-    height: ${a.spacing[3]};
-    width: max-content;
-  `}
-`, l = t(o)`
-  ${({ theme: a }) => `
-    align-items: center;
-    background: transparent;
-    cursor: pointer;
-    color: ${a.palette.gray[800]};
-    font-family: ${a.typography.type.primary};
-    font-size: ${a.typography.text.sm};
-    display: flex;
-    font-weight: ${a.typography.weight.regular};
-    padding: ${a.spacing[0.625]} ${a.spacing[0.5]};
-    position: relative;
-    text-align: center;
-    text-decoration: unset;
-
-    &:disabled {
-      cursor: not-allowed;
-      background-color: ${a.palette.gray[300]};
-      color: ${a.palette.gray[300]};
-    }
-
-    &:hover:not([disabled]) {
-      background-color: ${a.palette.gray[100]};
-      color: ${a.palette.gray[800]};
-    }
-
-    &.active {
-      background-color: transparent;
-      border-bottom: solid 4px ${a.palette.primary[500]};
-      padding-bottom: calc(${a.spacing[0.625]} - 4px);
-
-      &:hover {
-        background-color: transparent;
-        border-bottom: solid 4px ${a.palette.primary[500]};
-      }
-    }
-  `}
-`;
-export {
-  n as S,
-  l as T,
-  p as a
-};

package/dist/use-carousel-CgAF78h3.mjs

@@ -1,23 +0,0 @@
-import { useState as n, useEffect as a } from "react";
-const m = (t, r) => {
-  const [g, o] = n(0), [e, c] = n(0);
-  return a(() => {
-    e === 100 && (() => {
-      o(
-        (s) => s === r - 1 ? 0 : s + 1
-      );
-    })();
-  }, [e, r]), a(() => {
-    const i = setInterval(() => {
-      c(
-        (s) => s === 100 ? 0 : s + 1
-      );
-    }, t);
-    return () => {
-      clearInterval(i);
-    };
-  }, [t]), { cycle: g, progress: e, setCycle: o, setProgress: c };
-};
-export {
-  m as u
-};

package/dist/use-click-outside-BUll8Ag-.mjs

@@ -1,18 +0,0 @@
-import { useEffect as i } from "react";
-const s = (r, c, n = !1) => {
-  i(() => {
-    var o;
-    const e = (t) => {
-      r && !r.contains(t.target) && c();
-    };
-    return n ? (document.addEventListener("click", e, !0), () => {
-      document.removeEventListener("click", e, !0);
-    }) : ((o = document.getElementById("root")) == null || o.addEventListener("click", e, !0), () => {
-      var t;
-      (t = document.getElementById("root")) == null || t.removeEventListener("click", e, !0);
-    });
-  }, [n, r, c]);
-};
-export {
-  s as u
-};