@elliemae/ds-accordion 3.16.0-next.2 → 3.16.0-next.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/DSAccordion.js +11 -7
- package/dist/cjs/DSAccordion.js.map +2 -2
- package/dist/cjs/DSAccordionCTX.js +4 -0
- package/dist/cjs/DSAccordionCTX.js.map +2 -2
- package/dist/cjs/config/useAccordion.js +8 -4
- package/dist/cjs/config/useAccordion.js.map +2 -2
- package/dist/cjs/config/useAccordionRefs.js +4 -0
- package/dist/cjs/config/useAccordionRefs.js.map +2 -2
- package/dist/cjs/defaultProps.js +4 -0
- package/dist/cjs/defaultProps.js.map +2 -2
- package/dist/cjs/exported-related/DSAccordionDatatestid.js +4 -0
- package/dist/cjs/exported-related/DSAccordionDatatestid.js.map +1 -1
- package/dist/cjs/exported-related/index.js +6 -2
- package/dist/cjs/exported-related/index.js.map +2 -2
- package/dist/cjs/exported-related/theming.js +4 -0
- package/dist/cjs/exported-related/theming.js.map +1 -1
- package/dist/cjs/index.js +8 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/package.json +7 -0
- package/dist/cjs/parts/accordionContent/AccordionContent.js +10 -6
- package/dist/cjs/parts/accordionContent/AccordionContent.js.map +2 -2
- package/dist/cjs/parts/accordionContent/styles.js +5 -1
- package/dist/cjs/parts/accordionContent/styles.js.map +2 -2
- package/dist/cjs/parts/accordionItem/DSAccordionItem.js +103 -75
- package/dist/cjs/parts/accordionItem/DSAccordionItem.js.map +2 -2
- package/dist/cjs/parts/accordionItem/styles.js +5 -17
- package/dist/cjs/parts/accordionItem/styles.js.map +2 -2
- package/dist/cjs/parts/accordionItem/useAccordionItem.js +5 -1
- package/dist/cjs/parts/accordionItem/useAccordionItem.js.map +2 -2
- package/dist/cjs/propTypes.js +62 -0
- package/dist/cjs/propTypes.js.map +7 -0
- package/dist/cjs/react-desc-prop-types.js +27 -23
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/sharedTypes.js +4 -0
- package/dist/cjs/sharedTypes.js.map +2 -2
- package/dist/esm/DSAccordion.js +6 -6
- package/dist/esm/DSAccordion.js.map +1 -1
- package/dist/esm/DSAccordionCTX.js.map +1 -1
- package/dist/esm/config/useAccordion.js +3 -3
- package/dist/esm/config/useAccordion.js.map +1 -1
- package/dist/esm/config/useAccordionRefs.js.map +2 -2
- package/dist/esm/defaultProps.js.map +1 -1
- package/dist/esm/exported-related/index.js +2 -2
- package/dist/esm/exported-related/index.js.map +1 -1
- package/dist/esm/index.js +4 -4
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/package.json +7 -0
- package/dist/esm/parts/accordionContent/AccordionContent.js +4 -4
- package/dist/esm/parts/accordionContent/AccordionContent.js.map +2 -2
- package/dist/esm/parts/accordionContent/styles.js +1 -1
- package/dist/esm/parts/accordionContent/styles.js.map +1 -1
- package/dist/esm/parts/accordionItem/DSAccordionItem.js +96 -73
- package/dist/esm/parts/accordionItem/DSAccordionItem.js.map +2 -2
- package/dist/esm/parts/accordionItem/styles.js +2 -18
- package/dist/esm/parts/accordionItem/styles.js.map +2 -2
- package/dist/esm/parts/accordionItem/useAccordionItem.js +1 -1
- package/dist/esm/parts/accordionItem/useAccordionItem.js.map +2 -2
- package/dist/esm/propTypes.js +32 -0
- package/dist/esm/propTypes.js.map +7 -0
- package/dist/esm/react-desc-prop-types.js +3 -3
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/types/DSAccordion.d.ts +2 -2
- package/dist/types/DSAccordionCTX.d.ts +2 -2
- package/dist/types/config/useAccordion.d.ts +2 -2
- package/dist/types/config/useAccordionRefs.d.ts +2 -2
- package/dist/types/defaultProps.d.ts +1 -1
- package/dist/types/exported-related/index.d.ts +2 -2
- package/dist/types/index.d.ts +4 -4
- package/dist/types/parts/accordionContent/styles.d.ts +1 -0
- package/dist/types/parts/accordionItem/DSAccordionItem.d.ts +2 -2
- package/dist/types/parts/accordionItem/styles.d.ts +44 -0
- package/dist/types/propTypes.d.ts +17 -0
- package/dist/types/react-desc-prop-types.d.ts +898 -898
- package/dist/types/sharedTypes.d.ts +1 -1
- package/dist/types/tests/a11y/axe.test.d.ts +1 -0
- package/package.json +10 -8
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -32,17 +36,19 @@ module.exports = __toCommonJS(DSAccordionItem_exports);
|
|
|
32
36
|
var React = __toESM(require("react"));
|
|
33
37
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
34
38
|
var import_react = require("react");
|
|
39
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
40
|
+
var import_ds_grid = require("@elliemae/ds-grid");
|
|
35
41
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
36
42
|
var import_ds_button = require("@elliemae/ds-button");
|
|
37
43
|
var import_ds_popperjs = require("@elliemae/ds-popperjs");
|
|
38
|
-
var import_defaultProps = require("../../defaultProps");
|
|
39
|
-
var import_styles = require("./styles");
|
|
40
|
-
var import_useAccordionItem = require("./useAccordionItem");
|
|
41
|
-
var import_DSAccordionCTX = require("../../DSAccordionCTX");
|
|
42
|
-
var import_DSAccordionDatatestid = require("../../exported-related/DSAccordionDatatestid");
|
|
43
|
-
var import_react_desc_prop_types = require("../../react-desc-prop-types");
|
|
44
|
+
var import_defaultProps = require("../../defaultProps.js");
|
|
45
|
+
var import_styles = require("./styles.js");
|
|
46
|
+
var import_useAccordionItem = require("./useAccordionItem.js");
|
|
47
|
+
var import_DSAccordionCTX = require("../../DSAccordionCTX.js");
|
|
48
|
+
var import_DSAccordionDatatestid = require("../../exported-related/DSAccordionDatatestid.js");
|
|
49
|
+
var import_react_desc_prop_types = require("../../react-desc-prop-types.js");
|
|
44
50
|
const DSAccordionItem = (props) => {
|
|
45
|
-
const propsWithDefaults = (0,
|
|
51
|
+
const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(
|
|
46
52
|
props,
|
|
47
53
|
import_defaultProps.accordionItemDefaultProps
|
|
48
54
|
);
|
|
@@ -62,8 +68,8 @@ const DSAccordionItem = (props) => {
|
|
|
62
68
|
...rest
|
|
63
69
|
} = propsWithDefaults;
|
|
64
70
|
const { handleOnClick, handleOnKeyDown, selected } = (0, import_useAccordionItem.useAccordionItem)({ value, disabled });
|
|
65
|
-
const xstyledAttrs = (0,
|
|
66
|
-
const xstyledContentAttrs = (0,
|
|
71
|
+
const xstyledAttrs = (0, import_ds_props_helpers.useGetXstyledProps)(rest);
|
|
72
|
+
const xstyledContentAttrs = (0, import_ds_props_helpers.useGetXstyledProps)(xStyledPropsContent);
|
|
67
73
|
const {
|
|
68
74
|
allChildrenReferences,
|
|
69
75
|
actualActiveValue,
|
|
@@ -92,58 +98,6 @@ const DSAccordionItem = (props) => {
|
|
|
92
98
|
}, [CustomActions, actualActiveValue, allChildrenReferences, customActions, isDSMobile, renderCustomActions]);
|
|
93
99
|
const { isShowingEllipsis: isPrimaryShowingEllipsis, setElement: setPrimaryElement } = (0, import_ds_utilities.useIsShowingEllipsis)();
|
|
94
100
|
const { isShowingEllipsis: isSecondaryShowingEllipsis, setElement: setSecondaryElement } = (0, import_ds_utilities.useIsShowingEllipsis)();
|
|
95
|
-
const Titles = (0, import_react.useMemo)(() => {
|
|
96
|
-
if ((isPrimaryShowingEllipsis || isSecondaryShowingEllipsis) && !isDSMobile)
|
|
97
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
98
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
99
|
-
import_styles.StyledPrimaryTitle,
|
|
100
|
-
{
|
|
101
|
-
ref: setPrimaryElement,
|
|
102
|
-
...title ? { id: `accordion_${title || ""}id` } : void 0,
|
|
103
|
-
disabled,
|
|
104
|
-
isDSMobile,
|
|
105
|
-
selected,
|
|
106
|
-
withSecondaryTitle: secondaryTitle,
|
|
107
|
-
children: title
|
|
108
|
-
}
|
|
109
|
-
),
|
|
110
|
-
!isDSMobile && secondaryTitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledSecondaryTitle, { ref: setSecondaryElement, disabled, selected, children: secondaryTitle }),
|
|
111
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_popperjs.DSPopperJS, { referenceElement, showPopover, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledTooltipContent, { children: [
|
|
112
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: title }),
|
|
113
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [
|
|
114
|
-
" ",
|
|
115
|
-
secondaryTitle
|
|
116
|
-
] })
|
|
117
|
-
] }) })
|
|
118
|
-
] });
|
|
119
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
120
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
121
|
-
import_styles.StyledPrimaryTitle,
|
|
122
|
-
{
|
|
123
|
-
ref: setPrimaryElement,
|
|
124
|
-
...title ? { id: `accordion_${title || ""}id` } : void 0,
|
|
125
|
-
disabled,
|
|
126
|
-
isDSMobile,
|
|
127
|
-
selected,
|
|
128
|
-
withSecondaryTitle: secondaryTitle,
|
|
129
|
-
children: title
|
|
130
|
-
}
|
|
131
|
-
),
|
|
132
|
-
!isDSMobile && secondaryTitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledSecondaryTitle, { ref: setSecondaryElement, disabled, selected, children: secondaryTitle })
|
|
133
|
-
] });
|
|
134
|
-
}, [
|
|
135
|
-
disabled,
|
|
136
|
-
isDSMobile,
|
|
137
|
-
isPrimaryShowingEllipsis,
|
|
138
|
-
isSecondaryShowingEllipsis,
|
|
139
|
-
referenceElement,
|
|
140
|
-
secondaryTitle,
|
|
141
|
-
setPrimaryElement,
|
|
142
|
-
setSecondaryElement,
|
|
143
|
-
showPopover,
|
|
144
|
-
selected,
|
|
145
|
-
title
|
|
146
|
-
]);
|
|
147
101
|
const onKeyDownWithIndex = (0, import_react.useCallback)(
|
|
148
102
|
(e) => {
|
|
149
103
|
handleOnKeyDown(e, dsIndex);
|
|
@@ -155,7 +109,7 @@ const DSAccordionItem = (props) => {
|
|
|
155
109
|
[isPrimaryShowingEllipsis, isSecondaryShowingEllipsis]
|
|
156
110
|
);
|
|
157
111
|
const handleOnBlur = (0, import_react.useCallback)(() => setShowPopover(false), []);
|
|
158
|
-
const { className, ...globalAttrs } = (0,
|
|
112
|
+
const { className, ...globalAttrs } = (0, import_ds_props_helpers.useGetGlobalAttributes)(rest, {
|
|
159
113
|
onClick: handleOnClick,
|
|
160
114
|
onFocus: handleOnFocus,
|
|
161
115
|
onBlur: handleOnBlur
|
|
@@ -165,6 +119,84 @@ const DSAccordionItem = (props) => {
|
|
|
165
119
|
onFocus: handleOnFocus,
|
|
166
120
|
onBlur: handleOnBlur
|
|
167
121
|
};
|
|
122
|
+
const titleDesktop = (0, import_react.useMemo)(
|
|
123
|
+
() => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
124
|
+
import_ds_grid.Grid,
|
|
125
|
+
{
|
|
126
|
+
onMouseEnter: handleOnFocus,
|
|
127
|
+
onMouseLeave: handleOnBlur,
|
|
128
|
+
rows: ["auto", "auto"],
|
|
129
|
+
rowGap: secondaryTitle ? "3px" : "0px",
|
|
130
|
+
padding: "6px 0px",
|
|
131
|
+
width: "100%",
|
|
132
|
+
children: [
|
|
133
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: ["20px", "auto"], children: [
|
|
134
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledItemAddon, { disabled, children: selected ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconOpened, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconClosed, {}) }),
|
|
135
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledItemTitles, { withSecondaryTitle: secondaryTitle, selected, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
136
|
+
import_styles.StyledPrimaryTitle,
|
|
137
|
+
{
|
|
138
|
+
ref: setPrimaryElement,
|
|
139
|
+
...title ? { id: `accordion_${title || ""}id` } : void 0,
|
|
140
|
+
disabled,
|
|
141
|
+
selected,
|
|
142
|
+
withSecondaryTitle: secondaryTitle,
|
|
143
|
+
children: title
|
|
144
|
+
}
|
|
145
|
+
) })
|
|
146
|
+
] }),
|
|
147
|
+
secondaryTitle && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: ["20px", "auto"], children: [
|
|
148
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}),
|
|
149
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledSecondaryTitle, { ref: setSecondaryElement, disabled, selected, children: secondaryTitle })
|
|
150
|
+
] })
|
|
151
|
+
]
|
|
152
|
+
}
|
|
153
|
+
),
|
|
154
|
+
[
|
|
155
|
+
setPrimaryElement,
|
|
156
|
+
IconOpened,
|
|
157
|
+
IconClosed,
|
|
158
|
+
setSecondaryElement,
|
|
159
|
+
handleOnBlur,
|
|
160
|
+
handleOnFocus,
|
|
161
|
+
handleOnBlur,
|
|
162
|
+
secondaryTitle,
|
|
163
|
+
disabled,
|
|
164
|
+
selected,
|
|
165
|
+
IconOpened,
|
|
166
|
+
IconClosed,
|
|
167
|
+
setPrimaryElement,
|
|
168
|
+
title,
|
|
169
|
+
disabled
|
|
170
|
+
]
|
|
171
|
+
);
|
|
172
|
+
const titleMobile = (0, import_react.useMemo)(
|
|
173
|
+
() => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { width: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: ["auto", "20px"], children: [
|
|
174
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
175
|
+
import_styles.StyledItemTitles,
|
|
176
|
+
{
|
|
177
|
+
onMouseEnter: handleOnFocus,
|
|
178
|
+
onMouseLeave: handleOnBlur,
|
|
179
|
+
isDSMobile: true,
|
|
180
|
+
withSecondaryTitle: secondaryTitle,
|
|
181
|
+
selected,
|
|
182
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
183
|
+
import_styles.StyledPrimaryTitle,
|
|
184
|
+
{
|
|
185
|
+
ref: setPrimaryElement,
|
|
186
|
+
...title ? { id: `accordion_${title || ""}id` } : void 0,
|
|
187
|
+
disabled,
|
|
188
|
+
isDSMobile: true,
|
|
189
|
+
selected,
|
|
190
|
+
withSecondaryTitle: secondaryTitle,
|
|
191
|
+
children: title
|
|
192
|
+
}
|
|
193
|
+
)
|
|
194
|
+
}
|
|
195
|
+
),
|
|
196
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledItemAddon, { disabled, isDSMobile: true, children: selected ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconOpened, { isDSMobile: true }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconClosed, { isDSMobile: true }) })
|
|
197
|
+
] }) }),
|
|
198
|
+
[handleOnFocus, handleOnBlur, secondaryTitle, selected, setPrimaryElement, title, disabled, IconOpened, IconClosed]
|
|
199
|
+
);
|
|
168
200
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledItemContainer, { "data-testid": import_DSAccordionDatatestid.DSAccordionDataTestid.ITEM.CONTAINER, className, ...xstyledAttrs, children: [
|
|
169
201
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledItemHeaderContainer, { disabled, ref: setReferenceElement, children: [
|
|
170
202
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
@@ -187,18 +219,14 @@ const DSAccordionItem = (props) => {
|
|
|
187
219
|
...handlers,
|
|
188
220
|
...globalAttrs,
|
|
189
221
|
children: [
|
|
190
|
-
|
|
191
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
192
|
-
|
|
193
|
-
{
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
selected,
|
|
199
|
-
children: Titles
|
|
200
|
-
}
|
|
201
|
-
)
|
|
222
|
+
isDSMobile ? titleMobile : titleDesktop,
|
|
223
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_popperjs.DSPopperJS, { referenceElement, showPopover: !selected && showPopover, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledTooltipContent, { children: [
|
|
224
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: title }),
|
|
225
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [
|
|
226
|
+
" ",
|
|
227
|
+
secondaryTitle
|
|
228
|
+
] })
|
|
229
|
+
] }) })
|
|
202
230
|
]
|
|
203
231
|
}
|
|
204
232
|
),
|
|
@@ -219,7 +247,7 @@ const DSAccordionItem = (props) => {
|
|
|
219
247
|
] });
|
|
220
248
|
};
|
|
221
249
|
DSAccordionItem.displayName = "DSAccordionItem";
|
|
222
|
-
const DSAccordionItemWithSchema = (0,
|
|
250
|
+
const DSAccordionItemWithSchema = (0, import_ds_props_helpers.describe)(DSAccordionItem);
|
|
223
251
|
DSAccordionItemWithSchema.propTypes = import_react_desc_prop_types.accordionItemPropTypes;
|
|
224
252
|
var DSAccordionItem_default = DSAccordionItem;
|
|
225
253
|
//# sourceMappingURL=DSAccordionItem.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/accordionItem/DSAccordionItem.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React, { useState, useContext, useCallback, useMemo } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n describe,\n
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React, { useState, useContext, useCallback, useMemo } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useIsShowingEllipsis } from '@elliemae/ds-utilities';\nimport { DSButton, BUTTON_TYPE } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { accordionItemDefaultProps } from '../../defaultProps.js';\nimport {\n StyledItemAddon,\n StyledItemContainer,\n StyledItemContent,\n StyledItemCustomActions,\n StyledItemHeader,\n StyledItemHeaderContainer,\n StyledItemTitles,\n StyledPrimaryTitle,\n StyledSecondaryTitle,\n StyledTooltipContent,\n} from './styles.js';\nimport { useAccordionItem } from './useAccordionItem.js';\nimport { DSAccordionContext } from '../../DSAccordionCTX.js';\nimport { DSAccordionDataTestid } from '../../exported-related/DSAccordionDatatestid.js';\nimport { accordionItemPropTypes } from '../../react-desc-prop-types.js';\nimport type { DSAccordionT } from '../../react-desc-prop-types.js';\n\nconst DSAccordionItem = (props: DSAccordionT.ItemProps): JSX.Element => {\n const propsWithDefaults = useMemoMergePropsWithDefault(\n props,\n accordionItemDefaultProps,\n ) as DSAccordionT.InternalItemProps;\n\n const {\n children,\n title,\n secondaryTitle,\n customActions,\n iconOpened: IconOpened,\n iconClosed: IconClosed,\n value,\n disabled,\n dsIndex,\n renderCustomActions,\n CustomActions,\n xStyledPropsContent,\n ...rest\n } = propsWithDefaults;\n\n const { handleOnClick, handleOnKeyDown, selected } = useAccordionItem({ value, disabled });\n\n const xstyledAttrs = useGetXstyledProps(rest);\n const xstyledContentAttrs = useGetXstyledProps(xStyledPropsContent);\n\n const {\n allChildrenReferences,\n actualActiveValue,\n props: { isDSMobile },\n } = useContext(DSAccordionContext);\n\n const [showPopover, setShowPopover] = useState(false);\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>();\n\n const CustomActionsContent = useMemo(() => {\n if (!isDSMobile && customActions?.length > 0)\n return (\n <StyledItemCustomActions isDSMobile={isDSMobile}>\n {customActions?.map(({ onClick, id, ...otherProps }) => (\n <DSButton\n key={id}\n onClick={(e: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>): void => {\n e.stopPropagation();\n if (onClick) onClick(e as React.MouseEvent<HTMLElement, MouseEvent>);\n }}\n {...otherProps}\n buttonType={BUTTON_TYPE.SECONDARY}\n />\n ))}\n </StyledItemCustomActions>\n );\n\n if (!isDSMobile && (renderCustomActions || CustomActions))\n return (\n <StyledItemCustomActions isDSMobile={isDSMobile}>\n {CustomActions !== undefined ? (\n <CustomActions allRefs={allChildrenReferences} actualActiveValue={actualActiveValue} />\n ) : (\n renderCustomActions?.({ allRefs: allChildrenReferences, actualActiveValue })\n )}\n </StyledItemCustomActions>\n );\n return null;\n }, [CustomActions, actualActiveValue, allChildrenReferences, customActions, isDSMobile, renderCustomActions]);\n\n const { isShowingEllipsis: isPrimaryShowingEllipsis, setElement: setPrimaryElement } = useIsShowingEllipsis();\n\n const { isShowingEllipsis: isSecondaryShowingEllipsis, setElement: setSecondaryElement } = useIsShowingEllipsis();\n\n const onKeyDownWithIndex = useCallback(\n (e: React.KeyboardEvent) => {\n handleOnKeyDown(e, dsIndex);\n },\n [dsIndex, handleOnKeyDown],\n );\n const handleOnFocus = useCallback(\n () => setShowPopover(isPrimaryShowingEllipsis || isSecondaryShowingEllipsis),\n [isPrimaryShowingEllipsis, isSecondaryShowingEllipsis],\n );\n\n const handleOnBlur = useCallback(() => setShowPopover(false), []);\n\n const { className, ...globalAttrs } = useGetGlobalAttributes(rest, {\n onClick: handleOnClick,\n onFocus: handleOnFocus,\n onBlur: handleOnBlur,\n });\n\n const handlers = {\n onClick: handleOnClick,\n onFocus: handleOnFocus,\n onBlur: handleOnBlur,\n };\n\n const titleDesktop = useMemo(\n () => (\n <Grid\n onMouseEnter={handleOnFocus}\n onMouseLeave={handleOnBlur}\n rows={['auto', 'auto']}\n rowGap={secondaryTitle ? '3px' : '0px'}\n padding=\"6px 0px\"\n width=\"100%\"\n >\n <Grid cols={['20px', 'auto']}>\n <StyledItemAddon disabled={disabled}>{selected ? <IconOpened /> : <IconClosed />}</StyledItemAddon>\n <StyledItemTitles withSecondaryTitle={secondaryTitle} selected={selected}>\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n {...(title ? { id: `accordion_${title || ''}id` } : undefined)}\n disabled={disabled}\n selected={selected}\n withSecondaryTitle={secondaryTitle}\n >\n {title}\n </StyledPrimaryTitle>\n </StyledItemTitles>\n </Grid>\n {secondaryTitle && (\n <Grid cols={['20px', 'auto']}>\n <div></div>\n <StyledSecondaryTitle ref={setSecondaryElement} disabled={disabled} selected={selected}>\n {secondaryTitle}\n </StyledSecondaryTitle>\n </Grid>\n )}\n </Grid>\n ),\n [\n setPrimaryElement,\n IconOpened,\n IconClosed,\n setSecondaryElement,\n handleOnBlur,\n handleOnFocus,\n handleOnBlur,\n secondaryTitle,\n disabled,\n selected,\n IconOpened,\n IconClosed,\n setPrimaryElement,\n title,\n disabled,\n ],\n );\n\n const titleMobile = useMemo(\n () => (\n <Grid width=\"100%\">\n <Grid cols={['auto', '20px']}>\n <StyledItemTitles\n onMouseEnter={handleOnFocus}\n onMouseLeave={handleOnBlur}\n isDSMobile\n withSecondaryTitle={secondaryTitle}\n selected={selected}\n >\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n {...(title ? { id: `accordion_${title || ''}id` } : undefined)}\n disabled={disabled}\n isDSMobile\n selected={selected}\n withSecondaryTitle={secondaryTitle}\n >\n {title}\n </StyledPrimaryTitle>\n </StyledItemTitles>\n <StyledItemAddon disabled={disabled} isDSMobile>\n {selected ? <IconOpened isDSMobile /> : <IconClosed isDSMobile />}\n </StyledItemAddon>\n </Grid>\n </Grid>\n ),\n [handleOnFocus, handleOnBlur, secondaryTitle, selected, setPrimaryElement, title, disabled, IconOpened, IconClosed],\n );\n return (\n <StyledItemContainer data-testid={DSAccordionDataTestid.ITEM.CONTAINER} className={className} {...xstyledAttrs}>\n <StyledItemHeaderContainer disabled={disabled} ref={setReferenceElement}>\n <StyledItemHeader\n type=\"button\"\n withCustomActions={(customActions?.length > 0 || renderCustomActions !== undefined) && !isDSMobile}\n withSecondaryTitle={secondaryTitle}\n tabIndex={!disabled ? 0 : undefined}\n disabled={disabled}\n data-disabled={disabled}\n ref={allChildrenReferences[dsIndex]}\n onKeyDown={onKeyDownWithIndex}\n isDSMobile={isDSMobile}\n data-testid={DSAccordionDataTestid.ITEM.HEADER}\n id={`ds-accordion-header-${value}`}\n aria-expanded={selected}\n aria-disabled={disabled}\n aria-controls={`ds-accordion-content-${value}`}\n {...handlers}\n {...globalAttrs}\n >\n {isDSMobile ? titleMobile : titleDesktop}\n <DSPopperJS referenceElement={referenceElement} showPopover={!selected && showPopover}>\n <StyledTooltipContent>\n <p>{title}</p>\n <p> {secondaryTitle}</p>\n </StyledTooltipContent>\n </DSPopperJS>\n </StyledItemHeader>\n {CustomActionsContent}\n </StyledItemHeaderContainer>\n {selected && (\n <StyledItemContent\n data-testid={DSAccordionDataTestid.ITEM.CONTENT}\n aria-labelledby={`ds-accordion-header-${value}`}\n role=\"region\"\n isDSMobile={isDSMobile}\n id={`ds-accordion-content-${value}`}\n {...xstyledContentAttrs}\n >\n {children}\n </StyledItemContent>\n )}\n </StyledItemContainer>\n );\n};\n\nDSAccordionItem.displayName = 'DSAccordionItem';\nconst DSAccordionItemWithSchema = describe(DSAccordionItem);\nDSAccordionItemWithSchema.propTypes = accordionItemPropTypes as WeakValidationMap<unknown>;\n\nexport { DSAccordionItem, DSAccordionItemWithSchema };\nexport default DSAccordionItem;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -38,20 +42,7 @@ __export(styles_exports, {
|
|
|
38
42
|
module.exports = __toCommonJS(styles_exports);
|
|
39
43
|
var React = __toESM(require("react"));
|
|
40
44
|
var import_ds_system = require("@elliemae/ds-system");
|
|
41
|
-
var import_exported_related = require("../../exported-related");
|
|
42
|
-
const paddingSetter = ({ isDSMobile, withSecondaryTitle }) => {
|
|
43
|
-
if (isDSMobile)
|
|
44
|
-
return import_ds_system.css`
|
|
45
|
-
padding: 13px 0;
|
|
46
|
-
`;
|
|
47
|
-
if (withSecondaryTitle)
|
|
48
|
-
return import_ds_system.css`
|
|
49
|
-
padding: 6px 0;
|
|
50
|
-
`;
|
|
51
|
-
return import_ds_system.css`
|
|
52
|
-
padding: 7px 0;
|
|
53
|
-
`;
|
|
54
|
-
};
|
|
45
|
+
var import_exported_related = require("../../exported-related/index.js");
|
|
55
46
|
const StyledItemContainer = (0, import_ds_system.styled)("div", {
|
|
56
47
|
name: import_exported_related.DSAccordionName,
|
|
57
48
|
slot: import_exported_related.DSAccordionSlots.ITEM.CONTAINER
|
|
@@ -79,7 +70,6 @@ const StyledItemHeader = (0, import_ds_system.styled)("button", {
|
|
|
79
70
|
cursor: ${({ disabled }) => disabled ? "not-allowed" : "pointer"};
|
|
80
71
|
}
|
|
81
72
|
padding: ${({ isDSMobile }) => isDSMobile ? `0 16px` : `0`};
|
|
82
|
-
${({ isDSMobile }) => isDSMobile ? `flex-direction: row-reverse;` : ``}
|
|
83
73
|
&:focus {
|
|
84
74
|
&:after {
|
|
85
75
|
position: absolute;
|
|
@@ -108,7 +98,6 @@ const StyledItemAddon = (0, import_ds_system.styled)("div", {
|
|
|
108
98
|
height: 100%;
|
|
109
99
|
display: grid;
|
|
110
100
|
place-items: center;
|
|
111
|
-
|
|
112
101
|
& .em-ds-icon svg {
|
|
113
102
|
fill: ${({ disabled, theme }) => disabled ? theme.colors.neutral[200] : theme.colors.brand[800]};
|
|
114
103
|
}
|
|
@@ -119,7 +108,6 @@ const StyledItemTitles = (0, import_ds_system.styled)("div", {
|
|
|
119
108
|
})`
|
|
120
109
|
display: grid;
|
|
121
110
|
grid-gap: ${({ theme }) => theme.space.xxxs};
|
|
122
|
-
${paddingSetter}
|
|
123
111
|
grid-template-columns: 100%;
|
|
124
112
|
width: 100%;
|
|
125
113
|
align-content: center;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/accordionItem/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport { styled,
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSAccordionName, DSAccordionSlots } from '../../exported-related/index.js';\ninterface StyledItemHeaderPropsT {\n withCustomActions: boolean;\n withSecondaryTitle?: string;\n isDSMobile?: boolean;\n}\n\ninterface StyledItemTitlesPropsT {\n withSecondaryTitle?: string;\n isDSMobile?: boolean;\n selected: boolean;\n}\n\ninterface StyledPrimaryTitlePropsT {\n disabled: boolean;\n isDSMobile?: boolean;\n selected: boolean;\n withSecondaryTitle: boolean;\n}\n\ninterface StyledItemContentPropsT {\n isDSMobile?: boolean;\n}\n\ninterface StyledSecondaryTitlePropsT {\n disabled: boolean;\n selected: boolean;\n}\n\ninterface StyledItemAddonPropsT {\n disabled: boolean;\n isDSMobile?: boolean;\n}\n\ninterface StyledItemHeaderContainerPropsT {\n disabled: boolean;\n}\n\ninterface StyledItemCustomActionsPropsT {\n isDSMobile?: boolean;\n}\n\nexport const StyledItemContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.CONTAINER,\n})`\n display: grid;\n grid-template-rows: auto auto;\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral[200]};\n align-items: center;\n min-width: 240px;\n grid-template-columns: 100%;\n ${xStyledCommonProps};\n`;\n\nexport const StyledItemHeader = styled('button', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CONTAINER,\n})<StyledItemHeaderPropsT>`\n display: flex;\n min-height: ${({ theme, withSecondaryTitle, isDSMobile }) =>\n isDSMobile ? `44px` : `${withSecondaryTitle ? theme.space.m : theme.space.s}`};\n width: 100%;\n align-items: center;\n border: none;\n outline: none;\n background: none;\n &:hover {\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n }\n padding: ${({ isDSMobile }) => (isDSMobile ? `0 16px` : `0`)};\n &:focus {\n &:after {\n position: absolute;\n content: '';\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n border-radius: 2px;\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n pointer-events: none;\n }\n }\n`;\n\nexport const StyledItemContent = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.CONTENT.CONTAINER,\n})<StyledItemContentPropsT>`\n padding: ${({ isDSMobile }) => (isDSMobile ? `3px 16px 24px 16px` : '16px 20px')};\n ${xStyledCommonProps};\n`;\n\nexport const StyledItemAddon = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.ADDON,\n})<StyledItemAddonPropsT>`\n height: 100%;\n display: grid;\n place-items: center;\n & .em-ds-icon svg {\n fill: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[200] : theme.colors.brand[800])};\n }\n`;\n\nexport const StyledItemTitles = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.TITLE_CONTAINER,\n})<StyledItemTitlesPropsT>`\n display: grid;\n grid-gap: ${({ theme }) => theme.space.xxxs};\n grid-template-columns: 100%;\n width: 100%;\n align-content: center;\n`;\n\nexport const StyledPrimaryTitle = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.PRIMARY_TITLE,\n})<StyledPrimaryTitlePropsT>`\n margin: 0;\n font-size: 16px;\n line-height: 1.125;\n text-align: left;\n text-overflow: ellipsis;\n min-height: ${({ theme }) => theme.space.xs};\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[500] : theme.colors.neutral[700])};\n font-weight: ${({ theme, isDSMobile }) => (isDSMobile ? theme.fontWeights.semibold : theme.fontWeights.regular)};\n ${({ selected }) =>\n selected\n ? `word-break: break-word;`\n : `\n overflow: hidden;\n white-space: nowrap;\n `};\n width: 100%;\n display: block;\n`;\n\nexport const StyledSecondaryTitle = styled('span', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.SECONDARY_TITLE,\n})<StyledSecondaryTitlePropsT>`\n margin: 0;\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n line-height: 1.273;\n text-align: left;\n min-height: 12px;\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[500] : theme.colors.neutral[700])};\n text-overflow: ellipsis;\n ${({ selected }) =>\n selected\n ? `word-break: break-word;`\n : `\n overflow: hidden;\n white-space: nowrap;\n width: 100%;\n display: block;`}\n`;\n\nexport const StyledItemCustomActions = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CUSTOM_ACTIONS_CONTAINER,\n})<StyledItemCustomActionsPropsT>`\n display: grid;\n grid-auto-flow: column;\n place-items: center;\n grid-gap: ${({ theme }) => theme.space.xxs};\n margin: ${({ theme, isDSMobile }) => (isDSMobile ? `0 ${theme.space.xs}` : '0 20px 0 16px')};\n justify-content: flex-end;\n height: 28px;\n`;\n\nexport const StyledItemHeaderContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CONTAINER,\n})<StyledItemHeaderContainerPropsT>`\n display: grid;\n grid-template-columns: auto max-content;\n place-items: center;\n position: relative;\n border-radius: 2px;\n &:hover {\n ${({ disabled, theme }) => (!disabled ? `background: ${theme.colors.brand[200]};` : ``)}\n }\n`;\n\nexport const StyledTooltipContent = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.TOOLTIP,\n})`\n padding: 8px;\n width: 250px;\n background: white;\n display: grid;\n gap: ${({ theme }) => theme.space.xxs};\n\n p {\n margin: 0;\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -29,7 +33,7 @@ __export(useAccordionItem_exports, {
|
|
|
29
33
|
module.exports = __toCommonJS(useAccordionItem_exports);
|
|
30
34
|
var React = __toESM(require("react"));
|
|
31
35
|
var import_react = require("react");
|
|
32
|
-
var import_DSAccordionCTX = require("../../DSAccordionCTX");
|
|
36
|
+
var import_DSAccordionCTX = require("../../DSAccordionCTX.js");
|
|
33
37
|
const useAccordionItem = ({ value, disabled }) => {
|
|
34
38
|
const { actualActiveValue, setActiveValues, focusableChildrenReferences } = (0, import_react.useContext)(import_DSAccordionCTX.DSAccordionContext);
|
|
35
39
|
const selected = (0, import_react.useMemo)(() => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/accordionItem/useAccordionItem.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type React from 'react';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { DSAccordionContext } from '../../DSAccordionCTX';\n\nexport interface UseAccordionItemPropsT {\n value: string | number;\n disabled: boolean;\n}\n\ninterface UseAccordionItemReturnTypeT {\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnKeyDown: (e: React.KeyboardEvent, dsIndex: number) => void;\n selected: boolean;\n}\n\nexport const useAccordionItem = ({ value, disabled }: UseAccordionItemPropsT): UseAccordionItemReturnTypeT => {\n const { actualActiveValue, setActiveValues, focusableChildrenReferences } = useContext(DSAccordionContext);\n\n const selected = useMemo(() => {\n if (Array.isArray(actualActiveValue)) {\n return actualActiveValue.some((currentValue) => currentValue === value);\n }\n return value === actualActiveValue;\n }, [actualActiveValue, value]);\n\n const handleOnClick = useCallback(\n (e: React.MouseEvent) => {\n if (!disabled) setActiveValues(value, e);\n },\n [disabled, setActiveValues, value],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent, _dsIndex: number) => {\n if (!disabled && e.key === 'ArrowDown') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex + 1]?.ref?.current)\n focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();\n else if (currentIndex === focusableChildrenReferences.length - 1) {\n focusableChildrenReferences[0]?.ref?.current?.focus();\n }\n }\n\n if (!disabled && e.key === 'ArrowUp') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex - 1]?.ref?.current)\n focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();\n else if (currentIndex === 0) {\n focusableChildrenReferences[focusableChildrenReferences.length - 1]?.ref?.current?.focus();\n }\n }\n },\n [disabled, focusableChildrenReferences],\n );\n\n return {\n handleOnClick,\n handleOnKeyDown,\n selected,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { DSAccordionContext } from '../../DSAccordionCTX.js';\n\nexport interface UseAccordionItemPropsT {\n value: string | number;\n disabled: boolean;\n}\n\ninterface UseAccordionItemReturnTypeT {\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnKeyDown: (e: React.KeyboardEvent, dsIndex: number) => void;\n selected: boolean;\n}\n\nexport const useAccordionItem = ({ value, disabled }: UseAccordionItemPropsT): UseAccordionItemReturnTypeT => {\n const { actualActiveValue, setActiveValues, focusableChildrenReferences } = useContext(DSAccordionContext);\n\n const selected = useMemo(() => {\n if (Array.isArray(actualActiveValue)) {\n return actualActiveValue.some((currentValue) => currentValue === value);\n }\n return value === actualActiveValue;\n }, [actualActiveValue, value]);\n\n const handleOnClick = useCallback(\n (e: React.MouseEvent) => {\n if (!disabled) setActiveValues(value, e);\n },\n [disabled, setActiveValues, value],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent, _dsIndex: number) => {\n if (!disabled && e.key === 'ArrowDown') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex + 1]?.ref?.current)\n focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();\n else if (currentIndex === focusableChildrenReferences.length - 1) {\n focusableChildrenReferences[0]?.ref?.current?.focus();\n }\n }\n\n if (!disabled && e.key === 'ArrowUp') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex - 1]?.ref?.current)\n focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();\n else if (currentIndex === 0) {\n focusableChildrenReferences[focusableChildrenReferences.length - 1]?.ref?.current?.focus();\n }\n }\n },\n [disabled, focusableChildrenReferences],\n );\n\n return {\n handleOnClick,\n handleOnKeyDown,\n selected,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAiD;AACjD,4BAAmC;AAa5B,MAAM,mBAAmB,CAAC,EAAE,OAAO,SAAS,MAA2D;AAC5G,QAAM,EAAE,mBAAmB,iBAAiB,4BAA4B,QAAI,yBAAW,wCAAkB;AAEzG,QAAM,eAAW,sBAAQ,MAAM;AAC7B,QAAI,MAAM,QAAQ,iBAAiB,GAAG;AACpC,aAAO,kBAAkB,KAAK,CAAC,iBAAiB,iBAAiB,KAAK;AAAA,IACxE;AACA,WAAO,UAAU;AAAA,EACnB,GAAG,CAAC,mBAAmB,KAAK,CAAC;AAE7B,QAAM,oBAAgB;AAAA,IACpB,CAAC,MAAwB;AACvB,UAAI,CAAC;AAAU,wBAAgB,OAAO,CAAC;AAAA,IACzC;AAAA,IACA,CAAC,UAAU,iBAAiB,KAAK;AAAA,EACnC;AAEA,QAAM,sBAAkB;AAAA,IACtB,CAAC,GAAwB,aAAqB;AAC5C,UAAI,CAAC,YAAY,EAAE,QAAQ,aAAa;AACtC,cAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU,QAAQ;AAC5F,YAAI,4BAA4B,eAAe,CAAC,GAAG,KAAK;AACtD,sCAA4B,eAAe,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,iBAC5D,iBAAiB,4BAA4B,SAAS,GAAG;AAChE,sCAA4B,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,QACtD;AAAA,MACF;AAEA,UAAI,CAAC,YAAY,EAAE,QAAQ,WAAW;AACpC,cAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU,QAAQ;AAC5F,YAAI,4BAA4B,eAAe,CAAC,GAAG,KAAK;AACtD,sCAA4B,eAAe,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,iBAC5D,iBAAiB,GAAG;AAC3B,sCAA4B,4BAA4B,SAAS,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,QAC3F;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,UAAU,2BAA2B;AAAA,EACxC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var propTypes_exports = {};
|
|
30
|
+
__export(propTypes_exports, {
|
|
31
|
+
accordionItemPropTypes: () => accordionItemPropTypes,
|
|
32
|
+
accordionPropTypes: () => accordionPropTypes
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(propTypes_exports);
|
|
35
|
+
var React = __toESM(require("react"));
|
|
36
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
37
|
+
const accordionItemPropTypes = {
|
|
38
|
+
children: import_ds_props_helpers.PropTypes.node.description("Dimsum AccordionItem content.").isRequired,
|
|
39
|
+
title: import_ds_props_helpers.PropTypes.string.description("Set a primary title."),
|
|
40
|
+
value: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.string, import_ds_props_helpers.PropTypes.number]).description(
|
|
41
|
+
"Dimsum AccordionItem value, this value should be unique."
|
|
42
|
+
).isRequired,
|
|
43
|
+
iconClosed: import_ds_props_helpers.PropTypes.node.description("Custom Dimsum Icon when it is closed."),
|
|
44
|
+
iconOpened: import_ds_props_helpers.PropTypes.node.description("Custom Dimsum Icon when it is open."),
|
|
45
|
+
secondaryTitle: import_ds_props_helpers.PropTypes.string.description("Set a secondary title"),
|
|
46
|
+
customActions: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.object).description("Set Dimsum AccordionItem custom actions.").deprecated({ version: "3.x" }),
|
|
47
|
+
renderCustomActions: import_ds_props_helpers.PropTypes.func.description(
|
|
48
|
+
"This property will render any JSX in the custom actions area. You can access to all references and active values within the props."
|
|
49
|
+
).deprecated({ version: "3.x" })
|
|
50
|
+
};
|
|
51
|
+
const accordionPropTypes = {
|
|
52
|
+
containerProps: import_ds_props_helpers.PropTypes.object.description("Adds props to the container."),
|
|
53
|
+
activeValue: import_ds_props_helpers.PropTypes.oneOfType([
|
|
54
|
+
import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.string, import_ds_props_helpers.PropTypes.number])),
|
|
55
|
+
import_ds_props_helpers.PropTypes.string,
|
|
56
|
+
import_ds_props_helpers.PropTypes.number
|
|
57
|
+
]).description("Selected active value. This property makes the component a controlled one."),
|
|
58
|
+
children: import_ds_props_helpers.PropTypes.node.description("Dimsum AccordionItems to show."),
|
|
59
|
+
allowMultipleOpen: import_ds_props_helpers.PropTypes.bool.description("Allows multiple Dimsum AccordionItems to be open at the same time."),
|
|
60
|
+
onChange: import_ds_props_helpers.PropTypes.func.description("Callback function once the Dimsum Accordion changes.")
|
|
61
|
+
};
|
|
62
|
+
//# sourceMappingURL=propTypes.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/propTypes.ts", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { PropTypes } from '@elliemae/ds-props-helpers';\n\nexport const accordionItemPropTypes = {\n children: PropTypes.node.description('Dimsum AccordionItem content.').isRequired,\n title: PropTypes.string.description('Set a primary title.'),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n 'Dimsum AccordionItem value, this value should be unique.',\n ).isRequired,\n iconClosed: PropTypes.node.description('Custom Dimsum Icon when it is closed.'),\n iconOpened: PropTypes.node.description('Custom Dimsum Icon when it is open.'),\n secondaryTitle: PropTypes.string.description('Set a secondary title'),\n customActions: PropTypes.arrayOf(PropTypes.object)\n .description('Set Dimsum AccordionItem custom actions.')\n .deprecated({ version: '3.x' }),\n renderCustomActions: PropTypes.func\n .description(\n 'This property will render any JSX in the custom actions area. You can access to all references and active values within the props.',\n )\n .deprecated({ version: '3.x' }),\n};\n\nexport const accordionPropTypes = {\n containerProps: PropTypes.object.description('Adds props to the container.'),\n activeValue: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n PropTypes.string,\n PropTypes.number,\n ]).description('Selected active value. This property makes the component a controlled one.'),\n children: PropTypes.node.description('Dimsum AccordionItems to show.'),\n allowMultipleOpen: PropTypes.bool.description('Allows multiple Dimsum AccordionItems to be open at the same time.'),\n onChange: PropTypes.func.description('Callback function once the Dimsum Accordion changes.'),\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA0B;AAEnB,MAAM,yBAAyB;AAAA,EACpC,UAAU,kCAAU,KAAK,YAAY,+BAA+B,EAAE;AAAA,EACtE,OAAO,kCAAU,OAAO,YAAY,sBAAsB;AAAA,EAC1D,OAAO,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,EAAE;AAAA,IAC/D;AAAA,EACF,EAAE;AAAA,EACF,YAAY,kCAAU,KAAK,YAAY,uCAAuC;AAAA,EAC9E,YAAY,kCAAU,KAAK,YAAY,qCAAqC;AAAA,EAC5E,gBAAgB,kCAAU,OAAO,YAAY,uBAAuB;AAAA,EACpE,eAAe,kCAAU,QAAQ,kCAAU,MAAM,EAC9C,YAAY,0CAA0C,EACtD,WAAW,EAAE,SAAS,MAAM,CAAC;AAAA,EAChC,qBAAqB,kCAAU,KAC5B;AAAA,IACC;AAAA,EACF,EACC,WAAW,EAAE,SAAS,MAAM,CAAC;AAClC;AAEO,MAAM,qBAAqB;AAAA,EAChC,gBAAgB,kCAAU,OAAO,YAAY,8BAA8B;AAAA,EAC3E,aAAa,kCAAU,UAAU;AAAA,IAC/B,kCAAU,QAAQ,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,CAAC;AAAA,IAC3E,kCAAU;AAAA,IACV,kCAAU;AAAA,EACZ,CAAC,EAAE,YAAY,4EAA4E;AAAA,EAC3F,UAAU,kCAAU,KAAK,YAAY,gCAAgC;AAAA,EACrE,mBAAmB,kCAAU,KAAK,YAAY,oEAAoE;AAAA,EAClH,UAAU,kCAAU,KAAK,YAAY,sDAAsD;AAC7F;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|