@elliemae/ds-accordion 2.4.2-rc.12 → 2.4.2-rc.15

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.
@@ -2,7 +2,6 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- require('core-js/modules/web.dom-collections.iterator.js');
6
5
  require('core-js/modules/esnext.async-iterator.some.js');
7
6
  require('core-js/modules/esnext.iterator.constructor.js');
8
7
  require('core-js/modules/esnext.iterator.some.js');
@@ -2,17 +2,14 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var _jsx2 = require('@babel/runtime/helpers/jsx');
6
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
7
- var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
8
- require('core-js/modules/web.dom-collections.iterator.js');
9
- require('core-js/modules/esnext.async-iterator.map.js');
10
- require('core-js/modules/esnext.iterator.map.js');
11
5
  require('core-js/modules/esnext.async-iterator.filter.js');
12
6
  require('core-js/modules/esnext.iterator.constructor.js');
13
7
  require('core-js/modules/esnext.iterator.filter.js');
14
8
  require('core-js/modules/esnext.async-iterator.for-each.js');
15
9
  require('core-js/modules/esnext.iterator.for-each.js');
10
+ var _jsx2 = require('@babel/runtime/helpers/jsx');
11
+ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
12
+ var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
16
13
  var React = require('react');
17
14
  var dsPropsHelpers = require('@elliemae/ds-props-helpers');
18
15
  var DSButton = require('@elliemae/ds-button');
