@vuu-ui/vuu-shell 0.8.82 → 0.8.83

package/esm/shell-layout-templates/context-panel/ContextPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextPanel.js","sources":["../../../src/shell-layout-templates/context-panel/ContextPanel.tsx"],"sourcesContent":["import {\n  View,\n  layoutFromJson,\n  useLayoutProviderDispatch,\n} from \"@vuu-ui/vuu-layout\";\nimport { IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { LayoutJSON, VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { useCallback, useMemo } from \"react\";\n\nimport contextPanelCss from \"./ContextPanel.css\";\n\nconst classBase = \"vuuContextPanel\";\n\nexport interface ContextPanelProps {\n  [key: string]: unknown;\n  className?: string;\n  content?: LayoutJSON;\n  expanded?: boolean;\n  id?: string;\n  overlay?: boolean;\n}\n\nexport const ContextPanel = ({\n  className: classNameProp,\n  expanded = false,\n  content: contentProp,\n  id = VuuShellLocation.ContextPanel,\n  overlay = false,\n  title,\n}: ContextPanelProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-context-panel\",\n    css: contextPanelCss,\n    window: targetWindow,\n  });\n\n  const dispatchLayoutAction = useLayoutProviderDispatch();\n  // const [contentJson, setContentJson] = useState(contentProp);\n  const handleClose = useCallback(() => {\n    dispatchLayoutAction({\n      path: `#${VuuShellLocation.ContextPanel}`,\n      propName: \"expanded\",\n      propValue: false,\n      type: \"set-prop\",\n    });\n  }, [dispatchLayoutAction]);\n  // TODO look up content using context\n\n  const className = cx(classBase, classNameProp, {\n    [`${classBase}-expanded`]: expanded,\n    [`${classBase}-inline`]: overlay !== true,\n    [`${classBase}-overlay`]: overlay,\n  });\n\n  const content = useMemo(\n    () =>\n      contentProp && expanded ? layoutFromJson(contentProp, \"context-0\") : null,\n    [contentProp, expanded]\n  );\n\n  return (\n    <div\n      className={cx(classBase, className, \"vuuScrollable\", {\n        [`${classBase}-expanded`]: expanded,\n      })}\n    >\n      <View className={`${classBase}-inner`} header={false} id={id}>\n        <div className={`${classBase}-header`}>\n          <h2 className={`${classBase}-title`}>{title}</h2>\n          <IconButton\n            className={`${classBase}-close`}\n            data-embedded\n            icon=\"close\"\n            onClick={handleClose}\n            size={16}\n            variant=\"secondary\"\n          />\n        </div>\n        <div className={`${classBase}-content`}>{content}</div>\n      </View>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAcA,MAAM,SAAY,GAAA,iBAAA,CAAA;AAWX,MAAM,eAAe,CAAC;AAAA,EAC3B,SAAW,EAAA,aAAA;AAAA,EACX,QAAW,GAAA,KAAA;AAAA,EACX,OAAS,EAAA,WAAA;AAAA,EACT,KAAK,gBAAiB,CAAA,YAAA;AAAA,EACtB,OAAU,GAAA,KAAA;AAAA,EACV,KAAA;AACF,CAAyB,KAAA;AACvB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAA,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,uBAAuB,yBAA0B,EAAA,CAAA;AAEvD,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAqB,oBAAA,CAAA;AAAA,MACnB,IAAA,EAAM,CAAI,CAAA,EAAA,gBAAA,CAAiB,YAAY,CAAA,CAAA;AAAA,MACvC,QAAU,EAAA,UAAA;AAAA,MACV,SAAW,EAAA,KAAA;AAAA,MACX,IAAM,EAAA,UAAA;AAAA,KACP,CAAA,CAAA;AAAA,GACH,EAAG,CAAC,oBAAoB,CAAC,CAAA,CAAA;AAGzB,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAe,EAAA;AAAA,IAC7C,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,QAAA;AAAA,IAC3B,CAAC,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,GAAG,OAAY,KAAA,IAAA;AAAA,IACrC,CAAC,CAAA,EAAG,SAAS,CAAA,QAAA,CAAU,GAAG,OAAA;AAAA,GAC3B,CAAA,CAAA;AAED,EAAA,MAAM,OAAU,GAAA,OAAA;AAAA,IACd,MACE,WAAe,IAAA,QAAA,GAAW,cAAe,CAAA,WAAA,EAAa,WAAW,CAAI,GAAA,IAAA;AAAA,IACvE,CAAC,aAAa,QAAQ,CAAA;AAAA,GACxB,CAAA;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,EAAA,CAAG,SAAW,EAAA,SAAA,EAAW,eAAiB,EAAA;AAAA,QACnD,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,QAAA;AAAA,OAC5B,CAAA;AAAA,MAED,QAAA,kBAAA,IAAA,CAAC,QAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAU,MAAA,CAAA,EAAA,MAAA,EAAQ,OAAO,EACpD,EAAA,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAC1B,OAAA,CAAA,EAAA,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAG,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAW,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,0BAC5C,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,GAAG,SAAS,CAAA,MAAA,CAAA;AAAA,cACvB,eAAa,EAAA,IAAA;AAAA,cACb,IAAK,EAAA,OAAA;AAAA,cACL,OAAS,EAAA,WAAA;AAAA,cACT,IAAM,EAAA,EAAA;AAAA,cACN,OAAQ,EAAA,WAAA;AAAA,aAAA;AAAA,WACV;AAAA,SACF,EAAA,CAAA;AAAA,4BACC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,YAAa,QAAQ,EAAA,OAAA,EAAA,CAAA;AAAA,OACnD,EAAA,CAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ContextPanel.js","sources":["../../../src/shell-layout-templates/context-panel/ContextPanel.tsx"],"sourcesContent":["import {\n  View,\n  layoutFromJson,\n  useLayoutProviderDispatch,\n} from \"@vuu-ui/vuu-layout\";\nimport { IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { LayoutJSON, VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { useCallback, useMemo } from \"react\";\n\nimport contextPanelCss from \"./ContextPanel.css\";\n\nconst classBase = \"vuuContextPanel\";\n\nexport interface ContextPanelProps {\n  [key: string]: unknown;\n  className?: string;\n  content?: LayoutJSON;\n  expanded?: boolean;\n  id?: string;\n  overlay?: boolean;\n}\n\nexport const ContextPanel = ({\n  className: classNameProp,\n  expanded = false,\n  content: contentProp,\n  id = VuuShellLocation.ContextPanel,\n  overlay = false,\n  title,\n}: ContextPanelProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-context-panel\",\n    css: contextPanelCss,\n    window: targetWindow,\n  });\n\n  const dispatchLayoutAction = useLayoutProviderDispatch();\n  // const [contentJson, setContentJson] = useState(contentProp);\n  const handleClose = useCallback(() => {\n    dispatchLayoutAction({\n      path: `#${VuuShellLocation.ContextPanel}`,\n      propName: \"expanded\",\n      propValue: false,\n      type: \"set-prop\",\n    });\n  }, [dispatchLayoutAction]);\n  // TODO look up content using context\n\n  const className = cx(classBase, classNameProp, {\n    [`${classBase}-expanded`]: expanded,\n    [`${classBase}-inline`]: overlay !== true,\n    [`${classBase}-overlay`]: overlay,\n  });\n\n  const content = useMemo(\n    () =>\n      contentProp && expanded ? layoutFromJson(contentProp, \"context-0\") : null,\n    [contentProp, expanded],\n  );\n\n  return (\n    <div\n      className={cx(classBase, className, \"vuuScrollable\", {\n        [`${classBase}-expanded`]: expanded,\n      })}\n    >\n      <View className={`${classBase}-inner`} header={false} id={id}>\n        <div className={`${classBase}-header`}>\n          <h2 className={`${classBase}-title`}>{title}</h2>\n          <IconButton\n            className={`${classBase}-close`}\n            data-embedded\n            icon=\"close\"\n            onClick={handleClose}\n            size={16}\n            variant=\"secondary\"\n          />\n        </div>\n        <div className={`${classBase}-content`}>{content}</div>\n      </View>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAcA,MAAM,SAAY,GAAA,iBAAA,CAAA;AAWX,MAAM,eAAe,CAAC;AAAA,EAC3B,SAAW,EAAA,aAAA;AAAA,EACX,QAAW,GAAA,KAAA;AAAA,EACX,OAAS,EAAA,WAAA;AAAA,EACT,KAAK,gBAAiB,CAAA,YAAA;AAAA,EACtB,OAAU,GAAA,KAAA;AAAA,EACV,KAAA;AACF,CAAyB,KAAA;AACvB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAA,eAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,uBAAuB,yBAA0B,EAAA,CAAA;AAEvD,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAqB,oBAAA,CAAA;AAAA,MACnB,IAAA,EAAM,CAAI,CAAA,EAAA,gBAAA,CAAiB,YAAY,CAAA,CAAA;AAAA,MACvC,QAAU,EAAA,UAAA;AAAA,MACV,SAAW,EAAA,KAAA;AAAA,MACX,IAAM,EAAA,UAAA;AAAA,KACP,CAAA,CAAA;AAAA,GACH,EAAG,CAAC,oBAAoB,CAAC,CAAA,CAAA;AAGzB,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAe,EAAA;AAAA,IAC7C,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,QAAA;AAAA,IAC3B,CAAC,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,GAAG,OAAY,KAAA,IAAA;AAAA,IACrC,CAAC,CAAA,EAAG,SAAS,CAAA,QAAA,CAAU,GAAG,OAAA;AAAA,GAC3B,CAAA,CAAA;AAED,EAAA,MAAM,OAAU,GAAA,OAAA;AAAA,IACd,MACE,WAAe,IAAA,QAAA,GAAW,cAAe,CAAA,WAAA,EAAa,WAAW,CAAI,GAAA,IAAA;AAAA,IACvE,CAAC,aAAa,QAAQ,CAAA;AAAA,GACxB,CAAA;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,EAAA,CAAG,SAAW,EAAA,SAAA,EAAW,eAAiB,EAAA;AAAA,QACnD,CAAC,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW,GAAG,QAAA;AAAA,OAC5B,CAAA;AAAA,MAED,QAAA,kBAAA,IAAA,CAAC,QAAK,SAAW,EAAA,CAAA,EAAG,SAAS,CAAU,MAAA,CAAA,EAAA,MAAA,EAAQ,OAAO,EACpD,EAAA,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAC1B,OAAA,CAAA,EAAA,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAG,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAW,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,0BAC5C,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,GAAG,SAAS,CAAA,MAAA,CAAA;AAAA,cACvB,eAAa,EAAA,IAAA;AAAA,cACb,IAAK,EAAA,OAAA;AAAA,cACL,OAAS,EAAA,WAAA;AAAA,cACT,IAAM,EAAA,EAAA;AAAA,cACN,OAAQ,EAAA,WAAA;AAAA,aAAA;AAAA,WACV;AAAA,SACF,EAAA,CAAA;AAAA,4BACC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,YAAa,QAAQ,EAAA,OAAA,EAAA,CAAA;AAAA,OACnD,EAAA,CAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}

package/esm/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js

@@ -7,7 +7,7 @@ import { useMemo } from 'react';
 
 const useFullHeightLeftPanel = ({
   appHeader,
-  LeftSidePanelProps,
+  SidePanelProps: LeftSidePanelProps,
   htmlAttributes
 }) => useMemo(
   () => /* @__PURE__ */ jsxs(

package/esm/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFullHeightLeftPanel.js","sources":["../../../src/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.tsx"],"sourcesContent":["import { LayoutContainer, Flexbox } from \"@vuu-ui/vuu-layout\";\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { ContextPanel } from \"../context-panel\";\nimport { SidePanel } from \"../side-panel\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\nimport { useMemo } from \"react\";\n\nexport const useFullHeightLeftPanel: ShellLayoutTemplateHook = ({\n  appHeader,\n  LeftSidePanelProps,\n  htmlAttributes,\n}) =>\n  useMemo(\n    () => (\n      <Flexbox\n        {...htmlAttributes}\n        style={{\n          ...htmlAttributes?.style,\n          flexDirection: \"row\",\n        }}\n      >\n        <SidePanel {...LeftSidePanelProps} id={VuuShellLocation.SidePanel} />\n        <Flexbox\n          className=\"vuuShell-content\"\n          style={{ flex: 1, flexDirection: \"column\" }}\n        >\n          {appHeader}\n          <LayoutContainer\n            id={VuuShellLocation.WorkspaceContainer}\n            key=\"main-content\"\n            style={{ flex: 1 }}\n          />\n        </Flexbox>\n        <ContextPanel id={VuuShellLocation.ContextPanel} overlay></ContextPanel>\n      </Flexbox>\n    ),\n    [LeftSidePanelProps, appHeader, htmlAttributes]\n  );\n"],"names":[],"mappings":";;;;;;;AAOO,MAAM,yBAAkD,CAAC;AAAA,EAC9D,SAAA;AAAA,EACA,kBAAA;AAAA,EACA,cAAA;AACF,CACE,KAAA,OAAA;AAAA,EACE,sBACE,IAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,GAAG,cAAgB,EAAA,KAAA;AAAA,QACnB,aAAe,EAAA,KAAA;AAAA,OACjB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,SAAW,EAAA,EAAA,GAAG,kBAAoB,EAAA,EAAA,EAAI,iBAAiB,SAAW,EAAA,CAAA;AAAA,wBACnE,IAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,kBAAA;AAAA,YACV,KAAO,EAAA,EAAE,IAAM,EAAA,CAAA,EAAG,eAAe,QAAS,EAAA;AAAA,YAEzC,QAAA,EAAA;AAAA,cAAA,SAAA;AAAA,8BACD,GAAA;AAAA,gBAAC,eAAA;AAAA,gBAAA;AAAA,kBACC,IAAI,gBAAiB,CAAA,kBAAA;AAAA,kBAErB,KAAA,EAAO,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,iBAAA;AAAA,gBADb,cAAA;AAAA,eAEN;AAAA,aAAA;AAAA,WAAA;AAAA,SACF;AAAA,4BACC,YAAa,EAAA,EAAA,EAAA,EAAI,gBAAiB,CAAA,YAAA,EAAc,SAAO,IAAC,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAC3D;AAAA,EAEF,CAAC,kBAAoB,EAAA,SAAA,EAAW,cAAc,CAAA;AAChD;;;;"}
+{"version":3,"file":"useFullHeightLeftPanel.js","sources":["../../../src/shell-layout-templates/full-height-left-panel/useFullHeightLeftPanel.tsx"],"sourcesContent":["import { LayoutContainer, Flexbox } from \"@vuu-ui/vuu-layout\";\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { ContextPanel } from \"../context-panel\";\nimport { SidePanel } from \"../side-panel\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\nimport { useMemo } from \"react\";\n\nexport const useFullHeightLeftPanel: ShellLayoutTemplateHook = ({\n  appHeader,\n  SidePanelProps: LeftSidePanelProps,\n  htmlAttributes,\n}) =>\n  useMemo(\n    () => (\n      <Flexbox\n        {...htmlAttributes}\n        style={{\n          ...htmlAttributes?.style,\n          flexDirection: \"row\",\n        }}\n      >\n        <SidePanel {...LeftSidePanelProps} id={VuuShellLocation.SidePanel} />\n        <Flexbox\n          className=\"vuuShell-content\"\n          style={{ flex: 1, flexDirection: \"column\" }}\n        >\n          {appHeader}\n          <LayoutContainer\n            id={VuuShellLocation.WorkspaceContainer}\n            key=\"main-content\"\n            style={{ flex: 1 }}\n          />\n        </Flexbox>\n        <ContextPanel id={VuuShellLocation.ContextPanel} overlay></ContextPanel>\n      </Flexbox>\n    ),\n    [LeftSidePanelProps, appHeader, htmlAttributes],\n  );\n"],"names":[],"mappings":";;;;;;;AAOO,MAAM,yBAAkD,CAAC;AAAA,EAC9D,SAAA;AAAA,EACA,cAAgB,EAAA,kBAAA;AAAA,EAChB,cAAA;AACF,CACE,KAAA,OAAA;AAAA,EACE,sBACE,IAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,GAAG,cAAgB,EAAA,KAAA;AAAA,QACnB,aAAe,EAAA,KAAA;AAAA,OACjB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,SAAW,EAAA,EAAA,GAAG,kBAAoB,EAAA,EAAA,EAAI,iBAAiB,SAAW,EAAA,CAAA;AAAA,wBACnE,IAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,kBAAA;AAAA,YACV,KAAO,EAAA,EAAE,IAAM,EAAA,CAAA,EAAG,eAAe,QAAS,EAAA;AAAA,YAEzC,QAAA,EAAA;AAAA,cAAA,SAAA;AAAA,8BACD,GAAA;AAAA,gBAAC,eAAA;AAAA,gBAAA;AAAA,kBACC,IAAI,gBAAiB,CAAA,kBAAA;AAAA,kBAErB,KAAA,EAAO,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,iBAAA;AAAA,gBADb,cAAA;AAAA,eAEN;AAAA,aAAA;AAAA,WAAA;AAAA,SACF;AAAA,4BACC,YAAa,EAAA,EAAA,EAAA,EAAI,gBAAiB,CAAA,YAAA,EAAc,SAAO,IAAC,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAC3D;AAAA,EAEF,CAAC,kBAAoB,EAAA,SAAA,EAAW,cAAc,CAAA;AAChD;;;;"}

package/esm/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.js

@@ -4,7 +4,7 @@ import { VuuShellLocation } from '@vuu-ui/vuu-utils';
 import { useRef, useState, useCallback, useMemo } from 'react';
 
 const useInlayLeftPanel = ({
-  LeftSidePanelProps,
+  SidePanelProps: LeftSidePanelProps,
   appHeader,
   htmlAttributes
 }) => {

package/esm/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInlayLeftPanel.js","sources":["../../../src/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.tsx"],"sourcesContent":["import {\n  DockLayout,\n  LayoutContainer,\n  Drawer,\n  Flexbox,\n  View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport {\n  MouseEvent,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\n\nexport const useInlayLeftPanel: ShellLayoutTemplateHook = ({\n  LeftSidePanelProps,\n  appHeader,\n  htmlAttributes,\n}) => {\n  const paletteView = useRef<HTMLDivElement>(null);\n  const [open, setOpen] = useState(true);\n  const handleDrawerClick = useCallback(\n    (e: MouseEvent<HTMLElement>) => {\n      const target = e.target as HTMLElement;\n      if (!paletteView.current?.contains(target)) {\n        setOpen(!open);\n      }\n    },\n    [open]\n  );\n\n  return useMemo(() => {\n    const getDrawers = (leftSidePanel: ReactNode) => {\n      const drawers: ReactElement[] = [];\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      return drawers;\n    };\n\n    return (\n      <Flexbox\n        {...htmlAttributes}\n        style={{\n          ...htmlAttributes?.style,\n          flexDirection: \"column\",\n        }}\n      >\n        {appHeader}\n        <DockLayout style={{ flex: 1 }}>\n          {getDrawers(LeftSidePanelProps?.children).concat(\n            <LayoutContainer\n              dropTarget\n              id={VuuShellLocation.WorkspaceContainer}\n              key=\"main-content\"\n              style={{ width: \"100%\", height: \"100%\" }}\n            />\n          )}\n        </DockLayout>\n      </Flexbox>\n    );\n  }, [LeftSidePanelProps, appHeader, handleDrawerClick, htmlAttributes, open]);\n};\n"],"names":[],"mappings":";;;;;AAoBO,MAAM,oBAA6C,CAAC;AAAA,EACzD,kBAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AACF,CAAM,KAAA;AACJ,EAAM,MAAA,WAAA,GAAc,OAAuB,IAAI,CAAA,CAAA;AAC/C,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,IAAI,CAAA,CAAA;AACrC,EAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,IACxB,CAAC,CAA+B,KAAA;AAC9B,MAAA,MAAM,SAAS,CAAE,CAAA,MAAA,CAAA;AACjB,MAAA,IAAI,CAAC,WAAA,CAAY,OAAS,EAAA,QAAA,CAAS,MAAM,CAAG,EAAA;AAC1C,QAAA,OAAA,CAAQ,CAAC,IAAI,CAAA,CAAA;AAAA,OACf;AAAA,KACF;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAM,MAAA,UAAA,GAAa,CAAC,aAA6B,KAAA;AAC/C,MAAA,MAAM,UAA0B,EAAC,CAAA;AACjC,MAAQ,OAAA,CAAA,IAAA;AAAA,wBACN,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YAEC,OAAS,EAAA,iBAAA;AAAA,YACT,IAAA;AAAA,YACA,QAAS,EAAA,MAAA;AAAA,YACT,MAAM,EAAA,IAAA;AAAA,YACN,QAAQ,EAAA,IAAA;AAAA,YACR,QAAU,EAAA,GAAA;AAAA,YACV,YAAa,EAAA,KAAA;AAAA,YAEb,QAAA,kBAAA,GAAA;AAAA,cAAC,IAAA;AAAA,cAAA;AAAA,gBACC,SAAU,EAAA,kBAAA;AAAA,gBACV,EAAG,EAAA,gBAAA;AAAA,gBAEH,GAAK,EAAA,WAAA;AAAA,gBACL,KAAA,EAAO,EAAE,MAAA,EAAQ,MAAO,EAAA;AAAA,gBAEvB,QAAA,EAAA,aAAA;AAAA,eAAA;AAAA,cAJG,aAAA;AAAA,aAKN;AAAA,WAAA;AAAA,UAjBI,YAAA;AAAA,SAkBN;AAAA,OACF,CAAA;AAEA,MAAO,OAAA,OAAA,CAAA;AAAA,KACT,CAAA;AAEA,IACE,uBAAA,IAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACE,GAAG,cAAA;AAAA,QACJ,KAAO,EAAA;AAAA,UACL,GAAG,cAAgB,EAAA,KAAA;AAAA,UACnB,aAAe,EAAA,QAAA;AAAA,SACjB;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,SAAA;AAAA,0BACD,GAAA,CAAC,UAAW,EAAA,EAAA,KAAA,EAAO,EAAE,IAAA,EAAM,GACxB,EAAA,QAAA,EAAA,UAAA,CAAW,kBAAoB,EAAA,QAAQ,CAAE,CAAA,MAAA;AAAA,4BACxC,GAAA;AAAA,cAAC,eAAA;AAAA,cAAA;AAAA,gBACC,UAAU,EAAA,IAAA;AAAA,gBACV,IAAI,gBAAiB,CAAA,kBAAA;AAAA,gBAErB,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,EAAQ,QAAQ,MAAO,EAAA;AAAA,eAAA;AAAA,cADnC,cAAA;AAAA,aAEN;AAAA,WAEJ,EAAA,CAAA;AAAA,SAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,KAED,CAAC,kBAAA,EAAoB,WAAW,iBAAmB,EAAA,cAAA,EAAgB,IAAI,CAAC,CAAA,CAAA;AAC7E;;;;"}
+{"version":3,"file":"useInlayLeftPanel.js","sources":["../../../src/shell-layout-templates/inlay-left-panel/useInlayLeftPanel.tsx"],"sourcesContent":["import {\n  DockLayout,\n  LayoutContainer,\n  Drawer,\n  Flexbox,\n  View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport {\n  MouseEvent,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\n\nexport const useInlayLeftPanel: ShellLayoutTemplateHook = ({\n  SidePanelProps: LeftSidePanelProps,\n  appHeader,\n  htmlAttributes,\n}) => {\n  const paletteView = useRef<HTMLDivElement>(null);\n  const [open, setOpen] = useState(true);\n  const handleDrawerClick = useCallback(\n    (e: MouseEvent<HTMLElement>) => {\n      const target = e.target as HTMLElement;\n      if (!paletteView.current?.contains(target)) {\n        setOpen(!open);\n      }\n    },\n    [open],\n  );\n\n  return useMemo(() => {\n    const getDrawers = (leftSidePanel: ReactNode) => {\n      const drawers: ReactElement[] = [];\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      return drawers;\n    };\n\n    return (\n      <Flexbox\n        {...htmlAttributes}\n        style={{\n          ...htmlAttributes?.style,\n          flexDirection: \"column\",\n        }}\n      >\n        {appHeader}\n        <DockLayout style={{ flex: 1 }}>\n          {getDrawers(LeftSidePanelProps?.children).concat(\n            <LayoutContainer\n              dropTarget\n              id={VuuShellLocation.WorkspaceContainer}\n              key=\"main-content\"\n              style={{ width: \"100%\", height: \"100%\" }}\n            />,\n          )}\n        </DockLayout>\n      </Flexbox>\n    );\n  }, [LeftSidePanelProps, appHeader, handleDrawerClick, htmlAttributes, open]);\n};\n"],"names":[],"mappings":";;;;;AAoBO,MAAM,oBAA6C,CAAC;AAAA,EACzD,cAAgB,EAAA,kBAAA;AAAA,EAChB,SAAA;AAAA,EACA,cAAA;AACF,CAAM,KAAA;AACJ,EAAM,MAAA,WAAA,GAAc,OAAuB,IAAI,CAAA,CAAA;AAC/C,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,IAAI,CAAA,CAAA;AACrC,EAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,IACxB,CAAC,CAA+B,KAAA;AAC9B,MAAA,MAAM,SAAS,CAAE,CAAA,MAAA,CAAA;AACjB,MAAA,IAAI,CAAC,WAAA,CAAY,OAAS,EAAA,QAAA,CAAS,MAAM,CAAG,EAAA;AAC1C,QAAA,OAAA,CAAQ,CAAC,IAAI,CAAA,CAAA;AAAA,OACf;AAAA,KACF;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAM,MAAA,UAAA,GAAa,CAAC,aAA6B,KAAA;AAC/C,MAAA,MAAM,UAA0B,EAAC,CAAA;AACjC,MAAQ,OAAA,CAAA,IAAA;AAAA,wBACN,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YAEC,OAAS,EAAA,iBAAA;AAAA,YACT,IAAA;AAAA,YACA,QAAS,EAAA,MAAA;AAAA,YACT,MAAM,EAAA,IAAA;AAAA,YACN,QAAQ,EAAA,IAAA;AAAA,YACR,QAAU,EAAA,GAAA;AAAA,YACV,YAAa,EAAA,KAAA;AAAA,YAEb,QAAA,kBAAA,GAAA;AAAA,cAAC,IAAA;AAAA,cAAA;AAAA,gBACC,SAAU,EAAA,kBAAA;AAAA,gBACV,EAAG,EAAA,gBAAA;AAAA,gBAEH,GAAK,EAAA,WAAA;AAAA,gBACL,KAAA,EAAO,EAAE,MAAA,EAAQ,MAAO,EAAA;AAAA,gBAEvB,QAAA,EAAA,aAAA;AAAA,eAAA;AAAA,cAJG,aAAA;AAAA,aAKN;AAAA,WAAA;AAAA,UAjBI,YAAA;AAAA,SAkBN;AAAA,OACF,CAAA;AAEA,MAAO,OAAA,OAAA,CAAA;AAAA,KACT,CAAA;AAEA,IACE,uBAAA,IAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACE,GAAG,cAAA;AAAA,QACJ,KAAO,EAAA;AAAA,UACL,GAAG,cAAgB,EAAA,KAAA;AAAA,UACnB,aAAe,EAAA,QAAA;AAAA,SACjB;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,SAAA;AAAA,0BACD,GAAA,CAAC,UAAW,EAAA,EAAA,KAAA,EAAO,EAAE,IAAA,EAAM,GACxB,EAAA,QAAA,EAAA,UAAA,CAAW,kBAAoB,EAAA,QAAQ,CAAE,CAAA,MAAA;AAAA,4BACxC,GAAA;AAAA,cAAC,eAAA;AAAA,cAAA;AAAA,gBACC,UAAU,EAAA,IAAA;AAAA,gBACV,IAAI,gBAAiB,CAAA,kBAAA;AAAA,gBAErB,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,EAAQ,QAAQ,MAAO,EAAA;AAAA,eAAA;AAAA,cADnC,cAAA;AAAA,aAEN;AAAA,WAEJ,EAAA,CAAA;AAAA,SAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,KAED,CAAC,kBAAA,EAAoB,WAAW,iBAAmB,EAAA,cAAA,EAAgB,IAAI,CAAC,CAAA,CAAA;AAC7E;;;;"}

package/esm/shell-layout-templates/left-main-tabs/useLeftMainTabs.js

@@ -0,0 +1,64 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Flexbox, Stack, Placeholder, LayoutContainer } from '@vuu-ui/vuu-layout';
+import { VuuShellLocation } from '@vuu-ui/vuu-utils';
+import { useMemo } from 'react';
+
+const useLeftMainTabs = ({
+  appHeader,
+  htmlAttributes,
+  ToolbarProps
+}) => {
+  if (ToolbarProps === void 0) {
+    throw Error("LeftMainTabs layout requires ToolbarProps");
+  }
+  return useMemo(() => {
+    const flexBasis = ToolbarProps?.width ?? 48;
+    return /* @__PURE__ */ jsxs(
+      Flexbox,
+      {
+        ...htmlAttributes,
+        style: {
+          ...htmlAttributes?.style,
+          flexDirection: "column"
+        },
+        children: [
+          appHeader,
+          /* @__PURE__ */ jsxs(Flexbox, { style: { flex: 1 }, children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                ...ToolbarProps,
+                style: { flexShrink: 0, flexGrow: 0, flexBasis },
+                id: VuuShellLocation.SideToolbar,
+                children: ToolbarProps.children
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Stack,
+              {
+                style: { flex: 1 },
+                showTabs: false,
+                id: VuuShellLocation.MultiWorkspaceContainer,
+                children: [
+                  /* @__PURE__ */ jsx(Placeholder, { style: { background: "yellow" } }),
+                  /* @__PURE__ */ jsx(Placeholder, { style: { background: "green" } }),
+                  /* @__PURE__ */ jsx(
+                    LayoutContainer,
+                    {
+                      dropTarget: true,
+                      id: VuuShellLocation.WorkspaceContainer
+                    },
+                    "main-content"
+                  )
+                ]
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }, [ToolbarProps, appHeader, htmlAttributes]);
+};
+
+export { useLeftMainTabs };
+//# sourceMappingURL=useLeftMainTabs.js.map

package/esm/shell-layout-templates/left-main-tabs/useLeftMainTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLeftMainTabs.js","sources":["../../../src/shell-layout-templates/left-main-tabs/useLeftMainTabs.tsx"],"sourcesContent":["import {\n  LayoutContainer,\n  Flexbox,\n  Stack,\n  Placeholder,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { useMemo } from \"react\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\n\nexport const useLeftMainTabs: ShellLayoutTemplateHook = ({\n  appHeader,\n  htmlAttributes,\n  ToolbarProps,\n}) => {\n  if (ToolbarProps === undefined) {\n    throw Error(\"LeftMainTabs layout requires ToolbarProps\");\n  }\n\n  return useMemo(() => {\n    const flexBasis = ToolbarProps?.width ?? 48;\n    return (\n      <Flexbox\n        {...htmlAttributes}\n        style={{\n          ...htmlAttributes?.style,\n          flexDirection: \"column\",\n        }}\n      >\n        {appHeader}\n        <Flexbox style={{ flex: 1 }}>\n          <div\n            {...ToolbarProps}\n            style={{ flexShrink: 0, flexGrow: 0, flexBasis }}\n            id={VuuShellLocation.SideToolbar}\n          >\n            {ToolbarProps.children}\n          </div>\n          <Stack\n            style={{ flex: 1 }}\n            showTabs={false}\n            id={VuuShellLocation.MultiWorkspaceContainer}\n          >\n            <Placeholder style={{ background: \"yellow\" }} />\n            <Placeholder style={{ background: \"green\" }} />\n            <LayoutContainer\n              dropTarget\n              id={VuuShellLocation.WorkspaceContainer}\n              key=\"main-content\"\n            />\n          </Stack>\n        </Flexbox>\n      </Flexbox>\n    );\n  }, [ToolbarProps, appHeader, htmlAttributes]);\n};\n"],"names":[],"mappings":";;;;;AAWO,MAAM,kBAA2C,CAAC;AAAA,EACvD,SAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AACF,CAAM,KAAA;AACJ,EAAA,IAAI,iBAAiB,KAAW,CAAA,EAAA;AAC9B,IAAA,MAAM,MAAM,2CAA2C,CAAA,CAAA;AAAA,GACzD;AAEA,EAAA,OAAO,QAAQ,MAAM;AACnB,IAAM,MAAA,SAAA,GAAY,cAAc,KAAS,IAAA,EAAA,CAAA;AACzC,IACE,uBAAA,IAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACE,GAAG,cAAA;AAAA,QACJ,KAAO,EAAA;AAAA,UACL,GAAG,cAAgB,EAAA,KAAA;AAAA,UACnB,aAAe,EAAA,QAAA;AAAA,SACjB;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,SAAA;AAAA,+BACA,OAAQ,EAAA,EAAA,KAAA,EAAO,EAAE,IAAA,EAAM,GACtB,EAAA,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,KAAA;AAAA,cAAA;AAAA,gBACE,GAAG,YAAA;AAAA,gBACJ,OAAO,EAAE,UAAA,EAAY,CAAG,EAAA,QAAA,EAAU,GAAG,SAAU,EAAA;AAAA,gBAC/C,IAAI,gBAAiB,CAAA,WAAA;AAAA,gBAEpB,QAAa,EAAA,YAAA,CAAA,QAAA;AAAA,eAAA;AAAA,aAChB;AAAA,4BACA,IAAA;AAAA,cAAC,KAAA;AAAA,cAAA;AAAA,gBACC,KAAA,EAAO,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,gBACjB,QAAU,EAAA,KAAA;AAAA,gBACV,IAAI,gBAAiB,CAAA,uBAAA;AAAA,gBAErB,QAAA,EAAA;AAAA,kCAAA,GAAA,CAAC,WAAY,EAAA,EAAA,KAAA,EAAO,EAAE,UAAA,EAAY,UAAY,EAAA,CAAA;AAAA,sCAC7C,WAAY,EAAA,EAAA,KAAA,EAAO,EAAE,UAAA,EAAY,SAAW,EAAA,CAAA;AAAA,kCAC7C,GAAA;AAAA,oBAAC,eAAA;AAAA,oBAAA;AAAA,sBACC,UAAU,EAAA,IAAA;AAAA,sBACV,IAAI,gBAAiB,CAAA,kBAAA;AAAA,qBAAA;AAAA,oBACjB,cAAA;AAAA,mBACN;AAAA,iBAAA;AAAA,eAAA;AAAA,aACF;AAAA,WACF,EAAA,CAAA;AAAA,SAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GAED,EAAA,CAAC,YAAc,EAAA,SAAA,EAAW,cAAc,CAAC,CAAA,CAAA;AAC9C;;;;"}

package/esm/shell-layout-templates/simple-content-pane/useSimpleContentPane.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSimpleContentPane.js","sources":["../../../src/shell-layout-templates/simple-content-pane/useSimpleContentPane.tsx"],"sourcesContent":["import { LayoutContainer, Flexbox } from \"@vuu-ui/vuu-layout\";\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { ContextPanel } from \"../context-panel\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\nimport { useMemo } from \"react\";\n\nexport const useSimpleContentPane: ShellLayoutTemplateHook = ({\n  appHeader,\n  htmlAttributes,\n}) =>\n  useMemo(\n    () => (\n      <Flexbox\n        {...htmlAttributes}\n        style={{\n          ...htmlAttributes?.style,\n          flexDirection: \"row\",\n        }}\n      >\n        <Flexbox\n          className=\"vuuShell-content\"\n          style={{ flex: 1, flexDirection: \"column\" }}\n        >\n          {appHeader}\n          <LayoutContainer\n            id={VuuShellLocation.WorkspaceContainer}\n            key=\"main-content\"\n            style={{ flex: 1 }}\n          />\n        </Flexbox>\n        <ContextPanel id={VuuShellLocation.ContextPanel} overlay></ContextPanel>\n      </Flexbox>\n    ),\n    [appHeader, htmlAttributes]\n  );\n"],"names":[],"mappings":";;;;;;AAMO,MAAM,uBAAgD,CAAC;AAAA,EAC5D,SAAA;AAAA,EACA,cAAA;AACF,CACE,KAAA,OAAA;AAAA,EACE,sBACE,IAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,GAAG,cAAgB,EAAA,KAAA;AAAA,QACnB,aAAe,EAAA,KAAA;AAAA,OACjB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,kBAAA;AAAA,YACV,KAAO,EAAA,EAAE,IAAM,EAAA,CAAA,EAAG,eAAe,QAAS,EAAA;AAAA,YAEzC,QAAA,EAAA;AAAA,cAAA,SAAA;AAAA,8BACD,GAAA;AAAA,gBAAC,eAAA;AAAA,gBAAA;AAAA,kBACC,IAAI,gBAAiB,CAAA,kBAAA;AAAA,kBAErB,KAAA,EAAO,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,iBAAA;AAAA,gBADb,cAAA;AAAA,eAEN;AAAA,aAAA;AAAA,WAAA;AAAA,SACF;AAAA,4BACC,YAAa,EAAA,EAAA,EAAA,EAAI,gBAAiB,CAAA,YAAA,EAAc,SAAO,IAAC,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAC3D;AAAA,EAEF,CAAC,WAAW,cAAc,CAAA;AAC5B;;;;"}
+{"version":3,"file":"useSimpleContentPane.js","sources":["../../../src/shell-layout-templates/simple-content-pane/useSimpleContentPane.tsx"],"sourcesContent":["import { LayoutContainer, Flexbox } from \"@vuu-ui/vuu-layout\";\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { ContextPanel } from \"../context-panel\";\nimport { ShellLayoutTemplateHook } from \"../useShellLayout\";\nimport { useMemo } from \"react\";\n\nexport const useSimpleContentPane: ShellLayoutTemplateHook = ({\n  appHeader,\n  htmlAttributes,\n}) =>\n  useMemo(\n    () => (\n      <Flexbox\n        {...htmlAttributes}\n        style={{\n          ...htmlAttributes?.style,\n          flexDirection: \"row\",\n        }}\n      >\n        <Flexbox\n          className=\"vuuShell-content\"\n          style={{ flex: 1, flexDirection: \"column\" }}\n        >\n          {appHeader}\n          <LayoutContainer\n            id={VuuShellLocation.WorkspaceContainer}\n            key=\"main-content\"\n            style={{ flex: 1 }}\n          />\n        </Flexbox>\n        <ContextPanel id={VuuShellLocation.ContextPanel} overlay></ContextPanel>\n      </Flexbox>\n    ),\n    [appHeader, htmlAttributes],\n  );\n"],"names":[],"mappings":";;;;;;AAMO,MAAM,uBAAgD,CAAC;AAAA,EAC5D,SAAA;AAAA,EACA,cAAA;AACF,CACE,KAAA,OAAA;AAAA,EACE,sBACE,IAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,cAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,GAAG,cAAgB,EAAA,KAAA;AAAA,QACnB,aAAe,EAAA,KAAA;AAAA,OACjB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,kBAAA;AAAA,YACV,KAAO,EAAA,EAAE,IAAM,EAAA,CAAA,EAAG,eAAe,QAAS,EAAA;AAAA,YAEzC,QAAA,EAAA;AAAA,cAAA,SAAA;AAAA,8BACD,GAAA;AAAA,gBAAC,eAAA;AAAA,gBAAA;AAAA,kBACC,IAAI,gBAAiB,CAAA,kBAAA;AAAA,kBAErB,KAAA,EAAO,EAAE,IAAA,EAAM,CAAE,EAAA;AAAA,iBAAA;AAAA,gBADb,cAAA;AAAA,eAEN;AAAA,aAAA;AAAA,WAAA;AAAA,SACF;AAAA,4BACC,YAAa,EAAA,EAAA,EAAA,EAAI,gBAAiB,CAAA,YAAA,EAAc,SAAO,IAAC,EAAA,CAAA;AAAA,OAAA;AAAA,KAAA;AAAA,GAC3D;AAAA,EAEF,CAAC,WAAW,cAAc,CAAA;AAC5B;;;;"}

package/esm/shell-layout-templates/useShellLayout.js

@@ -1,10 +1,12 @@
 import { useFullHeightLeftPanel } from './full-height-left-panel/useFullHeightLeftPanel.js';
 import { useInlayLeftPanel } from './inlay-left-panel/useInlayLeftPanel.js';
+import { useLeftMainTabs } from './left-main-tabs/useLeftMainTabs.js';
 import { useSimpleContentPane } from './simple-content-pane/useSimpleContentPane.js';
 
 const LayoutHook = {
   "full-height": useFullHeightLeftPanel,
   inlay: useInlayLeftPanel,
+  "left-main-tabs": useLeftMainTabs,
   "simple-content-pane": useSimpleContentPane
 };
 const useShellLayout = ({

package/esm/shell-layout-templates/useShellLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"useShellLayout.js","sources":["../../src/shell-layout-templates/useShellLayout.ts"],"sourcesContent":["import { HTMLAttributes, ReactElement, ReactNode } from \"react\";\nimport { useFullHeightLeftPanel } from \"./full-height-left-panel/useFullHeightLeftPanel\";\nimport { useInlayLeftPanel } from \"./inlay-left-panel/useInlayLeftPanel\";\nimport { useSimpleContentPane } from \"./simple-content-pane/useSimpleContentPane\";\nimport { SidePanelProps } from \"./side-panel\";\n\nconst LayoutHook = {\n  \"full-height\": useFullHeightLeftPanel,\n  inlay: useInlayLeftPanel,\n  \"simple-content-pane\": useSimpleContentPane,\n};\n\nexport type LayoutTemplateId = keyof typeof LayoutHook;\n\nexport type ShellLayoutTemplateProps = Omit<\n  ShellLayoutProps,\n  \"layoutTemplateId\"\n>;\n\nexport type ShellLayoutTemplateHook = (\n  props: ShellLayoutTemplateProps\n) => ReactElement;\n\n/**\n * The Shell Layout is the outermost 'chrome' of the appliciation,\n * enclosing the main content area. It will be rendered by one of\n * two available templates, determined by the layoutTemplateId,\n */\nexport interface ShellLayoutProps {\n  /**\n   * App Header will be rendered in position determined by layout-template\n   */\n  appHeader?: ReactNode;\n\n  /**\n   * HTML attributes that will be applied to root div.\n   */\n  htmlAttributes?: HTMLAttributes<HTMLDivElement>;\n  /**\n   * identifier for shell layout template to be used. Default template\n   * will be \"inlay\"\n   */\n  layoutTemplateId?: LayoutTemplateId;\n  /**\n   * If template renders SidePanel, these props will be provided\n   */\n  LeftSidePanelProps?: SidePanelProps;\n}\n\n/**\n * This hook acts as a stub for the actual shell layout\n * template hooks. It will delegate to the appropriate shell\n * layout hook, based on the value of layoutTemplateId.\n */\nexport const useShellLayout = ({\n  layoutTemplateId = \"simple-content-pane\",\n  ...props\n}: ShellLayoutProps) => {\n  const useLayoutHook = LayoutHook[layoutTemplateId];\n  return useLayoutHook(props);\n};\n"],"names":[],"mappings":";;;;AAMA,MAAM,UAAa,GAAA;AAAA,EACjB,aAAe,EAAA,sBAAA;AAAA,EACf,KAAO,EAAA,iBAAA;AAAA,EACP,qBAAuB,EAAA,oBAAA;AACzB,CAAA,CAAA;AA4CO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,gBAAmB,GAAA,qBAAA;AAAA,EACnB,GAAG,KAAA;AACL,CAAwB,KAAA;AACtB,EAAM,MAAA,aAAA,GAAgB,WAAW,gBAAgB,CAAA,CAAA;AACjD,EAAA,OAAO,cAAc,KAAK,CAAA,CAAA;AAC5B;;;;"}
+{"version":3,"file":"useShellLayout.js","sources":["../../src/shell-layout-templates/useShellLayout.ts"],"sourcesContent":["import { HTMLAttributes, ReactElement, ReactNode } from \"react\";\nimport { useFullHeightLeftPanel } from \"./full-height-left-panel/useFullHeightLeftPanel\";\nimport { useInlayLeftPanel } from \"./inlay-left-panel/useInlayLeftPanel\";\nimport { useLeftMainTabs } from \"./left-main-tabs/useLeftMainTabs\";\nimport { useSimpleContentPane } from \"./simple-content-pane/useSimpleContentPane\";\nimport { SidePanelProps as ShellSidePanelProps } from \"./side-panel\";\n\nconst LayoutHook = {\n  \"full-height\": useFullHeightLeftPanel,\n  inlay: useInlayLeftPanel,\n  \"left-main-tabs\": useLeftMainTabs,\n  \"simple-content-pane\": useSimpleContentPane,\n};\n\nexport type LayoutTemplateId = keyof typeof LayoutHook;\n\nexport type ShellLayoutTemplateProps = Omit<\n  ShellLayoutProps,\n  \"layoutTemplateId\"\n>;\n\nexport type ShellToolbarProps = {\n  children: ReactNode;\n  position?: \"left\";\n  width?: number;\n};\n\nexport type ShellLayoutTemplateHook = (\n  props: ShellLayoutTemplateProps,\n) => ReactElement;\n\n/**\n * The Shell Layout is the outermost 'chrome' of the appliciation,\n * enclosing the main content area. It will be rendered by one of\n * two available templates, determined by the layoutTemplateId,\n */\nexport interface ShellLayoutProps {\n  /**\n   * App Header will be rendered in position determined by layout-template\n   */\n  appHeader?: ReactNode;\n\n  /**\n   * HTML attributes that will be applied to root div.\n   */\n  htmlAttributes?: HTMLAttributes<HTMLDivElement>;\n  /**\n   * identifier for shell layout template to be used. Default template\n   * will be \"inlay\"\n   */\n  layoutTemplateId?: LayoutTemplateId;\n  /**\n   * If template renders SidePanel, these props will be provided\n   */\n  SidePanelProps?: ShellSidePanelProps;\n  /**\n   * If template renders Toolbar, these props will be provided\n   */\n  ToolbarProps?: ShellToolbarProps;\n}\n\n/**\n * This hook acts as a stub for the actual shell layout\n * template hooks. It will delegate to the appropriate shell\n * layout hook, based on the value of layoutTemplateId.\n */\nexport const useShellLayout = ({\n  layoutTemplateId = \"simple-content-pane\",\n  ...props\n}: ShellLayoutProps) => {\n  const useLayoutHook = LayoutHook[layoutTemplateId];\n  return useLayoutHook(props);\n};\n"],"names":[],"mappings":";;;;;AAOA,MAAM,UAAa,GAAA;AAAA,EACjB,aAAe,EAAA,sBAAA;AAAA,EACf,KAAO,EAAA,iBAAA;AAAA,EACP,gBAAkB,EAAA,eAAA;AAAA,EAClB,qBAAuB,EAAA,oBAAA;AACzB,CAAA,CAAA;AAsDO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,gBAAmB,GAAA,qBAAA;AAAA,EACnB,GAAG,KAAA;AACL,CAAwB,KAAA;AACtB,EAAM,MAAA,aAAA,GAAgB,WAAW,gBAAgB,CAAA,CAAA;AACjD,EAAA,OAAO,cAAc,KAAK,CAAA,CAAA;AAC5B;;;;"}

package/esm/shell.css.js

@@ -1,4 +1,4 @@
-var shellCss = ".vuuShell {\n  background-color: var(--vuu-color-gray-25);\n  height: var(--vuuShell-height, 100vh);\n  width: var(--vuuShell-width, 100vw);\n}\n\n.vuu-workspace-tabs {\n  background: var(--salt-container-primary-background);\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\n/* until we reinstat5e the toolbar */\n.vuuToolbarProxy {\n  background: var(--salt-container-primary-background);\n}\n\n.vuu-workspace-tabs > .vuuTabstrip > .vuuOverflowContainer-wrapContainer {\n  background: var(--vuu-color-gray-25);\n}\n\n.vuu-workspace-tabs {\n  --vuuTab-height: 28px;\n  border: solid 1px #d6d7da;\n  border-top: none !important;\n  border-radius: 6px;\n  height: 100%;\n  padding: 36px 8px 8px 8px;\n  position: relative;\n  width: 100%;\n}\n\n.vuu-workspace-tabs > .vuuTabstrip {\n  left: -1px;\n  padding-bottom: 7px;\n  position: absolute !important;\n  right: 1px;\n  top: 0;\n  width: calc(100% + 2px) !important;\n}\n\n.vuuShell-content {\n  padding: var(--vuuShell-content-padding, 8px);\n}\n";
+var shellCss = ".vuuShell {\n  background-color: var(--vuu-color-gray-25);\n  height: var(--vuuShell-height, 100vh);\n  width: var(--vuuShell-width, 100vw);\n\n  .left-main-tabs {\n    --vuuOverflowContainer-width: 48px;\n  }\n}\n\n.vuu-workspace-tabs {\n  background: var(--salt-container-primary-background);\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\n/* until we reinstat5e the toolbar */\n.vuuToolbarProxy {\n  background: var(--salt-container-primary-background);\n}\n\n.vuu-workspace-tabs > .vuuTabstrip > .vuuOverflowContainer-wrapContainer {\n  background: var(--vuu-color-gray-25);\n}\n\n.vuu-workspace-tabs {\n  --vuuTab-height: 28px;\n  border: solid 1px #d6d7da;\n  border-top: none !important;\n  border-radius: 6px;\n  height: 100%;\n  padding: 36px 8px 8px 8px;\n  position: relative;\n  width: 100%;\n}\n\n.vuu-workspace-tabs > .vuuTabstrip {\n  left: -1px;\n  padding-bottom: 7px;\n  position: absolute !important;\n  right: 1px;\n  top: 0;\n  width: calc(100% + 2px) !important;\n}\n\n.vuuShell-content {\n  padding: var(--vuuShell-content-padding, 8px);\n}\n";
 
 export { shellCss as default };
 //# sourceMappingURL=shell.css.js.map

package/esm/shell.js.map

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

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

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

package/esm/user-settings/SettingsForm.js.map

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

package/esm/workspace-management/LayoutList.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutList.js","sources":["../../src/workspace-management/LayoutList.tsx"],"sourcesContent":["import { IconButton, List, ListItem } from \"@vuu-ui/vuu-ui-controls\";\nimport { LayoutMetadata } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, useCallback, useMemo } from \"react\";\nimport { LayoutTile } from \"./LayoutTile\";\nimport { useWorkspace } from \"./WorkspaceProvider\";\n\nimport layoutListCss from \"./LayoutList.css\";\n\ntype LayoutGroups = {\n  [groupName: string]: LayoutMetadata[];\n};\n\nconst classBase = \"vuuLayoutList\";\n\nexport const LayoutList = ({\n  className,\n  title,\n  ...htmlAttributes\n}: HTMLAttributes<HTMLDivElement>) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-layout-list\",\n    css: layoutListCss,\n    window: targetWindow,\n  });\n\n  const { layoutMetadata, loadLayoutById } = useWorkspace();\n\n  const handleLoadLayout = useCallback(\n    (layoutId?: string) => {\n      if (layoutId) {\n        loadLayoutById(layoutId);\n      }\n    },\n    [loadLayoutById]\n  );\n\n  const layoutsByGroup = layoutMetadata.reduce((acc: LayoutGroups, cur) => {\n    if (acc[cur.group]) {\n      return {\n        ...acc,\n        [cur.group]: [...acc[cur.group], cur],\n      };\n    }\n    return {\n      ...acc,\n      [cur.group]: [cur],\n    };\n  }, {});\n\n  const content = useMemo<JSX.Element[]>(() => {\n    return Object.entries(layoutsByGroup).map(\n      ([heading, layoutMetadata], index) => (\n        <div className={`${classBase}-group`} key={index}>\n          <div className={`${classBase}-groupHeader`}>{heading}</div>\n          <List<LayoutMetadata, \"none\">\n            height={undefined}\n            itemHeight={68}\n            selectionStrategy=\"none\"\n            source={layoutMetadata}\n            ListItem={({ item, ...props }) => (\n              <ListItem {...props}>\n                <LayoutTile\n                  {...htmlAttributes}\n                  key={item?.id}\n                  metadata={item as LayoutMetadata}\n                  onLoadLayout={handleLoadLayout}\n                />\n                <IconButton\n                  className={`${classBase}-menu`}\n                  data-embedded\n                  icon=\"more-vert\"\n                  variant=\"secondary\"\n                />\n              </ListItem>\n            )}\n          />\n        </div>\n      )\n    );\n  }, [handleLoadLayout, htmlAttributes, layoutsByGroup]);\n\n  return (\n    <div {...htmlAttributes} className={cx(classBase, \"vuuScrollable\")}>\n      <div className={`${classBase}-header`}>{title}</div>\n      <div className={`${classBase}-content`}>{content}</div>\n    </div>\n  );\n};\n"],"names":["layoutMetadata"],"mappings":"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"}
+{"version":3,"file":"LayoutList.js","sources":["../../src/workspace-management/LayoutList.tsx"],"sourcesContent":["import { IconButton, List, ListItem } from \"@vuu-ui/vuu-ui-controls\";\nimport { LayoutMetadata } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, useCallback, useMemo } from \"react\";\nimport { LayoutTile } from \"./LayoutTile\";\nimport { useWorkspace } from \"./WorkspaceProvider\";\n\nimport layoutListCss from \"./LayoutList.css\";\n\ntype LayoutGroups = {\n  [groupName: string]: LayoutMetadata[];\n};\n\nconst classBase = \"vuuLayoutList\";\n\nexport const LayoutList = ({\n  className,\n  title,\n  ...htmlAttributes\n}: HTMLAttributes<HTMLDivElement>) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-layout-list\",\n    css: layoutListCss,\n    window: targetWindow,\n  });\n\n  const { layoutMetadata, loadLayoutById } = useWorkspace();\n\n  const handleLoadLayout = useCallback(\n    (layoutId?: string) => {\n      if (layoutId) {\n        loadLayoutById(layoutId);\n      }\n    },\n    [loadLayoutById],\n  );\n\n  const layoutsByGroup = layoutMetadata.reduce((acc: LayoutGroups, cur) => {\n    if (acc[cur.group]) {\n      return {\n        ...acc,\n        [cur.group]: [...acc[cur.group], cur],\n      };\n    }\n    return {\n      ...acc,\n      [cur.group]: [cur],\n    };\n  }, {});\n\n  const content = useMemo<JSX.Element[]>(() => {\n    return Object.entries(layoutsByGroup).map(\n      ([heading, layoutMetadata], index) => (\n        <div className={`${classBase}-group`} key={index}>\n          <div className={`${classBase}-groupHeader`}>{heading}</div>\n          <List<LayoutMetadata, \"none\">\n            height={undefined}\n            itemHeight={68}\n            selectionStrategy=\"none\"\n            source={layoutMetadata}\n            ListItem={({ item, ...props }) => (\n              <ListItem {...props}>\n                <LayoutTile\n                  {...htmlAttributes}\n                  key={item?.id}\n                  metadata={item as LayoutMetadata}\n                  onLoadLayout={handleLoadLayout}\n                />\n                <IconButton\n                  className={`${classBase}-menu`}\n                  data-embedded\n                  icon=\"more-vert\"\n                  variant=\"secondary\"\n                />\n              </ListItem>\n            )}\n          />\n        </div>\n      ),\n    );\n  }, [handleLoadLayout, htmlAttributes, layoutsByGroup]);\n\n  return (\n    <div {...htmlAttributes} className={cx(classBase, \"vuuScrollable\")}>\n      <div className={`${classBase}-header`}>{title}</div>\n      <div className={`${classBase}-content`}>{content}</div>\n    </div>\n  );\n};\n"],"names":["layoutMetadata"],"mappings":"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"}

package/esm/workspace-management/SaveLayoutPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"SaveLayoutPanel.js","sources":["../../src/workspace-management/SaveLayoutPanel.tsx"],"sourcesContent":["import { LayoutMetadataDto } from \"@vuu-ui/vuu-utils\";\nimport {\n  Button,\n  ComboBox,\n  FormField,\n  FormFieldLabel,\n  Input,\n  Option,\n  Text,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  ChangeEvent,\n  SyntheticEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { getAuthDetailsFromCookies } from \"../login\";\nimport { takeScreenshot } from \"./screenshot-utils\";\n\nimport saveLayoutPanelCss from \"./SaveLayoutPanel.css\";\n\nconst classBase = \"vuuSaveLayoutPanel\";\n\nconst groups = [\"Group 1\", \"Group 2\", \"Group 3\", \"Group 4\", \"Group 5\"];\n\ntype SaveLayoutPanelProps = {\n  componentId?: string;\n  defaultTitle?: string;\n  onCancel: () => void;\n  onSave: (layoutMetadata: LayoutMetadataDto) => void;\n};\n\nexport const SaveLayoutPanel = (props: SaveLayoutPanelProps) => {\n  const { defaultTitle = \"\", onCancel, onSave, componentId } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-save-layout-panel\",\n    css: saveLayoutPanelCss,\n    window: targetWindow,\n  });\n\n  const [layoutName, setLayoutName] = useState<string>(defaultTitle);\n  const [group, setGroup] = useState<string>(\"\");\n  const [screenshot, setScreenshot] = useState<string | undefined>();\n  const [screenshotErrorMessage, setScreenshotErrorMessage] = useState<\n    string | undefined\n  >();\n  const [username] = getAuthDetailsFromCookies();\n\n  useEffect(() => {\n    if (componentId) {\n      takeScreenshot(document.getElementById(componentId) as HTMLElement)\n        .then((screenshot) => {\n          setScreenshot(screenshot);\n        })\n        .catch((error: Error) => {\n          setScreenshotErrorMessage(error.message);\n        });\n    }\n  }, [componentId]);\n\n  const handleSubmit = () => {\n    onSave({\n      name: layoutName,\n      group,\n      screenshot: screenshot ?? \"\",\n      user: username,\n    });\n  };\n\n  const screenshotContent = useMemo(() => {\n    if (screenshot) {\n      return (\n        <img\n          className={`${classBase}-screenshot`}\n          src={screenshot}\n          alt=\"screenshot of current layout\"\n        />\n      );\n    }\n    if (screenshotErrorMessage) {\n      return <Text>{screenshotErrorMessage}</Text>;\n    }\n    return <div className=\"spinner\" />;\n  }, [screenshot, screenshotErrorMessage]);\n\n  const handleSelectionChange = useCallback(\n    (e: SyntheticEvent | KeyboardEvent, [selectedValue]: string[]) => {\n      if (\n        (e as KeyboardEvent).key === \"Tab\" &&\n        !selectedValue.toLowerCase().startsWith(group.toLowerCase())\n      ) {\n        // ignore. The ComboBox forces selection of a value from the list on Tab\n      } else {\n        setGroup(selectedValue || \"\");\n      }\n    },\n    [group]\n  );\n\n  const handleChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n    setGroup(e.target.value);\n  }, []);\n\n  return (\n    <div className={`${classBase}`}>\n      <div className={`${classBase}-panelContent`}>\n        <FormField>\n          <FormFieldLabel>Group</FormFieldLabel>\n          <ComboBox\n            data-embedded\n            inputProps={{\n              autoComplete: \"off\",\n              className: `${classBase}-inputText`,\n              placeholder: \"Select Group or Enter New Name\",\n              // onChange: (event: ChangeEvent<HTMLInputElement>) =>\n              //   setGroup(event.target.value),\n            }}\n            onChange={handleChange}\n            onSelectionChange={handleSelectionChange}\n            value={group}\n          >\n            {groups.map((group, i) => (\n              <Option key={i} value={group} />\n            ))}\n          </ComboBox>\n        </FormField>\n        <FormField>\n          <FormFieldLabel>Layout Name</FormFieldLabel>\n          <Input\n            data-embedded\n            inputProps={{\n              className: `${classBase}-inputText`,\n              placeholder: \"Enter Layout Name\",\n            }}\n            onChange={(event: ChangeEvent<HTMLInputElement>) =>\n              setLayoutName(event.target.value)\n            }\n            value={layoutName}\n          />\n        </FormField>\n        <div className={`${classBase}-screenshotContainer`}>\n          {screenshotContent}\n        </div>\n      </div>\n      <div className={`${classBase}-buttonsContainer`}>\n        <Button className={`${classBase}-cancelButton`} onClick={onCancel}>\n          Cancel\n        </Button>\n        <Button\n          className={`${classBase}-saveButton`}\n          onClick={handleSubmit}\n          disabled={layoutName === \"\" || group === \"\"}\n          variant=\"cta\"\n        >\n          Save\n        </Button>\n      </div>\n    </div>\n  );\n};\n"],"names":["screenshot","group"],"mappings":"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"}
+{"version":3,"file":"SaveLayoutPanel.js","sources":["../../src/workspace-management/SaveLayoutPanel.tsx"],"sourcesContent":["import { LayoutMetadataDto } from \"@vuu-ui/vuu-utils\";\nimport {\n  Button,\n  ComboBox,\n  FormField,\n  FormFieldLabel,\n  Input,\n  Option,\n  Text,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  ChangeEvent,\n  SyntheticEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { getAuthDetailsFromCookies } from \"../login\";\nimport { takeScreenshot } from \"./screenshot-utils\";\n\nimport saveLayoutPanelCss from \"./SaveLayoutPanel.css\";\n\nconst classBase = \"vuuSaveLayoutPanel\";\n\nconst groups = [\"Group 1\", \"Group 2\", \"Group 3\", \"Group 4\", \"Group 5\"];\n\ntype SaveLayoutPanelProps = {\n  componentId?: string;\n  defaultTitle?: string;\n  onCancel: () => void;\n  onSave: (layoutMetadata: LayoutMetadataDto) => void;\n};\n\nexport const SaveLayoutPanel = (props: SaveLayoutPanelProps) => {\n  const { defaultTitle = \"\", onCancel, onSave, componentId } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-save-layout-panel\",\n    css: saveLayoutPanelCss,\n    window: targetWindow,\n  });\n\n  const [layoutName, setLayoutName] = useState<string>(defaultTitle);\n  const [group, setGroup] = useState<string>(\"\");\n  const [screenshot, setScreenshot] = useState<string | undefined>();\n  const [screenshotErrorMessage, setScreenshotErrorMessage] = useState<\n    string | undefined\n  >();\n  const [username] = getAuthDetailsFromCookies();\n\n  useEffect(() => {\n    if (componentId) {\n      takeScreenshot(document.getElementById(componentId) as HTMLElement)\n        .then((screenshot) => {\n          setScreenshot(screenshot);\n        })\n        .catch((error: Error) => {\n          setScreenshotErrorMessage(error.message);\n        });\n    }\n  }, [componentId]);\n\n  const handleSubmit = () => {\n    onSave({\n      name: layoutName,\n      group,\n      screenshot: screenshot ?? \"\",\n      user: username,\n    });\n  };\n\n  const screenshotContent = useMemo(() => {\n    if (screenshot) {\n      return (\n        <img\n          className={`${classBase}-screenshot`}\n          src={screenshot}\n          alt=\"screenshot of current layout\"\n        />\n      );\n    }\n    if (screenshotErrorMessage) {\n      return <Text>{screenshotErrorMessage}</Text>;\n    }\n    return <div className=\"spinner\" />;\n  }, [screenshot, screenshotErrorMessage]);\n\n  const handleSelectionChange = useCallback(\n    (e: SyntheticEvent | KeyboardEvent, [selectedValue]: string[]) => {\n      if (\n        (e as KeyboardEvent).key === \"Tab\" &&\n        !selectedValue.toLowerCase().startsWith(group.toLowerCase())\n      ) {\n        // ignore. The ComboBox forces selection of a value from the list on Tab\n      } else {\n        setGroup(selectedValue || \"\");\n      }\n    },\n    [group],\n  );\n\n  const handleChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n    setGroup(e.target.value);\n  }, []);\n\n  return (\n    <div className={`${classBase}`}>\n      <div className={`${classBase}-panelContent`}>\n        <FormField>\n          <FormFieldLabel>Group</FormFieldLabel>\n          <ComboBox\n            data-embedded\n            inputProps={{\n              autoComplete: \"off\",\n              className: `${classBase}-inputText`,\n              placeholder: \"Select Group or Enter New Name\",\n              // onChange: (event: ChangeEvent<HTMLInputElement>) =>\n              //   setGroup(event.target.value),\n            }}\n            onChange={handleChange}\n            onSelectionChange={handleSelectionChange}\n            value={group}\n          >\n            {groups.map((group, i) => (\n              <Option key={i} value={group} />\n            ))}\n          </ComboBox>\n        </FormField>\n        <FormField>\n          <FormFieldLabel>Layout Name</FormFieldLabel>\n          <Input\n            data-embedded\n            inputProps={{\n              className: `${classBase}-inputText`,\n              placeholder: \"Enter Layout Name\",\n            }}\n            onChange={(event: ChangeEvent<HTMLInputElement>) =>\n              setLayoutName(event.target.value)\n            }\n            value={layoutName}\n          />\n        </FormField>\n        <div className={`${classBase}-screenshotContainer`}>\n          {screenshotContent}\n        </div>\n      </div>\n      <div className={`${classBase}-buttonsContainer`}>\n        <Button className={`${classBase}-cancelButton`} onClick={onCancel}>\n          Cancel\n        </Button>\n        <Button\n          className={`${classBase}-saveButton`}\n          onClick={handleSubmit}\n          disabled={layoutName === \"\" || group === \"\"}\n          variant=\"cta\"\n        >\n          Save\n        </Button>\n      </div>\n    </div>\n  );\n};\n"],"names":["screenshot","group"],"mappings":";;;;;;;;;;;AAyBA,MAAM,SAAY,GAAA,oBAAA,CAAA;AAElB,MAAM,SAAS,CAAC,SAAA,EAAW,SAAW,EAAA,SAAA,EAAW,WAAW,SAAS,CAAA,CAAA;AASxD,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAA,MAAM,EAAE,YAAe,GAAA,EAAA,EAAI,QAAU,EAAA,MAAA,EAAQ,aAAgB,GAAA,KAAA,CAAA;AAE7D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAA,kBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAiB,YAAY,CAAA,CAAA;AACjE,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAiB,EAAE,CAAA,CAAA;AAC7C,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,QAA6B,EAAA,CAAA;AACjE,EAAA,MAAM,CAAC,sBAAA,EAAwB,yBAAyB,CAAA,GAAI,QAE1D,EAAA,CAAA;AACF,EAAM,MAAA,CAAC,QAAQ,CAAA,GAAI,yBAA0B,EAAA,CAAA;AAE7C,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,WAAa,EAAA;AACf,MAAA,cAAA,CAAe,SAAS,cAAe,CAAA,WAAW,CAAgB,CAC/D,CAAA,IAAA,CAAK,CAACA,WAAe,KAAA;AACpB,QAAA,aAAA,CAAcA,WAAU,CAAA,CAAA;AAAA,OACzB,CAAA,CACA,KAAM,CAAA,CAAC,KAAiB,KAAA;AACvB,QAAA,yBAAA,CAA0B,MAAM,OAAO,CAAA,CAAA;AAAA,OACxC,CAAA,CAAA;AAAA,KACL;AAAA,GACF,EAAG,CAAC,WAAW,CAAC,CAAA,CAAA;AAEhB,EAAA,MAAM,eAAe,MAAM;AACzB,IAAO,MAAA,CAAA;AAAA,MACL,IAAM,EAAA,UAAA;AAAA,MACN,KAAA;AAAA,MACA,YAAY,UAAc,IAAA,EAAA;AAAA,MAC1B,IAAM,EAAA,QAAA;AAAA,KACP,CAAA,CAAA;AAAA,GACH,CAAA;AAEA,EAAM,MAAA,iBAAA,GAAoB,QAAQ,MAAM;AACtC,IAAA,IAAI,UAAY,EAAA;AACd,MACE,uBAAA,GAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,GAAG,SAAS,CAAA,WAAA,CAAA;AAAA,UACvB,GAAK,EAAA,UAAA;AAAA,UACL,GAAI,EAAA,8BAAA;AAAA,SAAA;AAAA,OACN,CAAA;AAAA,KAEJ;AACA,IAAA,IAAI,sBAAwB,EAAA;AAC1B,MAAO,uBAAA,GAAA,CAAC,QAAM,QAAuB,EAAA,sBAAA,EAAA,CAAA,CAAA;AAAA,KACvC;AACA,IAAO,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,SAAU,EAAA,CAAA,CAAA;AAAA,GAC/B,EAAA,CAAC,UAAY,EAAA,sBAAsB,CAAC,CAAA,CAAA;AAEvC,EAAA,MAAM,qBAAwB,GAAA,WAAA;AAAA,IAC5B,CAAC,CAAA,EAAmC,CAAC,aAAa,CAAgB,KAAA;AAChE,MACG,IAAA,CAAA,CAAoB,GAAQ,KAAA,KAAA,IAC7B,CAAC,aAAA,CAAc,WAAY,EAAA,CAAE,UAAW,CAAA,KAAA,CAAM,WAAY,EAAC,CAC3D,EAAA,CAEK,MAAA;AACL,QAAA,QAAA,CAAS,iBAAiB,EAAE,CAAA,CAAA;AAAA,OAC9B;AAAA,KACF;AAAA,IACA,CAAC,KAAK,CAAA;AAAA,GACR,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,WAAY,CAAA,CAAC,CAAqC,KAAA;AACrE,IAAS,QAAA,CAAA,CAAA,CAAE,OAAO,KAAK,CAAA,CAAA;AAAA,GACzB,EAAG,EAAE,CAAA,CAAA;AAEL,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAC1B,CAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,CAC1B,aAAA,CAAA,EAAA,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,SACC,EAAA,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,kBAAe,QAAK,EAAA,OAAA,EAAA,CAAA;AAAA,wBACrB,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,eAAa,EAAA,IAAA;AAAA,YACb,UAAY,EAAA;AAAA,cACV,YAAc,EAAA,KAAA;AAAA,cACd,SAAA,EAAW,GAAG,SAAS,CAAA,UAAA,CAAA;AAAA,cACvB,WAAa,EAAA,gCAAA;AAAA;AAAA;AAAA,aAGf;AAAA,YACA,QAAU,EAAA,YAAA;AAAA,YACV,iBAAmB,EAAA,qBAAA;AAAA,YACnB,KAAO,EAAA,KAAA;AAAA,YAEN,QAAA,EAAA,MAAA,CAAO,GAAI,CAAA,CAACC,MAAO,EAAA,CAAA,yBACjB,MAAe,EAAA,EAAA,KAAA,EAAOA,MAAV,EAAA,EAAA,CAAiB,CAC/B,CAAA;AAAA,WAAA;AAAA,SACH;AAAA,OACF,EAAA,CAAA;AAAA,2BACC,SACC,EAAA,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,kBAAe,QAAW,EAAA,aAAA,EAAA,CAAA;AAAA,wBAC3B,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,eAAa,EAAA,IAAA;AAAA,YACb,UAAY,EAAA;AAAA,cACV,SAAA,EAAW,GAAG,SAAS,CAAA,UAAA,CAAA;AAAA,cACvB,WAAa,EAAA,mBAAA;AAAA,aACf;AAAA,YACA,UAAU,CAAC,KAAA,KACT,aAAc,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA;AAAA,YAElC,KAAO,EAAA,UAAA;AAAA,WAAA;AAAA,SACT;AAAA,OACF,EAAA,CAAA;AAAA,0BACC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,wBACzB,QACH,EAAA,iBAAA,EAAA,CAAA;AAAA,KACF,EAAA,CAAA;AAAA,oBACC,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAC1B,iBAAA,CAAA,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,UAAO,SAAW,EAAA,CAAA,EAAG,SAAS,CAAiB,aAAA,CAAA,EAAA,OAAA,EAAS,UAAU,QAEnE,EAAA,QAAA,EAAA,CAAA;AAAA,sBACA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,GAAG,SAAS,CAAA,WAAA,CAAA;AAAA,UACvB,OAAS,EAAA,YAAA;AAAA,UACT,QAAA,EAAU,UAAe,KAAA,EAAA,IAAM,KAAU,KAAA,EAAA;AAAA,UACzC,OAAQ,EAAA,KAAA;AAAA,UACT,QAAA,EAAA,MAAA;AAAA,SAAA;AAAA,OAED;AAAA,KACF,EAAA,CAAA;AAAA,GACF,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/esm/workspace-management/WorkspaceProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"WorkspaceProvider.js","sources":["../../src/workspace-management/WorkspaceProvider.tsx"],"sourcesContent":["import { isLayoutJSON, resolveJSONPath } from \"@vuu-ui/vuu-layout\";\nimport { useNotifications } from \"@vuu-ui/vuu-popups\";\nimport {\n  LayoutMetadata,\n  LayoutMetadataDto,\n  VuuShellLocation,\n  WorkspaceContext,\n  logger,\n  type ApplicationJSON,\n  type ApplicationSetting,\n  type ApplicationSettings,\n  type LayoutJSON,\n} from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useContext, useEffect, useRef, useState } from \"react\";\nimport { usePersistenceManager } from \"../persistence-manager\";\nimport {\n  getWorkspaceWithLayoutJSON,\n  loadingJSON,\n  type WorkspaceStackProps,\n} from \"./defaultWorkspaceJSON\";\n\nconst { info } = logger(\"useLayoutManager\");\n\nexport type WorkspaceProps = WorkspaceStackProps & {\n  layoutPlaceholderJSON?: LayoutJSON;\n  /**\n   * layoutJSON defines the default layout to render on first load and until such time as\n   * layout state has been persisted. After that, the persisted state will be rendered.\n   */\n  layoutJSON?: LayoutJSON | LayoutJSON[];\n  activeLayoutIndex?: number;\n  /**\n   * The Vuu workspace is the container into which layouts are loaded. By default, it will be\n   * a Tabbed Panel (Stack + Tabstrip), showing a tab per Layout.\n   */\n  workspaceJSON?: LayoutJSON;\n};\n\nexport interface WorkspaceProviderProps extends WorkspaceProps {\n  children: JSX.Element | JSX.Element[];\n\n  /**\n   * layoutPlaceholderJSON defines the layout to render when a new workspace layout is created.\n   */\n  layoutPlaceholderJSON?: LayoutJSON;\n}\n\nconst ensureLayoutHasTitle = (\n  layout: LayoutJSON,\n  layoutMetadata: LayoutMetadataDto\n) => {\n  if (layout.props?.title !== undefined) {\n    return layout;\n  } else {\n    return {\n      ...layout,\n      props: {\n        ...layout.props,\n        title: layoutMetadata.name,\n      },\n    };\n  }\n};\n\nconst loadingApplicationJSON: ApplicationJSON = {\n  workspaceJSON: loadingJSON,\n};\n\n/**\n * LayoutManagementProvider supplies an API for loading and saving layout documents.\n * Initial layout is automatically loaded on startup. Because this hook is responsible\n * only for loading and saving layouts, it only triggers a render when content is loaded.\n *\n * Initial layout displays a loading state\n * User may supply a default layout. This will not be displayed until call has been made to\n * persistenceManager to retrieve stored layout state. If no stored state is returned, the\n * default layout provided by user will be set as current state (and hence rendered). If no\n * default layout has been provided by user, the sysem default will be used (simple PlaceHolder)\n * If saved layout state has been returned, that will be set as current state (and rendered)\n *\n */\nexport const WorkspaceProvider = ({\n  TabstripProps,\n  children,\n  layoutJSON,\n  activeLayoutIndex,\n  layoutPlaceholderJSON,\n  showTabs,\n  workspaceJSON: customWorkspaceJSON,\n}: WorkspaceProviderProps) => {\n  const [layoutMetadata, setLayoutMetadata] = useState<LayoutMetadata[]>([]);\n  // TODO this default should probably be a loading state rather than the placeholder\n  // It will be replaced as soon as the localStorage/remote layout is resolved\n  const [, forceRefresh] = useState({});\n  const notify = useNotifications();\n  const persistenceManager = usePersistenceManager();\n  const applicationJSONRef = useRef<ApplicationJSON>(loadingApplicationJSON);\n\n  const setApplicationJSON = useCallback(\n    (applicationJSON: ApplicationJSON, rerender = true) => {\n      applicationJSONRef.current = applicationJSON;\n      if (rerender) {\n        forceRefresh({});\n      }\n    },\n    []\n  );\n\n  const setWorkspaceJSON = useCallback(\n    (workspaceJSON: LayoutJSON, rerender = true) => {\n      setApplicationJSON(\n        {\n          ...applicationJSONRef.current,\n          workspaceJSON,\n        },\n        rerender\n      );\n    },\n    [setApplicationJSON]\n  );\n\n  const setApplicationSettings = useCallback(\n    (settings: ApplicationSettings) => {\n      setApplicationJSON(\n        {\n          ...applicationJSONRef.current,\n          settings: {\n            ...applicationJSONRef.current.settings,\n            ...settings,\n          },\n        },\n        false\n      );\n    },\n    [setApplicationJSON]\n  );\n\n  useEffect(() => {\n    //TODO this does not need to be done ahead of time\n    persistenceManager\n      ?.loadMetadata()\n      .then((metadata) => {\n        setLayoutMetadata(metadata);\n      })\n      .catch((error: Error) => {\n        notify({\n          type: \"error\",\n          header: \"Failed to Load Layouts\",\n          body: \"Could not load list of available layouts\",\n        });\n        console.error(\"Error occurred while retrieving metadata\", error);\n      });\n\n    persistenceManager\n      ?.loadApplicationJSON()\n      .then((applicationJSON?: ApplicationJSON) => {\n        if (applicationJSON) {\n          info?.(\"applicationJSON loaded successfully\");\n          setApplicationJSON(applicationJSON);\n        } else {\n          // No applicationJSON has been saved yet. Construct our\n          // initial applicationJSON from user configuration and\n          // default values.\n          const workspaceJSON = getWorkspaceWithLayoutJSON(\n            customWorkspaceJSON,\n            layoutJSON,\n            activeLayoutIndex,\n            { TabstripProps, showTabs }\n          );\n          info?.(`applicationJSON not found, getting defaultWorkspaceJSON,\n            ${JSON.stringify(workspaceJSON, null, 2)}\n            `);\n          setApplicationJSON({\n            workspaceJSON,\n          });\n        }\n      })\n      .catch((error: Error) => {\n        notify({\n          type: \"error\",\n          header: \"Failed to Load Layout\",\n          body: \"Could not load your latest view\",\n        });\n        console.error(\n          \"Error occurred while retrieving application layout\",\n          error\n        );\n      });\n  }, [\n    TabstripProps,\n    activeLayoutIndex,\n    customWorkspaceJSON,\n    layoutJSON,\n    notify,\n    persistenceManager,\n    setApplicationJSON,\n    showTabs,\n  ]);\n\n  const saveApplicationLayout = useCallback(\n    (layout: LayoutJSON) => {\n      if (isLayoutJSON(layout)) {\n        setWorkspaceJSON(layout, false);\n        persistenceManager?.saveApplicationJSON(applicationJSONRef.current);\n      } else {\n        console.error(\"Tried to save invalid application layout\", layout);\n      }\n    },\n    [persistenceManager, setWorkspaceJSON]\n  );\n\n  const saveLayout = useCallback(\n    (metadata: LayoutMetadataDto) => {\n      let layoutToSave: LayoutJSON | undefined;\n      try {\n        layoutToSave = resolveJSONPath(\n          applicationJSONRef.current.workspaceJSON,\n          `#${VuuShellLocation.Workspace}.ACTIVE_CHILD`\n        );\n      } catch (e) {\n        // ignore, code below will handle\n      }\n\n      if (layoutToSave && isLayoutJSON(layoutToSave)) {\n        persistenceManager\n          ?.createLayout(metadata, ensureLayoutHasTitle(layoutToSave, metadata))\n          .then((metadata) => {\n            notify({\n              type: \"success\",\n              header: \"Layout Saved Successfully\",\n              body: `${metadata.name} saved successfully`,\n            });\n            setLayoutMetadata((prev) => [...prev, metadata]);\n          })\n          .catch((error: Error) => {\n            notify({\n              type: \"error\",\n              header: \"Failed to Save Layout\",\n              body: `Failed to save layout ${metadata.name}`,\n            });\n            console.error(\"Error occurred while saving layout\", error);\n          });\n      } else {\n        console.error(\"Tried to save invalid layout\", layoutToSave);\n        notify({\n          type: \"error\",\n          header: \"Failed to Save Layout\",\n          body: \"Cannot save invalid layout\",\n        });\n      }\n    },\n    [notify, persistenceManager]\n  );\n\n  const saveApplicationSettings = useCallback(\n    (\n      settings: ApplicationSettings | ApplicationSetting,\n      key?: keyof ApplicationSettings\n    ) => {\n      const { settings: applicationSettings } = applicationJSONRef.current;\n      if (key) {\n        setApplicationSettings({\n          ...applicationSettings,\n          [key]: settings,\n        });\n      } else {\n        setApplicationSettings(settings as ApplicationSettings);\n      }\n      persistenceManager?.saveApplicationJSON(applicationJSONRef.current);\n    },\n    [persistenceManager, setApplicationSettings]\n  );\n\n  const getApplicationSettings = useCallback(\n    (key?: keyof ApplicationSettings) => {\n      const { settings } = applicationJSONRef.current;\n      return key ? settings?.[key] : settings;\n    },\n    []\n  );\n\n  const loadLayoutById = useCallback(\n    (id: string) => {\n      persistenceManager\n        ?.loadLayout(id)\n        .then((layoutJson) => {\n          const { workspaceJSON: currentLayout } = applicationJSONRef.current;\n          setWorkspaceJSON({\n            ...currentLayout,\n            children: (currentLayout.children || []).concat(layoutJson),\n            props: {\n              ...currentLayout.props,\n              active: currentLayout.children?.length ?? 0,\n            },\n          });\n        })\n        .catch((error: Error) => {\n          notify({\n            type: \"error\",\n            header: \"Failed to Load Layout\",\n            body: \"Failed to load the requested layout\",\n          });\n          console.error(\"Error occurred while loading layout\", error);\n        });\n    },\n    [notify, persistenceManager, setWorkspaceJSON]\n  );\n\n  return (\n    <WorkspaceContext.Provider\n      value={{\n        getApplicationSettings,\n        layoutMetadata,\n        layoutPlaceholderJSON,\n        saveLayout,\n        workspaceJSON: applicationJSONRef.current.workspaceJSON,\n        saveApplicationLayout,\n        saveApplicationSettings,\n        loadLayoutById,\n      }}\n    >\n      {children}\n    </WorkspaceContext.Provider>\n  );\n};\n\nexport const useWorkspace = () => {\n  // The default Application JSON will be served if no LayoutManagementProvider\n  const { workspaceJSON = getWorkspaceWithLayoutJSON(), ...contextProps } =\n    useContext(WorkspaceContext);\n\n  return {\n    ...contextProps,\n    workspaceJSON,\n  };\n};\n"],"names":["metadata"],"mappings":"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"}
+{"version":3,"file":"WorkspaceProvider.js","sources":["../../src/workspace-management/WorkspaceProvider.tsx"],"sourcesContent":["import { isLayoutJSON, resolveJSONPath } from \"@vuu-ui/vuu-layout\";\nimport { useNotifications } from \"@vuu-ui/vuu-popups\";\nimport {\n  LayoutMetadata,\n  LayoutMetadataDto,\n  VuuShellLocation,\n  WorkspaceContext,\n  logger,\n  type ApplicationJSON,\n  type ApplicationSetting,\n  type ApplicationSettings,\n  type LayoutJSON,\n} from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useContext, useEffect, useRef, useState } from \"react\";\nimport { usePersistenceManager } from \"../persistence-manager\";\nimport {\n  getWorkspaceWithLayoutJSON,\n  loadingJSON,\n  type WorkspaceStackProps,\n} from \"./defaultWorkspaceJSON\";\n\nconst { info } = logger(\"useLayoutManager\");\n\nexport type WorkspaceProps = WorkspaceStackProps & {\n  layoutPlaceholderJSON?: LayoutJSON;\n  /**\n   * layoutJSON defines the default layout to render on first load and until such time as\n   * layout state has been persisted. After that, the persisted state will be rendered.\n   */\n  layoutJSON?: LayoutJSON | LayoutJSON[];\n  activeLayoutIndex?: number;\n  /**\n   * The Vuu workspace is the container into which layouts are loaded. By default, it will be\n   * a Tabbed Panel (Stack + Tabstrip), showing a tab per Layout.\n   */\n  workspaceJSON?: LayoutJSON;\n};\n\nexport interface WorkspaceProviderProps extends WorkspaceProps {\n  children: JSX.Element | JSX.Element[];\n\n  /**\n   * layoutPlaceholderJSON defines the layout to render when a new workspace layout is created.\n   */\n  layoutPlaceholderJSON?: LayoutJSON;\n}\n\nconst ensureLayoutHasTitle = (\n  layout: LayoutJSON,\n  layoutMetadata: LayoutMetadataDto,\n) => {\n  if (layout.props?.title !== undefined) {\n    return layout;\n  } else {\n    return {\n      ...layout,\n      props: {\n        ...layout.props,\n        title: layoutMetadata.name,\n      },\n    };\n  }\n};\n\nconst loadingApplicationJSON: ApplicationJSON = {\n  workspaceJSON: loadingJSON,\n};\n\n/**\n * LayoutManagementProvider supplies an API for loading and saving layout documents.\n * Initial layout is automatically loaded on startup. Because this hook is responsible\n * only for loading and saving layouts, it only triggers a render when content is loaded.\n *\n * Initial layout displays a loading state\n * User may supply a default layout. This will not be displayed until call has been made to\n * persistenceManager to retrieve stored layout state. If no stored state is returned, the\n * default layout provided by user will be set as current state (and hence rendered). If no\n * default layout has been provided by user, the sysem default will be used (simple PlaceHolder)\n * If saved layout state has been returned, that will be set as current state (and rendered)\n *\n */\nexport const WorkspaceProvider = ({\n  TabstripProps,\n  children,\n  layoutJSON,\n  activeLayoutIndex,\n  layoutPlaceholderJSON,\n  showTabs,\n  workspaceJSON: customWorkspaceJSON,\n}: WorkspaceProviderProps) => {\n  const [layoutMetadata, setLayoutMetadata] = useState<LayoutMetadata[]>([]);\n  // TODO this default should probably be a loading state rather than the placeholder\n  // It will be replaced as soon as the localStorage/remote layout is resolved\n  const [, forceRefresh] = useState({});\n  const notify = useNotifications();\n  const persistenceManager = usePersistenceManager();\n  const applicationJSONRef = useRef<ApplicationJSON>(loadingApplicationJSON);\n\n  const setApplicationJSON = useCallback(\n    (applicationJSON: ApplicationJSON, rerender = true) => {\n      applicationJSONRef.current = applicationJSON;\n      if (rerender) {\n        forceRefresh({});\n      }\n    },\n    [],\n  );\n\n  const setWorkspaceJSON = useCallback(\n    (workspaceJSON: LayoutJSON, rerender = true) => {\n      setApplicationJSON(\n        {\n          ...applicationJSONRef.current,\n          workspaceJSON,\n        },\n        rerender,\n      );\n    },\n    [setApplicationJSON],\n  );\n\n  const setApplicationSettings = useCallback(\n    (settings: ApplicationSettings) => {\n      setApplicationJSON(\n        {\n          ...applicationJSONRef.current,\n          settings: {\n            ...applicationJSONRef.current.settings,\n            ...settings,\n          },\n        },\n        false,\n      );\n    },\n    [setApplicationJSON],\n  );\n\n  useEffect(() => {\n    //TODO this does not need to be done ahead of time\n    persistenceManager\n      ?.loadMetadata()\n      .then((metadata) => {\n        setLayoutMetadata(metadata);\n      })\n      .catch((error: Error) => {\n        notify({\n          type: \"error\",\n          header: \"Failed to Load Layouts\",\n          body: \"Could not load list of available layouts\",\n        });\n        console.error(\"Error occurred while retrieving metadata\", error);\n      });\n\n    persistenceManager\n      ?.loadApplicationJSON()\n      .then((applicationJSON?: ApplicationJSON) => {\n        if (applicationJSON) {\n          info?.(\"applicationJSON loaded successfully\");\n          setApplicationJSON(applicationJSON);\n        } else {\n          // No applicationJSON has been saved yet. Construct our\n          // initial applicationJSON from user configuration and\n          // default values.\n          const workspaceJSON = getWorkspaceWithLayoutJSON(\n            customWorkspaceJSON,\n            layoutJSON,\n            activeLayoutIndex,\n            { TabstripProps, showTabs },\n          );\n          info?.(`applicationJSON not found, getting defaultWorkspaceJSON,\n            ${JSON.stringify(workspaceJSON, null, 2)}\n            `);\n          setApplicationJSON({\n            workspaceJSON,\n          });\n        }\n      })\n      .catch((error: Error) => {\n        notify({\n          type: \"error\",\n          header: \"Failed to Load Layout\",\n          body: \"Could not load your latest view\",\n        });\n        console.error(\n          \"Error occurred while retrieving application layout\",\n          error,\n        );\n      });\n  }, [\n    TabstripProps,\n    activeLayoutIndex,\n    customWorkspaceJSON,\n    layoutJSON,\n    notify,\n    persistenceManager,\n    setApplicationJSON,\n    showTabs,\n  ]);\n\n  const saveApplicationLayout = useCallback(\n    (layout: LayoutJSON) => {\n      if (isLayoutJSON(layout)) {\n        setWorkspaceJSON(layout, false);\n        persistenceManager?.saveApplicationJSON(applicationJSONRef.current);\n      } else {\n        console.error(\"Tried to save invalid application layout\", layout);\n      }\n    },\n    [persistenceManager, setWorkspaceJSON],\n  );\n\n  const saveLayout = useCallback(\n    (metadata: LayoutMetadataDto) => {\n      let layoutToSave: LayoutJSON | undefined;\n      try {\n        layoutToSave = resolveJSONPath(\n          applicationJSONRef.current.workspaceJSON,\n          `#${VuuShellLocation.Workspace}.ACTIVE_CHILD`,\n        );\n      } catch (e) {\n        // ignore, code below will handle\n      }\n\n      if (layoutToSave && isLayoutJSON(layoutToSave)) {\n        persistenceManager\n          ?.createLayout(metadata, ensureLayoutHasTitle(layoutToSave, metadata))\n          .then((metadata) => {\n            notify({\n              type: \"success\",\n              header: \"Layout Saved Successfully\",\n              body: `${metadata.name} saved successfully`,\n            });\n            setLayoutMetadata((prev) => [...prev, metadata]);\n          })\n          .catch((error: Error) => {\n            notify({\n              type: \"error\",\n              header: \"Failed to Save Layout\",\n              body: `Failed to save layout ${metadata.name}`,\n            });\n            console.error(\"Error occurred while saving layout\", error);\n          });\n      } else {\n        console.error(\"Tried to save invalid layout\", layoutToSave);\n        notify({\n          type: \"error\",\n          header: \"Failed to Save Layout\",\n          body: \"Cannot save invalid layout\",\n        });\n      }\n    },\n    [notify, persistenceManager],\n  );\n\n  const saveApplicationSettings = useCallback(\n    (\n      settings: ApplicationSettings | ApplicationSetting,\n      key?: keyof ApplicationSettings,\n    ) => {\n      const { settings: applicationSettings } = applicationJSONRef.current;\n      if (key) {\n        setApplicationSettings({\n          ...applicationSettings,\n          [key]: settings,\n        });\n      } else {\n        setApplicationSettings(settings as ApplicationSettings);\n      }\n      persistenceManager?.saveApplicationJSON(applicationJSONRef.current);\n    },\n    [persistenceManager, setApplicationSettings],\n  );\n\n  const getApplicationSettings = useCallback(\n    (key?: keyof ApplicationSettings) => {\n      const { settings } = applicationJSONRef.current;\n      return key ? settings?.[key] : settings;\n    },\n    [],\n  );\n\n  const loadLayoutById = useCallback(\n    (id: string) => {\n      persistenceManager\n        ?.loadLayout(id)\n        .then((layoutJson) => {\n          const { workspaceJSON: currentLayout } = applicationJSONRef.current;\n          setWorkspaceJSON({\n            ...currentLayout,\n            children: (currentLayout.children || []).concat(layoutJson),\n            props: {\n              ...currentLayout.props,\n              active: currentLayout.children?.length ?? 0,\n            },\n          });\n        })\n        .catch((error: Error) => {\n          notify({\n            type: \"error\",\n            header: \"Failed to Load Layout\",\n            body: \"Failed to load the requested layout\",\n          });\n          console.error(\"Error occurred while loading layout\", error);\n        });\n    },\n    [notify, persistenceManager, setWorkspaceJSON],\n  );\n\n  return (\n    <WorkspaceContext.Provider\n      value={{\n        getApplicationSettings,\n        layoutMetadata,\n        layoutPlaceholderJSON,\n        saveLayout,\n        workspaceJSON: applicationJSONRef.current.workspaceJSON,\n        saveApplicationLayout,\n        saveApplicationSettings,\n        loadLayoutById,\n      }}\n    >\n      {children}\n    </WorkspaceContext.Provider>\n  );\n};\n\nexport const useWorkspace = () => {\n  // The default Application JSON will be served if no LayoutManagementProvider\n  const { workspaceJSON = getWorkspaceWithLayoutJSON(), ...contextProps } =\n    useContext(WorkspaceContext);\n\n  return {\n    ...contextProps,\n    workspaceJSON,\n  };\n};\n"],"names":["metadata"],"mappings":"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"}

package/esm/workspace-management/defaultWorkspaceJSON.js.map

@@ -1 +1 @@
-{"version":3,"file":"defaultWorkspaceJSON.js","sources":["../../src/workspace-management/defaultWorkspaceJSON.ts"],"sourcesContent":["import { StackProps } from \"@vuu-ui/vuu-layout\";\nimport { LayoutJSON, VuuShellLocation } from \"@vuu-ui/vuu-utils\";\n\nexport type WorkspaceStackProps = Pick<\n  StackProps,\n  \"showTabs\" | \"TabstripProps\"\n>;\n\nexport const warningLayout: LayoutJSON = {\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 const loadingJSON: Readonly<LayoutJSON> = {\n  type: \"Component\",\n  id: \"loading-main\",\n  props: {},\n};\n\nexport const getStackWorkspaceJSON = (\n  activeLayoutIndex?: number\n): LayoutJSON<\n  StackProps & {\n    preserve: boolean;\n  }\n> => ({\n  type: \"Stack\",\n  id: VuuShellLocation.Workspace,\n  props: {\n    className: `${VuuShellLocation.Workspace}-tabs`,\n    TabstripProps: {\n      allowAddTab: true,\n      allowCloseTab: true,\n      allowRenameTab: true,\n      animateSelectionThumb: false,\n      \"aria-label\": \"Workspace Tabs\",\n      location: \"workspace-tab\",\n      variant: \"primary\",\n    },\n    preserve: true,\n    active: activeLayoutIndex ?? 0,\n  },\n});\n\nconst placeholderLayout: LayoutJSON = {\n  props: {\n    id: \"tab1\",\n    title: \"Tab 1\",\n    className: \"vuuShell-Placeholder\",\n  },\n  type: \"Placeholder\",\n};\n\nexport const getWorkspaceWithLayoutJSON = (\n  customWorkspaceJSON?: LayoutJSON,\n  layoutJSON: LayoutJSON | LayoutJSON[] = placeholderLayout,\n  activeLayoutIndex?: number,\n  stackProps?: WorkspaceStackProps\n): LayoutJSON => {\n  const stackWorkspace = getStackWorkspaceJSON(activeLayoutIndex);\n  if (customWorkspaceJSON) {\n    return {\n      ...customWorkspaceJSON,\n      children: Array.isArray(layoutJSON) ? layoutJSON : [layoutJSON],\n    };\n  } else {\n    return {\n      ...stackWorkspace,\n      props: {\n        ...stackWorkspace.props,\n        ...stackProps,\n        TabstripProps: {\n          ...stackWorkspace.props?.TabstripProps,\n          ...stackProps?.TabstripProps,\n        },\n      },\n      children: Array.isArray(layoutJSON) ? layoutJSON : [layoutJSON],\n    };\n  }\n};\n"],"names":[],"mappings":";;AAQO,MAAM,aAA4B,GAAA;AAAA,EACvC,IAAM,EAAA,MAAA;AAAA,EACN,KAAO,EAAA;AAAA,IACL,KAAA,EAAO,EAAE,MAAA,EAAQ,kBAAmB,EAAA;AAAA,GACtC;AAAA,EACA,QAAU,EAAA;AAAA,IACR;AAAA,MACE,KAAO,EAAA;AAAA,QACL,SAAW,EAAA,6BAAA;AAAA,OACb;AAAA,MACA,IAAM,EAAA,aAAA;AAAA,KACR;AAAA,GACF;AACF,EAAA;AAEO,MAAM,WAAoC,GAAA;AAAA,EAC/C,IAAM,EAAA,WAAA;AAAA,EACN,EAAI,EAAA,cAAA;AAAA,EACJ,OAAO,EAAC;AACV,EAAA;AAEa,MAAA,qBAAA,GAAwB,CACnC,iBAKI,MAAA;AAAA,EACJ,IAAM,EAAA,OAAA;AAAA,EACN,IAAI,gBAAiB,CAAA,SAAA;AAAA,EACrB,KAAO,EAAA;AAAA,IACL,SAAA,EAAW,CAAG,EAAA,gBAAA,CAAiB,SAAS,CAAA,KAAA,CAAA;AAAA,IACxC,aAAe,EAAA;AAAA,MACb,WAAa,EAAA,IAAA;AAAA,MACb,aAAe,EAAA,IAAA;AAAA,MACf,cAAgB,EAAA,IAAA;AAAA,MAChB,qBAAuB,EAAA,KAAA;AAAA,MACvB,YAAc,EAAA,gBAAA;AAAA,MACd,QAAU,EAAA,eAAA;AAAA,MACV,OAAS,EAAA,SAAA;AAAA,KACX;AAAA,IACA,QAAU,EAAA,IAAA;AAAA,IACV,QAAQ,iBAAqB,IAAA,CAAA;AAAA,GAC/B;AACF,CAAA,EAAA;AAEA,MAAM,iBAAgC,GAAA;AAAA,EACpC,KAAO,EAAA;AAAA,IACL,EAAI,EAAA,MAAA;AAAA,IACJ,KAAO,EAAA,OAAA;AAAA,IACP,SAAW,EAAA,sBAAA;AAAA,GACb;AAAA,EACA,IAAM,EAAA,aAAA;AACR,CAAA,CAAA;AAEO,MAAM,6BAA6B,CACxC,mBAAA,EACA,UAAwC,GAAA,iBAAA,EACxC,mBACA,UACe,KAAA;AACf,EAAM,MAAA,cAAA,GAAiB,sBAAsB,iBAAiB,CAAA,CAAA;AAC9D,EAAA,IAAI,mBAAqB,EAAA;AACvB,IAAO,OAAA;AAAA,MACL,GAAG,mBAAA;AAAA,MACH,UAAU,KAAM,CAAA,OAAA,CAAQ,UAAU,CAAI,GAAA,UAAA,GAAa,CAAC,UAAU,CAAA;AAAA,KAChE,CAAA;AAAA,GACK,MAAA;AACL,IAAO,OAAA;AAAA,MACL,GAAG,cAAA;AAAA,MACH,KAAO,EAAA;AAAA,QACL,GAAG,cAAe,CAAA,KAAA;AAAA,QAClB,GAAG,UAAA;AAAA,QACH,aAAe,EAAA;AAAA,UACb,GAAG,eAAe,KAAO,EAAA,aAAA;AAAA,UACzB,GAAG,UAAY,EAAA,aAAA;AAAA,SACjB;AAAA,OACF;AAAA,MACA,UAAU,KAAM,CAAA,OAAA,CAAQ,UAAU,CAAI,GAAA,UAAA,GAAa,CAAC,UAAU,CAAA;AAAA,KAChE,CAAA;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"defaultWorkspaceJSON.js","sources":["../../src/workspace-management/defaultWorkspaceJSON.ts"],"sourcesContent":["import { StackProps } from \"@vuu-ui/vuu-layout\";\nimport { LayoutJSON, VuuShellLocation } from \"@vuu-ui/vuu-utils\";\n\nexport type WorkspaceStackProps = Pick<\n  StackProps,\n  \"showTabs\" | \"TabstripProps\"\n>;\n\nexport const warningLayout: LayoutJSON = {\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 const loadingJSON: Readonly<LayoutJSON> = {\n  type: \"Component\",\n  id: \"loading-main\",\n  props: {},\n};\n\nexport const getStackWorkspaceJSON = (\n  activeLayoutIndex?: number,\n): LayoutJSON<\n  StackProps & {\n    preserve: boolean;\n  }\n> => ({\n  type: \"Stack\",\n  id: VuuShellLocation.Workspace,\n  props: {\n    className: `${VuuShellLocation.Workspace}-tabs`,\n    TabstripProps: {\n      allowAddTab: true,\n      allowCloseTab: true,\n      allowRenameTab: true,\n      animateSelectionThumb: false,\n      \"aria-label\": \"Workspace Tabs\",\n      location: \"workspace-tab\",\n      variant: \"primary\",\n    },\n    preserve: true,\n    active: activeLayoutIndex ?? 0,\n  },\n});\n\nconst placeholderLayout: LayoutJSON = {\n  props: {\n    id: \"tab1\",\n    title: \"Tab 1\",\n    className: \"vuuShell-Placeholder\",\n  },\n  type: \"Placeholder\",\n};\n\nexport const getWorkspaceWithLayoutJSON = (\n  customWorkspaceJSON?: LayoutJSON,\n  layoutJSON: LayoutJSON | LayoutJSON[] = placeholderLayout,\n  activeLayoutIndex?: number,\n  stackProps?: WorkspaceStackProps,\n): LayoutJSON => {\n  const stackWorkspace = getStackWorkspaceJSON(activeLayoutIndex);\n  if (customWorkspaceJSON) {\n    return {\n      ...customWorkspaceJSON,\n      children: Array.isArray(layoutJSON) ? layoutJSON : [layoutJSON],\n    };\n  } else {\n    return {\n      ...stackWorkspace,\n      props: {\n        ...stackWorkspace.props,\n        ...stackProps,\n        TabstripProps: {\n          ...stackWorkspace.props?.TabstripProps,\n          ...stackProps?.TabstripProps,\n        },\n      },\n      children: Array.isArray(layoutJSON) ? layoutJSON : [layoutJSON],\n    };\n  }\n};\n"],"names":[],"mappings":";;AAQO,MAAM,aAA4B,GAAA;AAAA,EACvC,IAAM,EAAA,MAAA;AAAA,EACN,KAAO,EAAA;AAAA,IACL,KAAA,EAAO,EAAE,MAAA,EAAQ,kBAAmB,EAAA;AAAA,GACtC;AAAA,EACA,QAAU,EAAA;AAAA,IACR;AAAA,MACE,KAAO,EAAA;AAAA,QACL,SAAW,EAAA,6BAAA;AAAA,OACb;AAAA,MACA,IAAM,EAAA,aAAA;AAAA,KACR;AAAA,GACF;AACF,EAAA;AAEO,MAAM,WAAoC,GAAA;AAAA,EAC/C,IAAM,EAAA,WAAA;AAAA,EACN,EAAI,EAAA,cAAA;AAAA,EACJ,OAAO,EAAC;AACV,EAAA;AAEa,MAAA,qBAAA,GAAwB,CACnC,iBAKI,MAAA;AAAA,EACJ,IAAM,EAAA,OAAA;AAAA,EACN,IAAI,gBAAiB,CAAA,SAAA;AAAA,EACrB,KAAO,EAAA;AAAA,IACL,SAAA,EAAW,CAAG,EAAA,gBAAA,CAAiB,SAAS,CAAA,KAAA,CAAA;AAAA,IACxC,aAAe,EAAA;AAAA,MACb,WAAa,EAAA,IAAA;AAAA,MACb,aAAe,EAAA,IAAA;AAAA,MACf,cAAgB,EAAA,IAAA;AAAA,MAChB,qBAAuB,EAAA,KAAA;AAAA,MACvB,YAAc,EAAA,gBAAA;AAAA,MACd,QAAU,EAAA,eAAA;AAAA,MACV,OAAS,EAAA,SAAA;AAAA,KACX;AAAA,IACA,QAAU,EAAA,IAAA;AAAA,IACV,QAAQ,iBAAqB,IAAA,CAAA;AAAA,GAC/B;AACF,CAAA,EAAA;AAEA,MAAM,iBAAgC,GAAA;AAAA,EACpC,KAAO,EAAA;AAAA,IACL,EAAI,EAAA,MAAA;AAAA,IACJ,KAAO,EAAA,OAAA;AAAA,IACP,SAAW,EAAA,sBAAA;AAAA,GACb;AAAA,EACA,IAAM,EAAA,aAAA;AACR,CAAA,CAAA;AAEO,MAAM,6BAA6B,CACxC,mBAAA,EACA,UAAwC,GAAA,iBAAA,EACxC,mBACA,UACe,KAAA;AACf,EAAM,MAAA,cAAA,GAAiB,sBAAsB,iBAAiB,CAAA,CAAA;AAC9D,EAAA,IAAI,mBAAqB,EAAA;AACvB,IAAO,OAAA;AAAA,MACL,GAAG,mBAAA;AAAA,MACH,UAAU,KAAM,CAAA,OAAA,CAAQ,UAAU,CAAI,GAAA,UAAA,GAAa,CAAC,UAAU,CAAA;AAAA,KAChE,CAAA;AAAA,GACK,MAAA;AACL,IAAO,OAAA;AAAA,MACL,GAAG,cAAA;AAAA,MACH,KAAO,EAAA;AAAA,QACL,GAAG,cAAe,CAAA,KAAA;AAAA,QAClB,GAAG,UAAA;AAAA,QACH,aAAe,EAAA;AAAA,UACb,GAAG,eAAe,KAAO,EAAA,aAAA;AAAA,UACzB,GAAG,UAAY,EAAA,aAAA;AAAA,SACjB;AAAA,OACF;AAAA,MACA,UAAU,KAAM,CAAA,OAAA,CAAQ,UAAU,CAAI,GAAA,UAAA,GAAa,CAAC,UAAU,CAAA;AAAA,KAChE,CAAA;AAAA,GACF;AACF;;;;"}

package/esm/workspace-management/useWorkspaceContextMenuItems.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWorkspaceContextMenuItems.js","sources":["../../src/workspace-management/useWorkspaceContextMenuItems.tsx"],"sourcesContent":["import {\n  ContextMenuItemDescriptor,\n  MenuActionHandler,\n  MenuBuilder,\n} from \"@vuu-ui/vuu-data-types\";\nimport { MenuActionClosePopup, useDialogContext } from \"@vuu-ui/vuu-popups\";\nimport { LayoutMetadataDto } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo } from \"react\";\nimport { SaveLayoutPanel } from \"./SaveLayoutPanel\";\nimport { useWorkspace } from \"./WorkspaceProvider\";\n\nexport const useWorkspaceContextMenuItems = () => {\n  const { saveLayout } = useWorkspace();\n\n  const { showDialog, closeDialog } = useDialogContext();\n\n  const handleCloseDialog = useCallback(() => {\n    closeDialog();\n  }, [closeDialog]);\n\n  const handleSave = useCallback(\n    (layoutMetadata: LayoutMetadataDto) => {\n      saveLayout(layoutMetadata);\n      closeDialog();\n    },\n    [saveLayout, closeDialog]\n  );\n\n  const [buildMenuOptions, handleMenuAction] = useMemo<\n    [MenuBuilder, MenuActionHandler]\n  >(() => {\n    return [\n      (location, options) => {\n        const locations = location.split(\" \");\n        const menuDescriptors: ContextMenuItemDescriptor[] = [];\n        if (locations.includes(\"workspace-tab\")) {\n          menuDescriptors.push(\n            {\n              label: \"Save Layout\",\n              action: \"save-layout\",\n              options,\n            },\n            {\n              label: \"Layout Settings\",\n              action: \"layout-settings\",\n              options,\n            }\n          );\n        }\n        return menuDescriptors;\n      },\n      (action: MenuActionClosePopup) => {\n        if (action.menuId === \"save-layout\") {\n          showDialog(\n            <SaveLayoutPanel\n              onCancel={handleCloseDialog}\n              onSave={handleSave}\n              componentId={action.options?.controlledComponentId}\n              defaultTitle={action.options?.controlledComponentTitle as string}\n            />,\n            \"Save Layout\",\n            [],\n            true\n          );\n          return true;\n        }\n        return false;\n      },\n    ];\n  }, [handleCloseDialog, handleSave, showDialog]);\n\n  return {\n    buildMenuOptions,\n    handleMenuAction,\n  };\n};\n"],"names":[],"mappings":";;;;;;AAWO,MAAM,+BAA+B,MAAM;AAChD,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,YAAa,EAAA,CAAA;AAEpC,EAAA,MAAM,EAAE,UAAA,EAAY,WAAY,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAErD,EAAM,MAAA,iBAAA,GAAoB,YAAY,MAAM;AAC1C,IAAY,WAAA,EAAA,CAAA;AAAA,GACd,EAAG,CAAC,WAAW,CAAC,CAAA,CAAA;AAEhB,EAAA,MAAM,UAAa,GAAA,WAAA;AAAA,IACjB,CAAC,cAAsC,KAAA;AACrC,MAAA,UAAA,CAAW,cAAc,CAAA,CAAA;AACzB,MAAY,WAAA,EAAA,CAAA;AAAA,KACd;AAAA,IACA,CAAC,YAAY,WAAW,CAAA;AAAA,GAC1B,CAAA;AAEA,EAAA,MAAM,CAAC,gBAAA,EAAkB,gBAAgB,CAAA,GAAI,QAE3C,MAAM;AACN,IAAO,OAAA;AAAA,MACL,CAAC,UAAU,OAAY,KAAA;AACrB,QAAM,MAAA,SAAA,GAAY,QAAS,CAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AACpC,QAAA,MAAM,kBAA+C,EAAC,CAAA;AACtD,QAAI,IAAA,SAAA,CAAU,QAAS,CAAA,eAAe,CAAG,EAAA;AACvC,UAAgB,eAAA,CAAA,IAAA;AAAA,YACd;AAAA,cACE,KAAO,EAAA,aAAA;AAAA,cACP,MAAQ,EAAA,aAAA;AAAA,cACR,OAAA;AAAA,aACF;AAAA,YACA;AAAA,cACE,KAAO,EAAA,iBAAA;AAAA,cACP,MAAQ,EAAA,iBAAA;AAAA,cACR,OAAA;AAAA,aACF;AAAA,WACF,CAAA;AAAA,SACF;AACA,QAAO,OAAA,eAAA,CAAA;AAAA,OACT;AAAA,MACA,CAAC,MAAiC,KAAA;AAChC,QAAI,IAAA,MAAA,CAAO,WAAW,aAAe,EAAA;AACnC,UAAA,UAAA;AAAA,4BACE,GAAA;AAAA,cAAC,eAAA;AAAA,cAAA;AAAA,gBACC,QAAU,EAAA,iBAAA;AAAA,gBACV,MAAQ,EAAA,UAAA;AAAA,gBACR,WAAA,EAAa,OAAO,OAAS,EAAA,qBAAA;AAAA,gBAC7B,YAAA,EAAc,OAAO,OAAS,EAAA,wBAAA;AAAA,eAAA;AAAA,aAChC;AAAA,YACA,aAAA;AAAA,YACA,EAAC;AAAA,YACD,IAAA;AAAA,WACF,CAAA;AACA,UAAO,OAAA,IAAA,CAAA;AAAA,SACT;AACA,QAAO,OAAA,KAAA,CAAA;AAAA,OACT;AAAA,KACF,CAAA;AAAA,GACC,EAAA,CAAC,iBAAmB,EAAA,UAAA,EAAY,UAAU,CAAC,CAAA,CAAA;AAE9C,EAAO,OAAA;AAAA,IACL,gBAAA;AAAA,IACA,gBAAA;AAAA,GACF,CAAA;AACF;;;;"}
+{"version":3,"file":"useWorkspaceContextMenuItems.js","sources":["../../src/workspace-management/useWorkspaceContextMenuItems.tsx"],"sourcesContent":["import {\n  ContextMenuItemDescriptor,\n  MenuActionHandler,\n  MenuBuilder,\n} from \"@vuu-ui/vuu-data-types\";\nimport { MenuActionClosePopup, useDialogContext } from \"@vuu-ui/vuu-popups\";\nimport { LayoutMetadataDto } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo } from \"react\";\nimport { SaveLayoutPanel } from \"./SaveLayoutPanel\";\nimport { useWorkspace } from \"./WorkspaceProvider\";\n\nexport const useWorkspaceContextMenuItems = () => {\n  const { saveLayout } = useWorkspace();\n\n  const { showDialog, closeDialog } = useDialogContext();\n\n  const handleCloseDialog = useCallback(() => {\n    closeDialog();\n  }, [closeDialog]);\n\n  const handleSave = useCallback(\n    (layoutMetadata: LayoutMetadataDto) => {\n      saveLayout(layoutMetadata);\n      closeDialog();\n    },\n    [saveLayout, closeDialog],\n  );\n\n  const [buildMenuOptions, handleMenuAction] = useMemo<\n    [MenuBuilder, MenuActionHandler]\n  >(() => {\n    return [\n      (location, options) => {\n        const locations = location.split(\" \");\n        const menuDescriptors: ContextMenuItemDescriptor[] = [];\n        if (locations.includes(\"workspace-tab\")) {\n          menuDescriptors.push(\n            {\n              label: \"Save Layout\",\n              action: \"save-layout\",\n              options,\n            },\n            {\n              label: \"Layout Settings\",\n              action: \"layout-settings\",\n              options,\n            },\n          );\n        }\n        return menuDescriptors;\n      },\n      (action: MenuActionClosePopup) => {\n        if (action.menuId === \"save-layout\") {\n          showDialog(\n            <SaveLayoutPanel\n              onCancel={handleCloseDialog}\n              onSave={handleSave}\n              componentId={action.options?.controlledComponentId}\n              defaultTitle={action.options?.controlledComponentTitle as string}\n            />,\n            \"Save Layout\",\n            [],\n            true,\n          );\n          return true;\n        }\n        return false;\n      },\n    ];\n  }, [handleCloseDialog, handleSave, showDialog]);\n\n  return {\n    buildMenuOptions,\n    handleMenuAction,\n  };\n};\n"],"names":[],"mappings":";;;;;;AAWO,MAAM,+BAA+B,MAAM;AAChD,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,YAAa,EAAA,CAAA;AAEpC,EAAA,MAAM,EAAE,UAAA,EAAY,WAAY,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAErD,EAAM,MAAA,iBAAA,GAAoB,YAAY,MAAM;AAC1C,IAAY,WAAA,EAAA,CAAA;AAAA,GACd,EAAG,CAAC,WAAW,CAAC,CAAA,CAAA;AAEhB,EAAA,MAAM,UAAa,GAAA,WAAA;AAAA,IACjB,CAAC,cAAsC,KAAA;AACrC,MAAA,UAAA,CAAW,cAAc,CAAA,CAAA;AACzB,MAAY,WAAA,EAAA,CAAA;AAAA,KACd;AAAA,IACA,CAAC,YAAY,WAAW,CAAA;AAAA,GAC1B,CAAA;AAEA,EAAA,MAAM,CAAC,gBAAA,EAAkB,gBAAgB,CAAA,GAAI,QAE3C,MAAM;AACN,IAAO,OAAA;AAAA,MACL,CAAC,UAAU,OAAY,KAAA;AACrB,QAAM,MAAA,SAAA,GAAY,QAAS,CAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AACpC,QAAA,MAAM,kBAA+C,EAAC,CAAA;AACtD,QAAI,IAAA,SAAA,CAAU,QAAS,CAAA,eAAe,CAAG,EAAA;AACvC,UAAgB,eAAA,CAAA,IAAA;AAAA,YACd;AAAA,cACE,KAAO,EAAA,aAAA;AAAA,cACP,MAAQ,EAAA,aAAA;AAAA,cACR,OAAA;AAAA,aACF;AAAA,YACA;AAAA,cACE,KAAO,EAAA,iBAAA;AAAA,cACP,MAAQ,EAAA,iBAAA;AAAA,cACR,OAAA;AAAA,aACF;AAAA,WACF,CAAA;AAAA,SACF;AACA,QAAO,OAAA,eAAA,CAAA;AAAA,OACT;AAAA,MACA,CAAC,MAAiC,KAAA;AAChC,QAAI,IAAA,MAAA,CAAO,WAAW,aAAe,EAAA;AACnC,UAAA,UAAA;AAAA,4BACE,GAAA;AAAA,cAAC,eAAA;AAAA,cAAA;AAAA,gBACC,QAAU,EAAA,iBAAA;AAAA,gBACV,MAAQ,EAAA,UAAA;AAAA,gBACR,WAAA,EAAa,OAAO,OAAS,EAAA,qBAAA;AAAA,gBAC7B,YAAA,EAAc,OAAO,OAAS,EAAA,wBAAA;AAAA,eAAA;AAAA,aAChC;AAAA,YACA,aAAA;AAAA,YACA,EAAC;AAAA,YACD,IAAA;AAAA,WACF,CAAA;AACA,UAAO,OAAA,IAAA,CAAA;AAAA,SACT;AACA,QAAO,OAAA,KAAA,CAAA;AAAA,OACT;AAAA,KACF,CAAA;AAAA,GACC,EAAA,CAAC,iBAAmB,EAAA,UAAA,EAAY,UAAU,CAAC,CAAA,CAAA;AAE9C,EAAO,OAAA;AAAA,IACL,gBAAA;AAAA,IACA,gBAAA;AAAA,GACF,CAAA;AACF;;;;"}