UNPKG

@sandlada/mdc

Version:

@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.

643 lines 37.8 kB
export declare const TonalPrimaryFabDefinition: { readonly 'container-color': "var(--md-sys-color-primary-container, var(--md-sys-palette-primary-90, #eaddff))"; readonly 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; readonly 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; readonly 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; readonly 'hovered-state-layer-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; readonly 'hovered-state-layer-opacity': "0.08"; readonly 'hovered-icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; readonly 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'focused-state-layer-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; readonly 'focused-state-layer-opacity': "0.12"; readonly 'focused-icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; readonly 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'pressed-state-layer-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; readonly 'pressed-state-layer-opacity': "0.12"; readonly 'pressed-icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; readonly 'small-container-height': "56px"; readonly 'small-container-width': "56px"; readonly 'small-icon-size': "24px"; readonly 'medium-container-height': "80px"; readonly 'medium-container-width': "80px"; readonly 'medium-icon-size': "28px"; readonly 'large-container-height': "96px"; readonly 'large-container-width': "96px"; readonly 'large-icon-size': "36px"; readonly "small-container-shape-start-start": string; readonly "small-container-shape-start-end": string; readonly "small-container-shape-end-end": string; readonly "small-container-shape-end-start": string; readonly "medium-container-shape-start-start": string; readonly "medium-container-shape-start-end": string; readonly "medium-container-shape-end-end": string; readonly "medium-container-shape-end-start": string; readonly "large-container-shape-start-start": string; readonly "large-container-shape-start-end": string; readonly "large-container-shape-end-end": string; readonly "large-container-shape-end-start": string; }; export declare const TonalSecondaryFabDefinition: { readonly 'container-color': "var(--md-sys-color-secondary-container, var(--md-sys-palette-secondary-90, #e8def8))"; readonly 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; readonly 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; readonly 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; readonly 'hovered-state-layer-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; readonly 'hovered-state-layer-opacity': "0.08"; readonly 'hovered-icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; readonly 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'focused-state-layer-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; readonly 'focused-state-layer-opacity': "0.12"; readonly 'focused-icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; readonly 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'pressed-state-layer-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; readonly 'pressed-state-layer-opacity': "0.12"; readonly 'pressed-icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; readonly 'small-container-height': "56px"; readonly 'small-container-width': "56px"; readonly 'small-icon-size': "24px"; readonly 'medium-container-height': "80px"; readonly 'medium-container-width': "80px"; readonly 'medium-icon-size': "28px"; readonly 'large-container-height': "96px"; readonly 'large-container-width': "96px"; readonly 'large-icon-size': "36px"; readonly "small-container-shape-start-start": string; readonly "small-container-shape-start-end": string; readonly "small-container-shape-end-end": string; readonly "small-container-shape-end-start": string; readonly "medium-container-shape-start-start": string; readonly "medium-container-shape-start-end": string; readonly "medium-container-shape-end-end": string; readonly "medium-container-shape-end-start": string; readonly "large-container-shape-start-start": string; readonly "large-container-shape-start-end": string; readonly "large-container-shape-end-end": string; readonly "large-container-shape-end-start": string; }; export declare const TonalTertiaryFabDefinition: { readonly 'container-color': "var(--md-sys-color-tertiary-container, var(--md-sys-palette-tertiary-90, #ffd8e4))"; readonly 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; readonly 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; readonly 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; readonly 'hovered-state-layer-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; readonly 'hovered-state-layer-opacity': "0.08"; readonly 'hovered-icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; readonly 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'focused-state-layer-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; readonly 'focused-state-layer-opacity': "0.12"; readonly 'focused-icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; readonly 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'pressed-state-layer-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; readonly 'pressed-state-layer-opacity': "0.12"; readonly 'pressed-icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; readonly 'small-container-height': "56px"; readonly 'small-container-width': "56px"; readonly 'small-icon-size': "24px"; readonly 'medium-container-height': "80px"; readonly 'medium-container-width': "80px"; readonly 'medium-icon-size': "28px"; readonly 'large-container-height': "96px"; readonly 'large-container-width': "96px"; readonly 'large-icon-size': "36px"; readonly "small-container-shape-start-start": string; readonly "small-container-shape-start-end": string; readonly "small-container-shape-end-end": string; readonly "small-container-shape-end-start": string; readonly "medium-container-shape-start-start": string; readonly "medium-container-shape-start-end": string; readonly "medium-container-shape-end-end": string; readonly "medium-container-shape-end-start": string; readonly "large-container-shape-start-start": string; readonly "large-container-shape-start-end": string; readonly "large-container-shape-end-end": string; readonly "large-container-shape-end-start": string; }; export declare const PrimaryFabDefinition: { readonly 'container-color': "var(--md-sys-color-primary, var(--md-sys-palette-primary-40, #6750a4))"; readonly 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; readonly 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; readonly 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; readonly 'hovered-state-layer-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; readonly 'hovered-state-layer-opacity': "0.08"; readonly 'hovered-icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; readonly 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'focused-state-layer-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; readonly 'focused-state-layer-opacity': "0.12"; readonly 'focused-icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; readonly 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'pressed-state-layer-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; readonly 'pressed-state-layer-opacity': "0.12"; readonly 'pressed-icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; readonly 'small-container-height': "56px"; readonly 'small-container-width': "56px"; readonly 'small-icon-size': "24px"; readonly 'medium-container-height': "80px"; readonly 'medium-container-width': "80px"; readonly 'medium-icon-size': "28px"; readonly 'large-container-height': "96px"; readonly 'large-container-width': "96px"; readonly 'large-icon-size': "36px"; readonly "small-container-shape-start-start": string; readonly "small-container-shape-start-end": string; readonly "small-container-shape-end-end": string; readonly "small-container-shape-end-start": string; readonly "medium-container-shape-start-start": string; readonly "medium-container-shape-start-end": string; readonly "medium-container-shape-end-end": string; readonly "medium-container-shape-end-start": string; readonly "large-container-shape-start-start": string; readonly "large-container-shape-start-end": string; readonly "large-container-shape-end-end": string; readonly "large-container-shape-end-start": string; }; export declare const SecondaryFabDefinition: { readonly 'container-color': "var(--md-sys-color-secondary, var(--md-sys-palette-secondary-40, #625b71))"; readonly 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; readonly 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; readonly 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; readonly 'hovered-state-layer-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; readonly 'hovered-state-layer-opacity': "0.08"; readonly 'hovered-icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; readonly 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'focused-state-layer-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; readonly 'focused-state-layer-opacity': "0.12"; readonly 'focused-icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; readonly 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'pressed-state-layer-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; readonly 'pressed-state-layer-opacity': "0.12"; readonly 'pressed-icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; readonly 'small-container-height': "56px"; readonly 'small-container-width': "56px"; readonly 'small-icon-size': "24px"; readonly 'medium-container-height': "80px"; readonly 'medium-container-width': "80px"; readonly 'medium-icon-size': "28px"; readonly 'large-container-height': "96px"; readonly 'large-container-width': "96px"; readonly 'large-icon-size': "36px"; readonly "small-container-shape-start-start": string; readonly "small-container-shape-start-end": string; readonly "small-container-shape-end-end": string; readonly "small-container-shape-end-start": string; readonly "medium-container-shape-start-start": string; readonly "medium-container-shape-start-end": string; readonly "medium-container-shape-end-end": string; readonly "medium-container-shape-end-start": string; readonly "large-container-shape-start-start": string; readonly "large-container-shape-start-end": string; readonly "large-container-shape-end-end": string; readonly "large-container-shape-end-start": string; }; export declare const TertiaryFabDefinition: { readonly 'container-color': "var(--md-sys-color-tertiary, var(--md-sys-palette-tertiary-40, #7d5260))"; readonly 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; readonly 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; readonly 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; readonly 'hovered-state-layer-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; readonly 'hovered-state-layer-opacity': "0.08"; readonly 'hovered-icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; readonly 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'focused-state-layer-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; readonly 'focused-state-layer-opacity': "0.12"; readonly 'focused-icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; readonly 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; readonly 'pressed-state-layer-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; readonly 'pressed-state-layer-opacity': "0.12"; readonly 'pressed-icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; readonly 'small-container-height': "56px"; readonly 'small-container-width': "56px"; readonly 'small-icon-size': "24px"; readonly 'medium-container-height': "80px"; readonly 'medium-container-width': "80px"; readonly 'medium-icon-size': "28px"; readonly 'large-container-height': "96px"; readonly 'large-container-width': "96px"; readonly 'large-icon-size': "36px"; readonly "small-container-shape-start-start": string; readonly "small-container-shape-start-end": string; readonly "small-container-shape-end-end": string; readonly "small-container-shape-end-start": string; readonly "medium-container-shape-start-start": string; readonly "medium-container-shape-start-end": string; readonly "medium-container-shape-end-end": string; readonly "medium-container-shape-end-start": string; readonly "large-container-shape-start-start": string; readonly "large-container-shape-start-end": string; readonly "large-container-shape-end-end": string; readonly "large-container-shape-end-start": string; }; export declare const TonalPrimaryExtendedFabDefinition: { 'label-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'hovered-label-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'focused-label-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'pressed-label-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; } & { 'small-label-font': "Roboto"; 'small-label-line-height': "24px"; 'small-label-size': "16px"; 'small-label-tracking': "0.15px"; 'small-label-weight': "500"; 'small-leading-space': "16px"; 'small-icon-label-space': "8px"; 'small-trailing-space': "16px"; 'medium-label-font': "Roboto"; 'medium-label-line-height': "28px"; 'medium-label-size': "22px"; 'medium-label-tracking': "0px"; 'medium-label-weight': "400"; 'medium-leading-space': "26px"; 'medium-icon-label-space': "12px"; 'medium-trailing-space': "26px"; 'large-label-font': "Roboto"; 'large-label-line-height': "32px"; 'large-label-size': "24px"; 'large-label-tracking': "0px"; 'large-label-weight': "400"; 'large-leading-space': "28px"; 'large-icon-label-space': "16px"; 'large-trailing-space': "28px"; 'container-color': "var(--md-sys-color-primary-container, var(--md-sys-palette-primary-90, #eaddff))"; 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; 'hovered-state-layer-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'hovered-state-layer-opacity': "0.08"; 'hovered-icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'focused-state-layer-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'focused-state-layer-opacity': "0.12"; 'focused-icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'pressed-state-layer-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'pressed-state-layer-opacity': "0.12"; 'pressed-icon-color': "var(--md-sys-color-on-primary-container, var(--md-sys-palette-primary-10, #21005d))"; 'small-container-height': "56px"; 'small-container-width': "56px"; 'small-icon-size': "24px"; 'medium-container-height': "80px"; 'medium-container-width': "80px"; 'medium-icon-size': "28px"; 'large-container-height': "96px"; 'large-container-width': "96px"; 'large-icon-size': "36px"; "small-container-shape-start-start": string; "small-container-shape-start-end": string; "small-container-shape-end-end": string; "small-container-shape-end-start": string; "medium-container-shape-start-start": string; "medium-container-shape-start-end": string; "medium-container-shape-end-end": string; "medium-container-shape-end-start": string; "large-container-shape-start-start": string; "large-container-shape-start-end": string; "large-container-shape-end-end": string; "large-container-shape-end-start": string; }; export declare const TonalSecondaryExtendedFabDefinition: { 'label-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'hovered-label-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'focused-label-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'pressed-label-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; } & { 'small-label-font': "Roboto"; 'small-label-line-height': "24px"; 'small-label-size': "16px"; 'small-label-tracking': "0.15px"; 'small-label-weight': "500"; 'small-leading-space': "16px"; 'small-icon-label-space': "8px"; 'small-trailing-space': "16px"; 'medium-label-font': "Roboto"; 'medium-label-line-height': "28px"; 'medium-label-size': "22px"; 'medium-label-tracking': "0px"; 'medium-label-weight': "400"; 'medium-leading-space': "26px"; 'medium-icon-label-space': "12px"; 'medium-trailing-space': "26px"; 'large-label-font': "Roboto"; 'large-label-line-height': "32px"; 'large-label-size': "24px"; 'large-label-tracking': "0px"; 'large-label-weight': "400"; 'large-leading-space': "28px"; 'large-icon-label-space': "16px"; 'large-trailing-space': "28px"; 'container-color': "var(--md-sys-color-secondary-container, var(--md-sys-palette-secondary-90, #e8def8))"; 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; 'hovered-state-layer-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'hovered-state-layer-opacity': "0.08"; 'hovered-icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'focused-state-layer-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'focused-state-layer-opacity': "0.12"; 'focused-icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'pressed-state-layer-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'pressed-state-layer-opacity': "0.12"; 'pressed-icon-color': "var(--md-sys-color-on-secondary-container, var(--md-sys-palette-secondary-10, #1d192b))"; 'small-container-height': "56px"; 'small-container-width': "56px"; 'small-icon-size': "24px"; 'medium-container-height': "80px"; 'medium-container-width': "80px"; 'medium-icon-size': "28px"; 'large-container-height': "96px"; 'large-container-width': "96px"; 'large-icon-size': "36px"; "small-container-shape-start-start": string; "small-container-shape-start-end": string; "small-container-shape-end-end": string; "small-container-shape-end-start": string; "medium-container-shape-start-start": string; "medium-container-shape-start-end": string; "medium-container-shape-end-end": string; "medium-container-shape-end-start": string; "large-container-shape-start-start": string; "large-container-shape-start-end": string; "large-container-shape-end-end": string; "large-container-shape-end-start": string; }; export declare const TonalTertiaryExtendedFabDefinition: { 'label-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'hovered-label-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'focused-label-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'pressed-label-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; } & { 'small-label-font': "Roboto"; 'small-label-line-height': "24px"; 'small-label-size': "16px"; 'small-label-tracking': "0.15px"; 'small-label-weight': "500"; 'small-leading-space': "16px"; 'small-icon-label-space': "8px"; 'small-trailing-space': "16px"; 'medium-label-font': "Roboto"; 'medium-label-line-height': "28px"; 'medium-label-size': "22px"; 'medium-label-tracking': "0px"; 'medium-label-weight': "400"; 'medium-leading-space': "26px"; 'medium-icon-label-space': "12px"; 'medium-trailing-space': "26px"; 'large-label-font': "Roboto"; 'large-label-line-height': "32px"; 'large-label-size': "24px"; 'large-label-tracking': "0px"; 'large-label-weight': "400"; 'large-leading-space': "28px"; 'large-icon-label-space': "16px"; 'large-trailing-space': "28px"; 'container-color': "var(--md-sys-color-tertiary-container, var(--md-sys-palette-tertiary-90, #ffd8e4))"; 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; 'hovered-state-layer-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'hovered-state-layer-opacity': "0.08"; 'hovered-icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'focused-state-layer-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'focused-state-layer-opacity': "0.12"; 'focused-icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'pressed-state-layer-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'pressed-state-layer-opacity': "0.12"; 'pressed-icon-color': "var(--md-sys-color-on-tertiary-container, var(--md-sys-palette-tertiary-10, #31111d))"; 'small-container-height': "56px"; 'small-container-width': "56px"; 'small-icon-size': "24px"; 'medium-container-height': "80px"; 'medium-container-width': "80px"; 'medium-icon-size': "28px"; 'large-container-height': "96px"; 'large-container-width': "96px"; 'large-icon-size': "36px"; "small-container-shape-start-start": string; "small-container-shape-start-end": string; "small-container-shape-end-end": string; "small-container-shape-end-start": string; "medium-container-shape-start-start": string; "medium-container-shape-start-end": string; "medium-container-shape-end-end": string; "medium-container-shape-end-start": string; "large-container-shape-start-start": string; "large-container-shape-start-end": string; "large-container-shape-end-end": string; "large-container-shape-end-start": string; }; export declare const PrimaryExtendedFabDefinition: { 'label-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'hovered-label-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'focused-label-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'pressed-label-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; } & { 'small-label-font': "Roboto"; 'small-label-line-height': "24px"; 'small-label-size': "16px"; 'small-label-tracking': "0.15px"; 'small-label-weight': "500"; 'small-leading-space': "16px"; 'small-icon-label-space': "8px"; 'small-trailing-space': "16px"; 'medium-label-font': "Roboto"; 'medium-label-line-height': "28px"; 'medium-label-size': "22px"; 'medium-label-tracking': "0px"; 'medium-label-weight': "400"; 'medium-leading-space': "26px"; 'medium-icon-label-space': "12px"; 'medium-trailing-space': "26px"; 'large-label-font': "Roboto"; 'large-label-line-height': "32px"; 'large-label-size': "24px"; 'large-label-tracking': "0px"; 'large-label-weight': "400"; 'large-leading-space': "28px"; 'large-icon-label-space': "16px"; 'large-trailing-space': "28px"; 'container-color': "var(--md-sys-color-primary, var(--md-sys-palette-primary-40, #6750a4))"; 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; 'hovered-state-layer-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'hovered-state-layer-opacity': "0.08"; 'hovered-icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'focused-state-layer-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'focused-state-layer-opacity': "0.12"; 'focused-icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'pressed-state-layer-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'pressed-state-layer-opacity': "0.12"; 'pressed-icon-color': "var(--md-sys-color-on-primary, var(--md-sys-palette-primary-100, #fff))"; 'small-container-height': "56px"; 'small-container-width': "56px"; 'small-icon-size': "24px"; 'medium-container-height': "80px"; 'medium-container-width': "80px"; 'medium-icon-size': "28px"; 'large-container-height': "96px"; 'large-container-width': "96px"; 'large-icon-size': "36px"; "small-container-shape-start-start": string; "small-container-shape-start-end": string; "small-container-shape-end-end": string; "small-container-shape-end-start": string; "medium-container-shape-start-start": string; "medium-container-shape-start-end": string; "medium-container-shape-end-end": string; "medium-container-shape-end-start": string; "large-container-shape-start-start": string; "large-container-shape-start-end": string; "large-container-shape-end-end": string; "large-container-shape-end-start": string; }; export declare const SecondaryExtendedFabDefinition: { 'label-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'hovered-label-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'focused-label-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'pressed-label-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; } & { 'small-label-font': "Roboto"; 'small-label-line-height': "24px"; 'small-label-size': "16px"; 'small-label-tracking': "0.15px"; 'small-label-weight': "500"; 'small-leading-space': "16px"; 'small-icon-label-space': "8px"; 'small-trailing-space': "16px"; 'medium-label-font': "Roboto"; 'medium-label-line-height': "28px"; 'medium-label-size': "22px"; 'medium-label-tracking': "0px"; 'medium-label-weight': "400"; 'medium-leading-space': "26px"; 'medium-icon-label-space': "12px"; 'medium-trailing-space': "26px"; 'large-label-font': "Roboto"; 'large-label-line-height': "32px"; 'large-label-size': "24px"; 'large-label-tracking': "0px"; 'large-label-weight': "400"; 'large-leading-space': "28px"; 'large-icon-label-space': "16px"; 'large-trailing-space': "28px"; 'container-color': "var(--md-sys-color-secondary, var(--md-sys-palette-secondary-40, #625b71))"; 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; 'hovered-state-layer-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'hovered-state-layer-opacity': "0.08"; 'hovered-icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'focused-state-layer-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'focused-state-layer-opacity': "0.12"; 'focused-icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'pressed-state-layer-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'pressed-state-layer-opacity': "0.12"; 'pressed-icon-color': "var(--md-sys-color-on-secondary, var(--md-sys-palette-secondary-100, #fff))"; 'small-container-height': "56px"; 'small-container-width': "56px"; 'small-icon-size': "24px"; 'medium-container-height': "80px"; 'medium-container-width': "80px"; 'medium-icon-size': "28px"; 'large-container-height': "96px"; 'large-container-width': "96px"; 'large-icon-size': "36px"; "small-container-shape-start-start": string; "small-container-shape-start-end": string; "small-container-shape-end-end": string; "small-container-shape-end-start": string; "medium-container-shape-start-start": string; "medium-container-shape-start-end": string; "medium-container-shape-end-end": string; "medium-container-shape-end-start": string; "large-container-shape-start-start": string; "large-container-shape-start-end": string; "large-container-shape-end-end": string; "large-container-shape-end-start": string; }; export declare const TertiaryExtendedFabDefinition: { 'label-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'hovered-label-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'focused-label-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'pressed-label-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; } & { 'small-label-font': "Roboto"; 'small-label-line-height': "24px"; 'small-label-size': "16px"; 'small-label-tracking': "0.15px"; 'small-label-weight': "500"; 'small-leading-space': "16px"; 'small-icon-label-space': "8px"; 'small-trailing-space': "16px"; 'medium-label-font': "Roboto"; 'medium-label-line-height': "28px"; 'medium-label-size': "22px"; 'medium-label-tracking': "0px"; 'medium-label-weight': "400"; 'medium-leading-space': "26px"; 'medium-icon-label-space': "12px"; 'medium-trailing-space': "26px"; 'large-label-font': "Roboto"; 'large-label-line-height': "32px"; 'large-label-size': "24px"; 'large-label-tracking': "0px"; 'large-label-weight': "400"; 'large-leading-space': "28px"; 'large-icon-label-space': "16px"; 'large-trailing-space': "28px"; 'container-color': "var(--md-sys-color-tertiary, var(--md-sys-palette-tertiary-40, #7d5260))"; 'container-shadow-color': "var(--md-sys-color-shadow, var(--md-sys-palette-neutral-0, #000))"; 'container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'hovered-container-elevation': "var(--md-sys-elevation-level-4, 8)"; 'hovered-state-layer-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'hovered-state-layer-opacity': "0.08"; 'hovered-icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'focused-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'focused-state-layer-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'focused-state-layer-opacity': "0.12"; 'focused-icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'pressed-container-elevation': "var(--md-sys-elevation-level-3, 6)"; 'pressed-state-layer-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'pressed-state-layer-opacity': "0.12"; 'pressed-icon-color': "var(--md-sys-color-on-tertiary, var(--md-sys-palette-tertiary-100, #fff))"; 'small-container-height': "56px"; 'small-container-width': "56px"; 'small-icon-size': "24px"; 'medium-container-height': "80px"; 'medium-container-width': "80px"; 'medium-icon-size': "28px"; 'large-container-height': "96px"; 'large-container-width': "96px"; 'large-icon-size': "36px"; "small-container-shape-start-start": string; "small-container-shape-start-end": string; "small-container-shape-end-end": string; "small-container-shape-end-start": string; "medium-container-shape-start-start": string; "medium-container-shape-start-end": string; "medium-container-shape-end-end": string; "medium-container-shape-end-start": string; "large-container-shape-start-start": string; "large-container-shape-start-end": string; "large-container-shape-end-end": string; "large-container-shape-end-start": string; }; //# sourceMappingURL=fab.definition.d.ts.map