npm - @vuu-ui/vuu-shell - Versions diffs - 0.8.93 → 0.8.95 - Mend

@vuu-ui/vuu-shell 0.8.93 → 0.8.95

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (73) hide show

package/cjs/persistence-manager/RemotePersistenceManager.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RemotePersistenceManager.js","sources":["../../src/persistence-manager/RemotePersistenceManager.ts"],"sourcesContent":["import {\n ApplicationJSON,\n LayoutJSON,\n LayoutMetadata,\n LayoutMetadataDto,\n Settings,\n} from \"@vuu-ui/vuu-utils\";\nimport { getAuthDetailsFromCookies } from \"../login\";\nimport { IPersistenceManager } from \"./PersistenceManager\";\n\nconst baseURL = \"/api\";\nconst metadataSaveLocation = \"layouts/metadata\";\nconst layoutsSaveLocation = \"layouts\";\nconst applicationLayoutsSaveLocation = \"application-layouts\";\n\nexport type CreateLayoutResponseDto = { metadata: LayoutMetadata };\nexport type GetLayoutResponseDto = { definition: LayoutJSON };\nexport type GetApplicationResponseDto = { definition: ApplicationJSON };\n\nexport class RemotePersistenceManager implements IPersistenceManager {\n username: string = getAuthDetailsFromCookies()[0];\n\n createLayout(\n metadata: LayoutMetadataDto,\n layout: LayoutJSON,\n ): Promise<LayoutMetadata> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${layoutsSaveLocation}`, {\n headers: {\n \"Content-Type\": \"application/json\",\n },\n method: \"POST\",\n body: JSON.stringify({\n metadata,\n definition: layout,\n }),\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then(({ metadata }: CreateLayoutResponseDto) => {\n if (!metadata) {\n reject(new Error(\"Response did not contain valid metadata\"));\n }\n resolve(metadata);\n });\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n updateLayout(\n id: string,\n metadata: LayoutMetadataDto,\n newLayoutJson: LayoutJSON,\n ): Promise<void> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${layoutsSaveLocation}/${id}`, {\n method: \"PUT\",\n body: JSON.stringify({\n metadata,\n layout: newLayoutJson,\n }),\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n resolve();\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n deleteLayout(id: string): Promise<void> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${layoutsSaveLocation}/${id}`, {\n method: \"DELETE\",\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n resolve();\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n loadLayout(id: string): Promise<LayoutJSON> {\n return new Promise((resolve, reject) => {\n fetch(`${baseURL}/${layoutsSaveLocation}/${id}`, {\n method: \"GET\",\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then(({ definition }: GetLayoutResponseDto) => {\n if (!definition) {\n reject(new Error(\"Response did not contain a valid layout\"));\n }\n resolve(definition);\n });\n })\n .catch((error: Error) => {\n reject(error);\n });\n });\n }\n\n loadMetadata(): Promise<LayoutMetadata[]> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${metadataSaveLocation}`, {\n method: \"GET\",\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then((metadata: LayoutMetadata[]) => {\n if (!metadata) {\n reject(new Error(\"Response did not contain valid metadata\"));\n }\n resolve(metadata);\n });\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n saveApplicationJSON(applicationJSON: ApplicationJSON): Promise<void> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${applicationLayoutsSaveLocation}`, {\n method: \"PUT\",\n headers: {\n \"Content-Type\": \"application/json\",\n username: this.username,\n },\n body: JSON.stringify(applicationJSON),\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n resolve();\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n loadApplicationJSON(): Promise<ApplicationJSON> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${applicationLayoutsSaveLocation}`, {\n method: \"GET\",\n headers: {\n username: this.username,\n },\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then((applicationJSON: GetApplicationResponseDto) => {\n if (!applicationJSON) {\n reject(\n new Error(\n \"Response did not contain valid application layout information\",\n ),\n );\n }\n resolve(applicationJSON.definition);\n });\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n async getUserSettings() {\n return {};\n }\n\n saveUserSettings(userSettings: Settings) {\n console.log(\"saveUserSettings not implemented\", {\n userSettings,\n });\n }\n}\n"],"names":["getAuthDetailsFromCookies","metadata"],"mappings":"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"}
1	+ {"version":3,"file":"RemotePersistenceManager.js","sources":["../../src/persistence-manager/RemotePersistenceManager.ts"],"sourcesContent":["import {\n ApplicationJSON,\n LayoutJSON,\n LayoutMetadata,\n LayoutMetadataDto,\n Settings,\n} from \"@vuu-ui/vuu-utils\";\nimport { getAuthDetailsFromCookies } from \"../login\";\nimport { IPersistenceManager } from \"./PersistenceManager\";\n\nconst baseURL = \"/api\";\nconst metadataSaveLocation = \"layouts/metadata\";\nconst layoutsSaveLocation = \"layouts\";\nconst applicationLayoutsSaveLocation = \"application-layouts\";\n\nexport type CreateLayoutResponseDto = { metadata: LayoutMetadata };\nexport type GetLayoutResponseDto = { definition: LayoutJSON };\nexport type GetApplicationResponseDto = { definition: ApplicationJSON };\n\nexport class RemotePersistenceManager implements IPersistenceManager {\n username: string = getAuthDetailsFromCookies()[0];\n\n createLayout(\n metadata: LayoutMetadataDto,\n layout: LayoutJSON,\n ): Promise<LayoutMetadata> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${layoutsSaveLocation}`, {\n headers: {\n \"Content-Type\": \"application/json\",\n },\n method: \"POST\",\n body: JSON.stringify({\n metadata,\n definition: layout,\n }),\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then(({ metadata }: CreateLayoutResponseDto) => {\n if (!metadata) {\n reject(new Error(\"Response did not contain valid metadata\"));\n }\n resolve(metadata);\n });\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n updateLayout(\n id: string,\n metadata: LayoutMetadataDto,\n newLayoutJson: LayoutJSON,\n ): Promise<void> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${layoutsSaveLocation}/${id}`, {\n method: \"PUT\",\n body: JSON.stringify({\n metadata,\n layout: newLayoutJson,\n }),\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n resolve();\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n deleteLayout(id: string): Promise<void> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${layoutsSaveLocation}/${id}`, {\n method: \"DELETE\",\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n resolve();\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n loadLayout(id: string): Promise<LayoutJSON> {\n return new Promise((resolve, reject) => {\n fetch(`${baseURL}/${layoutsSaveLocation}/${id}`, {\n method: \"GET\",\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then(({ definition }: GetLayoutResponseDto) => {\n if (!definition) {\n reject(new Error(\"Response did not contain a valid layout\"));\n }\n resolve(definition);\n });\n })\n .catch((error: Error) => {\n reject(error);\n });\n });\n }\n\n loadMetadata(): Promise<LayoutMetadata[]> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${metadataSaveLocation}`, {\n method: \"GET\",\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then((metadata: LayoutMetadata[]) => {\n if (!metadata) {\n reject(new Error(\"Response did not contain valid metadata\"));\n }\n resolve(metadata);\n });\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n saveApplicationJSON(applicationJSON: ApplicationJSON): Promise<void> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${applicationLayoutsSaveLocation}`, {\n method: \"PUT\",\n headers: {\n \"Content-Type\": \"application/json\",\n username: this.username,\n },\n body: JSON.stringify(applicationJSON),\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n resolve();\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n loadApplicationJSON(): Promise<ApplicationJSON> {\n return new Promise((resolve, reject) =>\n fetch(`${baseURL}/${applicationLayoutsSaveLocation}`, {\n method: \"GET\",\n headers: {\n username: this.username,\n },\n })\n .then((response) => {\n if (!response.ok) {\n reject(new Error(response.statusText));\n }\n response.json().then((applicationJSON: GetApplicationResponseDto) => {\n if (!applicationJSON) {\n reject(\n new Error(\n \"Response did not contain valid application layout information\",\n ),\n );\n }\n resolve(applicationJSON.definition);\n });\n })\n .catch((error: Error) => {\n reject(error);\n }),\n );\n }\n\n async getUserSettings() {\n return {};\n }\n\n saveUserSettings(userSettings: Settings) {\n console.log(\"saveUserSettings not implemented\", {\n userSettings,\n });\n }\n}\n"],"names":["getAuthDetailsFromCookies","metadata"],"mappings":"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"}

package/cjs/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js CHANGED Viewed

@@ -6,6 +6,7 @@ var vuuUtils = require('@vuu-ui/vuu-utils');
 var ContextPanel = require('../context-panel/ContextPanel.js');
 var SidePanel = require('../side-panel/SidePanel.js');
 var React = require('react');
+var AppStatusBar = require('../../app-status-bar/AppStatusBar.js');
 const useFullHeightLeftPanel = ({
   appHeader,
@@ -36,7 +37,8 @@ const useFullHeightLeftPanel = ({
                   style: { flex: 1 }
                 },
                 "main-content"
-              )
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(AppStatusBar.ApplicationStatusBar, {})
             ]
           }
         ),

