@agentiffai/design 1.3.28 → 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.
@@ -1,9 +1,575 @@
1
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
1
2
  import { useId, useRef } from 'react';
2
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
3
3
  import { useButton } from '@react-aria/button';
4
4
  import styled from 'styled-components';
5
5
 
6
- // src/components/icons/FacebookIcon/FacebookIcon.tsx
6
+ // src/components/icons/AirtableIcon/AirtableIcon.tsx
7
+ function SvgWrapper({
8
+ size,
9
+ className,
10
+ onClick,
11
+ ariaLabel,
12
+ children
13
+ }) {
14
+ return /* @__PURE__ */ jsx(
15
+ "svg",
16
+ {
17
+ width: size,
18
+ height: size,
19
+ viewBox: "0 0 176 148",
20
+ fill: "none",
21
+ xmlns: "http://www.w3.org/2000/svg",
22
+ className,
23
+ onClick,
24
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
25
+ "aria-label": ariaLabel,
26
+ tabIndex: onClick ? 0 : void 0,
27
+ onKeyDown: onClick ? (e) => {
28
+ if (e.key === "Enter" || e.key === " ") {
29
+ e.preventDefault();
30
+ onClick(e);
31
+ }
32
+ } : void 0,
33
+ children
34
+ }
35
+ );
36
+ }
37
+ var AirtableIconColored = ({
38
+ size = 24,
39
+ className,
40
+ onClick,
41
+ "aria-label": ariaLabel
42
+ }) => /* @__PURE__ */ jsxs(SvgWrapper, { size, className, onClick, ariaLabel, children: [
43
+ /* @__PURE__ */ jsx(
44
+ "path",
45
+ {
46
+ fill: "#FCB400",
47
+ d: "M79 1.867L13.04 29.16c-3.668 1.518-3.63 6.729.061 8.192l66.235 26.266a24.575 24.575 0 0 0 18.12 0l66.236-26.267c3.69-1.462 3.73-6.672.06-8.19L97.794 1.866a24.578 24.578 0 0 0-18.795 0"
48
+ }
49
+ ),
50
+ /* @__PURE__ */ jsx(
51
+ "path",
52
+ {
53
+ fill: "#18BFFF",
54
+ d: "M94.273 77.96v65.617c0 3.12 3.147 5.258 6.048 4.108l73.806-28.648a4.418 4.418 0 0 0 2.79-4.108V49.313c0-3.121-3.147-5.258-6.048-4.108L97.063 73.853a4.42 4.42 0 0 0-2.79 4.108"
55
+ }
56
+ ),
57
+ /* @__PURE__ */ jsx(
58
+ "path",
59
+ {
60
+ fill: "#F82B60",
61
+ d: "M77.038 81.346L55.134 91.922l-2.224 1.075-46.238 22.155C3.742 116.566 0 114.43 0 111.174V49.588c0-1.178.604-2.195 1.414-2.96a5.024 5.024 0 0 1 1.12-.84c1.104-.663 2.68-.84 4.02-.31L76.67 73.26c3.564 1.414 3.844 6.408.368 8.087"
62
+ }
63
+ ),
64
+ /* @__PURE__ */ jsx(
65
+ "path",
66
+ {
67
+ fill: "rgba(0, 0, 0, 0.25)",
68
+ d: "M77.038 81.346L55.134 91.922 1.414 46.627a5.024 5.024 0 0 1 1.12-.839c1.104-.663 2.68-.84 4.02-.31L76.67 73.26c3.564 1.414 3.844 6.408.368 8.087"
69
+ }
70
+ )
71
+ ] });
72
+ function MonoIcon({
73
+ size = 24,
74
+ fill,
75
+ className,
76
+ onClick,
77
+ ariaLabel
78
+ }) {
79
+ return /* @__PURE__ */ jsxs(SvgWrapper, { size, className, onClick, ariaLabel, children: [
80
+ /* @__PURE__ */ jsx(
81
+ "path",
82
+ {
83
+ fill,
84
+ d: "M79 1.867L13.04 29.16c-3.668 1.518-3.63 6.729.061 8.192l66.235 26.266a24.575 24.575 0 0 0 18.12 0l66.236-26.267c3.69-1.462 3.73-6.672.06-8.19L97.794 1.866a24.578 24.578 0 0 0-18.795 0"
85
+ }
86
+ ),
87
+ /* @__PURE__ */ jsx(
88
+ "path",
89
+ {
90
+ fill,
91
+ d: "M94.273 77.96v65.617c0 3.12 3.147 5.258 6.048 4.108l73.806-28.648a4.418 4.418 0 0 0 2.79-4.108V49.313c0-3.121-3.147-5.258-6.048-4.108L97.063 73.853a4.42 4.42 0 0 0-2.79 4.108"
92
+ }
93
+ ),
94
+ /* @__PURE__ */ jsx(
95
+ "path",
96
+ {
97
+ fill,
98
+ d: "M77.038 81.346L55.134 91.922l-2.224 1.075-46.238 22.155C3.742 116.566 0 114.43 0 111.174V49.588c0-1.178.604-2.195 1.414-2.96a5.024 5.024 0 0 1 1.12-.84c1.104-.663 2.68-.84 4.02-.31L76.67 73.26c3.564 1.414 3.844 6.408.368 8.087"
99
+ }
100
+ )
101
+ ] });
102
+ }
103
+ function AirtableIcon({
104
+ variant = "colored",
105
+ size = 24,
106
+ className,
107
+ onClick,
108
+ "aria-label": ariaLabel = "Airtable icon"
109
+ }) {
110
+ const iconProps = {
111
+ size,
112
+ className,
113
+ onClick,
114
+ "aria-label": ariaLabel
115
+ };
116
+ if (variant === "colored") {
117
+ return /* @__PURE__ */ jsx(AirtableIconColored, { ...iconProps });
118
+ }
119
+ const fill = variant === "black" ? "black" : "white";
120
+ return /* @__PURE__ */ jsx(
121
+ MonoIcon,
122
+ {
123
+ size,
124
+ fill,
125
+ className,
126
+ onClick,
127
+ ariaLabel
128
+ }
129
+ );
130
+ }
131
+ AirtableIcon.displayName = "AirtableIcon";
132
+ var svgPath = "M21.997 18.23c0 .727-.405 2.127-1.315 2.896-.182.14-.364.061-.284-.143.265-.648.871-2.147.587-2.492-.201-.262-1.031-.242-1.739-.182-.323.041-.607.06-.827.105-.204.016-.245-.163-.041-.303a3.1 3.1 0 0 1 .87-.428c1.15-.344 2.479-.137 2.67.083.036.042.079.16.079.463m-1.922 1.294a7.4 7.4 0 0 1-.829.55c-2.122 1.275-4.871 1.943-7.258 1.943-3.843 0-7.28-1.417-9.888-3.788-.224-.182-.039-.446.223-.303 2.81 1.64 6.288 2.632 9.888 2.632 2.266 0 4.708-.424 7.035-1.336.163-.061.345-.144.504-.202.367-.165.69.242.325.504m-6.17-11.03c0-1.041.042-1.654-.303-2.18-.306-.433-.833-.693-1.569-.652-.798.044-1.655.567-1.873 1.526-.043.22-.171.436-.437.483l-2.435-.31c-.174-.04-.439-.173-.352-.521C7.459 4.088 9.81 3.129 12.034 3h.522c1.22 0 2.788.349 3.791 1.264 1.217 1.136 1.087 2.662 1.087 4.32v3.927c0 1.178.478 1.7.958 2.314.13.219.175.477-.044.655a78 78 0 0 1-1.917 1.654c-.175.133-.489.147-.61.045-.77-.645-.958-1.003-1.435-1.658-.83.871-1.527 1.352-2.356 1.613a7 7 0 0 1-1.784.216c-2.09 0-3.745-1.303-3.745-3.88 0-2.049 1.09-3.442 2.7-4.101 1.61-.66 3.95-.87 4.704-.874m-.477 5.192c.52-.872.477-1.586.477-3.185-.652 0-1.306.045-1.871.178-1.045.303-1.875.96-1.875 2.355 0 1.09.568 1.832 1.526 1.832q.198 0 .348-.045c.67-.186 1.088-.522 1.395-1.135";
133
+ function SvgIcon({
134
+ size = 24,
135
+ fill,
136
+ className,
137
+ onClick,
138
+ ariaLabel
139
+ }) {
140
+ return /* @__PURE__ */ jsx(
141
+ "svg",
142
+ {
143
+ width: size,
144
+ height: size,
145
+ viewBox: "0 0 24 24",
146
+ fill: "none",
147
+ xmlns: "http://www.w3.org/2000/svg",
148
+ className,
149
+ onClick,
150
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
151
+ "aria-label": ariaLabel,
152
+ tabIndex: onClick ? 0 : void 0,
153
+ onKeyDown: onClick ? (e) => {
154
+ if (e.key === "Enter" || e.key === " ") {
155
+ e.preventDefault();
156
+ onClick(e);
157
+ }
158
+ } : void 0,
159
+ children: /* @__PURE__ */ jsx("path", { fill, d: svgPath })
160
+ }
161
+ );
162
+ }
163
+ function AmazonIcon({
164
+ variant = "colored",
165
+ size = 24,
166
+ className,
167
+ onClick,
168
+ "aria-label": ariaLabel = "Amazon icon"
169
+ }) {
170
+ const fill = variant === "colored" ? "#FF9900" : variant === "black" ? "black" : "white";
171
+ return /* @__PURE__ */ jsx(
172
+ SvgIcon,
173
+ {
174
+ size,
175
+ fill,
176
+ className,
177
+ onClick,
178
+ ariaLabel
179
+ }
180
+ );
181
+ }
182
+ AmazonIcon.displayName = "AmazonIcon";
183
+ function SvgWrapper2({
184
+ size,
185
+ className,
186
+ onClick,
187
+ ariaLabel,
188
+ children
189
+ }) {
190
+ return /* @__PURE__ */ jsx(
191
+ "svg",
192
+ {
193
+ width: size,
194
+ height: size,
195
+ viewBox: "80 0 96 90",
196
+ fill: "none",
197
+ xmlns: "http://www.w3.org/2000/svg",
198
+ className,
199
+ onClick,
200
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
201
+ "aria-label": ariaLabel,
202
+ tabIndex: onClick ? 0 : void 0,
203
+ onKeyDown: onClick ? (e) => {
204
+ if (e.key === "Enter" || e.key === " ") {
205
+ e.preventDefault();
206
+ onClick(e);
207
+ }
208
+ } : void 0,
209
+ children
210
+ }
211
+ );
212
+ }
213
+ var dotsPath = "M155.733 47.358c-11.626 0-21.049 9.423-21.049 21.047 0 11.625 9.423 21.05 21.049 21.05 11.624 0 21.047-9.425 21.047-21.05 0-11.624-9.423-21.047-21.047-21.047zm-54.685.001C89.424 47.36 80 56.781 80 68.406c0 11.624 9.424 21.048 21.048 21.048 11.625 0 21.049-9.424 21.049-21.048 0-11.625-9.424-21.047-21.05-21.047zm48.39-26.311c0 11.624-9.423 21.05-21.047 21.05-11.626 0-21.049-9.426-21.049-21.05S116.765 0 128.391 0c11.624 0 21.046 9.424 21.046 21.048z";
214
+ var AsanaIconColored = ({
215
+ size = 24,
216
+ className,
217
+ onClick,
218
+ "aria-label": ariaLabel
219
+ }) => {
220
+ const uid = useId();
221
+ const gradId = `asana-grad-${uid}`;
222
+ return /* @__PURE__ */ jsxs(SvgWrapper2, { size, className, onClick, ariaLabel, children: [
223
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("radialGradient", { cy: "54.652%", fx: "50%", fy: "54.652%", r: "66.263%", id: gradId, children: [
224
+ /* @__PURE__ */ jsx("stop", { stopColor: "#FFB900", offset: "0%" }),
225
+ /* @__PURE__ */ jsx("stop", { stopColor: "#F95D8F", offset: "60%" }),
226
+ /* @__PURE__ */ jsx("stop", { stopColor: "#F95353", offset: "99.91%" })
227
+ ] }) }),
228
+ /* @__PURE__ */ jsx("path", { fill: `url(#${gradId})`, d: dotsPath })
229
+ ] });
230
+ };
231
+ function MonoIcon2({
232
+ size = 24,
233
+ fill,
234
+ className,
235
+ onClick,
236
+ ariaLabel
237
+ }) {
238
+ return /* @__PURE__ */ jsx(SvgWrapper2, { size, className, onClick, ariaLabel, children: /* @__PURE__ */ jsx("path", { fill, d: dotsPath }) });
239
+ }
240
+ function AsanaIcon({
241
+ variant = "colored",
242
+ size = 24,
243
+ className,
244
+ onClick,
245
+ "aria-label": ariaLabel = "Asana icon"
246
+ }) {
247
+ const iconProps = {
248
+ size,
249
+ className,
250
+ onClick,
251
+ "aria-label": ariaLabel
252
+ };
253
+ if (variant === "colored") {
254
+ return /* @__PURE__ */ jsx(AsanaIconColored, { ...iconProps });
255
+ }
256
+ const fill = variant === "black" ? "black" : "white";
257
+ return /* @__PURE__ */ jsx(
258
+ MonoIcon2,
259
+ {
260
+ size,
261
+ fill,
262
+ className,
263
+ onClick,
264
+ ariaLabel
265
+ }
266
+ );
267
+ }
268
+ AsanaIcon.displayName = "AsanaIcon";
269
+ var outerRingPath = "M330.23,202.5a83.62,83.62,0,0,0-34.45-14.81c0,.11,0,.2,0,.3a89.7,89.7,0,0,1-5,17.45,65.58,65.58,0,0,1,28.48,11.73c0,.08-.05.18-.08.27a153.57,153.57,0,1,1,0-90.63c0,.09.05.19.08.27a65.45,65.45,0,0,1-28.48,11.72,90.3,90.3,0,0,1,5,17.47,2.33,2.33,0,0,0,0,.28,83.6,83.6,0,0,0,34.45-14.8c9.82-7.27,7.92-15.48,6.43-20.34a172.13,172.13,0,1,0,0,101.43c1.49-4.86,3.39-13.07-6.43-20.34";
270
+ var middleShapePath = "M231.58,223.23C220.65,232.93,207,245,182.25,245h-14.8c-17.91,0-34.2-6.51-45.86-18.31-11.39-11.53-17.66-27.31-17.66-44.44V162c0-17.13,6.27-32.91,17.66-44.44,11.66-11.8,27.95-18.3,45.86-18.3h14.8c24.78,0,38.4,12.06,49.33,21.76,11.35,10,21.14,18.74,47.25,18.74a75.11,75.11,0,0,0,11.89-.95l-.09-.23a89.53,89.53,0,0,0-5.49-11.28L267.69,97.07a89.65,89.65,0,0,0-77.64-44.82H155.14A89.65,89.65,0,0,0,77.5,97.07L60.05,127.3a89.67,89.67,0,0,0,0,89.65L77.5,247.18A89.65,89.65,0,0,0,155.14,292h34.91a89.65,89.65,0,0,0,77.64-44.82L285.14,217a89.53,89.53,0,0,0,5.49-11.28l.09-.22a74,74,0,0,0-11.89-1c-26.11,0-35.9,8.69-47.25,18.74";
271
+ var innerShapePath = "M182.25,117.61h-14.8c-27.26,0-45.17,19.47-45.17,44.39v20.25c0,24.92,17.91,44.39,45.17,44.39h14.8c39.72,0,36.6-40.5,96.58-40.5a91.64,91.64,0,0,1,16.94,1.56,89.54,89.54,0,0,0,0-31.15,92.51,92.51,0,0,1-16.94,1.56c-60,0-56.86-40.5-96.58-40.5";
272
+ var overlayPath = "M290.72,138.8a74,74,0,0,1-11.89,1c-26.11,0-35.9-8.69-47.24-18.74-10.94-9.7-24.56-21.77-49.34-21.77h-14.8c-17.92,0-34.2,6.51-45.86,18.31-11.39,11.53-17.66,27.31-17.66,44.44v20.25c0,17.13,6.27,32.91,17.66,44.44,11.66,11.8,27.94,18.3,45.86,18.3h14.8c24.78,0,38.4-12.06,49.34-21.76,11.34-10,21.13-18.74,47.24-18.74a75.11,75.11,0,0,1,11.89.95,89,89,0,0,0,5-17.45,2.68,2.68,0,0,0,0-.3,92.51,92.51,0,0,0-16.94-1.55c-60,0-56.86,40.51-96.58,40.51h-14.8c-27.26,0-45.17-19.48-45.17-44.4V162c0-24.92,17.91-44.39,45.17-44.39h14.8c39.72,0,36.6,40.49,96.58,40.49a91.64,91.64,0,0,0,16.94-1.55c0-.09,0-.18,0-.28a90.3,90.3,0,0,0-5-17.47";
273
+ function CalendlyIconColored({
274
+ size = 24,
275
+ className,
276
+ onClick,
277
+ ariaLabel
278
+ }) {
279
+ return /* @__PURE__ */ jsxs(
280
+ "svg",
281
+ {
282
+ width: size,
283
+ height: size,
284
+ viewBox: "0 0 360 360",
285
+ fill: "none",
286
+ xmlns: "http://www.w3.org/2000/svg",
287
+ className,
288
+ onClick,
289
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
290
+ "aria-label": ariaLabel,
291
+ tabIndex: onClick ? 0 : void 0,
292
+ onKeyDown: onClick ? (e) => {
293
+ if (e.key === "Enter" || e.key === " ") {
294
+ e.preventDefault();
295
+ onClick(e);
296
+ }
297
+ } : void 0,
298
+ children: [
299
+ /* @__PURE__ */ jsx("path", { fill: "#006BFF", d: outerRingPath }),
300
+ /* @__PURE__ */ jsx("path", { fill: "#006BFF", d: middleShapePath }),
301
+ /* @__PURE__ */ jsx("path", { fill: "#006BFF", d: innerShapePath }),
302
+ /* @__PURE__ */ jsx("path", { fill: "#0AE8F0", d: overlayPath })
303
+ ]
304
+ }
305
+ );
306
+ }
307
+ function SvgIconMono({
308
+ size = 24,
309
+ fill,
310
+ className,
311
+ onClick,
312
+ ariaLabel
313
+ }) {
314
+ return /* @__PURE__ */ jsxs(
315
+ "svg",
316
+ {
317
+ width: size,
318
+ height: size,
319
+ viewBox: "0 0 360 360",
320
+ fill: "none",
321
+ xmlns: "http://www.w3.org/2000/svg",
322
+ className,
323
+ onClick,
324
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
325
+ "aria-label": ariaLabel,
326
+ tabIndex: onClick ? 0 : void 0,
327
+ onKeyDown: onClick ? (e) => {
328
+ if (e.key === "Enter" || e.key === " ") {
329
+ e.preventDefault();
330
+ onClick(e);
331
+ }
332
+ } : void 0,
333
+ children: [
334
+ /* @__PURE__ */ jsx("path", { fill, d: outerRingPath }),
335
+ /* @__PURE__ */ jsx("path", { fill, d: middleShapePath }),
336
+ /* @__PURE__ */ jsx("path", { fill, d: innerShapePath }),
337
+ /* @__PURE__ */ jsx("path", { fill, opacity: "0.7", d: overlayPath })
338
+ ]
339
+ }
340
+ );
341
+ }
342
+ function CalendlyIcon({
343
+ variant = "colored",
344
+ size = 24,
345
+ className,
346
+ onClick,
347
+ "aria-label": ariaLabel = "Calendly icon"
348
+ }) {
349
+ if (variant === "colored") {
350
+ return /* @__PURE__ */ jsx(
351
+ CalendlyIconColored,
352
+ {
353
+ size,
354
+ className,
355
+ onClick,
356
+ ariaLabel
357
+ }
358
+ );
359
+ }
360
+ const fill = variant === "black" ? "black" : "white";
361
+ return /* @__PURE__ */ jsx(
362
+ SvgIconMono,
363
+ {
364
+ size,
365
+ fill,
366
+ className,
367
+ onClick,
368
+ ariaLabel
369
+ }
370
+ );
371
+ }
372
+ CalendlyIcon.displayName = "CalendlyIcon";
373
+ function SvgWrapper3({
374
+ size,
375
+ className,
376
+ onClick,
377
+ ariaLabel,
378
+ children
379
+ }) {
380
+ return /* @__PURE__ */ jsx(
381
+ "svg",
382
+ {
383
+ width: size,
384
+ height: size,
385
+ viewBox: "5 2 28 34",
386
+ fill: "none",
387
+ xmlns: "http://www.w3.org/2000/svg",
388
+ className,
389
+ onClick,
390
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
391
+ "aria-label": ariaLabel,
392
+ tabIndex: onClick ? 0 : void 0,
393
+ onKeyDown: onClick ? (e) => {
394
+ if (e.key === "Enter" || e.key === " ") {
395
+ e.preventDefault();
396
+ onClick(e);
397
+ }
398
+ } : void 0,
399
+ children
400
+ }
401
+ );
402
+ }
403
+ var ClickUpIconColored = ({
404
+ size = 24,
405
+ className,
406
+ onClick,
407
+ "aria-label": ariaLabel
408
+ }) => {
409
+ const uid = useId();
410
+ const gradA = `clickup-a-${uid}`;
411
+ const gradB = `clickup-b-${uid}`;
412
+ return /* @__PURE__ */ jsxs(SvgWrapper3, { size, className, onClick, ariaLabel, children: [
413
+ /* @__PURE__ */ jsxs("defs", { children: [
414
+ /* @__PURE__ */ jsxs(
415
+ "linearGradient",
416
+ {
417
+ id: gradA,
418
+ gradientUnits: "userSpaceOnUse",
419
+ x1: "5.615",
420
+ x2: "32.789",
421
+ y1: "31.179",
422
+ y2: "31.179",
423
+ children: [
424
+ /* @__PURE__ */ jsx("stop", { offset: "0", stopColor: "#8930fd" }),
425
+ /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#49ccf9" })
426
+ ]
427
+ }
428
+ ),
429
+ /* @__PURE__ */ jsxs(
430
+ "linearGradient",
431
+ {
432
+ id: gradB,
433
+ gradientUnits: "userSpaceOnUse",
434
+ x1: "5.941",
435
+ x2: "31.978",
436
+ y1: "13.086",
437
+ y2: "13.086",
438
+ children: [
439
+ /* @__PURE__ */ jsx("stop", { offset: "0", stopColor: "#ff02f0" }),
440
+ /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#ffc800" })
441
+ ]
442
+ }
443
+ )
444
+ ] }),
445
+ /* @__PURE__ */ jsx(
446
+ "path",
447
+ {
448
+ clipRule: "evenodd",
449
+ d: "M5.615 27.26l5.015-3.851c2.664 3.485 5.494 5.092 8.645 5.092 3.134 0 5.884-1.588 8.428-5.046l5.086 3.758c-3.67 4.986-8.232 7.62-13.514 7.62-5.265 0-9.871-2.617-13.66-7.574z",
450
+ fill: `url(#${gradA})`,
451
+ fillRule: "evenodd"
452
+ }
453
+ ),
454
+ /* @__PURE__ */ jsx(
455
+ "path",
456
+ {
457
+ clipRule: "evenodd",
458
+ d: "M18.992 10.523l-8.925 7.71-4.126-4.797 13.07-11.29 12.967 11.299-4.145 4.78z",
459
+ fill: `url(#${gradB})`,
460
+ fillRule: "evenodd"
461
+ }
462
+ )
463
+ ] });
464
+ };
465
+ function MonoIcon3({
466
+ size = 24,
467
+ fill,
468
+ className,
469
+ onClick,
470
+ ariaLabel
471
+ }) {
472
+ return /* @__PURE__ */ jsxs(SvgWrapper3, { size, className, onClick, ariaLabel, children: [
473
+ /* @__PURE__ */ jsx(
474
+ "path",
475
+ {
476
+ clipRule: "evenodd",
477
+ d: "M5.615 27.26l5.015-3.851c2.664 3.485 5.494 5.092 8.645 5.092 3.134 0 5.884-1.588 8.428-5.046l5.086 3.758c-3.67 4.986-8.232 7.62-13.514 7.62-5.265 0-9.871-2.617-13.66-7.574z",
478
+ fill,
479
+ fillRule: "evenodd"
480
+ }
481
+ ),
482
+ /* @__PURE__ */ jsx(
483
+ "path",
484
+ {
485
+ clipRule: "evenodd",
486
+ d: "M18.992 10.523l-8.925 7.71-4.126-4.797 13.07-11.29 12.967 11.299-4.145 4.78z",
487
+ fill,
488
+ fillRule: "evenodd"
489
+ }
490
+ )
491
+ ] });
492
+ }
493
+ function ClickUpIcon({
494
+ variant = "colored",
495
+ size = 24,
496
+ className,
497
+ onClick,
498
+ "aria-label": ariaLabel = "ClickUp icon"
499
+ }) {
500
+ const iconProps = {
501
+ size,
502
+ className,
503
+ onClick,
504
+ "aria-label": ariaLabel
505
+ };
506
+ if (variant === "colored") {
507
+ return /* @__PURE__ */ jsx(ClickUpIconColored, { ...iconProps });
508
+ }
509
+ const fill = variant === "black" ? "black" : "white";
510
+ return /* @__PURE__ */ jsx(
511
+ MonoIcon3,
512
+ {
513
+ size,
514
+ fill,
515
+ className,
516
+ onClick,
517
+ ariaLabel
518
+ }
519
+ );
520
+ }
521
+ ClickUpIcon.displayName = "ClickUpIcon";
522
+ var svgPath2 = "m17.285 10.668 5.215 3.323-5.252 3.346L12 13.993l-5.248 3.344L1.5 13.99l5.215-3.323L1.5 7.346 6.752 4 12 7.343 17.248 4 22.5 7.346zm-.074 0L12 7.348l-5.211 3.32L12 13.988zM6.786 18.446l5.252-3.346 5.252 3.346-5.252 3.346z";
523
+ function SvgIcon2({
524
+ size = 24,
525
+ fill,
526
+ className,
527
+ onClick,
528
+ ariaLabel
529
+ }) {
530
+ return /* @__PURE__ */ jsx(
531
+ "svg",
532
+ {
533
+ width: size,
534
+ height: size,
535
+ viewBox: "0 0 24 24",
536
+ fill: "none",
537
+ xmlns: "http://www.w3.org/2000/svg",
538
+ className,
539
+ onClick,
540
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
541
+ "aria-label": ariaLabel,
542
+ tabIndex: onClick ? 0 : void 0,
543
+ onKeyDown: onClick ? (e) => {
544
+ if (e.key === "Enter" || e.key === " ") {
545
+ e.preventDefault();
546
+ onClick(e);
547
+ }
548
+ } : void 0,
549
+ children: /* @__PURE__ */ jsx("path", { fill, d: svgPath2 })
550
+ }
551
+ );
552
+ }
553
+ function DropboxIcon({
554
+ variant = "colored",
555
+ size = 24,
556
+ className,
557
+ onClick,
558
+ "aria-label": ariaLabel = "Dropbox icon"
559
+ }) {
560
+ const fill = variant === "colored" ? "#0061FF" : variant === "black" ? "black" : "white";
561
+ return /* @__PURE__ */ jsx(
562
+ SvgIcon2,
563
+ {
564
+ size,
565
+ fill,
566
+ className,
567
+ onClick,
568
+ ariaLabel
569
+ }
570
+ );
571
+ }
572
+ DropboxIcon.displayName = "DropboxIcon";
7
573
  function FacebookIcon({
8
574
  variant = "colored",
9
575
  size = 24,
@@ -90,6 +656,179 @@ function FacebookIcon({
90
656
  ) });
91
657
  }
