@proyecto-viviana/solidaria-components 0.3.2 → 0.4.0

package/dist/Popover.jsx

@@ -0,0 +1,333 @@
+import { dataAttr, filterDOMProps, useIsHydrated, useRenderProps } from "./utils.jsx";
+import { o as usePopoverTrigger, r as PopoverTriggerContext, t as DialogTriggerContext } from "./contexts.jsx";
+import { Show, createContext, createEffect, createMemo, createSignal, createUniqueId, onCleanup, splitProps, useContext } from "solid-js";
+import { Portal } from "solid-js/web";
+import { FocusScope, createOverlayTrigger, createPopover, useUNSAFE_PortalContext, visuallyHiddenStyles } from "@proyecto-viviana/solidaria";
+import { createOverlayTriggerState } from "@proyecto-viviana/solid-stately";
+//#region src/Popover.tsx
+/**
+* Popover component for solidaria-components
+*
+* A headless popover component that positions relative to a trigger element.
+* Port of react-aria-components Popover.
+*/
+const PopoverContext = createContext(null);
+const PopoverGroupContext = createContext(null);
+function PopoverDismissButton(props) {
+	return <button type="button" aria-label="Dismiss" tabIndex={-1} onClick={props.onDismiss} style={visuallyHiddenStyles} />;
+}
+/**
+* A PopoverTrigger opens a popover when a trigger element is pressed.
+* Children should include a trigger element (e.g. Button) and the Popover.
+*/
+function PopoverTrigger(props) {
+	const [local] = splitProps(props, [
+		"isOpen",
+		"defaultOpen",
+		"onOpenChange"
+	]);
+	const state = createOverlayTriggerState({
+		get isOpen() {
+			return local.isOpen;
+		},
+		get defaultOpen() {
+			return local.defaultOpen;
+		},
+		onOpenChange: local.onOpenChange
+	});
+	let triggerRef = null;
+	const triggerId = createUniqueId();
+	const triggerAria = createOverlayTrigger({ type: "dialog" }, state, () => triggerRef);
+	const contextValue = createMemo(() => ({
+		state: {
+			isOpen: () => state.isOpen(),
+			open: () => state.open(),
+			close: () => state.close(),
+			toggle: () => state.toggle()
+		},
+		triggerRef: () => triggerRef,
+		setTriggerRef: (el) => {
+			if (!el) return;
+			if (!triggerRef || !triggerRef.isConnected) triggerRef = el;
+		},
+		triggerId,
+		triggerProps: triggerAria.triggerProps,
+		overlayProps: triggerAria.overlayProps,
+		trigger: "PopoverTrigger"
+	}));
+	return <PopoverTriggerContext.Provider value={contextValue()}>
+      {props.children}
+    </PopoverTriggerContext.Provider>;
+}
+/**
+* A popover is an overlay element positioned relative to a trigger.
+*/
+function Popover(props) {
+	const [local, rest] = splitProps(props, [
+		"class",
+		"style",
+		"trigger",
+		"triggerRef",
+		"placement",
+		"containerPadding",
+		"offset",
+		"crossOffset",
+		"shouldFlip",
+		"maxHeight",
+		"boundaryElement",
+		"getTargetRect",
+		"arrowRef",
+		"scrollRef",
+		"isNonModal",
+		"isKeyboardDismissDisabled",
+		"shouldCloseOnInteractOutside",
+		"isOpen",
+		"defaultOpen",
+		"onOpenChange",
+		"autoFocus",
+		"isEntering",
+		"isExiting"
+	]);
+	let popoverRef;
+	const [groupRef, setGroupRef] = createSignal(null);
+	const isHydrated = useIsHydrated();
+	const triggerContext = useContext(PopoverTriggerContext);
+	const dialogTriggerContext = useContext(DialogTriggerContext);
+	const popoverGroupContext = useContext(PopoverGroupContext);
+	const resolvedTrigger = () => local.trigger ?? triggerContext?.trigger ?? (dialogTriggerContext ? "DialogTrigger" : void 0);
+	const isSubPopover = () => resolvedTrigger() === "SubmenuTrigger" && popoverGroupContext != null;
+	const [internalOpen, setInternalOpen] = createSignal(local.defaultOpen ?? false);
+	const isOpen = () => {
+		if (local.isOpen !== void 0) return local.isOpen;
+		if (triggerContext) return triggerContext.state.isOpen();
+		if (dialogTriggerContext) return dialogTriggerContext.state.isOpen();
+		return internalOpen();
+	};
+	const close = () => {
+		if (local.isOpen !== void 0) local.onOpenChange?.(false);
+		else if (triggerContext) {
+			triggerContext.state.close();
+			local.onOpenChange?.(false);
+		} else if (dialogTriggerContext) {
+			dialogTriggerContext.state.close();
+			local.onOpenChange?.(false);
+		} else {
+			setInternalOpen(false);
+			local.onOpenChange?.(false);
+		}
+	};
+	const getTriggerRef = () => {
+		if (local.triggerRef) return local.triggerRef();
+		if (triggerContext) return triggerContext.triggerRef();
+		if (dialogTriggerContext) return dialogTriggerContext.triggerRef();
+		return null;
+	};
+	const popoverAria = createPopover({
+		triggerRef: getTriggerRef,
+		popoverRef: () => null,
+		groupRef: () => isSubPopover() ? popoverGroupContext?.() ?? null : groupRef(),
+		get placement() {
+			return local.placement;
+		},
+		get containerPadding() {
+			return local.containerPadding;
+		},
+		get offset() {
+			return local.offset ?? 8;
+		},
+		get crossOffset() {
+			return local.crossOffset;
+		},
+		get shouldFlip() {
+			return local.shouldFlip;
+		},
+		get maxHeight() {
+			return local.maxHeight;
+		},
+		get boundaryElement() {
+			return local.boundaryElement;
+		},
+		get getTargetRect() {
+			return local.getTargetRect;
+		},
+		get arrowRef() {
+			return local.arrowRef;
+		},
+		get scrollRef() {
+			return local.scrollRef;
+		},
+		get isNonModal() {
+			return local.isNonModal;
+		},
+		get isKeyboardDismissDisabled() {
+			return local.isKeyboardDismissDisabled;
+		},
+		get shouldCloseOnInteractOutside() {
+			return local.shouldCloseOnInteractOutside;
+		},
+		get trigger() {
+			return resolvedTrigger();
+		}
+	}, {
+		isOpen,
+		open: () => {
+			if (local.isOpen !== void 0) local.onOpenChange?.(true);
+			else if (triggerContext) {
+				triggerContext.state.open();
+				local.onOpenChange?.(true);
+			} else if (dialogTriggerContext) {
+				dialogTriggerContext.state.open();
+				local.onOpenChange?.(true);
+			} else {
+				setInternalOpen(true);
+				local.onOpenChange?.(true);
+			}
+		},
+		close,
+		toggle: () => {
+			if (isOpen()) close();
+			else if (local.isOpen !== void 0) local.onOpenChange?.(true);
+			else if (triggerContext) triggerContext.state.toggle();
+			else if (dialogTriggerContext) dialogTriggerContext.state.toggle();
+			else {
+				setInternalOpen(true);
+				local.onOpenChange?.(true);
+			}
+		}
+	});
+	const renderValues = createMemo(() => ({
+		trigger: resolvedTrigger() ?? null,
+		placement: popoverAria.placement(),
+		isEntering: local.isEntering ?? false,
+		isExiting: local.isExiting ?? false
+	}));
+	const renderProps = useRenderProps({
+		get children() {
+			return props.children;
+		},
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-Popover"
+	}, renderValues);
+	const [triggerWidth, setTriggerWidth] = createSignal();
+	const hasExplicitTriggerWidth = () => {
+		return renderProps.style()?.["--trigger-width"] != null;
+	};
+	const updateTriggerWidth = () => {
+		const trigger = getTriggerRef();
+		if (!trigger || hasExplicitTriggerWidth()) return;
+		setTriggerWidth(`${trigger.getBoundingClientRect().width}px`);
+	};
+	createEffect(() => {
+		if (!isOpen()) return;
+		updateTriggerWidth();
+		const trigger = getTriggerRef();
+		if (!trigger || hasExplicitTriggerWidth() || typeof ResizeObserver === "undefined") return;
+		const observer = new ResizeObserver(updateTriggerWidth);
+		observer.observe(trigger);
+		onCleanup(() => observer.disconnect());
+	});
+	const domProps = createMemo(() => filterDOMProps(rest, { global: true }));
+	const overlayId = () => {
+		return rest.id ?? triggerContext?.overlayProps?.id ?? dialogTriggerContext?.overlayProps?.id;
+	};
+	const cleanPopoverProps = () => {
+		const { style: _style, ref: _ref, ...remaining } = popoverAria.popoverProps;
+		return remaining;
+	};
+	const mergedStyle = () => {
+		const ariaStyle = popoverAria.popoverProps.style;
+		const renderStyle = renderProps.style() || {};
+		return {
+			...ariaStyle,
+			...renderStyle,
+			"--trigger-width": renderStyle["--trigger-width"] ?? triggerWidth()
+		};
+	};
+	const shouldBeDialog = () => !local.isNonModal || resolvedTrigger() === "SubmenuTrigger";
+	const shouldContainFocus = () => {
+		if (!shouldBeDialog()) return false;
+		const trigger = resolvedTrigger();
+		return trigger !== "MenuTrigger" && trigger !== "SubmenuTrigger";
+	};
+	const portalContext = useUNSAFE_PortalContext();
+	const portalContainer = () => {
+		if (isSubPopover()) return popoverGroupContext?.() ?? portalContext.getContainer?.() ?? void 0;
+		return portalContext.getContainer?.() ?? void 0;
+	};
+	createEffect(() => {
+		if (!isOpen() || !shouldBeDialog()) return;
+		if ((local.autoFocus ?? true) === false) return;
+	});
+	createEffect(() => {
+		if (!isOpen()) return;
+		if (local.isKeyboardDismissDisabled) return;
+		const onKeyDown = (event) => {
+			if (event.key !== "Escape") return;
+			if (event.defaultPrevented) return;
+			close();
+		};
+		document.addEventListener("keydown", onKeyDown);
+		onCleanup(() => document.removeEventListener("keydown", onKeyDown));
+	});
+	const overlay = () => <PopoverContext.Provider value={{
+		placement: popoverAria.placement,
+		arrowProps: () => popoverAria.arrowProps
+	}}>
+      <FocusScope contain={shouldContainFocus()} restoreFocus>
+        <div {...domProps()} {...cleanPopoverProps()} ref={popoverRef} id={overlayId()} role={shouldBeDialog() ? "dialog" : void 0} tabIndex={shouldBeDialog() ? -1 : void 0} class={renderProps.class()} style={mergedStyle()} data-trigger={resolvedTrigger()} data-placement={popoverAria.placement()} data-entering={dataAttr(local.isEntering)} data-exiting={dataAttr(local.isExiting)}>
+          <Show when={!local.isNonModal}>
+            <PopoverDismissButton onDismiss={close} />
+          </Show>
+          {renderProps.renderChildren()}
+          <PopoverDismissButton onDismiss={close} />
+        </div>
+      </FocusScope>
+    </PopoverContext.Provider>;
+	const underlay = () => <div data-testid="underlay" {...popoverAria.underlayProps} style={{
+		position: "fixed",
+		inset: 0
+	}} />;
+	return <Show when={isHydrated() && (isOpen() || local.isExiting)}>
+      <Portal mount={portalContainer()}>
+        <Show when={!local.isNonModal && !isSubPopover() && isOpen()}>{underlay()}</Show>
+        <Show when={isSubPopover()} fallback={<div ref={setGroupRef} style={{ display: "contents" }}>
+              <PopoverGroupContext.Provider value={() => groupRef()}>
+                {overlay()}
+              </PopoverGroupContext.Provider>
+            </div>}>
+          {overlay()}
+        </Show>
+      </Portal>
+    </Show>;
+}
+/**
+* An arrow element that points towards the trigger.
+*/
+function OverlayArrow(props) {
+	const popoverContext = useContext(PopoverContext);
+	const placement = () => popoverContext?.placement() ?? null;
+	const mergedStyle = () => {
+		const currentPlacement = placement();
+		const style = {
+			position: "absolute",
+			transform: currentPlacement === "top" || currentPlacement === "bottom" ? "translateX(-50%)" : "translateY(-50%)"
+		};
+		if (currentPlacement != null) style[currentPlacement] = "100%";
+		const contextStyle = (popoverContext?.arrowProps())?.style;
+		if (typeof contextStyle?.left === "string") style.left = contextStyle.left;
+		if (typeof contextStyle?.top === "string") style.top = contextStyle.top;
+		const localStyle = props.style && !(typeof CSSStyleDeclaration !== "undefined" && props.style instanceof CSSStyleDeclaration) ? props.style : void 0;
+		return {
+			...style,
+			...localStyle
+		};
+	};
+	return <div class={props.class} style={mergedStyle()} data-placement={placement()}>
+      {props.render ? props.render() : props.children}
+    </div>;
+}
+//#endregion
+export { OverlayArrow, Popover, Popover as default, PopoverContext, PopoverTrigger, PopoverTriggerContext, usePopoverTrigger };
+
+//# sourceMappingURL=Popover.jsx.map

