@fluidattacks/design 3.1.13 → 3.2.0

package/dist/components/card/card-with-selector/index.js

@@ -1,71 +1,6 @@
-import { jsxs as d, jsx as e } from "react/jsx-runtime";
-import { useTheme as f } from "styled-components";
-import { M as s } from "../../../index-maWH3JYC.mjs";
-import { Container as t } from "../../container/index.js";
-import { Icon as c } from "../../icon/index.js";
-import { RadioButton as h } from "../../radio-button/index.js";
-import { Heading as g } from "../../typography/heading/index.js";
-import "../../typography/span/index.js";
-import "../../typography/text/index.js";
-const z = ({
-  alt: a,
-  imageId: n,
-  icon: r,
-  selectorProps: o,
-  onClick: m,
-  title: l,
-  width: p = "fit-content"
-}) => {
-  const i = f();
-  return /* @__PURE__ */ d(
-    t,
-    {
-      alignItems: "center",
-      border: `1px solid ${i.palette.gray[200]}`,
-      borderColorHover: i.palette.gray[600],
-      borderRadius: i.spacing[0.25],
-      display: "inline-flex",
-      padding: [1, 1, 1, 1],
-      shadowHover: "md",
-      width: p,
-      children: [
-        /* @__PURE__ */ e(t, { alignSelf: "start", display: "flex", width: "fit-content", children: /* @__PURE__ */ e(
-          h,
-          {
-            name: o.name,
-            onClick: m,
-            value: o.value
-          }
-        ) }),
-        /* @__PURE__ */ d(
-          t,
-          {
-            alignItems: "center",
-            display: "flex",
-            gap: 0.5,
-            justify: "space-between",
-            ml: 1,
-            mr: 1,
-            width: "100%",
-            children: [
-              n === void 0 ? void 0 : /* @__PURE__ */ e(
-                s,
-                {
-                  alt: a ?? "card image",
-                  height: "32px",
-                  publicId: n,
-                  width: "32px"
-                }
-              ),
-              r === void 0 ? void 0 : /* @__PURE__ */ e(c, { icon: r, iconSize: "sm", iconType: "fa-light" }),
-              /* @__PURE__ */ e(g, { fontWeight: "bold", lineSpacing: 1.75, size: "xs", children: l })
-            ]
-          }
-        )
-      ]
-    }
-  );
-};
+import "react/jsx-runtime";
+import "styled-components";
+import { p as e } from "../../../components-C7JPRIEW.mjs";
 export {
-  z as CardWithSelector
+  e as CardWithSelector
 };

package/dist/components/card/card-with-switch/index.js

@@ -1,50 +1,6 @@
-import { jsxs as p, jsx as t } from "react/jsx-runtime";
-import { useTheme as d } from "styled-components";
-import { CardHeader as c } from "../card-header/index.js";
-import { Container as i } from "../../container/index.js";
-import { Toggle as g } from "../../toggle/index.js";
-const y = ({
-  id: o,
-  title: a,
-  toggles: m,
-  minWidth: n = "auto",
-  height: l = "auto"
-}) => {
-  const e = d();
-  return /* @__PURE__ */ p(
-    i,
-    {
-      alignItems: "center",
-      bgColor: e.palette.white,
-      border: `1px solid ${e.palette.gray[200]}`,
-      borderRadius: e.spacing[0.25],
-      display: "flex",
-      flexDirection: "column",
-      gap: 0.5,
-      height: l,
-      justify: "center",
-      minHeight: "100px",
-      minWidth: n,
-      padding: [1.25, 1.25, 1.25, 1.25],
-      children: [
-        /* @__PURE__ */ t(c, { id: o, title: a }),
-        /* @__PURE__ */ t(
-          i,
-          {
-            display: "flex",
-            flexDirection: "column",
-            gap: 0.5,
-            minHeight: "40px",
-            width: "100%",
-            children: m.map(
-              (r) => /* @__PURE__ */ t(g, { ...r }, `$card-toggle-${r.name}`)
-            )
-          }
-        )
-      ]
-    }
-  );
-};
+import "react/jsx-runtime";
+import "styled-components";
+import { q as m } from "../../../components-C7JPRIEW.mjs";
 export {
-  y as CardWithSwitch
+  m as CardWithSwitch
 };

package/dist/components/card/index.js

