@sikka/hawa 0.34.1-next → 0.34.2-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.js +53 -82
- package/dist/appLayout/index.js.map +1 -1
- package/dist/appLayout/index.mjs +53 -82
- package/dist/appLayout/index.mjs.map +1 -1
- package/dist/index.css +15 -6
- package/dist/index.js +53 -82
- package/dist/index.mjs +53 -82
- package/dist/layout/index.js +53 -82
- package/dist/layout/index.mjs +53 -82
- package/package.json +1 -1
package/dist/layout/index.mjs
CHANGED
|
@@ -466,12 +466,12 @@ var AppLayout = ({
|
|
|
466
466
|
setOpenSideMenu(false);
|
|
467
467
|
}
|
|
468
468
|
}, [size]);
|
|
469
|
-
return /* @__PURE__ */ React5.createElement("div", { className: "hawa-fixed hawa-
|
|
469
|
+
return /* @__PURE__ */ React5.createElement("div", { className: "hawa-fixed hawa-start-0" }, props.topBar && /* @__PURE__ */ React5.createElement(
|
|
470
470
|
"div",
|
|
471
471
|
{
|
|
472
|
+
dir: direction,
|
|
472
473
|
className: cn(
|
|
473
|
-
"hawa-fixed hawa-
|
|
474
|
-
isRTL ? "hawa-flex-row-reverse" : "hawa-flex-row",
|
|
474
|
+
"hawa-fixed hawa-end-0 hawa-start-0 hawa-top-0 hawa-z-0 hawa-flex hawa-h-14 hawa-w-full hawa-items-center hawa-justify-between hawa-bg-primary-foreground hawa-p-2",
|
|
475
475
|
bordered && "hawa-border-b-[1px]"
|
|
476
476
|
)
|
|
477
477
|
},
|
|
@@ -480,18 +480,10 @@ var AppLayout = ({
|
|
|
480
480
|
{
|
|
481
481
|
className: cn(
|
|
482
482
|
"dark:hawa-text-white",
|
|
483
|
-
|
|
484
|
-
size > 600 ? "hawa-mr-14" : "hawa-mr-2",
|
|
485
|
-
keepDrawerOpen ? "hawa-mr-40" : ""
|
|
486
|
-
] : [
|
|
487
|
-
size > 600 ? "hawa-ml-14" : "hawa-ml-2",
|
|
488
|
-
keepDrawerOpen ? "hawa-ml-40" : ""
|
|
489
|
-
]
|
|
483
|
+
size > 600 ? "hawa-ms-14" : "hawa-ms-2"
|
|
490
484
|
),
|
|
491
|
-
style:
|
|
492
|
-
|
|
493
|
-
} : {
|
|
494
|
-
marginLeft: `${drawerSizeStyle[keepDrawerOpen ? "opened" : "closed"][drawerSize]}px`
|
|
485
|
+
style: {
|
|
486
|
+
marginInlineStart: `${drawerSizeStyle[keepDrawerOpen ? "opened" : "closed"][drawerSize] + 10}px`
|
|
495
487
|
}
|
|
496
488
|
},
|
|
497
489
|
props.pageTitle
|
|
@@ -514,71 +506,51 @@ var AppLayout = ({
|
|
|
514
506
|
props.pageTitle ? /* @__PURE__ */ React5.createElement("div", { className: "hawa-text-sm" }, props.pageTitle) : /* @__PURE__ */ React5.createElement("div", null)
|
|
515
507
|
)
|
|
516
508
|
),
|
|
517
|
-
/* @__PURE__ */ React5.createElement(
|
|
518
|
-
|
|
509
|
+
/* @__PURE__ */ React5.createElement("div", { className: cn("hawa-flex hawa-gap-2 dark:hawa-text-white") }, size > 600 ? /* @__PURE__ */ React5.createElement("div", { className: "hawa-text-end hawa-text-xs" }, /* @__PURE__ */ React5.createElement("div", { className: "hawa-font-bold" }, props.username), " ", /* @__PURE__ */ React5.createElement("div", null, props.email)) : null, /* @__PURE__ */ React5.createElement(
|
|
510
|
+
DropdownMenu,
|
|
519
511
|
{
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
/* @__PURE__ */ React5.createElement(
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
triggerClassname: "hawa-mx-2",
|
|
539
|
-
align: "end",
|
|
540
|
-
alignOffset: 8,
|
|
541
|
-
side: "bottom",
|
|
542
|
-
sideOffset: 5,
|
|
543
|
-
width: profileMenuWidth,
|
|
544
|
-
direction: isRTL ? "rtl" : "ltr",
|
|
545
|
-
items: props.profileMenuItems || [],
|
|
546
|
-
onItemSelect: (e) => console.log("selecting item ", e),
|
|
547
|
-
trigger: /* @__PURE__ */ React5.createElement(
|
|
548
|
-
"div",
|
|
512
|
+
LinkComponent: MenuLinkComponent,
|
|
513
|
+
triggerClassname: "hawa-mx-2",
|
|
514
|
+
align: "end",
|
|
515
|
+
alignOffset: 8,
|
|
516
|
+
side: "bottom",
|
|
517
|
+
sideOffset: 5,
|
|
518
|
+
width: profileMenuWidth,
|
|
519
|
+
direction,
|
|
520
|
+
items: props.profileMenuItems || [],
|
|
521
|
+
onItemSelect: (e) => console.log("selecting item ", e),
|
|
522
|
+
trigger: /* @__PURE__ */ React5.createElement(
|
|
523
|
+
"div",
|
|
524
|
+
{
|
|
525
|
+
onClick: onAvatarClick,
|
|
526
|
+
className: "hawa-relative hawa-h-8 hawa-w-8 hawa-cursor-pointer hawa-overflow-clip hawa-rounded hawa-ring-1 hawa-ring-primary/30 dark:hawa-bg-gray-600"
|
|
527
|
+
},
|
|
528
|
+
props.avatarImage ? /* @__PURE__ */ React5.createElement("img", { src: props.avatarImage, alt: "User Avatar" }) : /* @__PURE__ */ React5.createElement(
|
|
529
|
+
"svg",
|
|
549
530
|
{
|
|
550
|
-
|
|
551
|
-
className: "hawa-
|
|
531
|
+
"aria-label": "Avatar Icon",
|
|
532
|
+
className: "hawa-absolute hawa--start-1 hawa-h-10 hawa-w-10 hawa-text-gray-400",
|
|
533
|
+
fill: "currentColor",
|
|
534
|
+
viewBox: "0 0 20 20"
|
|
552
535
|
},
|
|
553
|
-
|
|
554
|
-
"
|
|
536
|
+
/* @__PURE__ */ React5.createElement(
|
|
537
|
+
"path",
|
|
555
538
|
{
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
},
|
|
561
|
-
/* @__PURE__ */ React5.createElement(
|
|
562
|
-
"path",
|
|
563
|
-
{
|
|
564
|
-
fillRule: "evenodd",
|
|
565
|
-
d: "M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z",
|
|
566
|
-
clipRule: "evenodd"
|
|
567
|
-
}
|
|
568
|
-
)
|
|
539
|
+
fillRule: "evenodd",
|
|
540
|
+
d: "M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z",
|
|
541
|
+
clipRule: "evenodd"
|
|
542
|
+
}
|
|
569
543
|
)
|
|
570
544
|
)
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
)
|
|
545
|
+
)
|
|
546
|
+
}
|
|
547
|
+
))
|
|
574
548
|
), /* @__PURE__ */ React5.createElement(
|
|
575
549
|
"div",
|
|
576
550
|
{
|
|
577
551
|
className: cn(
|
|
578
|
-
"hawa-fixed hawa-z-0 hawa-flex hawa-flex-col hawa-justify-between hawa-overflow-x-clip hawa-transition-all hawa-bg-
|
|
579
|
-
isRTL ? "hawa-right-0
|
|
580
|
-
"hawa-h-[calc(100dvh)]",
|
|
581
|
-
"hawa-bg-primary-foreground",
|
|
552
|
+
"hawa-fixed hawa-z-0 hawa-flex hawa-flex-col hawa-justify-between hawa-overflow-x-clip hawa-transition-all hawa-top-0 hawa-h-[calc(100dvh)] hawa-bg-primary-foreground",
|
|
553
|
+
isRTL ? "hawa-right-0" : "hawa-left-0",
|
|
582
554
|
bordered ? direction === "rtl" ? "hawa-border-s-[1px]" : "hawa-border-e-[1px]" : ""
|
|
583
555
|
),
|
|
584
556
|
style: {
|
|
@@ -620,7 +592,7 @@ var AppLayout = ({
|
|
|
620
592
|
"img",
|
|
621
593
|
{
|
|
622
594
|
className: cn(
|
|
623
|
-
"hawa-h-9
|
|
595
|
+
"hawa-h-9 hawa-opacity-0 hawa-transition-all",
|
|
624
596
|
!openSideMenu ? "hawa-invisible hawa-opacity-0" : "hawa-visible hawa-opacity-100",
|
|
625
597
|
classNames == null ? void 0 : classNames.fullLogoImg
|
|
626
598
|
),
|
|
@@ -631,8 +603,7 @@ var AppLayout = ({
|
|
|
631
603
|
"img",
|
|
632
604
|
{
|
|
633
605
|
className: cn(
|
|
634
|
-
"hawa-fixed
|
|
635
|
-
isRTL ? "hawa-right-2.5 hawa-top-2.5" : "hawa-left-2.5 hawa-top-2.5",
|
|
606
|
+
"hawa-fixed hawa-h-9 hawa-transition-all hawa-start-2.5 hawa-top-2.5",
|
|
636
607
|
openSideMenu ? "hawa-invisible hawa-opacity-0" : "hawa-visible hawa-opacity-100",
|
|
637
608
|
classNames == null ? void 0 : classNames.symbolLogoImg
|
|
638
609
|
),
|
|
@@ -691,21 +662,21 @@ var AppLayout = ({
|
|
|
691
662
|
{
|
|
692
663
|
side: "left",
|
|
693
664
|
delayDuration: 500,
|
|
694
|
-
|
|
695
|
-
|
|
665
|
+
triggerProps: { asChild: true },
|
|
666
|
+
content: keepDrawerOpen ? ((_a = props.texts) == null ? void 0 : _a.collapseSidebar) || "Collapse Sidebar" : ((_b = props.texts) == null ? void 0 : _b.expandSidebar) || "Expand Sidebar"
|
|
696
667
|
},
|
|
697
668
|
/* @__PURE__ */ React5.createElement(
|
|
698
669
|
Button,
|
|
699
670
|
{
|
|
700
671
|
variant: "outline",
|
|
672
|
+
size: "smallIcon",
|
|
701
673
|
onClick: () => {
|
|
702
674
|
const newKeepOpenState = !keepDrawerOpen;
|
|
703
675
|
if (props.onDrawerExpand) {
|
|
704
676
|
props.onDrawerExpand(newKeepOpenState);
|
|
705
677
|
}
|
|
706
678
|
setKeepDrawerOpen(newKeepOpenState);
|
|
707
|
-
}
|
|
708
|
-
size: "smallIcon"
|
|
679
|
+
}
|
|
709
680
|
},
|
|
710
681
|
/* @__PURE__ */ React5.createElement(
|
|
711
682
|
"svg",
|
|
@@ -734,15 +705,15 @@ var AppLayout = ({
|
|
|
734
705
|
{
|
|
735
706
|
className: "hawa-fixed -hawa-z-10 hawa-overflow-y-auto hawa-transition-all",
|
|
736
707
|
style: isRTL ? {
|
|
737
|
-
height: `calc(100% - ${props.topBar ? "56" : "0"}px)`,
|
|
738
|
-
width: `calc(100% - ${drawerSizeCondition}px)`,
|
|
739
708
|
left: "0px",
|
|
740
|
-
top: props.topBar ? "56px" : "0px"
|
|
741
|
-
} : {
|
|
742
|
-
height: `calc(100% - ${props.topBar ? "56" : "0"}px)`,
|
|
709
|
+
top: props.topBar ? "56px" : "0px",
|
|
743
710
|
width: `calc(100% - ${drawerSizeCondition}px)`,
|
|
711
|
+
height: `calc(100% - ${props.topBar ? "56" : "0"}px)`
|
|
712
|
+
} : {
|
|
744
713
|
left: `${drawerSizeCondition}px`,
|
|
745
|
-
top: props.topBar ? "56px" : "0px"
|
|
714
|
+
top: props.topBar ? "56px" : "0px",
|
|
715
|
+
width: `calc(100% - ${drawerSizeCondition}px)`,
|
|
716
|
+
height: `calc(100% - ${props.topBar ? "56" : "0"}px)`
|
|
746
717
|
}
|
|
747
718
|
},
|
|
748
719
|
props.children
|