@solid2-aria/stately 0.0.0-stage → 0.0.1

package/dist/table/table-utils.js

@@ -0,0 +1,203 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-stately/src/table/TableUtils.ts.
+ * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { requireValue } from "../utils/require-value.js";
+// src/table/table-utils.ts
+function isStatic(width) {
+	return width !== null && width !== void 0 && (!Number.isNaN(Number(width)) || /^(?<amount>\d+)(?=%$)/u.exec(String(width)) !== null);
+}
+function parseFractionalUnit(width) {
+	if (width === null || width === void 0 || width === "" || typeof width === "number") return 1;
+	const match = /^(?<amount>.+)(?=fr$)/u.exec(width);
+	if (!match) {
+		if (process.env.NODE_ENV !== "production") console.warn(`width: ${width} is not a supported format, width should be a number (ex. 150), percentage (ex. '50%') or fr unit (ex. '2fr')`, "defaulting to '1fr'");
+		return 1;
+	}
+	return Number(match[0]);
+}
+function parseStaticWidth(width, tableWidth) {
+	if (typeof width === "string") {
+		const match = /^(?<amount>\d+)(?=%$)/u.exec(width);
+		if (!match) throw new Error("Only percentages or numbers are supported for static column widths");
+		return tableWidth * (Number(match[0]) / 100);
+	}
+	return width;
+}
+function getMaxWidth(maxWidth, tableWidth) {
+	return maxWidth === null || maxWidth === void 0 ? Number.MAX_SAFE_INTEGER : parseStaticWidth(maxWidth, tableWidth);
+}
+function getMinWidth(minWidth, tableWidth) {
+	return minWidth === null || minWidth === void 0 ? 0 : parseStaticWidth(minWidth, tableWidth);
+}
+/**
+* Implements the flex algorithm described in https://www.w3.org/TR/css-flexbox-1/#layout-algorithm
+* It makes a few constraint/assumptions: 1. All basis values are 0 unless it is a static width,
+* then the basis is the static width 2. All flex grow and shrink values are equal to the FR
+* specified on the column, grow and shrink for the same column are equal 3. We only have one row An
+* example of the setup can be seen here https://jsfiddle.net/snowystinger/wv0ymjaf/61/ where I let
+* the browser figure out the flex of the columns. Note: We differ in one key aspect, all of our
+* column widths must be whole numbers, so we avoid browser sub pixel rounding errors. To do this,
+* we use a cascading rounding algorithm to ensure that the sum of the widths is maintained while
+* distributing the rounding remainder across the columns.
+*
+* As noted in the chrome source code, this algorithm is very accurate, but has the potential to be
+* quadratic. They have deemed this to be acceptable because the number of elements is usually small
+* and the flex factors are usually not high variance. I believe we can make the same assumptions.
+* Particularly once resizing is started, it will convert all columns to the left to static widths,
+* so it will cut down on the number of FR columns.
+*
+* There are likely faster ways to do this, I've chosen to stick to the spec as closely as possible
+* for readability, accuracy, and for the note that this behaving quadratically is unlikely to be a
+* problem.
+*
+* @param availableWidth - The visible width of the table.
+* @param columns - The table defined columns.
+* @param changedColumns - Any columns we want to override, for example, during resizing.
+* @param getDefaultWidth - A function that returns the default width of a column by its index.
+* @param getDefaultMinWidth - A function that returns the default min width of a column by its
+*   index.
+*/
+function calculateColumnSizes(initialAvailableWidth, columns, changedColumns, getDefaultWidth, getDefaultMinWidth) {
+	let availableWidth = initialAvailableWidth;
+	const originalWidth = availableWidth;
+	const flooredWidth = Math.floor(availableWidth);
+	const hasFractionalWidth = availableWidth - flooredWidth > 0;
+	availableWidth = flooredWidth;
+	let hasNonFrozenItems = false;
+	const flexItems = columns.map((column, index) => {
+		const width = changedColumns.get(column.key) === null || changedColumns.get(column.key) === void 0 ? column.width ?? column.defaultWidth ?? getDefaultWidth?.(index) ?? "1fr" : changedColumns.get(column.key) ?? "1fr";
+		let frozen = false;
+		let baseSize = 0;
+		let flex = 0;
+		let targetMainSize = 0;
+		if (isStatic(width)) {
+			baseSize = parseStaticWidth(width, availableWidth);
+			frozen = true;
+		} else {
+			flex = parseFractionalUnit(width);
+			if (flex <= 0) frozen = true;
+		}
+		const min = getMinWidth(column.minWidth ?? getDefaultMinWidth?.(index) ?? 0, availableWidth);
+		const max = getMaxWidth(column.maxWidth, availableWidth);
+		const hypotheticalMainSize = Math.max(min, Math.min(baseSize, max));
+		if (frozen) targetMainSize = hypotheticalMainSize;
+		else if (baseSize > hypotheticalMainSize) {
+			frozen = true;
+			targetMainSize = hypotheticalMainSize;
+		}
+		if (!frozen) hasNonFrozenItems = true;
+		return {
+			baseSize,
+			flex,
+			frozen,
+			hypotheticalMainSize,
+			max,
+			min,
+			targetMainSize,
+			violation: 0
+		};
+	});
+	while (hasNonFrozenItems) {
+		/**
+		* Calculate the remaining free space as for initial free space,
+		* above (9.7.3). If the sum of the unfrozen flex items’ flex factors is
+		* less than one, multiply the initial free space by this sum (of flex factors).
+		* If the magnitude of this value is less than the magnitude of
+		* the remaining free space, use this as the remaining free space.
+		*/
+		let usedWidth = 0;
+		let flexFactors = 0;
+		for (const item of flexItems) if (item.frozen) usedWidth += item.targetMainSize;
+		else {
+			usedWidth += item.baseSize;
+			flexFactors += item.flex;
+		}
+		const remainingFreeSpace = availableWidth - usedWidth;
+		/**
+		* If the remaining free space is zero
+		* - Do nothing.
+		* Else // remember, we're always in grow mode
+		* - Find the ratio of the item’s flex grow factor to the
+		* sum of the flex grow factors of all unfrozen items on
+		* the line. Set the item’s target main size to its flex
+		* base size plus a fraction of the remaining free space
+		* proportional to the ratio.
+		*/
+		if (remainingFreeSpace > 0) {
+			for (const item of flexItems) if (!item.frozen) {
+				const ratio = item.flex / flexFactors;
+				item.targetMainSize = item.baseSize + ratio * remainingFreeSpace;
+			}
+		}
+		/**
+		* Fix min/max violations. Clamp each non-frozen item’s
+		* target main size by its used min and max main sizes
+		* and floor its content-box size at zero. If the item’s
+		* target main size was made smaller by this, it’s a max
+		* violation. If the item’s target main size was made
+		* larger by this, it’s a min violation.
+		*/
+		let totalViolation = 0;
+		for (const item of flexItems) {
+			item.violation = 0;
+			if (!item.frozen) {
+				const { min, max, targetMainSize } = item;
+				item.targetMainSize = Math.max(min, Math.min(targetMainSize, max));
+				item.violation = item.targetMainSize - targetMainSize;
+				totalViolation += item.violation;
+			}
+		}
+		/**
+		* Freeze over-flexed items. The total violation is the
+		* sum of the adjustments from the previous step
+		* ∑(clamped size - unclamped size). If the total violation is:
+		* Zero
+		* - Freeze all items.
+		*
+		* Positive
+		* - Freeze all the items with min violations.
+		*
+		* Negative
+		* - Freeze all the items with max violations.
+		*/
+		hasNonFrozenItems = false;
+		for (const item of flexItems) if (totalViolation === 0 || Math.sign(totalViolation) === Math.sign(item.violation)) item.frozen = true;
+		else if (!item.frozen) hasNonFrozenItems = true;
+	}
+	const columnSizes = cascadeRounding(flexItems);
+	if (hasFractionalWidth && columnSizes.length > 0) {
+		const [, tableFractionalWidth] = originalWidth.toString().split(".");
+		const columnWidth = requireValue(columnSizes.at(-1), "Expected columnSizes.at(-1) to exist.").toString();
+		columnSizes[columnSizes.length - 1] = Number(`${columnWidth}.${tableFractionalWidth}`);
+	}
+	return columnSizes;
+}
+function cascadeRounding(flexItems) {
+	let fpTotal = 0;
+	let intTotal = 0;
+	const roundedArray = [];
+	for (const item of flexItems) {
+		const float = item.targetMainSize;
+		const integer = Math.round(float + fpTotal) - intTotal;
+		fpTotal += float;
+		intTotal += integer;
+		roundedArray.push(integer);
+	}
+	return roundedArray;
+}
+export { calculateColumnSizes, getMaxWidth, getMinWidth, isStatic, parseFractionalUnit, parseStaticWidth };
+
+//# sourceMappingURL=table-utils.js.map