package/cjs/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFullHeightLeftPanel.js","sources":["../../../src/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.tsx"],"sourcesContent":["import { LayoutContainer, Flexbox } from \"@vuu-ui/vuu-layout\";\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { ContextPanel } from \"../context-panel\";\nimport { SidePanel } from \"../side-panel\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\nimport { useMemo } from \"react\";\n\nexport const useFullHeightLeftPanel: ShellLayoutTemplateHook = ({\n appHeader,\n SidePanelProps: LeftSidePanelProps,\n htmlAttributes,\n}) =>\n useMemo(\n () => (\n <Flexbox\n {...htmlAttributes}\n style={{\n ...htmlAttributes?.style,\n flexDirection: \"row\",\n }}\n >\n <SidePanel {...LeftSidePanelProps} id={VuuShellLocation.SidePanel} />\n <Flexbox\n className=\"vuuShell-content\"\n style={{ flex: 1, flexDirection: \"column\" }}\n >\n {appHeader}\n <LayoutContainer\n id={VuuShellLocation.WorkspaceContainer}\n key=\"main-content\"\n style={{ flex: 1 }}\n />\n </Flexbox>\n <ContextPanel id={VuuShellLocation.ContextPanel} overlay></ContextPanel>\n </Flexbox>\n ),\n [LeftSidePanelProps, appHeader, htmlAttributes],\n );\n"],"names":["useMemo","jsxs","Flexbox","jsx","SidePanel","VuuShellLocation","LayoutContainer","ContextPanel"],"mappings":"~~;;;;;;;;;AAOO~~,MAAM,yBAAkD,CAAC;AAAA,EAC9D,SAAA;AAAA,EACA,cAAgB,EAAA,kBAAA;AAAA,EAChB,cAAA;AACF,CACE,KAAAA,aAAA;AAAA,EACE,sBACEC,eAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,GAAG,cAAgB,EAAA,KAAA;AAAA,QACnB,aAAe,EAAA,KAAA;AAAA,OACjB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACC,mBAAW,EAAA,EAAA,GAAG,kBAAoB,EAAA,EAAA,EAAIC,0BAAiB,SAAW,EAAA,CAAA;AAAA,wBACnEJ,eAAA;AAAA,UAACC,iBAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,kBAAA;AAAA,YACV,KAAO,EAAA,EAAE,IAAM,EAAA,CAAA,EAAG,eAAe,QAAS,EAAA;AAAA,YAEzC,QAAA,EAAA;AAAA,cAAA,SAAA;AAAA,8BACDC,cAAA;AAAA,gBAACG,yBAAA;AAAA,gBAAA;AAAA,kBACC,IAAID,yBAAiB,CAAA,kBAAA;AAAA,kBAErB,KAAA,EAAO,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,iBAAA;AAAA,gBADb,cAAA;AAAA,eAEN;AAAA,aAAA;AAAA,WAAA;AAAA,~~SACF~~;AAAA,~~uCACCE~~,yBAAa,EAAA,EAAA,EAAA,~~EAAIF~~,yBAAiB,CAAA,YAAA,EAAc,SAAO,IAAC,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAC3D;AAAA,EAEF,CAAC,kBAAoB,EAAA,SAAA,EAAW,cAAc,CAAA;AAChD;;;;"}
1	+ {"version":3,"file":"useFullHeightLeftPanel.js","sources":["../../../src/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.tsx"],"sourcesContent":["import { LayoutContainer, Flexbox } from \"@vuu-ui/vuu-layout\";\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { ContextPanel } from \"../context-panel\";\nimport { SidePanel } from \"../side-panel\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\nimport { useMemo } from \"react\";\nimport { ApplicationStatusBar } from \"../../app-status-bar\";\n\nexport const useFullHeightLeftPanel: ShellLayoutTemplateHook = ({\n appHeader,\n SidePanelProps: LeftSidePanelProps,\n htmlAttributes,\n}) =>\n useMemo(\n () => (\n <Flexbox\n {...htmlAttributes}\n style={{\n ...htmlAttributes?.style,\n flexDirection: \"row\",\n }}\n >\n <SidePanel {...LeftSidePanelProps} id={VuuShellLocation.SidePanel} />\n <Flexbox\n className=\"vuuShell-content\"\n style={{ flex: 1, flexDirection: \"column\" }}\n >\n {appHeader}\n <LayoutContainer\n id={VuuShellLocation.WorkspaceContainer}\n key=\"main-content\"\n style={{ flex: 1 }}\n />\n <ApplicationStatusBar />\n </Flexbox>\n <ContextPanel id={VuuShellLocation.ContextPanel} overlay></ContextPanel>\n </Flexbox>\n ),\n [LeftSidePanelProps, appHeader, htmlAttributes],\n );\n"],"names":["useMemo","jsxs","Flexbox","jsx","SidePanel","VuuShellLocation","LayoutContainer","ApplicationStatusBar","ContextPanel"],"mappings":";;;;;;;;;;AAQO,MAAM,yBAAkD,CAAC;AAAA,EAC9D,SAAA;AAAA,EACA,cAAgB,EAAA,kBAAA;AAAA,EAChB,cAAA;AACF,CACE,KAAAA,aAAA;AAAA,EACE,sBACEC,eAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,GAAG,cAAgB,EAAA,KAAA;AAAA,QACnB,aAAe,EAAA,KAAA;AAAA,OACjB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACC,mBAAW,EAAA,EAAA,GAAG,kBAAoB,EAAA,EAAA,EAAIC,0BAAiB,SAAW,EAAA,CAAA;AAAA,wBACnEJ,eAAA;AAAA,UAACC,iBAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,kBAAA;AAAA,YACV,KAAO,EAAA,EAAE,IAAM,EAAA,CAAA,EAAG,eAAe,QAAS,EAAA;AAAA,YAEzC,QAAA,EAAA;AAAA,cAAA,SAAA;AAAA,8BACDC,cAAA;AAAA,gBAACG,yBAAA;AAAA,gBAAA;AAAA,kBACC,IAAID,yBAAiB,CAAA,kBAAA;AAAA,kBAErB,KAAA,EAAO,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,iBAAA;AAAA,gBADb,cAAA;AAAA,eAEN;AAAA,6CACCE,iCAAqB,EAAA,EAAA,CAAA;AAAA,aAAA;AAAA,WAAA;AAAA,SACxB;AAAA,uCACCC,yBAAa,EAAA,EAAA,EAAA,EAAIH,yBAAiB,CAAA,YAAA,EAAc,SAAO,IAAC,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAC3D;AAAA,EAEF,CAAC,kBAAoB,EAAA,SAAA,EAAW,cAAc,CAAA;AAChD;;;;"}

package/cjs/shell.js CHANGED Viewed