92
658
  FacebookIcon.displayName = "FacebookIcon";
659
+ var GitHubIconColored = ({
660
+ size = 24,
661
+ className,
662
+ onClick,
663
+ "aria-label": ariaLabel
664
+ }) => /* @__PURE__ */ jsx(
665
+ "svg",
666
+ {
667
+ width: size,
668
+ height: size,
669
+ viewBox: "0 0 24 24",
670
+ fill: "none",
671
+ xmlns: "http://www.w3.org/2000/svg",
672
+ className,
673
+ onClick,
674
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
675
+ "aria-label": ariaLabel,
676
+ tabIndex: onClick ? 0 : void 0,
677
+ onKeyDown: onClick ? (e) => {
678
+ if (e.key === "Enter" || e.key === " ") {
679
+ e.preventDefault();
680
+ onClick(e);
681
+ }
682
+ } : void 0,
683
+ children: /* @__PURE__ */ jsx(
684
+ "path",
685
+ {
686
+ fill: "#24292f",
687
+ d: "M12.001 2c-5.525 0-10 4.475-10 10a9.99 9.99 0 0 0 6.837 9.488c.5.087.688-.213.688-.476 0-.237-.013-1.024-.013-1.862-2.512.463-3.162-.612-3.362-1.175-.113-.288-.6-1.175-1.025-1.413-.35-.187-.85-.65-.013-.662.788-.013 1.35.725 1.538 1.025.9 1.512 2.337 1.087 2.912.825.088-.65.35-1.087.638-1.337-2.225-.25-4.55-1.113-4.55-4.938 0-1.088.387-1.987 1.025-2.687-.1-.25-.45-1.275.1-2.65 0 0 .837-.263 2.75 1.024a9.3 9.3 0 0 1 2.5-.337c.85 0 1.7.112 2.5.337 1.913-1.3 2.75-1.024 2.75-1.024.55 1.375.2 2.4.1 2.65.637.7 1.025 1.587 1.025 2.687 0 3.838-2.337 4.688-4.562 4.938.362.312.675.912.675 1.85 0 1.337-.013 2.412-.013 2.75 0 .262.188.574.688.474A10.02 10.02 0 0 0 22 12c0-5.525-4.475-10-10-10"
688
+ }
689
+ )
690
+ }
691
+ );
692
+ var GitHubIconBlack = ({
693
+ size = 24,
694
+ className,
695
+ onClick,
696
+ "aria-label": ariaLabel
697
+ }) => /* @__PURE__ */ jsx(
698
+ "svg",
699
+ {
700
+ width: size,
701
+ height: size,
702
+ viewBox: "0 0 24 24",
703
+ fill: "none",
704
+ xmlns: "http://www.w3.org/2000/svg",
705
+ className,
706
+ onClick,
707
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
708
+ "aria-label": ariaLabel,
709
+ tabIndex: onClick ? 0 : void 0,
710
+ onKeyDown: onClick ? (e) => {
711
+ if (e.key === "Enter" || e.key === " ") {
712
+ e.preventDefault();
713
+ onClick(e);
714
+ }
715
+ } : void 0,
716
+ children: /* @__PURE__ */ jsx(
717
+ "path",
718
+ {
719
+ fill: "black",
720
+ d: "M12.001 2c-5.525 0-10 4.475-10 10a9.99 9.99 0 0 0 6.837 9.488c.5.087.688-.213.688-.476 0-.237-.013-1.024-.013-1.862-2.512.463-3.162-.612-3.362-1.175-.113-.288-.6-1.175-1.025-1.413-.35-.187-.85-.65-.013-.662.788-.013 1.35.725 1.538 1.025.9 1.512 2.337 1.087 2.912.825.088-.65.35-1.087.638-1.337-2.225-.25-4.55-1.113-4.55-4.938 0-1.088.387-1.987 1.025-2.687-.1-.25-.45-1.275.1-2.65 0 0 .837-.263 2.75 1.024a9.3 9.3 0 0 1 2.5-.337c.85 0 1.7.112 2.5.337 1.913-1.3 2.75-1.024 2.75-1.024.55 1.375.2 2.4.1 2.65.637.7 1.025 1.587 1.025 2.687 0 3.838-2.337 4.688-4.562 4.938.362.312.675.912.675 1.85 0 1.337-.013 2.412-.013 2.75 0 .262.188.574.688.474A10.02 10.02 0 0 0 22 12c0-5.525-4.475-10-10-10"
721
+ }
722
+ )
723
+ }
724
+ );
725
+ var GitHubIconWhite = ({
726
+ size = 24,
727
+ className,
728
+ onClick,
729
+ "aria-label": ariaLabel
730
+ }) => /* @__PURE__ */ jsx(
731
+ "svg",
732
+ {
733
+ width: size,
734
+ height: size,
735
+ viewBox: "0 0 24 24",
736
+ fill: "none",
737
+ xmlns: "http://www.w3.org/2000/svg",
738
+ className,
739
+ onClick,
740
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
741
+ "aria-label": ariaLabel,
742
+ tabIndex: onClick ? 0 : void 0,
743
+ onKeyDown: onClick ? (e) => {
744
+ if (e.key === "Enter" || e.key === " ") {
745
+ e.preventDefault();
746
+ onClick(e);
747
+ }
748
+ } : void 0,
749
+ children: /* @__PURE__ */ jsx(
750
+ "path",
751
+ {
752
+ fill: "white",
753
+ d: "M12.001 2c-5.525 0-10 4.475-10 10a9.99 9.99 0 0 0 6.837 9.488c.5.087.688-.213.688-.476 0-.237-.013-1.024-.013-1.862-2.512.463-3.162-.612-3.362-1.175-.113-.288-.6-1.175-1.025-1.413-.35-.187-.85-.65-.013-.662.788-.013 1.35.725 1.538 1.025.9 1.512 2.337 1.087 2.912.825.088-.65.35-1.087.638-1.337-2.225-.25-4.55-1.113-4.55-4.938 0-1.088.387-1.987 1.025-2.687-.1-.25-.45-1.275.1-2.65 0 0 .837-.263 2.75 1.024a9.3 9.3 0 0 1 2.5-.337c.85 0 1.7.112 2.5.337 1.913-1.3 2.75-1.024 2.75-1.024.55 1.375.2 2.4.1 2.65.637.7 1.025 1.587 1.025 2.687 0 3.838-2.337 4.688-4.562 4.938.362.312.675.912.675 1.85 0 1.337-.013 2.412-.013 2.75 0 .262.188.574.688.474A10.02 10.02 0 0 0 22 12c0-5.525-4.475-10-10-10"
754
+ }
755
+ )
756
+ }
757
+ );
758
+ function GitHubIcon({
759
+ variant = "colored",
760
+ size = 24,
761
+ className,
762
+ onClick,
763
+ "aria-label": ariaLabel = "GitHub icon"
764
+ }) {
765
+ const iconProps = {
766
+ size,
767
+ className,
768
+ onClick,
769
+ "aria-label": ariaLabel
770
+ };
771
+ switch (variant) {
772
+ case "black":
773
+ return /* @__PURE__ */ jsx(GitHubIconBlack, { ...iconProps });
774
+ case "white":
775
+ return /* @__PURE__ */ jsx(GitHubIconWhite, { ...iconProps });
776
+ default:
777
+ return /* @__PURE__ */ jsx(GitHubIconColored, { ...iconProps });
778
+ }
779
+ }
780
+ GitHubIcon.displayName = "GitHubIcon";
781
+ var svgPath3 = "M21.6634 9.98693L21.6354 9.91531L18.9164 2.82092C18.8612 2.68178 18.7634 2.56365 18.6371 2.48339C18.5098 2.40304 18.3607 2.36419 18.2104 2.37219C18.0601 2.38019 17.9159 2.43464 17.7979 2.52804C17.6809 2.62181 17.5966 2.75012 17.5569 2.89466L15.7187 8.52049H8.28157L6.44336 2.89466C6.40366 2.75012 6.31934 2.62181 6.20241 2.52804C6.08487 2.43402 5.94083 2.37915 5.79052 2.37114C5.64021 2.36313 5.49116 2.40238 5.36429 2.48339C5.2374 2.56332 5.13921 2.68153 5.08388 2.82092L2.36183 9.92462L2.33379 9.99524C1.94304 11.0184 1.895 12.1407 2.19691 13.1934C2.49882 14.2462 3.13436 15.1725 4.00794 15.833L4.01832 15.8402L4.04221 15.8589L8.18917 18.9632L10.2393 20.5159L11.4856 21.4599C11.6319 21.5705 11.8104 21.6304 11.9939 21.6304C12.1774 21.6304 12.3559 21.5705 12.5023 21.4599L13.7486 20.5159L15.7997 18.9632L19.9706 15.8402L19.9819 15.8319C20.8585 15.1721 21.4966 14.245 21.7999 13.1906C22.1033 12.1362 22.0553 11.0117 21.6634 9.98693Z";
782
+ function SvgIcon3({
783
+ size = 24,
784
+ fill,
785
+ className,
786
+ onClick,
787
+ ariaLabel
788
+ }) {
789
+ return /* @__PURE__ */ jsx(
790
+ "svg",
791
+ {
792
+ width: size,
793
+ height: size,
794
+ viewBox: "0 0 24 24",
795
+ fill: "none",
796
+ xmlns: "http://www.w3.org/2000/svg",
797
+ className,
798
+ onClick,
799
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
800
+ "aria-label": ariaLabel,
801
+ tabIndex: onClick ? 0 : void 0,
802
+ onKeyDown: onClick ? (e) => {
803
+ if (e.key === "Enter" || e.key === " ") {
804
+ e.preventDefault();
805
+ onClick(e);
806
+ }
807
+ } : void 0,
808
+ children: /* @__PURE__ */ jsx("path", { fill, d: svgPath3 })
809
+ }
810
+ );
811
+ }
812
+ function GitLabIcon({
813
+ variant = "colored",
814
+ size = 24,
815
+ className,
816
+ onClick,
817
+ "aria-label": ariaLabel = "GitLab icon"
818
+ }) {
819
+ const fill = variant === "colored" ? "#FC6D26" : variant === "black" ? "black" : "white";
820
+ return /* @__PURE__ */ jsx(
821
+ SvgIcon3,
822
+ {
823
+ size,
824
+ fill,
825
+ className,
826
+ onClick,
827
+ ariaLabel
828
+ }
829
+ );
830
+ }
831
+ GitLabIcon.displayName = "GitLabIcon";
93
832
  var StyledIconWrapper = styled.button`
94
833
  display: inline-flex;
95
834
  align-items: center;
@@ -359,7 +1098,126 @@ function InstagramIcon({
359
1098
  /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: paths.path3, fill: "white" })
360
1099
  ] });
361
1100
  }
362
- InstagramIcon.displayName = "InstagramIcon";
1101
+ InstagramIcon.displayName = "InstagramIcon";
1102
+ function SvgWrapper4({
1103
+ size,
1104
+ className,
1105
+ onClick,
1106
+ ariaLabel,
1107
+ children
1108
+ }) {
1109
+ return /* @__PURE__ */ jsx(
1110
+ "svg",
1111
+ {
1112
+ width: size,
1113
+ height: size,
1114
+ viewBox: "0 -30.632 255.324 285.956",
1115
+ fill: "none",
1116
+ xmlns: "http://www.w3.org/2000/svg",
1117
+ className,
1118
+ onClick,
1119
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
1120
+ "aria-label": ariaLabel,
1121
+ tabIndex: onClick ? 0 : void 0,
1122
+ onKeyDown: onClick ? (e) => {
1123
+ if (e.key === "Enter" || e.key === " ") {
1124
+ e.preventDefault();
1125
+ onClick(e);
1126
+ }
1127
+ } : void 0,
1128
+ children
1129
+ }
1130
+ );
1131
+ }
1132
+ var topPath = "M244.658 0H121.707a55.502 55.502 0 0 0 55.502 55.502h22.649V77.37c.02 30.625 24.841 55.447 55.466 55.467V10.666C255.324 4.777 250.55 0 244.658 0z";
1133
+ var middlePath = "M183.822 61.262H60.872c.019 30.625 24.84 55.447 55.466 55.467h22.649v21.938c.039 30.625 24.877 55.43 55.502 55.43V71.93c0-5.891-4.776-10.667-10.667-10.667z";
1134
+ var bottomPath = "M122.951 122.489H0c0 30.653 24.85 55.502 55.502 55.502h22.72v21.867c.02 30.597 24.798 55.408 55.396 55.466V133.156c0-5.891-4.776-10.667-10.667-10.667z";
1135
+ var JiraIconColored = ({
1136
+ size = 24,
1137
+ className,
1138
+ onClick,
1139
+ "aria-label": ariaLabel
1140
+ }) => {
1141
+ const uid = useId();
1142
+ const gradA = `jira-a-${uid}`;
1143
+ const gradB = `jira-b-${uid}`;
1144
+ const gradC = `jira-c-${uid}`;
1145
+ return /* @__PURE__ */ jsxs(SvgWrapper4, { size, className, onClick, ariaLabel, children: [
1146
+ /* @__PURE__ */ jsxs("defs", { children: [
1147
+ /* @__PURE__ */ jsxs("linearGradient", { id: gradA, children: [
1148
+ /* @__PURE__ */ jsx("stop", { offset: ".18", stopColor: "#0052cc" }),
1149
+ /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#2684ff" })
1150
+ ] }),
1151
+ /* @__PURE__ */ jsx(
1152
+ "linearGradient",
1153
+ {
1154
+ id: gradB,
1155
+ x1: "98.031%",
1156
+ x2: "58.888%",
1157
+ xlinkHref: `#${gradA}`,
1158
+ y1: ".161%",
1159
+ y2: "40.766%"
1160
+ }
1161
+ ),
1162
+ /* @__PURE__ */ jsx(
1163
+ "linearGradient",
1164
+ {
1165
+ id: gradC,
1166
+ x1: "100.665%",
1167
+ x2: "55.402%",
1168
+ xlinkHref: `#${gradA}`,
1169
+ y1: ".455%",
1170
+ y2: "44.727%"
1171
+ }
1172
+ )
1173
+ ] }),
1174
+ /* @__PURE__ */ jsx("path", { d: topPath, fill: "#2684ff" }),
1175
+ /* @__PURE__ */ jsx("path", { d: middlePath, fill: `url(#${gradB})` }),
1176
+ /* @__PURE__ */ jsx("path", { d: bottomPath, fill: `url(#${gradC})` })
1177
+ ] });
1178
+ };
1179
+ function MonoIcon4({
1180
+ size = 24,
1181
+ fill,
1182
+ className,
1183
+ onClick,
1184
+ ariaLabel
1185
+ }) {
1186
+ return /* @__PURE__ */ jsxs(SvgWrapper4, { size, className, onClick, ariaLabel, children: [
1187
+ /* @__PURE__ */ jsx("path", { d: topPath, fill }),
1188
+ /* @__PURE__ */ jsx("path", { d: middlePath, fill, opacity: "0.85" }),
1189
+ /* @__PURE__ */ jsx("path", { d: bottomPath, fill, opacity: "0.7" })
1190
+ ] });
1191
+ }
1192
+ function JiraIcon({
1193
+ variant = "colored",
1194
+ size = 24,
1195
+ className,
1196
+ onClick,
1197
+ "aria-label": ariaLabel = "Jira icon"
1198
+ }) {
1199
+ const iconProps = {
1200
+ size,
1201
+ className,
1202
+ onClick,
1203
+ "aria-label": ariaLabel
1204
+ };
1205
+ if (variant === "colored") {
1206
+ return /* @__PURE__ */ jsx(JiraIconColored, { ...iconProps });
1207
+ }
1208
+ const fill = variant === "black" ? "black" : "white";
1209
+ return /* @__PURE__ */ jsx(
1210
+ MonoIcon4,
1211
+ {
1212
+ size,
1213
+ fill,
1214
+ className,
1215
+ onClick,
1216
+ ariaLabel
1217
+ }
1218
+ );
1219
+ }
1220
+ JiraIcon.displayName = "JiraIcon";
363
1221
  var StyledIconWrapper2 = styled.button`
364
1222
  display: inline-flex;
365
1223
  align-items: center;
@@ -496,6 +1354,158 @@ function LinkedInIcon({
496
1354
  return /* @__PURE__ */ jsx("span", { className, style: { display: "inline-flex", width: size, height: size }, children: svgElement });
497
1355
  }
498
1356
  LinkedInIcon.displayName = "LinkedInIcon";
1357
+ var squarePath = "M11.501 3v8.5h-8.5V3zm0 18h-8.5v-8.5h8.5zm1-18h8.5v8.5h-8.5zm8.5 9.5V21h-8.5v-8.5z";
1358
+ function SvgBase({
1359
+ size,
1360
+ className,
1361
+ onClick,
1362
+ ariaLabel,
1363
+ children
1364
+ }) {
1365
+ return /* @__PURE__ */ jsx(
1366
+ "svg",
1367
+ {
1368
+ width: size,
1369
+ height: size,
1370
+ viewBox: "0 0 24 24",
1371
+ fill: "none",
1372
+ xmlns: "http://www.w3.org/2000/svg",
1373
+ className,
1374
+ onClick,
1375
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
1376
+ "aria-label": ariaLabel,
1377
+ tabIndex: onClick ? 0 : void 0,
1378
+ onKeyDown: onClick ? (e) => {
1379
+ if (e.key === "Enter" || e.key === " ") {
1380
+ e.preventDefault();
1381
+ onClick(e);
1382
+ }
1383
+ } : void 0,
1384
+ children
1385
+ }
1386
+ );
1387
+ }
1388
+ function MicrosoftIcon({
1389
+ variant = "colored",
1390
+ size = 24,
1391
+ className,
1392
+ onClick,
1393
+ "aria-label": ariaLabel = "Microsoft icon"
1394
+ }) {
1395
+ if (variant === "colored") {
1396
+ return /* @__PURE__ */ jsxs(SvgBase, { size, className, onClick, ariaLabel, children: [
1397
+ /* @__PURE__ */ jsx("rect", { x: "3", y: "3", width: "8.5", height: "8.5", fill: "#F25022" }),
1398
+ /* @__PURE__ */ jsx("rect", { x: "3", y: "12.5", width: "8.5", height: "8.5", fill: "#00A4EF" }),
1399
+ /* @__PURE__ */ jsx("rect", { x: "12.5", y: "3", width: "8.5", height: "8.5", fill: "#7FBA00" }),
1400
+ /* @__PURE__ */ jsx("rect", { x: "12.5", y: "12.5", width: "8.5", height: "8.5", fill: "#FFB900" })
1401
+ ] });
1402
+ }
1403
+ const fill = variant === "black" ? "black" : "white";
1404
+ return /* @__PURE__ */ jsx(SvgBase, { size, className, onClick, ariaLabel, children: /* @__PURE__ */ jsx("path", { fill, d: squarePath }) });
1405
+ }
1406
+ MicrosoftIcon.displayName = "MicrosoftIcon";
1407
+ var svgPath4 = "M13.372 2.094a10.003 10.003 0 0 0-5.369 19.074 7.8 7.8 0 0 1 .162-2.292c.185-.839 1.296-5.463 1.296-5.463a3.7 3.7 0 0 1-.324-1.577c0-1.485.857-2.593 1.923-2.593a1.334 1.334 0 0 1 1.342 1.508c0 .9-.578 2.262-.88 3.54a1.544 1.544 0 0 0 1.575 1.923c1.897 0 3.17-2.431 3.17-5.301 0-2.201-1.457-3.847-4.143-3.847a4.746 4.746 0 0 0-4.93 4.793 2.96 2.96 0 0 0 .648 1.97.48.48 0 0 1 .162.554c-.046.184-.162.623-.208.785a.354.354 0 0 1-.51.253c-1.384-.554-2.036-2.077-2.036-3.816 0-2.847 2.384-6.255 7.154-6.255 3.796 0 6.319 2.777 6.319 5.747 0 3.909-2.176 6.848-5.393 6.848a2.86 2.86 0 0 1-2.454-1.246s-.579 2.316-.692 2.754a8 8 0 0 1-1.019 2.131c.923.28 1.882.42 2.846.416a9.99 9.99 0 0 0 9.996-10.002 10 10 0 0 0-8.635-9.904";
1408
+ function SvgIcon4({
1409
+ size = 24,
1410
+ fill,
1411
+ className,
1412
+ onClick,
1413
+ ariaLabel
1414
+ }) {
1415
+ return /* @__PURE__ */ jsx(
1416
+ "svg",
1417
+ {
1418
+ width: size,
1419
+ height: size,
1420
+ viewBox: "0 0 24 24",
1421
+ fill: "none",
1422
+ xmlns: "http://www.w3.org/2000/svg",
1423
+ className,
1424
+ onClick,
1425
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
1426
+ "aria-label": ariaLabel,
1427
+ tabIndex: onClick ? 0 : void 0,
1428
+ onKeyDown: onClick ? (e) => {
1429
+ if (e.key === "Enter" || e.key === " ") {
1430
+ e.preventDefault();
1431
+ onClick(e);
1432
+ }
1433
+ } : void 0,
1434
+ children: /* @__PURE__ */ jsx("path", { fill, d: svgPath4 })
1435
+ }
1436
+ );
1437
+ }
1438
+ function PinterestIcon({
1439
+ variant = "colored",
1440
+ size = 24,
1441
+ className,
1442
+ onClick,
1443
+ "aria-label": ariaLabel = "Pinterest icon"
1444
+ }) {
1445
+ const fill = variant === "colored" ? "#E60023" : variant === "black" ? "black" : "white";
1446
+ return /* @__PURE__ */ jsx(
1447
+ SvgIcon4,
1448
+ {
1449
+ size,
1450
+ fill,
1451
+ className,
1452
+ onClick,
1453
+ ariaLabel
1454
+ }
1455
+ );
1456
+ }
1457
+ PinterestIcon.displayName = "PinterestIcon";
1458
+ var svgPath5 = "M59.68 81.18c0 20.36 10.33 42.32 33.05 42.32 16.85 0 33.9-13.16 33.9-42.62 0-25.83-13.4-43.17-33.33-43.17-16.25 0-33.62 11.41-33.62 43.47zm41.62-81.18c40.75 0 68.15 32.27 68.15 80.31 0 47.29-28.86 80.3-70.13 80.3-19.67 0-32.27-8.43-38.86-14.53.05 1.45.08 3.07.08 4.8v64.12H18.33V44.16c0-2.48-.8-3.27-3.26-3.27H.55V3.47h35.42c16.31 0 20.48 8.3 21.28 14.7C63.87 10.75 77.59 0 101.3 0z";
1459
+ function SvgIcon5({
1460
+ size = 24,
1461
+ fill,
1462
+ className,
1463
+ onClick,
1464
+ ariaLabel
1465
+ }) {
1466
+ return /* @__PURE__ */ jsx(
1467
+ "svg",
1468
+ {
1469
+ width: size,
1470
+ height: size,
1471
+ viewBox: "0 0 170 215",
1472
+ fill: "none",
1473
+ xmlns: "http://www.w3.org/2000/svg",
1474
+ className,
1475
+ onClick,
1476
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
1477
+ "aria-label": ariaLabel,
1478
+ tabIndex: onClick ? 0 : void 0,
1479
+ onKeyDown: onClick ? (e) => {
1480
+ if (e.key === "Enter" || e.key === " ") {
1481
+ e.preventDefault();
1482
+ onClick(e);
1483
+ }
1484
+ } : void 0,
1485
+ children: /* @__PURE__ */ jsx("path", { fill, d: svgPath5 })
1486
+ }
1487
+ );
1488
+ }
1489
+ function PipedriveIcon({
1490
+ variant = "colored",
1491
+ size = 24,
1492
+ className,
1493
+ onClick,
1494
+ "aria-label": ariaLabel = "Pipedrive icon"
1495
+ }) {
1496
+ const fill = variant === "colored" ? "#017737" : variant === "black" ? "black" : "white";
1497
+ return /* @__PURE__ */ jsx(
1498
+ SvgIcon5,
1499
+ {
1500
+ size,
1501
+ fill,
1502
+ className,
1503
+ onClick,
1504
+ ariaLabel
1505
+ }
1506
+ );
1507
+ }
1508
+ PipedriveIcon.displayName = "PipedriveIcon";
499
1509
  var StyledIconWrapper3 = styled.button`
