@accelint/design-toolkit 9.12.0 → 9.13.0

package/dist/components/menu/section.d.ts

@@ -12,7 +12,7 @@
 
 import { MenuSectionProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime73 from "react/jsx-runtime";
+import * as react_jsx_runtime154 from "react/jsx-runtime";
 
 //#region src/components/menu/section.d.ts
 
@@ -42,7 +42,7 @@ declare function MenuSection<T extends object>({
   items,
   title,
   ...rest
-}: MenuSectionProps<T>): react_jsx_runtime73.JSX.Element;
+}: MenuSectionProps<T>): react_jsx_runtime154.JSX.Element;
 //#endregion
 export { MenuSection };
 //# sourceMappingURL=section.d.ts.map

package/dist/components/menu/separator.d.ts

@@ -11,7 +11,7 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime75 from "react/jsx-runtime";
+import * as react_jsx_runtime124 from "react/jsx-runtime";
 import { SeparatorProps } from "react-aria-components/Separator";
 
 //#region src/components/menu/separator.d.ts
@@ -32,7 +32,7 @@ import { SeparatorProps } from "react-aria-components/Separator";
 declare function MenuSeparator({
   className,
   ...rest
-}: SeparatorProps): react_jsx_runtime75.JSX.Element;
+}: SeparatorProps): react_jsx_runtime124.JSX.Element;
 //#endregion
 export { MenuSeparator };
 //# sourceMappingURL=separator.d.ts.map

package/dist/components/menu/submenu.d.ts

@@ -11,7 +11,7 @@
  */
 
 import "client-only";
-import * as react22 from "react";
+import * as react40 from "react";
 import * as react_aria_components_Menu0 from "react-aria-components/Menu";
 
 //#region src/components/menu/submenu.d.ts
