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

package/dist/components/forms/dynamic-data-input/DynamicDataInput.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicDataInput.es.js","sources":["../../../../src/components/forms/dynamic-data-input/DynamicDataInput.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { type FC, useEffect, useRef, useState } from \"react\";\n\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { DynamicDataModal } from \"../../data-display/dynamic-data-modal/DynamicDataModal\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { EditIcon } from \"../../icons/EditIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\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 * Props for the DynamicDataInput component\n * Drop-in replacement matching the lax-web-portal API\n */\nexport type DynamicDataInputProps = {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label?: string;\n  /** Input type (text, email, password, number, etc.) */\n  type?: string;\n  /** Placeholder text for the input */\n  placeholder?: string;\n  /** Current value of the input (JSON string for dynamic data) */\n  value: string;\n  /** Callback function called when value changes */\n  onChange: (value: string) => void;\n  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Whether to preserve original case in the label */\n  originalCase?: boolean;\n  /** Whether the field is required */\n  required?: boolean;\n  /** Background color class */\n  bg?: string;\n  /** Tags/labels to display next to the label */\n  tags?: (string | LabelType)[];\n  /** Index prop used for resetting input state */\n  index?: number;\n  /** Additional CSS classes for the wrapper */\n  className?: string;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether to use simple mode (no label, just input with edit button) */\n  simpleMode?: boolean;\n  /** Additional CSS classes for the input field in simple mode */\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 the input is disabled */\n  disabled?: boolean;\n} & Record<string, any>;\n\n/**\n * A dynamic data input component that displays a text input with a button to open\n * a modal for editing JSON data. The input shows \"{DYNAMIC}\" when there's a value.\n * \n * This is a drop-in replacement for the lax-web-portal DynamicDataInput component.\n *\n * @example\n * ```tsx\n * <DynamicDataInput\n *   id=\"dynamic-field\"\n *   label=\"Dynamic Field\"\n *   type=\"text\"\n *   placeholder=\"Enter value...\"\n *   value={jsonData}\n *   onChange={(value) => setJsonData(value)}\n *   errorMessage=\"\"\n * />\n * ```\n */\nexport const DynamicDataInput: FC<DynamicDataInputProps> = (props) => {\n  const {\n    id,\n    label = \"\",\n    type = \"text\",\n    placeholder = \"\",\n    value,\n    onChange,\n    originalCase = false,\n    errorMessage = \"\",\n    required,\n    bg,\n    tags,\n    index,\n    className,\n    tooltip = \"\",\n    simpleMode,\n    inputFieldClassName,\n    isAiExtracted = false,\n    confidenceScore,\n    confidenceType = \"high\",\n    confidenceTooltip,\n    sourceMeta = [],\n    onConfidenceScoreClick,\n    disabled = false,\n    ...rest\n  } = props;\n\n  const [inputValue, setInputValue] = useState<string | null>(null);\n  const [showMasterDataModal, setShowMasterDataModal] = useState(false);\n\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  // Reset input value when index changes\n  useEffect(() => {\n    setInputValue(null);\n  }, [index]);\n\n  // Trigger onChange when inputValue changes\n  useEffect(() => {\n    if (inputValue !== null) {\n      onChange(inputValue);\n    }\n  }, [inputValue, onChange]);\n\n  const toggleModal = () => {\n    setShowMasterDataModal(!showMasterDataModal);\n  };\n\n  const handleSetData = (dynamicData: string) => {\n    setInputValue(dynamicData);\n    toggleModal();\n  };\n\n  return (\n    <>\n      {simpleMode ? (\n        <div className=\"relative w-full h-full\">\n          <input\n            type={type}\n            placeholder={placeholder}\n            className={inputFieldClassName}\n            onChange={(e) => {\n              onChange(e.target.value);\n            }}\n            ref={inputRef}\n            value={value ? \"{DYNAMIC}\" : \"\"}\n            disabled={true}\n            {...rest}\n          />\n\n          <button\n            id=\"btn-dynamic-data-input-edit\"\n            onClick={toggleModal}\n            className={cn(\n              \"absolute inset-y-0 right-0 flex items-center px-4 focus:border-transparent border-l\",\n              disabled ? \"cursor-not-allowed\" : \"\"\n            )}\n            disabled={disabled}\n            type=\"button\"\n          >\n            <EditIcon />\n          </button>\n        </div>\n      ) : (\n        <div className={cn(\"flex flex-col w-full\", className)}>\n          <label\n            htmlFor=\"text\"\n            className={`mb-1 text-black-300 dark:text-black-300 inline-flex items-center gap-1 flex-wrap ${\n              !originalCase ? \"capitalize\" : \"\"\n            }`}\n          >\n           <InputLabel label={label || \"\"} required={required || false} />\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            {(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          </label>\n          <label className=\"relative block\">\n            <input\n              type={type}\n              id={id}\n              required={required}\n              placeholder={placeholder}\n              className={cn(\n                \"border\",\n                errorMessage\n                  ? \"border-red-300 focus:border-red-300\"\n                  : \"border-gray-300 dark:border-black-600 focus:border-blue-500 dark:focus:border-primary-400\",\n                bg,\n                \"text-sm rounded-lg block w-full p-2.5 font-inter font-medium\",\n                type === \"currency\" ? \"pl-8\" : \"\",\n                \"bg-white dark:bg-black-600 text-gray-900 dark:text-black-200\"\n              )}\n              onChange={(e) => {\n                onChange(e.target.value);\n              }}\n              ref={inputRef}\n              value={value ? \"{DYNAMIC}\" : \"\"}\n              disabled={true}\n              autoComplete=\"off\"\n              {...rest}\n            />\n\n            <button\n              onClick={toggleModal}\n              className=\"absolute inset-y-0 right-0 flex items-center px-4 focus:border-transparent border-l\"\n              type=\"button\"\n            >\n              <EditIcon />\n            </button>\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      )}\n      <DynamicDataModal\n        isVisible={showMasterDataModal}\n        onChange={handleSetData}\n        onClose={toggleModal}\n        defaultValue={value}\n      />\n    </>\n  );\n};\n\nDynamicDataInput.displayName = \"DynamicDataInput\";\n\n"],"names":["DynamicDataInput","props","id","label","type","placeholder","value","onChange","originalCase","errorMessage","required","bg","tags","index","className","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","disabled","rest","inputValue","setInputValue","useState","showMasterDataModal","setShowMasterDataModal","inputRef","useRef","useEffect","toggleModal","handleSetData","dynamicData","jsxs","Fragment","jsx","e","cn","EditIcon","InputLabel","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","Typography","DynamicDataModal"],"mappings":"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"}
+{"version":3,"file":"DynamicDataInput.es.js","sources":["../../../../src/components/forms/dynamic-data-input/DynamicDataInput.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { type FC, useEffect, useRef, useState } from \"react\";\n\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport { DynamicDataModal } from \"../../data-display/dynamic-data-modal/DynamicDataModal\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { EditIcon } from \"../../icons/EditIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\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 * Props for the DynamicDataInput component\n * Drop-in replacement matching the lax-web-portal API\n */\nexport type DynamicDataInputProps = {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label?: string;\n  /** Input type (text, email, password, number, etc.) */\n  type?: string;\n  /** Placeholder text for the input */\n  placeholder?: string;\n  /** Current value of the input (JSON string for dynamic data) */\n  value: string;\n  /** Callback function called when value changes */\n  onChange: (value: string) => void;\n  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Whether to preserve original case in the label */\n  originalCase?: boolean;\n  /** Whether the field is required */\n  required?: boolean;\n  /** Background color class */\n  bg?: string;\n  /** Tags/labels to display next to the label */\n  tags?: (string | LabelType)[];\n  /** Index prop used for resetting input state */\n  index?: number;\n  /** Additional CSS classes for the wrapper */\n  className?: string;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether to use simple mode (no label, just input with edit button) */\n  simpleMode?: boolean;\n  /** Additional CSS classes for the input field in simple mode */\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 the input is disabled */\n  disabled?: boolean;\n} & Record<string, any>;\n\n/**\n * A dynamic data input component that displays a text input with a button to open\n * a modal for editing JSON data. The input shows \"{DYNAMIC}\" when there's a value.\n * \n * This is a drop-in replacement for the lax-web-portal DynamicDataInput component.\n *\n * @example\n * ```tsx\n * <DynamicDataInput\n *   id=\"dynamic-field\"\n *   label=\"Dynamic Field\"\n *   type=\"text\"\n *   placeholder=\"Enter value...\"\n *   value={jsonData}\n *   onChange={(value) => setJsonData(value)}\n *   errorMessage=\"\"\n * />\n * ```\n */\nexport const DynamicDataInput: FC<DynamicDataInputProps> = (props) => {\n  const {\n    id,\n    label = \"\",\n    type = \"text\",\n    placeholder = \"\",\n    value,\n    onChange,\n    originalCase = false,\n    errorMessage = \"\",\n    required,\n    bg,\n    tags,\n    index,\n    className,\n    tooltip = \"\",\n    simpleMode,\n    inputFieldClassName,\n    isAiExtracted = false,\n    confidenceScore,\n    confidenceType = \"high\",\n    confidenceTooltip,\n    sourceMeta = [],\n    onConfidenceScoreClick,\n    disabled = false,\n    ...rest\n  } = props;\n\n  const [inputValue, setInputValue] = useState<string | null>(null);\n  const [showMasterDataModal, setShowMasterDataModal] = useState(false);\n\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  // Reset input value when index changes\n  useEffect(() => {\n    setInputValue(null);\n  }, [index]);\n\n  // Trigger onChange when inputValue changes\n  useEffect(() => {\n    if (inputValue !== null) {\n      onChange(inputValue);\n    }\n  }, [inputValue, onChange]);\n\n  const toggleModal = () => {\n    setShowMasterDataModal(!showMasterDataModal);\n  };\n\n  const handleSetData = (dynamicData: string) => {\n    setInputValue(dynamicData);\n    toggleModal();\n  };\n\n  return (\n    <>\n      {simpleMode ? (\n        <div className=\"relative w-full h-full\">\n          <input\n            type={type}\n            placeholder={placeholder}\n            className={inputFieldClassName}\n            onChange={(e) => {\n              onChange(e.target.value);\n            }}\n            ref={inputRef}\n            value={value ? \"{DYNAMIC}\" : \"\"}\n            disabled={true}\n            {...rest}\n          />\n\n          <button\n            id=\"btn-dynamic-data-input-edit\"\n            onClick={toggleModal}\n            className={cn(\n              \"absolute inset-y-0 right-0 flex items-center px-4 focus:border-transparent border-l\",\n              disabled ? \"cursor-not-allowed\" : \"\"\n            )}\n            disabled={disabled}\n            type=\"button\"\n          >\n            <EditIcon />\n          </button>\n        </div>\n      ) : (\n        <div className={cn(\"flex flex-col w-full\", className)}>\n          <label\n            htmlFor=\"text\"\n            className={`mb-1 text-black-300 dark:text-black-300 inline-flex items-center gap-1 flex-wrap ${\n              !originalCase ? \"capitalize\" : \"\"\n            }`}\n          >\n           <InputLabel label={label || \"\"} required={required || false} />\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            {(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          </label>\n          <label className=\"relative block\">\n            <input\n              type={type}\n              id={id}\n              required={required}\n              placeholder={placeholder}\n              className={cn(\n                \"border\",\n                errorMessage\n                  ? \"border-red-300 focus:border-red-300\"\n                  : \"border-gray-300 dark:border-black-600 focus:border-blue-500 dark:focus:border-primary-400\",\n                bg,\n                \"text-sm rounded-lg block w-full p-2.5 font-inter font-medium\",\n                type === \"currency\" ? \"pl-8\" : \"\",\n                \"bg-white dark:bg-black-600 text-gray-900 dark:text-black-200\"\n              )}\n              onChange={(e) => {\n                onChange(e.target.value);\n              }}\n              ref={inputRef}\n              value={value ? \"{DYNAMIC}\" : \"\"}\n              disabled={true}\n              autoComplete=\"off\"\n              {...rest}\n            />\n\n            <button\n              onClick={toggleModal}\n              className=\"absolute inset-y-0 right-0 flex items-center px-4 focus:border-transparent border-l\"\n              type=\"button\"\n            >\n              <EditIcon />\n            </button>\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      )}\n      <DynamicDataModal\n        isVisible={showMasterDataModal}\n        onChange={handleSetData}\n        onClose={toggleModal}\n        defaultValue={value}\n      />\n    </>\n  );\n};\n\nDynamicDataInput.displayName = \"DynamicDataInput\";\n\n"],"names":["DynamicDataInput","props","id","label","type","placeholder","value","onChange","originalCase","errorMessage","required","bg","tags","index","className","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","disabled","rest","inputValue","setInputValue","useState","showMasterDataModal","setShowMasterDataModal","inputRef","useRef","useEffect","toggleModal","handleSetData","dynamicData","jsxs","Fragment","jsx","e","cn","EditIcon","InputLabel","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","Typography","DynamicDataModal"],"mappings":";;;;;;;;;;;;;AAsHO,MAAMA,KAA8C,CAACC,MAAU;AACpE,QAAM;AAAA,IACJ,IAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,MAAAC,IAAO;AAAA,IACP,aAAAC,IAAc;AAAA,IACd,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC,IAAe;AAAA,IACf,cAAAC,IAAe;AAAA,IACf,UAAAC;AAAA,IACA,IAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,YAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,iBAAAC;AAAA,IACA,gBAAAC,IAAiB;AAAA,IACjB,mBAAAC;AAAA,IACA,YAAAC,IAAa,CAAA;AAAA,IACb,wBAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,GAAGC;AAAA,EAAA,IACDxB,GAEE,CAACyB,GAAYC,CAAa,IAAIC,EAAwB,IAAI,GAC1D,CAACC,GAAqBC,CAAsB,IAAIF,EAAS,EAAK,GAE9DG,IAAWC,EAAyB,IAAI;AAG9C,EAAAC,EAAU,MAAM;AACd,IAAAN,EAAc,IAAI;AAAA,EACpB,GAAG,CAACd,CAAK,CAAC,GAGVoB,EAAU,MAAM;AACd,IAAIP,MAAe,QACjBnB,EAASmB,CAAU;AAAA,EAEvB,GAAG,CAACA,GAAYnB,CAAQ,CAAC;AAEzB,QAAM2B,IAAc,MAAM;AACxB,IAAAJ,EAAuB,CAACD,CAAmB;AAAA,EAC7C,GAEMM,IAAgB,CAACC,MAAwB;AAC7C,IAAAT,EAAcS,CAAW,GACzBF,EAAA;AAAA,EACF;AAEA,SACE,gBAAAG,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAtB,IACC,gBAAAqB,EAAC,OAAA,EAAI,WAAU,0BACb,UAAA;AAAA,MAAA,gBAAAE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAAnC;AAAA,UACA,aAAAC;AAAA,UACA,WAAWY;AAAA,UACX,UAAU,CAACuB,MAAM;AACf,YAAAjC,EAASiC,EAAE,OAAO,KAAK;AAAA,UACzB;AAAA,UACA,KAAKT;AAAA,UACL,OAAOzB,IAAQ,cAAc;AAAA,UAC7B,UAAU;AAAA,UACT,GAAGmB;AAAA,QAAA;AAAA,MAAA;AAAA,MAGN,gBAAAc;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,SAASL;AAAA,UACT,WAAWO;AAAA,YACT;AAAA,YACAjB,IAAW,uBAAuB;AAAA,UAAA;AAAA,UAEpC,UAAAA;AAAA,UACA,MAAK;AAAA,UAEL,4BAACkB,GAAA,CAAA,CAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ,GACF,IAEA,gBAAAL,EAAC,OAAA,EAAI,WAAWI,EAAG,wBAAwB3B,CAAS,GAClD,UAAA;AAAA,MAAA,gBAAAuB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,WAAW,oFACR7B,IAA8B,KAAf,YAClB;AAAA,UAED,UAAA;AAAA,YAAA,gBAAA+B,EAACI,KAAW,OAAOxC,KAAS,IAAI,UAAUO,KAAY,IAAO;AAAA,YAC3DQ,KAAiB,CAAC0B,EAA0BzB,CAAe,uBAAM0B,GAAA,EAAqB;AAAA,YACvF,gBAAAN,EAACO,GAAA,EAAM,QAAQlC,EAAA,CAAM;AAAA,YACpBG,KACC,gBAAAwB,EAACQ,GAAA,EAAQ,WAAU,OAAM,OAAOhC,GAC9B,UAAA,gBAAAwB,EAAC,OAAA,EAAI,WAAU,kBACb,UAAA,gBAAAA,EAACS,GAAA,CAAA,CAAS,GACZ,GACF;AAAA,YAEAJ,EAA0BzB,CAAe,KAAKC,IAC9C,gBAAAmB;AAAA,cAACQ;AAAA,cAAA;AAAA,gBACC,WAAU;AAAA,gBACV,OAAO1B,KAAqB;AAAA,gBAC5B,aAAgDA,KAAsB;AAAA,gBACtE,WAAU;AAAA,gBAEV,UAAA,gBAAAgB;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAWI;AAAA,sBACT;AAAA,sBACAQ,EAA6B7B,CAAc;AAAA,oBAAA;AAAA,oBAE7C,SAAS,MAAMG,IAAyBD,CAAU;AAAA,oBAElD,UAAA;AAAA,sBAAA,gBAAAiB;AAAA,wBAACW;AAAA,wBAAA;AAAA,0BACC,MAAM;AAAA,0BACN,MAAMC,EAA6B/B,CAAc;AAAA,0BACjD,eAAegC,EAA4BhC,CAAc;AAAA,wBAAA;AAAA,sBAAA;AAAA,sBAE3D,gBAAAiB,EAAC,UAAK,WAAWI,EAAG,iCAAiCY,EAAiCjC,CAAc,CAAC,GAClG,UAAA;AAAA,wBAAAD;AAAA,wBAAgB;AAAA,sBAAA,EAAA,CACnB;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA,IAEA;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAEN,gBAAAkB,EAAC,SAAA,EAAM,WAAU,kBACf,UAAA;AAAA,QAAA,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAAnC;AAAA,YACA,IAAAF;AAAA,YACA,UAAAQ;AAAA,YACA,aAAAL;AAAA,YACA,WAAWoC;AAAA,cACT;AAAA,cACAhC,IACI,wCACA;AAAA,cACJE;AAAA,cACA;AAAA,cACAP,MAAS,aAAa,SAAS;AAAA,cAC/B;AAAA,YAAA;AAAA,YAEF,UAAU,CAACoC,MAAM;AACf,cAAAjC,EAASiC,EAAE,OAAO,KAAK;AAAA,YACzB;AAAA,YACA,KAAKT;AAAA,YACL,OAAOzB,IAAQ,cAAc;AAAA,YAC7B,UAAU;AAAA,YACV,cAAa;AAAA,YACZ,GAAGmB;AAAA,UAAA;AAAA,QAAA;AAAA,QAGN,gBAAAc;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAASL;AAAA,YACT,WAAU;AAAA,YACV,MAAK;AAAA,YAEL,4BAACQ,GAAA,CAAA,CAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MACZ,GACF;AAAA,MACCjC,KACC,gBAAA8B;AAAA,QAACe;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,YAAW;AAAA,UACX,MAAK;AAAA,UACL,SAAQ;AAAA,UAEP,UAAA7C;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,IAEF,gBAAA8B;AAAA,MAACgB;AAAA,MAAA;AAAA,QACC,WAAW1B;AAAA,QACX,UAAUM;AAAA,QACV,SAASD;AAAA,QACT,cAAc5B;AAAA,MAAA;AAAA,IAAA;AAAA,EAChB,GACF;AAEJ;AAEAN,GAAiB,cAAc;"}