@@ -1,12 +1,8 @@
-import { CardHeader as o } from "./card-header/index.js";
-import { CardWithImage as a } from "./card-with-image/index.js";
-import { CardWithInput as m } from "./card-with-input/index.js";
-import { CardWithSelector as f } from "./card-with-selector/index.js";
-import { CardWithSwitch as i } from "./card-with-switch/index.js";
+import { C as t, o as d, n as e, p as C, q as h } from "../../components-C7JPRIEW.mjs";
 export {
-  o as CardHeader,
-  a as CardWithImage,
-  m as CardWithInput,
-  f as CardWithSelector,
-  i as CardWithSwitch
+  t as CardHeader,
+  d as CardWithImage,
+  e as CardWithInput,
+  C as CardWithSelector,
+  h as CardWithSwitch
 };

package/dist/components/carousel/index.js

@@ -1,76 +1,7 @@
-import { jsxs as d, jsx as i } from "react/jsx-runtime";
-import { useCallback as u } from "react";
-import { styled as e } from "styled-components";
-import { u as m } from "../../use-carousel-CgAF78h3.mjs";
+import "react/jsx-runtime";
+import "react";
+import { r as i } from "../../components-C7JPRIEW.mjs";
 import "lodash";
-const g = e.div`
-  position: relative;
-  margin: auto;
-  overflow: hidden;
-`, v = e.div`
-  display: flex;
-  transition: transform 0.5s ease-in-out;
-  transform: translateX(
-    ${({ $currentIndex: t }) => -t * 100}%
-  );
-`, f = e.div`
-  align-items: center;
-  display: flex;
-  justify-content: center;
-  min-width: 100%;
-`, $ = e.button`
-  ${({ theme: t, $isActive: a }) => `
-    background-color: ${a ? t.palette.primary[400] : t.palette.white};
-    border: none;
-    border-radius: 50%;
-    cursor: pointer;
-    height: ${t.spacing[0.75]};
-    width: ${t.spacing[0.75]};
-  `}
-`, y = e.div`
-  align-items: center;
-  display: flex;
-  gap: ${({ theme: t }) => t.spacing[0.5]};
-  justify-content: center;
-  margin-top: ${({ theme: t }) => t.spacing[2]};
-`, w = ({
-  slides: t,
-  interval: a = 300
-}) => {
-  const { cycle: s, setCycle: c, setProgress: l } = m(a, t.length), p = u(
-    (n) => () => {
-      c(n), l(0);
-    },
-    [c, l]
-  );
-  return /* @__PURE__ */ d(g, { "aria-roledescription": "carousel", children: [
-    /* @__PURE__ */ i(v, { $currentIndex: s, children: t.map((n, r) => {
-      const o = `slide-${r}`;
-      return /* @__PURE__ */ i(
-        f,
-        {
-          "aria-label": o,
-          "aria-roledescription": "slide",
-          children: n.content
-        },
-        o
-      );
-    }) }),
-    /* @__PURE__ */ i(y, { children: t.map((n, r) => {
-      const o = `nav-button-${r}`;
-      return /* @__PURE__ */ i(
-        $,
-        {
-          $isActive: r === s,
-          "aria-label": `Go to slide ${r + 1}`,
-          "data-testid": r === s ? "active" : "inactive",
-          onClick: p(r)
-        },
-        o
-      );
-    }) })
-  ] });
-};
 export {
-  w as Carousel
+  i as Carousel
 };

package/dist/components/checkbox/index.js

