@elliemae/ds-pills 1.60.0 → 2.0.0-alpha.12

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 (184) hide show
  1. package/cjs/components/Pill.js +34 -42
  2. package/cjs/components/PillButton.js +29 -23
  3. package/cjs/components/PillGroup.js +29 -37
  4. package/cjs/components/index.js +10 -36
  5. package/cjs/components/styled.js +36 -70
  6. package/cjs/components/types/DropdownPill.js +53 -43
  7. package/cjs/components/types/InputPill.js +28 -46
  8. package/cjs/components/types/LabelPill.js +24 -20
  9. package/cjs/components/types/ReadOnlyPill.js +27 -23
  10. package/cjs/components/types/RemovablePill.js +31 -37
  11. package/cjs/components/types/ValuePill.js +28 -24
  12. package/cjs/components/types/index.js +12 -34
  13. package/cjs/deprecated/DropdownPill.js +41 -44
  14. package/cjs/deprecated/InputPill.js +36 -27
  15. package/cjs/deprecated/LabeledDropdownPills.js +43 -54
  16. package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +74 -79
  17. package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +81 -116
  18. package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +95 -110
  19. package/cjs/deprecated/LabeledDropdownPillsTypes/utils.js +5 -8
  20. package/cjs/deprecated/LabeledPills.js +19 -27
  21. package/cjs/deprecated/OverflowPill.js +25 -42
  22. package/cjs/deprecated/Pill.js +48 -38
  23. package/cjs/deprecated/PillGroup.js +31 -18
  24. package/cjs/deprecated/ReadOnlyPill.js +60 -76
  25. package/cjs/deprecated/RemovablePill.js +19 -26
  26. package/cjs/deprecated/index.js +26 -51
  27. package/cjs/index.d.js +0 -1
  28. package/cjs/index.js +36 -76
  29. package/cjs/props.js +21 -44
  30. package/cjs/utils.js +7 -4
  31. package/esm/components/Pill.js +21 -29
  32. package/esm/components/PillButton.js +27 -20
  33. package/esm/components/PillGroup.js +27 -35
  34. package/esm/components/index.js +0 -26
  35. package/esm/components/styled.js +36 -71
  36. package/esm/components/types/DropdownPill.js +48 -39
  37. package/esm/components/types/InputPill.js +25 -43
  38. package/esm/components/types/LabelPill.js +21 -18
  39. package/esm/components/types/ReadOnlyPill.js +24 -21
  40. package/esm/components/types/RemovablePill.js +26 -33
  41. package/esm/components/types/ValuePill.js +25 -22
  42. package/esm/components/types/index.js +0 -22
  43. package/esm/deprecated/DropdownPill.js +37 -38
  44. package/esm/deprecated/InputPill.js +32 -23
  45. package/esm/deprecated/LabeledDropdownPills.js +33 -44
  46. package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +67 -70
  47. package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +72 -105
  48. package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +84 -96
  49. package/esm/deprecated/LabeledDropdownPillsTypes/utils.js +5 -8
  50. package/esm/deprecated/LabeledPills.js +14 -22
  51. package/esm/deprecated/OverflowPill.js +23 -39
  52. package/esm/deprecated/Pill.js +43 -32
  53. package/esm/deprecated/PillGroup.js +30 -18
  54. package/esm/deprecated/ReadOnlyPill.js +59 -74
  55. package/esm/deprecated/RemovablePill.js +18 -25
  56. package/esm/deprecated/index.js +0 -25
  57. package/esm/index.d.js +0 -1
  58. package/esm/index.js +0 -40
  59. package/esm/props.js +21 -44
  60. package/esm/utils.js +7 -4
  61. package/package.json +157 -23
  62. package/types/components/Pill.d.ts +5 -0
  63. package/types/components/PillButton.d.ts +5 -0
  64. package/types/components/PillGroup.d.ts +13 -0
  65. package/types/components/index.d.ts +3 -0
  66. package/types/components/styled.d.ts +24 -0
  67. package/types/components/types/DropdownPill.d.ts +3 -0
  68. package/types/components/types/InputPill.d.ts +3 -0
  69. package/types/components/types/LabelPill.d.ts +3 -0
  70. package/types/components/types/ReadOnlyPill.d.ts +3 -0
  71. package/types/components/types/RemovablePill.d.ts +3 -0
  72. package/types/components/types/ValuePill.d.ts +3 -0
  73. package/types/components/types/index.d.ts +6 -0
  74. package/types/deprecated/DropdownPill.d.ts +75 -0
  75. package/types/deprecated/InputPill.d.ts +10 -0
  76. package/types/deprecated/LabeledDropdownPills.d.ts +93 -0
  77. package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.d.ts +15 -0
  78. package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.d.ts +13 -0
  79. package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.d.ts +28 -0
  80. package/types/deprecated/LabeledDropdownPillsTypes/utils.d.ts +1 -0
  81. package/types/deprecated/LabeledPills.d.ts +59 -0
  82. package/types/deprecated/OverflowPill.d.ts +37 -0
  83. package/types/deprecated/Pill.d.ts +67 -0
  84. package/types/deprecated/PillGroup.d.ts +56 -0
  85. package/types/deprecated/ReadOnlyPill.d.ts +63 -0
  86. package/types/deprecated/RemovablePill.d.ts +55 -0
  87. package/types/deprecated/index.d.ts +9 -0
  88. package/types/index.d.ts +3 -0
  89. package/types/props.d.ts +92 -0
  90. package/types/tests/DSPill.test.d.ts +1 -0
  91. package/types/tests/DSPillGroup.test.d.ts +1 -0
  92. package/types/tests/events/DSPill.events.keyboard.test.d.ts +1 -0
  93. package/types/tests/events/DSPill.events.test.d.ts +1 -0
  94. package/types/tests/events/DSPillGroup.events.keyboard.test.d.ts +1 -0
  95. package/types/tests/events/DSPillGroup.events.test.d.ts +1 -0
  96. package/types/utils.d.ts +4 -0
  97. package/cjs/components/Pill.js.map +0 -1
  98. package/cjs/components/PillButton.js.map +0 -1
  99. package/cjs/components/PillGroup.js.map +0 -1
  100. package/cjs/components/index.js.map +0 -1
  101. package/cjs/components/styled.js.map +0 -1
  102. package/cjs/components/types/DropdownPill.js.map +0 -1
  103. package/cjs/components/types/InputPill.js.map +0 -1
  104. package/cjs/components/types/LabelPill.js.map +0 -1
  105. package/cjs/components/types/ReadOnlyPill.js.map +0 -1
  106. package/cjs/components/types/RemovablePill.js.map +0 -1
  107. package/cjs/components/types/ValuePill.js.map +0 -1
  108. package/cjs/components/types/index.js.map +0 -1
  109. package/cjs/deprecated/DropdownPill.js.map +0 -1
  110. package/cjs/deprecated/InputPill.js.map +0 -1
  111. package/cjs/deprecated/LabeledDropdownPills.js.map +0 -1
  112. package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +0 -1
  113. package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +0 -1
  114. package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +0 -1
  115. package/cjs/deprecated/LabeledDropdownPillsTypes/utils.js.map +0 -1
  116. package/cjs/deprecated/LabeledPills.js.map +0 -1
  117. package/cjs/deprecated/OverflowPill.js.map +0 -1
  118. package/cjs/deprecated/Pill.js.map +0 -1
  119. package/cjs/deprecated/PillGroup.js.map +0 -1
  120. package/cjs/deprecated/ReadOnlyPill.js.map +0 -1
  121. package/cjs/deprecated/RemovablePill.js.map +0 -1
  122. package/cjs/deprecated/index.js.map +0 -1
  123. package/cjs/index.d.js.map +0 -1
  124. package/cjs/index.js.map +0 -1
  125. package/cjs/props.js.map +0 -1
  126. package/cjs/utils.js.map +0 -1
  127. package/components/Pill/package.json +0 -10
  128. package/components/PillButton/package.json +0 -10
  129. package/components/PillGroup/package.json +0 -10
  130. package/components/package.json +0 -10
  131. package/components/styled/package.json +0 -10
  132. package/components/types/DropdownPill/package.json +0 -10
  133. package/components/types/InputPill/package.json +0 -10
  134. package/components/types/LabelPill/package.json +0 -10
  135. package/components/types/ReadOnlyPill/package.json +0 -10
  136. package/components/types/RemovablePill/package.json +0 -10
  137. package/components/types/ValuePill/package.json +0 -10
  138. package/components/types/package.json +0 -10
  139. package/deprecated/DropdownPill/package.json +0 -10
  140. package/deprecated/InputPill/package.json +0 -10
  141. package/deprecated/LabeledDropdownPills/package.json +0 -10
  142. package/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill/package.json +0 -10
  143. package/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill/package.json +0 -10
  144. package/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill/package.json +0 -10
  145. package/deprecated/LabeledDropdownPillsTypes/utils/package.json +0 -10
  146. package/deprecated/LabeledPills/package.json +0 -10
  147. package/deprecated/OverflowPill/package.json +0 -10
  148. package/deprecated/Pill/package.json +0 -10
  149. package/deprecated/PillGroup/package.json +0 -10
  150. package/deprecated/ReadOnlyPill/package.json +0 -10
  151. package/deprecated/RemovablePill/package.json +0 -10
  152. package/deprecated/package.json +0 -10
  153. package/esm/components/Pill.js.map +0 -1
  154. package/esm/components/PillButton.js.map +0 -1
  155. package/esm/components/PillGroup.js.map +0 -1
  156. package/esm/components/index.js.map +0 -1
  157. package/esm/components/styled.js.map +0 -1
  158. package/esm/components/types/DropdownPill.js.map +0 -1
  159. package/esm/components/types/InputPill.js.map +0 -1
  160. package/esm/components/types/LabelPill.js.map +0 -1
  161. package/esm/components/types/ReadOnlyPill.js.map +0 -1
  162. package/esm/components/types/RemovablePill.js.map +0 -1
  163. package/esm/components/types/ValuePill.js.map +0 -1
  164. package/esm/components/types/index.js.map +0 -1
  165. package/esm/deprecated/DropdownPill.js.map +0 -1
  166. package/esm/deprecated/InputPill.js.map +0 -1
  167. package/esm/deprecated/LabeledDropdownPills.js.map +0 -1
  168. package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +0 -1
  169. package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +0 -1
  170. package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +0 -1
  171. package/esm/deprecated/LabeledDropdownPillsTypes/utils.js.map +0 -1
  172. package/esm/deprecated/LabeledPills.js.map +0 -1
  173. package/esm/deprecated/OverflowPill.js.map +0 -1
  174. package/esm/deprecated/Pill.js.map +0 -1
  175. package/esm/deprecated/PillGroup.js.map +0 -1
  176. package/esm/deprecated/ReadOnlyPill.js.map +0 -1
  177. package/esm/deprecated/RemovablePill.js.map +0 -1
  178. package/esm/deprecated/index.js.map +0 -1
  179. package/esm/index.d.js.map +0 -1
  180. package/esm/index.js.map +0 -1
  181. package/esm/props.js.map +0 -1
  182. package/esm/utils.js.map +0 -1
  183. package/props/package.json +0 -10
  184. package/utils/package.json +0 -10
