npm - @bikdotai/bik-component-library - Versions diffs - 0.0.808-beta.0 → 0.0.808 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1557) hide show

package/dist/esm/components/floating-input-dropdown/FloatingInputDropdown.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import{jsxs as e,Fragment as o,jsx as n}from"react/jsx-runtime";import{useRef as t,useState as i,useEffect as r}from"react";import{usePopper as l}from"react-popper";import s from"styled-components";import{DropShadow as p}from"../dropShadow/DropShadow.js";import{OpenDropdownContainer as c}from"../dropdown/Common.styled.js";import{OpenedDropdown as d}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{Floater as a}from"../floater/floater.js";import{Input as m}from"../input/Input.js";const u=s(c)`
-	opacity: ${({visible:e})=>e?1:0};
-	visibility: ${({visible:e})=>e?"visible":"hidden"};
+	opacity: ${e=>{let{visible:o}=e;return o?1:0}};
+	visibility: ${e=>{let{visible:o}=e;return o?"visible":"hidden"}};
 	transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
-`,f=({inputProps:s,dropdownProps:c,floaterProps:f,children:v,isVisible:b,onDropdownOptionClick:g,onChangeText:h})=>{const j=t(null),O=t(null),[w,y]=i(!1),[C,S]=i(null),[D,x]=i(null),[k,z]=i(!1),{styles:P,attributes:R,update:T,forceUpdate:I}=l(D,C,{placement:c.placement,strategy:c.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"]}}]});r((()=>{if(!w){const e=setTimeout((()=>z(!1)),200);return()=>clearTimeout(e)}z(!0),T&&T()}),[w,T]),r((()=>{if(j.current){const e=new ResizeObserver((()=>{T&&T()}));return e.observe(j.current),()=>{e.disconnect()}}}),[j.current,T]);return e(o,{children:[b&&e(a,Object.assign({},f,{refElement:O},{children:[n("div",Object.assign({style:{position:"relative"},ref:x},{children:n(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:n(m,Object.assign({},s,{onClick:()=>{var e;null===(e=c.onDropdownOpen)||void 0===e||e.call(c),w?y(!1):c.disabled||y(!0),null==I||I()},ref:j,onChangeText:(e,o)=>{null==h||h(e,o),T&&T()}}))}))})),n(u,Object.assign({ref:S,style:Object.assign(Object.assign({},P.popper),{zIndex:3})},R.popper,{visible:w||k},{children:n(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:n(d,Object.assign({},c,{onSelect:e=>{var o;"2.0"===c.version&&c.isMultiSelect||(null===(o=c.onSelect)||void 0===o||o.call(c,e),y(!1))},onClose:e=>{var o,n;"2.0"===c.version&&c.isMultiSelect&&e&&(null===(o=c.onSelect)||void 0===o||o.call(c,[...e])),y(!1),null===(n=null==c?void 0:c.onClose)||void 0===n||n.call(c)},version:c.version,headerRef:j,onDropdownItemClick:e=>{null==g||g(e)}}))}))}))]})),n("div",Object.assign({ref:O},{children:v&&n("div",{children:v})}))]})};export{f as FloatingInputDropdown};
+`,f=s=>{let{inputProps:c,dropdownProps:f,floaterProps:v,children:b,isVisible:g,onDropdownOptionClick:h,onChangeText:j}=s;const O=t(null),w=t(null),[y,C]=i(!1),[S,D]=i(null),[x,k]=i(null),[z,P]=i(!1),{styles:R,attributes:T,update:I,forceUpdate:M}=l(x,S,{placement:f.placement,strategy:f.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"]}}]});r((()=>{if(!y){const e=setTimeout((()=>P(!1)),200);return()=>clearTimeout(e)}P(!0),I&&I()}),[y,I]),r((()=>{if(O.current){const e=new ResizeObserver((()=>{I&&I()}));return e.observe(O.current),()=>{e.disconnect()}}}),[O.current,I]);return e(o,{children:[g&&e(a,Object.assign({},v,{refElement:w},{children:[n("div",Object.assign({style:{position:"relative"},ref:k},{children:n(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:n(m,Object.assign({},c,{onClick:()=>{var e;null===(e=f.onDropdownOpen)||void 0===e||e.call(f),y?C(!1):f.disabled||C(!0),null==M||M()},ref:O,onChangeText:(e,o)=>{null==j||j(e,o),I&&I()}}))}))})),n(u,Object.assign({ref:D,style:Object.assign(Object.assign({},R.popper),{zIndex:3})},T.popper,{visible:y||z},{children:n(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:n(d,Object.assign({},f,{onSelect:e=>{var o;"2.0"===f.version&&f.isMultiSelect||(null===(o=f.onSelect)||void 0===o||o.call(f,e),C(!1))},onClose:e=>{var o,n;"2.0"===f.version&&f.isMultiSelect&&e&&(null===(o=f.onSelect)||void 0===o||o.call(f,[...e])),C(!1),null===(n=null==f?void 0:f.onClose)||void 0===n||n.call(f)},version:f.version,headerRef:O,onDropdownItemClick:e=>{null==h||h(e)}}))}))}))]})),n("div",Object.assign({ref:w},{children:b&&n("div",{children:b})}))]})};export{f as FloatingInputDropdown};
 //# sourceMappingURL=FloatingInputDropdown.js.map

package/dist/esm/components/floating-input-dropdown/FloatingInputDropdown.js.map CHANGED Viewed

	@@ -1 +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","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":"wfAkCA,MAAMA,EAA4BC,EAAOC,EAEvC;~~YACU~~,~~EAAGC~~,~~aAAeA~~,EAAU,EAAI;~~eAC7B~~,~~EAAGA~~,~~aAAeA~~,EAAU,UAAY;;~~EAI1CC~~,~~EAA8DA~~,~~EAC1EC~~,~~aACAC~~,~~gBACAC~~,~~eACAC~~,~~WACAC~~,~~YACAC~~,~~wBACAC~~,~~mBAEA~~,~~MAAMC~~,EAAYC,EAAO,MACnBC,EAAWD,EAAO,OACjBE,EAAcC,GAAyBC,GAAS,IAChDC,EAAeC,GAAoBF,EACzC,OAEMG,EAAkBC,GACxBJ,EAAgC,OAC1BK,EAAiBC,GAAsBN,GAAS,IAEjDO,OAAEA,EAAMC,WAAEA,EAAUC,OAAEA,EAAMC,YAAEA,GAAgBC,EACnDR,EACAF,EACA,CACCW,UAAWvB,EAAcuB,UACzBC,SAAUxB,EAAcwB,SACxBC,UAAW,CACV,CACCC,KAAM,SACNC,QAAS,CACRC,OAAQ,CAAC,EAAG,KAGd,CACCF,KAAM,kBACNC,QAAS,CACRE,QAAS,CAAEC,IAAK,EAAGC,OAAQ,GAAIC,KAAM,EAAGC,MAAO,KAGjD,CACCP,KAAM,OACNC,QAAS,CACRO,mBAAoB,CAAC,SAAU,YAOpCC,GAAU,KACT,IAAI1B,EAGG,CACN,MAAM2B,EAAQC,YAAW,IAAMpB,GAAmB,IAAQ,KAC1D,MAAO,IAAMqB,aAAaF,EAC1B,CALAnB,GAAmB,GACfG,GAAQA,GAIZ,GACC,CAACX,EAAcW,IAElBe,GAAU,KACT,GAAI7B,EAAUiC,QAAS,CACtB,MAAMC,EAAiB,IAAIC,gBAAe,KACrCrB,GAAQA,GAAQ,IAIrB,OAFAoB,EAAeE,QAAQpC,EAAUiC,SAE1B,KACNC,EAAeG,YAAY,CAE5B,IACC,CAACrC,EAAUiC,QAASnB,IAcvB,OACCwB,EACEC,EAAA,CAAA3C,SAAA,CAAAC,GACAyC,EAACE,EAAOC,OAAAC,OAAA,CAAA,EAAK/C,EAAY,CAAEgD,WAAYzC,GACtC,CAAAN,SAAA,CAAAgD,EAAA,MAAAH,OAAAC,OAAA,CACCG,MAAO,CAAEC,SAAU,YACnBC,IAAKtC,GAAgD,CAAAb,SAErDgD,EAACI,EAAUP,OAAAC,OAAA,CACVO,MAAO,KACPH,SAAU,OACVD,MAAO,CAAEK,aAAc,IAAG,CAAAtD,SAE1BgD,EAACO,EACIV,OAAAC,OAAA,CAAA,EAAAjD,EACJ,CAAA2D,QAASA,WACoB,QAA5BC,EAAA3D,EAAc4D,sBAAc,IAAAD,GAAAA,EAAAE,KAAA7D,GACvBS,EAGJC,GAAsB,GAFjBV,EAAc8D,UAAUpD,GAAsB,GAIpDW,SAAAA,GAAe,EAEhBgC,IAAK/C,EACLD,aAAcA,CAAC0D,EAAMC,KACpB3D,SAAAA,EAAe0D,EAAMC,GACjB5C,GAAQA,GAAQ,WAKxB8B,~~EAACxD~~,~~EACAqD~~,OAAAC,OAAA,CAAAK,IAAKxC,EACLsC,MAAYJ,OAAAC,OAAAD,OAAAC,OAAA,GAAA9B,EAAe,QAAC,CAAE+C,OAAQ,KAClC9C,EAAmB,OACvB,~~CAAAtB~~,~~QAASY~~,GAAgBO,GAAe,CAAAd,SAExCgD,EAACI,EACAP,OAAAC,OAAA,CAAAO,MAAO,KACPH,SAAU,OACVD,MAAO,CAAEK,aAAc,IAEvB,CAAAtD,SAAAgD,EAACgB,EAAcnB,OAAAC,OAAA,CAAA,EACVhD,EAAa,CACjBmE,SAAWxC,UAEiB,QAA1B3B,EAAcoE,SACdpE,EAAcqE,gBAIW,QAAzBV,EAAA3D,EAAcmE,gBAAW,IAAAR,GAAAA,EAAAE,KAAA7D,EAAA2B,GACzBjB,GAAsB,GACtB,EAEF4D,QApEgBC,YAEK,QAA1BvE,EAAcoE,SACdpE,EAAcqE,eACdE,IAEsB,QAAtBZ,EAAA3D,EAAcmE,gBAAQ,IAAAR,GAAAA,EAAAE,KAAA7D,EAAG,IAAIuE,KAE9B7D,GAAsB,WACtB8D,EAAAxE,aAAa,EAAbA,EAAesE,+BAAW,EA4DpBF,QAASpE,EAAcoE,QACvB9D,UAAWA,EACXmE,oBAAsBC,IACrBtE,SAAAA,EAAwBsE,EAAO,eAQrCxB,uBAAKG,IAAK7C,GAAW,CAAAN,SAAAA,GAAYgD,EAAM,MAAA,CAAAhD,SAAAA,SACrC"}
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","_ref","visible","_ref2","FloatingInputDropdown","_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","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/esm/components/half-doughnut-chart/HalfDoughnutChart.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as r,jsx as o}from"react/jsx-runtime";import{Chart as e,ArcElement as n,Tooltip as t}from"chart.js";import{useRef as l,useState as i,useEffect as c}from"react";import{Doughnut as d}from"react-chartjs-2";import{BodySmall as a,TitleLarge as u,BodyCaption as s}from"../TypographyStyle.js";import{COLORS as h}from"../../constants/Theme.js";import{Wrapper as b,Legend as v,LegendItem as m,LegendDot as f,ChartWrapper as p,CanvasClip as g,ElementWrapper as j,PercentageLabel as C,DescriptionText as y}from"./HalfDoughnutChart.styled.js";e.register(n,t);const x=({segments:e})=>{var n;const t=l(null),[x,O]=i(480),N=l(e);N.current=e;const k=l(0);c((()=>{const r=t.current;if(!r)return;const o=new ResizeObserver((r=>{var o;const e=null===(o=r[0])||void 0===o?void 0:o.contentRect.width;e&&O(e)}));return o.observe(r),O(r.offsetWidth),()=>o.disconnect()}),[]);const w=e.reduce(((r,o)=>r+(Number(o.value)||0)),0);k.current=w;const R=e.length>0?e.reduce(((r,o)=>(Number(o.value)||0)>=(Number(r.value)||0)?o:r),e[0]):void 0,I=w>0&&R?Math.round(100*(Number(R.value)||0)/w):0,W=w>0?e.map((r=>Number(r.value)||0)):e.map((()=>1)),z=e.map((r=>r===R?r.color:r.color+"8F")),H={datasets:[{data:W,backgroundColor:z,borderColor:h.surface.standard,borderWidth:3,hoverBackgroundColor:z,hoverOffset:0}]},M=l({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:r=>{var o,e;const n=null!==(e=null===(o=r[0])||void 0===o?void 0:o.dataIndex)&&void 0!==e?e:-1;if(n<0)return"";const t=N.current[n],l=Number(t.value)||0;return(k.current>0?Math.round(100*l/k.current):0)+"% "+t.label},label:r=>{var o;const e=N.current[r.dataIndex];return null!==(o=null==e?void 0:e.tooltipLabel)&&void 0!==o?o:""},labelColor:r=>{var o,e;const n=N.current[r.dataIndex];return{borderColor:null!==(o=null==n?void 0:n.color)&&void 0!==o?o:"#fff",backgroundColor:null!==(e=null==n?void 0:n.color)&&void 0!==e?e:"#fff",borderRadius:3}}}}}}).current,S=0===w,T=null!==(n=null==R?void 0:R.emojiIcon)&&void 0!==n?n:null;return r(b,{children:[!S&&o(v,{children:e.map((({label:e,color:n},t)=>r(m,{children:[o(f,{color:n}),o(a,Object.assign({color:h.content.secondary},{children:e}))]},`${e}-${t}`)))}),r(p,Object.assign({ref:t},{children:[o(g,Object.assign({style:{height:x/2,overflow:"hidden"}},{children:o(d,{data:H,options:M,width:x,height:x})})),S?o(j,{children:o(C,{children:o(u,Object.assign({color:"#212121"},{children:"--"}))})}):T&&r(j,{children:[o(T,{width:36,height:36}),o(C,{children:r(u,Object.assign({color:"#212121"},{children:[I,"% ",o("span",{children:null==R?void 0:R.label})]}))})]})]})),(null==R?void 0:R.description)&&o(y,{children:o(s,Object.assign({color:h.content.secondary},{children:null==R?void 0:R.description}))})]})};export{x as HalfDoughnutChart};
+import{jsxs as r,jsx as o}from"react/jsx-runtime";import{Chart as e,ArcElement as n,Tooltip as t}from"chart.js";import{useRef as l,useState as i,useEffect as c}from"react";import{Doughnut as d}from"react-chartjs-2";import{BodySmall as a,TitleLarge as u,BodyCaption as s}from"../TypographyStyle.js";import{COLORS as h}from"../../constants/Theme.js";import{Wrapper as b,Legend as v,LegendItem as m,LegendDot as f,ChartWrapper as p,CanvasClip as g,ElementWrapper as j,PercentageLabel as C,DescriptionText as y}from"./HalfDoughnutChart.styled.js";e.register(n,t);const x=e=>{let{segments:n}=e;var t;const x=l(null),[O,N]=i(480),k=l(n);k.current=n;const w=l(0);c((()=>{const r=x.current;if(!r)return;const o=new ResizeObserver((r=>{var o;const e=null===(o=r[0])||void 0===o?void 0:o.contentRect.width;e&&N(e)}));return o.observe(r),N(r.offsetWidth),()=>o.disconnect()}),[]);const R=n.reduce(((r,o)=>r+(Number(o.value)||0)),0);w.current=R;const I=n.length>0?n.reduce(((r,o)=>(Number(o.value)||0)>=(Number(r.value)||0)?o:r),n[0]):void 0,W=R>0&&I?Math.round(100*(Number(I.value)||0)/R):0,z=R>0?n.map((r=>Number(r.value)||0)):n.map((()=>1)),H=n.map((r=>r===I?r.color:r.color+"8F")),M={datasets:[{data:z,backgroundColor:H,borderColor:h.surface.standard,borderWidth:3,hoverBackgroundColor:H,hoverOffset:0}]},S=l({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:r=>{var o,e;const n=null!==(e=null===(o=r[0])||void 0===o?void 0:o.dataIndex)&&void 0!==e?e:-1;if(n<0)return"";const t=k.current[n],l=Number(t.value)||0;return(w.current>0?Math.round(100*l/w.current):0)+"% "+t.label},label:r=>{var o;const e=k.current[r.dataIndex];return null!==(o=null==e?void 0:e.tooltipLabel)&&void 0!==o?o:""},labelColor:r=>{var o,e;const n=k.current[r.dataIndex];return{borderColor:null!==(o=null==n?void 0:n.color)&&void 0!==o?o:"#fff",backgroundColor:null!==(e=null==n?void 0:n.color)&&void 0!==e?e:"#fff",borderRadius:3}}}}}}).current,T=0===R,$=null!==(t=null==I?void 0:I.emojiIcon)&&void 0!==t?t:null;return r(b,{children:[!T&&o(v,{children:n.map(((e,n)=>{let{label:t,color:l}=e;return r(m,{children:[o(f,{color:l}),o(a,Object.assign({color:h.content.secondary},{children:t}))]},`${t}-${n}`)}))}),r(p,Object.assign({ref:x},{children:[o(g,Object.assign({style:{height:O/2,overflow:"hidden"}},{children:o(d,{data:M,options:S,width:O,height:O})})),T?o(j,{children:o(C,{children:o(u,Object.assign({color:"#212121"},{children:"--"}))})}):$&&r(j,{children:[o($,{width:36,height:36}),o(C,{children:r(u,Object.assign({color:"#212121"},{children:[W,"% ",o("span",{children:null==I?void 0:I.label})]}))})]})]})),(null==I?void 0:I.description)&&o(y,{children:o(s,Object.assign({color:h.content.secondary},{children:null==I?void 0:I.description}))})]})};export{x as HalfDoughnutChart};
 //# sourceMappingURL=HalfDoughnutChart.js.map

package/dist/esm/components/half-doughnut-chart/HalfDoughnutChart.js.map CHANGED Viewed

	@@ -1 +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","LegendItem","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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"}
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","_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","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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"}

package/dist/esm/components/helpers/FileUploaderHelper.js.map CHANGED Viewed

	@@ -1 +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","FileUploaderHelper","validate","inputData","file","linkData","type","split","bytesToMB","includes","toLocaleLowerCase"],"mappings":"qDAEO,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,aAEtDC,EACZC,SAASC,GAIR,MAAMC,KAAEA,EAAIC,SAAEA,GAAaF,EAC3B,IAAIX,EAAO,EACPc,EAAO,GACPZ,EAAS,GACb,GAAIU,EACHZ,EAAOY,EAAKZ,KACZc,EAAOF,EAAKE,KAAKC,MAAM,KAAK,GAC5Bb,EAASU,EAAKE,KAAKC,MAAM,KAAK,OACxB,KAAIF,EAKV,OAAOf,EAJPE,EAAOa,EAASb,KAChBc,EAAOD,EAASC,KAAKC,MAAM,KAAK,GAChCb,EAASW,EAASC,KAAKC,MAAM,KAAK,EAGlC,CAED,IAAKX,EAAeU,GACnB,OAAOhB,EAGR,GAAIkB,EAAUhB,GAAQI,EAAeU,GACpC,OAAOf,EAAkBK,EAAeU,IAGzC,IAAKN,EAAsBS,SAASf,EAAOgB,qBAAsB,CAChE,GAAa,UAATJ,EACH,OAAOb,EAA0B,OAC3B,GAAa,UAATa,EACV,OAAOb,EAA0B,kBAC3B,GAAa,gBAATa,EACV,OAAOb,EAA0B,MAElC,CACF"}
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","FileUploaderHelper","validate","inputData","file","linkData","type","split","bytesToMB","includes","toLocaleLowerCase"],"mappings":"qDAEO,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,aAEtDC,EACZC,SAASC,GAIR,MAAMC,KAAEA,EAAIC,SAAEA,GAAaF,EAC3B,IAAIX,EAAO,EACPc,EAAO,GACPZ,EAAS,GACb,GAAIU,EACHZ,EAAOY,EAAKZ,KACZc,EAAOF,EAAKE,KAAKC,MAAM,KAAK,GAC5Bb,EAASU,EAAKE,KAAKC,MAAM,KAAK,OACxB,KAAIF,EAKV,OAAOf,EAJPE,EAAOa,EAASb,KAChBc,EAAOD,EAASC,KAAKC,MAAM,KAAK,GAChCb,EAASW,EAASC,KAAKC,MAAM,KAAK,EAGlC,CAED,IAAKX,EAAeU,GACnB,OAAOhB,EAGR,GAAIkB,EAAUhB,GAAQI,EAAeU,GACpC,OAAOf,EAAkBK,EAAeU,IAGzC,IAAKN,EAAsBS,SAASf,EAAOgB,qBAAsB,CAChE,GAAa,UAATJ,EACH,OAAOb,EAA0B,OAC3B,GAAa,UAATa,EACV,OAAOb,EAA0B,kBAC3B,GAAa,gBAATa,EACV,OAAOb,EAA0B,MAElC,CACF"}

package/dist/esm/components/icon-button/IconButton.styled.js.map CHANGED Viewed

	@@ -1 +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","styled","button","props","bordered","iconButtonType","COLORS","stroke","primary","isSelected","generateBackgroundColor","disabled"],"mappings":"wIAKaA,MAAAA,EAAaC,EAAOC,MAI/B;GACEC,GAAU,sGAOZA,EAAMC,UAAqC,OAAzBD,EAAME,~~eACrB~~,~~qBAAqBC~~,EAAOC,OAAOC,WACnC,SAGHL,EAAMM,WACH,uBACYC,EAAwBP,EAAME,6BAE1C,gGAOHF,EAAMQ,UACN;"}
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","styled","button","props","bordered","iconButtonType","COLORS","stroke","primary","isSelected","generateBackgroundColor","disabled"],"mappings":"wIAKaA,MAAAA,EAAaC,EAAOC,MAI/B;GACEC,GAAU,sGAOZA,EAAMC,UAAqC,OAAzBD,EAAME,eACA,qBAAAC,EAAOC,OAAOC,WACnC,SAGHL,EAAMM,WACH,uBACYC,EAAwBP,EAAME,6BAE1C,gGAOHF,EAAMQ,UACN;"}

package/dist/esm/components/image-cropper/BikImagePipeline/BikImagePipeline.js CHANGED Viewed

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

package/dist/esm/components/image-cropper/BikImagePipeline/BikImagePipeline.js.map CHANGED Viewed

	@@ -1 +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","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":"~~keA4CO~~,~~MAAMA~~,~~EAAmBA~~,~~EAC/BC~~,~~cACAC~~,~~YACAC~~,~~qBACAC~~,~~eACAC~~,~~UACAC~~,~~WACAC~~,~~WACAC~~,~~oBACAC~~,~~0BAEA~~,~~MAAMC~~,EAAeC,EAAyB,OACvCC,EAAaC,GAAkBC,KAC/BC,EAAmBC,GAAwBF,EAASV,IACpDa,EAAUC,GAAeJ,GAAS,GAEzCK,GAAU,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,GACvC,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,EAAaC,cAAcF,GACpClC,EAAQmB,UACXX,EAAe,YACf2B,EAAaE,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,QAGY,iBAAhBnC,GACEJ,GAAqBA,EAAkBwC,QACpCD,QAEJvC,EAAkB2B,MAEpBY,EAAA,MAAA,CAAAE,SACCF,EAACG,EACA,CAAAC,OAAQC,EAAeC,MACvBC,QAAS,wBACTC,QAAS,wCACTC,iBAAiB,EACjBC,MAAO,IACPC,QAASA,KACRxC,GAAY,GACZX,GAAU,MAOdwC,kBACCA,EAACG,GACAS,YAAalD,eAAAA,EAAqBkD,YAClCR,OAAQC,EAAeQ,QACvBN,~~QAAS~~,~~kBAAkBpD,~~GAAa,UACxCqD,QAAS,oCAAoCrD,GAAa,UAC1DsD,iBAAiB,EACjBC,MAAO,QAOVI,EACEC,EAAA,CAAAb,SAAA,CAAA5C,EAAQe,QACR2B,EAAA,QAAA,CACCgB,IAAKrD,EACLsD,KAAK,OACLC,OAAO,UACPC,MAAO,CAAEC,QAAS,QAClBC,SA/DuBC,IAC1B,MAAMxC,EAAOwC,EAAMC,OAAOC,MAAM,GAC1BC,EAAS,IAAIC,WAEnBD,EAAOE,OAAS,KAhBWnC,MAiB1BvB,EAAqB,CACpB2D,IAAKH,EAAOI,SAlBarC,EAoBPiC,EAAOI,OAnBvBvE,EAAQkB,KACXV,EAAe,QAEfyB,EAAuBC,EAgBoB,EAGxCV,GACH2C,EAAOK,cAAchD,EACrB,IAqDiB,SAAhBjB,GACAmC,EAAC+B,EACA,CAAAH,IAAK5D,EAAkB4D,IACvBI,eAAiBxC,IAChBvB,EAAqB,CACpB2D,IAAKpC,IAEND,EAAuBC,EAAa,EAErCyC,YAAa/E,EAAa+E,YAC1BzE,SAAUA,MAGV"}
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","_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","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":"keA4CaA,MAAAA,EAAmBC,IAUJ,IAVKC,YAChCA,EAAWC,UACXA,EAASC,mBACTA,EAAkBC,aAClBA,EAAYC,QACZA,EAAOC,SACPA,EAAQC,SACRA,EAAQC,kBACRA,EAAiBC,oBACjBA,GACuBT,EACvB,MAAMU,EAAeC,EAAyB,OACvCC,EAAaC,GAAkBC,KAC/BC,EAAmBC,GAAwBF,EAASV,IACpDa,EAAUC,GAAeJ,GAAS,GAEzCK,GAAU,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,GACvC,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,EAAaC,cAAcF,GACpClC,EAAQmB,UACXX,EAAe,YACf2B,EAAaE,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,QAGY,iBAAhBnC,GACEJ,GAAqBA,EAAkBwC,QACpCD,QAEJvC,EAAkB2B,MAEpBY,EAAA,MAAA,CAAAE,SACCF,EAACG,EACA,CAAAC,OAAQC,EAAeC,MACvBC,QAAS,wBACTC,QAAS,wCACTC,iBAAiB,EACjBC,MAAO,IACPC,QAASA,KACRxC,GAAY,GACZX,GAAU,MAOdwC,kBACCA,EAACG,GACAS,YAAalD,eAAAA,EAAqBkD,YAClCR,OAAQC,EAAeQ,QACvBN,0BAA2BpD,GAAa,UACxCqD,QAAS,oCAAoCrD,GAAa,UAC1DsD,iBAAiB,EACjBC,MAAO,QAOVI,EACEC,EAAA,CAAAb,SAAA,CAAA5C,EAAQe,QACR2B,EAAA,QAAA,CACCgB,IAAKrD,EACLsD,KAAK,OACLC,OAAO,UACPC,MAAO,CAAEC,QAAS,QAClBC,SA/DuBC,IAC1B,MAAMxC,EAAOwC,EAAMC,OAAOC,MAAM,GAC1BC,EAAS,IAAIC,WAEnBD,EAAOE,OAAS,KAhBWnC,MAiB1BvB,EAAqB,CACpB2D,IAAKH,EAAOI,SAlBarC,EAoBPiC,EAAOI,OAnBvBvE,EAAQkB,KACXV,EAAe,QAEfyB,EAAuBC,EAgBoB,EAGxCV,GACH2C,EAAOK,cAAchD,EACrB,IAqDiB,SAAhBjB,GACAmC,EAAC+B,EACA,CAAAH,IAAK5D,EAAkB4D,IACvBI,eAAiBxC,IAChBvB,EAAqB,CACpB2D,IAAKpC,IAEND,EAAuBC,EAAa,EAErCyC,YAAa/E,EAAa+E,YAC1BzE,SAAUA,MAGV"}

package/dist/esm/components/input/ChipInput.js CHANGED Viewed

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

package/dist/esm/components/input/ChipInput.js.map CHANGED Viewed

	@@ -1 +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","onClick","handleContainerClick","_a","current","focus","onMouseEnter","e","currentTarget","onMouseLeave","border","stroke","vibrant","map","chip","index","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":"2WAiCMA,MAAAA,~~EAAsCA~~,~~EAC3CC~~,~~gBACAC~~,~~cACAC~~,~~QACAC~~,~~QACAC~~,~~aACAC~~,~~WACAC~~,~~gBACAC~~,~~QACAC~~,~~cACAC~~,~~iBACAC~~,~~4BACAC~~,~~eAEA~~,~~MAAOC~~,EAAYC,GAAiBC,EAAS,KACtCC,EAASC,GAAcF,GAAS,GACjCG,EAAWC,EAAyB,MAIpCC,EAAWV,GADG,CAAC,IAAK,IAAK,QAAS,IA4ClCW,EAAiBC,IACpBd,EACFC,EACAE,EACAK,GAEKO,EAAsBP,EAAU,CAAE,EAAGQ,IACrCC,EAAYC,IACZC,EAAkBC,IAClBC,EAAaC,EAAcrB,GAEjC,OACCsB,EAAA,MAAAC,OAAAC,OAAA,CACCC,MAAO,CAAEC,QAAS,OAAQC,cAAe,SAAUC,IAAK,GACxDC,GAAI1B,GAAQ,CAAA2B,SAAA,CAEXnC,GACAoC,EAACC,EAAaT,OAAAC,OAAA,CACbC,MAAO,CACNQ,MAAO1B,EACJ2B,EAAOC,QAAQC,MACfrC,EACAmC,EAAOC,QAAQE,SACfzC,GAAcsC,EAAOC,QAAQG,UAChC,CAAAR,SAEAnC,KAGH2B,EACC,MAAAC,OAAAC,OAAA,CAAAC,MAAOb,EACP2B,QAnC0BC,WACV,QAAlBC,EAAAhC,EAASiC,eAAS,IAAAD,GAAAA,EAAAE,OAAO,EAmCvBC,aAAeC,IACTtC,GACJgB,OAAOC,OAAOqB,EAAEC,cAAcrB,MAAOX,EACrC,EAEFiC,aAAeF,IACTtC,IACJsC,EAAEC,cAAcrB,MAAMuB,OAAS,aAC9BjD,EAAQmC,EAAOe,OAAOZ,SAASa,QAAUhB,EAAOe,OAAOX,UAExD,GAGD,CAAAR,SAAA,CAAApC,EAAMyD,KAAI,CAACC,EAAMC,IACjB/B,uBAAiBG,MAAOT,GAAS,CAAAc,SAAA,CAChCC,EAAO,OAAA,CAAAD,SAAAsB,IACPrB,0BACCN,MAAOP,EACPqB,QAAUM,IAxEUS,MAyEnBT,EAAEU,kBAzEiBD,EA0EFD,EAzEvB7D,EAAcE,EAAM8D,QAAO,CAACC,EAAGJ,IAAUA,IAAUC,IAyEtB,EAExBV,aAAeC,IACdA,EAAEC,cAAcrB,MAAMQ,MAAQC,EAAOC,QAAQuB,SAAS,EAEvDX,aAAeF,IACdA,EAAEC,cAAcrB,MAAMQ,MAAQC,EAAOC,QAAQuB,SAAS,EAE3C,aAAA,UAAUN,KAGd,CAAAtB,SAAA,UAjBAuB,KAoBXtB,EAAA,QAAA,CACC4B,IAAKlD,EACLmD,KAAK,OACLC,MAAOzD,EACP0D,SAAWjB,GAAMxC,EAAcwC,EAAEkB,OAAOF,OACxCG,UAhHmBnB,IAMtB,GAJClC,EAASsD,SAASpB,EAAEqB,MACpBvD,EAASsD,SAASpB,EAAEsB,UACpBxD,EAASsD,SAASpB,EAAEuB,OAEC,CACrBvB,EAAEwB,iBACF,MAAMC,EAAelE,EAAWmE,OAC5BD,IAAiB5E,EAAMuE,SAASK,KACnC9E,EAAc,IAAIE,EAAO4E,IACzBjE,EAAc,IAEf,KAAoB,cAAVwC,EAAEqB,KAAsC,KAAf9D,GAAqBV,EAAM8E,OAAS,GAEvEhF,EAAcE,EAAM+E,MAAM,GAAI,GAC9B,EAiGEC,QA1FgBC,KACnBnE,GAAW,EAAK,EA0FboE,OAvFeC,KAClBrE,GAAW,GAEX,MAAM8D,EAAelE,EAAWmE,OAC5BD,IAAiB5E,EAAMuE,SAASK,KACnC9E,EAAc,IAAIE,EAAO4E,IACzBjE,EAAc,IACd,EAiFEZ,YACkB,IAAjBC,EAAM8E,QAAkB/E,IAAgBc,EACrCd,OACAqF,EAEJrD,MAAOL,WAGLvB,KAAcE,IACjBgC,EAACgD,EACAxD,OAAAC,OAAA,CAAAC,MAAO,CACNQ,MAAOlC,EACJmC,EAAOC,QAAQE,SACfvC,GAAiBoC,EAAOC,QAAQuB,YACnC,CAAA5B,SAEA/B,GAAgBF,QAGd"}
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","_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","onClick","handleContainerClick","_a","current","focus","onMouseEnter","e","currentTarget","onMouseLeave","border","stroke","vibrant","map","chip","index","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/esm/components/input/ChipInput.styled.js.map CHANGED Viewed

	@@ -1 +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":["getChipStyle","padding","background","COLORS","surface","subdued","border","stroke","primary","fontSize","color","content","secondary","fontWeight","borderRadius","display","alignItems","justifyContent","cursor","margin","fontFamily","marginBottom","marginTop","height","getChipRemoveStyle","marginLeft","getContainerStyle","error","chipsContainerCustomStyle","focused","position","brand","negative","vibrant","backgroundColor","standard","flexWrap","minHeight","getContainerHoverStyle","getInputStyle","outline","boxSizing","flex","minWidth","paddingTop","paddingBottom"],"mappings":"kDAGaA,MAAAA,EAAeA,KAA4B,CACvDC,QAAS,kBACTC,WAAYC,EAAOC,QAAQC,QAC3BC,~~OAAQ~~,~~aAAaH~~,EAAOI,OAAOC,UACnCC,SAAU,GACVC,MAAOP,EAAOQ,QAAQC,UACtBC,WAAY,IACZC,aAAc,EACdC,QAAS,cACTC,WAAY,SACZC,eAAgB,SAChBC,OAAQ,UACRC,OAAQ,kBACRC,WAAY,QACZC,aAAc,MACdC,UAAW,MACXC,OAAQ,KAGIC,EAAqBA,KAA4B,CAC7Df,SAAU,GACVW,WAAY,QACZF,OAAQ,UACRL,WAAY,SACZH,MAAOP,EAAOQ,QAAQC,UACtBa,WAAY,EACZvB,WAAY,OACZI,OAAQ,OACRL,QAAS,EACTc,QAAS,cACTC,WAAY,WAGAU,EAAoBA,CAChCC,EACAJ,EACAK,EACAC,mBAEAd,QAAS,OACTe,SAAU,WACVxB,~~OAAQ~~,~~GAAGuB~~,EAAU,EAAI,aACxBA,EACG1B,EAAOI,OAAOwB,MACdJ,EACAxB,EAAOI,OAAOyB,SAASC,QACvB9B,EAAOI,OAAOC,UAElB0B,gBAAiB/B,EAAOC,QAAQ+B,SAChCnB,WAAY,SACZoB,SAAU,OACVnC,QAAS,kBACTa,aAAc,EACdI,OAAQ,OACRmB,UAAWd,GAAU,IAClBK,GAGSU,EAAyBA,KAA4B,CACjEhC,~~OAAQ~~,~~aAAaH~~,EAAOI,OAAOwB,UAGvBQ,EAAiBhB,IAA0C,CACvEjB,OAAQ,OACRkC,QAAS,OACTC,UAAW,aACXhC,SAAU,GACVW,WAAY,QACZP,WAAY,IACZU,OAAQA,GAAU,GAClBmB,KAAM,EACNC,SAAU,IACVC,WAAY,EACZC,cAAe,EACfX,gBAAiB"}
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":["getChipStyle","padding","background","COLORS","surface","subdued","border","stroke","primary","fontSize","color","content","secondary","fontWeight","borderRadius","display","alignItems","justifyContent","cursor","margin","fontFamily","marginBottom","marginTop","height","getChipRemoveStyle","marginLeft","getContainerStyle","error","chipsContainerCustomStyle","focused","position","brand","negative","vibrant","backgroundColor","standard","flexWrap","minHeight","getContainerHoverStyle","getInputStyle","outline","boxSizing","flex","minWidth","paddingTop","paddingBottom"],"mappings":"kDAGaA,MAAAA,EAAeA,KAA4B,CACvDC,QAAS,kBACTC,WAAYC,EAAOC,QAAQC,QAC3BC,OAAqB,aAAAH,EAAOI,OAAOC,UACnCC,SAAU,GACVC,MAAOP,EAAOQ,QAAQC,UACtBC,WAAY,IACZC,aAAc,EACdC,QAAS,cACTC,WAAY,SACZC,eAAgB,SAChBC,OAAQ,UACRC,OAAQ,kBACRC,WAAY,QACZC,aAAc,MACdC,UAAW,MACXC,OAAQ,KAGIC,EAAqBA,KAA4B,CAC7Df,SAAU,GACVW,WAAY,QACZF,OAAQ,UACRL,WAAY,SACZH,MAAOP,EAAOQ,QAAQC,UACtBa,WAAY,EACZvB,WAAY,OACZI,OAAQ,OACRL,QAAS,EACTc,QAAS,cACTC,WAAY,WAGAU,EAAoBA,CAChCC,EACAJ,EACAK,EACAC,mBAEAd,QAAS,OACTe,SAAU,WACVxB,OAAW,GAAAuB,EAAU,EAAI,aACxBA,EACG1B,EAAOI,OAAOwB,MACdJ,EACAxB,EAAOI,OAAOyB,SAASC,QACvB9B,EAAOI,OAAOC,UAElB0B,gBAAiB/B,EAAOC,QAAQ+B,SAChCnB,WAAY,SACZoB,SAAU,OACVnC,QAAS,kBACTa,aAAc,EACdI,OAAQ,OACRmB,UAAWd,GAAU,IAClBK,GAGSU,EAAyBA,KAA4B,CACjEhC,OAAqB,aAAAH,EAAOI,OAAOwB,UAGvBQ,EAAiBhB,IAA0C,CACvEjB,OAAQ,OACRkC,QAAS,OACTC,UAAW,aACXhC,SAAU,GACVW,WAAY,QACZP,WAAY,IACZU,OAAQA,GAAU,GAClBmB,KAAM,EACNC,SAAU,IACVC,WAAY,EACZC,cAAe,EACfX,gBAAiB"}

package/dist/esm/components/input/Input-helper.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{phone as e}from"phone";const r=e=>e&&"function"==typeof e,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,i=/(<[a-zA-Z][^>]*?)\s+on[a-zA-Z]+\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+)/g,a=e=>{if(!e)return e;let r,a=e.replace(t,"");a=a.replace(n,"");do{r=a,a=a.replace(i,"$1")}while(a!==r);return a},l=["text","multiline","email","url","password"],m=e=>l.includes(e),u=(r,t,n={})=>{let i;const a=["phonenumber","zip","number"].includes(t),l=a?r?Number(r):null:r;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"===t)return i=/(.+)@(.+){2,}\.(.+){2,}/,l.match(i)?[!0,""]:[!1,"Enter a valid email id"];if("url"===t)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"===t)return l>=0?[!0,""]:[!1,"Enter a valid number"];if("zip"===t)return 6===String(l).trim().length?[!0,""]:[!1,"Enter a valid zip code"];if("phonenumber"===t){const{isValid:r}=e("+"+String(l));return r?[!0,""]:[!1,"Enter a valid phonenumber"]}return(null==l?void 0:l.trim().length)>0?[!0,""]:[!1,"Enter a valid data"]};export{r as isFunction,a as sanitizeUnsafeInput,m as shouldSanitizeForType,u as validateInput};
+import{phone as e}from"phone";const t=e=>e&&"function"==typeof e,n=/<(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,i=/(<[a-zA-Z][^>]*?)\s+on[a-zA-Z]+\s*=\s*(?:"[^"]*"|'[^']*'|[^\s>]+)/g,a=e=>{if(!e)return e;let t,a=e.replace(n,"");a=a.replace(r,"");do{t=a,a=a.replace(i,"$1")}while(a!==t);return a},l=["text","multiline","email","url","password"],m=e=>l.includes(e),u=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("+"+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"]};export{t as isFunction,a as sanitizeUnsafeInput,m as shouldSanitizeForType,u as validateInput};
 //# sourceMappingURL=Input-helper.js.map

package/dist/esm/components/input/Input-helper.js.map CHANGED Viewed

	@@ -1 +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","fn","PAIRED_DANGEROUS_TAGS","UNPAIRED_DANGEROUS_TAGS","INLINE_EVENT_HANDLERS","sanitizeUnsafeInput","input","prev","cleaned","replace","SANITIZED_INPUT_TYPES","shouldSanitizeForType","type","includes","validateInput","inputText","rangeValidation","~~regex~~","NUMBER_TYPE","Number","String","~~length","~~min","max","match","trim","isValid","phone"],"mappings":"8BAGaA,MAAAA,EAAcC,GACnBA,GAAoB,mBAAPA,EAGfC,EACL,yFACKC,EACL,kGACKC,EACL,qEAEYC,EAAuBC,IACnC,IAAKA,EACJ,OAAOA,EAER,IAEIC,EAFAC,EAAUF,EAAMG,QAAQP,EAAuB,IACnDM,EAAUA,EAAQC,QAAQN,EAAyB,IAEnD,GACCI,EAAOC,EACPA,EAAUA,EAAQC,QAAQL,EAAuB,YACzCI,IAAYD,GACrB,OAAOC,CAAO,EAGTE,EAAsC,CAC3C,OACA,YACA,QACA,MACA,YAGYC,EAAyBC,GACrCF,EAAsBG,SAASD,GAEnBE,~~EAAgBA~~,~~CAC5BC~~,EACAH,~~EACAI~~,~~EAAkD~~,~~CAAA~~,~~KAElD~~,~~IAAIC~~,~~EAEJ~~,~~MAAMC~~,EAAc,CAAC,cAAe,MAAO,~~UAAUL~~,SAASD,GAExDN,~~EAAQY~~,~~EACXH~~,~~EACCI~~,~~OAAOJ~~,GACP,KACDA,EAEH,GAAIT,SAAmD,KAAVA,EAC5C,MAAO,EAAC,EAAM,IAGf,~~GACCY~~,GACEE,~~OAAOd~~,~~GAAOe~~,~~SACZL~~,~~EAAgBM~~,~~KAClBhB~~,~~EAA8BU~~,~~EAAgBM~~,~~KAC5CN~~,~~EAAgBO~~,~~KACjBjB~~,~~EAA8BU~~,~~EAAgBO~~,KAEjD,MAAO,EACN,EACA,~~8BAA8BP~~,~~EAAgBM~~,~~WAAWN~~,~~EAAgBO~~,OAI3E,GAAa,~~UAATX~~,EAEH,~~OADAK~~,EAAQ,~~0BACAX~~,~~EAAiBkB~~,~~MAAMP~~,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,~~QAATL~~,EAGV,~~OAFAK~~,EACC,~~8GACOX~~,~~EAAiBkB~~,~~MAAMP~~,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,qBACL,GAAa,~~WAATL~~,EACV,OAAON,GAAS,EAAI,EAAC,EAAM,IAAM,EAAC,EAAO,wBACnC,GAAa,QAATM,EACV,OAAuC,~~IAAhCQ~~,~~OAAOd~~,~~GAAOmB~~,~~OAAOJ~~,OACzB,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,~~gBAATT~~,EAAwB,CAClC,~~MAAMc~~,QAAEA,GAAYC,EAAM,~~IAAMP~~,~~OAAOd~~,IACvC,~~OAAOoB~~,EAAU,EAAC,EAAM,IAAM,EAAC,EAAO,4BACtC,CACA,~~OAAQpB~~,aAAK,EAALA,~~EAAkBmB~~,~~OAAOJ~~,QAAS,EACvC,EAAC,EAAM,IACP,EAAC,EAAO,~~qBACX~~"}
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","fn","PAIRED_DANGEROUS_TAGS","UNPAIRED_DANGEROUS_TAGS","INLINE_EVENT_HANDLERS","sanitizeUnsafeInput","input","prev","cleaned","replace","SANITIZED_INPUT_TYPES","shouldSanitizeForType","type","includes","validateInput","inputText","regex","rangeValidation","arguments","length","undefined","NUMBER_TYPE","Number","String","min","max","match","trim","isValid","phone"],"mappings":"8BAGaA,MAAAA,EAAcC,GACnBA,GAAoB,mBAAPA,EAGfC,EACL,yFACKC,EACL,kGACKC,EACL,qEAEYC,EAAuBC,IACnC,IAAKA,EACJ,OAAOA,EAER,IAEIC,EAFAC,EAAUF,EAAMG,QAAQP,EAAuB,IACnDM,EAAUA,EAAQC,QAAQN,EAAyB,IAEnD,GACCI,EAAOC,EACPA,EAAUA,EAAQC,QAAQL,EAAuB,YACzCI,IAAYD,GACrB,OAAOC,CAAO,EAGTE,EAAsC,CAC3C,OACA,YACA,QACA,MACA,YAGYC,EAAyBC,GACrCF,EAAsBG,SAASD,GAEnBE,EAAgB,SAC5BC,EACAH,GAEsB,IAClBI,EAFJC,EAAAC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAkD,CAAA,EAIlD,MAAMG,EAAc,CAAC,cAAe,MAAO,UAAUR,SAASD,GAExDN,EAAQe,EACXN,EACCO,OAAOP,GACP,KACDA,EAEH,GAAIT,SAAmD,KAAVA,EAC5C,MAAO,EAAC,EAAM,IAGf,GACCe,GACEE,OAAOjB,GAAOa,SACZF,EAAgBO,KAClBlB,EAA8BW,EAAgBO,KAC5CP,EAAgBQ,KACjBnB,EAA8BW,EAAgBQ,KAEjD,MAAO,EACN,EACA,8BAA8BR,EAAgBO,WAAWP,EAAgBQ,OAI3E,GAAa,UAATb,EAEH,OADAI,EAAQ,0BACAV,EAAiBoB,MAAMV,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,QAATJ,EAGV,OAFAI,EACC,8GACOV,EAAiBoB,MAAMV,GAC5B,EAAC,EAAM,IACP,EAAC,EAAO,qBACL,GAAa,WAATJ,EACV,OAAON,GAAS,EAAI,EAAC,EAAM,IAAM,EAAC,EAAO,wBACnC,GAAa,QAATM,EACV,OAAuC,IAAhCW,OAAOjB,GAAOqB,OAAOR,OACzB,EAAC,EAAM,IACP,EAAC,EAAO,0BACL,GAAa,gBAATP,EAAwB,CAClC,MAAMgB,QAAEA,GAAYC,EAAM,IAAMN,OAAOjB,IACvC,OAAOsB,EAAU,EAAC,EAAM,IAAM,EAAC,EAAO,4BACtC,CACA,OAAQtB,aAAK,EAALA,EAAkBqB,OAAOR,QAAS,EACvC,EAAC,EAAM,IACP,EAAC,EAAO,qBAGb"}

package/dist/esm/components/input/Input.js CHANGED Viewed

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Input.js","sources":["../../../../src/components/input/Input.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport React, {\n\tforwardRef,\n\tMutableRefObject,\n\tRef,\n\tuseContext,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport { Button } from '@src/components/button';\nimport {\n\tisFunction,\n\tsanitizeUnsafeInput,\n\tshouldSanitizeForType,\n\tvalidateInput,\n} from '@src/components/input/Input-helper';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport ErrorIcon from '../../assets/icons/errorInfo.svg';\nimport { InputStyleContext } from './context/InputStyleProvider';\nimport { InputProps, InputTypeI, InputVariant } from './Input.model';\nimport * as SC from './Input.styled';\nimport { PrefixHolder, SuffixHolder } from './Input.styled';\n\nexport const Input = forwardRef(\n\t(\n\t\tprops: InputProps,\n\t\tfRef: React.ForwardedRef<HTMLInputElement \| HTMLTextAreaElement \| null>,\n\t) => {\n\t\tconst {\n\t\t\tplaceholder,\n\t\t\tleftIcon,\n\t\t\trightIcon,\n\t\t\tlabelText,\n\t\t\tmaxCharLimit,\n\t\t\tisRequired,\n\t\t\thintText,\n\t\t\ttype,\n\t\t\tstate,\n\t\t\tvalidate,\n\t\t\tvariant,\n\t\t\tbutton,\n\t\t\tsuffixText,\n\t\t\tprefixText,\n\t\t\tonChangeText,\n\t\t\tvalue,\n\t\t\tnoErrorHint,\n\t\t\treset,\n\t\t\trangeValidation,\n\t\t\tnoKeyDownChange,\n\t\t\tversion,\n\t\t\tnoMaxCharCheck,\n\t\t\tlabelElement,\n\t\t\tautoGrow,\n\t\t\tminHeight,\n\t\t\tmaxHeight,\n\t\t\tlabelTextBold,\n\t\t\ttruncateText,\n\t\t\tmaxCharLimitPosition,\n\t\t\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","invalid","ErrorIcon","position","_c","_b","toString","_e","InputWrapper","_d","callback","isLeft","_f","IconHolder","PrefixHolder","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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"}
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","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","invalid","ErrorIcon","position","_c","_b","toString","_e","InputWrapper","_d","callback","isLeft","_f","IconHolder","PrefixHolder","SuffixHolder","text","Button","buttonText","buttonType","buttonProps","TitleSmall","BodySecondary","tooltipText","Tooltip","body","placement","InfoIcon","marginTop","color","COLORS","content","negative","primary","_g","_h","displayName"],"mappings":"s2BA0BO,MAAMA,EAAQC,GACpB,CACCC,EACAC,yBAEA,MAAMC,YACLA,EAAWC,SACXA,EAAQC,UACRA,EAASC,UACTA,EAASC,aACTA,EAAYC,WACZA,EAAUC,SACVA,EAAQC,KACRA,EAAIC,MACJA,EAAKC,SACLA,EAAQC,QACRA,EAAOC,OACPA,EAAMC,WACNA,EAAUC,WACVA,EAAUC,aACVA,EAAYC,MACZA,GAAKC,YACLA,GAAWC,MACXA,GAAKC,gBACLA,GAAeC,gBACfA,GAAeC,QACfA,GAAOC,eACPA,GAAcC,aACdA,GAAYC,SACZA,GAAQC,UACRA,GAASC,UACTA,GAASC,cACTA,GAAaC,aACbA,GAAYC,qBACZA,GAAoBC,qBACpBA,GAAoBC,eACpBA,GAAcC,gBACdA,GAAeC,WACfA,GAAUC,mBACVA,GAAkBC,kBAClBA,GAAiBC,iBACjBA,GAAgBC,WAChBA,IAAa,EAAKC,iBAClBA,IACAC,OAAAC,OAAA,CACAnC,aAAc,EACdG,KAAM,OACNG,QAAS,UACTkB,qBAAsB,MACtBM,kBAAmB,EACnBC,kBAAkB,GACfrC,GAEE0C,GAAWvC,aAAA,EAAAA,EAAUwC,KACrBC,GAAYxC,aAAA,EAAAA,EAAWuC,MACtBE,GAAWC,IAAgBC,GAAkB,IAC7CC,GAAUC,IAAeF,GAAkB,IAC3CG,GAAcC,IAAmBJ,IAClCK,GACO,YAAZxC,EAAwB,OAAqB,UAAZA,EAAsB,OAAS,OAC3DyC,GAAoBC,EAAWC,IAC9BC,GAAYC,IAAiBV,EAAiB,IAC/CW,GAAOC,EAA+C,MACtDC,GACJ3D,QAAAA,EAAQyD,GAIVG,GAAU,KACTJ,GAAcxC,IAAS,KAClBA,IAASQ,KACbmC,GAASE,QAAQC,MAAMC,OAAStC,IAAa,OAC7C,GACC,CAACT,KAEJ4C,GAAU,WACJD,GAASE,UAGO,QAArBG,EAAAjE,EAAMkE,uBAAe,IAAAD,GAAAA,EAAAE,KAAAnE,EAAG4D,GAASE,SAAQ,GACvC,CAACF,KAEJC,GAAU,KACT,MAAMO,EAAcR,GAASE,QAC7B,GAAIM,GAAe,CAAC,cAAe,MAAO,UAAUC,SAAS5D,GAG5D,OAFA2D,EAAYE,iBAAiB,QAASC,GAAS,CAAEC,SAAS,IAEnD,KACNJ,EAAYK,oBAAoB,QAASF,GAAQ,CAElD,GACC,IAEHV,GAAU,KACJ1C,IAGLsC,GAAc,GAAG,GACf,CAACtC,KAEJ0C,GAAU,WACTZ,KAAcjD,EAAMgD,UAChBhD,EAAMgD,WACS,QAAlBiB,EAAAL,GAASE,eAAS,IAAAG,GAAAA,EAAAS,QAClB,GACC,CAAC1E,EAAMgD,WAEVa,GAAU,KACTV,GAAgBnD,EAAMkD,aAAa,GACjC,CAAClD,EAAMkD,eAEVW,GAAU,WACTf,IAAa,IAEI,YAAhB9C,EAAMU,OACNwC,IACgB,qBAAhBlD,EAAMU,QAENoC,IAAa,GAEM,WAAhB9C,EAAMU,QACS,QAAlBuD,EAAAL,GAASE,eAAS,IAAAG,GAAAA,EAAAS,QAClB,GACC,CAAC1E,EAAMU,MAAOwC,KAEjBW,GAAU,KACTf,KAAeI,IAAgC,YAAhBlD,EAAMU,MAAoB,GACvD,CAACwC,GAAclD,EAAMU,QAExB,MAAMiE,GAAkB,SAACC,GACxB,GAAKC,EAAWD,GAAhB,CAEC,IAAAE,IAAAA,EAAAC,UAAAC,OAHmCC,MAAaC,MAAAJ,EAAAA,EAAAA,OAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAbF,EAAaE,EAAAJ,GAAAA,UAAAI,GAIjDP,KAAMK,EADL,GAIIG,GAAaA,IACL,QAAT3E,EACI,EAED,IAGF4E,GAAaC,IAClB,MAAMC,EAAkC,IAAjBjF,EAAqBA,EAAe8E,KAErDI,EAAiBpD,GACjBqD,EAAYH,EAAEI,OAAOzE,MAE1Be,MACEyD,EAAUT,QAAUS,EAAUT,QAAUQ,IAE1CxD,GAAesD,GAIdjE,IACCoE,EAAUT,UAAUS,EAAUT,QAAUQ,IAE1CxE,EAAaC,IAAS,GAAIqE,GAEvB/D,KAhB6B,CAAC,GAmBP8C,SAASiB,EAAEK,QACrCJ,EAAiB,GACjBE,EAAUT,QAAUO,GAEpBD,EAAEM,gBACF,EAGIrB,GAAWsB,IAChBA,EAAMD,gBAAgB,EAGjBE,GAAYR,IACjB,IAAIG,EAAYH,EAAEI,OAAOzE,MACzB,MAAMsE,EACY,IAAjBjF,EAAqBA,EAAe,EAAI8E,KACnCI,EAAiBpD,GAkBvB,IAhBKG,IAAoBwD,EAAsBtF,KAC9CgF,EAAYO,EAAoBP,KAI/BlE,IACDgE,EAAiB,GACjBE,EAAUT,QAAUO,IAGpBE,EAAYA,EAAUQ,UAAU,EAAGV,EAAiB,IAGhDvF,EAAMkG,aACVzC,GAAcgC,GAAa,IAExBD,GAAkBC,GAAaA,EAAUT,OAASQ,EAErD,OAGDxE,EAAayE,EAAWH,GACpB7D,KACHmC,GAASE,QAAQC,MAAMC,OAAY,GAAAJ,GAASE,QAAQqC,iBAC/CV,IACJ7B,GAASE,QAAQC,MAAMC,OAAStC,IAAa,SAG/C,MAAM0E,EAAmBzF,GAAY0F,EACrC,IAAKD,IAAqBvB,EAAWuB,GACpC,OAED,MAAOE,EAASC,GAASH,EACxBX,EACAhF,EACAW,IAGD0B,IAAcwD,GACdnD,GAAgBnD,EAAMkD,aAAelD,EAAMkD,aAAeqD,EAAM,EAG3DC,GAAWlB,UACXtF,EAAMyG,WACVxD,IAAY,GAEb0B,GAAgC,UAAhB3E,EAAMwG,eAAU,IAAAvC,OAAA,EAAAA,EAAAE,KAAAnE,EAAAsF,GAAG,EAG9BoB,GAAUpB,UACVtF,EAAMyG,WACVxD,IAAY,GAEb0B,GAA+B,UAAf3E,EAAM0G,cAAS,IAAAzC,OAAA,EAAAA,EAAAE,KAAAnE,EAAAsF,GAAG,EAG7BqB,GAAeA,WACpB,OACCC,EAAAC,EAAA,CAAAC,SAAA,CACW,cAATrG,GACAsG,EAAA,QAAA,CACCC,UAAWnF,GAAe,iBAAmB,GAClC,YAAA7B,EAAM,aACjBiH,GAAIjH,EAAMiH,GACVlD,MAA+B,QAAxBE,EAAAZ,cAAiB,EAAjBA,GAAmB6D,aAAK,IAAAjD,EAAAA,EAAI,CAAE,EACrCkD,IAAKvD,GACLwD,SAAU9E,GACV7B,KACC,CAAC,cAAe,MAAO,UAAU4D,SAAS5D,GACvC,SACAA,EAEJQ,MAAOuC,GACPgD,QAAUlB,GAAMkB,GAAQlB,GACxBoB,OAASpB,GAAMoB,GAAOpB,GACtBpF,YAAaA,GAAe,aAC5B4F,SAAUA,GACVuB,QAAU/B,GAAMX,GAAgB3E,EAAMqH,SACtChC,UAAYC,GAAMD,GAAUC,KAGpB,cAAT7E,GACAsG,EAAA,WAAA,CAAA,YACY/G,EAAM,aACjBiB,MAAOuC,GACP2D,IAAKvD,GACL4C,QAAUlB,GAAMkB,GAAQlB,GACxBoB,OAASpB,GAAMoB,GAAOpB,GACtB+B,QAAU/B,GAAMX,GAAgB3E,EAAMqH,SACtCD,SAAU9E,GACVpC,YAAaA,GAAe,aAC5B4F,SAAUA,GACVT,UAAYC,GAAMD,GAAUC,GAC5BgC,UAAWhH,EAAe,EAAIA,OAAeiH,MAG7C,EAIL,OACCX,EAACY,EACAhF,OAAAC,OAAA,CAAAgF,MAAOzH,EAAMyH,MACbzD,OAAQhE,EAAMgE,OACdtD,MAAOA,EACPD,KAAMA,EACNsD,MAA2C,QAApCE,EAAAZ,cAAA,EAAAA,GAAmBqE,qBAAiB,IAAAzD,EAAAA,EAAA,CAAA,GAE3C,CAAA6C,SAAA,CAAAF,EAAA,MAAApE,OAAAC,OAAA,CAAKuE,UAAU,qBACb,CAAAF,SAAA,EAAC5F,OAAkBV,KAAc0C,KACjC0D,EAACY,EAAchF,OAAAC,OAAA,CAACkF,UAAWzE,IACzB,CAAA4D,SAAA,GAAE5D,IAAgB6D,EAACa,EAAS,CAACH,MAAO,GAAIzD,OAAQ,KAChDd,IAAgB1C,MAGlBF,EAAe,GAA8B,WAAzBwB,IACpB8E,EAACY,EAAgBhF,OAAAC,OAAA,CAAAoF,SAAU,UACzB,CAAAf,SAAA,CAAgC,QAAhCgB,EAAwB,QAAxBC,GAAC9G,SAAAA,GAAS,IAAI+G,kBAAU,IAAAD,OAAA,EAAAA,EAAE/C,cAAM,IAAA8C,EAAAA,EAAI,EAAC,IAAGxH,UAI5CsG,EAACY,EAAehF,OAAAC,OAAA,CACf7B,QAASA,EACTF,MAAOA,EACP+G,MAAOzH,EAAMyH,MACbzE,SAAoB,WAAVtC,GAAsBsC,GAChCH,UAAWA,GACXkB,MAAgE,QAAzDkE,EAA+B,UAA/B5E,cAAiB,EAAjBA,GAAmB6E,oBAAY,IAAAC,EAAAA,EAAIhG,UAAsB,IAAA8F,EAAAA,EAAA,CAAE,EAClE3G,QAASA,GACT0C,OAAQhE,EAAMgE,OACdjC,qBAAsBA,GACtBG,WAAYA,IAEX,CAAA4E,SAAA,GAAEpE,IACFqE,EAACS,EAAahF,OAAAC,OAAA,CACb7B,QAASA,EACTwC,SAAUA,GACViE,QAASA,IAAM1C,GAAgBxE,aAAQ,EAARA,EAAUiI,UACzCC,QAAQ,EACRtE,MAAoC,QAA7BuE,EAAAjF,cAAiB,EAAjBA,GAAmBkF,kBAAU,IAAAD,EAAAA,EAAI,CAAE,GAAA,CAAAxB,SAE1CC,EAACrE,GAAQ,SAGR3B,GACFgG,EAACyB,EAAYhG,OAAAC,OAAA,CAAC7B,QAASA,GAAO,CAAAkG,SAAG/F,KAErB,YAAZH,GACAmG,EAACS,EAAiBhF,OAAAC,OAAA,CACjBuB,OAAQhE,EAAMgE,OACdvD,KAAMT,EAAMS,KACZiB,UAAWA,GACXC,UAAWA,GACXF,SAAUA,cAETkF,QAGF,CAAC,UAAW,SAAStC,SAASzD,IAC9BmG,EAACS,EAAsBhF,OAAAC,OAAA,CAACuB,OAAQhE,EAAMgE,OAAQvD,KAAMT,EAAMS,MACxD,CAAAqG,SAAAH,UAGA/D,IACFmE,EAACS,EAAahF,OAAAC,OAAA,CACb7B,QAASA,EACTwC,SAAUA,GACViE,QAASA,IAAM1C,GAAgBvE,aAAA,EAAAA,EAAWgI,UAC1CC,QAAQ,GAER,CAAAvB,SAAAC,EAACnE,GAAS,SAGT9B,GACFiG,EAAC0B,EAAajG,OAAAC,OAAA,CAAA7B,QAASA,GAAU,CAAAkG,SAAAhG,KAEjCD,GAAUA,EAAO6H,MACjB3B,EAAC4B,EACA,CAAAC,WAAY/H,EAAO6H,KACnBG,WAAYhI,EAAOgI,WACnBxB,QAASA,IAAM1C,GAAgB9D,aAAA,EAAAA,EAAQwG,WAGxCxG,GAAUA,EAAOiI,aAAe/B,EAAC4B,EAAWnG,OAAAC,OAAA,CAAA,EAAA5B,EAAOiI,mBAEnD7G,OAAsB5B,KAAeC,IACtCsG,EAACY,EACAhF,OAAAC,OAAA,CAAAkF,QAAS9E,GACTR,iBAAkBA,eAEjBb,IAAgBA,GACjBoF,EAAK,MAAApE,OAAAC,OAAA,CAAAuE,UAAU,+BAEbJ,EADAhF,GACCmH,EAKAC,EAJC,CAAAlC,SAAA,CAAAzG,EACAE,EAAawG,EAAc,OAAA,CAAAD,SAAA,MAAG,MAQhC9G,EAAMiJ,aACNlC,EAACmC,EAAO1G,OAAAC,OAAA,CAAC0G,KAAMnJ,EAAMiJ,YAAaG,UAAW,OAC5C,CAAAtC,SAAAC,EAAA,OAAA,CAAAD,SACCC,EAACsC,GACAtF,MAAO,CAAEuF,WAAY,GACrB7B,MAAO,GACPzD,OAAQ,GACRuF,MACC1G,GACG2G,EAAOC,QAAQC,SACfF,EAAOC,QAAQE,mBAOvBrJ,EAAe,GAA8B,QAAzBwB,IACpB8E,EAACY,EAAe,CAAAV,SAAA,CACkB,kBAAhC8C,GAAC3I,SAAAA,GAAS,IAAI+G,iCAAYhD,cAAM,IAAA6E,EAAAA,EAAI,EAAC,IAAGvJ,YAK3B,IAKtBR,EAAMgK,YAAc"}