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

package/dist/components/Notification.d.mts

@@ -1,33 +1,8 @@
-import * as vue from 'vue';
-import { PropType } from 'vue';
-import { NotificationPosition, NotificationOptions } from '@expcat/tigercat-core';
+import { NotificationOptions, NotificationPosition } from '@expcat/tigercat-core';
+export { NotificationContainer, VueNotificationContainerProps } from './NotificationContainer.mjs';
+import 'vue';
 
-interface VueNotificationContainerProps {
-    position?: NotificationPosition;
-}
-/** Options accepted by the Vue global notification API. */
 type VueNotificationProps = NotificationOptions;
-/**
- * Notification container component for a specific position
- */
-declare const NotificationContainer: vue.DefineComponent<vue.ExtractPropTypes<{
-    position: {
-        type: PropType<NotificationPosition>;
-        default: NotificationPosition;
-    };
-}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    position: {
-        type: PropType<NotificationPosition>;
-        default: NotificationPosition;
-    };
-}>> & Readonly<{}>, {
-    position: NotificationPosition;
-}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
-/**
- * Notification API
- */
 declare const notification: {
     info(options: NotificationOptions): () => void;
     success(options: NotificationOptions): () => void;
@@ -36,4 +11,4 @@ declare const notification: {
     clear(position?: NotificationPosition): void;
 };
 
-export { NotificationContainer, type VueNotificationContainerProps, type VueNotificationProps, notification as default, notification };
+export { type VueNotificationProps, notification as default, notification };

package/dist/components/Notification.mjs

@@ -1,9 +1,194 @@
 import {
-  NotificationContainer,
-  Notification_default,
-  notification
-} from "../chunk-6WFFP4K2.mjs";
+  NotificationContainer
+} from "../chunk-GMIKUE67.mjs";
 import "../chunk-2TNZ4JNT.mjs";
