@laerdal/life-react-components 1.9.8-dev.21 → 1.9.8-dev.24

package/dist/InputFields/SearchBar.d.ts

@@ -1,18 +1,18 @@
-import React from 'react';
-import { Size } from '../types';
-declare type SeachBarProps = {
-    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;
-};
-declare const SearchBar: React.FunctionComponent<SeachBarProps>;
-export default SearchBar;
+import React from 'react';
+import { Size } from '../types';
+declare type SeachBarProps = {
+    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;
+};
+declare const SearchBar: React.FunctionComponent<SeachBarProps>;
+export default SearchBar;

package/dist/InputFields/SearchBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["React","COLORS","Search","SearchIcon","Clear","ClearIcon","TechnicalWarning","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","ClearIconWrapper","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","containerRef","useRef","isPressingEnter","e","key","preventDefault","stopPropagation","term","concat","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport {COLORS} from '../styles/index';\r\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\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\n\r\ntype SeachBarProps = {\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};\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<SeachBarProps> = ({\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 = '4px 0',\r\n                                                           }) => {\r\n  const containerRef = React.useRef<any>(null);\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  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={enterSearch}\r\n            focusParentRefs={[containerRef]}\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              <SearchIcon 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              <ClearIcon size=\"24px\"/>\r\n            </IconButton>\r\n          </ClearIconWrapper>\r\n        </SearchField>\r\n      </InputWrapper>\r\n      {validationMessage && (\r\n        <ErrorMessage className={size || ''}>\r\n          <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"],"file":"SearchBar.js"}
+{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["React","COLORS","Search","SearchIcon","Clear","ClearIcon","TechnicalWarning","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","ClearIconWrapper","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","containerRef","useRef","isPressingEnter","e","key","preventDefault","stopPropagation","term","concat","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\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';\n\ntype SeachBarProps = {\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};\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<SeachBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin = '4px 0',\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\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  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={enterSearch}\n            focusParentRefs={[containerRef]}\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              <SearchIcon 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              <ClearIcon size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.js"}

package/dist/InputFields/TextField.cjs

@@ -49,7 +49,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       margin = _ref$margin === void 0 ? '4px 0' : _ref$margin,
       note = _ref.note;
   var elementRef = (0, _common.useFocusVisibleRef)();
-  (0, React.useImperativeHandle)(ref, function () {
+  React.useImperativeHandle(ref, function () {
     return elementRef.current;
   }, [elementRef]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {

package/dist/InputFields/TextField.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/TextField.tsx"],"names":["TextField","React","forwardRef","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","note","elementRef","current","e","preventDefault","States","Invalid","undefined","target","Valid","COLORS","correct_400","critical_400","icon","message"],"mappings":"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","sourcesContent":["import * as React from 'react';\r\nimport {CheckMark, TechnicalWarning} from '../icons/systemicons/SystemIcons';\r\nimport {COLORS} from '../styles';\r\nimport {Size, States} from '../types';\r\nimport {ErrorMessage, InputFieldStyling, InputWrapper, NoteMessage, ValidationMessage} from './styling';\r\nimport {useFocusVisibleRef} from '../common';\r\nimport {TextFieldNote} from './types';\r\nimport {useImperativeHandle} from 'react';\r\n\r\ntype TextFieldProps = {\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  size?: Size.Small | Size.Medium;\r\n  margin?: string;\r\n  note?: TextFieldNote;\r\n};\r\n\r\nconst TextField = React.forwardRef(({\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 = '4px 0',\r\n                                      note,\r\n                                    }: TextFieldProps, ref) => {\r\n  const elementRef = useFocusVisibleRef();\r\n\r\n  useImperativeHandle(ref, () => elementRef.current, [elementRef]);\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          ref={elementRef}\r\n          type={type || 'text'}\r\n          value={value}\r\n          className={`${state || (validationMessage ? States.Invalid : '')} ${size || ''}`}\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        />\r\n        {validationMessage && (\r\n          <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n            {state === States.Valid ? <CheckMark color={COLORS.correct_400}/> :\r\n              <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"],"file":"TextField.cjs"}
+{"version":3,"sources":["../../src/InputFields/TextField.tsx"],"names":["TextField","React","forwardRef","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","note","elementRef","useImperativeHandle","current","e","preventDefault","States","Invalid","undefined","target","Valid","COLORS","correct_400","critical_400","icon","message"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {CheckMark, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {COLORS} from '../styles';\nimport {Size, States} from '../types';\nimport {ErrorMessage, InputFieldStyling, InputWrapper, NoteMessage, ValidationMessage} from './styling';\nimport {useFocusVisibleRef} from '../common';\nimport {TextFieldNote} from './types';\n\ntype TextFieldProps = {\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  size?: Size.Small | Size.Medium;\n  margin?: string;\n  note?: TextFieldNote;\n};\n\nconst TextField = React.forwardRef(({\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 = '4px 0',\n                                      note,\n                                    }: TextFieldProps, ref) => {\n  const elementRef = useFocusVisibleRef();\n\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\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          ref={elementRef}\n          type={type || 'text'}\n          value={value}\n          className={`${state || (validationMessage ? States.Invalid : '')} ${size || ''}`}\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        />\n        {validationMessage && (\n          <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n            {state === States.Valid ? <CheckMark color={COLORS.correct_400}/> :\n              <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"],"file":"TextField.cjs"}

package/dist/InputFields/TextField.d.ts

@@ -1,24 +1,24 @@
-import * as React from 'react';
-import { Size, States } from '../types';
-import { TextFieldNote } from './types';
-declare type TextFieldProps = {
-    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;
-    size?: Size.Small | Size.Medium;
-    margin?: string;
-    note?: TextFieldNote;
-};
-declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<unknown>>;
-export default TextField;
+import * as React from 'react';
+import { Size, States } from '../types';
+import { TextFieldNote } from './types';
+declare type TextFieldProps = {
+    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;
+    size?: Size.Small | Size.Medium;
+    margin?: string;
+    note?: TextFieldNote;
+};
+declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<unknown>>;
+export default TextField;

package/dist/InputFields/TextField.js

@@ -5,7 +5,6 @@ import { COLORS } from '../styles';
 import { States } from '../types';
 import { InputFieldStyling, InputWrapper, NoteMessage, ValidationMessage } from './styling';
 import { useFocusVisibleRef } from '../common';
-import React, { useImperativeHandle } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -29,7 +28,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       margin = _ref$margin === void 0 ? '4px 0' : _ref$margin,
       note = _ref.note;
   var elementRef = useFocusVisibleRef();
-  useImperativeHandle(ref, function () {
+  React.useImperativeHandle(ref, function () {
     return elementRef.current;
   }, [elementRef]);
   return /*#__PURE__*/_jsx(_Fragment, {

package/dist/InputFields/TextField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/TextField.tsx"],"names":["React","CheckMark","TechnicalWarning","COLORS","States","InputFieldStyling","InputWrapper","NoteMessage","ValidationMessage","useFocusVisibleRef","useImperativeHandle","TextField","forwardRef","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","note","elementRef","current","e","preventDefault","Invalid","undefined","target","Valid","correct_400","critical_400","icon","message"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAAQC,SAAR,EAAmBC,gBAAnB,QAA0C,kCAA1C;AACA,SAAQC,MAAR,QAAqB,WAArB;AACA,SAAcC,MAAd,QAA2B,UAA3B;AACA,SAAsBC,iBAAtB,EAAyCC,YAAzC,EAAuDC,WAAvD,EAAoEC,iBAApE,QAA4F,WAA5F;AACA,SAAQC,kBAAR,QAAiC,WAAjC;AAEA,gBAAQC,mBAAR,QAAkC,OAAlC;;;;AAsBA,IAAMC,SAAS,gBAAGX,KAAK,CAACY,UAAN,CAAiB,gBAkBoBC,GAlBpB,EAkB4B;AAAA,MAjBzBC,EAiByB,QAjBzBA,EAiByB;AAAA,MAhBzBC,QAgByB,QAhBzBA,QAgByB;AAAA,MAfzBC,QAeyB,QAfzBA,QAeyB;AAAA,MAdzBC,SAcyB,QAdzBA,QAcyB;AAAA,MAbzBC,KAayB,QAbzBA,KAayB;AAAA,MAZzBC,iBAYyB,QAZzBA,iBAYyB;AAAA,MAXzBC,IAWyB,QAXzBA,IAWyB;AAAA,MAVzBC,YAUyB,QAVzBA,YAUyB;AAAA,MATzBC,WASyB,QATzBA,WASyB;AAAA,MARzBC,QAQyB,QARzBA,QAQyB;AAAA,MAPzBC,OAOyB,QAPzBA,OAOyB;AAAA,MANzBC,SAMyB,QANzBA,SAMyB;AAAA,MALzBC,aAKyB,QALzBA,aAKyB;AAAA,MAJzBC,KAIyB,QAJzBA,KAIyB;AAAA,MAHzBC,IAGyB,QAHzBA,IAGyB;AAAA,yBAFzBC,MAEyB;AAAA,MAFzBA,MAEyB,4BAFhB,OAEgB;AAAA,MADzBC,IACyB,QADzBA,IACyB;AAC7D,MAAMC,UAAU,GAAGtB,kBAAkB,EAArC;AAEAC,EAAAA,mBAAmB,CAACG,GAAD,EAAM;AAAA,WAAMkB,UAAU,CAACC,OAAjB;AAAA,GAAN,EAAgC,CAACD,UAAD,CAAhC,CAAnB;AAEA,sBACE;AAAA,2BACE,MAAC,YAAD;AACE,MAAA,QAAQ,EAAEf,QADZ;AAEE,MAAA,QAAQ,EAAED,QAFZ;AAGE,MAAA,MAAM,EAAEc,MAHV;AAIE,MAAA,OAAO,EAAE,iBAACI,CAAD,EAAY;AACnB,YAAIlB,QAAQ,IAAIC,QAAhB,EAA0B;AACxBiB,UAAAA,CAAC,CAACC,cAAF;AACD;AACF,OARH;AAAA,8BASE,KAAC,iBAAD;AACE,QAAA,EAAE,EAAEpB,EADN;AAEE,QAAA,GAAG,EAAEiB,UAFP;AAGE,QAAA,IAAI,EAAEX,IAAI,IAAI,MAHhB;AAIE,QAAA,KAAK,EAAEF,KAJT;AAKE,QAAA,SAAS,YAAKS,KAAK,KAAKR,iBAAiB,GAAGf,MAAM,CAAC+B,OAAV,GAAoB,EAA1C,CAAV,cAA2DP,IAAI,IAAI,EAAnE,CALX;AAME,QAAA,QAAQ,EAAEZ,QAAQ,IAAID,QAAZ,GAAuB,CAAC,CAAxB,GAA4B,CANxC;AAOE,QAAA,YAAY,EAAEM,YAPhB;AAQE,QAAA,WAAW,EAAEN,QAAQ,GAAGqB,SAAH,GAAed,WARtC;AASE,QAAA,QAAQ,EAAEP,QATZ;AAUE,QAAA,QAAQ,EAAEC,QAVZ;AAWE,QAAA,QAAQ,EAAE,kBAACiB,CAAD;AAAA;;AAAA,iBAAYhB,SAAQ,IAAIA,SAAQ,CAAC,CAAAgB,CAAC,SAAD,IAAAA,CAAC,WAAD,yBAAAA,CAAC,CAAEI,MAAH,wDAAWnB,KAAX,KAAoB,EAArB,CAAhC;AAAA,SAXZ;AAYE,QAAA,kBAAkB,EAAE,CAAC,CAACC,iBAAF,IAAuBQ,KAAK,KAAKvB,MAAM,CAACkC,KAZ9D;AAaE,QAAA,QAAQ,EAAEf,QAbZ;AAcE,QAAA,OAAO,EAAEC,OAdX;AAeE,QAAA,SAAS,EAAEC,SAfb;AAgBE,QAAA,aAAa,EAAEC;AAhBjB,QATF,EA2BGP,iBAAiB,iBAChB,MAAC,iBAAD;AAAmB,QAAA,SAAS,EAAES,IAAI,IAAI,EAAtC;AAA0C,QAAA,IAAI,EAAED,KAAF,aAAEA,KAAF,cAAEA,KAAF,GAAWvB,MAAM,CAAC+B,OAAhE;AAAA,mBACGR,KAAK,KAAKvB,MAAM,CAACkC,KAAjB,gBAAyB,KAAC,SAAD;AAAW,UAAA,KAAK,EAAEnC,MAAM,CAACoC;AAAzB,UAAzB,gBACC,KAAC,gBAAD;AAAkB,UAAA,KAAK,EAAEpC,MAAM,CAACqC;AAAhC,UAFJ,eAGE;AAAA,oBAAOrB;AAAP,UAHF;AAAA,QA5BJ,EAkCGW,IAAI,IAAI,CAACf,QAAT,iBACC,MAAC,WAAD;AAAa,QAAA,SAAS,EAAEa,IAAxB;AAAA,mBACGE,IAAI,CAACW,IADR,eAEE;AAAA,oBAAOX,IAAI,CAACY;AAAZ,UAFF;AAAA,QAnCJ;AAAA;AADF,IADF;AA6CD,CApEiB,CAAlB;;AAnBE5B,EAAAA,E;AACAC,EAAAA,Q;AACAC,EAAAA,Q;AACAC,EAAAA,Q;AACAC,EAAAA,K;AACAC,EAAAA,iB;AACAC,EAAAA,I;AAEAC,EAAAA,Y;AACAC,EAAAA,W;AACAC,EAAAA,Q;AACAC,EAAAA,O;AACAC,EAAAA,S;AACAC,EAAAA,a;AAEAG,EAAAA,M;;AA0EF,eAAelB,SAAf","sourcesContent":["import * as React from 'react';\r\nimport {CheckMark, TechnicalWarning} from '../icons/systemicons/SystemIcons';\r\nimport {COLORS} from '../styles';\r\nimport {Size, States} from '../types';\r\nimport {ErrorMessage, InputFieldStyling, InputWrapper, NoteMessage, ValidationMessage} from './styling';\r\nimport {useFocusVisibleRef} from '../common';\r\nimport {TextFieldNote} from './types';\r\nimport {useImperativeHandle} from 'react';\r\n\r\ntype TextFieldProps = {\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  size?: Size.Small | Size.Medium;\r\n  margin?: string;\r\n  note?: TextFieldNote;\r\n};\r\n\r\nconst TextField = React.forwardRef(({\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 = '4px 0',\r\n                                      note,\r\n                                    }: TextFieldProps, ref) => {\r\n  const elementRef = useFocusVisibleRef();\r\n\r\n  useImperativeHandle(ref, () => elementRef.current, [elementRef]);\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          ref={elementRef}\r\n          type={type || 'text'}\r\n          value={value}\r\n          className={`${state || (validationMessage ? States.Invalid : '')} ${size || ''}`}\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        />\r\n        {validationMessage && (\r\n          <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n            {state === States.Valid ? <CheckMark color={COLORS.correct_400}/> :\r\n              <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"],"file":"TextField.js"}
+{"version":3,"sources":["../../src/InputFields/TextField.tsx"],"names":["React","CheckMark","TechnicalWarning","COLORS","States","InputFieldStyling","InputWrapper","NoteMessage","ValidationMessage","useFocusVisibleRef","TextField","forwardRef","ref","id","disabled","readOnly","onChange","value","validationMessage","type","autoComplete","placeholder","required","pattern","maxLength","withoutBorder","state","size","margin","note","elementRef","useImperativeHandle","current","e","preventDefault","Invalid","undefined","target","Valid","correct_400","critical_400","icon","message"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {CheckMark, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {COLORS} from '../styles';\nimport {Size, States} from '../types';\nimport {ErrorMessage, InputFieldStyling, InputWrapper, NoteMessage, ValidationMessage} from './styling';\nimport {useFocusVisibleRef} from '../common';\nimport {TextFieldNote} from './types';\n\ntype TextFieldProps = {\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  size?: Size.Small | Size.Medium;\n  margin?: string;\n  note?: TextFieldNote;\n};\n\nconst TextField = React.forwardRef(({\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 = '4px 0',\n                                      note,\n                                    }: TextFieldProps, ref) => {\n  const elementRef = useFocusVisibleRef();\n\n  React.useImperativeHandle(ref, () => elementRef.current, [elementRef]);\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          ref={elementRef}\n          type={type || 'text'}\n          value={value}\n          className={`${state || (validationMessage ? States.Invalid : '')} ${size || ''}`}\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        />\n        {validationMessage && (\n          <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n            {state === States.Valid ? <CheckMark color={COLORS.correct_400}/> :\n              <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"],"file":"TextField.js"}

package/dist/InputFields/Textarea.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/Textarea.tsx"],"names":["TextareaWrapper","styled","div","props","margin","TextArea","textarea","COLORS","neutral_400","white","autoHeight","ComponentTextStyle","Italic","black","neutral_500","primary_700","primary_800","critical_500","correct_500","neutral_100","neutral_300","Textarea","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","undefined","States","Invalid","e","target","Valid","correct_400","critical_400","icon","message"],"mappings":"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","sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport { COLORS, ComponentSStyling } from '../styles';\r\nimport { ErrorMessage, NoteMessage, ValidationMessage } from './styling';\r\nimport { Size, States } from '../types';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport { CheckMark, TechnicalWarning } from '../icons/systemicons/SystemIcons';\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\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  border: 1px solid ${COLORS.neutral_400};\r\n  background: ${COLORS.white};\r\n  border-radius: 4px;\r\n  outline: none;\r\n  margin: 4px 0px;\r\n  padding: 16px;\r\n\r\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\r\n\r\n  ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.black)}\r\n    width: 304px;\r\n    &::placeholder {\r\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\r\n    width: 344px;\r\n  }\r\n\r\n  &:hover {\r\n    border: 2px solid ${COLORS.primary_700};\r\n    margin: 3px -1px;\r\n  }\r\n\r\n  &:active,\r\n  &:focus {\r\n    border: 2px solid ${COLORS.primary_800};\r\n    margin: 3px -1px;\r\n  }\r\n\r\n  &.invalid,\r\n  &.invalid:hover,\r\n  &.invalid:focus,\r\n  &.invalid:active {\r\n    border: none;\r\n    margin: 4px 0px;\r\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_500};\r\n  }\r\n\r\n  &.valid {\r\n    border: none;\r\n    margin: 4px 0px;\r\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\r\n  }\r\n\r\n  &:disabled,\r\n  &:disabled:hover,\r\n  &:disabled:focus {\r\n    cursor: not-allowed;\r\n    border: 1px solid ${COLORS.neutral_100};\r\n    margin: 4px 0px;\r\n    box-shadow: none;\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.FunctionComponent<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}: TextareaProps) => {\r\n  return (\r\n    <TextareaWrapper>\r\n      <TextArea\r\n        id={id}\r\n        value={value}\r\n        placeholder={disabled ? undefined : placeholder}\r\n        autoHeight={autoHeight}\r\n        className={`${size} ${state || (validationMessage ? States.Invalid : '')}`}\r\n        disabled={disabled}\r\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\r\n        required={required}\r\n      />\r\n      {validationMessage && (\r\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n          {state === States.Valid ? <CheckMark color={COLORS.correct_400} /> : <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"],"file":"Textarea.cjs"}
+{"version":3,"sources":["../../src/InputFields/Textarea.tsx"],"names":["TextareaWrapper","styled","div","props","margin","TextArea","textarea","COLORS","neutral_400","white","autoHeight","ComponentTextStyle","Italic","black","neutral_500","primary_700","primary_800","critical_500","correct_500","neutral_100","neutral_300","Textarea","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","undefined","States","Invalid","e","target","Valid","correct_400","critical_400","icon","message"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport { COLORS, ComponentSStyling } from '../styles';\nimport { ErrorMessage, NoteMessage, ValidationMessage } from './styling';\nimport { Size, States } from '../types';\n\n/**\n * Import custom components.\n */\nimport { CheckMark, TechnicalWarning } from '../icons/systemicons/SystemIcons';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles';\nimport { TextareaProps, TextFieldNote } from './types';\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  border: 1px solid ${COLORS.neutral_400};\n  background: ${COLORS.white};\n  border-radius: 4px;\n  outline: none;\n  margin: 4px 0px;\n  padding: 16px;\n\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\n\n  ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\n\n  &.small {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.black)}\n    width: 304px;\n    &::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.medium {\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\n    width: 344px;\n  }\n\n  &:hover {\n    border: 2px solid ${COLORS.primary_700};\n    margin: 3px -1px;\n  }\n\n  &:active,\n  &:focus {\n    border: 2px solid ${COLORS.primary_800};\n    margin: 3px -1px;\n  }\n\n  &.invalid,\n  &.invalid:hover,\n  &.invalid:focus,\n  &.invalid:active {\n    border: none;\n    margin: 4px 0px;\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_500};\n  }\n\n  &.valid {\n    border: none;\n    margin: 4px 0px;\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\n  }\n\n  &:disabled,\n  &:disabled:hover,\n  &:disabled:focus {\n    cursor: not-allowed;\n    border: 1px solid ${COLORS.neutral_100};\n    margin: 4px 0px;\n    box-shadow: none;\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.FunctionComponent<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}: TextareaProps) => {\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={`${size} ${state || (validationMessage ? States.Invalid : '')}`}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <CheckMark color={COLORS.correct_400} /> : <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"],"file":"Textarea.cjs"}

package/dist/InputFields/Textarea.d.ts

@@ -1,7 +1,7 @@
-/**
- * Import React libraries.
- */
-import * as React from 'react';
-import { TextareaProps } from './types';
-declare const Textarea: React.FunctionComponent<TextareaProps>;
-export default Textarea;
+/**
+ * Import React libraries.
+ */
+import * as React from 'react';
+import { TextareaProps } from './types';
+declare const Textarea: React.FunctionComponent<TextareaProps>;
+export default Textarea;

package/dist/InputFields/Textarea.js

@@ -2,24 +2,24 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
 
 var _templateObject, _templateObject2;
 
-/**
- * Import React libraries.
+/**
+ * Import React libraries.
  */
 import * as React from 'react';
-/**
- * Import custom styles.
+/**
+ * Import custom styles.
  */
 
 import { COLORS, ComponentSStyling } from '../styles';
 import { NoteMessage, ValidationMessage } from './styling';
 import { States } from '../types';
-/**
- * Import custom components.
+/**
+ * Import custom components.
  */
 
 import { CheckMark, TechnicalWarning } from '../icons/systemicons/SystemIcons';
-/**
- * Import third-party libraries.
+/**
+ * Import third-party libraries.
  */
 
 import styled from 'styled-components';

package/dist/InputFields/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/Textarea.tsx"],"names":["React","COLORS","ComponentSStyling","NoteMessage","ValidationMessage","States","CheckMark","TechnicalWarning","styled","ComponentMStyling","ComponentTextStyle","TextareaWrapper","div","props","margin","TextArea","textarea","neutral_400","white","autoHeight","Italic","black","neutral_500","primary_700","primary_800","critical_500","correct_500","neutral_100","neutral_300","Textarea","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","undefined","Invalid","e","target","Valid","correct_400","critical_400","icon","message"],"mappings":"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","sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport { COLORS, ComponentSStyling } from '../styles';\r\nimport { ErrorMessage, NoteMessage, ValidationMessage } from './styling';\r\nimport { Size, States } from '../types';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport { CheckMark, TechnicalWarning } from '../icons/systemicons/SystemIcons';\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\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  border: 1px solid ${COLORS.neutral_400};\r\n  background: ${COLORS.white};\r\n  border-radius: 4px;\r\n  outline: none;\r\n  margin: 4px 0px;\r\n  padding: 16px;\r\n\r\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\r\n\r\n  ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.black)}\r\n    width: 304px;\r\n    &::placeholder {\r\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\r\n    width: 344px;\r\n  }\r\n\r\n  &:hover {\r\n    border: 2px solid ${COLORS.primary_700};\r\n    margin: 3px -1px;\r\n  }\r\n\r\n  &:active,\r\n  &:focus {\r\n    border: 2px solid ${COLORS.primary_800};\r\n    margin: 3px -1px;\r\n  }\r\n\r\n  &.invalid,\r\n  &.invalid:hover,\r\n  &.invalid:focus,\r\n  &.invalid:active {\r\n    border: none;\r\n    margin: 4px 0px;\r\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_500};\r\n  }\r\n\r\n  &.valid {\r\n    border: none;\r\n    margin: 4px 0px;\r\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\r\n  }\r\n\r\n  &:disabled,\r\n  &:disabled:hover,\r\n  &:disabled:focus {\r\n    cursor: not-allowed;\r\n    border: 1px solid ${COLORS.neutral_100};\r\n    margin: 4px 0px;\r\n    box-shadow: none;\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.FunctionComponent<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}: TextareaProps) => {\r\n  return (\r\n    <TextareaWrapper>\r\n      <TextArea\r\n        id={id}\r\n        value={value}\r\n        placeholder={disabled ? undefined : placeholder}\r\n        autoHeight={autoHeight}\r\n        className={`${size} ${state || (validationMessage ? States.Invalid : '')}`}\r\n        disabled={disabled}\r\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\r\n        required={required}\r\n      />\r\n      {validationMessage && (\r\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\r\n          {state === States.Valid ? <CheckMark color={COLORS.correct_400} /> : <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"],"file":"Textarea.js"}
+{"version":3,"sources":["../../src/InputFields/Textarea.tsx"],"names":["React","COLORS","ComponentSStyling","NoteMessage","ValidationMessage","States","CheckMark","TechnicalWarning","styled","ComponentMStyling","ComponentTextStyle","TextareaWrapper","div","props","margin","TextArea","textarea","neutral_400","white","autoHeight","Italic","black","neutral_500","primary_700","primary_800","critical_500","correct_500","neutral_100","neutral_300","Textarea","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","undefined","Invalid","e","target","Valid","correct_400","critical_400","icon","message"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport { COLORS, ComponentSStyling } from '../styles';\nimport { ErrorMessage, NoteMessage, ValidationMessage } from './styling';\nimport { Size, States } from '../types';\n\n/**\n * Import custom components.\n */\nimport { CheckMark, TechnicalWarning } from '../icons/systemicons/SystemIcons';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles';\nimport { TextareaProps, TextFieldNote } from './types';\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  border: 1px solid ${COLORS.neutral_400};\n  background: ${COLORS.white};\n  border-radius: 4px;\n  outline: none;\n  margin: 4px 0px;\n  padding: 16px;\n\n  resize: ${(props) => (props.autoHeight ? 'none' : '')};\n\n  ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\n\n  &.small {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.black)}\n    width: 304px;\n    &::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.medium {\n    ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.black)}\n    width: 344px;\n  }\n\n  &:hover {\n    border: 2px solid ${COLORS.primary_700};\n    margin: 3px -1px;\n  }\n\n  &:active,\n  &:focus {\n    border: 2px solid ${COLORS.primary_800};\n    margin: 3px -1px;\n  }\n\n  &.invalid,\n  &.invalid:hover,\n  &.invalid:focus,\n  &.invalid:active {\n    border: none;\n    margin: 4px 0px;\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_500};\n  }\n\n  &.valid {\n    border: none;\n    margin: 4px 0px;\n    box-shadow: inset 0 0 0 2px ${COLORS.correct_500};\n  }\n\n  &:disabled,\n  &:disabled:hover,\n  &:disabled:focus {\n    cursor: not-allowed;\n    border: 1px solid ${COLORS.neutral_100};\n    margin: 4px 0px;\n    box-shadow: none;\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.FunctionComponent<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}: TextareaProps) => {\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={`${size} ${state || (validationMessage ? States.Invalid : '')}`}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <CheckMark color={COLORS.correct_400} /> : <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"],"file":"Textarea.js"}

package/dist/InputFields/components/SearchBarInput.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/components/SearchBarInput.tsx"],"names":["Search","styled","input","attrs","type","ComponentTextStyle","Italic","COLORS","neutral_500","Regular","black","neutral_600","BREAKPOINTS","MEDIUM","SearchBarInput","React","forwardRef","props","ref","id","searchTerm","setSearchTerm","enterSearch","placeholder","disabled","onKeyDown","size","onBlur","elementRef","focusParentRefs","isPressingEnter","e","key","preventDefault","stopPropagation","target","value"],"mappings":"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","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { BREAKPOINTS, COLORS, ComponentTextStyle } from '../../styles/index';\r\nimport { Size } from '../../types';\r\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\r\nimport { useFocusVisibleRef } from '../../common';\r\n\r\nexport const Search = styled.input.attrs(() => ({ type: 'search' }))`\r\n  appearance: none;\r\n  width: calc(100% - 96px);\r\n\r\n  /* To prevent browser putting its own cross inside the search bar */\r\n\r\n  ::-ms-clear {\r\n    display: none;\r\n    width: 0;\r\n    height: 0;\r\n  }\r\n\r\n  ::-ms-reveal {\r\n    display: none;\r\n    width: 0;\r\n    height: 0;\r\n  }\r\n\r\n  ::-webkit-search-decoration,\r\n  ::-webkit-search-cancel-button,\r\n  ::-webkit-search-results-button,\r\n  ::-webkit-search-results-decoration {\r\n    display: none;\r\n  }\r\n\r\n  ::placeholder {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n  }\r\n\r\n  height: 32px;\r\n  border-width: 0;\r\n  margin-left: 48px;\r\n  outline: none;\r\n\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n  ::placeholder {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    margin-left: 44px;\r\n\r\n    ::placeholder {\r\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    margin-left: 48px;\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    \r\n    ::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &:disabled {\r\n    background: transparent;\r\n    border: none;\r\n  }\r\n`;\r\n\r\ntype SearchBarInputProps = {\r\n  id: string;\r\n  searchTerm?: string;\r\n  setSearchTerm: (term: string) => void;\r\n  enterSearch: (e: any) => void;\r\n  placeholder?: string;\r\n  disabled?: boolean;\r\n  onKeyDown?: (e: React.KeyboardEvent) => void;\r\n  size?: Size.Small | Size.Medium;\r\n  onBlur?: (e: any) => void;\r\n  focusParentRefs?: React.RefObject<any>[];\r\n};\r\n\r\nconst SearchBarInput = React.forwardRef<HTMLInputElement, SearchBarInputProps>((props: SearchBarInputProps, ref) => {\r\n  const { id, searchTerm, setSearchTerm, enterSearch, placeholder, disabled, onKeyDown, size, onBlur } = props;\r\n\r\n  const elementRef = useFocusVisibleRef(props.focusParentRefs || [], ref);\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  return (\r\n    <Search\r\n      placeholder={disabled ? '' : placeholder}\r\n      ref={elementRef}\r\n      id={id}\r\n      data-testid={id}\r\n      className={size ? size : ''}\r\n      tabIndex={0}\r\n      disabled={disabled}\r\n      onChange={(e: any) => setSearchTerm(e.target.value)}\r\n      value={searchTerm}\r\n      onBlur={(e) => onBlur && onBlur(e)}\r\n      onKeyDown={onKeyDown}\r\n      onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}\r\n    />\r\n  );\r\n});\r\n\r\nexport default SearchBarInput;\r\n"],"file":"SearchBarInput.cjs"}
+{"version":3,"sources":["../../../src/InputFields/components/SearchBarInput.tsx"],"names":["Search","styled","input","attrs","type","ComponentTextStyle","Italic","COLORS","neutral_500","Regular","black","neutral_600","BREAKPOINTS","MEDIUM","SearchBarInput","React","forwardRef","props","ref","id","searchTerm","setSearchTerm","enterSearch","placeholder","disabled","onKeyDown","size","onBlur","elementRef","focusParentRefs","isPressingEnter","e","key","preventDefault","stopPropagation","target","value"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS, ComponentTextStyle } from '../../styles/index';\nimport { Size } from '../../types';\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\nimport { useFocusVisibleRef } from '../../common';\n\nexport const Search = styled.input.attrs(() => ({ type: 'search' }))`\n  appearance: none;\n  width: calc(100% - 96px);\n\n  /* To prevent browser putting its own cross inside the search bar */\n\n  ::-ms-clear {\n    display: none;\n    width: 0;\n    height: 0;\n  }\n\n  ::-ms-reveal {\n    display: none;\n    width: 0;\n    height: 0;\n  }\n\n  ::-webkit-search-decoration,\n  ::-webkit-search-cancel-button,\n  ::-webkit-search-results-button,\n  ::-webkit-search-results-decoration {\n    display: none;\n  }\n\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n  }\n\n  height: 32px;\n  border-width: 0;\n  margin-left: 48px;\n  outline: none;\n\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    ::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n\n  &.small {\n    margin-left: 44px;\n\n    ::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n\n  &.medium {\n    margin-left: 48px;\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n    \n    ::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n\n  &:disabled {\n    background: transparent;\n    border: none;\n  }\n`;\n\ntype SearchBarInputProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  placeholder?: string;\n  disabled?: boolean;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  onBlur?: (e: any) => void;\n  focusParentRefs?: React.RefObject<any>[];\n};\n\nconst SearchBarInput = React.forwardRef<HTMLInputElement, SearchBarInputProps>((props: SearchBarInputProps, ref) => {\n  const { id, searchTerm, setSearchTerm, enterSearch, placeholder, disabled, onKeyDown, size, onBlur } = props;\n\n  const elementRef = useFocusVisibleRef(props.focusParentRefs || [], ref);\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  return (\n    <Search\n      placeholder={disabled ? '' : placeholder}\n      ref={elementRef}\n      id={id}\n      data-testid={id}\n      className={size ? size : ''}\n      tabIndex={0}\n      disabled={disabled}\n      onChange={(e: any) => setSearchTerm(e.target.value)}\n      value={searchTerm}\n      onBlur={(e) => onBlur && onBlur(e)}\n      onKeyDown={onKeyDown}\n      onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}\n    />\n  );\n});\n\nexport default SearchBarInput;\n"],"file":"SearchBarInput.cjs"}

package/dist/InputFields/components/SearchBarInput.d.ts

@@ -1,19 +1,19 @@
-import * as React from 'react';
-import { Size } from '../../types';
-export declare const Search: import("styled-components").StyledComponent<"input", any, {
-    type: "search";
-}, "type">;
-declare type SearchBarInputProps = {
-    id: string;
-    searchTerm?: string;
-    setSearchTerm: (term: string) => void;
-    enterSearch: (e: any) => void;
-    placeholder?: string;
-    disabled?: boolean;
-    onKeyDown?: (e: React.KeyboardEvent) => void;
-    size?: Size.Small | Size.Medium;
-    onBlur?: (e: any) => void;
-    focusParentRefs?: React.RefObject<any>[];
-};
-declare const SearchBarInput: React.ForwardRefExoticComponent<SearchBarInputProps & React.RefAttributes<HTMLInputElement>>;
-export default SearchBarInput;
+import * as React from 'react';
+import { Size } from '../../types';
+export declare const Search: import("styled-components").StyledComponent<"input", any, {
+    type: "search";
+}, "type">;
+declare type SearchBarInputProps = {
+    id: string;
+    searchTerm?: string;
+    setSearchTerm: (term: string) => void;
+    enterSearch: (e: any) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    onKeyDown?: (e: React.KeyboardEvent) => void;
+    size?: Size.Small | Size.Medium;
+    onBlur?: (e: any) => void;
+    focusParentRefs?: React.RefObject<any>[];
+};
+declare const SearchBarInput: React.ForwardRefExoticComponent<SearchBarInputProps & React.RefAttributes<HTMLInputElement>>;
+export default SearchBarInput;

package/dist/InputFields/components/SearchBarInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/components/SearchBarInput.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","ComponentMStyling","ComponentSStyling","useFocusVisibleRef","Search","input","attrs","type","Italic","neutral_500","Regular","black","neutral_600","MEDIUM","SearchBarInput","forwardRef","props","ref","id","searchTerm","setSearchTerm","enterSearch","placeholder","disabled","onKeyDown","size","onBlur","elementRef","focusParentRefs","isPressingEnter","e","key","preventDefault","stopPropagation","target","value"],"mappings":"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","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { BREAKPOINTS, COLORS, ComponentTextStyle } from '../../styles/index';\r\nimport { Size } from '../../types';\r\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\r\nimport { useFocusVisibleRef } from '../../common';\r\n\r\nexport const Search = styled.input.attrs(() => ({ type: 'search' }))`\r\n  appearance: none;\r\n  width: calc(100% - 96px);\r\n\r\n  /* To prevent browser putting its own cross inside the search bar */\r\n\r\n  ::-ms-clear {\r\n    display: none;\r\n    width: 0;\r\n    height: 0;\r\n  }\r\n\r\n  ::-ms-reveal {\r\n    display: none;\r\n    width: 0;\r\n    height: 0;\r\n  }\r\n\r\n  ::-webkit-search-decoration,\r\n  ::-webkit-search-cancel-button,\r\n  ::-webkit-search-results-button,\r\n  ::-webkit-search-results-decoration {\r\n    display: none;\r\n  }\r\n\r\n  ::placeholder {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n  }\r\n\r\n  height: 32px;\r\n  border-width: 0;\r\n  margin-left: 48px;\r\n  outline: none;\r\n\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n  ::placeholder {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    margin-left: 44px;\r\n\r\n    ::placeholder {\r\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    margin-left: 48px;\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    \r\n    ::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &:disabled {\r\n    background: transparent;\r\n    border: none;\r\n  }\r\n`;\r\n\r\ntype SearchBarInputProps = {\r\n  id: string;\r\n  searchTerm?: string;\r\n  setSearchTerm: (term: string) => void;\r\n  enterSearch: (e: any) => void;\r\n  placeholder?: string;\r\n  disabled?: boolean;\r\n  onKeyDown?: (e: React.KeyboardEvent) => void;\r\n  size?: Size.Small | Size.Medium;\r\n  onBlur?: (e: any) => void;\r\n  focusParentRefs?: React.RefObject<any>[];\r\n};\r\n\r\nconst SearchBarInput = React.forwardRef<HTMLInputElement, SearchBarInputProps>((props: SearchBarInputProps, ref) => {\r\n  const { id, searchTerm, setSearchTerm, enterSearch, placeholder, disabled, onKeyDown, size, onBlur } = props;\r\n\r\n  const elementRef = useFocusVisibleRef(props.focusParentRefs || [], ref);\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  return (\r\n    <Search\r\n      placeholder={disabled ? '' : placeholder}\r\n      ref={elementRef}\r\n      id={id}\r\n      data-testid={id}\r\n      className={size ? size : ''}\r\n      tabIndex={0}\r\n      disabled={disabled}\r\n      onChange={(e: any) => setSearchTerm(e.target.value)}\r\n      value={searchTerm}\r\n      onBlur={(e) => onBlur && onBlur(e)}\r\n      onKeyDown={onKeyDown}\r\n      onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}\r\n    />\r\n  );\r\n});\r\n\r\nexport default SearchBarInput;\r\n"],"file":"SearchBarInput.js"}
+{"version":3,"sources":["../../../src/InputFields/components/SearchBarInput.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","ComponentMStyling","ComponentSStyling","useFocusVisibleRef","Search","input","attrs","type","Italic","neutral_500","Regular","black","neutral_600","MEDIUM","SearchBarInput","forwardRef","props","ref","id","searchTerm","setSearchTerm","enterSearch","placeholder","disabled","onKeyDown","size","onBlur","elementRef","focusParentRefs","isPressingEnter","e","key","preventDefault","stopPropagation","target","value"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS, ComponentTextStyle } from '../../styles/index';\nimport { Size } from '../../types';\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\nimport { useFocusVisibleRef } from '../../common';\n\nexport const Search = styled.input.attrs(() => ({ type: 'search' }))`\n  appearance: none;\n  width: calc(100% - 96px);\n\n  /* To prevent browser putting its own cross inside the search bar */\n\n  ::-ms-clear {\n    display: none;\n    width: 0;\n    height: 0;\n  }\n\n  ::-ms-reveal {\n    display: none;\n    width: 0;\n    height: 0;\n  }\n\n  ::-webkit-search-decoration,\n  ::-webkit-search-cancel-button,\n  ::-webkit-search-results-button,\n  ::-webkit-search-results-decoration {\n    display: none;\n  }\n\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n  }\n\n  height: 32px;\n  border-width: 0;\n  margin-left: 48px;\n  outline: none;\n\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    ::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n\n  &.small {\n    margin-left: 44px;\n\n    ::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n\n  &.medium {\n    margin-left: 48px;\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n    \n    ::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n\n  &:disabled {\n    background: transparent;\n    border: none;\n  }\n`;\n\ntype SearchBarInputProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  placeholder?: string;\n  disabled?: boolean;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  onBlur?: (e: any) => void;\n  focusParentRefs?: React.RefObject<any>[];\n};\n\nconst SearchBarInput = React.forwardRef<HTMLInputElement, SearchBarInputProps>((props: SearchBarInputProps, ref) => {\n  const { id, searchTerm, setSearchTerm, enterSearch, placeholder, disabled, onKeyDown, size, onBlur } = props;\n\n  const elementRef = useFocusVisibleRef(props.focusParentRefs || [], ref);\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  return (\n    <Search\n      placeholder={disabled ? '' : placeholder}\n      ref={elementRef}\n      id={id}\n      data-testid={id}\n      className={size ? size : ''}\n      tabIndex={0}\n      disabled={disabled}\n      onChange={(e: any) => setSearchTerm(e.target.value)}\n      value={searchTerm}\n      onBlur={(e) => onBlur && onBlur(e)}\n      onKeyDown={onKeyDown}\n      onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}\n    />\n  );\n});\n\nexport default SearchBarInput;\n"],"file":"SearchBarInput.js"}

package/dist/InputFields/components/SearchField.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/components/SearchField.tsx"],"names":["SearchFieldWrapper","styled","div","focusStyles","StyledSearchField","COLORS","neutral_400","white","ComponentTextStyle","Regular","black","Italic","neutral_500","BREAKPOINTS","MEDIUM","primary_800","neutral_600","critical_400","neutral_100","SearchField","React","forwardRef","ref","id","searchTerm","disabled","validationMessage","children","size","className","rest","cls","concat"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAGO,IAAMA,kBAAkB,GAAGC,0BAAOC,GAAV,iIAEzBC,kBAFyB,CAAxB;;;;AAMA,IAAMC,iBAAiB,GAAGH,0BAAOC,GAAV,4nCAGEG,cAAOC,WAHT,EAURD,cAAOE,KAVC,EAY1B,+BAAkBC,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CAZ0B,EAkBxB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CAlBwB,EAqB1BC,mBAAYC,MArBc,EAsBxB,+BAAkBN,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CAtBwB,EA4BtB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CA5BsB,EAiCxB,+BAAkBJ,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CAjCwB,EAsCtB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CAtCsB,EA2CxB,+BAAkBJ,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CA3CwB,EA+CtB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CA/CsB,EAoDIP,cAAOU,WApDX,EAwDIV,cAAOU,WAxDX,EA4DjBV,cAAOW,WA5DU,EAiEIX,cAAOY,YAjEX,EAqEIZ,cAAOa,WArEX,CAAvB;;;AAoFP,IAAMC,WAAW,gBAAGC,KAAK,CAACC,UAAN,CAAkD,gBAAsFC,GAAtF,EAA8F;AAAA,MAA3FC,EAA2F,QAA3FA,EAA2F;AAAA,MAAvFC,UAAuF,QAAvFA,UAAuF;AAAA,MAA3EC,QAA2E,QAA3EA,QAA2E;AAAA,MAAjEC,iBAAiE,QAAjEA,iBAAiE;AAAA,MAA9CC,QAA8C,QAA9CA,QAA8C;AAAA,MAApCC,IAAoC,QAApCA,IAAoC;AAAA,MAA9BC,SAA8B,QAA9BA,SAA8B;AAAA,MAAhBC,IAAgB;AAClK,MAAMC,GAAG,GAAG,CAACN,QAAQ,GAAG,WAAH,GAAiB,EAA1B,EACTO,MADS,CACFR,UAAU,KAAK,EAAf,GAAoB,eAApB,GAAsC,EADpC,EAETQ,MAFS,CAEFJ,IAAI,aAAMA,IAAN,SAAgB,EAFlB,EAGTI,MAHS,CAGFN,iBAAiB,GAAG,WAAH,GAAiB,EAHhC,EAITM,MAJS,WAICH,SAJD,aAICA,SAJD,cAICA,SAJD,GAIc,EAJd,OAAZ;AAMA,sBACE,qBAAC,kBAAD;AAAoB,IAAA,GAAG,EAAEP,GAAzB;AAAA,2BACE,qBAAC,iBAAD;AAAmB,MAAA,EAAE,YAAKC,EAAL,UAArB;AAAqC,+BAAgBA,EAAhB,UAArC;AAAgE,MAAA,SAAS,EAAEQ;AAA3E,OAAoFD,IAApF;AAAA,gBACGH;AADH;AADF,IADF;AAOD,CAdmB,CAApB;;AAREJ,EAAAA,E;AACAC,EAAAA,U;AACAC,EAAAA,Q;AACAC,EAAAA,iB;AACAC,EAAAA,Q;;eAoBaR,W","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles } from '../../styles/index';\r\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\r\nimport { Size } from '../../types';\r\n\r\nexport const SearchFieldWrapper = styled.div`\r\n  &.focus-visible-within {\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const StyledSearchField = styled.div<{ activeValidationMessage?: boolean }>`\r\n  display: flex;\r\n  flex-direction: row;\r\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\r\n  box-sizing: border-box;\r\n  border-radius: 56px;\r\n  align-items: center;\r\n  position: relative;\r\n  height: 48px;\r\n  appearance: none;\r\n  background-color: ${COLORS.white};\r\n\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n\r\n  padding: 0 !important;\r\n  width: 100%;\r\n\r\n  ::placeholder {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n\r\n    height: 56px;\r\n    padding: 0 4px !important;\r\n\r\n    &::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    height: 48px;\r\n    padding: 0 !important;\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    height: 56px;\r\n\r\n    &::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &:hover {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  &:focus-within {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  div {\r\n    color: ${COLORS.neutral_600};\r\n    background-color: transparent;\r\n  }\r\n\r\n  &.invalid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_400};\r\n  }\r\n\r\n  &.disabled {\r\n    box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\r\n    pointer-events: none;\r\n    background-color: transparent !important;\r\n  }\r\n`;\r\n\r\ntype SeachFieldProps = React.HTMLAttributes<HTMLDivElement> & {\r\n  id: string;\r\n  searchTerm?: string;\r\n  disabled?: boolean;\r\n  validationMessage?: string;\r\n  children: any;\r\n  size?: Size.Small | Size.Medium;\r\n};\r\n\r\nconst SearchField = React.forwardRef<HTMLDivElement, SeachFieldProps>(({ id, searchTerm, disabled, validationMessage, children, size, className, ...rest }, ref) => {\r\n  const cls = (disabled ? 'disabled ' : '')\r\n    .concat(searchTerm !== '' ? 'searchactive ' : '')\r\n    .concat(size ? `${size} ` : '')\r\n    .concat(validationMessage ? ' invalid ' : '')\r\n    .concat(`${className ?? ''} `);\r\n\r\n  return (\r\n    <SearchFieldWrapper ref={ref}>\r\n      <StyledSearchField id={`${id}_main`} data-testid={`${id}_main`} className={cls} {...rest}>\r\n        {children}\r\n      </StyledSearchField>\r\n    </SearchFieldWrapper>\r\n  );\r\n});\r\n\r\nexport default SearchField;\r\n"],"file":"SearchField.cjs"}
+{"version":3,"sources":["../../../src/InputFields/components/SearchField.tsx"],"names":["SearchFieldWrapper","styled","div","focusStyles","StyledSearchField","COLORS","neutral_400","white","ComponentTextStyle","Regular","black","Italic","neutral_500","BREAKPOINTS","MEDIUM","primary_800","neutral_600","critical_400","neutral_100","SearchField","React","forwardRef","ref","id","searchTerm","disabled","validationMessage","children","size","className","rest","cls","concat"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAGO,IAAMA,kBAAkB,GAAGC,0BAAOC,GAAV,iIAEzBC,kBAFyB,CAAxB;;;;AAMA,IAAMC,iBAAiB,GAAGH,0BAAOC,GAAV,4nCAGEG,cAAOC,WAHT,EAURD,cAAOE,KAVC,EAY1B,+BAAkBC,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CAZ0B,EAkBxB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CAlBwB,EAqB1BC,mBAAYC,MArBc,EAsBxB,+BAAkBN,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CAtBwB,EA4BtB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CA5BsB,EAiCxB,+BAAkBJ,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CAjCwB,EAsCtB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CAtCsB,EA2CxB,+BAAkBJ,0BAAmBC,OAArC,EAA8CJ,cAAOK,KAArD,CA3CwB,EA+CtB,+BAAkBF,0BAAmBG,MAArC,EAA6CN,cAAOO,WAApD,CA/CsB,EAoDIP,cAAOU,WApDX,EAwDIV,cAAOU,WAxDX,EA4DjBV,cAAOW,WA5DU,EAiEIX,cAAOY,YAjEX,EAqEIZ,cAAOa,WArEX,CAAvB;;;AAoFP,IAAMC,WAAW,gBAAGC,KAAK,CAACC,UAAN,CAAkD,gBAAsFC,GAAtF,EAA8F;AAAA,MAA3FC,EAA2F,QAA3FA,EAA2F;AAAA,MAAvFC,UAAuF,QAAvFA,UAAuF;AAAA,MAA3EC,QAA2E,QAA3EA,QAA2E;AAAA,MAAjEC,iBAAiE,QAAjEA,iBAAiE;AAAA,MAA9CC,QAA8C,QAA9CA,QAA8C;AAAA,MAApCC,IAAoC,QAApCA,IAAoC;AAAA,MAA9BC,SAA8B,QAA9BA,SAA8B;AAAA,MAAhBC,IAAgB;AAClK,MAAMC,GAAG,GAAG,CAACN,QAAQ,GAAG,WAAH,GAAiB,EAA1B,EACTO,MADS,CACFR,UAAU,KAAK,EAAf,GAAoB,eAApB,GAAsC,EADpC,EAETQ,MAFS,CAEFJ,IAAI,aAAMA,IAAN,SAAgB,EAFlB,EAGTI,MAHS,CAGFN,iBAAiB,GAAG,WAAH,GAAiB,EAHhC,EAITM,MAJS,WAICH,SAJD,aAICA,SAJD,cAICA,SAJD,GAIc,EAJd,OAAZ;AAMA,sBACE,qBAAC,kBAAD;AAAoB,IAAA,GAAG,EAAEP,GAAzB;AAAA,2BACE,qBAAC,iBAAD;AAAmB,MAAA,EAAE,YAAKC,EAAL,UAArB;AAAqC,+BAAgBA,EAAhB,UAArC;AAAgE,MAAA,SAAS,EAAEQ;AAA3E,OAAoFD,IAApF;AAAA,gBACGH;AADH;AADF,IADF;AAOD,CAdmB,CAApB;;AAREJ,EAAAA,E;AACAC,EAAAA,U;AACAC,EAAAA,Q;AACAC,EAAAA,iB;AACAC,EAAAA,Q;;eAoBaR,W","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles } from '../../styles/index';\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\nimport { Size } from '../../types';\n\nexport const SearchFieldWrapper = styled.div`\n  &.focus-visible-within {\n    ${focusStyles}\n  }\n`;\n\nexport const StyledSearchField = styled.div<{ activeValidationMessage?: boolean }>`\n  display: flex;\n  flex-direction: row;\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\n  box-sizing: border-box;\n  border-radius: 56px;\n  align-items: center;\n  position: relative;\n  height: 48px;\n  appearance: none;\n  background-color: ${COLORS.white};\n\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n  padding: 0 !important;\n  width: 100%;\n\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n    height: 56px;\n    padding: 0 4px !important;\n\n    &::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.small {\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n    height: 48px;\n    padding: 0 !important;\n\n    &::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.medium {\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n    height: 56px;\n\n    &::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &:hover {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  &:focus-within {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  div {\n    color: ${COLORS.neutral_600};\n    background-color: transparent;\n  }\n\n  &.invalid {\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_400};\n  }\n\n  &.disabled {\n    box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\n    pointer-events: none;\n    background-color: transparent !important;\n  }\n`;\n\ntype SeachFieldProps = React.HTMLAttributes<HTMLDivElement> & {\n  id: string;\n  searchTerm?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  children: any;\n  size?: Size.Small | Size.Medium;\n};\n\nconst SearchField = React.forwardRef<HTMLDivElement, SeachFieldProps>(({ id, searchTerm, disabled, validationMessage, children, size, className, ...rest }, ref) => {\n  const cls = (disabled ? 'disabled ' : '')\n    .concat(searchTerm !== '' ? 'searchactive ' : '')\n    .concat(size ? `${size} ` : '')\n    .concat(validationMessage ? ' invalid ' : '')\n    .concat(`${className ?? ''} `);\n\n  return (\n    <SearchFieldWrapper ref={ref}>\n      <StyledSearchField id={`${id}_main`} data-testid={`${id}_main`} className={cls} {...rest}>\n        {children}\n      </StyledSearchField>\n    </SearchFieldWrapper>\n  );\n});\n\nexport default SearchField;\n"],"file":"SearchField.cjs"}

package/dist/InputFields/components/SearchField.d.ts

@@ -1,15 +1,15 @@
-import * as React from 'react';
-import { Size } from '../../types';
-export declare const SearchFieldWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledSearchField: import("styled-components").StyledComponent<"div", any, {
-    activeValidationMessage?: boolean | undefined;
-}, never>;
-declare const SearchField: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
-    id: string;
-    searchTerm?: string | undefined;
-    disabled?: boolean | undefined;
-    validationMessage?: string | undefined;
-    children: any;
-    size?: Size.Small | Size.Medium | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
-export default SearchField;
+import * as React from 'react';
+import { Size } from '../../types';
+export declare const SearchFieldWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledSearchField: import("styled-components").StyledComponent<"div", any, {
+    activeValidationMessage?: boolean | undefined;
+}, never>;
+declare const SearchField: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    id: string;
+    searchTerm?: string | undefined;
+    disabled?: boolean | undefined;
+    validationMessage?: string | undefined;
+    children: any;
+    size?: Size.Small | Size.Medium | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+export default SearchField;

package/dist/InputFields/components/SearchField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/components/SearchField.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","SearchFieldWrapper","div","StyledSearchField","neutral_400","white","Regular","black","Italic","neutral_500","MEDIUM","primary_800","neutral_600","critical_400","neutral_100","SearchField","forwardRef","ref","id","searchTerm","disabled","validationMessage","children","size","className","rest","cls","concat"],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,WAAT,EAAsBC,MAAtB,EAA8BC,kBAA9B,EAAkDC,WAAlD,QAAqE,oBAArE;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,cAArD;;AAGA,OAAO,IAAMC,kBAAkB,GAAGP,MAAM,CAACQ,GAAV,mHAEzBJ,WAFyB,CAAxB;AAMP,OAAO,IAAMK,iBAAiB,GAAGT,MAAM,CAACQ,GAAV,8mCAGEN,MAAM,CAACQ,WAHT,EAURR,MAAM,CAACS,KAVC,EAY1BL,iBAAiB,CAACH,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CAZS,EAkBxBP,iBAAiB,CAACH,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CAlBO,EAqB1Bd,WAAW,CAACe,MArBc,EAsBxBX,iBAAiB,CAACF,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CAtBO,EA4BtBR,iBAAiB,CAACF,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CA5BK,EAiCxBT,iBAAiB,CAACH,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CAjCO,EAsCtBP,iBAAiB,CAACH,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CAtCK,EA2CxBV,iBAAiB,CAACF,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CA3CO,EA+CtBR,iBAAiB,CAACF,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CA/CK,EAoDIb,MAAM,CAACe,WApDX,EAwDIf,MAAM,CAACe,WAxDX,EA4DjBf,MAAM,CAACgB,WA5DU,EAiEIhB,MAAM,CAACiB,YAjEX,EAqEIjB,MAAM,CAACkB,WArEX,CAAvB;AAoFP,IAAMC,WAAW,gBAAGtB,KAAK,CAACuB,UAAN,CAAkD,gBAAsFC,GAAtF,EAA8F;AAAA,MAA3FC,EAA2F,QAA3FA,EAA2F;AAAA,MAAvFC,UAAuF,QAAvFA,UAAuF;AAAA,MAA3EC,QAA2E,QAA3EA,QAA2E;AAAA,MAAjEC,iBAAiE,QAAjEA,iBAAiE;AAAA,MAA9CC,QAA8C,QAA9CA,QAA8C;AAAA,MAApCC,IAAoC,QAApCA,IAAoC;AAAA,MAA9BC,SAA8B,QAA9BA,SAA8B;AAAA,MAAhBC,IAAgB;;AAClK,MAAMC,GAAG,GAAG,CAACN,QAAQ,GAAG,WAAH,GAAiB,EAA1B,EACTO,MADS,CACFR,UAAU,KAAK,EAAf,GAAoB,eAApB,GAAsC,EADpC,EAETQ,MAFS,CAEFJ,IAAI,aAAMA,IAAN,SAAgB,EAFlB,EAGTI,MAHS,CAGFN,iBAAiB,GAAG,WAAH,GAAiB,EAHhC,EAITM,MAJS,WAICH,SAJD,aAICA,SAJD,cAICA,SAJD,GAIc,EAJd,OAAZ;AAMA,sBACE,KAAC,kBAAD;AAAoB,IAAA,GAAG,EAAEP,GAAzB;AAAA,2BACE,KAAC,iBAAD;AAAmB,MAAA,EAAE,YAAKC,EAAL,UAArB;AAAqC,+BAAgBA,EAAhB,UAArC;AAAgE,MAAA,SAAS,EAAEQ;AAA3E,OAAoFD,IAApF;AAAA,gBACGH;AADH;AADF,IADF;AAOD,CAdmB,CAApB;;AAREJ,EAAAA,E;AACAC,EAAAA,U;AACAC,EAAAA,Q;AACAC,EAAAA,iB;AACAC,EAAAA,Q;;AAoBF,eAAeP,WAAf","sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles } from '../../styles/index';\r\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\r\nimport { Size } from '../../types';\r\n\r\nexport const SearchFieldWrapper = styled.div`\r\n  &.focus-visible-within {\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const StyledSearchField = styled.div<{ activeValidationMessage?: boolean }>`\r\n  display: flex;\r\n  flex-direction: row;\r\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\r\n  box-sizing: border-box;\r\n  border-radius: 56px;\r\n  align-items: center;\r\n  position: relative;\r\n  height: 48px;\r\n  appearance: none;\r\n  background-color: ${COLORS.white};\r\n\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n\r\n  padding: 0 !important;\r\n  width: 100%;\r\n\r\n  ::placeholder {\r\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n\r\n    height: 56px;\r\n    padding: 0 4px !important;\r\n\r\n    &::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    height: 48px;\r\n    padding: 0 !important;\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    height: 56px;\r\n\r\n    &::placeholder {\r\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\r\n    }\r\n  }\r\n\r\n  &:hover {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  &:focus-within {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  div {\r\n    color: ${COLORS.neutral_600};\r\n    background-color: transparent;\r\n  }\r\n\r\n  &.invalid {\r\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_400};\r\n  }\r\n\r\n  &.disabled {\r\n    box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\r\n    pointer-events: none;\r\n    background-color: transparent !important;\r\n  }\r\n`;\r\n\r\ntype SeachFieldProps = React.HTMLAttributes<HTMLDivElement> & {\r\n  id: string;\r\n  searchTerm?: string;\r\n  disabled?: boolean;\r\n  validationMessage?: string;\r\n  children: any;\r\n  size?: Size.Small | Size.Medium;\r\n};\r\n\r\nconst SearchField = React.forwardRef<HTMLDivElement, SeachFieldProps>(({ id, searchTerm, disabled, validationMessage, children, size, className, ...rest }, ref) => {\r\n  const cls = (disabled ? 'disabled ' : '')\r\n    .concat(searchTerm !== '' ? 'searchactive ' : '')\r\n    .concat(size ? `${size} ` : '')\r\n    .concat(validationMessage ? ' invalid ' : '')\r\n    .concat(`${className ?? ''} `);\r\n\r\n  return (\r\n    <SearchFieldWrapper ref={ref}>\r\n      <StyledSearchField id={`${id}_main`} data-testid={`${id}_main`} className={cls} {...rest}>\r\n        {children}\r\n      </StyledSearchField>\r\n    </SearchFieldWrapper>\r\n  );\r\n});\r\n\r\nexport default SearchField;\r\n"],"file":"SearchField.js"}
+{"version":3,"sources":["../../../src/InputFields/components/SearchField.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","SearchFieldWrapper","div","StyledSearchField","neutral_400","white","Regular","black","Italic","neutral_500","MEDIUM","primary_800","neutral_600","critical_400","neutral_100","SearchField","forwardRef","ref","id","searchTerm","disabled","validationMessage","children","size","className","rest","cls","concat"],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,WAAT,EAAsBC,MAAtB,EAA8BC,kBAA9B,EAAkDC,WAAlD,QAAqE,oBAArE;AACA,SAASC,iBAAT,EAA4BC,iBAA5B,QAAqD,cAArD;;AAGA,OAAO,IAAMC,kBAAkB,GAAGP,MAAM,CAACQ,GAAV,mHAEzBJ,WAFyB,CAAxB;AAMP,OAAO,IAAMK,iBAAiB,GAAGT,MAAM,CAACQ,GAAV,8mCAGEN,MAAM,CAACQ,WAHT,EAURR,MAAM,CAACS,KAVC,EAY1BL,iBAAiB,CAACH,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CAZS,EAkBxBP,iBAAiB,CAACH,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CAlBO,EAqB1Bd,WAAW,CAACe,MArBc,EAsBxBX,iBAAiB,CAACF,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CAtBO,EA4BtBR,iBAAiB,CAACF,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CA5BK,EAiCxBT,iBAAiB,CAACH,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CAjCO,EAsCtBP,iBAAiB,CAACH,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CAtCK,EA2CxBV,iBAAiB,CAACF,kBAAkB,CAACS,OAApB,EAA6BV,MAAM,CAACW,KAApC,CA3CO,EA+CtBR,iBAAiB,CAACF,kBAAkB,CAACW,MAApB,EAA4BZ,MAAM,CAACa,WAAnC,CA/CK,EAoDIb,MAAM,CAACe,WApDX,EAwDIf,MAAM,CAACe,WAxDX,EA4DjBf,MAAM,CAACgB,WA5DU,EAiEIhB,MAAM,CAACiB,YAjEX,EAqEIjB,MAAM,CAACkB,WArEX,CAAvB;AAoFP,IAAMC,WAAW,gBAAGtB,KAAK,CAACuB,UAAN,CAAkD,gBAAsFC,GAAtF,EAA8F;AAAA,MAA3FC,EAA2F,QAA3FA,EAA2F;AAAA,MAAvFC,UAAuF,QAAvFA,UAAuF;AAAA,MAA3EC,QAA2E,QAA3EA,QAA2E;AAAA,MAAjEC,iBAAiE,QAAjEA,iBAAiE;AAAA,MAA9CC,QAA8C,QAA9CA,QAA8C;AAAA,MAApCC,IAAoC,QAApCA,IAAoC;AAAA,MAA9BC,SAA8B,QAA9BA,SAA8B;AAAA,MAAhBC,IAAgB;;AAClK,MAAMC,GAAG,GAAG,CAACN,QAAQ,GAAG,WAAH,GAAiB,EAA1B,EACTO,MADS,CACFR,UAAU,KAAK,EAAf,GAAoB,eAApB,GAAsC,EADpC,EAETQ,MAFS,CAEFJ,IAAI,aAAMA,IAAN,SAAgB,EAFlB,EAGTI,MAHS,CAGFN,iBAAiB,GAAG,WAAH,GAAiB,EAHhC,EAITM,MAJS,WAICH,SAJD,aAICA,SAJD,cAICA,SAJD,GAIc,EAJd,OAAZ;AAMA,sBACE,KAAC,kBAAD;AAAoB,IAAA,GAAG,EAAEP,GAAzB;AAAA,2BACE,KAAC,iBAAD;AAAmB,MAAA,EAAE,YAAKC,EAAL,UAArB;AAAqC,+BAAgBA,EAAhB,UAArC;AAAgE,MAAA,SAAS,EAAEQ;AAA3E,OAAoFD,IAApF;AAAA,gBACGH;AADH;AADF,IADF;AAOD,CAdmB,CAApB;;AAREJ,EAAAA,E;AACAC,EAAAA,U;AACAC,EAAAA,Q;AACAC,EAAAA,iB;AACAC,EAAAA,Q;;AAoBF,eAAeP,WAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles } from '../../styles/index';\nimport { ComponentMStyling, ComponentSStyling } from '../../styles';\nimport { Size } from '../../types';\n\nexport const SearchFieldWrapper = styled.div`\n  &.focus-visible-within {\n    ${focusStyles}\n  }\n`;\n\nexport const StyledSearchField = styled.div<{ activeValidationMessage?: boolean }>`\n  display: flex;\n  flex-direction: row;\n  box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\n  box-sizing: border-box;\n  border-radius: 56px;\n  align-items: center;\n  position: relative;\n  height: 48px;\n  appearance: none;\n  background-color: ${COLORS.white};\n\n  ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n  padding: 0 !important;\n  width: 100%;\n\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n  }\n\n  ${BREAKPOINTS.MEDIUM} {\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n    height: 56px;\n    padding: 0 4px !important;\n\n    &::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.small {\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n    height: 48px;\n    padding: 0 !important;\n\n    &::placeholder {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &.medium {\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n    height: 56px;\n\n    &::placeholder {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_500)}\n    }\n  }\n\n  &:hover {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  &:focus-within {\n    box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n  }\n\n  div {\n    color: ${COLORS.neutral_600};\n    background-color: transparent;\n  }\n\n  &.invalid {\n    box-shadow: inset 0 0 0 2px ${COLORS.critical_400};\n  }\n\n  &.disabled {\n    box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\n    pointer-events: none;\n    background-color: transparent !important;\n  }\n`;\n\ntype SeachFieldProps = React.HTMLAttributes<HTMLDivElement> & {\n  id: string;\n  searchTerm?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  children: any;\n  size?: Size.Small | Size.Medium;\n};\n\nconst SearchField = React.forwardRef<HTMLDivElement, SeachFieldProps>(({ id, searchTerm, disabled, validationMessage, children, size, className, ...rest }, ref) => {\n  const cls = (disabled ? 'disabled ' : '')\n    .concat(searchTerm !== '' ? 'searchactive ' : '')\n    .concat(size ? `${size} ` : '')\n    .concat(validationMessage ? ' invalid ' : '')\n    .concat(`${className ?? ''} `);\n\n  return (\n    <SearchFieldWrapper ref={ref}>\n      <StyledSearchField id={`${id}_main`} data-testid={`${id}_main`} className={cls} {...rest}>\n        {children}\n      </StyledSearchField>\n    </SearchFieldWrapper>\n  );\n});\n\nexport default SearchField;\n"],"file":"SearchField.js"}

package/dist/InputFields/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["import TextField from './TextField';\r\nimport PasswordField from './PasswordField';\r\nimport Checkbox from './Checkbox';\r\nimport RadioButton from './RadioButton';\r\nimport SearchBar from './SearchBar';\r\nimport InputLabel from './Label';\r\nimport DatepickerField from './DatepickerField';\r\nimport Textarea from './Textarea';\r\nimport QuickSearch from './QuickSearch';\r\nimport NumberField from './NumberField';\r\n\r\nexport * from './styling';\r\n\r\nexport {\r\n  TextField,\r\n  PasswordField,\r\n  Checkbox,\r\n  RadioButton,\r\n  SearchBar,\r\n  InputLabel,\r\n  DatepickerField,\r\n  Textarea,\r\n  QuickSearch,\r\n  NumberField\r\n};\r\n"],"file":"index.cjs"}
+{"version":3,"sources":["../../src/InputFields/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["import TextField from './TextField';\nimport PasswordField from './PasswordField';\nimport Checkbox from './Checkbox';\nimport RadioButton from './RadioButton';\nimport SearchBar from './SearchBar';\nimport InputLabel from './Label';\nimport DatepickerField from './DatepickerField';\nimport Textarea from './Textarea';\nimport QuickSearch from './QuickSearch';\nimport NumberField from './NumberField';\n\nexport * from './styling';\n\nexport {\n  TextField,\n  PasswordField,\n  Checkbox,\n  RadioButton,\n  SearchBar,\n  InputLabel,\n  DatepickerField,\n  Textarea,\n  QuickSearch,\n  NumberField\n};\n"],"file":"index.cjs"}