@alfakit/vue 0.1.8 → 0.1.9
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/CHANGELOG.md +8 -0
- package/dist/components/actions/ActionModal.js.map +1 -1
- package/dist/components/actions/ActionModal.vue.d.ts.map +1 -1
- package/dist/components/actions/ActionModal.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/components/actions/ActionModal.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/form/FormBlock.js.map +1 -1
- package/dist/components/form/FormBlock.vue.d.ts.map +1 -1
- package/dist/components/form/FormBlock.vue_vue_type_script_setup_true_lang.js +79 -78
- package/dist/components/form/FormBlock.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/panel/BottomNav.js.map +1 -1
- package/dist/components/panel/BottomNav.vue_vue_type_script_setup_true_lang.js +2 -2
- package/dist/components/panel/BottomNav.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/panel/KeyboardShortcuts.js.map +1 -1
- package/dist/components/panel/KeyboardShortcuts.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/components/panel/KeyboardShortcuts.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/panel/NavGroup.js.map +1 -1
- package/dist/components/panel/NavGroup.vue_vue_type_script_setup_true_lang.js +3 -3
- package/dist/components/panel/NavGroup.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/panel/NavItem.js.map +1 -1
- package/dist/components/panel/NavItem.vue.d.ts.map +1 -1
- package/dist/components/panel/NavItem.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/components/panel/NavItem.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/panel/NavSubItem.js.map +1 -1
- package/dist/components/panel/NavSubItem.vue.d.ts.map +1 -1
- package/dist/components/panel/NavSubItem.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/components/panel/NavSubItem.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/ui/TooltipTrigger.js.map +1 -1
- package/dist/components/ui/TooltipTrigger.vue.d.ts +2 -2
- package/dist/components/ui/TooltipTrigger.vue.d.ts.map +1 -1
- package/dist/components/ui/TooltipTrigger.vue_vue_type_script_setup_true_lang.js +10 -7
- package/dist/components/ui/TooltipTrigger.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/eject-manifest.json +2 -2
- package/dist/layouts/TopNavLayout.js.map +1 -1
- package/dist/layouts/TopNavLayout.vue_vue_type_script_setup_true_lang.js +2 -2
- package/dist/layouts/TopNavLayout.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/layouts/TopNavMenu.js.map +1 -1
- package/dist/layouts/TopNavMenu.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/layouts/TopNavMenu.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/standalone/AlfakitComponent.js.map +1 -1
- package/dist/standalone/AlfakitComponent.vue.d.ts.map +1 -1
- package/dist/standalone/AlfakitComponent.vue_vue_type_script_setup_true_lang.js +29 -24
- package/dist/standalone/AlfakitComponent.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/standalone.css +10 -6
- package/dist/starter-kit/AlfakitStarterKitRoot.js.map +1 -1
- package/dist/starter-kit/AlfakitStarterKitRoot.vue.d.ts.map +1 -1
- package/dist/starter-kit/AlfakitStarterKitRoot.vue_vue_type_script_setup_true_lang.js +25 -21
- package/dist/starter-kit/AlfakitStarterKitRoot.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/package.json +2 -2
- package/src/components/actions/ActionModal.vue +2 -0
- package/src/components/form/FormBlock.vue +15 -2
- package/src/components/panel/BottomNav.vue +2 -2
- package/src/components/panel/KeyboardShortcuts.vue +1 -1
- package/src/components/panel/NavGroup.vue +3 -3
- package/src/components/panel/NavItem.vue +5 -1
- package/src/components/panel/NavSubItem.vue +5 -1
- package/src/components/ui/TooltipTrigger.vue +4 -1
- package/src/layouts/TopNavLayout.vue +2 -2
- package/src/layouts/TopNavMenu.vue +1 -1
- package/src/standalone/AlfakitComponent.vue +8 -1
- package/src/starter-kit/AlfakitStarterKitRoot.vue +6 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { type TooltipTriggerProps } from 'reka-ui';
|
|
2
|
-
declare var
|
|
2
|
+
declare var __VLS_5: {};
|
|
3
3
|
type __VLS_Slots = {} & {
|
|
4
|
-
default?: (props: typeof
|
|
4
|
+
default?: (props: typeof __VLS_5) => any;
|
|
5
5
|
};
|
|
6
6
|
declare const __VLS_component: import("vue").DefineComponent<TooltipTriggerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TooltipTriggerProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
7
7
|
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipTrigger.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ui/TooltipTrigger.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TooltipTrigger.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ui/TooltipTrigger.vue"],"names":[],"mappings":"AAgBA,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,SAAS,CAAA;AA2BlE,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAmB/C,QAAA,MAAM,eAAe,kTAMnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { createBlock as e, defineComponent as t,
|
|
2
|
-
import { TooltipTrigger as
|
|
1
|
+
import { createBlock as e, defineComponent as t, guardReactiveProps as n, normalizeProps as r, openBlock as i, renderSlot as a, unref as o, withCtx as s } from "vue";
|
|
2
|
+
import { TooltipTrigger as c } from "reka-ui";
|
|
3
3
|
//#region src/components/ui/TooltipTrigger.vue?vue&type=script&setup=true&lang.ts
|
|
4
|
-
var
|
|
4
|
+
var l = /*@__PURE__*/ t({
|
|
5
5
|
__name: "TooltipTrigger",
|
|
6
6
|
props: {
|
|
7
7
|
reference: {},
|
|
@@ -9,14 +9,17 @@ var c = /*@__PURE__*/ t({
|
|
|
9
9
|
as: {}
|
|
10
10
|
},
|
|
11
11
|
setup(t) {
|
|
12
|
-
let
|
|
13
|
-
return (t,
|
|
14
|
-
|
|
12
|
+
let l = t;
|
|
13
|
+
return (t, u) => (i(), e(o(c), r(n({
|
|
14
|
+
...l.asChild ? {} : { "data-slot": "tooltip-trigger" },
|
|
15
|
+
...l
|
|
16
|
+
})), {
|
|
17
|
+
default: s(() => [a(t.$slots, "default")]),
|
|
15
18
|
_: 3
|
|
16
19
|
}, 16));
|
|
17
20
|
}
|
|
18
21
|
});
|
|
19
22
|
//#endregion
|
|
20
|
-
export {
|
|
23
|
+
export { l as default };
|
|
21
24
|
|
|
22
25
|
//# sourceMappingURL=TooltipTrigger.vue_vue_type_script_setup_true_lang.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipTrigger.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","
|
|
1
|
+
{"version":3,"file":"TooltipTrigger.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","_normalizeProps","_guardReactiveProps","_withCtx","_renderSlot","TooltipTrigger_vue_vue_type_script_setup_true_lang_default","props","__props","openBlock","createBlock","unref","TooltipTrigger","normalizeProps","guardReactiveProps","withCtx","renderSlot","_ctx"],"sources":["../../../src/components/ui/TooltipTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { TooltipTrigger, type TooltipTriggerProps } from 'reka-ui'\n\nconst props = defineProps<TooltipTriggerProps>()\n</script>\n\n<template>\n <!-- With as-child the child keeps its own data-slot (an action's `button`). -->\n <TooltipTrigger\n v-bind=\"{ ...(props.asChild ? {} : { 'data-slot': 'tooltip-trigger' }), ...props }\"\n >\n <slot />\n </TooltipTrigger>\n</template>\n"],"mappings":";;;;;;;;;;;EAGA,IAAMQ,IAAQC;oBAKZT,EAAA,GAAAC,EAIiBC,EAAAW,CAAA,GAAAV,EAAAC,EAAA;GAAA,GAHDI,EAAM,UAAO,CAAA,IAAA,EAAA,aAAA,kBAAA;GAAA,GAAgDA;EAAK,CAAA,CAAA,GAAA;GAEhF,SAAAH,QAAQ,CAARC,EAAQY,EAAA,QAAA,SAAA,CAAA,CAAA"}
|
package/dist/eject-manifest.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"package": "@alfakit/vue",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.9",
|
|
4
4
|
"adapter": "vue",
|
|
5
|
-
"generatedAt": "2026-10-
|
|
5
|
+
"generatedAt": "2026-10-25T05:36:02.409Z",
|
|
6
6
|
"components": {
|
|
7
7
|
"TextInput": {
|
|
8
8
|
"file": "src/components/fields/TextInputField.vue",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopNavLayout.js","names":["_sfc_main","TopNavLayout_vue_vue_type_script_setup_true_lang_default","TopNavLayout_default"],"sources":["../../src/layouts/TopNavLayout.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n PREFETCH_CACHE_FOR,\n hasMobilePreset,\n type BreadcrumbSchema,\n type NavigationItemSchema,\n type Width,\n} from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { MenuIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport NotificationsMenu from '../components/notifications/NotificationsMenu.vue'\nimport BottomNav from '../components/panel/BottomNav.vue'\nimport Brand from '../components/panel/Brand.vue'\nimport TenantMenu from '../components/panel/TenantMenu.vue'\nimport Breadcrumbs from '../components/panel/Breadcrumbs.vue'\nimport GlobalSearch from '../components/panel/GlobalSearch.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport Slot from '../components/panel/Slot.vue'\nimport DebugPanelSlot from '../components/panel/DebugPanelSlot.vue'\nimport ThemeToggle from '../components/panel/ThemeToggle.vue'\nimport TopbarLocaleSwitcher from '../components/panel/TopbarLocaleSwitcher.vue'\nimport UserMenu from '../components/panel/UserMenu.vue'\nimport Button from '../components/ui/Button.vue'\nimport Sheet from '../components/ui/Sheet.vue'\nimport SheetContent from '../components/ui/SheetContent.vue'\nimport SheetHeader from '../components/ui/SheetHeader.vue'\nimport SheetTitle from '../components/ui/SheetTitle.vue'\nimport SheetTrigger from '../components/ui/SheetTrigger.vue'\nimport { useDirection, usePanel, useRegistry, useT } from '../context'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\nimport { MAX_WIDTHS } from './max-widths'\nimport TopNavGroupWrapper from './TopNavGroupWrapper.vue'\nimport TopNavMenu from './TopNavMenu.vue'\nimport NewTabHint from '../lib/NewTabHint.vue'\n\n/**\n * Navigation across the top instead of a sidebar (`layout: 'topbar'`). Ungrouped items are\n * links; labelled groups and items with children open as dropdowns.\n */\nconst props = defineProps<{ breadcrumbs?: BreadcrumbSchema[]; maxContentWidth?: Width | string }>()\nconst panel = usePanel()\nconst t = useT()\nconst direction = useDirection()\nconst registry = useRegistry()\nconst open = ref(false)\nconst Bottom = computed(() => registry.resolve('panel:bottom-nav') ?? BottomNav)\nconst mobilePreset = computed(() => hasMobilePreset(panel.value))\nconst width = computed(\n () => MAX_WIDTHS[props.maxContentWidth ?? panel.value.maxContentWidth ?? '7xl'] ?? 'max-w-7xl',\n)\n\nconst isActive = (item: NavigationItemSchema): boolean =>\n Boolean(item.active || item.children?.some(isActive))\n\nconst linkClass =\n 'text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground inline-flex h-9 shrink-0 items-center gap-2 rounded-md px-3 text-sm font-medium transition-colors [&_svg]:size-4'\n</script>\n\n<template>\n <div data-slot=\"topnav-layout\" class=\"bg-background flex min-h-svh flex-col\">\n <Slot name=\"body.start\" />\n <Slot name=\"layout.start\" />\n <Slot name=\"topbar.before\" />\n <header\n data-slot=\"topbar\"\n class=\"bg-background/90 supports-[backdrop-filter]:bg-background/70 sticky top-0 z-30 border-b backdrop-blur\"\n >\n <div :class=\"cn('mx-auto flex h-14 w-full items-center gap-3 px-4 md:px-6', width)\">\n <Sheet :open=\"open\" @update:open=\"open = $event\">\n <SheetTrigger as-child>\n <Button\n type=\"button\"\n variant=\"ghost\"\n size=\"icon\"\n class=\"md:hidden\"\n :aria-label=\"t('toggle_sidebar', {}, 'Toggle sidebar')\"\n >\n <Icon name=\"alfakit::panels.topbar.open-sidebar-button\" :fallback=\"MenuIcon\" />\n </Button>\n </SheetTrigger>\n <SheetContent :side=\"direction === 'rtl' ? 'right' : 'left'\" class=\"w-72 p-0\">\n <SheetHeader class=\"border-b\">\n <SheetTitle as-child>\n <div><Brand /></div>\n </SheetTitle>\n </SheetHeader>\n <nav class=\"flex flex-col gap-4 overflow-y-auto p-4 text-sm\">\n <div\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? index\"\n class=\"flex flex-col gap-1\"\n >\n <p v-if=\"group.label\" class=\"text-muted-foreground px-2 text-xs font-medium\">\n {{ group.label }}\n </p>\n <Link\n v-for=\"item in group.items.flatMap((entry) => [entry, ...(entry.children ?? [])])\"\n :key=\"item.label\"\n :href=\"item.url ?? '#'\"\n :data-active=\"item.active ? 'true' : undefined\"\n class=\"hover:bg-accent data-[active=true]:bg-accent flex items-center gap-2 rounded-md px-2 py-2 font-medium [&_svg]:size-4\"\n @click=\"open = false\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </div>\n </nav>\n </SheetContent>\n </Sheet>\n <Slot name=\"topbar.logo.before\" />\n <Brand class=\"me-2 shrink-0\" />\n <Slot name=\"topbar.logo.after\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.before\" />\n <TenantMenu variant=\"topbar\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.after\" />\n <nav\n data-slot=\"topnav\"\n :aria-label=\"t('navigation', {}, 'Navigation')\"\n class=\"hidden min-w-0 flex-1 items-center gap-1 self-stretch overflow-x-auto md:flex\"\n >\n <TopNavGroupWrapper\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? `group-${index}`\"\n :attributes=\"group.extraTopbarAttributes\"\n >\n <TopNavMenu\n v-if=\"group.label\"\n :label=\"group.label\"\n :icon=\"group.icon\"\n :items=\"group.items\"\n :active=\"group.items.some(isActive)\"\n />\n <template v-for=\"item in group.items\" v-else :key=\"item.label\">\n <TopNavMenu\n v-if=\"item.children && item.children.length > 0\"\n :label=\"item.label\"\n :label-html=\"item.labelHtml\"\n :icon=\"item.icon\"\n :items=\"item.children\"\n :active=\"isActive(item)\"\n :attributes=\"item.extraAttributes\"\n />\n <a\n v-else-if=\"item.openInNewTab\"\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n data-slot=\"topnav-link\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n <NewTabHint />\n </a>\n <Link\n v-else\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n prefetch\n :cache-for=\"PREFETCH_CACHE_FOR\"\n data-slot=\"topnav-link\"\n :data-active=\"item.active ? 'true' : undefined\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </template>\n </TopNavGroupWrapper>\n </nav>\n <Slot name=\"topbar.start\" />\n <div class=\"ms-auto flex shrink-0 items-center gap-1\">\n <Slot name=\"topbar.end\" />\n <GlobalSearch />\n <NotificationsMenu />\n <TopbarLocaleSwitcher />\n <ThemeToggle />\n <DebugPanelSlot />\n <UserMenu variant=\"topbar\" />\n </div>\n </div>\n </header>\n <Slot name=\"topbar.after\" />\n <Slot name=\"content.before\" />\n <main\n data-slot=\"content\"\n :class=\"cn('mx-auto flex w-full min-w-0 flex-1 flex-col gap-6 p-4 md:p-6', width)\"\n >\n <Breadcrumbs\n v-if=\"panel.breadcrumbs && props.breadcrumbs && props.breadcrumbs.length > 0\"\n :items=\"props.breadcrumbs\"\n />\n <Slot name=\"content.start\" />\n <slot />\n <Slot name=\"content.end\" />\n </main>\n <Slot name=\"content.after\" />\n <Slot name=\"footer\" />\n <component :is=\"Bottom\" v-if=\"mobilePreset\" />\n <Slot name=\"layout.end\" />\n <Slot name=\"body.end\" />\n </div>\n</template>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"TopNavLayout.js","names":["_sfc_main","TopNavLayout_vue_vue_type_script_setup_true_lang_default","TopNavLayout_default"],"sources":["../../src/layouts/TopNavLayout.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n PREFETCH_CACHE_FOR,\n hasMobilePreset,\n type BreadcrumbSchema,\n type NavigationItemSchema,\n type Width,\n} from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { MenuIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport NotificationsMenu from '../components/notifications/NotificationsMenu.vue'\nimport BottomNav from '../components/panel/BottomNav.vue'\nimport Brand from '../components/panel/Brand.vue'\nimport TenantMenu from '../components/panel/TenantMenu.vue'\nimport Breadcrumbs from '../components/panel/Breadcrumbs.vue'\nimport GlobalSearch from '../components/panel/GlobalSearch.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport Slot from '../components/panel/Slot.vue'\nimport DebugPanelSlot from '../components/panel/DebugPanelSlot.vue'\nimport ThemeToggle from '../components/panel/ThemeToggle.vue'\nimport TopbarLocaleSwitcher from '../components/panel/TopbarLocaleSwitcher.vue'\nimport UserMenu from '../components/panel/UserMenu.vue'\nimport Button from '../components/ui/Button.vue'\nimport Sheet from '../components/ui/Sheet.vue'\nimport SheetContent from '../components/ui/SheetContent.vue'\nimport SheetHeader from '../components/ui/SheetHeader.vue'\nimport SheetTitle from '../components/ui/SheetTitle.vue'\nimport SheetTrigger from '../components/ui/SheetTrigger.vue'\nimport { useDirection, usePanel, useRegistry, useT } from '../context'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\nimport { MAX_WIDTHS } from './max-widths'\nimport TopNavGroupWrapper from './TopNavGroupWrapper.vue'\nimport TopNavMenu from './TopNavMenu.vue'\nimport NewTabHint from '../lib/NewTabHint.vue'\n\n/**\n * Navigation across the top instead of a sidebar (`layout: 'topbar'`). Ungrouped items are\n * links; labelled groups and items with children open as dropdowns.\n */\nconst props = defineProps<{ breadcrumbs?: BreadcrumbSchema[]; maxContentWidth?: Width | string }>()\nconst panel = usePanel()\nconst t = useT()\nconst direction = useDirection()\nconst registry = useRegistry()\nconst open = ref(false)\nconst Bottom = computed(() => registry.resolve('panel:bottom-nav') ?? BottomNav)\nconst mobilePreset = computed(() => hasMobilePreset(panel.value))\nconst width = computed(\n () => MAX_WIDTHS[props.maxContentWidth ?? panel.value.maxContentWidth ?? '7xl'] ?? 'max-w-7xl',\n)\n\nconst isActive = (item: NavigationItemSchema): boolean =>\n Boolean(item.active || item.children?.some(isActive))\n\nconst linkClass =\n 'text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground inline-flex h-9 shrink-0 items-center gap-2 rounded-md px-3 text-sm font-medium transition-colors [&_svg]:size-4'\n</script>\n\n<template>\n <div data-slot=\"topnav-layout\" class=\"bg-background flex min-h-svh flex-col\">\n <Slot name=\"body.start\" />\n <Slot name=\"layout.start\" />\n <Slot name=\"topbar.before\" />\n <header\n data-slot=\"topbar\"\n class=\"bg-background/90 supports-[backdrop-filter]:bg-background/70 sticky top-0 z-30 border-b backdrop-blur\"\n >\n <div :class=\"cn('mx-auto flex h-14 w-full items-center gap-3 px-4 md:px-6', width)\">\n <Sheet :open=\"open\" @update:open=\"open = $event\">\n <SheetTrigger as-child>\n <Button\n type=\"button\"\n variant=\"ghost\"\n size=\"icon\"\n class=\"md:hidden\"\n :aria-label=\"t('toggle_sidebar', {}, 'Toggle sidebar')\"\n >\n <Icon name=\"alfakit::panels.topbar.open-sidebar-button\" :fallback=\"MenuIcon\" />\n </Button>\n </SheetTrigger>\n <SheetContent :side=\"direction === 'rtl' ? 'right' : 'left'\" class=\"w-72 p-0\">\n <SheetHeader class=\"border-b\">\n <SheetTitle as-child>\n <div><Brand /></div>\n </SheetTitle>\n </SheetHeader>\n <nav class=\"flex flex-col gap-4 overflow-y-auto p-4 text-sm\">\n <div\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? index\"\n class=\"flex flex-col gap-1\"\n >\n <p v-if=\"group.label\" class=\"text-muted-foreground px-2 text-xs font-medium\">\n {{ group.label }}\n </p>\n <Link\n v-for=\"item in group.items.flatMap((entry) => [entry, ...(entry.children ?? [])])\"\n :key=\"item.url ?? item.label\"\n :href=\"item.url ?? '#'\"\n :data-active=\"item.active ? 'true' : undefined\"\n class=\"hover:bg-accent data-[active=true]:bg-accent flex items-center gap-2 rounded-md px-2 py-2 font-medium [&_svg]:size-4\"\n @click=\"open = false\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </div>\n </nav>\n </SheetContent>\n </Sheet>\n <Slot name=\"topbar.logo.before\" />\n <Brand class=\"me-2 shrink-0\" />\n <Slot name=\"topbar.logo.after\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.before\" />\n <TenantMenu variant=\"topbar\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.after\" />\n <nav\n data-slot=\"topnav\"\n :aria-label=\"t('navigation', {}, 'Navigation')\"\n class=\"hidden min-w-0 flex-1 items-center gap-1 self-stretch overflow-x-auto md:flex\"\n >\n <TopNavGroupWrapper\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? `group-${index}`\"\n :attributes=\"group.extraTopbarAttributes\"\n >\n <TopNavMenu\n v-if=\"group.label\"\n :label=\"group.label\"\n :icon=\"group.icon\"\n :items=\"group.items\"\n :active=\"group.items.some(isActive)\"\n />\n <template v-for=\"item in group.items\" v-else :key=\"item.url ?? item.label\">\n <TopNavMenu\n v-if=\"item.children && item.children.length > 0\"\n :label=\"item.label\"\n :label-html=\"item.labelHtml\"\n :icon=\"item.icon\"\n :items=\"item.children\"\n :active=\"isActive(item)\"\n :attributes=\"item.extraAttributes\"\n />\n <a\n v-else-if=\"item.openInNewTab\"\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n data-slot=\"topnav-link\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n <NewTabHint />\n </a>\n <Link\n v-else\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n prefetch\n :cache-for=\"PREFETCH_CACHE_FOR\"\n data-slot=\"topnav-link\"\n :data-active=\"item.active ? 'true' : undefined\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </template>\n </TopNavGroupWrapper>\n </nav>\n <Slot name=\"topbar.start\" />\n <div class=\"ms-auto flex shrink-0 items-center gap-1\">\n <Slot name=\"topbar.end\" />\n <GlobalSearch />\n <NotificationsMenu />\n <TopbarLocaleSwitcher />\n <ThemeToggle />\n <DebugPanelSlot />\n <UserMenu variant=\"topbar\" />\n </div>\n </div>\n </header>\n <Slot name=\"topbar.after\" />\n <Slot name=\"content.before\" />\n <main\n data-slot=\"content\"\n :class=\"cn('mx-auto flex w-full min-w-0 flex-1 flex-col gap-6 p-4 md:p-6', width)\"\n >\n <Breadcrumbs\n v-if=\"panel.breadcrumbs && props.breadcrumbs && props.breadcrumbs.length > 0\"\n :items=\"props.breadcrumbs\"\n />\n <Slot name=\"content.start\" />\n <slot />\n <Slot name=\"content.end\" />\n </main>\n <Slot name=\"content.after\" />\n <Slot name=\"footer\" />\n <component :is=\"Bottom\" v-if=\"mobilePreset\" />\n <Slot name=\"layout.end\" />\n <Slot name=\"body.end\" />\n </div>\n</template>\n"],"mappings":""}
|
|
@@ -83,7 +83,7 @@ var H = {
|
|
|
83
83
|
key: e.label ?? n,
|
|
84
84
|
class: "flex flex-col gap-1"
|
|
85
85
|
}, [e.label ? (N(), D("p", G, R(e.label), 1)) : E("", !0), (N(!0), D(C, null, F(e.items.flatMap((e) => [e, ...e.children ?? []]), (e) => (N(), T(z(S), {
|
|
86
|
-
key: e.label,
|
|
86
|
+
key: e.url ?? e.label,
|
|
87
87
|
href: e.url ?? "#",
|
|
88
88
|
"data-active": e.active ? "true" : void 0,
|
|
89
89
|
class: "hover:bg-accent data-[active=true]:bg-accent flex items-center gap-2 rounded-md px-2 py-2 font-medium [&_svg]:size-4",
|
|
@@ -133,7 +133,7 @@ var H = {
|
|
|
133
133
|
"icon",
|
|
134
134
|
"items",
|
|
135
135
|
"active"
|
|
136
|
-
])) : (N(!0), D(C, { key: 1 }, F(e.items, (e) => (N(), D(C, { key: e.label }, [e.children && e.children.length > 0 ? (N(), T(x, {
|
|
136
|
+
])) : (N(!0), D(C, { key: 1 }, F(e.items, (e) => (N(), D(C, { key: e.url ?? e.label }, [e.children && e.children.length > 0 ? (N(), T(x, {
|
|
137
137
|
key: 0,
|
|
138
138
|
label: e.label,
|
|
139
139
|
"label-html": e.labelHtml,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopNavLayout.vue_vue_type_script_setup_true_lang.js","names":["BottomNav","_openBlock","_createElementBlock","_createVNode","Slot","_createElementVNode","_normalizeClass","_unref","Sheet","_withCtx","SheetTrigger","Button","Icon","SheetContent","SheetHeader","SheetTitle","Brand","_Fragment","_renderList","_toDisplayString","_createCommentVNode","_createBlock","NavLabel","TenantMenu","TopNavGroupWrapper","TopNavMenu","_mergeProps","NewTabHint","GlobalSearch","NotificationsMenu","TopbarLocaleSwitcher","ThemeToggle","DebugPanelSlot","UserMenu","Breadcrumbs","_renderSlot","_resolveDynamicComponent","Icon_default","Button_default","Slot_default","Sheet_default","SheetContent_default","SheetHeader_default","SheetTitle_default","SheetTrigger_default","NewTabHint_default","NavLabel_default","NotificationsMenu_default","Brand_default","GlobalSearch_default","TenantMenu_default","UserMenu_default","BottomNav_default","Breadcrumbs_default","DebugPanelSlot_default","ThemeToggle_default","TopbarLocaleSwitcher_default","TopNavGroupWrapper_default","TopNavMenu_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","linkClass","TopNavLayout_vue_vue_type_script_setup_true_lang_default","props","__props","panel","usePanel","t","useT","direction","useDirection","registry","useRegistry","open","ref","Bottom","computed","mobilePreset","hasMobilePreset","width","MAX_WIDTHS","isActive","item","openBlock","createElementBlock","createVNode","createElementVNode","normalizeClass","unref","cn","_cache","$event","withCtx","MenuIcon","Fragment","renderList","group","index","toDisplayString","createCommentVNode","entry","createBlock","Link","mergeProps","PREFETCH_CACHE_FOR","renderSlot","_ctx","resolveDynamicComponent"],"sources":["../../src/layouts/TopNavLayout.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n PREFETCH_CACHE_FOR,\n hasMobilePreset,\n type BreadcrumbSchema,\n type NavigationItemSchema,\n type Width,\n} from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { MenuIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport NotificationsMenu from '../components/notifications/NotificationsMenu.vue'\nimport BottomNav from '../components/panel/BottomNav.vue'\nimport Brand from '../components/panel/Brand.vue'\nimport TenantMenu from '../components/panel/TenantMenu.vue'\nimport Breadcrumbs from '../components/panel/Breadcrumbs.vue'\nimport GlobalSearch from '../components/panel/GlobalSearch.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport Slot from '../components/panel/Slot.vue'\nimport DebugPanelSlot from '../components/panel/DebugPanelSlot.vue'\nimport ThemeToggle from '../components/panel/ThemeToggle.vue'\nimport TopbarLocaleSwitcher from '../components/panel/TopbarLocaleSwitcher.vue'\nimport UserMenu from '../components/panel/UserMenu.vue'\nimport Button from '../components/ui/Button.vue'\nimport Sheet from '../components/ui/Sheet.vue'\nimport SheetContent from '../components/ui/SheetContent.vue'\nimport SheetHeader from '../components/ui/SheetHeader.vue'\nimport SheetTitle from '../components/ui/SheetTitle.vue'\nimport SheetTrigger from '../components/ui/SheetTrigger.vue'\nimport { useDirection, usePanel, useRegistry, useT } from '../context'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\nimport { MAX_WIDTHS } from './max-widths'\nimport TopNavGroupWrapper from './TopNavGroupWrapper.vue'\nimport TopNavMenu from './TopNavMenu.vue'\nimport NewTabHint from '../lib/NewTabHint.vue'\n\n/**\n * Navigation across the top instead of a sidebar (`layout: 'topbar'`). Ungrouped items are\n * links; labelled groups and items with children open as dropdowns.\n */\nconst props = defineProps<{ breadcrumbs?: BreadcrumbSchema[]; maxContentWidth?: Width | string }>()\nconst panel = usePanel()\nconst t = useT()\nconst direction = useDirection()\nconst registry = useRegistry()\nconst open = ref(false)\nconst Bottom = computed(() => registry.resolve('panel:bottom-nav') ?? BottomNav)\nconst mobilePreset = computed(() => hasMobilePreset(panel.value))\nconst width = computed(\n () => MAX_WIDTHS[props.maxContentWidth ?? panel.value.maxContentWidth ?? '7xl'] ?? 'max-w-7xl',\n)\n\nconst isActive = (item: NavigationItemSchema): boolean =>\n Boolean(item.active || item.children?.some(isActive))\n\nconst linkClass =\n 'text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground inline-flex h-9 shrink-0 items-center gap-2 rounded-md px-3 text-sm font-medium transition-colors [&_svg]:size-4'\n</script>\n\n<template>\n <div data-slot=\"topnav-layout\" class=\"bg-background flex min-h-svh flex-col\">\n <Slot name=\"body.start\" />\n <Slot name=\"layout.start\" />\n <Slot name=\"topbar.before\" />\n <header\n data-slot=\"topbar\"\n class=\"bg-background/90 supports-[backdrop-filter]:bg-background/70 sticky top-0 z-30 border-b backdrop-blur\"\n >\n <div :class=\"cn('mx-auto flex h-14 w-full items-center gap-3 px-4 md:px-6', width)\">\n <Sheet :open=\"open\" @update:open=\"open = $event\">\n <SheetTrigger as-child>\n <Button\n type=\"button\"\n variant=\"ghost\"\n size=\"icon\"\n class=\"md:hidden\"\n :aria-label=\"t('toggle_sidebar', {}, 'Toggle sidebar')\"\n >\n <Icon name=\"alfakit::panels.topbar.open-sidebar-button\" :fallback=\"MenuIcon\" />\n </Button>\n </SheetTrigger>\n <SheetContent :side=\"direction === 'rtl' ? 'right' : 'left'\" class=\"w-72 p-0\">\n <SheetHeader class=\"border-b\">\n <SheetTitle as-child>\n <div><Brand /></div>\n </SheetTitle>\n </SheetHeader>\n <nav class=\"flex flex-col gap-4 overflow-y-auto p-4 text-sm\">\n <div\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? index\"\n class=\"flex flex-col gap-1\"\n >\n <p v-if=\"group.label\" class=\"text-muted-foreground px-2 text-xs font-medium\">\n {{ group.label }}\n </p>\n <Link\n v-for=\"item in group.items.flatMap((entry) => [entry, ...(entry.children ?? [])])\"\n :key=\"item.label\"\n :href=\"item.url ?? '#'\"\n :data-active=\"item.active ? 'true' : undefined\"\n class=\"hover:bg-accent data-[active=true]:bg-accent flex items-center gap-2 rounded-md px-2 py-2 font-medium [&_svg]:size-4\"\n @click=\"open = false\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </div>\n </nav>\n </SheetContent>\n </Sheet>\n <Slot name=\"topbar.logo.before\" />\n <Brand class=\"me-2 shrink-0\" />\n <Slot name=\"topbar.logo.after\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.before\" />\n <TenantMenu variant=\"topbar\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.after\" />\n <nav\n data-slot=\"topnav\"\n :aria-label=\"t('navigation', {}, 'Navigation')\"\n class=\"hidden min-w-0 flex-1 items-center gap-1 self-stretch overflow-x-auto md:flex\"\n >\n <TopNavGroupWrapper\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? `group-${index}`\"\n :attributes=\"group.extraTopbarAttributes\"\n >\n <TopNavMenu\n v-if=\"group.label\"\n :label=\"group.label\"\n :icon=\"group.icon\"\n :items=\"group.items\"\n :active=\"group.items.some(isActive)\"\n />\n <template v-for=\"item in group.items\" v-else :key=\"item.label\">\n <TopNavMenu\n v-if=\"item.children && item.children.length > 0\"\n :label=\"item.label\"\n :label-html=\"item.labelHtml\"\n :icon=\"item.icon\"\n :items=\"item.children\"\n :active=\"isActive(item)\"\n :attributes=\"item.extraAttributes\"\n />\n <a\n v-else-if=\"item.openInNewTab\"\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n data-slot=\"topnav-link\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n <NewTabHint />\n </a>\n <Link\n v-else\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n prefetch\n :cache-for=\"PREFETCH_CACHE_FOR\"\n data-slot=\"topnav-link\"\n :data-active=\"item.active ? 'true' : undefined\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </template>\n </TopNavGroupWrapper>\n </nav>\n <Slot name=\"topbar.start\" />\n <div class=\"ms-auto flex shrink-0 items-center gap-1\">\n <Slot name=\"topbar.end\" />\n <GlobalSearch />\n <NotificationsMenu />\n <TopbarLocaleSwitcher />\n <ThemeToggle />\n <DebugPanelSlot />\n <UserMenu variant=\"topbar\" />\n </div>\n </div>\n </header>\n <Slot name=\"topbar.after\" />\n <Slot name=\"content.before\" />\n <main\n data-slot=\"content\"\n :class=\"cn('mx-auto flex w-full min-w-0 flex-1 flex-col gap-6 p-4 md:p-6', width)\"\n >\n <Breadcrumbs\n v-if=\"panel.breadcrumbs && props.breadcrumbs && props.breadcrumbs.length > 0\"\n :items=\"props.breadcrumbs\"\n />\n <Slot name=\"content.start\" />\n <slot />\n <Slot name=\"content.end\" />\n </main>\n <Slot name=\"content.after\" />\n <Slot name=\"footer\" />\n <component :is=\"Bottom\" v-if=\"mobilePreset\" />\n <Slot name=\"layout.end\" />\n <Slot name=\"body.end\" />\n </div>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TopNavLayout.vue_vue_type_script_setup_true_lang.js","names":["BottomNav","_openBlock","_createElementBlock","_createVNode","Slot","_createElementVNode","_normalizeClass","_unref","Sheet","_withCtx","SheetTrigger","Button","Icon","SheetContent","SheetHeader","SheetTitle","Brand","_Fragment","_renderList","_toDisplayString","_createCommentVNode","_createBlock","NavLabel","TenantMenu","TopNavGroupWrapper","TopNavMenu","_mergeProps","NewTabHint","GlobalSearch","NotificationsMenu","TopbarLocaleSwitcher","ThemeToggle","DebugPanelSlot","UserMenu","Breadcrumbs","_renderSlot","_resolveDynamicComponent","Icon_default","Button_default","Slot_default","Sheet_default","SheetContent_default","SheetHeader_default","SheetTitle_default","SheetTrigger_default","NewTabHint_default","NavLabel_default","NotificationsMenu_default","Brand_default","GlobalSearch_default","TenantMenu_default","UserMenu_default","BottomNav_default","Breadcrumbs_default","DebugPanelSlot_default","ThemeToggle_default","TopbarLocaleSwitcher_default","TopNavGroupWrapper_default","TopNavMenu_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","linkClass","TopNavLayout_vue_vue_type_script_setup_true_lang_default","props","__props","panel","usePanel","t","useT","direction","useDirection","registry","useRegistry","open","ref","Bottom","computed","mobilePreset","hasMobilePreset","width","MAX_WIDTHS","isActive","item","openBlock","createElementBlock","createVNode","createElementVNode","normalizeClass","unref","cn","_cache","$event","withCtx","MenuIcon","Fragment","renderList","group","index","toDisplayString","createCommentVNode","entry","createBlock","Link","mergeProps","PREFETCH_CACHE_FOR","renderSlot","_ctx","resolveDynamicComponent"],"sources":["../../src/layouts/TopNavLayout.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n PREFETCH_CACHE_FOR,\n hasMobilePreset,\n type BreadcrumbSchema,\n type NavigationItemSchema,\n type Width,\n} from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { MenuIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport NotificationsMenu from '../components/notifications/NotificationsMenu.vue'\nimport BottomNav from '../components/panel/BottomNav.vue'\nimport Brand from '../components/panel/Brand.vue'\nimport TenantMenu from '../components/panel/TenantMenu.vue'\nimport Breadcrumbs from '../components/panel/Breadcrumbs.vue'\nimport GlobalSearch from '../components/panel/GlobalSearch.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport Slot from '../components/panel/Slot.vue'\nimport DebugPanelSlot from '../components/panel/DebugPanelSlot.vue'\nimport ThemeToggle from '../components/panel/ThemeToggle.vue'\nimport TopbarLocaleSwitcher from '../components/panel/TopbarLocaleSwitcher.vue'\nimport UserMenu from '../components/panel/UserMenu.vue'\nimport Button from '../components/ui/Button.vue'\nimport Sheet from '../components/ui/Sheet.vue'\nimport SheetContent from '../components/ui/SheetContent.vue'\nimport SheetHeader from '../components/ui/SheetHeader.vue'\nimport SheetTitle from '../components/ui/SheetTitle.vue'\nimport SheetTrigger from '../components/ui/SheetTrigger.vue'\nimport { useDirection, usePanel, useRegistry, useT } from '../context'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\nimport { MAX_WIDTHS } from './max-widths'\nimport TopNavGroupWrapper from './TopNavGroupWrapper.vue'\nimport TopNavMenu from './TopNavMenu.vue'\nimport NewTabHint from '../lib/NewTabHint.vue'\n\n/**\n * Navigation across the top instead of a sidebar (`layout: 'topbar'`). Ungrouped items are\n * links; labelled groups and items with children open as dropdowns.\n */\nconst props = defineProps<{ breadcrumbs?: BreadcrumbSchema[]; maxContentWidth?: Width | string }>()\nconst panel = usePanel()\nconst t = useT()\nconst direction = useDirection()\nconst registry = useRegistry()\nconst open = ref(false)\nconst Bottom = computed(() => registry.resolve('panel:bottom-nav') ?? BottomNav)\nconst mobilePreset = computed(() => hasMobilePreset(panel.value))\nconst width = computed(\n () => MAX_WIDTHS[props.maxContentWidth ?? panel.value.maxContentWidth ?? '7xl'] ?? 'max-w-7xl',\n)\n\nconst isActive = (item: NavigationItemSchema): boolean =>\n Boolean(item.active || item.children?.some(isActive))\n\nconst linkClass =\n 'text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground inline-flex h-9 shrink-0 items-center gap-2 rounded-md px-3 text-sm font-medium transition-colors [&_svg]:size-4'\n</script>\n\n<template>\n <div data-slot=\"topnav-layout\" class=\"bg-background flex min-h-svh flex-col\">\n <Slot name=\"body.start\" />\n <Slot name=\"layout.start\" />\n <Slot name=\"topbar.before\" />\n <header\n data-slot=\"topbar\"\n class=\"bg-background/90 supports-[backdrop-filter]:bg-background/70 sticky top-0 z-30 border-b backdrop-blur\"\n >\n <div :class=\"cn('mx-auto flex h-14 w-full items-center gap-3 px-4 md:px-6', width)\">\n <Sheet :open=\"open\" @update:open=\"open = $event\">\n <SheetTrigger as-child>\n <Button\n type=\"button\"\n variant=\"ghost\"\n size=\"icon\"\n class=\"md:hidden\"\n :aria-label=\"t('toggle_sidebar', {}, 'Toggle sidebar')\"\n >\n <Icon name=\"alfakit::panels.topbar.open-sidebar-button\" :fallback=\"MenuIcon\" />\n </Button>\n </SheetTrigger>\n <SheetContent :side=\"direction === 'rtl' ? 'right' : 'left'\" class=\"w-72 p-0\">\n <SheetHeader class=\"border-b\">\n <SheetTitle as-child>\n <div><Brand /></div>\n </SheetTitle>\n </SheetHeader>\n <nav class=\"flex flex-col gap-4 overflow-y-auto p-4 text-sm\">\n <div\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? index\"\n class=\"flex flex-col gap-1\"\n >\n <p v-if=\"group.label\" class=\"text-muted-foreground px-2 text-xs font-medium\">\n {{ group.label }}\n </p>\n <Link\n v-for=\"item in group.items.flatMap((entry) => [entry, ...(entry.children ?? [])])\"\n :key=\"item.url ?? item.label\"\n :href=\"item.url ?? '#'\"\n :data-active=\"item.active ? 'true' : undefined\"\n class=\"hover:bg-accent data-[active=true]:bg-accent flex items-center gap-2 rounded-md px-2 py-2 font-medium [&_svg]:size-4\"\n @click=\"open = false\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </div>\n </nav>\n </SheetContent>\n </Sheet>\n <Slot name=\"topbar.logo.before\" />\n <Brand class=\"me-2 shrink-0\" />\n <Slot name=\"topbar.logo.after\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.before\" />\n <TenantMenu variant=\"topbar\" />\n <Slot v-if=\"panel.tenancy?.current\" name=\"tenant-menu.after\" />\n <nav\n data-slot=\"topnav\"\n :aria-label=\"t('navigation', {}, 'Navigation')\"\n class=\"hidden min-w-0 flex-1 items-center gap-1 self-stretch overflow-x-auto md:flex\"\n >\n <TopNavGroupWrapper\n v-for=\"(group, index) in panel.navigation\"\n :key=\"group.label ?? `group-${index}`\"\n :attributes=\"group.extraTopbarAttributes\"\n >\n <TopNavMenu\n v-if=\"group.label\"\n :label=\"group.label\"\n :icon=\"group.icon\"\n :items=\"group.items\"\n :active=\"group.items.some(isActive)\"\n />\n <template v-for=\"item in group.items\" v-else :key=\"item.url ?? item.label\">\n <TopNavMenu\n v-if=\"item.children && item.children.length > 0\"\n :label=\"item.label\"\n :label-html=\"item.labelHtml\"\n :icon=\"item.icon\"\n :items=\"item.children\"\n :active=\"isActive(item)\"\n :attributes=\"item.extraAttributes\"\n />\n <a\n v-else-if=\"item.openInNewTab\"\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n data-slot=\"topnav-link\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n <NewTabHint />\n </a>\n <Link\n v-else\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n prefetch\n :cache-for=\"PREFETCH_CACHE_FOR\"\n data-slot=\"topnav-link\"\n :data-active=\"item.active ? 'true' : undefined\"\n :class=\"linkClass\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </template>\n </TopNavGroupWrapper>\n </nav>\n <Slot name=\"topbar.start\" />\n <div class=\"ms-auto flex shrink-0 items-center gap-1\">\n <Slot name=\"topbar.end\" />\n <GlobalSearch />\n <NotificationsMenu />\n <TopbarLocaleSwitcher />\n <ThemeToggle />\n <DebugPanelSlot />\n <UserMenu variant=\"topbar\" />\n </div>\n </div>\n </header>\n <Slot name=\"topbar.after\" />\n <Slot name=\"content.before\" />\n <main\n data-slot=\"content\"\n :class=\"cn('mx-auto flex w-full min-w-0 flex-1 flex-col gap-6 p-4 md:p-6', width)\"\n >\n <Breadcrumbs\n v-if=\"panel.breadcrumbs && props.breadcrumbs && props.breadcrumbs.length > 0\"\n :items=\"props.breadcrumbs\"\n />\n <Slot name=\"content.start\" />\n <slot />\n <Slot name=\"content.end\" />\n </main>\n <Slot name=\"content.after\" />\n <Slot name=\"footer\" />\n <component :is=\"Bottom\" v-if=\"mobilePreset\" />\n <Slot name=\"layout.end\" />\n <Slot name=\"body.end\" />\n </div>\n</template>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopNavMenu.js","names":["_sfc_main","TopNavMenu_vue_vue_type_script_setup_true_lang_default","TopNavMenu_default"],"sources":["../../src/layouts/TopNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { NavigationItemSchema } from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { ChevronDownIcon } from '@lucide/vue'\nimport DropdownMenu from '../components/ui/DropdownMenu.vue'\nimport DropdownMenuContent from '../components/ui/DropdownMenuContent.vue'\nimport DropdownMenuItem from '../components/ui/DropdownMenuItem.vue'\nimport DropdownMenuTrigger from '../components/ui/DropdownMenuTrigger.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\n\n/** A top-navigation dropdown: a labelled group or an item with children. */\nconst props = defineProps<{\n label: string\n /** `label` is sanitised HTML (an `Htmlable` navigation label). */\n labelHtml?: boolean\n icon?: string\n items: NavigationItemSchema[]\n active: boolean\n /** `NavigationItem::extraAttributes()` of an item with children. */\n attributes?: NavigationItemSchema['extraAttributes']\n}>()\n</script>\n\n<template>\n <DropdownMenu>\n <DropdownMenuTrigger\n v-bind=\"props.attributes ?? {}\"\n data-slot=\"topnav-link\"\n :data-active=\"props.active ? 'true' : undefined\"\n class=\"text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground data-[state=open]:text-foreground inline-flex h-9 shrink-0 items-center gap-1.5 rounded-md px-3 text-sm font-medium transition-colors outline-none [&_svg]:size-4\"\n >\n <Icon v-if=\"props.icon\" :name=\"props.icon\" />\n <NavLabel :text=\"props.label\" :html=\"props.labelHtml\" />\n <ChevronDownIcon class=\"opacity-60\" />\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" class=\"min-w-48\">\n <DropdownMenuItem v-for=\"item in props.items\" :key=\"item.label\" as-child>\n <Link\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n :class=\"cn('w-full', item.active && 'font-medium')\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n</template>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"TopNavMenu.js","names":["_sfc_main","TopNavMenu_vue_vue_type_script_setup_true_lang_default","TopNavMenu_default"],"sources":["../../src/layouts/TopNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { NavigationItemSchema } from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { ChevronDownIcon } from '@lucide/vue'\nimport DropdownMenu from '../components/ui/DropdownMenu.vue'\nimport DropdownMenuContent from '../components/ui/DropdownMenuContent.vue'\nimport DropdownMenuItem from '../components/ui/DropdownMenuItem.vue'\nimport DropdownMenuTrigger from '../components/ui/DropdownMenuTrigger.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\n\n/** A top-navigation dropdown: a labelled group or an item with children. */\nconst props = defineProps<{\n label: string\n /** `label` is sanitised HTML (an `Htmlable` navigation label). */\n labelHtml?: boolean\n icon?: string\n items: NavigationItemSchema[]\n active: boolean\n /** `NavigationItem::extraAttributes()` of an item with children. */\n attributes?: NavigationItemSchema['extraAttributes']\n}>()\n</script>\n\n<template>\n <DropdownMenu>\n <DropdownMenuTrigger\n v-bind=\"props.attributes ?? {}\"\n data-slot=\"topnav-link\"\n :data-active=\"props.active ? 'true' : undefined\"\n class=\"text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground data-[state=open]:text-foreground inline-flex h-9 shrink-0 items-center gap-1.5 rounded-md px-3 text-sm font-medium transition-colors outline-none [&_svg]:size-4\"\n >\n <Icon v-if=\"props.icon\" :name=\"props.icon\" />\n <NavLabel :text=\"props.label\" :html=\"props.labelHtml\" />\n <ChevronDownIcon class=\"opacity-60\" />\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" class=\"min-w-48\">\n <DropdownMenuItem v-for=\"item in props.items\" :key=\"item.url ?? item.label\" as-child>\n <Link\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n :class=\"cn('w-full', item.active && 'font-medium')\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n</template>\n"],"mappings":""}
|
|
@@ -44,7 +44,7 @@ var b = /*@__PURE__*/ p({
|
|
|
44
44
|
class: "min-w-48"
|
|
45
45
|
}, {
|
|
46
46
|
default: v(() => [(h(!0), d(c, null, g(b.items, (n) => (h(), l(i, {
|
|
47
|
-
key: n.label,
|
|
47
|
+
key: n.url ?? n.label,
|
|
48
48
|
"as-child": ""
|
|
49
49
|
}, {
|
|
50
50
|
default: v(() => [f(_(s), m({ ref_for: !0 }, n.extraAttributes ?? {}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopNavMenu.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","DropdownMenu","_withCtx","_createVNode","DropdownMenuTrigger","_mergeProps","_unref","Icon","_createCommentVNode","NavLabel","DropdownMenuContent","_createElementBlock","_Fragment","_renderList","DropdownMenuItem","Icon_default","DropdownMenu_default","DropdownMenuContent_default","DropdownMenuItem_default","DropdownMenuTrigger_default","NavLabel_default","TopNavMenu_vue_vue_type_script_setup_true_lang_default","props","__props","openBlock","createBlock","withCtx","createVNode","mergeProps","unref","createCommentVNode","ChevronDownIcon","createElementBlock","Fragment","renderList","item","Link","cn"],"sources":["../../src/layouts/TopNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { NavigationItemSchema } from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { ChevronDownIcon } from '@lucide/vue'\nimport DropdownMenu from '../components/ui/DropdownMenu.vue'\nimport DropdownMenuContent from '../components/ui/DropdownMenuContent.vue'\nimport DropdownMenuItem from '../components/ui/DropdownMenuItem.vue'\nimport DropdownMenuTrigger from '../components/ui/DropdownMenuTrigger.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\n\n/** A top-navigation dropdown: a labelled group or an item with children. */\nconst props = defineProps<{\n label: string\n /** `label` is sanitised HTML (an `Htmlable` navigation label). */\n labelHtml?: boolean\n icon?: string\n items: NavigationItemSchema[]\n active: boolean\n /** `NavigationItem::extraAttributes()` of an item with children. */\n attributes?: NavigationItemSchema['extraAttributes']\n}>()\n</script>\n\n<template>\n <DropdownMenu>\n <DropdownMenuTrigger\n v-bind=\"props.attributes ?? {}\"\n data-slot=\"topnav-link\"\n :data-active=\"props.active ? 'true' : undefined\"\n class=\"text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground data-[state=open]:text-foreground inline-flex h-9 shrink-0 items-center gap-1.5 rounded-md px-3 text-sm font-medium transition-colors outline-none [&_svg]:size-4\"\n >\n <Icon v-if=\"props.icon\" :name=\"props.icon\" />\n <NavLabel :text=\"props.label\" :html=\"props.labelHtml\" />\n <ChevronDownIcon class=\"opacity-60\" />\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" class=\"min-w-48\">\n <DropdownMenuItem v-for=\"item in props.items\" :key=\"item.label\" as-child>\n <Link\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n :class=\"cn('w-full', item.active && 'font-medium')\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAaA,IAAMuB,IAAQC;oBAaZxB,EAAA,GAAAC,EAuBeC,GAAA,MAAA;GAtBb,SAAAC,QASsB,CATtBC,EASsBC,GATtBC,EACUiB,EAAM,cAAU,CAAA,GAAA;IACxB,aAAU;IACT,eAAaA,EAAM,SAAM,SAAY,KAAA;IACtC,OAAM;;IAEN,SAAApB,QAA6C;KAAjCoB,EAAM,QAAlBvB,EAAA,GAAAC,EAA6CM,EAAAC,CAAA,GAAA;;MAApB,MAAMe,EAAM;;KACrCnB,EAAwDM,GAAA;MAA7C,MAAMa,EAAM;MAAQ,MAAMA,EAAM;;KAC3CnB,EAAsCG,EAAAyB,CAAA,GAAA,EAArB,OAAM,aAAY,CAAA;;;GAErC5B,GAAAA,IAAAA,CAAAA,aAAAA,CAAAA,GAAAA,EAWsBO,GAAA;IAXD,OAAM;IAAQ,OAAM;;IACrB,SAAAR,QAA2B,EAA7CH,EAAA,EAAA,GAAAY,EASmBC,GAAA,MAAAC,EATcS,EAAM,QAAd,OAAzBvB,EAAA,GAAAC,EASmBc,GAAA;KAT4B,KAAKqB,EAAK;KAAO,YAAA;;
|
|
1
|
+
{"version":3,"file":"TopNavMenu.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","DropdownMenu","_withCtx","_createVNode","DropdownMenuTrigger","_mergeProps","_unref","Icon","_createCommentVNode","NavLabel","DropdownMenuContent","_createElementBlock","_Fragment","_renderList","DropdownMenuItem","Icon_default","DropdownMenu_default","DropdownMenuContent_default","DropdownMenuItem_default","DropdownMenuTrigger_default","NavLabel_default","TopNavMenu_vue_vue_type_script_setup_true_lang_default","props","__props","openBlock","createBlock","withCtx","createVNode","mergeProps","unref","createCommentVNode","ChevronDownIcon","createElementBlock","Fragment","renderList","item","Link","cn"],"sources":["../../src/layouts/TopNavMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { NavigationItemSchema } from '@alfakit/core'\nimport { Link } from '@inertiajs/vue3'\nimport { ChevronDownIcon } from '@lucide/vue'\nimport DropdownMenu from '../components/ui/DropdownMenu.vue'\nimport DropdownMenuContent from '../components/ui/DropdownMenuContent.vue'\nimport DropdownMenuItem from '../components/ui/DropdownMenuItem.vue'\nimport DropdownMenuTrigger from '../components/ui/DropdownMenuTrigger.vue'\nimport NavLabel from '../components/panel/NavLabel.vue'\nimport { Icon } from '../lib/icons'\nimport { cn } from '../lib/utils'\n\n/** A top-navigation dropdown: a labelled group or an item with children. */\nconst props = defineProps<{\n label: string\n /** `label` is sanitised HTML (an `Htmlable` navigation label). */\n labelHtml?: boolean\n icon?: string\n items: NavigationItemSchema[]\n active: boolean\n /** `NavigationItem::extraAttributes()` of an item with children. */\n attributes?: NavigationItemSchema['extraAttributes']\n}>()\n</script>\n\n<template>\n <DropdownMenu>\n <DropdownMenuTrigger\n v-bind=\"props.attributes ?? {}\"\n data-slot=\"topnav-link\"\n :data-active=\"props.active ? 'true' : undefined\"\n class=\"text-muted-foreground hover:text-foreground hover:bg-accent data-[active=true]:bg-accent data-[active=true]:text-foreground data-[state=open]:text-foreground inline-flex h-9 shrink-0 items-center gap-1.5 rounded-md px-3 text-sm font-medium transition-colors outline-none [&_svg]:size-4\"\n >\n <Icon v-if=\"props.icon\" :name=\"props.icon\" />\n <NavLabel :text=\"props.label\" :html=\"props.labelHtml\" />\n <ChevronDownIcon class=\"opacity-60\" />\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" class=\"min-w-48\">\n <DropdownMenuItem v-for=\"item in props.items\" :key=\"item.url ?? item.label\" as-child>\n <Link\n v-bind=\"item.extraAttributes ?? {}\"\n :href=\"item.url ?? '#'\"\n :class=\"cn('w-full', item.active && 'font-medium')\"\n >\n <Icon v-if=\"item.icon\" :name=\"item.icon\" />\n <NavLabel :text=\"item.label\" :html=\"item.labelHtml\" />\n </Link>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAaA,IAAMuB,IAAQC;oBAaZxB,EAAA,GAAAC,EAuBeC,GAAA,MAAA;GAtBb,SAAAC,QASsB,CATtBC,EASsBC,GATtBC,EACUiB,EAAM,cAAU,CAAA,GAAA;IACxB,aAAU;IACT,eAAaA,EAAM,SAAM,SAAY,KAAA;IACtC,OAAM;;IAEN,SAAApB,QAA6C;KAAjCoB,EAAM,QAAlBvB,EAAA,GAAAC,EAA6CM,EAAAC,CAAA,GAAA;;MAApB,MAAMe,EAAM;;KACrCnB,EAAwDM,GAAA;MAA7C,MAAMa,EAAM;MAAQ,MAAMA,EAAM;;KAC3CnB,EAAsCG,EAAAyB,CAAA,GAAA,EAArB,OAAM,aAAY,CAAA;;;GAErC5B,GAAAA,IAAAA,CAAAA,aAAAA,CAAAA,GAAAA,EAWsBO,GAAA;IAXD,OAAM;IAAQ,OAAM;;IACrB,SAAAR,QAA2B,EAA7CH,EAAA,EAAA,GAAAY,EASmBC,GAAA,MAAAC,EATcS,EAAM,QAAd,OAAzBvB,EAAA,GAAAC,EASmBc,GAAA;KAT4B,KAAKqB,EAAK,OAAOA,EAAK;KAAO,YAAA;;KAC1E,SAAAjC,QAOO,CAPPC,EAOOG,EAAA8B,CAAA,GAPP/B,EAOO,EAAA,SAAA,GAAA,GANG8B,EAAK,mBAAe,CAAA,GAAA;MAC3B,MAAMA,EAAK,OAAG;MACd,OAAO7B,EAAA+B,CAAA,CAAE,CAAA,UAAWF,EAAK,UAAM,aAAA;;MAEhC,SAAAjC,QAA2C,CAA/BiC,EAAK,QAAjBpC,EAAA,GAAAC,EAA2CM,EAAAC,CAAA,GAAA;;OAAnB,MAAM4B,EAAK;MACnChC,GAAAA,MAAAA,GAAAA,CAAAA,MAAAA,CAAAA,KAAAA,EAAAA,IAAAA,EAAAA,GAAAA,EAAsDM,GAAA;OAA3C,MAAM0B,EAAK;OAAQ,MAAMA,EAAK"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlfakitComponent.js","names":["_sfc_main","AlfakitComponent_vue_vue_type_script_setup_true_lang_default","AlfakitComponent_default"],"sources":["../../src/standalone/AlfakitComponent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n StandaloneComponentState,\n findStandalonePropName,\n registerStandaloneProp,\n standalonePanelSchema,\n type ContentBlock,\n type StandaloneComponentSchema,\n} from '@alfakit/core'\nimport { usePage } from '@inertiajs/vue3'\nimport { ConfigProvider } from 'reka-ui'\nimport { computed, onMounted, onScopeDispose, provide, ref, watch, type HTMLAttributes } from 'vue'\nimport { providePageActionContext } from '../components/actions/action-context'\nimport ActionList from '../components/actions/ActionList.vue'\nimport ActionModals from '../components/actions/ActionModals.vue'\nimport TooltipProvider from '../components/ui/TooltipProvider.vue'\nimport {\n ALFAKIT_KEY,\n provideStandalone,\n useOptionalAlfakit,\n type AlfakitContextValue,\n type AnyComponent,\n} from '../context'\nimport { cn } from '../lib/utils'\nimport ContentBlockRenderer from '../pages/ContentBlockRenderer.vue'\nimport AlfakitToaster from './AlfakitToaster.vue'\nimport {\n claimToaster,\n createStandaloneContext,\n createStandaloneRegistry,\n ensureStandaloneRuntime,\n hasToaster,\n} from './runtime'\n\n/**\n * Renders an Alfakit component outside a panel: a form, table, infolist, widgets or any mix\n * (`AlfaSix\\Alfakit\\Standalone\\*`) in any Inertia page of the application. Needs no\n * `createAlfakit()` and no panel layout: it provides its own translator, registry, action\n * runner and modals, and inherits the application's shadcn tokens.\n *\n * ```vue\n * <AlfakitComponent :component=\"orders\" class=\"max-w-4xl\" />\n * ```\n *\n * Slots: `header` (above the content blocks), `footer` (below), and the default slot to\n * render the blocks yourself: `<template #default=\"{ blocks }\">…<ContentBlockRenderer :block=\"…\" />`.\n */\nconst props = defineProps<{\n /** The payload: `ContactForm::make()` passed as an Inertia prop. */\n component: StandaloneComponentSchema\n /** Renderer overrides for this instance (`{ TextInput: MyInput }`), on top of `configureAlfakit()`. */\n components?: Record<string, AnyComponent>\n class?: HTMLAttributes['class']\n}>()\n\ndefineSlots<{\n header?: () => unknown\n footer?: () => unknown\n default?: (props: { blocks: ContentBlock[]; page: StandaloneComponentSchema }) => unknown\n}>()\n\nconst parent = useOptionalAlfakit()\nconst inertiaPage = usePage()\n\n// Lazy and polled schemas of this component, merged into the page it renders.\nconst version = ref(0)\nconst state = new StandaloneComponentState(props.component, () => version.value++)\nconst poll = (target: string, interval: string | number | null | undefined) =>\n state.poll(target, interval)\nconst refresh = (targets: string[]) => state.refresh(targets)\n\nconst context: AlfakitContextValue = parent\n ? {\n ...parent,\n registry: createStandaloneRegistry(props.components, parent.registry),\n poll,\n refresh,\n }\n : {\n ...createStandaloneContext(\n { action: props.component.endpoints.action, modal: props.component.endpoints.modal },\n props.components,\n poll,\n ),\n refresh,\n }\n\nprovide(ALFAKIT_KEY, context)\n\nconst panel = computed(() => standalonePanelSchema(props.component))\nconst page = computed(() => {\n void version.value\n state.setComponent(props.component)\n\n return state.page\n})\nconst direction = computed(() => props.component.localization?.direction ?? 'ltr')\nconst actionContext = computed(() => ({ token: props.component.token, component: 'page' }))\n\nprovideStandalone({ panel, page })\nprovidePageActionContext(actionContext.value)\n\n// Endpoints and strings follow the latest payload (they change per locale or path).\nwatch(\n () => props.component,\n (component) => {\n context.actions.setEndpoints({\n action: component.endpoints.action,\n modal: component.endpoints.modal,\n })\n\n // Inside `createAlfakit()` the panel feeds the shared translator; on a page without the\n // `alfakit` prop (the rest of the app) the component's own translations apply.\n if (!parent || !(inertiaPage.props as Record<string, unknown>).alfakit) {\n context.translator.setTranslations(component.translations ?? {})\n context.translator.setLocale(component.localization?.tag ?? 'en')\n }\n },\n { immediate: true, flush: 'sync' },\n)\n\n// Toasts: use the layout's <AlfakitToaster /> when there is one, else the first component\n// on the page renders one (checked after every component mounted).\nconst ownsToaster = ref(false)\n\nonMounted(() => {\n ensureStandaloneRuntime()\n\n // Partial reloads (sorting, paging, inline edits) request this component's own prop.\n watch(\n () => findStandalonePropName(inertiaPage.props as Record<string, unknown>, props.component),\n (name, _old, onCleanup) => onCleanup(registerStandaloneProp(name ?? null)),\n { immediate: true },\n )\n\n // The watcher runs before the new payload renders: hand it over, or the response would\n // count as stale and lazy widgets (a calendar after its action) keep their old schema.\n watch(\n () => props.component.token,\n () => void state.loadLazy(props.component),\n { immediate: true },\n )\n\n if (parent) return\n\n let release: (() => void) | null = null\n let cancelled = false\n\n queueMicrotask(() => {\n if (cancelled || hasToaster()) return\n\n release = claimToaster()\n ownsToaster.value = true\n })\n\n onScopeDispose(() => {\n cancelled = true\n release?.()\n })\n})\n</script>\n\n<template>\n <component\n :is=\"parent ? 'div' : ConfigProvider\"\n :dir=\"parent ? undefined : direction\"\n :class=\"parent ? 'contents' : undefined\"\n >\n <TooltipProvider :delay-duration=\"0\">\n <div\n data-slot=\"standalone\"\n :data-alfakit-component=\"props.component.class\"\n :dir=\"direction\"\n :class=\"cn('flex flex-col gap-6', props.class)\"\n >\n <header\n v-if=\"page.heading || page.headerActions?.length\"\n data-slot=\"page-header\"\n class=\"flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\"\n >\n <div class=\"min-w-0\">\n <h2 v-if=\"page.heading\" class=\"text-xl font-semibold tracking-tight\">\n {{ page.heading }}\n </h2>\n <p v-if=\"page.subheading\" class=\"text-muted-foreground mt-1 text-sm\">\n {{ page.subheading }}\n </p>\n </div>\n <ActionList\n v-if=\"page.headerActions && page.headerActions.length > 0\"\n :actions=\"page.headerActions\"\n :context=\"actionContext\"\n align=\"end\"\n class=\"max-w-full shrink-0\"\n />\n </header>\n <slot name=\"header\" />\n <slot :blocks=\"page.content\" :page=\"props.component\">\n <ContentBlockRenderer v-for=\"block in page.content\" :key=\"block.key\" :block=\"block\" />\n </slot>\n <slot name=\"footer\" />\n </div>\n <ActionModals />\n <AlfakitToaster v-if=\"ownsToaster\" claimed />\n </TooltipProvider>\n </component>\n</template>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"AlfakitComponent.js","names":["_sfc_main","AlfakitComponent_vue_vue_type_script_setup_true_lang_default","AlfakitComponent_default"],"sources":["../../src/standalone/AlfakitComponent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n StandaloneComponentState,\n findStandalonePropName,\n registerStandaloneProp,\n standalonePanelSchema,\n type ContentBlock,\n type StandaloneComponentSchema,\n} from '@alfakit/core'\nimport { usePage } from '@inertiajs/vue3'\nimport { ConfigProvider } from 'reka-ui'\nimport { computed, onMounted, onScopeDispose, provide, ref, watch, type HTMLAttributes } from 'vue'\nimport { providePageActionContext } from '../components/actions/action-context'\nimport ActionList from '../components/actions/ActionList.vue'\nimport ActionModals from '../components/actions/ActionModals.vue'\nimport TooltipProvider from '../components/ui/TooltipProvider.vue'\nimport {\n ALFAKIT_KEY,\n provideStandalone,\n useOptionalAlfakit,\n type AlfakitContextValue,\n type AnyComponent,\n} from '../context'\nimport { cn } from '../lib/utils'\nimport ContentBlockRenderer from '../pages/ContentBlockRenderer.vue'\nimport AlfakitToaster from './AlfakitToaster.vue'\nimport {\n claimToaster,\n createStandaloneContext,\n createStandaloneRegistry,\n ensureStandaloneRuntime,\n hasToaster,\n} from './runtime'\n\n/**\n * Renders an Alfakit component outside a panel: a form, table, infolist, widgets or any mix\n * (`AlfaSix\\Alfakit\\Standalone\\*`) in any Inertia page of the application. Needs no\n * `createAlfakit()` and no panel layout: it provides its own translator, registry, action\n * runner and modals, and inherits the application's shadcn tokens.\n *\n * ```vue\n * <AlfakitComponent :component=\"orders\" class=\"max-w-4xl\" />\n * ```\n *\n * Slots: `header` (above the content blocks), `footer` (below), and the default slot to\n * render the blocks yourself: `<template #default=\"{ blocks }\">…<ContentBlockRenderer :block=\"…\" />`.\n */\nconst props = defineProps<{\n /** The payload: `ContactForm::make()` passed as an Inertia prop. */\n component: StandaloneComponentSchema\n /** Renderer overrides for this instance (`{ TextInput: MyInput }`), on top of `configureAlfakit()`. */\n components?: Record<string, AnyComponent>\n class?: HTMLAttributes['class']\n}>()\n\ndefineSlots<{\n header?: () => unknown\n footer?: () => unknown\n default?: (props: { blocks: ContentBlock[]; page: StandaloneComponentSchema }) => unknown\n}>()\n\nconst parent = useOptionalAlfakit()\nconst inertiaPage = usePage()\n\n// Lazy and polled schemas of this component, merged into the page it renders.\nconst version = ref(0)\nconst state = new StandaloneComponentState(props.component, () => version.value++)\nconst poll = (target: string, interval: string | number | null | undefined) =>\n state.poll(target, interval)\nconst refresh = (targets: string[]) => state.refresh(targets)\n\n// Inside a panel page: the panel's registry and translator, but this component's own action\n// runner, so its actions post to its own endpoints with its own token (not the panel's: 403).\nconst context: AlfakitContextValue = parent\n ? {\n ...parent,\n actions: createStandaloneContext(\n { action: props.component.endpoints.action, modal: props.component.endpoints.modal },\n props.components,\n poll,\n ).actions,\n registry: createStandaloneRegistry(props.components, parent.registry),\n poll,\n refresh,\n }\n : {\n ...createStandaloneContext(\n { action: props.component.endpoints.action, modal: props.component.endpoints.modal },\n props.components,\n poll,\n ),\n refresh,\n }\n\nprovide(ALFAKIT_KEY, context)\n\nconst panel = computed(() => standalonePanelSchema(props.component))\nconst page = computed(() => {\n void version.value\n state.setComponent(props.component)\n\n return state.page\n})\nconst direction = computed(() => props.component.localization?.direction ?? 'ltr')\nconst actionContext = computed(() => ({ token: props.component.token, component: 'page' }))\n\nprovideStandalone({ panel, page })\nprovidePageActionContext(actionContext.value)\n\n// Endpoints and strings follow the latest payload (they change per locale or path).\nwatch(\n () => props.component,\n (component) => {\n context.actions.setEndpoints({\n action: component.endpoints.action,\n modal: component.endpoints.modal,\n })\n\n // Inside `createAlfakit()` the panel feeds the shared translator; on a page without the\n // `alfakit` prop (the rest of the app) the component's own translations apply.\n if (!parent || !(inertiaPage.props as Record<string, unknown>).alfakit) {\n context.translator.setTranslations(component.translations ?? {})\n context.translator.setLocale(component.localization?.tag ?? 'en')\n }\n },\n { immediate: true, flush: 'sync' },\n)\n\n// Toasts: use the layout's <AlfakitToaster /> when there is one, else the first component\n// on the page renders one (checked after every component mounted).\nconst ownsToaster = ref(false)\n\nonMounted(() => {\n ensureStandaloneRuntime()\n\n // Partial reloads (sorting, paging, inline edits) request this component's own prop.\n watch(\n () => findStandalonePropName(inertiaPage.props as Record<string, unknown>, props.component),\n (name, _old, onCleanup) => onCleanup(registerStandaloneProp(name ?? null)),\n { immediate: true },\n )\n\n // The watcher runs before the new payload renders: hand it over, or the response would\n // count as stale and lazy widgets (a calendar after its action) keep their old schema.\n watch(\n () => props.component.token,\n () => void state.loadLazy(props.component),\n { immediate: true },\n )\n\n if (parent) return\n\n let release: (() => void) | null = null\n let cancelled = false\n\n queueMicrotask(() => {\n if (cancelled || hasToaster()) return\n\n release = claimToaster()\n ownsToaster.value = true\n })\n\n onScopeDispose(() => {\n cancelled = true\n release?.()\n })\n})\n</script>\n\n<template>\n <component\n :is=\"parent ? 'div' : ConfigProvider\"\n :dir=\"parent ? undefined : direction\"\n :class=\"parent ? 'contents' : undefined\"\n >\n <TooltipProvider :delay-duration=\"0\">\n <div\n data-slot=\"standalone\"\n :data-alfakit-component=\"props.component.class\"\n :dir=\"direction\"\n :class=\"cn('flex flex-col gap-6', props.class)\"\n >\n <header\n v-if=\"page.heading || page.headerActions?.length\"\n data-slot=\"page-header\"\n class=\"flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\"\n >\n <div class=\"min-w-0\">\n <h2 v-if=\"page.heading\" class=\"text-xl font-semibold tracking-tight\">\n {{ page.heading }}\n </h2>\n <p v-if=\"page.subheading\" class=\"text-muted-foreground mt-1 text-sm\">\n {{ page.subheading }}\n </p>\n </div>\n <ActionList\n v-if=\"page.headerActions && page.headerActions.length > 0\"\n :actions=\"page.headerActions\"\n :context=\"actionContext\"\n align=\"end\"\n class=\"max-w-full shrink-0\"\n />\n </header>\n <slot name=\"header\" />\n <slot :blocks=\"page.content\" :page=\"props.component\">\n <ContentBlockRenderer v-for=\"block in page.content\" :key=\"block.key\" :block=\"block\" />\n </slot>\n <slot name=\"footer\" />\n </div>\n <ActionModals />\n <AlfakitToaster v-if=\"ownsToaster\" claimed :dir=\"direction\" />\n </TooltipProvider>\n </component>\n</template>\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlfakitComponent.vue.d.ts","sourceRoot":"","sources":["../../src/standalone/AlfakitComponent.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AlfakitComponent.vue.d.ts","sourceRoot":"","sources":["../../src/standalone/AlfakitComponent.vue"],"names":[],"mappings":"AAwNA,OAAO,EAKL,KAAK,YAAY,EACjB,KAAK,yBAAyB,EAC/B,MAAM,eAAe,CAAA;AAGtB,OAAO,EAA4D,KAAK,cAAc,EAAE,MAAM,KAAK,CAAA;AAKnG,OAAO,EAKL,KAAK,YAAY,EAClB,MAAM,YAAY,CAAA;AAYnB;;;;;;;;;;;;GAYG;AACH,KAAK,WAAW,GAAG;IACjB,oEAAoE;IACpE,SAAS,EAAE,yBAAyB,CAAA;IACpC,uGAAuG;IACvG,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;IACzC,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;CAChC,CAAC;AAGF,KAAK,WAAW,GAAG;IACjB,MAAM,CAAC,EAAE,MAAM,OAAO,CAAA;IACtB,MAAM,CAAC,EAAE,MAAM,OAAO,CAAA;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,YAAY,EAAE,CAAC;QAAC,IAAI,EAAE,yBAAyB,CAAA;KAAE,KAAK,OAAO,CAAA;CAC1F,CAAC;AA2QF,QAAA,MAAM,eAAe,kSAMnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -6,10 +6,10 @@ import ee from "../pages/ContentBlockRenderer.js";
|
|
|
6
6
|
import o from "../components/actions/ActionModals.js";
|
|
7
7
|
import s from "../components/ui/TooltipProvider.js";
|
|
8
8
|
import { claimToaster as c, createStandaloneContext as l, createStandaloneRegistry as u, ensureStandaloneRuntime as d, hasToaster as f } from "./runtime.js";
|
|
9
|
-
import
|
|
10
|
-
import { StandaloneComponentState as
|
|
11
|
-
import { usePage as
|
|
12
|
-
import { Fragment as
|
|
9
|
+
import p from "./AlfakitToaster.js";
|
|
10
|
+
import { StandaloneComponentState as te, findStandalonePropName as ne, registerStandaloneProp as re, standalonePanelSchema as m } from "@alfakit/core";
|
|
11
|
+
import { usePage as h } from "@inertiajs/vue3";
|
|
12
|
+
import { Fragment as g, computed as _, createBlock as v, createCommentVNode as y, createElementBlock as b, createElementVNode as x, createVNode as S, defineComponent as C, normalizeClass as w, onMounted as T, onScopeDispose as E, openBlock as D, provide as ie, ref as O, renderList as k, renderSlot as A, resolveDynamicComponent as j, toDisplayString as M, unref as N, watch as P, withCtx as F } from "vue";
|
|
13
13
|
import { ConfigProvider as I } from "reka-ui";
|
|
14
14
|
//#region src/standalone/AlfakitComponent.vue?vue&type=script&setup=true&lang.ts
|
|
15
15
|
var L = ["data-alfakit-component", "dir"], R = {
|
|
@@ -22,7 +22,7 @@ var L = ["data-alfakit-component", "dir"], R = {
|
|
|
22
22
|
}, V = {
|
|
23
23
|
key: 1,
|
|
24
24
|
class: "text-muted-foreground mt-1 text-sm"
|
|
25
|
-
}, H = /*@__PURE__*/
|
|
25
|
+
}, H = /*@__PURE__*/ C({
|
|
26
26
|
__name: "AlfakitComponent",
|
|
27
27
|
props: {
|
|
28
28
|
component: {},
|
|
@@ -35,9 +35,13 @@ var L = ["data-alfakit-component", "dir"], R = {
|
|
|
35
35
|
Array
|
|
36
36
|
] }
|
|
37
37
|
},
|
|
38
|
-
setup(
|
|
39
|
-
let H =
|
|
38
|
+
setup(C) {
|
|
39
|
+
let H = C, U = n(), W = h(), G = O(0), K = new te(H.component, () => G.value++), q = (e, t) => K.poll(e, t), J = (e) => K.refresh(e), Y = U ? {
|
|
40
40
|
...U,
|
|
41
|
+
actions: l({
|
|
42
|
+
action: H.component.endpoints.action,
|
|
43
|
+
modal: H.component.endpoints.modal
|
|
44
|
+
}, H.components, q).actions,
|
|
41
45
|
registry: u(H.components, U.registry),
|
|
42
46
|
poll: q,
|
|
43
47
|
refresh: J
|
|
@@ -48,8 +52,8 @@ var L = ["data-alfakit-component", "dir"], R = {
|
|
|
48
52
|
}, H.components, q),
|
|
49
53
|
refresh: J
|
|
50
54
|
};
|
|
51
|
-
|
|
52
|
-
let ae =
|
|
55
|
+
ie(e, Y);
|
|
56
|
+
let ae = _(() => m(H.component)), X = _(() => (G.value, K.setComponent(H.component), K.page)), Z = _(() => H.component.localization?.direction ?? "ltr"), Q = _(() => ({
|
|
53
57
|
token: H.component.token,
|
|
54
58
|
component: "page"
|
|
55
59
|
}));
|
|
@@ -66,48 +70,49 @@ var L = ["data-alfakit-component", "dir"], R = {
|
|
|
66
70
|
flush: "sync"
|
|
67
71
|
});
|
|
68
72
|
let $ = O(!1);
|
|
69
|
-
return
|
|
70
|
-
if (d(), P(() =>
|
|
73
|
+
return T(() => {
|
|
74
|
+
if (d(), P(() => ne(W.props, H.component), (e, t, n) => n(re(e ?? null)), { immediate: !0 }), P(() => H.component.token, () => void K.loadLazy(H.component), { immediate: !0 }), U) return;
|
|
71
75
|
let e = null, t = !1;
|
|
72
76
|
queueMicrotask(() => {
|
|
73
77
|
t || f() || (e = c(), $.value = !0);
|
|
74
|
-
}),
|
|
78
|
+
}), E(() => {
|
|
75
79
|
t = !0, e?.();
|
|
76
80
|
});
|
|
77
|
-
}), (e, t) => (
|
|
81
|
+
}), (e, t) => (D(), v(j(N(U) ? "div" : N(I)), {
|
|
78
82
|
dir: N(U) ? void 0 : Z.value,
|
|
79
|
-
class:
|
|
83
|
+
class: w(N(U) ? "contents" : void 0)
|
|
80
84
|
}, {
|
|
81
|
-
default: F(() => [
|
|
85
|
+
default: F(() => [S(s, { "delay-duration": 0 }, {
|
|
82
86
|
default: F(() => [
|
|
83
|
-
|
|
87
|
+
x("div", {
|
|
84
88
|
"data-slot": "standalone",
|
|
85
89
|
"data-alfakit-component": H.component.class,
|
|
86
90
|
dir: Z.value,
|
|
87
|
-
class:
|
|
91
|
+
class: w(N(i)("flex flex-col gap-6", H.class))
|
|
88
92
|
}, [
|
|
89
|
-
X.value.heading || X.value.headerActions?.length ? (
|
|
93
|
+
X.value.heading || X.value.headerActions?.length ? (D(), b("header", R, [x("div", z, [X.value.heading ? (D(), b("h2", B, M(X.value.heading), 1)) : y("", !0), X.value.subheading ? (D(), b("p", V, M(X.value.subheading), 1)) : y("", !0)]), X.value.headerActions && X.value.headerActions.length > 0 ? (D(), v(a, {
|
|
90
94
|
key: 0,
|
|
91
95
|
actions: X.value.headerActions,
|
|
92
96
|
context: Q.value,
|
|
93
97
|
align: "end",
|
|
94
98
|
class: "max-w-full shrink-0"
|
|
95
|
-
}, null, 8, ["actions", "context"])) :
|
|
99
|
+
}, null, 8, ["actions", "context"])) : y("", !0)])) : y("", !0),
|
|
96
100
|
A(e.$slots, "header"),
|
|
97
101
|
A(e.$slots, "default", {
|
|
98
102
|
blocks: X.value.content,
|
|
99
103
|
page: H.component
|
|
100
|
-
}, () => [(
|
|
104
|
+
}, () => [(D(!0), b(g, null, k(X.value.content, (e) => (D(), v(ee, {
|
|
101
105
|
key: e.key,
|
|
102
106
|
block: e
|
|
103
107
|
}, null, 8, ["block"]))), 128))]),
|
|
104
108
|
A(e.$slots, "footer")
|
|
105
109
|
], 10, L),
|
|
106
|
-
|
|
107
|
-
$.value ? (
|
|
110
|
+
S(o),
|
|
111
|
+
$.value ? (D(), v(p, {
|
|
108
112
|
key: 0,
|
|
109
|
-
claimed: ""
|
|
110
|
-
|
|
113
|
+
claimed: "",
|
|
114
|
+
dir: Z.value
|
|
115
|
+
}, null, 8, ["dir"])) : y("", !0)
|
|
111
116
|
]),
|
|
112
117
|
_: 3
|
|
113
118
|
})]),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlfakitComponent.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_resolveDynamicComponent","_unref","_normalizeClass","_withCtx","_createVNode","TooltipProvider","_createElementVNode","_createElementBlock","_toDisplayString","_createCommentVNode","ActionList","_renderSlot","_Fragment","_renderList","ContentBlockRenderer","ActionModals","AlfakitToaster","ActionList_default","ContentBlockRenderer_default","ActionModals_default","TooltipProvider_default","AlfakitToaster_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","AlfakitComponent_vue_vue_type_script_setup_true_lang_default","props","__props","parent","useOptionalAlfakit","inertiaPage","usePage","version","ref","state","StandaloneComponentState","poll","target","interval","refresh","targets","context","createStandaloneRegistry","createStandaloneContext","ALFAKIT_KEY","panel","computed","standalonePanelSchema","page","direction","actionContext","provideStandalone","providePageActionContext","watch","component","ownsToaster","onMounted","ensureStandaloneRuntime","findStandalonePropName","onCleanup","registerStandaloneProp","name","release","cancelled","hasToaster","claimToaster","onScopeDispose","openBlock","createBlock","resolveDynamicComponent","unref","ConfigProvider","normalizeClass","withCtx","createVNode","createElementVNode","cn","createElementBlock","toDisplayString","createCommentVNode","renderSlot","_ctx","Fragment","renderList","block"],"sources":["../../src/standalone/AlfakitComponent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n StandaloneComponentState,\n findStandalonePropName,\n registerStandaloneProp,\n standalonePanelSchema,\n type ContentBlock,\n type StandaloneComponentSchema,\n} from '@alfakit/core'\nimport { usePage } from '@inertiajs/vue3'\nimport { ConfigProvider } from 'reka-ui'\nimport { computed, onMounted, onScopeDispose, provide, ref, watch, type HTMLAttributes } from 'vue'\nimport { providePageActionContext } from '../components/actions/action-context'\nimport ActionList from '../components/actions/ActionList.vue'\nimport ActionModals from '../components/actions/ActionModals.vue'\nimport TooltipProvider from '../components/ui/TooltipProvider.vue'\nimport {\n ALFAKIT_KEY,\n provideStandalone,\n useOptionalAlfakit,\n type AlfakitContextValue,\n type AnyComponent,\n} from '../context'\nimport { cn } from '../lib/utils'\nimport ContentBlockRenderer from '../pages/ContentBlockRenderer.vue'\nimport AlfakitToaster from './AlfakitToaster.vue'\nimport {\n claimToaster,\n createStandaloneContext,\n createStandaloneRegistry,\n ensureStandaloneRuntime,\n hasToaster,\n} from './runtime'\n\n/**\n * Renders an Alfakit component outside a panel: a form, table, infolist, widgets or any mix\n * (`AlfaSix\\Alfakit\\Standalone\\*`) in any Inertia page of the application. Needs no\n * `createAlfakit()` and no panel layout: it provides its own translator, registry, action\n * runner and modals, and inherits the application's shadcn tokens.\n *\n * ```vue\n * <AlfakitComponent :component=\"orders\" class=\"max-w-4xl\" />\n * ```\n *\n * Slots: `header` (above the content blocks), `footer` (below), and the default slot to\n * render the blocks yourself: `<template #default=\"{ blocks }\">…<ContentBlockRenderer :block=\"…\" />`.\n */\nconst props = defineProps<{\n /** The payload: `ContactForm::make()` passed as an Inertia prop. */\n component: StandaloneComponentSchema\n /** Renderer overrides for this instance (`{ TextInput: MyInput }`), on top of `configureAlfakit()`. */\n components?: Record<string, AnyComponent>\n class?: HTMLAttributes['class']\n}>()\n\ndefineSlots<{\n header?: () => unknown\n footer?: () => unknown\n default?: (props: { blocks: ContentBlock[]; page: StandaloneComponentSchema }) => unknown\n}>()\n\nconst parent = useOptionalAlfakit()\nconst inertiaPage = usePage()\n\n// Lazy and polled schemas of this component, merged into the page it renders.\nconst version = ref(0)\nconst state = new StandaloneComponentState(props.component, () => version.value++)\nconst poll = (target: string, interval: string | number | null | undefined) =>\n state.poll(target, interval)\nconst refresh = (targets: string[]) => state.refresh(targets)\n\nconst context: AlfakitContextValue = parent\n ? {\n ...parent,\n registry: createStandaloneRegistry(props.components, parent.registry),\n poll,\n refresh,\n }\n : {\n ...createStandaloneContext(\n { action: props.component.endpoints.action, modal: props.component.endpoints.modal },\n props.components,\n poll,\n ),\n refresh,\n }\n\nprovide(ALFAKIT_KEY, context)\n\nconst panel = computed(() => standalonePanelSchema(props.component))\nconst page = computed(() => {\n void version.value\n state.setComponent(props.component)\n\n return state.page\n})\nconst direction = computed(() => props.component.localization?.direction ?? 'ltr')\nconst actionContext = computed(() => ({ token: props.component.token, component: 'page' }))\n\nprovideStandalone({ panel, page })\nprovidePageActionContext(actionContext.value)\n\n// Endpoints and strings follow the latest payload (they change per locale or path).\nwatch(\n () => props.component,\n (component) => {\n context.actions.setEndpoints({\n action: component.endpoints.action,\n modal: component.endpoints.modal,\n })\n\n // Inside `createAlfakit()` the panel feeds the shared translator; on a page without the\n // `alfakit` prop (the rest of the app) the component's own translations apply.\n if (!parent || !(inertiaPage.props as Record<string, unknown>).alfakit) {\n context.translator.setTranslations(component.translations ?? {})\n context.translator.setLocale(component.localization?.tag ?? 'en')\n }\n },\n { immediate: true, flush: 'sync' },\n)\n\n// Toasts: use the layout's <AlfakitToaster /> when there is one, else the first component\n// on the page renders one (checked after every component mounted).\nconst ownsToaster = ref(false)\n\nonMounted(() => {\n ensureStandaloneRuntime()\n\n // Partial reloads (sorting, paging, inline edits) request this component's own prop.\n watch(\n () => findStandalonePropName(inertiaPage.props as Record<string, unknown>, props.component),\n (name, _old, onCleanup) => onCleanup(registerStandaloneProp(name ?? null)),\n { immediate: true },\n )\n\n // The watcher runs before the new payload renders: hand it over, or the response would\n // count as stale and lazy widgets (a calendar after its action) keep their old schema.\n watch(\n () => props.component.token,\n () => void state.loadLazy(props.component),\n { immediate: true },\n )\n\n if (parent) return\n\n let release: (() => void) | null = null\n let cancelled = false\n\n queueMicrotask(() => {\n if (cancelled || hasToaster()) return\n\n release = claimToaster()\n ownsToaster.value = true\n })\n\n onScopeDispose(() => {\n cancelled = true\n release?.()\n })\n})\n</script>\n\n<template>\n <component\n :is=\"parent ? 'div' : ConfigProvider\"\n :dir=\"parent ? undefined : direction\"\n :class=\"parent ? 'contents' : undefined\"\n >\n <TooltipProvider :delay-duration=\"0\">\n <div\n data-slot=\"standalone\"\n :data-alfakit-component=\"props.component.class\"\n :dir=\"direction\"\n :class=\"cn('flex flex-col gap-6', props.class)\"\n >\n <header\n v-if=\"page.heading || page.headerActions?.length\"\n data-slot=\"page-header\"\n class=\"flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\"\n >\n <div class=\"min-w-0\">\n <h2 v-if=\"page.heading\" class=\"text-xl font-semibold tracking-tight\">\n {{ page.heading }}\n </h2>\n <p v-if=\"page.subheading\" class=\"text-muted-foreground mt-1 text-sm\">\n {{ page.subheading }}\n </p>\n </div>\n <ActionList\n v-if=\"page.headerActions && page.headerActions.length > 0\"\n :actions=\"page.headerActions\"\n :context=\"actionContext\"\n align=\"end\"\n class=\"max-w-full shrink-0\"\n />\n </header>\n <slot name=\"header\" />\n <slot :blocks=\"page.content\" :page=\"props.component\">\n <ContentBlockRenderer v-for=\"block in page.content\" :key=\"block.key\" :block=\"block\" />\n </slot>\n <slot name=\"footer\" />\n </div>\n <ActionModals />\n <AlfakitToaster v-if=\"ownsToaster\" claimed />\n </TooltipProvider>\n </component>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AlfakitComponent.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_resolveDynamicComponent","_unref","_normalizeClass","_withCtx","_createVNode","TooltipProvider","_createElementVNode","_createElementBlock","_toDisplayString","_createCommentVNode","ActionList","_renderSlot","_Fragment","_renderList","ContentBlockRenderer","ActionModals","AlfakitToaster","ActionList_default","ContentBlockRenderer_default","ActionModals_default","TooltipProvider_default","AlfakitToaster_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","AlfakitComponent_vue_vue_type_script_setup_true_lang_default","props","__props","parent","useOptionalAlfakit","inertiaPage","usePage","version","ref","state","StandaloneComponentState","poll","target","interval","refresh","targets","context","createStandaloneContext","createStandaloneRegistry","ALFAKIT_KEY","panel","computed","standalonePanelSchema","page","direction","actionContext","provideStandalone","providePageActionContext","watch","component","ownsToaster","onMounted","ensureStandaloneRuntime","findStandalonePropName","onCleanup","registerStandaloneProp","name","release","cancelled","hasToaster","claimToaster","onScopeDispose","openBlock","createBlock","resolveDynamicComponent","unref","ConfigProvider","normalizeClass","withCtx","createVNode","createElementVNode","cn","createElementBlock","toDisplayString","createCommentVNode","renderSlot","_ctx","Fragment","renderList","block"],"sources":["../../src/standalone/AlfakitComponent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n StandaloneComponentState,\n findStandalonePropName,\n registerStandaloneProp,\n standalonePanelSchema,\n type ContentBlock,\n type StandaloneComponentSchema,\n} from '@alfakit/core'\nimport { usePage } from '@inertiajs/vue3'\nimport { ConfigProvider } from 'reka-ui'\nimport { computed, onMounted, onScopeDispose, provide, ref, watch, type HTMLAttributes } from 'vue'\nimport { providePageActionContext } from '../components/actions/action-context'\nimport ActionList from '../components/actions/ActionList.vue'\nimport ActionModals from '../components/actions/ActionModals.vue'\nimport TooltipProvider from '../components/ui/TooltipProvider.vue'\nimport {\n ALFAKIT_KEY,\n provideStandalone,\n useOptionalAlfakit,\n type AlfakitContextValue,\n type AnyComponent,\n} from '../context'\nimport { cn } from '../lib/utils'\nimport ContentBlockRenderer from '../pages/ContentBlockRenderer.vue'\nimport AlfakitToaster from './AlfakitToaster.vue'\nimport {\n claimToaster,\n createStandaloneContext,\n createStandaloneRegistry,\n ensureStandaloneRuntime,\n hasToaster,\n} from './runtime'\n\n/**\n * Renders an Alfakit component outside a panel: a form, table, infolist, widgets or any mix\n * (`AlfaSix\\Alfakit\\Standalone\\*`) in any Inertia page of the application. Needs no\n * `createAlfakit()` and no panel layout: it provides its own translator, registry, action\n * runner and modals, and inherits the application's shadcn tokens.\n *\n * ```vue\n * <AlfakitComponent :component=\"orders\" class=\"max-w-4xl\" />\n * ```\n *\n * Slots: `header` (above the content blocks), `footer` (below), and the default slot to\n * render the blocks yourself: `<template #default=\"{ blocks }\">…<ContentBlockRenderer :block=\"…\" />`.\n */\nconst props = defineProps<{\n /** The payload: `ContactForm::make()` passed as an Inertia prop. */\n component: StandaloneComponentSchema\n /** Renderer overrides for this instance (`{ TextInput: MyInput }`), on top of `configureAlfakit()`. */\n components?: Record<string, AnyComponent>\n class?: HTMLAttributes['class']\n}>()\n\ndefineSlots<{\n header?: () => unknown\n footer?: () => unknown\n default?: (props: { blocks: ContentBlock[]; page: StandaloneComponentSchema }) => unknown\n}>()\n\nconst parent = useOptionalAlfakit()\nconst inertiaPage = usePage()\n\n// Lazy and polled schemas of this component, merged into the page it renders.\nconst version = ref(0)\nconst state = new StandaloneComponentState(props.component, () => version.value++)\nconst poll = (target: string, interval: string | number | null | undefined) =>\n state.poll(target, interval)\nconst refresh = (targets: string[]) => state.refresh(targets)\n\n// Inside a panel page: the panel's registry and translator, but this component's own action\n// runner, so its actions post to its own endpoints with its own token (not the panel's: 403).\nconst context: AlfakitContextValue = parent\n ? {\n ...parent,\n actions: createStandaloneContext(\n { action: props.component.endpoints.action, modal: props.component.endpoints.modal },\n props.components,\n poll,\n ).actions,\n registry: createStandaloneRegistry(props.components, parent.registry),\n poll,\n refresh,\n }\n : {\n ...createStandaloneContext(\n { action: props.component.endpoints.action, modal: props.component.endpoints.modal },\n props.components,\n poll,\n ),\n refresh,\n }\n\nprovide(ALFAKIT_KEY, context)\n\nconst panel = computed(() => standalonePanelSchema(props.component))\nconst page = computed(() => {\n void version.value\n state.setComponent(props.component)\n\n return state.page\n})\nconst direction = computed(() => props.component.localization?.direction ?? 'ltr')\nconst actionContext = computed(() => ({ token: props.component.token, component: 'page' }))\n\nprovideStandalone({ panel, page })\nprovidePageActionContext(actionContext.value)\n\n// Endpoints and strings follow the latest payload (they change per locale or path).\nwatch(\n () => props.component,\n (component) => {\n context.actions.setEndpoints({\n action: component.endpoints.action,\n modal: component.endpoints.modal,\n })\n\n // Inside `createAlfakit()` the panel feeds the shared translator; on a page without the\n // `alfakit` prop (the rest of the app) the component's own translations apply.\n if (!parent || !(inertiaPage.props as Record<string, unknown>).alfakit) {\n context.translator.setTranslations(component.translations ?? {})\n context.translator.setLocale(component.localization?.tag ?? 'en')\n }\n },\n { immediate: true, flush: 'sync' },\n)\n\n// Toasts: use the layout's <AlfakitToaster /> when there is one, else the first component\n// on the page renders one (checked after every component mounted).\nconst ownsToaster = ref(false)\n\nonMounted(() => {\n ensureStandaloneRuntime()\n\n // Partial reloads (sorting, paging, inline edits) request this component's own prop.\n watch(\n () => findStandalonePropName(inertiaPage.props as Record<string, unknown>, props.component),\n (name, _old, onCleanup) => onCleanup(registerStandaloneProp(name ?? null)),\n { immediate: true },\n )\n\n // The watcher runs before the new payload renders: hand it over, or the response would\n // count as stale and lazy widgets (a calendar after its action) keep their old schema.\n watch(\n () => props.component.token,\n () => void state.loadLazy(props.component),\n { immediate: true },\n )\n\n if (parent) return\n\n let release: (() => void) | null = null\n let cancelled = false\n\n queueMicrotask(() => {\n if (cancelled || hasToaster()) return\n\n release = claimToaster()\n ownsToaster.value = true\n })\n\n onScopeDispose(() => {\n cancelled = true\n release?.()\n })\n})\n</script>\n\n<template>\n <component\n :is=\"parent ? 'div' : ConfigProvider\"\n :dir=\"parent ? undefined : direction\"\n :class=\"parent ? 'contents' : undefined\"\n >\n <TooltipProvider :delay-duration=\"0\">\n <div\n data-slot=\"standalone\"\n :data-alfakit-component=\"props.component.class\"\n :dir=\"direction\"\n :class=\"cn('flex flex-col gap-6', props.class)\"\n >\n <header\n v-if=\"page.heading || page.headerActions?.length\"\n data-slot=\"page-header\"\n class=\"flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between\"\n >\n <div class=\"min-w-0\">\n <h2 v-if=\"page.heading\" class=\"text-xl font-semibold tracking-tight\">\n {{ page.heading }}\n </h2>\n <p v-if=\"page.subheading\" class=\"text-muted-foreground mt-1 text-sm\">\n {{ page.subheading }}\n </p>\n </div>\n <ActionList\n v-if=\"page.headerActions && page.headerActions.length > 0\"\n :actions=\"page.headerActions\"\n :context=\"actionContext\"\n align=\"end\"\n class=\"max-w-full shrink-0\"\n />\n </header>\n <slot name=\"header\" />\n <slot :blocks=\"page.content\" :page=\"props.component\">\n <ContentBlockRenderer v-for=\"block in page.content\" :key=\"block.key\" :block=\"block\" />\n </slot>\n <slot name=\"footer\" />\n </div>\n <ActionModals />\n <AlfakitToaster v-if=\"ownsToaster\" claimed :dir=\"direction\" />\n </TooltipProvider>\n </component>\n</template>\n"],"mappings":"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"}
|
package/dist/standalone.css
CHANGED
|
@@ -54,19 +54,23 @@
|
|
|
54
54
|
--color-gray: var(--muted-foreground);
|
|
55
55
|
}
|
|
56
56
|
|
|
57
|
+
/* The same status tokens as the panel's styles.css (WCAG AA under their foregrounds). */
|
|
57
58
|
:root {
|
|
58
|
-
--success: var(--alfakit-success, oklch(0.
|
|
59
|
-
--success-foreground: oklch(0.985 0 0);
|
|
60
|
-
--warning: var(--alfakit-warning, oklch(0.
|
|
61
|
-
--warning-foreground: oklch(0.
|
|
62
|
-
--info: var(--alfakit-info, oklch(0.
|
|
63
|
-
--info-foreground: oklch(0.985 0 0);
|
|
59
|
+
--success: var(--alfakit-success, oklch(0.48 0.14 150.5));
|
|
60
|
+
--success-foreground: var(--alfakit-success-foreground, oklch(0.985 0 0));
|
|
61
|
+
--warning: var(--alfakit-warning, oklch(0.52 0.15 48));
|
|
62
|
+
--warning-foreground: var(--alfakit-warning-foreground, oklch(0.985 0 0));
|
|
63
|
+
--info: var(--alfakit-info, oklch(0.51 0.24 263.5));
|
|
64
|
+
--info-foreground: var(--alfakit-info-foreground, oklch(0.985 0 0));
|
|
64
65
|
}
|
|
65
66
|
|
|
66
67
|
.dark {
|
|
67
68
|
--success: var(--alfakit-success, oklch(0.723 0.219 149.579));
|
|
69
|
+
--success-foreground: var(--alfakit-success-foreground, oklch(0.145 0 0));
|
|
68
70
|
--warning: var(--alfakit-warning, oklch(0.828 0.189 84.429));
|
|
71
|
+
--warning-foreground: var(--alfakit-warning-foreground, oklch(0.145 0 0));
|
|
69
72
|
--info: var(--alfakit-info, oklch(0.707 0.165 254.624));
|
|
73
|
+
--info-foreground: var(--alfakit-info-foreground, oklch(0.145 0 0));
|
|
70
74
|
}
|
|
71
75
|
|
|
72
76
|
/*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlfakitStarterKitRoot.js","names":["_sfc_main","AlfakitStarterKitRoot_vue_vue_type_script_setup_true_lang_default","AlfakitStarterKitRoot_default"],"sources":["../../src/starter-kit/AlfakitStarterKitRoot.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n STARTER_KIT_TOASTER_ID,\n installStarterKitRuntime,\n syncStarterKitPage,\n type AlfakitPageProps,\n} from '@alfakit/core'\nimport { usePage } from '@inertiajs/vue3'\nimport { onMounted, onUnmounted, watch } from 'vue'\nimport AlfakitRoot from '../AlfakitRoot.vue'\nimport { setToasterId, showToast } from '../components/notifications/flash-toasts'\nimport { provideAlfakit } from '../context'\nimport { starterKitContext, type StarterKitPageOptions } from './runtime'\n\n/**\n * The Inertia layout around every Alfakit page in starter kit mode, inside the host layout:\n * Alfakit's context, modals, toasts and the reading direction. It stays mounted while the\n * user moves between Alfakit pages.\n */\nconst props = defineProps<{ options?: StarterKitPageOptions }>()\nconst context = starterKitContext(props.options ?? {})\nconst page = usePage<AlfakitPageProps>()\n\nprovideAlfakit(context)\n\n// Endpoints follow the open page (synchronously, before children run actions).\nwatch(\n () => page.props.alfakit?.endpoints,\n (endpoints) => {\n if (endpoints) {\n context.actions.setEndpoints({ action: endpoints.action ?? '', modal: endpoints.modal ?? '' })\n }\n },\n { immediate: true, flush: 'sync' },\n)\n\nonMounted(() => {\n installStarterKitRuntime(\n (notification) => showToast(notification),\n (key, replacements, fallback) => context.translator.t(key, replacements, fallback),\n )\n setToasterId(STARTER_KIT_TOASTER_ID)\n\n watch(\n () => page.props,\n (value) => syncStarterKitPage(value as AlfakitPageProps),\n { immediate: true },\n )\n})\n\nonUnmounted(() => {\n // A host page is open: its errors and toasts are the host's again.\n syncStarterKitPage(null)\n setToasterId(undefined)\n})\n</script>\n\n<template>\n <!-- The reading direction and language of Alfakit's content only: the host layout around it\n (sidebar, header) and the app's own pages keep the document's. -->\n <div\n data-slot=\"starter-kit-root\"\n :dir=\"page.props.alfakit?.localization?.direction ?? 'ltr'\"\n :lang=\"page.props.alfakit?.localization?.tag\"\n class=\"contents\"\n >\n <AlfakitRoot :toaster-id=\"STARTER_KIT_TOASTER_ID\">\n <slot />\n </AlfakitRoot>\n </div>\n</template>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"AlfakitStarterKitRoot.js","names":["_sfc_main","AlfakitStarterKitRoot_vue_vue_type_script_setup_true_lang_default","AlfakitStarterKitRoot_default"],"sources":["../../src/starter-kit/AlfakitStarterKitRoot.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n STARTER_KIT_TOASTER_ID,\n installStarterKitRuntime,\n syncStarterKitPage,\n type AlfakitPageProps,\n} from '@alfakit/core'\nimport { usePage } from '@inertiajs/vue3'\nimport { onMounted, onUnmounted, watch } from 'vue'\nimport AlfakitRoot from '../AlfakitRoot.vue'\nimport DebugPanelSlot from '../components/panel/DebugPanelSlot.vue'\nimport { setToasterId, showToast } from '../components/notifications/flash-toasts'\nimport { provideAlfakit } from '../context'\nimport { starterKitContext, type StarterKitPageOptions } from './runtime'\n\n/**\n * The Inertia layout around every Alfakit page in starter kit mode, inside the host layout:\n * Alfakit's context, modals, toasts and the reading direction. It stays mounted while the\n * user moves between Alfakit pages.\n */\nconst props = defineProps<{ options?: StarterKitPageOptions }>()\nconst context = starterKitContext(props.options ?? {})\nconst page = usePage<AlfakitPageProps>()\n\nprovideAlfakit(context)\n\n// Endpoints follow the open page (synchronously, before children run actions).\nwatch(\n () => page.props.alfakit?.endpoints,\n (endpoints) => {\n if (endpoints) {\n context.actions.setEndpoints({ action: endpoints.action ?? '', modal: endpoints.modal ?? '' })\n }\n },\n { immediate: true, flush: 'sync' },\n)\n\nonMounted(() => {\n installStarterKitRuntime(\n (notification) => showToast(notification),\n (key, replacements, fallback) => context.translator.t(key, replacements, fallback),\n )\n setToasterId(STARTER_KIT_TOASTER_ID)\n\n watch(\n () => page.props,\n (value) => syncStarterKitPage(value as AlfakitPageProps),\n { immediate: true },\n )\n})\n\nonUnmounted(() => {\n // A host page is open: its errors and toasts are the host's again.\n syncStarterKitPage(null)\n setToasterId(undefined)\n})\n</script>\n\n<template>\n <!-- The reading direction and language of Alfakit's content only: the host layout around it\n (sidebar, header) and the app's own pages keep the document's. -->\n <div\n data-slot=\"starter-kit-root\"\n :dir=\"page.props.alfakit?.localization?.direction ?? 'ltr'\"\n :lang=\"page.props.alfakit?.localization?.tag\"\n class=\"contents\"\n >\n <AlfakitRoot :toaster-id=\"STARTER_KIT_TOASTER_ID\">\n <slot />\n <!-- The debug panel's button lives in AlfaKit's top bar, which a starter kit doesn't\n render: float it in the corner (nothing without `alfakitDebug`). -->\n <div data-slot=\"starter-kit-debug-panel\" class=\"fixed end-16 bottom-4 z-40\">\n <DebugPanelSlot />\n </div>\n </AlfakitRoot>\n </div>\n</template>\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlfakitStarterKitRoot.vue.d.ts","sourceRoot":"","sources":["../../src/starter-kit/AlfakitStarterKitRoot.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AlfakitStarterKitRoot.vue.d.ts","sourceRoot":"","sources":["../../src/starter-kit/AlfakitStarterKitRoot.vue"],"names":[],"mappings":"AA2FA,OAAO,EAAqB,KAAK,qBAAqB,EAAE,MAAM,WAAW,CAAA;AAEzE;;;;GAIG;AACH,KAAK,WAAW,GAAG;IAAE,OAAO,CAAC,EAAE,qBAAqB,CAAA;CAAE,CAAC;AAgFvD,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAsB/C,QAAA,MAAM,eAAe,kSAMnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|