@lax-wp/design-system 0.13.29 → 0.13.33-beta.0

package/dist/components/forms/percentage-input/PercentageInputField.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"PercentageInputField.es.js","sources":["../../../../src/components/forms/percentage-input/PercentageInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, 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, NoteAddOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { InputLabel } from \"../shared/InputLabel\";\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 PercentageInputField component\n */\nexport interface PercentageInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label?: string;\n  /** Current value of the input */\n  value: string;\n  /** Callback function called when value changes */\n  onChange: (data: any) => void;\n  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Maximum value allowed */\n  max?: number;\n  /** Minimum value allowed */\n  min?: number;\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  /** Background color class */\n  bg?: string;\n  /** Tags/labels to display next to the label */\n  tags?: (string | LabelType)[];\n  /** Text color class */\n  color?: string;\n  /** Additional CSS classes for the wrapper */\n  className?: string;\n  /** Whether to preserve original case in the label */\n  originalCase?: boolean;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether to use simple mode (inline label style) */\n  simpleMode?: boolean;\n  /** Additional CSS classes for the input field */\n  inputFieldClassName?: string;\n  /** Whether the value was AI extracted */\n  isAiExtracted?: boolean;\n  /** Confidence percentage shown as a badge */\n  confidenceScore?: number;\n  /** Confidence classification for badge styling */\n  confidenceType?: ConfidenceScoreType;\n  /** Optional tooltip content for confidence badge */\n  confidenceTooltip?: React.ReactNode;\n  /** Source meta for confidence score */\n  sourceMeta?: SourceMetaItem[];\n  /** Handler fired when confidence score badge is clicked */\n  onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: any;\n  /** Inline styles for the input element */\n  inputStyle?: React.CSSProperties;\n  /** Whether to show dollar sign (for simpleMode) */\n  withDollarSign?: boolean;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Callback function called when input loses focus */\n  onBlur?: () => void;\n  /** 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  /** Input placeholder */\n  placeholder?: string\n}\n\n/**\n * A highly customizable percentage input component with label, validation, and styling support.\n * Features GTN integration, risk analysis support, AI extraction indicator, and comprehensive prop support.\n *\n * @example\n * ```tsx\n * <PercentageInputField\n *   id=\"discount\"\n *   label=\"Discount Percentage\"\n *   value={discount}\n *   onChange={(value) => setDiscount(value)}\n *   required\n * />\n * ```\n */\nexport const PercentageInputField = forwardRef<\n  HTMLInputElement,\n  PercentageInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      disabled,\n      max,\n      min,\n      required = false,\n      isRequiredConditional = false,\n      bg,\n      tags,\n      color,\n      className,\n      originalCase = false,\n      tooltip,\n      simpleMode = false,\n      inputFieldClassName = \"\",\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      isGTN = false,\n      gtnName = null,\n      inputStyle,\n      withDollarSign = true,\n      labelClassName,\n      isLiveField = false,\n      onBlur,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      placeholder,\n      ...props\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    // Simple mode rendering\n    if (simpleMode) {\n      return (\n        <label\n          id={id}\n          className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-200 inline-flex items-center gap-1 ${\n            !originalCase ? \"capitalize\" : \"\"\n          } ${labelClassName || \"\"}`}\n        >\n          {withDollarSign && (\n            <span className=\"absolute inset-y-0 left-1 flex items-center pl-3\">\n              {\"$\"}\n            </span>\n          )}\n          <input\n            {...props}\n            ref={ref}\n            onBlur={onBlur}\n            type=\"number\"\n            required={required}\n            className={cn(inputFieldClassName, \"pl-8 h-[32px]\")}\n            onChange={(e) => {\n              onChange(e.target.value);\n            }}\n            value={value}\n            {...(defaultValue && !value ? { defaultValue: defaultValue } : {})}\n            id={id || label}\n            style={inputStyle}\n            autoComplete=\"off\"\n          />\n        </label>\n      );\n    }\n\n    // Full mode rendering\n    return (\n      <div\n        className={cn(\n          \"flex gap-0.5 relative\",\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\"\n        )}\n        onMouseEnter={() => setIsHovered(true)}\n        onMouseLeave={() => setIsHovered(false)}\n      >\n        {isGTN && !isHovered ? (\n          <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n        ) : null}\n        <div className={cn(\"w-full flex flex-col\", className)}>\n          <label\n            htmlFor=\"text\"\n            className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-300 inline-flex items-center gap-1 ${\n              !originalCase ? \"uppercase\" : \"\"\n            } ${labelClassName || \"\"}`}\n          >\n            <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n              <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap dark:text-black-300\">\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-percentage-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                        className=\"text-primary-600\"\n                        sx={{ fontSize: 16 }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block\">\n            <input\n              {...props}\n              ref={ref}\n              onBlur={onBlur}\n              type=\"number\"\n              required={required}\n              disabled={disabled}\n              min={min}\n              max={max}\n              className={`border ${\n                errorMessage\n                  ? \"border-red-300\"\n                  : isRiskAnalysisOpen && riskDetails?.color\n                  ? `border-${riskDetails.color}-300`\n                  : \"border-gray-300\"\n              } ${bg} h-[32px] text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium \n              disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\n              ${\n                isRiskAnalysisOpen &&\n                riskDetails?.color &&\n                `bg-${riskDetails.color}-50`\n              }\n              ${color || \"\"}\n              `}\n              onChange={(e) => {\n                onChange(e.target.value);\n              }}\n              value={value}\n              defaultValue={defaultValue}\n              id={id || label}\n              style={inputStyle}\n              autoComplete=\"off\"\n              placeholder={placeholder}\n            />\n            <span className=\"absolute inset-y-0 right-3 flex items-center z-[1000px] h-full dark:text-black-100\">\n              %\n            </span>\n          </label>\n          {errorMessage && (\n            <Typography\n              className=\"text-error-500 mt-1\"\n              appearance=\"custom\"\n              size=\"extra-small\"\n              variant=\"medium\"\n            >\n              {errorMessage}\n            </Typography>\n          )}\n        </div>\n\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\nPercentageInputField.displayName = \"PercentageInputField\";\n"],"names":["PercentageInputField","forwardRef","id","label","value","onChange","errorMessage","defaultValue","disabled","max","min","required","isRequiredConditional","bg","tags","color","className","originalCase","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","isGTN","gtnName","inputStyle","withDollarSign","labelClassName","isLiveField","onBlur","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","placeholder","props","ref","t","useTranslation","isHovered","setIsHovered","useState","handleAddGTNToDocument","_value","jsxs","jsx","cn","e","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","Typography"],"mappings":"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"}
+{"version":3,"file":"PercentageInputField.es.js","sources":["../../../../src/components/forms/percentage-input/PercentageInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, 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, NoteAddOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport {\n  getConfidenceScoreBadgeClass,\n  getConfidenceScoreBadgeColor,\n  getConfidenceScoreBadgeFill,\n  getConfidenceScoreBadgeTextColor,\n  shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { InputLabel } from \"../shared/InputLabel\";\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 PercentageInputField component\n */\nexport interface PercentageInputFieldProps {\n  /** Unique identifier for the input */\n  id: string;\n  /** Label text to display above the input */\n  label?: string;\n  /** Current value of the input */\n  value: string;\n  /** Callback function called when value changes */\n  onChange: (data: any) => void;\n  /** Error message to display below the input */\n  errorMessage?: string;\n  /** Default value for the input */\n  defaultValue?: string;\n  /** Whether the input is disabled */\n  disabled?: boolean;\n  /** Maximum value allowed */\n  max?: number;\n  /** Minimum value allowed */\n  min?: number;\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  /** Background color class */\n  bg?: string;\n  /** Tags/labels to display next to the label */\n  tags?: (string | LabelType)[];\n  /** Text color class */\n  color?: string;\n  /** Additional CSS classes for the wrapper */\n  className?: string;\n  /** Whether to preserve original case in the label */\n  originalCase?: boolean;\n  /** Tooltip text for the help icon */\n  tooltip?: string;\n  /** Whether to use simple mode (inline label style) */\n  simpleMode?: boolean;\n  /** Additional CSS classes for the input field */\n  inputFieldClassName?: string;\n  /** Whether the value was AI extracted */\n  isAiExtracted?: boolean;\n  /** Confidence percentage shown as a badge */\n  confidenceScore?: number;\n  /** Confidence classification for badge styling */\n  confidenceType?: ConfidenceScoreType;\n  /** Optional tooltip content for confidence badge */\n  confidenceTooltip?: React.ReactNode;\n  /** Source meta for confidence score */\n  sourceMeta?: SourceMetaItem[];\n  /** Handler fired when confidence score badge is clicked */\n  onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n  /** Whether this is a GTN (Global Term Name) field */\n  isGTN?: boolean;\n  /** GTN field name for document integration */\n  gtnName?: any;\n  /** Inline styles for the input element */\n  inputStyle?: React.CSSProperties;\n  /** Whether to show dollar sign (for simpleMode) */\n  withDollarSign?: boolean;\n  /** Additional CSS classes for the label */\n  labelClassName?: string;\n  /** Whether this is a live field */\n  isLiveField?: boolean;\n  /** Callback function called when input loses focus */\n  onBlur?: () => void;\n  /** 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  /** Input placeholder */\n  placeholder?: string\n}\n\n/**\n * A highly customizable percentage input component with label, validation, and styling support.\n * Features GTN integration, risk analysis support, AI extraction indicator, and comprehensive prop support.\n *\n * @example\n * ```tsx\n * <PercentageInputField\n *   id=\"discount\"\n *   label=\"Discount Percentage\"\n *   value={discount}\n *   onChange={(value) => setDiscount(value)}\n *   required\n * />\n * ```\n */\nexport const PercentageInputField = forwardRef<\n  HTMLInputElement,\n  PercentageInputFieldProps\n>(\n  (\n    {\n      id,\n      label,\n      value,\n      onChange,\n      errorMessage,\n      defaultValue,\n      disabled,\n      max,\n      min,\n      required = false,\n      isRequiredConditional = false,\n      bg,\n      tags,\n      color,\n      className,\n      originalCase = false,\n      tooltip,\n      simpleMode = false,\n      inputFieldClassName = \"\",\n      isAiExtracted = false,\n      confidenceScore,\n      confidenceType = \"high\",\n      confidenceTooltip,\n      sourceMeta = [],\n      onConfidenceScoreClick,\n      isGTN = false,\n      gtnName = null,\n      inputStyle,\n      withDollarSign = true,\n      labelClassName,\n      isLiveField = false,\n      onBlur,\n      onAddGTNToDocument,\n      riskDetails,\n      isRiskAnalysisOpen = false,\n      RiskDetailsCard,\n      placeholder,\n      ...props\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [isHovered, setIsHovered] = useState(false);\n\n    const handleAddGTNToDocument = (_value: string) => {\n      if (onAddGTNToDocument) {\n        const keyValuePair = {\n          key: gtnName,\n          value: _value,\n        };\n        onAddGTNToDocument(keyValuePair);\n      }\n    };\n\n    // Simple mode rendering\n    if (simpleMode) {\n      return (\n        <label\n          id={id}\n          className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-200 inline-flex items-center gap-1 ${\n            !originalCase ? \"capitalize\" : \"\"\n          } ${labelClassName || \"\"}`}\n        >\n          {withDollarSign && (\n            <span className=\"absolute inset-y-0 left-1 flex items-center pl-3\">\n              {\"$\"}\n            </span>\n          )}\n          <input\n            {...props}\n            ref={ref}\n            onBlur={onBlur}\n            type=\"number\"\n            required={required}\n            className={cn(inputFieldClassName, \"pl-8 h-8\")}\n            onChange={(e) => {\n              onChange(e.target.value);\n            }}\n            value={value}\n            {...(defaultValue && !value ? { defaultValue: defaultValue } : {})}\n            id={id || label}\n            style={inputStyle}\n            autoComplete=\"off\"\n          />\n        </label>\n      );\n    }\n\n    // Full mode rendering\n    return (\n      <div\n        className={cn(\n          \"flex gap-0.5 relative\",\n          isHovered && isGTN\n            ? \"border rounded-lg border-primary-100 bg-primary-50 p-1\"\n            : \"\"\n        )}\n        onMouseEnter={() => setIsHovered(true)}\n        onMouseLeave={() => setIsHovered(false)}\n      >\n        {isGTN && !isHovered ? (\n          <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n        ) : null}\n        <div className={cn(\"w-full flex flex-col\", className)}>\n          <label\n            htmlFor=\"text\"\n            className={`mb-1 text-xs font-medium text-gray-600 dark:text-neutral-300 inline-flex items-center gap-1 ${\n              !originalCase ? \"uppercase\" : \"\"\n            } ${labelClassName || \"\"}`}\n          >\n            <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n              <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap dark:text-black-300\">\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-percentage-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                        className=\"text-primary-600\"\n                        sx={{ fontSize: 16 }}\n                      />\n                    </AntTooltip>\n                  </button>\n                ) : null}\n              </div>\n            </div>\n          </label>\n          <label className=\"relative block\">\n            <input\n              {...props}\n              ref={ref}\n              onBlur={onBlur}\n              type=\"number\"\n              required={required}\n              disabled={disabled}\n              min={min}\n              max={max}\n              className={`border ${\n                errorMessage\n                  ? \"border-red-300\"\n                  : isRiskAnalysisOpen && riskDetails?.color\n                  ? `border-${riskDetails.color}-300`\n                  : \"border-gray-300\"\n              } ${bg} h-8 text-gray-900 dark:bg-black-600 dark:text-neutral-200 text-sm rounded-lg focus:outline-none focus:ring-0 focus:border-[var(--color-primary-600)] dark:focus:border-[var(--color-primary-400)] focus:shadow-[0_0_0_1.5px_var(--color-primary-100)] dark:focus:shadow-[0_0_0_1.5px_var(--color-primary-950)] block w-full p-2.5 font-inter font-medium \n              disabled:bg-neutral-50 dark:disabled:!bg-black-800 dark:disabled:placeholder:!text-black-400\n              ${\n                isRiskAnalysisOpen &&\n                riskDetails?.color &&\n                `bg-${riskDetails.color}-50`\n              }\n              ${color || \"\"}\n              `}\n              onChange={(e) => {\n                onChange(e.target.value);\n              }}\n              value={value}\n              defaultValue={defaultValue}\n              id={id || label}\n              style={inputStyle}\n              autoComplete=\"off\"\n              placeholder={placeholder}\n            />\n            <span className=\"absolute inset-y-0 right-3 flex items-center z-[1000px] h-full dark:text-black-100\">\n              %\n            </span>\n          </label>\n          {errorMessage && (\n            <Typography\n              className=\"text-error-500 mt-1\"\n              appearance=\"custom\"\n              size=\"extra-small\"\n              variant=\"medium\"\n            >\n              {errorMessage}\n            </Typography>\n          )}\n        </div>\n\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\nPercentageInputField.displayName = \"PercentageInputField\";\n"],"names":["PercentageInputField","forwardRef","id","label","value","onChange","errorMessage","defaultValue","disabled","max","min","required","isRequiredConditional","bg","tags","color","className","originalCase","tooltip","simpleMode","inputFieldClassName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","isGTN","gtnName","inputStyle","withDollarSign","labelClassName","isLiveField","onBlur","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","placeholder","props","ref","t","useTranslation","isHovered","setIsHovered","useState","handleAddGTNToDocument","_value","jsxs","jsx","cn","e","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","Typography"],"mappings":"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"}

