@windmorph/react 0.0.0-stage → 0.1.0

package/dist/primitives/SelectionControl.d.ts

@@ -0,0 +1,55 @@
+import { CSSProperties, HTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, ReactNode, Ref } from "react";
+//#region src/primitives/SelectionControl.d.ts
+export interface SelectionControlClassNames {
+  /** The root `<label>` that holds the control and its label text. */
+  root?: string;
+  /** The 40px control that carries the state layer and holds the indicator. */
+  control?: string;
+  /** The label text beside the control. */
+  label?: string;
+}
+export interface SelectionControlProps {
+  /** Props from the React Aria hook (`labelProps`, merged with hover handling). */
+  rootProps: LabelHTMLAttributes<HTMLLabelElement>;
+  /** Props from the React Aria hook (`inputProps`, merged with focus handling). */
+  inputProps: InputHTMLAttributes<HTMLInputElement>;
+  inputRef: Ref<HTMLInputElement>;
+  /** State attributes, set on both the root and the control. */
+  state: Record<`data-${string}`, true | undefined>;
+  /**
+   * The consumer's DOM attributes for the root (`data-*`, `aria-*`, `title`, pointer events:
+   * `splitRootProps`), merged before `rootProps`, so handlers chain.
+   */
+  rootData?: Record<string, unknown>;
+  /** The drawn indicator (box, ring, track), hidden from assistive tech. */
+  indicator: ReactNode;
+  children?: ReactNode;
+  ref?: Ref<HTMLLabelElement>;
+  className?: string;
+  /** The recipe's slots, so its classes and the base classes merge in one place. */
+  styles?: {
+    root: (props?: {
+      class?: string;
+    }) => string;
+    control: (props?: {
+      class?: string;
+    }) => string;
+    label: (props?: {
+      class?: string;
+    }) => string;
+  };
+  classNames?: SelectionControlClassNames;
+  style?: CSSProperties;
+  /** Inline style for the control (e.g. CSS variables that position a switch thumb). */
+  controlStyle?: CSSProperties;
+  /** Extra props for the control (e.g. a switch's drag handlers). */
+  controlProps?: HTMLAttributes<HTMLSpanElement>;
+}
+/**
+ * Shared structure of checkboxes, radio buttons and switches: a root `<label>` holding a
+ * visually hidden native input, the 40px state-layer control with a 48px touch target,
+ * the indicator and the label text.
+ */
+export declare function SelectionControl({ rootProps, inputProps, inputRef, state, rootData, indicator, children, ref, className, styles, classNames, style, controlStyle, controlProps }: SelectionControlProps): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=SelectionControl.d.ts.map

package/dist/primitives/SelectionControl.js

@@ -0,0 +1,58 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { restartRipple } from "./use-m3-interaction.js";
+import { TouchTarget } from "./TouchTarget.js";
+import { preventHiddenInputScroll } from "./hidden-input-focus.js";
+import { selectionControlStyles } from "./selection-control-styles.js";
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { VisuallyHidden, mergeProps, mergeRefs } from "react-aria";
+//#region src/primitives/SelectionControl.tsx
+/**
+* Shared structure of checkboxes, radio buttons and switches: a root `<label>` holding a
+* visually hidden native input, the 40px state-layer control with a 48px touch target,
+* the indicator and the label text.
+*/
+function SelectionControl({ rootProps, inputProps, inputRef, state, rootData, indicator, children, ref, className, styles = selectionControlStyles(), classNames, style, controlStyle, controlProps }) {
+	const hiddenInputRef = useMemo(() => mergeRefs(inputRef, preventHiddenInputScroll), [inputRef]);
+	const restart = (label) => {
+		const control = label.querySelector("[data-selection-control]");
+		if (control) restartRipple(control);
+	};
+	return /* @__PURE__ */ jsxs("label", {
+		...mergeProps(rootData, rootProps, {
+			onPointerDown: (event) => {
+				if (event.button === 0) restart(event.currentTarget);
+			},
+			onKeyDown: (event) => {
+				if (event.key === " ") restart(event.currentTarget);
+			}
+		}),
+		...state,
+		ref,
+		style,
+		className: styles.root({ class: cn(classNames?.root, className) }),
+		children: [/* @__PURE__ */ jsxs("span", {
+			...controlProps,
+			...state,
+			"data-selection-control": "",
+			style: controlStyle,
+			className: styles.control({ class: classNames?.control }),
+			children: [
+				/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx("input", {
+					...inputProps,
+					ref: hiddenInputRef
+				}) }),
+				/* @__PURE__ */ jsx(TouchTarget, {}),
+				indicator
+			]
+		}), children !== void 0 && children !== null && /* @__PURE__ */ jsx("span", {
+			className: styles.label({ class: classNames?.label }),
+			children
+		})]
+	});
+}
+//#endregion
+export { SelectionControl };
+
+//# sourceMappingURL=SelectionControl.js.map

