@vuu-ui/vuu-shell 0.0.26

package/esm/shell.js

@@ -0,0 +1,135 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { connectToServer } from '@vuu-ui/vuu-data-remote';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { StackLayout, LayoutProvider, DraggableLayout } from '@vuu-ui/vuu-layout';
+import { useDialog, ContextMenuProvider } from '@vuu-ui/vuu-popups';
+import { logger } from '@vuu-ui/vuu-utils';
+import { SaltProvider } from '@salt-ds/core';
+import cx from 'clsx';
+import { useRef, useState, useCallback, useMemo } from 'react';
+import { AppHeader } from './app-header/AppHeader.js';
+import '@vuu-ui/vuu-ui-controls';
+import 'html-to-image';
+import { useLayoutManager } from './layout-management/useLayoutManager.js';
+import { useLayoutContextMenuItems } from './layout-management/useLayoutContextMenuItems.js';
+import { loadingApplicationJson } from './persistence-management/defaultApplicationJson.js';
+import './persistence-management/LocalPersistenceManager.js';
+import './persistence-management/RemotePersistenceManager.js';
+import { useShellLayout } from './shell-layouts/useShellLayout.js';
+import shellCss from './shell.css.js';
+
+if (typeof StackLayout !== "function") {
+  console.warn(
+    "StackLayout module not loaded, will be unsbale to deserialize from layout JSON"
+  );
+}
+const { error } = logger("Shell");
+const defaultLeftSidePanel = {};
+const Shell = ({
+  LayoutProps,
+  LeftSidePanelProps = defaultLeftSidePanel,
+  children,
+  className: classNameProp,
+  leftSidePanelLayout,
+  loginUrl,
+  saveLocation: _,
+  saveUrl,
+  serverUrl,
+  user,
+  ...htmlAttributes
+}) => {
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "vuu-shell",
+    css: shellCss,
+    window: targetWindow
+  });
+  const rootRef = useRef(null);
+  const { dialog, setDialogState } = useDialog();
+  const layoutId = useRef("latest");
+  const { applicationJson, saveApplicationLayout, loadLayoutById } = useLayoutManager();
+  const { buildMenuOptions, handleMenuAction } = useLayoutContextMenuItems(setDialogState);
+  const [connectionStatus, setConnectionStatus] = useState("connected");
+  const handleLayoutChange = useCallback(
+    (layout) => {
+      try {
+        saveApplicationLayout(layout);
+      } catch {
+        error?.("Failed to save layout");
+      }
+    },
+    [saveApplicationLayout]
+  );
+  const handleSwitchTheme = useCallback((mode) => {
+    if (rootRef.current) {
+      rootRef.current.dataset.mode = mode;
+    }
+  }, []);
+  const handleNavigate = useCallback(
+    (id) => {
+      layoutId.current = id;
+      loadLayoutById(id);
+    },
+    [loadLayoutById]
+  );
+  useMemo(async () => {
+    if (serverUrl && user.token) {
+      const connectionStatus2 = await connectToServer({
+        authToken: user.token,
+        url: serverUrl,
+        username: user.username
+      });
+      setConnectionStatus(connectionStatus2);
+    }
+  }, [serverUrl, user.token, user.username]);
+  const className = cx("vuuShell");
+  const isLoading = applicationJson === loadingApplicationJson;
+  const shellLayout = useShellLayout({
+    LeftSidePanelProps,
+    leftSidePanelLayout,
+    appHeader: /* @__PURE__ */ jsx(
+      AppHeader,
+      {
+        layoutId: layoutId.current,
+        loginUrl,
+        user,
+        onNavigate: handleNavigate,
+        onSwitchTheme: handleSwitchTheme
+      }
+    )
+  });
+  if (connectionStatus === "rejected") {
+    console.log("game over, no connection to server");
+  }
+  return isLoading ? null : /* @__PURE__ */ jsx(SaltProvider, { theme: "vuu-theme", density: "high", children: /* @__PURE__ */ jsxs(
+    ContextMenuProvider,
+    {
+      menuActionHandler: handleMenuAction,
+      menuBuilder: buildMenuOptions,
+      children: [
+        /* @__PURE__ */ jsx(
+          LayoutProvider,
+          {
+            ...LayoutProps,
+            layout: applicationJson.layout,
+            onLayoutChange: handleLayoutChange,
+            children: /* @__PURE__ */ jsx(
+              DraggableLayout,
+              {
+                className,
+                ref: rootRef,
+                ...htmlAttributes,
+                children: shellLayout
+              }
+            )
+          }
+        ),
+        children || dialog
+      ]
+    }
+  ) });
+};
+
+export { Shell };
+//# sourceMappingURL=shell.js.map

