@redneckz/wildless-cms-uni-blocks 0.14.589 → 0.14.590

package/mobile/bundle/hooks/useElementSpace.d.ts

@@ -0,0 +1,2 @@
+import { type RefObject } from 'react';
+export declare const useElementSpace: (ref: RefObject<HTMLElement>, heightEl: number) => boolean;

package/mobile/dist/hooks/useElementSpace.d.ts

@@ -0,0 +1,2 @@
+import { type RefObject } from 'react';
+export declare const useElementSpace: (ref: RefObject<HTMLElement>, heightEl: number) => boolean;

package/mobile/dist/hooks/useElementSpace.js

@@ -0,0 +1,21 @@
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useElementSpace = void 0;
+const hooks_1 = require("@redneckz/uni-jsx/lib/hooks");
+const useElementSpace = (ref, heightEl) => {
+    const [spaceAbove, setSpaceAbove] = (0, hooks_1.useState)(false);
+    (0, hooks_1.useEffect)(() => {
+        const handleResize = () => {
+            if (ref?.current) {
+                const { top } = ref.current.getBoundingClientRect();
+                const hasSpaceAbove = top > heightEl;
+                setSpaceAbove(hasSpaceAbove);
+            }
+        };
+        handleResize();
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, [ref]);
+    return spaceAbove;
+};
+exports.useElementSpace = useElementSpace;
+//# sourceMappingURL=useElementSpace.js.map

package/mobile/dist/hooks/useElementSpace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useElementSpace.js","sourceRoot":"","sources":["../../src/hooks/useElementSpace.ts"],"names":[],"mappings":";;AAAA,uDAAkE;AAG3D,MAAM,eAAe,GAAG,CAAC,GAA2B,EAAE,QAAgB,EAAE,EAAE;IAC/E,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAEpD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,GAAG,EAAE;YACxB,IAAI,GAAG,EAAE,OAAO,EAAE;gBAChB,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC;gBAEpD,MAAM,aAAa,GAAG,GAAG,GAAG,QAAQ,CAAC;gBAErC,aAAa,CAAC,aAAa,CAAC,CAAC;aAC9B;QACH,CAAC,CAAC;QAEF,YAAY,EAAE,CAAC;QACf,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QAEhD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IAClE,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,OAAO,UAAU,CAAC;AACpB,CAAC,CAAC;AArBW,QAAA,eAAe,mBAqB1B"}

package/mobile/dist/ui-kit/DatePicker/DatePicker.js

@@ -4,6 +4,7 @@ const jsx_runtime_1 = require("@redneckz/uni-jsx/jsx-runtime");
 const uni_jsx_1 = require("@redneckz/uni-jsx");
 const hooks_1 = require("@redneckz/uni-jsx/lib/hooks");
 const useBool_1 = require("@redneckz/uni-jsx/lib/hooks/useBool");
+const useElementSpace_1 = require("../../hooks/useElementSpace");
 const formatDate_1 = require("../../utils/formatDate");
 const style_1 = require("../../utils/style");
 const Icon_1 = require("../Icon/Icon");
@@ -38,7 +39,10 @@ exports.DatePicker = (0, uni_jsx_1.JSX)(({ className = '', label = '', value, va
         selectedMonth,
         showCalendar,
     });
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, style_1.style)('space-y-xs', className), ref: ref, children: [(0, renderLabel_1.renderLabel)(label), (0, jsx_runtime_1.jsxs)("div", { className: "relative", children: [renderDatePickerForm(handleChangeVisibleCalendar, value, valid), showCalendar ? ((0, jsx_runtime_1.jsxs)("div", { className: "absolute bg-white z-20 select-none bottom-full", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex gap-s", children: [(0, jsx_runtime_1.jsx)("div", { className: "my-auto", onClick: handlePrevMonth, children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...ICON_PROPS, className: "-rotate-90 cursor-pointer" }) }), (0, jsx_runtime_1.jsx)(Select_1.Select, { onChange: handleSelectMonth, value: { key: months_1.months[selectedMonth] }, options: monthsOptions, ...SELECT_PROPS }), (0, jsx_runtime_1.jsx)(Select_1.Select, { onChange: handleSelectYear, value: { key: String(selectedYear) }, options: yearsOptions, ...SELECT_PROPS }), (0, jsx_runtime_1.jsx)("div", { className: "my-auto", onClick: handleNextMonth, children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...ICON_PROPS, className: "rotate-90 cursor-pointer" }) })] }), (0, jsx_runtime_1.jsx)(Calendar_1.Calendar, { today: value, currentMonth: selectedMonth, currentYear: selectedYear, onDateSelect: onChange, min: minDate, max: maxDate })] })) : null] })] }));
+    const spaceAbove = (0, useElementSpace_1.useElementSpace)(ref, 370);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, style_1.style)('space-y-xs', className), ref: ref, children: [(0, renderLabel_1.renderLabel)(label), (0, jsx_runtime_1.jsxs)("div", { className: "relative", children: [renderDatePickerForm(handleChangeVisibleCalendar, value, valid), showCalendar ? ((0, jsx_runtime_1.jsxs)("div", { className: (0, style_1.style)('absolute bg-white z-20 select-none', {
+                            'bottom-full': spaceAbove,
+                        }), children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex gap-s", children: [(0, jsx_runtime_1.jsx)("div", { className: "my-auto", onClick: handlePrevMonth, children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...ICON_PROPS, className: "-rotate-90 cursor-pointer" }) }), (0, jsx_runtime_1.jsx)(Select_1.Select, { onChange: handleSelectMonth, value: { key: months_1.months[selectedMonth] }, options: monthsOptions, ...SELECT_PROPS }), (0, jsx_runtime_1.jsx)(Select_1.Select, { onChange: handleSelectYear, value: { key: String(selectedYear) }, options: yearsOptions, ...SELECT_PROPS }), (0, jsx_runtime_1.jsx)("div", { className: "my-auto", onClick: handleNextMonth, children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...ICON_PROPS, className: "rotate-90 cursor-pointer" }) })] }), (0, jsx_runtime_1.jsx)(Calendar_1.Calendar, { today: value, currentMonth: selectedMonth, currentYear: selectedYear, onDateSelect: onChange, min: minDate, max: maxDate, setValue: setValue })] })) : null] })] }));
 });
 const renderDatePickerForm = (handleChangeVisibleCalendar, value, valid) => ((0, jsx_runtime_1.jsxs)("div", { onClick: handleChangeVisibleCalendar, className: (0, style_1.style)(formStyle, valid ? 'border-gray' : 'border-error'), children: [(0, jsx_runtime_1.jsx)(Paragraph_1.Paragraph, { children: value && (0, formatDate_1.formatDate)(value) }), (0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...ICON_PROPS, name: "CalendarIcon" })] }));
 //# sourceMappingURL=DatePicker.js.map

package/mobile/dist/ui-kit/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/ui-kit/DatePicker/DatePicker.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/ui-kit/DatePicker/DatePicker.tsx"],"names":[],"mappings":"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"}

package/mobile/lib/hooks/useElementSpace.d.ts

@@ -0,0 +1,2 @@
+import { type RefObject } from 'react';
+export declare const useElementSpace: (ref: RefObject<HTMLElement>, heightEl: number) => boolean;

package/mobile/lib/hooks/useElementSpace.js

@@ -0,0 +1,18 @@
+import { useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
+export const useElementSpace = (ref, heightEl) => {
+    const [spaceAbove, setSpaceAbove] = useState(false);
+    useEffect(() => {
+        const handleResize = () => {
+            if (ref?.current) {
+                const { top } = ref.current.getBoundingClientRect();
+                const hasSpaceAbove = top > heightEl;
+                setSpaceAbove(hasSpaceAbove);
+            }
+        };
+        handleResize();
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, [ref]);
+    return spaceAbove;
+};
+//# sourceMappingURL=useElementSpace.js.map

package/mobile/lib/hooks/useElementSpace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useElementSpace.js","sourceRoot":"","sources":["../../src/hooks/useElementSpace.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAGlE,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,GAA2B,EAAE,QAAgB,EAAE,EAAE;IAC/E,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,GAAG,EAAE;YACxB,IAAI,GAAG,EAAE,OAAO,EAAE;gBAChB,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC;gBAEpD,MAAM,aAAa,GAAG,GAAG,GAAG,QAAQ,CAAC;gBAErC,aAAa,CAAC,aAAa,CAAC,CAAC;aAC9B;QACH,CAAC,CAAC;QAEF,YAAY,EAAE,CAAC;QACf,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QAEhD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IAClE,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,OAAO,UAAU,CAAC;AACpB,CAAC,CAAC"}

package/mobile/lib/ui-kit/DatePicker/DatePicker.js

@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
+import { useElementSpace } from '../../hooks/useElementSpace.js';
 import { formatDate } from '../../utils/formatDate.js';
 import { style } from '../../utils/style.js';
 import { Icon } from '../Icon/Icon.js';
@@ -36,7 +37,10 @@ export const DatePicker = JSX(({ className = '', label = '', value, valid = true
         selectedMonth,
         showCalendar,
     });
-    return (_jsxs("div", { className: style('space-y-xs', className), ref: ref, children: [renderLabel(label), _jsxs("div", { className: "relative", children: [renderDatePickerForm(handleChangeVisibleCalendar, value, valid), showCalendar ? (_jsxs("div", { className: "absolute bg-white z-20 select-none bottom-full", children: [_jsxs("div", { className: "flex gap-s", children: [_jsx("div", { className: "my-auto", onClick: handlePrevMonth, children: _jsx(Icon, { ...ICON_PROPS, className: "-rotate-90 cursor-pointer" }) }), _jsx(Select, { onChange: handleSelectMonth, value: { key: months[selectedMonth] }, options: monthsOptions, ...SELECT_PROPS }), _jsx(Select, { onChange: handleSelectYear, value: { key: String(selectedYear) }, options: yearsOptions, ...SELECT_PROPS }), _jsx("div", { className: "my-auto", onClick: handleNextMonth, children: _jsx(Icon, { ...ICON_PROPS, className: "rotate-90 cursor-pointer" }) })] }), _jsx(Calendar, { today: value, currentMonth: selectedMonth, currentYear: selectedYear, onDateSelect: onChange, min: minDate, max: maxDate })] })) : null] })] }));
+    const spaceAbove = useElementSpace(ref, 370);
+    return (_jsxs("div", { className: style('space-y-xs', className), ref: ref, children: [renderLabel(label), _jsxs("div", { className: "relative", children: [renderDatePickerForm(handleChangeVisibleCalendar, value, valid), showCalendar ? (_jsxs("div", { className: style('absolute bg-white z-20 select-none', {
+                            'bottom-full': spaceAbove,
+                        }), children: [_jsxs("div", { className: "flex gap-s", children: [_jsx("div", { className: "my-auto", onClick: handlePrevMonth, children: _jsx(Icon, { ...ICON_PROPS, className: "-rotate-90 cursor-pointer" }) }), _jsx(Select, { onChange: handleSelectMonth, value: { key: months[selectedMonth] }, options: monthsOptions, ...SELECT_PROPS }), _jsx(Select, { onChange: handleSelectYear, value: { key: String(selectedYear) }, options: yearsOptions, ...SELECT_PROPS }), _jsx("div", { className: "my-auto", onClick: handleNextMonth, children: _jsx(Icon, { ...ICON_PROPS, className: "rotate-90 cursor-pointer" }) })] }), _jsx(Calendar, { today: value, currentMonth: selectedMonth, currentYear: selectedYear, onDateSelect: onChange, min: minDate, max: maxDate, setValue: setValue })] })) : null] })] }));
 });
 const renderDatePickerForm = (handleChangeVisibleCalendar, value, valid) => (_jsxs("div", { onClick: handleChangeVisibleCalendar, className: style(formStyle, valid ? 'border-gray' : 'border-error'), children: [_jsx(Paragraph, { children: value && formatDate(value) }), _jsx(Icon, { ...ICON_PROPS, name: "CalendarIcon" })] }));
 //# sourceMappingURL=DatePicker.js.map

package/mobile/lib/ui-kit/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/ui-kit/DatePicker/DatePicker.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/ui-kit/DatePicker/DatePicker.tsx"],"names":[],"mappings":"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"}

package/mobile/src/hooks/useElementSpace.ts

@@ -0,0 +1,25 @@
+import { useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { type RefObject } from 'react';
+
+export const useElementSpace = (ref: RefObject<HTMLElement>, heightEl: number) => {
+  const [spaceAbove, setSpaceAbove] = useState(false);
+
+  useEffect(() => {
+    const handleResize = () => {
+      if (ref?.current) {
+        const { top } = ref.current.getBoundingClientRect();
+
+        const hasSpaceAbove = top > heightEl;
+
+        setSpaceAbove(hasSpaceAbove);
+      }
+    };
+
+    handleResize();
+    window.addEventListener('resize', handleResize);
+
+    return () => window.removeEventListener('resize', handleResize);
+  }, [ref]);
+
+  return spaceAbove;
+};

package/mobile/src/ui-kit/DatePicker/DatePicker.tsx

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
+import { useElementSpace } from '../../hooks/useElementSpace';
 import { type LabelProps } from '../../model/HeadlineType';
 import { type IconVersion } from '../../model/IconVersion';
 import { formatDate } from '../../utils/formatDate';
@@ -65,13 +66,19 @@ export const DatePicker = JSX<DatePickerProps>(
       showCalendar,
     });
 
+    const spaceAbove = useElementSpace(ref, 370);
+
     return (
       <div className={style('space-y-xs', className)} ref={ref}>
         {renderLabel(label)}
         <div className="relative">
           {renderDatePickerForm(handleChangeVisibleCalendar, value, valid)}
           {showCalendar ? (
-            <div className="absolute bg-white z-20 select-none bottom-full">
+            <div
+              className={style('absolute bg-white z-20 select-none', {
+                'bottom-full': spaceAbove,
+              })}
+            >
               <div className="flex gap-s">
                 <div className="my-auto" onClick={handlePrevMonth}>
                   <Icon {...ICON_PROPS} className="-rotate-90 cursor-pointer" />
@@ -99,6 +106,7 @@ export const DatePicker = JSX<DatePickerProps>(
                 onDateSelect={onChange}
                 min={minDate}
                 max={maxDate}
+                setValue={setValue}
               />
             </div>
           ) : null}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.589",
+  "version": "0.14.590",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/hooks/useElementSpace.ts

@@ -0,0 +1,25 @@
+import { useEffect, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { type RefObject } from 'react';
+
+export const useElementSpace = (ref: RefObject<HTMLElement>, heightEl: number) => {
+  const [spaceAbove, setSpaceAbove] = useState(false);
+
+  useEffect(() => {
+    const handleResize = () => {
+      if (ref?.current) {
+        const { top } = ref.current.getBoundingClientRect();
+
+        const hasSpaceAbove = top > heightEl;
+
+        setSpaceAbove(hasSpaceAbove);
+      }
+    };
+
+    handleResize();
+    window.addEventListener('resize', handleResize);
+
+    return () => window.removeEventListener('resize', handleResize);
+  }, [ref]);
+
+  return spaceAbove;
+};

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

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
+import { useElementSpace } from '../../hooks/useElementSpace';
 import { type LabelProps } from '../../model/HeadlineType';
 import { type IconVersion } from '../../model/IconVersion';
 import { formatDate } from '../../utils/formatDate';
@@ -65,13 +66,19 @@ export const DatePicker = JSX<DatePickerProps>(
       showCalendar,
     });
 
+    const spaceAbove = useElementSpace(ref, 370);
+
     return (
       <div className={style('space-y-xs', className)} ref={ref}>
         {renderLabel(label)}
         <div className="relative">
           {renderDatePickerForm(handleChangeVisibleCalendar, value, valid)}
           {showCalendar ? (
-            <div className="absolute bg-white z-20 select-none bottom-full">
+            <div
+              className={style('absolute bg-white z-20 select-none', {
+                'bottom-full': spaceAbove,
+              })}
+            >
               <div className="flex gap-s">
                 <div className="my-auto" onClick={handlePrevMonth}>
                   <Icon {...ICON_PROPS} className="-rotate-90 cursor-pointer" />
@@ -99,6 +106,7 @@ export const DatePicker = JSX<DatePickerProps>(
                 onDateSelect={onChange}
                 min={minDate}
                 max={maxDate}
+                setValue={setValue}
               />
             </div>
           ) : null}