@proyecto-viviana/solidaria-components 0.5.0 → 0.7.0-rc.0

package/dist/Dialog.jsx

@@ -1,8 +1,23 @@
-import { DEFAULT_SLOT, filterDOMProps, useRenderProps } from "./utils.jsx";
+/*
+* Copyright 2022 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-components/src/Dialog.tsx
+import { DEFAULT_SLOT, Provider, filterDOMProps, useRenderProps } from "./utils.jsx";
 import { a as useOverlayTriggerState, i as useDialogTrigger, t as DialogTriggerContext } from "./contexts.jsx";
 import { ButtonContext } from "./Button.jsx";
-import { Match, Switch, createContext, createEffect, createMemo, createUniqueId, splitProps, useContext } from "solid-js";
-import { createDialog, createOverlayTrigger, focusSafely } from "@proyecto-viviana/solidaria";
+import { TextContext } from "./Text.jsx";
+import { OverlayContext } from "./Popover.jsx";
+import { Match, Switch, createContext, createMemo, createSignal, createTrackedEffect, createUniqueId, useContext } from "solid-js";
+import { createDialog, createOverlayTrigger, focusSafely, useIsHidden } from "@proyecto-viviana/solidaria";
+import { splitProps } from "@proyecto-viviana/solidaria/utils";
 import { createOverlayTriggerState } from "@proyecto-viviana/solid-stately";
 //#region src/Dialog.tsx
 /**
@@ -31,11 +46,11 @@ function DialogTrigger(props) {
 		},
 		onOpenChange: local.onOpenChange
 	});
-	let triggerRef = null;
+	const [triggerRef, setTriggerElement] = createSignal(null);
 	const triggerId = createUniqueId();
-	const triggerAria = createOverlayTrigger({ type: "dialog" }, state, () => triggerRef);
+	const triggerAria = createOverlayTrigger({ type: "dialog" }, state, triggerRef);
 	const restoreFocusToTrigger = () => {
-		const trigger = triggerRef;
+		const trigger = triggerRef();
 		if (!trigger?.isConnected) return;
 		const win = trigger.ownerDocument.defaultView ?? window;
 		win.requestAnimationFrame(() => {
@@ -59,23 +74,24 @@ function DialogTrigger(props) {
 			const wasOpen = state.isOpen();
 			state.toggle();
 			if (wasOpen) restoreFocusToTrigger();
-		}
+		},
+		point: state.point,
+		setPoint: state.setPoint
 	};
 	const setTriggerRef = (el) => {
 		if (!el) return;
-		if (!triggerRef || !triggerRef.isConnected) triggerRef = el;
+		if (!triggerRef()) setTriggerElement(el);
 	};
 	const contextValue = createMemo(() => ({
 		state: stateWithFocusRestore,
-		triggerRef: () => triggerRef,
+		triggerRef,
 		setTriggerRef,
 		triggerId,
 		triggerProps: triggerAria.triggerProps,
 		overlayProps: triggerAria.overlayProps
 	}));
-	return <DialogTriggerContext.Provider value={contextValue()}>
-      {props.children}
-    </DialogTriggerContext.Provider>;
+	if (useIsHidden()()) return null;
+	return <DialogTriggerContext value={contextValue()}>{props.children}</DialogTriggerContext>;
 }
 /**
 * A dialog is an overlay shown above other content in an application.
@@ -93,8 +109,11 @@ function Dialog(props) {
 		"aria-describedby"
 	]);
 	let dialogRef;
+	const setDialogRef = (element) => {
+		dialogRef = element;
+	};
 	const triggerContext = useContext(DialogTriggerContext);
-	const { dialogProps, titleProps } = createDialog({
+	const { dialogProps, titleProps, contentProps } = createDialog({
 		get role() {
 			return ariaProps.role;
 		},
@@ -110,6 +129,7 @@ function Dialog(props) {
 	}, () => dialogRef);
 	const titleId = () => titleProps()?.id;
 	const overlayState = useOverlayTriggerState();
+	const overlayFocus = useContext(OverlayContext);
 	const close = () => {
 		local.onClose?.();
 		if (overlayState) {
@@ -118,7 +138,15 @@ function Dialog(props) {
 		}
 		triggerContext?.state.close();
 	};
-	createEffect(() => {});
+	const ariaLabelledBy = () => {
+		const p = dialogProps();
+		if (p["aria-labelledby"]) return p["aria-labelledby"];
+		if (p["aria-label"]) return;
+		return triggerContext?.triggerRef()?.id ?? triggerContext?.triggerId;
+	};
+	createTrackedEffect(() => {
+		overlayFocus?.setContain(true);
+	});
 	const renderValues = createMemo(() => ({ close }));
 	const renderProps = useRenderProps({
 		get children() {
@@ -129,19 +157,24 @@ function Dialog(props) {
 		defaultClassName: "solidaria-Dialog"
 	}, renderValues);
 	const domProps = createMemo(() => filterDOMProps(rest, { global: true }));
-	return <DialogContext.Provider value={{
+	return <DialogContext value={{
 		close,
 		titleId: titleId()
 	}}>
-      <section {...dialogProps()} {...domProps()} ref={dialogRef} class={renderProps.class()} style={renderProps.style()} slot={local.slot}>
-        <ButtonContext.Provider value={{ slots: {
+      <section {...triggerContext?.overlayProps} {...dialogProps()} {...domProps()} aria-labelledby={ariaLabelledBy()} ref={setDialogRef} class={renderProps.class()} style={renderProps.style()} slot={local.slot}>
+        <Provider values={[[TextContext, { slots: {
+		[DEFAULT_SLOT]: {},
+		get description() {
+			return contentProps();
+		}
+	} }], [ButtonContext, { slots: {
 		[DEFAULT_SLOT]: {},
 		close: { onPress: () => close() }
-	} }}>
+	} }]]}>
           {renderProps.renderChildren()}
-        </ButtonContext.Provider>
+        </Provider>
       </section>
-    </DialogContext.Provider>;
+    </DialogContext>;
 }
 /**
 * Heading element for dialog title.
@@ -152,35 +185,50 @@ function Heading(props) {
 	const level = () => props.level ?? 2;
 	const id = () => dialogContext?.titleId;
 	let headingRef;
-	createEffect(() => {});
+	const setHeadingRef = (element) => {
+		headingRef = element;
+	};
+	createTrackedEffect(() => {
+		const el = headingRef;
+		if (!el) return;
+		const contextId = id();
+		if (contextId) {
+			el.id = contextId;
+			return;
+		}
+		if (!el.id) {
+			const labelledBy = el.closest("[role=\"dialog\"],[role=\"alertdialog\"]")?.getAttribute("aria-labelledby");
+			if (labelledBy && !el.ownerDocument.getElementById(labelledBy)) el.id = labelledBy;
+		}
+	});
 	return <Switch>
       <Match when={level() === 1}>
-        <h1 ref={headingRef} id={id()} class={props.class}>
+        <h1 ref={setHeadingRef} id={id()} class={props.class}>
           {props.children}
         </h1>
       </Match>
       <Match when={level() === 2}>
-        <h2 ref={headingRef} id={id()} class={props.class}>
+        <h2 ref={setHeadingRef} id={id()} class={props.class}>
           {props.children}
         </h2>
       </Match>
       <Match when={level() === 3}>
-        <h3 ref={headingRef} id={id()} class={props.class}>
+        <h3 ref={setHeadingRef} id={id()} class={props.class}>
           {props.children}
         </h3>
       </Match>
       <Match when={level() === 4}>
-        <h4 ref={headingRef} id={id()} class={props.class}>
+        <h4 ref={setHeadingRef} id={id()} class={props.class}>
           {props.children}
         </h4>
       </Match>
       <Match when={level() === 5}>
-        <h5 ref={headingRef} id={id()} class={props.class}>
+        <h5 ref={setHeadingRef} id={id()} class={props.class}>
           {props.children}
         </h5>
       </Match>
       <Match when={level() === 6}>
-        <h6 ref={headingRef} id={id()} class={props.class}>
+        <h6 ref={setHeadingRef} id={id()} class={props.class}>
           {props.children}
         </h6>
       </Match>

package/dist/Dialog.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.jsx","names":[],"sources":["../src/Dialog.tsx"],"sourcesContent":["/**\n * Dialog component for solidaria-components\n *\n * A headless dialog component that combines ARIA hooks.\n * Port of react-aria-components Dialog.\n */\n\nimport {\n  type JSX,\n  createContext,\n  createEffect,\n  createMemo,\n  createUniqueId,\n  splitProps,\n  useContext,\n  Switch,\n  Match,\n} from \"solid-js\";\nimport {\n  createDialog,\n  createOverlayTrigger,\n  focusSafely,\n  type AriaDialogProps,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n  createOverlayTriggerState,\n  type OverlayTriggerState,\n} from \"@proyecto-viviana/solid-stately\";\nimport { DialogTriggerContext, useOverlayTriggerState } from \"./contexts\";\nimport { ButtonContext } from \"./Button\";\nimport {\n  DEFAULT_SLOT,\n  type RenderChildren,\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  type SlotProps,\n  useRenderProps,\n  filterDOMProps,\n} from \"./utils\";\n\nexport interface DialogRenderProps {\n  /** Function to close the dialog */\n  close: () => void;\n}\n\nexport interface DialogProps extends Omit<AriaDialogProps, \"class\" | \"style\">, SlotProps {\n  /** The children of the component - can be JSX or render function. */\n  children?: RenderChildren<DialogRenderProps>;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<DialogRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<DialogRenderProps>;\n  /** Callback when dialog should close */\n  onClose?: () => void;\n}\n\nexport interface DialogTriggerProps {\n  /** The children - should include a trigger and modal/popover content. */\n  children: JSX.Element;\n  /** Whether the dialog is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the dialog is open by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Callback when open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\ninterface DialogContextValue {\n  close: () => void;\n  titleId?: string;\n}\n\nexport const DialogContext = createContext<DialogContextValue | null>(null);\n\nexport { DialogTriggerContext, useDialogTrigger } from \"./contexts\";\n\n/**\n * A DialogTrigger opens a dialog when a trigger element is pressed.\n * Children should include a trigger element (e.g. Button) and the dialog content.\n */\nexport function DialogTrigger(props: DialogTriggerProps): JSX.Element {\n  const [local] = splitProps(props, [\"isOpen\", \"defaultOpen\", \"onOpenChange\"]);\n\n  const state = createOverlayTriggerState({\n    get isOpen() {\n      return local.isOpen;\n    },\n    get defaultOpen() {\n      return local.defaultOpen;\n    },\n    onOpenChange: local.onOpenChange,\n  });\n\n  let triggerRef: HTMLElement | null = null;\n  const triggerId = createUniqueId();\n\n  // Create overlay trigger props so registered trigger components can expose\n  // the same expanded/controls relationship as React Aria DialogTrigger.\n  const triggerAria = createOverlayTrigger({ type: \"dialog\" }, state, () => triggerRef);\n\n  const restoreFocusToTrigger = () => {\n    const trigger = triggerRef;\n    if (!trigger?.isConnected) return;\n\n    const win = trigger.ownerDocument.defaultView ?? window;\n    win.requestAnimationFrame(() => {\n      win.requestAnimationFrame(() => {\n        if (trigger.isConnected && !state.isOpen()) {\n          focusSafely(trigger);\n        }\n      });\n    });\n  };\n\n  const stateWithFocusRestore: OverlayTriggerState = {\n    isOpen: state.isOpen,\n    setOpen: (isOpen) => {\n      state.setOpen(isOpen);\n      if (!isOpen) {\n        restoreFocusToTrigger();\n      }\n    },\n    open: state.open,\n    close: () => {\n      state.close();\n      restoreFocusToTrigger();\n    },\n    toggle: () => {\n      const wasOpen = state.isOpen();\n      state.toggle();\n      if (wasOpen) {\n        restoreFocusToTrigger();\n      }\n    },\n  };\n\n  const setTriggerRef = (el: HTMLElement | null) => {\n    if (!el) return;\n    if (!triggerRef || !triggerRef.isConnected) {\n      triggerRef = el;\n    }\n  };\n\n  // Context value - memoized to avoid unnecessary re-renders\n  const contextValue = createMemo(() => ({\n    state: stateWithFocusRestore,\n    triggerRef: () => triggerRef,\n    setTriggerRef,\n    triggerId,\n    triggerProps: triggerAria.triggerProps,\n    overlayProps: triggerAria.overlayProps,\n  }));\n\n  // In SolidJS, we simply render children directly within the provider\n  return (\n    <DialogTriggerContext.Provider value={contextValue()}>\n      {props.children}\n    </DialogTriggerContext.Provider>\n  );\n}\n\n/**\n * A dialog is an overlay shown above other content in an application.\n */\nexport function Dialog(props: DialogProps): JSX.Element {\n  const [local, ariaProps, rest] = splitProps(\n    props,\n    [\"class\", \"style\", \"slot\", \"onClose\"],\n    [\"role\", \"aria-label\", \"aria-labelledby\", \"aria-describedby\"],\n  );\n\n  let dialogRef!: HTMLElement;\n\n  // Get trigger context for aria-labelledby fallback\n  const triggerContext = useContext(DialogTriggerContext);\n\n  // createDialog returns dialogProps AND titleProps (with the id for the Heading)\n  const { dialogProps, titleProps } = createDialog(\n    {\n      get role() {\n        return ariaProps.role;\n      },\n      get \"aria-label\"() {\n        return ariaProps[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return ariaProps[\"aria-labelledby\"];\n      },\n      get \"aria-describedby\"() {\n        return ariaProps[\"aria-describedby\"];\n      },\n    },\n    () => dialogRef,\n  );\n\n  // Get titleId from titleProps - this links Dialog's aria-labelledby to Heading's id\n  const titleId = () => titleProps()?.id as string | undefined;\n\n  // Get close function from OverlayTriggerState context or onClose prop\n  const overlayState = useOverlayTriggerState();\n\n  const close = () => {\n    local.onClose?.();\n    if (overlayState) {\n      overlayState.close();\n      return;\n    }\n    triggerContext?.state.close();\n  };\n\n  createEffect(() => {\n    if (!dialogRef || ariaProps[\"aria-label\"] || ariaProps[\"aria-labelledby\"]) return;\n    const labelledBy = dialogRef.getAttribute(\"aria-labelledby\");\n    if (labelledBy && dialogRef.ownerDocument.getElementById(labelledBy)) return;\n\n    const trigger = triggerContext?.triggerRef();\n    if (trigger?.id) {\n      dialogRef.setAttribute(\"aria-labelledby\", trigger.id);\n    }\n  });\n\n  const renderValues = createMemo<DialogRenderProps>(() => ({\n    close,\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      get children() {\n        return props.children;\n      },\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-Dialog\",\n    },\n    renderValues,\n  );\n\n  const domProps = createMemo(() =>\n    filterDOMProps(rest as Record<string, unknown>, { global: true }),\n  );\n\n  return (\n    <DialogContext.Provider value={{ close, titleId: titleId() }}>\n      <section\n        {...dialogProps()}\n        {...domProps()}\n        ref={dialogRef}\n        class={renderProps.class()}\n        style={renderProps.style()}\n        slot={local.slot}\n      >\n        <ButtonContext.Provider\n          value={{ slots: { [DEFAULT_SLOT]: {}, close: { onPress: () => close() } } }}\n        >\n          {renderProps.renderChildren()}\n        </ButtonContext.Provider>\n      </section>\n    </DialogContext.Provider>\n  );\n}\n\nexport interface HeadingProps {\n  /** The children of the heading. */\n  children: JSX.Element;\n  /** The CSS className. */\n  class?: string;\n  /** The heading level (1-6). Defaults to 2. */\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n  /** The slot to render into. */\n  slot?: string;\n}\n\n/**\n * Heading element for dialog title.\n * When rendered inside a Dialog, automatically gets the titleProps.\n */\nexport function Heading(props: HeadingProps): JSX.Element {\n  const dialogContext = useContext(DialogContext);\n  const level = () => props.level ?? 2;\n  const id = () => dialogContext?.titleId;\n  let headingRef: HTMLHeadingElement | undefined;\n\n  createEffect(() => {\n    const el = headingRef;\n    if (!el) return;\n\n    const contextId = id();\n    if (contextId) {\n      el.id = contextId;\n      return;\n    }\n\n    if (!el.id) {\n      const dialog = el.closest('[role=\"dialog\"],[role=\"alertdialog\"]');\n      const labelledBy = dialog?.getAttribute(\"aria-labelledby\");\n      if (labelledBy && !el.ownerDocument.getElementById(labelledBy)) {\n        el.id = labelledBy;\n      }\n    }\n  });\n\n  return (\n    <Switch>\n      <Match when={level() === 1}>\n        <h1 ref={headingRef} id={id()} class={props.class}>\n          {props.children}\n        </h1>\n      </Match>\n      <Match when={level() === 2}>\n        <h2 ref={headingRef} id={id()} class={props.class}>\n          {props.children}\n        </h2>\n      </Match>\n      <Match when={level() === 3}>\n        <h3 ref={headingRef} id={id()} class={props.class}>\n          {props.children}\n        </h3>\n      </Match>\n      <Match when={level() === 4}>\n        <h4 ref={headingRef} id={id()} class={props.class}>\n          {props.children}\n        </h4>\n      </Match>\n      <Match when={level() === 5}>\n        <h5 ref={headingRef} id={id()} class={props.class}>\n          {props.children}\n        </h5>\n      </Match>\n      <Match when={level() === 6}>\n        <h6 ref={headingRef} id={id()} class={props.class}>\n          {props.children}\n        </h6>\n      </Match>\n    </Switch>\n  );\n}\n\n// Keep backward compatibility\nexport { Heading as DialogHeading };\n"],"mappings":"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"}
+{"version":3,"file":"Dialog.jsx","names":[],"sources":["../src/Dialog.tsx"],"sourcesContent":["/*\n * Copyright 2022 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-components/src/Dialog.tsx\n\n/**\n * Dialog component for solidaria-components\n *\n * A headless dialog component that combines ARIA hooks.\n * Port of react-aria-components Dialog.\n */\n\nimport {\n  createContext,\n  createEffect,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  useContext,\n  Switch,\n  Match,\n  createTrackedEffect,\n} from \"solid-js\";\nimport type { Context } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n  createDialog,\n  createOverlayTrigger,\n  focusSafely,\n  useIsHidden,\n  type AriaDialogProps,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n  createOverlayTriggerState,\n  type OverlayTriggerState,\n} from \"@proyecto-viviana/solid-stately\";\nimport { DialogTriggerContext, useOverlayTriggerState } from \"./contexts\";\nimport { OverlayContext } from \"./Popover\";\nimport { ButtonContext } from \"./Button\";\nimport { TextContext } from \"./Text\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n  DEFAULT_SLOT,\n  Provider,\n  type RenderChildren,\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  type SlotProps,\n  useRenderProps,\n  filterDOMProps,\n} from \"./utils\";\n\nexport interface DialogRenderProps {\n  /** Function to close the dialog */\n  close: () => void;\n}\n\nexport interface DialogProps extends Omit<AriaDialogProps, \"class\" | \"style\">, SlotProps {\n  /** The children of the component - can be JSX or render function. */\n  children?: RenderChildren<DialogRenderProps>;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<DialogRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<DialogRenderProps>;\n  /** Callback when dialog should close */\n  onClose?: () => void;\n}\n\nexport interface DialogTriggerProps {\n  /** The children - should include a trigger and modal/popover content. */\n  children: JSX.Element;\n  /** Whether the dialog is open (controlled). */\n  isOpen?: boolean;\n  /** Whether the dialog is open by default (uncontrolled). */\n  defaultOpen?: boolean;\n  /** Callback when open state changes. */\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\ninterface DialogContextValue {\n  close: () => void;\n  titleId?: string;\n}\n\nexport const DialogContext = createContext<DialogContextValue | null>(null);\n\nexport { DialogTriggerContext, useDialogTrigger } from \"./contexts\";\n\n/**\n * A DialogTrigger opens a dialog when a trigger element is pressed.\n * Children should include a trigger element (e.g. Button) and the dialog content.\n */\nexport function DialogTrigger(props: DialogTriggerProps): JSX.Element | null {\n  const [local] = splitProps(props, [\"isOpen\", \"defaultOpen\", \"onOpenChange\"]);\n\n  const state = createOverlayTriggerState({\n    get isOpen() {\n      return local.isOpen;\n    },\n    get defaultOpen() {\n      return local.defaultOpen;\n    },\n    onOpenChange: local.onOpenChange,\n  });\n\n  // A signal, so a consumer reading `triggerRef()` (e.g. the dialog's\n  // trigger-label fallback) re-reads once the trigger mounts.\n  const [triggerRef, setTriggerElement] = createSignal<HTMLElement | null>(null);\n  const triggerId = createUniqueId();\n\n  // Create overlay trigger props so registered trigger components can expose\n  // the same expanded/controls relationship as React Aria DialogTrigger.\n  const triggerAria = createOverlayTrigger({ type: \"dialog\" }, state, triggerRef);\n\n  const restoreFocusToTrigger = () => {\n    const trigger = triggerRef();\n    if (!trigger?.isConnected) return;\n\n    const win = trigger.ownerDocument.defaultView ?? window;\n    win.requestAnimationFrame(() => {\n      win.requestAnimationFrame(() => {\n        if (trigger.isConnected && !state.isOpen()) {\n          focusSafely(trigger);\n        }\n      });\n    });\n  };\n\n  const stateWithFocusRestore: OverlayTriggerState = {\n    isOpen: state.isOpen,\n    setOpen: (isOpen) => {\n      state.setOpen(isOpen);\n      if (!isOpen) {\n        restoreFocusToTrigger();\n      }\n    },\n    open: state.open,\n    close: () => {\n      state.close();\n      restoreFocusToTrigger();\n    },\n    toggle: () => {\n      const wasOpen = state.isOpen();\n      state.toggle();\n      if (wasOpen) {\n        restoreFocusToTrigger();\n      }\n    },\n    point: state.point,\n    setPoint: state.setPoint,\n  };\n\n  const setTriggerRef = (el: HTMLElement | null) => {\n    if (!el) return;\n    // First registrant wins. Replacing a not-yet-connected trigger lets a later\n    // CloseButton steal ownership during defaultOpen (both refs fire before\n    // either node is in the document), then close+toggle reopens the dialog.\n    if (!triggerRef()) {\n      setTriggerElement(el);\n    }\n  };\n\n  // Context value - memoized to avoid unnecessary re-renders\n  const contextValue = createMemo(() => ({\n    state: stateWithFocusRestore,\n    triggerRef,\n    setTriggerRef,\n    triggerId,\n    triggerProps: triggerAria.triggerProps,\n    overlayProps: triggerAria.overlayProps,\n  }));\n\n  // If within a collection (e.g. Tabs), render nothing. Matches RAC DialogTrigger\n  // (`useIsHidden()` early return) so a hidden collection pass does not leak a\n  // duplicate trigger. Not using createHideableComponent: that also wraps a ref.\n  const isHidden = useIsHidden();\n  if (isHidden()) {\n    return null;\n  }\n\n  // In SolidJS, we simply render children directly within the provider\n  return <DialogTriggerContext value={contextValue()}>{props.children}</DialogTriggerContext>;\n}\n\n/**\n * A dialog is an overlay shown above other content in an application.\n */\nexport function Dialog(props: DialogProps): JSX.Element {\n  const [local, ariaProps, rest] = splitProps(\n    props,\n    [\"class\", \"style\", \"slot\", \"onClose\"],\n    [\"role\", \"aria-label\", \"aria-labelledby\", \"aria-describedby\"],\n  );\n\n  let dialogRef: HTMLElement | undefined;\n  const setDialogRef = (element: HTMLElement) => {\n    dialogRef = element;\n  };\n\n  // Get trigger context for aria-labelledby fallback\n  const triggerContext = useContext(DialogTriggerContext);\n\n  // createDialog returns the props that wire the dialog to its title and, for\n  // alertdialogs, its description content.\n  const { dialogProps, titleProps, contentProps } = createDialog(\n    {\n      get role() {\n        return ariaProps.role;\n      },\n      get \"aria-label\"() {\n        return ariaProps[\"aria-label\"];\n      },\n      get \"aria-labelledby\"() {\n        return ariaProps[\"aria-labelledby\"];\n      },\n      get \"aria-describedby\"() {\n        return ariaProps[\"aria-describedby\"];\n      },\n    },\n    () => dialogRef,\n  );\n\n  // Get titleId from titleProps - this links Dialog's aria-labelledby to Heading's id\n  const titleId = () => titleProps()?.id as string | undefined;\n\n  // Get close function from OverlayTriggerState context or onClose prop\n  const overlayState = useOverlayTriggerState();\n  const overlayFocus = useContext(OverlayContext);\n\n  const close = () => {\n    local.onClose?.();\n    if (overlayState) {\n      overlayState.close();\n      return;\n    }\n    triggerContext?.state.close();\n  };\n\n  // Label the dialog by its trigger when no title slot resolved. Mirrors RAC\n  // `Dialog`: the trigger id arrives by context, so it is a fallback only and a\n  // rendered title still wins. `createDialog`'s slot id clears itself when no\n  // element takes it, which is what makes the fallback reachable.\n  const ariaLabelledBy = () => {\n    const p = dialogProps();\n    if (p[\"aria-labelledby\"]) {\n      return p[\"aria-labelledby\"] as string;\n    }\n    if (p[\"aria-label\"]) {\n      return undefined;\n    }\n    return triggerContext?.triggerRef()?.id ?? triggerContext?.triggerId;\n  };\n\n  // RAC useDialog → useOverlayFocusContain: a nested Dialog still contains\n  // focus when the parent Popover is not itself the dialog.\n  createTrackedEffect(() => {\n    overlayFocus?.setContain(true);\n  });\n\n  const renderValues = createMemo<DialogRenderProps>(() => ({\n    close,\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      get children() {\n        return props.children;\n      },\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-Dialog\",\n    },\n    renderValues,\n  );\n\n  const domProps = createMemo(() =>\n    filterDOMProps(rest as Record<string, unknown>, { global: true }),\n  );\n\n  return (\n    <DialogContext value={{ close, titleId: titleId() }}>\n      <section\n        {...triggerContext?.overlayProps}\n        {...dialogProps()}\n        {...domProps()}\n        aria-labelledby={ariaLabelledBy()}\n        ref={setDialogRef}\n        class={renderProps.class()}\n        style={renderProps.style()}\n        slot={local.slot}\n      >\n        <Provider\n          values={\n            [\n              [\n                TextContext,\n                {\n                  slots: {\n                    [DEFAULT_SLOT]: {},\n                    get description() {\n                      return contentProps();\n                    },\n                  },\n                },\n              ],\n              [ButtonContext, { slots: { [DEFAULT_SLOT]: {}, close: { onPress: () => close() } } }],\n            ] as Array<[Context<unknown>, unknown]>\n          }\n        >\n          {renderProps.renderChildren()}\n        </Provider>\n      </section>\n    </DialogContext>\n  );\n}\n\nexport interface HeadingProps {\n  /** The children of the heading. */\n  children: JSX.Element;\n  /** The CSS className. */\n  class?: string;\n  /** The heading level (1-6). Defaults to 2. */\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n  /** The slot to render into. */\n  slot?: string;\n}\n\n/**\n * Heading element for dialog title.\n * When rendered inside a Dialog, automatically gets the titleProps.\n */\nexport function Heading(props: HeadingProps): JSX.Element {\n  const dialogContext = useContext(DialogContext);\n  const level = () => props.level ?? 2;\n  const id = () => dialogContext?.titleId;\n  let headingRef: HTMLHeadingElement | undefined;\n  const setHeadingRef = (element: HTMLHeadingElement) => {\n    headingRef = element;\n  };\n\n  createTrackedEffect(() => {\n    const el = headingRef;\n    if (!el) return;\n\n    const contextId = id();\n    if (contextId) {\n      el.id = contextId;\n      return;\n    }\n\n    if (!el.id) {\n      const dialog = el.closest('[role=\"dialog\"],[role=\"alertdialog\"]');\n      const labelledBy = dialog?.getAttribute(\"aria-labelledby\");\n      if (labelledBy && !el.ownerDocument.getElementById(labelledBy)) {\n        el.id = labelledBy;\n      }\n    }\n  });\n\n  return (\n    <Switch>\n      <Match when={level() === 1}>\n        <h1 ref={setHeadingRef} id={id()} class={props.class}>\n          {props.children}\n        </h1>\n      </Match>\n      <Match when={level() === 2}>\n        <h2 ref={setHeadingRef} id={id()} class={props.class}>\n          {props.children}\n        </h2>\n      </Match>\n      <Match when={level() === 3}>\n        <h3 ref={setHeadingRef} id={id()} class={props.class}>\n          {props.children}\n        </h3>\n      </Match>\n      <Match when={level() === 4}>\n        <h4 ref={setHeadingRef} id={id()} class={props.class}>\n          {props.children}\n        </h4>\n      </Match>\n      <Match when={level() === 5}>\n        <h5 ref={setHeadingRef} id={id()} class={props.class}>\n          {props.children}\n        </h5>\n      </Match>\n      <Match when={level() === 6}>\n        <h6 ref={setHeadingRef} id={id()} class={props.class}>\n          {props.children}\n        </h6>\n      </Match>\n    </Switch>\n  );\n}\n\n// Keep backward compatibility\nexport { Heading as DialogHeading };\n"],"mappings":"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"}

