uangcermat-web-toolkit-v2 0.2.29 → 0.2.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { SidebarFooterInterface, SidebarHeaderInterface, SidebarInterface, SidebarPopoverInterface, SidebarUserProfileInterface } from './Sidebar.type';
3
3
  declare const Sidebar: {
4
- ({ activeId, activeParent, data, isCollapsed, notificationCountContainerStyles, notificationCountTextStyles, containerStyles, itemMenuContainerStyles, itemMenuIconStyles, itemMenuTitleStyles, itemMenuActiveBgColor, itemSubMenuContainerStyles, itemSubMenuActiveTextColor, toggleButtonContainerStyles, toggleIconOpenName, toggleIconCloseName, toggleIconStyles, onClickCollapsible, onClickNav, children }: SidebarInterface): import("react/jsx-runtime").JSX.Element;
4
+ ({ activeId, activeParent, data, isCollapsed, notificationCountContainerStyles, notificationCountTextStyles, containerStyles, itemMenuContainerStyles, itemMenuIconStyles, itemMenuTitleStyles, itemMenuActiveBgColor, itemSubMenuTitleStyles, itemSubMenuContainerStyles, itemSubMenuActiveTextColor, toggleButtonContainerStyles, toggleIconOpenName, toggleIconCloseName, toggleIconStyles, onClickCollapsible, onClickNav, children }: SidebarInterface): import("react/jsx-runtime").JSX.Element;
5
5
  Popover: {
6
6
  ({ isCollapsed, label, labelStyles, icon, iconStyles, notificationCount, notificationCountContainerStyles, notificationCountTextStyles, position, iconTriangleStyles, iconTriangleContainerStyles, panelContainerStyles, offsetX, offsetY, containerStyles, isAutoFlip, children }: SidebarPopoverInterface): import("react/jsx-runtime").JSX.Element;
7
7
  displayName: string;
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/classnames/index.js"),a=require("react");require("../../components/Avatar/Avatar.js"),require("../../components/Backdrop/Backdrop.js"),require("../../components/Badge/Badge.js");var s=require("../../components/Badge/BaseBadge.js"),n=require("../../components/Text/BaseText.js");require("../../components/Text/Text.js"),require("../../components/Breadcrumbs/BaseBreadcrumbs.js"),require("../../components/Breadcrumbs/Breadcrumbs.js"),require("../../components/Button/ButtonHyperlink.js");var o=require("../../components/Button/BaseButton.js"),l=require("../../components/Button/BaseButtonIcon.js");require("../../components/Button/Button.js"),require("../../components/Button/ButtonConfirmation.js"),require("../../components/Button/ButtonLink.js"),require("../../components/Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js"),require("../../components/Card/InfoCard.js"),require("../../components/Checkbox/Checkbox.js");var i=require("../../components/Icon/Icon.js");require("../../components/CheckPicker/BaseInfiniteCheckPicker.js"),require("../../components/CheckPicker/CheckPicker.js"),require("../../components/Container/BaseCollapsibleContainer.js"),require("../../components/DatePicker/DatePicker.js"),require("../../components/DatePicker/DatePickerRange.js"),require("../../components/DatePicker/DatePickerTime.js"),require("../../components/Heading/Heading.js"),require("../../components/IconProduct/IconProduct.js"),require("../../components/Image/Image.js"),require("../../components/LoadingIndicator/LoadingIndicator.js"),require("../../components/LoadingIndicator/LoadingIndicatorBox.js"),require("../../styles/BorderRadius.js"),require("../../styles/Spacing.js"),require("../../components/MessageBox/MessageBox.js"),require("../../components/Modal/BaseModal.js"),require("../../components/Modal/Modal.js");var r=require("../../components/Popover/BasePopover.js");require("../../components/Preview/BasePreview.js"),require("../../components/ProgressBar/ProgressBar.js"),require("../../components/ProgressIndicator/ProgressIndicator.js"),require("../../components/RadioButton/RadioButton.js"),require("../../components/SelectPicker/BaseInfiniteSelectPicker.js"),require("../../components/SelectPicker/SelectPicker.js"),require("../../components/Table/TablePage.js"),require("../../components/Table/TableResponsive.js"),require("../../components/Tabs/BaseAccordionTabs.js"),require("../../components/Tabs/Tabs.js"),require("../../components/Textarea/Textarea.js"),require("../../components/TextInput/TextInput.js"),require("../../components/TimePicker/TimePicker.js"),require("../../../node_modules/react-hot-toast/dist/index.mjs.js"),require("../../components/ToggleButton/ToggleButton.js"),require("../../components/Tooltip/BaseTooltip.js"),require("../../components/Uploader/BaseUploader.js");var c=require("../../utils/getChildrenOnDisplayName.js"),u=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=d(a);const x=()=>e.jsx("div",{className:"w-full h-[1px] bg-sidebar-separator-default"}),g=({id:o,title:l,titleStyles:r,icon:c,iconStyles:d,subMenu:x,isCollapsed:g,activeId:f,selectedId:b,notificationCountContainerStyles:p,notificationCountTextStyles:j,itemMenuContainerStyles:h,itemMenuActiveContainerStyles:v,itemMenuActiveBgColor:w,itemSubMenuContainerStyles:y,itemSubMenuActiveContainerStyles:C,itemSubMenuActiveTextColor:k,onClickCollapsible:S,onExpand:N,onClickNav:M,notifcationCount:A})=>{const B=b===o,[P,q]=m.default.useState(!1),[O,I]=m.default.useState(!1),[T,L]=m.default.useState(!1);return a.useEffect((()=>{g?q(!1):setTimeout((()=>{q(!0)}),200)}),[g]),e.jsxs("div",Object.assign({className:u.twMerge(`overflow-hidden hover:bg-sidebar-menu-background-hover rounded-lg ${B?v||"bg-sidebar-menu-background-active":"bg-transparent"}`,h),style:{backgroundColor:B?w:void 0}},{children:[e.jsx("button",Object.assign({onClick:()=>{P||B||S(),N(B?"":o)},className:"relative w-full pl-3 pr-4 bg-transparent min-h-8",onMouseDown:()=>L(!0),onMouseUp:()=>L(!1),onMouseEnter:()=>I(!0),onMouseLeave:()=>I(!1)},{children:e.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[e.jsx("div",Object.assign({className:"w-4 h-4"},{children:e.jsx(i,{name:c,className:u.twMerge(t.default("w-4 h-4 fill-sidebar-menu-textAndIcon-default",O&&"fill-sidebar-menu-textAndIcon-hover",T&&"fill-sidebar-menu-textAndIcon-active"),d)})})),P&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:l,className:u.twMerge(t.default("text-sidebar-menu-textAndIcon-default text-sm text-left w-full line-clamp-1",O&&"text-sidebar-menu-textAndIcon-hover",T&&"text-sidebar-menu-textAndIcon-active"),r)})})),!!A&&e.jsx(s,{label:A.toString(),labelStyles:u.twMerge("text-[10px] text-sidebar-notificationBadge-textAndIcon-default",j),containerStyles:u.twMerge(t.default("flex items-center justify-center min-w-[16px] h-4 rounded-full p-0.5 bg-sidebar-notificationBadge-background-default",`${!P&&"absolute right-0 top-0"}`),p)})]}))})),e.jsx("div",Object.assign({className:"flex flex-col overflow-hidden transition-[max-height] duration-500 ease-in-out "+(B&&P?"max-h-screen bg-sidebar-submenu-background-default":"max-h-0 "),style:{backgroundColor:B&&P?w:"transparent"}},{children:x.map(((t,a)=>e.jsx("button",Object.assign({onClick:()=>M(t),className:u.twMerge("\n flex flex-1 py-2 \n bg-sidebar-submenu-background-default active:bg-sidebar-submenu-background-active hover:bg-sidebar-submenu-background-hover \n text-sidebar-submenu-textAndIcon-default active:text-sidebar-submenu-textAndIcon-active hover:text-sidebar-submenu-textAndIcon-hover \n pl-8 "+(t.navLink===f?`pl-11 ${C||"text-sidebar-submenu-textAndIcon-active"}`:""),y),style:{color:t.navLink===f?k:void 0}},{children:e.jsx(n.default,{label:t.title,className:`text-xs text-left line-clamp-1 w-full ${t.navLink===f?"font-semibold":"font-normal"} `})}),a)))}))]}))},f=({activeId:t,activeParent:s,data:n,isCollapsed:o,notificationCountContainerStyles:i,notificationCountTextStyles:r,containerStyles:d,itemMenuContainerStyles:x,itemMenuIconStyles:f,itemMenuTitleStyles:b,itemMenuActiveBgColor:p,itemSubMenuContainerStyles:j,itemSubMenuActiveTextColor:h,toggleButtonContainerStyles:v,toggleIconOpenName:w,toggleIconCloseName:y,toggleIconStyles:C,onClickCollapsible:k,onClickNav:S,children:N})=>{const M=c.getChildrenOnDisplayName(N,"Header"),A=c.getChildrenOnDisplayName(N,"Footer"),B=c.getChildrenOnDisplayName(N,"UserProfile"),[P,q]=m.default.useState(s),O=a.Children.toArray(N);return e.jsxs("div",Object.assign({className:u.twMerge("flex flex-col relative h-full px-2 pb-2 ease-in-out duration-300 w-[220px] bg-sidebar-background-default",d)},{children:[M,e.jsx(l.default,{variant:"tertiary",onClick:()=>k(),iconName:o?y||"chevronDoubleArrowRight":w||"chevronDoubleArrowLeft",iconStyles:u.twMerge("w-[7.5px] h-[7.5px]",C),className:u.twMerge("w-6 h-6 absolute top-14 -right-3",v)}),e.jsx("div",Object.assign({className:"flex flex-col flex-1 mb-4 overflow-auto scrollbar scrollbar-none"},{children:e.jsx("div",Object.assign({className:"flex flex-col justify-start flex-1"},{children:n.map(((a,s)=>e.jsx(g,{selectedId:P,id:a.id,title:a.title,icon:a.icon,permission:a.permission,isCollapsed:o,activeId:t,subMenu:a.subMenu,onClickCollapsible:()=>k(),onExpand:e=>q(e),onClickNav:e=>S(e),notifcationCount:a.notifcationCount,notificationCountContainerStyles:i,notificationCountTextStyles:r,itemMenuActiveBgColor:p,itemMenuContainerStyles:x,itemSubMenuActiveTextColor:h,itemSubMenuContainerStyles:j,iconStyles:f,titleStyles:b},s)))}))})),e.jsx("div",Object.assign({className:"mb-2"},{children:a.Children.map(O,((t,a)=>{const s=c.getChildrenOnDisplayName(t,"Popover");return e.jsx("div",Object.assign({className:"w-full"},{children:s}),a)}))})),B,A]}))},b=({isCollapsed:o,label:l,labelStyles:d,icon:x,iconStyles:g,notificationCount:f,notificationCountContainerStyles:b,notificationCountTextStyles:p,position:j,iconTriangleStyles:h,iconTriangleContainerStyles:v,panelContainerStyles:w,offsetX:y,offsetY:C,containerStyles:k,isAutoFlip:S,children:N})=>{const[M,A]=m.default.useState(!1),[B,P]=m.default.useState(!1),[q,O]=m.default.useState(!1);return a.useEffect((()=>{o?A(!1):setTimeout((()=>{A(!0)}),200)}),[o]),e.jsx(r,Object.assign({position:j||"right-start",iconTriangleStyles:h,iconTriangleContainerStyles:v,panelContainerStyles:w,offsetX:y,offsetY:C,isAutoFlip:S},{children:({open:a,close:o})=>e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{children:e.jsxs("button",Object.assign({className:u.twMerge(t.default("\n h-8 pr-4 pl-3 w-full relative flex flex-row items-center rounded-lg gap-x-2\n bg-sidebar-notificationButton-background-default active:bg-sidebar-notificationButton-background-active hover:bg-sidebar-notificationButton-background-hover\n text-sidebar-notificationButton-textAndIcon-default active:text-sidebar-notificationButton-textAndIcon-active hover:text-sidebar-notificationButton-textAndIcon-hover\n ",a&&"bg-sidebar-profile-background-active text-sidebar-profile-text-active"),k),onMouseDown:()=>O(!0),onMouseUp:()=>O(!1),onMouseEnter:()=>P(!0),onMouseLeave:()=>P(!1)},{children:[e.jsx("div",Object.assign({className:"w-4 h-4"},{children:e.jsx(i,{name:x,className:u.twMerge(t.default("w-4 h-4 fill-sidebar-notificationButton-textAndIcon-default",B&&"fill-sidebar-notificationButton-textAndIcon-hover",q&&"fill-sidebar-notificationButton-textAndIcon-active"),g)})})),M&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:l,className:u.twMerge("text-sm text-left line-clamp-1 w-full",d)})})),!!f&&e.jsx(s,{label:f.toString(),labelStyles:u.twMerge("text-[10px] text-sidebar-notificationBadge-textAndIcon-default",p),containerStyles:u.twMerge(t.default("flex items-center justify-center bg-sidebar-notificationBadge-background-default min-w-[16px] h-4 rounded-full p-0.5",`${!M&&"absolute right-0 top-0"}`),b)})]}))}),e.jsx(r.Panel,{children:c.getChildrenOnDisplayName("function"==typeof N?N({open:a,close:o}):N,"PopoverPanel")})]})}))};b.displayName="Popover",f.Popover=b;const p=({children:t})=>e.jsx(e.Fragment,{children:t});p.displayName="PopoverPanel",f.PopoverPanel=p;const j=({isCollapsed:t,appLogoClosed:s,appLogoClosedStyles:n,appLogoOpened:o,appLogoOpenedStyles:l,containerStyles:i,onClickHeaderSidebar:r,children:c})=>{const[d,x]=m.default.useState(!1);return a.useEffect((()=>{t?x(!1):setTimeout((()=>{x(!0)}),200)}),[t]),e.jsx(e.Fragment,{children:c||e.jsx("div",Object.assign({className:u.twMerge("flex flex-row items-center h-14 gap-x-2 p-2 cursor-pointer",i),onClick:()=>null==r?void 0:r()},{children:d?e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx("img",{src:o||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGc.svg",className:u.twMerge("w-[113px] h-7",l)})})):e.jsx("img",{src:s||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg",className:u.twMerge("w-[22px] h-[22px]",n)})}))})};j.displayName="Header",f.Header=j;const h=({isCollapsed:s,userLabel:o,userLabelStyles:l,userAvatar:c,userAvatarFallback:d,userAvatarFallbackStyles:g,userAvatarStyles:f,containerStyles:b,panelContainerStyles:p,titleAtPanel:j,titleAtPanelStyles:h,userAvatarAtPanel:v,userAvatarAtPanelStyles:w,userAvatarFallbackAtPanel:y,userAvatarFallbackAtPanelStyles:C,userLabelAtPanel:k,userLabelAtPanelStyles:S,userEmailAtPanel:N,userEmailAtPanelStyles:M,manageAccountLabelAtPanel:A,manageAccountLabelAtPanelStyles:B,iconManageAccountAtPanel:P,iconManageAccountAtPanelStyles:q,onClickManageAccount:O,manageAccountContainerStyles:I,translationLabelAtPanel:T,translationLabelAtPanelStyles:L,iconTranslationAtPanel:F,iconTranslationAtPanelStyles:D,onClickTranslation:E,translationContainerStyles:H,logoutLabelAtPanel:R,logoutLabelAtPanelStyles:U,iconLogoutAtPanel:z,iconLogoutAtPanelStyles:G,onClickLogout:V,children:$,offsetX:_,offsetY:X,position:Y,isAutoFlip:J})=>{const[K,Q]=m.default.useState(!1);return a.useEffect((()=>{s?Q(!1):setTimeout((()=>{Q(!0)}),200)}),[s]),e.jsx(e.Fragment,{children:$||e.jsxs("div",Object.assign({className:u.twMerge("flex flex-col w-full")},{children:[e.jsx(x,{}),e.jsx("div",Object.assign({className:"relative min-h-[56px] flex items-center w-full"},{children:e.jsx(r,Object.assign({offsetX:_,offsetY:X,isAutoFlip:J,panelContainerStyles:p,containerStyles:"w-full",position:Y},{children:({open:a,close:s})=>e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{children:e.jsxs("div",Object.assign({className:u.twMerge(t.default("\n w-full flex flex-row items-center h-10 gap-x-2 p-2 rounded-lg \n bg-sidebar-profile-background-default active:bg-sidebar-profile-background-active hover:bg-sidebar-profile-background-hover \n text-sidebar-profile-text-default active:text-sidebar-profile-text-active hover:text-sidebar-profile-text-hover\n cursor-pointer\n ",a&&"bg-sidebar-profile-background-active text-sidebar-profile-text-active"),b)},{children:[c?e.jsx("img",{src:c||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png",className:u.twMerge("w-6 h-6 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover",f)}):e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded",f)},{children:e.jsx(n.default,{label:d,className:u.twMerge("font-semibold text-sidebar-avatar-text-default text-[10px]",g)})})),K&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:o||"",className:u.twMerge("line-clamp-1 w-full text-left",l)})}))]}))}),e.jsx(r.Panel,{children:e.jsxs("div",Object.assign({className:u.twMerge("flex flex-col py-3 bg-dark-solitude rounded min-w-[240px]",p)},{children:[e.jsx("div",Object.assign({className:"px-4"},{children:e.jsx(n.default,{label:j||"Account",className:u.twMerge("text-sm font-semibold text-dark-blackCoral",h)})})),e.jsxs("div",Object.assign({className:"flex flex-row items-center px-4 mt-2 gap-x-2"},{children:[v?e.jsx("img",{src:v||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png",className:u.twMerge("w-8 h-8 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover",w)}):e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-8 h-8 bg-sidebar-avatar-background-default rounded",w)},{children:e.jsx(n.default,{label:y,className:u.twMerge("font-semibold text-sidebar-avatar-text-default text-[10px]",C)})})),e.jsxs("div",Object.assign({className:"flex flex-col"},{children:[e.jsx(n.default,{label:k||"",className:u.twMerge("w-full line-clamp-1 font-normal text-sm text-dark-blackCoral",S)}),e.jsx(n.default,{label:N||"",className:u.twMerge("w-full line-clamp-1 font-normal text-[10px] text-dark-gumbo",M)})]}))]})),e.jsxs("button",Object.assign({className:u.twMerge("flex flex-row items-center px-4 gap-x-2 mt-3 bg-transparent",I),onClick:()=>{s(),null==O||O()}},{children:[e.jsx(i,{name:P||"configuration",className:u.twMerge("w-4 h-4 fill-dark-gumbo",q)}),e.jsx(n.default,{label:A||"Manage Account",className:u.twMerge("text-sm font-normal text-dark-blackCoral",B)})]})),e.jsxs("button",Object.assign({className:u.twMerge("flex flex-row items-center px-4 gap-x-2 mt-3 mb-4 bg-transparent",H),onClick:()=>{s(),null==E||E()}},{children:[e.jsx(i,{name:F||"language",className:u.twMerge("w-4 h-4 fill-dark-gumbo",D)}),e.jsx(n.default,{label:T||"Translate Page",className:u.twMerge("text-sm font-normal text-dark-blackCoral",L)})]})),e.jsx("div",{className:"h-[1px] w-full bg-dark-silver"}),e.jsxs("button",Object.assign({className:"flex flex-row items-center px-4 gap-x-2 mt-3 mb-0.5 bg-transparent",onClick:()=>{s(),null==V||V()}},{children:[e.jsx(i,{name:z||"logout",className:u.twMerge("w-4 h-4 fill-dark-gumbo",G)}),e.jsx(n.default,{label:R||"Logout",className:u.twMerge("text-sm font-normal text-dark-blackCoral",U)})]}))]}))})]})}))})),e.jsx(x,{})]}))})};h.displayName="UserProfile",f.UserProfile=h;const v=({isCollapsed:s,isShowCompanyProfile:l,companyName:i,companyNameStyles:r,companyLogo:c,companyLogoStyles:d,companyLogoFallback:x,companlogoFallbackStyles:g,companyLogoContainerStyles:f,isShowButtonChangeCompany:b,buttonChangeCompanyOnClick:p,buttonChangeCompanyLabel:j,buttonChangeCompanyStyles:h,buttonChangeCompanyIconName:v,buttonChangeCompanyIconStyles:w,appName:y,appVersion:C,children:k})=>{const[S,N]=m.default.useState(!1);return a.useEffect((()=>{s?N(!1):setTimeout((()=>{N(!0)}),200)}),[s]),e.jsx(e.Fragment,{children:k||e.jsxs("div",Object.assign({className:"px-2 pt-2"},{children:[l&&e.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[c?e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded",f)},{children:e.jsx("img",{src:c||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg",className:u.twMerge("w-4 h-4",d)})})):e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded",f)},{children:e.jsx(n.default,{label:x,className:u.twMerge("font-semibold text-sidebar-avatar-text-default text-[10px]",g)})})),S&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:i||"Gajicermat",className:u.twMerge("text-sidebar-companyNameText-default text-xs line-clamp-2",r)})}))]})),b&&e.jsx("div",Object.assign({className:"flex flex-row items-center w-full h-14"},{children:e.jsx(o.default,{variant:"secondary",onClick:()=>null==p?void 0:p(),label:S?j||"Select Company":"",className:u.twMerge(t.default("flex items-center justify-center p-0 h-6 ml-0",S?"w-full":"w-6"),h),rightIcon:S?void 0:v||"refresh",rightIconStyles:u.twMerge("ml-0 w-3 h-3",w)})})),e.jsx("div",Object.assign({className:"flex flex-row items-center w-full mt-2 gap-x-2 min-h-4"},{children:S?e.jsxs(e.Fragment,{children:[e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:y||"© Gajicermat Digital Mandiri",className:"text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-right font-normal"})})),e.jsx("div",{className:"w-[1px] h-3 bg-sidebar-appVersionText-default"}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:C||"Version 0.0.0",className:"text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-left font-normal"})}))]}):e.jsx("div",{className:"w-[1px] h-3 "})}))]}))})};v.displayName="Footer",f.Footer=v,module.exports=f;
1
+ "use strict";var e=require("react/jsx-runtime"),t=require("../../../node_modules/classnames/index.js"),a=require("react");require("../../components/Avatar/Avatar.js"),require("../../components/Backdrop/Backdrop.js"),require("../../components/Badge/Badge.js");var s=require("../../components/Badge/BaseBadge.js"),n=require("../../components/Text/BaseText.js");require("../../components/Text/Text.js"),require("../../components/Breadcrumbs/BaseBreadcrumbs.js"),require("../../components/Breadcrumbs/Breadcrumbs.js"),require("../../components/Button/ButtonHyperlink.js");var l=require("../../components/Button/BaseButton.js"),o=require("../../components/Button/BaseButtonIcon.js");require("../../components/Button/Button.js"),require("../../components/Button/ButtonConfirmation.js"),require("../../components/Button/ButtonLink.js"),require("../../components/Button/ButtonRipple.js"),require("../../../_virtual/_tslib.js"),require("../../styles/Colors.js"),require("../../components/Card/InfoCard.js"),require("../../components/Checkbox/Checkbox.js");var i=require("../../components/Icon/Icon.js");require("../../components/CheckPicker/BaseInfiniteCheckPicker.js"),require("../../components/CheckPicker/CheckPicker.js"),require("../../components/Container/BaseCollapsibleContainer.js"),require("../../components/DatePicker/DatePicker.js"),require("../../components/DatePicker/DatePickerRange.js"),require("../../components/DatePicker/DatePickerTime.js"),require("../../components/Heading/Heading.js"),require("../../components/IconProduct/IconProduct.js"),require("../../components/Image/Image.js"),require("../../components/LoadingIndicator/LoadingIndicator.js"),require("../../components/LoadingIndicator/LoadingIndicatorBox.js"),require("../../styles/BorderRadius.js"),require("../../styles/Spacing.js"),require("../../components/MessageBox/MessageBox.js"),require("../../components/Modal/BaseModal.js"),require("../../components/Modal/Modal.js");var r=require("../../components/Popover/BasePopover.js");require("../../components/Preview/BasePreview.js"),require("../../components/ProgressBar/ProgressBar.js"),require("../../components/ProgressIndicator/ProgressIndicator.js"),require("../../components/RadioButton/RadioButton.js"),require("../../components/SelectPicker/BaseInfiniteSelectPicker.js"),require("../../components/SelectPicker/SelectPicker.js"),require("../../components/Table/TablePage.js"),require("../../components/Table/TableResponsive.js"),require("../../components/Tabs/BaseAccordionTabs.js"),require("../../components/Tabs/Tabs.js"),require("../../components/Textarea/Textarea.js"),require("../../components/TextInput/TextInput.js"),require("../../components/TimePicker/TimePicker.js"),require("../../../node_modules/react-hot-toast/dist/index.mjs.js"),require("../../components/ToggleButton/ToggleButton.js"),require("../../components/Tooltip/BaseTooltip.js"),require("../../components/Uploader/BaseUploader.js");var c=require("../../utils/getChildrenOnDisplayName.js"),u=require("../../../node_modules/tailwind-merge/dist/lib/tw-merge.mjs.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=d(a);const x=()=>e.jsx("div",{className:"w-full h-[1px] bg-sidebar-separator-default"}),g=({id:l,title:o,titleStyles:r,icon:c,iconStyles:d,subMenu:x,subMenuTitleStyles:g,isCollapsed:b,activeId:f,selectedId:p,notificationCountContainerStyles:j,notificationCountTextStyles:h,itemMenuContainerStyles:v,itemMenuActiveContainerStyles:w,itemMenuActiveBgColor:y,itemSubMenuContainerStyles:C,itemSubMenuActiveContainerStyles:S,itemSubMenuActiveTextColor:k,onClickCollapsible:N,onExpand:M,onClickNav:A,notifcationCount:B})=>{const P=p===l,[q,O]=m.default.useState(!1),[T,I]=m.default.useState(!1),[L,F]=m.default.useState(!1);return a.useEffect((()=>{b?O(!1):setTimeout((()=>{O(!0)}),200)}),[b]),e.jsxs("div",Object.assign({className:u.twMerge(`overflow-hidden hover:bg-sidebar-menu-background-hover rounded-lg ${P?w||"bg-sidebar-menu-background-active":"bg-transparent"}`,v),style:{backgroundColor:P?y:void 0}},{children:[e.jsx("button",Object.assign({onClick:()=>{q||P||N(),M(P?"":l)},className:"relative w-full pl-3 pr-4 bg-transparent min-h-8",onMouseDown:()=>F(!0),onMouseUp:()=>F(!1),onMouseEnter:()=>I(!0),onMouseLeave:()=>I(!1)},{children:e.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[e.jsx("div",Object.assign({className:"w-4 h-4"},{children:e.jsx(i,{name:c,className:u.twMerge(t.default("w-4 h-4 fill-sidebar-menu-textAndIcon-default",T&&"fill-sidebar-menu-textAndIcon-hover",L&&"fill-sidebar-menu-textAndIcon-active"),d)})})),q&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:o,className:u.twMerge(t.default("text-sidebar-menu-textAndIcon-default text-sm text-left w-full line-clamp-1",T&&"text-sidebar-menu-textAndIcon-hover",L&&"text-sidebar-menu-textAndIcon-active"),r)})})),!!B&&e.jsx(s,{label:B.toString(),labelStyles:u.twMerge("text-[10px] text-sidebar-notificationBadge-textAndIcon-default",h),containerStyles:u.twMerge(t.default("flex items-center justify-center min-w-[16px] h-4 rounded-full p-0.5 bg-sidebar-notificationBadge-background-default",`${!q&&"absolute right-0 top-0"}`),j)})]}))})),e.jsx("div",Object.assign({className:"flex flex-col overflow-hidden transition-[max-height] duration-500 ease-in-out "+(P&&q?"max-h-screen bg-sidebar-submenu-background-default":"max-h-0 "),style:{backgroundColor:P&&q?y:"transparent"}},{children:x.map(((a,s)=>e.jsx("button",Object.assign({onClick:()=>A(a),className:u.twMerge("\n flex flex-1 py-2 \n bg-sidebar-submenu-background-default active:bg-sidebar-submenu-background-active hover:bg-sidebar-submenu-background-hover \n text-sidebar-submenu-textAndIcon-default active:text-sidebar-submenu-textAndIcon-active hover:text-sidebar-submenu-textAndIcon-hover \n pl-8 "+(a.navLink===f?`pl-11 ${S||"text-sidebar-submenu-textAndIcon-active"}`:""),C),style:{color:a.navLink===f?k:void 0}},{children:e.jsx(n.default,{label:a.title,className:u.twMerge(t.default("text-xs text-left line-clamp-1 w-full",a.navLink===f?"font-semibold":"font-normal",g))})}),s)))}))]}))},b=({activeId:t,activeParent:s,data:n,isCollapsed:l,notificationCountContainerStyles:i,notificationCountTextStyles:r,containerStyles:d,itemMenuContainerStyles:x,itemMenuIconStyles:b,itemMenuTitleStyles:f,itemMenuActiveBgColor:p,itemSubMenuTitleStyles:j,itemSubMenuContainerStyles:h,itemSubMenuActiveTextColor:v,toggleButtonContainerStyles:w,toggleIconOpenName:y,toggleIconCloseName:C,toggleIconStyles:S,onClickCollapsible:k,onClickNav:N,children:M})=>{const A=c.getChildrenOnDisplayName(M,"Header"),B=c.getChildrenOnDisplayName(M,"Footer"),P=c.getChildrenOnDisplayName(M,"UserProfile"),[q,O]=m.default.useState(s),T=a.Children.toArray(M);return e.jsxs("div",Object.assign({className:u.twMerge("flex flex-col relative h-full px-2 pb-2 ease-in-out duration-300 w-[220px] bg-sidebar-background-default",d)},{children:[A,e.jsx(o.default,{variant:"tertiary",onClick:()=>k(),iconName:l?C||"chevronDoubleArrowRight":y||"chevronDoubleArrowLeft",iconStyles:u.twMerge("w-[7.5px] h-[7.5px]",S),className:u.twMerge("w-6 h-6 absolute top-14 -right-3",w)}),e.jsx("div",Object.assign({className:"flex flex-col flex-1 mb-4 overflow-auto scrollbar scrollbar-none"},{children:e.jsx("div",Object.assign({className:"flex flex-col justify-start flex-1"},{children:n.map(((a,s)=>e.jsx(g,{selectedId:q,id:a.id,title:a.title,icon:a.icon,permission:a.permission,isCollapsed:l,activeId:t,subMenu:a.subMenu,onClickCollapsible:()=>k(),onExpand:e=>O(e),onClickNav:e=>N(e),notifcationCount:a.notifcationCount,notificationCountContainerStyles:i,notificationCountTextStyles:r,itemMenuActiveBgColor:p,itemMenuContainerStyles:x,itemSubMenuActiveTextColor:v,itemSubMenuContainerStyles:h,iconStyles:b,titleStyles:f,subMenuTitleStyles:j},s)))}))})),e.jsx("div",Object.assign({className:"mb-2"},{children:a.Children.map(T,((t,a)=>{const s=c.getChildrenOnDisplayName(t,"Popover");return e.jsx("div",Object.assign({className:"w-full"},{children:s}),a)}))})),P,B]}))},f=({isCollapsed:l,label:o,labelStyles:d,icon:x,iconStyles:g,notificationCount:b,notificationCountContainerStyles:f,notificationCountTextStyles:p,position:j,iconTriangleStyles:h,iconTriangleContainerStyles:v,panelContainerStyles:w,offsetX:y,offsetY:C,containerStyles:S,isAutoFlip:k,children:N})=>{const[M,A]=m.default.useState(!1),[B,P]=m.default.useState(!1),[q,O]=m.default.useState(!1);return a.useEffect((()=>{l?A(!1):setTimeout((()=>{A(!0)}),200)}),[l]),e.jsx(r,Object.assign({position:j||"right-start",iconTriangleStyles:h,iconTriangleContainerStyles:v,panelContainerStyles:w,offsetX:y,offsetY:C,isAutoFlip:k},{children:({open:a,close:l})=>e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{children:e.jsxs("button",Object.assign({className:u.twMerge(t.default("\n h-8 pr-4 pl-3 w-full relative flex flex-row items-center rounded-lg gap-x-2\n bg-sidebar-notificationButton-background-default active:bg-sidebar-notificationButton-background-active hover:bg-sidebar-notificationButton-background-hover\n text-sidebar-notificationButton-textAndIcon-default active:text-sidebar-notificationButton-textAndIcon-active hover:text-sidebar-notificationButton-textAndIcon-hover\n ",a&&"bg-sidebar-profile-background-active text-sidebar-profile-text-active"),S),onMouseDown:()=>O(!0),onMouseUp:()=>O(!1),onMouseEnter:()=>P(!0),onMouseLeave:()=>P(!1)},{children:[e.jsx("div",Object.assign({className:"w-4 h-4"},{children:e.jsx(i,{name:x,className:u.twMerge(t.default("w-4 h-4 fill-sidebar-notificationButton-textAndIcon-default",B&&"fill-sidebar-notificationButton-textAndIcon-hover",q&&"fill-sidebar-notificationButton-textAndIcon-active"),g)})})),M&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:o,className:u.twMerge("text-sm text-left line-clamp-1 w-full",d)})})),!!b&&e.jsx(s,{label:b.toString(),labelStyles:u.twMerge("text-[10px] text-sidebar-notificationBadge-textAndIcon-default",p),containerStyles:u.twMerge(t.default("flex items-center justify-center bg-sidebar-notificationBadge-background-default min-w-[16px] h-4 rounded-full p-0.5",`${!M&&"absolute right-0 top-0"}`),f)})]}))}),e.jsx(r.Panel,{children:c.getChildrenOnDisplayName("function"==typeof N?N({open:a,close:l}):N,"PopoverPanel")})]})}))};f.displayName="Popover",b.Popover=f;const p=({children:t})=>e.jsx(e.Fragment,{children:t});p.displayName="PopoverPanel",b.PopoverPanel=p;const j=({isCollapsed:t,appLogoClosed:s,appLogoClosedStyles:n,appLogoOpened:l,appLogoOpenedStyles:o,containerStyles:i,onClickHeaderSidebar:r,children:c})=>{const[d,x]=m.default.useState(!1);return a.useEffect((()=>{t?x(!1):setTimeout((()=>{x(!0)}),200)}),[t]),e.jsx(e.Fragment,{children:c||e.jsx("div",Object.assign({className:u.twMerge("flex flex-row items-center h-14 gap-x-2 p-2 cursor-pointer",i),onClick:()=>null==r?void 0:r()},{children:d?e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx("img",{src:l||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGc.svg",className:u.twMerge("w-[113px] h-7",o)})})):e.jsx("img",{src:s||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg",className:u.twMerge("w-[22px] h-[22px]",n)})}))})};j.displayName="Header",b.Header=j;const h=({isCollapsed:s,userLabel:l,userLabelStyles:o,userAvatar:c,userAvatarFallback:d,userAvatarFallbackStyles:g,userAvatarStyles:b,containerStyles:f,panelContainerStyles:p,titleAtPanel:j,titleAtPanelStyles:h,userAvatarAtPanel:v,userAvatarAtPanelStyles:w,userAvatarFallbackAtPanel:y,userAvatarFallbackAtPanelStyles:C,userLabelAtPanel:S,userLabelAtPanelStyles:k,userEmailAtPanel:N,userEmailAtPanelStyles:M,manageAccountLabelAtPanel:A,manageAccountLabelAtPanelStyles:B,iconManageAccountAtPanel:P,iconManageAccountAtPanelStyles:q,onClickManageAccount:O,manageAccountContainerStyles:T,translationLabelAtPanel:I,translationLabelAtPanelStyles:L,iconTranslationAtPanel:F,iconTranslationAtPanelStyles:D,onClickTranslation:E,translationContainerStyles:H,logoutLabelAtPanel:R,logoutLabelAtPanelStyles:U,iconLogoutAtPanel:z,iconLogoutAtPanelStyles:G,onClickLogout:V,children:_,offsetX:X,offsetY:Y,position:$,isAutoFlip:J})=>{const[K,Q]=m.default.useState(!1);return a.useEffect((()=>{s?Q(!1):setTimeout((()=>{Q(!0)}),200)}),[s]),e.jsx(e.Fragment,{children:_||e.jsxs("div",Object.assign({className:u.twMerge("flex flex-col w-full")},{children:[e.jsx(x,{}),e.jsx("div",Object.assign({className:"relative min-h-[56px] flex items-center w-full"},{children:e.jsx(r,Object.assign({offsetX:X,offsetY:Y,isAutoFlip:J,panelContainerStyles:p,containerStyles:"w-full",position:$},{children:({open:a,close:s})=>e.jsxs(e.Fragment,{children:[e.jsx(r.Button,{children:e.jsxs("div",Object.assign({className:u.twMerge(t.default("\n w-full flex flex-row items-center h-10 gap-x-2 p-2 rounded-lg \n bg-sidebar-profile-background-default active:bg-sidebar-profile-background-active hover:bg-sidebar-profile-background-hover \n text-sidebar-profile-text-default active:text-sidebar-profile-text-active hover:text-sidebar-profile-text-hover\n cursor-pointer\n ",a&&"bg-sidebar-profile-background-active text-sidebar-profile-text-active"),f)},{children:[c?e.jsx("img",{src:c||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png",className:u.twMerge("w-6 h-6 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover",b)}):e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded",b)},{children:e.jsx(n.default,{label:d,className:u.twMerge("font-semibold text-sidebar-avatar-text-default text-[10px]",g)})})),K&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:l||"",className:u.twMerge("line-clamp-1 w-full text-left",o)})}))]}))}),e.jsx(r.Panel,{children:e.jsxs("div",Object.assign({className:u.twMerge("flex flex-col py-3 bg-dark-solitude rounded min-w-[240px]",p)},{children:[e.jsx("div",Object.assign({className:"px-4"},{children:e.jsx(n.default,{label:j||"Account",className:u.twMerge("text-sm font-semibold text-dark-blackCoral",h)})})),e.jsxs("div",Object.assign({className:"flex flex-row items-center px-4 mt-2 gap-x-2"},{children:[v?e.jsx("img",{src:v||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png",className:u.twMerge("w-8 h-8 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover",w)}):e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-8 h-8 bg-sidebar-avatar-background-default rounded",w)},{children:e.jsx(n.default,{label:y,className:u.twMerge("font-semibold text-sidebar-avatar-text-default text-[10px]",C)})})),e.jsxs("div",Object.assign({className:"flex flex-col"},{children:[e.jsx(n.default,{label:S||"",className:u.twMerge("w-full line-clamp-1 font-normal text-sm text-dark-blackCoral",k)}),e.jsx(n.default,{label:N||"",className:u.twMerge("w-full line-clamp-1 font-normal text-[10px] text-dark-gumbo",M)})]}))]})),e.jsxs("button",Object.assign({className:u.twMerge("flex flex-row items-center px-4 gap-x-2 mt-3 bg-transparent",T),onClick:()=>{s(),null==O||O()}},{children:[e.jsx(i,{name:P||"configuration",className:u.twMerge("w-4 h-4 fill-dark-gumbo",q)}),e.jsx(n.default,{label:A||"Manage Account",className:u.twMerge("text-sm font-normal text-dark-blackCoral",B)})]})),e.jsxs("button",Object.assign({className:u.twMerge("flex flex-row items-center px-4 gap-x-2 mt-3 mb-4 bg-transparent",H),onClick:()=>{s(),null==E||E()}},{children:[e.jsx(i,{name:F||"language",className:u.twMerge("w-4 h-4 fill-dark-gumbo",D)}),e.jsx(n.default,{label:I||"Translate Page",className:u.twMerge("text-sm font-normal text-dark-blackCoral",L)})]})),e.jsx("div",{className:"h-[1px] w-full bg-dark-silver"}),e.jsxs("button",Object.assign({className:"flex flex-row items-center px-4 gap-x-2 mt-3 mb-0.5 bg-transparent",onClick:()=>{s(),null==V||V()}},{children:[e.jsx(i,{name:z||"logout",className:u.twMerge("w-4 h-4 fill-dark-gumbo",G)}),e.jsx(n.default,{label:R||"Logout",className:u.twMerge("text-sm font-normal text-dark-blackCoral",U)})]}))]}))})]})}))})),e.jsx(x,{})]}))})};h.displayName="UserProfile",b.UserProfile=h;const v=({isCollapsed:s,isShowCompanyProfile:o,companyName:i,companyNameStyles:r,companyLogo:c,companyLogoStyles:d,companyLogoFallback:x,companlogoFallbackStyles:g,companyLogoContainerStyles:b,isShowButtonChangeCompany:f,buttonChangeCompanyOnClick:p,buttonChangeCompanyLabel:j,buttonChangeCompanyStyles:h,buttonChangeCompanyIconName:v,buttonChangeCompanyIconStyles:w,appName:y,appVersion:C,children:S})=>{const[k,N]=m.default.useState(!1);return a.useEffect((()=>{s?N(!1):setTimeout((()=>{N(!0)}),200)}),[s]),e.jsx(e.Fragment,{children:S||e.jsxs("div",Object.assign({className:"px-2 pt-2"},{children:[o&&e.jsxs("div",Object.assign({className:"flex flex-row items-center gap-x-2"},{children:[c?e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded",b)},{children:e.jsx("img",{src:c||"https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg",className:u.twMerge("w-4 h-4",d)})})):e.jsx("div",Object.assign({className:u.twMerge("flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded",b)},{children:e.jsx(n.default,{label:x,className:u.twMerge("font-semibold text-sidebar-avatar-text-default text-[10px]",g)})})),k&&e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:i||"Gajicermat",className:u.twMerge("text-sidebar-companyNameText-default text-xs line-clamp-2",r)})}))]})),f&&e.jsx("div",Object.assign({className:"flex flex-row items-center w-full h-14"},{children:e.jsx(l.default,{variant:"secondary",onClick:()=>null==p?void 0:p(),label:k?j||"Select Company":"",className:u.twMerge(t.default("flex items-center justify-center p-0 h-6 ml-0",k?"w-full":"w-6"),h),rightIcon:k?void 0:v||"refresh",rightIconStyles:u.twMerge("ml-0 w-3 h-3",w)})})),e.jsx("div",Object.assign({className:"flex flex-row items-center w-full mt-2 gap-x-2 min-h-4"},{children:k?e.jsxs(e.Fragment,{children:[e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:y||"© Gajicermat Digital Mandiri",className:"text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-right font-normal"})})),e.jsx("div",{className:"w-[1px] h-3 bg-sidebar-appVersionText-default"}),e.jsx("div",Object.assign({className:"flex flex-1"},{children:e.jsx(n.default,{label:C||"Version 0.0.0",className:"text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-left font-normal"})}))]}):e.jsx("div",{className:"w-[1px] h-3 "})}))]}))})};v.displayName="Footer",b.Footer=v,module.exports=b;
2
2
  //# sourceMappingURL=Sidebar.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Sidebar.js","sources":["../../../../src/blocks/Sidebar/Sidebar.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-identical-functions */\nimport classNames from 'classnames';\nimport React, { Children, useEffect } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport {\n BaseBadge,\n BaseButton,\n BaseButtonIcon,\n BasePopover,\n BaseText,\n Icon\n} from '../../components';\nimport { getChildrenOnDisplayName } from '../../utils/getChildrenOnDisplayName';\nimport {\n SidebarFooterInterface,\n SidebarHeaderInterface,\n SidebarInterface,\n SidebarMenuExtendedInterface,\n SidebarMenuInterface,\n SidebarPopoverInterface,\n SidebarUserProfileInterface\n} from './Sidebar.type';\n\nconst Divider = () => <div className='w-full h-[1px] bg-sidebar-separator-default' />;\n\n// TODO: tidy up interface\nconst SidebarMenu = ({\n id,\n title,\n titleStyles,\n icon,\n iconStyles,\n subMenu,\n isCollapsed,\n activeId,\n selectedId,\n notificationCountContainerStyles,\n notificationCountTextStyles,\n itemMenuContainerStyles,\n itemMenuActiveContainerStyles,\n itemMenuActiveBgColor,\n itemSubMenuContainerStyles,\n itemSubMenuActiveContainerStyles,\n itemSubMenuActiveTextColor,\n onClickCollapsible,\n onExpand,\n onClickNav,\n notifcationCount\n}: SidebarMenuInterface & SidebarMenuExtendedInterface) => {\n const expanded = selectedId === id;\n const [isShow, setIsShow] = React.useState<boolean>(false);\n const [isMenuMouseEnter, setIsMenuMouseEnter] = React.useState<boolean>(false);\n const [isMenuMouseDown, setIsMenuMouseDown] = React.useState<boolean>(false);\n\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <div\n className={twMerge(\n `overflow-hidden hover:bg-sidebar-menu-background-hover rounded-lg ${\n expanded\n ? itemMenuActiveContainerStyles || 'bg-sidebar-menu-background-active'\n : 'bg-transparent'\n }`,\n itemMenuContainerStyles\n )}\n style={{ backgroundColor: expanded ? itemMenuActiveBgColor : undefined }}\n >\n <button\n onClick={() => {\n if (!isShow && !expanded) onClickCollapsible();\n\n if (expanded) {\n onExpand('');\n return;\n }\n\n onExpand(id);\n }}\n className='relative w-full pl-3 pr-4 bg-transparent min-h-8'\n onMouseDown={() => setIsMenuMouseDown(true)}\n onMouseUp={() => setIsMenuMouseDown(false)}\n onMouseEnter={() => setIsMenuMouseEnter(true)}\n onMouseLeave={() => setIsMenuMouseEnter(false)}\n >\n <div className='flex flex-row items-center gap-x-2'>\n <div className='w-4 h-4'>\n <Icon\n name={icon}\n className={twMerge(\n classNames(\n 'w-4 h-4 fill-sidebar-menu-textAndIcon-default',\n isMenuMouseEnter && 'fill-sidebar-menu-textAndIcon-hover',\n isMenuMouseDown && 'fill-sidebar-menu-textAndIcon-active'\n ),\n iconStyles\n )}\n />\n </div>\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={title}\n className={twMerge(\n classNames(\n 'text-sidebar-menu-textAndIcon-default text-sm text-left w-full line-clamp-1',\n isMenuMouseEnter && 'text-sidebar-menu-textAndIcon-hover',\n isMenuMouseDown && 'text-sidebar-menu-textAndIcon-active'\n ),\n titleStyles\n )}\n />\n </div>\n )}\n {!!notifcationCount && (\n <BaseBadge\n label={notifcationCount.toString()}\n labelStyles={twMerge(\n 'text-[10px] text-sidebar-notificationBadge-textAndIcon-default',\n notificationCountTextStyles\n )}\n containerStyles={twMerge(\n classNames(\n 'flex items-center justify-center min-w-[16px] h-4 rounded-full p-0.5 bg-sidebar-notificationBadge-background-default',\n `${!isShow && 'absolute right-0 top-0'}`\n ),\n notificationCountContainerStyles\n )}\n />\n )}\n </div>\n </button>\n\n <div\n className={`flex flex-col overflow-hidden transition-[max-height] duration-500 ease-in-out ${\n expanded && isShow ? 'max-h-screen bg-sidebar-submenu-background-default' : 'max-h-0 '\n }`}\n style={{ backgroundColor: expanded && isShow ? itemMenuActiveBgColor : 'transparent' }}\n >\n {subMenu.map((item, index) => (\n <button\n key={index}\n onClick={() => onClickNav(item)}\n className={twMerge(\n `\n flex flex-1 py-2 \n bg-sidebar-submenu-background-default active:bg-sidebar-submenu-background-active hover:bg-sidebar-submenu-background-hover \n text-sidebar-submenu-textAndIcon-default active:text-sidebar-submenu-textAndIcon-active hover:text-sidebar-submenu-textAndIcon-hover \n pl-8 ${\n item.navLink === activeId\n ? `pl-11 ${\n itemSubMenuActiveContainerStyles || 'text-sidebar-submenu-textAndIcon-active'\n }`\n : ''\n }`,\n itemSubMenuContainerStyles\n )}\n style={{ color: item.navLink === activeId ? itemSubMenuActiveTextColor : undefined }}\n >\n <BaseText\n label={item.title}\n className={`text-xs text-left line-clamp-1 w-full ${\n item.navLink === activeId ? 'font-semibold' : 'font-normal'\n } `}\n />\n </button>\n ))}\n </div>\n </div>\n );\n};\n\nconst Sidebar = ({\n activeId,\n activeParent,\n data,\n isCollapsed,\n notificationCountContainerStyles,\n notificationCountTextStyles,\n containerStyles,\n itemMenuContainerStyles,\n itemMenuIconStyles,\n itemMenuTitleStyles,\n itemMenuActiveBgColor,\n itemSubMenuContainerStyles,\n itemSubMenuActiveTextColor,\n toggleButtonContainerStyles,\n toggleIconOpenName,\n toggleIconCloseName,\n toggleIconStyles,\n onClickCollapsible,\n onClickNav,\n children\n}: SidebarInterface) => {\n const header = getChildrenOnDisplayName(children, 'Header');\n const footer = getChildrenOnDisplayName(children, 'Footer');\n const userProfile = getChildrenOnDisplayName(children, 'UserProfile');\n\n const [selectedId, setSelectedId] = React.useState<string>(activeParent);\n\n const arrayChildren = Children.toArray(children);\n\n return (\n <div\n className={twMerge(\n 'flex flex-col relative h-full px-2 pb-2 ease-in-out duration-300 w-[220px] bg-sidebar-background-default',\n containerStyles\n )}\n >\n {/* Header */}\n {header}\n\n <BaseButtonIcon\n variant='tertiary'\n onClick={() => onClickCollapsible()}\n iconName={\n isCollapsed\n ? toggleIconCloseName || 'chevronDoubleArrowRight'\n : toggleIconOpenName || 'chevronDoubleArrowLeft'\n }\n iconStyles={twMerge('w-[7.5px] h-[7.5px]', toggleIconStyles)}\n className={twMerge('w-6 h-6 absolute top-14 -right-3', toggleButtonContainerStyles)}\n />\n\n {/* Content */}\n <div className='flex flex-col flex-1 mb-4 overflow-auto scrollbar scrollbar-none'>\n <div className='flex flex-col justify-start flex-1'>\n {data.map((item, index) => (\n <SidebarMenu\n key={index}\n selectedId={selectedId}\n id={item.id}\n title={item.title}\n icon={item.icon}\n permission={item.permission}\n isCollapsed={isCollapsed}\n activeId={activeId}\n subMenu={item.subMenu}\n onClickCollapsible={() => onClickCollapsible()}\n onExpand={(id) => setSelectedId(id)}\n onClickNav={(navLink) => onClickNav(navLink)}\n notifcationCount={item.notifcationCount}\n notificationCountContainerStyles={notificationCountContainerStyles}\n notificationCountTextStyles={notificationCountTextStyles}\n itemMenuActiveBgColor={itemMenuActiveBgColor}\n itemMenuContainerStyles={itemMenuContainerStyles}\n itemSubMenuActiveTextColor={itemSubMenuActiveTextColor}\n itemSubMenuContainerStyles={itemSubMenuContainerStyles}\n iconStyles={itemMenuIconStyles}\n titleStyles={itemMenuTitleStyles}\n />\n ))}\n </div>\n </div>\n\n <div className='mb-2'>\n {Children.map(arrayChildren, (item, index) => {\n const child = getChildrenOnDisplayName(item, 'Popover');\n return (\n <div key={index} className='w-full'>\n {child}\n </div>\n );\n })}\n </div>\n\n {/* User */}\n {userProfile}\n\n {/* Company */}\n {footer}\n </div>\n );\n};\n\nconst Popover = ({\n isCollapsed,\n label,\n labelStyles,\n icon,\n iconStyles,\n notificationCount,\n notificationCountContainerStyles,\n notificationCountTextStyles,\n position,\n iconTriangleStyles,\n iconTriangleContainerStyles,\n panelContainerStyles,\n offsetX,\n offsetY,\n containerStyles,\n isAutoFlip,\n children\n}: SidebarPopoverInterface) => {\n const [isShow, setIsShow] = React.useState<boolean>(false);\n const [isMouseEnter, setIsMouseEnter] = React.useState<boolean>(false);\n const [isMouseDown, setIsMouseDown] = React.useState<boolean>(false);\n\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <BasePopover\n position={position || 'right-start'}\n iconTriangleStyles={iconTriangleStyles}\n iconTriangleContainerStyles={iconTriangleContainerStyles}\n panelContainerStyles={panelContainerStyles}\n offsetX={offsetX}\n offsetY={offsetY}\n isAutoFlip={isAutoFlip}\n >\n {({ open, close }) => {\n return (\n <>\n <BasePopover.Button>\n <button\n className={twMerge(\n classNames(\n `\n h-8 pr-4 pl-3 w-full relative flex flex-row items-center rounded-lg gap-x-2\n bg-sidebar-notificationButton-background-default active:bg-sidebar-notificationButton-background-active hover:bg-sidebar-notificationButton-background-hover\n text-sidebar-notificationButton-textAndIcon-default active:text-sidebar-notificationButton-textAndIcon-active hover:text-sidebar-notificationButton-textAndIcon-hover\n `,\n open && 'bg-sidebar-profile-background-active text-sidebar-profile-text-active'\n ),\n containerStyles\n )}\n onMouseDown={() => setIsMouseDown(true)}\n onMouseUp={() => setIsMouseDown(false)}\n onMouseEnter={() => setIsMouseEnter(true)}\n onMouseLeave={() => setIsMouseEnter(false)}\n >\n <div className='w-4 h-4'>\n <Icon\n name={icon}\n className={twMerge(\n classNames(\n 'w-4 h-4 fill-sidebar-notificationButton-textAndIcon-default',\n isMouseEnter && 'fill-sidebar-notificationButton-textAndIcon-hover',\n isMouseDown && 'fill-sidebar-notificationButton-textAndIcon-active'\n ),\n iconStyles\n )}\n />\n </div>\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={label}\n className={twMerge('text-sm text-left line-clamp-1 w-full', labelStyles)}\n />\n </div>\n )}\n {!!notificationCount && (\n <BaseBadge\n label={notificationCount.toString()}\n labelStyles={twMerge(\n 'text-[10px] text-sidebar-notificationBadge-textAndIcon-default',\n notificationCountTextStyles\n )}\n containerStyles={twMerge(\n classNames(\n 'flex items-center justify-center bg-sidebar-notificationBadge-background-default min-w-[16px] h-4 rounded-full p-0.5',\n `${!isShow && 'absolute right-0 top-0'}`\n ),\n notificationCountContainerStyles\n )}\n />\n )}\n </button>\n </BasePopover.Button>\n <BasePopover.Panel>\n {getChildrenOnDisplayName(\n typeof children === 'function' ? children({ open, close }) : children,\n 'PopoverPanel'\n )}\n </BasePopover.Panel>\n </>\n );\n }}\n </BasePopover>\n );\n};\nPopover.displayName = 'Popover';\nSidebar.Popover = Popover;\n\nconst PopoverPanel = ({ children }: { children: React.ReactNode }) => {\n return <>{children}</>;\n};\nPopoverPanel.displayName = 'PopoverPanel';\nSidebar.PopoverPanel = PopoverPanel;\n\nconst Header = ({\n isCollapsed,\n appLogoClosed,\n appLogoClosedStyles,\n appLogoOpened,\n appLogoOpenedStyles,\n containerStyles,\n onClickHeaderSidebar,\n children\n}: SidebarHeaderInterface) => {\n // TODO: create hooks for code below\n const [isShow, setIsShow] = React.useState<boolean>(false);\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div\n className={twMerge(\n 'flex flex-row items-center h-14 gap-x-2 p-2 cursor-pointer',\n containerStyles\n )}\n onClick={() => onClickHeaderSidebar?.()}\n >\n {isShow ? (\n <div className='flex flex-1'>\n <img\n src={\n appLogoOpened ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGc.svg'\n }\n className={twMerge('w-[113px] h-7', appLogoOpenedStyles)}\n />\n </div>\n ) : (\n <img\n src={\n appLogoClosed ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg'\n }\n className={twMerge('w-[22px] h-[22px]', appLogoClosedStyles)}\n />\n )}\n </div>\n )}\n </>\n );\n};\nHeader.displayName = 'Header';\nSidebar.Header = Header;\n\nconst UserProfile = ({\n isCollapsed,\n userLabel,\n userLabelStyles,\n userAvatar,\n userAvatarFallback,\n userAvatarFallbackStyles,\n userAvatarStyles,\n containerStyles,\n // Panel\n panelContainerStyles,\n titleAtPanel,\n titleAtPanelStyles,\n userAvatarAtPanel,\n userAvatarAtPanelStyles,\n userAvatarFallbackAtPanel,\n userAvatarFallbackAtPanelStyles,\n userLabelAtPanel,\n userLabelAtPanelStyles,\n userEmailAtPanel,\n userEmailAtPanelStyles,\n manageAccountLabelAtPanel,\n manageAccountLabelAtPanelStyles,\n iconManageAccountAtPanel,\n iconManageAccountAtPanelStyles,\n onClickManageAccount,\n manageAccountContainerStyles,\n translationLabelAtPanel,\n translationLabelAtPanelStyles,\n iconTranslationAtPanel,\n iconTranslationAtPanelStyles,\n onClickTranslation,\n translationContainerStyles,\n logoutLabelAtPanel,\n logoutLabelAtPanelStyles,\n iconLogoutAtPanel,\n iconLogoutAtPanelStyles,\n onClickLogout,\n children,\n offsetX,\n offsetY,\n position,\n isAutoFlip\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nSidebarUserProfileInterface) => {\n const [isShow, setIsShow] = React.useState<boolean>(false);\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div className={twMerge('flex flex-col w-full')}>\n <Divider />\n <div className='relative min-h-[56px] flex items-center w-full'>\n <BasePopover\n offsetX={offsetX}\n offsetY={offsetY}\n isAutoFlip={isAutoFlip}\n panelContainerStyles={panelContainerStyles}\n containerStyles='w-full'\n position={position}\n >\n {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n {({ open, close }) => {\n return (\n <>\n <BasePopover.Button>\n <div\n className={twMerge(\n classNames(\n `\n w-full flex flex-row items-center h-10 gap-x-2 p-2 rounded-lg \n bg-sidebar-profile-background-default active:bg-sidebar-profile-background-active hover:bg-sidebar-profile-background-hover \n text-sidebar-profile-text-default active:text-sidebar-profile-text-active hover:text-sidebar-profile-text-hover\n cursor-pointer\n `,\n open &&\n 'bg-sidebar-profile-background-active text-sidebar-profile-text-active'\n ),\n containerStyles\n )}\n >\n {userAvatar ? (\n <img\n src={\n userAvatar ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png'\n }\n className={twMerge(\n 'w-6 h-6 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover',\n userAvatarStyles\n )}\n />\n ) : (\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded',\n userAvatarStyles\n )}\n >\n <BaseText\n label={userAvatarFallback}\n className={twMerge(\n 'font-semibold text-sidebar-avatar-text-default text-[10px]',\n userAvatarFallbackStyles\n )}\n />\n </div>\n )}\n\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={userLabel || ''}\n className={twMerge('line-clamp-1 w-full text-left', userLabelStyles)}\n />\n </div>\n )}\n </div>\n </BasePopover.Button>\n <BasePopover.Panel>\n <div\n className={twMerge(\n 'flex flex-col py-3 bg-dark-solitude rounded min-w-[240px]',\n panelContainerStyles\n )}\n >\n <div className='px-4'>\n <BaseText\n label={titleAtPanel || 'Account'}\n className={twMerge(\n 'text-sm font-semibold text-dark-blackCoral',\n titleAtPanelStyles\n )}\n />\n </div>\n <div className='flex flex-row items-center px-4 mt-2 gap-x-2'>\n {userAvatarAtPanel ? (\n <img\n src={\n userAvatarAtPanel ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png'\n }\n className={twMerge(\n 'w-8 h-8 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover',\n userAvatarAtPanelStyles\n )}\n />\n ) : (\n <div\n className={twMerge(\n 'flex items-center justify-center w-8 h-8 bg-sidebar-avatar-background-default rounded',\n userAvatarAtPanelStyles\n )}\n >\n <BaseText\n label={userAvatarFallbackAtPanel}\n className={twMerge(\n 'font-semibold text-sidebar-avatar-text-default text-[10px]',\n userAvatarFallbackAtPanelStyles\n )}\n />\n </div>\n )}\n\n <div className='flex flex-col'>\n <BaseText\n label={userLabelAtPanel || ''}\n className={twMerge(\n 'w-full line-clamp-1 font-normal text-sm text-dark-blackCoral',\n userLabelAtPanelStyles\n )}\n />\n <BaseText\n label={userEmailAtPanel || ''}\n className={twMerge(\n 'w-full line-clamp-1 font-normal text-[10px] text-dark-gumbo',\n userEmailAtPanelStyles\n )}\n />\n </div>\n </div>\n <button\n className={twMerge(\n 'flex flex-row items-center px-4 gap-x-2 mt-3 bg-transparent',\n manageAccountContainerStyles\n )}\n onClick={() => {\n close();\n onClickManageAccount?.();\n }}\n >\n <Icon\n name={iconManageAccountAtPanel || 'configuration'}\n className={twMerge(\n 'w-4 h-4 fill-dark-gumbo',\n iconManageAccountAtPanelStyles\n )}\n />\n <BaseText\n label={manageAccountLabelAtPanel || 'Manage Account'}\n className={twMerge(\n 'text-sm font-normal text-dark-blackCoral',\n manageAccountLabelAtPanelStyles\n )}\n />\n </button>\n <button\n className={twMerge(\n 'flex flex-row items-center px-4 gap-x-2 mt-3 mb-4 bg-transparent',\n translationContainerStyles\n )}\n onClick={() => {\n close();\n onClickTranslation?.();\n }}\n >\n <Icon\n name={iconTranslationAtPanel || 'language'}\n className={twMerge(\n 'w-4 h-4 fill-dark-gumbo',\n iconTranslationAtPanelStyles\n )}\n />\n <BaseText\n label={translationLabelAtPanel || 'Translate Page'}\n className={twMerge(\n 'text-sm font-normal text-dark-blackCoral',\n translationLabelAtPanelStyles\n )}\n />\n </button>\n <div className='h-[1px] w-full bg-dark-silver' />\n <button\n className='flex flex-row items-center px-4 gap-x-2 mt-3 mb-0.5 bg-transparent'\n onClick={() => {\n close();\n onClickLogout?.();\n }}\n >\n <Icon\n name={iconLogoutAtPanel || 'logout'}\n className={twMerge('w-4 h-4 fill-dark-gumbo', iconLogoutAtPanelStyles)}\n />\n <BaseText\n label={logoutLabelAtPanel || 'Logout'}\n className={twMerge(\n 'text-sm font-normal text-dark-blackCoral',\n logoutLabelAtPanelStyles\n )}\n />\n </button>\n </div>\n </BasePopover.Panel>\n </>\n );\n }}\n </BasePopover>\n </div>\n <Divider />\n </div>\n )}\n </>\n );\n};\nUserProfile.displayName = 'UserProfile';\nSidebar.UserProfile = UserProfile;\n\nconst Footer = ({\n isCollapsed,\n isShowCompanyProfile,\n companyName,\n companyNameStyles,\n companyLogo,\n companyLogoStyles,\n companyLogoFallback,\n companlogoFallbackStyles,\n companyLogoContainerStyles,\n isShowButtonChangeCompany,\n buttonChangeCompanyOnClick,\n buttonChangeCompanyLabel,\n buttonChangeCompanyStyles,\n buttonChangeCompanyIconName,\n buttonChangeCompanyIconStyles,\n appName,\n appVersion,\n children\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nSidebarFooterInterface) => {\n const [isShow, setIsShow] = React.useState<boolean>(false);\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div className='px-2 pt-2'>\n {isShowCompanyProfile && (\n <div className='flex flex-row items-center gap-x-2'>\n {companyLogo ? (\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded',\n companyLogoContainerStyles\n )}\n >\n <img\n src={\n companyLogo ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg'\n }\n className={twMerge('w-4 h-4', companyLogoStyles)}\n />\n </div>\n ) : (\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded',\n companyLogoContainerStyles\n )}\n >\n <BaseText\n label={companyLogoFallback}\n className={twMerge(\n 'font-semibold text-sidebar-avatar-text-default text-[10px]',\n companlogoFallbackStyles\n )}\n />\n </div>\n )}\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={companyName || 'Gajicermat'}\n className={twMerge(\n 'text-sidebar-companyNameText-default text-xs line-clamp-2',\n companyNameStyles\n )}\n />\n </div>\n )}\n </div>\n )}\n\n {isShowButtonChangeCompany && (\n <div className='flex flex-row items-center w-full h-14'>\n <BaseButton\n variant='secondary'\n onClick={() => buttonChangeCompanyOnClick?.()}\n label={isShow ? buttonChangeCompanyLabel || 'Select Company' : ''}\n className={twMerge(\n classNames(\n 'flex items-center justify-center p-0 h-6 ml-0',\n isShow ? 'w-full' : 'w-6'\n ),\n buttonChangeCompanyStyles\n )}\n rightIcon={isShow ? undefined : buttonChangeCompanyIconName || 'refresh'}\n rightIconStyles={twMerge('ml-0 w-3 h-3', buttonChangeCompanyIconStyles)}\n />\n </div>\n )}\n\n <div className='flex flex-row items-center w-full mt-2 gap-x-2 min-h-4'>\n {isShow ? (\n <>\n <div className='flex flex-1'>\n <BaseText\n label={appName || '© Gajicermat Digital Mandiri'}\n className='text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-right font-normal'\n />\n </div>\n <div className='w-[1px] h-3 bg-sidebar-appVersionText-default' />\n <div className='flex flex-1'>\n <BaseText\n label={appVersion || 'Version 0.0.0'}\n className='text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-left font-normal'\n />\n </div>\n </>\n ) : (\n <div className='w-[1px] h-3 ' />\n )}\n </div>\n </div>\n )}\n </>\n );\n};\nFooter.displayName = 'Footer';\nSidebar.Footer = Footer;\n\nexport default Sidebar;\n"],"names":["Divider","_jsx","className","SidebarMenu","id","title","titleStyles","icon","iconStyles","subMenu","isCollapsed","activeId","selectedId","notificationCountContainerStyles","notificationCountTextStyles","itemMenuContainerStyles","itemMenuActiveContainerStyles","itemMenuActiveBgColor","itemSubMenuContainerStyles","itemSubMenuActiveContainerStyles","itemSubMenuActiveTextColor","onClickCollapsible","onExpand","onClickNav","notifcationCount","expanded","isShow","setIsShow","React","useState","isMenuMouseEnter","setIsMenuMouseEnter","isMenuMouseDown","setIsMenuMouseDown","useEffect","setTimeout","_jsxs","jsxs","Object","assign","twMerge","style","backgroundColor","undefined","children","onClick","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","jsx","Icon","name","classNames","BaseText","label","BaseBadge","toString","labelStyles","containerStyles","map","item","index","navLink","color","Sidebar","activeParent","data","itemMenuIconStyles","itemMenuTitleStyles","toggleButtonContainerStyles","toggleIconOpenName","toggleIconCloseName","toggleIconStyles","header","getChildrenOnDisplayName","footer","userProfile","setSelectedId","arrayChildren","Children","toArray","BaseButtonIcon","variant","iconName","permission","child","Popover","notificationCount","position","iconTriangleStyles","iconTriangleContainerStyles","panelContainerStyles","offsetX","offsetY","isAutoFlip","isMouseEnter","setIsMouseEnter","isMouseDown","setIsMouseDown","BasePopover","open","close","_Fragment","Button","Panel","displayName","PopoverPanel","Fragment","Header","appLogoClosed","appLogoClosedStyles","appLogoOpened","appLogoOpenedStyles","onClickHeaderSidebar","src","UserProfile","userLabel","userLabelStyles","userAvatar","userAvatarFallback","userAvatarFallbackStyles","userAvatarStyles","titleAtPanel","titleAtPanelStyles","userAvatarAtPanel","userAvatarAtPanelStyles","userAvatarFallbackAtPanel","userAvatarFallbackAtPanelStyles","userLabelAtPanel","userLabelAtPanelStyles","userEmailAtPanel","userEmailAtPanelStyles","manageAccountLabelAtPanel","manageAccountLabelAtPanelStyles","iconManageAccountAtPanel","iconManageAccountAtPanelStyles","onClickManageAccount","manageAccountContainerStyles","translationLabelAtPanel","translationLabelAtPanelStyles","iconTranslationAtPanel","iconTranslationAtPanelStyles","onClickTranslation","translationContainerStyles","logoutLabelAtPanel","logoutLabelAtPanelStyles","iconLogoutAtPanel","iconLogoutAtPanelStyles","onClickLogout","Footer","isShowCompanyProfile","companyName","companyNameStyles","companyLogo","companyLogoStyles","companyLogoFallback","companlogoFallbackStyles","companyLogoContainerStyles","isShowButtonChangeCompany","buttonChangeCompanyOnClick","buttonChangeCompanyLabel","buttonChangeCompanyStyles","buttonChangeCompanyIconName","buttonChangeCompanyIconStyles","appName","appVersion","BaseButton","rightIcon","rightIconStyles"],"mappings":"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"}
