@fluidattacks/design 3.1.13 → 3.2.0

package/dist/components/inputs/fields/text-area/index.js

@@ -1,81 +1,7 @@
-import { jsx as i, jsxs as T } from "react/jsx-runtime";
-import { forwardRef as $ } from "react";
-import { useTheme as b } from "styled-components";
-import { OutlineContainer as j } from "../../outline-container/index.js";
-import { S as A } from "../../../../styles-BXFVwnWT.mjs";
-import { Icon as I } from "../../../icon/index.js";
-const R = $(function({
-  disabled: o = !1,
-  error: r,
-  helpLink: s,
-  helpText: l,
-  label: c,
-  name: e = "input-text",
-  id: f,
-  maskValue: d = !1,
-  maxLength: a,
-  placeholder: m,
-  required: n,
-  rows: p,
-  tooltip: x,
-  value: t,
-  weight: u,
-  ...h
-}, C) {
-  const S = b();
-  return /* @__PURE__ */ i(
-    j,
-    {
-      error: r,
-      helpLink: s,
-      helpText: l,
-      htmlFor: e,
-      label: c,
-      maxLength: a,
-      required: n,
-      tooltip: x,
-      value: t ? String(t) : void 0,
-      weight: u,
-      children: /* @__PURE__ */ T(
-        A,
-        {
-          className: `${o ? "disabled" : ""} ${r ? "error" : ""}`,
-          children: [
-            /* @__PURE__ */ i(
-              "textarea",
-              {
-                "aria-hidden": !1,
-                "aria-invalid": r ? "true" : "false",
-                "aria-label": e,
-                "aria-required": n,
-                className: d ? "sr-block" : "",
-                "data-testid": `${e}-text-area`,
-                disabled: o,
-                id: f ?? e,
-                maxLength: a,
-                name: e,
-                placeholder: m,
-                ref: C,
-                rows: p,
-                value: t,
-                ...h
-              }
-            ),
-            r ? /* @__PURE__ */ i(
-              I,
-              {
-                icon: "exclamation-circle",
-                iconClass: "error-icon",
-                iconColor: S.palette.error[500],
-                iconSize: "xs"
-              }
-            ) : void 0
-          ]
-        }
-      )
-    }
-  );
-});
+import "react/jsx-runtime";
+import "react";
+import "styled-components";
+import { $ as e } from "../../../../components-C7JPRIEW.mjs";
 export {
-  R as TextArea
+  e as TextArea
 };

package/dist/components/inputs/index.js

@@ -1,28 +1,16 @@
-import { ComboBox as t } from "./fields/combobox/index.js";
-import { InputDate as p } from "./fields/date/index.js";
-import { InputDateRange as n } from "./fields/date-range/index.js";
-import { InputDateTime as f } from "./fields/date-time/index.js";
-import { Editable as a } from "./fields/editable/index.js";
-import { Input as i } from "./fields/input/index.js";
-import { InputFile as g } from "./fields/input-file/index.js";
-import { InputTags as D } from "./fields/input-tags/index.js";
-import { InputNumber as C } from "./fields/number/index.js";
-import { InputNumberRange as R } from "./fields/number-range/index.js";
-import { PhoneInput as h } from "./fields/phone/index.js";
-import { TextArea as A } from "./fields/text-area/index.js";
-import { OutlineContainer as E } from "./outline-container/index.js";
+import { S as e, a0 as n, T as s, U as u, V as p, W as I, X as o, Y as r, _ as i, Z as m, Q as b, R as T, $ as g } from "../../components-C7JPRIEW.mjs";
 export {
-  t as ComboBox,
-  a as Editable,
-  i as Input,
-  p as InputDate,
-  n as InputDateRange,
-  f as InputDateTime,
-  g as InputFile,
-  C as InputNumber,
-  R as InputNumberRange,
-  D as InputTags,
-  E as OutlineContainer,
-  h as PhoneInput,
-  A as TextArea
+  e as ComboBox,
+  n as Editable,
+  s as Input,
+  u as InputDate,
+  p as InputDateRange,
+  I as InputDateTime,
+  o as InputFile,
+  r as InputNumber,
+  i as InputNumberRange,
+  m as InputTags,
+  b as OutlineContainer,
+  T as PhoneInput,
+  g as TextArea
 };

