etudes 3.5.0 → 3.7.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.js +20 -14
- package/lib/Accordion.js.map +1 -1
- package/lib/Dropdown.d.ts +8 -8
- package/lib/Dropdown.js +3 -2
- package/lib/Dropdown.js.map +1 -1
- package/lib/List.js +10 -8
- package/lib/List.js.map +1 -1
- package/package.json +1 -1
package/lib/Accordion.js
CHANGED
|
@@ -161,36 +161,42 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
161
161
|
return;
|
|
162
162
|
setSelectedItemIndices(function (prev) {
|
|
163
163
|
var _a;
|
|
164
|
-
var _b;
|
|
165
|
-
|
|
164
|
+
var _b = prev, _c = sectionIndex, indices = _b[_c], rest = __rest(_b, [typeof _c === "symbol" ? _c : _c + ""]);
|
|
165
|
+
var newIndices = (indices !== null && indices !== void 0 ? indices : []).filter(function (t) { return t !== itemIndex; });
|
|
166
|
+
return newIndices.length > 0 ? __assign(__assign({}, rest), (_a = {}, _a[sectionIndex] = newIndices, _a)) : __assign({}, rest);
|
|
166
167
|
});
|
|
167
168
|
onDeselectAt === null || onDeselectAt === void 0 ? void 0 : onDeselectAt(itemIndex, sectionIndex);
|
|
168
169
|
};
|
|
169
|
-
var
|
|
170
|
+
var sanitizedExpandedSectionIndices = sanitizeExpandedSectionIndices(externalExpandedSectionIndices);
|
|
171
|
+
var _o = __read((0, react_2.useState)(sanitizedExpandedSectionIndices), 2), expandedSectionIndices = _o[0], setExpandedSectionIndices = _o[1];
|
|
170
172
|
var prevExpandedSectionIndices = (0, usePrevious_1.default)(expandedSectionIndices);
|
|
171
|
-
var
|
|
173
|
+
var sanitizedExternalSelectedItemIndices = sanitizeSelectedItemIndices(externalSelectedItemIndices);
|
|
174
|
+
var _p = __read((0, react_2.useState)(sanitizedExternalSelectedItemIndices), 2), selectedItemIndices = _p[0], setSelectedItemIndices = _p[1];
|
|
175
|
+
var prevSelectedItemIndices = (0, usePrevious_1.default)(selectedItemIndices);
|
|
172
176
|
(0, react_2.useEffect)(function () {
|
|
173
|
-
|
|
174
|
-
if ((0, react_1.default)(newValue, expandedSectionIndices))
|
|
177
|
+
if ((0, react_1.default)(sanitizedExpandedSectionIndices, expandedSectionIndices))
|
|
175
178
|
return;
|
|
176
|
-
setExpandedSectionIndices(
|
|
177
|
-
}, [JSON.stringify(
|
|
179
|
+
setExpandedSectionIndices(sanitizedExpandedSectionIndices);
|
|
180
|
+
}, [JSON.stringify(sanitizedExpandedSectionIndices)]);
|
|
178
181
|
(0, react_2.useEffect)(function () {
|
|
179
182
|
var _a;
|
|
183
|
+
if ((0, react_1.default)(expandedSectionIndices, sanitizedExpandedSectionIndices))
|
|
184
|
+
return;
|
|
180
185
|
var collapsed = (_a = prevExpandedSectionIndices === null || prevExpandedSectionIndices === void 0 ? void 0 : prevExpandedSectionIndices.filter(function (t) { return expandedSectionIndices.indexOf(t) === -1; })) !== null && _a !== void 0 ? _a : [];
|
|
181
186
|
var expanded = expandedSectionIndices.filter(function (t) { return (prevExpandedSectionIndices === null || prevExpandedSectionIndices === void 0 ? void 0 : prevExpandedSectionIndices.indexOf(t)) === -1; });
|
|
182
187
|
collapsed.map(function (t) { return onCollapseSectionAt === null || onCollapseSectionAt === void 0 ? void 0 : onCollapseSectionAt(t); });
|
|
183
188
|
expanded.map(function (t) { return onExpandSectionAt === null || onExpandSectionAt === void 0 ? void 0 : onExpandSectionAt(t); });
|
|
184
|
-
}, [JSON.stringify(
|
|
189
|
+
}, [JSON.stringify(expandedSectionIndices)]);
|
|
185
190
|
(0, react_2.useEffect)(function () {
|
|
186
|
-
|
|
187
|
-
if ((0, react_1.default)(newValue, selectedItemIndices))
|
|
191
|
+
if ((0, react_1.default)(sanitizedExternalSelectedItemIndices, selectedItemIndices))
|
|
188
192
|
return;
|
|
189
|
-
setSelectedItemIndices(
|
|
190
|
-
}, [JSON.stringify(
|
|
193
|
+
setSelectedItemIndices(sanitizedExternalSelectedItemIndices);
|
|
194
|
+
}, [JSON.stringify(sanitizedExternalSelectedItemIndices)]);
|
|
191
195
|
(0, react_2.useEffect)(function () {
|
|
196
|
+
if (prevSelectedItemIndices === undefined)
|
|
197
|
+
return;
|
|
192
198
|
onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(selectedItemIndices);
|
|
193
|
-
}, [JSON.stringify(
|
|
199
|
+
}, [JSON.stringify(selectedItemIndices)]);
|
|
194
200
|
var fixedClassNames = (0, asClassNameDict_1.default)({
|
|
195
201
|
root: (0, classnames_1.default)(orientation),
|
|
196
202
|
header: (0, classnames_1.default)(orientation),
|
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 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 AccordionItemProps<I> = ListItemProps<I>\n\nexport type AccordionHeaderProps<I, S extends AccordionSectionData<I> = AccordionSectionData<I>> = HTMLAttributes<HTMLElement> & PropsWithChildren<{\n section: S\n index: number\n isCollapsed: boolean\n onCustomEvent?: (name: string, info?: any) => void\n}>\n\nexport type AccordionSectionData<I> = {\n label: string\n items: I[]\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 when a section expands. When a\n * value greater than or equal to 0 is specified, only that number of items\n * 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 selectedItemIndices?: Record<number, number[]>\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 * 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 index Index of the section header.\n * @param eventName Name of the dispatched event.\n * @param eventInfo Optional info of the dispatched event.\n */\n onHeaderCustomEvent?: (index: 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?: (selectedIndices: Record<number, number[]>) => void\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 = -1,\n orientation = 'vertical',\n sectionPadding = 0,\n selectedItemIndices: externalSelectedItemIndices = {},\n selectionMode = 'single',\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 sanitizeSelectedItemIndices = (itemIndices: Record<number, number[]>) => {\n const newValue: Record<number, number[]> = {}\n\n for (const sectionIndex in itemIndices) {\n if (!Object.prototype.hasOwnProperty.call(itemIndices, sectionIndex)) continue\n\n const indices = itemIndices[sectionIndex]\n\n if (!indices || !(indices instanceof Array) || indices.length === 0) continue\n\n newValue[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 (isSectionIndexOutOfRange(sectionIndex)) return\n\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].sort())\n }\n }\n\n const selectAt = (itemIndex: number, sectionIndex: number) => {\n if (isItemIndexOutOfRange(itemIndex, sectionIndex)) return\n\n switch (selectionMode) {\n case 'multiple':\n setSelectedItemIndices(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 setSelectedItemIndices({\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 if (isItemIndexOutOfRange(itemIndex, sectionIndex)) return\n\n setSelectedItemIndices(prev => ({\n ...prev,\n [sectionIndex]: (prev[sectionIndex] ?? []).filter(t => t !== itemIndex),\n }))\n\n onDeselectAt?.(itemIndex, sectionIndex)\n }\n\n const [expandedSectionIndices, setExpandedSectionIndices] = useState(sanitizeExpandedSectionIndices(externalExpandedSectionIndices))\n const prevExpandedSectionIndices = usePrevious(expandedSectionIndices)\n const [selectedItemIndices, setSelectedItemIndices] = useState(externalSelectedItemIndices)\n\n useEffect(() => {\n const newValue = sanitizeExpandedSectionIndices(externalExpandedSectionIndices)\n\n if (isDeepEqual(newValue, expandedSectionIndices)) return\n\n setExpandedSectionIndices(newValue)\n }, [JSON.stringify(sanitizeExpandedSectionIndices(externalExpandedSectionIndices))])\n\n useEffect(() => {\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(sanitizeExpandedSectionIndices(expandedSectionIndices))])\n\n useEffect(() => {\n const newValue = sanitizeSelectedItemIndices(externalSelectedItemIndices)\n\n if (isDeepEqual(newValue, selectedItemIndices)) return\n\n setSelectedItemIndices(newValue)\n }, [JSON.stringify(sanitizeSelectedItemIndices(externalSelectedItemIndices))])\n\n useEffect(() => {\n onSelectionChange?.(selectedItemIndices)\n }, [JSON.stringify(sanitizeSelectedItemIndices(selectedItemIndices))])\n\n const fixedClassNames = asClassNameDict({\n root: classNames(orientation),\n header: classNames(orientation),\n expandIcon: classNames(orientation),\n collapseIcon: classNames(orientation),\n })\n\n const fixedStyles = 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 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 margin: '0',\n padding: '0',\n },\n collapseIcon: {\n margin: '0',\n padding: '0',\n },\n list: {\n transitionDuration: '100ms',\n transitionTimingFunction: 'ease-out',\n ...orientation === 'vertical' ? {\n width: '100%',\n transitionProperty: 'height, margin',\n top: '100%',\n } : {\n height: '100%',\n transitionProperty: 'width, margin',\n left: '100%',\n },\n },\n })\n\n const defaultStyles = asStyleDict({\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 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 return (\n <div\n {...props}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\n <Each in={data}>\n {(section, sectionIndex) => {\n const numItems = section.items.length\n const numVisibleItems = maxVisibleItems < 0 ? numItems : Math.min(numItems, maxVisibleItems)\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 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={fixedStyles.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, orientation === 'vertical' ? {\n height: isCollapsed ? '0px' : `${menuLength}px`,\n marginTop: isCollapsed ? '0px' : `${itemPadding - borderThickness}px`,\n overflowY: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < numItems ? 'scroll' : 'hidden',\n } : {\n marginLeft: isCollapsed ? '0px' : `${itemPadding - borderThickness}px`,\n overflowX: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < 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={selectedItemIndices[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"]}
|
|
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 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 AccordionItemProps<I> = ListItemProps<I>\n\nexport type AccordionHeaderProps<I, S extends AccordionSectionData<I> = AccordionSectionData<I>> = HTMLAttributes<HTMLElement> & PropsWithChildren<{\n section: S\n index: number\n isCollapsed: boolean\n onCustomEvent?: (name: string, info?: any) => void\n}>\n\nexport type AccordionSectionData<I> = {\n label: string\n items: I[]\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 when a section expands. When a\n * value greater than or equal to 0 is specified, only that number of items\n * 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 selectedItemIndices?: Record<number, number[]>\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 * 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 index Index of the section header.\n * @param eventName Name of the dispatched event.\n * @param eventInfo Optional info of the dispatched event.\n */\n onHeaderCustomEvent?: (index: 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?: (selectedIndices: Record<number, number[]>) => void\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 = -1,\n orientation = 'vertical',\n sectionPadding = 0,\n selectedItemIndices: externalSelectedItemIndices = {},\n selectionMode = 'single',\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 sanitizeSelectedItemIndices = (itemIndices: Record<number, number[]>) => {\n const newValue: Record<number, number[]> = {}\n\n for (const sectionIndex in itemIndices) {\n if (!Object.prototype.hasOwnProperty.call(itemIndices, sectionIndex)) continue\n\n const indices = itemIndices[sectionIndex]\n\n if (!indices || !(indices instanceof Array) || indices.length === 0) continue\n\n newValue[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 (isSectionIndexOutOfRange(sectionIndex)) return\n\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].sort())\n }\n }\n\n const selectAt = (itemIndex: number, sectionIndex: number) => {\n if (isItemIndexOutOfRange(itemIndex, sectionIndex)) return\n\n switch (selectionMode) {\n case 'multiple':\n setSelectedItemIndices(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 setSelectedItemIndices({\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 if (isItemIndexOutOfRange(itemIndex, sectionIndex)) return\n\n setSelectedItemIndices(prev => {\n const { [sectionIndex]: indices, ...rest } = prev\n const newIndices = (indices ?? []).filter(t => t !== itemIndex)\n\n return newIndices.length > 0 ? { ...rest, [sectionIndex]: newIndices } : { ...rest }\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 sanitizedExternalSelectedItemIndices = sanitizeSelectedItemIndices(externalSelectedItemIndices)\n const [selectedItemIndices, setSelectedItemIndices] = useState(sanitizedExternalSelectedItemIndices)\n const prevSelectedItemIndices = usePrevious(selectedItemIndices)\n\n useEffect(() => {\n if (isDeepEqual(sanitizedExpandedSectionIndices, expandedSectionIndices)) return\n\n setExpandedSectionIndices(sanitizedExpandedSectionIndices)\n }, [JSON.stringify(sanitizedExpandedSectionIndices)])\n\n useEffect(() => {\n if (isDeepEqual(expandedSectionIndices, sanitizedExpandedSectionIndices)) 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(sanitizedExternalSelectedItemIndices, selectedItemIndices)) return\n\n setSelectedItemIndices(sanitizedExternalSelectedItemIndices)\n }, [JSON.stringify(sanitizedExternalSelectedItemIndices)])\n\n useEffect(() => {\n if (prevSelectedItemIndices === undefined) return\n\n onSelectionChange?.(selectedItemIndices)\n }, [JSON.stringify(selectedItemIndices)])\n\n const fixedClassNames = asClassNameDict({\n root: classNames(orientation),\n header: classNames(orientation),\n expandIcon: classNames(orientation),\n collapseIcon: classNames(orientation),\n })\n\n const fixedStyles = 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 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 margin: '0',\n padding: '0',\n },\n collapseIcon: {\n margin: '0',\n padding: '0',\n },\n list: {\n transitionDuration: '100ms',\n transitionTimingFunction: 'ease-out',\n ...orientation === 'vertical' ? {\n width: '100%',\n transitionProperty: 'height, margin',\n top: '100%',\n } : {\n height: '100%',\n transitionProperty: 'width, margin',\n left: '100%',\n },\n },\n })\n\n const defaultStyles = asStyleDict({\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 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 return (\n <div\n {...props}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\n <Each in={data}>\n {(section, sectionIndex) => {\n const numItems = section.items.length\n const numVisibleItems = maxVisibleItems < 0 ? numItems : Math.min(numItems, maxVisibleItems)\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 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={fixedStyles.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, orientation === 'vertical' ? {\n height: isCollapsed ? '0px' : `${menuLength}px`,\n marginTop: isCollapsed ? '0px' : `${itemPadding - borderThickness}px`,\n overflowY: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < numItems ? 'scroll' : 'hidden',\n } : {\n marginLeft: isCollapsed ? '0px' : `${itemPadding - borderThickness}px`,\n overflowX: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < 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={selectedItemIndices[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"]}
|
package/lib/Dropdown.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React, { type ComponentType, type HTMLAttributes, type PropsWithChildren, type ReactElement, type Ref } from 'react';
|
|
2
2
|
import { type ListItemProps, type ListProps } from './List';
|
|
3
|
-
export type
|
|
3
|
+
export type DropdownItemData = {
|
|
4
4
|
label?: string;
|
|
5
5
|
};
|
|
6
6
|
export type DropdownToggleProps = HTMLAttributes<HTMLElement> & {
|
|
7
7
|
onCustomEvent?: (name: string, info?: any) => void;
|
|
8
8
|
};
|
|
9
|
-
export type DropdownItemProps<T extends
|
|
10
|
-
export type DropdownProps<T extends
|
|
9
|
+
export type DropdownItemProps<T extends DropdownItemData = DropdownItemData> = ListItemProps<T>;
|
|
10
|
+
export type DropdownProps<T extends DropdownItemData = DropdownItemData> = HTMLAttributes<HTMLDivElement> & ListProps<T> & PropsWithChildren<{
|
|
11
11
|
/**
|
|
12
12
|
* SVG markup to be put in the dropdown button as the collapse icon.
|
|
13
13
|
*/
|
|
@@ -18,9 +18,9 @@ export type DropdownProps<T extends DropdownData = DropdownData> = HTMLAttribute
|
|
|
18
18
|
*/
|
|
19
19
|
collapsesOnSelect?: boolean;
|
|
20
20
|
/**
|
|
21
|
-
* The label to appear on the dropdown button
|
|
21
|
+
* The label to appear on the dropdown toggle button.
|
|
22
22
|
*/
|
|
23
|
-
|
|
23
|
+
label?: (selectedIndices: number[]) => string;
|
|
24
24
|
/**
|
|
25
25
|
* SVG markup to be put in the dropdown button as the expand icon.
|
|
26
26
|
*/
|
|
@@ -56,7 +56,7 @@ export type DropdownProps<T extends DropdownData = DropdownData> = HTMLAttribute
|
|
|
56
56
|
* supports both horizontal and vertical orientations. Provide data and item
|
|
57
57
|
* component type to this component to automatically generate menu items.
|
|
58
58
|
*/
|
|
59
|
-
declare const _default: <T extends
|
|
59
|
+
declare const _default: <T extends DropdownItemData = DropdownItemData>(props: React.HTMLAttributes<HTMLDivElement> & {
|
|
60
60
|
borderThickness?: number | undefined;
|
|
61
61
|
data: T[];
|
|
62
62
|
isSelectionTogglable?: boolean | undefined;
|
|
@@ -82,9 +82,9 @@ declare const _default: <T extends DropdownData = DropdownData>(props: React.HTM
|
|
|
82
82
|
*/
|
|
83
83
|
collapsesOnSelect?: boolean | undefined;
|
|
84
84
|
/**
|
|
85
|
-
* The label to appear on the dropdown button
|
|
85
|
+
* The label to appear on the dropdown toggle button.
|
|
86
86
|
*/
|
|
87
|
-
|
|
87
|
+
label?: ((selectedIndices: number[]) => string) | undefined;
|
|
88
88
|
/**
|
|
89
89
|
* SVG markup to be put in the dropdown button as the expand icon.
|
|
90
90
|
*/
|
package/lib/Dropdown.js
CHANGED
|
@@ -80,7 +80,8 @@ var styles_1 = __importDefault(require("./utils/styles"));
|
|
|
80
80
|
* component type to this component to automatically generate menu items.
|
|
81
81
|
*/
|
|
82
82
|
exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
83
|
-
var
|
|
83
|
+
var _b;
|
|
84
|
+
var children = _a.children, className = _a.className, style = _a.style, _c = _a.borderThickness, borderThickness = _c === void 0 ? 0 : _c, collapseIconSvg = _a.collapseIconSvg, _d = _a.collapsesOnSelect, collapsesOnSelect = _d === void 0 ? true : _d, data = _a.data, label = _a.label, expandIconSvg = _a.expandIconSvg, _e = _a.isInverted, isInverted = _e === void 0 ? false : _e, _f = _a.isSelectionTogglable, isSelectionTogglable = _f === void 0 ? false : _f, itemComponentType = _a.itemComponentType, externalItemLength = _a.itemLength, _g = _a.itemPadding, itemPadding = _g === void 0 ? 0 : _g, _h = _a.maxVisibleItems, maxVisibleItems = _h === void 0 ? -1 : _h, _j = _a.orientation, orientation = _j === void 0 ? 'vertical' : _j, _k = _a.selectedIndices, externalSelectedIndices = _k === void 0 ? [] : _k, _l = _a.selectionMode, selectionMode = _l === void 0 ? 'single' : _l, ToggleComponent = _a.toggleComponentType, onActivateAt = _a.onActivateAt, onDeselectAt = _a.onDeselectAt, onSelectAt = _a.onSelectAt, onSelectionChange = _a.onSelectionChange, onToggleCustomEvent = _a.onToggleCustomEvent, props = __rest(_a, ["children", "className", "style", "borderThickness", "collapseIconSvg", "collapsesOnSelect", "data", "label", "expandIconSvg", "isInverted", "isSelectionTogglable", "itemComponentType", "itemLength", "itemPadding", "maxVisibleItems", "orientation", "selectedIndices", "selectionMode", "toggleComponentType", "onActivateAt", "onDeselectAt", "onSelectAt", "onSelectionChange", "onToggleCustomEvent"]);
|
|
84
85
|
var isIndexOutOfRange = function (index) {
|
|
85
86
|
if (index >= data.length)
|
|
86
87
|
return true;
|
|
@@ -263,7 +264,7 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
263
264
|
return (react_2.default.createElement("div", __assign({}, props, { ref: ref, className: (0, classnames_1.default)(className, fixedClassNames.root), style: (0, styles_1.default)(style, fixedStyles.root) }),
|
|
264
265
|
react_2.default.createElement("div", { ref: bodyRef, style: (0, styles_1.default)(fixedStyles.body) },
|
|
265
266
|
ToggleComponent ? (react_2.default.createElement(ToggleComponent, { className: (0, classnames_1.default)(fixedClassNames.toggle), style: (0, styles_1.default)(fixedStyles.toggle), onClick: function () { return toggle(); }, onCustomEvent: function (name, info) { return onToggleCustomEvent === null || onToggleCustomEvent === void 0 ? void 0 : onToggleCustomEvent(name, info); } })) : (react_2.default.createElement("button", { className: (0, classnames_1.default)(fixedClassNames.toggle), style: (0, styles_1.default)(fixedStyles.toggle, defaultStyles.toggle), onClick: function () { return toggle(); } },
|
|
266
|
-
react_2.default.createElement("label", { style: fixedStyles.toggleLabel, dangerouslySetInnerHTML: { __html: selectedIndices.length > 0 ? selectedIndices.map(function (t) { return data[t].label; }).join(', ') :
|
|
267
|
+
react_2.default.createElement("label", { style: fixedStyles.toggleLabel, dangerouslySetInnerHTML: { __html: (_b = label === null || label === void 0 ? void 0 : label(selectedIndices)) !== null && _b !== void 0 ? _b : (selectedIndices.length > 0 ? selectedIndices.map(function (t) { return data[t].label; }).join(', ') : '') } }),
|
|
267
268
|
(0, cloneStyledElement_1.default)(isCollapsed ? expandIconComponent : collapseIconComponent, {
|
|
268
269
|
className: (0, classnames_1.default)(isCollapsed ? fixedClassNames.expandIcon : fixedClassNames.collapseIcon),
|
|
269
270
|
style: (0, styles_1.default)(isCollapsed ? fixedStyles.expandIcon : fixedStyles.collapseIcon),
|
package/lib/Dropdown.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.js","sourceRoot":"/","sources":["Dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport isDeepEqual from 'fast-deep-equal/react'\nimport React, { forwardRef, useEffect, useRef, useState, type ComponentType, type HTMLAttributes, type PropsWithChildren, type ReactElement, type Ref } from 'react'\nimport FlatSVG from './FlatSVG'\nimport List, { type ListItemProps, type ListProps } from './List'\nimport useElementRect from './hooks/useElementRect'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\nexport type DropdownData = {\n label?: string\n}\n\nexport type DropdownToggleProps = HTMLAttributes<HTMLElement> & {\n onCustomEvent?: (name: string, info?: any) => void\n}\n\nexport type DropdownItemProps<T extends DropdownData = DropdownData> = ListItemProps<T>\n\nexport type DropdownProps<T extends DropdownData = DropdownData> = HTMLAttributes<HTMLDivElement> & ListProps<T> & PropsWithChildren<{\n /**\n * SVG markup to be put in the dropdown button as the collapse icon.\n */\n collapseIconSvg?: string\n\n /**\n * Specifies if the dropdown should be collapsed upon selection. This only\n * works if `selectionMode` is `single`.\n */\n collapsesOnSelect?: boolean\n\n /**\n * The label to appear on the dropdown button when no items are selected.\n */\n defaultLabel?: string\n\n /**\n * SVG markup to be put in the dropdown button as the expand icon.\n */\n expandIconSvg?: string\n\n /**\n * Indicates if the component is inverted (i.e. \"dropup\" instead of dropdown).\n * Supports all orientations.\n */\n isInverted?: boolean\n\n /**\n * Maximum number of items that are viside when the component expands. When a\n * value greater than or equal to 0 is specified, only that number of items\n * 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 the component expands.\n */\n maxVisibleItems?: number\n\n /**\n * React component type to be used for generating the toggle element inside\n * the component. When absent, one will be generated automatically.\n */\n toggleComponentType?: ComponentType<DropdownToggleProps>\n\n /**\n * Handler invoked when the toggle dispatches a custom event.\n *\n * @param eventName Name of the dispatched custom event.\n * @param eventInfo Optional info of the dispatched custom event.\n */\n onToggleCustomEvent?: (eventName: string, eventInfo?: any) => void\n}>\n\n/**\n * A dropdown menu component that is invertible (i.e. can \"dropup\" instead) and\n * supports both horizontal and vertical orientations. Provide data and item\n * component type to this component to automatically generate menu items.\n */\nexport default forwardRef(({\n children,\n className,\n style,\n borderThickness = 0,\n collapseIconSvg,\n collapsesOnSelect = true,\n data,\n defaultLabel = 'Select',\n expandIconSvg,\n isInverted = false,\n isSelectionTogglable = false,\n itemComponentType,\n itemLength: externalItemLength,\n itemPadding = 0,\n maxVisibleItems = -1,\n orientation = 'vertical',\n selectedIndices: externalSelectedIndices = [],\n selectionMode = 'single',\n toggleComponentType: ToggleComponent,\n onActivateAt,\n onDeselectAt,\n onSelectAt,\n onSelectionChange,\n onToggleCustomEvent,\n ...props\n}, ref) => {\n const isIndexOutOfRange = (index: number) => {\n if (index >= data.length) return true\n if (index < 0) return true\n\n return false\n }\n\n const sanitizeSelectedIndices = (indices: number[]) => indices.sort().filter(t => !isIndexOutOfRange(t))\n\n const expand = () => {\n if (isCollapsed) setIsCollapsed(false)\n }\n\n const collapse = () => {\n if (!isCollapsed) setIsCollapsed(true)\n }\n\n const toggle = () => {\n if (isCollapsed) {\n expand()\n }\n else {\n collapse()\n }\n }\n\n const selectAtHandler = (index: number) => {\n onSelectAt?.(index)\n\n if (selectionMode === 'single' && collapsesOnSelect) collapse()\n }\n\n const selectionChangeHandler = (selection: number[]) => {\n const newValue = selection.sort()\n\n if (isDeepEqual(newValue, selectedIndices)) return\n\n setSelectedIndices(newValue)\n }\n\n const clickOutsideHandler = (event: MouseEvent) => {\n if (isCollapsed) return\n if (!(event.target instanceof Node)) return\n\n let isOutside = true\n let node = event.target\n\n while (node) {\n if (node === bodyRef.current) {\n isOutside = false\n break\n }\n\n if (!node.parentNode) break\n\n node = node.parentNode\n }\n\n if (!isOutside) return\n\n collapse()\n }\n\n const bodyRef = useRef<HTMLDivElement>(null)\n const [selectedIndices, setSelectedIndices] = useState(sanitizeSelectedIndices(externalSelectedIndices))\n const [isCollapsed, setIsCollapsed] = useState(true)\n const rect = useElementRect(bodyRef)\n\n useEffect(() => {\n window.addEventListener('click', clickOutsideHandler)\n\n return () => {\n window.removeEventListener('click', clickOutsideHandler)\n }\n }, [isCollapsed])\n\n useEffect(() => {\n const newValue = sanitizeSelectedIndices(externalSelectedIndices)\n\n if (isDeepEqual(newValue, selectedIndices)) return\n\n setSelectedIndices(newValue)\n }, [JSON.stringify(sanitizeSelectedIndices(externalSelectedIndices))])\n\n useEffect(() => {\n onSelectionChange?.(selectedIndices)\n }, [JSON.stringify(sanitizeSelectedIndices(selectedIndices))])\n\n const itemLength = externalItemLength ?? (orientation === 'vertical' ? rect.height : rect.width)\n const numItems = data.length\n const numVisibleItems = maxVisibleItems < 0 ? numItems : Math.min(numItems, maxVisibleItems)\n const menuLength = (itemLength - borderThickness) * numVisibleItems + itemPadding * (numVisibleItems - 1) + borderThickness\n\n const fixedClassNames = asClassNameDict({\n root: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n toggle: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n expandIcon: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n collapseIcon: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n list: classNames({\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n })\n\n const fixedStyles = asStyleDict({\n root: {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'flex-start',\n overflow: 'visible',\n ...orientation === 'vertical' ? {\n flexDirection: isInverted ? 'column-reverse' : 'column',\n } : {\n flexDirection: isInverted ? 'row-reverse' : 'row',\n },\n },\n body: {\n height: '100%',\n width: '100%',\n },\n toggle: {\n borderWidth: `${borderThickness}px`,\n cursor: 'pointer',\n height: '100%',\n left: '0',\n margin: '0',\n outline: 'none',\n position: 'absolute',\n top: '0',\n width: '100%',\n zIndex: '1',\n },\n toggleLabel: {\n fontFamily: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n letterSpacing: 'inherit',\n lineHeight: 'inherit',\n pointerEvents: 'none',\n },\n expandIcon: {\n\n },\n collapseIcon: {\n\n },\n list: {\n position: 'absolute',\n ...orientation === 'vertical' ? {\n transition: 'height 100ms ease-out',\n width: '100%',\n height: isCollapsed ? '0px' : `${menuLength}px`,\n overflowY: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < numItems ? 'scroll' : 'hidden',\n ...isInverted ? {\n marginBottom: `${itemPadding - borderThickness}px`,\n bottom: '100%',\n } : {\n top: '100%',\n marginTop: `${itemPadding - borderThickness}px`,\n },\n } : {\n transition: 'width 100ms ease-out',\n width: isCollapsed ? '0px' : `${menuLength}px`,\n height: '100%',\n overflowX: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < numItems ? 'scroll' : 'hidden',\n ...isInverted ? {\n marginRight: `${itemPadding - borderThickness}px`,\n right: '100%',\n } : {\n left: '100%',\n marginLeft: `${itemPadding - borderThickness}px`,\n },\n },\n },\n })\n\n const defaultStyles = asStyleDict({\n toggle: {\n alignItems: 'center',\n background: '#fff',\n boxSizing: 'border-box',\n color: '#000',\n display: 'flex',\n flexDirection: 'row',\n fontSize: '16px',\n justifyContent: 'space-between',\n margin: '0',\n padding: '0 10px',\n },\n expandIcon: {\n height: '15px',\n margin: '0',\n padding: '0',\n width: '15px',\n },\n collapseIcon: {\n height: '15px',\n margin: '0',\n padding: '0',\n width: '15px',\n },\n })\n\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\n {...props}\n ref={ref}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\n <div ref={bodyRef} style={styles(fixedStyles.body)}>\n {ToggleComponent ? (\n <ToggleComponent\n className={classNames(fixedClassNames.toggle)}\n style={styles(fixedStyles.toggle)}\n onClick={() => toggle()}\n onCustomEvent={(name, info) => onToggleCustomEvent?.(name, info)}\n />\n ) : (\n <button\n className={classNames(fixedClassNames.toggle)}\n style={styles(fixedStyles.toggle, defaultStyles.toggle)}\n onClick={() => toggle()}\n >\n <label style={fixedStyles.toggleLabel} dangerouslySetInnerHTML={{ __html: selectedIndices.length > 0 ? selectedIndices.map(t => data[t].label).join(', ') : defaultLabel ?? '' }}/>\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 className={fixedClassNames.list}\n style={styles(fixedStyles.list)}\n borderThickness={borderThickness}\n data={data}\n isSelectionTogglable={isSelectionTogglable}\n itemComponentType={itemComponentType}\n itemLength={itemLength}\n itemPadding={itemPadding}\n orientation={orientation}\n selectedIndices={selectedIndices}\n selectionMode={selectionMode}\n onActivateAt={onActivateAt}\n onDeselectAt={onDeselectAt}\n onSelectAt={selectAtHandler}\n onSelectionChange={selectionChangeHandler}\n />\n </div>\n </div>\n )\n}) as <T extends DropdownData = DropdownData>(props: DropdownProps<T> & { ref?: Ref<HTMLDivElement> }) => ReactElement\n"]}
|
|
1
|
+
{"version":3,"file":"Dropdown.js","sourceRoot":"/","sources":["Dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport isDeepEqual from 'fast-deep-equal/react'\nimport React, { forwardRef, useEffect, useRef, useState, type ComponentType, type HTMLAttributes, type PropsWithChildren, type ReactElement, type Ref } from 'react'\nimport FlatSVG from './FlatSVG'\nimport List, { type ListItemProps, type ListProps } from './List'\nimport useElementRect from './hooks/useElementRect'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\nexport type DropdownItemData = {\n label?: string\n}\n\nexport type DropdownToggleProps = HTMLAttributes<HTMLElement> & {\n onCustomEvent?: (name: string, info?: any) => void\n}\n\nexport type DropdownItemProps<T extends DropdownItemData = DropdownItemData> = ListItemProps<T>\n\nexport type DropdownProps<T extends DropdownItemData = DropdownItemData> = HTMLAttributes<HTMLDivElement> & ListProps<T> & PropsWithChildren<{\n /**\n * SVG markup to be put in the dropdown button as the collapse icon.\n */\n collapseIconSvg?: string\n\n /**\n * Specifies if the dropdown should be collapsed upon selection. This only\n * works if `selectionMode` is `single`.\n */\n collapsesOnSelect?: boolean\n\n /**\n * The label to appear on the dropdown toggle button.\n */\n label?: (selectedIndices: number[]) => string\n\n /**\n * SVG markup to be put in the dropdown button as the expand icon.\n */\n expandIconSvg?: string\n\n /**\n * Indicates if the component is inverted (i.e. \"dropup\" instead of dropdown).\n * Supports all orientations.\n */\n isInverted?: boolean\n\n /**\n * Maximum number of items that are viside when the component expands. When a\n * value greater than or equal to 0 is specified, only that number of items\n * 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 the component expands.\n */\n maxVisibleItems?: number\n\n /**\n * React component type to be used for generating the toggle element inside\n * the component. When absent, one will be generated automatically.\n */\n toggleComponentType?: ComponentType<DropdownToggleProps>\n\n /**\n * Handler invoked when the toggle dispatches a custom event.\n *\n * @param eventName Name of the dispatched custom event.\n * @param eventInfo Optional info of the dispatched custom event.\n */\n onToggleCustomEvent?: (eventName: string, eventInfo?: any) => void\n}>\n\n/**\n * A dropdown menu component that is invertible (i.e. can \"dropup\" instead) and\n * supports both horizontal and vertical orientations. Provide data and item\n * component type to this component to automatically generate menu items.\n */\nexport default forwardRef(({\n children,\n className,\n style,\n borderThickness = 0,\n collapseIconSvg,\n collapsesOnSelect = true,\n data,\n label,\n expandIconSvg,\n isInverted = false,\n isSelectionTogglable = false,\n itemComponentType,\n itemLength: externalItemLength,\n itemPadding = 0,\n maxVisibleItems = -1,\n orientation = 'vertical',\n selectedIndices: externalSelectedIndices = [],\n selectionMode = 'single',\n toggleComponentType: ToggleComponent,\n onActivateAt,\n onDeselectAt,\n onSelectAt,\n onSelectionChange,\n onToggleCustomEvent,\n ...props\n}, ref) => {\n const isIndexOutOfRange = (index: number) => {\n if (index >= data.length) return true\n if (index < 0) return true\n\n return false\n }\n\n const sanitizeSelectedIndices = (indices: number[]) => indices.sort().filter(t => !isIndexOutOfRange(t))\n\n const expand = () => {\n if (isCollapsed) setIsCollapsed(false)\n }\n\n const collapse = () => {\n if (!isCollapsed) setIsCollapsed(true)\n }\n\n const toggle = () => {\n if (isCollapsed) {\n expand()\n }\n else {\n collapse()\n }\n }\n\n const selectAtHandler = (index: number) => {\n onSelectAt?.(index)\n\n if (selectionMode === 'single' && collapsesOnSelect) collapse()\n }\n\n const selectionChangeHandler = (selection: number[]) => {\n const newValue = selection.sort()\n\n if (isDeepEqual(newValue, selectedIndices)) return\n\n setSelectedIndices(newValue)\n }\n\n const clickOutsideHandler = (event: MouseEvent) => {\n if (isCollapsed) return\n if (!(event.target instanceof Node)) return\n\n let isOutside = true\n let node = event.target\n\n while (node) {\n if (node === bodyRef.current) {\n isOutside = false\n break\n }\n\n if (!node.parentNode) break\n\n node = node.parentNode\n }\n\n if (!isOutside) return\n\n collapse()\n }\n\n const bodyRef = useRef<HTMLDivElement>(null)\n const [selectedIndices, setSelectedIndices] = useState(sanitizeSelectedIndices(externalSelectedIndices))\n const [isCollapsed, setIsCollapsed] = useState(true)\n const rect = useElementRect(bodyRef)\n\n useEffect(() => {\n window.addEventListener('click', clickOutsideHandler)\n\n return () => {\n window.removeEventListener('click', clickOutsideHandler)\n }\n }, [isCollapsed])\n\n useEffect(() => {\n const newValue = sanitizeSelectedIndices(externalSelectedIndices)\n\n if (isDeepEqual(newValue, selectedIndices)) return\n\n setSelectedIndices(newValue)\n }, [JSON.stringify(sanitizeSelectedIndices(externalSelectedIndices))])\n\n useEffect(() => {\n onSelectionChange?.(selectedIndices)\n }, [JSON.stringify(sanitizeSelectedIndices(selectedIndices))])\n\n const itemLength = externalItemLength ?? (orientation === 'vertical' ? rect.height : rect.width)\n const numItems = data.length\n const numVisibleItems = maxVisibleItems < 0 ? numItems : Math.min(numItems, maxVisibleItems)\n const menuLength = (itemLength - borderThickness) * numVisibleItems + itemPadding * (numVisibleItems - 1) + borderThickness\n\n const fixedClassNames = asClassNameDict({\n root: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n toggle: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n expandIcon: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n collapseIcon: classNames(orientation, {\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n list: classNames({\n togglable: isSelectionTogglable,\n collapsed: isCollapsed,\n expanded: !isCollapsed,\n }),\n })\n\n const fixedStyles = asStyleDict({\n root: {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'flex-start',\n overflow: 'visible',\n ...orientation === 'vertical' ? {\n flexDirection: isInverted ? 'column-reverse' : 'column',\n } : {\n flexDirection: isInverted ? 'row-reverse' : 'row',\n },\n },\n body: {\n height: '100%',\n width: '100%',\n },\n toggle: {\n borderWidth: `${borderThickness}px`,\n cursor: 'pointer',\n height: '100%',\n left: '0',\n margin: '0',\n outline: 'none',\n position: 'absolute',\n top: '0',\n width: '100%',\n zIndex: '1',\n },\n toggleLabel: {\n fontFamily: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n letterSpacing: 'inherit',\n lineHeight: 'inherit',\n pointerEvents: 'none',\n },\n expandIcon: {\n\n },\n collapseIcon: {\n\n },\n list: {\n position: 'absolute',\n ...orientation === 'vertical' ? {\n transition: 'height 100ms ease-out',\n width: '100%',\n height: isCollapsed ? '0px' : `${menuLength}px`,\n overflowY: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < numItems ? 'scroll' : 'hidden',\n ...isInverted ? {\n marginBottom: `${itemPadding - borderThickness}px`,\n bottom: '100%',\n } : {\n top: '100%',\n marginTop: `${itemPadding - borderThickness}px`,\n },\n } : {\n transition: 'width 100ms ease-out',\n width: isCollapsed ? '0px' : `${menuLength}px`,\n height: '100%',\n overflowX: maxVisibleItems === -1 ? 'hidden' : maxVisibleItems < numItems ? 'scroll' : 'hidden',\n ...isInverted ? {\n marginRight: `${itemPadding - borderThickness}px`,\n right: '100%',\n } : {\n left: '100%',\n marginLeft: `${itemPadding - borderThickness}px`,\n },\n },\n },\n })\n\n const defaultStyles = asStyleDict({\n toggle: {\n alignItems: 'center',\n background: '#fff',\n boxSizing: 'border-box',\n color: '#000',\n display: 'flex',\n flexDirection: 'row',\n fontSize: '16px',\n justifyContent: 'space-between',\n margin: '0',\n padding: '0 10px',\n },\n expandIcon: {\n height: '15px',\n margin: '0',\n padding: '0',\n width: '15px',\n },\n collapseIcon: {\n height: '15px',\n margin: '0',\n padding: '0',\n width: '15px',\n },\n })\n\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\n {...props}\n ref={ref}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\n <div ref={bodyRef} style={styles(fixedStyles.body)}>\n {ToggleComponent ? (\n <ToggleComponent\n className={classNames(fixedClassNames.toggle)}\n style={styles(fixedStyles.toggle)}\n onClick={() => toggle()}\n onCustomEvent={(name, info) => onToggleCustomEvent?.(name, info)}\n />\n ) : (\n <button\n className={classNames(fixedClassNames.toggle)}\n style={styles(fixedStyles.toggle, defaultStyles.toggle)}\n onClick={() => toggle()}\n >\n <label style={fixedStyles.toggleLabel} dangerouslySetInnerHTML={{ __html: label?.(selectedIndices) ?? (selectedIndices.length > 0 ? selectedIndices.map(t => data[t].label).join(', ') : '') }}/>\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 className={fixedClassNames.list}\n style={styles(fixedStyles.list)}\n borderThickness={borderThickness}\n data={data}\n isSelectionTogglable={isSelectionTogglable}\n itemComponentType={itemComponentType}\n itemLength={itemLength}\n itemPadding={itemPadding}\n orientation={orientation}\n selectedIndices={selectedIndices}\n selectionMode={selectionMode}\n onActivateAt={onActivateAt}\n onDeselectAt={onDeselectAt}\n onSelectAt={selectAtHandler}\n onSelectionChange={selectionChangeHandler}\n />\n </div>\n </div>\n )\n}) as <T extends DropdownItemData = DropdownItemData>(props: DropdownProps<T> & { ref?: Ref<HTMLDivElement> }) => ReactElement\n"]}
|
package/lib/List.js
CHANGED
|
@@ -106,7 +106,7 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
106
106
|
}
|
|
107
107
|
};
|
|
108
108
|
var selectAt = function (index) {
|
|
109
|
-
if (
|
|
109
|
+
if (isSelectedAt(index))
|
|
110
110
|
return;
|
|
111
111
|
switch (selectionMode) {
|
|
112
112
|
case 'multiple':
|
|
@@ -120,7 +120,7 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
120
120
|
}
|
|
121
121
|
};
|
|
122
122
|
var deselectAt = function (index) {
|
|
123
|
-
if (
|
|
123
|
+
if (!isSelectedAt(index))
|
|
124
124
|
return;
|
|
125
125
|
setSelectedIndices(function (prev) { return prev.filter(function (t) { return t !== index; }); });
|
|
126
126
|
};
|
|
@@ -135,24 +135,26 @@ exports.default = (0, react_2.forwardRef)(function (_a, ref) {
|
|
|
135
135
|
}
|
|
136
136
|
onActivateAt === null || onActivateAt === void 0 ? void 0 : onActivateAt(index);
|
|
137
137
|
};
|
|
138
|
-
var
|
|
138
|
+
var sanitizedExternalSelectedIndices = sanitizeSelectedIndices(externalSelectedIndices);
|
|
139
|
+
var _h = __read((0, react_2.useState)(sanitizedExternalSelectedIndices), 2), selectedIndices = _h[0], setSelectedIndices = _h[1];
|
|
139
140
|
var prevSelectedIndices = (0, usePrevious_1.default)(selectedIndices);
|
|
140
141
|
(0, react_2.useEffect)(function () {
|
|
141
|
-
|
|
142
|
-
if ((0, react_1.default)(newValue, selectedIndices))
|
|
142
|
+
if ((0, react_1.default)(sanitizedExternalSelectedIndices, selectedIndices))
|
|
143
143
|
return;
|
|
144
|
-
setSelectedIndices(
|
|
145
|
-
}, [JSON.stringify(
|
|
144
|
+
setSelectedIndices(sanitizedExternalSelectedIndices);
|
|
145
|
+
}, [JSON.stringify(sanitizedExternalSelectedIndices)]);
|
|
146
146
|
(0, react_2.useEffect)(function () {
|
|
147
147
|
var _a;
|
|
148
148
|
if (selectionMode === 'none')
|
|
149
149
|
return;
|
|
150
|
+
if (prevSelectedIndices === undefined)
|
|
151
|
+
return;
|
|
150
152
|
var deselected = (_a = prevSelectedIndices === null || prevSelectedIndices === void 0 ? void 0 : prevSelectedIndices.filter(function (t) { return selectedIndices.indexOf(t) === -1; })) !== null && _a !== void 0 ? _a : [];
|
|
151
153
|
var selected = selectedIndices.filter(function (t) { return (prevSelectedIndices === null || prevSelectedIndices === void 0 ? void 0 : prevSelectedIndices.indexOf(t)) === -1; });
|
|
152
154
|
deselected.map(function (t) { return onDeselectAt === null || onDeselectAt === void 0 ? void 0 : onDeselectAt(t); });
|
|
153
155
|
selected.map(function (t) { return onSelectAt === null || onSelectAt === void 0 ? void 0 : onSelectAt(t); });
|
|
154
156
|
onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(selectedIndices);
|
|
155
|
-
}, [JSON.stringify(
|
|
157
|
+
}, [JSON.stringify(selectedIndices)]);
|
|
156
158
|
var fixedClassNames = (0, asClassNameDict_1.default)({
|
|
157
159
|
root: (0, classnames_1.default)(orientation, {
|
|
158
160
|
togglable: isSelectionTogglable,
|
package/lib/List.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.js","sourceRoot":"/","sources":["List.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 ReactElement, type Ref } from 'react'\nimport Each from './Each'\nimport usePrevious from './hooks/usePrevious'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asStyleDict from './utils/asStyleDict'\nimport styles from './utils/styles'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nexport type ListItemProps<T> = HTMLAttributes<HTMLElement> & {\n data: T\n index: number\n isSelected: boolean\n orientation: Orientation\n onCustomEvent?: (name: string, info?: any) => void\n}\n\nexport type ListProps<T> = HTMLAttributes<HTMLDivElement> & {\n /**\n * Thickness of item borders (in pixels). 0 indicates no borders.\n */\n borderThickness?: number\n\n /**\n * Generically typed data of each item.\n */\n data: T[]\n\n /**\n * Indicates if item selection can be toggled, i.e. they can be deselected if\n * selected again.\n */\n isSelectionTogglable?: boolean\n\n /**\n * Optional length (in pixels) of each item. Length refers to the height in\n * vertical orientation and width in horizontal orientation.\n */\n itemLength?: number\n\n /**\n * Padding between every item (in pixels).\n */\n itemPadding?: number\n\n /**\n * Orientation of the component.\n */\n orientation?: Orientation\n\n /**\n * The selected indices. If `selectionMode` is `single`, only only the first\n * value will be used.\n */\n selectedIndices?: number[]\n\n /**\n * Indicates the selection behavior:\n * - `none`: No selection at all.\n * - `single`: Only one item can be selected at a time.\n * - `multiple`: Multiple items can be selected at the same time.\n */\n selectionMode?: 'none' | 'single' | 'multiple'\n\n /**\n * React component type to be used to generate items for this list.\n */\n itemComponentType?: ComponentType<ListItemProps<T>>\n\n /**\n * Handler invoked when an item is activated.\n *\n * @param index Item index.\n */\n onActivateAt?: (index: number) => void\n\n /**\n * Handler invoked when an item is deselected.\n *\n * @param index Item index.\n */\n onDeselectAt?: (index: number) => void\n\n /**\n * Handler invoked when a custom event is dispatched from the item.\n *\n * @param index Index of the item.\n * @param eventName Name of the dispatched custom event.\n * @param eventInfo Optional info of the dispatched custom event.\n */\n onItemCustomEvent?: (index: number, eventName: string, eventInfo?: any) => void\n\n /**\n * Handler invoked when an item is selected.\n *\n * @param index Item index.\n */\n onSelectAt?: (index: number) => void\n\n /**\n * Handler invoked when the selected items changed.\n *\n * @param indices Indices of selected items.\n */\n onSelectionChange?: (indices: number[]) => void\n}\n\n/**\n * A scrollable list of selectable items. Items are generated based on the\n * provided React component type. The type of data passed to each item is\n * generic. This component supports both horizontal and vertical orientations.\n */\nexport default forwardRef(({\n className,\n style,\n borderThickness = 0,\n data,\n selectionMode = 'none',\n isSelectionTogglable = false,\n itemLength,\n itemPadding = 0,\n orientation = 'vertical',\n selectedIndices: externalSelectedIndices = [],\n itemComponentType: ItemComponent,\n onActivateAt,\n onDeselectAt,\n onItemCustomEvent,\n onSelectAt,\n onSelectionChange,\n ...props\n}, ref) => {\n const isIndexOutOfRange = (index: number) => {\n if (index >= data.length) return true\n if (index < 0) return true\n\n return false\n }\n\n const sanitizeSelectedIndices = (indices: number[]) => indices.sort().filter(t => !isIndexOutOfRange(t))\n\n const isSelectedAt = (index: number) => selectedIndices.indexOf(index) >= 0\n\n const toggleAt = (index: number) => {\n if (isSelectedAt(index)) {\n deselectAt(index)\n }\n else {\n selectAt(index)\n }\n }\n\n const selectAt = (index: number) => {\n if (isIndexOutOfRange(index) || isSelectedAt(index)) return\n\n switch (selectionMode) {\n case 'multiple':\n setSelectedIndices(prev => [...prev.filter(t => t !== index), index].sort())\n\n break\n case 'single':\n setSelectedIndices([index])\n\n break\n default:\n break\n }\n }\n\n const deselectAt = (index: number) => {\n if (isIndexOutOfRange(index) || !isSelectedAt(index)) return\n\n setSelectedIndices(prev => prev.filter(t => t !== index))\n }\n\n const activateAt = (index: number) => {\n if (selectionMode !== 'none') {\n if (isSelectionTogglable) {\n toggleAt(index)\n }\n else {\n selectAt(index)\n }\n }\n\n onActivateAt?.(index)\n }\n\n const [selectedIndices, setSelectedIndices] = useState(sanitizeSelectedIndices(externalSelectedIndices))\n const prevSelectedIndices = usePrevious(selectedIndices)\n\n useEffect(() => {\n const newValue = sanitizeSelectedIndices(externalSelectedIndices)\n\n if (isDeepEqual(newValue, selectedIndices)) return\n\n setSelectedIndices(newValue)\n }, [JSON.stringify(sanitizeSelectedIndices(externalSelectedIndices))])\n\n useEffect(() => {\n if (selectionMode === 'none') return\n\n const deselected = prevSelectedIndices?.filter(t => selectedIndices.indexOf(t) === -1) ?? []\n const selected = selectedIndices.filter(t => prevSelectedIndices?.indexOf(t) === -1)\n\n deselected.map(t => onDeselectAt?.(t))\n selected.map(t => onSelectAt?.(t))\n\n onSelectionChange?.(selectedIndices)\n }, [JSON.stringify(sanitizeSelectedIndices(selectedIndices))])\n\n const fixedClassNames = asClassNameDict({\n root: classNames(orientation, {\n togglable: isSelectionTogglable,\n }),\n item: classNames(orientation, {\n togglable: isSelectionTogglable,\n }),\n })\n\n const fixedStyles = asStyleDict({\n root: {\n alignItems: 'flex-start',\n counterReset: 'item-counter',\n display: 'flex',\n flex: '0 0 auto',\n flexDirection: orientation === 'horizontal' ? 'row' : 'column',\n justifyContent: 'flex-start',\n listStyle: 'none',\n },\n item: {\n borderWidth: `${borderThickness}px`,\n counterIncrement: 'item-counter',\n flex: '0 0 auto',\n ...orientation === 'vertical' ? {\n width: '100%',\n } : {\n height: '100%',\n },\n },\n })\n\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\n {ItemComponent && (\n <Each in={data}>\n {(val, idx) => (\n <ItemComponent\n className={classNames(fixedClassNames.item, {\n selected: isSelectedAt(idx),\n })}\n style={styles(fixedStyles.item, {\n pointerEvents: isSelectionTogglable !== true && isSelectedAt(idx) ? 'none' : 'auto',\n ...orientation === 'vertical' ? {\n height: itemLength !== undefined ? `${itemLength}px` : undefined,\n marginTop: `${idx === 0 ? 0 : -borderThickness}px`,\n } : {\n marginLeft: `${idx === 0 ? 0 : -borderThickness}px`,\n width: itemLength !== undefined ? `${itemLength}px` : undefined,\n },\n ...idx >= data.length - 1 ? {} : {\n ...orientation === 'vertical' ? {\n marginBottom: `${itemPadding}px`,\n } : {\n marginRight: `${itemPadding}px`,\n },\n },\n })}\n data-index={idx}\n data={val}\n index={idx}\n isSelected={isSelectedAt(idx)}\n orientation={orientation}\n onCustomEvent={(name, info) => onItemCustomEvent?.(idx, name, info)}\n onClick={() => activateAt(idx)}\n />\n )}\n </Each>\n )}\n </div>\n )\n}) as <T>(props: ListProps<T> & { ref?: Ref<HTMLDivElement> }) => ReactElement\n"]}
|
|
1
|
+
{"version":3,"file":"List.js","sourceRoot":"/","sources":["List.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 ReactElement, type Ref } from 'react'\nimport Each from './Each'\nimport usePrevious from './hooks/usePrevious'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asStyleDict from './utils/asStyleDict'\nimport styles from './utils/styles'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nexport type ListItemProps<T> = HTMLAttributes<HTMLElement> & {\n data: T\n index: number\n isSelected: boolean\n orientation: Orientation\n onCustomEvent?: (name: string, info?: any) => void\n}\n\nexport type ListProps<T> = HTMLAttributes<HTMLDivElement> & {\n /**\n * Thickness of item borders (in pixels). 0 indicates no borders.\n */\n borderThickness?: number\n\n /**\n * Generically typed data of each item.\n */\n data: T[]\n\n /**\n * Indicates if item selection can be toggled, i.e. they can be deselected if\n * selected again.\n */\n isSelectionTogglable?: boolean\n\n /**\n * Optional length (in pixels) of each item. Length refers to the height in\n * vertical orientation and width in horizontal orientation.\n */\n itemLength?: number\n\n /**\n * Padding between every item (in pixels).\n */\n itemPadding?: number\n\n /**\n * Orientation of the component.\n */\n orientation?: Orientation\n\n /**\n * The selected indices. If `selectionMode` is `single`, only only the first\n * value will be used.\n */\n selectedIndices?: number[]\n\n /**\n * Indicates the selection behavior:\n * - `none`: No selection at all.\n * - `single`: Only one item can be selected at a time.\n * - `multiple`: Multiple items can be selected at the same time.\n */\n selectionMode?: 'none' | 'single' | 'multiple'\n\n /**\n * React component type to be used to generate items for this list.\n */\n itemComponentType?: ComponentType<ListItemProps<T>>\n\n /**\n * Handler invoked when an item is activated.\n *\n * @param index Item index.\n */\n onActivateAt?: (index: number) => void\n\n /**\n * Handler invoked when an item is deselected.\n *\n * @param index Item index.\n */\n onDeselectAt?: (index: number) => void\n\n /**\n * Handler invoked when a custom event is dispatched from the item.\n *\n * @param index Index of the item.\n * @param eventName Name of the dispatched custom event.\n * @param eventInfo Optional info of the dispatched custom event.\n */\n onItemCustomEvent?: (index: number, eventName: string, eventInfo?: any) => void\n\n /**\n * Handler invoked when an item is selected.\n *\n * @param index Item index.\n */\n onSelectAt?: (index: number) => void\n\n /**\n * Handler invoked when the selected items changed.\n *\n * @param indices Indices of selected items.\n */\n onSelectionChange?: (indices: number[]) => void\n}\n\n/**\n * A scrollable list of selectable items. Items are generated based on the\n * provided React component type. The type of data passed to each item is\n * generic. This component supports both horizontal and vertical orientations.\n */\nexport default forwardRef(({\n className,\n style,\n borderThickness = 0,\n data,\n selectionMode = 'none',\n isSelectionTogglable = false,\n itemLength,\n itemPadding = 0,\n orientation = 'vertical',\n selectedIndices: externalSelectedIndices = [],\n itemComponentType: ItemComponent,\n onActivateAt,\n onDeselectAt,\n onItemCustomEvent,\n onSelectAt,\n onSelectionChange,\n ...props\n}, ref) => {\n const isIndexOutOfRange = (index: number) => {\n if (index >= data.length) return true\n if (index < 0) return true\n\n return false\n }\n\n const sanitizeSelectedIndices = (indices: number[]) => indices.sort().filter(t => !isIndexOutOfRange(t))\n\n const isSelectedAt = (index: number) => selectedIndices.indexOf(index) >= 0\n\n const toggleAt = (index: number) => {\n if (isSelectedAt(index)) {\n deselectAt(index)\n }\n else {\n selectAt(index)\n }\n }\n\n const selectAt = (index: number) => {\n if (isSelectedAt(index)) return\n\n switch (selectionMode) {\n case 'multiple':\n setSelectedIndices(prev => [...prev.filter(t => t !== index), index].sort())\n\n break\n case 'single':\n setSelectedIndices([index])\n\n break\n default:\n break\n }\n }\n\n const deselectAt = (index: number) => {\n if (!isSelectedAt(index)) return\n\n setSelectedIndices(prev => prev.filter(t => t !== index))\n }\n\n const activateAt = (index: number) => {\n if (selectionMode !== 'none') {\n if (isSelectionTogglable) {\n toggleAt(index)\n }\n else {\n selectAt(index)\n }\n }\n\n onActivateAt?.(index)\n }\n\n const sanitizedExternalSelectedIndices = sanitizeSelectedIndices(externalSelectedIndices)\n const [selectedIndices, setSelectedIndices] = useState(sanitizedExternalSelectedIndices)\n const prevSelectedIndices = usePrevious(selectedIndices)\n\n useEffect(() => {\n if (isDeepEqual(sanitizedExternalSelectedIndices, selectedIndices)) return\n\n setSelectedIndices(sanitizedExternalSelectedIndices)\n }, [JSON.stringify(sanitizedExternalSelectedIndices)])\n\n useEffect(() => {\n if (selectionMode === 'none') return\n if (prevSelectedIndices === undefined) return\n\n const deselected = prevSelectedIndices?.filter(t => selectedIndices.indexOf(t) === -1) ?? []\n const selected = selectedIndices.filter(t => prevSelectedIndices?.indexOf(t) === -1)\n\n deselected.map(t => onDeselectAt?.(t))\n selected.map(t => onSelectAt?.(t))\n\n onSelectionChange?.(selectedIndices)\n }, [JSON.stringify(selectedIndices)])\n\n const fixedClassNames = asClassNameDict({\n root: classNames(orientation, {\n togglable: isSelectionTogglable,\n }),\n item: classNames(orientation, {\n togglable: isSelectionTogglable,\n }),\n })\n\n const fixedStyles = asStyleDict({\n root: {\n alignItems: 'flex-start',\n counterReset: 'item-counter',\n display: 'flex',\n flex: '0 0 auto',\n flexDirection: orientation === 'horizontal' ? 'row' : 'column',\n justifyContent: 'flex-start',\n listStyle: 'none',\n },\n item: {\n borderWidth: `${borderThickness}px`,\n counterIncrement: 'item-counter',\n flex: '0 0 auto',\n ...orientation === 'vertical' ? {\n width: '100%',\n } : {\n height: '100%',\n },\n },\n })\n\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\n {ItemComponent && (\n <Each in={data}>\n {(val, idx) => (\n <ItemComponent\n className={classNames(fixedClassNames.item, {\n selected: isSelectedAt(idx),\n })}\n style={styles(fixedStyles.item, {\n pointerEvents: isSelectionTogglable !== true && isSelectedAt(idx) ? 'none' : 'auto',\n ...orientation === 'vertical' ? {\n height: itemLength !== undefined ? `${itemLength}px` : undefined,\n marginTop: `${idx === 0 ? 0 : -borderThickness}px`,\n } : {\n marginLeft: `${idx === 0 ? 0 : -borderThickness}px`,\n width: itemLength !== undefined ? `${itemLength}px` : undefined,\n },\n ...idx >= data.length - 1 ? {} : {\n ...orientation === 'vertical' ? {\n marginBottom: `${itemPadding}px`,\n } : {\n marginRight: `${itemPadding}px`,\n },\n },\n })}\n data-index={idx}\n data={val}\n index={idx}\n isSelected={isSelectedAt(idx)}\n orientation={orientation}\n onCustomEvent={(name, info) => onItemCustomEvent?.(idx, name, info)}\n onClick={() => activateAt(idx)}\n />\n )}\n </Each>\n )}\n </div>\n )\n}) as <T>(props: ListProps<T> & { ref?: Ref<HTMLDivElement> }) => ReactElement\n"]}
|