@proyecto-viviana/solidaria-components 0.3.1 → 0.4.0

package/dist/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.js","names":["JSX","Accessor","createContext","createMemo","createEffect","createSignal","onCleanup","splitProps","Show","useContext","Portal","ToastState","QueuedToast","ToastQueueOptions","ToastOptions","ToastQueue","createToastState","createToast","createToastRegion","useUNSAFE_PortalContext","RenderChildren","ClassNameOrFunction","StyleOrFunction","useRenderProps","filterDOMProps","useIsHydrated","ToastContent","id","dataAttribute","children","title","description","variant","type","actionLabel","onAction","shouldCloseOnAction","action","label","ToastRenderProps","isEntering","isExiting","animation","toast","ToastRegionRenderProps","visibleToasts","ToastRegionProps","class","style","state","portal","placement","ToastProps","ToastContext","ToastAriaContextValue","titleProps","HTMLAttributes","HTMLElement","descriptionProps","contentProps","ToastAriaContext","toastStateByKey","Map","useToastContext","context","Error","globalToastQueue","maxVisibleToasts","Infinity","hasExitAnimation","addToast","content","options","add","normalizeToastPlacement","replace","NonNullable","ToastProviderProps","Element","queueOptions","useGlobalQueue","ToastProvider","props","queue","_$createComponent","Provider","value","ToastRegion","isHydrated","local","rest","portalContext","portalContainer","getContainer","undefined","regionElement","setRegionElement","contextState","regionAria","close","key","remove","clear","pauseAll","resumeAll","ref","aria-label","renderValues","renderProps","defaultClassName","domProps","Record","global","placementStyles","CSSProperties","edge","align","split","base","position","display","gap","padding","top","right","left","transform","bottom","normalizedPlacement","hasToasts","length","hasAuthoredRegionStyle","regionContent","mergedStyle","custom","_ref","cleanRegionProps","regionProps","_el$","_$getNextElement","_tmpl$","_$use","_$spread","_$mergeProps","data-placement","_$insert","renderChildren","_$runHydrationEvents","when","_$memo","fallback","mount","Toast","toastRef","HTMLDivElement","set","get","delete","hasTitle","toastAria","hasDescription","const","handleRootClick","event","MouseEvent","target","closest","animations","getAnimations","canceled","Promise","all","map","a","finished","then","catch","cleanToastProps","toastProps","titleId","descriptionId","titleEl","querySelector","descriptionEl","contentEl","role","ariaLive","ariaAtomic","setAttribute","_el$2","_ref$","data-animation","data-type","data-variant","ToastTitleProps","ToastTitle","ariaTitleProps","_el$3","_tmpl$2","ToastDescriptionProps","ToastDescription","ariaDescriptionProps","_el$4","_tmpl$3","ToastContentProps","ariaContentProps","_el$5","_tmpl$4","ToastCloseButtonProps","ToastCloseButton","handleClose","_el$6","_tmpl$5","$$click","_$addEventListener","_$effect","_p$","_v$","_v$2","_v$3","e","_$className","t","_$style","_$setAttribute","DefaultToastProps","DefaultToast","actionHandler","handleAction","_el$7","_tmpl$7","_el$9","firstChild","_el$0","_co$","_$getNextMarker","nextSibling","_el$1","_el$10","_co$2","flex","_el$8","_tmpl$6","_$delegateEvents"],"sources":["../src/Toast.tsx"],"sourcesContent":["/**\n * Toast components for solidaria-components\n *\n * Toast notifications with auto-dismiss, pause on hover/focus, and accessibility.\n * Port of react-aria-components Toast.\n */\n\nimport {\n  type JSX,\n  type Accessor,\n  createContext,\n  createMemo,\n  createEffect,\n  createSignal,\n  onCleanup,\n  splitProps,\n  Show,\n  useContext,\n} from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport {\n  type ToastState,\n  type QueuedToast,\n  type ToastQueueOptions,\n  type ToastOptions,\n  ToastQueue,\n  createToastState,\n} from \"@proyecto-viviana/solid-stately\";\nimport {\n  createToast,\n  createToastRegion,\n  useUNSAFE_PortalContext,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n  type RenderChildren,\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  useRenderProps,\n  filterDOMProps,\n  useIsHydrated,\n} from \"./utils\";\n\nexport interface ToastContent {\n  /** DOM id for the toast root when content is queued through Spectrum ToastQueue. */\n  id?: string;\n  /** Data attributes for the toast root when content is queued through Spectrum ToastQueue. */\n  [dataAttribute: `data-${string}`]: string | number | boolean | undefined;\n  /** Spectrum Toast message content. */\n  children?: string;\n  /** The title of the toast. */\n  title?: string;\n  /** The description/body of the toast. */\n  description?: string;\n  /** Spectrum variant. */\n  variant?: \"info\" | \"positive\" | \"negative\" | \"neutral\";\n  /** Backward-compatible type/variant of the toast. */\n  type?: \"info\" | \"success\" | \"warning\" | \"error\" | \"positive\" | \"negative\" | \"neutral\";\n  /** Spectrum action button label. */\n  actionLabel?: string;\n  /** Handler called when the Spectrum action button is pressed. */\n  onAction?: () => void;\n  /** Whether the toast should close when the Spectrum action is performed. */\n  shouldCloseOnAction?: boolean;\n  /** Custom action button. */\n  action?: {\n    label: string;\n    onAction: () => void;\n  };\n}\n\nexport interface ToastRenderProps {\n  /** Whether the toast is currently animating in. */\n  isEntering: boolean;\n  /** Whether the toast is currently animating out. */\n  isExiting: boolean;\n  /** The animation state (entering, exiting, queued). */\n  animation: \"entering\" | \"exiting\" | \"queued\" | undefined;\n  /** The toast data. */\n  toast: QueuedToast<ToastContent>;\n}\n\nexport interface ToastRegionRenderProps {\n  /** The visible toasts. */\n  visibleToasts: Accessor<QueuedToast<ToastContent>[]>;\n}\n\nexport interface ToastRegionProps {\n  /** The children of the component - can be JSX or render function. */\n  children?: RenderChildren<ToastRegionRenderProps>;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<ToastRegionRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<ToastRegionRenderProps>;\n  /** The toast state to display. If not provided, uses ToastContext. */\n  state?: ToastState<ToastContent>;\n  /** Accessible label for the region. */\n  \"aria-label\"?: string;\n  /** Whether to render in a portal. */\n  portal?: boolean;\n  /** Placement of the toast region. */\n  placement?:\n    | \"top\"\n    | \"top start\"\n    | \"top end\"\n    | \"top-start\"\n    | \"top-end\"\n    | \"bottom\"\n    | \"bottom start\"\n    | \"bottom end\"\n    | \"bottom-start\"\n    | \"bottom-end\";\n}\n\nexport interface ToastProps {\n  /** DOM id for the toast root. */\n  id?: string;\n  /** Data attributes for the toast root. */\n  [dataAttribute: `data-${string}`]: string | number | boolean | undefined;\n  /** The toast data. */\n  toast: QueuedToast<ToastContent>;\n  /** The children of the component - can be JSX or render function. */\n  children?: RenderChildren<ToastRenderProps>;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<ToastRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<ToastRenderProps>;\n}\n\nexport const ToastContext = createContext<ToastState<ToastContent> | null>(null);\n\ninterface ToastAriaContextValue {\n  titleProps: JSX.HTMLAttributes<HTMLElement>;\n  descriptionProps: JSX.HTMLAttributes<HTMLElement>;\n  contentProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nconst ToastAriaContext = createContext<ToastAriaContextValue | null>(null);\nconst toastStateByKey = new Map<string, ToastState<ToastContent>>();\n\nexport function useToastContext(): ToastState<ToastContent> {\n  const context = useContext(ToastContext);\n  if (!context) {\n    throw new Error(\"Toast components must be used within a ToastProvider\");\n  }\n  return context;\n}\n\n/** Default global toast queue that can be used for app-wide toasts. */\nexport const globalToastQueue = new ToastQueue<ToastContent>({\n  maxVisibleToasts: Infinity,\n  hasExitAnimation: true,\n});\n\n/**\n * Add a toast to the global queue.\n * Convenience function for adding toasts from anywhere in the app.\n */\nexport function addToast(content: ToastContent, options?: ToastOptions): string {\n  return globalToastQueue.add(content, options);\n}\n\nfunction normalizeToastPlacement(placement?: ToastRegionProps[\"placement\"]) {\n  return (placement ?? \"bottom\").replace(\"-\", \" \") as NonNullable<ToastRegionProps[\"placement\"]>;\n}\n\nexport interface ToastProviderProps {\n  /** The children of the provider. */\n  children: JSX.Element;\n  /** Custom toast queue options. */\n  queueOptions?: ToastQueueOptions;\n  /** Use global queue instead of creating a new one. */\n  useGlobalQueue?: boolean;\n}\n\n/**\n * ToastProvider creates a toast queue context for descendant components.\n * Use this to wrap your app or a section that needs toast notifications.\n *\n * @example\n * ```tsx\n * <ToastProvider>\n *   <App />\n *   <ToastRegion />\n * </ToastProvider>\n * ```\n */\nexport function ToastProvider(props: ToastProviderProps): JSX.Element {\n  const queue = props.useGlobalQueue\n    ? globalToastQueue\n    : new ToastQueue<ToastContent>(props.queueOptions);\n\n  const state = createToastState({ queue });\n\n  return <ToastContext.Provider value={state}>{props.children}</ToastContext.Provider>;\n}\n\n/**\n * ToastRegion is a container that displays all visible toasts.\n * It handles pause on hover/focus and provides the landmark region.\n *\n * @example\n * ```tsx\n * <ToastRegion placement=\"bottom-end\">\n *   {(renderProps) => (\n *     <For each={renderProps.visibleToasts}>\n *       {(toast) => <Toast toast={toast} />}\n *     </For>\n *   )}\n * </ToastRegion>\n * ```\n */\nexport function ToastRegion(props: ToastRegionProps): JSX.Element {\n  // Do NOT early-return on the server: returning null on the server and a <Show>\n  // on the client desyncs hydration when the region is in the SSR tree. Render the\n  // same structure on both and gate the Portal on useIsHydrated() (see Popover).\n  const isHydrated = useIsHydrated();\n\n  const [local, rest] = splitProps(props, [\n    \"children\",\n    \"class\",\n    \"style\",\n    \"state\",\n    \"aria-label\",\n    \"portal\",\n    \"placement\",\n  ]);\n  const portalContext = useUNSAFE_PortalContext();\n  const portalContainer = () => portalContext.getContainer?.() ?? undefined;\n  const [regionElement, setRegionElement] = createSignal<HTMLElement>();\n\n  const contextState = useContext(ToastContext);\n  const state = () => local.state ?? contextState;\n\n  const regionAria = createToastRegion<ToastContent>({\n    state: {\n      visibleToasts: () => state()?.visibleToasts() ?? [],\n      add: (content, options) => state()?.add(content, options) ?? \"\",\n      close: (key) => state()?.close(key),\n      remove: (key) => state()?.remove(key),\n      clear: () => state()?.clear(),\n      pauseAll: () => state()?.pauseAll(),\n      resumeAll: () => state()?.resumeAll(),\n    },\n    ref: regionElement,\n    get \"aria-label\"() {\n      return local[\"aria-label\"];\n    },\n  });\n\n  const renderValues = createMemo<ToastRegionRenderProps>(() => ({\n    visibleToasts: () => state()?.visibleToasts() ?? [],\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      // Lazy: the region content is gated behind `<Show when={isHydrated() && …}>`\n      // (Portal) below, so reading children must not instantiate templates during\n      // the component body (would walk getNextElement before the gate the server\n      // kept closed → hydration mismatch). See Popover for the full rationale.\n      get children() {\n        return props.children;\n      },\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-ToastRegion\",\n    },\n    renderValues,\n  );\n  const domProps = createMemo(() =>\n    filterDOMProps(rest as Record<string, unknown>, { global: true }),\n  );\n\n  const placementStyles = createMemo<JSX.CSSProperties>(() => {\n    const placement = normalizeToastPlacement(local.placement);\n    const [edge, align = \"center\"] = placement.split(\" \");\n    const base: JSX.CSSProperties = {\n      position: \"fixed\",\n      \"z-index\": 100001,\n      display: \"flex\",\n      \"flex-direction\": edge === \"top\" ? \"column\" : \"column-reverse\",\n      gap: \"8px\",\n      padding: \"16px\",\n      \"pointer-events\": \"none\",\n    };\n\n    if (edge === \"top\") {\n      if (align === \"end\") {\n        return { ...base, top: \"16px\", right: \"16px\" } as JSX.CSSProperties;\n      }\n      if (align === \"start\") {\n        return { ...base, top: \"16px\", left: \"16px\" } as JSX.CSSProperties;\n      }\n      return {\n        ...base,\n        top: \"16px\",\n        left: \"50%\",\n        transform: \"translateX(-50%)\",\n      } as JSX.CSSProperties;\n    }\n\n    if (align === \"end\") {\n      return { ...base, bottom: \"16px\", right: \"16px\" } as JSX.CSSProperties;\n    }\n    if (align === \"start\") {\n      return { ...base, bottom: \"16px\", left: \"16px\" } as JSX.CSSProperties;\n    }\n    return {\n      ...base,\n      bottom: \"16px\",\n      left: \"50%\",\n      transform: \"translateX(-50%)\",\n    } as JSX.CSSProperties;\n  });\n\n  const normalizedPlacement = () => normalizeToastPlacement(local.placement);\n\n  const visibleToasts = () => state()?.visibleToasts() ?? [];\n  const hasToasts = () => visibleToasts().length > 0;\n  const hasAuthoredRegionStyle = () => local.class != null || local.style != null;\n\n  const regionContent = () => {\n    if (!state()) return null;\n\n    const mergedStyle = () => {\n      const custom = renderProps.style();\n      // React Aria Components leaves ToastRegion unstyled. Keep this package's\n      // fallback placement only for bare regions so styled layers such as S2 can\n      // own fixed viewport geometry with their generated classes.\n      if (hasAuthoredRegionStyle()) return custom;\n\n      const placement = placementStyles();\n      if (!custom) return placement;\n      return { ...placement, ...custom } as JSX.CSSProperties;\n    };\n\n    const { ref: _ref, ...cleanRegionProps } = regionAria.regionProps as Record<string, unknown>;\n\n    return (\n      <div\n        ref={setRegionElement}\n        {...domProps()}\n        {...cleanRegionProps}\n        class={renderProps.class()}\n        style={mergedStyle()}\n        data-placement={normalizedPlacement()}\n      >\n        {renderProps.renderChildren()}\n      </div>\n    );\n  };\n\n  return (\n    <Show when={isHydrated() && hasToasts()}>\n      <Show when={local.portal !== false} fallback={regionContent()}>\n        <Portal mount={portalContainer()}>{regionContent()}</Portal>\n      </Show>\n    </Show>\n  );\n}\n\n/**\n * Toast is an individual notification component.\n *\n * @example\n * ```tsx\n * <Toast toast={toast}>\n *   {(renderProps) => (\n *     <div class={renderProps.isExiting ? 'fade-out' : 'fade-in'}>\n *       <h3>{renderProps.toast.content.title}</h3>\n *       <p>{renderProps.toast.content.description}</p>\n *     </div>\n *   )}\n * </Toast>\n * ```\n */\nexport function Toast(props: ToastProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"toast\", \"children\", \"class\", \"style\"]);\n\n  let toastRef!: HTMLDivElement;\n\n  const state = useToastContext();\n\n  createEffect(() => {\n    const key = local.toast.key;\n    toastStateByKey.set(key, state);\n    onCleanup(() => {\n      if (toastStateByKey.get(key) === state) {\n        toastStateByKey.delete(key);\n      }\n    });\n  });\n\n  const hasTitle = () => !!(local.toast.content.children ?? local.toast.content.title);\n  const toastAria = createToast({\n    toast: local.toast,\n    state,\n    hasTitle: hasTitle(),\n    hasDescription: !!local.toast.content.description,\n  });\n\n  const renderValues = createMemo<ToastRenderProps>(() => ({\n    isEntering: local.toast.animation === \"entering\",\n    isExiting: local.toast.animation === \"exiting\",\n    animation: local.toast.animation,\n    toast: local.toast,\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-Toast\",\n    },\n    renderValues,\n  );\n\n  const domProps = createMemo(() =>\n    filterDOMProps(rest as Record<string, unknown>, { global: true }),\n  );\n\n  const mergedStyle = () => {\n    const custom = renderProps.style();\n    if (!custom) return { \"pointer-events\": \"auto\" as const };\n    return { \"pointer-events\": \"auto\" as const, ...custom } as JSX.CSSProperties;\n  };\n\n  const handleRootClick = (event: MouseEvent) => {\n    const target = event.target;\n    if (!(target instanceof Element)) return;\n    if (target.closest(\"[data-solidaria-toast-close-button]\")) {\n      state.close(local.toast.key);\n      state.remove(local.toast.key);\n    }\n  };\n\n  // Exit animation lifecycle:\n  // When animation becomes 'exiting', wait for CSS animations/transitions to finish,\n  // then call state.remove() to finalize removal from the queue.\n  // In JSDOM or when no animations are running, remove immediately.\n  // Reduced-motion is handled by CSS (shorter/no animations), so the lifecycle\n  // naturally completes faster when the user prefers reduced motion.\n  createEffect(() => {\n    if (local.toast.animation !== \"exiting\") return;\n    if (!toastRef) {\n      state.remove(local.toast.key);\n      return;\n    }\n\n    // Check if the element supports the Web Animations API\n    if (!(\"getAnimations\" in toastRef)) {\n      state.remove(local.toast.key);\n      return;\n    }\n\n    const animations = toastRef.getAnimations();\n    if (animations.length === 0) {\n      // No CSS animations/transitions running - remove immediately\n      state.remove(local.toast.key);\n      return;\n    }\n\n    // Wait for all running animations to finish, then remove\n    let canceled = false;\n    Promise.all(animations.map((a) => a.finished))\n      .then(() => {\n        if (!canceled) {\n          state.remove(local.toast.key);\n        }\n      })\n      .catch(() => {\n        // Animation was canceled (e.g. element removed) - still clean up\n        if (!canceled) {\n          state.remove(local.toast.key);\n        }\n      });\n\n    onCleanup(() => {\n      canceled = true;\n    });\n  });\n\n  const { ref: _ref, ...cleanToastProps } = toastAria.toastProps as Record<string, unknown>;\n\n  // Ensure ARIA title/description IDs and the content live-region attributes are\n  // present on rendered sub-components, even when children are pre-composed outside\n  // the Toast provider owner (as DefaultToast does), where useContext can't reach\n  // this owner's ToastAriaContext.\n  createEffect(() => {\n    if (!toastRef) return;\n\n    const titleId = (toastAria.titleProps as Record<string, unknown>).id as string | undefined;\n    const descriptionId = (toastAria.descriptionProps as Record<string, unknown>).id as\n      | string\n      | undefined;\n    const contentProps = toastAria.contentProps as Record<string, unknown>;\n\n    if (titleId) {\n      const titleEl = toastRef.querySelector(\"[data-solidaria-toast-title]\");\n      if (titleEl instanceof HTMLElement) {\n        titleEl.id = titleId;\n      }\n    }\n\n    if (descriptionId) {\n      const descriptionEl = toastRef.querySelector(\"[data-solidaria-toast-description]\");\n      if (descriptionEl instanceof HTMLElement) {\n        descriptionEl.id = descriptionId;\n      }\n    }\n\n    // Wire the content area as a live region (role=\"alert\" / aria-live=\"assertive\")\n    // so the toast message is announced to screen readers when it appears.\n    const contentEl = toastRef.querySelector(\"[data-solidaria-toast-content]\");\n    if (contentEl instanceof HTMLElement) {\n      const role = contentProps.role as string | undefined;\n      const ariaLive = contentProps[\"aria-live\"] as string | undefined;\n      const ariaAtomic = contentProps[\"aria-atomic\"] as string | undefined;\n      if (role) contentEl.setAttribute(\"role\", role);\n      if (ariaLive) contentEl.setAttribute(\"aria-live\", ariaLive);\n      if (ariaAtomic) contentEl.setAttribute(\"aria-atomic\", ariaAtomic);\n    }\n  });\n\n  return (\n    <ToastAriaContext.Provider\n      value={{\n        titleProps: toastAria.titleProps,\n        descriptionProps: toastAria.descriptionProps,\n        contentProps: toastAria.contentProps,\n      }}\n    >\n      <div\n        ref={toastRef}\n        {...domProps()}\n        {...cleanToastProps}\n        class={renderProps.class()}\n        style={mergedStyle()}\n        data-animation={local.toast.animation}\n        data-type={local.toast.content.type ?? local.toast.content.variant}\n        data-variant={local.toast.content.variant}\n        on:click={handleRootClick}\n      >\n        {renderProps.renderChildren()}\n      </div>\n    </ToastAriaContext.Provider>\n  );\n}\n\nexport interface ToastTitleProps {\n  children: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n}\n\n/**\n * ToastTitle renders the toast title with proper accessibility attributes.\n */\nexport function ToastTitle(props: ToastTitleProps): JSX.Element {\n  const context = useContext(ToastAriaContext);\n  const { ref: _ref, ...ariaTitleProps } = (context?.titleProps ?? {}) as Record<string, unknown>;\n\n  // Upstream S2 Toast renders the title via `<Text slot=\"title\">`, and RAC `Text`\n  // defaults to `elementType=\"span\"` — so the title's text-node container is a\n  // `<span>`, not a `<div>`. Mirror that (the D7 contrast descriptor keys on the\n  // container tag name; a `<div>` here diverged on every variant × theme). (parity rule #1/#2)\n  return (\n    <span data-solidaria-toast-title=\"\" {...ariaTitleProps} class={props.class} style={props.style}>\n      {props.children}\n    </span>\n  );\n}\n\nexport interface ToastDescriptionProps {\n  children: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n}\n\n/**\n * ToastDescription renders the toast description with proper accessibility attributes.\n */\nexport function ToastDescription(props: ToastDescriptionProps): JSX.Element {\n  const context = useContext(ToastAriaContext);\n  const { ref: _ref, ...ariaDescriptionProps } = (context?.descriptionProps ?? {}) as Record<\n    string,\n    unknown\n  >;\n\n  // Match the title: upstream toast text is rendered in `<span>` elements (RAC\n  // `Text`). The port additionally supports a description (upstream S2 has only a\n  // title); keep it as a `<span>` sibling so its text-node container tag is faithful.\n  return (\n    <span\n      data-solidaria-toast-description=\"\"\n      {...ariaDescriptionProps}\n      class={props.class}\n      style={props.style}\n    >\n      {props.children}\n    </span>\n  );\n}\n\nexport interface ToastContentProps {\n  children: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n}\n\n/**\n * ToastContent wraps the toast message (title + description) in the live region\n * announced to screen readers. It carries `role=\"alert\"` / `aria-live=\"assertive\"`\n * from createToast's contentProps so the toast text is announced when it appears.\n *\n * It is rendered as a sibling of the close button (never wrapping it) so screen\n * readers announce the message without reading the close button first.\n */\nexport function ToastContent(props: ToastContentProps): JSX.Element {\n  const context = useContext(ToastAriaContext);\n  const { ref: _ref, ...ariaContentProps } = (context?.contentProps ?? {}) as Record<\n    string,\n    unknown\n  >;\n\n  return (\n    <div\n      data-solidaria-toast-content=\"\"\n      {...ariaContentProps}\n      class={props.class}\n      style={props.style}\n    >\n      {props.children}\n    </div>\n  );\n}\n\nexport interface ToastCloseButtonProps {\n  /** The toast to close. */\n  toast: QueuedToast<ToastContent>;\n  children?: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n  \"aria-label\"?: string;\n}\n\n/**\n * ToastCloseButton is a button that closes the toast.\n */\nexport function ToastCloseButton(props: ToastCloseButtonProps): JSX.Element {\n  const contextState = useContext(ToastContext);\n  const handleClose = () => {\n    const key = props.toast.key;\n    const state = contextState ?? toastStateByKey.get(key);\n    state?.close(key);\n    state?.remove(key);\n  };\n\n  return (\n    <button\n      type=\"button\"\n      class={props.class}\n      style={props.style}\n      aria-label={props[\"aria-label\"] ?? \"Close\"}\n      data-solidaria-toast-close-button=\"\"\n      on:click={handleClose}\n      onClick={handleClose}\n    >\n      {props.children ?? \"×\"}\n    </button>\n  );\n}\n\nexport interface DefaultToastProps {\n  toast: QueuedToast<ToastContent>;\n}\n\n/**\n * DefaultToast provides a basic toast layout with title, description, and close button.\n * Use this as a starting point or as-is for simple toast needs.\n */\nexport function DefaultToast(props: DefaultToastProps): JSX.Element {\n  const content = () => props.toast.content;\n  const title = () => content().children ?? content().title;\n  const actionLabel = () => content().actionLabel ?? content().action?.label;\n  const actionHandler = () => content().onAction ?? content().action?.onAction;\n  const state = useToastContext();\n  const handleAction = () => {\n    actionHandler()?.();\n    if (content().shouldCloseOnAction) {\n      state.close(props.toast.key);\n      state.remove(props.toast.key);\n    }\n  };\n\n  return (\n    <Toast toast={props.toast}>\n      <div style={{ display: \"flex\", \"align-items\": \"flex-start\", gap: \"12px\" }}>\n        <ToastContent style={{ flex: 1 }}>\n          <Show when={title()}>\n            <ToastTitle style={{ \"font-weight\": \"bold\", \"margin-bottom\": \"4px\" }}>\n              {title()}\n            </ToastTitle>\n          </Show>\n          <Show when={content().description}>\n            <ToastDescription>{content().description}</ToastDescription>\n          </Show>\n          <Show when={actionLabel()}>\n            <button type=\"button\" style={{ \"margin-top\": \"8px\" }} onClick={handleAction}>\n              {actionLabel()}\n            </button>\n          </Show>\n        </ToastContent>\n        <ToastCloseButton toast={props.toast} />\n      </div>\n    </Toast>\n  );\n}\n"],"mappings":"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"}