package/dist/table/table-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-utils.js","names":[],"sources":["../../src/table/table-utils.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-stately/src/table/TableUtils.ts.\n * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport type { Key } from \"@solid2-aria/types-shared\";\n\nimport { requireValue } from \"../utils/require-value\";\nimport type { ColumnSize } from \"./column\";\n\n// numbers and percents are considered static. *fr units or a lack of units are considered dynamic.\nexport function isStatic(width?: string | number | null): boolean {\n  return (\n    width !== null &&\n    width !== undefined &&\n    (!Number.isNaN(Number(width)) ||\n      /^(?<amount>\\d+)(?=%$)/u.exec(String(width)) !== null)\n  );\n}\n\nexport function parseFractionalUnit(width?: string | number | null): number {\n  if (\n    width === null ||\n    width === undefined ||\n    width === \"\" ||\n    typeof width === \"number\"\n  ) {\n    return 1;\n  }\n\n  const match = /^(?<amount>.+)(?=fr$)/u.exec(width);\n\n  // if width is the incorrect format, just default it to a 1fr\n  if (!match) {\n    if (process.env.NODE_ENV !== \"production\") {\n      console.warn(\n        `width: ${width} is not a supported format, width should be a number (ex. 150), percentage (ex. '50%') or fr unit (ex. '2fr')`,\n        \"defaulting to '1fr'\"\n      );\n    }\n\n    return 1;\n  }\n\n  return Number(match[0]);\n}\n\nexport function parseStaticWidth(\n  width: number | string,\n  tableWidth: number\n): number {\n  if (typeof width === \"string\") {\n    const match = /^(?<amount>\\d+)(?=%$)/u.exec(width);\n\n    if (!match) {\n      throw new Error(\n        \"Only percentages or numbers are supported for static column widths\"\n      );\n    }\n\n    return tableWidth * (Number(match[0]) / 100);\n  }\n\n  return width;\n}\n\nexport function getMaxWidth(\n  maxWidth: number | string | null | undefined,\n  tableWidth: number\n): number {\n  return maxWidth === null || maxWidth === undefined\n    ? Number.MAX_SAFE_INTEGER\n    : parseStaticWidth(maxWidth, tableWidth);\n}\n\n// cannot support FR units, we'd need to know everything else in the table to do that\nexport function getMinWidth(\n  minWidth: number | string | null | undefined,\n  tableWidth: number\n): number {\n  return minWidth === null || minWidth === undefined\n    ? 0\n    : parseStaticWidth(minWidth, tableWidth);\n}\n\nexport interface IColumn {\n  minWidth?: number | string;\n  maxWidth?: number | string;\n  width?: number | string;\n  defaultWidth?: number | string;\n  key: Key;\n}\n\ninterface FlexItem {\n  frozen: boolean;\n  baseSize: number;\n  hypotheticalMainSize: number;\n  min: number;\n  max: number;\n  flex: number;\n  targetMainSize: number;\n  violation: number;\n}\n\n/**\n * Implements the flex algorithm described in https://www.w3.org/TR/css-flexbox-1/#layout-algorithm\n * It makes a few constraint/assumptions: 1. All basis values are 0 unless it is a static width,\n * then the basis is the static width 2. All flex grow and shrink values are equal to the FR\n * specified on the column, grow and shrink for the same column are equal 3. We only have one row An\n * example of the setup can be seen here https://jsfiddle.net/snowystinger/wv0ymjaf/61/ where I let\n * the browser figure out the flex of the columns. Note: We differ in one key aspect, all of our\n * column widths must be whole numbers, so we avoid browser sub pixel rounding errors. To do this,\n * we use a cascading rounding algorithm to ensure that the sum of the widths is maintained while\n * distributing the rounding remainder across the columns.\n *\n * As noted in the chrome source code, this algorithm is very accurate, but has the potential to be\n * quadratic. They have deemed this to be acceptable because the number of elements is usually small\n * and the flex factors are usually not high variance. I believe we can make the same assumptions.\n * Particularly once resizing is started, it will convert all columns to the left to static widths,\n * so it will cut down on the number of FR columns.\n *\n * There are likely faster ways to do this, I've chosen to stick to the spec as closely as possible\n * for readability, accuracy, and for the note that this behaving quadratically is unlikely to be a\n * problem.\n *\n * @param availableWidth - The visible width of the table.\n * @param columns - The table defined columns.\n * @param changedColumns - Any columns we want to override, for example, during resizing.\n * @param getDefaultWidth - A function that returns the default width of a column by its index.\n * @param getDefaultMinWidth - A function that returns the default min width of a column by its\n *   index.\n */\nexport function calculateColumnSizes(\n  initialAvailableWidth: number,\n  columns: IColumn[],\n  changedColumns: Map<Key, ColumnSize>,\n  getDefaultWidth?: (index: number) => ColumnSize | null | undefined,\n  getDefaultMinWidth?: (index: number) => ColumnSize | null | undefined\n): number[] {\n  let availableWidth = initialAvailableWidth;\n  const originalWidth = availableWidth;\n  const flooredWidth = Math.floor(availableWidth);\n  const hasFractionalWidth = availableWidth - flooredWidth > 0;\n  availableWidth = flooredWidth;\n  let hasNonFrozenItems = false;\n\n  const flexItems: FlexItem[] = columns.map((column, index) => {\n    const width =\n      changedColumns.get(column.key) === null ||\n      changedColumns.get(column.key) === undefined\n        ? (column.width ??\n          column.defaultWidth ??\n          getDefaultWidth?.(index) ??\n          \"1fr\")\n        : (changedColumns.get(column.key) ?? \"1fr\");\n\n    let frozen = false;\n    let baseSize = 0;\n    let flex = 0;\n    let targetMainSize = 0;\n\n    if (isStatic(width)) {\n      baseSize = parseStaticWidth(width, availableWidth);\n      frozen = true;\n    } else {\n      flex = parseFractionalUnit(width);\n\n      if (flex <= 0) {\n        frozen = true;\n      }\n    }\n\n    const min = getMinWidth(\n      column.minWidth ?? getDefaultMinWidth?.(index) ?? 0,\n      availableWidth\n    );\n\n    const max = getMaxWidth(column.maxWidth, availableWidth);\n    const hypotheticalMainSize = Math.max(min, Math.min(baseSize, max));\n\n    // 9.7.1\n    // We don't make use of flex basis, it's always 0, so we are always in 'grow' mode.\n    // 9.7.2\n    if (frozen) {\n      targetMainSize = hypotheticalMainSize;\n    } else if (baseSize > hypotheticalMainSize) {\n      frozen = true;\n      targetMainSize = hypotheticalMainSize;\n    }\n\n    // 9.7.3\n    if (!frozen) {\n      hasNonFrozenItems = true;\n    }\n\n    return {\n      baseSize,\n      flex,\n      frozen,\n      hypotheticalMainSize,\n      max,\n      min,\n      targetMainSize,\n      violation: 0,\n    };\n  });\n\n  // 9.7.4\n  // 9.7.4.a\n  while (hasNonFrozenItems) {\n    // 9.7.4.b\n    /**\n     * Calculate the remaining free space as for initial free space,\n     * above (9.7.3). If the sum of the unfrozen flex items’ flex factors is\n     * less than one, multiply the initial free space by this sum (of flex factors).\n     * If the magnitude of this value is less than the magnitude of\n     * the remaining free space, use this as the remaining free space.\n     */\n    let usedWidth = 0;\n    let flexFactors = 0;\n\n    for (const item of flexItems) {\n      if (item.frozen) {\n        usedWidth += item.targetMainSize;\n      } else {\n        usedWidth += item.baseSize;\n        flexFactors += item.flex;\n      }\n    }\n\n    const remainingFreeSpace = availableWidth - usedWidth;\n\n    // we only support integer FR's, and because of hasNonFrozenItems, we know that flexFactors > 0\n    // so no need to check for flexFactors < 1\n    // 9.7.4.c\n    /**\n     * If the remaining free space is zero\n     * - Do nothing.\n     * Else // remember, we're always in grow mode\n     * - Find the ratio of the item’s flex grow factor to the\n     * sum of the flex grow factors of all unfrozen items on\n     * the line. Set the item’s target main size to its flex\n     * base size plus a fraction of the remaining free space\n     * proportional to the ratio.\n     */\n    if (remainingFreeSpace > 0) {\n      for (const item of flexItems) {\n        if (!item.frozen) {\n          const ratio = item.flex / flexFactors;\n          item.targetMainSize = item.baseSize + ratio * remainingFreeSpace;\n        }\n      }\n    }\n\n    // 9.7.4.d\n    /**\n     * Fix min/max violations. Clamp each non-frozen item’s\n     * target main size by its used min and max main sizes\n     * and floor its content-box size at zero. If the item’s\n     * target main size was made smaller by this, it’s a max\n     * violation. If the item’s target main size was made\n     * larger by this, it’s a min violation.\n     */\n    let totalViolation = 0;\n\n    for (const item of flexItems) {\n      item.violation = 0;\n\n      if (!item.frozen) {\n        const { min, max, targetMainSize } = item;\n        item.targetMainSize = Math.max(min, Math.min(targetMainSize, max));\n        item.violation = item.targetMainSize - targetMainSize;\n        totalViolation += item.violation;\n      }\n    }\n\n    // 9.7.4.e\n    /**\n     * Freeze over-flexed items. The total violation is the\n     * sum of the adjustments from the previous step\n     * ∑(clamped size - unclamped size). If the total violation is:\n     * Zero\n     * - Freeze all items.\n     *\n     * Positive\n     * - Freeze all the items with min violations.\n     *\n     * Negative\n     * - Freeze all the items with max violations.\n     */\n    hasNonFrozenItems = false;\n\n    for (const item of flexItems) {\n      if (\n        totalViolation === 0 ||\n        Math.sign(totalViolation) === Math.sign(item.violation)\n      ) {\n        item.frozen = true;\n      } else if (!item.frozen) {\n        hasNonFrozenItems = true;\n      }\n    }\n  }\n\n  const columnSizes = cascadeRounding(flexItems);\n\n  // Give the leftover sub-pixel width to the last column so the columns sum\n  // exactly to the (possibly fractional) available width.\n  if (hasFractionalWidth && columnSizes.length > 0) {\n    const [, tableFractionalWidth] = originalWidth.toString().split(\".\");\n\n    const columnWidth = requireValue(\n      columnSizes.at(-1),\n      \"Expected columnSizes.at(-1) to exist.\"\n    ).toString();\n\n    columnSizes[columnSizes.length - 1] = Number(\n      `${columnWidth}.${tableFractionalWidth}`\n    );\n  }\n\n  return columnSizes;\n}\n\nfunction cascadeRounding(flexItems: FlexItem[]): number[] {\n  /*\n      Given an array of floats that sum to an integer, this rounds the floats\n      and returns an array of integers with the same sum.\n      */\n  let fpTotal = 0;\n  let intTotal = 0;\n  const roundedArray: number[] = [];\n\n  for (const item of flexItems) {\n    const float = item.targetMainSize;\n    const integer = Math.round(float + fpTotal) - intTotal;\n    fpTotal += float;\n    intTotal += integer;\n    roundedArray.push(integer);\n  }\n\n  return roundedArray;\n}\n"],"mappings":"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"}

