@laerdal/life-react-components 1.11.0-dev.9 → 2.0.0-dev.1.full

package/dist/InputFields/SearchBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.cjs","names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","useClickOutsideRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"sources":["../../src/InputFields/SearchBar.tsx"],"sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {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';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\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  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<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                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <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\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"mappings":"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"}
+{"version":3,"file":"SearchBar.cjs","names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","useClickOutsideRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"sources":["../../src/InputFields/SearchBar.tsx"],"sourcesContent":["import React from 'react';\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';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\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  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<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                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <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\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          ariaRolesType=\"input\"\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"mappings":"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"}

package/dist/InputFields/SearchBar.js

@@ -138,6 +138,7 @@ var SearchBar = function SearchBar(_ref) {
         containerRef: containerRef,
         size: size,
         isButton: false,
+        ariaRolesType: "input",
         customizationProps: {
           items: searchList,
           action: dropdownAction,

package/dist/InputFields/SearchBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.js","names":["React","COLORS","Search","SearchIcon","Clear","ClearIcon","TechnicalWarning","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","DropdownContent","useClickOutsideRef","ClearIconWrapper","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","critical_400"],"sources":["../../src/InputFields/SearchBar.tsx"],"sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {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';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\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  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<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                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <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\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"mappings":"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"}
+{"version":3,"file":"SearchBar.js","names":["React","COLORS","Search","SearchIcon","Clear","ClearIcon","TechnicalWarning","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","DropdownContent","useClickOutsideRef","ClearIconWrapper","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","critical_400"],"sources":["../../src/InputFields/SearchBar.tsx"],"sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {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';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\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  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<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                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <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\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          ariaRolesType=\"input\"\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"mappings":"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"}

package/dist/InputFields/Textarea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.cjs","names":["TextareaWrapper","styled","div","props","margin","TextArea","textarea","COLORS","neutral_400","white","autoHeight","ComponentMStyling","ComponentTextStyle","Italic","black","ComponentSStyling","neutral_500","primary_700","primary_800","critical_500","correct_500","neutral_100","neutral_300","Textarea","React","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","rest","cls","States","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * 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.forwardRef<HTMLTextAreaElement, TextareaProps>(({\n  id,\n  placeholder,\n  state,\n  value,\n  size,\n  disabled,\n  validationMessage,\n  onChange,\n  margin,\n  autoHeight,\n  note,\n  required,\n  className,\n  ...rest\n}: TextareaProps, ref) => {\n\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        ref={ref}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={cls}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n        {...rest}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <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"],"mappings":"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"}
+{"version":3,"file":"Textarea.cjs","names":["TextareaWrapper","styled","div","props","margin","TextArea","textarea","COLORS","neutral_400","white","autoHeight","ComponentMStyling","ComponentTextStyle","Italic","black","ComponentSStyling","neutral_500","primary_700","primary_800","critical_500","correct_500","neutral_100","neutral_300","Textarea","React","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","rest","cls","States","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n\n/**\n * Import custom styles.\n */\nimport { COLORS, ComponentSStyling } 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.forwardRef<any, TextareaProps>(({\n  id,\n  placeholder,\n  state,\n  value,\n  size,\n  disabled,\n  validationMessage,\n  onChange,\n  margin,\n  autoHeight,\n  note,\n  required,\n  className,\n  ...rest\n}: TextareaProps, ref) => {\n\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        ref={ref}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={cls}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n        {...rest}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <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"],"mappings":"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"}

package/dist/InputFields/Textarea.d.ts

@@ -17,5 +17,5 @@ declare const Textarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLA
     margin?: string | undefined;
     note?: TextFieldNote | undefined;
     required: boolean;
-} & React.RefAttributes<HTMLTextAreaElement>>;
+} & React.RefAttributes<any>>;
 export default Textarea;

package/dist/InputFields/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","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","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","rest","cls","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * 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.forwardRef<HTMLTextAreaElement, TextareaProps>(({\n  id,\n  placeholder,\n  state,\n  value,\n  size,\n  disabled,\n  validationMessage,\n  onChange,\n  margin,\n  autoHeight,\n  note,\n  required,\n  className,\n  ...rest\n}: TextareaProps, ref) => {\n\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        ref={ref}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={cls}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n        {...rest}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <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"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,EAAiBC,iBAAjB,QAA0C,WAA1C;AACA,SAAuBC,WAAvB,EAAoCC,iBAApC,QAA6D,WAA7D;AACA,SAAeC,MAAf,QAA6B,UAA7B;AAEA;AACA;AACA;;AACA,SAASC,SAAT,EAAoBC,gBAApB,QAA4C,kCAA5C;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,iBAAT,EAA4BC,kBAA5B,QAAsD,WAAtD;;;AAGA;AACA,IAAMC,eAAe,GAAGH,MAAM,CAACI,GAAV,gGAEjB,UAACC,KAAD;EAAA,OAAYA,KAAK,CAACC,MAAN,qBAA0BD,KAAK,CAACC,MAAhC,SAA4C,EAAxD;AAAA,CAFiB,CAArB;AAIA,IAAMC,QAAQ,GAAGP,MAAM,CAACQ,QAAV,yhCACQf,MAAM,CAACgB,WADf,EAEEhB,MAAM,CAACiB,KAFT,EAQF,UAACL,KAAD;EAAA,OAAYA,KAAK,CAACM,UAAN,GAAmB,MAAnB,GAA4B,EAAxC;AAAA,CARE,EAUVV,iBAAiB,CAACC,kBAAkB,CAACU,MAApB,EAA4BnB,MAAM,CAACoB,KAAnC,CAVP,EAaRnB,iBAAiB,CAACQ,kBAAkB,CAACU,MAApB,EAA4BnB,MAAM,CAACoB,KAAnC,CAbT,EAgBNnB,iBAAiB,CAACQ,kBAAkB,CAACU,MAApB,EAA4BnB,MAAM,CAACqB,WAAnC,CAhBX,EAqBRb,iBAAiB,CAACC,kBAAkB,CAACU,MAApB,EAA4BnB,MAAM,CAACoB,KAAnC,CArBT,EA0BUpB,MAAM,CAACsB,WA1BjB,EAgCUtB,MAAM,CAACuB,WAhCjB,EA0C0BvB,MAAM,CAACwB,YA1CjC,EAgDoBxB,MAAM,CAACyB,WAhD3B,EAuDUzB,MAAM,CAAC0B,WAvDjB,EA4DC1B,MAAM,CAAC2B,WA5DR,EAiERnB,iBAAiB,CAACC,kBAAkB,CAACU,MAApB,EAA4BnB,MAAM,CAACqB,WAAnC,CAjET,CAAd;AAqEA,IAAMO,QAAQ,gBAAG7B,KAAK,CAAC8B,UAAN,CAAqD,gBAepDC,GAfoD,EAe5C;EAAA,IAdxBC,EAcwB,QAdxBA,EAcwB;EAAA,IAbxBC,WAawB,QAbxBA,WAawB;EAAA,IAZxBC,KAYwB,QAZxBA,KAYwB;EAAA,IAXxBC,KAWwB,QAXxBA,KAWwB;EAAA,IAVxBC,IAUwB,QAVxBA,IAUwB;EAAA,IATxBC,QASwB,QATxBA,QASwB;EAAA,IARxBC,iBAQwB,QARxBA,iBAQwB;EAAA,IAPxBC,SAOwB,QAPxBA,QAOwB;EAAA,IANxBzB,MAMwB,QANxBA,MAMwB;EAAA,IALxBK,UAKwB,QALxBA,UAKwB;EAAA,IAJxBqB,IAIwB,QAJxBA,IAIwB;EAAA,IAHxBC,QAGwB,QAHxBA,QAGwB;EAAA,IAFxBC,SAEwB,QAFxBA,SAEwB;EAAA,IADrBC,IACqB;;EAExB,IAAMC,GAAG,aAAMR,IAAN,cAAcF,KAAK,KAAKI,iBAAiB,GAAGjC,MAAM,CAACwC,OAAV,GAAoB,EAA1C,CAAnB,cAAoEH,SAAS,IAAI,EAAjF,CAAT;EACA,oBACE,MAAC,eAAD;IAAA,wBACE,KAAC,QAAD;MACE,EAAE,EAAEV,EADN;MAEE,GAAG,EAAED,GAFP;MAGE,KAAK,EAAEI,KAHT;MAIE,WAAW,EAAEE,QAAQ,GAAGS,SAAH,GAAeb,WAJtC;MAKE,UAAU,EAAEd,UALd;MAME,SAAS,EAAEyB,GANb;MAOE,QAAQ,EAAEP,QAPZ;MAQE,QAAQ,EAAE,kBAACU,CAAD;QAAA;;QAAA,OAAYR,SAAQ,IAAIA,SAAQ,CAAC,CAAAQ,CAAC,SAAD,IAAAA,CAAC,WAAD,yBAAAA,CAAC,CAAEC,MAAH,wDAAWb,KAAX,KAAoB,EAArB,CAAhC;MAAA,CARZ;MASE,QAAQ,EAAEM;IATZ,GAUME,IAVN,EADF,EAaGL,iBAAiB,iBAChB,MAAC,iBAAD;MAAmB,SAAS,EAAEF,IAAI,IAAI,EAAtC;MAA0C,IAAI,EAAEF,KAAF,aAAEA,KAAF,cAAEA,KAAF,GAAW7B,MAAM,CAACwC,OAAhE;MAAA,WACGX,KAAK,KAAK7B,MAAM,CAAC4C,KAAjB,gBAAyB,KAAC,SAAD;QAAW,KAAK,EAAEhD,MAAM,CAACiD;MAAzB,EAAzB,gBAAoE,KAAC,gBAAD;QAAkB,KAAK,EAAEjD,MAAM,CAACkD;MAAhC,EADvE,eAEE;QAAA,UAAOb;MAAP,EAFF;IAAA,EAdJ,EAmBGE,IAAI,IAAI,CAACH,QAAT,iBACC,MAAC,WAAD;MAAa,SAAS,EAAED,IAAxB;MAAA,WACGI,IAAI,CAACY,IADR,eAEE;QAAA,UAAOZ,IAAI,CAACa;MAAZ,EAFF;IAAA,EApBJ;EAAA,EADF;AA4BD,CA9CgB,CAAjB;AAgDA,eAAexB,QAAf"}
+{"version":3,"file":"Textarea.js","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","forwardRef","ref","id","placeholder","state","value","size","disabled","validationMessage","onChange","note","required","className","rest","cls","Invalid","undefined","e","target","Valid","correct_400","critical_400","icon","message"],"sources":["../../src/InputFields/Textarea.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n\n/**\n * Import custom styles.\n */\nimport { COLORS, ComponentSStyling } 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.forwardRef<any, TextareaProps>(({\n  id,\n  placeholder,\n  state,\n  value,\n  size,\n  disabled,\n  validationMessage,\n  onChange,\n  margin,\n  autoHeight,\n  note,\n  required,\n  className,\n  ...rest\n}: TextareaProps, ref) => {\n\n  const cls = `${size} ${state || (validationMessage ? States.Invalid : '')} ${className || ''}`;\n  return (\n    <TextareaWrapper>\n      <TextArea\n        id={id}\n        ref={ref}\n        value={value}\n        placeholder={disabled ? undefined : placeholder}\n        autoHeight={autoHeight}\n        className={cls}\n        disabled={disabled}\n        onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n        required={required}\n        {...rest}\n      />\n      {validationMessage && (\n        <ValidationMessage className={size || ''} type={state ?? States.Invalid}>\n          {state === States.Valid ? <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"],"mappings":"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"}

package/dist/InputFields/types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"types.cjs","names":[],"sources":["../../src/InputFields/types.ts"],"sourcesContent":["import { Size } from '../types';\n\nexport type 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?: 'invalid' | '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\nexport type TextareaProps =\n  Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'placeholder' | 'disabled' | 'required' | 'onChange'>\n  & {\n  id: string;\n  placeholder: string;\n  value?: string;\n  disabled?: boolean;\n  state?: 'invalid' | 'valid';\n  onChange?: (text: string) => void;\n  validationMessage?: string;\n  size: Size.Small | Size.Medium;\n  autoHeight?: boolean;\n  margin?: string;\n  note?: TextFieldNote;\n  required: boolean;\n};\n\nexport type TextFieldNote = {\n  message: string;\n  icon: React.ReactNode;\n};\n"],"mappings":""}
+{"version":3,"file":"types.cjs","names":[],"sources":["../../src/InputFields/types.ts"],"sourcesContent":["import { Size } from '../types';\nimport React from 'react';\n\nexport type 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?: 'invalid' | '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\nexport type TextareaProps =\n  Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'placeholder' | 'disabled' | 'required' | 'onChange'>\n  & {\n  id: string;\n  placeholder: string;\n  value?: string;\n  disabled?: boolean;\n  state?: 'invalid' | 'valid';\n  onChange?: (text: string) => void;\n  validationMessage?: string;\n  size: Size.Small | Size.Medium;\n  autoHeight?: boolean;\n  margin?: string;\n  note?: TextFieldNote;\n  required: boolean;\n};\n\nexport type TextFieldNote = {\n  message: string;\n  icon: React.ReactNode;\n};\n"],"mappings":""}

package/dist/InputFields/types.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
 import { Size } from '../types';
+import React from 'react';
 export declare type TextFieldProps = {
     id: string;
     disabled?: boolean;

package/dist/InputFields/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../src/InputFields/types.ts"],"sourcesContent":["import { Size } from '../types';\n\nexport type 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?: 'invalid' | '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\nexport type TextareaProps =\n  Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'placeholder' | 'disabled' | 'required' | 'onChange'>\n  & {\n  id: string;\n  placeholder: string;\n  value?: string;\n  disabled?: boolean;\n  state?: 'invalid' | 'valid';\n  onChange?: (text: string) => void;\n  validationMessage?: string;\n  size: Size.Small | Size.Medium;\n  autoHeight?: boolean;\n  margin?: string;\n  note?: TextFieldNote;\n  required: boolean;\n};\n\nexport type TextFieldNote = {\n  message: string;\n  icon: React.ReactNode;\n};\n"],"mappings":""}
+{"version":3,"file":"types.js","names":[],"sources":["../../src/InputFields/types.ts"],"sourcesContent":["import { Size } from '../types';\nimport React from 'react';\n\nexport type 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?: 'invalid' | '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\nexport type TextareaProps =\n  Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'placeholder' | 'disabled' | 'required' | 'onChange'>\n  & {\n  id: string;\n  placeholder: string;\n  value?: string;\n  disabled?: boolean;\n  state?: 'invalid' | 'valid';\n  onChange?: (text: string) => void;\n  validationMessage?: string;\n  size: Size.Small | Size.Medium;\n  autoHeight?: boolean;\n  margin?: string;\n  note?: TextFieldNote;\n  required: boolean;\n};\n\nexport type TextFieldNote = {\n  message: string;\n  icon: React.ReactNode;\n};\n"],"mappings":""}

package/dist/LoadingIndicator/LoadingIndicator.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Size } from '../types';
 declare type LoadingIndicatorProps = {
     id?: string;

package/dist/MiniProductCard/MiniProductCard.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Product } from '../types';
 declare type CardProps = {
     product: Product;

package/dist/Modals/ModalContent.cjs

@@ -227,7 +227,8 @@ ModalContent.propTypes = {
   headerActions: _propTypes.default.array,
   footerActions: _propTypes.default.array,
   tooltip: _propTypes.default.string,
-  zIndex: _propTypes.default.number
+  zIndex: _propTypes.default.number,
+  children: _propTypes.default.node
 };
 var _default = ModalContent;
 exports.default = _default;

package/dist/Modals/ModalContent.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.cjs","names":["HeaderText","styled","div","HeaderTitle","ComponentMStyling","ComponentTextStyle","Bold","COLORS","black","HeaderNote","ComponentXXSStyling","Regular","neutral_600","HeaderActions","Header","TooltipContainer","Content","scrollBarStyling","Size","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","ComponentSStyling","primary_500","FooterRightContainer","Footer","Wrapper","ComponentLStyling","ComponentXSStyling","ComponentXLStyling","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","React","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {Close, Help} from '../icons/systemicons/SystemIcons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}
+{"version":3,"file":"ModalContent.cjs","names":["HeaderText","styled","div","HeaderTitle","ComponentMStyling","ComponentTextStyle","Bold","COLORS","black","HeaderNote","ComponentXXSStyling","Regular","neutral_600","HeaderActions","Header","TooltipContainer","Content","scrollBarStyling","Size","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","ComponentSStyling","primary_500","FooterRightContainer","Footer","Wrapper","ComponentLStyling","ComponentXSStyling","ComponentXLStyling","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","React","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {Close, Help} from '../icons/systemicons/SystemIcons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n  children?: React.ReactNode;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}

package/dist/Modals/ModalContent.d.ts

@@ -12,6 +12,7 @@ interface ModalContentProps {
     leftFooterAction?: LeftFooterAction;
     tooltip?: string;
     zIndex?: number;
+    children?: React.ReactNode;
 }
 declare const ModalContent: React.FC<ModalContentProps>;
 export default ModalContent;

package/dist/Modals/ModalContent.js

@@ -197,7 +197,8 @@ ModalContent.propTypes = {
   headerActions: _pt.array,
   footerActions: _pt.array,
   tooltip: _pt.string,
-  zIndex: _pt.number
+  zIndex: _pt.number,
+  children: _pt.node
 };
 export default ModalContent;
 //# sourceMappingURL=ModalContent.js.map

package/dist/Modals/ModalContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.js","names":["React","Size","ModalContainer","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXLStyling","ComponentXSStyling","ComponentXXSStyling","scrollBarStyling","TooltipContainer","TooltipWrapper","Button","IconButton","Close","Help","HyperLink","HeaderText","div","HeaderTitle","Bold","black","HeaderNote","Regular","neutral_600","HeaderActions","Header","Content","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","primary_500","FooterRightContainer","Footer","Wrapper","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {Close, Help} from '../icons/systemicons/SystemIcons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}
+{"version":3,"file":"ModalContent.js","names":["React","Size","ModalContainer","styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXLStyling","ComponentXSStyling","ComponentXXSStyling","scrollBarStyling","TooltipContainer","TooltipWrapper","Button","IconButton","Close","Help","HyperLink","HeaderText","div","HeaderTitle","Bold","black","HeaderNote","Regular","neutral_600","HeaderActions","Header","Content","Small","FooterLeftContainer","FooterLeftNote","FooterLeftLink","primary_500","FooterRightContainer","Footer","Wrapper","ModalContent","props","tooltip","XSmall","cursor","headerActions","map","action","index","icon","rest","id","getLeftActionIconElement","leftFooterAction","cloneElement","size","Large","actionType","text","variant","e","preventDefault","isModalOpen","closeAction","Medium","title","note","children","footerActions","item","a","key","zIndex"],"sources":["../../src/Modals/ModalContent.tsx"],"sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {ButtonAction, IconButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink} from './ModalTypes';\nimport {ModalContainer} from './index';\nimport styled from 'styled-components';\nimport {\n  COLORS,\n  ComponentLStyling,\n  ComponentMStyling, ComponentSStyling,\n  ComponentTextStyle, ComponentXLStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling,\n  scrollBarStyling\n} from '../styles';\nimport {TooltipContainer, TooltipWrapper} from '../Tooltips';\nimport {Button, IconButton} from '../Button';\nimport {Close, Help} from '../icons/systemicons/SystemIcons';\nimport {HyperLink} from '../HyperLink';\n\nconst HeaderText = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  padding: 12px 0 12px 12px;\n  gap: 4px\n`;\nconst HeaderTitle = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.black)}\n`;\nconst HeaderNote = styled.div`\n  ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n`;\n\nconst HeaderActions = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst Header = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 4px;\n\n  ${TooltipContainer} {\n    height: max-content;\n  }\n`;\n\nconst Content = styled.div`\n  margin-right: 8px;\n  padding: 0 8px 0 16px;\n  overflow: auto;\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nconst FooterLeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst FooterLeftNote = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 4px;\n\n  ${ComponentXXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\nconst FooterLeftLink = styled.div`\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.primary_500)}\n  a {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n`;\n\nconst FooterRightContainer = styled.div`\n  gap: 8px;\n  margin-left: auto;\n`\n\nconst Footer = styled.div`\n  display: flex;\n  flex-direction: row;\n  padding: 8px 16px;\n`;\n\n\nconst Wrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: max-content;\n\n  max-height: calc(100vh - 32px);\n  max-width: calc(100vw - 32px);\n\n  &.medium {\n    max-height: calc(100vh - 64px);\n    max-width: calc(100vw - 64px);\n\n    ${Header} {\n      padding: 12px 12px 4px 12px;\n\n      ${HeaderText} {\n        padding: 12px 0 12px 12px;\n        gap: 4px;\n\n        ${HeaderTitle} {\n          ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 16px 0 24px;\n    }\n\n    ${Footer} {\n      padding: 12px 24px 20px 24px;\n\n      ${FooterLeftNote} {\n        ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n        gap: 6px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 6px;\n        }\n\n        ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 8px;\n      }\n    }\n  }\n\n  &.large {\n    max-height: calc(100vh - 112px);\n    max-width: calc(100vw - 112px);\n\n    ${Header} {\n      padding: 20px 20px 4px 20px;\n\n      ${HeaderText} {\n        padding: 10px 0 10px 12px;\n        gap: 8px;\n\n        ${HeaderTitle} {\n          ${ComponentXLStyling(ComponentTextStyle.Bold, null)}\n        }\n\n        ${HeaderNote} {\n          ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n        }\n      }\n    }\n\n    ${Content} {\n      padding: 0 24px 0 32px;\n    }\n\n    ${Footer} {\n      padding: 16px 32px 32px 32px;\n\n      ${FooterLeftNote} {\n        ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n        gap: 8px;\n      }\n\n      ${FooterLeftLink} {\n        a {\n          gap: 8px;\n        }\n\n        ${ComponentLStyling(ComponentTextStyle.Bold, null)}\n      }\n\n      ${FooterRightContainer} {\n        gap: 16px;\n      }\n    }\n  }\n`;\n\n\ninterface ModalContentProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  isModalOpen: boolean;\n  closeAction: () => void;\n  title: string;\n  note?: string;\n  headerActions?: IconButtonAction[];\n  footerActions?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  zIndex?: number;\n  children?: React.ReactNode;\n}\n\nconst ModalContent: React.FC<ModalContentProps> = (props) => {\n\n  const tooltip = () =>\n    !!props.tooltip &&\n    <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"bottom\" withArrow={false}\n                    label={props.tooltip}>\n      <IconButton variant=\"secondary\" shape=\"circular\" style={{cursor: 'help'}} action={() => {\n      }}>\n        <Help size=\"24px\" color={COLORS.neutral_600}/>\n      </IconButton>\n    </TooltipWrapper>;\n\n  const headerActions = () => props.headerActions?.map((action, index) => {\n      const {icon, ...rest} = action;\n      return <IconButton key={action.id || index}\n                         {...rest}>\n        {icon}\n      </IconButton>\n    }\n  );\n\n  const getLeftActionIconElement = () =>\n    !!props.leftFooterAction?.icon &&\n    React.cloneElement(props.leftFooterAction?.icon as React.ReactElement, {\n      size:\n        props.size === Size.Small\n          ? '20px'\n          : props.size === Size.Large\n            ? '28px'\n            : '24px'\n    });\n\n  const leftFooterAction = () => {\n    if (!props.leftFooterAction) return null;\n\n    switch (props.leftFooterAction.actionType) {\n      case 'button': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterButton;\n        return (\n          <Button{...rest}\n                 size={props.size}\n                 onClick={action}\n                 variant={variant ?? 'secondary'}>\n            {text}\n          </Button>\n        );\n      }\n      case 'hyperlink': {\n        const {text, variant, action, ...rest} = props.leftFooterAction as LeftFooterHyperlink;\n        return (\n          <FooterLeftLink>\n            <HyperLink {...rest}\n                       variant={variant ?? 'default'}\n                       onClick={(e) => {\n                         if (action) {\n                           e.preventDefault();\n                           action(e);\n                         }\n                       }}>\n              {getLeftActionIconElement()}\n              {text}\n            </HyperLink>\n          </FooterLeftLink>\n        );\n\n      }\n      case 'note': {\n        const {text} = props.leftFooterAction;\n        return (\n          <FooterLeftNote>\n            {getLeftActionIconElement()}\n            <span>{text}</span>\n          </FooterLeftNote>\n        );\n      }\n    }\n  };\n\n\n  return (\n    <ModalContainer showModal={props.isModalOpen} closeModal={props.closeAction}>\n      <Wrapper className={props.size ?? Size.Medium}>\n        <Header>\n          <HeaderText>\n            <HeaderTitle>{props.title}</HeaderTitle>\n            {!!props.note && <HeaderNote>{props.note}</HeaderNote>}\n          </HeaderText>\n          <HeaderActions>\n            {tooltip()}\n            {headerActions()}\n            <IconButton id={'content-modal-close-button'} variant=\"secondary\" shape=\"circular\"\n                        action={props.closeAction}>\n              <Close size=\"24px\" color={COLORS.neutral_600}/>\n            </IconButton>\n          </HeaderActions>\n        </Header>\n        <Content>\n          {props.children}\n        </Content>\n        <Footer>\n          <FooterLeftContainer>\n            {leftFooterAction()}\n          </FooterLeftContainer>\n          <FooterRightContainer>\n            {props.footerActions?.map((item, index) => {\n                const {action, text, ...rest} = item;\n                return <Button key={rest.id || index}\n                               {...rest}\n                               onClick={action}\n                               size={props.size}\n                               onKeyDown={a => (a.key === 'Enter' || a.key === ' ') && action!(a)}>\n                  {text}\n                </Button>\n              }\n            )}\n          </FooterRightContainer>\n        </Footer>\n      </Wrapper>\n    </ModalContainer>\n  );\n};\n\nexport default ModalContent;\n"],"mappings":"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"}

package/dist/Modals/ModalDialog.cjs

@@ -377,6 +377,7 @@ var ModalDialog = function ModalDialog(_ref) {
 exports.ModalDialog = ModalDialog;
 ModalDialog.propTypes = {
   isModalOpen: _propTypes.default.bool.isRequired,
+  children: _propTypes.default.node,
   closeModalAndClearInput: _propTypes.default.any.isRequired,
   title: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
   topImage: _propTypes.default.any,

package/dist/Modals/ModalDialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalDialog.cjs","names":["ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","topImageWithFallbacksProps","topImageGrayscale","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","icon","zIndex","contentOverflow","width","hasContentBorders","getMinWidth","Size","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","getMaxHeight","ModalTitle","ComponentTextStyle","Bold","ModalTootip","XSmall","COLORS","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","React","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","e","preventDefault","display","flexDirection","maxHeight","loader","alt","fallbacks","src","map","b","i","id"],"sources":["../../src/Modals/ModalDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n  BackButtonWrapper,\n  CloseButtonWrapper,\n  Column,\n  FlexContainer,\n  ModalBody,\n  ModalFooter,\n  ModalHeaderActions,\n  ModalHeaderActionsWithImage,\n  ModalTitleSection,\n  StyledModalHeader,\n  ModalHoverModifier,\n  ImageOverlay,\n  ImageContainer,\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { HyperLink, ImageWithFallbacks } from '..';\nimport { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';\n\ninterface NewModalProps {\n  size?: Size;\n  isModalOpen: boolean;\n  closeModalAndClearInput: any;\n  title?: string | React.ReactNode;\n  topImage?: any;\n  topImageWithFallbacksProps?: ImageWithFallbacksProps;\n  topImageGrayscale?: boolean;\n  buttons?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n  note?: string | React.ReactNode;\n  state?: string;\n  icon?: React.ReactNode;\n  zIndex?: number;\n  contentOverflow?: string;\n  width?: string;\n  hasContentBorders?: boolean;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  topImageWithFallbacksProps,\n  topImageGrayscale,\n  buttons,\n  leftFooterAction,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n  children,\n  note,\n  state,\n  icon,\n  zIndex,\n  contentOverflow,\n  width,\n  hasContentBorders,\n}) => {\n  const getMinWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '320px';\n      case Size.Large:\n        return '640px';\n      case Size.Medium:\n      default:\n        return '480px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '480px';\n      case Size.Large:\n        return '720px';\n      case Size.Medium:\n      default:\n        return '640px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 160;\n      case Size.Medium:\n        return 200;\n      case Size.Large:\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px';\n      case Size.Medium:\n        return '24px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px 16px 8px';\n      case Size.Medium:\n        return '24px 24px 20px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const getMaxHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 'calc(100vh - 56px)';\n      case Size.Medium:\n        return 'calc(100vh - 76px)';\n      case Size.Large:\n        return 'calc(100vh - 96px)';\n      default:\n        return 'calc(100vh - 72px)';\n    }\n  };\n\n  const ModalTitle = (title: string | React.ReactNode, size?: Size) => {\n    if (typeof title === 'string') {\n      switch (size) {\n        case Size.Small:\n          return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n        case Size.Medium:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n        case Size.Large:\n          return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n        default:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      }\n    } else {\n      return title;\n    }\n  };\n\n  const ModalTootip = (tooltip: string) => {\n    return (\n      <ModalHoverModifier>\n        <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n            <Help size=\"24px\" color={COLORS.neutral_600} />\n          </IconButton>\n        </TooltipWrapper>\n      </ModalHoverModifier>\n    );\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  const getLeftActionIconElement = (icon: React.ReactNode) => {\n    return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n  };\n\n  const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n    const { text, actionType, disabled, icon, action } = leftFooterAction;\n    switch (actionType) {\n      case 'button':\n        return (\n          <Button\n            id={'left-action-button'}\n            type={(leftFooterAction as LeftFooterButton)?.type}\n            disabled={disabled}\n            loading={(leftFooterAction as LeftFooterButton)?.loading}\n            icon={icon}\n            size={size}\n            onClick={action}\n            variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n            style={{ order: -1, marginRight: 'auto' }}>\n            {text}\n          </Button>\n        );\n      case 'hyperlink':\n        return (\n          <HyperLink\n            id=\"left-action-hyperlink\"\n            className=\"footer-action\"\n            href={(leftFooterAction as LeftFooterHyperlink).href}\n            disabled={disabled}\n            variant=\"default\"\n            onClick={(e) => {\n              if (action) {\n                e.preventDefault();\n                action(e);\n              }\n            }}>\n            {icon && getLeftActionIconElement(icon)}\n            {text}\n          </HyperLink>\n        );\n      case 'note':\n        return (\n          <div className=\"footer-action note\">\n            {icon && getLeftActionIconElement(icon)}\n            <span>{text}</span>\n          </div>\n        );\n    }\n  };\n\n  return (\n    <ModalContainer\n      showModal={isModalOpen}\n      closeModal={closeModalAndClearInput}\n      minWidth={getMinWidth()}\n      maxWidth={getMaxWidth()}\n      height=\"auto\"\n      padding={getPadding()}\n      zIndex={zIndex}\n      width={width}>\n      <Column>\n        <form onSubmit={submitAction} style={{ display: 'flex', flexDirection: 'column', maxHeight: getMaxHeight() }}>\n          {(topImage || topImageWithFallbacksProps) && (\n            <StyledModalHeader size={size} $height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <ImageContainer $height={getImageHeight()}>\n                {topImageGrayscale && <ImageOverlay $height={getImageHeight()} />}\n                {topImage && <img src={topImage} alt=\"Modal top\" />}\n                {!topImage && topImageWithFallbacksProps && (\n                  <ImageWithFallbacks\n                    loader={topImageWithFallbacksProps.loader}\n                    alt={topImageWithFallbacksProps.alt}\n                    fallbacks={topImageWithFallbacksProps.fallbacks}\n                    src={topImageWithFallbacksProps.src}\n                  />\n                )}\n              </ImageContainer>\n              <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n                {ModalBackButton()}\n                {ModalCloseButton(closeAction)}\n              </ModalHeaderActionsWithImage>\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            <FlexContainer>\n              {!(topImage || topImageWithFallbacksProps) && ModalBackButton()}\n              {title && ModalTitle(title, size)}\n            </FlexContainer>\n            {(tooltip || !(topImage || topImageWithFallbacksProps)) && (\n              <ModalHeaderActions>\n                {tooltip && ModalTootip(tooltip)}\n                {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n              </ModalHeaderActions>\n            )}\n          </ModalTitleSection>\n\n          <ModalBody size={size} overflow={contentOverflow} hasContentBorders={hasContentBorders}>\n            {children}\n          </ModalBody>\n\n          {note && <ModalNote note={note} state={state} size={size} icon={icon} />}\n\n          <ModalFooter size={size}>\n            {leftFooterAction && LeftFooterAction(leftFooterAction)}\n            {buttons?.map((b, i) => (\n              <Button key={b.id || i} icon={b.icon} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n                {b.text}\n              </Button>\n            ))}\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"mappings":"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"}
+{"version":3,"file":"ModalDialog.cjs","names":["ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","topImageWithFallbacksProps","topImageGrayscale","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","icon","zIndex","contentOverflow","width","hasContentBorders","getMinWidth","Size","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","getMaxHeight","ModalTitle","ComponentTextStyle","Bold","ModalTootip","XSmall","COLORS","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","React","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","e","preventDefault","display","flexDirection","maxHeight","loader","alt","fallbacks","src","map","b","i","id"],"sources":["../../src/Modals/ModalDialog.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n  BackButtonWrapper,\n  CloseButtonWrapper,\n  Column,\n  FlexContainer,\n  ModalBody,\n  ModalFooter,\n  ModalHeaderActions,\n  ModalHeaderActionsWithImage,\n  ModalTitleSection,\n  StyledModalHeader,\n  ModalHoverModifier,\n  ImageOverlay,\n  ImageContainer,\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { HyperLink, ImageWithFallbacks } from '..';\nimport { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';\n\ninterface NewModalProps {\n  size?: Size;\n  isModalOpen: boolean;\n  children?: React.ReactNode;\n  closeModalAndClearInput: any;\n  title?: string | React.ReactNode;\n  topImage?: any;\n  topImageWithFallbacksProps?: ImageWithFallbacksProps;\n  topImageGrayscale?: boolean;\n  buttons?: ButtonAction[];\n  leftFooterAction?: LeftFooterAction;\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n  note?: string | React.ReactNode;\n  state?: string;\n  icon?: React.ReactNode;\n  zIndex?: number;\n  contentOverflow?: string;\n  width?: string;\n  hasContentBorders?: boolean;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  topImageWithFallbacksProps,\n  topImageGrayscale,\n  buttons,\n  leftFooterAction,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n  children,\n  note,\n  state,\n  icon,\n  zIndex,\n  contentOverflow,\n  width,\n  hasContentBorders,\n}) => {\n  const getMinWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '320px';\n      case Size.Large:\n        return '640px';\n      case Size.Medium:\n      default:\n        return '480px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '480px';\n      case Size.Large:\n        return '720px';\n      case Size.Medium:\n      default:\n        return '640px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 160;\n      case Size.Medium:\n        return 200;\n      case Size.Large:\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px';\n      case Size.Medium:\n        return '24px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px 16px 8px';\n      case Size.Medium:\n        return '24px 24px 20px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const getMaxHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 'calc(100vh - 56px)';\n      case Size.Medium:\n        return 'calc(100vh - 76px)';\n      case Size.Large:\n        return 'calc(100vh - 96px)';\n      default:\n        return 'calc(100vh - 72px)';\n    }\n  };\n\n  const ModalTitle = (title: string | React.ReactNode, size?: Size) => {\n    if (typeof title === 'string') {\n      switch (size) {\n        case Size.Small:\n          return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n        case Size.Medium:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n        case Size.Large:\n          return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n        default:\n          return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      }\n    } else {\n      return title;\n    }\n  };\n\n  const ModalTootip = (tooltip: string) => {\n    return (\n      <ModalHoverModifier>\n        <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n            <Help size=\"24px\" color={COLORS.neutral_600} />\n          </IconButton>\n        </TooltipWrapper>\n      </ModalHoverModifier>\n    );\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage || !!topImageWithFallbacksProps} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  const getLeftActionIconElement = (icon: React.ReactNode) => {\n    return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n  };\n\n  const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n    const { text, actionType, disabled, icon, action } = leftFooterAction;\n    switch (actionType) {\n      case 'button':\n        return (\n          <Button\n            id={'left-action-button'}\n            type={(leftFooterAction as LeftFooterButton)?.type}\n            disabled={disabled}\n            loading={(leftFooterAction as LeftFooterButton)?.loading}\n            icon={icon}\n            size={size}\n            onClick={action}\n            variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n            style={{ order: -1, marginRight: 'auto' }}>\n            {text}\n          </Button>\n        );\n      case 'hyperlink':\n        return (\n          <HyperLink\n            id=\"left-action-hyperlink\"\n            className=\"footer-action\"\n            href={(leftFooterAction as LeftFooterHyperlink).href}\n            disabled={disabled}\n            variant=\"default\"\n            onClick={(e) => {\n              if (action) {\n                e.preventDefault();\n                action(e);\n              }\n            }}>\n            {icon && getLeftActionIconElement(icon)}\n            {text}\n          </HyperLink>\n        );\n      case 'note':\n        return (\n          <div className=\"footer-action note\">\n            {icon && getLeftActionIconElement(icon)}\n            <span>{text}</span>\n          </div>\n        );\n    }\n  };\n\n  return (\n    <ModalContainer\n      showModal={isModalOpen}\n      closeModal={closeModalAndClearInput}\n      minWidth={getMinWidth()}\n      maxWidth={getMaxWidth()}\n      height=\"auto\"\n      padding={getPadding()}\n      zIndex={zIndex}\n      width={width}>\n      <Column>\n        <form onSubmit={submitAction} style={{ display: 'flex', flexDirection: 'column', maxHeight: getMaxHeight() }}>\n          {(topImage || topImageWithFallbacksProps) && (\n            <StyledModalHeader size={size} $height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <ImageContainer $height={getImageHeight()}>\n                {topImageGrayscale && <ImageOverlay $height={getImageHeight()} />}\n                {topImage && <img src={topImage} alt=\"Modal top\" />}\n                {!topImage && topImageWithFallbacksProps && (\n                  <ImageWithFallbacks\n                    loader={topImageWithFallbacksProps.loader}\n                    alt={topImageWithFallbacksProps.alt}\n                    fallbacks={topImageWithFallbacksProps.fallbacks}\n                    src={topImageWithFallbacksProps.src}\n                  />\n                )}\n              </ImageContainer>\n              <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n                {ModalBackButton()}\n                {ModalCloseButton(closeAction)}\n              </ModalHeaderActionsWithImage>\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            <FlexContainer>\n              {!(topImage || topImageWithFallbacksProps) && ModalBackButton()}\n              {title && ModalTitle(title, size)}\n            </FlexContainer>\n            {(tooltip || !(topImage || topImageWithFallbacksProps)) && (\n              <ModalHeaderActions>\n                {tooltip && ModalTootip(tooltip)}\n                {!(topImage || topImageWithFallbacksProps) && ModalCloseButton(closeAction)}\n              </ModalHeaderActions>\n            )}\n          </ModalTitleSection>\n\n          <ModalBody size={size} overflow={contentOverflow} hasContentBorders={hasContentBorders}>\n            {children}\n          </ModalBody>\n\n          {note && <ModalNote note={note} state={state} size={size} icon={icon} />}\n\n          <ModalFooter size={size}>\n            {leftFooterAction && LeftFooterAction(leftFooterAction)}\n            {buttons?.map((b, i) => (\n              <Button key={b.id || i} icon={b.icon} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n                {b.text}\n              </Button>\n            ))}\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"mappings":"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"}

package/dist/Modals/ModalDialog.d.ts

@@ -5,6 +5,7 @@ import { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';
 interface NewModalProps {
     size?: Size;
     isModalOpen: boolean;
+    children?: React.ReactNode;
     closeModalAndClearInput: any;
     title?: string | React.ReactNode;
     topImage?: any;

package/dist/Modals/ModalDialog.js

@@ -355,6 +355,7 @@ export var ModalDialog = function ModalDialog(_ref) {
 };
 ModalDialog.propTypes = {
   isModalOpen: _pt.bool.isRequired,
+  children: _pt.node,
   closeModalAndClearInput: _pt.any.isRequired,
   title: _pt.oneOfType([_pt.string, _pt.node]),
   topImage: _pt.any,