@proyecto-viviana/solidaria 0.4.2 → 0.6.0-rc.0

package/dist/_chunk/actiongroup.js

@@ -1,10 +1,29 @@
-import { i as mergeProps$1 } from "./env.js";
+/*
+* Copyright 2020 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts
+import { t as mergeProps } from "./mergeProps.js";
+import { t as onOwnedCleanup } from "./owner.js";
 import { t as filterDOMProps } from "./filterDOMProps.js";
-import { a as getEventTarget, p as isFocusable, t as focusSafely, y as nodeContains } from "./focus.js";
+import { f as isFocusable, r as getEventTarget, v as nodeContains, w as focusSafely } from "./dom.js";
 import { i as createButton } from "./button.js";
 import { i as useLocale } from "./locale.js";
-import { onCleanup } from "solid-js";
+import { createSignal } from "solid-js";
 //#region src/actiongroup/createActionGroup.ts
+/**
+* Ported from:
+* - packages/react-aria/src/actiongroup/useActionGroup.ts
+* - packages/react-aria/src/actiongroup/useActionGroupItem.ts
+*/
 const actionGroupData = /* @__PURE__ */ new WeakMap();
 const GROUP_ROLE_BY_MODE = {
 	none: "toolbar",
@@ -25,14 +44,10 @@ function isActionGroupDisabled(props, state) {
 function createActionGroup(props, state, _ref) {
 	const locale = useLocale();
 	let groupRef;
-	const applyRoleAttributes = () => {
-		if (!groupRef) return;
+	const [isInToolbar, setIsInToolbar] = createSignal(false, { ownedWrite: true });
+	const groupRole = () => {
 		const mappedRole = GROUP_ROLE_BY_MODE[state.selectionMode()];
-		const nestedToolbar = Boolean(groupRef.parentElement?.closest("[role=\"toolbar\"]"));
-		const role = mappedRole === "toolbar" && nestedToolbar ? "group" : mappedRole;
-		groupRef.setAttribute("role", role);
-		if (mappedRole === "toolbar" && !nestedToolbar) groupRef.setAttribute("aria-orientation", props.orientation ?? "horizontal");
-		else groupRef.removeAttribute("aria-orientation");
+		return mappedRole === "toolbar" && isInToolbar() ? "group" : mappedRole;
 	};
 	const getFocusableItems = (root) => {
 		const out = [];
@@ -76,15 +91,24 @@ function createActionGroup(props, state, _ref) {
 				return;
 		}
 	};
-	const actionGroupProps = mergeProps$1(filterDOMProps(props, { labelable: true }), {
+	const actionGroupProps = mergeProps(filterDOMProps(props, { labelable: true }), {
 		ref: (el) => {
 			groupRef = el;
-			applyRoleAttributes();
+			const detectNestedToolbar = () => {
+				setIsInToolbar(Boolean(el.parentElement?.closest("[role=\"toolbar\"]")));
+			};
+			detectNestedToolbar();
 			queueMicrotask(() => {
 				if (!groupRef) return;
-				applyRoleAttributes();
+				detectNestedToolbar();
 			});
 		},
+		get role() {
+			return groupRole();
+		},
+		get "aria-orientation"() {
+			return groupRole() === "toolbar" ? props.orientation ?? "horizontal" : void 0;
+		},
 		onKeyDown,
 		get "aria-label"() {
 			return props["aria-label"];
@@ -93,13 +117,13 @@ function createActionGroup(props, state, _ref) {
 			return props["aria-label"] ? void 0 : props["aria-labelledby"];
 		},
 		get "aria-disabled"() {
-			return isActionGroupDisabled(props, state) || void 0;
+			return isActionGroupDisabled(props, state) ? "true" : void 0;
 		}
 	});
 	actionGroupData.set(state, { get onAction() {
 		return props.onAction;
 	} });
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		actionGroupData.delete(state);
 	});
 	return { actionGroupProps };
@@ -107,7 +131,7 @@ function createActionGroup(props, state, _ref) {
 function createActionGroupItem(props, state) {
 	const button = createButton({
 		elementType: "button",
-		isDisabled: state.isDisabled(props.key),
+		isDisabled: () => state.isDisabled(props.key),
 		onPress: () => {
 			state.setFocusedKey(props.key);
 			actionGroupData.get(state)?.onAction?.(props.key);
@@ -115,16 +139,16 @@ function createActionGroupItem(props, state) {
 		}
 	});
 	const isFocused = () => props.key === state.focusedKey();
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		if (isFocused()) state.setFocusedKey(null);
 	});
-	return { buttonProps: mergeProps$1(button.buttonProps, {
+	return { buttonProps: mergeProps(button.buttonProps, {
 		get role() {
 			return ITEM_ROLE_BY_MODE[state.selectionMode()];
 		},
 		get "aria-checked"() {
 			if (state.selectionMode() === "none") return void 0;
-			return state.isSelected(props.key);
+			return state.isSelected(props.key) ? "true" : "false";
 		},
 		get tabIndex() {
 			return isFocused() || state.focusedKey() == null ? 0 : -1;

package/dist/_chunk/actiongroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"actiongroup.js","names":["mergeProps"],"sources":["../../src/actiongroup/createActionGroup.ts"],"sourcesContent":["import { onCleanup, type JSX, type Accessor } from \"solid-js\";\nimport { createButton } from \"../button\";\nimport {\n  filterDOMProps,\n  getEventTarget,\n  mergeProps,\n  nodeContains,\n  isFocusable,\n  focusSafely,\n} from \"../utils\";\nimport { useLocale } from \"../i18n\";\nimport type { Orientation } from \"../toolbar\";\nimport type { Key, ListState } from \"@proyecto-viviana/solid-stately\";\n\nexport interface AriaActionGroupProps<T = unknown> {\n  /** List items (optional, parity with React Aria prop shape). */\n  items?: T[];\n  /** Whether the whole action group is disabled. */\n  isDisabled?: boolean;\n  /** Group orientation. */\n  orientation?: Orientation;\n  /** Accessible label. */\n  \"aria-label\"?: string;\n  /** Labelled-by id. */\n  \"aria-labelledby\"?: string;\n  /** Handler called when an item action is triggered. */\n  onAction?: (key: Key) => void;\n}\n\nexport interface ActionGroupAria {\n  actionGroupProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nexport interface AriaActionGroupItemProps {\n  key: Key;\n}\n\nexport interface ActionGroupItemAria {\n  buttonProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\ninterface ActionGroupData {\n  onAction?: (key: Key) => void;\n}\n\nconst actionGroupData = new WeakMap<object, ActionGroupData>();\n\nconst GROUP_ROLE_BY_MODE = {\n  none: \"toolbar\",\n  single: \"radiogroup\",\n  multiple: \"toolbar\",\n} as const;\n\nconst ITEM_ROLE_BY_MODE = {\n  none: undefined,\n  single: \"radio\",\n  multiple: \"checkbox\",\n} as const;\n\nfunction isActionGroupDisabled<T>(props: AriaActionGroupProps<T>, state: ListState<T>): boolean {\n  if (props.isDisabled) return true;\n  const keys = [...state.collection().getKeys()];\n  if (keys.length === 0) return true;\n  return !keys.some((key) => !state.isDisabled(key));\n}\n\nexport function createActionGroup<T>(\n  props: AriaActionGroupProps<T>,\n  state: ListState<T>,\n  _ref?: Accessor<HTMLElement | null>,\n): ActionGroupAria {\n  const locale = useLocale();\n  let groupRef: HTMLElement | undefined;\n  const applyRoleAttributes = (): void => {\n    if (!groupRef) return;\n    const selectionMode = state.selectionMode();\n    const mappedRole = GROUP_ROLE_BY_MODE[selectionMode];\n    const nestedToolbar = Boolean(groupRef.parentElement?.closest('[role=\"toolbar\"]'));\n    const role = mappedRole === \"toolbar\" && nestedToolbar ? \"group\" : mappedRole;\n    groupRef.setAttribute(\"role\", role);\n    if (mappedRole === \"toolbar\" && !nestedToolbar) {\n      groupRef.setAttribute(\"aria-orientation\", props.orientation ?? \"horizontal\");\n    } else {\n      groupRef.removeAttribute(\"aria-orientation\");\n    }\n  };\n\n  const getFocusableItems = (root: HTMLElement): HTMLElement[] => {\n    const out: HTMLElement[] = [];\n    const pushIfFocusable = (el: Element | null | undefined): void => {\n      if (!el || !(el instanceof HTMLElement)) return;\n      if (isFocusable(el) && el.getAttribute(\"aria-disabled\") !== \"true\") {\n        out.push(el);\n      }\n    };\n\n    pushIfFocusable(root);\n    for (const node of root.querySelectorAll(\"*\")) {\n      pushIfFocusable(node);\n    }\n    return out;\n  };\n\n  const focusRelative = (\n    root: HTMLElement,\n    direction: \"next\" | \"previous\",\n  ): HTMLElement | null => {\n    const focusables = getFocusableItems(root);\n    if (focusables.length === 0) return null;\n\n    const active = root.ownerDocument.activeElement as HTMLElement | null;\n    const currentIndex = active ? focusables.indexOf(active) : -1;\n    const delta = direction === \"next\" ? 1 : -1;\n    const nextIndex =\n      currentIndex === -1\n        ? direction === \"next\"\n          ? 0\n          : focusables.length - 1\n        : (currentIndex + delta + focusables.length) % focusables.length;\n    const next = focusables[nextIndex];\n    focusSafely(next);\n    return next;\n  };\n\n  // Mirrors react-aria `useActionGroup.onKeyDown` (3.50.0): only the four arrows\n  // are handled and they are ORIENTATION-AGNOSTIC — ArrowRight/ArrowDown always\n  // move next, ArrowLeft/ArrowUp always move previous (orientation only drives\n  // `aria-orientation`). `flipDirection` swaps ArrowRight/ArrowLeft under RTL for\n  // horizontal groups. No Home/End (they fall through to the browser). Focus\n  // moves via `focusRelative` → `focusSafely` → the item's own `onFocus`, which\n  // sets the focused key — so there is no selection-follows-focus here.\n  const onKeyDown: JSX.EventHandler<HTMLElement, KeyboardEvent> = (e) => {\n    const root = groupRef;\n    if (!root || isActionGroupDisabled(props, state)) return;\n    if (!nodeContains(e.currentTarget, getEventTarget(e))) return;\n\n    const orientation = props.orientation ?? \"horizontal\";\n    const flipDirection = locale().direction === \"rtl\" && orientation === \"horizontal\";\n\n    switch (e.key) {\n      case \"ArrowRight\":\n      case \"ArrowDown\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowRight\" && flipDirection) {\n          focusRelative(root, \"previous\");\n        } else {\n          focusRelative(root, \"next\");\n        }\n        return;\n      }\n      case \"ArrowLeft\":\n      case \"ArrowUp\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowLeft\" && flipDirection) {\n          focusRelative(root, \"next\");\n        } else {\n          focusRelative(root, \"previous\");\n        }\n        return;\n      }\n    }\n  };\n\n  const actionGroupProps: JSX.HTMLAttributes<HTMLElement> = mergeProps(\n    filterDOMProps(props as Record<string, unknown>, { labelable: true }),\n    {\n      ref: (el: HTMLElement) => {\n        groupRef = el;\n        applyRoleAttributes();\n        queueMicrotask(() => {\n          if (!groupRef) return;\n          applyRoleAttributes();\n        });\n      },\n      onKeyDown,\n      get \"aria-label\"() {\n        return props[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return props[\"aria-label\"] ? undefined : props[\"aria-labelledby\"];\n      },\n      get \"aria-disabled\"() {\n        return isActionGroupDisabled(props, state) || undefined;\n      },\n    },\n  );\n\n  actionGroupData.set(state, {\n    get onAction() {\n      return props.onAction;\n    },\n  });\n\n  onCleanup(() => {\n    actionGroupData.delete(state);\n  });\n\n  return { actionGroupProps };\n}\n\nexport function createActionGroupItem<T>(\n  props: AriaActionGroupItemProps,\n  state: ListState<T>,\n): ActionGroupItemAria {\n  const button = createButton({\n    elementType: \"button\",\n    isDisabled: state.isDisabled(props.key),\n    onPress: () => {\n      state.setFocusedKey(props.key);\n      actionGroupData.get(state)?.onAction?.(props.key);\n      if (state.selectionMode() !== \"none\") {\n        state.select(props.key);\n      }\n    },\n  });\n\n  const isFocused = () => props.key === state.focusedKey();\n\n  onCleanup(() => {\n    if (isFocused()) {\n      state.setFocusedKey(null);\n    }\n  });\n\n  const buttonProps: JSX.HTMLAttributes<HTMLElement> = mergeProps(button.buttonProps, {\n    get role() {\n      return ITEM_ROLE_BY_MODE[state.selectionMode()];\n    },\n    get \"aria-checked\"() {\n      const mode = state.selectionMode();\n      if (mode === \"none\") return undefined;\n      return state.isSelected(props.key);\n    },\n    // Mirrors react-aria `useActionGroupItem` (3.50.0): every enabled item is\n    // tabbable until focus engages the group, then the roving stop follows the\n    // focused key. There is NO single default tab stop and NO selection bias —\n    // disabled items are made non-tabbable by their native `disabled` attribute\n    // (via createButton), not by this getter.\n    get tabIndex() {\n      return isFocused() || state.focusedKey() == null ? 0 : -1;\n    },\n    \"data-key\": String(props.key),\n    onFocus: () => {\n      state.setFocusedKey(props.key);\n    },\n  });\n\n  return { buttonProps };\n}\n"],"mappings":"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"}
+{"version":3,"file":"actiongroup.js","names":[],"sources":["../../src/actiongroup/createActionGroup.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts\n\n/**\n * Ported from:\n * - packages/react-aria/src/actiongroup/useActionGroup.ts\n * - packages/react-aria/src/actiongroup/useActionGroupItem.ts\n */\n\nimport {\n  filterDOMProps,\n  getEventTarget,\n  mergeProps,\n  nodeContains,\n  isFocusable,\n  focusSafely,\n  onOwnedCleanup,\n} from \"../utils\";\nimport { createSignal } from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { createButton } from \"../button\";\nimport { useLocale } from \"../i18n\";\nimport type { Orientation } from \"../toolbar\";\nimport type { Key, ListState } from \"@proyecto-viviana/solid-stately\";\n\nexport interface AriaActionGroupProps<T = unknown> {\n  /** List items (optional, parity with React Aria prop shape). */\n  items?: T[];\n  /** Whether the whole action group is disabled. */\n  isDisabled?: boolean;\n  /** Group orientation. */\n  orientation?: Orientation;\n  /** Accessible label. */\n  \"aria-label\"?: string;\n  /** Labelled-by id. */\n  \"aria-labelledby\"?: string;\n  /** Handler called when an item action is triggered. */\n  onAction?: (key: Key) => void;\n}\n\nexport interface ActionGroupAria {\n  actionGroupProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nexport interface AriaActionGroupItemProps {\n  key: Key;\n}\n\nexport interface ActionGroupItemAria {\n  buttonProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\ninterface ActionGroupData {\n  onAction?: (key: Key) => void;\n}\n\nconst actionGroupData = new WeakMap<object, ActionGroupData>();\n\nconst GROUP_ROLE_BY_MODE = {\n  none: \"toolbar\",\n  single: \"radiogroup\",\n  multiple: \"toolbar\",\n} as const;\n\nconst ITEM_ROLE_BY_MODE = {\n  none: undefined,\n  single: \"radio\",\n  multiple: \"checkbox\",\n} as const;\n\nfunction isActionGroupDisabled<T>(props: AriaActionGroupProps<T>, state: ListState<T>): boolean {\n  if (props.isDisabled) return true;\n  const keys = [...state.collection().getKeys()];\n  if (keys.length === 0) return true;\n  return !keys.some((key) => !state.isDisabled(key));\n}\n\nexport function createActionGroup<T>(\n  props: AriaActionGroupProps<T>,\n  state: ListState<T>,\n  _ref?: Accessor<HTMLElement | null>,\n): ActionGroupAria {\n  const locale = useLocale();\n  let groupRef: HTMLElement | undefined;\n  const [isInToolbar, setIsInToolbar] = createSignal(false, { ownedWrite: true });\n  const groupRole = (): string => {\n    const mappedRole = GROUP_ROLE_BY_MODE[state.selectionMode()];\n    return mappedRole === \"toolbar\" && isInToolbar() ? \"group\" : mappedRole;\n  };\n\n  const getFocusableItems = (root: HTMLElement): HTMLElement[] => {\n    const out: HTMLElement[] = [];\n    const pushIfFocusable = (el: Element | null | undefined): void => {\n      if (!el || !(el instanceof HTMLElement)) return;\n      if (isFocusable(el) && el.getAttribute(\"aria-disabled\") !== \"true\") {\n        out.push(el);\n      }\n    };\n\n    pushIfFocusable(root);\n    for (const node of root.querySelectorAll(\"*\")) {\n      pushIfFocusable(node);\n    }\n    return out;\n  };\n\n  const focusRelative = (root: HTMLElement, direction: \"next\" | \"previous\"): HTMLElement | null => {\n    const focusables = getFocusableItems(root);\n    if (focusables.length === 0) return null;\n\n    const active = root.ownerDocument.activeElement as HTMLElement | null;\n    const currentIndex = active ? focusables.indexOf(active) : -1;\n    const delta = direction === \"next\" ? 1 : -1;\n    const nextIndex =\n      currentIndex === -1\n        ? direction === \"next\"\n          ? 0\n          : focusables.length - 1\n        : (currentIndex + delta + focusables.length) % focusables.length;\n    const next = focusables[nextIndex];\n    focusSafely(next);\n    return next;\n  };\n\n  // Mirrors react-aria `useActionGroup.onKeyDown` (3.50.0): only the four arrows\n  // are handled and they are ORIENTATION-AGNOSTIC — ArrowRight/ArrowDown always\n  // move next, ArrowLeft/ArrowUp always move previous (orientation only drives\n  // `aria-orientation`). `flipDirection` swaps ArrowRight/ArrowLeft under RTL for\n  // horizontal groups. No Home/End (they fall through to the browser). Focus\n  // moves via `focusRelative` → `focusSafely` → the item's own `onFocus`, which\n  // sets the focused key — so there is no selection-follows-focus here.\n  const onKeyDown: JSX.EventHandler<HTMLElement, KeyboardEvent> = (e) => {\n    const root = groupRef;\n    if (!root || isActionGroupDisabled(props, state)) return;\n    if (!nodeContains(e.currentTarget, getEventTarget(e))) return;\n\n    const orientation = props.orientation ?? \"horizontal\";\n    const flipDirection = locale().direction === \"rtl\" && orientation === \"horizontal\";\n\n    switch (e.key) {\n      case \"ArrowRight\":\n      case \"ArrowDown\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowRight\" && flipDirection) {\n          focusRelative(root, \"previous\");\n        } else {\n          focusRelative(root, \"next\");\n        }\n        return;\n      }\n      case \"ArrowLeft\":\n      case \"ArrowUp\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowLeft\" && flipDirection) {\n          focusRelative(root, \"next\");\n        } else {\n          focusRelative(root, \"previous\");\n        }\n        return;\n      }\n    }\n  };\n\n  const actionGroupProps = mergeProps(\n    filterDOMProps(props as Record<string, unknown>, { labelable: true }),\n    {\n      ref: (el: HTMLElement) => {\n        groupRef = el;\n        const detectNestedToolbar = (): void => {\n          setIsInToolbar(Boolean(el.parentElement?.closest('[role=\"toolbar\"]')));\n        };\n        detectNestedToolbar();\n        queueMicrotask(() => {\n          if (!groupRef) return;\n          detectNestedToolbar();\n        });\n      },\n      get role() {\n        return groupRole();\n      },\n      get \"aria-orientation\"() {\n        return groupRole() === \"toolbar\" ? (props.orientation ?? \"horizontal\") : undefined;\n      },\n      onKeyDown,\n      get \"aria-label\"() {\n        return props[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return props[\"aria-label\"] ? undefined : props[\"aria-labelledby\"];\n      },\n      get \"aria-disabled\"() {\n        return isActionGroupDisabled(props, state) ? \"true\" : undefined;\n      },\n    },\n  );\n\n  actionGroupData.set(state, {\n    get onAction() {\n      return props.onAction;\n    },\n  });\n\n  onOwnedCleanup(() => {\n    actionGroupData.delete(state);\n  });\n\n  return { actionGroupProps: actionGroupProps as JSX.HTMLAttributes<HTMLElement> };\n}\n\nexport function createActionGroupItem<T>(\n  props: AriaActionGroupItemProps,\n  state: ListState<T>,\n): ActionGroupItemAria {\n  const button = createButton({\n    elementType: \"button\",\n    isDisabled: () => state.isDisabled(props.key),\n    onPress: () => {\n      state.setFocusedKey(props.key);\n      actionGroupData.get(state)?.onAction?.(props.key);\n      if (state.selectionMode() !== \"none\") {\n        state.select(props.key);\n      }\n    },\n  });\n\n  const isFocused = () => props.key === state.focusedKey();\n\n  onOwnedCleanup(() => {\n    if (isFocused()) {\n      state.setFocusedKey(null);\n    }\n  });\n\n  const buttonProps: JSX.HTMLAttributes<HTMLElement> = mergeProps(button.buttonProps, {\n    get role() {\n      return ITEM_ROLE_BY_MODE[state.selectionMode()];\n    },\n    get \"aria-checked\"() {\n      const mode = state.selectionMode();\n      if (mode === \"none\") return undefined;\n      return state.isSelected(props.key) ? \"true\" : \"false\";\n    },\n    // Mirrors react-aria `useActionGroupItem` (3.50.0): every enabled item is\n    // tabbable until focus engages the group, then the roving stop follows the\n    // focused key. There is NO single default tab stop and NO selection bias —\n    // disabled items are made non-tabbable by their native `disabled` attribute\n    // (via createButton), not by this getter.\n    get tabIndex() {\n      return isFocused() || state.focusedKey() == null ? 0 : -1;\n    },\n    \"data-key\": String(props.key),\n    onFocus: () => {\n      state.setFocusedKey(props.key);\n    },\n  });\n\n  return { buttonProps };\n}\n"],"mappings":"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"}

package/dist/_chunk/actiongroup.jsx

@@ -1,10 +1,29 @@
-import { i as mergeProps$1 } from "./env.jsx";
+/*
+* Copyright 2020 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts
+import { t as mergeProps } from "./mergeProps.jsx";
+import { t as onOwnedCleanup } from "./owner.jsx";
 import { t as filterDOMProps } from "./filterDOMProps.jsx";
-import { a as getEventTarget, p as isFocusable, t as focusSafely, y as nodeContains } from "./focus.jsx";
+import { f as isFocusable, r as getEventTarget, v as nodeContains, w as focusSafely } from "./dom.jsx";
 import { i as createButton } from "./button.jsx";
 import { i as useLocale } from "./locale.jsx";
-import { onCleanup } from "solid-js";
+import { createSignal } from "solid-js";
 //#region src/actiongroup/createActionGroup.ts
+/**
+* Ported from:
+* - packages/react-aria/src/actiongroup/useActionGroup.ts
+* - packages/react-aria/src/actiongroup/useActionGroupItem.ts
+*/
 const actionGroupData = /* @__PURE__ */ new WeakMap();
 const GROUP_ROLE_BY_MODE = {
 	none: "toolbar",
@@ -25,14 +44,10 @@ function isActionGroupDisabled(props, state) {
 function createActionGroup(props, state, _ref) {
 	const locale = useLocale();
 	let groupRef;
-	const applyRoleAttributes = () => {
-		if (!groupRef) return;
+	const [isInToolbar, setIsInToolbar] = createSignal(false, { ownedWrite: true });
+	const groupRole = () => {
 		const mappedRole = GROUP_ROLE_BY_MODE[state.selectionMode()];
-		const nestedToolbar = Boolean(groupRef.parentElement?.closest("[role=\"toolbar\"]"));
-		const role = mappedRole === "toolbar" && nestedToolbar ? "group" : mappedRole;
-		groupRef.setAttribute("role", role);
-		if (mappedRole === "toolbar" && !nestedToolbar) groupRef.setAttribute("aria-orientation", props.orientation ?? "horizontal");
-		else groupRef.removeAttribute("aria-orientation");
+		return mappedRole === "toolbar" && isInToolbar() ? "group" : mappedRole;
 	};
 	const getFocusableItems = (root) => {
 		const out = [];
@@ -76,15 +91,24 @@ function createActionGroup(props, state, _ref) {
 				return;
 		}
 	};
-	const actionGroupProps = mergeProps$1(filterDOMProps(props, { labelable: true }), {
+	const actionGroupProps = mergeProps(filterDOMProps(props, { labelable: true }), {
 		ref: (el) => {
 			groupRef = el;
-			applyRoleAttributes();
+			const detectNestedToolbar = () => {
+				setIsInToolbar(Boolean(el.parentElement?.closest("[role=\"toolbar\"]")));
+			};
+			detectNestedToolbar();
 			queueMicrotask(() => {
 				if (!groupRef) return;
-				applyRoleAttributes();
+				detectNestedToolbar();
 			});
 		},
+		get role() {
+			return groupRole();
+		},
+		get "aria-orientation"() {
+			return groupRole() === "toolbar" ? props.orientation ?? "horizontal" : void 0;
+		},
 		onKeyDown,
 		get "aria-label"() {
 			return props["aria-label"];
@@ -93,13 +117,13 @@ function createActionGroup(props, state, _ref) {
 			return props["aria-label"] ? void 0 : props["aria-labelledby"];
 		},
 		get "aria-disabled"() {
-			return isActionGroupDisabled(props, state) || void 0;
+			return isActionGroupDisabled(props, state) ? "true" : void 0;
 		}
 	});
 	actionGroupData.set(state, { get onAction() {
 		return props.onAction;
 	} });
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		actionGroupData.delete(state);
 	});
 	return { actionGroupProps };
@@ -107,7 +131,7 @@ function createActionGroup(props, state, _ref) {
 function createActionGroupItem(props, state) {
 	const button = createButton({
 		elementType: "button",
-		isDisabled: state.isDisabled(props.key),
+		isDisabled: () => state.isDisabled(props.key),
 		onPress: () => {
 			state.setFocusedKey(props.key);
 			actionGroupData.get(state)?.onAction?.(props.key);
@@ -115,16 +139,16 @@ function createActionGroupItem(props, state) {
 		}
 	});
 	const isFocused = () => props.key === state.focusedKey();
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		if (isFocused()) state.setFocusedKey(null);
 	});
-	return { buttonProps: mergeProps$1(button.buttonProps, {
+	return { buttonProps: mergeProps(button.buttonProps, {
 		get role() {
 			return ITEM_ROLE_BY_MODE[state.selectionMode()];
 		},
 		get "aria-checked"() {
 			if (state.selectionMode() === "none") return void 0;
-			return state.isSelected(props.key);
+			return state.isSelected(props.key) ? "true" : "false";
 		},
 		get tabIndex() {
 			return isFocused() || state.focusedKey() == null ? 0 : -1;

package/dist/_chunk/actiongroup.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"actiongroup.jsx","names":["mergeProps"],"sources":["../../src/actiongroup/createActionGroup.ts"],"sourcesContent":["import { onCleanup, type JSX, type Accessor } from \"solid-js\";\nimport { createButton } from \"../button\";\nimport {\n  filterDOMProps,\n  getEventTarget,\n  mergeProps,\n  nodeContains,\n  isFocusable,\n  focusSafely,\n} from \"../utils\";\nimport { useLocale } from \"../i18n\";\nimport type { Orientation } from \"../toolbar\";\nimport type { Key, ListState } from \"@proyecto-viviana/solid-stately\";\n\nexport interface AriaActionGroupProps<T = unknown> {\n  /** List items (optional, parity with React Aria prop shape). */\n  items?: T[];\n  /** Whether the whole action group is disabled. */\n  isDisabled?: boolean;\n  /** Group orientation. */\n  orientation?: Orientation;\n  /** Accessible label. */\n  \"aria-label\"?: string;\n  /** Labelled-by id. */\n  \"aria-labelledby\"?: string;\n  /** Handler called when an item action is triggered. */\n  onAction?: (key: Key) => void;\n}\n\nexport interface ActionGroupAria {\n  actionGroupProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nexport interface AriaActionGroupItemProps {\n  key: Key;\n}\n\nexport interface ActionGroupItemAria {\n  buttonProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\ninterface ActionGroupData {\n  onAction?: (key: Key) => void;\n}\n\nconst actionGroupData = new WeakMap<object, ActionGroupData>();\n\nconst GROUP_ROLE_BY_MODE = {\n  none: \"toolbar\",\n  single: \"radiogroup\",\n  multiple: \"toolbar\",\n} as const;\n\nconst ITEM_ROLE_BY_MODE = {\n  none: undefined,\n  single: \"radio\",\n  multiple: \"checkbox\",\n} as const;\n\nfunction isActionGroupDisabled<T>(props: AriaActionGroupProps<T>, state: ListState<T>): boolean {\n  if (props.isDisabled) return true;\n  const keys = [...state.collection().getKeys()];\n  if (keys.length === 0) return true;\n  return !keys.some((key) => !state.isDisabled(key));\n}\n\nexport function createActionGroup<T>(\n  props: AriaActionGroupProps<T>,\n  state: ListState<T>,\n  _ref?: Accessor<HTMLElement | null>,\n): ActionGroupAria {\n  const locale = useLocale();\n  let groupRef: HTMLElement | undefined;\n  const applyRoleAttributes = (): void => {\n    if (!groupRef) return;\n    const selectionMode = state.selectionMode();\n    const mappedRole = GROUP_ROLE_BY_MODE[selectionMode];\n    const nestedToolbar = Boolean(groupRef.parentElement?.closest('[role=\"toolbar\"]'));\n    const role = mappedRole === \"toolbar\" && nestedToolbar ? \"group\" : mappedRole;\n    groupRef.setAttribute(\"role\", role);\n    if (mappedRole === \"toolbar\" && !nestedToolbar) {\n      groupRef.setAttribute(\"aria-orientation\", props.orientation ?? \"horizontal\");\n    } else {\n      groupRef.removeAttribute(\"aria-orientation\");\n    }\n  };\n\n  const getFocusableItems = (root: HTMLElement): HTMLElement[] => {\n    const out: HTMLElement[] = [];\n    const pushIfFocusable = (el: Element | null | undefined): void => {\n      if (!el || !(el instanceof HTMLElement)) return;\n      if (isFocusable(el) && el.getAttribute(\"aria-disabled\") !== \"true\") {\n        out.push(el);\n      }\n    };\n\n    pushIfFocusable(root);\n    for (const node of root.querySelectorAll(\"*\")) {\n      pushIfFocusable(node);\n    }\n    return out;\n  };\n\n  const focusRelative = (\n    root: HTMLElement,\n    direction: \"next\" | \"previous\",\n  ): HTMLElement | null => {\n    const focusables = getFocusableItems(root);\n    if (focusables.length === 0) return null;\n\n    const active = root.ownerDocument.activeElement as HTMLElement | null;\n    const currentIndex = active ? focusables.indexOf(active) : -1;\n    const delta = direction === \"next\" ? 1 : -1;\n    const nextIndex =\n      currentIndex === -1\n        ? direction === \"next\"\n          ? 0\n          : focusables.length - 1\n        : (currentIndex + delta + focusables.length) % focusables.length;\n    const next = focusables[nextIndex];\n    focusSafely(next);\n    return next;\n  };\n\n  // Mirrors react-aria `useActionGroup.onKeyDown` (3.50.0): only the four arrows\n  // are handled and they are ORIENTATION-AGNOSTIC — ArrowRight/ArrowDown always\n  // move next, ArrowLeft/ArrowUp always move previous (orientation only drives\n  // `aria-orientation`). `flipDirection` swaps ArrowRight/ArrowLeft under RTL for\n  // horizontal groups. No Home/End (they fall through to the browser). Focus\n  // moves via `focusRelative` → `focusSafely` → the item's own `onFocus`, which\n  // sets the focused key — so there is no selection-follows-focus here.\n  const onKeyDown: JSX.EventHandler<HTMLElement, KeyboardEvent> = (e) => {\n    const root = groupRef;\n    if (!root || isActionGroupDisabled(props, state)) return;\n    if (!nodeContains(e.currentTarget, getEventTarget(e))) return;\n\n    const orientation = props.orientation ?? \"horizontal\";\n    const flipDirection = locale().direction === \"rtl\" && orientation === \"horizontal\";\n\n    switch (e.key) {\n      case \"ArrowRight\":\n      case \"ArrowDown\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowRight\" && flipDirection) {\n          focusRelative(root, \"previous\");\n        } else {\n          focusRelative(root, \"next\");\n        }\n        return;\n      }\n      case \"ArrowLeft\":\n      case \"ArrowUp\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowLeft\" && flipDirection) {\n          focusRelative(root, \"next\");\n        } else {\n          focusRelative(root, \"previous\");\n        }\n        return;\n      }\n    }\n  };\n\n  const actionGroupProps: JSX.HTMLAttributes<HTMLElement> = mergeProps(\n    filterDOMProps(props as Record<string, unknown>, { labelable: true }),\n    {\n      ref: (el: HTMLElement) => {\n        groupRef = el;\n        applyRoleAttributes();\n        queueMicrotask(() => {\n          if (!groupRef) return;\n          applyRoleAttributes();\n        });\n      },\n      onKeyDown,\n      get \"aria-label\"() {\n        return props[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return props[\"aria-label\"] ? undefined : props[\"aria-labelledby\"];\n      },\n      get \"aria-disabled\"() {\n        return isActionGroupDisabled(props, state) || undefined;\n      },\n    },\n  );\n\n  actionGroupData.set(state, {\n    get onAction() {\n      return props.onAction;\n    },\n  });\n\n  onCleanup(() => {\n    actionGroupData.delete(state);\n  });\n\n  return { actionGroupProps };\n}\n\nexport function createActionGroupItem<T>(\n  props: AriaActionGroupItemProps,\n  state: ListState<T>,\n): ActionGroupItemAria {\n  const button = createButton({\n    elementType: \"button\",\n    isDisabled: state.isDisabled(props.key),\n    onPress: () => {\n      state.setFocusedKey(props.key);\n      actionGroupData.get(state)?.onAction?.(props.key);\n      if (state.selectionMode() !== \"none\") {\n        state.select(props.key);\n      }\n    },\n  });\n\n  const isFocused = () => props.key === state.focusedKey();\n\n  onCleanup(() => {\n    if (isFocused()) {\n      state.setFocusedKey(null);\n    }\n  });\n\n  const buttonProps: JSX.HTMLAttributes<HTMLElement> = mergeProps(button.buttonProps, {\n    get role() {\n      return ITEM_ROLE_BY_MODE[state.selectionMode()];\n    },\n    get \"aria-checked\"() {\n      const mode = state.selectionMode();\n      if (mode === \"none\") return undefined;\n      return state.isSelected(props.key);\n    },\n    // Mirrors react-aria `useActionGroupItem` (3.50.0): every enabled item is\n    // tabbable until focus engages the group, then the roving stop follows the\n    // focused key. There is NO single default tab stop and NO selection bias —\n    // disabled items are made non-tabbable by their native `disabled` attribute\n    // (via createButton), not by this getter.\n    get tabIndex() {\n      return isFocused() || state.focusedKey() == null ? 0 : -1;\n    },\n    \"data-key\": String(props.key),\n    onFocus: () => {\n      state.setFocusedKey(props.key);\n    },\n  });\n\n  return { buttonProps };\n}\n"],"mappings":"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"}
+{"version":3,"file":"actiongroup.jsx","names":[],"sources":["../../src/actiongroup/createActionGroup.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroup.ts\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/actiongroup/useActionGroupItem.ts\n\n/**\n * Ported from:\n * - packages/react-aria/src/actiongroup/useActionGroup.ts\n * - packages/react-aria/src/actiongroup/useActionGroupItem.ts\n */\n\nimport {\n  filterDOMProps,\n  getEventTarget,\n  mergeProps,\n  nodeContains,\n  isFocusable,\n  focusSafely,\n  onOwnedCleanup,\n} from \"../utils\";\nimport { createSignal } from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { createButton } from \"../button\";\nimport { useLocale } from \"../i18n\";\nimport type { Orientation } from \"../toolbar\";\nimport type { Key, ListState } from \"@proyecto-viviana/solid-stately\";\n\nexport interface AriaActionGroupProps<T = unknown> {\n  /** List items (optional, parity with React Aria prop shape). */\n  items?: T[];\n  /** Whether the whole action group is disabled. */\n  isDisabled?: boolean;\n  /** Group orientation. */\n  orientation?: Orientation;\n  /** Accessible label. */\n  \"aria-label\"?: string;\n  /** Labelled-by id. */\n  \"aria-labelledby\"?: string;\n  /** Handler called when an item action is triggered. */\n  onAction?: (key: Key) => void;\n}\n\nexport interface ActionGroupAria {\n  actionGroupProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nexport interface AriaActionGroupItemProps {\n  key: Key;\n}\n\nexport interface ActionGroupItemAria {\n  buttonProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\ninterface ActionGroupData {\n  onAction?: (key: Key) => void;\n}\n\nconst actionGroupData = new WeakMap<object, ActionGroupData>();\n\nconst GROUP_ROLE_BY_MODE = {\n  none: \"toolbar\",\n  single: \"radiogroup\",\n  multiple: \"toolbar\",\n} as const;\n\nconst ITEM_ROLE_BY_MODE = {\n  none: undefined,\n  single: \"radio\",\n  multiple: \"checkbox\",\n} as const;\n\nfunction isActionGroupDisabled<T>(props: AriaActionGroupProps<T>, state: ListState<T>): boolean {\n  if (props.isDisabled) return true;\n  const keys = [...state.collection().getKeys()];\n  if (keys.length === 0) return true;\n  return !keys.some((key) => !state.isDisabled(key));\n}\n\nexport function createActionGroup<T>(\n  props: AriaActionGroupProps<T>,\n  state: ListState<T>,\n  _ref?: Accessor<HTMLElement | null>,\n): ActionGroupAria {\n  const locale = useLocale();\n  let groupRef: HTMLElement | undefined;\n  const [isInToolbar, setIsInToolbar] = createSignal(false, { ownedWrite: true });\n  const groupRole = (): string => {\n    const mappedRole = GROUP_ROLE_BY_MODE[state.selectionMode()];\n    return mappedRole === \"toolbar\" && isInToolbar() ? \"group\" : mappedRole;\n  };\n\n  const getFocusableItems = (root: HTMLElement): HTMLElement[] => {\n    const out: HTMLElement[] = [];\n    const pushIfFocusable = (el: Element | null | undefined): void => {\n      if (!el || !(el instanceof HTMLElement)) return;\n      if (isFocusable(el) && el.getAttribute(\"aria-disabled\") !== \"true\") {\n        out.push(el);\n      }\n    };\n\n    pushIfFocusable(root);\n    for (const node of root.querySelectorAll(\"*\")) {\n      pushIfFocusable(node);\n    }\n    return out;\n  };\n\n  const focusRelative = (root: HTMLElement, direction: \"next\" | \"previous\"): HTMLElement | null => {\n    const focusables = getFocusableItems(root);\n    if (focusables.length === 0) return null;\n\n    const active = root.ownerDocument.activeElement as HTMLElement | null;\n    const currentIndex = active ? focusables.indexOf(active) : -1;\n    const delta = direction === \"next\" ? 1 : -1;\n    const nextIndex =\n      currentIndex === -1\n        ? direction === \"next\"\n          ? 0\n          : focusables.length - 1\n        : (currentIndex + delta + focusables.length) % focusables.length;\n    const next = focusables[nextIndex];\n    focusSafely(next);\n    return next;\n  };\n\n  // Mirrors react-aria `useActionGroup.onKeyDown` (3.50.0): only the four arrows\n  // are handled and they are ORIENTATION-AGNOSTIC — ArrowRight/ArrowDown always\n  // move next, ArrowLeft/ArrowUp always move previous (orientation only drives\n  // `aria-orientation`). `flipDirection` swaps ArrowRight/ArrowLeft under RTL for\n  // horizontal groups. No Home/End (they fall through to the browser). Focus\n  // moves via `focusRelative` → `focusSafely` → the item's own `onFocus`, which\n  // sets the focused key — so there is no selection-follows-focus here.\n  const onKeyDown: JSX.EventHandler<HTMLElement, KeyboardEvent> = (e) => {\n    const root = groupRef;\n    if (!root || isActionGroupDisabled(props, state)) return;\n    if (!nodeContains(e.currentTarget, getEventTarget(e))) return;\n\n    const orientation = props.orientation ?? \"horizontal\";\n    const flipDirection = locale().direction === \"rtl\" && orientation === \"horizontal\";\n\n    switch (e.key) {\n      case \"ArrowRight\":\n      case \"ArrowDown\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowRight\" && flipDirection) {\n          focusRelative(root, \"previous\");\n        } else {\n          focusRelative(root, \"next\");\n        }\n        return;\n      }\n      case \"ArrowLeft\":\n      case \"ArrowUp\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (e.key === \"ArrowLeft\" && flipDirection) {\n          focusRelative(root, \"next\");\n        } else {\n          focusRelative(root, \"previous\");\n        }\n        return;\n      }\n    }\n  };\n\n  const actionGroupProps = mergeProps(\n    filterDOMProps(props as Record<string, unknown>, { labelable: true }),\n    {\n      ref: (el: HTMLElement) => {\n        groupRef = el;\n        const detectNestedToolbar = (): void => {\n          setIsInToolbar(Boolean(el.parentElement?.closest('[role=\"toolbar\"]')));\n        };\n        detectNestedToolbar();\n        queueMicrotask(() => {\n          if (!groupRef) return;\n          detectNestedToolbar();\n        });\n      },\n      get role() {\n        return groupRole();\n      },\n      get \"aria-orientation\"() {\n        return groupRole() === \"toolbar\" ? (props.orientation ?? \"horizontal\") : undefined;\n      },\n      onKeyDown,\n      get \"aria-label\"() {\n        return props[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return props[\"aria-label\"] ? undefined : props[\"aria-labelledby\"];\n      },\n      get \"aria-disabled\"() {\n        return isActionGroupDisabled(props, state) ? \"true\" : undefined;\n      },\n    },\n  );\n\n  actionGroupData.set(state, {\n    get onAction() {\n      return props.onAction;\n    },\n  });\n\n  onOwnedCleanup(() => {\n    actionGroupData.delete(state);\n  });\n\n  return { actionGroupProps: actionGroupProps as JSX.HTMLAttributes<HTMLElement> };\n}\n\nexport function createActionGroupItem<T>(\n  props: AriaActionGroupItemProps,\n  state: ListState<T>,\n): ActionGroupItemAria {\n  const button = createButton({\n    elementType: \"button\",\n    isDisabled: () => state.isDisabled(props.key),\n    onPress: () => {\n      state.setFocusedKey(props.key);\n      actionGroupData.get(state)?.onAction?.(props.key);\n      if (state.selectionMode() !== \"none\") {\n        state.select(props.key);\n      }\n    },\n  });\n\n  const isFocused = () => props.key === state.focusedKey();\n\n  onOwnedCleanup(() => {\n    if (isFocused()) {\n      state.setFocusedKey(null);\n    }\n  });\n\n  const buttonProps: JSX.HTMLAttributes<HTMLElement> = mergeProps(button.buttonProps, {\n    get role() {\n      return ITEM_ROLE_BY_MODE[state.selectionMode()];\n    },\n    get \"aria-checked\"() {\n      const mode = state.selectionMode();\n      if (mode === \"none\") return undefined;\n      return state.isSelected(props.key) ? \"true\" : \"false\";\n    },\n    // Mirrors react-aria `useActionGroupItem` (3.50.0): every enabled item is\n    // tabbable until focus engages the group, then the roving stop follows the\n    // focused key. There is NO single default tab stop and NO selection bias —\n    // disabled items are made non-tabbable by their native `disabled` attribute\n    // (via createButton), not by this getter.\n    get tabIndex() {\n      return isFocused() || state.focusedKey() == null ? 0 : -1;\n    },\n    \"data-key\": String(props.key),\n    onFocus: () => {\n      state.setFocusedKey(props.key);\n    },\n  });\n\n  return { buttonProps };\n}\n"],"mappings":"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"}

package/dist/_chunk/announce.js

@@ -1,5 +1,17 @@
-import { createEffect } from "solid-js";
-import { isServer } from "solid-js/web";
+/*
+* Copyright 2020 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/live-announcer/LiveAnnouncer.tsx
+import { createTrackedEffect } from "solid-js";
+import { isServer } from "@solidjs/web";
 //#region src/live-announcer/announce.ts
 /**
 * Live announcer for solidaria
@@ -7,7 +19,8 @@ import { isServer } from "solid-js/web";
 * Provides functions to make announcements to screen readers using
 * ARIA live regions. Useful for announcing dynamic content changes.
 *
-* Port of react-aria's @react-aria/live-announcer.
+* Ported from packages/react-aria/src/live-announcer/LiveAnnouncer.tsx.
+* useAnnouncer is a local Solid lifecycle wrapper around that port.
 *
 * SSR Safety: All functions are safe to call during SSR. The announcer
 * will only be created when running in the browser.
@@ -131,7 +144,7 @@ function clearAnnouncer(assertiveness) {
 * @example
 * ```tsx
 * // Clean up on app unmount
-* onCleanup(() => {
+* onOwnedCleanup(() => {
 *   destroyAnnouncer();
 * });
 * ```
@@ -157,7 +170,7 @@ function destroyAnnouncer() {
 * function SearchResults(props) {
 *   const announcer = useAnnouncer();
 *
-*   createEffect(() => {
+*   createTrackedEffect(() => {
 *     const count = props.results.length;
 *     announcer.announce(`${count} results found`, 'polite');
 *   });
@@ -189,7 +202,7 @@ function useAnnouncer() {
 		announce: () => {},
 		clear: () => {}
 	};
-	createEffect(() => {
+	createTrackedEffect(() => {
 		if (!liveAnnouncer) liveAnnouncer = new LiveAnnouncer();
 	});
 	return {

package/dist/_chunk/announce.js.map

@@ -1 +1 @@
-{"version":3,"file":"announce.js","names":[],"sources":["../../src/live-announcer/announce.ts"],"sourcesContent":["/**\n * Live announcer for solidaria\n *\n * Provides functions to make announcements to screen readers using\n * ARIA live regions. Useful for announcing dynamic content changes.\n *\n * Port of react-aria's @react-aria/live-announcer.\n *\n * SSR Safety: All functions are safe to call during SSR. The announcer\n * will only be created when running in the browser.\n */\n\nimport { onCleanup, createEffect } from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\n\nexport type Assertiveness = \"assertive\" | \"polite\";\n\nexport type Message = string | { \"aria-labelledby\": string };\n\nconst LIVEREGION_TIMEOUT_DELAY = 7000;\n\n/**\n * Singleton class that manages live region announcements.\n * Implemented using vanilla DOM for simplicity and framework independence.\n */\nclass LiveAnnouncer {\n  node: HTMLElement | null = null;\n  assertiveLog: HTMLElement | null = null;\n  politeLog: HTMLElement | null = null;\n\n  constructor() {\n    if (typeof document !== \"undefined\") {\n      this.node = document.createElement(\"div\");\n      this.node.dataset.liveAnnouncer = \"true\";\n      // Visually hidden styles\n      Object.assign(this.node.style, {\n        border: \"0\",\n        clip: \"rect(0 0 0 0)\",\n        clipPath: \"inset(50%)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0\",\n        position: \"absolute\",\n        width: \"1px\",\n        whiteSpace: \"nowrap\",\n      });\n\n      this.assertiveLog = this.createLog(\"assertive\");\n      this.node.appendChild(this.assertiveLog);\n\n      this.politeLog = this.createLog(\"polite\");\n      this.node.appendChild(this.politeLog);\n\n      document.body.prepend(this.node);\n    }\n  }\n\n  isAttached(): boolean {\n    return this.node?.isConnected ?? false;\n  }\n\n  createLog(ariaLive: string): HTMLElement {\n    const node = document.createElement(\"div\");\n    node.setAttribute(\"role\", \"log\");\n    node.setAttribute(\"aria-live\", ariaLive);\n    node.setAttribute(\"aria-relevant\", \"additions\");\n    return node;\n  }\n\n  destroy(): void {\n    if (!this.node) {\n      return;\n    }\n\n    document.body.removeChild(this.node);\n    this.node = null;\n  }\n\n  announce(\n    message: Message,\n    assertiveness: Assertiveness = \"assertive\",\n    timeout: number = LIVEREGION_TIMEOUT_DELAY,\n  ): void {\n    if (!this.node) {\n      return;\n    }\n\n    const node = document.createElement(\"div\");\n    if (typeof message === \"object\") {\n      // To read an aria-labelledby, the element must have an appropriate role, such as img.\n      node.setAttribute(\"role\", \"img\");\n      node.setAttribute(\"aria-labelledby\", message[\"aria-labelledby\"]);\n    } else {\n      node.textContent = message;\n    }\n\n    if (assertiveness === \"assertive\") {\n      this.assertiveLog?.appendChild(node);\n    } else {\n      this.politeLog?.appendChild(node);\n    }\n\n    if (message !== \"\") {\n      setTimeout(() => {\n        node.remove();\n      }, timeout);\n    }\n  }\n\n  clear(assertiveness?: Assertiveness): void {\n    if (!this.node) {\n      return;\n    }\n\n    if ((!assertiveness || assertiveness === \"assertive\") && this.assertiveLog) {\n      this.assertiveLog.innerHTML = \"\";\n    }\n\n    if ((!assertiveness || assertiveness === \"polite\") && this.politeLog) {\n      this.politeLog.innerHTML = \"\";\n    }\n  }\n}\n\nlet liveAnnouncer: LiveAnnouncer | null = null;\n\n/**\n * Announces a message to screen readers using ARIA live regions.\n *\n * @param message - The message to announce, or an object with aria-labelledby\n * @param assertiveness - 'assertive' interrupts, 'polite' waits for a pause\n * @param timeout - How long to keep the message in the DOM (default 7000ms)\n *\n * @example\n * ```tsx\n * // Simple announcement\n * announce('Item added to cart');\n *\n * // Polite announcement (won't interrupt)\n * announce('3 results found', 'polite');\n *\n * // Using aria-labelledby for complex content\n * announce({ 'aria-labelledby': 'my-element-id' });\n * ```\n */\nexport function announce(\n  message: Message,\n  assertiveness: Assertiveness = \"assertive\",\n  timeout: number = LIVEREGION_TIMEOUT_DELAY,\n): void {\n  if (!liveAnnouncer) {\n    liveAnnouncer = new LiveAnnouncer();\n    // Wait for the live announcer regions to be added to the DOM, then announce.\n    // Otherwise Safari won't announce the message if it's added too quickly.\n    // Found most times less than 100ms were not consistent when announcing with Safari.\n\n    // Check for test environment\n    const isTestEnv =\n      typeof (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST === \"boolean\"\n        ? (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST\n        : typeof (globalThis as Record<string, unknown>).vitest !== \"undefined\";\n\n    if (!isTestEnv) {\n      setTimeout(() => {\n        if (liveAnnouncer?.isAttached()) {\n          liveAnnouncer?.announce(message, assertiveness, timeout);\n        }\n      }, 100);\n    } else {\n      liveAnnouncer.announce(message, assertiveness, timeout);\n    }\n  } else {\n    liveAnnouncer.announce(message, assertiveness, timeout);\n  }\n}\n\n/**\n * Clears all queued announcements for the given assertiveness level.\n *\n * @param assertiveness - Which log to clear ('assertive' or 'polite')\n *\n * @example\n * ```tsx\n * // Clear assertive announcements\n * clearAnnouncer('assertive');\n *\n * // Clear polite announcements\n * clearAnnouncer('polite');\n * ```\n */\nexport function clearAnnouncer(assertiveness?: Assertiveness): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.clear(assertiveness);\n  }\n}\n\n/**\n * Removes the live announcer from the DOM entirely.\n * Call this when unmounting your app or when announcements are no longer needed.\n *\n * @example\n * ```tsx\n * // Clean up on app unmount\n * onCleanup(() => {\n *   destroyAnnouncer();\n * });\n * ```\n */\nexport function destroyAnnouncer(): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.destroy();\n    liveAnnouncer = null;\n  }\n}\n\nexport interface UseAnnouncerResult {\n  /** Announce a message to screen readers. */\n  announce: (message: Message, assertiveness?: Assertiveness, timeout?: number) => void;\n  /** Clear announcements for the given assertiveness level. */\n  clear: (assertiveness?: Assertiveness) => void;\n}\n\n/**\n * Hook that provides access to the live announcer with automatic cleanup.\n *\n * This is the recommended way to use the announcer in SolidJS components.\n * It ensures the announcer is created only on the client and provides\n * type-safe methods for announcing and clearing messages.\n *\n * SSR Safety: Returns no-op functions during SSR. The announcer is only\n * created when the component mounts on the client.\n *\n * @example\n * ```tsx\n * function SearchResults(props) {\n *   const announcer = useAnnouncer();\n *\n *   createEffect(() => {\n *     const count = props.results.length;\n *     announcer.announce(`${count} results found`, 'polite');\n *   });\n *\n *   return <ul>...</ul>;\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Form() {\n *   const announcer = useAnnouncer();\n *\n *   const onSubmit = async () => {\n *     try {\n *       await submitForm();\n *       announcer.announce('Form submitted successfully');\n *     } catch (error) {\n *       announcer.announce('Error submitting form', 'assertive');\n *     }\n *   };\n *\n *   return <form onSubmit={onSubmit}>...</form>;\n * }\n * ```\n */\nexport function useAnnouncer(): UseAnnouncerResult {\n  // During SSR, return no-op functions\n  if (isServer) {\n    return {\n      announce: () => {},\n      clear: () => {},\n    };\n  }\n\n  // Ensure the announcer is initialized\n  createEffect(() => {\n    // Initialize on first use\n    if (!liveAnnouncer) {\n      liveAnnouncer = new LiveAnnouncer();\n    }\n  });\n\n  return {\n    announce: (\n      message: Message,\n      assertiveness: Assertiveness = \"assertive\",\n      timeout: number = LIVEREGION_TIMEOUT_DELAY,\n    ) => {\n      announce(message, assertiveness, timeout);\n    },\n    clear: (assertiveness?: Assertiveness) => {\n      clearAnnouncer(assertiveness);\n    },\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"announce.js","names":[],"sources":["../../src/live-announcer/announce.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/live-announcer/LiveAnnouncer.tsx\n\n/**\n * Live announcer for solidaria\n *\n * Provides functions to make announcements to screen readers using\n * ARIA live regions. Useful for announcing dynamic content changes.\n *\n * Ported from packages/react-aria/src/live-announcer/LiveAnnouncer.tsx.\n * useAnnouncer is a local Solid lifecycle wrapper around that port.\n *\n * SSR Safety: All functions are safe to call during SSR. The announcer\n * will only be created when running in the browser.\n */\n\nimport { createTrackedEffect } from \"solid-js\";\nimport { isServer } from \"@solidjs/web\";\n\nexport type Assertiveness = \"assertive\" | \"polite\";\n\nexport type Message = string | { \"aria-labelledby\": string };\n\nconst LIVEREGION_TIMEOUT_DELAY = 7000;\n\n/**\n * Singleton class that manages live region announcements.\n * Implemented using vanilla DOM for simplicity and framework independence.\n */\nclass LiveAnnouncer {\n  node: HTMLElement | null = null;\n  assertiveLog: HTMLElement | null = null;\n  politeLog: HTMLElement | null = null;\n\n  constructor() {\n    if (typeof document !== \"undefined\") {\n      this.node = document.createElement(\"div\");\n      this.node.dataset.liveAnnouncer = \"true\";\n      // Visually hidden styles\n      Object.assign(this.node.style, {\n        border: \"0\",\n        clip: \"rect(0 0 0 0)\",\n        clipPath: \"inset(50%)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0\",\n        position: \"absolute\",\n        width: \"1px\",\n        whiteSpace: \"nowrap\",\n      });\n\n      this.assertiveLog = this.createLog(\"assertive\");\n      this.node.appendChild(this.assertiveLog);\n\n      this.politeLog = this.createLog(\"polite\");\n      this.node.appendChild(this.politeLog);\n\n      document.body.prepend(this.node);\n    }\n  }\n\n  isAttached(): boolean {\n    return this.node?.isConnected ?? false;\n  }\n\n  createLog(ariaLive: string): HTMLElement {\n    const node = document.createElement(\"div\");\n    node.setAttribute(\"role\", \"log\");\n    node.setAttribute(\"aria-live\", ariaLive);\n    node.setAttribute(\"aria-relevant\", \"additions\");\n    return node;\n  }\n\n  destroy(): void {\n    if (!this.node) {\n      return;\n    }\n\n    document.body.removeChild(this.node);\n    this.node = null;\n  }\n\n  announce(\n    message: Message,\n    assertiveness: Assertiveness = \"assertive\",\n    timeout: number = LIVEREGION_TIMEOUT_DELAY,\n  ): void {\n    if (!this.node) {\n      return;\n    }\n\n    const node = document.createElement(\"div\");\n    if (typeof message === \"object\") {\n      // To read an aria-labelledby, the element must have an appropriate role, such as img.\n      node.setAttribute(\"role\", \"img\");\n      node.setAttribute(\"aria-labelledby\", message[\"aria-labelledby\"]);\n    } else {\n      node.textContent = message;\n    }\n\n    if (assertiveness === \"assertive\") {\n      this.assertiveLog?.appendChild(node);\n    } else {\n      this.politeLog?.appendChild(node);\n    }\n\n    if (message !== \"\") {\n      setTimeout(() => {\n        node.remove();\n      }, timeout);\n    }\n  }\n\n  clear(assertiveness?: Assertiveness): void {\n    if (!this.node) {\n      return;\n    }\n\n    if ((!assertiveness || assertiveness === \"assertive\") && this.assertiveLog) {\n      this.assertiveLog.innerHTML = \"\";\n    }\n\n    if ((!assertiveness || assertiveness === \"polite\") && this.politeLog) {\n      this.politeLog.innerHTML = \"\";\n    }\n  }\n}\n\nlet liveAnnouncer: LiveAnnouncer | null = null;\n\n/**\n * Announces a message to screen readers using ARIA live regions.\n *\n * @param message - The message to announce, or an object with aria-labelledby\n * @param assertiveness - 'assertive' interrupts, 'polite' waits for a pause\n * @param timeout - How long to keep the message in the DOM (default 7000ms)\n *\n * @example\n * ```tsx\n * // Simple announcement\n * announce('Item added to cart');\n *\n * // Polite announcement (won't interrupt)\n * announce('3 results found', 'polite');\n *\n * // Using aria-labelledby for complex content\n * announce({ 'aria-labelledby': 'my-element-id' });\n * ```\n */\nexport function announce(\n  message: Message,\n  assertiveness: Assertiveness = \"assertive\",\n  timeout: number = LIVEREGION_TIMEOUT_DELAY,\n): void {\n  if (!liveAnnouncer) {\n    liveAnnouncer = new LiveAnnouncer();\n    // Wait for the live announcer regions to be added to the DOM, then announce.\n    // Otherwise Safari won't announce the message if it's added too quickly.\n    // Found most times less than 100ms were not consistent when announcing with Safari.\n\n    // Check for test environment\n    const isTestEnv =\n      typeof (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST === \"boolean\"\n        ? (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST\n        : typeof (globalThis as Record<string, unknown>).vitest !== \"undefined\";\n\n    if (!isTestEnv) {\n      setTimeout(() => {\n        if (liveAnnouncer?.isAttached()) {\n          liveAnnouncer?.announce(message, assertiveness, timeout);\n        }\n      }, 100);\n    } else {\n      liveAnnouncer.announce(message, assertiveness, timeout);\n    }\n  } else {\n    liveAnnouncer.announce(message, assertiveness, timeout);\n  }\n}\n\n/**\n * Clears all queued announcements for the given assertiveness level.\n *\n * @param assertiveness - Which log to clear ('assertive' or 'polite')\n *\n * @example\n * ```tsx\n * // Clear assertive announcements\n * clearAnnouncer('assertive');\n *\n * // Clear polite announcements\n * clearAnnouncer('polite');\n * ```\n */\nexport function clearAnnouncer(assertiveness?: Assertiveness): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.clear(assertiveness);\n  }\n}\n\n/**\n * Removes the live announcer from the DOM entirely.\n * Call this when unmounting your app or when announcements are no longer needed.\n *\n * @example\n * ```tsx\n * // Clean up on app unmount\n * onOwnedCleanup(() => {\n *   destroyAnnouncer();\n * });\n * ```\n */\nexport function destroyAnnouncer(): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.destroy();\n    liveAnnouncer = null;\n  }\n}\n\nexport interface UseAnnouncerResult {\n  /** Announce a message to screen readers. */\n  announce: (message: Message, assertiveness?: Assertiveness, timeout?: number) => void;\n  /** Clear announcements for the given assertiveness level. */\n  clear: (assertiveness?: Assertiveness) => void;\n}\n\n/**\n * Hook that provides access to the live announcer with automatic cleanup.\n *\n * This is the recommended way to use the announcer in SolidJS components.\n * It ensures the announcer is created only on the client and provides\n * type-safe methods for announcing and clearing messages.\n *\n * SSR Safety: Returns no-op functions during SSR. The announcer is only\n * created when the component mounts on the client.\n *\n * @example\n * ```tsx\n * function SearchResults(props) {\n *   const announcer = useAnnouncer();\n *\n *   createTrackedEffect(() => {\n *     const count = props.results.length;\n *     announcer.announce(`${count} results found`, 'polite');\n *   });\n *\n *   return <ul>...</ul>;\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Form() {\n *   const announcer = useAnnouncer();\n *\n *   const onSubmit = async () => {\n *     try {\n *       await submitForm();\n *       announcer.announce('Form submitted successfully');\n *     } catch (error) {\n *       announcer.announce('Error submitting form', 'assertive');\n *     }\n *   };\n *\n *   return <form onSubmit={onSubmit}>...</form>;\n * }\n * ```\n */\nexport function useAnnouncer(): UseAnnouncerResult {\n  // During SSR, return no-op functions\n  if (isServer) {\n    return {\n      announce: () => {},\n      clear: () => {},\n    };\n  }\n\n  // Ensure the announcer is initialized\n  createTrackedEffect(() => {\n    // Initialize on first use\n    if (!liveAnnouncer) {\n      liveAnnouncer = new LiveAnnouncer();\n    }\n  });\n\n  return {\n    announce: (\n      message: Message,\n      assertiveness: Assertiveness = \"assertive\",\n      timeout: number = LIVEREGION_TIMEOUT_DELAY,\n    ) => {\n      announce(message, assertiveness, timeout);\n    },\n    clear: (assertiveness?: Assertiveness) => {\n      clearAnnouncer(assertiveness);\n    },\n  };\n}\n"],"mappings":"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"}

package/dist/_chunk/announce.jsx

@@ -1,5 +1,17 @@
-import { createEffect } from "solid-js";
-import { isServer } from "solid-js/web";
+/*
+* Copyright 2020 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/live-announcer/LiveAnnouncer.tsx
+import { createTrackedEffect } from "solid-js";
+import { isServer } from "@solidjs/web";
 //#region src/live-announcer/announce.ts
 /**
 * Live announcer for solidaria
@@ -7,7 +19,8 @@ import { isServer } from "solid-js/web";
 * Provides functions to make announcements to screen readers using
 * ARIA live regions. Useful for announcing dynamic content changes.
 *
-* Port of react-aria's @react-aria/live-announcer.
+* Ported from packages/react-aria/src/live-announcer/LiveAnnouncer.tsx.
+* useAnnouncer is a local Solid lifecycle wrapper around that port.
 *
 * SSR Safety: All functions are safe to call during SSR. The announcer
 * will only be created when running in the browser.
@@ -131,7 +144,7 @@ function clearAnnouncer(assertiveness) {
 * @example
 * ```tsx
 * // Clean up on app unmount
-* onCleanup(() => {
+* onOwnedCleanup(() => {
 *   destroyAnnouncer();
 * });
 * ```
@@ -157,7 +170,7 @@ function destroyAnnouncer() {
 * function SearchResults(props) {
 *   const announcer = useAnnouncer();
 *
-*   createEffect(() => {
+*   createTrackedEffect(() => {
 *     const count = props.results.length;
 *     announcer.announce(`${count} results found`, 'polite');
 *   });
@@ -189,7 +202,7 @@ function useAnnouncer() {
 		announce: () => {},
 		clear: () => {}
 	};
-	createEffect(() => {
+	createTrackedEffect(() => {
 		if (!liveAnnouncer) liveAnnouncer = new LiveAnnouncer();
 	});
 	return {

package/dist/_chunk/announce.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"announce.jsx","names":[],"sources":["../../src/live-announcer/announce.ts"],"sourcesContent":["/**\n * Live announcer for solidaria\n *\n * Provides functions to make announcements to screen readers using\n * ARIA live regions. Useful for announcing dynamic content changes.\n *\n * Port of react-aria's @react-aria/live-announcer.\n *\n * SSR Safety: All functions are safe to call during SSR. The announcer\n * will only be created when running in the browser.\n */\n\nimport { onCleanup, createEffect } from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\n\nexport type Assertiveness = \"assertive\" | \"polite\";\n\nexport type Message = string | { \"aria-labelledby\": string };\n\nconst LIVEREGION_TIMEOUT_DELAY = 7000;\n\n/**\n * Singleton class that manages live region announcements.\n * Implemented using vanilla DOM for simplicity and framework independence.\n */\nclass LiveAnnouncer {\n  node: HTMLElement | null = null;\n  assertiveLog: HTMLElement | null = null;\n  politeLog: HTMLElement | null = null;\n\n  constructor() {\n    if (typeof document !== \"undefined\") {\n      this.node = document.createElement(\"div\");\n      this.node.dataset.liveAnnouncer = \"true\";\n      // Visually hidden styles\n      Object.assign(this.node.style, {\n        border: \"0\",\n        clip: \"rect(0 0 0 0)\",\n        clipPath: \"inset(50%)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0\",\n        position: \"absolute\",\n        width: \"1px\",\n        whiteSpace: \"nowrap\",\n      });\n\n      this.assertiveLog = this.createLog(\"assertive\");\n      this.node.appendChild(this.assertiveLog);\n\n      this.politeLog = this.createLog(\"polite\");\n      this.node.appendChild(this.politeLog);\n\n      document.body.prepend(this.node);\n    }\n  }\n\n  isAttached(): boolean {\n    return this.node?.isConnected ?? false;\n  }\n\n  createLog(ariaLive: string): HTMLElement {\n    const node = document.createElement(\"div\");\n    node.setAttribute(\"role\", \"log\");\n    node.setAttribute(\"aria-live\", ariaLive);\n    node.setAttribute(\"aria-relevant\", \"additions\");\n    return node;\n  }\n\n  destroy(): void {\n    if (!this.node) {\n      return;\n    }\n\n    document.body.removeChild(this.node);\n    this.node = null;\n  }\n\n  announce(\n    message: Message,\n    assertiveness: Assertiveness = \"assertive\",\n    timeout: number = LIVEREGION_TIMEOUT_DELAY,\n  ): void {\n    if (!this.node) {\n      return;\n    }\n\n    const node = document.createElement(\"div\");\n    if (typeof message === \"object\") {\n      // To read an aria-labelledby, the element must have an appropriate role, such as img.\n      node.setAttribute(\"role\", \"img\");\n      node.setAttribute(\"aria-labelledby\", message[\"aria-labelledby\"]);\n    } else {\n      node.textContent = message;\n    }\n\n    if (assertiveness === \"assertive\") {\n      this.assertiveLog?.appendChild(node);\n    } else {\n      this.politeLog?.appendChild(node);\n    }\n\n    if (message !== \"\") {\n      setTimeout(() => {\n        node.remove();\n      }, timeout);\n    }\n  }\n\n  clear(assertiveness?: Assertiveness): void {\n    if (!this.node) {\n      return;\n    }\n\n    if ((!assertiveness || assertiveness === \"assertive\") && this.assertiveLog) {\n      this.assertiveLog.innerHTML = \"\";\n    }\n\n    if ((!assertiveness || assertiveness === \"polite\") && this.politeLog) {\n      this.politeLog.innerHTML = \"\";\n    }\n  }\n}\n\nlet liveAnnouncer: LiveAnnouncer | null = null;\n\n/**\n * Announces a message to screen readers using ARIA live regions.\n *\n * @param message - The message to announce, or an object with aria-labelledby\n * @param assertiveness - 'assertive' interrupts, 'polite' waits for a pause\n * @param timeout - How long to keep the message in the DOM (default 7000ms)\n *\n * @example\n * ```tsx\n * // Simple announcement\n * announce('Item added to cart');\n *\n * // Polite announcement (won't interrupt)\n * announce('3 results found', 'polite');\n *\n * // Using aria-labelledby for complex content\n * announce({ 'aria-labelledby': 'my-element-id' });\n * ```\n */\nexport function announce(\n  message: Message,\n  assertiveness: Assertiveness = \"assertive\",\n  timeout: number = LIVEREGION_TIMEOUT_DELAY,\n): void {\n  if (!liveAnnouncer) {\n    liveAnnouncer = new LiveAnnouncer();\n    // Wait for the live announcer regions to be added to the DOM, then announce.\n    // Otherwise Safari won't announce the message if it's added too quickly.\n    // Found most times less than 100ms were not consistent when announcing with Safari.\n\n    // Check for test environment\n    const isTestEnv =\n      typeof (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST === \"boolean\"\n        ? (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST\n        : typeof (globalThis as Record<string, unknown>).vitest !== \"undefined\";\n\n    if (!isTestEnv) {\n      setTimeout(() => {\n        if (liveAnnouncer?.isAttached()) {\n          liveAnnouncer?.announce(message, assertiveness, timeout);\n        }\n      }, 100);\n    } else {\n      liveAnnouncer.announce(message, assertiveness, timeout);\n    }\n  } else {\n    liveAnnouncer.announce(message, assertiveness, timeout);\n  }\n}\n\n/**\n * Clears all queued announcements for the given assertiveness level.\n *\n * @param assertiveness - Which log to clear ('assertive' or 'polite')\n *\n * @example\n * ```tsx\n * // Clear assertive announcements\n * clearAnnouncer('assertive');\n *\n * // Clear polite announcements\n * clearAnnouncer('polite');\n * ```\n */\nexport function clearAnnouncer(assertiveness?: Assertiveness): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.clear(assertiveness);\n  }\n}\n\n/**\n * Removes the live announcer from the DOM entirely.\n * Call this when unmounting your app or when announcements are no longer needed.\n *\n * @example\n * ```tsx\n * // Clean up on app unmount\n * onCleanup(() => {\n *   destroyAnnouncer();\n * });\n * ```\n */\nexport function destroyAnnouncer(): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.destroy();\n    liveAnnouncer = null;\n  }\n}\n\nexport interface UseAnnouncerResult {\n  /** Announce a message to screen readers. */\n  announce: (message: Message, assertiveness?: Assertiveness, timeout?: number) => void;\n  /** Clear announcements for the given assertiveness level. */\n  clear: (assertiveness?: Assertiveness) => void;\n}\n\n/**\n * Hook that provides access to the live announcer with automatic cleanup.\n *\n * This is the recommended way to use the announcer in SolidJS components.\n * It ensures the announcer is created only on the client and provides\n * type-safe methods for announcing and clearing messages.\n *\n * SSR Safety: Returns no-op functions during SSR. The announcer is only\n * created when the component mounts on the client.\n *\n * @example\n * ```tsx\n * function SearchResults(props) {\n *   const announcer = useAnnouncer();\n *\n *   createEffect(() => {\n *     const count = props.results.length;\n *     announcer.announce(`${count} results found`, 'polite');\n *   });\n *\n *   return <ul>...</ul>;\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Form() {\n *   const announcer = useAnnouncer();\n *\n *   const onSubmit = async () => {\n *     try {\n *       await submitForm();\n *       announcer.announce('Form submitted successfully');\n *     } catch (error) {\n *       announcer.announce('Error submitting form', 'assertive');\n *     }\n *   };\n *\n *   return <form onSubmit={onSubmit}>...</form>;\n * }\n * ```\n */\nexport function useAnnouncer(): UseAnnouncerResult {\n  // During SSR, return no-op functions\n  if (isServer) {\n    return {\n      announce: () => {},\n      clear: () => {},\n    };\n  }\n\n  // Ensure the announcer is initialized\n  createEffect(() => {\n    // Initialize on first use\n    if (!liveAnnouncer) {\n      liveAnnouncer = new LiveAnnouncer();\n    }\n  });\n\n  return {\n    announce: (\n      message: Message,\n      assertiveness: Assertiveness = \"assertive\",\n      timeout: number = LIVEREGION_TIMEOUT_DELAY,\n    ) => {\n      announce(message, assertiveness, timeout);\n    },\n    clear: (assertiveness?: Assertiveness) => {\n      clearAnnouncer(assertiveness);\n    },\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"announce.jsx","names":[],"sources":["../../src/live-announcer/announce.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/live-announcer/LiveAnnouncer.tsx\n\n/**\n * Live announcer for solidaria\n *\n * Provides functions to make announcements to screen readers using\n * ARIA live regions. Useful for announcing dynamic content changes.\n *\n * Ported from packages/react-aria/src/live-announcer/LiveAnnouncer.tsx.\n * useAnnouncer is a local Solid lifecycle wrapper around that port.\n *\n * SSR Safety: All functions are safe to call during SSR. The announcer\n * will only be created when running in the browser.\n */\n\nimport { createTrackedEffect } from \"solid-js\";\nimport { isServer } from \"@solidjs/web\";\n\nexport type Assertiveness = \"assertive\" | \"polite\";\n\nexport type Message = string | { \"aria-labelledby\": string };\n\nconst LIVEREGION_TIMEOUT_DELAY = 7000;\n\n/**\n * Singleton class that manages live region announcements.\n * Implemented using vanilla DOM for simplicity and framework independence.\n */\nclass LiveAnnouncer {\n  node: HTMLElement | null = null;\n  assertiveLog: HTMLElement | null = null;\n  politeLog: HTMLElement | null = null;\n\n  constructor() {\n    if (typeof document !== \"undefined\") {\n      this.node = document.createElement(\"div\");\n      this.node.dataset.liveAnnouncer = \"true\";\n      // Visually hidden styles\n      Object.assign(this.node.style, {\n        border: \"0\",\n        clip: \"rect(0 0 0 0)\",\n        clipPath: \"inset(50%)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0\",\n        position: \"absolute\",\n        width: \"1px\",\n        whiteSpace: \"nowrap\",\n      });\n\n      this.assertiveLog = this.createLog(\"assertive\");\n      this.node.appendChild(this.assertiveLog);\n\n      this.politeLog = this.createLog(\"polite\");\n      this.node.appendChild(this.politeLog);\n\n      document.body.prepend(this.node);\n    }\n  }\n\n  isAttached(): boolean {\n    return this.node?.isConnected ?? false;\n  }\n\n  createLog(ariaLive: string): HTMLElement {\n    const node = document.createElement(\"div\");\n    node.setAttribute(\"role\", \"log\");\n    node.setAttribute(\"aria-live\", ariaLive);\n    node.setAttribute(\"aria-relevant\", \"additions\");\n    return node;\n  }\n\n  destroy(): void {\n    if (!this.node) {\n      return;\n    }\n\n    document.body.removeChild(this.node);\n    this.node = null;\n  }\n\n  announce(\n    message: Message,\n    assertiveness: Assertiveness = \"assertive\",\n    timeout: number = LIVEREGION_TIMEOUT_DELAY,\n  ): void {\n    if (!this.node) {\n      return;\n    }\n\n    const node = document.createElement(\"div\");\n    if (typeof message === \"object\") {\n      // To read an aria-labelledby, the element must have an appropriate role, such as img.\n      node.setAttribute(\"role\", \"img\");\n      node.setAttribute(\"aria-labelledby\", message[\"aria-labelledby\"]);\n    } else {\n      node.textContent = message;\n    }\n\n    if (assertiveness === \"assertive\") {\n      this.assertiveLog?.appendChild(node);\n    } else {\n      this.politeLog?.appendChild(node);\n    }\n\n    if (message !== \"\") {\n      setTimeout(() => {\n        node.remove();\n      }, timeout);\n    }\n  }\n\n  clear(assertiveness?: Assertiveness): void {\n    if (!this.node) {\n      return;\n    }\n\n    if ((!assertiveness || assertiveness === \"assertive\") && this.assertiveLog) {\n      this.assertiveLog.innerHTML = \"\";\n    }\n\n    if ((!assertiveness || assertiveness === \"polite\") && this.politeLog) {\n      this.politeLog.innerHTML = \"\";\n    }\n  }\n}\n\nlet liveAnnouncer: LiveAnnouncer | null = null;\n\n/**\n * Announces a message to screen readers using ARIA live regions.\n *\n * @param message - The message to announce, or an object with aria-labelledby\n * @param assertiveness - 'assertive' interrupts, 'polite' waits for a pause\n * @param timeout - How long to keep the message in the DOM (default 7000ms)\n *\n * @example\n * ```tsx\n * // Simple announcement\n * announce('Item added to cart');\n *\n * // Polite announcement (won't interrupt)\n * announce('3 results found', 'polite');\n *\n * // Using aria-labelledby for complex content\n * announce({ 'aria-labelledby': 'my-element-id' });\n * ```\n */\nexport function announce(\n  message: Message,\n  assertiveness: Assertiveness = \"assertive\",\n  timeout: number = LIVEREGION_TIMEOUT_DELAY,\n): void {\n  if (!liveAnnouncer) {\n    liveAnnouncer = new LiveAnnouncer();\n    // Wait for the live announcer regions to be added to the DOM, then announce.\n    // Otherwise Safari won't announce the message if it's added too quickly.\n    // Found most times less than 100ms were not consistent when announcing with Safari.\n\n    // Check for test environment\n    const isTestEnv =\n      typeof (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST === \"boolean\"\n        ? (globalThis as Record<string, unknown>).IS_SOLIDARIA_TEST\n        : typeof (globalThis as Record<string, unknown>).vitest !== \"undefined\";\n\n    if (!isTestEnv) {\n      setTimeout(() => {\n        if (liveAnnouncer?.isAttached()) {\n          liveAnnouncer?.announce(message, assertiveness, timeout);\n        }\n      }, 100);\n    } else {\n      liveAnnouncer.announce(message, assertiveness, timeout);\n    }\n  } else {\n    liveAnnouncer.announce(message, assertiveness, timeout);\n  }\n}\n\n/**\n * Clears all queued announcements for the given assertiveness level.\n *\n * @param assertiveness - Which log to clear ('assertive' or 'polite')\n *\n * @example\n * ```tsx\n * // Clear assertive announcements\n * clearAnnouncer('assertive');\n *\n * // Clear polite announcements\n * clearAnnouncer('polite');\n * ```\n */\nexport function clearAnnouncer(assertiveness?: Assertiveness): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.clear(assertiveness);\n  }\n}\n\n/**\n * Removes the live announcer from the DOM entirely.\n * Call this when unmounting your app or when announcements are no longer needed.\n *\n * @example\n * ```tsx\n * // Clean up on app unmount\n * onOwnedCleanup(() => {\n *   destroyAnnouncer();\n * });\n * ```\n */\nexport function destroyAnnouncer(): void {\n  if (liveAnnouncer) {\n    liveAnnouncer.destroy();\n    liveAnnouncer = null;\n  }\n}\n\nexport interface UseAnnouncerResult {\n  /** Announce a message to screen readers. */\n  announce: (message: Message, assertiveness?: Assertiveness, timeout?: number) => void;\n  /** Clear announcements for the given assertiveness level. */\n  clear: (assertiveness?: Assertiveness) => void;\n}\n\n/**\n * Hook that provides access to the live announcer with automatic cleanup.\n *\n * This is the recommended way to use the announcer in SolidJS components.\n * It ensures the announcer is created only on the client and provides\n * type-safe methods for announcing and clearing messages.\n *\n * SSR Safety: Returns no-op functions during SSR. The announcer is only\n * created when the component mounts on the client.\n *\n * @example\n * ```tsx\n * function SearchResults(props) {\n *   const announcer = useAnnouncer();\n *\n *   createTrackedEffect(() => {\n *     const count = props.results.length;\n *     announcer.announce(`${count} results found`, 'polite');\n *   });\n *\n *   return <ul>...</ul>;\n * }\n * ```\n *\n * @example\n * ```tsx\n * function Form() {\n *   const announcer = useAnnouncer();\n *\n *   const onSubmit = async () => {\n *     try {\n *       await submitForm();\n *       announcer.announce('Form submitted successfully');\n *     } catch (error) {\n *       announcer.announce('Error submitting form', 'assertive');\n *     }\n *   };\n *\n *   return <form onSubmit={onSubmit}>...</form>;\n * }\n * ```\n */\nexport function useAnnouncer(): UseAnnouncerResult {\n  // During SSR, return no-op functions\n  if (isServer) {\n    return {\n      announce: () => {},\n      clear: () => {},\n    };\n  }\n\n  // Ensure the announcer is initialized\n  createTrackedEffect(() => {\n    // Initialize on first use\n    if (!liveAnnouncer) {\n      liveAnnouncer = new LiveAnnouncer();\n    }\n  });\n\n  return {\n    announce: (\n      message: Message,\n      assertiveness: Assertiveness = \"assertive\",\n      timeout: number = LIVEREGION_TIMEOUT_DELAY,\n    ) => {\n      announce(message, assertiveness, timeout);\n    },\n    clear: (assertiveness?: Assertiveness) => {\n      clearAnnouncer(assertiveness);\n    },\n  };\n}\n"],"mappings":"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"}