@simpli-route/apollo-ds 0.1.49 → 0.1.51

package/dist/index.es63.js

@@ -1,19 +1,24 @@
-import { j as e } from "./index.es39.js";
-import { ColorField as n, Input as t } from "react-aria-components";
-function p(o) {
-  const { isDisabled: l, inputProps: r = {}, ...s } = o;
-  return /* @__PURE__ */ e.jsx(n, { className: "relative flex h-8 w-32 items-center", isDisabled: l, ...s, children: /* @__PURE__ */ e.jsx(
-    t,
-    {
-      className: "size-full border-none bg-transparent p-0 outline-none focus:outline-none focus:ring-0",
-      maxLength: 7,
-      "aria-label": "Color hex",
-      spellCheck: !1,
-      autoComplete: "off",
-      ...r
+import { cva as t } from "class-variance-authority";
+const o = t("scroll-m-12 text-neutral-900", {
+  variants: {
+    size: {
+      h1: "text-[2rem] font-bold leading-10",
+      h2: "text-[1.75rem] font-bold leading-9",
+      h3: "text-2xl font-semibold",
+      h4: "text-[1.375rem] font-semibold leading-7",
+      h5: "text-xl font-semibold",
+      h6: "text-lg font-semibold"
     }
-  ) });
-}
+  }
+}), n = t("", {
+  variants: {
+    type: {
+      body: "text-base text-neutral-900",
+      caption: "text-xs text-neutral-700"
+    }
+  }
+});
 export {
-  p as ColorField
+  n as textVariants,
+  o as titleVariants
 };

package/dist/index.es64.js

@@ -1,18 +1,67 @@
-import { j as r } from "./index.es39.js";
-import { ColorSlider as f, SliderTrack as l, ColorThumb as i } from "react-aria-components";
-function d(e) {
-  const { color: o } = e;
-  return /* @__PURE__ */ r.jsx(
-    f,
+import { j as e } from "./index.es40.js";
+import { CrossCircleIcon as m } from "./index.es42.js";
+import { Autocomplete as d, SearchField as p, Input as b, Button as h, ListBox as f, ListBoxItem as g } from "react-aria-components";
+import { cn as n } from "./index.es41.js";
+const v = ({
+  enableSearch: a,
+  contains: o,
+  classNameSearchField: i,
+  classNameSearchFieldInput: c,
+  placeholderSearch: u,
+  items: x
+}) => /* @__PURE__ */ e.jsxs(d, { filter: o, disableAutoFocusFirst: !0, disableVirtualFocus: !0, children: [
+  a ? /* @__PURE__ */ e.jsxs(
+    p,
     {
-      channel: "hue",
-      value: o,
-      className: "mb-2 h-4 w-48 rounded border bg-[linear-gradient(to_right,#ff0000,#ffff00,#00ff00,#00ffff,#0000ff,#ff00ff,#ff0000)]",
-      ...e,
-      children: /* @__PURE__ */ r.jsx(l, { className: "size-full", children: /* @__PURE__ */ r.jsx(i, { className: "box-border size-5 rounded-full border-2 border-white shadow-[0_0_0_1px_black,inset_0_0_0_1px_black] data-[focus-visible]:size-6" }) })
+      "aria-label": "Search",
+      className: n(
+        "group m-1 flex items-center rounded border border-neutral-500 bg-neutral-50",
+        i
+      ),
+      children: [
+        /* @__PURE__ */ e.jsx(
+          b,
+          {
+            placeholder: u,
+            className: n(
+              "h-8 min-w-0 flex-1 rounded border-none p-1 text-sm font-normal text-neutral-800 outline-none outline-0 placeholder:text-neutral-700 focus:outline-none focus:ring-0 [&::-webkit-search-cancel-button]:hidden",
+              c
+            )
+          }
+        ),
+        /* @__PURE__ */ e.jsx(h, { className: "pressed:bg-black/10 mr-1 flex w-6 items-center justify-center rounded-full border-0 bg-transparent p-1 text-center text-sm text-neutral-600 transition hover:bg-black/[5%] group-data-[empty]:invisible", children: /* @__PURE__ */ e.jsx(m, { "aria-hidden": !0, className: "size-4" }) })
+      ]
     }
-  );
-}
+  ) : null,
+  /* @__PURE__ */ e.jsx(f, { className: "lg:custom-scrollbar max-h-[260px] overflow-auto outline-none", items: x, children: (r) => /* @__PURE__ */ e.jsx(
+    g,
+    {
+      id: r.value,
+      textValue: r.label,
+      isDisabled: r.isDisabled,
+      className: ({ isSelected: t, isFocusVisible: s, isHovered: l }) => n(
+        "flex cursor-pointer items-center justify-between px-3 py-2 text-xs font-normal outline-none",
+        t ? "bg-primary-100 text-primary-500" : "text-primary-900",
+        l && "bg-primary-50 text-primary-500",
+        (l || s) && !t && "bg-primary-50",
+        (l || s) && t && "bg-primary-200"
+      ),
+      children: ({ isSelected: t }) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+        /* @__PURE__ */ e.jsx("span", { children: r.label }),
+        /* @__PURE__ */ e.jsx("span", { className: "flex w-5 items-center", children: t && /* @__PURE__ */ e.jsx("svg", { width: "14", height: "13", viewBox: "0 0 14 13", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e.jsx(
+          "path",
+          {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M13.2241 0.601824C13.4808 0.780773 13.5439 1.13398 13.365 1.39073L5.69829 12.3907C5.59653 12.5367 5.43209 12.6264 5.25425 12.633C5.07641 12.6395 4.90582 12.5622 4.79359 12.4241L0.460261 7.09072C0.26291 6.84783 0.299829 6.49094 0.542723 6.29358C0.785617 6.09623 1.14251 6.13315 1.33986 6.37605L5.19872 11.1254L12.4352 0.7427C12.6141 0.485948 12.9673 0.422875 13.2241 0.601824Z",
+            fill: "#4C3BEF"
+          }
+        ) }) })
+      ] })
+    },
+    r.value
+  ) })
+] });
 export {
-  d as ColorSlider
+  v as PopoverContent
 };