package/esm/shell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shell.js","sources":["../src/shell.tsx"],"sourcesContent":["import { connectToServer } from \"@vuu-ui/vuu-data-remote\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  DraggableLayout,\n  LayoutProvider,\n  LayoutProviderProps,\n  StackLayout,\n} from \"@vuu-ui/vuu-layout\";\nimport type { LayoutChangeHandler } from \"@vuu-ui/vuu-layout\";\nimport { ContextMenuProvider, useDialog } from \"@vuu-ui/vuu-popups\";\nimport { logger, ThemeMode } from \"@vuu-ui/vuu-utils\";\nimport { SaltProvider } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport {\n  HTMLAttributes,\n  ReactNode,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { AppHeader } from \"./app-header\";\nimport {\n  useLayoutContextMenuItems,\n  useLayoutManager,\n} from \"./layout-management\";\nimport { loadingApplicationJson } from \"./persistence-management\";\nimport { SidePanelProps, useShellLayout } from \"./shell-layouts\";\nimport { SaveLocation } from \"./shellTypes\";\n\nimport shellCss from \"./shell.css\";\n\nif (typeof StackLayout !== \"function\") {\n  console.warn(\n    \"StackLayout module not loaded, will be unsbale to deserialize from layout JSON\"\n  );\n}\n\nexport type VuuUser = {\n  username: string;\n  token: string;\n};\n\nconst { error } = logger(\"Shell\");\n\nconst defaultLeftSidePanel: ShellProps[\"LeftSidePanelProps\"] = {};\n\nexport type LayoutTemplateName = \"full-height\" | \"inlay\";\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n  LayoutProps?: Pick<\n    LayoutProviderProps,\n    \"createNewChild\" | \"pathToDropTarget\"\n  >;\n  LeftSidePanelProps?: SidePanelProps;\n  children?: ReactNode;\n  leftSidePanelLayout?: \"full-height\" | \"inlay\";\n  loginUrl?: string;\n  // paletteConfig: any;\n  saveLocation?: SaveLocation;\n  saveUrl?: string;\n  serverUrl?: string;\n  user: VuuUser;\n}\n\nexport const Shell = ({\n  LayoutProps,\n  LeftSidePanelProps = defaultLeftSidePanel,\n  children,\n  className: classNameProp,\n  leftSidePanelLayout,\n  loginUrl,\n  saveLocation: _,\n  saveUrl,\n  serverUrl,\n  user,\n  ...htmlAttributes\n}: ShellProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-shell\",\n    css: shellCss,\n    window: targetWindow,\n  });\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const { dialog, setDialogState } = useDialog();\n  const layoutId = useRef(\"latest\");\n  const { applicationJson, saveApplicationLayout, loadLayoutById } =\n    useLayoutManager();\n  const { buildMenuOptions, handleMenuAction } =\n    useLayoutContextMenuItems(setDialogState);\n  const [connectionStatus, setConnectionStatus] = useState<\n    \"connected\" | \"rejected\"\n  >(\"connected\");\n\n  const handleLayoutChange = useCallback<LayoutChangeHandler>(\n    (layout) => {\n      try {\n        saveApplicationLayout(layout);\n      } catch {\n        error?.(\"Failed to save layout\");\n      }\n    },\n    [saveApplicationLayout]\n  );\n\n  const handleSwitchTheme = useCallback((mode: ThemeMode) => {\n    if (rootRef.current) {\n      rootRef.current.dataset.mode = mode;\n    }\n  }, []);\n\n  // TODO this is out of date\n  const handleNavigate = useCallback(\n    (id) => {\n      layoutId.current = id;\n      loadLayoutById(id);\n    },\n    [loadLayoutById]\n  );\n\n  useMemo(async () => {\n    if (serverUrl && user.token) {\n      const connectionStatus = await connectToServer({\n        authToken: user.token,\n        url: serverUrl,\n        username: user.username,\n      });\n      setConnectionStatus(connectionStatus);\n    }\n  }, [serverUrl, user.token, user.username]);\n\n  const className = cx(\"vuuShell\");\n\n  const isLoading = applicationJson === loadingApplicationJson;\n\n  const shellLayout = useShellLayout({\n    LeftSidePanelProps,\n    leftSidePanelLayout,\n    appHeader: (\n      <AppHeader\n        layoutId={layoutId.current}\n        loginUrl={loginUrl}\n        user={user}\n        onNavigate={handleNavigate}\n        onSwitchTheme={handleSwitchTheme}\n      />\n    ),\n  });\n\n  if (connectionStatus === \"rejected\") {\n    console.log(\"game over, no connection to server\");\n  }\n\n  return isLoading ? null : (\n    <SaltProvider theme=\"vuu-theme\" density=\"high\">\n      <ContextMenuProvider\n        menuActionHandler={handleMenuAction}\n        menuBuilder={buildMenuOptions}\n      >\n        <LayoutProvider\n          {...LayoutProps}\n          layout={applicationJson.layout}\n          onLayoutChange={handleLayoutChange}\n        >\n          <DraggableLayout\n            className={className}\n            ref={rootRef}\n            {...htmlAttributes}\n          >\n            {shellLayout}\n          </DraggableLayout>\n        </LayoutProvider>\n        {children || dialog}\n      </ContextMenuProvider>\n    </SaltProvider>\n  );\n};\n"],"names":["connectionStatus"],"mappings":"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"}

