@vuu-ui/vuu-shell 0.6.24-debug → 0.6.25-debug

package/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../packages/vuu-shell/src/feature/Feature.tsx", "../../../packages/vuu-shell/src/feature/ErrorBoundary.jsx", "../../../packages/vuu-shell/src/feature/Loader.tsx", "../../../packages/vuu-shell/src/feature/css-module-loader.ts", "../../../packages/vuu-shell/src/login/LoginPanel.tsx", "../../../packages/vuu-shell/src/login/login-utils.ts", "../../../packages/vuu-shell/src/shell.tsx", "../../../packages/vuu-shell/src/use-layout-config.js", "../../../packages/vuu-shell/src/ShellContextProvider.tsx", "../../../packages/vuu-shell/src/app-header/AppHeader.tsx", "../../../packages/vuu-shell/src/user-profile/UserProfile.tsx", "../../../packages/vuu-shell/src/user-profile/UserPanel.tsx", "../../../packages/vuu-shell/src/get-layout-history.ts", "../../../packages/vuu-shell/src/theme-switch/ThemeSwitch.tsx"],
-  "sourcesContent": ["import React, { Suspense } from \"react\";\nimport { registerComponent } from \"@vuu-ui/vuu-layout\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { Loader } from \"./Loader\";\nimport { importCSS } from \"./css-module-loader\";\n\nexport interface FeatureProps<Params extends object | undefined = undefined> {\n  height?: number;\n  url: string;\n  css?: string;\n  width?: number;\n  params: Params;\n}\n\n// const RawFeature = <Params extends object | undefined>({\nfunction RawFeature<Params extends object | undefined>({\n  url,\n  css,\n  params,\n  ...props\n}: FeatureProps<Params>) {\n  if (css) {\n    // import(/* @vite-ignore */ css, { assert: { type: \"css\" } }).then(\n    //   (cssModule) => {\n    //     document.adoptedStyleSheets = [\n    //       ...document.adoptedStyleSheets,\n    //       cssModule.default,\n    //     ];\n    //   }\n    // );\n    // Polyfill until vite build supports import assertions\n    // Note: already fully supported in esbuild, so vite dev\n    importCSS(css).then((styleSheet) => {\n      document.adoptedStyleSheets = [\n        ...document.adoptedStyleSheets,\n        styleSheet,\n      ];\n    });\n  }\n  const LazyFeature = React.lazy(() => import(/* @vite-ignore */ url));\n  return (\n    <ErrorBoundary>\n      <Suspense fallback={<Loader />}>\n        <LazyFeature {...props} {...params} />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n\nexport const Feature = React.memo(RawFeature);\nFeature.displayName = \"Feature\";\nregisterComponent(\"Feature\", Feature, \"view\");\n", "import React from 'react';\n// TODO\nexport class ErrorBoundary extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = { errorMessage: null };\n  }\n\n  static getDerivedStateFromError(error) {\n    // Update state so the next render will show the fallback UI.\n    return { errorMessage: error.message };\n  }\n\n  componentDidCatch(error, errorInfo) {\n    // You can also log the error to an error reporting service\n    console.log(error, errorInfo);\n  }\n\n  render() {\n    if (this.state.errorMessage) {\n      return (\n        <>\n          <h1>Something went wrong.</h1>\n          <p>{this.state.errorMessage}</p>\n        </>\n      );\n    }\n\n    return this.props.children;\n  }\n}\n", "// TODO\nexport const Loader = () => <div className=\"hwLoader\">loading</div>;\n", "export const importCSS = async (path: string) => {\n  const container = new CSSStyleSheet();\n  return fetch(path)\n    .then((x) => x.text())\n    .then((x) => container.replace(x));\n};\n", "import { ChangeEvent, HTMLAttributes, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { FormField, Input } from \"@heswell/salt-lab\";\n\nimport \"./LoginPanel.css\";\n\nconst classBase = \"vuuLoginPanel\";\n\nexport interface LoginPanelProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onSubmit\"> {\n  onSubmit: (username: string, password: string) => void;\n}\n\nexport const LoginPanel = ({ onSubmit }: LoginPanelProps) => {\n  const [username, setUserName] = useState(\"\");\n  const [password, setPassword] = useState(\"\");\n\n  const login = () => {\n    onSubmit(username, password);\n  };\n\n  const handleUsername = (\n    _event: ChangeEvent<HTMLInputElement>,\n    value: string\n  ) => {\n    setUserName(value);\n  };\n\n  const handlePassword = (\n    _event: ChangeEvent<HTMLInputElement>,\n    value: string\n  ) => {\n    setPassword(value);\n  };\n\n  const dataIsValid = username.trim() !== \"\" && password.trim() !== \"\";\n\n  return (\n    <div className={classBase}>\n      <FormField label=\"Username\" style={{ width: 200 }}>\n        <Input value={username} id=\"text-username\" onChange={handleUsername} />\n      </FormField>\n\n      <FormField label=\"Password\" style={{ width: 200 }}>\n        <Input\n          type=\"password\"\n          value={password}\n          id=\"text-password\"\n          onChange={handlePassword}\n        />\n      </FormField>\n\n      <Button\n        className={`${classBase}-login`}\n        disabled={!dataIsValid}\n        onClick={login}\n        variant=\"cta\"\n      >\n        Login\n      </Button>\n    </div>\n  );\n};\n", "import { getCookieValue } from \"@vuu-ui/vuu-utils\";\n\nexport const getAuthDetailsFromCookies = () => {\n  const username = getCookieValue(\"vuu-username\");\n  const token = getCookieValue(\"vuu-auth-token\");\n  return [username, token];\n};\n\nexport const redirectToLogin = (loginUrl = \"/login.html\") => {\n  window.location.href = loginUrl;\n};\n\nexport const logout = (loginUrl?: string) => {\n  document.cookie = \"vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n  document.cookie = \"vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n  redirectToLogin(loginUrl);\n};\n", "import { connectToServer } from \"@vuu-ui/vuu-data\";\nimport {\n  HTMLAttributes,\n  MouseEvent,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport useLayoutConfig from \"./use-layout-config\";\nimport { ShellContextProvider } from \"./ShellContextProvider\";\nimport cx from \"classnames\";\n\nimport {\n  Chest,\n  DraggableLayout,\n  Drawer,\n  Flexbox,\n  LayoutProvider,\n  View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { AppHeader } from \"./app-header\";\n\nimport { LayoutJSON } from \"@vuu-ui/vuu-layout/src/layout-reducer\";\nimport \"./shell.css\";\nimport { ThemeMode } from \"./theme-switch\";\n\nexport type VuuUser = {\n  username: string;\n  token: string;\n};\n\nconst warningLayout = {\n  type: \"View\",\n  props: {\n    style: { height: \"calc(100% - 6px)\" },\n  },\n  children: [\n    {\n      props: {\n        className: \"vuuShell-warningPlaceholder\",\n      },\n      type: \"Placeholder\",\n    },\n  ],\n};\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  defaultLayout?: LayoutJSON;\n  leftSidePanel?: ReactElement;\n  loginUrl?: string;\n  // paletteConfig: any;\n  serverUrl?: string;\n  user: VuuUser;\n}\n\nexport const Shell = ({\n  children,\n  className: classNameProp,\n  defaultLayout = warningLayout,\n  leftSidePanel,\n  loginUrl,\n  serverUrl,\n  user,\n  ...htmlAttributes\n}: ShellProps) => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const [density] = useState<\"high\" | \"medium\" | \"low\" | \"touch\">(\"high\");\n  const paletteView = useRef<HTMLDivElement>(null);\n  const [open, setOpen] = useState(false);\n  const layoutId = useRef(\"latest\");\n\n  const [layout, setLayoutConfig, loadLayoutById] = useLayoutConfig(\n    user,\n    defaultLayout\n  );\n\n  const handleLayoutChange = useCallback(\n    (layout) => {\n      setLayoutConfig(layout);\n    },\n    [setLayoutConfig]\n  );\n\n  const handleSwitchTheme = useCallback((mode: ThemeMode) => {\n    if (rootRef.current) {\n      rootRef.current.dataset.mode = mode;\n    }\n  }, []);\n\n  const handleDrawerClick = (e: MouseEvent<HTMLElement>) => {\n    const target = e.target as HTMLElement;\n    if (!paletteView.current?.contains(target)) {\n      setOpen(!open);\n    }\n  };\n\n  const handleNavigate = useCallback(\n    (id) => {\n      layoutId.current = id;\n      loadLayoutById(id);\n    },\n    [loadLayoutById]\n  );\n\n  useEffect(() => {\n    if (serverUrl && user.token) {\n      connectToServer(serverUrl, user.token);\n    }\n  }, [serverUrl, user.token]);\n\n  const getDrawers = () => {\n    const drawers: ReactElement[] = [];\n    if (leftSidePanel) {\n      drawers.push(\n        <Drawer\n          key=\"left-panel\"\n          onClick={handleDrawerClick}\n          open={open}\n          position=\"left\"\n          inline\n          peekaboo\n          sizeOpen={200}\n          toggleButton=\"end\"\n        >\n          <View\n            className=\"vuuShell-palette\"\n            id=\"vw-app-palette\"\n            key=\"app-palette\"\n            ref={paletteView}\n            style={{ height: \"100%\" }}\n          >\n            {leftSidePanel}\n          </View>\n        </Drawer>\n      );\n    }\n\n    return drawers;\n  };\n\n  const className = cx(\n    \"vuuShell\",\n    classNameProp,\n    \"salt-theme\",\n    `salt-density-${density}`\n  );\n\n  return (\n    // ShellContext TBD\n    <ShellContextProvider value={undefined}>\n      <LayoutProvider layout={layout} onLayoutChange={handleLayoutChange}>\n        <DraggableLayout\n          className={className}\n          data-mode=\"light\"\n          ref={rootRef}\n          {...htmlAttributes}\n        >\n          <Flexbox\n            className=\"App\"\n            style={{ flexDirection: \"column\", height: \"100%\", width: \"100%\" }}\n          >\n            <AppHeader\n              layoutId={layoutId.current}\n              loginUrl={loginUrl}\n              user={user}\n              onNavigate={handleNavigate}\n              onSwitchTheme={handleSwitchTheme}\n            />\n            <Chest style={{ flex: 1 }}>\n              {getDrawers().concat(\n                <DraggableLayout\n                  dropTarget\n                  key=\"main-content\"\n                  style={{ width: \"100%\", height: \"100%\" }}\n                />\n              )}\n            </Chest>\n          </Flexbox>\n        </DraggableLayout>\n      </LayoutProvider>\n      {children}\n    </ShellContextProvider>\n  );\n};\n", "import { useCallback, useEffect, useState } from \"react\";\n\nconst useLayoutConfig = (user, defaultLayout) => {\n  const [layout, _setLayout] = useState(defaultLayout);\n\n  const setLayout = (layout) => {\n    _setLayout(layout);\n  };\n\n  const load = useCallback(\n    async (id = \"latest\") => {\n      fetch(`api/vui/${user.username}/${id}`, {})\n        .then((response) => {\n          return response.ok ? response.json() : defaultLayout;\n        })\n        .then(setLayout)\n        .catch(() => {\n          // TODO we should set a layout with a warning here\n          setLayout(defaultLayout);\n        });\n    },\n    [defaultLayout, user.username]\n  );\n\n  useEffect(() => {\n    load();\n  }, [load]);\n\n  const saveData = useCallback(\n    (data) => {\n      fetch(`api/vui/${user.username}`, {\n        method: \"POST\",\n        headers: {\n          \"Content-Type\": \"application/json\",\n        },\n        body: JSON.stringify(data),\n      }).then((response) => {\n        return response.ok ? response.json() : defaultLayout;\n      });\n    },\n    [defaultLayout, user]\n  );\n\n  const loadLayoutById = useCallback(\n    (id) => {\n      load(id);\n    },\n    [load]\n  );\n\n  return [layout, saveData, loadLayoutById];\n};\n\nexport default useLayoutConfig;\n", "import { MenuRpcResponse } from \"@vuu-ui/vuu-data\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-datagrid-types\";\nimport { createContext, ReactElement, ReactNode, useContext } from \"react\";\n\nexport interface ShellContextProps {\n  getDefaultColumnConfig?: (\n    tableName: string,\n    columnName: string\n  ) => Partial<ColumnDescriptor>;\n  handleRpcResponse?: (response?: MenuRpcResponse) => void;\n}\n\nconst defaultConfig = {};\n\nconst ShellContext = createContext<ShellContextProps>(defaultConfig);\n\nexport interface ShellProviderProps {\n  children: ReactNode;\n  value?: ShellContextProps;\n}\n\nconst Provider = ({\n  children,\n  context,\n  inheritedContext,\n}: {\n  children: ReactNode;\n  context?: ShellContextProps;\n  inheritedContext?: ShellContextProps;\n}) => {\n  // TODO functions provided at multiple levels must be merged\n  const mergedContext = {\n    ...inheritedContext,\n    ...context,\n  };\n  return (\n    <ShellContext.Provider value={mergedContext}>\n      {children}\n    </ShellContext.Provider>\n  );\n};\n\nexport const ShellContextProvider = ({\n  children,\n  value,\n}: ShellProviderProps): ReactElement => {\n  return (\n    <ShellContext.Consumer>\n      {(context) => (\n        <Provider context={value} inheritedContext={context}>\n          {children}\n        </Provider>\n      )}\n    </ShellContext.Consumer>\n  );\n};\n\nexport const useShellContext = () => {\n  return useContext(ShellContext);\n};\n", "import { HTMLAttributes, useCallback } from \"react\";\nimport { VuuUser } from \"../shell\";\nimport { UserProfile } from \"../user-profile\";\nimport { ThemeMode, ThemeSwitch } from \"../theme-switch\";\nimport cx from \"classnames\";\n\nimport \"./AppHeader.css\";\n\nconst classBase = \"vuuAppHeader\";\nexport interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  layoutId: string;\n  loginUrl?: string;\n  onNavigate: (id: string) => void;\n  onSwitchTheme?: (mode: ThemeMode) => void;\n  themeMode?: ThemeMode;\n  user: VuuUser;\n}\n\nexport const AppHeader = ({\n  className: classNameProp,\n  layoutId,\n  loginUrl,\n  onNavigate,\n  onSwitchTheme,\n  themeMode = \"light\",\n  user,\n  ...htmlAttributes\n}: AppHeaderProps) => {\n  const className = cx(classBase, classNameProp, \"salt-density-medium\");\n  const handleSwitchTheme = useCallback(\n    (mode: ThemeMode) => onSwitchTheme?.(mode),\n    [onSwitchTheme]\n  );\n  return (\n    <header className={className} {...htmlAttributes}>\n      <ThemeSwitch defaultMode={themeMode} onChange={handleSwitchTheme} />\n      <UserProfile\n        layoutId={layoutId}\n        loginUrl={loginUrl}\n        onNavigate={onNavigate}\n        user={user}\n      />\n    </header>\n  );\n};\n", "import { Button } from \"@salt-ds/core\";\nimport { DropdownBase } from \"@heswell/salt-lab\";\nimport { UserSolidIcon } from \"@salt-ds/icons\";\nimport { UserPanel } from \"./UserPanel\";\n\nimport \"./UserProfile.css\";\nimport { VuuUser } from \"../shell\";\n\nexport interface UserProfileProps {\n  layoutId: string;\n  loginUrl?: string;\n  onNavigate: (id: string) => void;\n  user: VuuUser;\n}\n\nexport const UserProfile = ({\n  layoutId,\n  loginUrl,\n  onNavigate,\n  user,\n}: UserProfileProps) => {\n  const handleNavigate = (id: string) => {\n    onNavigate(id);\n  };\n\n  return (\n    <DropdownBase className=\"vuuUserProfile\" placement=\"bottom-end\">\n      <Button variant=\"secondary\">\n        <UserSolidIcon />\n      </Button>\n      <UserPanel\n        layoutId={layoutId}\n        loginUrl={loginUrl}\n        onNavigate={handleNavigate}\n        user={user}\n      />\n    </DropdownBase>\n  );\n};\n", "import { formatDate } from \"@vuu-ui/vuu-utils\";\nimport { List, ListItem, ListItemProps } from \"@heswell/salt-lab\";\nimport { Button } from \"@salt-ds/core\";\nimport { ExportIcon } from \"@salt-ds/icons\";\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useState,\n} from \"react\";\nimport { getLayoutHistory, LayoutHistoryItem } from \"../get-layout-history\";\nimport { logout } from \"../login\";\nimport { VuuUser } from \"../shell\";\n\nimport \"./UserPanel.css\";\n\nconst byLastUpdate = (\n  { lastUpdate: l1 }: LayoutHistoryItem,\n  { lastUpdate: l2 }: LayoutHistoryItem\n) => {\n  return l2 === l1 ? 0 : l2 < l1 ? -1 : 1;\n};\n\ntype HistoryEntry = {\n  id: string;\n  label: string;\n  lastUpdate: number;\n};\n\nconst HistoryListItem = (props: ListItemProps<HistoryEntry>) => {\n  return <ListItem {...props} />;\n};\n\nexport interface UserPanelProps extends HTMLAttributes<HTMLDivElement> {\n  loginUrl?: string;\n  onNavigate: (id: string) => void;\n  user: VuuUser;\n  layoutId: string;\n}\n\nexport const UserPanel = forwardRef(function UserPanel(\n  { loginUrl, onNavigate, user, layoutId = \"latest\" }: UserPanelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const [history, setHistory] = useState<HistoryEntry[]>([]);\n\n  useEffect(() => {\n    async function getHistory() {\n      const history = await getLayoutHistory(user);\n      const sortedHistory = history\n        .filter((item) => item.id !== \"latest\")\n        .sort(byLastUpdate)\n        .map<HistoryEntry>(({ id, lastUpdate }) => ({\n          lastUpdate,\n          id,\n          label: `Saved at ${formatDate(new Date(lastUpdate), \"kk:mm:ss\")}`,\n        }));\n      console.log({ sortedHistory });\n      setHistory(sortedHistory);\n    }\n\n    getHistory();\n  }, [user]);\n\n  const handleHisorySelected = useCallback(\n    (evt, selected) => {\n      if (selected) {\n        onNavigate(selected.id);\n      }\n    },\n    [onNavigate]\n  );\n\n  const handleLogout = useCallback(() => {\n    logout(loginUrl);\n  }, [loginUrl]);\n\n  const selected =\n    history.length === 0\n      ? null\n      : layoutId === \"latest\"\n      ? history[0]\n      : history.find((i) => i.id === layoutId);\n\n  return (\n    <div className=\"vuuUserPanel\" ref={forwardedRef}>\n      <List<HistoryEntry>\n        ListItem={HistoryListItem}\n        className=\"vuuUserPanel-history\"\n        onSelect={handleHisorySelected}\n        selected={selected}\n        source={history}\n      />\n      <div className=\"vuuUserPanel-buttonBar\">\n        <Button aria-label=\"logout\" onClick={handleLogout}>\n          <ExportIcon /> Logout\n        </Button>\n      </div>\n    </div>\n  );\n});\n", "import { VuuUser } from \"./shell\";\n\nexport interface LayoutHistoryItem {\n  user: string;\n  id: string;\n  uniqueId: string;\n  lastUpdate: number;\n}\n\nexport const getLayoutHistory = async (\n  user: VuuUser\n): Promise<LayoutHistoryItem[]> => {\n  const history = await fetch(`api/vui/${user.username}`, {})\n    .then((response) => {\n      return response.ok ? response.json() : null;\n    })\n    .catch(() => {\n      // TODO we should set a layout with a warning here\n      console.log(\"error getting history\");\n    });\n\n  return history;\n};\n", "import {\n  ToggleButton,\n  ToggleButtonGroup,\n  ToggleButtonGroupChangeEventHandler,\n} from \"@heswell/salt-lab\";\nimport cx from \"classnames\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\n\nexport type ThemeMode = \"light\" | \"dark\";\n\nexport interface ThemeSwitchProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  defaultMode?: ThemeMode;\n  mode?: ThemeMode;\n  onChange: (mode: ThemeMode) => void;\n}\n\nconst modes: ThemeMode[] = [\"light\", \"dark\"];\n\nexport const ThemeSwitch = ({\n  className: classNameProp,\n  defaultMode: defaultModeProp,\n  mode: modeProp,\n  onChange,\n  ...htmlAttributes\n}: ThemeSwitchProps) => {\n  const [mode, setMode] = useControlled<ThemeMode>({\n    controlled: modeProp,\n    default: defaultModeProp ?? \"light\",\n    name: \"ThemeSwitch\",\n    state: \"mode\",\n  });\n\n  const selectedIndex = modes.indexOf(mode);\n\n  const handleChangeSecondary: ToggleButtonGroupChangeEventHandler =\n    useCallback(\n      (_evt, index) => {\n        const mode = modes[index];\n        setMode(mode);\n        onChange(mode);\n      },\n      [onChange, setMode]\n    );\n  const className = cx(classBase, classNameProp);\n  return (\n    <ToggleButtonGroup\n      className={className}\n      {...htmlAttributes}\n      onChange={handleChangeSecondary}\n      selectedIndex={selectedIndex}\n    >\n      <ToggleButton\n        aria-label=\"alert\"\n        tooltipText=\"Light Theme\"\n        data-icon=\"light\"\n      />\n      <ToggleButton\n        aria-label=\"home\"\n        tooltipText=\"Dark Theme\"\n        data-icon=\"dark\"\n      />\n    </ToggleButtonGroup>\n  );\n};\n"],
-  "mappings": "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",
-  "names": ["React", "jsx", "jsx", "React", "jsx", "jsxs", "useCallback", "useEffect", "useState", "useState", "layout", "jsx", "cx", "useCallback", "Button", "Button", "useCallback", "useEffect", "useState", "jsx", "jsxs", "UserPanel", "useState", "useEffect", "history", "useCallback", "selected", "Button", "jsx", "jsxs", "Button", "useCallback", "jsx", "jsxs", "classBase", "useCallback", "mode", "cx", "jsx", "jsxs", "classBase", "cx", "useCallback", "jsx", "jsxs", "useState", "useCallback", "layout", "useEffect", "cx"]
+  "sources": ["../../../packages/vuu-shell/src/connection-status/ConnectionStatusIcon.tsx", "../../../packages/vuu-shell/src/feature/Feature.tsx", "../../../packages/vuu-shell/src/feature/ErrorBoundary.jsx", "../../../packages/vuu-shell/src/feature/Loader.tsx", "../../../packages/vuu-shell/src/feature/css-module-loader.ts", "../../../packages/vuu-shell/src/login/LoginPanel.tsx", "../../../packages/vuu-shell/src/login/login-utils.ts", "../../../packages/vuu-shell/src/shell.tsx", "../../../packages/vuu-shell/src/use-layout-config.js", "../../../packages/vuu-shell/src/ShellContextProvider.tsx", "../../../packages/vuu-shell/src/app-header/AppHeader.tsx", "../../../packages/vuu-shell/src/user-profile/UserProfile.tsx", "../../../packages/vuu-shell/src/user-profile/UserPanel.tsx", "../../../packages/vuu-shell/src/get-layout-history.ts", "../../../packages/vuu-shell/src/theme-switch/ThemeSwitch.tsx", "../../../packages/vuu-shell/src/density-switch/DensitySwitch.tsx"],
+  "sourcesContent": ["import React, { useEffect, useState } from 'react';\nimport cx from 'classnames';\nimport './ConnectionStatusIcon.css';\n\ntype connectionStatus = 'connected' | 'reconnected' | 'connecting' | 'disconnected';\n\ninterface ConnectionStatusProps {\n\tconnectionStatus: connectionStatus\n\tclassName?: string;\n\tprops?: unknown;\n\telement?: string;\n}\n\nexport const ConnectionStatusIcon = ({ connectionStatus, className, element = 'span', ...props}: ConnectionStatusProps) => {\n\tconst [classBase, setClassBase] = useState<string>('vuuConnectingStatus');\n\tuseEffect(() => {\n\t\tswitch(connectionStatus) {\n\t\t\tcase 'connected':\n\t\t\tcase 'reconnected':\n\t\t\t\tsetClassBase('vuuActiveStatus');\n\t\t\t\tbreak;\n\t\t\tcase 'connecting':\n\t\t\t\tsetClassBase('vuuConnectingStatus');\n\t\t\t\tbreak;\n\t\t\tcase 'disconnected':\n\t\t\t\tsetClassBase('vuuDisconnectedStatus');\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\t}, [connectionStatus]);\n\n\tconst statusIcon = React.createElement (\n\t\telement,\n\t\t{\n\t\t\t...props,\n\t\t\tclassName: cx('vuuStatus vuuIcon', classBase, className)\n\t\t},\n\t)\n\n\treturn (\n\t\t<>\n\t\t\t<div className='vuuStatus-container salt-theme'>\n\t\t\t\t{statusIcon}\n\t\t\t\t<div\tclassName='vuuStatus-text'>Status: {connectionStatus.toUpperCase()}</div>\n\t\t\t</div>\n\t\t</>\n\t)\n}", "import React, { Suspense } from \"react\";\nimport { registerComponent } from \"@vuu-ui/vuu-layout\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { Loader } from \"./Loader\";\nimport { importCSS } from \"./css-module-loader\";\n\nexport interface FeatureProps<Params extends object | undefined = undefined> {\n  height?: number;\n  url: string;\n  css?: string;\n  width?: number;\n  params: Params;\n}\n\n// const RawFeature = <Params extends object | undefined>({\nfunction RawFeature<Params extends object | undefined>({\n  url,\n  css,\n  params,\n  ...props\n}: FeatureProps<Params>) {\n  if (css) {\n    // import(/* @vite-ignore */ css, { assert: { type: \"css\" } }).then(\n    //   (cssModule) => {\n    //     document.adoptedStyleSheets = [\n    //       ...document.adoptedStyleSheets,\n    //       cssModule.default,\n    //     ];\n    //   }\n    // );\n    // Polyfill until vite build supports import assertions\n    // Note: already fully supported in esbuild, so vite dev\n    importCSS(css).then((styleSheet) => {\n      document.adoptedStyleSheets = [\n        ...document.adoptedStyleSheets,\n        styleSheet,\n      ];\n    });\n  }\n  const LazyFeature = React.lazy(() => import(/* @vite-ignore */ url));\n  return (\n    <ErrorBoundary>\n      <Suspense fallback={<Loader />}>\n        <LazyFeature {...props} {...params} />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n\nexport const Feature = React.memo(RawFeature);\nFeature.displayName = \"Feature\";\nregisterComponent(\"Feature\", Feature, \"view\");\n", "import React from 'react';\n// TODO\nexport class ErrorBoundary extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = { errorMessage: null };\n  }\n\n  static getDerivedStateFromError(error) {\n    // Update state so the next render will show the fallback UI.\n    return { errorMessage: error.message };\n  }\n\n  componentDidCatch(error, errorInfo) {\n    // You can also log the error to an error reporting service\n    console.log(error, errorInfo);\n  }\n\n  render() {\n    if (this.state.errorMessage) {\n      return (\n        <>\n          <h1>Something went wrong.</h1>\n          <p>{this.state.errorMessage}</p>\n        </>\n      );\n    }\n\n    return this.props.children;\n  }\n}\n", "// TODO\nexport const Loader = () => <div className=\"hwLoader\">loading</div>;\n", "export const importCSS = async (path: string) => {\n  const container = new CSSStyleSheet();\n  return fetch(path)\n    .then((x) => x.text())\n    .then((x) => container.replace(x));\n};\n", "import { ChangeEvent, HTMLAttributes, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { FormField, Input } from \"@heswell/salt-lab\";\n\nimport \"./LoginPanel.css\";\n\nconst classBase = \"vuuLoginPanel\";\n\nexport interface LoginPanelProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onSubmit\"> {\n  onSubmit: (username: string, password: string) => void;\n}\n\nexport const LoginPanel = ({ onSubmit }: LoginPanelProps) => {\n  const [username, setUserName] = useState(\"\");\n  const [password, setPassword] = useState(\"\");\n\n  const login = () => {\n    onSubmit(username, password);\n  };\n\n  const handleUsername = (\n    _event: ChangeEvent<HTMLInputElement>,\n    value: string\n  ) => {\n    setUserName(value);\n  };\n\n  const handlePassword = (\n    _event: ChangeEvent<HTMLInputElement>,\n    value: string\n  ) => {\n    setPassword(value);\n  };\n\n  const dataIsValid = username.trim() !== \"\" && password.trim() !== \"\";\n\n  return (\n    <div className={classBase}>\n      <FormField label=\"Username\" style={{ width: 200 }}>\n        <Input value={username} id=\"text-username\" onChange={handleUsername} />\n      </FormField>\n\n      <FormField label=\"Password\" style={{ width: 200 }}>\n        <Input\n          type=\"password\"\n          value={password}\n          id=\"text-password\"\n          onChange={handlePassword}\n        />\n      </FormField>\n\n      <Button\n        className={`${classBase}-login`}\n        disabled={!dataIsValid}\n        onClick={login}\n        variant=\"cta\"\n      >\n        Login\n      </Button>\n    </div>\n  );\n};\n", "import { getCookieValue } from \"@vuu-ui/vuu-utils\";\n\nexport const getAuthDetailsFromCookies = () => {\n  const username = getCookieValue(\"vuu-username\");\n  const token = getCookieValue(\"vuu-auth-token\");\n  return [username, token];\n};\n\nexport const redirectToLogin = (loginUrl = \"/login.html\") => {\n  window.location.href = loginUrl;\n};\n\nexport const logout = (loginUrl?: string) => {\n  document.cookie = \"vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n  document.cookie = \"vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n  redirectToLogin(loginUrl);\n};\n", "import { connectToServer } from \"@vuu-ui/vuu-data\";\nimport {\n  HTMLAttributes,\n  MouseEvent,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport useLayoutConfig from \"./use-layout-config\";\nimport { ShellContextProvider } from \"./ShellContextProvider\";\nimport cx from \"classnames\";\n\nimport {\n  Chest,\n  DraggableLayout,\n  Drawer,\n  Flexbox,\n  LayoutProvider,\n  View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { AppHeader } from \"./app-header\";\n\nimport { LayoutJSON } from \"@vuu-ui/vuu-layout/src/layout-reducer\";\nimport \"./shell.css\";\nimport { ThemeMode } from \"./theme-switch\";\nimport { Density } from \"@salt-ds/core\";\n\nexport type VuuUser = {\n  username: string;\n  token: string;\n};\n\nconst warningLayout = {\n  type: \"View\",\n  props: {\n    style: { height: \"calc(100% - 6px)\" },\n  },\n  children: [\n    {\n      props: {\n        className: \"vuuShell-warningPlaceholder\",\n      },\n      type: \"Placeholder\",\n    },\n  ],\n};\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  defaultLayout?: LayoutJSON;\n  leftSidePanel?: ReactElement;\n  loginUrl?: string;\n  // paletteConfig: any;\n  serverUrl?: string;\n  user: VuuUser;\n}\n\nexport const Shell = ({\n  children,\n  className: classNameProp,\n  defaultLayout = warningLayout,\n  leftSidePanel,\n  loginUrl,\n  serverUrl,\n  user,\n  ...htmlAttributes\n}: ShellProps) => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const [density, setDensity] = useState<Density>(\"medium\");\n  const paletteView = useRef<HTMLDivElement>(null);\n  const [open, setOpen] = useState(false);\n  const layoutId = useRef(\"latest\");\n\n  const [layout, setLayoutConfig, loadLayoutById] = useLayoutConfig(\n    user,\n    defaultLayout\n  );\n\n  const handleLayoutChange = useCallback(\n    (layout) => {\n      setLayoutConfig(layout);\n    },\n    [setLayoutConfig]\n  );\n\n  const handleSwitchTheme = useCallback((mode: ThemeMode) => {\n    if (rootRef.current) {\n      rootRef.current.dataset.mode = mode;\n    }\n  }, []);\n\n  const handleDensitySwitch = useCallback(\n    (density: Density) => {\n      setDensity(density);\n    },\n    [setDensity]\n  );\n\n  const handleDrawerClick = (e: MouseEvent<HTMLElement>) => {\n    const target = e.target as HTMLElement;\n    if (!paletteView.current?.contains(target)) {\n      setOpen(!open);\n    }\n  };\n\n  const handleNavigate = useCallback(\n    (id) => {\n      layoutId.current = id;\n      loadLayoutById(id);\n    },\n    [loadLayoutById]\n  );\n\n  useEffect(() => {\n    if (serverUrl && user.token) {\n      connectToServer(serverUrl, user.token);\n    }\n  }, [serverUrl, user.token]);\n\n  const getDrawers = () => {\n    const drawers: ReactElement[] = [];\n    if (leftSidePanel) {\n      drawers.push(\n        <Drawer\n          key=\"left-panel\"\n          onClick={handleDrawerClick}\n          open={open}\n          position=\"left\"\n          inline\n          peekaboo\n          sizeOpen={200}\n          toggleButton=\"end\"\n        >\n          <View\n            className=\"vuuShell-palette\"\n            id=\"vw-app-palette\"\n            key=\"app-palette\"\n            ref={paletteView}\n            style={{ height: \"100%\" }}\n          >\n            {leftSidePanel}\n          </View>\n        </Drawer>\n      );\n    }\n\n    return drawers;\n  };\n\n  const className = cx(\n    \"vuuShell\",\n    classNameProp,\n    \"salt-theme\",\n    `salt-density-${density}`\n  );\n\n  return (\n    // ShellContext TBD\n    <ShellContextProvider value={undefined}>\n      <LayoutProvider layout={layout} onLayoutChange={handleLayoutChange}>\n        <DraggableLayout\n          className={className}\n          data-mode=\"light\"\n          ref={rootRef}\n          {...htmlAttributes}\n        >\n          <Flexbox\n            className=\"App\"\n            style={{ flexDirection: \"column\", height: \"100%\", width: \"100%\" }}\n          >\n            <AppHeader\n              layoutId={layoutId.current}\n              loginUrl={loginUrl}\n              user={user}\n              onNavigate={handleNavigate}\n              onSwitchTheme={handleSwitchTheme}\n              onDensitySwitch={handleDensitySwitch}\n            />\n            <Chest style={{ flex: 1 }}>\n              {getDrawers().concat(\n                <DraggableLayout\n                  dropTarget\n                  key=\"main-content\"\n                  style={{ width: \"100%\", height: \"100%\" }}\n                />\n              )}\n            </Chest>\n          </Flexbox>\n        </DraggableLayout>\n      </LayoutProvider>\n      {children}\n    </ShellContextProvider>\n  );\n};\n", "import { useCallback, useEffect, useState } from \"react\";\n\nconst useLayoutConfig = (user, defaultLayout) => {\n  const [layout, _setLayout] = useState(defaultLayout);\n\n  const setLayout = (layout) => {\n    _setLayout(layout);\n  };\n\n  const load = useCallback(\n    async (id = \"latest\") => {\n      fetch(`api/vui/${user.username}/${id}`, {})\n        .then((response) => {\n          return response.ok ? response.json() : defaultLayout;\n        })\n        .then(setLayout)\n        .catch(() => {\n          // TODO we should set a layout with a warning here\n          setLayout(defaultLayout);\n        });\n    },\n    [defaultLayout, user.username]\n  );\n\n  useEffect(() => {\n    load();\n  }, [load]);\n\n  const saveData = useCallback(\n    (data) => {\n      fetch(`api/vui/${user.username}`, {\n        method: \"POST\",\n        headers: {\n          \"Content-Type\": \"application/json\",\n        },\n        body: JSON.stringify(data),\n      }).then((response) => {\n        return response.ok ? response.json() : defaultLayout;\n      });\n    },\n    [defaultLayout, user]\n  );\n\n  const loadLayoutById = useCallback(\n    (id) => {\n      load(id);\n    },\n    [load]\n  );\n\n  return [layout, saveData, loadLayoutById];\n};\n\nexport default useLayoutConfig;\n", "import { MenuRpcResponse } from \"@vuu-ui/vuu-data\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-datagrid-types\";\nimport { createContext, ReactElement, ReactNode, useContext } from \"react\";\n\nexport interface ShellContextProps {\n  getDefaultColumnConfig?: (\n    tableName: string,\n    columnName: string\n  ) => Partial<ColumnDescriptor>;\n  handleRpcResponse?: (response?: MenuRpcResponse) => void;\n}\n\nconst defaultConfig = {};\n\nconst ShellContext = createContext<ShellContextProps>(defaultConfig);\n\nexport interface ShellProviderProps {\n  children: ReactNode;\n  value?: ShellContextProps;\n}\n\nconst Provider = ({\n  children,\n  context,\n  inheritedContext,\n}: {\n  children: ReactNode;\n  context?: ShellContextProps;\n  inheritedContext?: ShellContextProps;\n}) => {\n  // TODO functions provided at multiple levels must be merged\n  const mergedContext = {\n    ...inheritedContext,\n    ...context,\n  };\n  return (\n    <ShellContext.Provider value={mergedContext}>\n      {children}\n    </ShellContext.Provider>\n  );\n};\n\nexport const ShellContextProvider = ({\n  children,\n  value,\n}: ShellProviderProps): ReactElement => {\n  return (\n    <ShellContext.Consumer>\n      {(context) => (\n        <Provider context={value} inheritedContext={context}>\n          {children}\n        </Provider>\n      )}\n    </ShellContext.Consumer>\n  );\n};\n\nexport const useShellContext = () => {\n  return useContext(ShellContext);\n};\n", "import { HTMLAttributes, useCallback } from \"react\";\nimport { VuuUser } from \"../shell\";\nimport { UserProfile } from \"../user-profile\";\nimport { ThemeMode, ThemeSwitch } from \"../theme-switch\";\nimport cx from \"classnames\";\n\nimport \"./AppHeader.css\";\nimport { Density } from \"@salt-ds/core\";\nimport { DensitySwitch } from \"../density-switch\";\n\nconst classBase = \"vuuAppHeader\";\nexport interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  layoutId: string;\n  loginUrl?: string;\n  onNavigate: (id: string) => void;\n  onSwitchTheme?: (mode: ThemeMode) => void;\n  themeMode?: ThemeMode;\n  onDensitySwitch?: (density: Density) => void;\n  density?: Density\n  user: VuuUser;\n}\n\nexport const AppHeader = ({\n  className: classNameProp,\n  layoutId,\n  loginUrl,\n  onNavigate,\n  onSwitchTheme,\n  themeMode = \"light\",\n  onDensitySwitch,\n  density=\"medium\",\n  user,\n  ...htmlAttributes\n}: AppHeaderProps) => {\n  const className = cx(classBase, classNameProp, `salt-density-${density}`);\n  const handleSwitchTheme = useCallback(\n    (mode: ThemeMode) => onSwitchTheme?.(mode),\n    [onSwitchTheme]\n  );\n  const handleDensitySwitch = useCallback(\n    (density: Density) => onDensitySwitch?.(density),\n    [onDensitySwitch]\n  );\n  return (\n    <header className={className} {...htmlAttributes}>\n      <ThemeSwitch defaultMode={themeMode} onChange={handleSwitchTheme} />\n      <DensitySwitch defaultDensity={density} onDensityChange={handleDensitySwitch} />\n      <UserProfile\n        layoutId={layoutId}\n        loginUrl={loginUrl}\n        onNavigate={onNavigate}\n        user={user}\n      />\n    </header>\n  );\n};\n", "import { Button } from \"@salt-ds/core\";\nimport { DropdownBase } from \"@heswell/salt-lab\";\nimport { UserSolidIcon } from \"@salt-ds/icons\";\nimport { UserPanel } from \"./UserPanel\";\n\nimport \"./UserProfile.css\";\nimport { VuuUser } from \"../shell\";\n\nexport interface UserProfileProps {\n  layoutId: string;\n  loginUrl?: string;\n  onNavigate: (id: string) => void;\n  user: VuuUser;\n}\n\nexport const UserProfile = ({\n  layoutId,\n  loginUrl,\n  onNavigate,\n  user,\n}: UserProfileProps) => {\n  const handleNavigate = (id: string) => {\n    onNavigate(id);\n  };\n\n  return (\n    <DropdownBase className=\"vuuUserProfile\" placement=\"bottom-end\">\n      <Button variant=\"secondary\">\n        <UserSolidIcon />\n      </Button>\n      <UserPanel\n        layoutId={layoutId}\n        loginUrl={loginUrl}\n        onNavigate={handleNavigate}\n        user={user}\n      />\n    </DropdownBase>\n  );\n};\n", "import { formatDate } from \"@vuu-ui/vuu-utils\";\nimport { List, ListItem, ListItemProps } from \"@heswell/salt-lab\";\nimport { Button } from \"@salt-ds/core\";\nimport { ExportIcon } from \"@salt-ds/icons\";\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useState,\n} from \"react\";\nimport { getLayoutHistory, LayoutHistoryItem } from \"../get-layout-history\";\nimport { logout } from \"../login\";\nimport { VuuUser } from \"../shell\";\n\nimport \"./UserPanel.css\";\n\nconst byLastUpdate = (\n  { lastUpdate: l1 }: LayoutHistoryItem,\n  { lastUpdate: l2 }: LayoutHistoryItem\n) => {\n  return l2 === l1 ? 0 : l2 < l1 ? -1 : 1;\n};\n\ntype HistoryEntry = {\n  id: string;\n  label: string;\n  lastUpdate: number;\n};\n\nconst HistoryListItem = (props: ListItemProps<HistoryEntry>) => {\n  return <ListItem {...props} />;\n};\n\nexport interface UserPanelProps extends HTMLAttributes<HTMLDivElement> {\n  loginUrl?: string;\n  onNavigate: (id: string) => void;\n  user: VuuUser;\n  layoutId: string;\n}\n\nexport const UserPanel = forwardRef(function UserPanel(\n  { loginUrl, onNavigate, user, layoutId = \"latest\" }: UserPanelProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const [history, setHistory] = useState<HistoryEntry[]>([]);\n\n  useEffect(() => {\n    async function getHistory() {\n      const history = await getLayoutHistory(user);\n      const sortedHistory = history\n        .filter((item) => item.id !== \"latest\")\n        .sort(byLastUpdate)\n        .map<HistoryEntry>(({ id, lastUpdate }) => ({\n          lastUpdate,\n          id,\n          label: `Saved at ${formatDate(new Date(lastUpdate), \"kk:mm:ss\")}`,\n        }));\n      console.log({ sortedHistory });\n      setHistory(sortedHistory);\n    }\n\n    getHistory();\n  }, [user]);\n\n  const handleHisorySelected = useCallback(\n    (evt, selected) => {\n      if (selected) {\n        onNavigate(selected.id);\n      }\n    },\n    [onNavigate]\n  );\n\n  const handleLogout = useCallback(() => {\n    logout(loginUrl);\n  }, [loginUrl]);\n\n  const selected =\n    history.length === 0\n      ? null\n      : layoutId === \"latest\"\n      ? history[0]\n      : history.find((i) => i.id === layoutId);\n\n  return (\n    <div className=\"vuuUserPanel\" ref={forwardedRef}>\n      <List<HistoryEntry>\n        ListItem={HistoryListItem}\n        className=\"vuuUserPanel-history\"\n        onSelect={handleHisorySelected}\n        selected={selected}\n        source={history}\n      />\n      <div className=\"vuuUserPanel-buttonBar\">\n        <Button aria-label=\"logout\" onClick={handleLogout}>\n          <ExportIcon /> Logout\n        </Button>\n      </div>\n    </div>\n  );\n});\n", "import { VuuUser } from \"./shell\";\n\nexport interface LayoutHistoryItem {\n  user: string;\n  id: string;\n  uniqueId: string;\n  lastUpdate: number;\n}\n\nexport const getLayoutHistory = async (\n  user: VuuUser\n): Promise<LayoutHistoryItem[]> => {\n  const history = await fetch(`api/vui/${user.username}`, {})\n    .then((response) => {\n      return response.ok ? response.json() : null;\n    })\n    .catch(() => {\n      // TODO we should set a layout with a warning here\n      console.log(\"error getting history\");\n    });\n\n  return history;\n};\n", "import {\n  ToggleButton,\n  ToggleButtonGroup,\n  ToggleButtonGroupChangeEventHandler,\n} from \"@heswell/salt-lab\";\nimport cx from \"classnames\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\n\nexport type ThemeMode = \"light\" | \"dark\";\n\nexport interface ThemeSwitchProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  defaultMode?: ThemeMode;\n  mode?: ThemeMode;\n  onChange: (mode: ThemeMode) => void;\n}\n\nconst modes: ThemeMode[] = [\"light\", \"dark\"];\n\nexport const ThemeSwitch = ({\n  className: classNameProp,\n  defaultMode: defaultModeProp,\n  mode: modeProp,\n  onChange,\n  ...htmlAttributes\n}: ThemeSwitchProps) => {\n  const [mode, setMode] = useControlled<ThemeMode>({\n    controlled: modeProp,\n    default: defaultModeProp ?? \"light\",\n    name: \"ThemeSwitch\",\n    state: \"mode\",\n  });\n\n  const selectedIndex = modes.indexOf(mode);\n\n  const handleChangeSecondary: ToggleButtonGroupChangeEventHandler =\n    useCallback(\n      (_evt, index) => {\n        const mode = modes[index];\n        setMode(mode);\n        onChange(mode);\n      },\n      [onChange, setMode]\n    );\n  const className = cx(classBase, classNameProp);\n  return (\n    <ToggleButtonGroup\n      className={className}\n      {...htmlAttributes}\n      onChange={handleChangeSecondary}\n      selectedIndex={selectedIndex}\n    >\n      <ToggleButton\n        aria-label=\"alert\"\n        tooltipText=\"Light Theme\"\n        data-icon=\"light\"\n      />\n      <ToggleButton\n        aria-label=\"home\"\n        tooltipText=\"Dark Theme\"\n        data-icon=\"dark\"\n      />\n    </ToggleButtonGroup>\n  );\n};\n", "import { Dropdown, SelectionChangeHandler } from \"@heswell/salt-lab\";\nimport { DEFAULT_DENSITY, Density } from \"@salt-ds/core\";\nimport { HTMLAttributes, useCallback } from \"react\";\nimport cx from \"classnames\";\n\nconst classBase = \"vuuDensitySwitch\";\n\nconst densities:Density[] = [\"high\", \"medium\", \"low\", \"touch\"];\n\nexport interface DensitySwitchProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n    defaultDensity?: Density;\n    density?: Density;\n    onDensityChange: (density: Density) => void;\n}\n\nexport const DensitySwitch = ({\n  className: classNameProp,\n  defaultDensity=DEFAULT_DENSITY,\n  onDensityChange\n}:DensitySwitchProps) => {\n\n  const handleSelectionChange:SelectionChangeHandler | string = useCallback((_event, selectedItem) => {\n    onDensityChange(selectedItem);\n  }, [onDensityChange])\n\n  const className = cx(classBase, classNameProp);\n\n  return (\n    <Dropdown\n    className={className}\n    source={densities}\n    defaultSelected={defaultDensity}\n    onSelectionChange={handleSelectionChange}\n    />\n  )\n}"],
+  "mappings": "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",
+  "names": ["classBase", "React", "React", "Fragment", "jsx", "jsxs", "jsx", "jsx", "React", "useState", "jsx", "jsxs", "useState", "useCallback", "useEffect", "useState", "useEffect", "useState", "layout", "jsx", "cx", "useCallback", "Button", "Button", "useCallback", "useEffect", "useState", "jsx", "jsxs", "UserPanel", "useState", "useEffect", "history", "useCallback", "selected", "Button", "jsx", "jsxs", "Button", "cx", "useCallback", "jsx", "jsxs", "classBase", "useCallback", "mode", "cx", "cx", "useCallback", "cx", "jsx", "classBase", "jsx", "jsxs", "classBase", "cx", "useCallback", "density", "jsx", "jsxs", "useState", "useCallback", "layout", "density", "useEffect", "cx"]
 }