@@ -1,118 +1,6 @@
-import { jsxs as $, jsx as p } from "react/jsx-runtime";
-import { forwardRef as y } from "react";
-import { styled as b } from "styled-components";
-import { Icon as u } from "../icon/index.js";
-const f = b.label`
-  ${({ theme: a }) => `
-    align-items: start;
-    color: ${a.palette.gray[600]};
-    display: flex;
-    cursor: pointer;
-    font-family: ${a.typography.type.primary};
-    font-size: ${a.typography.text.sm};
-    font-weight: ${a.typography.weight.regular};
-    line-height: ${a.spacing[1]};
-    letter-spacing: 0;
-    position: relative;
-    text-align: left;
-
-    &[aria-disabled="true"] {
-      color: ${a.palette.gray[300]};
-      cursor: not-allowed;
-    }
-
-    input {
-      position: absolute;
-      opacity: 0;
-      cursor: pointer;
-      height: 0;
-      width: 0;
-    }
-
-    svg {
-      background-color: ${a.palette.white};
-      border-radius: ${a.spacing[0.25]};
-      border: 1px solid ${a.palette.gray[600]};
-      top: 0;
-      left: 0;
-      height: ${a.spacing[0.5]};
-      margin-right: ${a.spacing[0.5]};
-      width: ${a.spacing[0.5]};
-      padding: ${a.spacing[0.25]};
-    }
-
-    svg > path {
-      fill: ${a.palette.white};
-    }
-
-    input:checked ~ span > svg {
-      background-color: ${a.palette.primary[500]};
-      border: 1px solid ${a.palette.primary[500]};
-    }
-
-    input:disabled ~ span > svg {
-      border: 1px solid ${a.palette.gray[300]};
-      cursor: not-allowed;
-    }
-
-    input:not(:disabled):hover ~ span > svg {
-      box-shadow: 0 0 0 4px ${a.palette.gray[100]};
-    }
-
-    input:checked:disabled ~ span > svg {
-      background-color: ${a.palette.gray[300]};
-      border: 1px solid ${a.palette.gray[300]};
-    }
-
-    input:not(:disabled):hover:checked ~ span > svg {
-      box-shadow: 0 0 0 4px ${a.palette.primary[50]};
-    }
-
-    input:checked ~ span > svg > path {
-      fill: ${a.palette.white};
-    }
-
-    input:checked:disabled ~ span > svg > path {
-      fill: ${a.palette.white};
-    }
-  `}
-`, v = y(function({
-  defaultChecked: o = !1,
-  disabled: i = !1,
-  label: l,
-  name: r,
-  onChange: s,
-  onClick: n,
-  onFocus: e,
-  onKeyDown: c,
-  value: t,
-  ...d
-}, g) {
-  return /* @__PURE__ */ $(f, { "aria-disabled": i, htmlFor: r, children: [
-    /* @__PURE__ */ p(
-      "input",
-      {
-        "aria-checked": o,
-        "aria-disabled": i,
-        "aria-label": r,
-        defaultChecked: o,
-        disabled: i,
-        id: r,
-        name: r,
-        onChange: s,
-        onClick: n,
-        onFocus: e,
-        onKeyDown: c,
-        ref: g,
-        type: "checkbox",
-        value: t,
-        ...d
-      }
-    ),
-    /* @__PURE__ */ p(u, { disabled: i, icon: "check", iconSize: "sm" }),
-    l ?? t
-  ] });
-});
+import "react/jsx-runtime";
+import "react";
+import { t as p } from "../../components-C7JPRIEW.mjs";
 export {
-  v as Checkbox
+  p as Checkbox
 };

package/dist/components/cloud-image/index.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
-import { M as a } from "../../index-maWH3JYC.mjs";
+import "../../vendor-_XDhaIzo.mjs";
 import "react";