@@ -31,7 +31,7 @@ import * as react_aria_components_Menu0 from "react-aria-components/Menu";
  * </MenuSubmenu>
  * ```
  */
-declare const MenuSubmenu: (props: react_aria_components_Menu0.SubmenuTriggerProps & React.RefAttributes<HTMLDivElement>) => react22.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;
+declare const MenuSubmenu: (props: react_aria_components_Menu0.SubmenuTriggerProps & React.RefAttributes<HTMLDivElement>) => react40.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;
 //#endregion
 export { MenuSubmenu };
 //# sourceMappingURL=submenu.d.ts.map

package/dist/components/notice/index.d.ts

@@ -12,7 +12,7 @@
 
 import { NoticeProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime79 from "react/jsx-runtime";
+import * as react_jsx_runtime159 from "react/jsx-runtime";
 
 //#region src/components/notice/index.d.ts
 
@@ -54,6 +54,7 @@ declare function Notice({
   message,
   primary,
   secondary,
+  metadata,
   hideIcon,
   showClose,
   shouldCloseOnAction,
@@ -61,7 +62,7 @@ declare function Notice({
   onPrimaryAction,
   onSecondaryAction,
   onClose
-}: NoticeProps): react_jsx_runtime79.JSX.Element;
+}: NoticeProps): react_jsx_runtime159.JSX.Element;
 //#endregion
 export { Notice };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/notice/index.js

@@ -62,7 +62,7 @@ const ButtonColorMap = {
 * @param props.onClose - Callback when the notice is closed.
 * @returns The rendered Notice component.
 */
-function Notice({ id, classNames, color = "info", message, primary, secondary, hideIcon, showClose, shouldCloseOnAction, size = "medium", onPrimaryAction, onSecondaryAction, onClose }) {
+function Notice({ id, classNames, color = "info", message, primary, secondary, metadata, hideIcon, showClose, shouldCloseOnAction, size = "medium", onPrimaryAction, onSecondaryAction, onClose }) {
 	return /* @__PURE__ */ jsx(UNSTABLE_Toast, {
 		className: clsx("group/notice", styles.notice, classNames?.notice),
 		toast: {
@@ -93,7 +93,7 @@ function Notice({ id, classNames, color = "info", message, primary, secondary, h
 						...primary,
 						size,
 						onPress: () => {
-							onPrimaryAction?.();
+							onPrimaryAction?.(metadata);
 							if (shouldCloseOnAction) onClose?.();
 						}
 					}), secondary && /* @__PURE__ */ jsx(Button, {
@@ -102,7 +102,7 @@ function Notice({ id, classNames, color = "info", message, primary, secondary, h
 						...secondary,
 						size,
 						onPress: () => {
-							onSecondaryAction?.();
+							onSecondaryAction?.(metadata);
 							if (shouldCloseOnAction) onClose?.();
 						}
 					})]

package/dist/components/notice/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ButtonColorMap: Record<NoticeColor, ButtonProps['color']>","Toast","ToastContent"],"sources":["../../../src/components/notice/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. 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 https://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'use client';\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport Cancel from '@accelint/icons/cancel';\nimport {\n  Text,\n  UNSTABLE_Toast as Toast,\n  UNSTABLE_ToastContent as ToastContent,\n} from 'react-aria-components/Toast';\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { NoticeIcon } from './notice-icon';\nimport styles from './styles.module.css';\nimport type { ButtonProps } from '../button/types';\nimport type { NoticeColor, NoticeProps } from './types';\n\nconst ButtonColorMap: Record<NoticeColor, ButtonProps['color']> = {\n  normal: 'mono-bold',\n  advisory: 'mono-bold',\n  info: 'mono-bold',\n  serious: 'serious',\n  critical: 'critical',\n};\n\n/**\n * Notice - Notification component for temporary messages and alerts\n *\n * Displays messages with optional action buttons and close functionality.\n * Icons are automatically displayed based on the color variant.\n *\n * @example\n * ```tsx\n * <Notice\n *   id=\"notice-1\"\n *   message=\"Operation completed\"\n *   color=\"normal\"\n * />\n * ```\n *\n * @param props - {@link NoticeProps}\n * @param props.id - Unique identifier for the notice.\n * @param props.classNames - CSS class names for notice elements.\n * @param props.color - Color variant indicating severity.\n * @param props.message - Message text to display.\n * @param props.primary - Primary action button configuration.\n * @param props.secondary - Secondary action button configuration.\n * @param props.hideIcon - Whether to hide the status icon.\n * @param props.showClose - Whether to show the close button.\n * @param props.shouldCloseOnAction - Whether to close the notice when an action button is pressed.\n * @param props.size - Size variant for the notice.\n * @param props.onPrimaryAction - Callback when primary action button is pressed.\n * @param props.onSecondaryAction - Callback when secondary action button is pressed.\n * @param props.onClose - Callback when the notice is closed.\n * @returns The rendered Notice component.\n */\nexport function Notice({\n  id,\n  classNames,\n  color = 'info',\n  message,\n  primary,\n  secondary,\n  hideIcon,\n  showClose,\n  shouldCloseOnAction,\n  size = 'medium',\n  onPrimaryAction,\n  onSecondaryAction,\n  onClose,\n}: NoticeProps) {\n  return (\n    <Toast\n      className={clsx('group/notice', styles.notice, classNames?.notice)}\n      toast={{ key: id, content: message, onClose }}\n      data-color={color}\n      data-size={size}\n      style={{ viewTransitionName: id }}\n    >\n      <ToastContent className={clsx(styles.content, classNames?.content)}>\n        {!hideIcon && size === 'medium' && (\n          <NoticeIcon color={color} size={size} />\n        )}\n        <Text\n          slot='description'\n          className={clsx(styles.message, classNames?.message)}\n        >\n          {message}\n        </Text>\n        {(primary || secondary) && (\n          <div className={clsx(styles.actions, classNames?.actions)}>\n            {primary && (\n              <Button\n                color={ButtonColorMap[color]}\n                variant='filled'\n                {...primary}\n                size={size}\n                onPress={() => {\n                  onPrimaryAction?.();\n\n                  if (shouldCloseOnAction) {\n                    onClose?.();\n                  }\n                }}\n              />\n            )}\n            {secondary && (\n              <Button\n                color={ButtonColorMap[color]}\n                variant='outline'\n                {...secondary}\n                size={size}\n                onPress={() => {\n                  onSecondaryAction?.();\n\n                  if (shouldCloseOnAction) {\n                    onClose?.();\n                  }\n                }}\n              />\n            )}\n          </div>\n        )}\n        {showClose && (\n          <Button\n            color={ButtonColorMap[color]}\n            variant='icon'\n            onPress={onClose}\n          >\n            <Icon>\n              <Cancel />\n            </Icon>\n          </Button>\n        )}\n      </ToastContent>\n    </Toast>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAMA,iBAA4D;CAChE,QAAQ;CACR,UAAU;CACV,MAAM;CACN,SAAS;CACT,UAAU;CACX;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCD,SAAgB,OAAO,EACrB,IACA,YACA,QAAQ,QACR,SACA,SACA,WACA,UACA,WACA,qBACA,OAAO,UACP,iBACA,mBACA,WACc;AACd,QACE,oBAACC;EACC,WAAW,KAAK,gBAAgB,OAAO,QAAQ,YAAY,OAAO;EAClE,OAAO;GAAE,KAAK;GAAI,SAAS;GAAS;GAAS;EAC7C,cAAY;EACZ,aAAW;EACX,OAAO,EAAE,oBAAoB,IAAI;YAEjC,qBAACC;GAAa,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;;IAC/D,CAAC,YAAY,SAAS,YACrB,oBAAC;KAAkB;KAAa;MAAQ;IAE1C,oBAAC;KACC,MAAK;KACL,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;eAEnD;MACI;KACL,WAAW,cACX,qBAAC;KAAI,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;gBACtD,WACC,oBAAC;MACC,OAAO,eAAe;MACtB,SAAQ;MACR,GAAI;MACE;MACN,eAAe;AACb,0BAAmB;AAEnB,WAAI,oBACF,YAAW;;OAGf,EAEH,aACC,oBAAC;MACC,OAAO,eAAe;MACtB,SAAQ;MACR,GAAI;MACE;MACN,eAAe;AACb,4BAAqB;AAErB,WAAI,oBACF,YAAW;;OAGf;MAEA;IAEP,aACC,oBAAC;KACC,OAAO,eAAe;KACtB,SAAQ;KACR,SAAS;eAET,oBAAC,kBACC,oBAAC,WAAS,GACL;MACA;;IAEE;GACT"}
+{"version":3,"file":"index.js","names":["ButtonColorMap: Record<NoticeColor, ButtonProps['color']>","Toast","ToastContent"],"sources":["../../../src/components/notice/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. 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 https://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'use client';\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport Cancel from '@accelint/icons/cancel';\nimport {\n  Text,\n  UNSTABLE_Toast as Toast,\n  UNSTABLE_ToastContent as ToastContent,\n} from 'react-aria-components/Toast';\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport { NoticeIcon } from './notice-icon';\nimport styles from './styles.module.css';\nimport type { ButtonProps } from '../button/types';\nimport type { NoticeColor, NoticeProps } from './types';\n\nconst ButtonColorMap: Record<NoticeColor, ButtonProps['color']> = {\n  normal: 'mono-bold',\n  advisory: 'mono-bold',\n  info: 'mono-bold',\n  serious: 'serious',\n  critical: 'critical',\n};\n\n/**\n * Notice - Notification component for temporary messages and alerts\n *\n * Displays messages with optional action buttons and close functionality.\n * Icons are automatically displayed based on the color variant.\n *\n * @example\n * ```tsx\n * <Notice\n *   id=\"notice-1\"\n *   message=\"Operation completed\"\n *   color=\"normal\"\n * />\n * ```\n *\n * @param props - {@link NoticeProps}\n * @param props.id - Unique identifier for the notice.\n * @param props.classNames - CSS class names for notice elements.\n * @param props.color - Color variant indicating severity.\n * @param props.message - Message text to display.\n * @param props.primary - Primary action button configuration.\n * @param props.secondary - Secondary action button configuration.\n * @param props.hideIcon - Whether to hide the status icon.\n * @param props.showClose - Whether to show the close button.\n * @param props.shouldCloseOnAction - Whether to close the notice when an action button is pressed.\n * @param props.size - Size variant for the notice.\n * @param props.onPrimaryAction - Callback when primary action button is pressed.\n * @param props.onSecondaryAction - Callback when secondary action button is pressed.\n * @param props.onClose - Callback when the notice is closed.\n * @returns The rendered Notice component.\n */\nexport function Notice({\n  id,\n  classNames,\n  color = 'info',\n  message,\n  primary,\n  secondary,\n  metadata,\n  hideIcon,\n  showClose,\n  shouldCloseOnAction,\n  size = 'medium',\n  onPrimaryAction,\n  onSecondaryAction,\n  onClose,\n}: NoticeProps) {\n  return (\n    <Toast\n      className={clsx('group/notice', styles.notice, classNames?.notice)}\n      toast={{ key: id, content: message, onClose }}\n      data-color={color}\n      data-size={size}\n      style={{ viewTransitionName: id }}\n    >\n      <ToastContent className={clsx(styles.content, classNames?.content)}>\n        {!hideIcon && size === 'medium' && (\n          <NoticeIcon color={color} size={size} />\n        )}\n        <Text\n          slot='description'\n          className={clsx(styles.message, classNames?.message)}\n        >\n          {message}\n        </Text>\n        {(primary || secondary) && (\n          <div className={clsx(styles.actions, classNames?.actions)}>\n            {primary && (\n              <Button\n                color={ButtonColorMap[color]}\n                variant='filled'\n                {...primary}\n                size={size}\n                onPress={() => {\n                  onPrimaryAction?.(metadata);\n\n                  if (shouldCloseOnAction) {\n                    onClose?.();\n                  }\n                }}\n              />\n            )}\n            {secondary && (\n              <Button\n                color={ButtonColorMap[color]}\n                variant='outline'\n                {...secondary}\n                size={size}\n                onPress={() => {\n                  onSecondaryAction?.(metadata);\n\n                  if (shouldCloseOnAction) {\n                    onClose?.();\n                  }\n                }}\n              />\n            )}\n          </div>\n        )}\n        {showClose && (\n          <Button\n            color={ButtonColorMap[color]}\n            variant='icon'\n            onPress={onClose}\n          >\n            <Icon>\n              <Cancel />\n            </Icon>\n          </Button>\n        )}\n      </ToastContent>\n    </Toast>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,MAAMA,iBAA4D;CAChE,QAAQ;CACR,UAAU;CACV,MAAM;CACN,SAAS;CACT,UAAU;CACX;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCD,SAAgB,OAAO,EACrB,IACA,YACA,QAAQ,QACR,SACA,SACA,WACA,UACA,UACA,WACA,qBACA,OAAO,UACP,iBACA,mBACA,WACc;AACd,QACE,oBAACC;EACC,WAAW,KAAK,gBAAgB,OAAO,QAAQ,YAAY,OAAO;EAClE,OAAO;GAAE,KAAK;GAAI,SAAS;GAAS;GAAS;EAC7C,cAAY;EACZ,aAAW;EACX,OAAO,EAAE,oBAAoB,IAAI;YAEjC,qBAACC;GAAa,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;;IAC/D,CAAC,YAAY,SAAS,YACrB,oBAAC;KAAkB;KAAa;MAAQ;IAE1C,oBAAC;KACC,MAAK;KACL,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;eAEnD;MACI;KACL,WAAW,cACX,qBAAC;KAAI,WAAW,KAAK,OAAO,SAAS,YAAY,QAAQ;gBACtD,WACC,oBAAC;MACC,OAAO,eAAe;MACtB,SAAQ;MACR,GAAI;MACE;MACN,eAAe;AACb,yBAAkB,SAAS;AAE3B,WAAI,oBACF,YAAW;;OAGf,EAEH,aACC,oBAAC;MACC,OAAO,eAAe;MACtB,SAAQ;MACR,GAAI;MACE;MACN,eAAe;AACb,2BAAoB,SAAS;AAE7B,WAAI,oBACF,YAAW;;OAGf;MAEA;IAEP,aACC,oBAAC;KACC,OAAO,eAAe;KACtB,SAAQ;KACR,SAAS;eAET,oBAAC,kBACC,oBAAC,WAAS,GACL;MACA;;IAEE;GACT"}

package/dist/components/notice/list.d.ts

@@ -12,7 +12,7 @@
 
 import { NoticeListProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime80 from "react/jsx-runtime";
+import * as react_jsx_runtime161 from "react/jsx-runtime";
 
 //#region src/components/notice/list.d.ts
 
@@ -55,7 +55,7 @@ declare function NoticeList({
   placement,
   size,
   ...rest
-}: NoticeListProps): react_jsx_runtime80.JSX.Element;
+}: NoticeListProps): react_jsx_runtime161.JSX.Element;
 //#endregion
 export { NoticeList };
 //# sourceMappingURL=list.d.ts.map

