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

package/dist/chunk-YVSINGGE.js

@@ -1,320 +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; }
-
-var _chunk2VOZFFW6js = require('./chunk-2VOZFFW6.js');
-
-
-var _chunkAYQER5UDjs = require('./chunk-AYQER5UD.js');
-
-
-var _chunkUHVUKLHFjs = require('./chunk-UHVUKLHF.js');
-
-// src/components/HeatmapChart.ts
-var _vue = require('vue');
-
-
-
-
-
-
-
-
-
-var _tigercatcore = require('@expcat/tigercat-core');
-var HeatmapChart = _vue.defineComponent.call(void 0, {
-  name: "TigerHeatmapChart",
-  props: {
-    width: { type: Number, default: 400 },
-    height: { type: Number, default: 300 },
-    padding: { type: [Number, Object], default: 40 },
-    data: { type: Array, required: true },
-    xLabels: { type: Array, required: true },
-    yLabels: { type: Array, required: true },
-    minColor: { type: String, default: "#f0f9ff" },
-    maxColor: { type: String, default: "#2563eb" },
-    colorSpace: { type: String, default: "rgb" },
-    cellRadius: { type: Number, default: 2 },
-    cellGap: { type: Number, default: 1 },
-    showValues: { type: Boolean, default: false },
-    renderMode: { type: String, default: "auto" },
-    canvasThreshold: { type: Number },
-    valueFormatter: { type: Function },
-    // Interaction
-    hoverable: { type: Boolean, default: false },
-    hoveredIndex: { type: Number, default: void 0 },
-    activeOpacity: { type: Number, default: 1 },
-    inactiveOpacity: { type: Number, default: 0.25 },
-    selectable: { type: Boolean, default: false },
-    selectedIndex: { type: Number, default: void 0 },
-    // Tooltip
-    showTooltip: { type: Boolean, default: true },
-    tooltipFormatter: {
-      type: Function
-    },
-    // a11y
-    title: { type: String },
-    desc: { type: String },
-    className: { type: String }
-  },
-  emits: ["update:hoveredIndex", "update:selectedIndex", "cell-click", "cell-hover"],
-  setup(props, { emit }) {
-    const canvasRef = _vue.ref.call(void 0, null);
-    const {
-      tooltipPosition,
-      resolvedHoveredIndex,
-      activeIndex,
-      handleMouseEnter,
-      handleMouseMove,
-      handleMouseLeave,
-      handleClick,
-      wrapperClasses: _wrapperClasses
-    } = _chunk2VOZFFW6js.useChartInteraction.call(void 0, {
-      hoverable: _vue.computed.call(void 0, () => props.hoverable),
-      hoveredIndexProp: () => props.hoveredIndex,
-      selectable: _vue.computed.call(void 0, () => props.selectable),
-      selectedIndexProp: () => props.selectedIndex,
-      activeOpacity: _vue.computed.call(void 0, () => props.activeOpacity),
-      inactiveOpacity: _vue.computed.call(void 0, () => props.inactiveOpacity),
-      emit,
-      getData: (index) => props.data[index],
-      eventNames: { hover: "cell-hover", click: "cell-click" }
-    });
-    const innerRect = _vue.computed.call(void 0, () => _tigercatcore.getChartInnerRect.call(void 0, props.width, props.height, props.padding));
-    const cells = _vue.computed.call(void 0, 
-      () => _tigercatcore.computeHeatmapCells.call(void 0, props.data, {
-        xLabels: props.xLabels,
-        yLabels: props.yLabels,
-        width: innerRect.value.width,
-        height: innerRect.value.height,
-        cellGap: props.cellGap,
-        minColor: props.minColor,
-        maxColor: props.maxColor,
-        colorSpace: props.colorSpace
-      })
-    );
-    const tooltipContent = _vue.computed.call(void 0, 
-      () => _tigercatcore.resolveChartTooltipContent.call(void 0, resolvedHoveredIndex.value, cells.value, void 0, (cell) => {
-        const val = props.valueFormatter ? props.valueFormatter(cell.value) : `${cell.value}`;
-        return `${cell.xLabel} \xD7 ${cell.yLabel}: ${val}`;
-      })
-    );
-    const resolvedRenderMode = _vue.computed.call(void 0, 
-      () => _tigercatcore.resolveHeatmapRenderMode.call(void 0, cells.value.length, {
-        renderMode: props.renderMode,
-        canvasThreshold: props.canvasThreshold
-      })
-    );
-    const shouldRenderCanvas = _vue.computed.call(void 0, () => resolvedRenderMode.value === "canvas");
-    _vue.watchEffect.call(void 0, () => {
-      if (!shouldRenderCanvas.value) return;
-      const rect = innerRect.value;
-      const cellList = cells.value;
-      const currentActiveIndex = activeIndex.value;
-      const currentActiveOpacity = props.activeOpacity;
-      const currentInactiveOpacity = props.inactiveOpacity;
-      const currentCellRadius = props.cellRadius;
-      const currentShowValues = props.showValues;
-      const formatter = props.valueFormatter;
-      _vue.nextTick.call(void 0, () => {
-        const canvas = canvasRef.value;
-        const context = _optionalChain([canvas, 'optionalAccess', _ => _.getContext, 'call', _2 => _2("2d")]);
-        if (!canvas || !context) return;
-        context.clearRect(0, 0, rect.width, rect.height);
-        context.textAlign = "center";
-        context.textBaseline = "middle";
-        context.font = "10px sans-serif";
-        cellList.forEach((cell, idx) => {
-          context.globalAlpha = _nullishCoalesce(_tigercatcore.getChartElementOpacity.call(void 0, idx, currentActiveIndex, {
-            activeOpacity: currentActiveOpacity,
-            inactiveOpacity: currentInactiveOpacity
-          }), () => ( 1));
-          context.fillStyle = cell.fill;
-          const radius = Math.max(0, Math.min(currentCellRadius, cell.w / 2, cell.h / 2));
-          if (radius > 0) {
-            context.beginPath();
-            context.moveTo(cell.x + radius, cell.y);
-            context.lineTo(cell.x + cell.w - radius, cell.y);
-            context.quadraticCurveTo(cell.x + cell.w, cell.y, cell.x + cell.w, cell.y + radius);
-            context.lineTo(cell.x + cell.w, cell.y + cell.h - radius);
-            context.quadraticCurveTo(
-              cell.x + cell.w,
-              cell.y + cell.h,
-              cell.x + cell.w - radius,
-              cell.y + cell.h
-            );
-            context.lineTo(cell.x + radius, cell.y + cell.h);
-            context.quadraticCurveTo(cell.x, cell.y + cell.h, cell.x, cell.y + cell.h - radius);
-            context.lineTo(cell.x, cell.y + radius);
-            context.quadraticCurveTo(cell.x, cell.y, cell.x + radius, cell.y);
-            context.closePath();
-            context.fill();
-          } else {
-            context.fillRect(cell.x, cell.y, cell.w, cell.h);
-          }
-          if (currentShowValues) {
-            context.globalAlpha = 1;
-            context.fillStyle = "var(--tiger-text,#374151)";
-            context.fillText(
-              formatter ? formatter(cell.value) : `${cell.value}`,
-              cell.x + cell.w / 2,
-              cell.y + cell.h / 2
-            );
-          }
-        });
-        context.globalAlpha = 1;
-      });
-    });
-    const getCanvasPoint = (event) => {
-      const canvas = event.currentTarget;
-      const bounds = canvas.getBoundingClientRect();
-      const scaleX = bounds.width > 0 ? canvas.width / bounds.width : 1;
-      const scaleY = bounds.height > 0 ? canvas.height / bounds.height : 1;
-      return {
-        x: event.offsetX * scaleX,
-        y: event.offsetY * scaleY
-      };
-    };
-    const handleCanvasMouseMove = (event) => {
-      const point = getCanvasPoint(event);
-      const index = _tigercatcore.getHeatmapCellIndexAtPoint.call(void 0, cells.value, point.x, point.y);
-      if (index === null) {
-        handleMouseLeave();
-        return;
-      }
-      handleMouseEnter(index, event);
-      handleMouseMove(event);
-    };
-    const handleCanvasClick = (event) => {
-      const point = getCanvasPoint(event);
-      const index = _tigercatcore.getHeatmapCellIndexAtPoint.call(void 0, cells.value, point.x, point.y);
-      if (index !== null) {
-        handleClick(index);
-      }
-    };
-    return () => {
-      const interactive = props.hoverable || props.selectable;
-      const rect = innerRect.value;
-      const chart = _vue.h.call(void 0, 
-        _chunkUHVUKLHFjs.ChartCanvas,
-        {
-          width: props.width,
-          height: props.height,
-          padding: props.padding,
-          title: props.title,
-          desc: props.desc,
-          className: _tigercatcore.classNames.call(void 0, props.className)
-        },
-        {
-          default: () => {
-            const xAxisLabels = props.xLabels.map((label, i) => {
-              const cellW = (rect.width - props.cellGap * (props.xLabels.length - 1)) / props.xLabels.length;
-              return _vue.h.call(void 0, 
-                "text",
-                {
-                  key: `x-${i}`,
-                  x: i * (cellW + props.cellGap) + cellW / 2,
-                  y: rect.height + 16,
-                  class: _tigercatcore.chartAxisTickTextClasses,
-                  "text-anchor": "middle"
-                },
-                label
-              );
-            });
-            const yAxisLabels = props.yLabels.map((label, i) => {
-              const cellH = (rect.height - props.cellGap * (props.yLabels.length - 1)) / props.yLabels.length;
-              return _vue.h.call(void 0, 
-                "text",
-                {
-                  key: `y-${i}`,
-                  x: -8,
-                  y: i * (cellH + props.cellGap) + cellH / 2,
-                  class: _tigercatcore.chartAxisTickTextClasses,
-                  "text-anchor": "end",
-                  "dominant-baseline": "middle"
-                },
-                label
-              );
-            });
-            const cellElems = shouldRenderCanvas.value ? [] : cells.value.map((cell, idx) => {
-              const opacity = _tigercatcore.getChartElementOpacity.call(void 0, idx, activeIndex.value, {
-                activeOpacity: props.activeOpacity,
-                inactiveOpacity: props.inactiveOpacity
-              });
-              const elems = [
-                _vue.h.call(void 0, "rect", {
-                  key: `cell-${idx}`,
-                  x: cell.x,
-                  y: cell.y,
-                  width: cell.w,
-                  height: cell.h,
-                  rx: props.cellRadius,
-                  fill: cell.fill,
-                  opacity,
-                  class: _tigercatcore.classNames.call(void 0, interactive && "cursor-pointer"),
-                  style: {
-                    transition: "opacity var(--tiger-motion-duration-base,0.2s) var(--tiger-motion-ease-decelerate,ease-out)",
-                    rx: `var(--tiger-chart-block-radius, ${props.cellRadius}px)`
-                  },
-                  onMouseenter: (e) => handleMouseEnter(idx, e),
-                  onMousemove: handleMouseMove,
-                  onMouseleave: handleMouseLeave,
-                  onClick: () => handleClick(idx)
-                })
-              ];
-              if (props.showValues) {
-                const val = props.valueFormatter ? props.valueFormatter(cell.value) : `${cell.value}`;
-                elems.push(
-                  _vue.h.call(void 0, 
-                    "text",
-                    {
-                      key: `val-${idx}`,
-                      x: cell.x + cell.w / 2,
-                      y: cell.y + cell.h / 2,
-                      class: "fill-[color:var(--tiger-text,#374151)] text-[10px]",
-                      "text-anchor": "middle",
-                      "dominant-baseline": "middle"
-                    },
-                    val
-                  )
-                );
-              }
-              return elems;
-            }).flat();
-            return [...xAxisLabels, ...yAxisLabels, ...cellElems];
-          }
-        }
-      );
-      const tooltip = props.showTooltip && props.hoverable ? _vue.h.call(void 0, _chunkAYQER5UDjs.ChartTooltip, {
-        content: tooltipContent.value,
-        visible: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
-        x: tooltipPosition.value.x,
-        y: tooltipPosition.value.y
-      }) : null;
-      const canvas = shouldRenderCanvas.value ? _vue.h.call(void 0, "canvas", {
-        ref: canvasRef,
-        width: rect.width,
-        height: rect.height,
-        class: _tigercatcore.classNames.call(void 0, interactive && "cursor-pointer"),
-        style: {
-          position: "absolute",
-          left: `${rect.x}px`,
-          top: `${rect.y}px`,
-          width: `${rect.width}px`,
-          height: `${rect.height}px`,
-          pointerEvents: interactive ? "auto" : "none"
-        },
-        "data-heatmap-canvas": "true",
-        "data-heatmap-render-mode": resolvedRenderMode.value,
-        onMousemove: interactive ? handleCanvasMouseMove : void 0,
-        onMouseleave: interactive ? handleMouseLeave : void 0,
-        onClick: interactive ? handleCanvasClick : void 0
-      }) : null;
-      return _vue.h.call(void 0, "div", { class: "inline-block relative" }, [chart, canvas, tooltip]);
-    };
-  }
-});
-var HeatmapChart_default = HeatmapChart;
-
-
-
-
-exports.HeatmapChart = HeatmapChart; exports.HeatmapChart_default = HeatmapChart_default;

