@vuu-ui/vuu-shell 2.1.18 → 2.1.19-beta.1

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 (191) hide show
  1. package/package.json +16 -18
  2. package/types/feature/FeatureErrorBoundary.d.ts +1 -1
  3. package/types/workspace-management/WorkspaceProvider.d.ts +5 -5
  4. package/cjs/ShellContextProvider.js +0 -25
  5. package/cjs/ShellContextProvider.js.map +0 -1
  6. package/cjs/app-header/AppHeader.css.js +0 -6
  7. package/cjs/app-header/AppHeader.css.js.map +0 -1
  8. package/cjs/app-header/AppHeader.js +0 -118
  9. package/cjs/app-header/AppHeader.js.map +0 -1
  10. package/cjs/application-provider/ApplicationContext.js +0 -17
  11. package/cjs/application-provider/ApplicationContext.js.map +0 -1
  12. package/cjs/application-provider/ApplicationProvider.js +0 -102
  13. package/cjs/application-provider/ApplicationProvider.js.map +0 -1
  14. package/cjs/feature/Feature.js +0 -54
  15. package/cjs/feature/Feature.js.map +0 -1
  16. package/cjs/feature/FeatureErrorBoundary.js +0 -30
  17. package/cjs/feature/FeatureErrorBoundary.js.map +0 -1
  18. package/cjs/feature-and-layout-provider/FeatureAndLayoutProvider.js +0 -60
  19. package/cjs/feature-and-layout-provider/FeatureAndLayoutProvider.js.map +0 -1
  20. package/cjs/feature-list/FeatureList.css.js +0 -6
  21. package/cjs/feature-list/FeatureList.css.js.map +0 -1
  22. package/cjs/feature-list/FeatureList.js +0 -109
  23. package/cjs/feature-list/FeatureList.js.map +0 -1
  24. package/cjs/index.js +0 -71
  25. package/cjs/index.js.map +0 -1
  26. package/cjs/left-nav/LeftNav.css.js +0 -6
  27. package/cjs/left-nav/LeftNav.css.js.map +0 -1
  28. package/cjs/left-nav/LeftNav.js +0 -202
  29. package/cjs/left-nav/LeftNav.js.map +0 -1
  30. package/cjs/login/LoginPanel.css.js +0 -6
  31. package/cjs/login/LoginPanel.css.js.map +0 -1
  32. package/cjs/login/LoginPanel.js +0 -110
  33. package/cjs/login/LoginPanel.js.map +0 -1
  34. package/cjs/login/VuuLogo.js +0 -134
  35. package/cjs/login/VuuLogo.js.map +0 -1
  36. package/cjs/persistence-manager/LocalPersistenceManager.js +0 -193
  37. package/cjs/persistence-manager/LocalPersistenceManager.js.map +0 -1
  38. package/cjs/persistence-manager/PersistenceProvider.js +0 -21
  39. package/cjs/persistence-manager/PersistenceProvider.js.map +0 -1
  40. package/cjs/persistence-manager/RemotePersistenceManager.js +0 -165
  41. package/cjs/persistence-manager/RemotePersistenceManager.js.map +0 -1
  42. package/cjs/persistence-manager/StaticPersistenceManager.js +0 -73
  43. package/cjs/persistence-manager/StaticPersistenceManager.js.map +0 -1
  44. package/cjs/shell-layout-templates/context-panel/ContextPanel.css.js +0 -6
  45. package/cjs/shell-layout-templates/context-panel/ContextPanel.css.js.map +0 -1
  46. package/cjs/shell-layout-templates/context-panel/ContextPanel.js +0 -100
  47. package/cjs/shell-layout-templates/context-panel/ContextPanel.js.map +0 -1
  48. package/cjs/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js +0 -51
  49. package/cjs/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js.map +0 -1
  50. package/cjs/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.js +0 -83
  51. package/cjs/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.js.map +0 -1
  52. package/cjs/shell-layout-templates/left-main-tabs/useLeftMainTabs.js +0 -46
  53. package/cjs/shell-layout-templates/left-main-tabs/useLeftMainTabs.js.map +0 -1
  54. package/cjs/shell-layout-templates/side-panel/SidePanel.css.js +0 -6
  55. package/cjs/shell-layout-templates/side-panel/SidePanel.css.js.map +0 -1
  56. package/cjs/shell-layout-templates/side-panel/SidePanel.js +0 -36
  57. package/cjs/shell-layout-templates/side-panel/SidePanel.js.map +0 -1
  58. package/cjs/shell-layout-templates/simple-content-pane/useSimpleContentPane.js +0 -48
  59. package/cjs/shell-layout-templates/simple-content-pane/useSimpleContentPane.js.map +0 -1
  60. package/cjs/shell-layout-templates/useShellLayout.js +0 -23
  61. package/cjs/shell-layout-templates/useShellLayout.js.map +0 -1
  62. package/cjs/shell.css.js +0 -6
  63. package/cjs/shell.css.js.map +0 -1
  64. package/cjs/shell.js +0 -137
  65. package/cjs/shell.js.map +0 -1
  66. package/cjs/theme-switch/ThemeSwitch.css.js +0 -6
  67. package/cjs/theme-switch/ThemeSwitch.css.js.map +0 -1
  68. package/cjs/theme-switch/ThemeSwitch.js +0 -56
  69. package/cjs/theme-switch/ThemeSwitch.js.map +0 -1
  70. package/cjs/user-settings/SettingsForm.css.js +0 -6
  71. package/cjs/user-settings/SettingsForm.css.js.map +0 -1
  72. package/cjs/user-settings/SettingsForm.js +0 -168
  73. package/cjs/user-settings/SettingsForm.js.map +0 -1
  74. package/cjs/user-settings/UserSettingsPanel.css.js +0 -6
  75. package/cjs/user-settings/UserSettingsPanel.css.js.map +0 -1
  76. package/cjs/user-settings/UserSettingsPanel.js +0 -42
  77. package/cjs/user-settings/UserSettingsPanel.js.map +0 -1
  78. package/cjs/workspace-management/LayoutList.css.js +0 -6
  79. package/cjs/workspace-management/LayoutList.css.js.map +0 -1
  80. package/cjs/workspace-management/LayoutList.js +0 -116
  81. package/cjs/workspace-management/LayoutList.js.map +0 -1
  82. package/cjs/workspace-management/LayoutTile.css.js +0 -6
  83. package/cjs/workspace-management/LayoutTile.css.js.map +0 -1
  84. package/cjs/workspace-management/LayoutTile.js +0 -41
  85. package/cjs/workspace-management/LayoutTile.js.map +0 -1
  86. package/cjs/workspace-management/SaveLayoutPanel.css.js +0 -6
  87. package/cjs/workspace-management/SaveLayoutPanel.css.js.map +0 -1
  88. package/cjs/workspace-management/SaveLayoutPanel.js +0 -128
  89. package/cjs/workspace-management/SaveLayoutPanel.js.map +0 -1
  90. package/cjs/workspace-management/WorkspaceProvider.js +0 -265
  91. package/cjs/workspace-management/WorkspaceProvider.js.map +0 -1
  92. package/cjs/workspace-management/defaultWorkspaceJSON.js +0 -101
  93. package/cjs/workspace-management/defaultWorkspaceJSON.js.map +0 -1
  94. package/cjs/workspace-management/screenshot-utils.js +0 -25
  95. package/cjs/workspace-management/screenshot-utils.js.map +0 -1
  96. package/cjs/workspace-management/useWorkspaceContextMenuItems.js +0 -72
  97. package/cjs/workspace-management/useWorkspaceContextMenuItems.js.map +0 -1
  98. package/esm/ShellContextProvider.js +0 -23
  99. package/esm/ShellContextProvider.js.map +0 -1
  100. package/esm/app-header/AppHeader.css.js +0 -4
  101. package/esm/app-header/AppHeader.css.js.map +0 -1
  102. package/esm/app-header/AppHeader.js +0 -116
  103. package/esm/app-header/AppHeader.js.map +0 -1
  104. package/esm/application-provider/ApplicationContext.js +0 -15
  105. package/esm/application-provider/ApplicationContext.js.map +0 -1
  106. package/esm/application-provider/ApplicationProvider.js +0 -96
  107. package/esm/application-provider/ApplicationProvider.js.map +0 -1
  108. package/esm/feature/Feature.js +0 -52
  109. package/esm/feature/Feature.js.map +0 -1
  110. package/esm/feature/FeatureErrorBoundary.js +0 -28
  111. package/esm/feature/FeatureErrorBoundary.js.map +0 -1
  112. package/esm/feature-and-layout-provider/FeatureAndLayoutProvider.js +0 -56
  113. package/esm/feature-and-layout-provider/FeatureAndLayoutProvider.js.map +0 -1
  114. package/esm/feature-list/FeatureList.css.js +0 -4
  115. package/esm/feature-list/FeatureList.css.js.map +0 -1
  116. package/esm/feature-list/FeatureList.js +0 -107
  117. package/esm/feature-list/FeatureList.js.map +0 -1
  118. package/esm/index.js +0 -25
  119. package/esm/index.js.map +0 -1
  120. package/esm/left-nav/LeftNav.css.js +0 -4
  121. package/esm/left-nav/LeftNav.css.js.map +0 -1
  122. package/esm/left-nav/LeftNav.js +0 -200
  123. package/esm/left-nav/LeftNav.js.map +0 -1
  124. package/esm/login/LoginPanel.css.js +0 -4
  125. package/esm/login/LoginPanel.css.js.map +0 -1
  126. package/esm/login/LoginPanel.js +0 -108
  127. package/esm/login/LoginPanel.js.map +0 -1
  128. package/esm/login/VuuLogo.js +0 -132
  129. package/esm/login/VuuLogo.js.map +0 -1
  130. package/esm/persistence-manager/LocalPersistenceManager.js +0 -191
  131. package/esm/persistence-manager/LocalPersistenceManager.js.map +0 -1
  132. package/esm/persistence-manager/PersistenceProvider.js +0 -17
  133. package/esm/persistence-manager/PersistenceProvider.js.map +0 -1
  134. package/esm/persistence-manager/RemotePersistenceManager.js +0 -163
  135. package/esm/persistence-manager/RemotePersistenceManager.js.map +0 -1
  136. package/esm/persistence-manager/StaticPersistenceManager.js +0 -71
  137. package/esm/persistence-manager/StaticPersistenceManager.js.map +0 -1
  138. package/esm/shell-layout-templates/context-panel/ContextPanel.css.js +0 -4
  139. package/esm/shell-layout-templates/context-panel/ContextPanel.css.js.map +0 -1
  140. package/esm/shell-layout-templates/context-panel/ContextPanel.js +0 -98
  141. package/esm/shell-layout-templates/context-panel/ContextPanel.js.map +0 -1
  142. package/esm/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js +0 -49
  143. package/esm/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js.map +0 -1
  144. package/esm/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.js +0 -81
  145. package/esm/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.js.map +0 -1
  146. package/esm/shell-layout-templates/left-main-tabs/useLeftMainTabs.js +0 -44
  147. package/esm/shell-layout-templates/left-main-tabs/useLeftMainTabs.js.map +0 -1
  148. package/esm/shell-layout-templates/side-panel/SidePanel.css.js +0 -4
  149. package/esm/shell-layout-templates/side-panel/SidePanel.css.js.map +0 -1
  150. package/esm/shell-layout-templates/side-panel/SidePanel.js +0 -34
  151. package/esm/shell-layout-templates/side-panel/SidePanel.js.map +0 -1
  152. package/esm/shell-layout-templates/simple-content-pane/useSimpleContentPane.js +0 -46
  153. package/esm/shell-layout-templates/simple-content-pane/useSimpleContentPane.js.map +0 -1
  154. package/esm/shell-layout-templates/useShellLayout.js +0 -21
  155. package/esm/shell-layout-templates/useShellLayout.js.map +0 -1
  156. package/esm/shell.css.js +0 -4
  157. package/esm/shell.css.js.map +0 -1
  158. package/esm/shell.js +0 -135
  159. package/esm/shell.js.map +0 -1
  160. package/esm/theme-switch/ThemeSwitch.css.js +0 -4
  161. package/esm/theme-switch/ThemeSwitch.css.js.map +0 -1
  162. package/esm/theme-switch/ThemeSwitch.js +0 -54
  163. package/esm/theme-switch/ThemeSwitch.js.map +0 -1
  164. package/esm/user-settings/SettingsForm.css.js +0 -4
  165. package/esm/user-settings/SettingsForm.css.js.map +0 -1
  166. package/esm/user-settings/SettingsForm.js +0 -162
  167. package/esm/user-settings/SettingsForm.js.map +0 -1
  168. package/esm/user-settings/UserSettingsPanel.css.js +0 -4
  169. package/esm/user-settings/UserSettingsPanel.css.js.map +0 -1
  170. package/esm/user-settings/UserSettingsPanel.js +0 -40
  171. package/esm/user-settings/UserSettingsPanel.js.map +0 -1
  172. package/esm/workspace-management/LayoutList.css.js +0 -4
  173. package/esm/workspace-management/LayoutList.css.js.map +0 -1
  174. package/esm/workspace-management/LayoutList.js +0 -114
  175. package/esm/workspace-management/LayoutList.js.map +0 -1
  176. package/esm/workspace-management/LayoutTile.css.js +0 -4
  177. package/esm/workspace-management/LayoutTile.css.js.map +0 -1
  178. package/esm/workspace-management/LayoutTile.js +0 -39
  179. package/esm/workspace-management/LayoutTile.js.map +0 -1
  180. package/esm/workspace-management/SaveLayoutPanel.css.js +0 -4
  181. package/esm/workspace-management/SaveLayoutPanel.css.js.map +0 -1
  182. package/esm/workspace-management/SaveLayoutPanel.js +0 -126
  183. package/esm/workspace-management/SaveLayoutPanel.js.map +0 -1
  184. package/esm/workspace-management/WorkspaceProvider.js +0 -262
  185. package/esm/workspace-management/WorkspaceProvider.js.map +0 -1
  186. package/esm/workspace-management/defaultWorkspaceJSON.js +0 -95
  187. package/esm/workspace-management/defaultWorkspaceJSON.js.map +0 -1
  188. package/esm/workspace-management/screenshot-utils.js +0 -23
  189. package/esm/workspace-management/screenshot-utils.js.map +0 -1
  190. package/esm/workspace-management/useWorkspaceContextMenuItems.js +0 -70
  191. package/esm/workspace-management/useWorkspaceContextMenuItems.js.map +0 -1