package/dist/components/notice/list.js

@@ -16,7 +16,7 @@
 import { Button } from "../button/index.js";
 import { NoticeEventTypes } from "./events.js";
 import { Notice } from "./index.js";
-import { matchesMetadata } from "./utils.js";
+import { matchesDequeueFilter } from "./utils.js";
 import "client-only";
 import { createElement, useEffect, useMemo, useRef, useState } from "react";
 import { clsx } from "@accelint/design-foundation/lib/utils";
@@ -90,7 +90,7 @@ function NoticeList({ id, classNames, defaultColor, defaultTimeout, hideClearAll
 	});
 	useOn$1(NoticeEventTypes.dequeue, (data) => {
 		const queuedNotices = queue.queue;
-		const dequeue = queuedNotices.filter((toast) => matchesMetadata(data.payload, toast.content));
+		const dequeue = queuedNotices.filter((toast) => matchesDequeueFilter(data.payload, toast.content));
 		if (dequeue.length && dequeue.length === queuedNotices.length) queue.clear();
 		else for (const toast of dequeue) queue.close(toast.key);
 	});
@@ -110,12 +110,21 @@ function NoticeList({ id, classNames, defaultColor, defaultTimeout, hideClearAll
 			showClose: !(toast.timeout && toast.content.primary && toast.content.secondary),
 			classNames: classNames?.notice,
 			size,
-			onPrimaryAction: () => emitActionPrimary({ id: toast.content.id }),
-			onSecondaryAction: () => emitActionSecondary({ id: toast.content.id }),
+			onPrimaryAction: () => emitActionPrimary({
+				id: toast.content.id,
+				metadata: toast.content.metadata
+			}),
+			onSecondaryAction: () => emitActionSecondary({
+				id: toast.content.id,
+				metadata: toast.content.metadata
+			}),
 			onClose: () => {
 				toast.onClose?.();
 				queue.close(toast.key);
-				emitClose({ id: toast.content.id });
+				emitClose({
+					id: toast.content.id,
+					metadata: toast.content.metadata
+				});
 			}
 		})
 	})] });

package/dist/components/notice/list.js.map

