@golemui/gui-react 0.0.2

package/RangeCalendar-B-FeEowl.js

@@ -0,0 +1,47 @@
+import { jsx as i } from "react/jsx-runtime";
+import { useInputWidget as O } from "@golemui/react";
+import { useCallback as H } from "react";
+/* empty css                */
+function V(l) {
+  const c = l.widget, { uid: m, errors: u, value: h, isTouched: b, templateData: e, onBlur: t, onValueChanged: a } = O(c), g = H(
+    (o) => {
+      const n = o, r = (d) => a(d.detail.value), s = (d) => {
+        t();
+      };
+      return o && (n.addEventListener("blur", s), n.addEventListener("change", r)), () => {
+        n.removeEventListener("blur", s), n.removeEventListener("change", r);
+      };
+    },
+    [a, t]
+  ), v = e.label, p = e.hint, M = e.prevMonthIcon, f = e.nextMonthIcon, x = e.prevMonthAriaLabel, L = e.nextMonthAriaLabel, y = e.dayFormat, D = e.weekdayFormat, F = e.monthFormat, I = e.minDate, R = e.maxDate, w = e.disabledRanges, A = e.numberOfMonths, E = e.lang, k = e.disabled, q = e.readonly, C = e.validator?.required;
+  return /* @__PURE__ */ i("div", { className: "gui-range-calendar", children: /* @__PURE__ */ i(
+    "gui-range-calendar",
+    {
+      ref: g,
+      uid: m,
+      label: v,
+      hint: p,
+      errors: u,
+      touched: b,
+      required: C,
+      disabled: k,
+      readOnly: q,
+      value: h,
+      prevMonthIcon: M,
+      nextMonthIcon: f,
+      prevMonthAriaLabel: x,
+      nextMonthAriaLabel: L,
+      dayFormat: y,
+      weekdayFormat: D,
+      monthFormat: F,
+      minDate: I,
+      maxDate: R,
+      disabledRanges: w,
+      numberOfMonths: A,
+      localeId: E
+    }
+  ) });
+}
+export {
+  V as RangeCalendar
+};

package/Renderer-CRWbM4oE.js

@@ -0,0 +1,9 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useDisplayWdiget as s } from "@golemui/react";
+function c(r) {
+  const i = r.widget, { uid: t, templateData: d } = s(i), n = d?.render;
+  return /* @__PURE__ */ e("div", { className: "gui-renderer", children: /* @__PURE__ */ e("div", { className: "gui-widget", id: t, children: n }) });
+}
+export {
+  c as Renderer
+};

package/Repeater-D1koXq-v.js

@@ -0,0 +1,46 @@
+import { jsx as r, jsxs as c } from "react/jsx-runtime";
+import { useInputWidget as g, RepeaterIndexContext as h, WidgetRenderer as v } from "@golemui/react";
+import { useCallback as o } from "react";
+/* empty css                */
+function w(m) {
+  const u = m.widget, { uid: l, value: a, onValueChanged: i, templateData: e } = g(u), p = o(
+    (n) => {
+      const t = [...n ?? [], {}];
+      i(t);
+    },
+    [i]
+  ), d = o(
+    (n, t) => {
+      const s = [...n ?? []];
+      s.splice(t, 1), i(s);
+    },
+    [i]
+  ), b = o(() => a?.map((n, t) => /* @__PURE__ */ r(h.Provider, { value: t, children: /* @__PURE__ */ c("div", { className: "card", children: [
+    /* @__PURE__ */ r(
+      v,
+      {
+        widget: e.template,
+        repeaterIndex: t
+      },
+      `${l}-${t}`
+    ),
+    /* @__PURE__ */ r("button", { type: "button", className: "gui-button", onClick: () => d(a, t), children: e.removeLabel ?? "Remove" })
+  ] }) }, `${l}-${t}`)), [e, a, l, d]);
+  return /* @__PURE__ */ r("div", { className: "gui-repeater", style: { flex: e.size }, children: /* @__PURE__ */ c("div", { id: l, children: [
+    e.label && /* @__PURE__ */ r("h2", { children: e.label }, `${l}-title`),
+    b(),
+    /* @__PURE__ */ r(
+      "button",
+      {
+        type: "button",
+        className: "gui-button",
+        onClick: () => p(a || []),
+        disabled: e.limit ? e.limit === (a?.length ?? 0) : !1,
+        children: e.addLabel ?? "Add"
+      }
+    )
+  ] }) });
+}
+export {
+  w as Repeater
+};

package/Select-DvFmJB1_.js