package/dist/primitives/SelectionControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionControl.js","names":[],"sources":["../../src/primitives/SelectionControl.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type CSSProperties,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type KeyboardEvent,\n  type LabelHTMLAttributes,\n  type PointerEvent,\n  type ReactNode,\n  type Ref,\n  useMemo,\n} from 'react';\nimport { mergeProps, mergeRefs, VisuallyHidden } from 'react-aria';\nimport { cn } from '../utils/cn';\nimport { preventHiddenInputScroll } from './hidden-input-focus';\nimport { selectionControlStyles } from './selection-control-styles';\nimport { TouchTarget } from './TouchTarget';\nimport { restartRipple } from './use-m3-interaction';\n\nexport interface SelectionControlClassNames {\n  /** The root `<label>` that holds the control and its label text. */\n  root?: string;\n  /** The 40px control that carries the state layer and holds the indicator. */\n  control?: string;\n  /** The label text beside the control. */\n  label?: string;\n}\n\nexport interface SelectionControlProps {\n  /** Props from the React Aria hook (`labelProps`, merged with hover handling). */\n  rootProps: LabelHTMLAttributes<HTMLLabelElement>;\n  /** Props from the React Aria hook (`inputProps`, merged with focus handling). */\n  inputProps: InputHTMLAttributes<HTMLInputElement>;\n  inputRef: Ref<HTMLInputElement>;\n  /** State attributes, set on both the root and the control. */\n  state: Record<`data-${string}`, true | undefined>;\n  /**\n   * The consumer's DOM attributes for the root (`data-*`, `aria-*`, `title`, pointer events:\n   * `splitRootProps`), merged before `rootProps`, so handlers chain.\n   */\n  rootData?: Record<string, unknown>;\n  /** The drawn indicator (box, ring, track), hidden from assistive tech. */\n  indicator: ReactNode;\n  children?: ReactNode;\n  ref?: Ref<HTMLLabelElement>;\n  className?: string;\n  /** The recipe's slots, so its classes and the base classes merge in one place. */\n  styles?: {\n    root: (props?: { class?: string }) => string;\n    control: (props?: { class?: string }) => string;\n    label: (props?: { class?: string }) => string;\n  };\n  classNames?: SelectionControlClassNames;\n  style?: CSSProperties;\n  /** Inline style for the control (e.g. CSS variables that position a switch thumb). */\n  controlStyle?: CSSProperties;\n  /** Extra props for the control (e.g. a switch's drag handlers). */\n  controlProps?: HTMLAttributes<HTMLSpanElement>;\n}\n\n/**\n * Shared structure of checkboxes, radio buttons and switches: a root `<label>` holding a\n * visually hidden native input, the 40px state-layer control with a 48px touch target,\n * the indicator and the label text.\n */\nexport function SelectionControl({\n  rootProps,\n  inputProps,\n  inputRef,\n  state,\n  rootData,\n  indicator,\n  children,\n  ref,\n  className,\n  styles = selectionControlStyles(),\n  classNames,\n  style,\n  controlStyle,\n  controlProps,\n}: SelectionControlProps) {\n  const hiddenInputRef = useMemo(() => mergeRefs(inputRef, preventHiddenInputScroll), [inputRef]);\n  // Every press starts a fresh (centred) ripple on the control, as in Compose.\n  const restart = (label: HTMLElement) => {\n    const control = label.querySelector<HTMLElement>('[data-selection-control]');\n    if (control) restartRipple(control);\n  };\n  const rippleProps = {\n    onPointerDown: (event: PointerEvent<HTMLElement>) => {\n      if (event.button === 0) restart(event.currentTarget);\n    },\n    onKeyDown: (event: KeyboardEvent<HTMLElement>) => {\n      if (event.key === ' ') restart(event.currentTarget);\n    },\n  };\n  return (\n    <label\n      {...mergeProps(rootData, rootProps, rippleProps)}\n      {...state}\n      ref={ref}\n      style={style}\n      className={styles.root({ class: cn(classNames?.root, className) })}\n    >\n      <span\n        {...controlProps}\n        {...state}\n        data-selection-control=\"\"\n        style={controlStyle}\n        className={styles.control({ class: classNames?.control })}\n      >\n        <VisuallyHidden>\n          <input {...inputProps} ref={hiddenInputRef} />\n        </VisuallyHidden>\n        <TouchTarget />\n        {indicator}\n      </span>\n      {children !== undefined && children !== null && (\n        <span className={styles.label({ class: classNames?.label })}>{children}</span>\n      )}\n    </label>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAkEA,SAAgB,iBAAiB,EAC/B,WACA,YACA,UACA,OACA,UACA,WACA,UACA,KACA,WACA,SAAS,uBAAuB,GAChC,YACA,OACA,cACA,gBACwB;CACxB,MAAM,iBAAiB,cAAc,UAAU,UAAU,wBAAwB,GAAG,CAAC,QAAQ,CAAC;CAE9F,MAAM,WAAW,UAAuB;EACtC,MAAM,UAAU,MAAM,cAA2B,0BAA0B;EAC3E,IAAI,SAAS,cAAc,OAAO;CACpC;CASA,OACE,qBAAC,SAAD;EACE,GAAI,WAAW,UAAU,WAAW;GATtC,gBAAgB,UAAqC;IACnD,IAAI,MAAM,WAAW,GAAG,QAAQ,MAAM,aAAa;GACrD;GACA,YAAY,UAAsC;IAChD,IAAI,MAAM,QAAQ,KAAK,QAAQ,MAAM,aAAa;GACpD;EAIgD,CAAC;EAC/C,GAAI;EACC;EACE;EACP,WAAW,OAAO,KAAK,EAAE,OAAO,GAAG,YAAY,MAAM,SAAS,EAAE,CAAC;EALnE,UAAA,CAOE,qBAAC,QAAD;GACE,GAAI;GACJ,GAAI;GACJ,0BAAuB;GACvB,OAAO;GACP,WAAW,OAAO,QAAQ,EAAE,OAAO,YAAY,QAAQ,CAAC;GAL1D,UAAA;IAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,SAAD;KAAO,GAAI;KAAY,KAAK;IAAiB,CAAA,EAC/B,CAAA;IAChB,oBAAC,aAAD,CAAc,CAAA;IACb;GACG;EACL,CAAA,GAAA,aAAa,KAAA,KAAa,aAAa,QACtC,oBAAC,QAAD;GAAM,WAAW,OAAO,MAAM,EAAE,OAAO,YAAY,MAAM,CAAC;GAAI;EAAe,CAAA,CAE1E;;AAEX"}

package/dist/primitives/Surface.d.ts

@@ -0,0 +1,123 @@
+import { VariantProps } from "../utils/tv.js";
+import { ComponentPropsWithRef } from "react";
+//#region src/primitives/Surface.d.ts
+/** Variant definitions for {@link Surface}; extend them to add your own containers. */
+export declare const surfaceStyles: import("tailwind-variants").TVReturnType<{
+  container: {
+    surface: "bg-surface text-on-surface";
+    'surface-dim': "bg-surface-dim text-on-surface";
+    'surface-bright': "bg-surface-bright text-on-surface";
+    'surface-container-lowest': "bg-surface-container-lowest text-on-surface";
+    'surface-container-low': "bg-surface-container-low text-on-surface";
+    'surface-container': "bg-surface-container text-on-surface";
+    'surface-container-high': "bg-surface-container-high text-on-surface";
+    'surface-container-highest': "bg-surface-container-highest text-on-surface";
+    'inverse-surface': "bg-inverse-surface text-inverse-on-surface";
+    'primary-container': "bg-primary-container text-on-primary-container";
+    'secondary-container': "bg-secondary-container text-on-secondary-container";
+    'tertiary-container': "bg-tertiary-container text-on-tertiary-container";
+    'error-container': "bg-error-container text-on-error-container";
+  };
+  elevation: {
+    0: "shadow-elevation-0";
+    1: "shadow-elevation-1";
+    2: "shadow-elevation-2";
+    3: "shadow-elevation-3";
+    4: "shadow-elevation-4";
+    5: "shadow-elevation-5";
+  };
+  shape: {
+    none: "rounded-corner-none";
+    'extra-small': "rounded-corner-extra-small";
+    small: "rounded-corner-small";
+    medium: "rounded-corner-medium";
+    large: "rounded-corner-large";
+    'large-increased': "rounded-corner-large-increased";
+    'extra-large': "rounded-corner-extra-large";
+    'extra-large-increased': "rounded-corner-extra-large-increased";
+    'extra-extra-large': "rounded-corner-extra-extra-large";
+    full: "rounded-corner-full";
+  };
+}, undefined, undefined, {
+  container: {
+    surface: "bg-surface text-on-surface";
+    'surface-dim': "bg-surface-dim text-on-surface";
+    'surface-bright': "bg-surface-bright text-on-surface";
+    'surface-container-lowest': "bg-surface-container-lowest text-on-surface";
+    'surface-container-low': "bg-surface-container-low text-on-surface";
+    'surface-container': "bg-surface-container text-on-surface";
+    'surface-container-high': "bg-surface-container-high text-on-surface";
+    'surface-container-highest': "bg-surface-container-highest text-on-surface";
+    'inverse-surface': "bg-inverse-surface text-inverse-on-surface";
+    'primary-container': "bg-primary-container text-on-primary-container";
+    'secondary-container': "bg-secondary-container text-on-secondary-container";
+    'tertiary-container': "bg-tertiary-container text-on-tertiary-container";
+    'error-container': "bg-error-container text-on-error-container";
+  };
+  elevation: {
+    0: "shadow-elevation-0";
+    1: "shadow-elevation-1";
+    2: "shadow-elevation-2";
+    3: "shadow-elevation-3";
+    4: "shadow-elevation-4";
+    5: "shadow-elevation-5";
+  };
+  shape: {
+    none: "rounded-corner-none";
+    'extra-small': "rounded-corner-extra-small";
+    small: "rounded-corner-small";
+    medium: "rounded-corner-medium";
+    large: "rounded-corner-large";
+    'large-increased': "rounded-corner-large-increased";
+    'extra-large': "rounded-corner-extra-large";
+    'extra-large-increased': "rounded-corner-extra-large-increased";
+    'extra-extra-large': "rounded-corner-extra-extra-large";
+    full: "rounded-corner-full";
+  };
+}, undefined, import("tailwind-variants").TVReturnTypeLike<{
+  container: {
+    surface: "bg-surface text-on-surface";
+    'surface-dim': "bg-surface-dim text-on-surface";
+    'surface-bright': "bg-surface-bright text-on-surface";
+    'surface-container-lowest': "bg-surface-container-lowest text-on-surface";
+    'surface-container-low': "bg-surface-container-low text-on-surface";
+    'surface-container': "bg-surface-container text-on-surface";
+    'surface-container-high': "bg-surface-container-high text-on-surface";
+    'surface-container-highest': "bg-surface-container-highest text-on-surface";
+    'inverse-surface': "bg-inverse-surface text-inverse-on-surface";
+    'primary-container': "bg-primary-container text-on-primary-container";
+    'secondary-container': "bg-secondary-container text-on-secondary-container";
+    'tertiary-container': "bg-tertiary-container text-on-tertiary-container";
+    'error-container': "bg-error-container text-on-error-container";
+  };
+  elevation: {
+    0: "shadow-elevation-0";
+    1: "shadow-elevation-1";
+    2: "shadow-elevation-2";
+    3: "shadow-elevation-3";
+    4: "shadow-elevation-4";
+    5: "shadow-elevation-5";
+  };
+  shape: {
+    none: "rounded-corner-none";
+    'extra-small': "rounded-corner-extra-small";
+    small: "rounded-corner-small";
+    medium: "rounded-corner-medium";
+    large: "rounded-corner-large";
+    'large-increased': "rounded-corner-large-increased";
+    'extra-large': "rounded-corner-extra-large";
+    'extra-large-increased': "rounded-corner-extra-large-increased";
+    'extra-extra-large': "rounded-corner-extra-extra-large";
+    full: "rounded-corner-full";
+  };
+}, undefined>>;
+export type SurfaceVariants = VariantProps<typeof surfaceStyles>;
+export interface SurfaceProps extends ComponentPropsWithRef<'div'>, SurfaceVariants {}
+/**
+ * A themed container: an M3 surface colour role with its matching content colour,
+ * an elevation shadow and a corner shape. Layout-neutral; `className` and `style`
+ * apply to the element itself.
+ */
+export declare function Surface({ container, elevation, shape, className, ...props }: SurfaceProps): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=Surface.d.ts.map

package/dist/primitives/Surface.js

@@ -0,0 +1,68 @@
+import { cn } from "../utils/cn.js";
+import { tv } from "../utils/tv.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/primitives/Surface.tsx
+/** Variant definitions for {@link Surface}; extend them to add your own containers. */
+const surfaceStyles = tv({
+	variants: {
+		container: {
+			surface: "bg-surface text-on-surface",
+			"surface-dim": "bg-surface-dim text-on-surface",
+			"surface-bright": "bg-surface-bright text-on-surface",
+			"surface-container-lowest": "bg-surface-container-lowest text-on-surface",
+			"surface-container-low": "bg-surface-container-low text-on-surface",
+			"surface-container": "bg-surface-container text-on-surface",
+			"surface-container-high": "bg-surface-container-high text-on-surface",
+			"surface-container-highest": "bg-surface-container-highest text-on-surface",
+			"inverse-surface": "bg-inverse-surface text-inverse-on-surface",
+			"primary-container": "bg-primary-container text-on-primary-container",
+			"secondary-container": "bg-secondary-container text-on-secondary-container",
+			"tertiary-container": "bg-tertiary-container text-on-tertiary-container",
+			"error-container": "bg-error-container text-on-error-container"
+		},
+		elevation: {
+			0: "shadow-elevation-0",
+			1: "shadow-elevation-1",
+			2: "shadow-elevation-2",
+			3: "shadow-elevation-3",
+			4: "shadow-elevation-4",
+			5: "shadow-elevation-5"
+		},
+		shape: {
+			none: "rounded-corner-none",
+			"extra-small": "rounded-corner-extra-small",
+			small: "rounded-corner-small",
+			medium: "rounded-corner-medium",
+			large: "rounded-corner-large",
+			"large-increased": "rounded-corner-large-increased",
+			"extra-large": "rounded-corner-extra-large",
+			"extra-large-increased": "rounded-corner-extra-large-increased",
+			"extra-extra-large": "rounded-corner-extra-extra-large",
+			full: "rounded-corner-full"
+		}
+	},
+	defaultVariants: {
+		container: "surface",
+		elevation: 0,
+		shape: "none"
+	}
+});
+/**
+* A themed container: an M3 surface colour role with its matching content colour,
+* an elevation shadow and a corner shape. Layout-neutral; `className` and `style`
+* apply to the element itself.
+*/
+function Surface({ container, elevation, shape, className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		...props,
+		className: cn(surfaceStyles({
+			container,
+			elevation,
+			shape
+		}), className)
+	});
+}
+//#endregion
+export { Surface, surfaceStyles };
+
+//# sourceMappingURL=Surface.js.map

