@uzum-tech/ui 1.3.0 → 1.4.0

package/lib/layout/src/LayoutContent.d.ts

@@ -133,118 +133,7 @@ declare const _default: import("vue").DefineComponent<{
     } | null>;
     hasSiderStyle: import("vue").CSSProperties;
     mergedTheme: import("vue").ComputedRef<{
-        common: {
-            scrollbarColor: string;
-            scrollbarColorHover: string;
-            scrollbarWidth: string;
-            scrollbarHeight: string;
-            scrollbarBorderRadius: string;
-            opacityDisabled: string;
-            brandPrimary50: string;
-            brandPrimary100: string;
-            brandPrimary200: string;
-            brandPrimary300: string;
-            brandPrimary400: string;
-            brandPrimary500: string;
-            brandPrimary550: string;
-            brandPrimary600: string;
-            brandSecondary500: string;
-            brandSecondary300: string;
-            brandSecondary600: string;
-            brandTertiary500: string;
-            brandTertiary300: string;
-            brandTertiary600: string;
-            brandQuaternary500: string;
-            brandQuaternary300: string;
-            brandQuaternary600: string;
-            brandQuinary500: string;
-            brandQuinary300: string;
-            brandQuinary600: string;
-            brandQuinary100: string;
-            surfacePrimary: string;
-            surfaceSecondary: string;
-            containerPrimary: string;
-            containerSecondary: string;
-            textPrimary: string;
-            textSecondary: string;
-            textTertiary: string;
-            textQuaternary: string;
-            textBrand: string;
-            elementsPrimary: string;
-            elementsSecondary: string;
-            elementsTertiary: string;
-            elementsQuaternary: string;
-            elementsQuinary: string;
-            elementsDarkQuinary: string;
-            elementsSenary: string;
-            elementsOnContainer: string;
-            transparencyPrimary: string;
-            transparencySecondary: string;
-            transparencyTertiary: string;
-            transparencyQuinary: string;
-            transparencyModal: string;
-            staticBlack: string;
-            staticDarkGrey: string;
-            staticWhite: string;
-            staticRed: string;
-            staticOrange: string;
-            staticGreen: string;
-            staticDeepBlue: string;
-            staticErrorAccent: string;
-            shadowDepth2: string;
-            shadowDepth: string;
-            fontFamily: string;
-            fontFamilyMono: string;
-            cubicBezierEaseInOut: string;
-            cubicBezierEaseOut: string;
-            cubicBezierEaseIn: string;
-            borderRadiusLarge: string;
-            borderRadius: string;
-            borderRadiusMedium: string;
-            borderRadiusSmall: string;
-            borderRadiusTiny: string;
-            heightMini: string;
-            heightTiny: string;
-            heightSmall: string;
-            heightMedium: string;
-            heightLarge: string;
-            heightHuge: string;
-            fontDisplayLarge: string;
-            fontDisplaySmall: string;
-            fontHeadingLarge: string;
-            fontHeadingMedium: string;
-            fontHeadingSmall: string;
-            fontTitleLarge: string;
-            fontTitleMedium: string;
-            fontTitleSmall: string;
-            fontBodyLarge: string;
-            fontBodyMedium: string;
-            fontBodySmall: string;
-            lineHeightDisplayLarge: string;
-            lineHeightDisplaySmall: string;
-            lineHeightHeadingLarge: string;
-            lineHeightHeadingMedium: string;
-            lineHeightHeadingSmall: string;
-            lineHeightTitleLarge: string;
-            lineHeightTitleMedium: string;
-            lineHeightTitleSmall: string;
-            lineHeightBodyLarge: string;
-            lineHeightBodyMedium: string;
-            lineHeightBodySmall: string;
-            fontWeight: string;
-            fontWeightStrong: string;
-            fontWeightBold: string;
-            iconSmall: string;
-            iconMedium: string;
-            iconLarge: string;
-            iconHuge: string;
-            closeSmall: string;
-            closeMedium: string;
-            closeLarge: string;
-            closeHuge: string;
-            closeBorderRadius: string;
-            name: "common";
-        };
+        common: import("../..").ThemeCommonVars;
         self: {
             textColor: string;
             textColorInverted: string;
@@ -412,7 +301,7 @@ declare const _default: import("vue").DefineComponent<{
         }, any>;
     }>>>;
 }>>, {
-    position: "static" | "absolute";
+    position: "absolute" | "static";
     contentStyle: string | import("vue").CSSProperties;
     embedded: boolean;
     nativeScrollbar: boolean;

package/lib/layout/src/LayoutFooter.d.ts

@@ -316,8 +316,8 @@ declare const _default: import("vue").DefineComponent<{
         }, any>;
     }>>>;
 }>>, {
-    position: "static" | "absolute";
     bordered: boolean;
+    position: "absolute" | "static";
     inverted: boolean;
 }, {}>;
 export default _default;