package/esm/shellTypes.js

@@ -0,0 +1,5 @@
+const isWildcardSchema = (schema) => schema === "*";
+const isTableSchema = (schema) => typeof schema === "object" && typeof schema.module === "string" && typeof schema.table === "string";
+
+export { isTableSchema, isWildcardSchema };
+//# sourceMappingURL=shellTypes.js.map

package/esm/shellTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shellTypes.js","sources":["../src/shellTypes.ts"],"sourcesContent":["import type { VuuTable } from \"@vuu-ui/vuu-protocol-types\";\nimport type { ViewProps } from \"@vuu-ui/vuu-layout\";\n\ndeclare global {\n  const vuuConfig: Promise<VuuConfig>;\n}\n\nexport type SaveLocation = \"local\" | \"remote\";\n\nexport interface FeatureConfig {\n  name: string;\n  title: string;\n  url: string;\n  css?: string;\n  leftNavLocation: \"vuu-features\" | \"vuu-tables\";\n  featureProps?: {\n    schema?: \"*\" | VuuTable;\n    schemas?: VuuTable[];\n    ViewProps?: Partial<ViewProps>;\n  };\n}\n\nexport type Features = {\n  [key: string]: FeatureConfig;\n};\nexport interface VuuConfig {\n  features: Features;\n  authUrl?: string;\n  websocketUrl: string;\n  ssl: boolean;\n}\n\nexport const isWildcardSchema = (schema?: \"*\" | VuuTable): schema is \"*\" =>\n  schema === \"*\";\nexport const isTableSchema = (schema?: \"*\" | VuuTable): schema is VuuTable =>\n  typeof schema === \"object\" &&\n  typeof schema.module === \"string\" &&\n  typeof schema.table === \"string\";\n"],"names":[],"mappings":"AAgCa,MAAA,gBAAA,GAAmB,CAAC,MAAA,KAC/B,MAAW,KAAA,IAAA;AACN,MAAM,aAAgB,GAAA,CAAC,MAC5B,KAAA,OAAO,MAAW,KAAA,QAAA,IAClB,OAAO,MAAA,CAAO,MAAW,KAAA,QAAA,IACzB,OAAO,MAAA,CAAO,KAAU,KAAA;;;;"}

package/esm/theme-switch/ThemeSwitch.css.js