@@ -1 +1 @@
-{"version":3,"file":"list.js","names":["ToastQueue","useEmit","ToastList","ToastRegion","ToastStateContext"],"sources":["../../../src/components/notice/list.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. 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 https://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'use client';\n\nimport { useBus } from '@accelint/bus/react';\nimport { uuid } from '@accelint/core';\nimport { useToastRegion } from 'react-aria/useToast';\nimport { useToastQueue } from 'react-stately/useToastState';\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { flushSync } from 'react-dom';\nimport {\n  type QueuedToast,\n  UNSTABLE_ToastList as ToastList,\n  UNSTABLE_ToastQueue as ToastQueue,\n  UNSTABLE_ToastRegion as ToastRegion,\n  UNSTABLE_ToastStateContext as ToastStateContext,\n} from 'react-aria-components/Toast';\nimport { Button } from '../button';\nimport { Notice } from './';\nimport { NoticeEventTypes } from './events';\nimport styles from './styles.module.css';\nimport { matchesMetadata } from './utils';\nimport type {\n  NoticeActionEvent,\n  NoticeContent,\n  NoticeDequeueEvent,\n  NoticeListProps,\n  NoticeQueueEvent,\n} from './types';\nimport { composeRenderProps } from 'react-aria-components/composeRenderProps';\n\n/**\n * NoticeList - Queue manager for displaying multiple notices\n *\n * Manages a FIFO queue of notices with automatic timeout and dismissal.\n * New notices push out older ones when the limit is reached.\n * Uses event-driven communication via the bus system.\n *\n * @example\n * ```tsx\n * <NoticeList\n *   aria-label=\"notifications\"\n *   placement=\"top right\"\n *   limit={3}\n * />\n * ```\n *\n * @param props - {@link NoticeListProps}\n * @param props.id - Unique identifier for targeting notices to this list.\n * @param props.classNames - CSS class names for list elements.\n * @param props.defaultColor - Default color for notices without explicit color.\n * @param props.defaultTimeout - Default timeout for notices without explicit timeout.\n * @param props.hideClearAll - Whether to hide the \"Clear All\" button.\n * @param props.limit - Maximum number of visible notices.\n * @param props.global - Whether to use global ToastRegion for portal rendering.\n * @param props.placement - Position of the notice list on screen.\n * @param props.size - Size variant for notices in the list.\n * @returns The rendered NoticeList component.\n */\nexport function NoticeList({\n  id,\n  classNames,\n  defaultColor,\n  defaultTimeout,\n  hideClearAll,\n  limit = 3,\n  global,\n  placement,\n  size = 'medium',\n  ...rest\n}: NoticeListProps) {\n  const queue = useMemo(\n    () =>\n      new ToastQueue<NoticeContent>({\n        maxVisibleToasts: limit,\n        wrapUpdate(fn) {\n          if ('startViewTransition' in document) {\n            document.startViewTransition(() => {\n              flushSync(fn);\n            });\n          } else {\n            fn();\n          }\n        },\n      }),\n    [limit],\n  );\n  const state = useToastQueue(queue);\n\n  const [hasNotices, setHasNotices] = useState(false);\n  const ref = useRef(null);\n  const { regionProps } = useToastRegion(rest, queue, ref);\n\n  const { useEmit, useOn } = useBus<\n    NoticeQueueEvent | NoticeDequeueEvent | NoticeActionEvent\n  >();\n  const emitActionPrimary = useEmit(NoticeEventTypes.actionPrimary);\n  const emitActionSecondary = useEmit(NoticeEventTypes.actionSecondary);\n  const emitClose = useEmit(NoticeEventTypes.close);\n\n  useOn(NoticeEventTypes.queue, (data) => {\n    if (id ? data.payload.target === id : !data.payload.target) {\n      const timeout = data.payload.timeout ?? defaultTimeout;\n      queue.add(\n        {\n          ...data.payload,\n          id: data.payload.id || uuid(),\n          color: data.payload.color || defaultColor,\n        },\n        {\n          timeout,\n        },\n      );\n      if (timeout) {\n        queue.resumeAll();\n      }\n    }\n  });\n\n  useOn(NoticeEventTypes.dequeue, (data) => {\n    // @ts-expect-error : queue.queue exists, but is not currently documented\n    const queuedNotices = queue.queue;\n\n    const dequeue = queuedNotices.filter((toast: QueuedToast<NoticeContent>) =>\n      matchesMetadata(data.payload, toast.content),\n    );\n\n    if (dequeue.length && dequeue.length === queuedNotices.length) {\n      queue.clear();\n    } else {\n      for (const toast of dequeue) {\n        queue.close(toast.key);\n      }\n    }\n  });\n\n  useEffect(\n    () =>\n      queue.subscribe(() => {\n        setHasNotices(queue.visibleToasts.length > 0);\n      }),\n    [queue],\n  );\n\n  const children = (\n    <>\n      {!hideClearAll && hasNotices && (\n        <Button\n          className={composeRenderProps(\n            classNames?.button,\n            (className) => className ?? '',\n          )}\n          variant='outline'\n          onPress={() => queue.clear()}\n        >\n          Clear All\n        </Button>\n      )}\n      <ToastList\n        className={composeRenderProps(classNames?.list, (className) =>\n          clsx(styles.list, className),\n        )}\n      >\n        {({ toast }: { toast: QueuedToast<NoticeContent> }) => (\n          <Notice\n            {...toast.content}\n            key={toast.key}\n            showClose={\n              !(\n                toast.timeout &&\n                toast.content.primary &&\n                toast.content.secondary\n              )\n            }\n            classNames={classNames?.notice}\n            size={size}\n            onPrimaryAction={() => emitActionPrimary({ id: toast.content.id })}\n            onSecondaryAction={() =>\n              emitActionSecondary({ id: toast.content.id })\n            }\n            onClose={() => {\n              toast.onClose?.();\n              queue.close(toast.key);\n              emitClose({ id: toast.content.id });\n            }}\n          />\n        )}\n      </ToastList>\n    </>\n  );\n\n  return global ? (\n    <ToastRegion\n      className={clsx('group/region', styles.region, classNames?.region)}\n      data-placement={placement}\n      queue={queue}\n    >\n      {children}\n    </ToastRegion>\n  ) : (\n    <div\n      {...regionProps}\n      className={clsx('group/region', styles.region, classNames?.region)}\n      data-placement={placement}\n      ref={ref}\n    >\n      <ToastStateContext.Provider value={state}>\n        {children}\n      </ToastStateContext.Provider>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEA,SAAgB,WAAW,EACzB,IACA,YACA,cACA,gBACA,cACA,QAAQ,GACR,QACA,WACA,OAAO,UACP,GAAG,QACe;CAClB,MAAM,QAAQ,cAEV,IAAIA,oBAA0B;EAC5B,kBAAkB;EAClB,WAAW,IAAI;AACb,OAAI,yBAAyB,SAC3B,UAAS,0BAA0B;AACjC,cAAU,GAAG;KACb;OAEF,KAAI;;EAGT,CAAC,EACJ,CAAC,MAAM,CACR;CACD,MAAM,QAAQ,cAAc,MAAM;CAElC,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,MAAM,OAAO,KAAK;CACxB,MAAM,EAAE,gBAAgB,eAAe,MAAM,OAAO,IAAI;CAExD,MAAM,EAAE,oBAAS,mBAAU,QAExB;CACH,MAAM,oBAAoBC,UAAQ,iBAAiB,cAAc;CACjE,MAAM,sBAAsBA,UAAQ,iBAAiB,gBAAgB;CACrE,MAAM,YAAYA,UAAQ,iBAAiB,MAAM;AAEjD,SAAM,iBAAiB,QAAQ,SAAS;AACtC,MAAI,KAAK,KAAK,QAAQ,WAAW,KAAK,CAAC,KAAK,QAAQ,QAAQ;GAC1D,MAAM,UAAU,KAAK,QAAQ,WAAW;AACxC,SAAM,IACJ;IACE,GAAG,KAAK;IACR,IAAI,KAAK,QAAQ,MAAM,MAAM;IAC7B,OAAO,KAAK,QAAQ,SAAS;IAC9B,EACD,EACE,SACD,CACF;AACD,OAAI,QACF,OAAM,WAAW;;GAGrB;AAEF,SAAM,iBAAiB,UAAU,SAAS;EAExC,MAAM,gBAAgB,MAAM;EAE5B,MAAM,UAAU,cAAc,QAAQ,UACpC,gBAAgB,KAAK,SAAS,MAAM,QAAQ,CAC7C;AAED,MAAI,QAAQ,UAAU,QAAQ,WAAW,cAAc,OACrD,OAAM,OAAO;MAEb,MAAK,MAAM,SAAS,QAClB,OAAM,MAAM,MAAM,IAAI;GAG1B;AAEF,iBAEI,MAAM,gBAAgB;AACpB,gBAAc,MAAM,cAAc,SAAS,EAAE;GAC7C,EACJ,CAAC,MAAM,CACR;CAED,MAAM,WACJ,8CACG,CAAC,gBAAgB,cAChB,oBAAC;EACC,WAAW,mBACT,YAAY,SACX,cAAc,aAAa,GAC7B;EACD,SAAQ;EACR,eAAe,MAAM,OAAO;YAC7B;GAEQ,EAEX,oBAACC;EACC,WAAW,mBAAmB,YAAY,OAAO,cAC/C,KAAK,OAAO,MAAM,UAAU,CAC7B;aAEC,EAAE,YACF,8BAAC;GACC,GAAI,MAAM;GACV,KAAK,MAAM;GACX,WACE,EACE,MAAM,WACN,MAAM,QAAQ,WACd,MAAM,QAAQ;GAGlB,YAAY,YAAY;GAClB;GACN,uBAAuB,kBAAkB,EAAE,IAAI,MAAM,QAAQ,IAAI,CAAC;GAClE,yBACE,oBAAoB,EAAE,IAAI,MAAM,QAAQ,IAAI,CAAC;GAE/C,eAAe;AACb,UAAM,WAAW;AACjB,UAAM,MAAM,MAAM,IAAI;AACtB,cAAU,EAAE,IAAI,MAAM,QAAQ,IAAI,CAAC;;IAErC;GAEM,IACX;AAGL,QAAO,SACL,oBAACC;EACC,WAAW,KAAK,gBAAgB,OAAO,QAAQ,YAAY,OAAO;EAClE,kBAAgB;EACT;EAEN;GACW,GAEd,oBAAC;EACC,GAAI;EACJ,WAAW,KAAK,gBAAgB,OAAO,QAAQ,YAAY,OAAO;EAClE,kBAAgB;EACX;YAEL,oBAACC,2BAAkB;GAAS,OAAO;GAChC;IAC0B;GACzB"}
+{"version":3,"file":"list.js","names":["ToastQueue","useEmit","ToastList","ToastRegion","ToastStateContext"],"sources":["../../../src/components/notice/list.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. 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 https://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'use client';\n\nimport { useBus } from '@accelint/bus/react';\nimport { uuid } from '@accelint/core';\nimport { useToastRegion } from 'react-aria/useToast';\nimport { useToastQueue } from 'react-stately/useToastState';\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { flushSync } from 'react-dom';\nimport {\n  type QueuedToast,\n  UNSTABLE_ToastList as ToastList,\n  UNSTABLE_ToastQueue as ToastQueue,\n  UNSTABLE_ToastRegion as ToastRegion,\n  UNSTABLE_ToastStateContext as ToastStateContext,\n} from 'react-aria-components/Toast';\nimport { Button } from '../button';\nimport { Notice } from './';\nimport { NoticeEventTypes } from './events';\nimport styles from './styles.module.css';\nimport { matchesDequeueFilter } from './utils';\nimport type {\n  NoticeActionEvent,\n  NoticeContent,\n  NoticeDequeueEvent,\n  NoticeListProps,\n  NoticeQueueEvent,\n} from './types';\nimport { composeRenderProps } from 'react-aria-components/composeRenderProps';\n\n/**\n * NoticeList - Queue manager for displaying multiple notices\n *\n * Manages a FIFO queue of notices with automatic timeout and dismissal.\n * New notices push out older ones when the limit is reached.\n * Uses event-driven communication via the bus system.\n *\n * @example\n * ```tsx\n * <NoticeList\n *   aria-label=\"notifications\"\n *   placement=\"top right\"\n *   limit={3}\n * />\n * ```\n *\n * @param props - {@link NoticeListProps}\n * @param props.id - Unique identifier for targeting notices to this list.\n * @param props.classNames - CSS class names for list elements.\n * @param props.defaultColor - Default color for notices without explicit color.\n * @param props.defaultTimeout - Default timeout for notices without explicit timeout.\n * @param props.hideClearAll - Whether to hide the \"Clear All\" button.\n * @param props.limit - Maximum number of visible notices.\n * @param props.global - Whether to use global ToastRegion for portal rendering.\n * @param props.placement - Position of the notice list on screen.\n * @param props.size - Size variant for notices in the list.\n * @returns The rendered NoticeList component.\n */\nexport function NoticeList({\n  id,\n  classNames,\n  defaultColor,\n  defaultTimeout,\n  hideClearAll,\n  limit = 3,\n  global,\n  placement,\n  size = 'medium',\n  ...rest\n}: NoticeListProps) {\n  const queue = useMemo(\n    () =>\n      new ToastQueue<NoticeContent>({\n        maxVisibleToasts: limit,\n        wrapUpdate(fn) {\n          if ('startViewTransition' in document) {\n            document.startViewTransition(() => {\n              flushSync(fn);\n            });\n          } else {\n            fn();\n          }\n        },\n      }),\n    [limit],\n  );\n  const state = useToastQueue(queue);\n\n  const [hasNotices, setHasNotices] = useState(false);\n  const ref = useRef(null);\n  const { regionProps } = useToastRegion(rest, queue, ref);\n\n  const { useEmit, useOn } = useBus<\n    NoticeQueueEvent | NoticeDequeueEvent | NoticeActionEvent\n  >();\n  const emitActionPrimary = useEmit(NoticeEventTypes.actionPrimary);\n  const emitActionSecondary = useEmit(NoticeEventTypes.actionSecondary);\n  const emitClose = useEmit(NoticeEventTypes.close);\n\n  useOn(NoticeEventTypes.queue, (data) => {\n    if (id ? data.payload.target === id : !data.payload.target) {\n      const timeout = data.payload.timeout ?? defaultTimeout;\n      queue.add(\n        {\n          ...data.payload,\n          id: data.payload.id || uuid(),\n          color: data.payload.color || defaultColor,\n        },\n        {\n          timeout,\n        },\n      );\n      if (timeout) {\n        queue.resumeAll();\n      }\n    }\n  });\n\n  useOn(NoticeEventTypes.dequeue, (data) => {\n    // @ts-expect-error : queue.queue exists, but is not currently documented\n    const queuedNotices = queue.queue;\n\n    const dequeue = queuedNotices.filter((toast: QueuedToast<NoticeContent>) =>\n      matchesDequeueFilter(data.payload, toast.content),\n    );\n\n    if (dequeue.length && dequeue.length === queuedNotices.length) {\n      queue.clear();\n    } else {\n      for (const toast of dequeue) {\n        queue.close(toast.key);\n      }\n    }\n  });\n\n  useEffect(\n    () =>\n      queue.subscribe(() => {\n        setHasNotices(queue.visibleToasts.length > 0);\n      }),\n    [queue],\n  );\n\n  const children = (\n    <>\n      {!hideClearAll && hasNotices && (\n        <Button\n          className={composeRenderProps(\n            classNames?.button,\n            (className) => className ?? '',\n          )}\n          variant='outline'\n          onPress={() => queue.clear()}\n        >\n          Clear All\n        </Button>\n      )}\n      <ToastList\n        className={composeRenderProps(classNames?.list, (className) =>\n          clsx(styles.list, className),\n        )}\n      >\n        {({ toast }: { toast: QueuedToast<NoticeContent> }) => (\n          <Notice\n            {...toast.content}\n            key={toast.key}\n            showClose={\n              !(\n                toast.timeout &&\n                toast.content.primary &&\n                toast.content.secondary\n              )\n            }\n            classNames={classNames?.notice}\n            size={size}\n            onPrimaryAction={() =>\n              emitActionPrimary({\n                id: toast.content.id,\n                metadata: toast.content.metadata,\n              })\n            }\n            onSecondaryAction={() =>\n              emitActionSecondary({\n                id: toast.content.id,\n                metadata: toast.content.metadata,\n              })\n            }\n            onClose={() => {\n              toast.onClose?.();\n              queue.close(toast.key);\n              emitClose({\n                id: toast.content.id,\n                metadata: toast.content.metadata,\n              });\n            }}\n          />\n        )}\n      </ToastList>\n    </>\n  );\n\n  return global ? (\n    <ToastRegion\n      className={clsx('group/region', styles.region, classNames?.region)}\n      data-placement={placement}\n      queue={queue}\n    >\n      {children}\n    </ToastRegion>\n  ) : (\n    <div\n      {...regionProps}\n      className={clsx('group/region', styles.region, classNames?.region)}\n      data-placement={placement}\n      ref={ref}\n    >\n      <ToastStateContext.Provider value={state}>\n        {children}\n      </ToastStateContext.Provider>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEA,SAAgB,WAAW,EACzB,IACA,YACA,cACA,gBACA,cACA,QAAQ,GACR,QACA,WACA,OAAO,UACP,GAAG,QACe;CAClB,MAAM,QAAQ,cAEV,IAAIA,oBAA0B;EAC5B,kBAAkB;EAClB,WAAW,IAAI;AACb,OAAI,yBAAyB,SAC3B,UAAS,0BAA0B;AACjC,cAAU,GAAG;KACb;OAEF,KAAI;;EAGT,CAAC,EACJ,CAAC,MAAM,CACR;CACD,MAAM,QAAQ,cAAc,MAAM;CAElC,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,MAAM,OAAO,KAAK;CACxB,MAAM,EAAE,gBAAgB,eAAe,MAAM,OAAO,IAAI;CAExD,MAAM,EAAE,oBAAS,mBAAU,QAExB;CACH,MAAM,oBAAoBC,UAAQ,iBAAiB,cAAc;CACjE,MAAM,sBAAsBA,UAAQ,iBAAiB,gBAAgB;CACrE,MAAM,YAAYA,UAAQ,iBAAiB,MAAM;AAEjD,SAAM,iBAAiB,QAAQ,SAAS;AACtC,MAAI,KAAK,KAAK,QAAQ,WAAW,KAAK,CAAC,KAAK,QAAQ,QAAQ;GAC1D,MAAM,UAAU,KAAK,QAAQ,WAAW;AACxC,SAAM,IACJ;IACE,GAAG,KAAK;IACR,IAAI,KAAK,QAAQ,MAAM,MAAM;IAC7B,OAAO,KAAK,QAAQ,SAAS;IAC9B,EACD,EACE,SACD,CACF;AACD,OAAI,QACF,OAAM,WAAW;;GAGrB;AAEF,SAAM,iBAAiB,UAAU,SAAS;EAExC,MAAM,gBAAgB,MAAM;EAE5B,MAAM,UAAU,cAAc,QAAQ,UACpC,qBAAqB,KAAK,SAAS,MAAM,QAAQ,CAClD;AAED,MAAI,QAAQ,UAAU,QAAQ,WAAW,cAAc,OACrD,OAAM,OAAO;MAEb,MAAK,MAAM,SAAS,QAClB,OAAM,MAAM,MAAM,IAAI;GAG1B;AAEF,iBAEI,MAAM,gBAAgB;AACpB,gBAAc,MAAM,cAAc,SAAS,EAAE;GAC7C,EACJ,CAAC,MAAM,CACR;CAED,MAAM,WACJ,8CACG,CAAC,gBAAgB,cAChB,oBAAC;EACC,WAAW,mBACT,YAAY,SACX,cAAc,aAAa,GAC7B;EACD,SAAQ;EACR,eAAe,MAAM,OAAO;YAC7B;GAEQ,EAEX,oBAACC;EACC,WAAW,mBAAmB,YAAY,OAAO,cAC/C,KAAK,OAAO,MAAM,UAAU,CAC7B;aAEC,EAAE,YACF,8BAAC;GACC,GAAI,MAAM;GACV,KAAK,MAAM;GACX,WACE,EACE,MAAM,WACN,MAAM,QAAQ,WACd,MAAM,QAAQ;GAGlB,YAAY,YAAY;GAClB;GACN,uBACE,kBAAkB;IAChB,IAAI,MAAM,QAAQ;IAClB,UAAU,MAAM,QAAQ;IACzB,CAAC;GAEJ,yBACE,oBAAoB;IAClB,IAAI,MAAM,QAAQ;IAClB,UAAU,MAAM,QAAQ;IACzB,CAAC;GAEJ,eAAe;AACb,UAAM,WAAW;AACjB,UAAM,MAAM,MAAM,IAAI;AACtB,cAAU;KACR,IAAI,MAAM,QAAQ;KAClB,UAAU,MAAM,QAAQ;KACzB,CAAC;;IAEJ;GAEM,IACX;AAGL,QAAO,SACL,oBAACC;EACC,WAAW,KAAK,gBAAgB,OAAO,QAAQ,YAAY,OAAO;EAClE,kBAAgB;EACT;EAEN;GACW,GAEd,oBAAC;EACC,GAAI;EACJ,WAAW,KAAK,gBAAgB,OAAO,QAAQ,YAAY,OAAO;EAClE,kBAAgB;EACX;YAEL,oBAACC,2BAAkB;GAAS,OAAO;GAChC;IAC0B;GACzB"}

package/dist/components/notice/notice-icon.d.ts

@@ -12,7 +12,7 @@
 
 import { NoticeIconProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime82 from "react/jsx-runtime";
+import * as react_jsx_runtime125 from "react/jsx-runtime";
 
 //#region src/components/notice/notice-icon.d.ts
 
@@ -38,7 +38,7 @@ import * as react_jsx_runtime82 from "react/jsx-runtime";
 declare function NoticeIcon({
   color,
   size
-}: NoticeIconProps): react_jsx_runtime82.JSX.Element;
+}: NoticeIconProps): react_jsx_runtime125.JSX.Element;
 //#endregion
 export { NoticeIcon };
 //# sourceMappingURL=notice-icon.d.ts.map

package/dist/components/notice/types.d.ts

@@ -89,7 +89,7 @@ type NoticeListProps = {
 /**
  * Props for the Notice component.
  */
-type NoticeProps = Omit<NoticeContent, 'metadata' | 'timeout' | 'target'> & {
+type NoticeProps = Omit<NoticeContent, 'timeout' | 'target'> & {
   /** Unique identifier for the notice. */
   id: UniqueId;
   /** CSS class names for notice elements. */
@@ -111,10 +111,10 @@ type NoticeProps = Omit<NoticeContent, 'metadata' | 'timeout' | 'target'> & {
   shouldCloseOnAction?: boolean;
   /** Size variant for the notice. */
   size?: 'small' | 'medium';
-  /** Callback when primary action button is pressed. */
-  onPrimaryAction?: () => void;
-  /** Callback when secondary action button is pressed. */
-  onSecondaryAction?: () => void;
+  /** Callback when primary action button is pressed. Receives metadata for context. */
+  onPrimaryAction?: (metadata?: NoticeContent['metadata']) => void;
+  /** Callback when secondary action button is pressed. Receives metadata for context. */
+  onSecondaryAction?: (metadata?: NoticeContent['metadata']) => void;
   /** Callback when the notice is closed. */
   onClose?: () => void;
 };
@@ -138,6 +138,7 @@ type NoticeDequeueEvent = Payload<typeof NoticeEventTypes.dequeue, {
  */
 type NoticeActionEvent = Payload<typeof NoticeEventTypes.actionPrimary | typeof NoticeEventTypes.actionSecondary | typeof NoticeEventTypes.close, {
   id: UniqueId;
+  metadata?: Record<string, StructuredCloneableData>;
 }>;
 //#endregion
 export { NoticeActionEvent, NoticeColor, NoticeContent, NoticeDequeueEvent, NoticeIconProps, NoticeListProps, NoticeProps, NoticeQueueEvent };

package/dist/components/notice/utils.d.ts

@@ -10,6 +10,7 @@
  * governing permissions and limitations under the License.
  */
 
+import { NoticeContent, NoticeDequeueEvent } from "./types.js";
 import "client-only";
 
 //#region src/components/notice/utils.d.ts
@@ -22,6 +23,15 @@ import "client-only";
  * @returns True if all payload entries match corresponding metadata entries.
  */
 declare function matchesMetadata(payload: Record<string, unknown>, metadata?: Record<string, unknown>): boolean;
+/**
+ * Checks if a dequeue payload matches a notice's content.
+ * Supports filtering by top-level fields (id, color, target) and nested metadata.
+ *
+ * @param dequeuePayload - Dequeue event payload with optional id, color, target, metadata.
+ * @param noticeContent - Notice content to match against.
+ * @returns True if all provided criteria match.
+ */
+declare function matchesDequeueFilter(dequeuePayload: NoticeDequeueEvent['payload'], noticeContent: NoticeContent): boolean;
 //#endregion
-export { matchesMetadata };
+export { matchesDequeueFilter, matchesMetadata };
 //# sourceMappingURL=utils.d.ts.map

package/dist/components/notice/utils.js

@@ -29,7 +29,22 @@ function matchesMetadata(payload, metadata) {
 	if (!metadata) return false;
 	return Object.entries(payload).every(([key, value]) => key in metadata && isEqual(metadata[key], value));
 }
+/**
+* Checks if a dequeue payload matches a notice's content.
+* Supports filtering by top-level fields (id, color, target) and nested metadata.
+*
+* @param dequeuePayload - Dequeue event payload with optional id, color, target, metadata.
+* @param noticeContent - Notice content to match against.
+* @returns True if all provided criteria match.
+*/
+function matchesDequeueFilter(dequeuePayload, noticeContent) {
+	if (dequeuePayload.id && dequeuePayload.id !== noticeContent.id) return false;
+	if (dequeuePayload.target && dequeuePayload.target !== noticeContent.target) return false;
+	if (dequeuePayload.color && dequeuePayload.color !== noticeContent.color) return false;
+	if (!dequeuePayload.metadata) return true;
+	return matchesMetadata(dequeuePayload.metadata, noticeContent.metadata);
+}
 
 //#endregion
-export { matchesMetadata };
+export { matchesDequeueFilter, matchesMetadata };
 //# sourceMappingURL=utils.js.map

package/dist/components/notice/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/notice/utils.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. 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 https://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'use client';\n\nimport 'client-only';\nimport { isEqual } from 'radashi';\n\n/**\n * Checks if a payload matches metadata on a notice.\n * Used for filtering notices during dequeue operations.\n *\n * @param payload - Object with key-value pairs to match against.\n * @param metadata - Metadata object from a notice to check.\n * @returns True if all payload entries match corresponding metadata entries.\n */\nexport function matchesMetadata(\n  payload: Record<string, unknown>,\n  metadata?: Record<string, unknown>,\n) {\n  if (!metadata) {\n    return false;\n  }\n\n  return Object.entries(payload).every(\n    ([key, value]) => key in metadata && isEqual(metadata[key], value),\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,SAAgB,gBACd,SACA,UACA;AACA,KAAI,CAAC,SACH,QAAO;AAGT,QAAO,OAAO,QAAQ,QAAQ,CAAC,OAC5B,CAAC,KAAK,WAAW,OAAO,YAAY,QAAQ,SAAS,MAAM,MAAM,CACnE"}
+{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/notice/utils.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. 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 https://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'use client';\n\nimport 'client-only';\nimport { isEqual } from 'radashi';\nimport type { NoticeContent, NoticeDequeueEvent } from './types';\n\n/**\n * Checks if a payload matches metadata on a notice.\n * Used for filtering notices during dequeue operations.\n *\n * @param payload - Object with key-value pairs to match against.\n * @param metadata - Metadata object from a notice to check.\n * @returns True if all payload entries match corresponding metadata entries.\n */\nexport function matchesMetadata(\n  payload: Record<string, unknown>,\n  metadata?: Record<string, unknown>,\n) {\n  if (!metadata) {\n    return false;\n  }\n\n  return Object.entries(payload).every(\n    ([key, value]) => key in metadata && isEqual(metadata[key], value),\n  );\n}\n\n/**\n * Checks if a dequeue payload matches a notice's content.\n * Supports filtering by top-level fields (id, color, target) and nested metadata.\n *\n * @param dequeuePayload - Dequeue event payload with optional id, color, target, metadata.\n * @param noticeContent - Notice content to match against.\n * @returns True if all provided criteria match.\n */\nexport function matchesDequeueFilter(\n  dequeuePayload: NoticeDequeueEvent['payload'],\n  noticeContent: NoticeContent,\n) {\n  // Match top-level id\n  if (dequeuePayload.id && dequeuePayload.id !== noticeContent.id) {\n    return false;\n  }\n\n  // Match top-level target\n  if (dequeuePayload.target && dequeuePayload.target !== noticeContent.target) {\n    return false;\n  }\n\n  // Match top-level color\n  if (dequeuePayload.color && dequeuePayload.color !== noticeContent.color) {\n    return false;\n  }\n\n  // Match metadata fields using existing matchesMetadata logic\n  if (!dequeuePayload.metadata) {\n    return true;\n  }\n\n  return matchesMetadata(dequeuePayload.metadata, noticeContent.metadata);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,SAAgB,gBACd,SACA,UACA;AACA,KAAI,CAAC,SACH,QAAO;AAGT,QAAO,OAAO,QAAQ,QAAQ,CAAC,OAC5B,CAAC,KAAK,WAAW,OAAO,YAAY,QAAQ,SAAS,MAAM,MAAM,CACnE;;;;;;;;;;AAWH,SAAgB,qBACd,gBACA,eACA;AAEA,KAAI,eAAe,MAAM,eAAe,OAAO,cAAc,GAC3D,QAAO;AAIT,KAAI,eAAe,UAAU,eAAe,WAAW,cAAc,OACnE,QAAO;AAIT,KAAI,eAAe,SAAS,eAAe,UAAU,cAAc,MACjE,QAAO;AAIT,KAAI,CAAC,eAAe,SAClB,QAAO;AAGT,QAAO,gBAAgB,eAAe,UAAU,cAAc,SAAS"}

package/dist/components/options/context.d.ts

@@ -12,12 +12,12 @@
 
 import { OptionsDataItem, OptionsProps } from "./types.js";
 import "client-only";
-import * as react24 from "react";
+import * as react41 from "react";
 import { ContextValue } from "react-aria-components/slots";
 
 //#region src/components/options/context.d.ts
 /** Context for sharing Options props with nested components */
-declare const OptionsContext: react24.Context<ContextValue<OptionsProps<OptionsDataItem>, HTMLDivElement>>;
+declare const OptionsContext: react41.Context<ContextValue<OptionsProps<OptionsDataItem>, HTMLDivElement>>;
 //#endregion
 export { OptionsContext };
 //# sourceMappingURL=context.d.ts.map

package/dist/components/options/index.d.ts

@@ -12,7 +12,7 @@
 
 import { OptionsDataItem, OptionsProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime174 from "react/jsx-runtime";
 
 //#region src/components/options/index.d.ts
 
@@ -73,7 +73,7 @@ import * as react_jsx_runtime0 from "react/jsx-runtime";
 declare function Options<T extends OptionsDataItem>({
   ref,
   ...props
-}: OptionsProps<T>): react_jsx_runtime0.JSX.Element;
+}: OptionsProps<T>): react_jsx_runtime174.JSX.Element;
 //#endregion
 export { Options };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/options/item-content.d.ts

@@ -10,7 +10,7 @@
  * governing permissions and limitations under the License.
  */
 
-import * as react_jsx_runtime87 from "react/jsx-runtime";
+import * as react_jsx_runtime167 from "react/jsx-runtime";
 import { TextProps } from "react-aria-components/Text";
 
 //#region src/components/options/item-content.d.ts
@@ -37,7 +37,7 @@ import { TextProps } from "react-aria-components/Text";
 declare function OptionsItemContent({
   className,
   ...rest
-}: TextProps): react_jsx_runtime87.JSX.Element;
+}: TextProps): react_jsx_runtime167.JSX.Element;
 //#endregion
 export { OptionsItemContent };
 //# sourceMappingURL=item-content.d.ts.map

package/dist/components/options/item-description.d.ts

@@ -10,7 +10,7 @@
  * governing permissions and limitations under the License.
  */
 
-import * as react_jsx_runtime89 from "react/jsx-runtime";
+import * as react_jsx_runtime169 from "react/jsx-runtime";
 import { TextProps } from "react-aria-components/Text";
 
 //#region src/components/options/item-description.d.ts
@@ -29,7 +29,7 @@ import { TextProps } from "react-aria-components/Text";
 declare function OptionsItemDescription({
   className,
   ...rest
-}: TextProps): react_jsx_runtime89.JSX.Element;
+}: TextProps): react_jsx_runtime169.JSX.Element;
 //#endregion
 export { OptionsItemDescription };
 //# sourceMappingURL=item-description.d.ts.map

package/dist/components/options/item-label.d.ts

@@ -10,7 +10,7 @@
  * governing permissions and limitations under the License.
  */
 
-import * as react_jsx_runtime91 from "react/jsx-runtime";
+import * as react_jsx_runtime170 from "react/jsx-runtime";
 import { TextProps } from "react-aria-components/Text";
 
 //#region src/components/options/item-label.d.ts
@@ -30,7 +30,7 @@ declare function OptionsItemLabel({
   className,
   children,
   ...rest
-}: TextProps): react_jsx_runtime91.JSX.Element;
+}: TextProps): react_jsx_runtime170.JSX.Element;
 //#endregion
 export { OptionsItemLabel };
 //# sourceMappingURL=item-label.d.ts.map

