@elliemae/ds-accordion 2.3.1 → 3.0.0-alpha.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. package/dist/cjs/DSAccordion.js +52 -0
  2. package/dist/cjs/DSAccordion.js.map +7 -0
  3. package/dist/cjs/DSAccordionCTX.js +46 -0
  4. package/dist/cjs/DSAccordionCTX.js.map +7 -0
  5. package/dist/cjs/DSAccordionDatatestid.js +42 -0
  6. package/dist/cjs/DSAccordionDatatestid.js.map +7 -0
  7. package/dist/cjs/DSAccordionTypes.js +27 -0
  8. package/dist/cjs/DSAccordionTypes.js.map +7 -0
  9. package/dist/cjs/config/useAccordion.js +73 -0
  10. package/dist/cjs/config/useAccordion.js.map +7 -0
  11. package/dist/cjs/config/useAccordionRefs.js +47 -0
  12. package/dist/cjs/config/useAccordionRefs.js.map +7 -0
  13. package/dist/cjs/defaultProps.js +64 -0
  14. package/dist/cjs/defaultProps.js.map +7 -0
  15. package/dist/cjs/index.js +37 -0
  16. package/dist/cjs/index.js.map +7 -0
  17. package/dist/cjs/parts/accordionContent/AccordionContent.js +66 -0
  18. package/dist/cjs/parts/accordionContent/AccordionContent.js.map +7 -0
  19. package/dist/cjs/parts/accordionItem/DSAccordionItem.js +211 -0
  20. package/dist/cjs/parts/accordionItem/DSAccordionItem.js.map +7 -0
  21. package/dist/cjs/parts/accordionItem/styles.js +143 -0
  22. package/dist/cjs/parts/accordionItem/styles.js.map +7 -0
  23. package/dist/cjs/parts/accordionItem/useAccordionItem.js +66 -0
  24. package/dist/cjs/parts/accordionItem/useAccordionItem.js.map +7 -0
  25. package/dist/cjs/propTypes.js +57 -0
  26. package/dist/cjs/propTypes.js.map +7 -0
  27. package/dist/esm/DSAccordion.js +23 -0
  28. package/dist/esm/DSAccordion.js.map +7 -0
  29. package/dist/esm/DSAccordionCTX.js +17 -0
  30. package/dist/esm/DSAccordionCTX.js.map +7 -0
  31. package/dist/esm/DSAccordionDatatestid.js +13 -0
  32. package/dist/esm/DSAccordionDatatestid.js.map +7 -0
  33. package/dist/esm/DSAccordionTypes.js +2 -0
  34. package/dist/esm/DSAccordionTypes.js.map +7 -0
  35. package/dist/esm/config/useAccordion.js +44 -0
  36. package/dist/esm/config/useAccordion.js.map +7 -0
  37. package/dist/esm/config/useAccordionRefs.js +18 -0
  38. package/dist/esm/config/useAccordionRefs.js.map +7 -0
  39. package/dist/esm/defaultProps.js +35 -0
  40. package/dist/esm/defaultProps.js.map +7 -0
  41. package/dist/esm/index.js +8 -0
  42. package/dist/esm/index.js.map +7 -0
  43. package/dist/esm/parts/accordionContent/AccordionContent.js +39 -0
  44. package/dist/esm/parts/accordionContent/AccordionContent.js.map +7 -0
  45. package/dist/esm/parts/accordionItem/DSAccordionItem.js +194 -0
  46. package/dist/esm/parts/accordionItem/DSAccordionItem.js.map +7 -0
  47. package/dist/esm/parts/accordionItem/styles.js +114 -0
  48. package/dist/esm/parts/accordionItem/styles.js.map +7 -0
  49. package/dist/esm/parts/accordionItem/useAccordionItem.js +37 -0
  50. package/dist/esm/parts/accordionItem/useAccordionItem.js.map +7 -0
  51. package/dist/esm/propTypes.js +28 -0
  52. package/dist/esm/propTypes.js.map +7 -0
  53. package/package.json +59 -49
  54. package/cjs/DSAccordion.js +0 -31
  55. package/cjs/DSAccordionCTX.js +0 -20
  56. package/cjs/DSAccordionDatatestid.js +0 -14
  57. package/cjs/DSAccordionTypes.js +0 -2
  58. package/cjs/config/useAccordion.js +0 -50
  59. package/cjs/config/useAccordionRefs.js +0 -40
  60. package/cjs/defaultProps.js +0 -54
  61. package/cjs/index.js +0 -14
  62. package/cjs/parts/accordionContent/AccordionContent.js +0 -41
  63. package/cjs/parts/accordionItem/DSAccordionItem.js +0 -206
  64. package/cjs/parts/accordionItem/styles.js +0 -149
  65. package/cjs/parts/accordionItem/useAccordionItem.js +0 -53
  66. package/cjs/propTypes.js +0 -26
  67. package/esm/DSAccordion.js +0 -21
  68. package/esm/DSAccordionCTX.js +0 -16
  69. package/esm/DSAccordionDatatestid.js +0 -10
  70. package/esm/DSAccordionTypes.js +0 -1
  71. package/esm/config/useAccordion.js +0 -46
  72. package/esm/config/useAccordionRefs.js +0 -32
  73. package/esm/defaultProps.js +0 -45
  74. package/esm/index.js +0 -2
  75. package/esm/parts/accordionContent/AccordionContent.js +0 -32
  76. package/esm/parts/accordionItem/DSAccordionItem.js +0 -193
  77. package/esm/parts/accordionItem/styles.js +0 -133
  78. package/esm/parts/accordionItem/useAccordionItem.js +0 -49
  79. package/esm/propTypes.js +0 -21
  80. package/types/DSAccordion.d.ts +0 -45
  81. package/types/DSAccordionCTX.d.ts +0 -3
  82. package/types/DSAccordionDatatestid.d.ts +0 -8
  83. package/types/DSAccordionTypes.d.ts +0 -137
  84. package/types/config/useAccordion.d.ts +0 -2
  85. package/types/config/useAccordionRefs.d.ts +0 -2
  86. package/types/defaultProps.d.ts +0 -3
  87. package/types/index.d.ts +0 -4
  88. package/types/parts/accordionContent/AccordionContent.d.ts +0 -2
  89. package/types/parts/accordionItem/DSAccordionItem.d.ts +0 -53
  90. package/types/parts/accordionItem/styles.d.ts +0 -10
  91. package/types/parts/accordionItem/useAccordionItem.d.ts +0 -2
  92. package/types/propTypes.d.ts +0 -73
  93. package/types/tests/Accordion.test.d.ts +0 -1