@@ -0,0 +1,4 @@
+var themeSwitchCss = "\n.vuuThemeSwitch {\n    --saltButton-minWidth: 22px;\n    --svg-light: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\"><path d=\"M24 31q2.9 0 4.95-2.05Q31 26.9 31 24q0-2.9-2.05-4.95Q26.9 17 24 17q-2.9 0-4.95 2.05Q17 21.1 17 24q0 2.9 2.05 4.95Q21.1 31 24 31Zm0 3q-4.15 0-7.075-2.925T14 24q0-4.15 2.925-7.075T24 14q4.15 0 7.075 2.925T34 24q0 4.15-2.925 7.075T24 34ZM3.5 25.5q-.65 0-1.075-.425Q2 24.65 2 24q0-.65.425-1.075Q2.85 22.5 3.5 22.5h5q.65 0 1.075.425Q10 23.35 10 24q0 .65-.425 1.075-.425.425-1.075.425Zm36 0q-.65 0-1.075-.425Q38 24.65 38 24q0-.65.425-1.075.425-.425 1.075-.425h5q.65 0 1.075.425Q46 23.35 46 24q0 .65-.425 1.075-.425.425-1.075.425ZM24 10q-.65 0-1.075-.425Q22.5 9.15 22.5 8.5v-5q0-.65.425-1.075Q23.35 2 24 2q.65 0 1.075.425.425.425.425 1.075v5q0 .65-.425 1.075Q24.65 10 24 10Zm0 36q-.65 0-1.075-.425-.425-.425-.425-1.075v-5q0-.65.425-1.075Q23.35 38 24 38q.65 0 1.075.425.425.425.425 1.075v5q0 .65-.425 1.075Q24.65 46 24 46ZM12 14.1l-2.85-2.8q-.45-.45-.425-1.075.025-.625.425-1.075.45-.45 1.075-.45t1.075.45L14.1 12q.4.45.4 1.05 0 .6-.4 1-.4.45-1.025.45-.625 0-1.075-.4Zm24.7 24.75L33.9 36q-.4-.45-.4-1.075t.45-1.025q.4-.45 1-.45t1.05.45l2.85 2.8q.45.45.425 1.075-.025.625-.425 1.075-.45.45-1.075.45t-1.075-.45ZM33.9 14.1q-.45-.45-.45-1.05 0-.6.45-1.05l2.8-2.85q.45-.45 1.075-.425.625.025 1.075.425.45.45.45 1.075t-.45 1.075L36 14.1q-.4.4-1.025.4-.625 0-1.075-.4ZM9.15 38.85q-.45-.45-.45-1.075t.45-1.075L12 33.9q.45-.45 1.05-.45.6 0 1.05.45.45.45.45 1.05 0 .6-.45 1.05l-2.8 2.85q-.45.45-1.075.425-.625-.025-1.075-.425ZM24 24Z\"/></svg>');\n    --svg-dark: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\"><path d=\"M24 42q-7.5 0-12.75-5.25T6 24q0-7.5 5.25-12.75T24 6q.4 0 .85.025.45.025 1.15.075-1.8 1.6-2.8 3.95-1 2.35-1 4.95 0 4.5 3.15 7.65Q28.5 25.8 33 25.8q2.6 0 4.95-.925T41.9 22.3q.05.6.075.975Q42 23.65 42 24q0 7.5-5.25 12.75T24 42Zm0-3q5.45 0 9.5-3.375t5.05-7.925q-1.25.55-2.675.825Q34.45 28.8 33 28.8q-5.75 0-9.775-4.025T19.2 15q0-1.2.25-2.575.25-1.375.9-3.125-4.9 1.35-8.125 5.475Q9 18.9 9 24q0 6.25 4.375 10.625T24 39Zm-.2-14.85Z\"/></svg>');\n    padding: 2px;\n}\n\n.salt-density-high .vuuThemeSwitch {\n    --saltButton-minWidth: 16px;\n    --saltButton-width: 18px;\n    --vuuThemeSwitch-iconSize: 16px;\n}\n\n.vuuThemeSwitch [data-icon] {\n    --vuu-icon-size: var(--vuuThemeSwitch-iconSize,18px);\n}\n\n.vuuThemeSwitch [data-icon='light'] {\n    --vuu-icon-svg: var(--svg-light);\n}\n.vuuThemeSwitch [data-icon='dark'] {\n    --vuu-icon-svg: var(--svg-dark);\n}\n\n.vuuThemeSwitch .saltToggleButton {\n    height: 20px;\n    width: 20px;\n}\n\n";
+
+export { themeSwitchCss as default };
+//# sourceMappingURL=ThemeSwitch.css.js.map

package/esm/theme-switch/ThemeSwitch.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeSwitch.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/theme-switch/ThemeSwitch.js

@@ -0,0 +1,54 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import cx from 'clsx';
+import { useControlled, ToggleButtonGroup, ToggleButton } from '@salt-ds/core';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { useCallback } from 'react';
+import themeSwitchCss from './ThemeSwitch.css.js';
+
+const classBase = "vuuThemeSwitch";
+const ThemeSwitch = ({
+  className: classNameProp,
+  defaultMode: defaultModeProp,
+  mode: modeProp,
+  onChange,
+  ...htmlAttributes
+}) => {
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "vuu-theme-switch",
+    css: themeSwitchCss,
+    window: targetWindow
+  });
+  const [mode, setMode] = useControlled({
+    controlled: modeProp,
+    default: defaultModeProp ?? "light",
+    name: "ThemeSwitch",
+    state: "mode"
+  });
+  const handleChangeSecondary = useCallback(
+    (evt) => {
+      const { value } = evt.target;
+      setMode(value);
+      onChange(value);
+    },
+    [onChange, setMode]
+  );
+  const className = cx(classBase, classNameProp);
+  return /* @__PURE__ */ jsxs(
+    ToggleButtonGroup,
+    {
+      className,
+      ...htmlAttributes,
+      onChange: handleChangeSecondary,
+      value: mode,
+      children: [
+        /* @__PURE__ */ jsx(ToggleButton, { "aria-label": "alert", "data-icon": "light", value: "light" }),
+        /* @__PURE__ */ jsx(ToggleButton, { "aria-label": "home", "data-icon": "dark", value: "dark" })
+      ]
+    }
+  );
+};
+
+export { ThemeSwitch };
+//# sourceMappingURL=ThemeSwitch.js.map

