@bikdotai/bik-component-library 0.0.808-beta.0 → 0.0.809-beta.0

package/dist/cjs/components/floating-input-dropdown/FloatingInputDropdown.js

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),t=require("react-popper"),o=require("styled-components"),s=require("../dropShadow/DropShadow.js"),r=require("../dropdown/Common.styled.js"),i=require("../dropdown/OpenedDropdown/components/OpennedDropdown.js"),l=require("../floater/floater.js"),a=require("../input/Input.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=d(o).default(r.OpenDropdownContainer)`
-	opacity: ${({visible:e})=>e?1:0};
-	visibility: ${({visible:e})=>e?"visible":"hidden"};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("react-popper"),o=require("styled-components"),r=require("../dropShadow/DropShadow.js"),s=require("../dropdown/Common.styled.js"),i=require("../dropdown/OpenedDropdown/components/OpennedDropdown.js"),l=require("../floater/floater.js"),a=require("../input/Input.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=d(o).default(s.OpenDropdownContainer)`
+	opacity: ${e=>{let{visible:t}=e;return t?1:0}};
+	visibility: ${e=>{let{visible:t}=e;return t?"visible":"hidden"}};
 	transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
-`;exports.FloatingInputDropdown=({inputProps:o,dropdownProps:r,floaterProps:d,children:u,isVisible:c,onDropdownOptionClick:f,onChangeText:v})=>{const b=n.useRef(null),j=n.useRef(null),[m,w]=n.useState(!1),[O,g]=n.useState(null),[h,x]=n.useState(null),[y,S]=n.useState(!1),{styles:D,attributes:q,update:C,forceUpdate:P}=t.usePopper(h,O,{placement:r.placement,strategy:r.strategy,modifiers:[{name:"offset",options:{offset:[0,0]}},{name:"preventOverflow",options:{padding:{top:0,bottom:10,left:0,right:0}}},{name:"flip",options:{fallbackPlacements:["bottom","top"]}}]});n.useEffect((()=>{if(!m){const e=setTimeout((()=>S(!1)),200);return()=>clearTimeout(e)}S(!0),C&&C()}),[m,C]),n.useEffect((()=>{if(b.current){const e=new ResizeObserver((()=>{C&&C()}));return e.observe(b.current),()=>{e.disconnect()}}}),[b.current,C]);return e.jsxs(e.Fragment,{children:[c&&e.jsxs(l.Floater,Object.assign({},d,{refElement:j},{children:[e.jsx("div",Object.assign({style:{position:"relative"},ref:x},{children:e.jsx(s.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e.jsx(a.Input,Object.assign({},o,{onClick:()=>{var e;null===(e=r.onDropdownOpen)||void 0===e||e.call(r),m?w(!1):r.disabled||w(!0),null==P||P()},ref:b,onChangeText:(e,n)=>{null==v||v(e,n),C&&C()}}))}))})),e.jsx(p,Object.assign({ref:g,style:Object.assign(Object.assign({},D.popper),{zIndex:3})},q.popper,{visible:m||y},{children:e.jsx(s.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e.jsx(i.OpenedDropdown,Object.assign({},r,{onSelect:e=>{var n;"2.0"===r.version&&r.isMultiSelect||(null===(n=r.onSelect)||void 0===n||n.call(r,e),w(!1))},onClose:e=>{var n,t;"2.0"===r.version&&r.isMultiSelect&&e&&(null===(n=r.onSelect)||void 0===n||n.call(r,[...e])),w(!1),null===(t=null==r?void 0:r.onClose)||void 0===t||t.call(r)},version:r.version,headerRef:b,onDropdownItemClick:e=>{null==f||f(e)}}))}))}))]})),e.jsx("div",Object.assign({ref:j},{children:u&&e.jsx("div",{children:u})}))]})};
+`;exports.FloatingInputDropdown=o=>{let{inputProps:s,dropdownProps:d,floaterProps:u,children:c,isVisible:f,onDropdownOptionClick:v,onChangeText:b}=o;const j=t.useRef(null),m=t.useRef(null),[w,O]=t.useState(!1),[g,h]=t.useState(null),[x,y]=t.useState(null),[S,D]=t.useState(!1),{styles:q,attributes:C,update:P,forceUpdate:R}=n.usePopper(x,g,{placement:d.placement,strategy:d.strategy,modifiers:[{name:"offset",options:{offset:[0,0]}},{name:"preventOverflow",options:{padding:{top:0,bottom:10,left:0,right:0}}},{name:"flip",options:{fallbackPlacements:["bottom","top"]}}]});t.useEffect((()=>{if(!w){const e=setTimeout((()=>D(!1)),200);return()=>clearTimeout(e)}D(!0),P&&P()}),[w,P]),t.useEffect((()=>{if(j.current){const e=new ResizeObserver((()=>{P&&P()}));return e.observe(j.current),()=>{e.disconnect()}}}),[j.current,P]);return e.jsxs(e.Fragment,{children:[f&&e.jsxs(l.Floater,Object.assign({},u,{refElement:m},{children:[e.jsx("div",Object.assign({style:{position:"relative"},ref:y},{children:e.jsx(r.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e.jsx(a.Input,Object.assign({},s,{onClick:()=>{var e;null===(e=d.onDropdownOpen)||void 0===e||e.call(d),w?O(!1):d.disabled||O(!0),null==R||R()},ref:j,onChangeText:(e,t)=>{null==b||b(e,t),P&&P()}}))}))})),e.jsx(p,Object.assign({ref:h,style:Object.assign(Object.assign({},q.popper),{zIndex:3})},C.popper,{visible:w||S},{children:e.jsx(r.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e.jsx(i.OpenedDropdown,Object.assign({},d,{onSelect:e=>{var t;"2.0"===d.version&&d.isMultiSelect||(null===(t=d.onSelect)||void 0===t||t.call(d,e),O(!1))},onClose:e=>{var t,n;"2.0"===d.version&&d.isMultiSelect&&e&&(null===(t=d.onSelect)||void 0===t||t.call(d,[...e])),O(!1),null===(n=null==d?void 0:d.onClose)||void 0===n||n.call(d)},version:d.version,headerRef:j,onDropdownItemClick:e=>{null==v||v(e)}}))}))}))]})),e.jsx("div",Object.assign({ref:m},{children:c&&e.jsx("div",{children:c})}))]})};
 //# sourceMappingURL=FloatingInputDropdown.js.map