package/dist/components/inputs/label/index.js

@@ -1,38 +1,7 @@
-import { jsxs as c, jsx as i } from "react/jsx-runtime";
-import { isEmpty as m } from "lodash";
-import { useTheme as a } from "styled-components";
-import { Icon as f } from "../../icon/index.js";
-import { T as x } from "../../../index-DwznImvK.mjs";
-const j = ({
-  htmlFor: e,
-  label: r,
-  required: t,
-  tooltip: o,
-  weight: l = "normal"
-}) => {
-  const n = a(), s = `${e}-tooltip`, p = o !== void 0 && !m(o);
-  return /* @__PURE__ */ c("label", { className: `flex font-${l} gap-1 w-full`, htmlFor: e, children: [
-    r,
-    t && /* @__PURE__ */ i(
-      f,
-      {
-        icon: "asterisk",
-        iconColor: n.palette.error[500],
-        iconSize: "xxss"
-      }
-    ),
-    p ? /* @__PURE__ */ i(
-      x,
-      {
-        display: "inline-flex",
-        icon: "circle-info",
-        id: s,
-        place: "top",
-        tip: o
-      }
-    ) : null
-  ] });
-};
+import "react/jsx-runtime";
+import "lodash";
+import "styled-components";
+import { aX as a } from "../../../components-C7JPRIEW.mjs";
 export {
-  j as Label
+  a as Label
 };

package/dist/components/inputs/outline-container/index.js

@@ -1,104 +1,6 @@
-import { jsxs as r, jsx as e, Fragment as b } from "react/jsx-runtime";
-import { useTheme as w } from "styled-components";
-import { Label as x } from "../label/index.js";
-import { a as C } from "../../../styles-BXFVwnWT.mjs";
-import { Container as c } from "../../container/index.js";
-import { Icon as j } from "../../icon/index.js";
-import { Link as z } from "../../link/index.js";
-import { Tag as S } from "../../tag/index.js";
-import "../../typography/heading/index.js";
-import "../../typography/span/index.js";
-import { Text as d } from "../../typography/text/index.js";
-const B = ({
-  children: s,
-  error: i,
-  helpLink: n,
-  helpLinkText: f = "Link here",
-  helpText: o,
-  htmlFor: p,
-  label: m,
-  maxLength: t,
-  required: g,
-  tooltip: h,
-  value: a,
-  weight: u
-}) => {
-  const l = w(), y = a ? a.length : 0;
-  return /* @__PURE__ */ r(C, { children: [
-    m === void 0 ? void 0 : /* @__PURE__ */ e(
-      x,
-      {
-        htmlFor: p,
-        label: m,
-        required: g,
-        tooltip: h,
-        weight: u
-      }
-    ),
-    s,
-    i || t ? /* @__PURE__ */ r(
-      c,
-      {
-        display: "flex",
-        justify: i === void 0 ? "end" : "space-between",
-        width: "100%",
-        children: [
-          i && /* @__PURE__ */ e(
-            d,
-            {
-              className: "error-msg",
-              color: l.palette.error[500],
-              display: "block",
-              lineSpacing: 1,
-              size: "sm",
-              children: i
-            }
-          ),
-          t && /* @__PURE__ */ e(
-            S,
-            {
-              priority: "low",
-              tagLabel: `${y}/${t}`,
-              variant: "error"
-            }
-          )
-        ]
-      }
-    ) : void 0,
-    o || n ? /* @__PURE__ */ r(
-      c,
-      {
-        alignItems: "center",
-        display: "flex",
-        gap: 0.25,
-        width: "100%",
-        children: [
-          o && /* @__PURE__ */ r(b, { children: [
-            /* @__PURE__ */ e(
-              j,
-              {
-                icon: "circle-info",
-                iconColor: l.palette.gray[400],
-                iconSize: "xxs",
-                iconType: "fa-light"
-              }
-            ),
-            /* @__PURE__ */ e(
-              d,
-              {
-                color: l.palette.gray[400],
-                display: "inline-block",
-                size: "sm",
-                children: o
-              }
-            )
-          ] }),
-          n && /* @__PURE__ */ e(z, { href: n, children: f })
-        ]
-      }
-    ) : void 0
-  ] });
-};
+import "react/jsx-runtime";
+import "styled-components";
+import { Q as e } from "../../../components-C7JPRIEW.mjs";
 export {
-  B as OutlineContainer
+  e as OutlineContainer
 };

