@expcat/tigercat-vue 1.0.4 → 1.1.0

package/dist/chunk-5JSU44MQ.js

@@ -1,242 +0,0 @@
-'use strict';
-
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
-
-// src/components/Tabs.ts
-var TabsContextKey = /* @__PURE__ */ Symbol("TabsContext");
-var Tabs = vue.defineComponent({
-  name: "TigerTabs",
-  props: {
-    /**
-     * Currently active tab key
-     */
-    activeKey: {
-      type: [String, Number],
-      default: void 0
-    },
-    /**
-     * Default active tab key (for uncontrolled mode)
-     */
-    defaultActiveKey: {
-      type: [String, Number],
-      default: void 0
-    },
-    /**
-     * Tab type - line, card, or editable-card
-     * @default 'line'
-     */
-    type: {
-      type: String,
-      default: "line"
-    },
-    /**
-     * Tab position - top, bottom, left, or right
-     * @default 'top'
-     */
-    tabPosition: {
-      type: String,
-      default: "top"
-    },
-    /**
-     * Tab size - small, medium, or large
-     * @default 'medium'
-     */
-    size: {
-      type: String,
-      default: "medium"
-    },
-    /**
-     * Whether tabs can be closed (only works with editable-card type)
-     * @default false
-     */
-    closable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether tabs are centered
-     * @default false
-     */
-    centered: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether to destroy inactive tab panes
-     * @default false
-     */
-    destroyInactiveTabPane: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether to lazily render tab panes (only render when first activated)
-     * @default false
-     * @since 0.6.0
-     */
-    lazy: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Additional CSS classes
-     */
-    className: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Custom styles
-     */
-    style: {
-      type: Object,
-      default: void 0
-    }
-  },
-  emits: ["update:activeKey", "change", "edit", "tab-click"],
-  setup(props, { slots, emit }) {
-    const instance = vue.getCurrentInstance();
-    const idBase = `tiger-tabs-${instance?.uid ?? "0"}`;
-    const internalActiveKey = vue.ref(props.defaultActiveKey);
-    const currentActiveKey = vue.computed(() => {
-      return props.activeKey !== void 0 ? props.activeKey : internalActiveKey.value;
-    });
-    const handleTabClick = (key) => {
-      emit("tab-click", key);
-      if (currentActiveKey.value === key) return;
-      if (props.activeKey === void 0) {
-        internalActiveKey.value = key;
-      }
-      emit("update:activeKey", key);
-      emit("change", key);
-    };
-    const handleTabClose = (key, event) => {
-      event.stopPropagation();
-      emit("edit", { targetKey: key, action: "remove" });
-    };
-    const containerClasses = vue.computed(() => {
-      return tigercatCore.classNames(tigercatCore.getTabsContainerClasses(props.tabPosition), props.className);
-    });
-    const tabNavClasses = vue.computed(() => {
-      return tigercatCore.getTabNavClasses(props.tabPosition, props.type);
-    });
-    const tabNavListClasses = vue.computed(() => {
-      return tigercatCore.getTabNavListClasses(props.tabPosition, props.centered);
-    });
-    vue.provide(TabsContextKey, {
-      get activeKey() {
-        return currentActiveKey.value;
-      },
-      get type() {
-        return props.type;
-      },
-      get size() {
-        return props.size;
-      },
-      get tabPosition() {
-        return props.tabPosition;
-      },
-      get closable() {
-        return props.closable;
-      },
-      get destroyInactiveTabPane() {
-        return props.destroyInactiveTabPane;
-      },
-      get lazy() {
-        return props.lazy;
-      },
-      idBase,
-      handleTabClick,
-      handleTabClose
-    });
-    return () => {
-      const rawChildren = slots.default?.() || [];
-      const children = [];
-      const flatten = (vnodes) => {
-        for (const vnode of vnodes) {
-          if (vnode.type === vue.Fragment && Array.isArray(vnode.children)) {
-            flatten(vnode.children);
-          } else {
-            children.push(vnode);
-          }
-        }
-      };
-      flatten(rawChildren);
-      const tabItems = [];
-      const tabPanes = [];
-      let firstTabKey;
-      const validChildren = [];
-      for (const child of children) {
-        const childType = child?.type;
-        const childName = typeof childType === "object" && childType && "name" in childType ? childType.name : void 0;
-        if (childName !== "TigerTabPane") continue;
-        const childProps = child.props ?? {};
-        const k = childProps.tabKey;
-        if (firstTabKey === void 0 && (typeof k === "string" || typeof k === "number")) {
-          firstTabKey = k;
-        }
-        const tabPaneType = typeof child.type === "string" || typeof child.type === "object" ? child.type : "div";
-        validChildren.push({ type: tabPaneType, props: childProps, children: child.children });
-      }
-      if (props.activeKey === void 0 && internalActiveKey.value === void 0 && firstTabKey !== void 0) {
-        internalActiveKey.value = firstTabKey;
-      }
-      const resolvedActiveKey = currentActiveKey.value ?? firstTabKey;
-      for (const { type, props: childProps, children: childChildren } of validChildren) {
-        const tabId = `${idBase}-tab-${String(childProps.tabKey ?? "")}`;
-        const panelId = `${idBase}-panel-${String(childProps.tabKey ?? "")}`;
-        tabItems.push(
-          vue.h(type, {
-            ...childProps,
-            renderMode: "tab",
-            tabId,
-            panelId,
-            tabIndex: childProps.tabKey === resolvedActiveKey ? 0 : -1
-          })
-        );
-        tabPanes.push(
-          vue.h(
-            type,
-            { ...childProps, renderMode: "pane", tabId, panelId },
-            childChildren
-          )
-        );
-      }
-      const tabNavContent = vue.h(
-        "div",
-        {
-          class: tabNavClasses.value,
-          role: "tablist",
-          "aria-orientation": props.tabPosition === "left" || props.tabPosition === "right" ? "vertical" : "horizontal"
-        },
-        [
-          vue.h("div", { class: tabNavListClasses.value }, [
-            ...tabItems,
-            props.type === "editable-card" ? vue.h(
-              "button",
-              {
-                type: "button",
-                class: tigercatCore.tabAddButtonClasses,
-                onClick: () => emit("edit", { targetKey: void 0, action: "add" }),
-                "aria-label": "Add tab"
-              },
-              "+"
-            ) : null
-          ])
-        ]
-      );
-      const tabContent = vue.h("div", { class: tigercatCore.tabContentBaseClasses }, tabPanes);
-      return vue.h(
-        "div",
-        { class: containerClasses.value, style: props.style },
-        props.tabPosition === "bottom" ? [tabContent, tabNavContent] : [tabNavContent, tabContent]
-      );
-    };
-  }
-});
-var Tabs_default = Tabs;
-
-exports.Tabs = Tabs;
-exports.TabsContextKey = TabsContextKey;
-exports.Tabs_default = Tabs_default;

