@signal24/vue-foundation 4.30.5 → 4.30.8

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@signal24/vue-foundation",
     "type": "module",
-    "version": "4.30.5",
+    "version": "4.30.8",
     "description": "Common components, directives, and helpers for Vue 3 apps",
     "module": "./dist/vue-foundation.es.js",
     "exports": {
@@ -31,6 +31,9 @@
         "format": "prettier --write ."
     },
     "license": "MIT",
+    "repository": {
+        "url": "https://github.com/signal24/vue-foundation"
+    },
     "dependencies": {
         "currency.js": "^2.0.4",
         "mark.js": "^8.11.1",
@@ -43,37 +46,37 @@
         "vue": "^3.4.0"
     },
     "devDependencies": {
-        "@eslint/js": "9.39.1",
+        "@eslint/js": "9.39.2",
         "@nabla/vite-plugin-eslint": "^2.0.6",
         "@signal24/openapi-client-codegen": "^2.6.2",
-        "@tsconfig/node22": "^22.0.2",
+        "@tsconfig/node22": "^22.0.5",
         "@types/jsdom": "^27.0.0",
-        "@types/lodash": "^4.17.20",
+        "@types/lodash": "^4.17.21",
         "@types/mark.js": "^8",
-        "@types/node": "^24.10.0",
+        "@types/node": "^25.0.3",
         "@types/uuid": "^11.0.0",
-        "@vitejs/plugin-vue": "^6.0.1",
+        "@vitejs/plugin-vue": "^6.0.3",
         "@vue/eslint-config-prettier": "^10.2.0",
         "@vue/eslint-config-typescript": "^14.6.0",
         "@vue/test-utils": "^2.4.6",
         "@vue/tsconfig": "^0.8.1",
         "date-fns": "^4.1.0",
-        "eslint": "9.39.1",
+        "eslint": "9.39.2",
         "eslint-plugin-simple-import-sort": "^12.1.1",
         "eslint-plugin-unused-imports": "^4.3.0",
-        "eslint-plugin-vue": "^10.5.1",
-        "jsdom": "^27.1.0",
+        "eslint-plugin-vue": "^10.6.2",
+        "jsdom": "^27.4.0",
         "lodash": "^4.17.21",
-        "prettier": "^3.6.2",
-        "sass": "^1.93.3",
-        "start-server-and-test": "^2.1.2",
-        "type-fest": "^5.2.0",
+        "prettier": "^3.7.4",
+        "sass": "^1.97.2",
+        "start-server-and-test": "^2.1.3",
+        "type-fest": "^5.3.1",
         "typescript": "~5.9",
-        "typescript-eslint": "^8.46.3",
-        "vite": "^7.2.1",
-        "vitest": "^4.0.7",
-        "vue": "^3.5.23",
-        "vue-tsc": "^3.1.3"
+        "typescript-eslint": "^8.52.0",
+        "vite": "^7.3.1",
+        "vitest": "^4.0.16",
+        "vue": "^3.5.26",
+        "vue-tsc": "^3.2.2"
     },
     "packageManager": "yarn@4.9.2"
 }

package/src/components/overlay-container.ts

