@youcan/celeste 0.6.29 → 0.6.31

package/dist/es/link-bubble.js

@@ -0,0 +1,229 @@
+import { defineComponent, defineAsyncComponent, ref, computed, onMounted, onUnmounted, openBlock, createBlock, unref, withCtx, createElementBlock, createElementVNode, createVNode, withKeys, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import Button from "./button.js";
+import CompactButton from "./compact-button.js";
+import LinkButton from "./link-button.js";
+import Label from "./label.js";
+import { _ as _sfc_main$1 } from "./chunks/switch.vue_vue_type_style_index_0_lang.js";
+import TextInputAffix from "./text-input-affix.js";
+import TextInput from "./text-input.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _hoisted_1 = {
+  key: 0,
+  class: "set-mode"
+};
+const _hoisted_2 = { class: "set-link" };
+const _hoisted_3 = { class: "switch-button-box" };
+const _hoisted_4 = {
+  key: 1,
+  class: "edit-mode"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "link-bubble",
+  props: {
+    editor: {},
+    showSetLinkFromToolbar: { type: Boolean }
+  },
+  emits: ["set-link-closed"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const BubbleMenu = defineAsyncComponent(
+      () => import("./chunks/index2.js").then((m) => m.BubbleMenu)
+    );
+    const href = ref("");
+    const openInNewTab = ref(false);
+    const editing = ref(false);
+    const isTextSelected = () => props.editor.state.selection.from !== props.editor.state.selection.to;
+    const showBubble = computed(() => {
+      return editing.value || props.editor.isActive("link") || props.showSetLinkFromToolbar && isTextSelected();
+    });
+    function startEdit() {
+      editing.value = true;
+      const attrs = props.editor.getAttributes("link");
+      href.value = attrs.href || "";
+      openInNewTab.value = attrs.target === "_blank";
+    }
+    function removeLink() {
+      props.editor.chain().focus().unsetLink().run();
+      reset();
+    }
+    function reset() {
+      editing.value = false;
+      href.value = "";
+      openInNewTab.value = false;
+      emit("set-link-closed");
+    }
+    function truncateMiddleUrl(str) {
+      const maxLength = 40;
+      if (str.length <= maxLength) {
+        return str;
+      }
+      const startChars = Math.ceil((maxLength - 3) / 2);
+      const endChars = Math.floor((maxLength - 3) / 2);
+      return `${str.slice(0, startChars)}...${str.slice(-endChars)}`;
+    }
+    function isAllowedUri() {
+      const url = href.value.trim();
+      if (!url || url.includes(" ")) {
+        return false;
+      }
+      if (url.startsWith("/")) {
+        return true;
+      }
+      if (url.startsWith("./") || url.startsWith("../")) {
+        return false;
+      }
+      const allowedProtocols = /^(?:https?:|mailto:)/i;
+      const disallowedProtocols = /^(?:javascript:|data:)/i;
+      if (disallowedProtocols.test(url)) {
+        return false;
+      }
+      if (allowedProtocols.test(url)) {
+        return true;
+      }
+      return false;
+    }
+    const isValidUrl = computed(() => isAllowedUri());
+    function applyLink() {
+      if (!href.value || !isValidUrl.value) {
+        return;
+      }
+      props.editor.chain().focus().extendMarkRange("link").setLink({
+        href: href.value,
+        target: openInNewTab.value ? "_blank" : null
+      }).run();
+      reset();
+    }
+    const bubbleRef = ref(null);
+    function handleClickOutside(event) {
+      const target = event.target;
+      if (!bubbleRef.value) {
+        return;
+      }
+      if (bubbleRef.value && bubbleRef.value.contains(target)) {
+        return;
+      }
+      if (target.closest(".i-celeste-link")) {
+        return;
+      }
+      emit("set-link-closed");
+    }
+    onMounted(() => {
+      props.editor.on("selectionUpdate", () => {
+        if (props.editor.isActive("link") || props.showSetLinkFromToolbar) {
+          const attrs = props.editor.getAttributes("link");
+          href.value = attrs.href || "";
+          openInNewTab.value = attrs.target === "_blank";
+        } else {
+          reset();
+        }
+      });
+      document.addEventListener("click", handleClickOutside);
+    });
+    onUnmounted(() => {
+      document.removeEventListener("click", handleClickOutside);
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(BubbleMenu), {
+        "should-show": () => true,
+        editor: _ctx.editor,
+        options: {
+          placement: "bottom",
+          offset: {
+            mainAxis: 0,
+            crossAxis: 12
+          }
+        }
+      }, {
+        default: withCtx(() => [
+          showBubble.value ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            ref_key: "bubbleRef",
+            ref: bubbleRef,
+            class: "link-bubble"
+          }, [
+            editing.value || props.showSetLinkFromToolbar && isTextSelected() ? (openBlock(), createElementBlock("div", _hoisted_1, [
+              createElementVNode("div", _hoisted_2, [
+                createVNode(TextInput, {
+                  modelValue: href.value,
+                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => href.value = $event),
+                  type: "url",
+                  size: "xs",
+                  placeholder: "Paste or type a link",
+                  class: "link-input",
+                  onKeydown: [
+                    withKeys(applyLink, ["enter"]),
+                    withKeys(reset, ["esc"])
+                  ]
+                }, {
+                  leadingNode: withCtx(() => [
+                    createVNode(TextInputAffix, null, {
+                      default: withCtx(() => _cache[2] || (_cache[2] = [
+                        createElementVNode("i", { class: "i-celeste-link" }, null, -1)
+                      ])),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["modelValue"]),
+                createVNode(Button, {
+                  intent: "neutral",
+                  size: "xs",
+                  variant: "stroke",
+                  disabled: !isValidUrl.value,
+                  onClick: applyLink
+                }, {
+                  default: withCtx(() => _cache[3] || (_cache[3] = [
+                    createTextVNode(" Set link ")
+                  ])),
+                  _: 1
+                }, 8, ["disabled"])
+              ]),
+              createElementVNode("div", _hoisted_3, [
+                createVNode(Label, { for: "open-in-new-tab" }, {
+                  default: withCtx(() => _cache[4] || (_cache[4] = [
+                    createTextVNode(" Open in new tab ")
+                  ])),
+                  _: 1
+                }),
+                createVNode(_sfc_main$1, {
+                  id: "open-in-new-tab",
+                  checked: openInNewTab.value,
+                  "onUpdate:checked": _cache[1] || (_cache[1] = ($event) => openInNewTab.value = $event)
+                }, null, 8, ["checked"])
+              ])
+            ])) : props.editor.isActive("link") ? (openBlock(), createElementBlock("div", _hoisted_4, [
+              createVNode(LinkButton, {
+                href: _ctx.editor.getAttributes("link").href,
+                target: _ctx.editor.getAttributes("link").target
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(truncateMiddleUrl(_ctx.editor.getAttributes("link").href)), 1)
+                ]),
+                _: 1
+              }, 8, ["href", "target"]),
+              _cache[5] || (_cache[5] = createElementVNode("div", { class: "divider" }, null, -1)),
+              createVNode(CompactButton, {
+                icon: "i-celeste-edit-line",
+                size: "lg",
+                variant: "ghost",
+                onClick: startEdit
+              }),
+              createVNode(CompactButton, {
+                icon: "i-celeste-delete-bin-line",
+                size: "lg",
+                variant: "ghost",
+                onClick: removeLink
+              })
+            ])) : createCommentVNode("", true)
+          ], 512)) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["editor"]);
+    };
+  }
+});
+const LinkBubble = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c63c1d92"]]);
+export {
+  LinkBubble as default
+};

