@nimbus-ds/styles 8.0.0 → 8.0.1

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.
Files changed (7) hide show
  1. package/CHANGELOG.md +17 -3
  2. package/dist/index.css +1 -1
  3. package/dist/index.d.ts +111 -9
  4. package/dist/index.js +1 -1
  5. package/dist/styles.css +1 -1
  6. package/dist/themes/dark.js +1 -1
  7. package/package.json +2 -2
package/dist/index.d.ts CHANGED
@@ -2255,9 +2255,10 @@ export declare const iconButton: {
2255
2255
  };
2256
2256
  export declare const input: {
2257
2257
  classnames: {
2258
+ input: string;
2258
2259
  container: string;
2260
+ container__icon: string;
2259
2261
  container__icon_append: Record<"end" | "start", string>;
2260
- container__input_append: Record<"end" | "start", string>;
2261
2262
  container__button: string;
2262
2263
  appearance: Record<"success" | "warning" | "danger" | "neutral", string>;
2263
2264
  };
@@ -2273,13 +2274,116 @@ export declare const tag: {
2273
2274
  appearance: Record<"primary" | "success" | "warning" | "danger" | "neutral", string>;
2274
2275
  };
2275
2276
  };
2277
+ declare const propertiesText: {
2278
+ color: {
2279
+ currentColor: string;
2280
+ "primary-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2281
+ "primary-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2282
+ "primary-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2283
+ "primary-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`; /**
2284
+ * The color property is used to set the color of the text.
2285
+ * @default neutral-textLow
2286
+ */
2287
+ "success-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2288
+ "success-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2289
+ "success-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2290
+ "success-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2291
+ "warning-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2292
+ "warning-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2293
+ "warning-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2294
+ "warning-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2295
+ "danger-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2296
+ "danger-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2297
+ "danger-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2298
+ "danger-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2299
+ "neutral-background": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2300
+ "neutral-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2301
+ "neutral-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2302
+ "neutral-textDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2303
+ "neutral-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2304
+ "neutral-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2305
+ };
2306
+ textAlign: TextAlign[];
2307
+ lineHeight: {
2308
+ readonly caption: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2309
+ readonly base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2310
+ readonly highlight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2311
+ };
2312
+ fontWeight: {
2313
+ regular: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2314
+ medium: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2315
+ bold: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2316
+ };
2317
+ fontSize: {
2318
+ caption: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2319
+ base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2320
+ highlight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
2321
+ };
2322
+ };
2323
+ export type TextColorProperties = keyof typeof propertiesText.color;
2324
+ export type TextFontSizeProperties = keyof typeof propertiesText.fontSize;
2325
+ export type TextFontWeightProperties = keyof typeof propertiesText.fontWeight;
2326
+ export type TextLineHeightProperties = keyof typeof propertiesText.lineHeight;
2327
+ export type TextConditions<T> = Conditions<T>;
2328
+ export interface TextSprinkle {
2329
+ /**
2330
+ * The fontSize property sets the size of the text.
2331
+ * @default base
2332
+ */
2333
+ fontSize?: TextFontSizeProperties | TextConditions<TextFontSizeProperties>;
2334
+ /**
2335
+ * The fontWeight property sets how thick or thin characters in text should be displayed.
2336
+ * @default regular
2337
+ */
2338
+ fontWeight?: TextFontWeightProperties | TextConditions<TextFontWeightProperties>;
2339
+ /**
2340
+ * The lineHeight property specifies the line height of the text.
2341
+ * @default base
2342
+ */
2343
+ lineHeight?: TextLineHeightProperties | TextConditions<TextLineHeightProperties>;
2344
+ /**
2345
+ * The textAlign property specifies the horizontal alignment of text.
2346
+ * @default left
2347
+ */
2348
+ textAlign?: TextAlign | TextConditions<TextAlign>;
2349
+ /**
2350
+ * The color property is used to set the color of the text.
2351
+ * @default neutral-textLow
2352
+ */
2353
+ color?: TextColorProperties | TextConditions<TextColorProperties>;
2354
+ }
2276
2355
  export declare const text: {
2277
2356
  sprinkle: ((props: {
2278
- color?: "primary-surface" | "primary-interactive" | "primary-textLow" | "primary-textHigh" | "success-surface" | "success-interactive" | "success-textLow" | "success-textHigh" | "warning-surface" | "warning-interactive" | "warning-textLow" | "warning-textHigh" | "danger-surface" | "danger-interactive" | "danger-textLow" | "danger-textHigh" | "neutral-background" | "neutral-surface" | "neutral-interactive" | "neutral-textDisabled" | "neutral-textLow" | "neutral-textHigh" | "currentColor" | undefined;
2279
- textAlign?: TextAlign | undefined;
2280
- lineHeight?: "caption" | "base" | "highlight" | undefined;
2281
- fontWeight?: "regular" | "medium" | "bold" | undefined;
2282
- fontSize?: "caption" | "base" | "highlight" | undefined;
2357
+ color?: ("primary-surface" | "primary-interactive" | "primary-textLow" | "primary-textHigh" | "success-surface" | "success-interactive" | "success-textLow" | "success-textHigh" | "warning-surface" | "warning-interactive" | "warning-textLow" | "warning-textHigh" | "danger-surface" | "danger-interactive" | "danger-textLow" | "danger-textHigh" | "neutral-background" | "neutral-surface" | "neutral-interactive" | "neutral-textDisabled" | "neutral-textLow" | "neutral-textHigh" | "currentColor" | {
2358
+ xs?: "primary-surface" | "primary-interactive" | "primary-textLow" | "primary-textHigh" | "success-surface" | "success-interactive" | "success-textLow" | "success-textHigh" | "warning-surface" | "warning-interactive" | "warning-textLow" | "warning-textHigh" | "danger-surface" | "danger-interactive" | "danger-textLow" | "danger-textHigh" | "neutral-background" | "neutral-surface" | "neutral-interactive" | "neutral-textDisabled" | "neutral-textLow" | "neutral-textHigh" | "currentColor" | undefined;
2359
+ md?: "primary-surface" | "primary-interactive" | "primary-textLow" | "primary-textHigh" | "success-surface" | "success-interactive" | "success-textLow" | "success-textHigh" | "warning-surface" | "warning-interactive" | "warning-textLow" | "warning-textHigh" | "danger-surface" | "danger-interactive" | "danger-textLow" | "danger-textHigh" | "neutral-background" | "neutral-surface" | "neutral-interactive" | "neutral-textDisabled" | "neutral-textLow" | "neutral-textHigh" | "currentColor" | undefined;
2360
+ lg?: "primary-surface" | "primary-interactive" | "primary-textLow" | "primary-textHigh" | "success-surface" | "success-interactive" | "success-textLow" | "success-textHigh" | "warning-surface" | "warning-interactive" | "warning-textLow" | "warning-textHigh" | "danger-surface" | "danger-interactive" | "danger-textLow" | "danger-textHigh" | "neutral-background" | "neutral-surface" | "neutral-interactive" | "neutral-textDisabled" | "neutral-textLow" | "neutral-textHigh" | "currentColor" | undefined;
2361
+ xl?: "primary-surface" | "primary-interactive" | "primary-textLow" | "primary-textHigh" | "success-surface" | "success-interactive" | "success-textLow" | "success-textHigh" | "warning-surface" | "warning-interactive" | "warning-textLow" | "warning-textHigh" | "danger-surface" | "danger-interactive" | "danger-textLow" | "danger-textHigh" | "neutral-background" | "neutral-surface" | "neutral-interactive" | "neutral-textDisabled" | "neutral-textLow" | "neutral-textHigh" | "currentColor" | undefined;
2362
+ }) | undefined;
2363
+ textAlign?: (TextAlign | {
2364
+ xs?: TextAlign | undefined;
2365
+ md?: TextAlign | undefined;
2366
+ lg?: TextAlign | undefined;
2367
+ xl?: TextAlign | undefined;
2368
+ }) | undefined;
2369
+ lineHeight?: ("caption" | "base" | "highlight" | {
2370
+ xs?: "caption" | "base" | "highlight" | undefined;
2371
+ md?: "caption" | "base" | "highlight" | undefined;
2372
+ lg?: "caption" | "base" | "highlight" | undefined;
2373
+ xl?: "caption" | "base" | "highlight" | undefined;
2374
+ }) | undefined;
2375
+ fontWeight?: ("regular" | "medium" | "bold" | {
2376
+ xs?: "regular" | "medium" | "bold" | undefined;
2377
+ md?: "regular" | "medium" | "bold" | undefined;
2378
+ lg?: "regular" | "medium" | "bold" | undefined;
2379
+ xl?: "regular" | "medium" | "bold" | undefined;
2380
+ }) | undefined;
2381
+ fontSize?: ("caption" | "base" | "highlight" | {
2382
+ xs?: "caption" | "base" | "highlight" | undefined;
2383
+ md?: "caption" | "base" | "highlight" | undefined;
2384
+ lg?: "caption" | "base" | "highlight" | undefined;
2385
+ xl?: "caption" | "base" | "highlight" | undefined;
2386
+ }) | undefined;
2283
2387
  }) => string) & {
2284
2388
  properties: Set<"fontSize" | "fontWeight" | "color" | "lineHeight" | "textAlign">;
2285
2389
  };
@@ -2868,8 +2972,6 @@ export declare const card: {
2868
2972
  };
2869
2973
  classnames: {
2870
2974
  container: string;
2871
- container__header: string;
2872
- container__body: string;
2873
2975
  container__footer: string;
2874
2976
  };
2875
2977
  };
@@ -2883,7 +2985,7 @@ declare const propertiesModal: {
2883
2985
  export type PaddingProperties = keyof typeof propertiesModal.padding;
2884
2986
  export interface ModalSprinkle {
2885
2987
  /**
2886
- * The maxWidth property specifies the maxWidth of a modal's content area.
2988
+ * The maxWidth property specifies the maxWidth of a modal's content area. The width of the modal will be defined by the width of the content in this prop.
2887
2989
  * @default { xs: "100%", md: "500px" }
2888
2990
  */
2889
2991
  maxWidth?: string | Conditions<string>;