@laerdal/life-react-components 1.7.0-dev.7 → 1.7.0-dev.8.full

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (103) hide show
  1. package/dist/Card/Card.cjs +28 -44
  2. package/dist/Card/Card.cjs.map +1 -1
  3. package/dist/Card/Card.d.ts +3 -11
  4. package/dist/Card/Card.js +26 -44
  5. package/dist/Card/Card.js.map +1 -1
  6. package/dist/Card/CardBottomSection.cjs +2 -9
  7. package/dist/Card/CardBottomSection.cjs.map +1 -1
  8. package/dist/Card/CardBottomSection.d.ts +1 -2
  9. package/dist/Card/CardBottomSection.js +3 -10
  10. package/dist/Card/CardBottomSection.js.map +1 -1
  11. package/dist/Card/CardMiddleSection.cjs +2 -7
  12. package/dist/Card/CardMiddleSection.cjs.map +1 -1
  13. package/dist/Card/CardMiddleSection.d.ts +0 -2
  14. package/dist/Card/CardMiddleSection.js +3 -8
  15. package/dist/Card/CardMiddleSection.js.map +1 -1
  16. package/dist/Card/CardTopSection.cjs +9 -12
  17. package/dist/Card/CardTopSection.cjs.map +1 -1
  18. package/dist/Card/CardTopSection.d.ts +2 -4
  19. package/dist/Card/CardTopSection.js +10 -13
  20. package/dist/Card/CardTopSection.js.map +1 -1
  21. package/dist/Card/index.cjs +1 -13
  22. package/dist/Card/index.cjs.map +1 -1
  23. package/dist/Card/index.d.ts +0 -1
  24. package/dist/Card/index.js +0 -1
  25. package/dist/Card/index.js.map +1 -1
  26. package/dist/Chips/ActionChip.cjs +4 -4
  27. package/dist/Chips/ActionChip.cjs.map +1 -1
  28. package/dist/Chips/ActionChip.js +4 -4
  29. package/dist/Chips/ActionChip.js.map +1 -1
  30. package/dist/Chips/ChipStyles.cjs +3 -15
  31. package/dist/Chips/ChipStyles.cjs.map +1 -1
  32. package/dist/Chips/ChipStyles.d.ts +0 -3
  33. package/dist/Chips/ChipStyles.js +2 -5
  34. package/dist/Chips/ChipStyles.js.map +1 -1
  35. package/dist/Chips/ChipTypes.d.ts +6 -18
  36. package/dist/Chips/ChoiceChips.cjs +2 -2
  37. package/dist/Chips/ChoiceChips.cjs.map +1 -1
  38. package/dist/Chips/ChoiceChips.js +2 -2
  39. package/dist/Chips/ChoiceChips.js.map +1 -1
  40. package/dist/Chips/FilterChip.cjs +3 -3
  41. package/dist/Chips/FilterChip.cjs.map +1 -1
  42. package/dist/Chips/FilterChip.js +3 -3
  43. package/dist/Chips/FilterChip.js.map +1 -1
  44. package/dist/Chips/InputChip.cjs +4 -4
  45. package/dist/Chips/InputChip.cjs.map +1 -1
  46. package/dist/Chips/InputChip.js +4 -4
  47. package/dist/Chips/InputChip.js.map +1 -1
  48. package/dist/Chips/index.cjs +1 -1
  49. package/dist/Chips/index.cjs.map +1 -1
  50. package/dist/Chips/index.d.ts +1 -1
  51. package/dist/Chips/index.js +1 -1
  52. package/dist/Chips/index.js.map +1 -1
  53. package/dist/ChipsInput/ChipDropdownInput.cjs +398 -0
  54. package/dist/ChipsInput/ChipDropdownInput.cjs.map +1 -0
  55. package/dist/ChipsInput/ChipDropdownInput.d.ts +22 -0
  56. package/dist/ChipsInput/ChipDropdownInput.js +382 -0
  57. package/dist/ChipsInput/ChipDropdownInput.js.map +1 -0
  58. package/dist/ChipsInput/ChipInput.cjs +141 -0
  59. package/dist/ChipsInput/ChipInput.cjs.map +1 -0
  60. package/dist/{Chips → ChipsInput}/ChipInput.d.ts +1 -4
  61. package/dist/ChipsInput/ChipInput.js +122 -0
  62. package/dist/ChipsInput/ChipInput.js.map +1 -0
  63. package/dist/ChipsInput/ChipInputField.cjs +193 -0
  64. package/dist/ChipsInput/ChipInputField.cjs.map +1 -0
  65. package/dist/ChipsInput/ChipInputField.d.ts +24 -0
  66. package/dist/ChipsInput/ChipInputField.js +158 -0
  67. package/dist/ChipsInput/ChipInputField.js.map +1 -0
  68. package/dist/ChipsInput/ChipInputTypes.cjs +6 -0
  69. package/dist/ChipsInput/ChipInputTypes.cjs.map +1 -0
  70. package/dist/ChipsInput/ChipInputTypes.d.ts +22 -0
  71. package/dist/ChipsInput/ChipInputTypes.js +2 -0
  72. package/dist/ChipsInput/ChipInputTypes.js.map +1 -0
  73. package/dist/ChipsInput/index.cjs +19 -0
  74. package/dist/ChipsInput/index.cjs.map +1 -0
  75. package/dist/ChipsInput/index.d.ts +1 -0
  76. package/dist/ChipsInput/index.js +2 -0
  77. package/dist/ChipsInput/index.js.map +1 -0
  78. package/dist/Dropdown/DropdownContent.cjs +14 -21
  79. package/dist/Dropdown/DropdownContent.cjs.map +1 -1
  80. package/dist/Dropdown/DropdownContent.js +14 -21
  81. package/dist/Dropdown/DropdownContent.js.map +1 -1
  82. package/dist/Dropdown/index.cjs +0 -8
  83. package/dist/Dropdown/index.cjs.map +1 -1
  84. package/dist/Dropdown/index.d.ts +1 -2
  85. package/dist/Dropdown/index.js +1 -2
  86. package/dist/Dropdown/index.js.map +1 -1
  87. package/dist/InputFields/styling.cjs.map +1 -1
  88. package/dist/InputFields/styling.js.map +1 -1
  89. package/dist/index.cjs +14 -0
  90. package/dist/index.cjs.map +1 -1
  91. package/dist/index.d.ts +1 -0
  92. package/dist/index.js +1 -0
  93. package/dist/index.js.map +1 -1
  94. package/package.json +1 -1
  95. package/dist/Chips/ChipInput.cjs +0 -199
  96. package/dist/Chips/ChipInput.cjs.map +0 -1
  97. package/dist/Chips/ChipInput.js +0 -182
  98. package/dist/Chips/ChipInput.js.map +0 -1
  99. package/dist/Dropdown/ChipDropdownInput.cjs +0 -431
  100. package/dist/Dropdown/ChipDropdownInput.cjs.map +0 -1
  101. package/dist/Dropdown/ChipDropdownInput.d.ts +0 -24
  102. package/dist/Dropdown/ChipDropdownInput.js +0 -418
  103. package/dist/Dropdown/ChipDropdownInput.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/ChipStyles.ts"],"names":["styled","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","focusStyles","ChipContentContainer","div","ChipContent","Bold","ChipContainer","white","primary_500","primary_700","primary_800","neutral_600","neutral_200","primary_20","primary_200","primary_100","primary_300","warning_100","warning_600","warning_200","warning_700","warning_300","warning_800","critical_100","critical_600","critical_200","critical_700","critical_300","critical_800","neutral_100","neutral_300","ChipInputContainer","neutral_400","Regular","black","warning_500","critical_500","RequiredStar","span","ChipInputEl","input"],"mappings":"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","sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport {\n COLORS,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n focusStyles\n} from '../styles';\n\nexport const ChipContentContainer = styled.div`\n display: flex;\n align-items: center;\n min-height: 48px;\n`;\n\nexport const ChipContent = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n\n position: relative;\n display: flex;\n gap: 4px;\n align-items: center;\n min-height: 24px;\n box-sizing: border-box;\n border-radius: 24px;\n padding: 4px 12px;\n\n .chip-icon {\n height: 16px;\n width: 16px;\n border-radius: 50%;\n\n svg {\n height: 16px;\n width: 16px;\n }\n }\n\n .icon-left {\n margin-left: -4px;\n }\n\n .icon-right {\n margin-right: -4px;\n }\n\n .action-right {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 48px;\n width: 48px;\n right: -8px;\n }\n\n &.with-action-right {\n position: relative;\n padding-right: 28px;\n }\n\n`;\n\nexport const ChipContainer = styled.div`\n display: inline-block;\n cursor: pointer;\n position: relative;\n\n &.medium {\n ${ChipContent} {\n gap: 6px;\n padding: 10px 16px;\n\n ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n .chip-icon {\n height: 20px;\n width: 20px;\n\n svg {\n height: 20px;\n width: 20px;\n }\n }\n }\n\n .with-action-right {\n padding-right: 38px;\n\n .action-right {\n right: -2px;\n }\n }\n\n }\n\n &.large {\n ${ChipContent} {\n gap: 8px;\n padding: 12px 20px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n .chip-icon {\n height: 24px;\n width: 24px;\n\n svg {\n height: 24px;\n width: 24px;\n }\n }\n }\n\n .with-action-right {\n padding-right: 48px;\n\n .action-right {\n right: 4px;\n }\n }\n\n }\n\n &:focus {\n ${focusStyles}\n }\n\n &.normal {\n color: ${COLORS.white};\n\n ${ChipContent} {\n background-color: ${COLORS.primary_500};\n }\n }\n\n &.normal:hover:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_700};\n }\n }\n\n &.normal:active:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_800};\n }\n }\n\n\n &.outline {\n color: ${COLORS.neutral_600};\n\n ${ChipContent} {\n background-color: ${COLORS.white};\n border: 2px solid ${COLORS.neutral_200};\n }\n }\n\n &.outline:hover:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_20};\n border: 2px solid ${COLORS.primary_200};\n color: ${COLORS.primary_700};\n }\n }\n\n &.outline:active:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_100};\n border: 2px solid ${COLORS.primary_300};\n color: ${COLORS.primary_800};\n }\n }\n\n //account for border \n &.small.outline:not(.disabled) {\n ${ChipContent} {\n padding: 2px 10px;\n }\n }\n\n &.medium.outline:not(.disabled) {\n ${ChipContent} {\n padding: 8px 14px;\n }\n }\n\n &.large.outline:not(.disabled) {\n ${ChipContent} {\n padding: 10px 18px;\n }\n }\n\n &.warning {\n ${ChipContent} {\n background-color: ${COLORS.warning_100};\n color: ${COLORS.warning_600};\n }\n }\n\n &.warning:hover:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.warning_200};\n color: ${COLORS.warning_700};\n }\n }\n\n &.warning:active:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.warning_300};\n color: ${COLORS.warning_800};\n }\n }\n\n &.error {\n ${ChipContent} {\n background-color: ${COLORS.critical_100};\n color: ${COLORS.critical_600};\n }\n }\n\n\n &.error:hover:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.critical_200};\n color: ${COLORS.critical_700};\n }\n }\n\n &.error:active:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.critical_300};\n color: ${COLORS.critical_800};\n }\n }\n\n\n .action-right:focus {\n ${focusStyles}\n }\n\n .action-right:hover .chip-icon {\n background-color: ${COLORS.primary_700};\n }\n\n .action-right:active .chip-icon {\n background-color: ${COLORS.primary_800};\n }\n\n .action-right.disabled .chip-icon {\n background-color: transparent;\n color: ${COLORS.primary_300};\n }\n\n &.warning {\n\n .action-right:hover .chip-icon {\n background-color: ${COLORS.warning_200};\n color: ${COLORS.warning_700};\n }\n\n .action-right:active .chip-icon {\n background-color: ${COLORS.warning_300};\n color: ${COLORS.warning_800};\n }\n\n .action-right.disabled .chip-icon {\n background-color: transparent;\n color: ${COLORS.primary_300};\n }\n }\n\n &.error {\n .action-right:hover .chip-icon {\n background-color: ${COLORS.critical_200};\n color: ${COLORS.critical_700};\n }\n\n .action-right:active .chip-icon {\n background-color: ${COLORS.critical_300};\n color: ${COLORS.critical_800};\n }\n\n .action-right.disabled .chip-icon {\n background-color: transparent;\n color: ${COLORS.primary_300};\n }\n }\n\n\n &.disabled {\n cursor: not-allowed;\n\n ${ChipContentContainer} {\n pointer-events: none;\n }\n\n ${ChipContent} {\n border: none !important;\n background-color: ${COLORS.neutral_100} !important;\n color: ${COLORS.neutral_300} !important;\n }\n }\n`;\n\nexport const ChipInputContainer = styled.div`\n min-height: 56px;\n height: auto;\n width: 100%;\n border-radius: 4px;\n border: 2px solid transparent;\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_400};\n background-color: #fff;\n box-sizing: border-box;\n padding: 16px 16px 8px 16px;\n cursor: text;\n outline: none;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n color: ${COLORS.black} !important;\n\n &.warning,\n &.warning:hover {\n box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_500};\n }\n\n &.error,\n &.error:hover {\n box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_500};\n }\n\n > div {\n margin-right: 8px;\n margin-bottom: 8px;\n }\n\n &.active {\n box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n }\n\n &:hover {\n box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_700};\n }\n`;\n\nexport const RequiredStar = styled.span`\n color: ${COLORS.critical_500};\n font-size: 28px;\n line-height: 12px;\n float: right;\n font-weight: 700;\n position: relative;\n top: 10px;\n`;\n\nexport const ChipInputEl = styled.input`\n height: 40px;\n width: auto;\n display: inline-flex;\n border: none;\n outline: none;\n margin-top: 5px;\n margin-bottom: 8px;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n color: ${COLORS.black} !important;\n`;\n"],"file":"ChipStyles.js"}
