npm - @lax-wp/design-system - Versions diffs - 0.13.33-beta.6 → 0.13.33 - Mend

@lax-wp/design-system 0.13.33-beta.6 → 0.13.33

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

package/dist/components/forms/creatable-select/CreatableSelect.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),E=require("../../../_virtual/index.cjs.js"),M=require("react-select/creatable"),g=require("@mui/icons-material"),P=require("antd"),V=require("../../data-display/typography/Typography.cjs.js"),T=require("../../icons/HelpIcon.cjs.js"),O=require("../../data-display/label/Label.cjs.js"),$=require("react"),A=require("../shared/InputLabel.cjs.js"),B=require("../../../hooks/useIsDarkMode.cjs.js"),v=({id:l,label:i,errorMessage:n,selectOptions:h,loading:y,isClearable:C,multiSelect:t,selectedValues:c,disabled:d,required:s,value:p,className:S,tooltip:b,tags:j,originalCase:w=!1,onChange:x,filterOption:D,placeholder:k,...I})=>{const r=B.useIsDarkMode(),[L,u]=$.useState(!1),f=(e,o)=>{x&&x(e);const m=document.getElementById(l);if(m){const H=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${l}`,value:e,type:"change"}});m.dispatchEvent(H)}},F={control:(e,o)=>({...e,borderColor:n&&s?r?"#F04438":"#fda49b":o.isFocused?"var(--color-primary-600)":r?"#434343":"#d9d9d9",backgroundColor:r?"#141414":o.isDisabled?"#f5f5f5":"#fff",borderRadius:"6px",padding:"0 4px 0 12px",opacity:o.isDisabled?.6:1,cursor:o.isDisabled?"not-allowed":"pointer",boxShadow:o.isFocused?r?"0 0 0 1.5px var(--color-primary-950)":"0 0 0 1.5px var(--color-primary-100)":"none","&:hover":{borderColor:n&&s?r?"#F04438":"#fda49b":"var(--color-primary-600)"}}),valueContainer:e=>({...e,fontSize:"14px",padding:0}),input:e=>({...e,margin:"0",padding:"0",color:r?"rgba(255,255,255,0.85)":"inherit"}),indicatorsContainer:e=>({...e,padding:0}),option:(e,o)=>({...e,fontSize:"14px",lineHeight:"22px",padding:"5px 12px",margin:0,backgroundColor:o.isSelected?r?"var(--color-primary-975)":"var(--color-primary-50)":o.isFocused?r?"var(--color-primary-950)":"var(--color-primary-100)":r?"#141414":"#fff",color:o.isDisabled?r?"rgba(255,255,255,0.25)":"#a3a3a3":r?o.isSelected?"var(--color-primary-600)":"rgba(255,255,255,0.85)":"rgba(0,0,0,0.88)",cursor:o.isDisabled?"not-allowed":"pointer",opacity:o.isDisabled?.6:1,"&:hover":{backgroundColor:o.isDisabled?r?"#141414":"#fff":r?"var(--color-primary-950)":"var(--color-primary-100)"},"&:active":{backgroundColor:r?"var(--color-primary-950)":"var(--color-primary-50)"}}),singleValue:(e,o)=>({...e,fontSize:"14px",lineHeight:"20px",color:o.isDisabled?r?"rgba(255,255,255,0.25)":"#a3a3a3":r?"rgba(255,255,255,0.85)":"rgba(0,0,0,0.88)"}),placeholder:e=>({...e,fontSize:"14px",whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden",color:r?"rgba(255,255,255,0.25)":"#bfbfbf"}),multiValue:e=>({...e,backgroundColor:r?"rgba(255,255,255,0.08)":"#f0f5ff",border:r?"1px solid transparent":"1px solid #adc6ff",borderRadius:"4px"}),multiValueLabel:e=>({...e,color:r?"rgba(255,255,255,0.85)":"var(--color-primary-600)",fontSize:"12px"}),multiValueRemove:e=>({...e,color:r?"rgba(255,255,255,0.85)":"var(--color-primary-600)","&:hover":{backgroundColor:r?"rgba(255,255,255,0.16)":"#e6f4ff",color:r?"#fff":"var(--color-primary-600)"}}),menu:e=>({...e,zIndex:5001,borderRadius:"8px",boxShadow:r?"0 6px 16px 0 rgba(0,0,0,0.45)":"0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.12), 0 9px 28px 8px rgba(0,0,0,0.05)",backgroundColor:r?"#141414":"#fff",border:r?"1px solid #303030":"none",overflow:"hidden"}),menuList:e=>({...e,padding:"0",maxHeight:"256px"})},z=!!c?.length,N=L&&!d&&(C?z||!!p:!1),q=e=>{e.stopPropagation(),e.preventDefault(),f(t?[]:null)},R=()=>a.jsx("div",{className:"flex items-center",children:N?a.jsx(g.CancelRounded,{onClick:q,sx:{fontSize:"16px",cursor:"pointer",color:r?"rgba(255,255,255,0.45)":"rgba(0,0,0,0.25)","&:hover":{color:r?"rgba(255,255,255,0.65)":"rgba(0,0,0,0.45)"}}}):a.jsx(g.ChevronLeftRounded,{className:"-rotate-90",sx:{fontSize:"18px",color:r?"rgba(255,255,255,0.25)":"rgba(0,0,0,0.25)"}})});return a.jsxs("div",{id:l,className:E("w-full flex flex-col gap-1",S),onMouseDown:e=>e.stopPropagation(),role:"group","aria-labelledby":i?l+"Label":void 0,children:[i&&a.jsxs("label",{id:l+"Label",htmlFor:"text",className:`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${w?"":"capitalize"}`,children:[a.jsx(A.InputLabel,{label:i||"",required:s||!1}),a.jsx(O.Label,{labels:j}),b&&a.jsx(P.Tooltip,{placement:"top",title:b,children:a.jsx("div",{className:"cursor-pointer",children:a.jsx(T.HelpIcon,{className:"w-icon-sm h-icon-sm"})})})]}),a.jsx("div",{onMouseEnter:()=>u(!0),onMouseLeave:()=>u(!1),children:a.jsx(M,{...I,id:"cm"+i,classNamePrefix:"lax-select",required:s,options:h,isClearable:!1,isLoading:y,isDisabled:d,styles:F,isMulti:t,value:t?c:p,onChange:f,filterOption:D,placeholder:k,classNames:{menuList:()=>"nowheel",control:()=>"!min-h-8 !text-sm"},components:{DropdownIndicator:R,IndicatorSeparator:()=>null}})}),n&&a.jsx(V.Typography,{className:"text-error-500",appearance:"custom",size:"extra-small",variant:"medium",children:n})]})};v.displayName="CreatableSelectField";exports.CreatableSelectField=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),E=require("../../../_virtual/index.cjs.js"),M=require("react-select/creatable"),m=require("@mui/icons-material"),P=require("antd"),V=require("../../data-display/typography/Typography.cjs.js"),T=require("../../icons/HelpIcon.cjs.js"),O=require("../../data-display/label/Label.cjs.js"),$=require("react"),A=require("../shared/InputLabel.cjs.js"),B=require("../../../hooks/useIsDarkMode.cjs.js"),v=({id:l,label:i,errorMessage:n,selectOptions:h,loading:y,isClearable:C,multiSelect:t,selectedValues:c,disabled:d,required:s,value:p,className:S,tooltip:b,tags:j,originalCase:D=!1,onChange:x,filterOption:w,placeholder:k,...I})=>{const r=B.useIsDarkMode(),[L,u]=$.useState(!1),f=(e,o)=>{x&&x(e);const g=document.getElementById(l);if(g){const R=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${l}`,value:e,type:"change"}});g.dispatchEvent(R)}},z={control:(e,o)=>({...e,borderColor:n&&s?r?"#F04438":"#fda49b":o.isFocused?"var(--color-primary-600)":r?"#434343":"#d9d9d9",backgroundColor:r?"#141414":o.isDisabled?"#f5f5f5":"#fff",borderRadius:"6px",minHeight:"32px",fontSize:"14px",padding:"0 4px 0 12px",opacity:o.isDisabled?.6:1,cursor:o.isDisabled?"not-allowed":"pointer",boxShadow:o.isFocused?r?"0 0 0 1.5px var(--color-primary-950)":"0 0 0 1.5px var(--color-primary-100)":"none","&:hover":{borderColor:n&&s?r?"#F04438":"#fda49b":"var(--color-primary-600)"}}),valueContainer:e=>({...e,fontSize:"14px",padding:0}),input:e=>({...e,margin:"0",padding:"0",color:r?"rgba(255,255,255,0.85)":"inherit"}),indicatorsContainer:e=>({...e,padding:0}),option:(e,o)=>({...e,fontSize:"14px",lineHeight:"22px",padding:"5px 12px",margin:0,backgroundColor:o.isSelected?r?"var(--color-primary-975)":"var(--color-primary-50)":o.isFocused?r?"var(--color-primary-950)":"var(--color-primary-100)":r?"#141414":"#fff",color:o.isDisabled?r?"rgba(255,255,255,0.25)":"#a3a3a3":r?o.isSelected?"var(--color-primary-600)":"rgba(255,255,255,0.85)":"rgba(0,0,0,0.88)",cursor:o.isDisabled?"not-allowed":"pointer",opacity:o.isDisabled?.6:1,"&:hover":{backgroundColor:o.isDisabled?r?"#141414":"#fff":r?"var(--color-primary-950)":"var(--color-primary-100)"},"&:active":{backgroundColor:r?"var(--color-primary-950)":"var(--color-primary-50)"}}),singleValue:(e,o)=>({...e,fontSize:"14px",lineHeight:"20px",color:o.isDisabled?r?"rgba(255,255,255,0.25)":"#a3a3a3":r?"rgba(255,255,255,0.85)":"rgba(0,0,0,0.88)"}),placeholder:e=>({...e,fontSize:"14px",whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden",color:r?"rgba(255,255,255,0.25)":"#bfbfbf"}),multiValue:e=>({...e,backgroundColor:r?"rgba(255,255,255,0.08)":"#f0f5ff",border:r?"1px solid transparent":"1px solid #adc6ff",borderRadius:"4px"}),multiValueLabel:e=>({...e,color:r?"rgba(255,255,255,0.85)":"var(--color-primary-600)",fontSize:"12px"}),multiValueRemove:e=>({...e,color:r?"rgba(255,255,255,0.85)":"var(--color-primary-600)","&:hover":{backgroundColor:r?"rgba(255,255,255,0.16)":"#e6f4ff",color:r?"#fff":"var(--color-primary-600)"}}),menu:e=>({...e,zIndex:5001,borderRadius:"8px",boxShadow:r?"0 6px 16px 0 rgba(0,0,0,0.45)":"0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.12), 0 9px 28px 8px rgba(0,0,0,0.05)",backgroundColor:r?"#141414":"#fff",border:r?"1px solid #303030":"none",overflow:"hidden"}),menuList:e=>({...e,padding:"0",maxHeight:"256px"})},F=!!c?.length,q=L&&!d&&(C?F||!!p:!1),N=e=>{e.stopPropagation(),e.preventDefault(),f(t?[]:null)},H=()=>a.jsx("div",{className:"flex items-center",children:q?a.jsx(m.CancelRounded,{onClick:N,sx:{fontSize:"16px",cursor:"pointer",color:r?"rgba(255,255,255,0.45)":"rgba(0,0,0,0.25)","&:hover":{color:r?"rgba(255,255,255,0.65)":"rgba(0,0,0,0.45)"}}}):a.jsx(m.ChevronLeftRounded,{className:"-rotate-90",sx:{fontSize:"18px",color:r?"rgba(255,255,255,0.25)":"rgba(0,0,0,0.25)"}})});return a.jsxs("div",{id:l,className:E("w-full flex flex-col gap-1",S),onMouseDown:e=>e.stopPropagation(),role:"group","aria-labelledby":i?l+"Label":void 0,children:[i&&a.jsxs("label",{id:l+"Label",htmlFor:"text",className:`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${D?"":"capitalize"}`,children:[a.jsx(A.InputLabel,{label:i||"",required:s||!1}),a.jsx(O.Label,{labels:j}),b&&a.jsx(P.Tooltip,{placement:"top",title:b,children:a.jsx("div",{className:"cursor-pointer",children:a.jsx(T.HelpIcon,{})})})]}),a.jsx("div",{onMouseEnter:()=>u(!0),onMouseLeave:()=>u(!1),children:a.jsx(M,{...I,id:"cm"+i,classNamePrefix:"lax-select",required:s,options:h,isClearable:!1,isLoading:y,isDisabled:d,styles:z,isMulti:t,value:t?c:p,onChange:f,filterOption:w,placeholder:k,classNames:{menuList:()=>"nowheel"},components:{DropdownIndicator:H,IndicatorSeparator:()=>null}})}),n&&a.jsx(V.Typography,{className:"text-error-500",appearance:"custom",size:"extra-small",variant:"medium",children:n})]})};v.displayName="CreatableSelectField";exports.CreatableSelectField=v;
 //# sourceMappingURL=CreatableSelect.cjs.js.map

package/dist/components/forms/creatable-select/CreatableSelect.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CreatableSelect.cjs.js","sources":["../../../../src/components/forms/creatable-select/CreatableSelect.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport cn from \"classnames\";\nimport CreatableSelect from \"react-select/creatable\";\nimport { CancelRounded, ChevronLeftRounded } from \"@mui/icons-material\";\nimport { Tooltip } from \"antd\";\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { useState, type ComponentProps } from \"react\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { useIsDarkMode } from \"../../../hooks/useIsDarkMode\";\n\n/\n Option type for the CreatableSelect component\n /\nexport interface SelectOption {\n /* The value of the option /\n value: string \| number;\n /* The label displayed for the option /\n label: string;\n /* Whether the option is disabled /\n isDisabled?: boolean;\n /* Additional data for the option /\n data?: Record<string, unknown>;\n}\n\n/\n Props for the CreatableSelectField component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TProps = {\n /* Unique identifier for the select /\n id: string;\n /* Label text to display above the select /\n label: string;\n /* Placeholder text for the select /\n placeholder?: string;\n /* Current value for single select /\n value?: any;\n /* Callback function called when selection changes /\n onChange(data: any): void;\n /* Error message to display below the select /\n errorMessage?: string;\n /* Array of available options /\n selectOptions: any[];\n /* Whether the select is in loading state /\n loading?: boolean;\n /* Whether multiple selections are allowed /\n multiSelect?: boolean;\n /* Current values for multi select /\n selectedValues?: any[];\n /* Custom filter function for options /\n filterOption?: any;\n /* Whether to preserve original case in the label /\n originalCase?: boolean;\n /* Whether the select is disabled /\n disabled?: boolean;\n /* Whether the select is clearable /\n isClearable?: boolean;\n /* Whether the field is required /\n required?: boolean;\n /* Tags/labels to display next to the label /\n tags?: (string \| LabelType)[];\n /* Tooltip text for the help icon /\n tooltip?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n};\n\n// Export type alias for backward compatibility\nexport type CreatableSelectProps = TProps & ComponentProps<typeof CreatableSelect>;\n\n/\n A creatable select component with label, validation, and styling support.\n * Features dark mode support, accessibility enhancements, and comprehensive prop support.\n * Built on top of react-select/creatable for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * CreatableSelectField component.\n \n @example\n * ```tsx\n * <CreatableSelectField\n * id=\"tags\"\n * label=\"Tags\"\n * selectOptions={tagOptions}\n * value={selectedTag}\n * onChange={(newValue) => setSelectedTag(newValue)}\n * placeholder=\"Select or create tags...\"\n * multiSelect\n * />\n * ```\n */\nexport const CreatableSelectField = ({\n id,\n label,\n errorMessage,\n selectOptions,\n loading,\n isClearable,\n multiSelect,\n selectedValues,\n disabled,\n required,\n value,\n className,\n tooltip,\n tags,\n originalCase = false,\n onChange,\n filterOption,\n placeholder,\n ...props\n}: TProps & ComponentProps<typeof CreatableSelect>) => {\n const isDarkMode = useIsDarkMode();\n const [isHovered, setIsHovered] = useState(false);\n\n const handleChange = (newValue: any, _actionMeta?: any) => {\n // Call the original onChange handler\n if (onChange) {\n onChange(newValue);\n }\n\n // Dispatch pilot-change event for recording\n const containerElement = document.getElementById(id);\n if (containerElement) {\n const pilotChangeEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: newValue,\n type: \"change\",\n },\n });\n containerElement.dispatchEvent(pilotChangeEvent);\n }\n };\n\n const styleProps = {\n control: (baseStyles: any, state: any) => ({\n ...baseStyles,\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : state.isFocused\n ? \"var(--color-primary-600)\"\n : isDarkMode ? \"#434343\" : \"#d9d9d9\",\n backgroundColor: isDarkMode\n ? \"#141414\"\n : state.isDisabled ? \"#f5f5f5\" : \"#fff\",\n borderRadius: \"6px\",\n padding: \"0 4px 0 12px\",\n opacity: state.isDisabled ? 0.6 : 1,\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n boxShadow: state.isFocused\n ? isDarkMode\n ? \"0 0 0 1.5px var(--color-primary-950)\"\n : \"0 0 0 1.5px var(--color-primary-100)\"\n : \"none\",\n \"&:hover\": {\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : \"var(--color-primary-600)\",\n },\n }),\n valueContainer: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n padding: 0,\n }),\n input: (baseStyles: any) => ({\n ...baseStyles,\n margin: \"0\",\n padding: \"0\",\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"inherit\",\n }),\n indicatorsContainer: (baseStyles: any) => ({\n ...baseStyles,\n padding: 0,\n }),\n option: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"22px\",\n padding: \"5px 12px\",\n margin: 0,\n backgroundColor: state.isSelected\n ? isDarkMode ? \"var(--color-primary-975)\" : \"var(--color-primary-50)\"\n : state.isFocused\n ? isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\"\n : isDarkMode ? \"#141414\" : \"#fff\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode\n ? state.isSelected\n ? \"var(--color-primary-600)\"\n : \"rgba(255,255,255,0.85)\"\n : \"rgba(0,0,0,0.88)\",\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n opacity: state.isDisabled ? 0.6 : 1,\n \"&:hover\": {\n backgroundColor: state.isDisabled\n ? isDarkMode ? \"#141414\" : \"#fff\"\n : isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\",\n },\n \"&:active\": {\n backgroundColor: isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-50)\",\n },\n }),\n singleValue: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"20px\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode ? \"rgba(255,255,255,0.85)\" : \"rgba(0,0,0,0.88)\",\n }),\n placeholder: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n whiteSpace: \"nowrap\" as const,\n textOverflow: \"ellipsis\",\n overflow: \"hidden\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#bfbfbf\",\n }),\n multiValue: (baseStyles: any) => ({\n ...baseStyles,\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.08)\" : \"#f0f5ff\",\n border: isDarkMode ? \"1px solid transparent\" : \"1px solid #adc6ff\",\n borderRadius: \"4px\",\n }),\n multiValueLabel: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n fontSize: \"12px\",\n }),\n multiValueRemove: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n \"&:hover\": {\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.16)\" : \"#e6f4ff\",\n color: isDarkMode ? \"#fff\" : \"var(--color-primary-600)\",\n },\n }),\n menu: (baseStyles: any) => ({\n ...baseStyles,\n zIndex: 5001,\n borderRadius: \"8px\",\n boxShadow: isDarkMode\n ? \"0 6px 16px 0 rgba(0,0,0,0.45)\"\n : \"0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.12), 0 9px 28px 8px rgba(0,0,0,0.05)\",\n backgroundColor: isDarkMode ? \"#141414\" : \"#fff\",\n border: isDarkMode ? \"1px solid #303030\" : \"none\",\n overflow: \"hidden\",\n }),\n menuList: (baseStyles: any) => ({\n ...baseStyles,\n padding: \"0\",\n maxHeight: \"256px\",\n }),\n };\n\n const hasSelectedValues = !!selectedValues?.length;\n const hasValue = !!value;\n const isFieldClearable = isClearable ? hasSelectedValues \|\| hasValue : false;\n const showClearIcon = isHovered && !disabled && isFieldClearable;\n\n const handleClear = (e: React.MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n handleChange(multiSelect ? [] : null);\n };\n\n const DropdownIndicator = () => (\n <div className=\"flex items-center\">\n {showClearIcon ? (\n <CancelRounded\n onClick={handleClear}\n sx={{\n fontSize: \"16px\",\n cursor: \"pointer\",\n color: isDarkMode ? \"rgba(255,255,255,0.45)\" : \"rgba(0,0,0,0.25)\",\n \"&:hover\": {\n color: isDarkMode ? \"rgba(255,255,255,0.65)\" : \"rgba(0,0,0,0.45)\",\n },\n }}\n />\n ) : (\n <ChevronLeftRounded\n className=\"-rotate-90\"\n sx={{\n fontSize: \"18px\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"rgba(0,0,0,0.25)\",\n }}\n />\n )}\n </div>\n );\n\n return (\n <div\n id={id}\n className={cn(\"w-full flex flex-col gap-1\", className)}\n onMouseDown={(e) => e.stopPropagation()}\n role=\"group\"\n aria-labelledby={label ? id + \"Label\" : undefined}\n >\n {label && (\n <label\n id={id + \"Label\"}\n htmlFor=\"text\"\n className={`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${!originalCase ? \"capitalize\" : \"\"}`}\n >\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n <Label labels={tags} />\n {tooltip && (\n <Tooltip placement=\"top\" title={tooltip}>\n <div className=\"cursor-pointer\">\n <HelpIcon className=\"w-icon-sm h-icon-sm\" />\n </div>\n </Tooltip>\n )}\n </label>\n )}\n\n <div\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n <CreatableSelect\n {...props}\n id={\"cm\" + label}\n classNamePrefix=\"lax-select\"\n required={required}\n options={selectOptions}\n isClearable={false}\n isLoading={loading}\n isDisabled={disabled}\n styles={styleProps}\n isMulti={multiSelect}\n value={multiSelect ? selectedValues : value}\n onChange={handleChange}\n filterOption={filterOption}\n placeholder={placeholder}\n classNames={{\n menuList: () => \"nowheel\",\n control: ()=> \"!min-h-8 !text-sm\"\n }}\n components={{\n DropdownIndicator,\n IndicatorSeparator: () => null,\n }}\n />\n </div>\n {errorMessage && (\n <Typography\n className=\"text-error-500\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n </div>\n );\n};\n\nCreatableSelectField.displayName = \"CreatableSelectField\";\n"],"names":["CreatableSelectField","id","label","errorMessage","selectOptions","loading","isClearable","multiSelect","selectedValues","disabled","required","value","className","tooltip","tags","originalCase","onChange","filterOption","placeholder","props","isDarkMode","useIsDarkMode","isHovered","setIsHovered","useState","handleChange","newValue","_actionMeta","containerElement","pilotChangeEvent","styleProps","baseStyles","state","hasSelectedValues","showClearIcon","handleClear","DropdownIndicator","jsx","CancelRounded","ChevronLeftRounded","jsxs","cn","InputLabel","Label","Tooltip","HelpIcon","CreatableSelect","Typography"],"mappings":"8fA8FaA,EAAuB,CAAC,CACnC,GAAAC,EACA,MAAAC,EACA,aAAAC,EACA,cAAAC,EACA,QAAAC,EACA,YAAAC,EACA,YAAAC,EACA,eAAAC,EACA,SAAAC,EACA,SAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,KAAAC,EACA,aAAAC,EAAe,GACf,SAAAC,EACA,aAAAC,EACA,YAAAC,EACA,GAAGC,CACL,IAAuD,CACrD,MAAMC,EAAaC,EAAAA,cAAA,EACb,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAE1CC,EAAe,CAACC,EAAeC,IAAsB,CAErDX,GACFA,EAASU,CAAQ,EAInB,MAAME,EAAmB,SAAS,eAAe3B,CAAE,EACnD,GAAI2B,EAAkB,CACpB,MAAMC,EAAmB,IAAI,YAAY,eAAgB,CACvD,QAAS,GACT,OAAQ,CACN,SAAU,IAAI5B,CAAE,GAChB,MAAOyB,EACP,KAAM,QAAA,CACR,CACD,EACDE,EAAiB,cAAcC,CAAgB,CACjD,CACF,EAEMC,EAAa,CACjB,QAAS,CAACC,EAAiBC,KAAgB,CACzC,GAAGD,EACH,YACE5B,GAAgBO,EACZU,EAAa,UAAY,UACzBY,EAAM,UACJ,2BACAZ,EAAa,UAAY,UACjC,gBAAiBA,EACb,UACAY,EAAM,WAAa,UAAY,OACnC,aAAc,MACd,QAAS,eACT,QAASA,EAAM,WAAa,GAAM,EAClC,OAAQA,EAAM,WAAa,cAAgB,UAC3C,UAAWA,EAAM,UACbZ,EACE,uCACA,uCACF,OACJ,UAAW,CACT,YACEjB,GAAgBO,EACZU,EAAa,UAAY,UACzB,0BAAA,CACR,GAEF,eAAiBW,IAAqB,CACpC,GAAGA,EACH,SAAU,OACV,QAAS,CAAA,GAEX,MAAQA,IAAqB,CAC3B,GAAGA,EACH,OAAQ,IACR,QAAS,IACT,MAAOX,EAAa,yBAA2B,SAAA,GAEjD,oBAAsBW,IAAqB,CACzC,GAAGA,EACH,QAAS,CAAA,GAEX,OAAQ,CAACA,EAAiBC,KAAgB,CACxC,GAAGD,EACH,SAAU,OACV,WAAY,OACZ,QAAS,WACT,OAAQ,EACR,gBAAiBC,EAAM,WACnBZ,EAAa,2BAA6B,0BAC1CY,EAAM,UACJZ,EAAa,2BAA6B,2BAC5CA,EAAa,UAAY,OAC7B,MAAOY,EAAM,WACTZ,EAAa,yBAA2B,UACxCA,EACEY,EAAM,WACJ,2BACA,yBACF,mBACN,OAAQA,EAAM,WAAa,cAAgB,UAC3C,QAASA,EAAM,WAAa,GAAM,EAClC,UAAW,CACT,gBAAiBA,EAAM,WACnBZ,EAAa,UAAY,OACzBA,EAAa,2BAA6B,0BAAA,EAEhD,WAAY,CACV,gBAAiBA,EAAa,2BAA6B,yBAAA,CAC7D,GAEF,YAAa,CAACW,EAAiBC,KAAgB,CAC7C,GAAGD,EACH,SAAU,OACV,WAAY,OACZ,MAAOC,EAAM,WACTZ,EAAa,yBAA2B,UACxCA,EAAa,yBAA2B,kBAAA,GAE9C,YAAcW,IAAqB,CACjC,GAAGA,EACH,SAAU,OACV,WAAY,SACZ,aAAc,WACd,SAAU,SACV,MAAOX,EAAa,yBAA2B,SAAA,GAEjD,WAAaW,IAAqB,CAChC,GAAGA,EACH,gBAAiBX,EAAa,yBAA2B,UACzD,OAAQA,EAAa,wBAA0B,oBAC/C,aAAc,KAAA,GAEhB,gBAAkBW,IAAqB,CACrC,GAAGA,EACH,MAAOX,EAAa,yBAA2B,2BAC/C,SAAU,MAAA,GAEZ,iBAAmBW,IAAqB,CACtC,GAAGA,EACH,MAAOX,EAAa,yBAA2B,2BAC/C,UAAW,CACT,gBAAiBA,EAAa,yBAA2B,UACzD,MAAOA,EAAa,OAAS,0BAAA,CAC/B,GAEF,KAAOW,IAAqB,CAC1B,GAAGA,EACH,OAAQ,KACR,aAAc,MACd,UAAWX,EACP,gCACA,kGACJ,gBAAiBA,EAAa,UAAY,OAC1C,OAAQA,EAAa,oBAAsB,OAC3C,SAAU,QAAA,GAEZ,SAAWW,IAAqB,CAC9B,GAAGA,EACH,QAAS,IACT,UAAW,OAAA,EACb,EAGIE,EAAoB,CAAC,CAACzB,GAAgB,OAGtC0B,EAAgBZ,GAAa,CAACb,IADXH,EAAc2B,GADtB,CAAC,CAACtB,EACoD,IAGjEwB,EAAe,GAAwB,CAC3C,EAAE,gBAAA,EACF,EAAE,eAAA,EACFV,EAAalB,EAAc,CAAA,EAAK,IAAI,CACtC,EAEM6B,EAAoB,IACxBC,EAAAA,IAAC,MAAA,CAAI,UAAU,oBACZ,SAAAH,EACCG,EAAAA,IAACC,EAAAA,cAAA,CACC,QAASH,EACT,GAAI,CACF,SAAU,OACV,OAAQ,UACR,MAAOf,EAAa,yBAA2B,mBAC/C,UAAW,CACT,MAAOA,EAAa,yBAA2B,kBAAA,CACjD,CACF,CAAA,EAGFiB,EAAAA,IAACE,EAAAA,mBAAA,CACC,UAAU,aACV,GAAI,CACF,SAAU,OACV,MAAOnB,EAAa,yBAA2B,kBAAA,CACjD,CAAA,EAGN,EAGF,OACEoB,EAAAA,KAAC,MAAA,CACC,GAAAvC,EACA,UAAWwC,EAAG,6BAA8B7B,CAAS,EACrD,YAAc,GAAM,EAAE,gBAAA,EACtB,KAAK,QACL,kBAAiBV,EAAQD,EAAK,QAAU,OAEvC,SAAA,CAAAC,GACCsC,EAAAA,KAAC,QAAA,CACC,GAAIvC,EAAK,QACT,QAAQ,OACR,UAAW,wFAAyFc,EAA8B,GAAf,YAAiB,GAEpI,SAAA,CAAAsB,MAACK,EAAAA,YAAW,MAAOxC,GAAS,GAAI,SAAUQ,GAAY,GAAO,EAC7D2B,EAAAA,IAACM,EAAAA,MAAA,CAAM,OAAQ7B,CAAA,CAAM,EACpBD,GACCwB,EAAAA,IAACO,EAAAA,QAAA,CAAQ,UAAU,MAAM,MAAO/B,EAC9B,SAAAwB,MAAC,MAAA,CAAI,UAAU,iBACb,SAAAA,MAACQ,EAAAA,SAAA,CAAS,UAAU,sBAAsB,EAC5C,CAAA,CACF,CAAA,CAAA,CAAA,EAKNR,EAAAA,IAAC,MAAA,CACC,aAAc,IAAMd,EAAa,EAAI,EACrC,aAAc,IAAMA,EAAa,EAAK,EAEtC,SAAAc,EAAAA,IAACS,EAAA,CACE,GAAG3B,EACJ,GAAI,KAAOjB,EACX,gBAAgB,aAChB,SAAAQ,EACA,QAASN,EACT,YAAa,GACb,UAAWC,EACX,WAAYI,EACZ,OAAQqB,EACR,QAASvB,EACT,MAAOA,EAAcC,EAAiBG,EACtC,SAAUc,EACV,aAAAR,EACA,YAAAC,EACA,WAAY,CACV,SAAU,IAAM,UAChB,QAAS,IAAK,mBAAA,EAEhB,WAAY,CACV,kBAAAkB,EACA,mBAAoB,IAAM,IAAA,CAC5B,CAAA,CACF,CAAA,EAEDjC,GACCkC,EAAAA,IAACU,EAAAA,WAAA,CACC,UAAU,iBACV,WAAW,SACX,KAAK,cACL,QAAQ,SAEP,SAAA5C,CAAA,CAAA,CACH,CAAA,CAAA,CAIR,EAEAH,EAAqB,YAAc"}
1	+ {"version":3,"file":"CreatableSelect.cjs.js","sources":["../../../../src/components/forms/creatable-select/CreatableSelect.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport cn from \"classnames\";\nimport CreatableSelect from \"react-select/creatable\";\nimport { CancelRounded, ChevronLeftRounded } from \"@mui/icons-material\";\nimport { Tooltip } from \"antd\";\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { useState, type ComponentProps } from \"react\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { useIsDarkMode } from \"../../../hooks/useIsDarkMode\";\n\n/\n Option type for the CreatableSelect component\n /\nexport interface SelectOption {\n /* The value of the option /\n value: string \| number;\n /* The label displayed for the option /\n label: string;\n /* Whether the option is disabled /\n isDisabled?: boolean;\n /* Additional data for the option /\n data?: Record<string, unknown>;\n}\n\n/\n Props for the CreatableSelectField component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TProps = {\n /* Unique identifier for the select /\n id: string;\n /* Label text to display above the select /\n label: string;\n /* Placeholder text for the select /\n placeholder?: string;\n /* Current value for single select /\n value?: any;\n /* Callback function called when selection changes /\n onChange(data: any): void;\n /* Error message to display below the select /\n errorMessage?: string;\n /* Array of available options /\n selectOptions: any[];\n /* Whether the select is in loading state /\n loading?: boolean;\n /* Whether multiple selections are allowed /\n multiSelect?: boolean;\n /* Current values for multi select /\n selectedValues?: any[];\n /* Custom filter function for options /\n filterOption?: any;\n /* Whether to preserve original case in the label /\n originalCase?: boolean;\n /* Whether the select is disabled /\n disabled?: boolean;\n /* Whether the select is clearable /\n isClearable?: boolean;\n /* Whether the field is required /\n required?: boolean;\n /* Tags/labels to display next to the label /\n tags?: (string \| LabelType)[];\n /* Tooltip text for the help icon /\n tooltip?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n};\n\n// Export type alias for backward compatibility\nexport type CreatableSelectProps = TProps & ComponentProps<typeof CreatableSelect>;\n\n/\n A creatable select component with label, validation, and styling support.\n * Features dark mode support, accessibility enhancements, and comprehensive prop support.\n * Built on top of react-select/creatable for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * CreatableSelectField component.\n \n @example\n * ```tsx\n * <CreatableSelectField\n * id=\"tags\"\n * label=\"Tags\"\n * selectOptions={tagOptions}\n * value={selectedTag}\n * onChange={(newValue) => setSelectedTag(newValue)}\n * placeholder=\"Select or create tags...\"\n * multiSelect\n * />\n * ```\n */\nexport const CreatableSelectField = ({\n id,\n label,\n errorMessage,\n selectOptions,\n loading,\n isClearable,\n multiSelect,\n selectedValues,\n disabled,\n required,\n value,\n className,\n tooltip,\n tags,\n originalCase = false,\n onChange,\n filterOption,\n placeholder,\n ...props\n}: TProps & ComponentProps<typeof CreatableSelect>) => {\n const isDarkMode = useIsDarkMode();\n const [isHovered, setIsHovered] = useState(false);\n\n const handleChange = (newValue: any, _actionMeta?: any) => {\n // Call the original onChange handler\n if (onChange) {\n onChange(newValue);\n }\n\n // Dispatch pilot-change event for recording\n const containerElement = document.getElementById(id);\n if (containerElement) {\n const pilotChangeEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: newValue,\n type: \"change\",\n },\n });\n containerElement.dispatchEvent(pilotChangeEvent);\n }\n };\n\n const styleProps = {\n control: (baseStyles: any, state: any) => ({\n ...baseStyles,\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : state.isFocused\n ? \"var(--color-primary-600)\"\n : isDarkMode ? \"#434343\" : \"#d9d9d9\",\n backgroundColor: isDarkMode\n ? \"#141414\"\n : state.isDisabled ? \"#f5f5f5\" : \"#fff\",\n borderRadius: \"6px\",\n minHeight: \"32px\",\n fontSize: \"14px\",\n padding: \"0 4px 0 12px\",\n opacity: state.isDisabled ? 0.6 : 1,\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n boxShadow: state.isFocused\n ? isDarkMode\n ? \"0 0 0 1.5px var(--color-primary-950)\"\n : \"0 0 0 1.5px var(--color-primary-100)\"\n : \"none\",\n \"&:hover\": {\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : \"var(--color-primary-600)\",\n },\n }),\n valueContainer: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n padding: 0,\n }),\n input: (baseStyles: any) => ({\n ...baseStyles,\n margin: \"0\",\n padding: \"0\",\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"inherit\",\n }),\n indicatorsContainer: (baseStyles: any) => ({\n ...baseStyles,\n padding: 0,\n }),\n option: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"22px\",\n padding: \"5px 12px\",\n margin: 0,\n backgroundColor: state.isSelected\n ? isDarkMode ? \"var(--color-primary-975)\" : \"var(--color-primary-50)\"\n : state.isFocused\n ? isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\"\n : isDarkMode ? \"#141414\" : \"#fff\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode\n ? state.isSelected\n ? \"var(--color-primary-600)\"\n : \"rgba(255,255,255,0.85)\"\n : \"rgba(0,0,0,0.88)\",\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n opacity: state.isDisabled ? 0.6 : 1,\n \"&:hover\": {\n backgroundColor: state.isDisabled\n ? isDarkMode ? \"#141414\" : \"#fff\"\n : isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\",\n },\n \"&:active\": {\n backgroundColor: isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-50)\",\n },\n }),\n singleValue: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"20px\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode ? \"rgba(255,255,255,0.85)\" : \"rgba(0,0,0,0.88)\",\n }),\n placeholder: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n whiteSpace: \"nowrap\" as const,\n textOverflow: \"ellipsis\",\n overflow: \"hidden\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#bfbfbf\",\n }),\n multiValue: (baseStyles: any) => ({\n ...baseStyles,\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.08)\" : \"#f0f5ff\",\n border: isDarkMode ? \"1px solid transparent\" : \"1px solid #adc6ff\",\n borderRadius: \"4px\",\n }),\n multiValueLabel: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n fontSize: \"12px\",\n }),\n multiValueRemove: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n \"&:hover\": {\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.16)\" : \"#e6f4ff\",\n color: isDarkMode ? \"#fff\" : \"var(--color-primary-600)\",\n },\n }),\n menu: (baseStyles: any) => ({\n ...baseStyles,\n zIndex: 5001,\n borderRadius: \"8px\",\n boxShadow: isDarkMode\n ? \"0 6px 16px 0 rgba(0,0,0,0.45)\"\n : \"0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.12), 0 9px 28px 8px rgba(0,0,0,0.05)\",\n backgroundColor: isDarkMode ? \"#141414\" : \"#fff\",\n border: isDarkMode ? \"1px solid #303030\" : \"none\",\n overflow: \"hidden\",\n }),\n menuList: (baseStyles: any) => ({\n ...baseStyles,\n padding: \"0\",\n maxHeight: \"256px\",\n }),\n };\n\n const hasSelectedValues = !!selectedValues?.length;\n const hasValue = !!value;\n const isFieldClearable = isClearable ? hasSelectedValues \|\| hasValue : false;\n const showClearIcon = isHovered && !disabled && isFieldClearable;\n\n const handleClear = (e: React.MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n handleChange(multiSelect ? [] : null);\n };\n\n const DropdownIndicator = () => (\n <div className=\"flex items-center\">\n {showClearIcon ? (\n <CancelRounded\n onClick={handleClear}\n sx={{\n fontSize: \"16px\",\n cursor: \"pointer\",\n color: isDarkMode ? \"rgba(255,255,255,0.45)\" : \"rgba(0,0,0,0.25)\",\n \"&:hover\": {\n color: isDarkMode ? \"rgba(255,255,255,0.65)\" : \"rgba(0,0,0,0.45)\",\n },\n }}\n />\n ) : (\n <ChevronLeftRounded\n className=\"-rotate-90\"\n sx={{\n fontSize: \"18px\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"rgba(0,0,0,0.25)\",\n }}\n />\n )}\n </div>\n );\n\n return (\n <div\n id={id}\n className={cn(\"w-full flex flex-col gap-1\", className)}\n onMouseDown={(e) => e.stopPropagation()}\n role=\"group\"\n aria-labelledby={label ? id + \"Label\" : undefined}\n >\n {label && (\n <label\n id={id + \"Label\"}\n htmlFor=\"text\"\n className={`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${!originalCase ? \"capitalize\" : \"\"}`}\n >\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n <Label labels={tags} />\n {tooltip && (\n <Tooltip placement=\"top\" title={tooltip}>\n <div className=\"cursor-pointer\">\n <HelpIcon />\n </div>\n </Tooltip>\n )}\n </label>\n )}\n\n <div\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n <CreatableSelect\n {...props}\n id={\"cm\" + label}\n classNamePrefix=\"lax-select\"\n required={required}\n options={selectOptions}\n isClearable={false}\n isLoading={loading}\n isDisabled={disabled}\n styles={styleProps}\n isMulti={multiSelect}\n value={multiSelect ? selectedValues : value}\n onChange={handleChange}\n filterOption={filterOption}\n placeholder={placeholder}\n classNames={{\n menuList: () => \"nowheel\",\n }}\n components={{\n DropdownIndicator,\n IndicatorSeparator: () => null,\n }}\n />\n </div>\n {errorMessage && (\n <Typography\n className=\"text-error-500\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n </div>\n );\n};\n\nCreatableSelectField.displayName = \"CreatableSelectField\";\n"],"names":["CreatableSelectField","id","label","errorMessage","selectOptions","loading","isClearable","multiSelect","selectedValues","disabled","required","value","className","tooltip","tags","originalCase","onChange","filterOption","placeholder","props","isDarkMode","useIsDarkMode","isHovered","setIsHovered","useState","handleChange","newValue","_actionMeta","containerElement","pilotChangeEvent","styleProps","baseStyles","state","hasSelectedValues","showClearIcon","handleClear","DropdownIndicator","jsx","CancelRounded","ChevronLeftRounded","jsxs","cn","InputLabel","Label","Tooltip","HelpIcon","CreatableSelect","Typography"],"mappings":"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"}

package/dist/components/forms/creatable-select/CreatableSelect.es.js CHANGED Viewed

@@ -16,9 +16,9 @@ const J = ({
   selectOptions: v,
   loading: h,
   isClearable: y,
-  multiSelect: s,
-  selectedValues: c,
-  disabled: p,
+  multiSelect: p,
+  selectedValues: s,
+  disabled: c,
   required: t,
   value: d,
   className: C,
@@ -50,6 +50,8 @@ const J = ({
       borderColor: n && t ? r ? "#F04438" : "#fda49b" : e.isFocused ? "var(--color-primary-600)" : r ? "#434343" : "#d9d9d9",
       backgroundColor: r ? "#141414" : e.isDisabled ? "#f5f5f5" : "#fff",
       borderRadius: "6px",
+      minHeight: "32px",
+      fontSize: "14px",
       padding: "0 4px 0 12px",
       opacity: e.isDisabled ? 0.6 : 1,
       cursor: e.isDisabled ? "not-allowed" : "pointer",
@@ -137,12 +139,12 @@ const J = ({
       padding: "0",
       maxHeight: "256px"
     })
-  }, N = !!c?.length, I = F && !p && (y ? N || !!d : !1), E = (o) => {
-    o.stopPropagation(), o.preventDefault(), x(s ? [] : null);
-  }, H = () => /* @__PURE__ */ a("div", { className: "flex items-center", children: I ? /* @__PURE__ */ a(
+  }, I = !!s?.length, N = F && !c && (y ? I || !!d : !1), H = (o) => {
+    o.stopPropagation(), o.preventDefault(), x(p ? [] : null);
+  }, E = () => /* @__PURE__ */ a("div", { className: "flex items-center", children: N ? /* @__PURE__ */ a(
     P,
     {
-      onClick: E,
+      onClick: H,
       sx: {
         fontSize: "16px",
         cursor: "pointer",
@@ -180,7 +182,7 @@ const J = ({
             children: [
               /* @__PURE__ */ a(A, { label: i || "", required: t || !1 }),
               /* @__PURE__ */ a(O, { labels: S }),
-              m && /* @__PURE__ */ a(T, { placement: "top", title: m, children: /* @__PURE__ */ a("div", { className: "cursor-pointer", children: /* @__PURE__ */ a(B, { className: "w-icon-sm h-icon-sm" }) }) })
+              m && /* @__PURE__ */ a(T, { placement: "top", title: m, children: /* @__PURE__ */ a("div", { className: "cursor-pointer", children: /* @__PURE__ */ a(B, {}) }) })
             ]
           }
         ),
@@ -199,19 +201,18 @@ const J = ({
                 options: v,
                 isClearable: !1,
                 isLoading: h,
-                isDisabled: p,
+                isDisabled: c,
                 styles: L,
-                isMulti: s,
-                value: s ? c : d,
+                isMulti: p,
+                value: p ? s : d,
                 onChange: x,
                 filterOption: D,
                 placeholder: k,
                 classNames: {
-                  menuList: () => "nowheel",
-                  control: () => "!min-h-8 !text-sm"
+                  menuList: () => "nowheel"
                 },
                 components: {
-                  DropdownIndicator: H,
+                  DropdownIndicator: E,
                   IndicatorSeparator: () => null
                 }
               }

package/dist/components/forms/creatable-select/CreatableSelect.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CreatableSelect.es.js","sources":["../../../../src/components/forms/creatable-select/CreatableSelect.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport cn from \"classnames\";\nimport CreatableSelect from \"react-select/creatable\";\nimport { CancelRounded, ChevronLeftRounded } from \"@mui/icons-material\";\nimport { Tooltip } from \"antd\";\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { useState, type ComponentProps } from \"react\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { useIsDarkMode } from \"../../../hooks/useIsDarkMode\";\n\n/\n Option type for the CreatableSelect component\n /\nexport interface SelectOption {\n /* The value of the option /\n value: string \| number;\n /* The label displayed for the option /\n label: string;\n /* Whether the option is disabled /\n isDisabled?: boolean;\n /* Additional data for the option /\n data?: Record<string, unknown>;\n}\n\n/\n Props for the CreatableSelectField component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TProps = {\n /* Unique identifier for the select /\n id: string;\n /* Label text to display above the select /\n label: string;\n /* Placeholder text for the select /\n placeholder?: string;\n /* Current value for single select /\n value?: any;\n /* Callback function called when selection changes /\n onChange(data: any): void;\n /* Error message to display below the select /\n errorMessage?: string;\n /* Array of available options /\n selectOptions: any[];\n /* Whether the select is in loading state /\n loading?: boolean;\n /* Whether multiple selections are allowed /\n multiSelect?: boolean;\n /* Current values for multi select /\n selectedValues?: any[];\n /* Custom filter function for options /\n filterOption?: any;\n /* Whether to preserve original case in the label /\n originalCase?: boolean;\n /* Whether the select is disabled /\n disabled?: boolean;\n /* Whether the select is clearable /\n isClearable?: boolean;\n /* Whether the field is required /\n required?: boolean;\n /* Tags/labels to display next to the label /\n tags?: (string \| LabelType)[];\n /* Tooltip text for the help icon /\n tooltip?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n};\n\n// Export type alias for backward compatibility\nexport type CreatableSelectProps = TProps & ComponentProps<typeof CreatableSelect>;\n\n/\n A creatable select component with label, validation, and styling support.\n * Features dark mode support, accessibility enhancements, and comprehensive prop support.\n * Built on top of react-select/creatable for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * CreatableSelectField component.\n \n @example\n * ```tsx\n * <CreatableSelectField\n * id=\"tags\"\n * label=\"Tags\"\n * selectOptions={tagOptions}\n * value={selectedTag}\n * onChange={(newValue) => setSelectedTag(newValue)}\n * placeholder=\"Select or create tags...\"\n * multiSelect\n * />\n * ```\n */\nexport const CreatableSelectField = ({\n id,\n label,\n errorMessage,\n selectOptions,\n loading,\n isClearable,\n multiSelect,\n selectedValues,\n disabled,\n required,\n value,\n className,\n tooltip,\n tags,\n originalCase = false,\n onChange,\n filterOption,\n placeholder,\n ...props\n}: TProps & ComponentProps<typeof CreatableSelect>) => {\n const isDarkMode = useIsDarkMode();\n const [isHovered, setIsHovered] = useState(false);\n\n const handleChange = (newValue: any, _actionMeta?: any) => {\n // Call the original onChange handler\n if (onChange) {\n onChange(newValue);\n }\n\n // Dispatch pilot-change event for recording\n const containerElement = document.getElementById(id);\n if (containerElement) {\n const pilotChangeEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: newValue,\n type: \"change\",\n },\n });\n containerElement.dispatchEvent(pilotChangeEvent);\n }\n };\n\n const styleProps = {\n control: (baseStyles: any, state: any) => ({\n ...baseStyles,\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : state.isFocused\n ? \"var(--color-primary-600)\"\n : isDarkMode ? \"#434343\" : \"#d9d9d9\",\n backgroundColor: isDarkMode\n ? \"#141414\"\n : state.isDisabled ? \"#f5f5f5\" : \"#fff\",\n borderRadius: \"6px\",\n padding: \"0 4px 0 12px\",\n opacity: state.isDisabled ? 0.6 : 1,\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n boxShadow: state.isFocused\n ? isDarkMode\n ? \"0 0 0 1.5px var(--color-primary-950)\"\n : \"0 0 0 1.5px var(--color-primary-100)\"\n : \"none\",\n \"&:hover\": {\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : \"var(--color-primary-600)\",\n },\n }),\n valueContainer: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n padding: 0,\n }),\n input: (baseStyles: any) => ({\n ...baseStyles,\n margin: \"0\",\n padding: \"0\",\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"inherit\",\n }),\n indicatorsContainer: (baseStyles: any) => ({\n ...baseStyles,\n padding: 0,\n }),\n option: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"22px\",\n padding: \"5px 12px\",\n margin: 0,\n backgroundColor: state.isSelected\n ? isDarkMode ? \"var(--color-primary-975)\" : \"var(--color-primary-50)\"\n : state.isFocused\n ? isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\"\n : isDarkMode ? \"#141414\" : \"#fff\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode\n ? state.isSelected\n ? \"var(--color-primary-600)\"\n : \"rgba(255,255,255,0.85)\"\n : \"rgba(0,0,0,0.88)\",\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n opacity: state.isDisabled ? 0.6 : 1,\n \"&:hover\": {\n backgroundColor: state.isDisabled\n ? isDarkMode ? \"#141414\" : \"#fff\"\n : isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\",\n },\n \"&:active\": {\n backgroundColor: isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-50)\",\n },\n }),\n singleValue: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"20px\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode ? \"rgba(255,255,255,0.85)\" : \"rgba(0,0,0,0.88)\",\n }),\n placeholder: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n whiteSpace: \"nowrap\" as const,\n textOverflow: \"ellipsis\",\n overflow: \"hidden\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#bfbfbf\",\n }),\n multiValue: (baseStyles: any) => ({\n ...baseStyles,\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.08)\" : \"#f0f5ff\",\n border: isDarkMode ? \"1px solid transparent\" : \"1px solid #adc6ff\",\n borderRadius: \"4px\",\n }),\n multiValueLabel: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n fontSize: \"12px\",\n }),\n multiValueRemove: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n \"&:hover\": {\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.16)\" : \"#e6f4ff\",\n color: isDarkMode ? \"#fff\" : \"var(--color-primary-600)\",\n },\n }),\n menu: (baseStyles: any) => ({\n ...baseStyles,\n zIndex: 5001,\n borderRadius: \"8px\",\n boxShadow: isDarkMode\n ? \"0 6px 16px 0 rgba(0,0,0,0.45)\"\n : \"0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.12), 0 9px 28px 8px rgba(0,0,0,0.05)\",\n backgroundColor: isDarkMode ? \"#141414\" : \"#fff\",\n border: isDarkMode ? \"1px solid #303030\" : \"none\",\n overflow: \"hidden\",\n }),\n menuList: (baseStyles: any) => ({\n ...baseStyles,\n padding: \"0\",\n maxHeight: \"256px\",\n }),\n };\n\n const hasSelectedValues = !!selectedValues?.length;\n const hasValue = !!value;\n const isFieldClearable = isClearable ? hasSelectedValues \|\| hasValue : false;\n const showClearIcon = isHovered && !disabled && isFieldClearable;\n\n const handleClear = (e: React.MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n handleChange(multiSelect ? [] : null);\n };\n\n const DropdownIndicator = () => (\n <div className=\"flex items-center\">\n {showClearIcon ? (\n <CancelRounded\n onClick={handleClear}\n sx={{\n fontSize: \"16px\",\n cursor: \"pointer\",\n color: isDarkMode ? \"rgba(255,255,255,0.45)\" : \"rgba(0,0,0,0.25)\",\n \"&:hover\": {\n color: isDarkMode ? \"rgba(255,255,255,0.65)\" : \"rgba(0,0,0,0.45)\",\n },\n }}\n />\n ) : (\n <ChevronLeftRounded\n className=\"-rotate-90\"\n sx={{\n fontSize: \"18px\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"rgba(0,0,0,0.25)\",\n }}\n />\n )}\n </div>\n );\n\n return (\n <div\n id={id}\n className={cn(\"w-full flex flex-col gap-1\", className)}\n onMouseDown={(e) => e.stopPropagation()}\n role=\"group\"\n aria-labelledby={label ? id + \"Label\" : undefined}\n >\n {label && (\n <label\n id={id + \"Label\"}\n htmlFor=\"text\"\n className={`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${!originalCase ? \"capitalize\" : \"\"}`}\n >\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n <Label labels={tags} />\n {tooltip && (\n <Tooltip placement=\"top\" title={tooltip}>\n <div className=\"cursor-pointer\">\n <HelpIcon className=\"w-icon-sm h-icon-sm\" />\n </div>\n </Tooltip>\n )}\n </label>\n )}\n\n <div\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n <CreatableSelect\n {...props}\n id={\"cm\" + label}\n classNamePrefix=\"lax-select\"\n required={required}\n options={selectOptions}\n isClearable={false}\n isLoading={loading}\n isDisabled={disabled}\n styles={styleProps}\n isMulti={multiSelect}\n value={multiSelect ? selectedValues : value}\n onChange={handleChange}\n filterOption={filterOption}\n placeholder={placeholder}\n classNames={{\n menuList: () => \"nowheel\",\n control: ()=> \"!min-h-8 !text-sm\"\n }}\n components={{\n DropdownIndicator,\n IndicatorSeparator: () => null,\n }}\n />\n </div>\n {errorMessage && (\n <Typography\n className=\"text-error-500\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n </div>\n );\n};\n\nCreatableSelectField.displayName = \"CreatableSelectField\";\n"],"names":["CreatableSelectField","id","label","errorMessage","selectOptions","loading","isClearable","multiSelect","selectedValues","disabled","required","value","className","tooltip","tags","originalCase","onChange","filterOption","placeholder","props","isDarkMode","useIsDarkMode","isHovered","setIsHovered","useState","handleChange","newValue","_actionMeta","containerElement","pilotChangeEvent","styleProps","baseStyles","state","hasSelectedValues","showClearIcon","handleClear","e","DropdownIndicator","jsx","CancelRounded","ChevronLeftRounded","jsxs","cn","InputLabel","Label","Tooltip","HelpIcon","CreatableSelect","Typography"],"mappings":";;;;;;;;;;;AA8FO,MAAMA,IAAuB,CAAC;AAAA,EACnC,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,MAAuD;AACrD,QAAMC,IAAaC,EAAA,GACb,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAE1CC,IAAe,CAACC,GAAeC,MAAsB;AAEzD,IAAIX,KACFA,EAASU,CAAQ;AAInB,UAAME,IAAmB,SAAS,eAAe3B,CAAE;AACnD,QAAI2B,GAAkB;AACpB,YAAMC,IAAmB,IAAI,YAAY,gBAAgB;AAAA,QACvD,SAAS;AAAA,QACT,QAAQ;AAAA,UACN,UAAU,IAAI5B,CAAE;AAAA,UAChB,OAAOyB;AAAA,UACP,MAAM;AAAA,QAAA;AAAA,MACR,CACD;AACD,MAAAE,EAAiB,cAAcC,CAAgB;AAAA,IACjD;AAAA,EACF,GAEMC,IAAa;AAAA,IACjB,SAAS,CAACC,GAAiBC,OAAgB;AAAA,MACzC,GAAGD;AAAA,MACH,aACE5B,KAAgBO,IACZU,IAAa,YAAY,YACzBY,EAAM,YACJ,6BACAZ,IAAa,YAAY;AAAA,MACjC,iBAAiBA,IACb,YACAY,EAAM,aAAa,YAAY;AAAA,MACnC,cAAc;AAAA,MACd,SAAS;AAAA,MACT,SAASA,EAAM,aAAa,MAAM;AAAA,MAClC,QAAQA,EAAM,aAAa,gBAAgB;AAAA,MAC3C,WAAWA,EAAM,YACbZ,IACE,yCACA,yCACF;AAAA,MACJ,WAAW;AAAA,QACT,aACEjB,KAAgBO,IACZU,IAAa,YAAY,YACzB;AAAA,MAAA;AAAA,IACR;AAAA,IAEF,gBAAgB,CAACW,OAAqB;AAAA,MACpC,GAAGA;AAAA,MACH,UAAU;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,IAEX,OAAO,CAACA,OAAqB;AAAA,MAC3B,GAAGA;AAAA,MACH,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,OAAOX,IAAa,2BAA2B;AAAA,IAAA;AAAA,IAEjD,qBAAqB,CAACW,OAAqB;AAAA,MACzC,GAAGA;AAAA,MACH,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ,CAACA,GAAiBC,OAAgB;AAAA,MACxC,GAAGD;AAAA,MACH,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,iBAAiBC,EAAM,aACnBZ,IAAa,6BAA6B,4BAC1CY,EAAM,YACJZ,IAAa,6BAA6B,6BAC5CA,IAAa,YAAY;AAAA,MAC7B,OAAOY,EAAM,aACTZ,IAAa,2BAA2B,YACxCA,IACEY,EAAM,aACJ,6BACA,2BACF;AAAA,MACN,QAAQA,EAAM,aAAa,gBAAgB;AAAA,MAC3C,SAASA,EAAM,aAAa,MAAM;AAAA,MAClC,WAAW;AAAA,QACT,iBAAiBA,EAAM,aACnBZ,IAAa,YAAY,SACzBA,IAAa,6BAA6B;AAAA,MAAA;AAAA,MAEhD,YAAY;AAAA,QACV,iBAAiBA,IAAa,6BAA6B;AAAA,MAAA;AAAA,IAC7D;AAAA,IAEF,aAAa,CAACW,GAAiBC,OAAgB;AAAA,MAC7C,GAAGD;AAAA,MACH,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,OAAOC,EAAM,aACTZ,IAAa,2BAA2B,YACxCA,IAAa,2BAA2B;AAAA,IAAA;AAAA,IAE9C,aAAa,CAACW,OAAqB;AAAA,MACjC,GAAGA;AAAA,MACH,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,cAAc;AAAA,MACd,UAAU;AAAA,MACV,OAAOX,IAAa,2BAA2B;AAAA,IAAA;AAAA,IAEjD,YAAY,CAACW,OAAqB;AAAA,MAChC,GAAGA;AAAA,MACH,iBAAiBX,IAAa,2BAA2B;AAAA,MACzD,QAAQA,IAAa,0BAA0B;AAAA,MAC/C,cAAc;AAAA,IAAA;AAAA,IAEhB,iBAAiB,CAACW,OAAqB;AAAA,MACrC,GAAGA;AAAA,MACH,OAAOX,IAAa,2BAA2B;AAAA,MAC/C,UAAU;AAAA,IAAA;AAAA,IAEZ,kBAAkB,CAACW,OAAqB;AAAA,MACtC,GAAGA;AAAA,MACH,OAAOX,IAAa,2BAA2B;AAAA,MAC/C,WAAW;AAAA,QACT,iBAAiBA,IAAa,2BAA2B;AAAA,QACzD,OAAOA,IAAa,SAAS;AAAA,MAAA;AAAA,IAC/B;AAAA,IAEF,MAAM,CAACW,OAAqB;AAAA,MAC1B,GAAGA;AAAA,MACH,QAAQ;AAAA,MACR,cAAc;AAAA,MACd,WAAWX,IACP,kCACA;AAAA,MACJ,iBAAiBA,IAAa,YAAY;AAAA,MAC1C,QAAQA,IAAa,sBAAsB;AAAA,MAC3C,UAAU;AAAA,IAAA;AAAA,IAEZ,UAAU,CAACW,OAAqB;AAAA,MAC9B,GAAGA;AAAA,MACH,SAAS;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,EACb,GAGIE,IAAoB,CAAC,CAACzB,GAAgB,QAGtC0B,IAAgBZ,KAAa,CAACb,MADXH,IAAc2B,KADtB,CAAC,CAACtB,IACoD,KAGjEwB,IAAc,CAACC,MAAwB;AAC3C,IAAAA,EAAE,gBAAA,GACFA,EAAE,eAAA,GACFX,EAAalB,IAAc,CAAA,IAAK,IAAI;AAAA,EACtC,GAEM8B,IAAoB,MACxB,gBAAAC,EAAC,OAAA,EAAI,WAAU,qBACZ,UAAAJ,IACC,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAASJ;AAAA,MACT,IAAI;AAAA,QACF,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,OAAOf,IAAa,2BAA2B;AAAA,QAC/C,WAAW;AAAA,UACT,OAAOA,IAAa,2BAA2B;AAAA,QAAA;AAAA,MACjD;AAAA,IACF;AAAA,EAAA,IAGF,gBAAAkB;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,IAAI;AAAA,QACF,UAAU;AAAA,QACV,OAAOpB,IAAa,2BAA2B;AAAA,MAAA;AAAA,IACjD;AAAA,EAAA,GAGN;AAGF,SACE,gBAAAqB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAAxC;AAAA,MACA,WAAWyC,EAAG,8BAA8B9B,CAAS;AAAA,MACrD,aAAa,CAACwB,MAAMA,EAAE,gBAAA;AAAA,MACtB,MAAK;AAAA,MACL,mBAAiBlC,IAAQD,IAAK,UAAU;AAAA,MAEvC,UAAA;AAAA,QAAAC,KACC,gBAAAuC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAIxC,IAAK;AAAA,YACT,SAAQ;AAAA,YACR,WAAW,wFAAyFc,IAA8B,KAAf,YAAiB;AAAA,YAEpI,UAAA;AAAA,cAAA,gBAAAuB,EAACK,KAAW,OAAOzC,KAAS,IAAI,UAAUQ,KAAY,IAAO;AAAA,cAC7D,gBAAA4B,EAACM,GAAA,EAAM,QAAQ9B,EAAA,CAAM;AAAA,cACpBD,KACC,gBAAAyB,EAACO,GAAA,EAAQ,WAAU,OAAM,OAAOhC,GAC9B,UAAA,gBAAAyB,EAAC,OAAA,EAAI,WAAU,kBACb,UAAA,gBAAAA,EAACQ,GAAA,EAAS,WAAU,uBAAsB,GAC5C,EAAA,CACF;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAKN,gBAAAR;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,cAAc,MAAMf,EAAa,EAAI;AAAA,YACrC,cAAc,MAAMA,EAAa,EAAK;AAAA,YAEtC,UAAA,gBAAAe;AAAA,cAACS;AAAA,cAAA;AAAA,gBACE,GAAG5B;AAAA,gBACJ,IAAI,OAAOjB;AAAA,gBACX,iBAAgB;AAAA,gBAChB,UAAAQ;AAAA,gBACA,SAASN;AAAA,gBACT,aAAa;AAAA,gBACb,WAAWC;AAAA,gBACX,YAAYI;AAAA,gBACZ,QAAQqB;AAAA,gBACR,SAASvB;AAAA,gBACT,OAAOA,IAAcC,IAAiBG;AAAA,gBACtC,UAAUc;AAAA,gBACV,cAAAR;AAAA,gBACA,aAAAC;AAAA,gBACA,YAAY;AAAA,kBACV,UAAU,MAAM;AAAA,kBAChB,SAAS,MAAK;AAAA,gBAAA;AAAA,gBAEhB,YAAY;AAAA,kBACV,mBAAAmB;AAAA,kBACA,oBAAoB,MAAM;AAAA,gBAAA;AAAA,cAC5B;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,QAEDlC,KACC,gBAAAmC;AAAA,UAACU;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,YAAW;AAAA,YACX,MAAK;AAAA,YACL,SAAQ;AAAA,YAEP,UAAA7C;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAIR;AAEAH,EAAqB,cAAc;"}
1	+ {"version":3,"file":"CreatableSelect.es.js","sources":["../../../../src/components/forms/creatable-select/CreatableSelect.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport cn from \"classnames\";\nimport CreatableSelect from \"react-select/creatable\";\nimport { CancelRounded, ChevronLeftRounded } from \"@mui/icons-material\";\nimport { Tooltip } from \"antd\";\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { useState, type ComponentProps } from \"react\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { useIsDarkMode } from \"../../../hooks/useIsDarkMode\";\n\n/\n Option type for the CreatableSelect component\n /\nexport interface SelectOption {\n /* The value of the option /\n value: string \| number;\n /* The label displayed for the option /\n label: string;\n /* Whether the option is disabled /\n isDisabled?: boolean;\n /* Additional data for the option /\n data?: Record<string, unknown>;\n}\n\n/\n Props for the CreatableSelectField component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TProps = {\n /* Unique identifier for the select /\n id: string;\n /* Label text to display above the select /\n label: string;\n /* Placeholder text for the select /\n placeholder?: string;\n /* Current value for single select /\n value?: any;\n /* Callback function called when selection changes /\n onChange(data: any): void;\n /* Error message to display below the select /\n errorMessage?: string;\n /* Array of available options /\n selectOptions: any[];\n /* Whether the select is in loading state /\n loading?: boolean;\n /* Whether multiple selections are allowed /\n multiSelect?: boolean;\n /* Current values for multi select /\n selectedValues?: any[];\n /* Custom filter function for options /\n filterOption?: any;\n /* Whether to preserve original case in the label /\n originalCase?: boolean;\n /* Whether the select is disabled /\n disabled?: boolean;\n /* Whether the select is clearable /\n isClearable?: boolean;\n /* Whether the field is required /\n required?: boolean;\n /* Tags/labels to display next to the label /\n tags?: (string \| LabelType)[];\n /* Tooltip text for the help icon /\n tooltip?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n};\n\n// Export type alias for backward compatibility\nexport type CreatableSelectProps = TProps & ComponentProps<typeof CreatableSelect>;\n\n/\n A creatable select component with label, validation, and styling support.\n * Features dark mode support, accessibility enhancements, and comprehensive prop support.\n * Built on top of react-select/creatable for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * CreatableSelectField component.\n \n @example\n * ```tsx\n * <CreatableSelectField\n * id=\"tags\"\n * label=\"Tags\"\n * selectOptions={tagOptions}\n * value={selectedTag}\n * onChange={(newValue) => setSelectedTag(newValue)}\n * placeholder=\"Select or create tags...\"\n * multiSelect\n * />\n * ```\n */\nexport const CreatableSelectField = ({\n id,\n label,\n errorMessage,\n selectOptions,\n loading,\n isClearable,\n multiSelect,\n selectedValues,\n disabled,\n required,\n value,\n className,\n tooltip,\n tags,\n originalCase = false,\n onChange,\n filterOption,\n placeholder,\n ...props\n}: TProps & ComponentProps<typeof CreatableSelect>) => {\n const isDarkMode = useIsDarkMode();\n const [isHovered, setIsHovered] = useState(false);\n\n const handleChange = (newValue: any, _actionMeta?: any) => {\n // Call the original onChange handler\n if (onChange) {\n onChange(newValue);\n }\n\n // Dispatch pilot-change event for recording\n const containerElement = document.getElementById(id);\n if (containerElement) {\n const pilotChangeEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: newValue,\n type: \"change\",\n },\n });\n containerElement.dispatchEvent(pilotChangeEvent);\n }\n };\n\n const styleProps = {\n control: (baseStyles: any, state: any) => ({\n ...baseStyles,\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : state.isFocused\n ? \"var(--color-primary-600)\"\n : isDarkMode ? \"#434343\" : \"#d9d9d9\",\n backgroundColor: isDarkMode\n ? \"#141414\"\n : state.isDisabled ? \"#f5f5f5\" : \"#fff\",\n borderRadius: \"6px\",\n minHeight: \"32px\",\n fontSize: \"14px\",\n padding: \"0 4px 0 12px\",\n opacity: state.isDisabled ? 0.6 : 1,\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n boxShadow: state.isFocused\n ? isDarkMode\n ? \"0 0 0 1.5px var(--color-primary-950)\"\n : \"0 0 0 1.5px var(--color-primary-100)\"\n : \"none\",\n \"&:hover\": {\n borderColor:\n errorMessage && required\n ? isDarkMode ? \"#F04438\" : \"#fda49b\"\n : \"var(--color-primary-600)\",\n },\n }),\n valueContainer: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n padding: 0,\n }),\n input: (baseStyles: any) => ({\n ...baseStyles,\n margin: \"0\",\n padding: \"0\",\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"inherit\",\n }),\n indicatorsContainer: (baseStyles: any) => ({\n ...baseStyles,\n padding: 0,\n }),\n option: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"22px\",\n padding: \"5px 12px\",\n margin: 0,\n backgroundColor: state.isSelected\n ? isDarkMode ? \"var(--color-primary-975)\" : \"var(--color-primary-50)\"\n : state.isFocused\n ? isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\"\n : isDarkMode ? \"#141414\" : \"#fff\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode\n ? state.isSelected\n ? \"var(--color-primary-600)\"\n : \"rgba(255,255,255,0.85)\"\n : \"rgba(0,0,0,0.88)\",\n cursor: state.isDisabled ? \"not-allowed\" : \"pointer\",\n opacity: state.isDisabled ? 0.6 : 1,\n \"&:hover\": {\n backgroundColor: state.isDisabled\n ? isDarkMode ? \"#141414\" : \"#fff\"\n : isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-100)\",\n },\n \"&:active\": {\n backgroundColor: isDarkMode ? \"var(--color-primary-950)\" : \"var(--color-primary-50)\",\n },\n }),\n singleValue: (baseStyles: any, state: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n lineHeight: \"20px\",\n color: state.isDisabled\n ? isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#a3a3a3\"\n : isDarkMode ? \"rgba(255,255,255,0.85)\" : \"rgba(0,0,0,0.88)\",\n }),\n placeholder: (baseStyles: any) => ({\n ...baseStyles,\n fontSize: \"14px\",\n whiteSpace: \"nowrap\" as const,\n textOverflow: \"ellipsis\",\n overflow: \"hidden\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"#bfbfbf\",\n }),\n multiValue: (baseStyles: any) => ({\n ...baseStyles,\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.08)\" : \"#f0f5ff\",\n border: isDarkMode ? \"1px solid transparent\" : \"1px solid #adc6ff\",\n borderRadius: \"4px\",\n }),\n multiValueLabel: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n fontSize: \"12px\",\n }),\n multiValueRemove: (baseStyles: any) => ({\n ...baseStyles,\n color: isDarkMode ? \"rgba(255,255,255,0.85)\" : \"var(--color-primary-600)\",\n \"&:hover\": {\n backgroundColor: isDarkMode ? \"rgba(255,255,255,0.16)\" : \"#e6f4ff\",\n color: isDarkMode ? \"#fff\" : \"var(--color-primary-600)\",\n },\n }),\n menu: (baseStyles: any) => ({\n ...baseStyles,\n zIndex: 5001,\n borderRadius: \"8px\",\n boxShadow: isDarkMode\n ? \"0 6px 16px 0 rgba(0,0,0,0.45)\"\n : \"0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.12), 0 9px 28px 8px rgba(0,0,0,0.05)\",\n backgroundColor: isDarkMode ? \"#141414\" : \"#fff\",\n border: isDarkMode ? \"1px solid #303030\" : \"none\",\n overflow: \"hidden\",\n }),\n menuList: (baseStyles: any) => ({\n ...baseStyles,\n padding: \"0\",\n maxHeight: \"256px\",\n }),\n };\n\n const hasSelectedValues = !!selectedValues?.length;\n const hasValue = !!value;\n const isFieldClearable = isClearable ? hasSelectedValues \|\| hasValue : false;\n const showClearIcon = isHovered && !disabled && isFieldClearable;\n\n const handleClear = (e: React.MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n handleChange(multiSelect ? [] : null);\n };\n\n const DropdownIndicator = () => (\n <div className=\"flex items-center\">\n {showClearIcon ? (\n <CancelRounded\n onClick={handleClear}\n sx={{\n fontSize: \"16px\",\n cursor: \"pointer\",\n color: isDarkMode ? \"rgba(255,255,255,0.45)\" : \"rgba(0,0,0,0.25)\",\n \"&:hover\": {\n color: isDarkMode ? \"rgba(255,255,255,0.65)\" : \"rgba(0,0,0,0.45)\",\n },\n }}\n />\n ) : (\n <ChevronLeftRounded\n className=\"-rotate-90\"\n sx={{\n fontSize: \"18px\",\n color: isDarkMode ? \"rgba(255,255,255,0.25)\" : \"rgba(0,0,0,0.25)\",\n }}\n />\n )}\n </div>\n );\n\n return (\n <div\n id={id}\n className={cn(\"w-full flex flex-col gap-1\", className)}\n onMouseDown={(e) => e.stopPropagation()}\n role=\"group\"\n aria-labelledby={label ? id + \"Label\" : undefined}\n >\n {label && (\n <label\n id={id + \"Label\"}\n htmlFor=\"text\"\n className={`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${!originalCase ? \"capitalize\" : \"\"}`}\n >\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n <Label labels={tags} />\n {tooltip && (\n <Tooltip placement=\"top\" title={tooltip}>\n <div className=\"cursor-pointer\">\n <HelpIcon />\n </div>\n </Tooltip>\n )}\n </label>\n )}\n\n <div\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n <CreatableSelect\n {...props}\n id={\"cm\" + label}\n classNamePrefix=\"lax-select\"\n required={required}\n options={selectOptions}\n isClearable={false}\n isLoading={loading}\n isDisabled={disabled}\n styles={styleProps}\n isMulti={multiSelect}\n value={multiSelect ? selectedValues : value}\n onChange={handleChange}\n filterOption={filterOption}\n placeholder={placeholder}\n classNames={{\n menuList: () => \"nowheel\",\n }}\n components={{\n DropdownIndicator,\n IndicatorSeparator: () => null,\n }}\n />\n </div>\n {errorMessage && (\n <Typography\n className=\"text-error-500\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n </div>\n );\n};\n\nCreatableSelectField.displayName = \"CreatableSelectField\";\n"],"names":["CreatableSelectField","id","label","errorMessage","selectOptions","loading","isClearable","multiSelect","selectedValues","disabled","required","value","className","tooltip","tags","originalCase","onChange","filterOption","placeholder","props","isDarkMode","useIsDarkMode","isHovered","setIsHovered","useState","handleChange","newValue","_actionMeta","containerElement","pilotChangeEvent","styleProps","baseStyles","state","hasSelectedValues","showClearIcon","handleClear","e","DropdownIndicator","jsx","CancelRounded","ChevronLeftRounded","jsxs","cn","InputLabel","Label","Tooltip","HelpIcon","CreatableSelect","Typography"],"mappings":"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"}

package/dist/components/forms/currency-input/CurrencyInputField.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../../../_virtual/index.cjs.js"),l=require("react"),M=require("antd"),ke=require("react-i18next"),Se=require("../../data-display/typography/Typography.cjs.js"),je=require("../../data-display/label/Label.cjs.js"),Q=require("./currency.constant.cjs.js"),X=require("@mui/icons-material"),Ee=require("../../icons/AIExtractedIndicator.cjs.js"),Ce=require("../../icons/AIStarIcon.cjs.js"),we=require("../../icons/HelpIcon.cjs.js"),Z=require("../../tooltip/Tooltip.cjs.js"),m=require("../../../utils/confidenceScoreUtils.cjs.js"),Ne=require("../search-bar/SearchBar.cjs.js"),_e=require("../../buttons/option-button/OptionButton.cjs.js"),T=require("../../../utils/countryFlags.cjs.js"),Ie=require("../shared/InputLabel.cjs.js"),Be=require("../../../utils/formatters.cjs.js"),V=l.forwardRef(({id:c,label:F,value:o,onChange:B,errorMessage:i,defaultValue:x,required:k=!1,isRequiredConditional:G=!1,tags:ee,className:re,originalCase:q=!1,tooltip:A,simpleMode:te=!1,inputFieldClassName:d="",isAiExtracted:ae=!1,confidenceScore:S,confidenceType:f="high",confidenceTooltip:j,sourceMeta:oe=[],onConfidenceScoreClick:ne,isGTN:E=!1,gtnName:le=null,allowMultiCurrency:$=!1,placeholder:se,disabled:ce=!1,currencyCode:u="USD",inputStyle:de,labelClassName:z,isLiveField:ie=!1,onBlur:ue,autoFocus:D=!1,isRecording:L=!1,isPlaying:O=!1,onAddGTNToDocument:C,riskDetails:s,isRiskAnalysisOpen:p=!1,RiskDetailsCard:U,labelExtra:be,inputEmphasis:w="default",...W},H)=>{const{t:me}=ke.useTranslation(),xe=w==="modified"&&!i&&!(p&&s?.color),fe=w==="deleted"&&!i&&!(p&&s?.color),pe=w==="success"&&!i&&!(p&&s?.color),[b,R]=l.useState(!1),[ge,he]=l.useState([]),[N,K]=l.useState(""),[a,P]=l.useState(u||"USD"),[v,_]=l.useState(!1),ve=r=>{if(C){const t={key:le,value:Be.formatCurrency(r,a)};C(t)}},g=r=>{if(r==null)return"";const t=Number(r);return isNaN(t)?r:t?.toLocaleString("en-US",{minimumFractionDigits:2,maximumFractionDigits:2})},I=r=>{const t=r.target.value,h=t===""||t===null||t===void 0?0:Number(t);B(h,a);const y=document.getElementById(c);if(y&&y.setAttribute("data-selected-value",JSON.stringify({value:h,currency_code:a})),y&&(L||O)){const Fe=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${c}`,value:{value:h,currency_code:a},type:"change"}});y.dispatchEvent(Fe)}},J=()=>{R(!0)},Y=()=>{R(!1),(o==null||o==="")&&I({target:{value:"0.00"}}),ue?.()},ye=()=>{const r="pl-11 border h-8 text-sm block w-full p-2.5 font-inter font-medium focus:outline-none focus:ring-0";return i?n(r,"rounded-md border-red-300 bg-white dark:bg-black-600",d):p&&s?.color?n(r,`rounded-md border-${s.color}-300 bg-${s.color}-50`,"text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800",d):fe?n(r,"rounded-lg border border-solid border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] !text-[#475467] focus:border-[var(--Error-200,#FECACA)] focus:shadow-[0_0_0_2px_rgba(254,202,202,0.45)] dark:border-[var(--Error-200,#FECACA)] dark:bg-[var(--Error-50,#FEF2F2)] dark:!text-[#475467] disabled:!opacity-100 disabled:!bg-[var(--Error-50,#FEF2F2)]",d):xe?n(r,"rounded-lg border border-solid border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] text-neutral-900 dark:text-black-100 focus:border-[var(--Warning-200,#FEDF89)] focus:shadow-[0_0_0_2px_rgba(254,223,137,0.45)] dark:border-[var(--Warning-200,#FEDF89)] dark:bg-[var(--Warning-50,#FFFAEB)] disabled:!opacity-100 disabled:!bg-[var(--Warning-50,#FFFAEB)]",d):pe?n(r,"rounded-lg border border-solid border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] !text-[#101828] focus:border-[var(--Success-200,#BBF7D0)] focus:shadow-[0_0_0_2px_rgba(187,247,208,0.45)] dark:border-[var(--Success-200,#BBF7D0)] dark:bg-[var(--Success-50,#F0FDF4)] dark:!text-[#101828] disabled:!opacity-100 disabled:!bg-[var(--Success-50,#F0FDF4)]",d):n(r,"rounded-lg border-gray-300 dark:border-black-600 bg-white dark:bg-black-600 text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]",d)};return l.useEffect(()=>{u&&P(u)},[u]),l.useEffect(()=>{if(a){const r=o===""||o===null||o===void 0?0:Number(o);u!==a&&B(r,a);const t=document.getElementById(c);if(t&&(t.setAttribute("data-selected-value",JSON.stringify({value:r,currency_code:a})),L||O)){const h=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${c}`,value:{value:r,currency_code:a},type:"change"}});t.dispatchEvent(h)}}},[a]),l.useEffect(()=>{const r=Q.CURRENCIES.filter(t=>(t.value+" - "+t.label).toLowerCase().includes(N.toLowerCase())).map(t=>({label:e.jsx(_e.OptionButton,{text:`${t.value} - ${t.label}`,icon:T.getFlagComponent(t.value),showTick:a===t.value,onClick:()=>P(t.value),className:"text-black-900 dark:text-white"}),key:t.value}));he(r)},[N,a]),l.useEffect(()=>{K("")},[a]),te?e.jsxs("label",{id:c,className:`mb-1 text-xs font-medium text-gray-600 h-full inline-flex items-center gap-1 ${q?"":"capitalize"} ${z||""}`,children:[e.jsx("span",{className:"absolute inset-y-0 left-1 top-0.5 flex items-center pl-3",children:"$"}),e.jsx("input",{...W,ref:H,type:b?"number":"text",required:k,className:n(d,"pl-8 h-8"),onChange:I,min:0,onFocus:J,onBlur:Y,value:b?o:g(o),...x&&!o?{defaultValue:b?x:g(x)}:{},id:c||F,autoFocus:D})]}):e.jsxs("div",{className:n("flex gap-0.5 relative",v&&E?"border rounded-lg border-primary-100 bg-primary-50 p-1":""),onMouseEnter:()=>_(!0),onMouseLeave:()=>_(!1),children:[E&&!v?e.jsx("div",{className:"size-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,e.jsxs("div",{className:n("w-full flex flex-col",re),children:[e.jsx("label",{htmlFor:"text",className:`mb-1 text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${q?"":"uppercase"} ${z||""}`,children:e.jsxs("div",{className:"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1",children:[e.jsxs("div",{className:"inline-flex min-w-0 items-center gap-1 flex-wrap",children:[e.jsx(Ie.InputLabel,{label:F||"",required:k||!1,isRequiredConditional:G||!1}),ie&&e.jsx(X.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),ae&&!m.shouldShowConfidenceScore(S)&&e.jsx(Ee.AIExtractedIndicator,{}),e.jsx(je.Label,{labels:ee}),A&&e.jsx(Z,{placement:"top",title:A,children:e.jsx("div",{className:"cursor-pointer",children:e.jsx(we.HelpIcon,{className:"w-icon-sm h-icon-sm"})})}),be]}),e.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[m.shouldShowConfidenceScore(S)&&f?e.jsx(Z,{placement:"top-end",title:j??"",hideTooltip:j==null,className:"cursor-pointer",children:e.jsxs("div",{className:n("inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5",m.getConfidenceScoreBadgeClass(f)),onClick:()=>ne?.(oe),children:[e.jsx(Ce.AIStarIcon,{size:12,fill:m.getConfidenceScoreBadgeColor(f),fillSecondary:m.getConfidenceScoreBadgeFill(f)}),e.jsxs("span",{className:n("text-xs font-medium leading-4",m.getConfidenceScoreBadgeTextColor(f)),children:[S,"%"]})]})}):null,E&&v&&C?e.jsx("button",{id:"btn-currency-input-add-to-document",className:"cursor-pointer",onClick:()=>ve(g(o)),type:"button",children:e.jsx(M.Tooltip,{placement:"top",title:me("Add to document"),children:e.jsx(X.NoteAddOutlined,{className:"text-primary-600",sx:{fontSize:16}})})}):null]})]})}),e.jsxs("label",{className:"relative block",children:[e.jsx("span",{className:"absolute inset-y-0 left-1 flex items-center pl-3 text-neutral-900 dark:text-white",children:Q.CURRENCY_SYMBOLS[a]}),e.jsx("input",{...W,ref:H,placeholder:se,type:b?"number":"text",required:k,disabled:ce,className:ye(),onChange:I,min:0,onFocus:J,onBlur:Y,value:b?o:g(o),defaultValue:b?x:g(x),id:c||F,style:de,autoComplete:"off",autoFocus:D}),e.jsx("span",{className:`absolute inset-y-0 right-2 flex items-center z-[1000] h-full cursor-pointer dark:text-black-200 ${$?"cursor-pointer":""}`,children:$?e.jsx(M.Dropdown,{menu:{items:[...ge]},trigger:["click"],overlayClassName:"row-option-cell",placement:"bottomRight",overlayStyle:{zIndex:999},getPopupContainer:r=>r.parentElement,popupRender:r=>e.jsxs("div",{className:"[&>*:nth-child(2)]:!shadow-none [&>*:nth-child(2)>*]:!px-2 flex flex-col gap-2 p-2 bg-white dark:bg-black-700 border border-solid border-neutral-200 dark:border-black-600 max-h-[200px] w-[330px] text-ellipsis overflow-y-auto z-[999] rounded-md",children:[e.jsx(Ne.SearchBar,{id:"search-bar-currency-input",value:N,onChange:t=>K(t),className:"mb-2"}),r]}),children:e.jsxs("div",{className:"pl-4 pr-2 py-1.5 text-sm text-gray-700 dark:text-black-200 flex items-center gap-1",children:[T.getFlagComponent(a)," ",a]})}):a})]}),i&&e.jsx(Se.Typography,{className:"text-error-500 mt-1",appearance:"custom",size:"extra-small",variant:"medium",children:i})]}),v&&s&&p&&U&&e.jsx("div",{role:"tooltip",tabIndex:0,className:"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl",onClick:r=>r.stopPropagation(),onMouseDown:r=>r.preventDefault(),onKeyDown:r=>{r.key==="Escape"&&_(!1)},children:e.jsx(U,{riskDetails:s})})]})});V.displayName="CurrencyInputField";exports.CurrencyInputField=V;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../../../_virtual/index.cjs.js"),l=require("react"),M=require("antd"),ke=require("react-i18next"),Se=require("../../data-display/typography/Typography.cjs.js"),je=require("../../data-display/label/Label.cjs.js"),Q=require("./currency.constant.cjs.js"),X=require("@mui/icons-material"),Ee=require("../../icons/AIExtractedIndicator.cjs.js"),Ce=require("../../icons/AIStarIcon.cjs.js"),we=require("../../icons/HelpIcon.cjs.js"),Z=require("../../tooltip/Tooltip.cjs.js"),x=require("../../../utils/confidenceScoreUtils.cjs.js"),Ne=require("../search-bar/SearchBar.cjs.js"),_e=require("../../buttons/option-button/OptionButton.cjs.js"),T=require("../../../utils/countryFlags.cjs.js"),Ie=require("../shared/InputLabel.cjs.js"),Be=require("../../../utils/formatters.cjs.js"),V=l.forwardRef(({id:c,label:F,value:o,onChange:B,errorMessage:i,defaultValue:m,required:k=!1,isRequiredConditional:G=!1,tags:ee,className:re,originalCase:q=!1,tooltip:A,simpleMode:te=!1,inputFieldClassName:d="",isAiExtracted:ae=!1,confidenceScore:S,confidenceType:f="high",confidenceTooltip:j,sourceMeta:oe=[],onConfidenceScoreClick:ne,isGTN:E=!1,gtnName:le=null,allowMultiCurrency:$=!1,placeholder:se,disabled:ce=!1,currencyCode:u="USD",inputStyle:de,labelClassName:z,isLiveField:ie=!1,onBlur:ue,autoFocus:D=!1,isRecording:L=!1,isPlaying:O=!1,onAddGTNToDocument:C,riskDetails:s,isRiskAnalysisOpen:p=!1,RiskDetailsCard:U,labelExtra:be,inputEmphasis:w="default",...W},H)=>{const{t:xe}=ke.useTranslation(),me=w==="modified"&&!i&&!(p&&s?.color),fe=w==="deleted"&&!i&&!(p&&s?.color),pe=w==="success"&&!i&&!(p&&s?.color),[b,R]=l.useState(!1),[ge,he]=l.useState([]),[N,K]=l.useState(""),[a,P]=l.useState(u||"USD"),[v,_]=l.useState(!1),ve=r=>{if(C){const t={key:le,value:Be.formatCurrency(r,a)};C(t)}},g=r=>{if(r==null)return"";const t=Number(r);return isNaN(t)?r:t?.toLocaleString("en-US",{minimumFractionDigits:2,maximumFractionDigits:2})},I=r=>{const t=r.target.value,h=t===""||t===null||t===void 0?0:Number(t);B(h,a);const y=document.getElementById(c);if(y&&y.setAttribute("data-selected-value",JSON.stringify({value:h,currency_code:a})),y&&(L||O)){const Fe=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${c}`,value:{value:h,currency_code:a},type:"change"}});y.dispatchEvent(Fe)}},Y=()=>{R(!0)},J=()=>{R(!1),(o==null||o==="")&&I({target:{value:"0.00"}}),ue?.()},ye=()=>{const r="pl-11 border h-[32px] text-sm block w-full p-2.5 font-inter font-medium focus:outline-none focus:ring-0";return i?n(r,"rounded-md border-red-300 bg-white dark:bg-black-600",d):p&&s?.color?n(r,`rounded-md border-${s.color}-300 bg-${s.color}-50`,"text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800",d):fe?n(r,"rounded-lg border border-solid border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] !text-[#475467] focus:border-[var(--Error-200,#FECACA)] focus:shadow-[0_0_0_2px_rgba(254,202,202,0.45)] dark:border-[var(--Error-200,#FECACA)] dark:bg-[var(--Error-50,#FEF2F2)] dark:!text-[#475467] disabled:!opacity-100 disabled:!bg-[var(--Error-50,#FEF2F2)]",d):me?n(r,"rounded-lg border border-solid border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] text-neutral-900 dark:text-black-100 focus:border-[var(--Warning-200,#FEDF89)] focus:shadow-[0_0_0_2px_rgba(254,223,137,0.45)] dark:border-[var(--Warning-200,#FEDF89)] dark:bg-[var(--Warning-50,#FFFAEB)] disabled:!opacity-100 disabled:!bg-[var(--Warning-50,#FFFAEB)]",d):pe?n(r,"rounded-lg border border-solid border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] !text-[#101828] focus:border-[var(--Success-200,#BBF7D0)] focus:shadow-[0_0_0_2px_rgba(187,247,208,0.45)] dark:border-[var(--Success-200,#BBF7D0)] dark:bg-[var(--Success-50,#F0FDF4)] dark:!text-[#101828] disabled:!opacity-100 disabled:!bg-[var(--Success-50,#F0FDF4)]",d):n(r,"rounded-lg border-gray-300 dark:border-black-600 bg-white dark:bg-black-600 text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]",d)};return l.useEffect(()=>{u&&P(u)},[u]),l.useEffect(()=>{if(a){const r=o===""||o===null||o===void 0?0:Number(o);u!==a&&B(r,a);const t=document.getElementById(c);if(t&&(t.setAttribute("data-selected-value",JSON.stringify({value:r,currency_code:a})),L||O)){const h=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${c}`,value:{value:r,currency_code:a},type:"change"}});t.dispatchEvent(h)}}},[a]),l.useEffect(()=>{const r=Q.CURRENCIES.filter(t=>(t.value+" - "+t.label).toLowerCase().includes(N.toLowerCase())).map(t=>({label:e.jsx(_e.OptionButton,{text:`${t.value} - ${t.label}`,icon:T.getFlagComponent(t.value),showTick:a===t.value,onClick:()=>P(t.value),className:"text-black-900 dark:text-white"}),key:t.value}));he(r)},[N,a]),l.useEffect(()=>{K("")},[a]),te?e.jsxs("label",{id:c,className:`mb-1 text-xs font-medium text-gray-600 h-full inline-flex items-center gap-1 ${q?"":"capitalize"} ${z||""}`,children:[e.jsx("span",{className:"absolute inset-y-0 left-1 top-0.5 flex items-center pl-3",children:"$"}),e.jsx("input",{...W,ref:H,type:b?"number":"text",required:k,className:n(d,"pl-8 h-[32px]"),onChange:I,min:0,onFocus:Y,onBlur:J,value:b?o:g(o),...m&&!o?{defaultValue:b?m:g(m)}:{},id:c||F,autoFocus:D})]}):e.jsxs("div",{className:n("flex gap-0.5 relative",v&&E?"border rounded-lg border-primary-100 bg-primary-50 p-1":""),onMouseEnter:()=>_(!0),onMouseLeave:()=>_(!1),children:[E&&!v?e.jsx("div",{className:"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,e.jsxs("div",{className:n("w-full flex flex-col",re),children:[e.jsx("label",{htmlFor:"text",className:`mb-1 text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${q?"":"uppercase"} ${z||""}`,children:e.jsxs("div",{className:"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1",children:[e.jsxs("div",{className:"inline-flex min-w-0 items-center gap-1 flex-wrap",children:[e.jsx(Ie.InputLabel,{label:F||"",required:k||!1,isRequiredConditional:G||!1}),ie&&e.jsx(X.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),ae&&!x.shouldShowConfidenceScore(S)&&e.jsx(Ee.AIExtractedIndicator,{}),e.jsx(je.Label,{labels:ee}),A&&e.jsx(Z,{placement:"top",title:A,children:e.jsx("div",{className:"cursor-pointer",children:e.jsx(we.HelpIcon,{})})}),be]}),e.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[x.shouldShowConfidenceScore(S)&&f?e.jsx(Z,{placement:"top-end",title:j??"",hideTooltip:j==null,className:"cursor-pointer",children:e.jsxs("div",{className:n("inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5",x.getConfidenceScoreBadgeClass(f)),onClick:()=>ne?.(oe),children:[e.jsx(Ce.AIStarIcon,{size:12,fill:x.getConfidenceScoreBadgeColor(f),fillSecondary:x.getConfidenceScoreBadgeFill(f)}),e.jsxs("span",{className:n("text-xs font-medium leading-4",x.getConfidenceScoreBadgeTextColor(f)),children:[S,"%"]})]})}):null,E&&v&&C?e.jsx("button",{id:"btn-currency-input-add-to-document",className:"cursor-pointer",onClick:()=>ve(g(o)),type:"button",children:e.jsx(M.Tooltip,{placement:"top",title:xe("Add to document"),children:e.jsx(X.NoteAddOutlined,{className:"text-primary-600",sx:{fontSize:16}})})}):null]})]})}),e.jsxs("label",{className:"relative block",children:[e.jsx("span",{className:"absolute inset-y-0 left-1 flex items-center pl-3 text-neutral-900 dark:text-white",children:Q.CURRENCY_SYMBOLS[a]}),e.jsx("input",{...W,ref:H,placeholder:se,type:b?"number":"text",required:k,disabled:ce,className:ye(),onChange:I,min:0,onFocus:Y,onBlur:J,value:b?o:g(o),defaultValue:b?m:g(m),id:c||F,style:de,autoComplete:"off",autoFocus:D}),e.jsx("span",{className:`absolute inset-y-0 right-2 flex items-center z-[1000px] h-full cursor-pointer dark:text-black-200 ${$?"cursor-pointer":""}`,children:$?e.jsx(M.Dropdown,{menu:{items:[...ge]},trigger:["click"],overlayClassName:"row-option-cell",placement:"bottomRight",overlayStyle:{zIndex:999},getPopupContainer:r=>r.parentElement,popupRender:r=>e.jsxs("div",{style:{maxHeight:"200px",width:"330px",textOverflow:"ellipsis",overflowY:"auto",zIndex:"999px",borderRadius:"6px"},className:"[&>*:nth-child(2)]:!shadow-none [&>*:nth-child(2)>*]:!px-2 flex flex-col gap-2 p-2 bg-white dark:bg-black-700 border border-solid border-neutral-200 dark:border-black-600",children:[e.jsx(Ne.SearchBar,{id:"search-bar-currency-input",value:N,onChange:t=>K(t),className:"mb-2"}),r]}),children:e.jsxs("div",{className:"pl-4 pr-2 py-1.5 text-sm text-gray-700 dark:text-black-200 flex items-center gap-1",children:[T.getFlagComponent(a)," ",a]})}):a})]}),i&&e.jsx(Se.Typography,{className:"text-error-500 mt-1",appearance:"custom",size:"extra-small",variant:"medium",children:i})]}),v&&s&&p&&U&&e.jsx("div",{role:"tooltip",tabIndex:0,className:"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl",onClick:r=>r.stopPropagation(),onMouseDown:r=>r.preventDefault(),onKeyDown:r=>{r.key==="Escape"&&_(!1)},children:e.jsx(U,{riskDetails:s})})]})});V.displayName="CurrencyInputField";exports.CurrencyInputField=V;
 //# sourceMappingURL=CurrencyInputField.cjs.js.map

package/dist/components/forms/currency-input/CurrencyInputField.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CurrencyInputField.cjs.js","sources":["../../../../src/components/forms/currency-input/CurrencyInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useState } from \"react\";\nimport { Dropdown, Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { CURRENCIES, CURRENCY_SYMBOLS } from \"./currency.constant\";\nimport { NoteAddOutlined, BoltOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport {\n getConfidenceScoreBadgeClass,\n getConfidenceScoreBadgeColor,\n getConfidenceScoreBadgeFill,\n getConfidenceScoreBadgeTextColor,\n shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { SearchBar } from \"../search-bar/SearchBar\";\nimport { OptionButton } from \"../../buttons/option-button/OptionButton\";\nimport { getFlagComponent } from \"../../../utils/countryFlags\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { formatCurrency as formatCurrencyUtils } from \"../../../utils/formatters\";\n\n/\n Confidence score type\n /\nexport type ConfidenceScoreType = \"low\" \| \"medium\" \| \"high\";\n\nexport type SourceMetaBBox = {\n b: number;\n l: number;\n r: number;\n t: number;\n};\n\nexport type SourceMetaItem = {\n bbox: SourceMetaBBox;\n confidence_score?: number;\n is_primary?: boolean;\n match_score?: number;\n match_type?: string;\n page_height: number;\n page_width: number;\n source_page: number;\n source_text?: string;\n};\n\n/\n Risk details interface for risk analysis integration\n /\nexport interface RiskDetails {\n color?: string;\n description?: string;\n hexBgColor?: string;\n hexBorderColor?: string;\n [key: string]: any;\n}\n\n/\n Risk details card component props - generic to allow consumer-specific risk types\n /\nexport interface RiskDetailsCardProps<T = any> {\n riskDetails: T;\n maxWidth?: string;\n showAllRisksSuggestions?: boolean;\n}\n\n/\n Props for the CurrencyInputField component\n /\nexport interface CurrencyInputFieldProps {\n /* Unique identifier for the currency input /\n id: string;\n /* Label text to display above the input /\n label?: string;\n /* Current value of the input (string for compatibility) /\n value: string;\n /* Callback function called when value changes /\n onChange: (data: any, currencyCode?: string) => void;\n /* Error message to display below the input /\n errorMessage?: string;\n /* Default value for the input /\n defaultValue?: string;\n /* Whether the field is required /\n required?: boolean;\n /* Whether the required indicator shows as conditional (yellow instead of red) /\n isRequiredConditional?: boolean;\n /* Tags/labels to display next to the label /\n tags?: (string \| LabelType)[];\n /* Additional CSS classes for the wrapper /\n className?: string;\n /* Whether to preserve original case in the label /\n originalCase?: boolean;\n /* Tooltip text for the help icon /\n tooltip?: string;\n /* Whether to use simple mode (inline label style) /\n simpleMode?: boolean;\n /* Additional CSS classes for the input field /\n inputFieldClassName?: string;\n /* Whether the value was AI extracted /\n isAiExtracted?: boolean;\n /* Confidence percentage shown as a badge /\n confidenceScore?: number;\n /* Confidence classification for badge styling /\n confidenceType?: ConfidenceScoreType;\n /* Optional tooltip content for confidence badge /\n confidenceTooltip?: React.ReactNode;\n /* Source meta for confidence score /\n sourceMeta?: SourceMetaItem[];\n /* Handler fired when confidence score badge is clicked /\n onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n /* Whether this is a GTN (Global Term Name) field /\n isGTN?: boolean;\n /* GTN field name for document integration /\n gtnName?: any;\n /* Whether to allow multi-currency selection with dropdown /\n allowMultiCurrency?: boolean;\n /* Placeholder text for the input /\n placeholder?: string;\n /* Whether the input is disabled /\n disabled?: boolean;\n /* Current currency code /\n currencyCode?: string;\n /* Inline styles for the input element /\n inputStyle?: React.CSSProperties;\n /* Additional CSS classes for the label /\n labelClassName?: string;\n /* Whether this is a live field /\n isLiveField?: boolean;\n /* Callback function called when input loses focus /\n onBlur?: () => void;\n /* Whether the input should auto-focus /\n autoFocus?: boolean;\n /* Whether recording is active (for pilot context) /\n isRecording?: boolean;\n /* Whether playback is active (for pilot context) /\n isPlaying?: boolean;\n /* Handler for adding GTN to document /\n onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n /* Risk details data /\n riskDetails?: RiskDetails;\n /* Whether risk analysis is open /\n isRiskAnalysisOpen?: boolean;\n /* Custom risk details card component /\n RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n /* Optional extra content in the label row (e.g. actions, badges) /\n labelExtra?: React.ReactNode;\n /* Input surface style: `'modified'` — Warning colors; `'deleted'` — Error colors, text #475467; `'success'` — Success colors, text #101828. /\n inputEmphasis?: \"default\" \| \"modified\" \| \"deleted\" \| \"success\";\n}\n\n/\n A highly customizable currency input component with label, validation, and styling support.\n * Features currency selection, formatting, validation, GTN integration, risk analysis support,\n * and comprehensive prop support for various use cases.\n \n @example\n * ```tsx\n * <CurrencyInputField\n * id=\"price\"\n * label=\"Price\"\n * value={price}\n * onChange={(value, currency) => setPrice(value)}\n * currencyCode=\"USD\"\n * allowMultiCurrency\n * required\n * />\n * ```\n /\nexport const CurrencyInputField = forwardRef<\n HTMLInputElement,\n CurrencyInputFieldProps\n>(\n (\n {\n id,\n label,\n value,\n onChange,\n errorMessage,\n defaultValue,\n required = false,\n isRequiredConditional = false,\n tags,\n className,\n originalCase = false,\n tooltip,\n simpleMode = false,\n inputFieldClassName = \"\",\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n isGTN = false,\n gtnName = null,\n allowMultiCurrency = false,\n placeholder,\n disabled = false,\n currencyCode = \"USD\",\n inputStyle,\n labelClassName,\n isLiveField = false,\n onBlur: onBlurProp,\n autoFocus = false,\n isRecording = false,\n isPlaying = false,\n onAddGTNToDocument,\n riskDetails,\n isRiskAnalysisOpen = false,\n RiskDetailsCard,\n labelExtra,\n inputEmphasis = \"default\",\n ...props\n },\n ref\n ) => {\n const { t } = useTranslation();\n const emphasisModifiedSkin = inputEmphasis === \"modified\" && !errorMessage && !(isRiskAnalysisOpen && riskDetails?.color);\n const emphasisDeletedSkin = inputEmphasis === \"deleted\" && !errorMessage && !(isRiskAnalysisOpen && riskDetails?.color);\n const emphasisSuccessSkin = inputEmphasis === \"success\" && !errorMessage && !(isRiskAnalysisOpen && riskDetails?.color);\n const [isFocused, setIsFocused] = useState(false);\n const [filteredCurrencyOptions, setFilteredCurrencyOptions] = useState<\n { label: React.ReactNode; key: string }[]\n >([]);\n const [searchKeyForCurrency, setSearchKeyForCurrency] = useState(\"\");\n const [selectedCurrency, setSelectedCurrency] = useState<string>(\n currencyCode ? currencyCode : \"USD\"\n );\n const [isHovered, setIsHovered] = useState(false);\n\n const handleAddGTNToDocument = (_value: string) => {\n if (onAddGTNToDocument) {\n const keyValuePair = {\n key: gtnName,\n value: formatCurrencyUtils(_value, selectedCurrency),\n };\n onAddGTNToDocument(keyValuePair);\n }\n };\n\n const formatCurrency = (targetValue: any): string => {\n if (targetValue === null \|\| targetValue === undefined) return \"\";\n\n const number = Number(targetValue);\n if (isNaN(number)) return targetValue;\n\n return number?.toLocaleString(\"en-US\", {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,\n });\n };\n\n const handleOnChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const _value = e.target.value;\n const numericValue =\n _value === \"\" \|\| _value === null \|\| _value === undefined\n ? 0\n : Number(_value);\n onChange(numericValue, selectedCurrency);\n const element = document.getElementById(id);\n if (element) {\n element.setAttribute(\n \"data-selected-value\",\n JSON.stringify({\n value: numericValue,\n currency_code: selectedCurrency,\n })\n );\n }\n if (element && (isRecording \|\| isPlaying)) {\n const pilotEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: {\n value: numericValue,\n currency_code: selectedCurrency,\n },\n type: \"change\",\n },\n });\n element.dispatchEvent(pilotEvent);\n }\n };\n\n const onFocus = () => {\n setIsFocused(true);\n };\n\n const onBlur = () => {\n setIsFocused(false);\n if (value === null \|\| value === undefined \|\| value === \"\") {\n handleOnChange({\n target: { value: \"0.00\" },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n onBlurProp?.();\n };\n\n const getClassName = (): string => {\n const baseClasses =\n \"pl-11 border h-8 text-sm block w-full p-2.5 font-inter font-medium focus:outline-none focus:ring-0\";\n\n if (errorMessage) {\n return cn(baseClasses, \"rounded-md border-red-300 bg-white dark:bg-black-600\", inputFieldClassName);\n }\n if (isRiskAnalysisOpen && riskDetails?.color) {\n return cn(baseClasses, `rounded-md border-${riskDetails.color}-300 bg-${riskDetails.color}-50`, \"text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800\", inputFieldClassName);\n }\n if (emphasisDeletedSkin) {\n return cn(baseClasses, \"rounded-lg border border-solid border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] !text-[#475467] focus:border-[var(--Error-200,#FECACA)] focus:shadow-[0_0_0_2px_rgba(254,202,202,0.45)] dark:border-[var(--Error-200,#FECACA)] dark:bg-[var(--Error-50,#FEF2F2)] dark:!text-[#475467] disabled:!opacity-100 disabled:!bg-[var(--Error-50,#FEF2F2)]\", inputFieldClassName);\n }\n if (emphasisModifiedSkin) {\n return cn(baseClasses, \"rounded-lg border border-solid border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] text-neutral-900 dark:text-black-100 focus:border-[var(--Warning-200,#FEDF89)] focus:shadow-[0_0_0_2px_rgba(254,223,137,0.45)] dark:border-[var(--Warning-200,#FEDF89)] dark:bg-[var(--Warning-50,#FFFAEB)] disabled:!opacity-100 disabled:!bg-[var(--Warning-50,#FFFAEB)]\", inputFieldClassName);\n }\n if (emphasisSuccessSkin) {\n return cn(baseClasses, \"rounded-lg border border-solid border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] !text-[#101828] focus:border-[var(--Success-200,#BBF7D0)] focus:shadow-[0_0_0_2px_rgba(187,247,208,0.45)] dark:border-[var(--Success-200,#BBF7D0)] dark:bg-[var(--Success-50,#F0FDF4)] dark:!text-[#101828] disabled:!opacity-100 disabled:!bg-[var(--Success-50,#F0FDF4)]\", inputFieldClassName);\n }\n return cn(baseClasses, \"rounded-lg border-gray-300 dark:border-black-600 bg-white dark:bg-black-600 text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]\", inputFieldClassName);\n };\n\n useEffect(() => {\n if (currencyCode) {\n setSelectedCurrency(currencyCode);\n }\n }, [currencyCode]);\n\n useEffect(() => {\n if (selectedCurrency) {\n const numericValue =\n value === \"\" \|\| value === null \|\| value === undefined\n ? 0\n : Number(value);\n if (currencyCode !== selectedCurrency) {\n onChange(numericValue, selectedCurrency);\n }\n const element = document.getElementById(id);\n if (element) {\n element.setAttribute(\n \"data-selected-value\",\n JSON.stringify({\n value: numericValue,\n currency_code: selectedCurrency,\n })\n );\n if (isRecording \|\| isPlaying) {\n const pilotEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: {\n value: numericValue,\n currency_code: selectedCurrency,\n },\n type: \"change\",\n },\n });\n element.dispatchEvent(pilotEvent);\n }\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedCurrency]);\n\n useEffect(() => {\n const currencyOptions = CURRENCIES.filter((item) =>\n (item.value + \" - \" + item.label)\n .toLowerCase()\n .includes(searchKeyForCurrency.toLowerCase())\n ).map((item) => ({\n label: (\n <OptionButton\n text={`${item.value} - ${item.label}`}\n icon={getFlagComponent(item.value)}\n showTick={selectedCurrency === item.value}\n onClick={() => setSelectedCurrency(item.value)}\n className=\"text-black-900 dark:text-white\"\n />\n ),\n key: item.value,\n }));\n\n setFilteredCurrencyOptions(currencyOptions);\n }, [searchKeyForCurrency, selectedCurrency]);\n\n useEffect(() => {\n setSearchKeyForCurrency(\"\");\n }, [selectedCurrency]);\n\n // Simple mode rendering\n if (simpleMode) {\n return (\n <label\n id={id}\n className={`mb-1 text-xs font-medium text-gray-600 h-full inline-flex items-center gap-1 ${\n !originalCase ? \"capitalize\" : \"\"\n } ${labelClassName \|\| \"\"}`}\n >\n <span className=\"absolute inset-y-0 left-1 top-0.5 flex items-center pl-3\">\n {\"$\"}\n </span>\n <input\n {...props}\n ref={ref}\n type={isFocused ? \"number\" : \"text\"}\n required={required}\n className={cn(inputFieldClassName, \"pl-8 h-8\")}\n onChange={handleOnChange}\n min={0}\n onFocus={onFocus}\n onBlur={onBlur}\n value={!isFocused ? formatCurrency(value) : value}\n {...(defaultValue && !value\n ? {\n defaultValue: !isFocused\n ? formatCurrency(defaultValue)\n : defaultValue,\n }\n : {})}\n id={id \|\| label}\n autoFocus={autoFocus}\n />\n </label>\n );\n }\n\n // Full mode rendering\n return (\n <div\n className={cn(\n \"flex gap-0.5 relative\",\n isHovered && isGTN\n ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n : \"\"\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isGTN && !isHovered ? (\n <div className=\"size-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n ) : null}\n <div className={cn(\"w-full flex flex-col\", className)}>\n <label\n htmlFor=\"text\"\n className={`mb-1 text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n !originalCase ? \"uppercase\" : \"\"\n } ${labelClassName \|\| \"\"}`}\n >\n <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap\">\n <InputLabel label={label \|\| \"\"} required={required \|\| false} isRequiredConditional={isRequiredConditional \|\| false} />\n {isLiveField && (\n <BoltOutlined\n sx={{\n fontSize: 16,\n color: \"var(--color-primary-600)\",\n rotate: \"15deg\",\n }}\n />\n )}\n {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n <Label labels={tags} />\n {tooltip && (\n <Tooltip placement=\"top\" title={tooltip}>\n <div className=\"cursor-pointer\">\n <HelpIcon className=\"w-icon-sm h-icon-sm\" />\n </div>\n </Tooltip>\n )}\n {labelExtra}\n </div>\n <div className=\"flex items-center gap-1 justify-self-end\">\n {(shouldShowConfidenceScore(confidenceScore) && confidenceType) ? (\n <Tooltip\n placement=\"top-end\"\n title={confidenceTooltip ?? \"\"}\n hideTooltip={confidenceTooltip === undefined \|\| confidenceTooltip === null}\n className=\"cursor-pointer\"\n >\n <div\n className={cn(\n \"inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5\",\n getConfidenceScoreBadgeClass(confidenceType)\n )}\n onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n >\n <AIStarIcon\n size={12}\n fill={getConfidenceScoreBadgeColor(confidenceType)}\n fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n />\n <span className={cn(\"text-xs font-medium leading-4\", getConfidenceScoreBadgeTextColor(confidenceType))}>\n {confidenceScore}%\n </span>\n </div>\n </Tooltip>\n ) : null}\n {isGTN && isHovered && onAddGTNToDocument ? (\n <button\n id=\"btn-currency-input-add-to-document\"\n className=\"cursor-pointer\"\n onClick={() => handleAddGTNToDocument(formatCurrency(value))}\n type=\"button\"\n >\n <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n <NoteAddOutlined\n className=\"text-primary-600\"\n sx={{\n fontSize: 16\n }}\n />\n </AntTooltip>\n </button>\n ) : null}\n </div>\n </div>\n </label>\n <label className=\"relative block\">\n <span className=\"absolute inset-y-0 left-1 flex items-center pl-3 text-neutral-900 dark:text-white\">\n {CURRENCY_SYMBOLS[selectedCurrency]}\n </span>\n\n <input\n {...props}\n ref={ref}\n placeholder={placeholder}\n type={isFocused ? \"number\" : \"text\"}\n required={required}\n disabled={disabled}\n className={getClassName()}\n onChange={handleOnChange}\n min={0}\n onFocus={onFocus}\n onBlur={onBlur}\n value={!isFocused ? formatCurrency(value) : value}\n defaultValue={\n !isFocused ? formatCurrency(defaultValue) : defaultValue\n }\n id={id \|\| label}\n style={inputStyle}\n autoComplete=\"off\"\n autoFocus={autoFocus}\n />\n <span\n className={`absolute inset-y-0 right-2 flex items-center z-[1000] h-full cursor-pointer dark:text-black-200 ${\n allowMultiCurrency ? \"cursor-pointer\" : \"\"\n }`}\n >\n {allowMultiCurrency ? (\n <Dropdown\n menu={{\n items: [\n ...filteredCurrencyOptions,\n ],\n }}\n trigger={[\"click\"]}\n overlayClassName=\"row-option-cell\"\n placement=\"bottomRight\"\n overlayStyle={{ zIndex: 999 }}\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n popupRender={(menu) => (\n <div\n className=\"[&>:nth-child(2)]:!shadow-none [&>:nth-child(2)>]:!px-2 flex flex-col gap-2 p-2 bg-white dark:bg-black-700 border border-solid border-neutral-200 dark:border-black-600 max-h-[200px] w-[330px] text-ellipsis overflow-y-auto z-[999] rounded-md\"\n >\n <SearchBar\n id={`search-bar-currency-input`}\n value={searchKeyForCurrency}\n onChange={(_value) =>\n setSearchKeyForCurrency(_value)\n }\n className=\"mb-2\"\n />\n {menu}\n </div>\n )}\n >\n <div className=\"pl-4 pr-2 py-1.5 text-sm text-gray-700 dark:text-black-200 flex items-center gap-1\">\n {getFlagComponent(selectedCurrency)} {selectedCurrency}\n </div>\n </Dropdown>\n ) : (\n selectedCurrency\n )}\n </span>\n </label>\n {errorMessage && (\n <Typography\n className=\"text-error-500 mt-1\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n </div>\n {isHovered &&\n riskDetails &&\n isRiskAnalysisOpen &&\n RiskDetailsCard && (\n <div\n role=\"tooltip\"\n tabIndex={0}\n className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n onClick={(e) => e.stopPropagation()}\n onMouseDown={(e) => e.preventDefault()}\n onKeyDown={(e) => {\n if (e.key === \"Escape\") {\n setIsHovered(false);\n }\n }}\n >\n <RiskDetailsCard riskDetails={riskDetails} />\n </div>\n )}\n </div>\n );\n }\n);\n\nCurrencyInputField.displayName = \"CurrencyInputField\";\n"],"names":["CurrencyInputField","forwardRef","id","label","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","tags","className","originalCase","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","isGTN","gtnName","allowMultiCurrency","placeholder","disabled","currencyCode","inputStyle","labelClassName","isLiveField","onBlurProp","autoFocus","isRecording","isPlaying","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","labelExtra","inputEmphasis","props","ref","t","useTranslation","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","isFocused","setIsFocused","useState","filteredCurrencyOptions","setFilteredCurrencyOptions","searchKeyForCurrency","setSearchKeyForCurrency","selectedCurrency","setSelectedCurrency","isHovered","setIsHovered","handleAddGTNToDocument","_value","keyValuePair","formatCurrencyUtils","formatCurrency","targetValue","number","handleOnChange","e","numericValue","element","pilotEvent","onFocus","onBlur","getClassName","baseClasses","cn","useEffect","currencyOptions","CURRENCIES","item","jsx","OptionButton","getFlagComponent","jsxs","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","CURRENCY_SYMBOLS","Dropdown","trigger","menu","SearchBar","Typography"],"mappings":"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"}
1	+ {"version":3,"file":"CurrencyInputField.cjs.js","sources":["../../../../src/components/forms/currency-input/CurrencyInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useState } from \"react\";\nimport { Dropdown, Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { CURRENCIES, CURRENCY_SYMBOLS } from \"./currency.constant\";\nimport { NoteAddOutlined, BoltOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport {\n getConfidenceScoreBadgeClass,\n getConfidenceScoreBadgeColor,\n getConfidenceScoreBadgeFill,\n getConfidenceScoreBadgeTextColor,\n shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { SearchBar } from \"../search-bar/SearchBar\";\nimport { OptionButton } from \"../../buttons/option-button/OptionButton\";\nimport { getFlagComponent } from \"../../../utils/countryFlags\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { formatCurrency as formatCurrencyUtils } from \"../../../utils/formatters\";\n\n/\n Confidence score type\n /\nexport type ConfidenceScoreType = \"low\" \| \"medium\" \| \"high\";\n\nexport type SourceMetaBBox = {\n b: number;\n l: number;\n r: number;\n t: number;\n};\n\nexport type SourceMetaItem = {\n bbox: SourceMetaBBox;\n confidence_score?: number;\n is_primary?: boolean;\n match_score?: number;\n match_type?: string;\n page_height: number;\n page_width: number;\n source_page: number;\n source_text?: string;\n};\n\n/\n Risk details interface for risk analysis integration\n /\nexport interface RiskDetails {\n color?: string;\n description?: string;\n hexBgColor?: string;\n hexBorderColor?: string;\n [key: string]: any;\n}\n\n/\n Risk details card component props - generic to allow consumer-specific risk types\n /\nexport interface RiskDetailsCardProps<T = any> {\n riskDetails: T;\n maxWidth?: string;\n showAllRisksSuggestions?: boolean;\n}\n\n/\n Props for the CurrencyInputField component\n /\nexport interface CurrencyInputFieldProps {\n /* Unique identifier for the currency input /\n id: string;\n /* Label text to display above the input /\n label?: string;\n /* Current value of the input (string for compatibility) /\n value: string;\n /* Callback function called when value changes /\n onChange: (data: any, currencyCode?: string) => void;\n /* Error message to display below the input /\n errorMessage?: string;\n /* Default value for the input /\n defaultValue?: string;\n /* Whether the field is required /\n required?: boolean;\n /* Whether the required indicator shows as conditional (yellow instead of red) /\n isRequiredConditional?: boolean;\n /* Tags/labels to display next to the label /\n tags?: (string \| LabelType)[];\n /* Additional CSS classes for the wrapper /\n className?: string;\n /* Whether to preserve original case in the label /\n originalCase?: boolean;\n /* Tooltip text for the help icon /\n tooltip?: string;\n /* Whether to use simple mode (inline label style) /\n simpleMode?: boolean;\n /* Additional CSS classes for the input field /\n inputFieldClassName?: string;\n /* Whether the value was AI extracted /\n isAiExtracted?: boolean;\n /* Confidence percentage shown as a badge /\n confidenceScore?: number;\n /* Confidence classification for badge styling /\n confidenceType?: ConfidenceScoreType;\n /* Optional tooltip content for confidence badge /\n confidenceTooltip?: React.ReactNode;\n /* Source meta for confidence score /\n sourceMeta?: SourceMetaItem[];\n /* Handler fired when confidence score badge is clicked /\n onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n /* Whether this is a GTN (Global Term Name) field /\n isGTN?: boolean;\n /* GTN field name for document integration /\n gtnName?: any;\n /* Whether to allow multi-currency selection with dropdown /\n allowMultiCurrency?: boolean;\n /* Placeholder text for the input /\n placeholder?: string;\n /* Whether the input is disabled /\n disabled?: boolean;\n /* Current currency code /\n currencyCode?: string;\n /* Inline styles for the input element /\n inputStyle?: React.CSSProperties;\n /* Additional CSS classes for the label /\n labelClassName?: string;\n /* Whether this is a live field /\n isLiveField?: boolean;\n /* Callback function called when input loses focus /\n onBlur?: () => void;\n /* Whether the input should auto-focus /\n autoFocus?: boolean;\n /* Whether recording is active (for pilot context) /\n isRecording?: boolean;\n /* Whether playback is active (for pilot context) /\n isPlaying?: boolean;\n /* Handler for adding GTN to document /\n onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n /* Risk details data /\n riskDetails?: RiskDetails;\n /* Whether risk analysis is open /\n isRiskAnalysisOpen?: boolean;\n /* Custom risk details card component /\n RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n /* Optional extra content in the label row (e.g. actions, badges) /\n labelExtra?: React.ReactNode;\n /* Input surface style: `'modified'` — Warning colors; `'deleted'` — Error colors, text #475467; `'success'` — Success colors, text #101828. /\n inputEmphasis?: \"default\" \| \"modified\" \| \"deleted\" \| \"success\";\n}\n\n/\n A highly customizable currency input component with label, validation, and styling support.\n * Features currency selection, formatting, validation, GTN integration, risk analysis support,\n * and comprehensive prop support for various use cases.\n \n @example\n * ```tsx\n * <CurrencyInputField\n * id=\"price\"\n * label=\"Price\"\n * value={price}\n * onChange={(value, currency) => setPrice(value)}\n * currencyCode=\"USD\"\n * allowMultiCurrency\n * required\n * />\n * ```\n /\nexport const CurrencyInputField = forwardRef<\n HTMLInputElement,\n CurrencyInputFieldProps\n>(\n (\n {\n id,\n label,\n value,\n onChange,\n errorMessage,\n defaultValue,\n required = false,\n isRequiredConditional = false,\n tags,\n className,\n originalCase = false,\n tooltip,\n simpleMode = false,\n inputFieldClassName = \"\",\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n isGTN = false,\n gtnName = null,\n allowMultiCurrency = false,\n placeholder,\n disabled = false,\n currencyCode = \"USD\",\n inputStyle,\n labelClassName,\n isLiveField = false,\n onBlur: onBlurProp,\n autoFocus = false,\n isRecording = false,\n isPlaying = false,\n onAddGTNToDocument,\n riskDetails,\n isRiskAnalysisOpen = false,\n RiskDetailsCard,\n labelExtra,\n inputEmphasis = \"default\",\n ...props\n },\n ref\n ) => {\n const { t } = useTranslation();\n const emphasisModifiedSkin = inputEmphasis === \"modified\" && !errorMessage && !(isRiskAnalysisOpen && riskDetails?.color);\n const emphasisDeletedSkin = inputEmphasis === \"deleted\" && !errorMessage && !(isRiskAnalysisOpen && riskDetails?.color);\n const emphasisSuccessSkin = inputEmphasis === \"success\" && !errorMessage && !(isRiskAnalysisOpen && riskDetails?.color);\n const [isFocused, setIsFocused] = useState(false);\n const [filteredCurrencyOptions, setFilteredCurrencyOptions] = useState<\n { label: React.ReactNode; key: string }[]\n >([]);\n const [searchKeyForCurrency, setSearchKeyForCurrency] = useState(\"\");\n const [selectedCurrency, setSelectedCurrency] = useState<string>(\n currencyCode ? currencyCode : \"USD\"\n );\n const [isHovered, setIsHovered] = useState(false);\n\n const handleAddGTNToDocument = (_value: string) => {\n if (onAddGTNToDocument) {\n const keyValuePair = {\n key: gtnName,\n value: formatCurrencyUtils(_value, selectedCurrency),\n };\n onAddGTNToDocument(keyValuePair);\n }\n };\n\n const formatCurrency = (targetValue: any): string => {\n if (targetValue === null \|\| targetValue === undefined) return \"\";\n\n const number = Number(targetValue);\n if (isNaN(number)) return targetValue;\n\n return number?.toLocaleString(\"en-US\", {\n minimumFractionDigits: 2,\n maximumFractionDigits: 2,\n });\n };\n\n const handleOnChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const _value = e.target.value;\n const numericValue =\n _value === \"\" \|\| _value === null \|\| _value === undefined\n ? 0\n : Number(_value);\n onChange(numericValue, selectedCurrency);\n const element = document.getElementById(id);\n if (element) {\n element.setAttribute(\n \"data-selected-value\",\n JSON.stringify({\n value: numericValue,\n currency_code: selectedCurrency,\n })\n );\n }\n if (element && (isRecording \|\| isPlaying)) {\n const pilotEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: {\n value: numericValue,\n currency_code: selectedCurrency,\n },\n type: \"change\",\n },\n });\n element.dispatchEvent(pilotEvent);\n }\n };\n\n const onFocus = () => {\n setIsFocused(true);\n };\n\n const onBlur = () => {\n setIsFocused(false);\n if (value === null \|\| value === undefined \|\| value === \"\") {\n handleOnChange({\n target: { value: \"0.00\" },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n onBlurProp?.();\n };\n\n const getClassName = (): string => {\n const baseClasses =\n \"pl-11 border h-[32px] text-sm block w-full p-2.5 font-inter font-medium focus:outline-none focus:ring-0\";\n\n if (errorMessage) {\n return cn(baseClasses, \"rounded-md border-red-300 bg-white dark:bg-black-600\", inputFieldClassName);\n }\n if (isRiskAnalysisOpen && riskDetails?.color) {\n return cn(baseClasses, `rounded-md border-${riskDetails.color}-300 bg-${riskDetails.color}-50`, \"text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800\", inputFieldClassName);\n }\n if (emphasisDeletedSkin) {\n return cn(baseClasses, \"rounded-lg border border-solid border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] !text-[#475467] focus:border-[var(--Error-200,#FECACA)] focus:shadow-[0_0_0_2px_rgba(254,202,202,0.45)] dark:border-[var(--Error-200,#FECACA)] dark:bg-[var(--Error-50,#FEF2F2)] dark:!text-[#475467] disabled:!opacity-100 disabled:!bg-[var(--Error-50,#FEF2F2)]\", inputFieldClassName);\n }\n if (emphasisModifiedSkin) {\n return cn(baseClasses, \"rounded-lg border border-solid border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] text-neutral-900 dark:text-black-100 focus:border-[var(--Warning-200,#FEDF89)] focus:shadow-[0_0_0_2px_rgba(254,223,137,0.45)] dark:border-[var(--Warning-200,#FEDF89)] dark:bg-[var(--Warning-50,#FFFAEB)] disabled:!opacity-100 disabled:!bg-[var(--Warning-50,#FFFAEB)]\", inputFieldClassName);\n }\n if (emphasisSuccessSkin) {\n return cn(baseClasses, \"rounded-lg border border-solid border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] !text-[#101828] focus:border-[var(--Success-200,#BBF7D0)] focus:shadow-[0_0_0_2px_rgba(187,247,208,0.45)] dark:border-[var(--Success-200,#BBF7D0)] dark:bg-[var(--Success-50,#F0FDF4)] dark:!text-[#101828] disabled:!opacity-100 disabled:!bg-[var(--Success-50,#F0FDF4)]\", inputFieldClassName);\n }\n return cn(baseClasses, \"rounded-lg border-gray-300 dark:border-black-600 bg-white dark:bg-black-600 text-neutral-900 dark:text-black-200 disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)]\", inputFieldClassName);\n };\n\n useEffect(() => {\n if (currencyCode) {\n setSelectedCurrency(currencyCode);\n }\n }, [currencyCode]);\n\n useEffect(() => {\n if (selectedCurrency) {\n const numericValue =\n value === \"\" \|\| value === null \|\| value === undefined\n ? 0\n : Number(value);\n if (currencyCode !== selectedCurrency) {\n onChange(numericValue, selectedCurrency);\n }\n const element = document.getElementById(id);\n if (element) {\n element.setAttribute(\n \"data-selected-value\",\n JSON.stringify({\n value: numericValue,\n currency_code: selectedCurrency,\n })\n );\n if (isRecording \|\| isPlaying) {\n const pilotEvent = new CustomEvent(\"pilot-change\", {\n bubbles: true,\n detail: {\n selector: `#${id}`,\n value: {\n value: numericValue,\n currency_code: selectedCurrency,\n },\n type: \"change\",\n },\n });\n element.dispatchEvent(pilotEvent);\n }\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedCurrency]);\n\n useEffect(() => {\n const currencyOptions = CURRENCIES.filter((item) =>\n (item.value + \" - \" + item.label)\n .toLowerCase()\n .includes(searchKeyForCurrency.toLowerCase())\n ).map((item) => ({\n label: (\n <OptionButton\n text={`${item.value} - ${item.label}`}\n icon={getFlagComponent(item.value)}\n showTick={selectedCurrency === item.value}\n onClick={() => setSelectedCurrency(item.value)}\n className=\"text-black-900 dark:text-white\"\n />\n ),\n key: item.value,\n }));\n\n setFilteredCurrencyOptions(currencyOptions);\n }, [searchKeyForCurrency, selectedCurrency]);\n\n useEffect(() => {\n setSearchKeyForCurrency(\"\");\n }, [selectedCurrency]);\n\n // Simple mode rendering\n if (simpleMode) {\n return (\n <label\n id={id}\n className={`mb-1 text-xs font-medium text-gray-600 h-full inline-flex items-center gap-1 ${\n !originalCase ? \"capitalize\" : \"\"\n } ${labelClassName \|\| \"\"}`}\n >\n <span className=\"absolute inset-y-0 left-1 top-0.5 flex items-center pl-3\">\n {\"$\"}\n </span>\n <input\n {...props}\n ref={ref}\n type={isFocused ? \"number\" : \"text\"}\n required={required}\n className={cn(inputFieldClassName, \"pl-8 h-[32px]\")}\n onChange={handleOnChange}\n min={0}\n onFocus={onFocus}\n onBlur={onBlur}\n value={!isFocused ? formatCurrency(value) : value}\n {...(defaultValue && !value\n ? {\n defaultValue: !isFocused\n ? formatCurrency(defaultValue)\n : defaultValue,\n }\n : {})}\n id={id \|\| label}\n autoFocus={autoFocus}\n />\n </label>\n );\n }\n\n // Full mode rendering\n return (\n <div\n className={cn(\n \"flex gap-0.5 relative\",\n isHovered && isGTN\n ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n : \"\"\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isGTN && !isHovered ? (\n <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n ) : null}\n <div className={cn(\"w-full flex flex-col\", className)}>\n <label\n htmlFor=\"text\"\n className={`mb-1 text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n !originalCase ? \"uppercase\" : \"\"\n } ${labelClassName \|\| \"\"}`}\n >\n <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap\">\n <InputLabel label={label \|\| \"\"} required={required \|\| false} isRequiredConditional={isRequiredConditional \|\| false} />\n {isLiveField && (\n <BoltOutlined\n sx={{\n fontSize: 16,\n color: \"var(--color-primary-600)\",\n rotate: \"15deg\",\n }}\n />\n )}\n {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n <Label labels={tags} />\n {tooltip && (\n <Tooltip placement=\"top\" title={tooltip}>\n <div className=\"cursor-pointer\">\n <HelpIcon />\n </div>\n </Tooltip>\n )}\n {labelExtra}\n </div>\n <div className=\"flex items-center gap-1 justify-self-end\">\n {(shouldShowConfidenceScore(confidenceScore) && confidenceType) ? (\n <Tooltip\n placement=\"top-end\"\n title={confidenceTooltip ?? \"\"}\n hideTooltip={confidenceTooltip === undefined \|\| confidenceTooltip === null}\n className=\"cursor-pointer\"\n >\n <div\n className={cn(\n \"inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5\",\n getConfidenceScoreBadgeClass(confidenceType)\n )}\n onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n >\n <AIStarIcon\n size={12}\n fill={getConfidenceScoreBadgeColor(confidenceType)}\n fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n />\n <span className={cn(\"text-xs font-medium leading-4\", getConfidenceScoreBadgeTextColor(confidenceType))}>\n {confidenceScore}%\n </span>\n </div>\n </Tooltip>\n ) : null}\n {isGTN && isHovered && onAddGTNToDocument ? (\n <button\n id=\"btn-currency-input-add-to-document\"\n className=\"cursor-pointer\"\n onClick={() => handleAddGTNToDocument(formatCurrency(value))}\n type=\"button\"\n >\n <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n <NoteAddOutlined\n className=\"text-primary-600\"\n sx={{\n fontSize: 16\n }}\n />\n </AntTooltip>\n </button>\n ) : null}\n </div>\n </div>\n </label>\n <label className=\"relative block\">\n <span className=\"absolute inset-y-0 left-1 flex items-center pl-3 text-neutral-900 dark:text-white\">\n {CURRENCY_SYMBOLS[selectedCurrency]}\n </span>\n\n <input\n {...props}\n ref={ref}\n placeholder={placeholder}\n type={isFocused ? \"number\" : \"text\"}\n required={required}\n disabled={disabled}\n className={getClassName()}\n onChange={handleOnChange}\n min={0}\n onFocus={onFocus}\n onBlur={onBlur}\n value={!isFocused ? formatCurrency(value) : value}\n defaultValue={\n !isFocused ? formatCurrency(defaultValue) : defaultValue\n }\n id={id \|\| label}\n style={inputStyle}\n autoComplete=\"off\"\n autoFocus={autoFocus}\n />\n <span\n className={`absolute inset-y-0 right-2 flex items-center z-[1000px] h-full cursor-pointer dark:text-black-200 ${\n allowMultiCurrency ? \"cursor-pointer\" : \"\"\n }`}\n >\n {allowMultiCurrency ? (\n <Dropdown\n menu={{\n items: [\n ...filteredCurrencyOptions,\n ],\n }}\n trigger={[\"click\"]}\n overlayClassName=\"row-option-cell\"\n placement=\"bottomRight\"\n overlayStyle={{ zIndex: 999 }}\n getPopupContainer={(trigger) =>\n trigger.parentElement as HTMLElement\n }\n popupRender={(menu) => (\n <div\n style={{\n maxHeight: \"200px\",\n width: \"330px\",\n textOverflow: \"ellipsis\",\n overflowY: \"auto\",\n zIndex: \"999px\",\n borderRadius: \"6px\",\n }}\n className=\"[&>:nth-child(2)]:!shadow-none [&>:nth-child(2)>]:!px-2 flex flex-col gap-2 p-2 bg-white dark:bg-black-700 border border-solid border-neutral-200 dark:border-black-600\"\n >\n <SearchBar\n id={`search-bar-currency-input`}\n value={searchKeyForCurrency}\n onChange={(_value) =>\n setSearchKeyForCurrency(_value)\n }\n className=\"mb-2\"\n />\n {menu}\n </div>\n )}\n >\n <div className=\"pl-4 pr-2 py-1.5 text-sm text-gray-700 dark:text-black-200 flex items-center gap-1\">\n {getFlagComponent(selectedCurrency)} {selectedCurrency}\n </div>\n </Dropdown>\n ) : (\n selectedCurrency\n )}\n </span>\n </label>\n {errorMessage && (\n <Typography\n className=\"text-error-500 mt-1\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n </div>\n {isHovered &&\n riskDetails &&\n isRiskAnalysisOpen &&\n RiskDetailsCard && (\n <div\n role=\"tooltip\"\n tabIndex={0}\n className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n onClick={(e) => e.stopPropagation()}\n onMouseDown={(e) => e.preventDefault()}\n onKeyDown={(e) => {\n if (e.key === \"Escape\") {\n setIsHovered(false);\n }\n }}\n >\n <RiskDetailsCard riskDetails={riskDetails} />\n </div>\n )}\n </div>\n );\n }\n);\n\nCurrencyInputField.displayName = \"CurrencyInputField\";\n"],"names":["CurrencyInputField","forwardRef","id","label","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","tags","className","originalCase","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","isGTN","gtnName","allowMultiCurrency","placeholder","disabled","currencyCode","inputStyle","labelClassName","isLiveField","onBlurProp","autoFocus","isRecording","isPlaying","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","labelExtra","inputEmphasis","props","ref","t","useTranslation","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","isFocused","setIsFocused","useState","filteredCurrencyOptions","setFilteredCurrencyOptions","searchKeyForCurrency","setSearchKeyForCurrency","selectedCurrency","setSelectedCurrency","isHovered","setIsHovered","handleAddGTNToDocument","_value","keyValuePair","formatCurrencyUtils","formatCurrency","targetValue","number","handleOnChange","e","numericValue","element","pilotEvent","onFocus","onBlur","getClassName","baseClasses","cn","useEffect","currencyOptions","CURRENCIES","item","jsx","OptionButton","getFlagComponent","jsxs","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","CURRENCY_SYMBOLS","Dropdown","trigger","menu","SearchBar","Typography"],"mappings":"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"}