@laerdal/life-react-components 3.4.2 → 3.5.0

package/dist/InputFields/RichTextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"RichTextField.js","names":["React","ReactQuill","styled","NoteMessage","readOnlyState","ValidationMessage","Size","States","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","scrollBarStyling","CheckMark","TechnicalWarning","RichTextFieldContainer","div","neutral_400","correct_500","critical_500","primary_700","primary_800","Regular","black","Italic","neutral_500","neutral_200","Small","neutral_100","neutral_300","RichTextFieldFormats","defaultToolBarOptions","header","RichTextField","forwardRef","ref","readOnly","disabled","validationMessage","note","size","Medium","state","resizable","modules","formats","rest","m","toolbar","f","Object","values","filter","a","Image","Video","Formula","Invalid","Valid","correct_400","critical_400","icon","message","id","className","placeholder","onKeyDown","onKeyPress","onKeyUp","value","onChange"],"sources":["../../src/InputFields/RichTextField.tsx"],"sourcesContent":["import React from 'react';\nimport ReactQuill, {Range, UnprivilegedEditor} from \"react-quill\";\nimport {TextFieldNote} from \"./types\";\nimport styled from \"styled-components\";\nimport {NoteMessage, readOnlyState, ValidationMessage} from \"./styling\";\nimport {Size, States} from \"../types\";\nimport {COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, scrollBarStyling} from \"../styles\";\nimport {CheckMark, TechnicalWarning} from \"../icons/systemicons\";\nimport {Sources, StringMap} from \"quill\";\nimport 'react-quill/dist/quill.snow.css';\n\nexport const RichTextFieldContainer = styled.div`\n  .quill {\n    width: 100%;\n    margin-bottom: 4px;\n    overflow: hidden;\n\n    box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\n    border-radius: 4px;\n  }\n\n  .quill.valid {\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\n  }\n\n  .quill.invalid {\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\n  }\n\n  .quill:hover {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\n  }\n\n  .quill:focus-within {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  .ql-editor,\n  .ql-editor p{\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n  }\n\n  .ql-editor.ql-blank::before {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n  }\n\n  &.medium {\n    .ql-editor,\n    .ql-editor p{\n      ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n    }\n\n    .ql-editor.ql-blank::before {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  .ql-toolbar.ql-snow {\n    border: none;\n    padding: 8px 7px;\n    margin: 0 1px;\n    border-bottom: 1px solid ${COLORS.neutral_200};\n  }\n\n  .quill.valid .ql-toolbar,\n  .quill.invalid .ql-toolbar,\n  .quill:hover .ql-toolbar,\n  .quill:focus-within .ql-toolbar {\n    padding: 8px 6px;\n    margin: 0 2px;\n  }\n\n  .ql-container {\n    font-family: unset !important;\n  }\n\n  .ql-container.ql-snow {\n    border: none;\n    overflow-y: hidden;\n    padding: 8px;\n  }\n\n  .ql-editor {\n    padding: 8px;\n    overflow-y: auto;\n\n    ${scrollBarStyling(Size.Small)}\n  }\n\n  &.resizable {\n    height: initial;\n\n    .quill {\n      flex: none;\n      overflow: initial;\n    }\n\n    .ql-container {\n      flex: none;\n      resize: vertical;\n    }\n\n    .ql-editor {\n      height: 100%;\n    }\n  }\n\n  &.readonly {\n    .quill {\n      ${readOnlyState}\n    }\n  }\n\n  &.disabled {\n    cursor: not-allowed;\n\n    .quill {\n      pointer-events: none;\n      box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\n      color: ${COLORS.neutral_300};\n\n      .ql-editor.ql-blank::before {\n        color: ${COLORS.neutral_300};\n      }\n    }\n  }\n`;\n\nexport enum RichTextFieldFormats {\n  Background = 'background',\n  Bold = 'bold',\n  Color = 'color',\n  Font = 'font',\n  Code = 'code',\n  Italic = 'italic',\n  Link = 'link',\n  Size = 'size',\n  Strike = 'strike',\n  Script = 'script',\n  Underline = 'underline',\n  Blockquote = 'blockquote',\n  Header = 'header',\n  Indent = 'indent',\n  List = 'list',\n  Align = 'align',\n  Direction = 'direction',\n  CodeBlock = 'code-block',\n  Formula = 'formula',\n  Image = 'image',\n  Video = 'video'\n}\n\nconst defaultToolBarOptions = [\n  [{header: [1, 2, 3, false]}],\n  ['bold', 'italic', 'underline', 'strike'],\n  [{'list': 'ordered'}, {'list': 'bullet'}],\n  ['link'],\n  ['clean']\n];\n\nexport interface RichTextFieldProps {\n  id?: string;\n  className?: string;\n  placeholder?: string;\n  readOnly?: boolean;\n  disabled?: boolean;\n  resizable?: boolean;\n\n  modules?: StringMap;\n  formats?: RichTextFieldFormats[];\n\n  onFocus?(selection: Range, source: Sources, editor: UnprivilegedEditor): void;\n\n  onBlur?(previousSelection: Range, source: Sources, editor: UnprivilegedEditor): void;\n\n  onKeyDown?: React.EventHandler<any>;\n  onKeyPress?: React.EventHandler<any>;\n  onKeyUp?: React.EventHandler<any>;\n\n  value: any;\n  onChange: (value: any) => void;\n\n  validationMessage?: string;\n  note?: TextFieldNote;\n  size?: Size.Small | Size.Medium;\n  state?: States.Invalid | States.Valid;\n}\n\nexport const RichTextField = React.forwardRef<any, RichTextFieldProps>(({\n                                                                          readOnly,\n                                                                          disabled,\n                                                                          validationMessage,\n                                                                          note,\n                                                                          size = Size.Medium,\n                                                                          state,\n                                                                          resizable,\n                                                                          modules,\n                                                                          formats,\n                                                                          ...rest\n                                                                        }: RichTextFieldProps, ref) => {\n\n  let m = {...(modules ?? {}), toolbar: modules?.toolbar ?? defaultToolBarOptions};\n  let f = formats ?? Object.values(RichTextFieldFormats).filter(a => a !== RichTextFieldFormats.Image && a !== RichTextFieldFormats.Video && a !== RichTextFieldFormats.Formula);\n\n  return (\n    <RichTextFieldContainer\n      className={`${resizable ? 'resizable' : ''} ${size} ${state || ''} ${readOnly ? 'readonly' : ''}  ${disabled ? 'disabled' : ''}`}>\n      <ReactQuill ref={ref}\n                  readOnly={readOnly || disabled}\n                  modules={m}\n                  theme={'snow'}\n                  formats={f}\n                  {...rest}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {\n            state === States.Valid\n              ? <CheckMark color={COLORS.correct_400}/>\n              : <TechnicalWarning color={COLORS.critical_400}/>\n          }\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    </RichTextFieldContainer>\n  )\n});"],"mappings":"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"}
+{"version":3,"file":"RichTextField.js","names":["React","ReactQuill","styled","NoteMessage","readOnlyState","ValidationMessage","Size","States","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","scrollBarStyling","CheckMark","TechnicalWarning","RichTextFieldContainer","div","neutral_400","correct_500","critical_500","primary_700","primary_800","Regular","black","Italic","neutral_500","neutral_200","Small","neutral_100","neutral_300","RichTextFieldFormats","defaultToolBarOptions","header","RichTextField","forwardRef","ref","readOnly","disabled","validationMessage","note","size","Medium","state","resizable","modules","formats","rest","m","toolbar","f","Object","values","filter","a","Image","Video","Formula","Invalid","Valid","correct_400","critical_400","icon","message","id","className","placeholder","onKeyDown","onKeyPress","onKeyUp","value","onChange"],"sources":["../../src/InputFields/RichTextField.tsx"],"sourcesContent":["import React from 'react';\r\nimport ReactQuill, {Range, UnprivilegedEditor} from \"react-quill\";\r\nimport {TextFieldNote} from \"./types\";\r\nimport styled from \"styled-components\";\r\nimport {NoteMessage, readOnlyState, ValidationMessage} from \"./styling\";\r\nimport {Size, States} from \"../types\";\r\nimport {COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, scrollBarStyling} from \"../styles\";\r\nimport {CheckMark, TechnicalWarning} from \"../icons/systemicons\";\r\nimport {Sources, StringMap} from \"quill\";\r\nimport 'react-quill/dist/quill.snow.css';\r\n\r\nexport const RichTextFieldContainer = styled.div`\r\n  .quill {\r\n    width: 100%;\r\n    margin-bottom: 4px;\r\n    overflow: hidden;\r\n\r\n    box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\r\n    border-radius: 4px;\r\n  }\r\n\r\n  .quill.valid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\r\n  }\r\n\r\n  .quill.invalid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\r\n  }\r\n\r\n  .quill:hover {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\r\n  }\r\n\r\n  .quill:focus-within {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  .ql-editor,\r\n  .ql-editor p{\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n  }\r\n\r\n  .ql-editor.ql-blank::before {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n  }\r\n\r\n  &.medium {\r\n    .ql-editor,\r\n    .ql-editor p{\r\n      ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    }\r\n\r\n    .ql-editor.ql-blank::before {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  .ql-toolbar.ql-snow {\r\n    border: none;\r\n    padding: 8px 7px;\r\n    margin: 0 1px;\r\n    border-bottom: 1px solid ${COLORS.neutral_200};\r\n  }\r\n\r\n  .quill.valid .ql-toolbar,\r\n  .quill.invalid .ql-toolbar,\r\n  .quill:hover .ql-toolbar,\r\n  .quill:focus-within .ql-toolbar {\r\n    padding: 8px 6px;\r\n    margin: 0 2px;\r\n  }\r\n\r\n  .ql-container {\r\n    font-family: unset !important;\r\n  }\r\n\r\n  .ql-container.ql-snow {\r\n    border: none;\r\n    overflow-y: hidden;\r\n    padding: 8px;\r\n  }\r\n\r\n  .ql-editor {\r\n    padding: 8px;\r\n    overflow-y: auto;\r\n\r\n    ${scrollBarStyling(Size.Small)}\r\n  }\r\n\r\n  &.resizable {\r\n    height: initial;\r\n\r\n    .quill {\r\n      flex: none;\r\n      overflow: initial;\r\n    }\r\n\r\n    .ql-container {\r\n      flex: none;\r\n      resize: vertical;\r\n    }\r\n\r\n    .ql-editor {\r\n      height: 100%;\r\n    }\r\n  }\r\n\r\n  &.readonly {\r\n    .quill {\r\n      ${readOnlyState}\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n\r\n    .quill {\r\n      pointer-events: none;\r\n      box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\r\n      color: ${COLORS.neutral_300};\r\n\r\n      .ql-editor.ql-blank::before {\r\n        color: ${COLORS.neutral_300};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nexport enum RichTextFieldFormats {\r\n  Background = 'background',\r\n  Bold = 'bold',\r\n  Color = 'color',\r\n  Font = 'font',\r\n  Code = 'code',\r\n  Italic = 'italic',\r\n  Link = 'link',\r\n  Size = 'size',\r\n  Strike = 'strike',\r\n  Script = 'script',\r\n  Underline = 'underline',\r\n  Blockquote = 'blockquote',\r\n  Header = 'header',\r\n  Indent = 'indent',\r\n  List = 'list',\r\n  Align = 'align',\r\n  Direction = 'direction',\r\n  CodeBlock = 'code-block',\r\n  Formula = 'formula',\r\n  Image = 'image',\r\n  Video = 'video'\r\n}\r\n\r\nconst defaultToolBarOptions = [\r\n  [{header: [1, 2, 3, false]}],\r\n  ['bold', 'italic', 'underline', 'strike'],\r\n  [{'list': 'ordered'}, {'list': 'bullet'}],\r\n  ['link'],\r\n  ['clean']\r\n];\r\n\r\nexport interface RichTextFieldProps {\r\n  id?: string;\r\n  className?: string;\r\n  placeholder?: string;\r\n  readOnly?: boolean;\r\n  disabled?: boolean;\r\n  resizable?: boolean;\r\n\r\n  modules?: StringMap;\r\n  formats?: RichTextFieldFormats[];\r\n\r\n  onFocus?(selection: Range, source: Sources, editor: UnprivilegedEditor): void;\r\n\r\n  onBlur?(previousSelection: Range, source: Sources, editor: UnprivilegedEditor): void;\r\n\r\n  onKeyDown?: React.EventHandler<any>;\r\n  onKeyPress?: React.EventHandler<any>;\r\n  onKeyUp?: React.EventHandler<any>;\r\n\r\n  value: any;\r\n  onChange: (value: any) => void;\r\n\r\n  validationMessage?: string;\r\n  note?: TextFieldNote;\r\n  size?: Size.Small | Size.Medium;\r\n  state?: States.Invalid | States.Valid;\r\n}\r\n\r\nexport const RichTextField = React.forwardRef<any, RichTextFieldProps>(({\r\n                                                                          readOnly,\r\n                                                                          disabled,\r\n                                                                          validationMessage,\r\n                                                                          note,\r\n                                                                          size = Size.Medium,\r\n                                                                          state,\r\n                                                                          resizable,\r\n                                                                          modules,\r\n                                                                          formats,\r\n                                                                          ...rest\r\n                                                                        }: RichTextFieldProps, ref) => {\r\n\r\n  let m = {...(modules ?? {}), toolbar: modules?.toolbar ?? defaultToolBarOptions};\r\n  let f = formats ?? Object.values(RichTextFieldFormats).filter(a => a !== RichTextFieldFormats.Image && a !== RichTextFieldFormats.Video && a !== RichTextFieldFormats.Formula);\r\n\r\n  return (\r\n    <RichTextFieldContainer\r\n      className={`${resizable ? 'resizable' : ''} ${size} ${state || ''} ${readOnly ? 'readonly' : ''}  ${disabled ? 'disabled' : ''}`}>\r\n      <ReactQuill ref={ref}\r\n                  readOnly={readOnly || disabled}\r\n                  modules={m}\r\n                  theme={'snow'}\r\n                  formats={f}\r\n                  {...rest}\r\n      />\r\n      {validationMessage && (\r\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n          {\r\n            state === States.Valid\r\n              ? <CheckMark color={COLORS.correct_400}/>\r\n              : <TechnicalWarning color={COLORS.critical_400}/>\r\n          }\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    </RichTextFieldContainer>\r\n  )\r\n});"],"mappings":"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"}

