@rarui/typings 2.0.3-rc.3 → 2.2.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 +12 -0
- package/dist/index.d.ts +585 -526
- package/package.json +4 -4
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> {
|
|
@@ -15561,43 +15561,47 @@ declare const chipStyles: {
|
|
|
15561
15561
|
chip: RuntimeFn<{
|
|
15562
15562
|
/**
|
|
15563
15563
|
* Specifies whether the chip will be displayed in the pill shape
|
|
15564
|
+
* @default false
|
|
15564
15565
|
*/
|
|
15565
15566
|
pill: {
|
|
15566
15567
|
true: {
|
|
15567
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
15568
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15568
15569
|
};
|
|
15569
15570
|
};
|
|
15570
15571
|
/**
|
|
15571
15572
|
* Specifies whether the chip is selected
|
|
15573
|
+
* @default false
|
|
15572
15574
|
*/
|
|
15573
15575
|
selected: {
|
|
15574
15576
|
true: {
|
|
15575
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15576
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15577
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15577
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15578
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15579
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15578
15580
|
":hover": {
|
|
15579
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15581
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15580
15582
|
};
|
|
15581
15583
|
};
|
|
15582
15584
|
};
|
|
15583
15585
|
/**
|
|
15584
15586
|
* Specifies the size of the chip
|
|
15587
|
+
* @default medium
|
|
15585
15588
|
*/
|
|
15586
15589
|
size: {
|
|
15587
15590
|
medium: {
|
|
15588
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15589
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15591
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15592
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15590
15593
|
height: "2rem";
|
|
15591
15594
|
};
|
|
15592
15595
|
small: {
|
|
15593
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15594
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15596
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15597
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15595
15598
|
height: "1.5rem";
|
|
15596
15599
|
};
|
|
15597
15600
|
};
|
|
15598
15601
|
/**
|
|
15599
15602
|
* Specifies whether to handle text overflow within the chip.
|
|
15600
15603
|
* When true, overflowing text is typically truncated with an ellipsis.
|
|
15604
|
+
* @default false
|
|
15601
15605
|
*/
|
|
15602
15606
|
textOverflow: {
|
|
15603
15607
|
true: {
|
|
@@ -15652,14 +15656,17 @@ interface DividerSprinkle {
|
|
|
15652
15656
|
size?: string | Conditions<string>;
|
|
15653
15657
|
/**
|
|
15654
15658
|
* The **`type`** shorthand CSS property sets the line style for all four sides of an element's.
|
|
15659
|
+
* @default solid
|
|
15655
15660
|
*/
|
|
15656
15661
|
type?: AddDollar<DividerBorderStyle> | Conditions<AddDollar<DividerBorderStyle>>;
|
|
15657
15662
|
/**
|
|
15658
15663
|
* The **`thickness`** shorthand CSS property sets the width of an element's.
|
|
15664
|
+
* @default $1
|
|
15659
15665
|
*/
|
|
15660
15666
|
thickness?: AddDollar<keyof typeof dividerBorderWidthProperties> | Conditions<AddDollar<keyof typeof dividerBorderWidthProperties>>;
|
|
15661
15667
|
/**
|
|
15662
15668
|
* The **`color`** CSS property sets an element's color.
|
|
15669
|
+
* @default $divider
|
|
15663
15670
|
*/
|
|
15664
15671
|
color?: AddDollar<keyof typeof borderColorProperties> | Conditions<AddDollar<keyof typeof borderColorProperties>>;
|
|
15665
15672
|
}
|
|
@@ -15673,20 +15680,20 @@ interface IconSprinkle extends IconDynamicProperties {
|
|
|
15673
15680
|
}
|
|
15674
15681
|
|
|
15675
15682
|
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})
|
|
15683
|
+
xxs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15684
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15685
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15686
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15687
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15688
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15682
15689
|
};
|
|
15683
15690
|
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})
|
|
15691
|
+
xxs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15692
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15693
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15694
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15695
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15696
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15690
15697
|
};
|
|
15691
15698
|
|
|
15692
15699
|
type TextDynamicProperties = Pick<StandardLonghandProperties, "textAlign" | "wordBreak" | "textTransform" | "textOverflow" | "width" | "whiteSpace"> & Pick<StandardShorthandProperties, "textDecoration" | "overflow">;
|
|
@@ -15719,20 +15726,20 @@ interface SkeletonSprinkle extends SkeletonDynamicProperties {
|
|
|
15719
15726
|
}
|
|
15720
15727
|
|
|
15721
15728
|
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})
|
|
15729
|
+
hero: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15730
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15731
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15732
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15733
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15734
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15728
15735
|
};
|
|
15729
15736
|
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})
|
|
15737
|
+
hero: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15738
|
+
xs: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15739
|
+
s: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15740
|
+
m: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15741
|
+
l: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15742
|
+
xl: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15736
15743
|
};
|
|
15737
15744
|
|
|
15738
15745
|
type TitleDynamicProperties = Pick<StandardLonghandProperties, "textAlign" | "textTransform"> & Pick<StandardShorthandProperties, "textDecoration">;
|
|
@@ -15767,24 +15774,24 @@ declare const avatarStyles: {
|
|
|
15767
15774
|
small: {
|
|
15768
15775
|
width: "20px";
|
|
15769
15776
|
height: "20px";
|
|
15770
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15777
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15771
15778
|
};
|
|
15772
15779
|
medium: {
|
|
15773
15780
|
width: "30px";
|
|
15774
15781
|
height: "30px";
|
|
15775
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15782
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15776
15783
|
};
|
|
15777
15784
|
large: {
|
|
15778
15785
|
width: "40px";
|
|
15779
15786
|
height: "40px";
|
|
15780
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15781
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
15787
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15788
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15782
15789
|
};
|
|
15783
15790
|
xLarge: {
|
|
15784
15791
|
width: "60px";
|
|
15785
15792
|
height: "60px";
|
|
15786
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15787
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
15793
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15794
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15788
15795
|
};
|
|
15789
15796
|
};
|
|
15790
15797
|
}>;
|
|
@@ -15807,7 +15814,7 @@ declare const avatarStyles: {
|
|
|
15807
15814
|
}>;
|
|
15808
15815
|
};
|
|
15809
15816
|
|
|
15810
|
-
type AvatarVariants = RecipeVariants<typeof avatarStyles.avatar
|
|
15817
|
+
type AvatarVariants = NonNullable<RecipeVariants<typeof avatarStyles.avatar>>;
|
|
15811
15818
|
|
|
15812
15819
|
declare const badgeStyles: {
|
|
15813
15820
|
badge: RuntimeFn<{
|
|
@@ -15817,63 +15824,63 @@ declare const badgeStyles: {
|
|
|
15817
15824
|
*/
|
|
15818
15825
|
appearance: {
|
|
15819
15826
|
brand: {
|
|
15820
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15821
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15822
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15827
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15828
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15829
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15823
15830
|
};
|
|
15824
15831
|
danger: {
|
|
15825
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15826
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15827
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15832
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15833
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15834
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15828
15835
|
};
|
|
15829
15836
|
success: {
|
|
15830
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15831
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15832
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15837
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15838
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15839
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15833
15840
|
};
|
|
15834
15841
|
warning: {
|
|
15835
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15836
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15837
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15842
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15843
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15844
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15838
15845
|
};
|
|
15839
15846
|
info: {
|
|
15840
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15841
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15842
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15847
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15848
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15849
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15843
15850
|
};
|
|
15844
15851
|
neutral: {
|
|
15845
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15846
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15847
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15852
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15853
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15854
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15848
15855
|
};
|
|
15849
15856
|
inverted: {
|
|
15850
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15851
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15852
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15857
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15858
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15859
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15853
15860
|
};
|
|
15854
15861
|
};
|
|
15855
15862
|
/**
|
|
15856
15863
|
* Specifies the size of the badge, controlling its dimensions.
|
|
15857
|
-
* @
|
|
15864
|
+
* @default medium
|
|
15858
15865
|
*/
|
|
15859
15866
|
size: {
|
|
15860
15867
|
large: {
|
|
15861
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15868
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15862
15869
|
height: "3rem";
|
|
15863
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15864
|
-
fontWeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15870
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15871
|
+
fontWeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15865
15872
|
};
|
|
15866
15873
|
medium: {
|
|
15867
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15874
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15868
15875
|
height: "2em";
|
|
15869
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15870
|
-
fontWeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15876
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15877
|
+
fontWeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15871
15878
|
};
|
|
15872
15879
|
small: {
|
|
15873
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15880
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15874
15881
|
height: "1.5rem";
|
|
15875
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15876
|
-
fontWeight: `var(--${string})` | `var(--${string}, ${string})
|
|
15882
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15883
|
+
fontWeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15877
15884
|
};
|
|
15878
15885
|
dot: {
|
|
15879
15886
|
height: "0.5rem";
|
|
@@ -15882,14 +15889,14 @@ declare const badgeStyles: {
|
|
|
15882
15889
|
};
|
|
15883
15890
|
/**
|
|
15884
15891
|
* Defines the visual variant of the badge, affecting its background style.
|
|
15885
|
-
* @
|
|
15892
|
+
* @default solid
|
|
15886
15893
|
*/
|
|
15887
15894
|
variant: {
|
|
15888
15895
|
solid: {};
|
|
15889
15896
|
outlined: {
|
|
15890
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
15897
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15891
15898
|
borderStyle: "solid";
|
|
15892
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15899
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15893
15900
|
};
|
|
15894
15901
|
};
|
|
15895
15902
|
}>;
|
|
@@ -15912,75 +15919,77 @@ declare const buttonStyles: {
|
|
|
15912
15919
|
/**
|
|
15913
15920
|
* Defines the appearance variants for the button component.
|
|
15914
15921
|
* Each appearance variant corresponds to a specific background color, border color, and text color.
|
|
15922
|
+
* @default brand
|
|
15915
15923
|
*/
|
|
15916
15924
|
appearance: {
|
|
15917
15925
|
brand: {
|
|
15918
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15919
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15920
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15926
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15927
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15928
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15921
15929
|
};
|
|
15922
15930
|
danger: {
|
|
15923
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15924
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15925
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15931
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15932
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15933
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15926
15934
|
};
|
|
15927
15935
|
success: {
|
|
15928
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15929
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15930
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15936
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15937
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15938
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15931
15939
|
};
|
|
15932
15940
|
warning: {
|
|
15933
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15934
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15935
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15941
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15942
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15943
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15936
15944
|
};
|
|
15937
15945
|
neutral: {
|
|
15938
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15939
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15940
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15946
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15947
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15948
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15941
15949
|
};
|
|
15942
15950
|
inverted: {
|
|
15943
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15944
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15945
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
15951
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15952
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15953
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15946
15954
|
};
|
|
15947
15955
|
};
|
|
15948
15956
|
/**
|
|
15949
15957
|
* Defines the size of the button component.
|
|
15950
|
-
* @default
|
|
15958
|
+
* @default large
|
|
15951
15959
|
*/
|
|
15952
15960
|
size: {
|
|
15953
15961
|
large: {
|
|
15954
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
15955
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15962
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15963
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15956
15964
|
height: "3rem";
|
|
15957
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15965
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15958
15966
|
};
|
|
15959
15967
|
medium: {
|
|
15960
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
15961
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15968
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15969
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15962
15970
|
height: "2.5rem";
|
|
15963
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15971
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15964
15972
|
};
|
|
15965
15973
|
small: {
|
|
15966
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
15967
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
15974
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15975
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
15968
15976
|
height: "2rem";
|
|
15969
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
15977
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15970
15978
|
};
|
|
15971
15979
|
};
|
|
15972
15980
|
/**
|
|
15973
15981
|
* Defines the visual variant of the badge, affecting its background style, border and text.
|
|
15982
|
+
* @default solid
|
|
15974
15983
|
*/
|
|
15975
15984
|
variant: {
|
|
15976
15985
|
solid: {
|
|
15977
15986
|
selectors: {
|
|
15978
15987
|
"&:hover:after": {
|
|
15979
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15988
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15980
15989
|
};
|
|
15981
15990
|
"&:active:after": {
|
|
15982
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15983
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
15991
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15992
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
15984
15993
|
};
|
|
15985
15994
|
};
|
|
15986
15995
|
};
|
|
@@ -16001,6 +16010,7 @@ declare const buttonStyles: {
|
|
|
16001
16010
|
|
|
16002
16011
|
type ButtonVariants = NonNullable<RecipeVariants<typeof buttonStyles.button>>;
|
|
16003
16012
|
|
|
16013
|
+
declare const overlayBackgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16004
16014
|
declare const checkboxStyles: {
|
|
16005
16015
|
checkbox: RuntimeFn<{
|
|
16006
16016
|
/**
|
|
@@ -16008,9 +16018,9 @@ declare const checkboxStyles: {
|
|
|
16008
16018
|
*/
|
|
16009
16019
|
error: {
|
|
16010
16020
|
true: {
|
|
16011
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16021
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16012
16022
|
":checked": {
|
|
16013
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16023
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16014
16024
|
};
|
|
16015
16025
|
};
|
|
16016
16026
|
};
|
|
@@ -16052,7 +16062,7 @@ declare const checkboxStyles: {
|
|
|
16052
16062
|
error: {
|
|
16053
16063
|
true: {
|
|
16054
16064
|
vars: {
|
|
16055
|
-
[
|
|
16065
|
+
[overlayBackgroundColor]: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16056
16066
|
};
|
|
16057
16067
|
};
|
|
16058
16068
|
};
|
|
@@ -16067,37 +16077,38 @@ declare const iconButtonStyles: {
|
|
|
16067
16077
|
iconButton: RuntimeFn<{
|
|
16068
16078
|
/**
|
|
16069
16079
|
* Determines the visual style of the icon button, influencing its color scheme and appearance.
|
|
16080
|
+
* @default brand
|
|
16070
16081
|
*/
|
|
16071
16082
|
appearance: {
|
|
16072
16083
|
brand: {
|
|
16073
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16074
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16075
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16084
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16085
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16086
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16076
16087
|
};
|
|
16077
16088
|
danger: {
|
|
16078
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16079
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16080
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16089
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16090
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16091
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16081
16092
|
};
|
|
16082
16093
|
success: {
|
|
16083
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16084
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16085
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16094
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16095
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16096
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16086
16097
|
};
|
|
16087
16098
|
warning: {
|
|
16088
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16089
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16090
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16099
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16100
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16101
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16091
16102
|
};
|
|
16092
16103
|
neutral: {
|
|
16093
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16094
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16095
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16104
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16105
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16106
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16096
16107
|
};
|
|
16097
16108
|
inverted: {
|
|
16098
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16099
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16100
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16109
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16110
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16111
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16101
16112
|
};
|
|
16102
16113
|
};
|
|
16103
16114
|
/**
|
|
@@ -16108,31 +16119,32 @@ declare const iconButtonStyles: {
|
|
|
16108
16119
|
large: {
|
|
16109
16120
|
height: "3rem";
|
|
16110
16121
|
width: "3rem";
|
|
16111
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16122
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16112
16123
|
};
|
|
16113
16124
|
medium: {
|
|
16114
16125
|
height: "2.5rem";
|
|
16115
16126
|
width: "2.5rem";
|
|
16116
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16127
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16117
16128
|
};
|
|
16118
16129
|
small: {
|
|
16119
16130
|
height: "2rem";
|
|
16120
16131
|
width: "2rem";
|
|
16121
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16132
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16122
16133
|
};
|
|
16123
16134
|
};
|
|
16124
16135
|
variant: {
|
|
16125
16136
|
/**
|
|
16126
16137
|
* Defines the visual variant of the icon button, affecting its background style, border and text.
|
|
16138
|
+
* @default solid
|
|
16127
16139
|
*/
|
|
16128
16140
|
solid: {
|
|
16129
16141
|
selectors: {
|
|
16130
16142
|
"&:hover:after": {
|
|
16131
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16143
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16132
16144
|
};
|
|
16133
16145
|
"&:active:after": {
|
|
16134
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16135
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16146
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16147
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16136
16148
|
};
|
|
16137
16149
|
};
|
|
16138
16150
|
};
|
|
@@ -16147,18 +16159,25 @@ declare const iconButtonStyles: {
|
|
|
16147
16159
|
borderColor: "transparent";
|
|
16148
16160
|
};
|
|
16149
16161
|
};
|
|
16162
|
+
/**
|
|
16163
|
+
* Defines if the button should have rounded edges.
|
|
16164
|
+
*
|
|
16165
|
+
* - `true`: The button will be rendered with completely rounded edges, useful for circular -shaped icons.
|
|
16166
|
+
* - `false` (default): The button will have standard edges or defined by the component style.
|
|
16167
|
+
* @default false
|
|
16168
|
+
*/
|
|
16150
16169
|
rounded: {
|
|
16151
16170
|
true: {
|
|
16152
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
16171
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16153
16172
|
":after": {
|
|
16154
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
16173
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16155
16174
|
};
|
|
16156
16175
|
};
|
|
16157
16176
|
};
|
|
16158
16177
|
}>;
|
|
16159
16178
|
};
|
|
16160
16179
|
|
|
16161
|
-
type IconButtonVariants = RecipeVariants<typeof iconButtonStyles.iconButton
|
|
16180
|
+
type IconButtonVariants = NonNullable<RecipeVariants<typeof iconButtonStyles.iconButton>>;
|
|
16162
16181
|
|
|
16163
16182
|
declare const styles$6: {
|
|
16164
16183
|
container: RuntimeFn<{
|
|
@@ -16167,30 +16186,31 @@ declare const styles$6: {
|
|
|
16167
16186
|
*/
|
|
16168
16187
|
appearance: {
|
|
16169
16188
|
success: {
|
|
16170
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16189
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16171
16190
|
":hover": {
|
|
16172
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16191
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16173
16192
|
};
|
|
16174
16193
|
":focus": {
|
|
16175
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16194
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16176
16195
|
};
|
|
16177
16196
|
};
|
|
16178
16197
|
error: {
|
|
16179
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16198
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16180
16199
|
":hover": {
|
|
16181
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16200
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16182
16201
|
};
|
|
16183
16202
|
":focus": {
|
|
16184
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16203
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16185
16204
|
};
|
|
16186
16205
|
};
|
|
16187
16206
|
};
|
|
16188
16207
|
/**
|
|
16189
16208
|
* Determines if the input have borders or not.
|
|
16209
|
+
* @default true
|
|
16190
16210
|
*/
|
|
16191
16211
|
border: {
|
|
16192
16212
|
true: {
|
|
16193
|
-
borderWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
16213
|
+
borderWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16194
16214
|
};
|
|
16195
16215
|
false: {
|
|
16196
16216
|
borderWidth: number;
|
|
@@ -16211,42 +16231,44 @@ declare const styles$6: {
|
|
|
16211
16231
|
input: RuntimeFn<{
|
|
16212
16232
|
/**
|
|
16213
16233
|
* Places a divider between the input and the leading components
|
|
16234
|
+
* @default true
|
|
16214
16235
|
*/
|
|
16215
16236
|
divider: {
|
|
16216
16237
|
false: {};
|
|
16217
16238
|
};
|
|
16218
16239
|
/**
|
|
16219
16240
|
* Specifies the size of the input, controlling its dimensions.
|
|
16241
|
+
* @default medium
|
|
16220
16242
|
*/
|
|
16221
16243
|
size: {
|
|
16222
16244
|
large: {
|
|
16223
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16224
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
16245
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16246
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16225
16247
|
};
|
|
16226
16248
|
medium: {
|
|
16227
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16228
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
16249
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16250
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16229
16251
|
};
|
|
16230
16252
|
small: {
|
|
16231
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16232
|
-
lineHeight: `var(--${string})` | `var(--${string}, ${string})
|
|
16233
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16253
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16254
|
+
lineHeight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16255
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16234
16256
|
};
|
|
16235
16257
|
};
|
|
16236
16258
|
}>;
|
|
16237
16259
|
leading: RuntimeFn<{
|
|
16238
16260
|
position: {
|
|
16239
16261
|
start: {
|
|
16240
|
-
borderRightWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
16262
|
+
borderRightWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16241
16263
|
};
|
|
16242
16264
|
end: {
|
|
16243
|
-
borderLeftWidth: `var(--${string})` | `var(--${string}, ${string})
|
|
16265
|
+
borderLeftWidth: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16244
16266
|
};
|
|
16245
16267
|
};
|
|
16246
16268
|
divider: {
|
|
16247
16269
|
true: {
|
|
16248
16270
|
borderStyle: "solid";
|
|
16249
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16271
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16250
16272
|
};
|
|
16251
16273
|
false: {
|
|
16252
16274
|
borderRightWidth: number;
|
|
@@ -16255,25 +16277,25 @@ declare const styles$6: {
|
|
|
16255
16277
|
};
|
|
16256
16278
|
appearance: {
|
|
16257
16279
|
success: {
|
|
16258
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16259
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16260
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16280
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16281
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16282
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16261
16283
|
};
|
|
16262
16284
|
error: {
|
|
16263
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16264
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16265
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16285
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16286
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16287
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16266
16288
|
};
|
|
16267
16289
|
};
|
|
16268
16290
|
size: {
|
|
16269
16291
|
large: {
|
|
16270
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16292
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16271
16293
|
};
|
|
16272
16294
|
medium: {
|
|
16273
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16295
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16274
16296
|
};
|
|
16275
16297
|
small: {
|
|
16276
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16298
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16277
16299
|
};
|
|
16278
16300
|
};
|
|
16279
16301
|
}>;
|
|
@@ -16285,6 +16307,7 @@ declare const styles$5: {
|
|
|
16285
16307
|
label: RuntimeFn<{
|
|
16286
16308
|
/**
|
|
16287
16309
|
* Specifies whether the label is hidden or not
|
|
16310
|
+
* @default false
|
|
16288
16311
|
*/
|
|
16289
16312
|
hidden: {
|
|
16290
16313
|
true: {
|
|
@@ -16307,20 +16330,22 @@ declare const styles$4: {
|
|
|
16307
16330
|
link: RuntimeFn<{
|
|
16308
16331
|
/**
|
|
16309
16332
|
* Determines the visual style of the link.
|
|
16333
|
+
* @default brand
|
|
16310
16334
|
*/
|
|
16311
16335
|
appearance: {
|
|
16312
16336
|
brand: {
|
|
16313
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16337
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16314
16338
|
};
|
|
16315
16339
|
neutral: {
|
|
16316
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16340
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16317
16341
|
};
|
|
16318
16342
|
inverted: {
|
|
16319
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16343
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16320
16344
|
};
|
|
16321
16345
|
};
|
|
16322
16346
|
/**
|
|
16323
16347
|
* Specifies the size of the link.
|
|
16348
|
+
* @default large
|
|
16324
16349
|
*/
|
|
16325
16350
|
size: {
|
|
16326
16351
|
large: {
|
|
@@ -16369,9 +16394,9 @@ declare const progressStyles: {
|
|
|
16369
16394
|
circleText: string;
|
|
16370
16395
|
};
|
|
16371
16396
|
declare const progressColorProperties: {
|
|
16372
|
-
info: `var(--${string})` | `var(--${string}, ${string})
|
|
16373
|
-
success: `var(--${string})` | `var(--${string}, ${string})
|
|
16374
|
-
brand: `var(--${string})` | `var(--${string}, ${string})
|
|
16397
|
+
info: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16398
|
+
success: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16399
|
+
brand: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16375
16400
|
};
|
|
16376
16401
|
|
|
16377
16402
|
type ProgressVariants = NonNullable<RecipeVariants<typeof progressStyles.circle>>;
|
|
@@ -16421,26 +16446,26 @@ declare const styles$3: {
|
|
|
16421
16446
|
*/
|
|
16422
16447
|
error: {
|
|
16423
16448
|
true: {
|
|
16424
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16425
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16449
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16450
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16426
16451
|
selectors: {
|
|
16427
16452
|
"&:has(input:disabled)": {
|
|
16428
16453
|
opacity: "50%";
|
|
16429
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16454
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16430
16455
|
};
|
|
16431
16456
|
"&:has(input:checked)": {
|
|
16432
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16433
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16457
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16458
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16434
16459
|
};
|
|
16435
16460
|
"&:has(input:checked):after": {
|
|
16436
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16461
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16437
16462
|
};
|
|
16438
16463
|
"&:hover:before": {
|
|
16439
16464
|
opacity: number;
|
|
16440
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16465
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16441
16466
|
};
|
|
16442
16467
|
"&:active:before": {
|
|
16443
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16468
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16444
16469
|
};
|
|
16445
16470
|
};
|
|
16446
16471
|
};
|
|
@@ -16459,27 +16484,27 @@ declare const selectStyles: {
|
|
|
16459
16484
|
*/
|
|
16460
16485
|
appearance: {
|
|
16461
16486
|
success: {
|
|
16462
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16487
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16463
16488
|
":hover": {
|
|
16464
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16489
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16465
16490
|
};
|
|
16466
16491
|
":focus": {
|
|
16467
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16492
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16468
16493
|
};
|
|
16469
16494
|
":active": {
|
|
16470
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16495
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16471
16496
|
};
|
|
16472
16497
|
};
|
|
16473
16498
|
error: {
|
|
16474
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16499
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16475
16500
|
":hover": {
|
|
16476
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16501
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16477
16502
|
};
|
|
16478
16503
|
":focus": {
|
|
16479
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16504
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16480
16505
|
};
|
|
16481
16506
|
":active": {
|
|
16482
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16507
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16483
16508
|
};
|
|
16484
16509
|
};
|
|
16485
16510
|
};
|
|
@@ -16495,7 +16520,7 @@ declare const selectStyles: {
|
|
|
16495
16520
|
};
|
|
16496
16521
|
small: {
|
|
16497
16522
|
height: "2rem";
|
|
16498
|
-
padding: `0 var(--${string})` | `0 var(--${string}, ${string})
|
|
16523
|
+
padding: `0 var(--${string})` | `0 var(--${string}, ${string})`;
|
|
16499
16524
|
};
|
|
16500
16525
|
};
|
|
16501
16526
|
}>;
|
|
@@ -16511,7 +16536,7 @@ declare const dropdownStyles: {
|
|
|
16511
16536
|
*/
|
|
16512
16537
|
padding: {
|
|
16513
16538
|
base: {
|
|
16514
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
16539
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16515
16540
|
};
|
|
16516
16541
|
none: {
|
|
16517
16542
|
padding: number;
|
|
@@ -16519,11 +16544,17 @@ declare const dropdownStyles: {
|
|
|
16519
16544
|
};
|
|
16520
16545
|
}>;
|
|
16521
16546
|
item: RuntimeFn<{
|
|
16547
|
+
/**
|
|
16548
|
+
* Indicates if the item is selected.
|
|
16549
|
+
* This affects the visual style, such as highlight or marking.
|
|
16550
|
+
*
|
|
16551
|
+
* @default false
|
|
16552
|
+
*/
|
|
16522
16553
|
selected: {
|
|
16523
16554
|
true: {
|
|
16524
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16555
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16525
16556
|
":hover": {
|
|
16526
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16557
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16527
16558
|
};
|
|
16528
16559
|
};
|
|
16529
16560
|
};
|
|
@@ -16547,6 +16578,7 @@ declare const statusStyles: {
|
|
|
16547
16578
|
/**
|
|
16548
16579
|
* Specifies whether the status should take up the full width of its container.
|
|
16549
16580
|
* This variant is useful when you want to make a status span the entire width of its parent container.
|
|
16581
|
+
* @default false
|
|
16550
16582
|
*
|
|
16551
16583
|
*/
|
|
16552
16584
|
full: {
|
|
@@ -16556,51 +16588,51 @@ declare const statusStyles: {
|
|
|
16556
16588
|
};
|
|
16557
16589
|
/**
|
|
16558
16590
|
* Determines the visual style of the status, influencing its color scheme.
|
|
16591
|
+
* @default success
|
|
16559
16592
|
*/
|
|
16560
16593
|
appearance: {
|
|
16561
16594
|
success: {
|
|
16562
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16563
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16595
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16596
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16564
16597
|
};
|
|
16565
16598
|
warning: {
|
|
16566
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16567
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16599
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16600
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16568
16601
|
};
|
|
16569
16602
|
danger: {
|
|
16570
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16571
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16603
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16604
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16572
16605
|
};
|
|
16573
16606
|
inverted: {
|
|
16574
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16575
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16607
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16608
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16576
16609
|
};
|
|
16577
16610
|
neutral: {
|
|
16578
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16579
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16611
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16612
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16580
16613
|
};
|
|
16581
16614
|
info: {
|
|
16582
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16583
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16615
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16616
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16584
16617
|
};
|
|
16585
16618
|
};
|
|
16586
16619
|
/**
|
|
16587
16620
|
* Specifies the size of the badge, controlling its dimensions.
|
|
16621
|
+
* @default normal
|
|
16588
16622
|
*/
|
|
16589
16623
|
size: {
|
|
16590
16624
|
normal: {
|
|
16591
16625
|
height: "1.75rem";
|
|
16592
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16626
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16593
16627
|
};
|
|
16594
16628
|
small: {
|
|
16595
16629
|
height: "1.5rem";
|
|
16596
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
16630
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16597
16631
|
};
|
|
16598
16632
|
};
|
|
16599
|
-
/**
|
|
16600
|
-
* Specifies whether the status is in subdued mode
|
|
16601
|
-
*/
|
|
16602
16633
|
/**
|
|
16603
16634
|
* Specifies the variant of the status
|
|
16635
|
+
* @default solid
|
|
16604
16636
|
*/
|
|
16605
16637
|
variant: {
|
|
16606
16638
|
solid: {};
|
|
@@ -16634,28 +16666,28 @@ declare const bannerStyles: {
|
|
|
16634
16666
|
*/
|
|
16635
16667
|
appearance: {
|
|
16636
16668
|
brand: {
|
|
16637
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16638
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16669
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16670
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16639
16671
|
};
|
|
16640
16672
|
info: {
|
|
16641
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16642
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16673
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16674
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16643
16675
|
};
|
|
16644
16676
|
neutral: {
|
|
16645
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16646
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16677
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16678
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16647
16679
|
};
|
|
16648
16680
|
inverted: {
|
|
16649
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16650
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16681
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16682
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16651
16683
|
};
|
|
16652
16684
|
warning: {
|
|
16653
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16654
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16685
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16686
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16655
16687
|
};
|
|
16656
16688
|
error: {
|
|
16657
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16658
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16689
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16690
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16659
16691
|
};
|
|
16660
16692
|
};
|
|
16661
16693
|
/**
|
|
@@ -16664,13 +16696,13 @@ declare const bannerStyles: {
|
|
|
16664
16696
|
*/
|
|
16665
16697
|
floating: {
|
|
16666
16698
|
true: {
|
|
16667
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
16699
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16668
16700
|
};
|
|
16669
16701
|
};
|
|
16670
16702
|
}>;
|
|
16671
16703
|
};
|
|
16672
16704
|
|
|
16673
|
-
type BannerVariants = RecipeVariants<typeof bannerStyles.banner
|
|
16705
|
+
type BannerVariants = NonNullable<RecipeVariants<typeof bannerStyles.banner>>;
|
|
16674
16706
|
|
|
16675
16707
|
declare const textareaStyles: {
|
|
16676
16708
|
textarea: RuntimeFn<{
|
|
@@ -16679,27 +16711,27 @@ declare const textareaStyles: {
|
|
|
16679
16711
|
*/
|
|
16680
16712
|
appearance: {
|
|
16681
16713
|
success: {
|
|
16682
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16714
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16683
16715
|
":hover": {
|
|
16684
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16716
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16685
16717
|
};
|
|
16686
16718
|
":focus": {
|
|
16687
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16719
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16688
16720
|
};
|
|
16689
16721
|
":disabled": {
|
|
16690
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16722
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16691
16723
|
};
|
|
16692
16724
|
};
|
|
16693
16725
|
error: {
|
|
16694
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16726
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16695
16727
|
":hover": {
|
|
16696
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16728
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16697
16729
|
};
|
|
16698
16730
|
":focus": {
|
|
16699
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16731
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16700
16732
|
};
|
|
16701
16733
|
":disabled": {
|
|
16702
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16734
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16703
16735
|
};
|
|
16704
16736
|
};
|
|
16705
16737
|
};
|
|
@@ -16715,28 +16747,28 @@ declare const styles$2: {
|
|
|
16715
16747
|
*/
|
|
16716
16748
|
appearance: {
|
|
16717
16749
|
info: {
|
|
16718
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16719
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16750
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16751
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16720
16752
|
};
|
|
16721
16753
|
success: {
|
|
16722
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16723
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16754
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16755
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16724
16756
|
};
|
|
16725
16757
|
warning: {
|
|
16726
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16727
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16758
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16759
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16728
16760
|
};
|
|
16729
16761
|
error: {
|
|
16730
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16731
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16762
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16763
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16732
16764
|
};
|
|
16733
16765
|
neutral: {
|
|
16734
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16735
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16766
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16767
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16736
16768
|
};
|
|
16737
16769
|
invert: {
|
|
16738
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16739
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16770
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16771
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16740
16772
|
};
|
|
16741
16773
|
};
|
|
16742
16774
|
/**
|
|
@@ -16744,15 +16776,15 @@ declare const styles$2: {
|
|
|
16744
16776
|
*/
|
|
16745
16777
|
size: {
|
|
16746
16778
|
small: {
|
|
16747
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
16748
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
16779
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
16780
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16749
16781
|
};
|
|
16750
16782
|
medium: {
|
|
16751
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
16783
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
16752
16784
|
};
|
|
16753
16785
|
large: {
|
|
16754
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
16755
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
16786
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
16787
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16756
16788
|
};
|
|
16757
16789
|
};
|
|
16758
16790
|
/**
|
|
@@ -16761,13 +16793,13 @@ declare const styles$2: {
|
|
|
16761
16793
|
variant: {
|
|
16762
16794
|
solid: {};
|
|
16763
16795
|
tonal: {
|
|
16764
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16796
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16765
16797
|
};
|
|
16766
16798
|
ghost: {
|
|
16767
16799
|
borderLeft: "solid";
|
|
16768
16800
|
borderWidth: "4px";
|
|
16769
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16770
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
16801
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16802
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16771
16803
|
};
|
|
16772
16804
|
};
|
|
16773
16805
|
}>;
|
|
@@ -16853,6 +16885,7 @@ declare const styles$1: {
|
|
|
16853
16885
|
toggle: RuntimeFn<{
|
|
16854
16886
|
/**
|
|
16855
16887
|
* Specifies the size of the toggle, controlling its dimensions.
|
|
16888
|
+
* @default large
|
|
16856
16889
|
*/
|
|
16857
16890
|
size: {
|
|
16858
16891
|
large: {
|
|
@@ -16882,15 +16915,16 @@ declare const styles$1: {
|
|
|
16882
16915
|
};
|
|
16883
16916
|
/**
|
|
16884
16917
|
* Specifies whether the radiobutton is in error state
|
|
16918
|
+
* @default false
|
|
16885
16919
|
*/
|
|
16886
16920
|
error: {
|
|
16887
16921
|
true: {
|
|
16888
16922
|
":before": {
|
|
16889
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16923
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16890
16924
|
};
|
|
16891
16925
|
selectors: {
|
|
16892
16926
|
"&:has(input:checked):before": {
|
|
16893
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16927
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16894
16928
|
};
|
|
16895
16929
|
};
|
|
16896
16930
|
};
|
|
@@ -16913,11 +16947,11 @@ declare const styles$1: {
|
|
|
16913
16947
|
};
|
|
16914
16948
|
error: {
|
|
16915
16949
|
true: {
|
|
16916
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16917
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16950
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16951
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16918
16952
|
"&[aria-disabled='true']": {
|
|
16919
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16920
|
-
borderColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16953
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16954
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16921
16955
|
};
|
|
16922
16956
|
};
|
|
16923
16957
|
};
|
|
@@ -16962,23 +16996,25 @@ declare const styles: {
|
|
|
16962
16996
|
tooltip: RuntimeFn<{
|
|
16963
16997
|
/**
|
|
16964
16998
|
* Specifies whether the color scheme should be inverted
|
|
16999
|
+
* @default false
|
|
16965
17000
|
*/
|
|
16966
17001
|
inverted: {
|
|
16967
17002
|
true: {
|
|
16968
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16969
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17003
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17004
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16970
17005
|
};
|
|
16971
17006
|
false: {
|
|
16972
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
16973
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17007
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17008
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16974
17009
|
};
|
|
16975
17010
|
};
|
|
16976
17011
|
/**
|
|
16977
17012
|
* Specifies the padding for the tooltip
|
|
17013
|
+
* @default base
|
|
16978
17014
|
*/
|
|
16979
17015
|
padding: {
|
|
16980
17016
|
base: {
|
|
16981
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17017
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16982
17018
|
};
|
|
16983
17019
|
none: {
|
|
16984
17020
|
padding: number;
|
|
@@ -16988,7 +17024,7 @@ declare const styles: {
|
|
|
16988
17024
|
header: RuntimeFn<{
|
|
16989
17025
|
padding: {
|
|
16990
17026
|
base: {
|
|
16991
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17027
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
16992
17028
|
};
|
|
16993
17029
|
none: {
|
|
16994
17030
|
padding: number;
|
|
@@ -17004,29 +17040,29 @@ declare const accordionStyles: {
|
|
|
17004
17040
|
item: RuntimeFn<{
|
|
17005
17041
|
selected: {
|
|
17006
17042
|
true: {
|
|
17007
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17008
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17043
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17044
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17009
17045
|
":hover": {
|
|
17010
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17046
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17011
17047
|
};
|
|
17012
17048
|
":active": {
|
|
17013
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17049
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17014
17050
|
};
|
|
17015
17051
|
":disabled": {
|
|
17016
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17052
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17017
17053
|
backgroundColor: "transparent";
|
|
17018
17054
|
};
|
|
17019
17055
|
};
|
|
17020
17056
|
};
|
|
17021
17057
|
size: {
|
|
17022
17058
|
large: {
|
|
17023
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17059
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17024
17060
|
};
|
|
17025
17061
|
medium: {
|
|
17026
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17062
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17027
17063
|
};
|
|
17028
17064
|
small: {
|
|
17029
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17065
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17030
17066
|
};
|
|
17031
17067
|
};
|
|
17032
17068
|
}>;
|
|
@@ -17037,7 +17073,7 @@ declare const accordionStyles: {
|
|
|
17037
17073
|
*/
|
|
17038
17074
|
padding: {
|
|
17039
17075
|
base: {
|
|
17040
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17076
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17041
17077
|
};
|
|
17042
17078
|
none: {
|
|
17043
17079
|
padding: number;
|
|
@@ -17057,7 +17093,7 @@ declare const breadcrumbStyles: {
|
|
|
17057
17093
|
*/
|
|
17058
17094
|
active: {
|
|
17059
17095
|
true: {
|
|
17060
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17096
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17061
17097
|
};
|
|
17062
17098
|
};
|
|
17063
17099
|
}>;
|
|
@@ -17074,7 +17110,7 @@ declare const cardStyles: {
|
|
|
17074
17110
|
*/
|
|
17075
17111
|
padding: {
|
|
17076
17112
|
base: {
|
|
17077
|
-
padding: `var(--${string})` | `var(--${string}, ${string})
|
|
17113
|
+
padding: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17078
17114
|
};
|
|
17079
17115
|
none: {
|
|
17080
17116
|
padding: number;
|
|
@@ -17084,9 +17120,9 @@ declare const cardStyles: {
|
|
|
17084
17120
|
};
|
|
17085
17121
|
declare const cardBackgroundColorProperties: {
|
|
17086
17122
|
transparent: string;
|
|
17087
|
-
background: `var(--${string})` | `var(--${string}, ${string})
|
|
17088
|
-
primary: `var(--${string})` | `var(--${string}, ${string})
|
|
17089
|
-
secondary: `var(--${string})` | `var(--${string}, ${string})
|
|
17123
|
+
background: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17124
|
+
primary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17125
|
+
secondary: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17090
17126
|
};
|
|
17091
17127
|
|
|
17092
17128
|
type CardVariants = NonNullable<RecipeVariants<typeof cardStyles.card>>;
|
|
@@ -17108,7 +17144,7 @@ declare const modalStyles: {
|
|
|
17108
17144
|
*/
|
|
17109
17145
|
padding: {
|
|
17110
17146
|
base: {
|
|
17111
|
-
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}
|
|
17147
|
+
padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})`;
|
|
17112
17148
|
};
|
|
17113
17149
|
none: {
|
|
17114
17150
|
padding: number;
|
|
@@ -17131,7 +17167,7 @@ declare const paginationStyles: {
|
|
|
17131
17167
|
container: RuntimeFn<{
|
|
17132
17168
|
size: {
|
|
17133
17169
|
dot: {
|
|
17134
|
-
gap: `var(--${string})` | `var(--${string}, ${string})
|
|
17170
|
+
gap: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17135
17171
|
};
|
|
17136
17172
|
small: {};
|
|
17137
17173
|
large: {};
|
|
@@ -17140,34 +17176,34 @@ declare const paginationStyles: {
|
|
|
17140
17176
|
item: RuntimeFn<{
|
|
17141
17177
|
selected: {
|
|
17142
17178
|
true: {
|
|
17143
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17144
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17179
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17180
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17145
17181
|
":hover": {
|
|
17146
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17147
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17182
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17183
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17148
17184
|
};
|
|
17149
17185
|
};
|
|
17150
17186
|
};
|
|
17151
17187
|
/**
|
|
17152
17188
|
* Specifies the size of the Pagination component.
|
|
17153
|
-
* @default
|
|
17189
|
+
* @default large
|
|
17154
17190
|
*/
|
|
17155
17191
|
size: {
|
|
17156
17192
|
dot: {
|
|
17157
17193
|
width: "0.75rem";
|
|
17158
17194
|
height: "0.75rem";
|
|
17159
|
-
borderRadius: `var(--${string})` | `var(--${string}, ${string})
|
|
17160
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17195
|
+
borderRadius: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17196
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17161
17197
|
};
|
|
17162
17198
|
small: {
|
|
17163
17199
|
minWidth: "2.5rem";
|
|
17164
17200
|
height: "2.5rem";
|
|
17165
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
17201
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17166
17202
|
};
|
|
17167
17203
|
large: {
|
|
17168
17204
|
minWidth: "2.75rem";
|
|
17169
17205
|
height: "2.75rem";
|
|
17170
|
-
fontSize: `var(--${string})` | `var(--${string}, ${string})
|
|
17206
|
+
fontSize: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17171
17207
|
};
|
|
17172
17208
|
};
|
|
17173
17209
|
}>;
|
|
@@ -17205,8 +17241,8 @@ declare const sidebarStyles: {
|
|
|
17205
17241
|
};
|
|
17206
17242
|
declare const sidebarPaddingProperties: {
|
|
17207
17243
|
none: string;
|
|
17208
|
-
small: `var(--${string})` | `var(--${string}, ${string})
|
|
17209
|
-
medium: `var(--${string})` | `var(--${string}, ${string})
|
|
17244
|
+
small: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17245
|
+
medium: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17210
17246
|
};
|
|
17211
17247
|
|
|
17212
17248
|
type SidebarVariants = RecipeVariants<typeof sidebarStyles.sidebar>;
|
|
@@ -17227,7 +17263,7 @@ declare const sideNavigationStyles: {
|
|
|
17227
17263
|
sideNavigation: RuntimeFn<{
|
|
17228
17264
|
active: {
|
|
17229
17265
|
true: {
|
|
17230
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17266
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17231
17267
|
":after": {
|
|
17232
17268
|
content: "";
|
|
17233
17269
|
position: "absolute";
|
|
@@ -17235,16 +17271,16 @@ declare const sideNavigationStyles: {
|
|
|
17235
17271
|
right: number;
|
|
17236
17272
|
top: number;
|
|
17237
17273
|
bottom: number;
|
|
17238
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17274
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17239
17275
|
};
|
|
17240
17276
|
":hover": {
|
|
17241
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17277
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17242
17278
|
};
|
|
17243
17279
|
":active": {
|
|
17244
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17280
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17245
17281
|
};
|
|
17246
17282
|
":disabled": {
|
|
17247
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17283
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17248
17284
|
cursor: "not-allowed";
|
|
17249
17285
|
};
|
|
17250
17286
|
};
|
|
@@ -17256,32 +17292,32 @@ declare const sideNavigationStyles: {
|
|
|
17256
17292
|
*/
|
|
17257
17293
|
level: {
|
|
17258
17294
|
0: {
|
|
17259
|
-
paddingLeft: `var(--${string})` | `var(--${string}, ${string})
|
|
17295
|
+
paddingLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17260
17296
|
};
|
|
17261
17297
|
1: {
|
|
17262
|
-
paddingLeft: `var(--${string})` | `var(--${string}, ${string})
|
|
17298
|
+
paddingLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17263
17299
|
};
|
|
17264
17300
|
2: {
|
|
17265
|
-
paddingLeft: `var(--${string})` | `var(--${string}, ${string})
|
|
17301
|
+
paddingLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17266
17302
|
};
|
|
17267
17303
|
};
|
|
17268
17304
|
}>;
|
|
17269
17305
|
name: RuntimeFn<{
|
|
17270
17306
|
active: {
|
|
17271
17307
|
true: {
|
|
17272
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17308
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17273
17309
|
};
|
|
17274
17310
|
};
|
|
17275
17311
|
disabled: {
|
|
17276
17312
|
true: {
|
|
17277
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17313
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17278
17314
|
};
|
|
17279
17315
|
};
|
|
17280
17316
|
}>;
|
|
17281
17317
|
description: RuntimeFn<{
|
|
17282
17318
|
disabled: {
|
|
17283
17319
|
true: {
|
|
17284
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17320
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17285
17321
|
};
|
|
17286
17322
|
};
|
|
17287
17323
|
}>;
|
|
@@ -17290,7 +17326,7 @@ declare const sideNavigationStyles: {
|
|
|
17290
17326
|
true: {
|
|
17291
17327
|
overflow: "visible";
|
|
17292
17328
|
maxHeight: "unset";
|
|
17293
|
-
marginTop: `var(--${string})` | `var(--${string}, ${string})
|
|
17329
|
+
marginTop: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17294
17330
|
};
|
|
17295
17331
|
};
|
|
17296
17332
|
}>;
|
|
@@ -17312,7 +17348,6 @@ declare const stepperStyles: {
|
|
|
17312
17348
|
vertical: {
|
|
17313
17349
|
flexDirection: "column";
|
|
17314
17350
|
height: "100%";
|
|
17315
|
-
alignItems: "flex-start";
|
|
17316
17351
|
};
|
|
17317
17352
|
};
|
|
17318
17353
|
}>;
|
|
@@ -17344,20 +17379,42 @@ declare const stepperStyles: {
|
|
|
17344
17379
|
circle: RuntimeFn<{
|
|
17345
17380
|
/**
|
|
17346
17381
|
* Indicates whether the step is currently active. An active step is typically highlighted to show that it is the current step.
|
|
17382
|
+
* @default false
|
|
17347
17383
|
*/
|
|
17348
17384
|
active: {
|
|
17349
17385
|
true: {
|
|
17350
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17351
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17386
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17387
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17352
17388
|
};
|
|
17353
17389
|
};
|
|
17354
17390
|
/**
|
|
17355
17391
|
* Indicates whether the step has been completed. A completed step is usually marked with a checkmark or other indicator.
|
|
17392
|
+
* @default false
|
|
17356
17393
|
*/
|
|
17357
17394
|
done: {
|
|
17358
17395
|
true: {
|
|
17359
|
-
backgroundColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17360
|
-
color: `var(--${string})` | `var(--${string}, ${string})
|
|
17396
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17397
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17398
|
+
};
|
|
17399
|
+
};
|
|
17400
|
+
}>;
|
|
17401
|
+
separator: RuntimeFn<{
|
|
17402
|
+
direction: {
|
|
17403
|
+
/**
|
|
17404
|
+
* Specifies the direction of the stepper. This prop accepts one of the following values: vertical or horizontal.
|
|
17405
|
+
* @default horizontal
|
|
17406
|
+
*/
|
|
17407
|
+
horizontal: {
|
|
17408
|
+
height: "1px";
|
|
17409
|
+
marginLeft: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17410
|
+
marginRight: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17411
|
+
marginTop: "20px";
|
|
17412
|
+
};
|
|
17413
|
+
vertical: {
|
|
17414
|
+
width: "1px";
|
|
17415
|
+
marginTop: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17416
|
+
marginBottom: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17417
|
+
marginLeft: "18px";
|
|
17361
17418
|
};
|
|
17362
17419
|
};
|
|
17363
17420
|
}>;
|
|
@@ -17376,7 +17433,7 @@ declare const tabsStyles: {
|
|
|
17376
17433
|
borderRadius: number;
|
|
17377
17434
|
borderColor: "transparent";
|
|
17378
17435
|
backgroundColor: "transparent";
|
|
17379
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17436
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17380
17437
|
};
|
|
17381
17438
|
};
|
|
17382
17439
|
/**
|
|
@@ -17406,6 +17463,20 @@ declare const tabsStyles: {
|
|
|
17406
17463
|
};
|
|
17407
17464
|
}>;
|
|
17408
17465
|
button: RuntimeFn<{
|
|
17466
|
+
/**
|
|
17467
|
+
* Indicates whether the button is currently selected. This is used to style the button accordingly.
|
|
17468
|
+
*/
|
|
17469
|
+
selected: {
|
|
17470
|
+
true: {
|
|
17471
|
+
backgroundColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17472
|
+
color: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17473
|
+
borderColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17474
|
+
":disabled": {
|
|
17475
|
+
backgroundColor: "transparent";
|
|
17476
|
+
borderColor: "transparent";
|
|
17477
|
+
};
|
|
17478
|
+
};
|
|
17479
|
+
};
|
|
17409
17480
|
/**
|
|
17410
17481
|
* Determines whether the tabs should have an underline style.
|
|
17411
17482
|
*/
|
|
@@ -17417,27 +17488,13 @@ declare const tabsStyles: {
|
|
|
17417
17488
|
borderBottomColor: "transparent";
|
|
17418
17489
|
":hover": {
|
|
17419
17490
|
boxShadow: "none";
|
|
17420
|
-
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})
|
|
17491
|
+
borderBottomColor: `var(--${string})` | `var(--${string}, ${string})`;
|
|
17421
17492
|
};
|
|
17422
17493
|
":disabled": {
|
|
17423
17494
|
borderBottomColor: "transparent";
|
|
17424
17495
|
};
|
|
17425
17496
|
};
|
|
17426
17497
|
};
|
|
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
17498
|
}>;
|
|
17442
17499
|
};
|
|
17443
17500
|
|
|
@@ -17457,6 +17514,7 @@ type AvatarProps = AvatarTypings & AvatarVariants;
|
|
|
17457
17514
|
interface DividerProps extends DividerSprinkle {
|
|
17458
17515
|
/**
|
|
17459
17516
|
* The direction of the Divider.
|
|
17517
|
+
* @default horizontal
|
|
17460
17518
|
*/
|
|
17461
17519
|
direction?: "vertical" | "horizontal";
|
|
17462
17520
|
}
|
|
@@ -17678,6 +17736,7 @@ type Color = {
|
|
|
17678
17736
|
a: number | undefined;
|
|
17679
17737
|
source: string;
|
|
17680
17738
|
};
|
|
17739
|
+
rgba: string;
|
|
17681
17740
|
hex: string;
|
|
17682
17741
|
hsl: {
|
|
17683
17742
|
h: number;
|