@opendesign-plus/components 0.0.1-rc.100 → 0.0.1-rc.102

package/dist/treeshaking/components/doc-layout/ODocLayout.vue_vue_type_script_setup_true_lang.mjs

@@ -1,6 +1,6 @@
 import icon_menu_fold_default from "../../_virtual/~icons/components/icon-menu-fold.mjs";
 import icon_menu_unfold_default from "../../_virtual/~icons/components/icon-menu-unfold.mjs";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, onMounted, onUnmounted, openBlock, ref, renderSlot, unref, withCtx } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, onMounted, onUnmounted, openBlock, ref, renderSlot, unref, withCtx } from "vue";
 import { OIcon, OScroller } from "@opensig/opendesign";
 import { useScreen } from "@opendesign-plus/composables";
 // src/components/doc-layout/ODocLayout.vue?vue&type=script&setup=true&lang.ts
@@ -10,14 +10,17 @@ var _hoisted_1 = {
 };
 var _hoisted_2 = { class: "o-doc-layout-header-title" };
 var _hoisted_3 = { class: "o-doc-layout-header-right" };
-var _hoisted_4 = { class: "o-doc-layout-left" };
+var _hoisted_4 = {
+	key: 1,
+	class: "o-doc-layout-sider"
+};
 var _hoisted_5 = { class: "o-doc-layout-content" };
 var _hoisted_6 = {
-	key: 1,
-	class: "o-doc-layout-right"
+	key: 2,
+	class: "o-doc-layout-anchor"
 };
 var _hoisted_7 = {
-	key: 2,
+	key: 3,
 	class: "o-doc-layout-float"
 };
 var DRAG_THRESHOLD = 4;
@@ -25,7 +28,11 @@ var ODocLayout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 	__name: "ODocLayout",
 	props: {
 		collapsed: { type: Boolean },
-		hasRight: {
+		hasSider: {
+			type: Boolean,
+			default: true
+		},
+		hasAnchor: {
 			type: Boolean,
 			default: true
 		},
@@ -44,6 +51,8 @@ var ODocLayout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 			set: (value) => emit("update:collapsed", value)
 		});
 		const containerRef = ref();
+		const scrollerRef = ref();
+		const scrollerEl = ref();
 		const isResizing = ref(false);
 		let resizeTimer;
 		const getRoot = () => containerRef.value?.closest(".o-doc-layout");