package/esm/theme-switch/ThemeSwitch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeSwitch.js","sources":["../../src/theme-switch/ThemeSwitch.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { ToggleButton, ToggleButtonGroup, useControlled } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, SyntheticEvent, useCallback } from \"react\";\nimport { ThemeMode } from \"@vuu-ui/vuu-utils\";\n\nimport themeSwitchCss from \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\nexport interface ThemeSwitchProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  defaultMode?: ThemeMode;\n  mode?: ThemeMode;\n  onChange: (mode: ThemeMode) => void;\n}\n\nexport const ThemeSwitch = ({\n  className: classNameProp,\n  defaultMode: defaultModeProp,\n  mode: modeProp,\n  onChange,\n  ...htmlAttributes\n}: ThemeSwitchProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-theme-switch\",\n    css: themeSwitchCss,\n    window: targetWindow,\n  });\n\n  const [mode, setMode] = useControlled<ThemeMode>({\n    controlled: modeProp,\n    default: defaultModeProp ?? \"light\",\n    name: \"ThemeSwitch\",\n    state: \"mode\",\n  });\n\n  const handleChangeSecondary = useCallback(\n    (evt: SyntheticEvent<HTMLButtonElement>) => {\n      const { value } = evt.target as HTMLButtonElement;\n      setMode(value as ThemeMode);\n      onChange(value as ThemeMode);\n    },\n    [onChange, setMode]\n  );\n  const className = cx(classBase, classNameProp);\n  return (\n    <ToggleButtonGroup\n      className={className}\n      {...htmlAttributes}\n      onChange={handleChangeSecondary}\n      value={mode}\n    >\n      <ToggleButton aria-label=\"alert\" data-icon=\"light\" value=\"light\" />\n      <ToggleButton aria-label=\"home\" data-icon=\"dark\" value=\"dark\" />\n    </ToggleButtonGroup>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AASA,MAAM,SAAY,GAAA,gBAAA,CAAA;AAQX,MAAM,cAAc,CAAC;AAAA,EAC1B,SAAW,EAAA,aAAA;AAAA,EACX,WAAa,EAAA,eAAA;AAAA,EACb,IAAM,EAAA,QAAA;AAAA,EACN,QAAA;AAAA,EACA,GAAG,cAAA;AACL,CAAwB,KAAA;AACtB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAA,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,aAAyB,CAAA;AAAA,IAC/C,UAAY,EAAA,QAAA;AAAA,IACZ,SAAS,eAAmB,IAAA,OAAA;AAAA,IAC5B,IAAM,EAAA,aAAA;AAAA,IACN,KAAO,EAAA,MAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,qBAAwB,GAAA,WAAA;AAAA,IAC5B,CAAC,GAA2C,KAAA;AAC1C,MAAM,MAAA,EAAE,KAAM,EAAA,GAAI,GAAI,CAAA,MAAA,CAAA;AACtB,MAAA,OAAA,CAAQ,KAAkB,CAAA,CAAA;AAC1B,MAAA,QAAA,CAAS,KAAkB,CAAA,CAAA;AAAA,KAC7B;AAAA,IACA,CAAC,UAAU,OAAO,CAAA;AAAA,GACpB,CAAA;AACA,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAa,CAAA,CAAA;AAC7C,EACE,uBAAA,IAAA;AAAA,IAAC,iBAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACC,GAAG,cAAA;AAAA,MACJ,QAAU,EAAA,qBAAA;AAAA,MACV,KAAO,EAAA,IAAA;AAAA,MAEP,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,gBAAa,YAAW,EAAA,OAAA,EAAQ,WAAU,EAAA,OAAA,EAAQ,OAAM,OAAQ,EAAA,CAAA;AAAA,4BAChE,YAAa,EAAA,EAAA,YAAA,EAAW,QAAO,WAAU,EAAA,MAAA,EAAO,OAAM,MAAO,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAChE,CAAA;AAEJ;;;;"}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "version": "0.0.26",
+  "description": "VUU UI Shell",
+  "author": "heswell",
+  "license": "Apache-2.0",
+  "devDependencies": {
+    "@vuu-ui/vuu-data-types": "0.0.26",
+    "@vuu-ui/vuu-protocol-types": "0.0.26",
+    "@vuu-ui/vuu-table-types": "0.0.26"
+  },
+  "dependencies": {
+    "@salt-ds/core": "1.17.0",
+    "@salt-ds/styles": "0.2.1",
+    "@salt-ds/window": "0.1.1",
+    "@vuu-ui/vuu-data-remote": "0.0.26",
+    "@vuu-ui/vuu-icons": "0.0.26",
+    "@vuu-ui/vuu-layout": "0.0.26",
+    "@vuu-ui/vuu-popups": "0.0.26",
+    "@vuu-ui/vuu-table": "0.0.26",
+    "@vuu-ui/vuu-ui-controls": "0.0.26",
+    "@vuu-ui/vuu-utils": "0.0.26",
+    "html-to-image": "^1.11.11"
+  },
+  "peerDependencies": {
+    "clsx": "^2.0.0",
+    "react": ">=17.0.2",
+    "react-dom": ">=17.0.2"
+  },
+  "sideEffects": false,
+  "files": [
+    "README.md",
+    "esm",
+    "cjs",
+    "/types"
+  ],
+  "exports": {
+    ".": {
+      "require": "./cjs/index.js",
+      "import": "./esm/index.js",
+      "types": "./types/index.d.ts"
+    }
+  },
+  "main": "cjs/index.js",
+  "module": "esm/index.js",
+  "name": "@vuu-ui/vuu-shell",
+  "type": "module",
+  "types": "types/index.d.ts"
+}