package/dist/index.es65.js

@@ -1,67 +1,20 @@
-import { j as e } from "./index.es39.js";
-import { CrossCircleIcon as m } from "./index.es41.js";
-import { Autocomplete as d, SearchField as p, Input as b, Button as h, ListBox as f, ListBoxItem as g } from "react-aria-components";
-import { cn as n } from "./index.es40.js";
-const v = ({
-  enableSearch: a,
-  contains: o,
-  classNameSearchField: i,
-  classNameSearchFieldInput: c,
-  placeholderSearch: u,
-  items: x
-}) => /* @__PURE__ */ e.jsxs(d, { filter: o, disableAutoFocusFirst: !0, disableVirtualFocus: !0, children: [
-  a ? /* @__PURE__ */ e.jsxs(
-    p,
+import { j as r } from "./index.es40.js";
+import { ColorArea as s, ColorThumb as l } from "react-aria-components";
+function t({ color: o, onChange: e, ...a }) {
+  return /* @__PURE__ */ r.jsx(
+    s,
     {
-      "aria-label": "Search",
-      className: n(
-        "group m-1 flex items-center rounded border border-neutral-500 bg-neutral-50",
-        i
-      ),
-      children: [
-        /* @__PURE__ */ e.jsx(
-          b,
-          {
-            placeholder: u,
-            className: n(
-              "h-8 min-w-0 flex-1 rounded border-none p-1 text-sm font-normal text-neutral-800 outline-none outline-0 placeholder:text-neutral-700 focus:outline-none focus:ring-0 [&::-webkit-search-cancel-button]:hidden",
-              c
-            )
-          }
-        ),
-        /* @__PURE__ */ e.jsx(h, { className: "pressed:bg-black/10 mr-1 flex w-6 items-center justify-center rounded-full border-0 bg-transparent p-1 text-center text-sm text-neutral-600 transition hover:bg-black/[5%] group-data-[empty]:invisible", children: /* @__PURE__ */ e.jsx(m, { "aria-hidden": !0, className: "size-4" }) })
-      ]
+      colorSpace: "hsb",
+      xChannel: "saturation",
+      yChannel: "brightness",
+      value: o,
+      className: "mb-2 h-32 w-48 rounded border",
+      onChange: e,
+      ...a,
+      children: /* @__PURE__ */ r.jsx(l, { className: "box-border size-5 rounded-full border-2 border-white shadow-[0_0_0_1px_black,inset_0_0_0_1px_black] data-[focus-visible]:size-6" })
     }
-  ) : null,
-  /* @__PURE__ */ e.jsx(f, { className: "lg:custom-scrollbar max-h-[260px] overflow-auto outline-none", items: x, children: (r) => /* @__PURE__ */ e.jsx(
-    g,
-    {
-      id: r.value,
-      textValue: r.label,
-      isDisabled: r.isDisabled,
-      className: ({ isSelected: t, isFocusVisible: s, isHovered: l }) => n(
-        "flex cursor-pointer items-center justify-between px-3 py-2 text-xs font-normal outline-none",
-        t ? "bg-primary-100 text-primary-500" : "text-primary-900",
-        l && "bg-primary-50 text-primary-500",
-        (l || s) && !t && "bg-primary-50",
-        (l || s) && t && "bg-primary-200"
-      ),
-      children: ({ isSelected: t }) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        /* @__PURE__ */ e.jsx("span", { children: r.label }),
-        /* @__PURE__ */ e.jsx("span", { className: "flex w-5 items-center", children: t && /* @__PURE__ */ e.jsx("svg", { width: "14", height: "13", viewBox: "0 0 14 13", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e.jsx(
-          "path",
-          {
-            fillRule: "evenodd",
-            clipRule: "evenodd",
-            d: "M13.2241 0.601824C13.4808 0.780773 13.5439 1.13398 13.365 1.39073L5.69829 12.3907C5.59653 12.5367 5.43209 12.6264 5.25425 12.633C5.07641 12.6395 4.90582 12.5622 4.79359 12.4241L0.460261 7.09072C0.26291 6.84783 0.299829 6.49094 0.542723 6.29358C0.785617 6.09623 1.14251 6.13315 1.33986 6.37605L5.19872 11.1254L12.4352 0.7427C12.6141 0.485948 12.9673 0.422875 13.2241 0.601824Z",
-            fill: "#4C3BEF"
-          }
-        ) }) })
-      ] })
-    },
-    r.value
-  ) })
-] });
+  );
+}
 export {
-  v as PopoverContent
+  t as ColorArea
 };

