@arkyn/components 3.0.1-beta.154 → 3.0.1-beta.156

package/dist/modules/components/radio/radioContext.js

@@ -0,0 +1,20 @@
+import { jsx as u } from "react/jsx-runtime";
+import { useContext as s, createContext as c } from "react";
+const r = c({});
+function f(e) {
+  const { children: o, size: t, isError: n, handleChange: i, value: a, disabled: d } = e;
+  return /* @__PURE__ */ u(
+    r.Provider,
+    {
+      value: { handleChange: i, value: a, size: t, isError: n, disabled: d },
+      children: o
+    }
+  );
+}
+function m() {
+  return s(r);
+}
+export {
+  f as RadioProvider,
+  m as useRadioGroup
+};

package/dist/modules/components/radio/radioGroup/index.js

@@ -0,0 +1,65 @@
+import { jsx as r, jsxs as C } from "react/jsx-runtime";
+import { useState as F } from "react";
+import { useForm as M } from "../../../hooks/useForm.js";
+import { FieldTemplate as R } from "../../../services/fieldTemplate.js";
+import { RadioProvider as V } from "../radioContext.js";
+/* empty css           */
+function A(m) {
+  const {
+    defaultValue: u = "",
+    name: e,
+    label: c,
+    showAsterisk: p,
+    errorMessage: d,
+    value: s,
+    onChange: o,
+    size: t = "md",
+    className: f = "",
+    disabled: h = !1,
+    unShowFieldTemplate: v = !1,
+    orientation: g = "vertical",
+    ...y
+  } = m, [i, N] = F(u), { fieldErrors: a } = M();
+  function x(n) {
+    N(n), o && o(n);
+  }
+  const l = d || (a == null ? void 0 : a[e]), b = !!l, w = `arkynRadioGroup ${t}`;
+  return /* @__PURE__ */ r(
+    R,
+    {
+      name: e,
+      label: c,
+      showAsterisk: p,
+      className: f,
+      errorMessage: l,
+      unShowFieldTemplate: v,
+      orientation: g,
+      children: /* @__PURE__ */ C(
+        V,
+        {
+          isError: b,
+          size: t,
+          value: s || i,
+          handleChange: x,
+          disabled: h,
+          children: [
+            /* @__PURE__ */ r(
+              "input",
+              {
+                style: { display: "none" },
+                type: "text",
+                readOnly: !0,
+                name: e,
+                value: s || i
+              }
+            ),
+            /* @__PURE__ */ r("div", { className: w.trim(), ...y })
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  A as RadioGroup
+};

package/dist/modules/components/richText/blockButton/index.js

@@ -0,0 +1,24 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useSlate as l } from "slate-react";
+import { isBlockActive as u } from "../../../services/isBlockActive.js";
+import { toggleBlock as p } from "../../../services/toggleBlock.js";
+import { textAlignTypes as a } from "../../../templates/richTextTemplates.js";
+/* empty css           */
+function g({ format: t, icon: i }) {
+  const o = l(), n = a.includes(t) ? "align" : "type", c = u(o, t, n) ? "activeTrue" : "activeFalse";
+  function s(r) {
+    r.preventDefault(), p(o, t);
+  }
+  return /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      className: "arkynRichTextBlockButton " + c,
+      onMouseDown: s,
+      children: /* @__PURE__ */ e(i, {})
+    }
+  );
+}
+export {
+  g as BlockButton
+};

package/dist/modules/components/richText/element/index.js

@@ -0,0 +1,59 @@
+import { jsx as s, jsxs as l } from "react/jsx-runtime";
+/* empty css           */
+function i({ attributes: e, children: a, element: c }) {
+  const r = { textAlign: c.align };
+  switch (c.type) {
+    case "blockQuote":
+      return /* @__PURE__ */ s(
+        "blockquote",
+        {
+          className: "arkynElementBlockquote",
+          style: r,
+          ...e,
+          children: a
+        }
+      );
+    case "bulletedList":
+      return /* @__PURE__ */ s("ul", { className: "arkynElementBulletList", style: r, ...e, children: a });
+    case "headingOne":
+      return /* @__PURE__ */ s("h1", { className: "arkynElementHeadingOne", style: r, ...e, children: a });
+    case "headingTwo":
+      return /* @__PURE__ */ s("h2", { className: "arkynElementHeadingTwo", style: r, ...e, children: a });
+    case "listItem":
+      return /* @__PURE__ */ s("li", { className: "arkynElementListItem", style: r, ...e, children: a });
+    case "numberedList":
+      return /* @__PURE__ */ s("ol", { className: "arkynElementNumberedList", style: r, ...e, children: a });
+    case "image":
+      return /* @__PURE__ */ l("div", { style: r, ...e, children: [
+        /* @__PURE__ */ s(
+          "img",
+          {
+            className: "arkynElementImage",
+            alt: "arkynElementImage",
+            src: (c == null ? void 0 : c.src) || ""
+          }
+        ),
+        a
+      ] });
+    case "video":
+      return /* @__PURE__ */ l("div", { style: r, ...e, children: [
+        /* @__PURE__ */ s(
+          "iframe",
+          {
+            className: "arkynElementVideo",
+            src: (c == null ? void 0 : c.src) || "",
+            title: "YouTube video player",
+            allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
+            referrerPolicy: "strict-origin-when-cross-origin",
+            allowFullScreen: !0
+          }
+        ),
+        a
+      ] });
+    default:
+      return /* @__PURE__ */ s("p", { className: "arkynElementParagraph", style: r, ...e, children: a });
+  }
+}
+export {
+  i as Element
+};

package/dist/modules/components/richText/index.js

@@ -0,0 +1,136 @@
+import { jsx as e, jsxs as p } from "react/jsx-runtime";
+import Y from "is-hotkey";
+import { Heading1 as Z, Heading2 as _, Quote as ee, Bold as re, Italic as te, Underline as oe, Code as ne, AlignLeft as ie, AlignRight as se, AlignCenter as ae, AlignJustify as ce } from "lucide-react";
+import { useMemo as le, useState as g, useRef as me, useId as fe, useCallback as F } from "react";
+import { createEditor as ue, Transforms as de } from "slate";
+import { withHistory as he } from "slate-history";
+import { withReact as pe, Slate as ge, Editable as Ce } from "slate-react";
+import { BlockButton as n } from "./blockButton/index.js";
+import { Element as ye } from "./element/index.js";
+import { InsertImage as Ne } from "./insertImage/index.js";
+import { InsertVideo as be } from "./insertVideo/index.js";
+import { Leaf as ke } from "./leaf/index.js";
+import { MarkButton as l } from "./markButton/index.js";
+import { Toolbar as Te } from "./toolbar/index.js";
+import { useForm as xe } from "../../hooks/useForm.js";
+import { extractTextFromNode as I } from "../../services/extractTextFromNode.js";
+import { FieldTemplate as Fe } from "../../services/fieldTemplate.js";
+import { toggleMark as Ie } from "../../services/toggleMark.js";
+import { hotKeys as V, initialValue as m } from "../../templates/richTextTemplates.js";
+/* empty css           */
+function Ge(w) {
+  const {
+    name: s,
+    hiddenButtons: f,
+    imageConfig: C,
+    videoConfig: A,
+    className: E = "",
+    defaultValue: O = "[]",
+    enforceCharacterLimit: S = !1,
+    onChangeCharactersCount: y,
+    baseErrorMessage: j,
+    maxLimit: a = 1e4,
+    onChange: N,
+    isError: H,
+    label: L,
+    showAsterisk: M,
+    id: R,
+    orientation: v = "vertical",
+    unShowFieldTemplate: B = !1
+  } = w, c = le(() => he(pe(ue())), []), { fieldErrors: u } = xe();
+  function d() {
+    try {
+      const r = JSON.parse(O);
+      return Array.isArray(r) ? r.length <= 0 ? m : r.every(
+        (i) => typeof i == "object" && i !== null && "type" in i && "children" in i
+      ) ? r : m : m;
+    } catch {
+      return m;
+    }
+  }
+  const J = I(d()), [h, D] = g(J.length), [Q, $] = g(
+    JSON.stringify(d()) || "[]"
+  ), [K, b] = g(!1), U = me(null), q = R || fe(), k = j || (u == null ? void 0 : u[s]), z = H || !!k, G = F(ke, []), P = F(ye, []);
+  function T(r) {
+    const o = I(r);
+    D(o.length), y && y(o.length), !(S && o.length >= a) && ($(JSON.stringify(r)), N && N(r), c.children = r, de.setNodes(c, { children: r }));
+  }
+  const W = K ? "focusTrue" : "focusFalse", X = `arkynRichText ${z || a < h ? "errorTrue" : "errorFalse"} ${W}`, x = a - h;
+  function t(r) {
+    return !(f != null && f.includes(r));
+  }
+  return /* @__PURE__ */ e(
+    Fe,
+    {
+      name: s,
+      label: L,
+      showAsterisk: M,
+      className: E,
+      errorMessage: k,
+      unShowFieldTemplate: B,
+      orientation: v,
+      children: /* @__PURE__ */ p(
+        ge,
+        {
+          editor: c,
+          initialValue: d(),
+          onChange: T,
+          onValueChange: T,
+          children: [
+            /* @__PURE__ */ p("div", { className: X, children: [
+              /* @__PURE__ */ p(Te, { children: [
+                t("headingOne") && /* @__PURE__ */ e(n, { format: "headingOne", icon: Z }),
+                t("headingTwo") && /* @__PURE__ */ e(n, { format: "headingTwo", icon: _ }),
+                t("blockQuote") && /* @__PURE__ */ e(n, { format: "blockQuote", icon: ee }),
+                t("bold") && /* @__PURE__ */ e(l, { format: "bold", icon: re }),
+                t("italic") && /* @__PURE__ */ e(l, { format: "italic", icon: te }),
+                t("underline") && /* @__PURE__ */ e(l, { format: "underline", icon: oe }),
+                t("code") && /* @__PURE__ */ e(l, { format: "code", icon: ne }),
+                t("left") && /* @__PURE__ */ e(n, { format: "left", icon: ie }),
+                t("right") && /* @__PURE__ */ e(n, { format: "right", icon: se }),
+                t("center") && /* @__PURE__ */ e(n, { format: "center", icon: ae }),
+                t("justify") && /* @__PURE__ */ e(n, { format: "justify", icon: ce }),
+                C && t("image") && /* @__PURE__ */ e(Ne, { ...C }),
+                t("video") && /* @__PURE__ */ e(be, { ...A })
+              ] }),
+              /* @__PURE__ */ e(
+                Ce,
+                {
+                  className: "editorContainer",
+                  renderElement: P,
+                  renderLeaf: G,
+                  spellCheck: !0,
+                  ref: U,
+                  id: q,
+                  onFocus: () => b(!0),
+                  onBlur: () => b(!1),
+                  onKeyDown: (r) => {
+                    for (const o in V)
+                      if (Y(o, r)) {
+                        r.preventDefault();
+                        const i = V[o];
+                        Ie(c, i);
+                      }
+                  }
+                }
+              ),
+              x < 0 && /* @__PURE__ */ e("div", { className: "restatesCharacters", children: x })
+            ] }),
+            /* @__PURE__ */ e(
+              "input",
+              {
+                type: "hidden",
+                name: s,
+                value: Q.slice(0, a)
+              }
+            ),
+            /* @__PURE__ */ e("input", { type: "hidden", name: `${s}Count`, value: h })
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  Ge as RichText
+};

package/dist/modules/components/richText/insertImage/index.js

@@ -0,0 +1,106 @@
+import { jsxs as a, Fragment as s, jsx as e } from "react/jsx-runtime";
+import { Image as T } from "lucide-react";
+import { useState as l } from "react";
+import { useSlate as U } from "slate-react";
+import { Button as d } from "../../button/index.js";
+import { ImageUpload as L } from "../../imageUpload/index.js";
+import { Input as R } from "../../input/index.js";
+import { ModalContainer as k } from "../../modal/modalContainer/index.js";
+import { ModalFooter as M } from "../../modal/modalFooter/index.js";
+import { ModalHeader as w } from "../../modal/modalHeader/index.js";
+import { TabButton as c } from "../../tab/tabButton/index.js";
+import { TabContainer as V } from "../../tab/tabContainer/index.js";
+/* empty css           */
+function J(u) {
+  const {
+    action: p,
+    tabLabels: i = ["Adicionar URL", "Upload de arquivo"],
+    modalCancelButton: h = "Cancelar",
+    modalConfirmButton: f = "Confirmar",
+    modalInputImageLabel: g = "Imagem:",
+    modalInputUrlLabel: I = "URL da imagem:",
+    modalTitle: b = "Inserir imagem"
+  } = u, x = U(), [y, o] = l(!1), [t, m] = l(""), [n, C] = l("url");
+  function v(r) {
+    r.preventDefault(), !(!t || t === "") && (x.insertNodes([
+      { type: "paragraph", children: [{ text: "" }] },
+      { type: "image", src: t, children: [{ text: "" }] },
+      { type: "paragraph", children: [{ text: "" }] }
+    ]), o(!1));
+  }
+  return /* @__PURE__ */ a(s, { children: [
+    /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        className: "arkynRichTextInsertImage",
+        onMouseDown: () => o(!0),
+        children: /* @__PURE__ */ e(T, {})
+      }
+    ),
+    /* @__PURE__ */ a(
+      k,
+      {
+        isVisible: y,
+        makeInvisible: () => o(!1),
+        children: [
+          /* @__PURE__ */ e(w, { children: b }),
+          /* @__PURE__ */ a("div", { className: "arkynRichTextInsertImageModalContent", children: [
+            /* @__PURE__ */ a(V, { defaultValue: n, onChange: C, children: [
+              /* @__PURE__ */ e(c, { value: "url", children: i[0] }),
+              /* @__PURE__ */ e(c, { value: "file", children: i[1] })
+            ] }),
+            n === "url" && /* @__PURE__ */ a(s, { children: [
+              /* @__PURE__ */ e(
+                R,
+                {
+                  type: "text",
+                  name: "richTextImageURL",
+                  label: I,
+                  showAsterisk: !0,
+                  defaultValue: t,
+                  onChange: (r) => m(r.target.value)
+                }
+              ),
+              t && /* @__PURE__ */ e(
+                "img",
+                {
+                  className: "arkynRichTextInsertImageModalPreviewImage",
+                  src: t,
+                  alt: "preview"
+                }
+              )
+            ] }),
+            n === "file" && /* @__PURE__ */ e(
+              L,
+              {
+                name: "richTextImageURL",
+                action: p,
+                label: g,
+                showAsterisk: !0,
+                defaultValue: t,
+                onChange: (r) => m(r)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ a(M, { children: [
+            /* @__PURE__ */ e(
+              d,
+              {
+                type: "button",
+                scheme: "danger",
+                variant: "outline",
+                onClick: () => o(!1),
+                children: h
+              }
+            ),
+            /* @__PURE__ */ e(d, { type: "button", onClick: v, children: f })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+export {
+  J as InsertImage
+};

package/dist/modules/components/richText/insertVideo/index.js

@@ -0,0 +1,98 @@
+import { jsxs as n, Fragment as x, jsx as e } from "react/jsx-runtime";
+import { Video as M } from "lucide-react";
+import { useState as s, useEffect as u } from "react";
+import { useSlate as R } from "slate-react";
+import { Button as p } from "../../button/index.js";
+import { Input as C } from "../../input/index.js";
+import { ModalContainer as U } from "../../modal/modalContainer/index.js";
+import { ModalFooter as L } from "../../modal/modalFooter/index.js";
+import { ModalHeader as k } from "../../modal/modalHeader/index.js";
+/* empty css           */
+function A(h) {
+  const {
+    modalCancelButton: f = "Cancelar",
+    modalConfirmButton: b = "Confirmar",
+    modalInputUrlLabel: w = "URL do vídeo:",
+    modalTitle: v = "Inserir vídeo",
+    invalidUrlMessage: y = "URL inválida"
+  } = h, g = R(), [l, o] = s(!1), [t, d] = s(""), [r, m] = s(""), [I, c] = s("");
+  function V(i) {
+    if (i.preventDefault(), !t || t === "") return;
+    const a = `https://www.youtube.com/embed/${t}`;
+    g.insertNodes([
+      { type: "paragraph", children: [{ text: "" }] },
+      { type: "video", src: a, children: [{ text: "" }] },
+      { type: "paragraph", children: [{ text: "" }] }
+    ]), o(!1);
+  }
+  return u(() => {
+    if (!r || r === "") return;
+    d(""), c("");
+    const a = new URLSearchParams(r.split("?")[1]).get("v");
+    a ? d(a) : c(y);
+  }, [r]), u(() => {
+    l || (d(""), m(""), c(""));
+  }, [l]), /* @__PURE__ */ n(x, { children: [
+    /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        className: "arkynRichTextInsertVideo",
+        onMouseDown: () => o(!0),
+        children: /* @__PURE__ */ e(M, {})
+      }
+    ),
+    /* @__PURE__ */ n(
+      U,
+      {
+        isVisible: l,
+        makeInvisible: () => o(!1),
+        children: [
+          /* @__PURE__ */ e(k, { children: v }),
+          /* @__PURE__ */ n("div", { className: "arkynRichTextInsertVideoModalContent", children: [
+            /* @__PURE__ */ e(
+              C,
+              {
+                type: "text",
+                name: "richTextVideoURL",
+                label: w,
+                showAsterisk: !0,
+                defaultValue: r,
+                onChange: (i) => m(i.target.value),
+                errorMessage: I
+              }
+            ),
+            t && /* @__PURE__ */ e(
+              "iframe",
+              {
+                width: "auto",
+                height: "315",
+                src: `https://www.youtube.com/embed/${t}`,
+                title: "YouTube video player",
+                allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
+                referrerPolicy: "strict-origin-when-cross-origin",
+                allowFullScreen: !0
+              }
+            )
+          ] }),
+          /* @__PURE__ */ n(L, { children: [
+            /* @__PURE__ */ e(
+              p,
+              {
+                type: "button",
+                scheme: "danger",
+                variant: "outline",
+                onClick: () => o(!1),
+                children: f
+              }
+            ),
+            /* @__PURE__ */ e(p, { disabled: !t, type: "button", onClick: V, children: b })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+export {
+  A as InsertVideo
+};

package/dist/modules/components/richText/leaf/index.js

@@ -0,0 +1,7 @@
+import { jsx as t } from "react/jsx-runtime";
+function p({ attributes: u, children: o, leaf: f }) {
+  return f.bold && (o = /* @__PURE__ */ t("strong", { children: o })), f.code && (o = /* @__PURE__ */ t("code", { children: o })), f.italic && (o = /* @__PURE__ */ t("em", { children: o })), f.underline && (o = /* @__PURE__ */ t("u", { children: o })), /* @__PURE__ */ t("span", { ...u, children: o });
+}
+export {
+  p as Leaf
+};

package/dist/modules/components/richText/markButton/index.js

@@ -0,0 +1,23 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useSlate as s } from "slate-react";
+import { isMarkActive as a } from "../../../services/isMarkActive.js";
+import { toggleMark as u } from "../../../services/toggleMark.js";
+/* empty css           */
+function k({ format: t, icon: i }) {
+  const o = s(), n = a(o, t) ? "activeTrue" : "activeFalse";
+  function r(c) {
+    c.preventDefault(), u(o, t);
+  }
+  return /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      className: "arkynRichTextMarkButton " + n,
+      onMouseDown: r,
+      children: /* @__PURE__ */ e(i, {})
+    }
+  );
+}
+export {
+  k as MarkButton
+};

package/dist/modules/components/richText/toolbar/index.js

@@ -0,0 +1,8 @@
+import { jsx as r } from "react/jsx-runtime";
+/* empty css           */
+function i({ children: o }) {
+  return /* @__PURE__ */ r("div", { className: "arkynRichTextToolbar", children: o });
+}
+export {
+  i as Toolbar
+};

package/dist/modules/components/searchPlaces.js

@@ -0,0 +1,67 @@
+import { jsx as _ } from "react/jsx-runtime";
+import { StandaloneSearchBox as B } from "@react-google-maps/api";
+import { useState as N } from "react";
+import { Input as j } from "./input/index.js";
+function A(g) {
+  const { onChange: i, onPlaceChanged: d, options: y, ...v } = g, [r, C] = N(null);
+  return /* @__PURE__ */ _(
+    B,
+    {
+      onLoad: (o) => C(o),
+      onPlacesChanged: () => {
+        var f, m, h, p;
+        const o = r == null ? void 0 : r.getPlaces(), a = o ? o[0] : null, c = a == null ? void 0 : a.address_components;
+        function s(n) {
+          const t = c.find((e) => e.types[0] === n);
+          return t ? t.long_name : "";
+        }
+        function P(n) {
+          const t = c.find((e) => e.types[0] === n);
+          return t ? t.short_name : "";
+        }
+        function u(n) {
+          for (const t of n) {
+            const e = c.find(
+              (l) => l.types.includes(t)
+            );
+            if (e) return e.long_name;
+          }
+          return "";
+        }
+        if (a) {
+          const n = s("route"), t = s("street_number"), e = u([
+            "sublocality_level_1",
+            "sublocality",
+            "neighborhood"
+          ]), l = s("administrative_area_level_2"), S = s("administrative_area_level_1"), b = P("administrative_area_level_1"), x = u([
+            "postal_code",
+            "postal_code_prefix"
+          ]), D = (m = (f = a.geometry) == null ? void 0 : f.location) == null ? void 0 : m.lat(), L = (p = (h = a.geometry) == null ? void 0 : h.location) == null ? void 0 : p.lng();
+          d && d({
+            street: n,
+            city: l,
+            state: S,
+            neighborhood: e,
+            postalCode: x,
+            streetNumber: t,
+            stateShortName: b,
+            coordinates: { lat: D, lng: L }
+          });
+        }
+      },
+      options: y,
+      children: /* @__PURE__ */ _(
+        j,
+        {
+          type: "text",
+          autoComplete: "off",
+          onChange: (o) => i && i(o.target.value),
+          ...v
+        }
+      )
+    }
+  );
+}
+export {
+  A as SearchPlaces
+};