package/dist/InputFields/SearchBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.cjs","names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","useClickOutsideRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"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 from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\nexport type SearchBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\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\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\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        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.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"mappings":"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"}
+{"version":3,"file":"SearchBar.cjs","names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","useClickOutsideRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"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 from 'styled-components';\r\nimport { DropdownContent, DropdownItem } from '../Dropdown';\r\nimport { useClickOutsideRef } from '../common';\r\n\r\nexport type SearchBarProps = {\r\n  id: string;\r\n  searchTerm?: string;\r\n  setSearchTerm: (term: string) => void;\r\n  enterSearch: (e: any) => void;\r\n  removeSearch: (e: any) => void;\r\n  placeholder?: string;\r\n  performSearchLabel?: string;\r\n  disabled?: boolean;\r\n  validationMessage?: string;\r\n  onKeyDown?: (e: React.KeyboardEvent) => void;\r\n  size?: Size.Small | Size.Medium;\r\n  margin?: string;\r\n  showDropdown?: boolean;\r\n  dropdownButtonIcon?: React.ReactNode;\r\n  dropdownButtonLabel?: string;\r\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\r\n  dropdownButtonAction?: () => boolean | void | undefined;\r\n  searchList?: DropdownItem[];\r\n  addToSearchList?: (e: DropdownItem) => void;\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\r\n  const [isOpen, setIsOpen] = React.useState(false);\r\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\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        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.critical_400} 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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"}

package/dist/InputFields/SearchBar.d.ts

@@ -1,27 +1,27 @@
-import React from 'react';
-import { Size } from '../types';
-import { DropdownItem } from '../Dropdown';
-export type SearchBarProps = {
-    id: string;
-    searchTerm?: string;
-    setSearchTerm: (term: string) => void;
-    enterSearch: (e: any) => void;
-    removeSearch: (e: any) => void;
-    placeholder?: string;
-    performSearchLabel?: string;
-    disabled?: boolean;
-    validationMessage?: string;
-    onKeyDown?: (e: React.KeyboardEvent) => void;
-    size?: Size.Small | Size.Medium;
-    margin?: string;
-    showDropdown?: boolean;
-    dropdownButtonIcon?: React.ReactNode;
-    dropdownButtonLabel?: string;
-    dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';
-    dropdownButtonAction?: () => boolean | void | undefined;
-    searchList?: DropdownItem[];
-    addToSearchList?: (e: DropdownItem) => void;
-    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 = {
+    id: string;
+    searchTerm?: string;
+    setSearchTerm: (term: string) => void;
+    enterSearch: (e: any) => void;
+    removeSearch: (e: any) => void;
+    placeholder?: string;
+    performSearchLabel?: string;
+    disabled?: boolean;
+    validationMessage?: string;
+    onKeyDown?: (e: React.KeyboardEvent) => void;
+    size?: Size.Small | Size.Medium;
+    margin?: string;
+    showDropdown?: boolean;
+    dropdownButtonIcon?: React.ReactNode;
+    dropdownButtonLabel?: string;
+    dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';
+    dropdownButtonAction?: () => boolean | void | undefined;
+    searchList?: DropdownItem[];
+    addToSearchList?: (e: DropdownItem) => void;
+    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","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","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","critical_400"],"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 from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\nexport type SearchBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\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\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\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        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.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"mappings":"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"}
+{"version":3,"file":"SearchBar.js","names":["React","COLORS","SystemIcons","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","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","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","critical_400"],"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 from 'styled-components';\r\nimport { DropdownContent, DropdownItem } from '../Dropdown';\r\nimport { useClickOutsideRef } from '../common';\r\n\r\nexport type SearchBarProps = {\r\n  id: string;\r\n  searchTerm?: string;\r\n  setSearchTerm: (term: string) => void;\r\n  enterSearch: (e: any) => void;\r\n  removeSearch: (e: any) => void;\r\n  placeholder?: string;\r\n  performSearchLabel?: string;\r\n  disabled?: boolean;\r\n  validationMessage?: string;\r\n  onKeyDown?: (e: React.KeyboardEvent) => void;\r\n  size?: Size.Small | Size.Medium;\r\n  margin?: string;\r\n  showDropdown?: boolean;\r\n  dropdownButtonIcon?: React.ReactNode;\r\n  dropdownButtonLabel?: string;\r\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\r\n  dropdownButtonAction?: () => boolean | void | undefined;\r\n  searchList?: DropdownItem[];\r\n  addToSearchList?: (e: DropdownItem) => void;\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\r\n  const [isOpen, setIsOpen] = React.useState(false);\r\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\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        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.critical_400} 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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"}

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","useImperativeHandle","current","cls","States","Invalid","e","preventDefault","undefined","target","Valid","COLORS","correct_400","critical_400","icon","message"],"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';\n\nexport type TextFieldProps =\n  Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange' | 'value' | 'disabled' | 'id'  | 'type' | 'readOnly' | 'autoComplete' | 'pattern' | 'maxLength'>\n  & {\n  id?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  onChange?: (text: string) => void;\n  value?: string;\n  validationMessage?: string;\n  type?: string;\n  state?: States.Invalid | States.Valid;\n  autoComplete?: string;\n  placeholder?: string;\n  required?: boolean;\n  pattern?: string;\n  maxLength?: number;\n  withoutBorder?: boolean;\n  overflowTooltipPosition?: 'top' | 'bottom';\n  size?: Size.Small | Size.Medium;\n  margin?: string;\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\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.correct_400}/> :\n              <SystemIcons.TechnicalWarning color={COLORS.critical_400}/>}\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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"}
+{"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","useImperativeHandle","current","cls","States","Invalid","e","preventDefault","undefined","target","Valid","COLORS","correct_400","critical_400","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\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  id?: string;\r\n  disabled?: boolean;\r\n  readOnly?: boolean;\r\n  onChange?: (text: string) => void;\r\n  value?: string;\r\n  validationMessage?: string;\r\n  type?: string;\r\n  state?: States.Invalid | States.Valid;\r\n  autoComplete?: string;\r\n  placeholder?: string;\r\n  required?: boolean;\r\n  pattern?: string;\r\n  maxLength?: number;\r\n  withoutBorder?: boolean;\r\n  overflowTooltipPosition?: 'top' | 'bottom';\r\n  size?: Size.Small | Size.Medium;\r\n  margin?: string;\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\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.correct_400}/> :\r\n              <SystemIcons.TechnicalWarning color={COLORS.critical_400}/>}\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":"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"}

package/dist/InputFields/TextField.d.ts

@@ -1,44 +1,44 @@
-import * as React from 'react';
-import { Size, States, Testable } from '../types';
-import { TextFieldNote } from './types';
-export type TextFieldProps = Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange' | 'value' | 'disabled' | 'id' | 'type' | 'readOnly' | 'autoComplete' | 'pattern' | 'maxLength'> & {
-    id?: string;
-    disabled?: boolean;
-    readOnly?: boolean;
-    onChange?: (text: string) => void;
-    value?: string;
-    validationMessage?: string;
-    type?: string;
-    state?: States.Invalid | States.Valid;
-    autoComplete?: string;
-    placeholder?: string;
-    required?: boolean;
-    pattern?: string;
-    maxLength?: number;
-    withoutBorder?: boolean;
-    overflowTooltipPosition?: 'top' | 'bottom';
-    size?: Size.Small | Size.Medium;
-    margin?: string;
-    note?: TextFieldNote;
-};
-declare const TextField: React.ForwardRefExoticComponent<Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, "pattern" | "type" | "id" | "onChange" | "size" | "disabled" | "value" | "autoComplete" | "maxLength" | "readOnly"> & {
-    id?: string | undefined;
-    disabled?: boolean | undefined;
-    readOnly?: boolean | undefined;
-    onChange?: ((text: string) => void) | undefined;
-    value?: string | undefined;
-    validationMessage?: string | undefined;
-    type?: string | undefined;
-    state?: States.Valid | States.Invalid | undefined;
-    autoComplete?: string | undefined;
-    placeholder?: string | undefined;
-    required?: boolean | undefined;
-    pattern?: string | undefined;
-    maxLength?: number | undefined;
-    withoutBorder?: boolean | undefined;
-    overflowTooltipPosition?: "top" | "bottom" | undefined;
-    size?: Size.Small | Size.Medium | undefined;
-    margin?: string | undefined;
-    note?: TextFieldNote | undefined;
-} & React.RefAttributes<HTMLInputElement>>;
-export default TextField;
+import * as React from 'react';
+import { Size, States, Testable } from '../types';
+import { TextFieldNote } from './types';
+export type TextFieldProps = Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange' | 'value' | 'disabled' | 'id' | 'type' | 'readOnly' | 'autoComplete' | 'pattern' | 'maxLength'> & {
+    id?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    onChange?: (text: string) => void;
+    value?: string;
+    validationMessage?: string;
+    type?: string;
+    state?: States.Invalid | States.Valid;
+    autoComplete?: string;
+    placeholder?: string;
+    required?: boolean;
+    pattern?: string;
+    maxLength?: number;
+    withoutBorder?: boolean;
+    overflowTooltipPosition?: 'top' | 'bottom';
+    size?: Size.Small | Size.Medium;
+    margin?: string;
+    note?: TextFieldNote;
+};
+declare const TextField: React.ForwardRefExoticComponent<Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, "pattern" | "type" | "id" | "onChange" | "size" | "disabled" | "value" | "autoComplete" | "maxLength" | "readOnly"> & {
+    id?: string | undefined;
+    disabled?: boolean | undefined;
+    readOnly?: boolean | undefined;
+    onChange?: ((text: string) => void) | undefined;
+    value?: string | undefined;
+    validationMessage?: string | undefined;
+    type?: string | undefined;
+    state?: States.Valid | States.Invalid | undefined;
+    autoComplete?: string | undefined;
+    placeholder?: string | undefined;
+    required?: boolean | undefined;
+    pattern?: string | undefined;
+    maxLength?: number | undefined;
+    withoutBorder?: boolean | undefined;
+    overflowTooltipPosition?: "top" | "bottom" | undefined;
+    size?: Size.Small | Size.Medium | undefined;
+    margin?: string | undefined;
+    note?: TextFieldNote | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export default TextField;

package/dist/InputFields/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","names":["React","SystemIcons","COLORS","States","InputFieldStyling","InputWrapper","NoteMessage","ValidationMessage","useFocusVisibleRef","TooltipOverflow","TextField","forwardRef","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","overflowTooltipPosition","note","className","dataTestId","rest","elementRef","useImperativeHandle","current","cls","Invalid","e","preventDefault","undefined","target","Valid","correct_400","critical_400","icon","message"],"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';\n\nexport type TextFieldProps =\n  Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange' | 'value' | 'disabled' | 'id'  | 'type' | 'readOnly' | 'autoComplete' | 'pattern' | 'maxLength'>\n  & {\n  id?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  onChange?: (text: string) => void;\n  value?: string;\n  validationMessage?: string;\n  type?: string;\n  state?: States.Invalid | States.Valid;\n  autoComplete?: string;\n  placeholder?: string;\n  required?: boolean;\n  pattern?: string;\n  maxLength?: number;\n  withoutBorder?: boolean;\n  overflowTooltipPosition?: 'top' | 'bottom';\n  size?: Size.Small | Size.Medium;\n  margin?: string;\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\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.correct_400}/> :\n              <SystemIcons.TechnicalWarning color={COLORS.critical_400}/>}\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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"}
+{"version":3,"file":"TextField.js","names":["React","SystemIcons","COLORS","States","InputFieldStyling","InputWrapper","NoteMessage","ValidationMessage","useFocusVisibleRef","TooltipOverflow","TextField","forwardRef","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","overflowTooltipPosition","note","className","dataTestId","rest","elementRef","useImperativeHandle","current","cls","Invalid","e","preventDefault","undefined","target","Valid","correct_400","critical_400","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\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  id?: string;\r\n  disabled?: boolean;\r\n  readOnly?: boolean;\r\n  onChange?: (text: string) => void;\r\n  value?: string;\r\n  validationMessage?: string;\r\n  type?: string;\r\n  state?: States.Invalid | States.Valid;\r\n  autoComplete?: string;\r\n  placeholder?: string;\r\n  required?: boolean;\r\n  pattern?: string;\r\n  maxLength?: number;\r\n  withoutBorder?: boolean;\r\n  overflowTooltipPosition?: 'top' | 'bottom';\r\n  size?: Size.Small | Size.Medium;\r\n  margin?: string;\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\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.correct_400}/> :\r\n              <SystemIcons.TechnicalWarning color={COLORS.critical_400}/>}\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":"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"}

package/dist/InputFields/Textarea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.cjs","names":["TextareaWrapper","styled","div","props","margin","TextArea","textarea","COLORS","white","neutral_400","autoHeight","ComponentMStyling","ComponentTextStyle","Regular","black","ComponentSStyling","Italic","neutral_500","primary_800","focusStyles","critical_500","correct_500","primary_700","readOnlyState","neutral_100","neutral_300","Textarea","React","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","dataTestId","rest","elementRef","useFocusVisibleRef","useImperativeHandle","current","cls","States","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n\n/**\n * Import custom styles.\n */\nimport {COLORS, ComponentSStyling, focusStyles} from '../styles';\nimport {NoteMessage, readOnlyState, ValidationMessage} from './styling';\nimport { States } from '../types';\n\n/**\n * Import custom components.\n */\nimport { SystemIcons } from '../icons';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles';\nimport { TextareaProps, TextFieldNote } from './types';\nimport {useFocusVisibleRef} from \"../common\";\n\n// Add component-specific styles.\nconst TextareaWrapper = styled.div<{ margin?: string }>`\n  width: 100%;\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n`;\nconst TextArea = styled.textarea<{ autoHeight?: boolean }>`\n  display: block;\n  background: ${COLORS.white};\n  border-radius: 4px;\n  outline: none;\n  margin-bottom: 4px;\n  padding: 16px;\n  border: none;\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\n\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\n\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n  &.small {\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n    width: 304px;\n\n    &::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.medium {\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n    &::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n    width: 344px;\n  }\n\n  &:focus:not(.focus-visible) {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  &.focus-visible {\n    ${focusStyles}\n  }\n\n  &.invalid {\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\n  }\n\n  &.valid {\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\n  }\n\n  &:hover {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\n  }\n\n  &.active {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  &:read-only:not(:disabled) {\n    ${readOnlyState}\n  }\n\n  &:disabled {\n    cursor: not-allowed;\n    border: 1px solid ${COLORS.neutral_100};\n    box-shadow: none !important;\n    color: ${COLORS.neutral_300} !important;\n\n    &::placeholder {\n      color: ${COLORS.neutral_300};\n    }\n  }\n\n  &::placeholder {\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n  }\n`;\n\nconst Textarea = React.forwardRef<any, TextareaProps>(({\n  id,\n  placeholder,\n  state,\n  value,\n  size,\n  disabled,\n  validationMessage,\n  onChange,\n  margin,\n  autoHeight,\n  note,\n  required,\n  className,\n  dataTestId,\n  ...rest\n}: TextareaProps, ref) => {\n\n  const elementRef = useFocusVisibleRef();\n\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\n\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        data-testid={dataTestId}\n        ref={elementRef}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={cls}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n        {...rest}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <SystemIcons.CheckMark color={COLORS.correct_400} /> : <SystemIcons.TechnicalWarning color={COLORS.critical_400} />}\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    </TextareaWrapper>\n  );\n});\n\nexport default Textarea;\n"],"mappings":"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"}
+{"version":3,"file":"Textarea.cjs","names":["TextareaWrapper","styled","div","props","margin","TextArea","textarea","COLORS","white","neutral_400","autoHeight","ComponentMStyling","ComponentTextStyle","Regular","black","ComponentSStyling","Italic","neutral_500","primary_800","focusStyles","critical_500","correct_500","primary_700","readOnlyState","neutral_100","neutral_300","Textarea","React","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","dataTestId","rest","elementRef","useFocusVisibleRef","useImperativeHandle","current","cls","States","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport {COLORS, ComponentSStyling, focusStyles} from '../styles';\r\nimport {NoteMessage, readOnlyState, ValidationMessage} from './styling';\r\nimport { States } from '../types';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport { SystemIcons } from '../icons';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\nimport { ComponentMStyling, ComponentTextStyle } from '../styles';\r\nimport { TextareaProps, TextFieldNote } from './types';\r\nimport {useFocusVisibleRef} from \"../common\";\r\n\r\n// Add component-specific styles.\r\nconst TextareaWrapper = styled.div<{ margin?: string }>`\r\n  width: 100%;\r\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\r\n`;\r\nconst TextArea = styled.textarea<{ autoHeight?: boolean }>`\r\n  display: block;\r\n  background: ${COLORS.white};\r\n  border-radius: 4px;\r\n  outline: none;\r\n  margin-bottom: 4px;\r\n  padding: 16px;\r\n  border: none;\r\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\r\n\r\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\r\n\r\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    width: 304px;\r\n\r\n    &::placeholder {\r\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    &::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n    width: 344px;\r\n  }\r\n\r\n  &:focus:not(.focus-visible) {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  &.focus-visible {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &.invalid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\r\n  }\r\n\r\n  &.valid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\r\n  }\r\n\r\n  &:hover {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\r\n  }\r\n\r\n  &.active {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  &:read-only:not(:disabled) {\r\n    ${readOnlyState}\r\n  }\r\n\r\n  &:disabled {\r\n    cursor: not-allowed;\r\n    border: 1px solid ${COLORS.neutral_100};\r\n    box-shadow: none !important;\r\n    color: ${COLORS.neutral_300} !important;\r\n\r\n    &::placeholder {\r\n      color: ${COLORS.neutral_300};\r\n    }\r\n  }\r\n\r\n  &::placeholder {\r\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n  }\r\n`;\r\n\r\nconst Textarea = React.forwardRef<any, TextareaProps>(({\r\n  id,\r\n  placeholder,\r\n  state,\r\n  value,\r\n  size,\r\n  disabled,\r\n  validationMessage,\r\n  onChange,\r\n  margin,\r\n  autoHeight,\r\n  note,\r\n  required,\r\n  className,\r\n  dataTestId,\r\n  ...rest\r\n}: TextareaProps, ref) => {\r\n\r\n  const elementRef = useFocusVisibleRef();\r\n\r\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\r\n\r\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\r\n  return (\r\n    <TextareaWrapper>\r\n      <TextArea\r\n        id={id}\r\n        data-testid={dataTestId}\r\n        ref={elementRef}\r\n        value={value}\r\n        placeholder={disabled ? undefined : placeholder}\r\n        autoHeight={autoHeight}\r\n        className={cls}\r\n        disabled={disabled}\r\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\r\n        required={required}\r\n        {...rest}\r\n      />\r\n      {validationMessage && (\r\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n          {state === States.Valid ? <SystemIcons.CheckMark color={COLORS.correct_400} /> : <SystemIcons.TechnicalWarning color={COLORS.critical_400} />}\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    </TextareaWrapper>\r\n  );\r\n});\r\n\r\nexport default Textarea;\r\n"],"mappings":"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"}

package/dist/InputFields/Textarea.d.ts

@@ -1,17 +1,17 @@
-/**
- * Import React libraries.
- */
-import * as React from 'react';
-import { States } from '../types';
-import { TextFieldNote } from './types';
-declare const Textarea: React.ForwardRefExoticComponent<import("../types").Testable & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange"> & {
-    id: string;
-    state?: States.Valid | States.Invalid | undefined;
-    onChange?: ((text: string) => void) | undefined;
-    validationMessage?: string | undefined;
-    size: import("../types").Size.Small | import("../types").Size.Medium;
-    autoHeight?: boolean | undefined;
-    margin?: string | undefined;
-    note?: TextFieldNote | undefined;
-} & React.RefAttributes<any>>;
-export default Textarea;
+/**
+ * Import React libraries.
+ */
+import * as React from 'react';
+import { States } from '../types';
+import { TextFieldNote } from './types';
+declare const Textarea: React.ForwardRefExoticComponent<import("../types").Testable & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange"> & {
+    id: string;
+    state?: States.Valid | States.Invalid | undefined;
+    onChange?: ((text: string) => void) | undefined;
+    validationMessage?: string | undefined;
+    size: import("../types").Size.Small | import("../types").Size.Medium;
+    autoHeight?: boolean | undefined;
+    margin?: string | undefined;
+    note?: TextFieldNote | undefined;
+} & React.RefAttributes<any>>;
+export default Textarea;

