@hh.ru/magritte-ui-tree-selector 5.0.3 → 5.1.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/Item.js +1 -1
- package/ItemContent.js +1 -1
- package/ItemsList.js +1 -1
- package/MobileItemsList.js +4 -3
- package/MobileItemsList.js.map +1 -1
- package/TreeSelector.js +1 -1
- package/TreeSelectorDummy.js +1 -1
- package/TreeSelectorWrapper.js +4 -30
- package/TreeSelectorWrapper.js.map +1 -1
- package/index.css +30 -25
- package/index.js +1 -1
- package/index.mock.js +0 -1
- package/index.mock.js.map +1 -1
- package/package.json +2 -2
- package/tree-selector-item-CZrRpLjj.js +5 -0
- package/tree-selector-item-CZrRpLjj.js.map +1 -0
- package/useAnimationTimeout.js +1 -1
- package/tree-selector-item-DA_-Xlv-.js +0 -5
- package/tree-selector-item-DA_-Xlv-.js.map +0 -1
package/Item.js
CHANGED
|
@@ -10,7 +10,7 @@ import '@hh.ru/magritte-ui-checkbox-radio';
|
|
|
10
10
|
import './TreeSelectorItemBase.js';
|
|
11
11
|
import '@hh.ru/magritte-ui-cell';
|
|
12
12
|
import '@hh.ru/magritte-ui-typography';
|
|
13
|
-
import './tree-selector-item-
|
|
13
|
+
import './tree-selector-item-CZrRpLjj.js';
|
|
14
14
|
|
|
15
15
|
const ONE_BOX_MARGIN = 36;
|
|
16
16
|
const getMargin = (allBoxesCount, hasShift, hasIndent) => {
|
package/ItemContent.js
CHANGED
|
@@ -7,7 +7,7 @@ import { DotFilledSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte-ui-
|
|
|
7
7
|
import { Action } from './Action.js';
|
|
8
8
|
import { TreeSelectorItemBase } from './TreeSelectorItemBase.js';
|
|
9
9
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
10
|
-
import { s as styles } from './tree-selector-item-
|
|
10
|
+
import { s as styles } from './tree-selector-item-CZrRpLjj.js';
|
|
11
11
|
import '@hh.ru/magritte-ui-checkbox-radio';
|
|
12
12
|
import '@hh.ru/magritte-ui-cell';
|
|
13
13
|
|
package/ItemsList.js
CHANGED
|
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
3
3
|
import { useRef, useMemo, useCallback, useEffect } from 'react';
|
|
4
4
|
import { useVirtualizer } from '@tanstack/react-virtual';
|
|
5
5
|
import { Item } from './Item.js';
|
|
6
|
-
import { s as styles } from './tree-selector-item-
|
|
6
|
+
import { s as styles } from './tree-selector-item-CZrRpLjj.js';
|
|
7
7
|
import 'classnames';
|
|
8
8
|
import './ItemContent.js';
|
|
9
9
|
import '@hh.ru/magritte-common-keyboard';
|
package/MobileItemsList.js
CHANGED
|
@@ -10,7 +10,7 @@ import { Action } from './Action.js';
|
|
|
10
10
|
import { MobileDelimiter } from './MobileDelimiter.js';
|
|
11
11
|
import { MobileItem } from './MobileItem.js';
|
|
12
12
|
import { MobileParentItem } from './MobileParentItem.js';
|
|
13
|
-
import { s as styles } from './tree-selector-item-
|
|
13
|
+
import { s as styles } from './tree-selector-item-CZrRpLjj.js';
|
|
14
14
|
import '@hh.ru/magritte-ui-checkbox-radio';
|
|
15
15
|
import '@hh.ru/magritte-ui-card';
|
|
16
16
|
import '@hh.ru/magritte-ui-typography';
|
|
@@ -19,6 +19,7 @@ import '@hh.ru/magritte-ui-badge';
|
|
|
19
19
|
|
|
20
20
|
const DEFAULT_ITEM_HEIGHT = 56;
|
|
21
21
|
const SCROLLEND_HANDLER_DEBOUNCE_MS = 150;
|
|
22
|
+
const DELIMITER = ';';
|
|
22
23
|
const MobileItemsListComponent = (props, ref) => {
|
|
23
24
|
const { collection, selected, disabled, leavesOnly, singleChoice, onChange, checkSelectable, getMobileSearchItemOrder, setInputValue, handleChangeInput, isSearch, renderMobileDelimiter, renderItem, contentFilterQuery, getSelectAllParentTrl, renderContentBefore, onMobileNavigationChange, } = props;
|
|
24
25
|
const navigationChangeCallback = useRef(onMobileNavigationChange);
|
|
@@ -54,7 +55,7 @@ const MobileItemsListComponent = (props, ref) => {
|
|
|
54
55
|
}
|
|
55
56
|
const itemIndex = index - (isSelectable ? 1 : 0) - (withContentBefore ? 1 : 0);
|
|
56
57
|
const item = sortedItems[itemIndex];
|
|
57
|
-
return currentParentId ? `${currentParentId}${item.id}` : `${item.id}`;
|
|
58
|
+
return currentParentId ? `${currentParentId}${DELIMITER}${item.id}` : `${item.id}`;
|
|
58
59
|
};
|
|
59
60
|
const virtualizer = useVirtualizer({
|
|
60
61
|
count,
|
|
@@ -104,7 +105,7 @@ const MobileItemsListComponent = (props, ref) => {
|
|
|
104
105
|
parentRef.current = node ? node.parentElement : null;
|
|
105
106
|
}, []);
|
|
106
107
|
useEffect(() => {
|
|
107
|
-
virtualizer.
|
|
108
|
+
virtualizer.scrollToIndex(0);
|
|
108
109
|
}, [currentParentId, sortedItems, virtualizer]);
|
|
109
110
|
return (jsx("div", { ref: refCallback, className: styles.virtualizedList, style: {
|
|
110
111
|
height: `${virtualizer.getTotalSize()}px`,
|
package/MobileItemsList.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MobileItemsList.js","sources":["../src/MobileItemsList.tsx"],"sourcesContent":["import {\n ReactElement,\n useMemo,\n useState,\n useImperativeHandle,\n forwardRef,\n ForwardedRef,\n useRef,\n useEffect,\n RefCallback,\n useCallback,\n} from 'react';\nimport { useVirtualizer } from '@tanstack/react-virtual';\nimport classnames from 'classnames';\n\nimport { debounce } from '@hh.ru/magritte-common-func-utils';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { CheckableCardElement } from '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';\nimport { Action } from '@hh.ru/magritte-ui-tree-selector/Action';\nimport { MobileDelimiter } from '@hh.ru/magritte-ui-tree-selector/MobileDelimiter';\nimport { MobileItem } from '@hh.ru/magritte-ui-tree-selector/MobileItem';\nimport { MobileParentItem } from '@hh.ru/magritte-ui-tree-selector/MobileParentItem';\nimport { AdditionalDefault, TreeModel } from '@hh.ru/magritte-ui-tree-selector/collection/types';\nimport { ListControls, TreeSelectorDummyProps } from '@hh.ru/magritte-ui-tree-selector/types';\n\nimport styles from './tree-selector-item.less';\n\nconst DEFAULT_ITEM_HEIGHT = 56;\nconst SCROLLEND_HANDLER_DEBOUNCE_MS = 150;\n\ntype MobileItemsListProps<Additional extends AdditionalDefault> = {\n selected: string[];\n disabled: string[];\n getMobileSearchItemOrder: (model: TreeModel<Additional>) => number;\n setInputValue: (newValue: string) => void;\n handleChangeInput: (newValue: string) => void;\n contentFilterQuery: string;\n isSearch: boolean;\n} & Pick<\n TreeSelectorDummyProps<Additional>,\n | 'collection'\n | 'leavesOnly'\n | 'singleChoice'\n | 'checkSelectable'\n | 'onChange'\n | 'renderItem'\n | 'renderMobileDelimiter'\n | 'onMobileNavigationChange'\n | 'getSelectAllParentTrl'\n | 'renderContentBefore'\n>;\n\nconst MobileItemsListComponent = <Additional extends AdditionalDefault>(\n props: MobileItemsListProps<Additional>,\n ref: ForwardedRef<ListControls>\n): ReactElement => {\n const {\n collection,\n selected,\n disabled,\n leavesOnly,\n singleChoice,\n onChange,\n checkSelectable,\n getMobileSearchItemOrder,\n setInputValue,\n handleChangeInput,\n isSearch,\n renderMobileDelimiter,\n renderItem,\n contentFilterQuery,\n getSelectAllParentTrl,\n renderContentBefore,\n onMobileNavigationChange,\n } = props;\n const navigationChangeCallback = useRef(onMobileNavigationChange);\n navigationChangeCallback.current = onMobileNavigationChange;\n const prevParentIds = useRef<(string | undefined)[]>([]);\n const prevQueries = useRef<string[]>([]);\n const currentQuery = useRef(contentFilterQuery);\n const [currentParentId, setCurrentParentId] = useState<string | undefined>();\n const items = useMemo(\n () => (currentParentId ? collection.getChildren(currentParentId) : collection.getTopLevel()),\n [currentParentId, collection]\n );\n const orderHashMap = useMemo(() => {\n return items.reduce<Record<TreeModel<Additional>['id'], number>>((acc, item) => {\n acc[item.id] = isSearch && !currentParentId ? getMobileSearchItemOrder(item) : 0;\n return acc;\n }, {});\n }, [items, isSearch, currentParentId, getMobileSearchItemOrder]);\n\n const sortedItems = useMemo(() => {\n return items.sort((itemA, itemB) => {\n return orderHashMap[itemA.id] - orderHashMap[itemB.id];\n });\n }, [items, orderHashMap]);\n\n const isSelectable = currentParentId && !leavesOnly && checkSelectable?.(currentParentId, collection);\n const withContentBefore = !!renderContentBefore;\n const count = items.length + (isSelectable ? 1 : 0) + (withContentBefore ? 1 : 0);\n const parentRef = useRef<HTMLElement | null>(null);\n const isScrolling = useRef(false);\n\n const getItemKey = (index: number) => {\n if (withContentBefore && index === 0) {\n return 'promo';\n }\n\n const isSelectAllItem =\n isSelectable && ((index === 0 && !withContentBefore) || (index === 1 && withContentBefore));\n\n if (isSelectAllItem) {\n return `current${currentParentId}`;\n }\n\n const itemIndex = index - (isSelectable ? 1 : 0) - (withContentBefore ? 1 : 0);\n const item = sortedItems[itemIndex];\n\n return currentParentId ? `${currentParentId}${item.id}` : `${item.id}`;\n };\n\n const virtualizer = useVirtualizer({\n count,\n getScrollElement: () => parentRef.current,\n estimateSize: () => DEFAULT_ITEM_HEIGHT,\n getItemKey,\n });\n\n const itemsVirtualizer = virtualizer.getVirtualItems();\n\n useEffect(() => {\n setCurrentParentId(undefined);\n prevParentIds.current = [];\n prevQueries.current = [];\n navigationChangeCallback.current?.(undefined);\n currentQuery.current = contentFilterQuery;\n }, [contentFilterQuery]);\n\n useImperativeHandle(\n ref,\n () => ({\n back: () => {\n if (!isScrolling.current) {\n const prevParentId = prevParentIds.current.pop();\n setCurrentParentId(prevParentId);\n navigationChangeCallback.current?.(prevParentId);\n if (prevQueries.current.length) {\n const prevInputValue = prevQueries.current.pop() as string;\n setInputValue(prevInputValue);\n currentQuery.current = prevInputValue;\n } else {\n handleChangeInput('');\n }\n }\n },\n }),\n [handleChangeInput, setInputValue]\n );\n\n useEffect(() => {\n const handleScrollEnd = debounce(() => {\n isScrolling.current = false;\n }, SCROLLEND_HANDLER_DEBOUNCE_MS);\n\n const handleScroll = () => {\n isScrolling.current = true;\n handleScrollEnd();\n };\n parentRef.current?.addEventListener('scroll', handleScroll);\n\n return () => {\n parentRef.current?.removeEventListener('scroll', handleScroll);\n };\n }, []);\n\n const refCallback: RefCallback<HTMLDivElement> = useCallback((node) => {\n parentRef.current = node ? node.parentElement : null;\n }, []);\n\n useEffect(() => {\n virtualizer.scrollToOffset(0);\n }, [currentParentId, sortedItems, virtualizer]);\n\n return (\n <div\n ref={refCallback}\n className={styles.virtualizedList}\n style={{\n height: `${virtualizer.getTotalSize()}px`,\n }}\n >\n {itemsVirtualizer.map((virtualItem) => {\n const isContentBeforeItem = withContentBefore && virtualItem.index === 0;\n const isSelectAllItem =\n isSelectable &&\n ((virtualItem.index === 0 && !withContentBefore) || (virtualItem.index === 1 && withContentBefore));\n\n if (isContentBeforeItem) {\n return (\n <div\n key={virtualItem.key}\n ref={virtualizer.measureElement}\n data-index={virtualItem.index}\n className={styles.virtualizedItem}\n style={{\n transform: `translateY(${virtualItem.start}px)`,\n }}\n >\n {renderContentBefore(isSearch)}\n </div>\n );\n }\n if (isSelectAllItem) {\n return (\n <div\n key={virtualItem.key}\n ref={virtualizer.measureElement}\n data-index={virtualItem.index}\n className={styles.virtualizedItem}\n style={{\n transform: `translateY(${virtualItem.start}px)`,\n }}\n >\n <div className={styles.mobileItem}>\n <CheckableCardElement\n padding={16}\n flexible\n borderRadius={12}\n Element=\"label\"\n checked={selected.includes(currentParentId)}\n data-qa={`tree-selector-select-all-${currentParentId}`}\n >\n <Cell\n Element={'div'}\n disabled={disabled.includes(currentParentId)}\n right={\n <Action\n selected={selected.includes(currentParentId)}\n onChange={onChange}\n id={currentParentId}\n singleChoice={singleChoice}\n />\n }\n >\n <CellText>{getSelectAllParentTrl(currentParentId)}</CellText>\n </Cell>\n </CheckableCardElement>\n </div>\n </div>\n );\n }\n const itemIndex = virtualItem.index - (isSelectable ? 1 : 0) - (withContentBefore ? 1 : 0);\n const item = sortedItems[itemIndex];\n const hasChildren = collection.hasChildren(item.id);\n const hasLetter = item.additional?.char && !isSearch;\n const delimiterContent = renderMobileDelimiter?.({\n item,\n order: orderHashMap[item.id],\n isSearch,\n index: itemIndex,\n isTopLevel: !currentParentId,\n });\n const withGap =\n (!!withContentBefore && virtualItem.index !== 1) || (!withContentBefore && virtualItem.index !== 0);\n return (\n <div\n key={virtualItem.key}\n ref={virtualizer.measureElement}\n data-index={virtualItem.index}\n style={{\n transform: `translateY(${virtualItem.start}px)`,\n }}\n className={classnames(styles.virtualizedItem, {\n [styles.withGap]: withGap,\n })}\n >\n <div className={styles.mobileItem}>\n {hasLetter && <MobileDelimiter>{item.additional?.char}</MobileDelimiter>}\n {delimiterContent && <MobileDelimiter>{delimiterContent}</MobileDelimiter>}\n {hasChildren ? (\n <MobileParentItem\n collection={collection}\n item={item}\n selected={selected}\n onClick={() => {\n prevParentIds.current.push(currentParentId);\n prevQueries.current.push(currentQuery.current);\n setCurrentParentId(item.id);\n setInputValue('');\n currentQuery.current = '';\n navigationChangeCallback.current?.(item.id);\n }}\n parentId={currentParentId}\n isSearch={isSearch}\n renderItem={renderItem}\n />\n ) : (\n <MobileItem\n item={item}\n singleChoice={singleChoice}\n isSelectable={checkSelectable?.(item.id, collection)}\n isSelected={selected.includes(item.id)}\n isDisabled={disabled.includes(item.id)}\n onChange={onChange}\n isSearch={isSearch}\n renderItem={renderItem}\n parentId={currentParentId}\n />\n )}\n </div>\n </div>\n );\n })}\n </div>\n );\n};\n\nexport const MobileItemsList = forwardRef(MobileItemsListComponent) as <Additional extends AdditionalDefault>(\n props: MobileItemsListProps<Additional> & { ref?: ForwardedRef<ListControls> }\n) => ReactElement;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MobileItemsList.js","sources":["../src/MobileItemsList.tsx"],"sourcesContent":["import {\n ReactElement,\n useMemo,\n useState,\n useImperativeHandle,\n forwardRef,\n ForwardedRef,\n useRef,\n useEffect,\n RefCallback,\n useCallback,\n} from 'react';\nimport { useVirtualizer } from '@tanstack/react-virtual';\nimport classnames from 'classnames';\n\nimport { debounce } from '@hh.ru/magritte-common-func-utils';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { CheckableCardElement } from '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';\nimport { Action } from '@hh.ru/magritte-ui-tree-selector/Action';\nimport { MobileDelimiter } from '@hh.ru/magritte-ui-tree-selector/MobileDelimiter';\nimport { MobileItem } from '@hh.ru/magritte-ui-tree-selector/MobileItem';\nimport { MobileParentItem } from '@hh.ru/magritte-ui-tree-selector/MobileParentItem';\nimport { AdditionalDefault, TreeModel } from '@hh.ru/magritte-ui-tree-selector/collection/types';\nimport { ListControls, TreeSelectorDummyProps } from '@hh.ru/magritte-ui-tree-selector/types';\n\nimport styles from './tree-selector-item.less';\n\nconst DEFAULT_ITEM_HEIGHT = 56;\nconst SCROLLEND_HANDLER_DEBOUNCE_MS = 150;\nconst DELIMITER = ';';\n\ntype MobileItemsListProps<Additional extends AdditionalDefault> = {\n selected: string[];\n disabled: string[];\n getMobileSearchItemOrder: (model: TreeModel<Additional>) => number;\n setInputValue: (newValue: string) => void;\n handleChangeInput: (newValue: string) => void;\n contentFilterQuery: string;\n isSearch: boolean;\n} & Pick<\n TreeSelectorDummyProps<Additional>,\n | 'collection'\n | 'leavesOnly'\n | 'singleChoice'\n | 'checkSelectable'\n | 'onChange'\n | 'renderItem'\n | 'renderMobileDelimiter'\n | 'onMobileNavigationChange'\n | 'getSelectAllParentTrl'\n | 'renderContentBefore'\n>;\n\nconst MobileItemsListComponent = <Additional extends AdditionalDefault>(\n props: MobileItemsListProps<Additional>,\n ref: ForwardedRef<ListControls>\n): ReactElement => {\n const {\n collection,\n selected,\n disabled,\n leavesOnly,\n singleChoice,\n onChange,\n checkSelectable,\n getMobileSearchItemOrder,\n setInputValue,\n handleChangeInput,\n isSearch,\n renderMobileDelimiter,\n renderItem,\n contentFilterQuery,\n getSelectAllParentTrl,\n renderContentBefore,\n onMobileNavigationChange,\n } = props;\n const navigationChangeCallback = useRef(onMobileNavigationChange);\n navigationChangeCallback.current = onMobileNavigationChange;\n const prevParentIds = useRef<(string | undefined)[]>([]);\n const prevQueries = useRef<string[]>([]);\n const currentQuery = useRef(contentFilterQuery);\n const [currentParentId, setCurrentParentId] = useState<string | undefined>();\n const items = useMemo(\n () => (currentParentId ? collection.getChildren(currentParentId) : collection.getTopLevel()),\n [currentParentId, collection]\n );\n const orderHashMap = useMemo(() => {\n return items.reduce<Record<TreeModel<Additional>['id'], number>>((acc, item) => {\n acc[item.id] = isSearch && !currentParentId ? getMobileSearchItemOrder(item) : 0;\n return acc;\n }, {});\n }, [items, isSearch, currentParentId, getMobileSearchItemOrder]);\n\n const sortedItems = useMemo(() => {\n return items.sort((itemA, itemB) => {\n return orderHashMap[itemA.id] - orderHashMap[itemB.id];\n });\n }, [items, orderHashMap]);\n\n const isSelectable = currentParentId && !leavesOnly && checkSelectable?.(currentParentId, collection);\n const withContentBefore = !!renderContentBefore;\n const count = items.length + (isSelectable ? 1 : 0) + (withContentBefore ? 1 : 0);\n const parentRef = useRef<HTMLElement | null>(null);\n const isScrolling = useRef(false);\n\n const getItemKey = (index: number) => {\n if (withContentBefore && index === 0) {\n return 'promo';\n }\n\n const isSelectAllItem =\n isSelectable && ((index === 0 && !withContentBefore) || (index === 1 && withContentBefore));\n\n if (isSelectAllItem) {\n return `current${currentParentId}`;\n }\n\n const itemIndex = index - (isSelectable ? 1 : 0) - (withContentBefore ? 1 : 0);\n const item = sortedItems[itemIndex];\n\n return currentParentId ? `${currentParentId}${DELIMITER}${item.id}` : `${item.id}`;\n };\n\n const virtualizer = useVirtualizer({\n count,\n getScrollElement: () => parentRef.current,\n estimateSize: () => DEFAULT_ITEM_HEIGHT,\n getItemKey,\n });\n\n const itemsVirtualizer = virtualizer.getVirtualItems();\n\n useEffect(() => {\n setCurrentParentId(undefined);\n prevParentIds.current = [];\n prevQueries.current = [];\n navigationChangeCallback.current?.(undefined);\n currentQuery.current = contentFilterQuery;\n }, [contentFilterQuery]);\n\n useImperativeHandle(\n ref,\n () => ({\n back: () => {\n if (!isScrolling.current) {\n const prevParentId = prevParentIds.current.pop();\n setCurrentParentId(prevParentId);\n navigationChangeCallback.current?.(prevParentId);\n if (prevQueries.current.length) {\n const prevInputValue = prevQueries.current.pop() as string;\n setInputValue(prevInputValue);\n currentQuery.current = prevInputValue;\n } else {\n handleChangeInput('');\n }\n }\n },\n }),\n [handleChangeInput, setInputValue]\n );\n\n useEffect(() => {\n const handleScrollEnd = debounce(() => {\n isScrolling.current = false;\n }, SCROLLEND_HANDLER_DEBOUNCE_MS);\n\n const handleScroll = () => {\n isScrolling.current = true;\n handleScrollEnd();\n };\n parentRef.current?.addEventListener('scroll', handleScroll);\n\n return () => {\n parentRef.current?.removeEventListener('scroll', handleScroll);\n };\n }, []);\n\n const refCallback: RefCallback<HTMLDivElement> = useCallback((node) => {\n parentRef.current = node ? node.parentElement : null;\n }, []);\n\n useEffect(() => {\n virtualizer.scrollToIndex(0);\n }, [currentParentId, sortedItems, virtualizer]);\n\n return (\n <div\n ref={refCallback}\n className={styles.virtualizedList}\n style={{\n height: `${virtualizer.getTotalSize()}px`,\n }}\n >\n {itemsVirtualizer.map((virtualItem) => {\n const isContentBeforeItem = withContentBefore && virtualItem.index === 0;\n const isSelectAllItem =\n isSelectable &&\n ((virtualItem.index === 0 && !withContentBefore) || (virtualItem.index === 1 && withContentBefore));\n\n if (isContentBeforeItem) {\n return (\n <div\n key={virtualItem.key}\n ref={virtualizer.measureElement}\n data-index={virtualItem.index}\n className={styles.virtualizedItem}\n style={{\n transform: `translateY(${virtualItem.start}px)`,\n }}\n >\n {renderContentBefore(isSearch)}\n </div>\n );\n }\n if (isSelectAllItem) {\n return (\n <div\n key={virtualItem.key}\n ref={virtualizer.measureElement}\n data-index={virtualItem.index}\n className={styles.virtualizedItem}\n style={{\n transform: `translateY(${virtualItem.start}px)`,\n }}\n >\n <div className={styles.mobileItem}>\n <CheckableCardElement\n padding={16}\n flexible\n borderRadius={12}\n Element=\"label\"\n checked={selected.includes(currentParentId)}\n data-qa={`tree-selector-select-all-${currentParentId}`}\n >\n <Cell\n Element={'div'}\n disabled={disabled.includes(currentParentId)}\n right={\n <Action\n selected={selected.includes(currentParentId)}\n onChange={onChange}\n id={currentParentId}\n singleChoice={singleChoice}\n />\n }\n >\n <CellText>{getSelectAllParentTrl(currentParentId)}</CellText>\n </Cell>\n </CheckableCardElement>\n </div>\n </div>\n );\n }\n const itemIndex = virtualItem.index - (isSelectable ? 1 : 0) - (withContentBefore ? 1 : 0);\n const item = sortedItems[itemIndex];\n const hasChildren = collection.hasChildren(item.id);\n const hasLetter = item.additional?.char && !isSearch;\n const delimiterContent = renderMobileDelimiter?.({\n item,\n order: orderHashMap[item.id],\n isSearch,\n index: itemIndex,\n isTopLevel: !currentParentId,\n });\n const withGap =\n (!!withContentBefore && virtualItem.index !== 1) || (!withContentBefore && virtualItem.index !== 0);\n return (\n <div\n key={virtualItem.key}\n ref={virtualizer.measureElement}\n data-index={virtualItem.index}\n style={{\n transform: `translateY(${virtualItem.start}px)`,\n }}\n className={classnames(styles.virtualizedItem, {\n [styles.withGap]: withGap,\n })}\n >\n <div className={styles.mobileItem}>\n {hasLetter && <MobileDelimiter>{item.additional?.char}</MobileDelimiter>}\n {delimiterContent && <MobileDelimiter>{delimiterContent}</MobileDelimiter>}\n {hasChildren ? (\n <MobileParentItem\n collection={collection}\n item={item}\n selected={selected}\n onClick={() => {\n prevParentIds.current.push(currentParentId);\n prevQueries.current.push(currentQuery.current);\n setCurrentParentId(item.id);\n setInputValue('');\n currentQuery.current = '';\n navigationChangeCallback.current?.(item.id);\n }}\n parentId={currentParentId}\n isSearch={isSearch}\n renderItem={renderItem}\n />\n ) : (\n <MobileItem\n item={item}\n singleChoice={singleChoice}\n isSelectable={checkSelectable?.(item.id, collection)}\n isSelected={selected.includes(item.id)}\n isDisabled={disabled.includes(item.id)}\n onChange={onChange}\n isSearch={isSearch}\n renderItem={renderItem}\n parentId={currentParentId}\n />\n )}\n </div>\n </div>\n );\n })}\n </div>\n );\n};\n\nexport const MobileItemsList = forwardRef(MobileItemsListComponent) as <Additional extends AdditionalDefault>(\n props: MobileItemsListProps<Additional> & { ref?: ForwardedRef<ListControls> }\n) => ReactElement;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
package/TreeSelector.js
CHANGED
|
@@ -19,7 +19,7 @@ import '@hh.ru/magritte-ui-checkbox-radio';
|
|
|
19
19
|
import './TreeSelectorItemBase.js';
|
|
20
20
|
import '@hh.ru/magritte-ui-cell';
|
|
21
21
|
import '@hh.ru/magritte-ui-typography';
|
|
22
|
-
import './tree-selector-item-
|
|
22
|
+
import './tree-selector-item-CZrRpLjj.js';
|
|
23
23
|
import './MobileItemsList.js';
|
|
24
24
|
import '@hh.ru/magritte-common-func-utils';
|
|
25
25
|
import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
|
package/TreeSelectorDummy.js
CHANGED
|
@@ -21,7 +21,7 @@ import '@hh.ru/magritte-ui-checkbox-radio';
|
|
|
21
21
|
import './TreeSelectorItemBase.js';
|
|
22
22
|
import '@hh.ru/magritte-ui-cell';
|
|
23
23
|
import '@hh.ru/magritte-ui-typography';
|
|
24
|
-
import './tree-selector-item-
|
|
24
|
+
import './tree-selector-item-CZrRpLjj.js';
|
|
25
25
|
import '@hh.ru/magritte-common-func-utils';
|
|
26
26
|
import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
|
|
27
27
|
import './MobileDelimiter.js';
|
package/TreeSelectorWrapper.js
CHANGED
|
@@ -1,41 +1,15 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { useRef, useContext,
|
|
4
|
-
import { throttle } from '@hh.ru/magritte-common-func-utils';
|
|
3
|
+
import { useRef, useContext, useEffect, isValidElement } from 'react';
|
|
5
4
|
import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
|
|
6
5
|
import { CustomScrollContext } from '@hh.ru/magritte-internal-custom-scroll';
|
|
7
6
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
return !Number.isNaN(result) ? result : 0;
|
|
11
|
-
};
|
|
7
|
+
var styles = {"wrapper":"magritte-wrapper___EzesX_5-1-0"};
|
|
8
|
+
|
|
12
9
|
const TreeSelectorWrapper = ({ forwardRef, ...props }) => {
|
|
13
10
|
const wrapperRef = useRef(null);
|
|
14
11
|
const wrapperMultiRef = useMultipleRefs(wrapperRef, forwardRef);
|
|
15
12
|
const scrollContext = useContext(CustomScrollContext);
|
|
16
|
-
// eslint-disable-next-line disable-autofix/react-hooks/exhaustive-deps
|
|
17
|
-
const calcHeight = useCallback(throttle(() => {
|
|
18
|
-
if (!wrapperRef.current?.parentElement) {
|
|
19
|
-
return;
|
|
20
|
-
}
|
|
21
|
-
const parentHeight = wrapperRef.current.parentElement.getBoundingClientRect().height;
|
|
22
|
-
const style = window.getComputedStyle(wrapperRef.current.parentElement) || {};
|
|
23
|
-
const paddingTop = toNumber(style.paddingTop || '0');
|
|
24
|
-
const paddingBottom = toNumber(style.paddingBottom || '0');
|
|
25
|
-
const borderTop = toNumber(style.borderTop || '0');
|
|
26
|
-
const borderBottom = toNumber(style.borderBottom || '0');
|
|
27
|
-
// срабатывает до старта анимации модала, поэтому можно использовать getBoundingClientRect
|
|
28
|
-
const height = parentHeight - paddingTop - paddingBottom - borderTop - borderBottom;
|
|
29
|
-
wrapperRef.current.style.height = `${height}px`;
|
|
30
|
-
}, 50), []);
|
|
31
|
-
useLayoutEffect(() => {
|
|
32
|
-
if (!wrapperRef.current?.parentElement) {
|
|
33
|
-
return void 0;
|
|
34
|
-
}
|
|
35
|
-
const parentObserver = new ResizeObserver(calcHeight);
|
|
36
|
-
parentObserver.observe(wrapperRef.current.parentElement);
|
|
37
|
-
return () => parentObserver.disconnect();
|
|
38
|
-
}, [calcHeight]);
|
|
39
13
|
useEffect(() => {
|
|
40
14
|
const wrapperElement = wrapperRef.current;
|
|
41
15
|
if (!wrapperElement || !scrollContext) {
|
|
@@ -47,7 +21,7 @@ const TreeSelectorWrapper = ({ forwardRef, ...props }) => {
|
|
|
47
21
|
wrapperElement.addEventListener('touchmove', handleTouchMove);
|
|
48
22
|
return () => wrapperElement.removeEventListener('touchmove', handleTouchMove);
|
|
49
23
|
}, [scrollContext]);
|
|
50
|
-
return jsx("div", {
|
|
24
|
+
return jsx("div", { className: styles.wrapper, ref: wrapperMultiRef, "data-qa": "tree-selector-container", ...props });
|
|
51
25
|
};
|
|
52
26
|
TreeSelectorWrapper.isTreeSelectorWrapper = true;
|
|
53
27
|
const isValidTreeSelectorWrapper = (component) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeSelectorWrapper.js","sources":["../src/TreeSelectorWrapper.tsx"],"sourcesContent":["import {\n ReactNode,\n PropsWithChildren,\n useRef,\n
|
|
1
|
+
{"version":3,"file":"TreeSelectorWrapper.js","sources":["../src/TreeSelectorWrapper.tsx"],"sourcesContent":["import {\n ReactNode,\n PropsWithChildren,\n useRef,\n useEffect,\n useContext,\n ForwardedRef,\n ReactElement,\n isValidElement,\n} from 'react';\n\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { CustomScrollContext } from '@hh.ru/magritte-internal-custom-scroll';\nimport { FcWithFlag } from '@hh.ru/magritte-types';\n\nimport styles from './wrapper.less';\n\ninterface TreeSelectorWrapperProps extends PropsWithChildren {\n forwardRef: ForwardedRef<HTMLDivElement>;\n}\n\nexport const TreeSelectorWrapper: FcWithFlag<TreeSelectorWrapperProps, 'isTreeSelectorWrapper'> = ({\n forwardRef,\n ...props\n}) => {\n const wrapperRef = useRef<HTMLDivElement>(null);\n const wrapperMultiRef = useMultipleRefs(wrapperRef, forwardRef);\n const scrollContext = useContext(CustomScrollContext);\n\n useEffect(() => {\n const wrapperElement = wrapperRef.current;\n if (!wrapperElement || !scrollContext) {\n return void 0;\n }\n\n const handleTouchMove = (event: TouchEvent) => {\n event.stopPropagation();\n };\n\n wrapperElement.addEventListener('touchmove', handleTouchMove);\n return () => wrapperElement.removeEventListener('touchmove', handleTouchMove);\n }, [scrollContext]);\n\n return <div className={styles.wrapper} ref={wrapperMultiRef} data-qa=\"tree-selector-container\" {...props} />;\n};\n\nTreeSelectorWrapper.isTreeSelectorWrapper = true;\n\nexport const isValidTreeSelectorWrapper = (\n component: ReactNode\n): component is ReactElement<TreeSelectorWrapperProps> => {\n return (\n isValidElement(component) && typeof component.type === 'function' && 'isTreeSelectorWrapper' in component.type\n );\n};\n"],"names":["_jsx"],"mappings":";;;;;;;AAqBO,MAAM,mBAAmB,GAAkE,CAAC,EAC/F,UAAU,EACV,GAAG,KAAK,EACX,KAAI;AACD,IAAA,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,MAAM,eAAe,GAAG,eAAe,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;AAChE,IAAA,MAAM,aAAa,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAEtD,SAAS,CAAC,MAAK;AACX,QAAA,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAC;AAC1C,QAAA,IAAI,CAAC,cAAc,IAAI,CAAC,aAAa,EAAE;YACnC,OAAO,KAAK,CAAC,CAAC;SACjB;AAED,QAAA,MAAM,eAAe,GAAG,CAAC,KAAiB,KAAI;YAC1C,KAAK,CAAC,eAAe,EAAE,CAAC;AAC5B,SAAC,CAAC;AAEF,QAAA,cAAc,CAAC,gBAAgB,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC;QAC9D,OAAO,MAAM,cAAc,CAAC,mBAAmB,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC;AAClF,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AAEpB,IAAA,OAAOA,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,GAAG,EAAE,eAAe,EAAU,SAAA,EAAA,yBAAyB,EAAK,GAAA,KAAK,GAAI,CAAC;AACjH,EAAE;AAEF,mBAAmB,CAAC,qBAAqB,GAAG,IAAI,CAAC;AAEpC,MAAA,0BAA0B,GAAG,CACtC,SAAoB,KACiC;AACrD,IAAA,QACI,cAAc,CAAC,SAAS,CAAC,IAAI,OAAO,SAAS,CAAC,IAAI,KAAK,UAAU,IAAI,uBAAuB,IAAI,SAAS,CAAC,IAAI,EAChH;AACN;;;;"}
|
package/index.css
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
--magritte-semantic-animation-ease-in-out-200-timing-function-v22-1-0:cubic-bezier(0.25, 0.1, 0.25, 1);
|
|
5
5
|
--magritte-semantic-animation-ease-in-out-200-duration-v22-1-0:200ms;
|
|
6
6
|
}
|
|
7
|
-
@keyframes magritte-fade-in___yS4Ja_5-0
|
|
7
|
+
@keyframes magritte-fade-in___yS4Ja_5-1-0{
|
|
8
8
|
0%{
|
|
9
9
|
opacity:0;
|
|
10
10
|
}
|
|
@@ -12,24 +12,24 @@
|
|
|
12
12
|
opacity:1;
|
|
13
13
|
}
|
|
14
14
|
}
|
|
15
|
-
.magritte-item-animation-timeout___pbOyZ_5-0
|
|
16
|
-
animation-name:magritte-fade-in___yS4Ja_5-0
|
|
15
|
+
.magritte-item-animation-timeout___pbOyZ_5-1-0{
|
|
16
|
+
animation-name:magritte-fade-in___yS4Ja_5-1-0;
|
|
17
17
|
animation-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v22-1-0);
|
|
18
18
|
--animation-duration:0ms;
|
|
19
19
|
animation-duration:var(--animation-duration);
|
|
20
20
|
}
|
|
21
21
|
@media (prefers-reduced-motion: no-preference){
|
|
22
|
-
.magritte-item-animation-timeout___pbOyZ_5-0
|
|
22
|
+
.magritte-item-animation-timeout___pbOyZ_5-1-0{
|
|
23
23
|
--animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v22-1-0);
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
|
-
.magritte-wrapper___GHKV6_5-0
|
|
26
|
+
.magritte-wrapper___GHKV6_5-1-0{
|
|
27
27
|
display:flex;
|
|
28
28
|
padding:12px 0;
|
|
29
29
|
gap:12px;
|
|
30
30
|
align-items:flex-start;
|
|
31
31
|
}
|
|
32
|
-
.magritte-letter___yZOCU_5-0
|
|
32
|
+
.magritte-letter___yZOCU_5-1-0{
|
|
33
33
|
width:24px;
|
|
34
34
|
height:24px;
|
|
35
35
|
display:flex;
|
|
@@ -37,68 +37,73 @@
|
|
|
37
37
|
justify-content:center;
|
|
38
38
|
flex-shrink:0;
|
|
39
39
|
}
|
|
40
|
-
.magritte-icon___kO3Fj_5-0
|
|
41
|
-
.magritte-space___xTO79_5-0
|
|
40
|
+
.magritte-icon___kO3Fj_5-1-0,
|
|
41
|
+
.magritte-space___xTO79_5-1-0{
|
|
42
42
|
flex-shrink:0;
|
|
43
43
|
line-height:0;
|
|
44
44
|
width:24px;
|
|
45
45
|
}
|
|
46
|
-
.magritte-icon___kO3Fj_5-0
|
|
46
|
+
.magritte-icon___kO3Fj_5-1-0{
|
|
47
47
|
transform:rotate(0);
|
|
48
48
|
}
|
|
49
|
-
.magritte-wrapperActive___Hwk8p_5-0
|
|
50
|
-
.magritte-iconActive___4yrG5_5-0
|
|
49
|
+
.magritte-wrapperActive___Hwk8p_5-1-0,
|
|
50
|
+
.magritte-iconActive___4yrG5_5-1-0{
|
|
51
51
|
cursor:pointer;
|
|
52
52
|
}
|
|
53
|
-
.magritte-iconUp___mpXV6_5-0
|
|
53
|
+
.magritte-iconUp___mpXV6_5-1-0{
|
|
54
54
|
transform:rotate(90deg);
|
|
55
55
|
}
|
|
56
56
|
@media (prefers-reduced-motion: no-preference){
|
|
57
|
-
.magritte-icon___kO3Fj_5-0
|
|
57
|
+
.magritte-icon___kO3Fj_5-1-0{
|
|
58
58
|
transition-property:transform;
|
|
59
59
|
transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v22-1-0);
|
|
60
60
|
transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v22-1-0);
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
|
-
.magritte-content___ZRc6R_5-0
|
|
63
|
+
.magritte-content___ZRc6R_5-1-0{
|
|
64
64
|
flex-grow:1;
|
|
65
65
|
}
|
|
66
|
-
.magritte-mobile-item___ynALC_5-0
|
|
66
|
+
.magritte-mobile-item___ynALC_5-1-0{
|
|
67
67
|
display:flex;
|
|
68
68
|
gap:12px;
|
|
69
69
|
flex-wrap:wrap;
|
|
70
70
|
}
|
|
71
|
-
.magritte-with-gap___gbvGO_5-0
|
|
71
|
+
.magritte-with-gap___gbvGO_5-1-0{
|
|
72
72
|
padding-top:12px;
|
|
73
73
|
}
|
|
74
|
-
.magritte-virtualized-list___qt2E6_5-0
|
|
74
|
+
.magritte-virtualized-list___qt2E6_5-1-0{
|
|
75
75
|
width:100%;
|
|
76
76
|
position:relative;
|
|
77
77
|
will-change:transform;
|
|
78
78
|
}
|
|
79
|
-
.magritte-virtualized-item___qAYVN_5-0
|
|
79
|
+
.magritte-virtualized-item___qAYVN_5-1-0{
|
|
80
80
|
position:absolute;
|
|
81
81
|
top:0;
|
|
82
82
|
left:0;
|
|
83
83
|
width:100%;
|
|
84
84
|
}
|
|
85
|
-
.magritte-was-expanded___uCFbW_5-0
|
|
86
|
-
animation-name:magritte-fade-in___yS4Ja_5-0
|
|
85
|
+
.magritte-was-expanded___uCFbW_5-1-0{
|
|
86
|
+
animation-name:magritte-fade-in___yS4Ja_5-1-0;
|
|
87
87
|
animation-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v22-1-0);
|
|
88
88
|
--animation-duration:0ms;
|
|
89
89
|
animation-duration:var(--animation-duration);
|
|
90
90
|
}
|
|
91
91
|
@media (prefers-reduced-motion: no-preference){
|
|
92
|
-
.magritte-was-expanded___uCFbW_5-0
|
|
92
|
+
.magritte-was-expanded___uCFbW_5-1-0{
|
|
93
93
|
--animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v22-1-0);
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
96
|
|
|
97
|
+
.magritte-wrapper___EzesX_5-1-0{
|
|
98
|
+
height:100%;
|
|
99
|
+
overflow:auto;
|
|
100
|
+
}
|
|
101
|
+
|
|
97
102
|
:root{
|
|
98
103
|
--magritte-semantic-animation-ease-in-out-200-timing-function-v22-1-0:cubic-bezier(0.25, 0.1, 0.25, 1);
|
|
99
104
|
--magritte-semantic-animation-ease-in-out-200-duration-v22-1-0:200ms;
|
|
100
105
|
}
|
|
101
|
-
@keyframes magritte-fade-in___FDoho_5-0
|
|
106
|
+
@keyframes magritte-fade-in___FDoho_5-1-0{
|
|
102
107
|
0%{
|
|
103
108
|
opacity:0;
|
|
104
109
|
}
|
|
@@ -106,14 +111,14 @@
|
|
|
106
111
|
opacity:1;
|
|
107
112
|
}
|
|
108
113
|
}
|
|
109
|
-
.magritte-item-animation-timeout___Pdli9_5-0
|
|
110
|
-
animation-name:magritte-fade-in___FDoho_5-0
|
|
114
|
+
.magritte-item-animation-timeout___Pdli9_5-1-0{
|
|
115
|
+
animation-name:magritte-fade-in___FDoho_5-1-0;
|
|
111
116
|
animation-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v22-1-0);
|
|
112
117
|
--animation-duration:0ms;
|
|
113
118
|
animation-duration:var(--animation-duration);
|
|
114
119
|
}
|
|
115
120
|
@media (prefers-reduced-motion: no-preference){
|
|
116
|
-
.magritte-item-animation-timeout___Pdli9_5-0
|
|
121
|
+
.magritte-item-animation-timeout___Pdli9_5-1-0{
|
|
117
122
|
--animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v22-1-0);
|
|
118
123
|
}
|
|
119
124
|
}
|
package/index.js
CHANGED
|
@@ -26,7 +26,7 @@ import '@hh.ru/magritte-ui-icon/icon';
|
|
|
26
26
|
import './Action.js';
|
|
27
27
|
import '@hh.ru/magritte-ui-checkbox-radio';
|
|
28
28
|
import '@hh.ru/magritte-ui-typography';
|
|
29
|
-
import './tree-selector-item-
|
|
29
|
+
import './tree-selector-item-CZrRpLjj.js';
|
|
30
30
|
import './MobileItemsList.js';
|
|
31
31
|
import '@hh.ru/magritte-common-func-utils';
|
|
32
32
|
import '@hh.ru/magritte-ui-cell';
|
package/index.mock.js
CHANGED
|
@@ -10,7 +10,6 @@ import './strategy/createTreeCollectionToggler.js';
|
|
|
10
10
|
import './strategy/dummyToggle.js';
|
|
11
11
|
import 'react/jsx-runtime';
|
|
12
12
|
import 'react';
|
|
13
|
-
import '@hh.ru/magritte-common-func-utils';
|
|
14
13
|
import '@hh.ru/magritte-common-use-multiple-refs';
|
|
15
14
|
import '@hh.ru/magritte-internal-custom-scroll';
|
|
16
15
|
|
package/index.mock.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mock.js","sources":["../src/index.mock.ts"],"sourcesContent":["import { ForwardRefExoticComponent } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\nimport TreeCollection from '@hh.ru/magritte-ui-tree-selector/collection/treeCollection';\nimport ImmutableSelectionStrategy from '@hh.ru/magritte-ui-tree-selector/strategy/immutableSelectionStrategy';\n\nexport * from '@hh.ru/magritte-ui-tree-selector/types';\nexport * from '@hh.ru/magritte-ui-tree-selector/collection/types';\nexport * from '@hh.ru/magritte-ui-tree-selector/collection/treeCollectionHelper';\nexport { isValidTreeSelectorWrapper } from '@hh.ru/magritte-ui-tree-selector/TreeSelectorWrapper';\nexport { TreeCollection, ImmutableSelectionStrategy };\n\nexport const TreeSelector: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n 'TreeSelector',\n undefined,\n { withChildren: true }\n);\n\nexport const TreeSelectorDummy: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n 'TreeSelectorDummy',\n undefined,\n {\n withChildren: true,\n }\n);\n\nexport const TreeSelectorItemBase = mockComponent('TreeSelectorItemBase');\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mock.js","sources":["../src/index.mock.ts"],"sourcesContent":["import { ForwardRefExoticComponent } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\nimport TreeCollection from '@hh.ru/magritte-ui-tree-selector/collection/treeCollection';\nimport ImmutableSelectionStrategy from '@hh.ru/magritte-ui-tree-selector/strategy/immutableSelectionStrategy';\n\nexport * from '@hh.ru/magritte-ui-tree-selector/types';\nexport * from '@hh.ru/magritte-ui-tree-selector/collection/types';\nexport * from '@hh.ru/magritte-ui-tree-selector/collection/treeCollectionHelper';\nexport { isValidTreeSelectorWrapper } from '@hh.ru/magritte-ui-tree-selector/TreeSelectorWrapper';\nexport { TreeCollection, ImmutableSelectionStrategy };\n\nexport const TreeSelector: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n 'TreeSelector',\n undefined,\n { withChildren: true }\n);\n\nexport const TreeSelectorDummy: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n 'TreeSelectorDummy',\n undefined,\n {\n withChildren: true,\n }\n);\n\nexport const TreeSelectorItemBase = mockComponent('TreeSelectorItemBase');\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAYa,MAAA,YAAY,GAAuD,aAAa,CACzF,cAAc,EACd,SAAS,EACT,EAAE,YAAY,EAAE,IAAI,EAAE,EACxB;MAEW,iBAAiB,GAAuD,aAAa,CAC9F,mBAAmB,EACnB,SAAS,EACT;AACI,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA,EACH;MAEW,oBAAoB,GAAG,aAAa,CAAC,sBAAsB;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hh.ru/magritte-ui-tree-selector",
|
|
3
|
-
"version": "5.0
|
|
3
|
+
"version": "5.1.0",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"sideEffects": [
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"publishConfig": {
|
|
49
49
|
"access": "public"
|
|
50
50
|
},
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "a5111c75e95a1ac4141d87db1e7c64d48a5786b8"
|
|
52
52
|
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import './index.css';
|
|
2
|
+
var styles = {"item-animation-timeout":"magritte-item-animation-timeout___pbOyZ_5-1-0","itemAnimationTimeout":"magritte-item-animation-timeout___pbOyZ_5-1-0","fade-in":"magritte-fade-in___yS4Ja_5-1-0","fadeIn":"magritte-fade-in___yS4Ja_5-1-0","wrapper":"magritte-wrapper___GHKV6_5-1-0","letter":"magritte-letter___yZOCU_5-1-0","icon":"magritte-icon___kO3Fj_5-1-0","space":"magritte-space___xTO79_5-1-0","wrapperActive":"magritte-wrapperActive___Hwk8p_5-1-0","iconActive":"magritte-iconActive___4yrG5_5-1-0","iconUp":"magritte-iconUp___mpXV6_5-1-0","content":"magritte-content___ZRc6R_5-1-0","mobile-item":"magritte-mobile-item___ynALC_5-1-0","mobileItem":"magritte-mobile-item___ynALC_5-1-0","with-gap":"magritte-with-gap___gbvGO_5-1-0","withGap":"magritte-with-gap___gbvGO_5-1-0","virtualized-list":"magritte-virtualized-list___qt2E6_5-1-0","virtualizedList":"magritte-virtualized-list___qt2E6_5-1-0","virtualized-item":"magritte-virtualized-item___qAYVN_5-1-0","virtualizedItem":"magritte-virtualized-item___qAYVN_5-1-0","was-expanded":"magritte-was-expanded___uCFbW_5-1-0","wasExpanded":"magritte-was-expanded___uCFbW_5-1-0"};
|
|
3
|
+
|
|
4
|
+
export { styles as s };
|
|
5
|
+
//# sourceMappingURL=tree-selector-item-CZrRpLjj.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tree-selector-item-CZrRpLjj.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
package/useAnimationTimeout.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { useState, useLayoutEffect } from 'react';
|
|
3
3
|
|
|
4
|
-
var styles = {"item-animation-timeout":"magritte-item-animation-timeout___Pdli9_5-0
|
|
4
|
+
var styles = {"item-animation-timeout":"magritte-item-animation-timeout___Pdli9_5-1-0","itemAnimationTimeout":"magritte-item-animation-timeout___Pdli9_5-1-0","fade-in":"magritte-fade-in___FDoho_5-1-0","fadeIn":"magritte-fade-in___FDoho_5-1-0"};
|
|
5
5
|
|
|
6
6
|
const useAnimationTimeout = () => {
|
|
7
7
|
const [animationTimeout, setAnimationTimeout] = useState(0);
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import './index.css';
|
|
2
|
-
var styles = {"item-animation-timeout":"magritte-item-animation-timeout___pbOyZ_5-0-3","itemAnimationTimeout":"magritte-item-animation-timeout___pbOyZ_5-0-3","fade-in":"magritte-fade-in___yS4Ja_5-0-3","fadeIn":"magritte-fade-in___yS4Ja_5-0-3","wrapper":"magritte-wrapper___GHKV6_5-0-3","letter":"magritte-letter___yZOCU_5-0-3","icon":"magritte-icon___kO3Fj_5-0-3","space":"magritte-space___xTO79_5-0-3","wrapperActive":"magritte-wrapperActive___Hwk8p_5-0-3","iconActive":"magritte-iconActive___4yrG5_5-0-3","iconUp":"magritte-iconUp___mpXV6_5-0-3","content":"magritte-content___ZRc6R_5-0-3","mobile-item":"magritte-mobile-item___ynALC_5-0-3","mobileItem":"magritte-mobile-item___ynALC_5-0-3","with-gap":"magritte-with-gap___gbvGO_5-0-3","withGap":"magritte-with-gap___gbvGO_5-0-3","virtualized-list":"magritte-virtualized-list___qt2E6_5-0-3","virtualizedList":"magritte-virtualized-list___qt2E6_5-0-3","virtualized-item":"magritte-virtualized-item___qAYVN_5-0-3","virtualizedItem":"magritte-virtualized-item___qAYVN_5-0-3","was-expanded":"magritte-was-expanded___uCFbW_5-0-3","wasExpanded":"magritte-was-expanded___uCFbW_5-0-3"};
|
|
3
|
-
|
|
4
|
-
export { styles as s };
|
|
5
|
-
//# sourceMappingURL=tree-selector-item-DA_-Xlv-.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tree-selector-item-DA_-Xlv-.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|