package/dist/chunk-5WHLXWWT.mjs

@@ -1,68 +0,0 @@
-import { defineComponent, computed, h } from 'vue';
-import { getChartInnerRect, classNames, chartCanvasBaseClasses, coerceClassValue } from '@expcat/tigercat-core';
-
-// src/components/ChartCanvas.ts
-var ChartCanvas = defineComponent({
-  name: "TigerChartCanvas",
-  inheritAttrs: false,
-  props: {
-    width: {
-      type: Number,
-      default: 320
-    },
-    height: {
-      type: Number,
-      default: 200
-    },
-    padding: {
-      type: [Number, Object],
-      default: 24
-    },
-    className: {
-      type: String
-    },
-    title: {
-      type: String
-    },
-    desc: {
-      type: String
-    }
-  },
-  setup(props, { slots, attrs }) {
-    const innerRect = computed(() => getChartInnerRect(props.width, props.height, props.padding));
-    const svgClasses = computed(
-      () => classNames(chartCanvasBaseClasses, coerceClassValue(attrs.class), props.className)
-    );
-    const svgStyle = computed(() => ({
-      ...attrs.style
-    }));
-    return () => {
-      const rect = innerRect.value;
-      return h(
-        "svg",
-        {
-          ...attrs,
-          width: props.width,
-          height: props.height,
-          viewBox: `0 0 ${props.width} ${props.height}`,
-          class: svgClasses.value,
-          style: svgStyle.value
-        },
-        [
-          props.title ? h("title", props.title) : null,
-          props.desc ? h("desc", props.desc) : null,
-          h(
-            "g",
-            {
-              transform: `translate(${rect.x}, ${rect.y})`
-            },
-            slots.default?.({ innerRect: rect })
-          )
-        ].filter(Boolean)
-      );
-    };
-  }
-});
-var ChartCanvas_default = ChartCanvas;
-
-export { ChartCanvas, ChartCanvas_default };

