@pglevy/sailwind 0.4.0 → 0.5.1

package/dist/components/ReadOnlyGrid/ReadOnlyGrid.js

@@ -0,0 +1,277 @@
+import { jsx as t, jsxs as h, Fragment as we } from "react/jsx-runtime";
+import o from "react";
+import { ChevronsLeft as Re, ChevronLeft as $e, ChevronRight as ve, ChevronsRight as Se, MoveUp as Ee, MoveDown as Le } from "lucide-react";
+import { FieldWrapper as Ae } from "../shared/FieldWrapper.js";
+import { GridColumn as Oe } from "./GridColumn.js";
+function Te(s) {
+  const i = [];
+  return o.Children.forEach(s, (l) => {
+    o.isValidElement(l) && l.type === Oe && i.push(l.props);
+  }), i;
+}
+function Me(s, i, l) {
+  if (s == null)
+    return null;
+  if (typeof s == "string")
+    return i[s] ?? null;
+  if (typeof s == "function")
+    try {
+      return s(i, l);
+    } catch (L) {
+      return console.warn("GridColumn value accessor threw an error:", L), null;
+    }
+  return null;
+}
+function He(s, i) {
+  if (!s) return {};
+  const l = typeof s == "function" ? s(i) : s;
+  return !l || l === "NONE" ? {} : X[l] !== void 0 ? X[l] ? { className: X[l] } : {} : l.startsWith("#") ? { style: { backgroundColor: l } } : {};
+}
+const Ue = {
+  SHORT: "max-h-40",
+  SHORT_PLUS: "max-h-52",
+  MEDIUM: "max-h-64",
+  MEDIUM_PLUS: "max-h-80",
+  TALL: "max-h-96",
+  TALL_PLUS: "max-h-[28rem]",
+  EXTRA_TALL: "max-h-[36rem]",
+  AUTO: ""
+}, se = {
+  AUTO: "",
+  ICON: "w-10",
+  ICON_PLUS: "w-14",
+  NARROW: "w-24",
+  NARROW_PLUS: "w-32",
+  MEDIUM: "w-40",
+  MEDIUM_PLUS: "w-48",
+  WIDE: "w-64",
+  "1X": "flex-1",
+  "2X": "flex-[2]",
+  "3X": "flex-[3]",
+  "4X": "flex-[4]",
+  "5X": "flex-[5]",
+  "6X": "flex-[6]",
+  "7X": "flex-[7]",
+  "8X": "flex-[8]",
+  "9X": "flex-[9]",
+  "10X": "flex-[10]"
+}, ne = {
+  START: "text-left",
+  CENTER: "text-center",
+  END: "text-right"
+}, X = {
+  NONE: "",
+  ACCENT: "bg-blue-50",
+  SUCCESS: "bg-green-50",
+  INFO: "bg-sky-50",
+  WARN: "bg-yellow-50",
+  ERROR: "bg-red-50"
+}, We = ({
+  label: s,
+  labelPosition: i,
+  instructions: l,
+  helpTooltip: L,
+  emptyGridMessage: le = "No items available",
+  data: D,
+  children: ae,
+  pageSize: k = 10,
+  initialSorts: x,
+  selectable: d,
+  selectionStyle: m = "CHECKBOX",
+  selectionValue: g = [],
+  selectionSaveInto: b,
+  validations: A,
+  showWhen: oe = !0,
+  borderStyle: ie = "LIGHT",
+  shadeAlternateRows: de = !1,
+  spacing: ce = "STANDARD",
+  height: F = "AUTO",
+  accessibilityText: O,
+  marginAbove: ue,
+  marginBelow: he
+}) => {
+  const ge = o.useId(), T = k > 0 ? k : 10, C = Array.isArray(D) ? D : [], [M, f] = o.useState(1), [p, W] = o.useState(null), [c, H] = o.useState(!0);
+  o.useEffect(() => {
+    x && x.length > 0 && (W(x[0].field), H(x[0].ascending));
+  }, []), o.useEffect(() => {
+    f(1);
+  }, [C.length]);
+  const pe = (e) => {
+    p === e ? H((r) => !r) : (W(e), H(!0)), f(1);
+  }, U = o.useMemo(
+    () => C.map((e, r) => ({ ...e, __originalIndex: r })),
+    [C]
+  ), N = o.useMemo(() => p ? [...U].sort((e, r) => {
+    const n = e[p], a = r[p];
+    return n == null && a == null ? 0 : n == null ? c ? -1 : 1 : a == null ? c ? 1 : -1 : typeof n == "string" && typeof a == "string" ? c ? n.localeCompare(a) : a.localeCompare(n) : n < a ? c ? -1 : 1 : n > a ? c ? 1 : -1 : 0;
+  }) : U, [U, p, c]);
+  if (!oe)
+    return null;
+  const y = Te(ae).filter((e) => e.showWhen !== !1), w = ie === "STANDARD", fe = w ? "border border-gray-300" : "", me = w ? "border-b border-gray-300" : "border-b border-gray-200", be = w ? "border-b border-gray-300" : "border-b border-gray-200", u = w ? "border-r border-gray-300" : "", R = ce === "DENSE" ? "px-2 py-1" : "px-3 py-2", G = Ue[F] || "", z = F !== "AUTO" && G !== "", _ = Math.ceil(N.length / T), $ = (M - 1) * T, B = Math.min($ + T, N.length), j = M > 1, K = M < _, q = N.slice($, B), J = (e) => e.id !== void 0 ? e.id : e.__originalIndex, Q = (e) => {
+    if (!b) return;
+    const n = g.includes(e) ? g.filter((a) => a !== e) : [...g, e];
+    b(n);
+  }, v = d ? q.map((e) => J(e)) : [], Y = d && v.length > 0 && v.every((e) => g.includes(e)), xe = () => {
+    if (b)
+      if (Y)
+        b(g.filter((e) => !v.includes(e)));
+      else {
+        const e = [...g];
+        v.forEach((r) => {
+          e.includes(r) || e.push(r);
+        }), b(e);
+      }
+  }, Ce = A && A.length > 0 ? /* @__PURE__ */ t("div", { children: A.map((e, r) => /* @__PURE__ */ t("p", { className: "text-red-600 text-sm mt-1", children: e }, r)) }) : void 0, Z = (e) => e.width && se[e.width] ? se[e.width] : "", V = (e) => e.align && ne[e.align] ? ne[e.align] : "text-left", ee = () => /* @__PURE__ */ h(
+    "table",
+    {
+      className: `w-full border-collapse ${fe}`,
+      "aria-label": O,
+      children: [
+        /* @__PURE__ */ t("thead", { className: z ? "sticky top-0 bg-white z-10" : void 0, children: /* @__PURE__ */ h("tr", { className: me, children: [
+          d && m === "CHECKBOX" && /* @__PURE__ */ t("th", { className: `${R} w-10${u ? ` ${u}` : ""}`, children: /* @__PURE__ */ t(
+            "input",
+            {
+              type: "checkbox",
+              checked: Y,
+              onChange: xe,
+              "aria-label": "Select all rows"
+            }
+          ) }),
+          y.map((e, r) => {
+            const n = Z(e), a = V(e), S = !(r === y.length - 1) && u ? ` ${u}` : "";
+            return /* @__PURE__ */ t(
+              "th",
+              {
+                className: `${R} ${a} text-sm font-semibold text-base${n ? ` ${n}` : ""}${S}`,
+                "aria-sort": p === e.sortField ? c ? "ascending" : "descending" : void 0,
+                children: e.sortField ? /* @__PURE__ */ h(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => pe(e.sortField),
+                    className: "flex items-center gap-1 hover:text-gray-900 cursor-pointer",
+                    children: [
+                      e.label ?? "",
+                      p === e.sortField && /* @__PURE__ */ t("span", { "aria-hidden": "true", children: c ? /* @__PURE__ */ t(Ee, { size: 14 }) : /* @__PURE__ */ t(Le, { size: 14 }) })
+                    ]
+                  }
+                ) : e.label ?? ""
+              },
+              r
+            );
+          })
+        ] }) }),
+        /* @__PURE__ */ t("tbody", { children: q.map((e, r) => {
+          const n = J(e), a = d && g.includes(n), I = d && m === "ROW_HIGHLIGHT" && a, S = de && r % 2 === 0 && !I ? "bg-gray-50" : "";
+          return /* @__PURE__ */ h(
+            "tr",
+            {
+              className: `${be}${d && m === "ROW_HIGHLIGHT" ? " cursor-pointer" : ""}${I ? " bg-blue-50" : ""}${S ? ` ${S}` : ""}`,
+              onClick: d && m === "ROW_HIGHLIGHT" ? () => Q(n) : void 0,
+              children: [
+                d && m === "CHECKBOX" && /* @__PURE__ */ t("td", { className: `${R} w-10${u ? ` ${u}` : ""}`, children: /* @__PURE__ */ t(
+                  "input",
+                  {
+                    type: "checkbox",
+                    checked: a || !1,
+                    onChange: () => Q(n),
+                    "aria-label": `Select row ${r + 1}`
+                  }
+                ) }),
+                y.map((E, te) => {
+                  const re = Z(E), Ne = V(E), P = He(E.backgroundColor, e), ye = !(te === y.length - 1) && u ? ` ${u}` : "";
+                  return /* @__PURE__ */ t(
+                    "td",
+                    {
+                      className: `${R} ${Ne} text-sm text-gray-900${re ? ` ${re}` : ""}${P.className ? ` ${P.className}` : ""}${ye}`,
+                      style: P.style,
+                      children: Me(E.value, e, $ + r)
+                    },
+                    te
+                  );
+                })
+              ]
+            },
+            r
+          );
+        }) })
+      ]
+    }
+  );
+  return /* @__PURE__ */ t(
+    Ae,
+    {
+      label: s,
+      labelPosition: i,
+      instructions: l,
+      helpTooltip: L,
+      accessibilityText: O,
+      inputId: ge,
+      marginAbove: ue,
+      marginBelow: he,
+      footer: Ce,
+      children: C.length === 0 ? /* @__PURE__ */ t("div", { className: "text-gray-500 py-4 text-center", children: le }) : /* @__PURE__ */ h(we, { children: [
+        z ? /* @__PURE__ */ t("div", { className: `${G} overflow-y-auto`, tabIndex: 0, role: "region", "aria-label": O || s || "Scrollable grid", children: ee() }) : ee(),
+        _ > 1 && /* @__PURE__ */ h("div", { className: "flex items-center justify-end gap-2 px-3 py-2 text-sm text-gray-700", children: [
+          /* @__PURE__ */ t(
+            "button",
+            {
+              onClick: () => f(1),
+              disabled: !j,
+              "aria-label": "First page",
+              title: "First page",
+              className: "px-1 py-1 disabled:text-gray-300 disabled:cursor-not-allowed text-blue-700 hover:text-blue-900 cursor-pointer",
+              children: /* @__PURE__ */ t(Re, { size: 18 })
+            }
+          ),
+          /* @__PURE__ */ t(
+            "button",
+            {
+              onClick: () => f((e) => e - 1),
+              disabled: !j,
+              "aria-label": "Previous page",
+              title: "Previous page",
+              className: "px-1 py-1 disabled:text-gray-300 disabled:cursor-not-allowed text-blue-700 hover:text-blue-900 cursor-pointer",
+              children: /* @__PURE__ */ t($e, { size: 18 })
+            }
+          ),
+          /* @__PURE__ */ h("span", { children: [
+            /* @__PURE__ */ h("span", { className: "font-bold", children: [
+              $ + 1,
+              " – ",
+              B
+            ] }),
+            " ",
+            "of ",
+            N.length
+          ] }),
+          /* @__PURE__ */ t(
+            "button",
+            {
+              onClick: () => f((e) => e + 1),
+              disabled: !K,
+              "aria-label": "Next page",
+              title: "Next page",
+              className: "px-1 py-1 disabled:text-gray-300 disabled:cursor-not-allowed text-blue-700 hover:text-blue-900 cursor-pointer",
+              children: /* @__PURE__ */ t(ve, { size: 18 })
+            }
+          ),
+          /* @__PURE__ */ t(
+            "button",
+            {
+              onClick: () => f(_),
+              disabled: !K,
+              "aria-label": "Last page",
+              title: "Last page",
+              className: "px-1 py-1 disabled:text-gray-300 disabled:cursor-not-allowed text-blue-700 hover:text-blue-900 cursor-pointer",
+              children: /* @__PURE__ */ t(Se, { size: 18 })
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+};
+export {
+  We as ReadOnlyGrid
+};

package/dist/components/ReadOnlyGrid/ReadOnlyGrid.stories.d.ts

@@ -0,0 +1,65 @@
+import { default as React } from 'react';
+import { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: React.FC<import('./ReadOnlyGrid').ReadOnlyGridProps>;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        borderStyle: {
+            control: "select";
+            options: string[];
+        };
+        spacing: {
+            control: "select";
+            options: string[];
+        };
+        height: {
+            control: "select";
+            options: string[];
+        };
+        selectionStyle: {
+            control: "select";
+            options: string[];
+        };
+        labelPosition: {
+            control: "select";
+            options: string[];
+        };
+        marginAbove: {
+            control: "select";
+            options: string[];
+        };
+        marginBelow: {
+            control: "select";
+            options: string[];
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+/** 1. Default — Basic grid with employee data */
+export declare const Default: Story;
+/** 2. EmptyState — Empty data with custom message */
+export declare const EmptyState: Story;
+/** 3. WithPaging — Full dataset with pageSize=5 showing paging controls */
+export declare const WithPaging: Story;
+/** 4. WithSorting — Sortable columns with initial sort on salary descending */
+export declare const WithSorting: Story;
+/** 5. WithCheckboxSelection — Selectable grid with checkbox style */
+export declare const WithCheckboxSelection: Story;
+/** 6. WithRowHighlightSelection — ROW_HIGHLIGHT selection style */
+export declare const WithRowHighlightSelection: Story;
+/** 7. StyledGrid — borderStyle, shadeAlternateRows, dense spacing */
+export declare const StyledGrid: Story;
+/** 8. FixedHeight — MEDIUM height to show scrolling behavior */
+export declare const FixedHeight: Story;
+/** 9. WithLabelAndValidations — label, instructions, validations, helpTooltip */
+export declare const WithLabelAndValidations: Story;
+/** 10. ColumnWidthsAndAlignment — Various column widths and alignments */
+export declare const ColumnWidthsAndAlignment: Story;
+/** 11. FunctionAccessor — Using function value accessors for computed columns */
+export declare const FunctionAccessor: Story;
+//# sourceMappingURL=ReadOnlyGrid.stories.d.ts.map

package/dist/components/ReadOnlyGrid/ReadOnlyGrid.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReadOnlyGrid.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ReadOnlyGrid/ReadOnlyGrid.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAoB3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAc2B,CAAA;AAErC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,iDAAiD;AACjD,eAAO,MAAM,OAAO,EAAE,KAarB,CAAA;AAED,qDAAqD;AACrD,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAA;AAED,2EAA2E;AAC3E,eAAO,MAAM,UAAU,EAAE,KAuBxB,CAAA;AAED,+EAA+E;AAC/E,eAAO,MAAM,WAAW,EAAE,KAczB,CAAA;AAED,qEAAqE;AACrE,eAAO,MAAM,qBAAqB,EAAE,KAgBnC,CAAA;AAED,mEAAmE;AACnE,eAAO,MAAM,yBAAyB,EAAE,KAgBvC,CAAA;AAED,qEAAqE;AACrE,eAAO,MAAM,UAAU,EAAE,KAexB,CAAA;AAED,gEAAgE;AAChE,eAAO,MAAM,WAAW,EAAE,KAazB,CAAA;AAED,iFAAiF;AACjF,eAAO,MAAM,uBAAuB,EAAE,KAerC,CAAA;AAED,0EAA0E;AAC1E,eAAO,MAAM,wBAAwB,EAAE,KAYtC,CAAA;AAED,iFAAiF;AACjF,eAAO,MAAM,gBAAgB,EAAE,KA2B9B,CAAA"}

package/dist/components/ReadOnlyGrid/index.d.ts

@@ -0,0 +1,5 @@
+export { ReadOnlyGrid } from './ReadOnlyGrid';
+export type { ReadOnlyGridProps } from './ReadOnlyGrid';
+export { GridColumn } from './GridColumn';
+export type { GridColumnProps } from './GridColumn';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ReadOnlyGrid/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ReadOnlyGrid/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA"}

package/dist/components/RichText/RichText.stories.d.ts

@@ -6,6 +6,24 @@ declare const meta: {
     parameters: {
         layout: string;
     };
+    argTypes: {
+        align: {
+            control: "select";
+            options: string[];
+        };
+        labelPosition: {
+            control: "select";
+            options: string[];
+        };
+        marginAbove: {
+            control: "select";
+            options: string[];
+        };
+        marginBelow: {
+            control: "select";
+            options: string[];
+        };
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/components/RichText/RichText.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RichText.stories.d.ts","sourceRoot":"","sources":["../../../src/components/RichText/RichText.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAK3D,QAAA,MAAM,IAAI;;;;;;;CAKmC,CAAA;AAE7C,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAuBlC,CAAA;AAGD,eAAO,MAAM,UAAU,EAAE,KAexB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAuB9B,CAAA;AAED,eAAO,MAAM,yBAAyB,EAAE,KAwBvC,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAgB7B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAoB3B,CAAA"}
+{"version":3,"file":"RichText.stories.d.ts","sourceRoot":"","sources":["../../../src/components/RichText/RichText.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAK3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;CAWmC,CAAA;AAE7C,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAqBlC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAaxB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAqB9B,CAAA;AAED,eAAO,MAAM,yBAAyB,EAAE,KAsBvC,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAc7B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAoB3B,CAAA"}

package/dist/components/Slider/SliderField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SliderField.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/SliderField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAEnF,KAAK,iBAAiB,GAAG,YAAY,GAAG,UAAU,CAAA;AAElD;;;;;;GAMG;AACH,MAAM,WAAW,gBAAgB;IAC/B,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IACzB,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,EAAE,CAAA;IACtB,sDAAsD;IACtD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7C,uFAAuF;IACvF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7C,wCAAwC;IACxC,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,yCAAyC;IACzC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,yBAAyB;IACzB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,4DAA4D;IAC5D,KAAK,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,WAAW,GAAG,MAAM,CAAA;IACjE,gCAAgC;IAChC,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,oCAAoC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,4CAA4C;IAC5C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACxC;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAqNlD,CAAA"}
+{"version":3,"file":"SliderField.d.ts","sourceRoot":"","sources":["../../../src/components/Slider/SliderField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAEnF,KAAK,iBAAiB,GAAG,YAAY,GAAG,UAAU,CAAA;AAElD;;;;;;GAMG;AACH,MAAM,WAAW,gBAAgB;IAC/B,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IACzB,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,oBAAoB;IACpB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,EAAE,CAAA;IACtB,sDAAsD;IACtD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7C,uFAAuF;IACvF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7C,wCAAwC;IACxC,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,yCAAyC;IACzC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,yBAAyB;IACzB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,4DAA4D;IAC5D,KAAK,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,WAAW,GAAG,MAAM,CAAA;IACjE,gCAAgC;IAChC,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,oCAAoC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,4CAA4C;IAC5C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACxC;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA0NlD,CAAA"}

package/dist/components/Slider/SliderField.js

@@ -3,60 +3,60 @@ import "react";
 import * as n from "@radix-ui/react-slider";
 import { FieldWrapper as W } from "../shared/FieldWrapper.js";
 const Y = ({
-  label: b,
-  instructions: m,
-  required: f = !1,
-  disabled: d = !1,
-  value: h = 50,
-  min: A = 0,
+  label: h,
+  instructions: f,
+  required: A = !1,
+  disabled: g = !1,
+  value: d = 50,
+  min: N = 0,
   max: v = 100,
   step: E = 1,
-  validations: N = [],
+  validations: w = [],
   saveInto: I,
   onChange: O,
   validationGroup: F,
-  requiredMessage: w,
-  labelPosition: y = "ABOVE",
-  helpTooltip: L,
-  accessibilityText: C,
-  showWhen: x = !0,
+  requiredMessage: C,
+  labelPosition: L = "ABOVE",
+  helpTooltip: y,
+  accessibilityText: i,
+  showWhen: S = !0,
   marginAbove: V = "NONE",
   marginBelow: D = "STANDARD",
-  size: g = "STANDARD",
-  color: o = "ACCENT",
-  orientation: e = "HORIZONTAL",
-  showValue: S = !1,
-  formatValue: i = (s) => s.toString()
+  size: c = "STANDARD",
+  color: l = "ACCENT",
+  orientation: r = "HORIZONTAL",
+  showValue: k = !1,
+  formatValue: u = (o) => o.toString()
 }) => {
-  if (!x) return null;
-  const s = `sliderfield-${Math.random().toString(36).substr(2, 9)}`, a = Array.isArray(h) ? h : [h], R = Array.isArray(h), c = {
+  if (!S) return null;
+  const o = `sliderfield-${Math.random().toString(36).substr(2, 9)}`, s = Array.isArray(d) ? d : [d], R = Array.isArray(d), b = {
     SMALL: {
-      track: e === "HORIZONTAL" ? "h-1" : "w-1",
+      track: r === "HORIZONTAL" ? "h-1" : "w-1",
       thumb: "h-4 w-4",
-      height: e === "VERTICAL" ? "h-32" : void 0
+      height: r === "VERTICAL" ? "h-32" : void 0
     },
     STANDARD: {
-      track: e === "HORIZONTAL" ? "h-2" : "w-2",
+      track: r === "HORIZONTAL" ? "h-2" : "w-2",
       thumb: "h-5 w-5",
-      height: e === "VERTICAL" ? "h-40" : void 0
+      height: r === "VERTICAL" ? "h-40" : void 0
     },
     MEDIUM: {
-      track: e === "HORIZONTAL" ? "h-3" : "w-3",
+      track: r === "HORIZONTAL" ? "h-3" : "w-3",
       thumb: "h-6 w-6",
-      height: e === "VERTICAL" ? "h-48" : void 0
+      height: r === "VERTICAL" ? "h-48" : void 0
     },
     LARGE: {
-      track: e === "HORIZONTAL" ? "h-4" : "w-4",
+      track: r === "HORIZONTAL" ? "h-4" : "w-4",
       thumb: "h-8 w-8",
-      height: e === "VERTICAL" ? "h-56" : void 0
+      height: r === "VERTICAL" ? "h-56" : void 0
     }
   }, T = (() => {
-    if (o.startsWith("#"))
+    if (l.startsWith("#"))
       return {
         range: "",
         thumb: "border-2 border-white shadow-lg"
       };
-    const r = {
+    const e = {
       ACCENT: {
         range: "bg-blue-500",
         thumb: "bg-blue-500 border-2 border-white shadow-lg hover:bg-blue-700 focus:bg-blue-700"
@@ -74,37 +74,37 @@ const Y = ({
         thumb: "bg-gray-700 border-2 border-white shadow-lg hover:bg-gray-900 focus:bg-gray-900"
       }
     };
-    return r[o] || r.ACCENT;
-  })(), k = (r) => {
-    const l = O || I;
-    l && !d && l(R ? r : r[0]);
-  }, u = N.length > 0, j = f && a.every((r) => r === A) && w, H = () => R ? `${i(a[0])} - ${i(a[1])}` : i(a[0]), Z = /* @__PURE__ */ t("div", { className: e === "VERTICAL" ? "flex justify-center" : "", children: /* @__PURE__ */ p(
+    return e[l] || e.ACCENT;
+  })(), x = (e) => {
+    const a = O || I;
+    a && !g && a(R ? e : e[0]);
+  }, m = w.length > 0, j = A && s.every((e) => e === N) && C, $ = () => R ? `${u(s[0])} - ${u(s[1])}` : u(s[0]), H = /* @__PURE__ */ t("div", { className: r === "VERTICAL" ? "flex justify-center" : "", children: /* @__PURE__ */ p(
     n.Root,
     {
-      id: s,
-      value: a,
-      onValueChange: k,
-      min: A,
+      id: o,
+      value: s,
+      onValueChange: x,
+      min: N,
       max: v,
       step: E,
-      disabled: d,
-      orientation: e.toLowerCase(),
+      disabled: g,
+      orientation: r.toLowerCase(),
       className: [
         "relative flex items-center select-none touch-none",
-        e === "HORIZONTAL" ? "w-full" : c[g].height,
-        d && "opacity-50 cursor-not-allowed"
+        r === "HORIZONTAL" ? "w-full" : b[c].height,
+        g && "opacity-50 cursor-not-allowed"
       ].filter(Boolean).join(" "),
-      "aria-label": C || b,
-      "aria-describedby": m ? `${s}-instructions` : void 0,
-      "aria-invalid": u,
-      "aria-errormessage": u ? `${s}-error` : void 0,
+      "aria-label": i || h,
+      "aria-describedby": f ? `${o}-instructions` : void 0,
+      "aria-invalid": m,
+      "aria-errormessage": m ? `${o}-error` : void 0,
       children: [
         /* @__PURE__ */ t(
           n.Track,
           {
             className: [
               "relative grow rounded-full bg-gray-200",
-              c[g].track
+              b[c].track
             ].join(" "),
             children: /* @__PURE__ */ t(
               n.Range,
@@ -112,50 +112,51 @@ const Y = ({
                 className: [
                   "absolute rounded-full",
                   T.range,
-                  e === "HORIZONTAL" ? "h-full" : "w-full"
+                  r === "HORIZONTAL" ? "h-full" : "w-full"
                 ].join(" "),
-                style: o.startsWith("#") ? { backgroundColor: o } : void 0
+                style: l.startsWith("#") ? { backgroundColor: l } : void 0
               }
             )
           }
         ),
-        a.map((r, l) => /* @__PURE__ */ t(
+        s.map((e, a) => /* @__PURE__ */ t(
           n.Thumb,
           {
             className: [
               "block rounded-full transition-colors",
-              c[g].thumb,
+              b[c].thumb,
               T.thumb,
               "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
             ].join(" "),
-            style: o.startsWith("#") ? { backgroundColor: o } : void 0
+            style: l.startsWith("#") ? { backgroundColor: l } : void 0,
+            "aria-label": s.length > 1 ? `${h || "Slider"} thumb ${a + 1}` : i || h || "Slider"
           },
-          l
+          a
         ))
       ]
     }
-  ) }), M = S && /* @__PURE__ */ t("div", { className: [
+  ) }), Z = k && /* @__PURE__ */ t("div", { className: [
     "text-sm text-gray-700 mt-2",
-    e === "VERTICAL" ? "text-center" : ""
-  ].join(" "), children: H() }), $ = /* @__PURE__ */ p(G, { children: [
-    M,
-    u && /* @__PURE__ */ t("div", { id: `${s}-error`, className: "mt-2", role: "alert", children: N.map((r, l) => /* @__PURE__ */ t("p", { className: "text-sm text-red-700", children: r }, l)) }),
-    j && /* @__PURE__ */ t("p", { className: "text-sm text-red-700 mt-2", role: "alert", children: w })
+    r === "VERTICAL" ? "text-center" : ""
+  ].join(" "), children: $() }), M = /* @__PURE__ */ p(G, { children: [
+    Z,
+    m && /* @__PURE__ */ t("div", { id: `${o}-error`, className: "mt-2", role: "alert", children: w.map((e, a) => /* @__PURE__ */ t("p", { className: "text-sm text-red-700", children: e }, a)) }),
+    j && /* @__PURE__ */ t("p", { className: "text-sm text-red-700 mt-2", role: "alert", children: C })
   ] });
   return /* @__PURE__ */ t(
     W,
     {
-      label: b,
-      labelPosition: y,
-      required: f,
-      instructions: m,
-      helpTooltip: L,
-      accessibilityText: C,
-      inputId: s,
+      label: h,
+      labelPosition: L,
+      required: A,
+      instructions: f,
+      helpTooltip: y,
+      accessibilityText: i,
+      inputId: o,
       marginAbove: V,
       marginBelow: D,
-      footer: $,
-      children: Z
+      footer: M,
+      children: H
     }
   );
 };

package/dist/components/Stamp/Stamp.stories.d.ts

@@ -6,6 +6,30 @@ declare const meta: {
     parameters: {
         layout: string;
     };
+    argTypes: {
+        size: {
+            control: "select";
+            options: string[];
+        };
+        shape: {
+            control: "select";
+            options: string[];
+        };
+        align: {
+            control: "select";
+            options: string[];
+        };
+        labelPosition: {
+            control: "select";
+            options: string[];
+        };
+        backgroundColor: {
+            control: "text";
+        };
+        contentColor: {
+            control: "text";
+        };
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/components/Stamp/Stamp.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Stamp.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Stamp/Stamp.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAG3D,QAAA,MAAM,IAAI;;;;;;;CAKyB,CAAA;AAEnC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAQ5B,CAAA;AAED,eAAO,MAAM,qBAAqB,EAAE,KAOnC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KASnB,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAQpB,CAAA;AAED,eAAO,MAAM,wBAAwB,EAAE,KAWtC,CAAA"}
+{"version":3,"file":"Stamp.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Stamp/Stamp.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAG3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAayB,CAAA;AAEnC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAQ5B,CAAA;AAED,eAAO,MAAM,qBAAqB,EAAE,KAOnC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAMxB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KASnB,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAQpB,CAAA;AAED,eAAO,MAAM,wBAAwB,EAAE,KAWtC,CAAA"}