@elliemae/ds-pills 2.0.0-alpha.9 → 2.0.0-next.4

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.
@@ -39,7 +39,7 @@ const DSPillButton = props$1 => {
39
39
 
40
40
  return /*#__PURE__*/jsxRuntime.jsx(styled.StyledPillButton, _objectSpread(_objectSpread({}, rest), {}, {
41
41
  buttonType: "raw",
42
- className: `${typeToClassName[type]} ${rest.className}`,
42
+ className: "".concat(typeToClassName[type], " ").concat(rest.className),
43
43
  children: children
44
44
  }));
45
45
  };
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
6
7
  var React = require('react');
7
8
  var reactDesc = require('react-desc');
8
9
  var uid = require('uid');
@@ -20,9 +21,9 @@ const DSPillGroupV2Context = /*#__PURE__*/React.createContext({
20
21
  const DSPillGroupV2 = ({
21
22
  children
22
23
  }) => {
23
- const pillGroupUid = React.useMemo(() => `ds-pill-group-${uid.uid()}`, []);
24
+ const pillGroupUid = React.useMemo(() => "ds-pill-group-".concat(uid.uid()), []);
24
25
  const onKeyboardRemove = React.useCallback(pillUid => {
25
- const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)];
26
+ const elems = [...document.querySelectorAll("#".concat(pillGroupUid, " .ds-pill-focus-point"))];
26
27
  const pillIndex = elems.findIndex(elem => elem.id === pillUid);
27
28
 
28
29
  if (pillIndex > 0) {
@@ -32,7 +32,7 @@ const StyledInputPillWrapper = /*#__PURE__*/styled__default["default"](Grid__def
32
32
  })(["", " background:", ";padding:0;", ":focus-within{", "}:active{", "}& .em-ds-input{outline:none !important;border:none !important;box-shadow:none !important;border-radius:0 !important;height:100%;background:transparent;width:", ";padding:0;margin:0 0 0 8px;}& .em-ds-input__tooltip-ref{height:100%;}"], commonPillWrapperCss, props => props.theme.colors.neutral['000'], ({
33
33
  value,
34
34
  theme
35
- }) => borderOutside(value === '' ? theme.colors.neutral[400] : theme.colors.brand[500]), props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[700], 2) : '', props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[500]) : '', props => `${props.inputWidth + (props.value === '' ? 24 : 0)}px`);
35
+ }) => borderOutside(value === '' ? theme.colors.neutral[400] : theme.colors.brand[500]), props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[700], 2) : '', props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[500]) : '', props => "".concat(props.inputWidth + (props.value === '' ? 24 : 0), "px"));
36
36
  const StyledDropdownPillWrapper = /*#__PURE__*/styled__default["default"](Grid__default["default"]).withConfig({
37
37
  componentId: "sc-j0tlch-3"
38
38
  })(["", " font-weight:", ";padding:0 0 0 12px;"], commonPillWrapperCss, props => props.theme.fontWeights.semibold);
