@cdx-ui/components 0.0.1-beta.71 → 0.0.1-beta.72

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 (56) hide show
  1. package/lib/commonjs/components/Alert/index.js +263 -0
  2. package/lib/commonjs/components/Alert/index.js.map +1 -0
  3. package/lib/commonjs/components/Alert/styles.js +87 -0
  4. package/lib/commonjs/components/Alert/styles.js.map +1 -0
  5. package/lib/commonjs/components/index.js +12 -0
  6. package/lib/commonjs/components/index.js.map +1 -1
  7. package/lib/commonjs/figma/Alert.Button.figma.js +31 -0
  8. package/lib/commonjs/figma/Alert.Button.figma.js.map +1 -0
  9. package/lib/commonjs/figma/Alert.Close.figma.js +24 -0
  10. package/lib/commonjs/figma/Alert.Close.figma.js.map +1 -0
  11. package/lib/commonjs/figma/Alert.Description.figma.js +20 -0
  12. package/lib/commonjs/figma/Alert.Description.figma.js.map +1 -0
  13. package/lib/commonjs/figma/Alert.Title.figma.js +20 -0
  14. package/lib/commonjs/figma/Alert.Title.figma.js.map +1 -0
  15. package/lib/commonjs/figma/Alert.figma.js +42 -0
  16. package/lib/commonjs/figma/Alert.figma.js.map +1 -0
  17. package/lib/module/components/Alert/index.js +259 -0
  18. package/lib/module/components/Alert/index.js.map +1 -0
  19. package/lib/module/components/Alert/styles.js +84 -0
  20. package/lib/module/components/Alert/styles.js.map +1 -0
  21. package/lib/module/components/index.js +1 -0
  22. package/lib/module/components/index.js.map +1 -1
  23. package/lib/module/figma/Alert.Button.figma.js +25 -0
  24. package/lib/module/figma/Alert.Button.figma.js.map +1 -0
  25. package/lib/module/figma/Alert.Close.figma.js +18 -0
  26. package/lib/module/figma/Alert.Close.figma.js.map +1 -0
  27. package/lib/module/figma/Alert.Description.figma.js +14 -0
  28. package/lib/module/figma/Alert.Description.figma.js.map +1 -0
  29. package/lib/module/figma/Alert.Title.figma.js +14 -0
  30. package/lib/module/figma/Alert.Title.figma.js.map +1 -0
  31. package/lib/module/figma/Alert.figma.js +36 -0
  32. package/lib/module/figma/Alert.figma.js.map +1 -0
  33. package/lib/typescript/components/Alert/index.d.ts +67 -0
  34. package/lib/typescript/components/Alert/index.d.ts.map +1 -0
  35. package/lib/typescript/components/Alert/styles.d.ts +19 -0
  36. package/lib/typescript/components/Alert/styles.d.ts.map +1 -0
  37. package/lib/typescript/components/Button/styles.d.ts +4 -4
  38. package/lib/typescript/components/Chip/styles.d.ts +3 -3
  39. package/lib/typescript/components/IconButton/styles.d.ts +2 -2
  40. package/lib/typescript/components/Tile/styles.d.ts +1 -1
  41. package/lib/typescript/components/index.d.ts +1 -0
  42. package/lib/typescript/components/index.d.ts.map +1 -1
  43. package/lib/typescript/figma/Alert.Button.figma.d.ts +11 -0
  44. package/lib/typescript/figma/Alert.Button.figma.d.ts.map +1 -0
  45. package/lib/typescript/figma/Alert.Close.figma.d.ts +11 -0
  46. package/lib/typescript/figma/Alert.Close.figma.d.ts.map +1 -0
  47. package/lib/typescript/figma/Alert.Description.figma.d.ts +8 -0
  48. package/lib/typescript/figma/Alert.Description.figma.d.ts.map +1 -0
  49. package/lib/typescript/figma/Alert.Title.figma.d.ts +8 -0
  50. package/lib/typescript/figma/Alert.Title.figma.d.ts.map +1 -0
  51. package/lib/typescript/figma/Alert.figma.d.ts +8 -0
  52. package/lib/typescript/figma/Alert.figma.d.ts.map +1 -0
  53. package/package.json +4 -4
  54. package/src/components/Alert/index.tsx +318 -0
  55. package/src/components/Alert/styles.ts +88 -0
  56. package/src/components/index.ts +1 -0