1
+ {"version":3,"file":"Sidebar.js","sources":["../../../../src/blocks/Sidebar/Sidebar.tsx"],"sourcesContent":["/* eslint-disable sonarjs/no-identical-functions */\nimport classNames from 'classnames';\nimport React, { Children, useEffect } from 'react';\nimport { twMerge } from 'tailwind-merge';\n\nimport {\n BaseBadge,\n BaseButton,\n BaseButtonIcon,\n BasePopover,\n BaseText,\n Icon\n} from '../../components';\nimport { getChildrenOnDisplayName } from '../../utils/getChildrenOnDisplayName';\nimport {\n SidebarFooterInterface,\n SidebarHeaderInterface,\n SidebarInterface,\n SidebarMenuExtendedInterface,\n SidebarMenuInterface,\n SidebarPopoverInterface,\n SidebarUserProfileInterface\n} from './Sidebar.type';\n\nconst Divider = () => <div className='w-full h-[1px] bg-sidebar-separator-default' />;\n\n// TODO: tidy up interface\nconst SidebarMenu = ({\n id,\n title,\n titleStyles,\n icon,\n iconStyles,\n subMenu,\n subMenuTitleStyles,\n isCollapsed,\n activeId,\n selectedId,\n notificationCountContainerStyles,\n notificationCountTextStyles,\n itemMenuContainerStyles,\n itemMenuActiveContainerStyles,\n itemMenuActiveBgColor,\n itemSubMenuContainerStyles,\n itemSubMenuActiveContainerStyles,\n itemSubMenuActiveTextColor,\n onClickCollapsible,\n onExpand,\n onClickNav,\n notifcationCount\n}: SidebarMenuInterface & SidebarMenuExtendedInterface) => {\n const expanded = selectedId === id;\n const [isShow, setIsShow] = React.useState<boolean>(false);\n const [isMenuMouseEnter, setIsMenuMouseEnter] = React.useState<boolean>(false);\n const [isMenuMouseDown, setIsMenuMouseDown] = React.useState<boolean>(false);\n\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <div\n className={twMerge(\n `overflow-hidden hover:bg-sidebar-menu-background-hover rounded-lg ${\n expanded\n ? itemMenuActiveContainerStyles || 'bg-sidebar-menu-background-active'\n : 'bg-transparent'\n }`,\n itemMenuContainerStyles\n )}\n style={{ backgroundColor: expanded ? itemMenuActiveBgColor : undefined }}\n >\n <button\n onClick={() => {\n if (!isShow && !expanded) onClickCollapsible();\n\n if (expanded) {\n onExpand('');\n return;\n }\n\n onExpand(id);\n }}\n className='relative w-full pl-3 pr-4 bg-transparent min-h-8'\n onMouseDown={() => setIsMenuMouseDown(true)}\n onMouseUp={() => setIsMenuMouseDown(false)}\n onMouseEnter={() => setIsMenuMouseEnter(true)}\n onMouseLeave={() => setIsMenuMouseEnter(false)}\n >\n <div className='flex flex-row items-center gap-x-2'>\n <div className='w-4 h-4'>\n <Icon\n name={icon}\n className={twMerge(\n classNames(\n 'w-4 h-4 fill-sidebar-menu-textAndIcon-default',\n isMenuMouseEnter && 'fill-sidebar-menu-textAndIcon-hover',\n isMenuMouseDown && 'fill-sidebar-menu-textAndIcon-active'\n ),\n iconStyles\n )}\n />\n </div>\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={title}\n className={twMerge(\n classNames(\n 'text-sidebar-menu-textAndIcon-default text-sm text-left w-full line-clamp-1',\n isMenuMouseEnter && 'text-sidebar-menu-textAndIcon-hover',\n isMenuMouseDown && 'text-sidebar-menu-textAndIcon-active'\n ),\n titleStyles\n )}\n />\n </div>\n )}\n {!!notifcationCount && (\n <BaseBadge\n label={notifcationCount.toString()}\n labelStyles={twMerge(\n 'text-[10px] text-sidebar-notificationBadge-textAndIcon-default',\n notificationCountTextStyles\n )}\n containerStyles={twMerge(\n classNames(\n 'flex items-center justify-center min-w-[16px] h-4 rounded-full p-0.5 bg-sidebar-notificationBadge-background-default',\n `${!isShow && 'absolute right-0 top-0'}`\n ),\n notificationCountContainerStyles\n )}\n />\n )}\n </div>\n </button>\n\n <div\n className={`flex flex-col overflow-hidden transition-[max-height] duration-500 ease-in-out ${\n expanded && isShow ? 'max-h-screen bg-sidebar-submenu-background-default' : 'max-h-0 '\n }`}\n style={{ backgroundColor: expanded && isShow ? itemMenuActiveBgColor : 'transparent' }}\n >\n {subMenu.map((item, index) => (\n <button\n key={index}\n onClick={() => onClickNav(item)}\n className={twMerge(\n `\n flex flex-1 py-2 \n bg-sidebar-submenu-background-default active:bg-sidebar-submenu-background-active hover:bg-sidebar-submenu-background-hover \n text-sidebar-submenu-textAndIcon-default active:text-sidebar-submenu-textAndIcon-active hover:text-sidebar-submenu-textAndIcon-hover \n pl-8 ${\n item.navLink === activeId\n ? `pl-11 ${\n itemSubMenuActiveContainerStyles || 'text-sidebar-submenu-textAndIcon-active'\n }`\n : ''\n }`,\n itemSubMenuContainerStyles\n )}\n style={{ color: item.navLink === activeId ? itemSubMenuActiveTextColor : undefined }}\n >\n <BaseText\n label={item.title}\n className={twMerge(\n classNames(\n 'text-xs text-left line-clamp-1 w-full',\n item.navLink === activeId ? 'font-semibold' : 'font-normal',\n subMenuTitleStyles\n )\n )}\n />\n </button>\n ))}\n </div>\n </div>\n );\n};\n\nconst Sidebar = ({\n activeId,\n activeParent,\n data,\n isCollapsed,\n notificationCountContainerStyles,\n notificationCountTextStyles,\n containerStyles,\n itemMenuContainerStyles,\n itemMenuIconStyles,\n itemMenuTitleStyles,\n itemMenuActiveBgColor,\n itemSubMenuTitleStyles,\n itemSubMenuContainerStyles,\n itemSubMenuActiveTextColor,\n toggleButtonContainerStyles,\n toggleIconOpenName,\n toggleIconCloseName,\n toggleIconStyles,\n onClickCollapsible,\n onClickNav,\n children\n}: SidebarInterface) => {\n const header = getChildrenOnDisplayName(children, 'Header');\n const footer = getChildrenOnDisplayName(children, 'Footer');\n const userProfile = getChildrenOnDisplayName(children, 'UserProfile');\n\n const [selectedId, setSelectedId] = React.useState<string>(activeParent);\n\n const arrayChildren = Children.toArray(children);\n\n return (\n <div\n className={twMerge(\n 'flex flex-col relative h-full px-2 pb-2 ease-in-out duration-300 w-[220px] bg-sidebar-background-default',\n containerStyles\n )}\n >\n {/* Header */}\n {header}\n\n <BaseButtonIcon\n variant='tertiary'\n onClick={() => onClickCollapsible()}\n iconName={\n isCollapsed\n ? toggleIconCloseName || 'chevronDoubleArrowRight'\n : toggleIconOpenName || 'chevronDoubleArrowLeft'\n }\n iconStyles={twMerge('w-[7.5px] h-[7.5px]', toggleIconStyles)}\n className={twMerge('w-6 h-6 absolute top-14 -right-3', toggleButtonContainerStyles)}\n />\n\n {/* Content */}\n <div className='flex flex-col flex-1 mb-4 overflow-auto scrollbar scrollbar-none'>\n <div className='flex flex-col justify-start flex-1'>\n {data.map((item, index) => (\n <SidebarMenu\n key={index}\n selectedId={selectedId}\n id={item.id}\n title={item.title}\n icon={item.icon}\n permission={item.permission}\n isCollapsed={isCollapsed}\n activeId={activeId}\n subMenu={item.subMenu}\n onClickCollapsible={() => onClickCollapsible()}\n onExpand={(id) => setSelectedId(id)}\n onClickNav={(navLink) => onClickNav(navLink)}\n notifcationCount={item.notifcationCount}\n notificationCountContainerStyles={notificationCountContainerStyles}\n notificationCountTextStyles={notificationCountTextStyles}\n itemMenuActiveBgColor={itemMenuActiveBgColor}\n itemMenuContainerStyles={itemMenuContainerStyles}\n itemSubMenuActiveTextColor={itemSubMenuActiveTextColor}\n itemSubMenuContainerStyles={itemSubMenuContainerStyles}\n iconStyles={itemMenuIconStyles}\n titleStyles={itemMenuTitleStyles}\n subMenuTitleStyles={itemSubMenuTitleStyles}\n />\n ))}\n </div>\n </div>\n\n <div className='mb-2'>\n {Children.map(arrayChildren, (item, index) => {\n const child = getChildrenOnDisplayName(item, 'Popover');\n return (\n <div key={index} className='w-full'>\n {child}\n </div>\n );\n })}\n </div>\n\n {/* User */}\n {userProfile}\n\n {/* Company */}\n {footer}\n </div>\n );\n};\n\nconst Popover = ({\n isCollapsed,\n label,\n labelStyles,\n icon,\n iconStyles,\n notificationCount,\n notificationCountContainerStyles,\n notificationCountTextStyles,\n position,\n iconTriangleStyles,\n iconTriangleContainerStyles,\n panelContainerStyles,\n offsetX,\n offsetY,\n containerStyles,\n isAutoFlip,\n children\n}: SidebarPopoverInterface) => {\n const [isShow, setIsShow] = React.useState<boolean>(false);\n const [isMouseEnter, setIsMouseEnter] = React.useState<boolean>(false);\n const [isMouseDown, setIsMouseDown] = React.useState<boolean>(false);\n\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <BasePopover\n position={position || 'right-start'}\n iconTriangleStyles={iconTriangleStyles}\n iconTriangleContainerStyles={iconTriangleContainerStyles}\n panelContainerStyles={panelContainerStyles}\n offsetX={offsetX}\n offsetY={offsetY}\n isAutoFlip={isAutoFlip}\n >\n {({ open, close }) => {\n return (\n <>\n <BasePopover.Button>\n <button\n className={twMerge(\n classNames(\n `\n h-8 pr-4 pl-3 w-full relative flex flex-row items-center rounded-lg gap-x-2\n bg-sidebar-notificationButton-background-default active:bg-sidebar-notificationButton-background-active hover:bg-sidebar-notificationButton-background-hover\n text-sidebar-notificationButton-textAndIcon-default active:text-sidebar-notificationButton-textAndIcon-active hover:text-sidebar-notificationButton-textAndIcon-hover\n `,\n open && 'bg-sidebar-profile-background-active text-sidebar-profile-text-active'\n ),\n containerStyles\n )}\n onMouseDown={() => setIsMouseDown(true)}\n onMouseUp={() => setIsMouseDown(false)}\n onMouseEnter={() => setIsMouseEnter(true)}\n onMouseLeave={() => setIsMouseEnter(false)}\n >\n <div className='w-4 h-4'>\n <Icon\n name={icon}\n className={twMerge(\n classNames(\n 'w-4 h-4 fill-sidebar-notificationButton-textAndIcon-default',\n isMouseEnter && 'fill-sidebar-notificationButton-textAndIcon-hover',\n isMouseDown && 'fill-sidebar-notificationButton-textAndIcon-active'\n ),\n iconStyles\n )}\n />\n </div>\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={label}\n className={twMerge('text-sm text-left line-clamp-1 w-full', labelStyles)}\n />\n </div>\n )}\n {!!notificationCount && (\n <BaseBadge\n label={notificationCount.toString()}\n labelStyles={twMerge(\n 'text-[10px] text-sidebar-notificationBadge-textAndIcon-default',\n notificationCountTextStyles\n )}\n containerStyles={twMerge(\n classNames(\n 'flex items-center justify-center bg-sidebar-notificationBadge-background-default min-w-[16px] h-4 rounded-full p-0.5',\n `${!isShow && 'absolute right-0 top-0'}`\n ),\n notificationCountContainerStyles\n )}\n />\n )}\n </button>\n </BasePopover.Button>\n <BasePopover.Panel>\n {getChildrenOnDisplayName(\n typeof children === 'function' ? children({ open, close }) : children,\n 'PopoverPanel'\n )}\n </BasePopover.Panel>\n </>\n );\n }}\n </BasePopover>\n );\n};\nPopover.displayName = 'Popover';\nSidebar.Popover = Popover;\n\nconst PopoverPanel = ({ children }: { children: React.ReactNode }) => {\n return <>{children}</>;\n};\nPopoverPanel.displayName = 'PopoverPanel';\nSidebar.PopoverPanel = PopoverPanel;\n\nconst Header = ({\n isCollapsed,\n appLogoClosed,\n appLogoClosedStyles,\n appLogoOpened,\n appLogoOpenedStyles,\n containerStyles,\n onClickHeaderSidebar,\n children\n}: SidebarHeaderInterface) => {\n // TODO: create hooks for code below\n const [isShow, setIsShow] = React.useState<boolean>(false);\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div\n className={twMerge(\n 'flex flex-row items-center h-14 gap-x-2 p-2 cursor-pointer',\n containerStyles\n )}\n onClick={() => onClickHeaderSidebar?.()}\n >\n {isShow ? (\n <div className='flex flex-1'>\n <img\n src={\n appLogoOpened ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGc.svg'\n }\n className={twMerge('w-[113px] h-7', appLogoOpenedStyles)}\n />\n </div>\n ) : (\n <img\n src={\n appLogoClosed ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg'\n }\n className={twMerge('w-[22px] h-[22px]', appLogoClosedStyles)}\n />\n )}\n </div>\n )}\n </>\n );\n};\nHeader.displayName = 'Header';\nSidebar.Header = Header;\n\nconst UserProfile = ({\n isCollapsed,\n userLabel,\n userLabelStyles,\n userAvatar,\n userAvatarFallback,\n userAvatarFallbackStyles,\n userAvatarStyles,\n containerStyles,\n // Panel\n panelContainerStyles,\n titleAtPanel,\n titleAtPanelStyles,\n userAvatarAtPanel,\n userAvatarAtPanelStyles,\n userAvatarFallbackAtPanel,\n userAvatarFallbackAtPanelStyles,\n userLabelAtPanel,\n userLabelAtPanelStyles,\n userEmailAtPanel,\n userEmailAtPanelStyles,\n manageAccountLabelAtPanel,\n manageAccountLabelAtPanelStyles,\n iconManageAccountAtPanel,\n iconManageAccountAtPanelStyles,\n onClickManageAccount,\n manageAccountContainerStyles,\n translationLabelAtPanel,\n translationLabelAtPanelStyles,\n iconTranslationAtPanel,\n iconTranslationAtPanelStyles,\n onClickTranslation,\n translationContainerStyles,\n logoutLabelAtPanel,\n logoutLabelAtPanelStyles,\n iconLogoutAtPanel,\n iconLogoutAtPanelStyles,\n onClickLogout,\n children,\n offsetX,\n offsetY,\n position,\n isAutoFlip\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nSidebarUserProfileInterface) => {\n const [isShow, setIsShow] = React.useState<boolean>(false);\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div className={twMerge('flex flex-col w-full')}>\n <Divider />\n <div className='relative min-h-[56px] flex items-center w-full'>\n <BasePopover\n offsetX={offsetX}\n offsetY={offsetY}\n isAutoFlip={isAutoFlip}\n panelContainerStyles={panelContainerStyles}\n containerStyles='w-full'\n position={position}\n >\n {/* eslint-disable-next-line sonarjs/cognitive-complexity */}\n {({ open, close }) => {\n return (\n <>\n <BasePopover.Button>\n <div\n className={twMerge(\n classNames(\n `\n w-full flex flex-row items-center h-10 gap-x-2 p-2 rounded-lg \n bg-sidebar-profile-background-default active:bg-sidebar-profile-background-active hover:bg-sidebar-profile-background-hover \n text-sidebar-profile-text-default active:text-sidebar-profile-text-active hover:text-sidebar-profile-text-hover\n cursor-pointer\n `,\n open &&\n 'bg-sidebar-profile-background-active text-sidebar-profile-text-active'\n ),\n containerStyles\n )}\n >\n {userAvatar ? (\n <img\n src={\n userAvatar ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png'\n }\n className={twMerge(\n 'w-6 h-6 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover',\n userAvatarStyles\n )}\n />\n ) : (\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded',\n userAvatarStyles\n )}\n >\n <BaseText\n label={userAvatarFallback}\n className={twMerge(\n 'font-semibold text-sidebar-avatar-text-default text-[10px]',\n userAvatarFallbackStyles\n )}\n />\n </div>\n )}\n\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={userLabel || ''}\n className={twMerge('line-clamp-1 w-full text-left', userLabelStyles)}\n />\n </div>\n )}\n </div>\n </BasePopover.Button>\n <BasePopover.Panel>\n <div\n className={twMerge(\n 'flex flex-col py-3 bg-dark-solitude rounded min-w-[240px]',\n panelContainerStyles\n )}\n >\n <div className='px-4'>\n <BaseText\n label={titleAtPanel || 'Account'}\n className={twMerge(\n 'text-sm font-semibold text-dark-blackCoral',\n titleAtPanelStyles\n )}\n />\n </div>\n <div className='flex flex-row items-center px-4 mt-2 gap-x-2'>\n {userAvatarAtPanel ? (\n <img\n src={\n userAvatarAtPanel ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/avatar.png'\n }\n className={twMerge(\n 'w-8 h-8 bg-sidebar-avatar-background-default rounded overflow-hidden object-cover',\n userAvatarAtPanelStyles\n )}\n />\n ) : (\n <div\n className={twMerge(\n 'flex items-center justify-center w-8 h-8 bg-sidebar-avatar-background-default rounded',\n userAvatarAtPanelStyles\n )}\n >\n <BaseText\n label={userAvatarFallbackAtPanel}\n className={twMerge(\n 'font-semibold text-sidebar-avatar-text-default text-[10px]',\n userAvatarFallbackAtPanelStyles\n )}\n />\n </div>\n )}\n\n <div className='flex flex-col'>\n <BaseText\n label={userLabelAtPanel || ''}\n className={twMerge(\n 'w-full line-clamp-1 font-normal text-sm text-dark-blackCoral',\n userLabelAtPanelStyles\n )}\n />\n <BaseText\n label={userEmailAtPanel || ''}\n className={twMerge(\n 'w-full line-clamp-1 font-normal text-[10px] text-dark-gumbo',\n userEmailAtPanelStyles\n )}\n />\n </div>\n </div>\n <button\n className={twMerge(\n 'flex flex-row items-center px-4 gap-x-2 mt-3 bg-transparent',\n manageAccountContainerStyles\n )}\n onClick={() => {\n close();\n onClickManageAccount?.();\n }}\n >\n <Icon\n name={iconManageAccountAtPanel || 'configuration'}\n className={twMerge(\n 'w-4 h-4 fill-dark-gumbo',\n iconManageAccountAtPanelStyles\n )}\n />\n <BaseText\n label={manageAccountLabelAtPanel || 'Manage Account'}\n className={twMerge(\n 'text-sm font-normal text-dark-blackCoral',\n manageAccountLabelAtPanelStyles\n )}\n />\n </button>\n <button\n className={twMerge(\n 'flex flex-row items-center px-4 gap-x-2 mt-3 mb-4 bg-transparent',\n translationContainerStyles\n )}\n onClick={() => {\n close();\n onClickTranslation?.();\n }}\n >\n <Icon\n name={iconTranslationAtPanel || 'language'}\n className={twMerge(\n 'w-4 h-4 fill-dark-gumbo',\n iconTranslationAtPanelStyles\n )}\n />\n <BaseText\n label={translationLabelAtPanel || 'Translate Page'}\n className={twMerge(\n 'text-sm font-normal text-dark-blackCoral',\n translationLabelAtPanelStyles\n )}\n />\n </button>\n <div className='h-[1px] w-full bg-dark-silver' />\n <button\n className='flex flex-row items-center px-4 gap-x-2 mt-3 mb-0.5 bg-transparent'\n onClick={() => {\n close();\n onClickLogout?.();\n }}\n >\n <Icon\n name={iconLogoutAtPanel || 'logout'}\n className={twMerge('w-4 h-4 fill-dark-gumbo', iconLogoutAtPanelStyles)}\n />\n <BaseText\n label={logoutLabelAtPanel || 'Logout'}\n className={twMerge(\n 'text-sm font-normal text-dark-blackCoral',\n logoutLabelAtPanelStyles\n )}\n />\n </button>\n </div>\n </BasePopover.Panel>\n </>\n );\n }}\n </BasePopover>\n </div>\n <Divider />\n </div>\n )}\n </>\n );\n};\nUserProfile.displayName = 'UserProfile';\nSidebar.UserProfile = UserProfile;\n\nconst Footer = ({\n isCollapsed,\n isShowCompanyProfile,\n companyName,\n companyNameStyles,\n companyLogo,\n companyLogoStyles,\n companyLogoFallback,\n companlogoFallbackStyles,\n companyLogoContainerStyles,\n isShowButtonChangeCompany,\n buttonChangeCompanyOnClick,\n buttonChangeCompanyLabel,\n buttonChangeCompanyStyles,\n buttonChangeCompanyIconName,\n buttonChangeCompanyIconStyles,\n appName,\n appVersion,\n children\n}: // eslint-disable-next-line sonarjs/cognitive-complexity\nSidebarFooterInterface) => {\n const [isShow, setIsShow] = React.useState<boolean>(false);\n useEffect(() => {\n if (!isCollapsed) {\n setTimeout(() => {\n setIsShow(true);\n }, 200);\n } else {\n setIsShow(false);\n }\n }, [isCollapsed]);\n\n return (\n <>\n {children ? (\n children\n ) : (\n <div className='px-2 pt-2'>\n {isShowCompanyProfile && (\n <div className='flex flex-row items-center gap-x-2'>\n {companyLogo ? (\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded',\n companyLogoContainerStyles\n )}\n >\n <img\n src={\n companyLogo ||\n 'https://s3.ap-southeast-1.amazonaws.com/assets.frontend/new-toolkit/logoGcSquare.svg'\n }\n className={twMerge('w-4 h-4', companyLogoStyles)}\n />\n </div>\n ) : (\n <div\n className={twMerge(\n 'flex items-center justify-center w-6 h-6 bg-sidebar-avatar-background-default rounded',\n companyLogoContainerStyles\n )}\n >\n <BaseText\n label={companyLogoFallback}\n className={twMerge(\n 'font-semibold text-sidebar-avatar-text-default text-[10px]',\n companlogoFallbackStyles\n )}\n />\n </div>\n )}\n {isShow && (\n <div className='flex flex-1'>\n <BaseText\n label={companyName || 'Gajicermat'}\n className={twMerge(\n 'text-sidebar-companyNameText-default text-xs line-clamp-2',\n companyNameStyles\n )}\n />\n </div>\n )}\n </div>\n )}\n\n {isShowButtonChangeCompany && (\n <div className='flex flex-row items-center w-full h-14'>\n <BaseButton\n variant='secondary'\n onClick={() => buttonChangeCompanyOnClick?.()}\n label={isShow ? buttonChangeCompanyLabel || 'Select Company' : ''}\n className={twMerge(\n classNames(\n 'flex items-center justify-center p-0 h-6 ml-0',\n isShow ? 'w-full' : 'w-6'\n ),\n buttonChangeCompanyStyles\n )}\n rightIcon={isShow ? undefined : buttonChangeCompanyIconName || 'refresh'}\n rightIconStyles={twMerge('ml-0 w-3 h-3', buttonChangeCompanyIconStyles)}\n />\n </div>\n )}\n\n <div className='flex flex-row items-center w-full mt-2 gap-x-2 min-h-4'>\n {isShow ? (\n <>\n <div className='flex flex-1'>\n <BaseText\n label={appName || '© Gajicermat Digital Mandiri'}\n className='text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-right font-normal'\n />\n </div>\n <div className='w-[1px] h-3 bg-sidebar-appVersionText-default' />\n <div className='flex flex-1'>\n <BaseText\n label={appVersion || 'Version 0.0.0'}\n className='text-sidebar-appVersionText-default text-[10px] line-clamp-1 w-full text-left font-normal'\n />\n </div>\n </>\n ) : (\n <div className='w-[1px] h-3 ' />\n )}\n </div>\n </div>\n )}\n </>\n );\n};\nFooter.displayName = 'Footer';\nSidebar.Footer = Footer;\n\nexport default Sidebar;\n"],"names":["Divider","_jsx","className","SidebarMenu","id","title","titleStyles","icon","iconStyles","subMenu","subMenuTitleStyles","isCollapsed","activeId","selectedId","notificationCountContainerStyles","notificationCountTextStyles","itemMenuContainerStyles","itemMenuActiveContainerStyles","itemMenuActiveBgColor","itemSubMenuContainerStyles","itemSubMenuActiveContainerStyles","itemSubMenuActiveTextColor","onClickCollapsible","onExpand","onClickNav","notifcationCount","expanded","isShow","setIsShow","React","useState","isMenuMouseEnter","setIsMenuMouseEnter","isMenuMouseDown","setIsMenuMouseDown","useEffect","setTimeout","_jsxs","jsxs","Object","assign","twMerge","style","backgroundColor","undefined","children","onClick","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","jsx","Icon","name","classNames","BaseText","label","BaseBadge","toString","labelStyles","containerStyles","map","item","index","navLink","color","Sidebar","activeParent","data","itemMenuIconStyles","itemMenuTitleStyles","itemSubMenuTitleStyles","toggleButtonContainerStyles","toggleIconOpenName","toggleIconCloseName","toggleIconStyles","header","getChildrenOnDisplayName","footer","userProfile","setSelectedId","arrayChildren","Children","toArray","BaseButtonIcon","variant","iconName","permission","child","Popover","notificationCount","position","iconTriangleStyles","iconTriangleContainerStyles","panelContainerStyles","offsetX","offsetY","isAutoFlip","isMouseEnter","setIsMouseEnter","isMouseDown","setIsMouseDown","BasePopover","open","close","_Fragment","Button","Panel","displayName","PopoverPanel","Fragment","Header","appLogoClosed","appLogoClosedStyles","appLogoOpened","appLogoOpenedStyles","onClickHeaderSidebar","src","UserProfile","userLabel","userLabelStyles","userAvatar","userAvatarFallback","userAvatarFallbackStyles","userAvatarStyles","titleAtPanel","titleAtPanelStyles","userAvatarAtPanel","userAvatarAtPanelStyles","userAvatarFallbackAtPanel","userAvatarFallbackAtPanelStyles","userLabelAtPanel","userLabelAtPanelStyles","userEmailAtPanel","userEmailAtPanelStyles","manageAccountLabelAtPanel","manageAccountLabelAtPanelStyles","iconManageAccountAtPanel","iconManageAccountAtPanelStyles","onClickManageAccount","manageAccountContainerStyles","translationLabelAtPanel","translationLabelAtPanelStyles","iconTranslationAtPanel","iconTranslationAtPanelStyles","onClickTranslation","translationContainerStyles","logoutLabelAtPanel","logoutLabelAtPanelStyles","iconLogoutAtPanel","iconLogoutAtPanelStyles","onClickLogout","Footer","isShowCompanyProfile","companyName","companyNameStyles","companyLogo","companyLogoStyles","companyLogoFallback","companlogoFallbackStyles","companyLogoContainerStyles","isShowButtonChangeCompany","buttonChangeCompanyOnClick","buttonChangeCompanyLabel","buttonChangeCompanyStyles","buttonChangeCompanyIconName","buttonChangeCompanyIconStyles","appName","appVersion","BaseButton","rightIcon","rightIconStyles"],"mappings":"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"}
@@ -28,6 +28,7 @@ export type SidebarMenuInterface = {
28
28
  icon: IconType;
29
29
  iconStyles?: string;
30
30
  subMenu?: Array<SidebarMenuDefaultInterface>;
31
+ subMenuTitleStyles?: string;
31
32
  notifcationCount?: number;
32
33
  } & SidebarMenuDefaultInterface;
33
34
  export type SidebarHeaderInterface = {
@@ -134,6 +135,7 @@ export type SidebarInterface = {
134
135
  itemMenuTitleStyles?: string;
135
136
  itemMenuIconStyles?: string;
136
137
  itemMenuActiveBgColor?: string;
138
+ itemSubMenuTitleStyles?: string;
137
139
  itemSubMenuContainerStyles?: string;
138
140
  itemSubMenuActiveTextColor?: string;
139
141
  notificationCountContainerStyles?: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "uangcermat-web-toolkit-v2",
3
- "version": "0.2.29",
3
+ "version": "0.2.30",
4
4
  "outputDir": "build",
5
5
  "main": "build/src/index.js",
6
6
  "types": "build/src/index.d.ts",