@windmorph/react 0.0.0-stage → 0.1.0

package/dist/composites/button-group/use-overflow.js

@@ -0,0 +1,75 @@
+"use client";
+import { useLayoutEffect, useState } from "react";
+//#region src/composites/button-group/use-overflow.ts
+/** Set on a group's child while it's folded into the overflow menu; the group hides it. */
+const OVERFLOW_HIDDEN = "data-overflow-hidden";
+/** Set on the group while it measures its children at their natural widths. */
+const MEASURING = "data-measuring";
+/** Sub-pixel slack, so rounding never folds a button that fits. */
+const EPSILON = .5;
+/**
+* How many of `widths` fit in `available` px with `gap` between them, leaving room for an
+* overflow indicator `indicator` px wide (and its gap) when they don't all fit (Compose
+* `ButtonGroup`'s overflow measurement).
+*/
+function fitCount(widths, gap, indicator, available) {
+	const span = (count) => widths.slice(0, count).reduce((sum, width) => sum + width, 0) + gap * Math.max(0, count - 1);
+	if (span(widths.length) <= available + EPSILON) return widths.length;
+	let count = 0;
+	while (count < widths.length && span(count + 1) + gap + indicator <= available + EPSILON) count += 1;
+	return count;
+}
+/**
+* M3 button group overflow ("Buttons at the trailing edge of the button group can be
+* customized to collapse into an overflow menu at smaller breakpoints, and become visible
+* again at larger sizes"). The group's first `count` children are its items and the next
+* one is the overflow indicator. Measures the items at their natural widths whenever the
+* group or an item resizes, hides the trailing items that don't fit (and the indicator
+* when they all do) through `data-overflow-hidden`, and returns how many items show.
+*
+* Measuring and hiding happen in one synchronous pass before paint, so nothing flashes.
+*/
+function useOverflow(groupRef, enabled, count) {
+	const [visible, setVisible] = useState(count);
+	useLayoutEffect(() => {
+		const group = groupRef.current;
+		if (!group || !enabled) return;
+		const measure = () => {
+			const children = [...group.children];
+			const items = children.slice(0, count);
+			const indicator = children[count];
+			const available = group.clientWidth;
+			for (const element of children) element.removeAttribute(OVERFLOW_HIDDEN);
+			group.setAttribute(MEASURING, "");
+			const gap = Number.parseFloat(getComputedStyle(group).columnGap) || 0;
+			const widths = items.map((element) => element.getBoundingClientRect().width);
+			const indicatorWidth = indicator?.getBoundingClientRect().width ?? 0;
+			group.removeAttribute(MEASURING);
+			const fit = fitCount(widths, gap, indicatorWidth, available);
+			items.forEach((element, index) => element.toggleAttribute(OVERFLOW_HIDDEN, index >= fit));
+			indicator?.toggleAttribute(OVERFLOW_HIDDEN, fit === count);
+			setVisible(fit);
+		};
+		measure();
+		const reset = () => {
+			for (const element of group.children) element.removeAttribute(OVERFLOW_HIDDEN);
+		};
+		if (typeof ResizeObserver === "undefined") return reset;
+		const observer = new ResizeObserver(measure);
+		observer.observe(group);
+		for (const element of group.children) observer.observe(element);
+		return () => {
+			observer.disconnect();
+			reset();
+		};
+	}, [
+		groupRef,
+		enabled,
+		count
+	]);
+	return enabled ? Math.min(visible, count) : count;
+}
+//#endregion
+export { OVERFLOW_HIDDEN, fitCount, useOverflow };
+
+//# sourceMappingURL=use-overflow.js.map