@@ -0,0 +1,211 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __defProps = Object.defineProperties;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
6
+ var __getOwnPropNames = Object.getOwnPropertyNames;
7
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
8
+ var __getProtoOf = Object.getPrototypeOf;
9
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
10
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
11
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
12
+ var __spreadValues = (a, b) => {
13
+ for (var prop in b || (b = {}))
14
+ if (__hasOwnProp.call(b, prop))
15
+ __defNormalProp(a, prop, b[prop]);
16
+ if (__getOwnPropSymbols)
17
+ for (var prop of __getOwnPropSymbols(b)) {
18
+ if (__propIsEnum.call(b, prop))
19
+ __defNormalProp(a, prop, b[prop]);
20
+ }
21
+ return a;
22
+ };
23
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
24
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
25
+ var __objRest = (source, exclude) => {
26
+ var target = {};
27
+ for (var prop in source)
28
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
29
+ target[prop] = source[prop];
30
+ if (source != null && __getOwnPropSymbols)
31
+ for (var prop of __getOwnPropSymbols(source)) {
32
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
33
+ target[prop] = source[prop];
34
+ }
35
+ return target;
36
+ };
37
+ var __export = (target, all) => {
38
+ for (var name in all)
39
+ __defProp(target, name, { get: all[name], enumerable: true });
40
+ };
41
+ var __reExport = (target, module2, copyDefault, desc) => {
42
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
43
+ for (let key of __getOwnPropNames(module2))
44
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
45
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
46
+ }
47
+ return target;
48
+ };
49
+ var __toESM = (module2, isNodeMode) => {
50
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
51
+ };
52
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
53
+ return (module2, temp) => {
54
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
55
+ };
56
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
57
+ var DSAccordionItem_exports = {};
58
+ __export(DSAccordionItem_exports, {
59
+ DSAccordionItem: () => DSAccordionItem,
60
+ DSAccordionItemWithSchema: () => DSAccordionItemWithSchema,
61
+ default: () => DSAccordionItem_default
62
+ });
63
+ var React = __toESM(require("react"));
64
+ var import_react = __toESM(require("react"));
65
+ var import_react_desc = require("react-desc");
66
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
67
+ var import_ds_button = require("@elliemae/ds-button");
68
+ var import_ds_popperjs = require("@elliemae/ds-popperjs");
69
+ var import_ds_utilities = require("@elliemae/ds-utilities");
70
+ var import_defaultProps = require("../../defaultProps");
71
+ var import_styles = require("./styles");
72
+ var import_propTypes = require("../../propTypes");
73
+ var import_useAccordionItem = require("./useAccordionItem");
74
+ var import_DSAccordionCTX = require("../../DSAccordionCTX");
75
+ var import_DSAccordionDatatestid = require("../../DSAccordionDatatestid");
76
+ const DSAccordionItem = (props) => {
77
+ const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_defaultProps.accordionItemDefaultProps);
78
+ const {
79
+ children,
80
+ title,
81
+ secondaryTitle,
82
+ customActions,
83
+ iconOpened: IconOpened,
84
+ iconClosed: IconClosed,
85
+ value,
86
+ disabled,
87
+ dsIndex,
88
+ renderCustomActions
89
+ } = propsWithDefaults;
90
+ const { handleOnClick, handleOnKeyDown, selected } = (0, import_useAccordionItem.useAccordionItem)({ value, disabled });
91
+ const {
92
+ allChildrenReferences,
93
+ actualActiveValue,
94
+ props: { isDSMobile }
95
+ } = (0, import_react.useContext)(import_DSAccordionCTX.DSAccordionContext);
96
+ const onKeyDownWithIndex = (0, import_react.useCallback)((e) => {
97
+ handleOnKeyDown(e, dsIndex);
98
+ }, [dsIndex, handleOnKeyDown]);
99
+ const [showPopover, setShowPopover] = (0, import_react.useState)(false);
100
+ const [referenceElement, setReferenceElement] = (0, import_react.useState)();
101
+ const CustomActionsContent = (0, import_react.useMemo)(() => {
102
+ if (!isDSMobile && customActions?.length > 0)
103
+ return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemCustomActions, null, customActions?.map((_a) => {
104
+ var _b = _a, { onClick, id } = _b, rest = __objRest(_b, ["onClick", "id"]);
105
+ return /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, __spreadProps(__spreadValues({
106
+ key: id,
107
+ onClick: (e) => {
108
+ e.stopPropagation();
109
+ if (onClick)
110
+ onClick(e);
111
+ }
112
+ }, rest), {
113
+ buttonType: import_ds_button.BUTTON_TYPE.SECONDARY
114
+ }));
115
+ }));
116
+ if (!isDSMobile && renderCustomActions)
117
+ return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemCustomActions, null, renderCustomActions({ allRefs: allChildrenReferences, actualActiveValue }));
118
+ return null;
119
+ }, [actualActiveValue, allChildrenReferences, customActions, isDSMobile, renderCustomActions]);
120
+ const { isShowingEllipsis: isPrimaryShowingEllipsis, setElement: setPrimaryElement } = (0, import_ds_utilities.useIsShowingEllipsis)();
121
+ const { isShowingEllipsis: isSecondaryShowingEllipsis, setElement: setSecondaryElement } = (0, import_ds_utilities.useIsShowingEllipsis)();
122
+ const handleOnFocus = (0, import_react.useCallback)(() => setShowPopover(isPrimaryShowingEllipsis || isSecondaryShowingEllipsis), [isPrimaryShowingEllipsis, isSecondaryShowingEllipsis]);
123
+ const handleOnBlur = (0, import_react.useCallback)(() => setShowPopover(false), []);
124
+ const Titles = (0, import_react.useMemo)(() => {
125
+ if (isPrimaryShowingEllipsis || isSecondaryShowingEllipsis)
126
+ return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styles.StyledPrimaryTitle, {
127
+ ref: setPrimaryElement,
128
+ id: `accordion_${title}id`,
129
+ disabled,
130
+ isDSMobile
131
+ }, title), !isDSMobile && secondaryTitle && /* @__PURE__ */ import_react.default.createElement(import_styles.StyledSecondaryTitle, {
132
+ ref: setSecondaryElement,
133
+ disabled
134
+ }, secondaryTitle), /* @__PURE__ */ import_react.default.createElement(import_ds_popperjs.DSPopperJS, {
135
+ referenceElement,
136
+ showPopover
137
+ }, /* @__PURE__ */ import_react.default.createElement("div", {
138
+ style: { maxWidth: 260, padding: 8, background: "white", display: "grid", gap: 8 }
139
+ }, /* @__PURE__ */ import_react.default.createElement("p", {
140
+ style: { margin: 0 }
141
+ }, title), /* @__PURE__ */ import_react.default.createElement("p", {
142
+ style: { margin: 0 }
143
+ }, " ", secondaryTitle))));
144
+ return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styles.StyledPrimaryTitle, {
145
+ ref: setPrimaryElement,
146
+ id: `accordion_${title}id`,
147
+ disabled,
148
+ isDSMobile
149
+ }, title), !isDSMobile && secondaryTitle && /* @__PURE__ */ import_react.default.createElement(import_styles.StyledSecondaryTitle, {
150
+ ref: setSecondaryElement,
151
+ disabled
152
+ }, secondaryTitle));
153
+ }, [
154
+ disabled,
155
+ isDSMobile,
156
+ isPrimaryShowingEllipsis,
157
+ isSecondaryShowingEllipsis,
158
+ referenceElement,
159
+ secondaryTitle,
160
+ setPrimaryElement,
161
+ setSecondaryElement,
162
+ showPopover,
163
+ title
164
+ ]);
165
+ return /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemContainer, {
166
+ "data-testid": import_DSAccordionDatatestid.DSAccordionDataTestid.ITEM.CONTAINER
167
+ }, /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemHeaderContainer, {
168
+ disabled
169
+ }, /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemHeader, {
170
+ withCustomActions: (customActions?.length > 0 || renderCustomActions !== void 0) && !isDSMobile,
171
+ withSecondaryTitle: secondaryTitle,
172
+ onClick: handleOnClick,
173
+ tabIndex: !disabled ? 0 : void 0,
174
+ disabled,
175
+ "data-disabled": disabled,
176
+ ref: allChildrenReferences[dsIndex],
177
+ onKeyDown: onKeyDownWithIndex,
178
+ isDSMobile,
179
+ "data-testid": import_DSAccordionDatatestid.DSAccordionDataTestid.ITEM.HEADER,
180
+ id: `ds-accordion-header-${value}`,
181
+ "aria-expanded": selected,
182
+ "aria-disabled": disabled,
183
+ "aria-controls": `ds-accordion-content-${value}`,
184
+ onFocus: handleOnFocus,
185
+ onBlur: handleOnBlur
186
+ }, /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemAddon, {
187
+ disabled,
188
+ isDSMobile
189
+ }, selected ? /* @__PURE__ */ import_react.default.createElement(IconOpened, {
190
+ isDSMobile
191
+ }) : /* @__PURE__ */ import_react.default.createElement(IconClosed, {
192
+ isDSMobile
193
+ })), /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemTitles, {
194
+ onMouseEnter: handleOnFocus,
195
+ onMouseLeave: handleOnBlur,
196
+ isDSMobile,
197
+ ref: setReferenceElement
198
+ }, Titles)), CustomActionsContent), selected && /* @__PURE__ */ import_react.default.createElement(import_styles.StyledItemContent, {
199
+ "data-testid": import_DSAccordionDatatestid.DSAccordionDataTestid.ITEM.CONTENT,
200
+ "aria-labelledby": `ds-accordion-header-${value}`,
201
+ role: "region",
202
+ isDSMobile,
203
+ id: `ds-accordion-content-${value}`
204
+ }, children));
205
+ };
206
+ DSAccordionItem.propTypes = import_propTypes.accordionItemPropTypes;
207
+ const DSAccordionItemWithSchema = (0, import_react_desc.describe)(DSAccordionItem);
208
+ DSAccordionItemWithSchema.propTypes = import_propTypes.accordionItemPropTypes;
209
+ var DSAccordionItem_default = DSAccordionItem;
210
+ module.exports = __toCommonJS(DSAccordionItem_exports);
211
+ //# sourceMappingURL=DSAccordionItem.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/parts/accordionItem/DSAccordionItem.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useState, useContext, useCallback, useMemo } from 'react';\nimport { describe } from 'react-desc';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { DSButton, BUTTON_TYPE } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { useIsShowingEllipsis } from '@elliemae/ds-utilities';\nimport { accordionItemDefaultProps } from '../../defaultProps';\nimport {\n StyledItemAddon,\n StyledItemContainer,\n StyledItemContent,\n StyledItemCustomActions,\n StyledItemHeader,\n StyledItemHeaderContainer,\n StyledItemTitles,\n StyledPrimaryTitle,\n StyledSecondaryTitle,\n} from './styles';\nimport { accordionItemPropTypes } from '../../propTypes';\nimport { useAccordionItem } from './useAccordionItem';\nimport { DSAccordionContext } from '../../DSAccordionCTX';\nimport { DSAccordionDataTestid } from '../../DSAccordionDatatestid';\nimport type { DSAccordionItemPropsT, DSAccordionItemPropsWithDefaultsT } from '../../DSAccordionTypes';\n\nconst DSAccordionItem = (props: DSAccordionItemPropsT): JSX.Element => {\n const propsWithDefaults = useMemoMergePropsWithDefault(\n props,\n accordionItemDefaultProps,\n ) as DSAccordionItemPropsWithDefaultsT;\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 } = propsWithDefaults;\n\n const { handleOnClick, handleOnKeyDown, selected } = useAccordionItem({ value, disabled });\n const {\n allChildrenReferences,\n actualActiveValue,\n props: { isDSMobile },\n } = useContext(DSAccordionContext);\n\n const onKeyDownWithIndex = useCallback(\n (e: React.KeyboardEvent) => {\n handleOnKeyDown(e, dsIndex);\n },\n [dsIndex, handleOnKeyDown],\n );\n\n const [showPopover, setShowPopover] = useState(false);\n const [referenceElement, setReferenceElement] = useState();\n\n const CustomActionsContent = useMemo(() => {\n if (!isDSMobile && customActions?.length > 0)\n return (\n <StyledItemCustomActions>\n {customActions?.map(({ onClick, id, ...rest }) => (\n <DSButton\n key={id}\n onClick={(e: React.MouseEvent) => {\n e.stopPropagation();\n if (onClick) onClick(e);\n }}\n {...rest}\n buttonType={BUTTON_TYPE.SECONDARY}\n />\n ))}\n </StyledItemCustomActions>\n );\n\n if (!isDSMobile && renderCustomActions)\n return (\n <StyledItemCustomActions>\n {renderCustomActions({ allRefs: allChildrenReferences, actualActiveValue })}\n </StyledItemCustomActions>\n );\n return null;\n }, [actualActiveValue, allChildrenReferences, customActions, isDSMobile, renderCustomActions]);\n\n const { isShowingEllipsis: isPrimaryShowingEllipsis, setElement: setPrimaryElement } = useIsShowingEllipsis();\n\n const { isShowingEllipsis: isSecondaryShowingEllipsis, setElement: setSecondaryElement } = useIsShowingEllipsis();\n\n const handleOnFocus = useCallback(\n () => setShowPopover(isPrimaryShowingEllipsis || isSecondaryShowingEllipsis),\n [isPrimaryShowingEllipsis, isSecondaryShowingEllipsis],\n );\n\n const handleOnBlur = useCallback(() => setShowPopover(false), []);\n\n const Titles = useMemo(() => {\n if (isPrimaryShowingEllipsis || isSecondaryShowingEllipsis)\n return (\n <>\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n id={`accordion_${title}id`}\n disabled={disabled}\n isDSMobile={isDSMobile}\n >\n {title}\n </StyledPrimaryTitle>\n {!isDSMobile && secondaryTitle && (\n <StyledSecondaryTitle ref={setSecondaryElement} disabled={disabled}>\n {secondaryTitle}\n </StyledSecondaryTitle>\n )}\n <DSPopperJS referenceElement={referenceElement} showPopover={showPopover}>\n <div style={{ maxWidth: 260, padding: 8, background: 'white', display: 'grid', gap: 8 }}>\n <p style={{ margin: 0 }}>{title}</p>\n <p style={{ margin: 0 }}> {secondaryTitle}</p>\n </div>\n </DSPopperJS>\n </>\n );\n\n return (\n <>\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n id={`accordion_${title}id`}\n disabled={disabled}\n isDSMobile={isDSMobile}\n >\n {title}\n </StyledPrimaryTitle>\n {!isDSMobile && secondaryTitle && (\n <StyledSecondaryTitle ref={setSecondaryElement} disabled={disabled}>\n {secondaryTitle}\n </StyledSecondaryTitle>\n )}\n </>\n );\n }, [\n disabled,\n isDSMobile,\n isPrimaryShowingEllipsis,\n isSecondaryShowingEllipsis,\n referenceElement,\n secondaryTitle,\n setPrimaryElement,\n setSecondaryElement,\n showPopover,\n title,\n ]);\n\n return (\n <StyledItemContainer data-testid={DSAccordionDataTestid.ITEM.CONTAINER}>\n <StyledItemHeaderContainer disabled={disabled}>\n <StyledItemHeader\n withCustomActions={(customActions?.length > 0 || renderCustomActions !== undefined) && !isDSMobile}\n withSecondaryTitle={secondaryTitle}\n onClick={handleOnClick}\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 onFocus={handleOnFocus}\n onBlur={handleOnBlur}\n >\n <StyledItemAddon disabled={disabled} isDSMobile={isDSMobile}>\n {selected ? <IconOpened isDSMobile={isDSMobile} /> : <IconClosed isDSMobile={isDSMobile} />}\n </StyledItemAddon>\n <StyledItemTitles\n onMouseEnter={handleOnFocus}\n onMouseLeave={handleOnBlur}\n isDSMobile={isDSMobile}\n ref={setReferenceElement}\n >\n {Titles}\n </StyledItemTitles>\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 >\n {children}\n </StyledItemContent>\n )}\n </StyledItemContainer>\n );\n};\n\nDSAccordionItem.propTypes = accordionItemPropTypes;\n\nconst DSAccordionItemWithSchema = describe(DSAccordionItem);\nDSAccordionItemWithSchema.propTypes = accordionItemPropTypes;\n\nexport { DSAccordionItem, DSAccordionItemWithSchema };\nexport default DSAccordionItem;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
@@ -0,0 +1,143 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var styles_exports = {};
29
+ __export(styles_exports, {
30
+ StyledItemAddon: () => StyledItemAddon,
31
+ StyledItemContainer: () => StyledItemContainer,
32
+ StyledItemContent: () => StyledItemContent,
33
+ StyledItemCustomActions: () => StyledItemCustomActions,
34
+ StyledItemHeader: () => StyledItemHeader,
35
+ StyledItemHeaderContainer: () => StyledItemHeaderContainer,
36
+ StyledItemTitles: () => StyledItemTitles,
37
+ StyledPrimaryTitle: () => StyledPrimaryTitle,
38
+ StyledSecondaryTitle: () => StyledSecondaryTitle
39
+ });
40
+ var React = __toESM(require("react"));
41
+ var import_styled_components = __toESM(require("styled-components"));
42
+ const StyledItemContainer = import_styled_components.default.div`
43
+ display: grid;
44
+ grid-template-rows: auto auto;
45
+ border-bottom: 1px solid ${({ theme }) => theme.colors.neutral[200]};
46
+ align-items: center;
47
+ `;
48
+ const StyledItemHeader = import_styled_components.default.button`
49
+ display: flex;
50
+ height: ${({ theme, withSecondaryTitle }) => withSecondaryTitle ? theme.space.m : theme.space.s};
51
+ width: 100%;
52
+ align-items: center;
53
+ border: none;
54
+ outline: none;
55
+ background: none;
56
+
57
+ &:hover {
58
+ cursor: ${({ disabled }) => disabled ? "not-allowed" : "pointer"};
59
+ }
60
+
61
+ padding: ${({ isDSMobile }) => isDSMobile ? `0 16px` : `0`};
62
+
63
+ ${({ isDSMobile }) => isDSMobile ? `flex-direction: row-reverse;` : ``}
64
+
65
+ &:focus {
66
+ &:after {
67
+ position: absolute;
68
+ content: '';
69
+ left: 0;
70
+ top: 0;
71
+ width: 100%;
72
+ height: 100%;
73
+ border-radius: 2px;
74
+ border: 2px solid ${({ theme }) => theme.colors.brand[700]};
75
+ pointer-events: none;
76
+ }
77
+ }
78
+ `;
79
+ const StyledItemContent = import_styled_components.default.div`
80
+ margin: ${({ isDSMobile }) => isDSMobile ? `16px 16px 24px 16px` : `16px 16px 16px 32px`};
81
+ grid-column: 1/2;
82
+ `;
83
+ const StyledItemAddon = import_styled_components.default.div`
84
+ ${({ theme, isDSMobile }) => !isDSMobile ? `padding: 0 ${theme.space.xxs};` : ``}
85
+ height: 100%;
86
+ width: ${({ theme }) => theme.space.s};
87
+ display: grid;
88
+ place-items: center;
89
+
90
+ & .em-ds-icon svg {
91
+ fill: ${({ disabled, theme }) => disabled ? theme.colors.neutral[200] : theme.colors.brand[800]};
92
+ }
93
+ `;
94
+ const StyledItemTitles = import_styled_components.default.div`
95
+ display: grid;
96
+ grid-template-columns: 100%;
97
+ width: 100%;
98
+ align-content: center;
99
+ `;
100
+ const StyledPrimaryTitle = import_styled_components.default.div`
101
+ margin: 0;
102
+ font-size: 16px;
103
+ color: ${({ disabled, theme }) => disabled ? theme.colors.neutral[200] : theme.colors.neutral[700]};
104
+ font-weight: ${({ theme, isDSMobile }) => isDSMobile ? theme.fontWeights.regular : theme.fontWeights.regular};
105
+ text-overflow: ellipsis;
106
+ overflow: hidden;
107
+ height: ${({ theme }) => theme.space.xs};
108
+ width: 100%;
109
+ text-align: left;
110
+ display: block;
111
+ white-space: nowrap;
112
+ `;
113
+ const StyledSecondaryTitle = import_styled_components.default.span`
114
+ margin: 0;
115
+ font-size: ${({ theme }) => theme.fontSizes.label[200]};
116
+ text-align: left;
117
+ color: ${({ disabled, theme }) => disabled ? theme.colors.neutral[200] : theme.colors.neutral[500]};
118
+ text-overflow: ellipsis;
119
+ overflow: hidden;
120
+ height: ${({ theme }) => theme.space.xs};
121
+ width: 100%;
122
+ text-align: left;
123
+ display: block;
124
+ white-space: nowrap;
125
+ `;
126
+ const StyledItemCustomActions = import_styled_components.default.div`
127
+ display: grid;
128
+ grid-auto-flow: column;
129
+ grid-gap: ${({ theme }) => theme.space.xxs};
130
+ margin: 0 ${({ theme }) => theme.space.xs};
131
+ justify-content: flex-end;
132
+ `;
133
+ const StyledItemHeaderContainer = import_styled_components.default.div`
134
+ display: grid;
135
+ grid-template-columns: auto max-content;
136
+ place-items: center;
137
+ position: relative;
138
+ &:hover {
139
+ ${({ disabled, theme }) => !disabled ? `background: ${theme.colors.brand[200]};` : ``}
140
+ }
141
+ `;
142
+ module.exports = __toCommonJS(styles_exports);
143
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/parts/accordionItem/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import styled from 'styled-components';\nimport type {\n StyledItemAddonPropsT,\n StyledItemHeaderPropsT,\n StyledItemTitlesPropsT,\n StyledPrimaryTitlePropsT,\n StyledSecondaryTitlePropsT,\n StyledItemContentPropsT,\n StyledItemHeaderContainerPropsT,\n} from '../../DSAccordionTypes';\n\nexport const StyledItemContainer = styled.div`\n display: grid;\n grid-template-rows: auto auto;\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral[200]};\n align-items: center;\n`;\n\nexport const StyledItemHeader = styled.button<StyledItemHeaderPropsT>`\n display: flex;\n height: ${({ theme, withSecondaryTitle }) => (withSecondaryTitle ? theme.space.m : theme.space.s)};\n width: 100%;\n align-items: center;\n border: none;\n outline: none;\n background: none;\n\n &:hover {\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n }\n\n padding: ${({ isDSMobile }) => (isDSMobile ? `0 16px` : `0`)};\n\n ${({ isDSMobile }) => (isDSMobile ? `flex-direction: row-reverse;` : ``)}\n\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<StyledItemContentPropsT>`\n margin: ${({ isDSMobile }) => (isDSMobile ? `16px 16px 24px 16px` : `16px 16px 16px 32px`)};\n grid-column: 1/2;\n`;\n\nexport const StyledItemAddon = styled.div<StyledItemAddonPropsT>`\n ${({ theme, isDSMobile }) => (!isDSMobile ? `padding: 0 ${theme.space.xxs};` : ``)}\n height: 100%;\n width: ${({ theme }) => theme.space.s};\n display: grid;\n place-items: center;\n\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<StyledItemTitlesPropsT>`\n display: grid;\n grid-template-columns: 100%;\n width: 100%;\n align-content: center;\n`;\n\nexport const StyledPrimaryTitle = styled.div<StyledPrimaryTitlePropsT>`\n margin: 0;\n font-size: 16px;\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[200] : theme.colors.neutral[700])};\n font-weight: ${({ theme, isDSMobile }) => (isDSMobile ? theme.fontWeights.regular : theme.fontWeights.regular)};\n text-overflow: ellipsis;\n overflow: hidden;\n height: ${({ theme }) => theme.space.xs};\n width: 100%;\n text-align: left;\n display: block;\n white-space: nowrap;\n`;\n\nexport const StyledSecondaryTitle = styled.span<StyledSecondaryTitlePropsT>`\n margin: 0;\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n text-align: left;\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[200] : theme.colors.neutral[500])};\n text-overflow: ellipsis;\n overflow: hidden;\n height: ${({ theme }) => theme.space.xs};\n width: 100%;\n text-align: left;\n display: block;\n white-space: nowrap;\n`;\n\nexport const StyledItemCustomActions = styled.div`\n display: grid;\n grid-auto-flow: column;\n grid-gap: ${({ theme }) => theme.space.xxs};\n margin: 0 ${({ theme }) => theme.space.xs};\n justify-content: flex-end;\n`;\n\nexport const StyledItemHeaderContainer = styled.div<StyledItemHeaderContainerPropsT>`\n display: grid;\n grid-template-columns: auto max-content;\n place-items: center;\n position: relative;\n &:hover {\n ${({ disabled, theme }) => (!disabled ? `background: ${theme.colors.brand[200]};` : ``)}\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAmB;AAWZ,MAAM,sBAAsB,iCAAO;AAAA;AAAA;AAAA,6BAGb,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI1D,MAAM,mBAAmB,iCAAO;AAAA;AAAA,YAE3B,CAAC,EAAE,OAAO,yBAA0B,qBAAqB,MAAM,MAAM,IAAI,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAQnF,CAAC,EAAE,eAAgB,WAAW,gBAAgB;AAAA;AAAA;AAAA,aAG/C,CAAC,EAAE,iBAAkB,aAAa,WAAW;AAAA;AAAA,IAEtD,CAAC,EAAE,iBAAkB,aAAa,iCAAiC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAW7C,CAAC,EAAE,YAAY,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAMrD,MAAM,oBAAoB,iCAAO;AAAA,YAC5B,CAAC,EAAE,iBAAkB,aAAa,wBAAwB;AAAA;AAAA;AAI/D,MAAM,kBAAkB,iCAAO;AAAA,IAClC,CAAC,EAAE,OAAO,iBAAkB,CAAC,aAAa,cAAc,MAAM,MAAM,SAAS;AAAA;AAAA,WAEtE,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,YAK1B,CAAC,EAAE,UAAU,YAAa,WAAW,MAAM,OAAO,QAAQ,OAAO,MAAM,OAAO,MAAM;AAAA;AAAA;AAIzF,MAAM,mBAAmB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhC,MAAM,qBAAqB,iCAAO;AAAA;AAAA;AAAA,WAG9B,CAAC,EAAE,UAAU,YAAa,WAAW,MAAM,OAAO,QAAQ,OAAO,MAAM,OAAO,QAAQ;AAAA,iBAChF,CAAC,EAAE,OAAO,iBAAkB,aAAa,MAAM,YAAY,UAAU,MAAM,YAAY;AAAA;AAAA;AAAA,YAG5F,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhC,MAAM,uBAAuB,iCAAO;AAAA;AAAA,eAE5B,CAAC,EAAE,YAAY,MAAM,UAAU,MAAM;AAAA;AAAA,WAEzC,CAAC,EAAE,UAAU,YAAa,WAAW,MAAM,OAAO,QAAQ,OAAO,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,YAGrF,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhC,MAAM,0BAA0B,iCAAO;AAAA;AAAA;AAAA,cAGhC,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA,cAC3B,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAIlC,MAAM,4BAA4B,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAM1C,CAAC,EAAE,UAAU,YAAa,CAAC,WAAW,eAAe,MAAM,OAAO,MAAM,UAAU;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,66 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var useAccordionItem_exports = {};
29
+ __export(useAccordionItem_exports, {
30
+ useAccordionItem: () => useAccordionItem
31
+ });
32
+ var React = __toESM(require("react"));
33
+ var import_react = require("react");
34
+ var import_DSAccordionCTX = require("../../DSAccordionCTX");
35
+ const useAccordionItem = ({ value, disabled }) => {
36
+ const { actualActiveValue, setActiveValues, focusableChildrenReferences } = (0, import_react.useContext)(import_DSAccordionCTX.DSAccordionContext);
37
+ const selected = (0, import_react.useMemo)(() => {
38
+ if (Array.isArray(actualActiveValue)) {
39
+ return actualActiveValue.some((currentValue) => currentValue === value);
40
+ }
41
+ return value === actualActiveValue;
42
+ }, [actualActiveValue, value]);
43
+ const handleOnClick = (0, import_react.useCallback)((e) => {
44
+ if (!disabled)
45
+ setActiveValues(value, e);
46
+ }, [disabled, setActiveValues, value]);
47
+ const handleOnKeyDown = (0, import_react.useCallback)((e, _dsIndex) => {
48
+ if (!disabled && e.key === "ArrowDown") {
49
+ const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);
50
+ if (focusableChildrenReferences[currentIndex + 1]?.ref?.current)
51
+ focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();
52
+ }
53
+ if (!disabled && e.key === "ArrowUp") {
54
+ const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);
55
+ if (focusableChildrenReferences[currentIndex - 1]?.ref?.current)
56
+ focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();
57
+ }
58
+ }, [disabled, focusableChildrenReferences]);
59
+ return {
60
+ handleOnClick,
61
+ handleOnKeyDown,
62
+ selected
63
+ };
64
+ };
65
+ module.exports = __toCommonJS(useAccordionItem_exports);
66
+ //# sourceMappingURL=useAccordionItem.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/parts/accordionItem/useAccordionItem.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import React, { useCallback, useContext, useMemo } from 'react';\nimport { DSAccordionContext } from '../../DSAccordionCTX';\nimport type { UseAccordionPropsT, UseAccordionItemReturnTypeT } from '../../DSAccordionTypes';\n\nexport const useAccordionItem = ({ value, disabled }: UseAccordionPropsT): 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 }\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 }\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;ACAA,YAAuB;ADAvB,mBAAwD;AACxD,4BAAmC;AAG5B,MAAM,mBAAmB,CAAC,EAAE,OAAO,eAAgE;AACxG,QAAM,EAAE,mBAAmB,iBAAiB,gCAAgC,6BAAW;AAEvF,QAAM,WAAW,0BAAQ,MAAM;AAC7B,QAAI,MAAM,QAAQ,oBAAoB;AACpC,aAAO,kBAAkB,KAAK,CAAC,iBAAiB,iBAAiB;AAAA;AAEnE,WAAO,UAAU;AAAA,KAChB,CAAC,mBAAmB;AAEvB,QAAM,gBAAgB,8BACpB,CAAC,MAAwB;AACvB,QAAI,CAAC;AAAU,sBAAgB,OAAO;AAAA,KAExC,CAAC,UAAU,iBAAiB;AAG9B,QAAM,kBAAkB,8BACtB,CAAC,GAAwB,aAAqB;AAC5C,QAAI,CAAC,YAAY,EAAE,QAAQ,aAAa;AACtC,YAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU;AACpF,UAAI,4BAA4B,eAAe,IAAI,KAAK;AACtD,oCAA4B,eAAe,IAAI,KAAK,SAAS;AAAA;AAGjE,QAAI,CAAC,YAAY,EAAE,QAAQ,WAAW;AACpC,YAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU;AACpF,UAAI,4BAA4B,eAAe,IAAI,KAAK;AACtD,oCAA4B,eAAe,IAAI,KAAK,SAAS;AAAA;AAAA,KAGnE,CAAC,UAAU;AAGb,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,57 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var propTypes_exports = {};
29
+ __export(propTypes_exports, {
30
+ accordionItemPropTypes: () => accordionItemPropTypes,
31
+ accordionPropTypes: () => accordionPropTypes
32
+ });
33
+ var React = __toESM(require("react"));
34
+ var import_react_desc = require("react-desc");
35
+ const accordionItemPropTypes = {
36
+ children: import_react_desc.PropTypes.node.description("Dimsum AccordionItem content.").isRequired,
37
+ title: import_react_desc.PropTypes.string.description("Set a primary title."),
38
+ value: import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.number]).description("Dimsum AccordionItem value, this value should be unique.").isRequired,
39
+ iconClosed: import_react_desc.PropTypes.node.description("Custom Dimsum Icon when it is closed."),
40
+ iconOpened: import_react_desc.PropTypes.node.description("Custom Dimsum Icon when it is open."),
41
+ secondaryTitle: import_react_desc.PropTypes.string.description("Set a secondary title"),
42
+ customActions: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.object).description("Set Dimsum AccordionItem custom actions."),
43
+ renderCustomActions: import_react_desc.PropTypes.func.description("This property will render any JSX in the custom actions area. You can access to all references and active values within the props.")
44
+ };
45
+ const accordionPropTypes = {
46
+ containerProps: import_react_desc.PropTypes.object.description("Adds props to the container."),
47
+ activeValue: import_react_desc.PropTypes.oneOfType([
48
+ import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.number])),
49
+ import_react_desc.PropTypes.string,
50
+ import_react_desc.PropTypes.number
51
+ ]).description("Selected active value. This property makes the component a controlled one."),
52
+ children: import_react_desc.PropTypes.node.description("Dimsum AccordionItems to show."),
53
+ allowMultipleOpen: import_react_desc.PropTypes.bool.description("Allows multiple Dimsum AccordionItems to be open at the same time."),
54
+ onChange: import_react_desc.PropTypes.func.description("Callback function once the Dimsum Accordion changes.")
55
+ };
56
+ module.exports = __toCommonJS(propTypes_exports);
57
+ //# sourceMappingURL=propTypes.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/propTypes.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import { PropTypes } from 'react-desc';\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).description('Set Dimsum AccordionItem custom actions.'),\n renderCustomActions: PropTypes.func.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};\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;ACAA,YAAuB;ADAvB,wBAA0B;AAEnB,MAAM,yBAAyB;AAAA,EACpC,UAAU,4BAAU,KAAK,YAAY,iCAAiC;AAAA,EACtE,OAAO,4BAAU,OAAO,YAAY;AAAA,EACpC,OAAO,4BAAU,UAAU,CAAC,4BAAU,QAAQ,4BAAU,SAAS,YAC/D,4DACA;AAAA,EACF,YAAY,4BAAU,KAAK,YAAY;AAAA,EACvC,YAAY,4BAAU,KAAK,YAAY;AAAA,EACvC,gBAAgB,4BAAU,OAAO,YAAY;AAAA,EAC7C,eAAe,4BAAU,QAAQ,4BAAU,QAAQ,YAAY;AAAA,EAC/D,qBAAqB,4BAAU,KAAK,YAClC;AAAA;AAIG,MAAM,qBAAqB;AAAA,EAChC,gBAAgB,4BAAU,OAAO,YAAY;AAAA,EAC7C,aAAa,4BAAU,UAAU;AAAA,IAC/B,4BAAU,QAAQ,4BAAU,UAAU,CAAC,4BAAU,QAAQ,4BAAU;AAAA,IACnE,4BAAU;AAAA,IACV,4BAAU;AAAA,KACT,YAAY;AAAA,EACf,UAAU,4BAAU,KAAK,YAAY;AAAA,EACrC,mBAAmB,4BAAU,KAAK,YAAY;AAAA,EAC9C,UAAU,4BAAU,KAAK,YAAY;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,23 @@
1
+ import * as React from "react";
2
+ import React2 from "react";
3
+ import { describe } from "react-desc";
4
+ import { AccordionContent } from "./parts/accordionContent/AccordionContent";
5
+ import { useAccordion } from "./config/useAccordion";
6
+ import { DSAccordionContext } from "./DSAccordionCTX";
7
+ import { accordionPropTypes } from "./propTypes";
8
+ const DSAccordion = (props) => {
9
+ const ctx = useAccordion(props);
10
+ return /* @__PURE__ */ React2.createElement(DSAccordionContext.Provider, {
11
+ value: ctx
12
+ }, /* @__PURE__ */ React2.createElement(AccordionContent, null));
13
+ };
14
+ DSAccordion.propTypes = accordionPropTypes;
15
+ const DSAccordionWithSchema = describe(DSAccordion);
16
+ DSAccordionWithSchema.propTypes = accordionPropTypes;
17
+ var DSAccordion_default = DSAccordion;
18
+ export {
19
+ DSAccordion,
20
+ DSAccordionWithSchema,
21
+ DSAccordion_default as default
22
+ };
23
+ //# sourceMappingURL=DSAccordion.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSAccordion.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe } from 'react-desc';\nimport { AccordionContent } from './parts/accordionContent/AccordionContent';\nimport { useAccordion } from './config/useAccordion';\nimport { DSAccordionContext } from './DSAccordionCTX';\nimport { accordionPropTypes } from './propTypes';\nimport type { DSAccordionPropsT } from './DSAccordionTypes';\n\nconst DSAccordion = (props: DSAccordionPropsT): JSX.Element => {\n const ctx = useAccordion(props);\n\n return (\n <DSAccordionContext.Provider value={ctx}>\n <AccordionContent />\n </DSAccordionContext.Provider>\n );\n};\n\nDSAccordion.propTypes = accordionPropTypes;\nconst DSAccordionWithSchema = describe(DSAccordion);\nDSAccordionWithSchema.propTypes = accordionPropTypes;\n\nexport { DSAccordion, DSAccordionWithSchema };\n\nexport default DSAccordion;\n"],
5
+ "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAGA,MAAM,cAAc,CAAC,UAA0C;AAC7D,QAAM,MAAM,aAAa;AAEzB,SACE,qCAAC,mBAAmB,UAApB;AAAA,IAA6B,OAAO;AAAA,KAClC,qCAAC,kBAAD;AAAA;AAKN,YAAY,YAAY;AACxB,MAAM,wBAAwB,SAAS;AACvC,sBAAsB,YAAY;AAIlC,IAAO,sBAAQ;",
6
+ "names": []
7
+ }
@@ -0,0 +1,17 @@
1
+ import * as React from "react";
2
+ import { createContext } from "react";
3
+ import { defaultProps } from "./defaultProps";
4
+ const noop = () => {
5
+ };
6
+ const defaultContext = {
7
+ props: defaultProps,
8
+ actualActiveValue: [],
9
+ setActiveValues: noop,
10
+ focusableChildrenReferences: [],
11
+ allChildrenReferences: {}
12
+ };
13
+ const DSAccordionContext = createContext(defaultContext);
14
+ export {
15
+ DSAccordionContext
16
+ };
17
+ //# sourceMappingURL=DSAccordionCTX.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSAccordionCTX.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext } from 'react';\nimport { defaultProps } from './defaultProps';\nimport type { DSAccordionContextT } from './DSAccordionTypes';\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = (): void => {};\n\nconst defaultContext = {\n props: defaultProps,\n actualActiveValue: [],\n setActiveValues: noop,\n focusableChildrenReferences: [],\n allChildrenReferences: {},\n};\n\nexport const DSAccordionContext = createContext<DSAccordionContextT>(defaultContext);\n"],
5
+ "mappings": "AAAA;ACAA;AACA;AAIA,MAAM,OAAO,MAAY;AAAA;AAEzB,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,6BAA6B;AAAA,EAC7B,uBAAuB;AAAA;AAGlB,MAAM,qBAAqB,cAAmC;",
6
+ "names": []
7
+ }
@@ -0,0 +1,13 @@
1
+ import * as React from "react";
2
+ const DSAccordionDataTestid = {
3
+ ITEM: {
4
+ CONTENT: "ds-accordion_item-content",
5
+ HEADER: "ds-accordion_item-header",
6
+ CONTAINER: "ds-accordion_item"
7
+ },
8
+ GROUP: "ds-accordion_group"
9
+ };
10
+ export {
11
+ DSAccordionDataTestid
12
+ };
13
+ //# sourceMappingURL=DSAccordionDatatestid.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSAccordionDatatestid.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSAccordionDataTestid = {\n ITEM: {\n CONTENT: 'ds-accordion_item-content',\n HEADER: 'ds-accordion_item-header',\n CONTAINER: 'ds-accordion_item',\n },\n GROUP: 'ds-accordion_group',\n};\n"],
5
+ "mappings": "AAAA;ACAO,MAAM,wBAAwB;AAAA,EACnC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,WAAW;AAAA;AAAA,EAEb,OAAO;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ import * as React from "react";
2
+ //# sourceMappingURL=DSAccordionTypes.js.map