package/dist/es/link-button.js

@@ -0,0 +1,45 @@
+import { defineComponent, openBlock, createBlock, unref, normalizeClass, withCtx, renderSlot } from "vue";
+import { c as clsx } from "./chunks/clsx.js";
+import { f as O } from "./chunks/index.js";
+/* empty css                                                                   */
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "link-button",
+  props: {
+    class: {},
+    size: { default: "md" },
+    intent: { default: "primary" },
+    underline: { type: Boolean },
+    disabled: { type: Boolean },
+    asChild: { type: Boolean },
+    as: { default: "a" }
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(O), {
+        as: _ctx.as,
+        disabled: _ctx.disabled,
+        "as-child": _ctx.asChild,
+        class: normalizeClass(unref(clsx)(
+          "celeste-link-button",
+          `celeste-link-button-${_ctx.intent}`,
+          `celeste-link-button-${_ctx.size}`,
+          _ctx.disabled && "celeste-link-button-disabled",
+          _ctx.underline && "celeste-link-button-underline",
+          props.class
+        )),
+        role: _ctx.as === "a" ? "link" : "button"
+      }, {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ]),
+        _: 3
+      }, 8, ["as", "disabled", "as-child", "class", "role"]);
+    };
+  }
+});
+const LinkButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-82b3b1ab"]]);
+export {
+  LinkButton as default
+};

package/dist/es/modal-body.js

@@ -0,0 +1,23 @@
+import { defineComponent, openBlock, createElementBlock, normalizeClass, unref, renderSlot } from "vue";
+import { c as clsx } from "./chunks/clsx.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "modal-body",
+  props: {
+    class: {}
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(clsx)("celeste-modal-body", props.class))
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ], 2);
+    };
+  }
+});
+const modalBody = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8872ed90"]]);
+export {
+  modalBody as default
+};

