@signal24/vue-foundation 4.7.2 → 4.7.4

package/package.json

@@ -1,12 +1,9 @@
 {
     "name": "@signal24/vue-foundation",
     "type": "module",
-    "version": "4.7.2",
+    "version": "4.7.4",
     "description": "Common components, directives, and helpers for Vue 3 apps",
     "module": "./dist/vue-foundation.es.js",
-    "bin": {
-        "vf-generate-openapi-client": "./dist/src/vite-plugins/vite-openapi-plugin.cli.js"
-    },
     "exports": {
         ".": {
             "import": "./dist/vue-foundation.es.js",
@@ -24,7 +21,7 @@
     "typings": "./dist/src/index.d.ts",
     "scripts": {
         "dev": "vite",
-        "build": "rm -rf dist && vite build && vue-tsc --declaration --emitDeclarationOnly -p tsconfig.app.json && tsc -p tsconfig.vite-plugins.json && find dist -name '*.tsbuildinfo' -delete && chmod +x dist/src/vite-plugins/vite-openapi-plugin.cli.js",
+        "build": "rm -rf dist && vite build && vue-tsc --declaration --emitDeclarationOnly -p tsconfig.app.json && tsc -p tsconfig.vite-plugins.json && find dist -name '*.tsbuildinfo' -delete",
         "build:watch": "fswatch -o src | xargs -n1 -I{} yarn build",
         "preview": "vite preview",
         "test:types": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
@@ -46,6 +43,7 @@
     "devDependencies": {
         "@nabla/vite-plugin-eslint": "^1.5.0",
         "@rushstack/eslint-patch": "^1.3.2",
+        "@signal24/openapi-client-codegen": "^1.0.4",
         "@tsconfig/node18": "^18.2.0",
         "@types/jsdom": "^21.1.1",
         "@types/lodash": "^4.14.196",
@@ -63,7 +61,6 @@
         "eslint-plugin-unused-imports": "^3.0.0",
         "eslint-plugin-vue": "^9.16.1",
         "jsdom": "^22.1.0",
-        "openapi-typescript-codegen": "^0.25.0",
         "prettier": "^3.0.0",
         "sass": "^1.64.2",
         "start-server-and-test": "^2.0.0",

package/src/helpers/mask.ts

@@ -50,8 +50,8 @@ const FormMaskState = Symbol('FormMaskState');
 interface IFormMaskState {
     [FormMaskState]?: {
         disabledElements: HTMLElement[];
-        waitButton: HTMLElement;
-        buttonHtml: string;
+        waitButton?: HTMLElement;
+        buttonHtml?: string;
     };
 }
 type FormMaskElement = Element & IFormMaskState;
@@ -62,10 +62,13 @@ export function maskForm(formOrCmp: Element | AnyComponentPublicInstance, button
 
     const buttonEl = (
         buttonSelector instanceof Element ? buttonSelector : form.querySelectorAll(buttonSelector ?? 'button:not([disabled]):not([type="button"])')[0]
-    ) as HTMLElement;
-    const originalButtonHtml = buttonEl.tagName === 'INPUT' ? (buttonEl as HTMLInputElement).value : buttonEl.innerHTML;
-    buttonEl.setAttribute('disabled', 'disabled');
-    buttonEl.innerText = buttonText ?? 'Please wait...';
+    ) as HTMLElement | undefined;
+    let originalButtonHtml: string | undefined;
+    if (buttonEl) {
+        originalButtonHtml = buttonEl.tagName === 'INPUT' ? (buttonEl as HTMLInputElement).value : buttonEl.innerHTML;
+        buttonEl.setAttribute('disabled', 'disabled');
+        buttonEl.innerText = buttonText ?? 'Please wait...';
+    }
 
     const inputsQR = form.querySelectorAll('input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled])');
     const inputs = [...inputsQR] as HTMLElement[];
@@ -89,8 +92,11 @@ export function unmaskForm(formOrCmp: Element | AnyComponentPublicInstance) {
     form.classList.remove('vf-masked');
 
     state.disabledElements.forEach(el => el.removeAttribute('disabled'));
-    state.waitButton.innerHTML = state.buttonHtml;
-    state.waitButton.removeAttribute('disabled');
+
+    if (state.waitButton) {
+        state.waitButton.innerHTML = state.buttonHtml!;
+        state.waitButton.removeAttribute('disabled');
+    }
 
     delete (form as FormMaskElement)[FormMaskState];
 }

package/src/helpers/openapi.ts

@@ -1,130 +1,16 @@
-import { UserError } from './error';
+import { installOpenApiClientInterceptors, isOpenApiError } from '@signal24/openapi-client-codegen/helpers';
 
-interface IRequestOptions {
-    readonly method: 'GET' | 'PUT' | 'POST' | 'DELETE' | 'OPTIONS' | 'HEAD' | 'PATCH';
-    readonly url: string;
-    readonly path?: Record<string, any>;
-    readonly cookies?: Record<string, any>;
-    readonly headers?: Record<string, any>;
-    readonly query?: Record<string, any>;
-    readonly formData?: Record<string, any>;
-    readonly body?: any;
-    readonly mediaType?: string;
-    readonly responseHeader?: string;
-    readonly errors?: Record<number, string>;
-}
-
-interface IBaseHttpRequest {
-    request<T>(options: IRequestOptions): ICancelablePromise<T>;
-}
-
-export interface IApiClient {
-    request: IBaseHttpRequest;
-}
-
-export interface IApiError extends Error {
-    status: number;
-    statusText: string;
-    body: any;
-}
-
-export declare class ICancelablePromise<T = any> {
-    constructor(executor: (resolve: (value: any) => void, reject: (reason: any) => void, onCancel: (cancel: () => void) => void) => void);
-    then<TResult1 = any, TResult2 = never>(
-        onfulfilled?: ((value: T) => TResult1 | PromiseLike<TResult1>) | undefined | null,
-        onrejected?: ((reason: any) => TResult2 | PromiseLike<TResult2>) | undefined | null
-    ): Promise<TResult1 | TResult2>;
-    catch<TResult = never>(onrejected?: ((reason: any) => TResult | PromiseLike<TResult>) | undefined | null): Promise<T | TResult>;
-    finally(onfinally?: (() => void) | undefined | null): Promise<T>;
-    cancel(): void;
-}
-
-interface IWrappedApiClientOptions<P extends ICancelablePromise = ICancelablePromise, Arguments extends unknown[] = any[]> {
-    apiClient: IApiClient;
-    wrapper?: (options: IRequestOptions, fn: (options: IRequestOptions) => P) => P;
-    onRequest?: (options: IRequestOptions) => IRequestOptions;
-    onError?: (err: Error, options: IRequestOptions) => Error | null | void;
-    afterRequest?: (options: IRequestOptions) => void;
-    CancelablePromise: new (...arguments_: Arguments) => P;
-}
+import { UserError } from '.';
 
-export function isApiError(err: any): err is IApiError {
-    return err instanceof Error && 'status' in err && 'body' in err;
-}
-
-export function installApiClientInterceptors({ apiClient, wrapper, onRequest, onError, afterRequest, CancelablePromise }: IWrappedApiClientOptions) {
-    const originalRequest = apiClient.request.request.bind(apiClient.request);
-    const resolvedWrapper = wrapper ?? ((options, fn) => fn(options));
-    apiClient.request.request = (options: IRequestOptions) => {
-        return resolvedWrapper(options, options => {
-            options = rewriteOptionsForFileUpload(options);
-
-            if (onRequest) {
-                options = onRequest(options);
+export function installApiClientInterceptors(clientOptions: Parameters<typeof installOpenApiClientInterceptors>[0]) {
+    installOpenApiClientInterceptors({
+        ...clientOptions,
+        onError(err, options) {
+            if (isOpenApiError(err) && err.status === 422 && typeof err.body === 'object' && 'error' in err.body) {
+                err = new UserError(err.body.error);
             }
 
-            return new CancelablePromise((resolve: (value: any) => void, reject: (err: any) => void, onCancel: (handler: () => void) => void) => {
-                const promise = originalRequest(options);
-                onCancel(promise.cancel);
-                promise
-                    .then(resolve)
-                    .catch(err => {
-                        if (isApiError(err) && typeof err.body === 'object' && 'error' in err.body) {
-                            if (err.status === 422) {
-                                return reject(new UserError(err.body.error));
-                            }
-
-                            err.message = `${err.body.error} (${err.status})`;
-                        }
-                        if (onError) {
-                            const handlerResult = onError(err, options);
-                            if (handlerResult === null) {
-                                return;
-                            }
-                            if (handlerResult instanceof Error) {
-                                return reject(handlerResult);
-                            }
-                        }
-                        reject(err);
-                    })
-                    .finally(() => afterRequest?.(options));
-            });
-        });
-    };
-}
-
-export class FileUploadRequest {
-    constructor(blob: Blob) {
-        this.blob = blob;
-    }
-
-    validator = null;
-    lastModifiedDate = null;
-    size = 0;
-    path = '';
-    name = '';
-    type = '';
-    blob!: Blob;
-}
-
-function rewriteOptionsForFileUpload(options: IRequestOptions): IRequestOptions {
-    const hasFileUpload = typeof options.body === 'object' && Object.values(options.body).some(v => v instanceof FileUploadRequest);
-    if (!hasFileUpload) return options;
-
-    const formData: Record<string, any> = {};
-    const jsonBody: Record<string, any> = {};
-    for (const [key, value] of Object.entries(options.body)) {
-        if (value instanceof FileUploadRequest) {
-            formData[key] = value.blob;
-        } else {
-            jsonBody[key] = value;
+            clientOptions.onError?.(err, options);
         }
-    }
-    formData._payload = new Blob([JSON.stringify(jsonBody)], { type: 'application/json' });
-
-    return {
-        ...options,
-        body: undefined,
-        formData
-    };
+    });
 }

package/src/vite-plugins/vite-openapi-plugin.ts

@@ -1,48 +1,4 @@
-import { createHash } from 'node:crypto';
-import { copyFileSync, existsSync, readFileSync, watch } from 'node:fs';
-import { rm } from 'node:fs/promises';
-
-import * as OpenAPI from 'openapi-typescript-codegen';
-
-const DEFAULT_OUT_PATH = './src/openapi-client-generated';
-
-let generatedHash: string | null = null;
-let generatorMap: Record<string, string> = {};
-let overridesMap: Record<string, string> | null = null;
-let overridesInverseMap: Record<string, string> | null = null;
-
-export function loadOpenapiConfig() {
-    loadGeneratorMap();
-    loadOverridesMap();
-}
-
-function loadGeneratorMap() {
-    if (!existsSync('./openapi-specs.json')) {
-        console.error('openapi-specs.json not found. Cannot generate OpenAPI client.');
-        return;
-    }
-
-    try {
-        const specsContent = readFileSync('./openapi-specs.json', 'utf8');
-        generatorMap = JSON.parse(specsContent);
-    } catch (e) {
-        console.error('Failed to load openapi-specs.json:', e);
-    }
-}
-
-function loadOverridesMap() {
-    if (!existsSync('./openapi-specs.dev.json')) {
-        return;
-    }
-
-    try {
-        const overridesContent = readFileSync('./openapi-specs.dev.json', 'utf8');
-        overridesMap = JSON.parse(overridesContent);
-        overridesInverseMap = Object.fromEntries(Object.entries(overridesMap!).map(([k, v]) => [v, k]));
-    } catch (e) {
-        console.error('Failed to load openapi-specs.dev.json:', e);
-    }
-}
+import { createWatchfulOpenapiClientGenerators } from '@signal24/openapi-client-codegen/generator';
 
 export function openapiClientGeneratorPlugin(): {
     name: string;
@@ -50,7 +6,7 @@ export function openapiClientGeneratorPlugin(): {
     buildStart(): void;
     closeBundle(): void;
 } {
-    let generators: ReturnType<typeof createWatchfulGenerators> | null = null;
+    let generators: ReturnType<typeof createWatchfulOpenapiClientGenerators> | null = null;
 
     return {
         name: 'openapi-types-generator',
@@ -59,7 +15,7 @@ export function openapiClientGeneratorPlugin(): {
         buildStart() {
             // apply a slight delay so any output doesn't get pushed off screen
             setTimeout(() => {
-                generators = createWatchfulGenerators();
+                generators = createWatchfulOpenapiClientGenerators();
             }, 250);
         },
 
@@ -72,74 +28,3 @@ export function openapiClientGeneratorPlugin(): {
         }
     };
 }
-
-function createWatchfulGenerators() {
-    loadOpenapiConfig();
-    return Object.entries(generatorMap).map(([openapiYamlPath, outPath]) => createWatchfulGenerator(openapiYamlPath, outPath));
-}
-
-function createWatchfulGenerator(openapiYamlPath: string, outPath: string) {
-    const resolvedPath = overridesMap?.[openapiYamlPath] ?? openapiYamlPath;
-
-    if (!existsSync(resolvedPath)) {
-        console.log(`OpenAPI YAML file not found: ${resolvedPath}`);
-        return null;
-    }
-
-    const watcher = watch(resolvedPath);
-    watcher.on('change', () => {
-        // give the writes a moment to settle
-        setTimeout(() => generateOpenapiClient(resolvedPath, outPath), 100);
-    });
-
-    generateOpenapiClient(resolvedPath, outPath);
-
-    return {
-        close() {
-            watcher.close();
-        }
-    };
-}
-
-export async function generateConfiguredOpenapiClients() {
-    loadOpenapiConfig();
-    for (const [openapiYamlPath, outPath] of Object.entries(generatorMap)) {
-        const resolvedPath = overridesMap?.[openapiYamlPath] ?? openapiYamlPath;
-        await generateOpenapiClient(resolvedPath, outPath);
-    }
-}
-
-export async function generateOpenapiClient(openapiYamlPath: string, outPath: string = DEFAULT_OUT_PATH) {
-    const yaml = readFileSync(openapiYamlPath, 'utf8');
-    const hash = createHash('sha256').update(yaml).digest('hex');
-
-    if (hash === generatedHash) {
-        return;
-    }
-
-    generatedHash = hash;
-
-    try {
-        try {
-            await rm(outPath, { recursive: true });
-        } catch (e) {
-            // ignore
-        }
-
-        await OpenAPI.generate({
-            input: openapiYamlPath,
-            output: outPath,
-            clientName: 'ApiClient',
-            useOptions: true,
-            useUnionTypes: true
-        });
-
-        if (overridesInverseMap?.[openapiYamlPath]) {
-            copyFileSync(openapiYamlPath, overridesInverseMap[openapiYamlPath]);
-        }
-
-        console.log(`[${new Date().toISOString()}] Generated client from ${openapiYamlPath} to ${outPath}/`);
-    } catch (err) {
-        console.error(`[${new Date().toISOString()}] Error generating client from ${openapiYamlPath}:`, err);
-    }
-}

package/dist/src/vite-plugins/vite-openapi-plugin.cli.d.ts

@@ -1,2 +0,0 @@
-#!/usr/bin/env node
-export {};

package/dist/src/vite-plugins/vite-openapi-plugin.cli.js

@@ -1,15 +0,0 @@
-#!/usr/bin/env node
-import { existsSync } from 'fs';
-import { generateConfiguredOpenapiClients, generateOpenapiClient } from './vite-openapi-plugin.js';
-if (process.argv[2]) {
-    if (process.argv[2] === '--help') {
-        throw new Error('Usage: vf-generate-openapi-client [<openapi-yaml-path> [<openapi-output-path>]]');
-    }
-    if (!existsSync(process.argv[2])) {
-        throw new Error(`OpenAPI YAML file not found: ${process.argv[2]}`);
-    }
-    await generateOpenapiClient(process.argv[2], process.argv[3]);
-}
-else {
-    generateConfiguredOpenapiClients();
-}

package/src/vite-plugins/vite-openapi-plugin.cli.ts

@@ -1,19 +0,0 @@
-#!/usr/bin/env node
-
-import { existsSync } from 'fs';
-
-import { generateConfiguredOpenapiClients, generateOpenapiClient } from './vite-openapi-plugin.js';
-
-if (process.argv[2]) {
-    if (process.argv[2] === '--help') {
-        throw new Error('Usage: vf-generate-openapi-client [<openapi-yaml-path> [<openapi-output-path>]]');
-    }
-
-    if (!existsSync(process.argv[2])) {
-        throw new Error(`OpenAPI YAML file not found: ${process.argv[2]}`);
-    }
-
-    await generateOpenapiClient(process.argv[2], process.argv[3]);
-} else {
-    generateConfiguredOpenapiClients();
-}