@laerdal/life-react-components 3.1.1 → 3.1.3-dev.1

package/dist/Button/Button.cjs

@@ -109,25 +109,25 @@ var ButtonSecondaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(
   return (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? _styles.COLORS.primary_700 : _styles.COLORS.neutral_100;
 });
 exports.ButtonSecondaryStyled = ButtonSecondaryStyled;
-var ButtonTertiaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    padding: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: white !important;\n    color: ", ";\n    border-color: transparent !important;\n  }\n"])), function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary_500;
+var ButtonTertiaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    padding: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent !important;\n    color: ", ";\n    border-color: transparent !important;\n  }\n"])), function (props) {
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.primary;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.white;
 }, function (props) {
   return props.size === _types.Size.Large ? '12px 16px' : props.size === _types.Size.Small ? '4px 8px' : '6px 12px';
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_20 : _styles.COLORS.primary_20;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_20 : _styles.COLORS.primary_700;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.primary_700;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.primary_700;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_100 : _styles.COLORS.primary_100;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_100 : _styles.COLORS.primary_600;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.primary_800;
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.primary_800;
-}, _styles.COLORS.neutral_300);
+  return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.white;
+}, _styles.COLORS.primary_700);
 exports.ButtonTertiaryStyled = ButtonTertiaryStyled;
 var ButtonPositiveStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  div.button-content {\n    color: white;\n    background-color: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n"])), _styles.COLORS.correct_500, _styles.COLORS.correct_700, _styles.COLORS.correct_800, _styles.COLORS.neutral_100, _styles.COLORS.neutral_300);
 exports.ButtonPositiveStyled = ButtonPositiveStyled;

package/dist/Button/Button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.cjs","names":["getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","styled","button","props","size","Size","Large","ComponentLStyling","ComponentTextStyle","Bold","colorTheme","COLORS","primary_800","white","Small","ComponentSStyling","ComponentMStyling","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","invertedFocusStyles","focusStyles","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","primary_500","accent1_20","primary_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","React","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","defaultOnMouseDownHandler","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n  switch (flatEdge) {\n    case 'left':\n      return `0px ${radius}px ${radius}px 0px`;\n\n    case 'right':\n      return `${radius}px 0px 0px ${radius}px`;\n\n    case 'none':\n    default:\n      return `${radius}px`;\n  }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  box-sizing: border-box;\n  min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n  &.loading-state {\n    cursor: wait;\n  }\n  div.button-content {\n    ${(props) =>\n      props.size === Size.Large\n        ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : props.size === Size.Small\n        ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n    width: ${(props) => props.width};\n    position: relative;\n\n    min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n    min-width: ${(props) => props.minWidth};\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n    span.icon:not(.loading) {\n      pointer-events: none;\n    }\n\n    span.loading {\n      opacity: 0;\n    }\n\n    .icon {\n      margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n      width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      svg {\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n      }\n    }\n\n    .label {\n      margin: 0 4px;\n    }\n\n    div {\n      position: absolute;\n      width: 100%;\n      svg {\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        path {\n          fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n  }\n\n  &:focus,\n  &.focus-state {\n    ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n  }\n  &:disabled,\n  &.disabled-state {\n    cursor: not-allowed;\n  }\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    pointer-events: none;\n    background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n    color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n  }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n    }\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    \n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent;\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n  }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n    }\n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: white !important;\n    color: ${COLORS.neutral_300};\n    border-color: transparent !important;\n  }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.correct_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.correct_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.correct_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};\n  }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.critical_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.critical_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.critical_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};    \n  }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  role?: 'button' | string;\n  title?: string;\n  size?: Size;\n  colorTheme?: 'teal' | 'dark';\n  invertFocus?: boolean;\n  width?: 'auto' | string;\n  loading?: boolean;\n  testId?: string;\n  icon?: React.ReactNode;\n  minWidth?: string;\n  iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n    // Let's filter out properties that we don't need to render.\n    const { loading, ...renderProps } = props;\n\n    const renderContent = () => (\n      <>\n        {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n        {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n        {loading && <LoadingIndicator />}\n      </>\n    );\n\n    let ButtonStyled = ButtonPrimaryStyled;\n    switch (variant) {\n      case 'secondary':\n        ButtonStyled = ButtonSecondaryStyled;\n        break;\n      case 'tertiary':\n        ButtonStyled = ButtonTertiaryStyled;\n        break;\n      case 'positive':\n        ButtonStyled = ButtonPositiveStyled;\n        break;\n      case 'critical':\n        ButtonStyled = ButtonCriticalStyled;\n        break;\n    }\n\n    return (\n      <ButtonStyled\n        {...renderProps}\n        ref={ref}\n        disabled={disabled}\n        iconOnly={!children}\n        type={type}\n        size={size}\n        flatEdge={flatEdge}\n        width={width}\n        minWidth={minWidth}\n        data-testid={testId}\n        className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n        onMouseDown={defaultOnMouseDownHandler}>\n        <div className=\"button-content\">{renderContent()}</div>\n      </ButtonStyled>\n    );\n  },\n);\n\nexport default Button;\n"],"mappings":"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"}
+{"version":3,"file":"Button.cjs","names":["getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","styled","button","props","size","Size","Large","ComponentLStyling","ComponentTextStyle","Bold","colorTheme","COLORS","primary_800","white","Small","ComponentSStyling","ComponentMStyling","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","invertedFocusStyles","focusStyles","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","accent1_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","React","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","defaultOnMouseDownHandler","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n  switch (flatEdge) {\n    case 'left':\n      return `0px ${radius}px ${radius}px 0px`;\n\n    case 'right':\n      return `${radius}px 0px 0px ${radius}px`;\n\n    case 'none':\n    default:\n      return `${radius}px`;\n  }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  box-sizing: border-box;\n  min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n  &.loading-state {\n    cursor: wait;\n  }\n  div.button-content {\n    ${(props) =>\n      props.size === Size.Large\n        ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : props.size === Size.Small\n        ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n    width: ${(props) => props.width};\n    position: relative;\n\n    min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n    min-width: ${(props) => props.minWidth};\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n    span.icon:not(.loading) {\n      pointer-events: none;\n    }\n\n    span.loading {\n      opacity: 0;\n    }\n\n    .icon {\n      margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n      width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      svg {\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n      }\n    }\n\n    .label {\n      margin: 0 4px;\n    }\n\n    div {\n      position: absolute;\n      width: 100%;\n      svg {\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        path {\n          fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n  }\n\n  &:focus,\n  &.focus-state {\n    ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n  }\n  &:disabled,\n  &.disabled-state {\n    cursor: not-allowed;\n  }\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    pointer-events: none;\n    background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n    color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n  }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n    }\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    \n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent;\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n  }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n    }\n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_700)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_600)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent !important;\n    color: ${COLORS.primary_700};\n    border-color: transparent !important;\n  }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.correct_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.correct_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.correct_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};\n  }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.critical_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.critical_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.critical_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};    \n  }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  role?: 'button' | string;\n  title?: string;\n  size?: Size;\n  colorTheme?: 'teal' | 'dark';\n  invertFocus?: boolean;\n  width?: 'auto' | string;\n  loading?: boolean;\n  testId?: string;\n  icon?: React.ReactNode;\n  minWidth?: string;\n  iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n    // Let's filter out properties that we don't need to render.\n    const { loading, ...renderProps } = props;\n\n    const renderContent = () => (\n      <>\n        {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n        {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n        {loading && <LoadingIndicator />}\n      </>\n    );\n\n    let ButtonStyled = ButtonPrimaryStyled;\n    switch (variant) {\n      case 'secondary':\n        ButtonStyled = ButtonSecondaryStyled;\n        break;\n      case 'tertiary':\n        ButtonStyled = ButtonTertiaryStyled;\n        break;\n      case 'positive':\n        ButtonStyled = ButtonPositiveStyled;\n        break;\n      case 'critical':\n        ButtonStyled = ButtonCriticalStyled;\n        break;\n    }\n\n    return (\n      <ButtonStyled\n        {...renderProps}\n        ref={ref}\n        disabled={disabled}\n        iconOnly={!children}\n        type={type}\n        size={size}\n        flatEdge={flatEdge}\n        width={width}\n        minWidth={minWidth}\n        data-testid={testId}\n        className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n        onMouseDown={defaultOnMouseDownHandler}>\n        <div className=\"button-content\">{renderContent()}</div>\n      </ButtonStyled>\n    );\n  },\n);\n\nexport default Button;\n"],"mappings":"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"}

