@expcat/tigercat-vue 1.4.0 → 2.0.0-preview.1

package/dist/chunk-X5CFXNVK.js

@@ -1,246 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/MarkdownEditor.ts
-var _vue = require('vue');
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-var _tigercatcore = require('@expcat/tigercat-core');
-var modes = ["edit", "split", "preview"];
-var MarkdownEditor = _vue.defineComponent.call(void 0, {
-  name: "TigerMarkdownEditor",
-  props: {
-    value: { type: String, default: void 0 },
-    defaultValue: { type: String, default: "" },
-    placeholder: { type: String, default: void 0 },
-    mode: {
-      type: String,
-      default: void 0
-    },
-    defaultMode: {
-      type: String,
-      default: "split"
-    },
-    toolbar: {
-      type: [Array, Boolean],
-      default: void 0
-    },
-    showModeSwitch: { type: Boolean, default: true },
-    height: {
-      type: [Number, String],
-      default: 360
-    },
-    readOnly: { type: Boolean, default: false },
-    disabled: { type: Boolean, default: false },
-    renderer: {
-      type: Object,
-      default: void 0
-    },
-    className: { type: String, default: void 0 },
-    style: {
-      type: Object,
-      default: void 0
-    }
-  },
-  emits: ["update:value", "change", "update:mode", "mode-change"],
-  setup(props, { emit, attrs }) {
-    const internalValue = _vue.ref.call(void 0, props.defaultValue || "");
-    const internalMode = _vue.ref.call(void 0, props.defaultMode);
-    const textareaRef = _vue.ref.call(void 0, null);
-    const currentValue = _vue.computed.call(void 0, 
-      () => props.value !== void 0 ? props.value : internalValue.value
-    );
-    const currentMode = _vue.computed.call(void 0, () => _nullishCoalesce(props.mode, () => ( internalMode.value)));
-    const toolbarItems = _vue.computed.call(void 0, 
-      () => props.toolbar === false ? [] : _nullishCoalesce(props.toolbar, () => ( _tigercatcore.defaultMarkdownToolbar))
-    );
-    const previewHtml = _vue.computed.call(void 0, () => _tigercatcore.renderMarkdownToHtml.call(void 0, currentValue.value, props.renderer));
-    const showFormattingToolbar = _vue.computed.call(void 0, () => props.toolbar !== false);
-    const showTopbar = _vue.computed.call(void 0, () => showFormattingToolbar.value || props.showModeSwitch);
-    const showEditor = _vue.computed.call(void 0, () => currentMode.value === "edit" || currentMode.value === "split");
-    const showPreview = _vue.computed.call(void 0, 
-      () => currentMode.value === "preview" || currentMode.value === "split"
-    );
-    const containerClasses = _vue.computed.call(void 0, 
-      () => _tigercatcore.classNames.call(void 0, 
-        _tigercatcore.getMarkdownContainerClasses.call(void 0, props.disabled, props.className),
-        _tigercatcore.coerceClassValue.call(void 0, attrs.class)
-      )
-    );
-    const containerStyle = _vue.computed.call(void 0, () => {
-      const parsedHeight = _tigercatcore.parseMarkdownHeight.call(void 0, props.height);
-      return {
-        ...parsedHeight ? { height: parsedHeight } : {},
-        ...props.style
-      };
-    });
-    function commitValue(nextValue) {
-      if (props.value === void 0) internalValue.value = nextValue;
-      emit("update:value", nextValue);
-      emit("change", nextValue);
-    }
-    function commitMode(nextMode) {
-      if (props.mode === void 0) internalMode.value = nextMode;
-      emit("update:mode", nextMode);
-      emit("mode-change", nextMode);
-    }
-    async function restoreSelection(selectionStart, selectionEnd) {
-      await _vue.nextTick.call(void 0, );
-      const textarea = textareaRef.value;
-      if (!textarea) return;
-      textarea.selectionStart = selectionStart;
-      textarea.selectionEnd = selectionEnd;
-      textarea.focus();
-    }
-    function applyToolbarButton(button) {
-      if (props.readOnly || props.disabled) return;
-      const textarea = textareaRef.value;
-      const selection = {
-        value: currentValue.value,
-        selectionStart: _nullishCoalesce(_optionalChain([textarea, 'optionalAccess', _ => _.selectionStart]), () => ( currentValue.value.length)),
-        selectionEnd: _nullishCoalesce(_optionalChain([textarea, 'optionalAccess', _2 => _2.selectionEnd]), () => ( currentValue.value.length))
-      };
-      const result = _tigercatcore.applyMarkdownToolbarAction.call(void 0, button, selection);
-      commitValue(result.value);
-      void restoreSelection(result.selectionStart, result.selectionEnd);
-    }
-    function handleKeydown(event) {
-      if (event.key === "Tab") {
-        event.preventDefault();
-        const textarea = event.currentTarget;
-        const before = textarea.value.slice(0, textarea.selectionStart);
-        const after = textarea.value.slice(textarea.selectionEnd);
-        const result = {
-          value: `${before}  ${after}`,
-          selectionStart: textarea.selectionStart + 2,
-          selectionEnd: textarea.selectionStart + 2
-        };
-        commitValue(result.value);
-        void restoreSelection(result.selectionStart, result.selectionEnd);
-        return;
-      }
-      const match = _tigercatcore.findMarkdownHotkeyMatch.call(void 0, toolbarItems.value, event);
-      if (match) {
-        event.preventDefault();
-        applyToolbarButton(match);
-      }
-    }
-    return () => {
-      const toolbarNode = showTopbar.value ? _vue.h.call(void 0, "div", { class: _tigercatcore.markdownEditorToolbarClasses }, [
-        showFormattingToolbar.value ? _vue.h.call(void 0, 
-          "div",
-          {
-            class: _tigercatcore.markdownEditorToolbarGroupClasses,
-            role: "toolbar",
-            "aria-label": "Markdown formatting"
-          },
-          toolbarItems.value.map((item, index) => {
-            if (_tigercatcore.isMarkdownToolbarSeparator.call(void 0, item)) {
-              return _vue.h.call(void 0, "div", {
-                key: `separator-${index}`,
-                class: _tigercatcore.markdownEditorToolbarSeparatorClasses,
-                role: "separator",
-                "aria-orientation": "vertical"
-              });
-            }
-            return _vue.h.call(void 0, 
-              "button",
-              {
-                key: item.name,
-                type: "button",
-                class: _tigercatcore.getMarkdownToolbarButtonClasses.call(void 0, false),
-                title: _nullishCoalesce(item.tooltip, () => ( item.label)),
-                "aria-label": _nullishCoalesce(item.tooltip, () => ( item.label)),
-                disabled: props.disabled || props.readOnly,
-                onClick: () => applyToolbarButton(item)
-              },
-              item.icon ? _vue.h.call(void 0, "span", { innerHTML: item.icon }) : item.label
-            );
-          })
-        ) : _vue.h.call(void 0, "span"),
-        props.showModeSwitch ? _vue.h.call(void 0, 
-          "div",
-          {
-            class: _tigercatcore.markdownEditorToolbarGroupClasses,
-            role: "toolbar",
-            "aria-label": "Markdown view mode"
-          },
-          modes.map(
-            (item) => _vue.h.call(void 0, 
-              "button",
-              {
-                key: item,
-                type: "button",
-                class: _tigercatcore.getMarkdownToolbarButtonClasses.call(void 0, currentMode.value === item),
-                "aria-label": _tigercatcore.markdownModeLabels[item],
-                "aria-pressed": currentMode.value === item,
-                disabled: props.disabled,
-                onClick: () => commitMode(item)
-              },
-              _tigercatcore.markdownModeLabels[item]
-            )
-          )
-        ) : null
-      ]) : null;
-      const textareaNode = showEditor.value ? _vue.h.call(void 0, "textarea", {
-        ref: textareaRef,
-        class: _tigercatcore.markdownEditorTextareaClasses,
-        value: currentValue.value,
-        onInput: (event) => commitValue(event.target.value),
-        onKeydown: handleKeydown,
-        placeholder: props.placeholder,
-        readonly: props.readOnly || props.disabled,
-        disabled: props.disabled,
-        spellcheck: true,
-        "aria-label": "Markdown editor",
-        "aria-multiline": true
-      }) : null;
-      const previewNode = showPreview.value ? _vue.h.call(void 0, "div", {
-        class: _tigercatcore.classNames.call(void 0, 
-          _tigercatcore.markdownEditorPreviewClasses,
-          currentMode.value === "split" ? _tigercatcore.markdownEditorSplitDividerClasses : void 0,
-          !currentValue.value ? _tigercatcore.markdownEditorEmptyPreviewClasses : void 0
-        ),
-        role: "region",
-        "aria-label": "Markdown preview",
-        innerHTML: currentValue.value ? previewHtml.value : props.placeholder || ""
-      }) : null;
-      return _vue.h.call(void 0, 
-        "div",
-        {
-          class: containerClasses.value,
-          style: containerStyle.value,
-          "data-mode": currentMode.value
-        },
-        [
-          toolbarNode,
-          _vue.h.call(void 0, "div", { class: _tigercatcore.getMarkdownBodyClasses.call(void 0, currentMode.value) }, [
-            textareaNode,
-            previewNode
-          ])
-        ]
-      );
-    };
-  }
-});
-var MarkdownEditor_default = MarkdownEditor;
-
-
-
-
-exports.MarkdownEditor = MarkdownEditor; exports.MarkdownEditor_default = MarkdownEditor_default;