package/dist/cjs/components/floating-input-dropdown/FloatingInputDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingInputDropdown.js","sources":["../../../../src/components/floating-input-dropdown/FloatingInputDropdown.tsx"],"sourcesContent":["import React, { LegacyRef, Ref, useEffect, useRef, useState } from 'react';\nimport { usePopper } from 'react-popper';\nimport styled from 'styled-components';\nimport { DropShadow } from '@src/components/dropShadow';\nimport { Placement } from '@src/components/tooltips';\nimport { OpenDropdownContainer } from '../dropdown/Common.styled';\nimport { OpenedDropdown } from '../dropdown/OpenedDropdown';\nimport { DropdownOption, OpenDropdownProps } from '../dropdown/type';\nimport { Floater } from '../floater';\nimport { FloaterProps } from '../floater/floater';\nimport { Input } from '../input';\nimport { InputProps } from '../input/Input.model';\n\ntype DropdownProps = OpenDropdownProps & {\n\tisLoading?: boolean;\n\tchildren?: React.ReactNode;\n\tdisabled?: boolean;\n\tonDropdownOpen?: () => void;\n\tonDropdownVisbilityChange?: (isOpen: boolean) => void;\n\ttooltipContent?: string;\n\ttooltipDirection?: Placement;\n\tshowTooltipArrow?: boolean;\n};\n\ntype FloatingInputDropdownProps = {\n\tinputProps: InputProps;\n\tdropdownProps: DropdownProps;\n\tfloaterProps: FloaterProps;\n\tchildren?: React.ReactNode;\n\tisVisible?: boolean;\n\tonDropdownOptionClick?: (option: DropdownOption) => void;\n\tonChangeText?: (text: string, event?: Event) => void;\n};\n\nconst AnimatedDropdownContainer = styled(OpenDropdownContainer)<{\n\tvisible: boolean;\n}>`\n\topacity: ${({ visible }) => (visible ? 1 : 0)};\n\tvisibility: ${({ visible }) => (visible ? 'visible' : 'hidden')};\n\ttransition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;\n`;\n\nexport const FloatingInputDropdown: React.FC<FloatingInputDropdownProps> = ({\n\tinputProps,\n\tdropdownProps,\n\tfloaterProps,\n\tchildren,\n\tisVisible,\n\tonDropdownOptionClick,\n\tonChangeText,\n}) => {\n\tconst headerRef = useRef(null);\n\tconst childRef = useRef(null);\n\tconst [openDropdown, setDropdownVisibility] = useState(false);\n\tconst [popperElement, setPopperElement] = useState<HTMLDivElement | null>(\n\t\tnull,\n\t);\n\tconst [referenceElement, setReferenceElement] =\n\t\tuseState<HTMLDivElement | null>(null);\n\tconst [animateDropdown, setAnimateDropdown] = useState(false);\n\n\tconst { styles, attributes, update, forceUpdate } = usePopper(\n\t\treferenceElement,\n\t\tpopperElement,\n\t\t{\n\t\t\tplacement: dropdownProps.placement,\n\t\t\tstrategy: dropdownProps.strategy,\n\t\t\tmodifiers: [\n\t\t\t\t{\n\t\t\t\t\tname: 'offset',\n\t\t\t\t\toptions: {\n\t\t\t\t\t\toffset: [0, 0],\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tname: 'preventOverflow',\n\t\t\t\t\toptions: {\n\t\t\t\t\t\tpadding: { top: 0, bottom: 10, left: 0, right: 0 },\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tname: 'flip',\n\t\t\t\t\toptions: {\n\t\t\t\t\t\tfallbackPlacements: ['bottom', 'top'],\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t);\n\n\tuseEffect(() => {\n\t\tif (openDropdown) {\n\t\t\tsetAnimateDropdown(true);\n\t\t\tif (update) update();\n\t\t} else {\n\t\t\tconst timer = setTimeout(() => setAnimateDropdown(false), 200);\n\t\t\treturn () => clearTimeout(timer);\n\t\t}\n\t}, [openDropdown, update]);\n\n\tuseEffect(() => {\n\t\tif (headerRef.current) {\n\t\t\tconst resizeObserver = new ResizeObserver(() => {\n\t\t\t\tif (update) update();\n\t\t\t});\n\t\t\tresizeObserver.observe(headerRef.current);\n\n\t\t\treturn () => {\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t};\n\t\t}\n\t}, [headerRef.current, update]);\n\n\tconst onCloseHandle = (data) => {\n\t\tif (\n\t\t\tdropdownProps.version === '2.0' &&\n\t\t\tdropdownProps.isMultiSelect &&\n\t\t\tdata\n\t\t) {\n\t\t\tdropdownProps.onSelect?.([...data]);\n\t\t}\n\t\tsetDropdownVisibility(false);\n\t\tdropdownProps?.onClose?.();\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t{isVisible && (\n\t\t\t\t<Floater {...floaterProps} refElement={childRef}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{ position: 'relative' }}\n\t\t\t\t\t\tref={setReferenceElement as LegacyRef<HTMLDivElement>}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropShadow\n\t\t\t\t\t\t\tlevel={'z2'}\n\t\t\t\t\t\t\tposition={'down'}\n\t\t\t\t\t\t\tstyle={{ borderRadius: 8 }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tdropdownProps.onDropdownOpen?.();\n\t\t\t\t\t\t\t\t\tif (!openDropdown) {\n\t\t\t\t\t\t\t\t\t\tif (!dropdownProps.disabled) setDropdownVisibility(true);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tsetDropdownVisibility(false);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tforceUpdate?.();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tref={headerRef}\n\t\t\t\t\t\t\t\tonChangeText={(text, event) => {\n\t\t\t\t\t\t\t\t\tonChangeText?.(text, event);\n\t\t\t\t\t\t\t\t\tif (update) update();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</DropShadow>\n\t\t\t\t\t</div>\n\t\t\t\t\t<AnimatedDropdownContainer\n\t\t\t\t\t\tref={setPopperElement as Ref<HTMLDivElement>}\n\t\t\t\t\t\tstyle={{ ...styles['popper'], zIndex: 3 }}\n\t\t\t\t\t\t{...attributes['popper']}\n\t\t\t\t\t\tvisible={openDropdown || animateDropdown}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropShadow\n\t\t\t\t\t\t\tlevel={'z2'}\n\t\t\t\t\t\t\tposition={'down'}\n\t\t\t\t\t\t\tstyle={{ borderRadius: 8 }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<OpenedDropdown\n\t\t\t\t\t\t\t\t{...dropdownProps}\n\t\t\t\t\t\t\t\tonSelect={(options) => {\n\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\tdropdownProps.version === '2.0' &&\n\t\t\t\t\t\t\t\t\t\tdropdownProps.isMultiSelect\n\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tdropdownProps.onSelect?.(options);\n\t\t\t\t\t\t\t\t\t\tsetDropdownVisibility(false);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonClose={onCloseHandle}\n\t\t\t\t\t\t\t\tversion={dropdownProps.version}\n\t\t\t\t\t\t\t\theaderRef={headerRef}\n\t\t\t\t\t\t\t\tonDropdownItemClick={(option) => {\n\t\t\t\t\t\t\t\t\tonDropdownOptionClick?.(option);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</DropShadow>\n\t\t\t\t\t</AnimatedDropdownContainer>\n\t\t\t\t</Floater>\n\t\t\t)}\n\n\t\t\t<div ref={childRef}>{children && <div>{children}</div>}</div>\n\t\t</>\n\t);\n};\n"],"names":["AnimatedDropdownContainer","styled","OpenDropdownContainer","visible","FloatingInputDropdown","inputProps","dropdownProps","floaterProps","children","isVisible","onDropdownOptionClick","onChangeText","headerRef","useRef","childRef","openDropdown","setDropdownVisibility","useState","popperElement","setPopperElement","referenceElement","setReferenceElement","animateDropdown","setAnimateDropdown","styles","attributes","update","forceUpdate","usePopper","placement","strategy","modifiers","name","options","offset","padding","top","bottom","left","right","fallbackPlacements","useEffect","timer","setTimeout","clearTimeout","current","resizeObserver","ResizeObserver","observe","disconnect","_jsxs","_Fragment","Floater","Object","assign","refElement","_jsx","jsx","style","position","ref","DropShadow","level","borderRadius","Input","onClick","_a","onDropdownOpen","call","disabled","text","event","zIndex","OpenedDropdown","onSelect","version","isMultiSelect","onClose","data","_b","onDropdownItemClick","option"],"mappings":"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"}
+{"version":3,"file":"FloatingInputDropdown.js","sources":["../../../../src/components/floating-input-dropdown/FloatingInputDropdown.tsx"],"sourcesContent":["import React, { LegacyRef, Ref, useEffect, useRef, useState } from 'react';\nimport { usePopper } from 'react-popper';\nimport styled from 'styled-components';\nimport { DropShadow } from '@src/components/dropShadow';\nimport { Placement } from '@src/components/tooltips';\nimport { OpenDropdownContainer } from '../dropdown/Common.styled';\nimport { OpenedDropdown } from '../dropdown/OpenedDropdown';\nimport { DropdownOption, OpenDropdownProps } from '../dropdown/type';\nimport { Floater } from '../floater';\nimport { FloaterProps } from '../floater/floater';\nimport { Input } from '../input';\nimport { InputProps } from '../input/Input.model';\n\ntype DropdownProps = OpenDropdownProps & {\n\tisLoading?: boolean;\n\tchildren?: React.ReactNode;\n\tdisabled?: boolean;\n\tonDropdownOpen?: () => void;\n\tonDropdownVisbilityChange?: (isOpen: boolean) => void;\n\ttooltipContent?: string;\n\ttooltipDirection?: Placement;\n\tshowTooltipArrow?: boolean;\n};\n\ntype FloatingInputDropdownProps = {\n\tinputProps: InputProps;\n\tdropdownProps: DropdownProps;\n\tfloaterProps: FloaterProps;\n\tchildren?: React.ReactNode;\n\tisVisible?: boolean;\n\tonDropdownOptionClick?: (option: DropdownOption) => void;\n\tonChangeText?: (text: string, event?: Event) => void;\n};\n\nconst AnimatedDropdownContainer = styled(OpenDropdownContainer)<{\n\tvisible: boolean;\n}>`\n\topacity: ${({ visible }) => (visible ? 1 : 0)};\n\tvisibility: ${({ visible }) => (visible ? 'visible' : 'hidden')};\n\ttransition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;\n`;\n\nexport const FloatingInputDropdown: React.FC<FloatingInputDropdownProps> = ({\n\tinputProps,\n\tdropdownProps,\n\tfloaterProps,\n\tchildren,\n\tisVisible,\n\tonDropdownOptionClick,\n\tonChangeText,\n}) => {\n\tconst headerRef = useRef(null);\n\tconst childRef = useRef(null);\n\tconst [openDropdown, setDropdownVisibility] = useState(false);\n\tconst [popperElement, setPopperElement] = useState<HTMLDivElement | null>(\n\t\tnull,\n\t);\n\tconst [referenceElement, setReferenceElement] =\n\t\tuseState<HTMLDivElement | null>(null);\n\tconst [animateDropdown, setAnimateDropdown] = useState(false);\n\n\tconst { styles, attributes, update, forceUpdate } = usePopper(\n\t\treferenceElement,\n\t\tpopperElement,\n\t\t{\n\t\t\tplacement: dropdownProps.placement,\n\t\t\tstrategy: dropdownProps.strategy,\n\t\t\tmodifiers: [\n\t\t\t\t{\n\t\t\t\t\tname: 'offset',\n\t\t\t\t\toptions: {\n\t\t\t\t\t\toffset: [0, 0],\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tname: 'preventOverflow',\n\t\t\t\t\toptions: {\n\t\t\t\t\t\tpadding: { top: 0, bottom: 10, left: 0, right: 0 },\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tname: 'flip',\n\t\t\t\t\toptions: {\n\t\t\t\t\t\tfallbackPlacements: ['bottom', 'top'],\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t);\n\n\tuseEffect(() => {\n\t\tif (openDropdown) {\n\t\t\tsetAnimateDropdown(true);\n\t\t\tif (update) update();\n\t\t} else {\n\t\t\tconst timer = setTimeout(() => setAnimateDropdown(false), 200);\n\t\t\treturn () => clearTimeout(timer);\n\t\t}\n\t}, [openDropdown, update]);\n\n\tuseEffect(() => {\n\t\tif (headerRef.current) {\n\t\t\tconst resizeObserver = new ResizeObserver(() => {\n\t\t\t\tif (update) update();\n\t\t\t});\n\t\t\tresizeObserver.observe(headerRef.current);\n\n\t\t\treturn () => {\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t};\n\t\t}\n\t}, [headerRef.current, update]);\n\n\tconst onCloseHandle = (data) => {\n\t\tif (\n\t\t\tdropdownProps.version === '2.0' &&\n\t\t\tdropdownProps.isMultiSelect &&\n\t\t\tdata\n\t\t) {\n\t\t\tdropdownProps.onSelect?.([...data]);\n\t\t}\n\t\tsetDropdownVisibility(false);\n\t\tdropdownProps?.onClose?.();\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t{isVisible && (\n\t\t\t\t<Floater {...floaterProps} refElement={childRef}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{ position: 'relative' }}\n\t\t\t\t\t\tref={setReferenceElement as LegacyRef<HTMLDivElement>}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropShadow\n\t\t\t\t\t\t\tlevel={'z2'}\n\t\t\t\t\t\t\tposition={'down'}\n\t\t\t\t\t\t\tstyle={{ borderRadius: 8 }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t{...inputProps}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tdropdownProps.onDropdownOpen?.();\n\t\t\t\t\t\t\t\t\tif (!openDropdown) {\n\t\t\t\t\t\t\t\t\t\tif (!dropdownProps.disabled) setDropdownVisibility(true);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tsetDropdownVisibility(false);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tforceUpdate?.();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tref={headerRef}\n\t\t\t\t\t\t\t\tonChangeText={(text, event) => {\n\t\t\t\t\t\t\t\t\tonChangeText?.(text, event);\n\t\t\t\t\t\t\t\t\tif (update) update();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</DropShadow>\n\t\t\t\t\t</div>\n\t\t\t\t\t<AnimatedDropdownContainer\n\t\t\t\t\t\tref={setPopperElement as Ref<HTMLDivElement>}\n\t\t\t\t\t\tstyle={{ ...styles['popper'], zIndex: 3 }}\n\t\t\t\t\t\t{...attributes['popper']}\n\t\t\t\t\t\tvisible={openDropdown || animateDropdown}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropShadow\n\t\t\t\t\t\t\tlevel={'z2'}\n\t\t\t\t\t\t\tposition={'down'}\n\t\t\t\t\t\t\tstyle={{ borderRadius: 8 }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<OpenedDropdown\n\t\t\t\t\t\t\t\t{...dropdownProps}\n\t\t\t\t\t\t\t\tonSelect={(options) => {\n\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\tdropdownProps.version === '2.0' &&\n\t\t\t\t\t\t\t\t\t\tdropdownProps.isMultiSelect\n\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tdropdownProps.onSelect?.(options);\n\t\t\t\t\t\t\t\t\t\tsetDropdownVisibility(false);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tonClose={onCloseHandle}\n\t\t\t\t\t\t\t\tversion={dropdownProps.version}\n\t\t\t\t\t\t\t\theaderRef={headerRef}\n\t\t\t\t\t\t\t\tonDropdownItemClick={(option) => {\n\t\t\t\t\t\t\t\t\tonDropdownOptionClick?.(option);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</DropShadow>\n\t\t\t\t\t</AnimatedDropdownContainer>\n\t\t\t\t</Floater>\n\t\t\t)}\n\n\t\t\t<div ref={childRef}>{children && <div>{children}</div>}</div>\n\t\t</>\n\t);\n};\n"],"names":["AnimatedDropdownContainer","styled","OpenDropdownContainer","_ref","visible","_ref2","_ref3","inputProps","dropdownProps","floaterProps","children","isVisible","onDropdownOptionClick","onChangeText","headerRef","useRef","childRef","openDropdown","setDropdownVisibility","useState","popperElement","setPopperElement","referenceElement","setReferenceElement","animateDropdown","setAnimateDropdown","styles","attributes","update","forceUpdate","usePopper","placement","strategy","modifiers","name","options","offset","padding","top","bottom","left","right","fallbackPlacements","useEffect","timer","setTimeout","clearTimeout","current","resizeObserver","ResizeObserver","observe","disconnect","_jsxs","_Fragment","Floater","Object","assign","refElement","_jsx","jsx","style","position","ref","DropShadow","level","borderRadius","Input","onClick","_a","onDropdownOpen","call","disabled","text","event","zIndex","OpenedDropdown","onSelect","version","isMultiSelect","onClose","data","_b","onDropdownItemClick","option"],"mappings":"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"}

package/dist/cjs/components/half-doughnut-chart/HalfDoughnutChart.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("chart.js"),o=require("react"),t=require("react-chartjs-2"),n=require("../TypographyStyle.js"),l=require("../../constants/Theme.js"),a=require("./HalfDoughnutChart.styled.js");r.Chart.register(r.ArcElement,r.Tooltip);exports.HalfDoughnutChart=({segments:r})=>{var i;const s=o.useRef(null),[c,d]=o.useState(480),u=o.useRef(r);u.current=r;const h=o.useRef(0);o.useEffect((()=>{const e=s.current;if(!e)return;const r=new ResizeObserver((e=>{var r;const o=null===(r=e[0])||void 0===r?void 0:r.contentRect.width;o&&d(o)}));return r.observe(e),d(e.offsetWidth),()=>r.disconnect()}),[]);const b=r.reduce(((e,r)=>e+(Number(r.value)||0)),0);h.current=b;const v=r.length>0?r.reduce(((e,r)=>(Number(r.value)||0)>=(Number(e.value)||0)?r:e),r[0]):void 0,g=b>0&&v?Math.round(100*(Number(v.value)||0)/b):0,j=b>0?r.map((e=>Number(e.value)||0)):r.map((()=>1)),p=r.map((e=>e===v?e.color:e.color+"8F")),f={datasets:[{data:j,backgroundColor:p,borderColor:l.COLORS.surface.standard,borderWidth:3,hoverBackgroundColor:p,hoverOffset:0}]},x=o.useRef({rotation:-90,circumference:180,cutout:"80%",maintainAspectRatio:!1,animation:{duration:600},plugins:{legend:{display:!1},tooltip:{enabled:!0,backgroundColor:"#212121",titleColor:"#ffffff",bodyColor:"rgba(255,255,255,0.7)",cornerRadius:8,padding:12,caretSize:6,displayColors:!0,boxWidth:12,boxHeight:12,boxPadding:6,callbacks:{title:e=>{var r,o;const t=null!==(o=null===(r=e[0])||void 0===r?void 0:r.dataIndex)&&void 0!==o?o:-1;if(t<0)return"";const n=u.current[t],l=Number(n.value)||0;return(h.current>0?Math.round(100*l/h.current):0)+"% "+n.label},label:e=>{var r;const o=u.current[e.dataIndex];return null!==(r=null==o?void 0:o.tooltipLabel)&&void 0!==r?r:""},labelColor:e=>{var r,o;const t=u.current[e.dataIndex];return{borderColor:null!==(r=null==t?void 0:t.color)&&void 0!==r?r:"#fff",backgroundColor:null!==(o=null==t?void 0:t.color)&&void 0!==o?o:"#fff",borderRadius:3}}}}}}).current,m=0===b,C=null!==(i=null==v?void 0:v.emojiIcon)&&void 0!==i?i:null;return e.jsxs(a.Wrapper,{children:[!m&&e.jsx(a.Legend,{children:r.map((({label:r,color:o},t)=>e.jsxs(a.LegendItem,{children:[e.jsx(a.LegendDot,{color:o}),e.jsx(n.BodySmall,Object.assign({color:l.COLORS.content.secondary},{children:r}))]},`${r}-${t}`)))}),e.jsxs(a.ChartWrapper,Object.assign({ref:s},{children:[e.jsx(a.CanvasClip,Object.assign({style:{height:c/2,overflow:"hidden"}},{children:e.jsx(t.Doughnut,{data:f,options:x,width:c,height:c})})),m?e.jsx(a.ElementWrapper,{children:e.jsx(a.PercentageLabel,{children:e.jsx(n.TitleLarge,Object.assign({color:"#212121"},{children:"--"}))})}):C&&e.jsxs(a.ElementWrapper,{children:[e.jsx(C,{width:36,height:36}),e.jsx(a.PercentageLabel,{children:e.jsxs(n.TitleLarge,Object.assign({color:"#212121"},{children:[g,"% ",e.jsx("span",{children:null==v?void 0:v.label})]}))})]})]})),(null==v?void 0:v.description)&&e.jsx(a.DescriptionText,{children:e.jsx(n.BodyCaption,Object.assign({color:l.COLORS.content.secondary},{children:null==v?void 0:v.description}))})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("chart.js"),t=require("react"),o=require("react-chartjs-2"),n=require("../TypographyStyle.js"),l=require("../../constants/Theme.js"),a=require("./HalfDoughnutChart.styled.js");r.Chart.register(r.ArcElement,r.Tooltip);exports.HalfDoughnutChart=r=>{let{segments:i}=r;var s;const c=t.useRef(null),[d,u]=t.useState(480),h=t.useRef(i);h.current=i;const b=t.useRef(0);t.useEffect((()=>{const e=c.current;if(!e)return;const r=new ResizeObserver((e=>{var r;const t=null===(r=e[0])||void 0===r?void 0:r.contentRect.width;t&&u(t)}));return r.observe(e),u(e.offsetWidth),()=>r.disconnect()}),[]);const v=i.reduce(((e,r)=>e+(Number(r.value)||0)),0);b.current=v;const g=i.length>0?i.reduce(((e,r)=>(Number(r.value)||0)>=(Number(e.value)||0)?r:e),i[0]):void 0,j=v>0&&g?Math.round(100*(Number(g.value)||0)/v):0,p=v>0?i.map((e=>Number(e.value)||0)):i.map((()=>1)),f=i.map((e=>e===g?e.color:e.color+"8F")),x={datasets:[{data:p,backgroundColor:f,borderColor:l.COLORS.surface.standard,borderWidth:3,hoverBackgroundColor:f,hoverOffset:0}]},m=t.useRef({rotation:-90,circumference:180,cutout:"80%",maintainAspectRatio:!1,animation:{duration:600},plugins:{legend:{display:!1},tooltip:{enabled:!0,backgroundColor:"#212121",titleColor:"#ffffff",bodyColor:"rgba(255,255,255,0.7)",cornerRadius:8,padding:12,caretSize:6,displayColors:!0,boxWidth:12,boxHeight:12,boxPadding:6,callbacks:{title:e=>{var r,t;const o=null!==(t=null===(r=e[0])||void 0===r?void 0:r.dataIndex)&&void 0!==t?t:-1;if(o<0)return"";const n=h.current[o],l=Number(n.value)||0;return(b.current>0?Math.round(100*l/b.current):0)+"% "+n.label},label:e=>{var r;const t=h.current[e.dataIndex];return null!==(r=null==t?void 0:t.tooltipLabel)&&void 0!==r?r:""},labelColor:e=>{var r,t;const o=h.current[e.dataIndex];return{borderColor:null!==(r=null==o?void 0:o.color)&&void 0!==r?r:"#fff",backgroundColor:null!==(t=null==o?void 0:o.color)&&void 0!==t?t:"#fff",borderRadius:3}}}}}}).current,C=0===v,O=null!==(s=null==g?void 0:g.emojiIcon)&&void 0!==s?s:null;return e.jsxs(a.Wrapper,{children:[!C&&e.jsx(a.Legend,{children:i.map(((r,t)=>{let{label:o,color:i}=r;return e.jsxs(a.LegendItem,{children:[e.jsx(a.LegendDot,{color:i}),e.jsx(n.BodySmall,Object.assign({color:l.COLORS.content.secondary},{children:o}))]},`${o}-${t}`)}))}),e.jsxs(a.ChartWrapper,Object.assign({ref:c},{children:[e.jsx(a.CanvasClip,Object.assign({style:{height:d/2,overflow:"hidden"}},{children:e.jsx(o.Doughnut,{data:x,options:m,width:d,height:d})})),C?e.jsx(a.ElementWrapper,{children:e.jsx(a.PercentageLabel,{children:e.jsx(n.TitleLarge,Object.assign({color:"#212121"},{children:"--"}))})}):O&&e.jsxs(a.ElementWrapper,{children:[e.jsx(O,{width:36,height:36}),e.jsx(a.PercentageLabel,{children:e.jsxs(n.TitleLarge,Object.assign({color:"#212121"},{children:[j,"% ",e.jsx("span",{children:null==g?void 0:g.label})]}))})]})]})),(null==g?void 0:g.description)&&e.jsx(a.DescriptionText,{children:e.jsx(n.BodyCaption,Object.assign({color:l.COLORS.content.secondary},{children:null==g?void 0:g.description}))})]})};
 //# sourceMappingURL=HalfDoughnutChart.js.map

package/dist/cjs/components/half-doughnut-chart/HalfDoughnutChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"HalfDoughnutChart.js","sources":["../../../../src/components/half-doughnut-chart/HalfDoughnutChart.tsx"],"sourcesContent":["import { ArcElement, Chart as ChartJS, Tooltip } from 'chart.js';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Doughnut } from 'react-chartjs-2';\nimport {\n\tBodyCaption,\n\tBodySmall,\n\tTitleLarge,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tCanvasClip,\n\tChartWrapper,\n\tDescriptionText,\n\tElementWrapper,\n\tLegend,\n\tLegendDot,\n\tLegendItem,\n\tPercentageLabel,\n\tWrapper,\n} from './HalfDoughnutChart.styled';\nimport { HalfDoughnutChartProps, HalfDoughnutSegment } from './model';\n\nChartJS.register(ArcElement, Tooltip);\n\nconst doughnutThicknessInverse = `80%`; // cutout size as a percentage of the doughnut radius\n\nexport const HalfDoughnutChart: React.FC<HalfDoughnutChartProps> = ({\n\tsegments,\n}) => {\n\tconst wrapperRef = useRef<HTMLDivElement>(null);\n\tconst [canvasSize, setCanvasSize] = useState(480);\n\n\t// Keep refs so tooltip callbacks always see latest data without\n\t// recreating chartOptions (which would remount the chart).\n\tconst segmentsRef = useRef<HalfDoughnutSegment[]>(segments);\n\tsegmentsRef.current = segments;\n\tconst totalRef = useRef(0);\n\n\tuseEffect(() => {\n\t\tconst el = wrapperRef.current;\n\t\tif (!el) return;\n\t\tconst observer = new ResizeObserver((entries) => {\n\t\t\tconst w = entries[0]?.contentRect.width;\n\t\t\tif (w) setCanvasSize(w);\n\t\t});\n\t\tobserver.observe(el);\n\t\tsetCanvasSize(el.offsetWidth);\n\t\treturn () => observer.disconnect();\n\t}, []);\n\n\tconst total = segments.reduce((sum, s) => sum + (Number(s.value) || 0), 0);\n\ttotalRef.current = total;\n\n\tconst dominantSegment =\n\t\tsegments.length > 0\n\t\t\t? segments.reduce(\n\t\t\t\t\t(best, s) =>\n\t\t\t\t\t\t(Number(s.value) || 0) >= (Number(best.value) || 0) ? s : best,\n\t\t\t\t\tsegments[0],\n\t\t\t  )\n\t\t\t: undefined;\n\n\tconst dominantPct =\n\t\ttotal > 0 && dominantSegment\n\t\t\t? Math.round(((Number(dominantSegment.value) || 0) * 100) / total)\n\t\t\t: 0;\n\n\tconst dataValues =\n\t\ttotal > 0\n\t\t\t? segments.map((s) => Number(s.value) || 0)\n\t\t\t: segments.map(() => 1);\n\n\tconst bgColors = segments.map((s) =>\n\t\ts === dominantSegment ? s.color : s.color + '8F',\n\t);\n\n\tconst chartData = {\n\t\tdatasets: [\n\t\t\t{\n\t\t\t\tdata: dataValues,\n\t\t\t\tbackgroundColor: bgColors,\n\t\t\t\tborderColor: COLORS.surface.standard,\n\t\t\t\tborderWidth: 3,\n\t\t\t\thoverBackgroundColor: bgColors,\n\t\t\t\thoverOffset: 0,\n\t\t\t},\n\t\t],\n\t};\n\n\t// Stable options object — callbacks read from refs so no recreation needed\n\tconst chartOptions = useRef({\n\t\trotation: -90,\n\t\tcircumference: 180,\n\t\tcutout: doughnutThicknessInverse, // change this for the thickness of the doughnut\n\t\tmaintainAspectRatio: false,\n\t\tanimation: { duration: 600 },\n\t\tplugins: {\n\t\t\tlegend: { display: false },\n\t\t\ttooltip: {\n\t\t\t\tenabled: true,\n\t\t\t\tbackgroundColor: '#212121',\n\t\t\t\ttitleColor: '#ffffff',\n\t\t\t\tbodyColor: 'rgba(255,255,255,0.7)',\n\t\t\t\tcornerRadius: 8,\n\t\t\t\tpadding: 12,\n\t\t\t\tcaretSize: 6,\n\t\t\t\tdisplayColors: true,\n\t\t\t\tboxWidth: 12,\n\t\t\t\tboxHeight: 12,\n\t\t\t\tboxPadding: 6,\n\t\t\t\tcallbacks: {\n\t\t\t\t\ttitle: (items: { dataIndex: number }[]) => {\n\t\t\t\t\t\tconst idx = items[0]?.dataIndex ?? -1;\n\t\t\t\t\t\tif (idx < 0) return '';\n\t\t\t\t\t\tconst seg = segmentsRef.current[idx];\n\t\t\t\t\t\tconst val = Number(seg.value) || 0;\n\t\t\t\t\t\tconst pct =\n\t\t\t\t\t\t\ttotalRef.current > 0\n\t\t\t\t\t\t\t\t? Math.round((val * 100) / totalRef.current)\n\t\t\t\t\t\t\t\t: 0;\n\t\t\t\t\t\treturn pct + '% ' + seg.label;\n\t\t\t\t\t},\n\t\t\t\t\tlabel: (item: { dataIndex: number }) => {\n\t\t\t\t\t\tconst seg = segmentsRef.current[item.dataIndex];\n\t\t\t\t\t\treturn seg?.tooltipLabel ?? '';\n\t\t\t\t\t},\n\t\t\t\t\tlabelColor: (item: { dataIndex: number }) => {\n\t\t\t\t\t\tconst seg = segmentsRef.current[item.dataIndex];\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tborderColor: seg?.color ?? '#fff',\n\t\t\t\t\t\t\tbackgroundColor: seg?.color ?? '#fff',\n\t\t\t\t\t\t\tborderRadius: 3,\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}).current;\n\n\tconst isZeroState = total === 0;\n\tconst DominantIcon = dominantSegment?.emojiIcon ?? null;\n\n\treturn (\n\t\t<Wrapper>\n\t\t\t{!isZeroState && (\n\t\t\t\t<Legend>\n\t\t\t\t\t{segments.map(({ label, color }, index) => (\n\t\t\t\t\t\t<LegendItem key={`${label}-${index}`}>\n\t\t\t\t\t\t\t<LegendDot color={color} />\n\t\t\t\t\t\t\t<BodySmall color={COLORS.content.secondary}>{label}</BodySmall>\n\t\t\t\t\t\t</LegendItem>\n\t\t\t\t\t))}\n\t\t\t\t</Legend>\n\t\t\t)}\n\n\t\t\t<ChartWrapper ref={wrapperRef}>\n\t\t\t\t<CanvasClip style={{ height: canvasSize / 2, overflow: 'hidden' }}>\n\t\t\t\t\t<Doughnut\n\t\t\t\t\t\tdata={chartData}\n\t\t\t\t\t\toptions={chartOptions}\n\t\t\t\t\t\twidth={canvasSize}\n\t\t\t\t\t\theight={canvasSize}\n\t\t\t\t\t/>\n\t\t\t\t</CanvasClip>\n\n\t\t\t\t{isZeroState ? (\n\t\t\t\t\t<ElementWrapper>\n\t\t\t\t\t\t<PercentageLabel>\n\t\t\t\t\t\t\t<TitleLarge color=\"#212121\">--</TitleLarge>\n\t\t\t\t\t\t</PercentageLabel>\n\t\t\t\t\t</ElementWrapper>\n\t\t\t\t) : (\n\t\t\t\t\tDominantIcon && (\n\t\t\t\t\t\t<ElementWrapper>\n\t\t\t\t\t\t\t<DominantIcon width={36} height={36} />\n\t\t\t\t\t\t\t<PercentageLabel>\n\t\t\t\t\t\t\t\t<TitleLarge color=\"#212121\">\n\t\t\t\t\t\t\t\t\t{dominantPct}% <span>{dominantSegment?.label}</span>\n\t\t\t\t\t\t\t\t</TitleLarge>\n\t\t\t\t\t\t\t</PercentageLabel>\n\t\t\t\t\t\t</ElementWrapper>\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</ChartWrapper>\n\n\t\t\t{dominantSegment?.description && (\n\t\t\t\t<DescriptionText>\n\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t{dominantSegment?.description}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t</DescriptionText>\n\t\t\t)}\n\t\t</Wrapper>\n\t);\n};\n"],"names":["ChartJS","register","ArcElement","Tooltip","HalfDoughnutChart","segments","wrapperRef","useRef","canvasSize","setCanvasSize","useState","segmentsRef","current","totalRef","useEffect","el","observer","ResizeObserver","entries","w","_a","contentRect","width","observe","offsetWidth","disconnect","total","reduce","sum","s","Number","value","dominantSegment","length","best","undefined","dominantPct","Math","round","dataValues","map","bgColors","color","chartData","datasets","data","backgroundColor","borderColor","COLORS","surface","standard","borderWidth","hoverBackgroundColor","hoverOffset","chartOptions","rotation","circumference","cutout","maintainAspectRatio","animation","duration","plugins","legend","display","tooltip","enabled","titleColor","bodyColor","cornerRadius","padding","caretSize","displayColors","boxWidth","boxHeight","boxPadding","callbacks","title","items","idx","_b","dataIndex","seg","val","label","item","tooltipLabel","labelColor","borderRadius","isZeroState","DominantIcon","emojiIcon","_jsxs","Wrapper","children","_jsx","Legend","index","jsxs","LegendItem","jsx","LegendDot","BodySmall","Object","assign","content","secondary","ChartWrapper","ref","CanvasClip","style","height","overflow","Doughnut","options","ElementWrapper","PercentageLabel","TitleLarge","description","DescriptionText","BodyCaption"],"mappings":"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"}
+{"version":3,"file":"HalfDoughnutChart.js","sources":["../../../../src/components/half-doughnut-chart/HalfDoughnutChart.tsx"],"sourcesContent":["import { ArcElement, Chart as ChartJS, Tooltip } from 'chart.js';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Doughnut } from 'react-chartjs-2';\nimport {\n\tBodyCaption,\n\tBodySmall,\n\tTitleLarge,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tCanvasClip,\n\tChartWrapper,\n\tDescriptionText,\n\tElementWrapper,\n\tLegend,\n\tLegendDot,\n\tLegendItem,\n\tPercentageLabel,\n\tWrapper,\n} from './HalfDoughnutChart.styled';\nimport { HalfDoughnutChartProps, HalfDoughnutSegment } from './model';\n\nChartJS.register(ArcElement, Tooltip);\n\nconst doughnutThicknessInverse = `80%`; // cutout size as a percentage of the doughnut radius\n\nexport const HalfDoughnutChart: React.FC<HalfDoughnutChartProps> = ({\n\tsegments,\n}) => {\n\tconst wrapperRef = useRef<HTMLDivElement>(null);\n\tconst [canvasSize, setCanvasSize] = useState(480);\n\n\t// Keep refs so tooltip callbacks always see latest data without\n\t// recreating chartOptions (which would remount the chart).\n\tconst segmentsRef = useRef<HalfDoughnutSegment[]>(segments);\n\tsegmentsRef.current = segments;\n\tconst totalRef = useRef(0);\n\n\tuseEffect(() => {\n\t\tconst el = wrapperRef.current;\n\t\tif (!el) return;\n\t\tconst observer = new ResizeObserver((entries) => {\n\t\t\tconst w = entries[0]?.contentRect.width;\n\t\t\tif (w) setCanvasSize(w);\n\t\t});\n\t\tobserver.observe(el);\n\t\tsetCanvasSize(el.offsetWidth);\n\t\treturn () => observer.disconnect();\n\t}, []);\n\n\tconst total = segments.reduce((sum, s) => sum + (Number(s.value) || 0), 0);\n\ttotalRef.current = total;\n\n\tconst dominantSegment =\n\t\tsegments.length > 0\n\t\t\t? segments.reduce(\n\t\t\t\t\t(best, s) =>\n\t\t\t\t\t\t(Number(s.value) || 0) >= (Number(best.value) || 0) ? s : best,\n\t\t\t\t\tsegments[0],\n\t\t\t  )\n\t\t\t: undefined;\n\n\tconst dominantPct =\n\t\ttotal > 0 && dominantSegment\n\t\t\t? Math.round(((Number(dominantSegment.value) || 0) * 100) / total)\n\t\t\t: 0;\n\n\tconst dataValues =\n\t\ttotal > 0\n\t\t\t? segments.map((s) => Number(s.value) || 0)\n\t\t\t: segments.map(() => 1);\n\n\tconst bgColors = segments.map((s) =>\n\t\ts === dominantSegment ? s.color : s.color + '8F',\n\t);\n\n\tconst chartData = {\n\t\tdatasets: [\n\t\t\t{\n\t\t\t\tdata: dataValues,\n\t\t\t\tbackgroundColor: bgColors,\n\t\t\t\tborderColor: COLORS.surface.standard,\n\t\t\t\tborderWidth: 3,\n\t\t\t\thoverBackgroundColor: bgColors,\n\t\t\t\thoverOffset: 0,\n\t\t\t},\n\t\t],\n\t};\n\n\t// Stable options object — callbacks read from refs so no recreation needed\n\tconst chartOptions = useRef({\n\t\trotation: -90,\n\t\tcircumference: 180,\n\t\tcutout: doughnutThicknessInverse, // change this for the thickness of the doughnut\n\t\tmaintainAspectRatio: false,\n\t\tanimation: { duration: 600 },\n\t\tplugins: {\n\t\t\tlegend: { display: false },\n\t\t\ttooltip: {\n\t\t\t\tenabled: true,\n\t\t\t\tbackgroundColor: '#212121',\n\t\t\t\ttitleColor: '#ffffff',\n\t\t\t\tbodyColor: 'rgba(255,255,255,0.7)',\n\t\t\t\tcornerRadius: 8,\n\t\t\t\tpadding: 12,\n\t\t\t\tcaretSize: 6,\n\t\t\t\tdisplayColors: true,\n\t\t\t\tboxWidth: 12,\n\t\t\t\tboxHeight: 12,\n\t\t\t\tboxPadding: 6,\n\t\t\t\tcallbacks: {\n\t\t\t\t\ttitle: (items: { dataIndex: number }[]) => {\n\t\t\t\t\t\tconst idx = items[0]?.dataIndex ?? -1;\n\t\t\t\t\t\tif (idx < 0) return '';\n\t\t\t\t\t\tconst seg = segmentsRef.current[idx];\n\t\t\t\t\t\tconst val = Number(seg.value) || 0;\n\t\t\t\t\t\tconst pct =\n\t\t\t\t\t\t\ttotalRef.current > 0\n\t\t\t\t\t\t\t\t? Math.round((val * 100) / totalRef.current)\n\t\t\t\t\t\t\t\t: 0;\n\t\t\t\t\t\treturn pct + '% ' + seg.label;\n\t\t\t\t\t},\n\t\t\t\t\tlabel: (item: { dataIndex: number }) => {\n\t\t\t\t\t\tconst seg = segmentsRef.current[item.dataIndex];\n\t\t\t\t\t\treturn seg?.tooltipLabel ?? '';\n\t\t\t\t\t},\n\t\t\t\t\tlabelColor: (item: { dataIndex: number }) => {\n\t\t\t\t\t\tconst seg = segmentsRef.current[item.dataIndex];\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tborderColor: seg?.color ?? '#fff',\n\t\t\t\t\t\t\tbackgroundColor: seg?.color ?? '#fff',\n\t\t\t\t\t\t\tborderRadius: 3,\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}).current;\n\n\tconst isZeroState = total === 0;\n\tconst DominantIcon = dominantSegment?.emojiIcon ?? null;\n\n\treturn (\n\t\t<Wrapper>\n\t\t\t{!isZeroState && (\n\t\t\t\t<Legend>\n\t\t\t\t\t{segments.map(({ label, color }, index) => (\n\t\t\t\t\t\t<LegendItem key={`${label}-${index}`}>\n\t\t\t\t\t\t\t<LegendDot color={color} />\n\t\t\t\t\t\t\t<BodySmall color={COLORS.content.secondary}>{label}</BodySmall>\n\t\t\t\t\t\t</LegendItem>\n\t\t\t\t\t))}\n\t\t\t\t</Legend>\n\t\t\t)}\n\n\t\t\t<ChartWrapper ref={wrapperRef}>\n\t\t\t\t<CanvasClip style={{ height: canvasSize / 2, overflow: 'hidden' }}>\n\t\t\t\t\t<Doughnut\n\t\t\t\t\t\tdata={chartData}\n\t\t\t\t\t\toptions={chartOptions}\n\t\t\t\t\t\twidth={canvasSize}\n\t\t\t\t\t\theight={canvasSize}\n\t\t\t\t\t/>\n\t\t\t\t</CanvasClip>\n\n\t\t\t\t{isZeroState ? (\n\t\t\t\t\t<ElementWrapper>\n\t\t\t\t\t\t<PercentageLabel>\n\t\t\t\t\t\t\t<TitleLarge color=\"#212121\">--</TitleLarge>\n\t\t\t\t\t\t</PercentageLabel>\n\t\t\t\t\t</ElementWrapper>\n\t\t\t\t) : (\n\t\t\t\t\tDominantIcon && (\n\t\t\t\t\t\t<ElementWrapper>\n\t\t\t\t\t\t\t<DominantIcon width={36} height={36} />\n\t\t\t\t\t\t\t<PercentageLabel>\n\t\t\t\t\t\t\t\t<TitleLarge color=\"#212121\">\n\t\t\t\t\t\t\t\t\t{dominantPct}% <span>{dominantSegment?.label}</span>\n\t\t\t\t\t\t\t\t</TitleLarge>\n\t\t\t\t\t\t\t</PercentageLabel>\n\t\t\t\t\t\t</ElementWrapper>\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t</ChartWrapper>\n\n\t\t\t{dominantSegment?.description && (\n\t\t\t\t<DescriptionText>\n\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t{dominantSegment?.description}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t</DescriptionText>\n\t\t\t)}\n\t\t</Wrapper>\n\t);\n};\n"],"names":["ChartJS","register","ArcElement","Tooltip","_ref","segments","wrapperRef","useRef","canvasSize","setCanvasSize","useState","segmentsRef","current","totalRef","useEffect","el","observer","ResizeObserver","entries","w","_a","contentRect","width","observe","offsetWidth","disconnect","total","reduce","sum","s","Number","value","dominantSegment","length","best","undefined","dominantPct","Math","round","dataValues","map","bgColors","color","chartData","datasets","data","backgroundColor","borderColor","COLORS","surface","standard","borderWidth","hoverBackgroundColor","hoverOffset","chartOptions","rotation","circumference","cutout","maintainAspectRatio","animation","duration","plugins","legend","display","tooltip","enabled","titleColor","bodyColor","cornerRadius","padding","caretSize","displayColors","boxWidth","boxHeight","boxPadding","callbacks","title","items","idx","_b","dataIndex","seg","val","label","item","tooltipLabel","labelColor","borderRadius","isZeroState","DominantIcon","emojiIcon","_jsxs","Wrapper","children","_jsx","Legend","_ref2","index","LegendItem","jsx","LegendDot","BodySmall","Object","assign","content","secondary","jsxs","ChartWrapper","ref","CanvasClip","style","height","overflow","Doughnut","options","ElementWrapper","PercentageLabel","TitleLarge","description","DescriptionText","BodyCaption"],"mappings":"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"}

package/dist/cjs/components/helpers/FileUploaderHelper.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploaderHelper.js","sources":["../../../../src/components/helpers/FileUploaderHelper.ts"],"sourcesContent":["import { bytesToMB } from '@src/utils/bytesToMB';\n\nexport const FILE_TYPE_NOT_SUPPORT = 'File type not supported';\nexport const FILE_SIZE_REACHED = (size: number) =>\n\t`Max file size of ${size}MB is allowed`;\nexport const getFileFormatErrorMessage = (format: string) =>\n\t`Only ${format.toUpperCase()} format allowed`;\n\nexport const SIZE_LIMIT_MAP = {\n\timage: 5,\n\tvideo: 16,\n\tapplication: 100,\n};\n\nexport const SUPPORTED_FILE_FORMAT = ['mp4', 'png', 'jpeg', 'jpg', 'pdf'];\n\nexport class FileUploaderHelper {\n\tvalidate(inputData: {\n\t\tfile?: Blob;\n\t\tlinkData?: { type: string; size: number };\n\t}) {\n\t\tconst { file, linkData } = inputData;\n\t\tlet size = 0;\n\t\tlet type = '';\n\t\tlet format = '';\n\t\tif (file) {\n\t\t\tsize = file.size;\n\t\t\ttype = file.type.split('/')[0];\n\t\t\tformat = file.type.split('/')[1];\n\t\t} else if (linkData) {\n\t\t\tsize = linkData.size;\n\t\t\ttype = linkData.type.split('/')[0];\n\t\t\tformat = linkData.type.split('/')[1];\n\t\t} else {\n\t\t\treturn FILE_TYPE_NOT_SUPPORT;\n\t\t}\n\n\t\tif (!SIZE_LIMIT_MAP[type]) {\n\t\t\treturn FILE_TYPE_NOT_SUPPORT;\n\t\t}\n\n\t\tif (bytesToMB(size) > SIZE_LIMIT_MAP[type]) {\n\t\t\treturn FILE_SIZE_REACHED(SIZE_LIMIT_MAP[type]);\n\t\t}\n\n\t\tif (!SUPPORTED_FILE_FORMAT.includes(format.toLocaleLowerCase())) {\n\t\t\tif (type === 'video') {\n\t\t\t\treturn getFileFormatErrorMessage('mp4');\n\t\t\t} else if (type === 'image') {\n\t\t\t\treturn getFileFormatErrorMessage('png, jpeg, jpg');\n\t\t\t} else if (type === 'application') {\n\t\t\t\treturn getFileFormatErrorMessage('pdf');\n\t\t\t}\n\t\t}\n\t}\n}\n"],"names":["FILE_TYPE_NOT_SUPPORT","FILE_SIZE_REACHED","size","getFileFormatErrorMessage","format","toUpperCase","SIZE_LIMIT_MAP","image","video","application","SUPPORTED_FILE_FORMAT","validate","inputData","file","linkData","type","split","bytesToMB","includes","toLocaleLowerCase"],"mappings":"8GAEO,MAAMA,EAAwB,0BACxBC,EAAqBC,GACjC,oBAAoBA,iBACRC,EAA6BC,GACzC,QAAQA,EAAOC,+BAEHC,EAAiB,CAC7BC,MAAO,EACPC,MAAO,GACPC,YAAa,KAGDC,EAAwB,CAAC,MAAO,MAAO,OAAQ,MAAO,oGAGlEC,SAASC,GAIR,MAAMC,KAAEA,EAAIC,SAAEA,GAAaF,EAC3B,IAAIV,EAAO,EACPa,EAAO,GACPX,EAAS,GACb,GAAIS,EACHX,EAAOW,EAAKX,KACZa,EAAOF,EAAKE,KAAKC,MAAM,KAAK,GAC5BZ,EAASS,EAAKE,KAAKC,MAAM,KAAK,OACxB,KAAIF,EAKV,OAAOd,EAJPE,EAAOY,EAASZ,KAChBa,EAAOD,EAASC,KAAKC,MAAM,KAAK,GAChCZ,EAASU,EAASC,KAAKC,MAAM,KAAK,EAGlC,CAED,IAAKV,EAAeS,GACnB,OAAOf,EAGR,GAAIiB,EAASA,UAACf,GAAQI,EAAeS,GACpC,OAAOd,EAAkBK,EAAeS,IAGzC,IAAKL,EAAsBQ,SAASd,EAAOe,qBAAsB,CAChE,GAAa,UAATJ,EACH,OAAOZ,EAA0B,OAC3B,GAAa,UAATY,EACV,OAAOZ,EAA0B,kBAC3B,GAAa,gBAATY,EACV,OAAOZ,EAA0B,MAElC,CACF"}
+{"version":3,"file":"FileUploaderHelper.js","sources":["../../../../src/components/helpers/FileUploaderHelper.ts"],"sourcesContent":["import { bytesToMB } from '@src/utils/bytesToMB';\n\nexport const FILE_TYPE_NOT_SUPPORT = 'File type not supported';\nexport const FILE_SIZE_REACHED = (size: number) =>\n\t`Max file size of ${size}MB is allowed`;\nexport const getFileFormatErrorMessage = (format: string) =>\n\t`Only ${format.toUpperCase()} format allowed`;\n\nexport const SIZE_LIMIT_MAP = {\n\timage: 5,\n\tvideo: 16,\n\tapplication: 100,\n};\n\nexport const SUPPORTED_FILE_FORMAT = ['mp4', 'png', 'jpeg', 'jpg', 'pdf'];\n\nexport class FileUploaderHelper {\n\tvalidate(inputData: {\n\t\tfile?: Blob;\n\t\tlinkData?: { type: string; size: number };\n\t}) {\n\t\tconst { file, linkData } = inputData;\n\t\tlet size = 0;\n\t\tlet type = '';\n\t\tlet format = '';\n\t\tif (file) {\n\t\t\tsize = file.size;\n\t\t\ttype = file.type.split('/')[0];\n\t\t\tformat = file.type.split('/')[1];\n\t\t} else if (linkData) {\n\t\t\tsize = linkData.size;\n\t\t\ttype = linkData.type.split('/')[0];\n\t\t\tformat = linkData.type.split('/')[1];\n\t\t} else {\n\t\t\treturn FILE_TYPE_NOT_SUPPORT;\n\t\t}\n\n\t\tif (!SIZE_LIMIT_MAP[type]) {\n\t\t\treturn FILE_TYPE_NOT_SUPPORT;\n\t\t}\n\n\t\tif (bytesToMB(size) > SIZE_LIMIT_MAP[type]) {\n\t\t\treturn FILE_SIZE_REACHED(SIZE_LIMIT_MAP[type]);\n\t\t}\n\n\t\tif (!SUPPORTED_FILE_FORMAT.includes(format.toLocaleLowerCase())) {\n\t\t\tif (type === 'video') {\n\t\t\t\treturn getFileFormatErrorMessage('mp4');\n\t\t\t} else if (type === 'image') {\n\t\t\t\treturn getFileFormatErrorMessage('png, jpeg, jpg');\n\t\t\t} else if (type === 'application') {\n\t\t\t\treturn getFileFormatErrorMessage('pdf');\n\t\t\t}\n\t\t}\n\t}\n}\n"],"names":["FILE_TYPE_NOT_SUPPORT","FILE_SIZE_REACHED","size","getFileFormatErrorMessage","format","toUpperCase","SIZE_LIMIT_MAP","image","video","application","SUPPORTED_FILE_FORMAT","validate","inputData","file","linkData","type","split","bytesToMB","includes","toLocaleLowerCase"],"mappings":"8GAEO,MAAMA,EAAwB,0BACxBC,EAAqBC,GACjC,oBAAoBA,iBACRC,EAA6BC,WACjCA,EAAOC,+BAEHC,EAAiB,CAC7BC,MAAO,EACPC,MAAO,GACPC,YAAa,KAGDC,EAAwB,CAAC,MAAO,MAAO,OAAQ,MAAO,oGAGlEC,SAASC,GAIR,MAAMC,KAAEA,EAAIC,SAAEA,GAAaF,EAC3B,IAAIV,EAAO,EACPa,EAAO,GACPX,EAAS,GACb,GAAIS,EACHX,EAAOW,EAAKX,KACZa,EAAOF,EAAKE,KAAKC,MAAM,KAAK,GAC5BZ,EAASS,EAAKE,KAAKC,MAAM,KAAK,OACxB,KAAIF,EAKV,OAAOd,EAJPE,EAAOY,EAASZ,KAChBa,EAAOD,EAASC,KAAKC,MAAM,KAAK,GAChCZ,EAASU,EAASC,KAAKC,MAAM,KAAK,EAGlC,CAED,IAAKV,EAAeS,GACnB,OAAOf,EAGR,GAAIiB,EAASA,UAACf,GAAQI,EAAeS,GACpC,OAAOd,EAAkBK,EAAeS,IAGzC,IAAKL,EAAsBQ,SAASd,EAAOe,qBAAsB,CAChE,GAAa,UAATJ,EACH,OAAOZ,EAA0B,OAC3B,GAAa,UAATY,EACV,OAAOZ,EAA0B,kBAC3B,GAAa,gBAATY,EACV,OAAOZ,EAA0B,MAElC,CACF"}

package/dist/cjs/components/icon-button/IconButton.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.styled.js","sources":["../../../../src/components/icon-button/IconButton.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { IconButtonType } from './model';\nimport { generateBackgroundColor } from './theme';\n\nexport const IconButton = styled.button<{\n\tbordered?: boolean;\n\ticonButtonType: IconButtonType;\n\tisSelected?: boolean;\n}>`\n\t${(props) => `\n\tall: unset;\n\tcursor: pointer;\n\tpadding: 6px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${\n\t\tprops.bordered && props.iconButtonType !== 'ai'\n\t\t\t? `border: 1px solid ${COLORS.stroke.primary};`\n\t\t\t: ''\n\t}\n\t${\n\t\tprops.isSelected\n\t\t\t? `\n\t\t\tbackground: ${generateBackgroundColor(props.iconButtonType)};\n\t\t\t\t`\n\t\t\t: `\n\t\t\t\t:hover {\n\t\t\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t\t\t}\n\t\t\t`\n\t}\n\t${\n\t\tprops.disabled &&\n\t\t`\n\t\t\tcursor: not-allowed !important;\n\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t`\n\t}\n\n\t`}\n`;\n"],"names":["IconButton","button","props","bordered","iconButtonType","COLORS","stroke","primary","isSelected","generateBackgroundColor","disabled"],"mappings":"6OAKaA,MAAAA,OAAmB,QAACC,MAI/B;GACEC,GAAU,sGAOZA,EAAMC,UAAqC,OAAzBD,EAAME,eACrB,qBAAqBC,EAAAA,OAAOC,OAAOC,WACnC,SAGHL,EAAMM,WACH,uBACYC,EAAuBA,wBAACP,EAAME,6BAE1C,gGAOHF,EAAMQ,UACN;"}
+{"version":3,"file":"IconButton.styled.js","sources":["../../../../src/components/icon-button/IconButton.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { IconButtonType } from './model';\nimport { generateBackgroundColor } from './theme';\n\nexport const IconButton = styled.button<{\n\tbordered?: boolean;\n\ticonButtonType: IconButtonType;\n\tisSelected?: boolean;\n}>`\n\t${(props) => `\n\tall: unset;\n\tcursor: pointer;\n\tpadding: 6px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${\n\t\tprops.bordered && props.iconButtonType !== 'ai'\n\t\t\t? `border: 1px solid ${COLORS.stroke.primary};`\n\t\t\t: ''\n\t}\n\t${\n\t\tprops.isSelected\n\t\t\t? `\n\t\t\tbackground: ${generateBackgroundColor(props.iconButtonType)};\n\t\t\t\t`\n\t\t\t: `\n\t\t\t\t:hover {\n\t\t\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t\t\t}\n\t\t\t`\n\t}\n\t${\n\t\tprops.disabled &&\n\t\t`\n\t\t\tcursor: not-allowed !important;\n\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t`\n\t}\n\n\t`}\n`;\n"],"names":["IconButton","button","props","bordered","iconButtonType","COLORS","stroke","primary","isSelected","generateBackgroundColor","disabled"],"mappings":"6OAKaA,MAAAA,OAAmB,QAACC,MAI/B;GACEC,GAAU,sGAOZA,EAAMC,UAAqC,OAAzBD,EAAME,eACA,qBAAAC,EAAAA,OAAOC,OAAOC,WACnC,SAGHL,EAAMM,WACH,uBACYC,EAAuBA,wBAACP,EAAME,6BAE1C,gGAOHF,EAAMQ,UACN;"}

package/dist/cjs/components/image-cropper/BikImagePipeline/BikImagePipeline.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),o=require("react"),r=require("../../image-compress/ImageCompress.js"),s=require("../../states/StateComponent.js");require("../../../_virtual/_tslib.js");var t=require("../../states-modal/StateModalComponent.js");require("../../modals/styledModal.js");var a=require("../BikImageCropper.js");exports.BikImagePipeline=({cropOptions:i,fileTitle:l,compressionOptions:n,currentImage:p,options:c,onFinish:u,onCancel:d,fileUploadOptions:m,loadingStateOptions:g})=>{const h=o.useRef(null),[j,C]=o.useState(),[I,f]=o.useState(p),[v,x]=o.useState(!1);o.useEffect((()=>{c.upload?(C("upload"),setTimeout((()=>{b()}),500)):c.crop?C("crop"):c.compress?C("compress"):c.uploadToFirestorage?C("cloud-upload"):x(!0)}),[c.upload,c.crop,c.compress,c.uploadToFirestorage]);const S=o.useCallback(((e,o)=>{if(!c.uploadToFirestorage)return u(e,o),void x(!0);C("cloud-upload"),m&&m.uploadFile(o,m.path).then((r=>{u(e,o,r),x(!0)})).catch((e=>{console.log("starting err process with ")}))}),[]),F=e=>{e||d();const o=r.ImageService.base64ToImage(e);c.compress?(C("compress"),r.ImageService.compressImage(o,n).then((e=>{if(!e)return x(!0),void d();S(e.base64,e.compressedFile)}))):S(e,o)},b=()=>{h.current.click()};return v?e.jsx(e.Fragment,{}):"cloud-upload"===j?!m||m.success?e.jsx(e.Fragment,{}):m.error?e.jsx("div",{children:e.jsx(t.StateModalComponent,{states:s.StateInterface.ERROR,heading:"Error while uploading",subline:"Please check your image and try again",isButtonEnabled:!1,width:300,onClose:()=>{x(!0),d()}})}):e.jsx("div",{children:e.jsx(t.StateModalComponent,{headerImage:null==g?void 0:g.headerImage,states:s.StateInterface.LOADING,heading:`Uploading your ${l||"photo"}`,subline:`Please wait while we upload your ${l||"photo"}`,isButtonEnabled:!1,width:300})}):e.jsxs(e.Fragment,{children:[c.upload&&e.jsx("input",{ref:h,type:"file",accept:"image/*",style:{display:"none"},onChange:e=>{const o=e.target.files[0],r=new FileReader;r.onload=()=>{var e;f({src:r.result}),e=r.result,c.crop?C("crop"):F(e)},o&&r.readAsDataURL(o)}}),"crop"===j&&e.jsx(a.BikImageCropper,{src:I.src,onCropComplete:e=>{f({src:e}),F(e)},aspectRatio:i.aspectRatio,onCancel:d})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),o=require("react"),r=require("../../image-compress/ImageCompress.js"),t=require("../../states/StateComponent.js");require("../../../_virtual/_tslib.js");var s=require("../../states-modal/StateModalComponent.js");require("../../modals/styledModal.js");var a=require("../BikImageCropper.js");exports.BikImagePipeline=i=>{let{cropOptions:l,fileTitle:n,compressionOptions:p,currentImage:c,options:u,onFinish:d,onCancel:m,fileUploadOptions:g,loadingStateOptions:h}=i;const j=o.useRef(null),[C,I]=o.useState(),[f,v]=o.useState(c),[x,S]=o.useState(!1);o.useEffect((()=>{u.upload?(I("upload"),setTimeout((()=>{y()}),500)):u.crop?I("crop"):u.compress?I("compress"):u.uploadToFirestorage?I("cloud-upload"):S(!0)}),[u.upload,u.crop,u.compress,u.uploadToFirestorage]);const F=o.useCallback(((e,o)=>{if(!u.uploadToFirestorage)return d(e,o),void S(!0);I("cloud-upload"),g&&g.uploadFile(o,g.path).then((r=>{d(e,o,r),S(!0)})).catch((e=>{console.log("starting err process with ")}))}),[]),b=e=>{e||m();const o=r.ImageService.base64ToImage(e);u.compress?(I("compress"),r.ImageService.compressImage(o,p).then((e=>{if(!e)return S(!0),void m();F(e.base64,e.compressedFile)}))):F(e,o)},y=()=>{j.current.click()};return x?e.jsx(e.Fragment,{}):"cloud-upload"===C?!g||g.success?e.jsx(e.Fragment,{}):g.error?e.jsx("div",{children:e.jsx(s.StateModalComponent,{states:t.StateInterface.ERROR,heading:"Error while uploading",subline:"Please check your image and try again",isButtonEnabled:!1,width:300,onClose:()=>{S(!0),m()}})}):e.jsx("div",{children:e.jsx(s.StateModalComponent,{headerImage:null==h?void 0:h.headerImage,states:t.StateInterface.LOADING,heading:`Uploading your ${n||"photo"}`,subline:`Please wait while we upload your ${n||"photo"}`,isButtonEnabled:!1,width:300})}):e.jsxs(e.Fragment,{children:[u.upload&&e.jsx("input",{ref:j,type:"file",accept:"image/*",style:{display:"none"},onChange:e=>{const o=e.target.files[0],r=new FileReader;r.onload=()=>{var e;v({src:r.result}),e=r.result,u.crop?I("crop"):b(e)},o&&r.readAsDataURL(o)}}),"crop"===C&&e.jsx(a.BikImageCropper,{src:f.src,onCropComplete:e=>{v({src:e}),b(e)},aspectRatio:l.aspectRatio,onCancel:m})]})};
 //# sourceMappingURL=BikImagePipeline.js.map

package/dist/cjs/components/image-cropper/BikImagePipeline/BikImagePipeline.js.map

@@ -1 +1 @@
-{"version":3,"file":"BikImagePipeline.js","sources":["../../../../../src/components/image-cropper/BikImagePipeline/BikImagePipeline.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n\tCompressImageOptions,\n\tImageService,\n} from '@src/components/image-compress';\nimport { StateInterface } from '@src/components/states';\nimport { StateModalComponent } from '@src/components/states-modal';\nimport BikImageCropper from '../BikImageCropper';\nimport { BikImageCropperProps } from '../BikImageCropper.model';\n\n/**\n * Todos\n * \t- Add option to pass https url in the src / edit an image\n */\n\nexport interface BikImagePipelineProps {\n\tfileTitle?: string;\n\tcropOptions?: Partial<BikImageCropperProps>;\n\tcompressionOptions?: CompressImageOptions;\n\tcurrentImage: {\n\t\tsrc?: string;\n\t};\n\toptions: {\n\t\tupload: boolean;\n\t\tcrop?: boolean;\n\t\tcompress?: boolean;\n\t\tuploadToFirestorage?: boolean;\n\t};\n\tonCancel: () => void;\n\tonFinish: (base64String: string, file?: File, url?: string) => void;\n\tfileUploadOptions?: {\n\t\tpath: string;\n\t\tuploadProgress: number;\n\t\tuploadFile: (file: File, path: string) => Promise<string>;\n\t\terror?: string;\n\t\tsuccess?: boolean;\n\t};\n\tloadingStateOptions?: {\n\t\theaderImage?: string;\n\t};\n}\n\ntype PIPELINE_STEPS = 'upload' | 'crop' | 'compress' | 'cloud-upload';\n\nexport const BikImagePipeline = ({\n\tcropOptions,\n\tfileTitle,\n\tcompressionOptions,\n\tcurrentImage,\n\toptions,\n\tonFinish,\n\tonCancel,\n\tfileUploadOptions,\n\tloadingStateOptions,\n}: BikImagePipelineProps) => {\n\tconst fileInputRef = useRef<HTMLInputElement>(null);\n\tconst [currentStep, setCurrentStep] = useState<PIPELINE_STEPS>();\n\tconst [currentLocalImage, setCurrentLocalImage] = useState(currentImage);\n\tconst [finished, setFinished] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (options.upload) {\n\t\t\tsetCurrentStep('upload');\n\t\t\tsetTimeout(() => {\n\t\t\t\thandleDivClick();\n\t\t\t}, 500);\n\t\t} else if (options.crop) {\n\t\t\tsetCurrentStep('crop');\n\t\t} else if (options.compress) {\n\t\t\tsetCurrentStep('compress');\n\t\t} else if (options.uploadToFirestorage) {\n\t\t\tsetCurrentStep('cloud-upload');\n\t\t} else {\n\t\t\tsetFinished(true);\n\t\t}\n\t}, [\n\t\toptions.upload,\n\t\toptions.crop,\n\t\toptions.compress,\n\t\toptions.uploadToFirestorage,\n\t]);\n\n\tconst moveToUploadToFirestoreElseNext = useCallback(\n\t\t(base64: string, file: File) => {\n\t\t\tif (!options.uploadToFirestorage) {\n\t\t\t\tonFinish(base64, file);\n\t\t\t\tsetFinished(true);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetCurrentStep('cloud-upload');\n\t\t\tif (!fileUploadOptions) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tfileUploadOptions\n\t\t\t\t.uploadFile(file, fileUploadOptions.path)\n\t\t\t\t.then((url) => {\n\t\t\t\t\tonFinish(base64, file, url);\n\t\t\t\t\tsetFinished(true);\n\t\t\t\t})\n\t\t\t\t.catch((error) => {\n\t\t\t\t\tconsole.log('starting err process with ');\n\t\t\t\t});\n\t\t},\n\t\t[],\n\t);\n\n\tconst moveToCompressElseNext = (croppedImage: string) => {\n\t\tif (!croppedImage) {\n\t\t\tonCancel();\n\t\t}\n\t\tconst file = ImageService.base64ToImage(croppedImage);\n\t\tif (options.compress) {\n\t\t\tsetCurrentStep('compress');\n\t\t\tImageService.compressImage(file, compressionOptions).then((output) => {\n\t\t\t\tif (!output) {\n\t\t\t\t\tsetFinished(true);\n\t\t\t\t\tonCancel();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tmoveToUploadToFirestoreElseNext(output.base64, output.compressedFile);\n\t\t\t});\n\t\t} else {\n\t\t\tmoveToUploadToFirestoreElseNext(croppedImage, file);\n\t\t}\n\t};\n\n\tconst moveToCropElseNext = (croppedImage: string) => {\n\t\tif (options.crop) {\n\t\t\tsetCurrentStep('crop');\n\t\t} else {\n\t\t\tmoveToCompressElseNext(croppedImage);\n\t\t}\n\t};\n\n\tconst handleDivClick = () => {\n\t\tfileInputRef.current!.click();\n\t};\n\n\tconst handleImageChange = (event) => {\n\t\tconst file = event.target.files[0];\n\t\tconst reader = new FileReader();\n\n\t\treader.onload = () => {\n\t\t\tsetCurrentLocalImage({\n\t\t\t\tsrc: reader.result as string,\n\t\t\t});\n\t\t\tmoveToCropElseNext(reader.result as string);\n\t\t};\n\n\t\tif (file) {\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t};\n\n\tif (finished) {\n\t\treturn <></>;\n\t}\n\n\tif (currentStep === 'cloud-upload') {\n\t\tif (!fileUploadOptions || fileUploadOptions.success) {\n\t\t\treturn <></>;\n\t\t}\n\t\tif (fileUploadOptions.error) {\n\t\t\treturn (\n\t\t\t\t<div>\n\t\t\t\t\t<StateModalComponent\n\t\t\t\t\t\tstates={StateInterface.ERROR}\n\t\t\t\t\t\theading={'Error while uploading'}\n\t\t\t\t\t\tsubline={'Please check your image and try again'}\n\t\t\t\t\t\tisButtonEnabled={false}\n\t\t\t\t\t\twidth={300}\n\t\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\t\tsetFinished(true);\n\t\t\t\t\t\t\tonCancel();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t);\n\t\t}\n\t\treturn (\n\t\t\t<div>\n\t\t\t\t<StateModalComponent\n\t\t\t\t\theaderImage={loadingStateOptions?.headerImage}\n\t\t\t\t\tstates={StateInterface.LOADING}\n\t\t\t\t\theading={`Uploading your ${fileTitle || 'photo'}`}\n\t\t\t\t\tsubline={`Please wait while we upload your ${fileTitle || 'photo'}`}\n\t\t\t\t\tisButtonEnabled={false}\n\t\t\t\t\twidth={300}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{options.upload && (\n\t\t\t\t<input\n\t\t\t\t\tref={fileInputRef}\n\t\t\t\t\ttype=\"file\"\n\t\t\t\t\taccept=\"image/*\"\n\t\t\t\t\tstyle={{ display: 'none' }}\n\t\t\t\t\tonChange={handleImageChange}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{currentStep === 'crop' && (\n\t\t\t\t<BikImageCropper\n\t\t\t\t\tsrc={currentLocalImage.src!}\n\t\t\t\t\tonCropComplete={(croppedImage) => {\n\t\t\t\t\t\tsetCurrentLocalImage({\n\t\t\t\t\t\t\tsrc: croppedImage,\n\t\t\t\t\t\t});\n\t\t\t\t\t\tmoveToCompressElseNext(croppedImage);\n\t\t\t\t\t}}\n\t\t\t\t\taspectRatio={cropOptions!.aspectRatio!}\n\t\t\t\t\tonCancel={onCancel}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["BikImagePipeline","cropOptions","fileTitle","compressionOptions","currentImage","options","onFinish","onCancel","fileUploadOptions","loadingStateOptions","fileInputRef","useRef","currentStep","setCurrentStep","useState","currentLocalImage","setCurrentLocalImage","finished","setFinished","useEffect","upload","setTimeout","handleDivClick","crop","compress","uploadToFirestorage","moveToUploadToFirestoreElseNext","useCallback","base64","file","uploadFile","path","then","url","catch","error","console","log","moveToCompressElseNext","croppedImage","ImageService","base64ToImage","compressImage","output","compressedFile","current","click","_jsx","success","children","jsx","StateModalComponent","states","StateInterface","ERROR","heading","subline","isButtonEnabled","width","onClose","headerImage","LOADING","_jsxs","_Fragment","ref","type","accept","style","display","onChange","event","target","files","reader","FileReader","onload","src","result","readAsDataURL","BikImageCropper","onCropComplete","aspectRatio"],"mappings":"kaA4CgCA,EAC/BC,cACAC,YACAC,qBACAC,eACAC,UACAC,WACAC,WACAC,oBACAC,0BAEA,MAAMC,EAAeC,SAAyB,OACvCC,EAAaC,GAAkBC,EAAQA,YACvCC,EAAmBC,GAAwBF,EAAQA,SAACV,IACpDa,EAAUC,GAAeJ,EAAQA,UAAC,GAEzCK,EAAAA,WAAU,KACLd,EAAQe,QACXP,EAAe,UACfQ,YAAW,KACVC,GAAgB,GACd,MACOjB,EAAQkB,KAClBV,EAAe,QACLR,EAAQmB,SAClBX,EAAe,YACLR,EAAQoB,oBAClBZ,EAAe,gBAEfK,GAAY,EACZ,GACC,CACFb,EAAQe,OACRf,EAAQkB,KACRlB,EAAQmB,SACRnB,EAAQoB,sBAGT,MAAMC,EAAkCC,EAAAA,aACvC,CAACC,EAAgBC,KAChB,IAAKxB,EAAQoB,oBAGZ,OAFAnB,EAASsB,EAAQC,QACjBX,GAAY,GAGbL,EAAe,gBACVL,GAGLA,EACEsB,WAAWD,EAAMrB,EAAkBuB,MACnCC,MAAMC,IACN3B,EAASsB,EAAQC,EAAMI,GACvBf,GAAY,EAAK,IAEjBgB,OAAOC,IACPC,QAAQC,IAAI,6BAA6B,GACxC,GAEJ,IAGKC,EAA0BC,IAC1BA,GACJhC,IAED,MAAMsB,EAAOW,EAAAA,aAAaC,cAAcF,GACpClC,EAAQmB,UACXX,EAAe,YACf2B,EAAYA,aAACE,cAAcb,EAAM1B,GAAoB6B,MAAMW,IAC1D,IAAKA,EAGJ,OAFAzB,GAAY,QACZX,IAGDmB,EAAgCiB,EAAOf,OAAQe,EAAOC,eAAe,KAGtElB,EAAgCa,EAAcV,EAC9C,EAWIP,EAAiBA,KACtBZ,EAAamC,QAASC,OAAO,EAmB9B,OAAI7B,EACI8B,qBAGY,iBAAhBnC,GACEJ,GAAqBA,EAAkBwC,QACpCD,qBAEJvC,EAAkB2B,MAEpBY,EAAAA,IAAA,MAAA,CAAAE,SACCF,EAACG,IAAAC,sBACA,CAAAC,OAAQC,EAAcA,eAACC,MACvBC,QAAS,wBACTC,QAAS,wCACTC,iBAAiB,EACjBC,MAAO,IACPC,QAASA,KACRzC,GAAY,GACZX,GAAU,MAOdwC,EAAAA,oBACCA,EAACG,IAAAC,uBACAS,YAAanD,eAAAA,EAAqBmD,YAClCR,OAAQC,EAAcA,eAACQ,QACvBN,QAAS,kBAAkBrD,GAAa,UACxCsD,QAAS,oCAAoCtD,GAAa,UAC1DuD,iBAAiB,EACjBC,MAAO,QAOVI,EAAAA,KACEC,EAAAA,SAAA,CAAAd,SAAA,CAAA5C,EAAQe,QACR2B,EAAAA,IAAA,QAAA,CACCiB,IAAKtD,EACLuD,KAAK,OACLC,OAAO,UACPC,MAAO,CAAEC,QAAS,QAClBC,SA/DuBC,IAC1B,MAAMzC,EAAOyC,EAAMC,OAAOC,MAAM,GAC1BC,EAAS,IAAIC,WAEnBD,EAAOE,OAAS,KAhBWpC,MAiB1BvB,EAAqB,CACpB4D,IAAKH,EAAOI,SAlBatC,EAoBPkC,EAAOI,OAnBvBxE,EAAQkB,KACXV,EAAe,QAEfyB,EAAuBC,EAgBoB,EAGxCV,GACH4C,EAAOK,cAAcjD,EACrB,IAqDiB,SAAhBjB,GACAmC,EAAAA,IAACgC,EAAAA,gBACA,CAAAH,IAAK7D,EAAkB6D,IACvBI,eAAiBzC,IAChBvB,EAAqB,CACpB4D,IAAKrC,IAEND,EAAuBC,EAAa,EAErC0C,YAAahF,EAAagF,YAC1B1E,SAAUA,MAGV"}
+{"version":3,"file":"BikImagePipeline.js","sources":["../../../../../src/components/image-cropper/BikImagePipeline/BikImagePipeline.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n\tCompressImageOptions,\n\tImageService,\n} from '@src/components/image-compress';\nimport { StateInterface } from '@src/components/states';\nimport { StateModalComponent } from '@src/components/states-modal';\nimport BikImageCropper from '../BikImageCropper';\nimport { BikImageCropperProps } from '../BikImageCropper.model';\n\n/**\n * Todos\n * \t- Add option to pass https url in the src / edit an image\n */\n\nexport interface BikImagePipelineProps {\n\tfileTitle?: string;\n\tcropOptions?: Partial<BikImageCropperProps>;\n\tcompressionOptions?: CompressImageOptions;\n\tcurrentImage: {\n\t\tsrc?: string;\n\t};\n\toptions: {\n\t\tupload: boolean;\n\t\tcrop?: boolean;\n\t\tcompress?: boolean;\n\t\tuploadToFirestorage?: boolean;\n\t};\n\tonCancel: () => void;\n\tonFinish: (base64String: string, file?: File, url?: string) => void;\n\tfileUploadOptions?: {\n\t\tpath: string;\n\t\tuploadProgress: number;\n\t\tuploadFile: (file: File, path: string) => Promise<string>;\n\t\terror?: string;\n\t\tsuccess?: boolean;\n\t};\n\tloadingStateOptions?: {\n\t\theaderImage?: string;\n\t};\n}\n\ntype PIPELINE_STEPS = 'upload' | 'crop' | 'compress' | 'cloud-upload';\n\nexport const BikImagePipeline = ({\n\tcropOptions,\n\tfileTitle,\n\tcompressionOptions,\n\tcurrentImage,\n\toptions,\n\tonFinish,\n\tonCancel,\n\tfileUploadOptions,\n\tloadingStateOptions,\n}: BikImagePipelineProps) => {\n\tconst fileInputRef = useRef<HTMLInputElement>(null);\n\tconst [currentStep, setCurrentStep] = useState<PIPELINE_STEPS>();\n\tconst [currentLocalImage, setCurrentLocalImage] = useState(currentImage);\n\tconst [finished, setFinished] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (options.upload) {\n\t\t\tsetCurrentStep('upload');\n\t\t\tsetTimeout(() => {\n\t\t\t\thandleDivClick();\n\t\t\t}, 500);\n\t\t} else if (options.crop) {\n\t\t\tsetCurrentStep('crop');\n\t\t} else if (options.compress) {\n\t\t\tsetCurrentStep('compress');\n\t\t} else if (options.uploadToFirestorage) {\n\t\t\tsetCurrentStep('cloud-upload');\n\t\t} else {\n\t\t\tsetFinished(true);\n\t\t}\n\t}, [\n\t\toptions.upload,\n\t\toptions.crop,\n\t\toptions.compress,\n\t\toptions.uploadToFirestorage,\n\t]);\n\n\tconst moveToUploadToFirestoreElseNext = useCallback(\n\t\t(base64: string, file: File) => {\n\t\t\tif (!options.uploadToFirestorage) {\n\t\t\t\tonFinish(base64, file);\n\t\t\t\tsetFinished(true);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetCurrentStep('cloud-upload');\n\t\t\tif (!fileUploadOptions) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tfileUploadOptions\n\t\t\t\t.uploadFile(file, fileUploadOptions.path)\n\t\t\t\t.then((url) => {\n\t\t\t\t\tonFinish(base64, file, url);\n\t\t\t\t\tsetFinished(true);\n\t\t\t\t})\n\t\t\t\t.catch((error) => {\n\t\t\t\t\tconsole.log('starting err process with ');\n\t\t\t\t});\n\t\t},\n\t\t[],\n\t);\n\n\tconst moveToCompressElseNext = (croppedImage: string) => {\n\t\tif (!croppedImage) {\n\t\t\tonCancel();\n\t\t}\n\t\tconst file = ImageService.base64ToImage(croppedImage);\n\t\tif (options.compress) {\n\t\t\tsetCurrentStep('compress');\n\t\t\tImageService.compressImage(file, compressionOptions).then((output) => {\n\t\t\t\tif (!output) {\n\t\t\t\t\tsetFinished(true);\n\t\t\t\t\tonCancel();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tmoveToUploadToFirestoreElseNext(output.base64, output.compressedFile);\n\t\t\t});\n\t\t} else {\n\t\t\tmoveToUploadToFirestoreElseNext(croppedImage, file);\n\t\t}\n\t};\n\n\tconst moveToCropElseNext = (croppedImage: string) => {\n\t\tif (options.crop) {\n\t\t\tsetCurrentStep('crop');\n\t\t} else {\n\t\t\tmoveToCompressElseNext(croppedImage);\n\t\t}\n\t};\n\n\tconst handleDivClick = () => {\n\t\tfileInputRef.current!.click();\n\t};\n\n\tconst handleImageChange = (event) => {\n\t\tconst file = event.target.files[0];\n\t\tconst reader = new FileReader();\n\n\t\treader.onload = () => {\n\t\t\tsetCurrentLocalImage({\n\t\t\t\tsrc: reader.result as string,\n\t\t\t});\n\t\t\tmoveToCropElseNext(reader.result as string);\n\t\t};\n\n\t\tif (file) {\n\t\t\treader.readAsDataURL(file);\n\t\t}\n\t};\n\n\tif (finished) {\n\t\treturn <></>;\n\t}\n\n\tif (currentStep === 'cloud-upload') {\n\t\tif (!fileUploadOptions || fileUploadOptions.success) {\n\t\t\treturn <></>;\n\t\t}\n\t\tif (fileUploadOptions.error) {\n\t\t\treturn (\n\t\t\t\t<div>\n\t\t\t\t\t<StateModalComponent\n\t\t\t\t\t\tstates={StateInterface.ERROR}\n\t\t\t\t\t\theading={'Error while uploading'}\n\t\t\t\t\t\tsubline={'Please check your image and try again'}\n\t\t\t\t\t\tisButtonEnabled={false}\n\t\t\t\t\t\twidth={300}\n\t\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\t\tsetFinished(true);\n\t\t\t\t\t\t\tonCancel();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t);\n\t\t}\n\t\treturn (\n\t\t\t<div>\n\t\t\t\t<StateModalComponent\n\t\t\t\t\theaderImage={loadingStateOptions?.headerImage}\n\t\t\t\t\tstates={StateInterface.LOADING}\n\t\t\t\t\theading={`Uploading your ${fileTitle || 'photo'}`}\n\t\t\t\t\tsubline={`Please wait while we upload your ${fileTitle || 'photo'}`}\n\t\t\t\t\tisButtonEnabled={false}\n\t\t\t\t\twidth={300}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{options.upload && (\n\t\t\t\t<input\n\t\t\t\t\tref={fileInputRef}\n\t\t\t\t\ttype=\"file\"\n\t\t\t\t\taccept=\"image/*\"\n\t\t\t\t\tstyle={{ display: 'none' }}\n\t\t\t\t\tonChange={handleImageChange}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{currentStep === 'crop' && (\n\t\t\t\t<BikImageCropper\n\t\t\t\t\tsrc={currentLocalImage.src!}\n\t\t\t\t\tonCropComplete={(croppedImage) => {\n\t\t\t\t\t\tsetCurrentLocalImage({\n\t\t\t\t\t\t\tsrc: croppedImage,\n\t\t\t\t\t\t});\n\t\t\t\t\t\tmoveToCompressElseNext(croppedImage);\n\t\t\t\t\t}}\n\t\t\t\t\taspectRatio={cropOptions!.aspectRatio!}\n\t\t\t\t\tonCancel={onCancel}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["_ref","cropOptions","fileTitle","compressionOptions","currentImage","options","onFinish","onCancel","fileUploadOptions","loadingStateOptions","fileInputRef","useRef","currentStep","setCurrentStep","useState","currentLocalImage","setCurrentLocalImage","finished","setFinished","useEffect","upload","setTimeout","handleDivClick","crop","compress","uploadToFirestorage","moveToUploadToFirestoreElseNext","useCallback","base64","file","uploadFile","path","then","url","catch","error","console","log","moveToCompressElseNext","croppedImage","ImageService","base64ToImage","compressImage","output","compressedFile","current","click","_jsx","success","children","jsx","StateModalComponent","states","StateInterface","ERROR","heading","subline","isButtonEnabled","width","onClose","headerImage","LOADING","_jsxs","_Fragment","ref","type","accept","style","display","onChange","event","target","files","reader","FileReader","onload","src","result","readAsDataURL","BikImageCropper","onCropComplete","aspectRatio"],"mappings":"kaA4CgCA,IAUJ,IAVKC,YAChCA,EAAWC,UACXA,EAASC,mBACTA,EAAkBC,aAClBA,EAAYC,QACZA,EAAOC,SACPA,EAAQC,SACRA,EAAQC,kBACRA,EAAiBC,oBACjBA,GACuBT,EACvB,MAAMU,EAAeC,SAAyB,OACvCC,EAAaC,GAAkBC,EAAQA,YACvCC,EAAmBC,GAAwBF,EAAQA,SAACV,IACpDa,EAAUC,GAAeJ,EAAQA,UAAC,GAEzCK,EAAAA,WAAU,KACLd,EAAQe,QACXP,EAAe,UACfQ,YAAW,KACVC,GAAgB,GACd,MACOjB,EAAQkB,KAClBV,EAAe,QACLR,EAAQmB,SAClBX,EAAe,YACLR,EAAQoB,oBAClBZ,EAAe,gBAEfK,GAAY,EACZ,GACC,CACFb,EAAQe,OACRf,EAAQkB,KACRlB,EAAQmB,SACRnB,EAAQoB,sBAGT,MAAMC,EAAkCC,EAAAA,aACvC,CAACC,EAAgBC,KAChB,IAAKxB,EAAQoB,oBAGZ,OAFAnB,EAASsB,EAAQC,QACjBX,GAAY,GAGbL,EAAe,gBACVL,GAGLA,EACEsB,WAAWD,EAAMrB,EAAkBuB,MACnCC,MAAMC,IACN3B,EAASsB,EAAQC,EAAMI,GACvBf,GAAY,EAAK,IAEjBgB,OAAOC,IACPC,QAAQC,IAAI,6BAA6B,GACxC,GAEJ,IAGKC,EAA0BC,IAC1BA,GACJhC,IAED,MAAMsB,EAAOW,EAAAA,aAAaC,cAAcF,GACpClC,EAAQmB,UACXX,EAAe,YACf2B,EAAYA,aAACE,cAAcb,EAAM1B,GAAoB6B,MAAMW,IAC1D,IAAKA,EAGJ,OAFAzB,GAAY,QACZX,IAGDmB,EAAgCiB,EAAOf,OAAQe,EAAOC,eAAe,KAGtElB,EAAgCa,EAAcV,EAC9C,EAWIP,EAAiBA,KACtBZ,EAAamC,QAASC,OAAO,EAmB9B,OAAI7B,EACI8B,qBAGY,iBAAhBnC,GACEJ,GAAqBA,EAAkBwC,QACpCD,qBAEJvC,EAAkB2B,MAEpBY,EAAAA,IAAA,MAAA,CAAAE,SACCF,EAACG,IAAAC,sBACA,CAAAC,OAAQC,EAAcA,eAACC,MACvBC,QAAS,wBACTC,QAAS,wCACTC,iBAAiB,EACjBC,MAAO,IACPC,QAASA,KACRzC,GAAY,GACZX,GAAU,MAOdwC,EAAAA,oBACCA,EAACG,IAAAC,uBACAS,YAAanD,eAAAA,EAAqBmD,YAClCR,OAAQC,EAAcA,eAACQ,QACvBN,0BAA2BrD,GAAa,UACxCsD,QAAS,oCAAoCtD,GAAa,UAC1DuD,iBAAiB,EACjBC,MAAO,QAOVI,EAAAA,KACEC,EAAAA,SAAA,CAAAd,SAAA,CAAA5C,EAAQe,QACR2B,EAAAA,IAAA,QAAA,CACCiB,IAAKtD,EACLuD,KAAK,OACLC,OAAO,UACPC,MAAO,CAAEC,QAAS,QAClBC,SA/DuBC,IAC1B,MAAMzC,EAAOyC,EAAMC,OAAOC,MAAM,GAC1BC,EAAS,IAAIC,WAEnBD,EAAOE,OAAS,KAhBWpC,MAiB1BvB,EAAqB,CACpB4D,IAAKH,EAAOI,SAlBatC,EAoBPkC,EAAOI,OAnBvBxE,EAAQkB,KACXV,EAAe,QAEfyB,EAAuBC,EAgBoB,EAGxCV,GACH4C,EAAOK,cAAcjD,EACrB,IAqDiB,SAAhBjB,GACAmC,EAAAA,IAACgC,EAAAA,gBACA,CAAAH,IAAK7D,EAAkB6D,IACvBI,eAAiBzC,IAChBvB,EAAqB,CACpB4D,IAAKrC,IAEND,EAAuBC,EAAa,EAErC0C,YAAahF,EAAagF,YAC1B1E,SAAUA,MAGV"}

package/dist/cjs/components/input/ChipInput.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../constants/Theme.js"),r=require("../TypographyStyle.js"),s=require("./ChipInput.styled.js");exports.default=({onChipsChange:o,placeholder:i,chips:l,label:a,labelColor:c,hintText:u,hintTextColor:y,error:d,inputHeight:p,createChipKeys:g,chipsContainerCustomStyle:h,nativeID:C})=>{const[O,v]=t.useState(""),[j,S]=t.useState(!1),x=t.useRef(null),b=g||[",",188,"Enter",13],R=s.getContainerStyle(!!d,p,h,j),m=j?{}:s.getContainerHoverStyle(),L=s.getChipStyle(),f=s.getChipRemoveStyle(),k=s.getInputStyle(p);return e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:8},id:C},{children:[a&&e.jsx(r.BodySecondary,Object.assign({style:{color:j?n.COLORS.content.brand:d?n.COLORS.content.negative:c||n.COLORS.content.primary}},{children:a})),e.jsxs("div",Object.assign({style:R,onClick:()=>{var e;null===(e=x.current)||void 0===e||e.focus()},onMouseEnter:e=>{j||Object.assign(e.currentTarget.style,m)},onMouseLeave:e=>{j||(e.currentTarget.style.border=`1px solid ${d?n.COLORS.stroke.negative.vibrant:n.COLORS.stroke.primary}`)}},{children:[l.map(((t,r)=>e.jsxs("div",Object.assign({style:L},{children:[e.jsx("span",{children:t}),e.jsx("button",Object.assign({style:f,onClick:e=>{var t;e.stopPropagation(),t=r,o(l.filter(((e,n)=>n!==t)))},onMouseEnter:e=>{e.currentTarget.style.color=n.COLORS.content.secondary},onMouseLeave:e=>{e.currentTarget.style.color=n.COLORS.content.secondary},"aria-label":`Remove ${t}`},{children:"×"}))]}),r))),e.jsx("input",{ref:x,type:"text",value:O,onChange:e=>v(e.target.value),onKeyDown:e=>{if(b.includes(e.key)||b.includes(e.keyCode)||b.includes(e.which)){e.preventDefault();const t=O.trim();t&&!l.includes(t)&&(o([...l,t]),v(""))}else"Backspace"===e.key&&""===O&&l.length>0&&o(l.slice(0,-1))},onFocus:()=>{S(!0)},onBlur:()=>{S(!1);const e=O.trim();e&&!l.includes(e)&&(o([...l,e]),v(""))},placeholder:0===l.length&&i&&!j?i:void 0,style:k})]})),(!!u||!!d)&&e.jsx(r.BodyCaption,Object.assign({style:{color:d?n.COLORS.content.negative:y||n.COLORS.content.secondary}},{children:d||u}))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../constants/Theme.js"),r=require("../TypographyStyle.js"),s=require("./ChipInput.styled.js");exports.default=o=>{let{onChipsChange:l,placeholder:i,chips:a,label:c,labelColor:u,hintText:y,hintTextColor:d,error:p,inputHeight:g,createChipKeys:h,chipsContainerCustomStyle:C,nativeID:O}=o;const[v,j]=t.useState(""),[S,x]=t.useState(!1),b=t.useRef(null),R=h||[",",188,"Enter",13],m=s.getContainerStyle(!!p,g,C,S),L=S?{}:s.getContainerHoverStyle(),f=s.getChipStyle(),k=s.getChipRemoveStyle(),T=s.getInputStyle(g);return e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:8},id:O},{children:[c&&e.jsx(r.BodySecondary,Object.assign({style:{color:S?n.COLORS.content.brand:p?n.COLORS.content.negative:u||n.COLORS.content.primary}},{children:c})),e.jsxs("div",Object.assign({style:m,onClick:()=>{var e;null===(e=b.current)||void 0===e||e.focus()},onMouseEnter:e=>{S||Object.assign(e.currentTarget.style,L)},onMouseLeave:e=>{S||(e.currentTarget.style.border=`1px solid ${p?n.COLORS.stroke.negative.vibrant:n.COLORS.stroke.primary}`)}},{children:[a.map(((t,r)=>e.jsxs("div",Object.assign({style:f},{children:[e.jsx("span",{children:t}),e.jsx("button",Object.assign({style:k,onClick:e=>{var t;e.stopPropagation(),t=r,l(a.filter(((e,n)=>n!==t)))},onMouseEnter:e=>{e.currentTarget.style.color=n.COLORS.content.secondary},onMouseLeave:e=>{e.currentTarget.style.color=n.COLORS.content.secondary},"aria-label":`Remove ${t}`},{children:"×"}))]}),r))),e.jsx("input",{ref:b,type:"text",value:v,onChange:e=>j(e.target.value),onKeyDown:e=>{if(R.includes(e.key)||R.includes(e.keyCode)||R.includes(e.which)){e.preventDefault();const t=v.trim();t&&!a.includes(t)&&(l([...a,t]),j(""))}else"Backspace"===e.key&&""===v&&a.length>0&&l(a.slice(0,-1))},onFocus:()=>{x(!0)},onBlur:()=>{x(!1);const e=v.trim();e&&!a.includes(e)&&(l([...a,e]),j(""))},placeholder:0===a.length&&i&&!S?i:void 0,style:T})]})),(!!y||!!p)&&e.jsx(r.BodyCaption,Object.assign({style:{color:p?n.COLORS.content.negative:d||n.COLORS.content.secondary}},{children:p||y}))]}))};
 //# sourceMappingURL=ChipInput.js.map

package/dist/cjs/components/input/ChipInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChipInput.js","sources":["../../../../src/components/input/ChipInput.tsx"],"sourcesContent":["import React, { KeyboardEvent, useRef, useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { BodyCaption, BodySecondary } from '../TypographyStyle';\nimport {\n\tgetChipRemoveStyle,\n\tgetChipStyle,\n\tgetContainerHoverStyle,\n\tgetContainerStyle,\n\tgetInputStyle,\n} from './ChipInput.styled';\n\nexport const extractSingleValueIfAny = (nativeID: string) =>\n\t(document?.querySelector(`#${nativeID} input`) as HTMLInputElement)?.value;\n\nexport const getInputNode = (nativeID: string) =>\n\tdocument?.querySelector(`#${nativeID} input`) as HTMLInputElement;\n\nexport interface ChipInputProps {\n\tonChipsChange: (chips: (string | number)[]) => void;\n\tplaceholder: string;\n\tlabel?: string;\n\tlabelColor?: string;\n\thintText?: string;\n\thintTextColor?: string;\n\tchipTheme?: () => void;\n\tchips: string[];\n\terror?: string;\n\tinputHeight?: number;\n\tcreateChipKeys?: (string | number)[];\n\tchipsContainerCustomStyle?: React.CSSProperties;\n\tnativeID?: string;\n}\n\nconst ChipInput: React.FC<ChipInputProps> = ({\n\tonChipsChange,\n\tplaceholder,\n\tchips,\n\tlabel,\n\tlabelColor,\n\thintText,\n\thintTextColor,\n\terror,\n\tinputHeight,\n\tcreateChipKeys,\n\tchipsContainerCustomStyle,\n\tnativeID,\n}) => {\n\tconst [inputValue, setInputValue] = useState('');\n\tconst [focused, setFocused] = useState(false);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\t// Default chip creation keys: comma (188), enter (13)\n\tconst defaultKeys = [',', 188, 'Enter', 13];\n\tconst chipKeys = createChipKeys || defaultKeys;\n\n\tconst handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n\t\tconst shouldCreateChip =\n\t\t\tchipKeys.includes(e.key) ||\n\t\t\tchipKeys.includes(e.keyCode) ||\n\t\t\tchipKeys.includes(e.which);\n\n\t\tif (shouldCreateChip) {\n\t\t\te.preventDefault();\n\t\t\tconst trimmedValue = inputValue.trim();\n\t\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\t\tsetInputValue('');\n\t\t\t}\n\t\t} else if (e.key === 'Backspace' && inputValue === '' && chips.length > 0) {\n\t\t\t// Remove last chip on backspace when input is empty\n\t\t\tonChipsChange(chips.slice(0, -1));\n\t\t}\n\t};\n\n\tconst handleRemoveChip = (indexToRemove: number) => {\n\t\tonChipsChange(chips.filter((_, index) => index !== indexToRemove));\n\t};\n\n\tconst handleFocus = () => {\n\t\tsetFocused(true);\n\t};\n\n\tconst handleBlur = () => {\n\t\tsetFocused(false);\n\t\t// Optionally create chip on blur if there's a value\n\t\tconst trimmedValue = inputValue.trim();\n\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\tsetInputValue('');\n\t\t}\n\t};\n\n\tconst handleContainerClick = () => {\n\t\tinputRef.current?.focus();\n\t};\n\n\tconst containerStyle = getContainerStyle(\n\t\t!!error,\n\t\tinputHeight,\n\t\tchipsContainerCustomStyle,\n\t\tfocused,\n\t);\n\tconst containerHoverStyle = focused ? {} : getContainerHoverStyle();\n\tconst chipStyle = getChipStyle();\n\tconst chipRemoveStyle = getChipRemoveStyle();\n\tconst inputStyle = getInputStyle(inputHeight);\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ display: 'flex', flexDirection: 'column', gap: 8 }}\n\t\t\tid={nativeID}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: focused\n\t\t\t\t\t\t\t? COLORS.content.brand\n\t\t\t\t\t\t\t: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: labelColor || COLORS.content.primary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</BodySecondary>\n\t\t\t)}\n\t\t\t<div\n\t\t\t\tstyle={containerStyle}\n\t\t\t\tonClick={handleContainerClick}\n\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\tObject.assign(e.currentTarget.style, containerHoverStyle);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\te.currentTarget.style.border = `1px solid ${\n\t\t\t\t\t\t\terror ? COLORS.stroke.negative.vibrant : COLORS.stroke.primary\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{chips.map((chip, index) => (\n\t\t\t\t\t<div key={index} style={chipStyle}>\n\t\t\t\t\t\t<span>{chip}</span>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tstyle={chipRemoveStyle}\n\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\thandleRemoveChip(index);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-label={`Remove ${chip}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t×\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t\t<input\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\tonChange={(e) => setInputValue(e.target.value)}\n\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tchips.length === 0 && !!placeholder && !focused\n\t\t\t\t\t\t\t? placeholder\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={inputStyle}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t{(!!hintText || !!error) && (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: hintTextColor || COLORS.content.secondary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{error ? error : hintText}\n\t\t\t\t</BodyCaption>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default ChipInput;\n"],"names":["ChipInput","onChipsChange","placeholder","chips","label","labelColor","hintText","hintTextColor","error","inputHeight","createChipKeys","chipsContainerCustomStyle","nativeID","inputValue","setInputValue","useState","focused","setFocused","inputRef","useRef","chipKeys","containerStyle","getContainerStyle","containerHoverStyle","getContainerHoverStyle","chipStyle","getChipStyle","chipRemoveStyle","getChipRemoveStyle","inputStyle","getInputStyle","_jsxs","Object","assign","style","display","flexDirection","gap","id","children","_jsx","BodySecondary","color","COLORS","content","brand","negative","primary","jsxs","onClick","handleContainerClick","_a","current","focus","onMouseEnter","e","currentTarget","onMouseLeave","border","stroke","vibrant","map","chip","index","jsx","indexToRemove","stopPropagation","filter","_","secondary","ref","type","value","onChange","target","onKeyDown","includes","key","keyCode","which","preventDefault","trimmedValue","trim","length","slice","onFocus","handleFocus","onBlur","handleBlur","undefined","BodyCaption"],"mappings":"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"}
+{"version":3,"file":"ChipInput.js","sources":["../../../../src/components/input/ChipInput.tsx"],"sourcesContent":["import React, { KeyboardEvent, useRef, useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { BodyCaption, BodySecondary } from '../TypographyStyle';\nimport {\n\tgetChipRemoveStyle,\n\tgetChipStyle,\n\tgetContainerHoverStyle,\n\tgetContainerStyle,\n\tgetInputStyle,\n} from './ChipInput.styled';\n\nexport const extractSingleValueIfAny = (nativeID: string) =>\n\t(document?.querySelector(`#${nativeID} input`) as HTMLInputElement)?.value;\n\nexport const getInputNode = (nativeID: string) =>\n\tdocument?.querySelector(`#${nativeID} input`) as HTMLInputElement;\n\nexport interface ChipInputProps {\n\tonChipsChange: (chips: (string | number)[]) => void;\n\tplaceholder: string;\n\tlabel?: string;\n\tlabelColor?: string;\n\thintText?: string;\n\thintTextColor?: string;\n\tchipTheme?: () => void;\n\tchips: string[];\n\terror?: string;\n\tinputHeight?: number;\n\tcreateChipKeys?: (string | number)[];\n\tchipsContainerCustomStyle?: React.CSSProperties;\n\tnativeID?: string;\n}\n\nconst ChipInput: React.FC<ChipInputProps> = ({\n\tonChipsChange,\n\tplaceholder,\n\tchips,\n\tlabel,\n\tlabelColor,\n\thintText,\n\thintTextColor,\n\terror,\n\tinputHeight,\n\tcreateChipKeys,\n\tchipsContainerCustomStyle,\n\tnativeID,\n}) => {\n\tconst [inputValue, setInputValue] = useState('');\n\tconst [focused, setFocused] = useState(false);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\t// Default chip creation keys: comma (188), enter (13)\n\tconst defaultKeys = [',', 188, 'Enter', 13];\n\tconst chipKeys = createChipKeys || defaultKeys;\n\n\tconst handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n\t\tconst shouldCreateChip =\n\t\t\tchipKeys.includes(e.key) ||\n\t\t\tchipKeys.includes(e.keyCode) ||\n\t\t\tchipKeys.includes(e.which);\n\n\t\tif (shouldCreateChip) {\n\t\t\te.preventDefault();\n\t\t\tconst trimmedValue = inputValue.trim();\n\t\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\t\tsetInputValue('');\n\t\t\t}\n\t\t} else if (e.key === 'Backspace' && inputValue === '' && chips.length > 0) {\n\t\t\t// Remove last chip on backspace when input is empty\n\t\t\tonChipsChange(chips.slice(0, -1));\n\t\t}\n\t};\n\n\tconst handleRemoveChip = (indexToRemove: number) => {\n\t\tonChipsChange(chips.filter((_, index) => index !== indexToRemove));\n\t};\n\n\tconst handleFocus = () => {\n\t\tsetFocused(true);\n\t};\n\n\tconst handleBlur = () => {\n\t\tsetFocused(false);\n\t\t// Optionally create chip on blur if there's a value\n\t\tconst trimmedValue = inputValue.trim();\n\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\tsetInputValue('');\n\t\t}\n\t};\n\n\tconst handleContainerClick = () => {\n\t\tinputRef.current?.focus();\n\t};\n\n\tconst containerStyle = getContainerStyle(\n\t\t!!error,\n\t\tinputHeight,\n\t\tchipsContainerCustomStyle,\n\t\tfocused,\n\t);\n\tconst containerHoverStyle = focused ? {} : getContainerHoverStyle();\n\tconst chipStyle = getChipStyle();\n\tconst chipRemoveStyle = getChipRemoveStyle();\n\tconst inputStyle = getInputStyle(inputHeight);\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ display: 'flex', flexDirection: 'column', gap: 8 }}\n\t\t\tid={nativeID}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: focused\n\t\t\t\t\t\t\t? COLORS.content.brand\n\t\t\t\t\t\t\t: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: labelColor || COLORS.content.primary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</BodySecondary>\n\t\t\t)}\n\t\t\t<div\n\t\t\t\tstyle={containerStyle}\n\t\t\t\tonClick={handleContainerClick}\n\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\tObject.assign(e.currentTarget.style, containerHoverStyle);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\te.currentTarget.style.border = `1px solid ${\n\t\t\t\t\t\t\terror ? COLORS.stroke.negative.vibrant : COLORS.stroke.primary\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{chips.map((chip, index) => (\n\t\t\t\t\t<div key={index} style={chipStyle}>\n\t\t\t\t\t\t<span>{chip}</span>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tstyle={chipRemoveStyle}\n\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\thandleRemoveChip(index);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-label={`Remove ${chip}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t×\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t\t<input\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\tonChange={(e) => setInputValue(e.target.value)}\n\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tchips.length === 0 && !!placeholder && !focused\n\t\t\t\t\t\t\t? placeholder\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={inputStyle}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t{(!!hintText || !!error) && (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: hintTextColor || COLORS.content.secondary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{error ? error : hintText}\n\t\t\t\t</BodyCaption>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default ChipInput;\n"],"names":["_ref","onChipsChange","placeholder","chips","label","labelColor","hintText","hintTextColor","error","inputHeight","createChipKeys","chipsContainerCustomStyle","nativeID","inputValue","setInputValue","useState","focused","setFocused","inputRef","useRef","chipKeys","containerStyle","getContainerStyle","containerHoverStyle","getContainerHoverStyle","chipStyle","getChipStyle","chipRemoveStyle","getChipRemoveStyle","inputStyle","getInputStyle","_jsxs","Object","assign","style","display","flexDirection","gap","id","children","_jsx","BodySecondary","color","COLORS","content","brand","negative","primary","jsxs","onClick","handleContainerClick","_a","current","focus","onMouseEnter","e","currentTarget","onMouseLeave","border","stroke","vibrant","map","chip","index","jsx","indexToRemove","stopPropagation","filter","_","secondary","ref","type","value","onChange","target","onKeyDown","includes","key","keyCode","which","preventDefault","trimmedValue","trim","length","slice","onFocus","handleFocus","onBlur","handleBlur","undefined","BodyCaption"],"mappings":"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"}

package/dist/cjs/components/input/ChipInput.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChipInput.styled.js","sources":["../../../../src/components/input/ChipInput.styled.ts"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const getChipStyle = (): React.CSSProperties => ({\n\tpadding: '0px 8px 0px 8px',\n\tbackground: COLORS.surface.subdued,\n\tborder: `1px solid ${COLORS.stroke.primary}`,\n\tfontSize: 12,\n\tcolor: COLORS.content.secondary,\n\tfontWeight: 400,\n\tborderRadius: 4,\n\tdisplay: 'inline-flex',\n\talignItems: 'center',\n\tjustifyContent: 'center',\n\tcursor: 'default',\n\tmargin: '0px 8px 0px 0px',\n\tfontFamily: 'Inter',\n\tmarginBottom: '2px',\n\tmarginTop: '2px',\n\theight: 24,\n});\n\nexport const getChipRemoveStyle = (): React.CSSProperties => ({\n\tfontSize: 12,\n\tfontFamily: 'Inter',\n\tcursor: 'pointer',\n\tfontWeight: 'normal',\n\tcolor: COLORS.content.secondary,\n\tmarginLeft: 6,\n\tbackground: 'none',\n\tborder: 'none',\n\tpadding: 0,\n\tdisplay: 'inline-flex',\n\talignItems: 'center',\n});\n\nexport const getContainerStyle = (\n\terror?: boolean,\n\theight?: number,\n\tchipsContainerCustomStyle?: React.CSSProperties,\n\tfocused?: boolean,\n): React.CSSProperties => ({\n\tdisplay: 'flex',\n\tposition: 'relative',\n\tborder: `${focused ? 2 : 1}px solid ${\n\t\tfocused\n\t\t\t? COLORS.stroke.brand\n\t\t\t: error\n\t\t\t? COLORS.stroke.negative.vibrant\n\t\t\t: COLORS.stroke.primary\n\t}`,\n\tbackgroundColor: COLORS.surface.standard,\n\talignItems: 'center',\n\tflexWrap: 'wrap',\n\tpadding: '3px 8px 3px 8px',\n\tborderRadius: 4,\n\tcursor: 'text',\n\tminHeight: height || 32,\n\t...chipsContainerCustomStyle,\n});\n\nexport const getContainerHoverStyle = (): React.CSSProperties => ({\n\tborder: `2px solid ${COLORS.stroke.brand}`,\n});\n\nexport const getInputStyle = (height?: number): React.CSSProperties => ({\n\tborder: 'none',\n\toutline: 'none',\n\tboxSizing: 'border-box',\n\tfontSize: 14,\n\tfontFamily: 'Inter',\n\tfontWeight: 400,\n\theight: height || 32,\n\tflex: 1,\n\tminWidth: 120,\n\tpaddingTop: 0,\n\tpaddingBottom: 0,\n\tbackgroundColor: 'transparent',\n});\n"],"names":["getChipRemoveStyle","fontSize","fontFamily","cursor","fontWeight","color","COLORS","content","secondary","marginLeft","background","border","padding","display","alignItems","getChipStyle","surface","subdued","stroke","primary","borderRadius","justifyContent","margin","marginBottom","marginTop","height","getContainerHoverStyle","brand","getContainerStyle","error","chipsContainerCustomStyle","focused","position","negative","vibrant","backgroundColor","standard","flexWrap","minHeight","outline","boxSizing","flex","minWidth","paddingTop","paddingBottom"],"mappings":"yIAsBkCA,KAA4B,CAC7DC,SAAU,GACVC,WAAY,QACZC,OAAQ,UACRC,WAAY,SACZC,MAAOC,EAAAA,OAAOC,QAAQC,UACtBC,WAAY,EACZC,WAAY,OACZC,OAAQ,OACRC,QAAS,EACTC,QAAS,cACTC,WAAY,gCA9BeC,KAA4B,CACvDH,QAAS,kBACTF,WAAYJ,EAAAA,OAAOU,QAAQC,QAC3BN,OAAQ,aAAaL,EAAMA,OAACY,OAAOC,UACnClB,SAAU,GACVI,MAAOC,EAAAA,OAAOC,QAAQC,UACtBJ,WAAY,IACZgB,aAAc,EACdP,QAAS,cACTC,WAAY,SACZO,eAAgB,SAChBlB,OAAQ,UACRmB,OAAQ,kBACRpB,WAAY,QACZqB,aAAc,MACdC,UAAW,MACXC,OAAQ,oCA0C6BC,KAA4B,CACjEf,OAAQ,aAAaL,EAAMA,OAACY,OAAOS,oCA1BHC,CAChCC,EACAJ,EACAK,EACAC,mBAEAlB,QAAS,OACTmB,SAAU,WACVrB,OAAQ,GAAGoB,EAAU,EAAI,aACxBA,EACGzB,EAAAA,OAAOY,OAAOS,MACdE,EACAvB,EAAAA,OAAOY,OAAOe,SAASC,QACvB5B,SAAOY,OAAOC,UAElBgB,gBAAiB7B,EAAAA,OAAOU,QAAQoB,SAChCtB,WAAY,SACZuB,SAAU,OACVzB,QAAS,kBACTQ,aAAc,EACdjB,OAAQ,OACRmC,UAAWb,GAAU,IAClBK,yBAO0BL,IAA0C,CACvEd,OAAQ,OACR4B,QAAS,OACTC,UAAW,aACXvC,SAAU,GACVC,WAAY,QACZE,WAAY,IACZqB,OAAQA,GAAU,GAClBgB,KAAM,EACNC,SAAU,IACVC,WAAY,EACZC,cAAe,EACfT,gBAAiB"}
+{"version":3,"file":"ChipInput.styled.js","sources":["../../../../src/components/input/ChipInput.styled.ts"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const getChipStyle = (): React.CSSProperties => ({\n\tpadding: '0px 8px 0px 8px',\n\tbackground: COLORS.surface.subdued,\n\tborder: `1px solid ${COLORS.stroke.primary}`,\n\tfontSize: 12,\n\tcolor: COLORS.content.secondary,\n\tfontWeight: 400,\n\tborderRadius: 4,\n\tdisplay: 'inline-flex',\n\talignItems: 'center',\n\tjustifyContent: 'center',\n\tcursor: 'default',\n\tmargin: '0px 8px 0px 0px',\n\tfontFamily: 'Inter',\n\tmarginBottom: '2px',\n\tmarginTop: '2px',\n\theight: 24,\n});\n\nexport const getChipRemoveStyle = (): React.CSSProperties => ({\n\tfontSize: 12,\n\tfontFamily: 'Inter',\n\tcursor: 'pointer',\n\tfontWeight: 'normal',\n\tcolor: COLORS.content.secondary,\n\tmarginLeft: 6,\n\tbackground: 'none',\n\tborder: 'none',\n\tpadding: 0,\n\tdisplay: 'inline-flex',\n\talignItems: 'center',\n});\n\nexport const getContainerStyle = (\n\terror?: boolean,\n\theight?: number,\n\tchipsContainerCustomStyle?: React.CSSProperties,\n\tfocused?: boolean,\n): React.CSSProperties => ({\n\tdisplay: 'flex',\n\tposition: 'relative',\n\tborder: `${focused ? 2 : 1}px solid ${\n\t\tfocused\n\t\t\t? COLORS.stroke.brand\n\t\t\t: error\n\t\t\t? COLORS.stroke.negative.vibrant\n\t\t\t: COLORS.stroke.primary\n\t}`,\n\tbackgroundColor: COLORS.surface.standard,\n\talignItems: 'center',\n\tflexWrap: 'wrap',\n\tpadding: '3px 8px 3px 8px',\n\tborderRadius: 4,\n\tcursor: 'text',\n\tminHeight: height || 32,\n\t...chipsContainerCustomStyle,\n});\n\nexport const getContainerHoverStyle = (): React.CSSProperties => ({\n\tborder: `2px solid ${COLORS.stroke.brand}`,\n});\n\nexport const getInputStyle = (height?: number): React.CSSProperties => ({\n\tborder: 'none',\n\toutline: 'none',\n\tboxSizing: 'border-box',\n\tfontSize: 14,\n\tfontFamily: 'Inter',\n\tfontWeight: 400,\n\theight: height || 32,\n\tflex: 1,\n\tminWidth: 120,\n\tpaddingTop: 0,\n\tpaddingBottom: 0,\n\tbackgroundColor: 'transparent',\n});\n"],"names":["getChipRemoveStyle","fontSize","fontFamily","cursor","fontWeight","color","COLORS","content","secondary","marginLeft","background","border","padding","display","alignItems","getChipStyle","surface","subdued","stroke","primary","borderRadius","justifyContent","margin","marginBottom","marginTop","height","getContainerHoverStyle","brand","getContainerStyle","error","chipsContainerCustomStyle","focused","position","negative","vibrant","backgroundColor","standard","flexWrap","minHeight","outline","boxSizing","flex","minWidth","paddingTop","paddingBottom"],"mappings":"yIAsBkCA,KAA4B,CAC7DC,SAAU,GACVC,WAAY,QACZC,OAAQ,UACRC,WAAY,SACZC,MAAOC,EAAAA,OAAOC,QAAQC,UACtBC,WAAY,EACZC,WAAY,OACZC,OAAQ,OACRC,QAAS,EACTC,QAAS,cACTC,WAAY,gCA9BeC,KAA4B,CACvDH,QAAS,kBACTF,WAAYJ,EAAAA,OAAOU,QAAQC,QAC3BN,OAAqB,aAAAL,EAAMA,OAACY,OAAOC,UACnClB,SAAU,GACVI,MAAOC,EAAAA,OAAOC,QAAQC,UACtBJ,WAAY,IACZgB,aAAc,EACdP,QAAS,cACTC,WAAY,SACZO,eAAgB,SAChBlB,OAAQ,UACRmB,OAAQ,kBACRpB,WAAY,QACZqB,aAAc,MACdC,UAAW,MACXC,OAAQ,oCA0C6BC,KAA4B,CACjEf,OAAqB,aAAAL,EAAMA,OAACY,OAAOS,oCA1BHC,CAChCC,EACAJ,EACAK,EACAC,mBAEAlB,QAAS,OACTmB,SAAU,WACVrB,OAAW,GAAAoB,EAAU,EAAI,aACxBA,EACGzB,EAAAA,OAAOY,OAAOS,MACdE,EACAvB,EAAAA,OAAOY,OAAOe,SAASC,QACvB5B,SAAOY,OAAOC,UAElBgB,gBAAiB7B,EAAAA,OAAOU,QAAQoB,SAChCtB,WAAY,SACZuB,SAAU,OACVzB,QAAS,kBACTQ,aAAc,EACdjB,OAAQ,OACRmC,UAAWb,GAAU,IAClBK,yBAO0BL,IAA0C,CACvEd,OAAQ,OACR4B,QAAS,OACTC,UAAW,aACXvC,SAAU,GACVC,WAAY,QACZE,WAAY,IACZqB,OAAQA,GAAU,GAClBgB,KAAM,EACNC,SAAU,IACVC,WAAY,EACZC,cAAe,EACfT,gBAAiB"}

package/dist/cjs/components/input/Input-helper.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("phone");const t=/<(script|style|iframe|object|noscript|template)\b[^<]*(?:(?!<\/\1>)<[^<]*)*<\/\1\s*>/gi,r=/<\/?(script|style|iframe|object|embed|link|meta|base|form|svg|math|noscript|template)\b[^>]*>/gi,n=/(<[a-zA-Z][^>]*?)\s+on[a-zA-Z]+\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+)/g,i=["text","multiline","email","url","password"];exports.isFunction=e=>e&&"function"==typeof e,exports.sanitizeUnsafeInput=e=>{if(!e)return e;let i,a=e.replace(t,"");a=a.replace(r,"");do{i=a,a=a.replace(n,"$1")}while(a!==i);return a},exports.shouldSanitizeForType=e=>i.includes(e),exports.validateInput=(t,r,n={})=>{let i;const a=["phonenumber","zip","number"].includes(r),l=a?t?Number(t):null:t;if(null==l||""===l)return[!0,""];if(a&&String(l).length&&(n.min&&l<n.min||n.max&&l>n.max))return[!1,`Enter valid number between ${n.min} and ${n.max}`];if("email"===r)return i=/(.+)@(.+){2,}\.(.+){2,}/,l.match(i)?[!0,""]:[!1,"Enter a valid email id"];if("url"===r)return i=/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/,l.match(i)?[!0,""]:[!1,"Enter a valid url"];if("number"===r)return l>=0?[!0,""]:[!1,"Enter a valid number"];if("zip"===r)return 6===String(l).trim().length?[!0,""]:[!1,"Enter a valid zip code"];if("phonenumber"===r){const{isValid:t}=e.phone("+"+String(l));return t?[!0,""]:[!1,"Enter a valid phonenumber"]}return(null==l?void 0:l.trim().length)>0?[!0,""]:[!1,"Enter a valid data"]};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("phone");const t=/<(script|style|iframe|object|noscript|template)\b[^<]*(?:(?!<\/\1>)<[^<]*)*<\/\1\s*>/gi,n=/<\/?(script|style|iframe|object|embed|link|meta|base|form|svg|math|noscript|template)\b[^>]*>/gi,r=/(<[a-zA-Z][^>]*?)\s+on[a-zA-Z]+\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+)/g,i=["text","multiline","email","url","password"];exports.isFunction=e=>e&&"function"==typeof e,exports.sanitizeUnsafeInput=e=>{if(!e)return e;let i,a=e.replace(t,"");a=a.replace(n,"");do{i=a,a=a.replace(r,"$1")}while(a!==i);return a},exports.shouldSanitizeForType=e=>i.includes(e),exports.validateInput=function(t,n){let r,i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};const a=["phonenumber","zip","number"].includes(n),l=a?t?Number(t):null:t;if(null==l||""===l)return[!0,""];if(a&&String(l).length&&(i.min&&l<i.min||i.max&&l>i.max))return[!1,`Enter valid number between ${i.min} and ${i.max}`];if("email"===n)return r=/(.+)@(.+){2,}\.(.+){2,}/,l.match(r)?[!0,""]:[!1,"Enter a valid email id"];if("url"===n)return r=/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/,l.match(r)?[!0,""]:[!1,"Enter a valid url"];if("number"===n)return l>=0?[!0,""]:[!1,"Enter a valid number"];if("zip"===n)return 6===String(l).trim().length?[!0,""]:[!1,"Enter a valid zip code"];if("phonenumber"===n){const{isValid:t}=e.phone("+"+String(l));return t?[!0,""]:[!1,"Enter a valid phonenumber"]}return(null==l?void 0:l.trim().length)>0?[!0,""]:[!1,"Enter a valid data"]};
 //# sourceMappingURL=Input-helper.js.map

package/dist/cjs/components/input/Input-helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input-helper.js","sources":["../../../../src/components/input/Input-helper.ts"],"sourcesContent":["import { phone } from 'phone';\nimport { InputTypeI } from './Input.model';\n\nexport const isFunction = (fn): boolean => {\n\treturn fn && typeof fn === 'function';\n};\n\nconst PAIRED_DANGEROUS_TAGS =\n\t/<(script|style|iframe|object|noscript|template)\\b[^<]*(?:(?!<\\/\\1>)<[^<]*)*<\\/\\1\\s*>/gi;\nconst UNPAIRED_DANGEROUS_TAGS =\n\t/<\\/?(script|style|iframe|object|embed|link|meta|base|form|svg|math|noscript|template)\\b[^>]*>/gi;\nconst INLINE_EVENT_HANDLERS =\n\t/(<[a-zA-Z][^>]*?)\\s+on[a-zA-Z]+\\s*=\\s*(?:\"[^\"]*\"|'[^']*'|[^\\s>]+)/g;\n\nexport const sanitizeUnsafeInput = (input: string): string => {\n\tif (!input) {\n\t\treturn input;\n\t}\n\tlet cleaned = input.replace(PAIRED_DANGEROUS_TAGS, '');\n\tcleaned = cleaned.replace(UNPAIRED_DANGEROUS_TAGS, '');\n\tlet prev: string;\n\tdo {\n\t\tprev = cleaned;\n\t\tcleaned = cleaned.replace(INLINE_EVENT_HANDLERS, '$1');\n\t} while (cleaned !== prev);\n\treturn cleaned;\n};\n\nconst SANITIZED_INPUT_TYPES: InputTypeI[] = [\n\t'text',\n\t'multiline',\n\t'email',\n\t'url',\n\t'password',\n];\n\nexport const shouldSanitizeForType = (type: InputTypeI): boolean =>\n\tSANITIZED_INPUT_TYPES.includes(type);\n\nexport const validateInput = (\n\tinputText: string | number,\n\ttype: InputTypeI,\n\trangeValidation: { min?: number; max?: number } = {},\n): [boolean, string] => {\n\tlet regex;\n\n\tconst NUMBER_TYPE = ['phonenumber', 'zip', 'number'].includes(type);\n\n\tconst input = NUMBER_TYPE\n\t\t? inputText\n\t\t\t? Number(inputText)\n\t\t\t: null\n\t\t: inputText;\n\n\tif (input === null || input === undefined || input === '') {\n\t\treturn [true, ''];\n\t}\n\n\tif (\n\t\tNUMBER_TYPE &&\n\t\t!!String(input).length &&\n\t\t((!!rangeValidation.min &&\n\t\t\t(input as unknown as number) < rangeValidation.min) ||\n\t\t\t(!!rangeValidation.max &&\n\t\t\t\t(input as unknown as number) > rangeValidation.max))\n\t) {\n\t\treturn [\n\t\t\tfalse,\n\t\t\t`Enter valid number between ${rangeValidation.min} and ${rangeValidation.max}`,\n\t\t];\n\t}\n\n\tif (type === 'email') {\n\t\tregex = /(.+)@(.+){2,}\\.(.+){2,}/;\n\t\treturn (input as string).match(regex)\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid email id'];\n\t} else if (type === 'url') {\n\t\tregex =\n\t\t\t/^https?:\\/\\/(?:www\\.)?[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b(?:[-a-zA-Z0-9()@:%_\\+.~#?&\\/=]*)$/;\n\t\treturn (input as string).match(regex)\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid url'];\n\t} else if (type === 'number') {\n\t\treturn input >= 0 ? [true, ''] : [false, 'Enter a valid number'];\n\t} else if (type === 'zip') {\n\t\treturn String(input).trim().length === 6\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid zip code'];\n\t} else if (type === 'phonenumber') {\n\t\tconst { isValid } = phone('+' + String(input));\n\t\treturn isValid ? [true, ''] : [false, 'Enter a valid phonenumber'];\n\t} else {\n\t\treturn (input as string)?.trim().length > 0\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid data'];\n\t}\n\treturn [false, 'Enter a valid data'];\n};\n"],"names":["isFunction","PAIRED_DANGEROUS_TAGS","UNPAIRED_DANGEROUS_TAGS","INLINE_EVENT_HANDLERS","SANITIZED_INPUT_TYPES","fn","input","prev","cleaned","replace","type","includes","validateInput","inputText","rangeValidation","regex","NUMBER_TYPE","Number","String","length","min","max","match","trim","isValid","phone"],"mappings":"2FAGaA,MAIPC,EACL,yFACKC,EACL,kGACKC,EACL,qEAgBKC,EAAsC,CAC3C,OACA,YACA,QACA,MACA,+BA9B0BC,GACnBA,GAAoB,mBAAPA,8BAUeC,IACnC,IAAKA,EACJ,OAAOA,EAER,IAEIC,EAFAC,EAAUF,EAAMG,QAAQR,EAAuB,IACnDO,EAAUA,EAAQC,QAAQP,EAAyB,IAEnD,GACCK,EAAOC,EACPA,EAAUA,EAAQC,QAAQN,EAAuB,YACzCK,IAAYD,GACrB,OAAOC,CAAO,gCAWuBE,GACrCN,EAAsBO,SAASD,yBAEHE,CAC5BC,EACAH,EACAI,EAAkD,CAAA,KAElD,IAAIC,EAEJ,MAAMC,EAAc,CAAC,cAAe,MAAO,UAAUL,SAASD,GAExDJ,EAAQU,EACXH,EACCI,OAAOJ,GACP,KACDA,EAEH,GAAIP,SAAmD,KAAVA,EAC5C,MAAO,EAAC,EAAM,IAGf,GACCU,GACEE,OAAOZ,GAAOa,SACZL,EAAgBM,KAClBd,EAA8BQ,EAAgBM,KAC5CN,EAAgBO,KACjBf,EAA8BQ,EAAgBO,KAEjD,MAAO,EACN,EACA,8BAA8BP,EAAgBM,WAAWN,EAAgBO,OAI3E,GAAa,UAATX,EAEH,OADAK,EAAQ,0BACAT,EAAiBgB,MAAMP,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,QAATL,EAGV,OAFAK,EACC,8GACOT,EAAiBgB,MAAMP,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,qBACL,GAAa,WAATL,EACV,OAAOJ,GAAS,EAAI,EAAC,EAAM,IAAM,EAAC,EAAO,wBACnC,GAAa,QAATI,EACV,OAAuC,IAAhCQ,OAAOZ,GAAOiB,OAAOJ,OACzB,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,gBAATT,EAAwB,CAClC,MAAMc,QAAEA,GAAYC,EAAKA,MAAC,IAAMP,OAAOZ,IACvC,OAAOkB,EAAU,EAAC,EAAM,IAAM,EAAC,EAAO,4BACtC,CACA,OAAQlB,aAAK,EAALA,EAAkBiB,OAAOJ,QAAS,EACvC,EAAC,EAAM,IACP,EAAC,EAAO,qBACX"}
+{"version":3,"file":"Input-helper.js","sources":["../../../../src/components/input/Input-helper.ts"],"sourcesContent":["import { phone } from 'phone';\nimport { InputTypeI } from './Input.model';\n\nexport const isFunction = (fn): boolean => {\n\treturn fn && typeof fn === 'function';\n};\n\nconst PAIRED_DANGEROUS_TAGS =\n\t/<(script|style|iframe|object|noscript|template)\\b[^<]*(?:(?!<\\/\\1>)<[^<]*)*<\\/\\1\\s*>/gi;\nconst UNPAIRED_DANGEROUS_TAGS =\n\t/<\\/?(script|style|iframe|object|embed|link|meta|base|form|svg|math|noscript|template)\\b[^>]*>/gi;\nconst INLINE_EVENT_HANDLERS =\n\t/(<[a-zA-Z][^>]*?)\\s+on[a-zA-Z]+\\s*=\\s*(?:\"[^\"]*\"|'[^']*'|[^\\s>]+)/g;\n\nexport const sanitizeUnsafeInput = (input: string): string => {\n\tif (!input) {\n\t\treturn input;\n\t}\n\tlet cleaned = input.replace(PAIRED_DANGEROUS_TAGS, '');\n\tcleaned = cleaned.replace(UNPAIRED_DANGEROUS_TAGS, '');\n\tlet prev: string;\n\tdo {\n\t\tprev = cleaned;\n\t\tcleaned = cleaned.replace(INLINE_EVENT_HANDLERS, '$1');\n\t} while (cleaned !== prev);\n\treturn cleaned;\n};\n\nconst SANITIZED_INPUT_TYPES: InputTypeI[] = [\n\t'text',\n\t'multiline',\n\t'email',\n\t'url',\n\t'password',\n];\n\nexport const shouldSanitizeForType = (type: InputTypeI): boolean =>\n\tSANITIZED_INPUT_TYPES.includes(type);\n\nexport const validateInput = (\n\tinputText: string | number,\n\ttype: InputTypeI,\n\trangeValidation: { min?: number; max?: number } = {},\n): [boolean, string] => {\n\tlet regex;\n\n\tconst NUMBER_TYPE = ['phonenumber', 'zip', 'number'].includes(type);\n\n\tconst input = NUMBER_TYPE\n\t\t? inputText\n\t\t\t? Number(inputText)\n\t\t\t: null\n\t\t: inputText;\n\n\tif (input === null || input === undefined || input === '') {\n\t\treturn [true, ''];\n\t}\n\n\tif (\n\t\tNUMBER_TYPE &&\n\t\t!!String(input).length &&\n\t\t((!!rangeValidation.min &&\n\t\t\t(input as unknown as number) < rangeValidation.min) ||\n\t\t\t(!!rangeValidation.max &&\n\t\t\t\t(input as unknown as number) > rangeValidation.max))\n\t) {\n\t\treturn [\n\t\t\tfalse,\n\t\t\t`Enter valid number between ${rangeValidation.min} and ${rangeValidation.max}`,\n\t\t];\n\t}\n\n\tif (type === 'email') {\n\t\tregex = /(.+)@(.+){2,}\\.(.+){2,}/;\n\t\treturn (input as string).match(regex)\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid email id'];\n\t} else if (type === 'url') {\n\t\tregex =\n\t\t\t/^https?:\\/\\/(?:www\\.)?[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b(?:[-a-zA-Z0-9()@:%_\\+.~#?&\\/=]*)$/;\n\t\treturn (input as string).match(regex)\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid url'];\n\t} else if (type === 'number') {\n\t\treturn input >= 0 ? [true, ''] : [false, 'Enter a valid number'];\n\t} else if (type === 'zip') {\n\t\treturn String(input).trim().length === 6\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid zip code'];\n\t} else if (type === 'phonenumber') {\n\t\tconst { isValid } = phone('+' + String(input));\n\t\treturn isValid ? [true, ''] : [false, 'Enter a valid phonenumber'];\n\t} else {\n\t\treturn (input as string)?.trim().length > 0\n\t\t\t? [true, '']\n\t\t\t: [false, 'Enter a valid data'];\n\t}\n\treturn [false, 'Enter a valid data'];\n};\n"],"names":["isFunction","PAIRED_DANGEROUS_TAGS","UNPAIRED_DANGEROUS_TAGS","INLINE_EVENT_HANDLERS","SANITIZED_INPUT_TYPES","fn","input","prev","cleaned","replace","type","includes","inputText","regex","rangeValidation","arguments","length","undefined","NUMBER_TYPE","Number","String","min","max","match","trim","isValid","phone"],"mappings":"2FAGaA,MAIPC,EACL,yFACKC,EACL,kGACKC,EACL,qEAgBKC,EAAsC,CAC3C,OACA,YACA,QACA,MACA,+BA9B0BC,GACnBA,GAAoB,mBAAPA,8BAUeC,IACnC,IAAKA,EACJ,OAAOA,EAER,IAEIC,EAFAC,EAAUF,EAAMG,QAAQR,EAAuB,IACnDO,EAAUA,EAAQC,QAAQP,EAAyB,IAEnD,GACCK,EAAOC,EACPA,EAAUA,EAAQC,QAAQN,EAAuB,YACzCK,IAAYD,GACrB,OAAOC,CAAO,gCAWuBE,GACrCN,EAAsBO,SAASD,yBAEH,SAC5BE,EACAF,GAEsB,IAClBG,EAFJC,EAAAC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAkD,CAAA,EAIlD,MAAMG,EAAc,CAAC,cAAe,MAAO,UAAUP,SAASD,GAExDJ,EAAQY,EACXN,EACCO,OAAOP,GACP,KACDA,EAEH,GAAIN,SAAmD,KAAVA,EAC5C,MAAO,EAAC,EAAM,IAGf,GACCY,GACEE,OAAOd,GAAOU,SACZF,EAAgBO,KAClBf,EAA8BQ,EAAgBO,KAC5CP,EAAgBQ,KACjBhB,EAA8BQ,EAAgBQ,KAEjD,MAAO,EACN,EACA,8BAA8BR,EAAgBO,WAAWP,EAAgBQ,OAI3E,GAAa,UAATZ,EAEH,OADAG,EAAQ,0BACAP,EAAiBiB,MAAMV,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,QAATH,EAGV,OAFAG,EACC,8GACOP,EAAiBiB,MAAMV,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,qBACL,GAAa,WAATH,EACV,OAAOJ,GAAS,EAAI,EAAC,EAAM,IAAM,EAAC,EAAO,wBACnC,GAAa,QAATI,EACV,OAAuC,IAAhCU,OAAOd,GAAOkB,OAAOR,OACzB,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,gBAATN,EAAwB,CAClC,MAAMe,QAAEA,GAAYC,EAAKA,MAAC,IAAMN,OAAOd,IACvC,OAAOmB,EAAU,EAAC,EAAM,IAAM,EAAC,EAAO,4BACtC,CACA,OAAQnB,aAAK,EAALA,EAAkBkB,OAAOR,QAAS,EACvC,EAAC,EAAM,IACP,EAAC,EAAO,qBAGb"}

package/dist/cjs/components/input/Input.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),l=require("./Input-helper.js"),s=require("../tooltips/Tooltip.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),o=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const d=n.forwardRef(((d,h)=>{var p,v,g,x,j,f,m,b;const{placeholder:y,leftIcon:C,rightIcon:T,labelText:O,maxCharLimit:I,isRequired:S,hintText:w,type:E,state:k,validate:H,variant:q,button:B,suffixText:L,prefixText:F,onChangeText:M,value:P,noErrorHint:R,reset:z,rangeValidation:A,noKeyDownChange:D,version:K,noMaxCharCheck:N,labelElement:_,autoGrow:W,minHeight:G,maxHeight:U,labelTextBold:V,truncateText:$,maxCharLimitPosition:J,hightlightInputColor:Q,onKeyDownEvent:X,hideInputHeader:Y,hideBorder:Z,inputWrapperStyles:ee,minCharsToTrigger:te,maxCharAlignment:ne,isDisabled:ie=!1,allowUnsafeInput:le}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0,maxCharAlignment:!1},d),se=null==C?void 0:C.icon,re=null==T?void 0:T.icon,[ae,oe]=n.useState(!1),[ue,ce]=n.useState(!1),[de,he]=n.useState(),pe="x-small"===q?"12px":"small"===q?"18px":"22px",ve=n.useContext(u.InputStyleContext),[ge,xe]=n.useState(""),je=n.useRef(null),fe=null!=h?h:je;n.useEffect((()=>{xe(P||""),!P&&W&&(fe.current.style.height=G||"48px")}),[P]),n.useEffect((()=>{var e;fe.current&&(null===(e=d.onReferenceInit)||void 0===e||e.call(d,fe.current))}),[fe]),n.useEffect((()=>{const e=fe.current;if(e&&["phonenumber","zip","number"].includes(E))return e.addEventListener("wheel",Ce,{passive:!1}),()=>{e.removeEventListener("wheel",Ce)}}),[]),n.useEffect((()=>{z&&xe("")}),[z]),n.useEffect((()=>{var e;ce(!!d.isActive),d.isActive&&(null===(e=fe.current)||void 0===e||e.focus())}),[d.isActive]),n.useEffect((()=>{he(d.errorMessage)}),[d.errorMessage]),n.useEffect((()=>{var e;oe(!1),("invalid"===d.state||de||"disabled-invalid"===d.state)&&oe(!0),"active"===d.state&&(null===(e=fe.current)||void 0===e||e.focus())}),[d.state,de]),n.useEffect((()=>{oe(!!de||"invalid"===d.state)}),[de,d.state]);const me=(e,...t)=>{l.isFunction(e)&&e(...t)},be=()=>"zip"===E?6:2e3,ye=e=>{const t=0!==I?I:be(),n=te,i=e.target.value;X&&(!i.length||i.length>=n)&&X(e),D||i.length&&!(i.length>=n)||M(P||"",e),N||![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},Ce=e=>{e.preventDefault()},Te=e=>{let t=e.target.value;const n=0!==I?I+1:be(),i=te;if(!le&&l.shouldSanitizeForType(E)&&(t=l.sanitizeUnsafeInput(t)),!N&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),d.textControl||xe(t||""),i&&t&&t.length<i)return;M(t,e),W&&(fe.current.style.height=`${fe.current.scrollHeight}px`,t||(fe.current.style.height=G||"48px"));const s=H||l.validateInput;if(!s||!l.isFunction(s))return;const[r,a]=s(t,E,A);oe(!r),he(d.errorMessage?d.errorMessage:a)},Oe=e=>{var t;d.skipFocus||ce(!0),me(null===(t=d.onFocus)||void 0===t?void 0:t.call(d,e))},Ie=e=>{var t;d.skipFocus||ce(!1),me(null===(t=d.onBlur)||void 0===t?void 0:t.call(d,e))},Se=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==E&&e.jsx("input",{className:$?"truncate-class":"","data-test":d["data-test"],id:d.id,style:null!==(t=null==ve?void 0:ve.input)&&void 0!==t?t:{},ref:fe,disabled:ie,type:["phonenumber","zip","number"].includes(E)?"number":E,value:ge,onFocus:e=>Oe(e),onBlur:e=>Ie(e),placeholder:y||"Enter here",onChange:Te,onClick:e=>me(d.onClick),onKeyDown:e=>ye(e)}),"multiline"===E&&e.jsx("textarea",{"data-test":d["data-test"],value:ge,ref:fe,onFocus:e=>Oe(e),onBlur:e=>Ie(e),onClick:e=>me(d.onClick),disabled:ie,placeholder:y||"Enter here",onChange:Te,onKeyDown:e=>ye(e),maxLength:I>0?I:void 0})]})};return e.jsxs(c.RootContainer,Object.assign({width:d.width,height:d.height,state:k,type:E,style:null!==(p=null==ve?void 0:ve.RootContainer)&&void 0!==p?p:{}},{children:[e.jsxs("div",Object.assign({className:"flex-align-center"},{children:[!R&&(!!w||!!de)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!de},{children:[!!de&&e.jsx(o.default,{width:16,height:16}),de||w]})),I>0&&"BOTTOM"===J&&e.jsxs(c.MaxCharStyle,Object.assign({position:"BOTTOM"},{children:[null!==(g=null===(v=(null!=P?P:"").toString())||void 0===v?void 0:v.length)&&void 0!==g?g:0,"/",I]}))]})),e.jsxs(c.InputWrapper,Object.assign({variant:q,state:k,width:d.width,isActive:"active"===k||ue,isInvalid:ae,style:null!==(j=null!==(x=null==ve?void 0:ve.InputWrapper)&&void 0!==x?x:ee)&&void 0!==j?j:{},version:K,height:d.height,hightlightInputColor:Q,hideBorder:Z},{children:[!!se&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:pe,onClick:()=>me(null==C?void 0:C.callback),isLeft:!0,style:null!==(f=null==ve?void 0:ve.IconHolder)&&void 0!==f?f:{}},{children:e.jsx(se,{})})),!!F&&e.jsx(c.PrefixHolder,Object.assign({variant:q},{children:F})),"default"===q&&e.jsx(c.InputContainer,Object.assign({height:d.height,type:d.type,minHeight:G,maxHeight:U,autoGrow:W},{children:Se()})),["x-small","small"].includes(q)&&e.jsx(c.InputContainerSmall,Object.assign({height:d.height,type:d.type},{children:Se()})),!!re&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:pe,onClick:()=>me(null==T?void 0:T.callback),isLeft:!1},{children:e.jsx(re,{})})),!!L&&e.jsx(c.SuffixHolder,Object.assign({variant:q},{children:L})),B&&B.text&&e.jsx(i.Button,{buttonText:B.text,buttonType:B.buttonType,onClick:()=>me(null==B?void 0:B.onClick)}),B&&B.buttonProps&&e.jsx(i.Button,Object.assign({},B.buttonProps))]})),!Y&&(!!O||!!I)&&e.jsxs(c.InputHeader,Object.assign({invalid:ae,maxCharAlignment:ne},{children:[_&&_,e.jsxs("div",Object.assign({className:"label__container"},{children:[V?e.jsxs(r.TitleSmall,{children:[O,S?e.jsx("span",{children:"*"}):""]}):e.jsxs(r.BodySecondary,{children:[O,S?e.jsx("span",{children:"*"}):""]}),d.tooltipText&&e.jsx(s.Tooltip,Object.assign({body:d.tooltipText,placement:"top"},{children:e.jsx("span",{children:e.jsx(t.default,{style:{marginTop:-3},width:18,height:18,color:ae?a.COLORS.content.negative:a.COLORS.content.primary})})}))]})),I>0&&"TOP"===J&&e.jsxs(c.MaxCharStyle,{children:[null!==(b=null===(m=(null!=P?P:"").toString())||void 0===m?void 0:m.length)&&void 0!==b?b:0,"/",I]})]}))]}))}));d.displayName="Input",exports.Input=d;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),l=require("./Input-helper.js"),s=require("../tooltips/Tooltip.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),o=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const d=n.forwardRef(((d,h)=>{var p,v,g,x,j,f,m,b;const{placeholder:y,leftIcon:C,rightIcon:T,labelText:O,maxCharLimit:I,isRequired:S,hintText:w,type:E,state:k,validate:H,variant:q,button:B,suffixText:L,prefixText:F,onChangeText:M,value:P,noErrorHint:A,reset:R,rangeValidation:z,noKeyDownChange:D,version:K,noMaxCharCheck:N,labelElement:_,autoGrow:W,minHeight:G,maxHeight:U,labelTextBold:V,truncateText:$,maxCharLimitPosition:J,hightlightInputColor:Q,onKeyDownEvent:X,hideInputHeader:Y,hideBorder:Z,inputWrapperStyles:ee,minCharsToTrigger:te,maxCharAlignment:ne,isDisabled:ie=!1,allowUnsafeInput:le}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP",minCharsToTrigger:0,maxCharAlignment:!1},d),se=null==C?void 0:C.icon,re=null==T?void 0:T.icon,[ae,oe]=n.useState(!1),[ue,ce]=n.useState(!1),[de,he]=n.useState(),pe="x-small"===q?"12px":"small"===q?"18px":"22px",ve=n.useContext(u.InputStyleContext),[ge,xe]=n.useState(""),je=n.useRef(null),fe=null!=h?h:je;n.useEffect((()=>{xe(P||""),!P&&W&&(fe.current.style.height=G||"48px")}),[P]),n.useEffect((()=>{var e;fe.current&&(null===(e=d.onReferenceInit)||void 0===e||e.call(d,fe.current))}),[fe]),n.useEffect((()=>{const e=fe.current;if(e&&["phonenumber","zip","number"].includes(E))return e.addEventListener("wheel",Ce,{passive:!1}),()=>{e.removeEventListener("wheel",Ce)}}),[]),n.useEffect((()=>{R&&xe("")}),[R]),n.useEffect((()=>{var e;ce(!!d.isActive),d.isActive&&(null===(e=fe.current)||void 0===e||e.focus())}),[d.isActive]),n.useEffect((()=>{he(d.errorMessage)}),[d.errorMessage]),n.useEffect((()=>{var e;oe(!1),("invalid"===d.state||de||"disabled-invalid"===d.state)&&oe(!0),"active"===d.state&&(null===(e=fe.current)||void 0===e||e.focus())}),[d.state,de]),n.useEffect((()=>{oe(!!de||"invalid"===d.state)}),[de,d.state]);const me=function(e){if(l.isFunction(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},be=()=>"zip"===E?6:2e3,ye=e=>{const t=0!==I?I:be(),n=te,i=e.target.value;X&&(!i.length||i.length>=n)&&X(e),D||i.length&&!(i.length>=n)||M(P||"",e),N||![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},Ce=e=>{e.preventDefault()},Te=e=>{let t=e.target.value;const n=0!==I?I+1:be(),i=te;if(!le&&l.shouldSanitizeForType(E)&&(t=l.sanitizeUnsafeInput(t)),!N&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),d.textControl||xe(t||""),i&&t&&t.length<i)return;M(t,e),W&&(fe.current.style.height=`${fe.current.scrollHeight}px`,t||(fe.current.style.height=G||"48px"));const s=H||l.validateInput;if(!s||!l.isFunction(s))return;const[r,a]=s(t,E,z);oe(!r),he(d.errorMessage?d.errorMessage:a)},Oe=e=>{var t;d.skipFocus||ce(!0),me(null===(t=d.onFocus)||void 0===t?void 0:t.call(d,e))},Ie=e=>{var t;d.skipFocus||ce(!1),me(null===(t=d.onBlur)||void 0===t?void 0:t.call(d,e))},Se=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==E&&e.jsx("input",{className:$?"truncate-class":"","data-test":d["data-test"],id:d.id,style:null!==(t=null==ve?void 0:ve.input)&&void 0!==t?t:{},ref:fe,disabled:ie,type:["phonenumber","zip","number"].includes(E)?"number":E,value:ge,onFocus:e=>Oe(e),onBlur:e=>Ie(e),placeholder:y||"Enter here",onChange:Te,onClick:e=>me(d.onClick),onKeyDown:e=>ye(e)}),"multiline"===E&&e.jsx("textarea",{"data-test":d["data-test"],value:ge,ref:fe,onFocus:e=>Oe(e),onBlur:e=>Ie(e),onClick:e=>me(d.onClick),disabled:ie,placeholder:y||"Enter here",onChange:Te,onKeyDown:e=>ye(e),maxLength:I>0?I:void 0})]})};return e.jsxs(c.RootContainer,Object.assign({width:d.width,height:d.height,state:k,type:E,style:null!==(p=null==ve?void 0:ve.RootContainer)&&void 0!==p?p:{}},{children:[e.jsxs("div",Object.assign({className:"flex-align-center"},{children:[!A&&(!!w||!!de)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!de},{children:[!!de&&e.jsx(o.default,{width:16,height:16}),de||w]})),I>0&&"BOTTOM"===J&&e.jsxs(c.MaxCharStyle,Object.assign({position:"BOTTOM"},{children:[null!==(g=null===(v=(null!=P?P:"").toString())||void 0===v?void 0:v.length)&&void 0!==g?g:0,"/",I]}))]})),e.jsxs(c.InputWrapper,Object.assign({variant:q,state:k,width:d.width,isActive:"active"===k||ue,isInvalid:ae,style:null!==(j=null!==(x=null==ve?void 0:ve.InputWrapper)&&void 0!==x?x:ee)&&void 0!==j?j:{},version:K,height:d.height,hightlightInputColor:Q,hideBorder:Z},{children:[!!se&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:pe,onClick:()=>me(null==C?void 0:C.callback),isLeft:!0,style:null!==(f=null==ve?void 0:ve.IconHolder)&&void 0!==f?f:{}},{children:e.jsx(se,{})})),!!F&&e.jsx(c.PrefixHolder,Object.assign({variant:q},{children:F})),"default"===q&&e.jsx(c.InputContainer,Object.assign({height:d.height,type:d.type,minHeight:G,maxHeight:U,autoGrow:W},{children:Se()})),["x-small","small"].includes(q)&&e.jsx(c.InputContainerSmall,Object.assign({height:d.height,type:d.type},{children:Se()})),!!re&&e.jsx(c.IconHolder,Object.assign({variant:q,iconSize:pe,onClick:()=>me(null==T?void 0:T.callback),isLeft:!1},{children:e.jsx(re,{})})),!!L&&e.jsx(c.SuffixHolder,Object.assign({variant:q},{children:L})),B&&B.text&&e.jsx(i.Button,{buttonText:B.text,buttonType:B.buttonType,onClick:()=>me(null==B?void 0:B.onClick)}),B&&B.buttonProps&&e.jsx(i.Button,Object.assign({},B.buttonProps))]})),!Y&&(!!O||!!I)&&e.jsxs(c.InputHeader,Object.assign({invalid:ae,maxCharAlignment:ne},{children:[_&&_,e.jsxs("div",Object.assign({className:"label__container"},{children:[V?e.jsxs(r.TitleSmall,{children:[O,S?e.jsx("span",{children:"*"}):""]}):e.jsxs(r.BodySecondary,{children:[O,S?e.jsx("span",{children:"*"}):""]}),d.tooltipText&&e.jsx(s.Tooltip,Object.assign({body:d.tooltipText,placement:"top"},{children:e.jsx("span",{children:e.jsx(t.default,{style:{marginTop:-3},width:18,height:18,color:ae?a.COLORS.content.negative:a.COLORS.content.primary})})}))]})),I>0&&"TOP"===J&&e.jsxs(c.MaxCharStyle,{children:[null!==(b=null===(m=(null!=P?P:"").toString())||void 0===m?void 0:m.length)&&void 0!==b?b:0,"/",I]})]}))]}))}));d.displayName="Input",exports.Input=d;
 //# sourceMappingURL=Input.js.map

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

@@ -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\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} = {\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'}>\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={stylesFromOutside?.IconHolder ?? {}}\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{['x-small', 'small'].includes(variant) && (\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{!!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>\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","hightlightInputColor","onKeyDownEvent","hideInputHeader","hideBorder","inputWrapperStyles","minCharsToTrigger","maxCharAlignment","isDisabled","allowUnsafeInput","Object","assign","LeftIcon","icon","RightIcon","isInvalid","setIsInvalid","useState","isActive","setIsActive","errorMessage","setErrorMessage","iconSize","stylesFromOutside","useContext","InputStyleContext","inputValue","setInputValue","_ref","useRef","inputRef","useEffect","current","style","height","_a","onReferenceInit","call","numberInput","includes","addEventListener","onWheel","passive","removeEventListener","focus","executeCallback","cb","params","isFunction","getMaxChar","onKeyDown","e","MAX_CHAR_LIMIT","MIN_CHAR_LIMIT","inputText","target","length","which","preventDefault","event","onChange","shouldSanitizeForType","sanitizeUnsafeInput","substring","textControl","scrollHeight","validateFunction","validateInput","isValid","error","onFocus","skipFocus","onBlur","getInputHTML","_jsxs","_Fragment","children","_jsx","className","id","input","ref","disabled","onClick","maxLength","undefined","SC","width","RootContainer","jsxs","invalid","ErrorIcon","position","_c","_b","toString","_e","InputWrapper","_d","IconHolder","callback","isLeft","_f","jsx","PrefixHolder","InputContainer","SuffixHolder","text","Button","buttonText","buttonType","buttonProps","TitleSmall","BodySecondary","tooltipText","Tooltip","body","placement","InfoIcon","marginTop","color","COLORS","content","negative","primary","_g","_h","displayName"],"mappings":"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"}
+{"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\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} = {\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'}>\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={stylesFromOutside?.IconHolder ?? {}}\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{['x-small', 'small'].includes(variant) && (\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{!!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>\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","hightlightInputColor","onKeyDownEvent","hideInputHeader","hideBorder","inputWrapperStyles","minCharsToTrigger","maxCharAlignment","isDisabled","allowUnsafeInput","Object","assign","LeftIcon","icon","RightIcon","isInvalid","setIsInvalid","useState","isActive","setIsActive","errorMessage","setErrorMessage","iconSize","stylesFromOutside","useContext","InputStyleContext","inputValue","setInputValue","_ref","useRef","inputRef","useEffect","current","style","height","_a","onReferenceInit","call","numberInput","includes","addEventListener","onWheel","passive","removeEventListener","focus","executeCallback","cb","isFunction","_len","arguments","length","params","Array","_key","getMaxChar","onKeyDown","e","MAX_CHAR_LIMIT","MIN_CHAR_LIMIT","inputText","target","which","preventDefault","event","onChange","shouldSanitizeForType","sanitizeUnsafeInput","substring","textControl","scrollHeight","validateFunction","validateInput","isValid","error","onFocus","skipFocus","onBlur","getInputHTML","_jsxs","_Fragment","children","_jsx","className","id","input","ref","disabled","onClick","maxLength","undefined","SC","width","RootContainer","jsxs","invalid","ErrorIcon","position","_c","_b","toString","_e","InputWrapper","_d","IconHolder","callback","isLeft","_f","jsx","PrefixHolder","InputContainer","SuffixHolder","text","Button","buttonText","buttonType","buttonProps","TitleSmall","BodySecondary","tooltipText","Tooltip","body","placement","InfoIcon","marginTop","color","COLORS","content","negative","primary","_g","_h","displayName"],"mappings":"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"}