@alfakit/vue 0.0.0-stage → 0.1.0

package/dist/components/cms/context.d.ts

@@ -0,0 +1,29 @@
+import { type CmsPayload, type Translator } from '@alfakit/core';
+import { type ComputedRef, type InjectionKey } from 'vue';
+import { type AnyComponent } from '../../context';
+export interface CmsContextValue {
+    /** `t('cms.preview', {}, 'Preview')` over the page's strings (or the panel's). */
+    t: Translator['t'];
+    /** Block renderers passed to `<CmsBlocks :components>` / `<CmsPage :components>`. */
+    components: Record<string, AnyComponent>;
+    direction: 'ltr' | 'rtl';
+    preview: boolean;
+}
+export declare const CMS_KEY: InjectionKey<ComputedRef<CmsContextValue>>;
+/** Block renderers of an outer `<CmsBlocks :components>`, for blocks inside columns. */
+export declare const CMS_COMPONENTS_KEY: InjectionKey<Record<string, AnyComponent>>;
+/** Blocks inside a columns block: the column already has the page padding. */
+export declare const CMS_NESTED_KEY: InjectionKey<boolean>;
+type PayloadSource = () => Pick<CmsPayload, 'translations' | 'site' | 'preview'> | null | undefined;
+/**
+ * Provide the strings, direction and block renderers of a CMS page. `CmsPage` calls it;
+ * call it in your own page when you render `<CmsBlocks>` outside `CmsPage`.
+ */
+export declare function provideCms(payload: PayloadSource, components?: () => Record<string, AnyComponent> | undefined): ComputedRef<CmsContextValue>;
+export declare function useCms(): ComputedRef<CmsContextValue>;
+/** `t()` of the current CMS context. */
+export declare function useCmsT(): Translator['t'];
+/** The outer padding of a block, none when it is nested in a column. */
+export declare function useSectionClass(extra?: string): string;
+export {};
+//# sourceMappingURL=context.d.ts.map

package/dist/components/cms/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/components/cms/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,UAAU,EAAE,KAAK,UAAU,EAAE,MAAM,eAAe,CAAA;AACrF,OAAO,EAA6B,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,KAAK,CAAA;AACpF,OAAO,EAAsB,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAErE,MAAM,WAAW,eAAe;IAC9B,kFAAkF;IAClF,CAAC,EAAE,UAAU,CAAC,GAAG,CAAC,CAAA;IAClB,qFAAqF;IACrF,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;IACxC,SAAS,EAAE,KAAK,GAAG,KAAK,CAAA;IACxB,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,eAAO,MAAM,OAAO,EAAE,YAAY,CAAC,WAAW,CAAC,eAAe,CAAC,CAAyB,CAAA;AAExF,wFAAwF;AACxF,eAAO,MAAM,kBAAkB,EAAE,YAAY,CAAC,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CACxC,CAAA;AAElC,8EAA8E;AAC9E,eAAO,MAAM,cAAc,EAAE,YAAY,CAAC,OAAO,CAAgC,CAAA;AAEjF,KAAK,aAAa,GAAG,MAAM,IAAI,CAAC,UAAU,EAAE,cAAc,GAAG,MAAM,GAAG,SAAS,CAAC,GAAG,IAAI,GAAG,SAAS,CAAA;AAEnG;;;GAGG;AACH,wBAAgB,UAAU,CACxB,OAAO,EAAE,aAAa,EACtB,UAAU,GAAE,MAAM,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,GAAG,SAA2B,GAC3E,WAAW,CAAC,eAAe,CAAC,CAqB9B;AAQD,wBAAgB,MAAM,IAAI,WAAW,CAAC,eAAe,CAAC,CAErD;AAED,wCAAwC;AACxC,wBAAgB,OAAO,IAAI,UAAU,CAAC,GAAG,CAAC,CAIzC;AAID,wEAAwE;AACxE,wBAAgB,eAAe,CAAC,KAAK,SAAK,GAAG,MAAM,CAElD"}

package/dist/components/cms/context.js

@@ -0,0 +1,41 @@
+import { useOptionalAlfakit as e } from "../../context.js";
+import { createCmsTranslator as t } from "@alfakit/core";
+import { computed as n, inject as r, provide as i } from "vue";
+//#region src/components/cms/context.ts
+var a = Symbol("alfakit.cms"), o = Symbol("alfakit.cms.components"), s = Symbol("alfakit.cms.nested");
+function c(r, o = () => void 0) {
+	let s = e(), c = n(() => {
+		let e = r(), n = e?.translations ? t(e) : s?.translator ?? t(null);
+		return {
+			t: n.t.bind(n),
+			components: o() ?? {},
+			direction: e?.site?.direction ?? "ltr",
+			preview: e?.preview ?? !1
+		};
+	});
+	return i(a, c), c;
+}
+var l = n(() => {
+	let e = t(null);
+	return {
+		t: e.t.bind(e),
+		components: {},
+		direction: "ltr",
+		preview: !1
+	};
+});
+function u() {
+	return r(a, l);
+}
+function d() {
+	let e = u();
+	return (t, n, r) => e.value.t(t, n, r);
+}
+var f = "px-4 py-12 sm:px-6 sm:py-16 lg:px-8";
+function p(e = "") {
+	return r(s, !1) ? "py-3" : `${f} ${e}`.trim();
+}
+//#endregion
+export { o as CMS_COMPONENTS_KEY, a as CMS_KEY, s as CMS_NESTED_KEY, c as provideCms, u as useCms, d as useCmsT, p as useSectionClass };
+
+//# sourceMappingURL=context.js.map