package/dist/chunk-ZHSXICH7.js

@@ -1,264 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
-
-var _chunkJCMGBKS6js = require('./chunk-JCMGBKS6.js');
-
-// src/components/Alert.ts
-var _vue = require('vue');
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-var _tigercatcore = require('@expcat/tigercat-core');
-var Alert = _vue.defineComponent.call(void 0, {
-  name: "TigerAlert",
-  inheritAttrs: false,
-  props: {
-    /**
-     * Alert type (determines icon and color scheme)
-     * @default 'info'
-     */
-    type: {
-      type: String,
-      default: "info"
-    },
-    /**
-     * Alert size
-     * @default 'md'
-     */
-    size: {
-      type: String,
-      default: "md"
-    },
-    /**
-     * Alert title (main message)
-     */
-    title: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Alert description (detailed content)
-     */
-    description: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Whether to show the type icon
-     * @default true
-     */
-    showIcon: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Whether the alert can be closed
-     * @default false
-     */
-    closable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Accessible label for the close button (when `closable` is true)
-     * @default 'Close alert'
-     */
-    closeAriaLabel: {
-      type: String,
-      default: "Close alert"
-    },
-    /**
-     * Auto-close duration in milliseconds. 0 or undefined to disable.
-     */
-    duration: {
-      type: Number,
-      default: void 0
-    },
-    /**
-     * Additional CSS classes
-     */
-    className: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Custom styles
-     */
-    style: {
-      type: Object,
-      default: void 0
-    },
-    /**
-     * Whether to display as full-width banner
-     * @since 0.9.0
-     */
-    banner: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether to show countdown progress bar
-     * @since 0.9.0
-     */
-    showCountdown: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ["close"],
-  setup(props, { slots, emit, attrs }) {
-    const visible = _vue.ref.call(void 0, true);
-    const colorScheme = _vue.computed.call(void 0, () => _tigercatcore.getAlertTypeClasses.call(void 0, props.type, _tigercatcore.defaultAlertThemeColors));
-    const alertClasses = _vue.computed.call(void 0, 
-      () => _tigercatcore.classNames.call(void 0, 
-        _tigercatcore.alertBaseClasses,
-        _tigercatcore.alertSizeClasses[props.size],
-        colorScheme.value.bg,
-        colorScheme.value.border,
-        props.banner && _tigercatcore.alertBannerClasses
-      )
-    );
-    const iconClasses = _vue.computed.call(void 0, 
-      () => _tigercatcore.classNames.call(void 0, _tigercatcore.alertIconSizeClasses[props.size], colorScheme.value.icon)
-    );
-    const titleClasses = _vue.computed.call(void 0, 
-      () => _tigercatcore.classNames.call(void 0, _tigercatcore.alertTitleSizeClasses[props.size], colorScheme.value.title)
-    );
-    const descriptionClasses = _vue.computed.call(void 0, 
-      () => _tigercatcore.classNames.call(void 0, _tigercatcore.alertDescriptionSizeClasses[props.size], colorScheme.value.description)
-    );
-    const closeButtonClasses = _vue.computed.call(void 0, 
-      () => _tigercatcore.classNames.call(void 0, 
-        _tigercatcore.alertCloseButtonBaseClasses,
-        colorScheme.value.closeButton,
-        colorScheme.value.closeButtonHover,
-        colorScheme.value.focus
-      )
-    );
-    const handleClose = (event) => {
-      emit("close", event);
-      if (!event.defaultPrevented) {
-        visible.value = false;
-      }
-    };
-    let autoCloseTimer;
-    const countdownProgress = _vue.ref.call(void 0, 100);
-    let countdownInterval;
-    _vue.onMounted.call(void 0, () => {
-      if (props.duration && props.duration > 0 && props.closable) {
-        const duration = props.duration;
-        autoCloseTimer = setTimeout(() => {
-          visible.value = false;
-          emit("close", new MouseEvent("click"));
-        }, duration);
-        if (props.showCountdown) {
-          const startTime = Date.now();
-          countdownInterval = setInterval(() => {
-            const elapsed = Date.now() - startTime;
-            countdownProgress.value = Math.max(0, 100 - elapsed / duration * 100);
-          }, 50);
-        }
-      }
-    });
-    _vue.onBeforeUnmount.call(void 0, () => {
-      if (autoCloseTimer) clearTimeout(autoCloseTimer);
-      if (countdownInterval) clearInterval(countdownInterval);
-    });
-    return () => {
-      if (!visible.value) {
-        return null;
-      }
-      const attrsRecord = attrs;
-      const attrsClass = attrsRecord.class;
-      const attrsStyle = attrsRecord.style;
-      const children = [];
-      if (props.showIcon) {
-        const iconPath = _tigercatcore.getAlertIconPath.call(void 0, props.type);
-        children.push(
-          _vue.h.call(void 0, 
-            "div",
-            { class: _tigercatcore.alertIconContainerClasses },
-            _chunkJCMGBKS6js.createStatusIcon.call(void 0, iconPath, iconClasses.value)
-          )
-        );
-      }
-      const contentChildren = [];
-      if (props.title || slots.title) {
-        contentChildren.push(
-          _vue.h.call(void 0, "div", { class: titleClasses.value }, slots.title ? slots.title() : props.title)
-        );
-      }
-      if (props.description || slots.description) {
-        contentChildren.push(
-          _vue.h.call(void 0, 
-            "div",
-            { class: descriptionClasses.value },
-            slots.description ? slots.description() : props.description
-          )
-        );
-      }
-      if (!props.title && !props.description && !slots.title && !slots.description && slots.default) {
-        contentChildren.push(_vue.h.call(void 0, "div", { class: titleClasses.value }, slots.default()));
-      }
-      if (contentChildren.length > 0) {
-        children.push(_vue.h.call(void 0, "div", { class: _tigercatcore.alertContentClasses }, contentChildren));
-      }
-      if (props.closable) {
-        children.push(
-          _vue.h.call(void 0, 
-            "button",
-            {
-              class: closeButtonClasses.value,
-              onClick: handleClose,
-              "aria-label": props.closeAriaLabel,
-              type: "button"
-            },
-            _chunkJCMGBKS6js.createStatusIcon.call(void 0, _tigercatcore.alertCloseIconPath, "h-4 w-4")
-          )
-        );
-      }
-      if (props.showCountdown && props.duration && props.duration > 0 && props.closable) {
-        children.push(
-          _vue.h.call(void 0, "div", { class: _tigercatcore.alertCountdownContainerClasses }, [
-            _vue.h.call(void 0, "div", {
-              class: _tigercatcore.classNames.call(void 0, _tigercatcore.alertCountdownBarClasses, _tigercatcore.alertCountdownColorClasses[props.type]),
-              style: { width: `${countdownProgress.value}%` }
-            })
-          ])
-        );
-      }
-      return _vue.h.call(void 0, 
-        "div",
-        {
-          ...attrs,
-          class: _tigercatcore.classNames.call(void 0, alertClasses.value, props.className, _tigercatcore.coerceClassValue.call(void 0, attrsClass)),
-          style: _tigercatcore.mergeStyleValues.call(void 0, attrsStyle, props.style),
-          role: "alert"
-        },
-        children
-      );
-    };
-  }
-});
-var Alert_default = Alert;
-
-
-
-
-exports.Alert = Alert; exports.Alert_default = Alert_default;