@@ -74,7 +71,7 @@ const DSAccordionItem = props => {
74
71
  const [showPopover, setShowPopover] = React.useState(false);
75
72
  const [referenceElement, setReferenceElement] = React.useState();
76
73
  const CustomActionsContent = React.useMemo(() => {
77
- if (!isDSMobile && (customActions === null || customActions === void 0 ? void 0 : customActions.length) > 0) return /*#__PURE__*/_jsx2__default["default"](styles.StyledItemCustomActions, {}, void 0, customActions === null || customActions === void 0 ? void 0 : customActions.map(_ref => {
74
+ if (!isDSMobile && customActions?.length > 0) return /*#__PURE__*/_jsx2__default["default"](styles.StyledItemCustomActions, {}, void 0, customActions?.map(_ref => {
78
75
  let {
79
76
  onClick,
80
77
  id
@@ -110,7 +107,7 @@ const DSAccordionItem = props => {
110
107
  if (isPrimaryShowingEllipsis || isSecondaryShowingEllipsis) return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
111
108
  children: [/*#__PURE__*/jsxRuntime.jsx(styles.StyledPrimaryTitle, {
112
109
  ref: setPrimaryElement,
113
- id: "accordion_".concat(title, "id"),
110
+ id: `accordion_${title}id`,
114
111
  disabled: disabled,
115
112
  isDSMobile: isDSMobile,
116
113
  children: title
@@ -142,7 +139,7 @@ const DSAccordionItem = props => {
142
139
  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
143
140
  children: [/*#__PURE__*/jsxRuntime.jsx(styles.StyledPrimaryTitle, {
144
141
  ref: setPrimaryElement,
145
- id: "accordion_".concat(title, "id"),
142
+ id: `accordion_${title}id`,
146
143
  disabled: disabled,
147
144
  isDSMobile: isDSMobile,
148
145
  children: title
@@ -158,7 +155,7 @@ const DSAccordionItem = props => {
158
155
  }, void 0, /*#__PURE__*/_jsx2__default["default"](styles.StyledItemHeaderContainer, {
159
156
  disabled: disabled
160
157
  }, void 0, /*#__PURE__*/jsxRuntime.jsxs(styles.StyledItemHeader, {
161
- withCustomActions: ((customActions === null || customActions === void 0 ? void 0 : customActions.length) > 0 || renderCustomActions !== undefined) && !isDSMobile,
158
+ withCustomActions: (customActions?.length > 0 || renderCustomActions !== undefined) && !isDSMobile,
162
159
  withSecondaryTitle: secondaryTitle,
163
160
  onClick: handleOnClick,
164
161
  tabIndex: !disabled ? 0 : undefined,
@@ -168,10 +165,10 @@ const DSAccordionItem = props => {
168
165
  onKeyDown: onKeyDownWithIndex,
169
166
  isDSMobile: isDSMobile,
170
167
  "data-testid": DSAccordionDatatestid.DSAccordionDataTestid.ITEM.HEADER,
171
- id: "ds-accordion-header-".concat(value),
168
+ id: `ds-accordion-header-${value}`,
172
169
  "aria-expanded": selected,
173
170
  "aria-disabled": disabled,
174
- "aria-controls": "ds-accordion-content-".concat(value),
171
+ "aria-controls": `ds-accordion-content-${value}`,
175
172
  onFocus: handleOnFocus,
176
173
  onBlur: handleOnBlur,
177
174
  children: [/*#__PURE__*/_jsx2__default["default"](styles.StyledItemAddon, {
@@ -190,10 +187,10 @@ const DSAccordionItem = props => {
190
187
  })]
191
188
  }), CustomActionsContent), selected && /*#__PURE__*/_jsx2__default["default"](styles.StyledItemContent, {
192
189
  "data-testid": DSAccordionDatatestid.DSAccordionDataTestid.ITEM.CONTENT,
193
- "aria-labelledby": "ds-accordion-header-".concat(value),
190
+ "aria-labelledby": `ds-accordion-header-${value}`,
194
191
  role: "region",
195
192
  isDSMobile: isDSMobile,
196
- id: "ds-accordion-content-".concat(value)
193
+ id: `ds-accordion-content-${value}`
197
194
  }, void 0, children));
198
195
  };
199
196
 
@@ -33,12 +33,12 @@ const StyledItemHeader = /*#__PURE__*/styled__default["default"].button.withConf
33
33
  let {
34
34
  isDSMobile
35
35
  } = _ref4;
36
- return isDSMobile ? "0 16px" : "0";
36
+ return isDSMobile ? `0 16px` : `0`;
37
37
  }, _ref5 => {
38
38
  let {
39
39
  isDSMobile
40
40
  } = _ref5;
41
- return isDSMobile ? "flex-direction: row-reverse;" : "";
41
+ return isDSMobile ? `flex-direction: row-reverse;` : ``;
42
42
  }, _ref6 => {
43
43
  let {
44
44
  theme
@@ -51,7 +51,7 @@ const StyledItemContent = /*#__PURE__*/styled__default["default"].div.withConfig
51
51
  let {
52
52
  isDSMobile
53
53
  } = _ref7;
54
- return isDSMobile ? "16px 16px 24px 16px" : "16px 16px 16px 32px";
54
+ return isDSMobile ? `16px 16px 24px 16px` : `16px 16px 16px 32px`;
55
55
  });
56
56
  const StyledItemAddon = /*#__PURE__*/styled__default["default"].div.withConfig({
57
57
  componentId: "sc-fnpjby-3"
@@ -60,7 +60,7 @@ const StyledItemAddon = /*#__PURE__*/styled__default["default"].div.withConfig({
60
60
  theme,
61
61
  isDSMobile
62
62
  } = _ref8;
63
- return !isDSMobile ? "padding: 0 ".concat(theme.space.xxs, ";") : "";
63
+ return !isDSMobile ? `padding: 0 ${theme.space.xxs};` : ``;
64
64
  }, _ref9 => {
65
65
  let {
66
66
  theme
@@ -135,7 +135,7 @@ const StyledItemHeaderContainer = /*#__PURE__*/styled__default["default"].div.wi
135
135
  disabled,
136
136
  theme
137
137
  } = _ref19;
138
- return !disabled ? "background: ".concat(theme.colors.brand[200], ";") : "";
138
+ return !disabled ? `background: ${theme.colors.brand[200]};` : ``;
139
139
  });
140
140
 
141
141
  exports.StyledItemAddon = StyledItemAddon;
@@ -30,17 +30,13 @@ const useAccordionItem = _ref => {
30
30
  }, [disabled, setActiveValues, value]);
31
31
  const handleOnKeyDown = React.useCallback((e, _dsIndex) => {
32
32
  if (!disabled && e.key === 'ArrowDown') {
33
- var _focusableChildrenRef, _focusableChildrenRef2, _focusableChildrenRef3, _focusableChildrenRef4, _focusableChildrenRef5;
34
-
35
33
  const currentIndex = focusableChildrenReferences.findIndex(item => item.index === _dsIndex);
36
- if ((_focusableChildrenRef = focusableChildrenReferences[currentIndex + 1]) !== null && _focusableChildrenRef !== void 0 && (_focusableChildrenRef2 = _focusableChildrenRef.ref) !== null && _focusableChildrenRef2 !== void 0 && _focusableChildrenRef2.current) (_focusableChildrenRef3 = focusableChildrenReferences[currentIndex + 1]) === null || _focusableChildrenRef3 === void 0 ? void 0 : (_focusableChildrenRef4 = _focusableChildrenRef3.ref) === null || _focusableChildrenRef4 === void 0 ? void 0 : (_focusableChildrenRef5 = _focusableChildrenRef4.current) === null || _focusableChildrenRef5 === void 0 ? void 0 : _focusableChildrenRef5.focus();
34
+ if (focusableChildrenReferences[currentIndex + 1]?.ref?.current) focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();
37
35
  }
38
36
 
39
37
  if (!disabled && e.key === 'ArrowUp') {
40
- var _focusableChildrenRef6, _focusableChildrenRef7, _focusableChildrenRef8, _focusableChildrenRef9, _focusableChildrenRef10;
41
-
42
38
  const currentIndex = focusableChildrenReferences.findIndex(item => item.index === _dsIndex);
43
- if ((_focusableChildrenRef6 = focusableChildrenReferences[currentIndex - 1]) !== null && _focusableChildrenRef6 !== void 0 && (_focusableChildrenRef7 = _focusableChildrenRef6.ref) !== null && _focusableChildrenRef7 !== void 0 && _focusableChildrenRef7.current) (_focusableChildrenRef8 = focusableChildrenReferences[currentIndex - 1]) === null || _focusableChildrenRef8 === void 0 ? void 0 : (_focusableChildrenRef9 = _focusableChildrenRef8.ref) === null || _focusableChildrenRef9 === void 0 ? void 0 : (_focusableChildrenRef10 = _focusableChildrenRef9.current) === null || _focusableChildrenRef10 === void 0 ? void 0 : _focusableChildrenRef10.focus();
39
+ if (focusableChildrenReferences[currentIndex - 1]?.ref?.current) focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();
44
40
  }
45
41
  }, [disabled, focusableChildrenReferences]);
46
42
  return {
@@ -1,4 +1,3 @@
1
- import 'core-js/modules/web.dom-collections.iterator.js';
2
1
  import 'core-js/modules/esnext.async-iterator.some.js';
3
2
  import 'core-js/modules/esnext.iterator.constructor.js';
4
3
  import 'core-js/modules/esnext.iterator.some.js';
@@ -1,14 +1,11 @@
1
- import _jsx2 from '@babel/runtime/helpers/esm/jsx';
2
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
3
- import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
4
- import 'core-js/modules/web.dom-collections.iterator.js';
5
- import 'core-js/modules/esnext.async-iterator.map.js';
6
- import 'core-js/modules/esnext.iterator.map.js';
7
1
  import 'core-js/modules/esnext.async-iterator.filter.js';
8
2
  import 'core-js/modules/esnext.iterator.constructor.js';
9
3
  import 'core-js/modules/esnext.iterator.filter.js';
10
4
  import 'core-js/modules/esnext.async-iterator.for-each.js';
11
5
  import 'core-js/modules/esnext.iterator.for-each.js';
6
+ import _jsx2 from '@babel/runtime/helpers/esm/jsx';
7
+ import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
8
+ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
12
9
  import { useContext, useCallback, useState, useMemo } from 'react';
13
10
  import { describe, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';
14
11
  import DSButton, { BUTTON_TYPE } from '@elliemae/ds-button';
@@ -63,7 +60,7 @@ const DSAccordionItem = props => {
63
60
  const [showPopover, setShowPopover] = useState(false);
64
61
  const [referenceElement, setReferenceElement] = useState();
65
62
  const CustomActionsContent = useMemo(() => {
66
- if (!isDSMobile && (customActions === null || customActions === void 0 ? void 0 : customActions.length) > 0) return /*#__PURE__*/_jsx2(StyledItemCustomActions, {}, void 0, customActions === null || customActions === void 0 ? void 0 : customActions.map(_ref => {
63
+ if (!isDSMobile && customActions?.length > 0) return /*#__PURE__*/_jsx2(StyledItemCustomActions, {}, void 0, customActions?.map(_ref => {
67
64
  let {
68
65
  onClick,
69
66
  id
@@ -99,7 +96,7 @@ const DSAccordionItem = props => {
99
96
  if (isPrimaryShowingEllipsis || isSecondaryShowingEllipsis) return /*#__PURE__*/jsxs(Fragment, {
100
97
  children: [/*#__PURE__*/jsx(StyledPrimaryTitle, {
101
98
  ref: setPrimaryElement,
102
- id: "accordion_".concat(title, "id"),
99
+ id: `accordion_${title}id`,
103
100
  disabled: disabled,
104
101
  isDSMobile: isDSMobile,
105
102
  children: title
@@ -131,7 +128,7 @@ const DSAccordionItem = props => {
131
128
  return /*#__PURE__*/jsxs(Fragment, {
132
129
  children: [/*#__PURE__*/jsx(StyledPrimaryTitle, {
133
130
  ref: setPrimaryElement,
134
- id: "accordion_".concat(title, "id"),
131
+ id: `accordion_${title}id`,
135
132
  disabled: disabled,
136
133
  isDSMobile: isDSMobile,
137
134
  children: title
@@ -147,7 +144,7 @@ const DSAccordionItem = props => {
147
144
  }, void 0, /*#__PURE__*/_jsx2(StyledItemHeaderContainer, {
148
145
  disabled: disabled
149
146
  }, void 0, /*#__PURE__*/jsxs(StyledItemHeader, {
150
- withCustomActions: ((customActions === null || customActions === void 0 ? void 0 : customActions.length) > 0 || renderCustomActions !== undefined) && !isDSMobile,
147
+ withCustomActions: (customActions?.length > 0 || renderCustomActions !== undefined) && !isDSMobile,
151
148
  withSecondaryTitle: secondaryTitle,
152
149
  onClick: handleOnClick,
153
150
  tabIndex: !disabled ? 0 : undefined,
@@ -157,10 +154,10 @@ const DSAccordionItem = props => {
157
154
  onKeyDown: onKeyDownWithIndex,
158
155
  isDSMobile: isDSMobile,
159
156
  "data-testid": DSAccordionDataTestid.ITEM.HEADER,
160
- id: "ds-accordion-header-".concat(value),
157
+ id: `ds-accordion-header-${value}`,
161
158
  "aria-expanded": selected,
162
159
  "aria-disabled": disabled,
163
- "aria-controls": "ds-accordion-content-".concat(value),
160
+ "aria-controls": `ds-accordion-content-${value}`,
164
161
  onFocus: handleOnFocus,
165
162
  onBlur: handleOnBlur,
166
163
  children: [/*#__PURE__*/_jsx2(StyledItemAddon, {
@@ -179,10 +176,10 @@ const DSAccordionItem = props => {
179
176
  })]
180
177
  }), CustomActionsContent), selected && /*#__PURE__*/_jsx2(StyledItemContent, {
181
178
  "data-testid": DSAccordionDataTestid.ITEM.CONTENT,
182
- "aria-labelledby": "ds-accordion-header-".concat(value),
179
+ "aria-labelledby": `ds-accordion-header-${value}`,
183
180
  role: "region",
184
181
  isDSMobile: isDSMobile,
185
- id: "ds-accordion-content-".concat(value)
182
+ id: `ds-accordion-content-${value}`
186
183
  }, void 0, children));
187
184
  };
188
185
 
@@ -25,12 +25,12 @@ const StyledItemHeader = /*#__PURE__*/styled.button.withConfig({
25
25
  let {
26
26
  isDSMobile
27
27
  } = _ref4;
28
- return isDSMobile ? "0 16px" : "0";
28
+ return isDSMobile ? `0 16px` : `0`;
29
29
  }, _ref5 => {
30
30
  let {
31
31
  isDSMobile
32
32
  } = _ref5;
33
- return isDSMobile ? "flex-direction: row-reverse;" : "";
33
+ return isDSMobile ? `flex-direction: row-reverse;` : ``;
34
34
  }, _ref6 => {
35
35
  let {
36
36
  theme
@@ -43,7 +43,7 @@ const StyledItemContent = /*#__PURE__*/styled.div.withConfig({
43
43
  let {
44
44
  isDSMobile
45
45
  } = _ref7;
46
- return isDSMobile ? "16px 16px 24px 16px" : "16px 16px 16px 32px";
46
+ return isDSMobile ? `16px 16px 24px 16px` : `16px 16px 16px 32px`;
47
47
  });
48
48
  const StyledItemAddon = /*#__PURE__*/styled.div.withConfig({
49
49
  componentId: "sc-fnpjby-3"
@@ -52,7 +52,7 @@ const StyledItemAddon = /*#__PURE__*/styled.div.withConfig({
52
52
  theme,
53
53
  isDSMobile
54
54
  } = _ref8;
55
- return !isDSMobile ? "padding: 0 ".concat(theme.space.xxs, ";") : "";
55
+ return !isDSMobile ? `padding: 0 ${theme.space.xxs};` : ``;
56
56
  }, _ref9 => {
57
57
  let {
58
58
  theme
@@ -127,7 +127,7 @@ const StyledItemHeaderContainer = /*#__PURE__*/styled.div.withConfig({
127
127
  disabled,
128
128
  theme
129
129
  } = _ref19;
130
- return !disabled ? "background: ".concat(theme.colors.brand[200], ";") : "";
130
+ return !disabled ? `background: ${theme.colors.brand[200]};` : ``;
131
131
  });
132
132
 
133
133
  export { StyledItemAddon, StyledItemContainer, StyledItemContent, StyledItemCustomActions, StyledItemHeader, StyledItemHeaderContainer, StyledItemTitles, StyledPrimaryTitle, StyledSecondaryTitle };
@@ -26,17 +26,13 @@ const useAccordionItem = _ref => {
26
26
  }, [disabled, setActiveValues, value]);
27
27
  const handleOnKeyDown = useCallback((e, _dsIndex) => {
28
28
  if (!disabled && e.key === 'ArrowDown') {
29
- var _focusableChildrenRef, _focusableChildrenRef2, _focusableChildrenRef3, _focusableChildrenRef4, _focusableChildrenRef5;
30
-
31
29
  const currentIndex = focusableChildrenReferences.findIndex(item => item.index === _dsIndex);
32
- if ((_focusableChildrenRef = focusableChildrenReferences[currentIndex + 1]) !== null && _focusableChildrenRef !== void 0 && (_focusableChildrenRef2 = _focusableChildrenRef.ref) !== null && _focusableChildrenRef2 !== void 0 && _focusableChildrenRef2.current) (_focusableChildrenRef3 = focusableChildrenReferences[currentIndex + 1]) === null || _focusableChildrenRef3 === void 0 ? void 0 : (_focusableChildrenRef4 = _focusableChildrenRef3.ref) === null || _focusableChildrenRef4 === void 0 ? void 0 : (_focusableChildrenRef5 = _focusableChildrenRef4.current) === null || _focusableChildrenRef5 === void 0 ? void 0 : _focusableChildrenRef5.focus();
30
+ if (focusableChildrenReferences[currentIndex + 1]?.ref?.current) focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();
33
31
  }
34
32
 
35
33
  if (!disabled && e.key === 'ArrowUp') {
36
- var _focusableChildrenRef6, _focusableChildrenRef7, _focusableChildrenRef8, _focusableChildrenRef9, _focusableChildrenRef10;
37
-
38
34
  const currentIndex = focusableChildrenReferences.findIndex(item => item.index === _dsIndex);
39
- if ((_focusableChildrenRef6 = focusableChildrenReferences[currentIndex - 1]) !== null && _focusableChildrenRef6 !== void 0 && (_focusableChildrenRef7 = _focusableChildrenRef6.ref) !== null && _focusableChildrenRef7 !== void 0 && _focusableChildrenRef7.current) (_focusableChildrenRef8 = focusableChildrenReferences[currentIndex - 1]) === null || _focusableChildrenRef8 === void 0 ? void 0 : (_focusableChildrenRef9 = _focusableChildrenRef8.ref) === null || _focusableChildrenRef9 === void 0 ? void 0 : (_focusableChildrenRef10 = _focusableChildrenRef9.current) === null || _focusableChildrenRef10 === void 0 ? void 0 : _focusableChildrenRef10.focus();
35
+ if (focusableChildrenReferences[currentIndex - 1]?.ref?.current) focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();
40
36
  }
41
37
  }, [disabled, focusableChildrenReferences]);
42
38
  return {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-accordion",
3
- "version": "2.4.2-rc.12",
3
+ "version": "2.4.2-rc.15",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Accordion",
6
6
  "module": "./esm/index.js",
@@ -80,12 +80,12 @@
80
80
  "build": "node ../../scripts/build/build.js"
81
81
  },
82
82
  "dependencies": {
83
- "@elliemae/ds-button": "2.4.2-rc.12",
84
- "@elliemae/ds-icons": "2.4.2-rc.12",
85
- "@elliemae/ds-popperjs": "2.4.2-rc.12",
86
- "@elliemae/ds-props-helpers": "2.4.2-rc.12",
87
- "@elliemae/ds-system": "2.4.2-rc.12",
88
- "@elliemae/ds-utilities": "2.4.2-rc.12",
83
+ "@elliemae/ds-button": "2.4.2-rc.15",
84
+ "@elliemae/ds-icons": "2.4.2-rc.15",
85
+ "@elliemae/ds-popperjs": "2.4.2-rc.15",
86
+ "@elliemae/ds-props-helpers": "2.4.2-rc.15",
87
+ "@elliemae/ds-system": "2.4.2-rc.15",
88
+ "@elliemae/ds-utilities": "2.4.2-rc.15",
89
89
  "react-desc": "^4.1.3"
90
90
  },
91
91
  "devDependencies": {