@@ -1,14 +1,12 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import type { Writable } from 'type-fest';
 import {
     type AllowedComponentProps,
+    type Component,
+    type ComponentCustomProps,
     type ComponentInternalInstance,
-    type ComponentPublicInstance,
-    type ComputedOptions,
     defineComponent,
     h,
     markRaw,
-    type MethodOptions,
     type Raw,
     reactive,
     renderList,
@@ -23,23 +21,23 @@ import { VfOptions } from '@/config';
 import OverlayAnchor from './overlay-anchor.vue';
 import type { OverlayAnchorOptions } from './overlay-types';
 
-interface OverlayOptions<C extends OverlayComponent, R extends ComponentReturn<C>> {
+interface OverlayOptions<C extends Component, R extends ComponentReturn<C>> {
     anchor?: OverlayAnchorOptions;
     onCallback?: (result: R) => void | Promise<boolean>;
 }
 
-export interface OverlayInjection<C extends OverlayComponent, R extends ComponentReturn<C>> {
+export interface OverlayInjection<C extends Component> {
     id: string;
-    component: OverlayComponentUnwrapped<C>;
-    props: OverlayComponentProps<C>;
-    options: OverlayOptions<C, R>;
+    component: Raw<C>;
+    props: { callback?: () => void } & OverlayComponentProps<C>;
+    options: OverlayOptions<C, any>;
     vnode: VNode;
     wrapperVnode?: VNode;
 }
 
 let overlayCount = 0;
 
-const OverlayInjections: OverlayInjection<any, any>[] = reactive([]);
+const OverlayInjections: OverlayInjection<any>[] = reactive([]);
 watch(OverlayInjections, () => {
     VfOptions.onOverlaysChanged?.(OverlayInjections.length);
 });
@@ -55,57 +53,47 @@ export const OverlayContainer = defineComponent({
     }
 });
 
-// copied in from Vue since it's not exported
-// tood: it may be a lot easier than this. see the docs for props passed to "h"
-export type Vue__ComponentPublicInstanceConstructor<
-    T extends ComponentPublicInstance<Props, RawBindings, D, C, M> = ComponentPublicInstance<any>,
-    Props = any,
-    RawBindings = any,
-    D = any,
-    C extends ComputedOptions = ComputedOptions,
-    M extends MethodOptions = MethodOptions
-> = {
-    __isFragment?: never;
-    __isTeleport?: never;
-    __isSuspense?: never;
-    new (...args: any[]): T;
+export type AnyComponentPublicInstance = { $?: ComponentInternalInstance };
+
+// Handle both regular and generic components
+type ExtractComponentProps<C> = C extends new (...args: any) => any
+    ? InstanceType<C>['$props']
+    : C extends (props: infer P, ...args: any) => any
+      ? P
+      : C extends { __props?: infer P }
+        ? P
+        : never;
+
+// Remove Vue's internal prop types and the Record<string, unknown> index signature
+type CleanProps<P> = {
+    [K in keyof P as K extends keyof (VNodeProps & AllowedComponentProps & ComponentCustomProps) ? never : string extends K ? never : K]: P[K];
 };
 
-export type ObjectComponentConfig<T extends Vue__ComponentPublicInstanceConstructor> =
-    T extends Vue__ComponentPublicInstanceConstructor<infer P> ? P : never;
-export type ObjectComponentProps<T extends Vue__ComponentPublicInstanceConstructor> = Writable<
-    Omit<ObjectComponentConfig<T>['$props'], keyof VNodeProps | keyof AllowedComponentProps>
->;
-
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-type ObjectOrDefault<T> = T extends object ? T : PropsWithCallback<{}>;
-export type OverlayComponent = Vue__ComponentPublicInstanceConstructor | ((props: any) => any);
-export type OverlayComponentConfig<T> = T extends Vue__ComponentPublicInstanceConstructor
-    ? {
-          props: ObjectComponentProps<T>;
-          component: Raw<T>;
-      }
-    : T extends (props: infer P) => any
-      ? {
-            props: Omit<ObjectOrDefault<P>, keyof VNodeProps | keyof AllowedComponentProps>;
-            component: T;
-        }
-      : never;
-export type OverlayComponentUnwrapped<T extends OverlayComponent> = OverlayComponentConfig<T>['component'];
-export type OverlayComponentProps<T extends OverlayComponent> = OverlayComponentConfig<T>['props'];
-
-interface PropsWithCallback<T> {
-    callback?: (result: T) => void;
-}
-type ComponentReturn<M extends OverlayComponent> = OverlayComponentProps<M> extends PropsWithCallback<infer R> ? R : never;
+// Check if component has a callback prop with correct signature
+type HasCallbackProp<C> =
+    CleanProps<ExtractComponentProps<C>> extends {
+        callback: (result: any) => void;
+    }
+        ? true
+        : false;
 
-export type AnyComponentPublicInstance = { $?: ComponentInternalInstance };
+// Constraint type - resolves to C if valid, never if not
+type OverlayComponent<C extends Component> = HasCallbackProp<C> extends true ? C : never;
+
+type ComponentReturn<C> =
+    CleanProps<ExtractComponentProps<C>> extends {
+        callback: (result: infer R) => void;
+    }
+        ? R
+        : never;
+
+type OverlayComponentProps<C> = CleanProps<ExtractComponentProps<C>>;
 
-export function createOverlayInjection<C extends OverlayComponent, R extends ComponentReturn<C>>(
-    component: C,
+export function createOverlayInjection<C extends Component, R extends ComponentReturn<C>>(
+    component: OverlayComponent<C>,
     props: OverlayComponentProps<C>,
     options?: OverlayOptions<C, R>
-): OverlayInjection<C, R> {
+): OverlayInjection<C> {
     // create or reconfigure the existing overlay target
     // re-injecting every time keeps the overlay container at the very end of the DOM
     const targetEl = document.getElementById('vf-overlay-target') ?? document.createElement('div');
@@ -119,9 +107,9 @@ export function createOverlayInjection<C extends OverlayComponent, R extends Com
     const wrapperVnode = options?.anchor ? h(OverlayAnchor, { overlayId, anchor: options.anchor }, () => [vnode]) : undefined;
 
     // todo: dunno what's going on with types here
-    const injection: OverlayInjection<C, R> = {
+    const injection: OverlayInjection<C> = {
         id: overlayId,
-        component: rawComponent as any,
+        component: rawComponent,
         props,
         options: options ?? {},
         vnode,
@@ -148,7 +136,7 @@ export function dismissOverlayInjectionByInternalInstance(instance: ComponentInt
 export function dismissOverlayInjectionByVnode(vnode: VNode) {
     const injectionIdx = OverlayInjections.findIndex(i => i.vnode.component === vnode.component);
     if (injectionIdx >= 0) {
-        OverlayInjections[injectionIdx]!.props.callback();
+        OverlayInjections[injectionIdx]!.props.callback?.();
         return true;
     }
     return false;
@@ -157,26 +145,26 @@ export function dismissOverlayInjectionByVnode(vnode: VNode) {
 export function dismissOverlayInjectionById(id: string) {
     const injectionIdx = OverlayInjections.findIndex(i => i.id === id);
     if (injectionIdx >= 0) {
-        OverlayInjections[injectionIdx]!.props.callback();
+        OverlayInjections[injectionIdx]!.props.callback?.();
         return true;
     }
     return false;
 }
 
-export function removeOverlayInjection(injection: OverlayInjection<any, any>) {
+export function removeOverlayInjection(injection: OverlayInjection<any>) {
     const index = OverlayInjections.indexOf(injection);
     if (index >= 0) {
         OverlayInjections.splice(index, 1);
     }
 }
 
-export async function presentOverlay<C extends OverlayComponent, R extends ComponentReturn<C>>(
-    component: C,
+export async function presentOverlay<C extends Component, R extends ComponentReturn<C>>(
+    component: OverlayComponent<C>,
     props: Omit<OverlayComponentProps<C>, 'callback'>,
     options?: OverlayOptions<C, R>
 ): Promise<R | undefined> {
     return new Promise<R>(resolve => {
-        let overlayInjection: OverlayInjection<C, R> | null = null;
+        let overlayInjection: OverlayInjection<C> | null = null;
         const callback = async (result: R) => {
             if (options?.onCallback) {
                 const hookResult = options.onCallback(result);
@@ -197,12 +185,12 @@ export async function presentOverlay<C extends OverlayComponent, R extends Compo
     });
 }
 
-export async function updateOverlayProps<C extends OverlayComponent>(
-    injection: OverlayInjection<C, any>,
+export async function updateOverlayProps<C extends Component>(
+    injection: OverlayInjection<C>,
     props: Partial<Omit<OverlayComponentProps<C>, 'callback'>>
 ) {
     const targetProps = injection.vnode.component!.props;
     for (const key in props) {
-        targetProps[key] = props[key];
+        targetProps[key] = (props as any)[key];
     }
 }

package/src/components/toast-helpers.ts

@@ -2,7 +2,7 @@ import { createOverlayInjection, type OverlayInjection, removeOverlayInjection }
 import Toast, { type IToastOptions } from './vf-toast.vue';
 
 export function showToast(options: IToastOptions) {
-    const injection: OverlayInjection<typeof Toast, unknown> = createOverlayInjection(Toast, {
+    const injection: OverlayInjection<typeof Toast> = createOverlayInjection(Toast, {
         ...options,
         callback: () => removeOverlayInjection(injection)
     });

package/src/helpers/object.ts

@@ -1,4 +1,4 @@
-import { cloneDeep } from 'lodash';
+import { cloneDeep, isEqual, isMatch } from 'lodash';
 
 export function cloneProp<T>(prop: T | undefined | null, fallback: T): T {
     if (prop !== undefined && prop !== null) {
@@ -22,3 +22,66 @@ export function nullifyEmptyInputs<T extends Record<string, unknown>, K extends
 export function isNotNullOrUndefined<T>(value: T | null | undefined): value is T {
     return value !== null && value !== undefined;
 }
+
+export function objectKeys<T extends object>(object: T): (keyof T)[] {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    return Object.keys(object) as any[];
+}
+
+export function objectAssign<T extends object>(object: T, ...values: Partial<T>[]): T {
+    return Object.assign(object, ...values);
+}
+
+type Entries<T> = {
+    [K in keyof T]: [K, T[K]];
+}[keyof T][];
+export function objectEntries<T extends object>(object: T): Entries<T> {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    return Object.entries(object) as any;
+}
+
+export function extractValues<T extends object, K extends readonly (keyof T)[]>(state: T, fields: K): Pick<T, K[number]> {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const result: Pick<T, K[number]> = {} as any;
+    for (const key of fields) {
+        if (state[key] !== undefined) {
+            result[key] = state[key];
+        }
+    }
+    return result;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function doesMatch(original: any, updated: any, method?: 'equals' | 'matches'): boolean {
+    if (method === 'matches' && typeof original === 'object' && typeof updated === 'object') {
+        return isMatch(original, updated);
+    }
+    return isEqual(original, updated);
+}
+
+export function extractUpdates<T extends object>(state: T, updates: Partial<T>, fields?: Array<keyof T>, method?: 'equals' | 'matches'): Partial<T> {
+    const result: Partial<T> = {};
+    const updateFields = fields ?? objectKeys(updates);
+    for (const key of updateFields) {
+        if (updates[key] !== undefined && !doesMatch(state[key], updates[key], method)) {
+            result[key] = updates[key];
+        }
+    }
+    return result;
+}
+
+export function patchObject<T extends object>(state: T, updates: Partial<T>, fields?: Array<keyof T>, method?: 'equals' | 'matches'): T {
+    const effectiveUpdates = extractUpdates(state, updates, fields, method);
+    objectAssign(state, effectiveUpdates);
+    return state;
+}
+
+export function extractKV<T, K extends keyof T, V extends keyof T>(arr: T[], keyCol: K, valCol: V) {
+    return arr.reduce(
+        (acc, cur) => {
+            acc[cur[keyCol] as string] = cur[valCol];
+            return acc;
+        },
+        {} as Record<string, T[V]>
+    );
+}