package/lib/layout/src/LayoutHeader.d.ts

@@ -1,4 +1,4 @@
-import type { ExtractPublicPropTypes } from '../../_utils';
+import { type ExtractPublicPropTypes } from '../../_utils';
 export declare const headerProps: {
     readonly position: {
         readonly type: import("vue").PropType<"static" | "absolute">;
@@ -229,8 +229,8 @@ declare const _default: import("vue").DefineComponent<{
         }, any>;
     }>>>;
 }>>, {
-    position: "static" | "absolute";
     bordered: boolean;
+    position: "absolute" | "static";
     inverted: boolean;
 }, {}>;
 export default _default;

package/lib/layout/src/LayoutHeader.js

@@ -9,6 +9,7 @@ const _mixins_1 = require("../../_mixins");
 const styles_1 = require("../styles");
 const interface_1 = require("./interface");
 const layout_header_cssr_1 = __importDefault(require("./styles/layout-header.cssr"));
+const _utils_1 = require("../../_utils");
 exports.headerProps = {
     position: interface_1.positionProp,
     inverted: Boolean,
@@ -53,6 +54,7 @@ exports.default = (0, vue_1.defineComponent)({
     render() {
         var _a;
         const { mergedClsPrefix } = this;
+        const $slots = this.$slots;
         (_a = this.onRender) === null || _a === void 0 ? void 0 : _a.call(this);
         return ((0, vue_1.h)("div", { class: [
                 `${mergedClsPrefix}-layout-header`,
@@ -60,6 +62,8 @@ exports.default = (0, vue_1.defineComponent)({
                 this.position &&
                     `${mergedClsPrefix}-layout-header--${this.position}-positioned`,
                 this.bordered && `${mergedClsPrefix}-layout-header--bordered`
-            ], style: this.cssVars }, this.$slots));
+            ], style: this.cssVars }, !$slots.default ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-layout-header__wrapper` },
+            (0, _utils_1.resolveWrappedSlot)($slots.left, (children) => children && ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-layout-header-left` }, children))),
+            (0, _utils_1.resolveWrappedSlot)($slots.right, (children) => children && ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-layout-header-right` }, children))))) : ((0, _utils_1.resolveWrappedSlot)($slots.default, (children) => children))));
     }
 });

package/lib/layout/src/LayoutSider.d.ts

@@ -20,7 +20,7 @@ export declare const layoutSiderProps: {
         readonly default: "";
     };
     readonly collapseMode: {
-        readonly type: PropType<"transform" | "width">;
+        readonly type: PropType<"width" | "transform">;
         readonly default: "transform";
     };
     readonly collapsed: {
@@ -33,7 +33,7 @@ export declare const layoutSiderProps: {
         readonly default: true;
     };
     readonly showTrigger: {
-        readonly type: PropType<boolean | "bar" | "arrow-circle">;
+        readonly type: PropType<boolean | "arrow-circle" | "bar" | "sidebar">;
         readonly default: false;
     };
     readonly nativeScrollbar: {
@@ -74,7 +74,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "";
     };
     collapseMode: {
-        readonly type: PropType<"transform" | "width">;
+        readonly type: PropType<"width" | "transform">;
         readonly default: "transform";
     };
     collapsed: {
@@ -87,7 +87,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: true;
     };
     showTrigger: {
-        readonly type: PropType<boolean | "bar" | "arrow-circle">;
+        readonly type: PropType<boolean | "arrow-circle" | "bar" | "sidebar">;
         readonly default: false;
     };
     nativeScrollbar: {
@@ -220,118 +220,7 @@ declare const _default: import("vue").DefineComponent<{
     } | null>;
     mergedClsPrefix: import("vue").Ref<string>;
     mergedTheme: import("vue").ComputedRef<{
-        common: {
-            scrollbarColor: string;
-            scrollbarColorHover: string;
-            scrollbarWidth: string;
-            scrollbarHeight: string;
-            scrollbarBorderRadius: string;
-            opacityDisabled: string;
-            brandPrimary50: string;
-            brandPrimary100: string;
-            brandPrimary200: string;
-            brandPrimary300: string;
-            brandPrimary400: string;
-            brandPrimary500: string;
-            brandPrimary550: string;
-            brandPrimary600: string;
-            brandSecondary500: string;
-            brandSecondary300: string;
-            brandSecondary600: string;
-            brandTertiary500: string;
-            brandTertiary300: string;
-            brandTertiary600: string;
-            brandQuaternary500: string;
-            brandQuaternary300: string;
-            brandQuaternary600: string;
-            brandQuinary500: string;
-            brandQuinary300: string;
-            brandQuinary600: string;
-            brandQuinary100: string;
-            surfacePrimary: string;
-            surfaceSecondary: string;
-            containerPrimary: string;
-            containerSecondary: string;
-            textPrimary: string;
-            textSecondary: string;
-            textTertiary: string;
-            textQuaternary: string;
-            textBrand: string;
-            elementsPrimary: string;
-            elementsSecondary: string;
-            elementsTertiary: string;
-            elementsQuaternary: string;
-            elementsQuinary: string;
-            elementsDarkQuinary: string;
-            elementsSenary: string;
-            elementsOnContainer: string;
-            transparencyPrimary: string;
-            transparencySecondary: string;
-            transparencyTertiary: string;
-            transparencyQuinary: string;
-            transparencyModal: string;
-            staticBlack: string;
-            staticDarkGrey: string;
-            staticWhite: string;
-            staticRed: string;
-            staticOrange: string;
-            staticGreen: string;
-            staticDeepBlue: string;
-            staticErrorAccent: string;
-            shadowDepth2: string;
-            shadowDepth: string;
-            fontFamily: string;
-            fontFamilyMono: string;
-            cubicBezierEaseInOut: string;
-            cubicBezierEaseOut: string;
-            cubicBezierEaseIn: string;
-            borderRadiusLarge: string;
-            borderRadius: string;
-            borderRadiusMedium: string;
-            borderRadiusSmall: string;
-            borderRadiusTiny: string;
-            heightMini: string;
-            heightTiny: string;
-            heightSmall: string;
-            heightMedium: string;
-            heightLarge: string;
-            heightHuge: string;
-            fontDisplayLarge: string;
-            fontDisplaySmall: string;
-            fontHeadingLarge: string;
-            fontHeadingMedium: string;
-            fontHeadingSmall: string;
-            fontTitleLarge: string;
-            fontTitleMedium: string;
-            fontTitleSmall: string;
-            fontBodyLarge: string;
-            fontBodyMedium: string;
-            fontBodySmall: string;
-            lineHeightDisplayLarge: string;
-            lineHeightDisplaySmall: string;
-            lineHeightHeadingLarge: string;
-            lineHeightHeadingMedium: string;
-            lineHeightHeadingSmall: string;
-            lineHeightTitleLarge: string;
-            lineHeightTitleMedium: string;
-            lineHeightTitleSmall: string;
-            lineHeightBodyLarge: string;
-            lineHeightBodyMedium: string;
-            lineHeightBodySmall: string;
-            fontWeight: string;
-            fontWeightStrong: string;
-            fontWeightBold: string;
-            iconSmall: string;
-            iconMedium: string;
-            iconLarge: string;
-            iconHuge: string;
-            closeSmall: string;
-            closeMedium: string;
-            closeLarge: string;
-            closeHuge: string;
-            closeBorderRadius: string;
-            name: "common";
-        };
+        common: import("../..").ThemeCommonVars;
         self: {
             textColor: string;
             textColorInverted: string;
@@ -403,7 +292,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "";
     };
     collapseMode: {
-        readonly type: PropType<"transform" | "width">;
+        readonly type: PropType<"width" | "transform">;
         readonly default: "transform";
     };
     collapsed: {
@@ -416,7 +305,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: true;
     };
     showTrigger: {
-        readonly type: PropType<boolean | "bar" | "arrow-circle">;
+        readonly type: PropType<boolean | "arrow-circle" | "bar" | "sidebar">;
         readonly default: false;
     };
     nativeScrollbar: {
@@ -533,17 +422,17 @@ declare const _default: import("vue").DefineComponent<{
         }, any>;
     }>>>;
 }>>, {
-    position: "static" | "absolute";
     width: string | number;
     bordered: boolean;
+    position: "absolute" | "static";
     contentStyle: string | CSSProperties;
     inverted: boolean;
     collapsed: boolean | undefined;
     nativeScrollbar: boolean;
     collapsedWidth: number;
-    collapseMode: "transform" | "width";
+    collapseMode: "width" | "transform";
     defaultCollapsed: boolean;
     showCollapsedContent: boolean;
-    showTrigger: boolean | "bar" | "arrow-circle";
+    showTrigger: boolean | "bar" | "arrow-circle" | "sidebar";
 }, {}>;
 export default _default;

package/lib/layout/src/LayoutSider.js

@@ -11,10 +11,9 @@ const _utils_1 = require("../../_utils");
 const _internal_1 = require("../../_internal");
 const styles_1 = require("../styles");
 const layout_sider_cssr_1 = __importDefault(require("./styles/layout-sider.cssr"));
-const ToggleButton_1 = __importDefault(require("./ToggleButton"));
-const ToggleBar_1 = __importDefault(require("./ToggleBar"));
 const interface_1 = require("./interface");
 const Layout_1 = require("./Layout");
+const resolveTriggerComponent_1 = require("./utils/resolveTriggerComponent");
 exports.layoutSiderProps = {
     position: interface_1.positionProp,
     bordered: Boolean,
@@ -214,6 +213,7 @@ exports.default = (0, vue_1.defineComponent)({
     render() {
         var _a;
         const { mergedClsPrefix, mergedCollapsed, showTrigger } = this;
+        const TriggerComponent = (0, resolveTriggerComponent_1.resolveTriggerComponent)(showTrigger);
         (_a = this.onRender) === null || _a === void 0 ? void 0 : _a.call(this);
         return ((0, vue_1.h)("aside", { class: [
                 `${mergedClsPrefix}-layout-sider`,
@@ -246,7 +246,7 @@ exports.default = (0, vue_1.defineComponent)({
                     },
                     this.contentStyle
                 ], ref: "scrollableElRef" }, this.$slots)),
-            showTrigger ? (showTrigger === 'bar' ? ((0, vue_1.h)(ToggleBar_1.default, { clsPrefix: mergedClsPrefix, style: mergedCollapsed ? this.collapsedTriggerStyle : this.triggerStyle, onClick: this.handleTriggerClick })) : ((0, vue_1.h)(ToggleButton_1.default, { clsPrefix: mergedClsPrefix, style: mergedCollapsed ? this.collapsedTriggerStyle : this.triggerStyle, onClick: this.handleTriggerClick }))) : null,
+            showTrigger ? ((0, vue_1.h)(TriggerComponent, { clsPrefix: mergedClsPrefix, style: mergedCollapsed ? this.collapsedTriggerStyle : this.triggerStyle, onClick: this.handleTriggerClick })) : null,
             this.bordered ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-layout-sider__border` })) : null));
     }
 });