package/dist/components/forms/dynamic-data-input/DynamicDataInputField.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),f=require("../../../_virtual/index.cjs.js"),l=require("react"),oe=require("antd"),ie=require("react-i18next"),ce=require("../../data-display/typography/Typography.cjs.js"),de=require("../../data-display/label/Label.cjs.js"),p=require("@mui/icons-material"),ue=require("../../icons/AIExtractedIndicator.cjs.js"),xe=require("../../icons/AIStarIcon.cjs.js"),me=require("../../icons/HelpIcon.cjs.js"),L=require("../../tooltip/Tooltip.cjs.js"),V=require("../../button/IconButton.cjs.js"),fe=require("../shared/InputLabel.cjs.js"),s=require("../../../utils/confidenceScoreUtils.cjs.js"),F=l.forwardRef(({id:H,label:A,placeholder:K,value:n,onChange:u,errorMessage:x,defaultValue:M,required:v=!1,isRequiredConditional:_=!1,dataSource:b,dataKey:O,tags:U,tooltip:I="",originalCase:J=!1,color:w="",isGTN:g=!1,gtnName:N,isAiExtracted:Q=!1,confidenceScore:h,confidenceType:o="high",confidenceTooltip:j,sourceMeta:X=[],onConfidenceScoreClick:Y,labelClassName:Z,disabled:S=!1,isLiveField:T=!1,onAddGTNToDocument:y,riskDetails:a,isRiskAnalysisOpen:C=!1,RiskDetailsCard:q,primaryColorShades:W,isRecording:pe=!1,isPlaying:be=!1,setDisableActions:$,showDeprecatedFieldWarning:R,DynamicDataModal:E},G)=>{const{t:ee}=ie.useTranslation(),[m,k]=l.useState(!1),[i,c]=l.useState(n),[r,z]=l.useState(!1),B=l.useRef(null),D=G||B,P=()=>{$?.(!r),z(!r)},te=t=>{if(t.keyCode===9||t.key==="Enter"){const d=D.current||B.current;d&&(i!==null&&u(i),c(i),d.blur())}},le=()=>{c(""),u("")},ae=t=>{y&&N&&y({key:N,value:t})},re=()=>{const t="border h-8 text-sm rounded-lg block w-full p-2.5 font-inter font-medium",d=x?"border-red-300":C&&a?.color?`border-${a?.color}-300`:"border-gray-300 dark:border-black-600",se="placeholder:text-neutral-900 dark:placeholder:text-black-400",ne=`${C&&a?.color?`bg-${a?.color}-50`:"bg-gray-200 dark:bg-black-600 "} ${w||"text-neutral-900 dark:text-black-200"}`;return`${t} ${d} ${ne} ${se}`};return l.useEffect(()=>{r&&!b&&(R?.(),z(!1))},[r,b,R]),l.useEffect(()=>{c(n)},[n]),e.jsxs("div",{className:f("flex gap-0.5 w-full relative",m&&g?"border rounded-lg border-primary-100 bg-primary-50 p-1":"",{"error-field":!!x}),onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),children:[g&&!m?e.jsx("div",{className:"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,e.jsxs("div",{className:f("flex flex-col w-full"),children:[e.jsx("label",{htmlFor:"text",className:`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${J?"":"capitalize"} ${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(fe.InputLabel,{label:A||"",required:v||!1,isRequiredConditional:_||!1}),T&&e.jsx(p.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),Q&&!s.shouldShowConfidenceScore(h)&&e.jsx(ue.AIExtractedIndicator,{}),e.jsx(de.Label,{labels:U}),I&&e.jsx(L,{placement:"top",title:I,children:e.jsx("div",{className:"cursor-pointer",children:e.jsx(me.HelpIcon,{className:"w-icon-sm h-icon-sm"})})})]}),e.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[s.shouldShowConfidenceScore(h)&&o?e.jsx(L,{placement:"top-end",title:j??"",hideTooltip:j==null,className:"cursor-pointer",children:e.jsxs("div",{className:f("inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5",s.getConfidenceScoreBadgeClass(o)),onClick:()=>Y?.(X),children:[e.jsx(xe.AIStarIcon,{size:12,fill:s.getConfidenceScoreBadgeColor(o),fillSecondary:s.getConfidenceScoreBadgeFill(o)}),e.jsxs("span",{className:f("text-xs font-medium leading-4",s.getConfidenceScoreBadgeTextColor(o)),children:[h,"%"]})]})}):null,g&&m&&y?e.jsx("button",{id:"btn-dynamic-data-input-add-to-document",className:"cursor-pointer",onClick:()=>ae(n?.toString()||""),type:"button",children:e.jsx(oe.Tooltip,{placement:"top",title:ee("Add to document"),children:e.jsx(p.NoteAddOutlined,{sx:{fontSize:16,color:W?.[600]||"var(--color-primary-600)"}})})}):null]})]})}),e.jsxs("label",{className:"relative block mt-1",children:[e.jsx("input",{id:H,ref:D,required:v,placeholder:K,className:re(),onChange:t=>{u(t.target.value),c(t.target?.value)},onKeyDown:te,value:i!==null?i:n,defaultValue:M,disabled:!0}),e.jsx(V,{id:"btn-dynamic-data-input-rx-cross",onClick:le,className:"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent",variant:"ghost",disabled:S,children:e.jsx(p.CloseRounded,{className:"text-neutral-900 dark:text-black-300 w-xs h-xs"})}),e.jsx(V,{id:"btn-dynamic-data-input-ai-outline-pic-center",onClick:P,className:"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent",variant:"ghost",disabled:S,children:e.jsx(p.TableChartRounded,{className:"text-neutral-900 dark:text-black-300 w-xs h-xs"})})]}),x&&e.jsx(ce.Typography,{className:"text-error-500 mt-1",appearance:"custom",size:"extra-small",variant:"medium",children:x}),r&&E&&e.jsx(E,{isVisible:r,onSelect:t=>{u(t),c(t)},onClose:P,dataKey:O,dataSource:b})]}),m&&a&&C&&q&&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:t=>t.stopPropagation(),onMouseDown:t=>t.preventDefault(),onKeyDown:t=>{t.key==="Escape"&&k(!1)},children:e.jsx(q,{riskDetails:a})})]})});F.displayName="DynamicDataInputField";exports.DynamicDataInputField=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),f=require("../../../_virtual/index.cjs.js"),l=require("react"),oe=require("antd"),ie=require("react-i18next"),ce=require("../../data-display/typography/Typography.cjs.js"),de=require("../../data-display/label/Label.cjs.js"),p=require("@mui/icons-material"),ue=require("../../icons/AIExtractedIndicator.cjs.js"),xe=require("../../icons/AIStarIcon.cjs.js"),me=require("../../icons/HelpIcon.cjs.js"),L=require("../../tooltip/Tooltip.cjs.js"),V=require("../../button/IconButton.cjs.js"),fe=require("../shared/InputLabel.cjs.js"),n=require("../../../utils/confidenceScoreUtils.cjs.js"),F=l.forwardRef(({id:H,label:A,placeholder:K,value:s,onChange:u,errorMessage:x,defaultValue:M,required:v=!1,isRequiredConditional:_=!1,dataSource:b,dataKey:O,tags:U,tooltip:I="",originalCase:J=!1,color:S="",isGTN:g=!1,gtnName:N,isAiExtracted:Q=!1,confidenceScore:h,confidenceType:o="high",confidenceTooltip:j,sourceMeta:X=[],onConfidenceScoreClick:Y,labelClassName:Z,disabled:w=!1,isLiveField:T=!1,onAddGTNToDocument:y,riskDetails:r,isRiskAnalysisOpen:C=!1,RiskDetailsCard:q,primaryColorShades:W,isRecording:pe=!1,isPlaying:be=!1,setDisableActions:$,showDeprecatedFieldWarning:R,DynamicDataModal:z},G)=>{const{t:ee}=ie.useTranslation(),[m,k]=l.useState(!1),[i,c]=l.useState(s),[a,E]=l.useState(!1),B=l.useRef(null),D=G||B,P=()=>{$?.(!a),E(!a)},te=t=>{if(t.keyCode===9||t.key==="Enter"){const d=D.current||B.current;d&&(i!==null&&u(i),c(i),d.blur())}},le=()=>{c(""),u("")},re=t=>{y&&N&&y({key:N,value:t})},ae=()=>{const t="border h-[32px] text-sm rounded-lg block w-full p-2.5 font-inter font-medium",d=x?"border-red-300":C&&r?.color?`border-${r?.color}-300`:"border-gray-300 dark:border-black-600",ne="placeholder:text-neutral-900 dark:placeholder:text-black-400",se=`${C&&r?.color?`bg-${r?.color}-50`:"bg-gray-200 dark:bg-black-600 "} ${S||"text-neutral-900 dark:text-black-200"}`;return`${t} ${d} ${se} ${ne}`};return l.useEffect(()=>{a&&!b&&(R?.(),E(!1))},[a,b,R]),l.useEffect(()=>{c(s)},[s]),e.jsxs("div",{className:f("flex gap-0.5 w-full relative",m&&g?"border rounded-lg border-primary-100 bg-primary-50 p-1":"",{"error-field":!!x}),onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),children:[g&&!m?e.jsx("div",{className:"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,e.jsxs("div",{className:f("flex flex-col w-full"),children:[e.jsx("label",{htmlFor:"text",className:`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${J?"":"capitalize"} ${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(fe.InputLabel,{label:A||"",required:v||!1,isRequiredConditional:_||!1}),T&&e.jsx(p.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),Q&&!n.shouldShowConfidenceScore(h)&&e.jsx(ue.AIExtractedIndicator,{}),e.jsx(de.Label,{labels:U}),I&&e.jsx(L,{placement:"top",title:I,children:e.jsx("div",{className:"cursor-pointer",children:e.jsx(me.HelpIcon,{})})})]}),e.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[n.shouldShowConfidenceScore(h)&&o?e.jsx(L,{placement:"top-end",title:j??"",hideTooltip:j==null,className:"cursor-pointer",children:e.jsxs("div",{className:f("inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5",n.getConfidenceScoreBadgeClass(o)),onClick:()=>Y?.(X),children:[e.jsx(xe.AIStarIcon,{size:12,fill:n.getConfidenceScoreBadgeColor(o),fillSecondary:n.getConfidenceScoreBadgeFill(o)}),e.jsxs("span",{className:f("text-xs font-medium leading-4",n.getConfidenceScoreBadgeTextColor(o)),children:[h,"%"]})]})}):null,g&&m&&y?e.jsx("button",{id:"btn-dynamic-data-input-add-to-document",className:"cursor-pointer",onClick:()=>re(s?.toString()||""),type:"button",children:e.jsx(oe.Tooltip,{placement:"top",title:ee("Add to document"),children:e.jsx(p.NoteAddOutlined,{sx:{fontSize:16,color:W?.[600]||"var(--color-primary-600)"}})})}):null]})]})}),e.jsxs("label",{className:"relative block mt-1",children:[e.jsx("input",{id:H,ref:D,required:v,placeholder:K,className:ae(),onChange:t=>{u(t.target.value),c(t.target?.value)},onKeyDown:te,value:i!==null?i:s,defaultValue:M,disabled:!0}),e.jsx(V,{id:"btn-dynamic-data-input-rx-cross",onClick:le,className:"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent",variant:"ghost",disabled:w,children:e.jsx(p.CloseRounded,{className:"text-neutral-900 dark:text-black-300",sx:{fontSize:16}})}),e.jsx(V,{id:"btn-dynamic-data-input-ai-outline-pic-center",onClick:P,className:"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent",variant:"ghost",disabled:w,children:e.jsx(p.TableChartRounded,{className:"text-neutral-900 dark:text-black-300",sx:{fontSize:16}})})]}),x&&e.jsx(ce.Typography,{className:"text-error-500 mt-1",appearance:"custom",size:"extra-small",variant:"medium",children:x}),a&&z&&e.jsx(z,{isVisible:a,onSelect:t=>{u(t),c(t)},onClose:P,dataKey:O,dataSource:b})]}),m&&r&&C&&q&&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:t=>t.stopPropagation(),onMouseDown:t=>t.preventDefault(),onKeyDown:t=>{t.key==="Escape"&&k(!1)},children:e.jsx(q,{riskDetails:r})})]})});F.displayName="DynamicDataInputField";exports.DynamicDataInputField=F;
 //# sourceMappingURL=DynamicDataInputField.cjs.js.map

package/dist/components/forms/dynamic-data-input/DynamicDataInputField.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicDataInputField.cjs.js","sources":["../../../../src/components/forms/dynamic-data-input/DynamicDataInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useRef, useState } from \"react\";\nimport { 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 { BoltOutlined, CloseRounded, NoteAddOutlined, TableChartRounded } 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 IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\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 DynamicDataModal component\n */\nexport interface DynamicDataModalProps {\n  isVisible: boolean;\n  onSelect: (data: string | number | readonly string[] | undefined) => void;\n  onClose: () => void;\n  dataKey: string;\n  dataSource: string;\n}\n\n/**\n * Props for the DynamicDataInputField component\n */\nexport interface DynamicDataInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label: string;\n  /** Placeholder text for the input */\n  placeholder?: string;\n  /** Color for the input text */\n  color?: string;\n  /** Current value of the input */\n  value: string | number | readonly string[] | undefined;\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  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string | number | readonly string[] | undefined;\n  /** Data source for dynamic data */\n  dataSource: string;\n  /** Data key for dynamic data */\n  dataKey: string;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: 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 the input is disabled */\n  disabled?: boolean;\n  /** Callback function called when value changes */\n  onChange: (value: string | number | readonly string[] | undefined) => void;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Whether to preserve original case in the label */\n  originalCase?: 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  /** Primary color shades for styling */\n  primaryColorShades?: Record<number, string>;\n  /** Whether recording is active (for pilot context) */\n  isRecording?: boolean;\n  /** Whether playback is active (for pilot context) */\n  isPlaying?: boolean;\n  /** Callback to set disable actions state */\n  setDisableActions?: (disabled: boolean) => void;\n  /** Toast function for deprecated field warning */\n  showDeprecatedFieldWarning?: () => void;\n  /** Dynamic data modal component */\n  DynamicDataModal?: React.ComponentType<DynamicDataModalProps>;\n}\n\n/**\n * A highly customizable dynamic data input component with label, validation, and styling support.\n * Features dynamic data modal integration, GTN support, risk analysis support,\n * and comprehensive prop support for various use cases.\n *\n * @example\n * ```tsx\n * <DynamicDataInputField\n *   id=\"dynamic-field\"\n *   label=\"Dynamic Field\"\n *   value={fieldValue}\n *   onChange={(value) => setFieldValue(value)}\n *   dataSource=\"sourceTable\"\n *   dataKey=\"fieldKey\"\n *   required\n * />\n * ```\n */\nexport const DynamicDataInputField = forwardRef<\n  HTMLInputElement,\n  DynamicDataInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      placeholder,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      required = false,\n      isRequiredConditional = false,\n      dataSource,\n      dataKey,\n      tags,\n      tooltip = \"\",\n      originalCase = false,\n      color = \"\",\n      isGTN = false,\n      gtnName,\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      labelClassName,\n      disabled = false,\n      isLiveField = false,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      primaryColorShades,\n      isRecording: _isRecording = false,\n      isPlaying: _isPlaying = false,\n      setDisableActions,\n      showDeprecatedFieldWarning,\n      DynamicDataModal,\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n    const [inputValue, setInputValue] = useState<\n      string | number | readonly string[] | undefined\n    >(value);\n    const [showDynamicDataModal, setShowDynamicDataModal] = useState(false);\n\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    // Use forwarded ref or internal ref\n    const combinedRef = (ref as React.RefObject<HTMLInputElement>) || inputRef;\n\n    const toggleDynamicDataModal = () => {\n      if (showDynamicDataModal) {\n        setDisableActions?.(false);\n      } else {\n        setDisableActions?.(true);\n      }\n      setShowDynamicDataModal(!showDynamicDataModal);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (event.keyCode === 9 || event.key === \"Enter\") {\n        const currentRef = combinedRef.current || inputRef.current;\n        if (currentRef) {\n          if (inputValue !== null) {\n            onChange(inputValue);\n          }\n          setInputValue(inputValue);\n          currentRef.blur();\n        }\n      }\n    };\n\n    const handleClear = () => {\n      setInputValue(\"\");\n      onChange(\"\");\n    };\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument && gtnName) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    const getClassName = (): string => {\n      const baseClasses =\n        \"border h-8 text-sm rounded-lg block w-full p-2.5 font-inter font-medium\";\n      const borderColor = errorMessage\n        ? \"border-red-300\"\n        : isRiskAnalysisOpen && riskDetails?.color\n        ? `border-${riskDetails?.color}-300`\n        : \"border-gray-300 dark:border-black-600\";\n      const placeholderColor = `placeholder:text-neutral-900 dark:placeholder:text-black-400`;\n      const backgroundColor = `${\n        isRiskAnalysisOpen && riskDetails?.color\n          ? `bg-${riskDetails?.color}-50`\n          : \"bg-gray-200 dark:bg-black-600 \"\n      } ${color ? color : \"text-neutral-900 dark:text-black-200\"}`;\n\n      return `${baseClasses} ${borderColor} ${backgroundColor} ${placeholderColor}`;\n    };\n\n    useEffect(() => {\n      if (showDynamicDataModal && !dataSource) {\n        showDeprecatedFieldWarning?.();\n        setShowDynamicDataModal(false);\n      }\n    }, [showDynamicDataModal, dataSource, showDeprecatedFieldWarning]);\n\n    // Sync inputValue with value prop\n    useEffect(() => {\n      setInputValue(value);\n    }, [value]);\n\n    return (\n      <div\n        className={cn(\n          `flex gap-0.5 w-full relative`,\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\",\n          { \"error-field\": !!errorMessage }\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\n        <div className={cn(`flex flex-col w-full`)}>\n          <label\n            htmlFor=\"text\"\n            className={`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n              !originalCase ? \"capitalize\" : \"\"\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              </div>\n\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-dynamic-data-input-add-to-document\"\n                    className=\"cursor-pointer\"\n                    onClick={() => handleAddGTNToDocument(value?.toString() || \"\")}\n                    type=\"button\"\n                  >\n                    <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n                      <NoteAddOutlined\n                        sx={{\n                          fontSize: 16,\n                          color:\n                            primaryColorShades?.[600] || \"var(--color-primary-600)\",\n                        }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block mt-1\">\n            <input\n              id={id}\n              ref={combinedRef}\n              required={required}\n              placeholder={placeholder}\n              className={getClassName()}\n              onChange={(e) => {\n                onChange(e.target.value);\n                setInputValue(e.target?.value);\n              }}\n              onKeyDown={handleKeyDown}\n              value={inputValue !== null ? inputValue : value}\n              defaultValue={defaultValue}\n              disabled={true}\n            />\n\n            <IconButton\n              id={`btn-dynamic-data-input-rx-cross`}\n              onClick={handleClear}\n              className=\"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <CloseRounded\n                className=\"text-neutral-900 dark:text-black-300 w-xs h-xs\"\n              />\n            </IconButton>\n\n            <IconButton\n              id={`btn-dynamic-data-input-ai-outline-pic-center`}\n              onClick={toggleDynamicDataModal}\n              className=\"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <TableChartRounded\n                className=\"text-neutral-900 dark:text-black-300 w-xs h-xs\"\n              />\n            </IconButton>\n          </label>\n\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\n          {showDynamicDataModal && DynamicDataModal && (\n            <DynamicDataModal\n              isVisible={showDynamicDataModal}\n              onSelect={(data) => {\n                onChange(data);\n                setInputValue(data);\n              }}\n              onClose={toggleDynamicDataModal}\n              dataKey={dataKey}\n              dataSource={dataSource}\n            />\n          )}\n        </div>\n\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\nDynamicDataInputField.displayName = \"DynamicDataInputField\";\n\n"],"names":["DynamicDataInputField","forwardRef","id","label","placeholder","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","dataSource","dataKey","tags","tooltip","originalCase","color","isGTN","gtnName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","labelClassName","disabled","isLiveField","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","primaryColorShades","_isRecording","_isPlaying","setDisableActions","showDeprecatedFieldWarning","DynamicDataModal","ref","t","useTranslation","isHovered","setIsHovered","useState","inputValue","setInputValue","showDynamicDataModal","setShowDynamicDataModal","inputRef","useRef","combinedRef","toggleDynamicDataModal","handleKeyDown","event","currentRef","handleClear","handleAddGTNToDocument","_value","getClassName","baseClasses","borderColor","placeholderColor","backgroundColor","useEffect","jsxs","cn","jsx","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","e","IconButton","CloseRounded","TableChartRounded","Typography","data"],"mappings":"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"}
+{"version":3,"file":"DynamicDataInputField.cjs.js","sources":["../../../../src/components/forms/dynamic-data-input/DynamicDataInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useRef, useState } from \"react\";\nimport { 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 { BoltOutlined, CloseRounded, NoteAddOutlined, TableChartRounded } 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 IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\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 DynamicDataModal component\n */\nexport interface DynamicDataModalProps {\n  isVisible: boolean;\n  onSelect: (data: string | number | readonly string[] | undefined) => void;\n  onClose: () => void;\n  dataKey: string;\n  dataSource: string;\n}\n\n/**\n * Props for the DynamicDataInputField component\n */\nexport interface DynamicDataInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label: string;\n  /** Placeholder text for the input */\n  placeholder?: string;\n  /** Color for the input text */\n  color?: string;\n  /** Current value of the input */\n  value: string | number | readonly string[] | undefined;\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  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string | number | readonly string[] | undefined;\n  /** Data source for dynamic data */\n  dataSource: string;\n  /** Data key for dynamic data */\n  dataKey: string;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: 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 the input is disabled */\n  disabled?: boolean;\n  /** Callback function called when value changes */\n  onChange: (value: string | number | readonly string[] | undefined) => void;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Whether to preserve original case in the label */\n  originalCase?: 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  /** Primary color shades for styling */\n  primaryColorShades?: Record<number, string>;\n  /** Whether recording is active (for pilot context) */\n  isRecording?: boolean;\n  /** Whether playback is active (for pilot context) */\n  isPlaying?: boolean;\n  /** Callback to set disable actions state */\n  setDisableActions?: (disabled: boolean) => void;\n  /** Toast function for deprecated field warning */\n  showDeprecatedFieldWarning?: () => void;\n  /** Dynamic data modal component */\n  DynamicDataModal?: React.ComponentType<DynamicDataModalProps>;\n}\n\n/**\n * A highly customizable dynamic data input component with label, validation, and styling support.\n * Features dynamic data modal integration, GTN support, risk analysis support,\n * and comprehensive prop support for various use cases.\n *\n * @example\n * ```tsx\n * <DynamicDataInputField\n *   id=\"dynamic-field\"\n *   label=\"Dynamic Field\"\n *   value={fieldValue}\n *   onChange={(value) => setFieldValue(value)}\n *   dataSource=\"sourceTable\"\n *   dataKey=\"fieldKey\"\n *   required\n * />\n * ```\n */\nexport const DynamicDataInputField = forwardRef<\n  HTMLInputElement,\n  DynamicDataInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      placeholder,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      required = false,\n      isRequiredConditional = false,\n      dataSource,\n      dataKey,\n      tags,\n      tooltip = \"\",\n      originalCase = false,\n      color = \"\",\n      isGTN = false,\n      gtnName,\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      labelClassName,\n      disabled = false,\n      isLiveField = false,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      primaryColorShades,\n      isRecording: _isRecording = false,\n      isPlaying: _isPlaying = false,\n      setDisableActions,\n      showDeprecatedFieldWarning,\n      DynamicDataModal,\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n    const [inputValue, setInputValue] = useState<\n      string | number | readonly string[] | undefined\n    >(value);\n    const [showDynamicDataModal, setShowDynamicDataModal] = useState(false);\n\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    // Use forwarded ref or internal ref\n    const combinedRef = (ref as React.RefObject<HTMLInputElement>) || inputRef;\n\n    const toggleDynamicDataModal = () => {\n      if (showDynamicDataModal) {\n        setDisableActions?.(false);\n      } else {\n        setDisableActions?.(true);\n      }\n      setShowDynamicDataModal(!showDynamicDataModal);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (event.keyCode === 9 || event.key === \"Enter\") {\n        const currentRef = combinedRef.current || inputRef.current;\n        if (currentRef) {\n          if (inputValue !== null) {\n            onChange(inputValue);\n          }\n          setInputValue(inputValue);\n          currentRef.blur();\n        }\n      }\n    };\n\n    const handleClear = () => {\n      setInputValue(\"\");\n      onChange(\"\");\n    };\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument && gtnName) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    const getClassName = (): string => {\n      const baseClasses =\n        \"border h-[32px] text-sm rounded-lg block w-full p-2.5 font-inter font-medium\";\n      const borderColor = errorMessage\n        ? \"border-red-300\"\n        : isRiskAnalysisOpen && riskDetails?.color\n        ? `border-${riskDetails?.color}-300`\n        : \"border-gray-300 dark:border-black-600\";\n      const placeholderColor = `placeholder:text-neutral-900 dark:placeholder:text-black-400`;\n      const backgroundColor = `${\n        isRiskAnalysisOpen && riskDetails?.color\n          ? `bg-${riskDetails?.color}-50`\n          : \"bg-gray-200 dark:bg-black-600 \"\n      } ${color ? color : \"text-neutral-900 dark:text-black-200\"}`;\n\n      return `${baseClasses} ${borderColor} ${backgroundColor} ${placeholderColor}`;\n    };\n\n    useEffect(() => {\n      if (showDynamicDataModal && !dataSource) {\n        showDeprecatedFieldWarning?.();\n        setShowDynamicDataModal(false);\n      }\n    }, [showDynamicDataModal, dataSource, showDeprecatedFieldWarning]);\n\n    // Sync inputValue with value prop\n    useEffect(() => {\n      setInputValue(value);\n    }, [value]);\n\n    return (\n      <div\n        className={cn(\n          `flex gap-0.5 w-full relative`,\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\",\n          { \"error-field\": !!errorMessage }\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\n        <div className={cn(`flex flex-col w-full`)}>\n          <label\n            htmlFor=\"text\"\n            className={`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n              !originalCase ? \"capitalize\" : \"\"\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              </div>\n\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-dynamic-data-input-add-to-document\"\n                    className=\"cursor-pointer\"\n                    onClick={() => handleAddGTNToDocument(value?.toString() || \"\")}\n                    type=\"button\"\n                  >\n                    <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n                      <NoteAddOutlined\n                        sx={{\n                          fontSize: 16,\n                          color:\n                            primaryColorShades?.[600] || \"var(--color-primary-600)\",\n                        }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block mt-1\">\n            <input\n              id={id}\n              ref={combinedRef}\n              required={required}\n              placeholder={placeholder}\n              className={getClassName()}\n              onChange={(e) => {\n                onChange(e.target.value);\n                setInputValue(e.target?.value);\n              }}\n              onKeyDown={handleKeyDown}\n              value={inputValue !== null ? inputValue : value}\n              defaultValue={defaultValue}\n              disabled={true}\n            />\n\n            <IconButton\n              id={`btn-dynamic-data-input-rx-cross`}\n              onClick={handleClear}\n              className=\"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <CloseRounded\n                className=\"text-neutral-900 dark:text-black-300\"\n                sx={{ fontSize: 16 }}\n              />\n            </IconButton>\n\n            <IconButton\n              id={`btn-dynamic-data-input-ai-outline-pic-center`}\n              onClick={toggleDynamicDataModal}\n              className=\"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <TableChartRounded\n                className=\"text-neutral-900 dark:text-black-300\"\n                sx={{ fontSize: 16 }}\n              />\n            </IconButton>\n          </label>\n\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\n          {showDynamicDataModal && DynamicDataModal && (\n            <DynamicDataModal\n              isVisible={showDynamicDataModal}\n              onSelect={(data) => {\n                onChange(data);\n                setInputValue(data);\n              }}\n              onClose={toggleDynamicDataModal}\n              dataKey={dataKey}\n              dataSource={dataSource}\n            />\n          )}\n        </div>\n\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\nDynamicDataInputField.displayName = \"DynamicDataInputField\";\n\n"],"names":["DynamicDataInputField","forwardRef","id","label","placeholder","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","dataSource","dataKey","tags","tooltip","originalCase","color","isGTN","gtnName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","labelClassName","disabled","isLiveField","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","primaryColorShades","_isRecording","_isPlaying","setDisableActions","showDeprecatedFieldWarning","DynamicDataModal","ref","t","useTranslation","isHovered","setIsHovered","useState","inputValue","setInputValue","showDynamicDataModal","setShowDynamicDataModal","inputRef","useRef","combinedRef","toggleDynamicDataModal","handleKeyDown","event","currentRef","handleClear","handleAddGTNToDocument","_value","getClassName","baseClasses","borderColor","placeholderColor","backgroundColor","useEffect","jsxs","cn","jsx","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","e","IconButton","CloseRounded","TableChartRounded","Typography","data"],"mappings":"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"}

package/dist/components/forms/dynamic-data-input/DynamicDataInputField.es.js

@@ -39,21 +39,21 @@ const Ie = ie(
     sourceMeta: X = [],
     onConfidenceScoreClick: Y,
     labelClassName: Z,
-    disabled: $ = !1,
+    disabled: S = !1,
     isLiveField: W = !1,
     onAddGTNToDocument: h,
     riskDetails: r,
     isRiskAnalysisOpen: y = !1,
-    RiskDetailsCard: S,
+    RiskDetailsCard: $,
     primaryColorShades: T,
-    isRecording: $e = !1,
-    isPlaying: Se = !1,
-    setDisableActions: R,
-    showDeprecatedFieldWarning: z,
+    isRecording: Se = !1,
+    isPlaying: $e = !1,
+    setDisableActions: z,
+    showDeprecatedFieldWarning: R,
     DynamicDataModal: B
   }, G) => {
     const { t: ee } = de(), [f, k] = C(!1), [i, s] = C(o), [a, E] = C(!1), P = se(null), V = G || P, D = () => {
-      R?.(!a), E(!a);
+      z?.(!a), E(!a);
     }, te = (t) => {
       if (t.keyCode === 9 || t.key === "Enter") {
         const c = V.current || P.current;
@@ -67,12 +67,12 @@ const Ie = ie(
         value: t
       });
     }, ae = () => {
-      const t = "border h-8 text-sm rounded-lg block w-full p-2.5 font-inter font-medium", c = m ? "border-red-300" : y && r?.color ? `border-${r?.color}-300` : "border-gray-300 dark:border-black-600", oe = "placeholder:text-neutral-900 dark:placeholder:text-black-400", ne = `${y && r?.color ? `bg-${r?.color}-50` : "bg-gray-200 dark:bg-black-600 "} ${w || "text-neutral-900 dark:text-black-200"}`;
+      const t = "border h-[32px] text-sm rounded-lg block w-full p-2.5 font-inter font-medium", c = m ? "border-red-300" : y && r?.color ? `border-${r?.color}-300` : "border-gray-300 dark:border-black-600", oe = "placeholder:text-neutral-900 dark:placeholder:text-black-400", ne = `${y && r?.color ? `bg-${r?.color}-50` : "bg-gray-200 dark:bg-black-600 "} ${w || "text-neutral-900 dark:text-black-200"}`;
       return `${t} ${c} ${ne} ${oe}`;
     };
     return j(() => {
-      a && !p && (z?.(), E(!1));
-    }, [a, p, z]), j(() => {
+      a && !p && (R?.(), E(!1));
+    }, [a, p, R]), j(() => {
       s(o);
     }, [o]), /* @__PURE__ */ l(
       "div",
@@ -107,7 +107,7 @@ const Ie = ie(
                     ),
                     U && !K(x) && /* @__PURE__ */ e(ge, {}),
                     /* @__PURE__ */ e(fe, { labels: O }),
-                    N && /* @__PURE__ */ e(F, { placement: "top", title: N, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(ye, { className: "w-icon-sm h-icon-sm" }) }) })
+                    N && /* @__PURE__ */ e(F, { placement: "top", title: N, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(ye, {}) }) })
                   ] }),
                   /* @__PURE__ */ l("div", { className: "flex items-center gap-1 justify-self-end", children: [
                     K(x) && n ? /* @__PURE__ */ e(
@@ -190,11 +190,12 @@ const Ie = ie(
                   onClick: le,
                   className: "absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent",
                   variant: "ghost",
-                  disabled: $,
+                  disabled: S,
                   children: /* @__PURE__ */ e(
                     be,
                     {
-                      className: "text-neutral-900 dark:text-black-300 w-xs h-xs"
+                      className: "text-neutral-900 dark:text-black-300",
+                      sx: { fontSize: 16 }
                     }
                   )
                 }
@@ -206,11 +207,12 @@ const Ie = ie(
                   onClick: D,
                   className: "absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent",
                   variant: "ghost",
-                  disabled: $,
+                  disabled: S,
                   children: /* @__PURE__ */ e(
                     xe,
                     {
-                      className: "text-neutral-900 dark:text-black-300 w-xs h-xs"
+                      className: "text-neutral-900 dark:text-black-300",
+                      sx: { fontSize: 16 }
                     }
                   )
                 }
@@ -239,7 +241,7 @@ const Ie = ie(
               }
             )
           ] }),
-          f && r && y && S && /* @__PURE__ */ e(
+          f && r && y && $ && /* @__PURE__ */ e(
             "div",
             {
               role: "tooltip",
@@ -250,7 +252,7 @@ const Ie = ie(
               onKeyDown: (t) => {
                 t.key === "Escape" && k(!1);
               },
-              children: /* @__PURE__ */ e(S, { riskDetails: r })
+              children: /* @__PURE__ */ e($, { riskDetails: r })
             }
           )
         ]

package/dist/components/forms/dynamic-data-input/DynamicDataInputField.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicDataInputField.es.js","sources":["../../../../src/components/forms/dynamic-data-input/DynamicDataInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useRef, useState } from \"react\";\nimport { 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 { BoltOutlined, CloseRounded, NoteAddOutlined, TableChartRounded } 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 IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\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 DynamicDataModal component\n */\nexport interface DynamicDataModalProps {\n  isVisible: boolean;\n  onSelect: (data: string | number | readonly string[] | undefined) => void;\n  onClose: () => void;\n  dataKey: string;\n  dataSource: string;\n}\n\n/**\n * Props for the DynamicDataInputField component\n */\nexport interface DynamicDataInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label: string;\n  /** Placeholder text for the input */\n  placeholder?: string;\n  /** Color for the input text */\n  color?: string;\n  /** Current value of the input */\n  value: string | number | readonly string[] | undefined;\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  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string | number | readonly string[] | undefined;\n  /** Data source for dynamic data */\n  dataSource: string;\n  /** Data key for dynamic data */\n  dataKey: string;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: 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 the input is disabled */\n  disabled?: boolean;\n  /** Callback function called when value changes */\n  onChange: (value: string | number | readonly string[] | undefined) => void;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Whether to preserve original case in the label */\n  originalCase?: 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  /** Primary color shades for styling */\n  primaryColorShades?: Record<number, string>;\n  /** Whether recording is active (for pilot context) */\n  isRecording?: boolean;\n  /** Whether playback is active (for pilot context) */\n  isPlaying?: boolean;\n  /** Callback to set disable actions state */\n  setDisableActions?: (disabled: boolean) => void;\n  /** Toast function for deprecated field warning */\n  showDeprecatedFieldWarning?: () => void;\n  /** Dynamic data modal component */\n  DynamicDataModal?: React.ComponentType<DynamicDataModalProps>;\n}\n\n/**\n * A highly customizable dynamic data input component with label, validation, and styling support.\n * Features dynamic data modal integration, GTN support, risk analysis support,\n * and comprehensive prop support for various use cases.\n *\n * @example\n * ```tsx\n * <DynamicDataInputField\n *   id=\"dynamic-field\"\n *   label=\"Dynamic Field\"\n *   value={fieldValue}\n *   onChange={(value) => setFieldValue(value)}\n *   dataSource=\"sourceTable\"\n *   dataKey=\"fieldKey\"\n *   required\n * />\n * ```\n */\nexport const DynamicDataInputField = forwardRef<\n  HTMLInputElement,\n  DynamicDataInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      placeholder,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      required = false,\n      isRequiredConditional = false,\n      dataSource,\n      dataKey,\n      tags,\n      tooltip = \"\",\n      originalCase = false,\n      color = \"\",\n      isGTN = false,\n      gtnName,\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      labelClassName,\n      disabled = false,\n      isLiveField = false,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      primaryColorShades,\n      isRecording: _isRecording = false,\n      isPlaying: _isPlaying = false,\n      setDisableActions,\n      showDeprecatedFieldWarning,\n      DynamicDataModal,\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n    const [inputValue, setInputValue] = useState<\n      string | number | readonly string[] | undefined\n    >(value);\n    const [showDynamicDataModal, setShowDynamicDataModal] = useState(false);\n\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    // Use forwarded ref or internal ref\n    const combinedRef = (ref as React.RefObject<HTMLInputElement>) || inputRef;\n\n    const toggleDynamicDataModal = () => {\n      if (showDynamicDataModal) {\n        setDisableActions?.(false);\n      } else {\n        setDisableActions?.(true);\n      }\n      setShowDynamicDataModal(!showDynamicDataModal);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (event.keyCode === 9 || event.key === \"Enter\") {\n        const currentRef = combinedRef.current || inputRef.current;\n        if (currentRef) {\n          if (inputValue !== null) {\n            onChange(inputValue);\n          }\n          setInputValue(inputValue);\n          currentRef.blur();\n        }\n      }\n    };\n\n    const handleClear = () => {\n      setInputValue(\"\");\n      onChange(\"\");\n    };\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument && gtnName) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    const getClassName = (): string => {\n      const baseClasses =\n        \"border h-8 text-sm rounded-lg block w-full p-2.5 font-inter font-medium\";\n      const borderColor = errorMessage\n        ? \"border-red-300\"\n        : isRiskAnalysisOpen && riskDetails?.color\n        ? `border-${riskDetails?.color}-300`\n        : \"border-gray-300 dark:border-black-600\";\n      const placeholderColor = `placeholder:text-neutral-900 dark:placeholder:text-black-400`;\n      const backgroundColor = `${\n        isRiskAnalysisOpen && riskDetails?.color\n          ? `bg-${riskDetails?.color}-50`\n          : \"bg-gray-200 dark:bg-black-600 \"\n      } ${color ? color : \"text-neutral-900 dark:text-black-200\"}`;\n\n      return `${baseClasses} ${borderColor} ${backgroundColor} ${placeholderColor}`;\n    };\n\n    useEffect(() => {\n      if (showDynamicDataModal && !dataSource) {\n        showDeprecatedFieldWarning?.();\n        setShowDynamicDataModal(false);\n      }\n    }, [showDynamicDataModal, dataSource, showDeprecatedFieldWarning]);\n\n    // Sync inputValue with value prop\n    useEffect(() => {\n      setInputValue(value);\n    }, [value]);\n\n    return (\n      <div\n        className={cn(\n          `flex gap-0.5 w-full relative`,\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\",\n          { \"error-field\": !!errorMessage }\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\n        <div className={cn(`flex flex-col w-full`)}>\n          <label\n            htmlFor=\"text\"\n            className={`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n              !originalCase ? \"capitalize\" : \"\"\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              </div>\n\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-dynamic-data-input-add-to-document\"\n                    className=\"cursor-pointer\"\n                    onClick={() => handleAddGTNToDocument(value?.toString() || \"\")}\n                    type=\"button\"\n                  >\n                    <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n                      <NoteAddOutlined\n                        sx={{\n                          fontSize: 16,\n                          color:\n                            primaryColorShades?.[600] || \"var(--color-primary-600)\",\n                        }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block mt-1\">\n            <input\n              id={id}\n              ref={combinedRef}\n              required={required}\n              placeholder={placeholder}\n              className={getClassName()}\n              onChange={(e) => {\n                onChange(e.target.value);\n                setInputValue(e.target?.value);\n              }}\n              onKeyDown={handleKeyDown}\n              value={inputValue !== null ? inputValue : value}\n              defaultValue={defaultValue}\n              disabled={true}\n            />\n\n            <IconButton\n              id={`btn-dynamic-data-input-rx-cross`}\n              onClick={handleClear}\n              className=\"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <CloseRounded\n                className=\"text-neutral-900 dark:text-black-300 w-xs h-xs\"\n              />\n            </IconButton>\n\n            <IconButton\n              id={`btn-dynamic-data-input-ai-outline-pic-center`}\n              onClick={toggleDynamicDataModal}\n              className=\"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <TableChartRounded\n                className=\"text-neutral-900 dark:text-black-300 w-xs h-xs\"\n              />\n            </IconButton>\n          </label>\n\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\n          {showDynamicDataModal && DynamicDataModal && (\n            <DynamicDataModal\n              isVisible={showDynamicDataModal}\n              onSelect={(data) => {\n                onChange(data);\n                setInputValue(data);\n              }}\n              onClose={toggleDynamicDataModal}\n              dataKey={dataKey}\n              dataSource={dataSource}\n            />\n          )}\n        </div>\n\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\nDynamicDataInputField.displayName = \"DynamicDataInputField\";\n\n"],"names":["DynamicDataInputField","forwardRef","id","label","placeholder","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","dataSource","dataKey","tags","tooltip","originalCase","color","isGTN","gtnName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","labelClassName","disabled","isLiveField","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","primaryColorShades","_isRecording","_isPlaying","setDisableActions","showDeprecatedFieldWarning","DynamicDataModal","ref","t","useTranslation","isHovered","setIsHovered","useState","inputValue","setInputValue","showDynamicDataModal","setShowDynamicDataModal","inputRef","useRef","combinedRef","toggleDynamicDataModal","handleKeyDown","event","currentRef","handleClear","handleAddGTNToDocument","_value","getClassName","baseClasses","borderColor","placeholderColor","backgroundColor","useEffect","jsxs","cn","jsx","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","e","IconButton","CloseRounded","TableChartRounded","Typography","data"],"mappings":"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"}
+{"version":3,"file":"DynamicDataInputField.es.js","sources":["../../../../src/components/forms/dynamic-data-input/DynamicDataInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useRef, useState } from \"react\";\nimport { 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 { BoltOutlined, CloseRounded, NoteAddOutlined, TableChartRounded } 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 IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\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 DynamicDataModal component\n */\nexport interface DynamicDataModalProps {\n  isVisible: boolean;\n  onSelect: (data: string | number | readonly string[] | undefined) => void;\n  onClose: () => void;\n  dataKey: string;\n  dataSource: string;\n}\n\n/**\n * Props for the DynamicDataInputField component\n */\nexport interface DynamicDataInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label: string;\n  /** Placeholder text for the input */\n  placeholder?: string;\n  /** Color for the input text */\n  color?: string;\n  /** Current value of the input */\n  value: string | number | readonly string[] | undefined;\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  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string | number | readonly string[] | undefined;\n  /** Data source for dynamic data */\n  dataSource: string;\n  /** Data key for dynamic data */\n  dataKey: string;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: 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 the input is disabled */\n  disabled?: boolean;\n  /** Callback function called when value changes */\n  onChange: (value: string | number | readonly string[] | undefined) => void;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Whether to preserve original case in the label */\n  originalCase?: 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  /** Primary color shades for styling */\n  primaryColorShades?: Record<number, string>;\n  /** Whether recording is active (for pilot context) */\n  isRecording?: boolean;\n  /** Whether playback is active (for pilot context) */\n  isPlaying?: boolean;\n  /** Callback to set disable actions state */\n  setDisableActions?: (disabled: boolean) => void;\n  /** Toast function for deprecated field warning */\n  showDeprecatedFieldWarning?: () => void;\n  /** Dynamic data modal component */\n  DynamicDataModal?: React.ComponentType<DynamicDataModalProps>;\n}\n\n/**\n * A highly customizable dynamic data input component with label, validation, and styling support.\n * Features dynamic data modal integration, GTN support, risk analysis support,\n * and comprehensive prop support for various use cases.\n *\n * @example\n * ```tsx\n * <DynamicDataInputField\n *   id=\"dynamic-field\"\n *   label=\"Dynamic Field\"\n *   value={fieldValue}\n *   onChange={(value) => setFieldValue(value)}\n *   dataSource=\"sourceTable\"\n *   dataKey=\"fieldKey\"\n *   required\n * />\n * ```\n */\nexport const DynamicDataInputField = forwardRef<\n  HTMLInputElement,\n  DynamicDataInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      placeholder,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      required = false,\n      isRequiredConditional = false,\n      dataSource,\n      dataKey,\n      tags,\n      tooltip = \"\",\n      originalCase = false,\n      color = \"\",\n      isGTN = false,\n      gtnName,\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      labelClassName,\n      disabled = false,\n      isLiveField = false,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      primaryColorShades,\n      isRecording: _isRecording = false,\n      isPlaying: _isPlaying = false,\n      setDisableActions,\n      showDeprecatedFieldWarning,\n      DynamicDataModal,\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n    const [inputValue, setInputValue] = useState<\n      string | number | readonly string[] | undefined\n    >(value);\n    const [showDynamicDataModal, setShowDynamicDataModal] = useState(false);\n\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    // Use forwarded ref or internal ref\n    const combinedRef = (ref as React.RefObject<HTMLInputElement>) || inputRef;\n\n    const toggleDynamicDataModal = () => {\n      if (showDynamicDataModal) {\n        setDisableActions?.(false);\n      } else {\n        setDisableActions?.(true);\n      }\n      setShowDynamicDataModal(!showDynamicDataModal);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (event.keyCode === 9 || event.key === \"Enter\") {\n        const currentRef = combinedRef.current || inputRef.current;\n        if (currentRef) {\n          if (inputValue !== null) {\n            onChange(inputValue);\n          }\n          setInputValue(inputValue);\n          currentRef.blur();\n        }\n      }\n    };\n\n    const handleClear = () => {\n      setInputValue(\"\");\n      onChange(\"\");\n    };\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument && gtnName) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    const getClassName = (): string => {\n      const baseClasses =\n        \"border h-[32px] text-sm rounded-lg block w-full p-2.5 font-inter font-medium\";\n      const borderColor = errorMessage\n        ? \"border-red-300\"\n        : isRiskAnalysisOpen && riskDetails?.color\n        ? `border-${riskDetails?.color}-300`\n        : \"border-gray-300 dark:border-black-600\";\n      const placeholderColor = `placeholder:text-neutral-900 dark:placeholder:text-black-400`;\n      const backgroundColor = `${\n        isRiskAnalysisOpen && riskDetails?.color\n          ? `bg-${riskDetails?.color}-50`\n          : \"bg-gray-200 dark:bg-black-600 \"\n      } ${color ? color : \"text-neutral-900 dark:text-black-200\"}`;\n\n      return `${baseClasses} ${borderColor} ${backgroundColor} ${placeholderColor}`;\n    };\n\n    useEffect(() => {\n      if (showDynamicDataModal && !dataSource) {\n        showDeprecatedFieldWarning?.();\n        setShowDynamicDataModal(false);\n      }\n    }, [showDynamicDataModal, dataSource, showDeprecatedFieldWarning]);\n\n    // Sync inputValue with value prop\n    useEffect(() => {\n      setInputValue(value);\n    }, [value]);\n\n    return (\n      <div\n        className={cn(\n          `flex gap-0.5 w-full relative`,\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\",\n          { \"error-field\": !!errorMessage }\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\n        <div className={cn(`flex flex-col w-full`)}>\n          <label\n            htmlFor=\"text\"\n            className={`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n              !originalCase ? \"capitalize\" : \"\"\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              </div>\n\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-dynamic-data-input-add-to-document\"\n                    className=\"cursor-pointer\"\n                    onClick={() => handleAddGTNToDocument(value?.toString() || \"\")}\n                    type=\"button\"\n                  >\n                    <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n                      <NoteAddOutlined\n                        sx={{\n                          fontSize: 16,\n                          color:\n                            primaryColorShades?.[600] || \"var(--color-primary-600)\",\n                        }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block mt-1\">\n            <input\n              id={id}\n              ref={combinedRef}\n              required={required}\n              placeholder={placeholder}\n              className={getClassName()}\n              onChange={(e) => {\n                onChange(e.target.value);\n                setInputValue(e.target?.value);\n              }}\n              onKeyDown={handleKeyDown}\n              value={inputValue !== null ? inputValue : value}\n              defaultValue={defaultValue}\n              disabled={true}\n            />\n\n            <IconButton\n              id={`btn-dynamic-data-input-rx-cross`}\n              onClick={handleClear}\n              className=\"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <CloseRounded\n                className=\"text-neutral-900 dark:text-black-300\"\n                sx={{ fontSize: 16 }}\n              />\n            </IconButton>\n\n            <IconButton\n              id={`btn-dynamic-data-input-ai-outline-pic-center`}\n              onClick={toggleDynamicDataModal}\n              className=\"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent\"\n              variant=\"ghost\"\n              disabled={disabled}\n            >\n              <TableChartRounded\n                className=\"text-neutral-900 dark:text-black-300\"\n                sx={{ fontSize: 16 }}\n              />\n            </IconButton>\n          </label>\n\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\n          {showDynamicDataModal && DynamicDataModal && (\n            <DynamicDataModal\n              isVisible={showDynamicDataModal}\n              onSelect={(data) => {\n                onChange(data);\n                setInputValue(data);\n              }}\n              onClose={toggleDynamicDataModal}\n              dataKey={dataKey}\n              dataSource={dataSource}\n            />\n          )}\n        </div>\n\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\nDynamicDataInputField.displayName = \"DynamicDataInputField\";\n\n"],"names":["DynamicDataInputField","forwardRef","id","label","placeholder","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","dataSource","dataKey","tags","tooltip","originalCase","color","isGTN","gtnName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","labelClassName","disabled","isLiveField","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","primaryColorShades","_isRecording","_isPlaying","setDisableActions","showDeprecatedFieldWarning","DynamicDataModal","ref","t","useTranslation","isHovered","setIsHovered","useState","inputValue","setInputValue","showDynamicDataModal","setShowDynamicDataModal","inputRef","useRef","combinedRef","toggleDynamicDataModal","handleKeyDown","event","currentRef","handleClear","handleAddGTNToDocument","_value","getClassName","baseClasses","borderColor","placeholderColor","backgroundColor","useEffect","jsxs","cn","jsx","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","e","IconButton","CloseRounded","TableChartRounded","Typography","data"],"mappings":"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"}

package/dist/components/forms/field-options/Item.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../../../_virtual/index.cjs.js"),s=require("react-easy-sort"),l=require("./Icon.cjs.js"),d=require("../../icon/icons.generated.cjs.js"),c=t=>{const{value:a,index:i,onDeleteItem:n,userCanManage:r=!1}=t;return e.jsx(s.SortableItem,{children:e.jsxs("div",{className:o("relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-mediumtext-base font-inter border border-primary-100"),children:[r&&e.jsx(s.SortableKnob,{children:e.jsx("button",{id:"btn-data-display-close-modal",className:"pr-2 cursor-move",children:e.jsx(d.DragIndicatorIcon,{size:14,className:"text-primary-600 dark:text-primary-600"})})}),a,r&&e.jsxs("span",{className:"flex items-center gap-2.5 p-0.5 rounded-xl bg-primary-100 ml-auto cursor-pointer","data-dismiss-target":"#badge-dismiss-default","aria-label":"Remove",onClick:()=>{n(i)},children:[e.jsx(l.CloseIcon,{size:"w-2.5 h-2.5"}),e.jsx("span",{className:"sr-only",children:"Remove badge"})]})]})})};exports.Item=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../../../_virtual/index.cjs.js"),t=require("react-easy-sort"),l=require("./Icon.cjs.js"),d=require("../../icon/icons.generated.cjs.js"),c=s=>{const{value:a,index:i,onDeleteItem:n,userCanManage:r=!1}=s;return e.jsx(t.SortableItem,{children:e.jsxs("div",{className:o("relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-medium text-[14px] font-inter border border-primary-100"),children:[r&&e.jsx(t.SortableKnob,{children:e.jsx("button",{id:"btn-data-display-close-modal",className:"pr-2 cursor-move",children:e.jsx(d.DragIndicatorIcon,{size:14,className:"text-primary-600 dark:text-primary-600"})})}),a,r&&e.jsxs("span",{className:"flex items-center gap-2.5 p-0.5 rounded-xl bg-primary-100 ml-auto cursor-pointer","data-dismiss-target":"#badge-dismiss-default","aria-label":"Remove",onClick:()=>{n(i)},children:[e.jsx(l.CloseIcon,{size:"w-2.5 h-2.5"}),e.jsx("span",{className:"sr-only",children:"Remove badge"})]})]})})};exports.Item=c;
 //# sourceMappingURL=Item.cjs.js.map

package/dist/components/forms/field-options/Item.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Item.cjs.js","sources":["../../../../src/components/forms/field-options/Item.tsx"],"sourcesContent":["import cn from 'classnames';\nimport type { FC } from 'react';\nimport { SortableItem, SortableKnob } from 'react-easy-sort';\n\nimport { CloseIcon } from './Icon';\nimport type { TFieldOptionsProps } from './types';\nimport { DragIndicatorIcon } from '../../icon';\n\ntype TProps = Pick<TFieldOptionsProps, 'value' | 'onDeleteItem' | 'userCanManage'> & {\n  index: number;\n};\n\nexport const Item: FC<TProps> = (props) => {\n  const { value, index, onDeleteItem, userCanManage = false } = props;\n\n  return (\n    <SortableItem>\n      <div\n        className={cn(\n          'relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-mediumtext-base font-inter border border-primary-100',\n        )}\n      >\n         {userCanManage && (\n          <SortableKnob>\n            <button id={`btn-data-display-close-modal`} className='pr-2 cursor-move'>\n              <DragIndicatorIcon size={14} className='text-primary-600 dark:text-primary-600' />\n            </button>\n          </SortableKnob>\n        )}\n        {value}\n        {userCanManage && (\n          <span\n            className='flex items-center gap-2.5 p-0.5 rounded-xl bg-primary-100 ml-auto cursor-pointer'\n            data-dismiss-target='#badge-dismiss-default'\n            aria-label='Remove'\n            onClick={() => {\n              onDeleteItem(index);\n            }}\n          >\n            <CloseIcon size='w-2.5 h-2.5' />\n            <span className='sr-only'>{'Remove badge'}</span>\n          </span>\n        )}\n      </div>\n    </SortableItem>\n  );\n};\n\n\n\n"],"names":["Item","props","value","index","onDeleteItem","userCanManage","SortableItem","jsxs","cn","jsx","SortableKnob","DragIndicatorIcon","CloseIcon"],"mappings":"wQAYaA,EAAoBC,GAAU,CACzC,KAAM,CAAE,MAAAC,EAAA,MAAOC,EAAO,aAAAC,EAAc,cAAAC,EAAgB,IAAUJ,EAE9D,aACGK,EAAAA,aAAA,CACC,SAAAC,EAAAA,KAAC,MAAA,CACC,UAAWC,EACT,qKAAA,EAGA,SAAA,CAAAH,GACAI,EAAAA,IAACC,EAAAA,aAAA,CACC,SAAAD,MAAC,SAAA,CAAO,GAAI,+BAAgC,UAAU,mBACpD,SAAAA,EAAAA,IAACE,EAAAA,mBAAkB,KAAM,GAAI,UAAU,wCAAA,CAAyC,EAClF,EACF,EAEDT,EACAG,GACCE,EAAAA,KAAC,OAAA,CACC,UAAU,mFACV,sBAAoB,yBACpB,aAAW,SACX,QAAS,IAAM,CACbH,EAAaD,CAAK,CACpB,EAEA,SAAA,CAAAM,EAAAA,IAACG,EAAAA,UAAA,CAAU,KAAK,aAAA,CAAc,EAC9BH,EAAAA,IAAC,OAAA,CAAK,UAAU,UAAW,SAAA,cAAA,CAAe,CAAA,CAAA,CAAA,CAC5C,CAAA,CAAA,EAGN,CAEJ"}
+{"version":3,"file":"Item.cjs.js","sources":["../../../../src/components/forms/field-options/Item.tsx"],"sourcesContent":["import cn from 'classnames';\nimport type { FC } from 'react';\nimport { SortableItem, SortableKnob } from 'react-easy-sort';\n\nimport { CloseIcon } from './Icon';\nimport type { TFieldOptionsProps } from './types';\nimport { DragIndicatorIcon } from '../../icon';\n\ntype TProps = Pick<TFieldOptionsProps, 'value' | 'onDeleteItem' | 'userCanManage'> & {\n  index: number;\n};\n\nexport const Item: FC<TProps> = (props) => {\n  const { value, index, onDeleteItem, userCanManage = false } = props;\n\n  return (\n    <SortableItem>\n      <div\n        className={cn(\n          'relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-medium text-[14px] font-inter border border-primary-100',\n        )}\n      >\n         {userCanManage && (\n          <SortableKnob>\n            <button id={`btn-data-display-close-modal`} className='pr-2 cursor-move'>\n              <DragIndicatorIcon size={14} className='text-primary-600 dark:text-primary-600' />\n            </button>\n          </SortableKnob>\n        )}\n        {value}\n        {userCanManage && (\n          <span\n            className='flex items-center gap-2.5 p-0.5 rounded-xl bg-primary-100 ml-auto cursor-pointer'\n            data-dismiss-target='#badge-dismiss-default'\n            aria-label='Remove'\n            onClick={() => {\n              onDeleteItem(index);\n            }}\n          >\n            <CloseIcon size='w-2.5 h-2.5' />\n            <span className='sr-only'>{'Remove badge'}</span>\n          </span>\n        )}\n      </div>\n    </SortableItem>\n  );\n};\n\n\n\n"],"names":["Item","props","value","index","onDeleteItem","userCanManage","SortableItem","jsxs","cn","jsx","SortableKnob","DragIndicatorIcon","CloseIcon"],"mappings":"wQAYaA,EAAoBC,GAAU,CACzC,KAAM,CAAE,MAAAC,EAAA,MAAOC,EAAO,aAAAC,EAAc,cAAAC,EAAgB,IAAUJ,EAE9D,aACGK,EAAAA,aAAA,CACC,SAAAC,EAAAA,KAAC,MAAA,CACC,UAAWC,EACT,wKAAA,EAGA,SAAA,CAAAH,GACAI,EAAAA,IAACC,EAAAA,aAAA,CACC,SAAAD,MAAC,SAAA,CAAO,GAAI,+BAAgC,UAAU,mBACpD,SAAAA,EAAAA,IAACE,EAAAA,mBAAkB,KAAM,GAAI,UAAU,wCAAA,CAAyC,EAClF,EACF,EAEDT,EACAG,GACCE,EAAAA,KAAC,OAAA,CACC,UAAU,mFACV,sBAAoB,yBACpB,aAAW,SACX,QAAS,IAAM,CACbH,EAAaD,CAAK,CACpB,EAEA,SAAA,CAAAM,EAAAA,IAACG,EAAAA,UAAA,CAAU,KAAK,aAAA,CAAc,EAC9BH,EAAAA,IAAC,OAAA,CAAK,UAAU,UAAW,SAAA,cAAA,CAAe,CAAA,CAAA,CAAA,CAC5C,CAAA,CAAA,EAGN,CAEJ"}

package/dist/components/forms/field-options/Item.es.js

@@ -1,15 +1,15 @@
 import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import m from "../../../_virtual/index.es.js";
+import s from "../../../_virtual/index.es.js";
 import { SortableItem as n, SortableKnob as l } from "react-easy-sort";
 import { CloseIcon as d } from "./Icon.es.js";
 import { DragIndicatorIcon as c } from "../../icon/icons.generated.es.js";
 const g = (t) => {
-  const { value: o, index: s, onDeleteItem: i, userCanManage: r = !1 } = t;
+  const { value: o, index: i, onDeleteItem: m, userCanManage: r = !1 } = t;
   return /* @__PURE__ */ e(n, { children: /* @__PURE__ */ a(
     "div",
     {
-      className: m(
-        "relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-mediumtext-base font-inter border border-primary-100"
+      className: s(
+        "relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-medium text-[14px] font-inter border border-primary-100"
       ),
       children: [
         r && /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e("button", { id: "btn-data-display-close-modal", className: "pr-2 cursor-move", children: /* @__PURE__ */ e(c, { size: 14, className: "text-primary-600 dark:text-primary-600" }) }) }),
@@ -21,7 +21,7 @@ const g = (t) => {
             "data-dismiss-target": "#badge-dismiss-default",
             "aria-label": "Remove",
             onClick: () => {
-              i(s);
+              m(i);
             },
             children: [
               /* @__PURE__ */ e(d, { size: "w-2.5 h-2.5" }),

package/dist/components/forms/field-options/Item.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Item.es.js","sources":["../../../../src/components/forms/field-options/Item.tsx"],"sourcesContent":["import cn from 'classnames';\nimport type { FC } from 'react';\nimport { SortableItem, SortableKnob } from 'react-easy-sort';\n\nimport { CloseIcon } from './Icon';\nimport type { TFieldOptionsProps } from './types';\nimport { DragIndicatorIcon } from '../../icon';\n\ntype TProps = Pick<TFieldOptionsProps, 'value' | 'onDeleteItem' | 'userCanManage'> & {\n  index: number;\n};\n\nexport const Item: FC<TProps> = (props) => {\n  const { value, index, onDeleteItem, userCanManage = false } = props;\n\n  return (\n    <SortableItem>\n      <div\n        className={cn(\n          'relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-mediumtext-base font-inter border border-primary-100',\n        )}\n      >\n         {userCanManage && (\n          <SortableKnob>\n            <button id={`btn-data-display-close-modal`} className='pr-2 cursor-move'>\n              <DragIndicatorIcon size={14} className='text-primary-600 dark:text-primary-600' />\n            </button>\n          </SortableKnob>\n        )}\n        {value}\n        {userCanManage && (\n          <span\n            className='flex items-center gap-2.5 p-0.5 rounded-xl bg-primary-100 ml-auto cursor-pointer'\n            data-dismiss-target='#badge-dismiss-default'\n            aria-label='Remove'\n            onClick={() => {\n              onDeleteItem(index);\n            }}\n          >\n            <CloseIcon size='w-2.5 h-2.5' />\n            <span className='sr-only'>{'Remove badge'}</span>\n          </span>\n        )}\n      </div>\n    </SortableItem>\n  );\n};\n\n\n\n"],"names":["Item","props","value","index","onDeleteItem","userCanManage","SortableItem","jsxs","cn","jsx","SortableKnob","DragIndicatorIcon","CloseIcon"],"mappings":";;;;;AAYO,MAAMA,IAAmB,CAACC,MAAU;AACzC,QAAM,EAAE,OAAAC,GAAO,OAAAC,GAAO,cAAAC,GAAc,eAAAC,IAAgB,OAAUJ;AAE9D,2BACGK,GAAA,EACC,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,MAAA;AAAA,MAGA,UAAA;AAAA,QAAAH,KACA,gBAAAI,EAACC,GAAA,EACC,UAAA,gBAAAD,EAAC,UAAA,EAAO,IAAI,gCAAgC,WAAU,oBACpD,UAAA,gBAAAA,EAACE,KAAkB,MAAM,IAAI,WAAU,yCAAA,CAAyC,GAClF,GACF;AAAA,QAEDT;AAAA,QACAG,KACC,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,uBAAoB;AAAA,YACpB,cAAW;AAAA,YACX,SAAS,MAAM;AACb,cAAAH,EAAaD,CAAK;AAAA,YACpB;AAAA,YAEA,UAAA;AAAA,cAAA,gBAAAM,EAACG,GAAA,EAAU,MAAK,cAAA,CAAc;AAAA,cAC9B,gBAAAH,EAAC,QAAA,EAAK,WAAU,WAAW,UAAA,eAAA,CAAe;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAC5C;AAAA,IAAA;AAAA,EAAA,GAGN;AAEJ;"}
+{"version":3,"file":"Item.es.js","sources":["../../../../src/components/forms/field-options/Item.tsx"],"sourcesContent":["import cn from 'classnames';\nimport type { FC } from 'react';\nimport { SortableItem, SortableKnob } from 'react-easy-sort';\n\nimport { CloseIcon } from './Icon';\nimport type { TFieldOptionsProps } from './types';\nimport { DragIndicatorIcon } from '../../icon';\n\ntype TProps = Pick<TFieldOptionsProps, 'value' | 'onDeleteItem' | 'userCanManage'> & {\n  index: number;\n};\n\nexport const Item: FC<TProps> = (props) => {\n  const { value, index, onDeleteItem, userCanManage = false } = props;\n\n  return (\n    <SortableItem>\n      <div\n        className={cn(\n          'relative flex items-center px-1.5 py-0.5 text-sm text-primary-600 bg-primary-50 dark:bg-black-700 rounded font-medium text-[14px] font-inter border border-primary-100',\n        )}\n      >\n         {userCanManage && (\n          <SortableKnob>\n            <button id={`btn-data-display-close-modal`} className='pr-2 cursor-move'>\n              <DragIndicatorIcon size={14} className='text-primary-600 dark:text-primary-600' />\n            </button>\n          </SortableKnob>\n        )}\n        {value}\n        {userCanManage && (\n          <span\n            className='flex items-center gap-2.5 p-0.5 rounded-xl bg-primary-100 ml-auto cursor-pointer'\n            data-dismiss-target='#badge-dismiss-default'\n            aria-label='Remove'\n            onClick={() => {\n              onDeleteItem(index);\n            }}\n          >\n            <CloseIcon size='w-2.5 h-2.5' />\n            <span className='sr-only'>{'Remove badge'}</span>\n          </span>\n        )}\n      </div>\n    </SortableItem>\n  );\n};\n\n\n\n"],"names":["Item","props","value","index","onDeleteItem","userCanManage","SortableItem","jsxs","cn","jsx","SortableKnob","DragIndicatorIcon","CloseIcon"],"mappings":";;;;;AAYO,MAAMA,IAAmB,CAACC,MAAU;AACzC,QAAM,EAAE,OAAAC,GAAO,OAAAC,GAAO,cAAAC,GAAc,eAAAC,IAAgB,OAAUJ;AAE9D,2BACGK,GAAA,EACC,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,MAAA;AAAA,MAGA,UAAA;AAAA,QAAAH,KACA,gBAAAI,EAACC,GAAA,EACC,UAAA,gBAAAD,EAAC,UAAA,EAAO,IAAI,gCAAgC,WAAU,oBACpD,UAAA,gBAAAA,EAACE,KAAkB,MAAM,IAAI,WAAU,yCAAA,CAAyC,GAClF,GACF;AAAA,QAEDT;AAAA,QACAG,KACC,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,uBAAoB;AAAA,YACpB,cAAW;AAAA,YACX,SAAS,MAAM;AACb,cAAAH,EAAaD,CAAK;AAAA,YACpB;AAAA,YAEA,UAAA;AAAA,cAAA,gBAAAM,EAACG,GAAA,EAAU,MAAK,cAAA,CAAc;AAAA,cAC9B,gBAAAH,EAAC,QAAA,EAAK,WAAU,WAAW,UAAA,eAAA,CAAe;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAC5C;AAAA,IAAA;AAAA,EAAA,GAGN;AAEJ;"}

package/dist/components/forms/formula-input/FormulaInput.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const s=require("react/jsx-runtime"),F=require("../../../_virtual/index.cjs.js"),e=require("react"),ee=require("react-contenteditable"),te=require("react-dom"),z=require("@mui/icons-material"),B=require("../../data-display/typography/Typography.cjs.js"),re=require("../../button/IconButton.cjs.js"),se=require("../../tooltip/Tooltip.cjs.js"),ne=require("../../icons/HelpIcon.cjs.js"),oe=require("../../../hooks/useOutsideClick.cjs.js"),I=require("./utils.cjs.js"),ae=require("../shared/InputLabel.cjs.js"),ce=require("../../../node_modules/@popperjs/core/lib/popper.cjs.js"),le=({value:u="",onChange:b,onFocus:q,onBlur:T,label:v,id:L,required:M,tooltip:D,placeholder:K,disabled:p,errorMessage:y,width:H="100%",suggestions:S=[],showRawValue:U=!1})=>{const c=e.useRef(null),R=e.useRef(null),m=e.useRef(null),j=e.useRef([]),g=e.useRef(null),[a,f]=e.useState(!1),[C,N]=e.useState(""),[d,w]=e.useState(0),[x,$]=e.useState(U),A=e.useRef(a),E=e.useRef([]),V=e.useRef(d),P=e.useRef(u);e.useEffect(()=>{A.current=a},[a]),e.useEffect(()=>{V.current=d},[d]),e.useEffect(()=>{P.current=u},[u]),oe.useOutsideClick({ref:m,handler:()=>{a&&f(!1)}});const h=e.useMemo(()=>{if(!C)return S;const t=C.toLowerCase();return S.filter(r=>r.toLowerCase().includes(t))},[S,C]);e.useEffect(()=>{E.current=h},[h]),e.useEffect(()=>{w(0)},[h]),e.useEffect(()=>{a&&j.current[d]&&j.current[d]?.scrollIntoView({block:"nearest",behavior:"smooth"})},[d,a]),e.useEffect(()=>{if(a&&R.current&&m.current)return g.current=ce.createPopper(R.current,m.current,{placement:"bottom-start",strategy:"fixed",modifiers:[{name:"flip",options:{fallbackPlacements:["top-start","bottom-start"]}},{name:"preventOverflow",options:{boundary:"viewport",padding:8}},{name:"offset",options:{offset:[0,4]}}]}),()=>{g.current&&(g.current.destroy(),g.current=null)}},[a]);const W=e.useCallback(t=>{const r=I.convertFromPills(t.target.value);b(r);const n=I.getTextBeforeCursor(),l=n.lastIndexOf("@");if(l!==-1){const i=n.slice(l+1);i.includes(" ")?f(!1):(N(i),f(!0))}else f(!1)},[b]),G=e.useCallback(()=>{c.current&&(c.current.isFocused=!0),q?.()},[q]),J=e.useCallback(t=>{c.current&&(c.current.isFocused=!1);const r=t.relatedTarget;r&&m.current?.contains(r)||(setTimeout(()=>{f(!1)},200),T?.())},[T]),k=e.useCallback(t=>{if(!c.current)return;const r=P.current,n=r.lastIndexOf("@");if(n!==-1){const i=r.slice(n+1).search(/\s/);let o;i===-1?o=r.length:o=n+1+i;const Y=r.slice(0,n),Z=r.slice(o),_=`${Y}{{${t}}}${Z}`;b(_),f(!1),N(""),setTimeout(()=>{c.current?.focus()},0)}},[b]),O=e.useCallback(t=>{const r=A.current,n=E.current,l=V.current;if(t.key==="Enter"){t.preventDefault(),t.stopPropagation(),r&&n.length>0&&n[l]&&k(n[l]);return}if(r&&n.length>0){const{key:i}=t;if(["ArrowDown","ArrowUp","Escape","Tab"].includes(i))switch(t.preventDefault(),t.stopPropagation(),i){case"ArrowDown":w(o=>o<n.length-1?o+1:o);break;case"ArrowUp":w(o=>o>0?o-1:0);break;case"Escape":f(!1);break;case"Tab":n[l]&&k(n[l]);break}}},[k]),Q=e.useCallback(t=>{t.preventDefault();const r=t.clipboardData.getData("text/plain");document.execCommand("insertText",!1,r)},[]),X=e.useMemo(()=>x?u:I.convertToPills(u),[u,x]);return s.jsxs("div",{className:"w-full",children:[v&&s.jsxs("div",{className:"text-xs font-medium text-gray-600 inline-flex items-center gap-1 font-inter text-left whitespace-nowrap flex-wrap",children:[s.jsx(ae.InputLabel,{label:v||"",required:M||!1}),D&&s.jsx(se,{placement:"top",title:D,children:s.jsx("div",{className:"cursor-pointer",children:s.jsx(ne.HelpIcon,{className:"w-icon-sm h-icon-sm"})})})]}),s.jsxs("div",{className:"relative",ref:R,children:[u?.trim()?null:s.jsx("div",{className:"absolute top-0 left-0 w-full h-full text-gray-400 flex items-center cursor-text px-3 z-50",onClick:()=>c.current?.focus(),children:s.jsx(B.Typography,{size:"extra-small",variant:"medium",children:K})}),s.jsxs("div",{className:"relative",children:[s.jsx(ee,{innerRef:c,className:F("min-h-[42px] rounded-lg p-2.5","text-sm font-inter block font-medium border text-gray-900 dark:text-white whitespace-normal break-words text-left",p?"bg-neutral-100 dark:bg-black-800":"bg-white dark:bg-black-800",!p&&"pr-[60px]",y?"!border-error-500":"border-gray-300 dark:border-black-600 focus:ring-blue-500 focus:border-blue-500","cursor-text"),style:{width:H,wordBreak:"break-word"},html:X,onChange:p?()=>null:W,onFocus:G,onBlur:J,onKeyDownCapture:O,onKeyDown:O,onPaste:Q,disabled:p,id:L}),!p&&s.jsx("div",{className:"absolute right-0 top-0 bottom-0 flex items-center align-middle justify-center p-3 gap-2",children:s.jsx(re,{tooltip:x?"Show Formatted":"Show Raw Value",variant:"ghost",onClick:()=>$(!x),children:x?s.jsx(z.VisibilityOutlined,{sx:{fontSize:18}}):s.jsx(z.VisibilityOffOutlined,{sx:{fontSize:18}})})})]}),a&&h.length>0&&te.createPortal(s.jsx("div",{ref:m,className:"z-[3000] bg-white dark:bg-black-800 border border-gray-300 dark:border-black-600 rounded-lg shadow-lg max-h-60 overflow-y-auto min-w-[200px]",onMouseDown:t=>{t.preventDefault()},children:h.map((t,r)=>s.jsx("div",{ref:n=>j.current[r]=n,className:F("px-3 py-2 cursor-pointer text-sm font-inter",r===d?"bg-primary-100 dark:bg-primary-900 text-primary-700 dark:text-primary-300":"hover:bg-gray-100 dark:hover:bg-black-700 text-gray-900 dark:text-white"),onClick:()=>k(t),onMouseEnter:()=>w(r),children:t},t))}),document.body)]}),y&&s.jsx("div",{className:"pt-1",children:s.jsx(B.Typography,{className:"text-error-500",size:"extra-small",variant:"medium",appearance:"custom",children:y})})]})},ie=e.memo(le);module.exports=ie;
+"use strict";const s=require("react/jsx-runtime"),F=require("../../../_virtual/index.cjs.js"),e=require("react"),ee=require("react-contenteditable"),te=require("react-dom"),z=require("@mui/icons-material"),B=require("../../data-display/typography/Typography.cjs.js"),re=require("../../button/IconButton.cjs.js"),se=require("../../tooltip/Tooltip.cjs.js"),ne=require("../../icons/HelpIcon.cjs.js"),oe=require("../../../hooks/useOutsideClick.cjs.js"),I=require("./utils.cjs.js"),ae=require("../shared/InputLabel.cjs.js"),ce=require("../../../node_modules/@popperjs/core/lib/popper.cjs.js"),le=({value:u="",onChange:b,onFocus:q,onBlur:T,label:v,id:L,required:M,tooltip:D,placeholder:K,disabled:p,errorMessage:y,width:H="100%",suggestions:S=[],showRawValue:U=!1})=>{const c=e.useRef(null),R=e.useRef(null),m=e.useRef(null),j=e.useRef([]),g=e.useRef(null),[a,f]=e.useState(!1),[C,A]=e.useState(""),[d,w]=e.useState(0),[x,$]=e.useState(U),E=e.useRef(a),N=e.useRef([]),V=e.useRef(d),P=e.useRef(u);e.useEffect(()=>{E.current=a},[a]),e.useEffect(()=>{V.current=d},[d]),e.useEffect(()=>{P.current=u},[u]),oe.useOutsideClick({ref:m,handler:()=>{a&&f(!1)}});const h=e.useMemo(()=>{if(!C)return S;const t=C.toLowerCase();return S.filter(r=>r.toLowerCase().includes(t))},[S,C]);e.useEffect(()=>{N.current=h},[h]),e.useEffect(()=>{w(0)},[h]),e.useEffect(()=>{a&&j.current[d]&&j.current[d]?.scrollIntoView({block:"nearest",behavior:"smooth"})},[d,a]),e.useEffect(()=>{if(a&&R.current&&m.current)return g.current=ce.createPopper(R.current,m.current,{placement:"bottom-start",strategy:"fixed",modifiers:[{name:"flip",options:{fallbackPlacements:["top-start","bottom-start"]}},{name:"preventOverflow",options:{boundary:"viewport",padding:8}},{name:"offset",options:{offset:[0,4]}}]}),()=>{g.current&&(g.current.destroy(),g.current=null)}},[a]);const W=e.useCallback(t=>{const r=I.convertFromPills(t.target.value);b(r);const n=I.getTextBeforeCursor(),l=n.lastIndexOf("@");if(l!==-1){const i=n.slice(l+1);i.includes(" ")?f(!1):(A(i),f(!0))}else f(!1)},[b]),G=e.useCallback(()=>{c.current&&(c.current.isFocused=!0),q?.()},[q]),J=e.useCallback(t=>{c.current&&(c.current.isFocused=!1);const r=t.relatedTarget;r&&m.current?.contains(r)||(setTimeout(()=>{f(!1)},200),T?.())},[T]),k=e.useCallback(t=>{if(!c.current)return;const r=P.current,n=r.lastIndexOf("@");if(n!==-1){const i=r.slice(n+1).search(/\s/);let o;i===-1?o=r.length:o=n+1+i;const Y=r.slice(0,n),Z=r.slice(o),_=`${Y}{{${t}}}${Z}`;b(_),f(!1),A(""),setTimeout(()=>{c.current?.focus()},0)}},[b]),O=e.useCallback(t=>{const r=E.current,n=N.current,l=V.current;if(t.key==="Enter"){t.preventDefault(),t.stopPropagation(),r&&n.length>0&&n[l]&&k(n[l]);return}if(r&&n.length>0){const{key:i}=t;if(["ArrowDown","ArrowUp","Escape","Tab"].includes(i))switch(t.preventDefault(),t.stopPropagation(),i){case"ArrowDown":w(o=>o<n.length-1?o+1:o);break;case"ArrowUp":w(o=>o>0?o-1:0);break;case"Escape":f(!1);break;case"Tab":n[l]&&k(n[l]);break}}},[k]),Q=e.useCallback(t=>{t.preventDefault();const r=t.clipboardData.getData("text/plain");document.execCommand("insertText",!1,r)},[]),X=e.useMemo(()=>x?u:I.convertToPills(u),[u,x]);return s.jsxs("div",{className:"w-full",children:[v&&s.jsxs("div",{className:"text-xs font-medium text-gray-600 inline-flex items-center gap-1 font-inter text-left whitespace-nowrap flex-wrap",children:[s.jsx(ae.InputLabel,{label:v||"",required:M||!1}),D&&s.jsx(se,{placement:"top",title:D,children:s.jsx("div",{className:"cursor-pointer",children:s.jsx(ne.HelpIcon,{})})})]}),s.jsxs("div",{className:"relative",ref:R,children:[u?.trim()?null:s.jsx("div",{className:"absolute top-0 left-0 w-full h-full text-gray-400 flex items-center cursor-text px-3 z-50",onClick:()=>c.current?.focus(),children:s.jsx(B.Typography,{size:"extra-small",variant:"medium",children:K})}),s.jsxs("div",{className:"relative",children:[s.jsx(ee,{innerRef:c,className:F("min-h-[42px] rounded-lg p-2.5","text-sm font-inter block font-medium border text-gray-900 dark:text-white whitespace-normal break-words text-left",p?"bg-neutral-100 dark:bg-black-800":"bg-white dark:bg-black-800",!p&&"pr-[60px]",y?"!border-error-500":"border-gray-300 dark:border-black-600 focus:ring-blue-500 focus:border-blue-500","cursor-text"),style:{width:H,wordBreak:"break-word"},html:X,onChange:p?()=>null:W,onFocus:G,onBlur:J,onKeyDownCapture:O,onKeyDown:O,onPaste:Q,disabled:p,id:L}),!p&&s.jsx("div",{className:"absolute right-0 top-0 bottom-0 flex items-center align-middle justify-center p-3 gap-2",children:s.jsx(re,{tooltip:x?"Show Formatted":"Show Raw Value",variant:"ghost",onClick:()=>$(!x),children:x?s.jsx(z.VisibilityOutlined,{sx:{fontSize:18}}):s.jsx(z.VisibilityOffOutlined,{sx:{fontSize:18}})})})]}),a&&h.length>0&&te.createPortal(s.jsx("div",{ref:m,className:"z-[3000] bg-white dark:bg-black-800 border border-gray-300 dark:border-black-600 rounded-lg shadow-lg max-h-60 overflow-y-auto min-w-[200px]",onMouseDown:t=>{t.preventDefault()},children:h.map((t,r)=>s.jsx("div",{ref:n=>j.current[r]=n,className:F("px-3 py-2 cursor-pointer text-sm font-inter",r===d?"bg-primary-100 dark:bg-primary-900 text-primary-700 dark:text-primary-300":"hover:bg-gray-100 dark:hover:bg-black-700 text-gray-900 dark:text-white"),onClick:()=>k(t),onMouseEnter:()=>w(r),children:t},t))}),document.body)]}),y&&s.jsx("div",{className:"pt-1",children:s.jsx(B.Typography,{className:"text-error-500",size:"extra-small",variant:"medium",appearance:"custom",children:y})})]})},ie=e.memo(le);module.exports=ie;
 //# sourceMappingURL=FormulaInput.cjs.js.map