@@ -55,6 +64,7 @@ var ODocLayout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 			resizeTimer = window.setTimeout(() => root.classList.remove("is-resizing"), 300);
 		};
 		onMounted(() => {
+			scrollerEl.value = scrollerRef.value?.getContainerEl() || void 0;
 			window.addEventListener("resize", onWindowResize);
 		});
 		onUnmounted(() => {
@@ -64,13 +74,13 @@ var ODocLayout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 		const onResizePointerDown = (event) => {
 			if (event.button !== 0) return;
 			const root = event.currentTarget.closest(".o-doc-layout");
-			const left = root?.querySelector(".o-doc-layout-left");
-			if (!root || !left) return;
+			const sider = root?.querySelector(".o-doc-layout-sider");
+			if (!root || !sider) return;
 			const style = getComputedStyle(root);
 			const paddingRight = Number.parseFloat(style.getPropertyValue("--o-doc-layout-sider-padding-right")) || 0;
 			const initContent = Number.parseFloat(style.getPropertyValue("--o-doc-layout-sider-content-width")) || 0;
 			const defaultContent = Number.parseFloat(style.getPropertyValue("--o-doc-layout-sider-content-width-default")) || initContent;
-			const padding = left.getBoundingClientRect().width - initContent - paddingRight;
+			const padding = sider.getBoundingClientRect().width - initContent - paddingRight;
 			const startX = event.clientX;
 			const minContent = Math.min(defaultContent, initContent);
 			const maxContent = Math.max(initContent, window.innerWidth * .5 - padding - paddingRight);
@@ -98,44 +108,52 @@ var ODocLayout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 			window.addEventListener("pointerup", onUp);
 		};
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(OScroller), { class: normalizeClass(["o-doc-layout", {
-				"is-collapsed": collapsed.value,
-				"is-resizing": isResizing.value,
-				"has-right": __props.hasRight
-			}]) }, {
+			return openBlock(), createBlock(unref(OScroller), {
+				ref_key: "scrollerRef",
+				ref: scrollerRef,
+				class: normalizeClass(["o-doc-layout", {
+					"is-collapsed": collapsed.value,
+					"is-resizing": isResizing.value,
+					"has-sider": __props.hasSider,
+					"has-anchor": __props.hasAnchor
+				}])
+			}, {
 				default: withCtx(() => [createElementVNode("div", {
 					ref_key: "containerRef",
 					ref: containerRef,
 					class: "o-doc-layout-container"
 				}, [
 					unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_1, [
-						createVNode(unref(OIcon), {
+						__props.hasSider ? (openBlock(), createBlock(unref(OIcon), {
+							key: 0,
 							class: "o-doc-layout-header-toggle",
 							onClick: _cache[0] || (_cache[0] = ($event) => collapsed.value = !collapsed.value)
 						}, {
-							default: withCtx(() => [collapsed.value ? (openBlock(), createBlock(unref(icon_menu_unfold_default), { key: 0 })) : (openBlock(), createBlock(unref(icon_menu_fold_default), { key: 1 }))]),
+							default: withCtx(() => [collapsed.value ? (openBlock(), createBlock(unref(icon_menu_fold_default), { key: 0 })) : (openBlock(), createBlock(unref(icon_menu_unfold_default), { key: 1 }))]),
 							_: 1
-						}),
+						})) : createCommentVNode("", true),
 						createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "header-title", {}, void 0, true)]),
 						createElementVNode("div", _hoisted_3, [renderSlot(_ctx.$slots, "header-right", {}, void 0, true)])
 					])) : createCommentVNode("", true),
-					createElementVNode("div", _hoisted_4, [renderSlot(_ctx.$slots, "left", {}, void 0, true)]),
-					createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "content", {}, void 0, true)]),
-					__props.hasRight ? (openBlock(), createElementBlock("div", _hoisted_6, [renderSlot(_ctx.$slots, "right", {}, void 0, true)])) : createCommentVNode("", true),
-					__props.hasFloat ? (openBlock(), createElementBlock("div", _hoisted_7, [renderSlot(_ctx.$slots, "float", {}, void 0, true)])) : createCommentVNode("", true),
-					unref(lePad) ? (openBlock(), createElementBlock("div", {
-						key: 3,
+					__props.hasSider ? (openBlock(), createElementBlock("div", _hoisted_4, [renderSlot(_ctx.$slots, "sider", { scroller: scrollerEl.value }, void 0, true)])) : createCommentVNode("", true),
+					createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "content", { scroller: scrollerEl.value }, void 0, true)]),
+					__props.hasAnchor ? (openBlock(), createElementBlock("div", _hoisted_6, [renderSlot(_ctx.$slots, "anchor", { scroller: scrollerEl.value }, void 0, true)])) : createCommentVNode("", true),
+					__props.hasFloat ? (openBlock(), createElementBlock("div", _hoisted_7, [renderSlot(_ctx.$slots, "float", { scroller: scrollerEl.value }, void 0, true)])) : createCommentVNode("", true),
+					__props.hasSider && unref(lePad) ? (openBlock(), createElementBlock("div", {
+						key: 4,
 						class: "o-doc-layout-mask",
 						onClick: _cache[1] || (_cache[1] = ($event) => collapsed.value = true)
 					})) : createCommentVNode("", true),
-					createElementVNode("div", {
+					__props.hasSider ? (openBlock(), createElementBlock("div", {
+						key: 5,
 						class: "o-doc-layout-opener",
 						onClick: _cache[2] || (_cache[2] = ($event) => collapsed.value = !collapsed.value)
-					}, [..._cache[3] || (_cache[3] = [createElementVNode("div", { class: "o-doc-layout-opener-thumb" }, null, -1)])]),
-					createElementVNode("div", {
+					}, [..._cache[3] || (_cache[3] = [createElementVNode("div", { class: "o-doc-layout-opener-thumb" }, null, -1)])])) : createCommentVNode("", true),
+					__props.hasSider ? (openBlock(), createElementBlock("div", {
+						key: 6,
 						class: "o-doc-layout-resizer",
 						onPointerdown: onResizePointerDown
-					}, null, 32)
+					}, null, 32)) : createCommentVNode("", true)
 				], 512)]),
 				_: 3
 			}, 8, ["class"]);