package/dist/tabs/create-tab-list-state.d.ts

@@ -0,0 +1,42 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-stately/src/tabs/useTabListState.ts.
+ * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2; synchronize selection and browser focus after rendering on the client.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { SingleSelectListState } from "../list/create-single-select-list-state.js";
+import { CollectionBase, CollectionStateBase, Key, SingleSelection } from "@solid2-aria/types-shared";
+export interface TabListProps<T> extends CollectionBase<T>, Omit<SingleSelection, "disallowEmptySelection" | "selectedKey" | "defaultSelectedKey" | "onSelectionChange"> {
+  /**
+   * Whether the TabList is disabled.
+   * Shows that a selection exists, but is not available in that circumstance.
+   */
+  isDisabled?: boolean;
+  /** The currently selected key in the collection (controlled). */
+  selectedKey?: Key;
+  /** The initial selected keys in the collection (uncontrolled). */
+  defaultSelectedKey?: Key;
+  /** Handler that is called when the selection changes. */
+  onSelectionChange?: (key: Key) => void;
+}
+export interface TabListStateOptions<T> extends Omit<TabListProps<T>, "children">, CollectionStateBase<T> {}
+export interface TabListState<T> extends SingleSelectListState<T> {
+  /** Whether the tab list is disabled. */
+  isDisabled: boolean;
+}
+/**
+ * Provides state management for a Tabs component. Tabs include a TabList which tracks
+ * which tab is currently selected and displays the content associated with that Tab in a TabPanel.
+ */
+export declare function createTabListState<T extends object>(props: TabListStateOptions<T>): TabListState<T>;
+//# sourceMappingURL=create-tab-list-state.d.ts.map