package/dist/Popover.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.jsx","names":[],"sources":["../src/Popover.tsx"],"sourcesContent":["/**\n * Popover component for solidaria-components\n *\n * A headless popover component that positions relative to a trigger element.\n * Port of react-aria-components Popover.\n */\n\nimport {\n  type JSX,\n  createContext,\n  createEffect,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  onCleanup,\n  splitProps,\n  useContext,\n  Show,\n} from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport {\n  createOverlayTrigger,\n  createPopover,\n  FocusScope,\n  useUNSAFE_PortalContext,\n  visuallyHiddenStyles,\n  type AriaLabelingProps,\n  type Placement,\n  type PlacementAxis,\n} from \"@proyecto-viviana/solidaria\";\nimport { createOverlayTriggerState } from \"@proyecto-viviana/solid-stately\";\nimport {\n  type RenderChildren,\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  type SlotProps,\n  useRenderProps,\n  filterDOMProps,\n  dataAttr,\n  useIsHydrated,\n} from \"./utils\";\nimport { DialogTriggerContext, PopoverTriggerContext } from \"./contexts\";\n\nexport interface PopoverRenderProps {\n  /**\n   * The name of the component that triggered the popover.\n   */\n  trigger: string | null;\n  /**\n   * The placement of the popover relative to the trigger.\n   */\n  placement: PlacementAxis | null;\n  /**\n   * Whether the popover is currently entering (for animations).\n   */\n  isEntering: boolean;\n  /**\n   * Whether the popover is currently exiting (for animations).\n   */\n  isExiting: boolean;\n}\n\nexport interface PopoverProps extends SlotProps, AriaLabelingProps {\n  /** The children of the component - can be JSX or render function. */\n  children?: RenderChildren<PopoverRenderProps>;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<PopoverRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<PopoverRenderProps>;\n  /**\n   * The name of the component that triggered the popover.\n   */\n  trigger?: string;\n  /**\n   * The ref for the element which the popover positions itself with respect to.\n   * Required when used standalone (not within a trigger component).\n   */\n  triggerRef?: () => Element | null;\n  /**\n   * The placement of the element with respect to its anchor element.\n   * @default 'bottom'\n   */\n  placement?: Placement;\n  /**\n   * The placement padding that should be applied between the element and its\n   * surrounding container.\n   * @default 12\n   */\n  containerPadding?: number;\n  /**\n   * The additional offset applied along the main axis between the element and its\n   * anchor element.\n   * @default 8\n   */\n  offset?: number;\n  /**\n   * The additional offset applied along the cross axis between the element and its\n   * anchor element.\n   * @default 0\n   */\n  crossOffset?: number;\n  /**\n   * Whether the element should flip its orientation when there is insufficient room.\n   * @default true\n   */\n  shouldFlip?: boolean;\n  /**\n   * The max height of the popover.\n   */\n  maxHeight?: number;\n  /**\n   * A boundary element for placement calculations.\n   */\n  boundaryElement?: Element;\n  /**\n   * Overrides the target element's bounding rectangle. Useful for positioning relative to\n   * a specific point such as the mouse cursor (e.g. context menus) or text selection.\n   *\n   * @default target.getBoundingClientRect()\n   * @param target - The target element.\n   */\n  getTargetRect?: (target: Element) => DOMRect | null | undefined;\n  /**\n   * A ref for the popover arrow element.\n   */\n  arrowRef?: () => Element | null;\n  /**\n   * A ref for the scrollable popover element.\n   */\n  scrollRef?: () => Element | null;\n  /**\n   * Whether the popover is non-modal (allows interaction outside).\n   */\n  isNonModal?: boolean;\n  /**\n   * Whether pressing Escape to close should be disabled.\n   */\n  isKeyboardDismissDisabled?: boolean;\n  /**\n   * Filter for which outside interactions should close the popover.\n   */\n  shouldCloseOnInteractOutside?: (element: Element) => boolean;\n  /** Whether the popover is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the popover opens by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Handler called when the popover's open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n  /**\n   * Whether focus should move to the popover container on open.\n   * @default true\n   */\n  autoFocus?: boolean;\n  /** Whether the popover is entering (for animations). */\n  isEntering?: boolean;\n  /** Whether the popover is exiting (for animations). */\n  isExiting?: boolean;\n}\n\nexport interface PopoverTriggerProps {\n  /** The children - should include a trigger and popover content. */\n  children: JSX.Element;\n  /** Whether the popover is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the popover is open by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Callback when open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport {\n  PopoverTriggerContext,\n  usePopoverTrigger,\n  type PopoverTriggerContextValue,\n} from \"./contexts\";\n\ninterface PopoverContextValue {\n  placement: () => PlacementAxis | null;\n  arrowProps: () => JSX.HTMLAttributes<HTMLElement>;\n}\n\nexport const PopoverContext = createContext<PopoverContextValue | null>(null);\nconst PopoverGroupContext = createContext<(() => HTMLElement | null) | null>(null);\n\nfunction PopoverDismissButton(props: { onDismiss: () => void }): JSX.Element {\n  return (\n    <button\n      type=\"button\"\n      aria-label=\"Dismiss\"\n      tabIndex={-1}\n      onClick={props.onDismiss}\n      style={visuallyHiddenStyles}\n    />\n  );\n}\n\n/**\n * A PopoverTrigger opens a popover when a trigger element is pressed.\n * Children should include a trigger element (e.g. Button) and the Popover.\n */\nexport function PopoverTrigger(props: PopoverTriggerProps): JSX.Element {\n  const [local] = splitProps(props, [\"isOpen\", \"defaultOpen\", \"onOpenChange\"]);\n\n  const state = createOverlayTriggerState({\n    get isOpen() {\n      return local.isOpen;\n    },\n    get defaultOpen() {\n      return local.defaultOpen;\n    },\n    onOpenChange: local.onOpenChange,\n  });\n\n  let triggerRef: HTMLElement | null = null;\n  const triggerId = createUniqueId();\n\n  const triggerAria = createOverlayTrigger({ type: \"dialog\" }, state, () => triggerRef);\n\n  const contextValue = createMemo(() => ({\n    state: {\n      isOpen: () => state.isOpen(),\n      open: () => state.open(),\n      close: () => state.close(),\n      toggle: () => state.toggle(),\n    },\n    triggerRef: () => triggerRef,\n    setTriggerRef: (el: HTMLElement | null) => {\n      if (!el) return;\n      if (!triggerRef || !triggerRef.isConnected) {\n        triggerRef = el;\n      }\n    },\n    triggerId,\n    triggerProps: triggerAria.triggerProps,\n    overlayProps: triggerAria.overlayProps,\n    trigger: \"PopoverTrigger\",\n  }));\n\n  return (\n    <PopoverTriggerContext.Provider value={contextValue()}>\n      {props.children}\n    </PopoverTriggerContext.Provider>\n  );\n}\n\n/**\n * A popover is an overlay element positioned relative to a trigger.\n */\nexport function Popover(props: PopoverProps): JSX.Element {\n  // Note: do NOT early-return on the server. Returning `null` on the server and a\n  // full <Show>/<Portal> tree on the client desyncs Solid's hydration walk (the\n  // server emits no marker for the <Show>), which surfaces as \"Hydration Mismatch /\n  // getNextElement\" in the parent (e.g. Picker). Instead, run the same structure on\n  // both and gate the Portal on `useIsHydrated()` so the overlay only mounts on the\n  // client after hydration — the server + first client render both produce an empty\n  // <Show> marker, so hydration aligns.\n  const [local, rest] = splitProps(props, [\n    \"class\",\n    \"style\",\n    \"trigger\",\n    \"triggerRef\",\n    \"placement\",\n    \"containerPadding\",\n    \"offset\",\n    \"crossOffset\",\n    \"shouldFlip\",\n    \"maxHeight\",\n    \"boundaryElement\",\n    \"getTargetRect\",\n    \"arrowRef\",\n    \"scrollRef\",\n    \"isNonModal\",\n    \"isKeyboardDismissDisabled\",\n    \"shouldCloseOnInteractOutside\",\n    \"isOpen\",\n    \"defaultOpen\",\n    \"onOpenChange\",\n    \"autoFocus\",\n    \"isEntering\",\n    \"isExiting\",\n  ]);\n\n  let popoverRef!: HTMLDivElement;\n  const [groupRef, setGroupRef] = createSignal<HTMLDivElement | null>(null);\n  // False on the server and during hydration; true after onMount. Gates the Portal\n  // so overlay content only ever renders client-side, post-hydration.\n  const isHydrated = useIsHydrated();\n\n  const triggerContext = useContext(PopoverTriggerContext);\n  const dialogTriggerContext = useContext(DialogTriggerContext);\n  const popoverGroupContext = useContext(PopoverGroupContext);\n  const resolvedTrigger = () =>\n    local.trigger ??\n    triggerContext?.trigger ??\n    (dialogTriggerContext ? \"DialogTrigger\" : undefined);\n  const isSubPopover = () => resolvedTrigger() === \"SubmenuTrigger\" && popoverGroupContext != null;\n\n  const [internalOpen, setInternalOpen] = createSignal(local.defaultOpen ?? false);\n\n  const isOpen = (): boolean => {\n    if (local.isOpen !== undefined) return local.isOpen;\n    if (triggerContext) {\n      return triggerContext.state.isOpen();\n    }\n    if (dialogTriggerContext) {\n      return dialogTriggerContext.state.isOpen();\n    }\n    return internalOpen();\n  };\n\n  const close = () => {\n    if (local.isOpen !== undefined) {\n      local.onOpenChange?.(false);\n    } else if (triggerContext) {\n      triggerContext.state.close();\n      local.onOpenChange?.(false);\n    } else if (dialogTriggerContext) {\n      dialogTriggerContext.state.close();\n      local.onOpenChange?.(false);\n    } else {\n      setInternalOpen(false);\n      local.onOpenChange?.(false);\n    }\n  };\n\n  const getTriggerRef = () => {\n    if (local.triggerRef) return local.triggerRef();\n    if (triggerContext) return triggerContext.triggerRef();\n    if (dialogTriggerContext) return dialogTriggerContext.triggerRef();\n    return null;\n  };\n\n  const popoverAria = createPopover(\n    {\n      triggerRef: getTriggerRef,\n      popoverRef: () => popoverRef ?? null,\n      groupRef: () => (isSubPopover() ? (popoverGroupContext?.() ?? null) : groupRef()),\n      get placement() {\n        return local.placement;\n      },\n      get containerPadding() {\n        return local.containerPadding;\n      },\n      get offset() {\n        return local.offset ?? 8;\n      },\n      get crossOffset() {\n        return local.crossOffset;\n      },\n      get shouldFlip() {\n        return local.shouldFlip;\n      },\n      get maxHeight() {\n        return local.maxHeight;\n      },\n      get boundaryElement() {\n        return local.boundaryElement;\n      },\n      get getTargetRect() {\n        return local.getTargetRect;\n      },\n      get arrowRef() {\n        return local.arrowRef;\n      },\n      get scrollRef() {\n        return local.scrollRef;\n      },\n      get isNonModal() {\n        return local.isNonModal;\n      },\n      get isKeyboardDismissDisabled() {\n        return local.isKeyboardDismissDisabled;\n      },\n      get shouldCloseOnInteractOutside() {\n        return local.shouldCloseOnInteractOutside;\n      },\n      get trigger() {\n        return resolvedTrigger();\n      },\n    },\n    {\n      isOpen,\n      open: () => {\n        if (local.isOpen !== undefined) {\n          local.onOpenChange?.(true);\n        } else if (triggerContext) {\n          triggerContext.state.open();\n          local.onOpenChange?.(true);\n        } else if (dialogTriggerContext) {\n          dialogTriggerContext.state.open();\n          local.onOpenChange?.(true);\n        } else {\n          setInternalOpen(true);\n          local.onOpenChange?.(true);\n        }\n      },\n      close,\n      toggle: () => {\n        if (isOpen()) close();\n        else if (local.isOpen !== undefined) {\n          local.onOpenChange?.(true);\n        } else if (triggerContext) {\n          triggerContext.state.toggle();\n        } else if (dialogTriggerContext) {\n          dialogTriggerContext.state.toggle();\n        } else {\n          setInternalOpen(true);\n          local.onOpenChange?.(true);\n        }\n      },\n    },\n  );\n\n  const renderValues = createMemo<PopoverRenderProps>(() => ({\n    trigger: resolvedTrigger() ?? null,\n    placement: popoverAria.placement(),\n    isEntering: local.isEntering ?? false,\n    isExiting: local.isExiting ?? false,\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      // Read children lazily. The popover content is gated behind\n      // `<Show when={isHydrated() && …}>` below, so it must NOT be instantiated\n      // during the component body. An eager `children: props.children` reads the\n      // child getter at object-construction time, building the content template\n      // (and walking `getNextElement`) before the gate — which the server, with\n      // the gate closed, never emitted → hydration mismatch. The getter defers\n      // the read until `renderChildren()` runs inside the gated overlay.\n      get children() {\n        return props.children;\n      },\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-Popover\",\n    },\n    renderValues,\n  );\n\n  const [triggerWidth, setTriggerWidth] = createSignal<string | undefined>();\n  const hasExplicitTriggerWidth = () => {\n    const style = renderProps.style() as (JSX.CSSProperties & Record<string, unknown>) | undefined;\n    return style?.[\"--trigger-width\"] != null;\n  };\n  const updateTriggerWidth = () => {\n    const trigger = getTriggerRef();\n    if (!trigger || hasExplicitTriggerWidth()) return;\n    setTriggerWidth(`${trigger.getBoundingClientRect().width}px`);\n  };\n  createEffect(() => {\n    if (!isOpen()) return;\n    updateTriggerWidth();\n\n    const trigger = getTriggerRef();\n    if (!trigger || hasExplicitTriggerWidth() || typeof ResizeObserver === \"undefined\") return;\n\n    const observer = new ResizeObserver(updateTriggerWidth);\n    observer.observe(trigger);\n    onCleanup(() => observer.disconnect());\n  });\n\n  const domProps = createMemo(() =>\n    filterDOMProps(rest as Record<string, unknown>, { global: true }),\n  );\n  const overlayId = () => {\n    const restId = (rest as Record<string, unknown>).id as string | undefined;\n    return (\n      restId ??\n      (triggerContext?.overlayProps?.id as string | undefined) ??\n      (dialogTriggerContext?.overlayProps?.id as string | undefined)\n    );\n  };\n\n  const cleanPopoverProps = () => {\n    const {\n      style: _style,\n      ref: _ref,\n      ...remaining\n    } = popoverAria.popoverProps as Record<string, unknown>;\n    return remaining;\n  };\n\n  const mergedStyle = (): JSX.CSSProperties => {\n    const ariaStyle = (popoverAria.popoverProps as Record<string, unknown>).style as\n      | JSX.CSSProperties\n      | undefined;\n    const renderStyle = (renderProps.style() || {}) as JSX.CSSProperties & Record<string, unknown>;\n    return {\n      ...ariaStyle,\n      ...renderStyle,\n      \"--trigger-width\": renderStyle[\"--trigger-width\"] ?? triggerWidth(),\n    };\n  };\n\n  const shouldBeDialog = () => !local.isNonModal || resolvedTrigger() === \"SubmenuTrigger\";\n  const shouldContainFocus = () => {\n    if (!shouldBeDialog()) {\n      return false;\n    }\n\n    const trigger = resolvedTrigger();\n    return trigger !== \"MenuTrigger\" && trigger !== \"SubmenuTrigger\";\n  };\n  const portalContext = useUNSAFE_PortalContext();\n  const portalContainer = () => {\n    if (isSubPopover()) {\n      return popoverGroupContext?.() ?? portalContext.getContainer?.() ?? undefined;\n    }\n    return portalContext.getContainer?.() ?? undefined;\n  };\n\n  // Match React Aria Components: focus the popover container only when no\n  // descendant has already moved focus during mount.\n  createEffect(() => {\n    if (!isOpen() || !shouldBeDialog()) return;\n    if ((local.autoFocus ?? true) === false) return;\n    if (!popoverRef) return;\n    if (resolvedTrigger() === \"SubmenuTrigger\") return;\n\n    let timeout: number | undefined;\n    let frame: number | undefined;\n\n    const focusIfNeeded = () => {\n      if (!isOpen() || !shouldBeDialog()) return;\n      if (!popoverRef || resolvedTrigger() === \"SubmenuTrigger\") return;\n      if (document.activeElement === popoverRef || popoverRef.contains(document.activeElement)) {\n        return;\n      }\n      popoverRef.focus();\n    };\n\n    const scheduleFocus = () => {\n      timeout = window.setTimeout(focusIfNeeded, 0);\n    };\n\n    if (typeof window.requestAnimationFrame === \"function\") {\n      frame = window.requestAnimationFrame(scheduleFocus);\n    } else {\n      scheduleFocus();\n    }\n\n    onCleanup(() => {\n      if (frame !== undefined) {\n        window.cancelAnimationFrame(frame);\n      }\n      if (timeout !== undefined) {\n        window.clearTimeout(timeout);\n      }\n    });\n  });\n\n  // Fallback Escape handling for environments where focus is not moved into the popover.\n  createEffect(() => {\n    if (!isOpen()) return;\n    if (local.isKeyboardDismissDisabled) return;\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key !== \"Escape\") return;\n      if (event.defaultPrevented) return;\n      close();\n    };\n\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const overlay = () => (\n    <PopoverContext.Provider\n      value={{ placement: popoverAria.placement, arrowProps: () => popoverAria.arrowProps }}\n    >\n      <FocusScope contain={shouldContainFocus()} restoreFocus>\n        <div\n          {...domProps()}\n          {...cleanPopoverProps()}\n          ref={popoverRef}\n          id={overlayId()}\n          role={shouldBeDialog() ? \"dialog\" : undefined}\n          tabIndex={shouldBeDialog() ? -1 : undefined}\n          class={renderProps.class()}\n          style={mergedStyle()}\n          data-trigger={resolvedTrigger()}\n          data-placement={popoverAria.placement()}\n          data-entering={dataAttr(local.isEntering)}\n          data-exiting={dataAttr(local.isExiting)}\n        >\n          <Show when={!local.isNonModal}>\n            <PopoverDismissButton onDismiss={close} />\n          </Show>\n          {renderProps.renderChildren()}\n          <PopoverDismissButton onDismiss={close} />\n        </div>\n      </FocusScope>\n    </PopoverContext.Provider>\n  );\n\n  const underlay = () => (\n    <div\n      data-testid=\"underlay\"\n      {...(popoverAria.underlayProps as unknown as JSX.HTMLAttributes<HTMLDivElement>)}\n      style={{ position: \"fixed\", inset: 0 }}\n    />\n  );\n\n  return (\n    <Show when={isHydrated() && (isOpen() || local.isExiting)}>\n      <Portal mount={portalContainer()}>\n        <Show when={!local.isNonModal && !isSubPopover() && isOpen()}>{underlay()}</Show>\n        <Show\n          when={isSubPopover()}\n          fallback={\n            <div ref={setGroupRef} style={{ display: \"contents\" }}>\n              <PopoverGroupContext.Provider value={() => groupRef()}>\n                {overlay()}\n              </PopoverGroupContext.Provider>\n            </div>\n          }\n        >\n          {overlay()}\n        </Show>\n      </Portal>\n    </Show>\n  );\n}\n\nexport interface OverlayArrowProps {\n  /** The children - should be an SVG or element for the arrow. */\n  children?: JSX.Element;\n  /** Render function used when Solid children accessors would be ambiguous. */\n  render?: () => JSX.Element;\n  /** The CSS className. */\n  class?: string;\n  /** The inline style. */\n  style?: JSX.CSSProperties;\n}\n\n/**\n * An arrow element that points towards the trigger.\n */\nexport function OverlayArrow(props: OverlayArrowProps): JSX.Element {\n  const popoverContext = useContext(PopoverContext);\n  const placement = () => popoverContext?.placement() ?? null;\n\n  // Mirror react-aria-components' OverlayArrow: the wrapper positions itself\n  // absolutely against the popover edge (`[placement]: '100%'`) and takes the\n  // cross-axis offset (`left`/`top`) from the overlay's computed `arrowProps`.\n  // No `aria-hidden`/`role=\"presentation\"` — upstream leaves the arrow in the\n  // accessibility tree (the arrow SVG surfaces as an unlabeled `img`), matching\n  // S2's `<OverlayArrow className=\"\">`. The styled layer therefore passes no\n  // positioning class of its own.\n  const mergedStyle = (): JSX.CSSProperties => {\n    const currentPlacement = placement();\n    // Mirror react-aria-components' OverlayArrow: the reported `arrowProps`\n    // offset (`left`/`top`) points at the arrow's CENTER, so the wrapper must be\n    // pulled back by half its size to center on that point — horizontally for\n    // top/bottom placements, vertically for left/right. Omitting this shifts the\n    // arrow off by half its width/height (a self-inflicted divergence).\n    const style: JSX.CSSProperties = {\n      position: \"absolute\",\n      transform:\n        currentPlacement === \"top\" || currentPlacement === \"bottom\"\n          ? \"translateX(-50%)\"\n          : \"translateY(-50%)\",\n    };\n    if (currentPlacement != null) {\n      (style as Record<string, string>)[currentPlacement] = \"100%\";\n    }\n\n    const contextStyle = (popoverContext?.arrowProps() as Record<string, unknown> | undefined)\n      ?.style as (JSX.CSSProperties & Record<string, unknown>) | undefined;\n    if (typeof contextStyle?.left === \"string\") {\n      style.left = contextStyle.left;\n    }\n    if (typeof contextStyle?.top === \"string\") {\n      style.top = contextStyle.top;\n    }\n\n    const localStyle =\n      props.style &&\n      !(typeof CSSStyleDeclaration !== \"undefined\" && props.style instanceof CSSStyleDeclaration)\n        ? props.style\n        : undefined;\n\n    return {\n      ...style,\n      ...localStyle,\n    };\n  };\n\n  return (\n    <div class={props.class} style={mergedStyle()} data-placement={placement()}>\n      {props.render ? props.render() : props.children}\n    </div>\n  );\n}\n\nexport default Popover;\n"],"mappings":"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"}