package/types/ShellContextProvider.d.ts

@@ -0,0 +1,16 @@
+import { DefaultColumnConfiguration, ListOption } from "@vuu-ui/vuu-table-types";
+import type { RpcResponseHandler } from "@vuu-ui/vuu-data-types";
+import { ReactElement, ReactNode } from "react";
+import type { VuuTable } from "@vuu-ui/vuu-protocol-types";
+export type LookupTableProvider = (table: VuuTable) => ListOption[];
+export interface ShellContextProps {
+    getDefaultColumnConfig?: DefaultColumnConfiguration;
+    getLookupValues?: LookupTableProvider;
+    handleRpcResponse?: RpcResponseHandler;
+}
+export interface ShellProviderProps {
+    children: ReactNode;
+    value?: ShellContextProps;
+}
+export declare const ShellContextProvider: ({ children, value, }: ShellProviderProps) => ReactElement;
+export declare const useShellContext: () => ShellContextProps;

package/types/app-header/AppHeader.d.ts

@@ -0,0 +1,12 @@
+import { ThemeMode } from "@vuu-ui/vuu-utils";
+import { HTMLAttributes } from "react";
+import { VuuUser } from "../shell";
+export interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {
+    layoutId: string;
+    loginUrl?: string;
+    onNavigate: (id: string) => void;
+    onSwitchTheme?: (mode: ThemeMode) => void;
+    themeMode?: ThemeMode;
+    user: VuuUser;
+}
+export declare const AppHeader: ({ className: classNameProp, layoutId, loginUrl, onNavigate, onSwitchTheme, themeMode: _, user, ...htmlAttributes }: AppHeaderProps) => JSX.Element;

package/types/app-header/index.d.ts

@@ -0,0 +1 @@
+export * from './AppHeader';

package/types/connection-status/ConnectionStatusIndicator.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+type connectionStatus = "connected" | "reconnected" | "connecting" | "disconnected";
+interface ConnectionStatusProps {
+    connectionStatus: connectionStatus;
+    className?: string;
+    props?: unknown;
+    element?: string;
+}
+export declare const ConnectionStatusIndicator: ({ connectionStatus, className, element, ...props }: ConnectionStatusProps) => JSX.Element;
+export {};

package/types/connection-status/index.d.ts

@@ -0,0 +1 @@
+export * from "./ConnectionStatusIndicator";

package/types/feature/Feature.d.ts

@@ -0,0 +1,26 @@
+import { ViewProps } from "@vuu-ui/vuu-layout";
+import React from "react";
+export interface FeatureProps<P extends object | undefined = any> {
+    /**
+      props that will be passed to the lazily loaded component.
+     */
+    ComponentProps?: P;
+    ViewProps?: Partial<Pick<ViewProps, "closeable" | "header">>;
+    css?: string;
+    height?: number;
+    title?: string;
+    /**
+     The url of javascript bundle to lazily load. Bundle must provide a default export
+     and that export must be a React component.
+     */
+    url: string;
+    width?: number;
+}
+declare function RawFeature<Params extends object | undefined>({ url, css, ComponentProps: params, ...props }: FeatureProps<Params>): JSX.Element;
+/**
+  Feature is a wrapper around React Lazy Loading. It will load a component
+  from the given url. That url must resolve to a javascript bundle with a
+  single default export. That export must be a React component.
+ */
+export declare const Feature: React.MemoExoticComponent<typeof RawFeature>;
+export {};

package/types/feature/FeatureErrorBoundary.d.ts

@@ -0,0 +1,13 @@
+import React, { ErrorInfo, ReactNode } from "react";
+import { FeatureProps } from "./Feature";
+export interface FeatureErrorBoundaryProps extends FeatureProps {
+    children: ReactNode;
+}
+export declare class FeatureErrorBoundary extends React.Component<FeatureErrorBoundaryProps, any> {
+    constructor(props: FeatureErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): {
+        errorMessage: string;
+    };
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    render(): React.ReactNode;
+}