package/dist/components/forms/search-bar/SearchBar.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),D=require("react-debounce-input"),E=require("react-i18next"),L=require("antd"),u=require("../../../_virtual/index.cjs.js"),t=require("../../data-display/typography/Typography.cjs.js"),M=require("../../icons/CloseRounded.cjs.js"),O=require("../../icons/SearchIcon.cjs.js"),W=r=>{const{value:s,placeholder:w,onChange:m,id:T,debounceTimeout:S=0,classValues:p,handleKeyDown:h,isClearable:l,onFocusText:C,autoComplete:B="false",searchRef:f,hasNavigation:g=!1,autoFocus:R=!1,searchConfig:F,hideSearchIcon:y,allowAStarSearch:j=!1,...q}=r,{t:n}=E.useTranslation(),[b,c]=x.useState(!1),[A,k]=x.useState("search"),N=x.useRef(null),{searchCount:i,searchPointer:d,setSearchPointer:o}=F||{},I=()=>{const a=l&&!!s,v=g&&!!s;return a&&v?"pr-28":v?"pr-12":a?"pr-8":"pr-7"},P=()=>{c(!0),k(C||w||n("Search"));const a=f||N;a.current&&a.current.focus()},z=()=>{c(!1),k("")};return e.jsxs("label",{className:u("relative flex items-center justify-start px-4 py-[9px] w-full dark:bg-neutral-900 bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8",p),children:[!y&&e.jsx("div",{className:"flex items-center h-6 w-6 pointer-events-none",children:e.jsx(O.SearchIcon,{width:"16",height:"16"})}),e.jsx(D.DebounceInput,{...q,spellCheck:"false",debounceTimeout:S,id:T,inputRef:f||N,type:"text",className:u(`absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${y?"pl-2":"pl-10"} pl-10 ${I()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,"border border-solid","dark:border-neutral-800 border-neutral-200","dark:caret-white",p),onKeyDown:a=>{a.key==="Enter"&&a.preventDefault(),h&&h(a)},value:s||"",placeholder:b?A:j?"":`${n("Search")}`,onChange:a=>m?.(a.target.value),autoComplete:B,onFocus:a=>{c(!0),P(),r.onFocus&&r.onFocus(a)},onBlur:a=>{c(!1),z(),r.onBlur&&r.onBlur(a)},autoFocus:R}),g&&s&&e.jsxs("div",{className:u("absolute mr-2 focus:outline-none flex gap-1",l?"right-6":"right-0"),children:[!!i&&(i||0)>0&&e.jsxs("span",{className:"text-xs border-r pr-2 border-gray-200",children:[(d||0)+1,"/",i]}),e.jsxs("div",{className:"flex gap-1 items-center",children:[e.jsx("button",{id:"btn-search-bar-set-search-pointer-forward",onClick:()=>{o&&o(a=>(a||0)-1)},disabled:d===0,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M15 18l-6-6 6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),e.jsx("button",{id:"btn-search-bar-set-search-pointer-backward",onClick:()=>{o&&o(a=>(a||0)+1)},disabled:d===(i||0)-1,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M9 18l6-6-6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]}),j&&!(l&&s)&&!b&&!s?e.jsxs("div",{className:"absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none",children:[e.jsxs(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:[n("Search")," (use"]}),e.jsx("button",{className:" bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5",children:e.jsx(L.Tooltip,{placement:"bottomRight",color:"#141414",classNames:{root:"custom-tooltip dark:!bg-black-800"},title:e.jsxs("div",{className:"flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800",children:[e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:n("Normal Search")}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:n("Examples")}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300 dark:text-black-200 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:"data"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:'→ finds "data", "Data".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:"text"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:'→ finds "text", "context", "plaintext".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:"base"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:'→ finds "database", "baseball", "basename".'})]})]}),e.jsx("div",{className:"h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2"}),e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:"Wildcard Search"}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-white dark:text-black-200",appearance:"custom",children:"Use * as a wildcard to refine your search."}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:"Examples:"}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ",appearance:"custom",children:"contract*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:'→ "contracts", "contractor", "CONTRACTOR".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ",appearance:"custom",children:"*agreement"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:'→ finds "service agreement", "legal agreement".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:"*clause*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:'→ finds "clause", "subclause", "clauses".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:"*l*s*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter",appearance:"custom",children:'→ finds "clause", "clauses".'})]})]})]}),children:e.jsx("div",{className:"text-[#475467] dark:text-black-300 dark:bg-black-600",children:"*"})})}),e.jsx(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:"as a wildcard)"})]}):l&&s&&e.jsx("button",{id:"btn-search-bar-close",className:"absolute right-0 mr-2 focus:outline-none",onClick:()=>m?.(""),children:e.jsx(M.CloseRounded,{classValue:"text-neutral-200 dark:text-black-500",size:16})})]})};exports.SearchBar=W;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),D=require("react-debounce-input"),E=require("react-i18next"),L=require("antd"),u=require("../../../_virtual/index.cjs.js"),t=require("../../data-display/typography/Typography.cjs.js"),M=require("../../icons/CloseRounded.cjs.js"),O=require("../../icons/SearchIcon.cjs.js"),W=r=>{const{value:s,placeholder:w,onChange:m,id:T,debounceTimeout:S=0,classValues:h,handleKeyDown:p,isClearable:c,onFocusText:C,autoComplete:B="false",searchRef:f,hasNavigation:g=!1,autoFocus:R=!1,searchConfig:F,hideSearchIcon:y,allowAStarSearch:j=!1,...q}=r,{t:n}=E.useTranslation(),[b,l]=x.useState(!1),[A,k]=x.useState("search"),N=x.useRef(null),{searchCount:i,searchPointer:d,setSearchPointer:o}=F||{},I=()=>{const a=c&&!!s,v=g&&!!s;return a&&v?"pr-28":v?"pr-12":a?"pr-8":"pr-7"},P=()=>{l(!0),k(C||w||n("Search"));const a=f||N;a.current&&a.current.focus()},z=()=>{l(!1),k("")};return e.jsxs("label",{className:u("relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8",h),children:[!y&&e.jsx("div",{className:"flex items-center h-6 w-6 pointer-events-none",children:e.jsx(O.SearchIcon,{width:"16",height:"16"})}),e.jsx(D.DebounceInput,{...q,spellCheck:"false",debounceTimeout:S,id:T,inputRef:f||N,type:"text",className:u(`absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${y?"pl-2":"pl-10"} pl-10 ${I()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,"border border-solid","dark:border-neutral-800 border-neutral-200","dark:caret-white",h),onKeyDown:a=>{a.key==="Enter"&&a.preventDefault(),p&&p(a)},value:s||"",placeholder:b?A:j?"":`${n("Search")}`,onChange:a=>m?.(a.target.value),autoComplete:B,onFocus:a=>{l(!0),P(),r.onFocus&&r.onFocus(a)},onBlur:a=>{l(!1),z(),r.onBlur&&r.onBlur(a)},autoFocus:R}),g&&s&&e.jsxs("div",{className:u("absolute mr-2 focus:outline-none flex gap-1",c?"right-6":"right-0"),children:[!!i&&(i||0)>0&&e.jsxs("span",{className:"text-xs border-r pr-2 border-gray-200",children:[(d||0)+1,"/",i]}),e.jsxs("div",{className:"flex gap-1 items-center",children:[e.jsx("button",{id:"btn-search-bar-set-search-pointer-forward",onClick:()=>{o&&o(a=>(a||0)-1)},disabled:d===0,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M15 18l-6-6 6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),e.jsx("button",{id:"btn-search-bar-set-search-pointer-backward",onClick:()=>{o&&o(a=>(a||0)+1)},disabled:d===(i||0)-1,children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M9 18l6-6-6-6",stroke:"#98A2B3",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})})]})]}),j&&!(c&&s)&&!b&&!s?e.jsxs("div",{className:"absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none",children:[e.jsxs(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:[n("Search")," (use"]}),e.jsx("button",{className:" bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5",children:e.jsx(L.Tooltip,{placement:"bottomRight",color:"#141414",classNames:{root:"custom-tooltip dark:!bg-black-800"},title:e.jsxs("div",{className:"flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit",children:[e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:n("Normal Search")}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:n("Examples")}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"data"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "data", "Data".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"text"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "text", "context", "plaintext".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"base"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "database", "baseball", "basename".'})]})]}),e.jsx("div",{className:"h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2"}),e.jsx(t.Typography,{variant:"semibold",size:"extra-small",className:"text-white",children:"Wildcard Search"}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-white dark:text-black-200",appearance:"custom",children:"Use * as a wildcard to refine your search."}),e.jsx(t.Typography,{variant:"medium",size:"extra-small",className:"text-primary-400 dark:text-primary-400",appearance:"custom",children:"Examples:"}),e.jsxs("div",{className:"flex flex-col items-start justify-center ",children:[e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ",appearance:"custom",children:"contract*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ "contracts", "contractor", "CONTRACTOR".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ",appearance:"custom",children:"*agreement"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "service agreement", "legal agreement".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"*clause*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "clause", "subclause", "clauses".'})]}),e.jsxs("div",{className:"flex items-center justify-center gap-1",children:[e.jsx(t.Typography,{className:"flex-shrink-0",appearance:"custom",children:"•"}),e.jsx("div",{className:"flex px-1 items-center justify-center bg-neutral-700 rounded-sm",children:e.jsx(t.Typography,{className:"text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter",appearance:"custom",children:"*l*s*"})}),e.jsx(t.Typography,{className:"text-white dark:text-black-100 text-xs font-medium leading-4 font-inter",appearance:"custom",children:'→ finds "clause", "clauses".'})]})]})]}),children:e.jsx("div",{className:"text-[#475467] dark:text-black-300 dark:bg-black-600",children:"*"})})}),e.jsx(t.Typography,{className:"text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5",children:"as a wildcard)"})]}):c&&s&&e.jsx("button",{id:"btn-search-bar-close",className:"absolute right-0 mr-2 focus:outline-none",onClick:()=>m?.(""),children:e.jsx(M.CloseRounded,{classValue:"text-neutral-200 dark:text-black-500",size:16})})]})};exports.SearchBar=W;
 //# sourceMappingURL=SearchBar.cjs.js.map

package/dist/components/forms/search-bar/SearchBar.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.cjs.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n  searchCount?: number;\n  searchPointer?: number;\n  setSearchPointer?: React.Dispatch<React.SetStateAction<number | undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n  value?: string;\n  onChange?(value: string): void;\n  debounceTimeout?: number;\n  classValues?: string;\n  handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n  isClearable?: boolean;\n  id: string;\n  onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  isAnimated?: boolean;\n  onFocusText?: string;\n  autoComplete?: string;\n  searchRef?: React.RefObject<HTMLInputElement>;\n  placeholder?: string;\n  autoFocus?: boolean;\n  hasNavigation?: boolean;\n  searchConfig?: TSearchConfig;\n  hideSearchIcon?: boolean;\n  allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n  const {\n    value,\n    placeholder,\n    onChange,\n    id,\n    debounceTimeout = 0,\n    classValues,\n    handleKeyDown,\n    isClearable,\n    onFocusText,\n    autoComplete = 'false',\n    searchRef,\n    hasNavigation = false,\n    autoFocus = false,\n    searchConfig,\n    hideSearchIcon,\n    allowAStarSearch = false,\n    ...inputProps\n  } = props;\n\n  const { t } = useTranslation();\n  const [isFocused, setIsFocused] = useState(false);\n  const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const { searchCount, searchPointer, setSearchPointer } = searchConfig || {};\n\n  const getRightPadding = () => {\n    const hasClearButton = isClearable && !!value;\n    const hasNav = hasNavigation && !!value;\n    if (hasClearButton && hasNav) return 'pr-28';\n    if (hasNav) return 'pr-12';\n    if (hasClearButton) return 'pr-8';\n    return 'pr-7';\n  };\n\n  const handleFocus = () => {\n    setIsFocused(true);\n    setFocusedPlaceHolder(onFocusText || placeholder || t('Search'));\n    const ref = searchRef || inputRef;\n    if (ref.current) {\n      ref.current.focus();\n    }\n  };\n\n  const handleBlur = () => {\n    setIsFocused(false);\n    setFocusedPlaceHolder('');\n  };\n\n  return (\n    <label\n      className={cn(\n        `relative flex items-center justify-start px-4 py-[9px] w-full dark:bg-neutral-900 bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n        classValues,\n      )}\n    >\n      {!hideSearchIcon && (\n        <div className='flex items-center h-6 w-6 pointer-events-none'>\n          <SearchIcon width=\"16\" height=\"16\" />\n        </div>\n      )}\n\n      <DebounceInput\n        {...inputProps}\n        spellCheck='false'\n        debounceTimeout={debounceTimeout}\n        id={id}\n        inputRef={searchRef || inputRef}\n        type='text'\n        className={cn(\n          `absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n          'border border-solid',\n          'dark:border-neutral-800 border-neutral-200',\n          'dark:caret-white',\n          classValues,\n        )}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') {\n            e.preventDefault();\n          }\n          // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n          handleKeyDown && handleKeyDown(e);\n        }}\n        value={value || ''}\n        placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n        onChange={(e) => onChange?.(e.target.value)}\n        autoComplete={autoComplete}\n        onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n          setIsFocused(true);\n          handleFocus();\n          if (props.onFocus) props.onFocus(e);\n        }}\n        onBlur={(e) => {\n          setIsFocused(false);\n          handleBlur();\n          if (props.onBlur) props.onBlur(e);\n        }}\n        autoFocus={autoFocus}\n      />\n\n      {hasNavigation && value && (\n        <div className={cn('absolute mr-2 focus:outline-none flex gap-1', isClearable ? 'right-6' : 'right-0')}>\n          {Boolean(searchCount) && (searchCount || 0) > 0 && (\n            <span className='text-xs border-r pr-2 border-gray-200'>\n              {(searchPointer || 0) + 1}/{searchCount}\n            </span>\n          )}\n          <div className='flex gap-1 items-center'>\n            <button\n              id={`btn-search-bar-set-search-pointer-forward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) - 1);\n              }}\n              disabled={searchPointer === 0}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n            <button\n              id={`btn-search-bar-set-search-pointer-backward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) + 1);\n              }}\n              disabled={searchPointer === (searchCount || 0) - 1}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n      )}\n\n      {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n        <div className='absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none'>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n          <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n            <Tooltip\n              placement='bottomRight'\n              color='#141414'\n              classNames={{\n                root: 'custom-tooltip dark:!bg-black-800',\n              }}\n              title={\n                <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800'>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    {t('Examples')}\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>data</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"data\", \"Data\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>text</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"text\", \"context\", \"plaintext\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>base</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"database\", \"baseball\", \"basename\".\n                      </Typography>\n                    </div>\n                  </div>\n                  <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n                    Use * as a wildcard to refine your search.\n                  </Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    Examples:\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ' appearance='custom'>\n                          contract*\n                        </Typography>\n                      </div>\n\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → \"contracts\", \"contractor\", \"CONTRACTOR\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ' appearance='custom'>\n                          *agreement\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"service agreement\", \"legal agreement\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                          *clause*\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"clause\", \"subclause\", \"clauses\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>*l*s*</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"clause\", \"clauses\".\n                      </Typography>\n                    </div>\n                  </div>\n                </div>\n              }\n            >\n              <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'>*</div>\n            </Tooltip>\n          </button>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n        </div>\n      ) : (\n        isClearable &&\n        value && (\n          <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n            <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n          </button>\n        )\n      )}\n    </label>\n  );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}
+{"version":3,"file":"SearchBar.cjs.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n  searchCount?: number;\n  searchPointer?: number;\n  setSearchPointer?: React.Dispatch<React.SetStateAction<number | undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n  value?: string;\n  onChange?(value: string): void;\n  debounceTimeout?: number;\n  classValues?: string;\n  handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n  isClearable?: boolean;\n  id: string;\n  onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  isAnimated?: boolean;\n  onFocusText?: string;\n  autoComplete?: string;\n  searchRef?: React.RefObject<HTMLInputElement>;\n  placeholder?: string;\n  autoFocus?: boolean;\n  hasNavigation?: boolean;\n  searchConfig?: TSearchConfig;\n  hideSearchIcon?: boolean;\n  allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n  const {\n    value,\n    placeholder,\n    onChange,\n    id,\n    debounceTimeout = 0,\n    classValues,\n    handleKeyDown,\n    isClearable,\n    onFocusText,\n    autoComplete = 'false',\n    searchRef,\n    hasNavigation = false,\n    autoFocus = false,\n    searchConfig,\n    hideSearchIcon,\n    allowAStarSearch = false,\n    ...inputProps\n  } = props;\n\n  const { t } = useTranslation();\n  const [isFocused, setIsFocused] = useState(false);\n  const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const { searchCount, searchPointer, setSearchPointer } = searchConfig || {};\n\n  const getRightPadding = () => {\n    const hasClearButton = isClearable && !!value;\n    const hasNav = hasNavigation && !!value;\n    if (hasClearButton && hasNav) return 'pr-28';\n    if (hasNav) return 'pr-12';\n    if (hasClearButton) return 'pr-8';\n    return 'pr-7';\n  };\n\n  const handleFocus = () => {\n    setIsFocused(true);\n    setFocusedPlaceHolder(onFocusText || placeholder || t('Search'));\n    const ref = searchRef || inputRef;\n    if (ref.current) {\n      ref.current.focus();\n    }\n  };\n\n  const handleBlur = () => {\n    setIsFocused(false);\n    setFocusedPlaceHolder('');\n  };\n\n  return (\n    <label\n      className={cn(\n        `relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n        classValues,\n      )}\n    >\n      {!hideSearchIcon && (\n        <div className='flex items-center h-6 w-6 pointer-events-none'>\n          <SearchIcon width=\"16\" height=\"16\" />\n        </div>\n      )}\n\n      <DebounceInput\n        {...inputProps}\n        spellCheck='false'\n        debounceTimeout={debounceTimeout}\n        id={id}\n        inputRef={searchRef || inputRef}\n        type='text'\n        className={cn(\n          `absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n          'border border-solid',\n          'dark:border-neutral-800 border-neutral-200',\n          'dark:caret-white',\n          classValues,\n        )}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') {\n            e.preventDefault();\n          }\n          // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n          handleKeyDown && handleKeyDown(e);\n        }}\n        value={value || ''}\n        placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n        onChange={(e) => onChange?.(e.target.value)}\n        autoComplete={autoComplete}\n        onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n          setIsFocused(true);\n          handleFocus();\n          if (props.onFocus) props.onFocus(e);\n        }}\n        onBlur={(e) => {\n          setIsFocused(false);\n          handleBlur();\n          if (props.onBlur) props.onBlur(e);\n        }}\n        autoFocus={autoFocus}\n      />\n\n      {hasNavigation && value && (\n        <div className={cn('absolute mr-2 focus:outline-none flex gap-1', isClearable ? 'right-6' : 'right-0')}>\n          {Boolean(searchCount) && (searchCount || 0) > 0 && (\n            <span className='text-xs border-r pr-2 border-gray-200'>\n              {(searchPointer || 0) + 1}/{searchCount}\n            </span>\n          )}\n          <div className='flex gap-1 items-center'>\n            <button\n              id={`btn-search-bar-set-search-pointer-forward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) - 1);\n              }}\n              disabled={searchPointer === 0}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n            <button\n              id={`btn-search-bar-set-search-pointer-backward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) + 1);\n              }}\n              disabled={searchPointer === (searchCount || 0) - 1}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n      )}\n\n      {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n        <div className='absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none'>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n          <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n            <Tooltip\n              placement='bottomRight'\n              color='#141414'\n              classNames={{\n                root: 'custom-tooltip dark:!bg-black-800',\n              }}\n              title={\n                <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit'>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    {t('Examples')}\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>data</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"data\", \"Data\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>text</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"text\", \"context\", \"plaintext\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>base</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"database\", \"baseball\", \"basename\".\n                      </Typography>\n                    </div>\n                  </div>\n                  <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n                    Use * as a wildcard to refine your search.\n                  </Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    Examples:\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n                          contract*\n                        </Typography>\n                      </div>\n\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → \"contracts\", \"contractor\", \"CONTRACTOR\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n                          *agreement\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"service agreement\", \"legal agreement\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                          *clause*\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"clause\", \"subclause\", \"clauses\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>*l*s*</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"clause\", \"clauses\".\n                      </Typography>\n                    </div>\n                  </div>\n                </div>\n              }\n            >\n              <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'>*</div>\n            </Tooltip>\n          </button>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n        </div>\n      ) : (\n        isClearable &&\n        value && (\n          <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n            <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n          </button>\n        )\n      )}\n    </label>\n  );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}

package/dist/components/forms/search-bar/SearchBar.es.js

@@ -40,7 +40,7 @@ const Z = (n) => {
     "label",
     {
       className: u(
-        "relative flex items-center justify-start px-4 py-[9px] w-full dark:bg-neutral-900 bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8",
+        "relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8",
         f
       ),
       children: [
@@ -121,24 +121,24 @@ const Z = (n) => {
               classNames: {
                 root: "custom-tooltip dark:!bg-black-800"
               },
-              title: /* @__PURE__ */ r("div", { className: "flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800", children: [
+              title: /* @__PURE__ */ r("div", { className: "flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit", children: [
                 /* @__PURE__ */ e(t, { variant: "semibold", size: "extra-small", className: "text-white", children: l("Normal Search") }),
                 /* @__PURE__ */ e(t, { variant: "medium", size: "extra-small", className: "text-primary-400 dark:text-primary-400", appearance: "custom", children: l("Examples") }),
                 /* @__PURE__ */ r("div", { className: "flex flex-col items-start justify-center ", children: [
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-center gap-1", children: [
                     /* @__PURE__ */ e(t, { className: "flex-shrink-0", appearance: "custom", children: "•" }),
-                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300 dark:text-black-200 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: "data" }) }),
-                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: '→ finds "data", "Data".' })
+                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter", appearance: "custom", children: "data" }) }),
+                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-4 font-inter", appearance: "custom", children: '→ finds "data", "Data".' })
                   ] }),
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-center gap-1", children: [
                     /* @__PURE__ */ e(t, { className: "flex-shrink-0", appearance: "custom", children: "•" }),
-                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: "text" }) }),
-                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: '→ finds "text", "context", "plaintext".' })
+                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter", appearance: "custom", children: "text" }) }),
+                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-4 font-inter", appearance: "custom", children: '→ finds "text", "context", "plaintext".' })
                   ] }),
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-center gap-1", children: [
                     /* @__PURE__ */ e(t, { className: "flex-shrink-0", appearance: "custom", children: "•" }),
-                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: "base" }) }),
-                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: '→ finds "database", "baseball", "basename".' })
+                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter", appearance: "custom", children: "base" }) }),
+                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-4 font-inter", appearance: "custom", children: '→ finds "database", "baseball", "basename".' })
                   ] })
                 ] }),
                 /* @__PURE__ */ e("div", { className: "h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2" }),