package/dist/es/modal-close.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "./chunks/modal-close.js";
+export {
+  _sfc_main as default
+};

package/dist/es/modal-content.js

@@ -0,0 +1,49 @@
+import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode, Transition, mergeProps, renderSlot } from "vue";
+import { useDelegatedProps } from "./use-delegated-props.js";
+import { c as clsx } from "./chunks/clsx.js";
+import { x as xe, aa as Dv, ab as Eu, ac as xu } from "./chunks/index.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "modal-content",
+  props: {
+    forceMount: { type: Boolean },
+    trapFocus: { type: Boolean },
+    disableOutsidePointerEvents: { type: Boolean },
+    asChild: { type: Boolean },
+    as: {},
+    class: {},
+    style: {}
+  },
+  emits: ["escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside", "openAutoFocus", "closeAutoFocus"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const delegatedProps = useDelegatedProps(props, "class");
+    const forwarded = xe(delegatedProps, emits);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Dv), null, {
+        default: withCtx(() => [
+          createVNode(unref(Eu), { class: "celeste-modal-overlay" }),
+          createVNode(Transition, { name: "fade" }, {
+            default: withCtx(() => [
+              createVNode(unref(xu), mergeProps(unref(forwarded), {
+                class: unref(clsx)("celeste-modal-content", props.class)
+              }), {
+                default: withCtx(() => [
+                  renderSlot(_ctx.$slots, "default", {}, void 0, true)
+                ]),
+                _: 3
+              }, 16, ["class"])
+            ]),
+            _: 3
+          })
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+const modalContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-bdcae06b"]]);
+export {
+  modalContent as default
+};

package/dist/es/modal-footer.js

@@ -0,0 +1,23 @@
+import { defineComponent, openBlock, createElementBlock, normalizeClass, unref, renderSlot } from "vue";
+import { c as clsx } from "./chunks/clsx.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "modal-footer",
+  props: {
+    class: {}
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(clsx)("celeste-modal-footer", props.class))
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ], 2);
+    };
+  }
+});
+const modalFooter = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f3331df1"]]);
+export {
+  modalFooter as default
+};

package/dist/es/modal-header.js

@@ -0,0 +1,82 @@
+import { defineComponent, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, createCommentVNode, createBlock, withCtx, toDisplayString, createVNode } from "vue";
+import CompactButton from "./compact-button.js";
+import { c as clsx } from "./chunks/clsx.js";
+import { ad as Pu, ae as Du, a as Gl } from "./chunks/index.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _hoisted_1 = ["data-dismissible", "data-alignment", "data-type"];
+const _hoisted_2 = {
+  key: 0,
+  class: "icon"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "content"
+};
+const _hoisted_4 = { class: "title" };
+const _hoisted_5 = { class: "description" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "modal-header",
+  props: {
+    title: {},
+    icon: {},
+    description: {},
+    dismissible: { type: Boolean, default: true },
+    alignment: { default: "horizontal" },
+    type: { default: "default" },
+    class: {}
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(clsx)("celeste-modal-header", props.class)),
+        "data-dismissible": _ctx.dismissible,
+        "data-alignment": _ctx.alignment,
+        "data-type": _ctx.type
+      }, [
+        _ctx.icon ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          createElementVNode("i", {
+            class: normalizeClass(_ctx.icon)
+          }, null, 2)
+        ])) : createCommentVNode("", true),
+        _ctx.title || _ctx.description ? (openBlock(), createElementBlock("div", _hoisted_3, [
+          _ctx.title ? (openBlock(), createBlock(unref(Pu), {
+            key: 0,
+            "as-child": ""
+          }, {
+            default: withCtx(() => [
+              createElementVNode("h2", _hoisted_4, toDisplayString(_ctx.title), 1)
+            ]),
+            _: 1
+          })) : createCommentVNode("", true),
+          _ctx.description ? (openBlock(), createBlock(unref(Du), {
+            key: 1,
+            "as-child": ""
+          }, {
+            default: withCtx(() => [
+              createElementVNode("p", _hoisted_5, toDisplayString(_ctx.description), 1)
+            ]),
+            _: 1
+          })) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true),
+        _ctx.dismissible ? (openBlock(), createBlock(unref(Gl), {
+          key: 2,
+          "as-child": ""
+        }, {
+          default: withCtx(() => [
+            createVNode(CompactButton, {
+              class: "close",
+              icon: "i-celeste-close-line",
+              variant: "ghost"
+            })
+          ]),
+          _: 1
+        })) : createCommentVNode("", true)
+      ], 10, _hoisted_1);
+    };
+  }
+});
+const modalHeader = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a655071e"]]);
+export {
+  modalHeader as default
+};

