@uzum-tech/ui 1.10.1 → 1.11.0

package/lib/drawer/src/Drawer.js

@@ -57,7 +57,11 @@ exports.drawerProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props),
     }, blockScroll: {
         type: Boolean,
         default: true
-    }, maxWidth: Number, maxHeight: Number, minWidth: Number, minHeight: Number, resizable: Boolean, fullscreen: Boolean, onUpdateWidth: [Function, Array], onUpdateHeight: [Function, Array], 'onUpdate:width': [Function, Array], 'onUpdate:height': [Function, Array], 'onUpdate:show': [Function, Array], onUpdateShow: [Function, Array], onAfterEnter: Function, onAfterLeave: Function, 
+    }, maxWidth: Number, maxHeight: Number, minWidth: Number, minHeight: Number, resizable: Boolean, fullscreen: Boolean, defaultWidth: {
+        type: [Number, String]
+    }, defaultHeight: {
+        type: [Number, String]
+    }, onUpdateWidth: [Function, Array], onUpdateHeight: [Function, Array], 'onUpdate:width': [Function, Array], 'onUpdate:height': [Function, Array], 'onUpdate:show': [Function, Array], onUpdateShow: [Function, Array], onAfterEnter: Function, onAfterLeave: Function, 
     /** @deprecated */
     drawerStyle: [String, Object], 
     /** @deprecated */