@@ -148,23 +148,23 @@ const Z = (n) => {
                 /* @__PURE__ */ r("div", { className: "flex flex-col items-start justify-center ", children: [
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-center gap-1", children: [
                     /* @__PURE__ */ e(t, { className: "flex-shrink-0", appearance: "custom", children: "•" }),
-                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ", appearance: "custom", children: "contract*" }) }),
-                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: '→ "contracts", "contractor", "CONTRACTOR".' })
+                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ", appearance: "custom", children: "contract*" }) }),
+                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-4 font-inter", appearance: "custom", children: '→ "contracts", "contractor", "CONTRACTOR".' })
                   ] }),
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-center gap-1", children: [
                     /* @__PURE__ */ e(t, { className: "flex-shrink-0", appearance: "custom", children: "•" }),
-                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ", appearance: "custom", children: "*agreement" }) }),
-                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: '→ finds "service agreement", "legal agreement".' })
+                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ", appearance: "custom", children: "*agreement" }) }),
+                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-4 font-inter", appearance: "custom", children: '→ finds "service agreement", "legal agreement".' })
                   ] }),
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-center gap-1", children: [
                     /* @__PURE__ */ e(t, { className: "flex-shrink-0", appearance: "custom", children: "•" }),
-                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: "*clause*" }) }),
-                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: '→ finds "clause", "subclause", "clauses".' })
+                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter", appearance: "custom", children: "*clause*" }) }),
+                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-4 font-inter", appearance: "custom", children: '→ finds "clause", "subclause", "clauses".' })
                   ] }),
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-center gap-1", children: [
                     /* @__PURE__ */ e(t, { className: "flex-shrink-0", appearance: "custom", children: "•" }),
