UNPKG

@sandlada/mdk

Version:

A JavaScript library based on Material Design 3, providing data such as color, shape, shadow level, etc.

48 lines (47 loc) 2.71 kB
import type { ICSSDeclaration } from '../interfaces/css-declaration.interface'; type ShapeDeclaration<K extends string, V extends number | string, U extends string> = `${K}: ${V}${U}${';' | ''}`; type ShapeVariable<K extends string, V extends number | string, U extends string> = `var(${K}, ${V}${U})`; export declare class Shape<K extends string, V extends number | string, U extends string> implements ICSSDeclaration<K, V, ShapeDeclaration<K, V, U>, ShapeVariable<K, V, U>> { readonly Key: K; readonly Value: V; readonly Unit: U; toJSON(): { Key: K; Value: V; Unit: U; }; ToCSSDeclaration(): `${K}: ${V}${U}`; ToCSSDeclaration(options: { Semicolon: true; }): `${K}: ${V}${U};`; ToCSSDeclaration(options?: { Semicolon?: boolean; }): `${K}: ${V}${U}${';' | ''}`; ToCSSVariable(): `var(${K}, ${V}${U})`; ToCSSValue(): string; toString(): `${K}: ${V}${U}`; private constructor(); static readonly None: Shape<"--md-sys-shape-corner-none", 0, "px">; static readonly ExtraSmall: Shape<"--md-sys-shape-corner-extra-small", 4, "px">; static readonly Small: Shape<"--md-sys-shape-corner-small", 8, "px">; static readonly Medium: Shape<"--md-sys-shape-corner-medium", 12, "px">; static readonly Large: Shape<"--md-sys-shape-corner-large", 16, "px">; static readonly LargeIncreased: Shape<"--md-sys-shape-corner-large-increased", 20, "px">; static readonly ExtraLarge: Shape<"--md-sys-shape-corner-extra-large", 28, "px">; static readonly ExtraLargeIncreased: Shape<"--md-sys-shape-corner-extra-large-increased", 32, "px">; static readonly ExtraExtraLarge: Shape<"--md-sys-shape-corner-extra-extra-large", 48, "px">; static readonly Full: Shape<"--md-sys-shape-corner-full", "calc(infinity * 1px)", "">; static readonly AllEnums: { readonly None: Shape<"--md-sys-shape-corner-none", 0, "px">; readonly ExtraSmall: Shape<"--md-sys-shape-corner-extra-small", 4, "px">; readonly Small: Shape<"--md-sys-shape-corner-small", 8, "px">; readonly Medium: Shape<"--md-sys-shape-corner-medium", 12, "px">; readonly Large: Shape<"--md-sys-shape-corner-large", 16, "px">; readonly LargeIncreased: Shape<"--md-sys-shape-corner-large-increased", 20, "px">; readonly ExtraLarge: Shape<"--md-sys-shape-corner-extra-large", 28, "px">; readonly ExtraLargeIncreased: Shape<"--md-sys-shape-corner-extra-large-increased", 32, "px">; readonly ExtraExtraLarge: Shape<"--md-sys-shape-corner-extra-extra-large", 48, "px">; readonly Full: Shape<"--md-sys-shape-corner-full", "calc(infinity * 1px)", "">; }; } export {};