etudes 3.7.1 → 3.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/Accordion.d.ts +62 -36
- package/lib/Accordion.js +32 -37
- package/lib/Accordion.js.map +1 -1
- package/lib/Dropdown.d.ts +17 -8
- package/lib/Dropdown.js +27 -28
- package/lib/Dropdown.js.map +1 -1
- package/lib/List.d.ts +40 -25
- package/lib/List.js +41 -44
- package/lib/List.js.map +1 -1
- package/lib/hooks/usePrevious.d.ts +16 -3
- package/lib/hooks/usePrevious.js +7 -5
- package/lib/hooks/usePrevious.js.map +1 -1
- package/package.json +1 -1
package/lib/Accordion.d.ts
CHANGED
|
@@ -1,18 +1,26 @@
|
|
|
1
1
|
import React, { type ComponentType, type HTMLAttributes, type PropsWithChildren, type ReactElement, type Ref } from 'react';
|
|
2
|
-
import { type ListItemProps, type ListProps } from './List';
|
|
3
|
-
export type
|
|
2
|
+
import { type ListItemProps, type ListOrientation, type ListProps, type ListSelectionMode } from './List';
|
|
3
|
+
export type AccordionSelection = Record<number, number[]>;
|
|
4
|
+
export type AccordionSection<T> = Pick<ListProps<T>, 'isSelectionTogglable' | 'itemLength' | 'itemPadding' | 'items' | 'layout' | 'numSegments'> & {
|
|
5
|
+
/**
|
|
6
|
+
* Label for the header.
|
|
7
|
+
*/
|
|
4
8
|
label: string;
|
|
5
|
-
|
|
9
|
+
/**
|
|
10
|
+
* Maximum number of visible rows (if section orientation is `vertical`) or
|
|
11
|
+
* columns (if section orientation is `horizontal`). If number of rows exceeds
|
|
12
|
+
* the number of visible, a scrollbar will be put in place.
|
|
13
|
+
*/
|
|
14
|
+
maxVisible?: number;
|
|
6
15
|
};
|
|
7
|
-
export type AccordionSelection = Record<number, number[]>;
|
|
8
16
|
export type AccordionItemProps<T> = ListItemProps<T>;
|
|
9
|
-
export type AccordionHeaderProps<I, S extends
|
|
17
|
+
export type AccordionHeaderProps<I, S extends AccordionSection<I> = AccordionSection<I>> = HTMLAttributes<HTMLElement> & PropsWithChildren<{
|
|
10
18
|
index: number;
|
|
11
19
|
isCollapsed: boolean;
|
|
12
|
-
|
|
20
|
+
section: S;
|
|
13
21
|
onCustomEvent?: (name: string, info?: any) => void;
|
|
14
22
|
}>;
|
|
15
|
-
export type AccordionProps<I, S extends
|
|
23
|
+
export type AccordionProps<I, S extends AccordionSection<I> = AccordionSection<I>> = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
|
|
16
24
|
/**
|
|
17
25
|
* Specifies if expanded sections should automatically collapse upon expanding
|
|
18
26
|
* another section.
|
|
@@ -22,10 +30,6 @@ export type AccordionProps<I, S extends AccordionSectionData<I> = AccordionSecti
|
|
|
22
30
|
* SVG markup to be put in the section header as the collapse icon.
|
|
23
31
|
*/
|
|
24
32
|
collapseIconSvg?: string;
|
|
25
|
-
/**
|
|
26
|
-
* Data provided to each section.
|
|
27
|
-
*/
|
|
28
|
-
data: S[];
|
|
29
33
|
/**
|
|
30
34
|
* Indices of sections that are expanded.
|
|
31
35
|
*/
|
|
@@ -35,30 +39,34 @@ export type AccordionProps<I, S extends AccordionSectionData<I> = AccordionSecti
|
|
|
35
39
|
*/
|
|
36
40
|
expandIconSvg?: string;
|
|
37
41
|
/**
|
|
38
|
-
*
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
*
|
|
42
|
+
* React component type to be used to generate items for each section.
|
|
43
|
+
*/
|
|
44
|
+
itemComponentType?: ComponentType<AccordionItemProps<I>>;
|
|
45
|
+
/**
|
|
46
|
+
* Orientation of this component.
|
|
43
47
|
*/
|
|
44
|
-
|
|
48
|
+
orientation?: ListOrientation;
|
|
45
49
|
/**
|
|
46
50
|
* Padding (in pixels) between each section.
|
|
47
51
|
*/
|
|
48
52
|
sectionPadding?: number;
|
|
53
|
+
/**
|
|
54
|
+
* Data provided to each section.
|
|
55
|
+
*/
|
|
56
|
+
sections: S[];
|
|
49
57
|
/**
|
|
50
58
|
* Indices of selected items per section.
|
|
51
59
|
*/
|
|
52
60
|
selection?: AccordionSelection;
|
|
61
|
+
/**
|
|
62
|
+
* Selection mode of each section.
|
|
63
|
+
*/
|
|
64
|
+
selectionMode?: ListSelectionMode;
|
|
53
65
|
/**
|
|
54
66
|
* React component type to be used for generating headers inside the
|
|
55
67
|
* component. When absent, one will be generated automatically.
|
|
56
68
|
*/
|
|
57
69
|
headerComponentType?: ComponentType<AccordionHeaderProps<I, S>>;
|
|
58
|
-
/**
|
|
59
|
-
* React component type to be used for generating items inside the component.
|
|
60
|
-
*/
|
|
61
|
-
itemComponentType: ComponentType<AccordionItemProps<I>>;
|
|
62
70
|
/**
|
|
63
71
|
* Specifies if the component should use default styles.
|
|
64
72
|
*/
|
|
@@ -97,6 +105,15 @@ export type AccordionProps<I, S extends AccordionSectionData<I> = AccordionSecti
|
|
|
97
105
|
* @param eventInfo Optional info of the dispatched event.
|
|
98
106
|
*/
|
|
99
107
|
onHeaderCustomEvent?: (sectionIndex: number, eventName: string, eventInfo?: any) => void;
|
|
108
|
+
/**
|
|
109
|
+
* Handler invoked when a custom event is dispatched from an item.
|
|
110
|
+
*
|
|
111
|
+
* @param itemIndex Item index.
|
|
112
|
+
* @param sectionIndex Section index.
|
|
113
|
+
* @param eventName Name of the dispatched event.
|
|
114
|
+
* @param eventInfo Optional info of the dispatched event.
|
|
115
|
+
*/
|
|
116
|
+
onItemCustomEvent?: (itemIndex: number, sectionIndex: number, eventName: string, eventInfo?: any) => void;
|
|
100
117
|
/**
|
|
101
118
|
* Handler invoked when an item is selected in a section.
|
|
102
119
|
*
|
|
@@ -111,7 +128,7 @@ export type AccordionProps<I, S extends AccordionSectionData<I> = AccordionSecti
|
|
|
111
128
|
*/
|
|
112
129
|
onSelectionChange?: (selection: AccordionSelection) => void;
|
|
113
130
|
}>;
|
|
114
|
-
declare const _default: <I, S extends
|
|
131
|
+
declare const _default: <I, S extends AccordionSection<I> = AccordionSection<I>>(props: React.HTMLAttributes<HTMLDivElement> & {
|
|
115
132
|
/**
|
|
116
133
|
* Specifies if expanded sections should automatically collapse upon expanding
|
|
117
134
|
* another section.
|
|
@@ -121,10 +138,6 @@ declare const _default: <I, S extends AccordionSectionData<I> = AccordionSection
|
|
|
121
138
|
* SVG markup to be put in the section header as the collapse icon.
|
|
122
139
|
*/
|
|
123
140
|
collapseIconSvg?: string | undefined;
|
|
124
|
-
/**
|
|
125
|
-
* Data provided to each section.
|
|
126
|
-
*/
|
|
127
|
-
data: S[];
|
|
128
141
|
/**
|
|
129
142
|
* Indices of sections that are expanded.
|
|
130
143
|
*/
|
|
@@ -134,30 +147,34 @@ declare const _default: <I, S extends AccordionSectionData<I> = AccordionSection
|
|
|
134
147
|
*/
|
|
135
148
|
expandIconSvg?: string | undefined;
|
|
136
149
|
/**
|
|
137
|
-
*
|
|
138
|
-
* When a value greater than or equal to 0 is specified, only that number of
|
|
139
|
-
* items will be visible at a time, and a scrollbar will appear to scroll to
|
|
140
|
-
* remaining items. Any value less than 0 indicates that all items will be
|
|
141
|
-
* visible when a section expands.
|
|
150
|
+
* React component type to be used to generate items for each section.
|
|
142
151
|
*/
|
|
143
|
-
|
|
152
|
+
itemComponentType?: React.ComponentType<AccordionItemProps<I>> | undefined;
|
|
153
|
+
/**
|
|
154
|
+
* Orientation of this component.
|
|
155
|
+
*/
|
|
156
|
+
orientation?: ListOrientation | undefined;
|
|
144
157
|
/**
|
|
145
158
|
* Padding (in pixels) between each section.
|
|
146
159
|
*/
|
|
147
160
|
sectionPadding?: number | undefined;
|
|
161
|
+
/**
|
|
162
|
+
* Data provided to each section.
|
|
163
|
+
*/
|
|
164
|
+
sections: S[];
|
|
148
165
|
/**
|
|
149
166
|
* Indices of selected items per section.
|
|
150
167
|
*/
|
|
151
168
|
selection?: AccordionSelection | undefined;
|
|
169
|
+
/**
|
|
170
|
+
* Selection mode of each section.
|
|
171
|
+
*/
|
|
172
|
+
selectionMode?: ListSelectionMode | undefined;
|
|
152
173
|
/**
|
|
153
174
|
* React component type to be used for generating headers inside the
|
|
154
175
|
* component. When absent, one will be generated automatically.
|
|
155
176
|
*/
|
|
156
177
|
headerComponentType?: React.ComponentType<AccordionHeaderProps<I, S>> | undefined;
|
|
157
|
-
/**
|
|
158
|
-
* React component type to be used for generating items inside the component.
|
|
159
|
-
*/
|
|
160
|
-
itemComponentType: React.ComponentType<AccordionItemProps<I>>;
|
|
161
178
|
/**
|
|
162
179
|
* Specifies if the component should use default styles.
|
|
163
180
|
*/
|
|
@@ -196,6 +213,15 @@ declare const _default: <I, S extends AccordionSectionData<I> = AccordionSection
|
|
|
196
213
|
* @param eventInfo Optional info of the dispatched event.
|
|
197
214
|
*/
|
|
198
215
|
onHeaderCustomEvent?: ((sectionIndex: number, eventName: string, eventInfo?: any) => void) | undefined;
|
|
216
|
+
/**
|
|
217
|
+
* Handler invoked when a custom event is dispatched from an item.
|
|
218
|
+
*
|
|
219
|
+
* @param itemIndex Item index.
|
|
220
|
+
* @param sectionIndex Section index.
|
|
221
|
+
* @param eventName Name of the dispatched event.
|
|
222
|
+
* @param eventInfo Optional info of the dispatched event.
|
|
223
|
+
*/
|
|
224
|
+
onItemCustomEvent?: ((itemIndex: number, sectionIndex: number, eventName: string, eventInfo?: any) => void) | undefined;
|
|
199
225
|
/**
|
|
200
226
|
* Handler invoked when an item is selected in a section.
|
|
201
227
|
*
|
package/lib/Accordion.js
CHANGED
|
@@ -85,9 +85,9 @@ var asStyleDict_1 = __importDefault(require("./utils/asStyleDict"));
|
|
|
85
85
|
var cloneStyledElement_1 = __importDefault(require("./utils/cloneStyledElement"));
|
|
86
86
|
var styles_1 = __importDefault(require("./utils/styles"));
|
|
87
87
|
exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
88
|
-
var children = _a.children, className = _a.className, style = _a.style, _b = _a.autoCollapseSections, autoCollapseSections = _b === void 0 ? false : _b,
|
|
88
|
+
var children = _a.children, className = _a.className, style = _a.style, _b = _a.autoCollapseSections, autoCollapseSections = _b === void 0 ? false : _b, collapseIconSvg = _a.collapseIconSvg, _c = _a.expandedSectionIndices, externalExpandedSectionIndices = _c === void 0 ? [] : _c, expandIconSvg = _a.expandIconSvg, itemComponentType = _a.itemComponentType, _d = _a.orientation, orientation = _d === void 0 ? 'vertical' : _d, _e = _a.sectionPadding, sectionPadding = _e === void 0 ? 0 : _e, sections = _a.sections, _f = _a.selection, externalSelection = _f === void 0 ? {} : _f, _g = _a.selectionMode, selectionMode = _g === void 0 ? 'single' : _g, _h = _a.useDefaultStyles, useDefaultStyles = _h === void 0 ? false : _h, HeaderComponent = _a.headerComponentType, onActivateAt = _a.onActivateAt, onCollapseSectionAt = _a.onCollapseSectionAt, onDeselectAt = _a.onDeselectAt, onExpandSectionAt = _a.onExpandSectionAt, onHeaderCustomEvent = _a.onHeaderCustomEvent, onItemCustomEvent = _a.onItemCustomEvent, onSelectAt = _a.onSelectAt, onSelectionChange = _a.onSelectionChange, props = __rest(_a, ["children", "className", "style", "autoCollapseSections", "collapseIconSvg", "expandedSectionIndices", "expandIconSvg", "itemComponentType", "orientation", "sectionPadding", "sections", "selection", "selectionMode", "useDefaultStyles", "headerComponentType", "onActivateAt", "onCollapseSectionAt", "onDeselectAt", "onExpandSectionAt", "onHeaderCustomEvent", "onItemCustomEvent", "onSelectAt", "onSelectionChange"]);
|
|
89
89
|
var isSectionIndexOutOfRange = function (sectionIndex) {
|
|
90
|
-
if (sectionIndex >=
|
|
90
|
+
if (sectionIndex >= sections.length)
|
|
91
91
|
return true;
|
|
92
92
|
if (sectionIndex < 0)
|
|
93
93
|
return true;
|
|
@@ -96,7 +96,7 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
96
96
|
var isItemIndexOutOfRange = function (itemIndex, sectionIndex) {
|
|
97
97
|
if (isSectionIndexOutOfRange(sectionIndex))
|
|
98
98
|
return true;
|
|
99
|
-
var items =
|
|
99
|
+
var items = sections[sectionIndex].items;
|
|
100
100
|
if (itemIndex >= items.length)
|
|
101
101
|
return true;
|
|
102
102
|
if (itemIndex < 0)
|
|
@@ -108,12 +108,12 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
108
108
|
var _a;
|
|
109
109
|
var newValue = {};
|
|
110
110
|
var _loop_1 = function (sectionIndex) {
|
|
111
|
-
if (!Object.prototype.hasOwnProperty.call(
|
|
111
|
+
if (!Object.prototype.hasOwnProperty.call(sections, sectionIndex))
|
|
112
112
|
return "continue";
|
|
113
113
|
var indices = __spreadArray([], __read((_a = selection[sectionIndex]) !== null && _a !== void 0 ? _a : []), false).sort();
|
|
114
114
|
newValue[Number(sectionIndex)] = indices.sort().filter(function (t) { return !isItemIndexOutOfRange(t, Number(sectionIndex)); });
|
|
115
115
|
};
|
|
116
|
-
for (var sectionIndex in
|
|
116
|
+
for (var sectionIndex in sections) {
|
|
117
117
|
_loop_1(sectionIndex);
|
|
118
118
|
}
|
|
119
119
|
return newValue;
|
|
@@ -160,11 +160,10 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
160
160
|
onDeselectAt === null || onDeselectAt === void 0 ? void 0 : onDeselectAt(itemIndex, sectionIndex);
|
|
161
161
|
};
|
|
162
162
|
var sanitizedExpandedSectionIndices = sanitizeExpandedSectionIndices(externalExpandedSectionIndices);
|
|
163
|
-
var
|
|
163
|
+
var _j = __read((0, react_2.useState)(sanitizedExpandedSectionIndices), 2), expandedSectionIndices = _j[0], setExpandedSectionIndices = _j[1];
|
|
164
164
|
var prevExpandedSectionIndices = (0, usePrevious_1.default)(expandedSectionIndices);
|
|
165
165
|
var sanitizedExternalSelection = sanitizeSelection(externalSelection);
|
|
166
|
-
var
|
|
167
|
-
var prevSelection = (0, usePrevious_1.default)(selection);
|
|
166
|
+
var _k = __read((0, react_2.useState)(sanitizedExternalSelection), 2), selection = _k[0], setSelection = _k[1];
|
|
168
167
|
(0, react_2.useEffect)(function () {
|
|
169
168
|
if ((0, react_1.default)(sanitizedExpandedSectionIndices, expandedSectionIndices))
|
|
170
169
|
return;
|
|
@@ -185,43 +184,45 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
185
184
|
setSelection(sanitizedExternalSelection);
|
|
186
185
|
}, [JSON.stringify(sanitizedExternalSelection)]);
|
|
187
186
|
(0, react_2.useEffect)(function () {
|
|
188
|
-
if (!prevSelection)
|
|
189
|
-
return;
|
|
190
187
|
onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(selection);
|
|
191
188
|
}, [JSON.stringify(selection)]);
|
|
192
189
|
var fixedClassNames = getFixedClassNames({ orientation: orientation });
|
|
193
|
-
var fixedStyles = getFixedStyles({
|
|
190
|
+
var fixedStyles = getFixedStyles({ orientation: orientation });
|
|
194
191
|
var defaultStyles = useDefaultStyles ? getDefaultStyles({ orientation: orientation }) : {};
|
|
195
192
|
return (react_2.default.createElement("div", __assign({}, props, { className: (0, classnames_1.default)(className, fixedClassNames.root), style: (0, styles_1.default)(style, fixedStyles.root), ref: ref }),
|
|
196
|
-
react_2.default.createElement(Each_1.default, { in:
|
|
197
|
-
var _a
|
|
198
|
-
var
|
|
199
|
-
var
|
|
200
|
-
var
|
|
201
|
-
var
|
|
193
|
+
react_2.default.createElement(Each_1.default, { in: sections }, function (section, sectionIndex) {
|
|
194
|
+
var _a;
|
|
195
|
+
var items = section.items, _b = section.itemLength, itemLength = _b === void 0 ? 50 : _b, _c = section.itemPadding, itemPadding = _c === void 0 ? 0 : _c, isSelectionTogglable = section.isSelectionTogglable, _d = section.layout, layout = _d === void 0 ? 'list' : _d, _e = section.maxVisible, maxVisible = _e === void 0 ? -1 : _e, _f = section.numSegments, numSegments = _f === void 0 ? 1 : _f;
|
|
196
|
+
var allVisible = layout === 'list' ? items.length : Math.ceil(items.length / numSegments);
|
|
197
|
+
var numVisible = maxVisible < 0 ? allVisible : Math.min(allVisible, maxVisible);
|
|
198
|
+
var maxLength = itemLength * numVisible + itemPadding * (numVisible - 1);
|
|
202
199
|
var isCollapsed = !isSectionExpandedAt(sectionIndex);
|
|
203
200
|
var expandIconComponent = expandIconSvg ? react_2.default.createElement(FlatSVG_1.default, { svg: expandIconSvg, style: defaultStyles.expandIcon }) : react_2.default.createElement(react_2.default.Fragment, null);
|
|
204
201
|
var collapseIconComponent = collapseIconSvg ? react_2.default.createElement(FlatSVG_1.default, { svg: collapseIconSvg, style: defaultStyles.collapseIcon }) : expandIconComponent;
|
|
205
202
|
return (react_2.default.createElement("div", { style: (0, styles_1.default)(fixedStyles.section, orientation === 'vertical' ? {
|
|
206
|
-
marginTop: sectionIndex === 0 ? '0px' : "".concat(sectionPadding
|
|
203
|
+
marginTop: sectionIndex === 0 ? '0px' : "".concat(sectionPadding, "px"),
|
|
207
204
|
} : {
|
|
208
|
-
marginLeft: sectionIndex === 0 ? '0px' : "".concat(sectionPadding
|
|
205
|
+
marginLeft: sectionIndex === 0 ? '0px' : "".concat(sectionPadding, "px"),
|
|
209
206
|
}) },
|
|
210
|
-
HeaderComponent ? (react_2.default.createElement(HeaderComponent, { className: (0, classnames_1.default)(fixedClassNames.header, { collapsed: isCollapsed, expanded: !isCollapsed }), style: (0, styles_1.default)(fixedStyles.header), index: sectionIndex, isCollapsed: isCollapsed,
|
|
207
|
+
HeaderComponent ? (react_2.default.createElement(HeaderComponent, { className: (0, classnames_1.default)(fixedClassNames.header, { collapsed: isCollapsed, expanded: !isCollapsed }), style: (0, styles_1.default)(fixedStyles.header), index: sectionIndex, isCollapsed: isCollapsed, section: section, onClick: function () { return toggleSectionAt(sectionIndex); }, onCustomEvent: function (name, info) { return onHeaderCustomEvent === null || onHeaderCustomEvent === void 0 ? void 0 : onHeaderCustomEvent(sectionIndex, name, info); } })) : (react_2.default.createElement("button", { className: (0, classnames_1.default)(fixedClassNames.header, { collapsed: isCollapsed, expanded: !isCollapsed }), style: (0, styles_1.default)(fixedStyles.header, defaultStyles.header), onClick: function () { return toggleSectionAt(sectionIndex); } },
|
|
211
208
|
react_2.default.createElement("label", { style: (0, styles_1.default)(defaultStyles.headerLabel), dangerouslySetInnerHTML: { __html: section.label } }),
|
|
212
209
|
(0, cloneStyledElement_1.default)(isCollapsed ? expandIconComponent : collapseIconComponent, {
|
|
213
210
|
className: (0, classnames_1.default)(isCollapsed ? fixedClassNames.expandIcon : fixedClassNames.collapseIcon),
|
|
214
211
|
style: (0, styles_1.default)(isCollapsed ? fixedStyles.expandIcon : fixedStyles.collapseIcon),
|
|
215
212
|
}))),
|
|
216
213
|
react_2.default.createElement(List_1.default, { style: (0, styles_1.default)(fixedStyles.list, defaultStyles.list, orientation === 'vertical' ? {
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
214
|
+
width: '100%',
|
|
215
|
+
top: '100%',
|
|
216
|
+
height: isCollapsed ? '0px' : "".concat(maxLength, "px"),
|
|
217
|
+
marginTop: isCollapsed ? '0px' : "".concat(itemPadding, "px"),
|
|
218
|
+
overflowY: maxVisible < 0 ? 'hidden' : maxVisible < allVisible ? 'scroll' : 'hidden',
|
|
220
219
|
} : {
|
|
221
|
-
marginLeft: isCollapsed ? '0px' : "".concat(itemPadding
|
|
222
|
-
overflowX: maxVisible < 0 ? 'hidden' : maxVisible <
|
|
223
|
-
width: isCollapsed ? '0px' : "".concat(
|
|
224
|
-
|
|
220
|
+
marginLeft: isCollapsed ? '0px' : "".concat(itemPadding, "px"),
|
|
221
|
+
overflowX: maxVisible < 0 ? 'hidden' : maxVisible < allVisible ? 'scroll' : 'hidden',
|
|
222
|
+
width: isCollapsed ? '0px' : "".concat(maxLength, "px"),
|
|
223
|
+
height: '100%',
|
|
224
|
+
left: '100%',
|
|
225
|
+
}), selectionMode: selectionMode, isSelectionTogglable: isSelectionTogglable, itemComponentType: itemComponentType, itemLength: itemLength, itemPadding: itemPadding, items: items, orientation: orientation, layout: layout, numSegments: numSegments, selection: (_a = selection[sectionIndex]) !== null && _a !== void 0 ? _a : [], onActivateAt: function (itemIndex) { return onActivateAt === null || onActivateAt === void 0 ? void 0 : onActivateAt(itemIndex, sectionIndex); }, onDeselectAt: function (itemIndex) { return deselectAt(itemIndex, sectionIndex); }, onItemCustomEvent: function (itemIndex, eventName, eventInfo) { return onItemCustomEvent === null || onItemCustomEvent === void 0 ? void 0 : onItemCustomEvent(itemIndex, sectionIndex, eventName, eventInfo); }, onSelectAt: function (itemIndex) { return selectAt(itemIndex, sectionIndex); } })));
|
|
225
226
|
})));
|
|
226
227
|
});
|
|
227
228
|
function getFixedClassNames(_a) {
|
|
@@ -234,7 +235,7 @@ function getFixedClassNames(_a) {
|
|
|
234
235
|
});
|
|
235
236
|
}
|
|
236
237
|
function getFixedStyles(_a) {
|
|
237
|
-
var
|
|
238
|
+
var orientation = _a.orientation;
|
|
238
239
|
return (0, asStyleDict_1.default)({
|
|
239
240
|
root: __assign({ alignItems: 'center', boxSizing: 'border-box', display: 'flex', flex: '0 0 auto', justifyContent: 'flex-start', padding: '0' }, orientation === 'vertical' ? {
|
|
240
241
|
flexDirection: 'column',
|
|
@@ -250,7 +251,8 @@ function getFixedStyles(_a) {
|
|
|
250
251
|
flexDirection: 'row',
|
|
251
252
|
height: '100%',
|
|
252
253
|
}),
|
|
253
|
-
|
|
254
|
+
list: {},
|
|
255
|
+
header: __assign({ border: 'none', cursor: 'pointer', margin: '0', outline: 'none' }, orientation === 'vertical' ? {
|
|
254
256
|
width: '100%',
|
|
255
257
|
} : {
|
|
256
258
|
height: '100%',
|
|
@@ -263,13 +265,6 @@ function getFixedStyles(_a) {
|
|
|
263
265
|
margin: '0',
|
|
264
266
|
padding: '0',
|
|
265
267
|
},
|
|
266
|
-
list: __assign({}, orientation === 'vertical' ? {
|
|
267
|
-
width: '100%',
|
|
268
|
-
top: '100%',
|
|
269
|
-
} : {
|
|
270
|
-
height: '100%',
|
|
271
|
-
left: '100%',
|
|
272
|
-
}),
|
|
273
268
|
});
|
|
274
269
|
}
|
|
275
270
|
function getDefaultStyles(_a) {
|
|
@@ -280,7 +275,7 @@ function getDefaultStyles(_a) {
|
|
|
280
275
|
} : {
|
|
281
276
|
transitionProperty: 'width, margin',
|
|
282
277
|
}),
|
|
283
|
-
header: __assign({ alignItems: 'center', background: '#fff',
|
|
278
|
+
header: __assign({ alignItems: 'center', background: '#fff', boxSizing: 'border-box', display: 'flex', flexDirection: 'row', justifyContent: 'space-between', padding: '0 10px', transitionDuration: '100ms', transitionProperty: 'transform, opacity, background, color', transitionTimingFunction: 'ease-out' }, orientation === 'vertical' ? {
|
|
284
279
|
height: '50px',
|
|
285
280
|
} : {
|
|
286
281
|
width: '50px',
|
package/lib/Accordion.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","sourceRoot":"/","sources":["Accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport isDeepEqual from 'fast-deep-equal/react'\nimport React, { forwardRef, useEffect, useState, type ComponentType, type HTMLAttributes, type PropsWithChildren, type ReactElement, type Ref } from 'react'\nimport Each from './Each'\nimport FlatSVG from './FlatSVG'\nimport List, { type ListItemProps, type ListOrientation, type ListProps } from './List'\nimport usePrevious from './hooks/usePrevious'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\nexport type AccordionSectionData<I> = {\n label: string\n items: I[]\n}\n\nexport type AccordionSelection = Record<number, number[]>\n\nexport type AccordionItemProps<T> = ListItemProps<T>\n\nexport type AccordionHeaderProps<I, S extends AccordionSectionData<I> = AccordionSectionData<I>> = HTMLAttributes<HTMLElement> & PropsWithChildren<{\n index: number\n isCollapsed: boolean\n sectionData: S\n onCustomEvent?: (name: string, info?: any) => void\n}>\n\nexport type AccordionProps<I, S extends AccordionSectionData<I> = AccordionSectionData<I>> = HTMLAttributes<HTMLDivElement> & Omit<ListProps<I>, 'data' | 'itemComponentType' | 'selectedIndices' | 'onActivateAt' | 'onSelectAt' | 'onDeselectAt' | 'onSelectionChange'> & PropsWithChildren<{\n /**\n * Specifies if expanded sections should automatically collapse upon expanding\n * another section.\n */\n autoCollapseSections?: boolean\n\n /**\n * SVG markup to be put in the section header as the collapse icon.\n */\n collapseIconSvg?: string\n\n /**\n * Data provided to each section.\n */\n data: S[]\n\n /**\n * Indices of sections that are expanded.\n */\n expandedSectionIndices?: number[]\n\n /**\n * SVG markup to be put in the section header as the expand icon.\n */\n expandIconSvg?: string\n\n /**\n * Maximum number of items that are viside per section when a section expands.\n * When a value greater than or equal to 0 is specified, only that number of\n * items will be visible at a time, and a scrollbar will appear to scroll to\n * remaining items. Any value less than 0 indicates that all items will be\n * visible when a section expands.\n */\n maxVisibleItems?: number[]\n\n /**\n * Padding (in pixels) between each section.\n */\n sectionPadding?: number\n\n /**\n * Indices of selected items per section.\n */\n selection?: AccordionSelection\n\n /**\n * React component type to be used for generating headers inside the\n * component. When absent, one will be generated automatically.\n */\n headerComponentType?: ComponentType<AccordionHeaderProps<I, S>>\n\n /**\n * React component type to be used for generating items inside the component.\n */\n itemComponentType: ComponentType<AccordionItemProps<I>>\n\n /**\n * Specifies if the component should use default styles.\n */\n useDefaultStyles?: boolean\n\n /**\n * Handler invoked when an item is activated in a section.\n *\n * @param itemIndex Item index.\n * @param sectionIndex Section index.\n */\n onActivateAt?: (itemIndex: number, sectionIndex: number) => void\n\n /**\n * Handler invoked when a section is collapsed.\n *\n * @param sectionIndex Section index.\n */\n onCollapseSectionAt?: (sectionIndex: number) => void\n\n /**\n * Handler invoked when an item is deselected in a section.\n *\n * @param itemIndex Item index.\n * @param sectionIndex Section index.\n */\n onDeselectAt?: (itemIndex: number, sectionIndex: number) => void\n\n /**\n * Handler invoked when a section is expanded.\n *\n * @param sectionIndex Section index.\n */\n onExpandSectionAt?: (sectionIndex: number) => void\n\n /**\n * Handler invoked when a custom event is dispatched from a section header.\n *\n * @param sectionIndex Index of the section which the header belongs.\n * @param eventName Name of the dispatched event.\n * @param eventInfo Optional info of the dispatched event.\n */\n onHeaderCustomEvent?: (sectionIndex: number, eventName: string, eventInfo?: any) => void\n\n /**\n * Handler invoked when an item is selected in a section.\n *\n * @param itemIndex Item index.\n * @param sectionIndex Section index.\n */\n onSelectAt?: (itemIndex: number, sectionIndex: number) => void\n\n /**\n * Handler invoked when selected items have changed.\n *\n * @param selectedIndices Dictionary of indices of selected items per section.\n */\n onSelectionChange?: (selection: AccordionSelection) => void\n}>\n\ntype StylesProps = {\n borderThickness?: number\n orientation?: ListOrientation\n}\n\nexport default forwardRef(({\n children,\n className,\n style,\n autoCollapseSections = false,\n borderThickness = 0,\n collapseIconSvg,\n data,\n expandedSectionIndices: externalExpandedSectionIndices = [],\n expandIconSvg,\n isSelectionTogglable = false,\n itemLength = 50,\n itemPadding = 0,\n maxVisibleItems,\n orientation = 'vertical',\n sectionPadding = 0,\n selection: externalSelection = {},\n selectionMode = 'single',\n useDefaultStyles = false,\n headerComponentType: HeaderComponent,\n itemComponentType,\n onActivateAt,\n onCollapseSectionAt,\n onDeselectAt,\n onExpandSectionAt,\n onHeaderCustomEvent,\n onSelectAt,\n onSelectionChange,\n ...props\n}, ref) => {\n const isSectionIndexOutOfRange = (sectionIndex: number) => {\n if (sectionIndex >= data.length) return true\n if (sectionIndex < 0) return true\n\n return false\n }\n\n const isItemIndexOutOfRange = (itemIndex: number, sectionIndex: number) => {\n if (isSectionIndexOutOfRange(sectionIndex)) return true\n\n const items = data[sectionIndex].items\n\n if (itemIndex >= items.length) return true\n if (itemIndex < 0) return true\n\n return false\n }\n\n const sanitizeExpandedSectionIndices = (sectionIndices: number[]) => sectionIndices.sort().filter(t => !isSectionIndexOutOfRange(t))\n\n const sanitizeSelection = (selection: AccordionSelection) => {\n const newValue: AccordionSelection = {}\n\n for (const sectionIndex in data) {\n if (!Object.prototype.hasOwnProperty.call(data, sectionIndex)) continue\n\n const indices = [...selection[sectionIndex] ?? []].sort()\n\n newValue[Number(sectionIndex)] = indices.sort().filter(t => !isItemIndexOutOfRange(t, Number(sectionIndex)))\n }\n\n return newValue\n }\n\n const isSectionExpandedAt = (sectionIndex: number) => expandedSectionIndices.indexOf(sectionIndex) >= 0\n\n const toggleSectionAt = (sectionIndex: number) => {\n if (isSectionExpandedAt(sectionIndex)) {\n setExpandedSectionIndices(prev => prev.filter(t => t !== sectionIndex))\n }\n else if (autoCollapseSections) {\n setExpandedSectionIndices([sectionIndex])\n }\n else {\n setExpandedSectionIndices(prev => [...prev.filter(t => t !== sectionIndex), sectionIndex])\n }\n }\n\n const selectAt = (itemIndex: number, sectionIndex: number) => {\n switch (selectionMode) {\n case 'multiple':\n setSelection(prev => ({\n ...prev,\n [sectionIndex]: [...(prev[sectionIndex] ?? []).filter(t => t !== itemIndex), itemIndex].sort(),\n }))\n\n onSelectAt?.(itemIndex, sectionIndex)\n\n break\n case 'single':\n setSelection({\n [sectionIndex]: [itemIndex],\n })\n\n onSelectAt?.(itemIndex, sectionIndex)\n\n break\n default:\n break\n }\n }\n\n const deselectAt = (itemIndex: number, sectionIndex: number) => {\n setSelection(prev => {\n const newValue = { ...prev }\n newValue[sectionIndex] = prev[sectionIndex].filter(t => t !== itemIndex)\n\n return newValue\n })\n\n onDeselectAt?.(itemIndex, sectionIndex)\n }\n\n const sanitizedExpandedSectionIndices = sanitizeExpandedSectionIndices(externalExpandedSectionIndices)\n const [expandedSectionIndices, setExpandedSectionIndices] = useState(sanitizedExpandedSectionIndices)\n const prevExpandedSectionIndices = usePrevious(expandedSectionIndices)\n\n const sanitizedExternalSelection = sanitizeSelection(externalSelection)\n const [selection, setSelection] = useState(sanitizedExternalSelection)\n const prevSelection = usePrevious(selection)\n\n useEffect(() => {\n if (isDeepEqual(sanitizedExpandedSectionIndices, expandedSectionIndices)) return\n\n setExpandedSectionIndices(sanitizedExpandedSectionIndices)\n }, [JSON.stringify(sanitizedExpandedSectionIndices)])\n\n useEffect(() => {\n if (!prevExpandedSectionIndices) return\n\n const collapsed = prevExpandedSectionIndices?.filter(t => expandedSectionIndices.indexOf(t) === -1) ?? []\n const expanded = expandedSectionIndices.filter(t => prevExpandedSectionIndices?.indexOf(t) === -1)\n\n collapsed.map(t => onCollapseSectionAt?.(t))\n expanded.map(t => onExpandSectionAt?.(t))\n }, [JSON.stringify(expandedSectionIndices)])\n\n useEffect(() => {\n if (isDeepEqual(sanitizedExternalSelection, selection)) return\n\n setSelection(sanitizedExternalSelection)\n }, [JSON.stringify(sanitizedExternalSelection)])\n\n useEffect(() => {\n if (!prevSelection) return\n\n onSelectionChange?.(selection)\n }, [JSON.stringify(selection)])\n\n const fixedClassNames = getFixedClassNames({ orientation })\n const fixedStyles = getFixedStyles({ borderThickness, orientation })\n const defaultStyles: Record<string, any> = useDefaultStyles ? getDefaultStyles({ orientation }) : {}\n\n return (\n <div\n {...props}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n ref={ref}\n >\n <Each in={data}>\n {(section, sectionIndex) => {\n const maxVisible = maxVisibleItems?.[sectionIndex] ?? -1\n const numItems = section.items.length\n const numVisibleItems = maxVisible < 0 ? numItems : Math.min(numItems, maxVisible)\n const menuLength = (itemLength - borderThickness) * numVisibleItems + itemPadding * (numVisibleItems - 1) + borderThickness\n const isCollapsed = !isSectionExpandedAt(sectionIndex)\n const expandIconComponent = expandIconSvg ? <FlatSVG svg={expandIconSvg} style={defaultStyles.expandIcon}/> : <></>\n const collapseIconComponent = collapseIconSvg ? <FlatSVG svg={collapseIconSvg} style={defaultStyles.collapseIcon}/> : expandIconComponent\n\n return (\n <div style={styles(fixedStyles.section, orientation === 'vertical' ? {\n marginTop: sectionIndex === 0 ? '0px' : `${sectionPadding - borderThickness}px`,\n } : {\n marginLeft: sectionIndex === 0 ? '0px' : `${sectionPadding - borderThickness}px`,\n })}>\n {HeaderComponent ? (\n <HeaderComponent\n className={classNames(fixedClassNames.header, { collapsed: isCollapsed, expanded: !isCollapsed })}\n style={styles(fixedStyles.header)}\n index={sectionIndex}\n isCollapsed={isCollapsed}\n sectionData={section}\n onClick={() => toggleSectionAt(sectionIndex)}\n onCustomEvent={(name, info) => onHeaderCustomEvent?.(sectionIndex, name, info)}\n />\n ) : (\n <button\n className={classNames(fixedClassNames.header, { collapsed: isCollapsed, expanded: !isCollapsed })}\n style={styles(fixedStyles.header, defaultStyles.header)}\n onClick={() => toggleSectionAt(sectionIndex)}\n >\n <label style={styles(defaultStyles.headerLabel)} dangerouslySetInnerHTML={{ __html: section.label }}/>\n {cloneStyledElement(isCollapsed ? expandIconComponent : collapseIconComponent, {\n className: classNames(isCollapsed ? fixedClassNames.expandIcon : fixedClassNames.collapseIcon),\n style: styles(isCollapsed ? fixedStyles.expandIcon : fixedStyles.collapseIcon),\n })}\n </button>\n )}\n <List\n style={styles(fixedStyles.list, defaultStyles.list, orientation === 'vertical' ? {\n height: isCollapsed ? '0px' : `${menuLength}px`,\n marginTop: isCollapsed ? '0px' : `${itemPadding - borderThickness}px`,\n overflowY: maxVisible < 0 ? 'hidden' : maxVisible < numItems ? 'scroll' : 'hidden',\n } : {\n marginLeft: isCollapsed ? '0px' : `${itemPadding - borderThickness}px`,\n overflowX: maxVisible < 0 ? 'hidden' : maxVisible < numItems ? 'scroll' : 'hidden',\n width: isCollapsed ? '0px' : `${menuLength}px`,\n })}\n borderThickness={borderThickness}\n data={section.items}\n selectionMode={selectionMode}\n isSelectionTogglable={isSelectionTogglable}\n itemComponentType={itemComponentType}\n itemLength={itemLength}\n itemPadding={itemPadding}\n orientation={orientation}\n selectedIndices={selection[sectionIndex] ?? []}\n onActivateAt={itemIndex => onActivateAt?.(itemIndex, sectionIndex)}\n onDeselectAt={itemIndex => deselectAt(itemIndex, sectionIndex)}\n onSelectAt={itemIndex => selectAt(itemIndex, sectionIndex)}\n />\n </div>\n )\n }}\n </Each>\n </div>\n )\n}) as <I, S extends AccordionSectionData<I> = AccordionSectionData<I>>(props: AccordionProps<I, S> & { ref?: Ref<HTMLDivElement> }) => ReactElement\n\nfunction getFixedClassNames({ orientation }: StylesProps) {\n return asClassNameDict({\n root: classNames(orientation),\n header: classNames(orientation),\n expandIcon: classNames(orientation),\n collapseIcon: classNames(orientation),\n })\n}\n\nfunction getFixedStyles({ borderThickness, orientation }: StylesProps) {\n return asStyleDict({\n root: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flex: '0 0 auto',\n justifyContent: 'flex-start',\n padding: '0',\n ...orientation === 'vertical' ? {\n flexDirection: 'column',\n height: 'auto',\n } : {\n flexDirection: 'row',\n width: 'auto',\n },\n },\n section: {\n alignItems: 'flex-start',\n display: 'flex',\n flex: '0 0 auto',\n justifyContent: 'flex-start',\n margin: '0',\n padding: '0',\n ...orientation === 'vertical' ? {\n flexDirection: 'column',\n width: '100%',\n } : {\n flexDirection: 'row',\n height: '100%',\n },\n },\n header: {\n borderWidth: `${borderThickness}px`,\n cursor: 'pointer',\n margin: '0',\n outline: 'none',\n ...orientation === 'vertical' ? {\n width: '100%',\n } : {\n height: '100%',\n },\n },\n expandIcon: {\n margin: '0',\n padding: '0',\n },\n collapseIcon: {\n margin: '0',\n padding: '0',\n },\n list: {\n ...orientation === 'vertical' ? {\n width: '100%',\n top: '100%',\n } : {\n height: '100%',\n left: '100%',\n },\n },\n })\n}\n\nfunction getDefaultStyles({ orientation }: StylesProps) {\n return asStyleDict({\n list: {\n transitionDuration: '100ms',\n transitionTimingFunction: 'ease-out',\n ...orientation === 'vertical' ? {\n transitionProperty: 'height, margin',\n } : {\n transitionProperty: 'width, margin',\n },\n },\n header: {\n alignItems: 'center',\n background: '#fff',\n borderStyle: 'solid',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'space-between',\n padding: '0 10px',\n transitionDuration: '100ms',\n transitionProperty: 'transform, opacity, background, color',\n transitionTimingFunction: 'ease-out',\n ...orientation === 'vertical' ? {\n height: '50px',\n } : {\n width: '50px',\n },\n },\n headerLabel: {\n color: 'inherit',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n letterSpacing: 'inherit',\n lineHeight: 'inherit',\n pointerEvents: 'none',\n transition: 'inherit',\n },\n expandIcon: {\n boxSizing: 'border-box',\n display: 'block',\n fill: '#000',\n height: '15px',\n transformOrigin: 'center',\n transitionDuration: '100ms',\n transitionProperty: 'transform',\n transitionTimingFunction: 'ease-out',\n width: '15px',\n },\n collapseIcon: {\n boxSizing: 'border-box',\n display: 'block',\n fill: '#000',\n height: '15px',\n transformOrigin: 'center',\n transitionDuration: '100ms',\n transitionProperty: 'transform',\n transitionTimingFunction: 'ease-out',\n width: '15px',\n },\n })\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Accordion.js","sourceRoot":"/","sources":["Accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport isDeepEqual from 'fast-deep-equal/react'\nimport React, { forwardRef, useEffect, useState, type ComponentType, type HTMLAttributes, type PropsWithChildren, type ReactElement, type Ref } from 'react'\nimport Each from './Each'\nimport FlatSVG from './FlatSVG'\nimport List, { type ListItemProps, type ListOrientation, type ListProps, type ListSelectionMode } from './List'\nimport usePrevious from './hooks/usePrevious'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\nexport type AccordionSelection = Record<number, number[]>\n\nexport type AccordionSection<T> = Pick<ListProps<T>, 'isSelectionTogglable' | 'itemLength' | 'itemPadding' | 'items' | 'layout' | 'numSegments'> & {\n /**\n * Label for the header.\n */\n label: string\n\n /**\n * Maximum number of visible rows (if section orientation is `vertical`) or\n * columns (if section orientation is `horizontal`). If number of rows exceeds\n * the number of visible, a scrollbar will be put in place.\n */\n maxVisible?: number\n}\n\nexport type AccordionItemProps<T> = ListItemProps<T>\n\nexport type AccordionHeaderProps<I, S extends AccordionSection<I> = AccordionSection<I>> = HTMLAttributes<HTMLElement> & PropsWithChildren<{\n index: number\n isCollapsed: boolean\n section: S\n onCustomEvent?: (name: string, info?: any) => void\n}>\n\nexport type AccordionProps<I, S extends AccordionSection<I> = AccordionSection<I>> = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{\n /**\n * Specifies if expanded sections should automatically collapse upon expanding\n * another section.\n */\n autoCollapseSections?: boolean\n\n /**\n * SVG markup to be put in the section header as the collapse icon.\n */\n collapseIconSvg?: string\n\n /**\n * Indices of sections that are expanded.\n */\n expandedSectionIndices?: number[]\n\n /**\n * SVG markup to be put in the section header as the expand icon.\n */\n expandIconSvg?: string\n\n /**\n * React component type to be used to generate items for each section.\n */\n itemComponentType?: ComponentType<AccordionItemProps<I>>\n\n /**\n * Orientation of this component.\n */\n orientation?: ListOrientation\n\n /**\n * Padding (in pixels) between each section.\n */\n sectionPadding?: number\n\n /**\n * Data provided to each section.\n */\n sections: S[]\n\n /**\n * Indices of selected items per section.\n */\n selection?: AccordionSelection\n\n /**\n * Selection mode of each section.\n */\n selectionMode?: ListSelectionMode\n\n /**\n * React component type to be used for generating headers inside the\n * component. When absent, one will be generated automatically.\n */\n headerComponentType?: ComponentType<AccordionHeaderProps<I, S>>\n\n /**\n * Specifies if the component should use default styles.\n */\n useDefaultStyles?: boolean\n\n /**\n * Handler invoked when an item is activated in a section.\n *\n * @param itemIndex Item index.\n * @param sectionIndex Section index.\n */\n onActivateAt?: (itemIndex: number, sectionIndex: number) => void\n\n /**\n * Handler invoked when a section is collapsed.\n *\n * @param sectionIndex Section index.\n */\n onCollapseSectionAt?: (sectionIndex: number) => void\n\n /**\n * Handler invoked when an item is deselected in a section.\n *\n * @param itemIndex Item index.\n * @param sectionIndex Section index.\n */\n onDeselectAt?: (itemIndex: number, sectionIndex: number) => void\n\n /**\n * Handler invoked when a section is expanded.\n *\n * @param sectionIndex Section index.\n */\n onExpandSectionAt?: (sectionIndex: number) => void\n\n /**\n * Handler invoked when a custom event is dispatched from a section header.\n *\n * @param sectionIndex Index of the section which the header belongs.\n * @param eventName Name of the dispatched event.\n * @param eventInfo Optional info of the dispatched event.\n */\n onHeaderCustomEvent?: (sectionIndex: number, eventName: string, eventInfo?: any) => void\n\n /**\n * Handler invoked when a custom event is dispatched from an item.\n *\n * @param itemIndex Item index.\n * @param sectionIndex Section index.\n * @param eventName Name of the dispatched event.\n * @param eventInfo Optional info of the dispatched event.\n */\n onItemCustomEvent?: (itemIndex: number, sectionIndex: number, eventName: string, eventInfo?: any) => void\n\n /**\n * Handler invoked when an item is selected in a section.\n *\n * @param itemIndex Item index.\n * @param sectionIndex Section index.\n */\n onSelectAt?: (itemIndex: number, sectionIndex: number) => void\n\n /**\n * Handler invoked when selected items have changed.\n *\n * @param selectedIndices Dictionary of indices of selected items per section.\n */\n onSelectionChange?: (selection: AccordionSelection) => void\n}>\n\nexport default forwardRef(({\n children,\n className,\n style,\n autoCollapseSections = false,\n collapseIconSvg,\n expandedSectionIndices: externalExpandedSectionIndices = [],\n expandIconSvg,\n itemComponentType,\n orientation = 'vertical',\n sectionPadding = 0,\n sections,\n selection: externalSelection = {},\n selectionMode = 'single',\n useDefaultStyles = false,\n headerComponentType: HeaderComponent,\n onActivateAt,\n onCollapseSectionAt,\n onDeselectAt,\n onExpandSectionAt,\n onHeaderCustomEvent,\n onItemCustomEvent,\n onSelectAt,\n onSelectionChange,\n ...props\n}, ref) => {\n const isSectionIndexOutOfRange = (sectionIndex: number) => {\n if (sectionIndex >= sections.length) return true\n if (sectionIndex < 0) return true\n\n return false\n }\n\n const isItemIndexOutOfRange = (itemIndex: number, sectionIndex: number) => {\n if (isSectionIndexOutOfRange(sectionIndex)) return true\n\n const items = sections[sectionIndex].items\n\n if (itemIndex >= items.length) return true\n if (itemIndex < 0) return true\n\n return false\n }\n\n const sanitizeExpandedSectionIndices = (sectionIndices: number[]) => sectionIndices.sort().filter(t => !isSectionIndexOutOfRange(t))\n\n const sanitizeSelection = (selection: AccordionSelection) => {\n const newValue: AccordionSelection = {}\n\n for (const sectionIndex in sections) {\n if (!Object.prototype.hasOwnProperty.call(sections, sectionIndex)) continue\n\n const indices = [...selection[sectionIndex] ?? []].sort()\n\n newValue[Number(sectionIndex)] = indices.sort().filter(t => !isItemIndexOutOfRange(t, Number(sectionIndex)))\n }\n\n return newValue\n }\n\n const isSectionExpandedAt = (sectionIndex: number) => expandedSectionIndices.indexOf(sectionIndex) >= 0\n\n const toggleSectionAt = (sectionIndex: number) => {\n if (isSectionExpandedAt(sectionIndex)) {\n setExpandedSectionIndices(prev => prev.filter(t => t !== sectionIndex))\n }\n else if (autoCollapseSections) {\n setExpandedSectionIndices([sectionIndex])\n }\n else {\n setExpandedSectionIndices(prev => [...prev.filter(t => t !== sectionIndex), sectionIndex])\n }\n }\n\n const selectAt = (itemIndex: number, sectionIndex: number) => {\n switch (selectionMode) {\n case 'multiple':\n setSelection(prev => ({\n ...prev,\n [sectionIndex]: [...(prev[sectionIndex] ?? []).filter(t => t !== itemIndex), itemIndex].sort(),\n }))\n\n onSelectAt?.(itemIndex, sectionIndex)\n\n break\n case 'single':\n setSelection({\n [sectionIndex]: [itemIndex],\n })\n\n onSelectAt?.(itemIndex, sectionIndex)\n\n break\n default:\n break\n }\n }\n\n const deselectAt = (itemIndex: number, sectionIndex: number) => {\n setSelection(prev => {\n const newValue = { ...prev }\n newValue[sectionIndex] = prev[sectionIndex].filter(t => t !== itemIndex)\n\n return newValue\n })\n\n onDeselectAt?.(itemIndex, sectionIndex)\n }\n\n const sanitizedExpandedSectionIndices = sanitizeExpandedSectionIndices(externalExpandedSectionIndices)\n const [expandedSectionIndices, setExpandedSectionIndices] = useState(sanitizedExpandedSectionIndices)\n const prevExpandedSectionIndices = usePrevious(expandedSectionIndices)\n\n const sanitizedExternalSelection = sanitizeSelection(externalSelection)\n const [selection, setSelection] = useState(sanitizedExternalSelection)\n\n useEffect(() => {\n if (isDeepEqual(sanitizedExpandedSectionIndices, expandedSectionIndices)) return\n\n setExpandedSectionIndices(sanitizedExpandedSectionIndices)\n }, [JSON.stringify(sanitizedExpandedSectionIndices)])\n\n useEffect(() => {\n if (!prevExpandedSectionIndices) return\n\n const collapsed = prevExpandedSectionIndices?.filter(t => expandedSectionIndices.indexOf(t) === -1) ?? []\n const expanded = expandedSectionIndices.filter(t => prevExpandedSectionIndices?.indexOf(t) === -1)\n\n collapsed.map(t => onCollapseSectionAt?.(t))\n expanded.map(t => onExpandSectionAt?.(t))\n }, [JSON.stringify(expandedSectionIndices)])\n\n useEffect(() => {\n if (isDeepEqual(sanitizedExternalSelection, selection)) return\n\n setSelection(sanitizedExternalSelection)\n }, [JSON.stringify(sanitizedExternalSelection)])\n\n useEffect(() => {\n onSelectionChange?.(selection)\n }, [JSON.stringify(selection)])\n\n const fixedClassNames = getFixedClassNames({ orientation })\n const fixedStyles = getFixedStyles({ orientation })\n const defaultStyles: Record<string, any> = useDefaultStyles ? getDefaultStyles({ orientation }) : {}\n\n return (\n <div {...props} className={classNames(className, fixedClassNames.root)} style={styles(style, fixedStyles.root)} ref={ref}>\n <Each in={sections}>\n {(section, sectionIndex) => {\n const { items, itemLength = 50, itemPadding = 0, isSelectionTogglable, layout = 'list', maxVisible = -1, numSegments = 1 } = section\n const allVisible = layout === 'list' ? items.length : Math.ceil(items.length / numSegments)\n const numVisible = maxVisible < 0 ? allVisible : Math.min(allVisible, maxVisible)\n const maxLength = itemLength * numVisible + itemPadding * (numVisible - 1)\n const isCollapsed = !isSectionExpandedAt(sectionIndex)\n const expandIconComponent = expandIconSvg ? <FlatSVG svg={expandIconSvg} style={defaultStyles.expandIcon}/> : <></>\n const collapseIconComponent = collapseIconSvg ? <FlatSVG svg={collapseIconSvg} style={defaultStyles.collapseIcon}/> : expandIconComponent\n\n return (\n <div style={styles(fixedStyles.section, orientation === 'vertical' ? {\n marginTop: sectionIndex === 0 ? '0px' : `${sectionPadding}px`,\n } : {\n marginLeft: sectionIndex === 0 ? '0px' : `${sectionPadding}px`,\n })}>\n {HeaderComponent ? (\n <HeaderComponent\n className={classNames(fixedClassNames.header, { collapsed: isCollapsed, expanded: !isCollapsed })}\n style={styles(fixedStyles.header)}\n index={sectionIndex}\n isCollapsed={isCollapsed}\n section={section}\n onClick={() => toggleSectionAt(sectionIndex)}\n onCustomEvent={(name, info) => onHeaderCustomEvent?.(sectionIndex, name, info)}\n />\n ) : (\n <button\n className={classNames(fixedClassNames.header, { collapsed: isCollapsed, expanded: !isCollapsed })}\n style={styles(fixedStyles.header, defaultStyles.header)}\n onClick={() => toggleSectionAt(sectionIndex)}\n >\n <label style={styles(defaultStyles.headerLabel)} dangerouslySetInnerHTML={{ __html: section.label }}/>\n {cloneStyledElement(isCollapsed ? expandIconComponent : collapseIconComponent, {\n className: classNames(isCollapsed ? fixedClassNames.expandIcon : fixedClassNames.collapseIcon),\n style: styles(isCollapsed ? fixedStyles.expandIcon : fixedStyles.collapseIcon),\n })}\n </button>\n )}\n <List\n style={styles(fixedStyles.list, defaultStyles.list, orientation === 'vertical' ? {\n width: '100%',\n top: '100%',\n height: isCollapsed ? '0px' : `${maxLength}px`,\n marginTop: isCollapsed ? '0px' : `${itemPadding}px`,\n overflowY: maxVisible < 0 ? 'hidden' : maxVisible < allVisible ? 'scroll' : 'hidden',\n } : {\n marginLeft: isCollapsed ? '0px' : `${itemPadding}px`,\n overflowX: maxVisible < 0 ? 'hidden' : maxVisible < allVisible ? 'scroll' : 'hidden',\n width: isCollapsed ? '0px' : `${maxLength}px`,\n height: '100%',\n left: '100%',\n })}\n selectionMode={selectionMode}\n isSelectionTogglable={isSelectionTogglable}\n itemComponentType={itemComponentType}\n itemLength={itemLength}\n itemPadding={itemPadding}\n items={items}\n orientation={orientation}\n layout={layout}\n numSegments={numSegments}\n selection={selection[sectionIndex] ?? []}\n onActivateAt={itemIndex => onActivateAt?.(itemIndex, sectionIndex)}\n onDeselectAt={itemIndex => deselectAt(itemIndex, sectionIndex)}\n onItemCustomEvent={(itemIndex, eventName, eventInfo) => onItemCustomEvent?.(itemIndex, sectionIndex, eventName, eventInfo)}\n onSelectAt={itemIndex => selectAt(itemIndex, sectionIndex)}\n />\n </div>\n )\n }}\n </Each>\n </div>\n )\n}) as <I, S extends AccordionSection<I> = AccordionSection<I>>(props: AccordionProps<I, S> & { ref?: Ref<HTMLDivElement> }) => ReactElement\n\ntype StylesProps = {\n borderThickness?: number\n orientation?: ListOrientation\n}\n\nfunction getFixedClassNames({ orientation }: StylesProps) {\n return asClassNameDict({\n root: classNames(orientation),\n header: classNames(orientation),\n expandIcon: classNames(orientation),\n collapseIcon: classNames(orientation),\n })\n}\n\nfunction getFixedStyles({ orientation }: StylesProps) {\n return asStyleDict({\n root: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flex: '0 0 auto',\n justifyContent: 'flex-start',\n padding: '0',\n ...orientation === 'vertical' ? {\n flexDirection: 'column',\n height: 'auto',\n } : {\n flexDirection: 'row',\n width: 'auto',\n },\n },\n section: {\n alignItems: 'flex-start',\n display: 'flex',\n flex: '0 0 auto',\n justifyContent: 'flex-start',\n margin: '0',\n padding: '0',\n ...orientation === 'vertical' ? {\n flexDirection: 'column',\n width: '100%',\n } : {\n flexDirection: 'row',\n height: '100%',\n },\n },\n list: {\n\n },\n header: {\n border: 'none',\n cursor: 'pointer',\n margin: '0',\n outline: 'none',\n ...orientation === 'vertical' ? {\n width: '100%',\n } : {\n height: '100%',\n },\n },\n expandIcon: {\n margin: '0',\n padding: '0',\n },\n collapseIcon: {\n margin: '0',\n padding: '0',\n },\n })\n}\n\nfunction getDefaultStyles({ orientation }: StylesProps) {\n return asStyleDict({\n list: {\n transitionDuration: '100ms',\n transitionTimingFunction: 'ease-out',\n ...orientation === 'vertical' ? {\n transitionProperty: 'height, margin',\n } : {\n transitionProperty: 'width, margin',\n },\n },\n header: {\n alignItems: 'center',\n background: '#fff',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'space-between',\n padding: '0 10px',\n transitionDuration: '100ms',\n transitionProperty: 'transform, opacity, background, color',\n transitionTimingFunction: 'ease-out',\n ...orientation === 'vertical' ? {\n height: '50px',\n } : {\n width: '50px',\n },\n },\n headerLabel: {\n color: 'inherit',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n letterSpacing: 'inherit',\n lineHeight: 'inherit',\n pointerEvents: 'none',\n transition: 'inherit',\n },\n expandIcon: {\n boxSizing: 'border-box',\n display: 'block',\n fill: '#000',\n height: '15px',\n transformOrigin: 'center',\n transitionDuration: '100ms',\n transitionProperty: 'transform',\n transitionTimingFunction: 'ease-out',\n width: '15px',\n },\n collapseIcon: {\n boxSizing: 'border-box',\n display: 'block',\n fill: '#000',\n height: '15px',\n transformOrigin: 'center',\n transitionDuration: '100ms',\n transitionProperty: 'transform',\n transitionTimingFunction: 'ease-out',\n width: '15px',\n },\n })\n}\n"]}
|
package/lib/Dropdown.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { type ComponentType, type HTMLAttributes, type PropsWithChildren, type ReactElement, type Ref } from 'react';
|
|
2
|
-
import { type ListItemProps, type ListOrientation, type ListProps } from './List';
|
|
2
|
+
import { type ListItemProps, type ListOrientation, type ListProps, type ListSelection } from './List';
|
|
3
3
|
export type DropdownItemData = {
|
|
4
4
|
label?: string;
|
|
5
5
|
};
|
|
@@ -19,8 +19,10 @@ export type DropdownProps<T extends DropdownItemData = DropdownItemData> = HTMLA
|
|
|
19
19
|
collapsesOnSelect?: boolean;
|
|
20
20
|
/**
|
|
21
21
|
* The label to appear on the dropdown toggle button.
|
|
22
|
+
*
|
|
23
|
+
* @param selection The current selection.
|
|
22
24
|
*/
|
|
23
|
-
label?: (
|
|
25
|
+
label?: (selection: ListSelection) => string;
|
|
24
26
|
/**
|
|
25
27
|
* SVG markup to be put in the dropdown button as the expand icon.
|
|
26
28
|
*/
|
|
@@ -61,20 +63,25 @@ export type DropdownProps<T extends DropdownItemData = DropdownItemData> = HTMLA
|
|
|
61
63
|
* component type to this component to automatically generate menu items.
|
|
62
64
|
*/
|
|
63
65
|
declare const _default: <T extends DropdownItemData = DropdownItemData>(props: React.HTMLAttributes<HTMLDivElement> & {
|
|
64
|
-
borderThickness?: number | undefined;
|
|
65
|
-
data: T[];
|
|
66
66
|
isSelectionTogglable?: boolean | undefined;
|
|
67
67
|
itemLength?: number | undefined;
|
|
68
|
+
/**
|
|
69
|
+
* Specifies if the dropdown should be collapsed upon selection. This only
|
|
70
|
+
* works if `selectionMode` is `single`.
|
|
71
|
+
*/
|
|
68
72
|
itemPadding?: number | undefined;
|
|
73
|
+
items: T[];
|
|
74
|
+
layout?: import("./List").ListLayout | undefined;
|
|
75
|
+
numSegments?: number | undefined;
|
|
69
76
|
orientation?: ListOrientation | undefined;
|
|
70
|
-
|
|
71
|
-
selectionMode?: "
|
|
77
|
+
selection?: ListSelection | undefined;
|
|
78
|
+
selectionMode?: import("./List").ListSelectionMode | undefined;
|
|
72
79
|
itemComponentType?: React.ComponentType<ListItemProps<T>> | undefined;
|
|
73
80
|
onActivateAt?: ((index: number) => void) | undefined;
|
|
74
81
|
onDeselectAt?: ((index: number) => void) | undefined;
|
|
75
82
|
onItemCustomEvent?: ((index: number, eventName: string, eventInfo?: any) => void) | undefined;
|
|
76
83
|
onSelectAt?: ((index: number) => void) | undefined;
|
|
77
|
-
onSelectionChange?: ((
|
|
84
|
+
onSelectionChange?: ((selection: ListSelection) => void) | undefined;
|
|
78
85
|
} & {
|
|
79
86
|
/**
|
|
80
87
|
* SVG markup to be put in the dropdown button as the collapse icon.
|
|
@@ -87,8 +94,10 @@ declare const _default: <T extends DropdownItemData = DropdownItemData>(props: R
|
|
|
87
94
|
collapsesOnSelect?: boolean | undefined;
|
|
88
95
|
/**
|
|
89
96
|
* The label to appear on the dropdown toggle button.
|
|
97
|
+
*
|
|
98
|
+
* @param selection The current selection.
|
|
90
99
|
*/
|
|
91
|
-
label?: ((
|
|
100
|
+
label?: ((selection: ListSelection) => string) | undefined;
|
|
92
101
|
/**
|
|
93
102
|
* SVG markup to be put in the dropdown button as the expand icon.
|
|
94
103
|
*/
|