@quidgest/ui 0.17.9 → 0.19.0

package/esm/components/QSidebar/QSidebarItem.vue.js

@@ -0,0 +1,130 @@
+import { useGroupItem as e } from "../../composables/useGroup/index.js";
+import { QIcon as t } from "../QIcon/index.js";
+import { useId as n } from "../../composables/uid.js";
+import { SidebarSymbol as r } from "./context.js";
+import { QToggle as i } from "../QToggle/index.js";
+import a from "./QSidebarPanel2.vue.js";
+import { Fragment as o, Teleport as s, Transition as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createSlots as p, createVNode as m, defineComponent as h, inject as g, mergeProps as _, normalizeClass as v, normalizeProps as y, onBeforeMount as b, onBeforeUnmount as x, openBlock as S, renderSlot as C, toRef as w, unref as T, useTemplateRef as E, withCtx as D } from "vue";
+//#region src/components/QSidebar/QSidebarItem.vue?vue&type=script&setup=true&lang.ts
+var O = /*@__PURE__*/ h({
+	__name: "QSidebarItem",
+	props: {
+		id: {},
+		class: {},
+		title: {},
+		icon: {},
+		value: {},
+		resizable: { type: Boolean },
+		showGrip: {
+			type: Boolean,
+			default: !0
+		},
+		initialWidth: { default: "medium" },
+		minWidth: { default: "small" },
+		maxWidth: { default: "block" }
+	},
+	setup(h) {
+		let O = h, k = g(r);
+		if (!k) throw Error("QSidebarItem: Failed to retrieve sidebar context. Ensure the component is used within a QSidebar context.");
+		let A = n(w(O, "value")), j = n(w(O, "id")), M = n(), N = e(A);
+		if (!N) throw Error("QSidebarItem: Failed to retrieve group item. Ensure the component is used within a QSidebar context.");
+		let P = k, F = N, I = E("anchor"), L = l(() => P.anchorItemsEl.value), R = l(() => P.position.value === "left" ? "right" : "left"), z = l(() => P.position.value === "left" ? "slide-right" : "slide-left");
+		function B() {
+			F.toggle(), P.onItemClick(A.value);
+		}
+		function V() {
+			P.onPanelAfterLeave();
+		}
+		return b(() => {
+			P.register({
+				value: A.value,
+				resizable: w(O, "resizable"),
+				initialWidth: w(O, "initialWidth"),
+				minWidth: w(O, "minWidth"),
+				maxWidth: w(O, "maxWidth"),
+				anchorRef: I
+			});
+		}), x(() => {
+			P.unregister(A.value);
+		}), (e, n) => (S(), f(o, null, [L.value ? (S(), u(s, {
+			key: 0,
+			to: L.value
+		}, [m(T(i), {
+			id: T(j),
+			ref: "anchor",
+			"data-testid": "q-sidebar-panel-button",
+			borderless: "",
+			"icon-pos": "top",
+			class: v(["q-sidebar__item", O.class]),
+			"model-value": T(F).isActive.value,
+			"aria-controls": T(M),
+			label: T(P).showLabels.value ? O.title : void 0,
+			title: T(P).showLabels.value ? void 0 : O.title,
+			"onUpdate:modelValue": B
+		}, {
+			default: D(() => [C(e.$slots, "anchor", {}, () => [O.icon ? (S(), u(T(t), y(_({ key: 0 }, O.icon)), null, 16)) : d("v-if", !0)])]),
+			_: 3
+		}, 8, [
+			"id",
+			"class",
+			"model-value",
+			"aria-controls",
+			"label",
+			"title"
+		])], 8, ["to"])) : d("v-if", !0), m(c, {
+			name: z.value,
+			css: T(P).animatePanel.value,
+			onAfterLeave: V
+		}, {
+			default: D(() => [T(F).isActive.value ? (S(), u(a, {
+				key: 0,
+				id: T(M),
+				"aria-labelledby": T(j),
+				title: O.title,
+				resizable: O.resizable,
+				"show-grip": O.showGrip,
+				"resize-position": R.value,
+				"onResize:start": T(P).onResizeStart,
+				onResize: T(P).onPanelResize,
+				"onResize:end": T(P).onResizeEnd
+			}, p({
+				content: D(() => [C(e.$slots, "default")]),
+				_: 2
+			}, [
+				e.$slots["header.prepend"] ? {
+					name: "header.prepend",
+					fn: D(() => [C(e.$slots, "header.prepend")]),
+					key: "0"
+				} : void 0,
+				e.$slots.header ? {
+					name: "header",
+					fn: D(() => [C(e.$slots, "header")]),
+					key: "1"
+				} : void 0,
+				e.$slots["header.append"] ? {
+					name: "header.append",
+					fn: D(() => [C(e.$slots, "header.append")]),
+					key: "2"
+				} : void 0,
+				e.$slots.footer ? {
+					name: "footer",
+					fn: D(() => [C(e.$slots, "footer")]),
+					key: "3"
+				} : void 0
+			]), 1032, [
+				"id",
+				"aria-labelledby",
+				"title",
+				"resizable",
+				"show-grip",
+				"resize-position",
+				"onResize:start",
+				"onResize",
+				"onResize:end"
+			])) : d("v-if", !0)]),
+			_: 3
+		}, 8, ["name", "css"])], 64));
+	}
+});
+//#endregion
+export { O as default };

