@astral/ui 4.92.3 → 4.93.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/components/BottomDrawer/index.d.ts +1 -1
- package/components/BottomDrawer/index.js +1 -1
- package/components/ClickAwayListener/ClickAwayListener.d.ts +1 -1
- package/components/ClickAwayListener/ClickAwayListener.js +8 -2
- package/components/Radio/Radio.js +1 -1
- package/components/Radio/constants.d.ts +3 -0
- package/components/Radio/constants.js +3 -0
- package/components/Radio/index.d.ts +1 -1
- package/components/Radio/index.js +1 -1
- package/components/Radio/styles.js +9 -9
- package/components/Tree/MultipleTreeList/MultipleTreeList.js +2 -2
- package/components/Tree/MultipleTreeList/TreeItem/TreeItem.js +4 -7
- package/components/Tree/MultipleTreeList/TreeItem/styles.d.ts +1 -17
- package/components/Tree/MultipleTreeList/TreeItem/styles.js +19 -2
- package/components/Tree/MultipleTreeList/TreeItem/useLogic/useLogic.d.ts +4 -1
- package/components/Tree/MultipleTreeList/TreeItem/useLogic/useLogic.js +8 -2
- package/components/Tree/MultipleTreeList/styles.d.ts +4 -0
- package/components/Tree/MultipleTreeList/styles.js +25 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanel.d.ts +2 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanel.js +11 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/MobileSlidePanelContent.d.ts +2 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/MobileSlidePanelContent.js +50 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/styles.d.ts +404 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/styles.js +172 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/types.d.ts +11 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/types.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/index.d.ts +3 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/index.js +3 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/useDelayedUnmount.d.ts +11 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/useDelayedUnmount.js +18 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/usePanelHeader.d.ts +24 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/usePanelHeader.js +50 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/useRegisterClose.d.ts +13 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/useRegisterClose.js +17 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/useLogic.d.ts +19 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/useLogic.js +39 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContext.d.ts +13 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContext.js +6 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/MobileSlidePanelContextProvider.d.ts +7 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/MobileSlidePanelContextProvider.js +12 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/index.d.ts +2 -0
- package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/index.js +2 -0
- package/components/Tree/TreeItem/MobileSlidePanel/constants.d.ts +11 -0
- package/components/Tree/TreeItem/MobileSlidePanel/constants.js +12 -0
- package/components/Tree/TreeItem/MobileSlidePanel/index.d.ts +2 -0
- package/components/Tree/TreeItem/MobileSlidePanel/index.js +2 -0
- package/components/Tree/TreeItem/MobileSlidePanel/types.d.ts +49 -0
- package/components/Tree/TreeItem/MobileSlidePanel/types.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/usePanelStack.d.ts +14 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/usePanelStack.js +62 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/index.d.ts +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/index.js +1 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/useLogic.d.ts +9 -0
- package/components/Tree/TreeItem/MobileSlidePanel/useLogic/useLogic.js +11 -0
- package/components/Tree/TreeItem/TreeItem.d.ts +2 -1
- package/components/Tree/TreeItem/TreeItem.js +49 -9
- package/components/Tree/TreeItem/constants.d.ts +9 -0
- package/components/Tree/TreeItem/constants.js +9 -0
- package/components/Tree/TreeItem/styles.d.ts +4 -13
- package/components/Tree/TreeItem/styles.js +153 -39
- package/components/Tree/TreeItem/types.d.ts +18 -0
- package/components/Tree/TreeItem/useLogic/useLogic.d.ts +21 -7
- package/components/Tree/TreeItem/useLogic/useLogic.js +40 -2
- package/components/Tree/TreeList/TreeItem/TreeItem.js +5 -5
- package/components/Tree/TreeList/TreeItem/styles.d.ts +19 -0
- package/components/Tree/TreeList/TreeItem/styles.js +36 -0
- package/components/Tree/TreeList/TreeItem/useLogic/useLogic.d.ts +6 -0
- package/components/Tree/TreeList/TreeItem/useLogic/useLogic.js +11 -0
- package/components/Tree/TreeList/TreeList.js +2 -2
- package/components/Tree/TreeList/styles.d.ts +4 -0
- package/components/Tree/TreeList/styles.js +26 -0
- package/components/TreeAsyncAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/components/TreeAsyncAutocomplete/OptionsModal/OptionsModal.js +2 -3
- package/components/TreeAsyncAutocomplete/OptionsModal/styles.d.ts +17 -0
- package/components/TreeAsyncAutocomplete/OptionsModal/styles.js +75 -5
- package/components/TreeAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/components/TreeAutocomplete/OptionsModal/OptionsModal.js +2 -3
- package/components/TreeAutocomplete/OptionsModal/styles.d.ts +17 -0
- package/components/TreeAutocomplete/OptionsModal/styles.js +36 -0
- package/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/components/TreeLikeAsyncAutocomplete/OptionsModal/OptionsModal.js +5 -9
- package/components/TreeLikeAsyncAutocomplete/OptionsModal/styles.d.ts +35 -0
- package/components/TreeLikeAsyncAutocomplete/OptionsModal/styles.js +96 -5
- package/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/useLogic.d.ts +1 -0
- package/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/useLogic.js +17 -2
- package/components/TreeLikeAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/components/TreeLikeAutocomplete/OptionsModal/OptionsModal.js +5 -6
- package/components/TreeLikeAutocomplete/OptionsModal/styles.d.ts +27 -0
- package/components/TreeLikeAutocomplete/OptionsModal/styles.js +44 -1
- package/components/TreeLikeAutocomplete/OptionsModal/useLogic/useLogic.d.ts +1 -0
- package/components/TreeLikeAutocomplete/OptionsModal/useLogic/useLogic.js +14 -1
- package/components/TreeLikeList/TreeItem/TreeItem.js +11 -4
- package/components/TreeLikeList/TreeItem/styles.d.ts +14 -17
- package/components/TreeLikeList/TreeItem/styles.js +48 -1
- package/components/TreeLikeList/TreeItem/useLogic/useLogic.d.ts +8 -2
- package/components/TreeLikeList/TreeItem/useLogic/useLogic.js +35 -13
- package/components/TreeLikeList/TreeLikeList.js +2 -2
- package/components/TreeLikeList/styles.d.ts +4 -0
- package/components/TreeLikeList/styles.js +25 -0
- package/node/components/BottomDrawer/index.d.ts +1 -1
- package/node/components/BottomDrawer/index.js +3 -1
- package/node/components/ClickAwayListener/ClickAwayListener.d.ts +1 -1
- package/node/components/ClickAwayListener/ClickAwayListener.js +8 -2
- package/node/components/Radio/Radio.js +1 -1
- package/node/components/Radio/constants.d.ts +3 -0
- package/node/components/Radio/constants.js +4 -1
- package/node/components/Radio/index.d.ts +1 -1
- package/node/components/Radio/index.js +3 -1
- package/node/components/Radio/styles.js +8 -8
- package/node/components/Tree/MultipleTreeList/MultipleTreeList.js +1 -1
- package/node/components/Tree/MultipleTreeList/TreeItem/TreeItem.js +4 -7
- package/node/components/Tree/MultipleTreeList/TreeItem/styles.d.ts +1 -17
- package/node/components/Tree/MultipleTreeList/TreeItem/styles.js +18 -1
- package/node/components/Tree/MultipleTreeList/TreeItem/useLogic/useLogic.d.ts +4 -1
- package/node/components/Tree/MultipleTreeList/TreeItem/useLogic/useLogic.js +8 -2
- package/node/components/Tree/MultipleTreeList/styles.d.ts +4 -0
- package/node/components/Tree/MultipleTreeList/styles.js +26 -1
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanel.d.ts +2 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanel.js +15 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/MobileSlidePanelContent.d.ts +2 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/MobileSlidePanelContent.js +54 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/styles.d.ts +404 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/styles.js +175 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/types.d.ts +11 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/types.js +2 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/index.d.ts +3 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/index.js +19 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/useDelayedUnmount.d.ts +11 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useDelayedUnmount/useDelayedUnmount.js +22 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/usePanelHeader.d.ts +24 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/usePanelHeader/usePanelHeader.js +54 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/useRegisterClose.d.ts +13 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/hooks/useRegisterClose/useRegisterClose.js +21 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/useLogic.d.ts +19 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/useLogic/useLogic.js +43 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContext.d.ts +13 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContext.js +9 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/MobileSlidePanelContextProvider.d.ts +7 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/MobileSlidePanelContextProvider.js +16 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/MobileSlidePanelContextProvider/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/index.d.ts +2 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContext/index.js +18 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/constants.d.ts +11 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/constants.js +15 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/index.d.ts +2 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/index.js +18 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/types.d.ts +49 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/types.js +2 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/usePanelStack.d.ts +14 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/hooks/usePanelStack/usePanelStack.js +66 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/index.d.ts +1 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/index.js +17 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/useLogic.d.ts +9 -0
- package/node/components/Tree/TreeItem/MobileSlidePanel/useLogic/useLogic.js +15 -0
- package/node/components/Tree/TreeItem/TreeItem.d.ts +2 -1
- package/node/components/Tree/TreeItem/TreeItem.js +48 -9
- package/node/components/Tree/TreeItem/constants.d.ts +9 -0
- package/node/components/Tree/TreeItem/constants.js +10 -1
- package/node/components/Tree/TreeItem/styles.d.ts +4 -13
- package/node/components/Tree/TreeItem/styles.js +153 -39
- package/node/components/Tree/TreeItem/types.d.ts +18 -0
- package/node/components/Tree/TreeItem/useLogic/useLogic.d.ts +21 -7
- package/node/components/Tree/TreeItem/useLogic/useLogic.js +39 -1
- package/node/components/Tree/TreeList/TreeItem/TreeItem.js +4 -4
- package/node/components/Tree/TreeList/TreeItem/styles.d.ts +19 -0
- package/node/components/Tree/TreeList/TreeItem/styles.js +60 -1
- package/node/components/Tree/TreeList/TreeItem/useLogic/useLogic.d.ts +6 -0
- package/node/components/Tree/TreeList/TreeItem/useLogic/useLogic.js +11 -0
- package/node/components/Tree/TreeList/TreeList.js +1 -1
- package/node/components/Tree/TreeList/styles.d.ts +4 -0
- package/node/components/Tree/TreeList/styles.js +27 -1
- package/node/components/TreeAsyncAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/node/components/TreeAsyncAutocomplete/OptionsModal/OptionsModal.js +1 -2
- package/node/components/TreeAsyncAutocomplete/OptionsModal/styles.d.ts +17 -0
- package/node/components/TreeAsyncAutocomplete/OptionsModal/styles.js +76 -6
- package/node/components/TreeAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/node/components/TreeAutocomplete/OptionsModal/OptionsModal.js +1 -2
- package/node/components/TreeAutocomplete/OptionsModal/styles.d.ts +17 -0
- package/node/components/TreeAutocomplete/OptionsModal/styles.js +37 -1
- package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/OptionsModal.js +3 -7
- package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/styles.d.ts +35 -0
- package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/styles.js +97 -6
- package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/useLogic.d.ts +1 -0
- package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/useLogic.js +17 -2
- package/node/components/TreeLikeAutocomplete/OptionsModal/NoData/styles.js +5 -0
- package/node/components/TreeLikeAutocomplete/OptionsModal/OptionsModal.js +3 -4
- package/node/components/TreeLikeAutocomplete/OptionsModal/styles.d.ts +27 -0
- package/node/components/TreeLikeAutocomplete/OptionsModal/styles.js +45 -2
- package/node/components/TreeLikeAutocomplete/OptionsModal/useLogic/useLogic.d.ts +1 -0
- package/node/components/TreeLikeAutocomplete/OptionsModal/useLogic/useLogic.js +14 -1
- package/node/components/TreeLikeList/TreeItem/TreeItem.js +9 -2
- package/node/components/TreeLikeList/TreeItem/styles.d.ts +14 -17
- package/node/components/TreeLikeList/TreeItem/styles.js +48 -1
- package/node/components/TreeLikeList/TreeItem/useLogic/useLogic.d.ts +8 -2
- package/node/components/TreeLikeList/TreeItem/useLogic/useLogic.js +34 -12
- package/node/components/TreeLikeList/TreeLikeList.js +1 -1
- package/node/components/TreeLikeList/styles.d.ts +4 -0
- package/node/components/TreeLikeList/styles.js +26 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export * from './BottomDrawer';
|
|
2
|
-
export { bottomDrawerClassnames } from './constants';
|
|
2
|
+
export { bottomDrawerClassnames, OFFSET_TOP_SCREEN, DEFAULT_HEADER_HEIGHT, } from './constants';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export * from './BottomDrawer';
|
|
2
|
-
export { bottomDrawerClassnames } from './constants';
|
|
2
|
+
export { bottomDrawerClassnames, OFFSET_TOP_SCREEN, DEFAULT_HEADER_HEIGHT, } from './constants';
|
|
@@ -7,4 +7,4 @@ export type ClickAwayListenerProps = Omit<UseClickAwayListenerOptions, 'ref' | '
|
|
|
7
7
|
/**
|
|
8
8
|
* компонент предоставляющий обертку для работы с хуком useClickAwayEffect
|
|
9
9
|
*/
|
|
10
|
-
export declare const ClickAwayListener: ({ onClickAway, preventBubbling, isActive, children, }: ClickAwayListenerProps) => ReactElement<any, string | import("react").JSXElementConstructor<any>>;
|
|
10
|
+
export declare const ClickAwayListener: ({ onClickAway, preventBubbling, isActive, excludeNodes, children, }: ClickAwayListenerProps) => ReactElement<any, string | import("react").JSXElementConstructor<any>>;
|
|
@@ -3,9 +3,15 @@ import { useClickAwayEffect, } from '../useClickAwayEffect';
|
|
|
3
3
|
/**
|
|
4
4
|
* компонент предоставляющий обертку для работы с хуком useClickAwayEffect
|
|
5
5
|
*/
|
|
6
|
-
export const ClickAwayListener = ({ onClickAway, preventBubbling, isActive = true, children, }) => {
|
|
6
|
+
export const ClickAwayListener = ({ onClickAway, preventBubbling, isActive = true, excludeNodes, children, }) => {
|
|
7
7
|
const ref = useRef(null);
|
|
8
|
-
useClickAwayEffect({
|
|
8
|
+
useClickAwayEffect({
|
|
9
|
+
ref,
|
|
10
|
+
onClickAway,
|
|
11
|
+
preventBubbling,
|
|
12
|
+
isActive,
|
|
13
|
+
excludeNodes,
|
|
14
|
+
});
|
|
9
15
|
// biome-ignore lint/suspicious/noExplicitAny: ReactElement имеет generic unknown по умолчанию и не содержит ref внутри
|
|
10
16
|
const child = children;
|
|
11
17
|
return Children.only(cloneElement(child, { ref }));
|
|
@@ -8,5 +8,5 @@ import { useLogic } from './useLogic';
|
|
|
8
8
|
export const Radio = forwardRef((props, ref) => {
|
|
9
9
|
useCheckControlled('Radio', props);
|
|
10
10
|
const { onChange, isChecked, isError, disabled, restProps, className, name, style, inputRef, value, id, } = useLogic(props);
|
|
11
|
-
return (_jsxs(Wrapper, { "$isDisabled": disabled, "$isError": isError, "$isChecked": isChecked, className: className, style: style, ref: ref, ...restProps, children: [_jsx(Input, { type: "radio", name: name, checked: isChecked, disabled: disabled, onChange: onChange, "aria-checked": isChecked, "aria-disabled": disabled, ref: inputRef, value: value, id: id }), _jsx(IconWrapper, { className: radioClassnames.iconWrapper, children: _jsx(Icon, { className: radioClassnames.icon }) })] }));
|
|
11
|
+
return (_jsxs(Wrapper, { "$isDisabled": disabled, "$isError": isError, "$isChecked": isChecked, className: className, style: style, ref: ref, ...restProps, children: [_jsx(Input, { type: "radio", className: radioClassnames.input, name: name, checked: isChecked, disabled: disabled, onChange: onChange, "aria-checked": isChecked, "aria-disabled": disabled, ref: inputRef, value: value, id: id }), _jsx(IconWrapper, { className: radioClassnames.iconWrapper, children: _jsx(Icon, { className: radioClassnames.icon }) })] }));
|
|
12
12
|
});
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export declare const radioClassnames: {
|
|
2
2
|
readonly root: string;
|
|
3
|
+
readonly input: string;
|
|
3
4
|
readonly checked: string;
|
|
4
5
|
readonly disabled: string;
|
|
5
6
|
readonly iconWrapper: string;
|
|
@@ -7,3 +8,5 @@ export declare const radioClassnames: {
|
|
|
7
8
|
readonly outerCircle: string;
|
|
8
9
|
readonly dot: string;
|
|
9
10
|
};
|
|
11
|
+
export declare const RADIO_SIZE = "32px";
|
|
12
|
+
export declare const MOBILE_RADIO_SIZE = "40px";
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { createUIKitClassname } from '../utils/createUIKitClassname';
|
|
2
2
|
export const radioClassnames = {
|
|
3
3
|
root: createUIKitClassname('radio'),
|
|
4
|
+
input: createUIKitClassname('radio__input'),
|
|
4
5
|
checked: createUIKitClassname('radio_checked'),
|
|
5
6
|
disabled: createUIKitClassname('radio_disabled'),
|
|
6
7
|
iconWrapper: createUIKitClassname('radio__icon-wrapper'),
|
|
@@ -8,3 +9,5 @@ export const radioClassnames = {
|
|
|
8
9
|
outerCircle: createUIKitClassname('radio__outer-circle'),
|
|
9
10
|
dot: createUIKitClassname('radio__dot'),
|
|
10
11
|
};
|
|
12
|
+
export const RADIO_SIZE = '32px';
|
|
13
|
+
export const MOBILE_RADIO_SIZE = '40px';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { Radio } from './Radio';
|
|
2
|
-
export { radioClassnames } from './constants';
|
|
2
|
+
export { radioClassnames, RADIO_SIZE, MOBILE_RADIO_SIZE } from './constants';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { styled } from '../styled';
|
|
2
2
|
import { easeOutBackTransition } from '../styled/mixins';
|
|
3
|
-
import { radioClassnames } from './constants';
|
|
3
|
+
import { MOBILE_RADIO_SIZE, RADIO_SIZE, radioClassnames } from './constants';
|
|
4
4
|
const getOutlineColor = ({ theme, isHover, isDisabled, isError, isChecked, }) => {
|
|
5
5
|
if (isDisabled) {
|
|
6
6
|
return isChecked
|
|
@@ -82,15 +82,15 @@ export const Input = styled.input `
|
|
|
82
82
|
|
|
83
83
|
position: absolute;
|
|
84
84
|
|
|
85
|
-
width:
|
|
86
|
-
height:
|
|
85
|
+
width: ${RADIO_SIZE};
|
|
86
|
+
height: ${RADIO_SIZE};
|
|
87
87
|
margin: 0;
|
|
88
88
|
|
|
89
89
|
opacity: 0;
|
|
90
90
|
|
|
91
91
|
${({ theme }) => theme.breakpoints.down('sm')} {
|
|
92
|
-
width:
|
|
93
|
-
height:
|
|
92
|
+
width: ${MOBILE_RADIO_SIZE};
|
|
93
|
+
height: ${MOBILE_RADIO_SIZE};
|
|
94
94
|
}
|
|
95
95
|
|
|
96
96
|
&:focus-visible {
|
|
@@ -106,12 +106,12 @@ export const IconWrapper = styled.span `
|
|
|
106
106
|
align-items: center;
|
|
107
107
|
justify-content: center;
|
|
108
108
|
|
|
109
|
-
width:
|
|
110
|
-
height:
|
|
109
|
+
width: ${RADIO_SIZE};
|
|
110
|
+
height: ${RADIO_SIZE};
|
|
111
111
|
|
|
112
112
|
${({ theme }) => theme.breakpoints.down('sm')} {
|
|
113
|
-
width:
|
|
114
|
-
height:
|
|
113
|
+
width: ${MOBILE_RADIO_SIZE};
|
|
114
|
+
height: ${MOBILE_RADIO_SIZE};
|
|
115
115
|
|
|
116
116
|
.${radioClassnames.icon} {
|
|
117
117
|
width: 20px;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { List } from './styles';
|
|
2
|
+
import { List, ListWrapper } from './styles';
|
|
3
3
|
import { TreeItem } from './TreeItem';
|
|
4
4
|
import { useLogic } from './useLogic';
|
|
5
5
|
const INITIAL_LEVEL = 0;
|
|
6
6
|
export const MultipleTreeList = ({ data, value, className, expandedLevel = 10, disabledItems, ...props }) => {
|
|
7
7
|
const { formattedDisabledItems } = useLogic({ disabledItems });
|
|
8
|
-
return (_jsx(List, { className: className, children: data.map((item) => (_jsx(TreeItem, { item: item, value: value, level: INITIAL_LEVEL, expandedLevel: expandedLevel, disabledItems: formattedDisabledItems, ...props }, item.id))) }));
|
|
8
|
+
return (_jsx(ListWrapper, { children: _jsx(List, { className: className, children: data.map((item) => (_jsx(TreeItem, { item: item, value: value, level: INITIAL_LEVEL, expandedLevel: expandedLevel, disabledItems: formattedDisabledItems, ...props }, item.id))) }) }));
|
|
9
9
|
};
|
|
@@ -3,14 +3,11 @@ import { FormControlLabel } from '../../../FormControlLabel';
|
|
|
3
3
|
import { List, StyledCheckbox, StyledTreeItem } from './styles';
|
|
4
4
|
import { useLogic } from './useLogic';
|
|
5
5
|
export const TreeItem = (props) => {
|
|
6
|
-
const { isSelected, isIndeterminate, isDefaultExpanded, disabledReason, isDisabled, handleChange, } = useLogic(props);
|
|
6
|
+
const { isSelected, isIndeterminate, isDefaultExpanded, disabledReason, isDisabled, handleChange, itemLabel, handleClick, } = useLogic(props);
|
|
7
7
|
const { level, renderItem, value, isInitialExpanded, expandedLevel, disabledItems, onChange, item, isObjectMode, } = props;
|
|
8
|
-
const { id,
|
|
9
|
-
const handleClick = (event) => {
|
|
10
|
-
event.stopPropagation();
|
|
11
|
-
};
|
|
8
|
+
const { id, note, children = [], options } = item;
|
|
12
9
|
if (children.length) {
|
|
13
|
-
return (_jsx(StyledTreeItem, { isSelected: isSelected, isDefaultExpanded: isDefaultExpanded, isForceExpanded: options?.isForceExpanded, isDisabled: isDisabled, disabledReason: disabledReason, note: renderItem ? null : note, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledCheckbox, { checked: isSelected, indeterminate: isSelected ? false : isIndeterminate }), label:
|
|
10
|
+
return (_jsx(StyledTreeItem, { id: id, isSelected: isSelected, isDefaultExpanded: isDefaultExpanded, isForceExpanded: options?.isForceExpanded, isDisabled: isDisabled, disabledReason: disabledReason, note: renderItem ? null : note, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledCheckbox, { checked: isSelected, indeterminate: isSelected ? false : isIndeterminate }), label: itemLabel, disabled: isDisabled, onChange: handleChange, onClick: handleClick }), mobileHeaderLabel: itemLabel, mobileHeaderControl: _jsx(StyledCheckbox, { checked: isSelected, indeterminate: isSelected ? false : isIndeterminate, disabled: isDisabled, onChange: handleChange }), level: level, onClick: handleChange, children: _jsx(List, { children: children.map((child) => (_jsx(TreeItem, { item: child, renderItem: renderItem, level: level + 1, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, disabledItems: disabledItems, value: value, onChange: onChange, isObjectMode: isObjectMode }, child.id))) }) }));
|
|
14
11
|
}
|
|
15
|
-
return (_jsx(StyledTreeItem, { isSelected: isSelected, isDisabled: isDisabled, disabledReason: disabledReason, note: renderItem ? null : note, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledCheckbox, { checked: isSelected }), label:
|
|
12
|
+
return (_jsx(StyledTreeItem, { id: id, isSelected: isSelected, isDisabled: isDisabled, disabledReason: disabledReason, note: renderItem ? null : note, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledCheckbox, { checked: isSelected }), label: itemLabel, disabled: isDisabled, onChange: handleChange, onClick: handleClick }), level: level, onClick: handleChange }));
|
|
16
13
|
};
|
|
@@ -14,23 +14,7 @@ export declare const StyledCheckbox: import("../../../styled").StyledComponent<i
|
|
|
14
14
|
} & import("react").RefAttributes<HTMLInputElement> & {
|
|
15
15
|
theme?: import("@emotion/react").Theme | undefined;
|
|
16
16
|
}, {}, {}>;
|
|
17
|
-
export declare const StyledTreeItem: import("../../../styled").StyledComponent<{
|
|
18
|
-
className?: string | undefined;
|
|
19
|
-
prefixId?: string | undefined;
|
|
20
|
-
isSelected: boolean;
|
|
21
|
-
label: import("react").ReactNode;
|
|
22
|
-
note?: import("react").ReactNode;
|
|
23
|
-
renderItem?: import("../../..").SyncFunctionComponent<Omit<import("../..").TreeListData, "children">> | undefined;
|
|
24
|
-
children?: import("react").ReactNode;
|
|
25
|
-
component?: import("react").ElementType | undefined;
|
|
26
|
-
level: number;
|
|
27
|
-
isDisabled?: boolean | undefined;
|
|
28
|
-
disabledReason?: string | undefined;
|
|
29
|
-
isNotBlockingExpandList?: boolean | undefined;
|
|
30
|
-
isDefaultExpanded?: boolean | undefined;
|
|
31
|
-
isForceExpanded?: boolean | undefined;
|
|
32
|
-
onClick?: ((event: import("react").SyntheticEvent<Element, Event>) => void) | undefined;
|
|
33
|
-
} & Omit<any, ""> & {
|
|
17
|
+
export declare const StyledTreeItem: import("../../../styled").StyledComponent<Omit<import("../../TreeItem").TreeItemProps, "ref"> & import("react").RefAttributes<HTMLLIElement> & {
|
|
34
18
|
theme?: import("@emotion/react").Theme | undefined;
|
|
35
19
|
}, {}, {}>;
|
|
36
20
|
export declare const List: import("../../../styled").StyledComponent<{
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { formControlLabelClasses } from '@mui/material/FormControlLabel';
|
|
2
|
-
import { CHECKBOX_SIZE, Checkbox, checkboxClassnames } from '../../../Checkbox';
|
|
2
|
+
import { CHECKBOX_SIZE, Checkbox, checkboxClassnames, MOBILE_CHECKBOX_SIZE, } from '../../../Checkbox';
|
|
3
3
|
import { styled } from '../../../styled';
|
|
4
4
|
import { listContainer } from '../../../styled/mixins';
|
|
5
5
|
import { TreeItem, treeClassnames } from '../../TreeItem';
|
|
@@ -10,9 +10,15 @@ export const StyledCheckbox = styled(Checkbox) `
|
|
|
10
10
|
& > .${checkboxClassnames.input}, .${checkboxClassnames.iconWrapper} {
|
|
11
11
|
width: 32px;
|
|
12
12
|
height: 16px;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
${({ theme }) => theme.breakpoints.down('sm')} {
|
|
16
|
+
height: 20px;
|
|
17
|
+
width: ${MOBILE_CHECKBOX_SIZE};
|
|
13
18
|
|
|
14
|
-
|
|
19
|
+
& .${checkboxClassnames.iconWrapper}, & .${checkboxClassnames.input} {
|
|
15
20
|
height: 20px;
|
|
21
|
+
width: ${MOBILE_CHECKBOX_SIZE};
|
|
16
22
|
}
|
|
17
23
|
}
|
|
18
24
|
`;
|
|
@@ -27,6 +33,17 @@ export const StyledTreeItem = styled(TreeItem) `
|
|
|
27
33
|
/* Добавляем к отступу ширину контейнера с чекбоксом */
|
|
28
34
|
margin-left: ${CHECKBOX_SIZE};
|
|
29
35
|
}
|
|
36
|
+
|
|
37
|
+
${({ theme }) => theme.breakpoints.down('sm')} {
|
|
38
|
+
& .${formControlLabelClasses.root} {
|
|
39
|
+
margin-left: 0;
|
|
40
|
+
gap: ${({ theme }) => theme.spacing(1)};
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
& .${treeClassnames.note} {
|
|
44
|
+
margin-left: ${({ theme }) => `calc(${theme.spacing(1)} + ${MOBILE_CHECKBOX_SIZE})`};
|
|
45
|
+
}
|
|
46
|
+
}
|
|
30
47
|
`;
|
|
31
48
|
export const List = styled.ul `
|
|
32
49
|
${listContainer};
|
|
@@ -1,12 +1,15 @@
|
|
|
1
|
+
import { type SyntheticEvent } from 'react';
|
|
1
2
|
import type { MultipleValue } from '../../types';
|
|
2
3
|
import { type TreeItemProps } from '../types';
|
|
3
4
|
type UseLogicProps<TValue extends MultipleValue = string[]> = TreeItemProps<TValue>;
|
|
4
|
-
export declare const useLogic: <TValue extends MultipleValue = string[]>({ item, value, level, isInitialExpanded, expandedLevel, disabledItems, onChange, isObjectMode, }: UseLogicProps<TValue>) => {
|
|
5
|
+
export declare const useLogic: <TValue extends MultipleValue = string[]>({ item, value, level, renderItem, isInitialExpanded, expandedLevel, disabledItems, onChange, isObjectMode, }: UseLogicProps<TValue>) => {
|
|
5
6
|
isSelected: boolean;
|
|
6
7
|
isIndeterminate: boolean;
|
|
7
8
|
isDefaultExpanded: boolean | undefined;
|
|
8
9
|
isDisabled: boolean;
|
|
9
10
|
disabledReason: string | undefined;
|
|
10
11
|
handleChange: () => void;
|
|
12
|
+
itemLabel: string | number | bigint | boolean | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | null | undefined;
|
|
13
|
+
handleClick: (event: SyntheticEvent) => void;
|
|
11
14
|
};
|
|
12
15
|
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useEffect, useMemo } from 'react';
|
|
2
2
|
import { checkIsIndeterminate, checkIsSelected, getAllChildrenId, getIdFromValue, getItemsToAdd, } from './utils';
|
|
3
|
-
export const useLogic = ({ item, value = [], level, isInitialExpanded, expandedLevel, disabledItems, onChange, isObjectMode, }) => {
|
|
4
|
-
const { id, children } = item;
|
|
3
|
+
export const useLogic = ({ item, value = [], level, renderItem, isInitialExpanded, expandedLevel, disabledItems, onChange, isObjectMode, }) => {
|
|
4
|
+
const { id, children, label, note } = item;
|
|
5
5
|
const childrenIds = useMemo(() => getAllChildrenId(children, disabledItems), [children, disabledItems]);
|
|
6
6
|
const isSelected = checkIsSelected(value, id);
|
|
7
7
|
const isIndeterminate = checkIsIndeterminate(value, childrenIds);
|
|
@@ -40,6 +40,10 @@ export const useLogic = ({ item, value = [], level, isInitialExpanded, expandedL
|
|
|
40
40
|
const newValue = value ? [...value, ...itemsToAdd] : itemsToAdd;
|
|
41
41
|
onChange(newValue);
|
|
42
42
|
};
|
|
43
|
+
const itemLabel = renderItem ? renderItem({ label, note, id }) : label;
|
|
44
|
+
const handleClick = (event) => {
|
|
45
|
+
event.stopPropagation();
|
|
46
|
+
};
|
|
43
47
|
return {
|
|
44
48
|
isSelected,
|
|
45
49
|
isIndeterminate,
|
|
@@ -47,5 +51,7 @@ export const useLogic = ({ item, value = [], level, isInitialExpanded, expandedL
|
|
|
47
51
|
isDisabled,
|
|
48
52
|
disabledReason,
|
|
49
53
|
handleChange,
|
|
54
|
+
itemLabel,
|
|
55
|
+
handleClick,
|
|
50
56
|
};
|
|
51
57
|
};
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
export declare const ListWrapper: import("../../styled").StyledComponent<{
|
|
3
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
4
|
+
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
5
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
2
6
|
export declare const List: import("../../styled").StyledComponent<{
|
|
3
7
|
theme?: import("@emotion/react").Theme | undefined;
|
|
4
8
|
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
@@ -1,6 +1,31 @@
|
|
|
1
1
|
import { styled } from '../../styled';
|
|
2
2
|
import { listContainer } from '../../styled/mixins';
|
|
3
|
+
export const ListWrapper = styled.div `
|
|
4
|
+
display: contents;
|
|
5
|
+
|
|
6
|
+
${({ theme }) => theme.breakpoints.down('sm')} {
|
|
7
|
+
position: relative;
|
|
8
|
+
|
|
9
|
+
display: flex;
|
|
10
|
+
flex-direction: column;
|
|
11
|
+
|
|
12
|
+
height: 100%;
|
|
13
|
+
min-height: 0;
|
|
14
|
+
|
|
15
|
+
overflow: hidden;
|
|
16
|
+
|
|
17
|
+
transform: translateZ(0);
|
|
18
|
+
}
|
|
19
|
+
`;
|
|
3
20
|
export const List = styled.ul `
|
|
4
21
|
${listContainer};
|
|
22
|
+
position: relative;
|
|
5
23
|
overflow: hidden;
|
|
24
|
+
|
|
25
|
+
${({ theme }) => theme.breakpoints.down('sm')} {
|
|
26
|
+
flex-grow: 1;
|
|
27
|
+
min-height: 0;
|
|
28
|
+
|
|
29
|
+
overflow-y: auto;
|
|
30
|
+
}
|
|
6
31
|
`;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { MobileSlidePanelContent } from './MobileSlidePanelContent';
|
|
3
|
+
import { MobileSlidePanelContextProvider } from './MobileSlidePanelContext';
|
|
4
|
+
import { useLogic } from './useLogic';
|
|
5
|
+
export const MobileSlidePanel = ({ onClose, ...restProps }) => {
|
|
6
|
+
const { parentContext, register, closeTop, setHeader, removeHeader, activeHeader, } = useLogic();
|
|
7
|
+
if (parentContext) {
|
|
8
|
+
return _jsx(MobileSlidePanelContent, { onClose: onClose, ...restProps });
|
|
9
|
+
}
|
|
10
|
+
return (_jsx(MobileSlidePanelContextProvider, { register: register, closeTop: closeTop, setHeader: setHeader, removeHeader: removeHeader, children: _jsx(MobileSlidePanelContent, { onClose: onClose, ...restProps, isRoot: true, activeHeader: activeHeader }) }));
|
|
11
|
+
};
|
package/components/Tree/TreeItem/MobileSlidePanel/MobileSlidePanelContent/MobileSlidePanelContent.js
ADDED
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { ChevronLOutlineMd } from '../../../../../icons/ChevronLOutlineMd';
|
|
3
|
+
import { cva } from '../../../../utils/cva';
|
|
4
|
+
import { treeClassnames } from '../../constants';
|
|
5
|
+
import { mobileSlidePanelClassnames } from '../constants';
|
|
6
|
+
import { BackButton, Header, HeaderAdditionalContent, HeaderControl, MobilePanel, MobilePanelContentWrapper, MobilePanelScrollArea, MobilePanelSlide, ParentContent, ParentLabel, ParentNote, } from './styles';
|
|
7
|
+
import { useLogic } from './useLogic';
|
|
8
|
+
const mobilePanelCva = cva(mobileSlidePanelClassnames.root, {
|
|
9
|
+
variants: {
|
|
10
|
+
hasParentContext: {
|
|
11
|
+
true: mobileSlidePanelClassnames.nested,
|
|
12
|
+
},
|
|
13
|
+
},
|
|
14
|
+
});
|
|
15
|
+
const headerCva = cva(mobileSlidePanelClassnames.header, {
|
|
16
|
+
variants: {
|
|
17
|
+
isSelected: {
|
|
18
|
+
true: treeClassnames.selected,
|
|
19
|
+
},
|
|
20
|
+
isDisabled: {
|
|
21
|
+
true: treeClassnames.disabled,
|
|
22
|
+
},
|
|
23
|
+
},
|
|
24
|
+
});
|
|
25
|
+
const parentContentCva = cva(mobileSlidePanelClassnames.headerParent, {
|
|
26
|
+
variants: {
|
|
27
|
+
isDisabled: {
|
|
28
|
+
true: treeClassnames.disabled,
|
|
29
|
+
},
|
|
30
|
+
},
|
|
31
|
+
});
|
|
32
|
+
const slidePanelCva = cva(mobileSlidePanelClassnames.slidePanel, {
|
|
33
|
+
variants: {
|
|
34
|
+
isOpen: {
|
|
35
|
+
true: treeClassnames.open,
|
|
36
|
+
},
|
|
37
|
+
},
|
|
38
|
+
});
|
|
39
|
+
export const MobileSlidePanelContent = ({ isRoot = false, children, isOpen, ...params }) => {
|
|
40
|
+
const { isMobileMounted, closeTop, parentLabel, parentNote, parentControl, parentAdditionalContent, isParentSelected, isParentDisabled, handleParentClick, } = useLogic({ isOpen, ...params });
|
|
41
|
+
if (!isMobileMounted) {
|
|
42
|
+
return null;
|
|
43
|
+
}
|
|
44
|
+
return (_jsx(MobilePanel, { className: mobilePanelCva({ hasParentContext: !isRoot }), children: _jsxs(MobilePanelSlide, { className: slidePanelCva({ isOpen }), children: [isRoot && (_jsxs(_Fragment, { children: [_jsxs(Header, { className: headerCva({
|
|
45
|
+
isSelected: isParentSelected,
|
|
46
|
+
isDisabled: isParentDisabled,
|
|
47
|
+
}), children: [_jsx(BackButton, { className: mobileSlidePanelClassnames.backButton, variant: "text", "aria-label": "\u041D\u0430\u0437\u0430\u0434", onClick: closeTop, children: _jsx(ChevronLOutlineMd, {}) }), _jsxs(ParentContent, { className: parentContentCva({
|
|
48
|
+
isDisabled: isParentDisabled,
|
|
49
|
+
}), onClick: handleParentClick, children: [_jsx(ParentLabel, { component: "div", children: parentLabel }), parentNote && (_jsx(ParentNote, { variant: "caption", color: "textSecondary", children: parentNote }))] }), parentControl && (_jsx(HeaderControl, { className: mobileSlidePanelClassnames.headerControl, children: parentControl }))] }), parentAdditionalContent && (_jsx(HeaderAdditionalContent, { className: mobileSlidePanelClassnames.headerAdditionalContent, children: parentAdditionalContent }))] })), _jsx(MobilePanelContentWrapper, { children: _jsx(MobilePanelScrollArea, { children: children }) })] }) }));
|
|
50
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './MobileSlidePanelContent';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './MobileSlidePanelContent';
|