npm - @bikdotai/bik-component-library - Versions diffs - 0.0.833 → 0.0.834 - Mend

@bikdotai/bik-component-library 0.0.833 → 0.0.834

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 (323) hide show

package/dist/esm/components/WhatsAppTextEditor/AIRephraseButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AIRephraseButton.js","sources":["../../../../src/components/WhatsAppTextEditor/AIRephraseButton.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { useOutside } from '@src/hooks/useOutside';\nimport { COLORS } from '@src/constants/Theme';\nimport ChevronDownIcon from '../../assets/icons/chevronDown.svg';\nimport ChevronRightIcon from '../../assets/icons/chevronRight.svg';\nimport EditIcon from '../../assets/icons/edit.svg';\nimport EmojiIcon from '../../assets/icons/emoji.svg';\nimport SparkleIcon from '../../assets/icons/magic-line.svg';\nimport BorderAnimation from './BorderAnimation';\n\nconst AIButtonGroup = styled.div<{ disabled?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tborder: 1px solid transparent;\n\tborder-radius: 16px;\n\tbackground: #ffe8ef;\n\topacity: ${(props) => (props.disabled ? 0.5 : 1)};\n`;\n\nconst AIButton = styled.button<{ disabled?: boolean }>`\n\tborder: 0;\n\tbackground: #ffe8ef;\n\tcolor: #f53f77;\n\tborder-radius: 16px 0 0 16px;\n\tpadding: 6px 10px;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tline-height: 16px;\n\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\t:hover {\n\t\tfilter: brightness(0.98);\n\t}\n`;\n\nconst AIArrowButton = styled.button<{ disabled?: boolean }>`\n\tborder: 0;\n\tborder-left: 1px solid #f6c8d7;\n\tbackground: #ffe8ef;\n\tcolor: #f53f77;\n\tborder-radius: 0 16px 16px 0;\n\t//padding: 4px 6px;\n\tline-height: 1;\n\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\tdisplay: flex;\n\talign-items: center;\n`;\n\nconst AIDropdownContainer = styled.div`\n\tposition: relative;\n`;\n\nconst AIDropdownMenu = styled.div`\n\tposition: absolute;\n\ttop: calc(100% + 6px);\n\tleft: 0;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\twidth: 209px;\n\tz-index: 10;\n\tbox-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);\n\tpadding: 4px;\n`;\n\nconst AIDropdownItem = styled.button<{\n\tselected?: boolean;\n\tisInstructions?: boolean;\n\t/** Change tone row: green highlight when tone submenu is open /\n\ttoneSubmenuOpen?: boolean;\n\t/* Change tone row: green text/icon on hover or when submenu open */\n\tisChangeToneRow?: boolean;\n}>`\n\twidth: 100%;\n\ttext-align: left;\n\tborder: 0;\n\tbackground: ${(props) =>\n\t\tprops.selected \|\| props.toneSubmenuOpen ? '#d9e8db' : 'transparent'};\n\tcolor: ${(props) =>\n\t\tprops.selected \|\| props.toneSubmenuOpen\n\t\t\t? '#1e6b34'\n\t\t\t: COLORS.content.primary};\n\tpadding: 10px 10px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tfont-size: 14px;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\t:hover {\n\t\tbackground: ${(props) =>\n\t\t\tprops.selected \|\| props.toneSubmenuOpen ? '#d9e8db' : '#f7f7f8'};\n\t}\n\t${(props) =>\n\t\tprops.isChangeToneRow\n\t\t\t? `\n\t\t&:hover {\n\t\t\tcolor: #1e6b34;\n\t\t\tbackground: ${props.toneSubmenuOpen ? '#d9e8db' : '#f7f7f8'};\n\t\t}\n\t`\n\t\t\t: ''}\n`;\n\nconst ToneSubMenu = styled.div`\n\tposition: absolute;\n\ttop: 0;\n\tleft: calc(100% + 4px);\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tmin-width: 140px;\n\tz-index: 11;\n\tbox-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);\n\tpadding: 4px;\n`;\n\ntype AIRephraseButtonProps = {\n\tlabel: string;\n\tdisabled?: boolean;\n\tloading?: boolean;\n\thighlighted?: boolean;\n\ttones?: AIActionToneOption[];\n\tselectedToneId?: string;\n\tinstructionActive?: boolean;\n\tonClick?: () => void;\n\tonToneChange?: (toneId: string) => void;\n\tonInstructionsClick?: () => void;\n\tshowSecondaryRephraseOption?: boolean;\n\tonSecondaryRephraseClick?: () => void;\n};\n\nexport const AIRephraseButton = ({\n\tlabel,\n\tdisabled,\n\tloading,\n\thighlighted,\n\ttones,\n\tselectedToneId,\n\tinstructionActive,\n\tonClick,\n\tonToneChange,\n\tonInstructionsClick,\n\tshowSecondaryRephraseOption,\n\tonSecondaryRephraseClick,\n}: AIRephraseButtonProps) => {\n\tconst dropdownRef = useRef<HTMLDivElement>(null);\n\tconst [isDropdownOpen, setIsDropdownOpen] = useState(false);\n\tconst [isToneMenuOpen, setIsToneMenuOpen] = useState(false);\n\tconst isDropdownDisabled = !!instructionActive \|\| !!disabled \|\| !!loading;\n\n\tuseOutside(dropdownRef, () => {\n\t\tsetIsDropdownOpen(false);\n\t\tsetIsToneMenuOpen(false);\n\t});\n\n\tuseEffect(() => {\n\t\tif (!instructionActive) return;\n\t\tsetIsDropdownOpen(false);\n\t\tsetIsToneMenuOpen(false);\n\t}, [instructionActive]);\n\n\treturn (\n\t\t<AIDropdownContainer ref={dropdownRef}>\n\t\t\t<BorderAnimation\n\t\t\t\tshowAnimation={!!highlighted}\n\t\t\t\tdisabled={!!disabled \|\| !!loading}\n\t\t\t\tborderRadius={16}\n\t\t\t\tborderSize={2}\n\t\t\t>\n\t\t\t\t<AIButtonGroup disabled={disabled \|\| loading}>\n\t\t\t\t\t<AIButton\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tdisabled={disabled \|\| loading}\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SparkleIcon width={12} height={12} color=\"#f53f77\" />\n\t\t\t\t\t\t{loading ? '...' : label}\n\t\t\t\t\t</AIButton>\n\t\t\t\t\t<AIArrowButton\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tdisabled={isDropdownDisabled}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\tsetIsDropdownOpen((prev) => !prev);\n\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ChevronDownIcon width={14} height={14} />\n\t\t\t\t\t</AIArrowButton>\n\t\t\t\t</AIButtonGroup>\n\t\t\t</BorderAnimation>\n\t\t\t{isDropdownOpen ? (\n\t\t\t\t<AIDropdownMenu>\n\t\t\t\t\t{tones?.length ? (\n\t\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\ttoneSubmenuOpen={isToneMenuOpen}\n\t\t\t\t\t\t\tisChangeToneRow\n\t\t\t\t\t\t\tonMouseEnter={() => {\n\t\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\t\tsetIsToneMenuOpen(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonClick={() => setIsToneMenuOpen((prev) => !prev)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\t\t\twidth: '100%',\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<span\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tdisplay: 'inline-flex',\n\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<EmojiIcon width={18} height={18} color=\"currentColor\" />\n\t\t\t\t\t\t\t\t\tChange tone\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<ChevronRightIcon width={14} height={14} color=\"currentColor\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t) : null}\n\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tisInstructions\n\t\t\t\t\t\tselected={!!instructionActive}\n\t\t\t\t\t\tonMouseEnter={() => setIsToneMenuOpen(false)}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\tonInstructionsClick?.();\n\t\t\t\t\t\t\tsetIsDropdownOpen(false);\n\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<EditIcon width={16} height={16} color={COLORS.content.primary} />\n\t\t\t\t\t\tAdd instructions\n\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t{showSecondaryRephraseOption ? (\n\t\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tonMouseEnter={() => setIsToneMenuOpen(false)}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tif (disabled \|\| loading) return;\n\t\t\t\t\t\t\t\tonSecondaryRephraseClick?.();\n\t\t\t\t\t\t\t\tsetIsDropdownOpen(false);\n\t\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<SparkleIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\tRephrase\n\t\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{isToneMenuOpen && tones?.length ? (\n\t\t\t\t\t\t<ToneSubMenu>\n\t\t\t\t\t\t\t{tones.map((tone) => (\n\t\t\t\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\t\t\t\tkey={tone.id}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tselected={tone.id === selectedToneId}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\t\t\t\tonToneChange?.(tone.id);\n\t\t\t\t\t\t\t\t\t\tsetIsDropdownOpen(false);\n\t\t\t\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{tone.label}\n\t\t\t\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</ToneSubMenu>\n\t\t\t\t\t) : null}\n\t\t\t\t</AIDropdownMenu>\n\t\t\t) : null}\n\t\t</AIDropdownContainer>\n\t);\n};\nexport type AIActionToneOption = {\n\tid: string;\n\tlabel: string;\n};\n"],"names":["AIButtonGroup","styled","props","AIButton","AIArrowButton","AIDropdownContainer","AIDropdownMenu","COLORS","AIDropdownItem","ToneSubMenu","AIRephraseButton","label","disabled","loading","highlighted","tones","selectedToneId","instructionActive","onClick","onToneChange","onInstructionsClick","showSecondaryRephraseOption","onSecondaryRephraseClick","dropdownRef","useRef","isDropdownOpen","setIsDropdownOpen","useState","isToneMenuOpen","setIsToneMenuOpen","isDropdownDisabled","useOutside","useEffect","jsxs","jsx","BorderAnimation","SparkleIcon","prev","ChevronDownIcon","EmojiIcon","ChevronRightIcon","EditIcon","tone"],"mappings":"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"}
1	+ {"version":3,"file":"AIRephraseButton.js","sources":["../../../../src/components/WhatsAppTextEditor/AIRephraseButton.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { useOutside } from '@src/hooks/useOutside';\nimport { COLORS } from '@src/constants/Theme';\nimport ChevronDownIcon from '../../assets/icons/chevronDown.svg';\nimport ChevronRightIcon from '../../assets/icons/chevronRight.svg';\nimport EditIcon from '../../assets/icons/edit.svg';\nimport EmojiIcon from '../../assets/icons/emoji.svg';\nimport SparkleIcon from '../../assets/icons/magic-line.svg';\nimport BorderAnimation from './BorderAnimation';\n\nconst AIButtonGroup = styled.div<{ disabled?: boolean }>`\n\tdisplay: flex;\n\talign-items: center;\n\tborder: 1px solid transparent;\n\tborder-radius: 16px;\n\tbackground: #ffe8ef;\n\topacity: ${(props) => (props.disabled ? 0.5 : 1)};\n`;\n\nconst AIButton = styled.button<{ disabled?: boolean }>`\n\tborder: 0;\n\tbackground: #ffe8ef;\n\tcolor: #f53f77;\n\tborder-radius: 16px 0 0 16px;\n\tpadding: 4px 6px;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tline-height: 16px;\n\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\t:hover {\n\t\tfilter: brightness(0.98);\n\t}\n`;\n\nconst AIArrowButton = styled.button<{ disabled?: boolean }>`\n\tposition: relative;\n\tborder: 0;\n\tbackground: #ffe8ef;\n\tcolor: #f53f77;\n\tborder-radius: 0 16px 16px 0;\n\tpadding: 4px;\n\tline-height: 1;\n\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\tdisplay: flex;\n\talign-items: center;\n\t/* 12px inset divider, matching Figma (Line 14) /\n\t::before {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\ttop: 50%;\n\t\ttransform: translateY(-50%);\n\t\twidth: 1px;\n\t\theight: 12px;\n\t\tbackground: #f6c8d7;\n\t}\n`;\n\nconst AIDropdownContainer = styled.div`\n\tposition: relative;\n`;\n\nconst AIDropdownMenu = styled.div`\n\tposition: absolute;\n\ttop: calc(100% + 6px);\n\tleft: 0;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\twidth: 209px;\n\tz-index: 10;\n\tbox-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);\n\tpadding: 4px;\n`;\n\nconst AIDropdownItem = styled.button<{\n\tselected?: boolean;\n\tisInstructions?: boolean;\n\t/* Change tone row: green highlight when tone submenu is open /\n\ttoneSubmenuOpen?: boolean;\n\t/* Change tone row: green text/icon on hover or when submenu open */\n\tisChangeToneRow?: boolean;\n}>`\n\twidth: 100%;\n\ttext-align: left;\n\tborder: 0;\n\tbackground: ${(props) =>\n\t\tprops.selected \|\| props.toneSubmenuOpen ? '#d9e8db' : 'transparent'};\n\tcolor: ${(props) =>\n\t\tprops.selected \|\| props.toneSubmenuOpen\n\t\t\t? '#1e6b34'\n\t\t\t: COLORS.content.primary};\n\tpadding: 10px 10px;\n\tborder-radius: 6px;\n\tcursor: pointer;\n\tfont-size: 14px;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\t:hover {\n\t\tbackground: ${(props) =>\n\t\t\tprops.selected \|\| props.toneSubmenuOpen ? '#d9e8db' : '#f7f7f8'};\n\t}\n\t${(props) =>\n\t\tprops.isChangeToneRow\n\t\t\t? `\n\t\t&:hover {\n\t\t\tcolor: #1e6b34;\n\t\t\tbackground: ${props.toneSubmenuOpen ? '#d9e8db' : '#f7f7f8'};\n\t\t}\n\t`\n\t\t\t: ''}\n`;\n\nconst ToneSubMenu = styled.div`\n\tposition: absolute;\n\ttop: 0;\n\tleft: calc(100% + 4px);\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\tmin-width: 140px;\n\tz-index: 11;\n\tbox-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);\n\tpadding: 4px;\n`;\n\ntype AIRephraseButtonProps = {\n\tlabel: string;\n\tdisabled?: boolean;\n\tloading?: boolean;\n\thighlighted?: boolean;\n\ttones?: AIActionToneOption[];\n\tselectedToneId?: string;\n\tinstructionActive?: boolean;\n\tonClick?: () => void;\n\tonToneChange?: (toneId: string) => void;\n\tonInstructionsClick?: () => void;\n\tshowSecondaryRephraseOption?: boolean;\n\tonSecondaryRephraseClick?: () => void;\n};\n\nexport const AIRephraseButton = ({\n\tlabel,\n\tdisabled,\n\tloading,\n\thighlighted,\n\ttones,\n\tselectedToneId,\n\tinstructionActive,\n\tonClick,\n\tonToneChange,\n\tonInstructionsClick,\n\tshowSecondaryRephraseOption,\n\tonSecondaryRephraseClick,\n}: AIRephraseButtonProps) => {\n\tconst dropdownRef = useRef<HTMLDivElement>(null);\n\tconst [isDropdownOpen, setIsDropdownOpen] = useState(false);\n\tconst [isToneMenuOpen, setIsToneMenuOpen] = useState(false);\n\tconst isDropdownDisabled = !!instructionActive \|\| !!disabled \|\| !!loading;\n\n\tuseOutside(dropdownRef, () => {\n\t\tsetIsDropdownOpen(false);\n\t\tsetIsToneMenuOpen(false);\n\t});\n\n\tuseEffect(() => {\n\t\tif (!instructionActive) return;\n\t\tsetIsDropdownOpen(false);\n\t\tsetIsToneMenuOpen(false);\n\t}, [instructionActive]);\n\n\treturn (\n\t\t<AIDropdownContainer ref={dropdownRef}>\n\t\t\t<BorderAnimation\n\t\t\t\tshowAnimation={!!highlighted}\n\t\t\t\tdisabled={!!disabled \|\| !!loading}\n\t\t\t\tborderRadius={16}\n\t\t\t\tborderSize={2}\n\t\t\t>\n\t\t\t\t<AIButtonGroup disabled={disabled \|\| loading}>\n\t\t\t\t\t<AIButton\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tdisabled={disabled \|\| loading}\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t>\n\t\t\t\t\t\t<SparkleIcon width={16} height={16} color=\"#f53f77\" />\n\t\t\t\t\t\t{loading ? '...' : label}\n\t\t\t\t\t</AIButton>\n\t\t\t\t\t<AIArrowButton\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tdisabled={isDropdownDisabled}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\tsetIsDropdownOpen((prev) => !prev);\n\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ChevronDownIcon width={16} height={16} />\n\t\t\t\t\t</AIArrowButton>\n\t\t\t\t</AIButtonGroup>\n\t\t\t</BorderAnimation>\n\t\t\t{isDropdownOpen ? (\n\t\t\t\t<AIDropdownMenu>\n\t\t\t\t\t{tones?.length ? (\n\t\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\ttoneSubmenuOpen={isToneMenuOpen}\n\t\t\t\t\t\t\tisChangeToneRow\n\t\t\t\t\t\t\tonMouseEnter={() => {\n\t\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\t\tsetIsToneMenuOpen(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonClick={() => setIsToneMenuOpen((prev) => !prev)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\t\t\twidth: '100%',\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<span\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tdisplay: 'inline-flex',\n\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<EmojiIcon width={18} height={18} color=\"currentColor\" />\n\t\t\t\t\t\t\t\t\tChange tone\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<ChevronRightIcon width={14} height={14} color=\"currentColor\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t) : null}\n\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tisInstructions\n\t\t\t\t\t\tselected={!!instructionActive}\n\t\t\t\t\t\tonMouseEnter={() => setIsToneMenuOpen(false)}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\tonInstructionsClick?.();\n\t\t\t\t\t\t\tsetIsDropdownOpen(false);\n\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<EditIcon width={16} height={16} color={COLORS.content.primary} />\n\t\t\t\t\t\tAdd instructions\n\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t{showSecondaryRephraseOption ? (\n\t\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tonMouseEnter={() => setIsToneMenuOpen(false)}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tif (disabled \|\| loading) return;\n\t\t\t\t\t\t\t\tonSecondaryRephraseClick?.();\n\t\t\t\t\t\t\t\tsetIsDropdownOpen(false);\n\t\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<SparkleIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\tRephrase\n\t\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{isToneMenuOpen && tones?.length ? (\n\t\t\t\t\t\t<ToneSubMenu>\n\t\t\t\t\t\t\t{tones.map((tone) => (\n\t\t\t\t\t\t\t\t<AIDropdownItem\n\t\t\t\t\t\t\t\t\tkey={tone.id}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tselected={tone.id === selectedToneId}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tif (isDropdownDisabled) return;\n\t\t\t\t\t\t\t\t\t\tonToneChange?.(tone.id);\n\t\t\t\t\t\t\t\t\t\tsetIsDropdownOpen(false);\n\t\t\t\t\t\t\t\t\t\tsetIsToneMenuOpen(false);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{tone.label}\n\t\t\t\t\t\t\t\t</AIDropdownItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</ToneSubMenu>\n\t\t\t\t\t) : null}\n\t\t\t\t</AIDropdownMenu>\n\t\t\t) : null}\n\t\t</AIDropdownContainer>\n\t);\n};\nexport type AIActionToneOption = {\n\tid: string;\n\tlabel: string;\n};\n"],"names":["AIButtonGroup","styled","props","AIButton","AIArrowButton","AIDropdownContainer","AIDropdownMenu","COLORS","AIDropdownItem","ToneSubMenu","AIRephraseButton","label","disabled","loading","highlighted","tones","selectedToneId","instructionActive","onClick","onToneChange","onInstructionsClick","showSecondaryRephraseOption","onSecondaryRephraseClick","dropdownRef","useRef","isDropdownOpen","setIsDropdownOpen","useState","isToneMenuOpen","setIsToneMenuOpen","isDropdownDisabled","useOutside","useEffect","jsxs","jsx","BorderAnimation","SparkleIcon","prev","ChevronDownIcon","EmojiIcon","ChevronRightIcon","EditIcon","tone"],"mappings":"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"}

package/dist/esm/components/avatar/Avatar.d.ts CHANGED Viewed

@@ -1,15 +1,16 @@
 import { default as React } from 'react';
 import { AVATAR_BACKGROUND, AVATAR_TYPES, SIZE } from './AvatarHelper';
 export declare const AVATAR_SIZE_VS_ICON_SIZE_MAP: {
+    EXTRA_SMALL: number;
     SMALL: number;
     MEDIUM: number;
-    INBOX: number;
     LARGE: number;
 };
 export declare const BACKGROUND_VS_TEXT_COLOR_MAP: {
     LIGHT: string;
     WHITE: string;
     DARK: string;
+    BRAND: string;
 };
 export type AvatarProps = {
     type: AVATAR_TYPES;

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

@@ -1,82 +1,60 @@
-import { jsxs as g, jsx as e } from "react/jsx-runtime";
-import { useState as k } from "react";
-import { AvatarStyle as v } from "./Avatar.styled.js";
-import { SIZE as a, AVATAR_TYPES as r, AVATAR_BACKGROUND as h, AVATAR_SIZE_MAP as o } from "./AvatarHelper.js";
-import { BodyTiny as R, TitleSmall as w, TitleMedium as O } from "../TypographyStyle.js";
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { useState as R } from "react";
+import { TitleMedium as k, TitleSmall as A, SubHeading as w, BodyTiny as O } from "../TypographyStyle.js";
 import { COLORS as i } from "../../constants/Theme.js";
-import A from "../../assets/icons/bik_livechat.svg.js";
+import x from "../../assets/icons/bik_livechat.svg.js";
 import u from "../../assets/icons/email-channel.svg.js";
 import d from "../../assets/icons/facebook_channel.svg.js";
 import z from "../../assets/icons/gmail.svg.js";
-import x from "../../assets/icons/instagram-channel.svg.js";
-import C from "../../assets/icons/task.svg.js";
-import B from "../../assets/icons/whatsapp_color.svg.js";
-const n = {
-  [a.SMALL]: 16,
-  [a.MEDIUM]: 20,
-  [a.INBOX]: 24,
-  [a.LARGE]: 32
-}, c = {
-  [h.LIGHT]: i.content.secondary,
-  [h.WHITE]: i.content.secondary,
-  [h.DARK]: i.surface.standard
+import C from "../../assets/icons/instagram-channel.svg.js";
+import L from "../../assets/icons/task.svg.js";
+import U from "../../assets/icons/whatsapp_color.svg.js";
+import { AvatarStyle as B } from "./Avatar.styled.js";
+import { SIZE as n, AVATAR_TYPES as r, AVATAR_BACKGROUND as s, AVATAR_SIZE_MAP as l } from "./AvatarHelper.js";
+const a = {
+  [n.EXTRA_SMALL]: 10,
+  [n.SMALL]: 16,
+  [n.MEDIUM]: 20,
+  [n.LARGE]: 32
+}, b = {
+  [s.LIGHT]: i.content.secondary,
+  [s.WHITE]: i.content.secondary,
+  [s.DARK]: i.surface.standard,
+  [s.BRAND]: i.background.inverseLight
 };
-var U = /* @__PURE__ */ ((t) => (t.INSTAGRAM = "instagram", t.MESSENGER = "messenger", t.WHATSAPP = "whatsapp", t.GMAIL = "gmail", t.LIVECHAT = "livechat", t.GOOGLE_BUSINESS_CHAT = "gbm", t.SHOPIFY = "shopify", t.FACEBOOK = "facebook", t.EMAIL = "email", t.SMTP = "smtp", t.FACEBOOK_CATALOG = "facebook-catalog", t.TASKS = "tasks", t.BIK_LIVECHAT = "livechat", t))(U || {});
-const Y = (t) => {
-  const [l, b] = k(!1), m = () => {
-    const s = (t.name || "").split(".").join(" ").split(" ").map((T) => T.charAt(0).toUpperCase()).slice(0, 2).join("");
-    if (t.size === a.SMALL)
-      return /* @__PURE__ */ e(
-        R,
-        {
-          style: { color: c[t.background] },
-          children: s
-        }
-      );
-    if (t.size === a.MEDIUM || t.size === a.INBOX)
-      return /* @__PURE__ */ e(
-        w,
-        {
-          style: { color: c[t.background] },
-          children: s
-        }
-      );
-    if (t.size === a.LARGE)
-      return /* @__PURE__ */ e(
-        O,
-        {
-          style: { color: c[t.background] },
-          children: s
-        }
-      );
-  }, I = () => t.useNameFallback && (!t.photoUrl || l) && t.name ? /* @__PURE__ */ e("div", { children: m() }) : t.useNameFallback && t.photoUrl && !l ? /* @__PURE__ */ e(
+var P = /* @__PURE__ */ ((t) => (t.INSTAGRAM = "instagram", t.MESSENGER = "messenger", t.WHATSAPP = "whatsapp", t.GMAIL = "gmail", t.LIVECHAT = "livechat", t.GOOGLE_BUSINESS_CHAT = "gbm", t.SHOPIFY = "shopify", t.FACEBOOK = "facebook", t.EMAIL = "email", t.SMTP = "smtp", t.FACEBOOK_CATALOG = "facebook-catalog", t.TASKS = "tasks", t.BIK_LIVECHAT = "livechat", t))(P || {});
+const J = (t) => {
+  const [h, f] = R(!1), g = () => {
+    const o = (t.name || "").split(".").join(" ").split(" ").map((v) => v.charAt(0).toUpperCase()).slice(0, 2).join(""), c = b[t.background];
+    return t.size === n.LARGE ? /* @__PURE__ */ e(k, { style: { color: c }, children: o }) : t.size === n.MEDIUM ? /* @__PURE__ */ e(A, { style: { color: c }, children: o }) : t.size === n.SMALL ? /* @__PURE__ */ e(w, { style: { color: c }, children: o }) : /* @__PURE__ */ e(O, { style: { color: c, fontSize: "6.667px", lineHeight: "8px" }, children: o });
+  }, I = () => t.useNameFallback && (!t.photoUrl || h) && t.name ? /* @__PURE__ */ e("div", { children: g() }) : t.useNameFallback && t.photoUrl && !h ? /* @__PURE__ */ e(
     "img",
     {
       alt: "",
-      width: o[t.size],
-      height: o[t.size],
+      width: l[t.size],
+      height: l[t.size],
       style: {
         borderRadius: t?.borderRadius || "50%",
         objectFit: "contain"
       },
       src: t.photoUrl,
       onError: () => {
-        b(!0);
+        f(!0);
       }
     }
   ) : /* @__PURE__ */ e(
     "img",
     {
       alt: "",
-      width: o[t.size],
-      height: o[t.size],
+      width: l[t.size],
+      height: l[t.size],
       style: {
         borderRadius: t?.borderRadius || "50%",
         objectFit: "contain"
       },
       src: t.photoUrl
     }
-  ), f = () => {
+  ), y = () => {
     switch (t.channelName) {
       case "email":
         return /* @__PURE__ */ e(u, { width: 11, height: 11 });
@@ -89,17 +67,17 @@ const Y = (t) => {
       case "messenger":
         return /* @__PURE__ */ e(d, { width: 11, height: 11 });
       case "instagram":
-        return /* @__PURE__ */ e(x, { width: 11, height: 11 });
+        return /* @__PURE__ */ e(C, { width: 11, height: 11 });
       case "whatsapp":
-        return /* @__PURE__ */ e(B, { width: 11, height: 11 });
+        return /* @__PURE__ */ e(U, { width: 11, height: 11 });
       case "gmail":
         return /* @__PURE__ */ e(z, { width: 11, height: 11 });
       case "tasks":
-        return /* @__PURE__ */ e(C, { width: 11, height: 11 });
+        return /* @__PURE__ */ e(L, { width: 11, height: 11 });
       case "livechat":
-        return /* @__PURE__ */ e(A, { width: 11, height: 11 });
+        return /* @__PURE__ */ e(x, { width: 11, height: 11 });
     }
-  }, y = () => t.status ? /* @__PURE__ */ e(
+  }, T = () => t.status ? /* @__PURE__ */ e(
     "div",
     {
       style: {
@@ -110,28 +88,28 @@ const Y = (t) => {
       }
     }
   ) : null;
-  return /* @__PURE__ */ g(
+  return /* @__PURE__ */ m(
     "div",
     {
       style: {
         position: "relative"
       },
       children: [
-        /* @__PURE__ */ g(
-          v,
+        /* @__PURE__ */ m(
+          B,
           {
-            type: t.type === r.IMAGE && (l || !t.photoUrl) && t.useNameFallback && t.name ? r.INITIALS : t.type,
+            type: t.type === r.IMAGE && (h || !t.photoUrl) && t.useNameFallback && t.name ? r.INITIALS : t.type,
             size: t.size,
             background: t.background,
             children: [
               t.type === r.IMAGE && I(),
-              t.type === r.INITIALS && /* @__PURE__ */ e("div", { children: m() }),
+              t.type === r.INITIALS && /* @__PURE__ */ e("div", { children: g() }),
               t.type === r.ICON && t.icon && /* @__PURE__ */ e(
                 t.icon,
                 {
-                  width: n[t.size],
-                  height: n[t.size],
-                  color: c[t.background]
+                  width: a[t.size],
+                  height: a[t.size],
+                  color: b[t.background]
                 }
               )
             ]
@@ -142,8 +120,8 @@ const Y = (t) => {
           {
             style: {
               position: "absolute",
-              left: n[t.size] + "px",
-              top: n[t.size] + "px",
+              left: a[t.size] + "px",
+              top: a[t.size] + "px",
               width: 14,
               height: 14,
               borderRadius: t?.borderRadius || "50%",
@@ -152,7 +130,7 @@ const Y = (t) => {
               backgroundColor: t.inboxSettings.isSelected ? t.inboxSettings.isComments ? i.content.primary : i.background.brandLight : t.inboxSettings.isComments ? i.content.primary : i.surface.standard,
               alignItems: "center"
             },
-            children: f()
+            children: y()
           }
         ),
         t.status && /* @__PURE__ */ e(
@@ -160,8 +138,8 @@ const Y = (t) => {
           {
             style: {
               position: "absolute",
-              left: n[t.size] + "px",
-              top: n[t.size] + "px",
+              left: a[t.size] + "px",
+              top: a[t.size] + "px",
               width: 11,
               height: 11,
               borderRadius: "50%",
@@ -170,7 +148,7 @@ const Y = (t) => {
               backgroundColor: i.surface.standard,
               alignItems: "center"
             },
-            children: y()
+            children: T()
           }
         )
       ]
@@ -178,9 +156,9 @@ const Y = (t) => {
   );
 };
 export {
-  n as AVATAR_SIZE_VS_ICON_SIZE_MAP,
-  Y as Avatar,
-  c as BACKGROUND_VS_TEXT_COLOR_MAP,
-  U as MESSAGE_CHANNELS
+  a as AVATAR_SIZE_VS_ICON_SIZE_MAP,
+  J as Avatar,
+  b as BACKGROUND_VS_TEXT_COLOR_MAP,
+  P as MESSAGE_CHANNELS
 };
 //# sourceMappingURL=Avatar.js.map

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","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","COLORS","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","e","jsx","BodyTiny","TitleSmall","TitleMedium","getImageBlock","AVATAR_SIZE_MAP","getChannelIcon","EmailIcon","FacebookIcon","InstagramIcon","WhatsappIcon","GmailIcon","TaskIcon","BikLivechatIcon","getOnlineStatusIcon","jsxs","AvatarStyle","AVATAR_TYPES"],"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\tSubHeading,\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\tif (props.size === SIZE.SMALL) {\n\t\t\treturn <SubHeading style={{ color }}>{initials}</SubHeading>;\n\t\t}\n\t\t// EXTRA_SMALL: 6.667px / 8px per Figma. BodyTiny's 10px/12px is too large\n\t\t// for the 16px circle (leaves 2px padding instead of the intended 4px).\n\t\treturn (\n\t\t\t<BodyTiny style={{ color, fontSize: '6.667px', lineHeight: '8px' }}>\n\t\t\t\t{initials}\n\t\t\t</BodyTiny>\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","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","COLORS","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","e","color","TitleMedium","TitleSmall","SubHeading","jsx","BodyTiny","getImageBlock","AVATAR_SIZE_MAP","getChannelIcon","EmailIcon","FacebookIcon","InstagramIcon","WhatsappIcon","GmailIcon","TaskIcon","BikLivechatIcon","getOnlineStatusIcon","jsxs","AvatarStyle","AVATAR_TYPES"],"mappings":"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"}

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

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

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","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS"],"mappings":";;;AASO,MAAMA,IAAcC,EAAO;AAAA,UAKxB,CAACC,MAAUC,EAAgBD,EAAM,IAAI,IAAI,IAAI;AAAA,WAC5C,CAACA,MAAUC,EAAgBD,EAAM,IAAI,IAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAInC,CAACA,MACpBA,EAAM,SAASE,EAAa,QACzB,SACAF,EAAM,eAAeG,EAAkB,QACvCC,EAAO,WAAW,OAClBJ,EAAM,eAAeG,EAAkB,QACvCC,EAAO,QAAQ,~~WACfA~~,EAAO,WAAW,OAAO;AAAA,WACnB,CAACJ,MACVA,EAAM,eAAeG,EAAkB,SACvCH,EAAM,eAAeG,EAAkB,QACpC,eAAeC,EAAO,OAAO,UAC7B,CAAC;AAAA;AAAA;"}
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","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS"],"mappings":";;;AASO,MAAMA,IAAcC,EAAO;AAAA,UAKxB,CAACC,MAAUC,EAAgBD,EAAM,IAAI,IAAI,IAAI;AAAA,WAC5C,CAACA,MAAUC,EAAgBD,EAAM,IAAI,IAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAInC,CAACA,MACpBA,EAAM,SAASE,EAAa,QACzB,SACAF,EAAM,eAAeG,EAAkB,QACvCC,EAAO,WAAW,OAClBJ,EAAM,eAAeG,EAAkB,QACvCC,EAAO,QAAQ,WACfJ,EAAM,eAAeG,EAAkB,QACvCC,EAAO,WAAW,aAClBA,EAAO,WAAW,OAAO;AAAA,WACnB,CAACJ,MACVA,EAAM,eAAeG,EAAkB,SACvCH,EAAM,eAAeG,EAAkB,QACpC,eAAeC,EAAO,OAAO,UAC7B,CAAC;AAAA;AAAA;"}

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

@@ -4,19 +4,20 @@ export declare enum AVATAR_TYPES {
     ICON = "ICON"
 }
 export declare enum SIZE {
+    EXTRA_SMALL = "EXTRA_SMALL",
     SMALL = "SMALL",
     MEDIUM = "MEDIUM",
-    LARGE = "LARGE",
-    INBOX = "INBOX"
+    LARGE = "LARGE"
 }
 export declare enum AVATAR_BACKGROUND {
     LIGHT = "LIGHT",
     DARK = "DARK",
-    WHITE = "WHITE"
+    WHITE = "WHITE",
+    BRAND = "BRAND"
 }
 export declare const AVATAR_SIZE_MAP: {
+    EXTRA_SMALL: number;
     SMALL: number;
     MEDIUM: number;
     LARGE: number;
-    INBOX: number;
 };

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

@@ -1,14 +1,14 @@
-var L = /* @__PURE__ */ ((I) => (I.IMAGE = "IMAGE", I.INITIALS = "INITIALS", I.ICON = "ICON", I))(L || {}), M = /* @__PURE__ */ ((I) => (I.SMALL = "SMALL", I.MEDIUM = "MEDIUM", I.LARGE = "LARGE", I.INBOX = "INBOX", I))(M || {}), r = /* @__PURE__ */ ((I) => (I.LIGHT = "LIGHT", I.DARK = "DARK", I.WHITE = "WHITE", I))(r || {});
+var I = /* @__PURE__ */ ((L) => (L.IMAGE = "IMAGE", L.INITIALS = "INITIALS", L.ICON = "ICON", L))(I || {}), M = /* @__PURE__ */ ((L) => (L.EXTRA_SMALL = "EXTRA_SMALL", L.SMALL = "SMALL", L.MEDIUM = "MEDIUM", L.LARGE = "LARGE", L))(M || {}), r = /* @__PURE__ */ ((L) => (L.LIGHT = "LIGHT", L.DARK = "DARK", L.WHITE = "WHITE", L.BRAND = "BRAND", L))(r || {});
 const E = {
+  EXTRA_SMALL: 16,
   SMALL: 24,
   MEDIUM: 40,
-  LARGE: 64,
-  INBOX: 30
+  LARGE: 64
 };
 export {
   r as AVATAR_BACKGROUND,
   E as AVATAR_SIZE_MAP,
-  L as AVATAR_TYPES,
+  I as AVATAR_TYPES,
   M 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"],"mappings":"AAAO,IAAKA,sBAAAA,OACXA,EAAA,QAAQ,SACRA,EAAA,WAAW,YACXA,EAAA,OAAO,QAHIA,IAAAA,KAAA,CAAA,CAAA,GAMAC,sBAAAA,OACXA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,QAAQ,~~SACRA,EAAA,QAAQ,~~SAJGA,IAAAA,KAAA,CAAA,CAAA,GAOAC,sBAAAA,OACXA,EAAA,QAAQ,SACRA,EAAA,OAAO,QACPA,EAAA,QAAQ,~~SAHGA~~,IAAAA,KAAA,CAAA,CAAA;~~AAML~~,MAAMC,IAAkB;AAAA,EAC7B,OAAa;AAAA,EACb,QAAc;AAAA,EACd,OAAa;~~AAAA,EACb,OAAa;~~AACf;"}
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"],"mappings":"AAAO,IAAKA,sBAAAA,OACXA,EAAA,QAAQ,SACRA,EAAA,WAAW,YACXA,EAAA,OAAO,QAHIA,IAAAA,KAAA,CAAA,CAAA,GAMAC,sBAAAA,OACXA,EAAA,cAAc,eACdA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAJGA,IAAAA,KAAA,CAAA,CAAA,GAOAC,sBAAAA,OACXA,EAAA,QAAQ,SACRA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,QAAQ,SAJGA,IAAAA,KAAA,CAAA,CAAA;AAOL,MAAMC,IAAkB;AAAA,EAC7B,aAAmB;AAAA,EACnB,OAAa;AAAA,EACb,QAAc;AAAA,EACd,OAAa;AACf;"}

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","menu","useEffect","onClickMainMenuLogic","useCallback","option","setHandleHoverForFullLayout","clearRemnantTimers","top","determineElementTop","targetElement","topValue","calculateTopSideBarPosition","initiateAutoClose","targetRect","innerStickyElements","innerStickyElement","element","distanceToBottom","handleResize","newTop","determineSideMenuTopWhileResize","openSideMenuElementHeight","currentId","sideMenuRect","divBoxTop","popupHeight","timer","SideBarContainer","jsx","BikIcon","jsxs","MainSideBarMenuWrapper","index","Fragment","NavigationHyperlink","EachSidebarMenuItem","SidebarPopup","popupMenuSelected","SimpleSidebar","menuSelected","reDirect","SibeBarMenuItem","CircularProgressBar","IconComponent","iconComponentProps","icon","isActive","activeStateIcon","hoverStateIcon","isHovered","COLORS","LockedIcon"],"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","menu","useEffect","onClickMainMenuLogic","useCallback","option","setHandleHoverForFullLayout","clearRemnantTimers","top","determineElementTop","targetElement","topValue","calculateTopSideBarPosition","initiateAutoClose","targetRect","innerStickyElements","innerStickyElement","element","distanceToBottom","handleResize","newTop","determineSideMenuTopWhileResize","openSideMenuElementHeight","currentId","sideMenuRect","divBoxTop","popupHeight","timer","SideBarContainer","jsx","BikIcon","jsxs","MainSideBarMenuWrapper","index","Fragment","NavigationHyperlink","EachSidebarMenuItem","SidebarPopup","popupMenuSelected","SimpleSidebar","menuSelected","reDirect","SibeBarMenuItem","CircularProgressBar","IconComponent","iconComponentProps","icon","isActive","activeStateIcon","hoverStateIcon","isHovered","COLORS","LockedIcon"],"mappings":"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"}