package/dist/tabs/create-tab-list-state.js

@@ -0,0 +1,78 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-stately/src/tabs/useTabListState.ts.
+ * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2; synchronize selection and browser focus after rendering on the client.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { getNodeProps } from "../utils/get-node-props.js";
+import { createSingleSelectListState } from "../list/create-single-select-list-state.js";
+import { createEffect, merge, omit, untrack } from "solid-js";
+// src/tabs/create-tab-list-state.ts
+/**
+* Provides state management for a Tabs component. Tabs include a TabList which tracks
+* which tab is currently selected and displays the content associated with that Tab in a TabPanel.
+*/
+function createTabListState(props) {
+	const state = createSingleSelectListState(merge(omit(props, "onSelectionChange"), {
+		get defaultSelectedKey() {
+			return props.defaultSelectedKey ?? findDefaultSelectedKey(props.collection, props.disabledKeys ? new Set(props.disabledKeys) : /* @__PURE__ */ new Set()) ?? void 0;
+		},
+		get onSelectionChange() {
+			return (key) => {
+				if (key !== null && key !== void 0) props.onSelectionChange?.(key);
+			};
+		},
+		get suppressTextValueWarning() {
+			return true;
+		}
+	}));
+	let lastSelectedKey = untrack(() => state.selectedKey);
+	createEffect(() => {
+		const manager = state.selectionManager;
+		let { selectedKey } = state;
+		let replaceSelection = false;
+		if ((props.selectedKey === null || props.selectedKey === void 0) && (manager.isEmpty || selectedKey === null || !state.collection.getItem(selectedKey))) {
+			selectedKey = findDefaultSelectedKey(state.collection, state.disabledKeys);
+			replaceSelection = selectedKey !== null;
+		}
+		return {
+			manager,
+			replaceSelection,
+			selectedKey,
+			updateFocus: selectedKey !== null && manager.focusedKey === null || !manager.isFocused && selectedKey !== lastSelectedKey
+		};
+	}, ({ manager, replaceSelection, selectedKey, updateFocus }) => {
+		if (replaceSelection && selectedKey !== null) untrack(() => {
+			manager.setSelectedKeys([selectedKey]);
+		});
+		if (updateFocus) untrack(() => {
+			manager.setFocusedKey(selectedKey);
+		});
+		lastSelectedKey = selectedKey;
+	});
+	return merge(state, { get isDisabled() {
+		return props.isDisabled === true || false;
+	} });
+}
+function findDefaultSelectedKey(collection, disabledKeys) {
+	let selectedKey = null;
+	if (collection) {
+		selectedKey = collection.getFirstKey();
+		while (selectedKey !== null && selectedKey !== void 0 && (disabledKeys.has(selectedKey) || getNodeProps(collection.getItem(selectedKey)).isDisabled) && selectedKey !== collection.getLastKey()) selectedKey = collection.getKeyAfter(selectedKey);
+		if (selectedKey !== null && selectedKey !== void 0 && (disabledKeys.has(selectedKey) || getNodeProps(collection.getItem(selectedKey)).isDisabled) && selectedKey === collection.getLastKey()) selectedKey = collection.getFirstKey();
+	}
+	return selectedKey;
+}
+export { createTabListState };
+
+//# sourceMappingURL=create-tab-list-state.js.map