package/dist/Pressable.js

@@ -0,0 +1,69 @@
+import { memo } from "solid-js/web";
+import { children, createEffect, onCleanup, splitProps } from "solid-js";
+import { createFocusable, createPress } from "@proyecto-viviana/solidaria";
+//#region src/Pressable.tsx
+/**
+* Pressable component for solidaria-components
+*
+* A render-prop component that wraps createPress + createFocusable
+* to make an element pressable. Port of React Aria's Pressable.
+*/
+/**
+* Makes its child element pressable and focusable.
+* Combines createPress and createFocusable for full interaction support.
+*
+* @example
+* ```tsx
+* <Pressable onPress={() => console.log('pressed')}>
+*   <div role="button" tabIndex={0}>Click me</div>
+* </Pressable>
+* ```
+*/
+function Pressable(props) {
+	const [local, pressProps] = splitProps(props, ["children", "ref"]);
+	let ref;
+	const { pressProps: domPressProps } = createPress(pressProps);
+	const { focusableProps: domFocusableProps } = createFocusable(pressProps, () => ref);
+	const resolved = children(() => local.children);
+	createEffect(() => {
+		const child = resolved();
+		if (child instanceof HTMLElement) {
+			ref = child;
+			if (typeof local.ref === "function") local.ref(child);
+			const allProps = {
+				...domFocusableProps,
+				...domPressProps
+			};
+			const listeners = [];
+			for (const [key, handler] of Object.entries(allProps)) if (key.startsWith("on") && typeof handler === "function") {
+				const eventName = key.slice(2).toLowerCase();
+				const listener = handler;
+				child.addEventListener(eventName, listener);
+				listeners.push([eventName, listener]);
+			}
+			for (const [key, value] of Object.entries(allProps)) {
+				if (key === "ref" || key.startsWith("on") && typeof value === "function") continue;
+				if (key === "tabIndex") {
+					if (child.hasAttribute("tabindex")) continue;
+					if (value == null || value === false) child.removeAttribute("tabindex");
+					else child.tabIndex = Number(value);
+					continue;
+				}
+				if (key.startsWith("aria-") || key.startsWith("data-") || key === "id" || key === "role") {
+					if (child.hasAttribute(key)) continue;
+					if (value == null || value === false) child.removeAttribute(key);
+					else if (value === true) child.setAttribute(key, "");
+					else child.setAttribute(key, String(value));
+				}
+			}
+			onCleanup(() => {
+				for (const [eventName, listener] of listeners) child.removeEventListener(eventName, listener);
+			});
+		}
+	});
+	return memo(resolved);
+}
+//#endregion
+export { Pressable };
+
+//# sourceMappingURL=Pressable.js.map

