@expcat/tigercat-vue 1.0.7 → 1.2.0

package/dist/{chunk-T52TU2RW.mjs → chunk-AXDBME5A.mjs}

@@ -1,7 +1,15 @@
-import { defineComponent, ref, watch, onMounted, computed, onBeforeUnmount, h } from 'vue';
-import { classNames, getSplitterContainerClasses, coerceClassValue, getPaneStyle, getSplitterGutterClasses, resizePanes, getSplitterGutterHandleClasses } from '@expcat/tigercat-core';
-
 // src/components/Splitter.ts
+import { defineComponent, h, ref, computed, onMounted, onBeforeUnmount, watch } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  getSplitterContainerClasses,
+  getSplitterGutterClasses,
+  getSplitterGutterHandleClasses,
+  getPaneStyle,
+  resizePanes,
+  createDocumentDragSession
+} from "@expcat/tigercat-core";
 var Splitter = defineComponent({
   name: "TigerSplitter",
   props: {
@@ -45,6 +53,7 @@ var Splitter = defineComponent({
     const draggingIndex = ref(-1);
     const startPos = ref(0);
     const startSizes = ref([]);
+    let dragSession = null;
     watch(
       () => props.sizes,
       (newSizes) => {
@@ -76,19 +85,41 @@ var Splitter = defineComponent({
     );
     const getMins = () => paneSizes.value.map(() => props.min);
     const getMaxes = () => paneSizes.value.map(() => props.max);
+    const cleanupDragSession = () => {
+      dragSession?.dispose();
+      dragSession = null;
+    };
     const onMouseDown = (index, e) => {
       if (props.disabled) return;
       e.preventDefault();
+      cleanupDragSession();
       draggingIndex.value = index;
       startPos.value = props.direction === "horizontal" ? e.clientX : e.clientY;
       startSizes.value = [...paneSizes.value];
       emit("resize-start", { index, sizes: [...paneSizes.value] });
-      document.addEventListener("mousemove", onMouseMove);
-      document.addEventListener("mouseup", onMouseUp);
+      dragSession = createDocumentDragSession({
+        startX: e.clientX,
+        startY: e.clientY,
+        ownerDocument: e.currentTarget?.ownerDocument,
+        onMove: ({ currentX, currentY }) => {
+          applyDragResize(currentX, currentY);
+        },
+        onEnd: ({ currentX, currentY }) => {
+          applyDragResize(currentX, currentY);
+          if (draggingIndex.value >= 0) {
+            emit("resize-end", {
+              index: draggingIndex.value,
+              sizes: [...paneSizes.value]
+            });
+          }
+          draggingIndex.value = -1;
+          dragSession = null;
+        }
+      });
     };
-    const onMouseMove = (e) => {
+    const applyDragResize = (currentX, currentY) => {
       if (draggingIndex.value < 0) return;
-      const currentPos = props.direction === "horizontal" ? e.clientX : e.clientY;
+      const currentPos = props.direction === "horizontal" ? currentX : currentY;
       const delta = currentPos - startPos.value;
       const newSizes = resizePanes(
         startSizes.value,
@@ -103,20 +134,8 @@ var Splitter = defineComponent({
         emit("resize", { index: draggingIndex.value, sizes: newSizes });
       }
     };
-    const onMouseUp = () => {
-      if (draggingIndex.value >= 0) {
-        emit("resize-end", {
-          index: draggingIndex.value,
-          sizes: [...paneSizes.value]
-        });
-      }
-      draggingIndex.value = -1;
-      document.removeEventListener("mousemove", onMouseMove);
-      document.removeEventListener("mouseup", onMouseUp);
-    };
     onBeforeUnmount(() => {
-      document.removeEventListener("mousemove", onMouseMove);
-      document.removeEventListener("mouseup", onMouseUp);
+      cleanupDragSession();
     });
     return () => {
       const children = slots.default?.() || [];
@@ -187,4 +206,7 @@ var Splitter = defineComponent({
 });
 var Splitter_default = Splitter;
 
-export { Splitter, Splitter_default };
+export {
+  Splitter,
+  Splitter_default
+};

package/dist/{chunk-D6AWPRGV.js → chunk-B2RH4CMG.js}

@@ -1,11 +1,34 @@
-'use strict';
+"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/Form.ts
 
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
 
-// src/components/Form.ts
+
+
+
+
+
+
+
+var _vue = require('vue');
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
 var FormContextKey = /* @__PURE__ */ Symbol("FormContext");
-var Form = vue.defineComponent({
+var Form = _vue.defineComponent.call(void 0, {
   name: "TigerForm",
   props: {
     /**
@@ -89,6 +112,14 @@ var Form = vue.defineComponent({
       type: Object,
       default: void 0
     },
+    conditions: {
+      type: Object,
+      default: void 0
+    },
+    validateDebounce: {
+      type: Number,
+      default: 0
+    },
     undoable: {
       type: Boolean,
       default: false
@@ -109,10 +140,15 @@ var Form = vue.defineComponent({
     validate: (fieldName, isValid, _errorMessage) => typeof fieldName === "string" && typeof isValid === "boolean"
   },
   setup(props, { slots, emit, expose }) {
-    const errors = vue.reactive([]);
-    const fieldRules = vue.reactive({});
-    const history = vue.ref(
-      tigercatCore.createFormHistory(props.model ?? {}, props.maxHistorySize)
+    const errors = _vue.reactive.call(void 0, []);
+    const fieldRules = _vue.reactive.call(void 0, {});
+    const fieldConditions = _vue.reactive.call(void 0, {});
+    const errorsByField = _vue.computed.call(void 0, () => _tigercatcore.createFormErrorMap.call(void 0, errors));
+    let validationDebouncer = _tigercatcore.createFormValidationDebouncer.call(void 0, {
+      delay: props.validateDebounce
+    });
+    const history = _vue.ref.call(void 0, 
+      _tigercatcore.createFormHistory.call(void 0, _nullishCoalesce(props.model, () => ( {})), props.maxHistorySize)
     );
     const registerFieldRules = (fieldName, rules) => {
       if (!fieldName) {
@@ -124,31 +160,85 @@ var Form = vue.defineComponent({
       }
       fieldRules[fieldName] = rules;
     };
-    const getEffectiveRules = () => {
+    const registerFieldCondition = (fieldName, condition) => {
+      if (!fieldName) {
+        return;
+      }
+      if (!condition) {
+        delete fieldConditions[fieldName];
+        return;
+      }
+      fieldConditions[fieldName] = condition;
+    };
+    const getEffectiveConditions = () => {
       const merged = {
-        ...props.rules ?? {},
-        ...fieldRules
+        ..._nullishCoalesce(props.conditions, () => ( {})),
+        ...fieldConditions
       };
       return Object.keys(merged).length > 0 ? merged : void 0;
     };
+    const getMergedFieldCondition = (fieldName, conditionOverride) => {
+      const base = _optionalChain([getEffectiveConditions, 'call', _ => _(), 'optionalAccess', _2 => _2[fieldName]]);
+      return base || conditionOverride ? { ..._nullishCoalesce(base, () => ( {})), ..._nullishCoalesce(conditionOverride, () => ( {})) } : void 0;
+    };
+    const getFieldConditionState = (fieldName, conditionOverride) => {
+      return _tigercatcore.resolveFormFieldConditionState.call(void 0, 
+        props.model,
+        getMergedFieldCondition(fieldName, conditionOverride)
+      );
+    };
+    const getEffectiveRules = () => {
+      const mergedRules = {
+        ..._nullishCoalesce(props.rules, () => ( {})),
+        ...fieldRules
+      };
+      const rules = Object.keys(mergedRules).length > 0 ? mergedRules : void 0;
+      return _tigercatcore.resolveConditionalFormRules.call(void 0, props.model, rules, getEffectiveConditions());
+    };
     const resolveFieldRules = (fieldName, rulesOverride) => {
-      return rulesOverride ?? fieldRules[fieldName] ?? props.rules?.[fieldName];
+      const fieldRulesValue = _nullishCoalesce(_nullishCoalesce(rulesOverride, () => ( fieldRules[fieldName])), () => ( _optionalChain([props, 'access', _3 => _3.rules, 'optionalAccess', _4 => _4[fieldName]])));
+      const resolved = _tigercatcore.resolveConditionalFormRules.call(void 0, 
+        props.model,
+        fieldRulesValue ? { [fieldName]: fieldRulesValue } : void 0,
+        getEffectiveConditions()
+      );
+      return _optionalChain([resolved, 'optionalAccess', _5 => _5[fieldName]]);
+    };
+    const getDependencyMap = () => {
+      const conditionDependencies = _tigercatcore.createFormConditionDependencies.call(void 0, getEffectiveConditions());
+      if (!props.fieldDependencies && conditionDependencies.size === 0) {
+        return void 0;
+      }
+      const merged = new Map(_nullishCoalesce(props.fieldDependencies, () => ( [])));
+      for (const [fieldName, dependencies] of conditionDependencies.entries()) {
+        const current = _nullishCoalesce(merged.get(fieldName), () => ( []));
+        merged.set(fieldName, Array.from(/* @__PURE__ */ new Set([...current, ...dependencies])));
+      }
+      return merged;
     };
     const runFieldValidation = async (fieldName, rulesOverride, trigger) => {
       const effectiveFieldRules = resolveFieldRules(fieldName, rulesOverride);
       if (!effectiveFieldRules) {
         return null;
       }
-      const value = tigercatCore.getValueByPath(props.model, fieldName);
-      return tigercatCore.validateField(fieldName, value, effectiveFieldRules, props.model, trigger);
+      const value = _tigercatcore.getValueByPath.call(void 0, props.model, fieldName);
+      return _tigercatcore.validateField.call(void 0, fieldName, value, effectiveFieldRules, props.model, trigger);
     };
-    const validateField = async (fieldName, rulesOverride, trigger) => {
+    const validateFieldNow = async (fieldName, rulesOverride, trigger) => {
+      const conditionState = getFieldConditionState(fieldName);
+      if (!conditionState.shown || conditionState.disabled) {
+        clearValidate(fieldName);
+        emit("validate", fieldName, true, void 0);
+        return;
+      }
       const effectiveFieldRules = resolveFieldRules(fieldName, rulesOverride);
       if (effectiveFieldRules) {
         const error = await runFieldValidation(fieldName, rulesOverride, trigger);
         const existingIndex = errors.findIndex((e) => e.field === fieldName);
         const existingMessage = existingIndex !== -1 ? errors[existingIndex].message : null;
-        if (!error && existingMessage === null) ; else if (error && error === existingMessage) ; else {
+        if (!error && existingMessage === null) {
+        } else if (error && error === existingMessage) {
+        } else {
           if (existingIndex !== -1) {
             errors.splice(existingIndex, 1);
           }
@@ -161,20 +251,32 @@ var Form = vue.defineComponent({
         }
         emit("validate", fieldName, !error, error || void 0);
       }
-      if (props.fieldDependencies) {
-        const dependents = tigercatCore.getDependentFields(fieldName, props.fieldDependencies);
+      const dependencyMap = getDependencyMap();
+      if (dependencyMap) {
+        const dependents = _tigercatcore.getDependentFields.call(void 0, fieldName, dependencyMap);
         for (const dep of dependents) {
-          await validateField(dep);
+          await validateFieldNow(dep);
         }
       }
     };
+    const validateField = async (fieldName, rulesOverride, trigger) => {
+      if (trigger === "change" && props.validateDebounce > 0) {
+        return validationDebouncer.schedule(
+          fieldName,
+          () => validateFieldNow(fieldName, rulesOverride, trigger)
+        );
+      }
+      validationDebouncer.cancel(fieldName);
+      return validateFieldNow(fieldName, rulesOverride, trigger);
+    };
     const validate = async () => {
+      validationDebouncer.cancel();
       errors.splice(0, errors.length);
       const effectiveRules = getEffectiveRules();
       if (!effectiveRules) {
         return true;
       }
-      const result = await tigercatCore.validateForm(props.model, effectiveRules);
+      const result = await _tigercatcore.validateForm.call(void 0, props.model, effectiveRules);
       errors.push(...result.errors);
       return result.valid;
     };
@@ -182,6 +284,7 @@ var Form = vue.defineComponent({
       if (!fieldNames || fieldNames.length === 0) {
         return true;
       }
+      fieldNames.forEach((fieldName) => validationDebouncer.cancel(fieldName));
       const nextErrors = [];
       const fieldSet = new Set(fieldNames);
       for (const fieldName of fieldNames) {
@@ -206,10 +309,12 @@ var Form = vue.defineComponent({
     };
     const clearValidate = (fieldNames) => {
       if (!fieldNames) {
+        validationDebouncer.cancel();
         errors.splice(0, errors.length);
         return;
       }
       const fields = Array.isArray(fieldNames) ? fieldNames : [fieldNames];
+      fields.forEach((fieldName) => validationDebouncer.cancel(fieldName));
       fields.forEach((fieldName) => {
         const index = errors.findIndex((e) => e.field === fieldName);
         if (index !== -1) {
@@ -218,11 +323,12 @@ var Form = vue.defineComponent({
       });
     };
     const resetFields = () => {
+      validationDebouncer.cancel();
       clearValidate();
     };
     const addField = (fieldName, defaultValue) => {
       if (props.model && fieldName) {
-        props.model[fieldName] = defaultValue ?? null;
+        props.model[fieldName] = _nullishCoalesce(defaultValue, () => ( null));
       }
     };
     const removeField = (fieldName) => {
@@ -231,13 +337,23 @@ var Form = vue.defineComponent({
         clearValidate(fieldName);
       }
     };
+    _vue.watch.call(void 0, 
+      () => props.validateDebounce,
+      (delay) => {
+        validationDebouncer.cancel();
+        validationDebouncer = _tigercatcore.createFormValidationDebouncer.call(void 0, { delay });
+      }
+    );
+    _vue.onBeforeUnmount.call(void 0, () => {
+      validationDebouncer.cancel();
+    });
     const snapshotHistory = () => {
       if (!props.undoable || !props.model) return;
-      history.value = tigercatCore.pushFormHistory(history.value, props.model);
+      history.value = _tigercatcore.pushFormHistory.call(void 0, history.value, props.model);
     };
     const undo = () => {
       if (!props.undoable) return;
-      const result = tigercatCore.undoFormHistory(history.value);
+      const result = _tigercatcore.undoFormHistory.call(void 0, history.value);
       if (result && props.model) {
         history.value = result;
         Object.keys(props.model).forEach((k) => delete props.model[k]);
@@ -246,22 +362,22 @@ var Form = vue.defineComponent({
     };
     const redo = () => {
       if (!props.undoable) return;
-      const result = tigercatCore.redoFormHistory(history.value);
+      const result = _tigercatcore.redoFormHistory.call(void 0, history.value);
       if (result && props.model) {
         history.value = result;
         Object.keys(props.model).forEach((k) => delete props.model[k]);
         Object.assign(props.model, { ...result.present });
       }
     };
-    const canUndoNow = vue.computed(() => props.undoable && tigercatCore.canUndo(history.value));
-    const canRedoNow = vue.computed(() => props.undoable && tigercatCore.canRedo(history.value));
+    const canUndoNow = _vue.computed.call(void 0, () => props.undoable && _tigercatcore.canUndo.call(void 0, history.value));
+    const canRedoNow = _vue.computed.call(void 0, () => props.undoable && _tigercatcore.canRedo.call(void 0, history.value));
     const handleSubmit = async (event) => {
       event.preventDefault();
       if (props.loading) return;
       const valid = await validate();
       emit("submit", { valid, values: props.model, errors });
     };
-    const formContextValue = vue.computed(() => ({
+    const formContextValue = _vue.computed.call(void 0, () => ({
       model: props.model,
       rules: props.rules,
       labelWidth: props.labelWidth,
@@ -273,11 +389,14 @@ var Form = vue.defineComponent({
       disabled: props.disabled,
       loading: props.loading,
       errors,
+      errorsByField: errorsByField.value,
       registerFieldRules,
+      registerFieldCondition,
+      getFieldConditionState,
       validateField,
       clearValidate
     }));
-    vue.provide(FormContextKey, formContextValue);
+    _vue.provide.call(void 0, FormContextKey, formContextValue);
     expose({
       validate,
       validateFields,
@@ -292,8 +411,8 @@ var Form = vue.defineComponent({
       canUndo: canUndoNow,
       canRedo: canRedoNow
     });
-    const formClasses = vue.computed(() => {
-      return tigercatCore.classNames(
+    const formClasses = _vue.computed.call(void 0, () => {
+      return _tigercatcore.classNames.call(void 0, 
         "tiger-form",
         `tiger-form--label-${props.labelPosition}`,
         props.disabled && "tiger-form--disabled",
@@ -301,19 +420,21 @@ var Form = vue.defineComponent({
       );
     });
     return () => {
-      return vue.h(
+      return _vue.h.call(void 0, 
         "form",
         {
           class: formClasses.value,
           onSubmit: handleSubmit
         },
-        slots.default?.()
+        _optionalChain([slots, 'access', _6 => _6.default, 'optionalCall', _7 => _7()])
       );
     };
   }
 });
 var Form_default = Form;
 
-exports.Form = Form;
-exports.FormContextKey = FormContextKey;
-exports.Form_default = Form_default;
+
+
+
+
+exports.FormContextKey = FormContextKey; exports.Form = Form; exports.Form_default = Form_default;

package/dist/chunk-B67RJSXR.mjs

@@ -0,0 +1,142 @@
+// src/components/Countdown.ts
+import { computed, defineComponent, h, onBeforeUnmount, onMounted, ref, watch } from "vue";
+import {
+  COUNTDOWN_DEFAULT_FORMAT,
+  COUNTDOWN_DEFAULT_INTERVAL_MS,
+  classNames,
+  coerceClassValue,
+  countdownBaseClasses,
+  countdownPrefixClasses,
+  countdownSuffixClasses,
+  countdownValueWrapperClasses,
+  createCountdownPayload,
+  formatCountdown,
+  getCountdownRemaining,
+  getCountdownTitleClasses,
+  getCountdownValueClasses
+} from "@expcat/tigercat-core";
+var Countdown = defineComponent({
+  name: "TigerCountdown",
+  inheritAttrs: false,
+  props: {
+    value: {
+      type: [String, Number, Date],
+      default: void 0
+    },
+    now: {
+      type: [String, Number, Date],
+      default: void 0
+    },
+    format: {
+      type: String,
+      default: COUNTDOWN_DEFAULT_FORMAT
+    },
+    interval: {
+      type: Number,
+      default: COUNTDOWN_DEFAULT_INTERVAL_MS
+    },
+    title: {
+      type: String,
+      default: void 0
+    },
+    prefix: {
+      type: String,
+      default: void 0
+    },
+    suffix: {
+      type: String,
+      default: void 0
+    },
+    size: {
+      type: String,
+      default: "md"
+    },
+    ariaLabel: {
+      type: String,
+      default: void 0
+    },
+    className: {
+      type: String,
+      default: void 0
+    }
+  },
+  emits: ["change", "finish"],
+  setup(props, { attrs, emit }) {
+    const remaining = ref(getCountdownRemaining(props.value, props.now));
+    const formatted = computed(() => formatCountdown(remaining.value, props.format));
+    let finished = remaining.value <= 0;
+    let mounted = false;
+    let timerId = null;
+    const stopTimer = () => {
+      if (timerId !== null) clearInterval(timerId);
+      timerId = null;
+    };
+    const tick = () => {
+      const nextRemaining = getCountdownRemaining(props.value);
+      const payload = createCountdownPayload(nextRemaining, props.format);
+      remaining.value = nextRemaining;
+      emit("change", payload);
+      if (nextRemaining <= 0 && !finished) {
+        finished = true;
+        emit("finish", payload);
+        stopTimer();
+      }
+    };
+    const setupTimer = () => {
+      stopTimer();
+      if (!mounted || props.interval <= 0 || props.value === void 0) return;
+      timerId = setInterval(tick, props.interval);
+    };
+    watch(
+      () => [props.value, props.now],
+      () => {
+        remaining.value = getCountdownRemaining(props.value, props.now);
+        finished = remaining.value <= 0;
+        setupTimer();
+      },
+      { immediate: true }
+    );
+    watch(
+      () => [props.interval, props.format],
+      () => setupTimer()
+    );
+    onMounted(() => {
+      mounted = true;
+      setupTimer();
+    });
+    onBeforeUnmount(() => {
+      mounted = false;
+      stopTimer();
+    });
+    return () => h(
+      "div",
+      {
+        ...attrs,
+        class: classNames(countdownBaseClasses, props.className, coerceClassValue(attrs.class))
+      },
+      [
+        props.title ? h("div", { class: getCountdownTitleClasses(props.size) }, props.title) : null,
+        h("div", { class: countdownValueWrapperClasses }, [
+          props.prefix ? h("span", { class: countdownPrefixClasses }, props.prefix) : null,
+          h(
+            "span",
+            {
+              class: getCountdownValueClasses(props.size),
+              role: "timer",
+              "aria-live": "polite",
+              "aria-label": props.ariaLabel
+            },
+            formatted.value
+          ),
+          props.suffix ? h("span", { class: countdownSuffixClasses }, props.suffix) : null
+        ])
+      ]
+    );
+  }
+});
+var Countdown_default = Countdown;
+
+export {
+  Countdown,
+  Countdown_default
+};