package/dist/primitives/Surface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Surface.js","names":[],"sources":["../../src/primitives/Surface.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react';\nimport { cn } from '../utils/cn';\nimport { tv, type VariantProps } from '../utils/tv';\n\n/** Variant definitions for {@link Surface}; extend them to add your own containers. */\nexport const surfaceStyles = tv({\n  variants: {\n    container: {\n      surface: 'bg-surface text-on-surface',\n      'surface-dim': 'bg-surface-dim text-on-surface',\n      'surface-bright': 'bg-surface-bright text-on-surface',\n      'surface-container-lowest': 'bg-surface-container-lowest text-on-surface',\n      'surface-container-low': 'bg-surface-container-low text-on-surface',\n      'surface-container': 'bg-surface-container text-on-surface',\n      'surface-container-high': 'bg-surface-container-high text-on-surface',\n      'surface-container-highest': 'bg-surface-container-highest text-on-surface',\n      'inverse-surface': 'bg-inverse-surface text-inverse-on-surface',\n      'primary-container': 'bg-primary-container text-on-primary-container',\n      'secondary-container': 'bg-secondary-container text-on-secondary-container',\n      'tertiary-container': 'bg-tertiary-container text-on-tertiary-container',\n      'error-container': 'bg-error-container text-on-error-container',\n    },\n    elevation: {\n      0: 'shadow-elevation-0',\n      1: 'shadow-elevation-1',\n      2: 'shadow-elevation-2',\n      3: 'shadow-elevation-3',\n      4: 'shadow-elevation-4',\n      5: 'shadow-elevation-5',\n    },\n    shape: {\n      none: 'rounded-corner-none',\n      'extra-small': 'rounded-corner-extra-small',\n      small: 'rounded-corner-small',\n      medium: 'rounded-corner-medium',\n      large: 'rounded-corner-large',\n      'large-increased': 'rounded-corner-large-increased',\n      'extra-large': 'rounded-corner-extra-large',\n      'extra-large-increased': 'rounded-corner-extra-large-increased',\n      'extra-extra-large': 'rounded-corner-extra-extra-large',\n      full: 'rounded-corner-full',\n    },\n  },\n  defaultVariants: {\n    container: 'surface',\n    elevation: 0,\n    shape: 'none',\n  },\n});\n\nexport type SurfaceVariants = VariantProps<typeof surfaceStyles>;\n\nexport interface SurfaceProps extends ComponentPropsWithRef<'div'>, SurfaceVariants {}\n\n/**\n * A themed container: an M3 surface colour role with its matching content colour,\n * an elevation shadow and a corner shape. Layout-neutral; `className` and `style`\n * apply to the element itself.\n */\nexport function Surface({ container, elevation, shape, className, ...props }: SurfaceProps) {\n  return (\n    <div {...props} className={cn(surfaceStyles({ container, elevation, shape }), className)} />\n  );\n}\n"],"mappings":";;;;;AAKA,MAAa,gBAAgB,GAAG;CAC9B,UAAU;EACR,WAAW;GACT,SAAS;GACT,eAAe;GACf,kBAAkB;GAClB,4BAA4B;GAC5B,yBAAyB;GACzB,qBAAqB;GACrB,0BAA0B;GAC1B,6BAA6B;GAC7B,mBAAmB;GACnB,qBAAqB;GACrB,uBAAuB;GACvB,sBAAsB;GACtB,mBAAmB;EACrB;EACA,WAAW;GACT,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;EACL;EACA,OAAO;GACL,MAAM;GACN,eAAe;GACf,OAAO;GACP,QAAQ;GACR,OAAO;GACP,mBAAmB;GACnB,eAAe;GACf,yBAAyB;GACzB,qBAAqB;GACrB,MAAM;EACR;CACF;CACA,iBAAiB;EACf,WAAW;EACX,WAAW;EACX,OAAO;CACT;AACF,CAAC;;;;;;AAWD,SAAgB,QAAQ,EAAE,WAAW,WAAW,OAAO,WAAW,GAAG,SAAuB;CAC1F,OACE,oBAAC,OAAD;EAAK,GAAI;EAAO,WAAW,GAAG,cAAc;GAAE;GAAW;GAAW;EAAM,CAAC,GAAG,SAAS;CAAI,CAAA;AAE/F"}