package/dist/Pressable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pressable.js","names":["JSX","children","resolveChildren","createEffect","onCleanup","splitProps","createPress","createFocusable","CreatePressProps","CreateFocusableProps","PressableProps","Element","ref","HTMLElement","el","Pressable","props","local","pressProps","domPressProps","focusableProps","domFocusableProps","resolved","child","allProps","listeners","Array","EventListener","key","handler","Object","entries","startsWith","eventName","slice","toLowerCase","listener","addEventListener","push","value","hasAttribute","removeAttribute","tabIndex","Number","setAttribute","String","removeEventListener","_$memo"],"sources":["../src/Pressable.tsx"],"sourcesContent":["/**\n * Pressable component for solidaria-components\n *\n * A render-prop component that wraps createPress + createFocusable\n * to make an element pressable. Port of React Aria's Pressable.\n */\n\nimport {\n  type JSX,\n  children as resolveChildren,\n  createEffect,\n  onCleanup,\n  splitProps,\n} from \"solid-js\";\nimport {\n  createPress,\n  createFocusable,\n  type CreatePressProps,\n  type CreateFocusableProps,\n} from \"@proyecto-viviana/solidaria\";\n\nexport interface PressableProps extends CreatePressProps {\n  /** A single child element to make pressable. */\n  children: JSX.Element;\n  /** Ref callback. */\n  ref?: HTMLElement | ((el: HTMLElement) => void);\n}\n\n/**\n * Makes its child element pressable and focusable.\n * Combines createPress and createFocusable for full interaction support.\n *\n * @example\n * ```tsx\n * <Pressable onPress={() => console.log('pressed')}>\n *   <div role=\"button\" tabIndex={0}>Click me</div>\n * </Pressable>\n * ```\n */\nexport function Pressable(props: PressableProps): JSX.Element {\n  const [local, pressProps] = splitProps(props, [\"children\", \"ref\"]);\n\n  let ref!: HTMLElement;\n  const { pressProps: domPressProps } = createPress(pressProps);\n  const { focusableProps: domFocusableProps } = createFocusable(\n    pressProps as CreateFocusableProps,\n    () => ref,\n  );\n\n  const resolved = resolveChildren(() => local.children);\n\n  createEffect(() => {\n    const child = resolved() as HTMLElement;\n    if (child instanceof HTMLElement) {\n      ref = child;\n      if (typeof local.ref === \"function\") {\n        local.ref(child);\n      }\n\n      // Apply press props\n      const allProps = { ...domFocusableProps, ...domPressProps };\n      const listeners: Array<[string, EventListener]> = [];\n      for (const [key, handler] of Object.entries(allProps)) {\n        if (key.startsWith(\"on\") && typeof handler === \"function\") {\n          const eventName = key.slice(2).toLowerCase();\n          const listener = handler as EventListener;\n          child.addEventListener(eventName, listener);\n          listeners.push([eventName, listener]);\n        }\n      }\n\n      // Apply non-event press/focusable props (e.g. tabIndex/data attrs).\n      // Keep explicit child tabIndex to mirror mergeProps(child.props precedence).\n      for (const [key, value] of Object.entries(allProps)) {\n        if (key === \"ref\" || (key.startsWith(\"on\") && typeof value === \"function\")) continue;\n\n        if (key === \"tabIndex\") {\n          if (child.hasAttribute(\"tabindex\")) continue;\n          if (value == null || value === false) {\n            child.removeAttribute(\"tabindex\");\n          } else {\n            child.tabIndex = Number(value);\n          }\n          continue;\n        }\n\n        if (key.startsWith(\"aria-\") || key.startsWith(\"data-\") || key === \"id\" || key === \"role\") {\n          if (child.hasAttribute(key)) continue;\n          if (value == null || value === false) {\n            child.removeAttribute(key);\n          } else if (value === true) {\n            child.setAttribute(key, \"\");\n          } else {\n            child.setAttribute(key, String(value));\n          }\n        }\n      }\n\n      onCleanup(() => {\n        for (const [eventName, listener] of listeners) {\n          child.removeEventListener(eventName, listener);\n        }\n      });\n    }\n  });\n\n  return <>{resolved()}</>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAuCA,SAAgBe,UAAUC,OAAoC;CAC5D,MAAM,CAACC,OAAOC,cAAcb,WAAWW,OAAO,CAAC,YAAY,KAAK,CAAC;CAEjE,IAAIJ;CACJ,MAAM,EAAEM,YAAYC,kBAAkBb,YAAYY,UAAU;CAC5D,MAAM,EAAEE,gBAAgBC,sBAAsBd,gBAC5CW,kBACMN,GACR;CAEA,MAAMU,WAAWpB,eAAsBe,MAAMhB,QAAQ;CAErDE,mBAAmB;EACjB,MAAMoB,QAAQD,SAAS;EACvB,IAAIC,iBAAiBV,aAAa;GAChCD,MAAMW;GACN,IAAI,OAAON,MAAML,QAAQ,YACvBK,MAAML,IAAIW,KAAK;GAIjB,MAAMC,WAAW;IAAE,GAAGH;IAAmB,GAAGF;GAAc;GAC1D,MAAMM,YAA4C,CAAA;GAClD,KAAK,MAAM,CAACG,KAAKC,YAAYC,OAAOC,QAAQP,QAAQ,GAClD,IAAII,IAAII,WAAW,IAAI,KAAK,OAAOH,YAAY,YAAY;IACzD,MAAMI,YAAYL,IAAIM,MAAM,CAAC,CAAC,CAACC,YAAY;IAC3C,MAAMC,WAAWP;IACjBN,MAAMc,iBAAiBJ,WAAWG,QAAQ;IAC1CX,UAAUa,KAAK,CAACL,WAAWG,QAAQ,CAAC;GACtC;GAKF,KAAK,MAAM,CAACR,KAAKW,UAAUT,OAAOC,QAAQP,QAAQ,GAAG;IACnD,IAAII,QAAQ,SAAUA,IAAII,WAAW,IAAI,KAAK,OAAOO,UAAU,YAAa;IAE5E,IAAIX,QAAQ,YAAY;KACtB,IAAIL,MAAMiB,aAAa,UAAU,GAAG;KACpC,IAAID,SAAS,QAAQA,UAAU,OAC7BhB,MAAMkB,gBAAgB,UAAU;UAEhClB,MAAMmB,WAAWC,OAAOJ,KAAK;KAE/B;IACF;IAEA,IAAIX,IAAII,WAAW,OAAO,KAAKJ,IAAII,WAAW,OAAO,KAAKJ,QAAQ,QAAQA,QAAQ,QAAQ;KACxF,IAAIL,MAAMiB,aAAaZ,GAAG,GAAG;KAC7B,IAAIW,SAAS,QAAQA,UAAU,OAC7BhB,MAAMkB,gBAAgBb,GAAG;UACpB,IAAIW,UAAU,MACnBhB,MAAMqB,aAAahB,KAAK,EAAE;UAE1BL,MAAMqB,aAAahB,KAAKiB,OAAON,KAAK,CAAC;IAEzC;GACF;GAEAnC,gBAAgB;IACd,KAAK,MAAM,CAAC6B,WAAWG,aAAaX,WAClCF,MAAMuB,oBAAoBb,WAAWG,QAAQ;GAEjD,CAAC;EACH;CACF,CAAC;CAED,OAAAW,KAAUzB,QAAQ;AACpB"}