@@ -32,7 +32,7 @@ const DropdownPill = /*#__PURE__*/React__default["default"].memo(({
32
32
  ariaLabel
33
33
  }) => {
34
34
  const chevronRef = React.useRef(null);
35
- const pillUid = React.useMemo(() => `ds-pill-${uid.uid()}`, []);
35
+ const pillUid = React.useMemo(() => "ds-pill-".concat(uid.uid()), []);
36
36
  return /*#__PURE__*/_jsx__default["default"](styled.StyledDropdownPillWrapper, {
37
37
  id: pillUid,
38
38
  className: "ds-pill-wrapper ds-pill-wrapper-dropdown",
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
6
7
  var React = require('react');
7
8
  var uid = require('uid');
8
9
  var CloseIcon = require('@elliemae/ds-icons/CloseXsmall');
@@ -27,7 +28,7 @@ const InputPill = /*#__PURE__*/React__default["default"].memo(({
27
28
  }) => {
28
29
  const ref = React.useRef(null);
29
30
  const InputComponent = React.useMemo(() => inputRender, [inputRender]);
30
- const pillUid = React.useMemo(() => `ds-pill-${uid.uid()}`, []);
31
+ const pillUid = React.useMemo(() => "ds-pill-".concat(uid.uid()), []);
31
32
  const onCloseIconClick = React.useCallback(e => {
32
33
  if ([undefined, 'Enter', 'Space'].includes(e.code)) {
33
34
  e.preventDefault();
@@ -26,7 +26,7 @@ const RemovablePill = /*#__PURE__*/React__default["default"].memo(({
26
26
  const {
27
27
  onKeyboardRemove
28
28
  } = React.useContext(PillGroup.DSPillGroupV2Context);
29
- const pillUid = React.useMemo(() => `ds-pill-${uid.uid()}`, []);
29
+ const pillUid = React.useMemo(() => "ds-pill-".concat(uid.uid()), []);
30
30
  const onKeyDown = React.useCallback(e => {
31
31
  if (['Enter', 'Space'].includes(e.code)) {
32
32
  e.preventDefault();
@@ -51,7 +51,7 @@ const RemovablePill = /*#__PURE__*/React__default["default"].memo(({
51
51
  innerRef: innerRef,
52
52
  onClick: onRemove,
53
53
  onKeyDown: onKeyDown,
54
- "aria-label": `Remove ${label}`,
54
+ "aria-label": "Remove ".concat(label),
55
55
  type: "right"
56
56
  }, void 0, /*#__PURE__*/_jsx__default["default"](CloseIcon__default["default"], {
57
57
  size: "s",
@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var _jsx = require('@babel/runtime/helpers/jsx');
6
6
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
7
7
  var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
8
+ require('core-js/modules/web.dom-collections.iterator.js');
8
9
  var React = require('react');
9
10
  var reactDesc = require('react-desc');
10
11
  var DSDropdownMenu = require('@elliemae/ds-dropdownmenu');
@@ -3,6 +3,7 @@
3
3
  var _jsx = require('@babel/runtime/helpers/jsx');
4
4
  var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
5
5
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
6
7
  var React = require('react');
7
8
  var utils = require('@elliemae/ds-utilities/utils');
8
9
  var PillGroup = require('../PillGroup.js');
@@ -3,6 +3,7 @@
3
3
  var _jsx = require('@babel/runtime/helpers/jsx');
4
4
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
5
5
  var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
6
7
  var React = require('react');
7
8
  var lodash = require('lodash');
8
9
  var utils = require('@elliemae/ds-utilities/utils');
@@ -136,7 +137,7 @@ function LabeledDropdownMultiPills(_ref) {
136
137
 
137
138
  return null;
138
139
  }), selectedOptions && selectedOptions.length > overflowQuantity && /*#__PURE__*/_jsx__default["default"](OverflowPill.OverflowPill, {
139
- label: `+ ${selectedOptions.length - overflowQuantity}`,
140
+ label: "+ ".concat(selectedOptions.length - overflowQuantity),
140
141
  options: overflowOptions
141
142
  })]
142
143
  });
@@ -3,6 +3,7 @@
3
3
  var _jsx = require('@babel/runtime/helpers/jsx');
4
4
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
5
5
  var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
6
7
  var React = require('react');
7
8
  var usePrevious = require('@elliemae/ds-utilities/hooks/usePrevious');
8
9
  var useShouldRecalculate = require('@elliemae/ds-utilities/hooks/useShouldRecalculate');
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
6
7
  var React = require('react');
7
8
  var reactDesc = require('react-desc');
8
9
  var useFocusGroupItem = require('@elliemae/ds-shared/FocusGroup/useFocusGroupItem');
@@ -27,9 +28,9 @@ function OverflowPill({
27
28
  let text = '';
28
29
  options.forEach(option => {
29
30
  if (!tooltipText || option === options[0]) {
30
- text = `${option.label}`;
31
+ text = "".concat(option.label);
31
32
  } else {
32
- text = text.concat(`, ${option.label}`);
33
+ text = text.concat(", ".concat(option.label));
33
34
  }
34
35
  });
35
36
  setTooltipText(text);
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('core-js/modules/web.dom-collections.iterator.js');
6
7
  var React = require('react');
7
8
  var reactDesc = require('react-desc');
8
9
  var InfoCircleSmall = require('@elliemae/ds-icons/InfoCircleSmall');
@@ -30,7 +30,7 @@ const DSPillButton = props => {
30
30
 
31
31
  return /*#__PURE__*/jsx(StyledPillButton, _objectSpread(_objectSpread({}, rest), {}, {
32
32
  buttonType: "raw",
33
- className: `${typeToClassName[type]} ${rest.className}`,
33
+ className: "".concat(typeToClassName[type], " ").concat(rest.className),
34
34
  children: children
35
35
  }));
36
36
  };
@@ -1,4 +1,5 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
+ import 'core-js/modules/web.dom-collections.iterator.js';
2
3
  import React, { createContext, useMemo, useCallback } from 'react';
3
4
  import { describe } from 'react-desc';
4
5
  import { uid } from 'uid';
@@ -11,9 +12,9 @@ const DSPillGroupV2Context = /*#__PURE__*/createContext({
11
12
  const DSPillGroupV2 = ({
12
13
  children
13
14
  }) => {
14
- const pillGroupUid = useMemo(() => `ds-pill-group-${uid()}`, []);
15
+ const pillGroupUid = useMemo(() => "ds-pill-group-".concat(uid()), []);
15
16
  const onKeyboardRemove = useCallback(pillUid => {
16
- const elems = [...document.querySelectorAll(`#${pillGroupUid} .ds-pill-focus-point`)];
17
+ const elems = [...document.querySelectorAll("#".concat(pillGroupUid, " .ds-pill-focus-point"))];
17
18
  const pillIndex = elems.findIndex(elem => elem.id === pillUid);
18
19
 
19
20
  if (pillIndex > 0) {
@@ -23,7 +23,7 @@ const StyledInputPillWrapper = /*#__PURE__*/styled(Grid).withConfig({
23
23
  })(["", " background:", ";padding:0;", ":focus-within{", "}:active{", "}& .em-ds-input{outline:none !important;border:none !important;box-shadow:none !important;border-radius:0 !important;height:100%;background:transparent;width:", ";padding:0;margin:0 0 0 8px;}& .em-ds-input__tooltip-ref{height:100%;}"], commonPillWrapperCss, props => props.theme.colors.neutral['000'], ({
24
24
  value,
25
25
  theme
26
- }) => borderOutside(value === '' ? theme.colors.neutral[400] : theme.colors.brand[500]), props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[700], 2) : '', props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[500]) : '', props => `${props.inputWidth + (props.value === '' ? 24 : 0)}px`);
26
+ }) => borderOutside(value === '' ? theme.colors.neutral[400] : theme.colors.brand[500]), props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[700], 2) : '', props => props.inputHasFocus ? borderOutside(props.theme.colors.brand[500]) : '', props => "".concat(props.inputWidth + (props.value === '' ? 24 : 0), "px"));
27
27
  const StyledDropdownPillWrapper = /*#__PURE__*/styled(Grid).withConfig({
28
28
  componentId: "sc-j0tlch-3"
29
29
  })(["", " font-weight:", ";padding:0 0 0 12px;"], commonPillWrapperCss, props => props.theme.fontWeights.semibold);
@@ -20,7 +20,7 @@ const DropdownPill = /*#__PURE__*/React.memo(({
20
20
  ariaLabel
21
21
  }) => {
22
22
  const chevronRef = useRef(null);
23
- const pillUid = useMemo(() => `ds-pill-${uid()}`, []);
23
+ const pillUid = useMemo(() => "ds-pill-".concat(uid()), []);
24
24
  return /*#__PURE__*/_jsx(StyledDropdownPillWrapper, {
25
25
  id: pillUid,
26
26
  className: "ds-pill-wrapper ds-pill-wrapper-dropdown",
@@ -1,4 +1,5 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
+ import 'core-js/modules/web.dom-collections.iterator.js';
2
3
  import React, { useRef, useMemo, useCallback, useState } from 'react';
3
4
  import { uid } from 'uid';
4
5
  import CloseIcon from '@elliemae/ds-icons/CloseXsmall';
@@ -17,7 +18,7 @@ const InputPill = /*#__PURE__*/React.memo(({
17
18
  }) => {
18
19
  const ref = useRef(null);
19
20
  const InputComponent = useMemo(() => inputRender, [inputRender]);
20
- const pillUid = useMemo(() => `ds-pill-${uid()}`, []);
21
+ const pillUid = useMemo(() => "ds-pill-".concat(uid()), []);
21
22
  const onCloseIconClick = useCallback(e => {
22
23
  if ([undefined, 'Enter', 'Space'].includes(e.code)) {
23
24
  e.preventDefault();
@@ -16,7 +16,7 @@ const RemovablePill = /*#__PURE__*/React.memo(({
16
16
  const {
17
17
  onKeyboardRemove
18
18
  } = useContext(DSPillGroupV2Context);
19
- const pillUid = useMemo(() => `ds-pill-${uid()}`, []);
19
+ const pillUid = useMemo(() => "ds-pill-".concat(uid()), []);
20
20
  const onKeyDown = useCallback(e => {
21
21
  if (['Enter', 'Space'].includes(e.code)) {
22
22
  e.preventDefault();
@@ -41,7 +41,7 @@ const RemovablePill = /*#__PURE__*/React.memo(({
41
41
  innerRef: innerRef,
42
42
  onClick: onRemove,
43
43
  onKeyDown: onKeyDown,
44
- "aria-label": `Remove ${label}`,
44
+ "aria-label": "Remove ".concat(label),
45
45
  type: "right"
46
46
  }, void 0, /*#__PURE__*/_jsx(CloseIcon, {
47
47
  size: "s",
@@ -1,6 +1,7 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
2
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
3
3
  import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
4
+ import 'core-js/modules/web.dom-collections.iterator.js';
4
5
  import { useRef, useState } from 'react';
5
6
  import { PropTypes, describe } from 'react-desc';
6
7
  import DSDropdownMenu from '@elliemae/ds-dropdownmenu';
@@ -1,6 +1,7 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
2
  import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
3
3
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
4
+ import 'core-js/modules/web.dom-collections.iterator.js';
4
5
  import { createElement } from 'react';
5
6
  import { isFunction, addOrRemove } from '@elliemae/ds-utilities/utils';
6
7
  import { PillGroup } from '../PillGroup.js';
@@ -1,6 +1,7 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
2
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
3
3
  import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
4
+ import 'core-js/modules/web.dom-collections.iterator.js';
4
5
  import { useState, useEffect, useCallback } from 'react';
5
6
  import { find } from 'lodash';
6
7
  import { isFunction, addOrRemove } from '@elliemae/ds-utilities/utils';
@@ -128,7 +129,7 @@ function LabeledDropdownMultiPills(_ref) {
128
129
 
129
130
  return null;
130
131
  }), selectedOptions && selectedOptions.length > overflowQuantity && /*#__PURE__*/_jsx(OverflowPill, {
131
- label: `+ ${selectedOptions.length - overflowQuantity}`,
132
+ label: "+ ".concat(selectedOptions.length - overflowQuantity),
132
133
  options: overflowOptions
133
134
  })]
134
135
  });
@@ -1,6 +1,7 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
2
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
3
3
  import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
4
+ import 'core-js/modules/web.dom-collections.iterator.js';
4
5
  import { useState, useEffect, useLayoutEffect, useCallback } from 'react';
5
6
  import usePrevious from '@elliemae/ds-utilities/hooks/usePrevious';
6
7
  import useShouldRecalculate from '@elliemae/ds-utilities/hooks/useShouldRecalculate';
@@ -1,4 +1,5 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
+ import 'core-js/modules/web.dom-collections.iterator.js';
2
3
  import { useRef, useState, useEffect } from 'react';
3
4
  import { PropTypes, describe } from 'react-desc';
4
5
  import useFocusGroupItem from '@elliemae/ds-shared/FocusGroup/useFocusGroupItem';
@@ -17,9 +18,9 @@ function OverflowPill({
17
18
  let text = '';
18
19
  options.forEach(option => {
19
20
  if (!tooltipText || option === options[0]) {
20
- text = `${option.label}`;
21
+ text = "".concat(option.label);
21
22
  } else {
22
- text = text.concat(`, ${option.label}`);
23
+ text = text.concat(", ".concat(option.label));
23
24
  }
24
25
  });
25
26
  setTooltipText(text);
@@ -1,4 +1,5 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
+ import 'core-js/modules/web.dom-collections.iterator.js';
2
3
  import { useRef, useState } from 'react';
3
4
  import { PropTypes, describe } from 'react-desc';
4
5
  import InfoCircleSmall from '@elliemae/ds-icons/InfoCircleSmall';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-pills",
3
- "version": "2.0.0-alpha.9",
3
+ "version": "2.0.0-next.4",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Pills",
6
6
  "module": "./esm/index.js",
@@ -144,14 +144,14 @@
144
144
  "build": "node ../../scripts/build/build.js"
145
145
  },
146
146
  "dependencies": {
147
- "@elliemae/ds-classnames": "2.0.0-alpha.9",
148
- "@elliemae/ds-dropdownmenu": "2.0.0-alpha.9",
149
- "@elliemae/ds-form": "2.0.0-alpha.9",
150
- "@elliemae/ds-icons": "2.0.0-alpha.9",
151
- "@elliemae/ds-modal": "2.0.0-alpha.9",
152
- "@elliemae/ds-shared": "2.0.0-alpha.9",
153
- "@elliemae/ds-tooltip": "2.0.0-alpha.9",
154
- "@elliemae/ds-utilities": "2.0.0-alpha.9",
147
+ "@elliemae/ds-classnames": "2.0.0-next.4",
148
+ "@elliemae/ds-dropdownmenu": "2.0.0-next.4",
149
+ "@elliemae/ds-form": "2.0.0-next.4",
150
+ "@elliemae/ds-icons": "2.0.0-next.4",
151
+ "@elliemae/ds-modal": "2.0.0-next.4",
152
+ "@elliemae/ds-shared": "2.0.0-next.4",
153
+ "@elliemae/ds-tooltip": "2.0.0-next.4",
154
+ "@elliemae/ds-utilities": "2.0.0-next.4",
155
155
  "prop-types": "~15.7.2",
156
156
  "react-desc": "~4.1.3"
157
157
  },
package/cjs/package.json DELETED
@@ -1,7 +0,0 @@
1
- {
2
- "type": "commonjs",
3
- "sideEffects": [
4
- "*.css",
5
- "*.scss"
6
- ]
7
- }
package/esm/package.json DELETED
@@ -1,7 +0,0 @@
1
- {
2
- "type": "module",
3
- "sideEffects": [
4
- "*.css",
5
- "*.scss"
6
- ]
7
- }