@j2inn/fin5-ui-utils 8.2.0 → 8.3.0

package/dist_es/index.js

@@ -1,54 +1,54 @@
-/*
- * Copyright (c) 2022, J2 Innovations. All Rights Reserved
- */
-//////////////////////////////////////////////////////////////////////////
-// Fin5 APIs related modules
-//////////////////////////////////////////////////////////////////////////
-export * from './fin5Top/fin5FileUpload';
-export * from './fin5Top/fin5Top';
-export * from './fin5Top/finEdge2Cloud';
-export * from './fin5Top/getFin5BinUrl';
-export * from './fin5Top/openFin5Alarm';
-export * from './fin5Top/openFin5Historian';
-export * from './fin5Top/useFin5AppURLHashParameter';
-//////////////////////////////////////////////////////////////////////////
-// Fin5 features related modules
-//////////////////////////////////////////////////////////////////////////
-export * from './jobs/jobUtils';
-//////////////////////////////////////////////////////////////////////////
-// React components
-//////////////////////////////////////////////////////////////////////////
-export * from './react/components/ErrorBoundary';
-export * from './react/components/ErrorDisplayer';
-export * from './react/components/Loader';
-export * from './react/components/LoadingSpinner';
-export * from './react/components/graphics/GraphicViewer';
-export * from './react/components/graphics/GraphicsTabViewer';
-export * from './react/components/navigation/BasicLayout';
-export * from './react/components/navigation/MenuPage';
-export * from './react/components/navigation/ReactRouterLayout';
-export * from './react/components/navigation/ReactRouterHeaderSiderLayout';
-export * from './react/components/navigation/customRouting/RouterLayout';
-export * from './react/components/navigation/customRouting/Router';
-export * from './react/components/resolvable/configurationForm/ConfigurationForm';
-export * from './react/components/resolvable/configurationForm/ConfigurationFormEntry';
-export * from './react/components/resolvable/configurationForm/getSectionDefault';
-export * from './react/components/RecordImage';
-export * from './react/components/charts/QRCode';
-export * from './react/components/charts/line-bar/Chart';
-export * from './react/components/charts/line-bar/HGridChart';
-export * from './react/components/charts/pie/PieChart';
-export * from './react/components/charts/pie/SimplePieChart';
-export * from './react/components/makeCustomElement';
-//////////////////////////////////////////////////////////////////////////
-// React hooks
-//////////////////////////////////////////////////////////////////////////
-export * from './react/hooks/useFin5BinUrl';
-export * from './react/hooks/useFin5ColorScheme';
-export * from './react/hooks/useScreenSize';
-//////////////////////////////////////////////////////////////////////////
-// j2inn/app support for FIN5
-//////////////////////////////////////////////////////////////////////////
-export * from './react/app/Fin5AppContainer';
-export * from './react/app/Fin5AppRootStore';
+/*
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
+ */
+//////////////////////////////////////////////////////////////////////////
+// Fin5 APIs related modules
+//////////////////////////////////////////////////////////////////////////
+export * from './fin5Top/fin5FileUpload';
+export * from './fin5Top/fin5Top';
+export * from './fin5Top/finEdge2Cloud';
+export * from './fin5Top/getFin5BinUrl';
+export * from './fin5Top/openFin5Alarm';
+export * from './fin5Top/openFin5Historian';
+export * from './fin5Top/useFin5AppURLHashParameter';
+//////////////////////////////////////////////////////////////////////////
+// Fin5 features related modules
+//////////////////////////////////////////////////////////////////////////
+export * from './jobs/jobUtils';
+//////////////////////////////////////////////////////////////////////////
+// React components
+//////////////////////////////////////////////////////////////////////////
+export * from './react/components/ErrorBoundary';
+export * from './react/components/ErrorDisplayer';
+export * from './react/components/Loader';
+export * from './react/components/LoadingSpinner';
+export * from './react/components/graphics/GraphicViewer';
+export * from './react/components/graphics/GraphicsTabViewer';
+export * from './react/components/navigation/BasicLayout';
+export * from './react/components/navigation/MenuPage';
+export * from './react/components/navigation/ReactRouterLayout';
+export * from './react/components/navigation/ReactRouterHeaderSiderLayout';
+export * from './react/components/navigation/customRouting/RouterLayout';
+export * from './react/components/navigation/customRouting/Router';
+export * from './react/components/resolvable/configurationForm/ConfigurationForm';
+export * from './react/components/resolvable/configurationForm/ConfigurationFormEntry';
+export * from './react/components/resolvable/configurationForm/getSectionDefault';
+export * from './react/components/RecordImage';
+export * from './react/components/charts/QRCode';
+export * from './react/components/charts/line-bar/Chart';
+export * from './react/components/charts/line-bar/HGridChart';
+export * from './react/components/charts/pie/PieChart';
+export * from './react/components/charts/pie/SimplePieChart';
+export * from './react/components/makeCustomElement';
+//////////////////////////////////////////////////////////////////////////
+// React hooks
+//////////////////////////////////////////////////////////////////////////
+export * from './react/hooks/useFin5BinUrl';
+export * from './react/hooks/useFin5ColorScheme';
+export * from './react/hooks/useScreenSize';
+//////////////////////////////////////////////////////////////////////////
+// j2inn/app support for FIN5
+//////////////////////////////////////////////////////////////////////////
+export * from './react/app/Fin5AppContainer';
+export * from './react/app/Fin5AppRootStore';
 //# sourceMappingURL=index.js.map