package/dist/chunk-X6FG4RPF.js

@@ -1,367 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }// src/components/ImagePreview.ts
-
-
-
-
-
-
-
-
-
-var _vue = require('vue');
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-var _tigercatcore = require('@expcat/tigercat-core');
-var svgIcon = (d, cls = "w-5 h-5") => _vue.h.call(void 0, 
-  "svg",
-  {
-    class: cls,
-    xmlns: "http://www.w3.org/2000/svg",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    stroke: "currentColor"
-  },
-  [
-    _vue.h.call(void 0, "path", {
-      "stroke-linecap": "round",
-      "stroke-linejoin": "round",
-      "stroke-width": "2",
-      d
-    })
-  ]
-);
-var ImagePreview = _vue.defineComponent.call(void 0, {
-  name: "TigerImagePreview",
-  inheritAttrs: false,
-  props: {
-    open: { type: Boolean, default: void 0 },
-    images: { type: Array, default: () => [] },
-    currentIndex: { type: Number, default: 0 },
-    zIndex: { type: Number, default: 1050 },
-    maskClosable: { type: Boolean, default: true },
-    scaleStep: { type: Number, default: 0.5 },
-    minScale: { type: Number, default: 0.25 },
-    maxScale: { type: Number, default: 5 }
-  },
-  emits: ["update:open", "update:currentIndex", "scale-change"],
-  setup(props, { emit }) {
-    const scale = _vue.ref.call(void 0, 1);
-    const rotation = _vue.ref.call(void 0, 0);
-    const offsetX = _vue.ref.call(void 0, 0);
-    const offsetY = _vue.ref.call(void 0, 0);
-    const index = _vue.ref.call(void 0, props.currentIndex);
-    const dragging = _vue.ref.call(void 0, false);
-    const dragStart = _vue.ref.call(void 0, { x: 0, y: 0, ox: 0, oy: 0 });
-    let panState = _tigercatcore.createPanState.call(void 0, );
-    let pinchState = _tigercatcore.createPinchState.call(void 0, );
-    const resetTransform = () => {
-      scale.value = 1;
-      rotation.value = 0;
-      offsetX.value = 0;
-      offsetY.value = 0;
-      panState = _tigercatcore.createPanState.call(void 0, );
-      pinchState = _tigercatcore.createPinchState.call(void 0, );
-    };
-    _vue.watch.call(void 0, 
-      () => props.currentIndex,
-      (val) => {
-        index.value = val;
-        resetTransform();
-      }
-    );
-    const isOpen = _vue.computed.call(void 0, () => _nullishCoalesce(props.open, () => ( false)));
-    _vue.watch.call(void 0, 
-      () => isOpen.value,
-      (val) => {
-        if (val) {
-          resetTransform();
-          index.value = props.currentIndex;
-          document.body.style.overflow = "hidden";
-        } else {
-          document.body.style.overflow = "";
-        }
-      }
-    );
-    const navState = _vue.computed.call(void 0, () => _tigercatcore.getPreviewNavState.call(void 0, index.value, props.images.length));
-    const handleClose = () => {
-      emit("update:open", false);
-    };
-    const handleZoomIn = () => {
-      scale.value = _tigercatcore.clampScale.call(void 0, scale.value + props.scaleStep, props.minScale, props.maxScale);
-      emit("scale-change", scale.value);
-    };
-    const handleZoomOut = () => {
-      scale.value = _tigercatcore.clampScale.call(void 0, scale.value - props.scaleStep, props.minScale, props.maxScale);
-      emit("scale-change", scale.value);
-    };
-    const handleReset = () => {
-      resetTransform();
-      emit("scale-change", 1);
-    };
-    const handleRotateLeft = () => {
-      rotation.value = _tigercatcore.normalizeRotation.call(void 0, rotation.value - 90);
-    };
-    const handleRotateRight = () => {
-      rotation.value = _tigercatcore.normalizeRotation.call(void 0, rotation.value + 90);
-    };
-    const handlePrev = () => {
-      if (navState.value.hasPrev) {
-        index.value--;
-        resetTransform();
-        emit("update:currentIndex", index.value);
-      }
-    };
-    const handleNext = () => {
-      if (navState.value.hasNext) {
-        index.value++;
-        resetTransform();
-        emit("update:currentIndex", index.value);
-      }
-    };
-    const handleWheel = (e) => {
-      e.preventDefault();
-      const delta = e.deltaY > 0 ? -props.scaleStep : props.scaleStep;
-      scale.value = _tigercatcore.clampScale.call(void 0, scale.value + delta, props.minScale, props.maxScale);
-      emit("scale-change", scale.value);
-    };
-    const handleMouseDown = (e) => {
-      if (e.button !== 0) return;
-      e.preventDefault();
-      dragging.value = true;
-      dragStart.value = {
-        x: e.clientX,
-        y: e.clientY,
-        ox: offsetX.value,
-        oy: offsetY.value
-      };
-    };
-    const handleMouseMove = (e) => {
-      if (!dragging.value) return;
-      offsetX.value = dragStart.value.ox + (e.clientX - dragStart.value.x);
-      offsetY.value = dragStart.value.oy + (e.clientY - dragStart.value.y);
-    };
-    const handleMouseUp = () => {
-      dragging.value = false;
-    };
-    const handleTouchStart = (e) => {
-      if (e.touches.length === 2) {
-        e.preventDefault();
-        pinchState = _tigercatcore.startPinch.call(void 0, e.touches[0], e.touches[1], scale.value);
-        return;
-      }
-      if (e.touches.length === 1) {
-        panState = _tigercatcore.startPan.call(void 0, 
-          e.touches[0].clientX,
-          e.touches[0].clientY,
-          offsetX.value,
-          offsetY.value
-        );
-      }
-    };
-    const handleTouchMove = (e) => {
-      if (e.touches.length === 2 && pinchState.isPinching) {
-        e.preventDefault();
-        scale.value = _tigercatcore.movePinch.call(void 0, 
-          pinchState,
-          e.touches[0],
-          e.touches[1],
-          props.minScale,
-          props.maxScale
-        );
-        emit("scale-change", scale.value);
-        return;
-      }
-      if (e.touches.length === 1 && panState.isPanning) {
-        const next = _tigercatcore.movePan.call(void 0, panState, e.touches[0].clientX, e.touches[0].clientY);
-        offsetX.value = next.translateX;
-        offsetY.value = next.translateY;
-      }
-    };
-    const handleTouchEnd = () => {
-      panState = _tigercatcore.createPanState.call(void 0, );
-      pinchState = _tigercatcore.createPinchState.call(void 0, );
-    };
-    const handleMaskClick = (e) => {
-      if (props.maskClosable && e.target === e.currentTarget) {
-        handleClose();
-      }
-    };
-    const handleKeyDown = (e) => {
-      if (!isOpen.value) return;
-      switch (e.key) {
-        case "Escape":
-          handleClose();
-          break;
-        case "ArrowLeft":
-          handlePrev();
-          break;
-        case "ArrowRight":
-          handleNext();
-          break;
-      }
-    };
-    _vue.onMounted.call(void 0, () => {
-      document.addEventListener("keydown", handleKeyDown);
-    });
-    _vue.onBeforeUnmount.call(void 0, () => {
-      document.removeEventListener("keydown", handleKeyDown);
-      document.body.style.overflow = "";
-    });
-    const transform = _vue.computed.call(void 0, 
-      () => `${_tigercatcore.calculateTransform.call(void 0, scale.value, offsetX.value, offsetY.value)} rotate(${rotation.value}deg)`
-    );
-    return () => {
-      if (!isOpen.value || !props.images.length) return null;
-      const currentSrc = props.images[index.value] || props.images[0];
-      const mask = _vue.h.call(void 0, "div", {
-        class: _tigercatcore.imagePreviewMaskClasses,
-        "aria-hidden": "true"
-      });
-      const img = _vue.h.call(void 0, "img", {
-        src: currentSrc,
-        class: _tigercatcore.imagePreviewImgClasses,
-        style: { transform: transform.value },
-        alt: `Preview image ${index.value + 1}`,
-        draggable: false,
-        onMousedown: handleMouseDown,
-        onMousemove: handleMouseMove,
-        onMouseup: handleMouseUp,
-        onMouseleave: handleMouseUp,
-        onTouchstart: handleTouchStart,
-        onTouchmove: handleTouchMove,
-        onTouchend: handleTouchEnd,
-        onTouchcancel: handleTouchEnd
-      });
-      const closeBtn = _vue.h.call(void 0, 
-        "button",
-        {
-          class: _tigercatcore.imagePreviewCloseBtnClasses,
-          onClick: handleClose,
-          "aria-label": "Close preview",
-          type: "button"
-        },
-        [svgIcon(_tigercatcore.previewCloseIconPath)]
-      );
-      const toolbar = _vue.h.call(void 0, "div", { class: _tigercatcore.imagePreviewToolbarClasses }, [
-        _vue.h.call(void 0, 
-          "button",
-          {
-            class: _tigercatcore.imagePreviewToolbarBtnClasses,
-            onClick: handleZoomOut,
-            "aria-label": "Zoom out",
-            type: "button"
-          },
-          [svgIcon(_tigercatcore.zoomOutIconPath)]
-        ),
-        _vue.h.call(void 0, 
-          "button",
-          {
-            class: _tigercatcore.imagePreviewToolbarBtnClasses,
-            onClick: handleReset,
-            "aria-label": "Reset",
-            type: "button"
-          },
-          [svgIcon(_tigercatcore.resetIconPath)]
-        ),
-        _vue.h.call(void 0, 
-          "button",
-          {
-            class: _tigercatcore.imagePreviewToolbarBtnClasses,
-            onClick: handleZoomIn,
-            "aria-label": "Zoom in",
-            type: "button"
-          },
-          [svgIcon(_tigercatcore.zoomInIconPath)]
-        ),
-        _vue.h.call(void 0, 
-          "button",
-          {
-            class: _tigercatcore.imagePreviewToolbarBtnClasses,
-            onClick: handleRotateLeft,
-            "aria-label": "Rotate left",
-            type: "button"
-          },
-          [svgIcon(_tigercatcore.imageViewerIcons.rotateLeft)]
-        ),
-        _vue.h.call(void 0, 
-          "button",
-          {
-            class: _tigercatcore.imagePreviewToolbarBtnClasses,
-            onClick: handleRotateRight,
-            "aria-label": "Rotate right",
-            type: "button"
-          },
-          [svgIcon(_tigercatcore.imageViewerIcons.rotateRight)]
-        ),
-        navState.value.counter ? _vue.h.call(void 0, "span", { class: _tigercatcore.imagePreviewCounterClasses }, navState.value.counter) : null
-      ]);
-      const prevBtn = props.images.length > 1 ? _vue.h.call(void 0, 
-        "button",
-        {
-          class: _tigercatcore.classNames.call(void 0, _tigercatcore.imagePreviewNavBtnClasses, "left-4"),
-          onClick: handlePrev,
-          disabled: !navState.value.hasPrev,
-          "aria-label": "Previous image",
-          type: "button"
-        },
-        [svgIcon(_tigercatcore.prevIconPath)]
-      ) : null;
-      const nextBtn = props.images.length > 1 ? _vue.h.call(void 0, 
-        "button",
-        {
-          class: _tigercatcore.classNames.call(void 0, _tigercatcore.imagePreviewNavBtnClasses, "right-4"),
-          onClick: handleNext,
-          disabled: !navState.value.hasNext,
-          "aria-label": "Next image",
-          type: "button"
-        },
-        [svgIcon(_tigercatcore.nextIconPath)]
-      ) : null;
-      const wrapper = _vue.h.call(void 0, 
-        "div",
-        {
-          class: _tigercatcore.imagePreviewWrapperClasses,
-          style: { zIndex: props.zIndex },
-          role: "dialog",
-          "aria-modal": "true",
-          "aria-label": "Image preview",
-          onClick: handleMaskClick,
-          onWheel: handleWheel
-        },
-        [mask, img, closeBtn, prevBtn, nextBtn, toolbar]
-      );
-      return _vue.h.call(void 0, _vue.Teleport, { to: "body" }, [wrapper]);
-    };
-  }
-});
-var ImagePreview_default = ImagePreview;
-
-
-
-
-exports.ImagePreview = ImagePreview; exports.ImagePreview_default = ImagePreview_default;