@arkyn/components 3.0.10 → 3.0.12

package/dist/modules/components/tooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/tooltip/index.tsx"],"sourcesContent":["import {\n\ttype HTMLAttributes,\n\ttype ReactNode,\n\tuseEffect,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport \"./styles.css\";\n\ntype TooltipProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> & {\n\t/** Text rendered inside the tooltip bubble. Supports inline HTML. Required. */\n\ttext: string;\n\t/** Element that triggers the tooltip on hover. Required. */\n\tchildren: ReactNode;\n\t/**\n\t * Preferred position of the tooltip relative to the trigger element.\n\t * Automatically flips to the opposite side if the tooltip would overflow the viewport.\n\t * @default \"top\"\n\t */\n\torientation?: \"top\" | \"right\" | \"bottom\" | \"left\";\n\t/**\n\t * Tooltip size.\n\t * @default \"lg\"\n\t */\n\tsize?: \"md\" | \"lg\";\n};\n\n/**\n * Tooltip, shows a contextual text bubble on hover with smart viewport-aware positioning.\n *\n * The tooltip automatically flips to the opposite side when it would overflow the viewport.\n *\n * @param props.text - Text (or HTML) to display in the tooltip. Required.\n * @param props.children - Trigger element. Required.\n * @param props.orientation - Preferred position relative to the trigger. Default: \"top\"\n * @param props.size - Tooltip size. Default: \"lg\"\n *\n * **...Other valid HTML properties for `<div>`**\n *\n * @returns Tooltip JSX element.\n *\n * @example\n * ```tsx\n * <Tooltip text=\"Save changes before leaving\">\n *   <IconButton icon={SaveIcon} aria-label=\"Save\" />\n * </Tooltip>\n *\n * // Toolbar with bottom-oriented tooltips\n * <Tooltip text=\"Add item\" orientation=\"bottom\">\n *   <IconButton icon={Plus} aria-label=\"Add\" />\n * </Tooltip>\n *\n * <Tooltip text=\"Delete\" orientation=\"bottom\" size=\"md\">\n *   <IconButton icon={Trash2} aria-label=\"Delete\" scheme=\"danger\" />\n * </Tooltip>\n * ```\n */\n\nfunction Tooltip(props: TooltipProps) {\n\tconst {\n\t\ttext,\n\t\tsize = \"lg\",\n\t\tchildren,\n\t\torientation = \"top\",\n\t\tclassName: baseClassName = \"\",\n\t\t...rest\n\t} = props;\n\n\tconst tooltipId = useId();\n\tconst tooltipRef = useRef<HTMLDivElement>(null);\n\tconst [adjustedOrientation, setAdjustedOrientation] = useState(orientation);\n\n\tuseEffect(() => {\n\t\tconst checkTooltipPosition = () => {\n\t\t\tif (!tooltipRef.current) return;\n\t\t\tconst tooltipText = document.getElementById(tooltipId) as HTMLElement;\n\t\t\tif (!tooltipText) return;\n\n\t\t\tsetAdjustedOrientation(orientation);\n\n\t\t\trequestAnimationFrame(() => {\n\t\t\t\tconst rect = tooltipText.getBoundingClientRect();\n\t\t\t\tconst viewportWidth = window.innerWidth;\n\t\t\t\tconst viewportHeight = window.innerHeight;\n\n\t\t\t\tlet newOrientation = orientation;\n\n\t\t\t\tif (orientation === \"left\" && rect.left < 0) {\n\t\t\t\t\tnewOrientation = \"right\";\n\t\t\t\t} else if (orientation === \"right\" && rect.right > viewportWidth) {\n\t\t\t\t\tnewOrientation = \"left\";\n\t\t\t\t} else if (orientation === \"top\" && rect.top < 0) {\n\t\t\t\t\tnewOrientation = \"bottom\";\n\t\t\t\t} else if (orientation === \"bottom\" && rect.bottom > viewportHeight) {\n\t\t\t\t\tnewOrientation = \"top\";\n\t\t\t\t}\n\n\t\t\t\tif (newOrientation === \"right\" && rect.right > viewportWidth) {\n\t\t\t\t\tnewOrientation = \"left\";\n\t\t\t\t} else if (newOrientation === \"left\" && rect.left < 0) {\n\t\t\t\t\tnewOrientation = \"right\";\n\t\t\t\t} else if (\n\t\t\t\t\tnewOrientation === \"bottom\" &&\n\t\t\t\t\trect.bottom > viewportHeight\n\t\t\t\t) {\n\t\t\t\t\tnewOrientation = \"top\";\n\t\t\t\t} else if (newOrientation === \"top\" && rect.top < 0) {\n\t\t\t\t\tnewOrientation = \"bottom\";\n\t\t\t\t}\n\n\t\t\t\tsetAdjustedOrientation(newOrientation);\n\t\t\t});\n\t\t};\n\n\t\tconst tooltip = tooltipRef.current;\n\t\tif (!tooltip) return;\n\n\t\tconst handleMouseEnter = () => {\n\t\t\tsetTimeout(checkTooltipPosition, 1);\n\t\t};\n\n\t\ttooltip.addEventListener(\"mouseenter\", handleMouseEnter);\n\t\twindow.addEventListener(\"resize\", checkTooltipPosition);\n\n\t\treturn () => {\n\t\t\ttooltip.removeEventListener(\"mouseenter\", handleMouseEnter);\n\t\t\twindow.removeEventListener(\"resize\", checkTooltipPosition);\n\t\t};\n\t}, [orientation, tooltipId]);\n\n\tconst className = `arkynTooltip ${size} ${adjustedOrientation} ${baseClassName}`;\n\n\treturn (\n\t\t<div className={className.trim()} {...rest} ref={tooltipRef}>\n\t\t\t{children}\n\n\t\t\t<div\n\t\t\t\tclassName=\"arkynTooltipText\"\n\t\t\t\tid={tooltipId}\n\t\t\t\tdangerouslySetInnerHTML={{ __html: text }}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport { Tooltip };\n"],"mappings":";;;;AA2DA,SAAS,EAAQ,GAAqB;CACrC,IAAM,EACL,SACA,UAAO,MACP,aACA,iBAAc,OACd,WAAW,IAAgB,IAC3B,GAAG,MACA,GAEE,IAAY,EAAM,GAClB,IAAa,EAAuB,IAAI,GACxC,CAAC,GAAqB,KAA0B,EAAS,CAAW;CA8D1E,OA5DA,QAAgB;EACf,IAAM,UAA6B;GAClC,IAAI,CAAC,EAAW,SAAS;GACzB,IAAM,IAAc,SAAS,eAAe,CAAS;GAChD,MAEL,EAAuB,CAAW,GAElC,4BAA4B;IAC3B,IAAM,IAAO,EAAY,sBAAsB,GACzC,IAAgB,OAAO,YACvB,IAAiB,OAAO,aAE1B,IAAiB;IAyBrB,AAvBI,MAAgB,UAAU,EAAK,OAAO,IACzC,IAAiB,UACP,MAAgB,WAAW,EAAK,QAAQ,IAClD,IAAiB,SACP,MAAgB,SAAS,EAAK,MAAM,IAC9C,IAAiB,WACP,MAAgB,YAAY,EAAK,SAAS,MACpD,IAAiB,QAGd,MAAmB,WAAW,EAAK,QAAQ,IAC9C,IAAiB,SACP,MAAmB,UAAU,EAAK,OAAO,IACnD,IAAiB,UAEjB,MAAmB,YACnB,EAAK,SAAS,IAEd,IAAiB,QACP,MAAmB,SAAS,EAAK,MAAM,MACjD,IAAiB,WAGlB,EAAuB,CAAc;GACtC,CAAC;EACF,GAEM,IAAU,EAAW;EAC3B,IAAI,CAAC,GAAS;EAEd,IAAM,UAAyB;GAC9B,WAAW,GAAsB,CAAC;EACnC;EAKA,OAHA,EAAQ,iBAAiB,cAAc,CAAgB,GACvD,OAAO,iBAAiB,UAAU,CAAoB,SAEzC;GAEZ,AADA,EAAQ,oBAAoB,cAAc,CAAgB,GAC1D,OAAO,oBAAoB,UAAU,CAAoB;EAC1D;CACD,GAAG,CAAC,GAAa,CAAS,CAAC,GAK1B,kBAAC,OAAD;EAAK,WAAW,gBAHiB,EAAK,GAAG,EAAoB,GAAG,IAGtC,KAAK;EAAG,GAAI;EAAM,KAAK;YAAjD,CACE,GAED,kBAAC,OAAD;GACC,WAAU;GACV,IAAI;GACJ,yBAAyB,EAAE,QAAQ,EAAK;EACxC,CAAA,CACG;;AAEP"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/tooltip/index.tsx"],"sourcesContent":["import {\n\ttype HTMLAttributes,\n\ttype ReactNode,\n\tuseEffect,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport { sanitizeTooltipHtml } from \"../../utils/sanitizeTooltipHtml\";\nimport \"./styles.css\";\n\ntype TooltipProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> & {\n\t/**\n\t * Text rendered inside the tooltip bubble. Supports a small set of\n\t * inline formatting tags (`b`, `strong`, `i`, `em`, `u`, `br`, `span`,\n\t * `small`); anything else (including `<script>`, event handler\n\t * attributes and all other attributes) is stripped before rendering.\n\t * Required.\n\t */\n\ttext: string;\n\t/** Element that triggers the tooltip on hover. Required. */\n\tchildren: ReactNode;\n\t/**\n\t * Preferred position of the tooltip relative to the trigger element.\n\t * Automatically flips to the opposite side if the tooltip would overflow the viewport.\n\t * @default \"top\"\n\t */\n\torientation?: \"top\" | \"right\" | \"bottom\" | \"left\";\n\t/**\n\t * Tooltip size.\n\t * @default \"lg\"\n\t */\n\tsize?: \"md\" | \"lg\";\n};\n\n/**\n * Tooltip, shows a contextual text bubble on hover with smart viewport-aware positioning.\n *\n * The tooltip automatically flips to the opposite side when it would overflow the viewport.\n *\n * @param props.text - Text (or a small subset of inline HTML — see prop docs) to display in the tooltip. Sanitized before render. Required.\n * @param props.children - Trigger element. Required.\n * @param props.orientation - Preferred position relative to the trigger. Default: \"top\"\n * @param props.size - Tooltip size. Default: \"lg\"\n *\n * **...Other valid HTML properties for `<div>`**\n *\n * @returns Tooltip JSX element.\n *\n * @example\n * ```tsx\n * <Tooltip text=\"Save changes before leaving\">\n *   <IconButton icon={SaveIcon} aria-label=\"Save\" />\n * </Tooltip>\n *\n * // Toolbar with bottom-oriented tooltips\n * <Tooltip text=\"Add item\" orientation=\"bottom\">\n *   <IconButton icon={Plus} aria-label=\"Add\" />\n * </Tooltip>\n *\n * <Tooltip text=\"Delete\" orientation=\"bottom\" size=\"md\">\n *   <IconButton icon={Trash2} aria-label=\"Delete\" scheme=\"danger\" />\n * </Tooltip>\n * ```\n */\n\nfunction Tooltip(props: TooltipProps) {\n\tconst {\n\t\ttext,\n\t\tsize = \"lg\",\n\t\tchildren,\n\t\torientation = \"top\",\n\t\tclassName: baseClassName = \"\",\n\t\t...rest\n\t} = props;\n\n\tconst tooltipId = useId();\n\tconst tooltipRef = useRef<HTMLDivElement>(null);\n\tconst [adjustedOrientation, setAdjustedOrientation] = useState(orientation);\n\n\tuseEffect(() => {\n\t\tconst checkTooltipPosition = () => {\n\t\t\tif (!tooltipRef.current) return;\n\t\t\tconst tooltipText = document.getElementById(tooltipId) as HTMLElement;\n\t\t\tif (!tooltipText) return;\n\n\t\t\tsetAdjustedOrientation(orientation);\n\n\t\t\trequestAnimationFrame(() => {\n\t\t\t\tconst rect = tooltipText.getBoundingClientRect();\n\t\t\t\tconst viewportWidth = window.innerWidth;\n\t\t\t\tconst viewportHeight = window.innerHeight;\n\n\t\t\t\tlet newOrientation = orientation;\n\n\t\t\t\tif (orientation === \"left\" && rect.left < 0) {\n\t\t\t\t\tnewOrientation = \"right\";\n\t\t\t\t} else if (orientation === \"right\" && rect.right > viewportWidth) {\n\t\t\t\t\tnewOrientation = \"left\";\n\t\t\t\t} else if (orientation === \"top\" && rect.top < 0) {\n\t\t\t\t\tnewOrientation = \"bottom\";\n\t\t\t\t} else if (orientation === \"bottom\" && rect.bottom > viewportHeight) {\n\t\t\t\t\tnewOrientation = \"top\";\n\t\t\t\t}\n\n\t\t\t\tif (newOrientation === \"right\" && rect.right > viewportWidth) {\n\t\t\t\t\tnewOrientation = \"left\";\n\t\t\t\t} else if (newOrientation === \"left\" && rect.left < 0) {\n\t\t\t\t\tnewOrientation = \"right\";\n\t\t\t\t} else if (\n\t\t\t\t\tnewOrientation === \"bottom\" &&\n\t\t\t\t\trect.bottom > viewportHeight\n\t\t\t\t) {\n\t\t\t\t\tnewOrientation = \"top\";\n\t\t\t\t} else if (newOrientation === \"top\" && rect.top < 0) {\n\t\t\t\t\tnewOrientation = \"bottom\";\n\t\t\t\t}\n\n\t\t\t\tsetAdjustedOrientation(newOrientation);\n\t\t\t});\n\t\t};\n\n\t\tconst tooltip = tooltipRef.current;\n\t\tif (!tooltip) return;\n\n\t\tconst handleMouseEnter = () => {\n\t\t\tsetTimeout(checkTooltipPosition, 1);\n\t\t};\n\n\t\ttooltip.addEventListener(\"mouseenter\", handleMouseEnter);\n\t\twindow.addEventListener(\"resize\", checkTooltipPosition);\n\n\t\treturn () => {\n\t\t\ttooltip.removeEventListener(\"mouseenter\", handleMouseEnter);\n\t\t\twindow.removeEventListener(\"resize\", checkTooltipPosition);\n\t\t};\n\t}, [orientation, tooltipId]);\n\n\tconst className = `arkynTooltip ${size} ${adjustedOrientation} ${baseClassName}`;\n\n\treturn (\n\t\t<div className={className.trim()} {...rest} ref={tooltipRef}>\n\t\t\t{children}\n\n\t\t\t<div\n\t\t\t\tclassName=\"arkynTooltipText\"\n\t\t\t\tid={tooltipId}\n\t\t\t\tdangerouslySetInnerHTML={{ __html: sanitizeTooltipHtml(text) }}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport { Tooltip };\n"],"mappings":";;;;;AAkEA,SAAS,EAAQ,GAAqB;CACrC,IAAM,EACL,SACA,UAAO,MACP,aACA,iBAAc,OACd,WAAW,IAAgB,IAC3B,GAAG,MACA,GAEE,IAAY,EAAM,GAClB,IAAa,EAAuB,IAAI,GACxC,CAAC,GAAqB,KAA0B,EAAS,CAAW;CA8D1E,OA5DA,QAAgB;EACf,IAAM,UAA6B;GAClC,IAAI,CAAC,EAAW,SAAS;GACzB,IAAM,IAAc,SAAS,eAAe,CAAS;GAChD,MAEL,EAAuB,CAAW,GAElC,4BAA4B;IAC3B,IAAM,IAAO,EAAY,sBAAsB,GACzC,IAAgB,OAAO,YACvB,IAAiB,OAAO,aAE1B,IAAiB;IAyBrB,AAvBI,MAAgB,UAAU,EAAK,OAAO,IACzC,IAAiB,UACP,MAAgB,WAAW,EAAK,QAAQ,IAClD,IAAiB,SACP,MAAgB,SAAS,EAAK,MAAM,IAC9C,IAAiB,WACP,MAAgB,YAAY,EAAK,SAAS,MACpD,IAAiB,QAGd,MAAmB,WAAW,EAAK,QAAQ,IAC9C,IAAiB,SACP,MAAmB,UAAU,EAAK,OAAO,IACnD,IAAiB,UAEjB,MAAmB,YACnB,EAAK,SAAS,IAEd,IAAiB,QACP,MAAmB,SAAS,EAAK,MAAM,MACjD,IAAiB,WAGlB,EAAuB,CAAc;GACtC,CAAC;EACF,GAEM,IAAU,EAAW;EAC3B,IAAI,CAAC,GAAS;EAEd,IAAM,UAAyB;GAC9B,WAAW,GAAsB,CAAC;EACnC;EAKA,OAHA,EAAQ,iBAAiB,cAAc,CAAgB,GACvD,OAAO,iBAAiB,UAAU,CAAoB,SAEzC;GAEZ,AADA,EAAQ,oBAAoB,cAAc,CAAgB,GAC1D,OAAO,oBAAoB,UAAU,CAAoB;EAC1D;CACD,GAAG,CAAC,GAAa,CAAS,CAAC,GAK1B,kBAAC,OAAD;EAAK,WAAW,gBAHiB,EAAK,GAAG,EAAoB,GAAG,IAGtC,KAAK;EAAG,GAAI;EAAM,KAAK;YAAjD,CACE,GAED,kBAAC,OAAD;GACC,WAAU;GACV,IAAI;GACJ,yBAAyB,EAAE,QAAQ,EAAoB,CAAI,EAAE;EAC7D,CAAA,CACG;;AAEP"}