@@ -95,8 +99,8 @@ exports.default = (0, vue_1.defineComponent)({
         const { mergedClsPrefixRef, namespaceRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);
         const isMountedRef = (0, vooks_1.useIsMounted)();
         const themeRef = (0, _mixins_1.useTheme)('Drawer', '-drawer', index_cssr_1.default, styles_1.drawerLight, props, mergedClsPrefixRef);
-        const uncontrolledWidthRef = (0, vue_1.ref)(sizesWidth[props.size]);
-        const uncontrolledHeightRef = (0, vue_1.ref)(sizesHeight[props.size]);
+        const uncontrolledWidthRef = (0, vue_1.ref)(props.defaultWidth || sizesWidth[props.size]);
+        const uncontrolledHeightRef = (0, vue_1.ref)(props.defaultHeight || sizesHeight[props.size]);
         const mergedWidthRef = (0, vooks_1.useMergedState)((0, vue_1.toRef)(props, 'width'), uncontrolledWidthRef);
         const mergedHeightRef = (0, vooks_1.useMergedState)((0, vue_1.toRef)(props, 'height'), uncontrolledHeightRef);
         const styleWidthRef = (0, vue_1.computed)(() => {
@@ -115,31 +119,29 @@ exports.default = (0, vue_1.defineComponent)({
                 return '';
             return (0, _utils_1.formatLength)(mergedHeightRef.value);
         });
-        const doUpdate = (isHeight, value) => {
-            let { onUpdateWidth: onUpdate, 'onUpdate:width': _onUpdate, maxWidth: max, minWidth: min } = props;
-            let _ref = uncontrolledWidthRef;
-            if (isHeight) {
-                onUpdate = props.onUpdateHeight;
-                _onUpdate = props['onUpdate:height'];
-                max = props.maxHeight;
-                min = props.minHeight;
-                _ref = uncontrolledHeightRef;
+        const doUpdateWidth = (value) => {
+            const { onUpdateWidth, 'onUpdate:width': _onUpdateWidth } = props;
+            if (onUpdateWidth) {
+                (0, _utils_1.call)(onUpdateWidth, value);
             }
-            if (max && value > max)
-                value = max;
-            if (min && value < min)
-                value = min;
-            if (onUpdate)
-                (0, _utils_1.call)(onUpdate, value);
-            if (_onUpdate)
-                (0, _utils_1.call)(_onUpdate, value);
-            _ref.value = value;
+            if (_onUpdateWidth) {
+                (0, _utils_1.call)(_onUpdateWidth, value);
+            }
+            uncontrolledWidthRef.value = value;
+        };
+        const doUpdateHeight = (value) => {
+            const { onUpdateHeight, 'onUpdate:width': _onUpdateHeight } = props;
+            if (onUpdateHeight) {
+                (0, _utils_1.call)(onUpdateHeight, value);
+            }
+            if (_onUpdateHeight) {
+                (0, _utils_1.call)(_onUpdateHeight, value);
+            }
+            uncontrolledHeightRef.value = value;
         };
-        const doUpdateWidth = doUpdate.bind(null, false);
-        const doUpdateHeight = doUpdate.bind(null, true);
         (0, vue_1.watchEffect)(() => {
-            doUpdateWidth(sizesWidth[props.size]);
-            doUpdateHeight(sizesHeight[props.size]);
+            doUpdateWidth(Number(props.defaultWidth || sizesWidth[props.size]));
+            doUpdateHeight(Number(props.defaultHeight || sizesHeight[props.size]));
         });
         const mergedBodyStyleRef = (0, vue_1.computed)(() => {
             return [
@@ -268,7 +270,7 @@ exports.default = (0, vue_1.defineComponent)({
                                     `${mergedClsPrefix}-drawer-mask--invisible`
                             ], onClick: this.handleMaskClick })) : null
                     })) : null,
-                    (0, vue_1.h)(DrawerBodyWrapper_1.default, Object.assign({}, this.$attrs, { class: [this.drawerClass, this.$attrs.class], style: [this.mergedBodyStyle, this.$attrs.style], blockScroll: this.blockScroll, contentStyle: this.contentStyle, placement: this.placement, rounded: this.rounded, scrollbarProps: this.scrollbarProps, show: this.show, displayDirective: this.displayDirective, nativeScrollbar: this.nativeScrollbar, onAfterEnter: this.onAfterEnter, onAfterLeave: this.onAfterLeave, trapFocus: this.trapFocus, autoFocus: this.autoFocus, resizable: this.resizable, showMask: this.showMask, onEsc: this.handleEsc, onClickoutside: this.handleMaskClick }), this.$slots)), [[vdirs_1.zindexable, { zIndex: this.zIndex, enabled: this.show }]]);
+                    (0, vue_1.h)(DrawerBodyWrapper_1.default, Object.assign({}, this.$attrs, { class: [this.drawerClass, this.$attrs.class], style: [this.mergedBodyStyle, this.$attrs.style], blockScroll: this.blockScroll, contentStyle: this.contentStyle, placement: this.placement, rounded: this.rounded, scrollbarProps: this.scrollbarProps, show: this.show, displayDirective: this.displayDirective, nativeScrollbar: this.nativeScrollbar, onAfterEnter: this.onAfterEnter, onAfterLeave: this.onAfterLeave, trapFocus: this.trapFocus, autoFocus: this.autoFocus, resizable: this.resizable, maxHeight: this.maxHeight, minHeight: this.minHeight, maxWidth: this.maxWidth, minWidth: this.minWidth, showMask: this.showMask, onEsc: this.handleEsc, onClickoutside: this.handleMaskClick }), this.$slots)), [[vdirs_1.zindexable, { zIndex: this.zIndex, enabled: this.show }]]);
             }
         }));
     }

package/lib/drawer/src/DrawerBodyWrapper.d.ts

@@ -37,6 +37,10 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<boolean | "transparent">;
         required: true;
     };
+    maxWidth: NumberConstructor;
+    maxHeight: NumberConstructor;
+    minWidth: NumberConstructor;
+    minHeight: NumberConstructor;
     resizable: BooleanConstructor;
     onClickoutside: PropType<(e: MouseEvent) => void>;
     onAfterLeave: PropType<() => void>;
@@ -148,6 +152,10 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<boolean | "transparent">;
         required: true;
     };
+    maxWidth: NumberConstructor;
+    maxHeight: NumberConstructor;
+    minWidth: NumberConstructor;
+    minHeight: NumberConstructor;
     resizable: BooleanConstructor;
     onClickoutside: PropType<(e: MouseEvent) => void>;
     onAfterLeave: PropType<() => void>;

