@sikka/hawa 0.29.4-next → 0.29.5-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 +1 -0
- package/dist/appLayout/index.d.ts +1 -0
- package/dist/appLayout/index.js +10 -4
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs +10 -4
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/index.d.mts +3 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +10 -4
- package/dist/index.mjs +10 -4
- package/dist/layout/index.d.mts +3 -0
- package/dist/layout/index.d.ts +3 -0
- package/dist/layout/index.js +10 -4
- package/dist/layout/index.mjs +10 -4
- package/dist/sidebar/index.d.mts +2 -0
- package/dist/sidebar/index.d.ts +2 -0
- package/dist/sidebar/index.js +8 -6
- package/dist/sidebar/index.js.map +1 -1
- package/dist/sidebar/index.mjs +8 -6
- package/dist/sidebar/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
@@ -7924,8 +7924,10 @@ var SidebarGroup = ({
|
|
7924
7924
|
onItemClick,
|
7925
7925
|
onSubItemClick,
|
7926
7926
|
direction,
|
7927
|
-
isOpen
|
7927
|
+
isOpen,
|
7928
|
+
...props
|
7928
7929
|
}) => {
|
7930
|
+
const LinkComponent = props.LinkComponent || "a";
|
7929
7931
|
return /* @__PURE__ */ React63.createElement("div", { className: "hawa-m-2" }, title && /* @__PURE__ */ React63.createElement("h3", { className: "hawa-mb-1 hawa-font-bold" }, title), /* @__PURE__ */ React63.createElement("ul", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React63.createElement(
|
7930
7932
|
Accordion2,
|
7931
7933
|
{
|
@@ -7946,7 +7948,8 @@ var SidebarGroup = ({
|
|
7946
7948
|
direction,
|
7947
7949
|
item,
|
7948
7950
|
onItemClick,
|
7949
|
-
onSubItemClick
|
7951
|
+
onSubItemClick,
|
7952
|
+
LinkComponent
|
7950
7953
|
}
|
7951
7954
|
))
|
7952
7955
|
)));
|
@@ -7957,6 +7960,7 @@ var SidebarItem = ({
|
|
7957
7960
|
onSubItemClick,
|
7958
7961
|
direction,
|
7959
7962
|
isOpen = true,
|
7963
|
+
LinkComponent,
|
7960
7964
|
...props
|
7961
7965
|
}) => {
|
7962
7966
|
const getSelectedStyle = (value) => {
|
@@ -8010,7 +8014,7 @@ var SidebarItem = ({
|
|
8010
8014
|
)
|
8011
8015
|
},
|
8012
8016
|
item.subitems.map((subitem, idx) => /* @__PURE__ */ React63.createElement(
|
8013
|
-
|
8017
|
+
LinkComponent,
|
8014
8018
|
{
|
8015
8019
|
href: subitem.slug,
|
8016
8020
|
key: idx,
|
@@ -8219,6 +8223,7 @@ var AppLayout = ({
|
|
8219
8223
|
clickedItem,
|
8220
8224
|
setKeepOpen,
|
8221
8225
|
keepOpen,
|
8226
|
+
LinkComponent,
|
8222
8227
|
...props
|
8223
8228
|
}) => {
|
8224
8229
|
var _a, _b;
|
@@ -8464,7 +8469,8 @@ var AppLayout = ({
|
|
8464
8469
|
openedItem: openedSidebarItem,
|
8465
8470
|
setOpenedItem: (e) => setOpenedSidebarItem(e),
|
8466
8471
|
isOpen: keepOpen || openSideMenu,
|
8467
|
-
items: props.drawerItems
|
8472
|
+
items: props.drawerItems,
|
8473
|
+
LinkComponent
|
8468
8474
|
}
|
8469
8475
|
)
|
8470
8476
|
),
|
package/dist/layout/index.d.mts
CHANGED
@@ -53,6 +53,7 @@ interface SidebarGroupProps {
|
|
53
53
|
onItemClick?: (value: string[]) => void;
|
54
54
|
onSubItemClick?: (values: string[]) => void;
|
55
55
|
direction?: DirectionType;
|
56
|
+
LinkComponent?: any;
|
56
57
|
}
|
57
58
|
declare const SidebarGroup: React.FC<SidebarGroupProps>;
|
58
59
|
declare const SidebarItem: React.FC<{
|
@@ -62,6 +63,7 @@ declare const SidebarItem: React.FC<{
|
|
62
63
|
onItemClick?: (value: string[]) => void;
|
63
64
|
onSubItemClick?: (values: string[]) => void;
|
64
65
|
isOpen?: boolean;
|
66
|
+
LinkComponent?: any;
|
65
67
|
}>;
|
66
68
|
|
67
69
|
type CopyRightsTypes = {
|
@@ -161,6 +163,7 @@ type AppLayoutTypes$1 = {
|
|
161
163
|
symbolLogoImg?: string;
|
162
164
|
logoContainer?: string;
|
163
165
|
};
|
166
|
+
LinkComponent?: any;
|
164
167
|
};
|
165
168
|
declare const AppLayout: React__default.FunctionComponent<AppLayoutTypes$1>;
|
166
169
|
|
package/dist/layout/index.d.ts
CHANGED
@@ -53,6 +53,7 @@ interface SidebarGroupProps {
|
|
53
53
|
onItemClick?: (value: string[]) => void;
|
54
54
|
onSubItemClick?: (values: string[]) => void;
|
55
55
|
direction?: DirectionType;
|
56
|
+
LinkComponent?: any;
|
56
57
|
}
|
57
58
|
declare const SidebarGroup: React.FC<SidebarGroupProps>;
|
58
59
|
declare const SidebarItem: React.FC<{
|
@@ -62,6 +63,7 @@ declare const SidebarItem: React.FC<{
|
|
62
63
|
onItemClick?: (value: string[]) => void;
|
63
64
|
onSubItemClick?: (values: string[]) => void;
|
64
65
|
isOpen?: boolean;
|
66
|
+
LinkComponent?: any;
|
65
67
|
}>;
|
66
68
|
|
67
69
|
type CopyRightsTypes = {
|
@@ -161,6 +163,7 @@ type AppLayoutTypes$1 = {
|
|
161
163
|
symbolLogoImg?: string;
|
162
164
|
logoContainer?: string;
|
163
165
|
};
|
166
|
+
LinkComponent?: any;
|
164
167
|
};
|
165
168
|
declare const AppLayout: React__default.FunctionComponent<AppLayoutTypes$1>;
|
166
169
|
|
package/dist/layout/index.js
CHANGED
@@ -355,8 +355,10 @@ var SidebarGroup = ({
|
|
355
355
|
onItemClick,
|
356
356
|
onSubItemClick,
|
357
357
|
direction,
|
358
|
-
isOpen
|
358
|
+
isOpen,
|
359
|
+
...props
|
359
360
|
}) => {
|
361
|
+
const LinkComponent = props.LinkComponent || "a";
|
360
362
|
return /* @__PURE__ */ React5.createElement("div", { className: "hawa-m-2" }, title && /* @__PURE__ */ React5.createElement("h3", { className: "hawa-mb-1 hawa-font-bold" }, title), /* @__PURE__ */ React5.createElement("ul", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React5.createElement(
|
361
363
|
Accordion,
|
362
364
|
{
|
@@ -377,7 +379,8 @@ var SidebarGroup = ({
|
|
377
379
|
direction,
|
378
380
|
item,
|
379
381
|
onItemClick,
|
380
|
-
onSubItemClick
|
382
|
+
onSubItemClick,
|
383
|
+
LinkComponent
|
381
384
|
}
|
382
385
|
))
|
383
386
|
)));
|
@@ -388,6 +391,7 @@ var SidebarItem = ({
|
|
388
391
|
onSubItemClick,
|
389
392
|
direction,
|
390
393
|
isOpen = true,
|
394
|
+
LinkComponent,
|
391
395
|
...props
|
392
396
|
}) => {
|
393
397
|
const getSelectedStyle = (value) => {
|
@@ -441,7 +445,7 @@ var SidebarItem = ({
|
|
441
445
|
)
|
442
446
|
},
|
443
447
|
item.subitems.map((subitem, idx) => /* @__PURE__ */ React5.createElement(
|
444
|
-
|
448
|
+
LinkComponent,
|
445
449
|
{
|
446
450
|
href: subitem.slug,
|
447
451
|
key: idx,
|
@@ -1348,6 +1352,7 @@ var AppLayout = ({
|
|
1348
1352
|
clickedItem,
|
1349
1353
|
setKeepOpen,
|
1350
1354
|
keepOpen,
|
1355
|
+
LinkComponent,
|
1351
1356
|
...props
|
1352
1357
|
}) => {
|
1353
1358
|
var _a, _b;
|
@@ -1593,7 +1598,8 @@ var AppLayout = ({
|
|
1593
1598
|
openedItem: openedSidebarItem,
|
1594
1599
|
setOpenedItem: (e) => setOpenedSidebarItem(e),
|
1595
1600
|
isOpen: keepOpen || openSideMenu,
|
1596
|
-
items: props.drawerItems
|
1601
|
+
items: props.drawerItems,
|
1602
|
+
LinkComponent
|
1597
1603
|
}
|
1598
1604
|
)
|
1599
1605
|
),
|
package/dist/layout/index.mjs
CHANGED
@@ -106,8 +106,10 @@ var SidebarGroup = ({
|
|
106
106
|
onItemClick,
|
107
107
|
onSubItemClick,
|
108
108
|
direction,
|
109
|
-
isOpen
|
109
|
+
isOpen,
|
110
|
+
...props
|
110
111
|
}) => {
|
112
|
+
const LinkComponent = props.LinkComponent || "a";
|
111
113
|
return /* @__PURE__ */ React2.createElement("div", { className: "hawa-m-2" }, title && /* @__PURE__ */ React2.createElement("h3", { className: "hawa-mb-1 hawa-font-bold" }, title), /* @__PURE__ */ React2.createElement("ul", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React2.createElement(
|
112
114
|
Accordion,
|
113
115
|
{
|
@@ -128,7 +130,8 @@ var SidebarGroup = ({
|
|
128
130
|
direction,
|
129
131
|
item,
|
130
132
|
onItemClick,
|
131
|
-
onSubItemClick
|
133
|
+
onSubItemClick,
|
134
|
+
LinkComponent
|
132
135
|
}
|
133
136
|
))
|
134
137
|
)));
|
@@ -139,6 +142,7 @@ var SidebarItem = ({
|
|
139
142
|
onSubItemClick,
|
140
143
|
direction,
|
141
144
|
isOpen = true,
|
145
|
+
LinkComponent,
|
142
146
|
...props
|
143
147
|
}) => {
|
144
148
|
const getSelectedStyle = (value) => {
|
@@ -192,7 +196,7 @@ var SidebarItem = ({
|
|
192
196
|
)
|
193
197
|
},
|
194
198
|
item.subitems.map((subitem, idx) => /* @__PURE__ */ React2.createElement(
|
195
|
-
|
199
|
+
LinkComponent,
|
196
200
|
{
|
197
201
|
href: subitem.slug,
|
198
202
|
key: idx,
|
@@ -401,6 +405,7 @@ var AppLayout = ({
|
|
401
405
|
clickedItem,
|
402
406
|
setKeepOpen,
|
403
407
|
keepOpen,
|
408
|
+
LinkComponent,
|
404
409
|
...props
|
405
410
|
}) => {
|
406
411
|
var _a, _b;
|
@@ -646,7 +651,8 @@ var AppLayout = ({
|
|
646
651
|
openedItem: openedSidebarItem,
|
647
652
|
setOpenedItem: (e) => setOpenedSidebarItem(e),
|
648
653
|
isOpen: keepOpen || openSideMenu,
|
649
|
-
items: props.drawerItems
|
654
|
+
items: props.drawerItems,
|
655
|
+
LinkComponent
|
650
656
|
}
|
651
657
|
)
|
652
658
|
),
|
package/dist/sidebar/index.d.mts
CHANGED
@@ -34,6 +34,7 @@ interface SidebarGroupProps {
|
|
34
34
|
onItemClick?: (value: string[]) => void;
|
35
35
|
onSubItemClick?: (values: string[]) => void;
|
36
36
|
direction?: DirectionType;
|
37
|
+
LinkComponent?: any;
|
37
38
|
}
|
38
39
|
declare const SidebarGroup: React.FC<SidebarGroupProps>;
|
39
40
|
declare const SidebarItem: React.FC<{
|
@@ -43,6 +44,7 @@ declare const SidebarItem: React.FC<{
|
|
43
44
|
onItemClick?: (value: string[]) => void;
|
44
45
|
onSubItemClick?: (values: string[]) => void;
|
45
46
|
isOpen?: boolean;
|
47
|
+
LinkComponent?: any;
|
46
48
|
}>;
|
47
49
|
|
48
50
|
export { type AppSidebarItemProps, SidebarGroup, SidebarItem };
|
package/dist/sidebar/index.d.ts
CHANGED
@@ -34,6 +34,7 @@ interface SidebarGroupProps {
|
|
34
34
|
onItemClick?: (value: string[]) => void;
|
35
35
|
onSubItemClick?: (values: string[]) => void;
|
36
36
|
direction?: DirectionType;
|
37
|
+
LinkComponent?: any;
|
37
38
|
}
|
38
39
|
declare const SidebarGroup: React.FC<SidebarGroupProps>;
|
39
40
|
declare const SidebarItem: React.FC<{
|
@@ -43,6 +44,7 @@ declare const SidebarItem: React.FC<{
|
|
43
44
|
onItemClick?: (value: string[]) => void;
|
44
45
|
onSubItemClick?: (values: string[]) => void;
|
45
46
|
isOpen?: boolean;
|
47
|
+
LinkComponent?: any;
|
46
48
|
}>;
|
47
49
|
|
48
50
|
export { type AppSidebarItemProps, SidebarGroup, SidebarItem };
|
package/dist/sidebar/index.js
CHANGED
@@ -40,9 +40,6 @@ module.exports = __toCommonJS(sidebar_exports);
|
|
40
40
|
var React2 = __toESM(require("react"));
|
41
41
|
var AccordionPrimitive = __toESM(require("@radix-ui/react-accordion"));
|
42
42
|
|
43
|
-
// elements/chip/Chip.tsx
|
44
|
-
var import_react = __toESM(require("react"));
|
45
|
-
|
46
43
|
// util/index.ts
|
47
44
|
var import_clsx = require("clsx");
|
48
45
|
var import_tailwind_merge = require("tailwind-merge");
|
@@ -51,6 +48,7 @@ function cn(...inputs) {
|
|
51
48
|
}
|
52
49
|
|
53
50
|
// elements/chip/Chip.tsx
|
51
|
+
var import_react = __toESM(require("react"));
|
54
52
|
var Chip = import_react.default.forwardRef(
|
55
53
|
({
|
56
54
|
label,
|
@@ -180,8 +178,10 @@ var SidebarGroup = ({
|
|
180
178
|
onItemClick,
|
181
179
|
onSubItemClick,
|
182
180
|
direction,
|
183
|
-
isOpen
|
181
|
+
isOpen,
|
182
|
+
...props
|
184
183
|
}) => {
|
184
|
+
const LinkComponent = props.LinkComponent || "a";
|
185
185
|
return /* @__PURE__ */ React2.createElement("div", { className: "hawa-m-2" }, title && /* @__PURE__ */ React2.createElement("h3", { className: "hawa-mb-1 hawa-font-bold" }, title), /* @__PURE__ */ React2.createElement("ul", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React2.createElement(
|
186
186
|
Accordion,
|
187
187
|
{
|
@@ -202,7 +202,8 @@ var SidebarGroup = ({
|
|
202
202
|
direction,
|
203
203
|
item,
|
204
204
|
onItemClick,
|
205
|
-
onSubItemClick
|
205
|
+
onSubItemClick,
|
206
|
+
LinkComponent
|
206
207
|
}
|
207
208
|
))
|
208
209
|
)));
|
@@ -213,6 +214,7 @@ var SidebarItem = ({
|
|
213
214
|
onSubItemClick,
|
214
215
|
direction,
|
215
216
|
isOpen = true,
|
217
|
+
LinkComponent,
|
216
218
|
...props
|
217
219
|
}) => {
|
218
220
|
const getSelectedStyle = (value) => {
|
@@ -266,7 +268,7 @@ var SidebarItem = ({
|
|
266
268
|
)
|
267
269
|
},
|
268
270
|
item.subitems.map((subitem, idx) => /* @__PURE__ */ React2.createElement(
|
269
|
-
|
271
|
+
LinkComponent,
|
270
272
|
{
|
271
273
|
href: subitem.slug,
|
272
274
|
key: idx,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../layout/sidebar/index.ts","../../layout/sidebar/Sidebar.tsx","../../elements/chip/Chip.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./Sidebar\";\n","import * as React from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\nimport { cn } from \"@util/index\";\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 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}\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}) => {\n // console.log(\"selected item is \", selectedItem)\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 />\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}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\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 </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 <a\n href={subitem.slug}\n key={idx}\n onMouseDown={(e) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n // if (onItemClick) {\n // onItemClick([item.value]);\n // }\n }}\n onClick={(e) => {\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 </a>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <a\n href={item.slug}\n dir={direction}\n onMouseDown={(e) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e) => {\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 </a>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import React from \"react\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 dotType?: \"available\" | \"unavailable\";\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 dotType,\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 dotTypeStyles = {\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\"\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-100 hawa-text-green-500 dark:hawa-bg-green-400 dark:hawa-text-green-800\",\n blue: \"hawa-bg-blue-100 hawa-text-blue-500 dark:hawa-bg-blue-400 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-100 hawa-text-red-500 dark:hawa-bg-red-400 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-100 hawa-text-yellow-600 dark:hawa-bg-yellow-400 dark:hawa-text-yellow-800\",\n orange:\n \"hawa-bg-orange-100 hawa-text-orange-500 dark:hawa-bg-orange-400 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-100 hawa-text-purple-500 dark:hawa-bg-purple-400 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-100 hawa-text-cyan-800 dark:hawa-bg-cyan-400 dark:hawa-text-cyan-800\",\n hyper:\n \"hawa-text-white hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white 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 {dotType && (\n <span\n className={cn(dotStyles[size], dotTypeStyles[dotType])}\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","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"],"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 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 </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 </LinkComponent>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <a\n href={item.slug}\n dir={direction}\n onMouseDown={(e) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e) => {\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 </a>\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 { RadiusType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 dotType?: \"available\" | \"unavailable\";\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 dotType,\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 dotTypeStyles = {\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\"\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-100 hawa-text-green-500 dark:hawa-bg-green-400 dark:hawa-text-green-800\",\n blue: \"hawa-bg-blue-100 hawa-text-blue-500 dark:hawa-bg-blue-400 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-100 hawa-text-red-500 dark:hawa-bg-red-400 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-100 hawa-text-yellow-600 dark:hawa-bg-yellow-400 dark:hawa-text-yellow-800\",\n orange:\n \"hawa-bg-orange-100 hawa-text-orange-500 dark:hawa-bg-orange-400 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-100 hawa-text-purple-500 dark:hawa-bg-purple-400 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-100 hawa-text-cyan-800 dark:hawa-bg-cyan-400 dark:hawa-text-cyan-800\",\n hyper:\n \"hawa-text-white hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white 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 {dotType && (\n <span\n className={cn(dotStyles[size], dotTypeStyles[dotType])}\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"]}
|
package/dist/sidebar/index.mjs
CHANGED
@@ -4,9 +4,6 @@
|
|
4
4
|
import * as React2 from "react";
|
5
5
|
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
6
6
|
|
7
|
-
// elements/chip/Chip.tsx
|
8
|
-
import React from "react";
|
9
|
-
|
10
7
|
// util/index.ts
|
11
8
|
import { clsx } from "clsx";
|
12
9
|
import { twMerge } from "tailwind-merge";
|
@@ -15,6 +12,7 @@ function cn(...inputs) {
|
|
15
12
|
}
|
16
13
|
|
17
14
|
// elements/chip/Chip.tsx
|
15
|
+
import React from "react";
|
18
16
|
var Chip = React.forwardRef(
|
19
17
|
({
|
20
18
|
label,
|
@@ -144,8 +142,10 @@ var SidebarGroup = ({
|
|
144
142
|
onItemClick,
|
145
143
|
onSubItemClick,
|
146
144
|
direction,
|
147
|
-
isOpen
|
145
|
+
isOpen,
|
146
|
+
...props
|
148
147
|
}) => {
|
148
|
+
const LinkComponent = props.LinkComponent || "a";
|
149
149
|
return /* @__PURE__ */ React2.createElement("div", { className: "hawa-m-2" }, title && /* @__PURE__ */ React2.createElement("h3", { className: "hawa-mb-1 hawa-font-bold" }, title), /* @__PURE__ */ React2.createElement("ul", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React2.createElement(
|
150
150
|
Accordion,
|
151
151
|
{
|
@@ -166,7 +166,8 @@ var SidebarGroup = ({
|
|
166
166
|
direction,
|
167
167
|
item,
|
168
168
|
onItemClick,
|
169
|
-
onSubItemClick
|
169
|
+
onSubItemClick,
|
170
|
+
LinkComponent
|
170
171
|
}
|
171
172
|
))
|
172
173
|
)));
|
@@ -177,6 +178,7 @@ var SidebarItem = ({
|
|
177
178
|
onSubItemClick,
|
178
179
|
direction,
|
179
180
|
isOpen = true,
|
181
|
+
LinkComponent,
|
180
182
|
...props
|
181
183
|
}) => {
|
182
184
|
const getSelectedStyle = (value) => {
|
@@ -230,7 +232,7 @@ var SidebarItem = ({
|
|
230
232
|
)
|
231
233
|
},
|
232
234
|
item.subitems.map((subitem, idx) => /* @__PURE__ */ React2.createElement(
|
233
|
-
|
235
|
+
LinkComponent,
|
234
236
|
{
|
235
237
|
href: subitem.slug,
|
236
238
|
key: idx,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../layout/sidebar/Sidebar.tsx","../../elements/chip/Chip.tsx","../../util/index.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\";\n\nimport { Chip, ChipColors } from \"../../elements/chip\";\nimport { cn } from \"@util/index\";\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 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}\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}) => {\n // console.log(\"selected item is \", selectedItem)\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 />\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}> = ({\n item,\n onItemClick,\n onSubItemClick,\n direction,\n isOpen = true,\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 </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 <a\n href={subitem.slug}\n key={idx}\n onMouseDown={(e) => {\n if (subitem.onMouseDown) {\n subitem.onMouseDown(e);\n }\n // if (onItemClick) {\n // onItemClick([item.value]);\n // }\n }}\n onClick={(e) => {\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 </a>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <a\n href={item.slug}\n dir={direction}\n onMouseDown={(e) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e) => {\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 </a>\n );\n }\n};\nexport { SidebarGroup, SidebarItem };\n","import React from \"react\";\n\nimport { RadiusType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 dotType?: \"available\" | \"unavailable\";\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 dotType,\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 dotTypeStyles = {\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\"\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-100 hawa-text-green-500 dark:hawa-bg-green-400 dark:hawa-text-green-800\",\n blue: \"hawa-bg-blue-100 hawa-text-blue-500 dark:hawa-bg-blue-400 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-100 hawa-text-red-500 dark:hawa-bg-red-400 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-100 hawa-text-yellow-600 dark:hawa-bg-yellow-400 dark:hawa-text-yellow-800\",\n orange:\n \"hawa-bg-orange-100 hawa-text-orange-500 dark:hawa-bg-orange-400 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-100 hawa-text-purple-500 dark:hawa-bg-purple-400 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-100 hawa-text-cyan-800 dark:hawa-bg-cyan-400 dark:hawa-text-cyan-800\",\n hyper:\n \"hawa-text-white hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white 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 {dotType && (\n <span\n className={cn(dotStyles[size], dotTypeStyles[dotType])}\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","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"],"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 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 </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 </LinkComponent>\n ))}\n </div>\n </AccordionContent>\n )}\n </AccordionItem>\n );\n } else {\n return (\n <a\n href={item.slug}\n dir={direction}\n onMouseDown={(e) => {\n if (item.onMouseDown) {\n item.onMouseDown(e);\n }\n }}\n onClick={(e) => {\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 </a>\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 { RadiusType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\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 dotType?: \"available\" | \"unavailable\";\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 dotType,\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 dotTypeStyles = {\n available: \"hawa-bg-green-500\",\n unavailable: \"hawa-bg-red-500\"\n };\n let colorStyles: any = {\n green:\n \"hawa-bg-green-100 hawa-text-green-500 dark:hawa-bg-green-400 dark:hawa-text-green-800\",\n blue: \"hawa-bg-blue-100 hawa-text-blue-500 dark:hawa-bg-blue-400 dark:hawa-text-blue-100\",\n red: \"hawa-bg-red-100 hawa-text-red-500 dark:hawa-bg-red-400 dark:hawa-text-red-100\",\n yellow:\n \"hawa-bg-yellow-100 hawa-text-yellow-600 dark:hawa-bg-yellow-400 dark:hawa-text-yellow-800\",\n orange:\n \"hawa-bg-orange-100 hawa-text-orange-500 dark:hawa-bg-orange-400 dark:hawa-text-orange-100\",\n purple:\n \"hawa-bg-purple-100 hawa-text-purple-500 dark:hawa-bg-purple-400 dark:hawa-text-purple-100\",\n cyan: \"hawa-bg-cyan-100 hawa-text-cyan-800 dark:hawa-bg-cyan-400 dark:hawa-text-cyan-800\",\n hyper:\n \"hawa-text-white hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 \",\n oceanic:\n \"hawa-text-white 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 {dotType && (\n <span\n className={cn(dotStyles[size], dotTypeStyles[dotType])}\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,YAAYA,YAAW;AAEvB,YAAY,wBAAwB;;;ACFpC,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACLA,OAAO,WAAW;AAiCX,IAAM,OAAO,MAAM;AAAA,EACxB,CACE;AAAA,IACE;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,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,gBAAgB;AAAA,MAClB,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;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,WACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,UAAU,IAAI,GAAG,cAAc,OAAO,CAAC;AAAA;AAAA,QACtD;AAAA,QAEF,QAAQ;AAAA,QACR;AAAA,MACH;AAAA,IAEJ,OAAO;AACL,aACE;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;;;AF9GA,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;AAiC1D,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,sEACA;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,UACR;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,QACX,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,MAAM;AAClB,cAAI,KAAK,aAAa;AACpB,iBAAK,YAAY,CAAC;AAAA,UACpB;AAAA,QACF;AAAA,QACA,SAAS,CAAC,MAAM;AACd,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,qCAAC,QAAK,OAAO,KAAK,MAAM,OAAO,OAAM,SAAQ,MAAK,SAAQ;AAAA,MAE9D,CACF;AAAA,IACF;AAAA,EAEJ;AACF;","names":["React"]}
|