@simpli-route/apollo-ds 0.1.83 → 0.1.85

package/dist/index.es34.js

@@ -1,50 +1,85 @@
-import { j as c } from "./index.es49.js";
-import { CheckIcon as h } from "./index.es51.js";
-import { useState as j } from "react";
-import { Button as S } from "react-aria-components";
-import { cn as k } from "./index.es50.js";
-import { statusChipVariants as I } from "./index.es78.js";
-const F = ({
-  size: m = "sm",
-  label: n,
-  variant: i = "success",
-  isSelected: o = !1,
-  isDisabled: s = !1,
-  className: f,
-  onSelectionChange: e,
-  onPress: a,
-  ...p
-}) => {
-  const [l, u] = j(o), r = e ? o : l, d = () => {
-    if (s)
-      return;
-    const t = !r;
-    e ? e(t) : u(t), a && a({});
-  };
-  return /* @__PURE__ */ c.jsxs(
-    S,
-    {
-      isDisabled: s,
-      className: ({ isHovered: t, isFocusVisible: x }) => k(
-        I({
-          size: m,
-          variant: i,
-          isSelected: r,
-          isDisabled: s,
-          isHovered: t,
-          isFocused: x
-        }),
-        f
+import { j as s } from "./index.es52.js";
+import { useMemo as N } from "react";
+import { ComboBox as P, Input as R } from "react-aria-components";
+import { cn as d } from "./index.es53.js";
+import { useDebouncedValue as V } from "./index.es93.js";
+import "./index.es20.js";
+import { Label as v } from "./index.es21.js";
+import { inputVariants as y } from "./index.es74.js";
+import { MultiSearchField as B } from "./index.es94.js";
+import { SearchFieldIconContainer as D } from "./index.es95.js";
+import { SearchFieldMessages as H } from "./index.es96.js";
+import { SearchFieldPopover as z } from "./index.es97.js";
+import { getSearchFieldDefaultProps as E, getHighlightedParts as O } from "./index.es98.js";
+const Z = (l) => {
+  const {
+    label: a,
+    onReset: i,
+    placeholder: u,
+    isDisabled: t,
+    delay: n,
+    searchIcon: p,
+    clearIcon: f,
+    size: c,
+    description: g,
+    inputValue: m,
+    isInvalid: x,
+    errorMessage: b,
+    items: r,
+    allowMultipleValues: j,
+    noResultsText: I,
+    containerClassName: C,
+    classNameInput: w,
+    ...F
+  } = E(l), e = V(m, n ?? n), L = !!(e && i), h = N(() => e ? r.filter((o) => o.label.toLowerCase().includes(e.toLowerCase())).map((o) => {
+    const S = !!(e && o.label.toLowerCase().includes(e.toLowerCase())), M = O(o.label, e ?? "");
+    return { ...o, shouldHighlight: S, highlightedParts: M };
+  }) : r.map((o) => ({
+    ...o,
+    shouldHighlight: !1,
+    highlightedParts: [{ text: o.label, highlight: !1 }]
+  })), [e, r]);
+  return j ? /* @__PURE__ */ s.jsx(B, { ...l }) : /* @__PURE__ */ s.jsxs(P, { inputValue: m, isDisabled: t, allowsEmptyCollection: !0, ...F, children: [
+    a && /* @__PURE__ */ s.jsx(v, { children: a }),
+    /* @__PURE__ */ s.jsxs("div", { className: d("relative flex items-center", C), children: [
+      /* @__PURE__ */ s.jsx(
+        R,
+        {
+          placeholder: u,
+          className: d(
+            y({
+              size: c ?? c,
+              isDisabled: t,
+              hasIcon: !0
+            }),
+            w
+          ),
+          disabled: t,
+          readOnly: l.isReadOnly
+        }
       ),
-      onPress: d,
-      ...p,
-      children: [
-        r && /* @__PURE__ */ c.jsx("span", { "data-testid": "check-icon", children: /* @__PURE__ */ c.jsx(h, { className: "size-3" }) }),
-        n
-      ]
-    }
-  );
+      /* @__PURE__ */ s.jsx(
+        D,
+        {
+          showClearIcon: L,
+          clearIcon: f,
+          searchIcon: p,
+          isDisabled: t,
+          onReset: i
+        }
+      )
+    ] }),
+    /* @__PURE__ */ s.jsx(H, { description: g, isInvalid: x, errorMessage: b }),
+    /* @__PURE__ */ s.jsx(
+      z,
+      {
+        hasNoResults: h.length === 0 && !!e,
+        noResultsText: I,
+        items: h
+      }
+    )
+  ] });
 };
 export {
-  F as StatusChip
+  Z as SearchField
 };

package/dist/index.es35.js

@@ -1,50 +1,124 @@
-import { j as p } from "./index.es49.js";
-import { Children as P, cloneElement as R } from "react";
-import { StepperCompleted as h } from "./index.es36.js";
-import { StepperStep as w } from "./index.es37.js";
-function C(g) {
-  var f, a, d;
+import { j as e } from "./index.es52.js";
+import { forwardRef as W, useState as X } from "react";
+import { useFilter as Y, Popover as Z, FieldError as $, Select as C } from "react-aria-components";
+import { cn as n } from "./index.es53.js";
+import "./index.es20.js";
+import { Label as ee } from "./index.es21.js";
+import { PopoverContent as te } from "./index.es82.js";
+import { SelectContent as le } from "./index.es106.js";
+import { selectInputPopoverVariants as se } from "./index.es63.js";
+const ae = (I, y) => {
   const {
-    children: y,
-    activeStep: n,
-    size: j = "md",
-    onStepClick: l,
-    allowNextStepsSelect: x = !1,
-    baseIcon: I,
-    completedIcon: v
-  } = g, c = P.toArray(y), r = c.filter(
-    (t) => t.type === w
-  ), s = c.find(
-    (t) => t.type === h
-  ), i = (t, e) => t.props.error ? "error" : n === e ? "inProgress" : n > e ? "completed" : "pending", A = r.reduce(
-    (t, e, o) => {
-      const m = i(e, o), u = r[o + 1], E = u ? i(u, o + 1) : "pending", S = typeof l != "function" ? !1 : typeof e.props.allowStepClick == "boolean" ? e.props.allowStepClick : m === "completed" || x;
-      return t.push(
-        R(e, {
-          icon: e.props.icon || I || o + 1,
-          key: o,
-          step: o,
-          size: j,
-          state: m,
-          onPress: () => {
-            S && (l == null || l(o));
-          },
-          allowStepClick: S,
-          completedIcon: e.props.completedIcon || v,
-          nextState: E,
-          isLastStep: o === r.length - 1
-        })
-      ), t;
-    },
-    []
-  ), N = (a = (f = r[n]) == null ? void 0 : f.props) == null ? void 0 : a.children, b = (d = s == null ? void 0 : s.props) == null ? void 0 : d.children, k = n > r.length - 1 ? b : N;
-  return /* @__PURE__ */ p.jsxs("div", { className: "flex w-full flex-col gap-2", children: [
-    /* @__PURE__ */ p.jsx("div", { className: "flex w-full items-center", children: A }),
-    /* @__PURE__ */ p.jsx("div", { className: "flex", children: k })
+    label: m,
+    items: P,
+    selectionMode: r = "single",
+    value: u,
+    defaultValue: d,
+    placeholder: V = "Select",
+    isDisabled: s = !1,
+    isRequired: F = !1,
+    size: L = "xs",
+    className: M,
+    classNameLabel: x,
+    classNameButton: O,
+    classNamePopover: R,
+    tooltipText: T,
+    tooltipSupportText: E,
+    tooltipProps: w,
+    onChange: t,
+    maxLengthTextOption: z = 18,
+    placeholderSearch: A = "Search",
+    enableSearch: D = !1,
+    classNameSearchField: q,
+    classNameSearchFieldInput: B,
+    virtualizedList: _ = !1,
+    noResultsText: k = "No se encontraron resultados",
+    validationState: f,
+    errorMessage: o,
+    errorClassName: G,
+    onOpenChange: i,
+    ...h
+  } = I, { contains: H } = Y({ sensitivity: "base" }), [J, v] = X(() => d !== void 0 ? d : r === "multiple" ? [] : null), c = u !== void 0, a = c ? u : J, N = (l) => {
+    i == null || i(l);
+  }, p = f === "invalid" && !s, K = n("text-sm leading-6 text-error-500", G), Q = (l) => {
+    if (r === "multiple" && a && Array.isArray(a)) {
+      const b = a.filter((U) => U !== l);
+      c || v(b), t == null || t(b);
+    }
+  }, S = (l) => {
+    c || v(l), t == null || t(l);
+  }, j = n("flex w-full flex-col gap-1", M), g = /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    m ? /* @__PURE__ */ e.jsx(
+      ee,
+      {
+        labelClassName: n("mb-[1px] text-left leading-[19.07px]", {
+          "text-neutral-700": s,
+          [x || ""]: !!x
+        }),
+        isRequired: F,
+        tooltipText: T,
+        tooltipSupportText: E,
+        tooltipProps: w,
+        children: m
+      }
+    ) : null,
+    /* @__PURE__ */ e.jsx(
+      le,
+      {
+        ref: y,
+        size: L,
+        isDisabled: s,
+        classNameButton: O,
+        selectionMode: r,
+        maxLengthTextOption: z,
+        handleDeleteOptionSelected: Q,
+        placeholder: V,
+        validationState: f
+      }
+    ),
+    /* @__PURE__ */ e.jsx(Z, { className: n(se(), R), children: /* @__PURE__ */ e.jsx(
+      te,
+      {
+        enableSearch: D,
+        contains: H,
+        classNameSearchField: q,
+        classNameSearchFieldInput: B,
+        placeholderSearch: A,
+        items: P,
+        virtualizedList: _,
+        renderEmptyState: () => /* @__PURE__ */ e.jsx("div", { className: "px-3 py-2 text-xs text-neutral-600", children: k })
+      }
+    ) }),
+    p && o ? /* @__PURE__ */ e.jsx($, { className: K, children: typeof o != "function" ? o : null }) : null
   ] });
-}
-C.Completed = h;
-C.Step = w;
+  return r === "multiple" ? /* @__PURE__ */ e.jsx(
+    C,
+    {
+      ...h,
+      className: j,
+      selectionMode: "multiple",
+      isDisabled: s,
+      isInvalid: p,
+      value: a,
+      onOpenChange: N,
+      onChange: S,
+      children: g
+    }
+  ) : /* @__PURE__ */ e.jsx(
+    C,
+    {
+      ...h,
+      className: j,
+      selectionMode: "single",
+      isDisabled: s,
+      isInvalid: p,
+      value: a,
+      onOpenChange: N,
+      onChange: S,
+      children: g
+    }
+  );
+}, xe = W(ae);
 export {
-  C as Stepper
+  xe as SelectInput
 };

package/dist/index.es36.js

@@ -1,5 +1,80 @@
-const e = () => null;
-e.displayName = "StepperCompleted";
+import { j as m } from "./index.es52.js";
+import { useState as q, useEffect as x } from "react";
+import { Slider as z, SliderTrack as B } from "react-aria-components";
+import { cn as F } from "./index.es53.js";
+import { SliderContainerTrack as G } from "./index.es99.js";
+import { validateMinDistance as H } from "./index.es100.js";
+const U = ({
+  type: r = "single",
+  showTypeValue: A = "default",
+  positionTooltip: S = "top",
+  modeTooltip: j = "dark",
+  isHiddenValue: w = !1,
+  maxValue: T = 100,
+  minValue: k = 0,
+  value: f = r === "range" ? [0, 5] : 0,
+  onChangeValue: i,
+  className: p,
+  classNameFilled: v,
+  classNameUnfilled: N,
+  classNameThumb: E,
+  suffix: M = "%",
+  suffixRangeCustom: P = {
+    left: "",
+    right: ""
+  },
+  step: R = 1,
+  minDistance: d = 2,
+  ...$
+}) => {
+  const [l, b] = q(r);
+  return x(() => {
+    if (r === "range" && Array.isArray(f)) {
+      const [s, t] = f;
+      if (t - s < d) {
+        const c = [s, s + d];
+        (c[0] !== f[0] || c[1] !== f[1]) && (i == null || i(c));
+      }
+    }
+  }, [r, f, i, d]), x(() => {
+    l !== r && (b(r), i == null || i(r === "range" ? [0, 5] : 0));
+  }, [r, i, l]), /* @__PURE__ */ m.jsx("div", { className: "flex w-full flex-col py-4", children: /* @__PURE__ */ m.jsx(
+    z,
+    {
+      value: f,
+      step: R,
+      maxValue: T,
+      minValue: k,
+      className: F("w-full", p),
+      onChange: (s) => {
+        const t = s;
+        if (t !== void 0) {
+          const c = Array.isArray(t), o = r === "range" && c ? H(t, r, d) : t;
+          i == null || i(
+            r === "range" ? o : Array.isArray(o) ? o[0] || 0 : o
+          );
+        }
+      },
+      ...$,
+      children: /* @__PURE__ */ m.jsx(B, { className: "relative h-3 w-full cursor-pointer", children: ({ state: s }) => /* @__PURE__ */ m.jsx(
+        G,
+        {
+          state: s,
+          type: r,
+          showTypeValue: A,
+          isHiddenValue: w,
+          suffix: M,
+          suffixRangeCustom: P,
+          classNameFilled: v,
+          classNameUnfilled: N,
+          modeTooltip: j,
+          positionTooltip: S,
+          classNameThumb: E
+        }
+      ) })
+    }
+  ) });
+};
 export {
-  e as StepperCompleted
+  U as Slider
 };

package/dist/index.es37.js

@@ -1,102 +1,50 @@
-import { j as n } from "./index.es49.js";
-import { CheckIcon as I } from "./index.es51.js";
-import { motion as f } from "framer-motion";
-import { useRef as k } from "react";
-import { useButton as D, useHover as V } from "react-aria";
-import z from "./index.es86.js";
-import B from "./index.es87.js";
-import { cn as H } from "./index.es50.js";
-import { stepVariants as R, iconVariants as $, labelVariants as E } from "./index.es88.js";
-const c = z(B), x = (s, e) => typeof s == "function" ? /* @__PURE__ */ n.jsx(s, { step: e || 0 }) : s, C = (s) => {
-  var t, r, o, a, i;
-  const e = (t = c == null ? void 0 : c.theme) == null ? void 0 : t.colors;
-  switch (s) {
-    case "pending":
-      return ((r = e == null ? void 0 : e.neutral) == null ? void 0 : r["500"]) || "#C7C9D1";
-    case "inProgress":
-      return ((o = e == null ? void 0 : e.blue) == null ? void 0 : o["500"]) || "#2644D9";
-    case "completed":
-      return ((a = e == null ? void 0 : e.success) == null ? void 0 : a["500"]) || "#1FB576";
-    case "error":
-      return ((i = e == null ? void 0 : e.error) == null ? void 0 : i["500"]) || "#CC4033";
-    default:
-      return "#C7C9D1";
-  }
-}, G = (s, e) => {
-  const t = C(s), r = C(e);
-  return {
-    background: `linear-gradient(to right, ${t} 50%, ${r} 50%)`
+import { j as c } from "./index.es52.js";
+import { CheckIcon as h } from "./index.es81.js";
+import { useState as j } from "react";
+import { Button as S } from "react-aria-components";
+import { cn as k } from "./index.es53.js";
+import { statusChipVariants as I } from "./index.es76.js";
+const F = ({
+  size: m = "sm",
+  label: n,
+  variant: i = "success",
+  isSelected: o = !1,
+  isDisabled: s = !1,
+  className: f,
+  onSelectionChange: e,
+  onPress: a,
+  ...p
+}) => {
+  const [l, u] = j(o), r = e ? o : l, d = () => {
+    if (s)
+      return;
+    const t = !r;
+    e ? e(t) : u(t), a && a({});
   };
-};
-function W(s) {
-  const {
-    step: e,
-    state: t,
-    size: r,
-    icon: o,
-    completedIcon: a,
-    onPress: i,
-    nextState: h,
-    isLastStep: d,
-    allowStepClick: b = !1,
-    isDisabled: l = !1,
-    label: m
-  } = s, j = k(null), { buttonProps: g, isPressed: p } = D(
+  return /* @__PURE__ */ c.jsxs(
+    S,
     {
-      ...s,
-      onPress: b ? i : void 0,
-      isDisabled: l
-    },
-    j
-  ), { hoverProps: v, isHovered: u } = V({}), w = R({ size: r, state: t, isHovered: u, isPressed: p, isDisabled: l }), N = $({ size: r, state: t, isHovered: u }), P = E({ size: r }), S = x(t === "completed" ? a || /* @__PURE__ */ n.jsx(I, {}) : o, e), y = x(m, e);
-  return /* @__PURE__ */ n.jsxs("div", { className: H("flex h-full items-center", d ? "w-fit" : "w-full"), children: [
-    /* @__PURE__ */ n.jsx("div", { className: "flex h-24 w-fit items-center justify-center py-2", children: /* @__PURE__ */ n.jsxs(
-      "button",
-      {
-        className: "z-10 flex flex-col items-center whitespace-nowrap",
-        ...v,
-        ...g,
-        "data-testid": "step-button",
-        "data-state": t,
-        "aria-disabled": l,
-        children: [
-          /* @__PURE__ */ n.jsx(
-            f.div,
-            {
-              className: w,
-              "data-testid": "step-icon-container",
-              initial: !1,
-              animate: { scale: p ? 0.95 : 1 },
-              transition: { duration: 0.2 },
-              children: /* @__PURE__ */ n.jsx(
-                f.span,
-                {
-                  className: N,
-                  initial: !1,
-                  animate: {
-                    scale: t === "completed" ? [1, 1.1, 1] : 1,
-                    rotate: t === "completed" ? [0, 10, 0] : 0
-                  },
-                  transition: { duration: 0.3 },
-                  children: S
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ n.jsx("div", { className: "mt-2 flex select-none flex-col items-center justify-between", children: m ? /* @__PURE__ */ n.jsx("span", { className: P, children: y }) : null })
-        ]
-      }
-    ) }),
-    d ? null : /* @__PURE__ */ n.jsx(
-      "div",
-      {
-        className: "mx-4 hidden h-1 w-full sm:block",
-        "data-testid": "progress-bar",
-        style: G(t, h)
-      }
-    )
-  ] });
-}
+      isDisabled: s,
+      className: ({ isHovered: t, isFocusVisible: x }) => k(
+        I({
+          size: m,
+          variant: i,
+          isSelected: r,
+          isDisabled: s,
+          isHovered: t,
+          isFocused: x
+        }),
+        f
+      ),
+      onPress: d,
+      ...p,
+      children: [
+        r && /* @__PURE__ */ c.jsx("span", { "data-testid": "check-icon", children: /* @__PURE__ */ c.jsx(h, { className: "size-3" }) }),
+        n
+      ]
+    }
+  );
+};
 export {
-  W as StepperStep
+  F as StatusChip
 };

package/dist/index.es38.js

@@ -1,80 +1,50 @@
-import { j as o } from "./index.es49.js";
-import { Switch as u } from "react-aria-components";
-import { cn as c } from "./index.es50.js";
-import { ContentSwitch as L } from "./index.es101.js";
-import { SwitchIndicator as v } from "./index.es102.js";
-import { switchVariants as b } from "./index.es79.js";
-const E = ({
-  children: f,
-  label: m,
-  description: n,
-  errorMessage: s,
-  validationState: e,
-  size: a = "md",
-  isDisabled: r = !1,
-  isSelected: t = !1,
-  onChange: h,
-  renderLabelIcon: x = null,
-  "aria-label": p,
-  "aria-describedby": l
-}) => {
-  const j = e === "invalid" && !r, w = a === "sm" ? { offLeft: 3, onLeft: 19 } : { offLeft: 4, onLeft: 28 };
-  return /* @__PURE__ */ o.jsxs(
-    "label",
-    {
-      className: c("group flex flex-row gap-2", (m || f) && n ? "items-start" : "items-center"),
-      children: [
-        /* @__PURE__ */ o.jsx(
-          u,
-          {
-            isDisabled: r,
-            isSelected: t,
-            "aria-checked": t,
-            "aria-label": p,
-            "aria-describedby": l,
-            onChange: h,
-            children: ({ isFocusVisible: d, isHovered: i }) => /* @__PURE__ */ o.jsx(
-              "div",
-              {
-                className: c(
-                  b({
-                    isSelected: t,
-                    isDisabled: r,
-                    isFocusVisible: d,
-                    size: a,
-                    isHoveredWhenOff: i && !t
-                  })
-                ),
-                children: /* @__PURE__ */ o.jsx(
-                  v,
-                  {
-                    isSelected: t,
-                    isDisabled: r,
-                    isHovered: i,
-                    size: a,
-                    dimensions: w
-                  }
-                )
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ o.jsx(
-          L,
-          {
-            label: m,
-            description: n,
-            errorMessage: s,
-            isDisabled: r,
-            isInvalid: j,
-            renderLabelIcon: x,
-            children: f
-          }
-        )
-      ]
-    }
-  );
-};
+import { j as p } from "./index.es52.js";
+import { Children as P, cloneElement as R } from "react";
+import { StepperCompleted as h } from "./index.es39.js";
+import { StepperStep as w } from "./index.es40.js";
+function C(g) {
+  var f, a, d;
+  const {
+    children: y,
+    activeStep: n,
+    size: j = "md",
+    onStepClick: l,
+    allowNextStepsSelect: x = !1,
+    baseIcon: I,
+    completedIcon: v
+  } = g, c = P.toArray(y), r = c.filter(
+    (t) => t.type === w
+  ), s = c.find(
+    (t) => t.type === h
+  ), i = (t, e) => t.props.error ? "error" : n === e ? "inProgress" : n > e ? "completed" : "pending", A = r.reduce(
+    (t, e, o) => {
+      const m = i(e, o), u = r[o + 1], E = u ? i(u, o + 1) : "pending", S = typeof l != "function" ? !1 : typeof e.props.allowStepClick == "boolean" ? e.props.allowStepClick : m === "completed" || x;
+      return t.push(
+        R(e, {
+          icon: e.props.icon || I || o + 1,
+          key: o,
+          step: o,
+          size: j,
+          state: m,
+          onPress: () => {
+            S && (l == null || l(o));
+          },
+          allowStepClick: S,
+          completedIcon: e.props.completedIcon || v,
+          nextState: E,
+          isLastStep: o === r.length - 1
+        })
+      ), t;
+    },
+    []
+  ), N = (a = (f = r[n]) == null ? void 0 : f.props) == null ? void 0 : a.children, b = (d = s == null ? void 0 : s.props) == null ? void 0 : d.children, k = n > r.length - 1 ? b : N;
+  return /* @__PURE__ */ p.jsxs("div", { className: "flex w-full flex-col gap-2", children: [
+    /* @__PURE__ */ p.jsx("div", { className: "flex w-full items-center", children: A }),
+    /* @__PURE__ */ p.jsx("div", { className: "flex", children: k })
+  ] });
+}
+C.Completed = h;
+C.Step = w;
 export {
-  E as Switch
+  C as Stepper
 };