package/dist_es/jobs/jobUtils.d.ts

@@ -1,14 +1,14 @@
-import { HDict, HNum, HStr } from 'haystack-core';
-export declare enum JobStatus {
-    doneOk = "doneOk",
-    doneErr = "doneErr",
-    running = "running"
-}
-export interface JobStatusDict extends HDict {
-    jobStatus: HStr;
-    progress: HNum;
-    progressMsg: HStr;
-}
-export declare const isJobSuccessful: (jobStatus: JobStatusDict) => boolean;
-export declare const isJobError: (jobStatus: JobStatusDict) => boolean;
-export declare const isJobRunning: (jobStatus: JobStatusDict) => boolean;
+import { HDict, HNum, HStr } from 'haystack-core';
+export declare enum JobStatus {
+    doneOk = "doneOk",
+    doneErr = "doneErr",
+    running = "running"
+}
+export interface JobStatusDict extends HDict {
+    jobStatus: HStr;
+    progress: HNum;
+    progressMsg: HStr;
+}
+export declare const isJobSuccessful: (jobStatus: JobStatusDict) => boolean;
+export declare const isJobError: (jobStatus: JobStatusDict) => boolean;
+export declare const isJobRunning: (jobStatus: JobStatusDict) => boolean;

package/dist_es/jobs/jobUtils.js

@@ -1,10 +1,10 @@
-export var JobStatus;
-(function (JobStatus) {
-    JobStatus["doneOk"] = "doneOk";
-    JobStatus["doneErr"] = "doneErr";
-    JobStatus["running"] = "running";
-})(JobStatus || (JobStatus = {}));
-export const isJobSuccessful = (jobStatus) => jobStatus.jobStatus.value === JobStatus.doneOk;
-export const isJobError = (jobStatus) => jobStatus.jobStatus.value === JobStatus.doneErr;
-export const isJobRunning = (jobStatus) => jobStatus.jobStatus.value === JobStatus.running;
+export var JobStatus;
+(function (JobStatus) {
+    JobStatus["doneOk"] = "doneOk";
+    JobStatus["doneErr"] = "doneErr";
+    JobStatus["running"] = "running";
+})(JobStatus || (JobStatus = {}));
+export const isJobSuccessful = (jobStatus) => jobStatus.jobStatus.value === JobStatus.doneOk;
+export const isJobError = (jobStatus) => jobStatus.jobStatus.value === JobStatus.doneErr;
+export const isJobRunning = (jobStatus) => jobStatus.jobStatus.value === JobStatus.running;
 //# sourceMappingURL=jobUtils.js.map

package/dist_es/react/app/Fin5AppContainer.d.ts