1
+ {"version":3,"sources":["../../src/Chips/ChipStyles.ts"],"names":["styled","COLORS","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","focusStyles","ChipContentContainer","div","ChipContent","Bold","ChipContainer","white","primary_500","primary_700","primary_800","neutral_600","neutral_200","primary_20","primary_200","primary_100","primary_300","warning_100","warning_600","warning_200","warning_700","warning_300","warning_800","critical_100","critical_600","critical_200","critical_700","critical_300","critical_800","neutral_100","neutral_300"],"mappings":";;;;AAAA;AACA;AACA;AACA,OAAOA,MAAP,MAAmB,mBAAnB;AAEA;AACA;AACA;;AACA,SACEC,MADF,EAEEC,iBAFF,EAGEC,iBAHF,EAIEC,kBAJF,EAKEC,kBALF,EAMEC,WANF,QAOO,WAPP;AASA,OAAO,IAAMC,oBAAoB,GAAGP,MAAM,CAACQ,GAAV,sIAA1B;AAMP,OAAO,IAAMC,WAAW,GAAGT,MAAM,CAACQ,GAAV,6vBACpBH,kBAAkB,CAACD,kBAAkB,CAACM,IAApB,EAA0B,IAA1B,CADE,CAAjB;AAgDP,OAAO,IAAMC,aAAa,GAAGX,MAAM,CAACQ,GAAV,6vHAMpBC,WANoB,EAUlBN,iBAAiB,CAACC,kBAAkB,CAACM,IAApB,EAA0B,IAA1B,CAVC,EAiCpBD,WAjCoB,EAqClBP,iBAAiB,CAACE,kBAAkB,CAACM,IAApB,EAA0B,IAA1B,CArCC,EA4DpBJ,WA5DoB,EAgEbL,MAAM,CAACW,KAhEM,EAkEpBH,WAlEoB,EAmEAR,MAAM,CAACY,WAnEP,EAwEpBJ,WAxEoB,EAyEAR,MAAM,CAACa,WAzEP,EA8EpBL,WA9EoB,EA+EAR,MAAM,CAACc,WA/EP,EAqFbd,MAAM,CAACe,WArFM,EAuFpBP,WAvFoB,EAwFAR,MAAM,CAACW,KAxFP,EAyFAX,MAAM,CAACgB,WAzFP,EA8FpBR,WA9FoB,EA+FAR,MAAM,CAACiB,UA/FP,EAgGAjB,MAAM,CAACkB,WAhGP,EAiGXlB,MAAM,CAACa,WAjGI,EAsGpBL,WAtGoB,EAuGAR,MAAM,CAACmB,WAvGP,EAwGAnB,MAAM,CAACoB,WAxGP,EAyGXpB,MAAM,CAACc,WAzGI,EAgHpBN,WAhHoB,EAsHpBA,WAtHoB,EA4HpBA,WA5HoB,EAkIpBA,WAlIoB,EAmIAR,MAAM,CAACqB,WAnIP,EAoIXrB,MAAM,CAACsB,WApII,EAyIpBd,WAzIoB,EA0INR,MAAM,CAACuB,WA1ID,EA2IXvB,MAAM,CAACwB,WA3II,EAgJpBhB,WAhJoB,EAiJNR,MAAM,CAACyB,WAjJD,EAkJXzB,MAAM,CAAC0B,WAlJI,EAuJpBlB,WAvJoB,EAwJAR,MAAM,CAAC2B,YAxJP,EAyJX3B,MAAM,CAAC4B,YAzJI,EA8JpBpB,WA9JoB,EA+JNR,MAAM,CAAC6B,YA/JD,EAgKX7B,MAAM,CAAC8B,YAhKI,EAqKpBtB,WArKoB,EAsKNR,MAAM,CAAC+B,YAtKD,EAuKX/B,MAAM,CAACgC,YAvKI,EA6KpB3B,WA7KoB,EAiLFL,MAAM,CAACa,WAjLL,EAqLFb,MAAM,CAACc,WArLL,EA0Lbd,MAAM,CAACoB,WA1LM,EAgMApB,MAAM,CAACuB,WAhMP,EAiMXvB,MAAM,CAACwB,WAjMI,EAqMAxB,MAAM,CAACyB,WArMP,EAsMXzB,MAAM,CAAC0B,WAtMI,EA2MX1B,MAAM,CAACoB,WA3MI,EAiNApB,MAAM,CAAC6B,YAjNP,EAkNX7B,MAAM,CAAC8B,YAlNI,EAsNA9B,MAAM,CAAC+B,YAtNP,EAuNX/B,MAAM,CAACgC,YAvNI,EA4NXhC,MAAM,CAACoB,WA5NI,EAmOpBd,oBAnOoB,EAuOpBE,WAvOoB,EAyOAR,MAAM,CAACiC,WAzOP,EA0OXjC,MAAM,CAACkC,WA1OI,CAAnB","sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport {\n COLORS,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling,\n focusStyles\n} from '../styles';\n\nexport const ChipContentContainer = styled.div`\n display: flex;\n align-items: center;\n min-height: 48px;\n`;\n\nexport const ChipContent = styled.div`\n ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\n\n position: relative;\n display: flex;\n gap: 4px;\n align-items: center;\n min-height: 24px;\n box-sizing: border-box;\n border-radius: 24px;\n padding: 4px 12px;\n\n .chip-icon {\n height: 16px;\n width: 16px;\n border-radius: 50%;\n\n svg {\n height: 16px;\n width: 16px;\n }\n }\n\n .icon-left {\n margin-left: -4px;\n }\n\n .icon-right {\n margin-right: -4px;\n }\n\n .action-right {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 48px;\n width: 48px;\n right: -8px;\n }\n\n &.with-action-right {\n position: relative;\n padding-right: 28px;\n }\n\n`;\n\nexport const ChipContainer = styled.div`\n display: inline-block;\n cursor: pointer;\n position: relative;\n\n &.medium {\n ${ChipContent} {\n gap: 6px;\n padding: 10px 16px;\n\n ${ComponentSStyling(ComponentTextStyle.Bold, null)}\n .chip-icon {\n height: 20px;\n width: 20px;\n\n svg {\n height: 20px;\n width: 20px;\n }\n }\n }\n\n .with-action-right {\n padding-right: 38px;\n\n .action-right {\n right: -2px;\n }\n }\n\n }\n\n &.large {\n ${ChipContent} {\n gap: 8px;\n padding: 12px 20px;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, null)}\n .chip-icon {\n height: 24px;\n width: 24px;\n\n svg {\n height: 24px;\n width: 24px;\n }\n }\n }\n\n .with-action-right {\n padding-right: 48px;\n\n .action-right {\n right: 4px;\n }\n }\n\n }\n\n &.interactive:focus {\n ${focusStyles}\n }\n\n &.normal {\n color: ${COLORS.white};\n\n ${ChipContent} {\n background-color: ${COLORS.primary_500};\n }\n }\n\n &.interactive.normal:hover:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_700};\n }\n }\n\n &.interactive.normal:active:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_800};\n }\n }\n\n\n &.outline {\n color: ${COLORS.neutral_600};\n\n ${ChipContent} {\n background-color: ${COLORS.white};\n border: 2px solid ${COLORS.neutral_200};\n }\n }\n\n &.interactive.outline:hover:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_20};\n border: 2px solid ${COLORS.primary_200};\n color: ${COLORS.primary_700};\n }\n }\n\n &.interactive.outline:active:not(.action-within) {\n ${ChipContent} {\n background-color: ${COLORS.primary_100};\n border: 2px solid ${COLORS.primary_300};\n color: ${COLORS.primary_800};\n box-shadow: none;\n }\n }\n\n //account for border \n &.small.outline:not(.disabled) {\n ${ChipContent} {\n padding: 2px 10px;\n }\n }\n\n &.medium.outline:not(.disabled) {\n ${ChipContent} {\n padding: 8px 14px;\n }\n }\n\n &.large.outline:not(.disabled) {\n ${ChipContent} {\n padding: 10px 18px;\n }\n }\n\n &.warning {\n ${ChipContent} {\n background-color: ${COLORS.warning_100};\n color: ${COLORS.warning_600};\n }\n }\n\n &.interactive.warning:hover:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.warning_200};\n color: ${COLORS.warning_700};\n }\n }\n\n &.interactive.warning:active:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.warning_300};\n color: ${COLORS.warning_800};\n }\n }\n\n &.error {\n ${ChipContent} {\n background-color: ${COLORS.critical_100};\n color: ${COLORS.critical_600};\n }\n }\n\n &.interactive.error:hover:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.critical_200};\n color: ${COLORS.critical_700};\n }\n }\n\n &.interactive.error:active:not(.action-within) {\n ${ChipContent} {\n background: ${COLORS.critical_300};\n color: ${COLORS.critical_800};\n }\n }\n\n\n .action-right:focus {\n ${focusStyles}\n }\n\n .action-right:hover .chip-icon {\n background-color: ${COLORS.primary_700};\n }\n\n .action-right:active .chip-icon {\n background-color: ${COLORS.primary_800};\n }\n\n .action-right.disabled .chip-icon {\n background-color: transparent;\n color: ${COLORS.primary_300};\n }\n\n &.warning {\n\n .action-right:hover .chip-icon {\n background-color: ${COLORS.warning_200};\n color: ${COLORS.warning_700};\n }\n\n .action-right:active .chip-icon {\n background-color: ${COLORS.warning_300};\n color: ${COLORS.warning_800};\n }\n\n .action-right.disabled .chip-icon {\n background-color: transparent;\n color: ${COLORS.primary_300};\n }\n }\n\n &.error {\n .action-right:hover .chip-icon {\n background-color: ${COLORS.critical_200};\n color: ${COLORS.critical_700};\n }\n\n .action-right:active .chip-icon {\n background-color: ${COLORS.critical_300};\n color: ${COLORS.critical_800};\n }\n\n .action-right.disabled .chip-icon {\n background-color: transparent;\n color: ${COLORS.primary_300};\n }\n }\n\n &.disabled {\n cursor: not-allowed;\n\n ${ChipContentContainer} {\n pointer-events: none;\n }\n\n ${ChipContent} {\n border: none !important;\n background-color: ${COLORS.neutral_100} !important;\n color: ${COLORS.neutral_300} !important;\n }\n }\n`;\n"],"file":"ChipStyles.js"}
@@ -12,39 +12,27 @@ export interface InputChipProps extends ChipProps {
12
12
  icon?: ChipIcons;
13
13
  disableRemove?: boolean;
14
14
  onRemove: () => void;
15
- onClick: () => void;
15
+ onClick?: () => void;
16
16
  }