@@ -0,0 +1,259 @@
1
+ "use strict";
2
+
3
+ import React, { forwardRef, useMemo } from 'react';
4
+ import { Text, View } from 'react-native';
5
+ import { Slot, dataAttributes, mergeDataAttributes } from '@cdx-ui/primitives';
6
+ import { CheckCircle, EmergencyHome, Info, Warning } from '@cdx-ui/icons';
7
+ import { cn, ParentContext, useParentContext, useStyleContext } from '@cdx-ui/utils';
8
+ import { Icon } from '../Icon';
9
+ import { alertActionsVariants, alertBodyVariants, alertDescriptionVariants, alertIconVariants, alertRootVariants, alertTextVariants, alertTitleVariants } from './styles';
10
+
11
+ // =============================================================================
12
+ // CONTEXT
13
+ // =============================================================================
14
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
15
+ const SCOPE = 'ALERT';
16
+ const useAlertStyleContext = () => {
17
+ const ctx = useStyleContext(SCOPE);
18
+ return {
19
+ severity: ctx?.severity ?? 'info'
20
+ };
21
+ };
22
+
23
+ // Severity → default icon mapping
24
+ const SEVERITY_ICONS = {
25
+ danger: EmergencyHome,
26
+ warning: Warning,
27
+ success: CheckCircle,
28
+ info: Info
29
+ };
30
+
31
+ // =============================================================================
32
+ // ROOT
33
+ // =============================================================================
34
+
35
+ const AlertRoot = /*#__PURE__*/forwardRef(({
36
+ asChild,
37
+ severity = 'info',
38
+ className,
39
+ style,
40
+ children,
41
+ ...props
42
+ }, ref) => {
43
+ const isAssertive = severity === 'danger' || severity === 'warning';
44
+ const parent = useParentContext();
45
+ const ctx = useMemo(() => ({
46
+ ...parent,
47
+ [SCOPE]: {
48
+ severity
49
+ }
50
+ }), [parent, severity]);
51
+ const rootClassName = cn(alertRootVariants({
52
+ severity
53
+ }), className);
54
+ const role = isAssertive ? 'alert' : 'status';
55
+ const liveRegion = isAssertive ? 'assertive' : 'polite';
56
+ const dataProps = mergeDataAttributes(props, dataAttributes({
57
+ slot: 'alert'
58
+ }));
59
+ if (asChild) {
60
+ return /*#__PURE__*/_jsx(ParentContext.Provider, {
61
+ value: ctx,
62
+ children: /*#__PURE__*/_jsx(Slot, {
63
+ ref: ref,
64
+ className: rootClassName,
65
+ style: style,
66
+ role: role,
67
+ accessibilityLiveRegion: liveRegion,
68
+ ...props,
69
+ ...dataProps,
70
+ children: children
71
+ })
72
+ });
73
+ }
74
+
75
+ // Split children into three regions:
76
+ // 1. Alert.Icon — rendered at inline-start (left)
77
+ // 2. Alert.Actions — rendered at inline-end (right), beside the text
78
+ // 3. Everything else (Title, Description) — text column, flex-1
79
+ //
80
+ // Layout: [Icon] [flex-1 flex-row: [text flex-1] [Actions]]
81
+ const childArray = React.Children.toArray(children);
82
+ const iconChild = childArray.find(child => /*#__PURE__*/React.isValidElement(child) && child.type === AlertIconComponent);
83
+ const actionsChild = childArray.find(child => /*#__PURE__*/React.isValidElement(child) && child.type === AlertActions);
84
+ const textChildren = childArray.filter(child => ! /*#__PURE__*/React.isValidElement(child) || child.type !== AlertIconComponent && child.type !== AlertActions);
85
+ const hasBody = textChildren.length > 0 || !!actionsChild;
86
+ return /*#__PURE__*/_jsx(ParentContext.Provider, {
87
+ value: ctx,
88
+ children: /*#__PURE__*/_jsxs(View, {
89
+ ref: ref,
90
+ className: rootClassName,
91
+ style: style,
92
+ role: role,
93
+ accessibilityLiveRegion: liveRegion,
94
+ ...props,
95
+ ...dataProps,
96
+ children: [iconChild, hasBody ? /*#__PURE__*/_jsxs(View, {
97
+ className: alertBodyVariants(),
98
+ children: [textChildren.length > 0 ? /*#__PURE__*/_jsx(View, {
99
+ className: alertTextVariants(),
100
+ children: textChildren
101
+ }) : null, actionsChild]
102
+ }) : null]
103
+ })
104
+ });
105
+ });
106
+ AlertRoot.displayName = 'Alert';
107
+
108
+ // =============================================================================
109
+ // ICON
110
+ // =============================================================================
111
+
112
+ const AlertIconComponent = /*#__PURE__*/forwardRef(({
113
+ asChild,
114
+ as: asOverride,
115
+ className,
116
+ style,
117
+ ...props
118
+ }, ref) => {
119
+ const {
120
+ severity
121
+ } = useAlertStyleContext();
122
+ const computedClassName = cn(alertIconVariants({
123
+ severity
124
+ }), className);
125
+ if (asChild) {
126
+ return /*#__PURE__*/_jsx(Slot, {
127
+ ref: ref,
128
+ className: computedClassName,
129
+ style: style,
130
+ ...props,
131
+ ...mergeDataAttributes(props, dataAttributes({
132
+ slot: 'alert-icon'
133
+ }))
134
+ });
135
+ }
136
+ return /*#__PURE__*/_jsx(Icon, {
137
+ as: asOverride ?? SEVERITY_ICONS[severity],
138
+ className: computedClassName,
139
+ style: style,
140
+ ...props,
141
+ ...mergeDataAttributes(props, dataAttributes({
142
+ slot: 'alert-icon'
143
+ }))
144
+ });
145
+ });
146
+ AlertIconComponent.displayName = 'Alert.Icon';
147
+
148
+ // =============================================================================
149
+ // TITLE
150
+ // =============================================================================
151
+
152
+ const AlertTitle = /*#__PURE__*/forwardRef(({
153
+ asChild,
154
+ className,
155
+ style,
156
+ children,
157
+ ...props
158
+ }, ref) => {
159
+ const {
160
+ severity
161
+ } = useAlertStyleContext();
162
+ const computedClassName = cn(alertTitleVariants({
163
+ severity
164
+ }), className);
165
+ const Comp = asChild ? Slot : Text;
166
+ return /*#__PURE__*/_jsx(Comp, {
167
+ ref: ref,
168
+ className: computedClassName,
169
+ style: style,
170
+ ...props,
171
+ ...mergeDataAttributes(props, dataAttributes({
172
+ slot: 'alert-title'
173
+ })),
174
+ children: children
175
+ });
176
+ });
177
+ AlertTitle.displayName = 'Alert.Title';
178
+
179
+ // =============================================================================
180
+ // DESCRIPTION
181
+ // =============================================================================
182
+
183
+ const AlertDescription = /*#__PURE__*/forwardRef(({
184
+ asChild,
185
+ className,
186
+ style,
187
+ children,
188
+ ...props
189
+ }, ref) => {
190
+ const {
191
+ severity
192
+ } = useAlertStyleContext();
193
+ const computedClassName = cn(alertDescriptionVariants({
194
+ severity
195
+ }), className);
196
+ const Comp = asChild ? Slot : Text;
197
+ return /*#__PURE__*/_jsx(Comp, {
198
+ ref: ref,
199
+ className: computedClassName,
200
+ style: style,
201
+ ...props,
202
+ ...mergeDataAttributes(props, dataAttributes({
203
+ slot: 'alert-description'
204
+ })),
205
+ children: children
206
+ });
207
+ });
208
+ AlertDescription.displayName = 'Alert.Description';
209
+
210
+ // =============================================================================
211
+ // ACTIONS
212
+ // =============================================================================
213
+
214
+ const AlertActions = /*#__PURE__*/forwardRef(({
215
+ asChild,
216
+ className,
217
+ style,
218
+ children,
219
+ ...props
220
+ }, ref) => {
221
+ const {
222
+ severity
223
+ } = useAlertStyleContext();
224
+ const computedClassName = cn(alertActionsVariants(), className);
225
+ const Comp = asChild ? Slot : View;
226
+
227
+ // Auto-inject color={severity} on direct Button / IconButton children unless
228
+ // the consumer already provides a color prop.
229
+ const injectedChildren = React.Children.map(children, child => {
230
+ if (! /*#__PURE__*/React.isValidElement(child)) return child;
231
+ if ('color' in child.props) return child;
232
+ return /*#__PURE__*/React.cloneElement(child, {
233
+ color: severity
234
+ });
235
+ });
236
+ return /*#__PURE__*/_jsx(Comp, {
237
+ ref: ref,
238
+ className: computedClassName,
239
+ style: style,
240
+ ...props,
241
+ ...mergeDataAttributes(props, dataAttributes({
242
+ slot: 'alert-actions'
243
+ })),
244
+ children: asChild ? children : injectedChildren
245
+ });
246
+ });
247
+ AlertActions.displayName = 'Alert.Actions';
248
+
249
+ // =============================================================================
250
+ // COMPOUND EXPORT
251
+ // =============================================================================
252
+
253
+ export const Alert = Object.assign(AlertRoot, {
254
+ Icon: AlertIconComponent,
255
+ Title: AlertTitle,
256
+ Description: AlertDescription,
257
+ Actions: AlertActions
258
+ });
259
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["React","forwardRef","useMemo","Text","View","Slot","dataAttributes","mergeDataAttributes","CheckCircle","EmergencyHome","Info","Warning","cn","ParentContext","useParentContext","useStyleContext","Icon","alertActionsVariants","alertBodyVariants","alertDescriptionVariants","alertIconVariants","alertRootVariants","alertTextVariants","alertTitleVariants","jsx","_jsx","jsxs","_jsxs","SCOPE","useAlertStyleContext","ctx","severity","SEVERITY_ICONS","danger","warning","success","info","AlertRoot","asChild","className","style","children","props","ref","isAssertive","parent","rootClassName","role","liveRegion","dataProps","slot","Provider","value","accessibilityLiveRegion","childArray","Children","toArray","iconChild","find","child","isValidElement","type","AlertIconComponent","actionsChild","AlertActions","textChildren","filter","hasBody","length","displayName","as","asOverride","computedClassName","AlertTitle","Comp","AlertDescription","injectedChildren","map","cloneElement","color","Alert","Object","assign","Title","Description","Actions"],"sourceRoot":"../../../../src","sources":["components/Alert/index.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,84 @@
1
+ "use strict";
2
+
3
+ import { cva } from 'class-variance-authority';
4
+
5
+ // ── Severity type ────────────────────────────────────────────────────────────
6
+
7
+ // ── Root ─────────────────────────────────────────────────────────────────────
8
+
9
+ export const alertRootVariants = cva(['flex-row items-start', 'gap-2 px-3', 'rounded-[var(--border-radius-default)]'], {
10
+ variants: {
11
+ severity: {
12
+ danger: 'bg-surface-danger-subtle',
13
+ warning: 'bg-surface-warning-subtle',
14
+ success: 'bg-surface-success-subtle',
15
+ info: 'bg-surface-info-subtle'
16
+ }
17
+ },
18
+ defaultVariants: {
19
+ severity: 'info'
20
+ }
21
+ });
22
+
23
+ // ── Icon ─────────────────────────────────────────────────────────────────────
24
+
25
+ export const alertIconVariants = cva(['size-5 shrink-0 mt-3'], {
26
+ variants: {
27
+ severity: {
28
+ danger: 'text-content-danger-on-subtle',
29
+ warning: 'text-content-warning-on-subtle',
30
+ success: 'text-content-success-on-subtle',
31
+ info: 'text-content-info-on-subtle'
32
+ }
33
+ },
34
+ defaultVariants: {
35
+ severity: 'info'
36
+ }
37
+ });
38
+
39
+ // ── Body (internal row: text area + trailing actions) ────────────────────────
40
+
41
+ export const alertBodyVariants = cva(['flex-1 flex-row items-start gap-2 min-w-0']);
42
+
43
+ // ── Text (internal flex-col for title + description) ─────────────────────────
44
+
45
+ export const alertTextVariants = cva(['flex-1 flex-col gap-1 min-w-0 mt-3 mb-3']);
46
+
47
+ // ── Title ────────────────────────────────────────────────────────────────────
48
+
49
+ export const alertTitleVariants = cva(['body-md font-semibold'], {
50
+ variants: {
51
+ severity: {
52
+ danger: 'text-content-danger-on-subtle',
53
+ warning: 'text-content-warning-on-subtle',
54
+ success: 'text-content-success-on-subtle',
55
+ info: 'text-content-info-on-subtle'
56
+ }
57
+ },
58
+ defaultVariants: {
59
+ severity: 'info'
60
+ }
61
+ });
62
+
63
+ // ── Description ──────────────────────────────────────────────────────────────
64
+
65
+ export const alertDescriptionVariants = cva(['body-md'], {
66
+ variants: {
67
+ severity: {
68
+ danger: 'text-content-danger-on-subtle',
69
+ warning: 'text-content-warning-on-subtle',
70
+ success: 'text-content-success-on-subtle',
71
+ info: 'text-content-info-on-subtle'
72
+ }
73
+ },
74
+ defaultVariants: {
75
+ severity: 'info'
76
+ }
77
+ });
78
+
79
+ // ── Actions ──────────────────────────────────────────────────────────────────
80
+
81
+ export const alertActionsVariants = cva(['shrink-0 flex-row items-center gap-1.5 mt-1.5 mb-1.5']);
82
+
83
+ // ── Types ─────────────────────────────────────────────────────────────────────
84
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["cva","alertRootVariants","variants","severity","danger","warning","success","info","defaultVariants","alertIconVariants","alertBodyVariants","alertTextVariants","alertTitleVariants","alertDescriptionVariants","alertActionsVariants"],"sourceRoot":"../../../../src","sources":["components/Alert/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,0BAA0B;;AAEjE;;AAIA;;AAEA,OAAO,MAAMC,iBAAiB,GAAGD,GAAG,CAClC,CAAC,sBAAsB,EAAE,YAAY,EAAE,wCAAwC,CAAC,EAChF;EACEE,QAAQ,EAAE;IACRC,QAAQ,EAAE;MACRC,MAAM,EAAE,0BAA0B;MAClCC,OAAO,EAAE,2BAA2B;MACpCC,OAAO,EAAE,2BAA2B;MACpCC,IAAI,EAAE;IACR;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,QAAQ,EAAE;EACZ;AACF,CACF,CAAC;;AAED;;AAEA,OAAO,MAAMM,iBAAiB,GAAGT,GAAG,CAAC,CAAC,sBAAsB,CAAC,EAAE;EAC7DE,QAAQ,EAAE;IACRC,QAAQ,EAAE;MACRC,MAAM,EAAE,+BAA+B;MACvCC,OAAO,EAAE,gCAAgC;MACzCC,OAAO,EAAE,gCAAgC;MACzCC,IAAI,EAAE;IACR;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;;AAEF;;AAEA,OAAO,MAAMO,iBAAiB,GAAGV,GAAG,CAAC,CAAC,2CAA2C,CAAC,CAAC;;AAEnF;;AAEA,OAAO,MAAMW,iBAAiB,GAAGX,GAAG,CAAC,CAAC,yCAAyC,CAAC,CAAC;;AAEjF;;AAEA,OAAO,MAAMY,kBAAkB,GAAGZ,GAAG,CAAC,CAAC,uBAAuB,CAAC,EAAE;EAC/DE,QAAQ,EAAE;IACRC,QAAQ,EAAE;MACRC,MAAM,EAAE,+BAA+B;MACvCC,OAAO,EAAE,gCAAgC;MACzCC,OAAO,EAAE,gCAAgC;MACzCC,IAAI,EAAE;IACR;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;;AAEF;;AAEA,OAAO,MAAMU,wBAAwB,GAAGb,GAAG,CAAC,CAAC,SAAS,CAAC,EAAE;EACvDE,QAAQ,EAAE;IACRC,QAAQ,EAAE;MACRC,MAAM,EAAE,+BAA+B;MACvCC,OAAO,EAAE,gCAAgC;MACzCC,OAAO,EAAE,gCAAgC;MACzCC,IAAI,EAAE;IACR;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;;AAEF;;AAEA,OAAO,MAAMW,oBAAoB,GAAGd,GAAG,CAAC,CAAC,sDAAsD,CAAC,CAAC;;AAEjG","ignoreList":[]}
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
 
3
+ export * from './Alert';
3
4
  export * from './AlertDialog';
4
5
  export * from './Avatar';
5
6
  export * from './BottomSheet';
@@ -1 +1 @@
1
- {"version":3,"names":["HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,eAAe;AAC7B,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,SAASA,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}
1
+ {"version":3,"names":["HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,eAAe;AAC7B,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,SAASA,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ // url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--React-Native-Components?node-id=6665-19528
4
+ // source=packages/components/src/components/Alert/index.tsx
5
+ // component=Alert.Button
6
+ import figma from 'figma';
7
+ const instance = figma.selectedInstance;
8
+ const buttonInstance = instance.findInstance('Button');
9
+ const buttonSnippet = buttonInstance?.type === 'INSTANCE' ? buttonInstance.executeTemplate().example : null;
10
+ const labelHandle = instance.findText('Button.Label', {
11
+ traverseInstances: true
12
+ });
13
+ const label = labelHandle?.textContent;
14
+ export default {
15
+ id: 'alert-button',
16
+ imports: ["import { Button } from '@cdx-ui/components'"],
17
+ metadata: {
18
+ nestable: true
19
+ },
20
+ example: buttonSnippet ?? (label ? figma.code`
21
+ <Button variant="ghost" size="small">
22
+ <Button.Label>${label}</Button.Label>
23
+ </Button>` : null)
24
+ };
25
+ //# sourceMappingURL=Alert.Button.figma.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["figma","instance","selectedInstance","buttonInstance","findInstance","buttonSnippet","type","executeTemplate","example","labelHandle","findText","traverseInstances","label","textContent","id","imports","metadata","nestable","code"],"sourceRoot":"../../../src","sources":["figma/Alert.Button.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,cAAc,GAAGF,QAAQ,CAACG,YAAY,CAAC,QAAQ,CAAC;AACtD,MAAMC,aAAa,GACjBF,cAAc,EAAEG,IAAI,KAAK,UAAU,GAAGH,cAAc,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAEvF,MAAMC,WAAW,GAAGR,QAAQ,CAACS,QAAQ,CAAC,cAAc,EAAE;EACpDC,iBAAiB,EAAE;AACrB,CAAC,CAAsC;AACvC,MAAMC,KAAK,GAAGH,WAAW,EAAEI,WAAW;AAEtC,eAAe;EACbC,EAAE,EAAE,cAAc;EAClBC,OAAO,EAAE,CAAC,6CAA6C,CAAC;EACxDC,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK,CAAC;EAC5BT,OAAO,EACLH,aAAa,KACZO,KAAK,GACFZ,KAAK,CAACkB,IAAI;AAClB;AACA,kBAAkBN,KAAK;AACvB,UAAU,GACF,IAAI;AACZ,CAAC","ignoreList":[]}
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+
3
+ // url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--React-Native-Components?node-id=6665-19498
4
+ // source=packages/components/src/components/Alert/index.tsx
5
+ // component=Alert.Close
6
+ import figma from 'figma';
7
+ const instance = figma.selectedInstance;
8
+ const iconButtonInstance = instance.findInstance('IconButton');
9
+ const iconButtonSnippet = iconButtonInstance?.type === 'INSTANCE' ? iconButtonInstance.executeTemplate().example : null;
10
+ export default {
11
+ id: 'alert-close',
12
+ imports: ["import { IconButton } from '@cdx-ui/components'", "import { Close } from '@cdx-ui/icons'"],
13
+ metadata: {
14
+ nestable: true
15
+ },
16
+ example: iconButtonSnippet ?? figma.code`<IconButton variant="ghost" size="small" as={Close} accessibilityLabel="Dismiss" />`
17
+ };
18
+ //# sourceMappingURL=Alert.Close.figma.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["figma","instance","selectedInstance","iconButtonInstance","findInstance","iconButtonSnippet","type","executeTemplate","example","id","imports","metadata","nestable","code"],"sourceRoot":"../../../src","sources":["figma/Alert.Close.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,kBAAkB,GAAGF,QAAQ,CAACG,YAAY,CAAC,YAAY,CAAC;AAC9D,MAAMC,iBAAiB,GACrBF,kBAAkB,EAAEG,IAAI,KAAK,UAAU,GAAGH,kBAAkB,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAE/F,eAAe;EACbC,EAAE,EAAE,aAAa;EACjBC,OAAO,EAAE,CACP,iDAAiD,EACjD,uCAAuC,CACxC;EACDC,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK,CAAC;EAC5BJ,OAAO,EACLH,iBAAiB,IACjBL,KAAK,CAACa,IAAI;AACd,CAAC","ignoreList":[]}
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+
3
+ // url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--React-Native-Components?node-id=6572-8580
4
+ // source=packages/components/src/components/Alert/index.tsx
5
+ // component=Alert.Description
6
+ import figma from 'figma';
7
+ const instance = figma.selectedInstance;
8
+ const description = instance.findText('{description}').textContent;
9
+ export default {
10
+ id: 'alert-description',
11
+ imports: ["import { Alert } from '@cdx-ui/components'"],
12
+ example: figma.code`<Alert.Description>${description}</Alert.Description>`
13
+ };
14
+ //# sourceMappingURL=Alert.Description.figma.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["figma","instance","selectedInstance","description","findText","textContent","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Alert.Description.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,WAAW,GAAIF,QAAQ,CAACG,QAAQ,CAAC,eAAe,CAAC,CAAgCC,WAAW;AAElG,eAAe;EACbC,EAAE,EAAE,mBAAmB;EACvBC,OAAO,EAAE,CAAC,4CAA4C,CAAC;EACvDC,OAAO,EAAER,KAAK,CAACS,IAAI,sBAAsBN,WAAW;AACtD,CAAC","ignoreList":[]}
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+
3
+ // url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--React-Native-Components?node-id=6572-8577
4
+ // source=packages/components/src/components/Alert/index.tsx
5
+ // component=Alert.Title
6
+ import figma from 'figma';
7
+ const instance = figma.selectedInstance;
8
+ const title = instance.findText('{title}').textContent;
9
+ export default {
10
+ id: 'alert-title',
11
+ imports: ["import { Alert } from '@cdx-ui/components'"],
12
+ example: figma.code`<Alert.Title>${title}</Alert.Title>`
13
+ };
14
+ //# sourceMappingURL=Alert.Title.figma.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["figma","instance","selectedInstance","title","findText","textContent","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Alert.Title.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,KAAK,GAAIF,QAAQ,CAACG,QAAQ,CAAC,SAAS,CAAC,CAAgCC,WAAW;AAEtF,eAAe;EACbC,EAAE,EAAE,aAAa;EACjBC,OAAO,EAAE,CAAC,4CAA4C,CAAC;EACvDC,OAAO,EAAER,KAAK,CAACS,IAAI,gBAAgBN,KAAK;AAC1C,CAAC","ignoreList":[]}
@@ -0,0 +1,36 @@
1
+ "use strict";
2
+
3
+ // url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--React-Native-Components?node-id=6665-19536
4
+ // source=packages/components/src/components/Alert/index.tsx
5
+ // component=Alert
6
+ import figma from 'figma';
7
+ const instance = figma.selectedInstance;
8
+ const severity = instance.getEnum('severity', {
9
+ danger: 'danger',
10
+ warning: 'warning',
11
+ success: 'success',
12
+ info: 'info'
13
+ });
14
+ const showHeadline = instance.getBoolean('Show Headline?');
15
+ const headlineInstance = instance.findInstance('Alert.Headline');
16
+ const headlineSnippet = showHeadline && headlineInstance?.type === 'INSTANCE' ? headlineInstance.executeTemplate().example : null;
17
+ const messageInstance = instance.findInstance('Alert.Message');
18
+ const messageSnippet = messageInstance?.type === 'INSTANCE' ? messageInstance.executeTemplate().example : null;
19
+ const showTrailingSlot = instance.getBoolean('Show TrailingSlot?');
20
+ const trailingSlot = instance.getSlot('Alert.TrailingSlot');
21
+ const trailingChildren = showTrailingSlot && trailingSlot ? figma.helpers.react.renderChildren(trailingSlot) : null;
22
+ export default {
23
+ id: 'alert',
24
+ imports: ["import { Alert } from '@cdx-ui/components'"],
25
+ example: figma.code`
26
+ <Alert severity="${severity}">
27
+ <Alert.Icon />
28
+ ${headlineSnippet}
29
+ ${messageSnippet}
30
+ ${trailingChildren ? figma.code`
31
+ <Alert.Actions>
32
+ ${trailingChildren}
33
+ </Alert.Actions>` : null}
34
+ </Alert>`
35
+ };
36
+ //# sourceMappingURL=Alert.figma.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["figma","instance","selectedInstance","severity","getEnum","danger","warning","success","info","showHeadline","getBoolean","headlineInstance","findInstance","headlineSnippet","type","executeTemplate","example","messageInstance","messageSnippet","showTrailingSlot","trailingSlot","getSlot","trailingChildren","helpers","react","renderChildren","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/Alert.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,QAAQ,GAAGF,QAAQ,CAACG,OAAO,CAAC,UAAU,EAAE;EAC5CC,MAAM,EAAE,QAAQ;EAChBC,OAAO,EAAE,SAAS;EAClBC,OAAO,EAAE,SAAS;EAClBC,IAAI,EAAE;AACR,CAAC,CAAC;AAEF,MAAMC,YAAY,GAAGR,QAAQ,CAACS,UAAU,CAAC,gBAAgB,CAAC;AAE1D,MAAMC,gBAAgB,GAAGV,QAAQ,CAACW,YAAY,CAAC,gBAAgB,CAAC;AAChE,MAAMC,eAAe,GACnBJ,YAAY,IAAIE,gBAAgB,EAAEG,IAAI,KAAK,UAAU,GACjDH,gBAAgB,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAC1C,IAAI;AAEV,MAAMC,eAAe,GAAGhB,QAAQ,CAACW,YAAY,CAAC,eAAe,CAAC;AAC9D,MAAMM,cAAc,GAClBD,eAAe,EAAEH,IAAI,KAAK,UAAU,GAAGG,eAAe,CAACF,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAEzF,MAAMG,gBAAgB,GAAGlB,QAAQ,CAACS,UAAU,CAAC,oBAAoB,CAAC;AAClE,MAAMU,YAAY,GAAGnB,QAAQ,CAACoB,OAAO,CAAC,oBAAoB,CAAC;AAC3D,MAAMC,gBAAgB,GACpBH,gBAAgB,IAAIC,YAAY,GAAGpB,KAAK,CAACuB,OAAO,CAACC,KAAK,CAACC,cAAc,CAACL,YAAY,CAAC,GAAG,IAAI;AAE5F,eAAe;EACbM,EAAE,EAAE,OAAO;EACXC,OAAO,EAAE,CAAC,4CAA4C,CAAC;EACvDX,OAAO,EAAEhB,KAAK,CAAC4B,IAAI;AACrB,mBAAmBzB,QAAQ;AAC3B;AACA,IAAIU,eAAe;AACnB,IAAIK,cAAc;AAClB,IACII,gBAAgB,GACZtB,KAAK,CAAC4B,IAAI;AAClB;AACA,MAAMN,gBAAgB;AACtB,mBAAmB,GACX,IAAI;AACZ;AAEA,CAAC","ignoreList":[]}
@@ -0,0 +1,67 @@
1
+ import React, { type ReactNode } from 'react';
2
+ import { Text, View, type TextProps, type ViewProps } from 'react-native';
3
+ import type { ForgeIcon } from '@cdx-ui/icons';
4
+ import { type IconProps } from '../Icon';
5
+ import { type AlertSeverity, type AlertVariantProps } from './styles';
6
+ export interface AlertProps extends ViewProps, AlertVariantProps {
7
+ /**
8
+ * Replace the root element with the consumer's child element via `Slot`.
9
+ * When `true`, children are rendered as-is (no automatic icon/text/actions
10
+ * layout splitting). Severity context is still provided so sub-components
11
+ * receive the correct styles.
12
+ */
13
+ asChild?: boolean;
14
+ /** Severity level that controls background colour, icon, and live-region urgency. */
15
+ severity?: AlertSeverity;
16
+ className?: string;
17
+ /**
18
+ * Sub-components (`Alert.Icon`, `Alert.Title`, `Alert.Description`,
19
+ * `Alert.Actions`) must be rendered as **direct** children — wrapping them
20
+ * in HOCs or `memo()` will break the automatic layout splitting.
21
+ */
22
+ children?: ReactNode;
23
+ }
24
+ declare const AlertRoot: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<View>>;
25
+ export interface AlertIconProps extends Omit<IconProps, 'as'> {
26
+ asChild?: boolean;
27
+ /**
28
+ * Override the auto-rendered severity icon. Omit to use the default icon for
29
+ * the current severity (EmergencyHome, Warning, CheckCircle, or Info).
30
+ * Not required when `asChild` is set.
31
+ */
32
+ as?: ForgeIcon;
33
+ }
34
+ declare const AlertIconComponent: React.ForwardRefExoticComponent<AlertIconProps & React.RefAttributes<View>>;
35
+ export interface AlertTitleProps extends TextProps {
36
+ asChild?: boolean;
37
+ className?: string;
38
+ children?: ReactNode;
39
+ }
40
+ declare const AlertTitle: React.ForwardRefExoticComponent<AlertTitleProps & React.RefAttributes<Text>>;
41
+ export interface AlertDescriptionProps extends TextProps {
42
+ asChild?: boolean;
43
+ className?: string;
44
+ children?: ReactNode;
45
+ }
46
+ declare const AlertDescription: React.ForwardRefExoticComponent<AlertDescriptionProps & React.RefAttributes<Text>>;
47
+ export interface AlertActionsProps extends ViewProps {
48
+ /**
49
+ * Replace the wrapper element with the consumer's child via `Slot`.
50
+ * **Note:** when `true`, automatic `color={severity}` injection on
51
+ * direct `Button`/`IconButton` children is bypassed — the consumer
52
+ * must set `color` explicitly.
53
+ */
54
+ asChild?: boolean;
55
+ className?: string;
56
+ children?: ReactNode;
57
+ }
58
+ declare const AlertActions: React.ForwardRefExoticComponent<AlertActionsProps & React.RefAttributes<View>>;
59
+ type AlertCompoundComponent = typeof AlertRoot & {
60
+ Icon: typeof AlertIconComponent;
61
+ Title: typeof AlertTitle;
62
+ Description: typeof AlertDescription;
63
+ Actions: typeof AlertActions;
64
+ };
65
+ export declare const Alert: AlertCompoundComponent;
66
+ export type { AlertVariantProps, AlertSeverity };
67
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAuB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAC/C,OAAO,EAQL,KAAK,aAAa,EAClB,KAAK,iBAAiB,EACvB,MAAM,UAAU,CAAC;AA6BlB,MAAM,WAAW,UAAW,SAAQ,SAAS,EAAE,iBAAiB;IAC9D;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,SAAS,yEA2Ed,CAAC;AAQF,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC;IAC3D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,EAAE,CAAC,EAAE,SAAS,CAAC;CAChB;AAED,QAAA,MAAM,kBAAkB,6EA2BvB,CAAC;AAQF,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,UAAU,8EAkBf,CAAC;AAQF,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,gBAAgB,oFAkBrB,CAAC;AAQF,MAAM,WAAW,iBAAkB,SAAQ,SAAS;IAClD;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,YAAY,gFA0BjB,CAAC;AAQF,KAAK,sBAAsB,GAAG,OAAO,SAAS,GAAG;IAC/C,IAAI,EAAE,OAAO,kBAAkB,CAAC;IAChC,KAAK,EAAE,OAAO,UAAU,CAAC;IACzB,WAAW,EAAE,OAAO,gBAAgB,CAAC;IACrC,OAAO,EAAE,OAAO,YAAY,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,KAAK,EAKZ,sBAAsB,CAAC;AAE7B,YAAY,EAAE,iBAAiB,EAAE,aAAa,EAAE,CAAC"}
@@ -0,0 +1,19 @@
1
+ import { type VariantProps } from 'class-variance-authority';
2
+ export type AlertSeverity = 'danger' | 'warning' | 'success' | 'info';
3
+ export declare const alertRootVariants: (props?: ({
4
+ severity?: "danger" | "warning" | "success" | "info" | null | undefined;
5
+ } & import("class-variance-authority/types").ClassProp) | undefined) => string;
6
+ export declare const alertIconVariants: (props?: ({
7
+ severity?: "danger" | "warning" | "success" | "info" | null | undefined;
8
+ } & import("class-variance-authority/types").ClassProp) | undefined) => string;
9
+ export declare const alertBodyVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
10
+ export declare const alertTextVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
11
+ export declare const alertTitleVariants: (props?: ({
12
+ severity?: "danger" | "warning" | "success" | "info" | null | undefined;
13
+ } & import("class-variance-authority/types").ClassProp) | undefined) => string;
14
+ export declare const alertDescriptionVariants: (props?: ({
15
+ severity?: "danger" | "warning" | "success" | "info" | null | undefined;
16
+ } & import("class-variance-authority/types").ClassProp) | undefined) => string;
17
+ export declare const alertActionsVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
18
+ export type AlertVariantProps = VariantProps<typeof alertRootVariants>;
19
+ //# sourceMappingURL=styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Alert/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAItE,eAAO,MAAM,iBAAiB;;8EAe7B,CAAC;AAIF,eAAO,MAAM,iBAAiB;;8EAY5B,CAAC;AAIH,eAAO,MAAM,iBAAiB,oFAAqD,CAAC;AAIpF,eAAO,MAAM,iBAAiB,oFAAmD,CAAC;AAIlF,eAAO,MAAM,kBAAkB;;8EAY7B,CAAC;AAIH,eAAO,MAAM,wBAAwB;;8EAYnC,CAAC;AAIH,eAAO,MAAM,oBAAoB,oFAAgE,CAAC;AAIlG,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC"}
@@ -1,19 +1,19 @@
1
1
  import { type VariantProps } from 'class-variance-authority';
2
2
  export declare const buttonRootVariants: (props?: ({
3
3
  variant?: "solid" | "outline" | "ghost" | null | undefined;
4
- color?: "action" | "danger" | "warning" | "success" | "info" | null | undefined;
4
+ color?: "danger" | "warning" | "success" | "info" | "action" | null | undefined;
5
5
  size?: "small" | "default" | null | undefined;
6
6
  fullWidth?: boolean | null | undefined;
7
7
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
8
8
  export declare const buttonTextVariants: (props?: ({
9
9
  variant?: "solid" | "outline" | "ghost" | null | undefined;
10
- color?: "action" | "danger" | "warning" | "success" | "info" | null | undefined;
10
+ color?: "danger" | "warning" | "success" | "info" | "action" | null | undefined;
11
11
  size?: "small" | "default" | null | undefined;
12
12
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
13
13
  export declare const buttonSpinnerVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
14
14
  export declare const buttonSpinnerColorVariants: (props?: ({
15
15
  variant?: "solid" | "outline" | "ghost" | null | undefined;
16
- color?: "action" | "danger" | "warning" | "success" | "info" | null | undefined;
16
+ color?: "danger" | "warning" | "success" | "info" | "action" | null | undefined;
17
17
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
18
18
  export declare const buttonGroupVariants: (props?: ({
19
19
  flexDirection?: "row" | "column" | "row-reverse" | "column-reverse" | null | undefined;
@@ -21,7 +21,7 @@ export declare const buttonGroupVariants: (props?: ({
21
21
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
22
22
  export declare const buttonIconVariants: (props?: ({
23
23
  variant?: "solid" | "outline" | "ghost" | null | undefined;
24
- color?: "action" | "danger" | "warning" | "success" | "info" | null | undefined;
24
+ color?: "danger" | "warning" | "success" | "info" | "action" | null | undefined;
25
25
  size?: "small" | "default" | null | undefined;
26
26
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
27
27
  export type ButtonVariantProps = VariantProps<typeof buttonRootVariants>;