+
+// src/components/Notification.ts
+import { createApp, defineComponent, h, ref } from "vue";
+import {
+  createInstanceCounter,
+  createNotificationStackUpdateScheduler,
+  isBrowser,
+  normalizeStringOption
+} from "@expcat/tigercat-core";
+var NOTIFICATION_CONTAINER_ID_PREFIX = "tiger-notification-container";
+var notificationInstancesByPosition = {
+  "top-left": [],
+  "top-right": [],
+  "bottom-left": [],
+  "bottom-right": []
+};
+var containerApps = {
+  "top-left": null,
+  "top-right": null,
+  "bottom-left": null,
+  "bottom-right": null
+};
+var updateCallbacks = {
+  "top-left": null,
+  "top-right": null,
+  "bottom-left": null,
+  "bottom-right": null
+};
+var stackUpdateScheduler = null;
+var getNextInstanceId = null;
+function getNotificationStackUpdateScheduler() {
+  stackUpdateScheduler ??= createNotificationStackUpdateScheduler();
+  return stackUpdateScheduler;
+}
+function getNotificationInstanceId() {
+  getNextInstanceId ??= createInstanceCounter();
+  return getNextInstanceId();
+}
+function scheduleNotificationStackUpdate(position) {
+  const callback = updateCallbacks[position];
+  if (!callback) return;
+  getNotificationStackUpdateScheduler().schedule(position, callback);
+}
+function getContainerRootId(position) {
+  return `${NOTIFICATION_CONTAINER_ID_PREFIX}-${position}-root`;
+}
+var NotificationHost = /* @__PURE__ */ defineComponent({
+  name: "TigerNotificationHost",
+  props: {
+    position: {
+      type: String,
+      required: true
+    }
+  },
+  setup(props) {
+    const notifications = ref([]);
+    updateCallbacks[props.position] = () => {
+      notifications.value = [...notificationInstancesByPosition[props.position]];
+    };
+    updateCallbacks[props.position]?.();
+    return () => h(NotificationContainer, {
+      position: props.position,
+      notifications: notifications.value,
+      onClose: (id) => removeNotification(id, props.position)
+    });
+  }
+});
+function ensureContainer(position) {
+  if (!isBrowser()) {
+    return;
+  }
+  const rootId = getContainerRootId(position);
+  const existingRootEl = document.getElementById(rootId);
+  if (containerApps[position] && !existingRootEl) {
+    containerApps[position] = null;
+    updateCallbacks[position] = null;
+    getNotificationStackUpdateScheduler().cancel(position);
+  }
+  if (containerApps[position]) {
+    return;
+  }
+  let rootEl = existingRootEl;
+  if (!rootEl) {
+    rootEl = document.createElement("div");
+    rootEl.id = rootId;
+    document.body.appendChild(rootEl);
+  }
+  containerApps[position] = createApp(NotificationHost, { position });
+  containerApps[position].mount(rootEl);
+}
+function destroyContainer(position) {
+  const rootId = getContainerRootId(position);
+  if (containerApps[position]) {
+    containerApps[position].unmount();
+    containerApps[position] = null;
+  }
+  updateCallbacks[position] = null;
+  getNotificationStackUpdateScheduler().cancel(position);
+  if (isBrowser()) {
+    document.getElementById(rootId)?.remove();
+  }
+}
+function addNotification(config) {
+  const id = getNotificationInstanceId();
+  const position = config.position || "top-right";
+  ensureContainer(position);
+  const instance = {
+    id,
+    type: config.type || "info",
+    title: config.title,
+    description: config.description,
+    duration: config.duration !== void 0 ? config.duration : 4500,
+    closable: config.closable !== void 0 ? config.closable : true,
+    onClose: config.onClose,
+    onClick: config.onClick,
+    actions: config.actions,
+    icon: config.icon,
+    className: config.className,
+    position
+  };
+  notificationInstancesByPosition[position].push(instance);
+  scheduleNotificationStackUpdate(position);
+  if (instance.duration > 0) {
+    setTimeout(() => {
+      removeNotification(id, position);
+    }, instance.duration);
+  }
+  return () => removeNotification(id, position);
+}
+function removeNotification(id, position) {
+  const instances = notificationInstancesByPosition[position];
+  const index = instances.findIndex((notif) => notif.id === id);
+  if (index !== -1) {
+    const instance = instances[index];
+    instances.splice(index, 1);
+    instance.onClose?.();
+    if (notificationInstancesByPosition[position].length > 0) {
+      scheduleNotificationStackUpdate(position);
+    }
+  }
+  if (notificationInstancesByPosition[position].length === 0) {
+    destroyContainer(position);
+  }
+}
+function clearAll(position) {
+  if (position) {
+    notificationInstancesByPosition[position].forEach((instance) => {
+      instance.onClose?.();
+    });
+    notificationInstancesByPosition[position] = [];
+    destroyContainer(position);
+  } else {
+    Object.keys(notificationInstancesByPosition).forEach((pos) => {
+      const p = pos;
+      notificationInstancesByPosition[p].forEach((instance) => {
+        instance.onClose?.();
+      });
+      notificationInstancesByPosition[p] = [];
+      destroyContainer(p);
+    });
+  }
+}
+function normalizeOptions(options) {
+  return normalizeStringOption(options, "title");
+}
+var notification = {
+  info(options) {
+    const config = normalizeOptions(options);
+    return addNotification({ ...config, type: "info" });
+  },
+  success(options) {
+    const config = normalizeOptions(options);
+    return addNotification({ ...config, type: "success" });
+  },
+  warning(options) {
+    const config = normalizeOptions(options);
+    return addNotification({ ...config, type: "warning" });
+  },
+  error(options) {
+    const config = normalizeOptions(options);
+    return addNotification({ ...config, type: "error" });
+  },
+  clear(position) {
+    clearAll(position);
+  }
+};
+var Notification_default = notification;
 export {
   NotificationContainer,
   Notification_default as default,

package/dist/components/{Notification.d.ts → NotificationContainer.d.mts}

@@ -1,20 +1,22 @@
 import * as vue from 'vue';
 import { PropType } from 'vue';
-import { NotificationPosition, NotificationOptions } from '@expcat/tigercat-core';
+import { NotificationPosition, NotificationInstance } from '@expcat/tigercat-core';
 
 interface VueNotificationContainerProps {
     position?: NotificationPosition;
+    notifications?: NotificationInstance[];
+    onClose?: (id: string | number) => void;
 }
-/** Options accepted by the Vue global notification API. */
-type VueNotificationProps = NotificationOptions;
-/**
- * Notification container component for a specific position
- */
 declare const NotificationContainer: vue.DefineComponent<vue.ExtractPropTypes<{
     position: {
         type: PropType<NotificationPosition>;
         default: NotificationPosition;
     };
+    notifications: {
+        type: PropType<NotificationInstance[]>;
+        default: () => never[];
+    };
+    onClose: PropType<(id: string | number) => void>;
 }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
@@ -22,18 +24,14 @@ declare const NotificationContainer: vue.DefineComponent<vue.ExtractPropTypes<{
         type: PropType<NotificationPosition>;
         default: NotificationPosition;
     };
+    notifications: {
+        type: PropType<NotificationInstance[]>;
+        default: () => never[];
+    };
+    onClose: PropType<(id: string | number) => void>;
 }>> & Readonly<{}>, {
     position: NotificationPosition;
+    notifications: NotificationInstance[];
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
-/**
- * Notification API
- */
-declare const notification: {
-    info(options: NotificationOptions): () => void;
-    success(options: NotificationOptions): () => void;
-    warning(options: NotificationOptions): () => void;
-    error(options: NotificationOptions): () => void;
-    clear(position?: NotificationPosition): void;
-};
 
-export { NotificationContainer, type VueNotificationContainerProps, type VueNotificationProps, notification as default, notification };
+export { NotificationContainer, type VueNotificationContainerProps, NotificationContainer as default };

package/dist/components/NotificationContainer.mjs

@@ -0,0 +1,9 @@
+import {
+  NotificationContainer,
+  NotificationContainer_default
+} from "../chunk-GMIKUE67.mjs";
+import "../chunk-2TNZ4JNT.mjs";
+export {
+  NotificationContainer,
+  NotificationContainer_default as default
+};

package/dist/components/NotificationRoot.d.mts

@@ -0,0 +1,9 @@
+import { NotificationOptions, NotificationType, NotificationPosition } from '@expcat/tigercat-core';
+
+type VueNotificationProps = NotificationOptions;
+type NotificationClose = () => void;
+declare const notification: Record<NotificationType, (options: NotificationOptions) => NotificationClose> & {
+    clear: (position?: NotificationPosition) => void;
+};
+
+export { type VueNotificationProps, notification };

package/dist/components/NotificationRoot.mjs

@@ -0,0 +1,6 @@
+import {
+  notification
+} from "../chunk-ESBUNMIG.mjs";
+export {
+  notification
+};

package/dist/components/PieChart.mjs

@@ -1,12 +1,12 @@
 import {
   PieChart,
   PieChart_default
-} from "../chunk-S4Z77VIB.mjs";
-import "../chunk-R2HO74FE.mjs";
+} from "../chunk-AZXS4QWC.mjs";
+import "../chunk-PE5OA4YG.mjs";
+import "../chunk-SPFL55TF.mjs";
+import "../chunk-W5RZPTFD.mjs";
 import "../chunk-HLPSHCXO.mjs";
 import "../chunk-2ZUEXCVJ.mjs";