@@ -1,36 +1,36 @@
-import React from 'react';
-import { AppStore } from '@j2inn/app';
-import { Client } from 'haystack-nclient';
-import { ThemeDef } from '@j2inn/ui';
-/**
- * Properties for the dev application container component.
- */
-export interface Fin5AppContainerProps {
-    /**
-     * The children to render.
-     */
-    children?: React.ReactNode;
-    /**
-     * The app store.
-     */
-    appStore?: AppStore;
-    /**
-     * The network client object.
-     */
-    client?: Client;
-    /**
-     * Optional project name. Typically this is only specified
-     * in development mode. It's typically picked up from the URL.
-     */
-    project?: string;
-    /**
-     * The optional theme to use.
-     */
-    theme?: ThemeDef;
-}
-/**
- * Creates a basic application container environment to run a view in FIN5.
- */
-export declare const Fin5AppContainer: (({ children, appStore, client, project, theme, }: Fin5AppContainerProps) => JSX.Element) & {
-    displayName: string;
-};
+import React from 'react';
+import { AppStore } from '@j2inn/app';
+import { Client } from 'haystack-nclient';
+import { ThemeDef } from '@j2inn/ui';
+/**
+ * Properties for the dev application container component.
+ */
+export interface Fin5AppContainerProps {
+    /**
+     * The children to render.
+     */
+    children?: React.ReactNode;
+    /**
+     * The app store.
+     */
+    appStore?: AppStore;
+    /**
+     * The network client object.
+     */
+    client?: Client;
+    /**
+     * Optional project name. Typically this is only specified
+     * in development mode. It's typically picked up from the URL.
+     */
+    project?: string;
+    /**
+     * The optional theme to use.
+     */
+    theme?: ThemeDef;
+}
+/**
+ * Creates a basic application container environment to run a view in FIN5.
+ */
+export declare const Fin5AppContainer: (({ children, appStore, client, project, theme, }: Fin5AppContainerProps) => JSX.Element) & {
+    displayName: string;
+};

package/dist_es/react/app/Fin5AppContainer.js

