UNPKG

@sandlada/mdc

Version:

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

mdc.sandlada.com

sandlada/mdc

104 lines • 7.05 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
/** * Standard bottom sheet — co-exists with main UI, no scrim, `surface` * background. */ export declare const StandardBottomSheetDefinition: { readonly 'enabled-container-max-height-peek': `40vh`; readonly 'enabled-container-max-height-full': `96vh`; readonly 'enabled-container-shape-start-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-shape-start-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-shape-end-start': `0`; readonly 'enabled-container-shape-end-end': `0`; readonly 'dragged-container-shape-start-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-start-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-end-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-end-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-elevation': '1'; readonly 'container-shadow-color': "var(--md-sys-color-shadow, light-dark(#000000, #000000))"; readonly 'header-container-inline-leading-padding-space': `24px`; readonly 'header-container-inline-trailing-padding-space': `24px`; readonly 'header-container-block-leading-padding-space': `0px`; readonly 'header-container-block-trailing-padding-space': `16px`; readonly 'content-container-inline-leading-padding-space': `24px`; readonly 'content-container-inline-trailing-padding-space': `24px`; readonly 'content-container-block-leading-padding-space': `16px`; readonly 'content-container-block-trailing-padding-space': `24px`; readonly 'drag-handle-width': `32px`; readonly 'drag-handle-height': `4px`; readonly 'drag-handle-shape': `2px`; readonly 'drag-handle-container-block-leading-padding-space': `22px`; readonly 'drag-handle-container-block-trailing-padding-space': `22px`; readonly 'enabled-container-color-modal': "var(--md-sys-color-scrim, light-dark(#000000, #000000))"; readonly 'enabled-container-opacity-modal': `0.32`; readonly 'enabled-container-color': "var(--md-sys-color-surface, light-dark(#f4fbf1, #0e150f))"; readonly 'enabled-drag-handle-color': "var(--md-sys-color-on-surface-variant, light-dark(#3d4a3f, #bccabc))"; }; /** * Modal bottom sheet — blocks interaction via scrim, uses * `surface-container-low` background per the Material Components Android * default. */ export declare const ModalBottomSheetDefinition: { readonly 'enabled-container-max-height-peek': `40vh`; readonly 'enabled-container-max-height-full': `96vh`; readonly 'enabled-container-shape-start-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-shape-start-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-shape-end-start': `0`; readonly 'enabled-container-shape-end-end': `0`; readonly 'dragged-container-shape-start-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-start-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-end-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-end-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-elevation': '1'; readonly 'container-shadow-color': "var(--md-sys-color-shadow, light-dark(#000000, #000000))"; readonly 'header-container-inline-leading-padding-space': `24px`; readonly 'header-container-inline-trailing-padding-space': `24px`; readonly 'header-container-block-leading-padding-space': `0px`; readonly 'header-container-block-trailing-padding-space': `16px`; readonly 'content-container-inline-leading-padding-space': `24px`; readonly 'content-container-inline-trailing-padding-space': `24px`; readonly 'content-container-block-leading-padding-space': `16px`; readonly 'content-container-block-trailing-padding-space': `24px`; readonly 'drag-handle-width': `32px`; readonly 'drag-handle-height': `4px`; readonly 'drag-handle-shape': `2px`; readonly 'drag-handle-container-block-leading-padding-space': `22px`; readonly 'drag-handle-container-block-trailing-padding-space': `22px`; readonly 'enabled-container-color-modal': "var(--md-sys-color-scrim, light-dark(#000000, #000000))"; readonly 'enabled-container-opacity-modal': `0.32`; readonly 'enabled-container-color': "var(--md-sys-color-surface-container-low, light-dark(#eff6ec, #171d17))"; readonly 'enabled-drag-handle-color': "var(--md-sys-color-on-surface-variant, light-dark(#3d4a3f, #bccabc))"; }; /** Default definition — the standard variant. */ export declare const BottomSheetDefinition: { readonly 'enabled-container-max-height-peek': `40vh`; readonly 'enabled-container-max-height-full': `96vh`; readonly 'enabled-container-shape-start-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-shape-start-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-shape-end-start': `0`; readonly 'enabled-container-shape-end-end': `0`; readonly 'dragged-container-shape-start-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-start-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-end-start': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'dragged-container-shape-end-end': "var(--md-sys-shape-corner-extra-large, 28px)"; readonly 'enabled-container-elevation': '1'; readonly 'container-shadow-color': "var(--md-sys-color-shadow, light-dark(#000000, #000000))"; readonly 'header-container-inline-leading-padding-space': `24px`; readonly 'header-container-inline-trailing-padding-space': `24px`; readonly 'header-container-block-leading-padding-space': `0px`; readonly 'header-container-block-trailing-padding-space': `16px`; readonly 'content-container-inline-leading-padding-space': `24px`; readonly 'content-container-inline-trailing-padding-space': `24px`; readonly 'content-container-block-leading-padding-space': `16px`; readonly 'content-container-block-trailing-padding-space': `24px`; readonly 'drag-handle-width': `32px`; readonly 'drag-handle-height': `4px`; readonly 'drag-handle-shape': `2px`; readonly 'drag-handle-container-block-leading-padding-space': `22px`; readonly 'drag-handle-container-block-trailing-padding-space': `22px`; readonly 'enabled-container-color-modal': "var(--md-sys-color-scrim, light-dark(#000000, #000000))"; readonly 'enabled-container-opacity-modal': `0.32`; readonly 'enabled-container-color': "var(--md-sys-color-surface, light-dark(#f4fbf1, #0e150f))"; readonly 'enabled-drag-handle-color': "var(--md-sys-color-on-surface-variant, light-dark(#3d4a3f, #bccabc))"; }; //# sourceMappingURL=bottom-sheet.definition.d.ts.map