@simpli-route/apollo-ds 0.1.71 → 0.1.72

package/dist/index.es40.js

@@ -1,90 +1,10 @@
-import { j as e } from "./index.es47.js";
-import { TextField as S, TextArea as V, Input as q, Text as w, FieldError as z } from "react-aria-components";
-import { cn as i } from "./index.es48.js";
-import "./index.es15.js";
-import { Label as A } from "./index.es16.js";
-import { InputValidationIcon as D } from "./index.es38.js";
-import { textFieldInputVariants as M } from "./index.es69.js";
-function H(u) {
-  const {
-    size: N = "sm",
-    icon: l,
-    label: n,
-    description: c,
-    errorMessage: m,
-    placeholder: x,
-    isRequired: p = !1,
-    isDisabled: r = !1,
-    isReadOnly: d = !1,
-    className: j,
-    inputClassName: h,
-    validationState: a,
-    tooltipText: C,
-    tooltipSupportText: I,
-    tooltipProps: T,
-    labelClassName: b,
-    errorClassName: g,
-    descriptionClassName: v,
-    multiline: F = !1,
-    rows: y,
-    ...R
-  } = u, o = a === "invalid" && !r, f = (s, t) => i(
-    M({
-      size: N,
-      isHovered: s,
-      isFocused: t,
-      isDisabled: r,
-      isReadOnly: d,
-      validationState: a,
-      hasIcon: !!l || !!a
-    }),
-    h
-  ), E = i("text-sm leading-6 text-error-500", g), L = i("text-xs leading-5 text-neutral-700", v);
-  return /* @__PURE__ */ e.jsxs(
-    S,
-    {
-      className: i("flex flex-col gap-2", j),
-      isDisabled: r,
-      isReadOnly: d,
-      isRequired: p,
-      isInvalid: o,
-      ...R,
-      children: [
-        n && /* @__PURE__ */ e.jsx(
-          A,
-          {
-            isRequired: p,
-            tooltipText: C,
-            tooltipSupportText: I,
-            tooltipProps: T,
-            labelClassName: b,
-            children: n
-          }
-        ),
-        /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
-          F ? /* @__PURE__ */ e.jsx(
-            V,
-            {
-              placeholder: x,
-              rows: y,
-              className: ({ isHovered: s, isFocused: t }) => f(s, t)
-            }
-          ) : /* @__PURE__ */ e.jsx(
-            q,
-            {
-              placeholder: x,
-              className: ({ isHovered: s, isFocused: t }) => f(s, t)
-            }
-          ),
-          l && /* @__PURE__ */ e.jsx("div", { className: "absolute inset-y-0 right-0 flex items-center pr-3 text-neutral-700", children: l }),
-          !l && /* @__PURE__ */ e.jsx(D, { validationState: a })
-        ] }),
-        c && !o && /* @__PURE__ */ e.jsx(w, { slot: "description", className: L, children: c }),
-        o && /* @__PURE__ */ e.jsx(z, { className: E, children: typeof m != "function" ? m : null })
-      ]
-    }
-  );
+import { j as e } from "./index.es49.js";
+import { CrossCircleIcon as r, CheckCircleIcon as o } from "./index.es51.js";
+import { cn as i } from "./index.es50.js";
+function m(n) {
+  const { className: t, validationState: s } = n;
+  return s === "invalid" ? /* @__PURE__ */ e.jsx("div", { className: i("pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3", t), children: /* @__PURE__ */ e.jsx(r, { className: "size-6 text-error-500" }) }) : s === "valid" ? /* @__PURE__ */ e.jsx("div", { className: i("pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3", t), children: /* @__PURE__ */ e.jsx(o, { className: "size-6 text-success-500" }) }) : null;
 }
 export {
-  H as TextField
+  m as InputValidationIcon
 };

package/dist/index.es41.js