package/dist/components/options/item.d.ts

@@ -12,7 +12,7 @@
 
 import { OptionsDataItem, OptionsItemProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime97 from "react/jsx-runtime";
+import * as react_jsx_runtime126 from "react/jsx-runtime";
 
 //#region src/components/options/item.d.ts
 
@@ -43,7 +43,7 @@ declare function OptionsItem<T extends OptionsDataItem>({
   color,
   textValue,
   ...rest
-}: OptionsItemProps<T>): react_jsx_runtime97.JSX.Element;
+}: OptionsItemProps<T>): react_jsx_runtime126.JSX.Element;
 //#endregion
 export { OptionsItem };
 //# sourceMappingURL=item.d.ts.map

package/dist/components/options/section.d.ts

@@ -11,7 +11,7 @@
  */
 
 import { OptionsDataItem, OptionsSectionProps } from "./types.js";
-import * as react_jsx_runtime103 from "react/jsx-runtime";
+import * as react_jsx_runtime172 from "react/jsx-runtime";
 
 //#region src/components/options/section.d.ts
 
@@ -38,7 +38,7 @@ declare function OptionsSection<T extends OptionsDataItem>({
   classNames,
   header,
   items
-}: OptionsSectionProps<T>): react_jsx_runtime103.JSX.Element;
+}: OptionsSectionProps<T>): react_jsx_runtime172.JSX.Element;
 //#endregion
 export { OptionsSection };
 //# sourceMappingURL=section.d.ts.map