-import "../chunk-G2LB4QCL.mjs";
-import "../chunk-W5RZPTFD.mjs";
 export {
   PieChart,
   PieChart_default as default

package/dist/components/Popconfirm.mjs

@@ -1,8 +1,8 @@
 import {
   Popconfirm,
   Popconfirm_default
-} from "../chunk-XMGNMKWW.mjs";
-import "../chunk-M4EP4OVR.mjs";
+} from "../chunk-VMYV5EWI.mjs";
+import "../chunk-KE6RGD4Y.mjs";
 import "../chunk-BDTPFPSB.mjs";
 export {
   Popconfirm,

package/dist/components/Popover.mjs

@@ -1,8 +1,8 @@
 import {
   Popover,
   Popover_default
-} from "../chunk-6OQLZCQK.mjs";
-import "../chunk-M4EP4OVR.mjs";
+} from "../chunk-SYRRMZT2.mjs";
+import "../chunk-KE6RGD4Y.mjs";
 import "../chunk-BDTPFPSB.mjs";
 export {
   Popover,

package/dist/components/RadarChart.mjs

@@ -1,12 +1,12 @@
 import {
   RadarChart,
   RadarChart_default
-} from "../chunk-UTGFGMZT.mjs";
-import "../chunk-R2HO74FE.mjs";
+} from "../chunk-JPCMI3A4.mjs";
+import "../chunk-PE5OA4YG.mjs";
+import "../chunk-SPFL55TF.mjs";
+import "../chunk-W5RZPTFD.mjs";
 import "../chunk-HLPSHCXO.mjs";
 import "../chunk-2ZUEXCVJ.mjs";
