@laerdal/life-react-components 5.0.5-dev.3 → 5.0.5

package/dist/InputFields/SearchBar.d.ts

@@ -1,91 +1,91 @@
-import React from 'react';
-import { Size } from '../types';
-import { DropdownItem } from '../Dropdown';
-export type SearchBarProps = {
-    /**
-     * Required. The ID of the search bar.
-     */
-    id: string;
-    /**
-     * Optional. The current search term in the search bar.
-     */
-    searchTerm?: string;
-    /**
-     * Required. A function to be called when the search term changes.
-     * It should take a string representing the new search term.
-     */
-    setSearchTerm: (term: string) => void;
-    /**
-     * Required. A function to be called when the enter key is pressed in the search bar.
-     * It should take an event object as a parameter.
-     */
-    enterSearch: (e: any) => void;
-    /**
-     * Required. A function to be called when the search term is removed.
-     * It should take an event object as a parameter.
-     */
-    removeSearch: (e: any) => void;
-    /**
-     * Optional. The placeholder text to be displayed in the search bar when it is empty.
-     */
-    placeholder?: string;
-    /**
-     * Optional. The label for the search button in the search bar.
-     */
-    performSearchLabel?: string;
-    /**
-     * Optional. A boolean indicating whether the search bar is disabled.
-     */
-    disabled?: boolean;
-    /**
-     * Optional. The validation message to be displayed when the search bar is in an error state.
-     */
-    validationMessage?: string;
-    /**
-     * Optional. A function to be called when a keydown event occurs in the search bar.
-     */
-    onKeyDown?: (e: React.KeyboardEvent) => void;
-    /**
-     * Optional. The size of the search bar. Can be 'Small' or 'Medium'.
-     */
-    size?: Size.Small | Size.Medium;
-    /**
-     * Optional. The margin of the search bar. Can be any valid CSS margin value.
-     */
-    margin?: string;
-    /**
-     * Optional. A boolean indicating whether the dropdown in the search bar should be shown.
-     */
-    showDropdown?: boolean;
-    /**
-     * Optional. The icon for the dropdown button in the search bar.
-     */
-    dropdownButtonIcon?: React.ReactNode;
-    /**
-     * Optional. The label for the dropdown button in the search bar.
-     */
-    dropdownButtonLabel?: string;
-    /**
-     * Optional. The variant of the dropdown button in the search bar. Can be 'primary', 'secondary', or 'tertiary'.
-     */
-    dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';
-    /**
-     * Optional. A function to be called when the dropdown button in the search bar is clicked.
-     */
-    dropdownButtonAction?: () => boolean | void | undefined;
-    /**
-     * Optional. An array of DropdownItem objects representing the items in the dropdown.
-     */
-    searchList?: DropdownItem[];
-    /**
-     * Optional. A function to be called when an item is added to the dropdown.
-     * It should take a DropdownItem object as a parameter.
-     */
-    addToSearchList?: (e: DropdownItem) => void;
-    /**
-     * Optional. A boolean indicating whether the dropdown in the search bar is scrollable.
-     */
-    dropdownScrollable?: boolean;
-};
-declare const SearchBar: React.FunctionComponent<SearchBarProps>;
-export default SearchBar;
+import React from 'react';
+import { Size } from '../types';
+import { DropdownItem } from '../Dropdown';
+export type SearchBarProps = {
+    /**
+     * Required. The ID of the search bar.
+     */
+    id: string;
+    /**
+     * Optional. The current search term in the search bar.
+     */
+    searchTerm?: string;
+    /**
+     * Required. A function to be called when the search term changes.
+     * It should take a string representing the new search term.
+     */
+    setSearchTerm: (term: string) => void;
+    /**
+     * Required. A function to be called when the enter key is pressed in the search bar.
+     * It should take an event object as a parameter.
+     */
+    enterSearch: (e: any) => void;
+    /**
+     * Required. A function to be called when the search term is removed.
+     * It should take an event object as a parameter.
+     */
+    removeSearch: (e: any) => void;
+    /**
+     * Optional. The placeholder text to be displayed in the search bar when it is empty.
+     */
+    placeholder?: string;
+    /**
+     * Optional. The label for the search button in the search bar.
+     */
+    performSearchLabel?: string;
+    /**
+     * Optional. A boolean indicating whether the search bar is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Optional. The validation message to be displayed when the search bar is in an error state.
+     */
+    validationMessage?: string;
+    /**
+     * Optional. A function to be called when a keydown event occurs in the search bar.
+     */
+    onKeyDown?: (e: React.KeyboardEvent) => void;
+    /**
+     * Optional. The size of the search bar. Can be 'Small' or 'Medium'.
+     */
+    size?: Size.Small | Size.Medium;
+    /**
+     * Optional. The margin of the search bar. Can be any valid CSS margin value.
+     */
+    margin?: string;
+    /**
+     * Optional. A boolean indicating whether the dropdown in the search bar should be shown.
+     */
+    showDropdown?: boolean;
+    /**
+     * Optional. The icon for the dropdown button in the search bar.
+     */
+    dropdownButtonIcon?: React.ReactNode;
+    /**
+     * Optional. The label for the dropdown button in the search bar.
+     */
+    dropdownButtonLabel?: string;
+    /**
+     * Optional. The variant of the dropdown button in the search bar. Can be 'primary', 'secondary', or 'tertiary'.
+     */
+    dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';
+    /**
+     * Optional. A function to be called when the dropdown button in the search bar is clicked.
+     */
+    dropdownButtonAction?: () => boolean | void | undefined;
+    /**
+     * Optional. An array of DropdownItem objects representing the items in the dropdown.
+     */
+    searchList?: DropdownItem[];
+    /**
+     * Optional. A function to be called when an item is added to the dropdown.
+     * It should take a DropdownItem object as a parameter.
+     */
+    addToSearchList?: (e: DropdownItem) => void;
+    /**
+     * Optional. A boolean indicating whether the dropdown in the search bar is scrollable.
+     */
+    dropdownScrollable?: boolean;
+};
+declare const SearchBar: React.FunctionComponent<SearchBarProps>;
+export default SearchBar;