@@ -1,133 +1,133 @@
-/*
- * Copyright (c) 2022, J2 Innovations. All Rights Reserved
- */
-import React, { useEffect, useRef, useState } from 'react';
-import { AppRootStoreContext, AppStoreContext } from '@j2inn/app-react';
-import { observer } from 'mobx-react-lite';
-import { Fin5AppRootStore } from './Fin5AppRootStore';
-import { Client, } from 'haystack-nclient';
-import { ClientContext } from 'haystack-react';
-import { I18NProvider } from '@j2inn/utils';
-import { ThemeProvider } from 'react-jss';
-import { DEFAULT_THEME, GenerateTheme } from '@j2inn/ui';
-import { fin5Top } from '../../fin5Top/fin5Top';
-import { useFin5AppURLHashParameter } from '../../fin5Top/useFin5AppURLHashParameter';
-import { HRef } from 'haystack-core';
-import { ErrorBoundary } from '../components/ErrorBoundary';
-import Loader from '../components/Loader';
-const PATH_PREFIX = 'finApp';
-/**
- * The Ractive keypath used to observe target reference changes on fin5Top.app.
- * @see https://ractive.js.org/api/#ractiveobserve
- */
-const FIN5_TARGET_KEYPATH = 'currentId';
-const getServiceUrl = ({ origin, path }) => `${origin}/${PATH_PREFIX}/api/${path}`;
-const getOpUrl = ({ origin, project, op }) => `${origin}/api/${project}/${op}`;
-const getHaystackServiceUrl = ({ origin, project, path, }) => `${origin}/${PATH_PREFIX}/api/haystack${project ? `/${project}` : ''}/${path}`;
-const getHostServiceUrl = ({ origin, path, }) => `${origin}/${PATH_PREFIX}/api/host/${path}`;
-/**
- * Runtime type guard that checks whether a store instance
- * exposes a boolean `initialized` flag.
- *
- * @param {AppStore | null | undefined} appStore - The store instance to test
- * @returns {appStore is AppStore & { initialized: boolean }} True if `appStore` has a boolean `initialized` property
- *
- * @remarks
- * To use the FINX onMessage feature, ensure the concrete store declares `initialized` ahead of time,
- * and set to true when children components have fully rendered.
- */
-function hasInitialized(appStore) {
-    return (!!appStore &&
-        'initialized' in appStore &&
-        typeof appStore.initialized === 'boolean');
-}
-/**
- * Creates a basic application container environment to run a view in FIN5.
- */
-export const Fin5AppContainer = observer(({ children, appStore, client, project, theme = GenerateTheme(DEFAULT_THEME).light, }) => {
-    const [loading, setLoading] = useState(true);
-    const [loadingi18n, setLoadingi18n] = useState(true);
-    const rootStoreRef = useRef(null);
-    rootStoreRef.current ??= new Fin5AppRootStore();
-    const rootStore = rootStoreRef.current;
-    const [hashProjName] = useFin5AppURLHashParameter('projectName');
-    const containerProject = project || hashProjName || fin5Top?.finstack?.projectName || '';
-    const locale = fin5Top?.languageManager?.currentLang ?? navigator?.language;
-    rootStore.locale = locale;
-    if (!rootStore.allLocales.includes(locale)) {
-        rootStore.allLocales.push(locale);
-    }
-    const initialized = hasInitialized(appStore)
-        ? appStore.initialized
-        : false;
-    const getClient = () => client ??
-        new Client({
-            base: new URL(window.location.href),
-            project: containerProject,
-            options: { headers: { accept: 'text/zinc' } },
-            getServiceUrl,
-            getOpUrl,
-            getHaystackServiceUrl,
-            getHostServiceUrl,
-        });
-    const [containerClient, setContainerClient] = useState(getClient);
-    // Primary: set initial value from fin5Top.app and subscribe to changes via Ractive observe
-    useEffect(() => {
-        if (!fin5Top?.app)
-            return;
-        const initial = fin5Top.app.TargetRef?.() ?? '';
-        rootStore.setTarget(initial ? HRef.make(initial).value : '');
-        const observer = fin5Top.app.observe(FIN5_TARGET_KEYPATH, (newValue) => {
-            const value = String(newValue);
-            const target = value ?? '';
-            rootStore.setTarget(target ? HRef.make(target).value : '');
-        });
-        return () => observer.cancel();
-    }, []);
-    useEffect(() => {
-        setLoading(true);
-        const newClient = getClient();
-        setContainerClient(newClient);
-        // Load everything network wise before we load
-        // the application.
-        Promise.all([
-            newClient.ext.eval('finGetCurrentUser()'),
-            newClient.ext.loadDefs(),
-        ]).then(([userGrid]) => {
-            rootStore.currentUser = userGrid.first;
-            setLoading(false);
-        });
-    }, [client, containerProject]);
-    useEffect(() => {
-        const onMessage = (event) => {
-            if (fin5Top?.location.origin === event.origin &&
-                appStore?.onMessage) {
-                appStore.onMessage({
-                    message: event.data.message,
-                    params: event.data,
-                    client: getClient(),
-                    appRootStore: rootStore,
-                });
-            }
-        };
-        window.addEventListener('message', onMessage);
-        return () => window.removeEventListener('message', onMessage);
-    }, []);
-    useEffect(() => {
-        // tell the top level app its ready
-        if (initialized) {
-            fin5Top?.postMessage({
-                kind: 'iframeApp',
-                loading: false,
-            });
-        }
-    }, [initialized]);
-    return (React.createElement(AppRootStoreContext.Provider, { value: rootStore },
-        React.createElement(AppStoreContext.Provider, { value: appStore },
-            React.createElement(ClientContext.Provider, { value: containerClient },
-                React.createElement(I18NProvider, { locale: locale, setLoading: setLoadingi18n },
-                    React.createElement(ThemeProvider, { theme: theme },
-                        React.createElement(Loader, { loading: loading || loadingi18n },
-                            React.createElement(ErrorBoundary, { mode: "global" /* ErrorBoundaryMode.global */ }, children))))))));
-});
+/*
+ * Copyright (c) 2022, J2 Innovations. All Rights Reserved
+ */
+import React, { useEffect, useRef, useState } from 'react';
+import { AppRootStoreContext, AppStoreContext } from '@j2inn/app-react';
+import { observer } from 'mobx-react-lite';
+import { Fin5AppRootStore } from './Fin5AppRootStore';
+import { Client, } from 'haystack-nclient';
+import { ClientContext } from 'haystack-react';
+import { I18NProvider } from '@j2inn/utils';
+import { ThemeProvider } from 'react-jss';
+import { DEFAULT_THEME, GenerateTheme } from '@j2inn/ui';
+import { fin5Top } from '../../fin5Top/fin5Top';
+import { useFin5AppURLHashParameter } from '../../fin5Top/useFin5AppURLHashParameter';
+import { HRef } from 'haystack-core';
+import { ErrorBoundary } from '../components/ErrorBoundary';
+import Loader from '../components/Loader';
+const PATH_PREFIX = 'finApp';
+/**
+ * The Ractive keypath used to observe target reference changes on fin5Top.app.
+ * @see https://ractive.js.org/api/#ractiveobserve
+ */
+const FIN5_TARGET_KEYPATH = 'currentId';
+const getServiceUrl = ({ origin, path }) => `${origin}/${PATH_PREFIX}/api/${path}`;
+const getOpUrl = ({ origin, project, op }) => `${origin}/api/${project}/${op}`;
+const getHaystackServiceUrl = ({ origin, project, path, }) => `${origin}/${PATH_PREFIX}/api/haystack${project ? `/${project}` : ''}/${path}`;
+const getHostServiceUrl = ({ origin, path, }) => `${origin}/${PATH_PREFIX}/api/host/${path}`;
+/**
+ * Runtime type guard that checks whether a store instance
+ * exposes a boolean `initialized` flag.
+ *
+ * @param {AppStore | null | undefined} appStore - The store instance to test
+ * @returns {appStore is AppStore & { initialized: boolean }} True if `appStore` has a boolean `initialized` property
+ *
+ * @remarks
+ * To use the FINX onMessage feature, ensure the concrete store declares `initialized` ahead of time,
+ * and set to true when children components have fully rendered.
+ */
+function hasInitialized(appStore) {
+    return (!!appStore &&
+        'initialized' in appStore &&
+        typeof appStore.initialized === 'boolean');
+}
+/**
+ * Creates a basic application container environment to run a view in FIN5.
+ */
+export const Fin5AppContainer = observer(({ children, appStore, client, project, theme = GenerateTheme(DEFAULT_THEME).light, }) => {
+    const [loading, setLoading] = useState(true);
+    const [loadingi18n, setLoadingi18n] = useState(true);
+    const rootStoreRef = useRef(null);
+    rootStoreRef.current ??= new Fin5AppRootStore();
+    const rootStore = rootStoreRef.current;
+    const [hashProjName] = useFin5AppURLHashParameter('projectName');
+    const containerProject = project || hashProjName || fin5Top?.finstack?.projectName || '';
+    const locale = fin5Top?.languageManager?.currentLang ?? navigator?.language;
+    rootStore.locale = locale;
+    if (!rootStore.allLocales.includes(locale)) {
+        rootStore.allLocales.push(locale);
+    }
+    const initialized = hasInitialized(appStore)
+        ? appStore.initialized
+        : false;
+    const getClient = () => client ??
+        new Client({
+            base: new URL(window.location.href),
+            project: containerProject,
+            options: { headers: { accept: 'text/zinc' } },
+            getServiceUrl,
+            getOpUrl,
+            getHaystackServiceUrl,
+            getHostServiceUrl,
+        });
+    const [containerClient, setContainerClient] = useState(getClient);
+    // Primary: set initial value from fin5Top.app and subscribe to changes via Ractive observe
+    useEffect(() => {
+        if (!fin5Top?.app)
+            return;
+        const initial = fin5Top.app.TargetRef?.() ?? '';
+        rootStore.setTarget(initial ? HRef.make(initial).value : '');
+        const observer = fin5Top.app.observe(FIN5_TARGET_KEYPATH, (newValue) => {
+            const value = String(newValue);
+            const target = value ?? '';
+            rootStore.setTarget(target ? HRef.make(target).value : '');
+        });
+        return () => observer.cancel();
+    }, []);
+    useEffect(() => {
+        setLoading(true);
+        const newClient = getClient();
+        setContainerClient(newClient);
+        // Load everything network wise before we load
+        // the application.
+        Promise.all([
+            newClient.ext.eval('finGetCurrentUser()'),
+            newClient.ext.loadDefs(),
+        ]).then(([userGrid]) => {
+            rootStore.currentUser = userGrid.first;
+            setLoading(false);
+        });
+    }, [client, containerProject]);
+    useEffect(() => {
+        const onMessage = (event) => {
+            if (fin5Top?.location.origin === event.origin &&
+                appStore?.onMessage) {
+                appStore.onMessage({
+                    message: event.data.message,
+                    params: event.data,
+                    client: getClient(),
+                    appRootStore: rootStore,
+                });
+            }
+        };
+        window.addEventListener('message', onMessage);
+        return () => window.removeEventListener('message', onMessage);
+    }, []);
+    useEffect(() => {
+        // tell the top level app its ready
+        if (initialized) {
+            fin5Top?.postMessage({
+                kind: 'iframeApp',
+                loading: false,
+            });
+        }
+    }, [initialized]);
+    return (React.createElement(AppRootStoreContext.Provider, { value: rootStore },
+        React.createElement(AppStoreContext.Provider, { value: appStore },
+            React.createElement(ClientContext.Provider, { value: containerClient },
+                React.createElement(I18NProvider, { locale: locale, setLoading: setLoadingi18n },
+                    React.createElement(ThemeProvider, { theme: theme },
+                        React.createElement(Loader, { loading: loading || loadingi18n },
+                            React.createElement(ErrorBoundary, { mode: "global" /* ErrorBoundaryMode.global */ }, children))))))));
+});
 //# sourceMappingURL=Fin5AppContainer.js.map