package/esm/components/QSidebar/QSidebarItem2.vue.js

@@ -0,0 +1,5 @@
+import e from "./QSidebarItem.vue.js";
+//#region src/components/QSidebar/QSidebarItem.vue
+var t = e;
+//#endregion
+export { t as default };

package/esm/components/QSidebar/QSidebarPanel.d.ts

@@ -22,13 +22,7 @@ declare const __VLS_component: import('vue').DefineComponent<QSidebarPanelProps,
     onResize?: ((width: number) => any) | undefined;
     "onResize:start"?: (() => any) | undefined;
     "onResize:end"?: ((finalWidth: number) => any) | undefined;
-}>, {
-    showGrip: boolean;
-    initialWidth: import('./types').QSidebarPanelSize;
-    minWidth: import('./types').QSidebarPanelSize;
-    maxWidth: import('./types').QSidebarPanelSize;
-    resizePosition: "left" | "right";
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     panel: HTMLDivElement;
 }, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;

package/esm/components/QSidebar/QSidebarPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QSidebarPanel.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QSidebar/QSidebarPanel.vue"],"names":[],"mappings":"AAsCA;AAwIC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,GAAG,CAAA;AAuG5C,iBAAS,cAAc;WAsET,OAAO,IAA6B;;wBAftB,GAAG;kCACO,GAAG;iCACJ,GAAG;yBACX,GAAG;wBACJ,GAAG;;;;;;EAgB9B;AAWD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;kBAUnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"QSidebarPanel.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QSidebar/QSidebarPanel.vue"],"names":[],"mappings":"AAuCA;AAmIC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,GAAG,CAAA;AA0F5C,iBAAS,cAAc;WAuET,OAAO,IAA6B;;wBAftB,GAAG;kCACO,GAAG;iCACJ,GAAG;yBACX,GAAG;wBACJ,GAAG;;;;;;EAgB9B;AAUD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;kBASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/esm/components/QSidebar/QSidebarPanel.vue.js