package/dist/Toast.jsx

@@ -0,0 +1,361 @@
+import { filterDOMProps, useIsHydrated, useRenderProps } from "./utils.jsx";
+import { Show, createContext, createEffect, createMemo, createSignal, onCleanup, splitProps, useContext } from "solid-js";
+import { Portal } from "solid-js/web";
+import { createToast, createToastRegion, useUNSAFE_PortalContext } from "@proyecto-viviana/solidaria";
+import { ToastQueue, createToastState } from "@proyecto-viviana/solid-stately";
+//#region src/Toast.tsx
+/**
+* Toast components for solidaria-components
+*
+* Toast notifications with auto-dismiss, pause on hover/focus, and accessibility.
+* Port of react-aria-components Toast.
+*/
+const ToastContext = createContext(null);
+const ToastAriaContext = createContext(null);
+const toastStateByKey = /* @__PURE__ */ new Map();
+function useToastContext() {
+	const context = useContext(ToastContext);
+	if (!context) throw new Error("Toast components must be used within a ToastProvider");
+	return context;
+}
+/** Default global toast queue that can be used for app-wide toasts. */
+const globalToastQueue = new ToastQueue({
+	maxVisibleToasts: Infinity,
+	hasExitAnimation: true
+});
+/**
+* Add a toast to the global queue.
+* Convenience function for adding toasts from anywhere in the app.
+*/
+function addToast(content, options) {
+	return globalToastQueue.add(content, options);
+}
+function normalizeToastPlacement(placement) {
+	return (placement ?? "bottom").replace("-", " ");
+}
+/**
+* ToastProvider creates a toast queue context for descendant components.
+* Use this to wrap your app or a section that needs toast notifications.
+*
+* @example
+* ```tsx
+* <ToastProvider>
+*   <App />
+*   <ToastRegion />
+* </ToastProvider>
+* ```
+*/
+function ToastProvider(props) {
+	const state = createToastState({ queue: props.useGlobalQueue ? globalToastQueue : new ToastQueue(props.queueOptions) });
+	return <ToastContext.Provider value={state}>{props.children}</ToastContext.Provider>;
+}
+/**
+* ToastRegion is a container that displays all visible toasts.
+* It handles pause on hover/focus and provides the landmark region.
+*
+* @example
+* ```tsx
+* <ToastRegion placement="bottom-end">
+*   {(renderProps) => (
+*     <For each={renderProps.visibleToasts}>
+*       {(toast) => <Toast toast={toast} />}
+*     </For>
+*   )}
+* </ToastRegion>
+* ```
+*/
+function ToastRegion(props) {
+	const isHydrated = useIsHydrated();
+	const [local, rest] = splitProps(props, [
+		"children",
+		"class",
+		"style",
+		"state",
+		"aria-label",
+		"portal",
+		"placement"
+	]);
+	const portalContext = useUNSAFE_PortalContext();
+	const portalContainer = () => portalContext.getContainer?.() ?? void 0;
+	const [regionElement, setRegionElement] = createSignal();
+	const contextState = useContext(ToastContext);
+	const state = () => local.state ?? contextState;
+	const regionAria = createToastRegion({
+		state: {
+			visibleToasts: () => state()?.visibleToasts() ?? [],
+			add: (content, options) => state()?.add(content, options) ?? "",
+			close: (key) => state()?.close(key),
+			remove: (key) => state()?.remove(key),
+			clear: () => state()?.clear(),
+			pauseAll: () => state()?.pauseAll(),
+			resumeAll: () => state()?.resumeAll()
+		},
+		ref: regionElement,
+		get "aria-label"() {
+			return local["aria-label"];
+		}
+	});
+	const renderValues = createMemo(() => ({ visibleToasts: () => state()?.visibleToasts() ?? [] }));
+	const renderProps = useRenderProps({
+		get children() {
+			return props.children;
+		},
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-ToastRegion"
+	}, renderValues);
+	const domProps = createMemo(() => filterDOMProps(rest, { global: true }));
+	const placementStyles = createMemo(() => {
+		const [edge, align = "center"] = normalizeToastPlacement(local.placement).split(" ");
+		const base = {
+			position: "fixed",
+			"z-index": 100001,
+			display: "flex",
+			"flex-direction": edge === "top" ? "column" : "column-reverse",
+			gap: "8px",
+			padding: "16px",
+			"pointer-events": "none"
+		};
+		if (edge === "top") {
+			if (align === "end") return {
+				...base,
+				top: "16px",
+				right: "16px"
+			};
+			if (align === "start") return {
+				...base,
+				top: "16px",
+				left: "16px"
+			};
+			return {
+				...base,
+				top: "16px",
+				left: "50%",
+				transform: "translateX(-50%)"
+			};
+		}
+		if (align === "end") return {
+			...base,
+			bottom: "16px",
+			right: "16px"
+		};
+		if (align === "start") return {
+			...base,
+			bottom: "16px",
+			left: "16px"
+		};
+		return {
+			...base,
+			bottom: "16px",
+			left: "50%",
+			transform: "translateX(-50%)"
+		};
+	});
+	const normalizedPlacement = () => normalizeToastPlacement(local.placement);
+	const visibleToasts = () => state()?.visibleToasts() ?? [];
+	const hasToasts = () => visibleToasts().length > 0;
+	const hasAuthoredRegionStyle = () => local.class != null || local.style != null;
+	const regionContent = () => {
+		if (!state()) return null;
+		const mergedStyle = () => {
+			const custom = renderProps.style();
+			if (hasAuthoredRegionStyle()) return custom;
+			const placement = placementStyles();
+			if (!custom) return placement;
+			return {
+				...placement,
+				...custom
+			};
+		};
+		const { ref: _ref, ...cleanRegionProps } = regionAria.regionProps;
+		return <div ref={setRegionElement} {...domProps()} {...cleanRegionProps} class={renderProps.class()} style={mergedStyle()} data-placement={normalizedPlacement()}>
+        {renderProps.renderChildren()}
+      </div>;
+	};
+	return <Show when={isHydrated() && hasToasts()}>
+      <Show when={local.portal !== false} fallback={regionContent()}>
+        <Portal mount={portalContainer()}>{regionContent()}</Portal>
+      </Show>
+    </Show>;
+}
+/**
+* Toast is an individual notification component.
+*
+* @example
+* ```tsx
+* <Toast toast={toast}>
+*   {(renderProps) => (
+*     <div class={renderProps.isExiting ? 'fade-out' : 'fade-in'}>
+*       <h3>{renderProps.toast.content.title}</h3>
+*       <p>{renderProps.toast.content.description}</p>
+*     </div>
+*   )}
+* </Toast>
+* ```
+*/
+function Toast(props) {
+	const [local, rest] = splitProps(props, [
+		"toast",
+		"children",
+		"class",
+		"style"
+	]);
+	let toastRef;
+	const state = useToastContext();
+	createEffect(() => {
+		const key = local.toast.key;
+		toastStateByKey.set(key, state);
+		onCleanup(() => {
+			if (toastStateByKey.get(key) === state) toastStateByKey.delete(key);
+		});
+	});
+	const hasTitle = () => !!(local.toast.content.children ?? local.toast.content.title);
+	const toastAria = createToast({
+		toast: local.toast,
+		state,
+		hasTitle: hasTitle(),
+		hasDescription: !!local.toast.content.description
+	});
+	const renderValues = createMemo(() => ({
+		isEntering: local.toast.animation === "entering",
+		isExiting: local.toast.animation === "exiting",
+		animation: local.toast.animation,
+		toast: local.toast
+	}));
+	const renderProps = useRenderProps({
+		get children() {
+			return props.children;
+		},
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-Toast"
+	}, renderValues);
+	const domProps = createMemo(() => filterDOMProps(rest, { global: true }));
+	const mergedStyle = () => {
+		const custom = renderProps.style();
+		if (!custom) return { "pointer-events": "auto" };
+		return {
+			"pointer-events": "auto",
+			...custom
+		};
+	};
+	const handleRootClick = (event) => {
+		const target = event.target;
+		if (!(target instanceof Element)) return;
+		if (target.closest("[data-solidaria-toast-close-button]")) {
+			state.close(local.toast.key);
+			state.remove(local.toast.key);
+		}
+	};
+	createEffect(() => {
+		if (local.toast.animation !== "exiting") return;
+		state.remove(local.toast.key);
+	});
+	const { ref: _ref, ...cleanToastProps } = toastAria.toastProps;
+	createEffect(() => {});
+	return <ToastAriaContext.Provider value={{
+		titleProps: toastAria.titleProps,
+		descriptionProps: toastAria.descriptionProps,
+		contentProps: toastAria.contentProps
+	}}>
+      <div ref={toastRef} {...domProps()} {...cleanToastProps} class={renderProps.class()} style={mergedStyle()} data-animation={local.toast.animation} data-type={local.toast.content.type ?? local.toast.content.variant} data-variant={local.toast.content.variant} on:click={handleRootClick}>
+        {renderProps.renderChildren()}
+      </div>
+    </ToastAriaContext.Provider>;
+}
+/**
+* ToastTitle renders the toast title with proper accessibility attributes.
+*/
+function ToastTitle(props) {
+	const { ref: _ref, ...ariaTitleProps } = useContext(ToastAriaContext)?.titleProps ?? {};
+	return <span data-solidaria-toast-title="" {...ariaTitleProps} class={props.class} style={props.style}>
+      {props.children}
+    </span>;
+}
+/**
+* ToastDescription renders the toast description with proper accessibility attributes.
+*/
+function ToastDescription(props) {
+	const { ref: _ref, ...ariaDescriptionProps } = useContext(ToastAriaContext)?.descriptionProps ?? {};
+	return <span data-solidaria-toast-description="" {...ariaDescriptionProps} class={props.class} style={props.style}>
+      {props.children}
+    </span>;
+}
+/**
+* ToastContent wraps the toast message (title + description) in the live region
+* announced to screen readers. It carries `role="alert"` / `aria-live="assertive"`
+* from createToast's contentProps so the toast text is announced when it appears.
+*
+* It is rendered as a sibling of the close button (never wrapping it) so screen
+* readers announce the message without reading the close button first.
+*/
+function ToastContent(props) {
+	const { ref: _ref, ...ariaContentProps } = useContext(ToastAriaContext)?.contentProps ?? {};
+	return <div data-solidaria-toast-content="" {...ariaContentProps} class={props.class} style={props.style}>
+      {props.children}
+    </div>;
+}
+/**
+* ToastCloseButton is a button that closes the toast.
+*/
+function ToastCloseButton(props) {
+	const contextState = useContext(ToastContext);
+	const handleClose = () => {
+		const key = props.toast.key;
+		const state = contextState ?? toastStateByKey.get(key);
+		state?.close(key);
+		state?.remove(key);
+	};
+	return <button type="button" class={props.class} style={props.style} aria-label={props["aria-label"] ?? "Close"} data-solidaria-toast-close-button="" on:click={handleClose} onClick={handleClose}>
+      {props.children ?? "×"}
+    </button>;
+}
+/**
+* DefaultToast provides a basic toast layout with title, description, and close button.
+* Use this as a starting point or as-is for simple toast needs.
+*/
+function DefaultToast(props) {
+	const content = () => props.toast.content;
+	const title = () => content().children ?? content().title;
+	const actionLabel = () => content().actionLabel ?? content().action?.label;
+	const actionHandler = () => content().onAction ?? content().action?.onAction;
+	const state = useToastContext();
+	const handleAction = () => {
+		actionHandler()?.();
+		if (content().shouldCloseOnAction) {
+			state.close(props.toast.key);
+			state.remove(props.toast.key);
+		}
+	};
+	return <Toast toast={props.toast}>
+      <div style={{
+		display: "flex",
+		"align-items": "flex-start",
+		gap: "12px"
+	}}>
+        <ToastContent style={{ flex: 1 }}>
+          <Show when={title()}>
+            <ToastTitle style={{
+		"font-weight": "bold",
+		"margin-bottom": "4px"
+	}}>
+              {title()}
+            </ToastTitle>
+          </Show>
+          <Show when={content().description}>
+            <ToastDescription>{content().description}</ToastDescription>
+          </Show>
+          <Show when={actionLabel()}>
+            <button type="button" style={{ "margin-top": "8px" }} onClick={handleAction}>
+              {actionLabel()}
+            </button>
+          </Show>
+        </ToastContent>
+        <ToastCloseButton toast={props.toast} />
+      </div>
+    </Toast>;
+}
+//#endregion
+export { DefaultToast, Toast, ToastCloseButton, ToastContent, ToastContext, ToastDescription, ToastProvider, ToastRegion, ToastTitle, addToast, globalToastQueue, useToastContext };
+
+//# sourceMappingURL=Toast.jsx.map

