axitech-widget 0.0.2

package/dist/types/composables/googleMaps.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="google.maps" />
+import { Ref } from 'vue';
+import { ILocationInfo } from 'src/utils/map';
+export declare function useGoogleMaps(componentOrSelector: string | Ref<HTMLElement | undefined> | HTMLElement, onPlaceChanged?: (place: ILocationInfo) => void): {
+    map: Ref<google.maps.Map | undefined>;
+    marker: Ref<google.maps.Marker | undefined>;
+    load: (opts: google.maps.MapOptions) => Promise<void>;
+    loadPreview: (opts: google.maps.MapOptions) => Promise<void>;
+    getLocation: () => Promise<ILocationInfo>;
+    placeChanged: (place: ILocationInfo) => void;
+};

package/dist/types/constants/index.d.ts

@@ -0,0 +1 @@
+export declare const CLAIMS_WIDGET_ID = "axitech-claims-widget";

package/dist/types/index.d.ts

@@ -0,0 +1,34 @@
+import { App } from 'vue';
+import { Theme } from './utils/themeUtils';
+declare const WidgetTypes: {
+    readonly claim: "claim";
+};
+export type WidgetType = keyof typeof WidgetTypes;
+export type IWidgetOptions = {
+    clientId: string;
+    type?: WidgetType;
+    user: {
+        id: string;
+        name: string;
+        email: string;
+        phone: string;
+    };
+    insurance: {
+        provider: string;
+        policyNumber: string;
+    };
+    theme?: Theme;
+};
+/** Load widget as vue component to have more control over it */
+export declare function install(app: App, options: IWidgetOptions & {
+    apiKey: string;
+}): void;
+/**
+ * load will use the apikey and load the client configuration any options you provide here will overwrite the config provided on the admin interface
+ * @param options
+ */
+export declare function load(apiKey: string, options: IWidgetOptions): Promise<void>;
+/** Constants of the widget */
+export * from './constants';
+/** Use applyTheme to apply theme changes at runtime if you have not had the chance to change them at initialisation */
+export declare const applyConfig: typeof import("./utils/config").applyPublicConfig;

package/dist/types/plugins/firebase.d.ts

@@ -0,0 +1,2 @@
+export declare const app: import("@firebase/app").FirebaseApp;
+export declare const storage: import("@firebase/storage").FirebaseStorage;

package/dist/types/plugins/firebaseCloudStorage.d.ts

@@ -0,0 +1,16 @@
+import { BasePlugin, PluginOptions } from '@uppy/core';
+import Uppy from '@uppy/core';
+interface StorageOptions extends PluginOptions {
+    basePath?: string;
+}
+export default class FirebaseCloudStorage extends BasePlugin<StorageOptions> {
+    title: string;
+    type: string;
+    id: string;
+    basePath: string;
+    constructor(uppy: Uppy, opts?: StorageOptions);
+    uploadFiles(fileIds: string[]): Promise<void>;
+    install(): void;
+    uninstall(): void;
+}
+export {};

package/dist/types/utils/autocomplete.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from './themeUtils';
+export declare function loadAutocompleteStyle(theme: Theme): Promise<void>;

package/dist/types/utils/colorHelpers.d.ts

@@ -0,0 +1,7 @@
+interface Palette {
+    [key: number]: string;
+}
+export declare const defaultShades: Palette;
+export declare function generateShades(baseColor: string): Palette;
+export declare function setColorShades(cssProperty?: string, color?: string): void;
+export {};

package/dist/types/utils/config.d.ts