@@ -2,7 +2,8 @@ import { createCommentVNode as e, createElementBlock as t, createElementVNode as
 //#region src/components/QSidebar/QSidebarPanel.vue?vue&type=script&setup=true&lang.ts
 var d = {
 	ref: "panel",
-	class: "q-sidebar-panel"
+	class: "q-sidebar-panel",
+	role: "region"
 }, f = { class: "q-sidebar-panel__header" }, p = {
 	key: 0,
 	class: "q-sidebar-panel__title"
@@ -16,16 +17,9 @@ var d = {
 	__name: "QSidebarPanel",
 	props: {
 		title: {},
-		icon: {},
 		resizable: { type: Boolean },
-		showGrip: {
-			type: Boolean,
-			default: !0
-		},
-		initialWidth: { default: "medium" },
-		minWidth: { default: "small" },
-		maxWidth: { default: "large" },
-		resizePosition: { default: "right" }
+		showGrip: { type: Boolean },
+		resizePosition: {}
 	},
 	emits: [
 		"resize",

package/esm/components/QSidebar/context.d.ts

@@ -0,0 +1,108 @@
+import { ComputedRef, InjectionKey, Ref, ShallowRef } from 'vue';
+import { QSidebarPanelSize } from './types';
+/**
+ * Metadata registered by each {@link QSidebarItem} with its parent {@link QSidebar}.
+ */
+export type SidebarItemRegistration = {
+    /**
+     * Identity of the item, matching the value used by `v-model` on `QSidebar`.
+     */
+    value: string;
+    /**
+     * Whether the panel can be resized by the user.
+     */
+    resizable: Ref<boolean | undefined>;
+    /**
+     * Initial panel width preset.
+     */
+    initialWidth: Ref<QSidebarPanelSize | undefined>;
+    /**
+     * Minimum allowed panel width preset.
+     */
+    minWidth: Ref<QSidebarPanelSize | undefined>;
+    /**
+     * Maximum allowed panel width preset.
+     */
+    maxWidth: Ref<QSidebarPanelSize | undefined>;
+    /**
+     * Template ref for the anchor toggle element (indicator positioning).
+     */
+    anchorRef: Ref<{
+        $el?: HTMLElement;
+    } | HTMLElement | null>;
+};
+/**
+ * Provide/inject context shared between {@link QSidebar} and its {@link QSidebarItem} children.
+ */
+export type SidebarContext = {
+    /**
+     * DOM element that hosts teleported anchor toggles.
+     */
+    anchorItemsEl: ComputedRef<HTMLElement | null>;
+    /**
+     * Sidebar position on the screen.
+     */
+    position: ComputedRef<'left' | 'right'>;
+    /**
+     * Whether anchor labels are shown alongside icons.
+     */
+    showLabels: ComputedRef<boolean>;
+    /**
+     * Width of the anchor section in pixels.
+     */
+    anchorWidth: ComputedRef<number | undefined>;
+    /**
+     * Whether panel enter/leave should use the slide CSS transition.
+     * True for open/close; false when switching between two open items
+     * so the root width can change without a competing slide animation.
+     */
+    animatePanel: ComputedRef<boolean>;
+    /**
+     * Registered sidebar items in mount order.
+     */
+    items: ShallowRef<SidebarItemRegistration[]>;
+    /**
+     * Registers an item with the parent sidebar.
+     *
+     * @param item - Item metadata to register.
+     */
+    register: (item: SidebarItemRegistration) => void;
+    /**
+     * Removes a previously registered item (typically on unmount).
+     *
+     * @param value - The item `value` to remove.
+     */
+    unregister: (value: string) => void;
+    /**
+     * Notifies the parent that an anchor item was clicked.
+     *
+     * @param value - The clicked item value.
+     */
+    onItemClick: (value: string) => void;
+    /**
+     * Notifies the parent that panel resizing started.
+     */
+    onResizeStart: () => void;
+    /**
+     * Notifies the parent of an in-progress panel resize.
+     *
+     * @param width - The new panel width in pixels.
+     */
+    onPanelResize: (width: number) => void;
+    /**
+     * Notifies the parent that panel resizing ended.
+     *
+     * @param width - The final panel width in pixels.
+     */
+    onResizeEnd: (width: number) => void;
+    /**
+     * Notifies the parent that a panel leave transition finished.
+     * Used to clear expanded sizing after the close animation.
+     */
+    onPanelAfterLeave: () => void;
+};
+/**
+ * Injection key for the {@link SidebarContext} provided by `QSidebar`.
+ */
+export declare const SidebarSymbol: InjectionKey<SidebarContext>;
+//# sourceMappingURL=context.d.ts.map

package/esm/components/QSidebar/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/components/QSidebar/context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AACrE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEhD;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACrC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IAEb;;OAEG;IACH,SAAS,EAAE,GAAG,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;IAEnC;;OAEG;IACH,YAAY,EAAE,GAAG,CAAC,iBAAiB,GAAG,SAAS,CAAC,CAAA;IAEhD;;OAEG;IACH,QAAQ,EAAE,GAAG,CAAC,iBAAiB,GAAG,SAAS,CAAC,CAAA;IAE5C;;OAEG;IACH,QAAQ,EAAE,GAAG,CAAC,iBAAiB,GAAG,SAAS,CAAC,CAAA;IAE5C;;OAEG;IACH,SAAS,EAAE,GAAG,CAAC;QAAE,GAAG,CAAC,EAAE,WAAW,CAAA;KAAE,GAAG,WAAW,GAAG,IAAI,CAAC,CAAA;CAC1D,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC5B;;OAEG;IACH,aAAa,EAAE,WAAW,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAE9C;;OAEG;IACH,QAAQ,EAAE,WAAW,CAAC,MAAM,GAAG,OAAO,CAAC,CAAA;IAEvC;;OAEG;IACH,UAAU,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAEhC;;OAEG;IACH,WAAW,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAE5C;;;;OAIG;IACH,YAAY,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAElC;;OAEG;IACH,KAAK,EAAE,UAAU,CAAC,uBAAuB,EAAE,CAAC,CAAA;IAE5C;;;;OAIG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,uBAAuB,KAAK,IAAI,CAAA;IAEjD;;;;OAIG;IACH,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEnC;;;;OAIG;IACH,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEpC;;OAEG;IACH,aAAa,EAAE,MAAM,IAAI,CAAA;IAEzB;;;;OAIG;IACH,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEtC;;;;OAIG;IACH,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEpC;;;OAGG;IACH,iBAAiB,EAAE,MAAM,IAAI,CAAA;CAC7B,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,YAAY,CAAC,cAAc,CAAuB,CAAA"}

package/esm/components/QSidebar/context.js

@@ -0,0 +1,4 @@
+//#region src/components/QSidebar/context.ts
+var e = Symbol("q-sidebar");
+//#endregion
+export { e as SidebarSymbol };

package/esm/components/QSidebar/index.d.ts

@@ -1,7 +1,9 @@
 declare const QSidebar: {
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
         modelValue?: string;
-    } & import('./types').QSidebarAnchorProps & {
+    } & import('../../types/component').QBaseComponentProps & {
+        anchorWidth?: number;
+        showLabels?: boolean;
         position?: "left" | "right";
     }> & Readonly<{
         "onUpdate:modelValue"?: ((value: string) => any) | undefined;
@@ -19,7 +21,30 @@ declare const QSidebar: {
     }, import('vue').PublicProps, {
         position: "left" | "right";
         anchorWidth: number;
-    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
+    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        anchor: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
+            anchorWidth?: number;
+            modelValue?: string;
+            items: import('./context').SidebarItemRegistration[];
+        }> & Readonly<{}>, {
+            itemsEl: Readonly<import('vue').ShallowRef<HTMLElement | null>>;
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+            items: HTMLDivElement;
+        }, HTMLDivElement, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<{
+            anchorWidth?: number;
+            modelValue?: string;
+            items: import('./context').SidebarItemRegistration[];
+        }> & Readonly<{}>, {
+            itemsEl: Readonly<import('vue').ShallowRef<HTMLElement | null>>;
+        }, {}, {}, {}, {}> | null;
+    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -28,7 +53,9 @@ declare const QSidebar: {
         Defaults: {};
     }, Readonly<{
         modelValue?: string;
-    } & import('./types').QSidebarAnchorProps & {
+    } & import('../../types/component').QBaseComponentProps & {
+        anchorWidth?: number;
+        showLabels?: boolean;
         position?: "left" | "right";
     }> & Readonly<{
         "onUpdate:modelValue"?: ((value: string) => any) | undefined;
@@ -45,7 +72,9 @@ declare const QSidebar: {
     __isSuspense?: never;
 } & import('vue').ComponentOptionsBase<Readonly<{
     modelValue?: string;
-} & import('./types').QSidebarAnchorProps & {
+} & import('../../types/component').QBaseComponentProps & {
+    anchorWidth?: number;
+    showLabels?: boolean;
     position?: "left" | "right";
 }> & Readonly<{
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
@@ -64,10 +93,139 @@ declare const QSidebar: {
     position: "left" | "right";
     anchorWidth: number;
 }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
-    $slots: Partial<Record<`anchor:${string}`, (_: {
-        item: import('./types').QSidebarAnchorItemConfig;
-    }) => any>> & Partial<Record<`header.prepend:${string}`, (_: {}) => any>> & Partial<Record<`header:${string}`, (_: {}) => any>> & Partial<Record<`header.append:${string}`, (_: {}) => any>> & Partial<Record<`content:${string}`, (_: {}) => any>> & Partial<Record<`footer:${string}`, (_: {}) => any>>;
+    $slots: {
+        default?(_: {}): any;
+    };
 });
-export { QSidebar };
+declare const QSidebarItem: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').QSidebarItemProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        showGrip: boolean;
+        initialWidth: import('./types').QSidebarPanelSize;
+        minWidth: import('./types').QSidebarPanelSize;
+        maxWidth: import('./types').QSidebarPanelSize;
+    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        anchor: ({
+            $: import('vue').ComponentInternalInstance;
+            $data: {};
+            $props: {
+                readonly modelValue?: boolean | undefined;
+                readonly id?: string | undefined;
+                readonly class?: string | unknown[] | undefined;
+                readonly label?: string | undefined;
+                readonly variant?: import('..').QButtonVariant | undefined;
+                readonly color?: string | undefined;
+                readonly borderless?: boolean | undefined;
+                readonly elevated?: boolean | undefined;
+                readonly block?: boolean | undefined;
+                readonly size?: import('..').QButtonSize | undefined;
+                readonly iconPos?: import('..').QButtonIconPosition | undefined;
+                readonly pill?: boolean | undefined;
+                readonly disabled?: boolean | undefined;
+                readonly loading?: boolean | undefined;
+                readonly "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+            } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
+            $attrs: import('vue').Attrs;
+            $refs: {
+                [x: string]: unknown;
+            };
+            $slots: Readonly<{
+                [name: string]: import('vue').Slot<any> | undefined;
+            }>;
+            $root: import('vue').ComponentPublicInstance | null;
+            $parent: import('vue').ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: (event: "update:modelValue", value: boolean) => void;
+            $el: HTMLButtonElement;
+            $options: import('vue').ComponentOptionsBase<Readonly<{
+                modelValue?: boolean;
+            } & import('../../types/component').QBaseComponentProps & {
+                label?: string;
+                variant?: import('..').QButtonVariant;
+                color?: string;
+                borderless?: boolean;
+                elevated?: boolean;
+                block?: boolean;
+                size?: import('..').QButtonSize;
+                iconPos?: import('..').QButtonIconPosition;
+                pill?: boolean;
+                disabled?: boolean;
+                loading?: boolean;
+            }> & Readonly<{
+                "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+            }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                "update:modelValue": (value: boolean) => any;
+            }, string, {}, {}, 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<{}> & Omit<Readonly<{
+            modelValue?: boolean;
+        } & import('../../types/component').QBaseComponentProps & {
+            label?: string;
+            variant?: import('..').QButtonVariant;
+            color?: string;
+            borderless?: boolean;
+            elevated?: boolean;
+            block?: boolean;
+            size?: import('..').QButtonSize;
+            iconPos?: import('..').QButtonIconPosition;
+            pill?: boolean;
+            disabled?: boolean;
+            loading?: boolean;
+        }> & Readonly<{
+            "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+        }>, never> & {} & import('vue').ComponentCustomProperties & {} & {
+            $slots: {
+                default?(_: {}): any;
+            };
+        }) | null;
+    }, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('./types').QSidebarItemProps> & Readonly<{}>, {}, {}, {}, {}, {
+        showGrip: boolean;
+        initialWidth: import('./types').QSidebarPanelSize;
+        minWidth: import('./types').QSidebarPanelSize;
+        maxWidth: import('./types').QSidebarPanelSize;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('./types').QSidebarItemProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    showGrip: boolean;
+    initialWidth: import('./types').QSidebarPanelSize;
+    minWidth: import('./types').QSidebarPanelSize;
+    maxWidth: import('./types').QSidebarPanelSize;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: {
+        anchor?(_: {}): any;
+        'header.prepend'?(_: {}): any;
+        header?(_: {}): any;
+        'header.append'?(_: {}): any;
+        default?(_: {}): any;
+        footer?(_: {}): any;
+    };
+});
+export { QSidebar, QSidebarItem };
 export * from './types';
 //# sourceMappingURL=index.d.ts.map

package/esm/components/QSidebar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QSidebar/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA6B,CAAA;AAG3C,OAAO,EAAE,QAAQ,EAAE,CAAA;AAGnB,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QSidebar/index.ts"],"names":[],"mappings":"AAOA,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA6B,CAAA;AAC3C,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCAO0z0B,GAAG,8CAA8C,GAAG,yBAAyB,GAAG,6DAAmC,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAP/40B,CAAA;AAGnD,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,CAAA;AAGjC,cAAc,SAAS,CAAA"}

package/esm/components/QSidebar/index.js

@@ -1,6 +1,7 @@
 import { setupPropsProxy as e } from "../../utils/setupPropsProxy.js";
 import t from "./QSidebar2.vue.js";
+import n from "./QSidebarItem2.vue.js";
 //#region src/components/QSidebar/index.ts
-var n = e(t);
+var r = e(t), i = e(n);
 //#endregion
-export { n as QSidebar };
+export { r as QSidebar, i as QSidebarItem };