package/dist/components/pagination/context.d.ts

@@ -12,11 +12,11 @@
 
 import { PaginationContextValue } from "./types.js";
 import "client-only";
-import * as react25 from "react";
+import * as react39 from "react";
 
 //#region src/components/pagination/context.d.ts
 /** Context for sharing pagination state with sub-components */
-declare const PaginationContext: react25.Context<PaginationContextValue>;
+declare const PaginationContext: react39.Context<PaginationContextValue>;
 //#endregion
 export { PaginationContext };
 //# sourceMappingURL=context.d.ts.map

package/dist/components/pagination/index.d.ts

@@ -12,7 +12,7 @@
 
 import { PaginationProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime98 from "react/jsx-runtime";
+import * as react_jsx_runtime127 from "react/jsx-runtime";
 
 //#region src/components/pagination/index.d.ts
 
@@ -46,7 +46,7 @@ declare function Pagination({
   isLoading,
   onChange,
   ...rest
-}: PaginationProps): react_jsx_runtime98.JSX.Element;
+}: PaginationProps): react_jsx_runtime127.JSX.Element;
 //#endregion
 export { Pagination };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/pagination/next.d.ts

@@ -12,7 +12,7 @@
 
 import { PaginationNextProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime100 from "react/jsx-runtime";
+import * as react_jsx_runtime195 from "react/jsx-runtime";
 
 //#region src/components/pagination/next.d.ts
 /**
@@ -33,7 +33,7 @@ import * as react_jsx_runtime100 from "react/jsx-runtime";
 declare function PaginationNext({
   className,
   onPress
-}: PaginationNextProps): react_jsx_runtime100.JSX.Element;
+}: PaginationNextProps): react_jsx_runtime195.JSX.Element;
 //#endregion
 export { PaginationNext };
 //# sourceMappingURL=next.d.ts.map

package/dist/components/pagination/pages.d.ts

@@ -12,7 +12,7 @@
 
 import { PaginationPagesProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime102 from "react/jsx-runtime";
+import * as react_jsx_runtime157 from "react/jsx-runtime";
 
 //#region src/components/pagination/pages.d.ts
 
@@ -37,7 +37,7 @@ import * as react_jsx_runtime102 from "react/jsx-runtime";
 declare function PaginationPages({
   className,
   onPress
-}: PaginationPagesProps): react_jsx_runtime102.JSX.Element[] | null;
+}: PaginationPagesProps): react_jsx_runtime157.JSX.Element[] | null;
 //#endregion
 export { PaginationPages };
 //# sourceMappingURL=pages.d.ts.map

package/dist/components/pagination/prev.d.ts

@@ -12,7 +12,7 @@
 
 import { PaginationPrevProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime113 from "react/jsx-runtime";
+import * as react_jsx_runtime158 from "react/jsx-runtime";
 
 //#region src/components/pagination/prev.d.ts
 /**
@@ -33,7 +33,7 @@ import * as react_jsx_runtime113 from "react/jsx-runtime";
 declare function PaginationPrev({
   className,
   onPress
-}: PaginationPrevProps): react_jsx_runtime113.JSX.Element;
+}: PaginationPrevProps): react_jsx_runtime158.JSX.Element;
 //#endregion
 export { PaginationPrev };
 //# sourceMappingURL=prev.d.ts.map

package/dist/components/popover/content.d.ts

@@ -12,7 +12,7 @@
 
 import "client-only";
 import { ComponentPropsWithRef } from "react";
-import * as react_jsx_runtime146 from "react/jsx-runtime";
+import * as react_jsx_runtime162 from "react/jsx-runtime";
 
 //#region src/components/popover/content.d.ts
 
@@ -36,7 +36,7 @@ import * as react_jsx_runtime146 from "react/jsx-runtime";
 declare function PopoverContent({
   className,
   ...rest
-}: ComponentPropsWithRef<'div'>): react_jsx_runtime146.JSX.Element;
+}: ComponentPropsWithRef<'div'>): react_jsx_runtime162.JSX.Element;
 //#endregion
 export { PopoverContent };
 //# sourceMappingURL=content.d.ts.map

package/dist/components/popover/footer.d.ts

@@ -12,7 +12,7 @@
 
 import "client-only";
 import { ComponentPropsWithRef } from "react";
-import * as react_jsx_runtime147 from "react/jsx-runtime";
+import * as react_jsx_runtime160 from "react/jsx-runtime";
 
 //#region src/components/popover/footer.d.ts
 
@@ -38,7 +38,7 @@ import * as react_jsx_runtime147 from "react/jsx-runtime";
 declare function PopoverFooter({
   children,
   className
-}: ComponentPropsWithRef<'footer'>): react_jsx_runtime147.JSX.Element;
+}: ComponentPropsWithRef<'footer'>): react_jsx_runtime160.JSX.Element;
 //#endregion
 export { PopoverFooter };
 //# sourceMappingURL=footer.d.ts.map