package/dist/treeshaking/components/doc-layout/{ODocLayout.vue_vue_type_style_index_0_scoped_6510bed3_lang.css → ODocLayout.vue_vue_type_style_index_0_scoped_966cd0b4_lang.css}

@@ -1,12 +1,12 @@
-.hover-icon-rotate .o-icon[data-v-6510bed3] {
+.hover-icon-rotate .o-icon[data-v-966cd0b4] {
   transition: all var(--o-duration-m1) var(--o-easing-standard-in);
 }
 @media (hover: hover) {
-.hover-icon-rotate:hover .o-icon[data-v-6510bed3] {
+.hover-icon-rotate:hover .o-icon[data-v-966cd0b4] {
     transform: rotate(-180deg);
 }
 }
-.o-doc-layout[data-v-6510bed3] {
+.o-doc-layout[data-v-966cd0b4] {
   --o-doc-layout-screen-width: 100vw;
   --o-doc-layout-page-header-height: var(--layout-header-height);
   --o-doc-layout-height: calc(100vh - var(--o-doc-layout-page-header-height));
@@ -27,7 +27,7 @@
   --o-doc-layout-anchor-top: calc(var(--o-doc-layout-page-header-height) + var(--o-doc-layout-anchor-padding-top));
   --o-doc-layout-anchor-right: var(--o-doc-layout-padding);
   --o-doc-layout-float-z-index: 36;
-  --o-doc-layout-float-bottom: 220px;
+  --o-doc-layout-float-bottom: 40px;
   --o-doc-layout-float-content-width: 48px;
   --o-doc-layout-float-right: calc(
     var(--o-doc-layout-padding) +
@@ -44,17 +44,18 @@
   --o-doc-layout-opener-left: var(--o-doc-layout-sider-width);
 }
 @media (max-width: 1680px) {
-.o-doc-layout[data-v-6510bed3] {
+.o-doc-layout[data-v-966cd0b4] {
     --o-doc-layout-min-padding: 40px;
     --o-doc-layout-gap: 24px;
     --o-doc-layout-sider-content-width-default: 196px;
     --o-doc-layout-sider-padding-right: 12px;
     --o-doc-layout-anchor-content-width: 208px;
     --o-doc-layout-anchor-padding-top: 48px;
+    --o-doc-layout-float-bottom: 32px;
 }
 }
 @media (max-width: 1200px) {
-.o-doc-layout[data-v-6510bed3] {
+.o-doc-layout[data-v-966cd0b4] {
     --o-doc-layout-min-padding: 32px;
     --o-doc-layout-gap: 16px;
     --o-doc-layout-sider-content-width-default: 222px;
@@ -65,7 +66,7 @@
 }
 }
 @media (max-width: 840px) {
-.o-doc-layout[data-v-6510bed3] {
+.o-doc-layout[data-v-966cd0b4] {
     --o-doc-layout-gap: 16px;
     --o-doc-layout-header-height: 48px;
     --o-doc-layout-sider-content-width-default: 222px;
@@ -74,20 +75,23 @@
 }
 }
 @media (max-width: 600px) {
-.o-doc-layout[data-v-6510bed3] {
+.o-doc-layout[data-v-966cd0b4] {
     --o-doc-layout-min-padding: 24px;
     --o-doc-layout-sider-padding-top: 12px;
     --o-doc-layout-sider-padding-right: 8px;
     --o-doc-layout-float-right: 24px;
 }
 }
-.o-doc-layout[data-v-6510bed3]:not(.has-right) {
+.o-doc-layout[data-v-966cd0b4]:not(.has-anchor) {
   --o-doc-layout-anchor-content-width: 0px;
 }
-.o-doc-layout .o-doc-layout-container[data-v-6510bed3] {
+.o-doc-layout[data-v-966cd0b4]:not(.has-sider) {
+  --o-doc-layout-content-padding-left: var(--o-doc-layout-padding);
+}
+.o-doc-layout .o-doc-layout-container[data-v-966cd0b4] {
   height: var(--o-doc-layout-height);
 }
-.o-doc-layout .o-doc-layout-header[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-header[data-v-966cd0b4] {
   position: fixed;
   top: var(--o-doc-layout-header-top);
   left: 0;
@@ -101,7 +105,8 @@
   background-color: var(--o-color-fill2);
   box-shadow: var(--o-shadow-1);
 }
-.o-doc-layout .o-doc-layout-header-toggle[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-header-toggle[data-v-966cd0b4] {
+  flex-shrink: 0;
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -113,17 +118,26 @@
   color: var(--o-color-info1);
   cursor: pointer;
 }
-.o-doc-layout .o-doc-layout-header-toggle svg[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-header-toggle svg[data-v-966cd0b4] {
   width: 24px;
   height: 24px;
 }
-.o-doc-layout .o-doc-layout-content[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-header-title[data-v-966cd0b4] {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.o-doc-layout .o-doc-layout-header-right[data-v-966cd0b4] {
+  flex-shrink: 0;
+}
+.o-doc-layout .o-doc-layout-content[data-v-966cd0b4] {
   padding-top: var(--o-doc-layout-content-padding-top);
   padding-left: var(--o-doc-layout-content-padding-left);
   padding-right: var(--o-doc-layout-content-padding-right);
   transition: padding-left 0.3s;
 }
-.o-doc-layout .o-doc-layout-left[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-sider[data-v-966cd0b4] {
   box-sizing: content-box;
   position: fixed;
   top: var(--o-doc-layout-page-header-height);
@@ -138,19 +152,20 @@
   z-index: 35;
   transition: transform 0.3s;
 }
-.o-doc-layout .o-doc-layout-right[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-anchor[data-v-966cd0b4] {
   position: fixed;
   top: var(--o-doc-layout-anchor-top);
   right: var(--o-doc-layout-anchor-right);
   width: var(--o-doc-layout-anchor-content-width);
+  z-index: 33;
 }
-.o-doc-layout .o-doc-layout-float[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-float[data-v-966cd0b4] {
   position: fixed;
   right: var(--o-doc-layout-float-right);
   bottom: var(--o-doc-layout-float-bottom);
   z-index: var(--o-doc-layout-float-z-index);
 }
-.o-doc-layout .o-doc-layout-mask[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-mask[data-v-966cd0b4] {
   position: fixed;
   inset: 0;
   z-index: 34;
@@ -159,7 +174,7 @@
   pointer-events: none;
   transition: opacity 0.3s;
 }
-.o-doc-layout .o-doc-layout-opener[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-opener[data-v-966cd0b4] {
   position: fixed;
   top: 50%;
   left: var(--o-doc-layout-opener-left);
@@ -180,7 +195,7 @@
   cursor: pointer;
   transition: transform 0.3s, box-shadow 0.3s;
 }
-.o-doc-layout .o-doc-layout-opener[data-v-6510bed3]::before, .o-doc-layout .o-doc-layout-opener[data-v-6510bed3]::after {
+.o-doc-layout .o-doc-layout-opener[data-v-966cd0b4]::before, .o-doc-layout .o-doc-layout-opener[data-v-966cd0b4]::after {
   content: "";
   position: absolute;
   left: 0;
@@ -189,25 +204,25 @@
   pointer-events: none;
   transition: opacity 0.3s;
 }
-.o-doc-layout .o-doc-layout-opener[data-v-6510bed3]::before {
+.o-doc-layout .o-doc-layout-opener[data-v-966cd0b4]::before {
   bottom: 100%;
   height: 100vh;
 }
-.o-doc-layout .o-doc-layout-opener[data-v-6510bed3]::after {
+.o-doc-layout .o-doc-layout-opener[data-v-966cd0b4]::after {
   top: 100%;
   height: 100vh;
 }
-.o-doc-layout .o-doc-layout-opener .o-doc-layout-opener-thumb[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-opener .o-doc-layout-opener-thumb[data-v-966cd0b4] {
   width: 2px;
   height: 24px;
   border-radius: 2px;
   background-color: var(--o-color-info4);
   transition: background-color 0.3s;
 }
-.o-doc-layout .o-doc-layout-opener:hover .o-doc-layout-opener-thumb[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-opener:hover .o-doc-layout-opener-thumb[data-v-966cd0b4] {
   background-color: var(--o-color-primary1);
 }
-.o-doc-layout .o-doc-layout-resizer[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-resizer[data-v-966cd0b4] {
   position: fixed;
   top: var(--o-doc-layout-page-header-height);
   bottom: 0;
@@ -220,52 +235,52 @@
   -webkit-user-select: none;
   transition: transform 0.3s;
 }
-.o-doc-layout.is-collapsed .o-doc-layout-left[data-v-6510bed3] {
+.o-doc-layout.is-collapsed .o-doc-layout-sider[data-v-966cd0b4] {
   transform: translateX(-100%);
 }
-.o-doc-layout.is-collapsed .o-doc-layout-content[data-v-6510bed3] {
+.o-doc-layout.is-collapsed .o-doc-layout-content[data-v-966cd0b4] {
   padding-left: var(--o-doc-layout-padding);
 }
-.o-doc-layout.is-collapsed .o-doc-layout-mask[data-v-6510bed3] {
+.o-doc-layout.is-collapsed .o-doc-layout-mask[data-v-966cd0b4] {
   opacity: 0;
   pointer-events: none;
 }
-.o-doc-layout.is-collapsed .o-doc-layout-opener[data-v-6510bed3] {
+.o-doc-layout.is-collapsed .o-doc-layout-opener[data-v-966cd0b4] {
   transform: translateY(-50%) translateX(calc(-1 * var(--o-doc-layout-opener-left)));
   box-shadow: var(--o-shadow-2);
 }
-.o-doc-layout.is-collapsed .o-doc-layout-opener[data-v-6510bed3]::before, .o-doc-layout.is-collapsed .o-doc-layout-opener[data-v-6510bed3]::after {
+.o-doc-layout.is-collapsed .o-doc-layout-opener[data-v-966cd0b4]::before, .o-doc-layout.is-collapsed .o-doc-layout-opener[data-v-966cd0b4]::after {
   opacity: 0;
 }
-.o-doc-layout.is-collapsed .o-doc-layout-resizer[data-v-6510bed3] {
+.o-doc-layout.is-collapsed .o-doc-layout-resizer[data-v-966cd0b4] {
   transform: translateX(calc(4px - var(--o-doc-layout-opener-left)));
 }
-.o-doc-layout.is-resizing .o-doc-layout-left[data-v-6510bed3],
-.o-doc-layout.is-resizing .o-doc-layout-content[data-v-6510bed3],
-.o-doc-layout.is-resizing .o-doc-layout-opener[data-v-6510bed3],
-.o-doc-layout.is-resizing .o-doc-layout-resizer[data-v-6510bed3] {
+.o-doc-layout.is-resizing .o-doc-layout-sider[data-v-966cd0b4],
+.o-doc-layout.is-resizing .o-doc-layout-content[data-v-966cd0b4],
+.o-doc-layout.is-resizing .o-doc-layout-opener[data-v-966cd0b4],
+.o-doc-layout.is-resizing .o-doc-layout-resizer[data-v-966cd0b4] {
   transition: none;
 }
 @media (max-width: 1200px) {
-.o-doc-layout .o-doc-layout-left[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-sider[data-v-966cd0b4] {
     background-color: var(--o-color-fill2);
     background-image: linear-gradient(rgba(var(--o-brand-6), 0.03), rgba(var(--o-brand-6), 0.03));
 }
-.o-doc-layout .o-doc-layout-mask[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-mask[data-v-966cd0b4] {
     opacity: 1;
     pointer-events: auto;
 }
-.o-doc-layout .o-doc-layout-opener[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-opener[data-v-966cd0b4] {
     background-color: var(--o-color-fill2);
     background-image: linear-gradient(rgba(var(--o-brand-6), 0.03), rgba(var(--o-brand-6), 0.03));
 }
 }
 @media (max-width: 840px) {
-.o-doc-layout .o-doc-layout-left[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-sider[data-v-966cd0b4] {
     top: calc(var(--o-doc-layout-page-header-height) + var(--o-doc-layout-header-height));
 }
-.o-doc-layout .o-doc-layout-opener[data-v-6510bed3],
-  .o-doc-layout .o-doc-layout-resizer[data-v-6510bed3] {
+.o-doc-layout .o-doc-layout-opener[data-v-966cd0b4],
+  .o-doc-layout .o-doc-layout-resizer[data-v-966cd0b4] {
     display: none;
 }
 }

package/dist/treeshaking/components/doc-layout/index.d.ts

@@ -2,16 +2,194 @@ import { App } from 'vue';
 declare const ODocLayout: {
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
         collapsed?: boolean;
-        hasRight?: boolean;
+        hasSider?: boolean;
+        hasAnchor?: boolean;
         hasFloat?: boolean;
     }> & Readonly<{
         "onUpdate:collapsed"?: ((value: boolean) => any) | undefined;
     }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
         "update:collapsed": (value: boolean) => any;
     }, import('vue').PublicProps, {
-        hasRight: boolean;
+        hasSider: boolean;
+        hasAnchor: boolean;
         hasFloat: boolean;
     }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        scrollerRef: ({
+            $: import('vue').ComponentInternalInstance;
+            $data: {};
+            $props: Partial<{
+                size: "medium" | "small";
+                duration: number;
+                disabledX: boolean;
+                disabledY: boolean;
+                showType: "auto" | "always" | "never" | "hover";
+                autoUpdateOnScrollSize: boolean;
+            }> & Omit<{
+                readonly size: "small" | "medium";
+                readonly duration: number;
+                readonly disabledX: boolean;
+                readonly disabledY: boolean;
+                readonly showType: "auto" | "hover" | "always" | "never";
+                readonly autoUpdateOnScrollSize: boolean;
+                readonly wrapClass?: string | {
+                    [k: string]: boolean;
+                } | (string | {
+                    [k: string]: boolean;
+                })[] | undefined;
+                readonly barClass?: string | {
+                    [k: string]: boolean;
+                } | (string | {
+                    [k: string]: boolean;
+                })[] | undefined;
+                readonly onScroll?: ((event: Event) => any) | undefined | undefined;
+            } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "size" | "duration" | "disabledX" | "disabledY" | "showType" | "autoUpdateOnScrollSize">;
+            $attrs: import('vue').Attrs;
+            $refs: {
+                [x: string]: unknown;
+            } & {
+                targetRef: HTMLDivElement;
+            };
+            $slots: Readonly<{
+                [name: string]: import('vue').Slot<any> | undefined;
+            }>;
+            $root: import('vue').ComponentPublicInstance | null;
+            $parent: import('vue').ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: (event: "scroll", event: Event) => void;
+            $el: HTMLDivElement;
+            $options: import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                wrapClass: {
+                    type: import('vue').PropType<string | {
+                        [k: string]: boolean;
+                    } | Array<{
+                        [k: string]: boolean;
+                    } | string>>;
+                };
+                disabledX: {
+                    type: BooleanConstructor;
+                    required: false;
+                };
+                disabledY: {
+                    type: BooleanConstructor;
+                };
+                duration: {
+                    type: NumberConstructor;
+                    default: number;
+                };
+                showType: {
+                    type: import('vue').PropType<"auto" | "always" | "hover" | "never">;
+                    default: string;
+                };
+                size: {
+                    type: import('vue').PropType<import('@opensig/opendesign').ScrollerSizeT>;
+                    default: string;
+                };
+                autoUpdateOnScrollSize: {
+                    type: BooleanConstructor;
+                };
+                barClass: {
+                    type: import('vue').PropType<string | {
+                        [k: string]: boolean;
+                    } | Array<{
+                        [k: string]: boolean;
+                    } | string>>;
+                };
+            }>> & Readonly<{
+                onScroll?: ((event: Event) => any) | undefined;
+            }>, {
+                scrollTo: (options?: ScrollToOptions | undefined) => void;
+                scrollBy: (options?: ScrollToOptions | undefined) => void;
+                getContainerEl(): HTMLElement | null;
+            }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                scroll: (event: Event) => any;
+            }, string, {
+                size: "medium" | "small";
+                duration: number;
+                disabledX: boolean;
+                disabledY: boolean;
+                showType: "auto" | "always" | "never" | "hover";
+                autoUpdateOnScrollSize: boolean;
+            }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
+                beforeCreate?: (() => void) | (() => void)[];
+                created?: (() => void) | (() => void)[];
+                beforeMount?: (() => void) | (() => void)[];
+                mounted?: (() => void) | (() => void)[];
+                beforeUpdate?: (() => void) | (() => void)[];
+                updated?: (() => void) | (() => void)[];
+                activated?: (() => void) | (() => void)[];
+                deactivated?: (() => void) | (() => void)[];
+                beforeDestroy?: (() => void) | (() => void)[];
+                beforeUnmount?: (() => void) | (() => void)[];
+                destroyed?: (() => void) | (() => void)[];
+                unmounted?: (() => void) | (() => void)[];
+                renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
+                errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
+            };
+            $forceUpdate: () => void;
+            $nextTick: typeof import('vue').nextTick;
+            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
+        } & Readonly<{
+            size: "medium" | "small";
+            duration: number;
+            disabledX: boolean;
+            disabledY: boolean;
+            showType: "auto" | "always" | "never" | "hover";
+            autoUpdateOnScrollSize: boolean;
+        }> & Omit<Readonly<import('vue').ExtractPropTypes<{
+            wrapClass: {
+                type: import('vue').PropType<string | {
+                    [k: string]: boolean;
+                } | Array<{
+                    [k: string]: boolean;
+                } | string>>;
+            };
+            disabledX: {
+                type: BooleanConstructor;
+                required: false;
+            };
+            disabledY: {
+                type: BooleanConstructor;
+            };
+            duration: {
+                type: NumberConstructor;
+                default: number;
+            };
+            showType: {
+                type: import('vue').PropType<"auto" | "always" | "hover" | "never">;
+                default: string;
+            };
+            size: {
+                type: import('vue').PropType<import('@opensig/opendesign').ScrollerSizeT>;
+                default: string;
+            };
+            autoUpdateOnScrollSize: {
+                type: BooleanConstructor;
+            };
+            barClass: {
+                type: import('vue').PropType<string | {
+                    [k: string]: boolean;
+                } | Array<{
+                    [k: string]: boolean;
+                } | string>>;
+            };
+        }>> & Readonly<{
+            onScroll?: ((event: Event) => any) | undefined;
+        }>, "size" | "scrollTo" | "duration" | "disabledX" | "disabledY" | "showType" | "autoUpdateOnScrollSize" | "scrollBy" | "getContainerEl"> & {
+            scrollTo: (options?: ScrollToOptions | undefined) => void;
+            scrollBy: (options?: ScrollToOptions | undefined) => void;
+            getContainerEl: () => HTMLElement | null;
+        } & {} & import('vue').ComponentCustomProperties & {} & {
+            $slots: Readonly<{
+                default?(): any;
+                thumb?(props: import('@opensig/opendesign').ScrollbarSlotProps): any;
+                track?(props: import('@opensig/opendesign').ScrollbarSlotProps): any;
+            }> & {
+                default?(): any;
+                thumb?(props: import('@opensig/opendesign').ScrollbarSlotProps): any;
+                track?(props: import('@opensig/opendesign').ScrollbarSlotProps): any;
+            };
+        }) | null;
         containerRef: HTMLDivElement;
     }, HTMLDivElement, import('vue').ComponentProvideOptions, {
         P: {};
@@ -22,12 +200,14 @@ declare const ODocLayout: {
         Defaults: {};
     }, Readonly<{
         collapsed?: boolean;
-        hasRight?: boolean;
+        hasSider?: boolean;
+        hasAnchor?: boolean;
         hasFloat?: boolean;
     }> & Readonly<{
         "onUpdate:collapsed"?: ((value: boolean) => any) | undefined;
     }>, {}, {}, {}, {}, {
-        hasRight: boolean;
+        hasSider: boolean;
+        hasAnchor: boolean;
         hasFloat: boolean;
     }>;
     __isFragment?: never;
@@ -35,23 +215,33 @@ declare const ODocLayout: {
     __isSuspense?: never;
 } & import('vue').ComponentOptionsBase<Readonly<{
     collapsed?: boolean;
-    hasRight?: boolean;
+    hasSider?: boolean;
+    hasAnchor?: boolean;
     hasFloat?: boolean;
 }> & Readonly<{
     "onUpdate:collapsed"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:collapsed": (value: boolean) => any;
 }, string, {
-    hasRight: boolean;
+    hasSider: boolean;
+    hasAnchor: boolean;
     hasFloat: boolean;
 }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
     $slots: {
         'header-title'?(_: {}): any;
         'header-right'?(_: {}): any;
-        left?(_: {}): any;
-        content?(_: {}): any;
-        right?(_: {}): any;
-        float?(_: {}): any;
+        sider?(_: {
+            scroller: HTMLElement | undefined;
+        }): any;
+        content?(_: {
+            scroller: HTMLElement | undefined;
+        }): any;
+        anchor?(_: {
+            scroller: HTMLElement | undefined;
+        }): any;
+        float?(_: {
+            scroller: HTMLElement | undefined;
+        }): any;
     };
 }) & {
     install(app: App): void;

package/dist/treeshaking/components/markdown/OMarkdown.mjs

@@ -1,7 +1,7 @@
 import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.mjs";
 import OMarkdown_vue_vue_type_script_setup_true_lang_default from "./OMarkdown.vue_vue_type_script_setup_true_lang.mjs";
 import './OMarkdown.vue_vue_type_style_index_0_lang.css';
-import './OMarkdown.vue_vue_type_style_index_1_scoped_4be4e234_lang.css';
+import './OMarkdown.vue_vue_type_style_index_1_scoped_c19788db_lang.css';
 // src/components/markdown/OMarkdown.vue
-var OMarkdown_default = /*#__PURE__*/ _plugin_vue_export_helper_default(OMarkdown_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4be4e234"]]);
+var OMarkdown_default = /*#__PURE__*/ _plugin_vue_export_helper_default(OMarkdown_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-c19788db"]]);
 export { OMarkdown_default as default };