package/index.css

@@ -1,3 +1,63 @@
+/* src/connection-status/ConnectionStatusIcon.css */
+.vuuStatus-container {
+  display: flex;
+}
+.vuuStatus-text {
+  align-self: center;
+}
+.vuuStatus {
+  --vuu-icon-height: 18px;
+  --vuu-icon-padding: var(--vuuStatus-padding, 6px);
+  --vuu-icon-width: var(--vuuStatus-width, auto);
+  --vuu-icon-min-width: var(--vuuStatus-min-width, 20px);
+  align-items: center;
+  display: inline-flex;
+  height: var(--vuu-icon-height);
+  justify-content: center;
+  min-width: var(--vuu-icon-min-width);
+  padding: 0 var(--vuu-icon-padding);
+  width: var(--vuu-icon-width);
+  position: relative;
+}
+.vuuStatus[data-icon]::after {
+  inset: 0 0 0 0;
+  content: "";
+  box-shadow: 0 0 0 0 black;
+  position: absolute;
+  mask: var(--vuu-icon-svg) center center/20px 20px no-repeat;
+  -webkit-mask: var(--vuu-icon-svg) center center/20px 20px no-repeat;
+}
+.vuuActiveStatus::after {
+  --vuu-icon-svg: var(--svg-active-status);
+  background-color: rgb(0, 255, 0);
+}
+.vuuConnectingStatus::after {
+  --vuu-icon-svg: var(--svg-connecting-status);
+  background-color: orange;
+  transform: scale(1);
+  animation: infinite pulse 1s;
+}
+.vuuDisconnectedStatus::after {
+  --vuu-icon-svg: var(--svg-disconnected-status);
+  background-color: red;
+  transform: scale(1);
+  animation: infinite pulse 0.5s;
+}
+@keyframes pulse {
+  0% {
+    transform: scale(0.95);
+    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
+  }
+  70% {
+    transform: scale(1);
+    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
+  }
+  100% {
+    transform: scale(0.95);
+    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
+  }
+}
+
 /* src/login/LoginPanel.css */
 .vuuLoginPanel {
   --hwTextInput-border: solid 1px #ccc;

package/index.css.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../packages/vuu-shell/src/login/LoginPanel.css", "../../../packages/vuu-shell/src/user-profile/UserPanel.css", "../../../packages/vuu-shell/src/user-profile/UserProfile.css", "../../../packages/vuu-shell/src/theme-switch/ThemeSwitch.css", "../../../packages/vuu-shell/src/app-header/AppHeader.css", "../../../packages/vuu-shell/src/shell.css"],
-  "sourcesContent": [".vuuLoginPanel {\n  --hwTextInput-border: solid 1px #ccc;\n  --hwTextInput-height: 28px;\n  --hwTextInput-padding: 0 12px;\n  --hwTextInput-width: 100%;\n  --login-row-height: 60px;\n  align-content: center;\n  align-items: center;\n  border: solid 1px lightgray;\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  justify-content: center;\n  justify-items: center;\n  margin: 0 auto;\n  padding: 48px 48px 24px 48px;\n  width: fit-content;\n}\n\n.vuuLoginPanel-login {\n  grid-column: 2/3;\n  align-self: end;\n  justify-self: end;\n}\n", ".vuuUserPanel {\n  background-color: white;\n  display: flex;\n  flex-direction: column;\n  max-height: 400px;\n  padding: 12px;\n}\n\nvuuUserPanel-history {\n  flex: 1 1 auto;\n}\n\n.vuuUserPanel-buttonBar {\n  --saltButton-width: 100%;\n  align-items: flex-end;\n  border-top: 1px solid var(--surface3);\n  display: flex;\n  flex: 0 0 32px;\n  justify-content: flex-start;\n}\n\n.btn-logout {\n  --hwButton-icon-left: 12px;\n  --hwButton-padding: 0 6px 0 24px;\n  padding-left: 24px;\n}\n", ".vuuUserProfile {\n  --svg-icon: var(--svg-user);\n}\n", ".vuuThemeSwitch {\n    --saltButton-minWidth: 22px;\n}\n\n.vuuThemeSwitch {\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}\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", ".vuuAppHeader {\n  align-items: center;\n  border-bottom: solid 1px var(--salt-container-secondary-borderColor);\n  display: flex;\n  height: 40px;\n  justify-content: flex-end;\n}\n", ".vuuShell {\n  background-color: var(--salt-container-primary-background, ivory);\n  height: var(--vuuShell-height, 100vh);\n  width: var(--vuuShell-width, 100vw);\n}\n\n.vuuShell-palette {\n  --vuuView-border: none;\n  --vuuView-margin: 0;\n}\n\n.vuuShell-warningPlaceholder {\n  background-color: var(--salt-container-background-high);\n  height: 100%;\n}\n"],
-  "mappings": ";AAAA;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;;;ACtBF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;;;ACxBF;AACE;AAAA;;;ACDF;AACI;AAAA;AAGJ;AACI;AACA;AAAA;AAGJ;AACI;AACA;AACA;AAAA;AAGJ;AACI;AAAA;AAGJ;AACI;AAAA;AAEJ;AACI;AAAA;;;ACvBJ;AACE;AACA;AACA;AACA;AACA;AAAA;;;ACLF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;",
+  "sources": ["../../../packages/vuu-shell/src/connection-status/ConnectionStatusIcon.css", "../../../packages/vuu-shell/src/login/LoginPanel.css", "../../../packages/vuu-shell/src/user-profile/UserPanel.css", "../../../packages/vuu-shell/src/user-profile/UserProfile.css", "../../../packages/vuu-shell/src/theme-switch/ThemeSwitch.css", "../../../packages/vuu-shell/src/app-header/AppHeader.css", "../../../packages/vuu-shell/src/shell.css"],
+  "sourcesContent": [".vuuStatus-container {\n\tdisplay: flex;\n}\n\n.vuuStatus-text {\n\talign-self: center;\n}\n\n\n.vuuStatus {\n\t--vuu-icon-height: 18px;\n\t--vuu-icon-padding: var(--vuuStatus-padding, 6px);\n\t--vuu-icon-width: var(--vuuStatus-width, auto);\n\t--vuu-icon-min-width: var(--vuuStatus-min-width, 20px);\n\talign-items: center;\n\tdisplay: inline-flex;\n\theight: var(--vuu-icon-height);\n\tjustify-content: center;\n\tmin-width: var(--vuu-icon-min-width);\n\tpadding: 0 var(--vuu-icon-padding);\n\twidth: var(--vuu-icon-width);\n\tposition: relative;\n}\n\n.vuuStatus[data-icon]::after {\n\tinset: 0 0 0 0;\n\tcontent: '';\n\tbox-shadow: 0 0 0 0 black;\n\tposition: absolute;\n\tmask: var(--vuu-icon-svg) center center/20px 20px no-repeat;\n\t-webkit-mask: var(--vuu-icon-svg) center center/20px 20px no-repeat;\n}\n\n.vuuActiveStatus::after {\n\t--vuu-icon-svg: var(--svg-active-status);\n\tbackground-color: rgb(0, 255, 0);\n}\n\n.vuuConnectingStatus::after {\n\t--vuu-icon-svg: var(--svg-connecting-status);\n\tbackground-color: orange;\n\ttransform: scale(1);\n\tanimation: infinite pulse 1s;\n}\n\n.vuuDisconnectedStatus::after {\n\t--vuu-icon-svg: var(--svg-disconnected-status);\n\tbackground-color: red;\n\ttransform: scale(1);\n\tanimation: infinite pulse 0.5s;\n}\n\n@keyframes pulse {\n\t0% {\n\t\ttransform: scale(0.95);\n\t\tbox-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);\n\t}\n\n\t70% {\n\t\ttransform: scale(1);\n\t\tbox-shadow: 0 0 0 0 rgba(0, 0, 0, 0);\n\t}\n\n\t100% {\n\t\ttransform: scale(0.95);\n\t\tbox-shadow: 0 0 0 0 rgba(0, 0, 0, 0);\n\t}\n}", ".vuuLoginPanel {\n  --hwTextInput-border: solid 1px #ccc;\n  --hwTextInput-height: 28px;\n  --hwTextInput-padding: 0 12px;\n  --hwTextInput-width: 100%;\n  --login-row-height: 60px;\n  align-content: center;\n  align-items: center;\n  border: solid 1px lightgray;\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  justify-content: center;\n  justify-items: center;\n  margin: 0 auto;\n  padding: 48px 48px 24px 48px;\n  width: fit-content;\n}\n\n.vuuLoginPanel-login {\n  grid-column: 2/3;\n  align-self: end;\n  justify-self: end;\n}\n", ".vuuUserPanel {\n  background-color: white;\n  display: flex;\n  flex-direction: column;\n  max-height: 400px;\n  padding: 12px;\n}\n\nvuuUserPanel-history {\n  flex: 1 1 auto;\n}\n\n.vuuUserPanel-buttonBar {\n  --saltButton-width: 100%;\n  align-items: flex-end;\n  border-top: 1px solid var(--surface3);\n  display: flex;\n  flex: 0 0 32px;\n  justify-content: flex-start;\n}\n\n.btn-logout {\n  --hwButton-icon-left: 12px;\n  --hwButton-padding: 0 6px 0 24px;\n  padding-left: 24px;\n}\n", ".vuuUserProfile {\n  --svg-icon: var(--svg-user);\n}\n", ".vuuThemeSwitch {\n    --saltButton-minWidth: 22px;\n}\n\n.vuuThemeSwitch {\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}\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", ".vuuAppHeader {\n  align-items: center;\n  border-bottom: solid 1px var(--salt-container-secondary-borderColor);\n  display: flex;\n  height: 40px;\n  justify-content: flex-end;\n}\n", ".vuuShell {\n  background-color: var(--salt-container-primary-background, ivory);\n  height: var(--vuuShell-height, 100vh);\n  width: var(--vuuShell-width, 100vw);\n}\n\n.vuuShell-palette {\n  --vuuView-border: none;\n  --vuuView-margin: 0;\n}\n\n.vuuShell-warningPlaceholder {\n  background-color: var(--salt-container-background-high);\n  height: 100%;\n}\n"],
+  "mappings": ";AAAA;AACC;AAAA;AAGD;AACC;AAAA;AAID;AACC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGD;AACC;AACA;AACA;AACA;AACA;AACA;AAAA;AAGD;AACC;AACA;AAAA;AAGD;AACC;AACA;AACA;AACA;AAAA;AAGD;AACC;AACA;AACA;AACA;AAAA;AAGD;AAAA;AAEE;AACA;AAAA;AAAA;AAIA;AACA;AAAA;AAAA;AAIA;AACA;AAAA;AAAA;;;ACjEF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;;;ACtBF;AACE;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AAAA;AAGF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGF;AACE;AACA;AACA;AAAA;;;ACxBF;AACE;AAAA;;;ACDF;AACI;AAAA;AAGJ;AACI;AACA;AAAA;AAGJ;AACI;AACA;AACA;AAAA;AAGJ;AACI;AAAA;AAGJ;AACI;AAAA;AAEJ;AACI;AAAA;;;ACvBJ;AACE;AACA;AACA;AACA;AACA;AAAA;;;ACLF;AACE;AACA;AACA;AAAA;AAGF;AACE;AACA;AAAA;AAGF;AACE;AACA;AAAA;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vuu-ui/vuu-shell",
-  "version": "0.6.24-debug",
+  "version": "0.6.25-debug",
   "description": "VUU UI Shell",
   "author": "heswell",
   "license": "Apache-2.0",
@@ -8,9 +8,9 @@
     "@salt-ds/core": "1.2.0",
     "@salt-ds/icons": "1.1.0",
     "@heswell/salt-lab": "1.0.0-alpha.2",
-    "@vuu-ui/vuu-data": "0.6.24-debug",
-    "@vuu-ui/vuu-layout": "0.6.24-debug",
-    "@vuu-ui/vuu-utils": "0.6.24-debug"
+    "@vuu-ui/vuu-data": "0.6.25-debug",
+    "@vuu-ui/vuu-layout": "0.6.25-debug",
+    "@vuu-ui/vuu-utils": "0.6.25-debug"
   },
   "peerDependencies": {
     "classnames": "^2.2.6",

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

@@ -2,12 +2,15 @@ import { HTMLAttributes } from "react";
 import { VuuUser } from "../shell";
 import { ThemeMode } from "../theme-switch";
 import "./AppHeader.css";
+import { Density } from "@salt-ds/core";
 export interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {
     layoutId: string;
     loginUrl?: string;
     onNavigate: (id: string) => void;
     onSwitchTheme?: (mode: ThemeMode) => void;
     themeMode?: ThemeMode;
+    onDensitySwitch?: (density: Density) => void;
+    density?: Density;
     user: VuuUser;
 }
-export declare const AppHeader: ({ className: classNameProp, layoutId, loginUrl, onNavigate, onSwitchTheme, themeMode, user, ...htmlAttributes }: AppHeaderProps) => JSX.Element;
+export declare const AppHeader: ({ className: classNameProp, layoutId, loginUrl, onNavigate, onSwitchTheme, themeMode, onDensitySwitch, density, user, ...htmlAttributes }: AppHeaderProps) => JSX.Element;

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

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

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

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

package/types/density-switch/DensitySwitch.d.ts

@@ -0,0 +1,8 @@
+import { Density } from "@salt-ds/core";
+import { HTMLAttributes } from "react";
+export interface DensitySwitchProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    defaultDensity?: Density;
+    density?: Density;
+    onDensityChange: (density: Density) => void;
+}
+export declare const DensitySwitch: ({ className: classNameProp, defaultDensity, onDensityChange }: DensitySwitchProps) => JSX.Element;

package/types/density-switch/index.d.ts

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

package/types/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./connection-status";
 export * from "./feature";
 export * from "./login";
 export * from "./shell";