package/lib/layout/src/ToggleSidebarButton.d.ts

@@ -0,0 +1,15 @@
+import { type PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<{
+    clsPrefix: {
+        type: PropType<string>;
+        required: true;
+    };
+    onClick: PropType<(e: MouseEvent) => void>;
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    clsPrefix: {
+        type: PropType<string>;
+        required: true;
+    };
+    onClick: PropType<(e: MouseEvent) => void>;
+}>>, {}, {}>;
+export default _default;

package/lib/layout/src/ToggleSidebarButton.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const vue_1 = require("vue");
+const _internal_1 = require("../../_internal");
+const icons_1 = require("../../_internal/icons");
+exports.default = (0, vue_1.defineComponent)({
+    name: 'LayoutToggleSidebarButton',
+    props: {
+        clsPrefix: {
+            type: String,
+            required: true
+        },
+        onClick: Function
+    },
+    render() {
+        const { clsPrefix } = this;
+        return ((0, vue_1.h)("div", { class: `${clsPrefix}-layout-toggle-sidebar-button`, onClick: this.onClick },
+            (0, vue_1.h)(_internal_1.UBaseIcon, { clsPrefix: `${clsPrefix}-union` }, {
+                default: () => (0, vue_1.h)(icons_1.SiderUnionBorder, null)
+            }),
+            (0, vue_1.h)(_internal_1.UBaseIcon, { clsPrefix: clsPrefix }, {
+                default: () => (0, vue_1.h)(icons_1.ChevronRightIcon, null)
+            })));
+    }
+});

package/lib/layout/src/interface.d.ts

@@ -1,7 +1,7 @@
 import type { PropType, Ref } from 'vue';
 export declare const layoutSiderInjectionKey: import("vue").InjectionKey<{
     collapsedRef: Ref<boolean>;
-    collapseModeRef: Ref<'transform' | 'width'>;
+    collapseModeRef: Ref<"transform" | "width">;
 }>;
 export declare const positionProp: {
     readonly type: PropType<"static" | "absolute">;

package/lib/layout/src/styles/layout-header.cssr.js

@@ -26,4 +26,7 @@ exports.default = (0, cssr_1.cB)('layout-header', `
  top: 0;
  `), (0, cssr_1.cM)('bordered', `
  border-bottom: solid 1px var(--u-border-color);
+ `), (0, cssr_1.cE)('wrapper', `
+ display: flex;
+ justify-content: space-between;
  `)]);

