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

package/dist/_chunk/createFocus.js

@@ -1,5 +1,18 @@
-import { a as getEventTarget, s as getOwnerDocument } from "./focus.js";
-import { onCleanup } from "solid-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/interactions/useFocus.ts
+import { t as onOwnedCleanup } from "./owner.js";
+import { t as access } from "./reactivity.js";
+import { a as getOwnerDocument, r as getEventTarget } from "./dom.js";
 //#region src/interactions/createFocus.ts
 /**
 * createFocus - Handles focus events for the immediate target.
@@ -68,7 +81,7 @@ function createSyntheticBlurHandler() {
 function createFocus(props = {}) {
 	let cleanupRef;
 	const syntheticBlurHandler = createSyntheticBlurHandler();
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		if (cleanupRef) cleanupRef();
 	});
 	const onBlur = (e) => {
@@ -90,11 +103,11 @@ function createFocus(props = {}) {
 	};
 	return { focusProps: {
 		get onFocus() {
-			if (props.isDisabled) return;
+			if (access(props.isDisabled)) return;
 			return props.onFocus || props.onFocusChange || props.onBlur ? onFocus : void 0;
 		},
 		get onBlur() {
-			if (props.isDisabled) return;
+			if (access(props.isDisabled)) return;
 			return props.onBlur || props.onFocusChange ? onBlur : void 0;
 		}
 	} };

package/dist/_chunk/createFocus.js.map

@@ -1 +1 @@
-{"version":3,"file":"createFocus.js","names":[],"sources":["../../src/interactions/createFocus.ts"],"sourcesContent":["/**\n * createFocus - Handles focus events for the immediate target.\n *\n * This is a 1-1 port of React-Aria's useFocus hook adapted for SolidJS.\n * Focus events on child elements will be ignored.\n */\n\nimport { JSX, onCleanup } from \"solid-js\";\nimport { getOwnerDocument, getEventTarget } from \"../utils\";\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nexport interface FocusEvents {\n  /** Handler that is called when the element receives focus. */\n  onFocus?: (e: FocusEvent) => void;\n  /** Handler that is called when the element loses focus. */\n  onBlur?: (e: FocusEvent) => void;\n  /** Handler that is called when the element's focus status changes. */\n  onFocusChange?: (isFocused: boolean) => void;\n}\n\nexport interface CreateFocusProps extends FocusEvents {\n  /** Whether the focus events should be disabled. */\n  isDisabled?: boolean;\n}\n\nexport interface FocusResult {\n  /** Props to spread onto the target element. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Synthetic blur event handler for Firefox bug workaround.\n * React (and we) don't fire onBlur when an element is disabled.\n * Most browsers fire a native focusout event in this case, except for Firefox.\n * We use a MutationObserver to watch for the disabled attribute.\n */\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = (_blurEvent: Event) => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      // Return cleanup function\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the immediate target.\n * Focus events on child elements will be ignored.\n *\n * Based on react-aria's useFocus but adapted for SolidJS.\n */\nexport function createFocus(props: CreateFocusProps = {}): FocusResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so a destructure would freeze them at call time. The\n  // handlers read props.x live and the returned props are getters, mirroring\n  // upstream useFocus's per-render re-read. guard:idiomatic-solid.\n  let cleanupRef: (() => void) | undefined;\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    if (cleanupRef) {\n      cleanupRef();\n    }\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Only handle if target is the currentTarget (not bubbled from children)\n    if (e.target === e.currentTarget) {\n      if (props.onBlur) {\n        props.onBlur(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(false);\n      }\n\n      cleanupRef?.();\n      cleanupRef = undefined;\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (e.target === e.currentTarget && activeElement === getEventTarget(e)) {\n      if (props.onFocus) {\n        props.onFocus(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(true);\n      }\n\n      // Set up synthetic blur handler for Firefox bug\n      cleanupRef = syntheticBlurHandler(e, e.target);\n    }\n  };\n\n  // If disabled or no handlers, return empty props. Getters re-read props so a\n  // later isDisabled/handler change is reflected (the body itself runs once).\n  return {\n    focusProps: {\n      get onFocus() {\n        if (props.isDisabled) {\n          return undefined;\n        }\n        return props.onFocus || props.onFocusChange || props.onBlur ? onFocus : undefined;\n      },\n      get onBlur() {\n        if (props.isDisabled) {\n          return undefined;\n        }\n        return props.onBlur || props.onFocusChange ? onBlur : undefined;\n      },\n    },\n  };\n}\n"],"mappings":";;;;;;;;;AASA,SAAS,iBAAiB,KAA+B;CACvD,IAAI,gBAAgB,IAAI;CACxB,OAAO,iBAAkB,cAA0B,YAAY,eAC7D,gBAAiB,cAA0B,YAAY,iBAAiB;CAE1E,OAAO;AACT;;;;;;;AA2BA,SAAS,6BAGqB;CAC5B,IAAI,YAAY;CAChB,IAAI,WAAoC;CAExC,QAAQ,IAAgB,WAAoB;EAC1C,IACE,kBAAkB,qBAClB,kBAAkB,oBAClB,kBAAkB,uBAClB,kBAAkB,mBAClB;GACA,YAAY;GAEZ,MAAM,iBAAiB,eAAsB;IAC3C,YAAY;IAEZ,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;GAEA,OAAO,iBAAiB,YAAY,eAAe,EAAE,MAAM,KAAK,CAAC;GAEjE,WAAW,IAAI,uBAAuB;IACpC,IAAI,aAAc,OAA6B,UAAU;KACvD,YAAY;KACZ,UAAU,WAAW;KACrB,WAAW;KACX,MAAM,gBAAgB,OAAO;KAC7B,MAAM,gBACJ,WAAW,cAAc,gBAAgB,OAAO,cAAc;KAChE,OAAO,cAAc,IAAI,WAAW,QAAQ,EAAE,cAAc,CAAC,CAAC;KAC9D,OAAO,cAAc,IAAI,WAAW,YAAY;MAAE,SAAS;MAAM;KAAc,CAAC,CAAC;IACnF;GACF,CAAC;GAED,SAAS,QAAQ,QAAQ;IAAE,YAAY;IAAM,iBAAiB,CAAC,UAAU;GAAE,CAAC;GAG5E,aAAa;IACX,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;EACF;CAGF;AACF;;;;;;;AAQA,SAAgB,YAAY,QAA0B,CAAC,GAAgB;CAKrE,IAAI;CACJ,MAAM,uBAAuB,2BAA2B;CAGxD,gBAAgB;EACd,IAAI,YACF,WAAW;CAEf,CAAC;CAED,MAAM,UAAqD,MAAM;EAE/D,IAAI,EAAE,WAAW,EAAE,eAAe;GAChC,IAAI,MAAM,QACR,MAAM,OAAO,CAAC;GAGhB,IAAI,MAAM,eACR,MAAM,cAAc,KAAK;GAG3B,aAAa;GACb,aAAa,KAAA;EACf;CACF;CAEA,MAAM,WAAsD,MAAM;EAGhE,MAAM,gBAAgB,iBAAiB,EAAE,MAAM;EAC/C,MAAM,gBAAgB,gBAAgB,iBAAiB,aAAa,IAAI;EAExE,IAAI,EAAE,WAAW,EAAE,iBAAiB,kBAAkB,eAAe,CAAC,GAAG;GACvE,IAAI,MAAM,SACR,MAAM,QAAQ,CAAC;GAGjB,IAAI,MAAM,eACR,MAAM,cAAc,IAAI;GAI1B,aAAa,qBAAqB,GAAG,EAAE,MAAM;EAC/C;CACF;CAIA,OAAO,EACL,YAAY;EACV,IAAI,UAAU;GACZ,IAAI,MAAM,YACR;GAEF,OAAO,MAAM,WAAW,MAAM,iBAAiB,MAAM,SAAS,UAAU,KAAA;EAC1E;EACA,IAAI,SAAS;GACX,IAAI,MAAM,YACR;GAEF,OAAO,MAAM,UAAU,MAAM,gBAAgB,SAAS,KAAA;EACxD;CACF,EACF;AACF"}
+{"version":3,"file":"createFocus.js","names":[],"sources":["../../src/interactions/createFocus.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/interactions/useFocus.ts\n\n/**\n * createFocus - Handles focus events for the immediate target.\n *\n * This is a 1-1 port of React-Aria's useFocus hook adapted for SolidJS.\n * Focus events on child elements will be ignored.\n */\n\nimport {\n  getOwnerDocument,\n  getEventTarget,\n  onOwnedCleanup,\n  access,\n  type MaybeAccessor,\n} from \"../utils\";\nimport type { JSX } from \"@solidjs/web\";\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nexport interface FocusEvents {\n  /** Handler that is called when the element receives focus. */\n  onFocus?: (e: FocusEvent) => void;\n  /** Handler that is called when the element loses focus. */\n  onBlur?: (e: FocusEvent) => void;\n  /** Handler that is called when the element's focus status changes. */\n  onFocusChange?: (isFocused: boolean) => void;\n}\n\nexport interface CreateFocusProps extends FocusEvents {\n  /** Whether the focus events should be disabled. */\n  isDisabled?: MaybeAccessor<boolean>;\n}\n\nexport interface FocusResult {\n  /** Props to spread onto the target element. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Synthetic blur event handler for Firefox bug workaround.\n * React (and we) don't fire onBlur when an element is disabled.\n * Most browsers fire a native focusout event in this case, except for Firefox.\n * We use a MutationObserver to watch for the disabled attribute.\n */\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = (_blurEvent: Event) => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      // Return cleanup function\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the immediate target.\n * Focus events on child elements will be ignored.\n *\n * Based on react-aria's useFocus but adapted for SolidJS.\n */\nexport function createFocus(props: CreateFocusProps = {}): FocusResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so a destructure would freeze them at call time. The\n  // handlers read props.x live and the returned props are getters, mirroring\n  // upstream useFocus's per-render re-read. guard:idiomatic-solid.\n  let cleanupRef: (() => void) | undefined;\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n\n  // Cleanup on unmount\n  onOwnedCleanup(() => {\n    if (cleanupRef) {\n      cleanupRef();\n    }\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Only handle if target is the currentTarget (not bubbled from children)\n    if (e.target === e.currentTarget) {\n      if (props.onBlur) {\n        props.onBlur(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(false);\n      }\n\n      cleanupRef?.();\n      cleanupRef = undefined;\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (e.target === e.currentTarget && activeElement === getEventTarget(e)) {\n      if (props.onFocus) {\n        props.onFocus(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(true);\n      }\n\n      // Set up synthetic blur handler for Firefox bug\n      cleanupRef = syntheticBlurHandler(e, e.target);\n    }\n  };\n\n  // If disabled or no handlers, return empty props. Getters re-read props so a\n  // later isDisabled/handler change is reflected (the body itself runs once).\n  return {\n    focusProps: {\n      get onFocus() {\n        if (access(props.isDisabled)) {\n          return undefined;\n        }\n        return props.onFocus || props.onFocusChange || props.onBlur ? onFocus : undefined;\n      },\n      get onBlur() {\n        if (access(props.isDisabled)) {\n          return undefined;\n        }\n        return props.onBlur || props.onFocusChange ? onBlur : undefined;\n      },\n    },\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA6BA,SAAS,iBAAiB,KAA+B;CACvD,IAAI,gBAAgB,IAAI;CACxB,OAAO,iBAAkB,cAA0B,YAAY,eAC7D,gBAAiB,cAA0B,YAAY,iBAAiB;CAE1E,OAAO;AACT;;;;;;;AA2BA,SAAS,6BAGqB;CAC5B,IAAI,YAAY;CAChB,IAAI,WAAoC;CAExC,QAAQ,IAAgB,WAAoB;EAC1C,IACE,kBAAkB,qBAClB,kBAAkB,oBAClB,kBAAkB,uBAClB,kBAAkB,mBAClB;GACA,YAAY;GAEZ,MAAM,iBAAiB,eAAsB;IAC3C,YAAY;IAEZ,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;GAEA,OAAO,iBAAiB,YAAY,eAAe,EAAE,MAAM,KAAK,CAAC;GAEjE,WAAW,IAAI,uBAAuB;IACpC,IAAI,aAAc,OAA6B,UAAU;KACvD,YAAY;KACZ,UAAU,WAAW;KACrB,WAAW;KACX,MAAM,gBAAgB,OAAO;KAC7B,MAAM,gBACJ,WAAW,cAAc,gBAAgB,OAAO,cAAc;KAChE,OAAO,cAAc,IAAI,WAAW,QAAQ,EAAE,cAAc,CAAC,CAAC;KAC9D,OAAO,cAAc,IAAI,WAAW,YAAY;MAAE,SAAS;MAAM;KAAc,CAAC,CAAC;IACnF;GACF,CAAC;GAED,SAAS,QAAQ,QAAQ;IAAE,YAAY;IAAM,iBAAiB,CAAC,UAAU;GAAE,CAAC;GAG5E,aAAa;IACX,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;EACF;CAGF;AACF;;;;;;;AAQA,SAAgB,YAAY,QAA0B,CAAC,GAAgB;CAKrE,IAAI;CACJ,MAAM,uBAAuB,2BAA2B;CAGxD,qBAAqB;EACnB,IAAI,YACF,WAAW;CAEf,CAAC;CAED,MAAM,UAAqD,MAAM;EAE/D,IAAI,EAAE,WAAW,EAAE,eAAe;GAChC,IAAI,MAAM,QACR,MAAM,OAAO,CAAC;GAGhB,IAAI,MAAM,eACR,MAAM,cAAc,KAAK;GAG3B,aAAa;GACb,aAAa,KAAA;EACf;CACF;CAEA,MAAM,WAAsD,MAAM;EAGhE,MAAM,gBAAgB,iBAAiB,EAAE,MAAM;EAC/C,MAAM,gBAAgB,gBAAgB,iBAAiB,aAAa,IAAI;EAExE,IAAI,EAAE,WAAW,EAAE,iBAAiB,kBAAkB,eAAe,CAAC,GAAG;GACvE,IAAI,MAAM,SACR,MAAM,QAAQ,CAAC;GAGjB,IAAI,MAAM,eACR,MAAM,cAAc,IAAI;GAI1B,aAAa,qBAAqB,GAAG,EAAE,MAAM;EAC/C;CACF;CAIA,OAAO,EACL,YAAY;EACV,IAAI,UAAU;GACZ,IAAI,OAAO,MAAM,UAAU,GACzB;GAEF,OAAO,MAAM,WAAW,MAAM,iBAAiB,MAAM,SAAS,UAAU,KAAA;EAC1E;EACA,IAAI,SAAS;GACX,IAAI,OAAO,MAAM,UAAU,GACzB;GAEF,OAAO,MAAM,UAAU,MAAM,gBAAgB,SAAS,KAAA;EACxD;CACF,EACF;AACF"}

package/dist/_chunk/createFocus.jsx

@@ -1,5 +1,18 @@
-import { a as getEventTarget, s as getOwnerDocument } from "./focus.jsx";
-import { onCleanup } from "solid-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/interactions/useFocus.ts
+import { t as onOwnedCleanup } from "./owner.jsx";
+import { t as access } from "./reactivity.jsx";
+import { a as getOwnerDocument, r as getEventTarget } from "./dom.jsx";
 //#region src/interactions/createFocus.ts
 /**
 * createFocus - Handles focus events for the immediate target.
@@ -68,7 +81,7 @@ function createSyntheticBlurHandler() {
 function createFocus(props = {}) {
 	let cleanupRef;
 	const syntheticBlurHandler = createSyntheticBlurHandler();
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		if (cleanupRef) cleanupRef();
 	});
 	const onBlur = (e) => {
@@ -90,11 +103,11 @@ function createFocus(props = {}) {
 	};
 	return { focusProps: {
 		get onFocus() {
-			if (props.isDisabled) return;
+			if (access(props.isDisabled)) return;
 			return props.onFocus || props.onFocusChange || props.onBlur ? onFocus : void 0;
 		},
 		get onBlur() {
-			if (props.isDisabled) return;
+			if (access(props.isDisabled)) return;
 			return props.onBlur || props.onFocusChange ? onBlur : void 0;
 		}
 	} };

package/dist/_chunk/createFocus.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"createFocus.jsx","names":[],"sources":["../../src/interactions/createFocus.ts"],"sourcesContent":["/**\n * createFocus - Handles focus events for the immediate target.\n *\n * This is a 1-1 port of React-Aria's useFocus hook adapted for SolidJS.\n * Focus events on child elements will be ignored.\n */\n\nimport { JSX, onCleanup } from \"solid-js\";\nimport { getOwnerDocument, getEventTarget } from \"../utils\";\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nexport interface FocusEvents {\n  /** Handler that is called when the element receives focus. */\n  onFocus?: (e: FocusEvent) => void;\n  /** Handler that is called when the element loses focus. */\n  onBlur?: (e: FocusEvent) => void;\n  /** Handler that is called when the element's focus status changes. */\n  onFocusChange?: (isFocused: boolean) => void;\n}\n\nexport interface CreateFocusProps extends FocusEvents {\n  /** Whether the focus events should be disabled. */\n  isDisabled?: boolean;\n}\n\nexport interface FocusResult {\n  /** Props to spread onto the target element. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Synthetic blur event handler for Firefox bug workaround.\n * React (and we) don't fire onBlur when an element is disabled.\n * Most browsers fire a native focusout event in this case, except for Firefox.\n * We use a MutationObserver to watch for the disabled attribute.\n */\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = (_blurEvent: Event) => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      // Return cleanup function\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the immediate target.\n * Focus events on child elements will be ignored.\n *\n * Based on react-aria's useFocus but adapted for SolidJS.\n */\nexport function createFocus(props: CreateFocusProps = {}): FocusResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so a destructure would freeze them at call time. The\n  // handlers read props.x live and the returned props are getters, mirroring\n  // upstream useFocus's per-render re-read. guard:idiomatic-solid.\n  let cleanupRef: (() => void) | undefined;\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    if (cleanupRef) {\n      cleanupRef();\n    }\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Only handle if target is the currentTarget (not bubbled from children)\n    if (e.target === e.currentTarget) {\n      if (props.onBlur) {\n        props.onBlur(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(false);\n      }\n\n      cleanupRef?.();\n      cleanupRef = undefined;\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (e.target === e.currentTarget && activeElement === getEventTarget(e)) {\n      if (props.onFocus) {\n        props.onFocus(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(true);\n      }\n\n      // Set up synthetic blur handler for Firefox bug\n      cleanupRef = syntheticBlurHandler(e, e.target);\n    }\n  };\n\n  // If disabled or no handlers, return empty props. Getters re-read props so a\n  // later isDisabled/handler change is reflected (the body itself runs once).\n  return {\n    focusProps: {\n      get onFocus() {\n        if (props.isDisabled) {\n          return undefined;\n        }\n        return props.onFocus || props.onFocusChange || props.onBlur ? onFocus : undefined;\n      },\n      get onBlur() {\n        if (props.isDisabled) {\n          return undefined;\n        }\n        return props.onBlur || props.onFocusChange ? onBlur : undefined;\n      },\n    },\n  };\n}\n"],"mappings":";;;;;;;;;AASA,SAAS,iBAAiB,KAA+B;CACvD,IAAI,gBAAgB,IAAI;CACxB,OAAO,iBAAkB,cAA0B,YAAY,eAC7D,gBAAiB,cAA0B,YAAY,iBAAiB;CAE1E,OAAO;AACT;;;;;;;AA2BA,SAAS,6BAGqB;CAC5B,IAAI,YAAY;CAChB,IAAI,WAAoC;CAExC,QAAQ,IAAgB,WAAoB;EAC1C,IACE,kBAAkB,qBAClB,kBAAkB,oBAClB,kBAAkB,uBAClB,kBAAkB,mBAClB;GACA,YAAY;GAEZ,MAAM,iBAAiB,eAAsB;IAC3C,YAAY;IAEZ,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;GAEA,OAAO,iBAAiB,YAAY,eAAe,EAAE,MAAM,KAAK,CAAC;GAEjE,WAAW,IAAI,uBAAuB;IACpC,IAAI,aAAc,OAA6B,UAAU;KACvD,YAAY;KACZ,UAAU,WAAW;KACrB,WAAW;KACX,MAAM,gBAAgB,OAAO;KAC7B,MAAM,gBACJ,WAAW,cAAc,gBAAgB,OAAO,cAAc;KAChE,OAAO,cAAc,IAAI,WAAW,QAAQ,EAAE,cAAc,CAAC,CAAC;KAC9D,OAAO,cAAc,IAAI,WAAW,YAAY;MAAE,SAAS;MAAM;KAAc,CAAC,CAAC;IACnF;GACF,CAAC;GAED,SAAS,QAAQ,QAAQ;IAAE,YAAY;IAAM,iBAAiB,CAAC,UAAU;GAAE,CAAC;GAG5E,aAAa;IACX,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;EACF;CAGF;AACF;;;;;;;AAQA,SAAgB,YAAY,QAA0B,CAAC,GAAgB;CAKrE,IAAI;CACJ,MAAM,uBAAuB,2BAA2B;CAGxD,gBAAgB;EACd,IAAI,YACF,WAAW;CAEf,CAAC;CAED,MAAM,UAAqD,MAAM;EAE/D,IAAI,EAAE,WAAW,EAAE,eAAe;GAChC,IAAI,MAAM,QACR,MAAM,OAAO,CAAC;GAGhB,IAAI,MAAM,eACR,MAAM,cAAc,KAAK;GAG3B,aAAa;GACb,aAAa,KAAA;EACf;CACF;CAEA,MAAM,WAAsD,MAAM;EAGhE,MAAM,gBAAgB,iBAAiB,EAAE,MAAM;EAC/C,MAAM,gBAAgB,gBAAgB,iBAAiB,aAAa,IAAI;EAExE,IAAI,EAAE,WAAW,EAAE,iBAAiB,kBAAkB,eAAe,CAAC,GAAG;GACvE,IAAI,MAAM,SACR,MAAM,QAAQ,CAAC;GAGjB,IAAI,MAAM,eACR,MAAM,cAAc,IAAI;GAI1B,aAAa,qBAAqB,GAAG,EAAE,MAAM;EAC/C;CACF;CAIA,OAAO,EACL,YAAY;EACV,IAAI,UAAU;GACZ,IAAI,MAAM,YACR;GAEF,OAAO,MAAM,WAAW,MAAM,iBAAiB,MAAM,SAAS,UAAU,KAAA;EAC1E;EACA,IAAI,SAAS;GACX,IAAI,MAAM,YACR;GAEF,OAAO,MAAM,UAAU,MAAM,gBAAgB,SAAS,KAAA;EACxD;CACF,EACF;AACF"}
+{"version":3,"file":"createFocus.jsx","names":[],"sources":["../../src/interactions/createFocus.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/interactions/useFocus.ts\n\n/**\n * createFocus - Handles focus events for the immediate target.\n *\n * This is a 1-1 port of React-Aria's useFocus hook adapted for SolidJS.\n * Focus events on child elements will be ignored.\n */\n\nimport {\n  getOwnerDocument,\n  getEventTarget,\n  onOwnedCleanup,\n  access,\n  type MaybeAccessor,\n} from \"../utils\";\nimport type { JSX } from \"@solidjs/web\";\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nexport interface FocusEvents {\n  /** Handler that is called when the element receives focus. */\n  onFocus?: (e: FocusEvent) => void;\n  /** Handler that is called when the element loses focus. */\n  onBlur?: (e: FocusEvent) => void;\n  /** Handler that is called when the element's focus status changes. */\n  onFocusChange?: (isFocused: boolean) => void;\n}\n\nexport interface CreateFocusProps extends FocusEvents {\n  /** Whether the focus events should be disabled. */\n  isDisabled?: MaybeAccessor<boolean>;\n}\n\nexport interface FocusResult {\n  /** Props to spread onto the target element. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Synthetic blur event handler for Firefox bug workaround.\n * React (and we) don't fire onBlur when an element is disabled.\n * Most browsers fire a native focusout event in this case, except for Firefox.\n * We use a MutationObserver to watch for the disabled attribute.\n */\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = (_blurEvent: Event) => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      // Return cleanup function\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the immediate target.\n * Focus events on child elements will be ignored.\n *\n * Based on react-aria's useFocus but adapted for SolidJS.\n */\nexport function createFocus(props: CreateFocusProps = {}): FocusResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so a destructure would freeze them at call time. The\n  // handlers read props.x live and the returned props are getters, mirroring\n  // upstream useFocus's per-render re-read. guard:idiomatic-solid.\n  let cleanupRef: (() => void) | undefined;\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n\n  // Cleanup on unmount\n  onOwnedCleanup(() => {\n    if (cleanupRef) {\n      cleanupRef();\n    }\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Only handle if target is the currentTarget (not bubbled from children)\n    if (e.target === e.currentTarget) {\n      if (props.onBlur) {\n        props.onBlur(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(false);\n      }\n\n      cleanupRef?.();\n      cleanupRef = undefined;\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (e.target === e.currentTarget && activeElement === getEventTarget(e)) {\n      if (props.onFocus) {\n        props.onFocus(e);\n      }\n\n      if (props.onFocusChange) {\n        props.onFocusChange(true);\n      }\n\n      // Set up synthetic blur handler for Firefox bug\n      cleanupRef = syntheticBlurHandler(e, e.target);\n    }\n  };\n\n  // If disabled or no handlers, return empty props. Getters re-read props so a\n  // later isDisabled/handler change is reflected (the body itself runs once).\n  return {\n    focusProps: {\n      get onFocus() {\n        if (access(props.isDisabled)) {\n          return undefined;\n        }\n        return props.onFocus || props.onFocusChange || props.onBlur ? onFocus : undefined;\n      },\n      get onBlur() {\n        if (access(props.isDisabled)) {\n          return undefined;\n        }\n        return props.onBlur || props.onFocusChange ? onBlur : undefined;\n      },\n    },\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA6BA,SAAS,iBAAiB,KAA+B;CACvD,IAAI,gBAAgB,IAAI;CACxB,OAAO,iBAAkB,cAA0B,YAAY,eAC7D,gBAAiB,cAA0B,YAAY,iBAAiB;CAE1E,OAAO;AACT;;;;;;;AA2BA,SAAS,6BAGqB;CAC5B,IAAI,YAAY;CAChB,IAAI,WAAoC;CAExC,QAAQ,IAAgB,WAAoB;EAC1C,IACE,kBAAkB,qBAClB,kBAAkB,oBAClB,kBAAkB,uBAClB,kBAAkB,mBAClB;GACA,YAAY;GAEZ,MAAM,iBAAiB,eAAsB;IAC3C,YAAY;IAEZ,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;GAEA,OAAO,iBAAiB,YAAY,eAAe,EAAE,MAAM,KAAK,CAAC;GAEjE,WAAW,IAAI,uBAAuB;IACpC,IAAI,aAAc,OAA6B,UAAU;KACvD,YAAY;KACZ,UAAU,WAAW;KACrB,WAAW;KACX,MAAM,gBAAgB,OAAO;KAC7B,MAAM,gBACJ,WAAW,cAAc,gBAAgB,OAAO,cAAc;KAChE,OAAO,cAAc,IAAI,WAAW,QAAQ,EAAE,cAAc,CAAC,CAAC;KAC9D,OAAO,cAAc,IAAI,WAAW,YAAY;MAAE,SAAS;MAAM;KAAc,CAAC,CAAC;IACnF;GACF,CAAC;GAED,SAAS,QAAQ,QAAQ;IAAE,YAAY;IAAM,iBAAiB,CAAC,UAAU;GAAE,CAAC;GAG5E,aAAa;IACX,IAAI,UAAU;KACZ,SAAS,WAAW;KACpB,WAAW;IACb;GACF;EACF;CAGF;AACF;;;;;;;AAQA,SAAgB,YAAY,QAA0B,CAAC,GAAgB;CAKrE,IAAI;CACJ,MAAM,uBAAuB,2BAA2B;CAGxD,qBAAqB;EACnB,IAAI,YACF,WAAW;CAEf,CAAC;CAED,MAAM,UAAqD,MAAM;EAE/D,IAAI,EAAE,WAAW,EAAE,eAAe;GAChC,IAAI,MAAM,QACR,MAAM,OAAO,CAAC;GAGhB,IAAI,MAAM,eACR,MAAM,cAAc,KAAK;GAG3B,aAAa;GACb,aAAa,KAAA;EACf;CACF;CAEA,MAAM,WAAsD,MAAM;EAGhE,MAAM,gBAAgB,iBAAiB,EAAE,MAAM;EAC/C,MAAM,gBAAgB,gBAAgB,iBAAiB,aAAa,IAAI;EAExE,IAAI,EAAE,WAAW,EAAE,iBAAiB,kBAAkB,eAAe,CAAC,GAAG;GACvE,IAAI,MAAM,SACR,MAAM,QAAQ,CAAC;GAGjB,IAAI,MAAM,eACR,MAAM,cAAc,IAAI;GAI1B,aAAa,qBAAqB,GAAG,EAAE,MAAM;EAC/C;CACF;CAIA,OAAO,EACL,YAAY;EACV,IAAI,UAAU;GACZ,IAAI,OAAO,MAAM,UAAU,GACzB;GAEF,OAAO,MAAM,WAAW,MAAM,iBAAiB,MAAM,SAAS,UAAU,KAAA;EAC1E;EACA,IAAI,SAAS;GACX,IAAI,OAAO,MAAM,UAAU,GACzB;GAEF,OAAO,MAAM,UAAU,MAAM,gBAAgB,SAAS,KAAA;EACxD;CACF,EACF;AACF"}

package/dist/_chunk/createFocusRing.js

@@ -1,7 +1,7 @@
+import { F as isFocusVisible, N as getInteractionModality, j as createFocusVisibleListener } from "./dom.js";
 import { t as createFocus } from "./createFocus.js";
 import { t as createFocusWithin } from "./createFocusWithin.js";
-import { c as isFocusVisible, i as createFocusVisibleListener } from "./createInteractionModality.js";
-import { createEffect, createMemo, createSignal, onCleanup } from "solid-js";
+import { createMemo, createSignal, createTrackedEffect, untrack } from "solid-js";
 //#region src/interactions/createFocusRing.ts
 /**
 * createFocusRing hook for Solidaria
@@ -23,16 +23,25 @@ import { createEffect, createMemo, createSignal, onCleanup } from "solid-js";
 */
 function createFocusRing(props = {}) {
 	const { isTextInput = false, autoFocus = false, within = false } = props;
-	const [isFocused, setIsFocused] = createSignal(false);
-	const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(autoFocus || isFocusVisible());
+	const [isFocused, setIsFocused] = createSignal(false, { ownedWrite: true });
+	const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(autoFocus || getInteractionModality() !== "pointer", { ownedWrite: true });
 	const isFocusVisible$1 = createMemo(() => isFocused() && focusVisibleFlag());
-	createEffect(() => {
-		onCleanup(createFocusVisibleListener((visible) => {
+	createTrackedEffect(() => {
+		const _s2Cleanups = [];
+		const cleanup = createFocusVisibleListener((visible) => {
 			setFocusVisibleFlag(visible);
-		}, { isTextInput }));
+		}, {
+			isTextInput,
+			enabled: isFocused()
+		});
+		_s2Cleanups.push(cleanup);
+		return () => {
+			for (const c of _s2Cleanups) c();
+		};
 	});
 	const onFocusChange = (focused) => {
 		setIsFocused(focused);
+		setFocusVisibleFlag(untrack(isFocusVisible));
 	};
 	const focusResult = createFocus({
 		isDisabled: within,

package/dist/_chunk/createFocusRing.js.map

@@ -1 +1 @@
-{"version":3,"file":"createFocusRing.js","names":["isGlobalFocusVisible","isFocusVisible"],"sources":["../../src/interactions/createFocusRing.ts"],"sourcesContent":["/**\n * createFocusRing hook for Solidaria\n *\n * Determines whether a focus ring should be visible for a given element.\n * Focus rings are visible when the user navigates with keyboard, but hidden\n * when using mouse/touch.\n *\n * Port of @react-aria/focus useFocusRing.\n */\n\nimport {\n  type JSX,\n  type Accessor,\n  createSignal,\n  createEffect,\n  onCleanup,\n  createMemo,\n} from \"solid-js\";\nimport { createFocus } from \"./createFocus\";\nimport { createFocusWithin } from \"./createFocusWithin\";\nimport {\n  createFocusVisibleListener,\n  isFocusVisible as isGlobalFocusVisible,\n} from \"./createInteractionModality\";\n\nexport interface FocusRingProps {\n  /** Whether the element is a text input. */\n  isTextInput?: boolean;\n  /** Whether the element will be auto focused. */\n  autoFocus?: boolean;\n  /** Whether focus should be tracked within the element. */\n  within?: boolean;\n}\n\nexport interface FocusRingResult {\n  /** Whether the element is currently focused. */\n  isFocused: Accessor<boolean>;\n  /** Whether the focus ring should be visible. */\n  isFocusVisible: Accessor<boolean>;\n  /** Props to spread on the element to track focus. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Determines whether a focus ring should be visible for a given element.\n *\n * Focus rings are visible when:\n * - The element is focused AND\n * - The user is navigating with keyboard (not mouse/touch)\n *\n * For text inputs, focus rings are always visible when focused.\n */\nexport function createFocusRing(props: FocusRingProps = {}): FocusRingResult {\n  const { isTextInput = false, autoFocus = false, within = false } = props;\n\n  const [isFocused, setIsFocused] = createSignal(false);\n  const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(autoFocus || isGlobalFocusVisible());\n  const isFocusVisible = createMemo(() => isFocused() && focusVisibleFlag());\n\n  createEffect(() => {\n    const cleanup = createFocusVisibleListener(\n      (visible) => {\n        setFocusVisibleFlag(visible);\n      },\n      { isTextInput },\n    );\n    onCleanup(cleanup);\n  });\n\n  const onFocusChange = (focused: boolean) => {\n    setIsFocused(focused);\n  };\n\n  const focusResult = createFocus({\n    isDisabled: within,\n    onFocusChange,\n  });\n\n  const focusWithinResult = createFocusWithin({\n    isDisabled: !within,\n    onFocusWithinChange: onFocusChange,\n  });\n\n  return {\n    isFocused,\n    isFocusVisible,\n    focusProps: (within\n      ? focusWithinResult.focusWithinProps\n      : focusResult.focusProps) as JSX.HTMLAttributes<HTMLElement>,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAoDA,SAAgB,gBAAgB,QAAwB,CAAC,GAAoB;CAC3E,MAAM,EAAE,cAAc,OAAO,YAAY,OAAO,SAAS,UAAU;CAEnE,MAAM,CAAC,WAAW,gBAAgB,aAAa,KAAK;CACpD,MAAM,CAAC,kBAAkB,uBAAuB,aAAa,aAAaA,eAAqB,CAAC;CAChG,MAAMC,mBAAiB,iBAAiB,UAAU,KAAK,iBAAiB,CAAC;CAEzE,mBAAmB;EAOjB,UANgB,4BACb,YAAY;GACX,oBAAoB,OAAO;EAC7B,GACA,EAAE,YAAY,CAEA,CAAC;CACnB,CAAC;CAED,MAAM,iBAAiB,YAAqB;EAC1C,aAAa,OAAO;CACtB;CAEA,MAAM,cAAc,YAAY;EAC9B,YAAY;EACZ;CACF,CAAC;CAED,MAAM,oBAAoB,kBAAkB;EAC1C,YAAY,CAAC;EACb,qBAAqB;CACvB,CAAC;CAED,OAAO;EACL;EACA,gBAAA;EACA,YAAa,SACT,kBAAkB,mBAClB,YAAY;CAClB;AACF"}
+{"version":3,"file":"createFocusRing.js","names":["isFocusVisible","isGlobalFocusVisible"],"sources":["../../src/interactions/createFocusRing.ts"],"sourcesContent":["/**\n * createFocusRing hook for Solidaria\n *\n * Determines whether a focus ring should be visible for a given element.\n * Focus rings are visible when the user navigates with keyboard, but hidden\n * when using mouse/touch.\n *\n * Port of @react-aria/focus useFocusRing.\n */\n\nimport { createSignal, createMemo, createTrackedEffect, untrack } from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { createFocus } from \"./createFocus\";\nimport { createFocusWithin } from \"./createFocusWithin\";\nimport {\n  createFocusVisibleListener,\n  getInteractionModality,\n  isFocusVisible as isGlobalFocusVisible,\n} from \"./createInteractionModality\";\n\nexport interface FocusRingProps {\n  /** Whether the element is a text input. */\n  isTextInput?: boolean;\n  /** Whether the element will be auto focused. */\n  autoFocus?: boolean;\n  /** Whether focus should be tracked within the element. */\n  within?: boolean;\n}\n\nexport interface FocusRingResult {\n  /** Whether the element is currently focused. */\n  isFocused: Accessor<boolean>;\n  /** Whether the focus ring should be visible. */\n  isFocusVisible: Accessor<boolean>;\n  /** Props to spread on the element to track focus. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Determines whether a focus ring should be visible for a given element.\n *\n * Focus rings are visible when:\n * - The element is focused AND\n * - The user is navigating with keyboard (not mouse/touch)\n *\n * For text inputs, focus rings are always visible when focused.\n */\nexport function createFocusRing(props: FocusRingProps = {}): FocusRingResult {\n  const { isTextInput = false, autoFocus = false, within = false } = props;\n\n  const [isFocused, setIsFocused] = createSignal(false, { ownedWrite: true });\n  const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(\n    // The counter may hold an unflushed publish during hydration. A read under\n    // `untrack` still marks the owner (`context`, not `tracking`). The let is\n    // the same answer.\n    autoFocus || getInteractionModality() !== \"pointer\",\n    {\n      ownedWrite: true,\n    },\n  );\n  const isFocusVisible = createMemo(() => isFocused() && focusVisibleFlag());\n\n  createTrackedEffect(() => {\n    const _s2Cleanups: Array<() => void> = [];\n\n    const cleanup = createFocusVisibleListener(\n      (visible) => {\n        setFocusVisibleFlag(visible);\n      },\n      { isTextInput, enabled: isFocused() },\n    );\n    _s2Cleanups.push(cleanup);\n\n    return () => {\n      for (const c of _s2Cleanups) c();\n    };\n  });\n\n  const onFocusChange = (focused: boolean) => {\n    setIsFocused(focused);\n    // useFocusRing.ts:57-61 re-samples isFocusVisible() in its own onFocusChange.\n    // pointermove writes the let without notifying, so a FocusScope contain-restore\n    // after hover must not keep a stale keyboard ring. The focus event can be\n    // dispatched from an effect body.\n    setFocusVisibleFlag(untrack(isGlobalFocusVisible));\n  };\n\n  const focusResult = createFocus({\n    isDisabled: within,\n    onFocusChange,\n  });\n\n  const focusWithinResult = createFocusWithin({\n    isDisabled: !within,\n    onFocusWithinChange: onFocusChange,\n  });\n\n  return {\n    isFocused,\n    isFocusVisible,\n    focusProps: (within\n      ? focusWithinResult.focusWithinProps\n      : focusResult.focusProps) as JSX.HTMLAttributes<HTMLElement>,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAgDA,SAAgB,gBAAgB,QAAwB,CAAC,GAAoB;CAC3E,MAAM,EAAE,cAAc,OAAO,YAAY,OAAO,SAAS,UAAU;CAEnE,MAAM,CAAC,WAAW,gBAAgB,aAAa,OAAO,EAAE,YAAY,KAAK,CAAC;CAC1E,MAAM,CAAC,kBAAkB,uBAAuB,aAI9C,aAAa,uBAAuB,MAAM,WAC1C,EACE,YAAY,KACd,CACF;CACA,MAAMA,mBAAiB,iBAAiB,UAAU,KAAK,iBAAiB,CAAC;CAEzE,0BAA0B;EACxB,MAAM,cAAiC,CAAC;EAExC,MAAM,UAAU,4BACb,YAAY;GACX,oBAAoB,OAAO;EAC7B,GACA;GAAE;GAAa,SAAS,UAAU;EAAE,CACtC;EACA,YAAY,KAAK,OAAO;EAExB,aAAa;GACX,KAAK,MAAM,KAAK,aAAa,EAAE;EACjC;CACF,CAAC;CAED,MAAM,iBAAiB,YAAqB;EAC1C,aAAa,OAAO;EAKpB,oBAAoB,QAAQC,cAAoB,CAAC;CACnD;CAEA,MAAM,cAAc,YAAY;EAC9B,YAAY;EACZ;CACF,CAAC;CAED,MAAM,oBAAoB,kBAAkB;EAC1C,YAAY,CAAC;EACb,qBAAqB;CACvB,CAAC;CAED,OAAO;EACL;EACA,gBAAA;EACA,YAAa,SACT,kBAAkB,mBAClB,YAAY;CAClB;AACF"}

package/dist/_chunk/createFocusRing.jsx

@@ -1,7 +1,7 @@
+import { F as isFocusVisible, N as getInteractionModality, j as createFocusVisibleListener } from "./dom.jsx";
 import { t as createFocus } from "./createFocus.jsx";
 import { t as createFocusWithin } from "./createFocusWithin.jsx";
-import { c as isFocusVisible, i as createFocusVisibleListener } from "./createInteractionModality.jsx";
-import { createEffect, createMemo, createSignal, onCleanup } from "solid-js";
+import { createMemo, createSignal, createTrackedEffect, untrack } from "solid-js";
 //#region src/interactions/createFocusRing.ts
 /**
 * createFocusRing hook for Solidaria
@@ -23,16 +23,25 @@ import { createEffect, createMemo, createSignal, onCleanup } from "solid-js";
 */
 function createFocusRing(props = {}) {
 	const { isTextInput = false, autoFocus = false, within = false } = props;
-	const [isFocused, setIsFocused] = createSignal(false);
-	const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(autoFocus || isFocusVisible());
+	const [isFocused, setIsFocused] = createSignal(false, { ownedWrite: true });
+	const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(autoFocus || getInteractionModality() !== "pointer", { ownedWrite: true });
 	const isFocusVisible$1 = createMemo(() => isFocused() && focusVisibleFlag());
-	createEffect(() => {
-		onCleanup(createFocusVisibleListener((visible) => {
+	createTrackedEffect(() => {
+		const _s2Cleanups = [];
+		const cleanup = createFocusVisibleListener((visible) => {
 			setFocusVisibleFlag(visible);
-		}, { isTextInput }));
+		}, {
+			isTextInput,
+			enabled: isFocused()
+		});
+		_s2Cleanups.push(cleanup);
+		return () => {
+			for (const c of _s2Cleanups) c();
+		};
 	});
 	const onFocusChange = (focused) => {
 		setIsFocused(focused);
+		setFocusVisibleFlag(untrack(isFocusVisible));
 	};
 	const focusResult = createFocus({
 		isDisabled: within,

package/dist/_chunk/createFocusRing.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"createFocusRing.jsx","names":["isGlobalFocusVisible","isFocusVisible"],"sources":["../../src/interactions/createFocusRing.ts"],"sourcesContent":["/**\n * createFocusRing hook for Solidaria\n *\n * Determines whether a focus ring should be visible for a given element.\n * Focus rings are visible when the user navigates with keyboard, but hidden\n * when using mouse/touch.\n *\n * Port of @react-aria/focus useFocusRing.\n */\n\nimport {\n  type JSX,\n  type Accessor,\n  createSignal,\n  createEffect,\n  onCleanup,\n  createMemo,\n} from \"solid-js\";\nimport { createFocus } from \"./createFocus\";\nimport { createFocusWithin } from \"./createFocusWithin\";\nimport {\n  createFocusVisibleListener,\n  isFocusVisible as isGlobalFocusVisible,\n} from \"./createInteractionModality\";\n\nexport interface FocusRingProps {\n  /** Whether the element is a text input. */\n  isTextInput?: boolean;\n  /** Whether the element will be auto focused. */\n  autoFocus?: boolean;\n  /** Whether focus should be tracked within the element. */\n  within?: boolean;\n}\n\nexport interface FocusRingResult {\n  /** Whether the element is currently focused. */\n  isFocused: Accessor<boolean>;\n  /** Whether the focus ring should be visible. */\n  isFocusVisible: Accessor<boolean>;\n  /** Props to spread on the element to track focus. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Determines whether a focus ring should be visible for a given element.\n *\n * Focus rings are visible when:\n * - The element is focused AND\n * - The user is navigating with keyboard (not mouse/touch)\n *\n * For text inputs, focus rings are always visible when focused.\n */\nexport function createFocusRing(props: FocusRingProps = {}): FocusRingResult {\n  const { isTextInput = false, autoFocus = false, within = false } = props;\n\n  const [isFocused, setIsFocused] = createSignal(false);\n  const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(autoFocus || isGlobalFocusVisible());\n  const isFocusVisible = createMemo(() => isFocused() && focusVisibleFlag());\n\n  createEffect(() => {\n    const cleanup = createFocusVisibleListener(\n      (visible) => {\n        setFocusVisibleFlag(visible);\n      },\n      { isTextInput },\n    );\n    onCleanup(cleanup);\n  });\n\n  const onFocusChange = (focused: boolean) => {\n    setIsFocused(focused);\n  };\n\n  const focusResult = createFocus({\n    isDisabled: within,\n    onFocusChange,\n  });\n\n  const focusWithinResult = createFocusWithin({\n    isDisabled: !within,\n    onFocusWithinChange: onFocusChange,\n  });\n\n  return {\n    isFocused,\n    isFocusVisible,\n    focusProps: (within\n      ? focusWithinResult.focusWithinProps\n      : focusResult.focusProps) as JSX.HTMLAttributes<HTMLElement>,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAoDA,SAAgB,gBAAgB,QAAwB,CAAC,GAAoB;CAC3E,MAAM,EAAE,cAAc,OAAO,YAAY,OAAO,SAAS,UAAU;CAEnE,MAAM,CAAC,WAAW,gBAAgB,aAAa,KAAK;CACpD,MAAM,CAAC,kBAAkB,uBAAuB,aAAa,aAAaA,eAAqB,CAAC;CAChG,MAAMC,mBAAiB,iBAAiB,UAAU,KAAK,iBAAiB,CAAC;CAEzE,mBAAmB;EAOjB,UANgB,4BACb,YAAY;GACX,oBAAoB,OAAO;EAC7B,GACA,EAAE,YAAY,CAEA,CAAC;CACnB,CAAC;CAED,MAAM,iBAAiB,YAAqB;EAC1C,aAAa,OAAO;CACtB;CAEA,MAAM,cAAc,YAAY;EAC9B,YAAY;EACZ;CACF,CAAC;CAED,MAAM,oBAAoB,kBAAkB;EAC1C,YAAY,CAAC;EACb,qBAAqB;CACvB,CAAC;CAED,OAAO;EACL;EACA,gBAAA;EACA,YAAa,SACT,kBAAkB,mBAClB,YAAY;CAClB;AACF"}
+{"version":3,"file":"createFocusRing.jsx","names":["isFocusVisible","isGlobalFocusVisible"],"sources":["../../src/interactions/createFocusRing.ts"],"sourcesContent":["/**\n * createFocusRing hook for Solidaria\n *\n * Determines whether a focus ring should be visible for a given element.\n * Focus rings are visible when the user navigates with keyboard, but hidden\n * when using mouse/touch.\n *\n * Port of @react-aria/focus useFocusRing.\n */\n\nimport { createSignal, createMemo, createTrackedEffect, untrack } from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { createFocus } from \"./createFocus\";\nimport { createFocusWithin } from \"./createFocusWithin\";\nimport {\n  createFocusVisibleListener,\n  getInteractionModality,\n  isFocusVisible as isGlobalFocusVisible,\n} from \"./createInteractionModality\";\n\nexport interface FocusRingProps {\n  /** Whether the element is a text input. */\n  isTextInput?: boolean;\n  /** Whether the element will be auto focused. */\n  autoFocus?: boolean;\n  /** Whether focus should be tracked within the element. */\n  within?: boolean;\n}\n\nexport interface FocusRingResult {\n  /** Whether the element is currently focused. */\n  isFocused: Accessor<boolean>;\n  /** Whether the focus ring should be visible. */\n  isFocusVisible: Accessor<boolean>;\n  /** Props to spread on the element to track focus. */\n  focusProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\n/**\n * Determines whether a focus ring should be visible for a given element.\n *\n * Focus rings are visible when:\n * - The element is focused AND\n * - The user is navigating with keyboard (not mouse/touch)\n *\n * For text inputs, focus rings are always visible when focused.\n */\nexport function createFocusRing(props: FocusRingProps = {}): FocusRingResult {\n  const { isTextInput = false, autoFocus = false, within = false } = props;\n\n  const [isFocused, setIsFocused] = createSignal(false, { ownedWrite: true });\n  const [focusVisibleFlag, setFocusVisibleFlag] = createSignal(\n    // The counter may hold an unflushed publish during hydration. A read under\n    // `untrack` still marks the owner (`context`, not `tracking`). The let is\n    // the same answer.\n    autoFocus || getInteractionModality() !== \"pointer\",\n    {\n      ownedWrite: true,\n    },\n  );\n  const isFocusVisible = createMemo(() => isFocused() && focusVisibleFlag());\n\n  createTrackedEffect(() => {\n    const _s2Cleanups: Array<() => void> = [];\n\n    const cleanup = createFocusVisibleListener(\n      (visible) => {\n        setFocusVisibleFlag(visible);\n      },\n      { isTextInput, enabled: isFocused() },\n    );\n    _s2Cleanups.push(cleanup);\n\n    return () => {\n      for (const c of _s2Cleanups) c();\n    };\n  });\n\n  const onFocusChange = (focused: boolean) => {\n    setIsFocused(focused);\n    // useFocusRing.ts:57-61 re-samples isFocusVisible() in its own onFocusChange.\n    // pointermove writes the let without notifying, so a FocusScope contain-restore\n    // after hover must not keep a stale keyboard ring. The focus event can be\n    // dispatched from an effect body.\n    setFocusVisibleFlag(untrack(isGlobalFocusVisible));\n  };\n\n  const focusResult = createFocus({\n    isDisabled: within,\n    onFocusChange,\n  });\n\n  const focusWithinResult = createFocusWithin({\n    isDisabled: !within,\n    onFocusWithinChange: onFocusChange,\n  });\n\n  return {\n    isFocused,\n    isFocusVisible,\n    focusProps: (within\n      ? focusWithinResult.focusWithinProps\n      : focusResult.focusProps) as JSX.HTMLAttributes<HTMLElement>,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAgDA,SAAgB,gBAAgB,QAAwB,CAAC,GAAoB;CAC3E,MAAM,EAAE,cAAc,OAAO,YAAY,OAAO,SAAS,UAAU;CAEnE,MAAM,CAAC,WAAW,gBAAgB,aAAa,OAAO,EAAE,YAAY,KAAK,CAAC;CAC1E,MAAM,CAAC,kBAAkB,uBAAuB,aAI9C,aAAa,uBAAuB,MAAM,WAC1C,EACE,YAAY,KACd,CACF;CACA,MAAMA,mBAAiB,iBAAiB,UAAU,KAAK,iBAAiB,CAAC;CAEzE,0BAA0B;EACxB,MAAM,cAAiC,CAAC;EAExC,MAAM,UAAU,4BACb,YAAY;GACX,oBAAoB,OAAO;EAC7B,GACA;GAAE;GAAa,SAAS,UAAU;EAAE,CACtC;EACA,YAAY,KAAK,OAAO;EAExB,aAAa;GACX,KAAK,MAAM,KAAK,aAAa,EAAE;EACjC;CACF,CAAC;CAED,MAAM,iBAAiB,YAAqB;EAC1C,aAAa,OAAO;EAKpB,oBAAoB,QAAQC,cAAoB,CAAC;CACnD;CAEA,MAAM,cAAc,YAAY;EAC9B,YAAY;EACZ;CACF,CAAC;CAED,MAAM,oBAAoB,kBAAkB;EAC1C,YAAY,CAAC;EACb,qBAAqB;CACvB,CAAC;CAED,OAAO;EACL;EACA,gBAAA;EACA,YAAa,SACT,kBAAkB,mBAClB,YAAY;CAClB;AACF"}

package/dist/_chunk/createFocusWithin.js

@@ -1,6 +1,18 @@
-import { h as setEventTarget, s as createGlobalListeners } from "./utils.js";
-import { a as getEventTarget, s as getOwnerDocument, y as nodeContains } from "./focus.js";
-import { onCleanup } from "solid-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/interactions/useFocusWithin.ts
+import { s as createGlobalListeners } from "./utils.js";
+import { t as onOwnedCleanup } from "./owner.js";
+import { U as setEventTarget, a as getOwnerDocument, r as getEventTarget, v as nodeContains } from "./dom.js";
 //#region src/interactions/createFocusWithin.ts
 /**
 * createFocusWithin - Handles focus events for the target and its descendants.
@@ -63,7 +75,7 @@ function createFocusWithin(props = {}) {
 	const { addGlobalListener, removeAllGlobalListeners } = createGlobalListeners();
 	const syntheticBlurHandler = createSyntheticBlurHandler();
 	let cleanupRef;
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		cleanupRef?.();
 		removeAllGlobalListeners();
 	});

package/dist/_chunk/createFocusWithin.js.map

@@ -1 +1 @@
-{"version":3,"file":"createFocusWithin.js","names":[],"sources":["../../src/interactions/createFocusWithin.ts"],"sourcesContent":["/**\n * createFocusWithin - Handles focus events for the target and its descendants.\n *\n * This is a 1-1 port of React-Aria's useFocusWithin hook adapted for SolidJS.\n */\n\nimport { JSX, onCleanup } from \"solid-js\";\nimport { getOwnerDocument, getEventTarget, nodeContains, createGlobalListeners } from \"../utils\";\nimport { setEventTarget } from \"../utils/events\";\n\nexport interface FocusWithinProps {\n  /** Whether the focus within events should be disabled. */\n  isDisabled?: boolean;\n  /** Handler that is called when the target element or a descendant receives focus. */\n  onFocusWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the target element and all descendants lose focus. */\n  onBlurWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the focus within state changes. */\n  onFocusWithinChange?: (isFocusWithin: boolean) => void;\n}\n\nexport interface FocusWithinResult {\n  /** Props to spread onto the target element. */\n  focusWithinProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = () => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the target and its descendants.\n *\n * Based on react-aria's useFocusWithin but adapted for SolidJS.\n */\nexport function createFocusWithin(props: FocusWithinProps = {}): FocusWithinResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so destructuring would freeze them at call time and drop\n  // reactive updates — createOverlay/createVisuallyHidden pass a live isDisabled\n  // getter. The handlers below read props.x live; the return is getter-based so a\n  // later isDisabled flip re-computes. Mirrors upstream useFocusWithin's re-read.\n\n  // State tracking\n  let isFocusWithin = false;\n\n  // Global listeners manager\n  const { addGlobalListener, removeAllGlobalListeners } = createGlobalListeners();\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n  let cleanupRef: (() => void) | undefined;\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    cleanupRef?.();\n    removeAllGlobalListeners();\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // We don't want to trigger onBlurWithin and then immediately onFocusWithin again\n    // when moving focus inside the element. Only trigger if the currentTarget doesn't\n    // include the relatedTarget (where focus is moving).\n    if (isFocusWithin && !e.currentTarget.contains(e.relatedTarget as Node)) {\n      isFocusWithin = false;\n      removeAllGlobalListeners();\n      cleanupRef?.();\n      cleanupRef = undefined;\n\n      if (props.onBlurWithin) {\n        props.onBlurWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(false);\n      }\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (!isFocusWithin && activeElement === getEventTarget(e)) {\n      if (props.onFocusWithin) {\n        props.onFocusWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(true);\n      }\n\n      isFocusWithin = true;\n      cleanupRef = syntheticBlurHandler(e, e.target);\n\n      // Browsers don't fire blur events when elements are removed from the DOM.\n      // However, if a focus event occurs outside the element we're tracking, we\n      // can manually fire onBlur.\n      const currentTarget = e.currentTarget;\n\n      addGlobalListener(\n        \"focus\",\n        (focusEvent: Event) => {\n          if (\n            isFocusWithin &&\n            !nodeContains(currentTarget, (focusEvent as FocusEvent).target as Element)\n          ) {\n            // Create a synthetic blur event\n            const window = ownerDocument?.defaultView;\n            if (window) {\n              const nativeEvent = new window.FocusEvent(\"blur\", {\n                relatedTarget: (focusEvent as FocusEvent).target as Element,\n              });\n              setEventTarget(nativeEvent, currentTarget);\n\n              isFocusWithin = false;\n              removeAllGlobalListeners();\n\n              if (props.onBlurWithin) {\n                props.onBlurWithin(nativeEvent);\n              }\n\n              if (props.onFocusWithinChange) {\n                props.onFocusWithinChange(false);\n              }\n              cleanupRef?.();\n              cleanupRef = undefined;\n            }\n          }\n        },\n        { capture: true },\n      );\n    }\n  };\n\n  return {\n    focusWithinProps: {\n      get onFocus() {\n        return props.isDisabled ? undefined : onFocus;\n      },\n      get onBlur() {\n        return props.isDisabled ? undefined : onBlur;\n      },\n    },\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"createFocusWithin.js","names":[],"sources":["../../src/interactions/createFocusWithin.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/interactions/useFocusWithin.ts\n\n/**\n * createFocusWithin - Handles focus events for the target and its descendants.\n *\n * This is a 1-1 port of React-Aria's useFocusWithin hook adapted for SolidJS.\n */\n\nimport {\n  getOwnerDocument,\n  getEventTarget,\n  nodeContains,\n  createGlobalListeners,\n  onOwnedCleanup,\n} from \"../utils\";\nimport type { JSX } from \"@solidjs/web\";\nimport { setEventTarget } from \"../utils/events\";\n\nexport interface FocusWithinProps {\n  /** Whether the focus within events should be disabled. */\n  isDisabled?: boolean;\n  /** Handler that is called when the target element or a descendant receives focus. */\n  onFocusWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the target element and all descendants lose focus. */\n  onBlurWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the focus within state changes. */\n  onFocusWithinChange?: (isFocusWithin: boolean) => void;\n}\n\nexport interface FocusWithinResult {\n  /** Props to spread onto the target element. */\n  focusWithinProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = () => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the target and its descendants.\n *\n * Based on react-aria's useFocusWithin but adapted for SolidJS.\n */\nexport function createFocusWithin(props: FocusWithinProps = {}): FocusWithinResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so destructuring would freeze them at call time and drop\n  // reactive updates — createOverlay/createVisuallyHidden pass a live isDisabled\n  // getter. The handlers below read props.x live; the return is getter-based so a\n  // later isDisabled flip re-computes. Mirrors upstream useFocusWithin's re-read.\n\n  // State tracking\n  let isFocusWithin = false;\n\n  // Global listeners manager\n  const { addGlobalListener, removeAllGlobalListeners } = createGlobalListeners();\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n  let cleanupRef: (() => void) | undefined;\n\n  // Cleanup on unmount\n  onOwnedCleanup(() => {\n    cleanupRef?.();\n    removeAllGlobalListeners();\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // We don't want to trigger onBlurWithin and then immediately onFocusWithin again\n    // when moving focus inside the element. Only trigger if the currentTarget doesn't\n    // include the relatedTarget (where focus is moving).\n    if (isFocusWithin && !e.currentTarget.contains(e.relatedTarget as Node)) {\n      isFocusWithin = false;\n      removeAllGlobalListeners();\n      cleanupRef?.();\n      cleanupRef = undefined;\n\n      if (props.onBlurWithin) {\n        props.onBlurWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(false);\n      }\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (!isFocusWithin && activeElement === getEventTarget(e)) {\n      if (props.onFocusWithin) {\n        props.onFocusWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(true);\n      }\n\n      isFocusWithin = true;\n      cleanupRef = syntheticBlurHandler(e, e.target);\n\n      // Browsers don't fire blur events when elements are removed from the DOM.\n      // However, if a focus event occurs outside the element we're tracking, we\n      // can manually fire onBlur.\n      const currentTarget = e.currentTarget;\n\n      addGlobalListener(\n        \"focus\",\n        (focusEvent: Event) => {\n          if (\n            isFocusWithin &&\n            !nodeContains(currentTarget, (focusEvent as FocusEvent).target as Element)\n          ) {\n            // Create a synthetic blur event\n            const window = ownerDocument?.defaultView;\n            if (window) {\n              const nativeEvent = new window.FocusEvent(\"blur\", {\n                relatedTarget: (focusEvent as FocusEvent).target as Element,\n              });\n              setEventTarget(nativeEvent, currentTarget);\n\n              isFocusWithin = false;\n              removeAllGlobalListeners();\n\n              if (props.onBlurWithin) {\n                props.onBlurWithin(nativeEvent);\n              }\n\n              if (props.onFocusWithinChange) {\n                props.onFocusWithinChange(false);\n              }\n              cleanupRef?.();\n              cleanupRef = undefined;\n            }\n          }\n        },\n        { capture: true },\n      );\n    }\n  };\n\n  return {\n    focusWithinProps: {\n      get onFocus() {\n        return props.isDisabled ? undefined : onFocus;\n      },\n      get onBlur() {\n        return props.isDisabled ? undefined : onBlur;\n      },\n    },\n  };\n}\n"],"mappings":"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"}

package/dist/_chunk/createFocusWithin.jsx

@@ -1,6 +1,18 @@
-import { h as setEventTarget, s as createGlobalListeners } from "./utils.jsx";
-import { a as getEventTarget, s as getOwnerDocument, y as nodeContains } from "./focus.jsx";
-import { onCleanup } from "solid-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/interactions/useFocusWithin.ts
+import { s as createGlobalListeners } from "./utils.jsx";
+import { t as onOwnedCleanup } from "./owner.jsx";
+import { U as setEventTarget, a as getOwnerDocument, r as getEventTarget, v as nodeContains } from "./dom.jsx";
 //#region src/interactions/createFocusWithin.ts
 /**
 * createFocusWithin - Handles focus events for the target and its descendants.
@@ -63,7 +75,7 @@ function createFocusWithin(props = {}) {
 	const { addGlobalListener, removeAllGlobalListeners } = createGlobalListeners();
 	const syntheticBlurHandler = createSyntheticBlurHandler();
 	let cleanupRef;
-	onCleanup(() => {
+	onOwnedCleanup(() => {
 		cleanupRef?.();
 		removeAllGlobalListeners();
 	});

package/dist/_chunk/createFocusWithin.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"createFocusWithin.jsx","names":[],"sources":["../../src/interactions/createFocusWithin.ts"],"sourcesContent":["/**\n * createFocusWithin - Handles focus events for the target and its descendants.\n *\n * This is a 1-1 port of React-Aria's useFocusWithin hook adapted for SolidJS.\n */\n\nimport { JSX, onCleanup } from \"solid-js\";\nimport { getOwnerDocument, getEventTarget, nodeContains, createGlobalListeners } from \"../utils\";\nimport { setEventTarget } from \"../utils/events\";\n\nexport interface FocusWithinProps {\n  /** Whether the focus within events should be disabled. */\n  isDisabled?: boolean;\n  /** Handler that is called when the target element or a descendant receives focus. */\n  onFocusWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the target element and all descendants lose focus. */\n  onBlurWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the focus within state changes. */\n  onFocusWithinChange?: (isFocusWithin: boolean) => void;\n}\n\nexport interface FocusWithinResult {\n  /** Props to spread onto the target element. */\n  focusWithinProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = () => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the target and its descendants.\n *\n * Based on react-aria's useFocusWithin but adapted for SolidJS.\n */\nexport function createFocusWithin(props: FocusWithinProps = {}): FocusWithinResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so destructuring would freeze them at call time and drop\n  // reactive updates — createOverlay/createVisuallyHidden pass a live isDisabled\n  // getter. The handlers below read props.x live; the return is getter-based so a\n  // later isDisabled flip re-computes. Mirrors upstream useFocusWithin's re-read.\n\n  // State tracking\n  let isFocusWithin = false;\n\n  // Global listeners manager\n  const { addGlobalListener, removeAllGlobalListeners } = createGlobalListeners();\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n  let cleanupRef: (() => void) | undefined;\n\n  // Cleanup on unmount\n  onCleanup(() => {\n    cleanupRef?.();\n    removeAllGlobalListeners();\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // We don't want to trigger onBlurWithin and then immediately onFocusWithin again\n    // when moving focus inside the element. Only trigger if the currentTarget doesn't\n    // include the relatedTarget (where focus is moving).\n    if (isFocusWithin && !e.currentTarget.contains(e.relatedTarget as Node)) {\n      isFocusWithin = false;\n      removeAllGlobalListeners();\n      cleanupRef?.();\n      cleanupRef = undefined;\n\n      if (props.onBlurWithin) {\n        props.onBlurWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(false);\n      }\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (!isFocusWithin && activeElement === getEventTarget(e)) {\n      if (props.onFocusWithin) {\n        props.onFocusWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(true);\n      }\n\n      isFocusWithin = true;\n      cleanupRef = syntheticBlurHandler(e, e.target);\n\n      // Browsers don't fire blur events when elements are removed from the DOM.\n      // However, if a focus event occurs outside the element we're tracking, we\n      // can manually fire onBlur.\n      const currentTarget = e.currentTarget;\n\n      addGlobalListener(\n        \"focus\",\n        (focusEvent: Event) => {\n          if (\n            isFocusWithin &&\n            !nodeContains(currentTarget, (focusEvent as FocusEvent).target as Element)\n          ) {\n            // Create a synthetic blur event\n            const window = ownerDocument?.defaultView;\n            if (window) {\n              const nativeEvent = new window.FocusEvent(\"blur\", {\n                relatedTarget: (focusEvent as FocusEvent).target as Element,\n              });\n              setEventTarget(nativeEvent, currentTarget);\n\n              isFocusWithin = false;\n              removeAllGlobalListeners();\n\n              if (props.onBlurWithin) {\n                props.onBlurWithin(nativeEvent);\n              }\n\n              if (props.onFocusWithinChange) {\n                props.onFocusWithinChange(false);\n              }\n              cleanupRef?.();\n              cleanupRef = undefined;\n            }\n          }\n        },\n        { capture: true },\n      );\n    }\n  };\n\n  return {\n    focusWithinProps: {\n      get onFocus() {\n        return props.isDisabled ? undefined : onFocus;\n      },\n      get onBlur() {\n        return props.isDisabled ? undefined : onBlur;\n      },\n    },\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"createFocusWithin.jsx","names":[],"sources":["../../src/interactions/createFocusWithin.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/interactions/useFocusWithin.ts\n\n/**\n * createFocusWithin - Handles focus events for the target and its descendants.\n *\n * This is a 1-1 port of React-Aria's useFocusWithin hook adapted for SolidJS.\n */\n\nimport {\n  getOwnerDocument,\n  getEventTarget,\n  nodeContains,\n  createGlobalListeners,\n  onOwnedCleanup,\n} from \"../utils\";\nimport type { JSX } from \"@solidjs/web\";\nimport { setEventTarget } from \"../utils/events\";\n\nexport interface FocusWithinProps {\n  /** Whether the focus within events should be disabled. */\n  isDisabled?: boolean;\n  /** Handler that is called when the target element or a descendant receives focus. */\n  onFocusWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the target element and all descendants lose focus. */\n  onBlurWithin?: (e: FocusEvent) => void;\n  /** Handler that is called when the focus within state changes. */\n  onFocusWithinChange?: (isFocusWithin: boolean) => void;\n}\n\nexport interface FocusWithinResult {\n  /** Props to spread onto the target element. */\n  focusWithinProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nfunction getActiveElement(doc: Document): Element | null {\n  let activeElement = doc.activeElement;\n  while (activeElement && (activeElement as Element).shadowRoot?.activeElement) {\n    activeElement = (activeElement as Element).shadowRoot?.activeElement ?? null;\n  }\n  return activeElement;\n}\n\nfunction createSyntheticBlurHandler(): (\n  _e: FocusEvent,\n  target: Element,\n) => (() => void) | undefined {\n  let isFocused = false;\n  let observer: MutationObserver | null = null;\n\n  return (_e: FocusEvent, target: Element) => {\n    if (\n      target instanceof HTMLButtonElement ||\n      target instanceof HTMLInputElement ||\n      target instanceof HTMLTextAreaElement ||\n      target instanceof HTMLSelectElement\n    ) {\n      isFocused = true;\n\n      const onBlurHandler = () => {\n        isFocused = false;\n\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n\n      target.addEventListener(\"focusout\", onBlurHandler, { once: true });\n\n      observer = new MutationObserver(() => {\n        if (isFocused && (target as HTMLButtonElement).disabled) {\n          isFocused = false;\n          observer?.disconnect();\n          observer = null;\n          const ownerDocument = target.ownerDocument;\n          const relatedTarget =\n            target === ownerDocument.activeElement ? null : ownerDocument.activeElement;\n          target.dispatchEvent(new FocusEvent(\"blur\", { relatedTarget }));\n          target.dispatchEvent(new FocusEvent(\"focusout\", { bubbles: true, relatedTarget }));\n        }\n      });\n\n      observer.observe(target, { attributes: true, attributeFilter: [\"disabled\"] });\n\n      return () => {\n        if (observer) {\n          observer.disconnect();\n          observer = null;\n        }\n      };\n    }\n\n    return undefined;\n  };\n}\n\n/**\n * Handles focus events for the target and its descendants.\n *\n * Based on react-aria's useFocusWithin but adapted for SolidJS.\n */\nexport function createFocusWithin(props: FocusWithinProps = {}): FocusWithinResult {\n  // Read isDisabled/handlers off `props` directly (not via destructure): a Solid\n  // hook body runs once, so destructuring would freeze them at call time and drop\n  // reactive updates — createOverlay/createVisuallyHidden pass a live isDisabled\n  // getter. The handlers below read props.x live; the return is getter-based so a\n  // later isDisabled flip re-computes. Mirrors upstream useFocusWithin's re-read.\n\n  // State tracking\n  let isFocusWithin = false;\n\n  // Global listeners manager\n  const { addGlobalListener, removeAllGlobalListeners } = createGlobalListeners();\n  const syntheticBlurHandler = createSyntheticBlurHandler();\n  let cleanupRef: (() => void) | undefined;\n\n  // Cleanup on unmount\n  onOwnedCleanup(() => {\n    cleanupRef?.();\n    removeAllGlobalListeners();\n  });\n\n  const onBlur: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // We don't want to trigger onBlurWithin and then immediately onFocusWithin again\n    // when moving focus inside the element. Only trigger if the currentTarget doesn't\n    // include the relatedTarget (where focus is moving).\n    if (isFocusWithin && !e.currentTarget.contains(e.relatedTarget as Node)) {\n      isFocusWithin = false;\n      removeAllGlobalListeners();\n      cleanupRef?.();\n      cleanupRef = undefined;\n\n      if (props.onBlurWithin) {\n        props.onBlurWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(false);\n      }\n    }\n  };\n\n  const onFocus: JSX.EventHandler<HTMLElement, FocusEvent> = (e) => {\n    // Ignore events bubbling through portals\n    if (!e.currentTarget.contains(e.target as Node)) {\n      return;\n    }\n\n    // Double check that document.activeElement actually matches e.target\n    // in case a previously chained focus handler already moved focus somewhere else.\n    const ownerDocument = getOwnerDocument(e.target);\n    const activeElement = ownerDocument ? getActiveElement(ownerDocument) : null;\n\n    if (!isFocusWithin && activeElement === getEventTarget(e)) {\n      if (props.onFocusWithin) {\n        props.onFocusWithin(e);\n      }\n\n      if (props.onFocusWithinChange) {\n        props.onFocusWithinChange(true);\n      }\n\n      isFocusWithin = true;\n      cleanupRef = syntheticBlurHandler(e, e.target);\n\n      // Browsers don't fire blur events when elements are removed from the DOM.\n      // However, if a focus event occurs outside the element we're tracking, we\n      // can manually fire onBlur.\n      const currentTarget = e.currentTarget;\n\n      addGlobalListener(\n        \"focus\",\n        (focusEvent: Event) => {\n          if (\n            isFocusWithin &&\n            !nodeContains(currentTarget, (focusEvent as FocusEvent).target as Element)\n          ) {\n            // Create a synthetic blur event\n            const window = ownerDocument?.defaultView;\n            if (window) {\n              const nativeEvent = new window.FocusEvent(\"blur\", {\n                relatedTarget: (focusEvent as FocusEvent).target as Element,\n              });\n              setEventTarget(nativeEvent, currentTarget);\n\n              isFocusWithin = false;\n              removeAllGlobalListeners();\n\n              if (props.onBlurWithin) {\n                props.onBlurWithin(nativeEvent);\n              }\n\n              if (props.onFocusWithinChange) {\n                props.onFocusWithinChange(false);\n              }\n              cleanupRef?.();\n              cleanupRef = undefined;\n            }\n          }\n        },\n        { capture: true },\n      );\n    }\n  };\n\n  return {\n    focusWithinProps: {\n      get onFocus() {\n        return props.isDisabled ? undefined : onFocus;\n      },\n      get onBlur() {\n        return props.isDisabled ? undefined : onBlur;\n      },\n    },\n  };\n}\n"],"mappings":"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"}

package/dist/_chunk/createFocusable.js

@@ -1,37 +1,22 @@
-import { i as mergeProps$1 } from "./env.js";
-import { t as focusSafely } from "./focus.js";
-import { t as createFocus } from "./createFocus.js";
-import { createContext, onMount, useContext } from "solid-js";
-//#region src/interactions/createKeyboard.ts
-/**
-* Wraps a keyboard event handler to make stopPropagation the default,
-* and support continuePropagation instead.
-*/
-function createEventHandler(handler) {
-	if (!handler) return;
-	return (e) => {
-		let shouldStopPropagation = true;
-		const parentContinuePropagation = e.continuePropagation;
-		handler(Object.assign(e, { continuePropagation() {
-			shouldStopPropagation = false;
-			if (typeof parentContinuePropagation === "function") parentContinuePropagation.call(e);
-		} }));
-		if (shouldStopPropagation) e.stopPropagation();
-	};
-}
-/**
-* Handles keyboard interactions for a focusable element.
+/*
+* 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
 *
-* Based on react-aria's useKeyboard but adapted for SolidJS.
+* 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.
 */
-function createKeyboard(props = {}) {
-	if (props.isDisabled) return { keyboardProps: {} };
-	return { keyboardProps: {
-		onKeyDown: createEventHandler(props.onKeyDown),
-		onKeyUp: createEventHandler(props.onKeyUp)
-	} };
-}
-//#endregion
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/interactions/useFocusable.tsx
+import { t as mergeProps } from "./mergeProps.js";
+import { x as splitProps } from "./utils.js";
+import { n as useContextOptional } from "./owner.js";
+import { w as focusSafely } from "./dom.js";
+import { t as createFocus } from "./createFocus.js";
+import { t as createKeyboard } from "./createKeyboard.js";
+import { createContext, onSettled } from "solid-js";
 //#region src/interactions/createFocusable.ts
 /**
 * createFocusable - Makes an element focusable and capable of auto focus.
@@ -44,20 +29,20 @@ function createKeyboard(props = {}) {
 */
 const FocusableContext = createContext(null);
 /**
-* Hook to consume the FocusableContext and sync the ref.
+* Consume FocusableContext without snapshotting getters (aria-expanded and
+* other live trigger props) and sync the child ref to the provider — RAC
+* `useFocusableContext` + `useSyncRef`.
 */
-function useFocusableContext(setRef) {
-	const context = useContext(FocusableContext) || {};
-	if (context.ref) {
-		const contextRef = context.ref;
-		const originalSetRef = setRef;
-		setRef = (el) => {
-			originalSetRef(el);
-			contextRef(el);
-		};
-	}
-	const { ref: _, ...otherProps } = context;
-	return otherProps;
+function useFocusableContext() {
+	const context = useContextOptional(FocusableContext) ?? {};
+	const [, otherProps] = splitProps(context, ["ref"]);
+	return {
+		props: otherProps,
+		syncRef: (el) => {
+			const contextRef = context.ref;
+			if (typeof contextRef === "function") contextRef(el);
+		}
+	};
 }
 function isDisabledValue(isDisabled) {
 	if (typeof isDisabled === "function") return isDisabled();
@@ -92,31 +77,32 @@ function isDisabledValue(isDisabled) {
 function createFocusable(props = {}, ref) {
 	let elementRef = null;
 	let autoFocusDone = false;
+	const context = useFocusableContext();
 	const setRef = (el) => {
 		elementRef = el;
 		ref?.(el);
+		context.syncRef(el);
 	};
 	const { focusProps } = createFocus({
-		isDisabled: isDisabledValue(props.isDisabled),
+		isDisabled: () => isDisabledValue(props.isDisabled),
 		onFocus: props.onFocus,
 		onBlur: props.onBlur,
 		onFocusChange: props.onFocusChange
 	});
 	const { keyboardProps } = createKeyboard({
-		isDisabled: isDisabledValue(props.isDisabled),
+		isDisabled: () => isDisabledValue(props.isDisabled),
 		onKeyDown: props.onKeyDown,
 		onKeyUp: props.onKeyUp
 	});
-	const interactions = mergeProps$1(focusProps, keyboardProps);
-	const contextProps = useFocusableContext(setRef);
-	const interactionProps = isDisabledValue(props.isDisabled) ? {} : contextProps;
-	onMount(() => {
+	const interactions = mergeProps(focusProps, keyboardProps);
+	const interactionProps = isDisabledValue(props.isDisabled) ? {} : context.props;
+	onSettled(() => {
 		if (props.autoFocus && elementRef && !autoFocusDone) {
 			focusSafely(elementRef);
 			autoFocusDone = true;
 		}
 	});
-	return { focusableProps: mergeProps$1({
+	return { focusableProps: mergeProps({
 		...interactions,
 		get tabIndex() {
 			if (isDisabledValue(props.isDisabled)) return;
@@ -126,6 +112,6 @@ function createFocusable(props = {}, ref) {
 	}, interactionProps) };
 }
 //#endregion
-export { createFocusable as n, createKeyboard as r, FocusableContext as t };
+export { createFocusable as n, FocusableContext as t };
 
 //# sourceMappingURL=createFocusable.js.map