package/dist/Pressable.jsx

@@ -0,0 +1,68 @@
+import { children, createEffect, onCleanup, splitProps } from "solid-js";
+import { createFocusable, createPress } from "@proyecto-viviana/solidaria";
+//#region src/Pressable.tsx
+/**
+* Pressable component for solidaria-components
+*
+* A render-prop component that wraps createPress + createFocusable
+* to make an element pressable. Port of React Aria's Pressable.
+*/
+/**
+* Makes its child element pressable and focusable.
+* Combines createPress and createFocusable for full interaction support.
+*
+* @example
+* ```tsx
+* <Pressable onPress={() => console.log('pressed')}>
+*   <div role="button" tabIndex={0}>Click me</div>
+* </Pressable>
+* ```
+*/
+function Pressable(props) {
+	const [local, pressProps] = splitProps(props, ["children", "ref"]);
+	let ref;
+	const { pressProps: domPressProps } = createPress(pressProps);
+	const { focusableProps: domFocusableProps } = createFocusable(pressProps, () => ref);
+	const resolved = children(() => local.children);
+	createEffect(() => {
+		const child = resolved();
+		if (child instanceof HTMLElement) {
+			ref = child;
+			if (typeof local.ref === "function") local.ref(child);
+			const allProps = {
+				...domFocusableProps,
+				...domPressProps
+			};
+			const listeners = [];
+			for (const [key, handler] of Object.entries(allProps)) if (key.startsWith("on") && typeof handler === "function") {
+				const eventName = key.slice(2).toLowerCase();
+				const listener = handler;
+				child.addEventListener(eventName, listener);
+				listeners.push([eventName, listener]);
+			}
+			for (const [key, value] of Object.entries(allProps)) {
+				if (key === "ref" || key.startsWith("on") && typeof value === "function") continue;
+				if (key === "tabIndex") {
+					if (child.hasAttribute("tabindex")) continue;
+					if (value == null || value === false) child.removeAttribute("tabindex");
+					else child.tabIndex = Number(value);
+					continue;
+				}
+				if (key.startsWith("aria-") || key.startsWith("data-") || key === "id" || key === "role") {
+					if (child.hasAttribute(key)) continue;
+					if (value == null || value === false) child.removeAttribute(key);
+					else if (value === true) child.setAttribute(key, "");
+					else child.setAttribute(key, String(value));
+				}
+			}
+			onCleanup(() => {
+				for (const [eventName, listener] of listeners) child.removeEventListener(eventName, listener);
+			});
+		}
+	});
+	return <>{resolved()}</>;
+}
+//#endregion
+export { Pressable };
+
+//# sourceMappingURL=Pressable.jsx.map

