@plumile/ui 0.1.68 → 0.1.69

package/lib/esm/atomic/molecules/dropdown/Dropdown.js

@@ -1,149 +1,149 @@
 import { cx as e } from "../../../theme/tools.js";
 import { container as t, content as n, contentPositioned as r } from "./dropdown.css.js";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import { cloneElement as o, createContext as s, isValidElement as c, useCallback as l, useContext as u, useEffect as d, useLayoutEffect as f, useRef as p, useState as m } from "react";
-import { createPortal as h } from "react-dom";
+import { cloneElement as i, createContext as a, isValidElement as o, useCallback as s, useContext as c, useEffect as l, useLayoutEffect as u, useRef as d, useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { createPortal as ee } from "react-dom";
 //#region src/atomic/molecules/dropdown/Dropdown.tsx
-var g = s(null), _ = () => {
-	let e = u(g);
+var h = a(null), g = () => {
+	let e = c(h);
 	if (e == null) throw Error("useDropdown must be used within a <Dropdown />");
 	return e;
-}, v = (e) => typeof e != "object" || !e ? !1 : e.$$typeof === Symbol.for("react.forward_ref"), y = ({ trigger: s, children: u, className: _, contentClassName: y, placement: b = "bottom-start", offset: x = 4, matchTriggerWidth: S = !0, open: C, defaultOpen: w = !1, onOpenChange: T, closeOnItemClick: E = !1, portalContainer: D, ariaLabel: O }) => {
-	let k = C != null, [A, j] = m(w), M = A;
-	k && (M = !!C);
-	let N = p(null), P = p(null), F = p(null), [I, L] = m(null), R = p([]), z = l((e) => {
-		k || j(e), T?.(e);
-	}, [k, T]), B = l(() => {
-		z(!M);
-	}, [M, z]), V = l(() => {
-		z(!1);
-	}, [z]), ee = l(() => {
-		z(!0);
-	}, [z]), H = l(() => {
-		let e = P.current, t = F.current;
+}, _ = (e) => typeof e != "object" || !e ? !1 : e.$$typeof === Symbol.for("react.forward_ref"), v = ({ trigger: a, children: c, className: g, contentClassName: v, placement: y = "bottom-start", offset: b = 4, matchTriggerWidth: x = !0, open: S, defaultOpen: C = !1, onOpenChange: w, closeOnItemClick: T = !1, portalContainer: E, ariaLabel: D }) => {
+	let O = S != null, [k, A] = f(C), j = k;
+	O && (j = !!S);
+	let M = d(null), N = d(null), P = d(null), [F, I] = f(null), L = d([]), R = s((e) => {
+		O || A(e), w?.(e);
+	}, [O, w]), z = s(() => {
+		R(!j);
+	}, [j, R]), B = s(() => {
+		R(!1);
+	}, [R]), V = s(() => {
+		R(!0);
+	}, [R]), H = s(() => {
+		let e = N.current, t = P.current;
 		if (e == null || t == null) return;
 		let n = e.getBoundingClientRect(), r = 0, i = 0;
-		switch (b) {
+		switch (y) {
 			case "bottom-start":
-				r = n.bottom + x, i = n.left;
+				r = n.bottom + b, i = n.left;
 				break;
 			case "bottom-end":
-				r = n.bottom + x, i = n.right - t.offsetWidth;
+				r = n.bottom + b, i = n.right - t.offsetWidth;
 				break;
 			case "top-start":
-				r = n.top - t.offsetHeight - x, i = n.left;
+				r = n.top - t.offsetHeight - b, i = n.left;
 				break;
 			case "top-end":
-				r = n.top - t.offsetHeight - x, i = n.right - t.offsetWidth;
+				r = n.top - t.offsetHeight - b, i = n.right - t.offsetWidth;
 				break;
-			default: r = n.bottom + x, i = n.left;
+			default: r = n.bottom + b, i = n.left;
 		}
 		let a = window.innerWidth, o = window.innerHeight, s;
-		S && (s = n.width);
+		x && (s = n.width);
 		let c = s ?? t.offsetWidth;
 		i + c > a - 4 && (i = Math.max(4, a - c - 4)), i < 4 && (i = 4);
 		let l = t.offsetHeight;
-		if (r + l > o - 4) if (b.startsWith("bottom")) {
-			let e = n.top - l - x;
+		if (r + l > o - 4) if (y.startsWith("bottom")) {
+			let e = n.top - l - b;
 			r = e >= 4 ? e : Math.max(4, o - l - 4);
 		} else r = Math.max(4, o - l - 4);
-		r < 4 && (r = 4), L({
+		r < 4 && (r = 4), I({
 			top: r,
 			left: i,
 			width: s
 		});
 	}, [
+		y,
 		b,
-		x,
-		S
+		x
 	]);
-	f(() => {
-		M && H();
+	u(() => {
+		j && H();
 	}, [
-		M,
+		j,
 		H,
-		u
-	]), d(() => {
-		if (!M) return;
+		c
+	]), l(() => {
+		if (!j) return;
 		let e = () => {
 			H();
 		};
-		window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), R.current.push(() => {
+		window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), L.current.push(() => {
 			window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
 		});
-	}, [M, H]), d(() => {
-		if (!M) return;
+	}, [j, H]), l(() => {
+		if (!j) return;
 		let e = (e) => {
 			let t = e.target;
-			N.current != null && F.current != null && !N.current.contains(t) && !F.current.contains(t) && V();
+			M.current != null && P.current != null && !M.current.contains(t) && !P.current.contains(t) && B();
 		}, t = (e) => {
-			e.key === "Escape" && (V(), P.current?.focus());
+			e.key === "Escape" && (B(), N.current?.focus());
 		};
-		document.addEventListener("mousedown", e), document.addEventListener("keydown", t), R.current.push(() => {
+		document.addEventListener("mousedown", e), document.addEventListener("keydown", t), L.current.push(() => {
 			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
 		});
-	}, [M, V]), d(() => {
-		M && (F.current?.querySelector("button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])"))?.focus();
-	}, [M]), d(() => {
-		if (!M || !E) return;
+	}, [j, B]), l(() => {
+		j && (P.current?.querySelector("button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])"))?.focus();
+	}, [j]), l(() => {
+		if (!j || !T) return;
 		let e = (e) => {
-			F.current?.contains(e.target) && V();
+			P.current?.contains(e.target) && B();
 		};
-		document.addEventListener("click", e, { capture: !0 }), R.current.push(() => {
+		document.addEventListener("click", e, { capture: !0 }), L.current.push(() => {
 			document.removeEventListener("click", e, { capture: !0 });
 		});
 	}, [
-		M,
-		E,
-		V
-	]), d(() => () => {
-		R.current.forEach((e) => {
+		j,
+		T,
+		B
+	]), l(() => () => {
+		L.current.forEach((e) => {
 			e();
-		}), R.current = [];
+		}), L.current = [];
 	}, []);
-	let U = s;
-	if (typeof s == "function" && (U = s(M)), !c(U)) throw Error("Dropdown trigger must be a React element.");
+	let U = a;
+	if (typeof a == "function" && (U = a(j)), !o(U)) throw Error("Dropdown trigger must be a React element.");
 	let W = typeof U.type == "string", G = W && U.type === "button";
-	if (!(W || typeof U.type == "function" || v(U.type))) throw Error("Dropdown trigger must be a DOM element or component that accepts a ref.");
+	if (!(W || typeof U.type == "function" || _(U.type))) throw Error("Dropdown trigger must be a DOM element or component that accepts a ref.");
 	let K = U.props.ref ?? U.ref, q = (e) => {
-		P.current = e, typeof K == "function" ? K(e) : K != null && (K.current = e);
+		N.current = e, typeof K == "function" ? K(e) : K != null && (K.current = e);
 	}, J = U.props, Y = (e) => {
-		J.onClick?.(e), !e.defaultPrevented && B();
+		J.onClick?.(e), !e.defaultPrevented && z();
 	}, X = (e) => {
-		J.onKeyDown?.(e), !e.defaultPrevented && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), B());
+		J.onKeyDown?.(e), !e.defaultPrevented && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), z());
 	}, Z = {
 		onClick: Y,
 		"aria-haspopup": "menu",
-		"aria-expanded": M
+		"aria-expanded": j
 	};
-	O != null && O !== "" && (Z["aria-label"] = O), G ? J.type ?? (Z.type = "button") : (Z.onKeyDown = X, J.role ?? (Z.role = "button"), J.tabIndex ?? (Z.tabIndex = 0)), Z.ref = q;
+	D != null && D !== "" && (Z["aria-label"] = D), G ? J.type ?? (Z.type = "button") : (Z.onKeyDown = X, J.role ?? (Z.role = "button"), J.tabIndex ?? (Z.tabIndex = 0)), Z.ref = q;
 	let Q = {};
-	I != null && (Q = {
-		top: I.top,
-		left: I.left,
-		width: I.width
+	F != null && (Q = {
+		top: F.top,
+		left: F.left,
+		width: F.width
 	});
-	let te = D ?? document.body, ne = {
-		close: V,
-		open: ee,
-		isOpen: M
+	let te = E ?? document.body, ne = {
+		close: B,
+		open: V,
+		isOpen: j
 	}, $ = null;
-	return M && ($ = h(/* @__PURE__ */ i("div", {
-		ref: F,
+	return j && ($ = ee(/* @__PURE__ */ p("div", {
+		ref: P,
 		role: "menu",
-		className: e(n, r, y),
+		className: e(n, r, v),
 		style: Q,
-		children: u
-	}), te)), /* @__PURE__ */ a(g.Provider, {
+		children: c
+	}), te)), /* @__PURE__ */ m(h.Provider, {
 		value: ne,
-		children: [/* @__PURE__ */ i("div", {
-			className: e(t, _),
-			ref: N,
-			children: o(U, Z)
+		children: [/* @__PURE__ */ p("div", {
+			className: e(t, g),
+			ref: M,
+			children: i(U, Z)
 		}), $]
 	});
 };
 //#endregion
-export { y as Dropdown, _ as useDropdown };
+export { v as Dropdown, g as useDropdown };
 
 //# sourceMappingURL=Dropdown.js.map

package/lib/esm/atomic/molecules/dropdown/Dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.js","names":[],"sources":["../../../../../src/atomic/molecules/dropdown/Dropdown.tsx"],"sourcesContent":["import {\n  useState,\n  useRef,\n  useEffect,\n  useLayoutEffect,\n  useCallback,\n  type ReactNode,\n  type ReactElement,\n  type JSX,\n  type Ref,\n  type MutableRefObject,\n  type HTMLAttributes,\n  type MouseEvent as ReactMouseEvent,\n  type KeyboardEvent as ReactKeyboardEvent,\n  createContext,\n  useContext,\n  isValidElement,\n  cloneElement,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport * as classes from './dropdown.css.js';\nimport { cx } from '../../../theme/tools.js';\n\n// Types\nexport type DropdownPlacement =\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'top-start'\n  | 'top-end';\n\ninterface DropdownContextValue {\n  close: () => void;\n  open: () => void;\n  isOpen: boolean;\n}\n\nconst DropdownContext = createContext<DropdownContextValue | null>(null);\n/**\n * Access the nearest Dropdown context. Throws if used outside a <Dropdown />.\n */\nexport const useDropdown = (): DropdownContextValue => {\n  const ctx = useContext(DropdownContext);\n  if (ctx == null) {\n    throw new Error('useDropdown must be used within a <Dropdown />');\n  }\n  return ctx;\n};\n\nexport interface DropdownProps {\n  trigger: ReactElement | ((isOpen: boolean) => ReactElement);\n  children: ReactNode;\n  className?: string;\n  contentClassName?: string;\n  placement?: DropdownPlacement;\n  offset?: number;\n  matchTriggerWidth?: boolean;\n  open?: boolean; // controlled\n  defaultOpen?: boolean; // uncontrolled\n  onOpenChange?: (open: boolean) => void;\n  closeOnItemClick?: boolean;\n  portalContainer?: HTMLElement | null;\n  // Accessible label if trigger is an icon only\n  ariaLabel?: string;\n}\n\ninterface PositionState {\n  top: number;\n  left: number;\n  width?: number;\n}\n\nconst isForwardRefComponent = (type: unknown): boolean => {\n  if (type == null || typeof type !== 'object') {\n    return false;\n  }\n  return (\n    (type as { $$typeof?: symbol }).$$typeof === Symbol.for('react.forward_ref')\n  );\n};\n\n/**\n * A scalable, portal-based dropdown component with basic collision handling,\n * controlled/uncontrolled modes, accessibility attributes, and optional\n * trigger width matching. Content is rendered in a React portal (default: document.body).\n */\nexport const Dropdown = ({\n  trigger,\n  children,\n  className,\n  contentClassName,\n  placement = 'bottom-start',\n  offset = 4,\n  matchTriggerWidth = true,\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  closeOnItemClick = false,\n  portalContainer,\n  ariaLabel,\n}: DropdownProps): JSX.Element => {\n  const isControlled = open != null;\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n  let isOpen = uncontrolledOpen;\n  if (isControlled) {\n    isOpen = Boolean(open);\n  }\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [position, setPosition] = useState<PositionState | null>(null);\n  // Accumulate manual cleanups for effects where returning a function violates lint rules.\n  const cleanupRef = useRef<(() => void)[]>([]);\n\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (!isControlled) {\n        setUncontrolledOpen(next);\n      }\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  const toggle = useCallback(() => {\n    setOpen(!isOpen);\n  }, [isOpen, setOpen]);\n  const close = useCallback(() => {\n    setOpen(false);\n  }, [setOpen]);\n  const openFn = useCallback(() => {\n    setOpen(true);\n  }, [setOpen]);\n\n  // Positioning logic\n  const computePosition = useCallback(() => {\n    const triggerEl = triggerRef.current;\n    const contentEl = contentRef.current;\n    if (triggerEl == null) {\n      return;\n    }\n    if (contentEl == null) {\n      return;\n    }\n\n    const rect = triggerEl.getBoundingClientRect();\n    let top = 0;\n    let left = 0;\n\n    switch (placement) {\n      case 'bottom-start':\n        top = rect.bottom + offset;\n        left = rect.left;\n        break;\n      case 'bottom-end':\n        top = rect.bottom + offset;\n        left = rect.right - contentEl.offsetWidth;\n        break;\n      case 'top-start':\n        top = rect.top - contentEl.offsetHeight - offset;\n        left = rect.left;\n        break;\n      case 'top-end':\n        top = rect.top - contentEl.offsetHeight - offset;\n        left = rect.right - contentEl.offsetWidth;\n        break;\n      default:\n        top = rect.bottom + offset;\n        left = rect.left;\n    }\n\n    // Keep within viewport (basic collision handling)\n    const vw = window.innerWidth;\n    const vh = window.innerHeight;\n    let width: number | undefined;\n    if (matchTriggerWidth) {\n      width = rect.width;\n    }\n    const contentWidth = width ?? contentEl.offsetWidth;\n\n    if (left + contentWidth > vw - 4) {\n      left = Math.max(4, vw - contentWidth - 4);\n    }\n    if (left < 4) left = 4;\n    const contentHeight = contentEl.offsetHeight;\n    if (top + contentHeight > vh - 4) {\n      // Try flip to top if bottom overflows and initial was bottom\n      if (placement.startsWith('bottom')) {\n        const flippedTop = rect.top - contentHeight - offset;\n        if (flippedTop >= 4) {\n          top = flippedTop;\n        } else {\n          top = Math.max(4, vh - contentHeight - 4);\n        }\n      } else {\n        top = Math.max(4, vh - contentHeight - 4);\n      }\n    }\n    if (top < 4) top = 4;\n\n    setPosition({ top, left, width });\n  }, [placement, offset, matchTriggerWidth]);\n\n  useLayoutEffect(() => {\n    if (isOpen) computePosition();\n  }, [isOpen, computePosition, children]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n    const handle = () => {\n      computePosition();\n    };\n    window.addEventListener('resize', handle);\n    window.addEventListener('scroll', handle, true);\n    const cleanup = () => {\n      window.removeEventListener('resize', handle);\n      window.removeEventListener('scroll', handle, true);\n    };\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, computePosition]);\n\n  // Outside click & Escape\n  useEffect(() => {\n    if (!isOpen) return;\n    const onDocMouseDown = (e: globalThis.MouseEvent) => {\n      const target = e.target as Node;\n      if (\n        containerRef.current != null &&\n        contentRef.current != null &&\n        !containerRef.current.contains(target) &&\n        !contentRef.current.contains(target)\n      ) {\n        close();\n      }\n    };\n    const onKey = (e: globalThis.KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        close();\n        triggerRef.current?.focus();\n      }\n    };\n    document.addEventListener('mousedown', onDocMouseDown);\n    document.addEventListener('keydown', onKey);\n    const cleanup = () => {\n      document.removeEventListener('mousedown', onDocMouseDown);\n      document.removeEventListener('keydown', onKey);\n    };\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, close]);\n\n  // Keyboard navigation basic (ArrowDown focuses first focusable)\n  useEffect(() => {\n    if (!isOpen) return;\n    const firstFocusable = contentRef.current?.querySelector<HTMLElement>(\n      'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n    );\n    firstFocusable?.focus();\n  }, [isOpen]);\n\n  // Close on item click if enabled\n  useEffect(() => {\n    if (!isOpen || !closeOnItemClick) return;\n    const handler = (e: globalThis.MouseEvent) => {\n      if (contentRef.current?.contains(e.target as Node)) {\n        close();\n      }\n    };\n    document.addEventListener('click', handler, { capture: true });\n    // Explicit cleanup without returning (lint rule forbids returning arrow fn)\n    const cleanup = () => {\n      document.removeEventListener('click', handler, { capture: true });\n    };\n    // Store in ref to run on unmount / dependency change\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, closeOnItemClick, close]);\n  // Run accumulated cleanups on unmount\n  useEffect(() => {\n    return () => {\n      cleanupRef.current.forEach((fn) => {\n        fn();\n      });\n      cleanupRef.current = [];\n    };\n  }, []);\n\n  let triggerElement = trigger;\n  if (typeof trigger === 'function') {\n    triggerElement = trigger(isOpen);\n  }\n\n  if (!isValidElement(triggerElement)) {\n    throw new Error('Dropdown trigger must be a React element.');\n  }\n\n  const isHostElement = typeof triggerElement.type === 'string';\n  const isButtonElement = isHostElement && triggerElement.type === 'button';\n  const canAttachRef =\n    isHostElement ||\n    typeof triggerElement.type === 'function' ||\n    isForwardRefComponent(triggerElement.type);\n\n  if (!canAttachRef) {\n    throw new Error(\n      'Dropdown trigger must be a DOM element or component that accepts a ref.',\n    );\n  }\n\n  const triggerElementRef =\n    (triggerElement.props as { ref?: Ref<HTMLElement> }).ref ??\n    (triggerElement as ReactElement & { ref?: Ref<HTMLElement> }).ref;\n  const setTriggerRef = (node: HTMLElement | null) => {\n    triggerRef.current = node;\n    if (typeof triggerElementRef === 'function') {\n      triggerElementRef(node);\n    } else if (triggerElementRef != null) {\n      (triggerElementRef as MutableRefObject<HTMLElement | null>).current =\n        node;\n    }\n  };\n\n  const triggerProps = triggerElement.props as HTMLAttributes<HTMLElement> & {\n    type?: string;\n  };\n\n  const handleTriggerClick = (event: ReactMouseEvent<HTMLElement>) => {\n    triggerProps.onClick?.(event);\n    if (event.defaultPrevented) {\n      return;\n    }\n    toggle();\n  };\n\n  const handleTriggerKeyDown = (event: ReactKeyboardEvent<HTMLElement>) => {\n    triggerProps.onKeyDown?.(event);\n    if (event.defaultPrevented) {\n      return;\n    }\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      toggle();\n    }\n  };\n\n  const mergedTriggerProps: Record<string, unknown> = {\n    onClick: handleTriggerClick,\n    'aria-haspopup': 'menu',\n    'aria-expanded': isOpen,\n  };\n\n  if (ariaLabel != null && ariaLabel !== '') {\n    mergedTriggerProps['aria-label'] = ariaLabel;\n  }\n\n  if (isButtonElement) {\n    if (triggerProps.type == null) {\n      mergedTriggerProps.type = 'button';\n    }\n  } else {\n    mergedTriggerProps.onKeyDown = handleTriggerKeyDown;\n    if (triggerProps.role == null) {\n      mergedTriggerProps.role = 'button';\n    }\n    if (triggerProps.tabIndex == null) {\n      mergedTriggerProps.tabIndex = 0;\n    }\n  }\n\n  mergedTriggerProps.ref = setTriggerRef;\n\n  let contentStyles: React.CSSProperties = {};\n  if (position != null) {\n    contentStyles = {\n      top: position.top,\n      left: position.left,\n      width: position.width,\n    };\n  }\n\n  const portalTarget = portalContainer ?? document.body;\n\n  const contextValue: DropdownContextValue = {\n    close,\n    open: openFn,\n    isOpen,\n  };\n\n  let dropdownContent: JSX.Element | null = null;\n  if (isOpen) {\n    dropdownContent = createPortal(\n      <div\n        ref={contentRef}\n        role=\"menu\"\n        className={cx(\n          classes.content,\n          classes.contentPositioned,\n          contentClassName,\n        )}\n        style={contentStyles}\n      >\n        {children}\n      </div>,\n      portalTarget,\n    );\n  }\n\n  return (\n    <DropdownContext.Provider value={contextValue}>\n      <div className={cx(classes.container, className)} ref={containerRef}>\n        {cloneElement(triggerElement, mergedTriggerProps)}\n      </div>\n      {dropdownContent}\n    </DropdownContext.Provider>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Dropdown.js","names":[],"sources":["../../../../../src/atomic/molecules/dropdown/Dropdown.tsx"],"sourcesContent":["import {\n  useState,\n  useRef,\n  useEffect,\n  useLayoutEffect,\n  useCallback,\n  type ReactNode,\n  type ReactElement,\n  type JSX,\n  type Ref,\n  type MutableRefObject,\n  type HTMLAttributes,\n  type MouseEvent as ReactMouseEvent,\n  type KeyboardEvent as ReactKeyboardEvent,\n  createContext,\n  useContext,\n  isValidElement,\n  cloneElement,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport * as classes from './dropdown.css.js';\nimport { cx } from '../../../theme/tools.js';\n\n// Types\nexport type DropdownPlacement =\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'top-start'\n  | 'top-end';\n\ninterface DropdownContextValue {\n  close: () => void;\n  open: () => void;\n  isOpen: boolean;\n}\n\nconst DropdownContext = createContext<DropdownContextValue | null>(null);\n/**\n * Access the nearest Dropdown context. Throws if used outside a <Dropdown />.\n */\nexport const useDropdown = (): DropdownContextValue => {\n  const ctx = useContext(DropdownContext);\n  if (ctx == null) {\n    throw new Error('useDropdown must be used within a <Dropdown />');\n  }\n  return ctx;\n};\n\nexport interface DropdownProps {\n  trigger: ReactElement | ((isOpen: boolean) => ReactElement);\n  children: ReactNode;\n  className?: string;\n  contentClassName?: string;\n  placement?: DropdownPlacement;\n  offset?: number;\n  matchTriggerWidth?: boolean;\n  open?: boolean; // controlled\n  defaultOpen?: boolean; // uncontrolled\n  onOpenChange?: (open: boolean) => void;\n  closeOnItemClick?: boolean;\n  portalContainer?: HTMLElement | null;\n  // Accessible label if trigger is an icon only\n  ariaLabel?: string;\n}\n\ninterface PositionState {\n  top: number;\n  left: number;\n  width?: number;\n}\n\nconst isForwardRefComponent = (type: unknown): boolean => {\n  if (type == null || typeof type !== 'object') {\n    return false;\n  }\n  return (\n    (type as { $$typeof?: symbol }).$$typeof === Symbol.for('react.forward_ref')\n  );\n};\n\n/**\n * A scalable, portal-based dropdown component with basic collision handling,\n * controlled/uncontrolled modes, accessibility attributes, and optional\n * trigger width matching. Content is rendered in a React portal (default: document.body).\n */\nexport const Dropdown = ({\n  trigger,\n  children,\n  className,\n  contentClassName,\n  placement = 'bottom-start',\n  offset = 4,\n  matchTriggerWidth = true,\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  closeOnItemClick = false,\n  portalContainer,\n  ariaLabel,\n}: DropdownProps): JSX.Element => {\n  const isControlled = open != null;\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n  let isOpen = uncontrolledOpen;\n  if (isControlled) {\n    isOpen = Boolean(open);\n  }\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [position, setPosition] = useState<PositionState | null>(null);\n  // Accumulate manual cleanups for effects where returning a function violates lint rules.\n  const cleanupRef = useRef<(() => void)[]>([]);\n\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (!isControlled) {\n        setUncontrolledOpen(next);\n      }\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  const toggle = useCallback(() => {\n    setOpen(!isOpen);\n  }, [isOpen, setOpen]);\n  const close = useCallback(() => {\n    setOpen(false);\n  }, [setOpen]);\n  const openFn = useCallback(() => {\n    setOpen(true);\n  }, [setOpen]);\n\n  // Positioning logic\n  const computePosition = useCallback(() => {\n    const triggerEl = triggerRef.current;\n    const contentEl = contentRef.current;\n    if (triggerEl == null) {\n      return;\n    }\n    if (contentEl == null) {\n      return;\n    }\n\n    const rect = triggerEl.getBoundingClientRect();\n    let top = 0;\n    let left = 0;\n\n    switch (placement) {\n      case 'bottom-start':\n        top = rect.bottom + offset;\n        left = rect.left;\n        break;\n      case 'bottom-end':\n        top = rect.bottom + offset;\n        left = rect.right - contentEl.offsetWidth;\n        break;\n      case 'top-start':\n        top = rect.top - contentEl.offsetHeight - offset;\n        left = rect.left;\n        break;\n      case 'top-end':\n        top = rect.top - contentEl.offsetHeight - offset;\n        left = rect.right - contentEl.offsetWidth;\n        break;\n      default:\n        top = rect.bottom + offset;\n        left = rect.left;\n    }\n\n    // Keep within viewport (basic collision handling)\n    const vw = window.innerWidth;\n    const vh = window.innerHeight;\n    let width: number | undefined;\n    if (matchTriggerWidth) {\n      width = rect.width;\n    }\n    const contentWidth = width ?? contentEl.offsetWidth;\n\n    if (left + contentWidth > vw - 4) {\n      left = Math.max(4, vw - contentWidth - 4);\n    }\n    if (left < 4) left = 4;\n    const contentHeight = contentEl.offsetHeight;\n    if (top + contentHeight > vh - 4) {\n      // Try flip to top if bottom overflows and initial was bottom\n      if (placement.startsWith('bottom')) {\n        const flippedTop = rect.top - contentHeight - offset;\n        if (flippedTop >= 4) {\n          top = flippedTop;\n        } else {\n          top = Math.max(4, vh - contentHeight - 4);\n        }\n      } else {\n        top = Math.max(4, vh - contentHeight - 4);\n      }\n    }\n    if (top < 4) top = 4;\n\n    setPosition({ top, left, width });\n  }, [placement, offset, matchTriggerWidth]);\n\n  useLayoutEffect(() => {\n    if (isOpen) computePosition();\n  }, [isOpen, computePosition, children]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n    const handle = () => {\n      computePosition();\n    };\n    window.addEventListener('resize', handle);\n    window.addEventListener('scroll', handle, true);\n    const cleanup = () => {\n      window.removeEventListener('resize', handle);\n      window.removeEventListener('scroll', handle, true);\n    };\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, computePosition]);\n\n  // Outside click & Escape\n  useEffect(() => {\n    if (!isOpen) return;\n    const onDocMouseDown = (e: globalThis.MouseEvent) => {\n      const target = e.target as Node;\n      if (\n        containerRef.current != null &&\n        contentRef.current != null &&\n        !containerRef.current.contains(target) &&\n        !contentRef.current.contains(target)\n      ) {\n        close();\n      }\n    };\n    const onKey = (e: globalThis.KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        close();\n        triggerRef.current?.focus();\n      }\n    };\n    document.addEventListener('mousedown', onDocMouseDown);\n    document.addEventListener('keydown', onKey);\n    const cleanup = () => {\n      document.removeEventListener('mousedown', onDocMouseDown);\n      document.removeEventListener('keydown', onKey);\n    };\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, close]);\n\n  // Keyboard navigation basic (ArrowDown focuses first focusable)\n  useEffect(() => {\n    if (!isOpen) return;\n    const firstFocusable = contentRef.current?.querySelector<HTMLElement>(\n      'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n    );\n    firstFocusable?.focus();\n  }, [isOpen]);\n\n  // Close on item click if enabled\n  useEffect(() => {\n    if (!isOpen || !closeOnItemClick) return;\n    const handler = (e: globalThis.MouseEvent) => {\n      if (contentRef.current?.contains(e.target as Node)) {\n        close();\n      }\n    };\n    document.addEventListener('click', handler, { capture: true });\n    // Explicit cleanup without returning (lint rule forbids returning arrow fn)\n    const cleanup = () => {\n      document.removeEventListener('click', handler, { capture: true });\n    };\n    // Store in ref to run on unmount / dependency change\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, closeOnItemClick, close]);\n  // Run accumulated cleanups on unmount\n  useEffect(() => {\n    return () => {\n      cleanupRef.current.forEach((fn) => {\n        fn();\n      });\n      cleanupRef.current = [];\n    };\n  }, []);\n\n  let triggerElement = trigger;\n  if (typeof trigger === 'function') {\n    triggerElement = trigger(isOpen);\n  }\n\n  if (!isValidElement(triggerElement)) {\n    throw new Error('Dropdown trigger must be a React element.');\n  }\n\n  const isHostElement = typeof triggerElement.type === 'string';\n  const isButtonElement = isHostElement && triggerElement.type === 'button';\n  const canAttachRef =\n    isHostElement ||\n    typeof triggerElement.type === 'function' ||\n    isForwardRefComponent(triggerElement.type);\n\n  if (!canAttachRef) {\n    throw new Error(\n      'Dropdown trigger must be a DOM element or component that accepts a ref.',\n    );\n  }\n\n  const triggerElementRef =\n    (triggerElement.props as { ref?: Ref<HTMLElement> }).ref ??\n    (triggerElement as ReactElement & { ref?: Ref<HTMLElement> }).ref;\n  const setTriggerRef = (node: HTMLElement | null) => {\n    triggerRef.current = node;\n    if (typeof triggerElementRef === 'function') {\n      triggerElementRef(node);\n    } else if (triggerElementRef != null) {\n      (triggerElementRef as MutableRefObject<HTMLElement | null>).current =\n        node;\n    }\n  };\n\n  const triggerProps = triggerElement.props as HTMLAttributes<HTMLElement> & {\n    type?: string;\n  };\n\n  const handleTriggerClick = (event: ReactMouseEvent<HTMLElement>) => {\n    triggerProps.onClick?.(event);\n    if (event.defaultPrevented) {\n      return;\n    }\n    toggle();\n  };\n\n  const handleTriggerKeyDown = (event: ReactKeyboardEvent<HTMLElement>) => {\n    triggerProps.onKeyDown?.(event);\n    if (event.defaultPrevented) {\n      return;\n    }\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      toggle();\n    }\n  };\n\n  const mergedTriggerProps: Record<string, unknown> = {\n    onClick: handleTriggerClick,\n    'aria-haspopup': 'menu',\n    'aria-expanded': isOpen,\n  };\n\n  if (ariaLabel != null && ariaLabel !== '') {\n    mergedTriggerProps['aria-label'] = ariaLabel;\n  }\n\n  if (isButtonElement) {\n    if (triggerProps.type == null) {\n      mergedTriggerProps.type = 'button';\n    }\n  } else {\n    mergedTriggerProps.onKeyDown = handleTriggerKeyDown;\n    if (triggerProps.role == null) {\n      mergedTriggerProps.role = 'button';\n    }\n    if (triggerProps.tabIndex == null) {\n      mergedTriggerProps.tabIndex = 0;\n    }\n  }\n\n  mergedTriggerProps.ref = setTriggerRef;\n\n  let contentStyles: React.CSSProperties = {};\n  if (position != null) {\n    contentStyles = {\n      top: position.top,\n      left: position.left,\n      width: position.width,\n    };\n  }\n\n  const portalTarget = portalContainer ?? document.body;\n\n  const contextValue: DropdownContextValue = {\n    close,\n    open: openFn,\n    isOpen,\n  };\n\n  let dropdownContent: JSX.Element | null = null;\n  if (isOpen) {\n    dropdownContent = createPortal(\n      <div\n        ref={contentRef}\n        role=\"menu\"\n        className={cx(\n          classes.content,\n          classes.contentPositioned,\n          contentClassName,\n        )}\n        style={contentStyles}\n      >\n        {children}\n      </div>,\n      portalTarget,\n    );\n  }\n\n  return (\n    <DropdownContext.Provider value={contextValue}>\n      <div className={cx(classes.container, className)} ref={containerRef}>\n        {cloneElement(triggerElement, mergedTriggerProps)}\n      </div>\n      {dropdownContent}\n    </DropdownContext.Provider>\n  );\n};\n"],"mappings":"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"}

package/lib/esm/atomic/molecules/form/Form.js

@@ -1,7 +1,7 @@
 import { cx as e } from "../../../theme/tools.js";
 import { form as t } from "./formStyles.css.js";
-import { jsx as n } from "react/jsx-runtime";
 import "react";
+import { jsx as n } from "react/jsx-runtime";
 //#region src/atomic/molecules/form/Form.tsx
 var r = (r) => {
 	let { onSubmit: i, className: a, children: o, ref: s, ...c } = r;

package/lib/esm/atomic/molecules/form_error/FormError.js

@@ -1,7 +1,7 @@
 import { FormErrorAlertSvg as e } from "../../../icons/FormErrorAlertSvg.js";
 import { formError as t, icon as n, message as r } from "./formError.css.js";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
 import "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/atomic/molecules/form_error/FormError.tsx
 var o = ({ children: o, ...s }) => o == null ? null : /* @__PURE__ */ a("div", {
 	className: t,

package/lib/esm/atomic/molecules/highlight/HighlightCode.js

@@ -1,39 +1,39 @@
 import { cx as e } from "../../../theme/tools.js";
-import { badge as t, container as n, content as r, fallbackCode as i, placeholder as a, shikiPre as o, shikiWrapper as s, toolbar as c } from "./HighlightCode.css.js";
-import { MarkdownCodeCopyButton as l } from "../markdown/components/MarkdownCodeCopyButton.js";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
-import { cloneElement as f, isValidElement as p } from "react";
+import { MarkdownCodeCopyButton as t } from "../markdown/components/MarkdownCodeCopyButton.js";
+import { badge as n, container as r, content as i, fallbackCode as a, placeholder as o, shikiPre as s, shikiWrapper as c, toolbar as l } from "./HighlightCode.css.js";
+import { cloneElement as u, isValidElement as d } from "react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/atomic/molecules/highlight/HighlightCode.tsx
 var m = (t) => {
-	if (!p(t) || typeof t.type != "string" || t.type !== "pre") return t;
+	if (!d(t) || typeof t.type != "string" || t.type !== "pre") return t;
 	let n = t.props.className;
-	return f(t, { className: e(o, n) });
-}, h = ({ badgeLabel: e, copyCode: o, highlighted: f, fallbackCodeText: p, placeholderText: h }) => {
+	return u(t, { className: e(s, n) });
+}, h = ({ badgeLabel: e, copyCode: s, highlighted: u, fallbackCodeText: d, placeholderText: h }) => {
 	let g;
-	g = h == null ? f == null ? /* @__PURE__ */ u("pre", {
-		className: i,
-		children: p ?? ""
-	}) : typeof f == "string" ? /* @__PURE__ */ u("pre", {
-		className: i,
-		dangerouslySetInnerHTML: { __html: f }
-	}) : /* @__PURE__ */ u("div", {
-		className: s,
-		children: m(f)
-	}) : /* @__PURE__ */ u("span", {
+	g = h == null ? u == null ? /* @__PURE__ */ f("pre", {
 		className: a,
+		children: d ?? ""
+	}) : typeof u == "string" ? /* @__PURE__ */ f("pre", {
+		className: a,
+		dangerouslySetInnerHTML: { __html: u }
+	}) : /* @__PURE__ */ f("div", {
+		className: c,
+		children: m(u)
+	}) : /* @__PURE__ */ f("span", {
+		className: o,
 		children: h
 	});
 	let _ = null;
-	return typeof o == "string" && o !== "" && (_ = /* @__PURE__ */ u(l, { code: o })), /* @__PURE__ */ d("div", {
-		className: n,
-		children: [/* @__PURE__ */ d("div", {
-			className: c,
-			children: [/* @__PURE__ */ u("span", {
-				className: t,
+	return typeof s == "string" && s !== "" && (_ = /* @__PURE__ */ f(t, { code: s })), /* @__PURE__ */ p("div", {
+		className: r,
+		children: [/* @__PURE__ */ p("div", {
+			className: l,
+			children: [/* @__PURE__ */ f("span", {
+				className: n,
 				children: e
 			}), _]
-		}), /* @__PURE__ */ u("div", {
-			className: r,
+		}), /* @__PURE__ */ f("div", {
+			className: i,
 			children: g
 		})]
 	});

package/lib/esm/atomic/molecules/markdown/LazyMarkdownRenderer.js

@@ -1,13 +1,13 @@
 import { fallback as e } from "./LazyMarkdownRenderer.css.js";
-import { jsx as t } from "react/jsx-runtime";
-import { Suspense as n, lazy as r } from "react";
+import { Suspense as t, lazy as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/atomic/molecules/markdown/LazyMarkdownRenderer.tsx
-var i = r(async () => ({ default: (await import("./MarkdownRenderer.js")).MarkdownRenderer })), a = ({ content: n }) => /* @__PURE__ */ t("div", {
+var i = n(async () => ({ default: (await import("./MarkdownRenderer.js")).MarkdownRenderer })), a = ({ content: t }) => /* @__PURE__ */ r("div", {
 	className: e,
-	children: n
-}), o = ({ content: e }) => /* @__PURE__ */ t(n, {
-	fallback: /* @__PURE__ */ t(a, { content: e }),
-	children: /* @__PURE__ */ t(i, { content: e })
+	children: t
+}), o = ({ content: e }) => /* @__PURE__ */ r(t, {
+	fallback: /* @__PURE__ */ r(a, { content: e }),
+	children: /* @__PURE__ */ r(i, { content: e })
 });
 //#endregion
 export { o as LazyMarkdownRenderer, o as default };

package/lib/esm/atomic/molecules/markdown/MarkdownRenderer.js

@@ -28,26 +28,26 @@ import { MarkdownTableRow as E } from "./components/MarkdownTableRow.js";
 import { MarkdownTaskListItem as D } from "./components/MarkdownTaskListItem.js";
 import { MarkdownText as O } from "./components/MarkdownText.js";
 import { MarkdownThematicBreak as k } from "./components/MarkdownThematicBreak.js";
-import { jsx as A, jsxs as j } from "react/jsx-runtime";
-import { Fragment as M, useDeferredValue as N, useMemo as te } from "react";
+import { Fragment as A, useDeferredValue as j, useMemo as M } from "react";
+import { jsx as N, jsxs as te } from "react/jsx-runtime";
 //#region src/atomic/molecules/markdown/MarkdownRenderer.tsx
 var P = (e) => e === "center" || e === "right" ? e : "left", F = (e, t, n) => t == null ? null : e(t, n), I = (e) => {
 	if ("children" in e) return e.children;
 }, L = (t) => t.type === e.codeInline, R = (t) => t.type === e.codeBlock, z = (t) => t.type === e.footnoteReference, B = (t) => t.type === e.heading, V = (t) => t.type === e.htmlBlock, H = (t) => t.type === e.htmlSelfClosing, U = (t) => t.type === e.image, W = (t) => t.type === e.link, G = (t) => t.type === e.orderedList, K = (t) => t.type === e.paragraph, q = (t) => t.type === e.table, J = (t) => t.type === e.text, Y = (t) => t.type === e.textFormatted, X = (t) => t.type === e.unorderedList, Z = (t) => t.type === e.gfmTask, Q = {
-	[e.blockQuote]: (e, t, n, i) => /* @__PURE__ */ A(r, { children: F(n, I(t), i) }, i.key),
-	[e.breakLine]: (e, t, n, r) => /* @__PURE__ */ A(m, {}, r.key),
-	[e.breakThematic]: (e, t, n, r) => /* @__PURE__ */ A(k, {}, r.key),
-	[e.codeInline]: (e, t, n, r) => L(t) ? /* @__PURE__ */ A(p, { text: t.text }, r.key) : null,
-	[e.codeBlock]: (e, t, n, r) => R(t) ? /* @__PURE__ */ A(i, {
+	[e.blockQuote]: (e, t, n, i) => /* @__PURE__ */ N(r, { children: F(n, I(t), i) }, i.key),
+	[e.breakLine]: (e, t, n, r) => /* @__PURE__ */ N(m, {}, r.key),
+	[e.breakThematic]: (e, t, n, r) => /* @__PURE__ */ N(k, {}, r.key),
+	[e.codeInline]: (e, t, n, r) => L(t) ? /* @__PURE__ */ N(p, { text: t.text }, r.key) : null,
+	[e.codeBlock]: (e, t, n, r) => R(t) ? /* @__PURE__ */ N(i, {
 		code: t.text,
 		language: t.lang
 	}, r.key) : null,
-	[e.footnoteReference]: (e, t, n, r) => z(t) ? /* @__PURE__ */ A(c, {
+	[e.footnoteReference]: (e, t, n, r) => z(t) ? /* @__PURE__ */ N(c, {
 		href: t.target,
 		label: t.text
 	}, r.key) : null,
 	[e.gfmTask]: () => null,
-	[e.heading]: (e, t, n, r) => B(t) ? /* @__PURE__ */ A(u, {
+	[e.heading]: (e, t, n, r) => B(t) ? /* @__PURE__ */ N(u, {
 		id: t.id,
 		level: t.level,
 		children: F(n, t.children, r)
@@ -55,16 +55,16 @@ var P = (e) => e === "center" || e === "right" ? e : "left", F = (e, t, n) => t
 	[e.htmlBlock]: (e, t, n, r) => {
 		if (!V(t)) return null;
 		let i = t.text, a = "";
-		return typeof i == "string" && (a = i), /* @__PURE__ */ A(d, {
+		return typeof i == "string" && (a = i), /* @__PURE__ */ N(d, {
 			content: a,
 			title: "HTML non pris en charge"
 		}, r.key);
 	},
-	[e.htmlSelfClosing]: (e, t, n, r) => H(t) ? /* @__PURE__ */ A(d, {
+	[e.htmlSelfClosing]: (e, t, n, r) => H(t) ? /* @__PURE__ */ N(d, {
 		content: `<${t.tag} />`,
 		title: "HTML non pris en charge"
 	}, r.key) : null,
-	[e.image]: (e, t, n, r) => U(t) ? /* @__PURE__ */ A(f, {
+	[e.image]: (e, t, n, r) => U(t) ? /* @__PURE__ */ N(f, {
 		alt: t.alt,
 		src: t.target,
 		title: t.title
@@ -72,13 +72,13 @@ var P = (e) => e === "center" || e === "right" ? e : "left", F = (e, t, n) => t
 	[e.link]: (e, t, n, r) => {
 		if (!W(t)) return null;
 		let i = t.target;
-		return i == null ? /* @__PURE__ */ A(M, { children: F(n, t.children, r) }, r.key) : /* @__PURE__ */ A(h, {
+		return i == null ? /* @__PURE__ */ N(A, { children: F(n, t.children, r) }, r.key) : /* @__PURE__ */ N(h, {
 			href: i,
 			title: t.title,
 			children: F(n, t.children, r)
 		}, r.key);
 	},
-	[e.orderedList]: (e, t, n, r) => G(t) ? /* @__PURE__ */ A(g, {
+	[e.orderedList]: (e, t, n, r) => G(t) ? /* @__PURE__ */ N(g, {
 		ordered: !0,
 		start: t.start,
 		children: t.items.map((e, t) => {
@@ -87,48 +87,48 @@ var P = (e) => e === "center" || e === "right" ? e : "left", F = (e, t, n) => t
 			let a = `${i}-${t}`, o = e[0];
 			if (o != null && Z(o)) {
 				let t = e.slice(1);
-				return /* @__PURE__ */ A(D, {
+				return /* @__PURE__ */ N(D, {
 					checked: o.completed,
 					children: F(n, t, r)
 				}, a);
 			}
-			return /* @__PURE__ */ A(_, { children: F(n, e, r) }, a);
+			return /* @__PURE__ */ N(_, { children: F(n, e, r) }, a);
 		})
 	}, r.key) : null,
-	[e.paragraph]: (e, t, n, r) => K(t) ? /* @__PURE__ */ A(v, { children: F(n, t.children, r) }, r.key) : null,
+	[e.paragraph]: (e, t, n, r) => K(t) ? /* @__PURE__ */ N(v, { children: F(n, t.children, r) }, r.key) : null,
 	[e.table]: (e, t, n, r) => {
 		if (!q(t)) return null;
 		let i = null;
-		return Array.isArray(t.header) && t.header.length > 0 && (i = /* @__PURE__ */ A(w, { children: /* @__PURE__ */ A(E, { children: t.header.map((e, i) => {
+		return Array.isArray(t.header) && t.header.length > 0 && (i = /* @__PURE__ */ N(w, { children: /* @__PURE__ */ N(E, { children: t.header.map((e, i) => {
 			let a;
-			return Array.isArray(t.align) && (a = t.align[i]), /* @__PURE__ */ A(T, {
+			return Array.isArray(t.align) && (a = t.align[i]), /* @__PURE__ */ N(T, {
 				align: P(a),
 				children: F(n, e, r)
 			}, `header-${i}`);
-		}) }) })), /* @__PURE__ */ j(x, { children: [i, /* @__PURE__ */ A(S, { children: t.cells.map((e, i) => /* @__PURE__ */ A(E, { children: e.map((e, a) => {
+		}) }) })), /* @__PURE__ */ te(x, { children: [i, /* @__PURE__ */ N(S, { children: t.cells.map((e, i) => /* @__PURE__ */ N(E, { children: e.map((e, a) => {
 			let o;
-			return Array.isArray(t.align) && (o = t.align[a]), /* @__PURE__ */ A(C, {
+			return Array.isArray(t.align) && (o = t.align[a]), /* @__PURE__ */ N(C, {
 				align: P(o),
 				children: F(n, e, r)
 			}, `cell-${i}-${a}`);
 		}) }, `row-${i}`)) })] }, r.key);
 	},
-	[e.text]: (e, t, n, r) => J(t) ? /* @__PURE__ */ A(O, { text: t.text }, r.key) : null,
+	[e.text]: (e, t, n, r) => J(t) ? /* @__PURE__ */ N(O, { text: t.text }, r.key) : null,
 	[e.textFormatted]: (e, t, n, r) => {
 		if (!Y(t)) return e();
 		let i = F(n, t.children, r);
 		switch (t.tag) {
 			case "strong":
-			case "b": return /* @__PURE__ */ A(y, { children: i }, r.key);
+			case "b": return /* @__PURE__ */ N(y, { children: i }, r.key);
 			case "em":
-			case "i": return /* @__PURE__ */ A(o, { children: i }, r.key);
-			case "mark": return /* @__PURE__ */ A(ee, { children: i }, r.key);
+			case "i": return /* @__PURE__ */ N(o, { children: i }, r.key);
+			case "mark": return /* @__PURE__ */ N(ee, { children: i }, r.key);
 			case "del":
-			case "s": return /* @__PURE__ */ A(a, { children: i }, r.key);
+			case "s": return /* @__PURE__ */ N(a, { children: i }, r.key);
 			default: return e();
 		}
 	},
-	[e.unorderedList]: (e, t, n, r) => X(t) ? /* @__PURE__ */ A(g, {
+	[e.unorderedList]: (e, t, n, r) => X(t) ? /* @__PURE__ */ N(g, {
 		ordered: !1,
 		children: t.items.map((e, t) => {
 			let i = "ul";
@@ -136,18 +136,18 @@ var P = (e) => e === "center" || e === "right" ? e : "left", F = (e, t, n) => t
 			let a = `${i}-${t}`, o = e[0];
 			if (o != null && Z(o)) {
 				let t = e.slice(1);
-				return /* @__PURE__ */ A(D, {
+				return /* @__PURE__ */ N(D, {
 					checked: o.completed,
 					children: F(n, t, r)
 				}, a);
 			}
-			return /* @__PURE__ */ A(_, { children: F(n, e, r) }, a);
+			return /* @__PURE__ */ N(_, { children: F(n, e, r) }, a);
 		})
 	}, r.key) : null
 }, ne = {
 	disableParsingRawHTML: !0,
 	forceBlock: !0,
-	wrapper: M,
+	wrapper: A,
 	overrides: {
 		footer: { component: l },
 		sup: { component: s },
@@ -158,10 +158,10 @@ var P = (e) => e === "center" || e === "right" ? e : "left", F = (e, t, n) => t
 		return i == null ? e() : i(e, t, n, r);
 	}
 }, $ = ({ content: e }) => {
-	let r = N(e);
-	return /* @__PURE__ */ A(n, { children: /* @__PURE__ */ A(t, {
+	let r = j(e);
+	return /* @__PURE__ */ N(n, { children: /* @__PURE__ */ N(t, {
 		options: ne,
-		children: te(() => r, [r])
+		children: M(() => r, [r])
 	}) });
 };
 //#endregion