@@ -0,0 +1,54 @@
+import { jsx as r } from "react/jsx-runtime";
+import { useInputWidget as D } from "@golemui/react";
+import { useCallback as s } from "react";
+/* empty css                */
+function z(a) {
+  const d = a.widget, {
+    uid: c,
+    errors: u,
+    value: p,
+    isTouched: h,
+    templateData: e,
+    onValueChanged: n,
+    onBlur: m,
+    injectValidationIssues: i
+  } = D(d), v = s(
+    (t) => n(t.nativeEvent.detail.value),
+    [n]
+  ), g = s(
+    (t) => {
+      const o = t, l = (w) => {
+        i([w.detail.message]);
+      };
+      return t && o.addEventListener("inputError", l), () => {
+        o.removeEventListener("inputError", l);
+      };
+    },
+    [i]
+  ), b = e.options, f = e.label, E = e.hint, y = e.placeholder, C = e.icon, F = e.valueField, q = e.labelField, x = e.disabled, R = e.readonly, j = e.validator?.required;
+  return /* @__PURE__ */ r("div", { className: "gui-select", style: { flex: e.size }, children: /* @__PURE__ */ r(
+    "gui-select",
+    {
+      ref: g,
+      uid: c,
+      label: f,
+      errors: u,
+      touched: h,
+      required: j,
+      disabled: x,
+      readOnly: R,
+      value: p,
+      hint: E,
+      placeholder: y,
+      icon: C,
+      options: b,
+      labelField: q,
+      valueField: F,
+      onChange: v,
+      onBlur: m
+    }
+  ) });
+}
+export {
+  z as Select
+};

package/Tabs-CsmJz1Vs.js

@@ -0,0 +1,115 @@
+import { jsx as l, jsxs as v } from "react/jsx-runtime";
+import { useLayoutWidget as N, WidgetRenderer as E, cn as A } from "@golemui/react";
+import { createIntersectionObserver as x } from "@golemui/gui-components";
+import { useRef as u, useState as h, useEffect as b, useCallback as f } from "react";
+function z(y) {
+  const m = u(null), r = y.widget, { uid: O, children: g, templateData: e, onChange: $ } = N(r), c = u([]), w = u(null), _ = u(null), [S, R] = h(!1), [k, T] = h(!1), [s, p] = h(e.defaultOpen);
+  b(() => {
+    const i = w.current, t = _.current, a = x(
+      i,
+      (n) => R(n)
+    ), d = x(
+      t,
+      (n) => T(n)
+    );
+    return () => {
+      a.disconnect(), d.disconnect();
+    };
+  }, []), b(() => {
+    s === void 0 && e.tabs?.length > 0 && p(e.tabs[0].uid);
+  }, [e.tabs, s]), b(() => {
+    e.defaultOpen && p(e.defaultOpen);
+  }, [e.defaultOpen]), b(() => {
+    const t = (e.tabs || []).findIndex((a) => a.uid === s);
+    t > -1 && c.current[t].scrollIntoView();
+  }, [s, e.tabs]);
+  const o = f(
+    (i) => {
+      p(i), $(i);
+    },
+    [$]
+  ), I = f(
+    (i) => {
+      const t = e.tabs.findIndex((n) => n.uid === s), a = c.current, d = m.current ? window.getComputedStyle(m.current).direction === "rtl" : !1;
+      switch (i.key) {
+        case "ArrowLeft": {
+          const n = t + (d ? 1 : -1);
+          n >= 0 && n < e.tabs.length && (o(e.tabs[n].uid), a[n]?.focus());
+          break;
+        }
+        case "ArrowRight": {
+          const n = t + (d ? -1 : 1);
+          n >= 0 && n < e.tabs.length && (o(e.tabs[n].uid), a[n]?.focus());
+          break;
+        }
+        case "Home":
+          o(e.tabs[0].uid), a[0]?.focus();
+          break;
+        case "End":
+          o(e.tabs[e.tabs.length - 1].uid), a[e.tabs.length - 1]?.focus();
+          break;
+        default:
+          return;
+      }
+    },
+    [s, e.tabs, o]
+  ), V = f(() => (e.tabs || []).map((t, a) => /* @__PURE__ */ l("li", { role: "presentation", children: /* @__PURE__ */ l(
+    "button",
+    {
+      ref: (d) => {
+        c.current[a] = d;
+      },
+      type: "button",
+      role: "tab",
+      tabIndex: t.uid === s ? void 0 : -1,
+      "data-cy": `tab_${r.uid}_${a}`,
+      id: `tab_${r.uid}_${a}`,
+      "aria-controls": `tabpanel_${r.uid}_${a}`,
+      "aria-selected": t.uid === s ? "true" : "false",
+      className: `${t.uid === s ? "active" : ""}`,
+      onClick: () => o(t.uid),
+      onKeyDown: (d) => I(d),
+      onFocus: (d) => {
+        d.target.scrollIntoView();
+      },
+      children: t.label
+    }
+  ) }, `tab_${r.uid}_${t.uid}`)), [e, s, r, c, o, I]), C = f(() => {
+    const i = g.findIndex((t) => t.uid === s);
+    return g.filter((t) => t.uid === s || e.renderMode !== "activeOnly").map((t) => /* @__PURE__ */ l(
+      "section",
+      {
+        role: "tabpanel",
+        "data-cy": `tabpanel_${r.uid}_${i}`,
+        id: `tabpanel_${r.uid}_${i}`,
+        hidden: t.uid !== s && e.renderMode !== "activeOnly",
+        "aria-labelledby": `tab_${r.uid}_${i}`,
+        children: /* @__PURE__ */ l(E, { widget: t }, t.uid)
+      },
+      `tabpanel_${r.uid}_${t.uid}`
+    ));
+  }, [g, s, r]);
+  return /* @__PURE__ */ v("div", { className: "gui-tabs", style: { flex: e.size }, children: [
+    /* @__PURE__ */ l(
+      "nav",
+      {
+        className: A({
+          "gui-widget": !0,
+          "gui-widget--horizontal": !0,
+          "gui-tabs--start-shadow": !S,
+          "gui-tabs--end-shadow": !k
+        }),
+        id: O,
+        children: /* @__PURE__ */ v("ul", { role: "tablist", children: [
+          /* @__PURE__ */ l("li", { role: "presentation", ref: w, className: "gui-sentinel" }),
+          V(),
+          /* @__PURE__ */ l("li", { role: "presentation", ref: _, className: "gui-sentinel" })
+        ] })
+      }
+    ),
+    C()
+  ] });
+}
+export {
+  z as Tabs
+};