@@ -0,0 +1,131 @@
+import { IApiPath } from './request';
+import type { InjectionKey } from 'vue';
+import { Theme } from './themeUtils';
+import { ILocationInfo } from './map';
+export declare const getBaseUrl: (path: IApiPath) => string;
+export type WidgetConfig = {
+    user: UserConfig;
+    insurance: InsuranceConfig;
+    theme: Theme;
+    displayName: string;
+    contact: ContactConfig;
+};
+export type UserConfig = {
+    id: string;
+    name: string;
+    email: string;
+    phone: string;
+};
+export type ContactConfig = {
+    phone: string;
+    email: string;
+};
+export type InsuranceConfig = {
+    provider: string;
+    policyNumber: string;
+};
+export type CollisionSubmission = {
+    notificationTime: string;
+    date: string;
+    location: ILocationInfo | undefined;
+    vehicleImages: string[];
+    additionalImages: string[];
+    note: string;
+    vehicleRoadWorthy: boolean;
+    driver: boolean;
+    injured: boolean;
+    thirdPartiesInvolved: boolean;
+    witnessesPresent: boolean;
+    user: {
+        id: string;
+        name: string;
+        email: string;
+        phone: string;
+    };
+    insurance: {
+        provider: string;
+        policyNumber: string;
+    };
+    incidentType: string;
+};
+declare const defaultConfig: {
+    clientId: string;
+    user: {
+        id: string;
+        name: string;
+        email: string;
+        phone: string;
+    };
+    apiKey: string;
+    insurance: {
+        provider: string;
+        policyNumber: string;
+    };
+    theme: {
+        primary: string;
+        secondary: string;
+        positive: string;
+        negative: string;
+        fontPrimary: string;
+        fontSecondary: string;
+    };
+    contact: {
+        phone: string;
+        email: string;
+    };
+    isConfigLoading: boolean;
+    error: string;
+    name: string;
+    allowedDomains: string[];
+    correspondenceEmail: string[];
+    rootKey: InjectionKey<string>;
+    id: string;
+    onSubmit: (type: '', body: CollisionSubmission) => void;
+};
+export declare const config: import("vue").Ref<{
+    clientId: string;
+    user: {
+        id: string;
+        name: string;
+        email: string;
+        phone: string;
+    };
+    apiKey: string;
+    insurance: {
+        provider: string;
+        policyNumber: string;
+    };
+    theme: {
+        primary: string;
+        secondary: string;
+        positive: string;
+        negative: string;
+        fontPrimary: string;
+        fontSecondary: string;
+    };
+    contact: {
+        phone: string;
+        email: string;
+    };
+    isConfigLoading: boolean;
+    error: string;
+    name: string;
+    allowedDomains: string[];
+    correspondenceEmail: string[];
+    rootKey: {
+        toString: () => string;
+        valueOf: () => symbol;
+        readonly description: string | undefined;
+        [Symbol.toPrimitive]: (hint: string) => symbol;
+        readonly [Symbol.toStringTag]: string;
+    };
+    id: string;
+    onSubmit: (type: '', body: CollisionSubmission) => void;
+}>;
+export declare function onConfigChange(callback: (config: typeof defaultConfig) => void): () => void;
+export declare function applyConfig(newConfig: Partial<typeof defaultConfig>): void;
+type RecursivePartial<T> = {
+    [P in keyof T]?: T[P] extends (infer U)[] ? RecursivePartial<U>[] : T[P] extends object | undefined ? RecursivePartial<T[P]> : T[P];
+};
+export declare function applyPublicConfig(newConfig: RecursivePartial<WidgetConfig>): void;
+export {};

package/dist/types/utils/customElementRegister.d.ts

@@ -0,0 +1 @@
+export declare const defineCustomElement: (component: any) => import("vue").VueElementConstructor<{}>;

package/dist/types/utils/fontUtils.d.ts

@@ -0,0 +1 @@
+export declare function loadFonts(): void;

package/dist/types/utils/index.d.ts