package/dist/components/inputs/utils/action-button/index.js

@@ -1,31 +1,6 @@
-import { jsx as o } from "react/jsx-runtime";
-import { forwardRef as e } from "react";
-import { S as m } from "../../../../styles-D1eTIklB.mjs";
-import { Icon as f } from "../../../icon/index.js";
-const d = e(function({ disabled: n, icon: t, margin: i, onClick: r, ...a }, c) {
-  return /* @__PURE__ */ o(
-    m,
-    {
-      $margin: i,
-      "aria-label": t,
-      className: "action-btn",
-      disabled: n,
-      onClick: r,
-      ref: c,
-      type: "button",
-      ...a,
-      children: /* @__PURE__ */ o(
-        f,
-        {
-          icon: t,
-          iconClass: "action",
-          iconSize: "xs",
-          iconType: "fa-light"
-        }
-      )
-    }
-  );
-});
+import "react/jsx-runtime";
+import "react";
+import { b8 as m } from "../../../../components-C7JPRIEW.mjs";
 export {
-  d as ActionButton
+  m as ActionButton
 };

package/dist/components/inputs/utils/calendar-button/index.js

@@ -1,37 +1,7 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useRef as m } from "react";
-import { useButton as c } from "react-aria";
-import { C as p } from "../../../../styles-D1eTIklB.mjs";
-import { theme as f } from "../../../colors/index.js";
-import { Icon as i } from "../../../icon/index.js";
-const B = ({
-  disabled: o = !1,
-  icon: t,
-  props: a
-}) => {
-  const r = m(null), { buttonProps: e } = c(a, r);
-  return /* @__PURE__ */ n(
-    p,
-    {
-      ...e,
-      $disabled: o,
-      $focus: !!e["aria-expanded"],
-      $header: t === "calendar" || t === "calendar-clock",
-      disabled: o,
-      ref: r,
-      type: "button",
-      children: /* @__PURE__ */ n(
-        i,
-        {
-          icon: t,
-          iconColor: f.palette.gray[o ? 400 : 700],
-          iconSize: "xs",
-          iconType: "fa-light"
-        }
-      )
-    }
-  );
-};
+import "react/jsx-runtime";
+import "react";
+import "react-aria";
+import { a$ as i } from "../../../../components-C7JPRIEW.mjs";
 export {
-  B as Button
+  i as Button
 };

package/dist/components/inputs/utils/date-selector/index.js

@@ -1,62 +1,5 @@
-import { jsxs as u, jsx as r } from "react/jsx-runtime";
-import { S as m } from "../../../../styles-BXFVwnWT.mjs";
-import { Button as f } from "../calendar-button/index.js";
-import { DateField as d } from "../date-time-field/index.js";
-const j = ({
-  error: t,
-  buttonProps: n,
-  datePickerRef: s,
-  disabled: e = !1,
-  granularity: o = "day",
-  fieldProps: p,
-  groupProps: c,
-  inputRef: l,
-  name: a,
-  ...i
-}) => /* @__PURE__ */ u(
-  m,
-  {
-    ...c,
-    className: `${e ? "disabled" : ""} ${t ? "error" : ""}`,
-    ref: s,
-    children: [
-      /* @__PURE__ */ r(
-        d,
-        {
-          disabled: e,
-          error: t != null,
-          props: {
-            ...p,
-            autoFocus: !1,
-            granularity: o,
-            shouldForceLeadingZeros: !0
-          }
-        }
-      ),
-      /* @__PURE__ */ r(
-        f,
-        {
-          disabled: e,
-          icon: o === "minute" ? "calendar-clock" : "calendar",
-          props: n
-        }
-      ),
-      /* @__PURE__ */ r(
-        "input",
-        {
-          ...i,
-          "aria-label": a,
-          className: "date-input",
-          disabled: e,
-          name: a,
-          ref: l,
-          type: "text",
-          value: ""
-        }
-      )
-    ]
-  }
-);
+import "react/jsx-runtime";
+import { b4 as t } from "../../../../components-C7JPRIEW.mjs";
 export {
-  j as DateSelector
+  t as DateSelector
 };