package/dist/index.es66.js

@@ -1,90 +1,19 @@
-import { j as e } from "./index.es39.js";
-import { CrossCircleIcon as w } from "./index.es41.js";
-import { Button as x, SelectValue as N } from "react-aria-components";
-import { cn as r } from "./index.es40.js";
-import { selectInputButtonVariants as v, selectInputBadgeVariants as V } from "./index.es46.js";
-const P = ({
-  ref: C,
-  isOpen: a,
-  setIsOpen: u,
-  size: n,
-  isDisabled: t,
-  classNameButton: f,
-  selectionMode: h,
-  maxLengthTextOption: i,
-  handleDeleteOptionSelected: p,
-  placeholder: d
-}) => /* @__PURE__ */ e.jsxs(
-  x,
-  {
-    ref: C,
-    className: ({ isFocusVisible: l, isHovered: o }) => r(
-      v({
-        size: n,
-        isDisabled: t,
-        isFocusVisible: l || a,
-        isHovered: o
-      }),
-      f
-    ),
-    onPress: () => u(!a),
-    children: [
-      /* @__PURE__ */ e.jsx(N, { className: "flex flex-1 items-center gap-1 overflow-hidden", children: ({ selectedItems: l, selectedText: o, isPlaceholder: j }) => /* @__PURE__ */ e.jsx(e.Fragment, { children: h === "multiple" && l && l.length > 0 ? /* @__PURE__ */ e.jsx("div", { className: "flex flex-wrap gap-1", children: l.filter((s) => s != null).map((s) => {
-        const c = s.label, g = c.length > i ? `${c.slice(0, i)}...` : c, m = s.value;
-        return /* @__PURE__ */ e.jsxs("div", { className: r(V({ size: n, isDisabled: t })), children: [
-          /* @__PURE__ */ e.jsx("span", { children: g }),
-          /* @__PURE__ */ e.jsx(
-            x,
-            {
-              className: r("outline-none", t ? "cursor-not-allowed" : ""),
-              isDisabled: t,
-              slot: null,
-              onPress: () => p(m),
-              children: /* @__PURE__ */ e.jsx(
-                w,
-                {
-                  className: r(
-                    "text-primary-800",
-                    t ? "text-neutral-600" : "",
-                    n === "xs" || n === "sm" ? "size-3" : "size-4"
-                  )
-                }
-              )
-            }
-          )
-        ] }, m);
-      }) }) : /* @__PURE__ */ e.jsx(
-        "span",
-        {
-          className: r(
-            "flex-1 truncate text-left",
-            j ? "text-neutral-600" : "",
-            t ? "text-neutral-700" : ""
-          ),
-          children: o || d
-        }
-      ) }) }),
-      /* @__PURE__ */ e.jsx(
-        "svg",
-        {
-          className: `${a ? "rotate-180" : ""} transition-transform duration-100`,
-          width: "20",
-          height: "10",
-          viewBox: "0 0 20 10",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /* @__PURE__ */ e.jsx(
-            "path",
-            {
-              d: "M20 0.838022C20.0006 0.947676 19.9796 1.05638 19.9381 1.15789C19.8967 1.2594 19.8356 1.35173 19.7584 1.42959L12.9512 8.23676C12.5642 8.62472 12.1045 8.93252 11.5984 9.14254C11.0922 9.35256 10.5497 9.46066 10.0017 9.46066C9.45373 9.46066 8.91115 9.35256 8.40502 9.14254C7.8989 8.93252 7.43918 8.62472 7.0522 8.23676L0.245034 1.42959C0.167349 1.3519 0.105725 1.25968 0.0636824 1.15818C0.0216393 1.05667 5.62088e-09 0.947886 0 0.838023C-5.62081e-09 0.728159 0.0216393 0.619372 0.0636824 0.51787C0.105725 0.41637 0.167349 0.324143 0.245034 0.246458C0.32272 0.168773 0.414946 0.107149 0.516447 0.0651056C0.617948 0.0230624 0.726736 0.00142351 0.8366 0.00142351C0.946464 0.00142351 1.05525 0.0230624 1.15675 0.0651055C1.25825 0.107149 1.35048 0.168773 1.42817 0.246458L8.23533 7.05363C8.704 7.52171 9.33931 7.78463 10.0017 7.78463C10.6641 7.78463 11.2994 7.52171 11.7681 7.05363L18.5752 0.246457C18.6527 0.168363 18.7448 0.106378 18.8464 0.0640783C18.9479 0.0217776 19.0568 4.80781e-09 19.1668 0C19.2768 -4.80789e-09 19.3857 0.0217776 19.4872 0.0640782C19.5888 0.106378 19.6809 0.168363 19.7584 0.246457C19.8356 0.324311 19.8967 0.41664 19.9381 0.518154C19.9796 0.619668 20.0006 0.728369 20 0.838022Z",
-              fill: "#73768C"
-            }
-          )
-        }
-      )
-    ]
-  }
-);
+import { j as e } from "./index.es40.js";
+import { ColorField as n, Input as t } from "react-aria-components";
+function p(o) {
+  const { isDisabled: l, inputProps: r = {}, ...s } = o;
+  return /* @__PURE__ */ e.jsx(n, { className: "relative flex h-8 w-32 items-center", isDisabled: l, ...s, children: /* @__PURE__ */ e.jsx(
+    t,
+    {
+      className: "size-full border-none bg-transparent p-0 outline-none focus:outline-none focus:ring-0",
+      maxLength: 7,
+      "aria-label": "Color hex",
+      spellCheck: !1,
+      autoComplete: "off",
+      ...r
+    }
+  ) });
+}
 export {
-  P as SelectContent
+  p as ColorField
 };

