@agentiffai/design 1.3.29 → 1.4.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/YouTubeIcon-C1e6LEOF.d.cts +398 -0
- package/dist/YouTubeIcon-C1e6LEOF.d.ts +398 -0
- package/dist/copilotkit/index.cjs +4 -39
- package/dist/copilotkit/index.cjs.map +1 -1
- package/dist/copilotkit/index.d.cts +1 -0
- package/dist/copilotkit/index.d.ts +1 -0
- package/dist/copilotkit/index.js +1 -39
- package/dist/copilotkit/index.js.map +1 -1
- package/dist/icons/index.cjs +1326 -3
- package/dist/icons/index.cjs.map +1 -1
- package/dist/icons/index.d.cts +136 -320
- package/dist/icons/index.d.ts +136 -320
- package/dist/icons/index.js +1311 -4
- package/dist/icons/index.js.map +1 -1
- package/dist/index.cjs +845 -613
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +34 -2
- package/dist/index.d.ts +34 -2
- package/dist/index.js +791 -560
- package/dist/index.js.map +1 -1
- package/dist/layout/index.cjs +0 -30
- package/dist/layout/index.cjs.map +1 -1
- package/dist/layout/index.js +0 -30
- package/dist/layout/index.js.map +1 -1
- package/dist/theme/index.cjs +0 -54
- package/dist/theme/index.cjs.map +1 -1
- package/dist/theme/index.d.cts +0 -5
- package/dist/theme/index.d.ts +0 -5
- package/dist/theme/index.js +0 -54
- package/dist/theme/index.js.map +1 -1
- package/dist/workflow/index.cjs +0 -26
- package/dist/workflow/index.cjs.map +1 -1
- package/dist/workflow/index.js +0 -26
- package/dist/workflow/index.js.map +1 -1
- package/package.json +7 -1
|
@@ -0,0 +1,398 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import React__default, { SVGAttributes, SVGProps } from 'react';
|
|
3
|
+
import { AriaButtonProps } from '@react-aria/button';
|
|
4
|
+
|
|
5
|
+
type FacebookIconVariant = 'colored' | 'black' | 'white';
|
|
6
|
+
interface FacebookIconProps extends Omit<SVGAttributes<SVGSVGElement>, 'viewBox' | 'xmlns'> {
|
|
7
|
+
/**
|
|
8
|
+
* Visual variant of the icon
|
|
9
|
+
* - colored: Facebook brand colors (blue gradient)
|
|
10
|
+
* - black: Solid black
|
|
11
|
+
* - white: Solid white
|
|
12
|
+
*/
|
|
13
|
+
variant?: FacebookIconVariant;
|
|
14
|
+
/**
|
|
15
|
+
* Size of the icon in pixels
|
|
16
|
+
*/
|
|
17
|
+
size?: number;
|
|
18
|
+
/**
|
|
19
|
+
* Additional CSS class name
|
|
20
|
+
*/
|
|
21
|
+
className?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Accessible label for the icon
|
|
24
|
+
* Required for interactive icons, optional for decorative
|
|
25
|
+
*/
|
|
26
|
+
'aria-label'?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Whether the icon is decorative (hidden from screen readers)
|
|
29
|
+
*/
|
|
30
|
+
'aria-hidden'?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Click handler for interactive icons
|
|
33
|
+
*/
|
|
34
|
+
onClick?: () => void;
|
|
35
|
+
}
|
|
36
|
+
/**
|
|
37
|
+
* Facebook brand icon component with three variants
|
|
38
|
+
*
|
|
39
|
+
* @example
|
|
40
|
+
* // Colored variant (default)
|
|
41
|
+
* <FacebookIcon />
|
|
42
|
+
*
|
|
43
|
+
* @example
|
|
44
|
+
* // Black variant with custom size
|
|
45
|
+
* <FacebookIcon variant="black" size={32} />
|
|
46
|
+
*
|
|
47
|
+
* @example
|
|
48
|
+
* // Interactive icon with click handler
|
|
49
|
+
* <FacebookIcon
|
|
50
|
+
* onClick={handleClick}
|
|
51
|
+
* aria-label="Share on Facebook"
|
|
52
|
+
* style={{ cursor: 'pointer' }}
|
|
53
|
+
* />
|
|
54
|
+
*
|
|
55
|
+
* @example
|
|
56
|
+
* // Decorative icon (hidden from screen readers)
|
|
57
|
+
* <FacebookIcon aria-hidden="true" />
|
|
58
|
+
*/
|
|
59
|
+
declare function FacebookIcon({ variant, size, className, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, onClick, ...svgProps }: FacebookIconProps): react_jsx_runtime.JSX.Element;
|
|
60
|
+
declare namespace FacebookIcon {
|
|
61
|
+
var displayName: string;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
type GmailIconVariant = 'colored' | 'black' | 'white';
|
|
65
|
+
interface GmailIconProps extends Partial<AriaButtonProps> {
|
|
66
|
+
variant?: GmailIconVariant;
|
|
67
|
+
size?: number;
|
|
68
|
+
className?: string;
|
|
69
|
+
style?: React.CSSProperties;
|
|
70
|
+
'aria-label'?: string;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
declare function GmailIcon({ variant, size, className, style, 'aria-label': ariaLabel, onPress, ...ariaProps }: GmailIconProps): react_jsx_runtime.JSX.Element;
|
|
74
|
+
declare namespace GmailIcon {
|
|
75
|
+
var displayName: string;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
type InstagramVariant = 'colored' | 'black' | 'white';
|
|
79
|
+
interface InstagramIconProps extends Omit<SVGAttributes<SVGSVGElement>, 'viewBox' | 'xmlns'> {
|
|
80
|
+
/**
|
|
81
|
+
* Visual variant of the icon
|
|
82
|
+
* - colored: Instagram brand gradient (purple to yellow)
|
|
83
|
+
* - black: Solid black
|
|
84
|
+
* - white: Solid white
|
|
85
|
+
*/
|
|
86
|
+
variant?: InstagramVariant;
|
|
87
|
+
/**
|
|
88
|
+
* Size of the icon in pixels
|
|
89
|
+
*/
|
|
90
|
+
size?: number;
|
|
91
|
+
/**
|
|
92
|
+
* Additional CSS class name
|
|
93
|
+
*/
|
|
94
|
+
className?: string;
|
|
95
|
+
/**
|
|
96
|
+
* Accessible label for the icon
|
|
97
|
+
* Required for interactive icons, optional for decorative
|
|
98
|
+
*/
|
|
99
|
+
'aria-label'?: string;
|
|
100
|
+
/**
|
|
101
|
+
* Whether the icon is decorative (hidden from screen readers)
|
|
102
|
+
*/
|
|
103
|
+
'aria-hidden'?: boolean;
|
|
104
|
+
/**
|
|
105
|
+
* Click handler for interactive icons
|
|
106
|
+
*/
|
|
107
|
+
onClick?: () => void;
|
|
108
|
+
}
|
|
109
|
+
/**
|
|
110
|
+
* Instagram brand icon component with three variants
|
|
111
|
+
*
|
|
112
|
+
* @example
|
|
113
|
+
* // Colored variant (default)
|
|
114
|
+
* <InstagramIcon />
|
|
115
|
+
*
|
|
116
|
+
* @example
|
|
117
|
+
* // Black variant with custom size
|
|
118
|
+
* <InstagramIcon variant="black" size={32} />
|
|
119
|
+
*
|
|
120
|
+
* @example
|
|
121
|
+
* // Interactive icon with click handler
|
|
122
|
+
* <InstagramIcon
|
|
123
|
+
* onClick={handleClick}
|
|
124
|
+
* aria-label="Share on Instagram"
|
|
125
|
+
* style={{ cursor: 'pointer' }}
|
|
126
|
+
* />
|
|
127
|
+
*
|
|
128
|
+
* @example
|
|
129
|
+
* // Decorative icon (hidden from screen readers)
|
|
130
|
+
* <InstagramIcon aria-hidden="true" />
|
|
131
|
+
*/
|
|
132
|
+
declare function InstagramIcon({ variant, size, className, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, onClick, ...svgProps }: InstagramIconProps): react_jsx_runtime.JSX.Element;
|
|
133
|
+
declare namespace InstagramIcon {
|
|
134
|
+
var displayName: string;
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
type LinkedInIconVariant = 'colored' | 'black' | 'white';
|
|
138
|
+
interface LinkedInIconProps extends Partial<AriaButtonProps> {
|
|
139
|
+
variant?: LinkedInIconVariant;
|
|
140
|
+
size?: number;
|
|
141
|
+
className?: string;
|
|
142
|
+
'aria-label'?: string;
|
|
143
|
+
}
|
|
144
|
+
declare function LinkedInIcon({ variant, size, className, 'aria-label': ariaLabel, onPress, ...ariaProps }: LinkedInIconProps): react_jsx_runtime.JSX.Element;
|
|
145
|
+
declare namespace LinkedInIcon {
|
|
146
|
+
var displayName: string;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
type PostizIconVariant = 'colored' | 'black' | 'white';
|
|
150
|
+
interface PostizIconProps extends Partial<AriaButtonProps> {
|
|
151
|
+
variant?: PostizIconVariant;
|
|
152
|
+
size?: number;
|
|
153
|
+
className?: string;
|
|
154
|
+
style?: React.CSSProperties;
|
|
155
|
+
'aria-label'?: string;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
/**
|
|
159
|
+
* Postiz logo - Official Postiz social media scheduling platform logo
|
|
160
|
+
* Brand colors: Purple (#612bd3), Dark (#131019), White (#fff)
|
|
161
|
+
*/
|
|
162
|
+
declare function PostizIcon({ variant, size, className, style, 'aria-label': ariaLabel, onPress, ...ariaProps }: PostizIconProps): react_jsx_runtime.JSX.Element;
|
|
163
|
+
declare namespace PostizIcon {
|
|
164
|
+
var displayName: string;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
type RedditIconVariant = 'colored' | 'black' | 'white';
|
|
168
|
+
interface RedditIconProps extends Omit<SVGAttributes<SVGSVGElement>, 'viewBox' | 'fill' | 'xmlns'> {
|
|
169
|
+
/** Visual variant of the icon */
|
|
170
|
+
variant?: RedditIconVariant;
|
|
171
|
+
/** Size of the icon in pixels */
|
|
172
|
+
size?: number;
|
|
173
|
+
/** Additional CSS class */
|
|
174
|
+
className?: string;
|
|
175
|
+
/** Click handler for interactive icons */
|
|
176
|
+
onClick?: () => void;
|
|
177
|
+
/** Accessible label for screen readers */
|
|
178
|
+
'aria-label'?: string;
|
|
179
|
+
}
|
|
180
|
+
declare function RedditIcon({ variant, size, className, onClick, 'aria-label': ariaLabel, ...svgProps }: RedditIconProps): react_jsx_runtime.JSX.Element;
|
|
181
|
+
declare namespace RedditIcon {
|
|
182
|
+
var displayName: string;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
type SlackIconVariant = 'colored' | 'black' | 'white';
|
|
186
|
+
interface SlackIconProps {
|
|
187
|
+
variant?: SlackIconVariant;
|
|
188
|
+
size?: number;
|
|
189
|
+
className?: string;
|
|
190
|
+
onClick?: (event: React__default.MouseEvent<SVGSVGElement>) => void;
|
|
191
|
+
'aria-label'?: string;
|
|
192
|
+
}
|
|
193
|
+
declare function SlackIcon({ variant, size, className, onClick, 'aria-label': ariaLabel, }: SlackIconProps): react_jsx_runtime.JSX.Element;
|
|
194
|
+
declare namespace SlackIcon {
|
|
195
|
+
var displayName: string;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
type TelegramIconVariant = 'colored' | 'black' | 'white';
|
|
199
|
+
interface TelegramIconProps extends Omit<SVGAttributes<SVGSVGElement>, 'viewBox' | 'xmlns'> {
|
|
200
|
+
/**
|
|
201
|
+
* Visual variant of the icon
|
|
202
|
+
* - colored: Telegram brand colors (blue gradient)
|
|
203
|
+
* - black: Solid black
|
|
204
|
+
* - white: Solid white
|
|
205
|
+
*/
|
|
206
|
+
variant?: TelegramIconVariant;
|
|
207
|
+
/**
|
|
208
|
+
* Size of the icon in pixels
|
|
209
|
+
*/
|
|
210
|
+
size?: number;
|
|
211
|
+
/**
|
|
212
|
+
* Additional CSS class name
|
|
213
|
+
*/
|
|
214
|
+
className?: string;
|
|
215
|
+
/**
|
|
216
|
+
* Accessible label for the icon
|
|
217
|
+
* Required for interactive icons, optional for decorative
|
|
218
|
+
*/
|
|
219
|
+
'aria-label'?: string;
|
|
220
|
+
/**
|
|
221
|
+
* Whether the icon is decorative (hidden from screen readers)
|
|
222
|
+
*/
|
|
223
|
+
'aria-hidden'?: boolean;
|
|
224
|
+
/**
|
|
225
|
+
* Click handler for interactive icons
|
|
226
|
+
*/
|
|
227
|
+
onClick?: () => void;
|
|
228
|
+
}
|
|
229
|
+
/**
|
|
230
|
+
* Telegram brand icon component with three variants
|
|
231
|
+
*
|
|
232
|
+
* Features:
|
|
233
|
+
* - Three variants: colored (gradient), black, and white
|
|
234
|
+
* - Customizable size (default 24px)
|
|
235
|
+
* - Accessible with proper ARIA attributes
|
|
236
|
+
* - Works as both decorative and interactive elements
|
|
237
|
+
* - Inline SVG for optimal performance
|
|
238
|
+
*
|
|
239
|
+
* @example
|
|
240
|
+
* // Colored variant (default)
|
|
241
|
+
* <TelegramIcon />
|
|
242
|
+
*
|
|
243
|
+
* @example
|
|
244
|
+
* // Black variant with custom size
|
|
245
|
+
* <TelegramIcon variant="black" size={32} />
|
|
246
|
+
*
|
|
247
|
+
* @example
|
|
248
|
+
* // Interactive icon with click handler
|
|
249
|
+
* <TelegramIcon
|
|
250
|
+
* onClick={handleClick}
|
|
251
|
+
* aria-label="Share on Telegram"
|
|
252
|
+
* style={{ cursor: 'pointer' }}
|
|
253
|
+
* />
|
|
254
|
+
*
|
|
255
|
+
* @example
|
|
256
|
+
* // Decorative icon (hidden from screen readers)
|
|
257
|
+
* <TelegramIcon aria-hidden="true" />
|
|
258
|
+
*/
|
|
259
|
+
declare function TelegramIcon({ variant, size, className, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, onClick, ...svgProps }: TelegramIconProps): react_jsx_runtime.JSX.Element;
|
|
260
|
+
declare namespace TelegramIcon {
|
|
261
|
+
var displayName: string;
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
type WhatsAppIconVariant = 'colored' | 'black' | 'white';
|
|
265
|
+
interface WhatsAppIconProps extends Omit<SVGProps<SVGSVGElement>, 'children'> {
|
|
266
|
+
/**
|
|
267
|
+
* Visual variant of the icon
|
|
268
|
+
* - colored: Green WhatsApp brand color (#25D366) on white background
|
|
269
|
+
* - black: Solid black icon
|
|
270
|
+
* - white: Solid white icon
|
|
271
|
+
* @default 'colored'
|
|
272
|
+
*/
|
|
273
|
+
variant?: WhatsAppIconVariant;
|
|
274
|
+
/**
|
|
275
|
+
* Size of the icon in pixels
|
|
276
|
+
* @default 24
|
|
277
|
+
*/
|
|
278
|
+
size?: number;
|
|
279
|
+
/**
|
|
280
|
+
* Additional CSS class name
|
|
281
|
+
*/
|
|
282
|
+
className?: string;
|
|
283
|
+
/**
|
|
284
|
+
* Accessible label for the icon
|
|
285
|
+
* Required for interactive icons, optional for decorative ones
|
|
286
|
+
*/
|
|
287
|
+
'aria-label'?: string;
|
|
288
|
+
/**
|
|
289
|
+
* Whether the icon is decorative only (hidden from screen readers)
|
|
290
|
+
* @default false
|
|
291
|
+
*/
|
|
292
|
+
'aria-hidden'?: boolean;
|
|
293
|
+
/**
|
|
294
|
+
* Click handler for interactive icons
|
|
295
|
+
*/
|
|
296
|
+
onClick?: () => void;
|
|
297
|
+
}
|
|
298
|
+
/**
|
|
299
|
+
* WhatsApp brand icon component with three visual variants.
|
|
300
|
+
* Built with accessibility in mind - supports both decorative and interactive use cases.
|
|
301
|
+
*
|
|
302
|
+
* @example
|
|
303
|
+
* ```tsx
|
|
304
|
+
* // Decorative icon
|
|
305
|
+
* <WhatsAppIcon variant="colored" aria-hidden />
|
|
306
|
+
*
|
|
307
|
+
* // Interactive icon (button/link)
|
|
308
|
+
* <WhatsAppIcon
|
|
309
|
+
* variant="white"
|
|
310
|
+
* aria-label="Share on WhatsApp"
|
|
311
|
+
* onClick={handleShare}
|
|
312
|
+
* />
|
|
313
|
+
*
|
|
314
|
+
* // Custom size
|
|
315
|
+
* <WhatsAppIcon size={32} variant="black" />
|
|
316
|
+
* ```
|
|
317
|
+
*/
|
|
318
|
+
declare function WhatsAppIcon({ variant, size, className, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, onClick, ...svgProps }: WhatsAppIconProps): react_jsx_runtime.JSX.Element;
|
|
319
|
+
declare namespace WhatsAppIcon {
|
|
320
|
+
var displayName: string;
|
|
321
|
+
}
|
|
322
|
+
|
|
323
|
+
type XIconVariant = 'colored' | 'black' | 'white';
|
|
324
|
+
interface XIconProps {
|
|
325
|
+
/**
|
|
326
|
+
* The variant of the X icon to display
|
|
327
|
+
* @default 'colored'
|
|
328
|
+
*/
|
|
329
|
+
variant?: XIconVariant;
|
|
330
|
+
/**
|
|
331
|
+
* The size of the icon in pixels
|
|
332
|
+
* @default 24
|
|
333
|
+
*/
|
|
334
|
+
size?: number;
|
|
335
|
+
/**
|
|
336
|
+
* Additional CSS class name
|
|
337
|
+
*/
|
|
338
|
+
className?: string;
|
|
339
|
+
/**
|
|
340
|
+
* Click handler for interactive icons
|
|
341
|
+
*/
|
|
342
|
+
onClick?: (event: React__default.MouseEvent<SVGSVGElement>) => void;
|
|
343
|
+
/**
|
|
344
|
+
* Accessible label for the icon
|
|
345
|
+
* If not provided and icon is interactive, defaults to "X (formerly Twitter) icon"
|
|
346
|
+
*/
|
|
347
|
+
'aria-label'?: string;
|
|
348
|
+
/**
|
|
349
|
+
* Whether the icon is purely decorative (will hide from screen readers)
|
|
350
|
+
* @default false
|
|
351
|
+
*/
|
|
352
|
+
decorative?: boolean;
|
|
353
|
+
}
|
|
354
|
+
/**
|
|
355
|
+
* XIcon component - Displays the X (formerly Twitter) icon with three variants
|
|
356
|
+
*
|
|
357
|
+
* This component renders the X social media icon with support for colored (black),
|
|
358
|
+
* explicit black, and white variants. It's fully accessible and can be used as both
|
|
359
|
+
* a decorative element and an interactive button.
|
|
360
|
+
*
|
|
361
|
+
* @example
|
|
362
|
+
* ```tsx
|
|
363
|
+
* // Colored variant (default, black)
|
|
364
|
+
* <XIcon />
|
|
365
|
+
*
|
|
366
|
+
* // White variant for dark backgrounds
|
|
367
|
+
* <XIcon variant="white" size={32} />
|
|
368
|
+
*
|
|
369
|
+
* // Interactive icon with click handler
|
|
370
|
+
* <XIcon
|
|
371
|
+
* variant="colored"
|
|
372
|
+
* onClick={() => window.open('https://x.com/yourhandle')}
|
|
373
|
+
* aria-label="Visit our X profile"
|
|
374
|
+
* />
|
|
375
|
+
*
|
|
376
|
+
* // Decorative icon (hidden from screen readers)
|
|
377
|
+
* <XIcon decorative />
|
|
378
|
+
* ```
|
|
379
|
+
*/
|
|
380
|
+
declare function XIcon({ variant, size, className, onClick, 'aria-label': ariaLabel, decorative, }: XIconProps): react_jsx_runtime.JSX.Element;
|
|
381
|
+
declare namespace XIcon {
|
|
382
|
+
var displayName: string;
|
|
383
|
+
}
|
|
384
|
+
|
|
385
|
+
type YouTubeIconVariant = 'colored' | 'black' | 'white';
|
|
386
|
+
interface YouTubeIconProps {
|
|
387
|
+
variant?: YouTubeIconVariant;
|
|
388
|
+
size?: number;
|
|
389
|
+
className?: string;
|
|
390
|
+
onClick?: () => void;
|
|
391
|
+
'aria-label'?: string;
|
|
392
|
+
}
|
|
393
|
+
declare function YouTubeIcon({ variant, size, className, onClick, 'aria-label': ariaLabel, }: YouTubeIconProps): react_jsx_runtime.JSX.Element;
|
|
394
|
+
declare namespace YouTubeIcon {
|
|
395
|
+
var displayName: string;
|
|
396
|
+
}
|
|
397
|
+
|
|
398
|
+
export { type FacebookIconProps as F, type GmailIconProps as G, type InstagramIconProps as I, type LinkedInIconProps as L, type PostizIconProps as P, type RedditIconProps as R, type SlackIconProps as S, type TelegramIconProps as T, type WhatsAppIconProps as W, type XIconProps as X, type YouTubeIconProps as Y, type FacebookIconVariant as a, FacebookIcon as b, type GmailIconVariant as c, GmailIcon as d, type InstagramVariant as e, InstagramIcon as f, type LinkedInIconVariant as g, LinkedInIcon as h, type PostizIconVariant as i, PostizIcon as j, type RedditIconVariant as k, RedditIcon as l, type SlackIconVariant as m, SlackIcon as n, type TelegramIconVariant as o, TelegramIcon as p, type WhatsAppIconVariant as q, WhatsAppIcon as r, type XIconVariant as s, XIcon as t, type YouTubeIconVariant as u, YouTubeIcon as v };
|
|
@@ -18,50 +18,32 @@ var styled9__default = /*#__PURE__*/_interopDefault(styled9);
|
|
|
18
18
|
// src/theme/tokens.ts
|
|
19
19
|
var tokens = {
|
|
20
20
|
colors: {
|
|
21
|
-
// Brand colors
|
|
22
21
|
primary: "#2CB0AB",
|
|
23
|
-
// Teal (main brand color)
|
|
24
22
|
secondary: "#264E68",
|
|
25
|
-
// Deep Blue
|
|
26
23
|
accent: "#459FB9",
|
|
27
|
-
// Sea Green (additional brand color)
|
|
28
|
-
// Backgrounds - dark theme optimized
|
|
29
24
|
background: {
|
|
30
25
|
darkest: "#0a1b2a",
|
|
31
|
-
// Darkest Blue (brand color)
|
|
32
26
|
darker: "#151a26",
|
|
33
|
-
// Discord gray (preserved)
|
|
34
27
|
dark: "#1b2230",
|
|
35
|
-
// Discord surface gray (preserved)
|
|
36
28
|
light: "#252d3d"
|
|
37
|
-
// Discord border gray (preserved)
|
|
38
29
|
},
|
|
39
|
-
// Text hierarchy
|
|
40
30
|
text: {
|
|
41
31
|
primary: "#FFFFFF",
|
|
42
32
|
secondary: "#B4B8C5",
|
|
43
33
|
tertiary: "#9CA3AF",
|
|
44
34
|
disabled: "#4B5563"
|
|
45
35
|
},
|
|
46
|
-
// Teal (brand aligned)
|
|
47
36
|
error: "#EF4444",
|
|
48
|
-
// Sky Blue (brand aligned)
|
|
49
|
-
// Status colors (for workflow/SSE events)
|
|
50
37
|
status: {
|
|
51
38
|
idle: "#6B7280",
|
|
52
39
|
running: "#459FB9",
|
|
53
|
-
// Teal (brand aligned)
|
|
54
40
|
failed: "#EF4444"},
|
|
55
|
-
// Connection status
|
|
56
41
|
connection: {
|
|
57
42
|
connected: "#2CB0AB",
|
|
58
|
-
// Teal (brand aligned)
|
|
59
43
|
streaming: "#459FB9",
|
|
60
|
-
// Sky Blue (brand aligned)
|
|
61
44
|
disconnected: "#EF4444",
|
|
62
45
|
reconnecting: "#F59E0B"
|
|
63
46
|
},
|
|
64
|
-
// Surface variants (for overlays, cards, panels)
|
|
65
47
|
surface: {
|
|
66
48
|
base: "#1b2230",
|
|
67
49
|
elevated: "#252d3d",
|
|
@@ -71,26 +53,20 @@ var tokens = {
|
|
|
71
53
|
glass: "rgba(255, 255, 255, 0.26)",
|
|
72
54
|
glassBorder: "rgba(255, 255, 255, 0.3)"
|
|
73
55
|
},
|
|
74
|
-
// UI Element colors
|
|
75
56
|
border: {
|
|
76
57
|
default: "rgba(255, 255, 255, 0.1)",
|
|
77
58
|
subtle: "rgba(255, 255, 255, 0.05)",
|
|
78
59
|
hover: "rgba(255, 255, 255, 0.2)",
|
|
79
60
|
focus: "#2CB0AB"},
|
|
80
|
-
// Scrollbar colors
|
|
81
61
|
scrollbar: {
|
|
82
62
|
track: "transparent",
|
|
83
63
|
thumb: "rgba(255, 255, 255, 0.2)",
|
|
84
64
|
thumbHover: "rgba(255, 255, 255, 0.3)"
|
|
85
65
|
},
|
|
86
|
-
// Message bubbles
|
|
87
66
|
message: {
|
|
88
67
|
user: "#264E68",
|
|
89
|
-
// Deep Blue (brand color)
|
|
90
68
|
ai: "#1b2230",
|
|
91
|
-
// Dark background
|
|
92
69
|
system: "#151a26"
|
|
93
|
-
// Darker background
|
|
94
70
|
},
|
|
95
71
|
backdrop: "rgba(27, 34, 48, 0.95)"},
|
|
96
72
|
typography: {
|
|
@@ -100,13 +76,9 @@ var tokens = {
|
|
|
100
76
|
},
|
|
101
77
|
fontSize: {
|
|
102
78
|
xs: "0.875rem",
|
|
103
|
-
// 14px (was 12px, increased for better readability)
|
|
104
79
|
sm: "1rem",
|
|
105
|
-
// 16px (was 14px, increased for better readability)
|
|
106
80
|
base: "1.125rem",
|
|
107
|
-
// 18px (was 16px, increased for better readability)
|
|
108
81
|
lg: "1.125rem",
|
|
109
|
-
// 20px (heading size, unchanged)
|
|
110
82
|
"2xl": "1.5rem"},
|
|
111
83
|
fontWeight: {
|
|
112
84
|
regular: 400,
|
|
@@ -120,28 +92,18 @@ var tokens = {
|
|
|
120
92
|
},
|
|
121
93
|
spacing: {
|
|
122
94
|
xs: "0.25rem",
|
|
123
|
-
// 4px
|
|
124
95
|
sm: "0.5rem",
|
|
125
|
-
// 8px
|
|
126
96
|
md: "1rem",
|
|
127
|
-
// 16px
|
|
128
97
|
lg: "1.5rem",
|
|
129
|
-
// 24px
|
|
130
98
|
xl: "2rem"},
|
|
131
99
|
borderRadius: {
|
|
132
100
|
none: "0",
|
|
133
101
|
sm: "0.25rem",
|
|
134
|
-
// 4px
|
|
135
102
|
md: "0.5rem",
|
|
136
|
-
// 8px
|
|
137
103
|
lg: "0.75rem",
|
|
138
|
-
// 12px
|
|
139
104
|
xl: "1rem",
|
|
140
|
-
// 16px
|
|
141
105
|
"2xl": "1.5rem",
|
|
142
|
-
// 24px
|
|
143
106
|
full: "9999px"
|
|
144
|
-
// Fully rounded
|
|
145
107
|
},
|
|
146
108
|
shadows: {
|
|
147
109
|
none: "none",
|
|
@@ -3491,7 +3453,6 @@ function CustomCopilotSidebar2({
|
|
|
3491
3453
|
Header: HeaderAdapterWithClose,
|
|
3492
3454
|
Window: WindowAdapter,
|
|
3493
3455
|
Button: CustomButton,
|
|
3494
|
-
RenderActionExecutionMessage: ActionExecutionAdapter,
|
|
3495
3456
|
instructions,
|
|
3496
3457
|
labels: {
|
|
3497
3458
|
title: "AI Assistant",
|
|
@@ -4320,6 +4281,10 @@ function SuggestionChip({ suggestion, onSelect }) {
|
|
|
4320
4281
|
}
|
|
4321
4282
|
Suggestions.displayName = "Suggestions";
|
|
4322
4283
|
|
|
4284
|
+
Object.defineProperty(exports, "useChatContext", {
|
|
4285
|
+
enumerable: true,
|
|
4286
|
+
get: function () { return reactUi.useChatContext; }
|
|
4287
|
+
});
|
|
4323
4288
|
exports.ActionExecutionAdapter = ActionExecutionAdapter;
|
|
4324
4289
|
exports.Actions = Actions;
|
|
4325
4290
|
exports.AgentState = AgentState;
|