cisse-vue-ui 0.2.4 → 0.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +67 -1
- package/dist/{CollapsibleCard.vue_vue_type_script_setup_true_lang-Do0H2ZOe.cjs → CollapsibleCard.vue_vue_type_script_setup_true_lang-CPV2dtkO.cjs} +67 -125
- package/dist/CollapsibleCard.vue_vue_type_script_setup_true_lang-CPV2dtkO.cjs.map +1 -0
- package/dist/{CollapsibleCard.vue_vue_type_script_setup_true_lang-Cymj-zkh.js → CollapsibleCard.vue_vue_type_script_setup_true_lang-D0eSGYea.js} +68 -126
- package/dist/CollapsibleCard.vue_vue_type_script_setup_true_lang-D0eSGYea.js.map +1 -0
- package/dist/{Dropdown.vue_vue_type_script_setup_true_lang-D65uMijW.js → Dropdown.vue_vue_type_script_setup_true_lang-B9DsCY8M.js} +26 -74
- package/dist/Dropdown.vue_vue_type_script_setup_true_lang-B9DsCY8M.js.map +1 -0
- package/dist/{Dropdown.vue_vue_type_script_setup_true_lang-H6wsySqi.cjs → Dropdown.vue_vue_type_script_setup_true_lang-nMP2OxXp.cjs} +25 -73
- package/dist/Dropdown.vue_vue_type_script_setup_true_lang-nMP2OxXp.cjs.map +1 -0
- package/dist/{PageLayout.vue_vue_type_script_setup_true_lang-DoawksKc.cjs → PageLayout.vue_vue_type_script_setup_true_lang-Bnw5L-xO.cjs} +2 -2
- package/dist/{PageLayout.vue_vue_type_script_setup_true_lang-DoawksKc.cjs.map → PageLayout.vue_vue_type_script_setup_true_lang-Bnw5L-xO.cjs.map} +1 -1
- package/dist/{PageLayout.vue_vue_type_script_setup_true_lang-J1I-WjM-.js → PageLayout.vue_vue_type_script_setup_true_lang-D8uD3-Fe.js} +2 -2
- package/dist/{PageLayout.vue_vue_type_script_setup_true_lang-J1I-WjM-.js.map → PageLayout.vue_vue_type_script_setup_true_lang-D8uD3-Fe.js.map} +1 -1
- package/dist/{Switch.vue_vue_type_script_setup_true_lang-C2_5u-HL.js → Switch.vue_vue_type_script_setup_true_lang-dRPxDu8I.js} +33 -103
- package/dist/Switch.vue_vue_type_script_setup_true_lang-dRPxDu8I.js.map +1 -0
- package/dist/{Switch.vue_vue_type_script_setup_true_lang-V-FtNcTd.cjs → Switch.vue_vue_type_script_setup_true_lang-wRTWorCd.cjs} +32 -102
- package/dist/Switch.vue_vue_type_script_setup_true_lang-wRTWorCd.cjs.map +1 -0
- package/dist/components/core/Dropdown.vue.d.ts +2 -4
- package/dist/components/core/index.cjs +2 -2
- package/dist/components/core/index.js +2 -2
- package/dist/components/form/index.cjs +1 -1
- package/dist/components/form/index.js +1 -1
- package/dist/components/index.cjs +4 -4
- package/dist/components/index.js +4 -4
- package/dist/components/layout/index.cjs +1 -1
- package/dist/components/layout/index.js +1 -1
- package/dist/composables/index.cjs +8 -4
- package/dist/composables/index.cjs.map +1 -1
- package/dist/composables/index.d.ts +2 -0
- package/dist/composables/index.js +5 -1
- package/dist/composables/index.js.map +1 -1
- package/dist/composables/useDropdown.d.ts +51 -0
- package/dist/composables/useModal.d.ts +60 -0
- package/dist/{index-D_7WQIhA.cjs → index-C-qIi_nO.cjs} +5 -5
- package/dist/index-C-qIi_nO.cjs.map +1 -0
- package/dist/{index-CNQJxtkC.js → index-DUVvDjHF.js} +5 -5
- package/dist/index-DUVvDjHF.js.map +1 -0
- package/dist/index.cjs +13 -9
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +10 -6
- package/dist/index.js.map +1 -1
- package/dist/useDropdown-DHFnd259.cjs +130 -0
- package/dist/useDropdown-DHFnd259.cjs.map +1 -0
- package/dist/useDropdown-iVu14E6s.js +131 -0
- package/dist/useDropdown-iVu14E6s.js.map +1 -0
- package/dist/{useExportCSV-B9o9lJ3D.js → useModal-Aq8hn152.js} +40 -1
- package/dist/useModal-Aq8hn152.js.map +1 -0
- package/dist/{useExportCSV-BPC_hd25.cjs → useModal-DDF_ZS8C.cjs} +40 -1
- package/dist/useModal-DDF_ZS8C.cjs.map +1 -0
- package/package.json +1 -1
- package/dist/CollapsibleCard.vue_vue_type_script_setup_true_lang-Cymj-zkh.js.map +0 -1
- package/dist/CollapsibleCard.vue_vue_type_script_setup_true_lang-Do0H2ZOe.cjs.map +0 -1
- package/dist/Dropdown.vue_vue_type_script_setup_true_lang-D65uMijW.js.map +0 -1
- package/dist/Dropdown.vue_vue_type_script_setup_true_lang-H6wsySqi.cjs.map +0 -1
- package/dist/Switch.vue_vue_type_script_setup_true_lang-C2_5u-HL.js.map +0 -1
- package/dist/Switch.vue_vue_type_script_setup_true_lang-V-FtNcTd.cjs.map +0 -1
- package/dist/index-CNQJxtkC.js.map +0 -1
- package/dist/index-D_7WQIhA.cjs.map +0 -1
- package/dist/useExportCSV-B9o9lJ3D.js.map +0 -1
- package/dist/useExportCSV-BPC_hd25.cjs.map +0 -1
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { defineComponent, computed, resolveComponent, createBlock, openBlock, resolveDynamicComponent, mergeProps, withCtx, createElementVNode, createVNode, createElementBlock, createCommentVNode, unref, normalizeClass, Transition, toDisplayString, ref,
|
|
1
|
+
import { defineComponent, computed, resolveComponent, createBlock, openBlock, resolveDynamicComponent, mergeProps, withCtx, createElementVNode, createVNode, createElementBlock, createCommentVNode, unref, normalizeClass, Transition, toDisplayString, ref, renderSlot, createTextVNode, Teleport, normalizeStyle, Fragment, renderList } from "vue";
|
|
2
2
|
import { Icon } from "@iconify/vue";
|
|
3
|
+
import { u as useDropdown } from "./useDropdown-iVu14E6s.js";
|
|
3
4
|
const _hoisted_1$1 = { class: "relative" };
|
|
4
5
|
const _hoisted_2$1 = {
|
|
5
6
|
key: 0,
|
|
@@ -81,15 +82,16 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
81
82
|
};
|
|
82
83
|
}
|
|
83
84
|
});
|
|
84
|
-
const _hoisted_1 = {
|
|
85
|
+
const _hoisted_1 = { class: "relative inline-block" };
|
|
86
|
+
const _hoisted_2 = {
|
|
85
87
|
type: "button",
|
|
86
88
|
class: "inline-flex items-center gap-2 rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700"
|
|
87
89
|
};
|
|
88
|
-
const
|
|
90
|
+
const _hoisted_3 = {
|
|
89
91
|
key: 0,
|
|
90
92
|
class: "my-1 border-t border-gray-200 dark:border-gray-700"
|
|
91
93
|
};
|
|
92
|
-
const
|
|
94
|
+
const _hoisted_4 = ["disabled", "onClick"];
|
|
93
95
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
94
96
|
__name: "Dropdown",
|
|
95
97
|
props: {
|
|
@@ -102,60 +104,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
102
104
|
setup(__props, { emit: __emit }) {
|
|
103
105
|
const props = __props;
|
|
104
106
|
const emit = __emit;
|
|
105
|
-
const isOpen = ref(false);
|
|
106
|
-
const dropdownRef = ref();
|
|
107
107
|
const triggerRef = ref();
|
|
108
108
|
const menuRef = ref();
|
|
109
|
-
const
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
dropdownPosition.value = {
|
|
114
|
-
top: rect.bottom + window.scrollY + 8,
|
|
115
|
-
left: rect.left + window.scrollX,
|
|
116
|
-
right: window.innerWidth - rect.right - window.scrollX,
|
|
117
|
-
width: rect.width
|
|
118
|
-
};
|
|
119
|
-
};
|
|
120
|
-
const toggle = () => {
|
|
121
|
-
isOpen.value = !isOpen.value;
|
|
122
|
-
if (isOpen.value) {
|
|
123
|
-
nextTick(updatePosition);
|
|
124
|
-
}
|
|
125
|
-
};
|
|
126
|
-
const close = () => {
|
|
127
|
-
isOpen.value = false;
|
|
128
|
-
};
|
|
109
|
+
const { isOpen, dropdownStyle, toggle, close } = useDropdown(triggerRef, menuRef, {
|
|
110
|
+
teleport: props.teleport,
|
|
111
|
+
align: props.align
|
|
112
|
+
});
|
|
129
113
|
const selectItem = (item) => {
|
|
130
114
|
if (item.disabled || item.divider) return;
|
|
131
115
|
emit("select", item);
|
|
132
116
|
close();
|
|
133
117
|
};
|
|
134
|
-
const handleClickOutside = (event) => {
|
|
135
|
-
var _a, _b;
|
|
136
|
-
const target = event.target;
|
|
137
|
-
const isInsideTrigger = (_a = triggerRef.value) == null ? void 0 : _a.contains(target);
|
|
138
|
-
const isInsideMenu = (_b = menuRef.value) == null ? void 0 : _b.contains(target);
|
|
139
|
-
if (!isInsideTrigger && !isInsideMenu) {
|
|
140
|
-
close();
|
|
141
|
-
}
|
|
142
|
-
};
|
|
143
|
-
watch(isOpen, (newValue) => {
|
|
144
|
-
if (newValue) {
|
|
145
|
-
document.addEventListener("click", handleClickOutside);
|
|
146
|
-
window.addEventListener("scroll", updatePosition, true);
|
|
147
|
-
window.addEventListener("resize", updatePosition);
|
|
148
|
-
} else {
|
|
149
|
-
document.removeEventListener("click", handleClickOutside);
|
|
150
|
-
window.removeEventListener("scroll", updatePosition, true);
|
|
151
|
-
window.removeEventListener("resize", updatePosition);
|
|
152
|
-
}
|
|
153
|
-
});
|
|
154
|
-
onUnmounted(() => {
|
|
155
|
-
document.removeEventListener("click", handleClickOutside);
|
|
156
|
-
window.removeEventListener("scroll", updatePosition, true);
|
|
157
|
-
window.removeEventListener("resize", updatePosition);
|
|
158
|
-
});
|
|
159
118
|
const widthClasses = {
|
|
160
119
|
auto: "w-auto min-w-[10rem]",
|
|
161
120
|
full: "w-full",
|
|
@@ -163,34 +122,27 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
163
122
|
md: "w-48",
|
|
164
123
|
lg: "w-64"
|
|
165
124
|
};
|
|
166
|
-
const
|
|
125
|
+
const computedDropdownStyle = computed(() => {
|
|
167
126
|
if (!props.teleport) return {};
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
top: `${dropdownPosition.value.top}px`,
|
|
171
|
-
left: props.align === "right" ? "auto" : `${dropdownPosition.value.left}px`,
|
|
172
|
-
right: props.align === "right" ? `${dropdownPosition.value.right}px` : "auto"
|
|
173
|
-
};
|
|
127
|
+
const { width: _, ...rest } = dropdownStyle.value;
|
|
128
|
+
return rest;
|
|
174
129
|
});
|
|
175
130
|
return (_ctx, _cache) => {
|
|
176
|
-
return openBlock(), createElementBlock("div",
|
|
177
|
-
ref_key: "dropdownRef",
|
|
178
|
-
ref: dropdownRef,
|
|
179
|
-
class: "relative inline-block"
|
|
180
|
-
}, [
|
|
131
|
+
return openBlock(), createElementBlock("div", _hoisted_1, [
|
|
181
132
|
createElementVNode("div", {
|
|
182
133
|
ref_key: "triggerRef",
|
|
183
134
|
ref: triggerRef,
|
|
184
|
-
onClick:
|
|
135
|
+
onClick: _cache[0] || (_cache[0] = //@ts-ignore
|
|
136
|
+
(...args) => unref(toggle) && unref(toggle)(...args))
|
|
185
137
|
}, [
|
|
186
138
|
renderSlot(_ctx.$slots, "trigger", {}, () => [
|
|
187
|
-
createElementVNode("button",
|
|
139
|
+
createElementVNode("button", _hoisted_2, [
|
|
188
140
|
renderSlot(_ctx.$slots, "trigger-label", {}, () => [
|
|
189
|
-
_cache[
|
|
141
|
+
_cache[1] || (_cache[1] = createTextVNode("Options", -1))
|
|
190
142
|
]),
|
|
191
143
|
createVNode(unref(Icon), {
|
|
192
144
|
icon: "lucide:chevron-down",
|
|
193
|
-
class: normalizeClass(["size-4 transition-transform", isOpen
|
|
145
|
+
class: normalizeClass(["size-4 transition-transform", unref(isOpen) && "rotate-180"])
|
|
194
146
|
}, null, 8, ["class"])
|
|
195
147
|
])
|
|
196
148
|
])
|
|
@@ -208,23 +160,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
208
160
|
"leave-to-class": "transform opacity-0 scale-95"
|
|
209
161
|
}, {
|
|
210
162
|
default: withCtx(() => [
|
|
211
|
-
isOpen
|
|
163
|
+
unref(isOpen) ? (openBlock(), createElementBlock("div", {
|
|
212
164
|
key: 0,
|
|
213
165
|
ref_key: "menuRef",
|
|
214
166
|
ref: menuRef,
|
|
215
|
-
style: normalizeStyle(
|
|
167
|
+
style: normalizeStyle(computedDropdownStyle.value),
|
|
216
168
|
class: normalizeClass([
|
|
217
169
|
"z-[9999] rounded-lg border border-gray-200 bg-white py-1 shadow-lg dark:border-gray-700 dark:bg-gray-800",
|
|
218
170
|
widthClasses[__props.width],
|
|
219
171
|
!__props.teleport && (__props.align === "right" ? "absolute mt-2 right-0" : "absolute mt-2 left-0")
|
|
220
172
|
])
|
|
221
173
|
}, [
|
|
222
|
-
renderSlot(_ctx.$slots, "default", { close }, () => [
|
|
174
|
+
renderSlot(_ctx.$slots, "default", { close: unref(close) }, () => [
|
|
223
175
|
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item) => {
|
|
224
176
|
return openBlock(), createElementBlock(Fragment, {
|
|
225
177
|
key: item.key
|
|
226
178
|
}, [
|
|
227
|
-
item.divider ? (openBlock(), createElementBlock("div",
|
|
179
|
+
item.divider ? (openBlock(), createElementBlock("div", _hoisted_3)) : (openBlock(), createElementBlock("button", {
|
|
228
180
|
key: 1,
|
|
229
181
|
type: "button",
|
|
230
182
|
disabled: item.disabled,
|
|
@@ -240,7 +192,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
240
192
|
class: "size-4"
|
|
241
193
|
}, null, 8, ["icon"])) : createCommentVNode("", true),
|
|
242
194
|
createTextVNode(" " + toDisplayString(item.label), 1)
|
|
243
|
-
], 10,
|
|
195
|
+
], 10, _hoisted_4))
|
|
244
196
|
], 64);
|
|
245
197
|
}), 128))
|
|
246
198
|
])
|
|
@@ -249,7 +201,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
249
201
|
_: 3
|
|
250
202
|
})
|
|
251
203
|
], 8, ["disabled"]))
|
|
252
|
-
]
|
|
204
|
+
]);
|
|
253
205
|
};
|
|
254
206
|
}
|
|
255
207
|
});
|
|
@@ -257,4 +209,4 @@ export {
|
|
|
257
209
|
_sfc_main$1 as _,
|
|
258
210
|
_sfc_main as a
|
|
259
211
|
};
|
|
260
|
-
//# sourceMappingURL=Dropdown.vue_vue_type_script_setup_true_lang-
|
|
212
|
+
//# sourceMappingURL=Dropdown.vue_vue_type_script_setup_true_lang-B9DsCY8M.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dropdown.vue_vue_type_script_setup_true_lang-B9DsCY8M.js","sources":["../src/components/core/MenuItem.vue","../src/components/core/Dropdown.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, resolveComponent } from 'vue'\nimport { Icon } from '@iconify/vue'\nimport type { MenuItemProps } from '@/types'\n\nconst props = withDefaults(\n defineProps<{\n menuItem: MenuItemProps\n /** Whether sidebar is expanded (shows labels) */\n expanded?: boolean\n /** Override active state directly */\n active?: boolean\n /** Current route path (pass from parent using useRoute().path) */\n currentPath?: string\n }>(),\n {\n expanded: true,\n active: undefined,\n currentPath: undefined,\n },\n)\n\nconst isRouteActive = computed(() => {\n // If active prop is explicitly set, use it\n if (props.active !== undefined) {\n return props.active\n }\n\n // Use currentPath prop if provided, otherwise fall back to window.location\n const path = props.currentPath ?? (typeof window !== 'undefined' ? window.location.pathname : '/')\n\n if (props.menuItem.link === '/') {\n return path === '/'\n }\n return path === props.menuItem.link || path.startsWith(props.menuItem.link + '/')\n})\n\n// Try to resolve RouterLink, fallback to 'a' tag\nconst linkComponent = computed(() => {\n try {\n const RouterLink = resolveComponent('RouterLink')\n if (typeof RouterLink !== 'string') {\n return RouterLink\n }\n } catch {\n // RouterLink not available\n }\n return 'a'\n})\n\nconst linkProps = computed(() => {\n if (linkComponent.value === 'a') {\n return { href: props.menuItem.link }\n }\n return { to: props.menuItem.link }\n})\n</script>\n\n<template>\n <component\n :is=\"linkComponent\"\n v-bind=\"linkProps\"\n :class=\"expanded ? 'flex-row' : 'flex-col'\"\n class=\"group relative flex items-center justify-center gap-2 px-5\"\n >\n <div class=\"relative\">\n <Icon\n :class=\"[\n isRouteActive\n ? 'text-white'\n : 'text-white/50 group-hover:text-white/80 dark:text-gray-700 dark:group-hover:text-gray-500',\n expanded ? 'size-6' : 'size-8',\n ]\"\n class=\"transition-all duration-300\"\n :icon=\"menuItem.icon\"\n />\n\n <span\n v-if=\"menuItem.notification\"\n class=\"absolute top-0.25 right-0.25 size-1.5 rounded-full bg-red-600\"\n ></span>\n </div>\n\n <Transition\n enter-active-class=\"transition-all duration-300 ease-out\"\n enter-from-class=\"opacity-0 -translate-x-2\"\n enter-to-class=\"opacity-100 translate-x-0\"\n leave-active-class=\"transition-all duration-200 ease-in\"\n leave-from-class=\"opacity-100 translate-x-0\"\n leave-to-class=\"opacity-0 -translate-x-2\"\n >\n <span\n v-if=\"expanded\"\n :class=\"\n isRouteActive\n ? 'text-white'\n : 'text-white/50 group-hover:text-white/80 dark:text-gray-700 dark:group-hover:text-gray-500'\n \"\n class=\"text-sm font-semibold whitespace-nowrap\"\n >{{ menuItem.label }}</span\n >\n </Transition>\n </component>\n</template>\n","<script lang=\"ts\" setup>\nimport { ref, computed } from 'vue'\nimport { Icon } from '@iconify/vue'\nimport { useDropdown } from '@/composables/useDropdown'\n\nexport interface DropdownItem {\n key: string\n label: string\n icon?: string\n disabled?: boolean\n danger?: boolean\n divider?: boolean\n}\n\nconst props = withDefaults(\n defineProps<{\n /** Dropdown items (optional if using default slot) */\n items?: DropdownItem[]\n /** Align dropdown */\n align?: 'left' | 'right'\n /** Dropdown width */\n width?: 'auto' | 'full' | 'sm' | 'md' | 'lg'\n /** Use teleport to body to avoid overflow clipping */\n teleport?: boolean\n }>(),\n {\n items: () => [],\n align: 'left',\n width: 'auto',\n teleport: true,\n },\n)\n\nconst emit = defineEmits<{\n select: [item: DropdownItem]\n}>()\n\nconst triggerRef = ref<HTMLElement>()\nconst menuRef = ref<HTMLElement>()\n\nconst { isOpen, dropdownStyle, toggle, close } = useDropdown(triggerRef, menuRef, {\n teleport: props.teleport,\n align: props.align,\n})\n\nconst selectItem = (item: DropdownItem) => {\n if (item.disabled || item.divider) return\n emit('select', item)\n close()\n}\n\nconst widthClasses = {\n auto: 'w-auto min-w-[10rem]',\n full: 'w-full',\n sm: 'w-32',\n md: 'w-48',\n lg: 'w-64',\n}\n\nconst computedDropdownStyle = computed(() => {\n if (!props.teleport) return {}\n const { width: _, ...rest } = dropdownStyle.value\n return rest\n})\n</script>\n\n<template>\n <div class=\"relative inline-block\">\n <div ref=\"triggerRef\" @click=\"toggle\">\n <slot name=\"trigger\">\n <button\n type=\"button\"\n class=\"inline-flex items-center gap-2 rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700\"\n >\n <slot name=\"trigger-label\">Options</slot>\n <Icon\n icon=\"lucide:chevron-down\"\n :class=\"['size-4 transition-transform', isOpen && 'rotate-180']\"\n />\n </button>\n </slot>\n </div>\n\n <Teleport to=\"body\" :disabled=\"!teleport\">\n <Transition\n enter-active-class=\"transition ease-out duration-100\"\n enter-from-class=\"transform opacity-0 scale-95\"\n enter-to-class=\"transform opacity-100 scale-100\"\n leave-active-class=\"transition ease-in duration-75\"\n leave-from-class=\"transform opacity-100 scale-100\"\n leave-to-class=\"transform opacity-0 scale-95\"\n >\n <div\n v-if=\"isOpen\"\n ref=\"menuRef\"\n :style=\"computedDropdownStyle\"\n :class=\"[\n 'z-[9999] rounded-lg border border-gray-200 bg-white py-1 shadow-lg dark:border-gray-700 dark:bg-gray-800',\n widthClasses[width],\n !teleport && (align === 'right' ? 'absolute mt-2 right-0' : 'absolute mt-2 left-0'),\n ]\"\n >\n <!-- Custom content via default slot -->\n <slot :close=\"close\">\n <!-- Default items rendering -->\n <template v-for=\"item in items\" :key=\"item.key\">\n <div\n v-if=\"item.divider\"\n class=\"my-1 border-t border-gray-200 dark:border-gray-700\"\n />\n <button\n v-else\n type=\"button\"\n :disabled=\"item.disabled\"\n :class=\"[\n 'flex w-full items-center gap-2 px-4 py-2 text-left text-sm transition-colors',\n item.disabled\n ? 'cursor-not-allowed opacity-50'\n : item.danger\n ? 'text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-900/20'\n : 'text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-700',\n ]\"\n @click=\"selectItem(item)\"\n >\n <Icon v-if=\"item.icon\" :icon=\"item.icon\" class=\"size-4\" />\n {{ item.label }}\n </button>\n </template>\n </slot>\n </div>\n </Transition>\n </Teleport>\n </div>\n</template>\n"],"names":["_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_createElementVNode","_hoisted_1","_createVNode","_unref","_normalizeClass","_createElementBlock","_hoisted_2","_Transition","_toDisplayString","_renderSlot","_Teleport","_Fragment","_renderList"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
const vue = require("vue");
|
|
3
3
|
const vue$1 = require("@iconify/vue");
|
|
4
|
+
const useDropdown = require("./useDropdown-DHFnd259.cjs");
|
|
4
5
|
const _hoisted_1$1 = { class: "relative" };
|
|
5
6
|
const _hoisted_2$1 = {
|
|
6
7
|
key: 0,
|
|
@@ -82,15 +83,16 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
|
|
|
82
83
|
};
|
|
83
84
|
}
|
|
84
85
|
});
|
|
85
|
-
const _hoisted_1 = {
|
|
86
|
+
const _hoisted_1 = { class: "relative inline-block" };
|
|
87
|
+
const _hoisted_2 = {
|
|
86
88
|
type: "button",
|
|
87
89
|
class: "inline-flex items-center gap-2 rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700"
|
|
88
90
|
};
|
|
89
|
-
const
|
|
91
|
+
const _hoisted_3 = {
|
|
90
92
|
key: 0,
|
|
91
93
|
class: "my-1 border-t border-gray-200 dark:border-gray-700"
|
|
92
94
|
};
|
|
93
|
-
const
|
|
95
|
+
const _hoisted_4 = ["disabled", "onClick"];
|
|
94
96
|
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
95
97
|
__name: "Dropdown",
|
|
96
98
|
props: {
|
|
@@ -103,60 +105,17 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
103
105
|
setup(__props, { emit: __emit }) {
|
|
104
106
|
const props = __props;
|
|
105
107
|
const emit = __emit;
|
|
106
|
-
const isOpen = vue.ref(false);
|
|
107
|
-
const dropdownRef = vue.ref();
|
|
108
108
|
const triggerRef = vue.ref();
|
|
109
109
|
const menuRef = vue.ref();
|
|
110
|
-
const
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
dropdownPosition.value = {
|
|
115
|
-
top: rect.bottom + window.scrollY + 8,
|
|
116
|
-
left: rect.left + window.scrollX,
|
|
117
|
-
right: window.innerWidth - rect.right - window.scrollX,
|
|
118
|
-
width: rect.width
|
|
119
|
-
};
|
|
120
|
-
};
|
|
121
|
-
const toggle = () => {
|
|
122
|
-
isOpen.value = !isOpen.value;
|
|
123
|
-
if (isOpen.value) {
|
|
124
|
-
vue.nextTick(updatePosition);
|
|
125
|
-
}
|
|
126
|
-
};
|
|
127
|
-
const close = () => {
|
|
128
|
-
isOpen.value = false;
|
|
129
|
-
};
|
|
110
|
+
const { isOpen, dropdownStyle, toggle, close } = useDropdown.useDropdown(triggerRef, menuRef, {
|
|
111
|
+
teleport: props.teleport,
|
|
112
|
+
align: props.align
|
|
113
|
+
});
|
|
130
114
|
const selectItem = (item) => {
|
|
131
115
|
if (item.disabled || item.divider) return;
|
|
132
116
|
emit("select", item);
|
|
133
117
|
close();
|
|
134
118
|
};
|
|
135
|
-
const handleClickOutside = (event) => {
|
|
136
|
-
var _a, _b;
|
|
137
|
-
const target = event.target;
|
|
138
|
-
const isInsideTrigger = (_a = triggerRef.value) == null ? void 0 : _a.contains(target);
|
|
139
|
-
const isInsideMenu = (_b = menuRef.value) == null ? void 0 : _b.contains(target);
|
|
140
|
-
if (!isInsideTrigger && !isInsideMenu) {
|
|
141
|
-
close();
|
|
142
|
-
}
|
|
143
|
-
};
|
|
144
|
-
vue.watch(isOpen, (newValue) => {
|
|
145
|
-
if (newValue) {
|
|
146
|
-
document.addEventListener("click", handleClickOutside);
|
|
147
|
-
window.addEventListener("scroll", updatePosition, true);
|
|
148
|
-
window.addEventListener("resize", updatePosition);
|
|
149
|
-
} else {
|
|
150
|
-
document.removeEventListener("click", handleClickOutside);
|
|
151
|
-
window.removeEventListener("scroll", updatePosition, true);
|
|
152
|
-
window.removeEventListener("resize", updatePosition);
|
|
153
|
-
}
|
|
154
|
-
});
|
|
155
|
-
vue.onUnmounted(() => {
|
|
156
|
-
document.removeEventListener("click", handleClickOutside);
|
|
157
|
-
window.removeEventListener("scroll", updatePosition, true);
|
|
158
|
-
window.removeEventListener("resize", updatePosition);
|
|
159
|
-
});
|
|
160
119
|
const widthClasses = {
|
|
161
120
|
auto: "w-auto min-w-[10rem]",
|
|
162
121
|
full: "w-full",
|
|
@@ -164,34 +123,27 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
164
123
|
md: "w-48",
|
|
165
124
|
lg: "w-64"
|
|
166
125
|
};
|
|
167
|
-
const
|
|
126
|
+
const computedDropdownStyle = vue.computed(() => {
|
|
168
127
|
if (!props.teleport) return {};
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
top: `${dropdownPosition.value.top}px`,
|
|
172
|
-
left: props.align === "right" ? "auto" : `${dropdownPosition.value.left}px`,
|
|
173
|
-
right: props.align === "right" ? `${dropdownPosition.value.right}px` : "auto"
|
|
174
|
-
};
|
|
128
|
+
const { width: _, ...rest } = dropdownStyle.value;
|
|
129
|
+
return rest;
|
|
175
130
|
});
|
|
176
131
|
return (_ctx, _cache) => {
|
|
177
|
-
return vue.openBlock(), vue.createElementBlock("div",
|
|
178
|
-
ref_key: "dropdownRef",
|
|
179
|
-
ref: dropdownRef,
|
|
180
|
-
class: "relative inline-block"
|
|
181
|
-
}, [
|
|
132
|
+
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
|
|
182
133
|
vue.createElementVNode("div", {
|
|
183
134
|
ref_key: "triggerRef",
|
|
184
135
|
ref: triggerRef,
|
|
185
|
-
onClick:
|
|
136
|
+
onClick: _cache[0] || (_cache[0] = //@ts-ignore
|
|
137
|
+
(...args) => vue.unref(toggle) && vue.unref(toggle)(...args))
|
|
186
138
|
}, [
|
|
187
139
|
vue.renderSlot(_ctx.$slots, "trigger", {}, () => [
|
|
188
|
-
vue.createElementVNode("button",
|
|
140
|
+
vue.createElementVNode("button", _hoisted_2, [
|
|
189
141
|
vue.renderSlot(_ctx.$slots, "trigger-label", {}, () => [
|
|
190
|
-
_cache[
|
|
142
|
+
_cache[1] || (_cache[1] = vue.createTextVNode("Options", -1))
|
|
191
143
|
]),
|
|
192
144
|
vue.createVNode(vue.unref(vue$1.Icon), {
|
|
193
145
|
icon: "lucide:chevron-down",
|
|
194
|
-
class: vue.normalizeClass(["size-4 transition-transform", isOpen
|
|
146
|
+
class: vue.normalizeClass(["size-4 transition-transform", vue.unref(isOpen) && "rotate-180"])
|
|
195
147
|
}, null, 8, ["class"])
|
|
196
148
|
])
|
|
197
149
|
])
|
|
@@ -209,23 +161,23 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
209
161
|
"leave-to-class": "transform opacity-0 scale-95"
|
|
210
162
|
}, {
|
|
211
163
|
default: vue.withCtx(() => [
|
|
212
|
-
isOpen
|
|
164
|
+
vue.unref(isOpen) ? (vue.openBlock(), vue.createElementBlock("div", {
|
|
213
165
|
key: 0,
|
|
214
166
|
ref_key: "menuRef",
|
|
215
167
|
ref: menuRef,
|
|
216
|
-
style: vue.normalizeStyle(
|
|
168
|
+
style: vue.normalizeStyle(computedDropdownStyle.value),
|
|
217
169
|
class: vue.normalizeClass([
|
|
218
170
|
"z-[9999] rounded-lg border border-gray-200 bg-white py-1 shadow-lg dark:border-gray-700 dark:bg-gray-800",
|
|
219
171
|
widthClasses[__props.width],
|
|
220
172
|
!__props.teleport && (__props.align === "right" ? "absolute mt-2 right-0" : "absolute mt-2 left-0")
|
|
221
173
|
])
|
|
222
174
|
}, [
|
|
223
|
-
vue.renderSlot(_ctx.$slots, "default", { close }, () => [
|
|
175
|
+
vue.renderSlot(_ctx.$slots, "default", { close: vue.unref(close) }, () => [
|
|
224
176
|
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.items, (item) => {
|
|
225
177
|
return vue.openBlock(), vue.createElementBlock(vue.Fragment, {
|
|
226
178
|
key: item.key
|
|
227
179
|
}, [
|
|
228
|
-
item.divider ? (vue.openBlock(), vue.createElementBlock("div",
|
|
180
|
+
item.divider ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3)) : (vue.openBlock(), vue.createElementBlock("button", {
|
|
229
181
|
key: 1,
|
|
230
182
|
type: "button",
|
|
231
183
|
disabled: item.disabled,
|
|
@@ -241,7 +193,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
241
193
|
class: "size-4"
|
|
242
194
|
}, null, 8, ["icon"])) : vue.createCommentVNode("", true),
|
|
243
195
|
vue.createTextVNode(" " + vue.toDisplayString(item.label), 1)
|
|
244
|
-
], 10,
|
|
196
|
+
], 10, _hoisted_4))
|
|
245
197
|
], 64);
|
|
246
198
|
}), 128))
|
|
247
199
|
])
|
|
@@ -250,10 +202,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
250
202
|
_: 3
|
|
251
203
|
})
|
|
252
204
|
], 8, ["disabled"]))
|
|
253
|
-
]
|
|
205
|
+
]);
|
|
254
206
|
};
|
|
255
207
|
}
|
|
256
208
|
});
|
|
257
209
|
exports._sfc_main = _sfc_main$1;
|
|
258
210
|
exports._sfc_main$1 = _sfc_main;
|
|
259
|
-
//# sourceMappingURL=Dropdown.vue_vue_type_script_setup_true_lang-
|
|
211
|
+
//# sourceMappingURL=Dropdown.vue_vue_type_script_setup_true_lang-nMP2OxXp.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dropdown.vue_vue_type_script_setup_true_lang-nMP2OxXp.cjs","sources":["../src/components/core/MenuItem.vue","../src/components/core/Dropdown.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, resolveComponent } from 'vue'\nimport { Icon } from '@iconify/vue'\nimport type { MenuItemProps } from '@/types'\n\nconst props = withDefaults(\n defineProps<{\n menuItem: MenuItemProps\n /** Whether sidebar is expanded (shows labels) */\n expanded?: boolean\n /** Override active state directly */\n active?: boolean\n /** Current route path (pass from parent using useRoute().path) */\n currentPath?: string\n }>(),\n {\n expanded: true,\n active: undefined,\n currentPath: undefined,\n },\n)\n\nconst isRouteActive = computed(() => {\n // If active prop is explicitly set, use it\n if (props.active !== undefined) {\n return props.active\n }\n\n // Use currentPath prop if provided, otherwise fall back to window.location\n const path = props.currentPath ?? (typeof window !== 'undefined' ? window.location.pathname : '/')\n\n if (props.menuItem.link === '/') {\n return path === '/'\n }\n return path === props.menuItem.link || path.startsWith(props.menuItem.link + '/')\n})\n\n// Try to resolve RouterLink, fallback to 'a' tag\nconst linkComponent = computed(() => {\n try {\n const RouterLink = resolveComponent('RouterLink')\n if (typeof RouterLink !== 'string') {\n return RouterLink\n }\n } catch {\n // RouterLink not available\n }\n return 'a'\n})\n\nconst linkProps = computed(() => {\n if (linkComponent.value === 'a') {\n return { href: props.menuItem.link }\n }\n return { to: props.menuItem.link }\n})\n</script>\n\n<template>\n <component\n :is=\"linkComponent\"\n v-bind=\"linkProps\"\n :class=\"expanded ? 'flex-row' : 'flex-col'\"\n class=\"group relative flex items-center justify-center gap-2 px-5\"\n >\n <div class=\"relative\">\n <Icon\n :class=\"[\n isRouteActive\n ? 'text-white'\n : 'text-white/50 group-hover:text-white/80 dark:text-gray-700 dark:group-hover:text-gray-500',\n expanded ? 'size-6' : 'size-8',\n ]\"\n class=\"transition-all duration-300\"\n :icon=\"menuItem.icon\"\n />\n\n <span\n v-if=\"menuItem.notification\"\n class=\"absolute top-0.25 right-0.25 size-1.5 rounded-full bg-red-600\"\n ></span>\n </div>\n\n <Transition\n enter-active-class=\"transition-all duration-300 ease-out\"\n enter-from-class=\"opacity-0 -translate-x-2\"\n enter-to-class=\"opacity-100 translate-x-0\"\n leave-active-class=\"transition-all duration-200 ease-in\"\n leave-from-class=\"opacity-100 translate-x-0\"\n leave-to-class=\"opacity-0 -translate-x-2\"\n >\n <span\n v-if=\"expanded\"\n :class=\"\n isRouteActive\n ? 'text-white'\n : 'text-white/50 group-hover:text-white/80 dark:text-gray-700 dark:group-hover:text-gray-500'\n \"\n class=\"text-sm font-semibold whitespace-nowrap\"\n >{{ menuItem.label }}</span\n >\n </Transition>\n </component>\n</template>\n","<script lang=\"ts\" setup>\nimport { ref, computed } from 'vue'\nimport { Icon } from '@iconify/vue'\nimport { useDropdown } from '@/composables/useDropdown'\n\nexport interface DropdownItem {\n key: string\n label: string\n icon?: string\n disabled?: boolean\n danger?: boolean\n divider?: boolean\n}\n\nconst props = withDefaults(\n defineProps<{\n /** Dropdown items (optional if using default slot) */\n items?: DropdownItem[]\n /** Align dropdown */\n align?: 'left' | 'right'\n /** Dropdown width */\n width?: 'auto' | 'full' | 'sm' | 'md' | 'lg'\n /** Use teleport to body to avoid overflow clipping */\n teleport?: boolean\n }>(),\n {\n items: () => [],\n align: 'left',\n width: 'auto',\n teleport: true,\n },\n)\n\nconst emit = defineEmits<{\n select: [item: DropdownItem]\n}>()\n\nconst triggerRef = ref<HTMLElement>()\nconst menuRef = ref<HTMLElement>()\n\nconst { isOpen, dropdownStyle, toggle, close } = useDropdown(triggerRef, menuRef, {\n teleport: props.teleport,\n align: props.align,\n})\n\nconst selectItem = (item: DropdownItem) => {\n if (item.disabled || item.divider) return\n emit('select', item)\n close()\n}\n\nconst widthClasses = {\n auto: 'w-auto min-w-[10rem]',\n full: 'w-full',\n sm: 'w-32',\n md: 'w-48',\n lg: 'w-64',\n}\n\nconst computedDropdownStyle = computed(() => {\n if (!props.teleport) return {}\n const { width: _, ...rest } = dropdownStyle.value\n return rest\n})\n</script>\n\n<template>\n <div class=\"relative inline-block\">\n <div ref=\"triggerRef\" @click=\"toggle\">\n <slot name=\"trigger\">\n <button\n type=\"button\"\n class=\"inline-flex items-center gap-2 rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700\"\n >\n <slot name=\"trigger-label\">Options</slot>\n <Icon\n icon=\"lucide:chevron-down\"\n :class=\"['size-4 transition-transform', isOpen && 'rotate-180']\"\n />\n </button>\n </slot>\n </div>\n\n <Teleport to=\"body\" :disabled=\"!teleport\">\n <Transition\n enter-active-class=\"transition ease-out duration-100\"\n enter-from-class=\"transform opacity-0 scale-95\"\n enter-to-class=\"transform opacity-100 scale-100\"\n leave-active-class=\"transition ease-in duration-75\"\n leave-from-class=\"transform opacity-100 scale-100\"\n leave-to-class=\"transform opacity-0 scale-95\"\n >\n <div\n v-if=\"isOpen\"\n ref=\"menuRef\"\n :style=\"computedDropdownStyle\"\n :class=\"[\n 'z-[9999] rounded-lg border border-gray-200 bg-white py-1 shadow-lg dark:border-gray-700 dark:bg-gray-800',\n widthClasses[width],\n !teleport && (align === 'right' ? 'absolute mt-2 right-0' : 'absolute mt-2 left-0'),\n ]\"\n >\n <!-- Custom content via default slot -->\n <slot :close=\"close\">\n <!-- Default items rendering -->\n <template v-for=\"item in items\" :key=\"item.key\">\n <div\n v-if=\"item.divider\"\n class=\"my-1 border-t border-gray-200 dark:border-gray-700\"\n />\n <button\n v-else\n type=\"button\"\n :disabled=\"item.disabled\"\n :class=\"[\n 'flex w-full items-center gap-2 px-4 py-2 text-left text-sm transition-colors',\n item.disabled\n ? 'cursor-not-allowed opacity-50'\n : item.danger\n ? 'text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-900/20'\n : 'text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-gray-700',\n ]\"\n @click=\"selectItem(item)\"\n >\n <Icon v-if=\"item.icon\" :icon=\"item.icon\" class=\"size-4\" />\n {{ item.label }}\n </button>\n </template>\n </slot>\n </div>\n </Transition>\n </Teleport>\n </div>\n</template>\n"],"names":["computed","resolveComponent","_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_createElementVNode","_hoisted_1","_createVNode","_unref","Icon","_normalizeClass","_createElementBlock","_hoisted_2","_Transition","_toDisplayString","ref","useDropdown","_renderSlot","_Teleport","_Fragment","_renderList"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
const vue = require("vue");
|
|
3
3
|
const vue$1 = require("@iconify/vue");
|
|
4
|
-
const Dropdown_vue_vue_type_script_setup_true_lang = require("./Dropdown.vue_vue_type_script_setup_true_lang-
|
|
4
|
+
const Dropdown_vue_vue_type_script_setup_true_lang = require("./Dropdown.vue_vue_type_script_setup_true_lang-nMP2OxXp.cjs");
|
|
5
5
|
const _hoisted_1$1 = { class: "font-inter relative flex h-dvh bg-gray-100 dark:bg-slate-900" };
|
|
6
6
|
const _hoisted_2$1 = { class: "flex h-16 items-center px-3" };
|
|
7
7
|
const _hoisted_3$1 = { class: "flex flex-1 items-center justify-center gap-3" };
|
|
@@ -330,4 +330,4 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
330
330
|
});
|
|
331
331
|
exports._sfc_main = _sfc_main$1;
|
|
332
332
|
exports._sfc_main$1 = _sfc_main;
|
|
333
|
-
//# sourceMappingURL=PageLayout.vue_vue_type_script_setup_true_lang-
|
|
333
|
+
//# sourceMappingURL=PageLayout.vue_vue_type_script_setup_true_lang-Bnw5L-xO.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageLayout.vue_vue_type_script_setup_true_lang-DoawksKc.cjs","sources":["../src/components/layout/BaseLayout.vue","../src/components/layout/PageLayout.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ref, computed, resolveComponent } from 'vue'\nimport { Icon } from '@iconify/vue'\nimport MenuItem from '@/components/core/MenuItem.vue'\nimport Dropdown from '@/components/core/Dropdown.vue'\nimport type { MenuItemProps } from '@/types'\n\nexport interface UserMenuItem {\n label: string\n icon?: string\n link?: string\n action?: () => void\n}\n\nconst props = withDefaults(\n defineProps<{\n /** Menu items for the sidebar */\n menuItems?: MenuItemProps[]\n /** App/brand name displayed in sidebar */\n appName?: string\n /** App icon (iconify icon name) */\n appIcon?: string\n /** Whether sidebar is open (v-model:sidebarOpen) */\n sidebarOpen?: boolean\n /** Whether dark mode is enabled (v-model:dark) */\n dark?: boolean\n /** Show dark mode toggle in header */\n showDarkToggle?: boolean\n /** Primary color class for sidebar background */\n sidebarClass?: string\n /** Current route path for menu active state (pass useRoute().path) */\n currentPath?: string\n /** User display name */\n userName?: string\n /** User avatar (initials or image URL) */\n userAvatar?: string\n /** User menu items (dropdown) */\n userMenuItems?: UserMenuItem[]\n }>(),\n {\n menuItems: () => [],\n appName: 'App',\n appIcon: 'lucide:box',\n sidebarOpen: true,\n dark: false,\n showDarkToggle: true,\n sidebarClass: 'bg-[#172b4c] dark:bg-slate-950',\n currentPath: undefined,\n userName: undefined,\n userAvatar: undefined,\n userMenuItems: () => [],\n },\n)\n\nconst emit = defineEmits<{\n 'update:sidebarOpen': [value: boolean]\n 'update:dark': [value: boolean]\n}>()\n\nconst internalSidebarOpen = ref(props.sidebarOpen)\nconst internalDark = ref(props.dark)\n\nconst sidebarOpenModel = computed({\n get: () => props.sidebarOpen ?? internalSidebarOpen.value,\n set: (value: boolean) => {\n internalSidebarOpen.value = value\n emit('update:sidebarOpen', value)\n },\n})\n\nconst darkModel = computed({\n get: () => props.dark ?? internalDark.value,\n set: (value: boolean) => {\n internalDark.value = value\n emit('update:dark', value)\n },\n})\n\nconst toggleSidebar = () => {\n sidebarOpenModel.value = !sidebarOpenModel.value\n}\n\nconst toggleDark = () => {\n darkModel.value = !darkModel.value\n}\n\n// Try to resolve RouterView\nconst routerViewComponent = computed(() => {\n try {\n const RouterView = resolveComponent('RouterView')\n if (typeof RouterView !== 'string') {\n return RouterView\n }\n } catch {\n // RouterView not available\n }\n return null\n})\n\n// Try to resolve RouterLink\nconst routerLinkComponent = computed(() => {\n try {\n const RouterLink = resolveComponent('RouterLink')\n if (typeof RouterLink !== 'string') {\n return RouterLink\n }\n } catch {\n // RouterLink not available\n }\n return 'a'\n})\n\nconst getLinkProps = (link: string) => {\n if (routerLinkComponent.value === 'a') {\n return { href: link }\n }\n return { to: link }\n}\n\nconst handleUserMenuClick = (item: UserMenuItem) => {\n if (item.action) {\n item.action()\n }\n}\n</script>\n\n<template>\n <div class=\"font-inter relative flex h-dvh bg-gray-100 dark:bg-slate-900\">\n <!-- Backdrop for mobile -->\n <div\n v-if=\"sidebarOpenModel\"\n class=\"absolute z-40 h-full w-full bg-slate-950/20 lg:hidden dark:bg-white/20\"\n @click=\"sidebarOpenModel = false\"\n ></div>\n\n <!-- Sidebar -->\n <aside\n :class=\"[\n sidebarOpenModel ? 'lg:w-60' : '-translate-x-76 lg:w-16 lg:translate-x-0',\n sidebarClass,\n ]\"\n class=\"@container absolute z-50 flex h-full w-76 flex-col justify-between gap-10 transition-all duration-1000 ease-in-out lg:relative\"\n >\n <!-- Sidebar Header -->\n <div class=\"flex h-16 items-center px-3\">\n <div class=\"flex flex-1 items-center justify-center gap-3\">\n <slot name=\"logo\">\n <div\n class=\"bg-primary text-primary-foreground flex size-8 items-center justify-center rounded-lg bg-white/20\"\n >\n <Icon class=\"size-5 text-white\" :icon=\"appIcon\" />\n </div>\n <span\n :class=\"sidebarOpenModel ? 'block' : 'hidden'\"\n class=\"font-outfit flex-1 text-lg font-semibold text-white\"\n >\n {{ appName }}\n </span>\n </slot>\n </div>\n\n <button\n class=\"rounded-lg bg-white/10 p-1 transition hover:bg-white/20 lg:hidden\"\n @click=\"toggleSidebar\"\n >\n <Icon class=\"size-6 text-white\" icon=\"lucide:menu\" />\n </button>\n </div>\n\n <!-- Menu Items -->\n <div\n :class=\"sidebarOpenModel ? 'items-start' : 'items-center'\"\n class=\"flex flex-1 flex-col gap-8 px-2 lg:justify-center\"\n >\n <slot name=\"menu\" :current-path=\"currentPath\">\n <MenuItem\n v-for=\"(item, index) in menuItems\"\n :key=\"index\"\n :menu-item=\"item\"\n :expanded=\"sidebarOpenModel\"\n :current-path=\"currentPath\"\n />\n </slot>\n </div>\n\n <!-- Sidebar Footer -->\n <div class=\"flex flex-col gap-3 px-3 pb-3\">\n <slot name=\"sidebar-footer\" />\n </div>\n </aside>\n\n <!-- Main Content Area -->\n <div class=\"flex flex-1 flex-col\">\n <!-- Header -->\n <header\n class=\"flex h-16 items-center justify-between border-b border-slate-200 bg-white px-4 dark:border-slate-800 dark:bg-slate-950\"\n >\n <div>\n <button\n class=\"rounded-lg bg-gray-100 p-1 transition hover:bg-gray-200 dark:bg-gray-900 dark:hover:bg-gray-800\"\n @click=\"toggleSidebar\"\n >\n <Icon\n class=\"size-6 text-gray-900 hover:text-gray-800 dark:text-gray-100\"\n icon=\"lucide:menu\"\n />\n </button>\n </div>\n\n <div class=\"flex-1\">\n <slot name=\"header-center\" />\n </div>\n\n <div class=\"flex items-center gap-3\">\n <slot name=\"header-actions\" />\n\n <button\n v-if=\"showDarkToggle\"\n class=\"flex items-center justify-center rounded-lg bg-gray-100 p-2 transition hover:bg-gray-200 dark:bg-gray-900 dark:hover:bg-gray-800\"\n @click=\"toggleDark\"\n >\n <Icon\n :icon=\"darkModel ? 'lucide:sun' : 'lucide:moon'\"\n class=\"size-5 text-gray-900 dark:text-gray-100\"\n />\n </button>\n\n <!-- User Menu -->\n <Dropdown v-if=\"userName || userAvatar\" align=\"right\">\n <template #trigger>\n <button\n class=\"flex items-center gap-2 rounded-lg p-1.5 transition hover:bg-gray-100 dark:hover:bg-gray-800\"\n >\n <div\n class=\"flex size-8 items-center justify-center rounded-full bg-primary text-sm font-medium text-white\"\n >\n {{ userAvatar || '?' }}\n </div>\n <span class=\"hidden text-sm font-medium text-gray-700 dark:text-gray-300 md:block\">\n {{ userName }}\n </span>\n <Icon icon=\"lucide:chevron-down\" class=\"size-4 text-gray-500\" />\n </button>\n </template>\n\n <template #default=\"{ close }\">\n <div class=\"min-w-48 py-1\">\n <component\n :is=\"item.link ? routerLinkComponent : 'button'\"\n v-for=\"item in userMenuItems\"\n :key=\"item.label\"\n v-bind=\"item.link ? getLinkProps(item.link) : {}\"\n class=\"flex w-full items-center gap-2 px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-800\"\n @click=\"handleUserMenuClick(item); close()\"\n >\n <Icon v-if=\"item.icon\" :icon=\"item.icon\" class=\"size-4\" />\n {{ item.label }}\n </component>\n </div>\n </template>\n </Dropdown>\n </div>\n </header>\n\n <!-- Page Content -->\n <div class=\"flex flex-1 flex-col overflow-y-auto\">\n <main class=\"container mx-auto flex flex-1 flex-col gap-5 p-5\">\n <slot>\n <component :is=\"routerViewComponent\" v-if=\"routerViewComponent\" />\n </slot>\n </main>\n </div>\n </div>\n </div>\n</template>\n","<script lang=\"ts\" setup>\nimport { computed, resolveComponent } from 'vue'\n\nexport interface Breadcrumb {\n label: string\n link: string\n}\n\ndefineProps<{\n /** Page title */\n title?: string\n /** Page description */\n description?: string\n /** Breadcrumb navigation items */\n breadcrumbs?: Breadcrumb[]\n}>()\n\n// Try to resolve RouterLink\nconst linkComponent = computed(() => {\n try {\n const RouterLink = resolveComponent('RouterLink')\n if (typeof RouterLink !== 'string') {\n return RouterLink\n }\n } catch {\n // RouterLink not available\n }\n return 'a'\n})\n\nconst getLinkProps = (link: string) => {\n if (linkComponent.value === 'a') {\n return { href: link }\n }\n return { to: link }\n}\n</script>\n\n<template>\n <div class=\"flex flex-col gap-4\">\n <!-- Breadcrumbs -->\n <nav v-if=\"breadcrumbs && breadcrumbs.length > 0\" aria-label=\"Breadcrumb\">\n <ol class=\"flex items-center\">\n <li\n v-for=\"(breadcrumb, index) in breadcrumbs\"\n :key=\"index\"\n class=\"flex items-center\"\n >\n <span\n v-if=\"index > 0\"\n class=\"mx-3 text-sm font-semibold text-gray-400 dark:text-gray-600\"\n >\n /\n </span>\n\n <slot name=\"breadcrumb\" :breadcrumb=\"breadcrumb\" :index=\"index\" :isLast=\"index === breadcrumbs.length - 1\">\n <component\n :is=\"linkComponent\"\n v-bind=\"getLinkProps(breadcrumb.link)\"\n :class=\"[\n 'text-sm transition-colors',\n index < breadcrumbs.length - 1\n ? 'font-semibold text-gray-900 hover:text-primary/90 hover:underline dark:text-gray-100'\n : 'text-gray-400 dark:text-gray-600',\n ]\"\n >\n {{ breadcrumb.label }}\n </component>\n </slot>\n </li>\n </ol>\n </nav>\n\n <!-- Page Header -->\n <div class=\"flex flex-col gap-4 md:flex-row md:items-center md:justify-between\">\n <div class=\"flex flex-col gap-1\">\n <h1\n v-if=\"title\"\n class=\"text-2xl font-bold text-gray-900 dark:text-gray-100\"\n >\n <slot name=\"title\">{{ title }}</slot>\n </h1>\n\n <p\n v-if=\"description\"\n class=\"text-sm text-gray-600 dark:text-gray-400\"\n >\n <slot name=\"description\">{{ description }}</slot>\n </p>\n </div>\n\n <div class=\"flex items-center gap-2\">\n <slot name=\"actions\" />\n </div>\n </div>\n\n <!-- Page Content -->\n <div class=\"flex-1\">\n <slot />\n </div>\n </div>\n</template>\n"],"names":["ref","computed","resolveComponent","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_hoisted_2","_hoisted_3","_renderSlot","_hoisted_4","_createVNode","_unref","Icon","_Fragment","_renderList","_createBlock","MenuItem","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","Dropdown","_hoisted_10","_toDisplayString","_withCtx","_resolveDynamicComponent","_mergeProps","_createTextVNode"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PageLayout.vue_vue_type_script_setup_true_lang-Bnw5L-xO.cjs","sources":["../src/components/layout/BaseLayout.vue","../src/components/layout/PageLayout.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ref, computed, resolveComponent } from 'vue'\nimport { Icon } from '@iconify/vue'\nimport MenuItem from '@/components/core/MenuItem.vue'\nimport Dropdown from '@/components/core/Dropdown.vue'\nimport type { MenuItemProps } from '@/types'\n\nexport interface UserMenuItem {\n label: string\n icon?: string\n link?: string\n action?: () => void\n}\n\nconst props = withDefaults(\n defineProps<{\n /** Menu items for the sidebar */\n menuItems?: MenuItemProps[]\n /** App/brand name displayed in sidebar */\n appName?: string\n /** App icon (iconify icon name) */\n appIcon?: string\n /** Whether sidebar is open (v-model:sidebarOpen) */\n sidebarOpen?: boolean\n /** Whether dark mode is enabled (v-model:dark) */\n dark?: boolean\n /** Show dark mode toggle in header */\n showDarkToggle?: boolean\n /** Primary color class for sidebar background */\n sidebarClass?: string\n /** Current route path for menu active state (pass useRoute().path) */\n currentPath?: string\n /** User display name */\n userName?: string\n /** User avatar (initials or image URL) */\n userAvatar?: string\n /** User menu items (dropdown) */\n userMenuItems?: UserMenuItem[]\n }>(),\n {\n menuItems: () => [],\n appName: 'App',\n appIcon: 'lucide:box',\n sidebarOpen: true,\n dark: false,\n showDarkToggle: true,\n sidebarClass: 'bg-[#172b4c] dark:bg-slate-950',\n currentPath: undefined,\n userName: undefined,\n userAvatar: undefined,\n userMenuItems: () => [],\n },\n)\n\nconst emit = defineEmits<{\n 'update:sidebarOpen': [value: boolean]\n 'update:dark': [value: boolean]\n}>()\n\nconst internalSidebarOpen = ref(props.sidebarOpen)\nconst internalDark = ref(props.dark)\n\nconst sidebarOpenModel = computed({\n get: () => props.sidebarOpen ?? internalSidebarOpen.value,\n set: (value: boolean) => {\n internalSidebarOpen.value = value\n emit('update:sidebarOpen', value)\n },\n})\n\nconst darkModel = computed({\n get: () => props.dark ?? internalDark.value,\n set: (value: boolean) => {\n internalDark.value = value\n emit('update:dark', value)\n },\n})\n\nconst toggleSidebar = () => {\n sidebarOpenModel.value = !sidebarOpenModel.value\n}\n\nconst toggleDark = () => {\n darkModel.value = !darkModel.value\n}\n\n// Try to resolve RouterView\nconst routerViewComponent = computed(() => {\n try {\n const RouterView = resolveComponent('RouterView')\n if (typeof RouterView !== 'string') {\n return RouterView\n }\n } catch {\n // RouterView not available\n }\n return null\n})\n\n// Try to resolve RouterLink\nconst routerLinkComponent = computed(() => {\n try {\n const RouterLink = resolveComponent('RouterLink')\n if (typeof RouterLink !== 'string') {\n return RouterLink\n }\n } catch {\n // RouterLink not available\n }\n return 'a'\n})\n\nconst getLinkProps = (link: string) => {\n if (routerLinkComponent.value === 'a') {\n return { href: link }\n }\n return { to: link }\n}\n\nconst handleUserMenuClick = (item: UserMenuItem) => {\n if (item.action) {\n item.action()\n }\n}\n</script>\n\n<template>\n <div class=\"font-inter relative flex h-dvh bg-gray-100 dark:bg-slate-900\">\n <!-- Backdrop for mobile -->\n <div\n v-if=\"sidebarOpenModel\"\n class=\"absolute z-40 h-full w-full bg-slate-950/20 lg:hidden dark:bg-white/20\"\n @click=\"sidebarOpenModel = false\"\n ></div>\n\n <!-- Sidebar -->\n <aside\n :class=\"[\n sidebarOpenModel ? 'lg:w-60' : '-translate-x-76 lg:w-16 lg:translate-x-0',\n sidebarClass,\n ]\"\n class=\"@container absolute z-50 flex h-full w-76 flex-col justify-between gap-10 transition-all duration-1000 ease-in-out lg:relative\"\n >\n <!-- Sidebar Header -->\n <div class=\"flex h-16 items-center px-3\">\n <div class=\"flex flex-1 items-center justify-center gap-3\">\n <slot name=\"logo\">\n <div\n class=\"bg-primary text-primary-foreground flex size-8 items-center justify-center rounded-lg bg-white/20\"\n >\n <Icon class=\"size-5 text-white\" :icon=\"appIcon\" />\n </div>\n <span\n :class=\"sidebarOpenModel ? 'block' : 'hidden'\"\n class=\"font-outfit flex-1 text-lg font-semibold text-white\"\n >\n {{ appName }}\n </span>\n </slot>\n </div>\n\n <button\n class=\"rounded-lg bg-white/10 p-1 transition hover:bg-white/20 lg:hidden\"\n @click=\"toggleSidebar\"\n >\n <Icon class=\"size-6 text-white\" icon=\"lucide:menu\" />\n </button>\n </div>\n\n <!-- Menu Items -->\n <div\n :class=\"sidebarOpenModel ? 'items-start' : 'items-center'\"\n class=\"flex flex-1 flex-col gap-8 px-2 lg:justify-center\"\n >\n <slot name=\"menu\" :current-path=\"currentPath\">\n <MenuItem\n v-for=\"(item, index) in menuItems\"\n :key=\"index\"\n :menu-item=\"item\"\n :expanded=\"sidebarOpenModel\"\n :current-path=\"currentPath\"\n />\n </slot>\n </div>\n\n <!-- Sidebar Footer -->\n <div class=\"flex flex-col gap-3 px-3 pb-3\">\n <slot name=\"sidebar-footer\" />\n </div>\n </aside>\n\n <!-- Main Content Area -->\n <div class=\"flex flex-1 flex-col\">\n <!-- Header -->\n <header\n class=\"flex h-16 items-center justify-between border-b border-slate-200 bg-white px-4 dark:border-slate-800 dark:bg-slate-950\"\n >\n <div>\n <button\n class=\"rounded-lg bg-gray-100 p-1 transition hover:bg-gray-200 dark:bg-gray-900 dark:hover:bg-gray-800\"\n @click=\"toggleSidebar\"\n >\n <Icon\n class=\"size-6 text-gray-900 hover:text-gray-800 dark:text-gray-100\"\n icon=\"lucide:menu\"\n />\n </button>\n </div>\n\n <div class=\"flex-1\">\n <slot name=\"header-center\" />\n </div>\n\n <div class=\"flex items-center gap-3\">\n <slot name=\"header-actions\" />\n\n <button\n v-if=\"showDarkToggle\"\n class=\"flex items-center justify-center rounded-lg bg-gray-100 p-2 transition hover:bg-gray-200 dark:bg-gray-900 dark:hover:bg-gray-800\"\n @click=\"toggleDark\"\n >\n <Icon\n :icon=\"darkModel ? 'lucide:sun' : 'lucide:moon'\"\n class=\"size-5 text-gray-900 dark:text-gray-100\"\n />\n </button>\n\n <!-- User Menu -->\n <Dropdown v-if=\"userName || userAvatar\" align=\"right\">\n <template #trigger>\n <button\n class=\"flex items-center gap-2 rounded-lg p-1.5 transition hover:bg-gray-100 dark:hover:bg-gray-800\"\n >\n <div\n class=\"flex size-8 items-center justify-center rounded-full bg-primary text-sm font-medium text-white\"\n >\n {{ userAvatar || '?' }}\n </div>\n <span class=\"hidden text-sm font-medium text-gray-700 dark:text-gray-300 md:block\">\n {{ userName }}\n </span>\n <Icon icon=\"lucide:chevron-down\" class=\"size-4 text-gray-500\" />\n </button>\n </template>\n\n <template #default=\"{ close }\">\n <div class=\"min-w-48 py-1\">\n <component\n :is=\"item.link ? routerLinkComponent : 'button'\"\n v-for=\"item in userMenuItems\"\n :key=\"item.label\"\n v-bind=\"item.link ? getLinkProps(item.link) : {}\"\n class=\"flex w-full items-center gap-2 px-4 py-2 text-left text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-800\"\n @click=\"handleUserMenuClick(item); close()\"\n >\n <Icon v-if=\"item.icon\" :icon=\"item.icon\" class=\"size-4\" />\n {{ item.label }}\n </component>\n </div>\n </template>\n </Dropdown>\n </div>\n </header>\n\n <!-- Page Content -->\n <div class=\"flex flex-1 flex-col overflow-y-auto\">\n <main class=\"container mx-auto flex flex-1 flex-col gap-5 p-5\">\n <slot>\n <component :is=\"routerViewComponent\" v-if=\"routerViewComponent\" />\n </slot>\n </main>\n </div>\n </div>\n </div>\n</template>\n","<script lang=\"ts\" setup>\nimport { computed, resolveComponent } from 'vue'\n\nexport interface Breadcrumb {\n label: string\n link: string\n}\n\ndefineProps<{\n /** Page title */\n title?: string\n /** Page description */\n description?: string\n /** Breadcrumb navigation items */\n breadcrumbs?: Breadcrumb[]\n}>()\n\n// Try to resolve RouterLink\nconst linkComponent = computed(() => {\n try {\n const RouterLink = resolveComponent('RouterLink')\n if (typeof RouterLink !== 'string') {\n return RouterLink\n }\n } catch {\n // RouterLink not available\n }\n return 'a'\n})\n\nconst getLinkProps = (link: string) => {\n if (linkComponent.value === 'a') {\n return { href: link }\n }\n return { to: link }\n}\n</script>\n\n<template>\n <div class=\"flex flex-col gap-4\">\n <!-- Breadcrumbs -->\n <nav v-if=\"breadcrumbs && breadcrumbs.length > 0\" aria-label=\"Breadcrumb\">\n <ol class=\"flex items-center\">\n <li\n v-for=\"(breadcrumb, index) in breadcrumbs\"\n :key=\"index\"\n class=\"flex items-center\"\n >\n <span\n v-if=\"index > 0\"\n class=\"mx-3 text-sm font-semibold text-gray-400 dark:text-gray-600\"\n >\n /\n </span>\n\n <slot name=\"breadcrumb\" :breadcrumb=\"breadcrumb\" :index=\"index\" :isLast=\"index === breadcrumbs.length - 1\">\n <component\n :is=\"linkComponent\"\n v-bind=\"getLinkProps(breadcrumb.link)\"\n :class=\"[\n 'text-sm transition-colors',\n index < breadcrumbs.length - 1\n ? 'font-semibold text-gray-900 hover:text-primary/90 hover:underline dark:text-gray-100'\n : 'text-gray-400 dark:text-gray-600',\n ]\"\n >\n {{ breadcrumb.label }}\n </component>\n </slot>\n </li>\n </ol>\n </nav>\n\n <!-- Page Header -->\n <div class=\"flex flex-col gap-4 md:flex-row md:items-center md:justify-between\">\n <div class=\"flex flex-col gap-1\">\n <h1\n v-if=\"title\"\n class=\"text-2xl font-bold text-gray-900 dark:text-gray-100\"\n >\n <slot name=\"title\">{{ title }}</slot>\n </h1>\n\n <p\n v-if=\"description\"\n class=\"text-sm text-gray-600 dark:text-gray-400\"\n >\n <slot name=\"description\">{{ description }}</slot>\n </p>\n </div>\n\n <div class=\"flex items-center gap-2\">\n <slot name=\"actions\" />\n </div>\n </div>\n\n <!-- Page Content -->\n <div class=\"flex-1\">\n <slot />\n </div>\n </div>\n</template>\n"],"names":["ref","computed","resolveComponent","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_hoisted_2","_hoisted_3","_renderSlot","_hoisted_4","_createVNode","_unref","Icon","_Fragment","_renderList","_createBlock","MenuItem","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","Dropdown","_hoisted_10","_toDisplayString","_withCtx","_resolveDynamicComponent","_mergeProps","_createTextVNode"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent, ref, computed, resolveComponent, createElementBlock, openBlock, createCommentVNode, createElementVNode, normalizeClass, renderSlot, createVNode, unref, toDisplayString, Fragment, renderList, createBlock, withCtx, resolveDynamicComponent, mergeProps, createTextVNode } from "vue";
|
|
2
2
|
import { Icon } from "@iconify/vue";
|
|
3
|
-
import { _ as _sfc_main$2, a as _sfc_main$3 } from "./Dropdown.vue_vue_type_script_setup_true_lang-
|
|
3
|
+
import { _ as _sfc_main$2, a as _sfc_main$3 } from "./Dropdown.vue_vue_type_script_setup_true_lang-B9DsCY8M.js";
|
|
4
4
|
const _hoisted_1$1 = { class: "font-inter relative flex h-dvh bg-gray-100 dark:bg-slate-900" };
|
|
5
5
|
const _hoisted_2$1 = { class: "flex h-16 items-center px-3" };
|
|
6
6
|
const _hoisted_3$1 = { class: "flex flex-1 items-center justify-center gap-3" };
|
|
@@ -331,4 +331,4 @@ export {
|
|
|
331
331
|
_sfc_main$1 as _,
|
|
332
332
|
_sfc_main as a
|
|
333
333
|
};
|
|
334
|
-
//# sourceMappingURL=PageLayout.vue_vue_type_script_setup_true_lang-
|
|
334
|
+
//# sourceMappingURL=PageLayout.vue_vue_type_script_setup_true_lang-D8uD3-Fe.js.map
|