package/dist/modules/hooks/useAutomation.js

@@ -2,46 +2,45 @@ import { badResponses as e } from "../templates/badResponses.js";
 import { successResponses as t } from "../templates/successResponses.js";
 import { useModal as n } from "./useModal.js";
 import { useToast as r } from "./useToast.js";
-import { useCallback as i, useEffect as a } from "react";
-import { scroller as o } from "react-scroll";
+import { useEffect as i } from "react";
+import { scroller as a } from "react-scroll";
 //#region src/hooks/useAutomation.ts
-function s(s) {
-	let { closeAll: c } = n(), { showToast: l } = r(), u = s?.closeModal, d = s?.message, f = s?.name, p = s?.cause?.data?.scrollTo, m = s?.cause?.fieldErrors ? Object.values(s?.cause?.fieldErrors)[0] : null, h = i(() => {
-		if (!(!d && !m)) {
-			if (t.includes(f)) return l({
-				message: d,
-				type: "success"
-			});
-			if (e.includes(f)) {
-				if (m) return l({
-					message: m,
-					type: "danger"
+function o(o) {
+	let { closeAll: s } = n(), { showToast: c } = r();
+	i(() => {
+		let n = o?.closeModal, r = o?.message, i = o?.name, l = o?.cause?.data?.scrollTo, u = o?.cause?.fieldErrors ? Object.values(o?.cause?.fieldErrors)[0] : null;
+		if (n && s(), l && a.scrollTo(l, {
+			smooth: !0,
+			offset: 20
+		}), !(!r && !u)) {
+			if (t.includes(i)) {
+				c({
+					message: r,
+					type: "success"
 				});
-				if (d !== "Unprocessable entity") return l({
-					message: d,
+				return;
+			}
+			if (e.includes(i)) {
+				if (u) {
+					c({
+						message: u,
+						type: "danger"
+					});
+					return;
+				}
+				r !== "Unprocessable entity" && c({
+					message: r,
 					type: "danger"
 				});
 			}
 		}
 	}, [
-		d,
-		m,
-		f,
-		l
-	]);
-	a(() => {
-		u && c(), p && o.scrollTo(p, {
-			smooth: !0,
-			offset: 20
-		}), h();
-	}, [
-		u,
-		p,
-		h,
+		o,
+		s,
 		c
 	]);
 }
 //#endregion
-export { s as useAutomation };
+export { o as useAutomation };
 
 //# sourceMappingURL=useAutomation.js.map

package/dist/modules/hooks/useAutomation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAutomation.js","names":[],"sources":["../../../src/hooks/useAutomation.ts"],"sourcesContent":["import { useCallback, useEffect } from \"react\";\nimport { scroller } from \"react-scroll\";\nimport { badResponses } from \"../templates/badResponses\";\nimport { successResponses } from \"../templates/successResponses\";\nimport { useModal } from \"./useModal\";\nimport { useToast } from \"./useToast\";\n\n/**\n * useAutomation, runs UI side-effects (close modals, scroll, toast) in response to a server action payload.\n *\n * Pass the raw response from a form submission. On every change the hook:\n * 1. Closes all open modals if `closeModal` is `true`.\n * 2. Smooth-scrolls to a named element if `cause.data.scrollTo` is set.\n * 3. Shows a toast based on `name` (matched against `successResponses`/`badResponses`) and `message`.\n *    When `cause.fieldErrors` is present, the first field error takes priority in the toast.\n *    The message `\"Unprocessable entity\"` is intentionally suppressed.\n *\n * @param formResponseData - Raw server response payload.\n * @param formResponseData.closeModal - Closes all open modals when `true`.\n * @param formResponseData.name - Response identifier matched against success/bad response lists.\n * @param formResponseData.message - Text shown in the toast notification.\n * @param formResponseData.cause.data.scrollTo - Element name to scroll to via `react-scroll`.\n * @param formResponseData.cause.fieldErrors - Field-level errors; the first value is shown in the toast.\n *\n * @example\n * ```tsx\n * // After a successful create action\n * useAutomation({ closeModal: true, name: \"created\", message: \"Saved successfully\" });\n * ```\n *\n * @example\n * ```tsx\n * // Validation error with field-level feedback and scroll\n * useAutomation({\n *   name: \"validation_error\",\n *   message: \"Invalid payload\",\n *   cause: {\n *     data: { scrollTo: \"email\" },\n *     fieldErrors: { email: \"E-mail is required\" },\n *   },\n * });\n * ```\n */\n\n// biome-ignore lint/suspicious/noExplicitAny: intentional\nfunction useAutomation(formResponseData: any) {\n\tconst { closeAll } = useModal();\n\tconst { showToast } = useToast();\n\n\tconst closeModal = formResponseData?.closeModal;\n\tconst message = formResponseData?.message;\n\tconst name = formResponseData?.name;\n\tconst scrollTo = formResponseData?.cause?.data?.scrollTo;\n\tconst firstErrorField = formResponseData?.cause?.fieldErrors\n\t\t? (Object.values(formResponseData?.cause?.fieldErrors)[0] as string)\n\t\t: null;\n\n\tconst fireToast = useCallback(() => {\n\t\tif (!message && !firstErrorField) return;\n\n\t\tif (successResponses.includes(name))\n\t\t\treturn showToast({ message, type: \"success\" });\n\n\t\tif (!badResponses.includes(name)) return;\n\t\tif (firstErrorField)\n\t\t\treturn showToast({ message: firstErrorField, type: \"danger\" });\n\n\t\tif (message === \"Unprocessable entity\") return;\n\t\treturn showToast({ message, type: \"danger\" });\n\t}, [message, firstErrorField, name, showToast]);\n\n\tuseEffect(() => {\n\t\tif (closeModal) closeAll();\n\t\tif (scrollTo) scroller.scrollTo(scrollTo, { smooth: true, offset: 20 });\n\t\tfireToast();\n\t}, [closeModal, scrollTo, fireToast, closeAll]);\n}\n\nexport { useAutomation };\n"],"mappings":";;;;;;;AA6CA,SAAS,EAAc,GAAuB;CAC7C,IAAM,EAAE,gBAAa,EAAS,GACxB,EAAE,iBAAc,EAAS,GAEzB,IAAa,GAAkB,YAC/B,IAAU,GAAkB,SAC5B,IAAO,GAAkB,MACzB,IAAW,GAAkB,OAAO,MAAM,UAC1C,IAAkB,GAAkB,OAAO,cAC7C,OAAO,OAAO,GAAkB,OAAO,WAAW,CAAC,CAAC,KACrD,MAEG,IAAY,QAAkB;EAC/B,OAAC,KAAW,CAAC,IAEjB;OAAI,EAAiB,SAAS,CAAI,GACjC,OAAO,EAAU;IAAE;IAAS,MAAM;GAAU,CAAC;GAEzC,MAAa,SAAS,CAAI,GAC/B;QAAI,GACH,OAAO,EAAU;KAAE,SAAS;KAAiB,MAAM;IAAS,CAAC;IAE1D,UAAY,wBAChB,OAAO,EAAU;KAAE;KAAS,MAAM;IAAS,CAAC;GAHkB;EAJhB;CAQ/C,GAAG;EAAC;EAAS;EAAiB;EAAM;CAAS,CAAC;CAE9C,QAAgB;EAGf,AAFI,KAAY,EAAS,GACrB,KAAU,EAAS,SAAS,GAAU;GAAE,QAAQ;GAAM,QAAQ;EAAG,CAAC,GACtE,EAAU;CACX,GAAG;EAAC;EAAY;EAAU;EAAW;CAAQ,CAAC;AAC/C"}
+{"version":3,"file":"useAutomation.js","names":[],"sources":["../../../src/hooks/useAutomation.ts"],"sourcesContent":["import { useEffect } from \"react\";\nimport { scroller } from \"react-scroll\";\nimport { badResponses } from \"../templates/badResponses\";\nimport { successResponses } from \"../templates/successResponses\";\nimport { useModal } from \"./useModal\";\nimport { useToast } from \"./useToast\";\n\n/**\n * useAutomation, runs UI side-effects (close modals, scroll, toast) in response to a server action payload.\n *\n * Pass the raw response from a form submission. On every change the hook:\n * 1. Closes all open modals if `closeModal` is `true`.\n * 2. Smooth-scrolls to a named element if `cause.data.scrollTo` is set.\n * 3. Shows a toast based on `name` (matched against `successResponses`/`badResponses`) and `message`.\n *    When `cause.fieldErrors` is present, the first field error takes priority in the toast.\n *    The message `\"Unprocessable entity\"` is intentionally suppressed.\n *\n * @param formResponseData - Raw server response payload.\n * @param formResponseData.closeModal - Closes all open modals when `true`.\n * @param formResponseData.name - Response identifier matched against success/bad response lists.\n * @param formResponseData.message - Text shown in the toast notification.\n * @param formResponseData.cause.data.scrollTo - Element name to scroll to via `react-scroll`.\n * @param formResponseData.cause.fieldErrors - Field-level errors; the first value is shown in the toast.\n *\n * @example\n * ```tsx\n * // After a successful create action\n * useAutomation({ closeModal: true, name: \"created\", message: \"Saved successfully\" });\n * ```\n *\n * @example\n * ```tsx\n * // Validation error with field-level feedback and scroll\n * useAutomation({\n *   name: \"validation_error\",\n *   message: \"Invalid payload\",\n *   cause: {\n *     data: { scrollTo: \"email\" },\n *     fieldErrors: { email: \"E-mail is required\" },\n *   },\n * });\n * ```\n */\n\n// biome-ignore lint/suspicious/noExplicitAny: intentional\nfunction useAutomation(formResponseData: any) {\n\tconst { closeAll } = useModal();\n\tconst { showToast } = useToast();\n\n\tuseEffect(() => {\n\t\tconst closeModal = formResponseData?.closeModal;\n\t\tconst message = formResponseData?.message;\n\t\tconst name = formResponseData?.name;\n\t\tconst scrollTo = formResponseData?.cause?.data?.scrollTo;\n\t\tconst firstErrorField = formResponseData?.cause?.fieldErrors\n\t\t\t? (Object.values(formResponseData?.cause?.fieldErrors)[0] as string)\n\t\t\t: null;\n\n\t\tif (closeModal) closeAll();\n\t\tif (scrollTo) scroller.scrollTo(scrollTo, { smooth: true, offset: 20 });\n\n\t\tif (!message && !firstErrorField) return;\n\n\t\tif (successResponses.includes(name)) {\n\t\t\tshowToast({ message, type: \"success\" });\n\t\t\treturn;\n\t\t}\n\n\t\tif (!badResponses.includes(name)) return;\n\t\tif (firstErrorField) {\n\t\t\tshowToast({ message: firstErrorField, type: \"danger\" });\n\t\t\treturn;\n\t\t}\n\n\t\tif (message === \"Unprocessable entity\") return;\n\t\tshowToast({ message, type: \"danger\" });\n\t}, [formResponseData, closeAll, showToast]);\n}\n\nexport { useAutomation };\n"],"mappings":";;;;;;;AA6CA,SAAS,EAAc,GAAuB;CAC7C,IAAM,EAAE,gBAAa,EAAS,GACxB,EAAE,iBAAc,EAAS;CAE/B,QAAgB;EACf,IAAM,IAAa,GAAkB,YAC/B,IAAU,GAAkB,SAC5B,IAAO,GAAkB,MACzB,IAAW,GAAkB,OAAO,MAAM,UAC1C,IAAkB,GAAkB,OAAO,cAC7C,OAAO,OAAO,GAAkB,OAAO,WAAW,CAAC,CAAC,KACrD;EAEH,IAAI,KAAY,EAAS,GACrB,KAAU,EAAS,SAAS,GAAU;GAAE,QAAQ;GAAM,QAAQ;EAAG,CAAC,GAElE,GAAC,KAAW,CAAC,IAEjB;OAAI,EAAiB,SAAS,CAAI,GAAG;IACpC,EAAU;KAAE;KAAS,MAAM;IAAU,CAAC;IACtC;GACD;GAEK,MAAa,SAAS,CAAI,GAC/B;QAAI,GAAiB;KACpB,EAAU;MAAE,SAAS;MAAiB,MAAM;KAAS,CAAC;KACtD;IACD;IAEI,MAAY,0BAChB,EAAU;KAAE;KAAS,MAAM;IAAS,CAAC;GAHrC;EANA;CAUD,GAAG;EAAC;EAAkB;EAAU;CAAS,CAAC;AAC3C"}

package/dist/modules/utils/sanitizeTooltipHtml.js

@@ -0,0 +1,29 @@
+import { filterXSS as e } from "xss";
+//#region src/utils/sanitizeTooltipHtml.ts
+var t = Object.fromEntries([
+	"b",
+	"strong",
+	"i",
+	"em",
+	"u",
+	"br",
+	"span",
+	"small"
+].map((e) => [e, []]));
+function n(n) {
+	return e(n, {
+		whiteList: t,
+		stripIgnoreTagBody: [
+			"script",
+			"style",
+			"iframe",
+			"object",
+			"embed",
+			"noscript"
+		]
+	});
+}
+//#endregion
+export { n as sanitizeTooltipHtml };
+
+//# sourceMappingURL=sanitizeTooltipHtml.js.map

package/dist/modules/utils/sanitizeTooltipHtml.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sanitizeTooltipHtml.js","names":[],"sources":["../../../src/utils/sanitizeTooltipHtml.ts"],"sourcesContent":["import { filterXSS } from \"xss\";\n\nconst ALLOWED_TAGS = [\"b\", \"strong\", \"i\", \"em\", \"u\", \"br\", \"span\", \"small\"];\n\n// No attributes are allowed on any tag, which removes the need to\n// separately vet href/src/style values.\nconst WHITE_LIST = Object.fromEntries(ALLOWED_TAGS.map((tag) => [tag, []]));\n\n/**\n * sanitizeTooltipHtml, strips any markup outside a small inline-formatting\n * allowlist so `Tooltip`'s `text` prop can safely accept HTML from\n * consumers without executing scripts or attribute-based payloads\n * (`<script>`, `onerror`, `onclick`, `javascript:` URLs, etc.).\n *\n * Uses `xss` rather than `sanitize-html`: both are real, well-established\n * HTML sanitizers, but `sanitize-html` pulls in `postcss` (for `style`\n * attribute parsing) which assumes a Node `process` global and breaks when\n * this package is bundled for a real-browser test/runtime environment.\n * `xss` has no such dependency and explicitly supports running in a\n * browser.\n */\nfunction sanitizeTooltipHtml(text: string): string {\n\treturn filterXSS(text, {\n\t\twhiteList: WHITE_LIST,\n\t\tstripIgnoreTagBody: [\n\t\t\t\"script\",\n\t\t\t\"style\",\n\t\t\t\"iframe\",\n\t\t\t\"object\",\n\t\t\t\"embed\",\n\t\t\t\"noscript\",\n\t\t],\n\t});\n}\n\nexport { sanitizeTooltipHtml };\n"],"mappings":";;AAMA,IAAM,IAAa,OAAO,YAAY;CAJhB;CAAK;CAAU;CAAK;CAAM;CAAK;CAAM;CAAQ;AAI7B,CAAA,CAAa,KAAK,MAAQ,CAAC,GAAK,CAAC,CAAC,CAAC,CAAC;AAe1E,SAAS,EAAoB,GAAsB;CAClD,OAAO,EAAU,GAAM;EACtB,WAAW;EACX,oBAAoB;GACnB;GACA;GACA;GACA;GACA;GACA;EACD;CACD,CAAC;AACF"}

package/dist/utils/sanitizeTooltipHtml.d.ts

@@ -0,0 +1,16 @@
+/**
+ * sanitizeTooltipHtml, strips any markup outside a small inline-formatting
+ * allowlist so `Tooltip`'s `text` prop can safely accept HTML from
+ * consumers without executing scripts or attribute-based payloads
+ * (`<script>`, `onerror`, `onclick`, `javascript:` URLs, etc.).
+ *
+ * Uses `xss` rather than `sanitize-html`: both are real, well-established
+ * HTML sanitizers, but `sanitize-html` pulls in `postcss` (for `style`
+ * attribute parsing) which assumes a Node `process` global and breaks when
+ * this package is bundled for a real-browser test/runtime environment.
+ * `xss` has no such dependency and explicitly supports running in a
+ * browser.
+ */
+declare function sanitizeTooltipHtml(text: string): string;
+export { sanitizeTooltipHtml };
+//# sourceMappingURL=sanitizeTooltipHtml.d.ts.map

package/dist/utils/sanitizeTooltipHtml.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sanitizeTooltipHtml.d.ts","sourceRoot":"","sources":["../../src/utils/sanitizeTooltipHtml.ts"],"names":[],"mappings":"AAQA;;;;;;;;;;;;GAYG;AACH,iBAAS,mBAAmB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAYjD;AAED,OAAO,EAAE,mBAAmB,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arkyn/components",
-  "version": "3.0.10",
+  "version": "3.0.12",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -61,7 +61,8 @@
   ],
   "dependencies": {
     "@arkyn/shared": "^3.0.2",
-    "@arkyn/templates": "^3.0.2"
+    "@arkyn/templates": "^3.0.2",
+    "xss": "^1.0.15"
   },
   "peerDependencies": {
     "@react-google-maps/api": ">=2.0.0",