package/dist/Toast.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.jsx","names":[],"sources":["../src/Toast.tsx"],"sourcesContent":["/**\n * Toast components for solidaria-components\n *\n * Toast notifications with auto-dismiss, pause on hover/focus, and accessibility.\n * Port of react-aria-components Toast.\n */\n\nimport {\n  type JSX,\n  type Accessor,\n  createContext,\n  createMemo,\n  createEffect,\n  createSignal,\n  onCleanup,\n  splitProps,\n  Show,\n  useContext,\n} from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport {\n  type ToastState,\n  type QueuedToast,\n  type ToastQueueOptions,\n  type ToastOptions,\n  ToastQueue,\n  createToastState,\n} from \"@proyecto-viviana/solid-stately\";\nimport {\n  createToast,\n  createToastRegion,\n  useUNSAFE_PortalContext,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n  type RenderChildren,\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  useRenderProps,\n  filterDOMProps,\n  useIsHydrated,\n} from \"./utils\";\n\nexport interface ToastContent {\n  /** DOM id for the toast root when content is queued through Spectrum ToastQueue. */\n  id?: string;\n  /** Data attributes for the toast root when content is queued through Spectrum ToastQueue. */\n  [dataAttribute: `data-${string}`]: string | number | boolean | undefined;\n  /** Spectrum Toast message content. */\n  children?: string;\n  /** The title of the toast. */\n  title?: string;\n  /** The description/body of the toast. */\n  description?: string;\n  /** Spectrum variant. */\n  variant?: \"info\" | \"positive\" | \"negative\" | \"neutral\";\n  /** Backward-compatible type/variant of the toast. */\n  type?: \"info\" | \"success\" | \"warning\" | \"error\" | \"positive\" | \"negative\" | \"neutral\";\n  /** Spectrum action button label. */\n  actionLabel?: string;\n  /** Handler called when the Spectrum action button is pressed. */\n  onAction?: () => void;\n  /** Whether the toast should close when the Spectrum action is performed. */\n  shouldCloseOnAction?: boolean;\n  /** Custom action button. */\n  action?: {\n    label: string;\n    onAction: () => void;\n  };\n}\n\nexport interface ToastRenderProps {\n  /** Whether the toast is currently animating in. */\n  isEntering: boolean;\n  /** Whether the toast is currently animating out. */\n  isExiting: boolean;\n  /** The animation state (entering, exiting, queued). */\n  animation: \"entering\" | \"exiting\" | \"queued\" | undefined;\n  /** The toast data. */\n  toast: QueuedToast<ToastContent>;\n}\n\nexport interface ToastRegionRenderProps {\n  /** The visible toasts. */\n  visibleToasts: Accessor<QueuedToast<ToastContent>[]>;\n}\n\nexport interface ToastRegionProps {\n  /** The children of the component - can be JSX or render function. */\n  children?: RenderChildren<ToastRegionRenderProps>;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<ToastRegionRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<ToastRegionRenderProps>;\n  /** The toast state to display. If not provided, uses ToastContext. */\n  state?: ToastState<ToastContent>;\n  /** Accessible label for the region. */\n  \"aria-label\"?: string;\n  /** Whether to render in a portal. */\n  portal?: boolean;\n  /** Placement of the toast region. */\n  placement?:\n    | \"top\"\n    | \"top start\"\n    | \"top end\"\n    | \"top-start\"\n    | \"top-end\"\n    | \"bottom\"\n    | \"bottom start\"\n    | \"bottom end\"\n    | \"bottom-start\"\n    | \"bottom-end\";\n}\n\nexport interface ToastProps {\n  /** DOM id for the toast root. */\n  id?: string;\n  /** Data attributes for the toast root. */\n  [dataAttribute: `data-${string}`]: string | number | boolean | undefined;\n  /** The toast data. */\n  toast: QueuedToast<ToastContent>;\n  /** The children of the component - can be JSX or render function. */\n  children?: RenderChildren<ToastRenderProps>;\n  /** The CSS className for the element. */\n  class?: ClassNameOrFunction<ToastRenderProps>;\n  /** The inline style for the element. */\n  style?: StyleOrFunction<ToastRenderProps>;\n}\n\nexport const ToastContext = createContext<ToastState<ToastContent> | null>(null);\n\ninterface ToastAriaContextValue {\n  titleProps: JSX.HTMLAttributes<HTMLElement>;\n  descriptionProps: JSX.HTMLAttributes<HTMLElement>;\n  contentProps: JSX.HTMLAttributes<HTMLElement>;\n}\n\nconst ToastAriaContext = createContext<ToastAriaContextValue | null>(null);\nconst toastStateByKey = new Map<string, ToastState<ToastContent>>();\n\nexport function useToastContext(): ToastState<ToastContent> {\n  const context = useContext(ToastContext);\n  if (!context) {\n    throw new Error(\"Toast components must be used within a ToastProvider\");\n  }\n  return context;\n}\n\n/** Default global toast queue that can be used for app-wide toasts. */\nexport const globalToastQueue = new ToastQueue<ToastContent>({\n  maxVisibleToasts: Infinity,\n  hasExitAnimation: true,\n});\n\n/**\n * Add a toast to the global queue.\n * Convenience function for adding toasts from anywhere in the app.\n */\nexport function addToast(content: ToastContent, options?: ToastOptions): string {\n  return globalToastQueue.add(content, options);\n}\n\nfunction normalizeToastPlacement(placement?: ToastRegionProps[\"placement\"]) {\n  return (placement ?? \"bottom\").replace(\"-\", \" \") as NonNullable<ToastRegionProps[\"placement\"]>;\n}\n\nexport interface ToastProviderProps {\n  /** The children of the provider. */\n  children: JSX.Element;\n  /** Custom toast queue options. */\n  queueOptions?: ToastQueueOptions;\n  /** Use global queue instead of creating a new one. */\n  useGlobalQueue?: boolean;\n}\n\n/**\n * ToastProvider creates a toast queue context for descendant components.\n * Use this to wrap your app or a section that needs toast notifications.\n *\n * @example\n * ```tsx\n * <ToastProvider>\n *   <App />\n *   <ToastRegion />\n * </ToastProvider>\n * ```\n */\nexport function ToastProvider(props: ToastProviderProps): JSX.Element {\n  const queue = props.useGlobalQueue\n    ? globalToastQueue\n    : new ToastQueue<ToastContent>(props.queueOptions);\n\n  const state = createToastState({ queue });\n\n  return <ToastContext.Provider value={state}>{props.children}</ToastContext.Provider>;\n}\n\n/**\n * ToastRegion is a container that displays all visible toasts.\n * It handles pause on hover/focus and provides the landmark region.\n *\n * @example\n * ```tsx\n * <ToastRegion placement=\"bottom-end\">\n *   {(renderProps) => (\n *     <For each={renderProps.visibleToasts}>\n *       {(toast) => <Toast toast={toast} />}\n *     </For>\n *   )}\n * </ToastRegion>\n * ```\n */\nexport function ToastRegion(props: ToastRegionProps): JSX.Element {\n  // Do NOT early-return on the server: returning null on the server and a <Show>\n  // on the client desyncs hydration when the region is in the SSR tree. Render the\n  // same structure on both and gate the Portal on useIsHydrated() (see Popover).\n  const isHydrated = useIsHydrated();\n\n  const [local, rest] = splitProps(props, [\n    \"children\",\n    \"class\",\n    \"style\",\n    \"state\",\n    \"aria-label\",\n    \"portal\",\n    \"placement\",\n  ]);\n  const portalContext = useUNSAFE_PortalContext();\n  const portalContainer = () => portalContext.getContainer?.() ?? undefined;\n  const [regionElement, setRegionElement] = createSignal<HTMLElement>();\n\n  const contextState = useContext(ToastContext);\n  const state = () => local.state ?? contextState;\n\n  const regionAria = createToastRegion<ToastContent>({\n    state: {\n      visibleToasts: () => state()?.visibleToasts() ?? [],\n      add: (content, options) => state()?.add(content, options) ?? \"\",\n      close: (key) => state()?.close(key),\n      remove: (key) => state()?.remove(key),\n      clear: () => state()?.clear(),\n      pauseAll: () => state()?.pauseAll(),\n      resumeAll: () => state()?.resumeAll(),\n    },\n    ref: regionElement,\n    get \"aria-label\"() {\n      return local[\"aria-label\"];\n    },\n  });\n\n  const renderValues = createMemo<ToastRegionRenderProps>(() => ({\n    visibleToasts: () => state()?.visibleToasts() ?? [],\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      // Lazy: the region content is gated behind `<Show when={isHydrated() && …}>`\n      // (Portal) below, so reading children must not instantiate templates during\n      // the component body (would walk getNextElement before the gate the server\n      // kept closed → hydration mismatch). See Popover for the full rationale.\n      get children() {\n        return props.children;\n      },\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-ToastRegion\",\n    },\n    renderValues,\n  );\n  const domProps = createMemo(() =>\n    filterDOMProps(rest as Record<string, unknown>, { global: true }),\n  );\n\n  const placementStyles = createMemo<JSX.CSSProperties>(() => {\n    const placement = normalizeToastPlacement(local.placement);\n    const [edge, align = \"center\"] = placement.split(\" \");\n    const base: JSX.CSSProperties = {\n      position: \"fixed\",\n      \"z-index\": 100001,\n      display: \"flex\",\n      \"flex-direction\": edge === \"top\" ? \"column\" : \"column-reverse\",\n      gap: \"8px\",\n      padding: \"16px\",\n      \"pointer-events\": \"none\",\n    };\n\n    if (edge === \"top\") {\n      if (align === \"end\") {\n        return { ...base, top: \"16px\", right: \"16px\" } as JSX.CSSProperties;\n      }\n      if (align === \"start\") {\n        return { ...base, top: \"16px\", left: \"16px\" } as JSX.CSSProperties;\n      }\n      return {\n        ...base,\n        top: \"16px\",\n        left: \"50%\",\n        transform: \"translateX(-50%)\",\n      } as JSX.CSSProperties;\n    }\n\n    if (align === \"end\") {\n      return { ...base, bottom: \"16px\", right: \"16px\" } as JSX.CSSProperties;\n    }\n    if (align === \"start\") {\n      return { ...base, bottom: \"16px\", left: \"16px\" } as JSX.CSSProperties;\n    }\n    return {\n      ...base,\n      bottom: \"16px\",\n      left: \"50%\",\n      transform: \"translateX(-50%)\",\n    } as JSX.CSSProperties;\n  });\n\n  const normalizedPlacement = () => normalizeToastPlacement(local.placement);\n\n  const visibleToasts = () => state()?.visibleToasts() ?? [];\n  const hasToasts = () => visibleToasts().length > 0;\n  const hasAuthoredRegionStyle = () => local.class != null || local.style != null;\n\n  const regionContent = () => {\n    if (!state()) return null;\n\n    const mergedStyle = () => {\n      const custom = renderProps.style();\n      // React Aria Components leaves ToastRegion unstyled. Keep this package's\n      // fallback placement only for bare regions so styled layers such as S2 can\n      // own fixed viewport geometry with their generated classes.\n      if (hasAuthoredRegionStyle()) return custom;\n\n      const placement = placementStyles();\n      if (!custom) return placement;\n      return { ...placement, ...custom } as JSX.CSSProperties;\n    };\n\n    const { ref: _ref, ...cleanRegionProps } = regionAria.regionProps as Record<string, unknown>;\n\n    return (\n      <div\n        ref={setRegionElement}\n        {...domProps()}\n        {...cleanRegionProps}\n        class={renderProps.class()}\n        style={mergedStyle()}\n        data-placement={normalizedPlacement()}\n      >\n        {renderProps.renderChildren()}\n      </div>\n    );\n  };\n\n  return (\n    <Show when={isHydrated() && hasToasts()}>\n      <Show when={local.portal !== false} fallback={regionContent()}>\n        <Portal mount={portalContainer()}>{regionContent()}</Portal>\n      </Show>\n    </Show>\n  );\n}\n\n/**\n * Toast is an individual notification component.\n *\n * @example\n * ```tsx\n * <Toast toast={toast}>\n *   {(renderProps) => (\n *     <div class={renderProps.isExiting ? 'fade-out' : 'fade-in'}>\n *       <h3>{renderProps.toast.content.title}</h3>\n *       <p>{renderProps.toast.content.description}</p>\n *     </div>\n *   )}\n * </Toast>\n * ```\n */\nexport function Toast(props: ToastProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"toast\", \"children\", \"class\", \"style\"]);\n\n  let toastRef!: HTMLDivElement;\n\n  const state = useToastContext();\n\n  createEffect(() => {\n    const key = local.toast.key;\n    toastStateByKey.set(key, state);\n    onCleanup(() => {\n      if (toastStateByKey.get(key) === state) {\n        toastStateByKey.delete(key);\n      }\n    });\n  });\n\n  const hasTitle = () => !!(local.toast.content.children ?? local.toast.content.title);\n  const toastAria = createToast({\n    toast: local.toast,\n    state,\n    hasTitle: hasTitle(),\n    hasDescription: !!local.toast.content.description,\n  });\n\n  const renderValues = createMemo<ToastRenderProps>(() => ({\n    isEntering: local.toast.animation === \"entering\",\n    isExiting: local.toast.animation === \"exiting\",\n    animation: local.toast.animation,\n    toast: local.toast,\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-Toast\",\n    },\n    renderValues,\n  );\n\n  const domProps = createMemo(() =>\n    filterDOMProps(rest as Record<string, unknown>, { global: true }),\n  );\n\n  const mergedStyle = () => {\n    const custom = renderProps.style();\n    if (!custom) return { \"pointer-events\": \"auto\" as const };\n    return { \"pointer-events\": \"auto\" as const, ...custom } as JSX.CSSProperties;\n  };\n\n  const handleRootClick = (event: MouseEvent) => {\n    const target = event.target;\n    if (!(target instanceof Element)) return;\n    if (target.closest(\"[data-solidaria-toast-close-button]\")) {\n      state.close(local.toast.key);\n      state.remove(local.toast.key);\n    }\n  };\n\n  // Exit animation lifecycle:\n  // When animation becomes 'exiting', wait for CSS animations/transitions to finish,\n  // then call state.remove() to finalize removal from the queue.\n  // In JSDOM or when no animations are running, remove immediately.\n  // Reduced-motion is handled by CSS (shorter/no animations), so the lifecycle\n  // naturally completes faster when the user prefers reduced motion.\n  createEffect(() => {\n    if (local.toast.animation !== \"exiting\") return;\n    if (!toastRef) {\n      state.remove(local.toast.key);\n      return;\n    }\n\n    // Check if the element supports the Web Animations API\n    if (!(\"getAnimations\" in toastRef)) {\n      state.remove(local.toast.key);\n      return;\n    }\n\n    const animations = toastRef.getAnimations();\n    if (animations.length === 0) {\n      // No CSS animations/transitions running - remove immediately\n      state.remove(local.toast.key);\n      return;\n    }\n\n    // Wait for all running animations to finish, then remove\n    let canceled = false;\n    Promise.all(animations.map((a) => a.finished))\n      .then(() => {\n        if (!canceled) {\n          state.remove(local.toast.key);\n        }\n      })\n      .catch(() => {\n        // Animation was canceled (e.g. element removed) - still clean up\n        if (!canceled) {\n          state.remove(local.toast.key);\n        }\n      });\n\n    onCleanup(() => {\n      canceled = true;\n    });\n  });\n\n  const { ref: _ref, ...cleanToastProps } = toastAria.toastProps as Record<string, unknown>;\n\n  // Ensure ARIA title/description IDs and the content live-region attributes are\n  // present on rendered sub-components, even when children are pre-composed outside\n  // the Toast provider owner (as DefaultToast does), where useContext can't reach\n  // this owner's ToastAriaContext.\n  createEffect(() => {\n    if (!toastRef) return;\n\n    const titleId = (toastAria.titleProps as Record<string, unknown>).id as string | undefined;\n    const descriptionId = (toastAria.descriptionProps as Record<string, unknown>).id as\n      | string\n      | undefined;\n    const contentProps = toastAria.contentProps as Record<string, unknown>;\n\n    if (titleId) {\n      const titleEl = toastRef.querySelector(\"[data-solidaria-toast-title]\");\n      if (titleEl instanceof HTMLElement) {\n        titleEl.id = titleId;\n      }\n    }\n\n    if (descriptionId) {\n      const descriptionEl = toastRef.querySelector(\"[data-solidaria-toast-description]\");\n      if (descriptionEl instanceof HTMLElement) {\n        descriptionEl.id = descriptionId;\n      }\n    }\n\n    // Wire the content area as a live region (role=\"alert\" / aria-live=\"assertive\")\n    // so the toast message is announced to screen readers when it appears.\n    const contentEl = toastRef.querySelector(\"[data-solidaria-toast-content]\");\n    if (contentEl instanceof HTMLElement) {\n      const role = contentProps.role as string | undefined;\n      const ariaLive = contentProps[\"aria-live\"] as string | undefined;\n      const ariaAtomic = contentProps[\"aria-atomic\"] as string | undefined;\n      if (role) contentEl.setAttribute(\"role\", role);\n      if (ariaLive) contentEl.setAttribute(\"aria-live\", ariaLive);\n      if (ariaAtomic) contentEl.setAttribute(\"aria-atomic\", ariaAtomic);\n    }\n  });\n\n  return (\n    <ToastAriaContext.Provider\n      value={{\n        titleProps: toastAria.titleProps,\n        descriptionProps: toastAria.descriptionProps,\n        contentProps: toastAria.contentProps,\n      }}\n    >\n      <div\n        ref={toastRef}\n        {...domProps()}\n        {...cleanToastProps}\n        class={renderProps.class()}\n        style={mergedStyle()}\n        data-animation={local.toast.animation}\n        data-type={local.toast.content.type ?? local.toast.content.variant}\n        data-variant={local.toast.content.variant}\n        on:click={handleRootClick}\n      >\n        {renderProps.renderChildren()}\n      </div>\n    </ToastAriaContext.Provider>\n  );\n}\n\nexport interface ToastTitleProps {\n  children: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n}\n\n/**\n * ToastTitle renders the toast title with proper accessibility attributes.\n */\nexport function ToastTitle(props: ToastTitleProps): JSX.Element {\n  const context = useContext(ToastAriaContext);\n  const { ref: _ref, ...ariaTitleProps } = (context?.titleProps ?? {}) as Record<string, unknown>;\n\n  // Upstream S2 Toast renders the title via `<Text slot=\"title\">`, and RAC `Text`\n  // defaults to `elementType=\"span\"` — so the title's text-node container is a\n  // `<span>`, not a `<div>`. Mirror that (the D7 contrast descriptor keys on the\n  // container tag name; a `<div>` here diverged on every variant × theme). (parity rule #1/#2)\n  return (\n    <span data-solidaria-toast-title=\"\" {...ariaTitleProps} class={props.class} style={props.style}>\n      {props.children}\n    </span>\n  );\n}\n\nexport interface ToastDescriptionProps {\n  children: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n}\n\n/**\n * ToastDescription renders the toast description with proper accessibility attributes.\n */\nexport function ToastDescription(props: ToastDescriptionProps): JSX.Element {\n  const context = useContext(ToastAriaContext);\n  const { ref: _ref, ...ariaDescriptionProps } = (context?.descriptionProps ?? {}) as Record<\n    string,\n    unknown\n  >;\n\n  // Match the title: upstream toast text is rendered in `<span>` elements (RAC\n  // `Text`). The port additionally supports a description (upstream S2 has only a\n  // title); keep it as a `<span>` sibling so its text-node container tag is faithful.\n  return (\n    <span\n      data-solidaria-toast-description=\"\"\n      {...ariaDescriptionProps}\n      class={props.class}\n      style={props.style}\n    >\n      {props.children}\n    </span>\n  );\n}\n\nexport interface ToastContentProps {\n  children: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n}\n\n/**\n * ToastContent wraps the toast message (title + description) in the live region\n * announced to screen readers. It carries `role=\"alert\"` / `aria-live=\"assertive\"`\n * from createToast's contentProps so the toast text is announced when it appears.\n *\n * It is rendered as a sibling of the close button (never wrapping it) so screen\n * readers announce the message without reading the close button first.\n */\nexport function ToastContent(props: ToastContentProps): JSX.Element {\n  const context = useContext(ToastAriaContext);\n  const { ref: _ref, ...ariaContentProps } = (context?.contentProps ?? {}) as Record<\n    string,\n    unknown\n  >;\n\n  return (\n    <div\n      data-solidaria-toast-content=\"\"\n      {...ariaContentProps}\n      class={props.class}\n      style={props.style}\n    >\n      {props.children}\n    </div>\n  );\n}\n\nexport interface ToastCloseButtonProps {\n  /** The toast to close. */\n  toast: QueuedToast<ToastContent>;\n  children?: JSX.Element;\n  class?: string;\n  style?: JSX.CSSProperties;\n  \"aria-label\"?: string;\n}\n\n/**\n * ToastCloseButton is a button that closes the toast.\n */\nexport function ToastCloseButton(props: ToastCloseButtonProps): JSX.Element {\n  const contextState = useContext(ToastContext);\n  const handleClose = () => {\n    const key = props.toast.key;\n    const state = contextState ?? toastStateByKey.get(key);\n    state?.close(key);\n    state?.remove(key);\n  };\n\n  return (\n    <button\n      type=\"button\"\n      class={props.class}\n      style={props.style}\n      aria-label={props[\"aria-label\"] ?? \"Close\"}\n      data-solidaria-toast-close-button=\"\"\n      on:click={handleClose}\n      onClick={handleClose}\n    >\n      {props.children ?? \"×\"}\n    </button>\n  );\n}\n\nexport interface DefaultToastProps {\n  toast: QueuedToast<ToastContent>;\n}\n\n/**\n * DefaultToast provides a basic toast layout with title, description, and close button.\n * Use this as a starting point or as-is for simple toast needs.\n */\nexport function DefaultToast(props: DefaultToastProps): JSX.Element {\n  const content = () => props.toast.content;\n  const title = () => content().children ?? content().title;\n  const actionLabel = () => content().actionLabel ?? content().action?.label;\n  const actionHandler = () => content().onAction ?? content().action?.onAction;\n  const state = useToastContext();\n  const handleAction = () => {\n    actionHandler()?.();\n    if (content().shouldCloseOnAction) {\n      state.close(props.toast.key);\n      state.remove(props.toast.key);\n    }\n  };\n\n  return (\n    <Toast toast={props.toast}>\n      <div style={{ display: \"flex\", \"align-items\": \"flex-start\", gap: \"12px\" }}>\n        <ToastContent style={{ flex: 1 }}>\n          <Show when={title()}>\n            <ToastTitle style={{ \"font-weight\": \"bold\", \"margin-bottom\": \"4px\" }}>\n              {title()}\n            </ToastTitle>\n          </Show>\n          <Show when={content().description}>\n            <ToastDescription>{content().description}</ToastDescription>\n          </Show>\n          <Show when={actionLabel()}>\n            <button type=\"button\" style={{ \"margin-top\": \"8px\" }} onClick={handleAction}>\n              {actionLabel()}\n            </button>\n          </Show>\n        </ToastContent>\n        <ToastCloseButton toast={props.toast} />\n      </div>\n    </Toast>\n  );\n}\n"],"mappings":"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"}

