@laerdal/life-react-components 3.5.3 → 3.6.0-dev.1.full

package/dist/Dropdown/CommonStyling.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommonStyling.js","names":["styled","css","CommonInteractionStyling","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","Z_INDEXES","TooltipTrigger","DropdownContainer","div","props","isButton","minWidth","readOnly","disabled","margin","focus","primary_600","primary_800","lockedState","neutral_100","neutral_300","neutral_600","disabledState","white","activeValidationMessage","critical_400","placeholderStyling","Italic","DropdownInputField","input","black","ellipsis","DropdownInputFieldStyles","Regular","neutral_400","MEDIUM","isPlaceholder","undefined","primary_200","primary_300","Bold","neutral_800","neutral_20","showValidationMessage","dropdown","DropdownContentButtonStyling","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextArrow","DropdownButtonTextStyles","DropdownButtonTextWrapper","primary_20","primary_700","primary_100"],"sources":["../../src/Dropdown/CommonStyling.tsx"],"sourcesContent":["import styled, {css} from 'styled-components';\r\nimport {CommonInteractionStyling} from '../common';\r\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\nimport {\r\n  ComponentMStyling,\r\n  ComponentSStyling,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../styles/typography';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\nimport { TooltipTrigger } from '../Tooltips/TooltipStyles';\r\n\r\nexport const DropdownContainer = styled.div<{ isButton: boolean; readOnly?: boolean; disabled?: boolean; margin?: string; minWidth?: string }>`\r\n  display: inline-block;\r\n\r\n  ${(props) => !props.isButton && (props?.minWidth ? `width: 100%; min-width: ${props.minWidth};` : 'width: 100%; min-width: 344px;')}\r\n  ${(props) => (props.readOnly || props.disabled ? 'cursor: not-allowed;' : '')}\r\n  ${(props) => (props.margin ? `margin: ${props.margin};` : 'margin-bottom: 4px;')}\r\n  .show {\r\n    display: block;\r\n  }\r\n\r\n  .value {\r\n    flex-grow: 1;\r\n  }\r\n\r\n  &:focus-within {\r\n    z-index: ${Z_INDEXES.focus};\r\n  }\r\n\r\n  input:hover + div {\r\n    color: ${COLORS.primary_600};\r\n  }\r\n\r\n  input:active + div {\r\n    color: ${COLORS.primary_800};\r\n  }\r\n\r\n\r\n`;\r\n\r\nconst lockedState = css`\r\n  background-color: ${COLORS.neutral_100};\r\n  box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_300};\r\n  color: ${COLORS.neutral_600};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  input {\r\n    color: ${COLORS.neutral_600} !important;\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    color: ${COLORS.neutral_300} !important;\r\n  }\r\n`;\r\n\r\nconst disabledState = css`\r\n  background-color: ${COLORS.white};\r\n  box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_100};\r\n  color: ${COLORS.neutral_300};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  .dropdown-arrow {\r\n    color: ${COLORS.neutral_300} !important;\r\n  }\r\n\r\n  input {\r\n    color: ${COLORS.neutral_300} !important;\r\n\r\n    ::placeholder {\r\n      color: ${COLORS.neutral_300} !important;\r\n    }\r\n  }\r\n`;\r\n\r\nconst activeValidationMessage = css`\r\n  box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\r\n`;\r\n\r\nconst placeholderStyling = css`\r\n  ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n`;\r\n\r\nexport const DropdownInputField = styled.input<{ellipsis?: boolean}>`\r\n  border: none;\r\n  outline: none;\r\n  background-color: inherit;\r\n  cursor: pointer;\r\n  min-width: 0px;\r\n  color: ${COLORS.black} !important;\r\n  padding: 0;\r\n  flex-grow: 1;\r\n  display: flex;\r\n  justify-content: center;\r\n  overflow: hidden;\r\n  ${props => props.ellipsis ? 'text-overflow: ellipsis;' : ''}\r\n  \r\n  ::placeholder {\r\n    color: ${COLORS.neutral_600};\r\n    font-style: italic;\r\n  }\r\n\r\n  ::-webkit-search-decoration,\r\n  ::-webkit-search-cancel-button,\r\n  ::-webkit-search-results-button,\r\n  ::-webkit-search-results-decoration {\r\n    -webkit-appearance: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownInputFieldStyles = styled.div<{ disabled: boolean; readOnly: boolean; showValidationMessage?: boolean; isPlaceholder?: boolean; fontSize?: string; minWidth?: string }>`\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n\r\n  padding: 12px 16px;\r\n  height: 48px;\r\n  min-width: ${(props) => (props.minWidth ? `${props.minWidth}` : '344px')};\r\n  width: 100%;\r\n\r\n  background: ${COLORS.white};\r\n  box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_400};\r\n  box-sizing: border-box;\r\n  border-radius: 4px;\r\n  cursor: pointer;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  position: relative;\r\n\r\n  input {\r\n    font-size: inherit;\r\n    line-height: inherit;\r\n    color: inherit;\r\n  }\r\n\r\n  ${TooltipTrigger('hover')}\r\n\r\n  &::placeholder {\r\n    ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 16px;\r\n    height: 56px;\r\n\r\n    &::placeholder {\r\n      ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 12px 16px;\r\n    height: 48px;\r\n\r\n    &::placeholder {\r\n      ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    height: 56px;\r\n    padding: 16px;\r\n\r\n    &::placeholder {\r\n      ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\r\n    }\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    pointer-events: none;\r\n    width: 24px;\r\n    height: 24px;\r\n    color: ${(props) => props.isPlaceholder ? COLORS.neutral_600 : undefined};\r\n  }\r\n\r\n  &:focus {\r\n    outline: 3px solid #ddd;\r\n  }\r\n\r\n  &:focus-within,\r\n  &.focus-visible-within {\r\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\r\n  }\r\n\r\n  &:hover:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_200};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${COLORS.primary_600};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${COLORS.primary_600};\r\n    }\r\n\r\n    cursor: pointer;\r\n  }\r\n\r\n  &:active:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_300};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${COLORS.primary_800};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${COLORS.primary_800};\r\n    }\r\n  }\r\n\r\n  &.button {\r\n    ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.disabled ? COLORS.neutral_300 : COLORS.neutral_600)}\r\n\r\n    box-sizing: border-box;\r\n    height: 32px;\r\n    padding: 0 8px;\r\n    width: initial;\r\n    min-width: initial;\r\n    border: none !important;\r\n    box-shadow: none;\r\n    border-radius: 4px;\r\n\r\n    &.expanded {\r\n      color: ${COLORS.neutral_800};\r\n      background: ${COLORS.neutral_20};\r\n    }\r\n  }\r\n\r\n\r\n  ${(props) => (props.disabled ? disabledState : '')}\r\n  ${(props) => (props.readOnly ? lockedState : '')}\r\n  ${(props) => (props.showValidationMessage ? activeValidationMessage : '')}\r\n  ${(props) => (props.isPlaceholder ? placeholderStyling : '')}\r\n\r\n  ${CommonInteractionStyling};\r\n\r\n  &.focus-visible,\r\n  &.focus-visible-within {\r\n    z-index: ${Z_INDEXES.dropdown + 1} !important;\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const DropdownContentButtonStyling = css`\r\n  min-width: 344px;\r\n`;\r\n\r\n\r\n\r\nexport const DropdownButtonTextContent = styled.div`\r\n  display: flex;\r\n  gap: 4px;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  min-width: 64px;\r\n  min-height: 32px;\r\n  padding: 4px 8px;\r\n  border-radius: 4px;\r\n`;\r\n\r\nexport const DropdownButtonTextIcon = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n`;\r\n\r\nexport const DropdownButtonTextArrow = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n\r\n  svg {\r\n    pointer-events: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownButtonTextStyles = styled.div`\r\n  flex: 1\r\n`;\r\n\r\nexport const DropdownButtonTextWrapper = styled.div`\r\n  box-sizing: border-box;\r\n  min-height: 48px;\r\n  display: flex;\r\n  align-items: center;\r\n  width: fit-content;\r\n  cursor: pointer;\r\n\r\n  ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\r\n\r\n  .expanded {\r\n    color: ${COLORS.neutral_800};\r\n\r\n    ${DropdownButtonTextContent} {\r\n      background: ${COLORS.neutral_20};\r\n    }\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${COLORS.primary_20};\r\n      color: ${COLORS.primary_700};\r\n    }\r\n  }\r\n\r\n  &:active:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${COLORS.primary_100};\r\n      color: ${COLORS.primary_800};\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n    color: ${COLORS.neutral_300};\r\n  }\r\n\r\n}`;\r\n"],"mappings":";;AAAA,OAAOA,MAAM,IAAGC,GAAG,QAAO,mBAAmB;AAC7C,SAAQC,wBAAwB,QAAO,WAAW;AAClD,SAAQC,WAAW,EAAEC,MAAM,EAAEC,kBAAkB,EAAEC,WAAW,QAAO,WAAW;AAC9E,SACEC,iBAAiB,EACjBC,iBAAiB,EACjBC,kBAAkB,EAClBC,mBAAmB,QACd,sBAAsB;AAC7B,SAAQC,SAAS,QAAO,qBAAqB;AAC7C,SAASC,cAAc,QAAQ,2BAA2B;AAE1D,OAAO,IAAMC,iBAAiB,GAAGb,MAAM,CAACc,GAAG,2VAGvC,UAACC,KAAK;EAAA,OAAK,CAACA,KAAK,CAACC,QAAQ,KAAKD,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEE,QAAQ,qCAA8BF,KAAK,CAACE,QAAQ,SAAM,gCAAgC,CAAC;AAAA,GACjI,UAACF,KAAK;EAAA,OAAMA,KAAK,CAACG,QAAQ,IAAIH,KAAK,CAACI,QAAQ,GAAG,sBAAsB,GAAG,EAAE;AAAA,CAAC,EAC3E,UAACJ,KAAK;EAAA,OAAMA,KAAK,CAACK,MAAM,qBAAcL,KAAK,CAACK,MAAM,SAAM,qBAAqB;AAAA,CAAC,EAUnET,SAAS,CAACU,KAAK,EAIjBjB,MAAM,CAACkB,WAAW,EAIlBlB,MAAM,CAACmB,WAAW,CAI9B;AAED,IAAMC,WAAW,GAAGvB,GAAG,yTACDG,MAAM,CAACqB,WAAW,EACFrB,MAAM,CAACsB,WAAW,EAC7CtB,MAAM,CAACuB,WAAW,EAKhBvB,MAAM,CAACuB,WAAW,EAIlBvB,MAAM,CAACsB,WAAW,CAE9B;AAED,IAAME,aAAa,GAAG3B,GAAG,sXACHG,MAAM,CAACyB,KAAK,EACIzB,MAAM,CAACqB,WAAW,EAC7CrB,MAAM,CAACsB,WAAW,EAKhBtB,MAAM,CAACsB,WAAW,EAIlBtB,MAAM,CAACsB,WAAW,EAGhBtB,MAAM,CAACsB,WAAW,CAGhC;AAED,IAAMI,uBAAuB,GAAG7B,GAAG,qHACGG,MAAM,CAAC2B,YAAY,CACxD;AAED,IAAMC,kBAAkB,GAAG/B,GAAG,kFAC1BM,iBAAiB,CAACF,kBAAkB,CAAC4B,MAAM,EAAE7B,MAAM,CAACuB,WAAW,CAAC,CACnE;AAED,OAAO,IAAMO,kBAAkB,GAAGlC,MAAM,CAACmC,KAAK,qjBAMnC/B,MAAM,CAACgC,KAAK,EAMnB,UAAArB,KAAK;EAAA,OAAIA,KAAK,CAACsB,QAAQ,GAAG,0BAA0B,GAAG,EAAE;AAAA,GAGhDjC,MAAM,CAACuB,WAAW,CAU9B;AAED,OAAO,IAAMW,wBAAwB,GAAGtC,MAAM,CAACc,GAAG,o9DAC9CN,iBAAiB,CAACH,kBAAkB,CAACkC,OAAO,EAAE,SAAS,CAAC,EAI7C,UAACxB,KAAK;EAAA,OAAMA,KAAK,CAACE,QAAQ,aAAMF,KAAK,CAACE,QAAQ,IAAK,OAAO;AAAA,CAAC,EAG1Db,MAAM,CAACyB,KAAK,EACUzB,MAAM,CAACoC,WAAW,EAgBpD5B,cAAc,CAAC,OAAO,CAAC,EAGrBF,mBAAmB,CAACL,kBAAkB,CAAC4B,MAAM,EAAE7B,MAAM,CAACuB,WAAW,CAAC,EAGpExB,WAAW,CAACsC,MAAM,EAChBlC,iBAAiB,CAACF,kBAAkB,CAACkC,OAAO,EAAE,SAAS,CAAC,EAKtD9B,kBAAkB,CAACJ,kBAAkB,CAAC4B,MAAM,EAAE7B,MAAM,CAACuB,WAAW,CAAC,EAKnEnB,iBAAiB,CAACH,kBAAkB,CAACkC,OAAO,EAAE,SAAS,CAAC,EAKtD7B,mBAAmB,CAACL,kBAAkB,CAAC4B,MAAM,EAAE7B,MAAM,CAACuB,WAAW,CAAC,EAKpEpB,iBAAiB,CAACF,kBAAkB,CAACkC,OAAO,EAAE,SAAS,CAAC,EAKtD9B,kBAAkB,CAACJ,kBAAkB,CAAC4B,MAAM,EAAE7B,MAAM,CAACuB,WAAW,CAAC,EAQ5D,UAACZ,KAAK;EAAA,OAAKA,KAAK,CAAC2B,aAAa,GAAGtC,MAAM,CAACuB,WAAW,GAAGgB,SAAS;AAAA,GASpCvC,MAAM,CAACmB,WAAW,EAIlBnB,MAAM,CAACwC,WAAW,EAIzCxC,MAAM,CAACkB,WAAW,EAKpBlB,MAAM,CAACkB,WAAW,EAOOlB,MAAM,CAACyC,WAAW,EAIzCzC,MAAM,CAACmB,WAAW,EAKpBnB,MAAM,CAACmB,WAAW,EAK3B,UAACR,KAAK;EAAA,OAAKP,iBAAiB,CAACH,kBAAkB,CAACyC,IAAI,EAAE/B,KAAK,CAACI,QAAQ,GAAGf,MAAM,CAACsB,WAAW,GAAGtB,MAAM,CAACuB,WAAW,CAAC;AAAA,GAYtGvB,MAAM,CAAC2C,WAAW,EACb3C,MAAM,CAAC4C,UAAU,EAKjC,UAACjC,KAAK;EAAA,OAAMA,KAAK,CAACI,QAAQ,GAAGS,aAAa,GAAG,EAAE;AAAA,CAAC,EAChD,UAACb,KAAK;EAAA,OAAMA,KAAK,CAACG,QAAQ,GAAGM,WAAW,GAAG,EAAE;AAAA,CAAC,EAC9C,UAACT,KAAK;EAAA,OAAMA,KAAK,CAACkC,qBAAqB,GAAGnB,uBAAuB,GAAG,EAAE;AAAA,CAAC,EACvE,UAACf,KAAK;EAAA,OAAMA,KAAK,CAAC2B,aAAa,GAAGV,kBAAkB,GAAG,EAAE;AAAA,CAAC,EAE1D9B,wBAAwB,EAIbS,SAAS,CAACuC,QAAQ,GAAG,CAAC,EAC/B5C,WAAW,CAEhB;AAED,OAAO,IAAM6C,4BAA4B,GAAGlD,GAAG,8FAE9C;AAID,OAAO,IAAMmD,yBAAyB,GAAGpD,MAAM,CAACc,GAAG,gPASlD;AAED,OAAO,IAAMuC,sBAAsB,GAAGrD,MAAM,CAACc,GAAG,4GAG/C;AAED,OAAO,IAAMwC,uBAAuB,GAAGtD,MAAM,CAACc,GAAG,uJAOhD;AAED,OAAO,IAAMyC,wBAAwB,GAAGvD,MAAM,CAACc,GAAG,sFAEjD;AAED,OAAO,IAAM0C,yBAAyB,GAAGxD,MAAM,CAACc,GAAG,wmBAQ/CN,iBAAiB,CAACH,kBAAkB,CAACyC,IAAI,EAAE1C,MAAM,CAACuB,WAAW,CAAC,EAGrDvB,MAAM,CAAC2C,WAAW,EAEzBK,yBAAyB,EACXhD,MAAM,CAAC4C,UAAU,EAK/B1C,WAAW,EAIX8C,yBAAyB,EACLhD,MAAM,CAACqD,UAAU,EAC5BrD,MAAM,CAACsD,WAAW,EAK3BN,yBAAyB,EACLhD,MAAM,CAACuD,WAAW,EAC7BvD,MAAM,CAACmB,WAAW,EAMpBnB,MAAM,CAACsB,WAAW,CAG7B"}
+{"version":3,"file":"CommonStyling.js","names":["styled","css","CommonInteractionStyling","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","Z_INDEXES","TooltipTrigger","DropdownContainer","div","_templateObject","_taggedTemplateLiteral","props","isButton","minWidth","concat","readOnly","disabled","margin","focus","getColor","theme","lockedState","_templateObject2","disabledState","_templateObject3","activeValidationMessage","_templateObject4","placeholderStyling","_templateObject5","Italic","DropdownInputField","input","_templateObject6","ellipsis","DropdownInputFieldStyles","_templateObject7","Regular","MEDIUM","isPlaceholder","undefined","Bold","showValidationMessage","dropdown","DropdownContentButtonStyling","_templateObject8","DropdownButtonTextContent","_templateObject9","DropdownButtonTextIcon","_templateObject10","DropdownButtonTextArrow","_templateObject11","DropdownButtonTextStyles","_templateObject12","DropdownButtonTextWrapper","_templateObject13"],"sources":["../../src/Dropdown/CommonStyling.tsx"],"sourcesContent":["import styled, {css} from 'styled-components';\r\nimport {CommonInteractionStyling} from '../common';\r\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\nimport {\r\n  ComponentMStyling,\r\n  ComponentLStyling,\r\n  ComponentSStyling,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../styles/typography';\r\nimport {Size} from '../types';\r\nimport {Z_INDEXES} from '../styles/z-indexes';\r\nimport { TooltipTrigger, Tooltip } from '../Tooltips/TooltipStyles';\r\n\r\nexport const DropdownContainer = styled.div<{ isButton: boolean; readOnly?: boolean; disabled?: boolean; margin?: string; minWidth?: string }>`\r\n  display: inline-block;\r\n\r\n  ${(props) => !props.isButton && (props?.minWidth ? `width: 100%; min-width: ${props.minWidth};` : 'width: 100%; min-width: 344px;')}\r\n  ${(props) => (props.readOnly || props.disabled ? 'cursor: not-allowed;' : '')}\r\n  ${(props) => (props.margin ? `margin: ${props.margin};` : 'margin-bottom: 4px;')}\r\n  .show {\r\n    display: block;\r\n  }\r\n\r\n  .value {\r\n    flex-grow: 1;\r\n  }\r\n\r\n  &:focus-within {\r\n    z-index: ${Z_INDEXES.focus};\r\n  }\r\n\r\n  input:hover + div {\r\n    color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n  }\r\n\r\n  input:active + div {\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n\r\n`;\r\n\r\nconst lockedState = css`\r\n  background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  input {\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)} !important;\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n  }\r\n`;\r\n\r\nconst disabledState = css`\r\n  background-color: ${props => COLORS.getColor('white', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  pointer-events: none;\r\n  cursor: not-allowed;\r\n\r\n  .dropdown-arrow {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n  }\r\n\r\n  input {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n\r\n    ::placeholder {\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)} !important;\r\n    }\r\n  }\r\n`;\r\n\r\nconst activeValidationMessage = css`\r\n  box-shadow: inset 0px 0px 0px 2px ${props => COLORS.getColor('critical_400', props.theme)};\r\n`;\r\n\r\nconst placeholderStyling = css`\r\n  ${props => ComponentMStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n`;\r\n\r\nexport const DropdownInputField = styled.input<{ellipsis?: boolean}>`\r\n  border: none;\r\n  outline: none;\r\n  background-color: inherit;\r\n  cursor: pointer;\r\n  color: ${props => COLORS.getColor('black', props.theme)} !important;\r\n  padding: 0;\r\n  flex-grow: 1;\r\n  display: flex;\r\n  justify-content: center;\r\n  overflow: hidden;\r\n  ${props => props.ellipsis ? 'text-overflow: ellipsis;' : ''}\r\n  \r\n  ::placeholder {\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n    font-style: italic;\r\n  }\r\n\r\n  ::-webkit-search-decoration,\r\n  ::-webkit-search-cancel-button,\r\n  ::-webkit-search-results-button,\r\n  ::-webkit-search-results-decoration {\r\n    -webkit-appearance: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownInputFieldStyles = styled.div<{ disabled: boolean; readOnly: boolean; showValidationMessage?: boolean; isPlaceholder?: boolean; minWidth?: string }>`\r\n  ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n\r\n  padding: 12px 16px;\r\n  height: 48px;\r\n  min-width: ${(props) => (props.minWidth ? `${props.minWidth}` : '344px')};\r\n  width: 100%;\r\n\r\n  background: ${props => COLORS.getColor('white', props.theme)};\r\n  box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('neutral_400', props.theme)};\r\n  box-sizing: border-box;\r\n  border-radius: 4px;\r\n  cursor: pointer;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  position: relative;\r\n\r\n  input {\r\n    font-size: inherit;\r\n    line-height: inherit;\r\n    color: inherit;\r\n  }\r\n\r\n  ${TooltipTrigger('hover')}\r\n\r\n  &::placeholder {\r\n    ${props => ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 16px;\r\n    height: 56px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    padding: 12px 16px;\r\n    height: 48px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\r\n    height: 56px;\r\n    padding: 16px;\r\n\r\n    &::placeholder {\r\n      ${props => ComponentXSStyling(ComponentTextStyle.Italic, COLORS.getColor('neutral_600', props.theme))}\r\n    }\r\n  }\r\n\r\n  .dropdown-arrow {\r\n    pointer-events: none;\r\n    width: 24px;\r\n    height: 24px;\r\n    color: ${(props) => props.isPlaceholder ? COLORS.getColor('neutral_600', props.theme) : undefined};\r\n  }\r\n\r\n  &:focus {\r\n    outline: 3px solid #ddd;\r\n  }\r\n\r\n  &:focus-within,\r\n  &.focus-visible-within {\r\n    box-shadow: inset 0px 0px 0px 2px ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n  &:hover:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('primary_200', props.theme)};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    cursor: pointer;\r\n  }\r\n\r\n  &:active:not(.action-within) {\r\n    box-shadow: inset 0px 0px 0px 1px ${props => COLORS.getColor('primary_300', props.theme)};\r\n\r\n    input {\r\n      ::placeholder {\r\n        color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      }\r\n    }\r\n\r\n    .dropdown-arrow {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.button {\r\n    ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.disabled ? COLORS.getColor('neutral_300', props.theme) : COLORS.getColor('neutral_600', props.theme))}\r\n\r\n    box-sizing: border-box;\r\n    height: 32px;\r\n    padding: 0 8px;\r\n    width: initial;\r\n    min-width: initial;\r\n    border: none !important;\r\n    box-shadow: none;\r\n    border-radius: 4px;\r\n\r\n    &.expanded {\r\n      color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n      background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n  }\r\n\r\n\r\n  ${(props) => (props.disabled ? disabledState : '')}\r\n  ${(props) => (props.readOnly ? lockedState : '')}\r\n  ${(props) => (props.showValidationMessage ? activeValidationMessage : '')}\r\n  ${(props) => (props.isPlaceholder ? placeholderStyling : '')}\r\n\r\n  ${CommonInteractionStyling};\r\n\r\n  &.focus-visible,\r\n  &.focus-visible-within {\r\n    z-index: ${Z_INDEXES.dropdown + 1} !important;\r\n    ${focusStyles}\r\n  }\r\n`;\r\n\r\nexport const DropdownContentButtonStyling = css`\r\n  min-width: 344px;\r\n`;\r\n\r\n\r\n\r\nexport const DropdownButtonTextContent = styled.div`\r\n  display: flex;\r\n  gap: 4px;\r\n  align-items: center;\r\n  box-sizing: border-box;\r\n  min-width: 64px;\r\n  min-height: 32px;\r\n  padding: 4px 8px;\r\n  border-radius: 4px;\r\n`;\r\n\r\nexport const DropdownButtonTextIcon = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n`;\r\n\r\nexport const DropdownButtonTextArrow = styled.div`\r\n  width: 24px;\r\n  height: 24px;\r\n\r\n  svg {\r\n    pointer-events: none;\r\n  }\r\n`;\r\n\r\nexport const DropdownButtonTextStyles = styled.div`\r\n  flex: 1\r\n`;\r\n\r\nexport const DropdownButtonTextWrapper = styled.div`\r\n  box-sizing: border-box;\r\n  min-height: 48px;\r\n  display: flex;\r\n  align-items: center;\r\n  width: fit-content;\r\n  cursor: pointer;\r\n\r\n  ${props => ComponentSStyling(ComponentTextStyle.Bold, COLORS.getColor('neutral_600', props.theme))}\r\n\r\n  .expanded {\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n\r\n    ${DropdownButtonTextContent} {\r\n      background: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:focus {\r\n    ${focusStyles}\r\n  }\r\n\r\n  &:hover:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:active:not(.disabled) {\r\n    ${DropdownButtonTextContent} {\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n  }\r\n\r\n}`;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Dropdown/DropdownButton.cjs

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.DropdownButtonContainer = void 0;
+exports["default"] = exports.DropdownButtonContainer = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
@@ -19,9 +19,18 @@ var _icons = require("../icons");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["items", "icon", "disabled", "onClick", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "size", "width", "alignLeft", "multiSelect", "scrollable", "pinTopItem", "maxHeight", "className", "value", "id", "dataTestId"];
 var _templateObject;
-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; }
-var DropdownButtonContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n"])));
+/**
+ * Import React libraries.
+ */
+/**
+ * Import custom components.
+ */
+/**
+ * Import custom types.
+ */
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var DropdownButtonContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: inline-block;\n"])));
 exports.DropdownButtonContainer = DropdownButtonContainer;
 var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var items = _ref.items,
@@ -50,26 +59,26 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     value = _ref.value,
     id = _ref.id,
     dataTestId = _ref.dataTestId,
-    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   // Globally used variables within the view.
   var _React$useState = React.useState(false),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
     dropdownOpen = _React$useState2[0],
     setDropdownOpen = _React$useState2[1];
   var _React$useState3 = React.useState(),
-    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
     activeDescendant = _React$useState4[0],
     setActiveDescendant = _React$useState4[1];
   var _React$useState5 = React.useState([]),
-    _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
+    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
     selectedValues = _React$useState6[0],
     setSelectedValues = _React$useState6[1];
   var _React$useState7 = React.useState(null),
-    _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
+    _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
     focused = _React$useState8[0],
     setFocused = _React$useState8[1];
   var _React$useState9 = React.useState(false),
-    _React$useState10 = (0, _slicedToArray2.default)(_React$useState9, 2),
+    _React$useState10 = (0, _slicedToArray2["default"])(_React$useState9, 2),
     keyboardNavigated = _React$useState10[0],
     setKeyboardNavigated = _React$useState10[1];
   var dropdownRef = React.useRef(null);
@@ -107,6 +116,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           role: "button",
           tooltip: rest.tooltip,
           id: id,
+          "aria-expanded": dropdownOpen,
           "data-testid": dataTestId,
           "aria-controls": "".concat(id, "_dropdowncontent"),
           "aria-activedescendant": activeDescendant,
@@ -133,6 +143,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           role: "button",
           id: id,
           "data-testid": dataTestId,
+          "aria-expanded": dropdownOpen,
           "aria-controls": "".concat(id, "_dropdowncontent"),
           "aria-activedescendant": activeDescendant,
           onMouseDown: _common.defaultOnMouseDownHandler,
@@ -154,8 +165,10 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
               children: label
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommonStyling.DropdownButtonTextArrow, {
               children: dropdownOpen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowDropUp, {
+                "aria-label": "Expanded",
                 size: "24px"
               }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowDropDown, {
+                "aria-label": "Collapsed",
                 size: "24px"
               })
             })]