package/dist/Button/Button.js

@@ -100,25 +100,25 @@ export var ButtonSecondaryStyled = styled(ButtonPrimaryStyled)(_templateObject2
 }, function (props) {
   return (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? COLORS.primary_700 : COLORS.neutral_100;
 });
-export var ButtonTertiaryStyled = styled(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    padding: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: white !important;\n    color: ", ";\n    border-color: transparent !important;\n  }\n"])), function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500;
+export var ButtonTertiaryStyled = styled(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  div.button-content {\n    color: ", ";\n    background-color: transparent;\n    div svg path {\n      fill: ", ";\n    }\n    padding: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n    div {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent !important;\n    color: ", ";\n    border-color: transparent !important;\n  }\n"])), function (props) {
+  return props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary;
+  return props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white;
 }, function (props) {
   return props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px';
 }, function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20;
+  return props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_700;
 }, function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700;
+  return props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700;
+  return props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100;
+  return props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_600;
 }, function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800;
+  return props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white;
 }, function (props) {
-  return props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800;
-}, COLORS.neutral_300);
+  return props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white;
+}, COLORS.primary_700);
 export var ButtonPositiveStyled = styled(ButtonPrimaryStyled)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  div.button-content {\n    color: white;\n    background-color: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ", ";\n    color: ", ";\n  }\n"])), COLORS.correct_500, COLORS.correct_700, COLORS.correct_800, COLORS.neutral_100, COLORS.neutral_300);
 export var ButtonCriticalStyled = styled(ButtonPrimaryStyled)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  div.button-content {\n    color: white;\n    background-color: ", ";\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ", ";\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ", ";\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ", ";\n    color: ", ";    \n  }\n"])), COLORS.critical_500, COLORS.critical_700, COLORS.critical_800, COLORS.neutral_100, COLORS.neutral_300);
 var Button = /*#__PURE__*/React.forwardRef(function (_ref, ref) {

package/dist/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":["React","styled","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","button","props","size","Large","Bold","colorTheme","primary_800","white","Small","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","primary_500","accent1_20","primary_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n  switch (flatEdge) {\n    case 'left':\n      return `0px ${radius}px ${radius}px 0px`;\n\n    case 'right':\n      return `${radius}px 0px 0px ${radius}px`;\n\n    case 'none':\n    default:\n      return `${radius}px`;\n  }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  box-sizing: border-box;\n  min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n  &.loading-state {\n    cursor: wait;\n  }\n  div.button-content {\n    ${(props) =>\n      props.size === Size.Large\n        ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : props.size === Size.Small\n        ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n    width: ${(props) => props.width};\n    position: relative;\n\n    min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n    min-width: ${(props) => props.minWidth};\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n    span.icon:not(.loading) {\n      pointer-events: none;\n    }\n\n    span.loading {\n      opacity: 0;\n    }\n\n    .icon {\n      margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n      width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      svg {\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n      }\n    }\n\n    .label {\n      margin: 0 4px;\n    }\n\n    div {\n      position: absolute;\n      width: 100%;\n      svg {\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        path {\n          fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n  }\n\n  &:focus,\n  &.focus-state {\n    ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n  }\n  &:disabled,\n  &.disabled-state {\n    cursor: not-allowed;\n  }\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    pointer-events: none;\n    background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n    color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n  }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n    }\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    \n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent;\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n  }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary_500)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n    }\n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_20)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_100)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.primary_800)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: white !important;\n    color: ${COLORS.neutral_300};\n    border-color: transparent !important;\n  }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.correct_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.correct_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.correct_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};\n  }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.critical_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.critical_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.critical_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};    \n  }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  role?: 'button' | string;\n  title?: string;\n  size?: Size;\n  colorTheme?: 'teal' | 'dark';\n  invertFocus?: boolean;\n  width?: 'auto' | string;\n  loading?: boolean;\n  testId?: string;\n  icon?: React.ReactNode;\n  minWidth?: string;\n  iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n    // Let's filter out properties that we don't need to render.\n    const { loading, ...renderProps } = props;\n\n    const renderContent = () => (\n      <>\n        {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n        {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n        {loading && <LoadingIndicator />}\n      </>\n    );\n\n    let ButtonStyled = ButtonPrimaryStyled;\n    switch (variant) {\n      case 'secondary':\n        ButtonStyled = ButtonSecondaryStyled;\n        break;\n      case 'tertiary':\n        ButtonStyled = ButtonTertiaryStyled;\n        break;\n      case 'positive':\n        ButtonStyled = ButtonPositiveStyled;\n        break;\n      case 'critical':\n        ButtonStyled = ButtonCriticalStyled;\n        break;\n    }\n\n    return (\n      <ButtonStyled\n        {...renderProps}\n        ref={ref}\n        disabled={disabled}\n        iconOnly={!children}\n        type={type}\n        size={size}\n        flatEdge={flatEdge}\n        width={width}\n        minWidth={minWidth}\n        data-testid={testId}\n        className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n        onMouseDown={defaultOnMouseDownHandler}>\n        <div className=\"button-content\">{renderContent()}</div>\n      </ButtonStyled>\n    );\n  },\n);\n\nexport default Button;\n"],"mappings":"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"}
+{"version":3,"file":"Button.js","names":["React","styled","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","button","props","size","Large","Bold","colorTheme","primary_800","white","Small","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","accent1_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n  switch (flatEdge) {\n    case 'left':\n      return `0px ${radius}px ${radius}px 0px`;\n\n    case 'right':\n      return `${radius}px 0px 0px ${radius}px`;\n\n    case 'none':\n    default:\n      return `${radius}px`;\n  }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  padding: 0;\n  margin: 0;\n  position: relative;\n  box-sizing: border-box;\n  min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n  &.loading-state {\n    cursor: wait;\n  }\n  div.button-content {\n    ${(props) =>\n      props.size === Size.Large\n        ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : props.size === Size.Small\n        ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n        : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n    width: ${(props) => props.width};\n    position: relative;\n\n    min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n    min-width: ${(props) => props.minWidth};\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n    span.icon:not(.loading) {\n      pointer-events: none;\n    }\n\n    span.loading {\n      opacity: 0;\n    }\n\n    .icon {\n      margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n      width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n      svg {\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n      }\n    }\n\n    .label {\n      margin: 0 4px;\n    }\n\n    div {\n      position: absolute;\n      width: 100%;\n      svg {\n        height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n        path {\n          fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n  }\n\n  &:focus,\n  &.focus-state {\n    ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n  }\n  &:disabled,\n  &.disabled-state {\n    cursor: not-allowed;\n  }\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    pointer-events: none;\n    background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n    color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n  }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n    }\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n    \n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n    \n    background-color: transparent;\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent;\n    color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n    box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n  }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n    background-color: transparent;\n    div svg path {\n      fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n    }\n    padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_700)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n        }\n      }\n    }\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_600)};\n    color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n    div {\n      svg {\n        path {\n          fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n        }\n      }\n    }\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: transparent !important;\n    color: ${COLORS.primary_700};\n    border-color: transparent !important;\n  }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.correct_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.correct_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.correct_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};\n  }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n  div.button-content {\n    color: white;\n    background-color: ${COLORS.critical_500};\n  }\n  &:hover > div.button-content,\n  &.hover-state > div.button-content {\n    background-color: ${COLORS.critical_700};\n  }\n  &:active > div.button-content,\n  &.active-state > div.button-content {\n    background-color: ${COLORS.critical_800};\n  }\n\n  &:disabled > div.button-content,\n  &.disabled-state > div.button-content {\n    background-color: ${COLORS.neutral_100};\n    color: ${COLORS.neutral_300};    \n  }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  role?: 'button' | string;\n  title?: string;\n  size?: Size;\n  colorTheme?: 'teal' | 'dark';\n  invertFocus?: boolean;\n  width?: 'auto' | string;\n  loading?: boolean;\n  testId?: string;\n  icon?: React.ReactNode;\n  minWidth?: string;\n  iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n    // Let's filter out properties that we don't need to render.\n    const { loading, ...renderProps } = props;\n\n    const renderContent = () => (\n      <>\n        {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n        {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n        {loading && <LoadingIndicator />}\n      </>\n    );\n\n    let ButtonStyled = ButtonPrimaryStyled;\n    switch (variant) {\n      case 'secondary':\n        ButtonStyled = ButtonSecondaryStyled;\n        break;\n      case 'tertiary':\n        ButtonStyled = ButtonTertiaryStyled;\n        break;\n      case 'positive':\n        ButtonStyled = ButtonPositiveStyled;\n        break;\n      case 'critical':\n        ButtonStyled = ButtonCriticalStyled;\n        break;\n    }\n\n    return (\n      <ButtonStyled\n        {...renderProps}\n        ref={ref}\n        disabled={disabled}\n        iconOnly={!children}\n        type={type}\n        size={size}\n        flatEdge={flatEdge}\n        width={width}\n        minWidth={minWidth}\n        data-testid={testId}\n        className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n        onMouseDown={defaultOnMouseDownHandler}>\n        <div className=\"button-content\">{renderContent()}</div>\n      </ButtonStyled>\n    );\n  },\n);\n\nexport default Button;\n"],"mappings":"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"}

