@sikka/hawa 0.42.10-next → 0.42.11-next
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/appLayout/index.d.mts +2 -2
- package/dist/appLayout/index.d.ts +2 -2
- package/dist/appLayout/index.js +18 -4
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs +18 -4
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +18 -4
- package/dist/index.mjs +18 -4
- package/dist/layout/index.d.mts +2 -2
- package/dist/layout/index.d.ts +2 -2
- package/dist/layout/index.js +18 -4
- package/dist/layout/index.mjs +18 -4
- package/dist/sidebar/index.d.mts +2 -2
- package/dist/sidebar/index.d.ts +2 -2
- package/dist/sidebar/index.js +18 -4
- package/dist/sidebar/index.js.map +1 -1
- package/dist/sidebar/index.mjs +18 -4
- package/dist/sidebar/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
@@ -1268,7 +1268,7 @@ type AppSidebarItemProps = {
|
|
1268
1268
|
label: string;
|
1269
1269
|
badge?: {
|
1270
1270
|
label: string;
|
1271
|
-
color
|
1271
|
+
color?: ChipColors;
|
1272
1272
|
};
|
1273
1273
|
icon?: any;
|
1274
1274
|
subitems?: SubItem[];
|
@@ -1281,7 +1281,7 @@ type SubItem = {
|
|
1281
1281
|
slug?: string;
|
1282
1282
|
badge?: {
|
1283
1283
|
label: string;
|
1284
|
-
color
|
1284
|
+
color?: ChipColors;
|
1285
1285
|
};
|
1286
1286
|
icon?: any;
|
1287
1287
|
onMouseDown?: (e: React$1.MouseEvent) => void;
|
package/dist/index.d.ts
CHANGED
@@ -1268,7 +1268,7 @@ type AppSidebarItemProps = {
|
|
1268
1268
|
label: string;
|
1269
1269
|
badge?: {
|
1270
1270
|
label: string;
|
1271
|
-
color
|
1271
|
+
color?: ChipColors;
|
1272
1272
|
};
|
1273
1273
|
icon?: any;
|
1274
1274
|
subitems?: SubItem[];
|
@@ -1281,7 +1281,7 @@ type SubItem = {
|
|
1281
1281
|
slug?: string;
|
1282
1282
|
badge?: {
|
1283
1283
|
label: string;
|
1284
|
-
color
|
1284
|
+
color?: ChipColors;
|
1285
1285
|
};
|
1286
1286
|
icon?: any;
|
1287
1287
|
onMouseDown?: (e: React$1.MouseEvent) => void;
|
package/dist/index.js
CHANGED
@@ -9654,12 +9654,19 @@ var SidebarItem = ({
|
|
9654
9654
|
"span",
|
9655
9655
|
{
|
9656
9656
|
className: cn(
|
9657
|
-
"hawa-transition-all",
|
9657
|
+
"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap",
|
9658
9658
|
isOpen ? "hawa-opacity-100" : "hawa-opacity-0"
|
9659
9659
|
)
|
9660
9660
|
},
|
9661
9661
|
item.label,
|
9662
|
-
item.badge && /* @__PURE__ */ React72.createElement(
|
9662
|
+
item.badge && /* @__PURE__ */ React72.createElement(
|
9663
|
+
Chip,
|
9664
|
+
{
|
9665
|
+
label: item.badge.label,
|
9666
|
+
color: item.badge.color,
|
9667
|
+
size: "small"
|
9668
|
+
}
|
9669
|
+
)
|
9663
9670
|
)
|
9664
9671
|
)
|
9665
9672
|
),
|
@@ -9701,7 +9708,7 @@ var SidebarItem = ({
|
|
9701
9708
|
Chip,
|
9702
9709
|
{
|
9703
9710
|
label: subitem.badge.label,
|
9704
|
-
color:
|
9711
|
+
color: subitem.badge.color,
|
9705
9712
|
size: "small"
|
9706
9713
|
}
|
9707
9714
|
)
|
@@ -9743,7 +9750,14 @@ var SidebarItem = ({
|
|
9743
9750
|
},
|
9744
9751
|
item.label,
|
9745
9752
|
" ",
|
9746
|
-
item.badge && /* @__PURE__ */ React72.createElement(
|
9753
|
+
item.badge && /* @__PURE__ */ React72.createElement(
|
9754
|
+
Chip,
|
9755
|
+
{
|
9756
|
+
label: item.badge.label,
|
9757
|
+
color: item.badge.color,
|
9758
|
+
size: "small"
|
9759
|
+
}
|
9760
|
+
)
|
9747
9761
|
))
|
9748
9762
|
);
|
9749
9763
|
}
|
package/dist/index.mjs
CHANGED
@@ -9417,12 +9417,19 @@ var SidebarItem = ({
|
|
9417
9417
|
"span",
|
9418
9418
|
{
|
9419
9419
|
className: cn(
|
9420
|
-
"hawa-transition-all",
|
9420
|
+
"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap",
|
9421
9421
|
isOpen ? "hawa-opacity-100" : "hawa-opacity-0"
|
9422
9422
|
)
|
9423
9423
|
},
|
9424
9424
|
item.label,
|
9425
|
-
item.badge && /* @__PURE__ */ React72.createElement(
|
9425
|
+
item.badge && /* @__PURE__ */ React72.createElement(
|
9426
|
+
Chip,
|
9427
|
+
{
|
9428
|
+
label: item.badge.label,
|
9429
|
+
color: item.badge.color,
|
9430
|
+
size: "small"
|
9431
|
+
}
|
9432
|
+
)
|
9426
9433
|
)
|
9427
9434
|
)
|
9428
9435
|
),
|
@@ -9464,7 +9471,7 @@ var SidebarItem = ({
|
|
9464
9471
|
Chip,
|
9465
9472
|
{
|
9466
9473
|
label: subitem.badge.label,
|
9467
|
-
color:
|
9474
|
+
color: subitem.badge.color,
|
9468
9475
|
size: "small"
|
9469
9476
|
}
|
9470
9477
|
)
|
@@ -9506,7 +9513,14 @@ var SidebarItem = ({
|
|
9506
9513
|
},
|
9507
9514
|
item.label,
|
9508
9515
|
" ",
|
9509
|
-
item.badge && /* @__PURE__ */ React72.createElement(
|
9516
|
+
item.badge && /* @__PURE__ */ React72.createElement(
|
9517
|
+
Chip,
|
9518
|
+
{
|
9519
|
+
label: item.badge.label,
|
9520
|
+
color: item.badge.color,
|
9521
|
+
size: "small"
|
9522
|
+
}
|
9523
|
+
)
|
9510
9524
|
))
|
9511
9525
|
);
|
9512
9526
|
}
|
package/dist/layout/index.d.mts
CHANGED
@@ -28,7 +28,7 @@ type AppSidebarItemProps = {
|
|
28
28
|
label: string;
|
29
29
|
badge?: {
|
30
30
|
label: string;
|
31
|
-
color
|
31
|
+
color?: ChipColors;
|
32
32
|
};
|
33
33
|
icon?: any;
|
34
34
|
subitems?: SubItem[];
|
@@ -41,7 +41,7 @@ type SubItem = {
|
|
41
41
|
slug?: string;
|
42
42
|
badge?: {
|
43
43
|
label: string;
|
44
|
-
color
|
44
|
+
color?: ChipColors;
|
45
45
|
};
|
46
46
|
icon?: any;
|
47
47
|
onMouseDown?: (e: React.MouseEvent) => void;
|
package/dist/layout/index.d.ts
CHANGED
@@ -28,7 +28,7 @@ type AppSidebarItemProps = {
|
|
28
28
|
label: string;
|
29
29
|
badge?: {
|
30
30
|
label: string;
|
31
|
-
color
|
31
|
+
color?: ChipColors;
|
32
32
|
};
|
33
33
|
icon?: any;
|
34
34
|
subitems?: SubItem[];
|
@@ -41,7 +41,7 @@ type SubItem = {
|
|
41
41
|
slug?: string;
|
42
42
|
badge?: {
|
43
43
|
label: string;
|
44
|
-
color
|
44
|
+
color?: ChipColors;
|
45
45
|
};
|
46
46
|
icon?: any;
|
47
47
|
onMouseDown?: (e: React.MouseEvent) => void;
|
package/dist/layout/index.js
CHANGED
@@ -441,12 +441,19 @@ var SidebarItem = ({
|
|
441
441
|
"span",
|
442
442
|
{
|
443
443
|
className: cn(
|
444
|
-
"hawa-transition-all",
|
444
|
+
"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap",
|
445
445
|
isOpen ? "hawa-opacity-100" : "hawa-opacity-0"
|
446
446
|
)
|
447
447
|
},
|
448
448
|
item.label,
|
449
|
-
item.badge && /* @__PURE__ */ React5.createElement(
|
449
|
+
item.badge && /* @__PURE__ */ React5.createElement(
|
450
|
+
Chip,
|
451
|
+
{
|
452
|
+
label: item.badge.label,
|
453
|
+
color: item.badge.color,
|
454
|
+
size: "small"
|
455
|
+
}
|
456
|
+
)
|
450
457
|
)
|
451
458
|
)
|
452
459
|
),
|
@@ -488,7 +495,7 @@ var SidebarItem = ({
|
|
488
495
|
Chip,
|
489
496
|
{
|
490
497
|
label: subitem.badge.label,
|
491
|
-
color:
|
498
|
+
color: subitem.badge.color,
|
492
499
|
size: "small"
|
493
500
|
}
|
494
501
|
)
|
@@ -530,7 +537,14 @@ var SidebarItem = ({
|
|
530
537
|
},
|
531
538
|
item.label,
|
532
539
|
" ",
|
533
|
-
item.badge && /* @__PURE__ */ React5.createElement(
|
540
|
+
item.badge && /* @__PURE__ */ React5.createElement(
|
541
|
+
Chip,
|
542
|
+
{
|
543
|
+
label: item.badge.label,
|
544
|
+
color: item.badge.color,
|
545
|
+
size: "small"
|
546
|
+
}
|
547
|
+
)
|
534
548
|
))
|
535
549
|
);
|
536
550
|
}
|
package/dist/layout/index.mjs
CHANGED
@@ -181,12 +181,19 @@ var SidebarItem = ({
|
|
181
181
|
"span",
|
182
182
|
{
|
183
183
|
className: cn(
|
184
|
-
"hawa-transition-all",
|
184
|
+
"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap",
|
185
185
|
isOpen ? "hawa-opacity-100" : "hawa-opacity-0"
|
186
186
|
)
|
187
187
|
},
|
188
188
|
item.label,
|
189
|
-
item.badge && /* @__PURE__ */ React2.createElement(
|
189
|
+
item.badge && /* @__PURE__ */ React2.createElement(
|
190
|
+
Chip,
|
191
|
+
{
|
192
|
+
label: item.badge.label,
|
193
|
+
color: item.badge.color,
|
194
|
+
size: "small"
|
195
|
+
}
|
196
|
+
)
|
190
197
|
)
|
191
198
|
)
|
192
199
|
),
|
@@ -228,7 +235,7 @@ var SidebarItem = ({
|
|
228
235
|
Chip,
|
229
236
|
{
|
230
237
|
label: subitem.badge.label,
|
231
|
-
color:
|
238
|
+
color: subitem.badge.color,
|
232
239
|
size: "small"
|
233
240
|
}
|
234
241
|
)
|
@@ -270,7 +277,14 @@ var SidebarItem = ({
|
|
270
277
|
},
|
271
278
|
item.label,
|
272
279
|
" ",
|
273
|
-
item.badge && /* @__PURE__ */ React2.createElement(
|
280
|
+
item.badge && /* @__PURE__ */ React2.createElement(
|
281
|
+
Chip,
|
282
|
+
{
|
283
|
+
label: item.badge.label,
|
284
|
+
color: item.badge.color,
|
285
|
+
size: "small"
|
286
|
+
}
|
287
|
+
)
|
274
288
|
))
|
275
289
|
);
|
276
290
|
}
|
package/dist/sidebar/index.d.mts
CHANGED
@@ -9,7 +9,7 @@ type AppSidebarItemProps = {
|
|
9
9
|
label: string;
|
10
10
|
badge?: {
|
11
11
|
label: string;
|
12
|
-
color
|
12
|
+
color?: ChipColors;
|
13
13
|
};
|
14
14
|
icon?: any;
|
15
15
|
subitems?: SubItem[];
|
@@ -22,7 +22,7 @@ type SubItem = {
|
|
22
22
|
slug?: string;
|
23
23
|
badge?: {
|
24
24
|
label: string;
|
25
|
-
color
|
25
|
+
color?: ChipColors;
|
26
26
|
};
|
27
27
|
icon?: any;
|
28
28
|
onMouseDown?: (e: React.MouseEvent) => void;
|
package/dist/sidebar/index.d.ts
CHANGED
@@ -9,7 +9,7 @@ type AppSidebarItemProps = {
|
|
9
9
|
label: string;
|
10
10
|
badge?: {
|
11
11
|
label: string;
|
12
|
-
color
|
12
|
+
color?: ChipColors;
|
13
13
|
};
|
14
14
|
icon?: any;
|
15
15
|
subitems?: SubItem[];
|
@@ -22,7 +22,7 @@ type SubItem = {
|
|
22
22
|
slug?: string;
|
23
23
|
badge?: {
|
24
24
|
label: string;
|
25
|
-
color
|
25
|
+
color?: ChipColors;
|
26
26
|
};
|
27
27
|
icon?: any;
|
28
28
|
onMouseDown?: (e: React.MouseEvent) => void;
|
package/dist/sidebar/index.js
CHANGED
@@ -254,12 +254,19 @@ var SidebarItem = ({
|
|
254
254
|
"span",
|
255
255
|
{
|
256
256
|
className: cn(
|
257
|
-
"hawa-transition-all",
|
257
|
+
"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap",
|
258
258
|
isOpen ? "hawa-opacity-100" : "hawa-opacity-0"
|
259
259
|
)
|
260
260
|
},
|
261
261
|
item.label,
|
262
|
-
item.badge && /* @__PURE__ */ React2.createElement(
|
262
|
+
item.badge && /* @__PURE__ */ React2.createElement(
|
263
|
+
Chip,
|
264
|
+
{
|
265
|
+
label: item.badge.label,
|
266
|
+
color: item.badge.color,
|
267
|
+
size: "small"
|
268
|
+
}
|
269
|
+
)
|
263
270
|
)
|
264
271
|
)
|
265
272
|
),
|
@@ -301,7 +308,7 @@ var SidebarItem = ({
|
|
301
308
|
Chip,
|
302
309
|
{
|
303
310
|
label: subitem.badge.label,
|
304
|
-
color:
|
311
|
+
color: subitem.badge.color,
|
305
312
|
size: "small"
|
306
313
|
}
|
307
314
|
)
|
@@ -343,7 +350,14 @@ var SidebarItem = ({
|
|
343
350
|
},
|
344
351
|
item.label,
|
345
352
|
" ",
|
346
|
-
item.badge && /* @__PURE__ */ React2.createElement(
|
353
|
+
item.badge && /* @__PURE__ */ React2.createElement(
|
354
|
+
Chip,
|
355
|
+
{
|
356
|
+
label: item.badge.label,
|
357
|
+
color: item.badge.color,
|
358
|
+
size: "small"
|
359
|
+
}
|
360
|
+
)
|
347
361
|
))
|
348
362
|
);
|
349
363
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../layout/sidebar/index.ts","../../layout/sidebar/Sidebar.tsx","../../util/index.ts","../../elements/chip/Chip.tsx"],"sourcesContent":["export * from \"./Sidebar\";\n","import * as React from \"react\";\n\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\n\nconst Accordion = AccordionPrimitive.Root;\n\nlet triggerStyles =\n \"hawa-flex hawa-flex-1 hawa-items-center hawa-duration-75 hawa-select-none hawa-cursor-pointer hawa-rounded hawa-justify-between hawa-p-2 hawa-px-3 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa--rotate-90\";\nconst AccordionItem = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <AccordionPrimitive.Item ref={ref} className={cn(className)} {...props} />\n));\nAccordionItem.displayName = \"AccordionItem\";\n\ntype AccordionTriggerProps = React.ComponentPropsWithoutRef<\n typeof AccordionPrimitive.Trigger\n> & {\n showArrow?: any;\n};\n\nconst AccordionTrigger = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Trigger>,\n AccordionTriggerProps\n>(({ className, showArrow, children, ...props }, ref) => (\n <AccordionPrimitive.Header className=\"flex\">\n <AccordionPrimitive.Trigger\n ref={ref}\n className={cn(triggerStyles, className)}\n {...props}\n >\n {children}\n {showArrow && (\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n height=\"1em\"\n width=\"1em\"\n className=\"hawa-icon hawa-shrink-0 hawa-rotate-90 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n )}\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;\n\nconst AccordionContent = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <AccordionPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down\",\n className,\n )}\n {...props}\n >\n <div>{children}</div>\n </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = AccordionPrimitive.Content.displayName;\n\nexport type AppSidebarItemProps = {\n value: string;\n slug?: string;\n label: string;\n badge?: { label: string; color: ChipColors };\n icon?: any;\n subitems?: SubItem[];\n onClick?: (e: React.MouseEvent) => void;\n onMouseDown?: (e: React.MouseEvent) => void;\n};\ntype SubItem = {\n value: string;\n label: string;\n slug?: string;\n badge?: { label: string; color: ChipColors };\n icon?: any;\n onMouseDown?: (e: React.MouseEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n};\ninterface SidebarGroupProps {\n title?: string;\n items: AppSidebarItemProps[];\n openedItem?: any;\n setOpenedItem?: any;\n selectedItem?: any;\n isOpen?: boolean;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n direction?: DirectionType;\n LinkComponent?: any;\n}\n\nconst SidebarGroup: React.FC<SidebarGroupProps> = ({\n title,\n items,\n selectedItem,\n openedItem,\n setOpenedItem,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen,\n ...props\n}) => {\n const LinkComponent = props.LinkComponent || \"a\"; // Use the provided LinkComponent or 'a' as a fallback\n\n return (\n <div className=\"hawa-m-2\">\n {title && <h3 className=\"hawa-mb-1 hawa-font-bold\">{title}</h3>}\n <ul className=\"hawa-flex hawa-flex-col hawa-gap-2\">\n <Accordion\n value={openedItem}\n type=\"single\"\n onValueChange={(e) => {\n setOpenedItem(e);\n }}\n collapsible\n className=\"hawa-flex hawa-flex-col hawa-gap-1\"\n >\n {items.map((item, idx) => (\n <SidebarItem\n isOpen={isOpen}\n selectedItem={selectedItem}\n key={idx}\n direction={direction}\n item={item}\n onItemClick={onItemClick}\n onSubItemClick={onSubItemClick}\n LinkComponent={LinkComponent}\n />\n ))}\n </Accordion>\n </ul>\n </div>\n );\n};\nconst SidebarItem: React.FC<{\n item: AppSidebarItemProps;\n selectedItem?: any;\n direction?: DirectionType;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n isOpen?: boolean;\n LinkComponent?: any;\n}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\n LinkComponent,\n ...props\n}) => {\n const getSelectedStyle = (value: string) => {\n return props.selectedItem === value\n ? \"hawa-bg-primary/90 hawa-text-primary-foreground hawa-cursor-default\"\n : \"hover:hawa-bg-primary/10\";\n };\n if (item.subitems) {\n return (\n <AccordionItem\n value={item.value}\n className=\"hawa-overflow-x-clip\"\n dir={direction}\n >\n <AccordionTrigger\n className={cn(\n \"hawa-w-full hawa-overflow-x-clip\",\n props.selectedItem === item.value\n ? \"hawa-cursor-default hawa-bg-primary hawa-text-primary-foreground\"\n : \"hawa-h-10 hover:hawa-bg-primary/10\",\n item.subitems &&\n item.subitems.some(\n (subitem) => props.selectedItem === subitem.value,\n )\n ? \"hawa-bg-primary/80 hawa-text-primary-foreground hover:hawa-bg-primary/80\"\n : \"\",\n )}\n showArrow={isOpen}\n >\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2\",\n )}\n >\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}\n {item.badge && (\n <Chip label={item.badge.label} color=\"hyper\" size=\"small\" />\n )}\n </span>\n </div>\n </AccordionTrigger>\n {item.subitems && (\n <AccordionContent className=\"hawa-mt-1 hawa-h-full hawa-rounded\">\n <div\n className={cn(\n \"hawa-flex hawa-h-full hawa-flex-col hawa-gap-2 hawa-bg-foreground/5 hawa-p-1\",\n )}\n >\n {item.subitems.map((subitem, idx) => (\n <LinkComponent\n href={subitem.slug}\n key={idx}\n onMouseDown={(e: any) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n }}\n onClick={(e: any) => {\n e.stopPropagation();\n if (subitem.onClick) {\n subitem.onClick(e);\n }\n if (onSubItemClick) {\n onSubItemClick([item.value, subitem.value]);\n }\n }}\n className={cn(\n \"hawa-flex hawa-h-full hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-2 hawa-overflow-x-clip hawa-whitespace-nowrap hawa-rounded hawa-p-2 hawa-transition-all\",\n // bg-foreground/10\n getSelectedStyle(subitem.value),\n )}\n >\n {subitem.icon && subitem.icon}\n {subitem.label}\n {subitem.badge && (\n <Chip\n label={subitem.badge.label}\n color=\"hyper\"\n size=\"small\"\n />\n )}\n </LinkComponent>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <LinkComponent\n href={item.slug}\n dir={direction}\n onMouseDown={(e: React.MouseEvent) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e: React.MouseEvent) => {\n if (item.onClick) {\n item.onClick(e);\n }\n if (onItemClick) {\n onItemClick([item.value]);\n }\n }}\n className={cn(\n triggerStyles,\n getSelectedStyle(item.value),\n \"hawa-overflow-x-clip\",\n )}\n >\n <div className={\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2\"}>\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}{\" \"}\n {item.badge && (\n <Chip label={item.badge.label} color=\"hyper\" size=\"small\" />\n )}\n </span>\n </div>\n </LinkComponent>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotStatus?: \"available\" | \"unavailable\" | \"none\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n {\n label,\n size = \"normal\",\n icon,\n color,\n radius = \"inherit\",\n dot,\n dotStatus = \"none\",\n ...rest\n },\n ref,\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\",\n };\n let sizeStyles = {\n small:\n \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\",\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\",\n };\n let dotStatusStyles = {\n none: \"hawa-bg-gray-500 dark:hawa-bg-gray-800\",\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\",\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-200 hawa-text-green-700 dark:hawa-bg-green-700 dark:hawa-text-green-200\",\n blue: \"hawa-bg-blue-200 hawa-text-blue-700 dark:hawa-bg-blue-700 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-200 hawa-text-red-700 dark:hawa-bg-red-700 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-200 hawa-text-yellow-700 dark:hawa-bg-yellow-600 dark:hawa-text-black\",\n orange:\n \"hawa-bg-orange-200 hawa-text-orange-700 dark:hawa-bg-orange-700 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-200 hawa-text-purple-700 dark:hawa-bg-purple-700 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-200 hawa-text-cyan-700 dark:hawa-bg-cyan-700 dark:hawa-text-cyan-100\",\n hyper:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\",\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n >\n {dot && (\n <span\n className={cn(dotStyles[size], dotStatusStyles[dotStatus])}\n ></span>\n )}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n ></span>\n );\n }\n },\n);\n"],"mappings":"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","names":["React","React"]}
|
1
|
+
{"version":3,"sources":["../../layout/sidebar/index.ts","../../layout/sidebar/Sidebar.tsx","../../util/index.ts","../../elements/chip/Chip.tsx"],"sourcesContent":["export * from \"./Sidebar\";\n","import * as React from \"react\";\n\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\n\nconst Accordion = AccordionPrimitive.Root;\n\nlet triggerStyles =\n \"hawa-flex hawa-flex-1 hawa-items-center hawa-duration-75 hawa-select-none hawa-cursor-pointer hawa-rounded hawa-justify-between hawa-p-2 hawa-px-3 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa--rotate-90\";\nconst AccordionItem = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <AccordionPrimitive.Item ref={ref} className={cn(className)} {...props} />\n));\nAccordionItem.displayName = \"AccordionItem\";\n\ntype AccordionTriggerProps = React.ComponentPropsWithoutRef<\n typeof AccordionPrimitive.Trigger\n> & {\n showArrow?: any;\n};\n\nconst AccordionTrigger = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Trigger>,\n AccordionTriggerProps\n>(({ className, showArrow, children, ...props }, ref) => (\n <AccordionPrimitive.Header className=\"flex\">\n <AccordionPrimitive.Trigger\n ref={ref}\n className={cn(triggerStyles, className)}\n {...props}\n >\n {children}\n {showArrow && (\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n height=\"1em\"\n width=\"1em\"\n className=\"hawa-icon hawa-shrink-0 hawa-rotate-90 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n )}\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;\n\nconst AccordionContent = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <AccordionPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down\",\n className,\n )}\n {...props}\n >\n <div>{children}</div>\n </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = AccordionPrimitive.Content.displayName;\n\nexport type AppSidebarItemProps = {\n value: string;\n slug?: string;\n label: string;\n badge?: { label: string; color?: ChipColors };\n icon?: any;\n subitems?: SubItem[];\n onClick?: (e: React.MouseEvent) => void;\n onMouseDown?: (e: React.MouseEvent) => void;\n};\ntype SubItem = {\n value: string;\n label: string;\n slug?: string;\n badge?: { label: string; color?: ChipColors };\n icon?: any;\n onMouseDown?: (e: React.MouseEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n};\ninterface SidebarGroupProps {\n title?: string;\n items: AppSidebarItemProps[];\n openedItem?: any;\n setOpenedItem?: any;\n selectedItem?: any;\n isOpen?: boolean;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n direction?: DirectionType;\n LinkComponent?: any;\n}\n\nconst SidebarGroup: React.FC<SidebarGroupProps> = ({\n title,\n items,\n selectedItem,\n openedItem,\n setOpenedItem,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen,\n ...props\n}) => {\n const LinkComponent = props.LinkComponent || \"a\"; // Use the provided LinkComponent or 'a' as a fallback\n\n return (\n <div className=\"hawa-m-2\">\n {title && <h3 className=\"hawa-mb-1 hawa-font-bold\">{title}</h3>}\n <ul className=\"hawa-flex hawa-flex-col hawa-gap-2\">\n <Accordion\n value={openedItem}\n type=\"single\"\n onValueChange={(e) => {\n setOpenedItem(e);\n }}\n collapsible\n className=\"hawa-flex hawa-flex-col hawa-gap-1\"\n >\n {items.map((item, idx) => (\n <SidebarItem\n isOpen={isOpen}\n selectedItem={selectedItem}\n key={idx}\n direction={direction}\n item={item}\n onItemClick={onItemClick}\n onSubItemClick={onSubItemClick}\n LinkComponent={LinkComponent}\n />\n ))}\n </Accordion>\n </ul>\n </div>\n );\n};\nconst SidebarItem: React.FC<{\n item: AppSidebarItemProps;\n selectedItem?: any;\n direction?: DirectionType;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n isOpen?: boolean;\n LinkComponent?: any;\n}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\n LinkComponent,\n ...props\n}) => {\n const getSelectedStyle = (value: string) => {\n return props.selectedItem === value\n ? \"hawa-bg-primary/90 hawa-text-primary-foreground hawa-cursor-default\"\n : \"hover:hawa-bg-primary/10\";\n };\n if (item.subitems) {\n return (\n <AccordionItem\n value={item.value}\n className=\"hawa-overflow-x-clip\"\n dir={direction}\n >\n <AccordionTrigger\n className={cn(\n \"hawa-w-full hawa-overflow-x-clip\",\n props.selectedItem === item.value\n ? \"hawa-cursor-default hawa-bg-primary hawa-text-primary-foreground\"\n : \"hawa-h-10 hover:hawa-bg-primary/10\",\n item.subitems &&\n item.subitems.some(\n (subitem) => props.selectedItem === subitem.value,\n )\n ? \"hawa-bg-primary/80 hawa-text-primary-foreground hover:hawa-bg-primary/80\"\n : \"\",\n )}\n showArrow={isOpen}\n >\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2\",\n )}\n >\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}\n {item.badge && (\n <Chip\n label={item.badge.label}\n color={item.badge.color}\n size=\"small\"\n />\n )}\n </span>\n </div>\n </AccordionTrigger>\n {item.subitems && (\n <AccordionContent className=\"hawa-mt-1 hawa-h-full hawa-rounded\">\n <div\n className={cn(\n \"hawa-flex hawa-h-full hawa-flex-col hawa-gap-2 hawa-bg-foreground/5 hawa-p-1\",\n )}\n >\n {item.subitems.map((subitem, idx) => (\n <LinkComponent\n href={subitem.slug}\n key={idx}\n onMouseDown={(e: any) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n }}\n onClick={(e: any) => {\n e.stopPropagation();\n if (subitem.onClick) {\n subitem.onClick(e);\n }\n if (onSubItemClick) {\n onSubItemClick([item.value, subitem.value]);\n }\n }}\n className={cn(\n \"hawa-flex hawa-h-full hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-2 hawa-overflow-x-clip hawa-whitespace-nowrap hawa-rounded hawa-p-2 hawa-transition-all\",\n // bg-foreground/10\n getSelectedStyle(subitem.value),\n )}\n >\n {subitem.icon && subitem.icon}\n {subitem.label}\n {subitem.badge && (\n <Chip\n label={subitem.badge.label}\n color={subitem.badge.color}\n size=\"small\"\n />\n )}\n </LinkComponent>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <LinkComponent\n href={item.slug}\n dir={direction}\n onMouseDown={(e: React.MouseEvent) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e: React.MouseEvent) => {\n if (item.onClick) {\n item.onClick(e);\n }\n if (onItemClick) {\n onItemClick([item.value]);\n }\n }}\n className={cn(\n triggerStyles,\n getSelectedStyle(item.value),\n \"hawa-overflow-x-clip\",\n )}\n >\n <div className={\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2\"}>\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}{\" \"}\n {item.badge && (\n <Chip\n label={item.badge.label}\n color={item.badge.color}\n size=\"small\"\n />\n )}\n </span>\n </div>\n </LinkComponent>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotStatus?: \"available\" | \"unavailable\" | \"none\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n {\n label,\n size = \"normal\",\n icon,\n color,\n radius = \"inherit\",\n dot,\n dotStatus = \"none\",\n ...rest\n },\n ref,\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\",\n };\n let sizeStyles = {\n small:\n \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\",\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\",\n };\n let dotStatusStyles = {\n none: \"hawa-bg-gray-500 dark:hawa-bg-gray-800\",\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\",\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-200 hawa-text-green-700 dark:hawa-bg-green-700 dark:hawa-text-green-200\",\n blue: \"hawa-bg-blue-200 hawa-text-blue-700 dark:hawa-bg-blue-700 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-200 hawa-text-red-700 dark:hawa-bg-red-700 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-200 hawa-text-yellow-700 dark:hawa-bg-yellow-600 dark:hawa-text-black\",\n orange:\n \"hawa-bg-orange-200 hawa-text-orange-700 dark:hawa-bg-orange-700 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-200 hawa-text-purple-700 dark:hawa-bg-purple-700 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-200 hawa-text-cyan-700 dark:hawa-bg-cyan-700 dark:hawa-text-cyan-100\",\n hyper:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\",\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n >\n {dot && (\n <span\n className={cn(dotStyles[size], dotStatusStyles[dotStatus])}\n ></span>\n )}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n ></span>\n );\n }\n },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,SAAuB;AAEvB,yBAAoC;;;ACFpC,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ACLA,mBAAkB;AAiCX,IAAM,OAAO,aAAAC,QAAM;AAAA,EACxB,CACE;AAAA,IACE;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,YAAY;AAAA,IACZ,GAAG;AAAA,EACL,GACA,QACG;AACH,QAAI,gBACF;AACF,QAAI,eAAe;AAAA,MACjB,SAAS;AAAA,MACT,MAAM;AAAA,MACN,MAAM;AAAA,IACR;AACA,QAAI,aAAa;AAAA,MACf,OACE;AAAA,MACF,QAAQ;AAAA,MACR,OAAO;AAAA,IACT;AACA,QAAI,YAAY;AAAA,MACd,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACT;AACA,QAAI,kBAAkB;AAAA,MACpB,MAAM;AAAA,MACN,WAAW;AAAA,MACX,aAAa;AAAA,IACf;AACA,QAAI,cAAmB;AAAA,MACrB,OACE;AAAA,MACF,MAAM;AAAA,MACN,KAAK;AAAA,MACL,QACE;AAAA,MACF,QACE;AAAA,MACF,QACE;AAAA,MACF,MAAM;AAAA,MACN,OACE;AAAA,MACF,SACE;AAAA,IACJ;AACA,QAAI,OAAO;AACT,aACE,6BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACJ;AAAA,UACA,WAAW;AAAA,YACT;AAAA,YACA,WAAW,IAAI;AAAA,YACf,aAAa,MAAM;AAAA,YACnB,QAAQ,YAAY,KAAK,IAAI;AAAA,UAC/B;AAAA;AAAA,QAEC,OACC,6BAAAA,QAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,UAAU,IAAI,GAAG,gBAAgB,SAAS,CAAC;AAAA;AAAA,QAC1D;AAAA,QAEF,QAAQ;AAAA,QACR;AAAA,MACH;AAAA,IAEJ,OAAO;AACL,aACE,6BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACJ;AAAA,UACA,WAAW;AAAA,YACT;AAAA,YACA,QAAQ,YAAY,KAAK,IAAI;AAAA,UAC/B;AAAA;AAAA,MACD;AAAA,IAEL;AAAA,EACF;AACF;;;AFhHA,IAAM,YAA+B;AAErC,IAAI,gBACF;AACF,IAAM,gBAAsB,kBAG1B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B,qCAAoB,yBAAnB,EAAwB,KAAU,WAAW,GAAG,SAAS,GAAI,GAAG,OAAO,CACzE;AACD,cAAc,cAAc;AAQ5B,IAAM,mBAAyB,kBAG7B,CAAC,EAAE,WAAW,WAAW,UAAU,GAAG,MAAM,GAAG,QAC/C,qCAAoB,2BAAnB,EAA0B,WAAU,UACnC;AAAA,EAAoB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,eAAe,SAAS;AAAA,IACrC,GAAG;AAAA;AAAA,EAEH;AAAA,EACA,aACC;AAAA,IAAC;AAAA;AAAA,MACC,cAAW;AAAA,MACX,QAAO;AAAA,MACP,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,OAAM;AAAA,MACN,WAAU;AAAA;AAAA,IAEV,qCAAC,UAAK,GAAE,0HAAyH;AAAA,EACnI;AAEJ,CACF,CACD;AACD,iBAAiB,cAAiC,2BAAQ;AAE1D,IAAM,mBAAyB,kBAG7B,CAAC,EAAE,WAAW,UAAU,GAAG,MAAM,GAAG,QACpC;AAAA,EAAoB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AAAA,EAEJ,qCAAC,aAAK,QAAS;AACjB,CACD;AACD,iBAAiB,cAAiC,2BAAQ;AAkC1D,IAAM,eAA4C,CAAC;AAAA,EACjD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,gBAAgB,MAAM,iBAAiB;AAE7C,SACE,qCAAC,SAAI,WAAU,cACZ,SAAS,qCAAC,QAAG,WAAU,8BAA4B,KAAM,GAC1D,qCAAC,QAAG,WAAU,wCACZ;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,MAAK;AAAA,MACL,eAAe,CAAC,MAAM;AACpB,sBAAc,CAAC;AAAA,MACjB;AAAA,MACA,aAAW;AAAA,MACX,WAAU;AAAA;AAAA,IAET,MAAM,IAAI,CAAC,MAAM,QAChB;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,KAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,CACD;AAAA,EACH,CACF,CACF;AAEJ;AACA,IAAM,cAQD,CAAC;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,mBAAmB,CAAC,UAAkB;AAC1C,WAAO,MAAM,iBAAiB,QAC1B,yEACA;AAAA,EACN;AACA,MAAI,KAAK,UAAU;AACjB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,KAAK;AAAA,QACZ,WAAU;AAAA,QACV,KAAK;AAAA;AAAA,MAEL;AAAA,QAAC;AAAA;AAAA,UACC,WAAW;AAAA,YACT;AAAA,YACA,MAAM,iBAAiB,KAAK,QACxB,qEACA;AAAA,YACJ,KAAK,YACH,KAAK,SAAS;AAAA,cACZ,CAAC,YAAY,MAAM,iBAAiB,QAAQ;AAAA,YAC9C,IACE,6EACA;AAAA,UACN;AAAA,UACA,WAAW;AAAA;AAAA,QAEX;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,YACF;AAAA;AAAA,UAEC,KAAK,QAAQ,KAAK;AAAA,UACnB;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,SAAS,qBAAqB;AAAA,cAChC;AAAA;AAAA,YAEC,KAAK;AAAA,YACL,KAAK,SACJ;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO,KAAK,MAAM;AAAA,gBAClB,OAAO,KAAK,MAAM;AAAA,gBAClB,MAAK;AAAA;AAAA,YACP;AAAA,UAEJ;AAAA,QACF;AAAA,MACF;AAAA,MACC,KAAK,YACJ,qCAAC,oBAAiB,WAAU,wCAC1B;AAAA,QAAC;AAAA;AAAA,UACC,WAAW;AAAA,YACT;AAAA,UACF;AAAA;AAAA,QAEC,KAAK,SAAS,IAAI,CAAC,SAAS,QAC3B;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,QAAQ;AAAA,YACd,KAAK;AAAA,YACL,aAAa,CAAC,MAAW;AACvB,kBAAI,QAAQ,aAAa;AACvB,wBAAQ,YAAY,CAAC;AAAA,cACvB;AAAA,YACF;AAAA,YACA,SAAS,CAAC,MAAW;AACnB,gBAAE,gBAAgB;AAClB,kBAAI,QAAQ,SAAS;AACnB,wBAAQ,QAAQ,CAAC;AAAA,cACnB;AACA,kBAAI,gBAAgB;AAClB,+BAAe,CAAC,KAAK,OAAO,QAAQ,KAAK,CAAC;AAAA,cAC5C;AAAA,YACF;AAAA,YACA,WAAW;AAAA,cACT;AAAA;AAAA,cAEA,iBAAiB,QAAQ,KAAK;AAAA,YAChC;AAAA;AAAA,UAEC,QAAQ,QAAQ,QAAQ;AAAA,UACxB,QAAQ;AAAA,UACR,QAAQ,SACP;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,QAAQ,MAAM;AAAA,cACrB,OAAO,QAAQ,MAAM;AAAA,cACrB,MAAK;AAAA;AAAA,UACP;AAAA,QAEJ,CACD;AAAA,MACH,CACF;AAAA,IAEJ;AAAA,EAEJ,OAAO;AACL,WACE;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,KAAK;AAAA,QACX,KAAK;AAAA,QACL,aAAa,CAAC,MAAwB;AACpC,cAAI,KAAK,aAAa;AACpB,iBAAK,YAAY,CAAC;AAAA,UACpB;AAAA,QACF;AAAA,QACA,SAAS,CAAC,MAAwB;AAChC,cAAI,KAAK,SAAS;AAChB,iBAAK,QAAQ,CAAC;AAAA,UAChB;AACA,cAAI,aAAa;AACf,wBAAY,CAAC,KAAK,KAAK,CAAC;AAAA,UAC1B;AAAA,QACF;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,iBAAiB,KAAK,KAAK;AAAA,UAC3B;AAAA,QACF;AAAA;AAAA,MAEA,qCAAC,SAAI,WAAW,0DACb,KAAK,QAAQ,KAAK,MACnB;AAAA,QAAC;AAAA;AAAA,UACC,WAAW;AAAA,YACT;AAAA,YACA,SAAS,qBAAqB;AAAA,UAChC;AAAA;AAAA,QAEC,KAAK;AAAA,QAAO;AAAA,QACZ,KAAK,SACJ;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,KAAK,MAAM;AAAA,YAClB,OAAO,KAAK,MAAM;AAAA,YAClB,MAAK;AAAA;AAAA,QACP;AAAA,MAEJ,CACF;AAAA,IACF;AAAA,EAEJ;AACF;","names":["React","React"]}
|
package/dist/sidebar/index.mjs
CHANGED
@@ -218,12 +218,19 @@ var SidebarItem = ({
|
|
218
218
|
"span",
|
219
219
|
{
|
220
220
|
className: cn(
|
221
|
-
"hawa-transition-all",
|
221
|
+
"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap",
|
222
222
|
isOpen ? "hawa-opacity-100" : "hawa-opacity-0"
|
223
223
|
)
|
224
224
|
},
|
225
225
|
item.label,
|
226
|
-
item.badge && /* @__PURE__ */ React2.createElement(
|
226
|
+
item.badge && /* @__PURE__ */ React2.createElement(
|
227
|
+
Chip,
|
228
|
+
{
|
229
|
+
label: item.badge.label,
|
230
|
+
color: item.badge.color,
|
231
|
+
size: "small"
|
232
|
+
}
|
233
|
+
)
|
227
234
|
)
|
228
235
|
)
|
229
236
|
),
|
@@ -265,7 +272,7 @@ var SidebarItem = ({
|
|
265
272
|
Chip,
|
266
273
|
{
|
267
274
|
label: subitem.badge.label,
|
268
|
-
color:
|
275
|
+
color: subitem.badge.color,
|
269
276
|
size: "small"
|
270
277
|
}
|
271
278
|
)
|
@@ -307,7 +314,14 @@ var SidebarItem = ({
|
|
307
314
|
},
|
308
315
|
item.label,
|
309
316
|
" ",
|
310
|
-
item.badge && /* @__PURE__ */ React2.createElement(
|
317
|
+
item.badge && /* @__PURE__ */ React2.createElement(
|
318
|
+
Chip,
|
319
|
+
{
|
320
|
+
label: item.badge.label,
|
321
|
+
color: item.badge.color,
|
322
|
+
size: "small"
|
323
|
+
}
|
324
|
+
)
|
311
325
|
))
|
312
326
|
);
|
313
327
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../layout/sidebar/Sidebar.tsx","../../util/index.ts","../../elements/chip/Chip.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\n\nconst Accordion = AccordionPrimitive.Root;\n\nlet triggerStyles =\n \"hawa-flex hawa-flex-1 hawa-items-center hawa-duration-75 hawa-select-none hawa-cursor-pointer hawa-rounded hawa-justify-between hawa-p-2 hawa-px-3 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa--rotate-90\";\nconst AccordionItem = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <AccordionPrimitive.Item ref={ref} className={cn(className)} {...props} />\n));\nAccordionItem.displayName = \"AccordionItem\";\n\ntype AccordionTriggerProps = React.ComponentPropsWithoutRef<\n typeof AccordionPrimitive.Trigger\n> & {\n showArrow?: any;\n};\n\nconst AccordionTrigger = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Trigger>,\n AccordionTriggerProps\n>(({ className, showArrow, children, ...props }, ref) => (\n <AccordionPrimitive.Header className=\"flex\">\n <AccordionPrimitive.Trigger\n ref={ref}\n className={cn(triggerStyles, className)}\n {...props}\n >\n {children}\n {showArrow && (\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n height=\"1em\"\n width=\"1em\"\n className=\"hawa-icon hawa-shrink-0 hawa-rotate-90 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n )}\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;\n\nconst AccordionContent = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <AccordionPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down\",\n className,\n )}\n {...props}\n >\n <div>{children}</div>\n </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = AccordionPrimitive.Content.displayName;\n\nexport type AppSidebarItemProps = {\n value: string;\n slug?: string;\n label: string;\n badge?: { label: string; color: ChipColors };\n icon?: any;\n subitems?: SubItem[];\n onClick?: (e: React.MouseEvent) => void;\n onMouseDown?: (e: React.MouseEvent) => void;\n};\ntype SubItem = {\n value: string;\n label: string;\n slug?: string;\n badge?: { label: string; color: ChipColors };\n icon?: any;\n onMouseDown?: (e: React.MouseEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n};\ninterface SidebarGroupProps {\n title?: string;\n items: AppSidebarItemProps[];\n openedItem?: any;\n setOpenedItem?: any;\n selectedItem?: any;\n isOpen?: boolean;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n direction?: DirectionType;\n LinkComponent?: any;\n}\n\nconst SidebarGroup: React.FC<SidebarGroupProps> = ({\n title,\n items,\n selectedItem,\n openedItem,\n setOpenedItem,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen,\n ...props\n}) => {\n const LinkComponent = props.LinkComponent || \"a\"; // Use the provided LinkComponent or 'a' as a fallback\n\n return (\n <div className=\"hawa-m-2\">\n {title && <h3 className=\"hawa-mb-1 hawa-font-bold\">{title}</h3>}\n <ul className=\"hawa-flex hawa-flex-col hawa-gap-2\">\n <Accordion\n value={openedItem}\n type=\"single\"\n onValueChange={(e) => {\n setOpenedItem(e);\n }}\n collapsible\n className=\"hawa-flex hawa-flex-col hawa-gap-1\"\n >\n {items.map((item, idx) => (\n <SidebarItem\n isOpen={isOpen}\n selectedItem={selectedItem}\n key={idx}\n direction={direction}\n item={item}\n onItemClick={onItemClick}\n onSubItemClick={onSubItemClick}\n LinkComponent={LinkComponent}\n />\n ))}\n </Accordion>\n </ul>\n </div>\n );\n};\nconst SidebarItem: React.FC<{\n item: AppSidebarItemProps;\n selectedItem?: any;\n direction?: DirectionType;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n isOpen?: boolean;\n LinkComponent?: any;\n}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\n LinkComponent,\n ...props\n}) => {\n const getSelectedStyle = (value: string) => {\n return props.selectedItem === value\n ? \"hawa-bg-primary/90 hawa-text-primary-foreground hawa-cursor-default\"\n : \"hover:hawa-bg-primary/10\";\n };\n if (item.subitems) {\n return (\n <AccordionItem\n value={item.value}\n className=\"hawa-overflow-x-clip\"\n dir={direction}\n >\n <AccordionTrigger\n className={cn(\n \"hawa-w-full hawa-overflow-x-clip\",\n props.selectedItem === item.value\n ? \"hawa-cursor-default hawa-bg-primary hawa-text-primary-foreground\"\n : \"hawa-h-10 hover:hawa-bg-primary/10\",\n item.subitems &&\n item.subitems.some(\n (subitem) => props.selectedItem === subitem.value,\n )\n ? \"hawa-bg-primary/80 hawa-text-primary-foreground hover:hawa-bg-primary/80\"\n : \"\",\n )}\n showArrow={isOpen}\n >\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2\",\n )}\n >\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}\n {item.badge && (\n <Chip label={item.badge.label} color=\"hyper\" size=\"small\" />\n )}\n </span>\n </div>\n </AccordionTrigger>\n {item.subitems && (\n <AccordionContent className=\"hawa-mt-1 hawa-h-full hawa-rounded\">\n <div\n className={cn(\n \"hawa-flex hawa-h-full hawa-flex-col hawa-gap-2 hawa-bg-foreground/5 hawa-p-1\",\n )}\n >\n {item.subitems.map((subitem, idx) => (\n <LinkComponent\n href={subitem.slug}\n key={idx}\n onMouseDown={(e: any) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n }}\n onClick={(e: any) => {\n e.stopPropagation();\n if (subitem.onClick) {\n subitem.onClick(e);\n }\n if (onSubItemClick) {\n onSubItemClick([item.value, subitem.value]);\n }\n }}\n className={cn(\n \"hawa-flex hawa-h-full hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-2 hawa-overflow-x-clip hawa-whitespace-nowrap hawa-rounded hawa-p-2 hawa-transition-all\",\n // bg-foreground/10\n getSelectedStyle(subitem.value),\n )}\n >\n {subitem.icon && subitem.icon}\n {subitem.label}\n {subitem.badge && (\n <Chip\n label={subitem.badge.label}\n color=\"hyper\"\n size=\"small\"\n />\n )}\n </LinkComponent>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <LinkComponent\n href={item.slug}\n dir={direction}\n onMouseDown={(e: React.MouseEvent) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e: React.MouseEvent) => {\n if (item.onClick) {\n item.onClick(e);\n }\n if (onItemClick) {\n onItemClick([item.value]);\n }\n }}\n className={cn(\n triggerStyles,\n getSelectedStyle(item.value),\n \"hawa-overflow-x-clip\",\n )}\n >\n <div className={\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2\"}>\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}{\" \"}\n {item.badge && (\n <Chip label={item.badge.label} color=\"hyper\" size=\"small\" />\n )}\n </span>\n </div>\n </LinkComponent>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotStatus?: \"available\" | \"unavailable\" | \"none\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n {\n label,\n size = \"normal\",\n icon,\n color,\n radius = \"inherit\",\n dot,\n dotStatus = \"none\",\n ...rest\n },\n ref,\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\",\n };\n let sizeStyles = {\n small:\n \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\",\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\",\n };\n let dotStatusStyles = {\n none: \"hawa-bg-gray-500 dark:hawa-bg-gray-800\",\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\",\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-200 hawa-text-green-700 dark:hawa-bg-green-700 dark:hawa-text-green-200\",\n blue: \"hawa-bg-blue-200 hawa-text-blue-700 dark:hawa-bg-blue-700 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-200 hawa-text-red-700 dark:hawa-bg-red-700 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-200 hawa-text-yellow-700 dark:hawa-bg-yellow-600 dark:hawa-text-black\",\n orange:\n \"hawa-bg-orange-200 hawa-text-orange-700 dark:hawa-bg-orange-700 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-200 hawa-text-purple-700 dark:hawa-bg-purple-700 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-200 hawa-text-cyan-700 dark:hawa-bg-cyan-700 dark:hawa-text-cyan-100\",\n hyper:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\",\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n >\n {dot && (\n <span\n className={cn(dotStyles[size], dotStatusStyles[dotStatus])}\n ></span>\n )}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n ></span>\n );\n }\n },\n);\n"],"mappings":"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","names":["React"]}
|
1
|
+
{"version":3,"sources":["../../layout/sidebar/Sidebar.tsx","../../util/index.ts","../../elements/chip/Chip.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\nimport { cn } from \"@util/index\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\n\nconst Accordion = AccordionPrimitive.Root;\n\nlet triggerStyles =\n \"hawa-flex hawa-flex-1 hawa-items-center hawa-duration-75 hawa-select-none hawa-cursor-pointer hawa-rounded hawa-justify-between hawa-p-2 hawa-px-3 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa--rotate-90\";\nconst AccordionItem = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n <AccordionPrimitive.Item ref={ref} className={cn(className)} {...props} />\n));\nAccordionItem.displayName = \"AccordionItem\";\n\ntype AccordionTriggerProps = React.ComponentPropsWithoutRef<\n typeof AccordionPrimitive.Trigger\n> & {\n showArrow?: any;\n};\n\nconst AccordionTrigger = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Trigger>,\n AccordionTriggerProps\n>(({ className, showArrow, children, ...props }, ref) => (\n <AccordionPrimitive.Header className=\"flex\">\n <AccordionPrimitive.Trigger\n ref={ref}\n className={cn(triggerStyles, className)}\n {...props}\n >\n {children}\n {showArrow && (\n <svg\n aria-label=\"Chevron Right Icon\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n viewBox=\"0 0 16 16\"\n height=\"1em\"\n width=\"1em\"\n className=\"hawa-icon hawa-shrink-0 hawa-rotate-90 hawa-transition-transform hawa-duration-200\"\n >\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"></path>\n </svg>\n )}\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n));\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;\n\nconst AccordionContent = React.forwardRef<\n React.ElementRef<typeof AccordionPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <AccordionPrimitive.Content\n ref={ref}\n className={cn(\n \"hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down\",\n className,\n )}\n {...props}\n >\n <div>{children}</div>\n </AccordionPrimitive.Content>\n));\nAccordionContent.displayName = AccordionPrimitive.Content.displayName;\n\nexport type AppSidebarItemProps = {\n value: string;\n slug?: string;\n label: string;\n badge?: { label: string; color?: ChipColors };\n icon?: any;\n subitems?: SubItem[];\n onClick?: (e: React.MouseEvent) => void;\n onMouseDown?: (e: React.MouseEvent) => void;\n};\ntype SubItem = {\n value: string;\n label: string;\n slug?: string;\n badge?: { label: string; color?: ChipColors };\n icon?: any;\n onMouseDown?: (e: React.MouseEvent) => void;\n onClick?: (e: React.MouseEvent) => void;\n};\ninterface SidebarGroupProps {\n title?: string;\n items: AppSidebarItemProps[];\n openedItem?: any;\n setOpenedItem?: any;\n selectedItem?: any;\n isOpen?: boolean;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n direction?: DirectionType;\n LinkComponent?: any;\n}\n\nconst SidebarGroup: React.FC<SidebarGroupProps> = ({\n title,\n items,\n selectedItem,\n openedItem,\n setOpenedItem,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen,\n ...props\n}) => {\n const LinkComponent = props.LinkComponent || \"a\"; // Use the provided LinkComponent or 'a' as a fallback\n\n return (\n <div className=\"hawa-m-2\">\n {title && <h3 className=\"hawa-mb-1 hawa-font-bold\">{title}</h3>}\n <ul className=\"hawa-flex hawa-flex-col hawa-gap-2\">\n <Accordion\n value={openedItem}\n type=\"single\"\n onValueChange={(e) => {\n setOpenedItem(e);\n }}\n collapsible\n className=\"hawa-flex hawa-flex-col hawa-gap-1\"\n >\n {items.map((item, idx) => (\n <SidebarItem\n isOpen={isOpen}\n selectedItem={selectedItem}\n key={idx}\n direction={direction}\n item={item}\n onItemClick={onItemClick}\n onSubItemClick={onSubItemClick}\n LinkComponent={LinkComponent}\n />\n ))}\n </Accordion>\n </ul>\n </div>\n );\n};\nconst SidebarItem: React.FC<{\n item: AppSidebarItemProps;\n selectedItem?: any;\n direction?: DirectionType;\n onItemClick?: (value: string[]) => void;\n onSubItemClick?: (values: string[]) => void;\n isOpen?: boolean;\n LinkComponent?: any;\n}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\n LinkComponent,\n ...props\n}) => {\n const getSelectedStyle = (value: string) => {\n return props.selectedItem === value\n ? \"hawa-bg-primary/90 hawa-text-primary-foreground hawa-cursor-default\"\n : \"hover:hawa-bg-primary/10\";\n };\n if (item.subitems) {\n return (\n <AccordionItem\n value={item.value}\n className=\"hawa-overflow-x-clip\"\n dir={direction}\n >\n <AccordionTrigger\n className={cn(\n \"hawa-w-full hawa-overflow-x-clip\",\n props.selectedItem === item.value\n ? \"hawa-cursor-default hawa-bg-primary hawa-text-primary-foreground\"\n : \"hawa-h-10 hover:hawa-bg-primary/10\",\n item.subitems &&\n item.subitems.some(\n (subitem) => props.selectedItem === subitem.value,\n )\n ? \"hawa-bg-primary/80 hawa-text-primary-foreground hover:hawa-bg-primary/80\"\n : \"\",\n )}\n showArrow={isOpen}\n >\n <div\n className={cn(\n \"hawa-flex hawa-h-fit hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2\",\n )}\n >\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-transition-all hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}\n {item.badge && (\n <Chip\n label={item.badge.label}\n color={item.badge.color}\n size=\"small\"\n />\n )}\n </span>\n </div>\n </AccordionTrigger>\n {item.subitems && (\n <AccordionContent className=\"hawa-mt-1 hawa-h-full hawa-rounded\">\n <div\n className={cn(\n \"hawa-flex hawa-h-full hawa-flex-col hawa-gap-2 hawa-bg-foreground/5 hawa-p-1\",\n )}\n >\n {item.subitems.map((subitem, idx) => (\n <LinkComponent\n href={subitem.slug}\n key={idx}\n onMouseDown={(e: any) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n }}\n onClick={(e: any) => {\n e.stopPropagation();\n if (subitem.onClick) {\n subitem.onClick(e);\n }\n if (onSubItemClick) {\n onSubItemClick([item.value, subitem.value]);\n }\n }}\n className={cn(\n \"hawa-flex hawa-h-full hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-2 hawa-overflow-x-clip hawa-whitespace-nowrap hawa-rounded hawa-p-2 hawa-transition-all\",\n // bg-foreground/10\n getSelectedStyle(subitem.value),\n )}\n >\n {subitem.icon && subitem.icon}\n {subitem.label}\n {subitem.badge && (\n <Chip\n label={subitem.badge.label}\n color={subitem.badge.color}\n size=\"small\"\n />\n )}\n </LinkComponent>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <LinkComponent\n href={item.slug}\n dir={direction}\n onMouseDown={(e: React.MouseEvent) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e: React.MouseEvent) => {\n if (item.onClick) {\n item.onClick(e);\n }\n if (onItemClick) {\n onItemClick([item.value]);\n }\n }}\n className={cn(\n triggerStyles,\n getSelectedStyle(item.value),\n \"hawa-overflow-x-clip\",\n )}\n >\n <div className={\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2\"}>\n {item.icon && item.icon}\n <span\n className={cn(\n \"hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-whitespace-nowrap hawa-transition-all\",\n isOpen ? \"hawa-opacity-100\" : \"hawa-opacity-0\",\n )}\n >\n {item.label}{\" \"}\n {item.badge && (\n <Chip\n label={item.badge.label}\n color={item.badge.color}\n size=\"small\"\n />\n )}\n </span>\n </div>\n </LinkComponent>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n name: string;\n colors: {\n [key: number]: string;\n };\n};\ntype Rgb = {\n r: number;\n g: number;\n b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n sanitizedHex\n );\n\n if (!colorParts) {\n return null;\n }\n\n const [, r, g, b] = colorParts;\n\n return {\n r: parseInt(r, 16),\n g: parseInt(g, 16),\n b: parseInt(b, 16)\n } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n const rgbColor = hexToRgb(color);\n\n if (!rgbColor) {\n return \"#333\";\n }\n\n const { r, g, b } = rgbColor;\n const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n const color = hexToRgb(`#${hex}`);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r + (255 - color.r) * intensity);\n const g = Math.round(color.g + (255 - color.g) * intensity);\n const b = Math.round(color.b + (255 - color.b) * intensity);\n\n return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n const color = hexToRgb(hex);\n\n if (!color) {\n return \"\";\n }\n\n const r = Math.round(color.r * intensity);\n const g = Math.round(color.g * intensity);\n const b = Math.round(color.b * intensity);\n\n return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n if (color.startsWith(\"#\")) {\n // Convert hex to RGB\n let r = parseInt(color.slice(1, 3), 16);\n let g = parseInt(color.slice(3, 5), 16);\n let b = parseInt(color.slice(5, 7), 16);\n return [r, g, b];\n } else if (color.startsWith(\"rgb\")) {\n // Extract RGB values from rgb() format\n return color.match(/\\d+/g).map(Number);\n }\n // Default to white if format is unrecognized\n return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n const [r, g, b] = parseColor(color)?.map((c: any) => {\n c /= 255;\n return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n });\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n const name = baseColor;\n\n const response: Palette = {\n name,\n colors: {\n 500: `#${baseColor}`.replace(\"##\", \"#\")\n }\n };\n\n const intensityMap: {\n [key: number]: number;\n } = {\n 50: 0.95,\n 100: 0.9,\n 200: 0.75,\n 300: 0.6,\n 400: 0.3,\n 600: 0.9,\n 700: 0.75,\n 800: 0.6,\n 900: 0.49\n };\n\n [50, 100, 200, 300, 400].forEach((level) => {\n response.colors[level] = lighten(baseColor, intensityMap[level]);\n });\n [600, 700, 800, 900].forEach((level) => {\n response.colors[level] = darken(baseColor, intensityMap[level]);\n });\n\n return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n// let d = hex?.split(\"#\")[1];\n// var aRgbHex = d?.match(/.{1,2}/g);\n// var aRgb = [\n// parseInt(aRgbHex[0], 16),\n// parseInt(aRgbHex[1], 16),\n// parseInt(aRgbHex[2], 16)\n// ];\n// return aRgb;\n// };\n// const getTextColor = (backColor) => {\n// let rgbArray = hexToRgb(backColor);\n// if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n// return \"#000000\";\n// } else {\n// return \"#ffffff\";\n// }\n// };\n// const replaceAt = function (string, index, replacement) {\n// // if (replacement == \"\" || replacement == \" \") {\n// // return (\n// // string.substring(0, index) +\n// // string.substring(index + replacement.length )\n// // );\n// // }\n// const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n// return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nexport type ChipColors =\n | \"green\"\n | \"blue\"\n | \"red\"\n | \"yellow\"\n | \"orange\"\n | \"purple\"\n | \"cyan\"\n | \"hyper\"\n | \"oceanic\";\n\nexport type ChipTypes = React.HTMLAttributes<HTMLSpanElement> & {\n /** The text inside the chip */\n label: string;\n /** The small icon before the chip label */\n icon?: JSX.Element;\n /** The color of the chip, must be a tailwind color */\n color?: ChipColors;\n /** The size of the chip */\n size?: \"small\" | \"normal\" | \"large\";\n /** Enable/Disable the dot before the label of the chip */\n dot?: boolean;\n /** Red/Green dot next to the label of the chip indicating online/offline or available/unavailable */\n dotStatus?: \"available\" | \"unavailable\" | \"none\";\n radius?: RadiusType;\n};\n\nexport const Chip = React.forwardRef<HTMLSpanElement, ChipTypes>(\n (\n {\n label,\n size = \"normal\",\n icon,\n color,\n radius = \"inherit\",\n dot,\n dotStatus = \"none\",\n ...rest\n },\n ref,\n ) => {\n let defaultStyles =\n \"hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold \";\n let radiusStyles = {\n inherit: \" hawa-rounded\",\n full: \"hawa-rounded-full\",\n none: \"hawa-rounded-none\",\n };\n let sizeStyles = {\n small:\n \"hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 \",\n normal: \"hawa-h-fit hawa-text-xs\",\n large: \"hawa-text-base\",\n };\n let dotStyles = {\n small: \"hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full\",\n normal: \"hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full\",\n large: \"hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full\",\n };\n let dotStatusStyles = {\n none: \"hawa-bg-gray-500 dark:hawa-bg-gray-800\",\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\",\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-200 hawa-text-green-700 dark:hawa-bg-green-700 dark:hawa-text-green-200\",\n blue: \"hawa-bg-blue-200 hawa-text-blue-700 dark:hawa-bg-blue-700 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-200 hawa-text-red-700 dark:hawa-bg-red-700 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-200 hawa-text-yellow-700 dark:hawa-bg-yellow-600 dark:hawa-text-black\",\n orange:\n \"hawa-bg-orange-200 hawa-text-orange-700 dark:hawa-bg-orange-700 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-200 hawa-text-purple-700 dark:hawa-bg-purple-700 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-200 hawa-text-cyan-700 dark:hawa-bg-cyan-700 dark:hawa-text-cyan-100\",\n hyper:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600\",\n };\n if (label) {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n defaultStyles,\n sizeStyles[size],\n radiusStyles[radius],\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n >\n {dot && (\n <span\n className={cn(dotStyles[size], dotStatusStyles[dotStatus])}\n ></span>\n )}\n {icon && icon}\n {label}\n </span>\n );\n } else {\n return (\n <span\n {...rest}\n ref={ref}\n className={cn(\n \"hawa-h-2 hawa-w-2 hawa-rounded-full\",\n color ? colorStyles[color] : \"hawa-border hawa-bg-none\",\n )}\n ></span>\n );\n }\n },\n);\n"],"mappings":"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","names":["React"]}
|