package/dist/Disclosure.d.ts

@@ -1,12 +1,4 @@
-/**
- * Disclosure and Accordion components for solidaria-components
- *
- * Disclosure is a widget that can be toggled to show or hide content.
- * Accordion (DisclosureGroup) manages multiple disclosures with optional single-expand.
- *
- * Port of react-aria-components Disclosure.
- */
-import { type JSX } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import { type DisclosureState, type DisclosureGroupState, type DisclosureStateProps, type DisclosureGroupStateProps } from "@proyecto-viviana/solid-stately";
 import { type RenderChildren, type ClassNameOrFunction, type StyleOrFunction } from "./utils";
 type RefLike<T> = T | ((el: T) => void) | {

package/dist/Disclosure.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Disclosure.d.ts","sourceRoot":"","sources":["../src/Disclosure.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Disclosure.d.ts","sourceRoot":"","sources":["../src/Disclosure.tsx"],"names":[],"mappings":"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"}

package/dist/Disclosure.js

@@ -1,7 +1,20 @@
-import { dataAttr, filterDOMProps, useRenderProps } from "./utils.js";
-import { createComponent, getNextElement, insert, mergeProps, runHydrationEvents, spread, template, use } from "solid-js/web";
-import { createContext, createMemo, createSignal, splitProps, useContext } from "solid-js";
-import { createDisclosure, createDisclosureGroup, createFocusRing, mergeProps as mergeProps$2 } from "@proyecto-viviana/solidaria";
+/*
+* Copyright 2024 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-components/src/Disclosure.tsx
+import { coerceDomRecord, dataAttr, filterDOMProps, useRenderProps } from "./utils.js";
+import { createComponent, getNextElement, insert, ref, runHydrationEvents, scope, spread, template } from "@solidjs/web";
+import { createContext, createMemo, createSignal, useContext } from "solid-js";
+import { createDisclosure, createDisclosureGroup, createFocusRing, mergeProps as mergeProps$1 } from "@proyecto-viviana/solidaria";
+import { splitProps } from "@proyecto-viviana/solidaria/utils";
 import { createDisclosureGroupState, createDisclosureState } from "@proyecto-viviana/solid-stately";
 //#region src/Disclosure.tsx
 /**
@@ -12,8 +25,9 @@ import { createDisclosureGroupState, createDisclosureState } from "@proyecto-viv
 *
 * Port of react-aria-components Disclosure.
 */
-var _tmpl$ = /*#__PURE__*/ template(`<div>`), _tmpl$2 = /*#__PURE__*/ template(`<button>`);
-function assignRef(ref, el) {
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+var _tmpl$2 = /* @__PURE__ */ template(`<button>`);
+function assignRef$1(ref, el) {
 	if (!ref) return;
 	if (typeof ref === "function") ref(el);
 	else if (typeof ref === "object" && "current" in ref) ref.current = el;
@@ -74,26 +88,34 @@ function DisclosureGroup(props) {
 	const domProps = createMemo(() => filterDOMProps(rest, { global: true }));
 	const contextValue = { state };
 	const { ref: _ref, ...cleanGroupProps } = groupProps;
-	return createComponent(DisclosureGroupStateContext.Provider, {
+	return createComponent(DisclosureGroupStateContext, {
 		value: state,
 		get children() {
-			return createComponent(DisclosureGroupContext.Provider, {
+			return createComponent(DisclosureGroupContext, {
 				value: contextValue,
 				get children() {
 					var _el$ = getNextElement(_tmpl$);
-					use((el) => assignRef(local.ref, el), _el$);
-					spread(_el$, mergeProps(domProps, cleanGroupProps, {
-						get ["class"]() {
-							return renderProps.class();
-						},
-						get style() {
-							return renderProps.style();
-						},
-						get ["data-disabled"]() {
-							return dataAttr(state.isDisabled);
+					ref(() => {
+						return (el) => assignRef$1(local.ref, el);
+					}, _el$);
+					spread(_el$, [
+						domProps,
+						cleanGroupProps,
+						{
+							get "class"() {
+								return renderProps.class();
+							},
+							get style() {
+								return renderProps.style();
+							},
+							get "data-disabled"() {
+								return dataAttr(state.isDisabled);
+							}
 						}
-					}), false, true);
-					insert(_el$, () => props.children);
+					], true);
+					insert(_el$, scope(() => {
+						return props.children;
+					}));
 					runHydrationEvents();
 					return _el$;
 				}
@@ -163,35 +185,41 @@ function Disclosure(props) {
 	const setPanelRef = (el) => {
 		setPanelRefSignal(el);
 	};
-	return createComponent(DisclosureStateContext.Provider, {
+	return createComponent(DisclosureStateContext, {
 		value: state,
 		get children() {
-			return createComponent(DisclosureContext.Provider, {
+			return createComponent(DisclosureContext, {
 				value: contextValue,
 				get children() {
-					return createComponent(DisclosurePanelRefContext.Provider, {
+					return createComponent(DisclosurePanelRefContext, {
 						value: setPanelRef,
 						get children() {
 							var _el$2 = getNextElement(_tmpl$);
-							use((el) => assignRef(local.ref, el), _el$2);
-							spread(_el$2, mergeProps(() => mergeProps$2(domProps(), focusWithinProps), {
-								get ["class"]() {
+							ref(() => {
+								return (el) => assignRef$1(local.ref, el);
+							}, _el$2);
+							spread(_el$2, [() => {
+								return mergeProps$1(domProps(), focusWithinProps);
+							}, {
+								get "class"() {
 									return renderProps.class();
 								},
 								get style() {
 									return renderProps.style();
 								},
-								get ["data-expanded"]() {
+								get "data-expanded"() {
 									return dataAttr(state.isExpanded());
 								},
-								get ["data-disabled"]() {
+								get "data-disabled"() {
 									return dataAttr(isDisabled());
 								},
-								get ["data-focus-visible-within"]() {
+								get "data-focus-visible-within"() {
 									return dataAttr(isFocusVisibleWithin());
 								}
-							}), false, true);
-							insert(_el$2, () => props.children);
+							}], true);
+							insert(_el$2, scope(() => {
+								return props.children;
+							}));
 							runHydrationEvents();
 							return _el$2;
 						}
@@ -227,40 +255,44 @@ function DisclosureTrigger(props) {
 		const { ref: _ref, ...rest } = focusProps;
 		return rest;
 	};
-	return (() => {
-		var _el$3 = getNextElement(_tmpl$2);
-		use((el) => assignRef(local.ref, el), _el$3);
-		spread(_el$3, mergeProps(() => mergeProps$2(domProps(), getButtonProps(), cleanFocusProps()), {
-			"type": "button",
-			get tabindex() {
-				return isDisabled() ? void 0 : 0;
-			},
-			get ["class"]() {
-				return local.class;
-			},
-			get style() {
-				return local.style;
-			},
-			get ["data-expanded"]() {
-				return dataAttr(isExpanded());
-			},
-			get ["data-disabled"]() {
-				return dataAttr(isDisabled());
-			},
-			get ["data-pressed"]() {
-				return dataAttr(disclosureAria.isPressed());
-			},
-			get ["data-focused"]() {
-				return dataAttr(isFocused());
-			},
-			get ["data-focus-visible"]() {
-				return dataAttr(isFocusVisible());
-			}
-		}), false, true);
-		insert(_el$3, () => local.children);
-		runHydrationEvents();
-		return _el$3;
-	})();
+	var _el$3 = getNextElement(_tmpl$2);
+	ref(() => {
+		return (el) => assignRef$1(local.ref, el);
+	}, _el$3);
+	spread(_el$3, [() => {
+		return mergeProps$1(domProps(), getButtonProps(), cleanFocusProps());
+	}, {
+		type: "button",
+		get tabindex() {
+			return isDisabled() ? void 0 : 0;
+		},
+		get "class"() {
+			return local.class;
+		},
+		get style() {
+			return local.style;
+		},
+		get "data-expanded"() {
+			return dataAttr(isExpanded());
+		},
+		get "data-disabled"() {
+			return dataAttr(isDisabled());
+		},
+		get "data-pressed"() {
+			return dataAttr(disclosureAria.isPressed());
+		},
+		get "data-focused"() {
+			return dataAttr(isFocused());
+		},
+		get "data-focus-visible"() {
+			return dataAttr(isFocusVisible());
+		}
+	}], true);
+	insert(_el$3, scope(() => {
+		return local.children;
+	}));
+	runHydrationEvents();
+	return _el$3;
 }
 /**
 * DisclosurePanel contains the content that is shown/hidden.
@@ -297,33 +329,43 @@ function DisclosurePanel(props) {
 		const { ref: _ref, ...rest } = context.disclosureAria.panelProps;
 		return rest;
 	};
-	return (() => {
-		var _el$4 = getNextElement(_tmpl$);
-		use((el) => {
+	var _el$4 = getNextElement(_tmpl$);
+	ref(() => {
+		return (el) => {
 			panelRefSetter?.(el);
-			assignRef(local.ref, el);
-		}, _el$4);
-		spread(_el$4, mergeProps(() => mergeProps$2(domProps(), focusWithinProps), getPanelProps, {
+			assignRef$1(local.ref, el);
+		};
+	}, _el$4);
+	spread(_el$4, [
+		() => {
+			return mergeProps$1(domProps(), focusWithinProps);
+		},
+		() => {
+			return coerceDomRecord(getPanelProps());
+		},
+		{
 			get role() {
 				return local.role ?? "group";
 			},
-			get ["class"]() {
+			get "class"() {
 				return renderProps.class();
 			},
 			get style() {
 				return renderProps.style();
 			},
-			get ["data-expanded"]() {
+			get "data-expanded"() {
 				return dataAttr(isExpanded());
 			},
-			get ["data-focus-visible-within"]() {
+			get "data-focus-visible-within"() {
 				return dataAttr(isFocusVisibleWithin());
 			}
-		}), false, true);
-		insert(_el$4, () => renderProps.renderChildren());
-		runHydrationEvents();
-		return _el$4;
-	})();
+		}
+	], true);
+	insert(_el$4, scope(() => {
+		return renderProps.renderChildren();
+	}));
+	runHydrationEvents();
+	return _el$4;
 }
 //#endregion
 export { Disclosure, DisclosureContext, DisclosureGroup, DisclosureGroupContext, DisclosureGroupStateContext, DisclosurePanel, DisclosureStateContext, DisclosureTrigger, useDisclosureContext, useDisclosureGroupContext };