package/dist/chunk-5Y3HYEQD.js

@@ -1,64 +0,0 @@
-'use strict';
-
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
-
-// src/components/Segmented.ts
-var Segmented = vue.defineComponent({
-  name: "TigerSegmented",
-  props: {
-    modelValue: {
-      type: [String, Number],
-      default: void 0
-    },
-    options: {
-      type: Array,
-      default: () => []
-    },
-    disabled: { type: Boolean, default: false },
-    size: { type: String, default: "md" },
-    block: { type: Boolean, default: false }
-  },
-  emits: ["update:modelValue", "change"],
-  setup(props, { emit, attrs }) {
-    function handleSelect(option) {
-      if (option.disabled || props.disabled) return;
-      if (option.value === props.modelValue) return;
-      emit("update:modelValue", option.value);
-      emit("change", option.value);
-    }
-    return () => vue.h(
-      "div",
-      {
-        class: tigercatCore.classNames(
-          tigercatCore.getSegmentedContainerClasses(props.size, props.block),
-          tigercatCore.coerceClassValue(attrs.class)
-        ),
-        role: "radiogroup"
-      },
-      props.options.map((opt) => {
-        const selected = opt.value === props.modelValue;
-        const isDisabled = !!opt.disabled || props.disabled;
-        return vue.h(
-          "label",
-          {
-            key: opt.value,
-            class: tigercatCore.classNames(
-              tigercatCore.getSegmentedOptionClasses(props.size, selected, isDisabled),
-              props.block ? "flex-1 text-center" : ""
-            ),
-            role: "radio",
-            "aria-checked": selected,
-            "aria-disabled": isDisabled,
-            onClick: () => handleSelect(opt)
-          },
-          [vue.h("span", null, opt.label)]
-        );
-      })
-    );
-  }
-});
-var Segmented_default = Segmented;
-
-exports.Segmented = Segmented;
-exports.Segmented_default = Segmented_default;

package/dist/chunk-6DP7XE77.js