package/TextArea-z99jVJ4-.js

@@ -0,0 +1,35 @@
+import { jsx as o } from "react/jsx-runtime";
+import { useInputWidget as C } from "@golemui/react";
+import { useCallback as D } from "react";
+/* empty css                */
+function M(n) {
+  const a = n.widget, { uid: i, errors: r, value: l, isTouched: s, templateData: e, onValueChanged: t, onBlur: d } = C(a), c = D(
+    (q) => t(q.nativeEvent.detail.value),
+    [t]
+  ), u = e.label, m = e.hint, h = e.placeholder, g = e.icon, p = e.validator?.maxLength, x = e.counterMode, v = e.autoGrow, b = e.minimumHeight, f = e.disabled, w = e.readonly, y = e.validator?.required;
+  return /* @__PURE__ */ o("div", { className: "gui-textarea", style: { flex: e.size }, children: /* @__PURE__ */ o(
+    "gui-textarea",
+    {
+      uid: i,
+      label: u,
+      errors: r,
+      touched: s,
+      required: y,
+      disabled: f,
+      readOnly: w,
+      value: l,
+      hint: m,
+      placeholder: h,
+      icon: g,
+      counterMode: x,
+      minimumHeight: b,
+      autoGrow: v,
+      maxLength: p,
+      onInput: c,
+      onBlur: d
+    }
+  ) });
+}
+export {
+  M as TextArea
+};

package/TextInput-BTkEyMEv.js

@@ -0,0 +1,31 @@
+import { jsx as i } from "react/jsx-runtime";
+import { useInputWidget as f } from "@golemui/react";
+import { useCallback as y } from "react";
+/* empty css                */
+function D(n) {
+  const o = n.widget, { uid: l, errors: a, value: d, isTouched: r, templateData: e, onValueChanged: t, onBlur: s } = f(o), c = y(
+    (x) => t(x.nativeEvent.detail.value),
+    [t]
+  ), u = e.label, p = e.hint, h = e.placeholder, m = e.icon, g = e.disabled, v = e.readonly, b = e.validator?.required;
+  return /* @__PURE__ */ i("div", { className: "gui-textinput", style: { flex: e.size }, children: /* @__PURE__ */ i(
+    "gui-textinput",
+    {
+      uid: l,
+      label: u,
+      hint: p,
+      errors: a,
+      touched: r,
+      required: b,
+      disabled: g,
+      readOnly: v,
+      value: d,
+      icon: m,
+      placeholder: h ?? void 0,
+      onInput: c,
+      onBlur: s
+    }
+  ) });
+}
+export {
+  D as TextInput
+};

package/Toggle-CCzdFjkq.js

@@ -0,0 +1,30 @@
+import { jsx as o } from "react/jsx-runtime";
+import { useInputWidget as f } from "@golemui/react";
+import { useCallback as y } from "react";
+/* empty css                */
+function D(i) {
+  const n = i.widget, { uid: l, errors: a, value: s, onValueChanged: t, onBlur: d, templateData: e, isTouched: r } = f(n), g = y(
+    (v) => t(v.nativeEvent.detail.value),
+    [t]
+  ), u = e.label, c = e.hint, h = e.togglePosition, m = e.disabled, p = e.readonly, b = e.validator?.required;
+  return /* @__PURE__ */ o("div", { className: "gui-toggle", style: { flex: e.size }, children: /* @__PURE__ */ o(
+    "gui-toggle",
+    {
+      uid: l,
+      label: u,
+      errors: a,
+      touched: r,
+      required: b,
+      disabled: m,
+      readOnly: p,
+      value: s,
+      hint: c,
+      togglePosition: h,
+      onChange: g,
+      onBlur: d
+    }
+  ) });
+}
+export {
+  D as Toggle
+};

package/index.d.ts

@@ -0,0 +1,3 @@
+export * from './lib/widget.loaders';
+export * from './lib/components/Form';
+export * from './lib/components/item-renderers/props';