-                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: "*l*s*" }) }),
-                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter", appearance: "custom", children: '→ finds "clause", "clauses".' })
+                    /* @__PURE__ */ e("div", { className: "flex px-1 items-center justify-center bg-neutral-700 rounded-sm", children: /* @__PURE__ */ e(t, { className: "text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter", appearance: "custom", children: "*l*s*" }) }),
+                    /* @__PURE__ */ e(t, { className: "text-white dark:text-black-100 text-xs font-medium leading-4 font-inter", appearance: "custom", children: '→ finds "clause", "clauses".' })
                   ] })
                 ] })
               ] }),

package/dist/components/forms/search-bar/SearchBar.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.es.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n  searchCount?: number;\n  searchPointer?: number;\n  setSearchPointer?: React.Dispatch<React.SetStateAction<number | undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n  value?: string;\n  onChange?(value: string): void;\n  debounceTimeout?: number;\n  classValues?: string;\n  handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n  isClearable?: boolean;\n  id: string;\n  onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  isAnimated?: boolean;\n  onFocusText?: string;\n  autoComplete?: string;\n  searchRef?: React.RefObject<HTMLInputElement>;\n  placeholder?: string;\n  autoFocus?: boolean;\n  hasNavigation?: boolean;\n  searchConfig?: TSearchConfig;\n  hideSearchIcon?: boolean;\n  allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n  const {\n    value,\n    placeholder,\n    onChange,\n    id,\n    debounceTimeout = 0,\n    classValues,\n    handleKeyDown,\n    isClearable,\n    onFocusText,\n    autoComplete = 'false',\n    searchRef,\n    hasNavigation = false,\n    autoFocus = false,\n    searchConfig,\n    hideSearchIcon,\n    allowAStarSearch = false,\n    ...inputProps\n  } = props;\n\n  const { t } = useTranslation();\n  const [isFocused, setIsFocused] = useState(false);\n  const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const { searchCount, searchPointer, setSearchPointer } = searchConfig || {};\n\n  const getRightPadding = () => {\n    const hasClearButton = isClearable && !!value;\n    const hasNav = hasNavigation && !!value;\n    if (hasClearButton && hasNav) return 'pr-28';\n    if (hasNav) return 'pr-12';\n    if (hasClearButton) return 'pr-8';\n    return 'pr-7';\n  };\n\n  const handleFocus = () => {\n    setIsFocused(true);\n    setFocusedPlaceHolder(onFocusText || placeholder || t('Search'));\n    const ref = searchRef || inputRef;\n    if (ref.current) {\n      ref.current.focus();\n    }\n  };\n\n  const handleBlur = () => {\n    setIsFocused(false);\n    setFocusedPlaceHolder('');\n  };\n\n  return (\n    <label\n      className={cn(\n        `relative flex items-center justify-start px-4 py-[9px] w-full dark:bg-neutral-900 bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n        classValues,\n      )}\n    >\n      {!hideSearchIcon && (\n        <div className='flex items-center h-6 w-6 pointer-events-none'>\n          <SearchIcon width=\"16\" height=\"16\" />\n        </div>\n      )}\n\n      <DebounceInput\n        {...inputProps}\n        spellCheck='false'\n        debounceTimeout={debounceTimeout}\n        id={id}\n        inputRef={searchRef || inputRef}\n        type='text'\n        className={cn(\n          `absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n          'border border-solid',\n          'dark:border-neutral-800 border-neutral-200',\n          'dark:caret-white',\n          classValues,\n        )}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') {\n            e.preventDefault();\n          }\n          // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n          handleKeyDown && handleKeyDown(e);\n        }}\n        value={value || ''}\n        placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n        onChange={(e) => onChange?.(e.target.value)}\n        autoComplete={autoComplete}\n        onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n          setIsFocused(true);\n          handleFocus();\n          if (props.onFocus) props.onFocus(e);\n        }}\n        onBlur={(e) => {\n          setIsFocused(false);\n          handleBlur();\n          if (props.onBlur) props.onBlur(e);\n        }}\n        autoFocus={autoFocus}\n      />\n\n      {hasNavigation && value && (\n        <div className={cn('absolute mr-2 focus:outline-none flex gap-1', isClearable ? 'right-6' : 'right-0')}>\n          {Boolean(searchCount) && (searchCount || 0) > 0 && (\n            <span className='text-xs border-r pr-2 border-gray-200'>\n              {(searchPointer || 0) + 1}/{searchCount}\n            </span>\n          )}\n          <div className='flex gap-1 items-center'>\n            <button\n              id={`btn-search-bar-set-search-pointer-forward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) - 1);\n              }}\n              disabled={searchPointer === 0}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n            <button\n              id={`btn-search-bar-set-search-pointer-backward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) + 1);\n              }}\n              disabled={searchPointer === (searchCount || 0) - 1}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n      )}\n\n      {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n        <div className='absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none'>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n          <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n            <Tooltip\n              placement='bottomRight'\n              color='#141414'\n              classNames={{\n                root: 'custom-tooltip dark:!bg-black-800',\n              }}\n              title={\n                <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800'>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    {t('Examples')}\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>data</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"data\", \"Data\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>text</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"text\", \"context\", \"plaintext\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>base</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"database\", \"baseball\", \"basename\".\n                      </Typography>\n                    </div>\n                  </div>\n                  <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n                    Use * as a wildcard to refine your search.\n                  </Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    Examples:\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ' appearance='custom'>\n                          contract*\n                        </Typography>\n                      </div>\n\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → \"contracts\", \"contractor\", \"CONTRACTOR\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter ' appearance='custom'>\n                          *agreement\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"service agreement\", \"legal agreement\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                          *clause*\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"clause\", \"subclause\", \"clauses\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-[18px] font-inter' appearance='custom'>*l*s*</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-[18px] font-inter' appearance='custom'>\n                        → finds \"clause\", \"clauses\".\n                      </Typography>\n                    </div>\n                  </div>\n                </div>\n              }\n            >\n              <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'>*</div>\n            </Tooltip>\n          </button>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n        </div>\n      ) : (\n        isClearable &&\n        value && (\n          <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n            <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n          </button>\n        )\n      )}\n    </label>\n  );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}
+{"version":3,"file":"SearchBar.es.js","sources":["../../../../src/components/forms/search-bar/SearchBar.tsx"],"sourcesContent":["import {type FC, type HTMLAttributes, useRef, useState } from 'react';\nimport { DebounceInput } from 'react-debounce-input';\nimport { useTranslation } from 'react-i18next';\nimport { Tooltip } from 'antd';\nimport cn from 'classnames';\nimport { Typography } from '../../data-display/typography/Typography';\nimport { CloseRounded } from '../../icons/CloseRounded';\nimport { SearchIcon } from '../../icons/SearchIcon';\n\nexport type TSearchConfig = {\n  searchCount?: number;\n  searchPointer?: number;\n  setSearchPointer?: React.Dispatch<React.SetStateAction<number | undefined>>;\n};\n\nexport type TSearchBarProps = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'> & {\n  value?: string;\n  onChange?(value: string): void;\n  debounceTimeout?: number;\n  classValues?: string;\n  handleKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n  isClearable?: boolean;\n  id: string;\n  onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  isAnimated?: boolean;\n  onFocusText?: string;\n  autoComplete?: string;\n  searchRef?: React.RefObject<HTMLInputElement>;\n  placeholder?: string;\n  autoFocus?: boolean;\n  hasNavigation?: boolean;\n  searchConfig?: TSearchConfig;\n  hideSearchIcon?: boolean;\n  allowAStarSearch?: boolean;\n};\n\nexport const SearchBar: FC<TSearchBarProps> = (props) => {\n  const {\n    value,\n    placeholder,\n    onChange,\n    id,\n    debounceTimeout = 0,\n    classValues,\n    handleKeyDown,\n    isClearable,\n    onFocusText,\n    autoComplete = 'false',\n    searchRef,\n    hasNavigation = false,\n    autoFocus = false,\n    searchConfig,\n    hideSearchIcon,\n    allowAStarSearch = false,\n    ...inputProps\n  } = props;\n\n  const { t } = useTranslation();\n  const [isFocused, setIsFocused] = useState(false);\n  const [focusedPlaceHolder, setFocusedPlaceHolder] = useState('search');\n  const inputRef = useRef<HTMLInputElement>(null);\n  const { searchCount, searchPointer, setSearchPointer } = searchConfig || {};\n\n  const getRightPadding = () => {\n    const hasClearButton = isClearable && !!value;\n    const hasNav = hasNavigation && !!value;\n    if (hasClearButton && hasNav) return 'pr-28';\n    if (hasNav) return 'pr-12';\n    if (hasClearButton) return 'pr-8';\n    return 'pr-7';\n  };\n\n  const handleFocus = () => {\n    setIsFocused(true);\n    setFocusedPlaceHolder(onFocusText || placeholder || t('Search'));\n    const ref = searchRef || inputRef;\n    if (ref.current) {\n      ref.current.focus();\n    }\n  };\n\n  const handleBlur = () => {\n    setIsFocused(false);\n    setFocusedPlaceHolder('');\n  };\n\n  return (\n    <label\n      className={cn(\n        `relative flex items-center justify-start px-4 py-[9px] w-full bg-white dark:bg-black-700 rounded-lg text-neutral-400 h-8`,\n        classValues,\n      )}\n    >\n      {!hideSearchIcon && (\n        <div className='flex items-center h-6 w-6 pointer-events-none'>\n          <SearchIcon width=\"16\" height=\"16\" />\n        </div>\n      )}\n\n      <DebounceInput\n        {...inputProps}\n        spellCheck='false'\n        debounceTimeout={debounceTimeout}\n        id={id}\n        inputRef={searchRef || inputRef}\n        type='text'\n        className={cn(\n          `absolute inset-0 dark:text-[#98A2B3] text-neutral-900  ${hideSearchIcon ? 'pl-2' : 'pl-10'} pl-10 ${getRightPadding()} w-full text-sm  dark:text-white bg-transparent rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500`,\n          'border border-solid',\n          'dark:border-neutral-800 border-neutral-200',\n          'dark:caret-white',\n          classValues,\n        )}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') {\n            e.preventDefault();\n          }\n          // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n          handleKeyDown && handleKeyDown(e);\n        }}\n        value={value || ''}\n        placeholder={isFocused ? focusedPlaceHolder : allowAStarSearch ? '' : `${t('Search')}`}\n        onChange={(e) => onChange?.(e.target.value)}\n        autoComplete={autoComplete}\n        onFocus={(e: React.FocusEvent<HTMLInputElement>) => {\n          setIsFocused(true);\n          handleFocus();\n          if (props.onFocus) props.onFocus(e);\n        }}\n        onBlur={(e) => {\n          setIsFocused(false);\n          handleBlur();\n          if (props.onBlur) props.onBlur(e);\n        }}\n        autoFocus={autoFocus}\n      />\n\n      {hasNavigation && value && (\n        <div className={cn('absolute mr-2 focus:outline-none flex gap-1', isClearable ? 'right-6' : 'right-0')}>\n          {Boolean(searchCount) && (searchCount || 0) > 0 && (\n            <span className='text-xs border-r pr-2 border-gray-200'>\n              {(searchPointer || 0) + 1}/{searchCount}\n            </span>\n          )}\n          <div className='flex gap-1 items-center'>\n            <button\n              id={`btn-search-bar-set-search-pointer-forward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) - 1);\n              }}\n              disabled={searchPointer === 0}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M15 18l-6-6 6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n            <button\n              id={`btn-search-bar-set-search-pointer-backward`}\n              onClick={() => {\n                if (setSearchPointer) setSearchPointer((state) => (state || 0) + 1);\n              }}\n              disabled={searchPointer === (searchCount || 0) - 1}\n            >\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M9 18l6-6-6-6\" stroke=\"#98A2B3\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n              </svg>\n            </button>\n          </div>\n        </div>\n      )}\n\n      {allowAStarSearch && !(isClearable && value) && !isFocused && !value ? (\n        <div className='absolute flex ml-6 items-center justify-center  focus:outline-none gap-1 flex-wrap-none'>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>{t('Search')} (use</Typography>\n\n          <button className=' bg-[#EAECF0] dark:bg-black-800 rounded-sm text-sm w-3 h-5'>\n            <Tooltip\n              placement='bottomRight'\n              color='#141414'\n              classNames={{\n                root: 'custom-tooltip dark:!bg-black-800',\n              }}\n              title={\n                <div className='flex flex-col items-start justify-center p-2 w-full h-full gap-2 dark:bg-black-800 min-w-80 min-h-fit'>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>{t('Normal Search')}</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    {t('Examples')}\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300 dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>data</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"data\", \"Data\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>text</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"text\", \"context\", \"plaintext\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>base</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"database\", \"baseball\", \"basename\".\n                      </Typography>\n                    </div>\n                  </div>\n                  <div className='h-[1px] w-full bg-neutral-800 dark:bg-black-200 my-2'></div>\n                  <Typography variant='semibold' size='extra-small' className='text-white'>Wildcard Search</Typography>\n                  <Typography variant='medium' size='extra-small' className='text-white dark:text-black-200' appearance='custom'>\n                    Use * as a wildcard to refine your search.\n                  </Typography>\n                  <Typography variant='medium' size='extra-small' className='text-primary-400 dark:text-primary-400' appearance='custom'>\n                    Examples:\n                  </Typography>\n                  <div className='flex flex-col items-start justify-center '>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n                          contract*\n                        </Typography>\n                      </div>\n\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → \"contracts\", \"contractor\", \"CONTRACTOR\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter ' appearance='custom'>\n                          *agreement\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"service agreement\", \"legal agreement\".\n                      </Typography>\n                    </div>\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                          *clause*\n                        </Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"clause\", \"subclause\", \"clauses\".\n                      </Typography>\n                    </div>\n\n                    <div className='flex items-center justify-center gap-1'>\n                      <Typography className='flex-shrink-0' appearance='custom'>\n                        •\n                      </Typography>\n                      <div className='flex px-1 items-center justify-center bg-neutral-700 rounded-sm'>\n                        <Typography className='text-neutral-300  dark:text-black-200 text-xs font-medium leading-4 font-inter' appearance='custom'>*l*s*</Typography>\n                      </div>\n                      <Typography className='text-white dark:text-black-100 text-xs font-medium leading-4 font-inter' appearance='custom'>\n                        → finds \"clause\", \"clauses\".\n                      </Typography>\n                    </div>\n                  </div>\n                </div>\n              }\n            >\n              <div className='text-[#475467] dark:text-black-300 dark:bg-black-600'>*</div>\n            </Tooltip>\n          </button>\n          <Typography className='text-[#98A2B3] dark:text-black-400 font-inter text-sm font-medium leading-5'>as a wildcard)</Typography>\n        </div>\n      ) : (\n        isClearable &&\n        value && (\n          <button id={`btn-search-bar-close`} className='absolute right-0 mr-2 focus:outline-none' onClick={() => onChange?.('')}>\n            <CloseRounded classValue='text-neutral-200 dark:text-black-500' size={16} />\n          </button>\n        )\n      )}\n    </label>\n  );\n};\n\n"],"names":["SearchBar","props","value","placeholder","onChange","id","debounceTimeout","classValues","handleKeyDown","isClearable","onFocusText","autoComplete","searchRef","hasNavigation","autoFocus","searchConfig","hideSearchIcon","allowAStarSearch","inputProps","t","useTranslation","isFocused","setIsFocused","useState","focusedPlaceHolder","setFocusedPlaceHolder","inputRef","useRef","searchCount","searchPointer","setSearchPointer","getRightPadding","hasClearButton","hasNav","handleFocus","ref","handleBlur","jsxs","cn","jsx","SearchIcon","DebounceInput","e","state","Typography","Tooltip","CloseRounded"],"mappings":"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"}

package/dist/components/forms/select-field/SelectField.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),O=require("antd");;/* empty css                     */const k=require("../../../_virtual/index.cjs.js"),Ee=require("lodash/debounce"),u=require("react"),Ae=require("react-i18next"),Y=require("../../data-display/typography/Typography.cjs.js"),Pe=require("../../icons/HelpIcon.cjs.js"),Be=require("../../data-display/label/Label.cjs.js"),De=require("../../data-display/tag/Tag.cjs.js"),X=require("@mui/icons-material"),Le=require("../../icons/AIExtractedIndicator.cjs.js"),ze=require("../../icons/AIStarIcon.cjs.js"),Fe=require("../shared/InputLabel.cjs.js"),I=require("../../tooltip/Tooltip.cjs.js"),h=require("../../../utils/confidenceScoreUtils.cjs.js"),Te=c=>Array.isArray(c)?c.map(n=>typeof n=="string"||typeof n=="number"?n:n.value):c||null,Me=c=>c.filter((n,r,o)=>o.findIndex(b=>b.value===n.value&&b.label===n.label)===r),Oe=({options:c,value:n,defaultValue:r})=>c?.length?Me(c.map(o=>({...o,color:o.color}))):Array.isArray(n)&&n.length&&typeof n[0]=="object"&&"label"in n[0]?n.map(o=>({label:String(o?.label||""),value:String(o?.value||""),color:o?.color})):n&&typeof n=="object"&&"label"in n?[{label:String(n.label||""),value:String(n.value||""),color:n?.color}]:Array.isArray(r)&&r.length&&typeof r[0]=="object"&&"label"in r[0]?r.map(o=>({label:String(o?.label||""),value:String(o?.value||""),color:o?.color})):r&&typeof r=="object"&&"label"in r?[{label:String(r.label||""),value:String(r.value||""),color:r?.color}]:[],$e=({hasExistingData:c})=>t.jsx("div",{className:"!w-full px-3 py-1.5",children:c?t.jsx(O.Skeleton,{paragraph:{rows:1,width:"100%"}}):t.jsx(O.Skeleton,{})}),He=({showSelectAll:c,mode:n,options:r,searchValue:o,handleSelectAll:b,isAllSelected:y,menu:q,isLoading:E,hasExistingData:j,t:v})=>t.jsxs(t.Fragment,{children:[c&&n==="multiple"&&r.length>0&&o.trim().length===0&&t.jsx("div",{role:"button",tabIndex:0,className:"px-3 py-2 border-b border-gray-200 dark:border-gray-600 cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-700",onClick:f=>{f.stopPropagation(),b()},onKeyDown:f=>{(f.key==="Enter"||f.key===" ")&&(f.preventDefault(),b())},children:t.jsx(Y.Typography,{size:"small",variant:"semibold",className:"text-primary-600 dark:text-primary-300",appearance:"custom",children:v(y?"Deselect all":"Select all")})}),q,E&&t.jsx($e,{hasExistingData:j})]}),Z=u.forwardRef(({label:c,value:n,mode:r,errorMessage:o,selectOptions:b=[],required:y=!1,tags:q,className:E,onInputChange:j,tooltip:v,originalCase:f=!1,isAiExtracted:G=!1,confidenceScore:A,confidenceType:S="high",confidenceTooltip:P,sourceMeta:V=[],onConfidenceScoreClick:ee,isGTN:B=!1,gtnName:te=null,onChange:g,onSearch:C,debounceTimeout:$=500,filterOption:le=!0,onScroll:re,isLoading:ae=!1,allowClear:ne=!0,autoClearSearchValue:oe=!0,fullOpacityLabel:Ke=!1,showAllTags:se=!1,customTagRender:ie,inputStyles:Re,disabled:D=!1,showSelectAll:ce=!1,labelClassName:ue,riskDetails:d,isRiskAnalysisOpen:m=!1,RiskDetailsCard:H,AddToDocumentIcon:_e,primaryColorShades:Je,UserAvatar:K,onAddGTNToDocument:R,isRequiredConditional:de,isLiveField:pe=!1,labelExtra:be,inputEmphasis:L="default",...x},fe)=>{const{t:_}=Ae.useTranslation(),[w,z]=u.useState(!1),me=L==="modified"&&!o&&!(m&&d?.color),ge=L==="deleted"&&!o&&!(m&&d?.color),xe=L==="success"&&!o&&!(m&&d?.color),he=u.useRef(null),[J,ye]=u.useState(!1),[ve,Se]=u.useState("");u.useEffect(()=>{const e="select-field-scrollbar-styles";if(document.getElementById(e))return;const l=document.createElement("style");l.id=e,l.textContent=`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),M=require("antd");;/* empty css                     */const j=require("../../../_virtual/index.cjs.js"),Ae=require("lodash/debounce"),u=require("react"),Pe=require("react-i18next"),X=require("../../data-display/typography/Typography.cjs.js"),Be=require("../../icons/HelpIcon.cjs.js"),De=require("../../data-display/label/Label.cjs.js"),Le=require("../../data-display/tag/Tag.cjs.js"),W=require("@mui/icons-material"),_e=require("../../icons/AIExtractedIndicator.cjs.js"),ze=require("../../icons/AIStarIcon.cjs.js"),Te=require("../shared/InputLabel.cjs.js"),k=require("../../tooltip/Tooltip.cjs.js"),h=require("../../../utils/confidenceScoreUtils.cjs.js"),Fe={sm:"[&_.ant-select-selector]:!min-h-6",md:"[&_.ant-select-selector]:!min-h-8",lg:"[&_.ant-select-selector]:!min-h-10"},Me=i=>Array.isArray(i)?i.map(n=>typeof n=="string"||typeof n=="number"?n:n.value):i||null,Oe=i=>i.filter((n,r,o)=>o.findIndex(m=>m.value===n.value&&m.label===n.label)===r),He=({options:i,value:n,defaultValue:r})=>i?.length?Oe(i.map(o=>({...o,color:o.color}))):Array.isArray(n)&&n.length&&typeof n[0]=="object"&&"label"in n[0]?n.map(o=>({label:String(o?.label||""),value:String(o?.value||""),color:o?.color})):n&&typeof n=="object"&&"label"in n?[{label:String(n.label||""),value:String(n.value||""),color:n?.color}]:Array.isArray(r)&&r.length&&typeof r[0]=="object"&&"label"in r[0]?r.map(o=>({label:String(o?.label||""),value:String(o?.value||""),color:o?.color})):r&&typeof r=="object"&&"label"in r?[{label:String(r.label||""),value:String(r.value||""),color:r?.color}]:[],Ke=({hasExistingData:i})=>t.jsx("div",{className:"!w-full px-3 py-1.5",children:i?t.jsx(M.Skeleton,{paragraph:{rows:1,width:"100%"}}):t.jsx(M.Skeleton,{})}),Re=({showSelectAll:i,mode:n,options:r,searchValue:o,handleSelectAll:m,isAllSelected:y,menu:q,isLoading:E,hasExistingData:C,t:v})=>t.jsxs(t.Fragment,{children:[i&&n==="multiple"&&r.length>0&&o.trim().length===0&&t.jsx("div",{role:"button",tabIndex:0,className:"px-3 py-2 border-b border-gray-200 dark:border-gray-600 cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-700",onClick:b=>{b.stopPropagation(),m()},onKeyDown:b=>{(b.key==="Enter"||b.key===" ")&&(b.preventDefault(),m())},children:t.jsx(X.Typography,{size:"small",variant:"semibold",className:"text-primary-600 dark:text-primary-300",appearance:"custom",children:v(y?"Deselect all":"Select all")})}),q,E&&t.jsx(Ke,{hasExistingData:C})]}),Y=u.forwardRef(({label:i,value:n,mode:r,errorMessage:o,selectOptions:m=[],required:y=!1,tags:q,className:E,onInputChange:C,tooltip:v,originalCase:b=!1,isAiExtracted:G=!1,confidenceScore:A,confidenceType:S="high",confidenceTooltip:P,sourceMeta:V=[],onConfidenceScoreClick:ee,isGTN:B=!1,gtnName:te=null,onChange:g,onSearch:w,debounceTimeout:O=500,filterOption:le=!0,onScroll:re,isLoading:ae=!1,allowClear:ne=!0,autoClearSearchValue:oe=!0,fullOpacityLabel:$e=!1,showAllTags:se=!1,customTagRender:ce,inputStyles:Je,disabled:D=!1,showSelectAll:ie=!1,labelClassName:ue,riskDetails:d,isRiskAnalysisOpen:f=!1,RiskDetailsCard:H,AddToDocumentIcon:Ue,primaryColorShades:Ze,UserAvatar:K,onAddGTNToDocument:R,isRequiredConditional:de,isLiveField:pe=!1,labelExtra:me,inputEmphasis:L="default",inputSize:be="md",...x},fe)=>{const{t:$}=Pe.useTranslation(),[N,_]=u.useState(!1),ge=L==="modified"&&!o&&!(f&&d?.color),xe=L==="deleted"&&!o&&!(f&&d?.color),he=L==="success"&&!o&&!(f&&d?.color),ye=u.useRef(null),[J,ve]=u.useState(!1),[Se,je]=u.useState("");u.useEffect(()=>{const e="select-field-scrollbar-styles";if(document.getElementById(e))return;const l=document.createElement("style");l.id=e,l.textContent=`
         [class*="virtual-list-scrollbar"]:not([class*="thumb"]) {
           width: 8px !important;
           background: transparent !important;
@@ -10,5 +10,5 @@
         .dark [class*="virtual-list-scrollbar-thumb"] {
           background: #454545 !important;
         }
-      `,document.head.appendChild(l)},[]);const je=()=>{if(R){let e="";s==null?e="":typeof s=="string"||typeof s=="number"?e=String(s):Array.isArray(s)?e=s.map(a=>typeof a=="object"&&a!==null&&"value"in a?a.value:a).join(", "):typeof s=="object"&&"value"in s&&(e=String(s.value)),R({key:te,value:e})}},s=Te(n),Q=u.useMemo(()=>C?Ee(C,$):null,[C,$]),Ce=(e,l)=>{if(he.current&&x.id){const a=document.getElementById(x.id);if(a){const i=Array.isArray(l)?l.map(M=>M.value):l?.value;a.dataset.selectedValue=JSON.stringify(i);const F=new Event("change",{bubbles:!0});Object.defineProperty(F,"target",{writable:!1,value:a}),a.dispatchEvent(F);const T=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${x.id}`,value:i,type:"change"}});a.dispatchEvent(T)}}if(r==="tags"){const a=Array.isArray(e)?e:[e];g?.(a?.map(i=>({label:i,value:i})))}else g?.(l)},p=Oe({options:b,value:n,defaultValue:x?.defaultValue}),we=u.useMemo(()=>p.length>0||s!=null,[p,s]),U=u.useMemo(()=>{if(!r||r!=="multiple"||p.length===0)return!1;const e=Array.isArray(s)?s:[];return p.map(a=>a.value).every(a=>e.some(i=>typeof i=="object"&&i!==null&&"value"in i?String(i.value)===String(a):String(i)===String(a)))},[s,p,r]),Ne=()=>{!r||r!=="multiple"||!g||g(U?[]:p)},W=u.useCallback(e=>{if(!e)return;const l=new Event("submit",{bubbles:!0,cancelable:!0});e.dispatchEvent(l);const a=e.querySelector('button[type="submit"]');a&&a.click()},[]),ke=u.useCallback(e=>{if(e.key==="Enter"&&!J&&(e.preventDefault(),e.stopPropagation(),s)){const l=e.currentTarget.closest("form");W(l)}},[J,s,W]),Ie=u.useCallback(e=>{const{label:l,value:a,onClose:i}=e,T=p.find(N=>String(N.value)===String(a))?.color||"primary",M=N=>{N.preventDefault(),N.stopPropagation()};return t.jsx("div",{className:"cursor-pointer me-1 inline-flex",children:t.jsx(De.Tag,{label:l,color:T,className:"!px-0.5 !py-0 !rounded",size:"md",onMouseDown:M,onClick:D?void 0:i,isHashColor:!0,removable:!0,onRemove:i})})},[p,D]),qe=u.useCallback(e=>{Se(e),(j||Q)?.(e)},[j,Q]);return t.jsxs("div",{ref:fe,className:k("flex gap-0.5 w-full relative",w&&B?"border rounded-lg border-primary-100 bg-primary-50 p-1":""),onMouseEnter:()=>z(!0),onMouseLeave:()=>z(!1),id:x.id,children:[B&&!w?t.jsx("div",{className:"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,t.jsxs("div",{className:k("w-full flex flex-col gap-1 risk-analysis-select-field",E),onMouseDown:e=>e.stopPropagation(),onKeyDownCapture:ke,role:"group","aria-labelledby":c?"select-field-label":void 0,children:[c?t.jsx("label",{id:"select-field-label",htmlFor:"label",className:`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${f?"":"capitalize"} ${ue||""}`,children:t.jsxs("div",{className:"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1",children:[t.jsxs("div",{className:"inline-flex min-w-0 items-center gap-1 flex-wrap",children:[t.jsx(Fe.InputLabel,{label:c||"",required:y||!1,isRequiredConditional:de||!1}),pe&&t.jsx(X.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),G&&!h.shouldShowConfidenceScore(A)&&t.jsx(Le.AIExtractedIndicator,{}),t.jsx(Be.Label,{labels:q}),v&&t.jsx(I,{placement:"top",title:v,children:t.jsx("div",{className:"cursor-pointer",role:"button",tabIndex:0,onKeyDown:e=>{(e.key==="Enter"||e.key===" ")&&e.preventDefault()},children:t.jsx(Pe.HelpIcon,{})})}),be]}),t.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[h.shouldShowConfidenceScore(A)&&S?t.jsx(I,{placement:"top-end",title:P??"",hideTooltip:P==null,className:"cursor-pointer",children:t.jsxs("div",{className:k("inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5",h.getConfidenceScoreBadgeClass(S)),onClick:()=>ee?.(V),children:[t.jsx(ze.AIStarIcon,{size:12,fill:h.getConfidenceScoreBadgeColor(S),fillSecondary:h.getConfidenceScoreBadgeFill(S)}),t.jsxs("span",{className:k("text-xs font-medium leading-4",h.getConfidenceScoreBadgeTextColor(S)),children:[A,"%"]})]})}):null,B&&w?t.jsx("button",{id:"btn-select-field-base-add-to-document",className:"cursor-pointer",onClick:je,type:"button",children:t.jsx(I,{placement:"top",title:_("Add to document"),children:t.jsx(X.NoteAddOutlined,{className:"text-primary-600",sx:{fontSize:16}})})}):null]})]})}):null,t.jsx(O.Select,{onOpenChange:ye,disabled:D,className:`w-full text-black-900 dark:text-black-200 ${o&&y?"ant-select-status-error":"#e2e8f0"} ${m&&d?.color?"risk-select-field":""} ${me?"select-field-emphasis-modified":ge?"select-field-emphasis-deleted":xe?"select-field-emphasis-success":""}`,classNames:{popup:{root:"!z-[5001]"}},style:{width:"100%","--risk-color":m&&d?.hexBgColor?d?.hexBgColor:"","--risk-border-color":m&&d?.hexBorderColor?d?.hexBorderColor:""},"aria-required":y,mode:r,value:s,onChange:Ce,filterOption:C?le:(e,l)=>(l?.label||"")?.toLowerCase()?.includes(e?.toLowerCase()),showSearch:!0,onSearch:qe||void 0,onPopupScroll:re,popupClassName:"select-field-dropdown-popup",popupRender:e=>t.jsx(He,{showSelectAll:ce,mode:r,options:p,searchValue:ve,handleSelectAll:Ne,isAllSelected:U,menu:e,isLoading:ae,hasExistingData:we,t:_}),options:p.map(({label:e,value:l,color:a,...i})=>({label:String(e),value:String(l),key:String(l),id:String(l),color:a,...i})),optionRender:e=>{const l=e?.data?.fullname;if(l&&K){const[a,i]=l.split(" ");return t.jsxs("div",{className:"flex items-center justify-start gap-1",children:[t.jsx(K,{firstName:a,lastName:i,profilePic:e?.data?.url||"",size:"xs",enablePopper:!0,userId:e?.data?.value}),t.jsx("span",{className:"ml-2",children:e.label})]})}return t.jsx("span",{children:e.label})},autoClearSearchValue:oe,onClear:()=>g&&g(r==="tags"||r==="multiple"?[]:null),maxTagCount:r==="tags"&&se?void 0:"responsive",maxTagPlaceholder:e=>t.jsx(I,{placement:"top",title:e.length>3?e.slice(0,3).map(({label:l})=>l).join(", ")+"...":e.map(({label:l})=>l).join(", "),children:t.jsxs("span",{children:["+",e.length," more"]})}),tagRender:ie||Ie,allowClear:ne,...x}),o&&t.jsx(Y.Typography,{className:"text-error-500",appearance:"custom",size:"extra-small",variant:"medium",children:o})]}),w&&d&&m&&H&&t.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:e=>e.stopPropagation(),onMouseDown:e=>e.preventDefault(),onKeyDown:e=>{e.key==="Escape"&&z(!1)},children:t.jsx(H,{riskDetails:d})})]})});Z.displayName="SelectField";exports.SelectField=Z;
+      `,document.head.appendChild(l)},[]);const Ce=()=>{if(R){let e="";s==null?e="":typeof s=="string"||typeof s=="number"?e=String(s):Array.isArray(s)?e=s.map(a=>typeof a=="object"&&a!==null&&"value"in a?a.value:a).join(", "):typeof s=="object"&&"value"in s&&(e=String(s.value)),R({key:te,value:e})}},s=Me(n),U=u.useMemo(()=>w?Ae(w,O):null,[w,O]),we=(e,l)=>{if(ye.current&&x.id){const a=document.getElementById(x.id);if(a){const c=Array.isArray(l)?l.map(F=>F.value):l?.value;a.dataset.selectedValue=JSON.stringify(c);const z=new Event("change",{bubbles:!0});Object.defineProperty(z,"target",{writable:!1,value:a}),a.dispatchEvent(z);const T=new CustomEvent("pilot-change",{bubbles:!0,detail:{selector:`#${x.id}`,value:c,type:"change"}});a.dispatchEvent(T)}}if(r==="tags"){const a=Array.isArray(e)?e:[e];g?.(a?.map(c=>({label:c,value:c})))}else g?.(l)},p=He({options:m,value:n,defaultValue:x?.defaultValue}),Ne=u.useMemo(()=>p.length>0||s!=null,[p,s]),Z=u.useMemo(()=>{if(!r||r!=="multiple"||p.length===0)return!1;const e=Array.isArray(s)?s:[];return p.map(a=>a.value).every(a=>e.some(c=>typeof c=="object"&&c!==null&&"value"in c?String(c.value)===String(a):String(c)===String(a)))},[s,p,r]),Ie=()=>{!r||r!=="multiple"||!g||g(Z?[]:p)},Q=u.useCallback(e=>{if(!e)return;const l=new Event("submit",{bubbles:!0,cancelable:!0});e.dispatchEvent(l);const a=e.querySelector('button[type="submit"]');a&&a.click()},[]),ke=u.useCallback(e=>{if(e.key==="Enter"&&!J&&(e.preventDefault(),e.stopPropagation(),s)){const l=e.currentTarget.closest("form");Q(l)}},[J,s,Q]),qe=u.useCallback(e=>{const{label:l,value:a,onClose:c}=e,T=p.find(I=>String(I.value)===String(a))?.color||"primary",F=I=>{I.preventDefault(),I.stopPropagation()};return t.jsx("div",{className:"cursor-pointer me-1 inline-flex",children:t.jsx(Le.Tag,{label:l,color:T,className:"!px-0.5 !py-0 !rounded",size:"md",onMouseDown:F,onClick:D?void 0:c,isHashColor:!0,removable:!0,onRemove:c})})},[p,D]),Ee=u.useCallback(e=>{je(e),(C||U)?.(e)},[C,U]);return t.jsxs("div",{ref:fe,className:j("flex gap-0.5 w-full relative",N&&B?"border rounded-lg border-primary-100 bg-primary-50 p-1":""),onMouseEnter:()=>_(!0),onMouseLeave:()=>_(!1),id:x.id,children:[B&&!N?t.jsx("div",{className:"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5"}):null,t.jsxs("div",{className:j("w-full flex flex-col gap-1 risk-analysis-select-field",E),onMouseDown:e=>e.stopPropagation(),onKeyDownCapture:ke,role:"group","aria-labelledby":i?"select-field-label":void 0,children:[i?t.jsx("label",{id:"select-field-label",htmlFor:"label",className:`text-xs font-medium text-gray-600 dark:text-black-300 inline-flex items-center gap-1 ${b?"":"capitalize"} ${ue||""}`,children:t.jsxs("div",{className:"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1",children:[t.jsxs("div",{className:"inline-flex min-w-0 items-center gap-1 flex-wrap",children:[t.jsx(Te.InputLabel,{label:i||"",required:y||!1,isRequiredConditional:de||!1}),pe&&t.jsx(W.BoltOutlined,{className:"!text-base text-primary-600 rotate-[15deg]"}),G&&!h.shouldShowConfidenceScore(A)&&t.jsx(_e.AIExtractedIndicator,{}),t.jsx(De.Label,{labels:q}),v&&t.jsx(k,{placement:"top",title:v,children:t.jsx("div",{className:"cursor-pointer",role:"button",tabIndex:0,onKeyDown:e=>{(e.key==="Enter"||e.key===" ")&&e.preventDefault()},children:t.jsx(Be.HelpIcon,{})})}),me]}),t.jsxs("div",{className:"flex items-center gap-1 justify-self-end",children:[h.shouldShowConfidenceScore(A)&&S?t.jsx(k,{placement:"top-end",title:P??"",hideTooltip:P==null,className:"cursor-pointer",children:t.jsxs("div",{className:j("inline-flex min-w-12 items-center gap-1 rounded-md px-1 py-0.5",h.getConfidenceScoreBadgeClass(S)),onClick:()=>ee?.(V),children:[t.jsx(ze.AIStarIcon,{size:12,fill:h.getConfidenceScoreBadgeColor(S),fillSecondary:h.getConfidenceScoreBadgeFill(S)}),t.jsxs("span",{className:j("text-xs font-medium leading-4",h.getConfidenceScoreBadgeTextColor(S)),children:[A,"%"]})]})}):null,B&&N?t.jsx("button",{id:"btn-select-field-base-add-to-document",className:"cursor-pointer",onClick:Ce,type:"button",children:t.jsx(k,{placement:"top",title:$("Add to document"),children:t.jsx(W.NoteAddOutlined,{className:"!text-base text-primary-600"})})}):null]})]})}):null,t.jsx(M.Select,{onOpenChange:ve,disabled:D,className:j("w-full h-8 flex items-center justify-center text-black-900 dark:text-black-200 text-sm",Fe[be],o&&y?"ant-select-status-error":"",f&&d?.color?"risk-select-field":"",ge?"select-field-emphasis-modified":xe?"select-field-emphasis-deleted":he?"select-field-emphasis-success":""),classNames:{popup:{root:"!z-[5001]"}},style:{width:"100%","--risk-color":f&&d?.hexBgColor?d?.hexBgColor:"","--risk-border-color":f&&d?.hexBorderColor?d?.hexBorderColor:""},"aria-required":y,mode:r,value:s,onChange:we,filterOption:w?le:(e,l)=>(l?.label||"")?.toLowerCase()?.includes(e?.toLowerCase()),showSearch:!0,onSearch:Ee||void 0,onPopupScroll:re,popupClassName:"select-field-dropdown-popup",popupRender:e=>t.jsx(Re,{showSelectAll:ie,mode:r,options:p,searchValue:Se,handleSelectAll:Ie,isAllSelected:Z,menu:e,isLoading:ae,hasExistingData:Ne,t:$}),options:p.map(({label:e,value:l,color:a,...c})=>({label:String(e),value:String(l),key:String(l),id:String(l),color:a,...c})),optionRender:e=>{const l=e?.data?.fullname;if(l&&K){const[a,c]=l.split(" ");return t.jsxs("div",{className:"flex items-center justify-start gap-1",children:[t.jsx(K,{firstName:a,lastName:c,profilePic:e?.data?.url||"",size:"xs",enablePopper:!0,userId:e?.data?.value}),t.jsx("span",{className:"ml-2",children:e.label})]})}return t.jsx("span",{children:e.label})},autoClearSearchValue:oe,onClear:()=>g&&g(r==="tags"||r==="multiple"?[]:null),maxTagCount:r==="tags"&&se?void 0:"responsive",maxTagPlaceholder:e=>t.jsx(k,{placement:"top",title:e.length>3?e.slice(0,3).map(({label:l})=>l).join(", ")+"...":e.map(({label:l})=>l).join(", "),children:t.jsxs("span",{children:["+",e.length," more"]})}),tagRender:ce||qe,allowClear:ne,...x}),o&&t.jsx(X.Typography,{className:"text-error-500",appearance:"custom",size:"extra-small",variant:"medium",children:o})]}),N&&d&&f&&H&&t.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:e=>e.stopPropagation(),onMouseDown:e=>e.preventDefault(),onKeyDown:e=>{e.key==="Escape"&&_(!1)},children:t.jsx(H,{riskDetails:d})})]})});Y.displayName="SelectField";exports.SelectField=Y;
 //# sourceMappingURL=SelectField.cjs.js.map