package/dist/Dropdown/BasicDropdown.cjs

@@ -21,7 +21,7 @@ var _TooltipOverflow = _interopRequireDefault(require("../Tooltips/TooltipOverfl
 var _types = require("../types");
 var _common = require("../common");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["id", "list", "placeholder", "messageOnNoResults", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "actionDisabled", "pinTopItem", "scrollable", "maxHeight", "disabled", "readOnly", "isButton", "activeValidationMessage", "autofilledMessage", "size", "margin", "minWidth", "className", "overflowTooltipPosition", "onBlur", "dataTestId", "onSelect", "textOverflow"];
+var _excluded = ["id", "list", "placeholder", "messageOnNoResults", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "actionDisabled", "pinTopItem", "scrollable", "maxHeight", "disabled", "readOnly", "isButton", "activeValidationMessage", "autofilledMessage", "size", "margin", "minWidth", "className", "onBlur", "dataTestId", "onSelect", "textOverflow"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -52,7 +52,6 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     margin = props.margin,
     minWidth = props.minWidth,
     className = props.className,
-    overflowTooltipPosition = props.overflowTooltipPosition,
     onBlur = props.onBlur,
     dataTestId = props.dataTestId,
     onSelect = props.onSelect,
@@ -212,12 +211,12 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
           tabIndex: -1,
           disabled: disabled || false
         }), !isOpen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipOverflow.default, {
-          position: overflowTooltipPosition,
           input: inputRef,
           withArrow: true,
           maxWidth: "100%",
           size: size,
           align: "end",
+          position: "bottom",
           children: getDisplayItems()
         }) : null, isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingIndicator.LoadingIndicator, {
           size: _types.Size.Small,
@@ -282,7 +281,7 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     })]
   });
 });