package/dist/components/inputs/utils/date-time-field/index.js

@@ -1,133 +1,12 @@
-import { jsxs as f, jsx as r } from "react/jsx-runtime";
-import { createCalendar as D } from "@internationalized/date";
-import { isNil as u } from "lodash";
-import { useRef as y, useCallback as P, useState as S } from "react";
-import { useDateField as C, useTimeField as F, useDateSegment as T } from "react-aria";
-import { useDateFieldState as b, useTimeFieldState as k } from "react-stately";
-import { useTheme as M } from "styled-components";
-import { I as A, T as v, a as h, b as g } from "../../../../styles-D1eTIklB.mjs";
-import { Icon as I } from "../../../icon/index.js";
-const x = ({
-  segment: i,
-  state: a
-}) => {
-  const t = M(), n = y(null), e = { ...i, placeholder: {
-    day: "dd",
-    dayPeriod: "(AM/PM)",
-    era: "",
-    hour: "hh",
-    literal: "",
-    minute: "mm",
-    month: "mm",
-    second: "",
-    timeZoneName: "",
-    year: "yyyy"
-  }[i.type] }, { segmentProps: c } = T(e, a, n), m = t.palette.gray[e.isEditable ? 800 : 500];
-  return /* @__PURE__ */ r(
-    "div",
-    {
-      ...e.type !== "literal" && {
-        ...c,
-        className: "segment-cell"
-      },
-      ref: n,
-      style: e.type === "literal" ? void 0 : {
-        color: e.isPlaceholder ? t.palette.gray[400] : m
-      },
-      children: e.isPlaceholder ? e.placeholder : e.text
-    }
-  );
-}, $ = ({
-  disabled: i,
-  error: a = !1,
-  props: t
-}) => {
-  const n = M(), d = y(null), e = b({
-    ...t,
-    createCalendar: D,
-    locale: "en-US"
-  }), { fieldProps: c } = C(t, e, d), m = P(
-    (l) => {
-      const s = document.getElementsByClassName("segment-cell"), o = l.currentTarget;
-      Object.values(s).some(
-        (p) => p.contains(o)
-      ) || (l.preventDefault(), l.stopPropagation());
-    },
-    []
-  );
-  return /* @__PURE__ */ f(A, { ...c, onClick: m, children: [
-    /* @__PURE__ */ r(
-      "div",
-      {
-        className: "flex flex-row",
-        style: { color: n.palette.gray[u(e.value) ? 400 : 800] },
-        tabIndex: -1,
-        children: e.segments.map((l, s) => {
-          const o = `key_${s}`;
-          return /* @__PURE__ */ r(
-            x,
-            {
-              segment: { ...l, isEditable: !i },
-              state: e
-            },
-            o
-          );
-        })
-      }
-    ),
-    a ? /* @__PURE__ */ r(
-      I,
-      {
-        icon: "exclamation-circle",
-        iconColor: n.palette.error[500],
-        iconSize: "xs"
-      }
-    ) : void 0
-  ] });
-}, w = (i) => {
-  const a = y(null), t = k({
-    ...i,
-    locale: "en-US",
-    shouldForceLeadingZeros: !0
-  }), { timeValue: n } = t, d = !u(n) && n.hour < 12 ? "AM" : "PM", [e, c] = S(
-    u(n) ? "AM" : d
-  ), { fieldProps: m } = F(i, t, a), l = P(
-    (s) => {
-      const o = s.currentTarget.name;
-      o !== e && (u(n) || (o === "AM" ? t.setSegment("dayPeriod", 0) : o === "PM" && t.setSegment("dayPeriod", 12))), c(o);
-    },
-    [e, t, n]
-  );
-  return /* @__PURE__ */ f(v, { children: [
-    /* @__PURE__ */ r(h, { ...m, ref: a, children: t.segments.slice(0, -2).map((s, o) => {
-      const p = `key_${o}`;
-      return /* @__PURE__ */ r(x, { segment: s, state: t }, p);
-    }) }),
-    /* @__PURE__ */ f(h, { children: [
-      /* @__PURE__ */ r(
-        g,
-        {
-          id: e === "AM" ? "active" : "",
-          name: "AM",
-          onClick: l,
-          type: "button",
-          children: "AM"
-        }
-      ),
-      /* @__PURE__ */ r(
-        g,
-        {
-          id: e === "PM" ? "active" : "",
-          name: "PM",
-          onClick: l,
-          type: "button",
-          children: "PM"
-        }
-      )
-    ] })
-  ] });
-};
+import "react/jsx-runtime";
+import "@internationalized/date";
+import "lodash";
+import "react";
+import "react-aria";
+import "react-stately";
+import "styled-components";
+import { b2 as d, b3 as l } from "../../../../components-C7JPRIEW.mjs";
 export {
-  $ as DateField,
-  w as TimeField
+  d as DateField,
+  l as TimeField
 };

