@g1cloud/page-builder-editor 1.0.0-alpha.102 → 1.0.0-alpha.103

package/dist/{PbPropertyEditorColor-BLmbxHlj.js → PbPropertyEditorColor-0zFwhnJp.js}

@@ -1,6 +1,6 @@
 import { defineComponent, openBlock, createElementBlock, createElementVNode, withDirectives, unref, createVNode } from "vue";
 import { vT, BSTextInput } from "@g1cloud/bluesea";
-import { P as PbColorPicker } from "./index-BKkW50R0.js";
+import { P as PbColorPicker } from "./index-BsMUbVZy.js";
 const _hoisted_1 = { class: "property-editor property-editor-color" };
 const _hoisted_2 = { class: "title" };
 const _hoisted_3 = { class: "bs-layout-horizontal flex-align-center color" };

package/dist/{PbPropertyEditorCssLength-D-rlVWI8.js → PbPropertyEditorCssLength-7sBhgyiM.js}

@@ -1,6 +1,6 @@
 import { defineComponent, openBlock, createElementBlock, createElementVNode, withDirectives, unref, createVNode } from "vue";
 import { vT, BSTextInput } from "@g1cloud/bluesea";
-import { t as toCssLength } from "./index-BKkW50R0.js";
+import { t as toCssLength } from "./index-BsMUbVZy.js";
 const _hoisted_1 = { class: "property-editor property-editor-number flex-align-center" };
 const _hoisted_2 = { class: "title" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/{PbPropertyEditorHtml-D65dKk8P.js → PbPropertyEditorHtml-Cz33ZrZp.js}

@@ -1,6 +1,6 @@
 import { defineComponent, openBlock, createElementBlock, createElementVNode, withDirectives, unref, createTextVNode, defineAsyncComponent } from "vue";
 import { useModal, vT } from "@g1cloud/bluesea";
-import { u as usePageBuilderEditor } from "./index-BKkW50R0.js";
+import { u as usePageBuilderEditor } from "./index-BsMUbVZy.js";
 const _hoisted_1 = { class: "property-editor property-editor-html flex-align-center" };
 const _hoisted_2 = { class: "title" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/{PbPropertyEditorImage-Bh9_XDi6.js → PbPropertyEditorImage-DCOGVu0_.js}

@@ -1,5 +1,5 @@
 import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, withDirectives, unref, createTextVNode, toDisplayString, createVNode, createCommentVNode, Fragment } from "vue";
-import { u as usePageBuilderEditor, C as ChangePropertyCommand } from "./index-BKkW50R0.js";
+import { u as usePageBuilderEditor, C as ChangePropertyCommand } from "./index-BsMUbVZy.js";
 import { useModal, vT, BSButton, BSMultiLangTextInput, showNotification } from "@g1cloud/bluesea";
 const _hoisted_1 = { class: "property-editor property-editor-image" };
 const _hoisted_2 = { class: "title" };

package/dist/{PbPropertyEditorMultilineText-BQ5EOr92.js → PbPropertyEditorMultilineText-705l-6cb.js}

@@ -1,6 +1,6 @@
 import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, withDirectives, unref, createBlock } from "vue";
 import { vT, BSMultiLangTextArea, BSTextArea } from "@g1cloud/bluesea";
-import { u as usePageBuilderEditor } from "./index-BKkW50R0.js";
+import { u as usePageBuilderEditor } from "./index-BsMUbVZy.js";
 const _hoisted_1 = { class: "property-editor property-editor-multiline-text" };
 const _hoisted_2 = { class: "title" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/{PbPropertyEditorText-BuNC6dLo.js → PbPropertyEditorText-C1ktcMVa.js}

@@ -1,6 +1,6 @@
 import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, withDirectives, unref, createBlock } from "vue";
 import { vT, BSMultiLangTextInput, BSTextInput } from "@g1cloud/bluesea";