package/dist/primitives/ToolbarContext.js

@@ -0,0 +1,12 @@
+"use client";
+import { createContext } from "react";
+//#region src/primitives/ToolbarContext.ts
+/**
+* Set by `DockedToolbar` and `FloatingToolbar`; `null` outside a toolbar. Overlays reset
+* it, so a menu or dialog opened from a toolbar keeps its own colours.
+*/
+const ToolbarContext = createContext(null);
+//#endregion
+export { ToolbarContext };
+
+//# sourceMappingURL=ToolbarContext.js.map

package/dist/primitives/ToolbarContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarContext.js","names":[],"sources":["../../src/primitives/ToolbarContext.ts"],"sourcesContent":["'use client';\n\nimport { createContext } from 'react';\n\n/** What a toolbar tells the controls inside it. */\nexport interface ToolbarContextValue {\n  kind: 'docked' | 'floating';\n  /** The toolbar's colour scheme; vibrant toolbars recolour their icon buttons (M3). */\n  color: 'standard' | 'vibrant';\n  /**\n   * Whether a floating toolbar is expanded; its `ToolbarFab` shows `expandedIcon` while it\n   * is. Docked toolbars leave it out.\n   */\n  expanded?: boolean;\n  /** A floating toolbar's orientation; docked toolbars are always horizontal. */\n  orientation?: 'horizontal' | 'vertical';\n}\n\n/**\n * Set by `DockedToolbar` and `FloatingToolbar`; `null` outside a toolbar. Overlays reset\n * it, so a menu or dialog opened from a toolbar keeps its own colours.\n */\nexport const ToolbarContext = createContext<ToolbarContextValue | null>(null);\n"],"mappings":";;;;;;;AAsBA,MAAa,iBAAiB,cAA0C,IAAI"}