package/dist/tabs/create-tab-list-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-tab-list-state.js","names":[],"sources":["../../src/tabs/create-tab-list-state.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-stately/src/tabs/useTabListState.ts.\n * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2; synchronize selection and browser focus after rendering on the client.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport type {\n  Collection,\n  CollectionBase,\n  CollectionStateBase,\n  Key,\n  Node,\n  SingleSelection,\n} from \"@solid2-aria/types-shared\";\nimport { createEffect, merge, untrack, omit } from \"solid-js\";\n\nimport { createSingleSelectListState } from \"../list/create-single-select-list-state\";\nimport type { SingleSelectListState } from \"../list/create-single-select-list-state\";\nimport { getNodeProps } from \"../utils/get-node-props\";\n\nexport interface TabListProps<T>\n  extends\n    CollectionBase<T>,\n    Omit<\n      SingleSelection,\n      | \"disallowEmptySelection\"\n      | \"selectedKey\"\n      | \"defaultSelectedKey\"\n      | \"onSelectionChange\"\n    > {\n  /**\n   * Whether the TabList is disabled.\n   * Shows that a selection exists, but is not available in that circumstance.\n   */\n  isDisabled?: boolean;\n  /** The currently selected key in the collection (controlled). */\n  selectedKey?: Key;\n  /** The initial selected keys in the collection (uncontrolled). */\n  defaultSelectedKey?: Key;\n  /** Handler that is called when the selection changes. */\n  onSelectionChange?: (key: Key) => void;\n}\n\nexport interface TabListStateOptions<T>\n  extends Omit<TabListProps<T>, \"children\">, CollectionStateBase<T> {}\n\nexport interface TabListState<T> extends SingleSelectListState<T> {\n  /** Whether the tab list is disabled. */\n  isDisabled: boolean;\n}\n\n/**\n * Provides state management for a Tabs component. Tabs include a TabList which tracks\n * which tab is currently selected and displays the content associated with that Tab in a TabPanel.\n */\nexport function createTabListState<T extends object>(\n  props: TabListStateOptions<T>\n): TabListState<T> {\n  const state = createSingleSelectListState<T>(\n    merge(omit(props, \"onSelectionChange\"), {\n      get defaultSelectedKey() {\n        return (\n          props.defaultSelectedKey ??\n          findDefaultSelectedKey(\n            props.collection,\n            props.disabledKeys ? new Set(props.disabledKeys) : new Set()\n          ) ??\n          undefined\n        );\n      },\n      get onSelectionChange() {\n        return (key: Key | null) => {\n          if (key !== null && key !== undefined) {\n            props.onSelectionChange?.(key);\n          }\n        };\n      },\n      get suppressTextValueWarning() {\n        return true;\n      },\n    })\n  );\n\n  let lastSelectedKey = untrack(() => state.selectedKey);\n  createEffect(\n    () => {\n      const manager = state.selectionManager;\n      let { selectedKey } = state;\n      let replaceSelection = false;\n\n      if (\n        (props.selectedKey === null || props.selectedKey === undefined) &&\n        (manager.isEmpty ||\n          selectedKey === null ||\n          !state.collection.getItem(selectedKey))\n      ) {\n        selectedKey = findDefaultSelectedKey(\n          state.collection,\n          state.disabledKeys\n        );\n        replaceSelection = selectedKey !== null;\n      }\n\n      return {\n        manager,\n        replaceSelection,\n        selectedKey,\n        updateFocus:\n          (selectedKey !== null && manager.focusedKey === null) ||\n          (!manager.isFocused && selectedKey !== lastSelectedKey),\n      };\n    },\n    ({ manager, replaceSelection, selectedKey, updateFocus }) => {\n      if (replaceSelection && selectedKey !== null) {\n        untrack(() => {\n          manager.setSelectedKeys([selectedKey]);\n        });\n      }\n\n      if (updateFocus) {\n        untrack(() => {\n          manager.setFocusedKey(selectedKey);\n        });\n      }\n\n      lastSelectedKey = selectedKey;\n    }\n  );\n\n  return merge(state, {\n    get isDisabled() {\n      return props.isDisabled === true || false;\n    },\n  });\n}\n\nfunction findDefaultSelectedKey<T>(\n  collection: Collection<Node<T>> | undefined,\n  disabledKeys: Set<Key>\n) {\n  let selectedKey: Key | null = null;\n\n  if (collection) {\n    selectedKey = collection.getFirstKey();\n\n    // loop over tabs until we find one that isn't disabled and select that\n    while (\n      selectedKey !== null &&\n      selectedKey !== undefined &&\n      (disabledKeys.has(selectedKey) ||\n        getNodeProps(collection.getItem(selectedKey)).isDisabled) &&\n      selectedKey !== collection.getLastKey()\n    ) {\n      selectedKey = collection.getKeyAfter(selectedKey);\n    }\n\n    // if this check is true, then every item is disabled, it makes more sense to default to the first key than the last\n    if (\n      selectedKey !== null &&\n      selectedKey !== undefined &&\n      (disabledKeys.has(selectedKey) ||\n        getNodeProps(collection.getItem(selectedKey)).isDisabled) &&\n      selectedKey === collection.getLastKey()\n    ) {\n      selectedKey = collection.getFirstKey();\n    }\n  }\n\n  return selectedKey;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAkEA,SAAgB,mBACd,OACiB;CACjB,MAAM,QAAQ,4BACZ,MAAM,KAAK,OAAO,mBAAmB,GAAG;EACtC,IAAI,qBAAqB;GACvB,OACE,MAAM,sBACN,uBACE,MAAM,YACN,MAAM,eAAe,IAAI,IAAI,MAAM,YAAY,oBAAI,IAAI,IAAI,CAC7D,KACA,KAAA;EAEJ;EACA,IAAI,oBAAoB;GACtB,QAAQ,QAAoB;IAC1B,IAAI,QAAQ,QAAQ,QAAQ,KAAA,GAC1B,MAAM,oBAAoB,GAAG;GAEjC;EACF;EACA,IAAI,2BAA2B;GAC7B,OAAO;EACT;CACF,CAAC,CACH;CAEA,IAAI,kBAAkB,cAAc,MAAM,WAAW;CACrD,mBACQ;EACJ,MAAM,UAAU,MAAM;EACtB,IAAI,EAAE,gBAAgB;EACtB,IAAI,mBAAmB;EAEvB,KACG,MAAM,gBAAgB,QAAQ,MAAM,gBAAgB,KAAA,OACpD,QAAQ,WACP,gBAAgB,QAChB,CAAC,MAAM,WAAW,QAAQ,WAAW,IACvC;GACA,cAAc,uBACZ,MAAM,YACN,MAAM,YACR;GACA,mBAAmB,gBAAgB;EACrC;EAEA,OAAO;GACL;GACA;GACA;GACA,aACG,gBAAgB,QAAQ,QAAQ,eAAe,QAC/C,CAAC,QAAQ,aAAa,gBAAgB;EAC3C;CACF,IACC,EAAE,SAAS,kBAAkB,aAAa,kBAAkB;EAC3D,IAAI,oBAAoB,gBAAgB,MACtC,cAAc;GACZ,QAAQ,gBAAgB,CAAC,WAAW,CAAC;EACvC,CAAC;EAGH,IAAI,aACF,cAAc;GACZ,QAAQ,cAAc,WAAW;EACnC,CAAC;EAGH,kBAAkB;CACpB,CACF;CAEA,OAAO,MAAM,OAAO,EAClB,IAAI,aAAa;EACf,OAAO,MAAM,eAAe,QAAQ;CACtC,EACF,CAAC;AACH;AAEA,SAAS,uBACP,YACA,cACA;CACA,IAAI,cAA0B;CAE9B,IAAI,YAAY;EACd,cAAc,WAAW,YAAY;EAGrC,OACE,gBAAgB,QAChB,gBAAgB,KAAA,MACf,aAAa,IAAI,WAAW,KAC3B,aAAa,WAAW,QAAQ,WAAW,CAAC,CAAC,CAAC,eAChD,gBAAgB,WAAW,WAAW,GAEtC,cAAc,WAAW,YAAY,WAAW;EAIlD,IACE,gBAAgB,QAChB,gBAAgB,KAAA,MACf,aAAa,IAAI,WAAW,KAC3B,aAAa,WAAW,QAAQ,WAAW,CAAC,CAAC,CAAC,eAChD,gBAAgB,WAAW,WAAW,GAEtC,cAAc,WAAW,YAAY;CAEzC;CAEA,OAAO;AACT"}

