npm - @bikdotai/bik-component-library - Versions diffs - 0.0.836 → 0.0.837-0 - Mend

@bikdotai/bik-component-library 0.0.836 → 0.0.837-0

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

package/dist/cjs/components/input/Input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.js","sources":["../../../../src/components/input/Input.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport React, {\n\tforwardRef,\n\tMutableRefObject,\n\tRef,\n\tuseContext,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport { Button } from '@src/components/button';\nimport {\n\tisFunction,\n\tsanitizeUnsafeInput,\n\tshouldSanitizeForType,\n\tvalidateInput,\n} from '@src/components/input/Input-helper';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport ErrorIcon from '../../assets/icons/errorInfo.svg';\nimport { InputStyleContext } from './context/InputStyleProvider';\nimport { InputProps, InputTypeI, InputVariant } from './Input.model';\nimport * as SC from './Input.styled';\nimport { PrefixHolder, SuffixHolder } from './Input.styled';\n\nexport const Input = forwardRef(\n\t(\n\t\tprops: InputProps,\n\t\tfRef: React.ForwardedRef<HTMLInputElement \| HTMLTextAreaElement \| null>,\n\t) => {\n\t\tconst {\n\t\t\tplaceholder,\n\t\t\tleftIcon,\n\t\t\trightIcon,\n\t\t\tlabelText,\n\t\t\tmaxCharLimit,\n\t\t\tisRequired,\n\t\t\thintText,\n\t\t\ttype,\n\t\t\tstate,\n\t\t\tvalidate,\n\t\t\tvariant,\n\t\t\tbutton,\n\t\t\tsuffixText,\n\t\t\tprefixText,\n\t\t\tonChangeText,\n\t\t\tvalue,\n\t\t\tnoErrorHint,\n\t\t\treset,\n\t\t\trangeValidation,\n\t\t\tnoKeyDownChange,\n\t\t\tversion,\n\t\t\tnoMaxCharCheck,\n\t\t\tlabelElement,\n\t\t\tautoGrow,\n\t\t\tminHeight,\n\t\t\tmaxHeight,\n\t\t\tlabelTextBold,\n\t\t\ttruncateText,\n\t\t\tmaxCharLimitPosition,\n\t\t\tmaxCharStyle,\n\t\t\thightlightInputColor,\n\t\t\tonKeyDownEvent,\n\t\t\thideInputHeader,\n\t\t\thideBorder,\n\t\t\tinputWrapperStyles,\n\t\t\tminCharsToTrigger,\n\t\t\tmaxCharAlignment,\n\t\t\tisDisabled = false,\n\t\t\tallowUnsafeInput,\n\t\t\tleftIconStyle,\n\t\t} = {\n\t\t\tmaxCharLimit: 0,\n\t\t\ttype: 'text' as InputTypeI,\n\t\t\tvariant: 'default' as InputVariant,\n\t\t\tmaxCharLimitPosition: 'TOP',\n\t\t\tminCharsToTrigger: 0,\n\t\t\tmaxCharAlignment: false,\n\t\t\t...props,\n\t\t};\n\t\tconst LeftIcon = leftIcon?.icon;\n\t\tconst RightIcon = rightIcon?.icon;\n\t\tconst [isInvalid, setIsInvalid] = useState<boolean>(false);\n\t\tconst [isActive, setIsActive] = useState<boolean>(false);\n\t\tconst [errorMessage, setErrorMessage] = useState<string>();\n\t\tconst iconSize =\n\t\t\tvariant === 'x-small' ? '12px' : variant === 'small' ? '18px' : '22px';\n\t\tconst stylesFromOutside = useContext(InputStyleContext);\n\t\tconst [inputValue, setInputValue] = useState<string>('');\n\t\tconst _ref = useRef<HTMLInputElement \| HTMLTextAreaElement>(null);\n\t\tconst inputRef: MutableRefObject<HTMLInputElement \| HTMLTextAreaElement> =\n\t\t\t(fRef ?? _ref) as MutableRefObject<\n\t\t\t\tHTMLInputElement \| HTMLTextAreaElement\n\t\t\t>;\n\n\t\tuseEffect(() => {\n\t\t\tsetInputValue(value \|\| '');\n\t\t\tif (!value && autoGrow) {\n\t\t\t\tinputRef.current.style.height = minHeight \|\| '48px';\n\t\t\t}\n\t\t}, [value]);\n\n\t\tuseEffect(() => {\n\t\t\tif (!inputRef.current) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tprops.onReferenceInit?.(inputRef.current);\n\t\t}, [inputRef]);\n\n\t\tuseEffect(() => {\n\t\t\tconst numberInput = inputRef.current;\n\t\t\tif (numberInput && ['phonenumber', 'zip', 'number'].includes(type)) {\n\t\t\t\tnumberInput.addEventListener('wheel', onWheel, { passive: false });\n\n\t\t\t\treturn () => {\n\t\t\t\t\tnumberInput.removeEventListener('wheel', onWheel);\n\t\t\t\t};\n\t\t\t}\n\t\t}, []);\n\n\t\tuseEffect(() => {\n\t\t\tif (!reset) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetInputValue('');\n\t\t}, [reset]);\n\n\t\tuseEffect(() => {\n\t\t\tsetIsActive(!!props.isActive);\n\t\t\tif (props.isActive) {\n\t\t\t\tinputRef.current?.focus();\n\t\t\t}\n\t\t}, [props.isActive]);\n\n\t\tuseEffect(() => {\n\t\t\tsetErrorMessage(props.errorMessage);\n\t\t}, [props.errorMessage]);\n\n\t\tuseEffect(() => {\n\t\t\tsetIsInvalid(false);\n\t\t\tif (\n\t\t\t\tprops.state === 'invalid' \|\|\n\t\t\t\terrorMessage \|\|\n\t\t\t\tprops.state === 'disabled-invalid'\n\t\t\t) {\n\t\t\t\tsetIsInvalid(true);\n\t\t\t}\n\t\t\tif (props.state === 'active') {\n\t\t\t\tinputRef.current?.focus();\n\t\t\t}\n\t\t}, [props.state, errorMessage]);\n\n\t\tuseEffect(() => {\n\t\t\tsetIsInvalid(!!errorMessage \|\| props.state === 'invalid');\n\t\t}, [errorMessage, props.state]);\n\n\t\tconst executeCallback = (cb: any, ...params: any[]): void => {\n\t\t\tif (!isFunction(cb)) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tcb(...params);\n\t\t};\n\n\t\tconst getMaxChar = () => {\n\t\t\tif (type === 'zip') {\n\t\t\t\treturn 6;\n\t\t\t}\n\t\t\treturn 2000;\n\t\t};\n\n\t\tconst onKeyDown = (e) => {\n\t\t\tconst MAX_CHAR_LIMIT = maxCharLimit !== 0 ? maxCharLimit : getMaxChar();\n\t\t\tconst KEY_CODES_TO_BE_EXCLUDED = [8];\n\t\t\tconst MIN_CHAR_LIMIT = minCharsToTrigger;\n\t\t\tconst inputText = e.target.value;\n\t\t\tif (\n\t\t\t\tonKeyDownEvent &&\n\t\t\t\t(!inputText.length \|\| inputText.length >= MIN_CHAR_LIMIT)\n\t\t\t) {\n\t\t\t\tonKeyDownEvent(e);\n\t\t\t}\n\n\t\t\tif (\n\t\t\t\t!noKeyDownChange &&\n\t\t\t\t(!inputText.length \|\| inputText.length >= MIN_CHAR_LIMIT)\n\t\t\t) {\n\t\t\t\tonChangeText(value \|\| '', e);\n\t\t\t}\n\t\t\tif (noMaxCharCheck) return;\n\n\t\t\tif (\n\t\t\t\t!KEY_CODES_TO_BE_EXCLUDED.includes(e.which) &&\n\t\t\t\tMAX_CHAR_LIMIT > 0 &&\n\t\t\t\tinputText.length >= MAX_CHAR_LIMIT\n\t\t\t) {\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t};\n\n\t\tconst onWheel = (event) => {\n\t\t\tevent.preventDefault(); // Prevent the default scroll behavior\n\t\t};\n\n\t\tconst onChange = (e) => {\n\t\t\tlet inputText = e.target.value;\n\t\t\tconst MAX_CHAR_LIMIT =\n\t\t\t\tmaxCharLimit !== 0 ? maxCharLimit + 1 : getMaxChar();\n\t\t\tconst MIN_CHAR_LIMIT = minCharsToTrigger;\n\n\t\t\tif (!allowUnsafeInput && shouldSanitizeForType(type)) {\n\t\t\t\tinputText = sanitizeUnsafeInput(inputText);\n\t\t\t}\n\n\t\t\tif (\n\t\t\t\t!noMaxCharCheck &&\n\t\t\t\tMAX_CHAR_LIMIT > 0 &&\n\t\t\t\tinputText.length >= MAX_CHAR_LIMIT\n\t\t\t) {\n\t\t\t\t// letting user to copy paste text upto max limit instead of blank action\n\t\t\t\tinputText = inputText.substring(0, MAX_CHAR_LIMIT - 1);\n\t\t\t}\n\n\t\t\tif (!props.textControl) {\n\t\t\t\tsetInputValue(inputText \|\| '');\n\t\t\t}\n\t\t\tif (MIN_CHAR_LIMIT && inputText && inputText.length < MIN_CHAR_LIMIT) {\n\t\t\t\t// if minCharsToTrigger exists and is not reached, do nothing\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonChangeText(inputText, e);\n\t\t\tif (autoGrow) {\n\t\t\t\tinputRef.current.style.height = `${inputRef.current.scrollHeight}px`;\n\t\t\t\tif (!inputText) {\n\t\t\t\t\tinputRef.current.style.height = minHeight \|\| '48px';\n\t\t\t\t}\n\t\t\t}\n\t\t\tconst validateFunction = validate \|\| validateInput;\n\t\t\tif (!validateFunction \|\| !isFunction(validateFunction)) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst [isValid, error] = validateFunction(\n\t\t\t\tinputText,\n\t\t\t\ttype,\n\t\t\t\trangeValidation,\n\t\t\t);\n\n\t\t\tsetIsInvalid(!isValid);\n\t\t\tsetErrorMessage(props.errorMessage ? props.errorMessage : error);\n\t\t};\n\n\t\tconst onFocus = (e) => {\n\t\t\tif (!props.skipFocus) {\n\t\t\t\tsetIsActive(true);\n\t\t\t}\n\t\t\texecuteCallback(props.onFocus?.(e));\n\t\t};\n\n\t\tconst onBlur = (e) => {\n\t\t\tif (!props.skipFocus) {\n\t\t\t\tsetIsActive(false);\n\t\t\t}\n\t\t\texecuteCallback(props.onBlur?.(e));\n\t\t};\n\n\t\tconst getInputHTML = () => {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{type !== 'multiline' && (\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tclassName={truncateText ? 'truncate-class' : ''}\n\t\t\t\t\t\t\tdata-test={props['data-test']}\n\t\t\t\t\t\t\tid={props.id}\n\t\t\t\t\t\t\tstyle={stylesFromOutside?.input ?? {}}\n\t\t\t\t\t\t\tref={inputRef as Ref<HTMLInputElement>}\n\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\ttype={\n\t\t\t\t\t\t\t\t['phonenumber', 'zip', 'number'].includes(type)\n\t\t\t\t\t\t\t\t\t? 'number'\n\t\t\t\t\t\t\t\t\t: type\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\t\t\tonFocus={(e) => onFocus(e)}\n\t\t\t\t\t\t\tonBlur={(e) => onBlur(e)}\n\t\t\t\t\t\t\tplaceholder={placeholder \|\| 'Enter here'}\n\t\t\t\t\t\t\tonChange={onChange}\n\t\t\t\t\t\t\tonClick={(e) => executeCallback(props.onClick)}\n\t\t\t\t\t\t\tonKeyDown={(e) => onKeyDown(e)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{type === 'multiline' && (\n\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\tdata-test={props['data-test']}\n\t\t\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\t\t\tref={inputRef as Ref<HTMLTextAreaElement>}\n\t\t\t\t\t\t\tonFocus={(e) => onFocus(e)}\n\t\t\t\t\t\t\tonBlur={(e) => onBlur(e)}\n\t\t\t\t\t\t\tonClick={(e) => executeCallback(props.onClick)}\n\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\tplaceholder={placeholder \|\| 'Enter here'}\n\t\t\t\t\t\t\tonChange={onChange}\n\t\t\t\t\t\t\tonKeyDown={(e) => onKeyDown(e)}\n\t\t\t\t\t\t\tmaxLength={maxCharLimit > 0 ? maxCharLimit : undefined}\n\t\t\t\t\t\t/>\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<SC.RootContainer\n\t\t\t\twidth={props.width}\n\t\t\t\theight={props.height}\n\t\t\t\tstate={state}\n\t\t\t\ttype={type}\n\t\t\t\tstyle={stylesFromOutside?.RootContainer ?? {}}\n\t\t\t>\n\t\t\t\t<div className=\"flex-align-center\">\n\t\t\t\t\t{!noErrorHint && (!!hintText \|\| !!errorMessage) && (\n\t\t\t\t\t\t<SC.InputFooter invalid={!!errorMessage}>\n\t\t\t\t\t\t\t{!!errorMessage && <ErrorIcon width={16} height={16} />}\n\t\t\t\t\t\t\t{errorMessage \|\| hintText}\n\t\t\t\t\t\t</SC.InputFooter>\n\t\t\t\t\t)}\n\t\t\t\t\t{maxCharLimit > 0 && maxCharLimitPosition === 'BOTTOM' && (\n\t\t\t\t\t\t<SC.MaxCharStyle position={'BOTTOM'} style={maxCharStyle}>\n\t\t\t\t\t\t\t{(value ?? '').toString()?.length ?? 0}/{maxCharLimit}\n\t\t\t\t\t\t</SC.MaxCharStyle>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<SC.InputWrapper\n\t\t\t\t\tvariant={variant}\n\t\t\t\t\tstate={state}\n\t\t\t\t\twidth={props.width}\n\t\t\t\t\tisActive={state === 'active' \|\| isActive}\n\t\t\t\t\tisInvalid={isInvalid}\n\t\t\t\t\tstyle={stylesFromOutside?.InputWrapper ?? inputWrapperStyles ?? {}}\n\t\t\t\t\tversion={version}\n\t\t\t\t\theight={props.height}\n\t\t\t\t\thightlightInputColor={hightlightInputColor}\n\t\t\t\t\thideBorder={hideBorder}\n\t\t\t\t>\n\t\t\t\t\t{!!LeftIcon && (\n\t\t\t\t\t\t<SC.IconHolder\n\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\t\t\tonClick={() => executeCallback(leftIcon?.callback)}\n\t\t\t\t\t\t\tisLeft={true}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t...(stylesFromOutside?.IconHolder ?? {}),\n\t\t\t\t\t\t\t\t...leftIconStyle,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<LeftIcon />\n\t\t\t\t\t\t</SC.IconHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{!!prefixText && (\n\t\t\t\t\t\t<PrefixHolder variant={variant}>{prefixText}</PrefixHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'default' && (\n\t\t\t\t\t\t<SC.InputContainer\n\t\t\t\t\t\t\theight={props.height}\n\t\t\t\t\t\t\ttype={props.type}\n\t\t\t\t\t\t\tminHeight={minHeight}\n\t\t\t\t\t\t\tmaxHeight={maxHeight}\n\t\t\t\t\t\t\tautoGrow={autoGrow}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{getInputHTML()}\n\t\t\t\t\t\t</SC.InputContainer>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'small' && (\n\t\t\t\t\t\t<SC.InputContainerSmall height={props.height} type={props.type}>\n\t\t\t\t\t\t\t{getInputHTML()}\n\t\t\t\t\t\t</SC.InputContainerSmall>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'x-small' && (\n\t\t\t\t\t\t<SC.InputContainerXSmall height={props.height} type={props.type}>\n\t\t\t\t\t\t\t{getInputHTML()}\n\t\t\t\t\t\t</SC.InputContainerXSmall>\n\t\t\t\t\t)}\n\t\t\t\t\t{!!RightIcon && (\n\t\t\t\t\t\t<SC.IconHolder\n\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\t\t\tonClick={() => executeCallback(rightIcon?.callback)}\n\t\t\t\t\t\t\tisLeft={false}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<RightIcon />\n\t\t\t\t\t\t</SC.IconHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{!!suffixText && (\n\t\t\t\t\t\t<SuffixHolder variant={variant}>{suffixText}</SuffixHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{button && button.text && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tbuttonText={button.text}\n\t\t\t\t\t\t\tbuttonType={button.buttonType}\n\t\t\t\t\t\t\tonClick={() => executeCallback(button?.onClick)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{button && button.buttonProps && <Button {...button.buttonProps} />}\n\t\t\t\t</SC.InputWrapper>\n\t\t\t\t{!hideInputHeader && (!!labelText \|\| !!maxCharLimit) && (\n\t\t\t\t\t<SC.InputHeader\n\t\t\t\t\t\tinvalid={isInvalid}\n\t\t\t\t\t\tmaxCharAlignment={maxCharAlignment}\n\t\t\t\t\t>\n\t\t\t\t\t\t{labelElement && labelElement}\n\t\t\t\t\t\t<div className=\"label__container\">\n\t\t\t\t\t\t\t{labelTextBold ? (\n\t\t\t\t\t\t\t\t<TitleSmall>\n\t\t\t\t\t\t\t\t\t{labelText}\n\t\t\t\t\t\t\t\t\t{isRequired ? <span></span> : ''}\n\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<BodySecondary>\n\t\t\t\t\t\t\t\t\t{labelText}\n\t\t\t\t\t\t\t\t\t{isRequired ? <span></span> : ''}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.tooltipText && (\n\t\t\t\t\t\t\t\t<Tooltip body={props.tooltipText} placement={'top'}>\n\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ marginTop: -3 }}\n\t\t\t\t\t\t\t\t\t\t\twidth={18}\n\t\t\t\t\t\t\t\t\t\t\theight={18}\n\t\t\t\t\t\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\t\t\t\t\t\tisInvalid\n\t\t\t\t\t\t\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t\t\t\t\t\t\t: COLORS.content.primary\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{maxCharLimit > 0 && maxCharLimitPosition === 'TOP' && (\n\t\t\t\t\t\t\t<SC.MaxCharStyle style={maxCharStyle}>\n\t\t\t\t\t\t\t\t{(value ?? '').toString()?.length ?? 0}/{maxCharLimit}\n\t\t\t\t\t\t\t</SC.MaxCharStyle>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</SC.InputHeader>\n\t\t\t\t)}\n\t\t\t</SC.RootContainer>\n\t\t);\n\t},\n);\n\nInput.displayName = 'Input';\n"],"names":["Input","forwardRef","props","fRef","placeholder","leftIcon","rightIcon","labelText","maxCharLimit","isRequired","hintText","type","state","validate","variant","button","suffixText","prefixText","onChangeText","value","noErrorHint","reset","rangeValidation","noKeyDownChange","version","noMaxCharCheck","labelElement","autoGrow","minHeight","maxHeight","labelTextBold","truncateText","maxCharLimitPosition","maxCharStyle","hightlightInputColor","onKeyDownEvent","hideInputHeader","hideBorder","inputWrapperStyles","minCharsToTrigger","maxCharAlignment","isDisabled","allowUnsafeInput","leftIconStyle","LeftIcon","RightIcon","isInvalid","setIsInvalid","useState","isActive","setIsActive","errorMessage","setErrorMessage","iconSize","stylesFromOutside","useContext","InputStyleContext","inputValue","setInputValue","_ref","useRef","inputRef","useEffect","numberInput","onWheel","executeCallback","cb","params","isFunction","getMaxChar","onKeyDown","e","MAX_CHAR_LIMIT","KEY_CODES_TO_BE_EXCLUDED","MIN_CHAR_LIMIT","inputText","event","onChange","shouldSanitizeForType","sanitizeUnsafeInput","validateFunction","validateInput","isValid","error","onFocus","onBlur","getInputHTML","jsxs","Fragment","jsx","SC.RootContainer","SC.InputFooter","ErrorIcon","SC.MaxCharStyle","SC.InputWrapper","SC.IconHolder","PrefixHolder","SC.InputContainer","SC.InputContainerSmall","SC.InputContainerXSmall","SuffixHolder","Button","SC.InputHeader","TitleSmall","BodySecondary","Tooltip","InfoIcon","COLORS"],"mappings":"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"}
1	+ {"version":3,"file":"Input.js","sources":["../../../../src/components/input/Input.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport React, {\n\tforwardRef,\n\tMutableRefObject,\n\tRef,\n\tuseContext,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport { Button } from '@src/components/button';\nimport {\n\tisFunction,\n\tsanitizeUnsafeInput,\n\tshouldSanitizeForType,\n\tvalidateInput,\n} from '@src/components/input/Input-helper';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport ErrorIcon from '../../assets/icons/errorInfo.svg';\nimport { InputStyleContext } from './context/InputStyleProvider';\nimport { InputProps, InputTypeI, InputVariant } from './Input.model';\nimport * as SC from './Input.styled';\nimport { PrefixHolder, SuffixHolder } from './Input.styled';\n\nexport const Input = forwardRef(\n\t(\n\t\tprops: InputProps,\n\t\tfRef: React.ForwardedRef<HTMLInputElement \| HTMLTextAreaElement \| null>,\n\t) => {\n\t\tconst {\n\t\t\tplaceholder,\n\t\t\tleftIcon,\n\t\t\trightIcon,\n\t\t\tlabelText,\n\t\t\tmaxCharLimit,\n\t\t\tisRequired,\n\t\t\thintText,\n\t\t\ttype,\n\t\t\tstate,\n\t\t\tvalidate,\n\t\t\tvariant,\n\t\t\tbutton,\n\t\t\tsuffixText,\n\t\t\tprefixText,\n\t\t\tonChangeText,\n\t\t\tvalue,\n\t\t\tnoErrorHint,\n\t\t\treset,\n\t\t\trangeValidation,\n\t\t\tnoKeyDownChange,\n\t\t\tversion,\n\t\t\tnoMaxCharCheck,\n\t\t\tlabelElement,\n\t\t\tautoGrow,\n\t\t\tminHeight,\n\t\t\tmaxHeight,\n\t\t\tlabelTextBold,\n\t\t\ttruncateText,\n\t\t\tmaxCharLimitPosition,\n\t\t\tmaxCharStyle,\n\t\t\thightlightInputColor,\n\t\t\tonKeyDownEvent,\n\t\t\thideInputHeader,\n\t\t\thideBorder,\n\t\t\tinputWrapperStyles,\n\t\t\tminCharsToTrigger,\n\t\t\tmaxCharAlignment,\n\t\t\tisDisabled = false,\n\t\t\tsolidDisabled = false,\n\t\t\tallowUnsafeInput,\n\t\t\tleftIconStyle,\n\t\t} = {\n\t\t\tmaxCharLimit: 0,\n\t\t\ttype: 'text' as InputTypeI,\n\t\t\tvariant: 'default' as InputVariant,\n\t\t\tmaxCharLimitPosition: 'TOP',\n\t\t\tminCharsToTrigger: 0,\n\t\t\tmaxCharAlignment: false,\n\t\t\t...props,\n\t\t};\n\t\tconst LeftIcon = leftIcon?.icon;\n\t\tconst RightIcon = rightIcon?.icon;\n\t\tconst [isInvalid, setIsInvalid] = useState<boolean>(false);\n\t\tconst [isActive, setIsActive] = useState<boolean>(false);\n\t\tconst [errorMessage, setErrorMessage] = useState<string>();\n\t\tconst iconSize =\n\t\t\tvariant === 'x-small' ? '12px' : variant === 'small' ? '18px' : '22px';\n\t\tconst stylesFromOutside = useContext(InputStyleContext);\n\t\tconst [inputValue, setInputValue] = useState<string>('');\n\t\tconst _ref = useRef<HTMLInputElement \| HTMLTextAreaElement>(null);\n\t\tconst inputRef: MutableRefObject<HTMLInputElement \| HTMLTextAreaElement> =\n\t\t\t(fRef ?? _ref) as MutableRefObject<\n\t\t\t\tHTMLInputElement \| HTMLTextAreaElement\n\t\t\t>;\n\n\t\tuseEffect(() => {\n\t\t\tsetInputValue(value \|\| '');\n\t\t\tif (!value && autoGrow) {\n\t\t\t\tinputRef.current.style.height = minHeight \|\| '48px';\n\t\t\t}\n\t\t}, [value]);\n\n\t\tuseEffect(() => {\n\t\t\tif (!inputRef.current) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tprops.onReferenceInit?.(inputRef.current);\n\t\t}, [inputRef]);\n\n\t\tuseEffect(() => {\n\t\t\tconst numberInput = inputRef.current;\n\t\t\tif (numberInput && ['phonenumber', 'zip', 'number'].includes(type)) {\n\t\t\t\tnumberInput.addEventListener('wheel', onWheel, { passive: false });\n\n\t\t\t\treturn () => {\n\t\t\t\t\tnumberInput.removeEventListener('wheel', onWheel);\n\t\t\t\t};\n\t\t\t}\n\t\t}, []);\n\n\t\tuseEffect(() => {\n\t\t\tif (!reset) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetInputValue('');\n\t\t}, [reset]);\n\n\t\tuseEffect(() => {\n\t\t\tsetIsActive(!!props.isActive);\n\t\t\tif (props.isActive) {\n\t\t\t\tinputRef.current?.focus();\n\t\t\t}\n\t\t}, [props.isActive]);\n\n\t\tuseEffect(() => {\n\t\t\tsetErrorMessage(props.errorMessage);\n\t\t}, [props.errorMessage]);\n\n\t\tuseEffect(() => {\n\t\t\tsetIsInvalid(false);\n\t\t\tif (\n\t\t\t\tprops.state === 'invalid' \|\|\n\t\t\t\terrorMessage \|\|\n\t\t\t\tprops.state === 'disabled-invalid'\n\t\t\t) {\n\t\t\t\tsetIsInvalid(true);\n\t\t\t}\n\t\t\tif (props.state === 'active') {\n\t\t\t\tinputRef.current?.focus();\n\t\t\t}\n\t\t}, [props.state, errorMessage]);\n\n\t\tuseEffect(() => {\n\t\t\tsetIsInvalid(!!errorMessage \|\| props.state === 'invalid');\n\t\t}, [errorMessage, props.state]);\n\n\t\tconst executeCallback = (cb: any, ...params: any[]): void => {\n\t\t\tif (!isFunction(cb)) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tcb(...params);\n\t\t};\n\n\t\tconst getMaxChar = () => {\n\t\t\tif (type === 'zip') {\n\t\t\t\treturn 6;\n\t\t\t}\n\t\t\treturn 2000;\n\t\t};\n\n\t\tconst onKeyDown = (e) => {\n\t\t\tconst MAX_CHAR_LIMIT = maxCharLimit !== 0 ? maxCharLimit : getMaxChar();\n\t\t\tconst KEY_CODES_TO_BE_EXCLUDED = [8];\n\t\t\tconst MIN_CHAR_LIMIT = minCharsToTrigger;\n\t\t\tconst inputText = e.target.value;\n\t\t\tif (\n\t\t\t\tonKeyDownEvent &&\n\t\t\t\t(!inputText.length \|\| inputText.length >= MIN_CHAR_LIMIT)\n\t\t\t) {\n\t\t\t\tonKeyDownEvent(e);\n\t\t\t}\n\n\t\t\tif (\n\t\t\t\t!noKeyDownChange &&\n\t\t\t\t(!inputText.length \|\| inputText.length >= MIN_CHAR_LIMIT)\n\t\t\t) {\n\t\t\t\tonChangeText(value \|\| '', e);\n\t\t\t}\n\t\t\tif (noMaxCharCheck) return;\n\n\t\t\tif (\n\t\t\t\t!KEY_CODES_TO_BE_EXCLUDED.includes(e.which) &&\n\t\t\t\tMAX_CHAR_LIMIT > 0 &&\n\t\t\t\tinputText.length >= MAX_CHAR_LIMIT\n\t\t\t) {\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t};\n\n\t\tconst onWheel = (event) => {\n\t\t\tevent.preventDefault(); // Prevent the default scroll behavior\n\t\t};\n\n\t\tconst onChange = (e) => {\n\t\t\tlet inputText = e.target.value;\n\t\t\tconst MAX_CHAR_LIMIT =\n\t\t\t\tmaxCharLimit !== 0 ? maxCharLimit + 1 : getMaxChar();\n\t\t\tconst MIN_CHAR_LIMIT = minCharsToTrigger;\n\n\t\t\tif (!allowUnsafeInput && shouldSanitizeForType(type)) {\n\t\t\t\tinputText = sanitizeUnsafeInput(inputText);\n\t\t\t}\n\n\t\t\tif (\n\t\t\t\t!noMaxCharCheck &&\n\t\t\t\tMAX_CHAR_LIMIT > 0 &&\n\t\t\t\tinputText.length >= MAX_CHAR_LIMIT\n\t\t\t) {\n\t\t\t\t// letting user to copy paste text upto max limit instead of blank action\n\t\t\t\tinputText = inputText.substring(0, MAX_CHAR_LIMIT - 1);\n\t\t\t}\n\n\t\t\tif (!props.textControl) {\n\t\t\t\tsetInputValue(inputText \|\| '');\n\t\t\t}\n\t\t\tif (MIN_CHAR_LIMIT && inputText && inputText.length < MIN_CHAR_LIMIT) {\n\t\t\t\t// if minCharsToTrigger exists and is not reached, do nothing\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonChangeText(inputText, e);\n\t\t\tif (autoGrow) {\n\t\t\t\tinputRef.current.style.height = `${inputRef.current.scrollHeight}px`;\n\t\t\t\tif (!inputText) {\n\t\t\t\t\tinputRef.current.style.height = minHeight \|\| '48px';\n\t\t\t\t}\n\t\t\t}\n\t\t\tconst validateFunction = validate \|\| validateInput;\n\t\t\tif (!validateFunction \|\| !isFunction(validateFunction)) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst [isValid, error] = validateFunction(\n\t\t\t\tinputText,\n\t\t\t\ttype,\n\t\t\t\trangeValidation,\n\t\t\t);\n\n\t\t\tsetIsInvalid(!isValid);\n\t\t\tsetErrorMessage(props.errorMessage ? props.errorMessage : error);\n\t\t};\n\n\t\tconst onFocus = (e) => {\n\t\t\tif (!props.skipFocus) {\n\t\t\t\tsetIsActive(true);\n\t\t\t}\n\t\t\texecuteCallback(props.onFocus?.(e));\n\t\t};\n\n\t\tconst onBlur = (e) => {\n\t\t\tif (!props.skipFocus) {\n\t\t\t\tsetIsActive(false);\n\t\t\t}\n\t\t\texecuteCallback(props.onBlur?.(e));\n\t\t};\n\n\t\tconst getInputHTML = () => {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{type !== 'multiline' && (\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tclassName={truncateText ? 'truncate-class' : ''}\n\t\t\t\t\t\t\tdata-test={props['data-test']}\n\t\t\t\t\t\t\tid={props.id}\n\t\t\t\t\t\t\tstyle={stylesFromOutside?.input ?? {}}\n\t\t\t\t\t\t\tref={inputRef as Ref<HTMLInputElement>}\n\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\ttype={\n\t\t\t\t\t\t\t\t['phonenumber', 'zip', 'number'].includes(type)\n\t\t\t\t\t\t\t\t\t? 'number'\n\t\t\t\t\t\t\t\t\t: type\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\t\t\tonFocus={(e) => onFocus(e)}\n\t\t\t\t\t\t\tonBlur={(e) => onBlur(e)}\n\t\t\t\t\t\t\tplaceholder={placeholder \|\| 'Enter here'}\n\t\t\t\t\t\t\tonChange={onChange}\n\t\t\t\t\t\t\tonClick={(e) => executeCallback(props.onClick)}\n\t\t\t\t\t\t\tonKeyDown={(e) => onKeyDown(e)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{type === 'multiline' && (\n\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\tdata-test={props['data-test']}\n\t\t\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\t\t\tref={inputRef as Ref<HTMLTextAreaElement>}\n\t\t\t\t\t\t\tonFocus={(e) => onFocus(e)}\n\t\t\t\t\t\t\tonBlur={(e) => onBlur(e)}\n\t\t\t\t\t\t\tonClick={(e) => executeCallback(props.onClick)}\n\t\t\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\t\t\tplaceholder={placeholder \|\| 'Enter here'}\n\t\t\t\t\t\t\tonChange={onChange}\n\t\t\t\t\t\t\tonKeyDown={(e) => onKeyDown(e)}\n\t\t\t\t\t\t\tmaxLength={maxCharLimit > 0 ? maxCharLimit : undefined}\n\t\t\t\t\t\t/>\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<SC.RootContainer\n\t\t\t\twidth={props.width}\n\t\t\t\theight={props.height}\n\t\t\t\tstate={state}\n\t\t\t\tsolidDisabled={solidDisabled}\n\t\t\t\ttype={type}\n\t\t\t\tstyle={stylesFromOutside?.RootContainer ?? {}}\n\t\t\t>\n\t\t\t\t<div className=\"flex-align-center\">\n\t\t\t\t\t{!noErrorHint && (!!hintText \|\| !!errorMessage) && (\n\t\t\t\t\t\t<SC.InputFooter invalid={!!errorMessage}>\n\t\t\t\t\t\t\t{!!errorMessage && <ErrorIcon width={16} height={16} />}\n\t\t\t\t\t\t\t{errorMessage \|\| hintText}\n\t\t\t\t\t\t</SC.InputFooter>\n\t\t\t\t\t)}\n\t\t\t\t\t{maxCharLimit > 0 && maxCharLimitPosition === 'BOTTOM' && (\n\t\t\t\t\t\t<SC.MaxCharStyle position={'BOTTOM'} style={maxCharStyle}>\n\t\t\t\t\t\t\t{(value ?? '').toString()?.length ?? 0}/{maxCharLimit}\n\t\t\t\t\t\t</SC.MaxCharStyle>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<SC.InputWrapper\n\t\t\t\t\tvariant={variant}\n\t\t\t\t\tstate={state}\n\t\t\t\t\tsolidDisabled={solidDisabled}\n\t\t\t\t\twidth={props.width}\n\t\t\t\t\tisActive={state === 'active' \|\| isActive}\n\t\t\t\t\tisInvalid={isInvalid}\n\t\t\t\t\tstyle={stylesFromOutside?.InputWrapper ?? inputWrapperStyles ?? {}}\n\t\t\t\t\tversion={version}\n\t\t\t\t\theight={props.height}\n\t\t\t\t\thightlightInputColor={hightlightInputColor}\n\t\t\t\t\thideBorder={hideBorder}\n\t\t\t\t>\n\t\t\t\t\t{!!LeftIcon && (\n\t\t\t\t\t\t<SC.IconHolder\n\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\t\t\tonClick={() => executeCallback(leftIcon?.callback)}\n\t\t\t\t\t\t\tisLeft={true}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t...(stylesFromOutside?.IconHolder ?? {}),\n\t\t\t\t\t\t\t\t...leftIconStyle,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<LeftIcon />\n\t\t\t\t\t\t</SC.IconHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{!!prefixText && (\n\t\t\t\t\t\t<PrefixHolder variant={variant}>{prefixText}</PrefixHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'default' && (\n\t\t\t\t\t\t<SC.InputContainer\n\t\t\t\t\t\t\theight={props.height}\n\t\t\t\t\t\t\ttype={props.type}\n\t\t\t\t\t\t\tminHeight={minHeight}\n\t\t\t\t\t\t\tmaxHeight={maxHeight}\n\t\t\t\t\t\t\tautoGrow={autoGrow}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{getInputHTML()}\n\t\t\t\t\t\t</SC.InputContainer>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'small' && (\n\t\t\t\t\t\t<SC.InputContainerSmall height={props.height} type={props.type}>\n\t\t\t\t\t\t\t{getInputHTML()}\n\t\t\t\t\t\t</SC.InputContainerSmall>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'x-small' && (\n\t\t\t\t\t\t<SC.InputContainerXSmall height={props.height} type={props.type}>\n\t\t\t\t\t\t\t{getInputHTML()}\n\t\t\t\t\t\t</SC.InputContainerXSmall>\n\t\t\t\t\t)}\n\t\t\t\t\t{!!RightIcon && (\n\t\t\t\t\t\t<SC.IconHolder\n\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\t\t\tonClick={() => executeCallback(rightIcon?.callback)}\n\t\t\t\t\t\t\tisLeft={false}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<RightIcon />\n\t\t\t\t\t\t</SC.IconHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{!!suffixText && (\n\t\t\t\t\t\t<SuffixHolder variant={variant}>{suffixText}</SuffixHolder>\n\t\t\t\t\t)}\n\t\t\t\t\t{button && button.text && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tbuttonText={button.text}\n\t\t\t\t\t\t\tbuttonType={button.buttonType}\n\t\t\t\t\t\t\tonClick={() => executeCallback(button?.onClick)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{button && button.buttonProps && <Button {...button.buttonProps} />}\n\t\t\t\t</SC.InputWrapper>\n\t\t\t\t{!hideInputHeader && (!!labelText \|\| !!maxCharLimit) && (\n\t\t\t\t\t<SC.InputHeader\n\t\t\t\t\t\tinvalid={isInvalid}\n\t\t\t\t\t\tmaxCharAlignment={maxCharAlignment}\n\t\t\t\t\t>\n\t\t\t\t\t\t{labelElement && labelElement}\n\t\t\t\t\t\t<div className=\"label__container\">\n\t\t\t\t\t\t\t{labelTextBold ? (\n\t\t\t\t\t\t\t\t<TitleSmall>\n\t\t\t\t\t\t\t\t\t{labelText}\n\t\t\t\t\t\t\t\t\t{isRequired ? <span></span> : ''}\n\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<BodySecondary>\n\t\t\t\t\t\t\t\t\t{labelText}\n\t\t\t\t\t\t\t\t\t{isRequired ? <span></span> : ''}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{props.tooltipText && (\n\t\t\t\t\t\t\t\t<Tooltip body={props.tooltipText} placement={'top'}>\n\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ marginTop: -3 }}\n\t\t\t\t\t\t\t\t\t\t\twidth={18}\n\t\t\t\t\t\t\t\t\t\t\theight={18}\n\t\t\t\t\t\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\t\t\t\t\t\tisInvalid\n\t\t\t\t\t\t\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t\t\t\t\t\t\t: COLORS.content.primary\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{maxCharLimit > 0 && maxCharLimitPosition === 'TOP' && (\n\t\t\t\t\t\t\t<SC.MaxCharStyle style={maxCharStyle}>\n\t\t\t\t\t\t\t\t{(value ?? '').toString()?.length ?? 0}/{maxCharLimit}\n\t\t\t\t\t\t\t</SC.MaxCharStyle>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</SC.InputHeader>\n\t\t\t\t)}\n\t\t\t</SC.RootContainer>\n\t\t);\n\t},\n);\n\nInput.displayName = 'Input';\n"],"names":["Input","forwardRef","props","fRef","placeholder","leftIcon","rightIcon","labelText","maxCharLimit","isRequired","hintText","type","state","validate","variant","button","suffixText","prefixText","onChangeText","value","noErrorHint","reset","rangeValidation","noKeyDownChange","version","noMaxCharCheck","labelElement","autoGrow","minHeight","maxHeight","labelTextBold","truncateText","maxCharLimitPosition","maxCharStyle","hightlightInputColor","onKeyDownEvent","hideInputHeader","hideBorder","inputWrapperStyles","minCharsToTrigger","maxCharAlignment","isDisabled","solidDisabled","allowUnsafeInput","leftIconStyle","LeftIcon","RightIcon","isInvalid","setIsInvalid","useState","isActive","setIsActive","errorMessage","setErrorMessage","iconSize","stylesFromOutside","useContext","InputStyleContext","inputValue","setInputValue","_ref","useRef","inputRef","useEffect","numberInput","onWheel","executeCallback","cb","params","isFunction","getMaxChar","onKeyDown","e","MAX_CHAR_LIMIT","KEY_CODES_TO_BE_EXCLUDED","MIN_CHAR_LIMIT","inputText","event","onChange","shouldSanitizeForType","sanitizeUnsafeInput","validateFunction","validateInput","isValid","error","onFocus","onBlur","getInputHTML","jsxs","Fragment","jsx","SC.RootContainer","SC.InputFooter","ErrorIcon","SC.MaxCharStyle","SC.InputWrapper","SC.IconHolder","PrefixHolder","SC.InputContainer","SC.InputContainerSmall","SC.InputContainerXSmall","SuffixHolder","Button","SC.InputHeader","TitleSmall","BodySecondary","Tooltip","InfoIcon","COLORS"],"mappings":"qeA0BaA,GAAQC,EAAAA,WACpB,CACCC,EACAC,KACI,CACJ,KAAM,CACL,YAAAC,EACA,SAAAC,EACA,UAAAC,EACA,UAAAC,EACA,aAAAC,EACA,WAAAC,EACA,SAAAC,EACA,KAAAC,EACA,MAAAC,EACA,SAAAC,GACA,QAAAC,EACA,OAAAC,EACA,WAAAC,EACA,WAAAC,EACA,aAAAC,EACA,MAAAC,EACA,YAAAC,GACA,MAAAC,EACA,gBAAAC,GACA,gBAAAC,GACA,QAAAC,GACA,eAAAC,EACA,aAAAC,EACA,SAAAC,EACA,UAAAC,EACA,UAAAC,GACA,cAAAC,GACA,aAAAC,GACA,qBAAAC,EACA,aAAAC,EACA,qBAAAC,GACA,eAAAC,EACA,gBAAAC,GACA,WAAAC,GACA,mBAAAC,GACA,kBAAAC,EACA,iBAAAC,GACA,WAAAC,EAAa,GACb,cAAAC,EAAgB,GAChB,iBAAAC,GACA,cAAAC,EAAA,EACG,CACH,aAAc,EACd,KAAM,OACN,QAAS,UACT,qBAAsB,MACtB,kBAAmB,EACnB,iBAAkB,GAClB,GAAG1C,CAAA,EAEE2C,EAAWxC,GAAU,KACrByC,EAAYxC,GAAW,KACvB,CAACyC,EAAWC,CAAY,EAAIC,EAAAA,SAAkB,EAAK,EACnD,CAACC,GAAUC,CAAW,EAAIF,EAAAA,SAAkB,EAAK,EACjD,CAACG,EAAcC,CAAe,EAAIJ,WAAA,EAClCK,EACLxC,IAAY,UAAY,OAASA,IAAY,QAAU,OAAS,OAC3DyC,EAAoBC,EAAAA,WAAWC,oBAAiB,EAChD,CAACC,EAAYC,CAAa,EAAIV,EAAAA,SAAiB,EAAE,EACjDW,GAAOC,EAAAA,OAA+C,IAAI,EAC1DC,EACJ3D,IAAQyD,GAIVG,EAAAA,UAAU,IAAM,CACfJ,EAAcxC,GAAS,EAAE,EACrB,CAACA,GAASQ,IACbmC,EAAS,QAAQ,MAAM,OAASlC,GAAa,OAE/C,EAAG,CAACT,CAAK,CAAC,EAEV4C,EAAAA,UAAU,IAAM,CACVD,EAAS,SAGd5D,EAAM,kBAAkB4D,EAAS,OAAO,CACzC,EAAG,CAACA,CAAQ,CAAC,EAEbC,EAAAA,UAAU,IAAM,CACf,MAAMC,EAAcF,EAAS,QAC7B,GAAIE,GAAe,CAAC,cAAe,MAAO,QAAQ,EAAE,SAASrD,CAAI,EAChE,OAAAqD,EAAY,iBAAiB,QAASC,EAAS,CAAE,QAAS,GAAO,EAE1D,IAAM,CACZD,EAAY,oBAAoB,QAASC,CAAO,CACjD,CAEF,EAAG,CAAA,CAAE,EAELF,EAAAA,UAAU,IAAM,CACV1C,GAGLsC,EAAc,EAAE,CACjB,EAAG,CAACtC,CAAK,CAAC,EAEV0C,EAAAA,UAAU,IAAM,CACfZ,EAAY,CAAC,CAACjD,EAAM,QAAQ,EACxBA,EAAM,UACT4D,EAAS,SAAS,MAAA,CAEpB,EAAG,CAAC5D,EAAM,QAAQ,CAAC,EAEnB6D,EAAAA,UAAU,IAAM,CACfV,EAAgBnD,EAAM,YAAY,CACnC,EAAG,CAACA,EAAM,YAAY,CAAC,EAEvB6D,EAAAA,UAAU,IAAM,CACff,EAAa,EAAK,GAEjB9C,EAAM,QAAU,WAChBkD,GACAlD,EAAM,QAAU,qBAEhB8C,EAAa,EAAI,EAEd9C,EAAM,QAAU,UACnB4D,EAAS,SAAS,MAAA,CAEpB,EAAG,CAAC5D,EAAM,MAAOkD,CAAY,CAAC,EAE9BW,EAAAA,UAAU,IAAM,CACff,EAAa,CAAC,CAACI,GAAgBlD,EAAM,QAAU,SAAS,CACzD,EAAG,CAACkD,EAAclD,EAAM,KAAK,CAAC,EAE9B,MAAMgE,EAAkB,CAACC,KAAYC,IAAwB,CACvDC,EAAAA,WAAWF,CAAE,GAGlBA,EAAG,GAAGC,CAAM,CACb,EAEME,EAAa,IACd3D,IAAS,MACL,EAED,IAGF4D,EAAaC,GAAM,CACxB,MAAMC,EAAiBjE,IAAiB,EAAIA,EAAe8D,EAAA,EACrDI,EAA2B,CAAC,CAAC,EAC7BC,EAAiBpC,EACjBqC,EAAYJ,EAAE,OAAO,MAE1BrC,IACC,CAACyC,EAAU,QAAUA,EAAU,QAAUD,IAE1CxC,EAAeqC,CAAC,EAIhB,CAACjD,KACA,CAACqD,EAAU,QAAUA,EAAU,QAAUD,IAE1CzD,EAAaC,GAAS,GAAIqD,CAAC,EAExB,CAAA/C,GAGH,CAACiD,EAAyB,SAASF,EAAE,KAAK,GAC1CC,EAAiB,GACjBG,EAAU,QAAUH,GAEpBD,EAAE,eAAA,CAEJ,EAEMP,EAAWY,GAAU,CAC1BA,EAAM,eAAA,CACP,EAEMC,EAAYN,GAAM,CACvB,IAAII,EAAYJ,EAAE,OAAO,MACzB,MAAMC,EACLjE,IAAiB,EAAIA,EAAe,EAAI8D,EAAA,EACnCK,EAAiBpC,EAkBvB,GAhBI,CAACI,IAAoBoC,wBAAsBpE,CAAI,IAClDiE,EAAYI,EAAAA,oBAAoBJ,CAAS,GAIzC,CAACnD,GACDgD,EAAiB,GACjBG,EAAU,QAAUH,IAGpBG,EAAYA,EAAU,UAAU,EAAGH,EAAiB,CAAC,GAGjDvE,EAAM,aACVyD,EAAciB,GAAa,EAAE,EAE1BD,GAAkBC,GAAaA,EAAU,OAASD,EAErD,OAGDzD,EAAa0D,EAAWJ,CAAC,EACrB7C,IACHmC,EAAS,QAAQ,MAAM,OAAS,GAAGA,EAAS,QAAQ,YAAY,KAC3Dc,IACJd,EAAS,QAAQ,MAAM,OAASlC,GAAa,SAG/C,MAAMqD,EAAmBpE,IAAYqE,EAAAA,cACrC,GAAI,CAACD,GAAoB,CAACZ,EAAAA,WAAWY,CAAgB,EACpD,OAED,KAAM,CAACE,GAASC,EAAK,EAAIH,EACxBL,EACAjE,EACAW,EAAA,EAGD0B,EAAa,CAACmC,EAAO,EACrB9B,EAAgBnD,EAAM,aAAeA,EAAM,aAAekF,EAAK,CAChE,EAEMC,GAAWb,GAAM,CACjBtE,EAAM,WACViD,EAAY,EAAI,EAEjBe,EAAgBhE,EAAM,UAAUsE,CAAC,CAAC,CACnC,EAEMc,GAAUd,GAAM,CAChBtE,EAAM,WACViD,EAAY,EAAK,EAElBe,EAAgBhE,EAAM,SAASsE,CAAC,CAAC,CAClC,EAEMe,EAAe,IAEnBC,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAA9E,IAAS,aACT+E,EAAAA,IAAC,QAAA,CACA,UAAW3D,GAAe,iBAAmB,GAC7C,YAAW7B,EAAM,WAAW,EAC5B,GAAIA,EAAM,GACV,MAAOqD,GAAmB,OAAS,CAAA,EACnC,IAAKO,EACL,SAAUrB,EACV,KACC,CAAC,cAAe,MAAO,QAAQ,EAAE,SAAS9B,CAAI,EAC3C,SACAA,EAEJ,MAAO+C,EACP,QAAUc,GAAMa,GAAQb,CAAC,EACzB,OAASA,GAAMc,GAAOd,CAAC,EACvB,YAAapE,GAAe,aAC5B,SAAA0E,EACA,QAAUN,GAAMN,EAAgBhE,EAAM,OAAO,EAC7C,UAAYsE,GAAMD,EAAUC,CAAC,CAAA,CAAA,EAG9B7D,IAAS,aACT+E,EAAAA,IAAC,WAAA,CACA,YAAWxF,EAAM,WAAW,EAC5B,MAAOwD,EACP,IAAKI,EACL,QAAUU,GAAMa,GAAQb,CAAC,EACzB,OAASA,GAAMc,GAAOd,CAAC,EACvB,QAAUA,GAAMN,EAAgBhE,EAAM,OAAO,EAC7C,SAAUuC,EACV,YAAarC,GAAe,aAC5B,SAAA0E,EACA,UAAYN,GAAMD,EAAUC,CAAC,EAC7B,UAAWhE,EAAe,EAAIA,EAAe,MAAA,CAAA,CAC9C,EAEF,EAIF,OACCgF,EAAAA,KAACG,EAAAA,cAAA,CACA,MAAOzF,EAAM,MACb,OAAQA,EAAM,OACd,MAAAU,EACA,cAAA8B,EACA,KAAA/B,EACA,MAAO4C,GAAmB,eAAiB,CAAA,EAE3C,SAAA,CAAAiC,EAAAA,KAAC,MAAA,CAAI,UAAU,oBACb,SAAA,CAAA,CAACpE,KAAgB,CAAC,CAACV,GAAY,CAAC,CAAC0C,IACjCoC,OAACI,EAAAA,YAAA,CAAe,QAAS,CAAC,CAACxC,EACzB,SAAA,CAAA,CAAC,CAACA,GAAgBsC,EAAAA,IAACG,GAAAA,SAAU,MAAO,GAAI,OAAQ,GAAI,EACpDzC,GAAgB1C,CAAA,EAClB,EAEAF,EAAe,GAAKwB,IAAyB,UAC7CwD,EAAAA,KAACM,EAAAA,aAAA,CAAgB,SAAU,SAAU,MAAO7D,EACzC,SAAA,EAAAd,GAAS,IAAI,SAAA,GAAY,QAAU,EAAE,IAAEX,CAAA,CAAA,CAC1C,CAAA,EAEF,EACAgF,EAAAA,KAACO,EAAAA,aAAA,CACA,QAAAjF,EACA,MAAAF,EACA,cAAA8B,EACA,MAAOxC,EAAM,MACb,SAAUU,IAAU,UAAYsC,GAChC,UAAAH,EACA,MAAOQ,GAAmB,cAAgBjB,IAAsB,CAAA,EAChE,QAAAd,GACA,OAAQtB,EAAM,OACd,qBAAAgC,GACA,WAAAG,GAEC,SAAA,CAAA,CAAC,CAACQ,GACF6C,EAAAA,IAACM,EAAAA,WAAA,CACA,QAAAlF,EACA,SAAAwC,EACA,QAAS,IAAMY,EAAgB7D,GAAU,QAAQ,EACjD,OAAQ,GACR,MAAO,CACN,GAAIkD,GAAmB,YAAc,CAAA,EACrC,GAAGX,EAAA,EAGJ,eAACC,EAAA,CAAA,CAAS,CAAA,CAAA,EAGX,CAAC,CAAC5B,GACFyE,MAACO,EAAAA,aAAA,CAAa,QAAAnF,EAAmB,SAAAG,EAAW,EAE5CH,IAAY,WACZ4E,EAAAA,IAACQ,EAAAA,eAAA,CACA,OAAQhG,EAAM,OACd,KAAMA,EAAM,KACZ,UAAA0B,EACA,UAAAC,GACA,SAAAF,EAEC,SAAA4D,EAAA,CAAa,CAAA,EAGfzE,IAAY,SACZ4E,EAAAA,IAACS,EAAAA,oBAAA,CAAuB,OAAQjG,EAAM,OAAQ,KAAMA,EAAM,KACxD,YAAa,CACf,EAEAY,IAAY,WACZ4E,EAAAA,IAACU,EAAAA,qBAAA,CAAwB,OAAQlG,EAAM,OAAQ,KAAMA,EAAM,KACzD,YAAa,CACf,EAEA,CAAC,CAAC4C,GACF4C,EAAAA,IAACM,EAAAA,WAAA,CACA,QAAAlF,EACA,SAAAwC,EACA,QAAS,IAAMY,EAAgB5D,GAAW,QAAQ,EAClD,OAAQ,GAER,eAACwC,EAAA,CAAA,CAAU,CAAA,CAAA,EAGZ,CAAC,CAAC9B,GACF0E,MAACW,EAAAA,aAAA,CAAa,QAAAvF,EAAmB,SAAAE,EAAW,EAE5CD,GAAUA,EAAO,MACjB2E,EAAAA,IAACY,GAAAA,OAAA,CACA,WAAYvF,EAAO,KACnB,WAAYA,EAAO,WACnB,QAAS,IAAMmD,EAAgBnD,GAAQ,OAAO,CAAA,CAAA,EAG/CA,GAAUA,EAAO,mBAAgBuF,GAAAA,OAAA,CAAQ,GAAGvF,EAAO,WAAA,CAAa,CAAA,CAAA,CAAA,EAEjE,CAACqB,KAAoB,CAAC,CAAC7B,GAAa,CAAC,CAACC,IACtCgF,EAAAA,KAACe,EAAAA,YAAA,CACA,QAASxD,EACT,iBAAAP,GAEC,SAAA,CAAAd,GAAgBA,EACjB8D,EAAAA,KAAC,MAAA,CAAI,UAAU,mBACb,SAAA,CAAA1D,UACC0E,cAAA,CACC,SAAA,CAAAjG,EACAE,EAAaiF,EAAAA,IAAC,OAAA,CAAK,SAAA,GAAA,CAAC,EAAU,EAAA,CAAA,CAChC,SAECe,GAAAA,cAAA,CACC,SAAA,CAAAlG,EACAE,EAAaiF,EAAAA,IAAC,OAAA,CAAK,SAAA,GAAA,CAAC,EAAU,EAAA,EAChC,EAEAxF,EAAM,aACNwF,EAAAA,IAACgB,GAAAA,QAAA,CAAQ,KAAMxG,EAAM,YAAa,UAAW,MAC5C,SAAAwF,EAAAA,IAAC,OAAA,CACA,SAAAA,EAAAA,IAACiB,GAAAA,QAAA,CACA,MAAO,CAAE,UAAW,EAAA,EACpB,MAAO,GACP,OAAQ,GACR,MACC5D,EACG6D,GAAAA,OAAO,QAAQ,SACfA,GAAAA,OAAO,QAAQ,OAAA,CAAA,EAGrB,CAAA,CACD,CAAA,EAEF,EACCpG,EAAe,GAAKwB,IAAyB,cAC5C8D,EAAAA,aAAA,CAAgB,MAAO7D,EACrB,SAAA,EAAAd,GAAS,IAAI,SAAA,GAAY,QAAU,EAAE,IAAEX,CAAA,CAAA,CAC1C,CAAA,CAAA,CAAA,CAEF,CAAA,CAAA,CAIJ,CACD,EAEAR,GAAM,YAAc"}

package/dist/cjs/components/input/Input.styled.js CHANGED Viewed

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),n=require("../TypographyStyle.js"),e=require("../../constants/Theme.js"),d=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},i=d(a),h=({isActive:t,isInvalid:r,hightlightInputColor:o})=>t?o||e.COLORS.stroke.brand:r?e.COLORS.stroke.negative.vibrant:e.COLORS.stroke.primary,s=t=>t.hideBorder?0:t.version==="2.0"?.5:1,x=i.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),n=require("../TypographyStyle.js"),e=require("../../constants/Theme.js"),d=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},i=d(a),s=({isActive:t,isInvalid:r,hightlightInputColor:o})=>t?o||e.COLORS.stroke.brand:r?e.COLORS.stroke.negative.vibrant:e.COLORS.stroke.primary,h=t=>t.hideBorder?0:t.version==="2.0"?.5:1,c=i.default.div`
 	border-radius: ${t=>t.version==="2.0"?8:4}px;
 	background: ${t=>["disabled","read-only","disabled-invalid"].includes(t.state)?e.COLORS.background.base:"#fff"};
-	border: ${t=>s(t)}px solid
-		${t=>h({isActive:t.isActive,isInvalid:t.isInvalid,hightlightInputColor:t.hightlightInputColor})};
+	border: ${t=>h(t)}px solid
+		${t=>s({isActive:t.isActive,isInvalid:t.isInvalid,hightlightInputColor:t.hightlightInputColor})};
 	${t=>t.isActive?`box-shadow: inset 0px 0px 0px 1px ${t.hightlightInputColor?t.hightlightInputColor:e.COLORS.stroke.brand};`:""};
 	padding: ${t=>t.variant==="small"?"6px":"8px"};
 	height: ${t=>t.height||"100%"};
@@ -13,9 +13,22 @@
 	gap: 8px;
 	overflow: hidden;
-	${t=>t.state==="read-only"?"opacity: 0.7":""};
+	${t=>t.state==="read-only"&&!t.solidDisabled?"opacity: 0.7":""};
 	${t=>t.state==="read-only"?"pointer-events: none":""};
-`,g=i.default.div`
+	${t=>t.solidDisabled&&["disabled","read-only","disabled-invalid"].includes(t.state)?a.css`
+					input,
+					textarea {
+						color: ${e.COLORS.content.secondary};
+						-webkit-text-fill-color: ${e.COLORS.content.secondary};
+						opacity: 1;
+						&::placeholder {
+							color: ${e.COLORS.content.secondary};
+							-webkit-text-fill-color: ${e.COLORS.content.secondary};
+							opacity: 1;
+						}
+					}
+			  `:""};
+`,x=i.default.div`
 	min-height: ${t=>t.iconSize};
 	min-width: ${t=>t.iconSize};
 	display: flex;
@@ -60,7 +73,7 @@
 		min-height: 100px;
 		resize: none;
 	}
-`,c=i.default(n.BodyPrimary)`
+`,g=i.default(n.BodyPrimary)`
 	${l};
 	${t=>t.height&&t.type!=="multiline"?{height:t.height}:{}};
@@ -82,7 +95,7 @@
 		}
 	}
 	${t=>t.height&&t.type!=="multiline"?{height:t.height}:{}};
-`,p=i.default(n.BodyCaption)`
+`,m=i.default(n.BodyCaption)`
 	${l};
 	input {
 		min-height: 16px;
@@ -93,7 +106,7 @@
 		}
 	}
 	${t=>t.height&&t.type!=="multiline"?{height:t.height}:{}};
-`,m=i.default.div`
+`,p=i.default.div`
 	display: flex;
 	justify-content: space-between;
 	${t=>t.maxCharAlignment?"align-items: flex-end;":""}
@@ -114,7 +127,7 @@
 `,f=i.default(n.BodySecondary)`
 	color: ${e.COLORS.content.secondary} !important;
 	margin-top: ${t=>t.position==="BOTTOM"?"8px":"0px"};
-`,v=i.default(n.BodyCaption)`
+`,y=i.default(n.BodyCaption)`
 	white-space: pre-wrap;
 	margin-top: 8px;
 	color: ${t=>t.invalid?e.COLORS.content.negative:e.COLORS.content.secondary} !important;
@@ -128,11 +141,11 @@
 		width: 16px;
 		height: 16px;
 	}
-`,y=i.default.div`
+`,v=i.default.div`
 	${t=>t.width?`width: ${t.width}`:""};
 	${t=>t.height&&t.type=="multiline"?`height: ${t.height}`:""};
 	${t=>t.state==="disabled"||t.state==="disabled-invalid"?a.css`
-					opacity: 0.5;
+					opacity: ${t.solidDisabled?1:.5};
 					pointer-events: none;
 			  `:""};
 	display: flex;
@@ -159,5 +172,5 @@
 	margin-right: ${t=>t.variant&&["small","x-small"].includes(t.variant)?"":"16px"};
 	font-size: ${t=>t.variant==="x-small"?"12px":t.variant==="small"?"14px":"16px"};
 	line-height: ${t=>t.variant==="x-small"?"16px":t.variant==="small"?"20px":"24px"};
-`;exports.IconHolder=g;exports.InputContainer=c;exports.InputContainerSmall=u;exports.InputContainerXSmall=p;exports.InputFooter=v;exports.InputHeader=m;exports.InputWrapper=x;exports.MaxCharStyle=f;exports.PrefixHolder=$;exports.RootContainer=y;exports.SuffixHolder=b;
+`;exports.IconHolder=x;exports.InputContainer=g;exports.InputContainerSmall=u;exports.InputContainerXSmall=m;exports.InputFooter=y;exports.InputHeader=p;exports.InputWrapper=c;exports.MaxCharStyle=f;exports.PrefixHolder=$;exports.RootContainer=v;exports.SuffixHolder=b;
 //# sourceMappingURL=Input.styled.js.map

package/dist/cjs/components/input/Input.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.styled.js","sources":["../../../../src/components/input/Input.styled.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport {\n\tBodyCaption,\n\tBodyPrimary,\n\tBodySecondary,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { InputStateI, InputTypeI, InputVariant } from './Input.model';\n\nconst getBorderColor = ({ isActive, isInvalid, hightlightInputColor }) => {\n\tif (isActive) {\n\t\treturn hightlightInputColor ? hightlightInputColor : COLORS.stroke.brand;\n\t} else if (isInvalid) {\n\t\treturn COLORS.stroke.negative.vibrant;\n\t}\n\treturn COLORS.stroke.primary;\n};\n\nconst getBorderWidth = (props: {\n\tversion?: '1.0' \| '2.0' \| '3.0';\n\thideBorder?: boolean;\n}) => {\n\treturn props.hideBorder ? 0 : props.version === '2.0' ? 0.5 : 1;\n};\n\nexport const InputWrapper = styled.div<{\n\twidth?: string;\n\theight?: string;\n\tisActive?: boolean;\n\tisInvalid?: boolean;\n\tstate?: InputStateI;\n\tvariant?: InputVariant;\n\tversion?: '1.0' \| '2.0' \| '3.0';\n\thightlightInputColor?: string;\n\thideBorder?: boolean;\n}>`\n\tborder-radius: ${(props) => (props.version === '2.0' ? 8 : 4)}px;\n\tbackground: ${(props) =>\n\t\t['disabled', 'read-only', 'disabled-invalid'].includes(props.state!)\n\t\t\t? COLORS.background.base\n\t\t\t: '#fff'};\n\tborder: ${(props) => getBorderWidth(props)}px solid\n\t\t${(props) =>\n\t\t\tgetBorderColor({\n\t\t\t\tisActive: props.isActive,\n\t\t\t\tisInvalid: props.isInvalid,\n\t\t\t\thightlightInputColor: props.hightlightInputColor,\n\t\t\t})};\n\t${(props) =>\n\t\tprops.isActive\n\t\t\t? `box-shadow: inset 0px 0px 0px 1px ${\n\t\t\t\t\tprops.hightlightInputColor\n\t\t\t\t\t\t? props.hightlightInputColor\n\t\t\t\t\t\t: COLORS.stroke.brand\n\t\t\t };`\n\t\t\t: ''};\n\tpadding: ${(props) => (props.variant === 'small' ? '6px' : '8px')};\n\theight: ${(props) => props.height \|\| '100%'};\n\t${(props) =>\n\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t? 'max-height: 44px'\n\t\t\t: 'min-height: 48px'};\n\tdisplay: flex;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tgap: 8px;\n\toverflow: hidden;\n\n\t${(props) => (props.state === 'read-only' ? 'opacity: 0.7' : '')};\n\t${(props) => (props.state === 'read-only' ? 'pointer-events: none' : '')};\n`;\n\nexport const IconHolder = styled.div<{\n\tisLeft?: boolean;\n\ticonSize?: string;\n\tvariant?: InputVariant;\n}>`\n\tmin-height: ${(props) => props.iconSize};\n\tmin-width: ${(props) => props.iconSize};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\toverflow: hidden;\n\t${(props) =>\n\t\tprops.isLeft\n\t\t\t? `margin-left:${\n\t\t\t\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t\t\t\t? '0px'\n\t\t\t\t\t\t: '8px'\n\t\t\t }`\n\t\t\t: `margin-right: ${\n\t\t\t\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t\t\t\t? '0px'\n\t\t\t\t\t\t: '8px'\n\t\t\t }`};\n`;\n\nconst inputCss = css`\n\tflex-grow: 1;\n\toverflow: hidden;\n\theight: 100%;\n\n\tinput,\n\ttextarea {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder: none;\n\t\tmin-height: 24px;\n\t\toutline: none;\n\t\tfont-size: inherit;\n\t\tline-height: inherit;\n\t\tfont-weight: inherit;\n\t\tpadding: 0px;\n\t\tmargin: 0px;\n\t\tbackground: transparent;\n\t\t&::placeholder {\n\t\t\tfont-family: Inter;\n\t\t\tcolor: ${COLORS.content.placeholder};\n\t\t}\n\n\t\t&::-webkit-outer-spin-button,\n\t\t&::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none;\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\n\ttextarea {\n\t\theight: 100%;\n\t\tfont-family: Inter;\n\t\tmin-height: 100px;\n\t\tresize: none;\n\t}\n`;\n\nexport const InputContainer = styled(BodyPrimary)<{\n\theight?: string;\n\ttype?: InputTypeI;\n\tautoGrow?: boolean;\n\tminHeight?: string;\n\tmaxHeight?: string;\n}>`\n\t${inputCss};\n\t${(props) =>\n\t\tprops.height && props.type !== 'multiline' ? { height: props.height } : {}};\n\n\t${(props) =>\n\t\tprops.autoGrow &&\n\t\tprops.minHeight &&\n\t\t`\n\ttextarea {\n\t\theight: ${props.minHeight};\n\t\tmin-height: ${props.minHeight};\n\t\tmax-height: ${props.maxHeight \|\| '100px'};\n\t}\n\t`}\n`;\n\nexport const InputContainerSmall = styled(BodySecondary)<{\n\theight?: string;\n\ttype?: InputTypeI;\n}>`\n\t${inputCss};\n\tinput {\n\t\tmin-height: 20px;\n\t\t&::-webkit-outer-spin-button,\n\t\t&::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none;\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\t${(props) =>\n\t\tprops.height && props.type !== 'multiline' ? { height: props.height } : {}};\n`;\n\nexport const InputContainerXSmall = styled(BodyCaption)<{\n\theight?: string;\n\ttype?: InputTypeI;\n}>`\n\t${inputCss};\n\tinput {\n\t\tmin-height: 16px;\n\t\t&::-webkit-outer-spin-button,\n\t\t&::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none;\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\t${(props) =>\n\t\tprops.height && props.type !== 'multiline' ? { height: props.height } : {}};\n`;\n\nexport const InputHeader = styled.div<{\n\tinvalid?: boolean;\n\tmaxCharAlignment?: boolean;\n}>`\n\tdisplay: flex;\n\tjustify-content: space-between;\n\t${(props) => (props.maxCharAlignment ? 'align-items: flex-end;' : '')}\n\tmargin-bottom: 8px;\n\t.label__container {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 2px;\n\t\t> div:first-of-type {\n\t\t\t${(props) =>\n\t\t\t\tprops.invalid ? `color: ${COLORS.content.negative} !important` : ''};\n\t\t}\n\t}\n\n\tspan {\n\t\tcolor: ${COLORS.content.negative};\n\t\tpadding-left: 4px;\n\t}\n`;\n\nexport const MaxCharStyle = styled(BodySecondary)<{ position?: string }>`\n\tcolor: ${COLORS.content.secondary} !important;\n\tmargin-top: ${(props) => (props.position === 'BOTTOM' ? '8px' : '0px')};\n`;\n\nexport const InputFooter = styled(BodyCaption)<{ invalid?: boolean }>`\n\twhite-space: pre-wrap;\n\tmargin-top: 8px;\n\tcolor: ${(props) =>\n\t\tprops.invalid\n\t\t\t? COLORS.content.negative\n\t\t\t: COLORS.content.secondary} !important;\n\t/* position: absolute; /\n\t/ left: 0px;\n\ttop: 100%; */\n\tdisplay: flex !important;\n\tgap: 6px;\n\tmin-height: 16px;\n\t> svg {\n\t\twidth: 16px;\n\t\theight: 16px;\n\t}\n`;\n\nexport const RootContainer = styled.div<{\n\twidth?: string;\n\theight?: string;\n\tstate?: InputStateI;\n\ttype: InputTypeI;\n}>`\n\t${(props) => (props.width ? `width: ${props.width}` : '')};\n\t${(props) =>\n\t\tprops.height && props.type == 'multiline' ? `height: ${props.height}` : ''};\n\t${(props) =>\n\t\tprops.state === 'disabled' \|\| props.state === 'disabled-invalid'\n\t\t\t? css`\n\t\t\t\t\topacity: 0.5;\n\t\t\t\t\tpointer-events: none;\n\t\t\t `\n\t\t\t: ''};\n\tdisplay: flex;\n\tflex-direction: column-reverse;\n\tposition: relative;\n\t.truncate-class {\n\t\tmax-width: 180px;\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t}\n\t.flex-align-center {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: space-between;\n\t}\n`;\n\nexport const PrefixHolder = styled(BodyPrimary)<{ variant?: InputVariant }>`\n\toverflow: unset;\n\tmargin-left: ${(props) =>\n\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t? ''\n\t\t\t: '16px'};\n\tfont-size: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '12px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '14px'\n\t\t\t: '16px'};\n\tline-height: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '16px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '20px'\n\t\t\t: '24px'};\n`;\n\nexport const SuffixHolder = styled(BodyPrimary)<{ variant?: InputVariant }>`\n\toverflow: unset;\n\tmargin-right: ${(props) =>\n\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t? ''\n\t\t\t: '16px'};\n\tfont-size: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '12px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '14px'\n\t\t\t: '16px'};\n\tline-height: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '16px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '20px'\n\t\t\t: '24px'};\n`;\n"],"names":["getBorderColor","isActive","isInvalid","hightlightInputColor","COLORS","getBorderWidth","props","InputWrapper","styled","IconHolder","inputCss","css","InputContainer","BodyPrimary","InputContainerSmall","BodySecondary","InputContainerXSmall","BodyCaption","InputHeader","MaxCharStyle","InputFooter","RootContainer","PrefixHolder","SuffixHolder"],"mappings":"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"}
1	+ {"version":3,"file":"Input.styled.js","sources":["../../../../src/components/input/Input.styled.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport {\n\tBodyCaption,\n\tBodyPrimary,\n\tBodySecondary,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { InputStateI, InputTypeI, InputVariant } from './Input.model';\n\nconst getBorderColor = ({ isActive, isInvalid, hightlightInputColor }) => {\n\tif (isActive) {\n\t\treturn hightlightInputColor ? hightlightInputColor : COLORS.stroke.brand;\n\t} else if (isInvalid) {\n\t\treturn COLORS.stroke.negative.vibrant;\n\t}\n\treturn COLORS.stroke.primary;\n};\n\nconst getBorderWidth = (props: {\n\tversion?: '1.0' \| '2.0' \| '3.0';\n\thideBorder?: boolean;\n}) => {\n\treturn props.hideBorder ? 0 : props.version === '2.0' ? 0.5 : 1;\n};\n\nexport const InputWrapper = styled.div<{\n\twidth?: string;\n\theight?: string;\n\tisActive?: boolean;\n\tisInvalid?: boolean;\n\tstate?: InputStateI;\n\tvariant?: InputVariant;\n\tversion?: '1.0' \| '2.0' \| '3.0';\n\thightlightInputColor?: string;\n\thideBorder?: boolean;\n\tsolidDisabled?: boolean;\n}>`\n\tborder-radius: ${(props) => (props.version === '2.0' ? 8 : 4)}px;\n\tbackground: ${(props) =>\n\t\t['disabled', 'read-only', 'disabled-invalid'].includes(props.state!)\n\t\t\t? COLORS.background.base\n\t\t\t: '#fff'};\n\tborder: ${(props) => getBorderWidth(props)}px solid\n\t\t${(props) =>\n\t\t\tgetBorderColor({\n\t\t\t\tisActive: props.isActive,\n\t\t\t\tisInvalid: props.isInvalid,\n\t\t\t\thightlightInputColor: props.hightlightInputColor,\n\t\t\t})};\n\t${(props) =>\n\t\tprops.isActive\n\t\t\t? `box-shadow: inset 0px 0px 0px 1px ${\n\t\t\t\t\tprops.hightlightInputColor\n\t\t\t\t\t\t? props.hightlightInputColor\n\t\t\t\t\t\t: COLORS.stroke.brand\n\t\t\t };`\n\t\t\t: ''};\n\tpadding: ${(props) => (props.variant === 'small' ? '6px' : '8px')};\n\theight: ${(props) => props.height \|\| '100%'};\n\t${(props) =>\n\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t? 'max-height: 44px'\n\t\t\t: 'min-height: 48px'};\n\tdisplay: flex;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tgap: 8px;\n\toverflow: hidden;\n\n\t${(props) =>\n\t\tprops.state === 'read-only' && !props.solidDisabled ? 'opacity: 0.7' : ''};\n\t${(props) => (props.state === 'read-only' ? 'pointer-events: none' : '')};\n\t${(props) =>\n\t\tprops.solidDisabled &&\n\t\t['disabled', 'read-only', 'disabled-invalid'].includes(props.state!)\n\t\t\t? css`\n\t\t\t\t\tinput,\n\t\t\t\t\ttextarea {\n\t\t\t\t\t\tcolor: ${COLORS.content.secondary};\n\t\t\t\t\t\t-webkit-text-fill-color: ${COLORS.content.secondary};\n\t\t\t\t\t\topacity: 1;\n\t\t\t\t\t\t&::placeholder {\n\t\t\t\t\t\t\tcolor: ${COLORS.content.secondary};\n\t\t\t\t\t\t\t-webkit-text-fill-color: ${COLORS.content.secondary};\n\t\t\t\t\t\t\topacity: 1;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t `\n\t\t\t: ''};\n`;\n\nexport const IconHolder = styled.div<{\n\tisLeft?: boolean;\n\ticonSize?: string;\n\tvariant?: InputVariant;\n}>`\n\tmin-height: ${(props) => props.iconSize};\n\tmin-width: ${(props) => props.iconSize};\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\toverflow: hidden;\n\t${(props) =>\n\t\tprops.isLeft\n\t\t\t? `margin-left:${\n\t\t\t\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t\t\t\t? '0px'\n\t\t\t\t\t\t: '8px'\n\t\t\t }`\n\t\t\t: `margin-right: ${\n\t\t\t\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t\t\t\t? '0px'\n\t\t\t\t\t\t: '8px'\n\t\t\t }`};\n`;\n\nconst inputCss = css`\n\tflex-grow: 1;\n\toverflow: hidden;\n\theight: 100%;\n\n\tinput,\n\ttextarea {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tborder: none;\n\t\tmin-height: 24px;\n\t\toutline: none;\n\t\tfont-size: inherit;\n\t\tline-height: inherit;\n\t\tfont-weight: inherit;\n\t\tpadding: 0px;\n\t\tmargin: 0px;\n\t\tbackground: transparent;\n\t\t&::placeholder {\n\t\t\tfont-family: Inter;\n\t\t\tcolor: ${COLORS.content.placeholder};\n\t\t}\n\n\t\t&::-webkit-outer-spin-button,\n\t\t&::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none;\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\n\ttextarea {\n\t\theight: 100%;\n\t\tfont-family: Inter;\n\t\tmin-height: 100px;\n\t\tresize: none;\n\t}\n`;\n\nexport const InputContainer = styled(BodyPrimary)<{\n\theight?: string;\n\ttype?: InputTypeI;\n\tautoGrow?: boolean;\n\tminHeight?: string;\n\tmaxHeight?: string;\n}>`\n\t${inputCss};\n\t${(props) =>\n\t\tprops.height && props.type !== 'multiline' ? { height: props.height } : {}};\n\n\t${(props) =>\n\t\tprops.autoGrow &&\n\t\tprops.minHeight &&\n\t\t`\n\ttextarea {\n\t\theight: ${props.minHeight};\n\t\tmin-height: ${props.minHeight};\n\t\tmax-height: ${props.maxHeight \|\| '100px'};\n\t}\n\t`}\n`;\n\nexport const InputContainerSmall = styled(BodySecondary)<{\n\theight?: string;\n\ttype?: InputTypeI;\n}>`\n\t${inputCss};\n\tinput {\n\t\tmin-height: 20px;\n\t\t&::-webkit-outer-spin-button,\n\t\t&::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none;\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\t${(props) =>\n\t\tprops.height && props.type !== 'multiline' ? { height: props.height } : {}};\n`;\n\nexport const InputContainerXSmall = styled(BodyCaption)<{\n\theight?: string;\n\ttype?: InputTypeI;\n}>`\n\t${inputCss};\n\tinput {\n\t\tmin-height: 16px;\n\t\t&::-webkit-outer-spin-button,\n\t\t&::-webkit-inner-spin-button {\n\t\t\t-webkit-appearance: none;\n\t\t\tmargin: 0;\n\t\t}\n\t}\n\t${(props) =>\n\t\tprops.height && props.type !== 'multiline' ? { height: props.height } : {}};\n`;\n\nexport const InputHeader = styled.div<{\n\tinvalid?: boolean;\n\tmaxCharAlignment?: boolean;\n}>`\n\tdisplay: flex;\n\tjustify-content: space-between;\n\t${(props) => (props.maxCharAlignment ? 'align-items: flex-end;' : '')}\n\tmargin-bottom: 8px;\n\t.label__container {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 2px;\n\t\t> div:first-of-type {\n\t\t\t${(props) =>\n\t\t\t\tprops.invalid ? `color: ${COLORS.content.negative} !important` : ''};\n\t\t}\n\t}\n\n\tspan {\n\t\tcolor: ${COLORS.content.negative};\n\t\tpadding-left: 4px;\n\t}\n`;\n\nexport const MaxCharStyle = styled(BodySecondary)<{ position?: string }>`\n\tcolor: ${COLORS.content.secondary} !important;\n\tmargin-top: ${(props) => (props.position === 'BOTTOM' ? '8px' : '0px')};\n`;\n\nexport const InputFooter = styled(BodyCaption)<{ invalid?: boolean }>`\n\twhite-space: pre-wrap;\n\tmargin-top: 8px;\n\tcolor: ${(props) =>\n\t\tprops.invalid\n\t\t\t? COLORS.content.negative\n\t\t\t: COLORS.content.secondary} !important;\n\t/* position: absolute; /\n\t/ left: 0px;\n\ttop: 100%; */\n\tdisplay: flex !important;\n\tgap: 6px;\n\tmin-height: 16px;\n\t> svg {\n\t\twidth: 16px;\n\t\theight: 16px;\n\t}\n`;\n\nexport const RootContainer = styled.div<{\n\twidth?: string;\n\theight?: string;\n\tstate?: InputStateI;\n\ttype: InputTypeI;\n\tsolidDisabled?: boolean;\n}>`\n\t${(props) => (props.width ? `width: ${props.width}` : '')};\n\t${(props) =>\n\t\tprops.height && props.type == 'multiline' ? `height: ${props.height}` : ''};\n\t${(props) =>\n\t\tprops.state === 'disabled' \|\| props.state === 'disabled-invalid'\n\t\t\t? css`\n\t\t\t\t\topacity: ${props.solidDisabled ? 1 : 0.5};\n\t\t\t\t\tpointer-events: none;\n\t\t\t `\n\t\t\t: ''};\n\tdisplay: flex;\n\tflex-direction: column-reverse;\n\tposition: relative;\n\t.truncate-class {\n\t\tmax-width: 180px;\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t}\n\t.flex-align-center {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: space-between;\n\t}\n`;\n\nexport const PrefixHolder = styled(BodyPrimary)<{ variant?: InputVariant }>`\n\toverflow: unset;\n\tmargin-left: ${(props) =>\n\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t? ''\n\t\t\t: '16px'};\n\tfont-size: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '12px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '14px'\n\t\t\t: '16px'};\n\tline-height: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '16px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '20px'\n\t\t\t: '24px'};\n`;\n\nexport const SuffixHolder = styled(BodyPrimary)<{ variant?: InputVariant }>`\n\toverflow: unset;\n\tmargin-right: ${(props) =>\n\t\tprops.variant && ['small', 'x-small'].includes(props.variant)\n\t\t\t? ''\n\t\t\t: '16px'};\n\tfont-size: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '12px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '14px'\n\t\t\t: '16px'};\n\tline-height: ${(props) =>\n\t\tprops.variant === 'x-small'\n\t\t\t? '16px'\n\t\t\t: props.variant === 'small'\n\t\t\t? '20px'\n\t\t\t: '24px'};\n`;\n"],"names":["getBorderColor","isActive","isInvalid","hightlightInputColor","COLORS","getBorderWidth","props","InputWrapper","styled","css","IconHolder","inputCss","InputContainer","BodyPrimary","InputContainerSmall","BodySecondary","InputContainerXSmall","BodyCaption","InputHeader","MaxCharStyle","InputFooter","RootContainer","PrefixHolder","SuffixHolder"],"mappings":"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"}

package/dist/cjs/components/product-picker-v2/collectionScreen.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),W=require("../../assets/icons/chevronRight.svg.js"),f=require("react"),E=require("../TypographyStyle.js"),A=require("./emptyState.js"),B=require("./ProductPickerShimmer.js"),S=require("./style.js"),M=require("./utility.js"),U=require("../checkBox/CheckBox.js"),V=require("../tooltips/Tooltip.js"),_=require("../tag/Tag.js"),z=require("../icon-button/IconButton.js"),G=(l,r,o)=>{if(!l)return"";if(l.length<=r)return l;const c=l.slice(0,r-1);return c.slice(0,c.lastIndexOf(" "))+"..."},J=l=>{const{customCollectionRestriction:r,dataLoading:o,collections:c,selectedCollectionsDispatch:g,setCollectionId:a,setSelectedCollectionId:j,selectedCollections:i,setScreen:n,collectionFetcher:p,collectionsDispatch:u,pagingControls:d,storeId:m,setSaveDisabled:C,hideCollectionCheckbox:b,renderWithoutModal:h,pickerType:x,scrollContainerRef:s,appType:F,limit:R,exactLimit:T}=l,P=f.useRef(d.curPage),w=r?i?.isCustom:!1,[H,I]=f.useState(!1),v=f.useRef(!1),L=f.useRef(!1),k=()=>{if(!s||!s?.current)return;const{scrollTop:t,clientHeight:y,scrollHeight:O}=s.current;t+y>=O-20&&!v.current&&!L.current&&(C(!0),I(!0),L.current=!0,C(!0),I(!0),p(P.current,m,F).then(D=>{u({type:"paged",data:D?.collections||{}}),d.setCurPage(P.current+1),I(!1),C(!1),L.current=!1,Object.keys(D?.collections).length||(v.current=!0)}).catch())};f.useEffect(()=>(s?.current?.addEventListener("scroll",k),()=>{s?.current?.removeEventListener("scroll",k)}),[]),f.useEffect(()=>{P.current=d.curPage},[d.curPage]);const q=Object.keys(i||{}).filter(t=>t!=="isCustom").length;return e.jsxs("div",{children:[Object.keys(c??{})?.length?Object.keys(c).map(t=>{const y=i?.[t]?x==="PRODUCT"?!!Object.keys(i?.[t]?.products??{}).length:!0:!1,O=x==="COLLECTION"&&!y&&(!!T&&q>=T||!!R&&q>=R);return e.jsx(N,{customCollectionRestriction:r,data:c[t],isDisabled:w&&!i?.[t]||O,isChecked:y,isPartiallyChecked:M.isCollectionPartiallyChecked(t,c?.[t],i),selectedCollectionsDispatch:g,setCollectionId:a,setSelectedCollectionId:j,setScreen:n,id:t,hideCollectionCheckbox:b||t==="-1",selectedCollections:i,renderWithoutModal:h,pickerType:x},t)}):o?e.jsx(B.ProductPickerShimmer,{}):e.jsx(A.EmptyState,{title:"No collections to show",subtitle:"We couldn’t find any collection."}),H&&e.jsx(B.ProductPickerShimmer,{})]})},N=l=>{const{customCollectionRestriction:r,data:o,selectedCollectionsDispatch:c,setCollectionId:g,setSelectedCollectionId:a,isPartiallyChecked:j,setScreen:i,id:n,isChecked:p,isDisabled:u,hideCollectionCheckbox:d,pickerType:m,usedInSearch:C}=l,b=h=>{if(!u){if(m==="COLLECTION"){h.stopPropagation(),c({type:"reset",data:{}}),c({type:"selected",data:{id:n,val:o,isRestricted:r}}),g(n),a(n);return}g(n),a(n),i("products")}};return o?e.jsxs(S.CollectionCardStyle,{isDisabled:u,onClick:b,isActive:p,usedInSearch:C??!1,children:[e.jsxs(S.CollectionCardInfoStyle,{children:[!d&&e.jsx(U.CheckBox,{isDisabled:u,isChecked:p,isPartiallyChecked:j,onValueChange:function(h,x,s){s?.stopPropagation(),c(h?{type:"selected",data:{id:n,val:o,isRestricted:r}}:{type:"unselected",data:{id:n}}),a(h?n:"")}}),e.jsx(S.CollectionCardDetailStyle,{children:e.jsx(V.Tooltip,{body:o.name,placement:"bottom",delay:400,variant:"light",children:e.jsxs(S.CollectionNameHolder,{children:[C?e.jsx(E.BodyPrimary,{numberOfLines:1,children:o.name}):e.jsx(E.TitleRegular,{numberOfLines:1,children:o.name}),o.isSmartCollection?e.jsx("div",{style:{display:"flex"},children:e.jsx(_.Tag,{tagText:"Smart Collection",type:"warning"})}):e.jsx(e.Fragment,{})]})})})]}),m!=="COLLECTION"&&e.jsx(z.IconButton,{height:12,width:12,disabled:u,Icon:W.default})]}):e.jsx(e.Fragment,{})};exports.CollectionCard=N;exports.CollectionsScreen=J;exports.truncate=G;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),W=require("../../assets/icons/chevronRight.svg.js"),f=require("react"),E=require("../TypographyStyle.js"),A=require("./emptyState.js"),B=require("./ProductPickerShimmer.js"),S=require("./style.js"),M=require("./utility.js"),U=require("../checkBox/CheckBox.js"),V=require("../tooltips/Tooltip.js"),_=require("../tag/Tag.js"),z=require("../icon-button/IconButton.js"),G=(l,r,o)=>{if(!l)return"";if(l.length<=r)return l;const c=l.slice(0,r-1);return c.slice(0,c.lastIndexOf(" "))+"..."},J=l=>{const{customCollectionRestriction:r,dataLoading:o,collections:c,selectedCollectionsDispatch:g,setCollectionId:a,setSelectedCollectionId:j,selectedCollections:i,setScreen:n,collectionFetcher:p,collectionsDispatch:u,pagingControls:d,storeId:m,setSaveDisabled:C,hideCollectionCheckbox:b,renderWithoutModal:h,pickerType:x,scrollContainerRef:s,appType:F,limit:R,exactLimit:T}=l,P=f.useRef(d.curPage),w=r?i?.isCustom:!1,[H,L]=f.useState(!1),v=f.useRef(!1),I=f.useRef(!1),k=()=>{if(!s||!s?.current)return;const{scrollTop:t,clientHeight:y,scrollHeight:O}=s.current;t+y>=O-20&&!v.current&&!I.current&&(C(!0),L(!0),I.current=!0,C(!0),L(!0),p(P.current,m,F).then(D=>{u({type:"paged",data:D?.collections||{}}),d.setCurPage(P.current+1),L(!1),C(!1),I.current=!1,Object.keys(D?.collections).length||(v.current=!0)}).catch())};f.useEffect(()=>(s?.current?.addEventListener("scroll",k),()=>{s?.current?.removeEventListener("scroll",k)}),[]),f.useEffect(()=>{P.current=d.curPage},[d.curPage]);const q=Object.keys(i||{}).filter(t=>t!=="isCustom").length;return e.jsxs("div",{children:[Object.keys(c??{})?.length?Object.keys(c).map(t=>{const y=i?.[t]?x==="PRODUCT"?!!Object.keys(i?.[t]?.products??{}).length:!0:!1,O=x==="COLLECTION"&&!y&&(!!T&&q>=T||!!R&&q>=R);return e.jsx(N,{customCollectionRestriction:r,data:c[t],isDisabled:w&&!i?.[t]||O,isChecked:y,isPartiallyChecked:M.isCollectionPartiallyChecked(t,c?.[t],i),selectedCollectionsDispatch:g,setCollectionId:a,setSelectedCollectionId:j,setScreen:n,id:t,hideCollectionCheckbox:b||t==="-1",selectedCollections:i,renderWithoutModal:h,pickerType:x},t)}):o?e.jsx(B.ProductPickerShimmer,{}):e.jsx(A.EmptyState,{title:"No collections to show",subtitle:"We couldn’t find any collection."}),H&&e.jsx(B.ProductPickerShimmer,{})]})},N=l=>{const{customCollectionRestriction:r,data:o,selectedCollectionsDispatch:c,setCollectionId:g,setSelectedCollectionId:a,isPartiallyChecked:j,setScreen:i,id:n,isChecked:p,isDisabled:u,hideCollectionCheckbox:d,pickerType:m,usedInSearch:C}=l,b=h=>{if(!u){if(m==="COLLECTION"){h.stopPropagation(),c({type:"reset",data:{}}),c({type:"selected",data:{id:n,val:o,isRestricted:r}}),g(n),a(n);return}g(n),a(n),i("products")}};return o?e.jsxs(S.CollectionCardStyle,{isDisabled:u,onClick:b,isActive:p,usedInSearch:C??!1,children:[e.jsxs(S.CollectionCardInfoStyle,{children:[!d&&e.jsx(U.CheckBox,{isDisabled:u,isChecked:p,isPartiallyChecked:j,ariaLabel:o.name,onValueChange:function(h,x,s){s?.stopPropagation(),c(h?{type:"selected",data:{id:n,val:o,isRestricted:r}}:{type:"unselected",data:{id:n}}),a(h?n:"")}}),e.jsx(S.CollectionCardDetailStyle,{children:e.jsx(V.Tooltip,{body:o.name,placement:"bottom",delay:400,variant:"light",children:e.jsxs(S.CollectionNameHolder,{children:[C?e.jsx(E.BodyPrimary,{numberOfLines:1,children:o.name}):e.jsx(E.TitleRegular,{numberOfLines:1,children:o.name}),o.isSmartCollection?e.jsx("div",{style:{display:"flex"},children:e.jsx(_.Tag,{tagText:"Smart Collection",type:"warning"})}):e.jsx(e.Fragment,{})]})})})]}),m!=="COLLECTION"&&e.jsx(z.IconButton,{height:12,width:12,disabled:u,Icon:W.default})]}):e.jsx(e.Fragment,{})};exports.CollectionCard=N;exports.CollectionsScreen=J;exports.truncate=G;
 //# sourceMappingURL=collectionScreen.js.map

package/dist/cjs/components/product-picker-v2/collectionScreen.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"collectionScreen.js","sources":["../../../../src/components/product-picker-v2/collectionScreen.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { CheckBox } from '../checkBox';\nimport { IconButton } from '../icon-button';\nimport { Tag } from '../tag';\nimport { Tooltip } from '../tooltips';\nimport { BodyPrimary, TitleRegular } from '../TypographyStyle';\nimport { EmptyState } from './emptyState';\nimport { ProductPickerShimmer } from './ProductPickerShimmer';\nimport type {\n\tCollectionsActions,\n\tSelectedCollectionsActions,\n} from './reducers';\nimport {\n\tCollectionCardDetailStyle,\n\tCollectionCardInfoStyle,\n\tCollectionCardStyle,\n\tCollectionNameHolder,\n} from './style';\nimport type {\n\tCollection,\n\tCollectionFetcherReturn,\n\tSelectedItems,\n} from './type';\nimport { isCollectionPartiallyChecked } from './utility';\n\nexport const truncate = (str: string, n: number, useWordBoundary: boolean) => {\n\tif (!str) return '';\n\tif (str.length <= n) {\n\t\treturn str;\n\t}\n\tconst subString = str.slice(0, n - 1); // the original check\n\treturn (\n\t\t(useWordBoundary\n\t\t\t? subString.slice(0, subString.lastIndexOf(' '))\n\t\t\t: subString) + '...'\n\t);\n};\n\ninterface CollectionsScreenInterface {\n\tcustomCollectionRestriction?: boolean;\n\tdataLoading: boolean;\n\tcollections: { [key: string]: Collection };\n\tselectedCollections: SelectedItems;\n\tcollectionFetcher: (\n\t\toffset: number,\n\t\tstoreId: string,\n\t\tappType: ApplicationType,\n\t) => CollectionFetcherReturn;\n\tstoreId: string;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tsetCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetScreen: React.Dispatch<React.SetStateAction<string>>;\n\tcollectionsDispatch: React.Dispatch<CollectionsActions>;\n\tsetSaveDisabled: React.Dispatch<boolean>;\n\tpagingControls: {\n\t\tcurPage: number;\n\t\tsetCurPage: React.Dispatch<React.SetStateAction<number>>;\n\t};\n\thideCollectionCheckbox?: boolean;\n\trenderWithoutModal?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tscrollContainerRef: React.RefObject<HTMLDivElement>;\n\tappType: ApplicationType;\n\tlimit?: number;\n\texactLimit?: number;\n}\n\nexport const CollectionsScreen = (props: CollectionsScreenInterface) => {\n\tconst {\n\t\tcustomCollectionRestriction,\n\t\tdataLoading,\n\t\tcollections,\n\t\tselectedCollectionsDispatch,\n\t\tsetCollectionId,\n\t\tsetSelectedCollectionId,\n\t\tselectedCollections,\n\t\tsetScreen,\n\t\tcollectionFetcher,\n\t\tcollectionsDispatch,\n\t\tpagingControls,\n\t\tstoreId,\n\t\tsetSaveDisabled,\n\t\thideCollectionCheckbox,\n\t\trenderWithoutModal,\n\t\tpickerType,\n\t\tscrollContainerRef,\n\t\tappType,\n\t\tlimit,\n\t\texactLimit,\n\t} = props;\n\n\tconst nextPageRef = useRef(pagingControls.curPage);\n\tconst isCustomSelected = customCollectionRestriction\n\t\t? selectedCollections?.['isCustom']\n\t\t: false \|\| false;\n\n\tconst [isLoading, setIsLoading] = useState(false);\n\tconst hasAllCollectionsLoaded = useRef(false);\n\tconst isFetchingRef = useRef(false);\n\n\t/*\n\t Pagination logic. When scroll bar is end of the container, gets the next 10 collections from api and fetches fb status for those 10 collections.\n\t * After that, Increments next page ref which acts as offset.\n\t */\n\tconst handleScroll = () => {\n\t\tif (!scrollContainerRef \|\| !scrollContainerRef?.current) {\n\t\t\treturn;\n\t\t}\n\t\tconst { scrollTop, clientHeight, scrollHeight } =\n\t\t\tscrollContainerRef.current;\n\n\t\tif (\n\t\t\tscrollTop + clientHeight >= scrollHeight - 20 &&\n\t\t\t!hasAllCollectionsLoaded.current &&\n\t\t\t!isFetchingRef.current\n\t\t) {\n\t\t\tsetSaveDisabled(true);\n\t\t\tsetIsLoading(true);\n\n\t\t\tisFetchingRef.current = true;\n\n\t\t\tsetSaveDisabled(true);\n\t\t\tsetIsLoading(true);\n\t\t\tcollectionFetcher(nextPageRef.current, storeId, appType)\n\t\t\t\t.then((collectionsParsed) => {\n\t\t\t\t\tcollectionsDispatch({\n\t\t\t\t\t\ttype: 'paged',\n\t\t\t\t\t\tdata: collectionsParsed?.collections \|\| {},\n\t\t\t\t\t});\n\t\t\t\t\tpagingControls.setCurPage(nextPageRef.current + 1);\n\t\t\t\t\tsetIsLoading(false);\n\t\t\t\t\tsetSaveDisabled(false);\n\n\t\t\t\t\tisFetchingRef.current = false;\n\n\t\t\t\t\t// We decide that all collections are loaded if the API response has 0 collections. This stops the scroll effect.\n\t\t\t\t\tif (!Object.keys(collectionsParsed?.collections).length) {\n\t\t\t\t\t\thasAllCollectionsLoaded.current = true;\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t\t.catch();\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tscrollContainerRef?.current?.addEventListener('scroll', handleScroll);\n\t\treturn () => {\n\t\t\tscrollContainerRef?.current?.removeEventListener('scroll', handleScroll);\n\t\t};\n\t}, []);\n\n\tuseEffect(() => {\n\t\tnextPageRef.current = pagingControls.curPage;\n\t}, [pagingControls.curPage]);\n\n\t// Calculate current count of selected collections for limit enforcement\n\tconst selectedCollectionCount = Object.keys(selectedCollections \|\| {}).filter(\n\t\t(k) => k !== 'isCustom',\n\t).length;\n\n\treturn (\n\t\t<div>\n\t\t\t{Object.keys(collections ?? {})?.length ? (\n\t\t\t\tObject.keys(collections).map((key: string) => {\n\t\t\t\t\tconst isChecked = selectedCollections?.[key]\n\t\t\t\t\t\t? pickerType === 'PRODUCT'\n\t\t\t\t\t\t\t? !!Object.keys(selectedCollections?.[key]?.products ?? {}).length\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: false;\n\n\t\t\t\t\t// For COLLECTION picker, check if limit is reached\n\t\t\t\t\tconst isLimitReached =\n\t\t\t\t\t\tpickerType === 'COLLECTION' &&\n\t\t\t\t\t\t!isChecked &&\n\t\t\t\t\t\t((!!exactLimit && selectedCollectionCount >= exactLimit) \|\|\n\t\t\t\t\t\t\t(!!limit && selectedCollectionCount >= limit));\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CollectionCard\n\t\t\t\t\t\t\tcustomCollectionRestriction={customCollectionRestriction}\n\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\tdata={collections[key]}\n\t\t\t\t\t\t\tisDisabled={\n\t\t\t\t\t\t\t\t(isCustomSelected && !selectedCollections?.[key]) \|\|\n\t\t\t\t\t\t\t\tisLimitReached\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tisChecked={isChecked}\n\t\t\t\t\t\t\tisPartiallyChecked={isCollectionPartiallyChecked(\n\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\tcollections?.[key],\n\t\t\t\t\t\t\t\tselectedCollections,\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\t\t\t\tsetCollectionId={setCollectionId}\n\t\t\t\t\t\t\tsetSelectedCollectionId={setSelectedCollectionId}\n\t\t\t\t\t\t\tsetScreen={setScreen}\n\t\t\t\t\t\t\tid={key}\n\t\t\t\t\t\t\thideCollectionCheckbox={hideCollectionCheckbox \|\| key === '-1'}\n\t\t\t\t\t\t\tselectedCollections={selectedCollections}\n\t\t\t\t\t\t\trenderWithoutModal={renderWithoutModal}\n\t\t\t\t\t\t\tpickerType={pickerType}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t})\n\t\t\t) : dataLoading ? (\n\t\t\t\t<ProductPickerShimmer />\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle=\"No collections to show\"\n\t\t\t\t\tsubtitle=\"We couldn’t find any collection.\"\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{isLoading && <ProductPickerShimmer />}\n\t\t</div>\n\t);\n};\n\nexport interface CollectionCardInterface {\n\tcustomCollectionRestriction?: boolean;\n\tdata?: Collection;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tsetCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetScreen: React.Dispatch<React.SetStateAction<string>>;\n\tid: string;\n\tisChecked: boolean;\n\tisDisabled: boolean;\n\tisPartiallyChecked: boolean;\n\thideCollectionCheckbox?: boolean;\n\trenderWithoutModal?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tselectedCollections: SelectedItems;\n\tusedInSearch?: boolean;\n}\n\nexport const CollectionCard = (props: CollectionCardInterface) => {\n\tconst {\n\t\tcustomCollectionRestriction,\n\t\tdata,\n\t\tselectedCollectionsDispatch,\n\t\tsetCollectionId,\n\t\tsetSelectedCollectionId,\n\t\tisPartiallyChecked,\n\t\tsetScreen,\n\t\tid,\n\t\tisChecked,\n\t\tisDisabled,\n\t\thideCollectionCheckbox,\n\t\tpickerType,\n\t\tusedInSearch,\n\t} = props;\n\n\tconst onClickChevron = (event) => {\n\t\tif (isDisabled) {\n\t\t\treturn;\n\t\t}\n\t\tif (pickerType === 'COLLECTION') {\n\t\t\tevent.stopPropagation();\n\t\t\tselectedCollectionsDispatch({\n\t\t\t\ttype: 'reset',\n\t\t\t\tdata: {},\n\t\t\t});\n\n\t\t\tselectedCollectionsDispatch({\n\t\t\t\ttype: 'selected',\n\t\t\t\tdata: {\n\t\t\t\t\tid,\n\t\t\t\t\tval: data,\n\t\t\t\t\tisRestricted: customCollectionRestriction,\n\t\t\t\t},\n\t\t\t});\n\t\t\tsetCollectionId(id);\n\t\t\tsetSelectedCollectionId(id);\n\t\t\treturn;\n\t\t}\n\t\tsetCollectionId(id);\n\t\tsetSelectedCollectionId(id);\n\t\tsetScreen('products');\n\t};\n\n\tif (!data) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<CollectionCardStyle\n\t\t\tisDisabled={isDisabled}\n\t\t\tonClick={onClickChevron}\n\t\t\tisActive={isChecked}\n\t\t\tusedInSearch={usedInSearch ?? false}\n\t\t>\n\t\t\t<CollectionCardInfoStyle>\n\t\t\t\t{!hideCollectionCheckbox && (\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\tisChecked={isChecked}\n\t\t\t\t\t\tisPartiallyChecked={isPartiallyChecked}\n\t\t\t\t\t\tonValueChange={function (\n\t\t\t\t\t\t\tchecked: boolean,\n\t\t\t\t\t\t\t_value?: string,\n\t\t\t\t\t\t\tevent?: React.MouseEvent,\n\t\t\t\t\t\t): void {\n\t\t\t\t\t\t\tevent?.stopPropagation();\n\t\t\t\t\t\t\tchecked\n\t\t\t\t\t\t\t\t? selectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\t\ttype: 'selected',\n\t\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\t\tid,\n\t\t\t\t\t\t\t\t\t\t\tval: data,\n\t\t\t\t\t\t\t\t\t\t\tisRestricted: customCollectionRestriction,\n\t\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: selectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\t\ttype: 'unselected',\n\t\t\t\t\t\t\t\t\t\tdata: { id },\n\t\t\t\t\t\t\t\t });\n\n\t\t\t\t\t\t\tif (!checked) {\n\t\t\t\t\t\t\t\tsetSelectedCollectionId('');\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tsetSelectedCollectionId(id);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<CollectionCardDetailStyle>\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tbody={data.name}\n\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\tdelay={400}\n\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<CollectionNameHolder>\n\t\t\t\t\t\t\t{!usedInSearch ? (\n\t\t\t\t\t\t\t\t<TitleRegular numberOfLines={1}>{data.name}</TitleRegular>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<BodyPrimary numberOfLines={1}>{data.name}</BodyPrimary>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{data.isSmartCollection ? (\n\t\t\t\t\t\t\t\t<div style={{ display: 'flex' }}>\n\t\t\t\t\t\t\t\t\t<Tag tagText={'Smart Collection'} type=\"warning\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</CollectionNameHolder>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t</CollectionCardDetailStyle>\n\t\t\t</CollectionCardInfoStyle>\n\t\t\t{pickerType !== 'COLLECTION' && (\n\t\t\t\t<IconButton\n\t\t\t\t\theight={12}\n\t\t\t\t\twidth={12}\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\tIcon={ChevronRight}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</CollectionCardStyle>\n\t);\n};\n"],"names":["truncate","str","n","useWordBoundary","subString","CollectionsScreen","props","customCollectionRestriction","dataLoading","collections","selectedCollectionsDispatch","setCollectionId","setSelectedCollectionId","selectedCollections","setScreen","collectionFetcher","collectionsDispatch","pagingControls","storeId","setSaveDisabled","hideCollectionCheckbox","renderWithoutModal","pickerType","scrollContainerRef","appType","limit","exactLimit","nextPageRef","useRef","isCustomSelected","isLoading","setIsLoading","useState","hasAllCollectionsLoaded","isFetchingRef","handleScroll","scrollTop","clientHeight","scrollHeight","collectionsParsed","useEffect","selectedCollectionCount","k","key","isChecked","isLimitReached","jsx","CollectionCard","isCollectionPartiallyChecked","ProductPickerShimmer","EmptyState","data","isPartiallyChecked","id","isDisabled","usedInSearch","onClickChevron","event","jsxs","CollectionCardStyle","CollectionCardInfoStyle","CheckBox","checked","_value","CollectionCardDetailStyle","Tooltip","CollectionNameHolder","BodyPrimary","TitleRegular","Tag","Fragment","IconButton","ChevronRight"],"mappings":"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"}
1	+ {"version":3,"file":"collectionScreen.js","sources":["../../../../src/components/product-picker-v2/collectionScreen.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { CheckBox } from '../checkBox';\nimport { IconButton } from '../icon-button';\nimport { Tag } from '../tag';\nimport { Tooltip } from '../tooltips';\nimport { BodyPrimary, TitleRegular } from '../TypographyStyle';\nimport { EmptyState } from './emptyState';\nimport { ProductPickerShimmer } from './ProductPickerShimmer';\nimport type {\n\tCollectionsActions,\n\tSelectedCollectionsActions,\n} from './reducers';\nimport {\n\tCollectionCardDetailStyle,\n\tCollectionCardInfoStyle,\n\tCollectionCardStyle,\n\tCollectionNameHolder,\n} from './style';\nimport type {\n\tCollection,\n\tCollectionFetcherReturn,\n\tSelectedItems,\n} from './type';\nimport { isCollectionPartiallyChecked } from './utility';\n\nexport const truncate = (str: string, n: number, useWordBoundary: boolean) => {\n\tif (!str) return '';\n\tif (str.length <= n) {\n\t\treturn str;\n\t}\n\tconst subString = str.slice(0, n - 1); // the original check\n\treturn (\n\t\t(useWordBoundary\n\t\t\t? subString.slice(0, subString.lastIndexOf(' '))\n\t\t\t: subString) + '...'\n\t);\n};\n\ninterface CollectionsScreenInterface {\n\tcustomCollectionRestriction?: boolean;\n\tdataLoading: boolean;\n\tcollections: { [key: string]: Collection };\n\tselectedCollections: SelectedItems;\n\tcollectionFetcher: (\n\t\toffset: number,\n\t\tstoreId: string,\n\t\tappType: ApplicationType,\n\t) => CollectionFetcherReturn;\n\tstoreId: string;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tsetCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetScreen: React.Dispatch<React.SetStateAction<string>>;\n\tcollectionsDispatch: React.Dispatch<CollectionsActions>;\n\tsetSaveDisabled: React.Dispatch<boolean>;\n\tpagingControls: {\n\t\tcurPage: number;\n\t\tsetCurPage: React.Dispatch<React.SetStateAction<number>>;\n\t};\n\thideCollectionCheckbox?: boolean;\n\trenderWithoutModal?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tscrollContainerRef: React.RefObject<HTMLDivElement>;\n\tappType: ApplicationType;\n\tlimit?: number;\n\texactLimit?: number;\n}\n\nexport const CollectionsScreen = (props: CollectionsScreenInterface) => {\n\tconst {\n\t\tcustomCollectionRestriction,\n\t\tdataLoading,\n\t\tcollections,\n\t\tselectedCollectionsDispatch,\n\t\tsetCollectionId,\n\t\tsetSelectedCollectionId,\n\t\tselectedCollections,\n\t\tsetScreen,\n\t\tcollectionFetcher,\n\t\tcollectionsDispatch,\n\t\tpagingControls,\n\t\tstoreId,\n\t\tsetSaveDisabled,\n\t\thideCollectionCheckbox,\n\t\trenderWithoutModal,\n\t\tpickerType,\n\t\tscrollContainerRef,\n\t\tappType,\n\t\tlimit,\n\t\texactLimit,\n\t} = props;\n\n\tconst nextPageRef = useRef(pagingControls.curPage);\n\tconst isCustomSelected = customCollectionRestriction\n\t\t? selectedCollections?.['isCustom']\n\t\t: false \|\| false;\n\n\tconst [isLoading, setIsLoading] = useState(false);\n\tconst hasAllCollectionsLoaded = useRef(false);\n\tconst isFetchingRef = useRef(false);\n\n\t/*\n\t Pagination logic. When scroll bar is end of the container, gets the next 10 collections from api and fetches fb status for those 10 collections.\n\t * After that, Increments next page ref which acts as offset.\n\t */\n\tconst handleScroll = () => {\n\t\tif (!scrollContainerRef \|\| !scrollContainerRef?.current) {\n\t\t\treturn;\n\t\t}\n\t\tconst { scrollTop, clientHeight, scrollHeight } =\n\t\t\tscrollContainerRef.current;\n\n\t\tif (\n\t\t\tscrollTop + clientHeight >= scrollHeight - 20 &&\n\t\t\t!hasAllCollectionsLoaded.current &&\n\t\t\t!isFetchingRef.current\n\t\t) {\n\t\t\tsetSaveDisabled(true);\n\t\t\tsetIsLoading(true);\n\n\t\t\tisFetchingRef.current = true;\n\n\t\t\tsetSaveDisabled(true);\n\t\t\tsetIsLoading(true);\n\t\t\tcollectionFetcher(nextPageRef.current, storeId, appType)\n\t\t\t\t.then((collectionsParsed) => {\n\t\t\t\t\tcollectionsDispatch({\n\t\t\t\t\t\ttype: 'paged',\n\t\t\t\t\t\tdata: collectionsParsed?.collections \|\| {},\n\t\t\t\t\t});\n\t\t\t\t\tpagingControls.setCurPage(nextPageRef.current + 1);\n\t\t\t\t\tsetIsLoading(false);\n\t\t\t\t\tsetSaveDisabled(false);\n\n\t\t\t\t\tisFetchingRef.current = false;\n\n\t\t\t\t\t// We decide that all collections are loaded if the API response has 0 collections. This stops the scroll effect.\n\t\t\t\t\tif (!Object.keys(collectionsParsed?.collections).length) {\n\t\t\t\t\t\thasAllCollectionsLoaded.current = true;\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t\t.catch();\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tscrollContainerRef?.current?.addEventListener('scroll', handleScroll);\n\t\treturn () => {\n\t\t\tscrollContainerRef?.current?.removeEventListener('scroll', handleScroll);\n\t\t};\n\t}, []);\n\n\tuseEffect(() => {\n\t\tnextPageRef.current = pagingControls.curPage;\n\t}, [pagingControls.curPage]);\n\n\t// Calculate current count of selected collections for limit enforcement\n\tconst selectedCollectionCount = Object.keys(selectedCollections \|\| {}).filter(\n\t\t(k) => k !== 'isCustom',\n\t).length;\n\n\treturn (\n\t\t<div>\n\t\t\t{Object.keys(collections ?? {})?.length ? (\n\t\t\t\tObject.keys(collections).map((key: string) => {\n\t\t\t\t\tconst isChecked = selectedCollections?.[key]\n\t\t\t\t\t\t? pickerType === 'PRODUCT'\n\t\t\t\t\t\t\t? !!Object.keys(selectedCollections?.[key]?.products ?? {}).length\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: false;\n\n\t\t\t\t\t// For COLLECTION picker, check if limit is reached\n\t\t\t\t\tconst isLimitReached =\n\t\t\t\t\t\tpickerType === 'COLLECTION' &&\n\t\t\t\t\t\t!isChecked &&\n\t\t\t\t\t\t((!!exactLimit && selectedCollectionCount >= exactLimit) \|\|\n\t\t\t\t\t\t\t(!!limit && selectedCollectionCount >= limit));\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CollectionCard\n\t\t\t\t\t\t\tcustomCollectionRestriction={customCollectionRestriction}\n\t\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\t\tdata={collections[key]}\n\t\t\t\t\t\t\tisDisabled={\n\t\t\t\t\t\t\t\t(isCustomSelected && !selectedCollections?.[key]) \|\|\n\t\t\t\t\t\t\t\tisLimitReached\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tisChecked={isChecked}\n\t\t\t\t\t\t\tisPartiallyChecked={isCollectionPartiallyChecked(\n\t\t\t\t\t\t\t\tkey,\n\t\t\t\t\t\t\t\tcollections?.[key],\n\t\t\t\t\t\t\t\tselectedCollections,\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\t\t\t\tsetCollectionId={setCollectionId}\n\t\t\t\t\t\t\tsetSelectedCollectionId={setSelectedCollectionId}\n\t\t\t\t\t\t\tsetScreen={setScreen}\n\t\t\t\t\t\t\tid={key}\n\t\t\t\t\t\t\thideCollectionCheckbox={hideCollectionCheckbox \|\| key === '-1'}\n\t\t\t\t\t\t\tselectedCollections={selectedCollections}\n\t\t\t\t\t\t\trenderWithoutModal={renderWithoutModal}\n\t\t\t\t\t\t\tpickerType={pickerType}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t})\n\t\t\t) : dataLoading ? (\n\t\t\t\t<ProductPickerShimmer />\n\t\t\t) : (\n\t\t\t\t<EmptyState\n\t\t\t\t\ttitle=\"No collections to show\"\n\t\t\t\t\tsubtitle=\"We couldn’t find any collection.\"\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{isLoading && <ProductPickerShimmer />}\n\t\t</div>\n\t);\n};\n\nexport interface CollectionCardInterface {\n\tcustomCollectionRestriction?: boolean;\n\tdata?: Collection;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tsetCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;\n\tsetScreen: React.Dispatch<React.SetStateAction<string>>;\n\tid: string;\n\tisChecked: boolean;\n\tisDisabled: boolean;\n\tisPartiallyChecked: boolean;\n\thideCollectionCheckbox?: boolean;\n\trenderWithoutModal?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tselectedCollections: SelectedItems;\n\tusedInSearch?: boolean;\n}\n\nexport const CollectionCard = (props: CollectionCardInterface) => {\n\tconst {\n\t\tcustomCollectionRestriction,\n\t\tdata,\n\t\tselectedCollectionsDispatch,\n\t\tsetCollectionId,\n\t\tsetSelectedCollectionId,\n\t\tisPartiallyChecked,\n\t\tsetScreen,\n\t\tid,\n\t\tisChecked,\n\t\tisDisabled,\n\t\thideCollectionCheckbox,\n\t\tpickerType,\n\t\tusedInSearch,\n\t} = props;\n\n\tconst onClickChevron = (event) => {\n\t\tif (isDisabled) {\n\t\t\treturn;\n\t\t}\n\t\tif (pickerType === 'COLLECTION') {\n\t\t\tevent.stopPropagation();\n\t\t\tselectedCollectionsDispatch({\n\t\t\t\ttype: 'reset',\n\t\t\t\tdata: {},\n\t\t\t});\n\n\t\t\tselectedCollectionsDispatch({\n\t\t\t\ttype: 'selected',\n\t\t\t\tdata: {\n\t\t\t\t\tid,\n\t\t\t\t\tval: data,\n\t\t\t\t\tisRestricted: customCollectionRestriction,\n\t\t\t\t},\n\t\t\t});\n\t\t\tsetCollectionId(id);\n\t\t\tsetSelectedCollectionId(id);\n\t\t\treturn;\n\t\t}\n\t\tsetCollectionId(id);\n\t\tsetSelectedCollectionId(id);\n\t\tsetScreen('products');\n\t};\n\n\tif (!data) {\n\t\treturn <></>;\n\t}\n\n\treturn (\n\t\t<CollectionCardStyle\n\t\t\tisDisabled={isDisabled}\n\t\t\tonClick={onClickChevron}\n\t\t\tisActive={isChecked}\n\t\t\tusedInSearch={usedInSearch ?? false}\n\t\t>\n\t\t\t<CollectionCardInfoStyle>\n\t\t\t\t{!hideCollectionCheckbox && (\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tisDisabled={isDisabled}\n\t\t\t\t\t\tisChecked={isChecked}\n\t\t\t\t\t\tisPartiallyChecked={isPartiallyChecked}\n\t\t\t\t\t\tariaLabel={data.name}\n\t\t\t\t\t\tonValueChange={function (\n\t\t\t\t\t\t\tchecked: boolean,\n\t\t\t\t\t\t\t_value?: string,\n\t\t\t\t\t\t\tevent?: React.MouseEvent,\n\t\t\t\t\t\t): void {\n\t\t\t\t\t\t\tevent?.stopPropagation();\n\t\t\t\t\t\t\tchecked\n\t\t\t\t\t\t\t\t? selectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\t\ttype: 'selected',\n\t\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\t\tid,\n\t\t\t\t\t\t\t\t\t\t\tval: data,\n\t\t\t\t\t\t\t\t\t\t\tisRestricted: customCollectionRestriction,\n\t\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: selectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\t\ttype: 'unselected',\n\t\t\t\t\t\t\t\t\t\tdata: { id },\n\t\t\t\t\t\t\t\t });\n\n\t\t\t\t\t\t\tif (!checked) {\n\t\t\t\t\t\t\t\tsetSelectedCollectionId('');\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tsetSelectedCollectionId(id);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<CollectionCardDetailStyle>\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tbody={data.name}\n\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\tdelay={400}\n\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<CollectionNameHolder>\n\t\t\t\t\t\t\t{!usedInSearch ? (\n\t\t\t\t\t\t\t\t<TitleRegular numberOfLines={1}>{data.name}</TitleRegular>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<BodyPrimary numberOfLines={1}>{data.name}</BodyPrimary>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{data.isSmartCollection ? (\n\t\t\t\t\t\t\t\t<div style={{ display: 'flex' }}>\n\t\t\t\t\t\t\t\t\t<Tag tagText={'Smart Collection'} type=\"warning\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</CollectionNameHolder>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t</CollectionCardDetailStyle>\n\t\t\t</CollectionCardInfoStyle>\n\t\t\t{pickerType !== 'COLLECTION' && (\n\t\t\t\t<IconButton\n\t\t\t\t\theight={12}\n\t\t\t\t\twidth={12}\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\tIcon={ChevronRight}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</CollectionCardStyle>\n\t);\n};\n"],"names":["truncate","str","n","useWordBoundary","subString","CollectionsScreen","props","customCollectionRestriction","dataLoading","collections","selectedCollectionsDispatch","setCollectionId","setSelectedCollectionId","selectedCollections","setScreen","collectionFetcher","collectionsDispatch","pagingControls","storeId","setSaveDisabled","hideCollectionCheckbox","renderWithoutModal","pickerType","scrollContainerRef","appType","limit","exactLimit","nextPageRef","useRef","isCustomSelected","isLoading","setIsLoading","useState","hasAllCollectionsLoaded","isFetchingRef","handleScroll","scrollTop","clientHeight","scrollHeight","collectionsParsed","useEffect","selectedCollectionCount","k","key","isChecked","isLimitReached","jsx","CollectionCard","isCollectionPartiallyChecked","ProductPickerShimmer","EmptyState","data","isPartiallyChecked","id","isDisabled","usedInSearch","onClickChevron","event","jsxs","CollectionCardStyle","CollectionCardInfoStyle","CheckBox","checked","_value","CollectionCardDetailStyle","Tooltip","CollectionNameHolder","BodyPrimary","TitleRegular","Tag","Fragment","IconButton","ChevronRight"],"mappings":"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"}

