@8wave/ai-elements 0.115.0-beta.60 → 0.115.0-beta.72

package/dist/_chunks/{PkToolShowImageGallery-CgjP34RE.js → PkToolShowImageGallery-CTuPFowW.js}

@@ -1,11 +1,11 @@
 import { C as e, F as t, L as n, O as r, St as i, Tt as a, Z as o, _ as s, bt as c, d as l, g as u, h as d, it as f, m as p, pt as m, v as h, x as g, xt as _, z as v } from "./vue.runtime.esm-bundler-B-NVlZCY.js";
 import "./src-CrSt0jv_.js";
 import { n as y } from "./url-validation-9DstIfq2.js";
-import { t as b } from "./index.es-B9zAw2XU.js";
+import { t as b } from "./index.es-D_E1Gj_U.js";
 import { t as x } from "./useImageFallback-B34OW3LE.js";
-import { n as S } from "./chatImagePolicy-Cnmsgd96.js";
+import { n as S } from "./chatImagePolicy-LzNQAjTs.js";
 import { n as C, t as w } from "./useLightbox-Dxdaz_i1.js";
-import { t as T } from "./PkHeldImage-CtqqMvpW.js";
+import { t as T } from "./PkHeldImage-B4gZSfa6.js";
 //#region ../../packages/components/src/chat/PkToolShowImageGallery.vue?vue&type=script&setup=true&lang.ts
 r(), _(), f();
 var E = {
@@ -85,4 +85,4 @@ var E = {
 //#endregion
 export { P as default };
 
-//# sourceMappingURL=PkToolShowImageGallery-CgjP34RE.js.map
+//# sourceMappingURL=PkToolShowImageGallery-CTuPFowW.js.map

package/dist/_chunks/{PkToolShowImageGallery-CgjP34RE.js.map → PkToolShowImageGallery-CTuPFowW.js.map}

@@ -1 +1 @@
-{"version":3,"file":"PkToolShowImageGallery-CgjP34RE.js","names":["$t","__unplugin_components_0","_openBlock","_createElementBlock","_createElementVNode","_createVNode","_toDisplayString","_normalizeClass","_Fragment","_renderList","_unref","_createBlock","PkHeldImage","_createCommentVNode","_sfc_main","defineComponent","onMounted","openBlock","init_runtime_core_esm_bundler","normalizeClass","toDisplayString","watchEffect","createCommentVNode","unref","Fragment","createBlock","createBaseVNode","init_reactivity_esm_bundler","computed","ref","createElementBlock","createVNode","init_shared_esm_bundler","renderList","isSameSite","Ae","useImageFallback","useChatImageGate","useLightbox","useImageSizes","PkHeldImage_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","PkToolShowImageGallery_default","props","__props","toolPart","galleryRef","images","imageGate","isShown","url","canShowImage","measured","ready","image","gridCols","count","init","_component_VvIcon","_ctx","getSize","onImageError"],"sources":["../../../../packages/components/src/chat/PkToolShowImageGallery.vue","../../../../packages/components/src/chat/PkToolShowImageGallery.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import { computed, ref, onMounted, watchEffect } from 'vue'\n    import { isSameSite } from 'utils'\n    import { useImageFallback } from 'composables'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n    import { useChatImageGate } from './chatImagePolicy'\n    import PkHeldImage from './PkHeldImage.vue'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                images: Array<{\n                    url: string\n                    caption?: string\n                    alt?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n\n    const images = computed(() => toolPart.value.input?.images ?? [])\n\n    const { canShowImage, onImageError } = useImageFallback()\n    // The model writes these urls: one from a host the agent does not list\n    // waits for a click (chatImagePolicy.ts). Until then it is not measured,\n    // linked or handed to the lightbox, which would all fetch it.\n    const imageGate = useChatImageGate()\n    const isShown = (url: string) => imageGate.canLoad(url) && canShowImage(url)\n\n    // Measured once it may load: a held image when it is released, a short\n    // link when it resolves to a listed host.\n    const measured = new Set<string>()\n    watchEffect(() => {\n        const ready = images.value.filter(\n            (image) => !measured.has(image.url) && imageGate.canLoad(image.url),\n        )\n        for (const image of ready) {\n            measured.add(image.url)\n        }\n        preload(ready)\n    })\n\n    const gridCols = computed(() => {\n        const count = images.value.length\n        if (count === 1) {\n            return 'grid-cols-1 justify-items-center'\n        }\n        if (count === 2) {\n            return 'grid-cols-2'\n        }\n        return 'grid-cols-3'\n    })\n\n    const { init } = useLightbox({ gallery: galleryRef })\n\n    onMounted(async () => {\n        await init()\n    })\n</script>\n\n<template>\n    <div\n        v-if=\"images.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:image-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">\n                {{ $t('label.gallery', { count: images.length }) }}\n            </strong>\n        </div>\n        <div class=\"p-sm\">\n            <div ref=\"galleryRef\" class=\"grid gap-8\" :class=\"gridCols\">\n                <a\n                    v-for=\"image in images\"\n                    :key=\"image.url\"\n                    :href=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-src=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-width=\"getSize(image.url).width\"\n                    :data-pswp-height=\"getSize(image.url).height\"\n                    :data-pswp-caption=\"image.caption ?? image.alt ?? ''\"\n                    :data-cropped=\"true\"\n                    class=\"relative block aspect-square overflow-hidden rounded-xl group max-h-384\"\n                    :class=\"[\n                        { 'w-384 max-w-full': images.length === 1 },\n                        canShowImage(image.url)\n                            ? 'cursor-pointer'\n                            : 'pointer-events-none',\n                    ]\"\n                    :title=\"image.caption ?? image.alt ?? ''\"\n                    :target=\"isSameSite(image.url) ? undefined : '_blank'\"\n                    :rel=\"\n                        isSameSite(image.url)\n                            ? undefined\n                            : 'noopener noreferrer'\n                    \">\n                    <PkHeldImage\n                        v-if=\"!imageGate.canLoad(image.url)\"\n                        :host=\"imageGate.hostOf(image.url)\"\n                        fill\n                        @release=\"imageGate.release(image.url)\" />\n                    <img\n                        v-else-if=\"canShowImage(image.url)\"\n                        :src=\"image.url\"\n                        :alt=\"image.alt ?? image.caption ?? ''\"\n                        class=\"w-full h-full object-cover transition-opacity group-hover:opacity-80\"\n                        @error=\"onImageError(image.url)\" />\n                    <div\n                        v-else\n                        class=\"w-full h-full flex flex-col items-center justify-center gap-4 bg-surface-1 text-word-3\">\n                        <VvIcon name=\"ri:camera-off-line\" class=\"text-24\" />\n                        <span class=\"text-12\">{{\n                            $t('label.imageLoadError')\n                        }}</span>\n                    </div>\n                </a>\n            </div>\n        </div>\n    </div>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, ref, onMounted, watchEffect } from 'vue'\n    import { isSameSite } from 'utils'\n    import { useImageFallback } from 'composables'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n    import { useChatImageGate } from './chatImagePolicy'\n    import PkHeldImage from './PkHeldImage.vue'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                images: Array<{\n                    url: string\n                    caption?: string\n                    alt?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n\n    const images = computed(() => toolPart.value.input?.images ?? [])\n\n    const { canShowImage, onImageError } = useImageFallback()\n    // The model writes these urls: one from a host the agent does not list\n    // waits for a click (chatImagePolicy.ts). Until then it is not measured,\n    // linked or handed to the lightbox, which would all fetch it.\n    const imageGate = useChatImageGate()\n    const isShown = (url: string) => imageGate.canLoad(url) && canShowImage(url)\n\n    // Measured once it may load: a held image when it is released, a short\n    // link when it resolves to a listed host.\n    const measured = new Set<string>()\n    watchEffect(() => {\n        const ready = images.value.filter(\n            (image) => !measured.has(image.url) && imageGate.canLoad(image.url),\n        )\n        for (const image of ready) {\n            measured.add(image.url)\n        }\n        preload(ready)\n    })\n\n    const gridCols = computed(() => {\n        const count = images.value.length\n        if (count === 1) {\n            return 'grid-cols-1 justify-items-center'\n        }\n        if (count === 2) {\n            return 'grid-cols-2'\n        }\n        return 'grid-cols-3'\n    })\n\n    const { init } = useLightbox({ gallery: galleryRef })\n\n    onMounted(async () => {\n        await init()\n    })\n</script>\n\n<template>\n    <div\n        v-if=\"images.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:image-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">\n                {{ $t('label.gallery', { count: images.length }) }}\n            </strong>\n        </div>\n        <div class=\"p-sm\">\n            <div ref=\"galleryRef\" class=\"grid gap-8\" :class=\"gridCols\">\n                <a\n                    v-for=\"image in images\"\n                    :key=\"image.url\"\n                    :href=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-src=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-width=\"getSize(image.url).width\"\n                    :data-pswp-height=\"getSize(image.url).height\"\n                    :data-pswp-caption=\"image.caption ?? image.alt ?? ''\"\n                    :data-cropped=\"true\"\n                    class=\"relative block aspect-square overflow-hidden rounded-xl group max-h-384\"\n                    :class=\"[\n                        { 'w-384 max-w-full': images.length === 1 },\n                        canShowImage(image.url)\n                            ? 'cursor-pointer'\n                            : 'pointer-events-none',\n                    ]\"\n                    :title=\"image.caption ?? image.alt ?? ''\"\n                    :target=\"isSameSite(image.url) ? undefined : '_blank'\"\n                    :rel=\"\n                        isSameSite(image.url)\n                            ? undefined\n                            : 'noopener noreferrer'\n                    \">\n                    <PkHeldImage\n                        v-if=\"!imageGate.canLoad(image.url)\"\n                        :host=\"imageGate.hostOf(image.url)\"\n                        fill\n                        @release=\"imageGate.release(image.url)\" />\n                    <img\n                        v-else-if=\"canShowImage(image.url)\"\n                        :src=\"image.url\"\n                        :alt=\"image.alt ?? image.caption ?? ''\"\n                        class=\"w-full h-full object-cover transition-opacity group-hover:opacity-80\"\n                        @error=\"onImageError(image.url)\" />\n                    <div\n                        v-else\n                        class=\"w-full h-full flex flex-col items-center justify-center gap-4 bg-surface-1 text-word-3\">\n                        <VvIcon name=\"ri:camera-off-line\" class=\"text-24\" />\n                        <span class=\"text-12\">{{\n                            $t('label.imageLoadError')\n                        }}</span>\n                    </div>\n                </a>\n            </div>\n        </div>\n    </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"PkToolShowImageGallery-CTuPFowW.js","names":["$t","__unplugin_components_0","_openBlock","_createElementBlock","_createElementVNode","_createVNode","_toDisplayString","_normalizeClass","_Fragment","_renderList","_unref","_createBlock","PkHeldImage","_createCommentVNode","_sfc_main","defineComponent","onMounted","openBlock","init_runtime_core_esm_bundler","normalizeClass","toDisplayString","watchEffect","createCommentVNode","unref","Fragment","createBlock","createBaseVNode","init_reactivity_esm_bundler","computed","ref","createElementBlock","createVNode","init_shared_esm_bundler","renderList","isSameSite","Ae","useImageFallback","useChatImageGate","useLightbox","useImageSizes","PkHeldImage_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","PkToolShowImageGallery_default","props","__props","toolPart","galleryRef","images","imageGate","isShown","url","canShowImage","measured","ready","image","gridCols","count","init","_component_VvIcon","_ctx","getSize","onImageError"],"sources":["../../../../packages/components/src/chat/PkToolShowImageGallery.vue","../../../../packages/components/src/chat/PkToolShowImageGallery.vue"],"sourcesContent":["<script setup lang=\"ts\">\n    import { computed, ref, onMounted, watchEffect } from 'vue'\n    import { isSameSite } from 'utils'\n    import { useImageFallback } from 'composables'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n    import { useChatImageGate } from './chatImagePolicy'\n    import PkHeldImage from './PkHeldImage.vue'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                images: Array<{\n                    url: string\n                    caption?: string\n                    alt?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n\n    const images = computed(() => toolPart.value.input?.images ?? [])\n\n    const { canShowImage, onImageError } = useImageFallback()\n    // The model writes these urls: one from a host the agent does not list\n    // waits for a click (chatImagePolicy.ts). Until then it is not measured,\n    // linked or handed to the lightbox, which would all fetch it.\n    const imageGate = useChatImageGate()\n    const isShown = (url: string) => imageGate.canLoad(url) && canShowImage(url)\n\n    // Measured once it may load: a held image when it is released, a short\n    // link when it resolves to a listed host.\n    const measured = new Set<string>()\n    watchEffect(() => {\n        const ready = images.value.filter(\n            (image) => !measured.has(image.url) && imageGate.canLoad(image.url),\n        )\n        for (const image of ready) {\n            measured.add(image.url)\n        }\n        preload(ready)\n    })\n\n    const gridCols = computed(() => {\n        const count = images.value.length\n        if (count === 1) {\n            return 'grid-cols-1 justify-items-center'\n        }\n        if (count === 2) {\n            return 'grid-cols-2'\n        }\n        return 'grid-cols-3'\n    })\n\n    const { init } = useLightbox({ gallery: galleryRef })\n\n    onMounted(async () => {\n        await init()\n    })\n</script>\n\n<template>\n    <div\n        v-if=\"images.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:image-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">\n                {{ $t('label.gallery', { count: images.length }) }}\n            </strong>\n        </div>\n        <div class=\"p-sm\">\n            <div ref=\"galleryRef\" class=\"grid gap-8\" :class=\"gridCols\">\n                <a\n                    v-for=\"image in images\"\n                    :key=\"image.url\"\n                    :href=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-src=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-width=\"getSize(image.url).width\"\n                    :data-pswp-height=\"getSize(image.url).height\"\n                    :data-pswp-caption=\"image.caption ?? image.alt ?? ''\"\n                    :data-cropped=\"true\"\n                    class=\"relative block aspect-square overflow-hidden rounded-xl group max-h-384\"\n                    :class=\"[\n                        { 'w-384 max-w-full': images.length === 1 },\n                        canShowImage(image.url)\n                            ? 'cursor-pointer'\n                            : 'pointer-events-none',\n                    ]\"\n                    :title=\"image.caption ?? image.alt ?? ''\"\n                    :target=\"isSameSite(image.url) ? undefined : '_blank'\"\n                    :rel=\"\n                        isSameSite(image.url)\n                            ? undefined\n                            : 'noopener noreferrer'\n                    \">\n                    <PkHeldImage\n                        v-if=\"!imageGate.canLoad(image.url)\"\n                        :host=\"imageGate.hostOf(image.url)\"\n                        fill\n                        @release=\"imageGate.release(image.url)\" />\n                    <img\n                        v-else-if=\"canShowImage(image.url)\"\n                        :src=\"image.url\"\n                        :alt=\"image.alt ?? image.caption ?? ''\"\n                        class=\"w-full h-full object-cover transition-opacity group-hover:opacity-80\"\n                        @error=\"onImageError(image.url)\" />\n                    <div\n                        v-else\n                        class=\"w-full h-full flex flex-col items-center justify-center gap-4 bg-surface-1 text-word-3\">\n                        <VvIcon name=\"ri:camera-off-line\" class=\"text-24\" />\n                        <span class=\"text-12\">{{\n                            $t('label.imageLoadError')\n                        }}</span>\n                    </div>\n                </a>\n            </div>\n        </div>\n    </div>\n</template>\n","<script setup lang=\"ts\">\n    import { computed, ref, onMounted, watchEffect } from 'vue'\n    import { isSameSite } from 'utils'\n    import { useImageFallback } from 'composables'\n    import { useLightbox, useImageSizes } from '../composables/useLightbox'\n    import { useChatImageGate } from './chatImagePolicy'\n    import PkHeldImage from './PkHeldImage.vue'\n\n    const props = defineProps<{\n        part: unknown\n    }>()\n\n    const toolPart = computed(() => {\n        const part = props.part as {\n            input?: {\n                images: Array<{\n                    url: string\n                    caption?: string\n                    alt?: string\n                }>\n            }\n        }\n        return part\n    })\n\n    const galleryRef = ref<HTMLElement>()\n    const { preload, getSize } = useImageSizes()\n\n    const images = computed(() => toolPart.value.input?.images ?? [])\n\n    const { canShowImage, onImageError } = useImageFallback()\n    // The model writes these urls: one from a host the agent does not list\n    // waits for a click (chatImagePolicy.ts). Until then it is not measured,\n    // linked or handed to the lightbox, which would all fetch it.\n    const imageGate = useChatImageGate()\n    const isShown = (url: string) => imageGate.canLoad(url) && canShowImage(url)\n\n    // Measured once it may load: a held image when it is released, a short\n    // link when it resolves to a listed host.\n    const measured = new Set<string>()\n    watchEffect(() => {\n        const ready = images.value.filter(\n            (image) => !measured.has(image.url) && imageGate.canLoad(image.url),\n        )\n        for (const image of ready) {\n            measured.add(image.url)\n        }\n        preload(ready)\n    })\n\n    const gridCols = computed(() => {\n        const count = images.value.length\n        if (count === 1) {\n            return 'grid-cols-1 justify-items-center'\n        }\n        if (count === 2) {\n            return 'grid-cols-2'\n        }\n        return 'grid-cols-3'\n    })\n\n    const { init } = useLightbox({ gallery: galleryRef })\n\n    onMounted(async () => {\n        await init()\n    })\n</script>\n\n<template>\n    <div\n        v-if=\"images.length\"\n        class=\"border border-surface-3 rounded-xl w-full overflow-hidden bg-surface\">\n        <div\n            class=\"px-sm py-6 bg-surface-1 min-h-40 text-12 border-b border-surface-3 text-word-3 flex items-center gap-8 min-h-40\">\n            <VvIcon name=\"ri:image-line\" class=\"text-16\" />\n            <strong class=\"font-bold\">\n                {{ $t('label.gallery', { count: images.length }) }}\n            </strong>\n        </div>\n        <div class=\"p-sm\">\n            <div ref=\"galleryRef\" class=\"grid gap-8\" :class=\"gridCols\">\n                <a\n                    v-for=\"image in images\"\n                    :key=\"image.url\"\n                    :href=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-src=\"isShown(image.url) ? image.url : undefined\"\n                    :data-pswp-width=\"getSize(image.url).width\"\n                    :data-pswp-height=\"getSize(image.url).height\"\n                    :data-pswp-caption=\"image.caption ?? image.alt ?? ''\"\n                    :data-cropped=\"true\"\n                    class=\"relative block aspect-square overflow-hidden rounded-xl group max-h-384\"\n                    :class=\"[\n                        { 'w-384 max-w-full': images.length === 1 },\n                        canShowImage(image.url)\n                            ? 'cursor-pointer'\n                            : 'pointer-events-none',\n                    ]\"\n                    :title=\"image.caption ?? image.alt ?? ''\"\n                    :target=\"isSameSite(image.url) ? undefined : '_blank'\"\n                    :rel=\"\n                        isSameSite(image.url)\n                            ? undefined\n                            : 'noopener noreferrer'\n                    \">\n                    <PkHeldImage\n                        v-if=\"!imageGate.canLoad(image.url)\"\n                        :host=\"imageGate.hostOf(image.url)\"\n                        fill\n                        @release=\"imageGate.release(image.url)\" />\n                    <img\n                        v-else-if=\"canShowImage(image.url)\"\n                        :src=\"image.url\"\n                        :alt=\"image.alt ?? image.caption ?? ''\"\n                        class=\"w-full h-full object-cover transition-opacity group-hover:opacity-80\"\n                        @error=\"onImageError(image.url)\" />\n                    <div\n                        v-else\n                        class=\"w-full h-full flex flex-col items-center justify-center gap-4 bg-surface-1 text-word-3\">\n                        <VvIcon name=\"ri:camera-off-line\" class=\"text-24\" />\n                        <span class=\"text-12\">{{\n                            $t('label.imageLoadError')\n                        }}</span>\n                    </div>\n                </a>\n            </div>\n        </div>\n    </div>\n</template>\n"],"mappings":"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"}

package/dist/_chunks/{PkToolShowLocation-rK5fcW4y.js → PkToolShowLocation-Bf4jmDYQ.js}

@@ -3,7 +3,7 @@ import { $ as t, C as n, Ct as r, E as i, F as a, L as o, N as s, O as c, P as l
 import { n as M, t as te } from "./cdn-css-JUUNhyQ6.js";
 import "./src-CrSt0jv_.js";
 import { i as ne } from "./dist-Ce9Hi58x.js";
-import { a as re, d as ie, r as ae, t as oe, u as se } from "./index.es-B9zAw2XU.js";
+import { a as re, d as ie, r as ae, t as oe, u as se } from "./index.es-D_E1Gj_U.js";
 //#region ../../node_modules/.pnpm/maplibre-gl@5.24.0/node_modules/maplibre-gl/dist/maplibre-gl.js
 var ce = /* @__PURE__ */ e(((e, t) => {
 	(function(n, r) {
@@ -34784,4 +34784,4 @@ var Ue = {
 //#endregion
 export { $e as default };
 
-//# sourceMappingURL=PkToolShowLocation-rK5fcW4y.js.map
+//# sourceMappingURL=PkToolShowLocation-Bf4jmDYQ.js.map