package/dist/composites/button-group/use-overflow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-overflow.js","names":[],"sources":["../../../src/composites/button-group/use-overflow.ts"],"sourcesContent":["'use client';\n\nimport { useLayoutEffect, useState, type RefObject } from 'react';\n\n/** Set on a group's child while it's folded into the overflow menu; the group hides it. */\nexport const OVERFLOW_HIDDEN = 'data-overflow-hidden';\n\n/** Set on the group while it measures its children at their natural widths. */\nconst MEASURING = 'data-measuring';\n\n/** Sub-pixel slack, so rounding never folds a button that fits. */\nconst EPSILON = 0.5;\n\n/**\n * How many of `widths` fit in `available` px with `gap` between them, leaving room for an\n * overflow indicator `indicator` px wide (and its gap) when they don't all fit (Compose\n * `ButtonGroup`'s overflow measurement).\n */\nexport function fitCount(widths: number[], gap: number, indicator: number, available: number) {\n  const span = (count: number) =>\n    widths.slice(0, count).reduce((sum, width) => sum + width, 0) + gap * Math.max(0, count - 1);\n  if (span(widths.length) <= available + EPSILON) return widths.length;\n  let count = 0;\n  while (count < widths.length && span(count + 1) + gap + indicator <= available + EPSILON) {\n    count += 1;\n  }\n  return count;\n}\n\n/**\n * M3 button group overflow (\"Buttons at the trailing edge of the button group can be\n * customized to collapse into an overflow menu at smaller breakpoints, and become visible\n * again at larger sizes\"). The group's first `count` children are its items and the next\n * one is the overflow indicator. Measures the items at their natural widths whenever the\n * group or an item resizes, hides the trailing items that don't fit (and the indicator\n * when they all do) through `data-overflow-hidden`, and returns how many items show.\n *\n * Measuring and hiding happen in one synchronous pass before paint, so nothing flashes.\n */\nexport function useOverflow(\n  groupRef: RefObject<HTMLElement | null>,\n  enabled: boolean,\n  count: number,\n): number {\n  const [visible, setVisible] = useState(count);\n\n  useLayoutEffect(() => {\n    const group = groupRef.current;\n    if (!group || !enabled) return;\n    const measure = () => {\n      const children = [...group.children] as HTMLElement[];\n      const items = children.slice(0, count);\n      const indicator = children[count];\n      const available = group.clientWidth;\n      // Natural widths: every item shown and none growing into spare space.\n      for (const element of children) element.removeAttribute(OVERFLOW_HIDDEN);\n      group.setAttribute(MEASURING, '');\n      const gap = Number.parseFloat(getComputedStyle(group).columnGap) || 0;\n      const widths = items.map((element) => element.getBoundingClientRect().width);\n      const indicatorWidth = indicator?.getBoundingClientRect().width ?? 0;\n      group.removeAttribute(MEASURING);\n\n      const fit = fitCount(widths, gap, indicatorWidth, available);\n      items.forEach((element, index) => element.toggleAttribute(OVERFLOW_HIDDEN, index >= fit));\n      indicator?.toggleAttribute(OVERFLOW_HIDDEN, fit === count);\n      setVisible(fit);\n    };\n    measure();\n    const reset = () => {\n      for (const element of group.children) element.removeAttribute(OVERFLOW_HIDDEN);\n    };\n    if (typeof ResizeObserver === 'undefined') return reset;\n    const observer = new ResizeObserver(measure);\n    observer.observe(group);\n    for (const element of group.children) observer.observe(element);\n    return () => {\n      observer.disconnect();\n      reset();\n    };\n  }, [groupRef, enabled, count]);\n\n  return enabled ? Math.min(visible, count) : count;\n}\n"],"mappings":";;;;AAKA,MAAa,kBAAkB;;AAG/B,MAAM,YAAY;;AAGlB,MAAM,UAAU;;;;;;AAOhB,SAAgB,SAAS,QAAkB,KAAa,WAAmB,WAAmB;CAC5F,MAAM,QAAQ,UACZ,OAAO,MAAM,GAAG,KAAK,CAAC,CAAC,QAAQ,KAAK,UAAU,MAAM,OAAO,CAAC,IAAI,MAAM,KAAK,IAAI,GAAG,QAAQ,CAAC;CAC7F,IAAI,KAAK,OAAO,MAAM,KAAK,YAAY,SAAS,OAAO,OAAO;CAC9D,IAAI,QAAQ;CACZ,OAAO,QAAQ,OAAO,UAAU,KAAK,QAAQ,CAAC,IAAI,MAAM,aAAa,YAAY,SAC/E,SAAS;CAEX,OAAO;AACT;;;;;;;;;;;AAYA,SAAgB,YACd,UACA,SACA,OACQ;CACR,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAE5C,sBAAsB;EACpB,MAAM,QAAQ,SAAS;EACvB,IAAI,CAAC,SAAS,CAAC,SAAS;EACxB,MAAM,gBAAgB;GACpB,MAAM,WAAW,CAAC,GAAG,MAAM,QAAQ;GACnC,MAAM,QAAQ,SAAS,MAAM,GAAG,KAAK;GACrC,MAAM,YAAY,SAAS;GAC3B,MAAM,YAAY,MAAM;GAExB,KAAK,MAAM,WAAW,UAAU,QAAQ,gBAAgB,eAAe;GACvE,MAAM,aAAa,WAAW,EAAE;GAChC,MAAM,MAAM,OAAO,WAAW,iBAAiB,KAAK,CAAC,CAAC,SAAS,KAAK;GACpE,MAAM,SAAS,MAAM,KAAK,YAAY,QAAQ,sBAAsB,CAAC,CAAC,KAAK;GAC3E,MAAM,iBAAiB,WAAW,sBAAsB,CAAC,CAAC,SAAS;GACnE,MAAM,gBAAgB,SAAS;GAE/B,MAAM,MAAM,SAAS,QAAQ,KAAK,gBAAgB,SAAS;GAC3D,MAAM,SAAS,SAAS,UAAU,QAAQ,gBAAgB,iBAAiB,SAAS,GAAG,CAAC;GACxF,WAAW,gBAAgB,iBAAiB,QAAQ,KAAK;GACzD,WAAW,GAAG;EAChB;EACA,QAAQ;EACR,MAAM,cAAc;GAClB,KAAK,MAAM,WAAW,MAAM,UAAU,QAAQ,gBAAgB,eAAe;EAC/E;EACA,IAAI,OAAO,mBAAmB,aAAa,OAAO;EAClD,MAAM,WAAW,IAAI,eAAe,OAAO;EAC3C,SAAS,QAAQ,KAAK;EACtB,KAAK,MAAM,WAAW,MAAM,UAAU,SAAS,QAAQ,OAAO;EAC9D,aAAa;GACX,SAAS,WAAW;GACpB,MAAM;EACR;CACF,GAAG;EAAC;EAAU;EAAS;CAAK,CAAC;CAE7B,OAAO,UAAU,KAAK,IAAI,SAAS,KAAK,IAAI;AAC9C"}

package/dist/composites/button-group/use-press-expansion.js

@@ -0,0 +1,155 @@
+"use client";
+import { OVERFLOW_HIDDEN } from "./use-overflow.js";
+import { useLayoutEffect } from "react";
+//#region src/composites/button-group/use-press-expansion.ts
+/**
+* Set on the group while it sizes its items inline. A connected group, a grid at rest, is
+* then a flex row (`data-pinned:flex`), since the bump animates its items' `flex-basis`.
+*/
+const PINNED = "data-pinned";
+/**
+* An item's layout width, and how much of it the item may give up: half the space around its
+* content (Compose's compression limit). Both ignore transforms, such as a scaled ancestor,
+* since the group sets layout widths. The used `width` is in the item's own box sizing, as
+* `flex-basis` is.
+*/
+function measure(element) {
+	const box = element.getBoundingClientRect().width;
+	const layout = Number.parseFloat(getComputedStyle(element).width);
+	const width = Number.isFinite(layout) ? layout : box;
+	const scale = box > 0 ? width / box : 1;
+	const content = element.firstElementChild ? element.firstElementChild.getBoundingClientRect().width * scale : width;
+	return {
+		rest: width,
+		limit: Math.max(0, (width - content) / 2)
+	};
+}
+/**
+* Changes an item's sizing without animating it. Pinning swaps the consumer's sizing (such as
+* a connected group's `flex: 1 1 0%`) for its measured width in px, and unpinning swaps it
+* back: the layout is the same either way, but the `container-motion` utility transitions
+* `flex-basis`, which would run from 0% to the px width (the item collapsing first) or back.
+* The change is flushed to style and its transition finished, so only the moves between the
+* rest and bumped widths animate.
+*/
+function resizeInstantly(element, flex, minWidth) {
+	element.style.flex = flex;
+	element.style.minWidth = minWidth;
+	getComputedStyle(element).flexBasis;
+	if (typeof element.getAnimations !== "function") return;
+	for (const animation of element.getAnimations()) if (animation instanceof CSSTransition && animation.transitionProperty === "flex-basis") animation.finish();
+}
+/**
+* How long the release takes to settle, in ms. The token is a CSS time, which a minified
+* stylesheet may write in seconds (`.36s` for `360ms`).
+*/
+function settleDuration(element) {
+	const value = getComputedStyle(element).getPropertyValue("--md-sys-motion-spring-spatial-fast-duration").trim();
+	const time = Number.parseFloat(value);
+	const ms = value.endsWith("ms") ? time : time * 1e3;
+	return (Number.isFinite(ms) ? ms : 400) + 50;
+}
+/**
+* M3 Expressive button group interaction (Compose `ButtonGroup`): the pressed item grows
+* by `expandedRatio` of its width and its neighbours shrink by the same amount, each by
+* at most their own compression limit, so the group's total width stays the same.
+*
+* Watches the public `data-pressed` attribute of the group's direct children and animates
+* their `flex-basis` (the `container-motion` utility transitions it on the fast spatial
+* spring), with `data-pinned` on the group while any item is pinned. At rest no inline sizing remains, so consumer sizing such as `flex-1` applies;
+* the switches between that sizing and the pinned px widths don't animate (2026-10-14).
+* Buttons folded into the overflow menu don't take part. Under reduced motion there's no
+* bump at all: it's movement that only decorates the press (architecture §6).
+*/
+function usePressExpansion(groupRef, expandedRatio) {
+	useLayoutEffect(() => {
+		const group = groupRef.current;
+		if (!group || expandedRatio <= 0) return;
+		const pinned = /* @__PURE__ */ new Map();
+		let pressed = null;
+		let settle;
+		const pin = (element, size) => {
+			const existing = pinned.get(element);
+			if (existing) return existing;
+			const entry = {
+				rest: size.rest,
+				limit: size.limit,
+				flex: element.style.flex,
+				minWidth: element.style.minWidth
+			};
+			resizeInstantly(element, `0 0 ${entry.rest}px`, "0px");
+			pinned.set(element, entry);
+			return entry;
+		};
+		const unpin = () => {
+			for (const [element, entry] of pinned) resizeInstantly(element, entry.flex, entry.minWidth);
+			pinned.clear();
+			group.removeAttribute(PINNED);
+		};
+		let releases = 0;
+		const unpinWhenSettled = () => {
+			const release = releases;
+			const running = [...pinned.keys()].flatMap((element) => typeof element.getAnimations === "function" ? element.getAnimations().filter((animation) => animation instanceof CSSTransition && animation.transitionProperty === "flex-basis" && animation.playState === "running") : []);
+			if (running.length === 0) {
+				unpin();
+				return;
+			}
+			Promise.allSettled(running.map((animation) => animation.finished)).then(() => {
+				if (release === releases) unpin();
+			});
+		};
+		const release = () => {
+			const [first] = pinned.keys();
+			if (!first) return;
+			for (const [element, entry] of pinned) element.style.flexBasis = `${entry.rest}px`;
+			clearTimeout(settle);
+			releases++;
+			settle = setTimeout(unpinWhenSettled, settleDuration(first));
+		};
+		const reducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)");
+		const update = () => {
+			const items = [...group.children].filter((element) => !element.hasAttribute(OVERFLOW_HIDDEN));
+			const next = items.find((el) => el.hasAttribute("data-pressed") && !el.hasAttribute("data-disabled")) ?? null;
+			if (next === pressed) return;
+			pressed = next;
+			release();
+			if (!next || items.length < 2 || reducedMotion.matches) return;
+			clearTimeout(settle);
+			releases++;
+			const index = items.indexOf(next);
+			const neighbours = [items[index - 1], items[index + 1]].filter((el) => el !== void 0);
+			const sizes = items.map((el) => pinned.get(el) ?? measure(el));
+			group.setAttribute(PINNED, "");
+			const entries = new Map(items.map((el, i) => [el, pin(el, sizes[i])]));
+			const width = entries.get(next).rest;
+			const share = neighbours.length === 2 ? expandedRatio * width / 2 : expandedRatio * width;
+			const growthPerSide = Math.min(share, ...neighbours.map((neighbour) => entries.get(neighbour).limit));
+			let growth = 0;
+			for (const neighbour of neighbours) {
+				const neighbourWidth = entries.get(neighbour).rest;
+				const give = Math.min(growthPerSide, neighbourWidth);
+				neighbour.style.flexBasis = `${neighbourWidth - give}px`;
+				growth += give;
+			}
+			next.style.flexBasis = `${width + growth}px`;
+		};
+		const observer = new MutationObserver((records) => {
+			if (records.some((record) => record.target.parentElement === group)) update();
+		});
+		observer.observe(group, {
+			subtree: true,
+			attributes: true,
+			attributeFilter: ["data-pressed"]
+		});
+		return () => {
+			observer.disconnect();
+			clearTimeout(settle);
+			releases++;
+			unpin();
+		};
+	}, [groupRef, expandedRatio]);
+}
+//#endregion
+export { usePressExpansion };
+
+//# sourceMappingURL=use-press-expansion.js.map

package/dist/composites/button-group/use-press-expansion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-press-expansion.js","names":[],"sources":["../../../src/composites/button-group/use-press-expansion.ts"],"sourcesContent":["'use client';\n\nimport { useLayoutEffect, type RefObject } from 'react';\nimport { OVERFLOW_HIDDEN } from './use-overflow';\n\n/**\n * Set on the group while it sizes its items inline. A connected group, a grid at rest, is\n * then a flex row (`data-pinned:flex`), since the bump animates its items' `flex-basis`.\n */\nconst PINNED = 'data-pinned';\n\ninterface Pinned {\n  /** Width at rest, before the group changed it. */\n  rest: number;\n  /** How much the item may give up to a pressed neighbour. */\n  limit: number;\n  /** The consumer's inline `flex` and `min-width`, restored afterwards. */\n  flex: string;\n  minWidth: string;\n}\n\n/**\n * An item's layout width, and how much of it the item may give up: half the space around its\n * content (Compose's compression limit). Both ignore transforms, such as a scaled ancestor,\n * since the group sets layout widths. The used `width` is in the item's own box sizing, as\n * `flex-basis` is.\n */\nfunction measure(element: HTMLElement): { rest: number; limit: number } {\n  const box = element.getBoundingClientRect().width;\n  const layout = Number.parseFloat(getComputedStyle(element).width);\n  const width = Number.isFinite(layout) ? layout : box;\n  const scale = box > 0 ? width / box : 1;\n  const content = element.firstElementChild\n    ? element.firstElementChild.getBoundingClientRect().width * scale\n    : width;\n  return { rest: width, limit: Math.max(0, (width - content) / 2) };\n}\n\n/**\n * Changes an item's sizing without animating it. Pinning swaps the consumer's sizing (such as\n * a connected group's `flex: 1 1 0%`) for its measured width in px, and unpinning swaps it\n * back: the layout is the same either way, but the `container-motion` utility transitions\n * `flex-basis`, which would run from 0% to the px width (the item collapsing first) or back.\n * The change is flushed to style and its transition finished, so only the moves between the\n * rest and bumped widths animate.\n */\nfunction resizeInstantly(element: HTMLElement, flex: string, minWidth: string) {\n  element.style.flex = flex;\n  element.style.minWidth = minWidth;\n  void getComputedStyle(element).flexBasis;\n  if (typeof element.getAnimations !== 'function') return;\n  for (const animation of element.getAnimations()) {\n    if (animation instanceof CSSTransition && animation.transitionProperty === 'flex-basis') {\n      animation.finish();\n    }\n  }\n}\n\n/**\n * How long the release takes to settle, in ms. The token is a CSS time, which a minified\n * stylesheet may write in seconds (`.36s` for `360ms`).\n */\nfunction settleDuration(element: HTMLElement): number {\n  const value = getComputedStyle(element)\n    .getPropertyValue('--md-sys-motion-spring-spatial-fast-duration')\n    .trim();\n  const time = Number.parseFloat(value);\n  const ms = value.endsWith('ms') ? time : time * 1000;\n  return (Number.isFinite(ms) ? ms : 400) + 50;\n}\n\n/**\n * M3 Expressive button group interaction (Compose `ButtonGroup`): the pressed item grows\n * by `expandedRatio` of its width and its neighbours shrink by the same amount, each by\n * at most their own compression limit, so the group's total width stays the same.\n *\n * Watches the public `data-pressed` attribute of the group's direct children and animates\n * their `flex-basis` (the `container-motion` utility transitions it on the fast spatial\n * spring), with `data-pinned` on the group while any item is pinned. At rest no inline sizing remains, so consumer sizing such as `flex-1` applies;\n * the switches between that sizing and the pinned px widths don't animate (2026-10-14).\n * Buttons folded into the overflow menu don't take part. Under reduced motion there's no\n * bump at all: it's movement that only decorates the press (architecture §6).\n */\nexport function usePressExpansion(groupRef: RefObject<HTMLElement | null>, expandedRatio: number) {\n  useLayoutEffect(() => {\n    const group = groupRef.current;\n    if (!group || expandedRatio <= 0) return;\n\n    const pinned = new Map<HTMLElement, Pinned>();\n    let pressed: HTMLElement | null = null;\n    let settle: ReturnType<typeof setTimeout> | undefined;\n\n    const pin = (element: HTMLElement, size: { rest: number; limit: number }): Pinned => {\n      const existing = pinned.get(element);\n      if (existing) return existing;\n      const entry = {\n        rest: size.rest,\n        limit: size.limit,\n        flex: element.style.flex,\n        minWidth: element.style.minWidth,\n      };\n      // Like Compose, the group sets exact widths: a shrinking neighbour may go below its\n      // minimum width, its label overlapping the padding it gives up.\n      resizeInstantly(element, `0 0 ${entry.rest}px`, '0px');\n      pinned.set(element, entry);\n      return entry;\n    };\n\n    // Every item at once, in one task, so no frame shows some of them unpinned.\n    const unpin = () => {\n      for (const [element, entry] of pinned) resizeInstantly(element, entry.flex, entry.minWidth);\n      pinned.clear();\n      group.removeAttribute(PINNED);\n    };\n\n    // Unpins once the release's `flex-basis` transitions have ended. They end later than the\n    // spring's duration when a busy main thread started them late, and unpinning then would\n    // snap each item the rest of the way (2026-10-17). A new press cancels the wait.\n    let releases = 0;\n    const unpinWhenSettled = () => {\n      const release = releases;\n      const running = [...pinned.keys()].flatMap((element) =>\n        typeof element.getAnimations === 'function'\n          ? element\n              .getAnimations()\n              .filter(\n                (animation) =>\n                  animation instanceof CSSTransition &&\n                  animation.transitionProperty === 'flex-basis' &&\n                  animation.playState === 'running',\n              )\n          : [],\n      );\n      if (running.length === 0) {\n        unpin();\n        return;\n      }\n      void Promise.allSettled(running.map((animation) => animation.finished)).then(() => {\n        if (release === releases) unpin();\n      });\n    };\n\n    // Back to the rest widths, then unpinned once that has settled.\n    const release = () => {\n      const [first] = pinned.keys();\n      if (!first) return;\n      for (const [element, entry] of pinned) element.style.flexBasis = `${entry.rest}px`;\n      clearTimeout(settle);\n      releases++;\n      settle = setTimeout(unpinWhenSettled, settleDuration(first));\n    };\n\n    const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');\n    const update = () => {\n      const items = ([...group.children] as HTMLElement[]).filter(\n        (element) => !element.hasAttribute(OVERFLOW_HIDDEN),\n      );\n      const next =\n        items.find((el) => el.hasAttribute('data-pressed') && !el.hasAttribute('data-disabled')) ??\n        null;\n      if (next === pressed) return;\n      pressed = next;\n      release();\n      if (!next || items.length < 2 || reducedMotion.matches) return;\n      clearTimeout(settle);\n      releases++;\n\n      const index = items.indexOf(next);\n      const neighbours = [items[index - 1], items[index + 1]].filter(\n        (el): el is HTMLElement => el !== undefined,\n      );\n      // Pin every item at its current width first (instantly) so the change to the target\n      // widths animates. Every item is measured before any is pinned, and every item is\n      // pinned, not only the ones that move: in a group sized by its content (`w-fit`) the\n      // group's width, and so the other items', depends on how each item is sized.\n      const sizes = items.map((el) => pinned.get(el) ?? measure(el));\n      // A connected group lays its items out as a grid; pinned, it's a flex row of the same\n      // widths, so their `flex-basis` can animate.\n      group.setAttribute(PINNED, '');\n      const entries = new Map(items.map((el, i) => [el, pin(el, sizes[i]!)]));\n\n      // Compose: a middle item grows by min(ratio × width / 2, both neighbours' limits) on\n      // each side; an end item by min(ratio × width, its neighbour's limit) on one side.\n      const width = entries.get(next)!.rest;\n      const share = neighbours.length === 2 ? (expandedRatio * width) / 2 : expandedRatio * width;\n      const growthPerSide = Math.min(\n        share,\n        ...neighbours.map((neighbour) => entries.get(neighbour)!.limit),\n      );\n      let growth = 0;\n      for (const neighbour of neighbours) {\n        const neighbourWidth = entries.get(neighbour)!.rest;\n        const give = Math.min(growthPerSide, neighbourWidth);\n        neighbour.style.flexBasis = `${neighbourWidth - give}px`;\n        growth += give;\n      }\n      next.style.flexBasis = `${width + growth}px`;\n    };\n\n    const observer = new MutationObserver((records) => {\n      if (records.some((record) => (record.target as Element).parentElement === group)) update();\n    });\n    observer.observe(group, { subtree: true, attributes: true, attributeFilter: ['data-pressed'] });\n\n    return () => {\n      observer.disconnect();\n      clearTimeout(settle);\n      releases++;\n      unpin();\n    };\n  }, [groupRef, expandedRatio]);\n}\n"],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,142 @@
+import { BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, BuiltInThemeName, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, ColorMode, ColorRole, ContrastLevel, CustomColorName, DEFAULT_CUSTOM_COLORS, DEFAULT_THEME, PALETTE_NAMES, PaletteName, PaletteSource, ResolvedColorMode, SCHEME_VARIANTS, SchemeVariant, ThemePalettes, ThemeSeed } from "./tokens/color.js";
+import { DEFAULT_DENSITY, DENSITIES, Density, densityAttribute, isDensity } from "./tokens/density.js";
+import { DEFAULT_MOTION_SCHEME, LEGACY_DURATIONS, LEGACY_EASINGS, MOTION_SCHEMES, MotionScheme, MotionSpring, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, SpringFamily, SpringSpeed, SpringToken, springPosition, springSettleDuration, springToLinearEasing, toMotionSpring } from "./tokens/motion.js";
+import { CreateThemeOptions, ThemeDefinition, createTheme } from "./theme/create-theme.js";
+import { DEFAULT_STORAGE_KEY, DEFAULT_THEME_STATE, ThemeState, ThemeStorage, parseThemeState, serializeThemeState, themeAttributes } from "./theme/state.js";
+import { ThemeProvider, ThemeProviderProps } from "./theme/ThemeProvider.js";
+import { ThemeScope, ThemeScopeProps } from "./theme/ThemeScope.js";
+import { ThemeScript, ThemeScriptProps, getThemeScriptSource } from "./theme/ThemeScript.js";
+import { ThemeContextValue, useTheme, useThemeScope } from "./theme/context.js";
+import { getM3Spring } from "./motion/get-m3-spring.js";
+import { useM3Spring } from "./motion/use-m3-spring.js";
+import { cn, twMergeConfig } from "./utils/cn.js";
+import { VariantProps, tv } from "./utils/tv.js";
+import { BREAKPOINTS, BREAKPOINT_NAMES, BreakpointName } from "./tokens/breakpoints.js";
+import { ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, ElevationLevel, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY } from "./tokens/elevation.js";
+import { CORNERS, CORNER_NAMES, CornerName } from "./tokens/shape.js";
+import { FOCUS_INDICATOR, STATE_OPACITIES, StateName } from "./tokens/state.js";
+import { TYPEFACES, TYPE_ROLES, TYPE_SCALE, TypeRole, TypeStyle, Typeface } from "./tokens/typography.js";
+import { ZIndexName, Z_INDEX } from "./tokens/z-index.js";
+import { ComponentToken, ComponentTokenScope, ComponentTokenSet, PublicComponentToken, TokenPaints, TokenValue, color, colorAt, componentTokenList, componentTokensCss, corner, defineComponentTokens, elevation, isComponentTokenSet, px, spring, typeTokens, typescale } from "./tokens/component.js";
+import { ToggleGroupStateContext } from "./primitives/ButtonBase.js";
+import { ButtonShape, ButtonSize, ButtonStyleProps, ButtonVariant, buttonStyles, buttonVariantClasses } from "./components/button/button-styles.js";
+import { ButtonLabels } from "./components/button/button-pending.js";
+import { Button, ButtonActionProps, ButtonClassNames, ButtonLinkProps, ButtonProps, ButtonToggleProps } from "./components/button/Button.js";
+import { IconButtonStyleProps, IconButtonVariant, IconButtonWidth, iconButtonStyles } from "./components/icon-button/icon-button-styles.js";
+import { ButtonContext, ButtonContextValue } from "./components/button/ButtonContext.js";
+import { buttonTokenSet } from "./components/button/button-tokens.js";
+import { IconTransition } from "./primitives/icon-faces-styles.js";
+import { IconButton, IconButtonActionProps, IconButtonClassNames, IconButtonLinkProps, IconButtonProps, IconButtonToggleProps } from "./components/icon-button/IconButton.js";
+import { iconButtonTokenSet } from "./components/icon-button/icon-button-tokens.js";
+import { buttonGroupStyles } from "./composites/button-group/button-group-styles.js";
+import { ButtonGroup, ButtonGroupClassNames, ButtonGroupLabels, ButtonGroupProps, ButtonGroupSelectionMode, ButtonGroupVariant } from "./composites/button-group/ButtonGroup.js";
+import { ExtendedFabSize, ExtendedFabStyleProps, FabColor, FabElevation, FabSize, FabStyleProps, extendedFabStyles, fabStyles } from "./components/fab/fab-styles.js";
+import { ExtendedFab, ExtendedFabClassNames, ExtendedFabProps, Fab, FabClassNames, FabProps } from "./components/fab/Fab.js";
+import { extendedFabTokenSet, fabTokenSet } from "./components/fab/fab-tokens.js";
+import { CircularProgressIndicator, CircularProgressIndicatorClassNames, CircularProgressIndicatorProps, LinearProgressIndicator, LinearProgressIndicatorClassNames, LinearProgressIndicatorProps } from "./components/progress/ProgressIndicator.js";
+import { CircularProgressStyleProps, LinearProgressStyleProps, circularProgressStyles, linearProgressStyles } from "./components/progress/progress-styles.js";
+import { progressIndicatorTokenSet } from "./components/progress/progress-tokens.js";
+import { TooltipPlacement, TooltipPlacementContext } from "./components/tooltip/tooltip-placement.js";
+import { TooltipTrigger, TooltipTriggerProps } from "./components/tooltip/tooltip-trigger.js";
+import { RichTooltip, RichTooltipClassNames, RichTooltipProps, RichTooltipTrigger, RichTooltipTriggerProps, Tooltip, TooltipClassNames, TooltipProps } from "./components/tooltip/Tooltip.js";
+import { RichTooltipStyleProps, richTooltipStyles, tooltipStyles } from "./components/tooltip/tooltip-styles.js";
+import { plainTooltipTokenSet, richTooltipTokenSet } from "./components/tooltip/tooltip-tokens.js";
+import { ShowSnackbarOptions, SnackbarData, SnackbarDuration, SnackbarHostState, SnackbarResult, SnackbarVisuals } from "./components/snackbar/snackbar-state.js";
+import { Snackbar, SnackbarClassNames, SnackbarHost, SnackbarHostProps, SnackbarLabels, SnackbarProps, useSnackbarHostState } from "./components/snackbar/Snackbar.js";
+import { SnackbarStyleProps, snackbarHostStyles, snackbarStyles } from "./components/snackbar/snackbar-styles.js";
+import { snackbarTokenSet } from "./components/snackbar/snackbar-tokens.js";
+import { Badge, BadgeClassNames, BadgeLabels, BadgeProps, BadgedBox, BadgedBoxClassNames, BadgedBoxProps } from "./components/badge/Badge.js";
+import { NavItemLayout, navItemStyles } from "./components/navigation/nav-item-styles.js";
+import { NavItemClassNames } from "./components/navigation/NavItem.js";
+import { NavigationRail, NavigationRailClassNames, NavigationRailItem, NavigationRailItemProps, NavigationRailProps } from "./components/navigation/NavigationRail.js";
+import { NavigationBarArrangement, NavigationBarStyleProps, navigationBarStyles, navigationRailStyles } from "./components/navigation/navigation-styles.js";
+import { NavigationBar, NavigationBarClassNames, NavigationBarItem, NavigationBarItemProps, NavigationBarProps } from "./components/navigation/NavigationBar.js";
+import { navBarTokenSet, navRailTokenSet } from "./components/navigation/navigation-tokens.js";
+import { TabsStyleProps, TabsVariant, tabsStyles } from "./components/tabs/tabs-styles.js";
+import { Tab, TabProps, Tabs, TabsClassNames, TabsProps } from "./components/tabs/Tabs.js";
+import { tabsTokenSet } from "./components/tabs/tabs-tokens.js";
+import { ChipOutline, ChipSetLayout, ChipStyleProps, chipSetStyles, chipStyles } from "./components/chip/chip-styles.js";
+import { AssistChip, AssistChipProps, ChipClassNames, ChipLabels, FilterChip, FilterChipClassNames, FilterChipProps, InputChip, InputChipClassNames, InputChipProps, SuggestionChip, SuggestionChipProps } from "./components/chip/Chip.js";
+import { ChipSet, ChipSetClassNames, ChipSetProps } from "./components/chip/ChipSet.js";
+import { assistChipTokenSet, filterChipTokenSet, inputChipTokenSet, suggestionChipTokenSet } from "./components/chip/chip-tokens.js";
+import { MenuLayout, MenuStyleProps, MenuVariant, menuStyles } from "./components/menu/menu-styles.js";
+import { ContextMenuTrigger, ContextMenuTriggerProps, MenuTrigger, MenuTriggerProps } from "./components/menu/menu-trigger.js";
+import { Menu, MenuClassNames, MenuGroup, MenuGroupProps, MenuItem, MenuItemProps, MenuKey as Key, MenuLabels, MenuPlacement, MenuPresentation, MenuProps, SubmenuTrigger, SubmenuTriggerProps } from "./components/menu/Menu.js";
+import { SplitButtonSize, SplitButtonStyleProps, SplitButtonVariant, splitButtonStyles } from "./components/split-button/split-button-styles.js";
+import { SplitButton, SplitButtonClassNames, SplitButtonLabels, SplitButtonProps } from "./components/split-button/SplitButton.js";
+import { splitButtonTokenSet } from "./components/split-button/split-button-tokens.js";
+import { FabMenuColor, FabMenuSize, FabMenuStyleProps, fabMenuStyles } from "./components/fab-menu/fab-menu-styles.js";
+import { FabMenu, FabMenuClassNames, FabMenuItem, FabMenuItemClassNames, FabMenuItemProps, FabMenuPresentation, FabMenuProps } from "./components/fab-menu/FabMenu.js";
+import { fabMenuTokenSet } from "./components/fab-menu/fab-menu-tokens.js";
+import { LoadingIndicatorStyleProps, LoadingIndicatorVariant, loadingIndicatorStyles } from "./components/loading-indicator/loading-indicator-styles.js";
+import { LoadingIndicator, LoadingIndicatorClassNames, LoadingIndicatorProps } from "./components/loading-indicator/LoadingIndicator.js";
+import { loadingIndicatorTokenSet } from "./components/loading-indicator/loading-indicator-tokens.js";
+import { PullToRefresh, PullToRefreshClassNames, PullToRefreshLabels, PullToRefreshProps } from "./components/pull-to-refresh/PullToRefresh.js";
+import { pullToRefreshStyles } from "./components/pull-to-refresh/pull-to-refresh-styles.js";
+import { CardStyleProps, CardVariant, cardStyles } from "./components/card/card-styles.js";
+import { Card, CardActionProps, CardLinkProps, CardProps, CardStaticProps } from "./components/card/Card.js";
+import { cardTokenSet } from "./components/card/card-tokens.js";
+import { TextFieldStyleProps, TextFieldVariant, textFieldStyles } from "./components/text-field/text-field-styles.js";
+import { TextField, TextFieldClassNames, TextFieldLabels, TextFieldProps } from "./components/text-field/TextField.js";
+import { AutocompleteItem, AutocompleteSection, OptionItemProps, OptionPopover, OptionSectionProps, SelectItem, SelectSection } from "./components/select/option-list.js";
+import { Select, SelectClassNames, SelectKey, SelectLabels, SelectPresentation, SelectProps, SelectedOption } from "./components/select/Select.js";
+import { Autocomplete, AutocompleteClassNames, AutocompleteKey, AutocompleteLabels, AutocompleteProps } from "./components/autocomplete/Autocomplete.js";
+import { matchesSearch, normalizeSearch } from "./utils/search.js";
+import { textFieldTokenSet } from "./components/text-field/text-field-tokens.js";
+import { Checkbox, CheckboxClassNames, CheckboxProps } from "./components/checkbox/Checkbox.js";
+import { CheckboxStyleProps, checkboxStyles } from "./components/checkbox/checkbox-styles.js";
+import { checkboxTokenSet } from "./components/checkbox/checkbox-tokens.js";
+import { Radio, RadioClassNames, RadioGroup, RadioGroupClassNames, RadioGroupProps, RadioProps } from "./components/radio/RadioGroup.js";
+import { RadioGroupStyleProps, RadioStyleProps, radioGroupStyles, radioStyles } from "./components/radio/radio-styles.js";
+import { radioTokenSet } from "./components/radio/radio-tokens.js";
+import { Switch, SwitchClassNames, SwitchProps } from "./components/switch/Switch.js";
+import { SwitchStyleProps, switchStyles } from "./components/switch/switch-styles.js";
+import { switchTokenSet } from "./components/switch/switch-tokens.js";
+import { ClosedBy } from "./utils/closed-by.js";
+import { Dialog, DialogActions, DialogActionsProps, DialogClassNames, DialogContent, DialogContentProps, DialogFullScreen, DialogHeader, DialogHeaderClassNames, DialogHeaderLabels, DialogHeaderProps, DialogOrigin, DialogPlacement, DialogProps, DialogRenderProps, DialogTitle, DialogTitleProps, DialogTransition, DialogTrigger, DialogTriggerProps } from "./components/dialog/Dialog.js";
+import { DialogStyleProps, dialogStyles } from "./components/dialog/dialog-styles.js";
+import { dialogTokenSet } from "./components/dialog/dialog-tokens.js";
+import { menuTokenSet } from "./components/menu/menu-tokens.js";
+import { DockedToolbarArrangement, DockedToolbarColor, DockedToolbarStyleProps, FloatingToolbarColor, FloatingToolbarStyleProps, ToolbarExitEdge, ToolbarOrientation, dockedToolbarStyles, floatingToolbarStyles, toolbarFabStyles } from "./components/toolbar/toolbar-styles.js";
+import { DockedToolbar, DockedToolbarClassNames, DockedToolbarProps, FloatingToolbar, FloatingToolbarClassNames, FloatingToolbarProps, ToolbarFab, ToolbarFabClassNames, ToolbarFabProps } from "./components/toolbar/Toolbar.js";
+import { dockedToolbarTokenSet, floatingToolbarTokenSet, toolbarFabTokenSet } from "./components/toolbar/toolbar-tokens.js";
+import { ToolbarScrollExitOptions, ToolbarScrollExpansionOptions, useToolbarScrollExit, useToolbarScrollExpansion } from "./components/toolbar/use-toolbar-scroll-expansion.js";
+import { TopAppBarStyleProps, TopAppBarTitleAlign, TopAppBarVariant, topAppBarStyles } from "./components/app-bar/app-bar-styles.js";
+import { TopAppBarScrollBehavior } from "./components/app-bar/use-app-bar-scroll.js";
+import { TopAppBar, TopAppBarClassNames, TopAppBarProps, TopAppBarScrolledColor } from "./components/app-bar/TopAppBar.js";
+import { appBarTokenSet } from "./components/app-bar/app-bar-tokens.js";
+import { SearchBar, SearchBarClassNames, SearchBarIconState, SearchBarInputProps, SearchBarProps, SearchBarView } from "./components/search/SearchBar.js";
+import { SearchAppBar, SearchAppBarClassNames, SearchAppBarProps } from "./components/search/SearchAppBar.js";
+import { SearchAppBarStyleProps, SearchBarStyleProps, searchAppBarStyles, searchBarStyles } from "./components/search/search-styles.js";
+import { searchBarTokenSet, searchViewTokenSet } from "./components/search/search-tokens.js";
+import { DividerInset, DividerOrientation, DividerStyleProps, dividerStyles, labeledDividerStyles } from "./components/divider/divider-styles.js";
+import { Divider, DividerProps, LabeledDivider, LabeledDividerClassNames, LabeledDividerProps } from "./components/divider/Divider.js";
+import { dividerTokenSet } from "./components/divider/divider-tokens.js";
+import { BadgeStyleProps, badgeStyles, badgedBoxStyles } from "./components/badge/badge-styles.js";
+import { badgeTokenSet } from "./components/badge/badge-tokens.js";
+import { ListDividers, ListStyleProps, ListVariant, listMediaStyles, listStyles } from "./components/list/list-styles.js";
+import { LineLimit, List, ListClassNames, ListItem, ListItemProps, ListProps, ListSection, ListSectionProps } from "./components/list/List.js";
+import { ListItemAvatar, ListItemAvatarProps, ListItemImage, ListItemImageProps, ListItemVideo, ListItemVideoProps } from "./components/list/ListMedia.js";
+import { listTokenSet } from "./components/list/list-tokens.js";
+import { SliderOrientation, SliderSize, SliderStyleProps, sliderStyles } from "./components/slider/slider-styles.js";
+import { RangeSlider, RangeSliderLabels, RangeSliderProps, Slider, SliderClassNames, SliderProps } from "./components/slider/Slider.js";
+import { sliderTokenSet } from "./components/slider/slider-tokens.js";
+import { SheetTrigger, SheetTriggerProps } from "./components/sheet/SheetTrigger.js";
+import { BottomSheet, BottomSheetClassNames, BottomSheetDetent, BottomSheetLabels, BottomSheetProps } from "./components/sheet/BottomSheet.js";
+import { SideSheet, SideSheetClassNames, SideSheetLabels, SideSheetProps } from "./components/sheet/SideSheet.js";
+import { BottomSheetStyleProps, SideSheetStyleProps, bottomSheetStyles, sideSheetStyles } from "./components/sheet/sheet-styles.js";
+import { bottomSheetTokenSet, sideSheetTokenSet } from "./components/sheet/sheet-tokens.js";
+import { Carousel, CarouselClassNames, CarouselProps } from "./components/carousel/Carousel.js";
+import { CarouselStyleProps, carouselStyles } from "./components/carousel/carousel-styles.js";
+import { carouselTokenSet } from "./components/carousel/carousel-tokens.js";
+import { DateInputLabels } from "./components/date-picker/DateInput.js";
+import { DatePicker, DatePickerClassNames, DatePickerLabels, DatePickerProps, DateRange, DateRangePicker, DateRangePickerClassNames, DateRangePickerProps } from "./components/date-picker/DatePicker.js";
+import { DatePickerStyleProps, datePickerStyles, dockedDatePickerStyles } from "./components/date-picker/date-picker-styles.js";
+import { datePickerTokenSet } from "./components/date-picker/date-picker-tokens.js";
+import { DateField, DateFieldClassNames, DateFieldLabels, DateFieldProps } from "./components/date-picker/DateField.js";
+import { PickerDialog, PickerDialogClassNames, PickerDialogLabels, PickerDialogProps } from "./components/date-picker/PickerDialog.js";
+import { pickerDialogStyles } from "./components/date-picker/picker-dialog-styles.js";
+import { TimePicker, TimePickerClassNames, TimePickerLabels, TimePickerMode, TimePickerModeToggle, TimePickerModeToggleProps, TimePickerProps, useTimePickerRoom } from "./components/time-picker/TimePicker.js";
+import { TimePickerStyleProps, timePickerStyles } from "./components/time-picker/time-picker-styles.js";
+import { timePickerTokenSet } from "./components/time-picker/time-picker-tokens.js";
+export { AssistChip, type AssistChipProps, Autocomplete, type AutocompleteClassNames, AutocompleteItem, type AutocompleteKey, type AutocompleteLabels, type AutocompleteProps, AutocompleteSection, BREAKPOINTS, BREAKPOINT_NAMES, BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, Badge, type BadgeClassNames, type BadgeLabels, type BadgeProps, type BadgeStyleProps, BadgedBox, type BadgedBoxClassNames, type BadgedBoxProps, BottomSheet, type BottomSheetClassNames, type BottomSheetDetent, type BottomSheetLabels, type BottomSheetProps, type BottomSheetStyleProps, BreakpointName, BuiltInThemeName, Button, type ButtonActionProps, type ButtonClassNames, ButtonContext, type ButtonContextValue, ButtonGroup, type ButtonGroupClassNames, type ButtonGroupLabels, type ButtonGroupProps, type ButtonGroupSelectionMode, type ButtonGroupVariant, type ButtonLabels, type ButtonLinkProps, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonStyleProps, type ButtonToggleProps, type ButtonVariant, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CORNERS, CORNER_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, Card, type CardActionProps, type CardLinkProps, type CardProps, type CardStaticProps, type CardStyleProps, type CardVariant, Carousel, type CarouselClassNames, type CarouselProps, type CarouselStyleProps, Checkbox, type CheckboxClassNames, type CheckboxProps, type CheckboxStyleProps, type ChipClassNames, type ChipLabels, type ChipOutline, ChipSet, type ChipSetClassNames, type ChipSetLayout, type ChipSetProps, type ChipStyleProps, CircularProgressIndicator, type CircularProgressIndicatorClassNames, type CircularProgressIndicatorProps, type CircularProgressStyleProps, type ClosedBy, ColorMode, ColorRole, type ComponentToken, type ComponentTokenScope, type ComponentTokenSet, ContextMenuTrigger, type ContextMenuTriggerProps, ContrastLevel, CornerName, type CreateThemeOptions, CustomColorName, DEFAULT_CUSTOM_COLORS, DEFAULT_DENSITY, DEFAULT_MOTION_SCHEME, DEFAULT_STORAGE_KEY, DEFAULT_THEME, DEFAULT_THEME_STATE, DENSITIES, DateField, type DateFieldClassNames, type DateFieldLabels, type DateFieldProps, type DateInputLabels, DatePicker, type DatePickerClassNames, type DatePickerLabels, type DatePickerProps, type DatePickerStyleProps, type DateRange, DateRangePicker, type DateRangePickerClassNames, type DateRangePickerProps, Density, Dialog, DialogActions, type DialogActionsProps, type DialogClassNames, DialogContent, type DialogContentProps, type DialogFullScreen, DialogHeader, type DialogHeaderClassNames, type DialogHeaderLabels, type DialogHeaderProps, type DialogOrigin, type DialogPlacement, type DialogProps, type DialogRenderProps, type DialogStyleProps, DialogTitle, type DialogTitleProps, type DialogTransition, DialogTrigger, type DialogTriggerProps, Divider, type DividerInset, type DividerOrientation, type DividerProps, type DividerStyleProps, DockedToolbar, type DockedToolbarArrangement, type DockedToolbarClassNames, type DockedToolbarColor, type DockedToolbarProps, type DockedToolbarStyleProps, ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, ElevationLevel, ExtendedFab, type ExtendedFabClassNames, type ExtendedFabProps, type ExtendedFabSize, type ExtendedFabStyleProps, FOCUS_INDICATOR, Fab, type FabClassNames, type FabColor, type FabElevation, FabMenu, type FabMenuClassNames, type FabMenuColor, FabMenuItem, type FabMenuItemClassNames, type FabMenuItemProps, type FabMenuPresentation, type FabMenuProps, type FabMenuSize, type FabMenuStyleProps, type FabProps, type FabSize, type FabStyleProps, FilterChip, type FilterChipClassNames, type FilterChipProps, FloatingToolbar, type FloatingToolbarClassNames, type FloatingToolbarColor, type FloatingToolbarProps, type FloatingToolbarStyleProps, IconButton, type IconButtonActionProps, type IconButtonClassNames, type IconButtonLinkProps, type IconButtonProps, type IconButtonStyleProps, type IconButtonToggleProps, type IconButtonVariant, type IconButtonWidth, type IconTransition, InputChip, type InputChipClassNames, type InputChipProps, LEGACY_DURATIONS, LEGACY_EASINGS, LabeledDivider, type LabeledDividerClassNames, type LabeledDividerProps, type LineLimit, LinearProgressIndicator, type LinearProgressIndicatorClassNames, type LinearProgressIndicatorProps, type LinearProgressStyleProps, List, type ListClassNames, type ListDividers, ListItem, ListItemAvatar, type ListItemAvatarProps, ListItemImage, type ListItemImageProps, type ListItemProps, ListItemVideo, type ListItemVideoProps, type ListProps, ListSection, type ListSectionProps, type ListStyleProps, type ListVariant, LoadingIndicator, type LoadingIndicatorClassNames, type LoadingIndicatorProps, type LoadingIndicatorStyleProps, type LoadingIndicatorVariant, MOTION_SCHEMES, Menu, type MenuClassNames, MenuGroup, type MenuGroupProps, MenuItem, type MenuItemProps, type Key as MenuKey, type MenuLabels, type MenuLayout, type MenuPlacement, type MenuPresentation, type MenuProps, type MenuStyleProps, MenuTrigger, type MenuTriggerProps, type MenuVariant, MotionScheme, MotionSpring, type NavItemClassNames, type NavItemLayout, NavigationBar, type NavigationBarArrangement, type NavigationBarClassNames, NavigationBarItem, type NavigationBarItemProps, type NavigationBarProps, type NavigationBarStyleProps, NavigationRail, type NavigationRailClassNames, NavigationRailItem, type NavigationRailItemProps, type NavigationRailProps, type OptionItemProps, OptionPopover, type OptionSectionProps, PALETTE_NAMES, PaletteName, PaletteSource, PickerDialog, type PickerDialogClassNames, type PickerDialogLabels, type PickerDialogProps, type PublicComponentToken, PullToRefresh, type PullToRefreshClassNames, type PullToRefreshLabels, type PullToRefreshProps, Radio, type RadioClassNames, RadioGroup, type RadioGroupClassNames, type RadioGroupProps, type RadioGroupStyleProps, type RadioProps, type RadioStyleProps, RangeSlider, type RangeSliderLabels, type RangeSliderProps, ResolvedColorMode, RichTooltip, type RichTooltipClassNames, type RichTooltipProps, type RichTooltipStyleProps, RichTooltipTrigger, type RichTooltipTriggerProps, SCHEME_VARIANTS, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, STATE_OPACITIES, SchemeVariant, SearchAppBar, type SearchAppBarClassNames, type SearchAppBarProps, type SearchAppBarStyleProps, SearchBar, type SearchBarClassNames, type SearchBarIconState, type SearchBarInputProps, type SearchBarProps, type SearchBarStyleProps, type SearchBarView, Select, type SelectClassNames, SelectItem, type SelectKey, type SelectLabels, type SelectPresentation, type SelectProps, SelectSection, type SelectedOption, SheetTrigger, type SheetTriggerProps, type ShowSnackbarOptions, SideSheet, type SideSheetClassNames, type SideSheetLabels, type SideSheetProps, type SideSheetStyleProps, Slider, type SliderClassNames, type SliderOrientation, type SliderProps, type SliderSize, type SliderStyleProps, Snackbar, type SnackbarClassNames, type SnackbarData, type SnackbarDuration, SnackbarHost, type SnackbarHostProps, SnackbarHostState, type SnackbarLabels, type SnackbarProps, type SnackbarResult, type SnackbarStyleProps, type SnackbarVisuals, SplitButton, type SplitButtonClassNames, type SplitButtonLabels, type SplitButtonProps, type SplitButtonSize, type SplitButtonStyleProps, type SplitButtonVariant, SpringFamily, SpringSpeed, SpringToken, StateName, SubmenuTrigger, type SubmenuTriggerProps, SuggestionChip, type SuggestionChipProps, Switch, type SwitchClassNames, type SwitchProps, type SwitchStyleProps, TYPEFACES, TYPE_ROLES, TYPE_SCALE, Tab, type TabProps, Tabs, type TabsClassNames, type TabsProps, type TabsStyleProps, type TabsVariant, TextField, type TextFieldClassNames, type TextFieldLabels, type TextFieldProps, type TextFieldStyleProps, type TextFieldVariant, type ThemeContextValue, type ThemeDefinition, ThemePalettes, ThemeProvider, type ThemeProviderProps, ThemeScope, type ThemeScopeProps, ThemeScript, type ThemeScriptProps, ThemeSeed, type ThemeState, type ThemeStorage, TimePicker, type TimePickerClassNames, type TimePickerLabels, type TimePickerMode, TimePickerModeToggle, type TimePickerModeToggleProps, type TimePickerProps, type TimePickerStyleProps, ToggleGroupStateContext, type TokenPaints, type TokenValue, type ToolbarExitEdge, ToolbarFab, type ToolbarFabClassNames, type ToolbarFabProps, type ToolbarOrientation, type ToolbarScrollExitOptions, type ToolbarScrollExpansionOptions, Tooltip, type TooltipClassNames, type TooltipPlacement, TooltipPlacementContext, type TooltipProps, TooltipTrigger, type TooltipTriggerProps, TopAppBar, type TopAppBarClassNames, type TopAppBarProps, type TopAppBarScrollBehavior, type TopAppBarScrolledColor, type TopAppBarStyleProps, type TopAppBarTitleAlign, type TopAppBarVariant, TypeRole, TypeStyle, Typeface, type VariantProps, ZIndexName, Z_INDEX, appBarTokenSet, assistChipTokenSet, badgeStyles, badgeTokenSet, badgedBoxStyles, bottomSheetStyles, bottomSheetTokenSet, buttonGroupStyles, buttonStyles, buttonTokenSet, buttonVariantClasses, cardStyles, cardTokenSet, carouselStyles, carouselTokenSet, checkboxStyles, checkboxTokenSet, chipSetStyles, chipStyles, circularProgressStyles, cn, color, colorAt, componentTokenList, componentTokensCss, corner, createTheme, datePickerStyles, datePickerTokenSet, defineComponentTokens, densityAttribute, dialogStyles, dialogTokenSet, dividerStyles, dividerTokenSet, dockedDatePickerStyles, dockedToolbarStyles, dockedToolbarTokenSet, elevation, extendedFabStyles, extendedFabTokenSet, fabMenuStyles, fabMenuTokenSet, fabStyles, fabTokenSet, filterChipTokenSet, floatingToolbarStyles, floatingToolbarTokenSet, getM3Spring, getThemeScriptSource, iconButtonStyles, iconButtonTokenSet, inputChipTokenSet, isComponentTokenSet, isDensity, labeledDividerStyles, linearProgressStyles, listMediaStyles, listStyles, listTokenSet, loadingIndicatorStyles, loadingIndicatorTokenSet, matchesSearch, menuStyles, menuTokenSet, navBarTokenSet, navItemStyles, navRailTokenSet, navigationBarStyles, navigationRailStyles, normalizeSearch, parseThemeState, pickerDialogStyles, plainTooltipTokenSet, progressIndicatorTokenSet, pullToRefreshStyles, px, radioGroupStyles, radioStyles, radioTokenSet, richTooltipStyles, richTooltipTokenSet, searchAppBarStyles, searchBarStyles, searchBarTokenSet, searchViewTokenSet, serializeThemeState, sideSheetStyles, sideSheetTokenSet, sliderStyles, sliderTokenSet, snackbarHostStyles, snackbarStyles, snackbarTokenSet, splitButtonStyles, splitButtonTokenSet, spring, springPosition, springSettleDuration, springToLinearEasing, suggestionChipTokenSet, switchStyles, switchTokenSet, tabsStyles, tabsTokenSet, textFieldStyles, textFieldTokenSet, themeAttributes, timePickerStyles, timePickerTokenSet, toMotionSpring, toolbarFabStyles, toolbarFabTokenSet, tooltipStyles, topAppBarStyles, tv, twMergeConfig, typeTokens, typescale, useM3Spring, useSnackbarHostState, useTheme, useThemeScope, useTimePickerRoom, useToolbarScrollExit, useToolbarScrollExpansion };

package/dist/index.js

@@ -0,0 +1,136 @@
+import { BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, DEFAULT_CUSTOM_COLORS, DEFAULT_THEME, PALETTE_NAMES, SCHEME_VARIANTS } from "./tokens/color.js";
+import { DEFAULT_DENSITY, DENSITIES, densityAttribute, isDensity } from "./tokens/density.js";
+import { DEFAULT_MOTION_SCHEME, LEGACY_DURATIONS, LEGACY_EASINGS, MOTION_SCHEMES, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, springPosition, springSettleDuration, springToLinearEasing, toMotionSpring } from "./tokens/motion.js";
+import { DEFAULT_STORAGE_KEY, DEFAULT_THEME_STATE, parseThemeState, serializeThemeState, themeAttributes } from "./theme/state.js";
+import { useTheme, useThemeScope } from "./theme/context.js";
+import { ThemeProvider } from "./theme/ThemeProvider.js";
+import { BREAKPOINTS, BREAKPOINT_NAMES } from "./tokens/breakpoints.js";
+import { ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY } from "./tokens/elevation.js";
+import { CORNERS, CORNER_NAMES } from "./tokens/shape.js";
+import { FOCUS_INDICATOR, STATE_OPACITIES } from "./tokens/state.js";
+import { TYPEFACES, TYPE_ROLES, TYPE_SCALE } from "./tokens/typography.js";
+import { Z_INDEX } from "./tokens/z-index.js";
+import { cn, twMergeConfig } from "./utils/cn.js";
+import { ThemeScope } from "./theme/ThemeScope.js";
+import { ThemeScript, getThemeScriptSource } from "./theme/ThemeScript.js";
+import { createTheme } from "./theme/create-theme.js";
+import { getM3Spring } from "./motion/get-m3-spring.js";
+import { useM3Spring } from "./motion/use-m3-spring.js";
+import { tv } from "./utils/tv.js";
+import { color, colorAt, componentTokenList, componentTokensCss, corner, defineComponentTokens, elevation, isComponentTokenSet, px, spring, typeTokens, typescale } from "./tokens/component.js";
+import { ToggleGroupStateContext } from "./primitives/ButtonBase.js";
+import { buttonStyles, buttonVariantClasses } from "./components/button/button-styles.js";
+import { ButtonContext } from "./components/button/ButtonContext.js";
+import { Button } from "./components/button/Button.js";
+import { buttonTokenSet } from "./components/button/button-tokens.js";
+import { TooltipPlacementContext } from "./components/tooltip/tooltip-placement.js";
+import { TooltipTrigger } from "./components/tooltip/tooltip-trigger.js";
+import { iconButtonStyles } from "./components/icon-button/icon-button-styles.js";
+import { IconButton } from "./components/icon-button/IconButton.js";
+import { iconButtonTokenSet } from "./components/icon-button/icon-button-tokens.js";
+import { buttonGroupStyles } from "./composites/button-group/button-group-styles.js";
+import { ContextMenuTrigger, MenuTrigger } from "./components/menu/menu-trigger.js";
+import { ButtonGroup } from "./composites/button-group/ButtonGroup.js";
+import { extendedFabStyles, fabStyles } from "./components/fab/fab-styles.js";
+import { ExtendedFab, Fab } from "./components/fab/Fab.js";
+import { extendedFabTokenSet, fabTokenSet } from "./components/fab/fab-tokens.js";
+import { circularProgressStyles, linearProgressStyles } from "./components/progress/progress-styles.js";
+import { CircularProgressIndicator, LinearProgressIndicator } from "./components/progress/ProgressIndicator.js";
+import { progressIndicatorTokenSet } from "./components/progress/progress-tokens.js";
+import { richTooltipStyles, tooltipStyles } from "./components/tooltip/tooltip-styles.js";
+import { RichTooltip, RichTooltipTrigger, Tooltip } from "./components/tooltip/Tooltip.js";
+import { plainTooltipTokenSet, richTooltipTokenSet } from "./components/tooltip/tooltip-tokens.js";
+import { SnackbarHostState } from "./components/snackbar/snackbar-state.js";
+import { snackbarHostStyles, snackbarStyles } from "./components/snackbar/snackbar-styles.js";
+import { Snackbar, SnackbarHost, useSnackbarHostState } from "./components/snackbar/Snackbar.js";
+import { snackbarTokenSet } from "./components/snackbar/snackbar-tokens.js";
+import { badgeStyles, badgedBoxStyles } from "./components/badge/badge-styles.js";
+import { Badge, BadgedBox } from "./components/badge/Badge.js";
+import { navItemStyles } from "./components/navigation/nav-item-styles.js";
+import { navigationBarStyles, navigationRailStyles } from "./components/navigation/navigation-styles.js";
+import { NavigationRail, NavigationRailItem } from "./components/navigation/NavigationRail.js";
+import { NavigationBar, NavigationBarItem } from "./components/navigation/NavigationBar.js";
+import { navBarTokenSet, navRailTokenSet } from "./components/navigation/navigation-tokens.js";
+import { tabsStyles } from "./components/tabs/tabs-styles.js";
+import { Tab, Tabs } from "./components/tabs/Tabs.js";
+import { tabsTokenSet } from "./components/tabs/tabs-tokens.js";
+import { chipSetStyles, chipStyles } from "./components/chip/chip-styles.js";
+import { AssistChip, FilterChip, InputChip, SuggestionChip } from "./components/chip/Chip.js";
+import { ChipSet } from "./components/chip/ChipSet.js";
+import { assistChipTokenSet, filterChipTokenSet, inputChipTokenSet, suggestionChipTokenSet } from "./components/chip/chip-tokens.js";
+import { splitButtonStyles } from "./components/split-button/split-button-styles.js";
+import { SplitButton } from "./components/split-button/SplitButton.js";
+import { splitButtonTokenSet } from "./components/split-button/split-button-tokens.js";
+import { dividerStyles, labeledDividerStyles } from "./components/divider/divider-styles.js";
+import { Divider, LabeledDivider } from "./components/divider/Divider.js";
+import { menuStyles } from "./components/menu/menu-styles.js";
+import { Menu, MenuGroup, MenuItem, SubmenuTrigger } from "./components/menu/Menu.js";
+import { fabMenuStyles } from "./components/fab-menu/fab-menu-styles.js";
+import { FabMenu, FabMenuItem } from "./components/fab-menu/FabMenu.js";
+import { fabMenuTokenSet } from "./components/fab-menu/fab-menu-tokens.js";
+import { loadingIndicatorStyles } from "./components/loading-indicator/loading-indicator-styles.js";
+import { LoadingIndicator } from "./components/loading-indicator/LoadingIndicator.js";
+import { loadingIndicatorTokenSet } from "./components/loading-indicator/loading-indicator-tokens.js";
+import { pullToRefreshStyles } from "./components/pull-to-refresh/pull-to-refresh-styles.js";
+import { PullToRefresh } from "./components/pull-to-refresh/PullToRefresh.js";
+import { cardStyles } from "./components/card/card-styles.js";
+import { Card } from "./components/card/Card.js";
+import { cardTokenSet } from "./components/card/card-tokens.js";
+import { textFieldStyles } from "./components/text-field/text-field-styles.js";
+import { TextField } from "./components/text-field/TextField.js";
+import { matchesSearch, normalizeSearch } from "./utils/search.js";
+import { AutocompleteItem, AutocompleteSection, OptionPopover, SelectItem, SelectSection } from "./components/select/option-list.js";
+import { searchAppBarStyles, searchBarStyles } from "./components/search/search-styles.js";
+import { Select } from "./components/select/Select.js";
+import { Autocomplete } from "./components/autocomplete/Autocomplete.js";
+import { textFieldTokenSet } from "./components/text-field/text-field-tokens.js";
+import { checkboxStyles } from "./components/checkbox/checkbox-styles.js";
+import { Checkbox } from "./components/checkbox/Checkbox.js";
+import { checkboxTokenSet } from "./components/checkbox/checkbox-tokens.js";
+import { radioGroupStyles, radioStyles } from "./components/radio/radio-styles.js";
+import { Radio, RadioGroup } from "./components/radio/RadioGroup.js";
+import { radioTokenSet } from "./components/radio/radio-tokens.js";
+import { switchStyles } from "./components/switch/switch-styles.js";
+import { Switch } from "./components/switch/Switch.js";
+import { switchTokenSet } from "./components/switch/switch-tokens.js";
+import { dialogStyles } from "./components/dialog/dialog-styles.js";
+import { Dialog, DialogActions, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from "./components/dialog/Dialog.js";
+import { dialogTokenSet } from "./components/dialog/dialog-tokens.js";
+import { menuTokenSet } from "./components/menu/menu-tokens.js";
+import { dockedToolbarStyles, floatingToolbarStyles, toolbarFabStyles } from "./components/toolbar/toolbar-styles.js";
+import { DockedToolbar, FloatingToolbar, ToolbarFab } from "./components/toolbar/Toolbar.js";
+import { dockedToolbarTokenSet, floatingToolbarTokenSet, toolbarFabTokenSet } from "./components/toolbar/toolbar-tokens.js";
+import { useToolbarScrollExit, useToolbarScrollExpansion } from "./components/toolbar/use-toolbar-scroll-expansion.js";
+import { topAppBarStyles } from "./components/app-bar/app-bar-styles.js";
+import { TopAppBar } from "./components/app-bar/TopAppBar.js";
+import { appBarTokenSet } from "./components/app-bar/app-bar-tokens.js";
+import { SearchBar } from "./components/search/SearchBar.js";
+import { SearchAppBar } from "./components/search/SearchAppBar.js";
+import { searchBarTokenSet, searchViewTokenSet } from "./components/search/search-tokens.js";
+import { dividerTokenSet } from "./components/divider/divider-tokens.js";
+import { badgeTokenSet } from "./components/badge/badge-tokens.js";
+import { listMediaStyles, listStyles } from "./components/list/list-styles.js";
+import { ListItemAvatar, ListItemImage, ListItemVideo } from "./components/list/ListMedia.js";
+import { List, ListItem, ListSection } from "./components/list/List.js";
+import { listTokenSet } from "./components/list/list-tokens.js";
+import { sliderStyles } from "./components/slider/slider-styles.js";
+import { RangeSlider, Slider } from "./components/slider/Slider.js";
+import { sliderTokenSet } from "./components/slider/slider-tokens.js";
+import { SheetTrigger } from "./components/sheet/SheetTrigger.js";
+import { bottomSheetStyles, sideSheetStyles } from "./components/sheet/sheet-styles.js";
+import { BottomSheet } from "./components/sheet/BottomSheet.js";
+import { SideSheet } from "./components/sheet/SideSheet.js";
+import { bottomSheetTokenSet, sideSheetTokenSet } from "./components/sheet/sheet-tokens.js";
+import { carouselStyles } from "./components/carousel/carousel-styles.js";
+import { Carousel } from "./components/carousel/Carousel.js";
+import { carouselTokenSet } from "./components/carousel/carousel-tokens.js";
+import { datePickerStyles, dockedDatePickerStyles } from "./components/date-picker/date-picker-styles.js";
+import { DatePicker, DateRangePicker } from "./components/date-picker/DatePicker.js";
+import { datePickerTokenSet } from "./components/date-picker/date-picker-tokens.js";
+import { DateField } from "./components/date-picker/DateField.js";
+import { pickerDialogStyles } from "./components/date-picker/picker-dialog-styles.js";
+import { PickerDialog } from "./components/date-picker/PickerDialog.js";
+import { timePickerStyles } from "./components/time-picker/time-picker-styles.js";
+import { TimePicker, TimePickerModeToggle, useTimePickerRoom } from "./components/time-picker/TimePicker.js";
+import { timePickerTokenSet } from "./components/time-picker/time-picker-tokens.js";
+export { AssistChip, Autocomplete, AutocompleteItem, AutocompleteSection, BREAKPOINTS, BREAKPOINT_NAMES, BUILT_IN_THEMES, BUILT_IN_THEME_NAMES, Badge, BadgedBox, BottomSheet, Button, ButtonContext, ButtonGroup, COLOR_MODES, COLOR_ROLES, CONTRAST_LEVELS, CONTRAST_LEVEL_NAMES, CORNERS, CORNER_NAMES, CUSTOM_COLORS, CUSTOM_COLOR_ROLES, Card, Carousel, Checkbox, ChipSet, CircularProgressIndicator, ContextMenuTrigger, DEFAULT_CUSTOM_COLORS, DEFAULT_DENSITY, DEFAULT_MOTION_SCHEME, DEFAULT_STORAGE_KEY, DEFAULT_THEME, DEFAULT_THEME_STATE, DENSITIES, DateField, DatePicker, DateRangePicker, Dialog, DialogActions, DialogContent, DialogHeader, DialogTitle, DialogTrigger, Divider, DockedToolbar, ELEVATION_LEVELS, ELEVATION_LEVEL_NAMES, ExtendedFab, FOCUS_INDICATOR, Fab, FabMenu, FabMenuItem, FilterChip, FloatingToolbar, IconButton, InputChip, LEGACY_DURATIONS, LEGACY_EASINGS, LabeledDivider, LinearProgressIndicator, List, ListItem, ListItemAvatar, ListItemImage, ListItemVideo, ListSection, LoadingIndicator, MOTION_SCHEMES, Menu, MenuGroup, MenuItem, MenuTrigger, NavigationBar, NavigationBarItem, NavigationRail, NavigationRailItem, OptionPopover, PALETTE_NAMES, PickerDialog, PullToRefresh, Radio, RadioGroup, RangeSlider, RichTooltip, RichTooltipTrigger, SCHEME_VARIANTS, SHADOW_AMBIENT_OPACITY, SHADOW_KEY_OPACITY, SPRINGS, SPRING_FAMILIES, SPRING_SPEEDS, SPRING_TOKEN_NAMES, STATE_OPACITIES, SearchAppBar, SearchBar, Select, SelectItem, SelectSection, SheetTrigger, SideSheet, Slider, Snackbar, SnackbarHost, SnackbarHostState, SplitButton, SubmenuTrigger, SuggestionChip, Switch, TYPEFACES, TYPE_ROLES, TYPE_SCALE, Tab, Tabs, TextField, ThemeProvider, ThemeScope, ThemeScript, TimePicker, TimePickerModeToggle, ToggleGroupStateContext, ToolbarFab, Tooltip, TooltipPlacementContext, TooltipTrigger, TopAppBar, Z_INDEX, appBarTokenSet, assistChipTokenSet, badgeStyles, badgeTokenSet, badgedBoxStyles, bottomSheetStyles, bottomSheetTokenSet, buttonGroupStyles, buttonStyles, buttonTokenSet, buttonVariantClasses, cardStyles, cardTokenSet, carouselStyles, carouselTokenSet, checkboxStyles, checkboxTokenSet, chipSetStyles, chipStyles, circularProgressStyles, cn, color, colorAt, componentTokenList, componentTokensCss, corner, createTheme, datePickerStyles, datePickerTokenSet, defineComponentTokens, densityAttribute, dialogStyles, dialogTokenSet, dividerStyles, dividerTokenSet, dockedDatePickerStyles, dockedToolbarStyles, dockedToolbarTokenSet, elevation, extendedFabStyles, extendedFabTokenSet, fabMenuStyles, fabMenuTokenSet, fabStyles, fabTokenSet, filterChipTokenSet, floatingToolbarStyles, floatingToolbarTokenSet, getM3Spring, getThemeScriptSource, iconButtonStyles, iconButtonTokenSet, inputChipTokenSet, isComponentTokenSet, isDensity, labeledDividerStyles, linearProgressStyles, listMediaStyles, listStyles, listTokenSet, loadingIndicatorStyles, loadingIndicatorTokenSet, matchesSearch, menuStyles, menuTokenSet, navBarTokenSet, navItemStyles, navRailTokenSet, navigationBarStyles, navigationRailStyles, normalizeSearch, parseThemeState, pickerDialogStyles, plainTooltipTokenSet, progressIndicatorTokenSet, pullToRefreshStyles, px, radioGroupStyles, radioStyles, radioTokenSet, richTooltipStyles, richTooltipTokenSet, searchAppBarStyles, searchBarStyles, searchBarTokenSet, searchViewTokenSet, serializeThemeState, sideSheetStyles, sideSheetTokenSet, sliderStyles, sliderTokenSet, snackbarHostStyles, snackbarStyles, snackbarTokenSet, splitButtonStyles, splitButtonTokenSet, spring, springPosition, springSettleDuration, springToLinearEasing, suggestionChipTokenSet, switchStyles, switchTokenSet, tabsStyles, tabsTokenSet, textFieldStyles, textFieldTokenSet, themeAttributes, timePickerStyles, timePickerTokenSet, toMotionSpring, toolbarFabStyles, toolbarFabTokenSet, tooltipStyles, topAppBarStyles, tv, twMergeConfig, typeTokens, typescale, useM3Spring, useSnackbarHostState, useTheme, useThemeScope, useTimePickerRoom, useToolbarScrollExit, useToolbarScrollExpansion };

package/dist/motion/get-m3-spring.d.ts

@@ -0,0 +1,6 @@
+import { MotionScheme, MotionSpring, SpringFamily, SpringSpeed } from "../tokens/motion.js";
+//#region src/motion/get-m3-spring.d.ts
+/** The Motion spring for a motion scheme, family and speed. */
+export declare function getM3Spring(scheme: MotionScheme, family: SpringFamily, speed?: SpringSpeed): MotionSpring;
+//#endregion
+//# sourceMappingURL=get-m3-spring.d.ts.map

package/dist/motion/get-m3-spring.js

@@ -0,0 +1,10 @@
+import { SPRINGS, toMotionSpring } from "../tokens/motion.js";
+//#region src/motion/get-m3-spring.ts
+/** The Motion spring for a motion scheme, family and speed. */
+function getM3Spring(scheme, family, speed = "default") {
+	return toMotionSpring(SPRINGS[scheme][family][speed]);
+}
+//#endregion
+export { getM3Spring };
+
+//# sourceMappingURL=get-m3-spring.js.map