package/types/feature/Loader.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Loader: () => JSX.Element;

package/types/feature/index.d.ts

@@ -0,0 +1 @@
+export * from './Feature';

package/types/feature-list/FeatureList.d.ts

@@ -0,0 +1,6 @@
+import { HTMLAttributes } from "react";
+import { FeatureProps } from "../feature/Feature";
+export interface FeatureListProps extends HTMLAttributes<HTMLDivElement> {
+    features: FeatureProps[];
+}
+export declare const FeatureList: ({ features, title, ...htmlAttributes }: FeatureListProps) => JSX.Element;

package/types/feature-list/index.d.ts

@@ -0,0 +1 @@
+export * from "./FeatureList";

package/types/get-layout-history.d.ts

@@ -0,0 +1,8 @@
+import { VuuUser } from "./shell";
+export interface LayoutHistoryItem {
+    user: string;
+    id: string;
+    uniqueId: string;
+    lastUpdate: number;
+}
+export declare const getLayoutHistory: (user: VuuUser) => Promise<LayoutHistoryItem[]>;

package/types/index.d.ts

@@ -0,0 +1,13 @@
+export * from "./app-header";
+export * from "./connection-status";
+export * from "./feature";
+export * from "./layout-management";
+export * from "./left-nav";
+export * from "./login";
+export * from "./session-editing-form";
+export * from "./shell";
+export * from "./shell-layouts";
+export * from "./shellTypes";
+export * from "./ShellContextProvider";
+export * from "./feature-list";
+export * from "./theme-switch";

package/types/layout-management/LayoutList.d.ts

@@ -0,0 +1,2 @@
+import { HTMLAttributes } from "react";
+export declare const LayoutList: (props: HTMLAttributes<HTMLDivElement>) => JSX.Element;

package/types/layout-management/LayoutTile.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { LayoutMetadata } from "./layoutTypes";
+type LayoutTileProps = {
+    metadata: LayoutMetadata;
+    handleLoadLayout: (layoutId?: string) => void;
+};
+export declare const LayoutTile: (props: LayoutTileProps) => JSX.Element;
+export {};

package/types/layout-management/SaveLayoutPanel.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { LayoutMetadataDto } from "./layoutTypes";
+type SaveLayoutPanelProps = {
+    componentId?: string;
+    defaultTitle?: string;
+    onCancel: () => void;
+    onSave: (layoutMetadata: LayoutMetadataDto) => void;
+};
+export declare const SaveLayoutPanel: (props: SaveLayoutPanelProps) => JSX.Element;
+export {};

package/types/layout-management/index.d.ts

@@ -0,0 +1,5 @@
+export * from "./SaveLayoutPanel";
+export * from "./LayoutList";
+export * from "./layoutTypes";
+export * from "./useLayoutManager";
+export * from "./useLayoutContextMenuItems";

package/types/layout-management/layoutTypes.d.ts

@@ -0,0 +1,19 @@
+import { LayoutJSON } from "@vuu-ui/vuu-layout";
+export interface WithId {
+    id: string;
+}
+export interface LayoutMetadata extends WithId {
+    name: string;
+    group: string;
+    screenshot: string;
+    user: string;
+    created: string;
+}
+export type LayoutMetadataDto = Omit<LayoutMetadata, "id" | "created">;
+export interface Layout extends WithId {
+    json: LayoutJSON;
+}
+export type ApplicationLayout = {
+    username: string;
+    definition: LayoutJSON;
+};

package/types/layout-management/screenshot-utils.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Takes a screenshot of the given node and returns the base64 encoded image url
+ * @param node HTMLElement to take screenshot of
+ * @returns Base64 encoded image url
+ */
+export declare const takeScreenshot: (node: HTMLElement) => Promise<string>;

package/types/layout-management/useLayoutContextMenuItems.d.ts

@@ -0,0 +1,6 @@
+import { MenuActionHandler, MenuBuilder } from "@vuu-ui/vuu-data-types";
+import { SetDialog } from "@vuu-ui/vuu-popups";
+export declare const useLayoutContextMenuItems: (setDialogState: SetDialog) => {
+    buildMenuOptions: MenuBuilder<string, unknown>;
+    handleMenuAction: MenuActionHandler;
+};