package/dist/components/cms/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","names":["CMS_KEY","CMS_COMPONENTS_KEY","CMS_NESTED_KEY","provideCms","alfakit","useOptionalAlfakit","value","computed","current","payload","translator","createCmsTranslator","components","provide","FALLBACK","useCms","inject","useCmsT","cms","key","replacements","fallback","SECTION","useSectionClass","extra"],"sources":["../../../src/components/cms/context.ts"],"sourcesContent":["import { createCmsTranslator, type CmsPayload, type Translator } from '@alfakit/core'\nimport { computed, inject, provide, type ComputedRef, type InjectionKey } from 'vue'\nimport { useOptionalAlfakit, type AnyComponent } from '../../context'\n\nexport interface CmsContextValue {\n  /** `t('cms.preview', {}, 'Preview')` over the page's strings (or the panel's). */\n  t: Translator['t']\n  /** Block renderers passed to `<CmsBlocks :components>` / `<CmsPage :components>`. */\n  components: Record<string, AnyComponent>\n  direction: 'ltr' | 'rtl'\n  preview: boolean\n}\n\nexport const CMS_KEY: InjectionKey<ComputedRef<CmsContextValue>> = Symbol('alfakit.cms')\n\n/** Block renderers of an outer `<CmsBlocks :components>`, for blocks inside columns. */\nexport const CMS_COMPONENTS_KEY: InjectionKey<Record<string, AnyComponent>> =\n  Symbol('alfakit.cms.components')\n\n/** Blocks inside a columns block: the column already has the page padding. */\nexport const CMS_NESTED_KEY: InjectionKey<boolean> = Symbol('alfakit.cms.nested')\n\ntype PayloadSource = () => Pick<CmsPayload, 'translations' | 'site' | 'preview'> | null | undefined\n\n/**\n * Provide the strings, direction and block renderers of a CMS page. `CmsPage` calls it;\n * call it in your own page when you render `<CmsBlocks>` outside `CmsPage`.\n */\nexport function provideCms(\n  payload: PayloadSource,\n  components: () => Record<string, AnyComponent> | undefined = () => undefined,\n): ComputedRef<CmsContextValue> {\n  const alfakit = useOptionalAlfakit()\n\n  const value = computed<CmsContextValue>(() => {\n    const current = payload()\n    // Inside a panel app the shared translator already has `cms.*`; a public page brings its own.\n    const translator = current?.translations\n      ? createCmsTranslator(current)\n      : (alfakit?.translator ?? createCmsTranslator(null))\n\n    return {\n      t: translator.t.bind(translator),\n      components: components() ?? {},\n      direction: current?.site?.direction ?? 'ltr',\n      preview: current?.preview ?? false,\n    }\n  })\n\n  provide(CMS_KEY, value)\n\n  return value\n}\n\nconst FALLBACK = computed<CmsContextValue>(() => {\n  const translator = createCmsTranslator(null)\n\n  return { t: translator.t.bind(translator), components: {}, direction: 'ltr', preview: false }\n})\n\nexport function useCms(): ComputedRef<CmsContextValue> {\n  return inject(CMS_KEY, FALLBACK)\n}\n\n/** `t()` of the current CMS context. */\nexport function useCmsT(): Translator['t'] {\n  const cms = useCms()\n\n  return (key, replacements, fallback) => cms.value.t(key, replacements, fallback)\n}\n\nconst SECTION = 'px-4 py-12 sm:px-6 sm:py-16 lg:px-8'\n\n/** The outer padding of a block, none when it is nested in a column. */\nexport function useSectionClass(extra = ''): string {\n  return inject(CMS_NESTED_KEY, false) ? 'py-3' : `${SECTION} ${extra}`.trim()\n}\n"],"mappings":";;;;AAaA,IAAaA,IAAsD,OAAO,aAAa,GAG1EC,IACX,OAAO,wBAAwB,GAGpBC,IAAwC,OAAO,oBAAoB;AAQhF,SAAgBC,EACd,GACA,UAAmE,KAAA,GACrC;CAC9B,IAAMC,IAAUC,EAAmB,GAE7BC,IAAQC,QAAgC;EAC5C,IAAMC,IAAUC,EAAQ,GAElBC,IAAaF,GAAS,eACxBG,EAAoBH,CAAO,IAC1BJ,GAAS,cAAcO,EAAoB,IAAI;EAEpD,OAAO;GACL,GAAGD,EAAW,EAAE,KAAKA,CAAU;GAC/B,YAAYE,EAAW,KAAK,CAAC;GAC7B,WAAWJ,GAAS,MAAM,aAAa;GACvC,SAASA,GAAS,WAAW;EAC/B;CACF,CAAC;CAID,OAFAK,EAAQb,GAASM,CAAK,GAEfA;AACT;AAEA,IAAMQ,IAAWP,QAAgC;CAC/C,IAAMG,IAAaC,EAAoB,IAAI;CAE3C,OAAO;EAAE,GAAGD,EAAW,EAAE,KAAKA,CAAU;EAAG,YAAY,CAAC;EAAG,WAAW;EAAO,SAAS;CAAM;AAC9F,CAAC;AAED,SAAgBK,IAAuC;CACrD,OAAOC,EAAOhB,GAASc,CAAQ;AACjC;AAGA,SAAgBG,IAA2B;CACzC,IAAMC,IAAMH,EAAO;CAEnB,QAAQ,GAAK,GAAc,MAAaG,EAAI,MAAM,EAAEC,GAAKC,GAAcC,CAAQ;AACjF;AAEA,IAAMC,IAAU;AAGhB,SAAgBC,EAAgB,IAAQ,IAAY;CAClD,OAAOP,EAAOd,GAAgB,EAAK,IAAI,SAAS,GAAGoB,EAAQ,GAAGE,IAAQ,KAAK;AAC7E"}

package/dist/components/cms/index.d.ts

@@ -0,0 +1,27 @@
+export { CMS_BLOCK_COMPONENTS } from './blocks';
+export { default as CallToActionBlock } from './CallToActionBlock.vue';
+export { default as CmsBlockHeading } from './CmsBlockHeading.vue';
+export { default as CmsBlocks } from './CmsBlocks.vue';
+export { default as CmsFooter } from './CmsFooter.vue';
+export { default as CmsHead } from './CmsHead.vue';
+export { default as CmsHeader } from './CmsHeader.vue';
+export { default as CmsImage } from './CmsImage.vue';
+export { default as CmsLanguageSwitcher } from './CmsLanguageSwitcher.vue';
+export { default as CmsLinkButton } from './CmsLinkButton.vue';
+export { default as CmsMenuList } from './CmsMenuList.vue';
+export { default as CmsNav } from './CmsNav.vue';
+export { default as CmsPage } from './CmsPage.vue';
+export { default as ColumnsBlock } from './ColumnsBlock.vue';
+export { CMS_KEY, provideCms, useCms, useCmsT, type CmsContextValue } from './context';
+export { default as EmbedBlock } from './EmbedBlock.vue';
+export { default as FaqBlock } from './FaqBlock.vue';
+export { default as FeaturesBlock } from './FeaturesBlock.vue';
+export { default as FormBlock } from './FormBlock.vue';
+export { default as GalleryBlock } from './GalleryBlock.vue';
+export { default as HeroBlock } from './HeroBlock.vue';
+export { default as ImageBlock } from './ImageBlock.vue';
+export { CmsLivePreview } from './live-preview-lazy';
+export { default as RichTextBlock } from './RichTextBlock.vue';
+export { default as SectionBlock } from './SectionBlock.vue';
+export { default as TestimonialsBlock } from './TestimonialsBlock.vue';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/cms/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/cms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;AAC/C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAA;AAClE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACpD,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AAC1E,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAC1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,cAAc,CAAA;AAChD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAC5D,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,WAAW,CAAA;AACtF,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACpD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAC5D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAC5D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yBAAyB,CAAA"}

package/dist/components/cms/index.js

@@ -0,0 +1,27 @@
+import { CMS_KEY as e, provideCms as t, useCms as n, useCmsT as r } from "./context.js";
+import i from "./CmsLinkButton.js";
+import a from "./CallToActionBlock.js";
+import o from "./CmsBlocks.js";
+import s from "./ColumnsBlock.js";
+import c from "./EmbedBlock.js";
+import l from "./CmsBlockHeading.js";
+import u from "./FaqBlock.js";
+import d from "./FeaturesBlock.js";
+import f from "./FormBlock.js";
+import p from "./CmsImage.js";
+import m from "./GalleryBlock.js";
+import h from "./HeroBlock.js";
+import g from "./ImageBlock.js";
+import _ from "./RichTextBlock.js";
+import v from "./SectionBlock.js";
+import y from "./TestimonialsBlock.js";
+import { CMS_BLOCK_COMPONENTS as b } from "./blocks.js";
+import x from "./CmsLanguageSwitcher.js";
+import S from "./CmsMenuList.js";
+import C from "./CmsFooter.js";
+import w from "./CmsHead.js";
+import T from "./CmsNav.js";
+import E from "./CmsHeader.js";
+import D from "./CmsPage.js";
+import { CmsLivePreview as O } from "./live-preview-lazy.js";
+export { b as CMS_BLOCK_COMPONENTS, e as CMS_KEY, a as CallToActionBlock, l as CmsBlockHeading, o as CmsBlocks, C as CmsFooter, w as CmsHead, E as CmsHeader, p as CmsImage, x as CmsLanguageSwitcher, i as CmsLinkButton, O as CmsLivePreview, S as CmsMenuList, T as CmsNav, D as CmsPage, s as ColumnsBlock, c as EmbedBlock, u as FaqBlock, d as FeaturesBlock, f as FormBlock, m as GalleryBlock, h as HeroBlock, g as ImageBlock, _ as RichTextBlock, v as SectionBlock, y as TestimonialsBlock, t as provideCms, n as useCms, r as useCmsT };

package/dist/components/cms/link-class.d.ts

@@ -0,0 +1,3 @@
+/** The look of menu links (shared by the header, the mobile menu and the footer). */
+export declare const CMS_LINK_CLASS = "hover:text-foreground focus-visible:ring-ring/50 rounded-md px-3 py-2 text-sm font-medium outline-none focus-visible:ring-[3px] data-[active]:text-foreground text-muted-foreground aria-[current=page]:text-foreground";
+//# sourceMappingURL=link-class.d.ts.map

package/dist/components/cms/link-class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-class.d.ts","sourceRoot":"","sources":["../../../src/components/cms/link-class.ts"],"names":[],"mappings":"AAAA,qFAAqF;AACrF,eAAO,MAAM,cAAc,4NACgM,CAAA"}

package/dist/components/cms/link-class.js

@@ -0,0 +1,6 @@
+//#region src/components/cms/link-class.ts
+var e = "hover:text-foreground focus-visible:ring-ring/50 rounded-md px-3 py-2 text-sm font-medium outline-none focus-visible:ring-[3px] data-[active]:text-foreground text-muted-foreground aria-[current=page]:text-foreground";
+//#endregion
+export { e as CMS_LINK_CLASS };
+
+//# sourceMappingURL=link-class.js.map

package/dist/components/cms/link-class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-class.js","names":["CMS_LINK_CLASS"],"sources":["../../../src/components/cms/link-class.ts"],"sourcesContent":["/** The look of menu links (shared by the header, the mobile menu and the footer). */\nexport const CMS_LINK_CLASS =\n  'hover:text-foreground focus-visible:ring-ring/50 rounded-md px-3 py-2 text-sm font-medium outline-none focus-visible:ring-[3px] data-[active]:text-foreground text-muted-foreground aria-[current=page]:text-foreground'\n"],"mappings":";AACA,IAAaA,IACX"}

package/dist/components/cms/live-preview-lazy.d.ts

@@ -0,0 +1,3 @@
+/** The live preview; its code loads the first time a page editor is opened. */
+export declare const CmsLivePreview: import("vue").Component;
+//# sourceMappingURL=live-preview-lazy.d.ts.map

package/dist/components/cms/live-preview-lazy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-preview-lazy.d.ts","sourceRoot":"","sources":["../../../src/components/cms/live-preview-lazy.ts"],"names":[],"mappings":"AAGA,+EAA+E;AAC/E,eAAO,MAAM,cAAc,yBAI1B,CAAA"}

package/dist/components/cms/live-preview-lazy.js

@@ -0,0 +1,8 @@
+import { lazyComponent as e } from "../../lib/lazy.js";
+import t from "./LivePreviewSkeleton.js";
+//#region src/components/cms/live-preview-lazy.ts
+var n = e("CmsLivePreview", () => import("./LivePreview.js").then((e) => e.default), t);
+//#endregion
+export { n as CmsLivePreview };
+
+//# sourceMappingURL=live-preview-lazy.js.map

package/dist/components/cms/live-preview-lazy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-preview-lazy.js","names":["LivePreviewSkeleton","LivePreviewSkeleton_default","CmsLivePreview","lazyComponent","module"],"sources":["../../../src/components/cms/live-preview-lazy.ts"],"sourcesContent":["import { lazyComponent } from '../../lib/lazy'\nimport LivePreviewSkeleton from './LivePreviewSkeleton.vue'\n\n/** The live preview; its code loads the first time a page editor is opened. */\nexport const CmsLivePreview = lazyComponent(\n  'CmsLivePreview',\n  () => import('./LivePreview.vue').then((module) => module.default),\n  LivePreviewSkeleton,\n)\n"],"mappings":";;;AAIA,IAAaE,IAAiBC,EAC5B,wBACM,OAAO,mBAAoB,CAAC,MAAM,MAAWC,EAAO,OAAO,GACjEJ,CACF"}

package/dist/components/dev-tools/DevToolsInspector.js

@@ -0,0 +1,7 @@
+import e from "./DevToolsInspector.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/dev-tools/DevToolsInspector.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=DevToolsInspector.js.map

package/dist/components/dev-tools/DevToolsInspector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DevToolsInspector.js","names":["_sfc_main","DevToolsInspector_vue_vue_type_script_setup_true_lang_default","DevToolsInspector_default"],"sources":["../../../src/components/dev-tools/DevToolsInspector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  byteLength,\n  formatBytes,\n  inspectableProps,\n  jsonEntries,\n  jsonScalar,\n  latestServerTiming,\n  prettyJson,\n  searchJson,\n} from '@alfakit/core'\nimport { router } from '@inertiajs/vue3'\nimport { BracesIcon, CheckIcon, CopyIcon, ExternalLinkIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue'\nimport { useAlfakitProps, useDirection, useFormatter, useT } from '../../context'\nimport Button from '../ui/Button.vue'\nimport Input from '../ui/Input.vue'\nimport ScrollArea from '../ui/ScrollArea.vue'\nimport Sheet from '../ui/Sheet.vue'\nimport SheetContent from '../ui/SheetContent.vue'\nimport SheetDescription from '../ui/SheetDescription.vue'\nimport SheetHeader from '../ui/SheetHeader.vue'\nimport SheetTitle from '../ui/SheetTitle.vue'\nimport SheetTrigger from '../ui/SheetTrigger.vue'\nimport DevToolsJsonNode from './DevToolsJsonNode.vue'\n\n/**\n * The schema inspector: a floating developer button that opens a drawer with the page's\n * props as a searchable JSON tree (with a copy button), what the context token identifies,\n * the server time reported in `Server-Timing`, the payload size and editor links for the\n * PHP classes behind the page. Rendered only for pages that carry `alfakitDevTools`.\n */\nconst t = useT()\nconst formatter = useFormatter()\nconst direction = useDirection()\nconst props = useAlfakitProps()\nconst tools = computed(() => props.value.alfakitDevTools)\nconst data = computed(() => inspectableProps(props.value as unknown as Record<string, unknown>))\nconst payload = computed(() => byteLength(props.value))\nconst query = ref('')\nconst copied = ref(false)\nconst serverTime = ref<number | null>(null)\nconst search = computed(() => searchJson(data.value, query.value))\nconst roots = computed(() => jsonEntries(data.value))\nconst parameters = computed(() => Object.entries(tools.value?.context.parameters ?? {}))\n\nlet stop: (() => void) | undefined\nlet timer: ReturnType<typeof setTimeout> | undefined\n\nonMounted(() => {\n  serverTime.value = latestServerTiming()\n  // Re-read after every visit: the latest response carries the newest header.\n  stop = router.on('finish', () => {\n    serverTime.value = latestServerTiming()\n  })\n})\n\nonBeforeUnmount(() => {\n  stop?.()\n  clearTimeout(timer)\n})\n\nconst copy = () => {\n  void navigator.clipboard?.writeText(prettyJson(data.value)).then(() => {\n    copied.value = true\n    clearTimeout(timer)\n    timer = setTimeout(() => (copied.value = false), 2000)\n  })\n}\n\nconst time = (value: number | null) =>\n  value === null ? t('dev_tools.never', {}, 'Never') : formatter.value.dateTime(value * 1000)\n</script>\n\n<template>\n  <Sheet v-if=\"tools\">\n    <SheetTrigger as-child>\n      <Button\n        type=\"button\"\n        variant=\"outline\"\n        size=\"icon\"\n        :aria-label=\"t('dev_tools.open', {}, 'Open schema inspector')\"\n        data-slot=\"dev-tools-toggle\"\n        class=\"fixed end-4 bottom-4 z-40 rounded-full shadow-md\"\n      >\n        <BracesIcon />\n      </Button>\n    </SheetTrigger>\n    <SheetContent\n      :side=\"direction === 'rtl' ? 'left' : 'right'\"\n      class=\"flex w-full flex-col gap-0 p-0 sm:max-w-xl\"\n    >\n      <div data-slot=\"dev-tools\" class=\"flex min-h-0 flex-1 flex-col\">\n        <SheetHeader class=\"border-b\">\n          <SheetTitle class=\"flex items-center gap-2\">\n            <BracesIcon class=\"size-4\" />\n            {{ t('dev_tools.title', {}, 'Schema inspector') }}\n          </SheetTitle>\n          <SheetDescription class=\"truncate font-mono text-xs\" :title=\"tools.context.page\">\n            {{ tools.context.page }}\n          </SheetDescription>\n        </SheetHeader>\n        <ScrollArea class=\"min-h-0 flex-1\">\n          <div class=\"space-y-5 p-4 text-sm\">\n            <dl class=\"grid grid-cols-2 gap-3\">\n              <div class=\"rounded-md border p-3\">\n                <dt class=\"text-muted-foreground text-xs\">\n                  {{ t('dev_tools.server_time', {}, 'Server time') }}\n                </dt>\n                <dd class=\"font-mono text-sm font-semibold tabular-nums\">\n                  {{\n                    serverTime === null\n                      ? t('dev_tools.not_measured', {}, 'Not measured')\n                      : t(\n                          'dev_tools.milliseconds',\n                          { value: formatter.number(serverTime) },\n                          ':value ms',\n                        )\n                  }}\n                </dd>\n              </div>\n              <div class=\"rounded-md border p-3\">\n                <dt class=\"text-muted-foreground text-xs\">\n                  {{ t('dev_tools.payload', {}, 'Payload size') }}\n                </dt>\n                <dd class=\"font-mono text-sm font-semibold tabular-nums\">\n                  {{ formatBytes(payload) }}\n                </dd>\n              </div>\n            </dl>\n\n            <section data-slot=\"dev-tools-context\">\n              <h3 class=\"mb-2 text-sm font-medium\">\n                {{ t('dev_tools.context', {}, 'Context token') }}\n              </h3>\n              <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-xs\">\n                <dt class=\"text-muted-foreground\">{{ t('dev_tools.panel', {}, 'Panel') }}</dt>\n                <dd class=\"min-w-0 truncate font-mono\">{{ tools.context.panel }}</dd>\n                <dt class=\"text-muted-foreground\">{{ t('dev_tools.page', {}, 'Page') }}</dt>\n                <dd class=\"min-w-0 truncate font-mono\" :title=\"tools.context.page\">\n                  {{ tools.context.page }}\n                </dd>\n                <template v-if=\"tools.context.component\">\n                  <dt class=\"text-muted-foreground\">\n                    {{ t('dev_tools.component', {}, 'Component') }}\n                  </dt>\n                  <dd class=\"min-w-0 truncate font-mono\">{{ tools.context.component }}</dd>\n                </template>\n                <template v-if=\"tools.tenant !== null\">\n                  <dt class=\"text-muted-foreground\">{{ t('dev_tools.tenant', {}, 'Tenant') }}</dt>\n                  <dd class=\"min-w-0 truncate font-mono\">{{ tools.tenant }}</dd>\n                </template>\n                <template v-for=\"[key, value] in parameters\" :key=\"key\">\n                  <dt class=\"text-muted-foreground\">{{ key }}</dt>\n                  <dd class=\"min-w-0 truncate font-mono\">{{ jsonScalar(value) }}</dd>\n                </template>\n                <dt class=\"text-muted-foreground\">\n                  {{ t('dev_tools.bound_to_user', {}, 'Bound to the user') }}\n                </dt>\n                <dd>\n                  {{\n                    tools.context.boundToUser\n                      ? t('dev_tools.yes', {}, 'Yes')\n                      : t('dev_tools.no', {}, 'No')\n                  }}\n                </dd>\n                <dt class=\"text-muted-foreground\">{{ t('dev_tools.issued_at', {}, 'Issued') }}</dt>\n                <dd>{{ time(tools.context.issuedAt) }}</dd>\n                <dt class=\"text-muted-foreground\">\n                  {{ t('dev_tools.expires_at', {}, 'Expires') }}\n                </dt>\n                <dd>{{ time(tools.context.expiresAt) }}</dd>\n              </dl>\n            </section>\n\n            <section data-slot=\"dev-tools-classes\">\n              <h3 class=\"mb-2 text-sm font-medium\">{{ t('dev_tools.classes', {}, 'Classes') }}</h3>\n              <ul class=\"divide-y rounded-md border text-xs\">\n                <li\n                  v-for=\"item in tools.classes\"\n                  :key=\"item.role\"\n                  class=\"flex items-center gap-2 px-3 py-1.5\"\n                >\n                  <span class=\"text-muted-foreground w-16 shrink-0\">\n                    {{ t(`dev_tools.roles.${item.role}`, {}, item.role) }}\n                  </span>\n                  <span\n                    class=\"min-w-0 flex-1 truncate font-mono\"\n                    :title=\"item.file ? `${item.file}:${item.line ?? 1}` : item.class\"\n                  >\n                    {{ item.class }}\n                  </span>\n                  <a\n                    v-if=\"item.url\"\n                    :href=\"item.url\"\n                    class=\"text-primary inline-flex shrink-0 items-center gap-1 hover:underline\"\n                    :aria-label=\"\n                      t(\n                        'dev_tools.open_in_editor',\n                        { class: item.class, editor: tools.editor ?? '' },\n                        'Open :class in :editor',\n                      )\n                    \"\n                  >\n                    <ExternalLinkIcon class=\"size-3.5\" />\n                  </a>\n                </li>\n              </ul>\n              <p v-if=\"tools.editor === null\" class=\"text-muted-foreground mt-2 text-xs\">\n                {{\n                  t(\n                    'dev_tools.no_editor',\n                    {},\n                    'Set APP_EDITOR (config app.editor) to open these classes in your editor.',\n                  )\n                }}\n              </p>\n            </section>\n\n            <section data-slot=\"dev-tools-schema\">\n              <div class=\"mb-2 flex items-center gap-2\">\n                <h3 class=\"me-auto text-sm font-medium\">\n                  {{ t('dev_tools.schema', {}, 'Schema') }}\n                </h3>\n                <Button type=\"button\" variant=\"ghost\" size=\"sm\" @click=\"copy\">\n                  <CheckIcon v-if=\"copied\" />\n                  <CopyIcon v-else />\n                  {{\n                    copied\n                      ? t('dev_tools.copied', {}, 'Copied')\n                      : t('dev_tools.copy', {}, 'Copy JSON')\n                  }}\n                </Button>\n              </div>\n              <Input\n                v-model=\"query\"\n                type=\"search\"\n                :placeholder=\"t('dev_tools.search', {}, 'Search keys and values')\"\n                :aria-label=\"t('dev_tools.search', {}, 'Search keys and values')\"\n                class=\"mb-2 h-8\"\n              />\n              <p\n                v-if=\"query.trim() !== '' && search.matches.size === 0\"\n                class=\"text-muted-foreground text-sm\"\n              >\n                {{\n                  t('dev_tools.no_matches', { query: query.trim() }, 'Nothing matches “:query”.')\n                }}\n              </p>\n              <ul\n                v-else\n                dir=\"ltr\"\n                role=\"tree\"\n                :aria-label=\"t('dev_tools.schema', {}, 'Schema')\"\n                class=\"bg-muted/40 overflow-x-auto rounded-md p-2 text-start font-mono text-xs leading-relaxed\"\n              >\n                <DevToolsJsonNode\n                  v-for=\"entry in roots\"\n                  :key=\"entry.path\"\n                  :entry=\"entry\"\n                  :depth=\"0\"\n                  :search=\"search\"\n                  :query=\"query\"\n                />\n              </ul>\n            </section>\n          </div>\n        </ScrollArea>\n      </div>\n    </SheetContent>\n  </Sheet>\n</template>\n"],"mappings":""}

package/dist/components/dev-tools/DevToolsInspector.vue.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;
+//# sourceMappingURL=DevToolsInspector.vue.d.ts.map

package/dist/components/dev-tools/DevToolsInspector.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DevToolsInspector.vue.d.ts","sourceRoot":"","sources":["../../../src/components/dev-tools/DevToolsInspector.vue"],"names":[],"mappings":";AAi6BA,wBAKG"}

package/dist/components/dev-tools/DevToolsInspector.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,168 @@
+import { useAlfakitProps as e, useDirection as t, useFormatter as ee, useT as te } from "../../context.js";
+import n from "../ui/Button2.js";
+import ne from "../ui/Input.js";
+import re from "../ui/Sheet.js";
+import r from "../ui/SheetContent.js";
+import ie from "../ui/SheetDescription.js";
+import ae from "../ui/SheetHeader.js";
+import oe from "../ui/SheetTitle.js";
+import i from "../ui/SheetTrigger.js";
+import a from "../ui/ScrollArea.js";
+import o from "./DevToolsJsonNode.js";
+import { byteLength as s, formatBytes as c, inspectableProps as l, jsonEntries as se, jsonScalar as ce, latestServerTiming as u, prettyJson as le, searchJson as ue } from "@alfakit/core";
+import { router as de } from "@inertiajs/vue3";
+import { Fragment as d, computed as f, createBlock as p, createCommentVNode as m, createElementBlock as h, createElementVNode as g, createTextVNode as _, createVNode as v, defineComponent as fe, onBeforeUnmount as pe, onMounted as y, openBlock as b, ref as x, renderList as S, toDisplayString as C, unref as w, withCtx as T } from "vue";
+import { BracesIcon as E, CheckIcon as D, CopyIcon as O, ExternalLinkIcon as k } from "@lucide/vue";
+//#region src/components/dev-tools/DevToolsInspector.vue?vue&type=script&setup=true&lang.ts
+var A = {
+	"data-slot": "dev-tools",
+	class: "flex min-h-0 flex-1 flex-col"
+}, j = { class: "space-y-5 p-4 text-sm" }, M = { class: "grid grid-cols-2 gap-3" }, N = { class: "rounded-md border p-3" }, P = { class: "text-muted-foreground text-xs" }, F = { class: "font-mono text-sm font-semibold tabular-nums" }, I = { class: "rounded-md border p-3" }, L = { class: "text-muted-foreground text-xs" }, R = { class: "font-mono text-sm font-semibold tabular-nums" }, z = { "data-slot": "dev-tools-context" }, B = { class: "mb-2 text-sm font-medium" }, me = { class: "grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-xs" }, he = { class: "text-muted-foreground" }, ge = { class: "min-w-0 truncate font-mono" }, _e = { class: "text-muted-foreground" }, ve = ["title"], ye = { class: "text-muted-foreground" }, be = { class: "min-w-0 truncate font-mono" }, xe = { class: "text-muted-foreground" }, Se = { class: "min-w-0 truncate font-mono" }, Ce = { class: "text-muted-foreground" }, V = { class: "min-w-0 truncate font-mono" }, we = { class: "text-muted-foreground" }, Te = { class: "text-muted-foreground" }, Ee = { class: "text-muted-foreground" }, De = { "data-slot": "dev-tools-classes" }, Oe = { class: "mb-2 text-sm font-medium" }, ke = { class: "divide-y rounded-md border text-xs" }, Ae = { class: "text-muted-foreground w-16 shrink-0" }, je = ["title"], Me = ["href", "aria-label"], Ne = {
+	key: 0,
+	class: "text-muted-foreground mt-2 text-xs"
+}, Pe = { "data-slot": "dev-tools-schema" }, Fe = { class: "mb-2 flex items-center gap-2" }, Ie = { class: "me-auto text-sm font-medium" }, Le = {
+	key: 0,
+	class: "text-muted-foreground text-sm"
+}, Re = ["aria-label"], H = /*@__PURE__*/ fe({
+	__name: "DevToolsInspector",
+	setup(fe) {
+		let H = te(), U = ee(), ze = t(), W = e(), G = f(() => W.value.alfakitDevTools), K = f(() => l(W.value)), Be = f(() => s(W.value)), q = x(""), J = x(!1), Y = x(null), X = f(() => ue(K.value, q.value)), Ve = f(() => se(K.value)), He = f(() => Object.entries(G.value?.context.parameters ?? {})), Z, Q;
+		y(() => {
+			Y.value = u(), Z = de.on("finish", () => {
+				Y.value = u();
+			});
+		}), pe(() => {
+			Z?.(), clearTimeout(Q);
+		});
+		let Ue = () => {
+			navigator.clipboard?.writeText(le(K.value)).then(() => {
+				J.value = !0, clearTimeout(Q), Q = setTimeout(() => J.value = !1, 2e3);
+			});
+		}, $ = (e) => e === null ? H("dev_tools.never", {}, "Never") : U.value.dateTime(e * 1e3);
+		return (e, t) => G.value ? (b(), p(re, { key: 0 }, {
+			default: T(() => [v(i, { "as-child": "" }, {
+				default: T(() => [v(n, {
+					type: "button",
+					variant: "outline",
+					size: "icon",
+					"aria-label": w(H)("dev_tools.open", {}, "Open schema inspector"),
+					"data-slot": "dev-tools-toggle",
+					class: "fixed end-4 bottom-4 z-40 rounded-full shadow-md"
+				}, {
+					default: T(() => [v(w(E))]),
+					_: 1
+				}, 8, ["aria-label"])]),
+				_: 1
+			}), v(r, {
+				side: w(ze) === "rtl" ? "left" : "right",
+				class: "flex w-full flex-col gap-0 p-0 sm:max-w-xl"
+			}, {
+				default: T(() => [g("div", A, [v(ae, { class: "border-b" }, {
+					default: T(() => [v(oe, { class: "flex items-center gap-2" }, {
+						default: T(() => [v(w(E), { class: "size-4" }), _(" " + C(w(H)("dev_tools.title", {}, "Schema inspector")), 1)]),
+						_: 1
+					}), v(ie, {
+						class: "truncate font-mono text-xs",
+						title: G.value.context.page
+					}, {
+						default: T(() => [_(C(G.value.context.page), 1)]),
+						_: 1
+					}, 8, ["title"])]),
+					_: 1
+				}), v(a, { class: "min-h-0 flex-1" }, {
+					default: T(() => [g("div", j, [
+						g("dl", M, [g("div", N, [g("dt", P, C(w(H)("dev_tools.server_time", {}, "Server time")), 1), g("dd", F, C(Y.value === null ? w(H)("dev_tools.not_measured", {}, "Not measured") : w(H)("dev_tools.milliseconds", { value: w(U).number(Y.value) }, ":value ms")), 1)]), g("div", I, [g("dt", L, C(w(H)("dev_tools.payload", {}, "Payload size")), 1), g("dd", R, C(w(c)(Be.value)), 1)])]),
+						g("section", z, [g("h3", B, C(w(H)("dev_tools.context", {}, "Context token")), 1), g("dl", me, [
+							g("dt", he, C(w(H)("dev_tools.panel", {}, "Panel")), 1),
+							g("dd", ge, C(G.value.context.panel), 1),
+							g("dt", _e, C(w(H)("dev_tools.page", {}, "Page")), 1),
+							g("dd", {
+								class: "min-w-0 truncate font-mono",
+								title: G.value.context.page
+							}, C(G.value.context.page), 9, ve),
+							G.value.context.component ? (b(), h(d, { key: 0 }, [g("dt", ye, C(w(H)("dev_tools.component", {}, "Component")), 1), g("dd", be, C(G.value.context.component), 1)], 64)) : m("", !0),
+							G.value.tenant === null ? m("", !0) : (b(), h(d, { key: 1 }, [g("dt", xe, C(w(H)("dev_tools.tenant", {}, "Tenant")), 1), g("dd", Se, C(G.value.tenant), 1)], 64)),
+							(b(!0), h(d, null, S(He.value, ([e, t]) => (b(), h(d, { key: e }, [g("dt", Ce, C(e), 1), g("dd", V, C(w(ce)(t)), 1)], 64))), 128)),
+							g("dt", we, C(w(H)("dev_tools.bound_to_user", {}, "Bound to the user")), 1),
+							g("dd", null, C(G.value.context.boundToUser ? w(H)("dev_tools.yes", {}, "Yes") : w(H)("dev_tools.no", {}, "No")), 1),
+							g("dt", Te, C(w(H)("dev_tools.issued_at", {}, "Issued")), 1),
+							g("dd", null, C($(G.value.context.issuedAt)), 1),
+							g("dt", Ee, C(w(H)("dev_tools.expires_at", {}, "Expires")), 1),
+							g("dd", null, C($(G.value.context.expiresAt)), 1)
+						])]),
+						g("section", De, [
+							g("h3", Oe, C(w(H)("dev_tools.classes", {}, "Classes")), 1),
+							g("ul", ke, [(b(!0), h(d, null, S(G.value.classes, (e) => (b(), h("li", {
+								key: e.role,
+								class: "flex items-center gap-2 px-3 py-1.5"
+							}, [
+								g("span", Ae, C(w(H)(`dev_tools.roles.${e.role}`, {}, e.role)), 1),
+								g("span", {
+									class: "min-w-0 flex-1 truncate font-mono",
+									title: e.file ? `${e.file}:${e.line ?? 1}` : e.class
+								}, C(e.class), 9, je),
+								e.url ? (b(), h("a", {
+									key: 0,
+									href: e.url,
+									class: "text-primary inline-flex shrink-0 items-center gap-1 hover:underline",
+									"aria-label": w(H)("dev_tools.open_in_editor", {
+										class: e.class,
+										editor: G.value.editor ?? ""
+									}, "Open :class in :editor")
+								}, [v(w(k), { class: "size-3.5" })], 8, Me)) : m("", !0)
+							]))), 128))]),
+							G.value.editor === null ? (b(), h("p", Ne, C(w(H)("dev_tools.no_editor", {}, "Set APP_EDITOR (config app.editor) to open these classes in your editor.")), 1)) : m("", !0)
+						]),
+						g("section", Pe, [
+							g("div", Fe, [g("h3", Ie, C(w(H)("dev_tools.schema", {}, "Schema")), 1), v(n, {
+								type: "button",
+								variant: "ghost",
+								size: "sm",
+								onClick: Ue
+							}, {
+								default: T(() => [J.value ? (b(), p(w(D), { key: 0 })) : (b(), p(w(O), { key: 1 })), _(" " + C(J.value ? w(H)("dev_tools.copied", {}, "Copied") : w(H)("dev_tools.copy", {}, "Copy JSON")), 1)]),
+								_: 1
+							})]),
+							v(ne, {
+								modelValue: q.value,
+								"onUpdate:modelValue": t[0] ||= (e) => q.value = e,
+								type: "search",
+								placeholder: w(H)("dev_tools.search", {}, "Search keys and values"),
+								"aria-label": w(H)("dev_tools.search", {}, "Search keys and values"),
+								class: "mb-2 h-8"
+							}, null, 8, [
+								"modelValue",
+								"placeholder",
+								"aria-label"
+							]),
+							q.value.trim() !== "" && X.value.matches.size === 0 ? (b(), h("p", Le, C(w(H)("dev_tools.no_matches", { query: q.value.trim() }, "Nothing matches “:query”.")), 1)) : (b(), h("ul", {
+								key: 1,
+								dir: "ltr",
+								role: "tree",
+								"aria-label": w(H)("dev_tools.schema", {}, "Schema"),
+								class: "bg-muted/40 overflow-x-auto rounded-md p-2 text-start font-mono text-xs leading-relaxed"
+							}, [(b(!0), h(d, null, S(Ve.value, (e) => (b(), p(o, {
+								key: e.path,
+								entry: e,
+								depth: 0,
+								search: X.value,
+								query: q.value
+							}, null, 8, [
+								"entry",
+								"search",
+								"query"
+							]))), 128))], 8, Re))
+						])
+					])]),
+					_: 1
+				})])]),
+				_: 1
+			}, 8, ["side"])]),
+			_: 1
+		})) : m("", !0);
+	}
+});
+//#endregion
+export { H as default };
+
+//# sourceMappingURL=DevToolsInspector.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/dev-tools/DevToolsInspector.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DevToolsInspector.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","Sheet","_withCtx","_createVNode","SheetTrigger","Button","_unref","SheetContent","_createElementVNode","SheetHeader","SheetTitle","_createTextVNode","_toDisplayString","SheetDescription","ScrollArea","_createElementBlock","_Fragment","_createCommentVNode","_renderList","Input","DevToolsJsonNode","Button_default","Input_default","Sheet_default","SheetContent_default","SheetDescription_default","SheetHeader_default","SheetTitle_default","SheetTrigger_default","ScrollArea_default","DevToolsJsonNode_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","_hoisted_15","_hoisted_16","_hoisted_17","_hoisted_18","_hoisted_19","_hoisted_20","_hoisted_21","_hoisted_22","_hoisted_23","_hoisted_24","_hoisted_25","_hoisted_26","_hoisted_27","_hoisted_28","_hoisted_29","_hoisted_30","_hoisted_31","_hoisted_32","_hoisted_33","_hoisted_34","_hoisted_35","_hoisted_36","_hoisted_37","DevToolsInspector_vue_vue_type_script_setup_true_lang_default","t","useT","formatter","useFormatter","direction","useDirection","props","useAlfakitProps","tools","computed","data","inspectableProps","payload","byteLength","query","ref","copied","serverTime","search","searchJson","roots","jsonEntries","parameters","stop","timer","onMounted","latestServerTiming","router","onBeforeUnmount","copy","prettyJson","time","value","openBlock","createBlock","withCtx","createVNode","unref","BracesIcon","createElementVNode","createTextVNode","toDisplayString","formatBytes","createElementBlock","Fragment","createCommentVNode","renderList","key","jsonScalar","item","ExternalLinkIcon","CheckIcon","CopyIcon","_cache","$event","entry"],"sources":["../../../src/components/dev-tools/DevToolsInspector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  byteLength,\n  formatBytes,\n  inspectableProps,\n  jsonEntries,\n  jsonScalar,\n  latestServerTiming,\n  prettyJson,\n  searchJson,\n} from '@alfakit/core'\nimport { router } from '@inertiajs/vue3'\nimport { BracesIcon, CheckIcon, CopyIcon, ExternalLinkIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue'\nimport { useAlfakitProps, useDirection, useFormatter, useT } from '../../context'\nimport Button from '../ui/Button.vue'\nimport Input from '../ui/Input.vue'\nimport ScrollArea from '../ui/ScrollArea.vue'\nimport Sheet from '../ui/Sheet.vue'\nimport SheetContent from '../ui/SheetContent.vue'\nimport SheetDescription from '../ui/SheetDescription.vue'\nimport SheetHeader from '../ui/SheetHeader.vue'\nimport SheetTitle from '../ui/SheetTitle.vue'\nimport SheetTrigger from '../ui/SheetTrigger.vue'\nimport DevToolsJsonNode from './DevToolsJsonNode.vue'\n\n/**\n * The schema inspector: a floating developer button that opens a drawer with the page's\n * props as a searchable JSON tree (with a copy button), what the context token identifies,\n * the server time reported in `Server-Timing`, the payload size and editor links for the\n * PHP classes behind the page. Rendered only for pages that carry `alfakitDevTools`.\n */\nconst t = useT()\nconst formatter = useFormatter()\nconst direction = useDirection()\nconst props = useAlfakitProps()\nconst tools = computed(() => props.value.alfakitDevTools)\nconst data = computed(() => inspectableProps(props.value as unknown as Record<string, unknown>))\nconst payload = computed(() => byteLength(props.value))\nconst query = ref('')\nconst copied = ref(false)\nconst serverTime = ref<number | null>(null)\nconst search = computed(() => searchJson(data.value, query.value))\nconst roots = computed(() => jsonEntries(data.value))\nconst parameters = computed(() => Object.entries(tools.value?.context.parameters ?? {}))\n\nlet stop: (() => void) | undefined\nlet timer: ReturnType<typeof setTimeout> | undefined\n\nonMounted(() => {\n  serverTime.value = latestServerTiming()\n  // Re-read after every visit: the latest response carries the newest header.\n  stop = router.on('finish', () => {\n    serverTime.value = latestServerTiming()\n  })\n})\n\nonBeforeUnmount(() => {\n  stop?.()\n  clearTimeout(timer)\n})\n\nconst copy = () => {\n  void navigator.clipboard?.writeText(prettyJson(data.value)).then(() => {\n    copied.value = true\n    clearTimeout(timer)\n    timer = setTimeout(() => (copied.value = false), 2000)\n  })\n}\n\nconst time = (value: number | null) =>\n  value === null ? t('dev_tools.never', {}, 'Never') : formatter.value.dateTime(value * 1000)\n</script>\n\n<template>\n  <Sheet v-if=\"tools\">\n    <SheetTrigger as-child>\n      <Button\n        type=\"button\"\n        variant=\"outline\"\n        size=\"icon\"\n        :aria-label=\"t('dev_tools.open', {}, 'Open schema inspector')\"\n        data-slot=\"dev-tools-toggle\"\n        class=\"fixed end-4 bottom-4 z-40 rounded-full shadow-md\"\n      >\n        <BracesIcon />\n      </Button>\n    </SheetTrigger>\n    <SheetContent\n      :side=\"direction === 'rtl' ? 'left' : 'right'\"\n      class=\"flex w-full flex-col gap-0 p-0 sm:max-w-xl\"\n    >\n      <div data-slot=\"dev-tools\" class=\"flex min-h-0 flex-1 flex-col\">\n        <SheetHeader class=\"border-b\">\n          <SheetTitle class=\"flex items-center gap-2\">\n            <BracesIcon class=\"size-4\" />\n            {{ t('dev_tools.title', {}, 'Schema inspector') }}\n          </SheetTitle>\n          <SheetDescription class=\"truncate font-mono text-xs\" :title=\"tools.context.page\">\n            {{ tools.context.page }}\n          </SheetDescription>\n        </SheetHeader>\n        <ScrollArea class=\"min-h-0 flex-1\">\n          <div class=\"space-y-5 p-4 text-sm\">\n            <dl class=\"grid grid-cols-2 gap-3\">\n              <div class=\"rounded-md border p-3\">\n                <dt class=\"text-muted-foreground text-xs\">\n                  {{ t('dev_tools.server_time', {}, 'Server time') }}\n                </dt>\n                <dd class=\"font-mono text-sm font-semibold tabular-nums\">\n                  {{\n                    serverTime === null\n                      ? t('dev_tools.not_measured', {}, 'Not measured')\n                      : t(\n                          'dev_tools.milliseconds',\n                          { value: formatter.number(serverTime) },\n                          ':value ms',\n                        )\n                  }}\n                </dd>\n              </div>\n              <div class=\"rounded-md border p-3\">\n                <dt class=\"text-muted-foreground text-xs\">\n                  {{ t('dev_tools.payload', {}, 'Payload size') }}\n                </dt>\n                <dd class=\"font-mono text-sm font-semibold tabular-nums\">\n                  {{ formatBytes(payload) }}\n                </dd>\n              </div>\n            </dl>\n\n            <section data-slot=\"dev-tools-context\">\n              <h3 class=\"mb-2 text-sm font-medium\">\n                {{ t('dev_tools.context', {}, 'Context token') }}\n              </h3>\n              <dl class=\"grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-xs\">\n                <dt class=\"text-muted-foreground\">{{ t('dev_tools.panel', {}, 'Panel') }}</dt>\n                <dd class=\"min-w-0 truncate font-mono\">{{ tools.context.panel }}</dd>\n                <dt class=\"text-muted-foreground\">{{ t('dev_tools.page', {}, 'Page') }}</dt>\n                <dd class=\"min-w-0 truncate font-mono\" :title=\"tools.context.page\">\n                  {{ tools.context.page }}\n                </dd>\n                <template v-if=\"tools.context.component\">\n                  <dt class=\"text-muted-foreground\">\n                    {{ t('dev_tools.component', {}, 'Component') }}\n                  </dt>\n                  <dd class=\"min-w-0 truncate font-mono\">{{ tools.context.component }}</dd>\n                </template>\n                <template v-if=\"tools.tenant !== null\">\n                  <dt class=\"text-muted-foreground\">{{ t('dev_tools.tenant', {}, 'Tenant') }}</dt>\n                  <dd class=\"min-w-0 truncate font-mono\">{{ tools.tenant }}</dd>\n                </template>\n                <template v-for=\"[key, value] in parameters\" :key=\"key\">\n                  <dt class=\"text-muted-foreground\">{{ key }}</dt>\n                  <dd class=\"min-w-0 truncate font-mono\">{{ jsonScalar(value) }}</dd>\n                </template>\n                <dt class=\"text-muted-foreground\">\n                  {{ t('dev_tools.bound_to_user', {}, 'Bound to the user') }}\n                </dt>\n                <dd>\n                  {{\n                    tools.context.boundToUser\n                      ? t('dev_tools.yes', {}, 'Yes')\n                      : t('dev_tools.no', {}, 'No')\n                  }}\n                </dd>\n                <dt class=\"text-muted-foreground\">{{ t('dev_tools.issued_at', {}, 'Issued') }}</dt>\n                <dd>{{ time(tools.context.issuedAt) }}</dd>\n                <dt class=\"text-muted-foreground\">\n                  {{ t('dev_tools.expires_at', {}, 'Expires') }}\n                </dt>\n                <dd>{{ time(tools.context.expiresAt) }}</dd>\n              </dl>\n            </section>\n\n            <section data-slot=\"dev-tools-classes\">\n              <h3 class=\"mb-2 text-sm font-medium\">{{ t('dev_tools.classes', {}, 'Classes') }}</h3>\n              <ul class=\"divide-y rounded-md border text-xs\">\n                <li\n                  v-for=\"item in tools.classes\"\n                  :key=\"item.role\"\n                  class=\"flex items-center gap-2 px-3 py-1.5\"\n                >\n                  <span class=\"text-muted-foreground w-16 shrink-0\">\n                    {{ t(`dev_tools.roles.${item.role}`, {}, item.role) }}\n                  </span>\n                  <span\n                    class=\"min-w-0 flex-1 truncate font-mono\"\n                    :title=\"item.file ? `${item.file}:${item.line ?? 1}` : item.class\"\n                  >\n                    {{ item.class }}\n                  </span>\n                  <a\n                    v-if=\"item.url\"\n                    :href=\"item.url\"\n                    class=\"text-primary inline-flex shrink-0 items-center gap-1 hover:underline\"\n                    :aria-label=\"\n                      t(\n                        'dev_tools.open_in_editor',\n                        { class: item.class, editor: tools.editor ?? '' },\n                        'Open :class in :editor',\n                      )\n                    \"\n                  >\n                    <ExternalLinkIcon class=\"size-3.5\" />\n                  </a>\n                </li>\n              </ul>\n              <p v-if=\"tools.editor === null\" class=\"text-muted-foreground mt-2 text-xs\">\n                {{\n                  t(\n                    'dev_tools.no_editor',\n                    {},\n                    'Set APP_EDITOR (config app.editor) to open these classes in your editor.',\n                  )\n                }}\n              </p>\n            </section>\n\n            <section data-slot=\"dev-tools-schema\">\n              <div class=\"mb-2 flex items-center gap-2\">\n                <h3 class=\"me-auto text-sm font-medium\">\n                  {{ t('dev_tools.schema', {}, 'Schema') }}\n                </h3>\n                <Button type=\"button\" variant=\"ghost\" size=\"sm\" @click=\"copy\">\n                  <CheckIcon v-if=\"copied\" />\n                  <CopyIcon v-else />\n                  {{\n                    copied\n                      ? t('dev_tools.copied', {}, 'Copied')\n                      : t('dev_tools.copy', {}, 'Copy JSON')\n                  }}\n                </Button>\n              </div>\n              <Input\n                v-model=\"query\"\n                type=\"search\"\n                :placeholder=\"t('dev_tools.search', {}, 'Search keys and values')\"\n                :aria-label=\"t('dev_tools.search', {}, 'Search keys and values')\"\n                class=\"mb-2 h-8\"\n              />\n              <p\n                v-if=\"query.trim() !== '' && search.matches.size === 0\"\n                class=\"text-muted-foreground text-sm\"\n              >\n                {{\n                  t('dev_tools.no_matches', { query: query.trim() }, 'Nothing matches “:query”.')\n                }}\n              </p>\n              <ul\n                v-else\n                dir=\"ltr\"\n                role=\"tree\"\n                :aria-label=\"t('dev_tools.schema', {}, 'Schema')\"\n                class=\"bg-muted/40 overflow-x-auto rounded-md p-2 text-start font-mono text-xs leading-relaxed\"\n              >\n                <DevToolsJsonNode\n                  v-for=\"entry in roots\"\n                  :key=\"entry.path\"\n                  :entry=\"entry\"\n                  :depth=\"0\"\n                  :search=\"search\"\n                  :query=\"query\"\n                />\n              </ul>\n            </section>\n          </div>\n        </ScrollArea>\n      </div>\n    </SheetContent>\n  </Sheet>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgCA,IAAMsE,IAAIC,GAAK,GACTC,IAAYC,GAAa,GACzBC,KAAYC,EAAa,GACzBC,IAAQC,EAAgB,GACxBC,IAAQC,QAAeH,EAAM,MAAM,eAAe,GAClDI,IAAOD,QAAeE,EAAiBL,EAAM,KAA2C,CAAC,GACzFM,KAAUH,QAAeI,EAAWP,EAAM,KAAK,CAAC,GAChDQ,IAAQC,EAAI,EAAE,GACdC,IAASD,EAAI,EAAK,GAClBE,IAAaF,EAAmB,IAAI,GACpCG,IAAST,QAAeU,GAAWT,EAAK,OAAOI,EAAM,KAAK,CAAC,GAC3DM,KAAQX,QAAeY,GAAYX,EAAK,KAAK,CAAC,GAC9CY,KAAab,QAAe,OAAO,QAAQD,EAAM,OAAO,QAAQ,cAAc,CAAC,CAAC,CAAC,GAEnFe,GACAC;EAUJ,AARAC,QAAgB;GAGd,AAFA,EAAW,QAAQC,EAAmB,GAEtC,IAAOC,GAAO,GAAG,gBAAgB;IAC/B,EAAW,QAAQD,EAAmB;GACxC,CAAC;EACH,CAAC,GAEDE,SAAsB;GAEpB,AADAL,IAAO,GACP,aAAaC,CAAK;EACpB,CAAC;EAED,IAAMK,WAAa;GACjB,UAAe,WAAW,UAAUC,GAAWpB,EAAK,KAAK,CAAC,CAAC,CAAC,WAAW;IAGrE,AAFA,EAAO,QAAQ,IACf,aAAac,CAAK,GAClB,IAAQ,iBAAkB,EAAO,QAAQ,IAAQ,GAAI;GACvD,CAAC;EACH,GAEMO,KAAQ,MACZC,MAAU,OAAOhC,EAAE,mBAAmB,CAAC,GAAG,OAAO,IAAIE,EAAU,MAAM,SAAS8B,IAAQ,GAAI;mBAI7ExB,EAAA,SAAb9E,EAAA,GAAAC,EAmMQC,IAAA,EAAA,KAAA,EAAA,GAAA;GAlMN,SAAAC,QAWe,CAXfC,EAWeC,GAAA,EAXD,YAAA,GAAQ,GAAA;IACpB,SAAAF,QASS,CATTC,EASSE,GAAA;KARP,MAAK;KACL,SAAQ;KACR,MAAK;KACJ,cAAYC,EAAA+D,CAAA,CAAC,CAAA,kBAAA,CAAA,GAAA,uBAAA;KACd,aAAU;KACV,OAAM;;KAEN,SAAAnE,QAAc,CAAdC,EAAcG,EAAAqG,CAAA,CAAA,CAAA,CAAA;;;;GAGlBxG,CAAAA,GAAAA,EAqLeI,GAAA;IApLZ,MAAMD,EAAAmE,EAAA,MAAS,QAAA,SAAA;IAChB,OAAM;;IAEN,SAAAvE,QAgLM,CAhLNM,EAgLM,OAhLNuB,GAgLM,CA/KJ5B,EAQcM,IAAA,EARD,OAAM,WAAU,GAAA;KAC3B,SAAAP,QAGa,CAHbC,EAGaO,IAAA,EAHD,OAAM,0BAAyB,GAAA;MACzC,SAAAR,QAA6B,CAA7BC,EAA6BG,EAAAqG,CAAA,GAAA,EAAjB,OAAM,SAAQ,CAAA,GAAGhG,EAAA,MAC7BC,EAAGN,EAAA+D,CAAA,CAAC,CAAA,mBAAA,CAAA,GAAA,kBAAA,CAAA,GAAA,CAAA,CAAA,CAAA;;KAENlE,CAAAA,GAAAA,EAEmBU,IAAA;MAFD,OAAM;MAA8B,OAAOgE,EAAA,MAAM,QAAQ;;MACzE,SAAA3E,QAAwB,CAArBS,EAAAC,EAAAiE,EAAA,MAAM,QAAQ,IAAI,GAAA,CAAA,CAAA,CAAA;;;;IAGzB1E,CAAAA,GAAAA,EAqKaW,GAAA,EArKD,OAAM,iBAAgB,GAAA;KAChC,SAAAZ,QAmKM,CAnKNM,EAmKM,OAnKNwB,GAmKM;MAlKJxB,EAyBK,MAzBLyB,GAyBK,CAxBHzB,EAeM,OAfN0B,GAeM,CAdJ1B,EAEK,MAFL2B,GAEKvB,EADAN,EAAA+D,CAAA,CAAC,CAAA,yBAAA,CAAA,GAAA,aAAA,CAAA,GAAA,CAAA,GAEN7D,EAUK,MAVL4B,GAUKxB,EARD0E,EAAA,UAAU,OAAkChF,EAAA+D,CAAA,CAAC,CAAA,0BAAA,CAAA,GAAA,cAAA,IAAuE/D,EAAA+D,CAAA,CAAC,CAAA,0BAAyF,EAAA,OAAA/D,EAAAiE,CAAA,CAAS,CAAC,OAAOe,EAAA,KAAU,EAAA,GAAA,WAAA,CAAA,GAAA,CAAA,CAAA,CAAA,GAU/O9E,EAOM,OAPN6B,GAOM,CANJ7B,EAEK,MAFL8B,GAEK1B,EADAN,EAAA+D,CAAA,CAAC,CAAA,qBAAA,CAAA,GAAA,cAAA,CAAA,GAAA,CAAA,GAEN7D,EAEK,MAFL+B,GAEK3B,EADAN,EAAAyG,CAAA,CAAW,CAAC9B,GAAA,KAAO,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;MAK5BzE,EA0CU,WA1CVgC,GA0CU,CAzCRhC,EAEK,MAFLiC,GAEK7B,EADAN,EAAA+D,CAAA,CAAC,CAAA,qBAAA,CAAA,GAAA,eAAA,CAAA,GAAA,CAAA,GAEN7D,EAqCK,MArCLkC,IAqCK;OApCHlC,EAA8E,MAA9EmC,IAA8E/B,EAAzCN,EAAA+D,CAAA,CAAC,CAAA,mBAAA,CAAA,GAAA,OAAA,CAAA,GAAA,CAAA;OACtC7D,EAAqE,MAArEoC,IAAqEhC,EAA3BiE,EAAA,MAAM,QAAQ,KAAK,GAAA,CAAA;OAC7DrE,EAA4E,MAA5EqC,IAA4EjC,EAAvCN,EAAA+D,CAAA,CAAC,CAAA,kBAAA,CAAA,GAAA,MAAA,CAAA,GAAA,CAAA;OACtC7D,EAEK,MAAA;QAFD,OAAM;QAA8B,OAAOqE,EAAA,MAAM,QAAQ;OACxD,GAAAjE,EAAAiE,EAAA,MAAM,QAAQ,IAAI,GAAA,GAAA/B,EAAA;OAEP+B,EAAA,MAAM,QAAQ,aAA9B9E,EAAA,GAAAgB,EAKWC,GAAA,EAAA,KAAA,EAAA,GAAA,CAJTR,EAEK,MAFLuC,IAEKnC,EADAN,EAAA+D,CAAA,CAAC,CAAA,uBAAA,CAAA,GAAA,WAAA,CAAA,GAAA,CAAA,GAEN7D,EAAyE,MAAzEwC,IAAyEpC,EAA/BiE,EAAA,MAAM,QAAQ,SAAS,GAAA,CAAA,CAAA,GAAA,EAAA,KAAAqC,EAAA,IAAA,EAAA;OAEnDrC,EAAA,MAAM,WAAM,OAE4BqC,EAAA,IAAA,EAAA,KAFxDnH,EAAA,GAAAgB,EAGWC,GAAA,EAAA,KAAA,EAAA,GAAA,CAFTR,EAAgF,MAAhFyC,IAAgFrC,EAA3CN,EAAA+D,CAAA,CAAC,CAAA,oBAAA,CAAA,GAAA,QAAA,CAAA,GAAA,CAAA,GACtC7D,EAA8D,MAA9D0C,IAA8DtC,EAApBiE,EAAA,MAAM,MAAM,GAAA,CAAA,CAAA,GAAA,EAAA;QAExD9E,EAAA,EAAA,GAAAgB,EAGWC,GAAA,MAAAE,EAHsByE,GAAA,QAAU,CAAzByB,GAAKf,QAA4BtG,EAAA,GAAAgB,EAAAC,GAAA,EAAA,OAAG,GAAA,CACpDR,EAAgD,MAAhD2C,IAAgDvC,EAAXwG,CAAG,GAAA,CAAA,GACxC5G,EAAmE,MAAnE4C,GAAmExC,EAAzBN,EAAA+G,EAAA,CAAU,CAAChB,CAAK,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA;OAE5D7F,EAEK,MAFL6C,IAEKzC,EADAN,EAAA+D,CAAA,CAAC,CAAA,2BAAA,CAAA,GAAA,mBAAA,CAAA,GAAA,CAAA;OAEN7D,EAMK,MAAA,MAAAI,EAJDiE,EAAA,MAAM,QAAQ,cAAoCvE,EAAA+D,CAAA,CAAC,CAAA,iBAAA,CAAA,GAAA,KAAA,IAAqD/D,EAAA+D,CAAA,CAAC,CAAA,gBAAA,CAAA,GAAA,IAAA,CAAA,GAAA,CAAA;OAK7G7D,EAAmF,MAAnF8C,IAAmF1C,EAA9CN,EAAA+D,CAAA,CAAC,CAAA,uBAAA,CAAA,GAAA,QAAA,CAAA,GAAA,CAAA;OACtC7D,EAA2C,MAAA,MAAAI,EAApCwF,EAAKvB,EAAA,MAAM,QAAQ,QAAQ,CAAA,GAAA,CAAA;OAClCrE,EAEK,MAFL+C,IAEK3C,EADAN,EAAA+D,CAAA,CAAC,CAAA,wBAAA,CAAA,GAAA,SAAA,CAAA,GAAA,CAAA;OAEN7D,EAA4C,MAAA,MAAAI,EAArCwF,EAAKvB,EAAA,MAAM,QAAQ,SAAS,CAAA,GAAA,CAAA;;MAIvCrE,EA0CU,WA1CVgD,IA0CU;OAzCRhD,EAAqF,MAArFiD,IAAqF7C,EAA7CN,EAAA+D,CAAA,CAAC,CAAA,qBAAA,CAAA,GAAA,SAAA,CAAA,GAAA,CAAA;OACzC7D,EA8BK,MA9BLkD,IA8BK,EA7BH3D,EAAA,EAAA,GAAAgB,EA4BKC,GAAA,MAAAE,EA3BY2D,EAAA,MAAM,UAAd,OADT9E,EAAA,GAAAgB,EA4BK,MAAA;QA1BF,KAAKuG,EAAK;QACX,OAAM;;QAEN9G,EAEO,QAFPmD,IAEO/C,EADFN,EAAA+D,CAAA,CAAC,CAAA,mBAAoBiD,EAAK,QAAI,CAAA,GAAQA,EAAK,IAAI,CAAA,GAAA,CAAA;QAEpD9G,EAKO,QAAA;SAJL,OAAM;SACL,OAAO8G,EAAK,OAAI,GAAMA,EAAK,KAAI,GAAIA,EAAK,QAAI,MAAUA,EAAK;QAEzD,GAAA1G,EAAA0G,EAAK,KAAK,GAAA,GAAA1D,EAAA;QAGP0D,EAAK,OADbvH,EAAA,GAAAgB,EAaI,KAAA;;SAXD,MAAMuG,EAAK;SACZ,OAAM;SACL,cAAmChH,EAAA+D,CAAA,CAAC,CAAA,4BAAuF;UAAA,OAAAiD,EAAK;UAAK,QAAUzC,EAAA,MAAM,UAAM;SAAA,GAAA,wBAAA;QAQ5J1E,GAAAA,CAAAA,EAAqCG,EAAAiH,CAAA,GAAA,EAAnB,OAAM,WAAU,CAAA,CAAA,GAAA,GAAA1D,EAAA,KAAAqD,EAAA,IAAA,EAAA;;OAI/BrC,EAAA,MAAM,WAAM,QAArB9E,EAAA,GAAAgB,EAQI,KARJ+C,IAQIlD,EANAN,EAAA+D,CAAA,CAAC,CAAA,uBAAA,CAAA,GAAA,0EAAA,CAAA,GAAA,CAAA,KAAA6C,EAAA,IAAA,EAAA;;MASP1G,EA8CU,WA9CVuD,IA8CU;OA7CRvD,EAaM,OAbNwD,IAaM,CAZJxD,EAEK,MAFLyD,IAEKrD,EADAN,EAAA+D,CAAA,CAAC,CAAA,oBAAA,CAAA,GAAA,QAAA,CAAA,GAAA,CAAA,GAENlE,EAQSE,GAAA;QARD,MAAK;QAAS,SAAQ;QAAQ,MAAK;QAAM,SAAO6F;;QACtD,SAAAhG,QAA2B,CAAVmF,EAAA,SAAjBtF,EAAA,GAAAC,EAA2BM,EAAAkH,CAAA,GAAA,EAAA,KAAA,EAAA,CAAA,MAC3BzH,EAAA,GAAAC,EAAmBM,EAAAmH,CAAA,GAAA,EAAA,KAAA,EAAA,CAAA,IAAA9G,EAAA,MACnBC,EACEyE,EAAA,QAA+B/E,EAAA+D,CAAA,CAAC,CAAA,oBAAA,CAAA,GAAA,QAAA,IAA2D/D,EAAA+D,CAAA,CAAC,CAAA,kBAAA,CAAA,GAAA,WAAA,CAAA,GAAA,CAAA,CAAA,CAAA;;;OAMlGlE,EAMEgB,IAAA;QALS,YAAAgE,EAAA;QAAA,uBAAA,AAAAuC,EAAA,QAAA,MAAA,EAAK,QAAAC;QACd,MAAK;QACJ,aAAarH,EAAA+D,CAAA,CAAC,CAAA,oBAAA,CAAA,GAAA,wBAAA;QACd,cAAY/D,EAAA+D,CAAA,CAAC,CAAA,oBAAA,CAAA,GAAA,wBAAA;QACd,OAAM;;;;;;OAGAc,EAAA,MAAM,KAAI,MAAA,MAAaI,EAAA,MAAO,QAAQ,SAAI,KADlDxF,EAAA,GAAAgB,EAOI,KAPJmD,IAOItD,EAFAN,EAAA+D,CAAA,CAAC,CAAA,wBAAA,EAAA,OAAkCc,EAAA,MAAM,KAAI,EAAA,GAAA,2BAAA,CAAA,GAAA,CAAA,MAGjDpF,EAAA,GAAAgB,EAeK,MAAA;;QAbH,KAAI;QACJ,MAAK;QACJ,cAAYT,EAAA+D,CAAA,CAAC,CAAA,oBAAA,CAAA,GAAA,QAAA;QACd,OAAM;OAENtE,GAAAA,EAAAA,EAAA,EAAA,GAAAgB,EAOEC,GAAA,MAAAE,EANgBuE,GAAA,QAAT,OADT1F,EAAA,GAAAC,EAOEoB,GAAA;QALC,KAAKwG,EAAM;QACJ;QACP,OAAO;QACP,QAAQrC,EAAA;QACR,OAAOJ,EAAA"}

package/dist/components/dev-tools/DevToolsJsonNode.js

@@ -0,0 +1,7 @@
+import e from "./DevToolsJsonNode.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/dev-tools/DevToolsJsonNode.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=DevToolsJsonNode.js.map

package/dist/components/dev-tools/DevToolsJsonNode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DevToolsJsonNode.js","names":["_sfc_main","DevToolsJsonNode_vue_vue_type_script_setup_true_lang_default","DevToolsJsonNode_default"],"sources":["../../../src/components/dev-tools/DevToolsJsonNode.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  jsonEntries,\n  jsonScalar,\n  jsonSize,\n  type JsonEntry,\n  type JsonSearchResult,\n} from '@alfakit/core'\nimport { ChevronRightIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport { useFormatter, useT } from '../../context'\nimport { cn } from '../../lib/utils'\n\ndefineOptions({ name: 'DevToolsJsonNode' })\n\nconst props = defineProps<{\n  entry: JsonEntry\n  depth: number\n  search: JsonSearchResult\n  query: string\n}>()\n\nconst t = useT()\nconst formatter = useFormatter()\nconst open = ref(props.depth < 1)\nconst searching = computed(() => props.query.trim() !== '')\nconst hidden = computed(() => searching.value && !props.search.visible.has(props.entry.path))\nconst container = computed(() => props.entry.kind === 'object' || props.entry.kind === 'array')\nconst expanded = computed(() => searching.value || open.value)\nconst matched = computed(() => props.search.matches.has(props.entry.path))\nconst size = computed(() => jsonSize(props.entry.value))\nconst summary = computed(() => {\n  const count = formatter.value.number(size.value)\n\n  return props.entry.kind === 'array' ? `[${count}]` : `{${count}}`\n})\nconst children = computed(() =>\n  expanded.value ? jsonEntries(props.entry.value, props.entry.path) : [],\n)\n</script>\n\n<template>\n  <template v-if=\"!hidden\">\n    <li\n      v-if=\"!container\"\n      role=\"treeitem\"\n      aria-selected=\"false\"\n      class=\"py-px\"\n      :style=\"{ paddingInlineStart: `${depth * 12 + 16}px` }\"\n    >\n      <span :class=\"cn('text-foreground', matched && 'bg-primary/15 rounded-sm')\">{{\n        entry.key\n      }}</span>\n      <span class=\"text-muted-foreground\">: </span>\n      <span\n        :class=\"\n          cn(\n            entry.kind === 'string' && 'text-emerald-700 dark:text-emerald-400',\n            entry.kind === 'number' && 'text-sky-700 dark:text-sky-400',\n            entry.kind === 'boolean' && 'text-violet-700 dark:text-violet-400',\n            entry.kind === 'null' && 'text-muted-foreground',\n            'break-all',\n          )\n        \"\n        >{{ jsonScalar(entry.value) }}</span\n      >\n    </li>\n    <li v-else role=\"treeitem\" aria-selected=\"false\" :aria-expanded=\"expanded\">\n      <button\n        type=\"button\"\n        class=\"hover:bg-muted flex w-full items-center gap-1 rounded py-px text-start\"\n        :style=\"{ paddingInlineStart: `${depth * 12}px` }\"\n        :aria-label=\"\n          expanded\n            ? t('dev_tools.collapse', { key: entry.key }, 'Collapse :key')\n            : t('dev_tools.expand', { key: entry.key }, 'Expand :key')\n        \"\n        @click=\"open = !open\"\n      >\n        <!-- The tree is always left to right (it is code), so the chevron does not flip. -->\n        <ChevronRightIcon\n          :class=\"cn('size-3 shrink-0 transition-transform', expanded && 'rotate-90')\"\n        />\n        <span :class=\"cn('text-foreground', matched && 'bg-primary/15 rounded-sm')\">{{\n          entry.key\n        }}</span>\n        <span class=\"text-muted-foreground\">{{ summary }}</span>\n      </button>\n      <ul v-if=\"expanded && size > 0\" role=\"group\">\n        <DevToolsJsonNode\n          v-for=\"child in children\"\n          :key=\"child.path\"\n          :entry=\"child\"\n          :depth=\"depth + 1\"\n          :search=\"search\"\n          :query=\"query\"\n        />\n      </ul>\n    </li>\n  </template>\n</template>\n"],"mappings":""}

package/dist/components/dev-tools/DevToolsJsonNode.vue.d.ts

@@ -0,0 +1,10 @@
+import { type JsonEntry, type JsonSearchResult } from '@alfakit/core';
+type __VLS_Props = {
+    entry: JsonEntry;
+    depth: number;
+    search: JsonSearchResult;
+    query: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=DevToolsJsonNode.vue.d.ts.map

package/dist/components/dev-tools/DevToolsJsonNode.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DevToolsJsonNode.vue.d.ts","sourceRoot":"","sources":["../../../src/components/dev-tools/DevToolsJsonNode.vue"],"names":[],"mappings":"AAuGA,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,gBAAgB,EACtB,MAAM,eAAe,CAAA;AAQtB,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,SAAS,CAAA;IAChB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,gBAAgB,CAAA;IACxB,KAAK,EAAE,MAAM,CAAA;CACd,CAAC;;AAwKF,wBAMG"}

package/dist/components/dev-tools/DevToolsJsonNode.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,69 @@
+import { useFormatter as e, useT as t } from "../../context.js";
+import { cn as n } from "../../lib/utils.js";
+import { jsonEntries as r, jsonScalar as i, jsonSize as a } from "@alfakit/core";
+import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createVNode as f, defineComponent as p, normalizeClass as m, normalizeStyle as h, openBlock as g, ref as _, renderList as v, resolveComponent as y, toDisplayString as b, unref as x } from "vue";
+import { ChevronRightIcon as S } from "@lucide/vue";
+//#region src/components/dev-tools/DevToolsJsonNode.vue?vue&type=script&setup=true&lang.ts
+var C = ["aria-expanded"], w = ["aria-label"], T = { class: "text-muted-foreground" }, E = {
+	key: 0,
+	role: "group"
+}, D = /*@__PURE__*/ p({
+	name: "DevToolsJsonNode",
+	__name: "DevToolsJsonNode",
+	props: {
+		entry: {},
+		depth: {},
+		search: {},
+		query: {}
+	},
+	setup(p) {
+		let D = p, O = t(), k = e(), A = _(D.depth < 1), j = s(() => D.query.trim() !== ""), M = s(() => j.value && !D.search.visible.has(D.entry.path)), N = s(() => D.entry.kind === "object" || D.entry.kind === "array"), P = s(() => j.value || A.value), F = s(() => D.search.matches.has(D.entry.path)), I = s(() => a(D.entry.value)), L = s(() => {
+			let e = k.value.number(I.value);
+			return D.entry.kind === "array" ? `[${e}]` : `{${e}}`;
+		}), R = s(() => P.value ? r(D.entry.value, D.entry.path) : []);
+		return (e, t) => {
+			let r = y("DevToolsJsonNode", !0);
+			return M.value ? l("", !0) : (g(), u(o, { key: 0 }, [N.value ? (g(), u("li", {
+				key: 1,
+				role: "treeitem",
+				"aria-selected": "false",
+				"aria-expanded": P.value
+			}, [d("button", {
+				type: "button",
+				class: "hover:bg-muted flex w-full items-center gap-1 rounded py-px text-start",
+				style: h({ paddingInlineStart: `${p.depth * 12}px` }),
+				"aria-label": P.value ? x(O)("dev_tools.collapse", { key: p.entry.key }, "Collapse :key") : x(O)("dev_tools.expand", { key: p.entry.key }, "Expand :key"),
+				onClick: t[0] ||= (e) => A.value = !A.value
+			}, [
+				f(x(S), { class: m(x(n)("size-3 shrink-0 transition-transform", P.value && "rotate-90")) }, null, 8, ["class"]),
+				d("span", { class: m(x(n)("text-foreground", F.value && "bg-primary/15 rounded-sm")) }, b(p.entry.key), 3),
+				d("span", T, b(L.value), 1)
+			], 12, w), P.value && I.value > 0 ? (g(), u("ul", E, [(g(!0), u(o, null, v(R.value, (e) => (g(), c(r, {
+				key: e.path,
+				entry: e,
+				depth: p.depth + 1,
+				search: p.search,
+				query: p.query
+			}, null, 8, [
+				"entry",
+				"depth",
+				"search",
+				"query"
+			]))), 128))])) : l("", !0)], 8, C)) : (g(), u("li", {
+				key: 0,
+				role: "treeitem",
+				"aria-selected": "false",
+				class: "py-px",
+				style: h({ paddingInlineStart: `${p.depth * 12 + 16}px` })
+			}, [
+				d("span", { class: m(x(n)("text-foreground", F.value && "bg-primary/15 rounded-sm")) }, b(p.entry.key), 3),
+				t[1] ||= d("span", { class: "text-muted-foreground" }, ": ", -1),
+				d("span", { class: m(x(n)(p.entry.kind === "string" && "text-emerald-700 dark:text-emerald-400", p.entry.kind === "number" && "text-sky-700 dark:text-sky-400", p.entry.kind === "boolean" && "text-violet-700 dark:text-violet-400", p.entry.kind === "null" && "text-muted-foreground", "break-all")) }, b(x(i)(p.entry.value)), 3)
+			], 4))], 64));
+		};
+	}
+});
+//#endregion
+export { D as default };
+
+//# sourceMappingURL=DevToolsJsonNode.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/dev-tools/DevToolsJsonNode.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DevToolsJsonNode.vue_vue_type_script_setup_true_lang.js","names":["_resolveComponent","_openBlock","_createElementBlock","_Fragment","_normalizeStyle","_createElementVNode","_normalizeClass","_unref","_toDisplayString","_createVNode","_renderList","_createBlock","_createCommentVNode","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","DevToolsJsonNode_vue_vue_type_script_setup_true_lang_default","props","__props","t","useT","formatter","useFormatter","open","ref","searching","computed","hidden","container","expanded","matched","size","jsonSize","summary","count","children","jsonEntries","_component_DevToolsJsonNode","resolveComponent","createCommentVNode","openBlock","createElementBlock","Fragment","createElementVNode","normalizeStyle","unref","_cache","createVNode","ChevronRightIcon","normalizeClass","cn","toDisplayString","renderList","createBlock","child","jsonScalar"],"sources":["../../../src/components/dev-tools/DevToolsJsonNode.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  jsonEntries,\n  jsonScalar,\n  jsonSize,\n  type JsonEntry,\n  type JsonSearchResult,\n} from '@alfakit/core'\nimport { ChevronRightIcon } from '@lucide/vue'\nimport { computed, ref } from 'vue'\nimport { useFormatter, useT } from '../../context'\nimport { cn } from '../../lib/utils'\n\ndefineOptions({ name: 'DevToolsJsonNode' })\n\nconst props = defineProps<{\n  entry: JsonEntry\n  depth: number\n  search: JsonSearchResult\n  query: string\n}>()\n\nconst t = useT()\nconst formatter = useFormatter()\nconst open = ref(props.depth < 1)\nconst searching = computed(() => props.query.trim() !== '')\nconst hidden = computed(() => searching.value && !props.search.visible.has(props.entry.path))\nconst container = computed(() => props.entry.kind === 'object' || props.entry.kind === 'array')\nconst expanded = computed(() => searching.value || open.value)\nconst matched = computed(() => props.search.matches.has(props.entry.path))\nconst size = computed(() => jsonSize(props.entry.value))\nconst summary = computed(() => {\n  const count = formatter.value.number(size.value)\n\n  return props.entry.kind === 'array' ? `[${count}]` : `{${count}}`\n})\nconst children = computed(() =>\n  expanded.value ? jsonEntries(props.entry.value, props.entry.path) : [],\n)\n</script>\n\n<template>\n  <template v-if=\"!hidden\">\n    <li\n      v-if=\"!container\"\n      role=\"treeitem\"\n      aria-selected=\"false\"\n      class=\"py-px\"\n      :style=\"{ paddingInlineStart: `${depth * 12 + 16}px` }\"\n    >\n      <span :class=\"cn('text-foreground', matched && 'bg-primary/15 rounded-sm')\">{{\n        entry.key\n      }}</span>\n      <span class=\"text-muted-foreground\">: </span>\n      <span\n        :class=\"\n          cn(\n            entry.kind === 'string' && 'text-emerald-700 dark:text-emerald-400',\n            entry.kind === 'number' && 'text-sky-700 dark:text-sky-400',\n            entry.kind === 'boolean' && 'text-violet-700 dark:text-violet-400',\n            entry.kind === 'null' && 'text-muted-foreground',\n            'break-all',\n          )\n        \"\n        >{{ jsonScalar(entry.value) }}</span\n      >\n    </li>\n    <li v-else role=\"treeitem\" aria-selected=\"false\" :aria-expanded=\"expanded\">\n      <button\n        type=\"button\"\n        class=\"hover:bg-muted flex w-full items-center gap-1 rounded py-px text-start\"\n        :style=\"{ paddingInlineStart: `${depth * 12}px` }\"\n        :aria-label=\"\n          expanded\n            ? t('dev_tools.collapse', { key: entry.key }, 'Collapse :key')\n            : t('dev_tools.expand', { key: entry.key }, 'Expand :key')\n        \"\n        @click=\"open = !open\"\n      >\n        <!-- The tree is always left to right (it is code), so the chevron does not flip. -->\n        <ChevronRightIcon\n          :class=\"cn('size-3 shrink-0 transition-transform', expanded && 'rotate-90')\"\n        />\n        <span :class=\"cn('text-foreground', matched && 'bg-primary/15 rounded-sm')\">{{\n          entry.key\n        }}</span>\n        <span class=\"text-muted-foreground\">{{ summary }}</span>\n      </button>\n      <ul v-if=\"expanded && size > 0\" role=\"group\">\n        <DevToolsJsonNode\n          v-for=\"child in children\"\n          :key=\"child.path\"\n          :entry=\"child\"\n          :depth=\"depth + 1\"\n          :search=\"search\"\n          :query=\"query\"\n        />\n      </ul>\n    </li>\n  </template>\n</template>\n"],"mappings":"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"}