@uzum-tech/ui 1.9.1 → 1.10.1

package/es/_internal/scrollbar/src/Scrollbar.js

@@ -105,9 +105,8 @@ const Scrollbar = defineComponent({
             }
             else {
                 const heightDiff = contentHeight - containerHeight;
-                if (!heightDiff) {
+                if (!heightDiff)
                     return 0;
-                }
                 return ((containerScrollTop / heightDiff) * (yRailSize - yBarSizeRef.value));
             }
         });
@@ -126,9 +125,8 @@ const Scrollbar = defineComponent({
             }
             else {
                 const widthDiff = contentWidth - containerWidth;
-                if (!widthDiff) {
+                if (!widthDiff)
                     return 0;
-                }
                 return ((containerScrollLeft / widthDiff) * (xRailSize - xBarSizeRef.value));
             }
         });
@@ -159,22 +157,19 @@ const Scrollbar = defineComponent({
         });
         const mergedContainerRef = computed(() => {
             const { container } = props;
-            if (container) {
+            if (container)
                 return container();
-            }
             return containerRef.value;
         });
         const mergedContentRef = computed(() => {
             const { content } = props;
-            if (content) {
+            if (content)
                 return content();
-            }
             return contentRef.value;
         });
         const scrollTo = (options, y) => {
-            if (!props.scrollable) {
+            if (!props.scrollable)
                 return;
-            }
             if (typeof options === 'number') {
                 scrollToPosition(options, y !== null && y !== void 0 ? y : 0, 0, false, 'auto');
                 return;
@@ -208,15 +203,13 @@ const Scrollbar = defineComponent({
         });
         // methods
         const handleContentResize = () => {
-            if (activateState.isDeactivated) {
+            if (activateState.isDeactivated)
                 return;
-            }
             sync();
         };
         const handleContainerResize = (e) => {
-            if (activateState.isDeactivated) {
+            if (activateState.isDeactivated)
                 return;
-            }
             const { onResize } = props;
             if (onResize) {
                 onResize(e);
@@ -224,13 +217,11 @@ const Scrollbar = defineComponent({
             sync();
         };
         const scrollBy = (options, y) => {
-            if (!props.scrollable) {
+            if (!props.scrollable)
                 return;
-            }
             const { value: container } = mergedContainerRef;
-            if (!container) {
+            if (!container)
                 return;
-            }
             if (typeof options === 'object') {
                 container.scrollBy(options);
             }
@@ -240,9 +231,8 @@ const Scrollbar = defineComponent({
         };
         function scrollToPosition(left, top, elSize, debounce, behavior) {
             const { value: container } = mergedContainerRef;
-            if (!container) {
+            if (!container)
                 return;
-            }
             if (debounce) {
                 const { scrollTop, offsetHeight } = container;
                 if (top > scrollTop) {
@@ -307,9 +297,8 @@ const Scrollbar = defineComponent({
         }
         function handleScroll(e) {
             const { onScroll } = props;
-            if (onScroll) {
+            if (onScroll)
                 onScroll(e);
-            }
             syncScrollState();
         }
         function syncScrollState() {
@@ -368,9 +357,8 @@ const Scrollbar = defineComponent({
             }
         }
         function sync() {
-            if (!props.scrollable) {
+            if (!props.scrollable)
                 return;
-            }
             if (props.useUnifiedContainer) {
                 syncUnifiedContainer();
             }
@@ -395,9 +383,8 @@ const Scrollbar = defineComponent({
                 : e.clientX;
         }
         function handleXScrollMouseMove(e) {
-            if (!xBarPressed) {
+            if (!xBarPressed)
                 return;
-            }
             if (xBarVanishTimerId !== undefined) {
                 window.clearTimeout(xBarVanishTimerId);
             }
@@ -407,9 +394,8 @@ const Scrollbar = defineComponent({
             const { value: containerWidth } = containerWidthRef;
             const { value: contentWidth } = contentWidthRef;
             const { value: xBarSize } = xBarSizeRef;
-            if (containerWidth === null || contentWidth === null) {
+            if (containerWidth === null || contentWidth === null)
                 return;
-            }
             const dX = (rtlEnabledRef === null || rtlEnabledRef === void 0 ? void 0 : rtlEnabledRef.value)
                 ? window.innerWidth - e.clientX - memoMouseX
                 : e.clientX - memoMouseX;
@@ -422,9 +408,8 @@ const Scrollbar = defineComponent({
             if (container) {
                 container.scrollLeft = toScrollLeft * ((rtlEnabledRef === null || rtlEnabledRef === void 0 ? void 0 : rtlEnabledRef.value) ? -1 : 1);
                 const { internalOnUpdateScrollLeft } = props;
-                if (internalOnUpdateScrollLeft) {
+                if (internalOnUpdateScrollLeft)
                     internalOnUpdateScrollLeft(toScrollLeft);
-                }
             }
         }
         function handleXScrollMouseUp(e) {
@@ -448,9 +433,8 @@ const Scrollbar = defineComponent({
             memoMouseY = e.clientY;
         }
         function handleYScrollMouseMove(e) {
-            if (!yBarPressed) {
+            if (!yBarPressed)
                 return;
-            }
             if (xBarVanishTimerId !== undefined) {
                 window.clearTimeout(xBarVanishTimerId);
             }
@@ -460,9 +444,8 @@ const Scrollbar = defineComponent({
             const { value: containerHeight } = containerHeightRef;
             const { value: contentHeight } = contentHeightRef;
             const { value: yBarSize } = yBarSizeRef;
-            if (containerHeight === null || contentHeight === null) {
+            if (containerHeight === null || contentHeight === null)
                 return;
-            }
             const dY = e.clientY - memoMouseY;
             const dScrollTop = (dY * (contentHeight - containerHeight)) / (containerHeight - yBarSize);
             const toScrollTopUpperBound = contentHeight - containerHeight;
@@ -517,9 +500,8 @@ const Scrollbar = defineComponent({
             // if you pass inner to scrollbar, you may use a ref inside component
             // however, when scrollbar is mounted, ref is not ready at component
             // you need to init by yourself
-            if (props.container) {
+            if (props.container)
                 return;
-            }
             sync();
         });
         onBeforeUnmount(() => {
@@ -593,9 +575,8 @@ const Scrollbar = defineComponent({
     render() {
         var _a;
         const { $slots, mergedClsPrefix, triggerDisplayManually, rtlEnabled, internalHoistYRail, yPlacement, xPlacement, xScrollable } = this;
-        if (!this.scrollable) {
+        if (!this.scrollable)
             return (_a = $slots.default) === null || _a === void 0 ? void 0 : _a.call($slots);
-        }
         const triggerIsNone = this.trigger === 'none';
         const createYRail = (className, style) => {
             return (h("div", { ref: "yRailRef", class: [

package/es/auto-complete/src/AutoComplete.d.ts

@@ -1610,8 +1610,8 @@ declare const _default: import("vue").DefineComponent<{
     readonly to: string | boolean | HTMLElement;
     readonly resetMenuOnOptionsChange: boolean;
     readonly placement: FollowerPlacement;
-    readonly clearable: boolean;
     readonly defaultValue: string | null;
+    readonly clearable: boolean;
     readonly options: AutoCompleteOptions;
     readonly blurAfterSelect: boolean;
     readonly clearAfterSelect: boolean;

package/es/cascader/src/Cascader.d.ts

@@ -3364,9 +3364,9 @@ declare const _default: import("vue").DefineComponent<{
     readonly virtualScroll: boolean;
     readonly valueField: string;
     readonly placement: FollowerPlacement;
+    readonly defaultValue: Value | null;
     readonly filterable: boolean;
     readonly clearable: boolean;
-    readonly defaultValue: Value | null;
     readonly options: CascaderOption[];
     readonly clearFilterAfterSelect: boolean;
     readonly remote: boolean;

package/es/chat/src/ChatListItems.js

@@ -90,11 +90,26 @@ export default defineComponent({
             var _a;
             (_a = props.onChatSelect) === null || _a === void 0 ? void 0 : _a.call(props, chatId);
         };
+        const toKeyString = (value) => {
+            if (typeof value === 'symbol')
+                return value.toString();
+            if (typeof value === 'function') {
+                const result = value();
+                return typeof result === 'string' || typeof result === 'number'
+                    ? String(result)
+                    : '';
+            }
+            return value != null ? String(value) : '';
+        };
         const renderChatItem = (item) => {
             var _a, _b;
             const isSelected = props.selectedChatId === item.id;
             const isTyping = (_b = (_a = props.typingChatIds) === null || _a === void 0 ? void 0 : _a.includes(item.id)) !== null && _b !== void 0 ? _b : false;
-            return (h(UListItem, { key: item.id, showIcon: false, onClick: () => {
+            const { id, title, subtitle } = item;
+            const keyId = toKeyString(id);
+            const keyTitle = toKeyString(title);
+            const keySubtitle = toKeyString(subtitle);
+            return (h(UListItem, { key: `${keyId}-${keyTitle}-${keySubtitle}`, showIcon: false, onClick: () => {
                     handleChatSelect(item.id);
                 }, class: [
                     `${mergedClsPrefixRef.value}-chat-sidebar__item`,

package/es/chat/src/ChatParts/MainArea.js

@@ -153,22 +153,36 @@ export default defineComponent({
                 el.scrollTop = el.scrollHeight;
             }
         };
+        const toKeyString = (value) => {
+            if (typeof value === 'symbol')
+                return value.toString();
+            if (typeof value === 'function') {
+                const result = value();
+                return typeof result === 'string' || typeof result === 'number'
+                    ? String(result)
+                    : '';
+            }
+            return value != null ? String(value) : '';
+        };
         const renderHeader = () => {
             return (h("div", { class: `${mergedClsPrefixRef.value}-chat-main__header` },
                 h(UFlex, { justify: "space-between", align: "flex-start", wrap: false }, {
-                    default: () => (h(Fragment, null,
-                        h(UText, { variant: "heading-s-bold", class: `${mergedClsPrefixRef.value}-chat-main__header-title`, theme: mergedThemeRef.value.peers.Typography, themeOverrides: mergedThemeRef.value.peerOverrides.Typography }, {
-                            default: () => { var _a, _b; return (_b = (_a = selectedChatRef.value) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : ''; }
-                        }),
-                        h(UFlex, { align: "center", size: "small", class: `${mergedClsPrefixRef.value}-chat-main__header-actions` }, {
-                            default: () => resolveSlot(slots.headerActions, () => {
-                                const shareButtonProps = Object.assign(Object.assign({}, headerButtonPropsRef.value), headerShareButtonPropsRef.value);
-                                const profileButtonProps = Object.assign(Object.assign({}, headerButtonPropsRef.value), headerProfileButtonPropsRef.value);
-                                const closeButtonProps = Object.assign(Object.assign({}, headerButtonPropsRef.value), headerCloseButtonPropsRef.value);
-                                const shareIconProps = Object.assign(Object.assign({}, headerIconPropsRef.value), headerShareIconPropsRef.value);
-                                const profileIconProps = Object.assign(Object.assign({}, headerIconPropsRef.value), headerProfileIconPropsRef.value);
-                                const buttons = [];
-                                if (shareButtonProps.disabled !== true) {
+                    default: () => {
+                        const chat = selectedChatRef.value;
+                        const keyId = toKeyString(chat === null || chat === void 0 ? void 0 : chat.id);
+                        const keyTitle = toKeyString(chat === null || chat === void 0 ? void 0 : chat.title);
+                        return (h(Fragment, null,
+                            h(UText, { key: `${keyId}-${keyTitle}`, variant: "heading-s-bold", class: `${mergedClsPrefixRef.value}-chat-main__header-title`, theme: mergedThemeRef.value.peers.Typography, themeOverrides: mergedThemeRef.value.peerOverrides.Typography }, {
+                                default: () => { var _a, _b; return (_b = (_a = selectedChatRef.value) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : ''; }
+                            }),
+                            h(UFlex, { align: "center", size: "small", class: `${mergedClsPrefixRef.value}-chat-main__header-actions` }, {
+                                default: () => resolveSlot(slots.headerActions, () => {
+                                    const shareButtonProps = Object.assign(Object.assign({}, headerButtonPropsRef.value), headerShareButtonPropsRef.value);
+                                    const profileButtonProps = Object.assign(Object.assign({}, headerButtonPropsRef.value), headerProfileButtonPropsRef.value);
+                                    const closeButtonProps = Object.assign(Object.assign({}, headerButtonPropsRef.value), headerCloseButtonPropsRef.value);
+                                    const shareIconProps = Object.assign(Object.assign({}, headerIconPropsRef.value), headerShareIconPropsRef.value);
+                                    const profileIconProps = Object.assign(Object.assign({}, headerIconPropsRef.value), headerProfileIconPropsRef.value);
+                                    const buttons = [];
                                     buttons.push(h(UTooltip, null, {
                                         trigger: () => (h(UButton, Object.assign({ secondary: true, circle: true, size: "large" }, shareButtonProps, { theme: mergedThemeRef.value.peers.Button, themeOverrides: mergedThemeRef.value.peerOverrides
                                                 .Button, onClick: () => { var _a; return (_a = onChatShare === null || onChatShare === void 0 ? void 0 : onChatShare.value) === null || _a === void 0 ? void 0 : _a.call(onChatShare); } }), {
@@ -179,8 +193,6 @@ export default defineComponent({
                                         })),
                                         default: () => shareButtonTooltipRef.value
                                     }));
-                                }
-                                if (profileButtonProps.disabled !== true) {
                                     buttons.push(h(UTooltip, null, {
                                         trigger: () => (h(UButton, Object.assign({ secondary: true, circle: true, size: "large" }, profileButtonProps, { theme: mergedThemeRef.value.peers.Button, themeOverrides: mergedThemeRef.value.peerOverrides
                                                 .Button, onClick: () => { var _a; return (_a = onUserProfile === null || onUserProfile === void 0 ? void 0 : onUserProfile.value) === null || _a === void 0 ? void 0 : _a.call(onUserProfile); } }), {
@@ -191,15 +203,13 @@ export default defineComponent({
                                         })),
                                         default: () => profileButtonTooltipRef.value
                                     }));
-                                }
-                                if (closeButtonProps.disabled !== true) {
                                     buttons.push(h(UButton, Object.assign({ type: "primary", size: "large", round: true }, closeButtonProps, { theme: mergedThemeRef.value.peers.Button, themeOverrides: mergedThemeRef.value.peerOverrides.Button, onClick: () => { var _a; return (_a = onChatClose === null || onChatClose === void 0 ? void 0 : onChatClose.value) === null || _a === void 0 ? void 0 : _a.call(onChatClose); } }), {
                                         default: () => closeButtonTextRef.value
                                     }));
-                                }
-                                return buttons;
-                            })
-                        })))
+                                    return buttons;
+                                })
+                            })));
+                    }
                 })));
         };
         const renderMessages = () => {

package/es/components.d.ts

@@ -57,6 +57,7 @@ export * from './menu';
 export * from './mention';
 export * from './message';
 export * from './modal';
+export * from './modal-fullscreen';
 export * from './notification';
 export * from './page-header';
 export * from './pagination';
@@ -96,3 +97,4 @@ export * from './discrete';
 export * from './equation';
 export * from './toggle-button';
 export * from './flex';
+export * from './crop';

package/es/components.js

@@ -57,6 +57,7 @@ export * from './menu';
 export * from './mention';
 export * from './message';
 export * from './modal';
+export * from './modal-fullscreen';
 export * from './notification';
 export * from './page-header';
 export * from './pagination';
@@ -96,3 +97,4 @@ export * from './discrete';
 export * from './equation';
 export * from './toggle-button';
 export * from './flex';
+export * from './crop';

package/es/config-provider/src/internal-interface.d.ts

@@ -102,6 +102,8 @@ import type { FlexTheme } from '../../flex/styles';
 import { CardListTheme } from '../../card-list/styles';
 import { ActionCardTheme } from '../../action-card';
 import { ChatTheme } from '../../chat/styles';
+import { ModalFullscreenTheme } from '../../modal-fullscreen/styles';
+import { CropTheme } from '../../crop/styles';
 export interface GlobalThemeWithoutCommon {
     Alert?: AlertTheme;
     Anchor?: AnchorTheme;
@@ -190,6 +192,8 @@ export interface GlobalThemeWithoutCommon {
     Flex?: FlexTheme;
     CardList?: CardListTheme;
     Chat?: ChatTheme;
+    ModalFullscreen?: ModalFullscreenTheme;
+    Crop?: CropTheme;
     InternalSelectMenu?: InternalSelectMenuTheme;
     InternalSelection?: InternalSelectionTheme;
     AccountOption?: AccountOptionTheme;

package/es/crop/index.d.ts

@@ -0,0 +1,3 @@
+export { default as UCrop, cropProps } from './src/Crop';
+export type { CropProps } from './src/Crop';
+export type { ViewMode } from './src/interface';

package/es/crop/index.js

@@ -0,0 +1 @@
+export { default as UCrop, cropProps } from './src/Crop';

package/es/crop/src/Crop.d.ts

@@ -0,0 +1,222 @@
+import { PropType } from 'vue';
+import { ExtractPublicPropTypes } from '../../_utils';
+import { ViewMode } from './interface';
+export declare const cropProps: {
+    src: StringConstructor;
+    wrapperWidth: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    wrapperHeight: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    viewMode: {
+        type: PropType<ViewMode>;
+        default: number;
+    };
+    dragMode: {
+        type: PropType<"crop" | "move" | "none">;
+        default: string;
+    };
+    aspectRatio: {
+        type: NumberConstructor;
+        default: number;
+    };
+    background: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    circleShape: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    zoomable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    cropperThemeColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    cancelButtonText: {
+        type: StringConstructor;
+        default: string;
+    };
+    confirmButtonText: {
+        type: StringConstructor;
+        default: string;
+    };
+    theme: PropType<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>;
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>>;
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>>;
+};
+export type CropProps = ExtractPublicPropTypes<typeof cropProps>;
+declare const _default: import("vue").DefineComponent<{
+    src: StringConstructor;
+    wrapperWidth: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    wrapperHeight: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    viewMode: {
+        type: PropType<ViewMode>;
+        default: number;
+    };
+    dragMode: {
+        type: PropType<"crop" | "move" | "none">;
+        default: string;
+    };
+    aspectRatio: {
+        type: NumberConstructor;
+        default: number;
+    };
+    background: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    circleShape: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    zoomable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    cropperThemeColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    cancelButtonText: {
+        type: StringConstructor;
+        default: string;
+    };
+    confirmButtonText: {
+        type: StringConstructor;
+        default: string;
+    };
+    theme: PropType<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>;
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>>;
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>>;
+}, {
+    cropWrapperRef: import("vue").Ref<HTMLDivElement | undefined>;
+    cropImageRef: import("vue").Ref<HTMLImageElement | undefined>;
+    mergedClsPrefix: import("vue").Ref<string>;
+    cssVars: import("vue").ComputedRef<{
+        '--u-wrapper-border-radius': string;
+        '--u-wrapper-bg-color': string;
+        '--u-wrapper-width': string;
+        '--u-wrapper-height': string;
+        '--u-cropper-theme-color': string;
+        '--u-wrapper-margin': string;
+    }>;
+    confirmCrop: () => void;
+    cancelCrop: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    cancel: () => true;
+    confirm: (dataUrl: string) => true;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    src: StringConstructor;
+    wrapperWidth: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    wrapperHeight: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    viewMode: {
+        type: PropType<ViewMode>;
+        default: number;
+    };
+    dragMode: {
+        type: PropType<"crop" | "move" | "none">;
+        default: string;
+    };
+    aspectRatio: {
+        type: NumberConstructor;
+        default: number;
+    };
+    background: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    circleShape: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    zoomable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    cropperThemeColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    cancelButtonText: {
+        type: StringConstructor;
+        default: string;
+    };
+    confirmButtonText: {
+        type: StringConstructor;
+        default: string;
+    };
+    theme: PropType<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>;
+    themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>>;
+    builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Crop", {
+        wrapperBg: string;
+        wrapperBorderRadius: string;
+        wrapperMargin: string;
+    }, {}>>>;
+}>> & {
+    onConfirm?: ((dataUrl: string) => any) | undefined;
+    onCancel?: (() => any) | undefined;
+}, {
+    aspectRatio: number;
+    background: boolean;
+    wrapperWidth: string | number;
+    wrapperHeight: string | number;
+    viewMode: ViewMode;
+    dragMode: "none" | "move" | "crop";
+    circleShape: boolean;
+    zoomable: boolean;
+    cropperThemeColor: string;
+    cancelButtonText: string;
+    confirmButtonText: string;
+}, {}>;
+export default _default;