package/lib/drawer/src/DrawerBodyWrapper.js

@@ -48,6 +48,10 @@ exports.default = (0, vue_1.defineComponent)({
             type: [Boolean, String],
             required: true
         },
+        maxWidth: Number,
+        maxHeight: Number,
+        minWidth: Number,
+        minHeight: Number,
         resizable: Boolean,
         onClickoutside: Function,
         onAfterLeave: Function,
@@ -74,9 +78,9 @@ exports.default = (0, vue_1.defineComponent)({
             startPosition = isVertical.value ? e.clientY : e.clientX;
             memoizedBodyStyleCursor = document.body.style.cursor;
             document.body.style.cursor = isVertical.value ? 'ns-resize' : 'ew-resize';
-            window.addEventListener('mousemove', handleBodyMousemove);
-            window.addEventListener('mouseleave', handleBodyMouseleave);
-            window.addEventListener('mouseup', handleBodyMouseup);
+            document.body.addEventListener('mousemove', handleBodyMousemove);
+            document.body.addEventListener('mouseleave', handleBodyMouseleave);
+            document.body.addEventListener('mouseup', handleBodyMouseup);
         };
         const handleMouseenterResizeTrigger = () => {
             if (hoverTimerId !== null) {
@@ -100,13 +104,36 @@ exports.default = (0, vue_1.defineComponent)({
             isHoverOnResizeTriggerRef.value = false;
         };
         const { doUpdateHeight, doUpdateWidth } = UDrawer;
-        const handleBodyMousemove = (e) => {
+        const regulateWidth = (size) => {
+            const { maxWidth } = props;
+            if (maxWidth && size > maxWidth) {
+                return maxWidth;
+            }
+            const { minWidth } = props;
+            if (minWidth && size < minWidth) {
+                return minWidth;
+            }
+            return size;
+        };
+        const regulateHeight = (size) => {
+            const { maxHeight } = props;
+            if (maxHeight && size > maxHeight) {
+                return maxHeight;
+            }
+            const { minHeight } = props;
+            if (minHeight && size < minHeight) {
+                return minHeight;
+            }
+            return size;
+        };
+        function handleBodyMousemove(e) {
             var _a, _b;
             if (isDraggingRef.value) {
                 if (isVertical.value) {
                     let height = ((_a = bodyRef.value) === null || _a === void 0 ? void 0 : _a.offsetHeight) || 0;
                     const increment = startPosition - e.clientY;
                     height += props.placement === 'bottom' ? increment : -increment;
+                    height = regulateHeight(height);
                     doUpdateHeight(height);
                     startPosition = e.clientY;
                 }
@@ -114,19 +141,20 @@ exports.default = (0, vue_1.defineComponent)({
                     let width = ((_b = bodyRef.value) === null || _b === void 0 ? void 0 : _b.offsetWidth) || 0;
                     const increment = startPosition - e.clientX;
                     width += props.placement === 'right' ? increment : -increment;
+                    width = regulateWidth(width);
                     doUpdateWidth(width);
                     startPosition = e.clientX;
                 }
             }
-        };
+        }
         const handleBodyMouseup = () => {
             if (isDraggingRef.value) {
                 startPosition = 0;
                 isDraggingRef.value = false;
                 document.body.style.cursor = memoizedBodyStyleCursor;
-                window.removeEventListener('mousemove', handleBodyMousemove);
-                window.removeEventListener('mouseup', handleBodyMouseup);
-                window.removeEventListener('mouseleave', handleBodyMouseleave);
+                document.body.removeEventListener('mousemove', handleBodyMousemove);
+                document.body.removeEventListener('mouseup', handleBodyMouseup);
+                document.body.removeEventListener('mouseleave', handleBodyMouseleave);
             }
         };
         const handleBodyMouseleave = handleBodyMouseup;

package/lib/safe-top-scrollbar/index.d.ts

@@ -0,0 +1,2 @@
+export { default as USafeTopScrollbar, safeTopScrollbarProps } from './src/SafeTopScrollbar';
+export type { SafeTopScrollbarInst, SafeTopScrollbarProps } from './src/SafeTopScrollbar';

package/lib/safe-top-scrollbar/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.safeTopScrollbarProps = exports.USafeTopScrollbar = void 0;
+var SafeTopScrollbar_1 = require("./src/SafeTopScrollbar");
+Object.defineProperty(exports, "USafeTopScrollbar", { enumerable: true, get: function () { return __importDefault(SafeTopScrollbar_1).default; } });
+Object.defineProperty(exports, "safeTopScrollbarProps", { enumerable: true, get: function () { return SafeTopScrollbar_1.safeTopScrollbarProps; } });

package/lib/safe-top-scrollbar/src/SafeTopScrollbar.d.ts

@@ -0,0 +1,177 @@
+import { type PropType } from 'vue';
+import type { ExtractPublicPropTypes } from '../../_utils';
+export interface ScrollTo {
+    (x: number, y: number): void;
+    (options: {
+        left?: number;
+        top?: number;
+        behavior?: ScrollBehavior;
+    }): void;
+}
+export type ScrollBy = ScrollTo;
+export interface SafeTopScrollbarInst {
+    scrollTo: ScrollTo;
+    scrollBy: ScrollBy;
+    getScrollState: () => {
+        scrollHeight: number;
+        scrollTop: number;
+        clientHeight: number;
+    };
+    adjustScrollTop: (heightDiff: number) => void;
+}
+export declare const safeTopScrollbarProps: {
+    readonly trigger: PropType<"none" | "hover">;
+    readonly xScrollable: BooleanConstructor;
+    readonly onScroll: PropType<(e: Event) => void>;
+    readonly size: NumberConstructor;
+    readonly theme: PropType<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>>;
+};
+export type SafeTopScrollbarProps = ExtractPublicPropTypes<typeof safeTopScrollbarProps>;
+declare const SafeTopScrollbar: import("vue").DefineComponent<{
+    readonly trigger: PropType<"none" | "hover">;
+    readonly xScrollable: BooleanConstructor;
+    readonly onScroll: PropType<(e: Event) => void>;
+    readonly size: NumberConstructor;
+    readonly theme: PropType<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>>;
+}, {
+    scrollbarInstRef: import("vue").Ref<{
+        $el: HTMLElement;
+        containerRef: HTMLElement | null;
+        contentRef: HTMLElement | null;
+        containerScrollTop: number;
+        syncUnifiedContainer: () => void;
+        scrollTo: import("../../_internal/safe-top-scrollbar/src/SafeTopScrollbar").ScrollTo;
+        scrollBy: import("../../_internal/safe-top-scrollbar/src/SafeTopScrollbar").ScrollBy;
+        sync: () => void;
+        handleMouseEnterWrapper: () => void;
+        handleMouseLeaveWrapper: () => void;
+        getScrollState: () => {
+            scrollHeight: number;
+            scrollTop: number;
+            clientHeight: number;
+        };
+        adjustScrollTop: (heightDiff: number) => void;
+    } | null>;
+    scrollTo: ScrollTo;
+    scrollBy: ScrollBy;
+    getScrollState: () => {
+        scrollHeight: number;
+        scrollTop: number;
+        clientHeight: number;
+    };
+    adjustScrollTop: (heightDiff: number) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly trigger: PropType<"none" | "hover">;
+    readonly xScrollable: BooleanConstructor;
+    readonly onScroll: PropType<(e: Event) => void>;
+    readonly size: NumberConstructor;
+    readonly theme: PropType<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"SafeTopScrollbar", {
+        height: string;
+        width: string;
+        borderRadius: string;
+        color: string;
+        colorHover: string;
+        railInsetHorizontalBottom: string;
+        railInsetHorizontalTop: string;
+        railInsetVerticalRight: string;
+        railInsetVerticalLeft: string;
+        railColor: string;
+    }, any>>>;
+}>>, {
+    readonly xScrollable: boolean;
+}, {}>;
+export default SafeTopScrollbar;

package/lib/safe-top-scrollbar/src/SafeTopScrollbar.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.safeTopScrollbarProps = void 0;
+const vue_1 = require("vue");
+const _internal_1 = require("../../_internal");
+const _mixins_1 = require("../../_mixins");
+exports.safeTopScrollbarProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { trigger: String, xScrollable: Boolean, onScroll: Function, size: Number });
+const SafeTopScrollbar = (0, vue_1.defineComponent)({
+    name: 'SafeTopScrollbar',
+    props: exports.safeTopScrollbarProps,
+    setup() {
+        const scrollbarInstRef = (0, vue_1.ref)(null);
+        const exposedMethods = {
+            scrollTo: (...args) => {
+                var _a;
+                (_a = scrollbarInstRef.value) === null || _a === void 0 ? void 0 : _a.scrollTo(args[0], args[1]);
+            },
+            scrollBy: (...args) => {
+                var _a;
+                (_a = scrollbarInstRef.value) === null || _a === void 0 ? void 0 : _a.scrollBy(args[0], args[1]);
+            },
+            getScrollState: () => {
+                var _a;
+                return (((_a = scrollbarInstRef.value) === null || _a === void 0 ? void 0 : _a.getScrollState()) || {
+                    scrollHeight: 0,
+                    scrollTop: 0,
+                    clientHeight: 0
+                });
+            },
+            adjustScrollTop: (heightDiff) => {
+                var _a;
+                (_a = scrollbarInstRef.value) === null || _a === void 0 ? void 0 : _a.adjustScrollTop(heightDiff);
+            }
+        };
+        return Object.assign(Object.assign({}, exposedMethods), { scrollbarInstRef });
+    },
+    render() {
+        return ((0, vue_1.h)(_internal_1.USafeTopScrollbar, Object.assign({ ref: "scrollbarInstRef" }, this.$props), this.$slots));
+    }
+});
+exports.default = SafeTopScrollbar;

package/lib/themes/dark.js

@@ -1,4 +1,7 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.darkTheme = void 0;
 const common_1 = require("../_styles/common");
@@ -93,6 +96,7 @@ const styles_88 = require("../styles");
 const styles_89 = require("../chat/styles");
 const styles_90 = require("../modal-fullscreen/styles");
 const styles_91 = require("../crop/styles");
+const dark_1 = __importDefault(require("../_internal/safe-top-scrollbar/styles/dark"));
 exports.darkTheme = {
     name: 'dark',
     common: common_1.commonDark,
@@ -160,6 +164,7 @@ exports.darkTheme = {
     Result: styles_59.resultDark,
     Row: styles_60.rowDark,
     Scrollbar: styles_61.scrollbarDark,
+    SafeTopScrollbar: dark_1.default,
     Select: styles_62.selectDark,
     Skeleton: styles_63.skeletonDark,
     Slider: styles_64.sliderDark,

package/lib/themes/light.js

@@ -1,4 +1,7 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.lightTheme = void 0;
 // The file is for internal usage, do not export it, since all the components
@@ -95,6 +98,7 @@ const styles_88 = require("../input-otp/styles");
 const styles_89 = require("../chat/styles");
 const styles_90 = require("../modal-fullscreen/styles");
 const styles_91 = require("../crop/styles");
+const light_1 = __importDefault(require("../_internal/safe-top-scrollbar/styles/light"));
 exports.lightTheme = {
     name: 'light',
     common: common_1.commonLight,
@@ -162,6 +166,7 @@ exports.lightTheme = {
     Row: styles_60.rowLight,
     Result: styles_59.resultLight,
     Scrollbar: styles_61.scrollbarLight,
+    SafeTopScrollbar: light_1.default,
     Skeleton: styles_63.skeletonLight,
     Select: styles_62.selectLight,
     Slider: styles_64.sliderLight,

package/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "1.10.1";
+declare const _default: "1.11.0";
 export default _default;

package/lib/version.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = '1.10.1';
+exports.default = '1.11.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uzum-tech/ui",
-  "version": "1.10.1",
+  "version": "1.11.0",
   "description": "A Vue 3 Component Library. Fairly Complete, Theme Customizable, Uses TypeScript, Fast",
   "main": "lib/index.js",
   "module": "es/index.js",

package/volar.d.ts

@@ -154,6 +154,7 @@ declare module 'vue' {
     UModalFullscreen: typeof import('@uzum-tech/ui')['UModalFullscreen']
     UCrop: typeof import('@uzum-tech/ui')['UCrop']
     UTagGroup: typeof import('@uzum-tech/ui')['UTagGroup']
+    USafeTopScrollbar: typeof import('@uzum-tech/ui')['USafeTopScrollbar']
   }
 }
 export {}

package/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "framework": "vue",
   "name": "@uzum-tech/ui",
-  "version": "1.10.1",
+  "version": "1.11.0",
   "js-types-syntax": "typescript",
   "contributions": {
     "html": {
@@ -2231,7 +2231,14 @@
                 "name": "attachment-upload",
                 "doc-url": "https://www.naiveui.com/en-US/os-theme/components/chat",
                 "type": "(file: File) => Promise<ChatAttachment>",
-                "description": "Callback when a file is uploaded.",
+                "description": "Callback when a file is uploaded. Allows you to upload files to your storage and return the file ID and URL. Invoked automatically when user selects files.",
+                "default": "undefined"
+              },
+              {
+                "name": "attachment-download",
+                "doc-url": "https://www.naiveui.com/en-US/os-theme/components/chat",
+                "type": "(attachment: ChatAttachment) => Promise<void>",
+                "description": "Callback when a file download button is clicked. Allows you to download files with custom headers (e.g., authorization). Prevents default download behavior when defined.",
                 "default": "undefined"
               },
               {
@@ -5268,6 +5275,21 @@
               "doc-url": "https://www.naiveui.com/en-US/os-theme/components/drawer",
               "type": "boolean"
             },
+            {
+              "name": "default-width",
+              "doc-url": "https://www.naiveui.com/en-US/os-theme/components/drawer",
+              "type": "number | string",
+              "description": "Default width of the drawer, works when placement is `left` and `right`.",
+              "default": "616",
+              "description-sections": {
+                "since": "1.8.3"
+              }
+            },
+            {
+              "name": "default-height",
+              "doc-url": "https://www.naiveui.com/en-US/os-theme/components/drawer",
+              "type": "number | string"
+            },
             {
               "name": "drawer-style",
               "doc-url": "https://www.naiveui.com/en-US/os-theme/components/drawer",
@@ -12568,6 +12590,40 @@
             ]
           }
         },
+        {
+          "name": "USafeTopScrollbar",
+          "doc-url": "https://www.naiveui.com/en-US/os-theme/components/safe-top-scrollbar",
+          "source": {
+            "symbol": "USafeTopScrollbar"
+          },
+          "slots": [],
+          "attributes": [],
+          "props": [
+            {
+              "name": "trigger",
+              "doc-url": "https://www.naiveui.com/en-US/os-theme/components/safe-top-scrollbar",
+              "type": "string"
+            },
+            {
+              "name": "x-scrollable",
+              "doc-url": "https://www.naiveui.com/en-US/os-theme/components/safe-top-scrollbar",
+              "type": "boolean"
+            },
+            {
+              "name": "size",
+              "doc-url": "https://www.naiveui.com/en-US/os-theme/components/safe-top-scrollbar",
+              "type": "number"
+            }
+          ],
+          "js": {
+            "events": [
+              {
+                "name": "scroll",
+                "doc-url": "https://www.naiveui.com/en-US/os-theme/components/safe-top-scrollbar"
+              }
+            ]
+          }
+        },
         {
           "name": "USelect",
           "doc-url": "https://www.naiveui.com/en-US/os-theme/components/select",