package/dist/primitives/TouchTarget.d.ts

@@ -0,0 +1,14 @@
+import { ComponentPropsWithRef } from "react";
+//#region src/primitives/TouchTarget.d.ts
+export interface TouchTargetProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {
+  /** Classes for the hit area, merged after its own; consumer classes win. */
+  className?: string;
+}
+/**
+ * Extends the hit area of a small control to the 48×48px minimum without changing
+ * its layout. Render it inside the component's inner content wrapper (which is
+ * `relative`), never on the root, so consumer positioning of the root stays safe.
+ */
+export declare function TouchTarget({ className, ...props }: TouchTargetProps): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=TouchTarget.d.ts.map

package/dist/primitives/TouchTarget.js

@@ -0,0 +1,20 @@
+import { cn } from "../utils/cn.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/primitives/TouchTarget.tsx
+/**
+* Extends the hit area of a small control to the 48×48px minimum without changing
+* its layout. Render it inside the component's inner content wrapper (which is
+* `relative`), never on the root, so consumer positioning of the root stays safe.
+*/
+function TouchTarget({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"aria-hidden": "true",
+		"data-touch-target": "",
+		...props,
+		className: cn("absolute top-1/2 left-1/2 h-[48px] w-[max(100%,48px)] -translate-x-1/2 -translate-y-1/2", className)
+	});
+}
+//#endregion
+export { TouchTarget };
+
+//# sourceMappingURL=TouchTarget.js.map

package/dist/primitives/TouchTarget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TouchTarget.js","names":[],"sources":["../../src/primitives/TouchTarget.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react';\nimport { cn } from '../utils/cn';\n\nexport interface TouchTargetProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {\n  /** Classes for the hit area, merged after its own; consumer classes win. */\n  className?: string;\n}\n\n/**\n * Extends the hit area of a small control to the 48×48px minimum without changing\n * its layout. Render it inside the component's inner content wrapper (which is\n * `relative`), never on the root, so consumer positioning of the root stays safe.\n */\nexport function TouchTarget({ className, ...props }: TouchTargetProps) {\n  return (\n    <span\n      aria-hidden=\"true\"\n      data-touch-target=\"\"\n      {...props}\n      className={cn(\n        'absolute top-1/2 left-1/2 h-[48px] w-[max(100%,48px)] -translate-x-1/2 -translate-y-1/2',\n        className,\n      )}\n    />\n  );\n}\n"],"mappings":";;;;;;;;AAaA,SAAgB,YAAY,EAAE,WAAW,GAAG,SAA2B;CACrE,OACE,oBAAC,QAAD;EACE,eAAY;EACZ,qBAAkB;EAClB,GAAI;EACJ,WAAW,GACT,2FACA,SACF;CACD,CAAA;AAEL"}

package/dist/primitives/TriggerContext.d.ts

@@ -0,0 +1,34 @@
+import { DOMAttributes, Ref } from "react";
+import { PressEvent } from "react-aria";
+//#region src/primitives/TriggerContext.d.ts
+/** Props an overlay trigger (dialog, menu) gives the button that opens it. */
+export interface TriggerContextValue extends DOMAttributes<HTMLElement> {
+  onPress?: (event: PressEvent) => void;
+  /** Menus open on press start. */
+  onPressStart?: (event: PressEvent) => void;
+  /** Menu triggers keep focus where it is on press (React Aria `useMenuTrigger`). */
+  preventFocusOnPress?: boolean;
+  'aria-haspopup'?: boolean | 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | 'true' | 'false';
+  'aria-expanded'?: boolean;
+  'aria-controls'?: string;
+  /** Set by `MenuTrigger` while its menu is open: the state layer keeps a pressed layer. */
+  'data-menu-open'?: true;
+  id?: string;
+  /** The trigger element, e.g. for positioning a menu next to it. */
+  ref?: Ref<HTMLElement>;
+}
+/**
+ * Lets an overlay trigger wire up whichever button-like child opens it (Button,
+ * IconButton, Fab, a pressable Card) without cloning elements: `ButtonBase` merges these
+ * props into its own. Overlays reset it to `null` so buttons inside them are unaffected.
+ */
+export declare const TriggerContext: import("react").Context<TriggerContextValue | null>;
+/**
+ * The value a trigger gives its button: its own props merged into an enclosing trigger's,
+ * so triggers nest (a `TooltipTrigger` around a `MenuTrigger`, or the other way round)
+ * and the button gets both. Handlers are chained, refs merged and ids kept in sync (React
+ * Aria `mergeProps`); for other props the inner trigger wins.
+ */
+export declare function useTriggerProps(own: TriggerContextValue): TriggerContextValue;
+//#endregion
+//# sourceMappingURL=TriggerContext.d.ts.map

