material 3.2.6 → 3.3.0

package/dist/components/bottom-sheet/types.d.ts

@@ -1,16 +1,10 @@
 import { BOTTOM_SHEET_VARIANTS, BOTTOM_SHEET_STATES } from "./constants.js";
-/** Standard or modal */
 export type BottomSheetVariant = (typeof BOTTOM_SHEET_VARIANTS)[keyof typeof BOTTOM_SHEET_VARIANTS];
-/** How far the sheet is open */
 export type BottomSheetState = (typeof BOTTOM_SHEET_STATES)[keyof typeof BOTTOM_SHEET_STATES];
-/** What a state change reports */
 export interface BottomSheetStateEvent {
-    /** The state the sheet has moved to */
     state: BottomSheetState;
-    /** The state it came from */
     previous: BottomSheetState;
 }
-/** Handlers accepted at creation, one per event name */
 export interface BottomSheetEventHandlers {
     open?: () => void;
     close?: () => void;
@@ -18,118 +12,35 @@ export interface BottomSheetEventHandlers {
     dragStart?: () => void;
     dragEnd?: (event: BottomSheetStateEvent) => void;
 }
-/**
- * Configuration for the bottom sheet.
- *
- * @category Components
- */
 export interface BottomSheetConfig {
-    /**
-     * Standard sheets leave the page usable; modal sheets cover it with a scrim
-     * and take focus.
-     * @default 'modal'
-     */
     variant?: BottomSheetVariant;
-    /**
-     * Headline shown above the content. Also names the sheet for assistive
-     * technology, through `aria-labelledby`.
-     */
     title?: string;
-    /** Body of the sheet, as markup or an element */
     content?: string | HTMLElement;
-    /**
-     * The 32x4dp bar at the top edge, which says the sheet can be dragged.
-     * Turning it off also turns off dragging, since nothing would indicate it.
-     * @default true
-     */
     dragHandle?: boolean;
-    /**
-     * Height of the partially expanded state, in pixels: a sheet with more
-     * content shows this much of it until it is expanded. Unset, the partial
-     * sheet shows its content up to half the screen.
-     */
     peekHeight?: number;
-    /**
-     * The sheet stops growing at this width and centres itself, so it does not
-     * stretch across a desktop window.
-     * @default 640
-     */
     maxWidth?: number;
-    /**
-     * State to start in. `hidden` builds the sheet without showing it.
-     * @default 'hidden'
-     */
     initialState?: BottomSheetState;
-    /**
-     * Whether a click on the scrim closes a modal sheet. Standard sheets have no
-     * scrim, so this does nothing for them.
-     * @default true
-     */
     closeOnScrimClick?: boolean;
-    /**
-     * Whether Escape closes a modal sheet.
-     *
-     * For a modal sheet Escape is a key press, handled by the topmost open
-     * modal only, after whatever is open inside it has had the key: `false`
-     * holds for any number of presses. The remaining limit, with
-     * `layer: "top"`: a close request that is not a key press (a back gesture)
-     * is the browser's `cancel`, which it forces on the third refusal in a row.
-     * @default true
-     */
     closeOnEscape?: boolean;
-    /** Where to mount the sheet. Defaults to `document.body` */
     container?: HTMLElement;
-    /**
-     * `"top"` makes a modal sheet's root a `<dialog>` element, rendered in
-     * `container` like any sheet, and opens it with `showModal()`: in the
-     * browser's top layer, above every z-index and outside any clipping
-     * ancestor, with the rest of the page inert. The scrim is its `::backdrop`,
-     * and Escape reaches the sheet as the dialog's `cancel` event. The sheet
-     * slides as without it.
-     *
-     * A standard sheet stays in the page, and where the browser has no
-     * `showModal()` the sheet behaves as without it.
-     */
     layer?: "top";
-    /** Handlers registered at creation, equivalent to calling `on` for each */
     on?: BottomSheetEventHandlers;
-    /** Extra classes for the root element */
     class?: string;
-    /** @internal */
     prefix?: string;
-    /** @internal */
     componentName?: string;
 }
-/**
- * A bottom sheet instance.
- *
- * @category Components
- */
 export interface BottomSheetComponent {
-    /** The root element, which holds the scrim and the container */
     element: HTMLElement;
-    /** Opens the sheet, partially expanded */
     open: () => BottomSheetComponent;
-    /** Closes the sheet */
     close: () => BottomSheetComponent;
-    /** Opens the sheet to its full height */
     expand: () => BottomSheetComponent;
-    /** Returns the sheet to the peek height */
     collapse: () => BottomSheetComponent;
-    /** Whether the sheet is showing at all */
     isOpen: () => boolean;
-    /** How far the sheet is open */
     getState: () => BottomSheetState;
-    /** Replaces the body of the sheet */
     setContent: (content: string | HTMLElement) => BottomSheetComponent;
-    /** Replaces the headline */
     setTitle: (title: string) => BottomSheetComponent;
-    /** Adds an event listener */
     on: <T extends keyof BottomSheetEventHandlers>(event: T, handler: NonNullable<BottomSheetEventHandlers[T]>) => BottomSheetComponent;
-    /** Removes an event listener */
     off: <T extends keyof BottomSheetEventHandlers>(event: T, handler: NonNullable<BottomSheetEventHandlers[T]>) => BottomSheetComponent;
-    /** Removes the sheet from the page and releases its listeners */
     destroy: () => void;
-    /** Prefixes a class name, for styling hooks */
     getClass: (name: string) => string;
 }

package/dist/components/button/button.d.ts

@@ -1,65 +1,3 @@
 import { ButtonConfig, ButtonComponent } from "./types.js";
-/**
- * Creates a new Button component with the specified configuration.
- *
- * The Button component implements support for different variants, states, and features.
- * It follows accessibility best practices and provides a rich API for state management.
- *
- * The Button component is created using a functional composition pattern,
- * applying various features through the pipe function. This approach allows
- * for flexible and modular component construction.
- *
- * @param {ButtonConfig} config - Configuration options for the button
- *  This can include text content, icon options, variant styling, disabled state,
- *  and other button properties. See {@link ButtonConfig} for available options.
- *
- * @returns {ButtonComponent} A fully configured button component instance with
- *  all requested features applied. The returned component has methods for
- *  manipulation, event handling, and lifecycle management.
- *
- * @throws {Error} Throws an error if button creation fails for any reason
- *
- * @example
- * ```ts
- * // Create a button with integrated progress
- * const submitButton = createButton({
- *   text: 'Submit',
- *   variant: 'filled',
- *   progress: {
- *     variant: 'circular',
- *     size: 18,
- *     indeterminate: true
- *   }
- * });
- *
- * // Create a square button with different sizes
- * const squareButton = createButton({
- *   text: 'Square Button',
- *   variant: 'tonal',
- *   shape: 'square',
- *   size: 'm'  // Square buttons have size-specific corner radius
- * });
- *
- * // Synchronous usage (common for UI interactions)
- * submitButton.on('click', () => {
- *   submitButton.setLoadingSync(true, 'Submitting...');
- *
- *   // Simulate async work
- *   setTimeout(() => {
- *     submitButton.setLoadingSync(false, 'Submit');
- *   }, 2000);
- * });
- *
- * // Asynchronous usage (when you need to ensure progress is loaded)
- * submitButton.on('click', async () => {
- *   await submitButton.setLoading(true, 'Processing...');
- *   await submitButton.setProgress(50);
- *   // ... more async operations
- *   await submitButton.setLoading(false, 'Done');
- * });
- * ```
- *
- * @category Components
- */
 declare const createButton: (config?: ButtonConfig) => ButtonComponent;
 export default createButton;

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

@@ -1,65 +1,28 @@
-/**
- * Button variants
- */
 export declare const BUTTON_VARIANTS: {
-    /** Primary action button with solid background (high emphasis) */
     readonly FILLED: "filled";
-    /** Secondary action button with medium emphasis */
     readonly TONAL: "tonal";
-    /** Button with outline border and transparent background */
     readonly OUTLINED: "outlined";
-    /** Button with slight elevation/shadow */
     readonly ELEVATED: "elevated";
-    /** Button that appears as text without background or border (low emphasis) */
     readonly TEXT: "text";
 };
-/**
- * Available button size variants matching MD3 specifications
- * @category Components
- */
 export declare const BUTTON_SIZES: {
-    /** Extra small size - 32px height */
     readonly XS: "xs";
-    /** Small size - 40px height (default) */
     readonly S: "s";
-    /** Medium size - 56px height */
     readonly M: "m";
-    /** Large size - 96px height */
     readonly L: "l";
-    /** Extra large size - 136px height */
     readonly XL: "xl";
 };
-/**
- * Button size type
- * @category Components
- */
 export type ButtonSize = keyof typeof BUTTON_SIZES;
-/**
- * Available button shape variants
- * @category Components
- */
 export declare const BUTTON_SHAPES: {
-    /** Round shape - pill-shaped buttons (default) */
     readonly ROUND: "round";
-    /** Square shape - buttons with size-specific corner radius */
     readonly SQUARE: "square";
 };
-/**
- * Button shape type
- * @category Components
- */
 export type ButtonShape = keyof typeof BUTTON_SHAPES;
-/**
- * Default button types
- */
 export declare const BUTTON_TYPES: {
     readonly BUTTON: "button";
     readonly SUBMIT: "submit";
     readonly RESET: "reset";
 };
-/**
- * CSS classes used by the button component
- */
 export declare const BUTTON_CLASSES: {
     readonly ROOT: "button";
     readonly ICON: "button__icon";
@@ -67,10 +30,6 @@ export declare const BUTTON_CLASSES: {
     readonly ACTIVE: "button--active";
     readonly DISABLED: "button--disabled";
 };
-/**
- * Default ripple effect configuration
- * Enhanced for better visibility
- */
 export declare const DEFAULT_RIPPLE_CONFIG: {
     readonly DURATION: 450;
 };

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

@@ -1,7 +1,3 @@
-/**
- * Button component module
- * @module components/button
- */
 export { default, default as createButton } from "./button.js";
 export type { ButtonConfig, ButtonComponent, ButtonVariant, ButtonChangePayload } from "./types.js";
 export type { ButtonEvents } from "./types.js";