-import "../../use-cloudinary-image-BCxwj15o.mjs";
+import { M as a } from "../../components-C7JPRIEW.mjs";
 import "lodash";
 export {
   a as CloudImage

package/dist/components/code-snippet/index.js

@@ -1,72 +1,8 @@
-import { jsxs as a, jsx as n } from "react/jsx-runtime";
-import l from "lodash";
-import { useState as g, useCallback as c, useMemo as C } from "react";
-import { useTheme as w } from "styled-components";
-import { C as x, B as y } from "../../styles-CROOwXEH.mjs";
-import { Button as S } from "../button/index.js";
-import { Container as v } from "../container/index.js";
-import { Icon as B } from "../icon/index.js";
-import { IconButton as b } from "../icon-button/index.js";
-const E = ({
-  noCodeMessage: s = "Code snippet not available",
-  snippet: o
-}) => {
-  const e = w(), [i, h] = g(!1), [d, m] = g(!0), u = c(() => {
-    h((t) => !t);
-  }, [h]), p = c(() => {
-    if (l.isNil(o) || l.isEmpty(o) || !l.isString(o))
-      return m(!1), s;
-    const t = o.split(`
-`);
-    return t.length > 8 && !i ? `${[...t].splice(0, 7).join(`
-`)}
-${t[8]}...` : (t.length < 8 && m(!1), o);
-  }, [i, o, s]), r = C(p, [p]), f = c(async () => {
-    await navigator.clipboard.writeText(r);
-  }, [r]);
-  return /* @__PURE__ */ a(
-    v,
-    {
-      bgColor: e.palette.gray[100],
-      borderRadius: "4px",
-      display: "inline-flex",
-      minWidth: "565px",
-      position: "relative",
-      children: [
-        /* @__PURE__ */ n(x, { "data-private": !0, children: /* @__PURE__ */ n("pre", { children: /* @__PURE__ */ n("code", { className: "language-none", children: r }) }) }),
-        /* @__PURE__ */ a(y, { children: [
-          /* @__PURE__ */ n(
-            b,
-            {
-              height: e.spacing[2.5],
-              icon: "copy",
-              iconColor: e.palette.gray[700],
-              iconSize: "xs",
-              iconType: "fa-light",
-              onClick: f,
-              variant: "ghost",
-              width: e.spacing[2.5]
-            }
-          ),
-          d ? /* @__PURE__ */ a(S, { onClick: u, variant: "ghost", children: [
-            i ? "Show Less" : "Show more",
-            /* @__PURE__ */ n(
-              B,
-              {
-                icon: i ? "chevron-up" : "chevron-down",
-                iconColor: e.palette.gray[700],
-                iconSize: "xxs",
-                iconType: "fa-light",
-                ml: 0.25,
-                onClick: f
-              }
-            )
-          ] }) : !1
-        ] })
-      ]
-    }
-  );
-};
+import "react/jsx-runtime";
+import "lodash";
+import "react";
+import "styled-components";
+import { u as e } from "../../components-C7JPRIEW.mjs";
 export {
-  E as CodeSnippet
+  e as CodeSnippet
 };

package/dist/components/code-snippet/location-code/index.js

@@ -1,171 +1,9 @@
-import { jsx as d } from "react/jsx-runtime";
-import m from "lodash";
-import { highlightAll as W } from "prismjs";
-import { useEffect as j } from "react";
-import { C as z } from "../../../styles-CROOwXEH.mjs";
-(function() {
-  if (typeof Prism > "u" || typeof document > "u" || !document.querySelector)
-    return;
-  var g = "line-numbers", r = "linkable-line-numbers", p = /\n(?!$)/g;
-  function v(t, e) {
-    return Array.prototype.slice.call((e || document).querySelectorAll(t));
-  }
-  function S(t, e) {
-    return t.classList.contains(e);
-  }
-  function C(t) {
-    t();
-  }
-  var w = /* @__PURE__ */ function() {
-    var t;
-    return function() {
-      if (typeof t > "u") {
-        var e = document.createElement("div");
-        e.style.fontSize = "13px", e.style.lineHeight = "1.5", e.style.padding = "0", e.style.border = "0", e.innerHTML = "&nbsp;<br />&nbsp;", document.body.appendChild(e), t = e.offsetHeight === 38, document.body.removeChild(e);
-      }
-      return t;
-    };
-  }();
-  function B(t, e) {
-    var i = getComputedStyle(t), n = getComputedStyle(e);
-    function s(o) {
-      return +o.substr(0, o.length - 2);
-    }
-    return e.offsetTop + s(n.borderTopWidth) + s(n.paddingTop) - s(i.paddingTop);
-  }
-  function y(t) {
-    return !t || !/pre/i.test(t.nodeName) ? !1 : !!(t.hasAttribute("data-line") || t.id && Prism.util.isActive(t, r));
-  }
-  var E = !0;
-  Prism.plugins.lineHighlight = {
-    /**
-     * Highlights the lines of the given pre.
-     *
-     * This function is split into a DOM measuring and mutate phase to improve performance.
-     * The returned function mutates the DOM when called.
-     *
-     * @param {HTMLElement} pre
-     * @param {string | null} [lines]
-     * @param {string} [classes='']
-     * @returns {() => void}
-     */
-    highlightLines: function(e, i, n) {
-      i = typeof i == "string" ? i : e.getAttribute("data-line") || "";
-      var s = i.replace(/\s+/g, "").split(",").filter(Boolean), o = +e.getAttribute("data-line-offset") || 0, _ = w() ? parseInt : parseFloat, M = _(getComputedStyle(e).lineHeight), L = Prism.util.isActive(e, g), f = e.querySelector("code"), H = L ? e : f || e, h = (
-        /** @type {(() => void)[]} */
-        []
-      ), x = f.textContent.match(p), q = x ? x.length + 1 : 1, I = !f || H == f ? 0 : B(e, f);
-      s.forEach(function(c) {
-        var b = c.split("-"), l = +b[0], u = +b[1] || l;
-        if (u = Math.min(q + o, u), !(u < l)) {
-          var a = e.querySelector('.line-highlight[data-range="' + c + '"]') || document.createElement("div");
-          if (h.push(function() {
-            a.setAttribute("aria-hidden", "true"), a.setAttribute("data-range", c), a.className = (n || "") + " line-highlight";
-          }), L && Prism.plugins.lineNumbers) {
-            var N = Prism.plugins.lineNumbers.getLine(e, l), A = Prism.plugins.lineNumbers.getLine(e, u);
-            if (N) {
-              var O = N.offsetTop + I + "px";
-              h.push(function() {
-                a.style.top = O;
-              });
-            }
-            if (A) {
-              var F = A.offsetTop - N.offsetTop + A.offsetHeight + "px";
-              h.push(function() {
-                a.style.height = F;
-              });
-            }
-          } else
-            h.push(function() {
-              a.setAttribute("data-start", String(l)), u > l && a.setAttribute("data-end", String(u)), a.style.top = (l - o - 1) * M + I + "px", a.textContent = new Array(u - l + 2).join(` 
-`);
-            });
-          h.push(function() {
-            a.style.width = e.scrollWidth + "px";
-          }), h.push(function() {
-            H.appendChild(a);
-          });
-        }
-      });
-      var k = e.id;
-      if (L && Prism.util.isActive(e, r) && k) {
-        S(e, r) || h.push(function() {
-          e.classList.add(r);
-        });
-        var $ = parseInt(e.getAttribute("data-start") || "1");
-        v(".line-numbers-rows > span", e).forEach(function(c, b) {
-          var l = b + $;
-          c.onclick = function() {
-            var u = k + "." + l;
-            E = !1, location.hash = u, setTimeout(function() {
-              E = !0;
-            }, 1);
-          };
-        });
-      }
-      return function() {
-        h.forEach(C);
-      };
-    }
-  };
-  function P() {
-    var t = location.hash.slice(1);
-    v(".temporary.line-highlight").forEach(function(o) {
-      o.parentNode.removeChild(o);
-    });
-    var e = (t.match(/\.([\d,-]+)$/) || [, ""])[1];
-    if (!(!e || document.getElementById(t))) {
-      var i = t.slice(0, t.lastIndexOf(".")), n = document.getElementById(i);
-      if (n) {
-        n.hasAttribute("data-line") || n.setAttribute("data-line", "");
-        var s = Prism.plugins.lineHighlight.highlightLines(n, e, "temporary ");
-        s(), E && document.querySelector(".temporary.line-highlight").scrollIntoView();
-      }
-    }
-  }
-  var T = 0;
-  Prism.hooks.add("before-sanity-check", function(t) {
-    var e = t.element.parentElement;
-    if (y(e)) {
-      var i = 0;
-      v(".line-highlight", e).forEach(function(n) {
-        i += n.textContent.length, n.parentNode.removeChild(n);
-      }), i && /^(?: \n)+$/.test(t.code.slice(-i)) && (t.code = t.code.slice(0, -i));
-    }
-  }), Prism.hooks.add("complete", function t(e) {
-    var i = e.element.parentElement;
-    if (y(i)) {
-      clearTimeout(T);
-      var n = Prism.plugins.lineNumbers, s = e.plugins && e.plugins.lineNumbers;
-      if (S(i, g) && n && !s)
-        Prism.hooks.add("line-numbers", t);
-      else {
-        var o = Prism.plugins.lineHighlight.highlightLines(i);
-        o(), T = setTimeout(P, 1);
-      }
-    }
-  }), window.addEventListener("hashchange", P), window.addEventListener("resize", function() {
-    var t = v("pre").filter(y).map(function(e) {
-      return Prism.plugins.lineHighlight.highlightLines(e);
-    });
-    t.forEach(C);
-  });
-})();
-import '../../../assets/index2.css';const X = ({
-  noCodeMessage: g = "Code snippet not available",
-  snippet: r,
-  specific: p
-}) => (j(() => {
-  W();
-}, []), /* @__PURE__ */ d(z, { "data-private": !0, children: /* @__PURE__ */ d(
-  "pre",
-  {
-    className: "line-highlight",
-    "data-line-offset": m.isNil(r) || m.isString(r) ? 0 : r.offset + 0.7,
-    ...p !== void 0 ? { "data-line": String(Number(p)) } : {},
-    children: m.isNil(r) || m.isString(r) || m.isEmpty(r.content) ? /* @__PURE__ */ d("div", { className: "no-data", children: /* @__PURE__ */ d("p", { children: g }) }) : /* @__PURE__ */ d("code", { className: "language-none", children: r.content })
-  }
-) }));
+import "react/jsx-runtime";
+import "lodash";
+import "prismjs";
+import "react";
+import "../../../vendor-_XDhaIzo.mjs";
+import { ba as e } from "../../../components-C7JPRIEW.mjs";
 export {
-  X as Code
+  e as Code
 };