@elliemae/ds-pills 3.3.0-next.2 → 3.3.0-next.5
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.
- package/dist/cjs/components/Pill.js +3 -15
- package/dist/cjs/components/Pill.js.map +1 -1
- package/dist/cjs/components/PillButton.js +4 -32
- package/dist/cjs/components/PillButton.js.map +1 -1
- package/dist/cjs/components/PillGroup.js +3 -19
- package/dist/cjs/components/PillGroup.js.map +1 -1
- package/dist/cjs/components/types/DropdownPill.js +4 -21
- package/dist/cjs/components/types/DropdownPill.js.map +1 -1
- package/dist/cjs/deprecated/DropdownPill.js +14 -50
- package/dist/cjs/deprecated/DropdownPill.js.map +1 -1
- package/dist/cjs/deprecated/InputPill.js +14 -46
- package/dist/cjs/deprecated/InputPill.js.map +1 -1
- package/dist/cjs/deprecated/LabeledDropdownPills.js +15 -53
- package/dist/cjs/deprecated/LabeledDropdownPills.js.map +1 -1
- package/dist/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +26 -64
- package/dist/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +1 -1
- package/dist/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +19 -55
- package/dist/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +1 -1
- package/dist/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +24 -60
- package/dist/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +1 -1
- package/dist/cjs/deprecated/Pill.js +14 -48
- package/dist/cjs/deprecated/Pill.js.map +1 -1
- package/dist/cjs/deprecated/PillGroup.js +3 -15
- package/dist/cjs/deprecated/PillGroup.js.map +1 -1
- package/dist/esm/components/Pill.js +3 -17
- package/dist/esm/components/Pill.js.map +1 -1
- package/dist/esm/components/PillButton.js +4 -34
- package/dist/esm/components/PillButton.js.map +1 -1
- package/dist/esm/components/PillGroup.js +3 -21
- package/dist/esm/components/PillGroup.js.map +1 -1
- package/dist/esm/components/types/DropdownPill.js +4 -23
- package/dist/esm/components/types/DropdownPill.js.map +1 -1
- package/dist/esm/deprecated/DropdownPill.js +14 -52
- package/dist/esm/deprecated/DropdownPill.js.map +1 -1
- package/dist/esm/deprecated/InputPill.js +14 -48
- package/dist/esm/deprecated/InputPill.js.map +1 -1
- package/dist/esm/deprecated/LabeledDropdownPills.js +15 -55
- package/dist/esm/deprecated/LabeledDropdownPills.js.map +1 -1
- package/dist/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +26 -66
- package/dist/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +1 -1
- package/dist/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +19 -57
- package/dist/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +1 -1
- package/dist/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +24 -62
- package/dist/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +1 -1
- package/dist/esm/deprecated/Pill.js +14 -50
- package/dist/esm/deprecated/Pill.js.map +1 -1
- package/dist/esm/deprecated/PillGroup.js +3 -17
- package/dist/esm/deprecated/PillGroup.js.map +1 -1
- package/package.json +15 -15
|
@@ -1,39 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
8
|
var __export = (target, all) => {
|
|
38
9
|
for (var name in all)
|
|
39
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -66,55 +37,45 @@ function renderMenuItems(options, factory) {
|
|
|
66
37
|
if (option.type === "submenu") {
|
|
67
38
|
const SubmenuComponent = factory("submenu");
|
|
68
39
|
const ChildComponent = factory("selection-group");
|
|
69
|
-
return /* @__PURE__ */ import_react.default.createElement(SubmenuComponent,
|
|
40
|
+
return /* @__PURE__ */ import_react.default.createElement(SubmenuComponent, {
|
|
41
|
+
...option,
|
|
70
42
|
key: option.id,
|
|
71
43
|
item: option
|
|
72
|
-
}
|
|
44
|
+
}, /* @__PURE__ */ import_react.default.createElement(ChildComponent, {
|
|
45
|
+
...option,
|
|
73
46
|
id: option.id,
|
|
74
47
|
item: option,
|
|
75
48
|
items: option.items,
|
|
76
49
|
itemValueAccessor: (item) => item,
|
|
77
50
|
multi: true
|
|
78
|
-
}))
|
|
51
|
+
}));
|
|
79
52
|
}
|
|
80
|
-
return /* @__PURE__ */ import_react.default.createElement(ItemComponent,
|
|
53
|
+
return /* @__PURE__ */ import_react.default.createElement(ItemComponent, {
|
|
54
|
+
...option,
|
|
81
55
|
key: option.id || index,
|
|
82
56
|
item: option
|
|
83
|
-
})
|
|
57
|
+
});
|
|
84
58
|
});
|
|
85
59
|
}
|
|
86
60
|
const getSubmenuOptionLabelById = (options, id) => {
|
|
87
61
|
const index = options.findIndex((option) => option.id === id);
|
|
88
62
|
return index ? options[index].label : "";
|
|
89
63
|
};
|
|
90
|
-
function LabeledDropdownCascadeMenuPill(
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
"label",
|
|
106
|
-
"options",
|
|
107
|
-
"value",
|
|
108
|
-
"onChange",
|
|
109
|
-
"onRemove",
|
|
110
|
-
"value",
|
|
111
|
-
"placeholder",
|
|
112
|
-
"onFocusNextGroup",
|
|
113
|
-
"onFocusPreviousGroup",
|
|
114
|
-
"onFocusGroupSet",
|
|
115
|
-
"maxWidth",
|
|
116
|
-
"minWidth"
|
|
117
|
-
]);
|
|
64
|
+
function LabeledDropdownCascadeMenuPill({
|
|
65
|
+
label,
|
|
66
|
+
options,
|
|
67
|
+
value: optionValue,
|
|
68
|
+
onChange,
|
|
69
|
+
onRemove,
|
|
70
|
+
value: selection = {},
|
|
71
|
+
placeholder = "---",
|
|
72
|
+
onFocusNextGroup,
|
|
73
|
+
onFocusPreviousGroup,
|
|
74
|
+
onFocusGroupSet,
|
|
75
|
+
maxWidth,
|
|
76
|
+
minWidth,
|
|
77
|
+
...menuProps
|
|
78
|
+
}) {
|
|
118
79
|
const selectionId = Object.keys(selection)[0];
|
|
119
80
|
const selectionValues = selection[selectionId] || "";
|
|
120
81
|
const dropdownLabel = Array.isArray(selectionValues) ? getSubmenuOptionLabelById(options, selectionId) : selectionValues;
|
|
@@ -141,7 +102,8 @@ function LabeledDropdownCascadeMenuPill(_a) {
|
|
|
141
102
|
onFocusGroupSet,
|
|
142
103
|
onFocusNextGroup,
|
|
143
104
|
onFocusPreviousGroup
|
|
144
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_DropdownPill.DropdownPill,
|
|
105
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_DropdownPill.DropdownPill, {
|
|
106
|
+
...menuProps,
|
|
145
107
|
itemsRenderer: renderMenuItems,
|
|
146
108
|
label: dropdownLabel || placeholder,
|
|
147
109
|
maxWidth,
|
|
@@ -153,7 +115,7 @@ function LabeledDropdownCascadeMenuPill(_a) {
|
|
|
153
115
|
},
|
|
154
116
|
singleGroupSelection: true,
|
|
155
117
|
variant: "title"
|
|
156
|
-
})
|
|
118
|
+
}), Array.isArray(selectionValues) && selectionValues.map((option) => /* @__PURE__ */ import_react.default.createElement(import_RemovablePill.RemovablePill, {
|
|
157
119
|
key: option.id,
|
|
158
120
|
label: option.label,
|
|
159
121
|
onRemove: () => removeOption(option)
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { isFunction, addOrRemove } from '@elliemae/ds-utilities';\nimport { PillGroup } from '../PillGroup';\nimport { RemovablePill } from '../RemovablePill';\nimport { DropdownPill } from '../DropdownPill';\n\nfunction renderMenuItems(options, factory) {\n return options.map((option, index) => {\n const ItemComponent = factory('radio');\n\n if (option.type === 'submenu') {\n const SubmenuComponent = factory('submenu');\n const ChildComponent = factory('selection-group');\n return (\n <SubmenuComponent {...option} key={option.id} item={option}>\n <ChildComponent\n {...option}\n id={option.id}\n item={option}\n items={option.items}\n itemValueAccessor={(item) => item}\n multi\n />\n </SubmenuComponent>\n );\n }\n\n return <ItemComponent {...option} key={option.id || index} item={option} />;\n });\n}\n\nconst getSubmenuOptionLabelById = (options, id) => {\n const index = options.findIndex((option) => option.id === id);\n return index ? options[index].label : '';\n};\n\nfunction LabeledDropdownCascadeMenuPill({\n label,\n options,\n value: optionValue,\n onChange,\n onRemove,\n value: selection = {},\n placeholder = '---',\n onFocusNextGroup,\n onFocusPreviousGroup,\n onFocusGroupSet,\n maxWidth,\n minWidth,\n ...menuProps\n}) {\n const selectionId = Object.keys(selection)[0];\n const selectionValues = selection[selectionId] || '';\n const dropdownLabel = Array.isArray(selectionValues)\n ? getSubmenuOptionLabelById(options, selectionId)\n : selectionValues;\n\n const handleSelectChange = ({ item, group }) => {\n if (isFunction(onChange)) {\n const nextSelection = group\n ? {\n [group.id]: addOrRemove([...(selection[group.id] || [])], item, (o) => o.id),\n }\n : {\n [item.id]: item.label,\n };\n onChange(nextSelection);\n }\n };\n\n const removeOption = (option) => {\n if (isFunction(onChange)) {\n const nextSelection = {\n [selectionId]: selectionValues.filter((val) => option.id !== val.id),\n };\n onChange(nextSelection);\n }\n onRemove(option);\n };\n\n return (\n <PillGroup\n onFocusGroupSet={onFocusGroupSet}\n onFocusNextGroup={onFocusNextGroup}\n onFocusPreviousGroup={onFocusPreviousGroup}\n >\n <DropdownPill\n {...menuProps}\n itemsRenderer={renderMenuItems}\n label={dropdownLabel || placeholder}\n maxWidth={maxWidth}\n minWidth={minWidth}\n onSelectChange={handleSelectChange}\n options={options}\n selection={{\n [selectionId]: Array.isArray(selectionValues) ? selectionValues.map((v) => v.id) : selectionValues,\n }}\n singleGroupSelection\n variant=\"title\"\n />\n {Array.isArray(selectionValues) &&\n selectionValues.map((option) => (\n <RemovablePill key={option.id} label={option.label} onRemove={() => removeOption(option)} />\n ))}\n </PillGroup>\n );\n}\n\nexport { LabeledDropdownCascadeMenuPill };\nexport default LabeledDropdownCascadeMenuPill;", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAwC;AACxC,uBAA0B;AAC1B,2BAA8B;AAC9B,0BAA6B;AAE7B,yBAAyB,SAAS,SAAS;AACzC,SAAO,QAAQ,IAAI,CAAC,QAAQ,UAAU;AACpC,UAAM,gBAAgB,QAAQ,OAAO;AAErC,QAAI,OAAO,SAAS,WAAW;AAC7B,YAAM,mBAAmB,QAAQ,SAAS;AAC1C,YAAM,iBAAiB,QAAQ,iBAAiB;AAChD,aACE,mDAAC;AAAA,QAAkB,GAAG;AAAA,QAAQ,KAAK,OAAO;AAAA,QAAI,MAAM;AAAA,SAClD,mDAAC;AAAA,QACE,GAAG;AAAA,QACJ,IAAI,OAAO;AAAA,QACX,MAAM;AAAA,QACN,OAAO,OAAO;AAAA,QACd,mBAAmB,CAAC,SAAS;AAAA,QAC7B,OAAK;AAAA,OACP,CACF;AAAA,IAEJ;AAEA,WAAO,mDAAC;AAAA,MAAe,GAAG;AAAA,MAAQ,KAAK,OAAO,MAAM;AAAA,MAAO,MAAM;AAAA,KAAQ;AAAA,EAC3E,CAAC;AACH;AAEA,MAAM,4BAA4B,CAAC,SAAS,OAAO;AACjD,QAAM,QAAQ,QAAQ,UAAU,CAAC,WAAW,OAAO,OAAO,EAAE;AAC5D,SAAO,QAAQ,QAAQ,OAAO,QAAQ;AACxC;AAEA,wCAAwC;AAAA,EACtC;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,OAAO,YAAY,CAAC;AAAA,EACpB,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,GACF;AACD,QAAM,cAAc,OAAO,KAAK,SAAS,EAAE;AAC3C,QAAM,kBAAkB,UAAU,gBAAgB;AAClD,QAAM,gBAAgB,MAAM,QAAQ,eAAe,IAC/C,0BAA0B,SAAS,WAAW,IAC9C;AAEJ,QAAM,qBAAqB,CAAC,EAAE,MAAM,YAAY;AAC9C,QAAI,oCAAW,QAAQ,GAAG;AACxB,YAAM,gBAAgB,QAClB;AAAA,QACE,CAAC,MAAM,KAAK,qCAAY,CAAC,GAAI,UAAU,MAAM,OAAO,CAAC,CAAE,GAAG,MAAM,CAAC,MAAM,EAAE,EAAE;AAAA,MAC7E,IACA;AAAA,QACE,CAAC,KAAK,KAAK,KAAK;AAAA,MAClB;AACJ,eAAS,aAAa;AAAA,IACxB;AAAA,EACF;AAEA,QAAM,eAAe,CAAC,WAAW;AAC/B,QAAI,oCAAW,QAAQ,GAAG;AACxB,YAAM,gBAAgB;AAAA,QACpB,CAAC,cAAc,gBAAgB,OAAO,CAAC,QAAQ,OAAO,OAAO,IAAI,EAAE;AAAA,MACrE;AACA,eAAS,aAAa;AAAA,IACxB;AACA,aAAS,MAAM;AAAA,EACjB;AAEA,SACE,mDAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,KAEA,mDAAC;AAAA,IACE,GAAG;AAAA,IACJ,eAAe;AAAA,IACf,OAAO,iBAAiB;AAAA,IACxB;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB;AAAA,IACA,WAAW;AAAA,MACT,CAAC,cAAc,MAAM,QAAQ,eAAe,IAAI,gBAAgB,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI;AAAA,IACrF;AAAA,IACA,sBAAoB;AAAA,IACpB,SAAQ;AAAA,GACV,GACC,MAAM,QAAQ,eAAe,KAC5B,gBAAgB,IAAI,CAAC,WACnB,mDAAC;AAAA,IAAc,KAAK,OAAO;AAAA,IAAI,OAAO,OAAO;AAAA,IAAO,UAAU,MAAM,aAAa,MAAM;AAAA,GAAG,CAC3F,CACL;AAEJ;AAGA,IAAO,yCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,39 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
8
|
var __export = (target, all) => {
|
|
38
9
|
for (var name in all)
|
|
39
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -62,26 +33,17 @@ var import_RemovablePill = require("../RemovablePill");
|
|
|
62
33
|
var import_Pill = require("../Pill");
|
|
63
34
|
var import_OverflowPill = require("../OverflowPill");
|
|
64
35
|
var import_DropdownPill = require("../DropdownPill");
|
|
65
|
-
function LabeledDropdownMultiPills(
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
"label",
|
|
77
|
-
"options",
|
|
78
|
-
"value",
|
|
79
|
-
"onSelect",
|
|
80
|
-
"onRemove",
|
|
81
|
-
"onChange",
|
|
82
|
-
"maxWidth",
|
|
83
|
-
"minWidth"
|
|
84
|
-
]);
|
|
36
|
+
function LabeledDropdownMultiPills({
|
|
37
|
+
label,
|
|
38
|
+
options = [],
|
|
39
|
+
value = [],
|
|
40
|
+
onSelect = () => null,
|
|
41
|
+
onRemove = () => null,
|
|
42
|
+
onChange,
|
|
43
|
+
maxWidth,
|
|
44
|
+
minWidth,
|
|
45
|
+
...menuProps
|
|
46
|
+
}) {
|
|
85
47
|
const [totalDefaultOptions, setTotalDefaultOptions] = (0, import_react.useState)(0);
|
|
86
48
|
const [selectedOptions, setSelectedOptions] = (0, import_react.useState)(value);
|
|
87
49
|
const [allOptions, setAllOptions] = (0, import_react.useState)(options);
|
|
@@ -99,9 +61,9 @@ function LabeledDropdownMultiPills(_a) {
|
|
|
99
61
|
if (totalDefaultOptions) {
|
|
100
62
|
const newOptions = allOptions.map((opt) => {
|
|
101
63
|
if (selectedOptions.length <= totalDefaultOptions && (0, import_lodash.find)(selectedOptions, { id: opt.id })) {
|
|
102
|
-
return
|
|
64
|
+
return { ...opt, fixedItem: true };
|
|
103
65
|
}
|
|
104
|
-
return
|
|
66
|
+
return { ...opt, fixedItem: false };
|
|
105
67
|
});
|
|
106
68
|
setAllOptions(newOptions);
|
|
107
69
|
}
|
|
@@ -138,25 +100,27 @@ function LabeledDropdownMultiPills(_a) {
|
|
|
138
100
|
}
|
|
139
101
|
return import_Pill.Pill;
|
|
140
102
|
};
|
|
141
|
-
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_DropdownPill.DropdownPill,
|
|
103
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_DropdownPill.DropdownPill, {
|
|
104
|
+
...menuProps,
|
|
142
105
|
focusOnOpen: false,
|
|
143
106
|
label,
|
|
144
107
|
maxWidth,
|
|
145
108
|
minWidth,
|
|
146
109
|
onSelectMenuItem: selectOption,
|
|
147
110
|
options: [
|
|
148
|
-
|
|
111
|
+
{
|
|
112
|
+
...menuProps,
|
|
149
113
|
type: "SelectionGroup",
|
|
150
114
|
id: "multi-selection-views",
|
|
151
115
|
multi: true,
|
|
152
116
|
items: allOptions
|
|
153
|
-
}
|
|
117
|
+
}
|
|
154
118
|
],
|
|
155
119
|
selection: {
|
|
156
120
|
"multi-selection-views": selectedOptions ? selectedOptions.map((o) => o.id) : ""
|
|
157
121
|
},
|
|
158
122
|
variant: "title"
|
|
159
|
-
})
|
|
123
|
+
}), selectedOptions && selectedOptions.map((option, index) => {
|
|
160
124
|
const TypeOfPill = typeOfPill();
|
|
161
125
|
if (index < overflowQuantity) {
|
|
162
126
|
return /* @__PURE__ */ import_react.default.createElement(TypeOfPill, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useState, useEffect, useCallback } from 'react';\nimport { find } from 'lodash';\nimport { isFunction, addOrRemove } from '@elliemae/ds-utilities';\nimport { RemovablePill } from '../RemovablePill';\nimport { Pill } from '../Pill';\nimport { OverflowPill } from '../OverflowPill';\nimport { DropdownPill } from '../DropdownPill';\n\nfunction LabeledDropdownMultiPills({\n label,\n options = [],\n value = [],\n onSelect = () => null,\n onRemove = () => null,\n onChange, // if this is defined, then it's calculating the next result onSelect or onRemove\n maxWidth,\n minWidth,\n ...menuProps\n}) {\n const [totalDefaultOptions, setTotalDefaultOptions] = useState(0);\n const [selectedOptions, setSelectedOptions] = useState(value);\n const [allOptions, setAllOptions] = useState(options);\n const [overflowOptions, setOverflowOptions] = useState([]);\n\n const overflowQuantity = 3;\n\n useEffect(() => setSelectedOptions(value), [value]);\n\n useEffect(() => {\n const newOptions = allOptions.filter((option) => option.fixedItem);\n if (newOptions.length > 0) {\n setSelectedOptions(newOptions);\n }\n setTotalDefaultOptions(newOptions.length);\n }, []);\n\n useEffect(() => {\n if (totalDefaultOptions) {\n const newOptions = allOptions.map((opt) => {\n if (selectedOptions.length <= totalDefaultOptions && find(selectedOptions, { id: opt.id })) {\n return { ...opt, fixedItem: true };\n }\n return { ...opt, fixedItem: false };\n });\n\n setAllOptions(newOptions);\n }\n }, [onSelect, onRemove, selectedOptions]);\n\n useEffect(() => {\n if (selectedOptions.length > overflowQuantity) {\n const overflow = selectedOptions.filter((val, index) => index >= overflowQuantity);\n setOverflowOptions(overflow);\n }\n }, [selectedOptions]);\n\n const selectOption = useCallback(\n (option) => {\n if (!option.fixedItem) {\n if (isFunction(onChange)) {\n const nextValue = addOrRemove(selectedOptions, option, (item) => item.id);\n setSelectedOptions(nextValue);\n onChange(nextValue);\n }\n onSelect(option);\n }\n },\n [selectedOptions],\n );\n\n const removeOption = useCallback(\n (option) => {\n if (!option.fixedItem || selectedOptions.length > totalDefaultOptions) {\n if (isFunction(onChange)) {\n const nextValue = selectedOptions.filter((val) => option.id !== val.id);\n setSelectedOptions(nextValue);\n onChange(nextValue);\n }\n onRemove(option);\n }\n },\n [selectedOptions],\n );\n\n const typeOfPill = () => {\n if (selectedOptions.length > totalDefaultOptions) {\n return RemovablePill;\n }\n\n return Pill;\n };\n\n return (\n <>\n <DropdownPill\n {...menuProps}\n focusOnOpen={false}\n label={label}\n maxWidth={maxWidth}\n minWidth={minWidth}\n onSelectMenuItem={selectOption}\n options={[\n {\n ...menuProps,\n type: 'SelectionGroup',\n id: 'multi-selection-views',\n multi: true,\n items: allOptions,\n },\n ]}\n selection={{\n 'multi-selection-views': selectedOptions ? selectedOptions.map((o) => o.id) : '',\n }}\n variant=\"title\"\n />\n {selectedOptions &&\n selectedOptions.map((option, index) => {\n const TypeOfPill = typeOfPill();\n if (index < overflowQuantity) {\n return <TypeOfPill key={option.id} label={option.label} onRemove={() => removeOption(option)} />;\n }\n return null;\n })}\n {selectedOptions && selectedOptions.length > overflowQuantity && (\n <OverflowPill label={`+ ${selectedOptions.length - overflowQuantity}`} options={overflowOptions} />\n )}\n </>\n );\n}\n\nexport { LabeledDropdownMultiPills };\nexport default LabeledDropdownMultiPills;", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,39 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
8
|
var __export = (target, all) => {
|
|
38
9
|
for (var name in all)
|
|
39
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -63,28 +34,18 @@ var import_InputPill = require("../InputPill");
|
|
|
63
34
|
var import_Pill = require("../Pill");
|
|
64
35
|
var import_RemovablePill = require("../RemovablePill");
|
|
65
36
|
var import_utils = require("./utils");
|
|
66
|
-
function LabeledDropdownSinglePill(
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
"label",
|
|
79
|
-
"labelIsValue",
|
|
80
|
-
"options",
|
|
81
|
-
"value",
|
|
82
|
-
"onSelect",
|
|
83
|
-
"onChange",
|
|
84
|
-
"maxWidth",
|
|
85
|
-
"minWidth",
|
|
86
|
-
"fixed"
|
|
87
|
-
]);
|
|
37
|
+
function LabeledDropdownSinglePill({
|
|
38
|
+
label,
|
|
39
|
+
labelIsValue = false,
|
|
40
|
+
options,
|
|
41
|
+
value,
|
|
42
|
+
onSelect = () => null,
|
|
43
|
+
onChange,
|
|
44
|
+
maxWidth,
|
|
45
|
+
minWidth,
|
|
46
|
+
fixed = false,
|
|
47
|
+
...menuProps
|
|
48
|
+
}) {
|
|
88
49
|
const [optionValue, setOptionValue] = (0, import_react.useState)(value);
|
|
89
50
|
const prevOptions = (0, import_ds_utilities.usePrevious)(options);
|
|
90
51
|
const areOptionsEqual = (0, import_ds_utilities.useShouldRecalculate)((0, import_utils.hasOptionChanged)(prevOptions, options));
|
|
@@ -119,11 +80,11 @@ function LabeledDropdownSinglePill(_a) {
|
|
|
119
80
|
const { onChangeInput } = optionValue;
|
|
120
81
|
setOptionValue(null);
|
|
121
82
|
onChangeInput && onChangeInput("");
|
|
122
|
-
const newOption =
|
|
83
|
+
const newOption = { ...removedOption, input: "" };
|
|
123
84
|
onRemove && onRemove(newOption, removedOption);
|
|
124
85
|
};
|
|
125
86
|
const renderPill = (option, fixed2) => {
|
|
126
|
-
const
|
|
87
|
+
const { input, onChangeInput, ...otherProps } = option;
|
|
127
88
|
let SelectedPill;
|
|
128
89
|
if ((0, import_ds_utilities.isString)(input)) {
|
|
129
90
|
SelectedPill = import_InputPill.InputPill;
|
|
@@ -132,13 +93,14 @@ function LabeledDropdownSinglePill(_a) {
|
|
|
132
93
|
} else {
|
|
133
94
|
SelectedPill = import_RemovablePill.RemovablePill;
|
|
134
95
|
}
|
|
135
|
-
return /* @__PURE__ */ import_react.default.createElement(SelectedPill,
|
|
96
|
+
return /* @__PURE__ */ import_react.default.createElement(SelectedPill, {
|
|
136
97
|
key: option.id,
|
|
137
98
|
label: option.label,
|
|
138
99
|
onChange: onChangeInputValue,
|
|
139
100
|
onRemove: (e) => removeOption(option, e),
|
|
140
|
-
value: input
|
|
141
|
-
|
|
101
|
+
value: input,
|
|
102
|
+
...otherProps
|
|
103
|
+
});
|
|
142
104
|
};
|
|
143
105
|
const renderSelection = () => {
|
|
144
106
|
if (!labelIsValue) {
|
|
@@ -149,25 +111,27 @@ function LabeledDropdownSinglePill(_a) {
|
|
|
149
111
|
});
|
|
150
112
|
}
|
|
151
113
|
};
|
|
152
|
-
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_DropdownPill.DropdownPill,
|
|
114
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_DropdownPill.DropdownPill, {
|
|
115
|
+
...menuProps,
|
|
153
116
|
label: !labelIsValue ? label : optionValue?.label,
|
|
154
117
|
maxWidth,
|
|
155
118
|
minWidth,
|
|
156
119
|
onSelectMenuItem: selectOption,
|
|
157
120
|
options: [
|
|
158
|
-
|
|
121
|
+
{
|
|
122
|
+
...menuProps,
|
|
159
123
|
type: "SelectionGroup",
|
|
160
124
|
id: "multi-selection-views",
|
|
161
125
|
multi: false,
|
|
162
126
|
items: options,
|
|
163
127
|
closeOnClick: true
|
|
164
|
-
}
|
|
128
|
+
}
|
|
165
129
|
],
|
|
166
130
|
selection: {
|
|
167
131
|
"multi-selection-views": optionValue ? [optionValue?.id] : ""
|
|
168
132
|
},
|
|
169
133
|
variant: "title"
|
|
170
|
-
})
|
|
134
|
+
}), renderSelection());
|
|
171
135
|
}
|
|
172
136
|
LabeledDropdownSinglePill.propTypes = {
|
|
173
137
|
label: import_prop_types.default.string,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable mdx/no-unused-expressions */\n/* eslint-disable no-shadow */\n/* eslint-disable no-unused-expressions */\n/* eslint-disable max-lines */\nimport React, { useCallback, useState, useEffect, useLayoutEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { isFunction, isString, useShouldRecalculate, usePrevious } from '@elliemae/ds-utilities';\nimport { DropdownPill } from '../DropdownPill';\nimport { InputPill } from '../InputPill';\nimport { Pill } from '../Pill';\nimport { RemovablePill } from '../RemovablePill';\nimport { hasOptionChanged } from './utils';\n\nfunction LabeledDropdownSinglePill({\n label,\n labelIsValue = false,\n options,\n value,\n onSelect = () => null,\n onChange,\n maxWidth,\n minWidth,\n fixed = false,\n ...menuProps\n}) {\n const [optionValue, setOptionValue] = useState(value);\n const prevOptions = usePrevious(options);\n const areOptionsEqual = useShouldRecalculate(hasOptionChanged(prevOptions, options));\n\n useEffect(() => setOptionValue(value), [value]);\n\n useEffect(() => {\n const selectedValue = options.find((option) => option.selected);\n\n if (selectedValue) {\n setOptionValue(selectedValue);\n } else if (!selectedValue) {\n setOptionValue(options[0]);\n }\n }, [areOptionsEqual]);\n\n useLayoutEffect(() => {\n if (optionValue) {\n const selectedValue = options.find((option) => option.id === optionValue.id);\n setOptionValue(selectedValue);\n }\n }, [options]);\n\n const selectOption = useCallback(\n (option) => {\n if (isFunction(onChange)) {\n onChange(option);\n }\n setOptionValue(option);\n onSelect(option);\n },\n [onChange, onSelect],\n );\n\n const onChangeInputValue = useCallback(\n ({ target: { value: inputValue } }) => {\n const { onChangeInput } = optionValue;\n\n onChangeInput && onChangeInput(inputValue);\n },\n [optionValue],\n );\n\n const removeOption = (removedOption) => {\n const { onRemove } = menuProps;\n const { onChangeInput } = optionValue;\n setOptionValue(null);\n onChangeInput && onChangeInput('');\n const newOption = { ...removedOption, input: '' };\n onRemove && onRemove(newOption, removedOption);\n };\n\n const renderPill = (option, fixed) => {\n const { input, onChangeInput, ...otherProps } = option;\n let SelectedPill;\n if (isString(input)) {\n SelectedPill = InputPill;\n } else if (fixed) {\n SelectedPill = Pill;\n } else {\n SelectedPill = RemovablePill;\n }\n\n return (\n <SelectedPill\n key={option.id}\n label={option.label}\n onChange={onChangeInputValue}\n onRemove={(e) => removeOption(option, e)}\n value={input}\n {...otherProps}\n />\n );\n };\n\n const renderSelection = () => {\n if (!labelIsValue) {\n if (optionValue) return renderPill(optionValue, fixed);\n return <Pill label=\"-\" />;\n }\n };\n\n return (\n <>\n <DropdownPill\n {...menuProps}\n label={!labelIsValue ? label : optionValue?.label}\n maxWidth={maxWidth}\n minWidth={minWidth}\n onSelectMenuItem={selectOption}\n options={[\n {\n ...menuProps,\n type: 'SelectionGroup',\n id: 'multi-selection-views',\n multi: false,\n items: options,\n closeOnClick: true,\n },\n ]}\n selection={{\n 'multi-selection-views': optionValue ? [optionValue?.id] : '',\n }}\n variant=\"title\"\n />\n {renderSelection()}\n </>\n );\n}\n\nLabeledDropdownSinglePill.propTypes = {\n label: PropTypes.string,\n labelIsValue: PropTypes.bool,\n options: PropTypes.array,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n onSelect: PropTypes.func,\n onChange: PropTypes.func,\n maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n minWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n fixed: PropTypes.bool,\n};\n\nexport { LabeledDropdownSinglePill };\nexport default LabeledDropdownSinglePill;", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,39 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
8
|
var __export = (target, all) => {
|
|
38
9
|
for (var name in all)
|
|
39
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -66,25 +37,20 @@ const PillWrapper = (0, import_ds_classnames.aggregatedClasses)("div")(pillBlock
|
|
|
66
37
|
}));
|
|
67
38
|
const PillLabel = (0, import_ds_classnames.aggregatedClasses)("span")(pillBlockName, "label");
|
|
68
39
|
const PillAddon = (0, import_ds_classnames.aggregatedClasses)("div")(pillBlockName, "addon");
|
|
69
|
-
function Pill(
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
"size"
|
|
84
|
-
]);
|
|
85
|
-
return /* @__PURE__ */ import_react.default.createElement(PillWrapper, __spreadValues(__spreadProps(__spreadValues({}, containerProps), {
|
|
86
|
-
classProps: { variant, size }
|
|
87
|
-
}), otherProps), leftAddon && /* @__PURE__ */ import_react.default.createElement(PillAddon, null, leftAddon), /* @__PURE__ */ import_react.default.createElement(PillLabel, null, label), rightAddon && /* @__PURE__ */ import_react.default.createElement(PillAddon, null, rightAddon));
|
|
40
|
+
function Pill({
|
|
41
|
+
containerProps = {},
|
|
42
|
+
label = "",
|
|
43
|
+
leftAddon,
|
|
44
|
+
rightAddon,
|
|
45
|
+
variant = "value",
|
|
46
|
+
size = "m",
|
|
47
|
+
...otherProps
|
|
48
|
+
}) {
|
|
49
|
+
return /* @__PURE__ */ import_react.default.createElement(PillWrapper, {
|
|
50
|
+
...containerProps,
|
|
51
|
+
classProps: { variant, size },
|
|
52
|
+
...otherProps
|
|
53
|
+
}, leftAddon && /* @__PURE__ */ import_react.default.createElement(PillAddon, null, leftAddon), /* @__PURE__ */ import_react.default.createElement(PillLabel, null, label), rightAddon && /* @__PURE__ */ import_react.default.createElement(PillAddon, null, rightAddon));
|
|
88
54
|
}
|
|
89
55
|
const props = {
|
|
90
56
|
containerProps: import_ds_utilities.PropTypes.object.description("props to inject to pill wrapper"),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/Pill.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\n\nconst pillBlockName = 'pill';\n\nconst PillWrapper = aggregatedClasses('div')(\n pillBlockName,\n null,\n ({ size, variant }) => ({\n [variant]: !!variant,\n [size]: !!size,\n }),\n);\nconst PillLabel = aggregatedClasses('span')(pillBlockName, 'label');\nconst PillAddon = aggregatedClasses('div')(pillBlockName, 'addon');\n\nfunction Pill({\n containerProps = {},\n label = '',\n leftAddon,\n rightAddon,\n variant = 'value',\n size = 'm',\n ...otherProps\n}) {\n return (\n <PillWrapper\n {...containerProps}\n classProps={{ variant, size }}\n {...otherProps}\n >\n {leftAddon && <PillAddon>{leftAddon}</PillAddon>}\n <PillLabel>{label}</PillLabel>\n {rightAddon && <PillAddon>{rightAddon}</PillAddon>}\n </PillWrapper>\n );\n}\n\nconst props = {\n /** props to inject to pill wrapper */\n containerProps: PropTypes.object.description(\n 'props to inject to pill wrapper',\n ),\n /** pill text label */\n label: PropTypes.string.isRequired.description('pill text label'),\n /** pill size */\n size: PropTypes.oneOf(['m', 'l']).description('pill size'),\n /** pill variant */\n variant: PropTypes.oneOf(['value', 'title']).description('pill variant'),\n /** addon component to left */\n leftAddon: PropTypes.node.description('addon component to left'),\n /** addon component to right */\n rightAddon: PropTypes.node.description('addon component to right'),\n};\n\nPill.propTypes = props;\nPill.displayName = 'Pill';\nconst DSPillWithSchema = describe(Pill);\nDSPillWithSchema.propTypes = props;\n\nexport { Pill, DSPillWithSchema };\nexport default Pill;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,2BAAkC;AAElC,MAAM,gBAAgB;AAEtB,MAAM,cAAc,4CAAkB,KAAK,EACzC,eACA,MACA,CAAC,EAAE,MAAM,cAAe;AAAA,EACtB,CAAC,UAAU,CAAC,CAAC;AAAA,EACb,CAAC,OAAO,CAAC,CAAC;AACZ,EACF;AACA,MAAM,YAAY,4CAAkB,MAAM,EAAE,eAAe,OAAO;AAClE,MAAM,YAAY,4CAAkB,KAAK,EAAE,eAAe,OAAO;AAEjE,cAAc;AAAA,EACZ,iBAAiB,CAAC;AAAA,EAClB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,KACJ;AAAA,GACF;AACD,SACE,mDAAC;AAAA,IACE,GAAG;AAAA,IACJ,YAAY,EAAE,SAAS,KAAK;AAAA,IAC3B,GAAG;AAAA,KAEH,aAAa,mDAAC,iBAAW,SAAU,GACpC,mDAAC,iBAAW,KAAM,GACjB,cAAc,mDAAC,iBAAW,UAAW,CACxC;AAEJ;AAEA,MAAM,QAAQ;AAAA,EAEZ,gBAAgB,8BAAU,OAAO,YAC/B,iCACF;AAAA,EAEA,OAAO,8BAAU,OAAO,WAAW,YAAY,iBAAiB;AAAA,EAEhE,MAAM,8BAAU,MAAM,CAAC,KAAK,GAAG,CAAC,EAAE,YAAY,WAAW;AAAA,EAEzD,SAAS,8BAAU,MAAM,CAAC,SAAS,OAAO,CAAC,EAAE,YAAY,cAAc;AAAA,EAEvE,WAAW,8BAAU,KAAK,YAAY,yBAAyB;AAAA,EAE/D,YAAY,8BAAU,KAAK,YAAY,0BAA0B;AACnE;AAEA,KAAK,YAAY;AACjB,KAAK,cAAc;AACnB,MAAM,mBAAmB,kCAAS,IAAI;AACtC,iBAAiB,YAAY;AAG7B,IAAO,eAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -3,22 +3,8 @@ var __create = Object.create;
|
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
7
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
8
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
10
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
11
|
-
var __spreadValues = (a, b) => {
|
|
12
|
-
for (var prop in b || (b = {}))
|
|
13
|
-
if (__hasOwnProp.call(b, prop))
|
|
14
|
-
__defNormalProp(a, prop, b[prop]);
|
|
15
|
-
if (__getOwnPropSymbols)
|
|
16
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
17
|
-
if (__propIsEnum.call(b, prop))
|
|
18
|
-
__defNormalProp(a, prop, b[prop]);
|
|
19
|
-
}
|
|
20
|
-
return a;
|
|
21
|
-
};
|
|
22
8
|
var __export = (target, all) => {
|
|
23
9
|
for (var name in all)
|
|
24
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -55,7 +41,9 @@ const PillGroup = ({ containerProps = {}, onFocusNextGroup, onFocusPreviousGroup
|
|
|
55
41
|
onFocusNextGroup,
|
|
56
42
|
onFocusPreviousGroup,
|
|
57
43
|
orientation: "horizontal"
|
|
58
|
-
}, /* @__PURE__ */ import_react.default.createElement(Container,
|
|
44
|
+
}, /* @__PURE__ */ import_react.default.createElement(Container, {
|
|
45
|
+
...containerProps
|
|
46
|
+
}, children));
|
|
59
47
|
const props = {
|
|
60
48
|
containerProps: import_ds_utilities.PropTypes.object.description("props injected to component wrapper"),
|
|
61
49
|
onFocusNextGroup: import_ds_utilities.PropTypes.func.description("focus next group callback"),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/PillGroup.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-utilities';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { FocusGroupProvider } from '@elliemae/ds-shared';\n\nconst pillGroupBlockName = 'pill-group';\n\nexport const Container = aggregatedClasses('div')(pillGroupBlockName);\n\nconst PillGroup = ({ containerProps = {}, onFocusNextGroup, onFocusPreviousGroup, onFocusGroupSet, children }) => (\n <FocusGroupProvider\n keyBindings={{\n Tab: 'next',\n }}\n onFocusGroupSet={onFocusGroupSet}\n onFocusNextGroup={onFocusNextGroup}\n onFocusPreviousGroup={onFocusPreviousGroup}\n orientation=\"horizontal\"\n >\n <Container {...containerProps}>{children}</Container>\n </FocusGroupProvider>\n);\n\nconst props = {\n /** props injected to component wrapper */\n containerProps: PropTypes.object.description('props injected to component wrapper'),\n /** focus next group callback */\n onFocusNextGroup: PropTypes.func.description('focus next group callback'),\n /** focus prev group callback */\n onFocusPreviousGroup: PropTypes.func.description('focus prev group callback'),\n /** focus group set callback */\n onFocusGroupSet: PropTypes.func.description('focus group set callback'),\n /** pill components */\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired.description(\n 'pill components',\n ),\n};\n\nPillGroup.propTypes = props;\nPillGroup.displayName = 'PillGroup';\nconst DSPillGroupWithSchema = describe(PillGroup);\nDSPillGroupWithSchema.propTypes = props;\n\nexport { PillGroup, DSPillGroupWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,2BAAkC;AAClC,uBAAmC;AAEnC,MAAM,qBAAqB;AAEpB,MAAM,YAAY,4CAAkB,KAAK,EAAE,kBAAkB;AAEpE,MAAM,YAAY,CAAC,EAAE,iBAAiB,CAAC,GAAG,kBAAkB,sBAAsB,iBAAiB,eACjG,mDAAC;AAAA,EACC,aAAa;AAAA,IACX,KAAK;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAY;AAAA,GAEZ,mDAAC;AAAA,EAAW,GAAG;AAAA,GAAiB,QAAS,CAC3C;AAGF,MAAM,QAAQ;AAAA,EAEZ,gBAAgB,8BAAU,OAAO,YAAY,qCAAqC;AAAA,EAElF,kBAAkB,8BAAU,KAAK,YAAY,2BAA2B;AAAA,EAExE,sBAAsB,8BAAU,KAAK,YAAY,2BAA2B;AAAA,EAE5E,iBAAiB,8BAAU,KAAK,YAAY,0BAA0B;AAAA,EAEtE,UAAU,8BAAU,UAAU,CAAC,8BAAU,QAAQ,8BAAU,IAAI,GAAG,8BAAU,IAAI,CAAC,EAAE,WAAW,YAC5F,iBACF;AACF;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,wBAAwB,kCAAS,SAAS;AAChD,sBAAsB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|