@nimbus-ds/components 5.20.0 → 5.21.1-rc.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 (47) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/Accordion/index.js +1 -2
  3. package/dist/Alert/index.js +1 -2
  4. package/dist/Badge/index.js +1 -2
  5. package/dist/Box/index.js +1 -2
  6. package/dist/Button/index.js +1 -2
  7. package/dist/CHANGELOG.md +6 -0
  8. package/dist/Card/index.js +1 -2
  9. package/dist/Checkbox/index.js +1 -2
  10. package/dist/Chip/index.js +1 -2
  11. package/dist/Collapsible/index.js +1 -2
  12. package/dist/FileUploader/index.js +1 -2
  13. package/dist/Icon/index.js +1 -2
  14. package/dist/IconButton/index.d.ts +65 -0
  15. package/dist/IconButton/index.js +1 -2
  16. package/dist/Input/index.js +1 -2
  17. package/dist/Label/index.js +1 -2
  18. package/dist/Link/index.js +1 -2
  19. package/dist/List/index.js +1 -2
  20. package/dist/Modal/index.js +1 -2
  21. package/dist/MultiSelect/index.js +1 -2
  22. package/dist/Pagination/index.js +1 -2
  23. package/dist/Popover/index.js +1 -2
  24. package/dist/ProgressBar/index.js +1 -2
  25. package/dist/Radio/index.js +1 -2
  26. package/dist/ScrollPane/index.d.ts +4 -0
  27. package/dist/ScrollPane/index.js +1 -2
  28. package/dist/SegmentedControl/index.js +1 -2
  29. package/dist/Select/index.js +1 -2
  30. package/dist/Sidebar/index.js +1 -2
  31. package/dist/Skeleton/index.js +1 -2
  32. package/dist/Spinner/index.js +1 -2
  33. package/dist/Stepper/index.js +1 -2
  34. package/dist/Table/index.js +1 -2
  35. package/dist/Tabs/index.js +1 -2
  36. package/dist/Tag/index.js +1 -2
  37. package/dist/Text/index.js +1 -2
  38. package/dist/Textarea/index.js +1 -2
  39. package/dist/Thumbnail/index.js +1 -2
  40. package/dist/Title/index.js +1 -2
  41. package/dist/Toast/index.js +1 -2
  42. package/dist/Toggle/index.js +1 -2
  43. package/dist/Tooltip/index.js +1 -2
  44. package/dist/index.d.ts +9 -0
  45. package/dist/index.js +1 -2
  46. package/package.json +1 -1
  47. package/dist/components-props.json +0 -1
package/dist/IconButton/index.d.ts CHANGED
@@ -9,6 +9,47 @@ export interface Conditions<T> {
9
9
  lg?: T;
10
10
  xl?: T;
11
11
  }
12
+ export type Cursor = "auto" | "pointer" | "not-allowed" | "grab" | "inherit";
13
+ declare const icon: {
14
+ sprinkle: ((props: {
15
+ color?: "currentColor" | "primary-interactive" | "primary-surface" | "primary-textLow" | "success-textLow" | "success-surface" | "warning-interactive" | "warning-surface" | "warning-textLow" | "danger-interactive" | "danger-surface" | "danger-textLow" | "neutral-background" | "neutral-interactive" | "neutral-surface" | "neutral-textLow" | "success-interactive" | "ai-generative" | "primary-textHigh" | "success-textHigh" | "warning-textHigh" | "danger-textHigh" | "neutral-textDisabled" | "neutral-textHigh" | undefined;
16
+ cursor?: Cursor | undefined;
17
+ }) => string) & {
18
+ properties: Set<"color" | "cursor">;
19
+ };
20
+ properties: {
21
+ color: {
22
+ currentColor: string;
23
+ "primary-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
24
+ "primary-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
25
+ "primary-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
26
+ "primary-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
27
+ "success-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
28
+ "success-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
29
+ "success-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
30
+ "success-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
31
+ "warning-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
32
+ "warning-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
33
+ "warning-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
34
+ "warning-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
35
+ "danger-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
36
+ "danger-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
37
+ "danger-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
38
+ "danger-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
39
+ "neutral-background": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
40
+ "neutral-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
41
+ "neutral-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
42
+ "neutral-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
43
+ "neutral-textDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
44
+ "neutral-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
45
+ "ai-generative": string;
46
+ };
47
+ cursor: Cursor[];
48
+ };
49
+ classnames: {
50
+ base: string;
51
+ };
52
+ };
12
53
  declare const propertiesIconButton: {
13
54
  backgroundColor: {
14
55
  transparent: string;
@@ -69,6 +110,25 @@ export interface SkeletonProperties {
69
110
  "data-testid"?: string;
70
111
  }
71
112
  export type SkeletonProps = SkeletonProperties & HTMLAttributes<HTMLDivElement>;
113
+ export interface IconProperties {
114
+ /**
115
+ * The SVG contents to display in the Icon.
116
+ * @TJS-type React.ReactNode
117
+ */
118
+ source: ReactNode;
119
+ /**
120
+ * Set the color for the SVG fill.
121
+ * Use "ai-generative" to apply the Nimbus AI generative gradient.
122
+ * @default neutral-textLow
123
+ */
124
+ color?: keyof typeof icon.properties.color | "ai-generative";
125
+ /**
126
+ * The cursor property specifies the mouse cursor to be displayed when pointing over an element.
127
+ * @default inherit
128
+ */
129
+ cursor?: (typeof icon.properties.cursor)[number];
130
+ }
131
+ export type IconProps = IconProperties & HTMLAttributes<HTMLDivElement>;
72
132
  export type IconButtonSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height">> & {
73
133
  /**
74
134
  * This is an attribute used to identify a DOM node for testing purposes.
@@ -91,6 +151,11 @@ export interface IconButtonProperties extends IconButtonSprinkle {
91
151
  * @TJS-type React.ReactNode
92
152
  */
93
153
  source: ReactNode;
154
+ /**
155
+ * Set the color for the inner Icon fill.
156
+ * @default neutral-textHigh
157
+ */
158
+ color?: IconProps["color"];
94
159
  }
95
160
  export type IconButtonProps = IconButtonProperties & ButtonHTMLAttributes<HTMLButtonElement | HTMLDivElement>;
96
161
  export declare const IconButton: React.FC<IconButtonProps> & IconButtonComponents;