package/dist/es/modal-trigger.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "./chunks/modal-trigger.js";
+export {
+  _sfc_main as default
+};

package/dist/es/modal.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "./chunks/modal.js";
+export {
+  _sfc_main as default
+};

package/dist/es/popover-content.js

@@ -0,0 +1,105 @@
+import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode, mergeProps, createElementVNode, normalizeStyle, createElementBlock, Fragment, normalizeClass, createCommentVNode, toDisplayString, renderSlot } from "vue";
+import CompactButton from "./compact-button.js";
+import { useDelegatedProps } from "./use-delegated-props.js";
+import { c as clsx } from "./chunks/clsx.js";
+import { x as xe, af as bs, ag as ws, ah as _s, ai as xs } from "./chunks/index.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _hoisted_1 = ["data-icon-size"];
+const _hoisted_2 = { class: "celeste-popover-title" };
+const _hoisted_3 = { class: "celeste-popover-description" };
+const _hoisted_4 = {
+  key: 2,
+  class: "celeste-popover-footer"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "popover-content",
+  props: {
+    class: {},
+    side: { default: "bottom" },
+    title: {},
+    description: {},
+    showTail: { type: Boolean, default: true },
+    dismissible: { type: Boolean, default: true },
+    icon: {},
+    iconSize: { default: "lg" }
+  },
+  emits: ["escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside", "openAutoFocus", "closeAutoFocus"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const delegatedProps = useDelegatedProps(props, ["class", "title"]);
+    const forwarded = xe(delegatedProps, emits);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(bs), null, {
+        default: withCtx(() => [
+          createVNode(unref(ws), mergeProps({ ...unref(forwarded), ..._ctx.$attrs }, {
+            "side-offset": _ctx.showTail ? 0 : 8,
+            class: unref(clsx)(
+              "celeste-popover-content-wrapper",
+              props.class
+            )
+          }), {
+            default: withCtx(() => [
+              createElementVNode("div", {
+                class: "celeste-popover-content",
+                style: normalizeStyle({ padding: !_ctx.$slots.default ? "var(--spacing-16)" : "" })
+              }, [
+                !_ctx.$slots.default ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                  _ctx.icon ? (openBlock(), createElementBlock("span", {
+                    key: 0,
+                    class: "celeste-popover-icon",
+                    "data-icon-size": _ctx.iconSize
+                  }, [
+                    createElementVNode("i", {
+                      class: normalizeClass(_ctx.icon)
+                    }, null, 2)
+                  ], 8, _hoisted_1)) : createCommentVNode("", true),
+                  createElementVNode("p", _hoisted_2, toDisplayString(_ctx.title), 1),
+                  createElementVNode("p", _hoisted_3, toDisplayString(_ctx.description), 1)
+                ], 64)) : renderSlot(_ctx.$slots, "default", { key: 1 }, void 0, true)
+              ], 4),
+              _ctx.showTail ? (openBlock(), createBlock(unref(_s), {
+                key: 0,
+                "as-child": "",
+                width: 16,
+                height: 8
+              }, {
+                default: withCtx(() => _cache[0] || (_cache[0] = [
+                  createElementVNode("span", { class: "celeste-popover-arrow" }, null, -1)
+                ])),
+                _: 1
+              })) : createCommentVNode("", true),
+              _ctx.dismissible ? (openBlock(), createBlock(unref(xs), {
+                key: 1,
+                "as-child": "",
+                class: "PopoverClose",
+                "aria-label": "Close"
+              }, {
+                default: withCtx(() => [
+                  createVNode(CompactButton, {
+                    variant: "ghost",
+                    icon: "i-celeste-close-line",
+                    class: "celeste-popover-close-button"
+                  })
+                ]),
+                _: 1
+              })) : createCommentVNode("", true),
+              _ctx.$slots.footer ? (openBlock(), createElementBlock("div", _hoisted_4, [
+                renderSlot(_ctx.$slots, "footer", {}, void 0, true)
+              ])) : createCommentVNode("", true)
+            ]),
+            _: 3
+          }, 16, ["side-offset", "class"])
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+const PopoverContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-fae157b1"]]);
+export {
+  PopoverContent as default
+};

package/dist/es/popover-trigger.js

@@ -0,0 +1,25 @@
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from "vue";
+import { aj as gs } from "./chunks/index.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "popover-trigger",
+  props: {
+    asChild: { type: Boolean },
+    as: {}
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(gs), mergeProps({ class: "celeste-popover-trigger" }, props, { as: "div" }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+});
+const PopoverTrigger = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2664c4cb"]]);
+export {
+  PopoverTrigger as default
+};

package/dist/es/popover.js

@@ -0,0 +1,4 @@
+import { _ as _sfc_main } from "./chunks/popover.js";
+export {
+  _sfc_main as default
+};