package/dist/components/inputs/utils/dialog/index.js

@@ -1,14 +1,7 @@
-import { jsx as e } from "react/jsx-runtime";
-import { useRef as m } from "react";
-import { useDialog as s } from "react-aria";
-import { D as a } from "../../../../styles-D1eTIklB.mjs";
-const g = ({
-  children: r,
-  ...i
-}) => {
-  const o = m(null), { dialogProps: t } = s(i, o);
-  return /* @__PURE__ */ e(a, { ...t, ref: o, children: r });
-};
+import "react/jsx-runtime";
+import "react";
+import "react-aria";
+import { b5 as t } from "../../../../components-C7JPRIEW.mjs";
 export {
-  g as Dialog
+  t as Dialog
 };

package/dist/components/inputs/utils/number-field/index.js

@@ -1,86 +1,7 @@
-import { jsxs as x, jsx as e } from "react/jsx-runtime";
-import { useMemo as h } from "react";
-import { useTheme as b } from "styled-components";
-import { S as g } from "../../../../styles-BXFVwnWT.mjs";
-import { ActionButton as m } from "../action-button/index.js";
-import { Icon as y } from "../../../icon/index.js";
-const N = ({
-  error: i,
-  decimalPlaces: o = 0,
-  disabled: r = !1,
-  max: a = 1 / 0,
-  min: p = 0,
-  name: s = "input-number",
-  placeholder: u,
-  ref: c,
-  required: f,
-  value: n,
-  ...l
-}) => {
-  const t = b(), d = h(
-    () => o < 0 ? 0 : o,
-    [o]
-  );
-  return /* @__PURE__ */ x(
-    g,
-    {
-      className: `${r ? "disabled" : ""} ${i ? "error" : ""}`,
-      children: [
-        /* @__PURE__ */ e(
-          "input",
-          {
-            "aria-hidden": !1,
-            "aria-invalid": i ? "true" : "false",
-            "aria-label": s,
-            "aria-required": f,
-            autoComplete: "off",
-            disabled: r,
-            max: a,
-            min: p,
-            placeholder: u,
-            ref: c,
-            required: void 0,
-            step: 10 ** -d,
-            type: "number",
-            value: /^-?\d+/u.test(String(n)) ? n : "",
-            ...l
-          }
-        ),
-        i && /* @__PURE__ */ e(
-          y,
-          {
-            icon: "exclamation-circle",
-            iconClass: "error-icon",
-            iconColor: t.palette.error[500],
-            iconSize: "xs"
-          }
-        ),
-        /* @__PURE__ */ e(
-          m,
-          {
-            borderLeft: "inherit",
-            borderRight: "inherit",
-            disabled: r,
-            icon: "minus",
-            margin: "0 -0.625rem 0 0",
-            px: 0.75,
-            py: 0.75
-          }
-        ),
-        /* @__PURE__ */ e(
-          m,
-          {
-            borderRadius: `0 ${t.spacing[0.5]} ${t.spacing[0.5]} 0`,
-            disabled: r,
-            icon: "plus",
-            px: 0.75,
-            py: 0.75
-          }
-        )
-      ]
-    }
-  );
-};
+import "react/jsx-runtime";
+import "react";
+import "styled-components";
+import { b9 as t } from "../../../../components-C7JPRIEW.mjs";
 export {
-  N as NumberField
+  t as NumberField
 };