@@ -0,0 +1,141 @@
+import * as themeUtils from './themeUtils';
+import * as config from './config';
+declare const utils: {
+    applyTheme(theme: themeUtils.Theme, element: HTMLElement): void;
+    loadFonts(): void;
+    onConfigChange(callback: (config: {
+        clientId: string;
+        user: {
+            id: string;
+            name: string;
+            email: string;
+            phone: string;
+        };
+        apiKey: string;
+        insurance: {
+            provider: string;
+            policyNumber: string;
+        };
+        theme: {
+            primary: string;
+            secondary: string;
+            positive: string;
+            negative: string;
+            fontPrimary: string;
+            fontSecondary: string;
+        };
+        contact: {
+            phone: string;
+            email: string;
+        };
+        isConfigLoading: boolean;
+        error: string;
+        name: string;
+        allowedDomains: string[];
+        correspondenceEmail: string[];
+        rootKey: import("vue").InjectionKey<string>;
+        id: string;
+        onSubmit: (type: "", body: config.CollisionSubmission) => void;
+    }) => void): () => void;
+    applyConfig(newConfig: Partial<{
+        clientId: string;
+        user: {
+            id: string;
+            name: string;
+            email: string;
+            phone: string;
+        };
+        apiKey: string;
+        insurance: {
+            provider: string;
+            policyNumber: string;
+        };
+        theme: {
+            primary: string;
+            secondary: string;
+            positive: string;
+            negative: string;
+            fontPrimary: string;
+            fontSecondary: string;
+        };
+        contact: {
+            phone: string;
+            email: string;
+        };
+        isConfigLoading: boolean;
+        error: string;
+        name: string;
+        allowedDomains: string[];
+        correspondenceEmail: string[];
+        rootKey: import("vue").InjectionKey<string>;
+        id: string;
+        onSubmit: (type: "", body: config.CollisionSubmission) => void;
+    }>): void;
+    applyPublicConfig(newConfig: {
+        user?: {
+            id?: string | undefined;
+            name?: string | undefined;
+            email?: string | undefined;
+            phone?: string | undefined;
+        } | undefined;
+        insurance?: {
+            provider?: string | undefined;
+            policyNumber?: string | undefined;
+        } | undefined;
+        theme?: {
+            primary?: string | undefined;
+            secondary?: string | undefined;
+            positive?: string | undefined;
+            negative?: string | undefined;
+            fontPrimary?: string | undefined;
+            fontSecondary?: string | undefined;
+        } | undefined;
+        displayName?: string | undefined;
+        contact?: {
+            phone?: string | undefined;
+            email?: string | undefined;
+        } | undefined;
+    }): void;
+    getBaseUrl: (path: "config" | "submission") => string;
+    config: import("vue").Ref<{
+        clientId: string;
+        user: {
+            id: string;
+            name: string;
+            email: string;
+            phone: string;
+        };
+        apiKey: string;
+        insurance: {
+            provider: string;
+            policyNumber: string;
+        };
+        theme: {
+            primary: string;
+            secondary: string;
+            positive: string;
+            negative: string;
+            fontPrimary: string;
+            fontSecondary: string;
+        };
+        contact: {
+            phone: string;
+            email: string;
+        };
+        isConfigLoading: boolean;
+        error: string;
+        name: string;
+        allowedDomains: string[];
+        correspondenceEmail: string[];
+        rootKey: {
+            toString: () => string;
+            valueOf: () => symbol;
+            readonly description: string | undefined;
+            [Symbol.toPrimitive]: (hint: string) => symbol;
+            readonly [Symbol.toStringTag]: string;
+        };
+        id: string;
+        onSubmit: (type: "", body: config.CollisionSubmission) => void;
+    }>;
+};
+export default utils;

package/dist/types/utils/map.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="google.maps" />
+export declare function getUserBrowser(): string;
+export declare function getLocationByIP(): Promise<any[]>;
+export declare function getPosition(options: PositionOptions): Promise<GeolocationPosition>;
+export declare function getLocationInfo(location: google.maps.LatLng): Promise<ILocationInfo>;
+type AtLeast<T, K extends keyof T> = Partial<T> & Pick<T, K>;
+export interface ILocation {
+    latitude: number;
+    longitude: number;
+    formatted_address: string;
+    address_line: string;
+    city: string;
+    state: string;
+    country: string;
+    postal_code: string;
+}
+export type ILocationInfo = AtLeast<ILocation, 'latitude' | 'longitude'>;
+export declare function getLocation(defaultZoom?: number, defaultLocation?: ILocationInfo): Promise<[ILocationInfo, number, boolean]>;
+export declare function zoomControl(controlDiv: HTMLDivElement, map: google.maps.Map): void;
+export declare function addYourLocationButton(controlDiv: HTMLDivElement, map: google.maps.Map): void;
+export {};

package/dist/types/utils/request.d.ts