@@ -1,73 +1,50 @@
1
- import _extends from '@babel/runtime/helpers/esm/extends';
1
+ import _jsx from '@babel/runtime/helpers/esm/jsx';
2
2
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
3
- import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
4
3
  import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
5
- import React, { useState, useEffect, useCallback } from 'react';
4
+ import 'core-js/modules/web.dom-collections.iterator.js';
5
+ import 'core-js/modules/esnext.async-iterator.filter.js';
6
+ import 'core-js/modules/esnext.iterator.constructor.js';
7
+ import 'core-js/modules/esnext.iterator.filter.js';
8
+ import 'core-js/modules/esnext.async-iterator.map.js';
9
+ import 'core-js/modules/esnext.iterator.map.js';
10
+ import 'core-js/modules/esnext.async-iterator.for-each.js';
11
+ import 'core-js/modules/esnext.iterator.for-each.js';
12
+ import { useState, useEffect, useCallback } from 'react';
6
13
  import { find } from 'lodash';
7
14
  import { isFunction, addOrRemove } from '@elliemae/ds-utilities';
8
15
  import { RemovablePill } from '../RemovablePill.js';
9
16
  import { Pill } from '../Pill.js';
10
17
  import { OverflowPill } from '../OverflowPill.js';
11
18
  import { DropdownPill } from '../DropdownPill.js';