17
17
  export interface FilterChipProps extends ChipProps {
18
18
  text: string;
19
19
  selected: boolean;
20
- onClick: () => void;
20
+ onClick?: () => void;
21
21
  }
22
22
  export interface ActionChipProps extends ChipProps {
23
23
  text: string;
24
24
  icon?: ChipIcons;
25
- onClick: () => void;
25
+ onClick?: () => void;
26
26
  }
27
27
  export interface ChoiceChipProps extends ChipProps {
28
28
  selected: string;
29
29
  values: ChipValue[];
30
- onClick: (value: ChipValue) => void;
30
+ onClick?: (value: ChipValue) => void;
31
31
  }
32
32
  export interface ChipValue {
33
33
  value: string;
34
34
  label: string;
35
35
  size: Size;
36
36
  }
37
- export interface ChipInputProps {
38
- values: string[];
39
- icon?: ChipIcons;
40
- required?: boolean;
41
- validationType?: 'error' | 'warning';
42
- validationMessage?: string;
43
- variants?: ChipVariant[];
44
- inputId: string;
45
- placeholder?: string;
46
- onValueChange: (chips: string[]) => void;
47
- }
48
- declare type ChipIcons = 'Add' | 'ArrowDropDown' | 'ArrowDropUp' | 'ArrowLineDown' | 'ArrowLineLeft' | 'ArrowLineRight' | 'ArrowLineUp' | 'ArrowStopLeft' | 'ArrowStopRight' | 'Attachment' | 'Attention' | 'BackwardsFiveSec' | 'Book' | 'BookmarkOff' | 'BookmarkOn' | 'Bullet' | 'Calendar' | 'CheckboxOff' | 'CheckboxOn' | 'CheckboxSemi' | 'CheckComplete' | 'ChevronDown' | 'ChevronLeft' | 'ChevronRight' | 'ChevronUp' | 'Clear' | 'Close' | 'ClosedCaptionOff' | 'ClosedCaptionOn' | 'CloudAttention' | 'CloudCheck' | 'CloudDownload' | 'CloudLocked' | 'CloudNoConnection' | 'CloudSyncing' | 'CloudUpload' | 'Cloud' | 'Dashboard' | 'Delete' | 'Download' | 'DragHandle' | 'DragIndicator' | 'Edit' | 'Educator' | 'Equals' | 'EventLog' | 'ExtendTextArea' | 'Filter' | 'Forward' | 'ForwardSlash' | 'ForwardFiveSec' | 'FullscreenExit' | 'Fullscreen' | 'GearSettings' | 'GridView' | 'Group' | 'GuidedTour' | 'Help' | 'Hierarchy' | 'History' | 'Home' | 'Information' | 'Institute' | 'Language' | 'ListView' | 'LoadingMedium' | 'LoadingSmall' | 'LockedOff' | 'LockedOn' | 'Login' | 'Logout' | 'Loop' | 'Mail' | 'Manikin' | 'MapPoint' | 'Menu' | 'Minus' | 'MoreHorizontal' | 'MoreVertical' | 'NotificationNew' | 'Notification' | 'OpenFolder' | 'OpenNewWindow' | 'Pause' | 'PlayOutline' | 'Play' | 'Plus' | 'PointDown' | 'PointLeft' | 'PointRight' | 'PointUp' | 'RadioButtonOff' | 'RadioButtonOn' | 'Record' | 'Refresh' | 'Replay' | 'Rewind' | 'Save' | 'Search' | 'Share' | 'ShoppingCart' | 'StarFilled' | 'StarOutlined' | 'Stop' | 'Support' | 'Team' | 'ThumbsDown' | 'ThumbsUp' | 'TimeLimited' | 'Time' | 'Tip' | 'Upload' | 'Usb' | 'User' | 'Video' | 'VisibleOff' | 'VisibleOn' | 'VolumeDown' | 'VolumeOff' | 'VolumeUp';
49
- declare type ChipVariant = 'normal' | 'warning' | 'error';
50
- export {};
37
+ export declare type ChipIcons = 'Add' | 'ArrowDropDown' | 'ArrowDropUp' | 'ArrowLineDown' | 'ArrowLineLeft' | 'ArrowLineRight' | 'ArrowLineUp' | 'ArrowStopLeft' | 'ArrowStopRight' | 'Attachment' | 'Attention' | 'BackwardsFiveSec' | 'Book' | 'BookmarkOff' | 'BookmarkOn' | 'Bullet' | 'Calendar' | 'CheckboxOff' | 'CheckboxOn' | 'CheckboxSemi' | 'CheckComplete' | 'ChevronDown' | 'ChevronLeft' | 'ChevronRight' | 'ChevronUp' | 'Clear' | 'Close' | 'ClosedCaptionOff' | 'ClosedCaptionOn' | 'CloudAttention' | 'CloudCheck' | 'CloudDownload' | 'CloudLocked' | 'CloudNoConnection' | 'CloudSyncing' | 'CloudUpload' | 'Cloud' | 'Dashboard' | 'Delete' | 'Download' | 'DragHandle' | 'DragIndicator' | 'Edit' | 'Educator' | 'Equals' | 'EventLog' | 'ExtendTextArea' | 'Filter' | 'Forward' | 'ForwardSlash' | 'ForwardFiveSec' | 'FullscreenExit' | 'Fullscreen' | 'GearSettings' | 'GridView' | 'Group' | 'GuidedTour' | 'Help' | 'Hierarchy' | 'History' | 'Home' | 'Information' | 'Institute' | 'Language' | 'ListView' | 'LoadingMedium' | 'LoadingSmall' | 'LockedOff' | 'LockedOn' | 'Login' | 'Logout' | 'Loop' | 'Mail' | 'Manikin' | 'MapPoint' | 'Menu' | 'Minus' | 'MoreHorizontal' | 'MoreVertical' | 'NotificationNew' | 'Notification' | 'OpenFolder' | 'OpenNewWindow' | 'Pause' | 'PlayOutline' | 'Play' | 'Plus' | 'PointDown' | 'PointLeft' | 'PointRight' | 'PointUp' | 'RadioButtonOff' | 'RadioButtonOn' | 'Record' | 'Refresh' | 'Replay' | 'Rewind' | 'Save' | 'Search' | 'Share' | 'ShoppingCart' | 'StarFilled' | 'StarOutlined' | 'Stop' | 'Support' | 'Team' | 'ThumbsDown' | 'ThumbsUp' | 'TimeLimited' | 'Time' | 'Tip' | 'Upload' | 'Usb' | 'User' | 'Video' | 'VisibleOff' | 'VisibleOn' | 'VolumeDown' | 'VolumeOff' | 'VolumeUp';
38
+ export declare type ChipVariant = 'normal' | 'warning' | 'error';
@@ -60,7 +60,7 @@ var ChoiceChips = function ChoiceChips(_ref) {
60
60
  // Update selected chip
61
61
  setSelectedChip(value.value); // Fire the event
62
62
 
63
- onClick(value);
63
+ onClick && onClick(value);
64
64
  };
65
65
 