package/dist/InputFields/SearchBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.js","names":["React","COLORS","SystemIcons","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","useTheme","DropdownContent","useClickOutsideRef","ClearIconWrapper","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","useRef","theme","topLevelRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","getColor"],"sources":["../../src/InputFields/SearchBar.tsx"],"sourcesContent":["import React from 'react';\r\nimport {COLORS} from '../styles/index';\r\nimport {SystemIcons} from '../icons';\r\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\r\nimport {IconButton} from '../Button';\r\nimport SearchBarInput from './components/SearchBarInput';\r\nimport SearchField from './components/SearchField';\r\nimport {Size} from '../types';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport { DropdownContent, DropdownItem } from '../Dropdown';\r\nimport { useClickOutsideRef } from '../common';\r\n\r\nexport type SearchBarProps = {\r\n  /**\r\n   * Required. The ID of the search bar.\r\n   */\r\n  id: string;\r\n\r\n  /**\r\n   * Optional. The current search term in the search bar.\r\n   */\r\n  searchTerm?: string;\r\n  /**\r\n   * Required. A function to be called when the search term changes.\r\n   * It should take a string representing the new search term.\r\n   */\r\n  setSearchTerm: (term: string) => void;\r\n  /**\r\n   * Required. A function to be called when the enter key is pressed in the search bar.\r\n   * It should take an event object as a parameter.\r\n   */\r\n  enterSearch: (e: any) => void;\r\n  /**\r\n   * Required. A function to be called when the search term is removed.\r\n   * It should take an event object as a parameter.\r\n   */\r\n  removeSearch: (e: any) => void;\r\n  /**\r\n   * Optional. The placeholder text to be displayed in the search bar when it is empty.\r\n   */\r\n  placeholder?: string;\r\n  /**\r\n   * Optional. The label for the search button in the search bar.\r\n   */\r\n  performSearchLabel?: string;\r\n  /**\r\n   * Optional. A boolean indicating whether the search bar is disabled.\r\n   */\r\n  disabled?: boolean;\r\n  /**\r\n   * Optional. The validation message to be displayed when the search bar is in an error state.\r\n   */\r\n  validationMessage?: string;\r\n  /**\r\n   * Optional. A function to be called when a keydown event occurs in the search bar.\r\n   */\r\n  onKeyDown?: (e: React.KeyboardEvent) => void;\r\n  /**\r\n   * Optional. The size of the search bar. Can be 'Small' or 'Medium'.\r\n   */\r\n  size?: Size.Small | Size.Medium;\r\n  /**\r\n   * Optional. The margin of the search bar. Can be any valid CSS margin value.\r\n   */\r\n  margin?: string;\r\n  /**\r\n   * Optional. A boolean indicating whether the dropdown in the search bar should be shown.\r\n   */\r\n  showDropdown?: boolean;\r\n  /**\r\n   * Optional. The icon for the dropdown button in the search bar.\r\n   */\r\n  dropdownButtonIcon?: React.ReactNode;\r\n  /**\r\n   * Optional. The label for the dropdown button in the search bar.\r\n   */  \r\n  dropdownButtonLabel?: string;\r\n  /**\r\n   * Optional. The variant of the dropdown button in the search bar. Can be 'primary', 'secondary', or 'tertiary'.\r\n   */  \r\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\r\n  /**\r\n   * Optional. A function to be called when the dropdown button in the search bar is clicked.\r\n   */  \r\n  dropdownButtonAction?: () => boolean | void | undefined;\r\n  /**\r\n   * Optional. An array of DropdownItem objects representing the items in the dropdown.\r\n   */\r\n  searchList?: DropdownItem[];\r\n  /**\r\n   * Optional. A function to be called when an item is added to the dropdown.\r\n   * It should take a DropdownItem object as a parameter.\r\n   */\r\n  addToSearchList?: (e: DropdownItem) => void;\r\n  /**\r\n   * Optional. A boolean indicating whether the dropdown in the search bar is scrollable.\r\n   */\r\n  dropdownScrollable?: boolean;\r\n};\r\n\r\nconst ClearIconWrapper = styled.div`\r\n  display: flex;\r\n  align-items: center;\r\n\r\n  &.hidden {\r\n    display: none !important;\r\n  }\r\n`;\r\n\r\nconst SearchBar: React.FunctionComponent<SearchBarProps> = ({\r\n                                                             id,\r\n                                                             searchTerm,\r\n                                                             setSearchTerm,\r\n                                                             enterSearch,\r\n                                                             removeSearch,\r\n                                                             placeholder,\r\n                                                             performSearchLabel,\r\n                                                             disabled,\r\n                                                             validationMessage,\r\n                                                             onKeyDown,\r\n                                                             size,\r\n                                                             margin,\r\n                                                             showDropdown,\r\n                                                             dropdownButtonIcon,\r\n                                                             dropdownButtonLabel,\r\n                                                             dropdownButtonVariant,\r\n                                                             dropdownButtonAction,\r\n                                                             searchList=[],\r\n                                                             addToSearchList,\r\n                                                             dropdownScrollable\r\n                                                           }) => {\r\n  const containerRef = React.useRef<any>(null);\r\n  const theme = useTheme();\r\n  const topLevelRef = React.useRef<any>(null);\r\n\r\n  const [isOpen, setIsOpen] = React.useState(false);\r\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef, topLevelRef]);\r\n\r\n  const isPressingEnter = (e: any) => {\r\n    if (e.key === 'Enter') {\r\n      e.preventDefault();\r\n      e.stopPropagation();\r\n      return true;\r\n    }\r\n    return false;\r\n  };\r\n\r\n  const enteredSearchTerm = (e: any) => {\r\n    addToSearchList && addToSearchList({value:e.target.value});\r\n    enterSearch(e);\r\n  }\r\n\r\n  const dropdownAction = () => {\r\n    if(dropdownButtonAction)\r\n      dropdownButtonAction();    \r\n  }\r\n\r\n  return (\r\n    <>\r\n      <InputWrapper\r\n        $disabled={disabled}\r\n        ref={topLevelRef}\r\n        $margin={margin}>\r\n        <SearchField id={'id'} size={size}\r\n                     ref={containerRef}\r\n                     searchTerm={searchTerm}\r\n                     disabled={disabled}\r\n                     validationMessage={validationMessage}>\r\n          <SearchBarInput\r\n            placeholder={disabled ? '' : placeholder}\r\n            id={id}\r\n            size={size}\r\n            disabled={disabled}\r\n            setSearchTerm={(term: string) => setSearchTerm(term)}\r\n            searchTerm={searchTerm}\r\n            onKeyDown={onKeyDown}\r\n            enterSearch={enteredSearchTerm}\r\n            focusParentRefs={[containerRef]}\r\n            onClick={()=>setIsOpen(!isOpen)}\r\n            ref={dropdownRef}\r\n          />\r\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\r\n            <IconButton id={`${id}_Search`}\r\n                        variant=\"secondary\"\r\n                        shape=\"circular\"\r\n                        action={enterSearch}\r\n                        disabled={disabled}\r\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\r\n              <SystemIcons.Search size=\"24px\"/>\r\n            </IconButton>\r\n          </SearchIconWrapper>\r\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\r\n            <IconButton id={`${id}_Clear`}\r\n                        variant=\"secondary\"\r\n                        shape=\"circular\"\r\n                        action={removeSearch}\r\n                        disabled={disabled}\r\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\r\n              <SystemIcons.Clear size=\"24px\"/>\r\n            </IconButton>\r\n          </ClearIconWrapper>\r\n        </SearchField>\r\n\r\n      {showDropdown && <DropdownContent id={'search'}\r\n                                        containerRef={containerRef}\r\n          size={size}\r\n          isButton={false}\r\n          ariaRolesType=\"input\"\r\n          customizationProps={{\r\n            items:searchList,\r\n            action: dropdownAction,\r\n            actionLabel: dropdownButtonLabel,\r\n            actionIcon: dropdownButtonIcon,\r\n            actionVariant: dropdownButtonVariant,\r\n            onValueUpdate:(e)=>{},\r\n            scrollable: dropdownScrollable,\r\n            pinTopItem: true\r\n          }}\r\n          isOpen={isOpen}\r\n          setIsOpen={setIsOpen}\r\n          filter={''}\r\n          selectedValues={searchTerm ? [searchTerm] : []}\r\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\r\n          messageOnNoResults={''}\r\n          focused={null}\r\n          setFocused={()=>{}}\r\n        />}\r\n\r\n      </InputWrapper>\r\n      {validationMessage && (\r\n        <ErrorMessage className={size || ''}>\r\n          <SystemIcons.TechnicalWarning color={COLORS.getColor('critical_400', theme)} className={size || ''}/>\r\n          <span>{validationMessage}</span>\r\n        </ErrorMessage>\r\n      )}\r\n    </>\r\n  );\r\n};\r\n\r\nexport default SearchBar;\r\n"],"mappings":"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"}
+{"version":3,"file":"SearchBar.js","names":["React","COLORS","SystemIcons","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","useTheme","DropdownContent","useClickOutsideRef","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ClearIconWrapper","div","_templateObject","_taggedTemplateLiteral","SearchBar","_ref","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","_ref$searchList","searchList","addToSearchList","dropdownScrollable","containerRef","useRef","theme","topLevelRef","_React$useState","useState","_React$useState2","_slicedToArray","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","children","$disabled","ref","$margin","term","focusParentRefs","onClick","className","concat","variant","shape","action","onKeyPress","Search","Clear","isButton","ariaRolesType","customizationProps","items","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","filter","selectedValues","setSelectedValues","messageOnNoResults","focused","setFocused","TechnicalWarning","color","getColor","propTypes","_pt","string","isRequired","func","bool","node","oneOf","array"],"sources":["../../src/InputFields/SearchBar.tsx"],"sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {SystemIcons} from '../icons';\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\nimport {IconButton} from '../Button';\nimport SearchBarInput from './components/SearchBarInput';\nimport SearchField from './components/SearchField';\nimport {Size} from '../types';\nimport styled, { useTheme } from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\nexport type SearchBarProps = {\n  /**\n   * Required. The ID of the search bar.\n   */\n  id: string;\n\n  /**\n   * Optional. The current search term in the search bar.\n   */\n  searchTerm?: string;\n  /**\n   * Required. A function to be called when the search term changes.\n   * It should take a string representing the new search term.\n   */\n  setSearchTerm: (term: string) => void;\n  /**\n   * Required. A function to be called when the enter key is pressed in the search bar.\n   * It should take an event object as a parameter.\n   */\n  enterSearch: (e: any) => void;\n  /**\n   * Required. A function to be called when the search term is removed.\n   * It should take an event object as a parameter.\n   */\n  removeSearch: (e: any) => void;\n  /**\n   * Optional. The placeholder text to be displayed in the search bar when it is empty.\n   */\n  placeholder?: string;\n  /**\n   * Optional. The label for the search button in the search bar.\n   */\n  performSearchLabel?: string;\n  /**\n   * Optional. A boolean indicating whether the search bar is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Optional. The validation message to be displayed when the search bar is in an error state.\n   */\n  validationMessage?: string;\n  /**\n   * Optional. A function to be called when a keydown event occurs in the search bar.\n   */\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  /**\n   * Optional. The size of the search bar. Can be 'Small' or 'Medium'.\n   */\n  size?: Size.Small | Size.Medium;\n  /**\n   * Optional. The margin of the search bar. Can be any valid CSS margin value.\n   */\n  margin?: string;\n  /**\n   * Optional. A boolean indicating whether the dropdown in the search bar should be shown.\n   */\n  showDropdown?: boolean;\n  /**\n   * Optional. The icon for the dropdown button in the search bar.\n   */\n  dropdownButtonIcon?: React.ReactNode;\n  /**\n   * Optional. The label for the dropdown button in the search bar.\n   */  \n  dropdownButtonLabel?: string;\n  /**\n   * Optional. The variant of the dropdown button in the search bar. Can be 'primary', 'secondary', or 'tertiary'.\n   */  \n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  /**\n   * Optional. A function to be called when the dropdown button in the search bar is clicked.\n   */  \n  dropdownButtonAction?: () => boolean | void | undefined;\n  /**\n   * Optional. An array of DropdownItem objects representing the items in the dropdown.\n   */\n  searchList?: DropdownItem[];\n  /**\n   * Optional. A function to be called when an item is added to the dropdown.\n   * It should take a DropdownItem object as a parameter.\n   */\n  addToSearchList?: (e: DropdownItem) => void;\n  /**\n   * Optional. A boolean indicating whether the dropdown in the search bar is scrollable.\n   */\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<SearchBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin,\n                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n  const theme = useTheme();\n  const topLevelRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef, topLevelRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        $disabled={disabled}\n        ref={topLevelRef}\n        $margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <SystemIcons.Search size=\"24px\"/>\n            </IconButton>\n          </SearchIconWrapper>\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\n            <IconButton id={`${id}_Clear`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={removeSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\n              <SystemIcons.Clear size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          ariaRolesType=\"input\"\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <SystemIcons.TechnicalWarning color={COLORS.getColor('critical_400', theme)} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"mappings":"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","ignoreList":[]}

package/dist/InputFields/TextField.cjs

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -19,10 +19,10 @@ var _TooltipOverflow = _interopRequireDefault(require("../Tooltips/TooltipOverfl
 var _styledComponents = require("styled-components");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["id", "disabled", "readOnly", "onChange", "value", "validationMessage", "type", "autoComplete", "placeholder", "required", "pattern", "maxLength", "withoutBorder", "state", "size", "margin", "overflowTooltipPosition", "note", "className", "dataTestId"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var id = _ref.id,
     disabled = _ref.disabled,
@@ -44,7 +44,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     note = _ref.note,
     className = _ref.className,
     dataTestId = _ref.dataTestId,
-    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   var elementRef = (0, _common.useFocusVisibleRef)();
   var theme = (0, _styledComponents.useTheme)();
   React.useImperativeHandle(ref, function () {
@@ -82,7 +82,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         pattern: pattern,
         maxLength: maxLength,
         $withoutBorder: withoutBorder
-      }, rest)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipOverflow.default, {
+      }, rest)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipOverflow["default"], {
         value: value,
         position: overflowTooltipPosition,
         input: elementRef,
@@ -111,22 +111,22 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   });
 });
 TextField.propTypes = {
-  id: _propTypes.default.string,
-  disabled: _propTypes.default.bool,
-  readOnly: _propTypes.default.bool,
-  onChange: _propTypes.default.func,
-  value: _propTypes.default.string,
-  validationMessage: _propTypes.default.string,
-  type: _propTypes.default.string,
-  autoComplete: _propTypes.default.string,
-  placeholder: _propTypes.default.string,
-  required: _propTypes.default.bool,
-  pattern: _propTypes.default.string,
-  maxLength: _propTypes.default.number,
-  withoutBorder: _propTypes.default.bool,
-  overflowTooltipPosition: _propTypes.default.oneOf(['top', 'bottom']),
-  margin: _propTypes.default.string
+  id: _propTypes["default"].string,
+  disabled: _propTypes["default"].bool,
+  readOnly: _propTypes["default"].bool,
+  onChange: _propTypes["default"].func,
+  value: _propTypes["default"].string,
+  validationMessage: _propTypes["default"].string,
+  type: _propTypes["default"].string,
+  autoComplete: _propTypes["default"].string,
+  placeholder: _propTypes["default"].string,
+  required: _propTypes["default"].bool,
+  pattern: _propTypes["default"].string,
+  maxLength: _propTypes["default"].number,
+  withoutBorder: _propTypes["default"].bool,
+  overflowTooltipPosition: _propTypes["default"].oneOf(['top', 'bottom']),
+  margin: _propTypes["default"].string
 };
 var _default = TextField;