package/dist/toast/create-toast-state.d.ts

@@ -0,0 +1,97 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-stately/src/toast/useToastState.ts.
+ * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+type ToastAction = "add" | "remove" | "clear";
+export interface ToastStateProps {
+  /** The maximum number of toasts to display at a time. */
+  maxVisibleToasts?: number;
+  /** Function to wrap updates in (i.e. document.startViewTransition()). */
+  wrapUpdate?: (fn: () => void, action: ToastAction) => void;
+}
+export interface ToastOptions {
+  /** Handler that is called when the toast is closed, either by the user or after a timeout. */
+  onClose?: () => void;
+  /** A timeout to automatically close the toast after, in milliseconds. */
+  timeout?: number;
+}
+export interface QueuedToast<T> extends ToastOptions {
+  /** The content of the toast. */
+  content: T;
+  /** A unique key for the toast. */
+  key: string;
+  /** A timer for the toast, if a timeout was set. */
+  timer?: Timer;
+}
+export interface ToastState<T> {
+  /** Adds a new toast to the queue. */
+  add: (content: T, options?: ToastOptions) => string;
+  /**
+   * Closes a toast.
+   */
+  close: (key: string) => void;
+  /** Pauses the timers for all visible toasts. */
+  pauseAll: () => void;
+  /** Resumes the timers for all visible toasts. */
+  resumeAll: () => void;
+  /** The visible toasts. */
+  visibleToasts: QueuedToast<T>[];
+}
+/**
+ * Provides state management for a toast queue. Toasts display brief, temporary notifications
+ * of actions, errors, or other events in an application.
+ */
+export declare function createToastState<T>(props?: ToastStateProps): ToastState<T>;
+/** Subscribes for the lifetime of the current reactive owner. */
+export declare function createToastQueue<T>(queue: ToastQueue<T>): ToastState<T>;
+/**
+ * A ToastQueue manages the order of toasts.
+ */
+export declare class ToastQueue<T> {
+  private queue;
+  private readonly subscriptions;
+  private readonly maxVisibleToasts;
+  private readonly wrapUpdate?;
+  /** The currently visible toasts. */
+  visibleToasts: QueuedToast<T>[];
+  constructor(options?: ToastStateProps);
+  private runWithWrapUpdate;
+  /** Subscribes to updates to the visible toasts. */
+  subscribe(fn: () => void): () => void;
+  /** Adds a new toast to the queue. */
+  add(content: T, options?: ToastOptions): string;
+  /**
+   * Closes a toast.
+   */
+  close(key: string): void;
+  private updateVisibleToasts;
+  /** Pauses the timers for all visible toasts. */
+  pauseAll(): void;
+  /** Resumes the timers for all visible toasts. */
+  resumeAll(): void;
+  clear(): void;
+}
+declare class Timer {
+  private timerId;
+  private startTime;
+  private remaining;
+  private readonly callback;
+  constructor(callback: () => void, delay: number);
+  reset(delay: number): void;
+  pause(): void;
+  resume(): void;
+}
+export {};
+//# sourceMappingURL=create-toast-state.d.ts.map

package/dist/toast/create-toast-state.js