package/dist/ToggleButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.d.ts","sourceRoot":"","sources":["../src/ToggleButton.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,GAAG,EAAqD,MAAM,UAAU,CAAC;AACvF,OAAO,EAML,KAAK,qBAAqB,EAC3B,MAAM,6BAA6B,CAAC;AACrC,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAGf,MAAM,SAAS,CAAC;AAGjB,KAAK,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,CAAA;CAAE,GAAG,SAAS,CAAC;AAWzE,MAAM,WAAW,uBAAuB;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,EAAE,OAAO,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,qBAAqB,EAAE,UAAU,CAAC,EAAE,SAAS;IAC3F,8DAA8D;IAC9D,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,+DAA+D;IAC/D,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,QAAQ,CAAC,EAAE,cAAc,CAAC,uBAAuB,CAAC,CAAC;IACnD,KAAK,CAAC,EAAE,mBAAmB,CAAC,uBAAuB,CAAC,CAAC;IACrD,KAAK,CAAC,EAAE,eAAe,CAAC,uBAAuB,CAAC,CAAC;IACjD,6CAA6C;IAC7C,GAAG,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CAClC;AAED,eAAO,MAAM,mBAAmB,sDAAgD,CAAC;AASjF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CAoGlE"}
+{"version":3,"file":"ToggleButton.d.ts","sourceRoot":"","sources":["../src/ToggleButton.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,KAAK,GAAG,EAAqD,MAAM,UAAU,CAAC;AACvF,OAAO,EAML,KAAK,qBAAqB,EAC3B,MAAM,6BAA6B,CAAC;AACrC,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,SAAS,EAGf,MAAM,SAAS,CAAC;AAGjB,KAAK,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,CAAA;CAAE,GAAG,SAAS,CAAC;AAWzE,MAAM,WAAW,uBAAuB;IACtC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,EAAE,OAAO,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,qBAAqB,EAAE,UAAU,CAAC,EAAE,SAAS;IAC3F,8DAA8D;IAC9D,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,+DAA+D;IAC/D,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,QAAQ,CAAC,EAAE,cAAc,CAAC,uBAAuB,CAAC,CAAC;IACnD,KAAK,CAAC,EAAE,mBAAmB,CAAC,uBAAuB,CAAC,CAAC;IACrD,KAAK,CAAC,EAAE,eAAe,CAAC,uBAAuB,CAAC,CAAC;IACjD,6CAA6C;IAC7C,GAAG,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CAClC;AAED,eAAO,MAAM,mBAAmB,sDAAgD,CAAC;AASjF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CAsGlE"}

package/dist/ToggleButton.js

@@ -0,0 +1,123 @@
+import { filterDOMProps, useRenderProps } from "./utils.js";
+import { useToggleButtonGroupStateContext } from "./ToggleButtonGroup.js";
+import { getNextElement, insert, mergeProps, runHydrationEvents, spread, template, use } from "solid-js/web";
+import { createContext, createMemo, splitProps, useContext } from "solid-js";
+import { createFocusRing, createHover, createToggleButton, createToggleButtonGroupItem, mergeProps as mergeProps$2 } from "@proyecto-viviana/solidaria";
+//#region src/ToggleButton.tsx
+/**
+* ToggleButton component for solidaria-components
+*
+* A pre-wired headless toggle button that combines pressed + selected state.
+* Port direction: react-aria-components/src/ToggleButton.tsx
+*/
+var _tmpl$ = /*#__PURE__*/ template(`<button>`);
+function assignRef(ref, el) {
+	if (!ref) return;
+	if (typeof ref === "function") ref(el);
+	else ref.current = el;
+}
+const ToggleButtonContext = createContext(null);
+function resolveDisabledValue(isDisabled) {
+	if (typeof isDisabled === "function") return isDisabled();
+	return !!isDisabled;
+}
+function ToggleButton(props) {
+	const contextProps = useContext(ToggleButtonContext);
+	const [local, ariaProps] = splitProps(contextProps ? mergeProps$2(contextProps, props) : props, [
+		"children",
+		"class",
+		"style",
+		"ref",
+		"slot",
+		"toggleKey",
+		"id"
+	]);
+	const groupState = useToggleButtonGroupStateContext();
+	const groupKey = local.id ?? local.toggleKey;
+	const standaloneAriaProps = mergeProps$2(ariaProps, { get id() {
+		return local.id;
+	} });
+	const toggleAria = groupState && groupKey != null ? createToggleButtonGroupItem({
+		...ariaProps,
+		id: groupKey
+	}, groupState) : createToggleButton(standaloneAriaProps);
+	const isDisabled = () => resolveDisabledValue(ariaProps.isDisabled) || !!groupState?.isDisabled;
+	const { isFocused, isFocusVisible, focusProps } = createFocusRing();
+	const { isHovered, hoverProps } = createHover({ get isDisabled() {
+		return isDisabled();
+	} });
+	const renderValues = createMemo(() => ({
+		isHovered: isHovered(),
+		isPressed: toggleAria.isPressed(),
+		isFocused: isFocused(),
+		isFocusVisible: isFocusVisible(),
+		isDisabled: isDisabled(),
+		isSelected: toggleAria.isSelected()
+	}));
+	const renderProps = useRenderProps({
+		get children() {
+			return local.children;
+		},
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-ToggleButton"
+	}, renderValues);
+	const domProps = createMemo(() => {
+		const filtered = filterDOMProps(ariaProps, { global: true });
+		delete filtered.onClick;
+		delete filtered.id;
+		return filtered;
+	});
+	const cleanButtonProps = () => {
+		const { ref: _ref1, ...rest } = toggleAria.buttonProps;
+		return rest;
+	};
+	const cleanFocusProps = () => {
+		const { ref: _ref2, ...rest } = focusProps;
+		return rest;
+	};
+	const cleanHoverProps = () => {
+		const { ref: _ref3, ...rest } = hoverProps;
+		return rest;
+	};
+	return (() => {
+		var _el$ = getNextElement(_tmpl$);
+		use((el) => assignRef(local.ref, el), _el$);
+		spread(_el$, mergeProps(domProps, cleanButtonProps, cleanFocusProps, cleanHoverProps, {
+			get ["class"]() {
+				return renderProps.class();
+			},
+			get style() {
+				return renderProps.style();
+			},
+			get slot() {
+				return local.slot;
+			},
+			get ["data-pressed"]() {
+				return toggleAria.isPressed() || void 0;
+			},
+			get ["data-hovered"]() {
+				return isHovered() || void 0;
+			},
+			get ["data-focused"]() {
+				return isFocused() || void 0;
+			},
+			get ["data-focus-visible"]() {
+				return isFocusVisible() || void 0;
+			},
+			get ["data-disabled"]() {
+				return isDisabled() || void 0;
+			},
+			get ["data-selected"]() {
+				return toggleAria.isSelected() || void 0;
+			}
+		}), false, true);
+		insert(_el$, () => renderProps.renderChildren());
+		runHydrationEvents();
+		return _el$;
+	})();
+}
+//#endregion
+export { ToggleButton, ToggleButtonContext };
+
+//# sourceMappingURL=ToggleButton.js.map