@alfalab/core-components-select 17.16.1 → 17.17.0

package/shared/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var presets_useSelectWithLoading_hook = require('../presets/useSelectWithLoading/hook.js');
 var presets_useLazyLoading_hook = require('../presets/useLazyLoading/hook.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../hook-ae0e232f.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../hook-932ade10.js');
 var utils = require('../utils.js');
 var components_option_Component = require('../components/option/Component.js');
 var components_baseOption_Component = require('../components/base-option/Component.js');

package/src/components/base-select/components/list-mobile/list-bottom-sheet-mobile.tsx

@@ -40,6 +40,8 @@ export const ListBottomSheetMobile: FC<ListMobileProps> = (props) => {
     } = props;
 
     if (BottomSheet) {
+        const bottomAddons = bottomSheetProps?.bottomAddons;
+
         return (
             <BottomSheet
                 dataTestId={getDataTestId(dataTestId, 'bottom-sheet')}
@@ -67,7 +69,9 @@ export const ListBottomSheetMobile: FC<ListMobileProps> = (props) => {
                 bottomAddons={
                     <React.Fragment>
                         {renderSearch()}
-                        {flatOptions.length > 0 && bottomSheetProps?.bottomAddons}
+                        {typeof bottomAddons === 'function'
+                            ? bottomAddons(flatOptions)
+                            : bottomAddons}
                     </React.Fragment>
                 }
                 containerProps={{

package/src/components/base-select/components/list-mobile/list-modal-mobile.tsx

@@ -41,6 +41,8 @@ export const ListModalMobile: FC<ListModalMobileProps> = (props) => {
     } = props;
 
     if (ModalMobile) {
+        const bottomAddons = modalHeaderProps?.bottomAddons;
+
         return (
             <ModalMobile
                 dataTestId={getDataTestId(dataTestId, 'modal')}
@@ -74,7 +76,9 @@ export const ListModalMobile: FC<ListModalMobileProps> = (props) => {
                     bottomAddons={
                         <React.Fragment>
                             {renderSearch()}
-                            {flatOptions.length > 0 && modalHeaderProps?.bottomAddons}
+                            {typeof bottomAddons === 'function'
+                                ? bottomAddons(flatOptions)
+                                : bottomAddons}
                         </React.Fragment>
                     }
                 >

package/src/mobile/Component.mobile.tsx

@@ -15,7 +15,7 @@ import { Search as DefaultSearch } from '../components/search';
 import { VirtualOptionsList as DefaultVirtualOptionsList } from '../components/virtual-options-list';
 import { useSelectWithApply } from '../presets/useSelectWithApply/hook';
 import { Header } from '../presets/useSelectWithApply/options-list-with-apply/header/Component';
-import { AnyObject, SelectMobileProps } from '../typings';
+import { AnyObject, OptionShape, SelectMobileProps } from '../typings';
 
 const VIRTUAL_OPTIONS_LIST_THRESHOLD = 30;
 
@@ -71,9 +71,12 @@ export const SelectMobile = forwardRef(
             showSelectAll,
         });
 
-        const bottomAddons = useWithApplyHook && showHeaderWithSelectAll && (
-            <Header {...applyProps.optionsListProps.headerProps} mobile={true} />
-        );
+        const bottomAddons = (flatOptions: OptionShape[]) =>
+            flatOptions.length > 0 &&
+            useWithApplyHook &&
+            showHeaderWithSelectAll && (
+                <Header {...applyProps.optionsListProps.headerProps} mobile={true} />
+            );
 
         return (
             <BaseSelect

package/src/presets/useSelectWithApply/hook.tsx

@@ -152,6 +152,8 @@ export function useSelectWithApply({
         setSelectedDraft(optionsToSet);
     };
 
+    const selectedKeys = useMemo(() => selectedDraft.map(({ key }) => key), [selectedDraft]);
+
     const handleChange: Required<BaseSelectProps>['onChange'] = ({ initiator, ...restArgs }) => {
         if (!initiator) {
             onChange({
@@ -164,7 +166,9 @@ export function useSelectWithApply({
 
         const initiatorSelected =
             selectedDraft.includes(initiator) ||
-            (initiator.key === SELECT_ALL_KEY && selectedDraft.length === flatOptions.length);
+            (initiator.key === SELECT_ALL_KEY &&
+                (selectedDraft.length === flatOptions.length ||
+                    flatOptions.every(({ key }) => selectedKeys.includes(key))));
 
         if (initiator.key === SELECT_ALL_KEY) {
             setSelectedDraft(initiatorSelected ? [] : flatOptions);
@@ -209,8 +213,10 @@ export function useSelectWithApply({
             showHeaderWithSelectAll,
             headerProps: {
                 ...(optionsListProps as AnyObject)?.headerProps,
-                indeterminate: !!selectedDraft.length && selectedDraft.length < flatOptions.length,
-                checked: selectedDraft.length === flatOptions.length,
+                indeterminate: selectedDraft.length > 0,
+                checked:
+                    selectedDraft.length === flatOptions.length ||
+                    flatOptions.every(({ key }) => selectedKeys.includes(key)),
                 onChange: handleToggleAll,
             },
         },

package/src/typings.ts

@@ -871,14 +871,18 @@ export type BottomSheetSelectMobileProps = {
     /**
      * Дополнительные пропсы шторки
      */
-    bottomSheetProps?: Partial<BottomSheetProps>;
+    bottomSheetProps?: Omit<Partial<BottomSheetProps>, 'bottomAddons'> & {
+        bottomAddons?: ((flatOptions: OptionShape[]) => ReactNode) | ReactNode;
+    };
 };
 
 export type ModalSelectMobileProps = {
     /**
      *  Дополнительные пропсы шапки модалки
      */
-    modalHeaderProps?: Partial<ModalHeaderProps>;
+    modalHeaderProps?: Omit<Partial<ModalHeaderProps>, 'bottomAddons'> & {
+        bottomAddons?: ((flatOptions: OptionShape[]) => ReactNode) | ReactNode;
+    };
 
     /**
      *  Дополнительные пропсы модалки

package/typings.d.ts

@@ -6,7 +6,7 @@ import { InputProps } from "@alfalab/core-components-input";
 import { ModalProps } from "@alfalab/core-components-modal";
 import { ModalFooterProps, ModalHeaderProps } from "@alfalab/core-components-modal/shared";
 import { PopoverProps } from "@alfalab/core-components-popover";
-import { UseSelectWithApplyProps } from "./hook-184c14eb";
+import { UseSelectWithApplyProps } from "./hook-b3d196bf";
 type AnyObject = Record<string, any>;
 type OptionShape = {
     /**
@@ -687,13 +687,17 @@ type BottomSheetSelectMobileProps = {
     /**
      * Дополнительные пропсы шторки
      */
-    bottomSheetProps?: Partial<BottomSheetProps>;
+    bottomSheetProps?: Omit<Partial<BottomSheetProps>, 'bottomAddons'> & {
+        bottomAddons?: ((flatOptions: OptionShape[]) => ReactNode) | ReactNode;
+    };
 };
 type ModalSelectMobileProps = {
     /**
      *  Дополнительные пропсы шапки модалки
      */
-    modalHeaderProps?: Partial<ModalHeaderProps>;
+    modalHeaderProps?: Omit<Partial<ModalHeaderProps>, 'bottomAddons'> & {
+        bottomAddons?: ((flatOptions: OptionShape[]) => ReactNode) | ReactNode;
+    };
     /**
      *  Дополнительные пропсы модалки
      */

package/esm/mobile.module-be48459a.js

@@ -1,4 +0,0 @@
-var mobileStyles = {"sheet":"select__sheet_156q4","sheetContent":"select__sheetContent_156q4","modalContent":"select__modalContent_156q4","sheetContainer":"select__sheetContainer_156q4","optionsListWrapper":"select__optionsListWrapper_156q4","optionsList":"select__optionsList_156q4","scrollbar":"select__scrollbar_156q4","search":"select__search_156q4","option":"select__option_156q4","optionGroup":"select__optionGroup_156q4"};
-require('./components/base-select/mobile.css')
-
-export { mobileStyles as m };

package/mobile.module-8caed517.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var mobileStyles = {"sheet":"select__sheet_156q4","sheetContent":"select__sheetContent_156q4","modalContent":"select__modalContent_156q4","sheetContainer":"select__sheetContainer_156q4","optionsListWrapper":"select__optionsListWrapper_156q4","optionsList":"select__optionsList_156q4","scrollbar":"select__scrollbar_156q4","search":"select__search_156q4","option":"select__option_156q4","optionGroup":"select__optionGroup_156q4"};
-require('./components/base-select/mobile.css')
-
-exports.mobileStyles = mobileStyles;

package/modern/mobile.module-5c6e7084.js

@@ -1,4 +0,0 @@
-const mobileStyles = {"sheet":"select__sheet_156q4","sheetContent":"select__sheetContent_156q4","modalContent":"select__modalContent_156q4","sheetContainer":"select__sheetContainer_156q4","optionsListWrapper":"select__optionsListWrapper_156q4","optionsList":"select__optionsList_156q4","scrollbar":"select__scrollbar_156q4","search":"select__search_156q4","option":"select__option_156q4","optionGroup":"select__optionGroup_156q4"};
-require('./components/base-select/mobile.css')
-
-export { mobileStyles as m };