package/dist/index.es67.js

@@ -1,12 +1,18 @@
-import { j as n } from "./index.es39.js";
-import { cn as x } from "./index.es40.js";
-const m = ({
-  description: t,
-  descriptionClasses: i,
-  errorMessage: r,
-  errorClasses: s,
-  isInvalidField: e
-}) => t && !e ? /* @__PURE__ */ n.jsx("div", { slot: "description", className: x("text-xs leading-3 text-neutral-700", i), children: t }) : r && e ? /* @__PURE__ */ n.jsx("div", { className: x("text-xs leading-3 text-error-500", s), children: r }) : null;
+import { j as r } from "./index.es40.js";
+import { ColorSlider as f, SliderTrack as l, ColorThumb as i } from "react-aria-components";
+function d(e) {
+  const { color: o } = e;
+  return /* @__PURE__ */ r.jsx(
+    f,
+    {
+      channel: "hue",
+      value: o,
+      className: "mb-2 h-4 w-48 rounded border bg-[linear-gradient(to_right,#ff0000,#ffff00,#00ff00,#00ffff,#0000ff,#ff00ff,#ff0000)]",
+      ...e,
+      children: /* @__PURE__ */ r.jsx(l, { className: "size-full", children: /* @__PURE__ */ r.jsx(i, { className: "box-border size-5 rounded-full border-2 border-white shadow-[0_0_0_1px_black,inset_0_0_0_1px_black] data-[focus-visible]:size-6" }) })
+    }
+  );
+}
 export {
-  m as CaptionNumberField
+  d as ColorSlider
 };