package/types/layout-management/useLayoutManager.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+import { ApplicationJSON, ApplicationSettings, LayoutJSON, ApplicationSetting } from "@vuu-ui/vuu-layout";
+import { LayoutMetadata, LayoutMetadataDto } from "./layoutTypes";
+export declare const LayoutManagementContext: React.Context<{
+    layoutMetadata: LayoutMetadata[];
+    saveLayout: (n: LayoutMetadataDto) => void;
+    applicationJson: ApplicationJSON;
+    saveApplicationLayout: (layout: LayoutJSON) => void;
+    getApplicationSettings: (key?: keyof ApplicationSettings) => ApplicationSettings | ApplicationSetting | undefined;
+    saveApplicationSettings: (settings: ApplicationSettings | ApplicationSetting, key?: keyof ApplicationSettings) => void;
+    loadLayoutById: (id: string) => void;
+}>;
+type LayoutManagementProviderProps = {
+    children: JSX.Element | JSX.Element[];
+};
+export declare const LayoutManagementProvider: (props: LayoutManagementProviderProps) => JSX.Element;
+export declare const useLayoutManager: () => {
+    layoutMetadata: LayoutMetadata[];
+    saveLayout: (n: LayoutMetadataDto) => void;
+    applicationJson: ApplicationJSON;
+    saveApplicationLayout: (layout: LayoutJSON) => void;
+    getApplicationSettings: (key?: keyof ApplicationSettings) => ApplicationSettings | ApplicationSetting | undefined;
+    saveApplicationSettings: (settings: ApplicationSettings | ApplicationSetting, key?: keyof ApplicationSettings) => void;
+    loadLayoutById: (id: string) => void;
+};
+export {};

package/types/left-nav/LeftNav.d.ts

@@ -0,0 +1,17 @@
+import { HTMLAttributes } from "react";
+import { FeatureProps } from "../feature";
+export type NavDisplayStatus = "menu-full" | "menu-icons" | "menu-full-content" | "menu-icons-content";
+export type NavDisplayStatusHandler = (navDisplayStatus: NavDisplayStatus) => void;
+export interface LeftNavProps extends HTMLAttributes<HTMLDivElement> {
+    "data-path"?: string;
+    defaultActiveTabIndex?: number;
+    defaultExpanded?: boolean;
+    features: FeatureProps[];
+    onActiveChange?: (activeTabIndex: number) => void;
+    onTogglePrimaryMenu?: (expanded: boolean) => void;
+    sizeCollapsed?: number;
+    sizeContent?: number;
+    sizeExpanded?: number;
+    tableFeatures: FeatureProps[];
+}
+export declare const LeftNav: (props: LeftNavProps) => JSX.Element;

package/types/left-nav/index.d.ts

@@ -0,0 +1 @@
+export * from "./LeftNav";

package/types/login/LoginPanel.d.ts

@@ -0,0 +1,7 @@
+import { HTMLAttributes } from "react";
+export interface LoginPanelProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSubmit"> {
+    appName?: string;
+    onSubmit: (username: string, password?: string) => void;
+    requirePassword?: boolean;
+}
+export declare const LoginPanel: ({ appName, className, requirePassword, onSubmit, ...htmlAttributes }: LoginPanelProps) => JSX.Element;

package/types/login/VuuLogo.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const VuuLogo: () => JSX.Element;

package/types/login/index.d.ts

@@ -0,0 +1,2 @@
+export * from './LoginPanel';
+export * from './login-utils';

package/types/login/login-utils.d.ts

@@ -0,0 +1,4 @@
+export declare const getAuthModeFromCookies: () => string;
+export declare const getAuthDetailsFromCookies: () => [string, string];
+export declare const redirectToLogin: (loginUrl?: string) => void;
+export declare const logout: (loginUrl?: string) => void;

package/types/persistence-management/LocalPersistenceManager.d.ts

@@ -0,0 +1,21 @@
+import { ApplicationJSON, LayoutJSON } from "@vuu-ui/vuu-layout";
+import { PersistenceManager } from "./PersistenceManager";
+import { Layout, LayoutMetadata, LayoutMetadataDto } from "../layout-management";
+export declare class LocalPersistenceManager implements PersistenceManager {
+    #private;
+    username: string;
+    metadataSaveLocation: string;
+    layoutsSaveLocation: string;
+    constructor(urlKey?: string);
+    createLayout(metadata: LayoutMetadataDto, layout: LayoutJSON): Promise<LayoutMetadata>;
+    updateLayout(id: string, newMetadata: LayoutMetadataDto, newLayout: LayoutJSON): Promise<void>;
+    deleteLayout(id: string): Promise<void>;
+    loadLayout(id: string): Promise<LayoutJSON>;
+    loadMetadata(): Promise<LayoutMetadata[]>;
+    loadApplicationJSON(): Promise<ApplicationJSON>;
+    saveApplicationJSON(applicationJSON: ApplicationJSON): Promise<void>;
+    loadLayouts: () => Promise<Layout[]>;
+    saveLayoutsWithMetadata: (layouts: Layout[], metadata: LayoutMetadata[]) => void;
+    validateIds: (id: string) => Promise<void>;
+    validateId: (id: string, dataType: "metadata" | "layout") => Promise<void>;
+}