package/dist/primitives/TriggerContext.js

@@ -0,0 +1,24 @@
+"use client";
+import { createContext, useContext } from "react";
+import { mergeProps } from "react-aria";
+//#region src/primitives/TriggerContext.ts
+/**
+* Lets an overlay trigger wire up whichever button-like child opens it (Button,
+* IconButton, Fab, a pressable Card) without cloning elements: `ButtonBase` merges these
+* props into its own. Overlays reset it to `null` so buttons inside them are unaffected.
+*/
+const TriggerContext = createContext(null);
+/**
+* The value a trigger gives its button: its own props merged into an enclosing trigger's,
+* so triggers nest (a `TooltipTrigger` around a `MenuTrigger`, or the other way round)
+* and the button gets both. Handlers are chained, refs merged and ids kept in sync (React
+* Aria `mergeProps`); for other props the inner trigger wins.
+*/
+function useTriggerProps(own) {
+	const outer = useContext(TriggerContext);
+	return outer ? mergeProps(outer, own) : own;
+}
+//#endregion
+export { TriggerContext, useTriggerProps };
+
+//# sourceMappingURL=TriggerContext.js.map

package/dist/primitives/TriggerContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TriggerContext.js","names":[],"sources":["../../src/primitives/TriggerContext.ts"],"sourcesContent":["'use client';\n\nimport { createContext, useContext, type DOMAttributes, type Ref } from 'react';\nimport { mergeProps, type PressEvent } from 'react-aria';\n\n/** Props an overlay trigger (dialog, menu) gives the button that opens it. */\nexport interface TriggerContextValue extends DOMAttributes<HTMLElement> {\n  onPress?: (event: PressEvent) => void;\n  /** Menus open on press start. */\n  onPressStart?: (event: PressEvent) => void;\n  /** Menu triggers keep focus where it is on press (React Aria `useMenuTrigger`). */\n  preventFocusOnPress?: boolean;\n  'aria-haspopup'?: boolean | 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | 'true' | 'false';\n  'aria-expanded'?: boolean;\n  'aria-controls'?: string;\n  /** Set by `MenuTrigger` while its menu is open: the state layer keeps a pressed layer. */\n  'data-menu-open'?: true;\n  id?: string;\n  /** The trigger element, e.g. for positioning a menu next to it. */\n  ref?: Ref<HTMLElement>;\n}\n\n/**\n * Lets an overlay trigger wire up whichever button-like child opens it (Button,\n * IconButton, Fab, a pressable Card) without cloning elements: `ButtonBase` merges these\n * props into its own. Overlays reset it to `null` so buttons inside them are unaffected.\n */\nexport const TriggerContext = createContext<TriggerContextValue | null>(null);\n\n/**\n * The value a trigger gives its button: its own props merged into an enclosing trigger's,\n * so triggers nest (a `TooltipTrigger` around a `MenuTrigger`, or the other way round)\n * and the button gets both. Handlers are chained, refs merged and ids kept in sync (React\n * Aria `mergeProps`); for other props the inner trigger wins.\n */\nexport function useTriggerProps(own: TriggerContextValue): TriggerContextValue {\n  const outer = useContext(TriggerContext);\n  return outer ? (mergeProps(outer, own) as TriggerContextValue) : own;\n}\n"],"mappings":";;;;;;;;;AA2BA,MAAa,iBAAiB,cAA0C,IAAI;;;;;;;AAQ5E,SAAgB,gBAAgB,KAA+C;CAC7E,MAAM,QAAQ,WAAW,cAAc;CACvC,OAAO,QAAS,WAAW,OAAO,GAAG,IAA4B;AACnE"}

package/dist/primitives/hidden-input-focus.js

@@ -0,0 +1,27 @@
+//#region src/primitives/hidden-input-focus.ts
+/**
+* Ref callback for the visually hidden native input of a checkbox, radio button or switch
+* (the controls and the list items that draw them). React Aria focuses that input with a
+* plain `focus()` when its label is pressed, and the browser then scrolls the 1px input
+* into view: when a tap lands on the visible part of a control whose centre is above the
+* window, the page jumped by hundreds of pixels to centre an invisible pixel. The input's
+* `focus()` now defaults to `preventScroll: true` (a caller can still pass
+* `{ preventScroll: false }`); Tab focus is the browser's own and still scrolls into view.
+*/
+function preventHiddenInputScroll(input) {
+	if (!input || Object.prototype.hasOwnProperty.call(input, "focus")) return;
+	Object.defineProperty(input, "focus", {
+		configurable: true,
+		writable: true,
+		value: (options) => {
+			Object.getPrototypeOf(input).focus.call(input, {
+				preventScroll: true,
+				...options
+			});
+		}
+	});
+}
+//#endregion
+export { preventHiddenInputScroll };
+
+//# sourceMappingURL=hidden-input-focus.js.map