package/dist/index.es68.js

@@ -1,14 +1,165 @@
-import { j as e } from "./index.es39.js";
-import { UpChevronIcon as n, DownChevronIcon as o } from "./index.es41.js";
-import { Button as s } from "react-aria-components";
-import { cn as c } from "./index.es40.js";
-const x = ({ isDisabled: r }) => {
-  const t = c("flex items-center justify-center", r ? "text-neutral-600" : "text-primary-500");
-  return /* @__PURE__ */ e.jsxs("div", { className: "absolute inset-y-0 right-0 flex flex-col items-center justify-center space-y-0.5 pr-2", children: [
-    /* @__PURE__ */ e.jsx(s, { slot: "increment", className: t, children: /* @__PURE__ */ e.jsx(n, { className: "size-3.5" }) }),
-    /* @__PURE__ */ e.jsx(s, { slot: "decrement", className: t, children: /* @__PURE__ */ e.jsx(o, { className: "size-3.5" }) })
-  ] });
-};
+import { cva as e } from "class-variance-authority";
+const t = [
+  {
+    intent: "primary",
+    isHovered: !0,
+    isDisabled: !1,
+    isActive: !1,
+    class: "bg-primary-100"
+  },
+  {
+    intent: "secondary",
+    isHovered: !0,
+    isDisabled: !1,
+    isActive: !1,
+    class: "bg-primary-500 text-primary-50"
+  },
+  {
+    intent: "minimal",
+    isHovered: !0,
+    isDisabled: !1,
+    isActive: !1,
+    class: "bg-neutral-200 text-neutral-800"
+  },
+  {
+    intent: "error",
+    isHovered: !0,
+    isDisabled: !1,
+    isActive: !1,
+    class: "bg-error-100"
+  }
+], r = [
+  {
+    intent: "primary",
+    isActive: !0,
+    isDisabled: !1,
+    class: "bg-primary-500 text-primary-50"
+  },
+  {
+    intent: "primary",
+    isActive: !0,
+    isDisabled: !0,
+    class: "bg-primary-300 text-primary-100"
+  },
+  {
+    intent: "secondary",
+    isActive: !0,
+    isDisabled: !1,
+    class: "bg-primary-500 text-primary-50"
+  },
+  {
+    intent: "secondary",
+    isActive: !0,
+    isDisabled: !0,
+    class: "bg-primary-100 text-primary-300"
+  },
+  {
+    intent: "minimal",
+    isActive: !0,
+    isDisabled: !1,
+    class: "text-primary-500"
+  },
+  {
+    intent: "minimal",
+    isActive: !0,
+    isDisabled: !0,
+    class: "text-neutral-700"
+  },
+  {
+    intent: "error",
+    isActive: !0,
+    isDisabled: !1,
+    class: "bg-error-700 text-error-50"
+  },
+  {
+    intent: "error",
+    isActive: !0,
+    isDisabled: !0,
+    class: "bg-error-300 text-error-100"
+  }
+], i = [
+  {
+    intent: "primary",
+    isDisabled: !0,
+    isActive: !1,
+    class: "text-neutral-600"
+  },
+  {
+    intent: "primary",
+    isDisabled: !0,
+    isActive: !0,
+    class: "bg-primary-300 text-primary-100"
+  },
+  {
+    intent: "secondary",
+    isDisabled: !0,
+    isActive: !1,
+    class: "bg-neutral-400 text-neutral-600"
+  },
+  {
+    intent: "secondary",
+    isDisabled: !0,
+    isActive: !0,
+    class: "bg-primary-100 text-primary-300"
+  },
+  {
+    intent: "minimal",
+    isDisabled: !0,
+    isActive: !1,
+    class: "text-neutral-600"
+  },
+  {
+    intent: "minimal",
+    isDisabled: !0,
+    isActive: !0,
+    class: "text-neutral-700"
+  },
+  {
+    intent: "error",
+    isDisabled: !0,
+    isActive: !1,
+    class: "text-neutral-600"
+  },
+  {
+    intent: "error",
+    isDisabled: !0,
+    isActive: !0,
+    class: "bg-error-300 text-primary-100"
+  }
+], a = e(
+  "inline-flex items-center justify-center rounded-lg border border-transparent transition duration-150 ease-in-out focus:outline-none",
+  {
+    variants: {
+      intent: {
+        primary: "bg-transparent text-primary-500",
+        secondary: "bg-primary-200 text-primary-500",
+        minimal: "bg-transparent text-neutral-700",
+        error: "bg-transparent text-error-500"
+      },
+      size: {
+        xxs: "p-1",
+        xs: "p-2",
+        sm: "p-2.5",
+        md: "p-3",
+        lg: "p-4"
+      },
+      isDisabled: {
+        true: "pointer-events-none cursor-not-allowed"
+      },
+      isHovered: {
+        true: ""
+      },
+      isActive: {
+        true: ""
+      },
+      isFocused: {
+        false: "",
+        true: "focus:outline-none focus:ring-offset-2 outline-none ring-2 ring-sky-400"
+      }
+    },
+    compoundVariants: [...t, ...r, ...i]
+  }
+);
 export {
-  x as StepperButton
+  a as buttonVariants
 };