@@ -0,0 +1,30 @@
+import { Theme } from './themeUtils';
+export declare const ApiPaths: {
+    readonly config: "config";
+    readonly submission: "submission";
+};
+export type IApiPath = keyof typeof ApiPaths;
+type ApiError = {
+    message: string;
+};
+export type ResponseTypeMap = {
+    [ApiPaths.config]: {
+        id: string;
+        name: string;
+        theme: Theme;
+        correspondenceEmails: string[];
+    };
+    [ApiPaths.submission]: {
+        recieved: true;
+    };
+};
+export declare const request: {
+    get: typeof get;
+    post: typeof post;
+};
+declare function get<Endpoint extends keyof typeof ApiPaths>(endpoint: Endpoint, payload?: {
+    params?: string;
+    query?: string;
+}): Promise<[ResponseTypeMap[Endpoint], null] | [null, ApiError]>;
+declare function post<Body, Endpoint extends keyof typeof ApiPaths>(endpoint: Endpoint, body?: Body): Promise<[null, ApiError] | [ResponseTypeMap[Endpoint], null]>;
+export {};

package/dist/types/utils/themeUtils.d.ts

@@ -0,0 +1,9 @@
+export interface Theme {
+    primary: string;
+    secondary: string;
+    positive: string;
+    negative: string;
+    fontPrimary: string;
+    fontSecondary: string;
+}
+export declare function applyTheme(theme: Theme, element: HTMLElement): void;

package/package.json

@@ -0,0 +1,77 @@
+{
+  "name": "axitech-widget",
+  "version": "0.0.2",
+  "scripts": {
+    "build": "rimraf dist && vue-tsc && vite build",
+    "docs:dev": "vitepress dev docs",
+    "docs:build": "vitepress build docs",
+    "docs:serve": "vitepress serve docs",
+    "lint": "eslint --fix-all ./"
+  },
+  "peerDependencies": {
+    "vue": "^3.3.4"
+  },
+  "devDependencies": {
+    "@iconify/vue": "^4.1.1",
+    "@tailwindcss/forms": "^0.5.3",
+    "@types/google.maps": "^3.53.4",
+    "@types/node": "^20.3.0",
+    "@typescript-eslint/eslint-plugin": "^5.59.7",
+    "@typescript-eslint/parser": "^5.59.7",
+    "@vitejs/plugin-vue": "^4.2.3",
+    "@vue/eslint-config-typescript": "^11.0.3",
+    "autoprefixer": "^10.4.14",
+    "eslint": "^8.41.0",
+    "eslint-config-prettier": "^8.8.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-vue": "^9.14.1",
+    "postcss": "^8.4.21",
+    "prettier": "^2.8.8",
+    "rimraf": "^4.4.1",
+    "sass": "^1.60.0",
+    "tailwindcss": "^3.3.1",
+    "terser": "^5.18.0",
+    "typescript": "^5.1.3",
+    "vite": "^4.3.9",
+    "vite-plugin-environment": "^1.1.3",
+    "vitepress": "1.0.0-alpha.64",
+    "vue": "^3.3.4",
+    "vue-eslint-parser": "^9.3.0",
+    "vue-tsc": "^1.6.5"
+  },
+  "files": [
+    "src",
+    "dist"
+  ],
+  "types": "./dist/types/index.d.ts",
+  "typings": "./dist/types/index.d.ts",
+  "main": "./dist/axitech-widget.es.js",
+  "module": "./dist/axitech-widget.es.js",
+  "browser": "./dist/axitech-widget.es.js",
+  "exports": {
+    ".": {
+      "import": "./dist/axitech-widget.es.js",
+      "require": "./dist/axitech-widget.cjs"
+    }
+  },
+  "dependencies": {
+    "@googlemaps/js-api-loader": "^1.15.2",
+    "@uppy/compressor": "^1.0.2",
+    "@uppy/core": "^3.2.0",
+    "@uppy/dashboard": "^3.4.0",
+    "@uppy/drag-drop": "^3.0.2",
+    "@uppy/drop-target": "^2.0.1",
+    "@uppy/progress-bar": "^3.0.2",
+    "@uppy/thumbnail-generator": "^3.0.3",
+    "@uppy/utils": "^5.3.0",
+    "@uppy/vue": "^1.0.2",
+    "@vueuse/core": "^10.1.2",
+    "dayjs": "^1.11.8",
+    "dotenv": "^16.1.4",
+    "firebase": "^9.22.2",
+    "flowbite": "^1.6.5",
+    "flowbite-vue": "^0.0.12",
+    "vue-tailwind-datepicker": "^1.4.4",
+    "vue3-google-map": "^0.15.0"
+  }
+}