@elliemae/ds-pills 2.2.0-alpha.2 → 2.2.0-beta.0
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 +49 -56
- package/cjs/components/PillButton.js +52 -54
- package/cjs/components/PillGroup.js +53 -61
- package/cjs/components/index.js +17 -30
- package/cjs/components/styled.js +78 -228
- package/cjs/components/types/DropdownPill.js +77 -79
- package/cjs/components/types/InputPill.js +48 -58
- package/cjs/components/types/LabelPill.js +38 -44
- package/cjs/components/types/ReadOnlyPill.js +43 -48
- package/cjs/components/types/RemovablePill.js +53 -60
- package/cjs/components/types/ValuePill.js +43 -48
- package/cjs/components/types/index.js +19 -33
- package/cjs/deprecated/DropdownPill.js +101 -80
- package/cjs/deprecated/InputPill.js +69 -67
- package/cjs/deprecated/LabeledDropdownPills.js +96 -92
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +94 -91
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +114 -106
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +127 -119
- package/cjs/deprecated/LabeledDropdownPillsTypes/utils.js +15 -39
- package/cjs/deprecated/LabeledPills.js +52 -65
- package/cjs/deprecated/OverflowPill.js +53 -59
- package/cjs/deprecated/Pill.js +82 -67
- package/cjs/deprecated/PillGroup.js +68 -68
- package/cjs/deprecated/ReadOnlyPill.js +94 -93
- package/cjs/deprecated/RemovablePill.js +57 -61
- package/cjs/deprecated/index.js +33 -43
- package/cjs/index.d.js +2 -27
- package/cjs/index.js +43 -37
- package/cjs/props.js +46 -72
- package/cjs/utils.js +25 -43
- package/esm/components/Pill.js +31 -18
- package/esm/components/PillButton.js +39 -22
- package/esm/components/PillGroup.js +38 -28
- package/esm/components/index.js +3 -5
- package/esm/components/styled.js +66 -205
- package/esm/components/types/DropdownPill.js +67 -50
- package/esm/components/types/InputPill.js +35 -25
- package/esm/components/types/LabelPill.js +29 -15
- package/esm/components/types/ReadOnlyPill.js +34 -19
- package/esm/components/types/RemovablePill.js +44 -31
- package/esm/components/types/ValuePill.js +34 -19
- package/esm/components/types/index.js +6 -8
- package/esm/deprecated/DropdownPill.js +86 -49
- package/esm/deprecated/InputPill.js +59 -38
- package/esm/deprecated/LabeledDropdownPills.js +81 -59
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js +84 -60
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js +94 -65
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js +108 -79
- package/esm/deprecated/LabeledDropdownPillsTypes/utils.js +10 -9
- package/esm/deprecated/LabeledPills.js +41 -34
- package/esm/deprecated/OverflowPill.js +37 -25
- package/esm/deprecated/Pill.js +71 -39
- package/esm/deprecated/PillGroup.js +56 -39
- package/esm/deprecated/ReadOnlyPill.js +79 -60
- package/esm/deprecated/RemovablePill.js +45 -30
- package/esm/deprecated/index.js +8 -14
- package/esm/index.d.js +1 -2
- package/esm/index.js +11 -8
- package/esm/props.js +36 -42
- package/esm/utils.js +23 -16
- package/package.json +15 -15
- package/types/components/PillGroup.d.ts +1 -1
- package/types/deprecated/DropdownPill.d.ts +1 -10
- package/types/deprecated/LabeledDropdownPills.d.ts +1 -12
- package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.d.ts +1 -3
- package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.d.ts +1 -3
- package/types/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.d.ts +0 -1
- package/types/deprecated/LabeledPills.d.ts +1 -8
- package/types/deprecated/OverflowPill.d.ts +1 -5
- package/types/deprecated/Pill.d.ts +1 -9
- package/types/deprecated/PillGroup.d.ts +1 -7
- package/types/deprecated/ReadOnlyPill.d.ts +1 -8
- package/types/deprecated/RemovablePill.d.ts +1 -7
- package/cjs/components/Pill.js.map +0 -7
- package/cjs/components/PillButton.js.map +0 -7
- package/cjs/components/PillGroup.js.map +0 -7
- package/cjs/components/index.js.map +0 -7
- package/cjs/components/styled.js.map +0 -7
- package/cjs/components/types/DropdownPill.js.map +0 -7
- package/cjs/components/types/InputPill.js.map +0 -7
- package/cjs/components/types/LabelPill.js.map +0 -7
- package/cjs/components/types/ReadOnlyPill.js.map +0 -7
- package/cjs/components/types/RemovablePill.js.map +0 -7
- package/cjs/components/types/ValuePill.js.map +0 -7
- package/cjs/components/types/index.js.map +0 -7
- package/cjs/deprecated/DropdownPill.js.map +0 -7
- package/cjs/deprecated/InputPill.js.map +0 -7
- package/cjs/deprecated/LabeledDropdownPills.js.map +0 -7
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +0 -7
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +0 -7
- package/cjs/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +0 -7
- package/cjs/deprecated/LabeledDropdownPillsTypes/utils.js.map +0 -7
- package/cjs/deprecated/LabeledPills.js.map +0 -7
- package/cjs/deprecated/OverflowPill.js.map +0 -7
- package/cjs/deprecated/Pill.js.map +0 -7
- package/cjs/deprecated/PillGroup.js.map +0 -7
- package/cjs/deprecated/ReadOnlyPill.js.map +0 -7
- package/cjs/deprecated/RemovablePill.js.map +0 -7
- package/cjs/deprecated/index.js.map +0 -7
- package/cjs/index.d.js.map +0 -7
- package/cjs/index.js.map +0 -7
- package/cjs/props.js.map +0 -7
- package/cjs/utils.js.map +0 -7
- package/esm/components/Pill.js.map +0 -7
- package/esm/components/PillButton.js.map +0 -7
- package/esm/components/PillGroup.js.map +0 -7
- package/esm/components/index.js.map +0 -7
- package/esm/components/styled.js.map +0 -7
- package/esm/components/types/DropdownPill.js.map +0 -7
- package/esm/components/types/InputPill.js.map +0 -7
- package/esm/components/types/LabelPill.js.map +0 -7
- package/esm/components/types/ReadOnlyPill.js.map +0 -7
- package/esm/components/types/RemovablePill.js.map +0 -7
- package/esm/components/types/ValuePill.js.map +0 -7
- package/esm/components/types/index.js.map +0 -7
- package/esm/deprecated/DropdownPill.js.map +0 -7
- package/esm/deprecated/InputPill.js.map +0 -7
- package/esm/deprecated/LabeledDropdownPills.js.map +0 -7
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownCascadeMenuPill.js.map +0 -7
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownMultiPill.js.map +0 -7
- package/esm/deprecated/LabeledDropdownPillsTypes/LabeledDropdownSinglePill.js.map +0 -7
- package/esm/deprecated/LabeledDropdownPillsTypes/utils.js.map +0 -7
- package/esm/deprecated/LabeledPills.js.map +0 -7
- package/esm/deprecated/OverflowPill.js.map +0 -7
- package/esm/deprecated/Pill.js.map +0 -7
- package/esm/deprecated/PillGroup.js.map +0 -7
- package/esm/deprecated/ReadOnlyPill.js.map +0 -7
- package/esm/deprecated/RemovablePill.js.map +0 -7
- package/esm/deprecated/index.js.map +0 -7
- package/esm/index.d.js.map +0 -7
- package/esm/index.js.map +0 -7
- package/esm/props.js.map +0 -7
- package/esm/utils.js.map +0 -7
package/esm/deprecated/index.js
CHANGED
|
@@ -1,14 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
export
|
|
3
|
-
export
|
|
4
|
-
export
|
|
5
|
-
export
|
|
6
|
-
export
|
|
7
|
-
export
|
|
8
|
-
export
|
|
9
|
-
export * from "./OverflowPill";
|
|
10
|
-
import { default as default2 } from "./Pill";
|
|
11
|
-
export {
|
|
12
|
-
default2 as default
|
|
13
|
-
};
|
|
14
|
-
//# sourceMappingURL=index.js.map
|
|
1
|
+
export { DSPillWithSchema, Pill, Pill as default } from './Pill.js';
|
|
2
|
+
export { Container, DSPillGroupWithSchema, PillGroup } from './PillGroup.js';
|
|
3
|
+
export { DSLabeledDropdownPillsWithSchema, LabeledDropdownPills } from './LabeledDropdownPills.js';
|
|
4
|
+
export { DSLabeledPillsWithSchema, LabeledPills } from './LabeledPills.js';
|
|
5
|
+
export { DSDropdownPillWithSchema, DropdownPill } from './DropdownPill.js';
|
|
6
|
+
export { DSRemovablePillWithSchema, RemovablePill } from './RemovablePill.js';
|
|
7
|
+
export { DSReadOnlyPillWithSchema, ReadOnlyPill } from './ReadOnlyPill.js';
|
|
8
|
+
export { DSOverflowPillWithSchema, OverflowPill } from './OverflowPill.js';
|
package/esm/index.d.js
CHANGED
|
@@ -1,2 +1 @@
|
|
|
1
|
-
|
|
2
|
-
//# sourceMappingURL=index.d.js.map
|
|
1
|
+
|
package/esm/index.js
CHANGED
|
@@ -1,8 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
export
|
|
3
|
-
export
|
|
4
|
-
|
|
5
|
-
export {
|
|
6
|
-
|
|
7
|
-
};
|
|
8
|
-
|
|
1
|
+
export { DSPillWithSchema, Pill, Pill as default } from './deprecated/Pill.js';
|
|
2
|
+
export { Container, DSPillGroupWithSchema, PillGroup } from './deprecated/PillGroup.js';
|
|
3
|
+
export { DSLabeledDropdownPillsWithSchema, LabeledDropdownPills } from './deprecated/LabeledDropdownPills.js';
|
|
4
|
+
export { DSLabeledPillsWithSchema, LabeledPills } from './deprecated/LabeledPills.js';
|
|
5
|
+
export { DSDropdownPillWithSchema, DropdownPill } from './deprecated/DropdownPill.js';
|
|
6
|
+
export { DSRemovablePillWithSchema, RemovablePill } from './deprecated/RemovablePill.js';
|
|
7
|
+
export { DSReadOnlyPillWithSchema, ReadOnlyPill } from './deprecated/ReadOnlyPill.js';
|
|
8
|
+
export { DSOverflowPillWithSchema, OverflowPill } from './deprecated/OverflowPill.js';
|
|
9
|
+
export { DSPillV2, DSPillV2WithSchema } from './components/Pill.js';
|
|
10
|
+
export { DSPillGroupV2, DSPillGroupV2Context, DSPillGroupV2WithSchema } from './components/PillGroup.js';
|
|
11
|
+
export { DSPillButton, DSPillButtonWithSchema } from './components/PillButton.js';
|
package/esm/props.js
CHANGED
|
@@ -1,44 +1,45 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import { PropTypes } from 'react-desc';
|
|
2
|
+
import { DSInput } from '@elliemae/ds-form';
|
|
3
|
+
|
|
4
|
+
/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
|
|
5
|
+
const pillTypes = PropTypes.oneOf(['label', 'value', 'input', 'dropdown', 'removable', 'readonly']);
|
|
5
6
|
const DSPillV2PropTypes = {
|
|
6
|
-
label: PropTypes.string.description(
|
|
7
|
-
type: pillTypes.description(
|
|
8
|
-
innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description(
|
|
9
|
-
size: PropTypes.oneOf([
|
|
10
|
-
ariaLabel: PropTypes.string.description(
|
|
11
|
-
labelTruncated: PropTypes.bool.description(
|
|
12
|
-
tooltipValue: PropTypes.string.description(
|
|
13
|
-
iconLeft: PropTypes.node.description(
|
|
14
|
-
iconRight: PropTypes.node.description(
|
|
15
|
-
onRemove: PropTypes.func.description(
|
|
16
|
-
inputPlaceholder: PropTypes.string.description(
|
|
17
|
-
onInputChange: PropTypes.func.description(
|
|
18
|
-
onInputClear: PropTypes.func.description(
|
|
19
|
-
inputWidth: PropTypes.number.description(
|
|
20
|
-
dropdownProps: PropTypes.object.description(
|
|
21
|
-
onDropdownClick: PropTypes.func.description(
|
|
7
|
+
label: PropTypes.string.description('Label to show in the pill').isRequired,
|
|
8
|
+
type: pillTypes.description('The type of pill that you want to render').isRequired,
|
|
9
|
+
innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Reference to the focuseable internal element of each pill (remove icons, inputs, dropdown, etc.)').defaultValue(() => null),
|
|
10
|
+
size: PropTypes.oneOf(['s', 'm']).description('Vertical pill size').defaultValue('m'),
|
|
11
|
+
ariaLabel: PropTypes.string.description('Aria label for the pill. If not provided we will use the label').defaultValue(''),
|
|
12
|
+
labelTruncated: PropTypes.bool.description('Whether to truncate the pills label').defaultValue(true),
|
|
13
|
+
tooltipValue: PropTypes.string.description('String to show as a tooltip in the value pill').defaultValue(''),
|
|
14
|
+
iconLeft: PropTypes.node.description('A component to show int the left of a readonly pill').defaultValue(null),
|
|
15
|
+
iconRight: PropTypes.node.description('A component to show in the right of a readonly pill').defaultValue(null),
|
|
16
|
+
onRemove: PropTypes.func.description('Callback triggered when removing a pill with the close icon').defaultValue(() => null),
|
|
17
|
+
inputPlaceholder: PropTypes.string.description('Placeholder for the input pill').defaultValue(''),
|
|
18
|
+
onInputChange: PropTypes.func.description('Callback triggered when user provides input to the input pill').defaultValue(() => null),
|
|
19
|
+
onInputClear: PropTypes.func.description('Callback triggered when the user clears an input pill').defaultValue(() => null),
|
|
20
|
+
inputWidth: PropTypes.number.description('Width in pixels for the input tag in the input pill').defaultValue(150),
|
|
21
|
+
dropdownProps: PropTypes.object.description('Properties that will be used for the dropdown-menu').defaultValue({}),
|
|
22
|
+
onDropdownClick: PropTypes.func.description('Callback when dropdown button is clicked or pressed').defaultValue(() => null)
|
|
22
23
|
};
|
|
23
24
|
const DSPillButtonPropTypes = {
|
|
24
|
-
type: PropTypes.oneOf([
|
|
25
|
-
width: PropTypes.string.description(
|
|
26
|
-
height: PropTypes.string.description(
|
|
25
|
+
type: PropTypes.oneOf(['only', 'left', 'right']).description('The position in which this button will be placed. Only used for css styling internally').defaultValue('right'),
|
|
26
|
+
width: PropTypes.string.description('Width of the button').defaultValue('100%'),
|
|
27
|
+
height: PropTypes.string.description('Height of the button').defaultValue('100%')
|
|
27
28
|
};
|
|
28
29
|
const DSPillGroupPropTypes = {
|
|
29
|
-
width: PropTypes.string.description(
|
|
30
|
-
innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description(
|
|
30
|
+
width: PropTypes.string.description('Width of the group').defaultValue('fit-content'),
|
|
31
|
+
innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('Reference to the pill group wrapper').defaultValue(() => null)
|
|
31
32
|
};
|
|
32
33
|
const DSPillV2DefaultProps = {
|
|
33
34
|
innerRef: () => null,
|
|
34
|
-
ariaLabel:
|
|
35
|
-
size:
|
|
35
|
+
ariaLabel: '',
|
|
36
|
+
size: 'm',
|
|
36
37
|
labelTruncated: true,
|
|
37
|
-
tooltipValue:
|
|
38
|
+
tooltipValue: '',
|
|
38
39
|
iconLeft: null,
|
|
39
40
|
iconRight: null,
|
|
40
41
|
onRemove: () => null,
|
|
41
|
-
inputPlaceholder:
|
|
42
|
+
inputPlaceholder: '',
|
|
42
43
|
onInputChange: () => null,
|
|
43
44
|
onInputClear: () => null,
|
|
44
45
|
inputWidth: 72,
|
|
@@ -47,20 +48,13 @@ const DSPillV2DefaultProps = {
|
|
|
47
48
|
onDropdownClick: () => null
|
|
48
49
|
};
|
|
49
50
|
const DSPillButtonDefaultProps = {
|
|
50
|
-
type:
|
|
51
|
-
width:
|
|
52
|
-
height:
|
|
51
|
+
type: 'right',
|
|
52
|
+
width: '100%',
|
|
53
|
+
height: '100%'
|
|
53
54
|
};
|
|
54
55
|
const DSPillGroupDefaultProps = {
|
|
55
|
-
width:
|
|
56
|
+
width: 'fit-content',
|
|
56
57
|
innerRef: () => null
|
|
57
58
|
};
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
DSPillButtonPropTypes,
|
|
61
|
-
DSPillGroupDefaultProps,
|
|
62
|
-
DSPillGroupPropTypes,
|
|
63
|
-
DSPillV2DefaultProps,
|
|
64
|
-
DSPillV2PropTypes
|
|
65
|
-
};
|
|
66
|
-
//# sourceMappingURL=props.js.map
|
|
59
|
+
|
|
60
|
+
export { DSPillButtonDefaultProps, DSPillButtonPropTypes, DSPillGroupDefaultProps, DSPillGroupPropTypes, DSPillV2DefaultProps, DSPillV2PropTypes };
|
package/esm/utils.js
CHANGED
|
@@ -1,17 +1,24 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
1
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
2
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
4
|
+
|
|
5
|
+
const setMultipleRefs = function () {
|
|
6
|
+
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
7
|
+
refs[_key] = arguments[_key];
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
return _ref => {
|
|
11
|
+
refs.forEach(ref => {
|
|
12
|
+
if (!ref || !_ref) return;
|
|
13
|
+
|
|
14
|
+
if (typeof ref === 'function') {
|
|
15
|
+
ref(_ref);
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
if (ref) ref.current = _ref;
|
|
20
|
+
});
|
|
21
|
+
};
|
|
13
22
|
};
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
};
|
|
17
|
-
//# sourceMappingURL=utils.js.map
|
|
23
|
+
|
|
24
|
+
export { setMultipleRefs };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-pills",
|
|
3
|
-
"version": "2.2.0-
|
|
3
|
+
"version": "2.2.0-beta.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Pills",
|
|
6
6
|
"module": "./esm/index.js",
|
|
@@ -144,20 +144,20 @@
|
|
|
144
144
|
"build": "node ../../scripts/build/build.js"
|
|
145
145
|
},
|
|
146
146
|
"dependencies": {
|
|
147
|
-
"@elliemae/ds-button": "2.2.0-
|
|
148
|
-
"@elliemae/ds-classnames": "2.2.0-
|
|
149
|
-
"@elliemae/ds-dropdownmenu": "2.2.0-
|
|
150
|
-
"@elliemae/ds-form": "2.2.0-
|
|
151
|
-
"@elliemae/ds-grid": "2.2.0-
|
|
152
|
-
"@elliemae/ds-icons": "2.2.0-
|
|
153
|
-
"@elliemae/ds-modal": "2.2.0-
|
|
154
|
-
"@elliemae/ds-popover": "2.2.0-
|
|
155
|
-
"@elliemae/ds-props-helpers": "2.2.0-
|
|
156
|
-
"@elliemae/ds-shared": "2.2.0-
|
|
157
|
-
"@elliemae/ds-system": "2.2.0-
|
|
158
|
-
"@elliemae/ds-tooltip": "2.2.0-
|
|
159
|
-
"@elliemae/ds-truncated-tooltip-text": "2.2.0-
|
|
160
|
-
"@elliemae/ds-utilities": "2.2.0-
|
|
147
|
+
"@elliemae/ds-button": "2.2.0-beta.0",
|
|
148
|
+
"@elliemae/ds-classnames": "2.2.0-beta.0",
|
|
149
|
+
"@elliemae/ds-dropdownmenu": "2.2.0-beta.0",
|
|
150
|
+
"@elliemae/ds-form": "2.2.0-beta.0",
|
|
151
|
+
"@elliemae/ds-grid": "2.2.0-beta.0",
|
|
152
|
+
"@elliemae/ds-icons": "2.2.0-beta.0",
|
|
153
|
+
"@elliemae/ds-modal": "2.2.0-beta.0",
|
|
154
|
+
"@elliemae/ds-popover": "2.2.0-beta.0",
|
|
155
|
+
"@elliemae/ds-props-helpers": "2.2.0-beta.0",
|
|
156
|
+
"@elliemae/ds-shared": "2.2.0-beta.0",
|
|
157
|
+
"@elliemae/ds-system": "2.2.0-beta.0",
|
|
158
|
+
"@elliemae/ds-tooltip": "2.2.0-beta.0",
|
|
159
|
+
"@elliemae/ds-truncated-tooltip-text": "2.2.0-beta.0",
|
|
160
|
+
"@elliemae/ds-utilities": "2.2.0-beta.0",
|
|
161
161
|
"prop-types": "~15.7.2",
|
|
162
162
|
"react-desc": "~4.1.3",
|
|
163
163
|
"uid": "~2.0.0"
|
|
@@ -6,7 +6,7 @@ export declare const DSPillGroupV2Context: React.Context<{
|
|
|
6
6
|
}>;
|
|
7
7
|
declare const DSPillGroupV2: React.ComponentType<DSPillGroupProps>;
|
|
8
8
|
declare const DSPillGroupV2WithSchema: {
|
|
9
|
-
(props?:
|
|
9
|
+
(props?: unknown): JSX.Element;
|
|
10
10
|
propTypes: unknown;
|
|
11
11
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
12
12
|
};
|
|
@@ -59,16 +59,7 @@ declare namespace DropdownPill {
|
|
|
59
59
|
};
|
|
60
60
|
}
|
|
61
61
|
declare const DSDropdownPillWithSchema: {
|
|
62
|
-
(props?:
|
|
63
|
-
[x: string]: any;
|
|
64
|
-
containerProps?: {} | undefined;
|
|
65
|
-
label?: string | undefined;
|
|
66
|
-
variant: any;
|
|
67
|
-
tabIndex?: number | undefined;
|
|
68
|
-
closeMenuOnItemSelection?: boolean | undefined;
|
|
69
|
-
maxWidth: any;
|
|
70
|
-
minWidth: any;
|
|
71
|
-
} | undefined): JSX.Element;
|
|
62
|
+
(props?: unknown): JSX.Element;
|
|
72
63
|
propTypes: unknown;
|
|
73
64
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
74
65
|
};
|
|
@@ -75,18 +75,7 @@ declare namespace LabeledDropdownPills {
|
|
|
75
75
|
};
|
|
76
76
|
}
|
|
77
77
|
declare const DSLabeledDropdownPillsWithSchema: {
|
|
78
|
-
(props?:
|
|
79
|
-
[x: string]: any;
|
|
80
|
-
label?: string | undefined;
|
|
81
|
-
value: any;
|
|
82
|
-
type: any;
|
|
83
|
-
onFocusNextGroup: any;
|
|
84
|
-
onFocusPreviousGroup: any;
|
|
85
|
-
onFocusGroupSet: any;
|
|
86
|
-
maxWidth: any;
|
|
87
|
-
minWidth: any;
|
|
88
|
-
fixed: any;
|
|
89
|
-
} | undefined): JSX.Element;
|
|
78
|
+
(props?: unknown): JSX.Element;
|
|
90
79
|
propTypes: unknown;
|
|
91
80
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
92
81
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
2
|
+
export default function LabeledDropdownCascadeMenuPill({ label, options, value: optionValue, onChange, onRemove, value: selection, placeholder, onFocusNextGroup, onFocusPreviousGroup, onFocusGroupSet, maxWidth, minWidth, ...menuProps }: {
|
|
3
3
|
[x: string]: any;
|
|
4
4
|
label: any;
|
|
5
5
|
options: any;
|
|
@@ -13,5 +13,3 @@ declare function LabeledDropdownCascadeMenuPill({ label, options, value: optionV
|
|
|
13
13
|
maxWidth: any;
|
|
14
14
|
minWidth: any;
|
|
15
15
|
}): JSX.Element;
|
|
16
|
-
export { LabeledDropdownCascadeMenuPill };
|
|
17
|
-
export default LabeledDropdownCascadeMenuPill;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
2
|
+
export default function LabeledDropdownMultiPills({ label, options, value, onSelect, onRemove, onChange, // if this is defined, then it's calculating the next result onSelect or onRemove
|
|
3
3
|
maxWidth, minWidth, ...menuProps }: {
|
|
4
4
|
[x: string]: any;
|
|
5
5
|
label: any;
|
|
@@ -11,5 +11,3 @@ maxWidth, minWidth, ...menuProps }: {
|
|
|
11
11
|
maxWidth: any;
|
|
12
12
|
minWidth: any;
|
|
13
13
|
}): JSX.Element;
|
|
14
|
-
export { LabeledDropdownMultiPills };
|
|
15
|
-
export default LabeledDropdownMultiPills;
|
|
@@ -45,14 +45,7 @@ declare namespace LabeledPills {
|
|
|
45
45
|
};
|
|
46
46
|
}
|
|
47
47
|
declare const DSLabeledPillsWithSchema: {
|
|
48
|
-
(props?:
|
|
49
|
-
children: any;
|
|
50
|
-
label?: string | undefined;
|
|
51
|
-
leftAddon: any;
|
|
52
|
-
onFocusGroupSet: any;
|
|
53
|
-
onFocusNextGroup: any;
|
|
54
|
-
onFocusPreviousGroup: any;
|
|
55
|
-
} | undefined): JSX.Element;
|
|
48
|
+
(props?: unknown): JSX.Element;
|
|
56
49
|
propTypes: unknown;
|
|
57
50
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
58
51
|
};
|
|
@@ -26,11 +26,7 @@ declare namespace OverflowPill {
|
|
|
26
26
|
};
|
|
27
27
|
}
|
|
28
28
|
declare const DSOverflowPillWithSchema: {
|
|
29
|
-
(props?:
|
|
30
|
-
containerProps?: {} | undefined;
|
|
31
|
-
label?: string | undefined;
|
|
32
|
-
options?: never[] | undefined;
|
|
33
|
-
} | undefined): JSX.Element;
|
|
29
|
+
(props?: unknown): JSX.Element;
|
|
34
30
|
propTypes: unknown;
|
|
35
31
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
36
32
|
};
|
|
@@ -51,15 +51,7 @@ declare namespace Pill {
|
|
|
51
51
|
};
|
|
52
52
|
}
|
|
53
53
|
declare const DSPillWithSchema: {
|
|
54
|
-
(props?:
|
|
55
|
-
[x: string]: any;
|
|
56
|
-
containerProps?: {} | undefined;
|
|
57
|
-
label?: string | undefined;
|
|
58
|
-
leftAddon: any;
|
|
59
|
-
rightAddon: any;
|
|
60
|
-
variant?: string | undefined;
|
|
61
|
-
size?: string | undefined;
|
|
62
|
-
} | undefined): JSX.Element;
|
|
54
|
+
(props?: unknown): JSX.Element;
|
|
63
55
|
propTypes: unknown;
|
|
64
56
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
65
57
|
};
|
|
@@ -43,13 +43,7 @@ declare const PillGroup: {
|
|
|
43
43
|
};
|
|
44
44
|
};
|
|
45
45
|
declare const DSPillGroupWithSchema: {
|
|
46
|
-
(props?:
|
|
47
|
-
containerProps?: {} | undefined;
|
|
48
|
-
onFocusNextGroup: any;
|
|
49
|
-
onFocusPreviousGroup: any;
|
|
50
|
-
onFocusGroupSet: any;
|
|
51
|
-
children: any;
|
|
52
|
-
} | undefined): JSX.Element;
|
|
46
|
+
(props?: unknown): JSX.Element;
|
|
53
47
|
propTypes: unknown;
|
|
54
48
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
55
49
|
};
|
|
@@ -49,14 +49,7 @@ declare const ReadOnlyPill: {
|
|
|
49
49
|
};
|
|
50
50
|
};
|
|
51
51
|
declare const DSReadOnlyPillWithSchema: {
|
|
52
|
-
(props?:
|
|
53
|
-
containerProps?: {} | undefined;
|
|
54
|
-
modalContent?: string | undefined;
|
|
55
|
-
label?: string | undefined;
|
|
56
|
-
leftAddon: any;
|
|
57
|
-
modalTitle?: string | undefined;
|
|
58
|
-
tooltipText?: string | undefined;
|
|
59
|
-
} | undefined): JSX.Element;
|
|
52
|
+
(props?: unknown): JSX.Element;
|
|
60
53
|
propTypes: unknown;
|
|
61
54
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
62
55
|
};
|
|
@@ -42,13 +42,7 @@ declare namespace RemovablePill {
|
|
|
42
42
|
};
|
|
43
43
|
}
|
|
44
44
|
declare const DSRemovablePillWithSchema: {
|
|
45
|
-
(props?:
|
|
46
|
-
containerProps?: {} | undefined;
|
|
47
|
-
label?: string | undefined;
|
|
48
|
-
onRemove: any;
|
|
49
|
-
size?: string | undefined;
|
|
50
|
-
leftAddon: any;
|
|
51
|
-
} | undefined): JSX.Element;
|
|
45
|
+
(props?: unknown): JSX.Element;
|
|
52
46
|
propTypes: unknown;
|
|
53
47
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
54
48
|
};
|
|
@@ -1,7 +0,0 @@
|
|
|
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,7 +0,0 @@
|
|
|
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,7 +0,0 @@
|
|
|
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
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
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
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport styled from 'styled-components';\nimport { css } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\n\n// =============================================================================\n// Common CSS\n// =============================================================================\n\nconst borderOutside = (color: string, size = 1, zIndex = 2, borderRadius = '12px') => css`\n :after {\n content: ' ';\n position: absolute;\n top: 0px;\n left: 0px;\n right: 0px;\n bottom: 0px;\n border: ${size}px solid ${color};\n border-top-left-radius: ${borderRadius};\n border-top-right-radius: ${borderRadius};\n border-bottom-left-radius: ${borderRadius};\n border-bottom-right-radius: ${borderRadius};\n pointer-events: none;\n z-index: ${zIndex};\n }\n`;\n\nconst commonPillWrapperCss = css<{ size: 'm' | 's' }>`\n height: ${(props) => (props?.size === 'm' ? '24px' : '18px')};\n\n position: relative;\n\n width: fit-content;\n\n background-color: ${(props) => props.theme.colors.brand[200]};\n\n outline: none;\n\n white-space: nowrap;\n\n padding: 0px 12px 0 12px;\n border-radius: 12px;\n\n font-size: 13px;\n line-height: 1;\n color: ${(props) => props.theme.colors.brand[800]};\n ${(props) => borderOutside(props.theme.colors.brand[300])};\n`;\n\n// =============================================================================\n// Pills wrappers\n// =============================================================================\n\nexport const StyledLabelPillWrapper = styled(Grid)`\n ${commonPillWrapperCss}\n\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n padding-left: ${(props) => (props.hasIcon ? '0px !important' : '12px')};\n`;\n\nexport const StyledValuePillWrapper = styled(Grid)`\n ${commonPillWrapperCss}\n\n font-weight: ${(props) => props.theme.fontWeights.regular};\n padding-left: ${(props) => (props.hasIcon ? '0px !important' : '12px')};\n`;\n\nexport const StyledInputPillWrapper = styled(Grid)<{ value: string; inputWidth: number; inputHasFocus: boolean }>`\n ${commonPillWrapperCss}\n\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0;\n\n ${({ value, theme }) => borderOutside(value === '' ? theme.colors.neutral[400] : theme.colors.brand[500])}\n\n :focus-within {\n ${(props) => (props.inputHasFocus ? borderOutside(props.theme.colors.brand[700], 2) : '')}\n }\n\n :active {\n ${(props) => (props.inputHasFocus ? borderOutside(props.theme.colors.brand[500]) : '')}\n }\n\n & .em-ds-input {\n outline: none !important;\n border: none !important;\n box-shadow: none !important;\n border-radius: 0 !important;\n height: 100%;\n background: transparent;\n width: ${(props) => `${props.inputWidth + (props.value === '' ? 24 : 0)}px`};\n padding: 0;\n margin: 0 0 0 8px;\n }\n\n & .em-ds-input__tooltip-ref {\n height: 100%;\n }\n`;\n\nexport const StyledDropdownPillWrapper = styled(Grid)`\n ${commonPillWrapperCss}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n\n padding: 0 0 0 12px;\n`;\n\nexport const StyledReadonlyPillWrapper = styled(Grid)<{ hasIconRight: boolean; hasIconLeft: boolean }>`\n ${commonPillWrapperCss}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n padding-right: ${(props) => (props.hasIconRight ? '0 !important' : '12px')};\n padding-left: ${(props) => (props.hasIconLeft ? '0 !important' : '12px')};\n`;\n\nexport const StyledRemovablePillWrapper = styled(Grid)`\n ${commonPillWrapperCss}\n font-weight: ${(props) => props.theme.fontWeights.regular};\n padding: 0 0 0 12px;\n`;\n\n// =============================================================================\n// Pill group\n// =============================================================================\n\nexport const StyledPillGroup = styled(Grid)`\n width: ${({ width }) => width};\n\n // Pill edges\n & .ds-pill-wrapper {\n &:not(:first-of-type) {\n &,\n :after,\n :before,\n .ds-pill-tooltip-value:after {\n border-top-left-radius: 0px;\n border-bottom-left-radius: 0px;\n }\n }\n &:not(:last-of-type) {\n &,\n :after,\n :before,\n .ds-pill-tooltip-value:after {\n border-top-right-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n }\n }\n\n // Pill paddings to the left / right\n & .ds-pill-wrapper-label,\n & .ds-pill-wrapper-value,\n & .ds-pill-wrapper-readonly {\n &:not(:first-of-type) {\n padding-left: 8px;\n }\n &:not(:last-of-type) {\n padding-right: 8px;\n }\n }\n\n & .ds-pill-wrapper-removable:not(:first-of-type) {\n padding-left: 8px;\n }\n\n & .ds-pill-wrapper-dropdown:not(:first-of-type) {\n padding-left: 8px;\n }\n\n & .ds-pill-wrapper {\n :not(:first-of-type) {\n .ds-pill-button-left {\n border-radius: 0px;\n }\n .ds-pill-button-only {\n border-top-left-radius: 0px;\n border-bottom-left-radius: 0px;\n }\n }\n :not(:last-of-type) {\n .ds-pill-button-right {\n border-radius: 0px;\n }\n .ds-pill-button-only {\n border-top-right-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n }\n }\n`;\n\n// =============================================================================\n// Extra stuff\n// =============================================================================\n\nexport const StyledSpanWithTooltip = styled.span`\n outline: none;\n :focus {\n ${(props) => borderOutside(props.theme.colors.brand[700], 2, 3)}\n }\n`;\n\nexport const StyledPillButton = styled(DSButtonV2)<{ width: string; height: string }>`\n display: grid;\n place-items: center;\n\n position: relative;\n\n padding: 0;\n width: ${(props) => props.width};\n height: ${(props) => props.height};\n\n border-radius: 12px;\n\n :focus {\n ${(props) => borderOutside(props.theme.colors.brand[700], 2, 3, 'inherit')}\n }\n\n cursor: pointer;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/components/types/DropdownPill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useMemo, useRef } from 'react';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAuC;AACvC,6BAAiC;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;AAE1B,QAAM,UAAU,0BAAQ,MAAM,WAAW,yBAAS;AAElD,QAAM,gBAAgB,iBAClB,CAAC,EAAE,eAAe,mDAAC,6DAAD;AAAA,IAA4B,OAAO;AAAA,OACrD,qBAAM;AAEV,SACE,mDAAC,yCAAD;AAAA,IACE;AAAA,IACA,IAAI;AAAA,IACJ,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,MAAM,CAAC,QAAQ;AAAA,IACf,QAAO;AAAA,IACP,YAAW;AAAA,IACX,cAAa;AAAA,KAEb,mDAAC,eAAD,MAAgB,QAChB,mDAAC,yCAAD;AAAA,IACE,0BAA0B;AAAA,MACxB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,OAEE;AAAA,IACJ,gBAAgB,CAAC,MAAM;AACrB,UAAI,EAAE,SAAS;AAAU,mBAAW,QAAQ;AAC5C,UAAI,cAAc;AAAgB,sBAAc,eAAe;AAAA;AAAA,IAEjE,eAAe,EAAE,GAAG,QAAQ,GAAG;AAAA,KAE/B,mDAAC,gCAAD;AAAA,IACE,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,UAAU,kCAAgB,YAAY;AAAA,IACtC,cAAY,aAAa;AAAA,IACzB,MAAK;AAAA,IACL,SAAS;AAAA,KAET,mDAAC,kCAAD;AAAA,IAAkB,OAAO,CAAC,iBAAiB;AAAA,IAAQ,OAAO;AAAA,IAAI,QAAQ;AAAA;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/components/types/InputPill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { uid } from 'uid';\nimport { CloseXsmall } from '@elliemae/ds-icons';\nimport type { DSPillProps } from '../../index.d';\nimport { StyledInputPillWrapper } from '../styled';\nimport { setMultipleRefs } from '../../utils';\nimport { DSPillButton } from '../PillButton';\n\nexport const InputPill = React.memo<DSPillProps>(\n ({ label, size, inputPlaceholder, inputWidth, inputRender, onInputChange, onInputClear, innerRef }) => {\n const ref = useRef<HTMLElement>(null);\n\n const InputComponent = useMemo(() => inputRender, [inputRender]);\n\n const pillUid = useMemo(() => `ds-pill-${uid()}`, []);\n\n const onCloseIconClick: React.MouseEventHandler & React.KeyboardEventHandler = useCallback(\n (e) => {\n if ([undefined, 'Enter', 'Space'].includes(e.code)) {\n e.preventDefault();\n onInputClear(e);\n ref.current.focus();\n }\n },\n [onInputClear],\n );\n\n const [inputHasFocus, setInputHasFocus] = useState(false);\n\n return (\n <StyledInputPillWrapper\n size={size}\n className=\"ds-pill-wrapper\"\n data-testid=\"ds-pill-wrapper\"\n cols={label === '' ? ['auto'] : ['auto', '24px']}\n inputWidth={inputWidth}\n value={label}\n inputHasFocus={inputHasFocus}\n >\n <InputComponent\n id={pillUid}\n className=\"ds-pill-focus-point\"\n data-testid=\"ds-pill-input\"\n innerRef={setMultipleRefs(ref, innerRef)}\n value={label}\n onChange={onInputChange}\n placeholder={inputPlaceholder}\n onFocus={() => setInputHasFocus(true)}\n onBlur={() => setInputHasFocus(false)}\n disableTooltip={false}\n />\n {label !== '' && (\n <DSPillButton\n id={pillUid}\n data-testid=\"ds-pill-clear-icon\"\n innerRef={innerRef}\n onClick={onCloseIconClick}\n onKeyDown={onCloseIconClick}\n aria-label=\"Clear input\"\n type=\"right\"\n >\n <CloseXsmall size=\"s\" color={['brand-primary', '700']} />\n </DSPillButton>\n )}\n </StyledInputPillWrapper>\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA8D;AAC9D,iBAAoB;AACpB,sBAA4B;AAE5B,oBAAuC;AACvC,mBAAgC;AAChC,wBAA6B;AAEtB,MAAM,YAAY,qBAAM,KAC7B,CAAC,EAAE,OAAO,MAAM,kBAAkB,YAAY,aAAa,eAAe,cAAc,eAAe;AACrG,QAAM,MAAM,yBAAoB;AAEhC,QAAM,iBAAiB,0BAAQ,MAAM,aAAa,CAAC;AAEnD,QAAM,UAAU,0BAAQ,MAAM,WAAW,yBAAS;AAElD,QAAM,mBAAyE,8BAC7E,CAAC,MAAM;AACL,QAAI,CAAC,QAAW,SAAS,SAAS,SAAS,EAAE,OAAO;AAClD,QAAE;AACF,mBAAa;AACb,UAAI,QAAQ;AAAA;AAAA,KAGhB,CAAC;AAGH,QAAM,CAAC,eAAe,oBAAoB,2BAAS;AAEnD,SACE,mDAAC,sCAAD;AAAA,IACE;AAAA,IACA,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,MAAM,UAAU,KAAK,CAAC,UAAU,CAAC,QAAQ;AAAA,IACzC;AAAA,IACA,OAAO;AAAA,IACP;AAAA,KAEA,mDAAC,gBAAD;AAAA,IACE,IAAI;AAAA,IACJ,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,UAAU,kCAAgB,KAAK;AAAA,IAC/B,OAAO;AAAA,IACP,UAAU;AAAA,IACV,aAAa;AAAA,IACb,SAAS,MAAM,iBAAiB;AAAA,IAChC,QAAQ,MAAM,iBAAiB;AAAA,IAC/B,gBAAgB;AAAA,MAEjB,UAAU,MACT,mDAAC,gCAAD;AAAA,IACE,IAAI;AAAA,IACJ,eAAY;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,cAAW;AAAA,IACX,MAAK;AAAA,KAEL,mDAAC,6BAAD;AAAA,IAAa,MAAK;AAAA,IAAI,OAAO,CAAC,iBAAiB;AAAA;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/components/types/LabelPill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport type { DSPillProps } from '../../index.d';\nimport { StyledLabelPillWrapper } from '../styled';\n\nexport const LabelPill = React.memo<DSPillProps>(({ label, size, labelTruncated, iconLeft, ariaLabel }) => {\n const TextComponent = labelTruncated\n ? ({ children }) => <SimpleTruncatedTooltipText value={children} />\n : React.Fragment;\n return (\n <StyledLabelPillWrapper\n size={size}\n alignItems=\"center\"\n className=\"ds-pill-wrapper ds-pill-wrapper-label\"\n data-testid=\"ds-pill-wrapper\"\n aria-label={ariaLabel || label}\n cols={[iconLeft && 'min-content', 'auto'].filter((notFalse) => notFalse)}\n gutter=\"xxxs\"\n hasIcon={iconLeft !== null}\n >\n {iconLeft}\n <TextComponent>{label}</TextComponent>\n </StyledLabelPillWrapper>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,uCAA2C;AAE3C,oBAAuC;AAEhC,MAAM,YAAY,qBAAM,KAAkB,CAAC,EAAE,OAAO,MAAM,gBAAgB,UAAU,gBAAgB;AACzG,QAAM,gBAAgB,iBAClB,CAAC,EAAE,eAAe,mDAAC,6DAAD;AAAA,IAA4B,OAAO;AAAA,OACrD,qBAAM;AACV,SACE,mDAAC,sCAAD;AAAA,IACE;AAAA,IACA,YAAW;AAAA,IACX,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,cAAY,aAAa;AAAA,IACzB,MAAM,CAAC,YAAY,eAAe,QAAQ,OAAO,CAAC,aAAa;AAAA,IAC/D,QAAO;AAAA,IACP,SAAS,aAAa;AAAA,KAErB,UACD,mDAAC,eAAD,MAAgB;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/components/types/ReadOnlyPill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport type { DSPillProps } from '../../index.d';\nimport { StyledReadonlyPillWrapper } from '../styled';\n\nexport const ReadOnlyPill = React.memo<DSPillProps>(\n ({ label, size, labelTruncated, iconLeft, iconRight, ariaLabel }) => {\n const hasIconLeft = iconLeft !== null || (iconRight !== null && label === '');\n const hasIconRight = iconRight !== null || (iconLeft !== null && label === '');\n\n const TextComponent = labelTruncated\n ? ({ children }) => <SimpleTruncatedTooltipText value={children} />\n : React.Fragment;\n\n return (\n <StyledReadonlyPillWrapper\n size={size}\n alignItems=\"center\"\n className=\"ds-pill-wrapper ds-pill-wrapper-readonly\"\n data-testid=\"ds-pill-wrapper\"\n aria-label={ariaLabel || label}\n cols={[iconLeft && 'min-content', label && 'auto', iconRight && 'min-content'].filter((notFalse) => notFalse)}\n gutter=\"xxxs\"\n hasIconRight={hasIconRight}\n hasIconLeft={hasIconLeft}\n >\n {iconLeft}\n {label ? <TextComponent>{label}</TextComponent> : null}\n {iconRight}\n </StyledReadonlyPillWrapper>\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAkB;AAClB,uCAA2C;AAE3C,oBAA0C;AAEnC,MAAM,eAAe,qBAAM,KAChC,CAAC,EAAE,OAAO,MAAM,gBAAgB,UAAU,WAAW,gBAAgB;AACnE,QAAM,cAAc,aAAa,QAAS,cAAc,QAAQ,UAAU;AAC1E,QAAM,eAAe,cAAc,QAAS,aAAa,QAAQ,UAAU;AAE3E,QAAM,gBAAgB,iBAClB,CAAC,EAAE,eAAe,mDAAC,6DAAD;AAAA,IAA4B,OAAO;AAAA,OACrD,qBAAM;AAEV,SACE,mDAAC,yCAAD;AAAA,IACE;AAAA,IACA,YAAW;AAAA,IACX,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,cAAY,aAAa;AAAA,IACzB,MAAM,CAAC,YAAY,eAAe,SAAS,QAAQ,aAAa,eAAe,OAAO,CAAC,aAAa;AAAA,IACpG,QAAO;AAAA,IACP;AAAA,IACA;AAAA,KAEC,UACA,QAAQ,mDAAC,eAAD,MAAgB,SAAyB,MACjD;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/components/types/RemovablePill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useCallback, useContext, useMemo } from 'react';\nimport { uid } from 'uid';\nimport { CloseXsmall } from '@elliemae/ds-icons';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport type { DSPillProps } from '../../index.d';\nimport { StyledRemovablePillWrapper } from '../styled';\nimport { DSPillGroupV2Context } from '../PillGroup';\nimport { DSPillButton } from '../PillButton';\n\nexport const RemovablePill = React.memo<DSPillProps>(\n ({ label, size, labelTruncated, onRemove, innerRef, ariaLabel }) => {\n const { onKeyboardRemove } = useContext(DSPillGroupV2Context);\n const pillUid = useMemo(() => `ds-pill-${uid()}`, []);\n\n const TextComponent = labelTruncated\n ? ({ children }) => <SimpleTruncatedTooltipText value={children} />\n : React.Fragment;\n\n const onKeyDown: React.MouseEventHandler & React.KeyboardEventHandler = useCallback(\n (e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n e.preventDefault();\n if (onKeyboardRemove) onKeyboardRemove(pillUid);\n onRemove(e);\n }\n },\n [onKeyboardRemove, onRemove, pillUid],\n );\n\n return (\n <StyledRemovablePillWrapper\n size={size}\n cols={['auto', '24px']}\n gutter=\"2px\"\n alignItems=\"center\"\n justifyItems=\"center\"\n className=\"ds-pill-wrapper ds-pill-wrapper-removable\"\n data-testid=\"ds-pill-wrapper\"\n aria-label={ariaLabel || label}\n >\n <TextComponent>{label}</TextComponent>\n <DSPillButton\n className=\"ds-pill-focus-point\"\n id={pillUid}\n data-testid=\"ds-pill-close-icon\"\n innerRef={innerRef}\n onClick={onRemove}\n onKeyDown={onKeyDown}\n aria-label={`Remove ${label}`}\n type=\"right\"\n >\n <CloseXsmall width={22.65} height={22.65} color={['brand-primary', '700']} />\n </DSPillButton>\n </StyledRemovablePillWrapper>\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAwD;AACxD,iBAAoB;AACpB,sBAA4B;AAC5B,uCAA2C;AAE3C,oBAA2C;AAC3C,uBAAqC;AACrC,wBAA6B;AAEtB,MAAM,gBAAgB,qBAAM,KACjC,CAAC,EAAE,OAAO,MAAM,gBAAgB,UAAU,UAAU,gBAAgB;AAClE,QAAM,EAAE,qBAAqB,6BAAW;AACxC,QAAM,UAAU,0BAAQ,MAAM,WAAW,yBAAS;AAElD,QAAM,gBAAgB,iBAClB,CAAC,EAAE,eAAe,mDAAC,6DAAD;AAAA,IAA4B,OAAO;AAAA,OACrD,qBAAM;AAEV,QAAM,YAAkE,8BACtE,CAAC,MAAM;AACL,QAAI,CAAC,SAAS,SAAS,SAAS,EAAE,OAAO;AACvC,QAAE;AACF,UAAI;AAAkB,yBAAiB;AACvC,eAAS;AAAA;AAAA,KAGb,CAAC,kBAAkB,UAAU;AAG/B,SACE,mDAAC,0CAAD;AAAA,IACE;AAAA,IACA,MAAM,CAAC,QAAQ;AAAA,IACf,QAAO;AAAA,IACP,YAAW;AAAA,IACX,cAAa;AAAA,IACb,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,cAAY,aAAa;AAAA,KAEzB,mDAAC,eAAD,MAAgB,QAChB,mDAAC,gCAAD;AAAA,IACE,WAAU;AAAA,IACV,IAAI;AAAA,IACJ,eAAY;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,cAAY,UAAU;AAAA,IACtB,MAAK;AAAA,KAEL,mDAAC,6BAAD;AAAA,IAAa,OAAO;AAAA,IAAO,QAAQ;AAAA,IAAO,OAAO,CAAC,iBAAiB;AAAA;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/components/types/ValuePill.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { DSTooltipV2 } from '@elliemae/ds-tooltip';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport type { DSPillProps } from '../../index.d';\nimport { StyledSpanWithTooltip, StyledValuePillWrapper } from '../styled';\n\nexport const ValuePill = React.memo<DSPillProps>(\n ({ label, size, labelTruncated, tooltipValue, iconLeft, ariaLabel }) => {\n const TextComponent = labelTruncated\n ? ({ children }) => <SimpleTruncatedTooltipText value={children} />\n : React.Fragment;\n\n return (\n <StyledValuePillWrapper\n size={size}\n alignItems=\"center\"\n className=\"ds-pill-wrapper ds-pill-wrapper-value\"\n data-testid=\"ds-pill-wrapper\"\n aria-label={ariaLabel || label}\n cols={[iconLeft && 'min-content', 'auto'].filter((notFalse) => notFalse)}\n gutter=\"xxxs\"\n hasIcon={iconLeft !== null}\n >\n {iconLeft}\n {tooltipValue !== '' ? (\n <DSTooltipV2\n title={tooltipValue}\n triggerComponent={\n <StyledSpanWithTooltip className=\"ds-pill-tooltip-value\" tabIndex={0}>\n {label}\n </StyledSpanWithTooltip>\n }\n />\n ) : (\n <TextComponent>{label}</TextComponent>\n )}\n </StyledValuePillWrapper>\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,wBAA4B;AAC5B,uCAA2C;AAE3C,oBAA8D;AAEvD,MAAM,YAAY,qBAAM,KAC7B,CAAC,EAAE,OAAO,MAAM,gBAAgB,cAAc,UAAU,gBAAgB;AACtE,QAAM,gBAAgB,iBAClB,CAAC,EAAE,eAAe,mDAAC,6DAAD;AAAA,IAA4B,OAAO;AAAA,OACrD,qBAAM;AAEV,SACE,mDAAC,sCAAD;AAAA,IACE;AAAA,IACA,YAAW;AAAA,IACX,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,cAAY,aAAa;AAAA,IACzB,MAAM,CAAC,YAAY,eAAe,QAAQ,OAAO,CAAC,aAAa;AAAA,IAC/D,QAAO;AAAA,IACP,SAAS,aAAa;AAAA,KAErB,UACA,iBAAiB,KAChB,mDAAC,+BAAD;AAAA,IACE,OAAO;AAAA,IACP,kBACE,mDAAC,qCAAD;AAAA,MAAuB,WAAU;AAAA,MAAwB,UAAU;AAAA,OAChE;AAAA,OAKP,mDAAC,eAAD,MAAgB;AAAA;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/components/types/index.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export * from './DropdownPill';\nexport * from './InputPill';\nexport * from './LabelPill';\nexport * from './ReadOnlyPill';\nexport * from './RemovablePill';\nexport * from './ValuePill';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;ADAvB,0BAAc;AACd,0BAAc;AACd,0BAAc;AACd,0BAAc;AACd,0BAAc;AACd,0BAAc;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|