@nimbus-ds/styles 9.46.0-rc.4 → 9.46.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/dist/index.d.ts CHANGED
@@ -74,11 +74,15 @@ export type TransitionTiming = "ease" | "ease-in" | "ease-out" | "ease-in-out" |
74
74
  export type WordBreak = "normal" | "break-all" | "keep-all" | "break-word";
75
75
  export type TextOverflow = "clip" | "ellipsis";
76
76
  export type WhiteSpace = "normal" | "nowrap" | "pre" | "pre-wrap" | "pre-line" | "break-spaces";
77
+ export type ScrollbarWidth = "auto" | "none" | "thin";
77
78
  declare const propertiesBox: {
78
79
  gap: {
79
80
  none: string;
80
81
  "0-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
81
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
82
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
83
+ * The display property sets whether an box is treated as a block or inline element and the layout used for its children,
84
+ * such as grid or flex.
85
+ */
82
86
  "1-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
83
87
  "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
84
88
  "2-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -102,7 +106,10 @@ declare const propertiesBox: {
102
106
  gridGap: {
103
107
  none: string;
104
108
  "0-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
105
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
109
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
110
+ * The display property sets whether an box is treated as a block or inline element and the layout used for its children,
111
+ * such as grid or flex.
112
+ */
106
113
  "1-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
107
114
  "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
108
115
  "2-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -134,9 +141,7 @@ declare const propertiesBox: {
134
141
  "primary-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
135
142
  "primary-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
136
143
  "primary-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
137
- "primary-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
138
- * The width property specifies the width of a box's content area.
139
- */
144
+ "primary-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
140
145
  "success-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
141
146
  "success-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
142
147
  "success-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -170,9 +175,7 @@ declare const propertiesBox: {
170
175
  "primary-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
171
176
  "primary-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
172
177
  "primary-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
173
- "primary-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
174
- * The width property specifies the width of a box's content area.
175
- */
178
+ "primary-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
176
179
  "success-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
177
180
  "success-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
178
181
  "success-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -210,10 +213,6 @@ declare const propertiesBox: {
210
213
  "danger-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
211
214
  "danger-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
212
215
  "neutral-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
213
- /**
214
- * The gridArea shorthand property specifies a grid item's size and location within a grid by contributing a line,
215
- * a span, or nothing (automatic) to its grid placement, thereby specifying the edges of its grid area.
216
- */
217
216
  "neutral-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
218
217
  "neutral-surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
219
218
  "neutral-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -235,9 +234,7 @@ declare const propertiesBox: {
235
234
  borderWidth: {
236
235
  "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
237
236
  "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
238
- "3": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
239
- * The gap property sets the gaps between rows and columns. It is a shorthand for rowGap and columnGap.
240
- */
237
+ "3": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
241
238
  "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
242
239
  "5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
243
240
  none: string;
@@ -248,7 +245,10 @@ declare const propertiesBox: {
248
245
  spacing: {
249
246
  none: string;
250
247
  "0-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
251
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
248
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
249
+ * The display property sets whether an box is treated as a block or inline element and the layout used for its children,
250
+ * such as grid or flex.
251
+ */
252
252
  "1-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
253
253
  "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
254
254
  "2-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -271,7 +271,10 @@ declare const propertiesBox: {
271
271
  };
272
272
  margin: {
273
273
  "0-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
274
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
274
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
275
+ * The display property sets whether an box is treated as a block or inline element and the layout used for its children,
276
+ * such as grid or flex.
277
+ */
275
278
  "1-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
276
279
  "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
277
280
  "2-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -335,7 +338,10 @@ declare const propertiesBox: {
335
338
  };
336
339
  fontSize: {
337
340
  "0-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
338
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
341
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
342
+ * The display property sets whether an box is treated as a block or inline element and the layout used for its children,
343
+ * such as grid or flex.
344
+ */
339
345
  "1-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
340
346
  "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
341
347
  "2-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -366,7 +372,10 @@ declare const propertiesBox: {
366
372
  };
367
373
  lineHeight: {
368
374
  "0-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
369
- "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
375
+ "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
376
+ * The display property sets whether an box is treated as a block or inline element and the layout used for its children,
377
+ * such as grid or flex.
378
+ */
370
379
  "1-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
371
380
  "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
372
381
  "2-5": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -395,6 +404,7 @@ declare const propertiesBox: {
395
404
  h5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
396
405
  h6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
397
406
  };
407
+ scrollbarWidth: ScrollbarWidth[];
398
408
  };
399
409
  export type BoxBorderColorProperties = keyof typeof propertiesBox.borderColor;
400
410
  export type BoxBorderRadiusProperties = keyof typeof propertiesBox.borderRadius;
@@ -795,6 +805,10 @@ export interface BoxSprinkle {
795
805
  * @default left
796
806
  */
797
807
  textAlign?: TextAlign | BoxConditions<TextAlign>;
808
+ /**
809
+ * The scrollbarWidth property specifies the width of the scrollbar.
810
+ */
811
+ scrollbarWidth?: ScrollbarWidth | BoxConditions<ScrollbarWidth>;
798
812
  }
799
813
  export declare const box: {
800
814
  asButton: string;
@@ -1545,6 +1559,24 @@ export declare const box: {
1545
1559
  staticScale: TextAlign[];
1546
1560
  name: "textAlign";
1547
1561
  };
1562
+ scrollbarWidth: {
1563
+ values: {
1564
+ none: {
1565
+ default: string;
1566
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "xxl" | "focus" | "active" | "disabled" | "hover" | "focusVisible" | "focusWithin", string>;
1567
+ };
1568
+ auto: {
1569
+ default: string;
1570
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "xxl" | "focus" | "active" | "disabled" | "hover" | "focusVisible" | "focusWithin", string>;
1571
+ };
1572
+ thin: {
1573
+ default: string;
1574
+ conditions: Record<"xs" | "md" | "lg" | "xl" | "xxl" | "focus" | "active" | "disabled" | "hover" | "focusVisible" | "focusWithin", string>;
1575
+ };
1576
+ };
1577
+ staticScale: ScrollbarWidth[];
1578
+ name: "scrollbarWidth";
1579
+ };
1548
1580
  };
1549
1581
  } & {
1550
1582
  config: {
@@ -2959,6 +2991,7 @@ export declare const box: {
2959
2991
  h5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2960
2992
  h6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2961
2993
  };
2994
+ scrollbarWidth: ScrollbarWidth[];
2962
2995
  };
2963
2996
  };
2964
2997
  export declare const button: {