package/dist_es/react/app/Fin5AppRootStore.d.ts

@@ -1,42 +1,42 @@
-import { App, AppRootStore, AppView, CustomHistory } from '@j2inn/app';
-import { HDict } from 'haystack-core';
-/**
- * An application root store for use with FIN5.
- */
-export declare class Fin5AppRootStore implements AppRootStore {
-    project: string;
-    sidebarOpen: boolean;
-    locale: string;
-    allLocales: string[];
-    target: string;
-    targetSidebar: string;
-    currentUser: HDict | undefined;
-    get app(): {
-        id: string;
-        name: string;
-        app: App;
-        view: AppView;
-    } | undefined;
-    get sidebar(): {
-        id: string;
-        name: string;
-        app: App;
-        view: AppView;
-    } | undefined;
-    readonly apps: App[];
-    readonly history: CustomHistory;
-    readonly historySidebar: CustomHistory;
-    setTarget(target: string): void;
-    setTargetSidebar(targetSidebar: string): void;
-    constructor();
-    openAppInNewWindow(): void;
-    open(appId: string, state?: Record<string, unknown>): void;
-    openSidebar(): void;
-    postAppMessage(): void;
-    registerSidebars(): void;
-    unregisterSidebars(): void;
-    registerQuicklinks(): void;
-    unregisterQuicklinks(): void;
-    hasAppAccess: (appId: string) => boolean;
-    hasSidebar(): boolean;
-}
+import { App, AppRootStore, AppView, CustomHistory } from '@j2inn/app';
+import { HDict } from 'haystack-core';
+/**
+ * An application root store for use with FIN5.
+ */
+export declare class Fin5AppRootStore implements AppRootStore {
+    project: string;
+    sidebarOpen: boolean;
+    locale: string;
+    allLocales: string[];
+    target: string;
+    targetSidebar: string;
+    currentUser: HDict | undefined;
+    get app(): {
+        id: string;
+        name: string;
+        app: App;
+        view: AppView;
+    } | undefined;
+    get sidebar(): {
+        id: string;
+        name: string;
+        app: App;
+        view: AppView;
+    } | undefined;
+    readonly apps: App[];
+    readonly history: CustomHistory;
+    readonly historySidebar: CustomHistory;
+    setTarget(target: string): void;
+    setTargetSidebar(targetSidebar: string): void;
+    constructor();
+    openAppInNewWindow(): void;
+    open(appId: string, state?: Record<string, unknown>): void;
+    openSidebar(): void;
+    postAppMessage(): void;
+    registerSidebars(): void;
+    unregisterSidebars(): void;
+    registerQuicklinks(): void;
+    unregisterQuicklinks(): void;
+    hasAppAccess: (appId: string) => boolean;
+    hasSidebar(): boolean;
+}