mtrl 0.3.9 → 0.4.3

package/dist/components/chips/config.d.ts

@@ -17,7 +17,7 @@ export declare const createBaseConfig: (config?: ChipsConfig) => ChipsConfig;
 export declare const getElementConfig: (config: ChipsConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;

package/dist/components/chips/features/chip-items.d.ts

@@ -1,4 +1,4 @@
-import { ChipsConfig } from '../types';
+import { ChipsConfig } from "../types";
 /**
  * Adds chip item management to chips component
  *

package/dist/components/chips/schema.d.ts

@@ -10,8 +10,7 @@ export declare function createChipsSchema(component: any, config: ChipsConfig):
     element: {
         options: {
             className: any[];
-            attrs: {
-                tabindex: string;
+            attributes: {
                 role: string;
                 'aria-multiselectable': string;
             };

package/dist/components/datepicker/api.d.ts

@@ -1,4 +1,4 @@
-import { DatePickerComponent, ApiOptions } from './types';
+import { DatePickerComponent, ApiOptions } from "./types";
 /**
  * Enhances a datepicker component with API methods
  * @param {object} state - Current state of the datepicker

package/dist/components/datepicker/config.d.ts

@@ -1,4 +1,4 @@
-import { DatePickerConfig } from './types';
+import { DatePickerConfig } from "./types";
 /**
  * Default configuration for the DatePicker component
  */
@@ -17,7 +17,7 @@ export declare const createBaseConfig: (config?: DatePickerConfig) => DatePicker
 export declare const getContainerConfig: (config: DatePickerConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;
@@ -33,7 +33,7 @@ export declare const getContainerConfig: (config: DatePickerConfig) => {
 export declare const getInputConfig: (config: DatePickerConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;
@@ -49,7 +49,7 @@ export declare const getInputConfig: (config: DatePickerConfig) => {
 export declare const getCalendarConfig: (config: DatePickerConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;

package/dist/components/datepicker/datepicker.d.ts

@@ -1,4 +1,4 @@
-import { DatePickerConfig, DatePickerComponent } from './types';
+import { DatePickerConfig, DatePickerComponent } from "./types";
 /**
  * Creates a new DatePicker component
  * @param {DatePickerConfig} config - DatePicker configuration object

package/dist/components/datepicker/render.d.ts

@@ -3,7 +3,7 @@
  * @param {Object} params - Rendering parameters
  * @returns {HTMLElement} Calendar header element
  */
-export declare const renderHeader: ({ currentMonth, currentYear, currentView, prefix, emit }: any) => HTMLElement;
+export declare const renderHeader: ({ currentMonth, currentYear, currentView, prefix, emit, }: any) => HTMLElement;
 /**
  * Renders the days of the week (S, M, T, etc.)
  * @param {string} prefix - CSS class prefix
@@ -15,25 +15,25 @@ export declare const renderWeekdays: (prefix: string) => HTMLElement;
  * @param {Object} params - Rendering parameters
  * @returns {HTMLElement} Calendar days element
  */
-export declare const renderDays: ({ currentYear, currentMonth, selectedDate, rangeEndDate, minDate, maxDate, prefix, emit }: any) => HTMLElement;
+export declare const renderDays: ({ currentYear, currentMonth, selectedDate, rangeEndDate, minDate, maxDate, prefix, emit, }: any) => HTMLElement;
 /**
  * Renders the month selection view
  * @param {Object} params - Rendering parameters
  * @returns {HTMLElement} Month selection element
  */
-export declare const renderMonthSelection: ({ currentYear, currentMonth, prefix, emit }: any) => HTMLElement;
+export declare const renderMonthSelection: ({ currentMonth, prefix, emit, }: any) => HTMLElement;
 /**
  * Renders the year selection view
  * @param {Object} params - Rendering parameters
  * @returns {HTMLElement} Year selection element
  */
-export declare const renderYearSelection: ({ currentYear, prefix, emit }: any) => HTMLElement;
+export declare const renderYearSelection: ({ currentYear, prefix, emit, }: any) => HTMLElement;
 /**
  * Renders the footer with action buttons
  * @param {Object} params - Rendering parameters
  * @returns {HTMLElement} Footer element
  */
-export declare const renderFooter: ({ variant, prefix, emit }: any) => HTMLElement;
+export declare const renderFooter: ({ prefix, emit }: any) => HTMLElement;
 /**
  * Renders a complete calendar view
  * @param {Object} state - Current datepicker state

package/dist/components/dialog/config.d.ts

@@ -17,7 +17,7 @@ export declare const createBaseConfig: (config?: DialogConfig) => DialogConfig;
 export declare const getElementConfig: (config: DialogConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;
@@ -32,7 +32,7 @@ export declare const getElementConfig: (config: DialogConfig) => {
  */
 export declare const getOverlayConfig: (config: DialogConfig) => {
     tag: string;
-    attrs: {
+    attributes: {
         'aria-modal': boolean;
         role: string;
         tabindex: number;

package/dist/components/dialog/features.d.ts

@@ -1,4 +1,4 @@
-import { DialogConfig } from './types';
+import { DialogConfig } from "./types";
 /**
  * Creates the dialog DOM structure with proper divider handling
  * @param config Dialog configuration

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

@@ -223,7 +223,7 @@ export interface DialogButton {
      * Additional button attributes to pass to the button element
      * @example { 'data-id': 'save-button', 'form': 'profile-form' }
      */
-    attrs?: Record<string, any>;
+    attributes?: Record<string, any>;
 }
 /**
  * Dialog event object

package/dist/components/divider/divider.d.ts

@@ -1,5 +1,5 @@
-import { DividerConfig } from './config';
-import { DividerComponent } from './types';
+import { DividerConfig } from "./config";
+import { DividerComponent } from "./types";
 /**
  * Creates a new Divider component with the specified configuration.
  *

package/dist/components/extended-fab/config.d.ts

@@ -1,4 +1,4 @@
-import { ExtendedFabConfig } from './types';
+import { ExtendedFabConfig } from "./types";
 /**
  * Default configuration for the Extended FAB component
  *
@@ -38,7 +38,7 @@ export declare const createBaseConfig: (config?: ExtendedFabConfig) => ExtendedF
 export declare const getElementConfig: (config: ExtendedFabConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;

package/dist/components/fab/config.d.ts

@@ -1,4 +1,4 @@
-import { FabConfig } from './types';
+import { FabConfig } from "./types";
 /**
  * Default configuration for the FAB component
  *
@@ -38,7 +38,7 @@ export declare const createBaseConfig: (config?: FabConfig) => FabConfig;
 export declare const getElementConfig: (config: FabConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;

package/dist/components/index.d.ts

@@ -27,7 +27,8 @@ export * from './fab';
 export * from './extended-fab';
 export * from './menu';
 export * from './navigation';
-export * from './progress';
+export { PROGRESS_VARIANTS, PROGRESS_SHAPES, PROGRESS_EVENTS, PROGRESS_DEFAULTS, PROGRESS_CLASSES, PROGRESS_MEASUREMENTS, PROGRESS_THICKNESS } from './progress/constants';
+export type { ProgressConfig, ProgressComponent, ProgressShape } from './progress/types';
 export * from './radios';
 export * from './search';
 export * from './segmented-button';

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

@@ -27,7 +27,7 @@ export declare const createBaseConfig: (config?: Partial<ListConfig>) => import(
 export declare const getElementConfig: (config: any) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;

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

@@ -1,4 +1,4 @@
-import { MenuComponent, MenuContent, MenuPosition } from './types';
+import { MenuComponent, MenuContent, MenuPosition, MenuEvents } from "./types";
 /**
  * API configuration options for menu component
  * @category Components
@@ -6,19 +6,19 @@ import { MenuComponent, MenuContent, MenuPosition } from './types';
  */
 interface ApiOptions {
     menu: {
-        open: (event?: Event, interactionType?: 'mouse' | 'keyboard') => any;
-        close: (event?: Event, restoreFocus?: boolean, skipAnimation?: boolean) => any;
-        toggle: (event?: Event, interactionType?: 'mouse' | 'keyboard') => any;
+        open: (event?: Event, interactionType?: "mouse" | "keyboard") => void;
+        close: (event?: Event, restoreFocus?: boolean, skipAnimation?: boolean) => void;
+        toggle: (event?: Event, interactionType?: "mouse" | "keyboard") => void;
         isOpen: () => boolean;
-        setItems: (items: MenuContent[]) => any;
+        setItems: (items: MenuContent[]) => void;
         getItems: () => MenuContent[];
-        setPosition: (position: MenuPosition) => any;
+        setPosition: (position: MenuPosition) => void;
         getPosition: () => MenuPosition;
-        setSelected: (itemId: string) => any;
+        setSelected: (itemId: string) => void;
         getSelected: () => string | null;
     };
     opener: {
-        setOpener: (opener: HTMLElement | string) => any;
+        setOpener: (opener: HTMLElement | string) => void;
         getOpener: () => HTMLElement;
     };
     submenu?: {
@@ -26,8 +26,8 @@ interface ApiOptions {
         closeAllSubmenus: () => void;
     };
     events?: {
-        on: <T extends string>(event: T, handler: (event: any) => void) => any;
-        off: <T extends string>(event: T, handler: (event: any) => void) => any;
+        on: <T extends keyof MenuEvents>(event: T, handler: MenuEvents[T]) => void;
+        off: <T extends keyof MenuEvents>(event: T, handler: MenuEvents[T]) => void;
     };
     lifecycle: {
         destroy: () => void;
@@ -40,9 +40,9 @@ interface ApiOptions {
  */
 interface ComponentWithElements {
     element: HTMLElement;
-    on?: <T extends string>(event: T, handler: (event: any) => void) => any;
-    off?: <T extends string>(event: T, handler: (event: any) => void) => any;
-    emit?: (event: string, data: any) => void;
+    on?: <T extends keyof MenuEvents>(event: T, handler: MenuEvents[T]) => void;
+    off?: <T extends keyof MenuEvents>(event: T, handler: MenuEvents[T]) => void;
+    emit?: (event: string, data: unknown) => void;
 }
 /**
  * Enhances a menu component with API methods.
@@ -54,5 +54,5 @@ interface ComponentWithElements {
  * @category Components
  * @internal This is an internal utility for the Menu component
  */
-declare const withAPI: ({ menu, opener, events, lifecycle, submenu }: ApiOptions) => (component: ComponentWithElements) => MenuComponent;
+declare const withAPI: ({ menu, opener, events, lifecycle }: ApiOptions) => (component: ComponentWithElements) => MenuComponent;
 export { withAPI };

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

@@ -1,4 +1,4 @@
-import { MenuConfig } from './types';
+import { MenuConfig } from "./types";
 /**
  * Default configuration for the Menu component
  * These values will be used when not explicitly specified by the user.
@@ -29,7 +29,7 @@ export declare const createBaseConfig: (config: MenuConfig) => MenuConfig;
 export declare const getElementConfig: (config: MenuConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;

package/dist/components/menu/features/controller.d.ts

@@ -1,4 +1,4 @@
-import { MenuConfig } from '../types';
+import { MenuConfig } from "../types";
 /**
  * Adds controller functionality to the menu component
  * Manages state, rendering, positioning, and event handling

package/dist/components/menu/features/keyboard.d.ts

@@ -1,4 +1,4 @@
-import { MenuItem } from '../types';
+import { MenuItem } from "../types";
 /**
  * Keyboard navigation handler for menus
  * Manages focus management and keyboard interactions for accessibility
@@ -22,5 +22,5 @@ export declare const createKeyboardNavigation: (component: any) => {
  * @param config - Menu configuration
  * @returns Component enhancer with keyboard navigation functionality
  */
-declare const withKeyboard: (config: any) => (component: any) => any;
+declare const withKeyboard: () => (component: any) => any;
 export default withKeyboard;

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

@@ -1,4 +1,4 @@
-import { MenuConfig } from '../types';
+import { MenuConfig } from "../types";
 /**
  * Adds submenu functionality to the menu component
  * Manages creation, positioning, and interaction with nested submenus

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

@@ -1,4 +1,4 @@
-import { MenuConfig, MenuComponent } from './types';
+import { MenuConfig, MenuComponent } from "./types";
 /**
  * Creates a new Menu component with the specified configuration.
  *

package/dist/components/navigation/config.d.ts

@@ -1,4 +1,4 @@
-import { NavigationConfig, BaseComponent, ApiOptions } from './types';
+import { NavigationConfig, BaseComponent, ApiOptions } from "./types";
 /**
  * Default configuration for the Navigation component
  */
@@ -17,7 +17,7 @@ export declare const createBaseConfig: (config?: NavigationConfig) => Navigation
 export declare const getElementConfig: (config: NavigationConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;

package/dist/components/navigation/features/controller.d.ts

@@ -1,4 +1,4 @@
-import { BaseComponent } from '../types';
+import { BaseComponent } from "../types";
 /**
  * Configuration interface for controller feature
  */

package/dist/components/navigation/features/items.d.ts

@@ -1,4 +1,5 @@
-import { NavItemConfig, NavItemData, BaseComponent } from '../types';
+import { NavItemConfig, BaseComponent } from "../types";
+import type { NavItemData } from "../types";
 /**
  * Interface for a component with items management capabilities
  * @internal

package/dist/components/navigation/navigation.d.ts

@@ -1,4 +1,4 @@
-import { NavigationConfig, NavigationComponent } from './types';
+import { NavigationConfig, NavigationComponent } from "./types";
 /**
  * Creates a new Navigation component
  * @param {NavigationConfig} config - Navigation configuration

package/dist/components/navigation/system/core.d.ts

@@ -1,4 +1,4 @@
-import { NavigationSystemState } from './types';
+import { NavigationSystemState } from "./types";
 /**
  * Update drawer content for a specific section WITHOUT changing visibility
  *

package/dist/components/navigation/system/events.d.ts

@@ -1,4 +1,4 @@
-import { NavigationSystemState } from './types';
+import { NavigationSystemState } from "./types";
 /**
  * Registers rail navigation event handlers
  *

package/dist/components/navigation/system/index.d.ts

@@ -1,4 +1,4 @@
-import { NavigationSystemConfig, NavigationSystem } from './types';
+import { NavigationSystemConfig, NavigationSystem } from "./types";
 /**
  * Creates a complete navigation system with synchronized rail and drawer components
  *
@@ -7,4 +7,4 @@ import { NavigationSystemConfig, NavigationSystem } from './types';
  */
 export declare const createNavigationSystem: (options?: NavigationSystemConfig) => NavigationSystem;
 export default createNavigationSystem;
-export * from './types';
+export * from "./types";

package/dist/components/progress/api.d.ts

@@ -1,4 +1,38 @@
-import { ProgressComponent } from './types';
+import { ProgressComponent, ProgressThickness, ProgressShape } from "./types";
+/**
+ * Canvas component interface for API
+ */
+interface CanvasComponent {
+    element: HTMLElement;
+    canvas: HTMLCanvasElement;
+    getClass: (name: string) => string;
+    label?: HTMLElement;
+    state?: {
+        label?: HTMLElement;
+        showLabel?: boolean;
+        value?: number;
+        max?: number;
+        buffer?: number;
+        indeterminate?: boolean;
+        thickness?: number | string;
+        shape?: ProgressShape;
+        labelFormatter?: (value: number, max: number) => string;
+    };
+    draw?: () => void;
+    setThickness?: (thickness: ProgressThickness) => void;
+    setShape?: (shape: ProgressShape) => void;
+    setValue?: (value: number, animate: boolean) => void;
+    setSize?: (size: number) => void;
+    getSize?: () => number | undefined;
+    hide?: () => void;
+    show?: () => void;
+    isVisible?: () => boolean;
+    startIndeterminateAnimation?: () => void;
+    stopIndeterminateAnimation?: () => void;
+}
+/**
+ * API configuration options for canvas-based progress component
+ */
 interface ApiOptions {
     value: {
         getValue: () => number;
@@ -15,10 +49,18 @@ interface ApiOptions {
         isDisabled: () => boolean;
     };
     label: {
-        show: () => void;
-        hide: () => void;
-        format: (formatter: (value: number, max: number) => string) => void;
-        setContent: (content: string) => void;
+        show?: () => void;
+        hide?: () => void;
+        format?: (formatter: (value: number, max: number) => string) => void;
+        formatter?: (value: number, max: number) => string;
+    };
+    thickness?: {
+        getThickness: () => number;
+        setThickness: (thickness: ProgressThickness) => void;
+    };
+    shape?: {
+        getShape: () => ProgressShape;
+        setShape: (shape: ProgressShape) => void;
     };
     state: {
         setIndeterminate: (indeterminate: boolean) => void;
@@ -28,19 +70,8 @@ interface ApiOptions {
         destroy: () => void;
     };
 }
-interface ComponentWithElements {
-    element: HTMLElement;
-    trackElement: HTMLElement;
-    indicatorElement: HTMLElement;
-    labelElement?: HTMLElement;
-    getClass: (name: string) => string;
-    emit: (event: string, data?: any) => void;
-}
 /**
- * Enhances a progress component with API methods
- * @param {ApiOptions} options - API configuration options
- * @returns {Function} Higher-order function that adds API methods to component
- * @internal This is an internal utility for the Progress component
+ * Enhances a canvas-based progress component with a streamlined API
  */
-export declare const withAPI: (options: ApiOptions) => (component: ComponentWithElements) => ProgressComponent;
+export declare const withAPI: (options: ApiOptions) => (comp: CanvasComponent) => ProgressComponent;
 export {};

package/dist/components/progress/config.d.ts

@@ -1,23 +1,27 @@
-import { ProgressConfig } from './types';
+import { ProgressConfig, ProgressThickness, ProgressShape } from "./types";
 /**
  * Default configuration for the Progress component
  */
 export declare const defaultConfig: ProgressConfig;
 /**
- * Creates the base configuration for Progress component
- * @param {ProgressConfig} config - User provided configuration
- * @returns {ProgressConfig} Complete configuration with defaults applied
+ * Creates the base configuration for the Progress component
+ * with all defaults applied (no complex schema needed for canvas)
+ *
+ * @param config User-provided configuration
+ * @returns Complete configuration with defaults
  */
 export declare const createBaseConfig: (config?: ProgressConfig) => ProgressConfig;
 /**
- * Generates element configuration for the Progress component
+ * Generates element configuration for the Progress container
+ * Canvas will be added by withCanvas feature
+ *
  * @param {ProgressConfig} config - Progress configuration
  * @returns {Object} Element configuration object for withElement
  */
 export declare const getElementConfig: (config: ProgressConfig) => {
     tag: string;
     componentName: string;
-    attrs: Record<string, any>;
+    attributes: Record<string, any>;
     className: string[];
     rawClass: string | string[];
     html: string;
@@ -27,11 +31,8 @@ export declare const getElementConfig: (config: ProgressConfig) => {
 };
 /**
  * Creates API configuration for the Progress component
- * @param {Object} comp - Component with state management features
- * @param {Object} state - State object containing component state
- * @returns {Object} API configuration object
  */
-export declare const getApiConfig: (comp: any, state: any) => {
+export declare const getApiConfig: (comp: any) => {
     value: {
         getValue: () => any;
         setValue: (value: number) => void;
@@ -50,7 +51,15 @@ export declare const getApiConfig: (comp: any, state: any) => {
         show: () => void;
         hide: () => void;
         format: (formatter: any) => void;
-        setContent: (content: any) => void;
+        formatter: any;
+    };
+    thickness: {
+        getThickness: () => number;
+        setThickness: (thickness: ProgressThickness) => void;
+    };
+    shape: {
+        getShape: () => any;
+        setShape: (shape: ProgressShape) => void;
     };
     state: {
         setIndeterminate: (indeterminate: boolean) => void;

package/dist/components/progress/constants.d.ts

@@ -7,6 +7,15 @@ export declare const PROGRESS_VARIANTS: {
     /** Circular spinner progress indicator */
     readonly CIRCULAR: "circular";
 };
+/**
+ * Progress component shapes (linear only)
+ */
+export declare const PROGRESS_SHAPES: {
+    /** Standard flat progress */
+    readonly FLAT: "flat";
+    /** Wavy animated progress */
+    readonly WAVY: "wavy";
+};
 /**
  * Progress component events
  */
@@ -28,6 +37,8 @@ export declare const PROGRESS_DEFAULTS: {
     readonly MAX: 100;
     /** Buffer value for linear progress with buffer */
     readonly BUFFER: 0;
+    /** Default shape for linear indeterminate progress */
+    readonly SHAPE: "flat";
     /** Whether to show percentage label */
     readonly SHOW_LABEL: false;
     /** Whether progress is indeterminate */
@@ -43,7 +54,7 @@ export declare const PROGRESS_CLASSES: {
     readonly LINEAR: "progress--linear";
     /** Circular variant class */
     readonly CIRCULAR: "progress--circular";
-    /** Track element (background) class */
+    /** Track element (unfilled part) class */
     readonly TRACK: "progress__track";
     /** Indicator element (filled part) class */
     readonly INDICATOR: "progress__indicator";
@@ -55,4 +66,78 @@ export declare const PROGRESS_CLASSES: {
     readonly INDETERMINATE: "progress--indeterminate";
     /** Disabled state class */
     readonly DISABLED: "progress--disabled";
+    /** Test state class */
+    readonly TEST: "progress--test";
+    readonly TRANSITION: "progress--transition";
+};
+/**
+ * Progress component measurements
+ */
+export declare const PROGRESS_MEASUREMENTS: {
+    readonly LINEAR: {
+        readonly MIN_HEIGHT: 4;
+        readonly GAP: 4;
+        readonly STOP_INDICATOR: 4;
+        readonly HEIGHT: 4;
+    };
+    readonly CIRCULAR: {
+        readonly SIZE: 48;
+        readonly GAP: 8;
+    };
+    readonly COMMON: {
+        readonly STROKE_WIDTH: 4;
+    };
+};
+/**
+ * Thickness presets for progress component
+ * These are the standard thickness options following Material Design 3
+ */
+export declare const PROGRESS_THICKNESS: {
+    /** Thin stroke width (4px) - default */
+    readonly THIN: 4;
+    /** Thick stroke width (8px) */
+    readonly THICK: 8;
+};
+/**
+ * Wave animation parameters for progress components
+ */
+export declare const PROGRESS_WAVE: {
+    /** Linear progress wave parameters */
+    readonly LINEAR: {
+        /** Base amplitude of the wave in pixels */
+        readonly AMPLITUDE: 3;
+        /** Speed of wave animation in waves per second (Hz) */
+        readonly SPEED: 0.88;
+        /** Number of complete waves per 100 pixels */
+        readonly FREQUENCY: 2;
+        /** Number of complete waves per 100 pixels for indeterminate */
+        readonly INDETERMINATE_FREQUENCY: 4;
+        /** Amplitude for indeterminate animation */
+        readonly INDETERMINATE_AMPLITUDE: 2;
+        /** Wave shape power (lower = rounder peaks, higher = sharper) */
+        readonly POWER: 0.8;
+        /** Percentage at which wave amplitude reaches full strength from start */
+        readonly START_TRANSITION_END: 0;
+        /** Percentage at which wave amplitude begins to decrease near end */
+        readonly END_TRANSITION_START: 0.92;
+    };
+    /** Circular progress wave parameters */
+    readonly CIRCULAR: {
+        /** Amplitude as percentage of radius (7 = 7%) */
+        readonly AMPLITUDE: 6;
+        /** Amplitude as percentage of radius for indeterminate (4 = 4%) */
+        readonly INDETERMINATE_AMPLITUDE: 4;
+        /** Speed of wave rotation in rotations per second (Hz), negative value means clockwise */
+        readonly SPEED: 1.1;
+        /** Number of complete waves around the circle */
+        readonly FREQUENCY: 10;
+        /** Number of complete waves for indeterminate animation */
+        readonly INDETERMINATE_FREQUENCY: 16;
+        /** Wave shape power (lower = rounder peaks, higher = sharper) */
+        readonly POWER: 0.8;
+        /** Percentage at which wave amplitude reaches full strength from start */
+        readonly START_TRANSITION_END: 0;
+        /** Percentage at which wave amplitude begins to decrease near end */
+        readonly END_TRANSITION_START: 0.92;
+    };
 };