@elliemae/ds-pills 2.2.0 → 2.3.0-alpha.3
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/cjs/components/Pill.js +56 -49
- package/cjs/components/Pill.js.map +7 -0
- package/cjs/components/PillButton.js +54 -52
- package/cjs/components/PillButton.js.map +7 -0
- package/cjs/components/PillGroup.js +61 -53
- package/cjs/components/PillGroup.js.map +7 -0
- package/cjs/components/index.js +30 -17
- package/cjs/components/index.js.map +7 -0
- package/cjs/components/styled.js +228 -78
- package/cjs/components/styled.js.map +7 -0
- package/cjs/components/types/DropdownPill.js +79 -77
- package/cjs/components/types/DropdownPill.js.map +7 -0
- package/cjs/components/types/InputPill.js +58 -48
- package/cjs/components/types/InputPill.js.map +7 -0
- package/cjs/components/types/LabelPill.js +44 -38
- package/cjs/components/types/LabelPill.js.map +7 -0
- package/cjs/components/types/ReadOnlyPill.js +48 -43
- package/cjs/components/types/ReadOnlyPill.js.map +7 -0
- package/cjs/components/types/RemovablePill.js +60 -53
- package/cjs/components/types/RemovablePill.js.map +7 -0
- package/cjs/components/types/ValuePill.js +48 -43
- package/cjs/components/types/ValuePill.js.map +7 -0
- package/cjs/components/types/index.js +33 -19
- package/cjs/components/types/index.js.map +7 -0
- package/cjs/deprecated/DropdownPill.js +80 -101
- package/cjs/deprecated/DropdownPill.js.map +7 -0
- package/cjs/deprecated/InputPill.js +67 -69
- package/cjs/deprecated/InputPill.js.map +7 -0
- package/cjs/deprecated/LabeledDropdownPills.js +92 -96
- package/cjs/deprecated/LabeledDropdownPills.js.map +7 -0
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +91 -94
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +7 -0
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +106 -114
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +7 -0
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +119 -127
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +7 -0
- package/cjs/deprecated/LabeledDropdownPillsTypes/utils.js +39 -15
- package/cjs/deprecated/LabeledDropdownPillsTypes/utils.js.map +7 -0
- package/cjs/deprecated/LabeledPills.js +65 -52
- package/cjs/deprecated/LabeledPills.js.map +7 -0
- package/cjs/deprecated/OverflowPill.js +59 -53
- package/cjs/deprecated/OverflowPill.js.map +7 -0
- package/cjs/deprecated/Pill.js +67 -82
- package/cjs/deprecated/Pill.js.map +7 -0
- package/cjs/deprecated/PillGroup.js +68 -68
- package/cjs/deprecated/PillGroup.js.map +7 -0
- package/cjs/deprecated/ReadOnlyPill.js +93 -94
- package/cjs/deprecated/ReadOnlyPill.js.map +7 -0
- package/cjs/deprecated/RemovablePill.js +61 -57
- package/cjs/deprecated/RemovablePill.js.map +7 -0
- package/cjs/deprecated/index.js +43 -33
- package/cjs/deprecated/index.js.map +7 -0
- package/cjs/index.d.js +27 -2
- package/cjs/index.d.js.map +7 -0
- package/cjs/index.js +37 -43
- package/cjs/index.js.map +7 -0
- package/cjs/props.js +72 -46
- package/cjs/props.js.map +7 -0
- package/cjs/utils.js +43 -25
- package/cjs/utils.js.map +7 -0
- package/esm/components/Pill.js +18 -31
- package/esm/components/Pill.js.map +7 -0
- package/esm/components/PillButton.js +22 -39
- package/esm/components/PillButton.js.map +7 -0
- package/esm/components/PillGroup.js +28 -38
- package/esm/components/PillGroup.js.map +7 -0
- package/esm/components/index.js +5 -3
- package/esm/components/index.js.map +7 -0
- package/esm/components/styled.js +205 -66
- package/esm/components/styled.js.map +7 -0
- package/esm/components/types/DropdownPill.js +50 -67
- package/esm/components/types/DropdownPill.js.map +7 -0
- package/esm/components/types/InputPill.js +25 -35
- package/esm/components/types/InputPill.js.map +7 -0
- package/esm/components/types/LabelPill.js +15 -29
- package/esm/components/types/LabelPill.js.map +7 -0
- package/esm/components/types/ReadOnlyPill.js +19 -34
- package/esm/components/types/ReadOnlyPill.js.map +7 -0
- package/esm/components/types/RemovablePill.js +31 -44
- package/esm/components/types/RemovablePill.js.map +7 -0
- package/esm/components/types/ValuePill.js +19 -34
- package/esm/components/types/ValuePill.js.map +7 -0
- package/esm/components/types/index.js +8 -6
- package/esm/components/types/index.js.map +7 -0
- package/esm/deprecated/DropdownPill.js +49 -86
- package/esm/deprecated/DropdownPill.js.map +7 -0
- package/esm/deprecated/InputPill.js +38 -59
- package/esm/deprecated/InputPill.js.map +7 -0
- package/esm/deprecated/LabeledDropdownPills.js +59 -81
- package/esm/deprecated/LabeledDropdownPills.js.map +7 -0
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +60 -84
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +7 -0
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +65 -94
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +7 -0
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +79 -108
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +7 -0
- package/esm/deprecated/LabeledDropdownPillsTypes/utils.js +9 -10
- package/esm/deprecated/LabeledDropdownPillsTypes/utils.js.map +7 -0
- package/esm/deprecated/LabeledPills.js +34 -41
- package/esm/deprecated/LabeledPills.js.map +7 -0
- package/esm/deprecated/OverflowPill.js +25 -37
- package/esm/deprecated/OverflowPill.js.map +7 -0
- package/esm/deprecated/Pill.js +39 -71
- package/esm/deprecated/Pill.js.map +7 -0
- package/esm/deprecated/PillGroup.js +39 -56
- package/esm/deprecated/PillGroup.js.map +7 -0
- package/esm/deprecated/ReadOnlyPill.js +60 -79
- package/esm/deprecated/ReadOnlyPill.js.map +7 -0
- package/esm/deprecated/RemovablePill.js +30 -45
- package/esm/deprecated/RemovablePill.js.map +7 -0
- package/esm/deprecated/index.js +14 -8
- package/esm/deprecated/index.js.map +7 -0
- package/esm/index.d.js +2 -1
- package/esm/index.d.js.map +7 -0
- package/esm/index.js +8 -11
- package/esm/index.js.map +7 -0
- package/esm/props.js +42 -36
- package/esm/props.js.map +7 -0
- package/esm/utils.js +16 -23
- package/esm/utils.js.map +7 -0
- package/package.json +15 -15
- package/types/deprecated/LabeledDropdownPills.d.ts +1 -1
- package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.d.ts +3 -1
- package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.d.ts +3 -1
- package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.d.ts +1 -0
package/cjs/components/Pill.js
CHANGED
|
@@ -1,53 +1,60 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var Pill_exports = {};
|
|
29
|
+
__export(Pill_exports, {
|
|
30
|
+
DSPillV2: () => DSPillV2,
|
|
31
|
+
DSPillV2WithSchema: () => DSPillV2WithSchema
|
|
32
|
+
});
|
|
33
|
+
var React = __toESM(require("react"));
|
|
34
|
+
var import_react = __toESM(require("react"));
|
|
35
|
+
var import_react_desc = require("react-desc");
|
|
36
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
37
|
+
var import_props = require("../props");
|
|
38
|
+
var import_types = require("./types");
|
|
30
39
|
const pillComponentGetter = {
|
|
31
|
-
dropdown:
|
|
32
|
-
input:
|
|
33
|
-
label:
|
|
34
|
-
readonly:
|
|
35
|
-
removable:
|
|
36
|
-
value:
|
|
40
|
+
dropdown: import_types.DropdownPill,
|
|
41
|
+
input: import_types.InputPill,
|
|
42
|
+
label: import_types.LabelPill,
|
|
43
|
+
readonly: import_types.ReadOnlyPill,
|
|
44
|
+
removable: import_types.RemovablePill,
|
|
45
|
+
value: import_types.ValuePill
|
|
37
46
|
};
|
|
38
|
-
|
|
39
|
-
const
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
const {
|
|
43
|
-
type
|
|
44
|
-
} = propsWithDefaults;
|
|
47
|
+
const DSPillV2 = (props) => {
|
|
48
|
+
const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_props.DSPillV2DefaultProps);
|
|
49
|
+
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_props.DSPillV2PropTypes);
|
|
50
|
+
const { type } = propsWithDefaults;
|
|
45
51
|
const PillComponent = pillComponentGetter[type];
|
|
46
|
-
return
|
|
52
|
+
return /* @__PURE__ */ import_react.default.createElement(PillComponent, {
|
|
53
|
+
...propsWithDefaults
|
|
54
|
+
});
|
|
47
55
|
};
|
|
48
|
-
|
|
49
|
-
const DSPillV2WithSchema =
|
|
50
|
-
DSPillV2WithSchema.propTypes =
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
exports.DSPillV2WithSchema = DSPillV2WithSchema;
|
|
56
|
+
DSPillV2.propTypes = import_props.DSPillV2PropTypes;
|
|
57
|
+
const DSPillV2WithSchema = (0, import_react_desc.describe)(DSPillV2).description("Pill");
|
|
58
|
+
DSPillV2WithSchema.propTypes = import_props.DSPillV2PropTypes;
|
|
59
|
+
module.exports = __toCommonJS(Pill_exports);
|
|
60
|
+
//# sourceMappingURL=Pill.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/Pill.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\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;\nconst DSPillV2WithSchema = describe(DSPillV2).description('Pill');\nDSPillV2WithSchema.propTypes = DSPillV2PropTypes;\n\nexport { DSPillV2, DSPillV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,wBAAyB;AACzB,8BAA6E;AAE7E,mBAAwD;AACxD,mBAA2F;AAE3F,MAAM,sBAAwE;AAAA,EAC5E,UAAU;AAAA,EACV,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,OAAO;AAAA;AAGT,MAAM,WAA6C,CAAC,UAAU;AAC5D,QAAM,oBAAoB,0DAA6B,OAAO;AAC9D,8DAA+B,mBAAmB;AAClD,QAAM,EAAE,SAAS;AACjB,QAAM,gBAAgB,oBAAoB;AAE1C,SAAO,mDAAC,eAAD;AAAA,OAAmB;AAAA;AAAA;AAG5B,SAAS,YAAY;AACrB,MAAM,qBAAqB,gCAAS,UAAU,YAAY;AAC1D,mBAAmB,YAAY;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,56 +1,58 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var PillButton_exports = {};
|
|
29
|
+
__export(PillButton_exports, {
|
|
30
|
+
DSPillButton: () => DSPillButton,
|
|
31
|
+
DSPillButtonWithSchema: () => DSPillButtonWithSchema
|
|
32
|
+
});
|
|
33
|
+
var React = __toESM(require("react"));
|
|
34
|
+
var import_react = __toESM(require("react"));
|
|
35
|
+
var import_react_desc = require("react-desc");
|
|
36
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
37
|
+
var import_styled = require("./styled");
|
|
38
|
+
var import_props = require("../props");
|
|
29
39
|
const typeToClassName = {
|
|
30
|
-
only:
|
|
31
|
-
left:
|
|
32
|
-
right:
|
|
40
|
+
only: "ds-pill-button-only",
|
|
41
|
+
left: "ds-pill-button-left",
|
|
42
|
+
right: "ds-pill-button-right"
|
|
33
43
|
};
|
|
34
|
-
|
|
35
|
-
const
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
type,
|
|
41
|
-
children
|
|
42
|
-
} = propsWithDefaults,
|
|
43
|
-
rest = _objectWithoutProperties__default["default"](propsWithDefaults, _excluded);
|
|
44
|
-
|
|
45
|
-
return /*#__PURE__*/jsxRuntime.jsx(styled.StyledPillButton, _objectSpread(_objectSpread({}, rest), {}, {
|
|
44
|
+
const DSPillButton = (props) => {
|
|
45
|
+
const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_props.DSPillButtonDefaultProps);
|
|
46
|
+
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_props.DSPillButtonPropTypes);
|
|
47
|
+
const { type, children, ...rest } = propsWithDefaults;
|
|
48
|
+
return /* @__PURE__ */ import_react.default.createElement(import_styled.StyledPillButton, {
|
|
49
|
+
...rest,
|
|
46
50
|
buttonType: "raw",
|
|
47
|
-
className:
|
|
48
|
-
|
|
49
|
-
}));
|
|
51
|
+
className: `${typeToClassName[type]} ${rest.className}`
|
|
52
|
+
}, children);
|
|
50
53
|
};
|
|
51
|
-
|
|
52
|
-
const DSPillButtonWithSchema =
|
|
53
|
-
DSPillButtonWithSchema.propTypes =
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
exports.DSPillButtonWithSchema = DSPillButtonWithSchema;
|
|
54
|
+
DSPillButton.propTypes = import_props.DSPillButtonPropTypes;
|
|
55
|
+
const DSPillButtonWithSchema = (0, import_react_desc.describe)(DSPillButton).description("Pill button");
|
|
56
|
+
DSPillButtonWithSchema.propTypes = import_props.DSPillButtonPropTypes;
|
|
57
|
+
module.exports = __toCommonJS(PillButton_exports);
|
|
58
|
+
//# sourceMappingURL=PillButton.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/PillButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { DSButtonPropsT } from '@elliemae/ds-button';\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\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;\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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,wBAAyB;AAEzB,8BAA6E;AAC7E,oBAAiC;AACjC,mBAAgE;AAEhE,MAAM,kBAAkB;AAAA,EACtB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA;AAGT,MAAM,eAAoD,CAAC,UAAU;AACnE,QAAM,oBAAoB,0DAA6B,OAAO;AAC9D,8DAA+B,mBAAmB;AAElD,QAAM,EAAE,MAAM,aAAa,SAAS;AAEpC,SACE,mDAAC,gCAAD;AAAA,OAAsB;AAAA,IAAM,YAAW;AAAA,IAAM,WAAW,GAAG,gBAAgB,SAAS,KAAK;AAAA,KACtF;AAAA;AAKP,aAAa,YAAY;AACzB,MAAM,yBAAyB,gCAAS,cAAc,YAAY;AAClE,uBAAuB,YAAY;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,64 +1,72 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var PillGroup_exports = {};
|
|
29
|
+
__export(PillGroup_exports, {
|
|
30
|
+
DSPillGroupV2: () => DSPillGroupV2,
|
|
31
|
+
DSPillGroupV2Context: () => DSPillGroupV2Context,
|
|
32
|
+
DSPillGroupV2WithSchema: () => DSPillGroupV2WithSchema
|
|
33
|
+
});
|
|
34
|
+
var React = __toESM(require("react"));
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_react_desc = require("react-desc");
|
|
37
|
+
var import_uid = require("uid");
|
|
38
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
39
|
+
var import_props = require("../props");
|
|
40
|
+
var import_styled = require("./styled");
|
|
41
|
+
const DSPillGroupV2Context = (0, import_react.createContext)({
|
|
23
42
|
onKeyboardRemove: () => null
|
|
24
43
|
});
|
|
25
|
-
|
|
26
|
-
const
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
const
|
|
30
|
-
const {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
innerRef
|
|
34
|
-
} = propsWithDefaults;
|
|
35
|
-
const onKeyboardRemove = React.useCallback(pillUid => {
|
|
36
|
-
const elems = [...document.querySelectorAll("#".concat(pillGroupUid, " .ds-pill-focus-point"))];
|
|
37
|
-
const pillIndex = elems.findIndex(elem => elem.id === pillUid);
|
|
38
|
-
|
|
44
|
+
const DSPillGroupV2 = (props) => {
|
|
45
|
+
const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_props.DSPillGroupDefaultProps);
|
|
46
|
+
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_props.DSPillGroupPropTypes);
|
|
47
|
+
const pillGroupUid = (0, import_react.useMemo)(() => `ds-pill-group-${(0, import_uid.uid)()}`, []);
|
|
48
|
+
const { children, width, innerRef } = propsWithDefaults;
|
|
49
|
+
const onKeyboardRemove = (0, import_react.useCallback)((pillUid) => {
|
|
50
|
+
const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)];
|
|
51
|
+
const pillIndex = elems.findIndex((elem) => elem.id === pillUid);
|
|
39
52
|
if (pillIndex > 0) {
|
|
40
53
|
elems[pillIndex - 1].focus();
|
|
41
54
|
} else if (pillIndex + 1 < elems.length) {
|
|
42
55
|
elems[pillIndex + 1].focus();
|
|
43
56
|
}
|
|
44
57
|
}, [pillGroupUid]);
|
|
45
|
-
return
|
|
46
|
-
value: {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
}, void 0, /*#__PURE__*/jsxRuntime.jsx(styled.StyledPillGroup, {
|
|
50
|
-
width: width,
|
|
58
|
+
return /* @__PURE__ */ import_react.default.createElement(DSPillGroupV2Context.Provider, {
|
|
59
|
+
value: { onKeyboardRemove }
|
|
60
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_styled.StyledPillGroup, {
|
|
61
|
+
width,
|
|
51
62
|
id: pillGroupUid,
|
|
52
|
-
cols:
|
|
63
|
+
cols: import_react.default.Children.map(children, () => "auto"),
|
|
53
64
|
gutter: "2px",
|
|
54
|
-
ref: innerRef
|
|
55
|
-
|
|
56
|
-
}));
|
|
65
|
+
ref: innerRef
|
|
66
|
+
}, children));
|
|
57
67
|
};
|
|
58
|
-
|
|
59
|
-
const DSPillGroupV2WithSchema =
|
|
60
|
-
DSPillGroupV2WithSchema.propTypes =
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
exports.DSPillGroupV2Context = DSPillGroupV2Context;
|
|
64
|
-
exports.DSPillGroupV2WithSchema = DSPillGroupV2WithSchema;
|
|
68
|
+
DSPillGroupV2.propTypes = import_props.DSPillGroupPropTypes;
|
|
69
|
+
const DSPillGroupV2WithSchema = (0, import_react_desc.describe)(DSPillGroupV2);
|
|
70
|
+
DSPillGroupV2WithSchema.propTypes = import_props.DSPillGroupPropTypes;
|
|
71
|
+
module.exports = __toCommonJS(PillGroup_exports);
|
|
72
|
+
//# sourceMappingURL=PillGroup.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/PillGroup.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { createContext, useCallback, useMemo } from 'react';\nimport { describe } from 'react-desc';\nimport { uid } from 'uid';\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { DSPillGroupProps } from '../index.d';\nimport { DSPillGroupDefaultProps, DSPillGroupPropTypes } from '../props';\nimport { StyledPillGroup } from './styled';\n\nexport const DSPillGroupV2Context = createContext<{ onKeyboardRemove: (pillUid: string) => void }>({\n onKeyboardRemove: () => null,\n});\n\nconst DSPillGroupV2: React.ComponentType<DSPillGroupProps> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, DSPillGroupDefaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, DSPillGroupPropTypes);\n\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\n return (\n <DSPillGroupV2Context.Provider value={{ onKeyboardRemove }}>\n <StyledPillGroup\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;\nconst DSPillGroupV2WithSchema = describe(DSPillGroupV2);\nDSPillGroupV2WithSchema.propTypes = DSPillGroupPropTypes;\n\nexport { DSPillGroupV2, DSPillGroupV2WithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA2D;AAC3D,wBAAyB;AACzB,iBAAoB;AACpB,8BAA6E;AAE7E,mBAA8D;AAC9D,oBAAgC;AAEzB,MAAM,uBAAuB,gCAA+D;AAAA,EACjG,kBAAkB,MAAM;AAAA;AAG1B,MAAM,gBAAuD,CAAC,UAAU;AACtE,QAAM,oBAAoB,0DAA6B,OAAO;AAC9D,8DAA+B,mBAAmB;AAElD,QAAM,eAAe,0BAAQ,MAAM,iBAAiB,yBAAS;AAC7D,QAAM,EAAE,UAAU,OAAO,aAAa;AACtC,QAAM,mBAAmB,8BACvB,CAAC,YAAoB;AACnB,UAAM,QAAQ,CAAC,GAAG,SAAS,iBAAiB,IAAI;AAEhD,UAAM,YAAY,MAAM,UAAU,CAAC,SAAS,KAAK,OAAO;AAExD,QAAI,YAAY,GAAG;AACjB,YAAM,YAAY,GAAG;AAAA,eACZ,YAAY,IAAI,MAAM,QAAQ;AACvC,YAAM,YAAY,GAAG;AAAA;AAAA,KAGzB,CAAC;AAGH,SACE,mDAAC,qBAAqB,UAAtB;AAAA,IAA+B,OAAO,EAAE;AAAA,KACtC,mDAAC,+BAAD;AAAA,IACE;AAAA,IACA,IAAI;AAAA,IACJ,MAAM,qBAAM,SAAS,IAAI,UAAU,MAAM;AAAA,IACzC,QAAO;AAAA,IACP,KAAK;AAAA,KAEJ;AAAA;AAMT,cAAc,YAAY;AAC1B,MAAM,0BAA0B,gCAAS;AACzC,wBAAwB,YAAY;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/components/index.js
CHANGED
|
@@ -1,17 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
9
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
10
|
+
for (let key of __getOwnPropNames(module2))
|
|
11
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
12
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
13
|
+
}
|
|
14
|
+
return target;
|
|
15
|
+
};
|
|
16
|
+
var __toESM = (module2, isNodeMode) => {
|
|
17
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
20
|
+
return (module2, temp) => {
|
|
21
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
22
|
+
};
|
|
23
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
24
|
+
var components_exports = {};
|
|
25
|
+
var React = __toESM(require("react"));
|
|
26
|
+
__reExport(components_exports, require("./Pill"));
|
|
27
|
+
__reExport(components_exports, require("./PillGroup"));
|
|
28
|
+
__reExport(components_exports, require("./PillButton"));
|
|
29
|
+
module.exports = __toCommonJS(components_exports);
|
|
30
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export * from './Pill';\nexport * from './PillGroup';\nexport * from './PillButton';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;ADAvB,+BAAc;AACd,+BAAc;AACd,+BAAc;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|