@@ -0,0 +1,166 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-stately/src/toast/useToastState.ts.
+ * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { createMemo, createRenderEffect, createSignal, untrack } from "solid-js";
+// src/toast/create-toast-state.ts
+/**
+* Provides state management for a toast queue. Toasts display brief, temporary notifications
+* of actions, errors, or other events in an application.
+*/
+function createToastState(props = {}) {
+	const queue = createMemo(() => new ToastQueue({
+		maxVisibleToasts: props.maxVisibleToasts ?? 1,
+		wrapUpdate: props.wrapUpdate
+	}));
+	return untrack(() => subscribeToQueue(queue, true));
+}
+/** Subscribes for the lifetime of the current reactive owner. */
+function createToastQueue(queue) {
+	return subscribeToQueue(() => queue, false);
+}
+function subscribeToQueue(getQueue, ownsQueue) {
+	const [visibleToasts, setVisibleToasts] = createSignal(untrack(() => getQueue().visibleToasts), { ownedWrite: true });
+	createRenderEffect(getQueue, (queue) => {
+		setVisibleToasts(queue.visibleToasts);
+		const unsubscribe = queue.subscribe(() => {
+			setVisibleToasts(queue.visibleToasts);
+		});
+		return () => {
+			unsubscribe();
+			if (ownsQueue) queue.clear();
+		};
+	});
+	return {
+		add: (content, options) => getQueue().add(content, options),
+		close: (key) => {
+			getQueue().close(key);
+		},
+		pauseAll: () => {
+			getQueue().pauseAll();
+		},
+		resumeAll: () => {
+			getQueue().resumeAll();
+		},
+		get visibleToasts() {
+			return visibleToasts();
+		}
+	};
+}
+/**
+* A ToastQueue manages the order of toasts.
+*/
+var ToastQueue = class {
+	queue = [];
+	subscriptions = /* @__PURE__ */ new Set();
+	maxVisibleToasts;
+	wrapUpdate;
+	/** The currently visible toasts. */
+	visibleToasts = [];
+	constructor(options) {
+		this.maxVisibleToasts = options?.maxVisibleToasts ?? Infinity;
+		this.wrapUpdate = options?.wrapUpdate;
+	}
+	runWithWrapUpdate(fn, action) {
+		if (this.wrapUpdate) this.wrapUpdate(fn, action);
+		else fn();
+	}
+	/** Subscribes to updates to the visible toasts. */
+	subscribe(fn) {
+		this.subscriptions.add(fn);
+		return () => {
+			this.subscriptions.delete(fn);
+		};
+	}
+	/** Adds a new toast to the queue. */
+	add(content, options = {}) {
+		const toastKey = `_${Math.random().toString(36).slice(2)}`;
+		const toast = {
+			...options,
+			content,
+			key: toastKey,
+			timer: options.timeout !== void 0 && options.timeout !== 0 && !Number.isNaN(options.timeout) ? new Timer(() => {
+				this.close(toastKey);
+			}, options.timeout) : void 0
+		};
+		this.queue.unshift(toast);
+		this.updateVisibleToasts("add");
+		return toastKey;
+	}
+	/**
+	* Closes a toast.
+	*/
+	close(key) {
+		const index = this.queue.findIndex((t) => t.key === key);
+		const toast = this.queue[index];
+		if (toast) {
+			toast.timer?.pause();
+			toast.onClose?.();
+			this.queue.splice(index, 1);
+		}
+		this.updateVisibleToasts("remove");
+	}
+	updateVisibleToasts(action) {
+		this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);
+		this.runWithWrapUpdate(() => {
+			for (const fn of this.subscriptions) fn();
+		}, action);
+	}
+	/** Pauses the timers for all visible toasts. */
+	pauseAll() {
+		for (const toast of this.visibleToasts) if (toast.timer) toast.timer.pause();
+	}
+	/** Resumes the timers for all visible toasts. */
+	resumeAll() {
+		for (const toast of this.visibleToasts) if (toast.timer) toast.timer.resume();
+	}
+	clear() {
+		for (const toast of this.queue) toast.timer?.pause();
+		this.queue = [];
+		this.updateVisibleToasts("clear");
+	}
+};
+var Timer = class {
+	timerId = null;
+	startTime = null;
+	remaining;
+	callback;
+	constructor(callback, delay) {
+		this.remaining = delay;
+		this.callback = callback;
+	}
+	reset(delay) {
+		this.remaining = delay;
+		this.resume();
+	}
+	pause() {
+		if (this.timerId === null || this.timerId === void 0) return;
+		clearTimeout(this.timerId);
+		this.timerId = null;
+		this.remaining -= Date.now() - (this.startTime ?? Date.now());
+	}
+	resume() {
+		if (this.timerId !== null || this.remaining <= 0) return;
+		this.startTime = Date.now();
+		this.timerId = setTimeout(() => {
+			this.timerId = null;
+			this.remaining = 0;
+			this.callback();
+		}, this.remaining);
+	}
+};
+export { ToastQueue, createToastQueue, createToastState };
+
+//# sourceMappingURL=create-toast-state.js.map