-import "../chunk-G2LB4QCL.mjs";
-import "../chunk-W5RZPTFD.mjs";
 export {
   RadarChart,
   RadarChart_default as default

package/dist/components/Radio.d.mts

@@ -1,14 +1,14 @@
 import * as vue from 'vue';
 import { PropType } from 'vue';
-import { RadioSize } from '@expcat/tigercat-core';
+import { ComponentSize } from '@expcat/tigercat-core';
 
 interface VueRadioProps {
     value: string | number;
-    size?: RadioSize;
+    size?: ComponentSize;
     disabled?: boolean;
     name?: string;
-    checked?: boolean;
-    defaultChecked?: boolean;
+    modelValue?: boolean;
+    defaultValue?: boolean;
     className?: string;
     style?: Record<string, string | number>;
 }
@@ -25,7 +25,7 @@ declare const Radio: vue.DefineComponent<vue.ExtractPropTypes<{
      * @default 'md'
      */
     size: {
-        type: PropType<RadioSize>;
+        type: PropType<ComponentSize>;
     };
     /**
      * Whether the radio is disabled
@@ -43,14 +43,14 @@ declare const Radio: vue.DefineComponent<vue.ExtractPropTypes<{
     /**
      * Whether the radio is checked (controlled mode)
      */
-    checked: {
+    modelValue: {
         type: BooleanConstructor;
     };
     /**
      * Default checked state (uncontrolled mode)
      * @default false
      */
-    defaultChecked: {
+    defaultValue: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -74,9 +74,9 @@ declare const Radio: vue.DefineComponent<vue.ExtractPropTypes<{
      */
     change: (value: string | number) => boolean;
     /**
-     * Emitted when checked state changes (for v-model:checked)
+     * Emitted when checked state changes (for v-model)
      */
-    'update:checked': (value: boolean) => boolean;
+    'update:modelValue': (value: boolean) => boolean;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * Radio value (required for radio groups)
@@ -90,7 +90,7 @@ declare const Radio: vue.DefineComponent<vue.ExtractPropTypes<{
      * @default 'md'
      */
     size: {
-        type: PropType<RadioSize>;
+        type: PropType<ComponentSize>;
     };
     /**
      * Whether the radio is disabled
@@ -108,14 +108,14 @@ declare const Radio: vue.DefineComponent<vue.ExtractPropTypes<{
     /**
      * Whether the radio is checked (controlled mode)
      */
-    checked: {
+    modelValue: {
         type: BooleanConstructor;
     };
     /**
      * Default checked state (uncontrolled mode)
      * @default false
      */
-    defaultChecked: {
+    defaultValue: {
         type: BooleanConstructor;
         default: boolean;
     };
@@ -133,11 +133,11 @@ declare const Radio: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>> & Readonly<{
     onChange?: ((value: string | number) => any) | undefined;
-    "onUpdate:checked"?: ((value: boolean) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {
     disabled: boolean;
-    checked: boolean;
-    defaultChecked: boolean;
+    defaultValue: boolean;
+    modelValue: boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
 export { Radio, type VueRadioProps, Radio as default };

package/dist/components/Radio.mjs

@@ -1,8 +1,8 @@
 import {
   Radio,
   Radio_default
-} from "../chunk-YZP4K6KI.mjs";
-import "../chunk-Y4V7BOVR.mjs";
+} from "../chunk-6BDDX2R4.mjs";
+import "../chunk-6TTICJR4.mjs";
 export {
   Radio,
   Radio_default as default

package/dist/components/RadioGroup.d.mts

@@ -1,29 +1,29 @@
 import * as vue from 'vue';
 import { PropType } from 'vue';
-import { RadioSize } from '@expcat/tigercat-core';
+import { ComponentSize } from '@expcat/tigercat-core';
 
 declare const RadioGroupKey: unique symbol;
 interface RadioGroupContext {
     value: string | number | undefined;
     name: string;
     disabled: boolean;
-    size: RadioSize;
+    size: ComponentSize;
     onChange: (value: string | number) => void;
 }
 interface VueRadioGroupProps {
-    value?: string | number;
+    modelValue?: string | number;
     defaultValue?: string | number;
     name?: string;
     disabled?: boolean;
-    size?: RadioSize;
+    size?: ComponentSize;
     className?: string;
     style?: Record<string, string | number>;
 }
 declare const RadioGroup: vue.DefineComponent<vue.ExtractPropTypes<{
     /**
-     * Selected value (for v-model:value)
+     * Selected value (for v-model)
      */
-    value: {
+    modelValue: {
         type: PropType<string | number | undefined>;
     };
     /**
@@ -51,8 +51,8 @@ declare const RadioGroup: vue.DefineComponent<vue.ExtractPropTypes<{
      * @default 'md'
      */
     size: {
-        type: PropType<RadioSize>;
-        default: RadioSize;
+        type: PropType<ComponentSize>;
+        default: ComponentSize;
     };
     /**
      * Additional CSS classes
@@ -70,18 +70,18 @@ declare const RadioGroup: vue.DefineComponent<vue.ExtractPropTypes<{
     [key: string]: any;
 }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
     /**
-     * Emitted when value changes (for v-model:value)
+     * Emitted when value changes (for v-model)
      */
-    'update:value': (value: string | number) => boolean;
+    'update:modelValue': (value: string | number) => boolean;
     /**
      * Emitted when value changes
      */
     change: (value: string | number) => boolean;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
-     * Selected value (for v-model:value)
+     * Selected value (for v-model)
      */
-    value: {
+    modelValue: {
         type: PropType<string | number | undefined>;
     };
     /**
@@ -109,8 +109,8 @@ declare const RadioGroup: vue.DefineComponent<vue.ExtractPropTypes<{
      * @default 'md'
      */
     size: {
-        type: PropType<RadioSize>;
-        default: RadioSize;
+        type: PropType<ComponentSize>;
+        default: ComponentSize;
     };
     /**
      * Additional CSS classes
@@ -126,9 +126,9 @@ declare const RadioGroup: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>> & Readonly<{
     onChange?: ((value: string | number) => any) | undefined;
-    "onUpdate:value"?: ((value: string | number) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
-    size: RadioSize;
+    size: ComponentSize;
     disabled: boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 

package/dist/components/RadioGroup.mjs

@@ -2,7 +2,7 @@ import {
   RadioGroup,
   RadioGroupKey,
   RadioGroup_default
-} from "../chunk-Y4V7BOVR.mjs";
+} from "../chunk-6TTICJR4.mjs";
 export {
   RadioGroup,
   RadioGroupKey,

package/dist/components/ScatterChart.mjs

@@ -1,14 +1,14 @@
 import {
   ScatterChart,
   ScatterChart_default
-} from "../chunk-RD2NFAB6.mjs";
-import "../chunk-R2HO74FE.mjs";
-import "../chunk-HLPSHCXO.mjs";
-import "../chunk-2ZUEXCVJ.mjs";
-import "../chunk-G2LB4QCL.mjs";
+} from "../chunk-BGO2ILHM.mjs";
+import "../chunk-PE5OA4YG.mjs";
+import "../chunk-SPFL55TF.mjs";
 import "../chunk-ZWVA7HT3.mjs";
 import "../chunk-W5RZPTFD.mjs";
 import "../chunk-MI6TL3CQ.mjs";
+import "../chunk-HLPSHCXO.mjs";
+import "../chunk-2ZUEXCVJ.mjs";
 export {
   ScatterChart,
   ScatterChart_default as default

package/dist/components/Segmented.d.mts

@@ -1,6 +1,6 @@
 import * as vue from 'vue';
 import { PropType } from 'vue';
-import { SegmentedOption, SegmentedSize } from '@expcat/tigercat-core';
+import { SegmentedOption, ComponentSize } from '@expcat/tigercat-core';
 
 type VueSegmentedProps = InstanceType<typeof Segmented>['$props'];
 declare const Segmented: vue.DefineComponent<vue.ExtractPropTypes<{
@@ -17,7 +17,7 @@ declare const Segmented: vue.DefineComponent<vue.ExtractPropTypes<{
         default: boolean;
     };
     size: {
-        type: PropType<SegmentedSize>;
+        type: PropType<ComponentSize>;
         default: string;
     };
     block: {
@@ -44,7 +44,7 @@ declare const Segmented: vue.DefineComponent<vue.ExtractPropTypes<{
         default: boolean;
     };
     size: {
-        type: PropType<SegmentedSize>;
+        type: PropType<ComponentSize>;
         default: string;
     };
     block: {
@@ -59,7 +59,7 @@ declare const Segmented: vue.DefineComponent<vue.ExtractPropTypes<{
     onChange?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
-    size: SegmentedSize;
+    size: ComponentSize;
     className: string;
     disabled: boolean;
     block: boolean;