package/lib/layout/src/styles/layout-sider.cssr.js

@@ -42,13 +42,22 @@ exports.default = (0, cssr_1.cB)('layout-sider', `
  justify-content: flex-start;
  `, [(0, cssr_1.cM)('bordered', [(0, cssr_1.cE)('border', `
  left: 0;
- `)]), (0, cssr_1.cM)('collapsed', [(0, cssr_1.cB)('layout-toggle-button', [(0, cssr_1.cB)('base-icon', `
- transform: rotate(180deg);
+ `)]), (0, cssr_1.cM)('collapsed', [(0, cssr_1.cB)('layout-toggle-sidebar-button', [(0, cssr_1.cB)('base-icon', `
+ transform: scaleX(-1);
+ `)]), (0, cssr_1.cB)('layout-toggle-button', [(0, cssr_1.cB)('base-icon', `
+ transform: scaleX(-1);
  `)]), (0, cssr_1.cB)('layout-toggle-bar', [(0, cssr_1.c)('&:hover', [(0, cssr_1.cE)('top', {
   transform: 'rotate(-12deg) scale(1.15) translateY(-2px)'
 }), (0, cssr_1.cE)('bottom', {
   transform: 'rotate(12deg) scale(1.15) translateY(2px)'
-})])])]), (0, cssr_1.cB)('layout-toggle-button', `
+})])])]), (0, cssr_1.cB)('layout-toggle-sidebar-button', `
+ left: -4px;
+ transform: translateX(-50%);
+ `, [(0, cssr_1.cB)('base-icon', `
+ transform: rotate(0);
+ `), (0, cssr_1.cB)('union-base-icon', `
+ transform: rotate(180deg);
+ `)]), (0, cssr_1.cB)('layout-toggle-button', `
  left: 0;
  transform: translateX(-50%) translateY(-50%);
  `, [(0, cssr_1.cB)('base-icon', `
@@ -65,8 +74,57 @@ exports.default = (0, cssr_1.cB)('layout-sider', `
 }), (0, cssr_1.cE)('bottom', {
   transform: 'rotate(12deg) scale(1.15) translateY(2px)'
 })])]), (0, cssr_1.cB)('layout-toggle-button', [(0, cssr_1.cB)('base-icon', `
- transform: rotate(0);
- `)])]), (0, cssr_1.cB)('layout-toggle-button', `
+ transform: scaleX(1);
+ `)]), (0, cssr_1.cB)('layout-toggle-sidebar-button', [(0, cssr_1.cB)('base-icon', `
+ transform: scaleX(1);
+ `)])]), (0, cssr_1.cM)('bordered', [(0, cssr_1.cB)('union-base-icon', `
+ stroke: var(--u-border-color);
+ `), (0, cssr_1.cB)('union-base-icon::before', `
+ content: '';
+ width: 15px;
+ height: 100%;
+ background-color: var(--u-toggle-button-color);
+ position: absolute;
+ left: -1px;
+ top: 0;
+ transition:
+ background-color .3s var(--u-bezier);
+ `)]), (0, cssr_1.cB)('layout-toggle-sidebar-button', `
+ transition:
+ color .3s var(--u-bezier),
+ right .3s var(--u-bezier),
+ left .3s var(--u-bezier),
+ border-color .3s var(--u-bezier),
+ background-color .3s var(--u-bezier);
+ cursor: pointer;
+ width: 35px;
+ height: 82px;
+ position: absolute;
+ top: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: var(--u-toggle-button-icon-color);
+ background-color: var(--u-toggle-button-color);
+ transform: translateX(50%);
+ z-index: 1;
+ `, [(0, cssr_1.cB)('base-icon', `
+ transition: transform .3s var(--u-bezier);
+ transform: scaleX(-1);
+ `), (0, cssr_1.cB)('union-base-icon', `
+ transition:
+ color .3s var(--u-bezier),
+ right .3s var(--u-bezier),
+ left .3s var(--u-bezier),
+ border-color .3s var(--u-bezier),
+ stroke .3s var(--u-bezier),
+ background-color .3s var(--u-bezier);
+ color: var(--u-toggle-button-color);
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ left: 2px;
+ `)]), (0, cssr_1.cB)('layout-toggle-button', `
  transition:
  color .3s var(--u-bezier),
  right .3s var(--u-bezier),
@@ -92,7 +150,7 @@ exports.default = (0, cssr_1.cB)('layout-sider', `
  z-index: 1;
  `, [(0, cssr_1.cB)('base-icon', `
  transition: transform .3s var(--u-bezier);
- transform: rotate(180deg);
+ transform: scaleX(-1);
  `)]), (0, cssr_1.cB)('layout-toggle-bar', `
  cursor: pointer;
  height: 72px;

package/lib/layout/src/utils/resolveTriggerComponent.d.ts

@@ -0,0 +1,51 @@
+import type { DefineComponent } from 'vue';
+declare const TriggerComponentMap: {
+    readonly bar: DefineComponent<{
+        clsPrefix: {
+            type: StringConstructor;
+            required: true;
+        };
+        onClick: import("vue").PropType<(e: MouseEvent) => void>;
+    }, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        clsPrefix: {
+            type: StringConstructor;
+            required: true;
+        };
+        onClick: import("vue").PropType<(e: MouseEvent) => void>;
+    }>>, {}, {}>;
+    readonly 'arrow-circle': DefineComponent<{
+        clsPrefix: {
+            type: import("vue").PropType<string>;
+            required: true;
+        };
+        onClick: import("vue").PropType<(e: MouseEvent) => void>;
+    }, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        clsPrefix: {
+            type: import("vue").PropType<string>;
+            required: true;
+        };
+        onClick: import("vue").PropType<(e: MouseEvent) => void>;
+    }>>, {}, {}>;
+    readonly sidebar: DefineComponent<{
+        clsPrefix: {
+            type: import("vue").PropType<string>;
+            required: true;
+        };
+        onClick: import("vue").PropType<(e: MouseEvent) => void>;
+    }, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        clsPrefix: {
+            type: import("vue").PropType<string>;
+            required: true;
+        };
+        onClick: import("vue").PropType<(e: MouseEvent) => void>;
+    }>>, {}, {}>;
+};
+export type TriggerType = keyof typeof TriggerComponentMap;
+interface TriggerComponentProps {
+    clsPrefix: string;
+    onClick?: (e: MouseEvent) => void;
+    style?: any;
+}
+type TriggerComponentType = DefineComponent<TriggerComponentProps, any, any>;
+export declare function resolveTriggerComponent(trigger?: boolean | TriggerType): TriggerComponentType;
+export {};

package/lib/layout/src/utils/resolveTriggerComponent.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resolveTriggerComponent = resolveTriggerComponent;
+const ToggleBar_1 = __importDefault(require("../ToggleBar"));
+const ToggleButton_1 = __importDefault(require("../ToggleButton"));
+const ToggleSidebarButton_1 = __importDefault(require("../ToggleSidebarButton"));
+const TriggerComponentMap = {
+    bar: ToggleBar_1.default,
+    'arrow-circle': ToggleButton_1.default,
+    sidebar: ToggleSidebarButton_1.default
+};
+function resolveTriggerComponent(trigger) {
+    return typeof trigger === 'string'
+        ? TriggerComponentMap[trigger]
+        : ToggleButton_1.default;
+}