package/cjs/shell.js DELETED
@@ -1,137 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var styles = require('@salt-ds/styles');
5
- var window = require('@salt-ds/window');
6
- var vuuContextMenu = require('@vuu-ui/vuu-context-menu');
7
- var vuuLayout = require('@vuu-ui/vuu-layout');
8
- var vuuNotifications = require('@vuu-ui/vuu-notifications');
9
- var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
10
- var vuuUtils = require('@vuu-ui/vuu-utils');
11
- var React = require('react');
12
- var AppHeader = require('./app-header/AppHeader.js');
13
- var ApplicationProvider = require('./application-provider/ApplicationProvider.js');
14
- var PersistenceProvider = require('./persistence-manager/PersistenceProvider.js');
15
- var LocalPersistenceManager = require('./persistence-manager/LocalPersistenceManager.js');
16
- require('./persistence-manager/StaticPersistenceManager.js');
17
- require('clsx');
18
- var useShellLayout = require('./shell-layout-templates/useShellLayout.js');
19
- var UserSettingsPanel = require('./user-settings/UserSettingsPanel.js');
20
- require('@salt-ds/core');
21
- require('html-to-image');
22
- var WorkspaceProvider = require('./workspace-management/WorkspaceProvider.js');
23
- require('./feature-and-layout-provider/FeatureAndLayoutProvider.js');
24
- var defaultWorkspaceJSON = require('./workspace-management/defaultWorkspaceJSON.js');
25
- var useWorkspaceContextMenuItems = require('./workspace-management/useWorkspaceContextMenuItems.js');
26
- var vuuDataReact = require('@vuu-ui/vuu-data-react');
27
- var shell = require('./shell.css.js');
28
-
29
- vuuUtils.registerComponent("ApplicationSettings", UserSettingsPanel.UserSettingsPanel, "view");
30
- if (process.env.NODE_ENV === "production") {
31
- if (typeof vuuLayout.StackLayout !== "function") {
32
- console.warn(
33
- "StackLayout module not loaded, will be unable to deserialize from layout JSON"
34
- );
35
- }
36
- }
37
- const { error } = vuuUtils.logger("Shell");
38
- const defaultAppHeader = /* @__PURE__ */ jsxRuntime.jsx(AppHeader.AppHeader, {});
39
- const getAppHeader = (shellLayoutProps) => shellLayoutProps?.appHeader ?? defaultAppHeader;
40
- const defaultHTMLAttributes = {
41
- className: "vuuShell"
42
- };
43
- const getHTMLAttributes = (props) => {
44
- if (props?.htmlAttributes) {
45
- return {
46
- ...defaultHTMLAttributes,
47
- ...props.htmlAttributes
48
- };
49
- } else {
50
- return defaultHTMLAttributes;
51
- }
52
- };
53
- const VuuApplication = ({
54
- shellLayoutProps: ShellLayoutProps2,
55
- children
56
- }) => {
57
- const targetWindow = window.useWindow();
58
- styles.useComponentCssInjection({
59
- testId: "vuu-shell",
60
- css: shell,
61
- window: targetWindow
62
- });
63
- const { workspaceJSON, saveApplicationLayout } = WorkspaceProvider.useWorkspace();
64
- const { buildMenuOptions, handleMenuAction } = useWorkspaceContextMenuItems.useWorkspaceContextMenuItems();
65
- const handleLayoutChange = React.useCallback(
66
- (layout) => {
67
- try {
68
- saveApplicationLayout(layout);
69
- } catch {
70
- error?.("Failed to save layout");
71
- }
72
- },
73
- [saveApplicationLayout]
74
- );
75
- const isLayoutLoading = workspaceJSON === defaultWorkspaceJSON.loadingJSON;
76
- const initialLayout = useShellLayout.useShellLayout({
77
- ...ShellLayoutProps2,
78
- appHeader: getAppHeader(ShellLayoutProps2),
79
- htmlAttributes: getHTMLAttributes(ShellLayoutProps2)
80
- });
81
- vuuDataReact.useLostConnection();
82
- return isLayoutLoading ? null : /* @__PURE__ */ jsxRuntime.jsxs(
83
- vuuContextMenu.ContextMenuProvider,
84
- {
85
- menuActionHandler: handleMenuAction,
86
- menuBuilder: buildMenuOptions,
87
- children: [
88
- /* @__PURE__ */ jsxRuntime.jsx(
89
- vuuLayout.LayoutProvider,
90
- {
91
- workspaceJSON,
92
- onLayoutChange: handleLayoutChange,
93
- children: initialLayout
94
- }
95
- ),
96
- children
97
- ]
98
- }
99
- );
100
- };
101
- const Shell = ({
102
- logout,
103
- user,
104
- userSettingsSchema,
105
- workspaceProps,
106
- ...props
107
- }) => {
108
- const persistenceManager = PersistenceProvider.usePersistenceManager();
109
- const localPersistenceManager = React.useMemo(() => {
110
- if (persistenceManager) {
111
- return void 0;
112
- }
113
- console.log(
114
- `No Persistence Manager, configuration data will be persisted to Local Storage, key: 'vuu/${user.username}'`
115
- );
116
- return new LocalPersistenceManager.LocalPersistenceManager(`vuu/${user.username}`);
117
- }, [persistenceManager, user.username]);
118
- const shellProviders = /* @__PURE__ */ jsxRuntime.jsx(
119
- ApplicationProvider.ApplicationProvider,
120
- {
121
- density: "high",
122
- logout,
123
- theme: "vuu-theme",
124
- user,
125
- userSettingsSchema,
126
- children: /* @__PURE__ */ jsxRuntime.jsx(WorkspaceProvider.WorkspaceProvider, { ...workspaceProps, children: /* @__PURE__ */ jsxRuntime.jsx(vuuUiControls.ModalProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(vuuNotifications.NotificationsProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(VuuApplication, { ...props, user }) }) }) })
127
- }
128
- );
129
- if (persistenceManager) {
130
- return shellProviders;
131
- } else {
132
- return /* @__PURE__ */ jsxRuntime.jsx(PersistenceProvider.PersistenceProvider, { persistenceManager: localPersistenceManager, children: shellProviders });
133
- }
134
- };
135
-
136
- exports.Shell = Shell;
137
- //# sourceMappingURL=shell.js.map
package/cjs/shell.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"shell.js","sources":["../../../packages/vuu-shell/src/shell.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ContextMenuProvider } from \"@vuu-ui/vuu-context-menu\";\nimport type { LayoutChangeHandler } from \"@vuu-ui/vuu-layout\";\nimport { LayoutProvider, StackLayout } from \"@vuu-ui/vuu-layout\";\nimport { NotificationsProvider } from \"@vuu-ui/vuu-notifications\";\nimport { ModalProvider } from \"@vuu-ui/vuu-ui-controls\";\nimport { VuuUser, logger, registerComponent } from \"@vuu-ui/vuu-utils\";\nimport {\n type HTMLAttributes,\n type ReactNode,\n useCallback,\n useMemo,\n} 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\";\nimport { loadingJSON } from \"./workspace-management/defaultWorkspaceJSON\";\nimport { useLostConnection } from \"@vuu-ui/vuu-data-react\";\n\nimport shellCss from \"./shell.css\";\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 logout?: () => void;\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}: 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 { 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 const isLayoutLoading = workspaceJSON === loadingJSON;\n\n const initialLayout = useShellLayout({\n ...ShellLayoutProps,\n appHeader: getAppHeader(ShellLayoutProps),\n htmlAttributes: getHTMLAttributes(ShellLayoutProps),\n });\n\n useLostConnection();\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 logout,\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 logout={logout}\n theme=\"vuu-theme\"\n user={user}\n userSettingsSchema={userSettingsSchema}\n >\n <WorkspaceProvider {...workspaceProps}>\n <ModalProvider>\n <NotificationsProvider>\n <VuuApplication {...props} user={user} />\n </NotificationsProvider>\n </ModalProvider>\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","useWorkspace","useWorkspaceContextMenuItems","useCallback","loadingJSON","useShellLayout","useLostConnection","jsxs","ContextMenuProvider","jsx","LayoutProvider","usePersistenceManager","useMemo","LocalPersistenceManager","ApplicationProvider","WorkspaceProvider","ModalProvider","NotificationsProvider","PersistenceProvider"],"mappings":"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"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var themeSwitchCss = "\n.vuuThemeSwitch {\n --saltButton-minWidth: 22px;\n --svg-light: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\"><path d=\"M24 31q2.9 0 4.95-2.05Q31 26.9 31 24q0-2.9-2.05-4.95Q26.9 17 24 17q-2.9 0-4.95 2.05Q17 21.1 17 24q0 2.9 2.05 4.95Q21.1 31 24 31Zm0 3q-4.15 0-7.075-2.925T14 24q0-4.15 2.925-7.075T24 14q4.15 0 7.075 2.925T34 24q0 4.15-2.925 7.075T24 34ZM3.5 25.5q-.65 0-1.075-.425Q2 24.65 2 24q0-.65.425-1.075Q2.85 22.5 3.5 22.5h5q.65 0 1.075.425Q10 23.35 10 24q0 .65-.425 1.075-.425.425-1.075.425Zm36 0q-.65 0-1.075-.425Q38 24.65 38 24q0-.65.425-1.075.425-.425 1.075-.425h5q.65 0 1.075.425Q46 23.35 46 24q0 .65-.425 1.075-.425.425-1.075.425ZM24 10q-.65 0-1.075-.425Q22.5 9.15 22.5 8.5v-5q0-.65.425-1.075Q23.35 2 24 2q.65 0 1.075.425.425.425.425 1.075v5q0 .65-.425 1.075Q24.65 10 24 10Zm0 36q-.65 0-1.075-.425-.425-.425-.425-1.075v-5q0-.65.425-1.075Q23.35 38 24 38q.65 0 1.075.425.425.425.425 1.075v5q0 .65-.425 1.075Q24.65 46 24 46ZM12 14.1l-2.85-2.8q-.45-.45-.425-1.075.025-.625.425-1.075.45-.45 1.075-.45t1.075.45L14.1 12q.4.45.4 1.05 0 .6-.4 1-.4.45-1.025.45-.625 0-1.075-.4Zm24.7 24.75L33.9 36q-.4-.45-.4-1.075t.45-1.025q.4-.45 1-.45t1.05.45l2.85 2.8q.45.45.425 1.075-.025.625-.425 1.075-.45.45-1.075.45t-1.075-.45ZM33.9 14.1q-.45-.45-.45-1.05 0-.6.45-1.05l2.8-2.85q.45-.45 1.075-.425.625.025 1.075.425.45.45.45 1.075t-.45 1.075L36 14.1q-.4.4-1.025.4-.625 0-1.075-.4ZM9.15 38.85q-.45-.45-.45-1.075t.45-1.075L12 33.9q.45-.45 1.05-.45.6 0 1.05.45.45.45.45 1.05 0 .6-.45 1.05l-2.8 2.85q-.45.45-1.075.425-.625-.025-1.075-.425ZM24 24Z\"/></svg>');\n --svg-dark: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\"><path d=\"M24 42q-7.5 0-12.75-5.25T6 24q0-7.5 5.25-12.75T24 6q.4 0 .85.025.45.025 1.15.075-1.8 1.6-2.8 3.95-1 2.35-1 4.95 0 4.5 3.15 7.65Q28.5 25.8 33 25.8q2.6 0 4.95-.925T41.9 22.3q.05.6.075.975Q42 23.65 42 24q0 7.5-5.25 12.75T24 42Zm0-3q5.45 0 9.5-3.375t5.05-7.925q-1.25.55-2.675.825Q34.45 28.8 33 28.8q-5.75 0-9.775-4.025T19.2 15q0-1.2.25-2.575.25-1.375.9-3.125-4.9 1.35-8.125 5.475Q9 18.9 9 24q0 6.25 4.375 10.625T24 39Zm-.2-14.85Z\"/></svg>');\n padding: 2px;\n}\n\n.salt-density-high .vuuThemeSwitch {\n --saltButton-minWidth: 16px;\n --saltButton-width: 18px;\n --vuuThemeSwitch-iconSize: 16px;\n}\n\n.vuuThemeSwitch [data-icon] {\n --vuu-icon-size: var(--vuuThemeSwitch-iconSize,18px);\n}\n\n.vuuThemeSwitch [data-icon='light'] {\n --vuu-icon-svg: var(--svg-light);\n}\n.vuuThemeSwitch [data-icon='dark'] {\n --vuu-icon-svg: var(--svg-dark);\n}\n\n.vuuThemeSwitch .saltToggleButton {\n height: 20px;\n width: 20px;\n}\n\n";
4
-
5
- module.exports = themeSwitchCss;
6
- //# sourceMappingURL=ThemeSwitch.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ThemeSwitch.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,56 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var cx = require('clsx');
5
- var core = require('@salt-ds/core');
6
- var styles = require('@salt-ds/styles');
7
- var window = require('@salt-ds/window');
8
- var React = require('react');
9
- var ThemeSwitch$1 = require('./ThemeSwitch.css.js');
10
-
11
- const classBase = "vuuThemeSwitch";
12
- const ThemeSwitch = ({
13
- className: classNameProp,
14
- defaultMode: defaultModeProp,
15
- mode: modeProp,
16
- onChange,
17
- ...htmlAttributes
18
- }) => {
19
- const targetWindow = window.useWindow();
20
- styles.useComponentCssInjection({
21
- testId: "vuu-theme-switch",
22
- css: ThemeSwitch$1,
23
- window: targetWindow
24
- });
25
- const [mode, setMode] = core.useControlled({
26
- controlled: modeProp,
27
- default: defaultModeProp ?? "light",
28
- name: "ThemeSwitch",
29
- state: "mode"
30
- });
31
- const handleChangeSecondary = React.useCallback(
32
- (evt) => {
33
- const { value } = evt.target;
34
- setMode(value);
35
- onChange(value);
36
- },
37
- [onChange, setMode]
38
- );
39
- const className = cx(classBase, classNameProp);
40
- return /* @__PURE__ */ jsxRuntime.jsxs(
41
- core.ToggleButtonGroup,
42
- {
43
- className,
44
- ...htmlAttributes,
45
- onChange: handleChangeSecondary,
46
- value: mode,
47
- children: [
48
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { "aria-label": "alert", "data-icon": "light", value: "light" }),
49
- /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { "aria-label": "home", "data-icon": "dark", value: "dark" })
50
- ]
51
- }
52
- );
53
- };
54
-
55
- exports.ThemeSwitch = ThemeSwitch;
56
- //# sourceMappingURL=ThemeSwitch.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ThemeSwitch.js","sources":["../../../../packages/vuu-shell/src/theme-switch/ThemeSwitch.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { ToggleButton, ToggleButtonGroup, useControlled } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, SyntheticEvent, useCallback } from \"react\";\nimport { ThemeMode } from \"@vuu-ui/vuu-utils\";\n\nimport themeSwitchCss from \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\nexport interface ThemeSwitchProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultMode?: ThemeMode;\n mode?: ThemeMode;\n onChange: (mode: ThemeMode) => void;\n}\n\nexport const ThemeSwitch = ({\n className: classNameProp,\n defaultMode: defaultModeProp,\n mode: modeProp,\n onChange,\n ...htmlAttributes\n}: ThemeSwitchProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-theme-switch\",\n css: themeSwitchCss,\n window: targetWindow,\n });\n\n const [mode, setMode] = useControlled<ThemeMode>({\n controlled: modeProp,\n default: defaultModeProp ?? \"light\",\n name: \"ThemeSwitch\",\n state: \"mode\",\n });\n\n const handleChangeSecondary = useCallback(\n (evt: SyntheticEvent<HTMLButtonElement>) => {\n const { value } = evt.target as HTMLButtonElement;\n setMode(value as ThemeMode);\n onChange(value as ThemeMode);\n },\n [onChange, setMode],\n );\n const className = cx(classBase, classNameProp);\n return (\n <ToggleButtonGroup\n className={className}\n {...htmlAttributes}\n onChange={handleChangeSecondary}\n value={mode}\n >\n <ToggleButton aria-label=\"alert\" data-icon=\"light\" value=\"light\" />\n <ToggleButton aria-label=\"home\" data-icon=\"dark\" value=\"dark\" />\n </ToggleButtonGroup>\n );\n};\n"],"names":["useWindow","useComponentCssInjection","themeSwitchCss","useControlled","useCallback","jsxs","ToggleButtonGroup","jsx","ToggleButton"],"mappings":";;;;;;;;;;AASA,MAAM,SAAY,GAAA,gBAAA;AAQX,MAAM,cAAc,CAAC;AAAA,EAC1B,SAAW,EAAA,aAAA;AAAA,EACX,WAAa,EAAA,eAAA;AAAA,EACb,IAAM,EAAA,QAAA;AAAA,EACN,QAAA;AAAA,EACA,GAAG;AACL,CAAwB,KAAA;AACtB,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,aAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,kBAAyB,CAAA;AAAA,IAC/C,UAAY,EAAA,QAAA;AAAA,IACZ,SAAS,eAAmB,IAAA,OAAA;AAAA,IAC5B,IAAM,EAAA,aAAA;AAAA,IACN,KAAO,EAAA;AAAA,GACR,CAAA;AAED,EAAA,MAAM,qBAAwB,GAAAC,iBAAA;AAAA,IAC5B,CAAC,GAA2C,KAAA;AAC1C,MAAM,MAAA,EAAE,KAAM,EAAA,GAAI,GAAI,CAAA,MAAA;AACtB,MAAA,OAAA,CAAQ,KAAkB,CAAA;AAC1B,MAAA,QAAA,CAAS,KAAkB,CAAA;AAAA,KAC7B;AAAA,IACA,CAAC,UAAU,OAAO;AAAA,GACpB;AACA,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAa,CAAA;AAC7C,EACE,uBAAAC,eAAA;AAAA,IAACC,sBAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACC,GAAG,cAAA;AAAA,MACJ,QAAU,EAAA,qBAAA;AAAA,MACV,KAAO,EAAA,IAAA;AAAA,MAEP,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACC,qBAAa,YAAW,EAAA,OAAA,EAAQ,WAAU,EAAA,OAAA,EAAQ,OAAM,OAAQ,EAAA,CAAA;AAAA,uCAChEA,iBAAa,EAAA,EAAA,YAAA,EAAW,QAAO,WAAU,EAAA,MAAA,EAAO,OAAM,MAAO,EAAA;AAAA;AAAA;AAAA,GAChE;AAEJ;;;;"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var settingsFormCss = ".vuuSettingsForm {\n display: flex;\n flex-direction: column;\n gap: var(--salt-spacing-200);\n}\n";
4
-
5
- module.exports = settingsFormCss;
6
- //# sourceMappingURL=SettingsForm.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SettingsForm.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,168 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
5
- var vuuUtils = require('@vuu-ui/vuu-utils');
6
- var core = require('@salt-ds/core');
7
- var styles = require('@salt-ds/styles');
8
- var window = require('@salt-ds/window');
9
- var cx = require('clsx');
10
- var React = require('react');
11
- var SettingsForm$1 = require('./SettingsForm.css.js');
12
-
13
- const isOption = (value) => typeof value === "object" && "label" in value && "label" in value;
14
- const isBooleanProperty = (property) => property.type === "boolean";
15
- const isStringOrNumber = (value) => typeof value === "string" || typeof value === "number";
16
- const getValueAndLabel = (value) => isOption(value) ? [value.value, value.label] : [value, value];
17
- const defaultPropertyValue = {
18
- boolean: false,
19
- number: 0,
20
- string: ""
21
- };
22
- const classBase = "vuuSettingsForm";
23
- function FormControl({
24
- property,
25
- changeHandler,
26
- selectHandler,
27
- inputHandler,
28
- currentValue = property.defaultValue ?? defaultPropertyValue[property.type]
29
- }) {
30
- const [value, setValue] = React.useState(currentValue);
31
- if (isBooleanProperty(property)) {
32
- const checked = typeof currentValue === "boolean" ? currentValue : property.defaultValue ?? false;
33
- return /* @__PURE__ */ jsxRuntime.jsx(core.Switch, { checked, onChange: changeHandler });
34
- }
35
- if (Array.isArray(property.values)) {
36
- if (property.values.length <= 2) {
37
- return /* @__PURE__ */ jsxRuntime.jsx(
38
- core.ToggleButtonGroup,
39
- {
40
- value: currentValue,
41
- onChange: changeHandler,
42
- children: property.values.map((valueOrOption) => {
43
- const [value2, label] = getValueAndLabel(valueOrOption);
44
- return /* @__PURE__ */ jsxRuntime.jsx(core.ToggleButton, { value: value2, children: label }, value2);
45
- })
46
- }
47
- );
48
- } else if (property.values.length > 2) {
49
- return /* @__PURE__ */ jsxRuntime.jsx(
50
- core.Dropdown,
51
- {
52
- value: currentValue,
53
- onSelectionChange: selectHandler,
54
- children: property.values.map((valueOrOption) => {
55
- const [value2, label] = getValueAndLabel(valueOrOption);
56
- return /* @__PURE__ */ jsxRuntime.jsx(
57
- core.Option,
58
- {
59
- value: label,
60
- "data-field": property.name
61
- },
62
- value2
63
- );
64
- })
65
- }
66
- );
67
- }
68
- } else {
69
- const valid = isValidInput(currentValue, property.type);
70
- const errorMessage = getTooltipContent(property.type, valid);
71
- return /* @__PURE__ */ jsxRuntime.jsx(
72
- vuuUiControls.VuuInput,
73
- {
74
- errorMessage,
75
- onCommit: inputHandler,
76
- onChange: (e) => setValue(e.target.value),
77
- value
78
- },
79
- property.name
80
- );
81
- }
82
- return null;
83
- }
84
- const isValidInput = (value, type) => {
85
- if (value === "") {
86
- return void 0;
87
- }
88
- if (type === "string") {
89
- return "success";
90
- } else if (type === "number") {
91
- if (Number.isNaN(Number(value))) {
92
- return "error";
93
- }
94
- return "success";
95
- }
96
- };
97
- function getTooltipContent(type, valid) {
98
- if (valid === "error") {
99
- if (type === "number") {
100
- return /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Field is expecting a number" });
101
- } else if (type === "string") {
102
- return /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Field is expecting a string" });
103
- } else {
104
- return /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Please contact Admin for more information on expected type" });
105
- }
106
- } else {
107
- return void 0;
108
- }
109
- }
110
- const SettingsForm = ({
111
- className,
112
- settingsSchema,
113
- settings,
114
- onSettingChanged,
115
- ...htmlAttributes
116
- }) => {
117
- const targetWindow = window.useWindow();
118
- styles.useComponentCssInjection({
119
- testId: "vuu-settings-form",
120
- css: SettingsForm$1,
121
- window: targetWindow
122
- });
123
- const changeHandler = React.useCallback(
124
- (event) => {
125
- const fieldName = vuuUtils.getFieldName(event.target);
126
- const { checked, value } = event.target;
127
- onSettingChanged(fieldName, checked ?? value);
128
- },
129
- [onSettingChanged]
130
- );
131
- const selectHandler = React.useCallback(
132
- (event, [selected]) => {
133
- const fieldName = vuuUtils.getFieldName(event.target);
134
- onSettingChanged(fieldName, selected);
135
- },
136
- [onSettingChanged]
137
- );
138
- const inputHandler = React.useCallback(
139
- (event) => {
140
- const fieldName = vuuUtils.getFieldName(event.target);
141
- const { value } = event.target;
142
- if (!Number.isNaN(Number(value)) && value != "") {
143
- const numValue = Number(value);
144
- onSettingChanged(fieldName, numValue);
145
- } else {
146
- onSettingChanged(fieldName, value);
147
- }
148
- },
149
- [onSettingChanged]
150
- );
151
- 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: [
152
- /* @__PURE__ */ jsxRuntime.jsx(core.FormFieldLabel, { children: property.label }),
153
- FormControl({
154
- property,
155
- changeHandler,
156
- selectHandler,
157
- inputHandler,
158
- currentValue: settings[property.name]
159
- })
160
- ] }, property.name)) });
161
- };
162
-
163
- exports.FormControl = FormControl;
164
- exports.SettingsForm = SettingsForm;
165
- exports.isBooleanProperty = isBooleanProperty;
166
- exports.isOption = isOption;
167
- exports.isStringOrNumber = isStringOrNumber;
168
- //# sourceMappingURL=SettingsForm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SettingsForm.js","sources":["../../../../packages/vuu-shell/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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"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var userSettingsPanelCss = ".vuuUserSettingsPanel {\n height: 100%;\n overflow: auto;\n}\n";
4
-
5
- module.exports = userSettingsPanelCss;
6
- //# sourceMappingURL=UserSettingsPanel.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"UserSettingsPanel.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,42 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var styles = require('@salt-ds/styles');
5
- var window = require('@salt-ds/window');
6
- var ApplicationProvider = require('../application-provider/ApplicationProvider.js');
7
- var SettingsForm = require('./SettingsForm.js');
8
- var cx = require('clsx');
9
- var UserSettingsPanel$1 = require('./UserSettingsPanel.css.js');
10
-
11
- const classBase = "vuuUserSettingsPanel";
12
- const UserSettingsPanel = ({
13
- ...htmlAttributes
14
- }) => {
15
- const targetWindow = window.useWindow();
16
- styles.useComponentCssInjection({
17
- testId: "vuu-user-settings-panel",
18
- css: UserSettingsPanel$1,
19
- window: targetWindow
20
- });
21
- const {
22
- onUserSettingChanged,
23
- userSettings = {},
24
- userSettingsSchema
25
- } = ApplicationProvider.useApplicationSettings();
26
- if (userSettingsSchema) {
27
- return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlAttributes, className: cx(classBase, "vuuScrollable"), children: /* @__PURE__ */ jsxRuntime.jsx(
28
- SettingsForm.SettingsForm,
29
- {
30
- settings: userSettings,
31
- settingsSchema: userSettingsSchema,
32
- onSettingChanged: onUserSettingChanged
33
- }
34
- ) });
35
- } else {
36
- console.log("no settingsSchema provided to UserSettingsPanel");
37
- return null;
38
- }
39
- };
40
-
41
- exports.UserSettingsPanel = UserSettingsPanel;
42
- //# sourceMappingURL=UserSettingsPanel.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"UserSettingsPanel.js","sources":["../../../../packages/vuu-shell/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.log(\"no settingsSchema provided to UserSettingsPanel\");\n return null;\n }\n};\n"],"names":["useWindow","useComponentCssInjection","userSettingsPanelCss","useApplicationSettings","jsx","SettingsForm"],"mappings":";;;;;;;;;;AAWA,MAAM,SAAY,GAAA,sBAAA;AAEX,MAAM,oBAAoB,CAAC;AAAA,EAChC,GAAG;AACL,CAA8B,KAAA;AAC5B,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,yBAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,oBAAA;AAAA,IACA,eAAe,EAAC;AAAA,IAChB;AAAA,MACEC,0CAAuB,EAAA;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;AAAA;AAAA,KAEtB,EAAA,CAAA;AAAA,GAEG,MAAA;AACL,IAAA,OAAA,CAAQ,IAAI,iDAAiD,CAAA;AAC7D,IAAO,OAAA,IAAA;AAAA;AAEX;;;;"}
@@ -1,6 +0,0 @@
1
- 'use strict';
2
-
3
- var layoutListCss = ".vuuLayoutList {\n --vuuMeasuredContainer-flex: 1 1 1px;\n --vuuList-borderStyle: none;\n --vuuListItem-separator-color: transparent;\n\n background: var(\n --vuuLayoutList-background,\n var(--salt-container-primary-background)\n );\n display: flex;\n flex-direction: column;\n height: 100%;\n padding: 0 var(--vuuLayoutList-padding, 0);\n\n .vuuListItem {\n border-bottom: none;\n justify-content: space-between;\n }\n}\n\n.vuuLayoutList-header {\n align-items: center;\n display: flex;\n flex: 0 0 48px;\n font-weight: 700;\n line-height: 2;\n}\n\n.vuuLayoutList-content {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n font-size: 12px;\n font-weight: 700;\n overflow: auto;\n}\n\n.vuuLayoutList-group {\n --vuuMeasuredContainer-flex: 0 0 auto;\n\n display: flex;\n flex-direction: column;\n\n .vuuLayoutList-groupHeader {\n flex: 0 0 32px;\n padding: 8px 0;\n }\n\n .vuuPalette {\n flex: 1 1 auto;\n height: auto;\n }\n}\n\n.vuuLayoutList-group:first-child {\n margin-top: 12px;\n}\n\n.vuuLayoutList-group + .vuuLayoutList-group {\n margin-top: 24px;\n}\n\n/* .vuuLayoutList-groupName {\n display: flex;\n padding-top: 24px;\n width: var(--vuuLayoutList-width);\n font-feature-settings: \"ss02\" on, \"ss01\" on, \"salt\" on, \"liga\" off;\n font-size: 12px;\n font-style: normal;\n font-weight: 700;\n line-height: 200%;\n letter-spacing: 0.48px;\n text-transform: uppercase;\n} */\n\n.vuuLayoutList-screenshot {\n width: 60px;\n height: 45.6px;\n border: 1px solid #d6d7da;\n}\n\n.vuuLayoutList-layoutDetails {\n color: var(--light-text-secondary, #606477);\n font-size: 10px;\n font-weight: 600;\n line-height: 150%;\n}\n";
4
-
5
- module.exports = layoutListCss;
6
- //# sourceMappingURL=LayoutList.css.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LayoutList.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
@@ -1,116 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
- var React = require('react');
5
- var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
6
- var core = require('@salt-ds/core');
7
- var vuuUtils = require('@vuu-ui/vuu-utils');
8
- var styles = require('@salt-ds/styles');
9
- var window = require('@salt-ds/window');
10
- var cx = require('clsx');
11
- var LayoutTile = require('./LayoutTile.js');
12
- var WorkspaceProvider = require('./WorkspaceProvider.js');
13
- var FeatureAndLayoutProvider = require('../feature-and-layout-provider/FeatureAndLayoutProvider.js');
14
- var vuuLayout = require('@vuu-ui/vuu-layout');
15
- var LayoutList$1 = require('./LayoutList.css.js');
16
-
17
- const classBase = "vuuLayoutList";
18
- const NO_SELECTION = [];
19
- const LayoutList = ({
20
- className,
21
- title,
22
- ...htmlAttributes
23
- }) => {
24
- const targetWindow = window.useWindow();
25
- styles.useComponentCssInjection({
26
- testId: "vuu-layout-list",
27
- css: LayoutList$1,
28
- window: targetWindow
29
- });
30
- const { layoutMetadata, loadLayoutById } = WorkspaceProvider.useWorkspace();
31
- const { systemLayouts } = FeatureAndLayoutProvider.useLayouts();
32
- const handleLoadLayout = React.useCallback(
33
- (layoutId) => {
34
- if (layoutId) {
35
- loadLayoutById(layoutId);
36
- }
37
- },
38
- [loadLayoutById]
39
- );
40
- const dispatch = vuuLayout.useLayoutProviderDispatch();
41
- const handleLoadSysLayout = (layoutId, layoutJSON) => {
42
- if (layoutJSON) {
43
- dispatch({
44
- type: "add",
45
- path: `#${vuuUtils.VuuShellLocation.Workspace}`,
46
- component: vuuLayout.layoutFromJson(layoutJSON, "0")
47
- });
48
- } else {
49
- throw Error("layoutJSON is required for system layouts");
50
- }
51
- };
52
- const layoutsByGroup = layoutMetadata.reduce((acc, cur) => {
53
- if (acc[cur.group]) {
54
- return {
55
- ...acc,
56
- [cur.group]: [...acc[cur.group], cur]
57
- };
58
- }
59
- return {
60
- ...acc,
61
- [cur.group]: [cur]
62
- };
63
- }, {});
64
- let sysContent = [];
65
- if (systemLayouts) {
66
- sysContent = [
67
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}-group`, children: [
68
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-groupHeader`, children: "System Layout" }),
69
- /* @__PURE__ */ jsxRuntime.jsx(core.ListBox, { selected: NO_SELECTION, children: systemLayouts.map((layout) => /* @__PURE__ */ jsxRuntime.jsx(core.Option, { value: layout, children: /* @__PURE__ */ React.createElement(
70
- LayoutTile.LayoutTile,
71
- {
72
- ...htmlAttributes,
73
- key: layout.id,
74
- metadata: layout,
75
- onLoadLayout: handleLoadSysLayout
76
- }
77
- ) }, layout.id)) })
78
- ] }, 0)
79
- ];
80
- }
81
- const content = React.useMemo(() => {
82
- return Object.entries(layoutsByGroup).map(
83
- ([heading, layoutMetadata2], index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${classBase}-group`, children: [
84
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-groupHeader`, children: heading }),
85
- /* @__PURE__ */ jsxRuntime.jsx(core.ListBox, { selected: NO_SELECTION, children: layoutMetadata2.map((layout) => /* @__PURE__ */ jsxRuntime.jsxs(core.Option, { value: layout, children: [
86
- /* @__PURE__ */ React.createElement(
87
- LayoutTile.LayoutTile,
88
- {
89
- ...htmlAttributes,
90
- key: layout.id,
91
- metadata: layout,
92
- onLoadLayout: handleLoadLayout
93
- }
94
- ),
95
- /* @__PURE__ */ jsxRuntime.jsx(
96
- vuuUiControls.IconButton,
97
- {
98
- className: `${classBase}-menu`,
99
- "data-embedded": true,
100
- icon: "more-vert",
101
- appearance: "transparent",
102
- sentiment: "neutral"
103
- }
104
- )
105
- ] }, layout.id)) })
106
- ] }, index)
107
- );
108
- }, [handleLoadLayout, htmlAttributes, layoutsByGroup]);
109
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...htmlAttributes, className: cx(classBase, "vuuScrollable"), children: [
110
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-header`, children: title }),
111
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-content`, children: [sysContent, ...content] })
112
- ] });
113
- };
114
-
115
- exports.LayoutList = LayoutList;
116
- //# sourceMappingURL=LayoutList.js.map