package/dist/Pressable.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pressable.jsx","names":["resolveChildren"],"sources":["../src/Pressable.tsx"],"sourcesContent":["/**\n * Pressable component for solidaria-components\n *\n * A render-prop component that wraps createPress + createFocusable\n * to make an element pressable. Port of React Aria's Pressable.\n */\n\nimport {\n  type JSX,\n  children as resolveChildren,\n  createEffect,\n  onCleanup,\n  splitProps,\n} from \"solid-js\";\nimport {\n  createPress,\n  createFocusable,\n  type CreatePressProps,\n  type CreateFocusableProps,\n} from \"@proyecto-viviana/solidaria\";\n\nexport interface PressableProps extends CreatePressProps {\n  /** A single child element to make pressable. */\n  children: JSX.Element;\n  /** Ref callback. */\n  ref?: HTMLElement | ((el: HTMLElement) => void);\n}\n\n/**\n * Makes its child element pressable and focusable.\n * Combines createPress and createFocusable for full interaction support.\n *\n * @example\n * ```tsx\n * <Pressable onPress={() => console.log('pressed')}>\n *   <div role=\"button\" tabIndex={0}>Click me</div>\n * </Pressable>\n * ```\n */\nexport function Pressable(props: PressableProps): JSX.Element {\n  const [local, pressProps] = splitProps(props, [\"children\", \"ref\"]);\n\n  let ref!: HTMLElement;\n  const { pressProps: domPressProps } = createPress(pressProps);\n  const { focusableProps: domFocusableProps } = createFocusable(\n    pressProps as CreateFocusableProps,\n    () => ref,\n  );\n\n  const resolved = resolveChildren(() => local.children);\n\n  createEffect(() => {\n    const child = resolved() as HTMLElement;\n    if (child instanceof HTMLElement) {\n      ref = child;\n      if (typeof local.ref === \"function\") {\n        local.ref(child);\n      }\n\n      // Apply press props\n      const allProps = { ...domFocusableProps, ...domPressProps };\n      const listeners: Array<[string, EventListener]> = [];\n      for (const [key, handler] of Object.entries(allProps)) {\n        if (key.startsWith(\"on\") && typeof handler === \"function\") {\n          const eventName = key.slice(2).toLowerCase();\n          const listener = handler as EventListener;\n          child.addEventListener(eventName, listener);\n          listeners.push([eventName, listener]);\n        }\n      }\n\n      // Apply non-event press/focusable props (e.g. tabIndex/data attrs).\n      // Keep explicit child tabIndex to mirror mergeProps(child.props precedence).\n      for (const [key, value] of Object.entries(allProps)) {\n        if (key === \"ref\" || (key.startsWith(\"on\") && typeof value === \"function\")) continue;\n\n        if (key === \"tabIndex\") {\n          if (child.hasAttribute(\"tabindex\")) continue;\n          if (value == null || value === false) {\n            child.removeAttribute(\"tabindex\");\n          } else {\n            child.tabIndex = Number(value);\n          }\n          continue;\n        }\n\n        if (key.startsWith(\"aria-\") || key.startsWith(\"data-\") || key === \"id\" || key === \"role\") {\n          if (child.hasAttribute(key)) continue;\n          if (value == null || value === false) {\n            child.removeAttribute(key);\n          } else if (value === true) {\n            child.setAttribute(key, \"\");\n          } else {\n            child.setAttribute(key, String(value));\n          }\n        }\n      }\n\n      onCleanup(() => {\n        for (const [eventName, listener] of listeners) {\n          child.removeEventListener(eventName, listener);\n        }\n      });\n    }\n  });\n\n  return <>{resolved()}</>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAuCA,SAAgB,UAAU,OAAoC;CAC5D,MAAM,CAAC,OAAO,cAAc,WAAW,OAAO,CAAC,YAAY,KAAK,CAAC;CAEjE,IAAI;CACJ,MAAM,EAAE,YAAY,kBAAkB,YAAY,UAAU;CAC5D,MAAM,EAAE,gBAAgB,sBAAsB,gBAC5C,kBACM,GACR;CAEA,MAAM,WAAWA,eAAsB,MAAM,QAAQ;CAErD,mBAAmB;EACjB,MAAM,QAAQ,SAAS;EACvB,IAAI,iBAAiB,aAAa;GAChC,MAAM;GACN,IAAI,OAAO,MAAM,QAAQ,YACvB,MAAM,IAAI,KAAK;GAIjB,MAAM,WAAW;IAAE,GAAG;IAAmB,GAAG;GAAc;GAC1D,MAAM,YAA4C,CAAC;GACnD,KAAK,MAAM,CAAC,KAAK,YAAY,OAAO,QAAQ,QAAQ,GAClD,IAAI,IAAI,WAAW,IAAI,KAAK,OAAO,YAAY,YAAY;IACzD,MAAM,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,YAAY;IAC3C,MAAM,WAAW;IACjB,MAAM,iBAAiB,WAAW,QAAQ;IAC1C,UAAU,KAAK,CAAC,WAAW,QAAQ,CAAC;GACtC;GAKF,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,QAAQ,GAAG;IACnD,IAAI,QAAQ,SAAU,IAAI,WAAW,IAAI,KAAK,OAAO,UAAU,YAAa;IAE5E,IAAI,QAAQ,YAAY;KACtB,IAAI,MAAM,aAAa,UAAU,GAAG;KACpC,IAAI,SAAS,QAAQ,UAAU,OAC7B,MAAM,gBAAgB,UAAU;UAEhC,MAAM,WAAW,OAAO,KAAK;KAE/B;IACF;IAEA,IAAI,IAAI,WAAW,OAAO,KAAK,IAAI,WAAW,OAAO,KAAK,QAAQ,QAAQ,QAAQ,QAAQ;KACxF,IAAI,MAAM,aAAa,GAAG,GAAG;KAC7B,IAAI,SAAS,QAAQ,UAAU,OAC7B,MAAM,gBAAgB,GAAG;UACpB,IAAI,UAAU,MACnB,MAAM,aAAa,KAAK,EAAE;UAE1B,MAAM,aAAa,KAAK,OAAO,KAAK,CAAC;IAEzC;GACF;GAEA,gBAAgB;IACd,KAAK,MAAM,CAAC,WAAW,aAAa,WAClC,MAAM,oBAAoB,WAAW,QAAQ;GAEjD,CAAC;EACH;CACF,CAAC;CAED,OAAO,GAAG,SAAS,EAAE;AACvB"}