-exports.default = _default;
+exports["default"] = _default;
 //# sourceMappingURL=TextField.cjs.map

package/dist/InputFields/TextField.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.cjs","names":["TextField","React","forwardRef","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","overflowTooltipPosition","note","className","dataTestId","rest","elementRef","useFocusVisibleRef","theme","useTheme","useImperativeHandle","current","cls","States","Invalid","e","preventDefault","undefined","target","Valid","COLORS","getColor","icon","message"],"sources":["../../src/InputFields/TextField.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport {SystemIcons} from '../icons';\r\nimport {COLORS} from '../styles';\r\nimport {Size, States, Testable} from '../types';\r\nimport {InputFieldStyling, InputWrapper, NoteMessage, ValidationMessage} from './styling';\r\nimport {useFocusVisibleRef} from '../common';\r\nimport {TextFieldNote} from './types';\r\nimport TooltipOverflow from '../Tooltips/TooltipOverflow';\r\nimport { useTheme } from 'styled-components';\r\n\r\nexport type TextFieldProps =\r\n  Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange' | 'value' | 'disabled' | 'id'  | 'type' | 'readOnly' | 'autoComplete' | 'pattern' | 'maxLength'>\r\n  & {\r\n  /**\r\n     * Optional. The ID of the text field.\r\n     */\r\n  id?: string;\r\n\r\n  /**\r\n    * Optional. A boolean indicating whether the text field is disabled.\r\n    */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n    * Optional. A boolean indicating whether the text field is read-only.\r\n    */\r\n  readOnly?: boolean;\r\n\r\n  /**\r\n    * Optional. A function to be called when the text in the text field changes.\r\n    * It should take a string representing the new text.\r\n    */\r\n  onChange?: (text: string) => void;\r\n\r\n  /**\r\n    * Optional. The current value of the text field.\r\n    */\r\n  value?: string;\r\n\r\n  /**\r\n    * Optional. The validation message to be displayed when the text field is in an error state.\r\n    */\r\n  validationMessage?: string;\r\n\r\n  /**\r\n    * Optional. The type of the text field. Can be any valid HTML input type.\r\n    */\r\n  type?: string;\r\n\r\n  /**\r\n    * Optional. The state of the text field. Can be 'Invalid' or 'Valid'.\r\n    */\r\n  state?: States.Invalid | States.Valid;\r\n\r\n  /**\r\n    * Optional. The autocomplete attribute of the text field. Can be any valid HTML autocomplete value.\r\n    */\r\n  autoComplete?: string;\r\n\r\n  /**\r\n    * Optional. The placeholder text to be displayed in the text field when it is empty.\r\n    */\r\n  placeholder?: string;\r\n\r\n  /**\r\n    * Optional. A boolean indicating whether the text field is required.\r\n    */\r\n  required?: boolean;\r\n\r\n  /**\r\n    * Optional. The pattern attribute of the text field. Can be any valid HTML pattern value.\r\n    */\r\n  pattern?: string;\r\n\r\n  /**\r\n    * Optional. The maximum length of the text that can be entered in the text field.\r\n    */\r\n  maxLength?: number;\r\n\r\n  /**\r\n    * Optional. A boolean indicating whether the text field should be displayed without a border.\r\n    */\r\n  withoutBorder?: boolean;\r\n\r\n  /**\r\n    * Optional. The position of the overflow tooltip. Can be 'top' or 'bottom'.\r\n    */\r\n  overflowTooltipPosition?: 'top' | 'bottom';\r\n\r\n  /**\r\n    * Optional. The size of the text field. Can be 'Small' or 'Medium'.\r\n    */\r\n  size?: Size.Small | Size.Medium;\r\n\r\n  /**\r\n    * Optional. The margin of the text field. Can be any valid CSS margin value.\r\n    */\r\n  margin?: string;\r\n\r\n  /**\r\n    * Optional. A note to be displayed below the text field.\r\n    */\r\n  note?: TextFieldNote;\r\n};\r\n\r\nconst TextField = React.forwardRef<HTMLInputElement, TextFieldProps>(({\r\n                                      id,\r\n                                      disabled,\r\n                                      readOnly,\r\n                                      onChange,\r\n                                      value,\r\n                                      validationMessage,\r\n                                      type,\r\n                                      autoComplete,\r\n                                      placeholder,\r\n                                      required,\r\n                                      pattern,\r\n                                      maxLength,\r\n                                      withoutBorder,\r\n                                      state,\r\n                                      size,\r\n                                      margin,\r\n                                      overflowTooltipPosition,\r\n                                      note,\r\n                                      className,\r\n                                      dataTestId,\r\n                                      ...rest\r\n                                    }: TextFieldProps, ref) => {\r\n  const elementRef = useFocusVisibleRef();\r\n  const theme = useTheme();\r\n\r\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\r\n\r\n  const cls = `${state || (validationMessage ? States.Invalid : '')} ${size || ''}`;\r\n\r\n  return (\r\n    <>\r\n      <InputWrapper\r\n        $readOnly={readOnly}\r\n        $disabled={disabled}\r\n        $margin={margin}\r\n        onClick={(e: any) => {\r\n          if (disabled || readOnly) {\r\n            e.preventDefault();\r\n          }\r\n        }}>\r\n        <InputFieldStyling\r\n          id={id}\r\n          data-testid={dataTestId}\r\n          ref={elementRef}\r\n          type={type || 'text'}\r\n          value={value}\r\n          className={cls}\r\n          tabIndex={readOnly || disabled ? -1 : 0}\r\n          autoComplete={autoComplete}\r\n          placeholder={disabled ? undefined : placeholder}\r\n          disabled={disabled}\r\n          readOnly={readOnly}\r\n          onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\r\n          $activeErrorMessage={!!validationMessage && state !== States.Valid}\r\n          required={required}\r\n          pattern={pattern}\r\n          maxLength={maxLength}\r\n          $withoutBorder={withoutBorder}\r\n          {...rest}\r\n        />\r\n        <TooltipOverflow value={value} position={overflowTooltipPosition} input={elementRef} withArrow={true} maxWidth=\"100%\" size={size} align='end'>\r\n          {value}\r\n        </TooltipOverflow>\r\n\r\n        {validationMessage && (\r\n          <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n            {state === States.Valid ? <SystemIcons.CheckMark color={COLORS.getColor('correct_400', theme)}/> :\r\n              <SystemIcons.TechnicalWarning color={COLORS.getColor('critical_400', theme)}/>}\r\n            <span>{validationMessage}</span>\r\n          </ValidationMessage>\r\n        )}\r\n        {note && !disabled && (\r\n          <NoteMessage className={size}>\r\n            {note.icon}\r\n            <span>{note.message}</span>\r\n          </NoteMessage>\r\n        )}\r\n      </InputWrapper>\r\n    </>\r\n  );\r\n});\r\n\r\nexport default TextField;\r\n"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAA6C;AAAA;AAAA;AAAA;AAAA;AAAA;AAiG7C,IAAMA,SAAS,gBAAGC,KAAK,CAACC,UAAU,CAAmC,gBAsBdC,GAAG,EAAK;EAAA,IArBzBC,EAAE,QAAFA,EAAE;IACFC,QAAQ,QAARA,QAAQ;IACRC,QAAQ,QAARA,QAAQ;IACRC,SAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,iBAAiB,QAAjBA,iBAAiB;IACjBC,IAAI,QAAJA,IAAI;IACJC,YAAY,QAAZA,YAAY;IACZC,WAAW,QAAXA,WAAW;IACXC,QAAQ,QAARA,QAAQ;IACRC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,aAAa,QAAbA,aAAa;IACbC,KAAK,QAALA,KAAK;IACLC,IAAI,QAAJA,IAAI;IACJC,MAAM,QAANA,MAAM;IACNC,uBAAuB,QAAvBA,uBAAuB;IACvBC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,UAAU,QAAVA,UAAU;IACPC,IAAI;EAE3C,IAAMC,UAAU,GAAG,IAAAC,0BAAkB,GAAE;EACvC,IAAMC,KAAK,GAAG,IAAAC,0BAAQ,GAAE;EAExB3B,KAAK,CAAC4B,mBAAmB,CAAC1B,GAAG,EAAE;IAAA,OAAMsB,UAAU,CAACK,OAAO;EAAA,GAAE,CAACL,UAAU,CAAC,CAAC;EAEtE,IAAMM,GAAG,aAAMd,KAAK,KAAKR,iBAAiB,GAAGuB,aAAM,CAACC,OAAO,GAAG,EAAE,CAAC,cAAIf,IAAI,IAAI,EAAE,CAAE;EAEjF,oBACE;IAAA,uBACE,sBAAC,qBAAY;MACX,SAAS,EAAEZ,QAAS;MACpB,SAAS,EAAED,QAAS;MACpB,OAAO,EAAEc,MAAO;MAChB,OAAO,EAAE,iBAACe,CAAM,EAAK;QACnB,IAAI7B,QAAQ,IAAIC,QAAQ,EAAE;UACxB4B,CAAC,CAACC,cAAc,EAAE;QACpB;MACF,CAAE;MAAA,wBACF,qBAAC,0BAAiB;QAChB,EAAE,EAAE/B,EAAG;QACP,eAAamB,UAAW;QACxB,GAAG,EAAEE,UAAW;QAChB,IAAI,EAAEf,IAAI,IAAI,MAAO;QACrB,KAAK,EAAEF,KAAM;QACb,SAAS,EAAEuB,GAAI;QACf,QAAQ,EAAEzB,QAAQ,IAAID,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAE;QACxC,YAAY,EAAEM,YAAa;QAC3B,WAAW,EAAEN,QAAQ,GAAG+B,SAAS,GAAGxB,WAAY;QAChD,QAAQ,EAAEP,QAAS;QACnB,QAAQ,EAAEC,QAAS;QACnB,QAAQ,EAAE,kBAAC4B,CAAM;UAAA;UAAA,OAAK3B,SAAQ,IAAIA,SAAQ,CAAC,CAAA2B,CAAC,aAADA,CAAC,oCAADA,CAAC,CAAEG,MAAM,8CAAT,UAAW7B,KAAK,KAAI,EAAE,CAAC;QAAA,CAAC;QACnE,mBAAmB,EAAE,CAAC,CAACC,iBAAiB,IAAIQ,KAAK,KAAKe,aAAM,CAACM,KAAM;QACnE,QAAQ,EAAEzB,QAAS;QACnB,OAAO,EAAEC,OAAQ;QACjB,SAAS,EAAEC,SAAU;QACrB,cAAc,EAAEC;MAAc,GAC1BQ,IAAI,EACR,eACF,qBAAC,wBAAe;QAAC,KAAK,EAAEhB,KAAM;QAAC,QAAQ,EAAEY,uBAAwB;QAAC,KAAK,EAAEK,UAAW;QAAC,SAAS,EAAE,IAAK;QAAC,QAAQ,EAAC,MAAM;QAAC,IAAI,EAAEP,IAAK;QAAC,KAAK,EAAC,KAAK;QAAA,UAC1IV;MAAK,EACU,EAEjBC,iBAAiB,iBAChB,sBAAC,0BAAiB;QAAC,SAAS,EAAES,IAAI,IAAI,EAAG;QAAC,IAAI,EAAED,KAAK,aAALA,KAAK,cAALA,KAAK,GAAIe,aAAM,CAACC,OAAQ;QAAA,WACrEhB,KAAK,KAAKe,aAAM,CAACM,KAAK,gBAAG,qBAAC,kBAAW,CAAC,SAAS;UAAC,KAAK,EAAEC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEb,KAAK;QAAE,EAAE,gBAC9F,qBAAC,kBAAW,CAAC,gBAAgB;UAAC,KAAK,EAAEY,cAAM,CAACC,QAAQ,CAAC,cAAc,EAAEb,KAAK;QAAE,EAAE,eAChF;UAAA,UAAOlB;QAAiB,EAAQ;MAAA,EAEnC,EACAY,IAAI,IAAI,CAAChB,QAAQ,iBAChB,sBAAC,oBAAW;QAAC,SAAS,EAAEa,IAAK;QAAA,WAC1BG,IAAI,CAACoB,IAAI,eACV;UAAA,UAAOpB,IAAI,CAACqB;QAAO,EAAQ;MAAA,EAE9B;IAAA;EACY,EACd;AAEP,CAAC,CAAC;AAAC;EA1KDtC,EAAE;EAKFC,QAAQ;EAKRC,QAAQ;EAMRC,QAAQ;EAKRC,KAAK;EAKLC,iBAAiB;EAKjBC,IAAI;EAUJC,YAAY;EAKZC,WAAW;EAKXC,QAAQ;EAKRC,OAAO;EAKPC,SAAS;EAKTC,aAAa;EAKbI,uBAAuB,4BAAG,KAAK,EAAG,QAAQ;EAU1CD,MAAM;AAAA;AAAA,eA2FOnB,SAAS;AAAA"}
+{"version":3,"file":"TextField.cjs","names":["React","_interopRequireWildcard","require","_icons","_styles","_types","_styling","_common","_TooltipOverflow","_interopRequireDefault","_styledComponents","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","TextField","forwardRef","_ref","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","overflowTooltipPosition","note","className","dataTestId","rest","_objectWithoutProperties2","elementRef","useFocusVisibleRef","theme","useTheme","useImperativeHandle","current","cls","concat","States","Invalid","jsx","Fragment","children","jsxs","InputWrapper","$readOnly","$disabled","$margin","onClick","preventDefault","InputFieldStyling","tabIndex","undefined","_e$target","target","$activeErrorMessage","Valid","$withoutBorder","position","input","withArrow","maxWidth","align","ValidationMessage","SystemIcons","CheckMark","color","COLORS","getColor","TechnicalWarning","NoteMessage","icon","message","propTypes","_propTypes","string","bool","func","number","oneOf","_default","exports"],"sources":["../../src/InputFields/TextField.tsx"],"sourcesContent":["import * as React from 'react';\nimport {SystemIcons} from '../icons';\nimport {COLORS} from '../styles';\nimport {Size, States, Testable} from '../types';\nimport {InputFieldStyling, InputWrapper, NoteMessage, ValidationMessage} from './styling';\nimport {useFocusVisibleRef} from '../common';\nimport {TextFieldNote} from './types';\nimport TooltipOverflow from '../Tooltips/TooltipOverflow';\nimport { useTheme } from 'styled-components';\n\nexport type TextFieldProps =\n  Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange' | 'value' | 'disabled' | 'id'  | 'type' | 'readOnly' | 'autoComplete' | 'pattern' | 'maxLength'>\n  & {\n  /**\n     * Optional. The ID of the text field.\n     */\n  id?: string;\n\n  /**\n    * Optional. A boolean indicating whether the text field is disabled.\n    */\n  disabled?: boolean;\n\n  /**\n    * Optional. A boolean indicating whether the text field is read-only.\n    */\n  readOnly?: boolean;\n\n  /**\n    * Optional. A function to be called when the text in the text field changes.\n    * It should take a string representing the new text.\n    */\n  onChange?: (text: string) => void;\n\n  /**\n    * Optional. The current value of the text field.\n    */\n  value?: string;\n\n  /**\n    * Optional. The validation message to be displayed when the text field is in an error state.\n    */\n  validationMessage?: string;\n\n  /**\n    * Optional. The type of the text field. Can be any valid HTML input type.\n    */\n  type?: string;\n\n  /**\n    * Optional. The state of the text field. Can be 'Invalid' or 'Valid'.\n    */\n  state?: States.Invalid | States.Valid;\n\n  /**\n    * Optional. The autocomplete attribute of the text field. Can be any valid HTML autocomplete value.\n    */\n  autoComplete?: string;\n\n  /**\n    * Optional. The placeholder text to be displayed in the text field when it is empty.\n    */\n  placeholder?: string;\n\n  /**\n    * Optional. A boolean indicating whether the text field is required.\n    */\n  required?: boolean;\n\n  /**\n    * Optional. The pattern attribute of the text field. Can be any valid HTML pattern value.\n    */\n  pattern?: string;\n\n  /**\n    * Optional. The maximum length of the text that can be entered in the text field.\n    */\n  maxLength?: number;\n\n  /**\n    * Optional. A boolean indicating whether the text field should be displayed without a border.\n    */\n  withoutBorder?: boolean;\n\n  /**\n    * Optional. The position of the overflow tooltip. Can be 'top' or 'bottom'.\n    */\n  overflowTooltipPosition?: 'top' | 'bottom';\n\n  /**\n    * Optional. The size of the text field. Can be 'Small' or 'Medium'.\n    */\n  size?: Size.Small | Size.Medium;\n\n  /**\n    * Optional. The margin of the text field. Can be any valid CSS margin value.\n    */\n  margin?: string;\n\n  /**\n    * Optional. A note to be displayed below the text field.\n    */\n  note?: TextFieldNote;\n};\n\nconst TextField = React.forwardRef<HTMLInputElement, TextFieldProps>(({\n                                      id,\n                                      disabled,\n                                      readOnly,\n                                      onChange,\n                                      value,\n                                      validationMessage,\n                                      type,\n                                      autoComplete,\n                                      placeholder,\n                                      required,\n                                      pattern,\n                                      maxLength,\n                                      withoutBorder,\n                                      state,\n                                      size,\n                                      margin,\n                                      overflowTooltipPosition,\n                                      note,\n                                      className,\n                                      dataTestId,\n                                      ...rest\n                                    }: TextFieldProps, ref) => {\n  const elementRef = useFocusVisibleRef();\n  const theme = useTheme();\n\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\n\n  const cls = `${state || (validationMessage ? States.Invalid : '')} ${size || ''}`;\n\n  return (\n    <>\n      <InputWrapper\n        $readOnly={readOnly}\n        $disabled={disabled}\n        $margin={margin}\n        onClick={(e: any) => {\n          if (disabled || readOnly) {\n            e.preventDefault();\n          }\n        }}>\n        <InputFieldStyling\n          id={id}\n          data-testid={dataTestId}\n          ref={elementRef}\n          type={type || 'text'}\n          value={value}\n          className={cls}\n          tabIndex={readOnly || disabled ? -1 : 0}\n          autoComplete={autoComplete}\n          placeholder={disabled ? undefined : placeholder}\n          disabled={disabled}\n          readOnly={readOnly}\n          onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n          $activeErrorMessage={!!validationMessage && state !== States.Valid}\n          required={required}\n          pattern={pattern}\n          maxLength={maxLength}\n          $withoutBorder={withoutBorder}\n          {...rest}\n        />\n        <TooltipOverflow value={value} position={overflowTooltipPosition} input={elementRef} withArrow={true} maxWidth=\"100%\" size={size} align='end'>\n          {value}\n        </TooltipOverflow>\n\n        {validationMessage && (\n          <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n            {state === States.Valid ? <SystemIcons.CheckMark color={COLORS.getColor('correct_400', theme)}/> :\n              <SystemIcons.TechnicalWarning color={COLORS.getColor('critical_400', theme)}/>}\n            <span>{validationMessage}</span>\n          </ValidationMessage>\n        )}\n        {note && !disabled && (\n          <NoteMessage className={size}>\n            {note.icon}\n            <span>{note.message}</span>\n          </NoteMessage>\n        )}\n      </InputWrapper>\n    </>\n  );\n});\n\nexport default TextField;\n"],"mappings":"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","ignoreList":[]}