npm - @bikdotai/bik-component-library - Versions diffs - 0.0.804-beta.17 → 0.0.804-beta.18 - Mend

@bikdotai/bik-component-library 0.0.804-beta.17 → 0.0.804-beta.18

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.

Files changed (2585) hide show

package/dist/esm/components/avatar/Avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","sources":["../../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { AvatarStyle } from '@src/components/avatar/Avatar.styled';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport {\n\tBodyTiny,\n\tTitleMedium,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport BikLivechatIcon from '../../assets/icons/bik_livechat.svg';\nimport EmailIcon from '../../assets/icons/email-channel.svg';\nimport FacebookIcon from '../../assets/icons/facebook_channel.svg';\nimport GmailIcon from '../../assets/icons/gmail.svg';\nimport InstagramIcon from '../../assets/icons/instagram-channel.svg';\nimport TaskIcon from '../../assets/icons/task.svg';\nimport WhatsappIcon from '../../assets/icons/whatsapp_color.svg';\n\nexport const AVATAR_SIZE_VS_ICON_SIZE_MAP = {\n\t[SIZE.SMALL]: 16,\n\t[SIZE.MEDIUM]: 20,\n\t[SIZE.INBOX]: 24,\n\t[SIZE.LARGE]: 32,\n};\n\nexport const BACKGROUND_VS_TEXT_COLOR_MAP = {\n\t[AVATAR_BACKGROUND.LIGHT]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.WHITE]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.DARK]: COLORS.surface.standard,\n};\n\nexport type AvatarProps = {\n\ttype: AVATAR_TYPES;\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\tname?: string;\n\tphotoUrl?: string;\n\ticon?: React.FC<{ width: number; height: number; color: string }>;\n\tuseNameFallback?: boolean;\n\tchannelName?: MESSAGE_CHANNELS;\n\tborderRadius?: string;\n\tinboxSettings?: {\n\t\tisSelected: boolean;\n\t\tisComments: boolean;\n\t};\n\tstatus?: 'ONLINE' \| 'OFFLINE' \| 'AWAY';\n};\n\nexport const enum MESSAGE_CHANNELS {\n\tINSTAGRAM = 'instagram',\n\tMESSENGER = 'messenger',\n\tWHATSAPP = 'whatsapp',\n\tGMAIL = 'gmail',\n\tLIVECHAT = 'livechat',\n\tGOOGLE_BUSINESS_CHAT = 'gbm',\n\tSHOPIFY = 'shopify',\n\tFACEBOOK = 'facebook',\n\tEMAIL = 'email',\n\tSMTP = 'smtp',\n\tFACEBOOK_CATALOG = 'facebook-catalog',\n\tTASKS = 'tasks',\n\tBIK_LIVECHAT = 'livechat',\n}\n\nexport const Avatar: React.FC<AvatarProps> = (props) => {\n\tconst [imgError, setImgError] = useState<boolean>(false);\n\n\tconst getInitials = () => {\n\t\tconst initials = (props.name \|\| '')\n\t\t\t.split('.')\n\t\t\t.join(' ')\n\t\t\t.split(' ')\n\t\t\t.map((e) => e.charAt(0).toUpperCase())\n\t\t\t.slice(0, 2)\n\t\t\t.join('');\n\n\t\tif (props.size === SIZE.SMALL) {\n\t\t\treturn (\n\t\t\t\t<BodyTiny\n\t\t\t\t\tstyle={{ color: BACKGROUND_VS_TEXT_COLOR_MAP[props.background] }}\n\t\t\t\t>\n\t\t\t\t\t{initials}\n\t\t\t\t</BodyTiny>\n\t\t\t);\n\t\t} else if (props.size === SIZE.MEDIUM \|\| props.size === SIZE.INBOX) {\n\t\t\treturn (\n\t\t\t\t<TitleSmall\n\t\t\t\t\tstyle={{ color: BACKGROUND_VS_TEXT_COLOR_MAP[props.background] }}\n\t\t\t\t>\n\t\t\t\t\t{initials}\n\t\t\t\t</TitleSmall>\n\t\t\t);\n\t\t} else if (props.size === SIZE.LARGE) {\n\t\t\treturn (\n\t\t\t\t<TitleMedium\n\t\t\t\t\tstyle={{ color: BACKGROUND_VS_TEXT_COLOR_MAP[props.background] }}\n\t\t\t\t>\n\t\t\t\t\t{initials}\n\t\t\t\t</TitleMedium>\n\t\t\t);\n\t\t}\n\t};\n\n\tconst getImageBlock = () => {\n\t\tif (props.useNameFallback && (!props.photoUrl \|\| imgError) && props.name) {\n\t\t\treturn <div>{getInitials()}</div>;\n\t\t}\n\t\tif (props.useNameFallback && props.photoUrl && !imgError) {\n\t\t\treturn (\n\t\t\t\t<img\n\t\t\t\t\talt=\"\"\n\t\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t\t}}\n\t\t\t\t\tsrc={props.photoUrl}\n\t\t\t\t\tonError={() => {\n\t\t\t\t\t\tsetImgError(true);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<img\n\t\t\t\talt=\"\"\n\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\tstyle={{\n\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t}}\n\t\t\t\tsrc={props.photoUrl}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getChannelIcon = () => {\n\t\tswitch (props.channelName) {\n\t\t\tcase MESSAGE_CHANNELS.EMAIL:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.SMTP:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK_CATALOG:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.MESSENGER:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.INSTAGRAM:\n\t\t\t\treturn <InstagramIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.WHATSAPP:\n\t\t\t\treturn <WhatsappIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.GMAIL:\n\t\t\t\treturn <GmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.TASKS:\n\t\t\t\treturn <TaskIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.BIK_LIVECHAT:\n\t\t\t\treturn <BikLivechatIcon width={11} height={11} />;\n\t\t}\n\t};\n\n\tconst getOnlineStatusIcon = () => {\n\t\treturn props.status ? (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tprops.status === 'ONLINE'\n\t\t\t\t\t\t\t? COLORS.special.whatsapp.brand\n\t\t\t\t\t\t\t: COLORS.content.inactive,\n\t\t\t\t\twidth: '8px',\n\t\t\t\t\theight: '8px',\n\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t}}\n\t\t\t></div>\n\t\t) : null;\n\t};\n\n\tconst getPropsType = () => {\n\t\tif (\n\t\t\tprops.type === AVATAR_TYPES.IMAGE &&\n\t\t\t(imgError \|\| !props.photoUrl) &&\n\t\t\tprops.useNameFallback &&\n\t\t\tprops.name\n\t\t) {\n\t\t\treturn AVATAR_TYPES.INITIALS;\n\t\t}\n\n\t\treturn props.type;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'relative',\n\t\t\t}}\n\t\t>\n\t\t\t<AvatarStyle\n\t\t\t\ttype={getPropsType()}\n\t\t\t\tsize={props.size}\n\t\t\t\tbackground={props.background}\n\t\t\t>\n\t\t\t\t{props.type === AVATAR_TYPES.IMAGE && getImageBlock()}\n\t\t\t\t{props.type === AVATAR_TYPES.INITIALS && <div>{getInitials()}</div>}\n\t\t\t\t{props.type === AVATAR_TYPES.ICON && props.icon && (\n\t\t\t\t\t<props.icon\n\t\t\t\t\t\twidth={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\theight={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\tcolor={BACKGROUND_VS_TEXT_COLOR_MAP[props.background]}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</AvatarStyle>\n\t\t\t{props.inboxSettings && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 14,\n\t\t\t\t\t\theight: 14,\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: props.inboxSettings.isSelected\n\t\t\t\t\t\t\t? props.inboxSettings.isComments\n\t\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t: props.inboxSettings.isComments\n\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getChannelIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.status && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 11,\n\t\t\t\t\t\theight: 11,\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getOnlineStatusIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["AVATAR_SIZE_VS_ICON_SIZE_MAP","SIZE","SMALL","MEDIUM","INBOX","LARGE","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","LIGHT","COLORS","content","secondary","WHITE","DARK","surface","standard","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","name","split","join","map","e","charAt","toUpperCase","slice","size","_jsx","BodyTiny","Object","assign","style","color","background","TitleSmall","TitleMedium","_jsxs","position","children","AvatarStyle","type","AVATAR_TYPES","IMAGE","photoUrl","useNameFallback","INITIALS","alt","width","AVATAR_SIZE_MAP","height","borderRadius","objectFit","src","onError","ICON","icon","inboxSettings","left","top","display","justifyContent","backgroundColor","isSelected","isComments","primary","brandLight","alignItems","getChannelIcon","channelName","EMAIL","SMTP","EmailIcon","FACEBOOK","FACEBOOK_CATALOG","MESSENGER","FacebookIcon","INSTAGRAM","InstagramIcon","WHATSAPP","WhatsappIcon","GMAIL","GmailIcon","TASKS","TaskIcon","BIK_LIVECHAT","BikLivechatIcon","status","special","whatsapp","brand","inactive"],"mappings":"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"}
1	+ {"version":3,"file":"Avatar.js","sources":["../../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n\tBodyTiny,\n\tTitleMedium,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport BikLivechatIcon from '../../assets/icons/bik_livechat.svg';\nimport EmailIcon from '../../assets/icons/email-channel.svg';\nimport FacebookIcon from '../../assets/icons/facebook_channel.svg';\nimport GmailIcon from '../../assets/icons/gmail.svg';\nimport InstagramIcon from '../../assets/icons/instagram-channel.svg';\nimport TaskIcon from '../../assets/icons/task.svg';\nimport WhatsappIcon from '../../assets/icons/whatsapp_color.svg';\nimport { AvatarStyle } from './Avatar.styled';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from './AvatarHelper';\n\nexport const AVATAR_SIZE_VS_ICON_SIZE_MAP = {\n\t[SIZE.EXTRA_SMALL]: 10,\n\t[SIZE.SMALL]: 16,\n\t[SIZE.MEDIUM]: 20,\n\t[SIZE.LARGE]: 32,\n};\n\nexport const BACKGROUND_VS_TEXT_COLOR_MAP = {\n\t[AVATAR_BACKGROUND.LIGHT]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.WHITE]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.DARK]: COLORS.surface.standard,\n\t[AVATAR_BACKGROUND.BRAND]: COLORS.background.inverseLight,\n};\n\nexport type AvatarProps = {\n\ttype: AVATAR_TYPES;\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\tname?: string;\n\tphotoUrl?: string;\n\ticon?: React.FC<{ width: number; height: number; color: string }>;\n\tuseNameFallback?: boolean;\n\tchannelName?: MESSAGE_CHANNELS;\n\tborderRadius?: string;\n\tinboxSettings?: {\n\t\tisSelected: boolean;\n\t\tisComments: boolean;\n\t};\n\tstatus?: 'ONLINE' \| 'OFFLINE' \| 'AWAY';\n};\n\nexport const enum MESSAGE_CHANNELS {\n\tINSTAGRAM = 'instagram',\n\tMESSENGER = 'messenger',\n\tWHATSAPP = 'whatsapp',\n\tGMAIL = 'gmail',\n\tLIVECHAT = 'livechat',\n\tGOOGLE_BUSINESS_CHAT = 'gbm',\n\tSHOPIFY = 'shopify',\n\tFACEBOOK = 'facebook',\n\tEMAIL = 'email',\n\tSMTP = 'smtp',\n\tFACEBOOK_CATALOG = 'facebook-catalog',\n\tTASKS = 'tasks',\n\tBIK_LIVECHAT = 'livechat',\n}\n\nexport const Avatar: React.FC<AvatarProps> = (props) => {\n\tconst [imgError, setImgError] = useState<boolean>(false);\n\n\tconst getInitials = () => {\n\t\tconst initials = (props.name \|\| '')\n\t\t\t.split('.')\n\t\t\t.join(' ')\n\t\t\t.split(' ')\n\t\t\t.map((e) => e.charAt(0).toUpperCase())\n\t\t\t.slice(0, 2)\n\t\t\t.join('');\n\n\t\tconst color = BACKGROUND_VS_TEXT_COLOR_MAP[props.background];\n\n\t\tif (props.size === SIZE.LARGE) {\n\t\t\treturn <TitleMedium style={{ color }}>{initials}</TitleMedium>;\n\t\t}\n\t\tif (props.size === SIZE.MEDIUM) {\n\t\t\treturn <TitleSmall style={{ color }}>{initials}</TitleSmall>;\n\t\t}\n\t\treturn <BodyTiny style={{ color }}>{initials}</BodyTiny>;\n\t};\n\n\tconst getImageBlock = () => {\n\t\tif (props.useNameFallback && (!props.photoUrl \|\| imgError) && props.name) {\n\t\t\treturn <div>{getInitials()}</div>;\n\t\t}\n\t\tif (props.useNameFallback && props.photoUrl && !imgError) {\n\t\t\treturn (\n\t\t\t\t<img\n\t\t\t\t\talt=\"\"\n\t\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t\t}}\n\t\t\t\t\tsrc={props.photoUrl}\n\t\t\t\t\tonError={() => {\n\t\t\t\t\t\tsetImgError(true);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<img\n\t\t\t\talt=\"\"\n\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\tstyle={{\n\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t}}\n\t\t\t\tsrc={props.photoUrl}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getChannelIcon = () => {\n\t\tswitch (props.channelName) {\n\t\t\tcase MESSAGE_CHANNELS.EMAIL:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.SMTP:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK_CATALOG:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.MESSENGER:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.INSTAGRAM:\n\t\t\t\treturn <InstagramIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.WHATSAPP:\n\t\t\t\treturn <WhatsappIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.GMAIL:\n\t\t\t\treturn <GmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.TASKS:\n\t\t\t\treturn <TaskIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.BIK_LIVECHAT:\n\t\t\t\treturn <BikLivechatIcon width={11} height={11} />;\n\t\t}\n\t};\n\n\tconst getOnlineStatusIcon = () => {\n\t\treturn props.status ? (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tprops.status === 'ONLINE'\n\t\t\t\t\t\t\t? COLORS.special.whatsapp.brand\n\t\t\t\t\t\t\t: COLORS.content.inactive,\n\t\t\t\t\twidth: '8px',\n\t\t\t\t\theight: '8px',\n\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t}}\n\t\t\t></div>\n\t\t) : null;\n\t};\n\n\tconst getPropsType = () => {\n\t\tif (\n\t\t\tprops.type === AVATAR_TYPES.IMAGE &&\n\t\t\t(imgError \|\| !props.photoUrl) &&\n\t\t\tprops.useNameFallback &&\n\t\t\tprops.name\n\t\t) {\n\t\t\treturn AVATAR_TYPES.INITIALS;\n\t\t}\n\n\t\treturn props.type;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'relative',\n\t\t\t}}\n\t\t>\n\t\t\t<AvatarStyle\n\t\t\t\ttype={getPropsType()}\n\t\t\t\tsize={props.size}\n\t\t\t\tbackground={props.background}\n\t\t\t>\n\t\t\t\t{props.type === AVATAR_TYPES.IMAGE && getImageBlock()}\n\t\t\t\t{props.type === AVATAR_TYPES.INITIALS && <div>{getInitials()}</div>}\n\t\t\t\t{props.type === AVATAR_TYPES.ICON && props.icon && (\n\t\t\t\t\t<props.icon\n\t\t\t\t\t\twidth={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\theight={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\tcolor={BACKGROUND_VS_TEXT_COLOR_MAP[props.background]}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</AvatarStyle>\n\t\t\t{props.inboxSettings && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 14,\n\t\t\t\t\t\theight: 14,\n\t\t\t\t\t\tborderRadius: props?.borderRadius \|\| '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: props.inboxSettings.isSelected\n\t\t\t\t\t\t\t? props.inboxSettings.isComments\n\t\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t: props.inboxSettings.isComments\n\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getChannelIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.status && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 11,\n\t\t\t\t\t\theight: 11,\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getOnlineStatusIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["AVATAR_SIZE_VS_ICON_SIZE_MAP","SIZE","EXTRA_SMALL","SMALL","MEDIUM","LARGE","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","LIGHT","COLORS","content","secondary","WHITE","DARK","surface","standard","BRAND","background","inverseLight","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","name","split","join","map","e","charAt","toUpperCase","slice","color","size","_jsx","TitleMedium","Object","assign","style","children","TitleSmall","BodyTiny","_jsxs","position","AvatarStyle","type","AVATAR_TYPES","IMAGE","photoUrl","useNameFallback","INITIALS","alt","width","AVATAR_SIZE_MAP","height","borderRadius","objectFit","src","onError","ICON","icon","inboxSettings","left","top","display","justifyContent","backgroundColor","isSelected","isComments","primary","brandLight","alignItems","getChannelIcon","channelName","EMAIL","SMTP","EmailIcon","FACEBOOK","FACEBOOK_CATALOG","MESSENGER","FacebookIcon","INSTAGRAM","InstagramIcon","WHATSAPP","WhatsappIcon","GMAIL","GmailIcon","TASKS","TaskIcon","BIK_LIVECHAT","BikLivechatIcon","status","special","whatsapp","brand","inactive"],"mappings":"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"}

package/dist/esm/components/avatar/Avatar.styled.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import r from"styled-components";import{AVATAR_SIZE_MAP as e,AVATAR_TYPES as o,AVATAR_BACKGROUND as t}from"./AvatarHelper.js";import{COLORS as n}from"../../constants/Theme.js";const s=r.div`
-	width: ${r=>e[r.size]+"px"};
-	height: ${r=>e[r.size]+"px"};
+import r from"styled-components";import{AVATAR_SIZE_MAP as o,AVATAR_TYPES as e,AVATAR_BACKGROUND as n}from"./AvatarHelper.js";import{COLORS as t}from"../../constants/Theme.js";const a=r.div`
+	width: ${r=>o[r.size]+"px"};
+	height: ${r=>o[r.size]+"px"};
 	display: flex;
 	justify-content: center;
 	align-items: center;
-	background-color: ${r=>r.type===o.IMAGE?"null":r.background===t.LIGHT?n.background.base:r.background===t.WHITE?n.surface.standard:n.background.inverse};
-	border: ${r=>r.background===t.LIGHT||r.background===t.WHITE?"1px solid "+n.stroke.primary:0};
+	background-color: ${r=>r.type===e.IMAGE?"null":r.background===n.LIGHT?t.background.base:r.background===n.WHITE?t.surface.standard:r.background===n.BRAND?t.background.brandLight:t.background.inverse};
+	border: ${r=>r.background===n.LIGHT||r.background===n.WHITE?"1px solid "+t.stroke.primary:0};
 	border-radius: 50%;
-`;export{s as AvatarStyle};
+`;export{a as AvatarStyle};
 //# sourceMappingURL=Avatar.styled.js.map

package/dist/esm/components/avatar/Avatar.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT \|\|\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n"],"names":["AvatarStyle","styled","div","props","AVATAR_SIZE_MAP","size","type","AVATAR_TYPES","IMAGE","background","AVATAR_BACKGROUND","LIGHT","COLORS","base","WHITE","surface","standard","inverse","stroke","primary"],"mappings":"gLASaA,MAAAA,EAAcC,EAAOC,GAIhC;UACSC,GAAUC,EAAgBD,EAAME,MAAQ;WACvCF,GAAUC,EAAgBD,EAAME,MAAQ;;;;qBAI9BF,GACpBA,EAAMG,OAASC,EAAaC,MACzB,OACAL,EAAMM,aAAeC,EAAkBC,MACvCC,EAAOH,WAAWI,KAClBV,EAAMM,aAAeC,EAAkBI,MACvCF,EAAOG,QAAQC,~~SACfJ~~,EAAOH,~~WAAWQ~~;~~WACXd~~,GACVA,EAAMM,aAAeC,EAAkBC,OACvCR,EAAMM,aAAeC,EAAkBI,MACpC,aAAeF,~~EAAOM~~,OAAOC,QAC7B;;"}
1	+ {"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: props.background === AVATAR_BACKGROUND.BRAND\n\t\t\t? COLORS.background.brandLight\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT \|\|\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n"],"names":["AvatarStyle","styled","div","props","AVATAR_SIZE_MAP","size","type","AVATAR_TYPES","IMAGE","background","AVATAR_BACKGROUND","LIGHT","COLORS","base","WHITE","surface","standard","BRAND","brandLight","inverse","stroke","primary"],"mappings":"gLASaA,MAAAA,EAAcC,EAAOC,GAIhC;UACSC,GAAUC,EAAgBD,EAAME,MAAQ;WACvCF,GAAUC,EAAgBD,EAAME,MAAQ;;;;qBAI9BF,GACpBA,EAAMG,OAASC,EAAaC,MACzB,OACAL,EAAMM,aAAeC,EAAkBC,MACvCC,EAAOH,WAAWI,KAClBV,EAAMM,aAAeC,EAAkBI,MACvCF,EAAOG,QAAQC,SACfb,EAAMM,aAAeC,EAAkBO,MACvCL,EAAOH,WAAWS,WAClBN,EAAOH,WAAWU;WACXhB,GACVA,EAAMM,aAAeC,EAAkBC,OACvCR,EAAMM,aAAeC,EAAkBI,MACpC,aAAeF,EAAOQ,OAAOC,QAC7B;;"}

package/dist/esm/components/avatar/AvatarHelper.d.ts ADDED Viewed

@@ -0,0 +1,23 @@
+export declare enum AVATAR_TYPES {
+    IMAGE = "IMAGE",
+    INITIALS = "INITIALS",
+    ICON = "ICON"
+}
+export declare enum SIZE {
+    EXTRA_SMALL = "EXTRA_SMALL",
+    SMALL = "SMALL",
+    MEDIUM = "MEDIUM",
+    LARGE = "LARGE"
+}
+export declare enum AVATAR_BACKGROUND {
+    LIGHT = "LIGHT",
+    DARK = "DARK",
+    WHITE = "WHITE",
+    BRAND = "BRAND"
+}
+export declare const AVATAR_SIZE_MAP: {
+    EXTRA_SMALL: number;
+    SMALL: number;
+    MEDIUM: number;
+    LARGE: number;
+};

package/dist/esm/components/avatar/AvatarHelper.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var I,L,A;!function(I){I.IMAGE="IMAGE",I.INITIALS="INITIALS",I.ICON="ICON"}(I||(I={})),function(I){I.SMALL="SMALL",I.MEDIUM="MEDIUM",I.LARGE="LARGE",I.INBOX="INBOX"}(L||(L={})),function(I){I.LIGHT="LIGHT",I.DARK="DARK",I.WHITE="WHITE"}(A||(A={}));const M={[L.SMALL]:24,[L.MEDIUM]:40,[L.LARGE]:64,[L.INBOX]:30};export{A as AVATAR_BACKGROUND,M as AVATAR_SIZE_MAP,I as AVATAR_TYPES,L as SIZE};
+var A,L,I;!function(A){A.IMAGE="IMAGE",A.INITIALS="INITIALS",A.ICON="ICON"}(A||(A={})),function(A){A.EXTRA_SMALL="EXTRA_SMALL",A.SMALL="SMALL",A.MEDIUM="MEDIUM",A.LARGE="LARGE"}(L||(L={})),function(A){A.LIGHT="LIGHT",A.DARK="DARK",A.WHITE="WHITE",A.BRAND="BRAND"}(I||(I={}));const M={[L.EXTRA_SMALL]:16,[L.SMALL]:24,[L.MEDIUM]:40,[L.LARGE]:64};export{I as AVATAR_BACKGROUND,M as AVATAR_SIZE_MAP,A as AVATAR_TYPES,L as SIZE};
 //# sourceMappingURL=AvatarHelper.js.map

package/dist/esm/components/avatar/AvatarHelper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AvatarHelper.js","sources":["../../../../src/components/avatar/AvatarHelper.ts"],"sourcesContent":["export enum AVATAR_TYPES {\n\tIMAGE = 'IMAGE',\n\tINITIALS = 'INITIALS',\n\tICON = 'ICON',\n}\n\nexport enum SIZE {\n\~~tSMALL~~ = '~~SMALL~~',\n\~~tMEDIUM~~ = '~~MEDIUM~~',\n\~~tLARGE~~ = '~~LARGE~~',\n\~~tINBOX~~ = '~~INBOX~~',\n}\n\nexport enum AVATAR_BACKGROUND {\n\tLIGHT = 'LIGHT',\n\tDARK = 'DARK',\n\tWHITE = 'WHITE',\n}\n\nexport const AVATAR_SIZE_MAP = {\n\t[SIZE.~~SMALL~~]: 24,\n\t[SIZE.~~MEDIUM~~]: 40,\n\t[SIZE.~~LARGE~~]: 64,\n\t[SIZE.~~INBOX~~]: 30,\n};\n"],"names":["AVATAR_TYPES","SIZE","AVATAR_BACKGROUND","AVATAR_SIZE_MAP","SMALL","MEDIUM","LARGE"~~,"INBOX"~~],"mappings":"IAAYA,EAMAC,EAOAC,GAbZ,SAAYF,GACXA,EAAA,MAAA,QACAA,EAAA,SAAA,WACAA,EAAA,KAAA,MACA,CAJD,CAAYA,IAAAA,EAIX,CAAA,IAED,SAAYC,GACXA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,~~QACAA,EAAA,MAAA,~~OACA,CALD,CAAYA,IAAAA,EAKX,CAAA,IAED,SAAYC,GACXA,EAAA,MAAA,QACAA,EAAA,KAAA,OACAA,EAAA,MAAA,OACA,~~CAJD~~,CAAYA,IAAAA,~~EAIX~~,CAAA,IAEM,MAAMC,EAAkB,CAC9B,CAACF,EAAKG,~~OAAQ~~,~~GACd~~,CAACH,EAAKI,~~QAAS~~,~~GACf~~,CAACJ,EAAKK,~~OAAQ~~,~~GACd~~,CAACL,EAAKM,OAAQ"}
1	+ {"version":3,"file":"AvatarHelper.js","sources":["../../../../src/components/avatar/AvatarHelper.ts"],"sourcesContent":["export enum AVATAR_TYPES {\n\tIMAGE = 'IMAGE',\n\tINITIALS = 'INITIALS',\n\tICON = 'ICON',\n}\n\nexport enum SIZE {\n\tEXTRA_SMALL = 'EXTRA_SMALL',\n\tSMALL = 'SMALL',\n\tMEDIUM = 'MEDIUM',\n\tLARGE = 'LARGE',\n}\n\nexport enum AVATAR_BACKGROUND {\n\tLIGHT = 'LIGHT',\n\tDARK = 'DARK',\n\tWHITE = 'WHITE',\n\tBRAND = 'BRAND',\n}\n\nexport const AVATAR_SIZE_MAP = {\n\t[SIZE.EXTRA_SMALL]: 16,\n\t[SIZE.SMALL]: 24,\n\t[SIZE.MEDIUM]: 40,\n\t[SIZE.LARGE]: 64,\n};\n"],"names":["AVATAR_TYPES","SIZE","AVATAR_BACKGROUND","AVATAR_SIZE_MAP","EXTRA_SMALL","SMALL","MEDIUM","LARGE"],"mappings":"IAAYA,EAMAC,EAOAC,GAbZ,SAAYF,GACXA,EAAA,MAAA,QACAA,EAAA,SAAA,WACAA,EAAA,KAAA,MACA,CAJD,CAAYA,IAAAA,EAIX,CAAA,IAED,SAAYC,GACXA,EAAA,YAAA,cACAA,EAAA,MAAA,QACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACA,CALD,CAAYA,IAAAA,EAKX,CAAA,IAED,SAAYC,GACXA,EAAA,MAAA,QACAA,EAAA,KAAA,OACAA,EAAA,MAAA,QACAA,EAAA,MAAA,OACA,CALD,CAAYA,IAAAA,EAKX,CAAA,IAEM,MAAMC,EAAkB,CAC9B,CAACF,EAAKG,aAAc,GACpB,CAACH,EAAKI,OAAQ,GACd,CAACJ,EAAKK,QAAS,GACf,CAACL,EAAKM,OAAQ"}

package/dist/esm/components/bik-layout/BikSidebar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BikSidebar.js","sources":["../../../../src/components/bik-layout/BikSidebar.tsx"],"sourcesContent":["import BikIcon from '@src/assets/icons/Bik_logo.svg';\nimport LockedIcon from '@src/assets/icons/locked.svg';\nimport { Fragment, useCallback, useEffect, useMemo, useState } from 'react';\nimport React from 'react';\nimport CircularProgressBar from '@src/components/progress-bar/CircularProgressBar';\nimport { COLORS } from '@src/constants/Theme';\nimport { NavigationHyperlink } from '../navigation-hyperlink/NavigationHyperlink';\nimport { Menu } from './Sidebar.model';\nimport { SidebarPopup } from './SidebarPopup';\nimport {\n\tMainSideBarMenuWrapper,\n\tSibeBarMenuItem,\n\tSideBarContainer,\n} from './SidebarStyles';\nimport { SimpleSidebar } from './SimpleSidebar';\n\nexport interface MenuItem {\n\tkey: string \| number;\n\tdisplayName: string;\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Main Icon element that is to display\n\tactiveIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Icon element to pass when the menu is active\n\thoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; //Icon element to pass when the menu is hovered upon\n\tisLastSticky?: boolean; // to stick any menu at the end of the list\n\tis2ndLastSticky?: boolean; // to stick any menu at 2nd last end of list\n\tchildren?: Menu[];\n\tshowAccessUpgradePanel?: boolean;\n\tpath?: string;\n\tlayout?: 'fullScreen' \| 'popup' \| string \| undefined;\n\tisNew?: boolean;\n\tisLocked?: boolean;\n}\n\nexport interface BikSidebarProps {\n\tlogoSvg?: JSX.Element;\n\tallMenuList: MenuItem[];\n\tactiveMainMenu: MenuItem;\n\tactiveSubMenu: Menu;\n\trouter: any;\n\tonClickingMainMenu: (menu: MenuItem) => void;\n\tonClickingSubMenu: (subMenu: Menu) => void;\n\tonClickingAccessUpgradePanel?: () => void;\n\tonClickingPopupMenuItem?: (menu: Menu) => void;\n\tpopupMinHeight?: number;\n\tisNewSidebar?: boolean;\n\tonboardingPercentage?: number;\n\tmenuStyle?: React.CSSProperties;\n}\n\ninterface GetSideBarMenuItemProps {\n\toption: MenuItem;\n\tindex: number;\n\tonClickMainMenuLogic: (option: MenuItem) => void;\n\tsetHandleHoverForFullLayout: (option: MenuItem) => void;\n\tisDisabled: boolean;\n\tsetHoveredComp: (comp: any) => void;\n\tsetPopupMenu: (menu: any) => void;\n\tmainActiveMenu: MenuItem \| undefined;\n\thoveredComp: MenuItem \| undefined;\n\tpopupMenu: MenuItem \| undefined;\n}\n\nexport const BikSidebar: React.FC<BikSidebarProps> = (bikSidebarProps) => {\n\tconst {\n\t\tlogoSvg,\n\t\tallMenuList,\n\t\tactiveMainMenu,\n\t\tactiveSubMenu,\n\t\trouter,\n\t\tonClickingMainMenu,\n\t\tonClickingSubMenu,\n\t\tonClickingAccessUpgradePanel,\n\t\tonClickingPopupMenuItem,\n\t\tpopupMinHeight,\n\t\tisNewSidebar,\n\t\tmenuStyle,\n\t} = bikSidebarProps;\n\tconst [mainActiveMenu, setMainActiveMenu] =\n\t\tuseState<MenuItem>(activeMainMenu);\n\tconst [hoveredComp, setHoveredComp] = useState<MenuItem>();\n\tconst [subActiveMenu, setSubActiveMenu] = useState<Menu>(activeSubMenu);\n\tconst [isDisabled, setIsDisabled] = useState(false);\n\tconst [popupMenu, setPopupMenu] = useState<MenuItem>();\n\tconst [popupMenuTop, setPopupMenuTop] = useState<number>();\n\tconst [sidebarEachMenuTop, setSidebarEachMenuTop] = useState<number>();\n\tconst [autoCloseTimer, setAutoCloseTimer] = useState<NodeJS.Timeout \| null>(\n\t\tnull,\n\t);\n\tconst numberOfStickyOptions = useMemo(\n\t\t() =>\n\t\t\tallMenuList.filter((menu) => menu.is2ndLastSticky \|\| menu.isLastSticky)\n\t\t\t\t.length,\n\t\t[allMenuList],\n\t);\n\n\tuseEffect(() => {\n\t\tsetMainActiveMenu(activeMainMenu);\n\t}, [activeMainMenu]);\n\n\tuseEffect(() => {\n\t\tsetSubActiveMenu(activeSubMenu);\n\t}, [activeSubMenu]);\n\n\tconst onClickMainMenuLogic = useCallback(\n\t\t(option: MenuItem) => {\n\t\t\tif (option?.layout === 'popup') {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetPopupMenu(undefined);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetIsDisabled(true);\n\t\t\tsetMainActiveMenu(option);\n\t\t\tif (!option.path) {\n\t\t\t\tonClickingMainMenu(option);\n\t\t\t}\n\t\t\toption?.children?.length\n\t\t\t\t? setSubActiveMenu(option?.children[0])\n\t\t\t\t: setSubActiveMenu({} as Menu);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsDisabled(false);\n\t\t\t}, 1000);\n\t\t},\n\t\t[onClickingMainMenu],\n\t);\n\n\tconst setHandleHoverForFullLayout = useCallback((option: MenuItem) => {\n\t\tclearRemnantTimers();\n\t\tsetHoveredComp(undefined);\n\t\tsetPopupMenu(undefined);\n\t\tif (option?.layout == 'popup') {\n\t\t\tconst top = determineElementTop();\n\t\t\ttop && setPopupMenuTop(top);\n\t\t\tsetPopupMenu(option);\n\t\t} else {\n\t\t\tconst targetElement = document.getElementById(\n\t\t\t\toption.displayName?.split(' ')?.join('') \|\| option.key.toString(),\n\t\t\t);\n\t\t\tif (targetElement) {\n\t\t\t\tconst topValue = calculateTopSideBarPosition(targetElement);\n\t\t\t\tsetSidebarEachMenuTop(topValue);\n\t\t\t}\n\t\t\tsetHoveredComp(option);\n\t\t\tinitiateAutoClose();\n\t\t}\n\t}, []);\n\tconst calculateTopSideBarPosition = (targetElement: HTMLElement) => {\n\t\tconst targetRect = targetElement.getBoundingClientRect();\n\t\tlet topValue = targetRect.top;\n\t\tconst innerStickyElements = targetElement.querySelectorAll('div');\n\t\tlet innerStickyElement = null as HTMLElement \| null;\n\t\tconst innerHeight = window.innerHeight;\n\t\tif (innerHeight <= 768) {\n\t\t\treturn topValue;\n\t\t}\n\t\tinnerStickyElements.forEach((element) => {\n\t\t\tif (element.className.includes('sticky')) {\n\t\t\t\tinnerStickyElement = element;\n\t\t\t}\n\t\t});\n\t\tif (innerStickyElement) {\n\t\t\tconst windowHeight = window.innerHeight;\n\t\t\tconst distanceToBottom = windowHeight - targetRect.bottom;\n\t\t\ttopValue = targetRect.top + distanceToBottom - 200; // sample height for lower elements\n\t\t}\n\t\treturn topValue;\n\t};\n\n\tuseEffect(() => {\n\t\tconst handleResize = () => {\n\t\t\tconst newTop = determineElementTop();\n\t\t\tnewTop && setPopupMenuTop(newTop);\n\t\t\tdetermineSideMenuTopWhileResize();\n\t\t};\n\t\twindow.addEventListener('resize', handleResize);\n\t\treturn () => {\n\t\t\twindow.removeEventListener('resize', handleResize);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\tconst determineSideMenuTopWhileResize = () => {\n\t\tconst openSideMenuElement = document.getElementById('_sub-menu');\n\t\tconst openSideMenuElementHeight =\n\t\t\topenSideMenuElement?.getBoundingClientRect().height;\n\t\tif (openSideMenuElementHeight) {\n\t\t\tsetSidebarEachMenuTop(window.innerHeight - openSideMenuElementHeight);\n\t\t}\n\t};\n\tconst determineElementTop = () => {\n\t\tif (popupMenu) {\n\t\t\tconst currentId =\n\t\t\t\tpopupMenu.displayName?.split(' ')?.join('') + '_sub' \|\|\n\t\t\t\tpopupMenu.key.toString() + '_sub';\n\n\t\t\tconst targetElement = document.getElementById(currentId);\n\t\t\tif (targetElement) {\n\t\t\t\tconst sideMenuRect = targetElement.getBoundingClientRect();\n\t\t\t\tlet divBoxTop = sideMenuRect.top;\n\t\t\t\tconst popupHeight = popupMinHeight ?? 320;\n\t\t\t\tif (sideMenuRect.bottom + popupHeight > window.innerHeight) {\n\t\t\t\t\tdivBoxTop -= sideMenuRect.bottom + popupHeight - window.innerHeight;\n\t\t\t\t}\n\t\t\t\treturn divBoxTop;\n\t\t\t}\n\t\t\treturn null;\n\t\t}\n\t};\n\n\tconst initiateAutoClose = () => {\n\t\tclearRemnantTimers();\n\t\tconst timer = setTimeout(() => setHoveredComp(undefined), 10000); // 10-second delay\n\t\tsetAutoCloseTimer(timer);\n\t};\n\n\tconst clearRemnantTimers = () => {\n\t\tclearTimeout(autoCloseTimer!);\n\t};\n\n\treturn (\n\t\t<SideBarContainer>\n\t\t\t<div\n\t\t\t\tclassName=\"bik-header-logo\"\n\t\t\t\tonClick={() => undefined}\n\t\t\t\tonKeyDown={() => undefined}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{logoSvg ? logoSvg : <BikIcon />}\n\t\t\t</div>\n\t\t\t<MainSideBarMenuWrapper style={menuStyle}>\n\t\t\t\t{allMenuList?.map((option, index) => (\n\t\t\t\t\t<Fragment key={index}>\n\t\t\t\t\t\t{option.path ? (\n\t\t\t\t\t\t\t<NavigationHyperlink href={option.path} router={router}>\n\t\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</NavigationHyperlink>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{option.layout === 'popup' && popupMenu?.children?.length && (\n\t\t\t\t\t\t\t\t<SidebarPopup\n\t\t\t\t\t\t\t\t\ttop={popupMenuTop ?? undefined}\n\t\t\t\t\t\t\t\t\tmenuList={popupMenu?.children}\n\t\t\t\t\t\t\t\t\tonClickingPopupMenu={(popupMenuSelected) => {\n\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem &&\n\t\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem(popupMenuSelected);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => setPopupMenu(undefined)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{hoveredComp?.children?.length && (\n\t\t\t\t\t\t\t\t<SimpleSidebar\n\t\t\t\t\t\t\t\t\tmenuList={hoveredComp?.children}\n\t\t\t\t\t\t\t\t\tactiveMenu={subActiveMenu}\n\t\t\t\t\t\t\t\t\tonMouseEnterOnMenu={() => clearRemnantTimers()}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => {\n\t\t\t\t\t\t\t\t\t\tclearRemnantTimers();\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tleft={isNewSidebar ? 92 : 88}\n\t\t\t\t\t\t\t\t\tpostion={'fixed'}\n\t\t\t\t\t\t\t\t\theader={hoveredComp.displayName}\n\t\t\t\t\t\t\t\t\ttheme={'brand'}\n\t\t\t\t\t\t\t\t\trouter={router}\n\t\t\t\t\t\t\t\t\tshowAccessUpgradePanel={hoveredComp.showAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\tonMenuClick={(menuSelected, reDirect) => {\n\t\t\t\t\t\t\t\t\t\tsetSubActiveMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t\tsetMainActiveMenu(hoveredComp);\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t\treDirect && onClickingSubMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonUpgrade={onClickingAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\ttop={\n\t\t\t\t\t\t\t\t\t\tisNewSidebar\n\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisNewSidebar={isNewSidebar}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t</Fragment>\n\t\t\t\t))}\n\t\t\t\t{typeof bikSidebarProps.onboardingPercentage === 'number' && (\n\t\t\t\t\t<SibeBarMenuItem>\n\t\t\t\t\t\t<div className=\"main--sidebar\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tid={'bik-onboarding__checklist'}\n\t\t\t\t\t\t\t\tclassName={`sidebar-menu-item ${\n\t\t\t\t\t\t\t\t\tnumberOfStickyOptions === 0\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu'\n\t\t\t\t\t\t\t\t\t\t: numberOfStickyOptions === 1\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu-int'\n\t\t\t\t\t\t\t\t\t\t: 'sticky-menu-three'\n\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CircularProgressBar\n\t\t\t\t\t\t\t\t\tpercentage={bikSidebarProps.onboardingPercentage}\n\t\t\t\t\t\t\t\t\twidth={48}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</SibeBarMenuItem>\n\t\t\t\t)}\n\t\t\t</MainSideBarMenuWrapper>\n\t\t</SideBarContainer>\n\t);\n};\n\nconst IconComponent: React.FC<{\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisActive: boolean;\n\tactiveStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\thoverStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisHovered: boolean;\n}> = (iconComponentProps) => {\n\tconst { icon, isActive, activeStateIcon, hoverStateIcon, isHovered } =\n\t\ticonComponentProps;\n\tconst Icon = icon;\n\tconst ActiveIcon = activeStateIcon;\n\tconst HoverIcon = hoverStateIcon;\n\treturn (\n\t\t<>\n\t\t\t{isActive ? (\n\t\t\t\t<ActiveIcon width={20} height={20} />\n\t\t\t) : isHovered ? (\n\t\t\t\t<HoverIcon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t) : (\n\t\t\t\t<Icon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nconst EachSidebarMenuItem: React.FC<GetSideBarMenuItemProps> = ({\n\toption,\n\tindex,\n\tonClickMainMenuLogic,\n\tsetHandleHoverForFullLayout,\n\tisDisabled,\n\tsetHoveredComp,\n\tsetPopupMenu,\n\tmainActiveMenu,\n\thoveredComp,\n\tpopupMenu,\n}) => {\n\treturn (\n\t\t<SibeBarMenuItem>\n\t\t\t<div\n\t\t\t\tid={option.displayName?.split(' ')?.join('') \|\| option.key.toString()}\n\t\t\t\tclassName=\"main--sidebar\"\n\t\t\t\tkey={index}\n\t\t\t\tonClick={() => onClickMainMenuLogic(option)}\n\t\t\t\tonMouseEnter={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseOver={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={() => {\n\t\t\t\t\tif (!option?.children?.length) {\n\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonFocus={() => {}}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{option.isNew && (\n\t\t\t\t\t<div className={`new-tag ${option.isLastSticky ? 'tag-sticky' : ''}`}>\n\t\t\t\t\t\tNEW\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t{option.isLocked && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={`locked--channel ${\n\t\t\t\t\t\t\toption.isLastSticky ? 'tag-sticky' : ''\n\t\t\t\t\t\t} ${option.is2ndLastSticky ? 'tag-sticky-2' : ''}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<LockedIcon height={16} width={16} />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tkey={index}\n\t\t\t\t\tid={\n\t\t\t\t\t\toption.displayName?.split(' ')?.join('') + '_sub' \|\|\n\t\t\t\t\t\toption.key.toString() + '_sub'\n\t\t\t\t\t}\n\t\t\t\t\tclassName={`sidebar-menu-item \n\t\t\t\t\t${mainActiveMenu?.key === option.key ? 'main-menu-active-class' : ''} \n\t\t\t\t\t${option.isLastSticky ? 'sticky-menu-int' : ''} \n\t\t\t\t\t${option.is2ndLastSticky ? 'sticky-menu' : ''} \n\t\t\t\t\t${option.key === hoveredComp?.key ? 'sidebar-menu-item-hover' : ''} \n\t\t\t\t\t${option.isNew ? 'new-menu-item' : ''}`}\n\t\t\t\t>\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\ticon={option.icon}\n\t\t\t\t\t\tisActive={option.key == mainActiveMenu?.key}\n\t\t\t\t\t\tactiveStateIcon={\n\t\t\t\t\t\t\toption.activeIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\thoverStateIcon={\n\t\t\t\t\t\t\toption.hoverIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisHovered={\n\t\t\t\t\t\t\toption.key == hoveredComp?.key \|\| option.key == popupMenu?.key\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"menu-item-container\">\n\t\t\t\t\t\t<p\n\t\t\t\t\t\t\tclassName={`menu-item-text ${\n\t\t\t\t\t\t\t\toption?.key === mainActiveMenu?.key\n\t\t\t\t\t\t\t\t\t? 'active-menu-item-text'\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{option.displayName}\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</SibeBarMenuItem>\n\t);\n};\n"],"names":["BikSidebar","bikSidebarProps","logoSvg","allMenuList","activeMainMenu","activeSubMenu","router","onClickingMainMenu","onClickingSubMenu","onClickingAccessUpgradePanel","onClickingPopupMenuItem","popupMinHeight","isNewSidebar","menuStyle","mainActiveMenu","setMainActiveMenu","useState","hoveredComp","setHoveredComp","subActiveMenu","setSubActiveMenu","isDisabled","setIsDisabled","popupMenu","setPopupMenu","popupMenuTop","setPopupMenuTop","sidebarEachMenuTop","setSidebarEachMenuTop","autoCloseTimer","setAutoCloseTimer","numberOfStickyOptions","useMemo","filter","menu","is2ndLastSticky","isLastSticky","length","useEffect","onClickMainMenuLogic","useCallback","option","layout","undefined","path","_a","children","setTimeout","setHandleHoverForFullLayout","clearRemnantTimers","top","determineElementTop","targetElement","document","getElementById","_b","displayName","split","join","key","toString","topValue","calculateTopSideBarPosition","initiateAutoClose","targetRect","getBoundingClientRect","innerStickyElements","querySelectorAll","innerStickyElement","window","innerHeight","forEach","element","className","includes","distanceToBottom","bottom","handleResize","newTop","determineSideMenuTopWhileResize","addEventListener","removeEventListener","openSideMenuElement","openSideMenuElementHeight","height","currentId","sideMenuRect","divBoxTop","popupHeight","timer","clearTimeout","_jsxs","SideBarContainer","_jsx","Object","assign","onClick","onKeyDown","BikIcon","MainSideBarMenuWrapper","style","map","index","Fragment","NavigationHyperlink","href","EachSidebarMenuItem","_Fragment","SidebarPopup","menuList","onClickingPopupMenu","popupMenuSelected","onMouseLeaveOnMenu","SimpleSidebar","activeMenu","onMouseEnterOnMenu","left","postion","header","theme","showAccessUpgradePanel","onMenuClick","menuSelected","reDirect","onUpgrade","onboardingPercentage","SibeBarMenuItem","id","CircularProgressBar","percentage","width","IconComponent","iconComponentProps","icon","isActive","activeStateIcon","hoverStateIcon","isHovered","Icon","HoverIcon","color","COLORS","surface","standard","_ref","onMouseEnter","onMouseOver","onMouseLeave","onFocus","isNew","isLocked","LockedIcon","_d","_c","_e","activeIcon","hoverIcon","_f"],"mappings":"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"}
1	+ {"version":3,"file":"BikSidebar.js","sources":["../../../../src/components/bik-layout/BikSidebar.tsx"],"sourcesContent":["import BikIcon from '@src/assets/icons/Bik_logo.svg';\nimport LockedIcon from '@src/assets/icons/locked.svg';\nimport { Fragment, useCallback, useEffect, useMemo, useState } from 'react';\nimport React from 'react';\nimport CircularProgressBar from '@src/components/progress-bar/CircularProgressBar';\nimport { COLORS } from '@src/constants/Theme';\nimport { NavigationHyperlink } from '../navigation-hyperlink/NavigationHyperlink';\nimport { Menu } from './Sidebar.model';\nimport { SidebarPopup } from './SidebarPopup';\nimport {\n\tMainSideBarMenuWrapper,\n\tSibeBarMenuItem,\n\tSideBarContainer,\n} from './SidebarStyles';\nimport { SimpleSidebar } from './SimpleSidebar';\n\nexport interface MenuItem {\n\tkey: string \| number;\n\tdisplayName: string;\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Main Icon element that is to display\n\tactiveIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Icon element to pass when the menu is active\n\thoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; //Icon element to pass when the menu is hovered upon\n\tisLastSticky?: boolean; // to stick any menu at the end of the list\n\tis2ndLastSticky?: boolean; // to stick any menu at 2nd last end of list\n\tchildren?: Menu[];\n\tshowAccessUpgradePanel?: boolean;\n\tpath?: string;\n\tlayout?: 'fullScreen' \| 'popup' \| string \| undefined;\n\tisNew?: boolean;\n\tisLocked?: boolean;\n}\n\nexport interface BikSidebarProps {\n\tlogoSvg?: JSX.Element;\n\tallMenuList: MenuItem[];\n\tactiveMainMenu: MenuItem;\n\tactiveSubMenu: Menu;\n\trouter: any;\n\tonClickingMainMenu: (menu: MenuItem) => void;\n\tonClickingSubMenu: (subMenu: Menu) => void;\n\tonClickingAccessUpgradePanel?: () => void;\n\tonClickingPopupMenuItem?: (menu: Menu) => void;\n\tpopupMinHeight?: number;\n\tisNewSidebar?: boolean;\n\tonboardingPercentage?: number;\n\tmenuStyle?: React.CSSProperties;\n}\n\ninterface GetSideBarMenuItemProps {\n\toption: MenuItem;\n\tindex: number;\n\tonClickMainMenuLogic: (option: MenuItem) => void;\n\tsetHandleHoverForFullLayout: (option: MenuItem) => void;\n\tisDisabled: boolean;\n\tsetHoveredComp: (comp: any) => void;\n\tsetPopupMenu: (menu: any) => void;\n\tmainActiveMenu: MenuItem \| undefined;\n\thoveredComp: MenuItem \| undefined;\n\tpopupMenu: MenuItem \| undefined;\n}\n\nexport const BikSidebar: React.FC<BikSidebarProps> = (bikSidebarProps) => {\n\tconst {\n\t\tlogoSvg,\n\t\tallMenuList,\n\t\tactiveMainMenu,\n\t\tactiveSubMenu,\n\t\trouter,\n\t\tonClickingMainMenu,\n\t\tonClickingSubMenu,\n\t\tonClickingAccessUpgradePanel,\n\t\tonClickingPopupMenuItem,\n\t\tpopupMinHeight,\n\t\tisNewSidebar,\n\t\tmenuStyle,\n\t} = bikSidebarProps;\n\tconst [mainActiveMenu, setMainActiveMenu] =\n\t\tuseState<MenuItem>(activeMainMenu);\n\tconst [hoveredComp, setHoveredComp] = useState<MenuItem>();\n\tconst [subActiveMenu, setSubActiveMenu] = useState<Menu>(activeSubMenu);\n\tconst [isDisabled, setIsDisabled] = useState(false);\n\tconst [popupMenu, setPopupMenu] = useState<MenuItem>();\n\tconst [popupMenuTop, setPopupMenuTop] = useState<number>();\n\tconst [sidebarEachMenuTop, setSidebarEachMenuTop] = useState<number>();\n\tconst [autoCloseTimer, setAutoCloseTimer] = useState<NodeJS.Timeout \| null>(\n\t\tnull,\n\t);\n\tconst numberOfStickyOptions = useMemo(\n\t\t() =>\n\t\t\tallMenuList.filter((menu) => menu.is2ndLastSticky \|\| menu.isLastSticky)\n\t\t\t\t.length,\n\t\t[allMenuList],\n\t);\n\n\tuseEffect(() => {\n\t\tsetMainActiveMenu(activeMainMenu);\n\t}, [activeMainMenu]);\n\n\tuseEffect(() => {\n\t\tsetSubActiveMenu(activeSubMenu);\n\t}, [activeSubMenu]);\n\n\tconst onClickMainMenuLogic = useCallback(\n\t\t(option: MenuItem) => {\n\t\t\tif (option?.layout === 'popup') {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetPopupMenu(undefined);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetIsDisabled(true);\n\t\t\tsetMainActiveMenu(option);\n\t\t\tif (!option.path) {\n\t\t\t\tonClickingMainMenu(option);\n\t\t\t}\n\t\t\toption?.children?.length\n\t\t\t\t? setSubActiveMenu(option?.children[0])\n\t\t\t\t: setSubActiveMenu({} as Menu);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsDisabled(false);\n\t\t\t}, 1000);\n\t\t},\n\t\t[onClickingMainMenu],\n\t);\n\n\tconst setHandleHoverForFullLayout = useCallback((option: MenuItem) => {\n\t\tclearRemnantTimers();\n\t\tsetHoveredComp(undefined);\n\t\tsetPopupMenu(undefined);\n\t\tif (option?.layout == 'popup') {\n\t\t\tconst top = determineElementTop();\n\t\t\ttop && setPopupMenuTop(top);\n\t\t\tsetPopupMenu(option);\n\t\t} else {\n\t\t\tconst targetElement = document.getElementById(\n\t\t\t\toption.displayName?.split(' ')?.join('') \|\| option.key.toString(),\n\t\t\t);\n\t\t\tif (targetElement) {\n\t\t\t\tconst topValue = calculateTopSideBarPosition(targetElement);\n\t\t\t\tsetSidebarEachMenuTop(topValue);\n\t\t\t}\n\t\t\tsetHoveredComp(option);\n\t\t\tinitiateAutoClose();\n\t\t}\n\t}, []);\n\tconst calculateTopSideBarPosition = (targetElement: HTMLElement) => {\n\t\tconst targetRect = targetElement.getBoundingClientRect();\n\t\tlet topValue = targetRect.top;\n\t\tconst innerStickyElements = targetElement.querySelectorAll('div');\n\t\tlet innerStickyElement = null as HTMLElement \| null;\n\t\tconst innerHeight = window.innerHeight;\n\t\tif (innerHeight <= 768) {\n\t\t\treturn topValue;\n\t\t}\n\t\tinnerStickyElements.forEach((element) => {\n\t\t\tif (element.className.includes('sticky')) {\n\t\t\t\tinnerStickyElement = element;\n\t\t\t}\n\t\t});\n\t\tif (innerStickyElement) {\n\t\t\tconst windowHeight = window.innerHeight;\n\t\t\tconst distanceToBottom = windowHeight - targetRect.bottom;\n\t\t\ttopValue = targetRect.top + distanceToBottom - 200; // sample height for lower elements\n\t\t}\n\t\treturn topValue;\n\t};\n\n\tuseEffect(() => {\n\t\tconst handleResize = () => {\n\t\t\tconst newTop = determineElementTop();\n\t\t\tnewTop && setPopupMenuTop(newTop);\n\t\t\tdetermineSideMenuTopWhileResize();\n\t\t};\n\t\twindow.addEventListener('resize', handleResize);\n\t\treturn () => {\n\t\t\twindow.removeEventListener('resize', handleResize);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\tconst determineSideMenuTopWhileResize = () => {\n\t\tconst openSideMenuElement = document.getElementById('_sub-menu');\n\t\tconst openSideMenuElementHeight =\n\t\t\topenSideMenuElement?.getBoundingClientRect().height;\n\t\tif (openSideMenuElementHeight) {\n\t\t\tsetSidebarEachMenuTop(window.innerHeight - openSideMenuElementHeight);\n\t\t}\n\t};\n\tconst determineElementTop = () => {\n\t\tif (popupMenu) {\n\t\t\tconst currentId =\n\t\t\t\tpopupMenu.displayName?.split(' ')?.join('') + '_sub' \|\|\n\t\t\t\tpopupMenu.key.toString() + '_sub';\n\n\t\t\tconst targetElement = document.getElementById(currentId);\n\t\t\tif (targetElement) {\n\t\t\t\tconst sideMenuRect = targetElement.getBoundingClientRect();\n\t\t\t\tlet divBoxTop = sideMenuRect.top;\n\t\t\t\tconst popupHeight = popupMinHeight ?? 320;\n\t\t\t\tif (sideMenuRect.bottom + popupHeight > window.innerHeight) {\n\t\t\t\t\tdivBoxTop -= sideMenuRect.bottom + popupHeight - window.innerHeight;\n\t\t\t\t}\n\t\t\t\treturn divBoxTop;\n\t\t\t}\n\t\t\treturn null;\n\t\t}\n\t};\n\n\tconst initiateAutoClose = () => {\n\t\tclearRemnantTimers();\n\t\tconst timer = setTimeout(() => setHoveredComp(undefined), 10000); // 10-second delay\n\t\tsetAutoCloseTimer(timer);\n\t};\n\n\tconst clearRemnantTimers = () => {\n\t\tclearTimeout(autoCloseTimer!);\n\t};\n\n\treturn (\n\t\t<SideBarContainer>\n\t\t\t<div\n\t\t\t\tclassName=\"bik-header-logo\"\n\t\t\t\tonClick={() => undefined}\n\t\t\t\tonKeyDown={() => undefined}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{logoSvg ? logoSvg : <BikIcon />}\n\t\t\t</div>\n\t\t\t<MainSideBarMenuWrapper style={menuStyle}>\n\t\t\t\t{allMenuList?.map((option, index) => (\n\t\t\t\t\t<Fragment key={index}>\n\t\t\t\t\t\t{option.path ? (\n\t\t\t\t\t\t\t<NavigationHyperlink href={option.path} router={router}>\n\t\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</NavigationHyperlink>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{option.layout === 'popup' && popupMenu?.children?.length && (\n\t\t\t\t\t\t\t\t<SidebarPopup\n\t\t\t\t\t\t\t\t\ttop={popupMenuTop ?? undefined}\n\t\t\t\t\t\t\t\t\tmenuList={popupMenu?.children}\n\t\t\t\t\t\t\t\t\tonClickingPopupMenu={(popupMenuSelected) => {\n\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem &&\n\t\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem(popupMenuSelected);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => setPopupMenu(undefined)}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{hoveredComp?.children?.length && (\n\t\t\t\t\t\t\t\t<SimpleSidebar\n\t\t\t\t\t\t\t\t\tmenuList={hoveredComp?.children}\n\t\t\t\t\t\t\t\t\tactiveMenu={subActiveMenu}\n\t\t\t\t\t\t\t\t\tonMouseEnterOnMenu={() => clearRemnantTimers()}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => {\n\t\t\t\t\t\t\t\t\t\tclearRemnantTimers();\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tleft={isNewSidebar ? 92 : 88}\n\t\t\t\t\t\t\t\t\tpostion={'fixed'}\n\t\t\t\t\t\t\t\t\theader={hoveredComp.displayName}\n\t\t\t\t\t\t\t\t\ttheme={'brand'}\n\t\t\t\t\t\t\t\t\trouter={router}\n\t\t\t\t\t\t\t\t\tshowAccessUpgradePanel={hoveredComp.showAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\tonMenuClick={(menuSelected, reDirect) => {\n\t\t\t\t\t\t\t\t\t\tsetSubActiveMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t\tsetMainActiveMenu(hoveredComp);\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t\treDirect && onClickingSubMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonUpgrade={onClickingAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\ttop={\n\t\t\t\t\t\t\t\t\t\tisNewSidebar\n\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisNewSidebar={isNewSidebar}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t</Fragment>\n\t\t\t\t))}\n\t\t\t\t{typeof bikSidebarProps.onboardingPercentage === 'number' && (\n\t\t\t\t\t<SibeBarMenuItem>\n\t\t\t\t\t\t<div className=\"main--sidebar\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tid={'bik-onboarding__checklist'}\n\t\t\t\t\t\t\t\tclassName={`sidebar-menu-item ${\n\t\t\t\t\t\t\t\t\tnumberOfStickyOptions === 0\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu'\n\t\t\t\t\t\t\t\t\t\t: numberOfStickyOptions === 1\n\t\t\t\t\t\t\t\t\t\t? 'sticky-menu-int'\n\t\t\t\t\t\t\t\t\t\t: 'sticky-menu-three'\n\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CircularProgressBar\n\t\t\t\t\t\t\t\t\tpercentage={bikSidebarProps.onboardingPercentage}\n\t\t\t\t\t\t\t\t\twidth={48}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</SibeBarMenuItem>\n\t\t\t\t)}\n\t\t\t</MainSideBarMenuWrapper>\n\t\t</SideBarContainer>\n\t);\n};\n\nconst IconComponent: React.FC<{\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisActive: boolean;\n\tactiveStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\thoverStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisHovered: boolean;\n}> = (iconComponentProps) => {\n\tconst { icon, isActive, activeStateIcon, hoverStateIcon, isHovered } =\n\t\ticonComponentProps;\n\tconst Icon = icon;\n\tconst ActiveIcon = activeStateIcon;\n\tconst HoverIcon = hoverStateIcon;\n\treturn (\n\t\t<>\n\t\t\t{isActive ? (\n\t\t\t\t<ActiveIcon width={20} height={20} />\n\t\t\t) : isHovered ? (\n\t\t\t\t<HoverIcon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t) : (\n\t\t\t\t<Icon width={20} height={20} color={COLORS.surface.standard} />\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nconst EachSidebarMenuItem: React.FC<GetSideBarMenuItemProps> = ({\n\toption,\n\tindex,\n\tonClickMainMenuLogic,\n\tsetHandleHoverForFullLayout,\n\tisDisabled,\n\tsetHoveredComp,\n\tsetPopupMenu,\n\tmainActiveMenu,\n\thoveredComp,\n\tpopupMenu,\n}) => {\n\treturn (\n\t\t<SibeBarMenuItem>\n\t\t\t<div\n\t\t\t\tid={option.displayName?.split(' ')?.join('') \|\| option.key.toString()}\n\t\t\t\tclassName=\"main--sidebar\"\n\t\t\t\tkey={index}\n\t\t\t\tonClick={() => onClickMainMenuLogic(option)}\n\t\t\t\tonMouseEnter={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseOver={() => {\n\t\t\t\t\t!isDisabled && setHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={() => {\n\t\t\t\t\tif (!option?.children?.length) {\n\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonFocus={() => {\n\t\t\t\t\t// do nothing\n\t\t\t\t}}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{option.isNew && (\n\t\t\t\t\t<div className={`new-tag ${option.isLastSticky ? 'tag-sticky' : ''}`}>\n\t\t\t\t\t\tNEW\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t{option.isLocked && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={`locked--channel ${\n\t\t\t\t\t\t\toption.isLastSticky ? 'tag-sticky' : ''\n\t\t\t\t\t\t} ${option.is2ndLastSticky ? 'tag-sticky-2' : ''}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<LockedIcon height={16} width={16} />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tkey={index}\n\t\t\t\t\tid={\n\t\t\t\t\t\toption.displayName?.split(' ')?.join('') + '_sub' \|\|\n\t\t\t\t\t\toption.key.toString() + '_sub'\n\t\t\t\t\t}\n\t\t\t\t\tclassName={`sidebar-menu-item \n\t\t\t\t\t${mainActiveMenu?.key === option.key ? 'main-menu-active-class' : ''} \n\t\t\t\t\t${option.isLastSticky ? 'sticky-menu-int' : ''} \n\t\t\t\t\t${option.is2ndLastSticky ? 'sticky-menu' : ''} \n\t\t\t\t\t${option.key === hoveredComp?.key ? 'sidebar-menu-item-hover' : ''} \n\t\t\t\t\t${option.isNew ? 'new-menu-item' : ''}`}\n\t\t\t\t>\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\ticon={option.icon}\n\t\t\t\t\t\tisActive={option.key == mainActiveMenu?.key}\n\t\t\t\t\t\tactiveStateIcon={\n\t\t\t\t\t\t\toption.activeIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\thoverStateIcon={\n\t\t\t\t\t\t\toption.hoverIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisHovered={\n\t\t\t\t\t\t\toption.key == hoveredComp?.key \|\| option.key == popupMenu?.key\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<div className=\"menu-item-container\">\n\t\t\t\t\t\t<p\n\t\t\t\t\t\t\tclassName={`menu-item-text ${\n\t\t\t\t\t\t\t\toption?.key === mainActiveMenu?.key\n\t\t\t\t\t\t\t\t\t? 'active-menu-item-text'\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{option.displayName}\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</SibeBarMenuItem>\n\t);\n};\n"],"names":["BikSidebar","bikSidebarProps","logoSvg","allMenuList","activeMainMenu","activeSubMenu","router","onClickingMainMenu","onClickingSubMenu","onClickingAccessUpgradePanel","onClickingPopupMenuItem","popupMinHeight","isNewSidebar","menuStyle","mainActiveMenu","setMainActiveMenu","useState","hoveredComp","setHoveredComp","subActiveMenu","setSubActiveMenu","isDisabled","setIsDisabled","popupMenu","setPopupMenu","popupMenuTop","setPopupMenuTop","sidebarEachMenuTop","setSidebarEachMenuTop","autoCloseTimer","setAutoCloseTimer","numberOfStickyOptions","useMemo","filter","menu","is2ndLastSticky","isLastSticky","length","useEffect","onClickMainMenuLogic","useCallback","option","layout","undefined","path","_a","children","setTimeout","setHandleHoverForFullLayout","clearRemnantTimers","top","determineElementTop","targetElement","document","getElementById","_b","displayName","split","join","key","toString","topValue","calculateTopSideBarPosition","initiateAutoClose","targetRect","getBoundingClientRect","innerStickyElements","querySelectorAll","innerStickyElement","window","innerHeight","forEach","element","className","includes","distanceToBottom","bottom","handleResize","newTop","determineSideMenuTopWhileResize","addEventListener","removeEventListener","openSideMenuElement","openSideMenuElementHeight","height","currentId","sideMenuRect","divBoxTop","popupHeight","timer","clearTimeout","_jsxs","SideBarContainer","_jsx","Object","assign","onClick","onKeyDown","BikIcon","MainSideBarMenuWrapper","style","map","index","Fragment","NavigationHyperlink","href","EachSidebarMenuItem","_Fragment","SidebarPopup","menuList","onClickingPopupMenu","popupMenuSelected","onMouseLeaveOnMenu","SimpleSidebar","activeMenu","onMouseEnterOnMenu","left","postion","header","theme","showAccessUpgradePanel","onMenuClick","menuSelected","reDirect","onUpgrade","onboardingPercentage","SibeBarMenuItem","id","CircularProgressBar","percentage","width","IconComponent","iconComponentProps","icon","isActive","activeStateIcon","hoverStateIcon","isHovered","Icon","HoverIcon","color","COLORS","surface","standard","_ref","onMouseEnter","onMouseOver","onMouseLeave","onFocus","isNew","isLocked","LockedIcon","_d","_c","_e","activeIcon","hoverIcon","_f"],"mappings":"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"}

package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts ADDED Viewed

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Menu } from './SidebarV2.model';
+export interface MenuItemV2 {
+    key: string | number;
+    displayName: string;
+    icon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    activeIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    hoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    isLastSticky?: boolean;
+    is2ndLastSticky?: boolean;
+    children?: Menu[];
+    showAccessUpgradePanel?: boolean;
+    path?: string;
+    layout?: 'fullScreen' | 'popup' | string | undefined;
+    isNew?: boolean;
+    isLocked?: boolean;
+}
+export interface BikSidebarV2Props {
+    logoSvg?: JSX.Element;
+    allMenuList: MenuItemV2[];
+    activeMainMenu: MenuItemV2;
+    activeSubMenu: Menu;
+    router: any;
+    onClickingMainMenu: (menu: MenuItemV2) => void;
+    onClickingSubMenu: (subMenu: Menu) => void;
+    onClickingAccessUpgradePanel?: () => void;
+    onClickingPopupMenuItem?: (menu: Menu) => void;
+    popupMinHeight?: number;
+    isNewSidebar?: boolean;
+    onboardingPercentage?: number;
+    menuStyle?: React.CSSProperties;
+}
+export declare const BikSidebarV2: React.FC<BikSidebarV2Props>;

package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{jsxs as e,jsx as i,Fragment as n}from"react/jsx-runtime";import o from"../../../assets/icons/Bik_logo.svg.js";import t from"../../../assets/icons/locked.svg.js";import{useState as l,useRef as s,useMemo as r,useEffect as d,useCallback as u,Fragment as c}from"react";import a from"../../progress-bar/CircularProgressBar.js";import{COLORS as v}from"../../../constants/Theme.js";import{NavigationHyperlink as p}from"../../navigation-hyperlink/NavigationHyperlink.js";import{SidebarV2Popup as g}from"./SidebarV2Popup.js";import{SideBarV2Container as h,MainSideBarV2MenuWrapper as m,SibeBarV2MenuItem as y,SidebarMainMenu as k,SidebarMenuItemInner as M,SidebarNewTag as b,SidebarLockedChannel as L,SidebarMenuItemContainer as S,SidebarMenuItemText as w}from"./SidebarV2Styles.js";import{SimpleSidebarV2 as j}from"./SimpleSidebarV2.js";const f=t=>{const{logoSvg:v,allMenuList:b,activeMainMenu:L,activeSubMenu:S,router:w,onClickingMainMenu:f,onClickingSubMenu:C,onClickingAccessUpgradePanel:I,onClickingPopupMenuItem:N,popupMinHeight:O,isNewSidebar:P,menuStyle:A}=t,[E,B]=l(L),[F,_]=l(),[x,D]=l(S),[T,U]=l(!1),[R,V]=l(),[z,K]=l(),[W,q]=l(),G=s(null),J=r((()=>b.filter((e=>e.is2ndLastSticky\|\|e.isLastSticky)).length),[b]);d((()=>{B(L)}),[L]),d((()=>{D(S)}),[S]);const Q=u((e=>{var i;"popup"!==(null==e?void 0:e.layout)&&(V(void 0),_(void 0),U(!0),B(e),e.path\|\|f(e),(null===(i=null==e?void 0:e.children)\|\|void 0===i?void 0:i.length)?D(null==e?void 0:e.children[0]):D({}),_(void 0),setTimeout((()=>{U(!1)}),1e3))}),[f]),X=u((e=>{var i,n;if($(),_(void 0),V(void 0),"popup"==(null==e?void 0:e.layout)){const i=ie();i&&K(i),V(e)}else{const o=document.getElementById((null===(n=null===(i=e.displayName)\|\|void 0===i?void 0:i.split(" "))\|\|void 0===n?void 0:n.join(""))\|\|e.key.toString());if(o){const i=Y(o,e);q(i)}_(e)}}),[]),Y=(e,i)=>{const n=e.getBoundingClientRect();let o=n.top;if(window.innerHeight<=768)return o;if(i.isLastSticky\|\|i.is2ndLastSticky){const e=window.innerHeight-n.bottom;o=n.top+e-200}return o};d((()=>{const e=()=>{const e=ie();e&&K(e),Z()};return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),[]);const Z=()=>{const e=document.getElementById("_sub-menu"),i=null==e?void 0:e.getBoundingClientRect().height;i&&q(window.innerHeight-i)},$=u((()=>{G.current&&(clearTimeout(G.current),G.current=null)}),[]),ee=u((()=>{$(),G.current=setTimeout((()=>{_(void 0),V(void 0)}),150)}),[$]),ie=()=>{var e,i;if(R){const n=(null===(i=null===(e=R.displayName)\|\|void 0===e?void 0:e.split(" "))\|\|void 0===i?void 0:i.join(""))+"_sub"\|\|R.key.toString()+"_sub",o=document.getElementById(n);if(o){const e=o.getBoundingClientRect();let i=e.top;const n=null!=O?O:320;return e.bottom+n>window.innerHeight&&(i-=e.bottom+n-window.innerHeight),i}return null}};return e(h,{children:[i("div",Object.assign({className:"bik-header-logo",onClick:()=>{},onKeyDown:()=>{},"aria-hidden":"true"},{children:v\|\|i(o,{})})),e(m,Object.assign({style:A},{children:[null==b?void 0:b.map(((o,t)=>{var l,s;return e(c,{children:[o.path?i(p,Object.assign({href:o.path,router:w},{children:i(H,{option:o,index:t,onClickMainMenuLogic:Q,setHandleHoverForFullLayout:X,isDisabled:T,setHoveredComp:_,setPopupMenu:V,mainActiveMenu:E,hoveredComp:F,popupMenu:R,onMouseLeaveMenuItem:ee})})):i(H,{option:o,index:t,onClickMainMenuLogic:Q,setHandleHoverForFullLayout:X,isDisabled:T,setHoveredComp:_,setPopupMenu:V,mainActiveMenu:E,hoveredComp:F,popupMenu:R,onMouseLeaveMenuItem:ee}),e(n,{children:["popup"===o.layout&&(null===(l=null==R?void 0:R.children)\|\|void 0===l?void 0:l.length)&&i(g,{top:null!=z?z:void 0,menuList:null==R?void 0:R.children,onClickingPopupMenu:e=>{N&&N(e),V(void 0)},onMouseEnterOnMenu:$,onMouseLeaveOnMenu:ee}),(null===(s=null==F?void 0:F.children)\|\|void 0===s?void 0:s.length)&&i(j,{menuList:null==F?void 0:F.children,width:200,activeMenu:x,onMouseEnterOnMenu:$,onMouseLeaveOnMenu:()=>_(void 0),left:78,postion:"fixed",header:F.displayName,theme:"brand",router:w,showAccessUpgradePanel:F.showAccessUpgradePanel,onMenuClick:(e,i)=>{D(e),B(F),_(void 0),V(void 0),i&&C(e)},onUpgrade:I,top:P&&W\|\|0,isNewSidebar:P})]})]},t)})),"number"==typeof t.onboardingPercentage&&i(y,{children:i(k,{children:i(M,Object.assign({id:"bik-onboarding__checklist",stickyBottom:0===J?0:1===J?64:128},{children:i(a,{percentage:t.onboardingPercentage,width:48})}))})})]}))]})},C=e=>{const{icon:o,isActive:t,activeStateIcon:l}=e,s=o;return i(n,{children:t?i(l,{width:16,height:16,color:v.content.primaryInverse}):i(s,{width:16,height:16,color:v.content.secondaryInverse})})},H=n=>{let{option:o,index:l,onClickMainMenuLogic:s,setHandleHoverForFullLayout:r,isDisabled:d,mainActiveMenu:u,hoveredComp:c,popupMenu:a,onMouseLeaveMenuItem:v}=n;var p,g,h,m,j,f;return i(y,{children:e(k,Object.assign({id:(null===(g=null===(p=o.displayName)\|\|void 0===p?void 0:p.split(" "))\|\|void 0===g?void 0:g.join(""))\|\|o.key.toString(),onClick:()=>!d&&s(o),onMouseEnter:()=>{r(o)},onMouseLeave:v,onFocus:()=>{},"aria-hidden":"true"},{children:[o.isNew&&i(b,Object.assign({isLastSticky:o.isLastSticky},{children:"NEW"})),o.isLocked&&i(L,Object.assign({isLastSticky:o.isLastSticky,is2ndLastSticky:o.is2ndLastSticky},{children:i(t,{height:16,width:16})})),e(M,Object.assign({id:(null===(m=null===(h=o.displayName)\|\|void 0===h?void 0:h.split(" "))\|\|void 0===m?void 0:m.join(""))+"_sub"\|\|o.key.toString()+"_sub",isActive:(null==u?void 0:u.key)===o.key,"data-active":(null==u?void 0:u.key)===o.key?"true":void 0,isLastSticky:o.isLastSticky,is2ndLastSticky:o.is2ndLastSticky,isHovered:o.key===(null==c?void 0:c.key),isNew:o.isNew,onMouseEnter:()=>r(o),onMouseLeave:v},{children:[i(C,{icon:o.icon,isActive:o.key==(null==u?void 0:u.key),activeStateIcon:null!==(j=o.activeIcon)&&void 0!==j?j:{},hoverStateIcon:null!==(f=o.hoverIcon)&&void 0!==f?f:{},isHovered:o.key==(null==c?void 0:c.key)\|\|o.key==(null==a?void 0:a.key)}),i(S,{children:i(w,Object.assign({isActive:(null==o?void 0:o.key)===(null==u?void 0:u.key)},{children:o.displayName}))})]}),l)]}),l)})};export{f as BikSidebarV2};
2	+ //# sourceMappingURL=BikSidebarV2.js.map

package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"BikSidebarV2.js","sources":["../../../../../src/components/bik-layout/BikSidebarV2/BikSidebarV2.tsx"],"sourcesContent":["import BikIcon from '@src/assets/icons/Bik_logo.svg';\nimport LockedIcon from '@src/assets/icons/locked.svg';\nimport {\n\tFragment,\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport React from 'react';\nimport CircularProgressBar from '@src/components/progress-bar/CircularProgressBar';\nimport { COLORS } from '@src/constants/Theme';\nimport { NavigationHyperlink } from '../../navigation-hyperlink/NavigationHyperlink';\nimport { Menu } from './SidebarV2.model';\nimport { SidebarV2Popup } from './SidebarV2Popup';\nimport {\n\tMainSideBarV2MenuWrapper,\n\tSibeBarV2MenuItem,\n\tSidebarLockedChannel,\n\tSidebarMainMenu,\n\tSidebarMenuItemContainer,\n\tSidebarMenuItemInner,\n\tSidebarMenuItemText,\n\tSidebarNewTag,\n\tSideBarV2Container,\n} from './SidebarV2Styles';\nimport { SimpleSidebarV2 } from './SimpleSidebarV2';\n\nexport interface MenuItemV2 {\n\tkey: string | number;\n\tdisplayName: string;\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Main Icon element that is to display\n\tactiveIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; // Icon element to pass when the menu is active\n\thoverIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>; //Icon element to pass when the menu is hovered upon\n\tisLastSticky?: boolean; // to stick any menu at the end of the list\n\tis2ndLastSticky?: boolean; // to stick any menu at 2nd last end of list\n\tchildren?: Menu[];\n\tshowAccessUpgradePanel?: boolean;\n\tpath?: string;\n\tlayout?: 'fullScreen' | 'popup' | string | undefined;\n\tisNew?: boolean;\n\tisLocked?: boolean;\n}\n\nexport interface BikSidebarV2Props {\n\tlogoSvg?: JSX.Element;\n\tallMenuList: MenuItemV2[];\n\tactiveMainMenu: MenuItemV2;\n\tactiveSubMenu: Menu;\n\trouter: any;\n\tonClickingMainMenu: (menu: MenuItemV2) => void;\n\tonClickingSubMenu: (subMenu: Menu) => void;\n\tonClickingAccessUpgradePanel?: () => void;\n\tonClickingPopupMenuItem?: (menu: Menu) => void;\n\tpopupMinHeight?: number;\n\tisNewSidebar?: boolean;\n\tonboardingPercentage?: number;\n\tmenuStyle?: React.CSSProperties;\n}\n\ninterface GetSideBarV2MenuItemProps {\n\toption: MenuItemV2;\n\tindex: number;\n\tonClickMainMenuLogic: (option: MenuItemV2) => void;\n\tsetHandleHoverForFullLayout: (option: MenuItemV2) => void;\n\tisDisabled: boolean;\n\tsetHoveredComp: (comp: any) => void;\n\tsetPopupMenu: (menu: any) => void;\n\tmainActiveMenu: MenuItemV2 | undefined;\n\thoveredComp: MenuItemV2 | undefined;\n\tpopupMenu: MenuItemV2 | undefined;\n\tonMouseLeaveMenuItem: () => void;\n}\n\nexport const BikSidebarV2: React.FC<BikSidebarV2Props> = (\n\tbikSidebarV2Props,\n) => {\n\tconst {\n\t\tlogoSvg,\n\t\tallMenuList,\n\t\tactiveMainMenu,\n\t\tactiveSubMenu,\n\t\trouter,\n\t\tonClickingMainMenu,\n\t\tonClickingSubMenu,\n\t\tonClickingAccessUpgradePanel,\n\t\tonClickingPopupMenuItem,\n\t\tpopupMinHeight,\n\t\tisNewSidebar,\n\t\tmenuStyle,\n\t} = bikSidebarV2Props;\n\tconst [mainActiveMenu, setMainActiveMenu] =\n\t\tuseState<MenuItemV2>(activeMainMenu);\n\tconst [hoveredComp, setHoveredComp] = useState<MenuItemV2>();\n\tconst [subActiveMenu, setSubActiveMenu] = useState<Menu>(activeSubMenu);\n\tconst [isDisabled, setIsDisabled] = useState(false);\n\tconst [popupMenu, setPopupMenu] = useState<MenuItemV2>();\n\tconst [popupMenuTop, setPopupMenuTop] = useState<number>();\n\tconst [sidebarEachMenuTop, setSidebarEachMenuTop] = useState<number>();\n\tconst hoverLeaveTimerRef = useRef<NodeJS.Timeout | null>(null);\n\tconst numberOfStickyOptions = useMemo(\n\t\t() =>\n\t\t\tallMenuList.filter((menu) => menu.is2ndLastSticky || menu.isLastSticky)\n\t\t\t\t.length,\n\t\t[allMenuList],\n\t);\n\n\tuseEffect(() => {\n\t\tsetMainActiveMenu(activeMainMenu);\n\t}, [activeMainMenu]);\n\n\tuseEffect(() => {\n\t\tsetSubActiveMenu(activeSubMenu);\n\t}, [activeSubMenu]);\n\n\tconst onClickMainMenuLogic = useCallback(\n\t\t(option: MenuItemV2) => {\n\t\t\tif (option?.layout === 'popup') {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetPopupMenu(undefined);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetIsDisabled(true);\n\t\t\tsetMainActiveMenu(option);\n\t\t\tif (!option.path) {\n\t\t\t\tonClickingMainMenu(option);\n\t\t\t}\n\t\t\toption?.children?.length\n\t\t\t\t? setSubActiveMenu(option?.children[0])\n\t\t\t\t: setSubActiveMenu({} as Menu);\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetIsDisabled(false);\n\t\t\t}, 1000);\n\t\t},\n\t\t[onClickingMainMenu],\n\t);\n\n\tconst setHandleHoverForFullLayout = useCallback((option: MenuItemV2) => {\n\t\tcancelHoverLeaveTimer();\n\t\tsetHoveredComp(undefined);\n\t\tsetPopupMenu(undefined);\n\t\tif (option?.layout == 'popup') {\n\t\t\tconst top = determineElementTop();\n\t\t\ttop && setPopupMenuTop(top);\n\t\t\tsetPopupMenu(option);\n\t\t} else {\n\t\t\tconst targetElement = document.getElementById(\n\t\t\t\toption.displayName?.split(' ')?.join('') || option.key.toString(),\n\t\t\t);\n\t\t\tif (targetElement) {\n\t\t\t\tconst topValue = calculateTopSideBarPosition(targetElement, option);\n\t\t\t\tsetSidebarEachMenuTop(topValue);\n\t\t\t}\n\t\t\tsetHoveredComp(option);\n\t\t}\n\t}, []);\n\tconst calculateTopSideBarPosition = (\n\t\ttargetElement: HTMLElement,\n\t\toption: MenuItemV2,\n\t) => {\n\t\tconst targetRect = targetElement.getBoundingClientRect();\n\t\tlet topValue = targetRect.top;\n\t\tconst innerHeight = window.innerHeight;\n\t\tif (innerHeight <= 768) {\n\t\t\treturn topValue;\n\t\t}\n\t\tif (option.isLastSticky || option.is2ndLastSticky) {\n\t\t\tconst windowHeight = window.innerHeight;\n\t\t\tconst distanceToBottom = windowHeight - targetRect.bottom;\n\t\t\ttopValue = targetRect.top + distanceToBottom - 200; // sample height for lower elements\n\t\t}\n\t\treturn topValue;\n\t};\n\n\tuseEffect(() => {\n\t\tconst handleResize = () => {\n\t\t\tconst newTop = determineElementTop();\n\t\t\tnewTop && setPopupMenuTop(newTop);\n\t\t\tdetermineSideMenuTopWhileResize();\n\t\t};\n\t\twindow.addEventListener('resize', handleResize);\n\t\treturn () => {\n\t\t\twindow.removeEventListener('resize', handleResize);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\tconst determineSideMenuTopWhileResize = () => {\n\t\tconst openSideMenuElement = document.getElementById('_sub-menu');\n\t\tconst openSideMenuElementHeight =\n\t\t\topenSideMenuElement?.getBoundingClientRect().height;\n\t\tif (openSideMenuElementHeight) {\n\t\t\tsetSidebarEachMenuTop(window.innerHeight - openSideMenuElementHeight);\n\t\t}\n\t};\n\tconst cancelHoverLeaveTimer = useCallback(() => {\n\t\tif (hoverLeaveTimerRef.current) {\n\t\t\tclearTimeout(hoverLeaveTimerRef.current);\n\t\t\thoverLeaveTimerRef.current = null;\n\t\t}\n\t}, []);\n\n\tconst startHoverLeaveTimer = useCallback(() => {\n\t\tcancelHoverLeaveTimer();\n\t\thoverLeaveTimerRef.current = setTimeout(() => {\n\t\t\tsetHoveredComp(undefined);\n\t\t\tsetPopupMenu(undefined);\n\t\t}, 150);\n\t}, [cancelHoverLeaveTimer]);\n\n\tconst determineElementTop = () => {\n\t\tif (popupMenu) {\n\t\t\tconst currentId =\n\t\t\t\tpopupMenu.displayName?.split(' ')?.join('') + '_sub' ||\n\t\t\t\tpopupMenu.key.toString() + '_sub';\n\n\t\t\tconst targetElement = document.getElementById(currentId);\n\t\t\tif (targetElement) {\n\t\t\t\tconst sideMenuRect = targetElement.getBoundingClientRect();\n\t\t\t\tlet divBoxTop = sideMenuRect.top;\n\t\t\t\tconst popupHeight = popupMinHeight ?? 320;\n\t\t\t\tif (sideMenuRect.bottom + popupHeight > window.innerHeight) {\n\t\t\t\t\tdivBoxTop -= sideMenuRect.bottom + popupHeight - window.innerHeight;\n\t\t\t\t}\n\t\t\t\treturn divBoxTop;\n\t\t\t}\n\t\t\treturn null;\n\t\t}\n\t};\n\n\treturn (\n\t\t<SideBarV2Container>\n\t\t\t<div\n\t\t\t\tclassName=\"bik-header-logo\"\n\t\t\t\tonClick={() => undefined}\n\t\t\t\tonKeyDown={() => undefined}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{logoSvg ? logoSvg : <BikIcon />}\n\t\t\t</div>\n\t\t\t<MainSideBarV2MenuWrapper style={menuStyle}>\n\t\t\t\t{allMenuList?.map((option, index) => (\n\t\t\t\t\t<Fragment key={index}>\n\t\t\t\t\t\t{option.path ? (\n\t\t\t\t\t\t\t<NavigationHyperlink href={option.path} router={router}>\n\t\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t\t\tonMouseLeaveMenuItem={startHoverLeaveTimer}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</NavigationHyperlink>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EachSidebarMenuItem\n\t\t\t\t\t\t\t\toption={option}\n\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\tonClickMainMenuLogic={onClickMainMenuLogic}\n\t\t\t\t\t\t\t\tsetHandleHoverForFullLayout={setHandleHoverForFullLayout}\n\t\t\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\t\t\tsetHoveredComp={setHoveredComp}\n\t\t\t\t\t\t\t\tsetPopupMenu={setPopupMenu}\n\t\t\t\t\t\t\t\tmainActiveMenu={mainActiveMenu}\n\t\t\t\t\t\t\t\thoveredComp={hoveredComp}\n\t\t\t\t\t\t\t\tpopupMenu={popupMenu}\n\t\t\t\t\t\t\t\tonMouseLeaveMenuItem={startHoverLeaveTimer}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{option.layout === 'popup' && popupMenu?.children?.length && (\n\t\t\t\t\t\t\t\t<SidebarV2Popup\n\t\t\t\t\t\t\t\t\ttop={popupMenuTop ?? undefined}\n\t\t\t\t\t\t\t\t\tmenuList={popupMenu?.children}\n\t\t\t\t\t\t\t\t\tonClickingPopupMenu={(popupMenuSelected) => {\n\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem &&\n\t\t\t\t\t\t\t\t\t\t\tonClickingPopupMenuItem(popupMenuSelected);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonMouseEnterOnMenu={cancelHoverLeaveTimer}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={startHoverLeaveTimer}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{hoveredComp?.children?.length && (\n\t\t\t\t\t\t\t\t<SimpleSidebarV2\n\t\t\t\t\t\t\t\t\tmenuList={hoveredComp?.children}\n\t\t\t\t\t\t\t\t\twidth={200}\n\t\t\t\t\t\t\t\t\tactiveMenu={subActiveMenu}\n\t\t\t\t\t\t\t\t\tonMouseEnterOnMenu={cancelHoverLeaveTimer}\n\t\t\t\t\t\t\t\t\tonMouseLeaveOnMenu={() => setHoveredComp(undefined)}\n\t\t\t\t\t\t\t\t\tleft={isNewSidebar ? 78 : 78}\n\t\t\t\t\t\t\t\t\tpostion={'fixed'}\n\t\t\t\t\t\t\t\t\theader={hoveredComp.displayName}\n\t\t\t\t\t\t\t\t\ttheme={'brand'}\n\t\t\t\t\t\t\t\t\trouter={router}\n\t\t\t\t\t\t\t\t\tshowAccessUpgradePanel={hoveredComp.showAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\tonMenuClick={(menuSelected, reDirect) => {\n\t\t\t\t\t\t\t\t\t\tsetSubActiveMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t\tsetMainActiveMenu(hoveredComp);\n\t\t\t\t\t\t\t\t\t\tsetHoveredComp(undefined);\n\t\t\t\t\t\t\t\t\t\tsetPopupMenu(undefined);\n\t\t\t\t\t\t\t\t\t\treDirect && onClickingSubMenu(menuSelected);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonUpgrade={onClickingAccessUpgradePanel}\n\t\t\t\t\t\t\t\t\ttop={\n\t\t\t\t\t\t\t\t\t\tisNewSidebar\n\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t? sidebarEachMenuTop\n\t\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tisNewSidebar={isNewSidebar}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t</Fragment>\n\t\t\t\t))}\n\t\t\t\t{typeof bikSidebarV2Props.onboardingPercentage === 'number' && (\n\t\t\t\t\t<SibeBarV2MenuItem>\n\t\t\t\t\t\t<SidebarMainMenu>\n\t\t\t\t\t\t\t<SidebarMenuItemInner\n\t\t\t\t\t\t\t\tid={'bik-onboarding__checklist'}\n\t\t\t\t\t\t\t\tstickyBottom={\n\t\t\t\t\t\t\t\t\tnumberOfStickyOptions === 0\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: numberOfStickyOptions === 1\n\t\t\t\t\t\t\t\t\t\t? 64\n\t\t\t\t\t\t\t\t\t\t: 128\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CircularProgressBar\n\t\t\t\t\t\t\t\t\tpercentage={bikSidebarV2Props.onboardingPercentage}\n\t\t\t\t\t\t\t\t\twidth={48}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</SidebarMenuItemInner>\n\t\t\t\t\t\t</SidebarMainMenu>\n\t\t\t\t\t</SibeBarV2MenuItem>\n\t\t\t\t)}\n\t\t\t</MainSideBarV2MenuWrapper>\n\t\t</SideBarV2Container>\n\t);\n};\n\nconst IconComponent: React.FC<{\n\ticon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisActive: boolean;\n\tactiveStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\thoverStateIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tisHovered: boolean;\n}> = (iconComponentProps) => {\n\tconst { icon, isActive, activeStateIcon } = iconComponentProps;\n\tconst Icon = icon;\n\tconst ActiveIcon = activeStateIcon;\n\treturn (\n\t\t<>\n\t\t\t{isActive ? (\n\t\t\t\t<ActiveIcon\n\t\t\t\t\twidth={16}\n\t\t\t\t\theight={16}\n\t\t\t\t\tcolor={COLORS.content.primaryInverse}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<Icon width={16} height={16} color={COLORS.content.secondaryInverse} />\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nconst EachSidebarMenuItem: React.FC<GetSideBarV2MenuItemProps> = ({\n\toption,\n\tindex,\n\tonClickMainMenuLogic,\n\tsetHandleHoverForFullLayout,\n\tisDisabled,\n\tmainActiveMenu,\n\thoveredComp,\n\tpopupMenu,\n\tonMouseLeaveMenuItem,\n}) => {\n\treturn (\n\t\t<SibeBarV2MenuItem>\n\t\t\t<SidebarMainMenu\n\t\t\t\tid={option.displayName?.split(' ')?.join('') || option.key.toString()}\n\t\t\t\tkey={index}\n\t\t\t\tonClick={() => !isDisabled && onClickMainMenuLogic(option)}\n\t\t\t\tonMouseEnter={() => {\n\t\t\t\t\tsetHandleHoverForFullLayout(option);\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={onMouseLeaveMenuItem}\n\t\t\t\tonFocus={() => {\n\t\t\t\t\t// do nothing\n\t\t\t\t}}\n\t\t\t\taria-hidden=\"true\"\n\t\t\t>\n\t\t\t\t{option.isNew && (\n\t\t\t\t\t<SidebarNewTag isLastSticky={option.isLastSticky}>NEW</SidebarNewTag>\n\t\t\t\t)}\n\t\t\t\t{option.isLocked && (\n\t\t\t\t\t<SidebarLockedChannel\n\t\t\t\t\t\tisLastSticky={option.isLastSticky}\n\t\t\t\t\t\tis2ndLastSticky={option.is2ndLastSticky}\n\t\t\t\t\t>\n\t\t\t\t\t\t<LockedIcon height={16} width={16} />\n\t\t\t\t\t</SidebarLockedChannel>\n\t\t\t\t)}\n\t\t\t\t<SidebarMenuItemInner\n\t\t\t\t\tkey={index}\n\t\t\t\t\tid={\n\t\t\t\t\t\toption.displayName?.split(' ')?.join('') + '_sub' ||\n\t\t\t\t\t\toption.key.toString() + '_sub'\n\t\t\t\t\t}\n\t\t\t\t\tisActive={mainActiveMenu?.key === option.key}\n\t\t\t\t\tdata-active={mainActiveMenu?.key === option.key ? 'true' : undefined}\n\t\t\t\t\tisLastSticky={option.isLastSticky}\n\t\t\t\t\tis2ndLastSticky={option.is2ndLastSticky}\n\t\t\t\t\tisHovered={option.key === hoveredComp?.key}\n\t\t\t\t\tisNew={option.isNew}\n\t\t\t\t\tonMouseEnter={() => setHandleHoverForFullLayout(option)}\n\t\t\t\t\tonMouseLeave={onMouseLeaveMenuItem}\n\t\t\t\t>\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\ticon={option.icon}\n\t\t\t\t\t\tisActive={option.key == mainActiveMenu?.key}\n\t\t\t\t\t\tactiveStateIcon={\n\t\t\t\t\t\t\toption.activeIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\thoverStateIcon={\n\t\t\t\t\t\t\toption.hoverIcon ??\n\t\t\t\t\t\t\t({} as React.FunctionComponent<React.SVGAttributes<SVGElement>>)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisHovered={\n\t\t\t\t\t\t\toption.key == hoveredComp?.key || option.key == popupMenu?.key\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t<SidebarMenuItemContainer>\n\t\t\t\t\t\t<SidebarMenuItemText isActive={option?.key === mainActiveMenu?.key}>\n\t\t\t\t\t\t\t{option.displayName}\n\t\t\t\t\t\t</SidebarMenuItemText>\n\t\t\t\t\t</SidebarMenuItemContainer>\n\t\t\t\t</SidebarMenuItemInner>\n\t\t\t</SidebarMainMenu>\n\t\t</SibeBarV2MenuItem>\n\t);\n};\n"],"names":["BikSidebarV2","bikSidebarV2Props","logoSvg","allMenuList","activeMainMenu","activeSubMenu","router","onClickingMainMenu","onClickingSubMenu","onClickingAccessUpgradePanel","onClickingPopupMenuItem","popupMinHeight","isNewSidebar","menuStyle","mainActiveMenu","setMainActiveMenu","useState","hoveredComp","setHoveredComp","subActiveMenu","setSubActiveMenu","isDisabled","setIsDisabled","popupMenu","setPopupMenu","popupMenuTop","setPopupMenuTop","sidebarEachMenuTop","setSidebarEachMenuTop","hoverLeaveTimerRef","useRef","numberOfStickyOptions","useMemo","filter","menu","is2ndLastSticky","isLastSticky","length","useEffect","onClickMainMenuLogic","useCallback","option","layout","undefined","path","_a","children","setTimeout","setHandleHoverForFullLayout","cancelHoverLeaveTimer","top","determineElementTop","targetElement","document","getElementById","_b","displayName","split","join","key","toString","topValue","calculateTopSideBarPosition","targetRect","getBoundingClientRect","window","innerHeight","distanceToBottom","bottom","handleResize","newTop","determineSideMenuTopWhileResize","addEventListener","removeEventListener","openSideMenuElement","openSideMenuElementHeight","height","current","clearTimeout","startHoverLeaveTimer","currentId","sideMenuRect","divBoxTop","popupHeight","_jsxs","SideBarV2Container","_jsx","Object","assign","className","onClick","onKeyDown","BikIcon","MainSideBarV2MenuWrapper","style","map","index","Fragment","NavigationHyperlink","href","EachSidebarMenuItem","onMouseLeaveMenuItem","_Fragment","SidebarV2Popup","menuList","onClickingPopupMenu","popupMenuSelected","onMouseEnterOnMenu","onMouseLeaveOnMenu","SimpleSidebarV2","width","activeMenu","left","postion","header","theme","showAccessUpgradePanel","onMenuClick","menuSelected","reDirect","onUpgrade","onboardingPercentage","SibeBarV2MenuItem","SidebarMainMenu","SidebarMenuItemInner","id","stickyBottom","CircularProgressBar","percentage","IconComponent","iconComponentProps","icon","isActive","activeStateIcon","Icon","color","COLORS","content","primaryInverse","secondaryInverse","_ref","onMouseEnter","onMouseLeave","onFocus","isNew","SidebarNewTag","isLocked","SidebarLockedChannel","LockedIcon","_c","isHovered","_e","activeIcon","hoverStateIcon","_f","hoverIcon","SidebarMenuItemContainer","SidebarMenuItemText"],"mappings":"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"}

package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts ADDED Viewed

@@ -0,0 +1,27 @@
+export interface Menu {
+    key: string | number;
+    displayName: string;
+    description?: string;
+    path?: string;
+    page?: string;
+    isNew?: string;
+}
+export type SidebarV2Theme = 'brand' | 'white';
+export interface SimpleSidebarV2Props {
+    menuList: Menu[];
+    activeMenu: Menu;
+    theme: SidebarV2Theme;
+    showAccessUpgradePanel?: boolean;
+    header?: string;
+    width?: number;
+    zIndex?: number;
+    left?: number;
+    postion?: 'fixed' | 'sticky';
+    top?: number;
+    router: any;
+    onMouseLeaveOnMenu?: () => void;
+    onMouseEnterOnMenu?: () => void;
+    onMenuClick: (menuSelected: Menu, reDirect?: boolean) => void;
+    onUpgrade?: () => void;
+    isNewSidebar?: boolean;
+}

package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts ADDED Viewed

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { Menu } from './SidebarV2.model';
+export interface SidebarV2PopupI {
+    menuList: Menu[];
+    width?: number;
+    zIndex?: number;
+    left?: number;
+    top?: number;
+    onMouseLeaveOnMenu?: () => void;
+    onMouseEnterOnMenu?: () => void;
+    onClickingPopupMenu: (menuSelected: Menu, reDirect?: boolean) => void;
+}
+export declare const SidebarV2Popup: React.FC<SidebarV2PopupI>;

package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{jsx as e,jsxs as n}from"react/jsx-runtime";import{TitleRegular as s,BodySecondary as t}from"../../TypographyStyle.js";import{SidebarV2PopupContainer as o}from"./SidebarV2Styles.js";const i=i=>{const{top:r,menuList:l,zIndex:a,left:c,onMouseLeaveOnMenu:m,onMouseEnterOnMenu:u,onClickingPopupMenu:d}=i;return e(o,Object.assign({top:r,theme:"white",zIndex:a,left:null!=c?c:78,postion:"fixed"},{children:e("div",Object.assign({id:"_sub-menu",className:"sidebar-right-menu transform-class",onMouseEnter:u,onMouseLeave:m},{children:null==l?void 0:l.map(((o,i)=>n("div",Object.assign({className:"each-menu",style:{borderBottom:i==l.length-1?"none":void 0},onClick:()=>d(o)},{children:[e(s,Object.assign({style:{fontSize:14}},{children:o.displayName})),e(t,Object.assign({style:{fontSize:12}},{children:o.description}))]}),i)))}),"_sub-menu")}))};export{i as SidebarV2Popup};
2	+ //# sourceMappingURL=SidebarV2Popup.js.map

package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"SidebarV2Popup.js","sources":["../../../../../src/components/bik-layout/BikSidebarV2/SidebarV2Popup.tsx"],"sourcesContent":["import { BodySecondary, TitleRegular } from '../../TypographyStyle';\nimport { Menu } from './SidebarV2.model';\nimport { SidebarV2PopupContainer } from './SidebarV2Styles';\n\nexport interface SidebarV2PopupI {\n\tmenuList: Menu[];\n\twidth?: number;\n\tzIndex?: number;\n\tleft?: number;\n\ttop?: number;\n\tonMouseLeaveOnMenu?: () => void;\n\tonMouseEnterOnMenu?: () => void;\n\tonClickingPopupMenu: (menuSelected: Menu, reDirect?: boolean) => void;\n}\n\nexport const SidebarV2Popup: React.FC<SidebarV2PopupI> = (sideBarProps) => {\n\tconst {\n\t\ttop,\n\t\tmenuList,\n\t\tzIndex,\n\t\tleft,\n\t\tonMouseLeaveOnMenu,\n\t\tonMouseEnterOnMenu,\n\t\tonClickingPopupMenu,\n\t} = sideBarProps;\n\treturn (\n\t\t<SidebarV2PopupContainer\n\t\t\ttop={top}\n\t\t\ttheme={'white'}\n\t\t\tzIndex={zIndex}\n\t\t\tleft={left ?? 78}\n\t\t\tpostion={'fixed'}\n\t\t>\n\t\t\t<div\n\t\t\t\tid={'_sub-menu'}\n\t\t\t\tkey={'_sub-menu'}\n\t\t\t\tclassName={'sidebar-right-menu' + ' transform-class'}\n\t\t\t\tonMouseEnter={onMouseEnterOnMenu}\n\t\t\t\tonMouseLeave={onMouseLeaveOnMenu}\n\t\t\t>\n\t\t\t\t{menuList?.map((child, popupIndex) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"each-menu\"\n\t\t\t\t\t\tkey={popupIndex}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborderBottom:\n\t\t\t\t\t\t\t\tpopupIndex == menuList.length - 1 ? 'none' : undefined,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={() => onClickingPopupMenu(child)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TitleRegular style={{ fontSize: 14 }}>\n\t\t\t\t\t\t\t{child.displayName}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t\t<BodySecondary style={{ fontSize: 12 }}>\n\t\t\t\t\t\t\t{child.description}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</SidebarV2PopupContainer>\n\t);\n};\n"],"names":["SidebarV2Popup","sideBarProps","top","menuList","zIndex","left","onMouseLeaveOnMenu","onMouseEnterOnMenu","onClickingPopupMenu","_jsx","SidebarV2PopupContainer","Object","assign","theme","postion","children","id","className","onMouseEnter","onMouseLeave","map","child","popupIndex","_jsxs","style","borderBottom","length","undefined","onClick","TitleRegular","fontSize","displayName","BodySecondary","description"],"mappings":"4LAeaA,MAAAA,EAA6CC,IACzD,MAAMC,IACLA,EAAGC,SACHA,EAAQC,OACRA,EAAMC,KACNA,EAAIC,mBACJA,EAAkBC,mBAClBA,EAAkBC,oBAClBA,GACGP,EACJ,OACCQ,EAACC,EAAuBC,OAAAC,OAAA,CACvBV,IAAKA,EACLW,MAAO,QACPT,OAAQA,EACRC,KAAMA,QAAAA,EAAQ,GACdS,QAAS,SAAO,CAAAC,SAEhBN,EACC,MAAAE,OAAAC,OAAA,CAAAI,GAAI,YAEJC,UAAW,qCACXC,aAAcX,EACdY,aAAcb,GAAkB,CAAAS,SAE/BZ,aAAA,EAAAA,EAAUiB,KAAI,CAACC,EAAOC,IACtBC,uBACCN,UAAU,YAEVO,MAAO,CACNC,aACCH,GAAcnB,EAASuB,OAAS,EAAI,YAASC,GAE/CC,QAASA,IAAMpB,EAAoBa,IAEnC,CAAAN,SAAA,CAAAN,EAACoB,EAAalB,OAAAC,OAAA,CAAAY,MAAO,CAAEM,SAAU,KAAI,CAAAf,SACnCM,EAAMU,eAERtB,EAACuB,EAAcrB,OAAAC,OAAA,CAAAY,MAAO,CAAEM,SAAU,KAAI,CAAAf,SACpCM,EAAMY,kBAXHX,OARF,eAwBmB"}

package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts ADDED Viewed

@@ -0,0 +1,44 @@
+import { SidebarV2Theme } from './SidebarV2.model';
+export declare const SideBarV2Container: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const MainSideBarV2MenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SibeBarV2MenuItem: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SidebarMainMenu: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SidebarNewTag: import("styled-components").StyledComponent<"div", any, {
+    isLastSticky?: boolean | undefined;
+}, never>;
+export declare const SidebarLockedChannel: import("styled-components").StyledComponent<"div", any, {
+    isLastSticky?: boolean | undefined;
+    is2ndLastSticky?: boolean | undefined;
+}, never>;
+export declare const SidebarMenuItemInner: import("styled-components").StyledComponent<"div", any, {
+    isActive?: boolean | undefined;
+    isHovered?: boolean | undefined;
+    isNew?: boolean | undefined;
+    isLastSticky?: boolean | undefined;
+    is2ndLastSticky?: boolean | undefined;
+    stickyBottom?: number | undefined;
+}, never>;
+export declare const SidebarMenuItemContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SidebarMenuItemText: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+} & {
+    isActive?: boolean | undefined;
+}, never>;
+export declare const SimpleSidebarV2Container: import("styled-components").StyledComponent<"div", any, {
+    postion?: "fixed" | "sticky" | undefined;
+    top?: number | undefined;
+    theme: SidebarV2Theme;
+    width?: number | undefined;
+    zIndex?: number | undefined;
+    left?: number | undefined;
+    isNewSidebar?: boolean | undefined;
+}, never>;
+export declare const SidebarV2PopupContainer: import("styled-components").StyledComponent<"div", any, {
+    postion?: "fixed" | "sticky" | undefined;
+    top?: number | undefined;
+    theme: SidebarV2Theme;
+    zIndex?: number | undefined;
+    left?: number | undefined;
+    bottom?: number | undefined;
+}, never>;