package/dist/ProgressBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../src/ProgressBar.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,GAAG,EAAiE,MAAM,UAAU,CAAC;AACnG,OAAO,EAAqB,KAAK,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAGf,MAAM,SAAS,CAAC;AAEjB,MAAM,WAAW,sBAAsB;IACrC,yEAAyE;IACzE,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,wCAAwC;IACxC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,iDAAiD;IACjD,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,EAAE,SAAS;IACvE,sBAAsB;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,yFAAyF;IACzF,QAAQ,CAAC,EAAE,cAAc,CAAC,sBAAsB,CAAC,CAAC;IAClD,yCAAyC;IACzC,KAAK,CAAC,EAAE,mBAAmB,CAAC,sBAAsB,CAAC,CAAC;IACpD,wCAAwC;IACxC,KAAK,CAAC,EAAE,eAAe,CAAC,sBAAsB,CAAC,CAAC;CACjD;AAED,eAAO,MAAM,kBAAkB,qDAA+C,CAAC;AAW/E;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA0FhE"}
+{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../src/ProgressBar.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,GAAG,EAAiE,MAAM,UAAU,CAAC;AACnG,OAAO,EAAqB,KAAK,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAGf,MAAM,SAAS,CAAC;AAEjB,MAAM,WAAW,sBAAsB;IACrC,yEAAyE;IACzE,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,wCAAwC;IACxC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,iDAAiD;IACjD,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,gBAAiB,SAAQ,oBAAoB,EAAE,SAAS;IACvE,sBAAsB;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,yFAAyF;IACzF,QAAQ,CAAC,EAAE,cAAc,CAAC,sBAAsB,CAAC,CAAC;IAClD,yCAAyC;IACzC,KAAK,CAAC,EAAE,mBAAmB,CAAC,sBAAsB,CAAC,CAAC;IACpD,wCAAwC;IACxC,KAAK,CAAC,EAAE,eAAe,CAAC,sBAAsB,CAAC,CAAC;CACjD;AAED,eAAO,MAAM,kBAAkB,qDAA+C,CAAC;AAW/E;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA4FhE"}