@@ -77,12 +77,12 @@ const VuuApplication = ({
   );
   React.useMemo(async () => {
     if (serverUrl && user.token) {
-      const connectionStatus = await vuuDataRemote.connectToServer({
-        authToken: user.token,
+      const connectionResult = await vuuDataRemote.ConnectionManager.connect({
+        token: user.token,
         url: serverUrl,
         username: user.username
       });
-      if (connectionStatus === "rejected") {
+      if (connectionResult === "rejected") {
         notify({
           type: "error",
           body: "Unable to connect to VUU Server",

package/cjs/shell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"shell.js","sources":["../src/shell.tsx"],"sourcesContent":["import { connectToServer } from \"@vuu-ui/vuu-data-remote\";\nimport type { LayoutChangeHandler } from \"@vuu-ui/vuu-layout\";\nimport { LayoutProvider, StackLayout } from \"@vuu-ui/vuu-layout\";\nimport {\n ContextMenuProvider,\n DialogProvider,\n NotificationsProvider,\n useNotifications,\n} from \"@vuu-ui/vuu-popups\";\nimport { VuuUser, logger, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, ReactNode, useCallback, useMemo } from \"react\";\nimport { AppHeader } from \"./app-header\";\nimport { ApplicationProvider } from \"./application-provider\";\nimport {\n IPersistenceManager,\n LocalPersistenceManager,\n PersistenceProvider,\n usePersistenceManager,\n} from \"./persistence-manager\";\nimport { ShellLayoutProps, useShellLayout } from \"./shell-layout-templates\";\nimport { SettingsSchema, UserSettingsPanel } from \"./user-settings\";\nimport {\n WorkspaceProps,\n WorkspaceProvider,\n useWorkspace,\n useWorkspaceContextMenuItems,\n} from \"./workspace-management\";\n\nimport shellCss from \"./shell.css\";\nimport { loadingJSON } from \"./workspace-management/defaultWorkspaceJSON\";\n\nregisterComponent(\"ApplicationSettings\", UserSettingsPanel, \"view\");\n\nif (process.env.NODE_ENV === \"production\") {\n // StackLayout is loaded just to force component registration, we know it will be\n // required when default layout is instantiated. This is only required in prod\n // to avoif tree shaking the Stack away. Causes a runtime issue in dev.\n if (typeof StackLayout !== \"function\") {\n console.warn(\n \"StackLayout module not loaded, will be unable to deserialize from layout JSON\",\n );\n }\n}\n\nconst { error } = logger(\"Shell\");\n\nexport type LayoutTemplateName = \"full-height\" \| \"inlay\";\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n shellLayoutProps?: ShellLayoutProps;\n userSettingsSchema?: SettingsSchema;\n workspaceProps?: WorkspaceProps;\n children?: ReactNode;\n loginUrl?: string;\n saveUrl?: string;\n serverUrl?: string;\n user: VuuUser;\n}\n\nconst defaultAppHeader = <AppHeader />;\n\nconst getAppHeader = (shellLayoutProps?: ShellLayoutProps) =>\n shellLayoutProps?.appHeader ?? defaultAppHeader;\n\nconst defaultHTMLAttributes: HTMLAttributes<HTMLDivElement> = {\n className: \"vuuShell\",\n};\n\nconst getHTMLAttributes = (props?: ShellLayoutProps) => {\n if (props?.htmlAttributes) {\n return {\n ...defaultHTMLAttributes,\n ...props.htmlAttributes,\n };\n } else {\n return defaultHTMLAttributes;\n }\n};\n\nconst VuuApplication = ({\n shellLayoutProps: ShellLayoutProps,\n children,\n // loginUrl, // need to make this available to app header\n serverUrl,\n user,\n}: Omit<\n ShellProps,\n \"ContentLayoutProps\" \| \"loginUrl\" \| \"userSettingsSchema\" \| \"workspaceProps\"\n>) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-shell\",\n css: shellCss,\n window: targetWindow,\n });\n\n const notify = useNotifications();\n const { workspaceJSON, saveApplicationLayout } = useWorkspace();\n\n const { buildMenuOptions, handleMenuAction } = useWorkspaceContextMenuItems();\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 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 if (connectionStatus === \"rejected\") {\n notify({\n type: \"error\",\n body: \"Unable to connect to VUU Server\",\n header: \"Error\",\n });\n }\n } else {\n console.warn(\n `Shell: serverUrl: '${serverUrl}', token: '${Array(user.token.length)\n .fill(\"#\")\n .join(\"\")}' \n `,\n );\n }\n }, [notify, serverUrl, user.token, user.username]);\n\n const isLayoutLoading = workspaceJSON === loadingJSON;\n\n const initialLayout = useShellLayout({\n ...ShellLayoutProps,\n appHeader: getAppHeader(ShellLayoutProps),\n htmlAttributes: getHTMLAttributes(ShellLayoutProps),\n });\n\n return isLayoutLoading ? null : (\n <ContextMenuProvider\n menuActionHandler={handleMenuAction}\n menuBuilder={buildMenuOptions}\n >\n <LayoutProvider\n workspaceJSON={workspaceJSON}\n onLayoutChange={handleLayoutChange}\n >\n {initialLayout}\n </LayoutProvider>\n {children}\n </ContextMenuProvider>\n );\n};\n\nexport const Shell = ({\n loginUrl,\n user,\n userSettingsSchema,\n workspaceProps,\n ...props\n}: ShellProps) => {\n // If user has provided an implementation of IPersistenceManager\n // by wrapping higher level PersistenceProvider, use it, otw\n // default to LocalPersistenceManager\n const persistenceManager = usePersistenceManager();\n const localPersistenceManager = useMemo<\n IPersistenceManager \| undefined\n >(() => {\n if (persistenceManager) {\n return undefined;\n }\n console.log(\n `No Persistence Manager, configuration data will be persisted to Local Storage, key: 'vuu/${user.username}'`,\n );\n return new LocalPersistenceManager(`vuu/${user.username}`);\n }, [persistenceManager, user.username]);\n\n // ApplicationProvider must go outside Dialog and Notification providers\n // ApplicationProvider injects the SaltProvider and this must be the root\n // SaltProvider.\n\n const shellProviders = (\n <ApplicationProvider\n density=\"high\"\n loginUrl={loginUrl}\n theme=\"vuu-theme\"\n user={user}\n userSettingsSchema={userSettingsSchema}\n >\n <WorkspaceProvider {...workspaceProps}>\n <DialogProvider>\n <NotificationsProvider>\n <VuuApplication {...props} user={user} />\n </NotificationsProvider>\n </DialogProvider>\n </WorkspaceProvider>\n </ApplicationProvider>\n );\n\n if (persistenceManager) {\n return shellProviders;\n } else {\n return (\n <PersistenceProvider persistenceManager={localPersistenceManager}>\n {shellProviders}\n </PersistenceProvider>\n );\n }\n};\n"],"names":["registerComponent","UserSettingsPanel","StackLayout","logger","AppHeader","ShellLayoutProps","useWindow","useComponentCssInjection","shellCss","useNotifications","useWorkspace","useWorkspaceContextMenuItems","useCallback","useMemo","connectToServer","loadingJSON","useShellLayout","jsxs","ContextMenuProvider","jsx","LayoutProvider","usePersistenceManager","LocalPersistenceManager","ApplicationProvider","WorkspaceProvider","DialogProvider","NotificationsProvider","PersistenceProvider"],"mappings":"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"}
1	+ {"version":3,"file":"shell.js","sources":["../src/shell.tsx"],"sourcesContent":["import { ConnectionManager } from \"@vuu-ui/vuu-data-remote\";\nimport type { LayoutChangeHandler } from \"@vuu-ui/vuu-layout\";\nimport { LayoutProvider, StackLayout } from \"@vuu-ui/vuu-layout\";\nimport {\n ContextMenuProvider,\n DialogProvider,\n NotificationsProvider,\n useNotifications,\n} from \"@vuu-ui/vuu-popups\";\nimport { VuuUser, logger, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, ReactNode, useCallback, useMemo } from \"react\";\nimport { AppHeader } from \"./app-header\";\nimport { ApplicationProvider } from \"./application-provider\";\nimport {\n IPersistenceManager,\n LocalPersistenceManager,\n PersistenceProvider,\n usePersistenceManager,\n} from \"./persistence-manager\";\nimport { ShellLayoutProps, useShellLayout } from \"./shell-layout-templates\";\nimport { SettingsSchema, UserSettingsPanel } from \"./user-settings\";\nimport {\n WorkspaceProps,\n WorkspaceProvider,\n useWorkspace,\n useWorkspaceContextMenuItems,\n} from \"./workspace-management\";\n\nimport shellCss from \"./shell.css\";\nimport { loadingJSON } from \"./workspace-management/defaultWorkspaceJSON\";\n\nregisterComponent(\"ApplicationSettings\", UserSettingsPanel, \"view\");\n\nif (process.env.NODE_ENV === \"production\") {\n // StackLayout is loaded just to force component registration, we know it will be\n // required when default layout is instantiated. This is only required in prod\n // to avoif tree shaking the Stack away. Causes a runtime issue in dev.\n if (typeof StackLayout !== \"function\") {\n console.warn(\n \"StackLayout module not loaded, will be unable to deserialize from layout JSON\",\n );\n }\n}\n\nconst { error } = logger(\"Shell\");\n\nexport type LayoutTemplateName = \"full-height\" \| \"inlay\";\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n shellLayoutProps?: ShellLayoutProps;\n userSettingsSchema?: SettingsSchema;\n workspaceProps?: WorkspaceProps;\n children?: ReactNode;\n loginUrl?: string;\n saveUrl?: string;\n serverUrl?: string;\n user: VuuUser;\n}\n\nconst defaultAppHeader = <AppHeader />;\n\nconst getAppHeader = (shellLayoutProps?: ShellLayoutProps) =>\n shellLayoutProps?.appHeader ?? defaultAppHeader;\n\nconst defaultHTMLAttributes: HTMLAttributes<HTMLDivElement> = {\n className: \"vuuShell\",\n};\n\nconst getHTMLAttributes = (props?: ShellLayoutProps) => {\n if (props?.htmlAttributes) {\n return {\n ...defaultHTMLAttributes,\n ...props.htmlAttributes,\n };\n } else {\n return defaultHTMLAttributes;\n }\n};\n\nconst VuuApplication = ({\n shellLayoutProps: ShellLayoutProps,\n children,\n // loginUrl, // need to make this available to app header\n serverUrl,\n user,\n}: Omit<\n ShellProps,\n \"ContentLayoutProps\" \| \"loginUrl\" \| \"userSettingsSchema\" \| \"workspaceProps\"\n>) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-shell\",\n css: shellCss,\n window: targetWindow,\n });\n\n const notify = useNotifications();\n const { workspaceJSON, saveApplicationLayout } = useWorkspace();\n\n const { buildMenuOptions, handleMenuAction } = useWorkspaceContextMenuItems();\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 useMemo(async () => {\n if (serverUrl && user.token) {\n const connectionResult = await ConnectionManager.connect({\n token: user.token,\n url: serverUrl,\n username: user.username,\n });\n if (connectionResult === \"rejected\") {\n notify({\n type: \"error\",\n body: \"Unable to connect to VUU Server\",\n header: \"Error\",\n });\n }\n } else {\n console.warn(\n `Shell: serverUrl: '${serverUrl}', token: '${Array(user.token.length)\n .fill(\"#\")\n .join(\"\")}' \n `,\n );\n }\n }, [notify, serverUrl, user.token, user.username]);\n\n const isLayoutLoading = workspaceJSON === loadingJSON;\n\n const initialLayout = useShellLayout({\n ...ShellLayoutProps,\n appHeader: getAppHeader(ShellLayoutProps),\n htmlAttributes: getHTMLAttributes(ShellLayoutProps),\n });\n\n return isLayoutLoading ? null : (\n <ContextMenuProvider\n menuActionHandler={handleMenuAction}\n menuBuilder={buildMenuOptions}\n >\n <LayoutProvider\n workspaceJSON={workspaceJSON}\n onLayoutChange={handleLayoutChange}\n >\n {initialLayout}\n </LayoutProvider>\n {children}\n </ContextMenuProvider>\n );\n};\n\nexport const Shell = ({\n loginUrl,\n user,\n userSettingsSchema,\n workspaceProps,\n ...props\n}: ShellProps) => {\n // If user has provided an implementation of IPersistenceManager\n // by wrapping higher level PersistenceProvider, use it, otw\n // default to LocalPersistenceManager\n const persistenceManager = usePersistenceManager();\n const localPersistenceManager = useMemo<\n IPersistenceManager \| undefined\n >(() => {\n if (persistenceManager) {\n return undefined;\n }\n console.log(\n `No Persistence Manager, configuration data will be persisted to Local Storage, key: 'vuu/${user.username}'`,\n );\n return new LocalPersistenceManager(`vuu/${user.username}`);\n }, [persistenceManager, user.username]);\n\n // ApplicationProvider must go outside Dialog and Notification providers\n // ApplicationProvider injects the SaltProvider and this must be the root\n // SaltProvider.\n\n const shellProviders = (\n <ApplicationProvider\n density=\"high\"\n loginUrl={loginUrl}\n theme=\"vuu-theme\"\n user={user}\n userSettingsSchema={userSettingsSchema}\n >\n <WorkspaceProvider {...workspaceProps}>\n <DialogProvider>\n <NotificationsProvider>\n <VuuApplication {...props} user={user} />\n </NotificationsProvider>\n </DialogProvider>\n </WorkspaceProvider>\n </ApplicationProvider>\n );\n\n if (persistenceManager) {\n return shellProviders;\n } else {\n return (\n <PersistenceProvider persistenceManager={localPersistenceManager}>\n {shellProviders}\n </PersistenceProvider>\n );\n }\n};\n"],"names":["registerComponent","UserSettingsPanel","StackLayout","logger","AppHeader","ShellLayoutProps","useWindow","useComponentCssInjection","shellCss","useNotifications","useWorkspace","useWorkspaceContextMenuItems","useCallback","useMemo","ConnectionManager","loadingJSON","useShellLayout","jsxs","ContextMenuProvider","jsx","LayoutProvider","usePersistenceManager","LocalPersistenceManager","ApplicationProvider","WorkspaceProvider","DialogProvider","NotificationsProvider","PersistenceProvider"],"mappings":"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"}

package/cjs/user-settings/SettingsForm.css.js ADDED Viewed

@@ -0,0 +1,6 @@
+'use strict';
+var settingsFormCss = ".vuuSettingsForm {\n  display: flex;\n  flex-direction: column;\n  gap: var(--salt-spacing-200);\n}\n";
+module.exports = settingsFormCss;
+//# sourceMappingURL=SettingsForm.css.js.map

package/cjs/user-settings/SettingsForm.css.js.map ADDED Viewed

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

package/cjs/user-settings/SettingsForm.js CHANGED Viewed

@@ -1,10 +1,14 @@
 'use strict';
 var jsxRuntime = require('react/jsx-runtime');
+var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
 var vuuUtils = require('@vuu-ui/vuu-utils');
 var core = require('@salt-ds/core');
-var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var cx = require('clsx');
 var React = require('react');
+var SettingsForm$1 = require('./SettingsForm.css.js');
 const isOption = (value) => typeof value === "object" && "label" in value && "label" in value;
 const isBooleanProperty = (property) => property.type === "boolean";
@@ -15,6 +19,7 @@ const defaultPropertyValue = {
   number: 0,
   string: ""
 };
+const classBase = "vuuSettingsForm";
 function FormControl({
   property,
   changeHandler,
@@ -103,22 +108,21 @@ function getTooltipContent(type, valid) {
   }
 }
 const SettingsForm = ({
+  className,
   settingsSchema,
   settings,
   onSettingChanged,
   ...htmlAttributes
 }) => {
-  const getFieldNameFromEventTarget = (evt) => {
-    const fieldElement = vuuUtils.queryClosest(evt.target, "[data-field]");
-    if (fieldElement && fieldElement.dataset.field) {
-      return fieldElement.dataset.field;
-    } else {
-      throw Error("data-field attribute not defined");
-    }
-  };
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "vuu-settings-form",
+    css: SettingsForm$1,
+    window: targetWindow
+  });
   const changeHandler = React.useCallback(
     (event) => {
-      const fieldName = getFieldNameFromEventTarget(event);
+      const fieldName = vuuUtils.getFieldName(event.target);
       const { checked, value } = event.target;
       onSettingChanged(fieldName, checked ?? value);
     },
@@ -126,14 +130,14 @@ const SettingsForm = ({
   );
   const selectHandler = React.useCallback(
     (event, [selected]) => {
-      const fieldName = getFieldNameFromEventTarget(event);
+      const fieldName = vuuUtils.getFieldName(event.target);
       onSettingChanged(fieldName, selected);
     },
     [onSettingChanged]
   );
   const inputHandler = React.useCallback(
     (event) => {
-      const fieldName = getFieldNameFromEventTarget(event);
+      const fieldName = vuuUtils.getFieldName(event.target);
       const { value } = event.target;
       if (!Number.isNaN(Number(value)) && value != "") {
         const numValue = Number(value);
@@ -144,7 +148,7 @@ const SettingsForm = ({
     },
     [onSettingChanged]
   );
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlAttributes, children: settingsSchema.properties.map((property) => /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": property.name, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlAttributes, className: cx(classBase, className), children: settingsSchema.properties.map((property) => /* @__PURE__ */ jsxRuntime.jsxs(core.FormField, { "data-field": property.name, children: [
     /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: property.label }),
     FormControl({
       property,

package/cjs/user-settings/SettingsForm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SettingsForm.js","sources":["../../src/user-settings/SettingsForm.tsx"],"sourcesContent":["import { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport { queryClosest, Settings } from \"@vuu-ui/vuu-utils\";\nimport {\n Dropdown,\n DropdownProps,\n FormField,\n FormFieldLabel,\n Option,\n Switch,\n ToggleButton,\n ToggleButtonGroup,\n ToggleButtonGroupProps,\n} from \"@salt-ds/core\";\nimport { VuuInput } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n FormEventHandler,\n HTMLAttributes,\n SyntheticEvent,\n useCallback,\n useState,\n} from \"react\";\nexport interface SettingsSchema {\n properties: SettingsProperty[];\n}\n\nexport interface SettingsProps {\n settingsSchema: SettingsSchema;\n settings: Settings;\n onSettingChanged: (\n propertyName: string,\n value: string \| number \| boolean,\n ) => void;\n}\n\nexport type Option<T> = { label: string; value: T };\n\nexport const isOption = (\n value: Option<number \| string> \| number \| string,\n): value is Option<number \| string> =>\n typeof value === \"object\" && \"label\" in value && \"label\" in value;\n\nexport interface BaseProperty {\n name: string;\n label: string;\n}\n\nexport interface StringProperty extends BaseProperty {\n values?: string[] \| Option<string>[];\n defaultValue?: string;\n type: \"string\";\n}\nexport interface NumericProperty extends BaseProperty {\n values?: number[] \| Option<number>[];\n defaultValue?: number;\n type: \"number\";\n}\nexport interface BooleanProperty extends BaseProperty {\n defaultValue?: boolean;\n type: \"boolean\";\n}\n\nexport type SettingsProperty =\n \| StringProperty\n \| NumericProperty\n \| BooleanProperty;\n\nexport const isBooleanProperty = (\n property: SettingsProperty,\n): property is BooleanProperty => property.type === \"boolean\";\n\nexport const isStringOrNumber = (value: unknown): value is string \| number =>\n typeof value === \"string\" \|\| typeof value === \"number\";\n\nconst getValueAndLabel = (value: string \| number \| Option<string \| number>) =>\n isOption(value) ? [value.value, value.label] : [value, value];\n\nconst defaultPropertyValue: Record<\n SettingsProperty[\"type\"],\n VuuRowDataItemType\n> = {\n boolean: false,\n number: 0,\n string: \"\",\n};\n\n// Determine the form control type to be displayed\nexport function FormControl({\n property,\n changeHandler,\n selectHandler,\n inputHandler,\n currentValue = property.defaultValue ?? defaultPropertyValue[property.type],\n}: {\n property: SettingsProperty;\n changeHandler: FormEventHandler;\n selectHandler: DropdownProps[\"onSelectionChange\"];\n inputHandler: FormEventHandler;\n currentValue: VuuRowDataItemType;\n}) {\n const [value, setValue] = useState(currentValue);\n if (isBooleanProperty(property)) {\n const checked =\n typeof currentValue === \"boolean\"\n ? currentValue\n : (property.defaultValue ?? false);\n\n return <Switch checked={checked} onChange={changeHandler}></Switch>;\n }\n // Toggle Box for 1 or 2 values\n if (Array.isArray(property.values)) {\n if (property.values.length <= 2) {\n return (\n <ToggleButtonGroup\n value={currentValue as ToggleButtonGroupProps[\"value\"]}\n onChange={changeHandler}\n >\n {property.values.map((valueOrOption) => {\n const [value, label] = getValueAndLabel(valueOrOption);\n return (\n <ToggleButton key={value} value={value}>\n {label}\n </ToggleButton>\n );\n })}\n </ToggleButtonGroup>\n );\n } else if (property.values.length > 2) {\n return (\n <Dropdown\n value={currentValue as DropdownProps[\"value\"]}\n onSelectionChange={selectHandler}\n >\n {property.values.map((valueOrOption) => {\n const [value, label] = getValueAndLabel(valueOrOption);\n return (\n <Option\n value={label}\n key={value}\n data-field={property.name}\n ></Option>\n );\n })}\n </Dropdown>\n );\n }\n } else {\n const valid = isValidInput(currentValue, property.type);\n const errorMessage = getTooltipContent(property.type, valid);\n return (\n <VuuInput\n errorMessage={errorMessage}\n key={property.name}\n onCommit={inputHandler}\n onChange={(e) => setValue((e.target as HTMLInputElement).value)}\n value={value as string}\n />\n );\n }\n return null;\n}\n\n//Validation logic for input boxes\nconst isValidInput = (value: unknown, type: unknown) => {\n if (value === \"\") {\n return undefined;\n }\n if (type === \"string\") {\n return \"success\";\n } else if (type === \"number\") {\n if (Number.isNaN(Number(value))) {\n return \"error\";\n }\n return \"success\";\n }\n};\n\n//Function to Generate Tooltip Content\nfunction getTooltipContent(type: string, valid: string \| undefined) {\n if (valid === \"error\") {\n if (type === \"number\") {\n return <p>Field is expecting a number</p>;\n } else if (type === \"string\") {\n return <p>Field is expecting a string</p>;\n } else {\n return <p>Please contact Admin for more information on expected type</p>;\n }\n } else {\n return undefined;\n }\n}\n\nexport type SettingsFormProps = SettingsProps & HTMLAttributes<HTMLDivElement>;\n\n// Generates application settings form component\nexport const SettingsForm = ({\n settingsSchema,\n settings,\n onSettingChanged,\n ...htmlAttributes\n}: SettingsFormProps) => {\n const getFieldNameFromEventTarget = (evt: SyntheticEvent) => {\n const fieldElement = queryClosest(evt.target, \"[data-field]\");\n if (fieldElement && fieldElement.dataset.field) {\n return fieldElement.dataset.field;\n } else {\n throw Error(\"data-field attribute not defined\");\n }\n };\n\n // Change Handler for toggle and switch buttons\n const changeHandler = useCallback<FormEventHandler>(\n (event) => {\n const fieldName = getFieldNameFromEventTarget(event);\n const { checked, value } = event.target as HTMLInputElement;\n onSettingChanged(fieldName, checked ?? value);\n },\n [onSettingChanged],\n );\n\n // Change handler for selection form controls\n const selectHandler = useCallback(\n (event: SyntheticEvent, [selected]: string[]) => {\n const fieldName = getFieldNameFromEventTarget(event);\n onSettingChanged(fieldName, selected);\n },\n [onSettingChanged],\n );\n\n // Change Handler for input boxes\n const inputHandler = useCallback<FormEventHandler>(\n (event) => {\n const fieldName = getFieldNameFromEventTarget(event);\n const { value } = event.target as HTMLInputElement;\n if (!Number.isNaN(Number(value)) && value != \"\") {\n const numValue = Number(value);\n onSettingChanged(fieldName, numValue);\n } else {\n onSettingChanged(fieldName, value);\n }\n },\n [onSettingChanged],\n );\n return (\n <div {...htmlAttributes}>\n {settingsSchema.properties.map((property) => (\n <FormField data-field={property.name} key={property.name}>\n <FormFieldLabel>{property.label}</FormFieldLabel>\n {FormControl({\n property,\n changeHandler,\n selectHandler,\n inputHandler,\n currentValue: settings[property.name],\n })}\n </FormField>\n ))}\n </div>\n );\n};\n"],"names":["useState","jsx","Switch","ToggleButtonGroup","value","ToggleButton","Dropdown","Option","VuuInput","queryClosest","useCallback","jsxs","FormField","FormFieldLabel"],"mappings":"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"}
1	+ {"version":3,"file":"SettingsForm.js","sources":["../../src/user-settings/SettingsForm.tsx"],"sourcesContent":["import { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport { VuuInput } from \"@vuu-ui/vuu-ui-controls\";\nimport { getFieldName, Settings } from \"@vuu-ui/vuu-utils\";\nimport {\n Dropdown,\n DropdownProps,\n FormField,\n FormFieldLabel,\n Option,\n Switch,\n ToggleButton,\n ToggleButtonGroup,\n ToggleButtonGroupProps,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n FormEventHandler,\n HTMLAttributes,\n SyntheticEvent,\n useCallback,\n useState,\n} from \"react\";\n\nimport settingsFormCss from \"./SettingsForm.css\";\n\nexport interface SettingsSchema {\n properties: SettingsProperty[];\n}\n\nexport type Option<T> = { label: string; value: T };\n\nexport const isOption = (\n value: Option<number \| string> \| number \| string,\n): value is Option<number \| string> =>\n typeof value === \"object\" && \"label\" in value && \"label\" in value;\n\nexport interface BaseProperty {\n name: string;\n label: string;\n}\n\nexport interface StringProperty extends BaseProperty {\n values?: string[] \| Option<string>[];\n defaultValue?: string;\n type: \"string\";\n}\nexport interface NumericProperty extends BaseProperty {\n values?: number[] \| Option<number>[];\n defaultValue?: number;\n type: \"number\";\n}\nexport interface BooleanProperty extends BaseProperty {\n defaultValue?: boolean;\n type: \"boolean\";\n}\n\nexport type SettingsProperty =\n \| StringProperty\n \| NumericProperty\n \| BooleanProperty;\n\nexport const isBooleanProperty = (\n property: SettingsProperty,\n): property is BooleanProperty => property.type === \"boolean\";\n\nexport const isStringOrNumber = (value: unknown): value is string \| number =>\n typeof value === \"string\" \|\| typeof value === \"number\";\n\nconst getValueAndLabel = (value: string \| number \| Option<string \| number>) =>\n isOption(value) ? [value.value, value.label] : [value, value];\n\nconst defaultPropertyValue: Record<\n SettingsProperty[\"type\"],\n VuuRowDataItemType\n> = {\n boolean: false,\n number: 0,\n string: \"\",\n};\n\nconst classBase = \"vuuSettingsForm\";\n\n// Determine the form control type to be displayed\nexport function FormControl({\n property,\n changeHandler,\n selectHandler,\n inputHandler,\n currentValue = property.defaultValue ?? defaultPropertyValue[property.type],\n}: {\n property: SettingsProperty;\n changeHandler: FormEventHandler;\n selectHandler: DropdownProps[\"onSelectionChange\"];\n inputHandler: FormEventHandler;\n currentValue: VuuRowDataItemType;\n}) {\n const [value, setValue] = useState(currentValue);\n if (isBooleanProperty(property)) {\n const checked =\n typeof currentValue === \"boolean\"\n ? currentValue\n : (property.defaultValue ?? false);\n\n return <Switch checked={checked} onChange={changeHandler}></Switch>;\n }\n // Toggle Box for 1 or 2 values\n if (Array.isArray(property.values)) {\n if (property.values.length <= 2) {\n return (\n <ToggleButtonGroup\n value={currentValue as ToggleButtonGroupProps[\"value\"]}\n onChange={changeHandler}\n >\n {property.values.map((valueOrOption) => {\n const [value, label] = getValueAndLabel(valueOrOption);\n return (\n <ToggleButton key={value} value={value}>\n {label}\n </ToggleButton>\n );\n })}\n </ToggleButtonGroup>\n );\n } else if (property.values.length > 2) {\n return (\n <Dropdown\n value={currentValue as DropdownProps[\"value\"]}\n onSelectionChange={selectHandler}\n >\n {property.values.map((valueOrOption) => {\n const [value, label] = getValueAndLabel(valueOrOption);\n return (\n <Option\n value={label}\n key={value}\n data-field={property.name}\n ></Option>\n );\n })}\n </Dropdown>\n );\n }\n } else {\n const valid = isValidInput(currentValue, property.type);\n const errorMessage = getTooltipContent(property.type, valid);\n return (\n <VuuInput\n errorMessage={errorMessage}\n key={property.name}\n onCommit={inputHandler}\n onChange={(e) => setValue((e.target as HTMLInputElement).value)}\n value={value as string}\n />\n );\n }\n return null;\n}\n\n//Validation logic for input boxes\nconst isValidInput = (value: unknown, type: unknown) => {\n if (value === \"\") {\n return undefined;\n }\n if (type === \"string\") {\n return \"success\";\n } else if (type === \"number\") {\n if (Number.isNaN(Number(value))) {\n return \"error\";\n }\n return \"success\";\n }\n};\n\n//Function to Generate Tooltip Content\nfunction getTooltipContent(type: string, valid: string \| undefined) {\n if (valid === \"error\") {\n if (type === \"number\") {\n return <p>Field is expecting a number</p>;\n } else if (type === \"string\") {\n return <p>Field is expecting a string</p>;\n } else {\n return <p>Please contact Admin for more information on expected type</p>;\n }\n } else {\n return undefined;\n }\n}\n\nexport interface SettingsFormProps extends HTMLAttributes<HTMLDivElement> {\n settingsSchema: SettingsSchema;\n settings: Settings;\n onSettingChanged: (\n propertyName: string,\n value: string \| number \| boolean,\n ) => void;\n}\n\n// Generates application settings form component\nexport const SettingsForm = ({\n className,\n settingsSchema,\n settings,\n onSettingChanged,\n ...htmlAttributes\n}: SettingsFormProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-settings-form\",\n css: settingsFormCss,\n window: targetWindow,\n });\n\n // Change Handler for toggle and switch buttons\n const changeHandler = useCallback<FormEventHandler>(\n (event) => {\n const fieldName = getFieldName(event.target);\n const { checked, value } = event.target as HTMLInputElement;\n onSettingChanged(fieldName, checked ?? value);\n },\n [onSettingChanged],\n );\n\n // Change handler for selection form controls\n const selectHandler = useCallback(\n (event: SyntheticEvent, [selected]: string[]) => {\n const fieldName = getFieldName(event.target);\n onSettingChanged(fieldName, selected);\n },\n [onSettingChanged],\n );\n\n // Change Handler for input boxes\n const inputHandler = useCallback<FormEventHandler>(\n (event) => {\n const fieldName = getFieldName(event.target);\n const { value } = event.target as HTMLInputElement;\n if (!Number.isNaN(Number(value)) && value != \"\") {\n const numValue = Number(value);\n onSettingChanged(fieldName, numValue);\n } else {\n onSettingChanged(fieldName, value);\n }\n },\n [onSettingChanged],\n );\n return (\n <div {...htmlAttributes} className={cx(classBase, className)}>\n {settingsSchema.properties.map((property) => (\n <FormField data-field={property.name} key={property.name}>\n <FormFieldLabel>{property.label}</FormFieldLabel>\n {FormControl({\n property,\n changeHandler,\n selectHandler,\n inputHandler,\n currentValue: settings[property.name],\n })}\n </FormField>\n ))}\n </div>\n );\n};\n"],"names":["useState","jsx","Switch","ToggleButtonGroup","value","ToggleButton","Dropdown","Option","VuuInput","useWindow","useComponentCssInjection","settingsFormCss","useCallback","getFieldName","FormField","FormFieldLabel"],"mappings":"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"}

package/cjs/user-settings/UserSettingsPanel.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var userSettingsPanelCss = ".vuuUserSettingsPanel {\n  height: 100%;\n  overflow: auto;\n}";
+var userSettingsPanelCss = ".vuuUserSettingsPanel {\n  height: 100%;\n  overflow: auto;\n}\n";
 module.exports = userSettingsPanelCss;
 //# sourceMappingURL=UserSettingsPanel.css.js.map

package/cjs/user-settings/UserSettingsPanel.js CHANGED Viewed

@@ -13,16 +13,16 @@ const UserSettingsPanel = ({
   ...htmlAttributes
 }) => {
   const targetWindow = window.useWindow();
-  const {
-    onUserSettingChanged,
-    userSettings = {},
-    userSettingsSchema
-  } = ApplicationProvider.useApplicationSettings();
   styles.useComponentCssInjection({
     testId: "vuu-user-settings-panel",
     css: UserSettingsPanel$1,
     window: targetWindow
   });
+  const {
+    onUserSettingChanged,
+    userSettings = {},
+    userSettingsSchema
+  } = ApplicationProvider.useApplicationSettings();
   if (userSettingsSchema) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlAttributes, className: cx(classBase, "vuuScrollable"), children: /* @__PURE__ */ jsxRuntime.jsx(
       SettingsForm.SettingsForm,

package/cjs/user-settings/UserSettingsPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserSettingsPanel.js","sources":["../../src/user-settings/UserSettingsPanel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes } from \"react\";\nimport { useApplicationSettings } from \"../application-provider\";\nimport { SettingsForm } from \"./SettingsForm\";\nimport cx from \"clsx\";\n\nimport userSettingsPanelCss from \"./UserSettingsPanel.css\";\n\nexport type UserSettingsPanelProps = HTMLAttributes<HTMLDivElement>;\n\nconst classBase = \"vuuUserSettingsPanel\";\n\nexport const UserSettingsPanel = ({\n ...htmlAttributes\n}: UserSettingsPanelProps) => {\n const targetWindow = useWindow();\n\n ~~const {\n onUserSettingChanged,\n userSettings = {},\n userSettingsSchema,\n } = useApplicationSettings();\n\n~~ useComponentCssInjection({\n testId: \"vuu-user-settings-panel\",\n css: userSettingsPanelCss,\n window: targetWindow,\n });\n\n // Without a schema, we can't render a form\n // We could render a list of input boxes but lets require a schema for now.\n if (userSettingsSchema) {\n return (\n <div {...htmlAttributes} className={cx(classBase, \"vuuScrollable\")}>\n <SettingsForm\n settings={userSettings}\n settingsSchema={userSettingsSchema}\n onSettingChanged={onUserSettingChanged}\n />\n </div>\n );\n } else {\n console.warn(\"no settingsSchema provided to UserSettingsPanel\");\n return null;\n }\n};\n"],"names":["useWindow","~~useApplicationSettings~~","~~useComponentCssInjection~~","~~userSettingsPanelCss~~","jsx","SettingsForm"],"mappings":";;;;;;;;;;AAWA,MAAM,SAAY,GAAA,sBAAA,CAAA;AAEX,MAAM,oBAAoB,CAAC;AAAA,EAChC,GAAG,cAAA;AACL,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;~~AAE~~/B,~~EAAM,MAAA;AAAA,IACJ,oBAAA;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,kBAAA;AAAA,MACEC,0CAAuB,EAAA,CAAA;AAE3B,~~EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,yBAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;~~AAID~~,EAAA,IAAI,kBAAoB,EAAA;AACtB,IACE,uBAAAC,cAAA,CAAC,SAAK,GAAG,cAAA,EAAgB,WAAW,EAAG,CAAA,SAAA,EAAW,eAAe,CAC/D,EAAA,QAAA,kBAAAA,cAAA;AAAA,MAACC,yBAAA;AAAA,MAAA;AAAA,QACC,QAAU,EAAA,YAAA;AAAA,QACV,cAAgB,EAAA,kBAAA;AAAA,QAChB,gBAAkB,EAAA,oBAAA;AAAA,OAAA;AAAA,KAEtB,EAAA,CAAA,CAAA;AAAA,GAEG,MAAA;AACL,IAAA,OAAA,CAAQ,KAAK,iDAAiD,CAAA,CAAA;AAC9D,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACF;;;;"}
1	+ {"version":3,"file":"UserSettingsPanel.js","sources":["../../src/user-settings/UserSettingsPanel.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes } from \"react\";\nimport { useApplicationSettings } from \"../application-provider\";\nimport { SettingsForm } from \"./SettingsForm\";\nimport cx from \"clsx\";\n\nimport userSettingsPanelCss from \"./UserSettingsPanel.css\";\n\nexport type UserSettingsPanelProps = HTMLAttributes<HTMLDivElement>;\n\nconst classBase = \"vuuUserSettingsPanel\";\n\nexport const UserSettingsPanel = ({\n ...htmlAttributes\n}: UserSettingsPanelProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-user-settings-panel\",\n css: userSettingsPanelCss,\n window: targetWindow,\n });\n\n const {\n onUserSettingChanged,\n userSettings = {},\n userSettingsSchema,\n } = useApplicationSettings();\n\n // Without a schema, we can't render a form\n // We could render a list of input boxes but lets require a schema for now.\n if (userSettingsSchema) {\n return (\n <div {...htmlAttributes} className={cx(classBase, \"vuuScrollable\")}>\n <SettingsForm\n settings={userSettings}\n settingsSchema={userSettingsSchema}\n onSettingChanged={onUserSettingChanged}\n />\n </div>\n );\n } else {\n console.warn(\"no settingsSchema provided to UserSettingsPanel\");\n return null;\n }\n};\n"],"names":["useWindow","useComponentCssInjection","userSettingsPanelCss","useApplicationSettings","jsx","SettingsForm"],"mappings":";;;;;;;;;;AAWA,MAAM,SAAY,GAAA,sBAAA,CAAA;AAEX,MAAM,oBAAoB,CAAC;AAAA,EAChC,GAAG,cAAA;AACL,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,yBAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,oBAAA;AAAA,IACA,eAAe,EAAC;AAAA,IAChB,kBAAA;AAAA,MACEC,0CAAuB,EAAA,CAAA;AAI3B,EAAA,IAAI,kBAAoB,EAAA;AACtB,IACE,uBAAAC,cAAA,CAAC,SAAK,GAAG,cAAA,EAAgB,WAAW,EAAG,CAAA,SAAA,EAAW,eAAe,CAC/D,EAAA,QAAA,kBAAAA,cAAA;AAAA,MAACC,yBAAA;AAAA,MAAA;AAAA,QACC,QAAU,EAAA,YAAA;AAAA,QACV,cAAgB,EAAA,kBAAA;AAAA,QAChB,gBAAkB,EAAA,oBAAA;AAAA,OAAA;AAAA,KAEtB,EAAA,CAAA,CAAA;AAAA,GAEG,MAAA;AACL,IAAA,OAAA,CAAQ,KAAK,iDAAiD,CAAA,CAAA;AAC9D,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACF;;;;"}

package/esm/app-status-bar/AppStatusBar.css.js ADDED Viewed

@@ -0,0 +1,4 @@
+var appStatusBarCss = ".vuuAppStatusBar {\n  align-items: center;\n  background-color: var(--salt-container-secondary-background);\n  display: flex;\n  height: 36px;\n  justify-content: flex-end;\n}\n.vuuAppStatusBar-hidden {\n  display: none;\n}\n";
+export { appStatusBarCss as default };
+//# sourceMappingURL=AppStatusBar.css.js.map

package/esm/app-status-bar/AppStatusBar.css.js.map ADDED Viewed

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

package/esm/app-status-bar/AppStatusBar.js ADDED Viewed

@@ -0,0 +1,45 @@
+import { jsx } from 'react/jsx-runtime';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import cx from 'clsx';
+import { ConnectionManager } from '@vuu-ui/vuu-data-remote';
+import appStatusBarCss from './AppStatusBar.css.js';
+import { useUserSetting } from '../application-provider/ApplicationProvider.js';
+import { ConnectionStateDisplay } from '../connection-status/ConnectionStateDisplay.js';
+import '../connection-status/ConnectionStatusIndicator.js';
+import { useState, useEffect } from 'react';
+const classBase = "vuuAppStatusBar";
+const shouldShowStatusBar = (connected, settings) => {
+  if (settings && "showAppStatusBar" in settings) {
+    return settings.showAppStatusBar === true || connected === false;
+  } else {
+    return connected === false;
+  }
+};
+const ApplicationStatusBar = () => {
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "vuu-settings-form",
+    css: appStatusBarCss,
+    window: targetWindow
+  });
+  const [connected, setConnected] = useState(true);
+  const settings = useUserSetting();
+  useEffect(() => {
+    ConnectionManager.on("connection-status", ({ connectionStatus }) => {
+      if (connectionStatus === "disconnected") {
+        setConnected(false);
+      } else if (connectionStatus.endsWith("connected")) {
+        setConnected(true);
+      }
+    });
+  }, []);
+  if (!shouldShowStatusBar(connected, settings)) {
+    return /* @__PURE__ */ jsx("div", { className: cx(classBase, `${classBase}-hidden`) });
+  }
+  return /* @__PURE__ */ jsx("div", { className: classBase, children: /* @__PURE__ */ jsx(ConnectionStateDisplay, {}) });
+};
+export { ApplicationStatusBar };
+//# sourceMappingURL=AppStatusBar.js.map

package/esm/app-status-bar/AppStatusBar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"AppStatusBar.js","sources":["../../src/app-status-bar/AppStatusBar.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { ConnectionManager } from \"@vuu-ui/vuu-data-remote\";\n\nimport appStatusBarCss from \"./AppStatusBar.css\";\nimport { useUserSetting } from \"../application-provider\";\nimport { Settings } from \"@vuu-ui/vuu-utils\";\nimport { ConnectionStateDisplay } from \"../connection-status\";\nimport { useEffect, useState } from \"react\";\n\nconst classBase = \"vuuAppStatusBar\";\n\nconst shouldShowStatusBar = (connected: boolean, settings?: Settings) => {\n if (settings && \"showAppStatusBar\" in settings) {\n return settings.showAppStatusBar === true || connected === false;\n } else {\n return connected === false;\n }\n};\n\nexport const ApplicationStatusBar = () => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-settings-form\",\n css: appStatusBarCss,\n window: targetWindow,\n });\n\n const [connected, setConnected] = useState(true);\n const settings = useUserSetting();\n\n useEffect(() => {\n ConnectionManager.on(\"connection-status\", ({ connectionStatus }) => {\n if (connectionStatus === \"disconnected\") {\n setConnected(false);\n } else if (connectionStatus.endsWith(\"connected\")) {\n setConnected(true);\n }\n });\n }, []);\n\n if (!shouldShowStatusBar(connected, settings)) {\n return <div className={cx(classBase, `${classBase}-hidden`)} />;\n }\n\n // const connect = () => {\n // ConnectionManager.connect({\n // token: \"blah\",\n // url: \"ws://localhost:8090/websocket\",\n // username: \"steve\",\n // });\n // };\n // const disconnect = () => {\n // ConnectionManager.disconnect();\n // };\n\n return (\n <div className={classBase}>\n {/* <Button onClick={disconnect}>Disconnect</Button>\n <Button onClick={connect}>Connect</Button> */}\n <ConnectionStateDisplay />\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAWA,MAAM,SAAY,GAAA,iBAAA,CAAA;AAElB,MAAM,mBAAA,GAAsB,CAAC,SAAA,EAAoB,QAAwB,KAAA;AACvE,EAAI,IAAA,QAAA,IAAY,sBAAsB,QAAU,EAAA;AAC9C,IAAO,OAAA,QAAA,CAAS,gBAAqB,KAAA,IAAA,IAAQ,SAAc,KAAA,KAAA,CAAA;AAAA,GACtD,MAAA;AACL,IAAA,OAAO,SAAc,KAAA,KAAA,CAAA;AAAA,GACvB;AACF,CAAA,CAAA;AAEO,MAAM,uBAAuB,MAAM;AACxC,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAA,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,IAAI,CAAA,CAAA;AAC/C,EAAA,MAAM,WAAW,cAAe,EAAA,CAAA;AAEhC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,iBAAA,CAAkB,EAAG,CAAA,mBAAA,EAAqB,CAAC,EAAE,kBAAuB,KAAA;AAClE,MAAA,IAAI,qBAAqB,cAAgB,EAAA;AACvC,QAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAAA,OACT,MAAA,IAAA,gBAAA,CAAiB,QAAS,CAAA,WAAW,CAAG,EAAA;AACjD,QAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AAAA,OACnB;AAAA,KACD,CAAA,CAAA;AAAA,GACH,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,IAAI,CAAC,mBAAA,CAAoB,SAAW,EAAA,QAAQ,CAAG,EAAA;AAC7C,IAAO,uBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,EAAA,CAAG,WAAW,CAAG,EAAA,SAAS,SAAS,CAAG,EAAA,CAAA,CAAA;AAAA,GAC/D;AAaA,EAAA,2BACG,KAAI,EAAA,EAAA,SAAA,EAAW,SAGd,EAAA,QAAA,kBAAA,GAAA,CAAC,0BAAuB,CAC1B,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/esm/application-provider/ApplicationProvider.js CHANGED Viewed

@@ -91,7 +91,7 @@ const useApplicationSettings = () => {
 };
 const useUserSetting = () => {
   const { userSettings } = useContext(ApplicationContext);
-  return { userSettings };
+  return userSettings;
 };
 export { ApplicationProvider, useApplicationSettings, useApplicationUser, useLoginUrl, useUserSetting };

package/esm/application-provider/ApplicationProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ApplicationProvider.js","sources":["../../src/application-provider/ApplicationProvider.tsx"],"sourcesContent":["import { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n Density,\n Mode,\n SaltProvider,\n ThemeContextProps,\n useDensity,\n useTheme,\n} from \"@salt-ds/core\";\nimport {\n ReactElement,\n ReactNode,\n useCallback,\n useContext,\n useMemo,\n useState,\n} from \"react\";\nimport {\n ApplicationContext,\n ApplicationContextProps,\n} from \"./ApplicationContext\";\nimport { usePersistenceManager } from \"../persistence-manager\";\n\nexport interface ApplicationProviderProps\n extends Partial<Pick<ThemeContextProps, \"theme\" \| \"mode\">>,\n Partial<Omit<ApplicationContextProps, \"userSettings\">> {\n children: ReactNode;\n density?: Density;\n}\n\nconst getThemeMode = (\n mode: Mode = \"light\",\n userSettings?: Record<string, string \| number \| boolean>,\n) => {\n const themeMode = userSettings?.themeMode;\n if (themeMode === \"light\" \|\| themeMode === \"dark\") {\n return themeMode;\n }\n return mode;\n};\n\nexport const ApplicationProvider = ({\n children,\n density: densityProp,\n loginUrl,\n mode,\n theme,\n userSettingsSchema: userSettingsSchema,\n user,\n}: ApplicationProviderProps): ReactElement \| null => {\n const { mode: inheritedMode, theme: inheritedTheme } = useTheme();\n const density = useDensity(densityProp);\n const persistenceManager = usePersistenceManager();\n const context = useContext(ApplicationContext);\n const [userSettings, setSettings] =\n useState<Record<string, string \| number \| boolean>>();\n\n useMemo(async () => {\n if (persistenceManager) {\n const userSettings = await persistenceManager.getUserSettings();\n setSettings(userSettings);\n } else {\n setSettings({});\n }\n }, [persistenceManager]);\n\n const onUserSettingChanged = useCallback(\n (propertyName: string, value: VuuRowDataItemType) => {\n setSettings((currentSettings) => {\n const newSettings = { ...currentSettings, [propertyName]: value };\n persistenceManager?.saveUserSettings(newSettings);\n return newSettings;\n });\n },\n [persistenceManager],\n );\n\n return userSettings ? (\n <ApplicationContext.Provider\n value={{\n ...context,\n loginUrl,\n onUserSettingChanged,\n userSettings,\n userSettingsSchema,\n user: user ?? context.user,\n }}\n >\n <SaltProvider\n theme={theme ?? inheritedTheme ?? \"vuu-theme\"}\n density={density}\n mode={getThemeMode(mode ?? inheritedMode, userSettings)}\n >\n {children}\n </SaltProvider>\n </ApplicationContext.Provider>\n ) : null;\n};\n\nexport const useApplicationUser = () => {\n const { user } = useContext(ApplicationContext);\n return user;\n};\n\nexport const useLoginUrl = () => {\n const { loginUrl } = useContext(ApplicationContext);\n return loginUrl;\n};\n\n//Setter method (only used within the shell)\nexport const useApplicationSettings = () => {\n const { onUserSettingChanged, userSettings, userSettingsSchema } =\n useContext(ApplicationContext);\n return {\n onUserSettingChanged,\n userSettings,\n userSettingsSchema,\n };\n};\n\n//Getter method (read only access to applicationSetting)\nexport const useUserSetting = () => {\n const { userSettings } = useContext(ApplicationContext);\n return { userSettings };\n};\n"],"names":["userSettings"],"mappings":"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~~EAAA~~,~~OAAO~~,~~EAAE~~,~~YAAa,EAAA,~~CAAA;~~AACxB~~;;;;"}
1	+ {"version":3,"file":"ApplicationProvider.js","sources":["../../src/application-provider/ApplicationProvider.tsx"],"sourcesContent":["import { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n Density,\n Mode,\n SaltProvider,\n ThemeContextProps,\n useDensity,\n useTheme,\n} from \"@salt-ds/core\";\nimport {\n ReactElement,\n ReactNode,\n useCallback,\n useContext,\n useMemo,\n useState,\n} from \"react\";\nimport {\n ApplicationContext,\n ApplicationContextProps,\n} from \"./ApplicationContext\";\nimport { usePersistenceManager } from \"../persistence-manager\";\n\nexport interface ApplicationProviderProps\n extends Partial<Pick<ThemeContextProps, \"theme\" \| \"mode\">>,\n Partial<Omit<ApplicationContextProps, \"userSettings\">> {\n children: ReactNode;\n density?: Density;\n}\n\nconst getThemeMode = (\n mode: Mode = \"light\",\n userSettings?: Record<string, string \| number \| boolean>,\n) => {\n const themeMode = userSettings?.themeMode;\n if (themeMode === \"light\" \|\| themeMode === \"dark\") {\n return themeMode;\n }\n return mode;\n};\n\nexport const ApplicationProvider = ({\n children,\n density: densityProp,\n loginUrl,\n mode,\n theme,\n userSettingsSchema: userSettingsSchema,\n user,\n}: ApplicationProviderProps): ReactElement \| null => {\n const { mode: inheritedMode, theme: inheritedTheme } = useTheme();\n const density = useDensity(densityProp);\n const persistenceManager = usePersistenceManager();\n const context = useContext(ApplicationContext);\n const [userSettings, setSettings] =\n useState<Record<string, string \| number \| boolean>>();\n\n useMemo(async () => {\n if (persistenceManager) {\n const userSettings = await persistenceManager.getUserSettings();\n setSettings(userSettings);\n } else {\n setSettings({});\n }\n }, [persistenceManager]);\n\n const onUserSettingChanged = useCallback(\n (propertyName: string, value: VuuRowDataItemType) => {\n setSettings((currentSettings) => {\n const newSettings = { ...currentSettings, [propertyName]: value };\n persistenceManager?.saveUserSettings(newSettings);\n return newSettings;\n });\n },\n [persistenceManager],\n );\n\n return userSettings ? (\n <ApplicationContext.Provider\n value={{\n ...context,\n loginUrl,\n onUserSettingChanged,\n userSettings,\n userSettingsSchema,\n user: user ?? context.user,\n }}\n >\n <SaltProvider\n theme={theme ?? inheritedTheme ?? \"vuu-theme\"}\n density={density}\n mode={getThemeMode(mode ?? inheritedMode, userSettings)}\n >\n {children}\n </SaltProvider>\n </ApplicationContext.Provider>\n ) : null;\n};\n\nexport const useApplicationUser = () => {\n const { user } = useContext(ApplicationContext);\n return user;\n};\n\nexport const useLoginUrl = () => {\n const { loginUrl } = useContext(ApplicationContext);\n return loginUrl;\n};\n\n//Setter method (only used within the shell)\nexport const useApplicationSettings = () => {\n const { onUserSettingChanged, userSettings, userSettingsSchema } =\n useContext(ApplicationContext);\n return {\n onUserSettingChanged,\n userSettings,\n userSettingsSchema,\n };\n};\n\n//Getter method (read only access to applicationSetting)\nexport const useUserSetting = () => {\n const { userSettings } = useContext(ApplicationContext);\n return userSettings;\n};\n"],"names":["userSettings"],"mappings":";;;;;;;;;;;;;AA8BA,MAAM,YAAe,GAAA,CACnB,IAAa,GAAA,OAAA,EACb,YACG,KAAA;AACH,EAAA,MAAM,YAAY,YAAc,EAAA,SAAA,CAAA;AAChC,EAAI,IAAA,SAAA,KAAc,OAAW,IAAA,SAAA,KAAc,MAAQ,EAAA;AACjD,IAAO,OAAA,SAAA,CAAA;AAAA,GACT;AACA,EAAO,OAAA,IAAA,CAAA;AACT,CAAA,CAAA;AAEO,MAAM,sBAAsB,CAAC;AAAA,EAClC,QAAA;AAAA,EACA,OAAS,EAAA,WAAA;AAAA,EACT,QAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AAAA,EACA,kBAAA;AAAA,EACA,IAAA;AACF,CAAqD,KAAA;AACnD,EAAA,MAAM,EAAE,IAAM,EAAA,aAAA,EAAe,KAAO,EAAA,cAAA,KAAmB,QAAS,EAAA,CAAA;AAChE,EAAM,MAAA,OAAA,GAAU,WAAW,WAAW,CAAA,CAAA;AACtC,EAAA,MAAM,qBAAqB,qBAAsB,EAAA,CAAA;AACjD,EAAM,MAAA,OAAA,GAAU,WAAW,kBAAkB,CAAA,CAAA;AAC7C,EAAA,MAAM,CAAC,YAAA,EAAc,WAAW,CAAA,GAC9B,QAAoD,EAAA,CAAA;AAEtD,EAAA,OAAA,CAAQ,YAAY;AAClB,IAAA,IAAI,kBAAoB,EAAA;AACtB,MAAMA,MAAAA,aAAAA,GAAe,MAAM,kBAAA,CAAmB,eAAgB,EAAA,CAAA;AAC9D,MAAA,WAAA,CAAYA,aAAY,CAAA,CAAA;AAAA,KACnB,MAAA;AACL,MAAA,WAAA,CAAY,EAAE,CAAA,CAAA;AAAA,KAChB;AAAA,GACF,EAAG,CAAC,kBAAkB,CAAC,CAAA,CAAA;AAEvB,EAAA,MAAM,oBAAuB,GAAA,WAAA;AAAA,IAC3B,CAAC,cAAsB,KAA8B,KAAA;AACnD,MAAA,WAAA,CAAY,CAAC,eAAoB,KAAA;AAC/B,QAAA,MAAM,cAAc,EAAE,GAAG,iBAAiB,CAAC,YAAY,GAAG,KAAM,EAAA,CAAA;AAChE,QAAA,kBAAA,EAAoB,iBAAiB,WAAW,CAAA,CAAA;AAChD,QAAO,OAAA,WAAA,CAAA;AAAA,OACR,CAAA,CAAA;AAAA,KACH;AAAA,IACA,CAAC,kBAAkB,CAAA;AAAA,GACrB,CAAA;AAEA,EAAA,OAAO,YACL,mBAAA,GAAA;AAAA,IAAC,kBAAmB,CAAA,QAAA;AAAA,IAAnB;AAAA,MACC,KAAO,EAAA;AAAA,QACL,GAAG,OAAA;AAAA,QACH,QAAA;AAAA,QACA,oBAAA;AAAA,QACA,YAAA;AAAA,QACA,kBAAA;AAAA,QACA,IAAA,EAAM,QAAQ,OAAQ,CAAA,IAAA;AAAA,OACxB;AAAA,MAEA,QAAA,kBAAA,GAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAO,SAAS,cAAkB,IAAA,WAAA;AAAA,UAClC,OAAA;AAAA,UACA,IAAM,EAAA,YAAA,CAAa,IAAQ,IAAA,aAAA,EAAe,YAAY,CAAA;AAAA,UAErD,QAAA;AAAA,SAAA;AAAA,OACH;AAAA,KAAA;AAAA,GAEA,GAAA,IAAA,CAAA;AACN,EAAA;AAEO,MAAM,qBAAqB,MAAM;AACtC,EAAA,MAAM,EAAE,IAAA,EAAS,GAAA,UAAA,CAAW,kBAAkB,CAAA,CAAA;AAC9C,EAAO,OAAA,IAAA,CAAA;AACT,EAAA;AAEO,MAAM,cAAc,MAAM;AAC/B,EAAA,MAAM,EAAE,QAAA,EAAa,GAAA,UAAA,CAAW,kBAAkB,CAAA,CAAA;AAClD,EAAO,OAAA,QAAA,CAAA;AACT,EAAA;AAGO,MAAM,yBAAyB,MAAM;AAC1C,EAAA,MAAM,EAAE,oBAAsB,EAAA,YAAA,EAAc,kBAAmB,EAAA,GAC7D,WAAW,kBAAkB,CAAA,CAAA;AAC/B,EAAO,OAAA;AAAA,IACL,oBAAA;AAAA,IACA,YAAA;AAAA,IACA,kBAAA;AAAA,GACF,CAAA;AACF,EAAA;AAGO,MAAM,iBAAiB,MAAM;AAClC,EAAA,MAAM,EAAE,YAAA,EAAiB,GAAA,UAAA,CAAW,kBAAkB,CAAA,CAAA;AACtD,EAAO,OAAA,YAAA,CAAA;AACT;;;;"}

package/esm/connection-status/ConnectionRetryCountdown.js ADDED Viewed

@@ -0,0 +1,34 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useRef, useState, useCallback, useEffect, useMemo } from 'react';
+const classBase = "vuuConnectionRetryCountdown";
+const ConnectionRetryCountdown = ({
+  seconds: secondsProp
+}) => {
+  const secondsRemainingRef = useRef(secondsProp);
+  const [seconds, setSeconds] = useState(secondsRemainingRef.current);
+  const countDown = useCallback(() => {
+    secondsRemainingRef.current -= 1;
+    setSeconds(secondsRemainingRef.current);
+    if (secondsRemainingRef.current > 0) {
+      setTimeout(countDown, 1e3);
+    }
+  }, []);
+  useEffect(() => {
+    if (secondsProp !== secondsRemainingRef.current) {
+      secondsRemainingRef.current = secondsProp;
+      countDown();
+    }
+  }, [countDown, secondsProp]);
+  useMemo(() => {
+    setTimeout(countDown, 1e3);
+  }, [countDown]);
+  return seconds === 0 ? /* @__PURE__ */ jsx("div", { className: classBase, children: /* @__PURE__ */ jsx("span", { children: "connecting" }) }) : /* @__PURE__ */ jsx("div", { className: classBase, children: /* @__PURE__ */ jsxs("span", { children: [
+    "retry in ",
+    seconds,
+    " seconds"
+  ] }) });
+};
+export { ConnectionRetryCountdown };
+//# sourceMappingURL=ConnectionRetryCountdown.js.map

package/esm/connection-status/ConnectionRetryCountdown.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ConnectionRetryCountdown.js","sources":["../../src/connection-status/ConnectionRetryCountdown.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nconst classBase = \"vuuConnectionRetryCountdown\";\n\nexport const ConnectionRetryCountdown = ({\n seconds: secondsProp,\n}: {\n seconds: number;\n}) => {\n const secondsRemainingRef = useRef(secondsProp);\n const [seconds, setSeconds] = useState<number>(secondsRemainingRef.current);\n\n const countDown = useCallback(() => {\n secondsRemainingRef.current -= 1;\n setSeconds(secondsRemainingRef.current);\n if (secondsRemainingRef.current > 0) {\n setTimeout(countDown, 1000);\n }\n }, []);\n\n useEffect(() => {\n if (secondsProp !== secondsRemainingRef.current) {\n secondsRemainingRef.current = secondsProp;\n countDown();\n }\n }, [countDown, secondsProp]);\n\n useMemo(() => {\n setTimeout(countDown, 1000);\n }, [countDown]);\n\n return seconds === 0 ? (\n <div className={classBase}>\n <span>connecting</span>\n </div>\n ) : (\n <div className={classBase}>\n <span>retry in {seconds} seconds</span>\n </div>\n );\n};\n"],"names":[],"mappings":";;;AAEA,MAAM,SAAY,GAAA,6BAAA,CAAA;AAEX,MAAM,2BAA2B,CAAC;AAAA,EACvC,OAAS,EAAA,WAAA;AACX,CAEM,KAAA;AACJ,EAAM,MAAA,mBAAA,GAAsB,OAAO,WAAW,CAAA,CAAA;AAC9C,EAAA,MAAM,CAAC,OAAS,EAAA,UAAU,CAAI,GAAA,QAAA,CAAiB,oBAAoB,OAAO,CAAA,CAAA;AAE1E,EAAM,MAAA,SAAA,GAAY,YAAY,MAAM;AAClC,IAAA,mBAAA,CAAoB,OAAW,IAAA,CAAA,CAAA;AAC/B,IAAA,UAAA,CAAW,oBAAoB,OAAO,CAAA,CAAA;AACtC,IAAI,IAAA,mBAAA,CAAoB,UAAU,CAAG,EAAA;AACnC,MAAA,UAAA,CAAW,WAAW,GAAI,CAAA,CAAA;AAAA,KAC5B;AAAA,GACF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,WAAA,KAAgB,oBAAoB,OAAS,EAAA;AAC/C,MAAA,mBAAA,CAAoB,OAAU,GAAA,WAAA,CAAA;AAC9B,MAAU,SAAA,EAAA,CAAA;AAAA,KACZ;AAAA,GACC,EAAA,CAAC,SAAW,EAAA,WAAW,CAAC,CAAA,CAAA;AAE3B,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAA,UAAA,CAAW,WAAW,GAAI,CAAA,CAAA;AAAA,GAC5B,EAAG,CAAC,SAAS,CAAC,CAAA,CAAA;AAEd,EAAA,OAAO,YAAY,CACjB,mBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,WACd,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA,EAAK,QAAU,EAAA,YAAA,EAAA,CAAA,EAClB,oBAEC,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,SAAA,EACd,+BAAC,MAAK,EAAA,EAAA,QAAA,EAAA;AAAA,IAAA,WAAA;AAAA,IAAU,OAAA;AAAA,IAAQ,UAAA;AAAA,GAAA,EAAQ,CAClC,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/esm/connection-status/ConnectionStateDisplay.css.js ADDED Viewed

@@ -0,0 +1,4 @@
+var connectionStateDisplayCss = ".vuuConnectionStateDisplay {\n  --ballbox-height: 24px;\n  --message-height: 14px;\n  --row-gap: 3px;\n  --top-row: calc(var(--ballbox-height) + var(--message-height));\n  --bottom-row: 0px;\n\n  align-items: center;\n  background: var(--salt-container-secondary-background);\n  column-gap: var(--salt-spacing-200);\n  display: grid;\n  grid-template-columns: auto 1fr;\n  grid-template-rows: var(--top-row) var(--bottom-row);\n  justify-items: end;\n  height: calc(var(--ballbox-height) + var(--message-height) + var(--row-gap));\n  padding: 0 var(--salt-spacing-200);\n  transition: grid-template-rows 0.4s linear;\n  row-gap: var(--row-gap);\n  width: max-content;\n\n  .vuuTrafficLightControl {\n    grid-area: 1/2/2/3;\n    padding-left: 20px;\n  }\n\n  &.vuuConnectionStateDisplay-disconnected {\n    --top-row: var(--ballbox-height);\n    --bottom-row: var(--message-height);\n  }\n\n  .vuuConnectionRetryCountdown {\n    color: var(--salt-content-secondary-foreground);\n    grid-area: 2/2/3/3;\n    font-size: 11px;\n    text-align: end;\n    width: 100%;\n  }\n}\n\n.vuuConnectionStateDisplay-text {\n  grid-area: 1/1/2/2;\n  text-transform: capitalize;\n}\n";
+export { connectionStateDisplayCss as default };
+//# sourceMappingURL=ConnectionStateDisplay.css.js.map

package/esm/connection-status/ConnectionStateDisplay.css.js.map ADDED Viewed

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

package/esm/connection-status/ConnectionStateDisplay.js ADDED Viewed

@@ -0,0 +1,63 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { ConnectionManager } from '@vuu-ui/vuu-data-remote';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { useState, useMemo } from 'react';
+import { ConnectionRetryCountdown } from './ConnectionRetryCountdown.js';
+import { ConnectionStatusIndicator } from './ConnectionStatusIndicator.js';
+import cx from 'clsx';
+import connectionStateDisplayCss from './ConnectionStateDisplay.css.js';
+const classBase = "vuuConnectionStateDisplay";
+const DefaultConnectionState = {
+  connectionPhase: "connecting",
+  connectionStatus: "closed",
+  secondsToNextRetry: -1,
+  retryAttemptsRemaining: 0,
+  retryAttemptsTotal: 1
+};
+const getDisplayText = (connectionState) => {
+  switch (connectionState.connectionStatus) {
+    case "closed":
+      return "Unable to connect to data service";
+    case "failed":
+      return connectionState.connectionPhase === "connecting" ? "Failed to connect" : "Failed to re-connect";
+    case "disconnected":
+      return connectionState.connectionPhase === "connecting" ? "Attempting to connect to data service" : "Attempting to reconnect to data service";
+  }
+};
+const ConnectionStateDisplay = ({
+  connectionState: connectionStateProp,
+  showText = true,
+  ...htmlAttributes
+}) => {
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "vuu-connection-status-indicator",
+    css: connectionStateDisplayCss,
+    window: targetWindow
+  });
+  const [connectionState, setConnectionState] = useState(DefaultConnectionState);
+  useMemo(() => {
+    ConnectionManager.on("connection-status", setConnectionState);
+    if (connectionStateProp) {
+      setConnectionState(connectionStateProp);
+    }
+  }, [connectionStateProp]);
+  const { connectionStatus, secondsToNextRetry } = connectionState;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...htmlAttributes,
+      className: cx(classBase, `${classBase}-${connectionStatus}`),
+      children: [
+        showText ? /* @__PURE__ */ jsx("div", { className: `${classBase}-text`, children: getDisplayText(connectionState) }) : null,
+        connectionStatus === "disconnected" && secondsToNextRetry > 0 ? /* @__PURE__ */ jsx(ConnectionRetryCountdown, { seconds: secondsToNextRetry }) : null,
+        /* @__PURE__ */ jsx(ConnectionStatusIndicator, { connectionState })
+      ]
+    }
+  );
+};
+export { ConnectionStateDisplay };
+//# sourceMappingURL=ConnectionStateDisplay.js.map

package/esm/connection-status/ConnectionStateDisplay.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ConnectionStateDisplay.js","sources":["../../src/connection-status/ConnectionStateDisplay.tsx"],"sourcesContent":["import { ConnectionManager } from \"@vuu-ui/vuu-data-remote\";\nimport type { WebSocketConnectionState } from \"@vuu-ui/vuu-data-remote/src/WebSocketConnection\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, useMemo, useState } from \"react\";\nimport { ConnectionRetryCountdown } from \"./ConnectionRetryCountdown\";\nimport { ConnectionStatusIndicator } from \"./ConnectionStatusIndicator\";\nimport cx from \"clsx\";\n\nimport connectionStateDisplayCss from \"./ConnectionStateDisplay.css\";\n\nconst classBase = \"vuuConnectionStateDisplay\";\n\nconst DefaultConnectionState: WebSocketConnectionState = {\n connectionPhase: \"connecting\",\n connectionStatus: \"closed\",\n secondsToNextRetry: -1,\n retryAttemptsRemaining: 0,\n retryAttemptsTotal: 1,\n};\n\ninterface ConnectionStateDisplayProps extends HTMLAttributes<HTMLDivElement> {\n className?: string;\n connectionState?: WebSocketConnectionState;\n showText?: boolean;\n}\n\nconst getDisplayText = (connectionState: WebSocketConnectionState) => {\n switch (connectionState.connectionStatus) {\n case \"closed\":\n return \"Unable to connect to data service\";\n case \"failed\":\n return connectionState.connectionPhase === \"connecting\"\n ? \"Failed to connect\"\n : \"Failed to re-connect\";\n\n case \"disconnected\":\n return connectionState.connectionPhase === \"connecting\"\n ? \"Attempting to connect to data service\"\n : \"Attempting to reconnect to data service\";\n }\n};\n\nexport const ConnectionStateDisplay = ({\n connectionState: connectionStateProp,\n showText = true,\n ...htmlAttributes\n}: ConnectionStateDisplayProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-connection-status-indicator\",\n css: connectionStateDisplayCss,\n window: targetWindow,\n });\n const [connectionState, setConnectionState] =\n useState<WebSocketConnectionState>(DefaultConnectionState);\n\n useMemo(() => {\n ConnectionManager.on(\"connection-status\", setConnectionState);\n if (connectionStateProp) {\n setConnectionState(connectionStateProp);\n }\n }, [connectionStateProp]);\n\n const { connectionStatus, secondsToNextRetry } = connectionState;\n\n return (\n <div\n {...htmlAttributes}\n className={cx(classBase, `${classBase}-${connectionStatus}`)}\n >\n {showText ? (\n <div className={`${classBase}-text`}>\n {getDisplayText(connectionState)}\n </div>\n ) : null}\n {connectionStatus === \"disconnected\" && secondsToNextRetry > 0 ? (\n <ConnectionRetryCountdown seconds={secondsToNextRetry} />\n ) : null}\n <ConnectionStatusIndicator connectionState={connectionState} />\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAWA,MAAM,SAAY,GAAA,2BAAA,CAAA;AAElB,MAAM,sBAAmD,GAAA;AAAA,EACvD,eAAiB,EAAA,YAAA;AAAA,EACjB,gBAAkB,EAAA,QAAA;AAAA,EAClB,kBAAoB,EAAA,CAAA,CAAA;AAAA,EACpB,sBAAwB,EAAA,CAAA;AAAA,EACxB,kBAAoB,EAAA,CAAA;AACtB,CAAA,CAAA;AAQA,MAAM,cAAA,GAAiB,CAAC,eAA8C,KAAA;AACpE,EAAA,QAAQ,gBAAgB,gBAAkB;AAAA,IACxC,KAAK,QAAA;AACH,MAAO,OAAA,mCAAA,CAAA;AAAA,IACT,KAAK,QAAA;AACH,MAAO,OAAA,eAAA,CAAgB,eAAoB,KAAA,YAAA,GACvC,mBACA,GAAA,sBAAA,CAAA;AAAA,IAEN,KAAK,cAAA;AACH,MAAO,OAAA,eAAA,CAAgB,eAAoB,KAAA,YAAA,GACvC,uCACA,GAAA,yCAAA,CAAA;AAAA,GACR;AACF,CAAA,CAAA;AAEO,MAAM,yBAAyB,CAAC;AAAA,EACrC,eAAiB,EAAA,mBAAA;AAAA,EACjB,QAAW,GAAA,IAAA;AAAA,EACX,GAAG,cAAA;AACL,CAAmC,KAAA;AACjC,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iCAAA;AAAA,IACR,GAAK,EAAA,yBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AACD,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GACxC,SAAmC,sBAAsB,CAAA,CAAA;AAE3D,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAkB,iBAAA,CAAA,EAAA,CAAG,qBAAqB,kBAAkB,CAAA,CAAA;AAC5D,IAAA,IAAI,mBAAqB,EAAA;AACvB,MAAA,kBAAA,CAAmB,mBAAmB,CAAA,CAAA;AAAA,KACxC;AAAA,GACF,EAAG,CAAC,mBAAmB,CAAC,CAAA,CAAA;AAExB,EAAM,MAAA,EAAE,gBAAkB,EAAA,kBAAA,EAAuB,GAAA,eAAA,CAAA;AAEjD,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,WAAW,EAAG,CAAA,SAAA,EAAW,GAAG,SAAS,CAAA,CAAA,EAAI,gBAAgB,CAAE,CAAA,CAAA;AAAA,MAE1D,QAAA,EAAA;AAAA,QACC,QAAA,mBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CACzB,KAAA,CAAA,EAAA,QAAA,EAAA,cAAA,CAAe,eAAe,CAAA,EACjC,CACE,GAAA,IAAA;AAAA,QACH,gBAAA,KAAqB,kBAAkB,kBAAqB,GAAA,CAAA,uBAC1D,wBAAyB,EAAA,EAAA,OAAA,EAAS,oBAAoB,CACrD,GAAA,IAAA;AAAA,wBACJ,GAAA,CAAC,6BAA0B,eAAkC,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAC/D,CAAA;AAEJ;;;;"}