package/dist/cjs/components/product-picker-v2/product.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),V=require("../../constants/Theme.js"),F=require("../../assets/icons/info.svg.js"),q=require("../TypographyStyle.js"),D=require("./constants.js"),R=require("./helpers/ProductHelper.js"),$=require("./ProductPickerTag.js"),h=require("./style.js"),T=require("./utility.js"),L=require("../checkBox/CheckBox.js"),G=require("../shimmer-image/ShimmerImage.js"),A=require("../tooltips/Tooltip.js"),H=require("../icon-button/IconButton.js"),K=j=>{const{collectionId:c,productId:r,data:e,selectedData:i,selectedCollectionsDispatch:n,viewOnly:a,upliftAdditions:s,isProductPartiallyChecked:P,hideProductCheckbox:d,outOfStockAction:x,hideVariantCheckbox:u,hideProductVariants:p,pickerType:f,onProductDetailClick:l,showProductDetailInfoIcon:C}=j,S=()=>!!i?.[c]?.products?.[r],g=o=>i?.[c]?.products?.[r]?!!i?.[c]?.products?.[r]?.variants?.[o]:!1,m=!p&&T.shouldShowVariant(e)?"":`${e.currency?D.CurrencySymbols[e.currency]??"":""}${Object.values(e.variants??{})?.[0]?.price??Object.values(e.variants??{})?.[0]?.actualPrice??""}`;return t.jsxs("div",{children:[t.jsx(I,{isVariant:!1,data:e,productId:r,collectionId:c,isSelected:S(),isPartiallyChecked:P,selectedCollectionsDispatch:n,upliftAdditions:s,viewOnly:a,hideProductCheckbox:d,hideVariantCheckbox:u,hideProductVariants:p,pickerType:f,outOfStockAction:x,onProductDetailClick:l,showProductDetailInfoIcon:C,currencyAndPrice:m},r),p?null:T.shouldShowVariant(e)&&Object.keys(e.variants||[]).map(o=>{const y=`${e.currency?D.CurrencySymbols[e.currency]??"":""}${e.variants?.[o]?.price??e.variants?.[o]?.actualPrice??""}`;return t.jsx(I,{isVariant:!0,hideVariantCheckbox:u,data:{...e.variants[o],currency:e.currency},variantId:o,productId:r,viewOnly:a,upliftAdditions:s,collectionId:c,isSelected:g(o),selectedCollectionsDispatch:n,outOfStockAction:x,onProductDetailClick:l,showProductDetailInfoIcon:C,currencyAndPrice:y},o)})]})},I=j=>{const{isVariant:c,data:r,productId:e,collectionId:i,variantId:n,isSelected:a,selectedCollectionsDispatch:s,viewOnly:P,upliftAdditions:d,isPartiallyChecked:x,hideProductCheckbox:u,outOfStockAction:p,hideVariantCheckbox:f,hideProductVariants:l,pickerType:C="PRODUCT",onProductDetailClick:S,showProductDetailInfoIcon:g,currencyAndPrice:m}=j,{isVariantForProductPickerTag:o,dataForProductPickerTag:y,tagText:v,tagType:U}=R.ProductHelper.getDataForProductPickerTag(r,c,p),b=T.getSkuId(r,c),w=k=>{if(k.stopPropagation(),C==="PRODUCT"&&(u||f)){const O=Object.keys(r.variants);l?a?s({type:"productUnselected",data:{productId:e,collectionId:i}}):d("productSelected",{productId:e,variantId:n,collectionId:i,product:r}):a?s({type:"variantUnselected",data:{productId:e,variantId:n,collectionId:i}}):d("variantSelected",{productId:e,variantId:n||O[0],collectionId:i,variant:r})}};return t.jsxs(h.ProductCardStyle,{isVariant:c,onClick:w,isActive:a,children:[c&&!(P||f)||!c&&!(P||u)?t.jsx(L.CheckBox,{isChecked:a,isPartiallyChecked:x||!1,onValueChange:function(k,O,B){B?.stopPropagation(),c?k?d(l?"productSelected":"variantSelected",{productId:e,variantId:n,collectionId:i,variant:r}):s({type:l?"productUnselected":"variantUnselected",data:{productId:e,variantId:n,collectionId:i}}):k?d("productSelected",{productId:e,collectionId:i,product:r}):s({type:"productUnselected",data:{productId:e,collectionId:i}})}}):t.jsx(t.Fragment,{}),t.jsx("div",{children:t.jsx(G.ShimmerImage,{width:40,height:40,imageUrl:r.image,alt:"Item",borderRadius:4})}),t.jsxs("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[t.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:16},children:[t.jsx(A.Tooltip,{variant:"light",body:r.name,placement:"bottom",delay:400,children:t.jsx(q.TitleSmall,{style:{flex:1},numberOfLines:1,children:r.name})}),t.jsxs(h.ProductInfo,{children:[t.jsx($.ProductPickerTag,{isVariant:o,data:y,tagText:v,tagType:U}),g&&t.jsx(H.IconButton,{onClick:()=>{S?.(r)},Icon:()=>t.jsx(F.default,{width:20,height:20,color:V.COLORS.content.placeholder})})]})]}),t.jsxs(h.ProductSubTitle,{children:[!y?.fbStatus&&o||v?null:t.jsx(q.BodyCaption,{color:V.COLORS.content.secondary,children:m}),b&&t.jsx(A.Tooltip,{body:b,placement:"top",children:t.jsx(h.SKUIDBadge,{children:t.jsx(h.EllipsedBodyTiny,{children:`SKU ID: ${b}`})})})]})]})]})};exports.ProductCard=I;exports.ProductGroup=K;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),V=require("../../constants/Theme.js"),F=require("../../assets/icons/info.svg.js"),q=require("../TypographyStyle.js"),D=require("./constants.js"),R=require("./helpers/ProductHelper.js"),$=require("./ProductPickerTag.js"),h=require("./style.js"),T=require("./utility.js"),L=require("../checkBox/CheckBox.js"),G=require("../shimmer-image/ShimmerImage.js"),A=require("../tooltips/Tooltip.js"),H=require("../icon-button/IconButton.js"),K=j=>{const{collectionId:c,productId:r,data:e,selectedData:i,selectedCollectionsDispatch:n,viewOnly:a,upliftAdditions:s,isProductPartiallyChecked:P,hideProductCheckbox:d,outOfStockAction:x,hideVariantCheckbox:u,hideProductVariants:p,pickerType:f,onProductDetailClick:l,showProductDetailInfoIcon:C}=j,S=()=>!!i?.[c]?.products?.[r],g=o=>i?.[c]?.products?.[r]?!!i?.[c]?.products?.[r]?.variants?.[o]:!1,m=!p&&T.shouldShowVariant(e)?"":`${e.currency?D.CurrencySymbols[e.currency]??"":""}${Object.values(e.variants??{})?.[0]?.price??Object.values(e.variants??{})?.[0]?.actualPrice??""}`;return t.jsxs("div",{children:[t.jsx(I,{isVariant:!1,data:e,productId:r,collectionId:c,isSelected:S(),isPartiallyChecked:P,selectedCollectionsDispatch:n,upliftAdditions:s,viewOnly:a,hideProductCheckbox:d,hideVariantCheckbox:u,hideProductVariants:p,pickerType:f,outOfStockAction:x,onProductDetailClick:l,showProductDetailInfoIcon:C,currencyAndPrice:m},r),p?null:T.shouldShowVariant(e)&&Object.keys(e.variants||[]).map(o=>{const y=`${e.currency?D.CurrencySymbols[e.currency]??"":""}${e.variants?.[o]?.price??e.variants?.[o]?.actualPrice??""}`;return t.jsx(I,{isVariant:!0,hideVariantCheckbox:u,data:{...e.variants[o],currency:e.currency},variantId:o,productId:r,viewOnly:a,upliftAdditions:s,collectionId:c,isSelected:g(o),selectedCollectionsDispatch:n,outOfStockAction:x,onProductDetailClick:l,showProductDetailInfoIcon:C,currencyAndPrice:y},o)})]})},I=j=>{const{isVariant:c,data:r,productId:e,collectionId:i,variantId:n,isSelected:a,selectedCollectionsDispatch:s,viewOnly:P,upliftAdditions:d,isPartiallyChecked:x,hideProductCheckbox:u,outOfStockAction:p,hideVariantCheckbox:f,hideProductVariants:l,pickerType:C="PRODUCT",onProductDetailClick:S,showProductDetailInfoIcon:g,currencyAndPrice:m}=j,{isVariantForProductPickerTag:o,dataForProductPickerTag:y,tagText:v,tagType:U}=R.ProductHelper.getDataForProductPickerTag(r,c,p),b=T.getSkuId(r,c),w=k=>{if(k.stopPropagation(),C==="PRODUCT"&&(u||f)){const O=Object.keys(r.variants);l?a?s({type:"productUnselected",data:{productId:e,collectionId:i}}):d("productSelected",{productId:e,variantId:n,collectionId:i,product:r}):a?s({type:"variantUnselected",data:{productId:e,variantId:n,collectionId:i}}):d("variantSelected",{productId:e,variantId:n||O[0],collectionId:i,variant:r})}};return t.jsxs(h.ProductCardStyle,{isVariant:c,onClick:w,isActive:a,children:[c&&!(P||f)||!c&&!(P||u)?t.jsx(L.CheckBox,{isChecked:a,isPartiallyChecked:x||!1,ariaLabel:r.name,onValueChange:function(k,O,B){B?.stopPropagation(),c?k?d(l?"productSelected":"variantSelected",{productId:e,variantId:n,collectionId:i,variant:r}):s({type:l?"productUnselected":"variantUnselected",data:{productId:e,variantId:n,collectionId:i}}):k?d("productSelected",{productId:e,collectionId:i,product:r}):s({type:"productUnselected",data:{productId:e,collectionId:i}})}}):t.jsx(t.Fragment,{}),t.jsx("div",{children:t.jsx(G.ShimmerImage,{width:40,height:40,imageUrl:r.image,alt:"Item",borderRadius:4})}),t.jsxs("div",{style:{display:"flex",flexDirection:"column",flex:1},children:[t.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:16},children:[t.jsx(A.Tooltip,{variant:"light",body:r.name,placement:"bottom",delay:400,children:t.jsx(q.TitleSmall,{style:{flex:1},numberOfLines:1,children:r.name})}),t.jsxs(h.ProductInfo,{children:[t.jsx($.ProductPickerTag,{isVariant:o,data:y,tagText:v,tagType:U}),g&&t.jsx(H.IconButton,{onClick:()=>{S?.(r)},Icon:()=>t.jsx(F.default,{width:20,height:20,color:V.COLORS.content.placeholder})})]})]}),t.jsxs(h.ProductSubTitle,{children:[!y?.fbStatus&&o||v?null:t.jsx(q.BodyCaption,{color:V.COLORS.content.secondary,children:m}),b&&t.jsx(A.Tooltip,{body:b,placement:"top",children:t.jsx(h.SKUIDBadge,{children:t.jsx(h.EllipsedBodyTiny,{children:`SKU ID: ${b}`})})})]})]})]})};exports.ProductCard=I;exports.ProductGroup=K;
 //# sourceMappingURL=product.js.map

package/dist/cjs/components/product-picker-v2/product.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"product.js","sources":["../../../../src/components/product-picker-v2/product.tsx"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport InfoIcon from '../../assets/icons/info.svg';\nimport { CheckBox } from '../checkBox';\nimport { IconButton } from '../icon-button';\nimport { ShimmerImage } from '../shimmer-image';\nimport { Tooltip } from '../tooltips';\nimport { BodyCaption, TitleSmall } from '../TypographyStyle';\nimport { CurrencySymbols } from './constants';\nimport { ProductHelper } from './helpers/ProductHelper';\nimport { ProductPickerTag } from './ProductPickerTag';\nimport type { SelectedCollectionsActions } from './reducers';\nimport {\n\tEllipsedBodyTiny,\n\tProductCardStyle,\n\tProductInfo,\n\tProductSubTitle,\n\tSKUIDBadge,\n} from './style';\nimport {\n\tOUT_OF_STOCK_ACTION,\n\ttype Product,\n\ttype ProductVariant,\n\ttype SelectedItems,\n} from './type';\nimport { getSkuId, shouldShowVariant } from './utility';\n\ninterface ProductGroupInterface {\n\tcollectionId: string;\n\tproductId: string;\n\tdata: Product;\n\tselectedData: SelectedItems;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tviewOnly: boolean;\n\tisProductPartiallyChecked?: boolean;\n\tupliftAdditions: any;\n\thideProductCheckbox?: boolean;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\thideVariantCheckbox?: boolean;\n\thideProductVariants?: boolean;\n\tshowProductDetailInfoIcon?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tonProductDetailClick?: (productData: Product \| ProductVariant) => void;\n}\n\nexport const ProductGroup = (props: ProductGroupInterface) => {\n\tconst {\n\t\tcollectionId,\n\t\tproductId,\n\t\tdata,\n\t\tselectedData,\n\t\tselectedCollectionsDispatch,\n\t\tviewOnly,\n\t\tupliftAdditions,\n\t\tisProductPartiallyChecked,\n\t\thideProductCheckbox,\n\t\toutOfStockAction,\n\t\thideVariantCheckbox,\n\t\thideProductVariants,\n\t\tpickerType,\n\t\tonProductDetailClick,\n\t\tshowProductDetailInfoIcon,\n\t} = props;\n\n\tconst containsProduct = () => {\n\t\tconst product = selectedData?.[collectionId]?.['products']?.[productId];\n\t\treturn product ? true : false;\n\t};\n\n\tconst containsVariant = (variantId: string) => {\n\t\tconst product = selectedData?.[collectionId]?.['products']?.[productId];\n\t\tif (!product) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst variant =\n\t\t\tselectedData?.[collectionId]?.['products']?.[productId]?.['variants']?.[\n\t\t\t\tvariantId\n\t\t\t];\n\n\t\treturn variant ? true : false;\n\t};\n\n\tconst currencyAndPriceForProduct = !(\n\t\t!hideProductVariants && shouldShowVariant(data)\n\t)\n\t\t? `${data.currency ? CurrencySymbols[data.currency] ?? '' : ''}${\n\t\t\t\tObject.values(data['variants'] ?? {})?.[0]?.price ??\n\t\t\t\tObject.values(data['variants'] ?? {})?.[0]?.actualPrice ??\n\t\t\t\t''\n\t\t }`\n\t\t: '';\n\n\treturn (\n\t\t<div>\n\t\t\t<ProductCard\n\t\t\t\tisVariant={false}\n\t\t\t\tdata={data}\n\t\t\t\tproductId={productId}\n\t\t\t\tcollectionId={collectionId}\n\t\t\t\tisSelected={containsProduct()}\n\t\t\t\tisPartiallyChecked={isProductPartiallyChecked}\n\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\tkey={productId}\n\t\t\t\tupliftAdditions={upliftAdditions}\n\t\t\t\tviewOnly={viewOnly}\n\t\t\t\thideProductCheckbox={hideProductCheckbox}\n\t\t\t\thideVariantCheckbox={hideVariantCheckbox}\n\t\t\t\thideProductVariants={hideProductVariants}\n\t\t\t\tpickerType={pickerType}\n\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\tonProductDetailClick={onProductDetailClick}\n\t\t\t\tshowProductDetailInfoIcon={showProductDetailInfoIcon}\n\t\t\t\tcurrencyAndPrice={currencyAndPriceForProduct}\n\t\t\t/>\n\n\t\t\t{hideProductVariants\n\t\t\t\t? null\n\t\t\t\t: shouldShowVariant(data) &&\n\t\t\t\t Object.keys(data['variants'] \|\| []).map((variantId: any) => {\n\t\t\t\t\t\tconst currencyAndPriceForVariant = `${\n\t\t\t\t\t\t\tdata.currency ? CurrencySymbols[data.currency] ?? '' : ''\n\t\t\t\t\t\t}${\n\t\t\t\t\t\t\tdata['variants']?.[variantId]?.price ??\n\t\t\t\t\t\t\tdata['variants']?.[variantId]?.actualPrice ??\n\t\t\t\t\t\t\t''\n\t\t\t\t\t\t}`;\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<ProductCard\n\t\t\t\t\t\t\t\tisVariant={true}\n\t\t\t\t\t\t\t\tkey={variantId}\n\t\t\t\t\t\t\t\thideVariantCheckbox={hideVariantCheckbox}\n\t\t\t\t\t\t\t\tdata={{\n\t\t\t\t\t\t\t\t\t...(data['variants'] as { [key: string]: ProductVariant })[\n\t\t\t\t\t\t\t\t\t\tvariantId\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\tcurrency: data.currency,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tvariantId={variantId}\n\t\t\t\t\t\t\t\tproductId={productId}\n\t\t\t\t\t\t\t\tviewOnly={viewOnly}\n\t\t\t\t\t\t\t\tupliftAdditions={upliftAdditions}\n\t\t\t\t\t\t\t\tcollectionId={collectionId}\n\t\t\t\t\t\t\t\tisSelected={containsVariant(variantId)}\n\t\t\t\t\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\t\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\t\t\t\t\tonProductDetailClick={onProductDetailClick}\n\t\t\t\t\t\t\t\tshowProductDetailInfoIcon={showProductDetailInfoIcon}\n\t\t\t\t\t\t\t\tcurrencyAndPrice={currencyAndPriceForVariant}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t })}\n\t\t</div>\n\t);\n};\n\ninterface ProductCardInterface {\n\tisVariant: boolean;\n\tdata: Product \| ProductVariant;\n\tproductId: string;\n\tcollectionId: string;\n\tvariantId?: string;\n\tisSelected: boolean;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tviewOnly: boolean;\n\tisPartiallyChecked?: boolean;\n\tupliftAdditions: any;\n\thideProductCheckbox?: boolean;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\thideVariantCheckbox?: boolean;\n\thideProductVariants?: boolean;\n\tshowProductDetailInfoIcon?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tonProductDetailClick?: (productData: Product \| ProductVariant) => void;\n\tcurrencyAndPrice?: string;\n}\n\nexport const ProductCard = (props: ProductCardInterface) => {\n\tconst {\n\t\tisVariant,\n\t\tdata,\n\t\tproductId,\n\t\tcollectionId,\n\t\tvariantId,\n\t\tisSelected,\n\t\tselectedCollectionsDispatch,\n\t\tviewOnly,\n\t\tupliftAdditions,\n\t\tisPartiallyChecked,\n\t\thideProductCheckbox,\n\t\toutOfStockAction,\n\t\thideVariantCheckbox,\n\t\thideProductVariants,\n\t\tpickerType = 'PRODUCT',\n\t\tonProductDetailClick,\n\t\tshowProductDetailInfoIcon,\n\t\tcurrencyAndPrice,\n\t} = props;\n\tconst {\n\t\tisVariantForProductPickerTag,\n\t\tdataForProductPickerTag,\n\t\ttagText,\n\t\ttagType,\n\t} = ProductHelper.getDataForProductPickerTag(\n\t\tdata,\n\t\tisVariant,\n\t\toutOfStockAction,\n\t);\n\n\t//show skuid for every variant\n\t//show skuid for product if there is only one variant (as the product itself is the variant)\n\tconst skuId = getSkuId(data, isVariant);\n\n\tconst onProductCardClick = (event) => {\n\t\tevent.stopPropagation();\n\n\t\tif (\n\t\t\tpickerType === 'PRODUCT' &&\n\t\t\t(hideProductCheckbox \|\| hideVariantCheckbox)\n\t\t) {\n\t\t\tconst keys = Object.keys(data['variants']);\n\t\t\tif (hideProductVariants) {\n\t\t\t\tif (!isSelected) {\n\t\t\t\t\tupliftAdditions('productSelected', {\n\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\tproduct: data,\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\ttype: 'productUnselected',\n\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (!isSelected) {\n\t\t\t\t\tupliftAdditions('variantSelected', {\n\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\tvariantId: variantId \|\| keys[0],\n\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\tvariant: data,\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\ttype: 'variantUnselected',\n\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\treturn (\n\t\t<ProductCardStyle\n\t\t\tisVariant={isVariant}\n\t\t\tonClick={onProductCardClick}\n\t\t\tisActive={isSelected}\n\t\t>\n\t\t\t{(isVariant && !(viewOnly \|\| hideVariantCheckbox)) \|\|\n\t\t\t(!isVariant && !(viewOnly \|\| hideProductCheckbox)) ? (\n\t\t\t\t<CheckBox\n\t\t\t\t\tisChecked={isSelected}\n\t\t\t\t\tisPartiallyChecked={isPartiallyChecked \|\| false}\n\t\t\t\t\tonValueChange={function (checked: boolean, _val, event): void {\n\t\t\t\t\t\tevent?.stopPropagation();\n\n\t\t\t\t\t\tif (!isVariant) {\n\t\t\t\t\t\t\tif (!checked) {\n\t\t\t\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\ttype: 'productUnselected',\n\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\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} else {\n\t\t\t\t\t\t\t\tupliftAdditions('productSelected', {\n\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t\t\t\tproduct: data,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tif (!checked) {\n\t\t\t\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\ttype: hideProductVariants\n\t\t\t\t\t\t\t\t\t\t? 'productUnselected'\n\t\t\t\t\t\t\t\t\t\t: 'variantUnselected',\n\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\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} else {\n\t\t\t\t\t\t\t\tupliftAdditions(\n\t\t\t\t\t\t\t\t\thideProductVariants ? 'productSelected' : 'variantSelected',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t\t\t\t\tvariant: data,\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}\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t\t<div>\n\t\t\t\t<ShimmerImage\n\t\t\t\t\twidth={40}\n\t\t\t\t\theight={40}\n\t\t\t\t\timageUrl={data.image}\n\t\t\t\t\talt=\"Item\"\n\t\t\t\t\tborderRadius={4}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tflex: 1,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\tgap: 16,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tvariant={'light'}\n\t\t\t\t\t\tbody={data.name}\n\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\tdelay={400}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TitleSmall\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tnumberOfLines={1}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{data.name}\n\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t</Tooltip>\n\n\t\t\t\t\t<ProductInfo>\n\t\t\t\t\t\t<ProductPickerTag\n\t\t\t\t\t\t\tisVariant={isVariantForProductPickerTag}\n\t\t\t\t\t\t\tdata={dataForProductPickerTag}\n\t\t\t\t\t\t\ttagText={tagText}\n\t\t\t\t\t\t\ttagType={tagType}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{showProductDetailInfoIcon && (\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tonProductDetailClick?.(data);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tIcon={() => (\n\t\t\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\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/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</ProductInfo>\n\t\t\t\t</div>\n\t\t\t\t<ProductSubTitle>\n\t\t\t\t\t{/* in the cases where we show tags, do not show the currency and price and sku id */}\n\t\t\t\t\t{(!(dataForProductPickerTag as ProductVariant)?.fbStatus &&\n\t\t\t\t\t\tisVariantForProductPickerTag) \|\|\n\t\t\t\t\ttagText ? null : (\n\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t{currencyAndPrice}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t)}\n\t\t\t\t\t{skuId && (\n\t\t\t\t\t\t<Tooltip body={skuId} placement=\"top\">\n\t\t\t\t\t\t\t<SKUIDBadge>\n\t\t\t\t\t\t\t\t<EllipsedBodyTiny>{`SKU ID: ${skuId}`}</EllipsedBodyTiny>\n\t\t\t\t\t\t\t</SKUIDBadge>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t)}\n\t\t\t\t</ProductSubTitle>\n\t\t\t</div>\n\t\t</ProductCardStyle>\n\t);\n};\n"],"names":["ProductGroup","props","collectionId","productId","data","selectedData","selectedCollectionsDispatch","viewOnly","upliftAdditions","isProductPartiallyChecked","hideProductCheckbox","outOfStockAction","hideVariantCheckbox","hideProductVariants","pickerType","onProductDetailClick","showProductDetailInfoIcon","containsProduct","containsVariant","variantId","currencyAndPriceForProduct","shouldShowVariant","CurrencySymbols","jsx","ProductCard","currencyAndPriceForVariant","isVariant","isSelected","isPartiallyChecked","currencyAndPrice","isVariantForProductPickerTag","dataForProductPickerTag","tagText","tagType","ProductHelper","skuId","getSkuId","onProductCardClick","event","keys","jsxs","ProductCardStyle","CheckBox","checked","_val","Fragment","ShimmerImage","Tooltip","TitleSmall","ProductInfo","ProductPickerTag","IconButton","InfoIcon","COLORS","ProductSubTitle","BodyCaption","SKUIDBadge","EllipsedBodyTiny"],"mappings":"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"}
1	+ {"version":3,"file":"product.js","sources":["../../../../src/components/product-picker-v2/product.tsx"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport InfoIcon from '../../assets/icons/info.svg';\nimport { CheckBox } from '../checkBox';\nimport { IconButton } from '../icon-button';\nimport { ShimmerImage } from '../shimmer-image';\nimport { Tooltip } from '../tooltips';\nimport { BodyCaption, TitleSmall } from '../TypographyStyle';\nimport { CurrencySymbols } from './constants';\nimport { ProductHelper } from './helpers/ProductHelper';\nimport { ProductPickerTag } from './ProductPickerTag';\nimport type { SelectedCollectionsActions } from './reducers';\nimport {\n\tEllipsedBodyTiny,\n\tProductCardStyle,\n\tProductInfo,\n\tProductSubTitle,\n\tSKUIDBadge,\n} from './style';\nimport {\n\tOUT_OF_STOCK_ACTION,\n\ttype Product,\n\ttype ProductVariant,\n\ttype SelectedItems,\n} from './type';\nimport { getSkuId, shouldShowVariant } from './utility';\n\ninterface ProductGroupInterface {\n\tcollectionId: string;\n\tproductId: string;\n\tdata: Product;\n\tselectedData: SelectedItems;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tviewOnly: boolean;\n\tisProductPartiallyChecked?: boolean;\n\tupliftAdditions: any;\n\thideProductCheckbox?: boolean;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\thideVariantCheckbox?: boolean;\n\thideProductVariants?: boolean;\n\tshowProductDetailInfoIcon?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tonProductDetailClick?: (productData: Product \| ProductVariant) => void;\n}\n\nexport const ProductGroup = (props: ProductGroupInterface) => {\n\tconst {\n\t\tcollectionId,\n\t\tproductId,\n\t\tdata,\n\t\tselectedData,\n\t\tselectedCollectionsDispatch,\n\t\tviewOnly,\n\t\tupliftAdditions,\n\t\tisProductPartiallyChecked,\n\t\thideProductCheckbox,\n\t\toutOfStockAction,\n\t\thideVariantCheckbox,\n\t\thideProductVariants,\n\t\tpickerType,\n\t\tonProductDetailClick,\n\t\tshowProductDetailInfoIcon,\n\t} = props;\n\n\tconst containsProduct = () => {\n\t\tconst product = selectedData?.[collectionId]?.['products']?.[productId];\n\t\treturn product ? true : false;\n\t};\n\n\tconst containsVariant = (variantId: string) => {\n\t\tconst product = selectedData?.[collectionId]?.['products']?.[productId];\n\t\tif (!product) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst variant =\n\t\t\tselectedData?.[collectionId]?.['products']?.[productId]?.['variants']?.[\n\t\t\t\tvariantId\n\t\t\t];\n\n\t\treturn variant ? true : false;\n\t};\n\n\tconst currencyAndPriceForProduct = !(\n\t\t!hideProductVariants && shouldShowVariant(data)\n\t)\n\t\t? `${data.currency ? CurrencySymbols[data.currency] ?? '' : ''}${\n\t\t\t\tObject.values(data['variants'] ?? {})?.[0]?.price ??\n\t\t\t\tObject.values(data['variants'] ?? {})?.[0]?.actualPrice ??\n\t\t\t\t''\n\t\t }`\n\t\t: '';\n\n\treturn (\n\t\t<div>\n\t\t\t<ProductCard\n\t\t\t\tisVariant={false}\n\t\t\t\tdata={data}\n\t\t\t\tproductId={productId}\n\t\t\t\tcollectionId={collectionId}\n\t\t\t\tisSelected={containsProduct()}\n\t\t\t\tisPartiallyChecked={isProductPartiallyChecked}\n\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\tkey={productId}\n\t\t\t\tupliftAdditions={upliftAdditions}\n\t\t\t\tviewOnly={viewOnly}\n\t\t\t\thideProductCheckbox={hideProductCheckbox}\n\t\t\t\thideVariantCheckbox={hideVariantCheckbox}\n\t\t\t\thideProductVariants={hideProductVariants}\n\t\t\t\tpickerType={pickerType}\n\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\tonProductDetailClick={onProductDetailClick}\n\t\t\t\tshowProductDetailInfoIcon={showProductDetailInfoIcon}\n\t\t\t\tcurrencyAndPrice={currencyAndPriceForProduct}\n\t\t\t/>\n\n\t\t\t{hideProductVariants\n\t\t\t\t? null\n\t\t\t\t: shouldShowVariant(data) &&\n\t\t\t\t Object.keys(data['variants'] \|\| []).map((variantId: any) => {\n\t\t\t\t\t\tconst currencyAndPriceForVariant = `${\n\t\t\t\t\t\t\tdata.currency ? CurrencySymbols[data.currency] ?? '' : ''\n\t\t\t\t\t\t}${\n\t\t\t\t\t\t\tdata['variants']?.[variantId]?.price ??\n\t\t\t\t\t\t\tdata['variants']?.[variantId]?.actualPrice ??\n\t\t\t\t\t\t\t''\n\t\t\t\t\t\t}`;\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<ProductCard\n\t\t\t\t\t\t\t\tisVariant={true}\n\t\t\t\t\t\t\t\tkey={variantId}\n\t\t\t\t\t\t\t\thideVariantCheckbox={hideVariantCheckbox}\n\t\t\t\t\t\t\t\tdata={{\n\t\t\t\t\t\t\t\t\t...(data['variants'] as { [key: string]: ProductVariant })[\n\t\t\t\t\t\t\t\t\t\tvariantId\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\tcurrency: data.currency,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tvariantId={variantId}\n\t\t\t\t\t\t\t\tproductId={productId}\n\t\t\t\t\t\t\t\tviewOnly={viewOnly}\n\t\t\t\t\t\t\t\tupliftAdditions={upliftAdditions}\n\t\t\t\t\t\t\t\tcollectionId={collectionId}\n\t\t\t\t\t\t\t\tisSelected={containsVariant(variantId)}\n\t\t\t\t\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\t\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\t\t\t\t\tonProductDetailClick={onProductDetailClick}\n\t\t\t\t\t\t\t\tshowProductDetailInfoIcon={showProductDetailInfoIcon}\n\t\t\t\t\t\t\t\tcurrencyAndPrice={currencyAndPriceForVariant}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t })}\n\t\t</div>\n\t);\n};\n\ninterface ProductCardInterface {\n\tisVariant: boolean;\n\tdata: Product \| ProductVariant;\n\tproductId: string;\n\tcollectionId: string;\n\tvariantId?: string;\n\tisSelected: boolean;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tviewOnly: boolean;\n\tisPartiallyChecked?: boolean;\n\tupliftAdditions: any;\n\thideProductCheckbox?: boolean;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\thideVariantCheckbox?: boolean;\n\thideProductVariants?: boolean;\n\tshowProductDetailInfoIcon?: boolean;\n\tpickerType?: 'COLLECTION' \| 'PRODUCT';\n\tonProductDetailClick?: (productData: Product \| ProductVariant) => void;\n\tcurrencyAndPrice?: string;\n}\n\nexport const ProductCard = (props: ProductCardInterface) => {\n\tconst {\n\t\tisVariant,\n\t\tdata,\n\t\tproductId,\n\t\tcollectionId,\n\t\tvariantId,\n\t\tisSelected,\n\t\tselectedCollectionsDispatch,\n\t\tviewOnly,\n\t\tupliftAdditions,\n\t\tisPartiallyChecked,\n\t\thideProductCheckbox,\n\t\toutOfStockAction,\n\t\thideVariantCheckbox,\n\t\thideProductVariants,\n\t\tpickerType = 'PRODUCT',\n\t\tonProductDetailClick,\n\t\tshowProductDetailInfoIcon,\n\t\tcurrencyAndPrice,\n\t} = props;\n\tconst {\n\t\tisVariantForProductPickerTag,\n\t\tdataForProductPickerTag,\n\t\ttagText,\n\t\ttagType,\n\t} = ProductHelper.getDataForProductPickerTag(\n\t\tdata,\n\t\tisVariant,\n\t\toutOfStockAction,\n\t);\n\n\t//show skuid for every variant\n\t//show skuid for product if there is only one variant (as the product itself is the variant)\n\tconst skuId = getSkuId(data, isVariant);\n\n\tconst onProductCardClick = (event) => {\n\t\tevent.stopPropagation();\n\n\t\tif (\n\t\t\tpickerType === 'PRODUCT' &&\n\t\t\t(hideProductCheckbox \|\| hideVariantCheckbox)\n\t\t) {\n\t\t\tconst keys = Object.keys(data['variants']);\n\t\t\tif (hideProductVariants) {\n\t\t\t\tif (!isSelected) {\n\t\t\t\t\tupliftAdditions('productSelected', {\n\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\tproduct: data,\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\ttype: 'productUnselected',\n\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (!isSelected) {\n\t\t\t\t\tupliftAdditions('variantSelected', {\n\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\tvariantId: variantId \|\| keys[0],\n\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\tvariant: data,\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\ttype: 'variantUnselected',\n\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\treturn (\n\t\t<ProductCardStyle\n\t\t\tisVariant={isVariant}\n\t\t\tonClick={onProductCardClick}\n\t\t\tisActive={isSelected}\n\t\t>\n\t\t\t{(isVariant && !(viewOnly \|\| hideVariantCheckbox)) \|\|\n\t\t\t(!isVariant && !(viewOnly \|\| hideProductCheckbox)) ? (\n\t\t\t\t<CheckBox\n\t\t\t\t\tisChecked={isSelected}\n\t\t\t\t\tisPartiallyChecked={isPartiallyChecked \|\| false}\n\t\t\t\t\tariaLabel={data.name}\n\t\t\t\t\tonValueChange={function (checked: boolean, _val, event): void {\n\t\t\t\t\t\tevent?.stopPropagation();\n\n\t\t\t\t\t\tif (!isVariant) {\n\t\t\t\t\t\t\tif (!checked) {\n\t\t\t\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\ttype: 'productUnselected',\n\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\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} else {\n\t\t\t\t\t\t\t\tupliftAdditions('productSelected', {\n\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t\t\t\tproduct: data,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tif (!checked) {\n\t\t\t\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\ttype: hideProductVariants\n\t\t\t\t\t\t\t\t\t\t? 'productUnselected'\n\t\t\t\t\t\t\t\t\t\t: 'variantUnselected',\n\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\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} else {\n\t\t\t\t\t\t\t\tupliftAdditions(\n\t\t\t\t\t\t\t\t\thideProductVariants ? 'productSelected' : 'variantSelected',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tproductId: productId,\n\t\t\t\t\t\t\t\t\t\tvariantId: variantId,\n\t\t\t\t\t\t\t\t\t\tcollectionId: collectionId,\n\t\t\t\t\t\t\t\t\t\tvariant: data,\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}\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t\t<div>\n\t\t\t\t<ShimmerImage\n\t\t\t\t\twidth={40}\n\t\t\t\t\theight={40}\n\t\t\t\t\timageUrl={data.image}\n\t\t\t\t\talt=\"Item\"\n\t\t\t\t\tborderRadius={4}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tflex: 1,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\tgap: 16,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tvariant={'light'}\n\t\t\t\t\t\tbody={data.name}\n\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\tdelay={400}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TitleSmall\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tnumberOfLines={1}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{data.name}\n\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t</Tooltip>\n\n\t\t\t\t\t<ProductInfo>\n\t\t\t\t\t\t<ProductPickerTag\n\t\t\t\t\t\t\tisVariant={isVariantForProductPickerTag}\n\t\t\t\t\t\t\tdata={dataForProductPickerTag}\n\t\t\t\t\t\t\ttagText={tagText}\n\t\t\t\t\t\t\ttagType={tagType}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{showProductDetailInfoIcon && (\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tonProductDetailClick?.(data);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tIcon={() => (\n\t\t\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\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/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</ProductInfo>\n\t\t\t\t</div>\n\t\t\t\t<ProductSubTitle>\n\t\t\t\t\t{/* in the cases where we show tags, do not show the currency and price and sku id */}\n\t\t\t\t\t{(!(dataForProductPickerTag as ProductVariant)?.fbStatus &&\n\t\t\t\t\t\tisVariantForProductPickerTag) \|\|\n\t\t\t\t\ttagText ? null : (\n\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t{currencyAndPrice}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t)}\n\t\t\t\t\t{skuId && (\n\t\t\t\t\t\t<Tooltip body={skuId} placement=\"top\">\n\t\t\t\t\t\t\t<SKUIDBadge>\n\t\t\t\t\t\t\t\t<EllipsedBodyTiny>{`SKU ID: ${skuId}`}</EllipsedBodyTiny>\n\t\t\t\t\t\t\t</SKUIDBadge>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t)}\n\t\t\t\t</ProductSubTitle>\n\t\t\t</div>\n\t\t</ProductCardStyle>\n\t);\n};\n"],"names":["ProductGroup","props","collectionId","productId","data","selectedData","selectedCollectionsDispatch","viewOnly","upliftAdditions","isProductPartiallyChecked","hideProductCheckbox","outOfStockAction","hideVariantCheckbox","hideProductVariants","pickerType","onProductDetailClick","showProductDetailInfoIcon","containsProduct","containsVariant","variantId","currencyAndPriceForProduct","shouldShowVariant","CurrencySymbols","jsx","ProductCard","currencyAndPriceForVariant","isVariant","isSelected","isPartiallyChecked","currencyAndPrice","isVariantForProductPickerTag","dataForProductPickerTag","tagText","tagType","ProductHelper","skuId","getSkuId","onProductCardClick","event","keys","jsxs","ProductCardStyle","CheckBox","checked","_val","Fragment","ShimmerImage","Tooltip","TitleSmall","ProductInfo","ProductPickerTag","IconButton","InfoIcon","COLORS","ProductSubTitle","BodyCaption","SKUIDBadge","EllipsedBodyTiny"],"mappings":"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"}

package/dist/cjs/components/tabs/Tabs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),C=require("react"),j=require("../../constants/Theme.js"),s=require("./Tabs.styles.js"),f=require("../tag/Tag.js"),E=e=>{const{tabs:t,initialTab:u,onTabSelected:l,TabItemStyledProps:T,selectedTab:o,extendedBorder:i,rightComponent:b,size:m="default",isSquared:x=!1,containerStyles:g}=e,[a,r]=C.useState(u||t[0].key),{colorsV2:c}=j.DEFAULT_THEME;C.useEffect(()=>{o&&o!==a&&r(o)},[o,a]);const k=e.backgroundColor,q=e.selectedTextColor??c.background.brand,I=e.textColor??c.content.secondary;return n.jsxs(s.TabHeader,{style:g??{},bgColor:k,"data-test":e["data-test"],children:[t.map((d,h)=>n.jsx(y,{hasEqualSpacing:e.hasEqualSpacing,selectedTextColor:q,textColor:I,tab:d,currentTab:a,TabItemStyledProps:T,IconComponent:d.icon,size:m,setCurrentTab:S=>{r(S),l&&l(S)},isSquared:x,isFirstlement:h==0,isLastElement:h==t.length-1,iconPosition:d.iconPosition??"left"},d.key)),i&&n.jsx(s.EmptyTab,{}),n.jsx(s.RightComponent,{children:b})]})},y=e=>{const{tab:t,currentTab:u,setCurrentTab:l,TabItemStyledProps:T,IconComponent:o,iconPosition:i="left",size:b="default",isSquared:m=!1,isFirstlement:x,isLastElement:g}=e,a=t.key===u,{colorsV2:r}=j.DEFAULT_THEME,c=C.useCallback(()=>({...T,borderRadius:e.isSquared?x?"4px 0px 0px 4px":g?"0px 4px 4px 0px":"":""}),[]);return n.jsxs(s.TabItem,{style:c(),selected:a,hasEqualSpacing:e.hasEqualSpacing,onClick:()=>l(e.tab.key),selectedTextColor:e.selectedTextColor,isSquared:m,"data-test":e["data-test"],children:[o&&i==="left"&&n.jsx(o,{selected:a?r.background.brand:r.content.secondary}),t.leadingNumber!==void 0&&t.leadingNumber!==null&&n.jsx(s.TrailingNumberContainer,{selected:a,children:n.jsx(f.Tag,{tagText:t?.leadingNumber??0,theme:"dark",type:t.numberTagType,variant:"circle",color:r.content.primaryInverse})}),n.jsx(s.TabItemText,{style:b==="small"?{fontSize:14,fontStyle:"normal",fontWeight:600}:void 0,textColor:e.textColor,selectedTextColor:e.selectedTextColor,selected:a,children:t.title}),t.trailingNumber!==void 0&&t.trailingNumber!==null&&n.jsx(s.TrailingNumberContainer,{selected:a,children:n.jsx(f.Tag,{tagText:t?.trailingNumber??0,theme:"dark",type:t.numberTagType,variant:"circle",color:r.content.primaryInverse})}),o&&i==="right"&&n.jsx(o,{selected:a?r.background.brand:r.content.secondary})]})};E.displayName="Tabs";y.displayName="TabItemComponent";exports.TabItemComponent=y;exports.Tabs=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),C=require("react"),E=require("../../constants/Theme.js"),l=require("./Tabs.styles.js"),j=require("../tag/Tag.js"),N=e=>{const{tabs:t,initialTab:u,onTabSelected:c,TabItemStyledProps:b,selectedTab:a,extendedBorder:i,rightComponent:m,size:T="default",isSquared:g=!1,containerStyles:x,gap:r,selectedNumberBackground:o}=e,[s,f]=C.useState(u||t[0].key),{colorsV2:h}=E.DEFAULT_THEME;C.useEffect(()=>{a&&a!==s&&f(a)},[a,s]);const q=e.backgroundColor,I=e.selectedTextColor??h.background.brand,B=e.textColor??h.content.secondary;return n.jsxs(l.TabHeader,{style:x??{},bgColor:q,tabGap:r,"data-test":e["data-test"],children:[t.map((d,k)=>n.jsx(y,{hasEqualSpacing:e.hasEqualSpacing,uniformBorder:!!r,selectedTextColor:I,textColor:B,tab:d,currentTab:s,TabItemStyledProps:b,IconComponent:d.icon,size:T,selectedNumberBackground:o,setCurrentTab:S=>{f(S),c&&c(S)},isSquared:g,isFirstlement:k==0,isLastElement:k==t.length-1,iconPosition:d.iconPosition??"left"},d.key)),i&&n.jsx(l.EmptyTab,{}),n.jsx(l.RightComponent,{children:m})]})},y=e=>{const{tab:t,currentTab:u,setCurrentTab:c,TabItemStyledProps:b,IconComponent:a,iconPosition:i="left",size:m="default",isSquared:T=!1,isFirstlement:g,isLastElement:x}=e,r=t.key===u,{colorsV2:o}=E.DEFAULT_THEME,s=C.useCallback(()=>({...b,borderRadius:e.isSquared?g?"4px 0px 0px 4px":x?"0px 4px 4px 0px":"":""}),[]);return n.jsxs(l.TabItem,{style:s(),selected:r,uniformBorder:e.uniformBorder,hasEqualSpacing:e.hasEqualSpacing,onClick:()=>c(e.tab.key),selectedTextColor:e.selectedTextColor,isSquared:T,"data-test":e["data-test"],children:[a&&i==="left"&&n.jsx(a,{selected:r?o.background.brand:o.content.secondary}),t.leadingNumber!==void 0&&t.leadingNumber!==null&&n.jsx(l.TrailingNumberContainer,{selected:r,selectedBackground:e.selectedNumberBackground,children:n.jsx(j.Tag,{tagText:t?.leadingNumber??0,theme:"dark",type:t.numberTagType,variant:"circle",color:o.content.primaryInverse})}),n.jsx(l.TabItemText,{style:m==="small"?{fontSize:14,fontStyle:"normal",fontWeight:600}:void 0,textColor:e.textColor,selectedTextColor:e.selectedTextColor,selected:r,children:t.title}),t.trailingNumber!==void 0&&t.trailingNumber!==null&&n.jsx(l.TrailingNumberContainer,{selected:r,selectedBackground:e.selectedNumberBackground,children:n.jsx(j.Tag,{tagText:t?.trailingNumber??0,theme:"dark",type:t.numberTagType,variant:"circle",color:o.content.primaryInverse})}),a&&i==="right"&&n.jsx(a,{selected:r?o.background.brand:o.content.secondary})]})};N.displayName="Tabs";y.displayName="TabItemComponent";exports.TabItemComponent=y;exports.Tabs=N;
 //# sourceMappingURL=Tabs.js.map

package/dist/cjs/components/tabs/Tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.js","sources":["../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\nimport { DEFAULT_THEME } from '@src/constants/Theme';\nimport { Tag } from '../tag';\nimport { TabItemComponentProps, TabViewHeaderProps } from './Tabs.model';\nimport {\n\tEmptyTab,\n\tRightComponent,\n\tTabHeader,\n\tTabItem,\n\tTabItemText,\n\tTrailingNumberContainer,\n} from './Tabs.styles';\n\nexport const Tabs: React.FC<TabViewHeaderProps> = (props) => {\n\tconst {\n\t\ttabs,\n\t\tinitialTab,\n\t\tonTabSelected,\n\t\tTabItemStyledProps,\n\t\tselectedTab,\n\t\textendedBorder,\n\t\trightComponent,\n\t\tsize = 'default',\n\t\tisSquared = false,\n\t\tcontainerStyles,\n\t} = props;\n\tconst [currentTab, setCurrentTab] = useState(initialTab \|\| tabs[0].key);\n\tconst { colorsV2 } = DEFAULT_THEME;\n\n\tuseEffect(() => {\n\t\tif (selectedTab && selectedTab !== currentTab) {\n\t\t\tsetCurrentTab(selectedTab);\n\t\t}\n\t}, [selectedTab, currentTab]);\n\n\tconst backgroundColor = props.backgroundColor;\n\tconst selectedTextColor =\n\t\tprops.selectedTextColor ?? colorsV2.background.brand;\n\tconst textColor = props.textColor ?? colorsV2.content.secondary;\n\n\treturn (\n\t\t<TabHeader\n\t\t\tstyle={containerStyles ?? {}}\n\t\t\tbgColor={backgroundColor}\n\t\t\tdata-test={props['data-test']}\n\t\t>\n\t\t\t{tabs.map((tab, index) => (\n\t\t\t\t<TabItemComponent\n\t\t\t\t\thasEqualSpacing={props.hasEqualSpacing}\n\t\t\t\t\tselectedTextColor={selectedTextColor}\n\t\t\t\t\ttextColor={textColor}\n\t\t\t\t\tkey={tab.key}\n\t\t\t\t\ttab={tab}\n\t\t\t\t\tcurrentTab={currentTab}\n\t\t\t\t\tTabItemStyledProps={TabItemStyledProps}\n\t\t\t\t\tIconComponent={tab.icon}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tsetCurrentTab={(tabKey) => {\n\t\t\t\t\t\tsetCurrentTab(tabKey);\n\t\t\t\t\t\tif (onTabSelected) {\n\t\t\t\t\t\t\tonTabSelected(tabKey as string);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t\tisSquared={isSquared}\n\t\t\t\t\tisFirstlement={index == 0}\n\t\t\t\t\tisLastElement={index == tabs.length - 1}\n\t\t\t\t\ticonPosition={tab.iconPosition ?? 'left'}\n\t\t\t\t/>\n\t\t\t))}\n\t\t\t{extendedBorder && <EmptyTab />}\n\t\t\t<RightComponent>{rightComponent}</RightComponent>\n\t\t</TabHeader>\n\t);\n};\n\nexport const TabItemComponent: React.FC<TabItemComponentProps> = (props) => {\n\tconst {\n\t\ttab,\n\t\tcurrentTab,\n\t\tsetCurrentTab,\n\t\tTabItemStyledProps,\n\t\tIconComponent,\n\t\ticonPosition = 'left',\n\t\tsize = 'default',\n\t\tisSquared = false,\n\t\tisFirstlement,\n\t\tisLastElement,\n\t} = props;\n\tconst selected = tab.key === currentTab;\n\tconst { colorsV2 } = DEFAULT_THEME;\n\n\tconst tabStyles = useCallback(() => {\n\t\treturn {\n\t\t\t...TabItemStyledProps,\n\t\t\tborderRadius: props.isSquared\n\t\t\t\t? isFirstlement\n\t\t\t\t\t? '4px 0px 0px 4px'\n\t\t\t\t\t: isLastElement\n\t\t\t\t\t? '0px 4px 4px 0px'\n\t\t\t\t\t: ''\n\t\t\t\t: '',\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\n\treturn (\n\t\t<TabItem\n\t\t\tstyle={tabStyles()}\n\t\t\tselected={selected}\n\t\t\thasEqualSpacing={props.hasEqualSpacing}\n\t\t\tonClick={() => setCurrentTab(props.tab.key)}\n\t\t\tselectedTextColor={props.selectedTextColor}\n\t\t\tisSquared={isSquared}\n\t\t\tdata-test={props['data-test']}\n\t\t>\n\t\t\t{IconComponent && iconPosition === 'left' && (\n\t\t\t\t<IconComponent\n\t\t\t\t\tselected={\n\t\t\t\t\t\tselected ? colorsV2.background.brand : colorsV2.content.secondary\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{tab.leadingNumber !== undefined && tab.leadingNumber !== null && (\n\t\t\t\t<TrailingNumberContainer ~~selected~~={selected}>\n\t\t\t\t\t<Tag\n\t\t\t\t\t\ttagText={tab?.leadingNumber ?? 0}\n\t\t\t\t\t\ttheme=\"dark\"\n\t\t\t\t\t\ttype={tab.numberTagType}\n\t\t\t\t\t\tvariant=\"circle\"\n\t\t\t\t\t\tcolor={colorsV2.content.primaryInverse}\n\t\t\t\t\t/>\n\t\t\t\t</TrailingNumberContainer>\n\t\t\t)}\n\t\t\t<TabItemText\n\t\t\t\tstyle={\n\t\t\t\t\tsize === 'small'\n\t\t\t\t\t\t? { fontSize: 14, fontStyle: 'normal', fontWeight: 600 }\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\ttextColor={props.textColor}\n\t\t\t\tselectedTextColor={props.selectedTextColor}\n\t\t\t\tselected={selected}\n\t\t\t>\n\t\t\t\t{tab.title}\n\t\t\t</TabItemText>\n\t\t\t{tab.trailingNumber !== undefined && tab.trailingNumber !== null && (\n\t\t\t\t<TrailingNumberContainer ~~selected~~={selected}>\n\t\t\t\t\t<Tag\n\t\t\t\t\t\ttagText={tab?.trailingNumber ?? 0}\n\t\t\t\t\t\ttheme=\"dark\"\n\t\t\t\t\t\ttype={tab.numberTagType}\n\t\t\t\t\t\tvariant=\"circle\"\n\t\t\t\t\t\tcolor={colorsV2.content.primaryInverse}\n\t\t\t\t\t/>\n\t\t\t\t</TrailingNumberContainer>\n\t\t\t)}\n\t\t\t{IconComponent && iconPosition === 'right' && (\n\t\t\t\t<IconComponent\n\t\t\t\t\tselected={\n\t\t\t\t\t\tselected ? colorsV2.background.brand : colorsV2.content.secondary\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</TabItem>\n\t);\n};\n\nTabs.displayName = 'Tabs';\n\nTabItemComponent.displayName = 'TabItemComponent';\n"],"names":["Tabs","props","tabs","initialTab","onTabSelected","TabItemStyledProps","selectedTab","extendedBorder","rightComponent","size","isSquared","containerStyles","currentTab","setCurrentTab","useState","colorsV2","DEFAULT_THEME","useEffect","backgroundColor","selectedTextColor","textColor","jsxs","TabHeader","tab","index","jsx","TabItemComponent","tabKey","EmptyTab","RightComponent","IconComponent","iconPosition","isFirstlement","isLastElement","selected","tabStyles","useCallback","TabItem","TrailingNumberContainer","Tag","TabItemText"],"mappings":"uOAaaA,EAAsCC,GAAU,CAC5D,KAAM,CACL,KAAAC,EACA,WAAAC,EACA,cAAAC,EACA,mBAAAC,EACA,YAAAC,EACA,eAAAC,EACA,eAAAC,EACA,KAAAC,EAAO,UACP,UAAAC,EAAY,GACZ,gBAAAC,CAAA,~~EACGV~~,EACE,~~CAACW~~,EAAYC,CAAa,EAAIC,EAAAA,~~SAASX~~,GAAcD,EAAK,CAAC,EAAE,GAAG,EAChE,CAAE,~~SAAAa~~,GAAaC,EAAAA,cAErBC,EAAAA,UAAU,IAAM,~~CACXX~~,GAAeA,~~IAAgBM~~,GAClCC,~~EAAcP~~,CAAW,CAE3B,EAAG,CAACA,~~EAAaM~~,CAAU,CAAC,EAE5B,MAAMM,~~EAAkBjB~~,EAAM,~~gBACxBkB~~,~~EACLlB~~,EAAM,~~mBAAqBc~~,EAAS,WAAW,MAC1CK,~~EAAYnB~~,EAAM,~~WAAac~~,EAAS,QAAQ,UAEtD,OACCM,EAAAA,KAACC,EAAAA,UAAA,CACA,~~MAAOX~~,GAAmB,CAAA,EAC1B,~~QAASO~~,EACT,~~YAAWjB~~,EAAM,WAAW,EAE3B,SAAA,CAAAC,EAAK,IAAI,~~CAACqB~~,EAAKC,IACfC,EAAAA,IAACC,EAAA,CACA,~~gBAAiBzB~~,EAAM,gBACvB,~~kBAAAkB~~,EACA,UAAAC,EAEA,IAAAG,EACA,WAAAX,EACA,~~mBAAAP~~,EACA,~~cAAekB~~,EAAI,KACnB,~~KAAAd~~,EACA,~~cAAgBkB~~,GAAW,CAC1Bd,EAAcc,CAAM,~~EAChBvB~~,GACHA,~~EAAcuB~~,CAAgB,CAEhC,EACA,~~UAAAjB~~,EACA,~~cAAec~~,GAAS,EACxB,cAAeA,~~GAAStB~~,EAAK,OAAS,EACtC,~~aAAcqB~~,EAAI,cAAgB,MAAA,~~EAf7BA~~,EAAI,GAAA,~~CAiBV~~,~~EACAhB~~,~~SAAmBqB~~,EAAAA,SAAA,EAAS,EAC7BH,EAAAA,IAACI,EAAAA,gBAAgB,~~SAAArB~~,CAAA,CAAe,CAAA,CAAA,CAAA,CAGnC,~~EAEakB~~,~~EAAqDzB~~,GAAU,CAC3E,KAAM,CACL,~~IAAAsB~~,EACA,WAAAX,EACA,cAAAC,EACA,~~mBAAAR~~,EACA,~~cAAAyB~~,EACA,aAAAC,EAAe,OACf,~~KAAAtB~~,EAAO,UACP,UAAAC,EAAY,GACZ,~~cAAAsB~~,EACA,cAAAC,CAAA,~~EACGhC~~,~~EACEiC~~,EAAWX,EAAI,MAAQX,EACvB,CAAE,SAAAG,GAAaC,EAAAA,cAEfmB,EAAYC,EAAAA,YAAY,KACtB,CACN,~~GAAG/B~~,EACH,aAAcJ,EAAM,~~UACjB+B~~,EACC,kBACAC,EACA,kBACA,GACD,EAAA,GAGF,CAAA,CAAE,EAEL,OACCZ,EAAAA,KAACgB,EAAAA,QAAA,CACA,MAAOF,EAAA,EACP,SAAAD,EACA,~~gBAAiBjC~~,EAAM,gBACvB,QAAS,~~IAAMY~~,~~EAAcZ~~,EAAM,IAAI,GAAG,EAC1C,kBAAmBA,EAAM,kBACzB,UAAAS,EACA,YAAWT,EAAM,WAAW,EAE3B,SAAA,~~CAAA6B~~,GAAiBC,IAAiB,QAClCN,EAAAA,IAACK,EAAA,CACA,SACCI,EAAWnB,EAAS,WAAW,MAAQA,EAAS,QAAQ,SAAA,CAAA,EAI1DQ,EAAI,gBAAkB,QAAaA,EAAI,gBAAkB,MACzDE,EAAAA,IAACa,EAAAA,~~yBAAwB~~,SAAAJ,~~EACxB~~,~~SAAAT~~,EAAAA,IAACc,EAAAA,IAAA,CACA,QAAShB,GAAK,eAAiB,EAC/B,MAAM,OACN,KAAMA,EAAI,cACV,QAAQ,SACR,MAAOR,EAAS,QAAQ,cAAA,CAAA,~~EAE1B~~,~~EAEDU~~,EAAAA,IAACe,EAAAA,YAAA,CACA,~~MACC/B~~,IAAS,QACN,CAAE,SAAU,GAAI,UAAW,SAAU,WAAY,GAAA,EACjD,OAEJ,UAAWR,EAAM,UACjB,kBAAmBA,EAAM,kBACzB,~~SAAAiC~~,EAEC,SAAAX,EAAI,KAAA,CAAA,EAELA,EAAI,iBAAmB,QAAaA,EAAI,iBAAmB,MAC3DE,EAAAA,IAACa,EAAAA,~~yBAAwB~~,SAAAJ,~~EACxB~~,~~SAAAT~~,EAAAA,IAACc,EAAAA,IAAA,CACA,QAAShB,GAAK,gBAAkB,EAChC,MAAM,OACN,KAAMA,EAAI,cACV,QAAQ,SACR,MAAOR,EAAS,QAAQ,cAAA,CAAA,~~EAE1B~~,~~EAEAe~~,GAAiBC,IAAiB,SAClCN,EAAAA,IAACK,EAAA,CACA,SACCI,EAAWnB,EAAS,WAAW,MAAQA,EAAS,QAAQ,SAAA,CAAA,CAE1D,CAAA,CAAA,CAIJ,~~EAEAf~~,EAAK,YAAc,~~OAEnB0B~~,EAAiB,YAAc"}
1	+ {"version":3,"file":"Tabs.js","sources":["../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\nimport { DEFAULT_THEME } from '@src/constants/Theme';\nimport { Tag } from '../tag';\nimport { TabItemComponentProps, TabViewHeaderProps } from './Tabs.model';\nimport {\n\tEmptyTab,\n\tRightComponent,\n\tTabHeader,\n\tTabItem,\n\tTabItemText,\n\tTrailingNumberContainer,\n} from './Tabs.styles';\n\nexport const Tabs: React.FC<TabViewHeaderProps> = (props) => {\n\tconst {\n\t\ttabs,\n\t\tinitialTab,\n\t\tonTabSelected,\n\t\tTabItemStyledProps,\n\t\tselectedTab,\n\t\textendedBorder,\n\t\trightComponent,\n\t\tsize = 'default',\n\t\tisSquared = false,\n\t\tcontainerStyles,\n\t\tgap,\n\t\tselectedNumberBackground,\n\t} = props;\n\tconst [currentTab, setCurrentTab] = useState(initialTab \|\| tabs[0].key);\n\tconst { colorsV2 } = DEFAULT_THEME;\n\n\tuseEffect(() => {\n\t\tif (selectedTab && selectedTab !== currentTab) {\n\t\t\tsetCurrentTab(selectedTab);\n\t\t}\n\t}, [selectedTab, currentTab]);\n\n\tconst backgroundColor = props.backgroundColor;\n\tconst selectedTextColor =\n\t\tprops.selectedTextColor ?? colorsV2.background.brand;\n\tconst textColor = props.textColor ?? colorsV2.content.secondary;\n\n\treturn (\n\t\t<TabHeader\n\t\t\tstyle={containerStyles ?? {}}\n\t\t\tbgColor={backgroundColor}\n\t\t\ttabGap={gap}\n\t\t\tdata-test={props['data-test']}\n\t\t>\n\t\t\t{tabs.map((tab, index) => (\n\t\t\t\t<TabItemComponent\n\t\t\t\t\thasEqualSpacing={props.hasEqualSpacing}\n\t\t\t\t\tuniformBorder={!!gap}\n\t\t\t\t\tselectedTextColor={selectedTextColor}\n\t\t\t\t\ttextColor={textColor}\n\t\t\t\t\tkey={tab.key}\n\t\t\t\t\ttab={tab}\n\t\t\t\t\tcurrentTab={currentTab}\n\t\t\t\t\tTabItemStyledProps={TabItemStyledProps}\n\t\t\t\t\tIconComponent={tab.icon}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tselectedNumberBackground={selectedNumberBackground}\n\t\t\t\t\tsetCurrentTab={(tabKey) => {\n\t\t\t\t\t\tsetCurrentTab(tabKey);\n\t\t\t\t\t\tif (onTabSelected) {\n\t\t\t\t\t\t\tonTabSelected(tabKey as string);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t\tisSquared={isSquared}\n\t\t\t\t\tisFirstlement={index == 0}\n\t\t\t\t\tisLastElement={index == tabs.length - 1}\n\t\t\t\t\ticonPosition={tab.iconPosition ?? 'left'}\n\t\t\t\t/>\n\t\t\t))}\n\t\t\t{extendedBorder && <EmptyTab />}\n\t\t\t<RightComponent>{rightComponent}</RightComponent>\n\t\t</TabHeader>\n\t);\n};\n\nexport const TabItemComponent: React.FC<TabItemComponentProps> = (props) => {\n\tconst {\n\t\ttab,\n\t\tcurrentTab,\n\t\tsetCurrentTab,\n\t\tTabItemStyledProps,\n\t\tIconComponent,\n\t\ticonPosition = 'left',\n\t\tsize = 'default',\n\t\tisSquared = false,\n\t\tisFirstlement,\n\t\tisLastElement,\n\t} = props;\n\tconst selected = tab.key === currentTab;\n\tconst { colorsV2 } = DEFAULT_THEME;\n\n\tconst tabStyles = useCallback(() => {\n\t\treturn {\n\t\t\t...TabItemStyledProps,\n\t\t\tborderRadius: props.isSquared\n\t\t\t\t? isFirstlement\n\t\t\t\t\t? '4px 0px 0px 4px'\n\t\t\t\t\t: isLastElement\n\t\t\t\t\t? '0px 4px 4px 0px'\n\t\t\t\t\t: ''\n\t\t\t\t: '',\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\n\treturn (\n\t\t<TabItem\n\t\t\tstyle={tabStyles()}\n\t\t\tselected={selected}\n\t\t\tuniformBorder={props.uniformBorder}\n\t\t\thasEqualSpacing={props.hasEqualSpacing}\n\t\t\tonClick={() => setCurrentTab(props.tab.key)}\n\t\t\tselectedTextColor={props.selectedTextColor}\n\t\t\tisSquared={isSquared}\n\t\t\tdata-test={props['data-test']}\n\t\t>\n\t\t\t{IconComponent && iconPosition === 'left' && (\n\t\t\t\t<IconComponent\n\t\t\t\t\tselected={\n\t\t\t\t\t\tselected ? colorsV2.background.brand : colorsV2.content.secondary\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{tab.leadingNumber !== undefined && tab.leadingNumber !== null && (\n\t\t\t\t<TrailingNumberContainer\n\t\t\t\t\tselected={selected}\n\t\t\t\t\tselectedBackground={props.selectedNumberBackground}\n\t\t\t\t>\n\t\t\t\t\t<Tag\n\t\t\t\t\t\ttagText={tab?.leadingNumber ?? 0}\n\t\t\t\t\t\ttheme=\"dark\"\n\t\t\t\t\t\ttype={tab.numberTagType}\n\t\t\t\t\t\tvariant=\"circle\"\n\t\t\t\t\t\tcolor={colorsV2.content.primaryInverse}\n\t\t\t\t\t/>\n\t\t\t\t</TrailingNumberContainer>\n\t\t\t)}\n\t\t\t<TabItemText\n\t\t\t\tstyle={\n\t\t\t\t\tsize === 'small'\n\t\t\t\t\t\t? { fontSize: 14, fontStyle: 'normal', fontWeight: 600 }\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\ttextColor={props.textColor}\n\t\t\t\tselectedTextColor={props.selectedTextColor}\n\t\t\t\tselected={selected}\n\t\t\t>\n\t\t\t\t{tab.title}\n\t\t\t</TabItemText>\n\t\t\t{tab.trailingNumber !== undefined && tab.trailingNumber !== null && (\n\t\t\t\t<TrailingNumberContainer\n\t\t\t\t\tselected={selected}\n\t\t\t\t\tselectedBackground={props.selectedNumberBackground}\n\t\t\t\t>\n\t\t\t\t\t<Tag\n\t\t\t\t\t\ttagText={tab?.trailingNumber ?? 0}\n\t\t\t\t\t\ttheme=\"dark\"\n\t\t\t\t\t\ttype={tab.numberTagType}\n\t\t\t\t\t\tvariant=\"circle\"\n\t\t\t\t\t\tcolor={colorsV2.content.primaryInverse}\n\t\t\t\t\t/>\n\t\t\t\t</TrailingNumberContainer>\n\t\t\t)}\n\t\t\t{IconComponent && iconPosition === 'right' && (\n\t\t\t\t<IconComponent\n\t\t\t\t\tselected={\n\t\t\t\t\t\tselected ? colorsV2.background.brand : colorsV2.content.secondary\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</TabItem>\n\t);\n};\n\nTabs.displayName = 'Tabs';\n\nTabItemComponent.displayName = 'TabItemComponent';\n"],"names":["Tabs","props","tabs","initialTab","onTabSelected","TabItemStyledProps","selectedTab","extendedBorder","rightComponent","size","isSquared","containerStyles","gap","selectedNumberBackground","currentTab","setCurrentTab","useState","colorsV2","DEFAULT_THEME","useEffect","backgroundColor","selectedTextColor","textColor","jsxs","TabHeader","tab","index","jsx","TabItemComponent","tabKey","EmptyTab","RightComponent","IconComponent","iconPosition","isFirstlement","isLastElement","selected","tabStyles","useCallback","TabItem","TrailingNumberContainer","Tag","TabItemText"],"mappings":"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"}