package/dist/InputFields/Textarea.js

@@ -5,25 +5,25 @@ var _excluded = ["id", "placeholder", "state", "value", "size", "disabled", "val
 var _templateObject, _templateObject2;
 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) { _defineProperty(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; }
-/**
- * Import React libraries.
+/**
+ * Import React libraries.
  */
 import * as React from 'react';
 
-/**
- * Import custom styles.
+/**
+ * Import custom styles.
  */
 import { COLORS, ComponentSStyling, focusStyles } from '../styles';
 import { NoteMessage, readOnlyState, ValidationMessage } from './styling';
 import { States } from '../types';
 
-/**
- * Import custom components.
+/**
+ * Import custom components.
  */
 import { SystemIcons } from '../icons';
 
-/**
- * Import third-party libraries.
+/**
+ * Import third-party libraries.
  */
 import styled from 'styled-components';
 import { ComponentMStyling, ComponentTextStyle } from '../styles';

package/dist/InputFields/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","names":["React","COLORS","ComponentSStyling","focusStyles","NoteMessage","readOnlyState","ValidationMessage","States","SystemIcons","styled","ComponentMStyling","ComponentTextStyle","useFocusVisibleRef","TextareaWrapper","div","props","margin","TextArea","textarea","white","neutral_400","autoHeight","Regular","black","Italic","neutral_500","primary_800","critical_500","correct_500","primary_700","neutral_100","neutral_300","Textarea","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","dataTestId","rest","elementRef","useImperativeHandle","current","cls","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n\n/**\n * Import custom styles.\n */\nimport {COLORS, ComponentSStyling, focusStyles} from '../styles';\nimport {NoteMessage, readOnlyState, ValidationMessage} from './styling';\nimport { States } from '../types';\n\n/**\n * Import custom components.\n */\nimport { SystemIcons } from '../icons';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles';\nimport { TextareaProps, TextFieldNote } from './types';\nimport {useFocusVisibleRef} from \"../common\";\n\n// Add component-specific styles.\nconst TextareaWrapper = styled.div<{ margin?: string }>`\n  width: 100%;\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n`;\nconst TextArea = styled.textarea<{ autoHeight?: boolean }>`\n  display: block;\n  background: ${COLORS.white};\n  border-radius: 4px;\n  outline: none;\n  margin-bottom: 4px;\n  padding: 16px;\n  border: none;\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\n\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\n\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n  &.small {\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n    width: 304px;\n\n    &::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.medium {\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n    &::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n    width: 344px;\n  }\n\n  &:focus:not(.focus-visible) {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  &.focus-visible {\n    ${focusStyles}\n  }\n\n  &.invalid {\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\n  }\n\n  &.valid {\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\n  }\n\n  &:hover {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\n  }\n\n  &.active {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  &:read-only:not(:disabled) {\n    ${readOnlyState}\n  }\n\n  &:disabled {\n    cursor: not-allowed;\n    border: 1px solid ${COLORS.neutral_100};\n    box-shadow: none !important;\n    color: ${COLORS.neutral_300} !important;\n\n    &::placeholder {\n      color: ${COLORS.neutral_300};\n    }\n  }\n\n  &::placeholder {\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n  }\n`;\n\nconst Textarea = React.forwardRef<any, TextareaProps>(({\n  id,\n  placeholder,\n  state,\n  value,\n  size,\n  disabled,\n  validationMessage,\n  onChange,\n  margin,\n  autoHeight,\n  note,\n  required,\n  className,\n  dataTestId,\n  ...rest\n}: TextareaProps, ref) => {\n\n  const elementRef = useFocusVisibleRef();\n\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\n\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        data-testid={dataTestId}\n        ref={elementRef}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={cls}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n        {...rest}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <SystemIcons.CheckMark color={COLORS.correct_400} /> : <SystemIcons.TechnicalWarning color={COLORS.critical_400} />}\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    </TextareaWrapper>\n  );\n});\n\nexport default Textarea;\n"],"mappings":"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"}
+{"version":3,"file":"Textarea.js","names":["React","COLORS","ComponentSStyling","focusStyles","NoteMessage","readOnlyState","ValidationMessage","States","SystemIcons","styled","ComponentMStyling","ComponentTextStyle","useFocusVisibleRef","TextareaWrapper","div","props","margin","TextArea","textarea","white","neutral_400","autoHeight","Regular","black","Italic","neutral_500","primary_800","critical_500","correct_500","primary_700","neutral_100","neutral_300","Textarea","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","dataTestId","rest","elementRef","useImperativeHandle","current","cls","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport {COLORS, ComponentSStyling, focusStyles} from '../styles';\r\nimport {NoteMessage, readOnlyState, ValidationMessage} from './styling';\r\nimport { States } from '../types';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport { SystemIcons } from '../icons';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\nimport { ComponentMStyling, ComponentTextStyle } from '../styles';\r\nimport { TextareaProps, TextFieldNote } from './types';\r\nimport {useFocusVisibleRef} from \"../common\";\r\n\r\n// Add component-specific styles.\r\nconst TextareaWrapper = styled.div<{ margin?: string }>`\r\n  width: 100%;\r\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\r\n`;\r\nconst TextArea = styled.textarea<{ autoHeight?: boolean }>`\r\n  display: block;\r\n  background: ${COLORS.white};\r\n  border-radius: 4px;\r\n  outline: none;\r\n  margin-bottom: 4px;\r\n  padding: 16px;\r\n  border: none;\r\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\r\n\r\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\r\n\r\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    width: 304px;\r\n\r\n    &::placeholder {\r\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    &::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n    width: 344px;\r\n  }\r\n\r\n  &:focus:not(.focus-visible) {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  &.focus-visible {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &.invalid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\r\n  }\r\n\r\n  &.valid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\r\n  }\r\n\r\n  &:hover {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\r\n  }\r\n\r\n  &.active {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  &:read-only:not(:disabled) {\r\n    ${readOnlyState}\r\n  }\r\n\r\n  &:disabled {\r\n    cursor: not-allowed;\r\n    border: 1px solid ${COLORS.neutral_100};\r\n    box-shadow: none !important;\r\n    color: ${COLORS.neutral_300} !important;\r\n\r\n    &::placeholder {\r\n      color: ${COLORS.neutral_300};\r\n    }\r\n  }\r\n\r\n  &::placeholder {\r\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n  }\r\n`;\r\n\r\nconst Textarea = React.forwardRef<any, TextareaProps>(({\r\n  id,\r\n  placeholder,\r\n  state,\r\n  value,\r\n  size,\r\n  disabled,\r\n  validationMessage,\r\n  onChange,\r\n  margin,\r\n  autoHeight,\r\n  note,\r\n  required,\r\n  className,\r\n  dataTestId,\r\n  ...rest\r\n}: TextareaProps, ref) => {\r\n\r\n  const elementRef = useFocusVisibleRef();\r\n\r\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\r\n\r\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\r\n  return (\r\n    <TextareaWrapper>\r\n      <TextArea\r\n        id={id}\r\n        data-testid={dataTestId}\r\n        ref={elementRef}\r\n        value={value}\r\n        placeholder={disabled ? undefined : placeholder}\r\n        autoHeight={autoHeight}\r\n        className={cls}\r\n        disabled={disabled}\r\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\r\n        required={required}\r\n        {...rest}\r\n      />\r\n      {validationMessage && (\r\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n          {state === States.Valid ? <SystemIcons.CheckMark color={COLORS.correct_400} /> : <SystemIcons.TechnicalWarning color={COLORS.critical_400} />}\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    </TextareaWrapper>\r\n  );\r\n});\r\n\r\nexport default Textarea;\r\n"],"mappings":"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"}