@elliemae/ds-pills 3.3.0-next.4 → 3.3.0-next.7
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
|
@@ -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 });
|
|
@@ -57,7 +43,9 @@ const DSPillV2 = (props) => {
|
|
|
57
43
|
(0, import_ds_utilities.useValidateTypescriptPropTypes)(propsWithDefaults, import_props.DSPillV2PropTypes);
|
|
58
44
|
const { type } = propsWithDefaults;
|
|
59
45
|
const PillComponent = pillComponentGetter[type];
|
|
60
|
-
return /* @__PURE__ */ import_react.default.createElement(PillComponent,
|
|
46
|
+
return /* @__PURE__ */ import_react.default.createElement(PillComponent, {
|
|
47
|
+
...propsWithDefaults
|
|
48
|
+
});
|
|
61
49
|
};
|
|
62
50
|
DSPillV2.propTypes = import_props.DSPillV2PropTypes;
|
|
63
51
|
DSPillV2.displayName = "DSPillV2";
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/Pill.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport type { DSPillProps } from '../index.d';\nimport { DSPillV2DefaultProps, DSPillV2PropTypes } from '../props';\nimport { DropdownPill, LabelPill, ValuePill, InputPill, ReadOnlyPill, RemovablePill } from './types';\n\nconst pillComponentGetter: Record<string, React.ComponentType<DSPillProps>> = {\n dropdown: DropdownPill,\n input: InputPill,\n label: LabelPill,\n readonly: ReadOnlyPill,\n removable: RemovablePill,\n value: ValuePill,\n};\n\nconst DSPillV2: React.ComponentType<DSPillProps> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, DSPillV2DefaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, DSPillV2PropTypes);\n const { type } = propsWithDefaults;\n const PillComponent = pillComponentGetter[type];\n\n return <PillComponent {...propsWithDefaults} />;\n};\n\nDSPillV2.propTypes = DSPillV2PropTypes;\nDSPillV2.displayName = 'DSPillV2';\nconst DSPillV2WithSchema = describe(DSPillV2).description('Pill');\nDSPillV2WithSchema.propTypes = DSPillV2PropTypes;\n\nexport { DSPillV2, DSPillV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,0BAAuF;AAEvF,mBAAwD;AACxD,mBAA2F;AAE3F,MAAM,sBAAwE;AAAA,EAC5E,UAAU;AAAA,EACV,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,OAAO;AACT;AAEA,MAAM,WAA6C,CAAC,UAAU;AAC5D,QAAM,oBAAoB,sDAA6B,OAAO,iCAAoB;AAClF,0DAA+B,mBAAmB,8BAAiB;AACnE,QAAM,EAAE,SAAS;AACjB,QAAM,gBAAgB,oBAAoB;AAE1C,SAAO,mDAAC;AAAA,IAAe,GAAG;AAAA,GAAmB;AAC/C;AAEA,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,MAAM,qBAAqB,kCAAS,QAAQ,EAAE,YAAY,MAAM;AAChE,mBAAmB,YAAY;",
|
|
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 });
|
|
@@ -67,11 +38,12 @@ const typeToClassName = {
|
|
|
67
38
|
const DSPillButton = (props) => {
|
|
68
39
|
const propsWithDefaults = (0, import_ds_utilities.useMemoMergePropsWithDefault)(props, import_props.DSPillButtonDefaultProps);
|
|
69
40
|
(0, import_ds_utilities.useValidateTypescriptPropTypes)(propsWithDefaults, import_props.DSPillButtonPropTypes);
|
|
70
|
-
const
|
|
71
|
-
return /* @__PURE__ */ import_react.default.createElement(import_styled.StyledPillButton,
|
|
41
|
+
const { type, children, ...rest } = propsWithDefaults;
|
|
42
|
+
return /* @__PURE__ */ import_react.default.createElement(import_styled.StyledPillButton, {
|
|
43
|
+
...rest,
|
|
72
44
|
buttonType: "raw",
|
|
73
45
|
className: `${typeToClassName[type]} ${rest.className}`
|
|
74
|
-
}
|
|
46
|
+
}, children);
|
|
75
47
|
};
|
|
76
48
|
DSPillButton.propTypes = import_props.DSPillButtonPropTypes;
|
|
77
49
|
DSPillButton.displayName = "DSPillButton";
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/PillButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { DSButtonPropsT } from '@elliemae/ds-button';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { StyledPillButton } from './styled';\nimport { DSPillButtonDefaultProps, DSPillButtonPropTypes } from '../props';\n\nconst typeToClassName = {\n only: 'ds-pill-button-only',\n left: 'ds-pill-button-left',\n right: 'ds-pill-button-right',\n};\n\nconst DSPillButton: React.ComponentType<DSButtonPropsT> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, DSPillButtonDefaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, DSPillButtonPropTypes);\n\n const { type, children, ...rest } = propsWithDefaults;\n\n return (\n <StyledPillButton {...rest} buttonType=\"raw\" className={`${typeToClassName[type]} ${rest.className}`}>\n {children}\n </StyledPillButton>\n );\n};\n\nDSPillButton.propTypes = DSPillButtonPropTypes;\nDSPillButton.displayName = 'DSPillButton';\nconst DSPillButtonWithSchema = describe(DSPillButton).description('Pill button');\nDSPillButtonWithSchema.propTypes = DSPillButtonPropTypes;\n\nexport { DSPillButton, DSPillButtonWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAElB,0BAAuF;AACvF,oBAAiC;AACjC,mBAAgE;AAEhE,MAAM,kBAAkB;AAAA,EACtB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AACT;AAEA,MAAM,eAAoD,CAAC,UAAU;AACnE,QAAM,oBAAoB,sDAA6B,OAAO,qCAAwB;AACtF,0DAA+B,mBAAmB,kCAAqB;AAEvE,QAAM,EAAE,MAAM,aAAa,SAAS;AAEpC,SACE,mDAAC;AAAA,IAAkB,GAAG;AAAA,IAAM,YAAW;AAAA,IAAM,WAAW,GAAG,gBAAgB,SAAS,KAAK;AAAA,KACtF,QACH;AAEJ;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,yBAAyB,kCAAS,YAAY,EAAE,YAAY,aAAa;AAC/E,uBAAuB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,27 +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
8
|
var __export = (target, all) => {
|
|
26
9
|
for (var name in all)
|
|
27
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -80,13 +63,14 @@ const DSPillGroupV2 = (props) => {
|
|
|
80
63
|
}, [pillGroupUid]);
|
|
81
64
|
return /* @__PURE__ */ import_react.default.createElement(DSPillGroupV2Context.Provider, {
|
|
82
65
|
value: { onKeyboardRemove, onKeyboardNavigation }
|
|
83
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_styled.StyledPillGroup,
|
|
66
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_styled.StyledPillGroup, {
|
|
67
|
+
...globalAttrs,
|
|
84
68
|
width,
|
|
85
69
|
id: pillGroupUid,
|
|
86
70
|
cols: import_react.default.Children.map(children, () => "auto"),
|
|
87
71
|
gutter: "2px",
|
|
88
72
|
ref: innerRef
|
|
89
|
-
}
|
|
73
|
+
}, children));
|
|
90
74
|
};
|
|
91
75
|
DSPillGroupV2.propTypes = import_props.DSPillGroupPropTypes;
|
|
92
76
|
DSPillGroupV2.displayName = "DSPillGroupV2";
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/PillGroup.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { createContext, useCallback, useMemo, WeakValidationMap } from 'react';\nimport { uid } from 'uid';\nimport {\n describe,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n useGetGlobalAttributes,\n} from '@elliemae/ds-utilities';\nimport { DSPillGroupProps } from '../index.d';\nimport { DSPillGroupDefaultProps, DSPillGroupPropTypes } from '../props';\nimport { StyledPillGroup } from './styled';\n\nexport const DSPillGroupV2Context = createContext<{\n onKeyboardRemove: (pillUid: string) => void;\n onKeyboardNavigation: (pillUid: string, step: number, e: KeyboardEvent) => void;\n}>({\n onKeyboardRemove: () => null,\n onKeyboardNavigation: () => null,\n});\n\nconst DSPillGroupV2: React.ComponentType<DSPillGroupProps> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, DSPillGroupDefaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, DSPillGroupPropTypes);\n\n const globalAttrs = useGetGlobalAttributes(propsWithDefaults);\n const pillGroupUid = useMemo(() => `ds-pill-group-${uid()}`, []);\n const { children, width, innerRef } = propsWithDefaults;\n const onKeyboardRemove = useCallback(\n (pillUid: string) => {\n const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)] as HTMLElement[];\n\n const pillIndex = elems.findIndex((elem) => elem.id === pillUid);\n\n if (pillIndex > 0) {\n elems[pillIndex - 1].focus();\n } else if (pillIndex + 1 < elems.length) {\n elems[pillIndex + 1].focus();\n }\n },\n [pillGroupUid],\n );\n const onKeyboardNavigation = useCallback(\n (pillUid: string, step: number, e: KeyboardEvent) => {\n const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)] as HTMLElement[];\n\n const pillIndex = elems.findIndex((elem) => elem.id === pillUid);\n\n if (pillIndex >= 0) {\n if (elems[pillIndex + step]) {\n e.stopPropagation();\n elems[pillIndex + step].focus();\n }\n }\n },\n [pillGroupUid],\n );\n\n return (\n <DSPillGroupV2Context.Provider value={{ onKeyboardRemove, onKeyboardNavigation }}>\n <StyledPillGroup\n {...globalAttrs}\n width={width}\n id={pillGroupUid}\n cols={React.Children.map(children, () => 'auto')}\n gutter=\"2px\"\n ref={innerRef}\n >\n {children}\n </StyledPillGroup>\n </DSPillGroupV2Context.Provider>\n );\n};\n\nDSPillGroupV2.propTypes = DSPillGroupPropTypes as WeakValidationMap<unknown>;\nDSPillGroupV2.displayName = 'DSPillGroupV2';\nconst DSPillGroupV2WithSchema = describe(DSPillGroupV2);\nDSPillGroupV2WithSchema.propTypes = DSPillGroupPropTypes as WeakValidationMap<unknown>;\n\nexport { DSPillGroupV2, DSPillGroupV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA8E;AAC9E,iBAAoB;AACpB,0BAKO;AAEP,mBAA8D;AAC9D,oBAAgC;AAEzB,MAAM,uBAAuB,gCAGjC;AAAA,EACD,kBAAkB,MAAM;AAAA,EACxB,sBAAsB,MAAM;AAC9B,CAAC;AAED,MAAM,gBAAuD,CAAC,UAAU;AACtE,QAAM,oBAAoB,sDAA6B,OAAO,oCAAuB;AACrF,0DAA+B,mBAAmB,iCAAoB;AAEtE,QAAM,cAAc,gDAAuB,iBAAiB;AAC5D,QAAM,eAAe,0BAAQ,MAAM,iBAAiB,oBAAI,KAAK,CAAC,CAAC;AAC/D,QAAM,EAAE,UAAU,OAAO,aAAa;AACtC,QAAM,mBAAmB,8BACvB,CAAC,YAAoB;AACnB,UAAM,QAAQ,CAAC,GAAG,SAAS,iBAAiB,IAAI,mCAAmC,CAAC;AAEpF,UAAM,YAAY,MAAM,UAAU,CAAC,SAAS,KAAK,OAAO,OAAO;AAE/D,QAAI,YAAY,GAAG;AACjB,YAAM,YAAY,GAAG,MAAM;AAAA,IAC7B,WAAW,YAAY,IAAI,MAAM,QAAQ;AACvC,YAAM,YAAY,GAAG,MAAM;AAAA,IAC7B;AAAA,EACF,GACA,CAAC,YAAY,CACf;AACA,QAAM,uBAAuB,8BAC3B,CAAC,SAAiB,MAAc,MAAqB;AACnD,UAAM,QAAQ,CAAC,GAAG,SAAS,iBAAiB,IAAI,mCAAmC,CAAC;AAEpF,UAAM,YAAY,MAAM,UAAU,CAAC,SAAS,KAAK,OAAO,OAAO;AAE/D,QAAI,aAAa,GAAG;AAClB,UAAI,MAAM,YAAY,OAAO;AAC3B,UAAE,gBAAgB;AAClB,cAAM,YAAY,MAAM,MAAM;AAAA,MAChC;AAAA,IACF;AAAA,EACF,GACA,CAAC,YAAY,CACf;AAEA,SACE,mDAAC,qBAAqB,UAArB;AAAA,IAA8B,OAAO,EAAE,kBAAkB,qBAAqB;AAAA,KAC7E,mDAAC;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA,IAAI;AAAA,IACJ,MAAM,qBAAM,SAAS,IAAI,UAAU,MAAM,MAAM;AAAA,IAC/C,QAAO;AAAA,IACP,KAAK;AAAA,KAEJ,QACH,CACF;AAEJ;AAEA,cAAc,YAAY;AAC1B,cAAc,cAAc;AAC5B,MAAM,0BAA0B,kCAAS,aAAa;AACtD,wBAAwB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,27 +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
8
|
var __export = (target, all) => {
|
|
26
9
|
for (var name in all)
|
|
27
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -65,7 +48,7 @@ const DropdownPill = import_react.default.memo(({ label, size, labelTruncated, d
|
|
|
65
48
|
gutter: "2px",
|
|
66
49
|
alignItems: "center",
|
|
67
50
|
justifyItems: "center"
|
|
68
|
-
}, /* @__PURE__ */ import_react.default.createElement(TextComponent, null, label), /* @__PURE__ */ import_react.default.createElement(import_ds_common.DSDropdownMenuV2,
|
|
51
|
+
}, /* @__PURE__ */ import_react.default.createElement(TextComponent, null, label), /* @__PURE__ */ import_react.default.createElement(import_ds_common.DSDropdownMenuV2, {
|
|
69
52
|
placementOrderPreference: [
|
|
70
53
|
"bottom-start",
|
|
71
54
|
"bottom",
|
|
@@ -74,8 +57,8 @@ const DropdownPill = import_react.default.memo(({ label, size, labelTruncated, d
|
|
|
74
57
|
"top-start",
|
|
75
58
|
"top",
|
|
76
59
|
"top-end"
|
|
77
|
-
]
|
|
78
|
-
|
|
60
|
+
],
|
|
61
|
+
...dropdownProps,
|
|
79
62
|
onClickOutside: (e) => {
|
|
80
63
|
if (e.code === "Escape")
|
|
81
64
|
chevronRef.current.focus();
|
|
@@ -83,7 +66,7 @@ const DropdownPill = import_react.default.memo(({ label, size, labelTruncated, d
|
|
|
83
66
|
dropdownProps.onClickOutside(e);
|
|
84
67
|
},
|
|
85
68
|
wrapperStyles: { w: "100%", h: "100%" }
|
|
86
|
-
}
|
|
69
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_PillButton.DSPillButton, {
|
|
87
70
|
className: "ds-pill-focus-point",
|
|
88
71
|
"data-testid": "ds-pill-dropdown-chevron",
|
|
89
72
|
innerRef: (0, import_utils.setMultipleRefs)(chevronRef, innerRef),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/types/DropdownPill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useMemo, useRef } from 'react';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-common';\nimport { uid } from 'uid';\nimport { ChevronSmallDown } from '@elliemae/ds-icons';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { StyledDropdownPillWrapper } from '../styled';\nimport type { DSPillProps } from '../../index.d';\nimport { setMultipleRefs } from '../../utils';\nimport { DSPillButton } from '../PillButton';\n\nexport const DropdownPill = React.memo<DSPillProps>(\n ({ label, size, labelTruncated, dropdownProps, innerRef, ariaLabel, onDropdownClick }) => {\n const chevronRef = useRef(null);\n\n const pillUid = useMemo(() => `ds-pill-${uid()}`, []);\n\n const TextComponent = labelTruncated\n ? ({ children }) => <SimpleTruncatedTooltipText value={children} />\n : React.Fragment;\n\n return (\n <StyledDropdownPillWrapper\n size={size}\n id={pillUid}\n className=\"ds-pill-wrapper ds-pill-wrapper-dropdown\"\n data-testid=\"ds-pill-wrapper\"\n cols={['auto', '24px']}\n gutter=\"2px\"\n alignItems=\"center\"\n justifyItems=\"center\"\n >\n <TextComponent>{label}</TextComponent>\n <DSDropdownMenuV2\n placementOrderPreference={[\n 'bottom-start',\n 'bottom',\n 'bottom-end',\n 'right-end',\n 'top-start',\n 'top',\n 'top-end',\n ]}\n {...dropdownProps}\n onClickOutside={(e) => {\n if (e.code === 'Escape') chevronRef.current.focus();\n if (dropdownProps.onClickOutside) dropdownProps.onClickOutside(e);\n }}\n wrapperStyles={{ w: '100%', h: '100%' }}\n >\n <DSPillButton\n className=\"ds-pill-focus-point\"\n data-testid=\"ds-pill-dropdown-chevron\"\n innerRef={setMultipleRefs(chevronRef, innerRef)}\n aria-label={ariaLabel || label}\n type=\"right\"\n onClick={onDropdownClick}\n >\n <ChevronSmallDown color={['brand-primary', '800']} width={20} height={20} />\n </DSPillButton>\n </DSDropdownMenuV2>\n </StyledDropdownPillWrapper>\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAuC;AACvC,uBAAiC;AACjC,iBAAoB;AACpB,sBAAiC;AACjC,uCAA2C;AAC3C,oBAA0C;AAE1C,mBAAgC;AAChC,wBAA6B;AAEtB,MAAM,eAAe,qBAAM,KAChC,CAAC,EAAE,OAAO,MAAM,gBAAgB,eAAe,UAAU,WAAW,sBAAsB;AACxF,QAAM,aAAa,yBAAO,IAAI;AAE9B,QAAM,UAAU,0BAAQ,MAAM,WAAW,oBAAI,KAAK,CAAC,CAAC;AAEpD,QAAM,gBAAgB,iBAClB,CAAC,EAAE,eAAe,mDAAC;AAAA,IAA2B,OAAO;AAAA,GAAU,IAC/D,qBAAM;AAEV,SACE,mDAAC;AAAA,IACC;AAAA,IACA,IAAI;AAAA,IACJ,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,MAAM,CAAC,QAAQ,MAAM;AAAA,IACrB,QAAO;AAAA,IACP,YAAW;AAAA,IACX,cAAa;AAAA,KAEb,mDAAC,qBAAe,KAAM,GACtB,mDAAC;AAAA,IACC,0BAA0B;AAAA,MACxB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IACJ,gBAAgB,CAAC,MAAM;AACrB,UAAI,EAAE,SAAS;AAAU,mBAAW,QAAQ,MAAM;AAClD,UAAI,cAAc;AAAgB,sBAAc,eAAe,CAAC;AAAA,IAClE;AAAA,IACA,eAAe,EAAE,GAAG,QAAQ,GAAG,OAAO;AAAA,KAEtC,mDAAC;AAAA,IACC,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,UAAU,kCAAgB,YAAY,QAAQ;AAAA,IAC9C,cAAY,aAAa;AAAA,IACzB,MAAK;AAAA,IACL,SAAS;AAAA,KAET,mDAAC;AAAA,IAAiB,OAAO,CAAC,iBAAiB,KAAK;AAAA,IAAG,OAAO;AAAA,IAAI,QAAQ;AAAA,GAAI,CAC5E,CACF,CACF;AAEJ,CACF;",
|
|
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 });
|
|
@@ -61,28 +32,21 @@ var import_ds_dropdownmenu = require("@elliemae/ds-dropdownmenu");
|
|
|
61
32
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
62
33
|
var import_ds_shared = require("@elliemae/ds-shared");
|
|
63
34
|
var import_Pill = require("./Pill");
|
|
64
|
-
function DropdownPill(
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
"containerProps",
|
|
75
|
-
"label",
|
|
76
|
-
"variant",
|
|
77
|
-
"tabIndex",
|
|
78
|
-
"closeMenuOnItemSelection",
|
|
79
|
-
"maxWidth",
|
|
80
|
-
"minWidth"
|
|
81
|
-
]);
|
|
35
|
+
function DropdownPill({
|
|
36
|
+
containerProps = {},
|
|
37
|
+
label = "",
|
|
38
|
+
variant,
|
|
39
|
+
tabIndex = -1,
|
|
40
|
+
closeMenuOnItemSelection = false,
|
|
41
|
+
maxWidth,
|
|
42
|
+
minWidth,
|
|
43
|
+
...dropdownProps
|
|
44
|
+
}) {
|
|
82
45
|
const ref = (0, import_react.useRef)(null);
|
|
83
46
|
const [chevronEl, chevronRef] = (0, import_react.useState)();
|
|
84
47
|
const { focusFirst } = (0, import_ds_shared.useFocusGroupItem)(ref);
|
|
85
|
-
return /* @__PURE__ */ import_react.default.createElement(import_ds_dropdownmenu.DSDropdownMenu,
|
|
48
|
+
return /* @__PURE__ */ import_react.default.createElement(import_ds_dropdownmenu.DSDropdownMenu, {
|
|
49
|
+
...dropdownProps,
|
|
86
50
|
closeMenuOnItemSelection,
|
|
87
51
|
maxWidth,
|
|
88
52
|
hideIfNotVisible: true,
|
|
@@ -93,7 +57,7 @@ function DropdownPill(_a) {
|
|
|
93
57
|
triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_Pill.Pill, {
|
|
94
58
|
"data-testid": "dropdown-pill",
|
|
95
59
|
className: "dropdown-pill",
|
|
96
|
-
containerProps:
|
|
60
|
+
containerProps: { role: "listbox", ...containerProps },
|
|
97
61
|
innerRef: ref,
|
|
98
62
|
label,
|
|
99
63
|
rightAddon: /* @__PURE__ */ import_react.default.createElement("div", {
|
|
@@ -105,7 +69,7 @@ function DropdownPill(_a) {
|
|
|
105
69
|
tabIndex,
|
|
106
70
|
variant
|
|
107
71
|
})
|
|
108
|
-
})
|
|
72
|
+
});
|
|
109
73
|
}
|
|
110
74
|
const props = {
|
|
111
75
|
containerProps: import_ds_utilities.PropTypes.object.description("props injected to component wrapper"),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/DropdownPill.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useRef, useState } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { useFocusGroupItem } from '@elliemae/ds-shared';\nimport { Pill } from './Pill';\n\nfunction DropdownPill({\n containerProps = {},\n label = '',\n variant,\n tabIndex = -1,\n closeMenuOnItemSelection = false,\n maxWidth,\n minWidth,\n ...dropdownProps\n}) {\n const ref = useRef(null);\n const [chevronEl, chevronRef] = useState();\n const { focusFirst } = useFocusGroupItem(ref);\n return (\n <DSDropdownMenu\n {...dropdownProps}\n closeMenuOnItemSelection={closeMenuOnItemSelection}\n maxWidth={maxWidth}\n hideIfNotVisible\n menuProps={{ className: 'dropdown-pill-menu', zIndex: 100 }}\n minWidth={minWidth}\n onClose={focusFirst}\n referenceNode={chevronEl}\n triggerComponent={\n <Pill\n data-testid=\"dropdown-pill\"\n className=\"dropdown-pill\"\n containerProps={{ role: 'listbox', ...containerProps }}\n innerRef={ref}\n label={label}\n rightAddon={\n <div ref={chevronRef}>\n <ChevronDown className=\"dropdown-pill-chevron-down\" data-testid=\"dropdown-pill-button\" />\n </div>\n }\n tabIndex={tabIndex}\n variant={variant}\n />\n }\n />\n );\n}\n\nconst props = {\n /** props injected to component wrapper */\n containerProps: PropTypes.object.description('props injected to component wrapper'),\n /** labeled pill text label */\n label: PropTypes.string.isRequired.description('pill text label'),\n /** pill variant */\n variant: PropTypes.oneOf(['value', 'title']).description('pill variant'),\n /** html focus border */\n tabIndex: PropTypes.number.description('html focus order'),\n /** close menu on item selection */\n closeMenuOnItemSelection: PropTypes.bool.description('close menu on item selection'),\n /** pill max width */\n maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('pill max width'),\n /** pill min width */\n minWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('pill min width'),\n};\n\nDropdownPill.propTypes = props;\nDropdownPill.displayName = 'DropdownPill';\nconst DSDropdownPillWithSchema = describe(DropdownPill);\nDSDropdownPillWithSchema.propTypes = props;\n\nexport { DropdownPill, DSDropdownPillWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwC;AACxC,0BAAoC;AACpC,6BAA+B;AAC/B,sBAA4B;AAC5B,uBAAkC;AAClC,kBAAqB;AAErB,sBAAsB;AAAA,EACpB,iBAAiB,CAAC;AAAA,EAClB,QAAQ;AAAA,EACR;AAAA,EACA,WAAW;AAAA,EACX,2BAA2B;AAAA,EAC3B;AAAA,EACA;AAAA,KACG;AAAA,GACF;AACD,QAAM,MAAM,yBAAO,IAAI;AACvB,QAAM,CAAC,WAAW,cAAc,2BAAS;AACzC,QAAM,EAAE,eAAe,wCAAkB,GAAG;AAC5C,SACE,mDAAC;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA;AAAA,IACA,kBAAgB;AAAA,IAChB,WAAW,EAAE,WAAW,sBAAsB,QAAQ,IAAI;AAAA,IAC1D;AAAA,IACA,SAAS;AAAA,IACT,eAAe;AAAA,IACf,kBACE,mDAAC;AAAA,MACC,eAAY;AAAA,MACZ,WAAU;AAAA,MACV,gBAAgB,EAAE,MAAM,WAAW,GAAG,eAAe;AAAA,MACrD,UAAU;AAAA,MACV;AAAA,MACA,YACE,mDAAC;AAAA,QAAI,KAAK;AAAA,SACR,mDAAC;AAAA,QAAY,WAAU;AAAA,QAA6B,eAAY;AAAA,OAAuB,CACzF;AAAA,MAEF;AAAA,MACA;AAAA,KACF;AAAA,GAEJ;AAEJ;AAEA,MAAM,QAAQ;AAAA,EAEZ,gBAAgB,8BAAU,OAAO,YAAY,qCAAqC;AAAA,EAElF,OAAO,8BAAU,OAAO,WAAW,YAAY,iBAAiB;AAAA,EAEhE,SAAS,8BAAU,MAAM,CAAC,SAAS,OAAO,CAAC,EAAE,YAAY,cAAc;AAAA,EAEvE,UAAU,8BAAU,OAAO,YAAY,kBAAkB;AAAA,EAEzD,0BAA0B,8BAAU,KAAK,YAAY,8BAA8B;AAAA,EAEnF,UAAU,8BAAU,UAAU,CAAC,8BAAU,QAAQ,8BAAU,MAAM,CAAC,EAAE,YAAY,gBAAgB;AAAA,EAEhG,UAAU,8BAAU,UAAU,CAAC,8BAAU,QAAQ,8BAAU,MAAM,CAAC,EAAE,YAAY,gBAAgB;AAClG;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,2BAA2B,kCAAS,YAAY;AACtD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -3,34 +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
|
-
var __objRest = (source, exclude) => {
|
|
23
|
-
var target = {};
|
|
24
|
-
for (var prop in source)
|
|
25
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
26
|
-
target[prop] = source[prop];
|
|
27
|
-
if (source != null && __getOwnPropSymbols)
|
|
28
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
29
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
30
|
-
target[prop] = source[prop];
|
|
31
|
-
}
|
|
32
|
-
return target;
|
|
33
|
-
};
|
|
34
8
|
var __export = (target, all) => {
|
|
35
9
|
for (var name in all)
|
|
36
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -59,23 +33,16 @@ var import_Pill = require("./Pill");
|
|
|
59
33
|
const StyledInputPill = (0, import_ds_classnames.aggregatedClasses)(import_Pill.Pill)("input-pill", null, ({ value }) => ({
|
|
60
34
|
value
|
|
61
35
|
}));
|
|
62
|
-
function InputPill(
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
"containerProps",
|
|
73
|
-
"placeholder",
|
|
74
|
-
"onChange",
|
|
75
|
-
"onRemove",
|
|
76
|
-
"value",
|
|
77
|
-
"type"
|
|
78
|
-
]);
|
|
36
|
+
function InputPill({
|
|
37
|
+
containerProps = {},
|
|
38
|
+
placeholder = "Enter Value",
|
|
39
|
+
onChange = () => {
|
|
40
|
+
},
|
|
41
|
+
onRemove,
|
|
42
|
+
value,
|
|
43
|
+
type,
|
|
44
|
+
...otherProps
|
|
45
|
+
}) {
|
|
79
46
|
let TypeOfInput = import_ds_form.DSInput;
|
|
80
47
|
switch (type) {
|
|
81
48
|
case "inputText":
|
|
@@ -91,12 +58,13 @@ function InputPill(_a) {
|
|
|
91
58
|
className: "input-pill",
|
|
92
59
|
classProps: { value },
|
|
93
60
|
containerProps,
|
|
94
|
-
label: /* @__PURE__ */ import_react.default.createElement(TypeOfInput,
|
|
61
|
+
label: /* @__PURE__ */ import_react.default.createElement(TypeOfInput, {
|
|
95
62
|
"data-testid": "input-pill",
|
|
96
63
|
onChange,
|
|
97
64
|
placeholder,
|
|
98
|
-
value
|
|
99
|
-
|
|
65
|
+
value,
|
|
66
|
+
...otherProps
|
|
67
|
+
}),
|
|
100
68
|
rightAddon: value && /* @__PURE__ */ import_react.default.createElement(import_ds_icons.CloseXsmall, {
|
|
101
69
|
className: "remove-pill-button",
|
|
102
70
|
"data-testid": "remove-pill-button",
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/InputPill.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { CloseXsmall } from '@elliemae/ds-icons';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { DSInput, DSInputMask } from '@elliemae/ds-form';\nimport { Pill } from './Pill';\n\nconst StyledInputPill = aggregatedClasses(Pill)('input-pill', null, ({ value }) => ({\n value,\n}));\n\nexport function InputPill({\n containerProps = {},\n placeholder = 'Enter Value',\n onChange = () => {},\n onRemove,\n value,\n type,\n ...otherProps\n}) {\n let TypeOfInput = DSInput;\n // TODO: implement the DSTimeInput, see how because it returns a moment()\n // TODO: implement the DSDateInput\n switch (type) {\n case 'inputText':\n TypeOfInput = DSInput;\n break;\n case 'inputMask':\n TypeOfInput = DSInputMask;\n break;\n default:\n break;\n }\n\n return (\n <StyledInputPill\n className=\"input-pill\"\n classProps={{ value }}\n containerProps={containerProps}\n label={\n <TypeOfInput\n data-testid=\"input-pill\"\n onChange={onChange}\n placeholder={placeholder}\n value={value}\n {...otherProps}\n />\n }\n rightAddon={\n value && <CloseXsmall className=\"remove-pill-button\" data-testid=\"remove-pill-button\" onClick={onRemove} />\n }\n tabIndex={-1}\n />\n );\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,sBAA4B;AAC5B,2BAAkC;AAClC,qBAAqC;AACrC,kBAAqB;AAErB,MAAM,kBAAkB,4CAAkB,gBAAI,EAAE,cAAc,MAAM,CAAC,EAAE,YAAa;AAAA,EAClF;AACF,EAAE;AAEK,mBAAmB;AAAA,EACxB,iBAAiB,CAAC;AAAA,EAClB,cAAc;AAAA,EACd,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,GACF;AACD,MAAI,cAAc;AAGlB,UAAQ;AAAA,SACD;AACH,oBAAc;AACd;AAAA,SACG;AACH,oBAAc;AACd;AAAA;AAEA;AAAA;AAGJ,SACE,mDAAC;AAAA,IACC,WAAU;AAAA,IACV,YAAY,EAAE,MAAM;AAAA,IACpB;AAAA,IACA,OACE,mDAAC;AAAA,MACC,eAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,KACN;AAAA,IAEF,YACE,SAAS,mDAAC;AAAA,MAAY,WAAU;AAAA,MAAqB,eAAY;AAAA,MAAqB,SAAS;AAAA,KAAU;AAAA,IAE3G,UAAU;AAAA,GACZ;AAEJ;",
|
|
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 });
|
|
@@ -67,40 +38,31 @@ const DropdownPills = {
|
|
|
67
38
|
cascaded: import_LabeledDropdownCascadeMenuPill.LabeledDropdownCascadeMenuPill
|
|
68
39
|
};
|
|
69
40
|
const createDropdownPill = (type) => DropdownPills[type] || DropdownPills.single;
|
|
70
|
-
function LabeledDropdownPills(
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
"label",
|
|
83
|
-
"value",
|
|
84
|
-
"type",
|
|
85
|
-
"onFocusNextGroup",
|
|
86
|
-
"onFocusPreviousGroup",
|
|
87
|
-
"onFocusGroupSet",
|
|
88
|
-
"maxWidth",
|
|
89
|
-
"minWidth",
|
|
90
|
-
"fixed"
|
|
91
|
-
]);
|
|
41
|
+
function LabeledDropdownPills({
|
|
42
|
+
label = "",
|
|
43
|
+
value,
|
|
44
|
+
type,
|
|
45
|
+
onFocusNextGroup,
|
|
46
|
+
onFocusPreviousGroup,
|
|
47
|
+
onFocusGroupSet,
|
|
48
|
+
maxWidth,
|
|
49
|
+
minWidth,
|
|
50
|
+
fixed,
|
|
51
|
+
...menuProps
|
|
52
|
+
}) {
|
|
92
53
|
const Component = createDropdownPill(type);
|
|
93
54
|
return /* @__PURE__ */ import_react.default.createElement(import_PillGroup.PillGroup, {
|
|
94
55
|
onFocusGroupSet,
|
|
95
56
|
onFocusNextGroup,
|
|
96
57
|
onFocusPreviousGroup
|
|
97
|
-
}, /* @__PURE__ */ import_react.default.createElement(Component,
|
|
58
|
+
}, /* @__PURE__ */ import_react.default.createElement(Component, {
|
|
59
|
+
...menuProps,
|
|
98
60
|
label,
|
|
99
61
|
maxWidth,
|
|
100
62
|
minWidth,
|
|
101
63
|
value,
|
|
102
64
|
fixed
|
|
103
|
-
}))
|
|
65
|
+
}));
|
|
104
66
|
}
|
|
105
67
|
const props = {
|
|
106
68
|
type: import_ds_utilities.PropTypes.oneOf(["single", "multi", "cascaded"]).description("pill type"),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/deprecated/LabeledDropdownPills.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { PillGroup } from './PillGroup';\nimport { LabeledDropdownSinglePill } from './LabeledDropdownPillsTypes/LabeledDropdownSinglePill';\nimport { LabeledDropdownMultiPills } from './LabeledDropdownPillsTypes/LabeledDropdownMultiPill';\nimport { LabeledDropdownCascadeMenuPill } from './LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill';\n\nconst DropdownPills = {\n single: LabeledDropdownSinglePill,\n multi: LabeledDropdownMultiPills,\n cascaded: LabeledDropdownCascadeMenuPill,\n};\n\nconst createDropdownPill = (type) =>\n DropdownPills[type] || DropdownPills.single;\n\nfunction LabeledDropdownPills({\n label = '',\n value,\n type,\n onFocusNextGroup,\n onFocusPreviousGroup,\n onFocusGroupSet,\n maxWidth,\n minWidth,\n fixed,\n ...menuProps\n}) {\n const Component = createDropdownPill(type);\n\n return (\n <PillGroup\n onFocusGroupSet={onFocusGroupSet}\n onFocusNextGroup={onFocusNextGroup}\n onFocusPreviousGroup={onFocusPreviousGroup}\n >\n <Component\n {...menuProps}\n label={label}\n maxWidth={maxWidth}\n minWidth={minWidth}\n value={value}\n fixed={fixed}\n />\n </PillGroup>\n );\n}\n\nconst props = {\n /** pill type */\n type: PropTypes.oneOf(['single', 'multi', 'cascaded']).description(\n 'pill type',\n ),\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 max width */\n maxWidth: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.number,\n ]).description('pill max width'),\n /** pill min width */\n minWidth: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.number,\n ]).description('pill min width'),\n /** fixed pill */\n fixed: PropTypes.bool.description('fixed pill'),\n /** pill label text */\n label: PropTypes.string.isRequired.description('pill label text'),\n /** pill value */\n value: PropTypes.oneOfType([\n PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n label: PropTypes.string,\n }),\n ),\n PropTypes.shape({\n id: PropTypes.string,\n label: PropTypes.string,\n }),\n ]).description('pill value'),\n};\n\nLabeledDropdownPills.propTypes = props;\nLabeledDropdownPills.displayName = 'LabeledDropdownPills';\nconst DSLabeledDropdownPillsWithSchema = describe(LabeledDropdownPills);\nDSLabeledDropdownPillsWithSchema.propTypes = props;\n\nexport { LabeledDropdownPills, DSLabeledDropdownPillsWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,0BAAoC;AACpC,uBAA0B;AAC1B,uCAA0C;AAC1C,sCAA0C;AAC1C,4CAA+C;AAE/C,MAAM,gBAAgB;AAAA,EACpB,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,UAAU;AACZ;AAEA,MAAM,qBAAqB,CAAC,SAC1B,cAAc,SAAS,cAAc;AAEvC,8BAA8B;AAAA,EAC5B,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,GACF;AACD,QAAM,YAAY,mBAAmB,IAAI;AAEzC,SACE,mDAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,KAEA,mDAAC;AAAA,IACE,GAAG;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,GACF,CACF;AAEJ;AAEA,MAAM,QAAQ;AAAA,EAEZ,MAAM,8BAAU,MAAM,CAAC,UAAU,SAAS,UAAU,CAAC,EAAE,YACrD,WACF;AAAA,EAEA,kBAAkB,8BAAU,KAAK,YAAY,2BAA2B;AAAA,EAExE,sBAAsB,8BAAU,KAAK,YAAY,2BAA2B;AAAA,EAE5E,iBAAiB,8BAAU,KAAK,YAAY,0BAA0B;AAAA,EAEtE,UAAU,8BAAU,UAAU;AAAA,IAC5B,8BAAU;AAAA,IACV,8BAAU;AAAA,EACZ,CAAC,EAAE,YAAY,gBAAgB;AAAA,EAE/B,UAAU,8BAAU,UAAU;AAAA,IAC5B,8BAAU;AAAA,IACV,8BAAU;AAAA,EACZ,CAAC,EAAE,YAAY,gBAAgB;AAAA,EAE/B,OAAO,8BAAU,KAAK,YAAY,YAAY;AAAA,EAE9C,OAAO,8BAAU,OAAO,WAAW,YAAY,iBAAiB;AAAA,EAEhE,OAAO,8BAAU,UAAU;AAAA,IACzB,8BAAU,QACR,8BAAU,MAAM;AAAA,MACd,IAAI,8BAAU;AAAA,MACd,OAAO,8BAAU;AAAA,IACnB,CAAC,CACH;AAAA,IACA,8BAAU,MAAM;AAAA,MACd,IAAI,8BAAU;AAAA,MACd,OAAO,8BAAU;AAAA,IACnB,CAAC;AAAA,EACH,CAAC,EAAE,YAAY,YAAY;AAC7B;AAEA,qBAAqB,YAAY;AACjC,qBAAqB,cAAc;AACnC,MAAM,mCAAmC,kCAAS,oBAAoB;AACtE,iCAAiC,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|