66
66
  var handleKeyDown = function handleKeyDown(e, value) {
@@ -77,7 +77,7 @@ var ChoiceChips = function ChoiceChips(_ref) {
77
77
  children: values.map(function (value) {
78
78
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContainer, {
79
79
  tabIndex: disabled ? -1 : 0,
80
- className: "".concat(value.size, " ").concat(disabled ? 'disabled' : '', " ").concat(selectedChip === value.value ? 'normal' : 'outline'),
80
+ className: "".concat(value.size, " ").concat(disabled ? 'disabled' : '', " ").concat(selectedChip === value.value ? 'normal' : 'outline', " interactive"),
81
81
  onMouseDown: _common.defaultOnMouseDownHandler,
82
82
  onClick: function onClick() {
83
83
  return !disabled && onSelectChip(value);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/ChoiceChips.tsx"],"names":["ChoiceChips","selected","disabled","onClick","values","React","useState","selectedChip","setSelectedChip","useEffect","onSelectChip","value","handleKeyDown","e","key","map","size","defaultOnMouseDownHandler","label"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAMA;;;;;;;;AAdA;AACA;AACA;;AAGA;AACA;AACA;AASA,IAAMA,WAAqD,GAAG,SAAxDA,WAAwD,OAKwB;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,QAGqB;AAAA,MAFrBC,OAEqB,QAFrBA,OAEqB;AAAA,MADrBC,MACqB,QADrBA,MACqB;;AACpF;AACF;AACA;AACE,wBAAwCC,KAAK,CAACC,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,eAArB;AAEA;AACF;AACA;;;AACEH,EAAAA,KAAK,CAACI,SAAN,CAAgB,YAAM;AACpBD,IAAAA,eAAe,CAACP,QAAD,CAAf;AACD,GAFD,EAEG,CAACA,QAAD,CAFH;AAIA;AACF;AACA;AACA;;AACE,MAAMS,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAsB;AACzC;AACAH,IAAAA,eAAe,CAACG,KAAK,CAACA,KAAP,CAAf,CAFyC,CAIzC;;AACAR,IAAAA,OAAO,CAACQ,KAAD,CAAP;AACD,GAND;;AAQA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAASF,KAAT,EAA8B;AAClD,QAAIE,CAAC,CAACC,GAAF,KAAU,OAAd,EAAuB;AACrBJ,MAAAA,YAAY,CAACC,KAAD,CAAZ;AACD;AACF,GAJD;AAMA;AACF;AACA;;;AACE,sBACE;AAAA,cACGP,MAAM,CAACW,GAAP,CAAW,UAACJ,KAAD;AAAA,0BACV,qBAAC,yBAAD;AAEE,QAAA,QAAQ,EAAET,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,QAAA,SAAS,YAAKS,KAAK,CAACK,IAAX,cAAmBd,QAAQ,GAAG,UAAH,GAAgB,EAA3C,cAAiDK,YAAY,KAAKI,KAAK,CAACA,KAAvB,GAA+B,QAA/B,GAA0C,SAA3F,CAHX;AAIE,QAAA,WAAW,EAAEM,iCAJf;AAKE,QAAA,OAAO,EAAE;AAAA,iBAAM,CAACf,QAAD,IAAaQ,YAAY,CAACC,KAAD,CAA/B;AAAA,SALX;AAME,QAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,iBAAI,CAACX,QAAD,IAAaU,aAAa,CAACC,CAAD,EAAIF,KAAJ,CAA9B;AAAA,SANd;AAAA,+BAOE,qBAAC,gCAAD;AAAA,iCACE,qBAAC,uBAAD;AAAA,sBACGA,KAAK,CAACO;AADT;AADF;AAPF,SACOP,KAAK,CAACA,KADb,CADU;AAAA,KAAX;AADH,IADF;AAmBD,CA1DD;;eA4DeX,W","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipValue, ChoiceChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst ChoiceChips: React.FunctionComponent<ChoiceChipProps> = ({\n selected,\n disabled,\n onClick,\n values\n }: ChoiceChipProps) => {\n /**\n * Globally used variables within the component.\n */\n const [selectedChip, setSelectedChip] = React.useState<string>('');\n\n /**\n * Set the selected value for the chip.\n */\n React.useEffect(() => {\n setSelectedChip(selected);\n }, [selected]);\n\n /**\n * Sets selected chip and fires an event to parent component.\n * @param value - Chip which was selected.\n */\n const onSelectChip = (value: ChipValue) => {\n // Update selected chip\n setSelectedChip(value.value);\n\n // Fire the event\n onClick(value);\n };\n\n const handleKeyDown = (e: any, value: ChipValue) => {\n if (e.key === 'Enter') {\n onSelectChip(value);\n }\n };\n\n /**\n * Return Choice Chip component.\n */\n return (\n <>\n {values.map((value: ChipValue) => (\n <ChipContainer\n key={value.value}\n tabIndex={disabled ? -1 : 0}\n className={`${value.size} ${disabled ? 'disabled' : ''} ${selectedChip === value.value ? 'normal' : 'outline'}`}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => !disabled && onSelectChip(value)}\n onKeyDown={e => !disabled && handleKeyDown(e, value)}>\n <ChipContentContainer>\n <ChipContent>\n {value.label}\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n ))}\n </>\n );\n};\n\nexport default ChoiceChips;\n"],"file":"ChoiceChips.cjs"}
1
+ {"version":3,"sources":["../../src/Chips/ChoiceChips.tsx"],"names":["ChoiceChips","selected","disabled","onClick","values","React","useState","selectedChip","setSelectedChip","useEffect","onSelectChip","value","handleKeyDown","e","key","map","size","defaultOnMouseDownHandler","label"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAMA;;;;;;;;AAdA;AACA;AACA;;AAGA;AACA;AACA;AASA,IAAMA,WAAqD,GAAG,SAAxDA,WAAwD,OAKwB;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,QAGqB;AAAA,MAFrBC,OAEqB,QAFrBA,OAEqB;AAAA,MADrBC,MACqB,QADrBA,MACqB;;AACpF;AACF;AACA;AACE,wBAAwCC,KAAK,CAACC,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,eAArB;AAEA;AACF;AACA;;;AACEH,EAAAA,KAAK,CAACI,SAAN,CAAgB,YAAM;AACpBD,IAAAA,eAAe,CAACP,QAAD,CAAf;AACD,GAFD,EAEG,CAACA,QAAD,CAFH;AAIA;AACF;AACA;AACA;;AACE,MAAMS,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAsB;AACzC;AACAH,IAAAA,eAAe,CAACG,KAAK,CAACA,KAAP,CAAf,CAFyC,CAIzC;;AACAR,IAAAA,OAAO,IAAIA,OAAO,CAACQ,KAAD,CAAlB;AACD,GAND;;AAQA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAASF,KAAT,EAA8B;AAClD,QAAIE,CAAC,CAACC,GAAF,KAAU,OAAd,EAAuB;AACrBJ,MAAAA,YAAY,CAACC,KAAD,CAAZ;AACD;AACF,GAJD;AAMA;AACF;AACA;;;AACE,sBACE;AAAA,cACGP,MAAM,CAACW,GAAP,CAAW,UAACJ,KAAD;AAAA,0BACV,qBAAC,yBAAD;AAEE,QAAA,QAAQ,EAAET,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,QAAA,SAAS,YAAKS,KAAK,CAACK,IAAX,cAAmBd,QAAQ,GAAG,UAAH,GAAgB,EAA3C,cAAiDK,YAAY,KAAKI,KAAK,CAACA,KAAvB,GAA+B,QAA/B,GAA0C,SAA3F,iBAHX;AAIE,QAAA,WAAW,EAAEM,iCAJf;AAKE,QAAA,OAAO,EAAE;AAAA,iBAAM,CAACf,QAAD,IAAaQ,YAAY,CAACC,KAAD,CAA/B;AAAA,SALX;AAME,QAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,iBAAI,CAACX,QAAD,IAAaU,aAAa,CAACC,CAAD,EAAIF,KAAJ,CAA9B;AAAA,SANd;AAAA,+BAOE,qBAAC,gCAAD;AAAA,iCACE,qBAAC,uBAAD;AAAA,sBACGA,KAAK,CAACO;AADT;AADF;AAPF,SACOP,KAAK,CAACA,KADb,CADU;AAAA,KAAX;AADH,IADF;AAmBD,CA1DD;;eA4DeX,W","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipValue, ChoiceChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst ChoiceChips: React.FunctionComponent<ChoiceChipProps> = ({\n selected,\n disabled,\n onClick,\n values\n }: ChoiceChipProps) => {\n /**\n * Globally used variables within the component.\n */\n const [selectedChip, setSelectedChip] = React.useState<string>('');\n\n /**\n * Set the selected value for the chip.\n */\n React.useEffect(() => {\n setSelectedChip(selected);\n }, [selected]);\n\n /**\n * Sets selected chip and fires an event to parent component.\n * @param value - Chip which was selected.\n */\n const onSelectChip = (value: ChipValue) => {\n // Update selected chip\n setSelectedChip(value.value);\n\n // Fire the event\n onClick && onClick(value);\n };\n\n const handleKeyDown = (e: any, value: ChipValue) => {\n if (e.key === 'Enter') {\n onSelectChip(value);\n }\n };\n\n /**\n * Return Choice Chip component.\n */\n return (\n <>\n {values.map((value: ChipValue) => (\n <ChipContainer\n key={value.value}\n tabIndex={disabled ? -1 : 0}\n className={`${value.size} ${disabled ? 'disabled' : ''} ${selectedChip === value.value ? 'normal' : 'outline'} interactive`}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => !disabled && onSelectChip(value)}\n onKeyDown={e => !disabled && handleKeyDown(e, value)}>\n <ChipContentContainer>\n <ChipContent>\n {value.label}\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n ))}\n </>\n );\n};\n\nexport default ChoiceChips;\n"],"file":"ChoiceChips.cjs"}
@@ -47,7 +47,7 @@ var ChoiceChips = function ChoiceChips(_ref) {
47
47
  // Update selected chip
48
48
  setSelectedChip(value.value); // Fire the event
49
49
 
50
- onClick(value);
50
+ onClick && onClick(value);
51
51
  };
52
52
 
53
53
  var handleKeyDown = function handleKeyDown(e, value) {
@@ -64,7 +64,7 @@ var ChoiceChips = function ChoiceChips(_ref) {
64
64
  children: values.map(function (value) {
65
65
  return /*#__PURE__*/_jsx(ChipContainer, {
66
66
  tabIndex: disabled ? -1 : 0,
67
- className: "".concat(value.size, " ").concat(disabled ? 'disabled' : '', " ").concat(selectedChip === value.value ? 'normal' : 'outline'),
67
+ className: "".concat(value.size, " ").concat(disabled ? 'disabled' : '', " ").concat(selectedChip === value.value ? 'normal' : 'outline', " interactive"),
68
68
  onMouseDown: defaultOnMouseDownHandler,
69
69
  onClick: function onClick() {
70
70
  return !disabled && onSelectChip(value);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/ChoiceChips.tsx"],"names":["React","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","ChoiceChips","selected","disabled","onClick","values","useState","selectedChip","setSelectedChip","useEffect","onSelectChip","value","handleKeyDown","e","key","map","size","label"],"mappings":";;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,SAAQC,aAAR,EAAuBC,WAAvB,EAAoCC,oBAApC,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;;;;AAEA,IAAMC,WAAqD,GAAG,SAAxDA,WAAwD,OAKwB;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,QAGqB;AAAA,MAFrBC,OAEqB,QAFrBA,OAEqB;AAAA,MADrBC,MACqB,QADrBA,MACqB;;AACpF;AACF;AACA;AACE,wBAAwCT,KAAK,CAACU,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,eAArB;AAEA;AACF;AACA;;;AACEZ,EAAAA,KAAK,CAACa,SAAN,CAAgB,YAAM;AACpBD,IAAAA,eAAe,CAACN,QAAD,CAAf;AACD,GAFD,EAEG,CAACA,QAAD,CAFH;AAIA;AACF;AACA;AACA;;AACE,MAAMQ,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAsB;AACzC;AACAH,IAAAA,eAAe,CAACG,KAAK,CAACA,KAAP,CAAf,CAFyC,CAIzC;;AACAP,IAAAA,OAAO,CAACO,KAAD,CAAP;AACD,GAND;;AAQA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAASF,KAAT,EAA8B;AAClD,QAAIE,CAAC,CAACC,GAAF,KAAU,OAAd,EAAuB;AACrBJ,MAAAA,YAAY,CAACC,KAAD,CAAZ;AACD;AACF,GAJD;AAMA;AACF;AACA;;;AACE,sBACE;AAAA,cACGN,MAAM,CAACU,GAAP,CAAW,UAACJ,KAAD;AAAA,0BACV,KAAC,aAAD;AAEE,QAAA,QAAQ,EAAER,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,QAAA,SAAS,YAAKQ,KAAK,CAACK,IAAX,cAAmBb,QAAQ,GAAG,UAAH,GAAgB,EAA3C,cAAiDI,YAAY,KAAKI,KAAK,CAACA,KAAvB,GAA+B,QAA/B,GAA0C,SAA3F,CAHX;AAIE,QAAA,WAAW,EAAEX,yBAJf;AAKE,QAAA,OAAO,EAAE;AAAA,iBAAM,CAACG,QAAD,IAAaO,YAAY,CAACC,KAAD,CAA/B;AAAA,SALX;AAME,QAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,iBAAI,CAACV,QAAD,IAAaS,aAAa,CAACC,CAAD,EAAIF,KAAJ,CAA9B;AAAA,SANd;AAAA,+BAOE,KAAC,oBAAD;AAAA,iCACE,KAAC,WAAD;AAAA,sBACGA,KAAK,CAACM;AADT;AADF;AAPF,SACON,KAAK,CAACA,KADb,CADU;AAAA,KAAX;AADH,IADF;AAmBD,CA1DD;;AA4DA,eAAeV,WAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipValue, ChoiceChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst ChoiceChips: React.FunctionComponent<ChoiceChipProps> = ({\n selected,\n disabled,\n onClick,\n values\n }: ChoiceChipProps) => {\n /**\n * Globally used variables within the component.\n */\n const [selectedChip, setSelectedChip] = React.useState<string>('');\n\n /**\n * Set the selected value for the chip.\n */\n React.useEffect(() => {\n setSelectedChip(selected);\n }, [selected]);\n\n /**\n * Sets selected chip and fires an event to parent component.\n * @param value - Chip which was selected.\n */\n const onSelectChip = (value: ChipValue) => {\n // Update selected chip\n setSelectedChip(value.value);\n\n // Fire the event\n onClick(value);\n };\n\n const handleKeyDown = (e: any, value: ChipValue) => {\n if (e.key === 'Enter') {\n onSelectChip(value);\n }\n };\n\n /**\n * Return Choice Chip component.\n */\n return (\n <>\n {values.map((value: ChipValue) => (\n <ChipContainer\n key={value.value}\n tabIndex={disabled ? -1 : 0}\n className={`${value.size} ${disabled ? 'disabled' : ''} ${selectedChip === value.value ? 'normal' : 'outline'}`}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => !disabled && onSelectChip(value)}\n onKeyDown={e => !disabled && handleKeyDown(e, value)}>\n <ChipContentContainer>\n <ChipContent>\n {value.label}\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n ))}\n </>\n );\n};\n\nexport default ChoiceChips;\n"],"file":"ChoiceChips.js"}
1
+ {"version":3,"sources":["../../src/Chips/ChoiceChips.tsx"],"names":["React","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","ChoiceChips","selected","disabled","onClick","values","useState","selectedChip","setSelectedChip","useEffect","onSelectChip","value","handleKeyDown","e","key","map","size","label"],"mappings":";;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,SAAQC,aAAR,EAAuBC,WAAvB,EAAoCC,oBAApC,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;;;;AAEA,IAAMC,WAAqD,GAAG,SAAxDA,WAAwD,OAKwB;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,QAGqB;AAAA,MAFrBC,OAEqB,QAFrBA,OAEqB;AAAA,MADrBC,MACqB,QADrBA,MACqB;;AACpF;AACF;AACA;AACE,wBAAwCT,KAAK,CAACU,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,eAArB;AAEA;AACF;AACA;;;AACEZ,EAAAA,KAAK,CAACa,SAAN,CAAgB,YAAM;AACpBD,IAAAA,eAAe,CAACN,QAAD,CAAf;AACD,GAFD,EAEG,CAACA,QAAD,CAFH;AAIA;AACF;AACA;AACA;;AACE,MAAMQ,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAsB;AACzC;AACAH,IAAAA,eAAe,CAACG,KAAK,CAACA,KAAP,CAAf,CAFyC,CAIzC;;AACAP,IAAAA,OAAO,IAAIA,OAAO,CAACO,KAAD,CAAlB;AACD,GAND;;AAQA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAASF,KAAT,EAA8B;AAClD,QAAIE,CAAC,CAACC,GAAF,KAAU,OAAd,EAAuB;AACrBJ,MAAAA,YAAY,CAACC,KAAD,CAAZ;AACD;AACF,GAJD;AAMA;AACF;AACA;;;AACE,sBACE;AAAA,cACGN,MAAM,CAACU,GAAP,CAAW,UAACJ,KAAD;AAAA,0BACV,KAAC,aAAD;AAEE,QAAA,QAAQ,EAAER,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,QAAA,SAAS,YAAKQ,KAAK,CAACK,IAAX,cAAmBb,QAAQ,GAAG,UAAH,GAAgB,EAA3C,cAAiDI,YAAY,KAAKI,KAAK,CAACA,KAAvB,GAA+B,QAA/B,GAA0C,SAA3F,iBAHX;AAIE,QAAA,WAAW,EAAEX,yBAJf;AAKE,QAAA,OAAO,EAAE;AAAA,iBAAM,CAACG,QAAD,IAAaO,YAAY,CAACC,KAAD,CAA/B;AAAA,SALX;AAME,QAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,iBAAI,CAACV,QAAD,IAAaS,aAAa,CAACC,CAAD,EAAIF,KAAJ,CAA9B;AAAA,SANd;AAAA,+BAOE,KAAC,oBAAD;AAAA,iCACE,KAAC,WAAD;AAAA,sBACGA,KAAK,CAACM;AADT;AADF;AAPF,SACON,KAAK,CAACA,KADb,CADU;AAAA,KAAX;AADH,IADF;AAmBD,CA1DD;;AA4DA,eAAeV,WAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipValue, ChoiceChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst ChoiceChips: React.FunctionComponent<ChoiceChipProps> = ({\n selected,\n disabled,\n onClick,\n values\n }: ChoiceChipProps) => {\n /**\n * Globally used variables within the component.\n */\n const [selectedChip, setSelectedChip] = React.useState<string>('');\n\n /**\n * Set the selected value for the chip.\n */\n React.useEffect(() => {\n setSelectedChip(selected);\n }, [selected]);\n\n /**\n * Sets selected chip and fires an event to parent component.\n * @param value - Chip which was selected.\n */\n const onSelectChip = (value: ChipValue) => {\n // Update selected chip\n setSelectedChip(value.value);\n\n // Fire the event\n onClick && onClick(value);\n };\n\n const handleKeyDown = (e: any, value: ChipValue) => {\n if (e.key === 'Enter') {\n onSelectChip(value);\n }\n };\n\n /**\n * Return Choice Chip component.\n */\n return (\n <>\n {values.map((value: ChipValue) => (\n <ChipContainer\n key={value.value}\n tabIndex={disabled ? -1 : 0}\n className={`${value.size} ${disabled ? 'disabled' : ''} ${selectedChip === value.value ? 'normal' : 'outline'} interactive`}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => !disabled && onSelectChip(value)}\n onKeyDown={e => !disabled && handleKeyDown(e, value)}>\n <ChipContentContainer>\n <ChipContent>\n {value.label}\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n ))}\n </>\n );\n};\n\nexport default ChoiceChips;\n"],"file":"ChoiceChips.js"}
@@ -44,14 +44,14 @@ var FilterChip = function FilterChip(_ref) {
44
44
  */
45
45
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
46
46
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContainer, {
47
- className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'normal' : 'outline'),
47
+ className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'normal' : 'outline', " ").concat(!!_onClick ? 'interactive' : ''),
48
48
  tabIndex: disabled ? -1 : 0,
49
49
  onKeyDown: function onKeyDown(e) {
50
- return e.key === 'Enter' && _onClick();
50
+ return e.key === 'Enter' && !disabled && _onClick && _onClick();
51
51
  },
52
52
  onMouseDown: _common.defaultOnMouseDownHandler,
53
53
  onClick: function onClick() {
54
- return _onClick();
54
+ return !disabled && _onClick && _onClick();
55
55
  },
56
56
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContentContainer, {
57
57
  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChipStyles.ChipContent, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["FilterChip","selected","text","size","disabled","onClick","e","key","defaultOnMouseDownHandler"],"mappings":";;;;;;;;;AAGA;;AAMA;;AAKA;;AAMA;;;;;;;;AApBA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AASA,IAAMA,UAAoD,GAAG,SAAvDA,UAAuD,OAMwB;AAAA,MALrBC,QAKqB,QALrBA,QAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,MAHrBC,IAGqB,QAHrBA,IAGqB;AAAA,MAFrBC,QAEqB,QAFrBA,QAEqB;AAAA,MADrBC,QACqB,QADrBA,OACqB;;AAGnF;AACF;AACA;AACE,sBACE;AAAA,2BACE,qBAAC,yBAAD;AAAe,MAAA,SAAS,YAAKF,IAAL,cAAaC,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CH,QAAQ,GAAG,QAAH,GAAc,SAAjE,CAAxB;AACe,MAAA,QAAQ,EAAEG,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CADzC;AAEe,MAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,eAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBF,QAAO,EAAhC;AAAA,OAF3B;AAGe,MAAA,WAAW,EAAEG,iCAH5B;AAIe,MAAA,OAAO,EAAE;AAAA,eAAMH,QAAO,EAAb;AAAA,OAJxB;AAAA,6BAKE,qBAAC,gCAAD;AAAA,+BACE,sBAAC,uBAAD;AAAA,qBACGJ,QAAQ,iBAAI;AAAK,YAAA,SAAS,EAAE,qBAAhB;AAAA,mCAAuC,qBAAC,kBAAD,CAAa,aAAb;AAA2B,cAAA,SAAS,EAAE;AAAtC;AAAvC,YADf,eAEE;AAAA,sBAAMC;AAAN,YAFF;AAAA;AADF;AALF;AADF,IADF;AAgBD,CA5BD;;eA8BeF,U","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n selected,\n text,\n size,\n disabled,\n onClick\n }: FilterChipProps) => {\n\n\n /**\n * Return Filter Chip component.\n */\n return (\n <>\n <ChipContainer className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'normal' : 'outline'}`}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={e => e.key === 'Enter' && onClick()}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => onClick()}>\n <ChipContentContainer>\n <ChipContent>\n {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckComplete className={'icon'}/></div>}\n <div>{text}</div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.cjs"}
1
+ {"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["FilterChip","selected","text","size","disabled","onClick","e","key","defaultOnMouseDownHandler"],"mappings":";;;;;;;;;AAGA;;AAMA;;AAKA;;AAMA;;;;;;;;AApBA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AASA,IAAMA,UAAoD,GAAG,SAAvDA,UAAuD,OAMwB;AAAA,MALrBC,QAKqB,QALrBA,QAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,MAHrBC,IAGqB,QAHrBA,IAGqB;AAAA,MAFrBC,QAEqB,QAFrBA,QAEqB;AAAA,MADrBC,QACqB,QADrBA,OACqB;;AAGnF;AACF;AACA;AACE,sBACE;AAAA,2BACE,qBAAC,yBAAD;AACE,MAAA,SAAS,YAAKF,IAAL,cAAaC,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CH,QAAQ,GAAG,QAAH,GAAc,SAAjE,cAA8E,CAAC,CAACI,QAAF,GAAY,aAAZ,GAA4B,EAA1G,CADX;AAEE,MAAA,QAAQ,EAAED,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,MAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,eAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqB,CAACH,QAAtB,IAAkCC,QAAlC,IAA6CA,QAAO,EAAxD;AAAA,OAHd;AAIE,MAAA,WAAW,EAAEG,iCAJf;AAKE,MAAA,OAAO,EAAE;AAAA,eAAM,CAACJ,QAAD,IAAaC,QAAb,IAAwBA,QAAO,EAArC;AAAA,OALX;AAAA,6BAME,qBAAC,gCAAD;AAAA,+BACE,sBAAC,uBAAD;AAAA,qBACGJ,QAAQ,iBAAI;AAAK,YAAA,SAAS,EAAE,qBAAhB;AAAA,mCAAuC,qBAAC,kBAAD,CAAa,aAAb;AAA2B,cAAA,SAAS,EAAE;AAAtC;AAAvC,YADf,eAEE;AAAA,sBAAMC;AAAN,YAFF;AAAA;AADF;AANF;AADF,IADF;AAiBD,CA7BD;;eA+BeF,U","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n selected,\n text,\n size,\n disabled,\n onClick\n }: FilterChipProps) => {\n\n\n /**\n * Return Filter Chip component.\n */\n return (\n <>\n <ChipContainer\n className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'normal' : 'outline'} ${!!onClick ? 'interactive' : ''}`}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={e => e.key === 'Enter' && !disabled && onClick && onClick()}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => !disabled && onClick && onClick()}>\n <ChipContentContainer>\n <ChipContent>\n {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckComplete className={'icon'}/></div>}\n <div>{text}</div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.cjs"}
@@ -33,14 +33,14 @@ var FilterChip = function FilterChip(_ref) {
33
33
  */
34
34
  return /*#__PURE__*/_jsx(_Fragment, {
35
35
  children: /*#__PURE__*/_jsx(ChipContainer, {
36
- className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'normal' : 'outline'),
36
+ className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'normal' : 'outline', " ").concat(!!_onClick ? 'interactive' : ''),
37
37
  tabIndex: disabled ? -1 : 0,
38
38
  onKeyDown: function onKeyDown(e) {
39
- return e.key === 'Enter' && _onClick();
39
+ return e.key === 'Enter' && !disabled && _onClick && _onClick();
40
40
  },
41
41
  onMouseDown: defaultOnMouseDownHandler,
42
42
  onClick: function onClick() {
43
- return _onClick();
43
+ return !disabled && _onClick && _onClick();
44
44
  },
45
45
  children: /*#__PURE__*/_jsx(ChipContentContainer, {
46
46
  children: /*#__PURE__*/_jsxs(ChipContent, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["React","SystemIcons","ChipContent","ChipContentContainer","ChipContainer","defaultOnMouseDownHandler","FilterChip","selected","text","size","disabled","onClick","e","key"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAGA;AACA;AACA;AACA,SAAQC,WAAR,QAA0B,gBAA1B;AAEA;AACA;AACA;;AACA,SAAQC,WAAR,EAAqBC,oBAArB,EAA2CC,aAA3C,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;;;;;AAEA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAMwB;AAAA,MALrBC,QAKqB,QALrBA,QAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,MAHrBC,IAGqB,QAHrBA,IAGqB;AAAA,MAFrBC,QAEqB,QAFrBA,QAEqB;AAAA,MADrBC,QACqB,QADrBA,OACqB;;AAGnF;AACF;AACA;AACE,sBACE;AAAA,2BACE,KAAC,aAAD;AAAe,MAAA,SAAS,YAAKF,IAAL,cAAaC,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CH,QAAQ,GAAG,QAAH,GAAc,SAAjE,CAAxB;AACe,MAAA,QAAQ,EAAEG,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CADzC;AAEe,MAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,eAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBF,QAAO,EAAhC;AAAA,OAF3B;AAGe,MAAA,WAAW,EAAEN,yBAH5B;AAIe,MAAA,OAAO,EAAE;AAAA,eAAMM,QAAO,EAAb;AAAA,OAJxB;AAAA,6BAKE,KAAC,oBAAD;AAAA,+BACE,MAAC,WAAD;AAAA,qBACGJ,QAAQ,iBAAI;AAAK,YAAA,SAAS,EAAE,qBAAhB;AAAA,mCAAuC,KAAC,WAAD,CAAa,aAAb;AAA2B,cAAA,SAAS,EAAE;AAAtC;AAAvC,YADf,eAEE;AAAA,sBAAMC;AAAN,YAFF;AAAA;AADF;AALF;AADF,IADF;AAgBD,CA5BD;;AA8BA,eAAeF,UAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n selected,\n text,\n size,\n disabled,\n onClick\n }: FilterChipProps) => {\n\n\n /**\n * Return Filter Chip component.\n */\n return (\n <>\n <ChipContainer className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'normal' : 'outline'}`}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={e => e.key === 'Enter' && onClick()}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => onClick()}>\n <ChipContentContainer>\n <ChipContent>\n {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckComplete className={'icon'}/></div>}\n <div>{text}</div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.js"}
1
+ {"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["React","SystemIcons","ChipContent","ChipContentContainer","ChipContainer","defaultOnMouseDownHandler","FilterChip","selected","text","size","disabled","onClick","e","key"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAGA;AACA;AACA;AACA,SAAQC,WAAR,QAA0B,gBAA1B;AAEA;AACA;AACA;;AACA,SAAQC,WAAR,EAAqBC,oBAArB,EAA2CC,aAA3C,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;;;;;AAEA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAMwB;AAAA,MALrBC,QAKqB,QALrBA,QAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,MAHrBC,IAGqB,QAHrBA,IAGqB;AAAA,MAFrBC,QAEqB,QAFrBA,QAEqB;AAAA,MADrBC,QACqB,QADrBA,OACqB;;AAGnF;AACF;AACA;AACE,sBACE;AAAA,2BACE,KAAC,aAAD;AACE,MAAA,SAAS,YAAKF,IAAL,cAAaC,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CH,QAAQ,GAAG,QAAH,GAAc,SAAjE,cAA8E,CAAC,CAACI,QAAF,GAAY,aAAZ,GAA4B,EAA1G,CADX;AAEE,MAAA,QAAQ,EAAED,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,MAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,eAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqB,CAACH,QAAtB,IAAkCC,QAAlC,IAA6CA,QAAO,EAAxD;AAAA,OAHd;AAIE,MAAA,WAAW,EAAEN,yBAJf;AAKE,MAAA,OAAO,EAAE;AAAA,eAAM,CAACK,QAAD,IAAaC,QAAb,IAAwBA,QAAO,EAArC;AAAA,OALX;AAAA,6BAME,KAAC,oBAAD;AAAA,+BACE,MAAC,WAAD;AAAA,qBACGJ,QAAQ,iBAAI;AAAK,YAAA,SAAS,EAAE,qBAAhB;AAAA,mCAAuC,KAAC,WAAD,CAAa,aAAb;AAA2B,cAAA,SAAS,EAAE;AAAtC;AAAvC,YADf,eAEE;AAAA,sBAAMC;AAAN,YAFF;AAAA;AADF;AANF;AADF,IADF;AAiBD,CA7BD;;AA+BA,eAAeF,UAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n selected,\n text,\n size,\n disabled,\n onClick\n }: FilterChipProps) => {\n\n\n /**\n * Return Filter Chip component.\n */\n return (\n <>\n <ChipContainer\n className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'normal' : 'outline'} ${!!onClick ? 'interactive' : ''}`}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={e => e.key === 'Enter' && !disabled && onClick && onClick()}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => !disabled && onClick && onClick()}>\n <ChipContentContainer>\n <ChipContent>\n {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckComplete className={'icon'}/></div>}\n <div>{text}</div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.js"}
@@ -61,14 +61,14 @@ var InputChip = function InputChip(_ref) {
61
61
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
62
62
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContainer, {
63
63
  ref: containerRef,
64
- className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(variant),
65
- tabIndex: disabled ? -1 : 0,
64
+ className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(variant, " ").concat(!!_onClick ? 'interactive' : ''),
65
+ tabIndex: disabled || !_onClick ? -1 : 0,
66
66
  onMouseDown: _common.defaultOnMouseDownHandler,
67
67
  onKeyDown: function onKeyDown(e) {
68
- return e.key === 'Enter' && _onClick();
68
+ return e.key === 'Enter' && _onClick && _onClick();
69
69
  },
70
70
  onClick: function onClick() {
71
- return _onClick();
71
+ return _onClick && _onClick();
72
72
  },
73
73
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContentContainer, {
74
74
  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChipStyles.ChipContent, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["InputChip","icon","text","variant","size","disabled","onClick","disableRemove","onRemove","containerRef","React","useRef","removeRef","onRemoveClick","event","stopPropagation","defaultOnMouseDownHandler","e","key","icons","className"],"mappings":";;;;;;;;;AAGA;;AAKA;;AAOA;;AAMA;;;;;;;;AArBA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AASA,IAAMA,SAAkD,GAAG,SAArDA,SAAqD,OASuB;AAAA,MARpBC,IAQoB,QARpBA,IAQoB;AAAA,MAPpBC,IAOoB,QAPpBA,IAOoB;AAAA,MANpBC,OAMoB,QANpBA,OAMoB;AAAA,MALpBC,IAKoB,QALpBA,IAKoB;AAAA,MAJpBC,QAIoB,QAJpBA,QAIoB;AAAA,MAHpBC,QAGoB,QAHpBA,OAGoB;AAAA,MAFpBC,aAEoB,QAFpBA,aAEoB;AAAA,MADpBC,QACoB,QADpBA,QACoB;AAEhF,MAAMC,YAAY,GAAGC,KAAK,CAACC,MAAN,CAA6B,IAA7B,CAArB;AACA,MAAMC,SAAS,GAAGF,KAAK,CAACC,MAAN,CAA6B,IAA7B,CAAlB;AAEA,+BAAgBF,YAAhB,EAA8B,CAACG,SAAD,CAA9B;AAEA;AACF;AACA;AACA;;AACE,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAoE;AACxF,KAAC,CAACA,KAAF,IAAWA,KAAK,CAACC,eAAN,EAAX;AACAP,IAAAA,QAAQ;AACT,GAHD;AAKA;AACF;AACA;;;AACE,sBACE;AAAA,2BACE,qBAAC,yBAAD;AAAe,MAAA,GAAG,EAAEC,YAApB;AACe,MAAA,SAAS,YAAKL,IAAL,cAAaC,QAAQ,GAAG,UAAH,GAAgB,EAArC,eAA4CF,OAA5C,CADxB;AAEe,MAAA,QAAQ,EAAEE,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAFzC;AAGe,MAAA,WAAW,EAAEW,iCAH5B;AAIe,MAAA,SAAS,EAAE,mBAAAC,CAAC;AAAA,eAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBZ,QAAO,EAAhC;AAAA,OAJ3B;AAKe,MAAA,OAAO,EAAE;AAAA,eAAMA,QAAO,EAAb;AAAA,OALxB;AAAA,6BAME,qBAAC,gCAAD;AAAA,+BACE,sBAAC,uBAAD;AAAa,UAAA,SAAS,EAAE,mBAAxB;AAAA,qBACGL,IAAI,iBAAI;AAAK,YAAA,SAAS,EAAE,qBAAhB;AAAA,sBAAwCkB,mBAAMlB,IAAN,EAAY;AAACmB,cAAAA,SAAS,EAAE;AAAZ,aAAZ;AAAxC,YADX,eAGE;AAAA,sBAAMlB;AAAN,YAHF,eAKE;AAAK,YAAA,GAAG,EAAEU,SAAV;AACK,YAAA,SAAS,yBAAkBL,aAAa,GAAG,UAAH,GAAgB,EAA/C,CADd;AAEK,YAAA,QAAQ,EAAEA,aAAa,IAAIF,QAAjB,GAA4B,CAAC,CAA7B,GAAiC,CAFhD;AAGK,YAAA,WAAW,EAAEW,iCAHlB;AAIK,YAAA,OAAO,EAAE,iBAAAC,CAAC;AAAA,qBAAI,CAACV,aAAD,IAAkBM,aAAa,CAACI,CAAD,CAAnC;AAAA,aAJf;AAKK,YAAA,SAAS,EAAE,mBAAAA,CAAC;AAAA,qBAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBL,aAAa,CAACI,CAAD,CAAtC;AAAA,aALjB;AAAA,mCAME;AAAK,cAAA,SAAS,EAAE,WAAhB;AAAA,qCACE,qBAAC,kBAAD,CAAa,KAAb;AAAmB,gBAAA,SAAS,EAAE;AAA9B;AADF;AANF,YALF;AAAA;AADF;AANF;AADF,IADF;AA6BD,CAzDD;;eA2DejB,S","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\nimport {IconButton} from '../Button/index';\nimport {Size} from '../types';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = ({\n icon,\n text,\n variant,\n size,\n disabled,\n onClick,\n disableRemove,\n onRemove\n }: InputChipProps) => {\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const removeRef = React.useRef<HTMLDivElement>(null);\n\n useActionWithin(containerRef, [removeRef]);\n\n /**\n * Calls onRemove action when remove button is clicked.\n * @param event - Event handler from the button click.\n */\n const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n !!event && event.stopPropagation();\n onRemove();\n };\n\n /**\n * Return Input Chip component.\n */\n return (\n <>\n <ChipContainer ref={containerRef}\n className={`${size} ${disabled ? 'disabled' : ''} ${variant}`}\n tabIndex={disabled ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onKeyDown={e => e.key === 'Enter' && onClick()}\n onClick={() => onClick()}>\n <ChipContentContainer>\n <ChipContent className={'with-action-right'}>\n {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n <div>{text}</div>\n\n <div ref={removeRef}\n className={`action-right ${disableRemove ? 'disabled' : ''}`}\n tabIndex={disableRemove || disabled ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={e => !disableRemove && onRemoveClick(e)}\n onKeyDown={e => e.key === 'Enter' && onRemoveClick(e)}>\n <div className={'chip-icon'}>\n <SystemIcons.Close className={'remove'}/>\n </div>\n </div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default InputChip;\n"],"file":"InputChip.cjs"}
1
+ {"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["InputChip","icon","text","variant","size","disabled","onClick","disableRemove","onRemove","containerRef","React","useRef","removeRef","onRemoveClick","event","stopPropagation","defaultOnMouseDownHandler","e","key","icons","className"],"mappings":";;;;;;;;;AAGA;;AAKA;;AAOA;;AAMA;;;;;;;;AArBA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AASA,IAAMA,SAAkD,GAAG,SAArDA,SAAqD,OASuB;AAAA,MARpBC,IAQoB,QARpBA,IAQoB;AAAA,MAPpBC,IAOoB,QAPpBA,IAOoB;AAAA,MANpBC,OAMoB,QANpBA,OAMoB;AAAA,MALpBC,IAKoB,QALpBA,IAKoB;AAAA,MAJpBC,QAIoB,QAJpBA,QAIoB;AAAA,MAHpBC,QAGoB,QAHpBA,OAGoB;AAAA,MAFpBC,aAEoB,QAFpBA,aAEoB;AAAA,MADpBC,QACoB,QADpBA,QACoB;AAEhF,MAAMC,YAAY,GAAGC,KAAK,CAACC,MAAN,CAA6B,IAA7B,CAArB;AACA,MAAMC,SAAS,GAAGF,KAAK,CAACC,MAAN,CAA6B,IAA7B,CAAlB;AAEA,+BAAgBF,YAAhB,EAA8B,CAACG,SAAD,CAA9B;AAEA;AACF;AACA;AACA;;AACE,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAoE;AACxF,KAAC,CAACA,KAAF,IAAWA,KAAK,CAACC,eAAN,EAAX;AACAP,IAAAA,QAAQ;AACT,GAHD;AAKA;AACF;AACA;;;AACE,sBACE;AAAA,2BACE,qBAAC,yBAAD;AAAe,MAAA,GAAG,EAAEC,YAApB;AACe,MAAA,SAAS,YAAKL,IAAL,cAAaC,QAAQ,GAAG,UAAH,GAAgB,EAArC,eAA4CF,OAA5C,cAAuD,CAAC,CAACG,QAAF,GAAY,aAAZ,GAA4B,EAAnF,CADxB;AAEe,MAAA,QAAQ,EAAED,QAAQ,IAAI,CAACC,QAAb,GAAuB,CAAC,CAAxB,GAA4B,CAFrD;AAGe,MAAA,WAAW,EAAEU,iCAH5B;AAIe,MAAA,SAAS,EAAE,mBAAAC,CAAC;AAAA,eAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBZ,QAArB,IAAgCA,QAAO,EAA3C;AAAA,OAJ3B;AAKe,MAAA,OAAO,EAAE;AAAA,eAAMA,QAAO,IAAIA,QAAO,EAAxB;AAAA,OALxB;AAAA,6BAME,qBAAC,gCAAD;AAAA,+BACE,sBAAC,uBAAD;AAAa,UAAA,SAAS,EAAE,mBAAxB;AAAA,qBACGL,IAAI,iBAAI;AAAK,YAAA,SAAS,EAAE,qBAAhB;AAAA,sBAAwCkB,mBAAMlB,IAAN,EAAY;AAACmB,cAAAA,SAAS,EAAE;AAAZ,aAAZ;AAAxC,YADX,eAGE;AAAA,sBAAMlB;AAAN,YAHF,eAKE;AAAK,YAAA,GAAG,EAAEU,SAAV;AACK,YAAA,SAAS,yBAAkBL,aAAa,GAAG,UAAH,GAAgB,EAA/C,CADd;AAEK,YAAA,QAAQ,EAAEA,aAAa,IAAIF,QAAjB,GAA4B,CAAC,CAA7B,GAAiC,CAFhD;AAGK,YAAA,WAAW,EAAEW,iCAHlB;AAIK,YAAA,OAAO,EAAE,iBAAAC,CAAC;AAAA,qBAAI,CAACV,aAAD,IAAkBM,aAAa,CAACI,CAAD,CAAnC;AAAA,aAJf;AAKK,YAAA,SAAS,EAAE,mBAAAA,CAAC;AAAA,qBAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBL,aAAa,CAACI,CAAD,CAAtC;AAAA,aALjB;AAAA,mCAME;AAAK,cAAA,SAAS,EAAE,WAAhB;AAAA,qCACE,qBAAC,kBAAD,CAAa,KAAb;AAAmB,gBAAA,SAAS,EAAE;AAA9B;AADF;AANF,YALF;AAAA;AADF;AANF;AADF,IADF;AA6BD,CAzDD;;eA2DejB,S","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\nimport {IconButton} from '../Button/index';\nimport {Size} from '../types';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = ({\n icon,\n text,\n variant,\n size,\n disabled,\n onClick,\n disableRemove,\n onRemove\n }: InputChipProps) => {\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const removeRef = React.useRef<HTMLDivElement>(null);\n\n useActionWithin(containerRef, [removeRef]);\n\n /**\n * Calls onRemove action when remove button is clicked.\n * @param event - Event handler from the button click.\n */\n const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n !!event && event.stopPropagation();\n onRemove();\n };\n\n /**\n * Return Input Chip component.\n */\n return (\n <>\n <ChipContainer ref={containerRef}\n className={`${size} ${disabled ? 'disabled' : ''} ${variant} ${!!onClick ? 'interactive' : ''}`}\n tabIndex={disabled || !onClick ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onKeyDown={e => e.key === 'Enter' && onClick && onClick()}\n onClick={() => onClick && onClick()}>\n <ChipContentContainer>\n <ChipContent className={'with-action-right'}>\n {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n <div>{text}</div>\n\n <div ref={removeRef}\n className={`action-right ${disableRemove ? 'disabled' : ''}`}\n tabIndex={disableRemove || disabled ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={e => !disableRemove && onRemoveClick(e)}\n onKeyDown={e => e.key === 'Enter' && onRemoveClick(e)}>\n <div className={'chip-icon'}>\n <SystemIcons.Close className={'remove'}/>\n </div>\n </div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default InputChip;\n"],"file":"InputChip.cjs"}
@@ -50,14 +50,14 @@ var InputChip = function InputChip(_ref) {
50
50
  return /*#__PURE__*/_jsx(_Fragment, {
51
51
  children: /*#__PURE__*/_jsx(ChipContainer, {
52
52
  ref: containerRef,
53
- className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(variant),
54
- tabIndex: disabled ? -1 : 0,
53
+ className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(variant, " ").concat(!!_onClick ? 'interactive' : ''),
54
+ tabIndex: disabled || !_onClick ? -1 : 0,
55
55
  onMouseDown: defaultOnMouseDownHandler,
56
56
  onKeyDown: function onKeyDown(e) {
57
- return e.key === 'Enter' && _onClick();
57
+ return e.key === 'Enter' && _onClick && _onClick();
58
58
  },
59
59
  onClick: function onClick() {
60
- return _onClick();
60
+ return _onClick && _onClick();
61
61
  },
62
62
  children: /*#__PURE__*/_jsx(ChipContentContainer, {
63
63
  children: /*#__PURE__*/_jsxs(ChipContent, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["React","SystemIcons","icons","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","useActionWithin","InputChip","icon","text","variant","size","disabled","onClick","disableRemove","onRemove","containerRef","useRef","removeRef","onRemoveClick","event","stopPropagation","e","key","className"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\nimport {IconButton} from '../Button/index';\nimport {Size} from '../types';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = ({\n icon,\n text,\n variant,\n size,\n disabled,\n onClick,\n disableRemove,\n onRemove\n }: InputChipProps) => {\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const removeRef = React.useRef<HTMLDivElement>(null);\n\n useActionWithin(containerRef, [removeRef]);\n\n /**\n * Calls onRemove action when remove button is clicked.\n * @param event - Event handler from the button click.\n */\n const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n !!event && event.stopPropagation();\n onRemove();\n };\n\n /**\n * Return Input Chip component.\n */\n return (\n <>\n <ChipContainer ref={containerRef}\n className={`${size} ${disabled ? 'disabled' : ''} ${variant}`}\n tabIndex={disabled ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onKeyDown={e => e.key === 'Enter' && onClick()}\n onClick={() => onClick()}>\n <ChipContentContainer>\n <ChipContent className={'with-action-right'}>\n {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n <div>{text}</div>\n\n <div ref={removeRef}\n className={`action-right ${disableRemove ? 'disabled' : ''}`}\n tabIndex={disableRemove || disabled ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={e => !disableRemove && onRemoveClick(e)}\n onKeyDown={e => e.key === 'Enter' && onRemoveClick(e)}>\n <div className={'chip-icon'}>\n <SystemIcons.Close className={'remove'}/>\n </div>\n </div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default InputChip;\n"],"file":"InputChip.js"}
1
+ {"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["React","SystemIcons","icons","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","useActionWithin","InputChip","icon","text","variant","size","disabled","onClick","disableRemove","onRemove","containerRef","useRef","removeRef","onRemoveClick","event","stopPropagation","e","key","className"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\nimport {IconButton} from '../Button/index';\nimport {Size} from '../types';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = ({\n icon,\n text,\n variant,\n size,\n disabled,\n onClick,\n disableRemove,\n onRemove\n }: InputChipProps) => {\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const removeRef = React.useRef<HTMLDivElement>(null);\n\n useActionWithin(containerRef, [removeRef]);\n\n /**\n * Calls onRemove action when remove button is clicked.\n * @param event - Event handler from the button click.\n */\n const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n !!event && event.stopPropagation();\n onRemove();\n };\n\n /**\n * Return Input Chip component.\n */\n return (\n <>\n <ChipContainer ref={containerRef}\n className={`${size} ${disabled ? 'disabled' : ''} ${variant} ${!!onClick ? 'interactive' : ''}`}\n tabIndex={disabled || !onClick ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onKeyDown={e => e.key === 'Enter' && onClick && onClick()}\n onClick={() => onClick && onClick()}>\n <ChipContentContainer>\n <ChipContent className={'with-action-right'}>\n {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n <div>{text}</div>\n\n <div ref={removeRef}\n className={`action-right ${disableRemove ? 'disabled' : ''}`}\n tabIndex={disableRemove || disabled ? -1 : 0}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={e => !disableRemove && onRemoveClick(e)}\n onKeyDown={e => e.key === 'Enter' && onRemoveClick(e)}>\n <div className={'chip-icon'}>\n <SystemIcons.Close className={'remove'}/>\n </div>\n </div>\n </ChipContent>\n </ChipContentContainer>\n </ChipContainer>\n </>\n );\n};\n\nexport default InputChip;\n"],"file":"InputChip.js"}
@@ -42,7 +42,7 @@ var _FilterChip = _interopRequireDefault(require("./FilterChip"));
42
42
 
43
43
  var _ActionChip = _interopRequireDefault(require("./ActionChip"));
44
44
 
45
- var _ChipInput = _interopRequireDefault(require("./ChipInput"));
45
+ var _ChipInput = _interopRequireDefault(require("../ChipsInput/ChipInput"));
46
46
 
47
47
  var _ChoiceChips = _interopRequireDefault(require("./ChoiceChips"));
48
48
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA","sourcesContent":["export { default as InputChip } from './InputChip';\nexport { default as FilterChip } from './FilterChip';\nexport { default as ActionChip } from './ActionChip';\nexport { default as ChipInput } from './ChipInput';\nexport { default as ChoiceChips } from './ChoiceChips';"],"file":"index.cjs"}
1
+ {"version":3,"sources":["../../src/Chips/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA","sourcesContent":["export { default as InputChip } from './InputChip';\nexport { default as FilterChip } from './FilterChip';\nexport { default as ActionChip } from './ActionChip';\nexport { default as ChipInput } from '../ChipsInput/ChipInput';\nexport { default as ChoiceChips } from './ChoiceChips';\n"],"file":"index.cjs"}
@@ -1,5 +1,5 @@
1
1
  export { default as InputChip } from './InputChip';
2
2
  export { default as FilterChip } from './FilterChip';
3
3
  export { default as ActionChip } from './ActionChip';
4
- export { default as ChipInput } from './ChipInput';
4
+ export { default as ChipInput } from '../ChipsInput/ChipInput';
5
5
  export { default as ChoiceChips } from './ChoiceChips';
@@ -1,6 +1,6 @@
1
1
  export { default as InputChip } from './InputChip';
2
2
  export { default as FilterChip } from './FilterChip';
3
3
  export { default as ActionChip } from './ActionChip';
4
- export { default as ChipInput } from './ChipInput';
4
+ export { default as ChipInput } from '../ChipsInput/ChipInput';
5
5
  export { default as ChoiceChips } from './ChoiceChips';
6
6
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Chips/index.ts"],"names":["default","InputChip","FilterChip","ActionChip","ChipInput","ChoiceChips"],"mappings":"AAAA,SAASA,OAAO,IAAIC,SAApB,QAAqC,aAArC;AACA,SAASD,OAAO,IAAIE,UAApB,QAAsC,cAAtC;AACA,SAASF,OAAO,IAAIG,UAApB,QAAsC,cAAtC;AACA,SAASH,OAAO,IAAII,SAApB,QAAqC,aAArC;AACA,SAASJ,OAAO,IAAIK,WAApB,QAAuC,eAAvC","sourcesContent":["export { default as InputChip } from './InputChip';\nexport { default as FilterChip } from './FilterChip';\nexport { default as ActionChip } from './ActionChip';\nexport { default as ChipInput } from './ChipInput';\nexport { default as ChoiceChips } from './ChoiceChips';"],"file":"index.js"}
1
+ {"version":3,"sources":["../../src/Chips/index.ts"],"names":["default","InputChip","FilterChip","ActionChip","ChipInput","ChoiceChips"],"mappings":"AAAA,SAASA,OAAO,IAAIC,SAApB,QAAqC,aAArC;AACA,SAASD,OAAO,IAAIE,UAApB,QAAsC,cAAtC;AACA,SAASF,OAAO,IAAIG,UAApB,QAAsC,cAAtC;AACA,SAASH,OAAO,IAAII,SAApB,QAAqC,yBAArC;AACA,SAASJ,OAAO,IAAIK,WAApB,QAAuC,eAAvC","sourcesContent":["export { default as InputChip } from './InputChip';\nexport { default as FilterChip } from './FilterChip';\nexport { default as ActionChip } from './ActionChip';\nexport { default as ChipInput } from '../ChipsInput/ChipInput';\nexport { default as ChoiceChips } from './ChoiceChips';\n"],"file":"index.js"}