12
- import 'react-desc';
13
- import '@elliemae/ds-icons';
14
- import '@elliemae/ds-shared/FocusGroup/useFocusGroupItem';
15
- import '@elliemae/ds-classnames';
16
- import '@elliemae/ds-tooltip';
17
- import '@elliemae/ds-dropdownmenu';
19
+ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
18
20
 
19
- var _excluded = ["label", "options", "value", "onSelect", "onRemove", "onChange", "maxWidth", "minWidth"];
21
+ const _excluded = ["label", "options", "value", "onSelect", "onRemove", "onChange", "maxWidth", "minWidth"];
20
22
 
21
23
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
22
24
 
23
25
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
24
26
  function LabeledDropdownMultiPills(_ref) {
25
- var label = _ref.label,
26
- _ref$options = _ref.options,
27
- options = _ref$options === void 0 ? [] : _ref$options,
28
- _ref$value = _ref.value,
29
- value = _ref$value === void 0 ? [] : _ref$value,
30
- _ref$onSelect = _ref.onSelect,
31
- onSelect = _ref$onSelect === void 0 ? function () {
32
- return null;
33
- } : _ref$onSelect,
34
- _ref$onRemove = _ref.onRemove,
35
- onRemove = _ref$onRemove === void 0 ? function () {
36
- return null;
37
- } : _ref$onRemove,
38
- onChange = _ref.onChange,
39
- maxWidth = _ref.maxWidth,
40
- minWidth = _ref.minWidth,
27
+ let {
28
+ label,
29
+ options = [],
30
+ value = [],
31
+ onSelect = () => null,
32
+ onRemove = () => null,
33
+ onChange,
34
+ // if this is defined, then it's calculating the next result onSelect or onRemove
35
+ maxWidth,
36
+ minWidth
37
+ } = _ref,
41
38
  menuProps = _objectWithoutProperties(_ref, _excluded);
42
39
 
43
- var _useState = useState(0),
44
- _useState2 = _slicedToArray(_useState, 2),
45
- totalDefaultOptions = _useState2[0],
46
- setTotalDefaultOptions = _useState2[1];
47
-
48
- var _useState3 = useState(value),
49
- _useState4 = _slicedToArray(_useState3, 2),
50
- selectedOptions = _useState4[0],
51
- setSelectedOptions = _useState4[1];
52
-
53
- var _useState5 = useState(options),
54
- _useState6 = _slicedToArray(_useState5, 2),
55
- allOptions = _useState6[0],
56
- setAllOptions = _useState6[1];
57
-
58
- var _useState7 = useState([]),
59
- _useState8 = _slicedToArray(_useState7, 2),
60
- overflowOptions = _useState8[0],
61
- setOverflowOptions = _useState8[1];
62
-
63
- var overflowQuantity = 3;
64
- useEffect(function () {
65
- return setSelectedOptions(value);
66
- }, [value]);
67
- useEffect(function () {
68
- var newOptions = allOptions.filter(function (option) {
69
- return option.fixedItem;
70
- });
40
+ const [totalDefaultOptions, setTotalDefaultOptions] = useState(0);
41
+ const [selectedOptions, setSelectedOptions] = useState(value);
42
+ const [allOptions, setAllOptions] = useState(options);
43
+ const [overflowOptions, setOverflowOptions] = useState([]);
44
+ const overflowQuantity = 3;
45
+ useEffect(() => setSelectedOptions(value), [value]);
46
+ useEffect(() => {
47
+ const newOptions = allOptions.filter(option => option.fixedItem);
71
48
 
72
49
  if (newOptions.length > 0) {
73
50
  setSelectedOptions(newOptions);
@@ -75,9 +52,9 @@ function LabeledDropdownMultiPills(_ref) {
75
52
 
76
53
  setTotalDefaultOptions(newOptions.length);
77
54
  }, []);
78
- useEffect(function () {
55
+ useEffect(() => {
79
56
  if (totalDefaultOptions) {
80
- var newOptions = allOptions.map(function (opt) {
57
+ const newOptions = allOptions.map(opt => {
81
58
  if (selectedOptions.length <= totalDefaultOptions && find(selectedOptions, {
82
59
  id: opt.id
83
60
  })) {
@@ -93,20 +70,16 @@ function LabeledDropdownMultiPills(_ref) {
93
70
  setAllOptions(newOptions);
94
71
  }
95
72
  }, [onSelect, onRemove, selectedOptions]);
96
- useEffect(function () {
73
+ useEffect(() => {
97
74
  if (selectedOptions.length > overflowQuantity) {
98
- var overflow = selectedOptions.filter(function (val, index) {
99
- return index >= overflowQuantity;
100
- });
75
+ const overflow = selectedOptions.filter((val, index) => index >= overflowQuantity);
101
76
  setOverflowOptions(overflow);
102
77
  }
103
78
  }, [selectedOptions]);
104
- var selectOption = useCallback(function (option) {
79
+ const selectOption = useCallback(option => {
105
80
  if (!option.fixedItem) {
106
81
  if (isFunction(onChange)) {
107
- var nextValue = addOrRemove(selectedOptions, option, function (item) {
108
- return item.id;
109
- });
82
+ const nextValue = addOrRemove(selectedOptions, option, item => item.id);
110
83
  setSelectedOptions(nextValue);
111
84
  onChange(nextValue);
112
85
  }
@@ -114,12 +87,10 @@ function LabeledDropdownMultiPills(_ref) {
114
87
  onSelect(option);
115
88
  }
116
89
  }, [selectedOptions]);
117
- var removeOption = useCallback(function (option) {
90
+ const removeOption = useCallback(option => {
118
91
  if (!option.fixedItem || selectedOptions.length > totalDefaultOptions) {
119
92
  if (isFunction(onChange)) {
120
- var nextValue = selectedOptions.filter(function (val) {
121
- return option.id !== val.id;
122
- });
93
+ const nextValue = selectedOptions.filter(val => option.id !== val.id);
123
94
  setSelectedOptions(nextValue);
124
95
  onChange(nextValue);
125
96
  }
@@ -128,7 +99,7 @@ function LabeledDropdownMultiPills(_ref) {
128
99
  }
129
100
  }, [selectedOptions]);
130
101
 
131
- var typeOfPill = function typeOfPill() {
102
+ const typeOfPill = () => {
132
103
  if (selectedOptions.length > totalDefaultOptions) {
133
104
  return RemovablePill;
134
105
  }
@@ -136,43 +107,39 @@ function LabeledDropdownMultiPills(_ref) {
136
107
  return Pill;
137
108
  };
138
109
 
139
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownPill, _extends({}, menuProps, {
140
- focusOnOpen: false,
141
- label: label,
142
- maxWidth: maxWidth,
143
- minWidth: minWidth,
144
- onSelectMenuItem: selectOption,
145
- options: [_objectSpread(_objectSpread({}, menuProps), {}, {
146
- type: 'SelectionGroup',
147
- id: 'multi-selection-views',
148
- multi: true,
149
- items: allOptions
150
- })],
151
- selection: {
152
- 'multi-selection-views': selectedOptions ? selectedOptions.map(function (o) {
153
- return o.id;
154
- }) : ''
155
- },
156
- variant: "title"
157
- })), selectedOptions && selectedOptions.map(function (option, index) {
158
- var TypeOfPill = typeOfPill();
159
-
160
- if (index < overflowQuantity) {
161
- return /*#__PURE__*/React.createElement(TypeOfPill, {
162
- key: option.id,
163
- label: option.label,
164
- onRemove: function onRemove() {
165
- return removeOption(option);
166
- }
167
- });
168
- }
110
+ return /*#__PURE__*/jsxs(Fragment, {
111
+ children: [/*#__PURE__*/jsx(DropdownPill, _objectSpread(_objectSpread({}, menuProps), {}, {
112
+ focusOnOpen: false,
113
+ label: label,
114
+ maxWidth: maxWidth,
115
+ minWidth: minWidth,
116
+ onSelectMenuItem: selectOption,
117
+ options: [_objectSpread(_objectSpread({}, menuProps), {}, {
118
+ type: 'SelectionGroup',
119
+ id: 'multi-selection-views',
120
+ multi: true,
121
+ items: allOptions
122
+ })],
123
+ selection: {
124
+ 'multi-selection-views': selectedOptions ? selectedOptions.map(o => o.id) : ''
125
+ },
126
+ variant: "title"
127
+ })), selectedOptions && selectedOptions.map((option, index) => {
128
+ const TypeOfPill = typeOfPill();
129
+
130
+ if (index < overflowQuantity) {
131
+ return /*#__PURE__*/_jsx(TypeOfPill, {
132
+ label: option.label,
133
+ onRemove: () => removeOption(option)
134
+ }, option.id);
135
+ }
169
136
 
170
- return null;
171
- }), selectedOptions && selectedOptions.length > overflowQuantity && /*#__PURE__*/React.createElement(OverflowPill, {
172
- label: "+ ".concat(selectedOptions.length - overflowQuantity),
173
- options: overflowOptions
174
- }));
137
+ return null;
138
+ }), selectedOptions && selectedOptions.length > overflowQuantity && /*#__PURE__*/_jsx(OverflowPill, {
139
+ label: "+ ".concat(selectedOptions.length - overflowQuantity),
140
+ options: overflowOptions
141
+ })]
142
+ });
175
143
  }
176
144
 
177
145
  export { LabeledDropdownMultiPills as default };
178
- //# sourceMappingURL=LabeledDropdownMultiPill.js.map
@@ -1,60 +1,51 @@
1
- import _extends from '@babel/runtime/helpers/esm/extends';
1
+ import _jsx from '@babel/runtime/helpers/esm/jsx';
2
2
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
3
- import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
4
3
  import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
5
- import React, { useState, useEffect, useLayoutEffect, useCallback } from 'react';
6
- import PropTypes from 'prop-types';
4
+ import 'core-js/modules/web.dom-collections.iterator.js';
5
+ import 'core-js/modules/esnext.async-iterator.find.js';
6
+ import 'core-js/modules/esnext.iterator.constructor.js';
7
+ import 'core-js/modules/esnext.iterator.find.js';
8
+ import 'core-js/modules/esnext.async-iterator.filter.js';
9
+ import 'core-js/modules/esnext.iterator.filter.js';
10
+ import 'core-js/modules/esnext.async-iterator.for-each.js';
11
+ import 'core-js/modules/esnext.iterator.for-each.js';
12
+ import { useState, useEffect, useLayoutEffect, useCallback } from 'react';
7
13
  import { usePrevious, useShouldRecalculate, isFunction, isString } from '@elliemae/ds-utilities';
8
14
  import { DropdownPill } from '../DropdownPill.js';
9
15
  import { InputPill } from '../InputPill.js';
10
16
  import { Pill } from '../Pill.js';
11
17
  import { RemovablePill } from '../RemovablePill.js';
12
18
  import { hasOptionChanged } from './utils.js';
13
- import 'react-desc';
14
- import '@elliemae/ds-dropdownmenu';
15
- import '@elliemae/ds-icons';
16
- import '@elliemae/ds-shared/FocusGroup/useFocusGroupItem';
17
- import '@elliemae/ds-classnames';
18
- import '@elliemae/ds-form';
19
- import 'lodash';
19
+ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
20
20
 
21
- var _excluded = ["label", "labelIsValue", "options", "value", "onSelect", "onChange", "maxWidth", "minWidth", "fixed"],
22
- _excluded2 = ["input", "onChangeInput"];
21
+ var _Pill;
22
+
23
+ const _excluded = ["label", "labelIsValue", "options", "value", "onSelect", "onChange", "maxWidth", "minWidth", "fixed"],
24
+ _excluded2 = ["input", "onChangeInput"];
23
25
 
24
26
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
25
27
 
26
28
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
27
29
  function LabeledDropdownSinglePill(_ref) {
28
- var label = _ref.label,
29
- _ref$labelIsValue = _ref.labelIsValue,
30
- labelIsValue = _ref$labelIsValue === void 0 ? false : _ref$labelIsValue,
31
- options = _ref.options,
32
- value = _ref.value,
33
- _ref$onSelect = _ref.onSelect,
34
- onSelect = _ref$onSelect === void 0 ? function () {
35
- return null;
36
- } : _ref$onSelect,
37
- onChange = _ref.onChange,
38
- maxWidth = _ref.maxWidth,
39
- minWidth = _ref.minWidth,
40
- _ref$fixed = _ref.fixed,
41
- fixed = _ref$fixed === void 0 ? false : _ref$fixed,
30
+ let {
31
+ label,
32
+ labelIsValue = false,
33
+ options,
34
+ value,
35
+ onSelect = () => null,
36
+ onChange,
37
+ maxWidth,
38
+ minWidth,
39
+ fixed = false
40
+ } = _ref,
42
41
  menuProps = _objectWithoutProperties(_ref, _excluded);
43
42
 
44
- var _useState = useState(value),
45
- _useState2 = _slicedToArray(_useState, 2),
46
- optionValue = _useState2[0],
47
- setOptionValue = _useState2[1];
48
-
49
- var prevOptions = usePrevious(options);
50
- var areOptionsEqual = useShouldRecalculate(hasOptionChanged(prevOptions, options));
51
- useEffect(function () {
52
- return setOptionValue(value);
53
- }, [value]);
54
- useEffect(function () {
55
- var selectedValue = options.find(function (option) {
56
- return option.selected;
57
- });
43
+ const [optionValue, setOptionValue] = useState(value);
44
+ const prevOptions = usePrevious(options);
45
+ const areOptionsEqual = useShouldRecalculate(hasOptionChanged(prevOptions, options));
46
+ useEffect(() => setOptionValue(value), [value]);
47
+ useEffect(() => {
48
+ const selectedValue = options.find(option => option.selected);
58
49
 
59
50
  if (selectedValue) {
60
51
  setOptionValue(selectedValue);
@@ -62,15 +53,13 @@ function LabeledDropdownSinglePill(_ref) {
62
53
  setOptionValue(options[0]);
63
54
  }
64
55
  }, [areOptionsEqual]);
65
- useLayoutEffect(function () {
56
+ useLayoutEffect(() => {
66
57
  if (optionValue) {
67
- var selectedValue = options.find(function (option) {
68
- return option.id === optionValue.id;
69
- });
58
+ const selectedValue = options.find(option => option.id === optionValue.id);
70
59
  setOptionValue(selectedValue);
71
60
  }
72
61
  }, [options]);
73
- var selectOption = useCallback(function (option) {
62
+ const selectOption = useCallback(option => {
74
63
  if (isFunction(onChange)) {
75
64
  onChange(option);
76
65
  }
@@ -78,31 +67,43 @@ function LabeledDropdownSinglePill(_ref) {
78
67
  setOptionValue(option);
79
68
  onSelect(option);
80
69
  }, [onChange, onSelect]);
81
- var onChangeInputValue = useCallback(function (_ref2) {
82
- var inputValue = _ref2.target.value;
83
- var onChangeInput = optionValue.onChangeInput;
70
+ const onChangeInputValue = useCallback(_ref2 => {
71
+ let {
72
+ target: {
73
+ value: inputValue
74
+ }
75
+ } = _ref2;
76
+ const {
77
+ onChangeInput
78
+ } = optionValue;
84
79
  onChangeInput && onChangeInput(inputValue);
85
80
  }, [optionValue]);
86
81
 
87
- var removeOption = function removeOption(removedOption) {
88
- var onRemove = menuProps.onRemove;
89
- var onChangeInput = optionValue.onChangeInput;
82
+ const removeOption = removedOption => {
83
+ const {
84
+ onRemove
85
+ } = menuProps;
86
+ const {
87
+ onChangeInput
88
+ } = optionValue;
90
89
  setOptionValue(null);
91
90
  onChangeInput && onChangeInput('');
92
91
 
93
- var newOption = _objectSpread(_objectSpread({}, removedOption), {}, {
92
+ const newOption = _objectSpread(_objectSpread({}, removedOption), {}, {
94
93
  input: ''
95
94
  });
96
95
 
97
96
  onRemove && onRemove(newOption, removedOption);
98
97
  };
99
98
 
100
- var renderPill = function renderPill(option, fixed) {
101
- var input = option.input;
102
- option.onChangeInput;
103
- var otherProps = _objectWithoutProperties(option, _excluded2);
99
+ const renderPill = (option, fixed) => {
100
+ const {
101
+ input,
102
+ onChangeInput
103
+ } = option,
104
+ otherProps = _objectWithoutProperties(option, _excluded2);
104
105
 
105
- var SelectedPill;
106
+ let SelectedPill;
106
107
 
107
108
  if (isString(input)) {
108
109
  SelectedPill = InputPill;
@@ -112,55 +113,42 @@ function LabeledDropdownSinglePill(_ref) {
112
113
  SelectedPill = RemovablePill;
113
114
  }
114
115
 
115
- return /*#__PURE__*/React.createElement(SelectedPill, _extends({
116
- key: option.id,
116
+ return /*#__PURE__*/jsx(SelectedPill, _objectSpread({
117
117
  label: option.label,
118
118
  onChange: onChangeInputValue,
119
- onRemove: function onRemove(e) {
120
- return removeOption(option);
121
- },
119
+ onRemove: e => removeOption(option),
122
120
  value: input
123
- }, otherProps));
121
+ }, otherProps), option.id);
124
122
  };
125
123
 
126
- var renderSelection = function renderSelection() {
124
+ const renderSelection = () => {
127
125
  if (!labelIsValue) {
128
126
  if (optionValue) return renderPill(optionValue, fixed);
129
- return /*#__PURE__*/React.createElement(Pill, {
127
+ return _Pill || (_Pill = /*#__PURE__*/_jsx(Pill, {
130
128
  label: "-"
131
- });
129
+ }));
132
130
  }
133
131
  };
134
132
 
135
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownPill, _extends({}, menuProps, {
136
- label: !labelIsValue ? label : optionValue === null || optionValue === void 0 ? void 0 : optionValue.label,
137
- maxWidth: maxWidth,
138
- minWidth: minWidth,
139
- onSelectMenuItem: selectOption,
140
- options: [_objectSpread(_objectSpread({}, menuProps), {}, {
141
- type: 'SelectionGroup',
142
- id: 'multi-selection-views',
143
- multi: false,
144
- items: options,
145
- closeOnClick: true
146
- })],
147
- selection: {
148
- 'multi-selection-views': optionValue ? [optionValue === null || optionValue === void 0 ? void 0 : optionValue.id] : ''
149
- },
150
- variant: "title"
151
- })), renderSelection());
133
+ return /*#__PURE__*/jsxs(Fragment, {
134
+ children: [/*#__PURE__*/jsx(DropdownPill, _objectSpread(_objectSpread({}, menuProps), {}, {
135
+ label: !labelIsValue ? label : optionValue === null || optionValue === void 0 ? void 0 : optionValue.label,
136
+ maxWidth: maxWidth,
137
+ minWidth: minWidth,
138
+ onSelectMenuItem: selectOption,
139
+ options: [_objectSpread(_objectSpread({}, menuProps), {}, {
140
+ type: 'SelectionGroup',
141
+ id: 'multi-selection-views',
142
+ multi: false,
143
+ items: options,
144
+ closeOnClick: true
145
+ })],
146
+ selection: {
147
+ 'multi-selection-views': optionValue ? [optionValue === null || optionValue === void 0 ? void 0 : optionValue.id] : ''
148
+ },
149
+ variant: "title"
150
+ })), renderSelection()]
151
+ });
152
152
  }
153
- LabeledDropdownSinglePill.propTypes = {
154
- label: PropTypes.string,
155
- labelIsValue: PropTypes.bool,
156
- options: PropTypes.array,
157
- value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
158
- onSelect: PropTypes.func,
159
- onChange: PropTypes.func,
160
- maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
161
- minWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
162
- fixed: PropTypes.bool
163
- };
164
153
 
165
154
  export { LabeledDropdownSinglePill as default };
166
- //# sourceMappingURL=LabeledDropdownSinglePill.js.map
@@ -1,14 +1,12 @@
1
+ import 'core-js/modules/esnext.async-iterator.map.js';
2
+ import 'core-js/modules/esnext.iterator.map.js';
1
3
  import { isEqual } from '@elliemae/ds-utilities';
2
4
  import { omit } from 'lodash';
3
5
 
4
- var hasOptionChanged = function hasOptionChanged(prevOptions, options) {
6
+ const hasOptionChanged = (prevOptions, options) => {
5
7
  if (prevOptions && options) {
6
- var prevOptionsOmited = prevOptions.map(function (option) {
7
- return omit(option, ['input', 'onChangeInput', 'mask']);
8
- });
9
- var optionsOmited = options.map(function (option) {
10
- return omit(option, ['input', 'onChangeInput', 'mask']);
11
- });
8
+ const prevOptionsOmited = prevOptions.map(option => omit(option, ['input', 'onChangeInput', 'mask']));
9
+ const optionsOmited = options.map(option => omit(option, ['input', 'onChangeInput', 'mask']));
12
10
  return isEqual(prevOptionsOmited, optionsOmited);
13
11
  }
14
12
 
@@ -16,4 +14,3 @@ var hasOptionChanged = function hasOptionChanged(prevOptions, options) {
16
14
  };
17
15
 
18
16
  export { hasOptionChanged };
19
- //# sourceMappingURL=utils.js.map
@@ -1,30 +1,24 @@
1
- import React from 'react';
1
+ import _jsx from '@babel/runtime/helpers/esm/jsx';
2
+ import 'react';
2
3
  import { PropTypes, describe } from 'react-desc';
3
4
  import { PillGroup } from './PillGroup.js';
4
5
  import { RemovablePill } from './RemovablePill.js';
5
6
  import { Pill } from './Pill.js';
6
- import '@elliemae/ds-classnames';
7
- import '@elliemae/ds-shared/FocusGroup/FocusGroupManager';
8
- import '@elliemae/ds-utilities';
9
- import '@elliemae/ds-icons';
10
- import '@elliemae/ds-shared/FocusGroup/useFocusGroupItem';
11
- import '@babel/runtime/helpers/esm/extends';
12
- import '@babel/runtime/helpers/esm/objectWithoutProperties';
13
- import '@babel/runtime/helpers/esm/defineProperty';
14
7
 
15
8
  function LabeledPills(_ref) {
16
- var children = _ref.children,
17
- _ref$label = _ref.label,
18
- label = _ref$label === void 0 ? '' : _ref$label,
19
- leftAddon = _ref.leftAddon,
20
- onFocusGroupSet = _ref.onFocusGroupSet,
21
- onFocusNextGroup = _ref.onFocusNextGroup,
22
- onFocusPreviousGroup = _ref.onFocusPreviousGroup;
23
- return /*#__PURE__*/React.createElement(PillGroup, {
9
+ let {
10
+ children,
11
+ label = '',
12
+ leftAddon,
13
+ onFocusGroupSet,
14
+ onFocusNextGroup,
15
+ onFocusPreviousGroup
16
+ } = _ref;
17
+ return /*#__PURE__*/_jsx(PillGroup, {
24
18
  onFocusGroupSet: onFocusGroupSet,
25
19
  onFocusNextGroup: onFocusNextGroup,
26
20
  onFocusPreviousGroup: onFocusPreviousGroup
27
- }, /*#__PURE__*/React.createElement(Pill, {
21
+ }, void 0, /*#__PURE__*/_jsx(Pill, {
28
22
  label: label,
29
23
  leftAddon: leftAddon,
30
24
  variant: "title",
@@ -32,7 +26,7 @@ function LabeledPills(_ref) {
32
26
  }), children);
33
27
  }
34
28
 
35
- var props = {
29
+ const props = {
36
30
  /** labeled pill text label */
37
31
  label: PropTypes.string.isRequired.description('pill text label'),
38
32
 
@@ -53,9 +47,7 @@ var props = {
53
47
  /** focus group set callback */
54
48
  onFocusGroupSet: PropTypes.func.description('focus group set callback')
55
49
  };
56
- LabeledPills.propTypes = props;
57
- var DSLabeledPillsWithSchema = describe(LabeledPills);
50
+ const DSLabeledPillsWithSchema = describe(LabeledPills);
58
51
  DSLabeledPillsWithSchema.propTypes = props;
59
52
 
60
53
  export { DSLabeledPillsWithSchema, LabeledPills };
61
- //# sourceMappingURL=LabeledPills.js.map