500
1510
  display: inline-flex;
501
1511
  align-items: center;
@@ -773,6 +1783,92 @@ function RedditIcon({
773
1783
  );
774
1784
  }
775
1785
  RedditIcon.displayName = "RedditIcon";
1786
+ function SvgWrapper5({
1787
+ size,
1788
+ className,
1789
+ onClick,
1790
+ ariaLabel,
1791
+ children
1792
+ }) {
1793
+ return /* @__PURE__ */ jsx(
1794
+ "svg",
1795
+ {
1796
+ width: size,
1797
+ height: size,
1798
+ viewBox: "0 0 128 128",
1799
+ fill: "none",
1800
+ xmlns: "http://www.w3.org/2000/svg",
1801
+ className,
1802
+ onClick,
1803
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
1804
+ "aria-label": ariaLabel,
1805
+ tabIndex: onClick ? 0 : void 0,
1806
+ onKeyDown: onClick ? (e) => {
1807
+ if (e.key === "Enter" || e.key === " ") {
1808
+ e.preventDefault();
1809
+ onClick(e);
1810
+ }
1811
+ } : void 0,
1812
+ children
1813
+ }
1814
+ );
1815
+ }
1816
+ var SendGridIconColored = ({
1817
+ size = 24,
1818
+ className,
1819
+ onClick,
1820
+ "aria-label": ariaLabel
1821
+ }) => /* @__PURE__ */ jsxs(SvgWrapper5, { size, className, onClick, ariaLabel, children: [
1822
+ /* @__PURE__ */ jsx("path", { fill: "#fff", d: "M127.3 0H42.4v42.4H0v84.9h84.9V84.9h42.4z" }),
1823
+ /* @__PURE__ */ jsx("path", { fill: "#00b2e3", opacity: "0.4", d: "M0 42.4v42.5h42.4v42.4h42.5V42.4z" }),
1824
+ /* @__PURE__ */ jsx("path", { fill: "#1a82e2", d: "M0 84.9h42.4v42.4H0z" }),
1825
+ /* @__PURE__ */ jsx("path", { fill: "#00b2e3", d: "M84.9 42.4V0H42.4v84.9h84.9V42.4z" }),
1826
+ /* @__PURE__ */ jsx("path", { fill: "#1a82e2", d: "M84.9 0h42.4v42.4H84.9z" })
1827
+ ] });
1828
+ function MonoIcon5({
1829
+ size = 24,
1830
+ fill,
1831
+ className,
1832
+ onClick,
1833
+ ariaLabel
1834
+ }) {
1835
+ return /* @__PURE__ */ jsxs(SvgWrapper5, { size, className, onClick, ariaLabel, children: [
1836
+ /* @__PURE__ */ jsx("path", { fill, d: "M127.3 0H42.4v42.4H0v84.9h84.9V84.9h42.4z" }),
1837
+ /* @__PURE__ */ jsx("path", { fill, opacity: "0.4", d: "M0 42.4v42.5h42.4v42.4h42.5V42.4z" }),
1838
+ /* @__PURE__ */ jsx("path", { fill, d: "M0 84.9h42.4v42.4H0z" }),
1839
+ /* @__PURE__ */ jsx("path", { fill, d: "M84.9 42.4V0H42.4v84.9h84.9V42.4z" }),
1840
+ /* @__PURE__ */ jsx("path", { fill, d: "M84.9 0h42.4v42.4H84.9z" })
1841
+ ] });
1842
+ }
1843
+ function SendGridIcon({
1844
+ variant = "colored",
1845
+ size = 24,
1846
+ className,
1847
+ onClick,
1848
+ "aria-label": ariaLabel = "SendGrid icon"
1849
+ }) {
1850
+ const iconProps = {
1851
+ size,
1852
+ className,
1853
+ onClick,
1854
+ "aria-label": ariaLabel
1855
+ };
1856
+ if (variant === "colored") {
1857
+ return /* @__PURE__ */ jsx(SendGridIconColored, { ...iconProps });
1858
+ }
1859
+ const fill = variant === "black" ? "black" : "white";
1860
+ return /* @__PURE__ */ jsx(
1861
+ MonoIcon5,
1862
+ {
1863
+ size,
1864
+ fill,
1865
+ className,
1866
+ onClick,
1867
+ ariaLabel
1868
+ }
1869
+ );
1870
+ }
1871
+ SendGridIcon.displayName = "SendGridIcon";
776
1872
  var SlackIconColored = ({
777
1873
  size = 24,
778
1874
  className,
@@ -964,6 +2060,57 @@ function SlackIcon({
964
2060
  }
965
2061
  }
966
2062
  SlackIcon.displayName = "SlackIcon";
2063
+ var svgPath6 = "M3.08378 15.2505C1.42044 15.2505 0.483972 13.3382 1.5038 12.0242L10.2099 0.806805C10.794 0.0542044 11.9999 0.467253 11.9999 1.41993V8.75048H20.9159C22.5793 8.75048 23.5157 10.6627 22.4959 11.9767L13.7898 23.1941C13.2057 23.9467 11.9999 23.5337 11.9999 22.581V15.2505H3.08378Z";
2064
+ function SvgIcon6({
2065
+ size = 24,
2066
+ fill,
2067
+ className,
2068
+ onClick,
2069
+ ariaLabel
2070
+ }) {
2071
+ return /* @__PURE__ */ jsx(
2072
+ "svg",
2073
+ {
2074
+ width: size,
2075
+ height: size,
2076
+ viewBox: "0 0 24 24",
2077
+ fill: "none",
2078
+ xmlns: "http://www.w3.org/2000/svg",
2079
+ className,
2080
+ onClick,
2081
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
2082
+ "aria-label": ariaLabel,
2083
+ tabIndex: onClick ? 0 : void 0,
2084
+ onKeyDown: onClick ? (e) => {
2085
+ if (e.key === "Enter" || e.key === " ") {
2086
+ e.preventDefault();
2087
+ onClick(e);
2088
+ }
2089
+ } : void 0,
2090
+ children: /* @__PURE__ */ jsx("path", { fill, d: svgPath6 })
2091
+ }
2092
+ );
2093
+ }
2094
+ function SupabaseIcon({
2095
+ variant = "colored",
2096
+ size = 24,
2097
+ className,
2098
+ onClick,
2099
+ "aria-label": ariaLabel = "Supabase icon"
2100
+ }) {
2101
+ const fill = variant === "colored" ? "#3ECF8E" : variant === "black" ? "black" : "white";
2102
+ return /* @__PURE__ */ jsx(
2103
+ SvgIcon6,
2104
+ {
2105
+ size,
2106
+ fill,
2107
+ className,
2108
+ onClick,
2109
+ ariaLabel
2110
+ }
2111
+ );
2112
+ }
2113
+ SupabaseIcon.displayName = "SupabaseIcon";
967
2114
  function TelegramIcon({
968
2115
  variant = "colored",
969
2116
  size = 24,
@@ -1056,6 +2203,166 @@ function TelegramIcon({
1056
2203
  ) });
1057
2204
  }
1058
2205
  TelegramIcon.displayName = "TelegramIcon";
2206
+ function SvgWrapper6({
2207
+ size,
2208
+ className,
2209
+ onClick,
2210
+ ariaLabel,
2211
+ children
2212
+ }) {
2213
+ return /* @__PURE__ */ jsx(
2214
+ "svg",
2215
+ {
2216
+ width: size,
2217
+ height: size,
2218
+ viewBox: "0 0 256 256",
2219
+ fill: "none",
2220
+ xmlns: "http://www.w3.org/2000/svg",
2221
+ className,
2222
+ onClick,
2223
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
2224
+ "aria-label": ariaLabel,
2225
+ tabIndex: onClick ? 0 : void 0,
2226
+ onKeyDown: onClick ? (e) => {
2227
+ if (e.key === "Enter" || e.key === " ") {
2228
+ e.preventDefault();
2229
+ onClick(e);
2230
+ }
2231
+ } : void 0,
2232
+ children
2233
+ }
2234
+ );
2235
+ }
2236
+ var bgPath = "M224.001997,0 L31.9980026,0 C14.3579381,0.0394964443 0.0614809418,14.336846 0,32 L0,224 C0,241.6 14.3971038,256 31.9980026,256 L224.001997,256 C241.602896,256 256,241.6 256,224 L256,32 C256,14.4 241.602896,0 224.001997,0";
2237
+ var stripePath1 = "M54.132778,120.802491 C58.5960224,118.196275 154.476075,62.477451 156.667847,61.1862981 C158.859619,59.9110855 158.97917,55.9898065 156.508446,54.5711324 C154.053661,53.1604284 149.391165,50.4824817 147.661658,49.4543415 C145.192242,48.0957707 142.191169,48.132074 139.755339,49.5499825 C138.527947,50.2672896 56.6035026,97.8486625 53.8697654,99.4107981 C50.5781227,101.291737 46.5372925,101.323617 43.2695601,99.4107981 L0,74.0181257 L0,95.6011002 C10.5205046,101.801822 36.7181549,117.200015 43.062338,120.826401 C46.8481256,122.978322 50.4745117,122.930502 54.1407481,120.802491";
2238
+ var stripePath2 = "M54.132778,161.609296 C58.5960224,159.00308 154.476075,103.284257 156.667847,101.993104 C158.859619,100.717891 158.97917,96.7966121 156.508446,95.377938 C154.053661,93.9672339 149.391165,91.2892873 147.661658,90.2611471 C145.192242,88.9025763 142.191169,88.9388796 139.755339,90.3567881 C138.527947,91.0740952 56.6035026,138.655468 53.8697654,140.217604 C50.5781227,142.098542 46.5372925,142.130423 43.2695601,140.217604 L0,114.824931 L0,136.407906 C10.5205046,142.608627 36.7181549,158.00682 43.062338,161.633206 C46.8481256,163.785128 50.4745117,163.737307 54.1407481,161.609296";
2239
+ var stripePath3 = "M54.132778,204.966527 C58.5960224,202.360311 154.476075,146.641487 156.667847,145.350335 C158.859619,144.075122 158.97917,140.153843 156.508446,138.735169 C154.053661,137.324465 149.391165,134.646518 147.661658,133.618378 C145.192242,132.259807 142.191169,132.29611 139.755339,133.714019 C138.527947,134.431326 56.6035026,182.012699 53.8697654,183.574835 C50.5781227,185.455773 46.5372925,185.487654 43.2695601,183.574835 L0,158.182162 L0,179.765137 C10.5205046,185.965858 36.7181549,201.364051 43.062338,204.990437 C46.8481256,207.142359 50.4745117,207.094538 54.1407481,204.966527";
2240
+ var TodoistIconColored = ({
2241
+ size = 24,
2242
+ className,
2243
+ onClick,
2244
+ "aria-label": ariaLabel
2245
+ }) => /* @__PURE__ */ jsxs(SvgWrapper6, { size, className, onClick, ariaLabel, children: [
2246
+ /* @__PURE__ */ jsx("path", { fill: "#E44332", d: bgPath }),
2247
+ /* @__PURE__ */ jsx("path", { fill: "#FFFFFF", d: stripePath1 }),
2248
+ /* @__PURE__ */ jsx("path", { fill: "#FFFFFF", d: stripePath2 }),
2249
+ /* @__PURE__ */ jsx("path", { fill: "#FFFFFF", d: stripePath3 })
2250
+ ] });
2251
+ function MonoIcon6({
2252
+ size = 24,
2253
+ fill,
2254
+ className,
2255
+ onClick,
2256
+ ariaLabel
2257
+ }) {
2258
+ return /* @__PURE__ */ jsxs(SvgWrapper6, { size, className, onClick, ariaLabel, children: [
2259
+ /* @__PURE__ */ jsx("path", { fill, d: bgPath }),
2260
+ /* @__PURE__ */ jsx("path", { fill: fill === "black" ? "white" : "black", d: stripePath1 }),
2261
+ /* @__PURE__ */ jsx("path", { fill: fill === "black" ? "white" : "black", d: stripePath2 }),
2262
+ /* @__PURE__ */ jsx("path", { fill: fill === "black" ? "white" : "black", d: stripePath3 })
2263
+ ] });
2264
+ }
2265
+ function TodoistIcon({
2266
+ variant = "colored",
2267
+ size = 24,
2268
+ className,
2269
+ onClick,
2270
+ "aria-label": ariaLabel = "Todoist icon"
2271
+ }) {
2272
+ const iconProps = {
2273
+ size,
2274
+ className,
2275
+ onClick,
2276
+ "aria-label": ariaLabel
2277
+ };
2278
+ if (variant === "colored") {
2279
+ return /* @__PURE__ */ jsx(TodoistIconColored, { ...iconProps });
2280
+ }
2281
+ const fill = variant === "black" ? "black" : "white";
2282
+ return /* @__PURE__ */ jsx(
2283
+ MonoIcon6,
2284
+ {
2285
+ size,
2286
+ fill,
2287
+ className,
2288
+ onClick,
2289
+ ariaLabel
2290
+ }
2291
+ );
2292
+ }
2293
+ TodoistIcon.displayName = "TodoistIcon";
2294
+ var bgPath2 = "M55.16 1.5H7.88a7.88 7.88 0 0 0-5.572 2.308A7.88 7.88 0 0 0 0 9.39v47.28a7.88 7.88 0 0 0 7.88 7.88h47.28A7.88 7.88 0 0 0 63 56.67V9.4a7.88 7.88 0 0 0-7.84-7.88z";
2295
+ var leftCardPath = "M27.42 49.26A3.78 3.78 0 0 1 23.64 53H12a3.78 3.78 0 0 1-3.8-3.74V13.5A3.78 3.78 0 0 1 12 9.71h11.64a3.78 3.78 0 0 1 3.78 3.78z";
2296
+ var rightCardPath = "M54.85 33.5a3.78 3.78 0 0 1-3.78 3.78H39.4a3.78 3.78 0 0 1-3.78-3.78v-20a3.78 3.78 0 0 1 3.78-3.79h11.67a3.78 3.78 0 0 1 3.78 3.78z";
2297
+ function SvgBase2({
2298
+ size,
2299
+ className,
2300
+ onClick,
2301
+ ariaLabel,
2302
+ children
2303
+ }) {
2304
+ return /* @__PURE__ */ jsx(
2305
+ "svg",
2306
+ {
2307
+ width: size,
2308
+ height: size,
2309
+ viewBox: "0 0 63 65",
2310
+ fill: "none",
2311
+ xmlns: "http://www.w3.org/2000/svg",
2312
+ className,
2313
+ onClick,
2314
+ role: onClick ? "button" : ariaLabel ? "img" : "presentation",
2315
+ "aria-label": ariaLabel,
2316
+ tabIndex: onClick ? 0 : void 0,
2317
+ onKeyDown: onClick ? (e) => {
2318
+ if (e.key === "Enter" || e.key === " ") {
2319
+ e.preventDefault();
2320
+ onClick(e);
2321
+ }
2322
+ } : void 0,
2323
+ children
2324
+ }
2325
+ );
2326
+ }
2327
+ function TrelloIcon({
2328
+ variant = "colored",
2329
+ size = 24,
2330
+ className,
2331
+ onClick,
2332
+ "aria-label": ariaLabel = "Trello icon"
2333
+ }) {
2334
+ const gradId = useId();
2335
+ if (variant === "colored") {
2336
+ return /* @__PURE__ */ jsxs(SvgBase2, { size, className, onClick, ariaLabel, children: [
2337
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
2338
+ "linearGradient",
2339
+ {
2340
+ id: gradId,
2341
+ x1: "31.52",
2342
+ y1: "64.56",
2343
+ x2: "31.52",
2344
+ y2: "1.51",
2345
+ gradientUnits: "userSpaceOnUse",
2346
+ children: [
2347
+ /* @__PURE__ */ jsx("stop", { offset: ".18", stopColor: "#0052CC" }),
2348
+ /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#2684FF" })
2349
+ ]
2350
+ }
2351
+ ) }),
2352
+ /* @__PURE__ */ jsx("path", { fill: `url(#${gradId})`, d: bgPath2 }),
2353
+ /* @__PURE__ */ jsx("path", { fill: "white", d: leftCardPath }),
2354
+ /* @__PURE__ */ jsx("path", { fill: "white", d: rightCardPath })
2355
+ ] });
2356
+ }
2357
+ const fill = variant === "black" ? "black" : "white";
2358
+ const cardFill = variant === "black" ? "white" : "black";
2359
+ return /* @__PURE__ */ jsxs(SvgBase2, { size, className, onClick, ariaLabel, children: [
2360
+ /* @__PURE__ */ jsx("path", { fill, d: bgPath2 }),
2361
+ /* @__PURE__ */ jsx("path", { fill: cardFill, d: leftCardPath }),
2362
+ /* @__PURE__ */ jsx("path", { fill: cardFill, d: rightCardPath })
2363
+ ] });
2364
+ }
2365
+ TrelloIcon.displayName = "TrelloIcon";
1059
2366
  function WhatsAppIcon({
1060
2367
  variant = "colored",
1061
2368
  size = 24,
@@ -1311,6 +2618,6 @@ function YouTubeIcon({
1311
2618
  }
1312
2619
  YouTubeIcon.displayName = "YouTubeIcon";
1313
2620
 
1314
- export { FacebookIcon, GmailIcon, InstagramIcon, LinkedInIcon, PostizIcon, RedditIcon, SlackIcon, TelegramIcon, WhatsAppIcon, XIcon, YouTubeIcon };
2621
+ export { AirtableIcon, AmazonIcon, AsanaIcon, CalendlyIcon, ClickUpIcon, DropboxIcon, FacebookIcon, GitHubIcon, GitLabIcon, GmailIcon, InstagramIcon, JiraIcon, LinkedInIcon, MicrosoftIcon, PinterestIcon, PipedriveIcon, PostizIcon, RedditIcon, SendGridIcon, SlackIcon, SupabaseIcon, TelegramIcon, TodoistIcon, TrelloIcon, WhatsAppIcon, XIcon, YouTubeIcon };
1315
2622
  //# sourceMappingURL=index.js.map
1316
2623
  //# sourceMappingURL=index.js.map