@redneckz/wildless-cms-uni-blocks 0.14.878 → 0.14.880

package/src/retail/components/DocumentDialog/DocumentDialog.tsx

@@ -13,7 +13,7 @@ export const DocumentDialog = JSX<DocumentDialogProps>(({ src, onClose, onDocume
   const isMobileMode = useMobileMode();
 
   return (
-    <Dialog className="my-6xl max-w-4xl mx-auto px-0 min-h-0 pb-0 z-[101]" onClose={onClose}>
+    <Dialog className="mt-xl max-w-4xl mx-auto px-0 min-h-0 pb-0" onClose={onClose}>
       {isMobileMode ? (
         <img src={src} />
       ) : (

package/src/retail/components/DocumentDialog/useDocumentDialog.ts

@@ -1,4 +1,5 @@
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
 import { type Nullable } from '@redneckz/uni-jsx/lib/utils/ts/Nullable';
 import { useMobileMode } from '../../../hooks/useMobileMode';
 import { useDialog } from '../../../ui-kit/DialogManager/useDialog';
@@ -6,13 +7,21 @@ import { feedbackById } from '../../api/feedbackById';
 import { DocumentDialog } from './DocumentDialog';
 
 export const useDocumentDialog = (docId: Nullable<number>, onDocumentRead?: () => void) => {
+  const [isLoading, { setTrue: startLoading, setFalse: endLoading }] = useBool(false);
   const { open } = useDialog(DocumentDialog);
   const isMobileMode = useMobileMode();
 
-  return useCallback(async () => {
-    if (docId) {
+  const openDocument = useCallback(async () => {
+    if (docId && !isLoading) {
+      startLoading();
       const src = URL.createObjectURL(await feedbackById(docId, isMobileMode));
       open({ src, onDocumentRead });
+      endLoading();
     }
-  }, [open, docId, isMobileMode]);
+  }, [open, docId, isMobileMode, isLoading]);
+
+  return {
+    openDocument,
+    isLoading,
+  };
 };

package/src/ui-kit/DialogManager/Dialog.tsx

@@ -21,6 +21,6 @@ export const Dialog = JSX<DialogProps>(({ className, head, children, onClose, on
       <CloseButton className="absolute top-0 right-0" onClose={onClose} />
       <div className="container">{head}</div>
     </div>
-    <div className="container pb-6xl">{children}</div>
+    <div className="container pb-m mb-[74px] lg:mb-0">{children}</div>
   </div>
 ));

package/src/ui-kit/Loader/Loader.tsx

@@ -6,7 +6,7 @@ interface LoaderProps {
   color?: TextColor;
   position?: 'static' | 'absolute';
   blur?: boolean;
-  size?: 'small' | 'big';
+  size?: 'extraSmall' | 'small' | 'big';
 }
 
 export const Loader = JSX<LoaderProps>(
@@ -22,7 +22,9 @@ export const Loader = JSX<LoaderProps>(
           'animate-spin rounded-full',
           'border-solid border-current',
           'border-r-transparent',
-          size === 'small' ? 'border-4 h-8 w-8' : 'border-8 h-28 w-28',
+          size === 'extraSmall' && 'border-2 h-4 w-4',
+          size === 'small' && 'border-4 h-8 w-8',
+          size === 'big' && 'border-8 h-28 w-28',
           color,
         )}
         role="status"

package/src/ui-kit/Select/Select.tsx

@@ -67,7 +67,7 @@ export const Select = JSX<SelectProps>(
 
     const handleChangeQuery = (newQuery: string) => {
       setQuery(newQuery);
-      setOption(newQuery, onChange);
+      isManualInput && setOption(newQuery, onChange);
       debouncedOnSearchQuery && debouncedOnSearchQuery(newQuery);
     };