@@ -166,7 +179,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(DropdownButtonContainer, {
     className: className,
     ref: containerRef,
-    children: [renderButton(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownContent.default, {
+    children: [renderButton(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownContent["default"], {
       ref: dropdownRef,
       ariaRolesType: "menu",
       containerRef: containerRef,
@@ -205,5 +218,5 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   });
 });
 var _default = DropdownButton;
-exports.default = _default;
+exports["default"] = _default;
 //# sourceMappingURL=DropdownButton.cjs.map

package/dist/Dropdown/DropdownButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownButton.cjs","names":["DropdownButtonContainer","styled","div","DropdownButton","React","forwardRef","ref","items","icon","disabled","onClick","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","multiSelect","scrollable","pinTopItem","maxHeight","className","value","id","dataTestId","rest","useState","dropdownOpen","setDropdownOpen","activeDescendant","setActiveDescendant","selectedValues","setSelectedValues","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useFocusOutsideRef","useClickOutsideRef","useEffect","handleValueSelect","values","renderButton","type","tooltip","event","detail","label","keepLabel","length","filter","a","includes","map","displayLabel","join","cls","defaultOnMouseDownHandler","e","key","preventDefault","stopPropagation","onValueUpdate"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n  DropdownButtonTextArrow,\r\n  DropdownButtonTextContent,\r\n  DropdownButtonTextIcon,\r\n  DropdownButtonTextStyles,\r\n  DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n  display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n                          items,\r\n                          icon,\r\n                          disabled,\r\n                          onClick,\r\n                          itemsType = 'normal',\r\n                          action,\r\n                          actionLabel = '',\r\n                          actionVariant,\r\n                          actionIcon,\r\n                          actionLoading,\r\n                          size,\r\n                          width,\r\n                          alignLeft,\r\n                          multiSelect = false,\r\n                          scrollable = false,\r\n                          pinTopItem = false,\r\n                          maxHeight,\r\n                          className,\r\n                          value,\r\n                          id,\r\n                          dataTestId,\r\n                          ...rest\r\n                        }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n  // Globally used variables within the view.\r\n  const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n  const [focused, setFocused] = React.useState<number | null>(null);\r\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n  useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n  React.useEffect(() => {\r\n    !dropdownOpen && setKeyboardNavigated(false)\r\n  }, [dropdownOpen]);\r\n\r\n  React.useEffect(() => {\r\n    disabled && setDropdownOpen(false)\r\n  }, [disabled]);\r\n\r\n  React.useEffect(() => {\r\n    setSelectedValues(value || []);\r\n  }, [value]);\r\n\r\n  const handleValueSelect = (values: string[]) => {\r\n    // Do all required actions\r\n    onClick(values);\r\n  };\r\n\r\n  /**\r\n   * Renders Icon Button dropdown menu.\r\n   * @returns HTML View for the Icon button dropdown menu.\r\n   */\r\n  const renderButton = () => {\r\n    switch (rest.type) {\r\n      case 'icon':\r\n        return (\r\n          <IconButton ref={ref}\r\n                      variant=\"secondary\"\r\n                      shape=\"circular\"\r\n                      role=\"button\"\r\n                      tooltip={rest.tooltip}\r\n                      id={id}\r\n                      data-testid={dataTestId}\r\n                      aria-controls={`${id}_dropdowncontent`}\r\n                      aria-activedescendant={activeDescendant}\r\n                      \r\n                      action={(event: any) => {\r\n                        setDropdownOpen(!dropdownOpen);\r\n                        if (event?.detail !== 1) {\r\n                          setKeyboardNavigated(true);\r\n                        }\r\n                      }}\r\n                      disabled={disabled}>\r\n            {icon}\r\n          </IconButton>\r\n        );\r\n      case 'text':\r\n        const label = rest.keepLabel || !selectedValues?.length\r\n          ? rest.label\r\n          : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n        const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n        return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n                                          className={cls}\r\n                                          role=\"button\"\r\n                                          id={id}\r\n                                          data-testid={dataTestId}\r\n                                          aria-controls={`${id}_dropdowncontent`}\r\n                                          aria-activedescendant={activeDescendant}\r\n                                          onMouseDown={defaultOnMouseDownHandler}\r\n                                          onKeyDown={e => {\r\n                                            if (e.key === 'Enter' || e.key === ' ') {\r\n                                              e.preventDefault();\r\n                                              e.stopPropagation();\r\n                                              setDropdownOpen(!dropdownOpen);\r\n                                              setKeyboardNavigated(true);\r\n                                            }\r\n                                          }}\r\n                                          onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n          <DropdownButtonTextContent>\r\n            {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n            <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n            <DropdownButtonTextArrow>\r\n              {\r\n                dropdownOpen\r\n                  ? <SystemIcons.ArrowDropUp size=\"24px\"/>\r\n                  : <SystemIcons.ArrowDropDown size=\"24px\"/>\r\n              }\r\n            </DropdownButtonTextArrow>\r\n          </DropdownButtonTextContent>\r\n        </DropdownButtonTextWrapper>\r\n    }\r\n  };\r\n\r\n  return (\r\n    <DropdownButtonContainer className={className} ref={containerRef}> \r\n      {renderButton()}\r\n      <DropdownContent\r\n        ref={dropdownRef}\r\n        ariaRolesType=\"menu\"\r\n        containerRef={containerRef}\r\n        customizationProps={{\r\n          itemsType: itemsType,\r\n          action: action ?? (() => {\r\n          }),\r\n          actionLabel: actionLabel,\r\n          actionVariant: actionVariant,\r\n          onValueUpdate: handleValueSelect,\r\n          multiSelect: multiSelect,\r\n          actionIcon: actionIcon,\r\n          actionLoading: actionLoading,\r\n          scrollable: scrollable,\r\n          pinTopItem: pinTopItem,\r\n          maxHeight: maxHeight,\r\n          items: items\r\n        }}\r\n        onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n        focused={focused}\r\n        setFocused={setFocused}\r\n        size={size}\r\n        width={width}\r\n        alignLeft={alignLeft}\r\n        isOpen={dropdownOpen}\r\n        setIsOpen={setDropdownOpen}\r\n        outline={keyboardNavigated}\r\n        filter=\"\"\r\n        selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n        setSelectedValues={setSelectedValues}\r\n        messageOnNoResults=\"No results\"\r\n        isButton={true}\r\n        id={`${id}_dropdowncontent`}\r\n      />\r\n    </DropdownButtonContainer>\r\n  );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":"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"}
+{"version":3,"file":"DropdownButton.cjs","names":["React","_interopRequireWildcard","require","_Button","_DropdownContent","_interopRequireDefault","_styledComponents","_common","_CommonStyling","_icons","_jsxRuntime","_excluded","_templateObject","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DropdownButtonContainer","styled","div","_taggedTemplateLiteral2","exports","DropdownButton","forwardRef","_ref","ref","items","icon","disabled","onClick","_ref$itemsType","itemsType","action","_ref$actionLabel","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","_ref$multiSelect","multiSelect","_ref$scrollable","scrollable","_ref$pinTopItem","pinTopItem","maxHeight","className","value","id","dataTestId","rest","_objectWithoutProperties2","_React$useState","useState","_React$useState2","_slicedToArray2","dropdownOpen","setDropdownOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","selectedValues","setSelectedValues","_React$useState7","_React$useState8","focused","setFocused","_React$useState9","_React$useState10","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useFocusOutsideRef","useClickOutsideRef","useEffect","handleValueSelect","values","renderButton","type","jsx","IconButton","variant","shape","role","tooltip","concat","event","detail","children","label","keepLabel","length","filter","includes","map","_a$displayLabel","displayLabel","join","cls","DropdownButtonTextWrapper","tabIndex","onMouseDown","defaultOnMouseDownHandler","onKeyDown","key","preventDefault","stopPropagation","jsxs","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextStyles","DropdownButtonTextArrow","SystemIcons","ArrowDropUp","ArrowDropDown","ariaRolesType","customizationProps","onValueUpdate","onActiveDescendantChanged","isOpen","setIsOpen","outline","messageOnNoResults","isButton","_default"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n  DropdownButtonTextArrow,\r\n  DropdownButtonTextContent,\r\n  DropdownButtonTextIcon,\r\n  DropdownButtonTextStyles,\r\n  DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n  display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n                          items,\r\n                          icon,\r\n                          disabled,\r\n                          onClick,\r\n                          itemsType = 'normal',\r\n                          action,\r\n                          actionLabel = '',\r\n                          actionVariant,\r\n                          actionIcon,\r\n                          actionLoading,\r\n                          size,\r\n                          width,\r\n                          alignLeft,\r\n                          multiSelect = false,\r\n                          scrollable = false,\r\n                          pinTopItem = false,\r\n                          maxHeight,\r\n                          className,\r\n                          value,\r\n                          id,\r\n                          dataTestId,\r\n                          ...rest\r\n                        }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n  // Globally used variables within the view.\r\n  const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n  const [focused, setFocused] = React.useState<number | null>(null);\r\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n  useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n  React.useEffect(() => {\r\n    !dropdownOpen && setKeyboardNavigated(false)\r\n  }, [dropdownOpen]);\r\n\r\n  React.useEffect(() => {\r\n    disabled && setDropdownOpen(false)\r\n  }, [disabled]);\r\n\r\n  React.useEffect(() => {\r\n    setSelectedValues(value || []);\r\n  }, [value]);\r\n\r\n  const handleValueSelect = (values: string[]) => {\r\n    // Do all required actions\r\n    onClick(values);\r\n  };\r\n\r\n  /**\r\n   * Renders Icon Button dropdown menu.\r\n   * @returns HTML View for the Icon button dropdown menu.\r\n   */\r\n  const renderButton = () => {\r\n    switch (rest.type) {\r\n      case 'icon':\r\n        return (\r\n          <IconButton ref={ref}\r\n                      variant=\"secondary\"\r\n                      shape=\"circular\"\r\n                      role=\"button\"\r\n                      tooltip={rest.tooltip}\r\n                      id={id}\r\n                      aria-expanded={dropdownOpen}\r\n                      data-testid={dataTestId}\r\n                      aria-controls={`${id}_dropdowncontent`}\r\n                      aria-activedescendant={activeDescendant}\r\n                      \r\n                      action={(event: any) => {\r\n                        setDropdownOpen(!dropdownOpen);\r\n                        if (event?.detail !== 1) {\r\n                          setKeyboardNavigated(true);\r\n                        }\r\n                      }}\r\n                      disabled={disabled}>\r\n            {icon}\r\n          </IconButton>\r\n        );\r\n      case 'text':\r\n        const label = rest.keepLabel || !selectedValues?.length\r\n          ? rest.label\r\n          : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n        const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n        return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n                                          className={cls}\r\n                                          role=\"button\"\r\n                                          id={id}\r\n                                          data-testid={dataTestId}\r\n                                          aria-expanded={dropdownOpen}\r\n                                          aria-controls={`${id}_dropdowncontent`}\r\n                                          aria-activedescendant={activeDescendant}\r\n                                          onMouseDown={defaultOnMouseDownHandler}\r\n                                          onKeyDown={e => {\r\n                                            if (e.key === 'Enter' || e.key === ' ') {\r\n                                              e.preventDefault();\r\n                                              e.stopPropagation();\r\n                                              setDropdownOpen(!dropdownOpen);\r\n                                              setKeyboardNavigated(true);\r\n                                            }\r\n                                          }}\r\n                                          onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n          <DropdownButtonTextContent>\r\n            {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n            <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n            <DropdownButtonTextArrow>\r\n              {\r\n                dropdownOpen\r\n                  ? <SystemIcons.ArrowDropUp aria-label='Expanded' size=\"24px\"/>\r\n                  : <SystemIcons.ArrowDropDown aria-label='Collapsed' size=\"24px\"/>\r\n              }\r\n            </DropdownButtonTextArrow>\r\n          </DropdownButtonTextContent>\r\n        </DropdownButtonTextWrapper>\r\n    }\r\n  };\r\n\r\n  return (\r\n    <DropdownButtonContainer className={className} ref={containerRef}> \r\n      {renderButton()}\r\n      <DropdownContent\r\n        ref={dropdownRef}\r\n        ariaRolesType=\"menu\"\r\n        containerRef={containerRef}\r\n        customizationProps={{\r\n          itemsType: itemsType,\r\n          action: action ?? (() => {\r\n          }),\r\n          actionLabel: actionLabel,\r\n          actionVariant: actionVariant,\r\n          onValueUpdate: handleValueSelect,\r\n          multiSelect: multiSelect,\r\n          actionIcon: actionIcon,\r\n          actionLoading: actionLoading,\r\n          scrollable: scrollable,\r\n          pinTopItem: pinTopItem,\r\n          maxHeight: maxHeight,\r\n          items: items\r\n        }}\r\n        onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n        focused={focused}\r\n        setFocused={setFocused}\r\n        size={size}\r\n        width={width}\r\n        alignLeft={alignLeft}\r\n        isOpen={dropdownOpen}\r\n        setIsOpen={setDropdownOpen}\r\n        outline={keyboardNavigated}\r\n        filter=\"\"\r\n        selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n        setSelectedValues={setSelectedValues}\r\n        messageOnNoResults=\"No results\"\r\n        isButton={true}\r\n        id={`${id}_dropdowncontent`}\r\n      />\r\n    </DropdownButtonContainer>\r\n  );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Dropdown/DropdownButton.js

@@ -109,6 +109,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           role: "button",
           tooltip: rest.tooltip,
           id: id,
+          "aria-expanded": dropdownOpen,
           "data-testid": dataTestId,
           "aria-controls": "".concat(id, "_dropdowncontent"),
           "aria-activedescendant": activeDescendant,
@@ -135,6 +136,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           role: "button",
           id: id,
           "data-testid": dataTestId,
+          "aria-expanded": dropdownOpen,
           "aria-controls": "".concat(id, "_dropdowncontent"),
           "aria-activedescendant": activeDescendant,
           onMouseDown: defaultOnMouseDownHandler,
@@ -156,8 +158,10 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
               children: label
             }), /*#__PURE__*/_jsx(DropdownButtonTextArrow, {
               children: dropdownOpen ? /*#__PURE__*/_jsx(SystemIcons.ArrowDropUp, {
+                "aria-label": "Expanded",
                 size: "24px"
               }) : /*#__PURE__*/_jsx(SystemIcons.ArrowDropDown, {
+                "aria-label": "Collapsed",
                 size: "24px"
               })
             })]

package/dist/Dropdown/DropdownButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownButton.js","names":["React","IconButton","DropdownContent","styled","defaultOnMouseDownHandler","useClickOutsideRef","useFocusOutsideRef","DropdownButtonTextArrow","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextStyles","DropdownButtonTextWrapper","SystemIcons","DropdownButtonContainer","div","DropdownButton","forwardRef","ref","items","icon","disabled","onClick","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","multiSelect","scrollable","pinTopItem","maxHeight","className","value","id","dataTestId","rest","useState","dropdownOpen","setDropdownOpen","activeDescendant","setActiveDescendant","selectedValues","setSelectedValues","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useEffect","handleValueSelect","values","renderButton","type","tooltip","event","detail","label","keepLabel","length","filter","a","includes","map","displayLabel","join","cls","e","key","preventDefault","stopPropagation","onValueUpdate"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n  DropdownButtonTextArrow,\r\n  DropdownButtonTextContent,\r\n  DropdownButtonTextIcon,\r\n  DropdownButtonTextStyles,\r\n  DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n  display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n                          items,\r\n                          icon,\r\n                          disabled,\r\n                          onClick,\r\n                          itemsType = 'normal',\r\n                          action,\r\n                          actionLabel = '',\r\n                          actionVariant,\r\n                          actionIcon,\r\n                          actionLoading,\r\n                          size,\r\n                          width,\r\n                          alignLeft,\r\n                          multiSelect = false,\r\n                          scrollable = false,\r\n                          pinTopItem = false,\r\n                          maxHeight,\r\n                          className,\r\n                          value,\r\n                          id,\r\n                          dataTestId,\r\n                          ...rest\r\n                        }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n  // Globally used variables within the view.\r\n  const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n  const [focused, setFocused] = React.useState<number | null>(null);\r\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n  useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n  React.useEffect(() => {\r\n    !dropdownOpen && setKeyboardNavigated(false)\r\n  }, [dropdownOpen]);\r\n\r\n  React.useEffect(() => {\r\n    disabled && setDropdownOpen(false)\r\n  }, [disabled]);\r\n\r\n  React.useEffect(() => {\r\n    setSelectedValues(value || []);\r\n  }, [value]);\r\n\r\n  const handleValueSelect = (values: string[]) => {\r\n    // Do all required actions\r\n    onClick(values);\r\n  };\r\n\r\n  /**\r\n   * Renders Icon Button dropdown menu.\r\n   * @returns HTML View for the Icon button dropdown menu.\r\n   */\r\n  const renderButton = () => {\r\n    switch (rest.type) {\r\n      case 'icon':\r\n        return (\r\n          <IconButton ref={ref}\r\n                      variant=\"secondary\"\r\n                      shape=\"circular\"\r\n                      role=\"button\"\r\n                      tooltip={rest.tooltip}\r\n                      id={id}\r\n                      data-testid={dataTestId}\r\n                      aria-controls={`${id}_dropdowncontent`}\r\n                      aria-activedescendant={activeDescendant}\r\n                      \r\n                      action={(event: any) => {\r\n                        setDropdownOpen(!dropdownOpen);\r\n                        if (event?.detail !== 1) {\r\n                          setKeyboardNavigated(true);\r\n                        }\r\n                      }}\r\n                      disabled={disabled}>\r\n            {icon}\r\n          </IconButton>\r\n        );\r\n      case 'text':\r\n        const label = rest.keepLabel || !selectedValues?.length\r\n          ? rest.label\r\n          : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n        const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n        return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n                                          className={cls}\r\n                                          role=\"button\"\r\n                                          id={id}\r\n                                          data-testid={dataTestId}\r\n                                          aria-controls={`${id}_dropdowncontent`}\r\n                                          aria-activedescendant={activeDescendant}\r\n                                          onMouseDown={defaultOnMouseDownHandler}\r\n                                          onKeyDown={e => {\r\n                                            if (e.key === 'Enter' || e.key === ' ') {\r\n                                              e.preventDefault();\r\n                                              e.stopPropagation();\r\n                                              setDropdownOpen(!dropdownOpen);\r\n                                              setKeyboardNavigated(true);\r\n                                            }\r\n                                          }}\r\n                                          onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n          <DropdownButtonTextContent>\r\n            {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n            <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n            <DropdownButtonTextArrow>\r\n              {\r\n                dropdownOpen\r\n                  ? <SystemIcons.ArrowDropUp size=\"24px\"/>\r\n                  : <SystemIcons.ArrowDropDown size=\"24px\"/>\r\n              }\r\n            </DropdownButtonTextArrow>\r\n          </DropdownButtonTextContent>\r\n        </DropdownButtonTextWrapper>\r\n    }\r\n  };\r\n\r\n  return (\r\n    <DropdownButtonContainer className={className} ref={containerRef}> \r\n      {renderButton()}\r\n      <DropdownContent\r\n        ref={dropdownRef}\r\n        ariaRolesType=\"menu\"\r\n        containerRef={containerRef}\r\n        customizationProps={{\r\n          itemsType: itemsType,\r\n          action: action ?? (() => {\r\n          }),\r\n          actionLabel: actionLabel,\r\n          actionVariant: actionVariant,\r\n          onValueUpdate: handleValueSelect,\r\n          multiSelect: multiSelect,\r\n          actionIcon: actionIcon,\r\n          actionLoading: actionLoading,\r\n          scrollable: scrollable,\r\n          pinTopItem: pinTopItem,\r\n          maxHeight: maxHeight,\r\n          items: items\r\n        }}\r\n        onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n        focused={focused}\r\n        setFocused={setFocused}\r\n        size={size}\r\n        width={width}\r\n        alignLeft={alignLeft}\r\n        isOpen={dropdownOpen}\r\n        setIsOpen={setDropdownOpen}\r\n        outline={keyboardNavigated}\r\n        filter=\"\"\r\n        selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n        setSelectedValues={setSelectedValues}\r\n        messageOnNoResults=\"No results\"\r\n        isButton={true}\r\n        id={`${id}_dropdowncontent`}\r\n      />\r\n    </DropdownButtonContainer>\r\n  );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":"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"}
+{"version":3,"file":"DropdownButton.js","names":["React","IconButton","DropdownContent","styled","defaultOnMouseDownHandler","useClickOutsideRef","useFocusOutsideRef","DropdownButtonTextArrow","DropdownButtonTextContent","DropdownButtonTextIcon","DropdownButtonTextStyles","DropdownButtonTextWrapper","SystemIcons","jsx","_jsx","jsxs","_jsxs","DropdownButtonContainer","div","_templateObject","_taggedTemplateLiteral","DropdownButton","forwardRef","_ref","ref","items","icon","disabled","onClick","_ref$itemsType","itemsType","action","_ref$actionLabel","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","_ref$multiSelect","multiSelect","_ref$scrollable","scrollable","_ref$pinTopItem","pinTopItem","maxHeight","className","value","id","dataTestId","rest","_objectWithoutProperties","_excluded","_React$useState","useState","_React$useState2","_slicedToArray","dropdownOpen","setDropdownOpen","_React$useState3","_React$useState4","activeDescendant","setActiveDescendant","_React$useState5","_React$useState6","selectedValues","setSelectedValues","_React$useState7","_React$useState8","focused","setFocused","_React$useState9","_React$useState10","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useEffect","handleValueSelect","values","renderButton","type","variant","shape","role","tooltip","concat","event","detail","children","label","keepLabel","length","filter","a","includes","map","_a$displayLabel","displayLabel","join","cls","tabIndex","onMouseDown","onKeyDown","e","key","preventDefault","stopPropagation","ArrowDropUp","ArrowDropDown","ariaRolesType","customizationProps","onValueUpdate","onActiveDescendantChanged","isOpen","setIsOpen","outline","messageOnNoResults","isButton"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport {IconButton} from '../Button';\r\nimport DropdownContent from './DropdownContent';\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom types.\r\n */\r\nimport {DropdownButtonProps} from './DropdownButtonTypes';\r\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\r\nimport {\r\n  DropdownButtonTextArrow,\r\n  DropdownButtonTextContent,\r\n  DropdownButtonTextIcon,\r\n  DropdownButtonTextStyles,\r\n  DropdownButtonTextWrapper\r\n} from './CommonStyling';\r\nimport {SystemIcons} from '../icons';\r\n\r\nexport const DropdownButtonContainer = styled.div`\r\n  display: inline-block;\r\n`;\r\n\r\nconst DropdownButton = React.forwardRef( ({\r\n                          items,\r\n                          icon,\r\n                          disabled,\r\n                          onClick,\r\n                          itemsType = 'normal',\r\n                          action,\r\n                          actionLabel = '',\r\n                          actionVariant,\r\n                          actionIcon,\r\n                          actionLoading,\r\n                          size,\r\n                          width,\r\n                          alignLeft,\r\n                          multiSelect = false,\r\n                          scrollable = false,\r\n                          pinTopItem = false,\r\n                          maxHeight,\r\n                          className,\r\n                          value,\r\n                          id,\r\n                          dataTestId,\r\n                          ...rest\r\n                        }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n  // Globally used variables within the view.\r\n  const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\r\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\r\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\r\n  const [focused, setFocused] = React.useState<number | null>(null);\r\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\r\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\r\n  useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\r\n\r\n  React.useEffect(() => {\r\n    !dropdownOpen && setKeyboardNavigated(false)\r\n  }, [dropdownOpen]);\r\n\r\n  React.useEffect(() => {\r\n    disabled && setDropdownOpen(false)\r\n  }, [disabled]);\r\n\r\n  React.useEffect(() => {\r\n    setSelectedValues(value || []);\r\n  }, [value]);\r\n\r\n  const handleValueSelect = (values: string[]) => {\r\n    // Do all required actions\r\n    onClick(values);\r\n  };\r\n\r\n  /**\r\n   * Renders Icon Button dropdown menu.\r\n   * @returns HTML View for the Icon button dropdown menu.\r\n   */\r\n  const renderButton = () => {\r\n    switch (rest.type) {\r\n      case 'icon':\r\n        return (\r\n          <IconButton ref={ref}\r\n                      variant=\"secondary\"\r\n                      shape=\"circular\"\r\n                      role=\"button\"\r\n                      tooltip={rest.tooltip}\r\n                      id={id}\r\n                      aria-expanded={dropdownOpen}\r\n                      data-testid={dataTestId}\r\n                      aria-controls={`${id}_dropdowncontent`}\r\n                      aria-activedescendant={activeDescendant}\r\n                      \r\n                      action={(event: any) => {\r\n                        setDropdownOpen(!dropdownOpen);\r\n                        if (event?.detail !== 1) {\r\n                          setKeyboardNavigated(true);\r\n                        }\r\n                      }}\r\n                      disabled={disabled}>\r\n            {icon}\r\n          </IconButton>\r\n        );\r\n      case 'text':\r\n        const label = rest.keepLabel || !selectedValues?.length\r\n          ? rest.label\r\n          : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\r\n        const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\r\n        return <DropdownButtonTextWrapper tabIndex={!disabled ? 0 : -1}\r\n                                          className={cls}\r\n                                          role=\"button\"\r\n                                          id={id}\r\n                                          data-testid={dataTestId}\r\n                                          aria-expanded={dropdownOpen}\r\n                                          aria-controls={`${id}_dropdowncontent`}\r\n                                          aria-activedescendant={activeDescendant}\r\n                                          onMouseDown={defaultOnMouseDownHandler}\r\n                                          onKeyDown={e => {\r\n                                            if (e.key === 'Enter' || e.key === ' ') {\r\n                                              e.preventDefault();\r\n                                              e.stopPropagation();\r\n                                              setDropdownOpen(!dropdownOpen);\r\n                                              setKeyboardNavigated(true);\r\n                                            }\r\n                                          }}\r\n                                          onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\r\n          <DropdownButtonTextContent>\r\n            {icon && <DropdownButtonTextIcon>{icon}</DropdownButtonTextIcon>}\r\n            <DropdownButtonTextStyles>{label}</DropdownButtonTextStyles>\r\n            <DropdownButtonTextArrow>\r\n              {\r\n                dropdownOpen\r\n                  ? <SystemIcons.ArrowDropUp aria-label='Expanded' size=\"24px\"/>\r\n                  : <SystemIcons.ArrowDropDown aria-label='Collapsed' size=\"24px\"/>\r\n              }\r\n            </DropdownButtonTextArrow>\r\n          </DropdownButtonTextContent>\r\n        </DropdownButtonTextWrapper>\r\n    }\r\n  };\r\n\r\n  return (\r\n    <DropdownButtonContainer className={className} ref={containerRef}> \r\n      {renderButton()}\r\n      <DropdownContent\r\n        ref={dropdownRef}\r\n        ariaRolesType=\"menu\"\r\n        containerRef={containerRef}\r\n        customizationProps={{\r\n          itemsType: itemsType,\r\n          action: action ?? (() => {\r\n          }),\r\n          actionLabel: actionLabel,\r\n          actionVariant: actionVariant,\r\n          onValueUpdate: handleValueSelect,\r\n          multiSelect: multiSelect,\r\n          actionIcon: actionIcon,\r\n          actionLoading: actionLoading,\r\n          scrollable: scrollable,\r\n          pinTopItem: pinTopItem,\r\n          maxHeight: maxHeight,\r\n          items: items\r\n        }}\r\n        onActiveDescendantChanged={(e) => setActiveDescendant(e)}\r\n        focused={focused}\r\n        setFocused={setFocused}\r\n        size={size}\r\n        width={width}\r\n        alignLeft={alignLeft}\r\n        isOpen={dropdownOpen}\r\n        setIsOpen={setDropdownOpen}\r\n        outline={keyboardNavigated}\r\n        filter=\"\"\r\n        selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\r\n        setSelectedValues={setSelectedValues}\r\n        messageOnNoResults=\"No results\"\r\n        isButton={true}\r\n        id={`${id}_dropdowncontent`}\r\n      />\r\n    </DropdownButtonContainer>\r\n  );\r\n});\r\n\r\nexport default DropdownButton;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Dropdown/DropdownButtonTypes.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownButtonTypes.cjs","names":[],"sources":["../../src/Dropdown/DropdownButtonTypes.ts"],"sourcesContent":["import {Size, Testable} from '../types';\r\nimport {DropdownItem} from './DropdownContent'\r\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\r\n\r\nexport interface DropdownButtonBaseProps extends Testable {\r\n  id?: string;\r\n  items: DropdownItem[];\r\n  value?: string[];\r\n  onClick: (value: string[]) => void;\r\n  disabled?: boolean;\r\n  size?: Size;\r\n  itemsType?: 'normal' | 'radio' | 'checkbox',\r\n  action?: () => void,\r\n  actionLabel?: string,\r\n  actionIcon?: React.ReactNode;\r\n  actionLoading?: boolean;\r\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined,\r\n  multiSelect?: boolean,\r\n  scrollable?: boolean,\r\n  maxHeight?: string,\r\n  pinTopItem?: boolean,\r\n  className?: string,\r\n  icon?: React.ReactNode;\r\n  width?: string;\r\n  alignLeft?: boolean;\r\n}\r\n\r\nexport type IconDropdownButtonProps = DropdownButtonBaseProps & {\r\n  type: 'icon';\r\n  icon: React.ReactNode;\r\n  tooltip?: TooltipProps;\r\n}\r\n\r\nexport type TextDropdownButtonProps = DropdownButtonBaseProps & {\r\n  type: 'text';\r\n  label?: string;\r\n  keepLabel?: boolean;\r\n}\r\n\r\nexport  type DropdownButtonProps = IconDropdownButtonProps | TextDropdownButtonProps;\r\n"],"mappings":""}
+{"version":3,"file":"DropdownButtonTypes.cjs","names":[],"sources":["../../src/Dropdown/DropdownButtonTypes.ts"],"sourcesContent":["import {Size, Testable} from '../types';\r\nimport {DropdownItem} from './DropdownContent'\r\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\r\n\r\nexport interface DropdownButtonBaseProps extends Testable {\r\n  /** Optional. Id of the top level component, button or text wrapper, depending on 'type'. */\r\n  id?: string;\r\n  /** Required. Array of items to be shown in the dropdown. */\r\n  items: DropdownItem[];\r\n  /** Optional. Currently selected items. */\r\n  value?: string[];\r\n  /** Optional. Handler to be called, provides array of values of currently selected items. */\r\n  onClick: (value: string[]) => void;\r\n  /** Optional. If disabled user can not interact with the button. */\r\n  disabled?: boolean;\r\n  /** Optional. Size of the items in the dropdown content, does not affect button itself. */\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  /** Optional. Type of the items to be shown in the dropdown. */\r\n  itemsType?: 'normal' | 'radio' | 'checkbox',\r\n  /** Optional. Handler of the extra action item to be shown in the dropdown content. */\r\n  action?: () => void,\r\n  /** Optional. Label of the extra action item to be shown in the dropdown content. */\r\n  actionLabel?: string,\r\n  /** Optional. Icon of the extra action item to be shown in the dropdown content. */\r\n  actionIcon?: React.ReactNode;\r\n  /** Optional. Loading state of the extra action item to be shown in the dropdown content. */\r\n  actionLoading?: boolean;\r\n  /** Optional. Button variant of the extra action item in the dropdown contnet. */\r\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined,\r\n  /** Optional. If set, then user can select multiple items in the dropdown. */\r\n  multiSelect?: boolean,\r\n  /** Optional. If set, then dropdown content is scrollable. */\r\n  scrollable?: boolean,\r\n  /** Optional. Maximum height of the dropdown content container. */\r\n  maxHeight?: string,\r\n  /** Optional. If this flag is set, multiselect flag is set and checkbox or radio item types are used, then\r\n   *  will show extra item in the top that will allow to 'Select all' items. */\r\n  pinTopItem?: boolean,\r\n  /** Optional. Custom classname to set on the top level container of the component */\r\n  className?: string,\r\n  /** Optional. Icon of the component, is required if type 'icon' is used. */\r\n  icon?: React.ReactNode;\r\n  /** Optional. Sets width of the dropdown container. */\r\n  width?: string;\r\n  /** Optional. If set, then dropdown content will be aligned with the left edge of the button, otherwise with the right edge. */\r\n  alignLeft?: boolean;\r\n}\r\n\r\nexport type IconDropdownButtonProps = DropdownButtonBaseProps & {\r\n  /** Icon type of the dropdown button. */\r\n  type: 'icon';\r\n  /** Required. Icon to be shown with the component. */\r\n  icon: React.ReactNode;\r\n  /** Optional. Tooltip to be shown with the component. */\r\n  tooltip?: TooltipProps;\r\n}\r\n\r\nexport type TextDropdownButtonProps = DropdownButtonBaseProps & {\r\n  /** Text drodown button type. */\r\n  type: 'text';\r\n  /** Optional. Label to be shown with the dropdown button if none of the items in the dropdown is selected. */\r\n  label?: string;\r\n  /** Optional. If set to true, then 'label' will be shown even if user selects items in the dropdown. */\r\n  keepLabel?: boolean;\r\n}\r\n\r\nexport  type DropdownButtonProps = IconDropdownButtonProps | TextDropdownButtonProps;\r\n"],"mappings":"","ignoreList":[]}

package/dist/Dropdown/DropdownButtonTypes.d.ts

@@ -3,35 +3,62 @@ import { Size, Testable } from '../types';
 import { DropdownItem } from './DropdownContent';
 import { TooltipProps } from "../Tooltips/TooltipTypes";
 export interface DropdownButtonBaseProps extends Testable {
+    /** Optional. Id of the top level component, button or text wrapper, depending on 'type'. */
     id?: string;
+    /** Required. Array of items to be shown in the dropdown. */
     items: DropdownItem[];
+    /** Optional. Currently selected items. */
     value?: string[];
+    /** Optional. Handler to be called, provides array of values of currently selected items. */
     onClick: (value: string[]) => void;
+    /** Optional. If disabled user can not interact with the button. */
     disabled?: boolean;
-    size?: Size;
+    /** Optional. Size of the items in the dropdown content, does not affect button itself. */
+    size?: Size.Small | Size.Medium | Size.Large;
+    /** Optional. Type of the items to be shown in the dropdown. */
     itemsType?: 'normal' | 'radio' | 'checkbox';
+    /** Optional. Handler of the extra action item to be shown in the dropdown content. */
     action?: () => void;
+    /** Optional. Label of the extra action item to be shown in the dropdown content. */
     actionLabel?: string;
+    /** Optional. Icon of the extra action item to be shown in the dropdown content. */
     actionIcon?: React.ReactNode;
+    /** Optional. Loading state of the extra action item to be shown in the dropdown content. */
     actionLoading?: boolean;
+    /** Optional. Button variant of the extra action item in the dropdown contnet. */
     actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;
+    /** Optional. If set, then user can select multiple items in the dropdown. */
     multiSelect?: boolean;
+    /** Optional. If set, then dropdown content is scrollable. */
     scrollable?: boolean;
+    /** Optional. Maximum height of the dropdown content container. */
     maxHeight?: string;
+    /** Optional. If this flag is set, multiselect flag is set and checkbox or radio item types are used, then
+     *  will show extra item in the top that will allow to 'Select all' items. */
     pinTopItem?: boolean;
+    /** Optional. Custom classname to set on the top level container of the component */
     className?: string;
+    /** Optional. Icon of the component, is required if type 'icon' is used. */
     icon?: React.ReactNode;
+    /** Optional. Sets width of the dropdown container. */
     width?: string;
+    /** Optional. If set, then dropdown content will be aligned with the left edge of the button, otherwise with the right edge. */
     alignLeft?: boolean;
 }
 export type IconDropdownButtonProps = DropdownButtonBaseProps & {
+    /** Icon type of the dropdown button. */
     type: 'icon';
+    /** Required. Icon to be shown with the component. */
     icon: React.ReactNode;
+    /** Optional. Tooltip to be shown with the component. */
     tooltip?: TooltipProps;
 };
 export type TextDropdownButtonProps = DropdownButtonBaseProps & {
+    /** Text drodown button type. */
     type: 'text';
+    /** Optional. Label to be shown with the dropdown button if none of the items in the dropdown is selected. */
     label?: string;
+    /** Optional. If set to true, then 'label' will be shown even if user selects items in the dropdown. */
     keepLabel?: boolean;
 };
 export type DropdownButtonProps = IconDropdownButtonProps | TextDropdownButtonProps;

package/dist/Dropdown/DropdownButtonTypes.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownButtonTypes.js","names":[],"sources":["../../src/Dropdown/DropdownButtonTypes.ts"],"sourcesContent":["import {Size, Testable} from '../types';\r\nimport {DropdownItem} from './DropdownContent'\r\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\r\n\r\nexport interface DropdownButtonBaseProps extends Testable {\r\n  id?: string;\r\n  items: DropdownItem[];\r\n  value?: string[];\r\n  onClick: (value: string[]) => void;\r\n  disabled?: boolean;\r\n  size?: Size;\r\n  itemsType?: 'normal' | 'radio' | 'checkbox',\r\n  action?: () => void,\r\n  actionLabel?: string,\r\n  actionIcon?: React.ReactNode;\r\n  actionLoading?: boolean;\r\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined,\r\n  multiSelect?: boolean,\r\n  scrollable?: boolean,\r\n  maxHeight?: string,\r\n  pinTopItem?: boolean,\r\n  className?: string,\r\n  icon?: React.ReactNode;\r\n  width?: string;\r\n  alignLeft?: boolean;\r\n}\r\n\r\nexport type IconDropdownButtonProps = DropdownButtonBaseProps & {\r\n  type: 'icon';\r\n  icon: React.ReactNode;\r\n  tooltip?: TooltipProps;\r\n}\r\n\r\nexport type TextDropdownButtonProps = DropdownButtonBaseProps & {\r\n  type: 'text';\r\n  label?: string;\r\n  keepLabel?: boolean;\r\n}\r\n\r\nexport  type DropdownButtonProps = IconDropdownButtonProps | TextDropdownButtonProps;\r\n"],"mappings":""}
+{"version":3,"file":"DropdownButtonTypes.js","names":[],"sources":["../../src/Dropdown/DropdownButtonTypes.ts"],"sourcesContent":["import {Size, Testable} from '../types';\r\nimport {DropdownItem} from './DropdownContent'\r\nimport {TooltipProps} from \"../Tooltips/TooltipTypes\";\r\n\r\nexport interface DropdownButtonBaseProps extends Testable {\r\n  /** Optional. Id of the top level component, button or text wrapper, depending on 'type'. */\r\n  id?: string;\r\n  /** Required. Array of items to be shown in the dropdown. */\r\n  items: DropdownItem[];\r\n  /** Optional. Currently selected items. */\r\n  value?: string[];\r\n  /** Optional. Handler to be called, provides array of values of currently selected items. */\r\n  onClick: (value: string[]) => void;\r\n  /** Optional. If disabled user can not interact with the button. */\r\n  disabled?: boolean;\r\n  /** Optional. Size of the items in the dropdown content, does not affect button itself. */\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  /** Optional. Type of the items to be shown in the dropdown. */\r\n  itemsType?: 'normal' | 'radio' | 'checkbox',\r\n  /** Optional. Handler of the extra action item to be shown in the dropdown content. */\r\n  action?: () => void,\r\n  /** Optional. Label of the extra action item to be shown in the dropdown content. */\r\n  actionLabel?: string,\r\n  /** Optional. Icon of the extra action item to be shown in the dropdown content. */\r\n  actionIcon?: React.ReactNode;\r\n  /** Optional. Loading state of the extra action item to be shown in the dropdown content. */\r\n  actionLoading?: boolean;\r\n  /** Optional. Button variant of the extra action item in the dropdown contnet. */\r\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined,\r\n  /** Optional. If set, then user can select multiple items in the dropdown. */\r\n  multiSelect?: boolean,\r\n  /** Optional. If set, then dropdown content is scrollable. */\r\n  scrollable?: boolean,\r\n  /** Optional. Maximum height of the dropdown content container. */\r\n  maxHeight?: string,\r\n  /** Optional. If this flag is set, multiselect flag is set and checkbox or radio item types are used, then\r\n   *  will show extra item in the top that will allow to 'Select all' items. */\r\n  pinTopItem?: boolean,\r\n  /** Optional. Custom classname to set on the top level container of the component */\r\n  className?: string,\r\n  /** Optional. Icon of the component, is required if type 'icon' is used. */\r\n  icon?: React.ReactNode;\r\n  /** Optional. Sets width of the dropdown container. */\r\n  width?: string;\r\n  /** Optional. If set, then dropdown content will be aligned with the left edge of the button, otherwise with the right edge. */\r\n  alignLeft?: boolean;\r\n}\r\n\r\nexport type IconDropdownButtonProps = DropdownButtonBaseProps & {\r\n  /** Icon type of the dropdown button. */\r\n  type: 'icon';\r\n  /** Required. Icon to be shown with the component. */\r\n  icon: React.ReactNode;\r\n  /** Optional. Tooltip to be shown with the component. */\r\n  tooltip?: TooltipProps;\r\n}\r\n\r\nexport type TextDropdownButtonProps = DropdownButtonBaseProps & {\r\n  /** Text drodown button type. */\r\n  type: 'text';\r\n  /** Optional. Label to be shown with the dropdown button if none of the items in the dropdown is selected. */\r\n  label?: string;\r\n  /** Optional. If set to true, then 'label' will be shown even if user selects items in the dropdown. */\r\n  keepLabel?: boolean;\r\n}\r\n\r\nexport  type DropdownButtonProps = IconDropdownButtonProps | TextDropdownButtonProps;\r\n"],"mappings":"","ignoreList":[]}