@@ -1,128 +1,164 @@
-import { j as e } from "./index.es47.js";
-import { ClockIcon as w } from "./index.es49.js";
-import { TimeField as A, Group as H, DateInput as J, Button as K, Text as Q, FieldError as U } from "react-aria-components";
-import { cn as a } from "./index.es48.js";
-import "./index.es15.js";
-import { Label as W } from "./index.es16.js";
-import { TimePickerPopover as X } from "./index.es21.js";
-import { TimeSegment as Y } from "./index.es22.js";
-import { useTimeField as ee } from "./index.es42.js";
-import { timeFieldGroupVariants as ae, timeFieldInputVariants as ie, timeFieldButtonVariants as se } from "./index.es70.js";
-function xe(N) {
+import { j as s } from "./index.es49.js";
+import { useState as D, useRef as ce } from "react";
+import { TextField as fe, Text as pe, FieldError as me } from "react-aria-components";
+import { cn as b } from "./index.es50.js";
+import { Badge as xe } from "./index.es6.js";
+import "./index.es7.js";
+import "./index.es17.js";
+import { Label as he } from "./index.es18.js";
+import { multiTextFieldContainerVariants as ge } from "./index.es74.js";
+const je = (q) => {
   const {
-    size: i = "sm",
-    icon: l,
-    label: n,
-    description: o,
-    errorMessage: m,
-    isRequired: c = !1,
-    isDisabled: t = !1,
-    isReadOnly: d = !1,
-    className: j,
-    inputClassName: v,
-    validationState: p,
-    tooltipText: F,
-    tooltipSupportText: T,
-    tooltipProps: V,
-    labelClassName: b,
-    errorClassName: O,
-    descriptionClassName: P,
-    dateSegmentClassName: k,
-    granularity: S = "minute",
-    hourCycle: u,
-    hideTimeZone: I,
-    shouldForceLeadingZeros: y,
-    placeholderValue: z,
-    minValue: L,
-    maxValue: R,
-    value: B,
-    defaultValue: D,
-    onChange: E,
-    confirmButtonLabel: G = "Ok",
-    ...Z
-  } = N, { currentValue: x, isPickerOpen: f, setIsPickerOpen: h, handleChange: g, containerRef: C } = ee({
-    value: B,
-    defaultValue: D,
-    onChange: E
-  }), r = p === "invalid" && !t, q = () => p === "valid" ? "valid" : r ? "invalid" : "default", M = a("text-sm leading-6 text-error-500", O), _ = a("text-xs leading-5 text-neutral-700", P);
-  return /* @__PURE__ */ e.jsxs(
-    A,
+    label: j,
+    placeholder: z,
+    isDisabled: o = !1,
+    size: E = "sm",
+    description: R,
+    inputValue: T,
+    isInvalid: _,
+    errorMessage: I,
+    invalidInputErrorMessage: k,
+    values: A,
+    onValuesChange: a,
+    onInputChange: B,
+    validateValue: i,
+    separator: r = `
+`,
+    icon: F,
+    tooltipText: G,
+    tooltipSupportText: H,
+    tooltipProps: J,
+    labelClassName: Q,
+    errorClassName: U,
+    descriptionClassName: W,
+    isRequired: M = !1,
+    isReadOnly: S = !1,
+    className: X,
+    inputType: P = "text",
+    inputMax: N,
+    inputMin: y,
+    ...Y
+  } = q, [Z, ee] = D(""), [te, w] = D([]), [K, u] = D(!1), L = T !== void 0, x = A !== void 0, l = L ? T : Z, n = x ? A : te, d = l.trim(), ne = d !== "" && n.includes(d), se = d !== "" && i && !i(d), h = K && (ne || se), le = n.length > 0, C = () => {
+    d !== "" && u(!0);
+  }, c = (e) => {
+    K && u(!1), L || ee(e), B && B(e);
+  }, O = (e) => {
+    const t = e.trim();
+    if (!t)
+      return !1;
+    if (P === "number") {
+      const p = Number(t);
+      if (Number.isNaN(p) || y !== void 0 && p < Number(y) || N !== void 0 && p > Number(N))
+        return !1;
+    }
+    if (i && !i(t) || n.includes(t))
+      return !1;
+    const f = [...n, t];
+    return x || w(f), a && a(f), !0;
+  }, $ = (e) => {
+    const t = n.filter((f) => f !== e);
+    x || w(t), a && a(t);
+  }, ae = (e) => {
+    if (e.key === "Enter")
+      e.preventDefault(), C(), l.trim() && O(l) && (c(""), u(!1));
+    else if (e.key === " " || e.key === "Tab")
+      C(), l.trim() && (O(l) ? (c(""), u(!1)) : e.preventDefault());
+    else if (e.key === "Backspace" && l === "" && n.length > 0) {
+      e.preventDefault();
+      const t = n[n.length - 1];
+      $(t), c(t), u(!1);
+    }
+  }, ie = () => {
+    C();
+  }, re = (e) => {
+    const t = e.clipboardData.getData("text");
+    if (!(typeof r == "string" ? new RegExp(r.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")) : r).test(t))
+      return;
+    e.preventDefault();
+    const p = t.split(r), V = [];
+    for (const v of p) {
+      const m = v.trim();
+      m && (!i || i(m)) && !n.includes(m) && !V.includes(m) && V.push(m);
+    }
+    if (V.length > 0) {
+      const v = [...n, ...V];
+      x || w(v), a && a(v);
+    }
+    c("");
+  }, g = (_ || h) && !o, oe = ce(null), ue = b("text-sm leading-6 text-error-500", U), de = b("text-xs leading-5 text-neutral-700", W);
+  return /* @__PURE__ */ s.jsxs(
+    fe,
     {
-      value: x,
-      className: a("flex flex-col gap-2", j),
-      isDisabled: t,
-      isReadOnly: d,
-      isRequired: c,
-      isInvalid: r,
-      granularity: S,
-      hourCycle: u,
-      hideTimeZone: I,
-      shouldForceLeadingZeros: y,
-      placeholderValue: z,
-      minValue: L,
-      maxValue: R,
-      onChange: g,
-      ...Z,
+      className: b("flex flex-col gap-2", X),
+      isDisabled: o,
+      isReadOnly: S,
+      isRequired: M,
+      isInvalid: g,
+      ...Y,
       children: [
-        n && /* @__PURE__ */ e.jsx(
-          W,
+        j && /* @__PURE__ */ s.jsx(
+          he,
           {
-            isRequired: c,
-            tooltipText: F,
-            tooltipSupportText: T,
-            tooltipProps: V,
-            labelClassName: b,
-            children: n
+            isRequired: M,
+            tooltipText: G,
+            tooltipSupportText: H,
+            tooltipProps: J,
+            labelClassName: Q,
+            children: j
           }
         ),
-        /* @__PURE__ */ e.jsxs(
-          H,
+        /* @__PURE__ */ s.jsxs(
+          "div",
           {
-            ref: C,
-            className: ({ isFocusWithin: s, isHovered: $ }) => a(
-              ae({
-                size: i,
-                isHovered: $,
-                isFocused: s || f,
-                isDisabled: t,
-                isReadOnly: d,
-                validationState: q()
-              }),
-              v
-            ),
+            ref: oe,
+            "data-testid": "multi-text-field-container",
+            className: ge({
+              size: E,
+              isDisabled: o,
+              hasInvalidValue: h
+            }),
             children: [
-              /* @__PURE__ */ e.jsx(J, { className: a(ie({ size: i })), children: (s) => /* @__PURE__ */ e.jsx(Y, { segment: s, className: k }) }),
-              l ? /* @__PURE__ */ e.jsx("div", { className: "flex items-center text-neutral-700", children: l }) : /* @__PURE__ */ e.jsx(
-                K,
+              le && /* @__PURE__ */ s.jsx(s.Fragment, { children: n.map((e) => /* @__PURE__ */ s.jsx(
+                xe,
                 {
-                  className: a(se({ size: i })),
-                  "aria-label": "Time Picker",
-                  isDisabled: t,
-                  onPress: () => h((s) => !s),
-                  children: /* @__PURE__ */ e.jsx(w, { className: i === "xs" ? "size-4" : i === "lg" ? "size-6" : "size-5" })
+                  label: e,
+                  size: E,
+                  isDisabled: o,
+                  onDelete: () => $(e)
+                },
+                e
+              )) }),
+              /* @__PURE__ */ s.jsx(
+                "input",
+                {
+                  type: P,
+                  max: N,
+                  min: y,
+                  value: l,
+                  placeholder: z,
+                  className: b(
+                    "min-w-[120px] flex-1 border-0 bg-transparent p-0 outline-none focus:ring-0",
+                    h && "text-error-500"
+                  ),
+                  disabled: o,
+                  readOnly: S,
+                  "aria-invalid": g,
+                  onChange: (e) => c(e.target.value),
+                  onKeyDown: ae,
+                  onBlur: ie,
+                  onPaste: re
                 }
-              )
+              ),
+              F ? /* @__PURE__ */ s.jsx("div", { className: "absolute inset-y-0 right-0 flex items-center pr-3 text-neutral-700", children: F }) : null
             ]
           }
         ),
-        o && !r && /* @__PURE__ */ e.jsx(Q, { slot: "description", className: _, children: o }),
-        r && /* @__PURE__ */ e.jsx(U, { className: M, children: typeof m != "function" ? m : null }),
-        /* @__PURE__ */ e.jsx(
-          X,
-          {
-            isOpen: f,
-            value: x,
-            hourCycle: u,
-            containerRef: C,
-            confirmButtonLabel: G,
-            onOpenChange: h,
-            onChange: g
-          }
-        )
+        R && !g && /* @__PURE__ */ s.jsx(pe, { slot: "description", className: de, children: R }),
+        g && /* @__PURE__ */ s.jsx(me, { className: ue, children: I ? typeof I != "function" ? I : null : h && k ? k : null })
       ]
     }
   );
-}
+};
 export {
-  xe as TimeField
+  je as MultiTextField
 };

package/dist/index.es42.js

@@ -1,18 +1,90 @@
-import { useState as u, useRef as f, useEffect as d } from "react";
-function m(a) {
-  const { value: e, defaultValue: s, onChange: n } = a, [o, r] = u(!1), [c, t] = u(e || s || null), i = f(null);
-  return d(() => {
-    e !== void 0 && t(e);
-  }, [e]), {
-    currentValue: e !== void 0 ? e : c,
-    isPickerOpen: o,
-    setIsPickerOpen: r,
-    handleChange: (l) => {
-      t(l), n == null || n(l);
-    },
-    containerRef: i
-  };
+import { j as e } from "./index.es49.js";
+import { TextField as S, TextArea as V, Input as q, Text as w, FieldError as z } from "react-aria-components";
+import { cn as i } from "./index.es50.js";
+import "./index.es17.js";
+import { Label as A } from "./index.es18.js";
+import { InputValidationIcon as D } from "./index.es40.js";
+import { textFieldInputVariants as M } from "./index.es74.js";
+function H(u) {
+  const {
+    size: N = "sm",
+    icon: l,
+    label: n,
+    description: c,
+    errorMessage: m,
+    placeholder: x,
+    isRequired: p = !1,
+    isDisabled: r = !1,
+    isReadOnly: d = !1,
+    className: j,
+    inputClassName: h,
+    validationState: a,
+    tooltipText: C,
+    tooltipSupportText: I,
+    tooltipProps: T,
+    labelClassName: b,
+    errorClassName: g,
+    descriptionClassName: v,
+    multiline: F = !1,
+    rows: y,
+    ...R
+  } = u, o = a === "invalid" && !r, f = (s, t) => i(
+    M({
+      size: N,
+      isHovered: s,
+      isFocused: t,
+      isDisabled: r,
+      isReadOnly: d,
+      validationState: a,
+      hasIcon: !!l || !!a
+    }),
+    h
+  ), E = i("text-sm leading-6 text-error-500", g), L = i("text-xs leading-5 text-neutral-700", v);
+  return /* @__PURE__ */ e.jsxs(
+    S,
+    {
+      className: i("flex flex-col gap-2", j),
+      isDisabled: r,
+      isReadOnly: d,
+      isRequired: p,
+      isInvalid: o,
+      ...R,
+      children: [
+        n && /* @__PURE__ */ e.jsx(
+          A,
+          {
+            isRequired: p,
+            tooltipText: C,
+            tooltipSupportText: I,
+            tooltipProps: T,
+            labelClassName: b,
+            children: n
+          }
+        ),
+        /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+          F ? /* @__PURE__ */ e.jsx(
+            V,
+            {
+              placeholder: x,
+              rows: y,
+              className: ({ isHovered: s, isFocused: t }) => f(s, t)
+            }
+          ) : /* @__PURE__ */ e.jsx(
+            q,
+            {
+              placeholder: x,
+              className: ({ isHovered: s, isFocused: t }) => f(s, t)
+            }
+          ),
+          l && /* @__PURE__ */ e.jsx("div", { className: "absolute inset-y-0 right-0 flex items-center pr-3 text-neutral-700", children: l }),
+          !l && /* @__PURE__ */ e.jsx(D, { validationState: a })
+        ] }),
+        c && !o && /* @__PURE__ */ e.jsx(w, { slot: "description", className: L, children: c }),
+        o && /* @__PURE__ */ e.jsx(z, { className: E, children: typeof m != "function" ? m : null })
+      ]
+    }
+  );
 }
 export {
-  m as useTimeField
+  H as TextField
 };

package/dist/index.es43.js

@@ -1,26 +1,128 @@
-import { j as s } from "./index.es47.js";
-import { forwardRef as f, useContext as u } from "react";
-import { useTooltip as T, mergeProps as h } from "react-aria";
-import { cn as e } from "./index.es48.js";
-import { TooltipContext as j } from "./index.es57.js";
-import { tooltipVariants as N } from "./index.es98.js";
-const P = f((p, i) => {
-  const { placement: l = "bottom", className: m, mode: o = "dark", supportText: t, children: a, ...r } = p, { state: n, ...c } = u(j), { tooltipProps: x } = T(r, n), d = e(N({ placement: l, mode: o, hasSupportText: !!t }), m);
-  return /* @__PURE__ */ s.jsxs("span", { className: d, ...h(r, x, c), ref: i, children: [
-    a,
-    t ? /* @__PURE__ */ s.jsx(
-      "div",
-      {
-        className: e(
-          "!text-sm !font-normal !leading-[19.07px]",
-          o === "dark" ? "!text-blue-50" : "!text-neutral-700"
+import { j as e } from "./index.es49.js";
+import { ClockIcon as w } from "./index.es51.js";
+import { TimeField as A, Group as H, DateInput as J, Button as K, Text as Q, FieldError as U } from "react-aria-components";
+import { cn as a } from "./index.es50.js";
+import "./index.es17.js";
+import { Label as W } from "./index.es18.js";
+import { TimePickerPopover as X } from "./index.es23.js";
+import { TimeSegment as Y } from "./index.es24.js";
+import { useTimeField as ee } from "./index.es44.js";
+import { timeFieldGroupVariants as ae, timeFieldInputVariants as ie, timeFieldButtonVariants as se } from "./index.es75.js";
+function xe(N) {
+  const {
+    size: i = "sm",
+    icon: l,
+    label: n,
+    description: o,
+    errorMessage: m,
+    isRequired: c = !1,
+    isDisabled: t = !1,
+    isReadOnly: d = !1,
+    className: j,
+    inputClassName: v,
+    validationState: p,
+    tooltipText: F,
+    tooltipSupportText: T,
+    tooltipProps: V,
+    labelClassName: b,
+    errorClassName: O,
+    descriptionClassName: P,
+    dateSegmentClassName: k,
+    granularity: S = "minute",
+    hourCycle: u,
+    hideTimeZone: I,
+    shouldForceLeadingZeros: y,
+    placeholderValue: z,
+    minValue: L,
+    maxValue: R,
+    value: B,
+    defaultValue: D,
+    onChange: E,
+    confirmButtonLabel: G = "Ok",
+    ...Z
+  } = N, { currentValue: x, isPickerOpen: f, setIsPickerOpen: h, handleChange: g, containerRef: C } = ee({
+    value: B,
+    defaultValue: D,
+    onChange: E
+  }), r = p === "invalid" && !t, q = () => p === "valid" ? "valid" : r ? "invalid" : "default", M = a("text-sm leading-6 text-error-500", O), _ = a("text-xs leading-5 text-neutral-700", P);
+  return /* @__PURE__ */ e.jsxs(
+    A,
+    {
+      value: x,
+      className: a("flex flex-col gap-2", j),
+      isDisabled: t,
+      isReadOnly: d,
+      isRequired: c,
+      isInvalid: r,
+      granularity: S,
+      hourCycle: u,
+      hideTimeZone: I,
+      shouldForceLeadingZeros: y,
+      placeholderValue: z,
+      minValue: L,
+      maxValue: R,
+      onChange: g,
+      ...Z,
+      children: [
+        n && /* @__PURE__ */ e.jsx(
+          W,
+          {
+            isRequired: c,
+            tooltipText: F,
+            tooltipSupportText: T,
+            tooltipProps: V,
+            labelClassName: b,
+            children: n
+          }
         ),
-        children: t
-      }
-    ) : null
-  ] });
-});
-P.displayName = "Tooltip";
+        /* @__PURE__ */ e.jsxs(
+          H,
+          {
+            ref: C,
+            className: ({ isFocusWithin: s, isHovered: $ }) => a(
+              ae({
+                size: i,
+                isHovered: $,
+                isFocused: s || f,
+                isDisabled: t,
+                isReadOnly: d,
+                validationState: q()
+              }),
+              v
+            ),
+            children: [
+              /* @__PURE__ */ e.jsx(J, { className: a(ie({ size: i })), children: (s) => /* @__PURE__ */ e.jsx(Y, { segment: s, className: k }) }),
+              l ? /* @__PURE__ */ e.jsx("div", { className: "flex items-center text-neutral-700", children: l }) : /* @__PURE__ */ e.jsx(
+                K,
+                {
+                  className: a(se({ size: i })),
+                  "aria-label": "Time Picker",
+                  isDisabled: t,
+                  onPress: () => h((s) => !s),
+                  children: /* @__PURE__ */ e.jsx(w, { className: i === "xs" ? "size-4" : i === "lg" ? "size-6" : "size-5" })
+                }
+              )
+            ]
+          }
+        ),
+        o && !r && /* @__PURE__ */ e.jsx(Q, { slot: "description", className: _, children: o }),
+        r && /* @__PURE__ */ e.jsx(U, { className: M, children: typeof m != "function" ? m : null }),
+        /* @__PURE__ */ e.jsx(
+          X,
+          {
+            isOpen: f,
+            value: x,
+            hourCycle: u,
+            containerRef: C,
+            confirmButtonLabel: G,
+            onOpenChange: h,
+            onChange: g
+          }
+        )
+      ]
+    }
+  );
+}
 export {
-  P as Tooltip
+  xe as TimeField
 };