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

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

@@ -1,59 +1,73 @@
-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 });
-  }
+/* empty css       */
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+//#region src/components/richText/element/index.tsx
+function n({ attributes: n, children: r, element: i }) {
+	let a = { textAlign: i.align };
+	switch (i.type) {
+		case "blockQuote": return /* @__PURE__ */ e("blockquote", {
+			className: "arkynElementBlockquote",
+			style: a,
+			...n,
+			children: r
+		});
+		case "bulletedList": return /* @__PURE__ */ e("ul", {
+			className: "arkynElementBulletList",
+			style: a,
+			...n,
+			children: r
+		});
+		case "headingOne": return /* @__PURE__ */ e("h1", {
+			className: "arkynElementHeadingOne",
+			style: a,
+			...n,
+			children: r
+		});
+		case "headingTwo": return /* @__PURE__ */ e("h2", {
+			className: "arkynElementHeadingTwo",
+			style: a,
+			...n,
+			children: r
+		});
+		case "listItem": return /* @__PURE__ */ e("li", {
+			className: "arkynElementListItem",
+			style: a,
+			...n,
+			children: r
+		});
+		case "numberedList": return /* @__PURE__ */ e("ol", {
+			className: "arkynElementNumberedList",
+			style: a,
+			...n,
+			children: r
+		});
+		case "image": return /* @__PURE__ */ t("div", {
+			style: a,
+			...n,
+			children: [/* @__PURE__ */ e("img", {
+				className: "arkynElementImage",
+				alt: "arkynElementImage",
+				src: i?.src || ""
+			}), r]
+		});
+		case "video": return /* @__PURE__ */ t("div", {
+			style: a,
+			...n,
+			children: [/* @__PURE__ */ e("iframe", {
+				className: "arkynElementVideo",
+				src: i?.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
+			}), r]
+		});
+		default: return /* @__PURE__ */ e("p", {
+			className: "arkynElementParagraph",
+			style: a,
+			...n,
+			children: r
+		});
+	}
 }
-export {
-  i as Element
-};
+//#endregion
+export { n as Element };

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

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

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

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