-import { u as usePageBuilderEditor } from "./index-BKkW50R0.js";
+import { u as usePageBuilderEditor } from "./index-BsMUbVZy.js";
 const _hoisted_1 = { class: "property-editor property-editor-text flex-align-center" };
 const _hoisted_2 = { class: "title" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/{PbPropertyEditorYoutube-DuPiKQNB.js → PbPropertyEditorYoutube-R2dUexOc.js}

@@ -1,6 +1,6 @@
 import { defineComponent, openBlock, createElementBlock, createElementVNode, withDirectives, unref, createTextVNode, toDisplayString, createVNode, createCommentVNode } from "vue";
 import { useModal, vT, BSButton } from "@g1cloud/bluesea";
-import { s as selectYoutubeVideo } from "./index-BKkW50R0.js";
+import { s as selectYoutubeVideo } from "./index-BsMUbVZy.js";
 const _hoisted_1 = { class: "property-editor property-editor-image flex-align-center" };
 const _hoisted_2 = { class: "title" };
 const _hoisted_3 = {

package/dist/{PbWidgetAddModal-BOcLVwum.js → PbWidgetAddModal-CNblLmnp.js}

@@ -1,6 +1,6 @@
 import { defineComponent, computed, openBlock, createBlock, unref, withCtx, createElementVNode, createElementBlock, Fragment, renderList, toDisplayString } from "vue";
 import { useModalHandle, BSModalFrame } from "@g1cloud/bluesea";
-import { w as widgetPartDefinitions } from "./index-BKkW50R0.js";
+import { w as widgetPartDefinitions } from "./index-BsMUbVZy.js";
 const _hoisted_1 = { class: "bs-layout-vertical pb-part-add-modal" };
 const _hoisted_2 = { class: "bs-layout-horizontal-wrap ml-16 mb-8 gap-8" };
 const _hoisted_3 = ["onClick", "textContent"];

package/dist/PbYoutubeModal-BJuyyip-.js

@@ -0,0 +1,148 @@
+import { defineComponent, ref, computed, openBlock, createBlock, unref, withCtx, createElementVNode, withDirectives, createVNode, createElementBlock, normalizeStyle } from "vue";
+import { useModalHandle, BSModalFrame, vT, BSTextInput } from "@g1cloud/bluesea";
+import { _ as _export_sfc } from "./index-BsMUbVZy.js";
+const _hoisted_1 = { class: "bs-layout-vertical flex-grow-1 h-full" };
+const _hoisted_2 = { class: "pt-8" };
+const _hoisted_3 = { class: "preview-wrapper" };
+const _hoisted_4 = ["src"];
+const _hoisted_5 = { class: "bs-layout-horizontal justify-content-center" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "PbYoutubeModal",
+  props: {
+    url: {}
+  },
+  emits: ["selectUrl"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const modalHandle = useModalHandle();
+    const url = ref(props.url);
+    const aspectRatio = ref();
+    const extractVideoId = (raw) => {
+      const value = raw.trim();
+      if (!value) return void 0;
+      if (/^[\w-]{11}$/.test(value)) return value;
+      try {
+        const u = new URL(value);
+        const host = u.hostname.replace(/^www\./, "");
+        if (host === "youtu.be") {
+          const id = u.pathname.slice(1).split("/")[0];
+          return id || void 0;
+        }
+        if (host === "youtube.com" || host === "youtube-nocookie.com" || host === "m.youtube.com") {
+          const v = u.searchParams.get("v");
+          if (v) return v;
+          const segs = u.pathname.split("/").filter(Boolean);
+          const idx = segs.findIndex((s) => s === "embed" || s === "shorts" || s === "live" || s === "v");
+          if (idx >= 0 && segs[idx + 1]) return segs[idx + 1];
+        }
+      } catch {
+      }
+      return void 0;
+    };
+    const embedSrc = computed(() => {
+      if (!url.value) return void 0;
+      const id = extractVideoId(url.value);
+      if (!id) return void 0;
+      return `https://www.youtube-nocookie.com/embed/${id}`;
+    });
+    const aspectRatioCss = computed(() => {
+      const raw = aspectRatio.value;
+      if (raw) {
+        const parts = raw.split("/");
+        if (parts.length === 2) {
+          const w = Number(parts[0]);
+          const h = Number(parts[1]);
+          if (w > 0 && h > 0) return `${w} / ${h}`;
+        }
+      }
+      return "16 / 9";
+    });
+    const iframeStyle = computed(() => ({
+      width: "100%",
+      aspectRatio: aspectRatioCss.value,
+      border: "0",
+      display: "block"
+    }));
+    const fetchAspectRatio = async (videoUrl) => {
+      try {
+        const oembedUrl = `https://www.youtube.com/oembed?url=${encodeURIComponent(videoUrl)}&format=json`;
+        const response = await fetch(oembedUrl);
+        if (!response.ok) return;
+        const data = await response.json();
+        if (data.width && data.height) {
+          aspectRatio.value = `${data.width}/${data.height}`;
+        }
+      } catch {
+      }
+    };
+    const updateUrl = (value) => {
+      url.value = value;
+      aspectRatio.value = void 0;
+      if (value) {
+        fetchAspectRatio(value);
+      }
+    };
+    if (props.url) {
+      fetchAspectRatio(props.url);
+    }
+    const ok = () => {
+      emit("selectUrl", url.value, aspectRatio.value);
+      modalHandle.close();
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(BSModalFrame), {
+        title: { key: "pb.modal.youtube.title" },
+        class: "pb-youtube-modal"
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            withDirectives(createElementVNode("div", null, null, 512), [
+              [unref(vT), { key: "pb.modal.youtube.url" }]
+            ]),
+            createVNode(unref(BSTextInput), {
+              "model-value": url.value,
+              width: "100%",
+              "onUpdate:modelValue": updateUrl
+            }, null, 8, ["model-value"]),
+            withDirectives(createElementVNode("div", _hoisted_2, null, 512), [
+              [unref(vT), { key: "pb.modal.youtube.preview" }]
+            ]),
+            createElementVNode("div", _hoisted_3, [
+              embedSrc.value ? (openBlock(), createElementBlock("iframe", {
+                key: 0,
+                src: embedSrc.value,
+                style: normalizeStyle(iframeStyle.value),
+                frameborder: "0",
+                referrerpolicy: "strict-origin-when-cross-origin",
+                allow: "accelerometer; encrypted-media; gyroscope; picture-in-picture; web-share",
+                allowfullscreen: "",
+                loading: "lazy",
+                title: "YouTube preview"
+              }, null, 12, _hoisted_4)) : (openBlock(), createElementBlock("div", {
+                key: 1,
+                class: "preview-empty border-w-1 border border-gray",
+                style: normalizeStyle({ aspectRatio: aspectRatioCss.value })
+              }, null, 4))
+            ])
+          ])
+        ]),
+        buttons: withCtx(() => [
+          createElementVNode("div", _hoisted_5, [
+            withDirectives(createElementVNode("button", {
+              class: "mr-4",
+              onClick: ok
+            }, null, 512), [
+              [unref(vT), { key: "pb.button.ok" }]
+            ])
+          ])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+const PbYoutubeModal = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b8f2a18d"]]);
+export {
+  PbYoutubeModal as default
+};