package/dist/primitives/hidden-input-focus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hidden-input-focus.js","names":[],"sources":["../../src/primitives/hidden-input-focus.ts"],"sourcesContent":["/**\n * Ref callback for the visually hidden native input of a checkbox, radio button or switch\n * (the controls and the list items that draw them). React Aria focuses that input with a\n * plain `focus()` when its label is pressed, and the browser then scrolls the 1px input\n * into view: when a tap lands on the visible part of a control whose centre is above the\n * window, the page jumped by hundreds of pixels to centre an invisible pixel. The input's\n * `focus()` now defaults to `preventScroll: true` (a caller can still pass\n * `{ preventScroll: false }`); Tab focus is the browser's own and still scrolls into view.\n */\nexport function preventHiddenInputScroll(input: HTMLInputElement | null): void {\n  if (!input || Object.prototype.hasOwnProperty.call(input, 'focus')) return;\n  // The element's own property, defined rather than assigned: test tooling can turn the\n  // prototype's `focus` into an accessor whose setter would replace it for every element.\n  // The prototype's current `focus` is looked up on each call, so wrappers installed later\n  // (React Aria's, while an overlay is open) still run.\n  Object.defineProperty(input, 'focus', {\n    configurable: true,\n    writable: true,\n    value: (options?: FocusOptions) => {\n      const focus = (Object.getPrototypeOf(input) as HTMLElement).focus;\n      focus.call(input, { preventScroll: true, ...options });\n    },\n  });\n}\n"],"mappings":";;;;;;;;;;AASA,SAAgB,yBAAyB,OAAsC;CAC7E,IAAI,CAAC,SAAS,OAAO,UAAU,eAAe,KAAK,OAAO,OAAO,GAAG;CAKpE,OAAO,eAAe,OAAO,SAAS;EACpC,cAAc;EACd,UAAU;EACV,QAAQ,YAA2B;GAEjC,OADsB,eAAe,KAAK,CAAC,CAAiB,MACtD,KAAK,OAAO;IAAE,eAAe;IAAM,GAAG;GAAQ,CAAC;EACvD;CACF,CAAC;AACH"}

package/dist/primitives/icon-faces-styles.d.ts

@@ -0,0 +1,9 @@
+//#region src/primitives/icon-faces-styles.d.ts
+/**
+ * How a two-icon button hands over between its icons: `swap` at the midpoint of the morph
+ * (the M3 spec), or `rotate`, a rotating crossfade (beyond the M3 spec; Google's Expressive
+ * showcase motion).
+ */
+export type IconTransition = 'swap' | 'rotate';
+//#endregion
+//# sourceMappingURL=icon-faces-styles.d.ts.map

package/dist/primitives/icon-faces-styles.js

@@ -0,0 +1,45 @@
+import { tv } from "../utils/tv.js";
+//#region src/primitives/icon-faces-styles.ts
+const iconFacesStyles = tv({
+	slots: {
+		cell: "inline-grid place-items-center",
+		face: "col-start-1 row-start-1 inline-flex size-full items-center justify-center [&>svg]:size-full"
+	},
+	variants: {
+		transition: {
+			swap: { face: [
+				"invisible data-active:visible",
+				"[transition-property:visibility] [transition-duration:0s]",
+				"[transition-delay:calc(var(--md-sys-motion-spring-spatial-fast-duration)/2)] motion-reduce:[transition-delay:0s]"
+			] },
+			rotate: { face: [
+				"opacity-0 data-active:opacity-100",
+				"[transition-property:rotate,opacity]",
+				"[transition-duration:var(--md-sys-motion-spring-spatial-fast-duration),var(--md-sys-motion-spring-effects-fast-duration)]",
+				"[transition-timing-function:var(--md-sys-motion-spring-spatial-fast-easing),var(--md-sys-motion-spring-effects-fast-easing)]"
+			] }
+		},
+		/** `primary`: the resting icon; `alternate`: the open (or expanded) icon. */
+		face: {
+			primary: {},
+			alternate: {}
+		}
+	},
+	compoundVariants: [{
+		transition: "rotate",
+		face: "primary",
+		class: { face: "motion-safe:not-data-active:ltr:-rotate-90 motion-safe:not-data-active:rtl:rotate-90" }
+	}, {
+		transition: "rotate",
+		face: "alternate",
+		class: { face: "motion-safe:not-data-active:ltr:rotate-90 motion-safe:not-data-active:rtl:-rotate-90" }
+	}],
+	defaultVariants: {
+		transition: "swap",
+		face: "primary"
+	}
+});
+//#endregion
+export { iconFacesStyles };
+
+//# sourceMappingURL=icon-faces-styles.js.map

package/dist/primitives/icon-faces-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-faces-styles.js","names":[],"sources":["../../src/primitives/icon-faces-styles.ts"],"sourcesContent":["import { tv } from '../utils/tv';\n\n/*\n * Two icons sharing one grid cell, one of them shown: a FAB menu's add / close icons, or a\n * toolbar FAB's collapsed / expanded icons. The shown face has `data-active`.\n *\n * - `swap` (the M3 spec and Compose): the faces hand over halfway through the button's fast\n *   spatial morph (Compose swaps at progress 0.5), through a `visibility` switch delayed by\n *   half that spring; reduced motion swaps at once.\n * - `rotate` (an extension beyond the M3 spec, matching Google's Expressive showcase\n *   motion): the outgoing face turns 90° in the direction of the change and fades out while\n *   the incoming one turns in from the other side and fades in, counter-clockwise when\n *   opening in LTR. Rotation is on the fast spatial spring, opacity on the fast effects\n *   spring. It uses the CSS `rotate` property on the faces (never the component's root),\n *   so Tailwind transforms still compose; the turn mirrors in RTL, and reduced motion keeps only the crossfade (`motion-safe:`).\n *\n * The cell itself is the component's icon slot; add `cell` to make it a grid. Every class\n * is written out in full so Tailwind can find it.\n */\nexport const iconFacesStyles = tv({\n  slots: {\n    cell: 'inline-grid place-items-center',\n    face: 'col-start-1 row-start-1 inline-flex size-full items-center justify-center [&>svg]:size-full',\n  },\n  variants: {\n    transition: {\n      swap: {\n        face: [\n          'invisible data-active:visible',\n          '[transition-property:visibility] [transition-duration:0s]',\n          '[transition-delay:calc(var(--md-sys-motion-spring-spatial-fast-duration)/2)] motion-reduce:[transition-delay:0s]',\n        ],\n      },\n      rotate: {\n        face: [\n          'opacity-0 data-active:opacity-100',\n          '[transition-property:rotate,opacity]',\n          '[transition-duration:var(--md-sys-motion-spring-spatial-fast-duration),var(--md-sys-motion-spring-effects-fast-duration)]',\n          '[transition-timing-function:var(--md-sys-motion-spring-spatial-fast-easing),var(--md-sys-motion-spring-effects-fast-easing)]',\n        ],\n      },\n    },\n    /** `primary`: the resting icon; `alternate`: the open (or expanded) icon. */\n    face: { primary: {}, alternate: {} },\n  },\n  compoundVariants: [\n    // Leaving, the resting icon turns onwards (counter-clockwise in LTR, as the showcase\n    // does); the alternate icon waits a quarter turn behind, so both turn the same way on\n    // the way in and back on the way out.\n    // The shown face has no rotation at all, so reduced motion leaves nothing to animate.\n    {\n      transition: 'rotate',\n      face: 'primary',\n      class: {\n        face: 'motion-safe:not-data-active:ltr:-rotate-90 motion-safe:not-data-active:rtl:rotate-90',\n      },\n    },\n    {\n      transition: 'rotate',\n      face: 'alternate',\n      class: {\n        face: 'motion-safe:not-data-active:ltr:rotate-90 motion-safe:not-data-active:rtl:-rotate-90',\n      },\n    },\n  ],\n  defaultVariants: { transition: 'swap', face: 'primary' },\n});\n\n/**\n * How a two-icon button hands over between its icons: `swap` at the midpoint of the morph\n * (the M3 spec), or `rotate`, a rotating crossfade (beyond the M3 spec; Google's Expressive\n * showcase motion).\n */\nexport type IconTransition = 'swap' | 'rotate';\n"],"mappings":";;AAmBA,MAAa,kBAAkB,GAAG;CAChC,OAAO;EACL,MAAM;EACN,MAAM;CACR;CACA,UAAU;EACR,YAAY;GACV,MAAM,EACJ,MAAM;IACJ;IACA;IACA;GACF,EACF;GACA,QAAQ,EACN,MAAM;IACJ;IACA;IACA;IACA;GACF,EACF;EACF;;EAEA,MAAM;GAAE,SAAS,CAAC;GAAG,WAAW,CAAC;EAAE;CACrC;CACA,kBAAkB,CAKhB;EACE,YAAY;EACZ,MAAM;EACN,OAAO,EACL,MAAM,uFACR;CACF,GACA;EACE,YAAY;EACZ,MAAM;EACN,OAAO,EACL,MAAM,uFACR;CACF,CACF;CACA,iBAAiB;EAAE,YAAY;EAAQ,MAAM;CAAU;AACzD,CAAC"}

package/dist/primitives/locale-with-direction.d.ts

@@ -0,0 +1,9 @@
+//#region src/primitives/locale-with-direction.d.ts
+/**
+ * The locale with the given direction, keeping its language and region so dates and
+ * numbers still format the same: only the script changes (`en-US` → `en-Arab-US` for RTL,
+ * `ar` → `ar-Latn` for LTR), which React Aria's `isRTL` reads.
+ */
+export declare function localeWithDirection(locale: string, direction: 'ltr' | 'rtl'): string;
+//#endregion
+//# sourceMappingURL=locale-with-direction.d.ts.map

package/dist/primitives/locale-with-direction.js

@@ -0,0 +1,17 @@
+//#region src/primitives/locale-with-direction.ts
+/**
+* The locale with the given direction, keeping its language and region so dates and
+* numbers still format the same: only the script changes (`en-US` → `en-Arab-US` for RTL,
+* `ar` → `ar-Latn` for LTR), which React Aria's `isRTL` reads.
+*/
+function localeWithDirection(locale, direction) {
+	try {
+		return new Intl.Locale(locale, { script: direction === "rtl" ? "Arab" : "Latn" }).toString();
+	} catch {
+		return direction === "rtl" ? "ar" : "en-US";
+	}
+}
+//#endregion
+export { localeWithDirection };
+
+//# sourceMappingURL=locale-with-direction.js.map

package/dist/primitives/locale-with-direction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"locale-with-direction.js","names":[],"sources":["../../src/primitives/locale-with-direction.ts"],"sourcesContent":["/**\n * The locale with the given direction, keeping its language and region so dates and\n * numbers still format the same: only the script changes (`en-US` → `en-Arab-US` for RTL,\n * `ar` → `ar-Latn` for LTR), which React Aria's `isRTL` reads.\n */\nexport function localeWithDirection(locale: string, direction: 'ltr' | 'rtl'): string {\n  try {\n    return new Intl.Locale(locale, { script: direction === 'rtl' ? 'Arab' : 'Latn' }).toString();\n  } catch {\n    return direction === 'rtl' ? 'ar' : 'en-US';\n  }\n}\n"],"mappings":";;;;;;AAKA,SAAgB,oBAAoB,QAAgB,WAAkC;CACpF,IAAI;EACF,OAAO,IAAI,KAAK,OAAO,QAAQ,EAAE,QAAQ,cAAc,QAAQ,SAAS,OAAO,CAAC,CAAC,CAAC,SAAS;CAC7F,QAAQ;EACN,OAAO,cAAc,QAAQ,OAAO;CACtC;AACF"}

package/dist/primitives/morph-path.d.ts

@@ -0,0 +1,25 @@
+import { RoundedPolygon } from "../shapes/rounded-polygon.js";
+import { MaterialShapeName } from "../shapes/generated/material-shape-paths.js";
+import { Morph } from "../shapes/morph.js";
+//#region src/primitives/morph-path.d.ts
+export type MorphShape = RoundedPolygon | MaterialShapeName;
+export interface M3MorphOptions {
+  /**
+   * Scales the unit-square shapes, e.g. to the SVG `viewBox` size. Default 1. Mid-morph
+   * control points can poke up to ~1% outside the square, so give the `<svg>`
+   * `overflow="visible"` or a little padding.
+   */
+  size?: number;
+  /** Rotates each frame so its first point sits at this angle (degrees). Default 0. */
+  startAngle?: number;
+}
+/** The (cached) morph between two shapes. */
+export declare function getMorph(from: RoundedPolygon, to: RoundedPolygon): Morph;
+/**
+ * SVG path data for `shapes` at `progress`, where 0 is the first shape, 1 the second and so
+ * on. Values outside `[0, n - 1]` extrapolate the first or last morph, so springs can
+ * overshoot.
+ */
+export declare function morphPathAt(shapes: readonly MorphShape[], progress: number, { size, startAngle }?: M3MorphOptions): string;
+//#endregion
+//# sourceMappingURL=morph-path.d.ts.map