@@ -1,267 +0,0 @@
-'use strict';
-
-var chunkPNKVD2UK_js = require('./chunk-PNKVD2UK.js');
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
-
-// src/components/ImagePreview.ts
-var ImagePreview_exports = {};
-chunkPNKVD2UK_js.__export(ImagePreview_exports, {
-  ImagePreview: () => exports.ImagePreview,
-  default: () => exports.ImagePreview_default
-});
-var svgIcon; exports.ImagePreview = void 0; exports.ImagePreview_default = void 0;
-var init_ImagePreview = chunkPNKVD2UK_js.__esm({
-  "src/components/ImagePreview.ts"() {
-    svgIcon = (d, cls = "w-5 h-5") => vue.h(
-      "svg",
-      {
-        class: cls,
-        xmlns: "http://www.w3.org/2000/svg",
-        fill: "none",
-        viewBox: "0 0 24 24",
-        stroke: "currentColor"
-      },
-      [
-        vue.h("path", {
-          "stroke-linecap": "round",
-          "stroke-linejoin": "round",
-          "stroke-width": "2",
-          d
-        })
-      ]
-    );
-    exports.ImagePreview = vue.defineComponent({
-      name: "TigerImagePreview",
-      inheritAttrs: false,
-      props: {
-        open: { type: Boolean, default: false },
-        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(1);
-        const offsetX = vue.ref(0);
-        const offsetY = vue.ref(0);
-        const index = vue.ref(props.currentIndex);
-        const dragging = vue.ref(false);
-        const dragStart = vue.ref({ x: 0, y: 0, ox: 0, oy: 0 });
-        const resetTransform = () => {
-          scale.value = 1;
-          offsetX.value = 0;
-          offsetY.value = 0;
-        };
-        vue.watch(
-          () => props.currentIndex,
-          (val) => {
-            index.value = val;
-            resetTransform();
-          }
-        );
-        const isOpen = vue.computed(() => props.open);
-        vue.watch(
-          () => isOpen.value,
-          (val) => {
-            if (val) {
-              resetTransform();
-              index.value = props.currentIndex;
-              document.body.style.overflow = "hidden";
-            } else {
-              document.body.style.overflow = "";
-            }
-          }
-        );
-        const navState = vue.computed(() => tigercatCore.getPreviewNavState(index.value, props.images.length));
-        const handleClose = () => {
-          emit("update:open", false);
-        };
-        const handleZoomIn = () => {
-          scale.value = tigercatCore.clampScale(scale.value + props.scaleStep, props.minScale, props.maxScale);
-          emit("scale-change", scale.value);
-        };
-        const handleZoomOut = () => {
-          scale.value = tigercatCore.clampScale(scale.value - props.scaleStep, props.minScale, props.maxScale);
-          emit("scale-change", scale.value);
-        };
-        const handleReset = () => {
-          resetTransform();
-          emit("scale-change", 1);
-        };
-        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(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 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(() => {
-          document.addEventListener("keydown", handleKeyDown);
-        });
-        vue.onBeforeUnmount(() => {
-          document.removeEventListener("keydown", handleKeyDown);
-          document.body.style.overflow = "";
-        });
-        const transform = vue.computed(() => tigercatCore.calculateTransform(scale.value, offsetX.value, offsetY.value));
-        return () => {
-          if (!isOpen.value || !props.images.length) return null;
-          const currentSrc = props.images[index.value] || props.images[0];
-          const mask = vue.h("div", {
-            class: tigercatCore.imagePreviewMaskClasses,
-            "aria-hidden": "true"
-          });
-          const img = vue.h("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
-          });
-          const closeBtn = vue.h(
-            "button",
-            {
-              class: tigercatCore.imagePreviewCloseBtnClasses,
-              onClick: handleClose,
-              "aria-label": "Close preview",
-              type: "button"
-            },
-            [svgIcon(tigercatCore.previewCloseIconPath)]
-          );
-          const toolbar = vue.h("div", { class: tigercatCore.imagePreviewToolbarClasses }, [
-            vue.h(
-              "button",
-              {
-                class: tigercatCore.imagePreviewToolbarBtnClasses,
-                onClick: handleZoomOut,
-                "aria-label": "Zoom out",
-                type: "button"
-              },
-              [svgIcon(tigercatCore.zoomOutIconPath)]
-            ),
-            vue.h(
-              "button",
-              {
-                class: tigercatCore.imagePreviewToolbarBtnClasses,
-                onClick: handleReset,
-                "aria-label": "Reset",
-                type: "button"
-              },
-              [svgIcon(tigercatCore.resetIconPath)]
-            ),
-            vue.h(
-              "button",
-              {
-                class: tigercatCore.imagePreviewToolbarBtnClasses,
-                onClick: handleZoomIn,
-                "aria-label": "Zoom in",
-                type: "button"
-              },
-              [svgIcon(tigercatCore.zoomInIconPath)]
-            ),
-            navState.value.counter ? vue.h("span", { class: tigercatCore.imagePreviewCounterClasses }, navState.value.counter) : null
-          ]);
-          const prevBtn = props.images.length > 1 ? vue.h(
-            "button",
-            {
-              class: tigercatCore.classNames(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(
-            "button",
-            {
-              class: tigercatCore.classNames(tigercatCore.imagePreviewNavBtnClasses, "right-4"),
-              onClick: handleNext,
-              disabled: !navState.value.hasNext,
-              "aria-label": "Next image",
-              type: "button"
-            },
-            [svgIcon(tigercatCore.nextIconPath)]
-          ) : null;
-          const wrapper = vue.h(
-            "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(vue.Teleport, { to: "body" }, [wrapper]);
-        };
-      }
-    });
-    exports.ImagePreview_default = exports.ImagePreview;
-  }
-});
-
-exports.ImagePreview_exports = ImagePreview_exports;
-exports.init_ImagePreview = init_ImagePreview;