@rarui/typings 2.1.0 → 2.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -2
- package/dist/index.d.ts +614 -531
- package/package.json +5 -3
package/dist/index.d.ts
CHANGED
|
@@ -11241,7 +11241,7 @@ declare namespace DataType$1 {
|
|
|
11241
11241
|
type VisualBox = "border-box" | "content-box" | "padding-box";
|
|
11242
11242
|
}
|
|
11243
11243
|
|
|
11244
|
-
type CSSVarFunction = `var(--${string})` | `var(--${string}, ${string
|
|
11244
|
+
type CSSVarFunction = `var(--${string})` | `var(--${string}, ${string})`;
|
|
11245
11245
|
|
|
11246
11246
|
declare const simplePseudoMap: {
|
|
11247
11247
|
readonly ':-moz-any-link': true;
|
|
@@ -11280,6 +11280,7 @@ declare const simplePseudoMap: {
|
|
|
11280
11280
|
readonly '::-ms-track': true;
|
|
11281
11281
|
readonly '::-ms-value': true;
|
|
11282
11282
|
readonly '::-webkit-backdrop': true;
|
|
11283
|
+
readonly '::-webkit-calendar-picker-indicator': true;
|
|
11283
11284
|
readonly '::-webkit-inner-spin-button': true;
|
|
11284
11285
|
readonly '::-webkit-input-placeholder': true;
|
|
11285
11286
|
readonly '::-webkit-meter-bar': true;
|
|
@@ -11365,7 +11366,6 @@ declare const simplePseudoMap: {
|
|
|
11365
11366
|
readonly ':visited': true;
|
|
11366
11367
|
};
|
|
11367
11368
|
type SimplePseudos = keyof typeof simplePseudoMap;
|
|
11368
|
-
|
|
11369
11369
|
interface ContainerProperties {
|
|
11370
11370
|
container?: string;
|
|
11371
11371
|
containerType?: 'size' | 'inline-size' | (string & {});
|
|
@@ -11397,12 +11397,12 @@ interface AllQueries<StyleType> extends MediaQueries<StyleType & AllQueries<Styl
|
|
|
11397
11397
|
}
|
|
11398
11398
|
type WithQueries<StyleType> = StyleType & AllQueries<StyleType>;
|
|
11399
11399
|
interface SelectorMap {
|
|
11400
|
-
[selector: string]:
|
|
11400
|
+
[selector: string]: WithQueries<CSSPropertiesWithVars>;
|
|
11401
11401
|
}
|
|
11402
11402
|
interface StyleWithSelectors extends CSSPropertiesAndPseudos {
|
|
11403
11403
|
selectors?: SelectorMap;
|
|
11404
11404
|
}
|
|
11405
|
-
type StyleRule =
|
|
11405
|
+
type StyleRule = WithQueries<StyleWithSelectors>;
|
|
11406
11406
|
type ClassNames = string | Array<ClassNames>;
|
|
11407
11407
|
type ComplexStyleRule = StyleRule | Array<StyleRule | ClassNames>;
|
|
11408
11408
|
|
|
@@ -15094,246 +15094,246 @@ declare namespace DataType {
|
|
|
15094
15094
|
}
|
|
15095
15095
|
|
|
15096
15096
|
declare const shadowProperties: {
|
|
15097
|
-
none: `var(--${string})` | `var(--${string}, ${string})
|
|
15098
|
-
"top-1": `var(--${string})` | `var(--${string}, ${string})
|
|
15099
|
-
"top-2": `var(--${string})` | `var(--${string}, ${string})
|
|
15100
|
-
"top-3": `var(--${string})` | `var(--${string}, ${string})
|
|
15101
|
-
"top-4": `var(--${string})` | `var(--${string}, ${string})
|
|
15102
|
-
"top-5": `var(--${string})` | `var(--${string}, ${string})
|
|
15103
|
-
"bottom-1": `var(--${string})` | `var(--${string}, ${string})
|
|
15104
|
-
"bottom-2": `var(--${string})` | `var(--${string}, ${string})
|
|
15105
|
-
"bottom-3": `var(--${string})` | `var(--${string}, ${string})
|
|
15106
|
-
"bottom-4": `var(--${string})` | `var(--${string}, ${string})
|
|
15107
|
-
"bottom-5": `var(--${string})` | `var(--${string}, ${string})
|
|
15097
|
+
none: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15098
|
+
"top-1": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15099
|
+
"top-2": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15100
|
+
"top-3": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15101
|
+
"top-4": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15102
|
+
"top-5": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15103
|
+
"bottom-1": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15104
|
+
"bottom-2": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15105
|
+
"bottom-3": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15106
|
+
"bottom-4": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15107
|
+
"bottom-5": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15108
15108
|
};
|
|
15109
15109
|
declare const fontWeightProperties: {
|
|
15110
|
-
regular: `var(--${string})` | `var(--${string}, ${string})
|
|
15111
|
-
medium: `var(--${string})` | `var(--${string}, ${string})
|
|
15112
|
-
semiBold: `var(--${string})` | `var(--${string}, ${string})
|
|
15113
|
-
bold: `var(--${string})` | `var(--${string}, ${string})
|
|
15110
|
+
regular: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15111
|
+
medium: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15112
|
+
semiBold: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15113
|
+
bold: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15114
15114
|
};
|
|
15115
15115
|
declare const fontSizeProperties: {
|
|
15116
|
-
"body-xxs": `var(--${string})` | `var(--${string}, ${string})
|
|
15117
|
-
"body-xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15118
|
-
"body-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15119
|
-
"body-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15120
|
-
"body-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15121
|
-
"body-xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15122
|
-
"heading-hero": `var(--${string})` | `var(--${string}, ${string})
|
|
15123
|
-
"heading-xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15124
|
-
"heading-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15125
|
-
"heading-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15126
|
-
"heading-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15127
|
-
"heading-xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15128
|
-
"button-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15129
|
-
"button-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15130
|
-
"button-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15131
|
-
"label-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15132
|
-
"label-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15133
|
-
"label-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15116
|
+
"body-xxs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15117
|
+
"body-xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15118
|
+
"body-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15119
|
+
"body-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15120
|
+
"body-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15121
|
+
"body-xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15122
|
+
"heading-hero": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15123
|
+
"heading-xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15124
|
+
"heading-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15125
|
+
"heading-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15126
|
+
"heading-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15127
|
+
"heading-xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15128
|
+
"button-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15129
|
+
"button-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15130
|
+
"button-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15131
|
+
"label-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15132
|
+
"label-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15133
|
+
"label-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15134
15134
|
};
|
|
15135
15135
|
declare const fontFamilyProperties: {
|
|
15136
|
-
body: `var(--${string})` | `var(--${string}, ${string})
|
|
15137
|
-
heading: `var(--${string})` | `var(--${string}, ${string})
|
|
15138
|
-
button: `var(--${string})` | `var(--${string}, ${string})
|
|
15136
|
+
body: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15137
|
+
heading: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15138
|
+
button: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15139
15139
|
};
|
|
15140
15140
|
declare const lineHeightProperties: {
|
|
15141
|
-
readonly "body-xxs": `var(--${string})` | `var(--${string}, ${string})
|
|
15142
|
-
readonly "body-xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15143
|
-
readonly "body-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15144
|
-
readonly "body-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15145
|
-
readonly "body-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15146
|
-
readonly "body-xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15147
|
-
readonly "heading-hero": `var(--${string})` | `var(--${string}, ${string})
|
|
15148
|
-
readonly "heading-xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15149
|
-
readonly "heading-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15150
|
-
readonly "heading-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15151
|
-
readonly "heading-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15152
|
-
readonly "heading-xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15153
|
-
readonly "button-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15154
|
-
readonly "button-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15155
|
-
readonly "button-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15156
|
-
readonly "label-s": `var(--${string})` | `var(--${string}, ${string})
|
|
15157
|
-
readonly "label-m": `var(--${string})` | `var(--${string}, ${string})
|
|
15158
|
-
readonly "label-l": `var(--${string})` | `var(--${string}, ${string})
|
|
15141
|
+
readonly "body-xxs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15142
|
+
readonly "body-xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15143
|
+
readonly "body-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15144
|
+
readonly "body-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15145
|
+
readonly "body-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15146
|
+
readonly "body-xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15147
|
+
readonly "heading-hero": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15148
|
+
readonly "heading-xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15149
|
+
readonly "heading-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15150
|
+
readonly "heading-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15151
|
+
readonly "heading-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15152
|
+
readonly "heading-xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15153
|
+
readonly "button-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15154
|
+
readonly "button-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15155
|
+
readonly "button-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15156
|
+
readonly "label-s": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15157
|
+
readonly "label-m": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15158
|
+
readonly "label-l": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15159
15159
|
};
|
|
15160
15160
|
declare const spacingProperties: {
|
|
15161
15161
|
readonly none: "0";
|
|
15162
|
-
readonly "4xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15163
|
-
readonly "3xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15164
|
-
readonly "2xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15165
|
-
readonly xs: `var(--${string})` | `var(--${string}, ${string})
|
|
15166
|
-
readonly s: `var(--${string})` | `var(--${string}, ${string})
|
|
15167
|
-
readonly md: `var(--${string})` | `var(--${string}, ${string})
|
|
15168
|
-
readonly lg: `var(--${string})` | `var(--${string}, ${string})
|
|
15169
|
-
readonly xl: `var(--${string})` | `var(--${string}, ${string})
|
|
15170
|
-
readonly "2xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15171
|
-
readonly "3xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15172
|
-
readonly "4xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15173
|
-
readonly "5xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15174
|
-
readonly "6xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15175
|
-
readonly "7xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15176
|
-
readonly "8xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15162
|
+
readonly "4xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15163
|
+
readonly "3xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15164
|
+
readonly "2xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15165
|
+
readonly xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15166
|
+
readonly s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15167
|
+
readonly md: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15168
|
+
readonly lg: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15169
|
+
readonly xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15170
|
+
readonly "2xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15171
|
+
readonly "3xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15172
|
+
readonly "4xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15173
|
+
readonly "5xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15174
|
+
readonly "6xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15175
|
+
readonly "7xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15176
|
+
readonly "8xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15177
15177
|
};
|
|
15178
15178
|
declare const marginProperties: {
|
|
15179
15179
|
none: "0";
|
|
15180
|
-
"4xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15181
|
-
"3xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15182
|
-
"2xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15183
|
-
xs: `var(--${string})` | `var(--${string}, ${string})
|
|
15184
|
-
s: `var(--${string})` | `var(--${string}, ${string})
|
|
15185
|
-
md: `var(--${string})` | `var(--${string}, ${string})
|
|
15186
|
-
lg: `var(--${string})` | `var(--${string}, ${string})
|
|
15187
|
-
xl: `var(--${string})` | `var(--${string}, ${string})
|
|
15188
|
-
"2xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15189
|
-
"3xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15190
|
-
"4xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15191
|
-
"5xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15192
|
-
"6xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15193
|
-
"7xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15194
|
-
"8xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15180
|
+
"4xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15181
|
+
"3xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15182
|
+
"2xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15183
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15184
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15185
|
+
md: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15186
|
+
lg: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15187
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15188
|
+
"2xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15189
|
+
"3xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15190
|
+
"4xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15191
|
+
"5xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15192
|
+
"6xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15193
|
+
"7xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15194
|
+
"8xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15195
15195
|
auto: string;
|
|
15196
15196
|
};
|
|
15197
15197
|
declare const borderRadiusProperties: {
|
|
15198
|
-
none: `var(--${string})` | `var(--${string}, ${string})
|
|
15199
|
-
"2xs": `var(--${string})` | `var(--${string}, ${string})
|
|
15200
|
-
xs: `var(--${string})` | `var(--${string}, ${string})
|
|
15201
|
-
sm: `var(--${string})` | `var(--${string}, ${string})
|
|
15202
|
-
md: `var(--${string})` | `var(--${string}, ${string})
|
|
15203
|
-
lg: `var(--${string})` | `var(--${string}, ${string})
|
|
15204
|
-
xl: `var(--${string})` | `var(--${string}, ${string})
|
|
15205
|
-
"2xl": `var(--${string})` | `var(--${string}, ${string})
|
|
15206
|
-
pill: `var(--${string})` | `var(--${string}, ${string})
|
|
15207
|
-
button: `var(--${string})` | `var(--${string}, ${string})
|
|
15208
|
-
input: `var(--${string})` | `var(--${string}, ${string})
|
|
15198
|
+
none: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15199
|
+
"2xs": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15200
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15201
|
+
sm: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15202
|
+
md: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15203
|
+
lg: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15204
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15205
|
+
"2xl": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15206
|
+
pill: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15207
|
+
button: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15208
|
+
input: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15209
15209
|
};
|
|
15210
15210
|
declare const borderWidthProperties: {
|
|
15211
15211
|
none: string;
|
|
15212
|
-
"1": `var(--${string})` | `var(--${string}, ${string})
|
|
15213
|
-
"2": `var(--${string})` | `var(--${string}, ${string})
|
|
15214
|
-
"3": `var(--${string})` | `var(--${string}, ${string})
|
|
15215
|
-
"4": `var(--${string})` | `var(--${string}, ${string})
|
|
15216
|
-
"5": `var(--${string})` | `var(--${string}, ${string})
|
|
15212
|
+
"1": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15213
|
+
"2": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15214
|
+
"3": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15215
|
+
"4": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15216
|
+
"5": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15217
15217
|
};
|
|
15218
15218
|
declare const zIndexProperties: {
|
|
15219
|
-
"100": `var(--${string})` | `var(--${string}, ${string})
|
|
15220
|
-
"200": `var(--${string})` | `var(--${string}, ${string})
|
|
15221
|
-
"300": `var(--${string})` | `var(--${string}, ${string})
|
|
15222
|
-
"400": `var(--${string})` | `var(--${string}, ${string})
|
|
15223
|
-
"500": `var(--${string})` | `var(--${string}, ${string})
|
|
15224
|
-
"600": `var(--${string})` | `var(--${string}, ${string})
|
|
15225
|
-
"700": `var(--${string})` | `var(--${string}, ${string})
|
|
15226
|
-
"800": `var(--${string})` | `var(--${string}, ${string})
|
|
15227
|
-
"900": `var(--${string})` | `var(--${string}, ${string})
|
|
15219
|
+
"100": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15220
|
+
"200": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15221
|
+
"300": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15222
|
+
"400": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15223
|
+
"500": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15224
|
+
"600": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15225
|
+
"700": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15226
|
+
"800": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15227
|
+
"900": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15228
15228
|
};
|
|
15229
15229
|
declare const colorProperties: {
|
|
15230
15230
|
currentColor: string;
|
|
15231
|
-
brand: `var(--${string})` | `var(--${string}, ${string})
|
|
15232
|
-
"brand-alt": `var(--${string})` | `var(--${string}, ${string})
|
|
15233
|
-
disabled: `var(--${string})` | `var(--${string}, ${string})
|
|
15234
|
-
error: `var(--${string})` | `var(--${string}, ${string})
|
|
15235
|
-
info: `var(--${string})` | `var(--${string}, ${string})
|
|
15236
|
-
invert: `var(--${string})` | `var(--${string}, ${string})
|
|
15237
|
-
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})
|
|
15238
|
-
"invert-secondary": `var(--${string})` | `var(--${string}, ${string})
|
|
15239
|
-
"on-brand": `var(--${string})` | `var(--${string}, ${string})
|
|
15240
|
-
"on-error": `var(--${string})` | `var(--${string}, ${string})
|
|
15241
|
-
"on-info": `var(--${string})` | `var(--${string}, ${string})
|
|
15242
|
-
"on-success": `var(--${string})` | `var(--${string}, ${string})
|
|
15243
|
-
"on-warning": `var(--${string})` | `var(--${string}, ${string})
|
|
15244
|
-
primary: `var(--${string})` | `var(--${string}, ${string})
|
|
15245
|
-
secondary: `var(--${string})` | `var(--${string}, ${string})
|
|
15246
|
-
success: `var(--${string})` | `var(--${string}, ${string})
|
|
15247
|
-
warning: `var(--${string})` | `var(--${string}, ${string})
|
|
15248
|
-
"warning-alt": `var(--${string})` | `var(--${string}, ${string})
|
|
15231
|
+
brand: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15232
|
+
"brand-alt": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15233
|
+
disabled: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15234
|
+
error: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15235
|
+
info: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15236
|
+
invert: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15237
|
+
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15238
|
+
"invert-secondary": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15239
|
+
"on-brand": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15240
|
+
"on-error": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15241
|
+
"on-info": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15242
|
+
"on-success": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15243
|
+
"on-warning": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15244
|
+
primary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15245
|
+
secondary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15246
|
+
success: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15247
|
+
warning: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15248
|
+
"warning-alt": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15249
15249
|
};
|
|
15250
15250
|
declare const borderColorProperties: {
|
|
15251
15251
|
transparent: string;
|
|
15252
|
-
brand: `var(--${string})` | `var(--${string}, ${string})
|
|
15253
|
-
"brand-alt": `var(--${string})` | `var(--${string}, ${string})
|
|
15254
|
-
disabled: `var(--${string})` | `var(--${string}, ${string})
|
|
15255
|
-
divider: `var(--${string})` | `var(--${string}, ${string})
|
|
15256
|
-
error: `var(--${string})` | `var(--${string}, ${string})
|
|
15257
|
-
info: `var(--${string})` | `var(--${string}, ${string})
|
|
15258
|
-
invert: `var(--${string})` | `var(--${string}, ${string})
|
|
15259
|
-
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})
|
|
15260
|
-
primary: `var(--${string})` | `var(--${string}, ${string})
|
|
15261
|
-
secondary: `var(--${string})` | `var(--${string}, ${string})
|
|
15262
|
-
subdued: `var(--${string})` | `var(--${string}, ${string})
|
|
15263
|
-
success: `var(--${string})` | `var(--${string}, ${string})
|
|
15264
|
-
warning: `var(--${string})` | `var(--${string}, ${string})
|
|
15252
|
+
brand: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15253
|
+
"brand-alt": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15254
|
+
disabled: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15255
|
+
divider: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15256
|
+
error: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15257
|
+
info: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15258
|
+
invert: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15259
|
+
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15260
|
+
primary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15261
|
+
secondary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15262
|
+
subdued: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15263
|
+
success: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15264
|
+
warning: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15265
15265
|
};
|
|
15266
15266
|
declare const backgroundColorProperties: {
|
|
15267
15267
|
transparent: string;
|
|
15268
|
-
background: `var(--${string})` | `var(--${string}, ${string})
|
|
15269
|
-
brand: `var(--${string})` | `var(--${string}, ${string})
|
|
15270
|
-
"brand-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15271
|
-
"brand-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15272
|
-
"brand-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15273
|
-
disabled: `var(--${string})` | `var(--${string}, ${string})
|
|
15274
|
-
error: `var(--${string})` | `var(--${string}, ${string})
|
|
15275
|
-
"error-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15276
|
-
"error-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15277
|
-
"error-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15278
|
-
hover: `var(--${string})` | `var(--${string}, ${string})
|
|
15279
|
-
info: `var(--${string})` | `var(--${string}, ${string})
|
|
15280
|
-
"info-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15281
|
-
"info-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15282
|
-
"info-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15283
|
-
invert: `var(--${string})` | `var(--${string}, ${string})
|
|
15284
|
-
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})
|
|
15285
|
-
"invert-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15286
|
-
"invert-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15287
|
-
"invert-secondary": `var(--${string})` | `var(--${string}, ${string})
|
|
15288
|
-
overlay: `var(--${string})` | `var(--${string}, ${string})
|
|
15289
|
-
press: `var(--${string})` | `var(--${string}, ${string})
|
|
15290
|
-
primary: `var(--${string})` | `var(--${string}, ${string})
|
|
15291
|
-
secondary: `var(--${string})` | `var(--${string}, ${string})
|
|
15292
|
-
success: `var(--${string})` | `var(--${string}, ${string})
|
|
15293
|
-
"success-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15294
|
-
"success-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15295
|
-
"success-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15296
|
-
warning: `var(--${string})` | `var(--${string}, ${string})
|
|
15297
|
-
"warning-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15298
|
-
"warning-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15299
|
-
"warning-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15268
|
+
background: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15269
|
+
brand: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15270
|
+
"brand-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15271
|
+
"brand-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15272
|
+
"brand-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15273
|
+
disabled: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15274
|
+
error: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15275
|
+
"error-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15276
|
+
"error-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15277
|
+
"error-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15278
|
+
hover: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15279
|
+
info: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15280
|
+
"info-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15281
|
+
"info-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15282
|
+
"info-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15283
|
+
invert: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15284
|
+
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15285
|
+
"invert-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15286
|
+
"invert-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15287
|
+
"invert-secondary": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15288
|
+
overlay: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15289
|
+
press: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15290
|
+
primary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15291
|
+
secondary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15292
|
+
success: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15293
|
+
"success-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15294
|
+
"success-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15295
|
+
"success-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15296
|
+
warning: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15297
|
+
"warning-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15298
|
+
"warning-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15299
|
+
"warning-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15300
15300
|
};
|
|
15301
15301
|
|
|
15302
15302
|
declare const boxFillProperties: {
|
|
15303
15303
|
currentColor: string;
|
|
15304
15304
|
transparent: string;
|
|
15305
|
-
background: `var(--${string})` | `var(--${string}, ${string})
|
|
15306
|
-
brand: `var(--${string})` | `var(--${string}, ${string})
|
|
15307
|
-
"brand-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15308
|
-
"brand-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15309
|
-
"brand-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15310
|
-
disabled: `var(--${string})` | `var(--${string}, ${string})
|
|
15311
|
-
error: `var(--${string})` | `var(--${string}, ${string})
|
|
15312
|
-
"error-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15313
|
-
"error-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15314
|
-
"error-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15315
|
-
hover: `var(--${string})` | `var(--${string}, ${string})
|
|
15316
|
-
info: `var(--${string})` | `var(--${string}, ${string})
|
|
15317
|
-
"info-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15318
|
-
"info-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15319
|
-
"info-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15320
|
-
invert: `var(--${string})` | `var(--${string}, ${string})
|
|
15321
|
-
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})
|
|
15322
|
-
"invert-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15323
|
-
"invert-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15324
|
-
"invert-secondary": `var(--${string})` | `var(--${string}, ${string})
|
|
15325
|
-
overlay: `var(--${string})` | `var(--${string}, ${string})
|
|
15326
|
-
press: `var(--${string})` | `var(--${string}, ${string})
|
|
15327
|
-
primary: `var(--${string})` | `var(--${string}, ${string})
|
|
15328
|
-
secondary: `var(--${string})` | `var(--${string}, ${string})
|
|
15329
|
-
success: `var(--${string})` | `var(--${string}, ${string})
|
|
15330
|
-
"success-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15331
|
-
"success-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15332
|
-
"success-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15333
|
-
warning: `var(--${string})` | `var(--${string}, ${string})
|
|
15334
|
-
"warning-hover": `var(--${string})` | `var(--${string}, ${string})
|
|
15335
|
-
"warning-press": `var(--${string})` | `var(--${string}, ${string})
|
|
15336
|
-
"warning-subdued": `var(--${string})` | `var(--${string}, ${string})
|
|
15305
|
+
background: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15306
|
+
brand: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15307
|
+
"brand-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15308
|
+
"brand-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15309
|
+
"brand-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15310
|
+
disabled: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15311
|
+
error: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15312
|
+
"error-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15313
|
+
"error-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15314
|
+
"error-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15315
|
+
hover: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15316
|
+
info: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15317
|
+
"info-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15318
|
+
"info-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15319
|
+
"info-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15320
|
+
invert: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15321
|
+
"invert-disabled": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15322
|
+
"invert-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15323
|
+
"invert-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15324
|
+
"invert-secondary": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15325
|
+
overlay: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15326
|
+
press: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15327
|
+
primary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15328
|
+
secondary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15329
|
+
success: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15330
|
+
"success-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15331
|
+
"success-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15332
|
+
"success-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15333
|
+
warning: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15334
|
+
"warning-hover": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15335
|
+
"warning-press": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15336
|
+
"warning-subdued": `var(--${string})` | `var(--${string}, ${string})`;
|
|
15337
15337
|
};
|
|
15338
15338
|
|
|
15339
15339
|
interface BoxConditions<T> extends Conditions<T> {
|
|
@@ -15343,7 +15343,7 @@ interface BoxConditions<T> extends Conditions<T> {
|
|
|
15343
15343
|
hover?: T;
|
|
15344
15344
|
disabled?: T;
|
|
15345
15345
|
}
|
|
15346
|
-
type BoxDynamicProperties = Pick<StandardLonghandProperties, "display" | "width" | "height" | "maxWidth" | "maxHeight" | "minWidth" | "minHeight" | "bottom" | "left" | "right" | "top" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "flexShrink" | "flexGrow" | "order" | "transitionDelay" | "transitionProperty" | "backgroundImage" | "backgroundBlendMode" | "backgroundRepeat" | "backgroundSize" | "flexDirection" | "flexWrap" | "flexBasis" | "justifyContent" | "justifyItems" | "alignContent" | "alignItems" | "alignSelf" | "pointerEvents" | "position" | "boxSizing" | "cursor" | "overflowX" | "overflowY" | "transitionTimingFunction" | "textAlign" | "opacity" | "backgroundPositionY" | "backgroundPositionX"> & Pick<StandardShorthandProperties, "flex" | "gridArea" | "backgroundPosition" | "flexFlow" | "borderStyle" | "overflow" | "textDecoration">;
|
|
15346
|
+
type BoxDynamicProperties = Pick<StandardLonghandProperties, "display" | "width" | "height" | "maxWidth" | "maxHeight" | "minWidth" | "minHeight" | "bottom" | "left" | "right" | "top" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "flexShrink" | "flexGrow" | "order" | "transitionDelay" | "transitionProperty" | "backgroundImage" | "backgroundBlendMode" | "backgroundRepeat" | "backgroundSize" | "flexDirection" | "flexWrap" | "flexBasis" | "justifyContent" | "justifyItems" | "alignContent" | "alignItems" | "alignSelf" | "pointerEvents" | "position" | "boxSizing" | "cursor" | "overflowX" | "overflowY" | "transitionTimingFunction" | "textAlign" | "opacity" | "backgroundPositionY" | "backgroundPositionX" | "verticalAlign" | "whiteSpace"> & Pick<StandardShorthandProperties, "flex" | "gridArea" | "backgroundPosition" | "flexFlow" | "borderStyle" | "overflow" | "textDecoration">;
|
|
15347
15347
|
interface BoxSprinkle extends BoxDynamicProperties {
|
|
15348
15348
|
/**
|
|
15349
15349
|
* The gap property sets the gaps between rows and columns. It is a shorthand for rowGap and columnGap.
|
|
@@ -15552,7 +15552,6 @@ interface BoxSprinkle extends BoxDynamicProperties {
|
|
|
15552
15552
|
fontWeight?: AddDollar<keyof typeof fontWeightProperties> | BoxConditions<AddDollar<keyof typeof fontWeightProperties>>;
|
|
15553
15553
|
/**
|
|
15554
15554
|
* The lineHeight property specifies the line height of the box.
|
|
15555
|
-
* @default base
|
|
15556
15555
|
*/
|
|
15557
15556
|
lineHeight?: AddDollar<keyof typeof lineHeightProperties> | BoxConditions<AddDollar<keyof typeof lineHeightProperties>>;
|
|
15558
15557
|
}
|
|
@@ -15561,43 +15560,47 @@ declare const chipStyles: {
|
|
|
15561
15560
|
chip: RuntimeFn<{
|
|
15562
15561
|
/**
|
|
15563
15562
|
* Specifies whether the chip will be displayed in the pill shape
|
|
15563
|
+
* @default false
|
|
15564
15564
|
*/
|
|
15565
15565
|
pill: {
|
|
15566
15566
|
true: {
|
|
15567
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
15567
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15568
15568
|
};
|
|
15569
15569
|
};
|
|
15570
15570
|
/**
|
|
15571
15571
|
* Specifies whether the chip is selected
|
|
15572
|
+
* @default false
|
|
15572
15573
|
*/
|
|
15573
15574
|
selected: {
|
|
15574
15575
|
true: {
|
|
15575
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15576
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15577
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15576
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15577
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15578
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15578
15579
|
":hover": {
|
|
15579
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15580
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15580
15581
|
};
|
|
15581
15582
|
};
|
|
15582
15583
|
};
|
|
15583
15584
|
/**
|
|
15584
15585
|
* Specifies the size of the chip
|
|
15586
|
+
* @default medium
|
|
15585
15587
|
*/
|
|
15586
15588
|
size: {
|
|
15587
15589
|
medium: {
|
|
15588
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15589
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15590
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15591
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15590
15592
|
height: "2rem";
|
|
15591
15593
|
};
|
|
15592
15594
|
small: {
|
|
15593
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15594
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15595
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15596
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15595
15597
|
height: "1.5rem";
|
|
15596
15598
|
};
|
|
15597
15599
|
};
|
|
15598
15600
|
/**
|
|
15599
15601
|
* Specifies whether to handle text overflow within the chip.
|
|
15600
15602
|
* When true, overflowing text is typically truncated with an ellipsis.
|
|
15603
|
+
* @default false
|
|
15601
15604
|
*/
|
|
15602
15605
|
textOverflow: {
|
|
15603
15606
|
true: {
|
|
@@ -15652,14 +15655,17 @@ interface DividerSprinkle {
|
|
|
15652
15655
|
size?: string | Conditions<string>;
|
|
15653
15656
|
/**
|
|
15654
15657
|
* The **`type`** shorthand CSS property sets the line style for all four sides of an element's.
|
|
15658
|
+
* @default solid
|
|
15655
15659
|
*/
|
|
15656
15660
|
type?: AddDollar<DividerBorderStyle> | Conditions<AddDollar<DividerBorderStyle>>;
|
|
15657
15661
|
/**
|
|
15658
15662
|
* The **`thickness`** shorthand CSS property sets the width of an element's.
|
|
15663
|
+
* @default $1
|
|
15659
15664
|
*/
|
|
15660
15665
|
thickness?: AddDollar<keyof typeof dividerBorderWidthProperties> | Conditions<AddDollar<keyof typeof dividerBorderWidthProperties>>;
|
|
15661
15666
|
/**
|
|
15662
15667
|
* The **`color`** CSS property sets an element's color.
|
|
15668
|
+
* @default $divider
|
|
15663
15669
|
*/
|
|
15664
15670
|
color?: AddDollar<keyof typeof borderColorProperties> | Conditions<AddDollar<keyof typeof borderColorProperties>>;
|
|
15665
15671
|
}
|
|
@@ -15673,20 +15679,20 @@ interface IconSprinkle extends IconDynamicProperties {
|
|
|
15673
15679
|
}
|
|
15674
15680
|
|
|
15675
15681
|
declare const textLineHeightProperties: {
|
|
15676
|
-
xxs: `var(--${string})` | `var(--${string}, ${string})
|
|
15677
|
-
xs: `var(--${string})` | `var(--${string}, ${string})
|
|
15678
|
-
s: `var(--${string})` | `var(--${string}, ${string})
|
|
15679
|
-
m: `var(--${string})` | `var(--${string}, ${string})
|
|
15680
|
-
l: `var(--${string})` | `var(--${string}, ${string})
|
|
15681
|
-
xl: `var(--${string})` | `var(--${string}, ${string})
|
|
15682
|
+
xxs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15683
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15684
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15685
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15686
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15687
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15682
15688
|
};
|
|
15683
15689
|
declare const textFontSizeProperties: {
|
|
15684
|
-
xxs: `var(--${string})` | `var(--${string}, ${string})
|
|
15685
|
-
xs: `var(--${string})` | `var(--${string}, ${string})
|
|
15686
|
-
s: `var(--${string})` | `var(--${string}, ${string})
|
|
15687
|
-
m: `var(--${string})` | `var(--${string}, ${string})
|
|
15688
|
-
l: `var(--${string})` | `var(--${string}, ${string})
|
|
15689
|
-
xl: `var(--${string})` | `var(--${string}, ${string})
|
|
15690
|
+
xxs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15691
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15692
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15693
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15694
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15695
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15690
15696
|
};
|
|
15691
15697
|
|
|
15692
15698
|
type TextDynamicProperties = Pick<StandardLonghandProperties, "textAlign" | "wordBreak" | "textTransform" | "textOverflow" | "width" | "whiteSpace"> & Pick<StandardShorthandProperties, "textDecoration" | "overflow">;
|
|
@@ -15719,20 +15725,20 @@ interface SkeletonSprinkle extends SkeletonDynamicProperties {
|
|
|
15719
15725
|
}
|
|
15720
15726
|
|
|
15721
15727
|
declare const titleLineHeightProperties: {
|
|
15722
|
-
hero: `var(--${string})` | `var(--${string}, ${string})
|
|
15723
|
-
xs: `var(--${string})` | `var(--${string}, ${string})
|
|
15724
|
-
s: `var(--${string})` | `var(--${string}, ${string})
|
|
15725
|
-
m: `var(--${string})` | `var(--${string}, ${string})
|
|
15726
|
-
l: `var(--${string})` | `var(--${string}, ${string})
|
|
15727
|
-
xl: `var(--${string})` | `var(--${string}, ${string})
|
|
15728
|
+
hero: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15729
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15730
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15731
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15732
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15733
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15728
15734
|
};
|
|
15729
15735
|
declare const titleFontSizeProperties: {
|
|
15730
|
-
hero: `var(--${string})` | `var(--${string}, ${string})
|
|
15731
|
-
xs: `var(--${string})` | `var(--${string}, ${string})
|
|
15732
|
-
s: `var(--${string})` | `var(--${string}, ${string})
|
|
15733
|
-
m: `var(--${string})` | `var(--${string}, ${string})
|
|
15734
|
-
l: `var(--${string})` | `var(--${string}, ${string})
|
|
15735
|
-
xl: `var(--${string})` | `var(--${string}, ${string})
|
|
15736
|
+
hero: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15737
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15738
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15739
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15740
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15741
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15736
15742
|
};
|
|
15737
15743
|
|
|
15738
15744
|
type TitleDynamicProperties = Pick<StandardLonghandProperties, "textAlign" | "textTransform"> & Pick<StandardShorthandProperties, "textDecoration">;
|
|
@@ -15767,24 +15773,24 @@ declare const avatarStyles: {
|
|
|
15767
15773
|
small: {
|
|
15768
15774
|
width: "20px";
|
|
15769
15775
|
height: "20px";
|
|
15770
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15776
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15771
15777
|
};
|
|
15772
15778
|
medium: {
|
|
15773
15779
|
width: "30px";
|
|
15774
15780
|
height: "30px";
|
|
15775
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15781
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15776
15782
|
};
|
|
15777
15783
|
large: {
|
|
15778
15784
|
width: "40px";
|
|
15779
15785
|
height: "40px";
|
|
15780
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15781
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
15786
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15787
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15782
15788
|
};
|
|
15783
15789
|
xLarge: {
|
|
15784
15790
|
width: "60px";
|
|
15785
15791
|
height: "60px";
|
|
15786
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15787
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
15792
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15793
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15788
15794
|
};
|
|
15789
15795
|
};
|
|
15790
15796
|
}>;
|
|
@@ -15807,7 +15813,7 @@ declare const avatarStyles: {
|
|
|
15807
15813
|
}>;
|
|
15808
15814
|
};
|
|
15809
15815
|
|
|
15810
|
-
type AvatarVariants = RecipeVariants<typeof avatarStyles.avatar
|
|
15816
|
+
type AvatarVariants = NonNullable<RecipeVariants<typeof avatarStyles.avatar>>;
|
|
15811
15817
|
|
|
15812
15818
|
declare const badgeStyles: {
|
|
15813
15819
|
badge: RuntimeFn<{
|
|
@@ -15817,63 +15823,63 @@ declare const badgeStyles: {
|
|
|
15817
15823
|
*/
|
|
15818
15824
|
appearance: {
|
|
15819
15825
|
brand: {
|
|
15820
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15821
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15822
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15826
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15827
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15828
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15823
15829
|
};
|
|
15824
15830
|
danger: {
|
|
15825
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15826
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15827
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15831
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15832
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15833
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15828
15834
|
};
|
|
15829
15835
|
success: {
|
|
15830
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15831
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15832
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15836
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15837
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15838
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15833
15839
|
};
|
|
15834
15840
|
warning: {
|
|
15835
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15836
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15837
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15841
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15842
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15843
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15838
15844
|
};
|
|
15839
15845
|
info: {
|
|
15840
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15841
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15842
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15846
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15847
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15848
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15843
15849
|
};
|
|
15844
15850
|
neutral: {
|
|
15845
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15846
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15847
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15851
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15852
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15853
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15848
15854
|
};
|
|
15849
15855
|
inverted: {
|
|
15850
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15851
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15852
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15856
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15857
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15858
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15853
15859
|
};
|
|
15854
15860
|
};
|
|
15855
15861
|
/**
|
|
15856
15862
|
* Specifies the size of the badge, controlling its dimensions.
|
|
15857
|
-
* @
|
|
15863
|
+
* @default medium
|
|
15858
15864
|
*/
|
|
15859
15865
|
size: {
|
|
15860
15866
|
large: {
|
|
15861
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15867
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15862
15868
|
height: "3rem";
|
|
15863
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15864
|
-
fontWeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15869
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15870
|
+
fontWeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15865
15871
|
};
|
|
15866
15872
|
medium: {
|
|
15867
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15873
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15868
15874
|
height: "2em";
|
|
15869
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15870
|
-
fontWeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15875
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15876
|
+
fontWeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15871
15877
|
};
|
|
15872
15878
|
small: {
|
|
15873
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15879
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15874
15880
|
height: "1.5rem";
|
|
15875
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15876
|
-
fontWeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15881
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15882
|
+
fontWeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15877
15883
|
};
|
|
15878
15884
|
dot: {
|
|
15879
15885
|
height: "0.5rem";
|
|
@@ -15882,14 +15888,14 @@ declare const badgeStyles: {
|
|
|
15882
15888
|
};
|
|
15883
15889
|
/**
|
|
15884
15890
|
* Defines the visual variant of the badge, affecting its background style.
|
|
15885
|
-
* @
|
|
15891
|
+
* @default solid
|
|
15886
15892
|
*/
|
|
15887
15893
|
variant: {
|
|
15888
15894
|
solid: {};
|
|
15889
15895
|
outlined: {
|
|
15890
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
15896
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15891
15897
|
borderStyle: "solid";
|
|
15892
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15898
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15893
15899
|
};
|
|
15894
15900
|
};
|
|
15895
15901
|
}>;
|
|
@@ -15912,75 +15918,77 @@ declare const buttonStyles: {
|
|
|
15912
15918
|
/**
|
|
15913
15919
|
* Defines the appearance variants for the button component.
|
|
15914
15920
|
* Each appearance variant corresponds to a specific background color, border color, and text color.
|
|
15921
|
+
* @default brand
|
|
15915
15922
|
*/
|
|
15916
15923
|
appearance: {
|
|
15917
15924
|
brand: {
|
|
15918
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15919
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15920
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15925
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15926
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15927
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15921
15928
|
};
|
|
15922
15929
|
danger: {
|
|
15923
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15924
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15925
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15930
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15931
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15932
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15926
15933
|
};
|
|
15927
15934
|
success: {
|
|
15928
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15929
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15930
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15935
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15936
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15937
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15931
15938
|
};
|
|
15932
15939
|
warning: {
|
|
15933
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15934
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15935
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15940
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15941
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15942
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15936
15943
|
};
|
|
15937
15944
|
neutral: {
|
|
15938
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15939
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15940
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15945
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15946
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15947
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15941
15948
|
};
|
|
15942
15949
|
inverted: {
|
|
15943
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15944
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15945
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15950
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15951
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15952
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15946
15953
|
};
|
|
15947
15954
|
};
|
|
15948
15955
|
/**
|
|
15949
15956
|
* Defines the size of the button component.
|
|
15950
|
-
* @default
|
|
15957
|
+
* @default large
|
|
15951
15958
|
*/
|
|
15952
15959
|
size: {
|
|
15953
15960
|
large: {
|
|
15954
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
15955
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15961
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15962
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15956
15963
|
height: "3rem";
|
|
15957
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15964
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15958
15965
|
};
|
|
15959
15966
|
medium: {
|
|
15960
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
15961
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15967
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15968
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15962
15969
|
height: "2.5rem";
|
|
15963
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15970
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15964
15971
|
};
|
|
15965
15972
|
small: {
|
|
15966
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
15967
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15973
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15974
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15968
15975
|
height: "2rem";
|
|
15969
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15976
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15970
15977
|
};
|
|
15971
15978
|
};
|
|
15972
15979
|
/**
|
|
15973
15980
|
* Defines the visual variant of the badge, affecting its background style, border and text.
|
|
15981
|
+
* @default solid
|
|
15974
15982
|
*/
|
|
15975
15983
|
variant: {
|
|
15976
15984
|
solid: {
|
|
15977
15985
|
selectors: {
|
|
15978
15986
|
"&:hover:after": {
|
|
15979
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15987
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15980
15988
|
};
|
|
15981
15989
|
"&:active:after": {
|
|
15982
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15983
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15990
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15991
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15984
15992
|
};
|
|
15985
15993
|
};
|
|
15986
15994
|
};
|
|
@@ -16001,6 +16009,7 @@ declare const buttonStyles: {
|
|
|
16001
16009
|
|
|
16002
16010
|
type ButtonVariants = NonNullable<RecipeVariants<typeof buttonStyles.button>>;
|
|
16003
16011
|
|
|
16012
|
+
declare const overlayBackgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16004
16013
|
declare const checkboxStyles: {
|
|
16005
16014
|
checkbox: RuntimeFn<{
|
|
16006
16015
|
/**
|
|
@@ -16008,9 +16017,9 @@ declare const checkboxStyles: {
|
|
|
16008
16017
|
*/
|
|
16009
16018
|
error: {
|
|
16010
16019
|
true: {
|
|
16011
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16020
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16012
16021
|
":checked": {
|
|
16013
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16022
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16014
16023
|
};
|
|
16015
16024
|
};
|
|
16016
16025
|
};
|
|
@@ -16052,7 +16061,7 @@ declare const checkboxStyles: {
|
|
|
16052
16061
|
error: {
|
|
16053
16062
|
true: {
|
|
16054
16063
|
vars: {
|
|
16055
|
-
[
|
|
16064
|
+
[overlayBackgroundColor]: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16056
16065
|
};
|
|
16057
16066
|
};
|
|
16058
16067
|
};
|
|
@@ -16067,37 +16076,38 @@ declare const iconButtonStyles: {
|
|
|
16067
16076
|
iconButton: RuntimeFn<{
|
|
16068
16077
|
/**
|
|
16069
16078
|
* Determines the visual style of the icon button, influencing its color scheme and appearance.
|
|
16079
|
+
* @default brand
|
|
16070
16080
|
*/
|
|
16071
16081
|
appearance: {
|
|
16072
16082
|
brand: {
|
|
16073
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16074
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16075
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16083
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16084
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16085
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16076
16086
|
};
|
|
16077
16087
|
danger: {
|
|
16078
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16079
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16080
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16088
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16089
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16090
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16081
16091
|
};
|
|
16082
16092
|
success: {
|
|
16083
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16084
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16085
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16093
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16094
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16095
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16086
16096
|
};
|
|
16087
16097
|
warning: {
|
|
16088
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16089
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16090
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16098
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16099
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16100
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16091
16101
|
};
|
|
16092
16102
|
neutral: {
|
|
16093
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16094
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16095
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16103
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16104
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16105
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16096
16106
|
};
|
|
16097
16107
|
inverted: {
|
|
16098
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16099
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16100
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16108
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16109
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16110
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16101
16111
|
};
|
|
16102
16112
|
};
|
|
16103
16113
|
/**
|
|
@@ -16108,31 +16118,32 @@ declare const iconButtonStyles: {
|
|
|
16108
16118
|
large: {
|
|
16109
16119
|
height: "3rem";
|
|
16110
16120
|
width: "3rem";
|
|
16111
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16121
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16112
16122
|
};
|
|
16113
16123
|
medium: {
|
|
16114
16124
|
height: "2.5rem";
|
|
16115
16125
|
width: "2.5rem";
|
|
16116
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16126
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16117
16127
|
};
|
|
16118
16128
|
small: {
|
|
16119
16129
|
height: "2rem";
|
|
16120
16130
|
width: "2rem";
|
|
16121
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16131
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16122
16132
|
};
|
|
16123
16133
|
};
|
|
16124
16134
|
variant: {
|
|
16125
16135
|
/**
|
|
16126
16136
|
* Defines the visual variant of the icon button, affecting its background style, border and text.
|
|
16137
|
+
* @default solid
|
|
16127
16138
|
*/
|
|
16128
16139
|
solid: {
|
|
16129
16140
|
selectors: {
|
|
16130
16141
|
"&:hover:after": {
|
|
16131
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16142
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16132
16143
|
};
|
|
16133
16144
|
"&:active:after": {
|
|
16134
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16135
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16145
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16146
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16136
16147
|
};
|
|
16137
16148
|
};
|
|
16138
16149
|
};
|
|
@@ -16147,18 +16158,25 @@ declare const iconButtonStyles: {
|
|
|
16147
16158
|
borderColor: "transparent";
|
|
16148
16159
|
};
|
|
16149
16160
|
};
|
|
16161
|
+
/**
|
|
16162
|
+
* Defines if the button should have rounded edges.
|
|
16163
|
+
*
|
|
16164
|
+
* - `true`: The button will be rendered with completely rounded edges, useful for circular -shaped icons.
|
|
16165
|
+
* - `false` (default): The button will have standard edges or defined by the component style.
|
|
16166
|
+
* @default false
|
|
16167
|
+
*/
|
|
16150
16168
|
rounded: {
|
|
16151
16169
|
true: {
|
|
16152
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
16170
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16153
16171
|
":after": {
|
|
16154
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
16172
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16155
16173
|
};
|
|
16156
16174
|
};
|
|
16157
16175
|
};
|
|
16158
16176
|
}>;
|
|
16159
16177
|
};
|
|
16160
16178
|
|
|
16161
|
-
type IconButtonVariants = RecipeVariants<typeof iconButtonStyles.iconButton
|
|
16179
|
+
type IconButtonVariants = NonNullable<RecipeVariants<typeof iconButtonStyles.iconButton>>;
|
|
16162
16180
|
|
|
16163
16181
|
declare const styles$6: {
|
|
16164
16182
|
container: RuntimeFn<{
|
|
@@ -16167,30 +16185,31 @@ declare const styles$6: {
|
|
|
16167
16185
|
*/
|
|
16168
16186
|
appearance: {
|
|
16169
16187
|
success: {
|
|
16170
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16188
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16171
16189
|
":hover": {
|
|
16172
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16190
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16173
16191
|
};
|
|
16174
16192
|
":focus": {
|
|
16175
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16193
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16176
16194
|
};
|
|
16177
16195
|
};
|
|
16178
16196
|
error: {
|
|
16179
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16197
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16180
16198
|
":hover": {
|
|
16181
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16199
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16182
16200
|
};
|
|
16183
16201
|
":focus": {
|
|
16184
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16202
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16185
16203
|
};
|
|
16186
16204
|
};
|
|
16187
16205
|
};
|
|
16188
16206
|
/**
|
|
16189
16207
|
* Determines if the input have borders or not.
|
|
16208
|
+
* @default true
|
|
16190
16209
|
*/
|
|
16191
16210
|
border: {
|
|
16192
16211
|
true: {
|
|
16193
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
16212
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16194
16213
|
};
|
|
16195
16214
|
false: {
|
|
16196
16215
|
borderWidth: number;
|
|
@@ -16211,42 +16230,44 @@ declare const styles$6: {
|
|
|
16211
16230
|
input: RuntimeFn<{
|
|
16212
16231
|
/**
|
|
16213
16232
|
* Places a divider between the input and the leading components
|
|
16233
|
+
* @default true
|
|
16214
16234
|
*/
|
|
16215
16235
|
divider: {
|
|
16216
16236
|
false: {};
|
|
16217
16237
|
};
|
|
16218
16238
|
/**
|
|
16219
16239
|
* Specifies the size of the input, controlling its dimensions.
|
|
16240
|
+
* @default medium
|
|
16220
16241
|
*/
|
|
16221
16242
|
size: {
|
|
16222
16243
|
large: {
|
|
16223
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16224
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
16244
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16245
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16225
16246
|
};
|
|
16226
16247
|
medium: {
|
|
16227
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16228
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
16248
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16249
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16229
16250
|
};
|
|
16230
16251
|
small: {
|
|
16231
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16232
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
16233
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16252
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16253
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16254
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16234
16255
|
};
|
|
16235
16256
|
};
|
|
16236
16257
|
}>;
|
|
16237
16258
|
leading: RuntimeFn<{
|
|
16238
16259
|
position: {
|
|
16239
16260
|
start: {
|
|
16240
|
-
borderRightWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
16261
|
+
borderRightWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16241
16262
|
};
|
|
16242
16263
|
end: {
|
|
16243
|
-
borderLeftWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
16264
|
+
borderLeftWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16244
16265
|
};
|
|
16245
16266
|
};
|
|
16246
16267
|
divider: {
|
|
16247
16268
|
true: {
|
|
16248
16269
|
borderStyle: "solid";
|
|
16249
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16270
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16250
16271
|
};
|
|
16251
16272
|
false: {
|
|
16252
16273
|
borderRightWidth: number;
|
|
@@ -16255,25 +16276,25 @@ declare const styles$6: {
|
|
|
16255
16276
|
};
|
|
16256
16277
|
appearance: {
|
|
16257
16278
|
success: {
|
|
16258
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16259
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16260
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16279
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16280
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16281
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16261
16282
|
};
|
|
16262
16283
|
error: {
|
|
16263
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16264
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16265
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16284
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16285
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16286
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16266
16287
|
};
|
|
16267
16288
|
};
|
|
16268
16289
|
size: {
|
|
16269
16290
|
large: {
|
|
16270
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16291
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16271
16292
|
};
|
|
16272
16293
|
medium: {
|
|
16273
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16294
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16274
16295
|
};
|
|
16275
16296
|
small: {
|
|
16276
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16297
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16277
16298
|
};
|
|
16278
16299
|
};
|
|
16279
16300
|
}>;
|
|
@@ -16285,6 +16306,7 @@ declare const styles$5: {
|
|
|
16285
16306
|
label: RuntimeFn<{
|
|
16286
16307
|
/**
|
|
16287
16308
|
* Specifies whether the label is hidden or not
|
|
16309
|
+
* @default false
|
|
16288
16310
|
*/
|
|
16289
16311
|
hidden: {
|
|
16290
16312
|
true: {
|
|
@@ -16307,20 +16329,22 @@ declare const styles$4: {
|
|
|
16307
16329
|
link: RuntimeFn<{
|
|
16308
16330
|
/**
|
|
16309
16331
|
* Determines the visual style of the link.
|
|
16332
|
+
* @default brand
|
|
16310
16333
|
*/
|
|
16311
16334
|
appearance: {
|
|
16312
16335
|
brand: {
|
|
16313
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16336
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16314
16337
|
};
|
|
16315
16338
|
neutral: {
|
|
16316
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16339
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16317
16340
|
};
|
|
16318
16341
|
inverted: {
|
|
16319
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16342
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16320
16343
|
};
|
|
16321
16344
|
};
|
|
16322
16345
|
/**
|
|
16323
16346
|
* Specifies the size of the link.
|
|
16347
|
+
* @default large
|
|
16324
16348
|
*/
|
|
16325
16349
|
size: {
|
|
16326
16350
|
large: {
|
|
@@ -16369,9 +16393,9 @@ declare const progressStyles: {
|
|
|
16369
16393
|
circleText: string;
|
|
16370
16394
|
};
|
|
16371
16395
|
declare const progressColorProperties: {
|
|
16372
|
-
info: `var(--${string})` | `var(--${string}, ${string})
|
|
16373
|
-
success: `var(--${string})` | `var(--${string}, ${string})
|
|
16374
|
-
brand: `var(--${string})` | `var(--${string}, ${string})
|
|
16396
|
+
info: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16397
|
+
success: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16398
|
+
brand: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16375
16399
|
};
|
|
16376
16400
|
|
|
16377
16401
|
type ProgressVariants = NonNullable<RecipeVariants<typeof progressStyles.circle>>;
|
|
@@ -16421,26 +16445,26 @@ declare const styles$3: {
|
|
|
16421
16445
|
*/
|
|
16422
16446
|
error: {
|
|
16423
16447
|
true: {
|
|
16424
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16425
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16448
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16449
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16426
16450
|
selectors: {
|
|
16427
16451
|
"&:has(input:disabled)": {
|
|
16428
16452
|
opacity: "50%";
|
|
16429
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16453
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16430
16454
|
};
|
|
16431
16455
|
"&:has(input:checked)": {
|
|
16432
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16433
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16456
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16457
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16434
16458
|
};
|
|
16435
16459
|
"&:has(input:checked):after": {
|
|
16436
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16460
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16437
16461
|
};
|
|
16438
16462
|
"&:hover:before": {
|
|
16439
16463
|
opacity: number;
|
|
16440
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16464
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16441
16465
|
};
|
|
16442
16466
|
"&:active:before": {
|
|
16443
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16467
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16444
16468
|
};
|
|
16445
16469
|
};
|
|
16446
16470
|
};
|
|
@@ -16459,27 +16483,27 @@ declare const selectStyles: {
|
|
|
16459
16483
|
*/
|
|
16460
16484
|
appearance: {
|
|
16461
16485
|
success: {
|
|
16462
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16486
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16463
16487
|
":hover": {
|
|
16464
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16488
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16465
16489
|
};
|
|
16466
16490
|
":focus": {
|
|
16467
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16491
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16468
16492
|
};
|
|
16469
16493
|
":active": {
|
|
16470
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16494
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16471
16495
|
};
|
|
16472
16496
|
};
|
|
16473
16497
|
error: {
|
|
16474
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16498
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16475
16499
|
":hover": {
|
|
16476
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16500
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16477
16501
|
};
|
|
16478
16502
|
":focus": {
|
|
16479
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16503
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16480
16504
|
};
|
|
16481
16505
|
":active": {
|
|
16482
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16506
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16483
16507
|
};
|
|
16484
16508
|
};
|
|
16485
16509
|
};
|
|
@@ -16495,7 +16519,7 @@ declare const selectStyles: {
|
|
|
16495
16519
|
};
|
|
16496
16520
|
small: {
|
|
16497
16521
|
height: "2rem";
|
|
16498
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16522
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16499
16523
|
};
|
|
16500
16524
|
};
|
|
16501
16525
|
}>;
|
|
@@ -16511,7 +16535,7 @@ declare const dropdownStyles: {
|
|
|
16511
16535
|
*/
|
|
16512
16536
|
padding: {
|
|
16513
16537
|
base: {
|
|
16514
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
16538
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16515
16539
|
};
|
|
16516
16540
|
none: {
|
|
16517
16541
|
padding: number;
|
|
@@ -16519,11 +16543,17 @@ declare const dropdownStyles: {
|
|
|
16519
16543
|
};
|
|
16520
16544
|
}>;
|
|
16521
16545
|
item: RuntimeFn<{
|
|
16546
|
+
/**
|
|
16547
|
+
* Indicates if the item is selected.
|
|
16548
|
+
* This affects the visual style, such as highlight or marking.
|
|
16549
|
+
*
|
|
16550
|
+
* @default false
|
|
16551
|
+
*/
|
|
16522
16552
|
selected: {
|
|
16523
16553
|
true: {
|
|
16524
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16554
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16525
16555
|
":hover": {
|
|
16526
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16556
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16527
16557
|
};
|
|
16528
16558
|
};
|
|
16529
16559
|
};
|
|
@@ -16547,6 +16577,7 @@ declare const statusStyles: {
|
|
|
16547
16577
|
/**
|
|
16548
16578
|
* Specifies whether the status should take up the full width of its container.
|
|
16549
16579
|
* This variant is useful when you want to make a status span the entire width of its parent container.
|
|
16580
|
+
* @default false
|
|
16550
16581
|
*
|
|
16551
16582
|
*/
|
|
16552
16583
|
full: {
|
|
@@ -16556,51 +16587,51 @@ declare const statusStyles: {
|
|
|
16556
16587
|
};
|
|
16557
16588
|
/**
|
|
16558
16589
|
* Determines the visual style of the status, influencing its color scheme.
|
|
16590
|
+
* @default success
|
|
16559
16591
|
*/
|
|
16560
16592
|
appearance: {
|
|
16561
16593
|
success: {
|
|
16562
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16563
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16594
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16595
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16564
16596
|
};
|
|
16565
16597
|
warning: {
|
|
16566
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16567
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16598
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16599
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16568
16600
|
};
|
|
16569
16601
|
danger: {
|
|
16570
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16571
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16602
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16603
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16572
16604
|
};
|
|
16573
16605
|
inverted: {
|
|
16574
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16575
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16606
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16607
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16576
16608
|
};
|
|
16577
16609
|
neutral: {
|
|
16578
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16579
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16610
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16611
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16580
16612
|
};
|
|
16581
16613
|
info: {
|
|
16582
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16583
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16614
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16615
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16584
16616
|
};
|
|
16585
16617
|
};
|
|
16586
16618
|
/**
|
|
16587
16619
|
* Specifies the size of the badge, controlling its dimensions.
|
|
16620
|
+
* @default normal
|
|
16588
16621
|
*/
|
|
16589
16622
|
size: {
|
|
16590
16623
|
normal: {
|
|
16591
16624
|
height: "1.75rem";
|
|
16592
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16625
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16593
16626
|
};
|
|
16594
16627
|
small: {
|
|
16595
16628
|
height: "1.5rem";
|
|
16596
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16629
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16597
16630
|
};
|
|
16598
16631
|
};
|
|
16599
|
-
/**
|
|
16600
|
-
* Specifies whether the status is in subdued mode
|
|
16601
|
-
*/
|
|
16602
16632
|
/**
|
|
16603
16633
|
* Specifies the variant of the status
|
|
16634
|
+
* @default solid
|
|
16604
16635
|
*/
|
|
16605
16636
|
variant: {
|
|
16606
16637
|
solid: {};
|
|
@@ -16634,28 +16665,28 @@ declare const bannerStyles: {
|
|
|
16634
16665
|
*/
|
|
16635
16666
|
appearance: {
|
|
16636
16667
|
brand: {
|
|
16637
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16638
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16668
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16669
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16639
16670
|
};
|
|
16640
16671
|
info: {
|
|
16641
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16642
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16672
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16673
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16643
16674
|
};
|
|
16644
16675
|
neutral: {
|
|
16645
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16646
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16676
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16677
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16647
16678
|
};
|
|
16648
16679
|
inverted: {
|
|
16649
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16650
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16680
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16681
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16651
16682
|
};
|
|
16652
16683
|
warning: {
|
|
16653
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16654
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16684
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16685
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16655
16686
|
};
|
|
16656
16687
|
error: {
|
|
16657
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16658
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16688
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16689
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16659
16690
|
};
|
|
16660
16691
|
};
|
|
16661
16692
|
/**
|
|
@@ -16664,13 +16695,13 @@ declare const bannerStyles: {
|
|
|
16664
16695
|
*/
|
|
16665
16696
|
floating: {
|
|
16666
16697
|
true: {
|
|
16667
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
16698
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16668
16699
|
};
|
|
16669
16700
|
};
|
|
16670
16701
|
}>;
|
|
16671
16702
|
};
|
|
16672
16703
|
|
|
16673
|
-
type BannerVariants = RecipeVariants<typeof bannerStyles.banner
|
|
16704
|
+
type BannerVariants = NonNullable<RecipeVariants<typeof bannerStyles.banner>>;
|
|
16674
16705
|
|
|
16675
16706
|
declare const textareaStyles: {
|
|
16676
16707
|
textarea: RuntimeFn<{
|
|
@@ -16679,27 +16710,27 @@ declare const textareaStyles: {
|
|
|
16679
16710
|
*/
|
|
16680
16711
|
appearance: {
|
|
16681
16712
|
success: {
|
|
16682
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16713
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16683
16714
|
":hover": {
|
|
16684
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16715
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16685
16716
|
};
|
|
16686
16717
|
":focus": {
|
|
16687
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16718
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16688
16719
|
};
|
|
16689
16720
|
":disabled": {
|
|
16690
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16721
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16691
16722
|
};
|
|
16692
16723
|
};
|
|
16693
16724
|
error: {
|
|
16694
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16725
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16695
16726
|
":hover": {
|
|
16696
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16727
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16697
16728
|
};
|
|
16698
16729
|
":focus": {
|
|
16699
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16730
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16700
16731
|
};
|
|
16701
16732
|
":disabled": {
|
|
16702
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16733
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16703
16734
|
};
|
|
16704
16735
|
};
|
|
16705
16736
|
};
|
|
@@ -16715,28 +16746,28 @@ declare const styles$2: {
|
|
|
16715
16746
|
*/
|
|
16716
16747
|
appearance: {
|
|
16717
16748
|
info: {
|
|
16718
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16719
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16749
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16750
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16720
16751
|
};
|
|
16721
16752
|
success: {
|
|
16722
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16723
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16753
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16754
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16724
16755
|
};
|
|
16725
16756
|
warning: {
|
|
16726
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16727
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16757
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16758
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16728
16759
|
};
|
|
16729
16760
|
error: {
|
|
16730
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16731
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16761
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16762
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16732
16763
|
};
|
|
16733
16764
|
neutral: {
|
|
16734
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16735
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16765
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16766
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16736
16767
|
};
|
|
16737
16768
|
invert: {
|
|
16738
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16739
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16769
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16770
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16740
16771
|
};
|
|
16741
16772
|
};
|
|
16742
16773
|
/**
|
|
@@ -16744,15 +16775,15 @@ declare const styles$2: {
|
|
|
16744
16775
|
*/
|
|
16745
16776
|
size: {
|
|
16746
16777
|
small: {
|
|
16747
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
16748
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
16778
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
16779
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16749
16780
|
};
|
|
16750
16781
|
medium: {
|
|
16751
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
16782
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
16752
16783
|
};
|
|
16753
16784
|
large: {
|
|
16754
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
16755
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
16785
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
16786
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16756
16787
|
};
|
|
16757
16788
|
};
|
|
16758
16789
|
/**
|
|
@@ -16761,13 +16792,13 @@ declare const styles$2: {
|
|
|
16761
16792
|
variant: {
|
|
16762
16793
|
solid: {};
|
|
16763
16794
|
tonal: {
|
|
16764
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16795
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16765
16796
|
};
|
|
16766
16797
|
ghost: {
|
|
16767
16798
|
borderLeft: "solid";
|
|
16768
16799
|
borderWidth: "4px";
|
|
16769
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16770
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16800
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16801
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16771
16802
|
};
|
|
16772
16803
|
};
|
|
16773
16804
|
}>;
|
|
@@ -16853,6 +16884,7 @@ declare const styles$1: {
|
|
|
16853
16884
|
toggle: RuntimeFn<{
|
|
16854
16885
|
/**
|
|
16855
16886
|
* Specifies the size of the toggle, controlling its dimensions.
|
|
16887
|
+
* @default large
|
|
16856
16888
|
*/
|
|
16857
16889
|
size: {
|
|
16858
16890
|
large: {
|
|
@@ -16882,15 +16914,16 @@ declare const styles$1: {
|
|
|
16882
16914
|
};
|
|
16883
16915
|
/**
|
|
16884
16916
|
* Specifies whether the radiobutton is in error state
|
|
16917
|
+
* @default false
|
|
16885
16918
|
*/
|
|
16886
16919
|
error: {
|
|
16887
16920
|
true: {
|
|
16888
16921
|
":before": {
|
|
16889
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16922
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16890
16923
|
};
|
|
16891
16924
|
selectors: {
|
|
16892
16925
|
"&:has(input:checked):before": {
|
|
16893
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16926
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16894
16927
|
};
|
|
16895
16928
|
};
|
|
16896
16929
|
};
|
|
@@ -16913,11 +16946,11 @@ declare const styles$1: {
|
|
|
16913
16946
|
};
|
|
16914
16947
|
error: {
|
|
16915
16948
|
true: {
|
|
16916
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16917
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16949
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16950
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16918
16951
|
"&[aria-disabled='true']": {
|
|
16919
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16920
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16952
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16953
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16921
16954
|
};
|
|
16922
16955
|
};
|
|
16923
16956
|
};
|
|
@@ -16962,23 +16995,25 @@ declare const styles: {
|
|
|
16962
16995
|
tooltip: RuntimeFn<{
|
|
16963
16996
|
/**
|
|
16964
16997
|
* Specifies whether the color scheme should be inverted
|
|
16998
|
+
* @default false
|
|
16965
16999
|
*/
|
|
16966
17000
|
inverted: {
|
|
16967
17001
|
true: {
|
|
16968
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16969
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17002
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17003
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16970
17004
|
};
|
|
16971
17005
|
false: {
|
|
16972
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16973
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17006
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17007
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16974
17008
|
};
|
|
16975
17009
|
};
|
|
16976
17010
|
/**
|
|
16977
17011
|
* Specifies the padding for the tooltip
|
|
17012
|
+
* @default base
|
|
16978
17013
|
*/
|
|
16979
17014
|
padding: {
|
|
16980
17015
|
base: {
|
|
16981
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17016
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16982
17017
|
};
|
|
16983
17018
|
none: {
|
|
16984
17019
|
padding: number;
|
|
@@ -16988,7 +17023,7 @@ declare const styles: {
|
|
|
16988
17023
|
header: RuntimeFn<{
|
|
16989
17024
|
padding: {
|
|
16990
17025
|
base: {
|
|
16991
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17026
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16992
17027
|
};
|
|
16993
17028
|
none: {
|
|
16994
17029
|
padding: number;
|
|
@@ -17004,29 +17039,29 @@ declare const accordionStyles: {
|
|
|
17004
17039
|
item: RuntimeFn<{
|
|
17005
17040
|
selected: {
|
|
17006
17041
|
true: {
|
|
17007
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17008
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17042
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17043
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17009
17044
|
":hover": {
|
|
17010
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17045
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17011
17046
|
};
|
|
17012
17047
|
":active": {
|
|
17013
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17048
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17014
17049
|
};
|
|
17015
17050
|
":disabled": {
|
|
17016
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17051
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17017
17052
|
backgroundColor: "transparent";
|
|
17018
17053
|
};
|
|
17019
17054
|
};
|
|
17020
17055
|
};
|
|
17021
17056
|
size: {
|
|
17022
17057
|
large: {
|
|
17023
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17058
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17024
17059
|
};
|
|
17025
17060
|
medium: {
|
|
17026
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17061
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17027
17062
|
};
|
|
17028
17063
|
small: {
|
|
17029
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17064
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17030
17065
|
};
|
|
17031
17066
|
};
|
|
17032
17067
|
}>;
|
|
@@ -17037,7 +17072,7 @@ declare const accordionStyles: {
|
|
|
17037
17072
|
*/
|
|
17038
17073
|
padding: {
|
|
17039
17074
|
base: {
|
|
17040
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17075
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17041
17076
|
};
|
|
17042
17077
|
none: {
|
|
17043
17078
|
padding: number;
|
|
@@ -17057,7 +17092,7 @@ declare const breadcrumbStyles: {
|
|
|
17057
17092
|
*/
|
|
17058
17093
|
active: {
|
|
17059
17094
|
true: {
|
|
17060
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17095
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17061
17096
|
};
|
|
17062
17097
|
};
|
|
17063
17098
|
}>;
|
|
@@ -17074,7 +17109,7 @@ declare const cardStyles: {
|
|
|
17074
17109
|
*/
|
|
17075
17110
|
padding: {
|
|
17076
17111
|
base: {
|
|
17077
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17112
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17078
17113
|
};
|
|
17079
17114
|
none: {
|
|
17080
17115
|
padding: number;
|
|
@@ -17084,9 +17119,9 @@ declare const cardStyles: {
|
|
|
17084
17119
|
};
|
|
17085
17120
|
declare const cardBackgroundColorProperties: {
|
|
17086
17121
|
transparent: string;
|
|
17087
|
-
background: `var(--${string})` | `var(--${string}, ${string})
|
|
17088
|
-
primary: `var(--${string})` | `var(--${string}, ${string})
|
|
17089
|
-
secondary: `var(--${string})` | `var(--${string}, ${string})
|
|
17122
|
+
background: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17123
|
+
primary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17124
|
+
secondary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17090
17125
|
};
|
|
17091
17126
|
|
|
17092
17127
|
type CardVariants = NonNullable<RecipeVariants<typeof cardStyles.card>>;
|
|
@@ -17108,7 +17143,7 @@ declare const modalStyles: {
|
|
|
17108
17143
|
*/
|
|
17109
17144
|
padding: {
|
|
17110
17145
|
base: {
|
|
17111
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17146
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17112
17147
|
};
|
|
17113
17148
|
none: {
|
|
17114
17149
|
padding: number;
|
|
@@ -17131,7 +17166,7 @@ declare const paginationStyles: {
|
|
|
17131
17166
|
container: RuntimeFn<{
|
|
17132
17167
|
size: {
|
|
17133
17168
|
dot: {
|
|
17134
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
17169
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17135
17170
|
};
|
|
17136
17171
|
small: {};
|
|
17137
17172
|
large: {};
|
|
@@ -17140,34 +17175,34 @@ declare const paginationStyles: {
|
|
|
17140
17175
|
item: RuntimeFn<{
|
|
17141
17176
|
selected: {
|
|
17142
17177
|
true: {
|
|
17143
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17144
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17178
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17179
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17145
17180
|
":hover": {
|
|
17146
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17147
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17181
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17182
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17148
17183
|
};
|
|
17149
17184
|
};
|
|
17150
17185
|
};
|
|
17151
17186
|
/**
|
|
17152
17187
|
* Specifies the size of the Pagination component.
|
|
17153
|
-
* @default
|
|
17188
|
+
* @default large
|
|
17154
17189
|
*/
|
|
17155
17190
|
size: {
|
|
17156
17191
|
dot: {
|
|
17157
17192
|
width: "0.75rem";
|
|
17158
17193
|
height: "0.75rem";
|
|
17159
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
17160
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17194
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17195
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17161
17196
|
};
|
|
17162
17197
|
small: {
|
|
17163
17198
|
minWidth: "2.5rem";
|
|
17164
17199
|
height: "2.5rem";
|
|
17165
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
17200
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17166
17201
|
};
|
|
17167
17202
|
large: {
|
|
17168
17203
|
minWidth: "2.75rem";
|
|
17169
17204
|
height: "2.75rem";
|
|
17170
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
17205
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17171
17206
|
};
|
|
17172
17207
|
};
|
|
17173
17208
|
}>;
|
|
@@ -17192,7 +17227,6 @@ declare const sidebarStyles: {
|
|
|
17192
17227
|
};
|
|
17193
17228
|
/**
|
|
17194
17229
|
* Determines if the sidebar is shown or not.
|
|
17195
|
-
* @default true
|
|
17196
17230
|
*/
|
|
17197
17231
|
open: {
|
|
17198
17232
|
true: {
|
|
@@ -17205,8 +17239,8 @@ declare const sidebarStyles: {
|
|
|
17205
17239
|
};
|
|
17206
17240
|
declare const sidebarPaddingProperties: {
|
|
17207
17241
|
none: string;
|
|
17208
|
-
small: `var(--${string})` | `var(--${string}, ${string})
|
|
17209
|
-
medium: `var(--${string})` | `var(--${string}, ${string})
|
|
17242
|
+
small: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17243
|
+
medium: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17210
17244
|
};
|
|
17211
17245
|
|
|
17212
17246
|
type SidebarVariants = RecipeVariants<typeof sidebarStyles.sidebar>;
|
|
@@ -17227,7 +17261,7 @@ declare const sideNavigationStyles: {
|
|
|
17227
17261
|
sideNavigation: RuntimeFn<{
|
|
17228
17262
|
active: {
|
|
17229
17263
|
true: {
|
|
17230
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17264
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17231
17265
|
":after": {
|
|
17232
17266
|
content: "";
|
|
17233
17267
|
position: "absolute";
|
|
@@ -17235,16 +17269,16 @@ declare const sideNavigationStyles: {
|
|
|
17235
17269
|
right: number;
|
|
17236
17270
|
top: number;
|
|
17237
17271
|
bottom: number;
|
|
17238
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17272
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17239
17273
|
};
|
|
17240
17274
|
":hover": {
|
|
17241
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17275
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17242
17276
|
};
|
|
17243
17277
|
":active": {
|
|
17244
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17278
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17245
17279
|
};
|
|
17246
17280
|
":disabled": {
|
|
17247
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17281
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17248
17282
|
cursor: "not-allowed";
|
|
17249
17283
|
};
|
|
17250
17284
|
};
|
|
@@ -17256,32 +17290,32 @@ declare const sideNavigationStyles: {
|
|
|
17256
17290
|
*/
|
|
17257
17291
|
level: {
|
|
17258
17292
|
0: {
|
|
17259
|
-
paddingLeft: `var(--${string})` | `var(--${string}, ${string})
|
|
17293
|
+
paddingLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17260
17294
|
};
|
|
17261
17295
|
1: {
|
|
17262
|
-
paddingLeft: `var(--${string})` | `var(--${string}, ${string})
|
|
17296
|
+
paddingLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17263
17297
|
};
|
|
17264
17298
|
2: {
|
|
17265
|
-
paddingLeft: `var(--${string})` | `var(--${string}, ${string})
|
|
17299
|
+
paddingLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17266
17300
|
};
|
|
17267
17301
|
};
|
|
17268
17302
|
}>;
|
|
17269
17303
|
name: RuntimeFn<{
|
|
17270
17304
|
active: {
|
|
17271
17305
|
true: {
|
|
17272
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17306
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17273
17307
|
};
|
|
17274
17308
|
};
|
|
17275
17309
|
disabled: {
|
|
17276
17310
|
true: {
|
|
17277
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17311
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17278
17312
|
};
|
|
17279
17313
|
};
|
|
17280
17314
|
}>;
|
|
17281
17315
|
description: RuntimeFn<{
|
|
17282
17316
|
disabled: {
|
|
17283
17317
|
true: {
|
|
17284
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17318
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17285
17319
|
};
|
|
17286
17320
|
};
|
|
17287
17321
|
}>;
|
|
@@ -17290,7 +17324,7 @@ declare const sideNavigationStyles: {
|
|
|
17290
17324
|
true: {
|
|
17291
17325
|
overflow: "visible";
|
|
17292
17326
|
maxHeight: "unset";
|
|
17293
|
-
marginTop: `var(--${string})` | `var(--${string}, ${string})
|
|
17327
|
+
marginTop: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17294
17328
|
};
|
|
17295
17329
|
};
|
|
17296
17330
|
}>;
|
|
@@ -17312,7 +17346,6 @@ declare const stepperStyles: {
|
|
|
17312
17346
|
vertical: {
|
|
17313
17347
|
flexDirection: "column";
|
|
17314
17348
|
height: "100%";
|
|
17315
|
-
alignItems: "flex-start";
|
|
17316
17349
|
};
|
|
17317
17350
|
};
|
|
17318
17351
|
}>;
|
|
@@ -17344,20 +17377,42 @@ declare const stepperStyles: {
|
|
|
17344
17377
|
circle: RuntimeFn<{
|
|
17345
17378
|
/**
|
|
17346
17379
|
* Indicates whether the step is currently active. An active step is typically highlighted to show that it is the current step.
|
|
17380
|
+
* @default false
|
|
17347
17381
|
*/
|
|
17348
17382
|
active: {
|
|
17349
17383
|
true: {
|
|
17350
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17351
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17384
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17385
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17352
17386
|
};
|
|
17353
17387
|
};
|
|
17354
17388
|
/**
|
|
17355
17389
|
* Indicates whether the step has been completed. A completed step is usually marked with a checkmark or other indicator.
|
|
17390
|
+
* @default false
|
|
17356
17391
|
*/
|
|
17357
17392
|
done: {
|
|
17358
17393
|
true: {
|
|
17359
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17360
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17394
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17395
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17396
|
+
};
|
|
17397
|
+
};
|
|
17398
|
+
}>;
|
|
17399
|
+
separator: RuntimeFn<{
|
|
17400
|
+
direction: {
|
|
17401
|
+
/**
|
|
17402
|
+
* Specifies the direction of the stepper. This prop accepts one of the following values: vertical or horizontal.
|
|
17403
|
+
* @default horizontal
|
|
17404
|
+
*/
|
|
17405
|
+
horizontal: {
|
|
17406
|
+
height: "1px";
|
|
17407
|
+
marginLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17408
|
+
marginRight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17409
|
+
marginTop: "20px";
|
|
17410
|
+
};
|
|
17411
|
+
vertical: {
|
|
17412
|
+
width: "1px";
|
|
17413
|
+
marginTop: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17414
|
+
marginBottom: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17415
|
+
marginLeft: "18px";
|
|
17361
17416
|
};
|
|
17362
17417
|
};
|
|
17363
17418
|
}>;
|
|
@@ -17376,7 +17431,7 @@ declare const tabsStyles: {
|
|
|
17376
17431
|
borderRadius: number;
|
|
17377
17432
|
borderColor: "transparent";
|
|
17378
17433
|
backgroundColor: "transparent";
|
|
17379
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17434
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17380
17435
|
};
|
|
17381
17436
|
};
|
|
17382
17437
|
/**
|
|
@@ -17406,6 +17461,20 @@ declare const tabsStyles: {
|
|
|
17406
17461
|
};
|
|
17407
17462
|
}>;
|
|
17408
17463
|
button: RuntimeFn<{
|
|
17464
|
+
/**
|
|
17465
|
+
* Indicates whether the button is currently selected. This is used to style the button accordingly.
|
|
17466
|
+
*/
|
|
17467
|
+
selected: {
|
|
17468
|
+
true: {
|
|
17469
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17470
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17471
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17472
|
+
":disabled": {
|
|
17473
|
+
backgroundColor: "transparent";
|
|
17474
|
+
borderColor: "transparent";
|
|
17475
|
+
};
|
|
17476
|
+
};
|
|
17477
|
+
};
|
|
17409
17478
|
/**
|
|
17410
17479
|
* Determines whether the tabs should have an underline style.
|
|
17411
17480
|
*/
|
|
@@ -17417,27 +17486,13 @@ declare const tabsStyles: {
|
|
|
17417
17486
|
borderBottomColor: "transparent";
|
|
17418
17487
|
":hover": {
|
|
17419
17488
|
boxShadow: "none";
|
|
17420
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17489
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17421
17490
|
};
|
|
17422
17491
|
":disabled": {
|
|
17423
17492
|
borderBottomColor: "transparent";
|
|
17424
17493
|
};
|
|
17425
17494
|
};
|
|
17426
17495
|
};
|
|
17427
|
-
/**
|
|
17428
|
-
* Indicates whether the button is currently selected. This is used to style the button accordingly.
|
|
17429
|
-
*/
|
|
17430
|
-
selected: {
|
|
17431
|
-
true: {
|
|
17432
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
17433
|
-
color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
17434
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
|
|
17435
|
-
":disabled": {
|
|
17436
|
-
backgroundColor: "transparent";
|
|
17437
|
-
borderColor: "transparent";
|
|
17438
|
-
};
|
|
17439
|
-
};
|
|
17440
|
-
};
|
|
17441
17496
|
}>;
|
|
17442
17497
|
};
|
|
17443
17498
|
|
|
@@ -17457,6 +17512,7 @@ type AvatarProps = AvatarTypings & AvatarVariants;
|
|
|
17457
17512
|
interface DividerProps extends DividerSprinkle {
|
|
17458
17513
|
/**
|
|
17459
17514
|
* The direction of the Divider.
|
|
17515
|
+
* @default horizontal
|
|
17460
17516
|
*/
|
|
17461
17517
|
direction?: "vertical" | "horizontal";
|
|
17462
17518
|
}
|
|
@@ -17658,6 +17714,16 @@ interface CheckboxTyping {
|
|
|
17658
17714
|
* The id of the checkbox.
|
|
17659
17715
|
*/
|
|
17660
17716
|
id: string;
|
|
17717
|
+
/**
|
|
17718
|
+
* Whether the checkbox is checked.
|
|
17719
|
+
* @default false
|
|
17720
|
+
*/
|
|
17721
|
+
checked?: boolean;
|
|
17722
|
+
/**
|
|
17723
|
+
* Whether the checkbox is readonly.
|
|
17724
|
+
* @default false
|
|
17725
|
+
*/
|
|
17726
|
+
readonly?: boolean;
|
|
17661
17727
|
}
|
|
17662
17728
|
type CheckboxProps = CheckboxTyping & CheckboxVariants;
|
|
17663
17729
|
|
|
@@ -17678,6 +17744,7 @@ type Color = {
|
|
|
17678
17744
|
a: number | undefined;
|
|
17679
17745
|
source: string;
|
|
17680
17746
|
};
|
|
17747
|
+
rgba: string;
|
|
17681
17748
|
hex: string;
|
|
17682
17749
|
hsl: {
|
|
17683
17750
|
h: number;
|
|
@@ -17902,7 +17969,8 @@ interface SelectTyping {
|
|
|
17902
17969
|
*/
|
|
17903
17970
|
onChange?: (selectedOptions: SelectOptionProps | SelectOptionProps[]) => void;
|
|
17904
17971
|
/**
|
|
17905
|
-
*
|
|
17972
|
+
* Enables multiple selection mode.
|
|
17973
|
+
* @default false
|
|
17906
17974
|
*/
|
|
17907
17975
|
multiple?: boolean;
|
|
17908
17976
|
/**
|
|
@@ -17914,6 +17982,15 @@ interface SelectTyping {
|
|
|
17914
17982
|
* If true, the Select component is shown.
|
|
17915
17983
|
*/
|
|
17916
17984
|
open?: boolean;
|
|
17985
|
+
/**
|
|
17986
|
+
* Placeholder text displayed when no option is selected.
|
|
17987
|
+
*/
|
|
17988
|
+
placeholder?: string;
|
|
17989
|
+
/**
|
|
17990
|
+
* Disables the select component, disallowing user interaction.
|
|
17991
|
+
* @default false
|
|
17992
|
+
*/
|
|
17993
|
+
disabled?: boolean;
|
|
17917
17994
|
/**
|
|
17918
17995
|
* Determines whether the select box should enable flipping the options' dropdown when there is not enough space to display it in its default direction.
|
|
17919
17996
|
* This can help ensure the dropdown is always visible on the screen.
|
|
@@ -17925,6 +18002,12 @@ interface SelectTyping {
|
|
|
17925
18002
|
* This can be useful for rendering the dropdown in a different part of the DOM, such as a modal or overlay.
|
|
17926
18003
|
*/
|
|
17927
18004
|
portalId?: string;
|
|
18005
|
+
/**
|
|
18006
|
+
* Maximum number of items to display before showing a "+X" chip with the remaining count.
|
|
18007
|
+
* When set, only the specified number of selected items will be shown, followed by a chip indicating how many more items are selected.
|
|
18008
|
+
* @default undefined (shows all selected items)
|
|
18009
|
+
*/
|
|
18010
|
+
itemsAfterTruncate?: number;
|
|
17928
18011
|
}
|
|
17929
18012
|
type SelectProps = SelectTyping & SelectVariants & SelectSprinkle;
|
|
17930
18013
|
|
|
@@ -18080,7 +18163,7 @@ interface BreadcrumbProps {
|
|
|
18080
18163
|
* This is useful for managing the display of long breadcrumb lists.
|
|
18081
18164
|
* @default 10
|
|
18082
18165
|
*/
|
|
18083
|
-
|
|
18166
|
+
itemsAfterTruncate?: number;
|
|
18084
18167
|
}
|
|
18085
18168
|
|
|
18086
18169
|
interface BreadcrumbItemTyping {
|