-BasicDropdown.propTypes = {
+BasicDropdown.propTypes = (0, _defineProperty2.default)({
   list: _propTypes.default.array.isRequired,
   itemsType: _propTypes.default.oneOf(['normal', 'checkbox', 'radio']),
   action: _propTypes.default.func,
@@ -304,11 +303,10 @@ BasicDropdown.propTypes = {
   margin: _propTypes.default.string,
   minWidth: _propTypes.default.string,
   textOverflow: _propTypes.default.oneOf(['ellipsis', 'default']),
-  overflowTooltipPosition: _propTypes.default.oneOf(['top', 'bottom']),
   multiSelect: _propTypes.default.oneOf([false]),
   value: _propTypes.default.string,
   onSelect: _propTypes.default.func.isRequired
-};
+}, "list", _propTypes.default.array.isRequired);
 var _default = BasicDropdown;
 exports.default = _default;
 //# sourceMappingURL=BasicDropdown.cjs.map

package/dist/Dropdown/BasicDropdown.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BasicDropdown.cjs","names":["BasicDropdown","React","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","overflowTooltipPosition","onBlur","dataTestId","onSelect","textOverflow","rest","useState","isOpen","setIsOpen","activeDescendant","setActiveDescendant","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","useFocusVisibleRef","dropdownRef","resetDropdown","containerRef","useFocusOutsideRef","useClickOutsideRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","defaultOnMouseDownHandler","stopPropagation","blur","Size","Small","COLORS","neutral_600","onValueUpdate","items","critical_400","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {SystemIcons} from '../icons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {DropdownContainer, DropdownInputFieldStyles, DropdownInputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {AutofilledMessage, ErrorMessage} from '../InputFields';\nimport TooltipOverflow from '../Tooltips/TooltipOverflow';\nimport {Size, Testable} from '../types';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\nimport {useFocusOutsideRef} from '../common';\n\nexport interface BasicDropdownCommonProps extends Testable, Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\n  list: DropdownItem[];\n  itemsType?: 'normal' | 'checkbox' | 'radio';\n  action?: () => void;\n  actionLabel?: string;\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n  actionIcon?: React.ReactNode;\n  actionLoading?: boolean;\n  actionDisabled?: boolean;\n  pinTopItem?: boolean;\n  scrollable?: boolean;\n  maxHeight?: string;\n  placeholder?: string;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  minWidth?: string;\n  textOverflow?: 'ellipsis' | 'default';\n  overflowTooltipPosition?: 'top' | 'bottom';\n}\n\nexport type BasicDropdownMultiSelectProps = BasicDropdownCommonProps & {\n  multiSelect: true;\n  value?: string[];\n  onSelect: (value: string[]) => void;\n}\n\nexport type BasucDropdownSingleSelectProps = BasicDropdownCommonProps & {\n  multiSelect?: false;\n  value?: string;\n  onSelect: (value: string) => void;\n}\n\nexport type BasicDropdownProps = BasucDropdownSingleSelectProps | BasicDropdownMultiSelectProps;\n\nconst BasicDropdown = React.forwardRef((props: BasicDropdownProps, ref) => {\n  const {\n    id,\n    list,\n    placeholder,\n    messageOnNoResults,\n    itemsType = 'normal',\n    action,\n    actionLabel,\n    actionVariant,\n    actionIcon,\n    actionLoading,\n    actionDisabled,\n    pinTopItem,\n    scrollable = true,\n    maxHeight,\n    disabled,\n    readOnly,\n    isButton,\n    activeValidationMessage,\n    autofilledMessage,\n    size,\n    margin,\n    minWidth,\n    className,\n    overflowTooltipPosition,\n    onBlur,\n    dataTestId,\n    onSelect,\n    textOverflow = 'ellipsis',\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>('');\n  const [focused, setFocused] = React.useState<number | null>(null);\n  \n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const resetDropdown = () => {\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\n\n  useClickOutsideRef(resetDropdown, [], containerRef);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      setIsOpen(!isOpen);\n      setKeyboardNavigated(true);\n    }\n  };\n\n  const handleValueSelect = (values: string[]) => {\n    setInput(values.join(', '));\n\n    if (props.multiSelect === true) {\n      props.onSelect(values);\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\n      props.onSelect(values[0]);\n    }\n\n    //don't close dropdown on item select if have custom action or multiselect\n    if (actionLabel || props.multiSelect) return;\n\n    if (keyboardNavigated) {\n      styledFieldRef.current?.focus({focusVisible: true} as any);\n    }\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  React.useEffect(() => {\n    if (props.value) {\n      if (props.multiSelect) {\n        setInput(props.value.join(', '));\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\n        setInput(props.value);\n      }\n    } else {\n      setInput('');\n    }\n  }, [props.value, props.multiSelect]);\n\n  React.useEffect(() => {\n    setIsLoading(false);\n  }, [input]);\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const customSetIsOpen = (isOpen: boolean) => {\n    setIsOpen(isOpen);\n  };\n\n  const getDisplayItems = () => {\n    const values = input.split(',').map((val) => val.trim());\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\n    return listDisplayLabels.join(', ');\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n    // @ts-ignore\n    if (!e.currentTarget.contains(e.relatedTarget)) {\n      onBlur && onBlur(e);\n    }\n  };\n\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\n  \n  return (\n    <>\n      <DropdownContainer ref={containerRef}\n                aria-expanded={isOpen ? true : false}\n                aria-activedescendant={activeDescendant}\n                aria-controls={`${id}_dropdowncontent`}\n                role=\"listbox\"\n                aria-multiselectable={props.multiSelect}\n                isButton={isButton || false}\n                className={size ? size : ''}\n                readOnly={readOnly}\n                disabled={disabled}\n                margin={margin}\n                onBlur={handleBlur}\n                minWidth={minWidth}>\n        <DropdownInputFieldStyles\n          ref={styledFieldRef}\n          className={cls}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e) => {\n            if (!readOnly && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n              if (isOpen) {\n                inputRef.current?.blur();\n              } else {\n                inputRef.current?.focus();\n              }\n            }\n          }}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          readOnly={readOnly || false}\n          isPlaceholder={!input}\n          placeholder={placeholder}\n          showValidationMessage={!!activeValidationMessage}\n          onKeyDown={handleKeyDown}\n          minWidth={minWidth}\n          {...rest}>\n          <DropdownInputField\n            ref={inputRef}\n            type=\"search\"\n            ellipsis={textOverflow == 'ellipsis'}\n            id={id}\n            data-testid={dataTestId}\n            readOnly\n            placeholder={placeholder}\n            value={getDisplayItems()}\n            className={size ? `${size} value` : 'value'}\n            tabIndex={-1}\n            disabled={disabled || false}\n          />\n          {!isOpen ? <TooltipOverflow position={overflowTooltipPosition} input={inputRef} withArrow={true} maxWidth=\"100%\" size={size} align='end'>\n            {getDisplayItems()}\n        </TooltipOverflow> : null}\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/> : null}\n          <div className={'icon dropdown-arrow'}>\n            {isOpen ? <SystemIcons.ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n              <SystemIcons.ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n          </div>\n        </DropdownInputFieldStyles>\n        {!readOnly && !disabled && (\n          <DropdownContent\n            ref={dropdownRef}\n            containerRef={containerRef}\n            onActiveDescendantChanged={(id) => setActiveDescendant(id)}\n            customizationProps={{\n              itemsType: itemsType,\n              action: action ?? (() => {\n              }),\n              actionLabel: actionLabel,\n              actionVariant: actionVariant,\n              actionDisabled: actionDisabled,\n              scrollable: scrollable,\n              onValueUpdate: handleValueSelect,\n              items: list,\n              multiSelect: props.multiSelect,\n              pinTopItem: pinTopItem,\n              maxHeight: maxHeight,\n              actionIcon: actionIcon,\n              actionLoading: actionLoading,\n            }}\n            ariaRolesType=\"input\"\n            focused={focused}\n            setFocused={setFocused}\n            size={size ?? Size.Small}\n            filter={''}\n            isOpen={isOpen}\n            setIsOpen={customSetIsOpen}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            outline={keyboardNavigated}\n            isButton={isButton || false}\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\n            setSelectedValues={handleValueSelect}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </DropdownContainer>\n      {activeValidationMessage && (\n        <ErrorMessage>\n          <SystemIcons.TechnicalWarning color={COLORS.critical_400}/>\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage>\n          <SystemIcons.Information color={COLORS.neutral_600}/>\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default BasicDropdown;\n"],"mappings":"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"}
+{"version":3,"file":"BasicDropdown.cjs","names":["BasicDropdown","React","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","onBlur","dataTestId","onSelect","textOverflow","rest","useState","isOpen","setIsOpen","activeDescendant","setActiveDescendant","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","useFocusVisibleRef","dropdownRef","resetDropdown","containerRef","useFocusOutsideRef","useClickOutsideRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","defaultOnMouseDownHandler","stopPropagation","blur","Size","Small","COLORS","neutral_600","onValueUpdate","items","critical_400","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {SystemIcons} from '../icons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {DropdownContainer, DropdownInputFieldStyles, DropdownInputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {AutofilledMessage, ErrorMessage} from '../InputFields';\nimport TooltipOverflow from '../Tooltips/TooltipOverflow';\nimport {Size, Testable} from '../types';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\nimport {useFocusOutsideRef} from '../common';\n\nexport interface BasicDropdownCommonProps extends Testable, Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\n  list: DropdownItem[];\n  itemsType?: 'normal' | 'checkbox' | 'radio';\n  action?: () => void;\n  actionLabel?: string;\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n  actionIcon?: React.ReactNode;\n  actionLoading?: boolean;\n  actionDisabled?: boolean;\n  pinTopItem?: boolean;\n  scrollable?: boolean;\n  maxHeight?: string;\n  placeholder?: string;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  minWidth?: string;\n  textOverflow?: 'ellipsis' | 'default';\n}\n\nexport type BasicDropdownMultiSelectProps = BasicDropdownCommonProps & {\n  multiSelect: true;\n  value?: string[];\n  onSelect: (value: string[]) => void;\n}\n\nexport type BasucDropdownSingleSelectProps = BasicDropdownCommonProps & {\n  multiSelect?: false;\n  value?: string;\n  onSelect: (value: string) => void;\n}\n\nexport type BasicDropdownProps = BasucDropdownSingleSelectProps | BasicDropdownMultiSelectProps;\n\nconst BasicDropdown = React.forwardRef((props: BasicDropdownProps, ref) => {\n  const {\n    id,\n    list,\n    placeholder,\n    messageOnNoResults,\n    itemsType = 'normal',\n    action,\n    actionLabel,\n    actionVariant,\n    actionIcon,\n    actionLoading,\n    actionDisabled,\n    pinTopItem,\n    scrollable = true,\n    maxHeight,\n    disabled,\n    readOnly,\n    isButton,\n    activeValidationMessage,\n    autofilledMessage,\n    size,\n    margin,\n    minWidth,\n    className,\n    onBlur,\n    dataTestId,\n    onSelect,\n    textOverflow = 'ellipsis',\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>('');\n  const [focused, setFocused] = React.useState<number | null>(null);\n  \n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const resetDropdown = () => {\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\n\n  useClickOutsideRef(resetDropdown, [], containerRef);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      setIsOpen(!isOpen);\n      setKeyboardNavigated(true);\n    }\n  };\n\n  const handleValueSelect = (values: string[]) => {\n    setInput(values.join(', '));\n\n    if (props.multiSelect === true) {\n      props.onSelect(values);\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\n      props.onSelect(values[0]);\n    }\n\n    //don't close dropdown on item select if have custom action or multiselect\n    if (actionLabel || props.multiSelect) return;\n\n    if (keyboardNavigated) {\n      styledFieldRef.current?.focus({focusVisible: true} as any);\n    }\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  React.useEffect(() => {\n    if (props.value) {\n      if (props.multiSelect) {\n        setInput(props.value.join(', '));\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\n        setInput(props.value);\n      }\n    } else {\n      setInput('');\n    }\n  }, [props.value, props.multiSelect]);\n\n  React.useEffect(() => {\n    setIsLoading(false);\n  }, [input]);\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const customSetIsOpen = (isOpen: boolean) => {\n    setIsOpen(isOpen);\n  };\n\n  const getDisplayItems = () => {\n    const values = input.split(',').map((val) => val.trim());\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\n    return listDisplayLabels.join(', ');\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n    // @ts-ignore\n    if (!e.currentTarget.contains(e.relatedTarget)) {\n      onBlur && onBlur(e);\n    }\n  };\n\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\n  \n  return (\n    <>\n      <DropdownContainer ref={containerRef}\n                aria-expanded={isOpen ? true : false}\n                aria-activedescendant={activeDescendant}\n                aria-controls={`${id}_dropdowncontent`}\n                role=\"listbox\"\n                aria-multiselectable={props.multiSelect}\n                isButton={isButton || false}\n                className={size ? size : ''}\n                readOnly={readOnly}\n                disabled={disabled}\n                margin={margin}\n                onBlur={handleBlur}\n                minWidth={minWidth}>\n        <DropdownInputFieldStyles\n          ref={styledFieldRef}\n          className={cls}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e) => {\n            if (!readOnly && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n              if (isOpen) {\n                inputRef.current?.blur();\n              } else {\n                inputRef.current?.focus();\n              }\n            }\n          }}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          readOnly={readOnly || false}\n          isPlaceholder={!input}\n          placeholder={placeholder}\n          showValidationMessage={!!activeValidationMessage}\n          onKeyDown={handleKeyDown}\n          minWidth={minWidth}\n          {...rest}>\n          <DropdownInputField\n            ref={inputRef}\n            type=\"search\"\n            ellipsis={textOverflow == 'ellipsis'}\n            id={id}\n            data-testid={dataTestId}\n            readOnly\n            placeholder={placeholder}\n            value={getDisplayItems()}\n            className={size ? `${size} value` : 'value'}\n            tabIndex={-1}\n            disabled={disabled || false}\n          />\n          {!isOpen ? <TooltipOverflow input={inputRef} withArrow={true} maxWidth=\"100%\" size={size} align='end' position='bottom'>\n            {getDisplayItems()}\n        </TooltipOverflow> : null}\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/> : null}\n          <div className={'icon dropdown-arrow'}>\n            {isOpen ? <SystemIcons.ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n              <SystemIcons.ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n          </div>\n        </DropdownInputFieldStyles>\n        {!readOnly && !disabled && (\n          <DropdownContent\n            ref={dropdownRef}\n            containerRef={containerRef}\n            onActiveDescendantChanged={(id) => setActiveDescendant(id)}\n            customizationProps={{\n              itemsType: itemsType,\n              action: action ?? (() => {\n              }),\n              actionLabel: actionLabel,\n              actionVariant: actionVariant,\n              actionDisabled: actionDisabled,\n              scrollable: scrollable,\n              onValueUpdate: handleValueSelect,\n              items: list,\n              multiSelect: props.multiSelect,\n              pinTopItem: pinTopItem,\n              maxHeight: maxHeight,\n              actionIcon: actionIcon,\n              actionLoading: actionLoading,\n            }}\n            ariaRolesType=\"input\"\n            focused={focused}\n            setFocused={setFocused}\n            size={size ?? Size.Small}\n            filter={''}\n            isOpen={isOpen}\n            setIsOpen={customSetIsOpen}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            outline={keyboardNavigated}\n            isButton={isButton || false}\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\n            setSelectedValues={handleValueSelect}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </DropdownContainer>\n      {activeValidationMessage && (\n        <ErrorMessage>\n          <SystemIcons.TechnicalWarning color={COLORS.critical_400}/>\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage>\n          <SystemIcons.Information color={COLORS.neutral_600}/>\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default BasicDropdown;\n"],"mappings":"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"}

package/dist/Dropdown/BasicDropdown.d.ts

@@ -25,7 +25,6 @@ export interface BasicDropdownCommonProps extends Testable, Omit<React.HTMLAttri
     margin?: string;
     minWidth?: string;
     textOverflow?: 'ellipsis' | 'default';
-    overflowTooltipPosition?: 'top' | 'bottom';
 }
 export type BasicDropdownMultiSelectProps = BasicDropdownCommonProps & {
     multiSelect: true;

package/dist/Dropdown/BasicDropdown.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _pt from "prop-types";
-var _excluded = ["id", "list", "placeholder", "messageOnNoResults", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "actionDisabled", "pinTopItem", "scrollable", "maxHeight", "disabled", "readOnly", "isButton", "activeValidationMessage", "autofilledMessage", "size", "margin", "minWidth", "className", "overflowTooltipPosition", "onBlur", "dataTestId", "onSelect", "textOverflow"];
+var _excluded = ["id", "list", "placeholder", "messageOnNoResults", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "actionDisabled", "pinTopItem", "scrollable", "maxHeight", "disabled", "readOnly", "isButton", "activeValidationMessage", "autofilledMessage", "size", "margin", "minWidth", "className", "onBlur", "dataTestId", "onSelect", "textOverflow"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import * as React from 'react';
@@ -45,7 +45,6 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     margin = props.margin,
     minWidth = props.minWidth,
     className = props.className,
-    overflowTooltipPosition = props.overflowTooltipPosition,
     onBlur = props.onBlur,
     dataTestId = props.dataTestId,
     onSelect = props.onSelect,
@@ -205,12 +204,12 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
           tabIndex: -1,
           disabled: disabled || false
         }), !isOpen ? /*#__PURE__*/_jsx(TooltipOverflow, {
-          position: overflowTooltipPosition,
           input: inputRef,
           withArrow: true,
           maxWidth: "100%",
           size: size,
           align: "end",
+          position: "bottom",
           children: getDisplayItems()
         }) : null, isLoading ? /*#__PURE__*/_jsx(LoadingIndicator, {
           size: Size.Small,
@@ -275,7 +274,7 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
     })]
   });
 });
-BasicDropdown.propTypes = {
+BasicDropdown.propTypes = _defineProperty({
   list: _pt.array.isRequired,
   itemsType: _pt.oneOf(['normal', 'checkbox', 'radio']),
   action: _pt.func,
@@ -297,10 +296,9 @@ BasicDropdown.propTypes = {
   margin: _pt.string,
   minWidth: _pt.string,
   textOverflow: _pt.oneOf(['ellipsis', 'default']),
-  overflowTooltipPosition: _pt.oneOf(['top', 'bottom']),
   multiSelect: _pt.oneOf([false]),
   value: _pt.string,
   onSelect: _pt.func.isRequired
-};
+}, "list", _pt.array.isRequired);
 export default BasicDropdown;
 //# sourceMappingURL=BasicDropdown.js.map