package/dist/toast/create-toast-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-toast-state.js","names":[],"sources":["../../src/toast/create-toast-state.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-stately/src/toast/useToastState.ts.\n * Modified for Solid Aria: adapted imports, collection descriptors, and reactive state APIs for Solid 2.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport {\n  createSignal,\n  createMemo,\n  createRenderEffect,\n  untrack,\n} from \"solid-js\";\n\ntype ToastAction = \"add\" | \"remove\" | \"clear\";\n\nexport interface ToastStateProps {\n  /** The maximum number of toasts to display at a time. */\n  maxVisibleToasts?: number;\n  /** Function to wrap updates in (i.e. document.startViewTransition()). */\n  wrapUpdate?: (fn: () => void, action: ToastAction) => void;\n}\n\nexport interface ToastOptions {\n  /** Handler that is called when the toast is closed, either by the user or after a timeout. */\n  onClose?: () => void;\n  /** A timeout to automatically close the toast after, in milliseconds. */\n  timeout?: number;\n}\n\nexport interface QueuedToast<T> extends ToastOptions {\n  /** The content of the toast. */\n  content: T;\n  /** A unique key for the toast. */\n  key: string;\n  /** A timer for the toast, if a timeout was set. */\n  timer?: Timer;\n}\n\nexport interface ToastState<T> {\n  /** Adds a new toast to the queue. */\n  add: (content: T, options?: ToastOptions) => string;\n  /**\n   * Closes a toast.\n   */\n  close: (key: string) => void;\n  /** Pauses the timers for all visible toasts. */\n  pauseAll: () => void;\n  /** Resumes the timers for all visible toasts. */\n  resumeAll: () => void;\n  /** The visible toasts. */\n  visibleToasts: QueuedToast<T>[];\n}\n\n/**\n * Provides state management for a toast queue. Toasts display brief, temporary notifications\n * of actions, errors, or other events in an application.\n */\nexport function createToastState<T>(\n  props: ToastStateProps = {}\n): ToastState<T> {\n  const queue = createMemo(\n    () =>\n      new ToastQueue<T>({\n        maxVisibleToasts: props.maxVisibleToasts ?? 1,\n        wrapUpdate: props.wrapUpdate,\n      })\n  );\n\n  return untrack(() => subscribeToQueue(queue, true));\n}\n\n/** Subscribes for the lifetime of the current reactive owner. */\nexport function createToastQueue<T>(queue: ToastQueue<T>): ToastState<T> {\n  return subscribeToQueue(() => queue, false);\n}\n\nfunction subscribeToQueue<T>(\n  getQueue: () => ToastQueue<T>,\n  ownsQueue: boolean\n): ToastState<T> {\n  const [visibleToasts, setVisibleToasts] = createSignal<QueuedToast<T>[]>(\n    untrack(() => getQueue().visibleToasts),\n    { ownedWrite: true }\n  );\n\n  createRenderEffect(getQueue, (queue) => {\n    setVisibleToasts(queue.visibleToasts);\n\n    const unsubscribe = queue.subscribe(() => {\n      setVisibleToasts(queue.visibleToasts);\n    });\n\n    return () => {\n      unsubscribe();\n\n      if (ownsQueue) {\n        queue.clear();\n      }\n    };\n  });\n\n  return {\n    add: (content, options) => getQueue().add(content, options),\n    close: (key) => {\n      getQueue().close(key);\n    },\n    pauseAll: () => {\n      getQueue().pauseAll();\n    },\n    resumeAll: () => {\n      getQueue().resumeAll();\n    },\n    get visibleToasts() {\n      return visibleToasts();\n    },\n  };\n}\n\n/**\n * A ToastQueue manages the order of toasts.\n */\nexport class ToastQueue<T> {\n  private queue: QueuedToast<T>[] = [];\n  private readonly subscriptions = new Set<() => void>();\n  private readonly maxVisibleToasts: number;\n  private readonly wrapUpdate?: (fn: () => void, action: ToastAction) => void;\n  /** The currently visible toasts. */\n  visibleToasts: QueuedToast<T>[] = [];\n  constructor(options?: ToastStateProps) {\n    this.maxVisibleToasts = options?.maxVisibleToasts ?? Infinity;\n    this.wrapUpdate = options?.wrapUpdate;\n  }\n  private runWithWrapUpdate(fn: () => void, action: ToastAction): void {\n    if (this.wrapUpdate) {\n      this.wrapUpdate(fn, action);\n    } else {\n      fn();\n    }\n  }\n  /** Subscribes to updates to the visible toasts. */\n  subscribe(fn: () => void): () => void {\n    this.subscriptions.add(fn);\n\n    return () => {\n      this.subscriptions.delete(fn);\n    };\n  }\n  /** Adds a new toast to the queue. */\n  add(content: T, options: ToastOptions = {}): string {\n    const toastKey = `_${Math.random().toString(36).slice(2)}`;\n\n    const toast: QueuedToast<T> = {\n      ...options,\n      content,\n      key: toastKey,\n      timer:\n        options.timeout !== undefined &&\n        options.timeout !== 0 &&\n        !Number.isNaN(options.timeout)\n          ? new Timer(() => {\n              this.close(toastKey);\n            }, options.timeout)\n          : undefined,\n    };\n\n    this.queue.unshift(toast);\n    this.updateVisibleToasts(\"add\");\n\n    return toastKey;\n  }\n  /**\n   * Closes a toast.\n   */\n  close(key: string): void {\n    const index = this.queue.findIndex((t) => t.key === key);\n\n    const toast = this.queue[index];\n\n    if (toast) {\n      toast.timer?.pause();\n      toast.onClose?.();\n      this.queue.splice(index, 1);\n    }\n\n    this.updateVisibleToasts(\"remove\");\n  }\n  private updateVisibleToasts(action: ToastAction) {\n    this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);\n    this.runWithWrapUpdate(() => {\n      for (const fn of this.subscriptions) {\n        fn();\n      }\n    }, action);\n  }\n  /** Pauses the timers for all visible toasts. */\n  pauseAll(): void {\n    for (const toast of this.visibleToasts) {\n      if (toast.timer) {\n        toast.timer.pause();\n      }\n    }\n  }\n  /** Resumes the timers for all visible toasts. */\n  resumeAll(): void {\n    for (const toast of this.visibleToasts) {\n      if (toast.timer) {\n        toast.timer.resume();\n      }\n    }\n  }\n  clear(): void {\n    for (const toast of this.queue) {\n      toast.timer?.pause();\n    }\n\n    this.queue = [];\n    this.updateVisibleToasts(\"clear\");\n  }\n}\n\nclass Timer {\n  private timerId: ReturnType<typeof setTimeout> | null = null;\n  private startTime: number | null = null;\n  private remaining: number;\n  private readonly callback: () => void;\n  constructor(callback: () => void, delay: number) {\n    this.remaining = delay;\n    this.callback = callback;\n  }\n  reset(delay: number): void {\n    this.remaining = delay;\n    this.resume();\n  }\n  pause(): void {\n    if (this.timerId === null || this.timerId === undefined) {\n      return;\n    }\n\n    clearTimeout(this.timerId);\n    this.timerId = null;\n    this.remaining -= Date.now() - (this.startTime ?? Date.now());\n  }\n  resume(): void {\n    if (this.timerId !== null || this.remaining <= 0) {\n      return;\n    }\n\n    this.startTime = Date.now();\n    this.timerId = setTimeout(() => {\n      this.timerId = null;\n      this.remaining = 0;\n      this.callback();\n    }, this.remaining);\n  }\n}\n"],"mappings":"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"}