@evixcard/evx-ui-kit 1.11.1 → 1.11.3

package/dist/components/EvPopup/EvPopup.vue.d.ts

@@ -1,27 +1,46 @@
-export type EvPopupSize = 'sm' | 'md';
+export type EvPopupSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl';
 /** Per-element class overrides, merged over the defaults via `twMerge`. */
 export interface EvPopupClasses {
     backdrop?: string;
     panel?: string;
     header?: string;
     title?: string;
+    /** Overrides for the top-right close button. */
+    closeButton?: string;
+    /** Overrides for the close icon inside the top-right button. */
+    closeIcon?: string;
     /** Overrides for the scrollable body region (the default slot wrapper). */
     body?: string;
+    /** Overrides for the fixed footer region (only rendered when the `#footer` slot is used). */
+    footer?: string;
 }
 export interface EvPopupProps {
     isOpen: boolean;
     title?: string;
     /**
-     * Panel size preset.
-     * - `md` (default): wider panel (`max-w-[500px]`, `rounded-lg`) with a large
-     *   title (`text-[24px] font-bold`) — used for generic informational dialogs.
-     * - `sm`: compact panel (`max-w-sm`, `rounded-2xl`) with a smaller, near-black
-     *   title (`text-lg font-semibold text-foreground`) — designed for confirmation
-     *   modals and other action-focused flows.
+     * Panel size preset (max-width). `sm`/`md` are the compact defaults; `lg`/`xl`/`2xl`
+     * are wider presets (DEV-788, for richer forms migrated off the retired EvModal).
+     * - `sm`: `max-w-sm`, `rounded-2xl`.
+     * - `md` (default): `max-w-[500px]`, `rounded-lg`.
+     * - `lg`: `max-w-2xl`. `xl`: `max-w-4xl`. `2xl`: `max-w-2xl`.
      */
     size?: EvPopupSize;
     /** When `false`, the top-right close (X) button is hidden. Default: `true`. */
     showCloseButton?: boolean;
+    /**
+     * When `false`, Escape and backdrop-click no longer request close (only a
+     * programmatic `isOpen` change or an explicit action closes the modal) — for
+     * confirm/blocking dialogs. Default: `true`.
+     */
+    dismissable?: boolean;
+    /**
+     * Where to move focus when the popup opens.
+     * - `first` (default): let HeadlessUI focus the first focusable element.
+     * - `none`: focus the panel itself without auto-focusing a control.
+     * - any other string: query that CSS selector inside the panel and focus the
+     *   match; fall back to `first` when nothing matches.
+     */
+    initialFocus?: 'first' | 'none' | string;
     /**
      * Backdrop style. When `true` (default), the backdrop dims and blurs the page
      * behind it (`bg-black/40 backdrop-blur-sm`). Set `false` to dim only
@@ -35,8 +54,50 @@ declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
         default?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {
+        dialogPanelRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+            as: {
+                type: (ObjectConstructor | StringConstructor)[];
+                default: string;
+            };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
+        }>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+            [key: string]: any;
+        }> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+            [key: string]: any;
+        }>[] | null, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, {
+            id: string;
+            as: string | Record<string, any>;
+        }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('vue').ExtractPropTypes<{
+            as: {
+                type: (ObjectConstructor | StringConstructor)[];
+                default: string;
+            };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
+        }>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+            [key: string]: any;
+        }> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+            [key: string]: any;
+        }>[] | null, {}, {}, {}, {
+            id: string;
+            as: string | Record<string, any>;
+        }> | null;
     };
-    refs: {};
     rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
@@ -48,7 +109,50 @@ declare const __VLS_component: import('vue').DefineComponent<EvPopupProps, {}, {
     size: EvPopupSize;
     blur: boolean;
     showCloseButton: boolean;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+    dismissable: boolean;
+    initialFocus: "first" | "none" | string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    dialogPanelRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+    }>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }>[] | null, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, {
+        id: string;
+        as: string | Record<string, any>;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+    }>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }>[] | null, {}, {}, {}, {
+        id: string;
+        as: string | Record<string, any>;
+    }> | null;
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/EvPopup/index.d.ts

@@ -1,2 +1,2 @@
 export { default as EvPopup } from './EvPopup.vue';
-export type { EvPopupProps, EvPopupSize } from './EvPopup.vue';
+export type { EvPopupProps, EvPopupSize, EvPopupClasses } from './EvPopup.vue';

package/dist/components/EvToast/EvToast.vue.d.ts

@@ -1,8 +1,21 @@
-import { EvToastVariant } from './types';
+import { EvToastAppearance, EvToastVariant } from './types';
 export interface EvToastProps {
     variant?: EvToastVariant;
     title?: string;
     description?: string;
+    /**
+     * Card look. `default` = compact card with a leading status icon (admin style);
+     * `plain` = larger, icon-less card with a display-size title (customer style).
+     */
+    appearance?: EvToastAppearance;
+    /**
+     * Force the leading status icon on/off. Defaults to on for `default` and off for
+     * `plain`. Set `true` on a `plain` toast to keep the white card but add a colored
+     * status icon (e.g. a red icon for errors).
+     */
+    icon?: boolean;
+    /** Show a spinner in place of the status icon (even in `plain`). */
+    loading?: boolean;
     class?: string;
 }
 declare function __VLS_template(): {
@@ -21,6 +34,8 @@ declare const __VLS_component: import('vue').DefineComponent<EvToastProps, {}, {
     onDismiss?: (() => any) | undefined;
 }>, {
     variant: EvToastVariant;
+    icon: boolean;
+    appearance: EvToastAppearance;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/EvToast/EvToastContainer.vue.d.ts

@@ -1,2 +1,12 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+import { EvToastAppearance, EvToastPlacement } from './types';
+export interface EvToastContainerProps {
+    /** Where the stack is anchored. Default `bottom-right` (admin). */
+    placement?: EvToastPlacement;
+    /** Card look applied to every toast in the stack. Default `default` (admin). */
+    appearance?: EvToastAppearance;
+}
+declare const _default: import('vue').DefineComponent<EvToastContainerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<EvToastContainerProps> & Readonly<{}>, {
+    appearance: EvToastAppearance;
+    placement: EvToastPlacement;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/components/EvToast/index.d.ts

@@ -2,6 +2,7 @@ export { default } from './EvToast.vue';
 export { default as EvToast } from './EvToast.vue';
 export type { EvToastProps } from './EvToast.vue';
 export { default as EvToastContainer } from './EvToastContainer.vue';
+export type { EvToastContainerProps } from './EvToastContainer.vue';
 export { useToast } from './useToast';
 export type { UseToastReturn } from './useToast';
-export type { EvToastVariant, EvToastOptions, EvToastItem } from './types';
+export type { EvToastVariant, EvToastAppearance, EvToastPlacement, EvToastOptions, EvToastItem, } from './types';

package/dist/components/EvToast/types.d.ts

@@ -1,4 +1,11 @@
 export type EvToastVariant = 'info' | 'success' | 'warning' | 'error';
+/**
+ * Card look. `default` = compact card with a leading status icon (admin style);
+ * `plain` = larger, icon-less card with a display-size title (customer style).
+ */
+export type EvToastAppearance = 'default' | 'plain';
+/** Where the toast stack is anchored on screen. */
+export type EvToastPlacement = 'bottom-right' | 'top-center';
 export interface EvToastOptions {
     /** Optional bold title line. */
     title?: string;
@@ -8,9 +15,48 @@ export interface EvToastOptions {
     variant?: EvToastVariant;
     /** Auto-dismiss delay in ms. `0` (or negative) disables auto-dismiss. Default `4000`. */
     duration?: number;
+    /**
+     * Force the leading status icon on/off. Defaults to `true` for the `default`
+     * appearance and `false` for `plain`. Set `true` on a `plain` toast to keep the
+     * white card but add a colored status icon (e.g. a red icon for errors).
+     */
+    icon?: boolean;
+    /**
+     * Show a spinner in place of the status icon (even in `plain`) and keep the
+     * toast sticky — auto-dismiss is disabled until it is `update()`d or dismissed.
+     * Default `false`.
+     */
+    loading?: boolean;
 }
 export interface EvToastItem extends Required<Pick<EvToastOptions, 'variant' | 'duration'>> {
     id: number;
     title?: string;
     description?: string;
+    icon?: boolean;
+    loading?: boolean;
+}
+/**
+ * Content for one state of a promise-toast: a plain title string, a
+ * `{ title, description }` object, or a function of the resolved value / error
+ * returning either.
+ */
+export type EvToastContent<T = unknown> = string | {
+    title?: string;
+    description?: string;
+} | ((arg: T) => string | {
+    title?: string;
+    description?: string;
+});
+export interface EvToastPromiseOptions<T = unknown> {
+    /** Shown immediately with a spinner while the promise is pending. */
+    loading: string | {
+        title?: string;
+        description?: string;
+    };
+    /** Shown when the promise resolves. Receives the resolved value. */
+    success: EvToastContent<T>;
+    /** Shown when the promise rejects. Receives the thrown error. */
+    error: EvToastContent<unknown>;
+    /** Auto-dismiss delay (ms) for the resolved success/error toast. Default `4000`. */
+    duration?: number;
 }

package/dist/components/EvToast/useToast.d.ts

@@ -1,10 +1,12 @@
 import { DeepReadonly, Ref } from 'vue';
-import { EvToastItem, EvToastOptions } from './types';
+import { EvToastItem, EvToastOptions, EvToastPromiseOptions } from './types';
 export interface UseToastReturn {
     /** Reactive, read-only list of currently visible toasts. */
     items: DeepReadonly<Ref<EvToastItem[]>>;
     /** Push a toast; returns its id. */
     push: (toast?: EvToastOptions) => number;
+    /** Merge a patch into an existing toast (re-arms auto-dismiss if `duration` is set). */
+    update: (id: number, patch?: Partial<EvToastOptions>) => void;
     /** Dismiss a toast by id. */
     dismiss: (id: number) => void;
     /** Dismiss every toast. */
@@ -13,5 +15,9 @@ export interface UseToastReturn {
     showSuccess: (titleOrOptions?: string | EvToastOptions, description?: string, options?: EvToastOptions) => number;
     showWarning: (titleOrOptions?: string | EvToastOptions, description?: string, options?: EvToastOptions) => number;
     showError: (titleOrOptions?: string | EvToastOptions, description?: string, options?: EvToastOptions) => number;
+    /** Push a sticky loading toast (spinner, no auto-dismiss); returns its id. */
+    showLoading: (titleOrOptions?: string | EvToastOptions, description?: string, options?: EvToastOptions) => number;
+    /** Bind a promise to a loading toast that resolves in place to success/error. */
+    promise: <T>(promise: Promise<T>, options: EvToastPromiseOptions<T>) => Promise<T>;
 }
 export declare function useToast(): UseToastReturn;