@vuu-ui/vuu-shell 0.6.4 → 0.6.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/index.js +1 -1
- package/cjs/index.js.map +4 -4
- package/esm/index.js +1 -1
- package/esm/index.js.map +4 -4
- package/package.json +8 -6
- package/types/ShellContextProvider.d.ts +13 -0
- package/types/app-header/AppHeader.d.ts +13 -0
- package/types/app-header/index.d.ts +1 -0
- package/types/feature/ErrorBoundary.d.ts +11 -0
- package/types/feature/Feature.d.ts +11 -0
- package/types/feature/Loader.d.ts +2 -0
- package/types/feature/css-module-loader.d.ts +1 -0
- package/types/feature/index.d.ts +1 -0
- package/types/get-layout-history.d.ts +8 -0
- package/types/index.d.ts +6 -0
- package/types/login/LoginPanel.d.ts +6 -0
- package/types/login/index.d.ts +2 -0
- package/types/login/login-utils.d.ts +3 -0
- package/types/shell.d.ts +16 -0
- package/types/shellTypes.d.ts +16 -0
- package/types/theme-provider/ThemeProvider.d.ts +18 -0
- package/types/theme-switch/ThemeSwitch.d.ts +9 -0
- package/types/theme-switch/index.d.ts +1 -0
- package/types/use-force-render.d.ts +1 -0
- package/types/use-layout-config.d.ts +2 -0
- package/types/user-profile/UserPanel.d.ts +10 -0
- package/types/user-profile/UserProfile.d.ts +10 -0
- package/types/user-profile/index.d.ts +1 -0
package/cjs/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var be=Object.create;var D=Object.defineProperty;var Ne=Object.getOwnPropertyDescriptor;var Ue=Object.getOwnPropertyNames;var ke=Object.getPrototypeOf,Ee=Object.prototype.hasOwnProperty;var De=(t,e)=>{for(var o in e)D(t,o,{get:e[o],enumerable:!0})},q=(t,e,o,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Ue(e))!Ee.call(t,n)&&n!==o&&D(t,n,{get:()=>e[n],enumerable:!(r=Ne(e,n))||r.enumerable});return t};var M=(t,e,o)=>(o=t!=null?be(ke(t)):{},q(e||!t||!t.__esModule?D(o,"default",{value:t,enumerable:!0}):o,t)),Ie=t=>q(D({},"__esModule",{value:!0}),t);var Ke={};De(Ke,{Feature:()=>A,LoginPanel:()=>Be,Shell:()=>We,ShellContextProvider:()=>G,ThemeSwitch:()=>J,getAuthDetailsFromCookies:()=>Fe,logout:()=>O,redirectToLogin:()=>te,useShellContext:()=>$e});module.exports=Ie(Ke);var N=M(require("react")),Y=require("@vuu-ui/vuu-layout");var W=M(require("react")),L=require("react/jsx-runtime"),I=class extends W.default.Component{constructor(e){super(e),this.state={errorMessage:null}}static getDerivedStateFromError(e){return{errorMessage:e.message}}componentDidCatch(e,o){console.log(e,o)}render(){return this.state.errorMessage?(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)("h1",{children:"Something went wrong."}),(0,L.jsx)("p",{children:this.state.errorMessage})]}):this.props.children}};var Q=require("react/jsx-runtime"),K=()=>(0,Q.jsx)("div",{className:"hwLoader",children:"loading"});var X=async t=>{let e=new CSSStyleSheet;return fetch(t).then(o=>o.text()).then(o=>e.replace(o))};var b=require("react/jsx-runtime");function Re({url:t,css:e,params:o,...r}){e&&X(e).then(s=>{document.adoptedStyleSheets=[...document.adoptedStyleSheets,s]});let n=N.default.lazy(()=>import(t));return(0,b.jsx)(I,{children:(0,b.jsx)(N.Suspense,{fallback:(0,b.jsx)(K,{}),children:(0,b.jsx)(n,{...r,...o})})})}var A=N.default.memo(Re);A.displayName="Feature";(0,Y.registerComponent)("Feature",A,"view");var V=require("react"),j=require("@salt-ds/core"),P=require("@heswell/salt-lab");var v=require("react/jsx-runtime"),Z="vuuLoginPanel",Be=({onSubmit:t})=>{let[e,o]=(0,V.useState)(""),[r,n]=(0,V.useState)(""),s=()=>{t(e,r)},a=(l,d)=>{o(d)},c=(l,d)=>{n(d)},i=e.trim()!==""&&r.trim()!=="";return(0,v.jsxs)("div",{className:Z,children:[(0,v.jsx)(P.FormField,{label:"Username",style:{width:200},children:(0,v.jsx)(P.Input,{value:e,id:"text-username",onChange:a})}),(0,v.jsx)(P.FormField,{label:"Password",style:{width:200},children:(0,v.jsx)(P.Input,{type:"password",value:r,id:"text-password",onChange:c})}),(0,v.jsx)(j.Button,{className:`${Z}-login`,disabled:!i,onClick:s,variant:"cta",children:"Login"})]})};var ee=t=>{var e;return(e=document.cookie.split("; ").find(o=>o.startsWith(`${t}=`)))==null?void 0:e.split("=")[1]},Fe=()=>{let t=ee("vuu-username"),e=ee("vuu-auth-token");return[t,e]},te=(t="/login.html")=>{window.location.href=t},O=t=>{document.cookie="vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT",document.cookie="vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT",te(t)};var xe=require("@vuu-ui/vuu-data"),m=require("react");var x=require("react"),Ae=(t,e)=>{let[o,r]=(0,x.useState)(e),n=i=>{r(i)},s=(0,x.useCallback)(async(i="latest")=>{fetch(`api/vui/${t.username}/${i}`,{}).then(l=>l.ok?l.json():e).then(n).catch(()=>{n(e)})},[e,t.username]);(0,x.useEffect)(()=>{s()},[s]);let a=(0,x.useCallback)(i=>{fetch(`api/vui/${t.username}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(i)}).then(l=>l.ok?l.json():e)},[e,t]),c=(0,x.useCallback)(i=>{s(i)},[s]);return[o,a,c]},oe=Ae;var B=require("react"),R=require("react/jsx-runtime"),Ve={},$=(0,B.createContext)(Ve),Oe=({children:t,context:e,inheritedContext:o})=>{let r={...o,...e};return(0,R.jsx)($.Provider,{value:r,children:t})},G=({children:t,value:e})=>(0,R.jsx)($.Consumer,{children:o=>(0,R.jsx)(Oe,{context:e,inheritedContext:o,children:t})}),$e=()=>(0,B.useContext)($);var Ce=M(require("classnames")),u=require("@vuu-ui/vuu-layout");var fe=require("react");var le=require("@salt-ds/core"),me=require("@heswell/salt-lab"),ue=require("@salt-ds/icons");var ne=require("@vuu-ui/vuu-utils"),F=require("@heswell/salt-lab"),se=require("@salt-ds/core"),ae=require("@salt-ds/icons"),f=require("react");var re=async t=>await fetch(`api/vui/${t.username}`,{}).then(o=>o.ok?o.json():null).catch(()=>{console.log("error getting history")});var C=require("react/jsx-runtime"),Ge=({lastUpdate:t},{lastUpdate:e})=>e===t?0:e<t?-1:1,Je=t=>(0,C.jsx)(F.ListItem,{...t}),ie=(0,f.forwardRef)(function({loginUrl:e,onNavigate:o,user:r,layoutId:n="latest"},s){let[a,c]=(0,f.useState)([]);(0,f.useEffect)(()=>{async function g(){let T=(await re(r)).filter(w=>w.id!=="latest").sort(Ge).map(({id:w,lastUpdate:H})=>({lastUpdate:H,id:w,label:`Saved at ${(0,ne.formatDate)(new Date(H),"kk:mm:ss")}`}));console.log({sortedHistory:T}),c(T)}g()},[r]);let i=(0,f.useCallback)((g,y)=>{y&&o(y.id)},[o]),l=(0,f.useCallback)(()=>{O(e)},[e]),d=a.length===0?null:n==="latest"?a[0]:a.find(g=>g.id===n);return(0,C.jsxs)("div",{className:"vuuUserPanel",ref:s,children:[(0,C.jsx)(F.List,{ListItem:Je,className:"vuuUserPanel-history",onSelect:i,selected:d,source:a}),(0,C.jsx)("div",{className:"vuuUserPanel-buttonBar",children:(0,C.jsxs)(se.Button,{"aria-label":"logout",onClick:l,children:[(0,C.jsx)(ae.ExportIcon,{})," Logout"]})})]})});var S=require("react/jsx-runtime"),ce=({layoutId:t,loginUrl:e,onNavigate:o,user:r})=>(0,S.jsxs)(me.DropdownBase,{className:"vuuUserProfile",placement:"bottom-end",children:[(0,S.jsx)(le.Button,{variant:"secondary",children:(0,S.jsx)(ue.UserSolidIcon,{})}),(0,S.jsx)(ie,{layoutId:t,loginUrl:e,onNavigate:s=>{o(s)},user:r})]});var U=require("@heswell/salt-lab"),pe=M(require("classnames")),he=require("@salt-ds/core"),ge=require("react");var k=require("react/jsx-runtime"),_e="vuuThemeSwitch",de=["light","dark"],J=({className:t,defaultMode:e,mode:o,onChange:r,...n})=>{let[s,a]=(0,he.useControlled)({controlled:o,default:e!=null?e:"light",name:"ThemeSwitch",state:"mode"}),c=de.indexOf(s),i=(0,ge.useCallback)((d,g)=>{let y=de[g];a(y),r(y)},[r,a]),l=(0,pe.default)(_e,t);return(0,k.jsxs)(U.ToggleButtonGroup,{className:l,...n,onChange:i,selectedIndex:c,children:[(0,k.jsx)(U.ToggleButton,{"aria-label":"alert",tooltipText:"Light Theme","data-icon":"light"}),(0,k.jsx)(U.ToggleButton,{"aria-label":"home",tooltipText:"Dark Theme","data-icon":"dark"})]})};var ye=M(require("classnames"));var E=require("react/jsx-runtime"),ze="vuuAppHeader",ve=({className:t,layoutId:e,loginUrl:o,onNavigate:r,onSwitchTheme:n,themeMode:s="light",user:a,...c})=>{let i=(0,ye.default)(ze,t,"salt-density-medium"),l=(0,fe.useCallback)(d=>n==null?void 0:n(d),[n]);return(0,E.jsxs)("header",{className:i,...c,children:[(0,E.jsx)(J,{defaultMode:s,onChange:l}),(0,E.jsx)(ce,{layoutId:e,loginUrl:o,onNavigate:r,user:a})]})};var h=require("react/jsx-runtime"),qe={type:"View",props:{style:{height:"calc(100% - 6px)"}},children:[{props:{className:"vuuShell-warningPlaceholder"},type:"Placeholder"}]},We=({children:t,className:e,defaultLayout:o=qe,leftSidePanel:r,loginUrl:n,serverUrl:s,user:a,...c})=>{let i=(0,m.useRef)(null),[l]=(0,m.useState)("high"),d=(0,m.useRef)(null),[g,y]=(0,m.useState)(!1),T=(0,m.useRef)("latest"),[w,H,_]=oe(a,o),Le=(0,m.useCallback)(p=>{H(p)},[H]),Pe=(0,m.useCallback)(p=>{i.current&&(i.current.dataset.mode=p)},[]),Se=p=>{var z;let Me=p.target;(z=d.current)!=null&&z.contains(Me)||y(!g)},Te=(0,m.useCallback)(p=>{T.current=p,_(p)},[_]);(0,m.useEffect)(()=>{s&&a.token&&(0,xe.connectToServer)(s,a.token)},[s,a.token]);let we=()=>{let p=[];return r&&p.push((0,h.jsx)(u.Drawer,{onClick:Se,open:g,position:"left",inline:!0,peekaboo:!0,sizeOpen:200,toggleButton:"end",children:(0,h.jsx)(u.View,{className:"vuuShell-palette",id:"vw-app-palette",ref:d,style:{height:"100%"},children:r},"app-palette")},"left-panel")),p},He=(0,Ce.default)("vuuShell",e,"salt-theme",`salt-density-${l}`);return(0,h.jsxs)(G,{value:void 0,children:[(0,h.jsx)(u.LayoutProvider,{layout:w,onLayoutChange:Le,children:(0,h.jsx)(u.DraggableLayout,{className:He,"data-mode":"light",ref:i,...c,children:(0,h.jsxs)(u.Flexbox,{className:"App",style:{flexDirection:"column",height:"100%",width:"100%"},children:[(0,h.jsx)(ve,{layoutId:T.current,loginUrl:n,user:a,onNavigate:Te,onSwitchTheme:Pe}),(0,h.jsx)(u.Chest,{style:{flex:1},children:we().concat((0,h.jsx)(u.DraggableLayout,{dropTarget:!0,style:{width:"100%",height:"100%"}},"main-content"))})]})})}),t]})};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../packages/vuu-shell/src/index.ts", "../../../packages/vuu-shell/src/feature/Feature.tsx", "../../../packages/vuu-shell/src/feature/ErrorBoundary.jsx", "../../../packages/vuu-shell/src/feature/Loader.tsx", "../../../packages/vuu-shell/src/feature/css-module-loader.ts", "../../../packages/vuu-shell/src/login/LoginPanel.tsx", "../../../packages/vuu-shell/src/login/login-utils.ts", "../../../packages/vuu-shell/src/shell.tsx", "../../../packages/vuu-shell/src/use-layout-config.js", "../../../packages/vuu-shell/src/ShellContextProvider.tsx", "../../../packages/vuu-shell/src/app-header/AppHeader.tsx", "../../../packages/vuu-shell/src/user-profile/UserProfile.tsx", "../../../packages/vuu-shell/src/user-profile/UserPanel.tsx", "../../../packages/vuu-shell/src/get-layout-history.
|
|
4
|
-
"sourcesContent": ["export * from \"./feature\";\nexport * from \"./login\";\nexport * from \"./shell\";\nexport * from \"./shellTypes\";\nexport * from \"./ShellContextProvider\";\nexport * from \"./theme-switch\";\n", "import React, { Suspense } from \"react\";\nimport { registerComponent } from \"@vuu-ui/vuu-layout\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { Loader } from \"./Loader\";\nimport { importCSS } from \"./css-module-loader\";\n\nexport interface FeatureProps<Params extends object | undefined = undefined> {\n height?: number;\n url: string;\n css?: string;\n width?: number;\n params: Params;\n}\n\n// const RawFeature = <Params extends object | undefined>({\nfunction RawFeature<Params extends object | undefined>({\n url,\n css,\n params,\n ...props\n}: FeatureProps<Params>) {\n if (css) {\n // import(/* @vite-ignore */ css, { assert: { type: \"css\" } }).then(\n // (cssModule) => {\n // document.adoptedStyleSheets = [\n // ...document.adoptedStyleSheets,\n // cssModule.default,\n // ];\n // }\n // );\n // Polyfill until vite build supports import assertions\n // Note: already fully supported in esbuild, so vite dev\n importCSS(css).then((styleSheet) => {\n document.adoptedStyleSheets = [\n ...document.adoptedStyleSheets,\n styleSheet,\n ];\n });\n }\n const LazyFeature = React.lazy(() => import(/* @vite-ignore */ url));\n return (\n <ErrorBoundary>\n <Suspense fallback={<Loader />}>\n <LazyFeature {...props} {...params} />\n </Suspense>\n </ErrorBoundary>\n );\n}\n\nexport const Feature = React.memo(RawFeature);\nFeature.displayName = \"Feature\";\nregisterComponent(\"Feature\", Feature, \"view\");\n", "import React from 'react';\n// TODO\nexport class ErrorBoundary extends React.Component {\n constructor(props) {\n super(props);\n this.state = { errorMessage: null };\n }\n\n static getDerivedStateFromError(error) {\n // Update state so the next render will show the fallback UI.\n return { errorMessage: error.message };\n }\n\n componentDidCatch(error, errorInfo) {\n // You can also log the error to an error reporting service\n console.log(error, errorInfo);\n }\n\n render() {\n if (this.state.errorMessage) {\n return (\n <>\n <h1>Something went wrong.</h1>\n <p>{this.state.errorMessage}</p>\n </>\n );\n }\n\n return this.props.children;\n }\n}\n", "// TODO\nexport const Loader = () => <div className=\"hwLoader\">loading</div>;\n", "export const importCSS = async (path: string) => {\n const container = new CSSStyleSheet();\n return fetch(path)\n .then((x) => x.text())\n .then((x) => container.replace(x));\n};\n", "import { ChangeEvent, HTMLAttributes, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { FormField, Input } from \"@heswell/salt-lab\";\n\nimport \"./LoginPanel.css\";\n\nconst classBase = \"vuuLoginPanel\";\n\nexport interface LoginPanelProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onSubmit\"> {\n onSubmit: (username: string, password: string) => void;\n}\n\nexport const LoginPanel = ({ onSubmit }: LoginPanelProps) => {\n const [username, setUserName] = useState(\"\");\n const [password, setPassword] = useState(\"\");\n\n const login = () => {\n onSubmit(username, password);\n };\n\n const handleUsername = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setUserName(value);\n };\n\n const handlePassword = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setPassword(value);\n };\n\n const dataIsValid = username.trim() !== \"\" && password.trim() !== \"\";\n\n return (\n <div className={classBase}>\n <FormField label=\"Username\" style={{ width: 200 }}>\n <Input value={username} id=\"text-username\" onChange={handleUsername} />\n </FormField>\n\n <FormField label=\"Password\" style={{ width: 200 }}>\n <Input\n type=\"password\"\n value={password}\n id=\"text-password\"\n onChange={handlePassword}\n />\n </FormField>\n\n <Button\n className={`${classBase}-login`}\n disabled={!dataIsValid}\n onClick={login}\n variant=\"cta\"\n >\n Login\n </Button>\n </div>\n );\n};\n", "const getCookieValue = (name: string) =>\n document.cookie\n .split(\"; \")\n .find((row) => row.startsWith(`${name}=`))\n ?.split(\"=\")[1];\n\nexport const getAuthDetailsFromCookies = () => {\n const username = getCookieValue(\"vuu-username\");\n const token = getCookieValue(\"vuu-auth-token\");\n return [username, token];\n};\n\nexport const redirectToLogin = (loginUrl = \"/login.html\") => {\n window.location.href = loginUrl;\n};\n\nexport const logout = (loginUrl?: string) => {\n document.cookie = \"vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n document.cookie = \"vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n redirectToLogin(loginUrl);\n};\n", "import { connectToServer } from \"@vuu-ui/vuu-data\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport useLayoutConfig from \"./use-layout-config\";\nimport { ShellContextProvider } from \"./ShellContextProvider\";\nimport cx from \"classnames\";\n\nimport {\n Chest,\n DraggableLayout,\n Drawer,\n FlexboxLayout as Flexbox,\n LayoutProvider,\n View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { AppHeader } from \"./app-header\";\n// import { AppPalette } from \"./app-palette\";\n\nimport { LayoutJSON } from \"@vuu-ui/vuu-layout/src/layout-reducer\";\nimport \"./shell.css\";\nimport { ThemeMode } from \"./theme-switch\";\n\nexport type VuuUser = {\n username: string;\n token: string;\n};\n\nconst warningLayout = {\n type: \"View\",\n props: {\n style: { height: \"calc(100% - 6px)\" },\n },\n children: [\n {\n props: {\n className: \"vuuShell-warningPlaceholder\",\n },\n type: \"Placeholder\",\n },\n ],\n};\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n defaultLayout?: LayoutJSON;\n leftSidePanel?: ReactElement;\n loginUrl?: string;\n // paletteConfig: any;\n serverUrl?: string;\n user: VuuUser;\n}\n\nexport const Shell = ({\n children,\n className: classNameProp,\n defaultLayout = warningLayout,\n leftSidePanel,\n loginUrl,\n serverUrl,\n user,\n ...htmlAttributes\n}: ShellProps) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const [density] = useState<\"high\" | \"medium\" | \"low\" | \"touch\">(\"high\");\n const paletteView = useRef<HTMLDivElement>(null);\n const [open, setOpen] = useState(false);\n const layoutId = useRef(\"latest\");\n\n const [layout, setLayoutConfig, loadLayoutById] = useLayoutConfig(\n user,\n defaultLayout\n );\n\n const handleLayoutChange = useCallback(\n (layout) => {\n setLayoutConfig(layout);\n },\n [setLayoutConfig]\n );\n\n const handleSwitchTheme = useCallback((mode: ThemeMode) => {\n if (rootRef.current) {\n rootRef.current.dataset.mode = mode;\n }\n }, []);\n\n const handleDrawerClick = (e: MouseEvent<HTMLElement>) => {\n const target = e.target as HTMLElement;\n if (!paletteView.current?.contains(target)) {\n setOpen(!open);\n }\n };\n\n const handleNavigate = useCallback(\n (id) => {\n layoutId.current = id;\n loadLayoutById(id);\n },\n [loadLayoutById]\n );\n\n useEffect(() => {\n if (serverUrl && user.token) {\n connectToServer(serverUrl, user.token);\n }\n }, [serverUrl, user.token]);\n\n const getDrawers = () => {\n const drawers: ReactElement[] = [];\n if (leftSidePanel) {\n drawers.push(\n <Drawer\n key=\"left-panel\"\n onClick={handleDrawerClick}\n open={open}\n position=\"left\"\n inline\n peekaboo\n sizeOpen={200}\n toggleButton=\"end\"\n >\n <View\n className=\"vuuShell-palette\"\n id=\"vw-app-palette\"\n key=\"app-palette\"\n ref={paletteView}\n style={{ height: \"100%\" }}\n >\n {leftSidePanel}\n </View>\n </Drawer>\n );\n }\n\n return drawers;\n };\n\n const className = cx(\n \"vuuShell\",\n classNameProp,\n \"salt-theme\",\n `salt-density-${density}`\n );\n\n return (\n // ShellContext TBD\n <ShellContextProvider value={undefined}>\n <LayoutProvider layout={layout} onLayoutChange={handleLayoutChange}>\n <DraggableLayout\n className={className}\n data-mode=\"light\"\n ref={rootRef}\n {...htmlAttributes}\n >\n <Flexbox\n className=\"App\"\n style={{ flexDirection: \"column\", height: \"100%\", width: \"100%\" }}\n >\n <AppHeader\n layoutId={layoutId.current}\n loginUrl={loginUrl}\n user={user}\n onNavigate={handleNavigate}\n onSwitchTheme={handleSwitchTheme}\n />\n <Chest style={{ flex: 1 }}>\n {getDrawers().concat(\n <DraggableLayout\n dropTarget\n key=\"main-content\"\n style={{ width: \"100%\", height: \"100%\" }}\n />\n )}\n </Chest>\n </Flexbox>\n </DraggableLayout>\n </LayoutProvider>\n {children}\n </ShellContextProvider>\n );\n};\n", "import { useCallback, useEffect, useState } from \"react\";\n\nconst useLayoutConfig = (user, defaultLayout) => {\n const [layout, _setLayout] = useState(defaultLayout);\n\n const setLayout = (layout) => {\n _setLayout(layout);\n };\n\n const load = useCallback(\n async (id = \"latest\") => {\n fetch(`api/vui/${user.username}/${id}`, {})\n .then((response) => {\n return response.ok ? response.json() : defaultLayout;\n })\n .then(setLayout)\n .catch(() => {\n // TODO we should set a layout with a warning here\n setLayout(defaultLayout);\n });\n },\n [defaultLayout, user.username]\n );\n\n useEffect(() => {\n load();\n }, [load]);\n\n const saveData = useCallback(\n (data) => {\n fetch(`api/vui/${user.username}`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(data),\n }).then((response) => {\n return response.ok ? response.json() : defaultLayout;\n });\n // .then((data) => console.log(data));\n },\n [defaultLayout, user]\n );\n\n const loadLayoutById = useCallback(\n (id) => {\n load(id);\n },\n [load]\n );\n\n return [layout, saveData, loadLayoutById];\n};\n\nexport default useLayoutConfig;\n", "import { MenuRpcResponse } from \"@vuu-ui/vuu-data\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-datagrid-types\";\nimport { createContext, ReactElement, ReactNode, useContext } from \"react\";\n\nexport interface ShellContextProps {\n getDefaultColumnConfig?: (\n tableName: string,\n columnName: string\n ) => Partial<ColumnDescriptor>;\n handleRpcResponse?: (response?: MenuRpcResponse) => void;\n}\n\nconst defaultConfig = {};\n\nconst ShellContext = createContext<ShellContextProps>(defaultConfig);\n\nexport interface ShellProviderProps {\n children: ReactNode;\n value: ShellContextProps;\n}\n\nconst Provider = ({\n children,\n context,\n inheritedContext,\n}: {\n children: ReactNode;\n context?: ShellContextProps;\n inheritedContext?: ShellContextProps;\n}) => {\n // TODO functions provided at multiple levels must be merged\n const mergedContext = {\n ...inheritedContext,\n ...context,\n };\n return (\n <ShellContext.Provider value={mergedContext}>\n {children}\n </ShellContext.Provider>\n );\n};\n\nexport const ShellContextProvider = ({\n children,\n value,\n}: ShellProviderProps): ReactElement => {\n return (\n <ShellContext.Consumer>\n {(context) => (\n <Provider context={value} inheritedContext={context}>\n {children}\n </Provider>\n )}\n </ShellContext.Consumer>\n );\n};\n\nexport const useShellContext = () => {\n return useContext(ShellContext);\n};\n", "import { HTMLAttributes, useCallback } from \"react\";\nimport { VuuUser } from \"../shell\";\nimport { UserProfile } from \"../user-profile\";\nimport { ThemeMode, ThemeSwitch } from \"../theme-switch\";\nimport cx from \"classnames\";\n\nimport \"./AppHeader.css\";\n\nconst classBase = \"vuuAppHeader\";\nexport interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {\n layoutId: string;\n loginUrl?: string;\n onNavigate: (id: string) => void;\n onSwitchTheme?: (mode: ThemeMode) => void;\n themeMode?: ThemeMode;\n user: VuuUser;\n}\n\nexport const AppHeader = ({\n className: classNameProp,\n layoutId,\n loginUrl,\n onNavigate,\n onSwitchTheme,\n themeMode = \"light\",\n user,\n ...htmlAttributes\n}: AppHeaderProps) => {\n const className = cx(classBase, classNameProp, \"salt-density-medium\");\n const handleSwitchTheme = useCallback(\n (mode: ThemeMode) => onSwitchTheme?.(mode),\n [onSwitchTheme]\n );\n return (\n <header className={className} {...htmlAttributes}>\n <ThemeSwitch defaultMode={themeMode} onChange={handleSwitchTheme} />\n <UserProfile\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={onNavigate}\n user={user}\n />\n </header>\n );\n};\n", "import React, { useCallback, useRef, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { DropdownBase } from \"@heswell/salt-lab\";\nimport { UserSolidIcon } from \"@salt-ds/icons\";\nimport { UserPanel } from \"./UserPanel\";\n\nimport \"./UserProfile.css\";\n\nexport const UserProfile = ({ layoutId, loginUrl, onNavigate, user }) => {\n const [open, setOpen] = useState(false);\n const openRef = useRef(false);\n const buttonRef = useRef(null);\n\n const toggle = useCallback(() => {\n setOpen((isOpen) => {\n return (openRef.current = !isOpen);\n });\n requestAnimationFrame(() => {\n if (!openRef.current) {\n requestAnimationFrame(() => {\n buttonRef.current.focus();\n });\n }\n });\n }, []);\n\n const handleNavigate = (id) => {\n setOpen(false);\n onNavigate(id);\n };\n\n return (\n <DropdownBase\n className=\"vuuUserProfile\"\n placement=\"bottom-end\"\n onCancel={toggle}\n >\n <Button ref={buttonRef} variant=\"secondary\">\n <UserSolidIcon />\n </Button>\n <UserPanel\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={handleNavigate}\n user={user}\n />\n </DropdownBase>\n );\n};\n", "import React, { forwardRef, useCallback, useEffect, useState } from \"react\";\nimport { formatDate } from \"@vuu-ui/vuu-utils\";\nimport { logout } from \"../login\";\nimport { getLayoutHistory } from \"../get-layout-history\";\nimport { ExportIcon } from \"@salt-ds/icons\";\nimport { Button } from \"@salt-ds/core\";\nimport { List, ListItem } from \"@heswell/salt-lab\";\n\nimport \"./UserPanel.css\";\n\nconst byLastUpdate = ({ lastUpdate: l1 }, { lastUpdate: l2 }) => {\n return l2 === l1 ? 0 : l2 < l1 ? -1 : 1;\n};\n\nconst HistoryListItem = (props) => {\n return <ListItem {...props} />;\n};\n\nexport const UserPanel = forwardRef(function UserPanel(\n { loginUrl, onNavigate, user, layoutId = \"latest\" },\n forwardedRef\n) {\n const [history, setHistory] = useState([]);\n\n useEffect(() => {\n async function getHistory() {\n const history = await getLayoutHistory(user);\n console.log({ history });\n const sortedHistory = history\n .filter((item) => item.id !== \"latest\")\n .sort(byLastUpdate)\n .map(({ id, lastUpdate }) => ({\n lastUpdate,\n id,\n label: `Saved at ${formatDate(new Date(lastUpdate), \"kk:mm:ss\")}`,\n }));\n console.log({ sortedHistory });\n setHistory(sortedHistory);\n }\n\n getHistory();\n }, [user]);\n\n const handleHisorySelected = useCallback(\n (evt, selected) => {\n if (selected) {\n onNavigate(selected.id);\n }\n },\n [onNavigate]\n );\n\n const handleLogout = useCallback(() => {\n logout(loginUrl);\n }, [loginUrl]);\n\n const selected =\n history.length === 0\n ? []\n : layoutId === \"latest\"\n ? history[0]\n : history.find((i) => i.id === layoutId);\n console.log({ selected });\n\n return (\n <div className=\"vuuUserPanel\" ref={forwardedRef}>\n <List\n ListItem={HistoryListItem}\n className=\"vuuUserPanel-history\"\n onSelect={handleHisorySelected}\n selected={selected}\n source={history}\n />\n <div className=\"vuuUserPanel-buttonBar\">\n <Button aria-label=\"logout\" onClick={handleLogout}>\n <ExportIcon /> Logout\n </Button>\n </div>\n </div>\n );\n});\n", "export const getLayoutHistory = async (user) => {\n const history = await fetch(`api/vui/${user.username}`, {})\n .then((response) => {\n return response.ok ? response.json() : null;\n })\n .catch(() => {\n // TODO we should set a layout with a warning here\n console.log(`error getting history`);\n });\n\n return history;\n};\n", "import {\n ToggleButton,\n ToggleButtonGroup,\n ToggleButtonGroupChangeEventHandler,\n} from \"@heswell/salt-lab\";\nimport cx from \"classnames\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\n\nexport type ThemeMode = \"light\" | \"dark\";\n\nexport interface ThemeSwitchProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultMode?: ThemeMode;\n mode?: ThemeMode;\n onChange: (mode: ThemeMode) => void;\n}\n\nconst modes: ThemeMode[] = [\"light\", \"dark\"];\n\nexport const ThemeSwitch = ({\n className: classNameProp,\n defaultMode: defaultModeProp,\n mode: modeProp,\n onChange,\n ...htmlAttributes\n}: ThemeSwitchProps) => {\n const [mode, setMode] = useControlled<ThemeMode>({\n controlled: modeProp,\n default: defaultModeProp ?? \"light\",\n name: \"ThemeSwitch\",\n state: \"mode\",\n });\n\n const selectedIndex = modes.indexOf(mode);\n\n const handleChangeSecondary: ToggleButtonGroupChangeEventHandler =\n useCallback(\n (_evt, index) => {\n const mode = modes[index];\n setMode(mode);\n onChange(mode);\n },\n [onChange, setMode]\n );\n const className = cx(classBase, classNameProp);\n return (\n <ToggleButtonGroup\n className={className}\n {...htmlAttributes}\n onChange={handleChangeSecondary}\n selectedIndex={selectedIndex}\n >\n <ToggleButton\n aria-label=\"alert\"\n tooltipText=\"Light Theme\"\n data-icon=\"light\"\n />\n <ToggleButton\n aria-label=\"home\"\n tooltipText=\"Dark Theme\"\n data-icon=\"dark\"\n />\n </ToggleButtonGroup>\n );\n};\n"],
|
|
5
|
-
"mappings": "skBAAA,IAAAA,GAAA,GAAAC,GAAAD,GAAA,aAAAE,EAAA,eAAAC,GAAA,UAAAC,GAAA,yBAAAC,EAAA,gBAAAC,EAAA,8BAAAC,GAAA,WAAAC,EAAA,oBAAAC,GAAA,oBAAAC,KAAA,eAAAC,GAAAX,ICAA,IAAAY,EAAgC,oBAChCC,EAAkC,8BCDlC,IAAAC,EAAkB,oBAqBVC,EAAA,6BAnBKC,EAAN,cAA4B,EAAAC,QAAM,SAAU,CACjD,YAAYC,EAAO,CACjB,MAAMA,CAAK,EACX,KAAK,MAAQ,CAAE,aAAc,IAAK,CACpC,CAEA,OAAO,yBAAyBC,EAAO,CAErC,MAAO,CAAE,aAAcA,EAAM,OAAQ,CACvC,CAEA,kBAAkBA,EAAOC,EAAW,CAElC,QAAQ,IAAID,EAAOC,CAAS,CAC9B,CAEA,QAAS,CACP,OAAI,KAAK,MAAM,gBAEX,oBACE,oBAAC,MAAG,iCAAqB,KACzB,OAAC,KAAG,cAAK,MAAM,aAAa,GAC9B,EAIG,KAAK,MAAM,QACpB,CACF,EC7B4B,IAAAC,EAAA,6BAAfC,EAAS,OAAM,OAAC,OAAI,UAAU,WAAW,mBAAO,ECDtD,IAAMC,EAAY,MAAOC,GAAiB,CAC/C,IAAMC,EAAY,IAAI,cACtB,OAAO,MAAMD,CAAI,EACd,KAAME,GAAMA,EAAE,KAAK,CAAC,EACpB,KAAMA,GAAMD,EAAU,QAAQC,CAAC,CAAC,CACrC,EHqC0B,IAAAC,EAAA,6BA3B1B,SAASC,GAA8C,CACrD,IAAAC,EACA,IAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EAAyB,CACnBF,GAWFG,EAAUH,CAAG,EAAE,KAAMI,GAAe,CAClC,SAAS,mBAAqB,CAC5B,GAAG,SAAS,mBACZA,CACF,CACF,CAAC,EAEH,IAAMC,EAAc,EAAAC,QAAM,KAAK,IAAM,OAA0BP,EAAI,EACnE,SACE,OAACQ,EAAA,CACC,mBAAC,YAAS,YAAU,OAACC,EAAA,EAAO,EAC1B,mBAACH,EAAA,CAAa,GAAGH,EAAQ,GAAGD,EAAQ,EACtC,EACF,CAEJ,CAEO,IAAMQ,EAAU,EAAAH,QAAM,KAAKR,EAAU,EAC5CW,EAAQ,YAAc,aACtB,qBAAkB,UAAWA,EAAS,MAAM,EInD5C,IAAAC,EAAsD,iBACtDC,
|
|
6
|
-
"names": ["src_exports", "__export", "Feature", "LoginPanel", "Shell", "ShellContextProvider", "ThemeSwitch", "getAuthDetailsFromCookies", "logout", "redirectToLogin", "useShellContext", "__toCommonJS", "import_react", "import_vuu_layout", "import_react", "import_jsx_runtime", "ErrorBoundary", "React", "props", "error", "errorInfo", "import_jsx_runtime", "Loader", "importCSS", "path", "container", "x", "import_jsx_runtime", "RawFeature", "url", "css", "params", "props", "importCSS", "styleSheet", "LazyFeature", "React", "ErrorBoundary", "Loader", "Feature", "import_react", "import_core", "import_salt_lab", "import_jsx_runtime", "classBase", "LoginPanel", "onSubmit", "username", "setUserName", "password", "setPassword", "login", "handleUsername", "_event", "value", "handlePassword", "dataIsValid", "getCookieValue", "name", "_a", "row", "getAuthDetailsFromCookies", "username", "token", "redirectToLogin", "loginUrl", "logout", "import_vuu_data", "import_react", "import_react", "useLayoutConfig", "user", "defaultLayout", "layout", "_setLayout", "setLayout", "load", "id", "response", "saveData", "data", "loadLayoutById", "use_layout_config_default", "import_react", "import_jsx_runtime", "defaultConfig", "ShellContext", "Provider", "children", "context", "inheritedContext", "mergedContext", "ShellContextProvider", "value", "useShellContext", "import_classnames", "import_vuu_layout", "import_react", "
|
|
3
|
+
"sources": ["../../../packages/vuu-shell/src/index.ts", "../../../packages/vuu-shell/src/feature/Feature.tsx", "../../../packages/vuu-shell/src/feature/ErrorBoundary.jsx", "../../../packages/vuu-shell/src/feature/Loader.tsx", "../../../packages/vuu-shell/src/feature/css-module-loader.ts", "../../../packages/vuu-shell/src/login/LoginPanel.tsx", "../../../packages/vuu-shell/src/login/login-utils.ts", "../../../packages/vuu-shell/src/shell.tsx", "../../../packages/vuu-shell/src/use-layout-config.js", "../../../packages/vuu-shell/src/ShellContextProvider.tsx", "../../../packages/vuu-shell/src/app-header/AppHeader.tsx", "../../../packages/vuu-shell/src/user-profile/UserProfile.tsx", "../../../packages/vuu-shell/src/user-profile/UserPanel.tsx", "../../../packages/vuu-shell/src/get-layout-history.ts", "../../../packages/vuu-shell/src/theme-switch/ThemeSwitch.tsx"],
|
|
4
|
+
"sourcesContent": ["export * from \"./feature\";\nexport * from \"./login\";\nexport * from \"./shell\";\nexport * from \"./shellTypes\";\nexport * from \"./ShellContextProvider\";\nexport * from \"./theme-switch\";\n", "import React, { Suspense } from \"react\";\nimport { registerComponent } from \"@vuu-ui/vuu-layout\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { Loader } from \"./Loader\";\nimport { importCSS } from \"./css-module-loader\";\n\nexport interface FeatureProps<Params extends object | undefined = undefined> {\n height?: number;\n url: string;\n css?: string;\n width?: number;\n params: Params;\n}\n\n// const RawFeature = <Params extends object | undefined>({\nfunction RawFeature<Params extends object | undefined>({\n url,\n css,\n params,\n ...props\n}: FeatureProps<Params>) {\n if (css) {\n // import(/* @vite-ignore */ css, { assert: { type: \"css\" } }).then(\n // (cssModule) => {\n // document.adoptedStyleSheets = [\n // ...document.adoptedStyleSheets,\n // cssModule.default,\n // ];\n // }\n // );\n // Polyfill until vite build supports import assertions\n // Note: already fully supported in esbuild, so vite dev\n importCSS(css).then((styleSheet) => {\n document.adoptedStyleSheets = [\n ...document.adoptedStyleSheets,\n styleSheet,\n ];\n });\n }\n const LazyFeature = React.lazy(() => import(/* @vite-ignore */ url));\n return (\n <ErrorBoundary>\n <Suspense fallback={<Loader />}>\n <LazyFeature {...props} {...params} />\n </Suspense>\n </ErrorBoundary>\n );\n}\n\nexport const Feature = React.memo(RawFeature);\nFeature.displayName = \"Feature\";\nregisterComponent(\"Feature\", Feature, \"view\");\n", "import React from 'react';\n// TODO\nexport class ErrorBoundary extends React.Component {\n constructor(props) {\n super(props);\n this.state = { errorMessage: null };\n }\n\n static getDerivedStateFromError(error) {\n // Update state so the next render will show the fallback UI.\n return { errorMessage: error.message };\n }\n\n componentDidCatch(error, errorInfo) {\n // You can also log the error to an error reporting service\n console.log(error, errorInfo);\n }\n\n render() {\n if (this.state.errorMessage) {\n return (\n <>\n <h1>Something went wrong.</h1>\n <p>{this.state.errorMessage}</p>\n </>\n );\n }\n\n return this.props.children;\n }\n}\n", "// TODO\nexport const Loader = () => <div className=\"hwLoader\">loading</div>;\n", "export const importCSS = async (path: string) => {\n const container = new CSSStyleSheet();\n return fetch(path)\n .then((x) => x.text())\n .then((x) => container.replace(x));\n};\n", "import { ChangeEvent, HTMLAttributes, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { FormField, Input } from \"@heswell/salt-lab\";\n\nimport \"./LoginPanel.css\";\n\nconst classBase = \"vuuLoginPanel\";\n\nexport interface LoginPanelProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onSubmit\"> {\n onSubmit: (username: string, password: string) => void;\n}\n\nexport const LoginPanel = ({ onSubmit }: LoginPanelProps) => {\n const [username, setUserName] = useState(\"\");\n const [password, setPassword] = useState(\"\");\n\n const login = () => {\n onSubmit(username, password);\n };\n\n const handleUsername = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setUserName(value);\n };\n\n const handlePassword = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setPassword(value);\n };\n\n const dataIsValid = username.trim() !== \"\" && password.trim() !== \"\";\n\n return (\n <div className={classBase}>\n <FormField label=\"Username\" style={{ width: 200 }}>\n <Input value={username} id=\"text-username\" onChange={handleUsername} />\n </FormField>\n\n <FormField label=\"Password\" style={{ width: 200 }}>\n <Input\n type=\"password\"\n value={password}\n id=\"text-password\"\n onChange={handlePassword}\n />\n </FormField>\n\n <Button\n className={`${classBase}-login`}\n disabled={!dataIsValid}\n onClick={login}\n variant=\"cta\"\n >\n Login\n </Button>\n </div>\n );\n};\n", "const getCookieValue = (name: string) =>\n document.cookie\n .split(\"; \")\n .find((row) => row.startsWith(`${name}=`))\n ?.split(\"=\")[1];\n\nexport const getAuthDetailsFromCookies = () => {\n const username = getCookieValue(\"vuu-username\");\n const token = getCookieValue(\"vuu-auth-token\");\n return [username, token];\n};\n\nexport const redirectToLogin = (loginUrl = \"/login.html\") => {\n window.location.href = loginUrl;\n};\n\nexport const logout = (loginUrl?: string) => {\n document.cookie = \"vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n document.cookie = \"vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n redirectToLogin(loginUrl);\n};\n", "import { connectToServer } from \"@vuu-ui/vuu-data\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport useLayoutConfig from \"./use-layout-config\";\nimport { ShellContextProvider } from \"./ShellContextProvider\";\nimport cx from \"classnames\";\n\nimport {\n Chest,\n DraggableLayout,\n Drawer,\n Flexbox,\n LayoutProvider,\n View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { AppHeader } from \"./app-header\";\n\nimport { LayoutJSON } from \"@vuu-ui/vuu-layout/src/layout-reducer\";\nimport \"./shell.css\";\nimport { ThemeMode } from \"./theme-switch\";\n\nexport type VuuUser = {\n username: string;\n token: string;\n};\n\nconst warningLayout = {\n type: \"View\",\n props: {\n style: { height: \"calc(100% - 6px)\" },\n },\n children: [\n {\n props: {\n className: \"vuuShell-warningPlaceholder\",\n },\n type: \"Placeholder\",\n },\n ],\n};\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n defaultLayout?: LayoutJSON;\n leftSidePanel?: ReactElement;\n loginUrl?: string;\n // paletteConfig: any;\n serverUrl?: string;\n user: VuuUser;\n}\n\nexport const Shell = ({\n children,\n className: classNameProp,\n defaultLayout = warningLayout,\n leftSidePanel,\n loginUrl,\n serverUrl,\n user,\n ...htmlAttributes\n}: ShellProps) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const [density] = useState<\"high\" | \"medium\" | \"low\" | \"touch\">(\"high\");\n const paletteView = useRef<HTMLDivElement>(null);\n const [open, setOpen] = useState(false);\n const layoutId = useRef(\"latest\");\n\n const [layout, setLayoutConfig, loadLayoutById] = useLayoutConfig(\n user,\n defaultLayout\n );\n\n const handleLayoutChange = useCallback(\n (layout) => {\n setLayoutConfig(layout);\n },\n [setLayoutConfig]\n );\n\n const handleSwitchTheme = useCallback((mode: ThemeMode) => {\n if (rootRef.current) {\n rootRef.current.dataset.mode = mode;\n }\n }, []);\n\n const handleDrawerClick = (e: MouseEvent<HTMLElement>) => {\n const target = e.target as HTMLElement;\n if (!paletteView.current?.contains(target)) {\n setOpen(!open);\n }\n };\n\n const handleNavigate = useCallback(\n (id) => {\n layoutId.current = id;\n loadLayoutById(id);\n },\n [loadLayoutById]\n );\n\n useEffect(() => {\n if (serverUrl && user.token) {\n connectToServer(serverUrl, user.token);\n }\n }, [serverUrl, user.token]);\n\n const getDrawers = () => {\n const drawers: ReactElement[] = [];\n if (leftSidePanel) {\n drawers.push(\n <Drawer\n key=\"left-panel\"\n onClick={handleDrawerClick}\n open={open}\n position=\"left\"\n inline\n peekaboo\n sizeOpen={200}\n toggleButton=\"end\"\n >\n <View\n className=\"vuuShell-palette\"\n id=\"vw-app-palette\"\n key=\"app-palette\"\n ref={paletteView}\n style={{ height: \"100%\" }}\n >\n {leftSidePanel}\n </View>\n </Drawer>\n );\n }\n\n return drawers;\n };\n\n const className = cx(\n \"vuuShell\",\n classNameProp,\n \"salt-theme\",\n `salt-density-${density}`\n );\n\n return (\n // ShellContext TBD\n <ShellContextProvider value={undefined}>\n <LayoutProvider layout={layout} onLayoutChange={handleLayoutChange}>\n <DraggableLayout\n className={className}\n data-mode=\"light\"\n ref={rootRef}\n {...htmlAttributes}\n >\n <Flexbox\n className=\"App\"\n style={{ flexDirection: \"column\", height: \"100%\", width: \"100%\" }}\n >\n <AppHeader\n layoutId={layoutId.current}\n loginUrl={loginUrl}\n user={user}\n onNavigate={handleNavigate}\n onSwitchTheme={handleSwitchTheme}\n />\n <Chest style={{ flex: 1 }}>\n {getDrawers().concat(\n <DraggableLayout\n dropTarget\n key=\"main-content\"\n style={{ width: \"100%\", height: \"100%\" }}\n />\n )}\n </Chest>\n </Flexbox>\n </DraggableLayout>\n </LayoutProvider>\n {children}\n </ShellContextProvider>\n );\n};\n", "import { useCallback, useEffect, useState } from \"react\";\n\nconst useLayoutConfig = (user, defaultLayout) => {\n const [layout, _setLayout] = useState(defaultLayout);\n\n const setLayout = (layout) => {\n _setLayout(layout);\n };\n\n const load = useCallback(\n async (id = \"latest\") => {\n fetch(`api/vui/${user.username}/${id}`, {})\n .then((response) => {\n return response.ok ? response.json() : defaultLayout;\n })\n .then(setLayout)\n .catch(() => {\n // TODO we should set a layout with a warning here\n setLayout(defaultLayout);\n });\n },\n [defaultLayout, user.username]\n );\n\n useEffect(() => {\n load();\n }, [load]);\n\n const saveData = useCallback(\n (data) => {\n fetch(`api/vui/${user.username}`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(data),\n }).then((response) => {\n return response.ok ? response.json() : defaultLayout;\n });\n },\n [defaultLayout, user]\n );\n\n const loadLayoutById = useCallback(\n (id) => {\n load(id);\n },\n [load]\n );\n\n return [layout, saveData, loadLayoutById];\n};\n\nexport default useLayoutConfig;\n", "import { MenuRpcResponse } from \"@vuu-ui/vuu-data\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-datagrid-types\";\nimport { createContext, ReactElement, ReactNode, useContext } from \"react\";\n\nexport interface ShellContextProps {\n getDefaultColumnConfig?: (\n tableName: string,\n columnName: string\n ) => Partial<ColumnDescriptor>;\n handleRpcResponse?: (response?: MenuRpcResponse) => void;\n}\n\nconst defaultConfig = {};\n\nconst ShellContext = createContext<ShellContextProps>(defaultConfig);\n\nexport interface ShellProviderProps {\n children: ReactNode;\n value?: ShellContextProps;\n}\n\nconst Provider = ({\n children,\n context,\n inheritedContext,\n}: {\n children: ReactNode;\n context?: ShellContextProps;\n inheritedContext?: ShellContextProps;\n}) => {\n // TODO functions provided at multiple levels must be merged\n const mergedContext = {\n ...inheritedContext,\n ...context,\n };\n return (\n <ShellContext.Provider value={mergedContext}>\n {children}\n </ShellContext.Provider>\n );\n};\n\nexport const ShellContextProvider = ({\n children,\n value,\n}: ShellProviderProps): ReactElement => {\n return (\n <ShellContext.Consumer>\n {(context) => (\n <Provider context={value} inheritedContext={context}>\n {children}\n </Provider>\n )}\n </ShellContext.Consumer>\n );\n};\n\nexport const useShellContext = () => {\n return useContext(ShellContext);\n};\n", "import { HTMLAttributes, useCallback } from \"react\";\nimport { VuuUser } from \"../shell\";\nimport { UserProfile } from \"../user-profile\";\nimport { ThemeMode, ThemeSwitch } from \"../theme-switch\";\nimport cx from \"classnames\";\n\nimport \"./AppHeader.css\";\n\nconst classBase = \"vuuAppHeader\";\nexport interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {\n layoutId: string;\n loginUrl?: string;\n onNavigate: (id: string) => void;\n onSwitchTheme?: (mode: ThemeMode) => void;\n themeMode?: ThemeMode;\n user: VuuUser;\n}\n\nexport const AppHeader = ({\n className: classNameProp,\n layoutId,\n loginUrl,\n onNavigate,\n onSwitchTheme,\n themeMode = \"light\",\n user,\n ...htmlAttributes\n}: AppHeaderProps) => {\n const className = cx(classBase, classNameProp, \"salt-density-medium\");\n const handleSwitchTheme = useCallback(\n (mode: ThemeMode) => onSwitchTheme?.(mode),\n [onSwitchTheme]\n );\n return (\n <header className={className} {...htmlAttributes}>\n <ThemeSwitch defaultMode={themeMode} onChange={handleSwitchTheme} />\n <UserProfile\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={onNavigate}\n user={user}\n />\n </header>\n );\n};\n", "import { Button } from \"@salt-ds/core\";\nimport { DropdownBase } from \"@heswell/salt-lab\";\nimport { UserSolidIcon } from \"@salt-ds/icons\";\nimport { UserPanel } from \"./UserPanel\";\n\nimport \"./UserProfile.css\";\nimport { VuuUser } from \"../shell\";\n\nexport interface UserProfileProps {\n layoutId: string;\n loginUrl?: string;\n onNavigate: (id: string) => void;\n user: VuuUser;\n}\n\nexport const UserProfile = ({\n layoutId,\n loginUrl,\n onNavigate,\n user,\n}: UserProfileProps) => {\n const handleNavigate = (id: string) => {\n onNavigate(id);\n };\n\n return (\n <DropdownBase className=\"vuuUserProfile\" placement=\"bottom-end\">\n <Button variant=\"secondary\">\n <UserSolidIcon />\n </Button>\n <UserPanel\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={handleNavigate}\n user={user}\n />\n </DropdownBase>\n );\n};\n", "import { formatDate } from \"@vuu-ui/vuu-utils\";\nimport { List, ListItem, ListItemProps } from \"@heswell/salt-lab\";\nimport { Button } from \"@salt-ds/core\";\nimport { ExportIcon } from \"@salt-ds/icons\";\nimport {\n ForwardedRef,\n forwardRef,\n HTMLAttributes,\n useCallback,\n useEffect,\n useState,\n} from \"react\";\nimport { getLayoutHistory, LayoutHistoryItem } from \"../get-layout-history\";\nimport { logout } from \"../login\";\nimport { VuuUser } from \"../shell\";\n\nimport \"./UserPanel.css\";\n\nconst byLastUpdate = (\n { lastUpdate: l1 }: LayoutHistoryItem,\n { lastUpdate: l2 }: LayoutHistoryItem\n) => {\n return l2 === l1 ? 0 : l2 < l1 ? -1 : 1;\n};\n\ntype HistoryEntry = {\n id: string;\n label: string;\n lastUpdate: number;\n};\n\nconst HistoryListItem = (props: ListItemProps<HistoryEntry>) => {\n return <ListItem {...props} />;\n};\n\nexport interface UserPanelProps extends HTMLAttributes<HTMLDivElement> {\n loginUrl?: string;\n onNavigate: (id: string) => void;\n user: VuuUser;\n layoutId: string;\n}\n\nexport const UserPanel = forwardRef(function UserPanel(\n { loginUrl, onNavigate, user, layoutId = \"latest\" }: UserPanelProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const [history, setHistory] = useState<HistoryEntry[]>([]);\n\n useEffect(() => {\n async function getHistory() {\n const history = await getLayoutHistory(user);\n const sortedHistory = history\n .filter((item) => item.id !== \"latest\")\n .sort(byLastUpdate)\n .map<HistoryEntry>(({ id, lastUpdate }) => ({\n lastUpdate,\n id,\n label: `Saved at ${formatDate(new Date(lastUpdate), \"kk:mm:ss\")}`,\n }));\n console.log({ sortedHistory });\n setHistory(sortedHistory);\n }\n\n getHistory();\n }, [user]);\n\n const handleHisorySelected = useCallback(\n (evt, selected) => {\n if (selected) {\n onNavigate(selected.id);\n }\n },\n [onNavigate]\n );\n\n const handleLogout = useCallback(() => {\n logout(loginUrl);\n }, [loginUrl]);\n\n const selected =\n history.length === 0\n ? null\n : layoutId === \"latest\"\n ? history[0]\n : history.find((i) => i.id === layoutId);\n\n return (\n <div className=\"vuuUserPanel\" ref={forwardedRef}>\n <List<HistoryEntry>\n ListItem={HistoryListItem}\n className=\"vuuUserPanel-history\"\n onSelect={handleHisorySelected}\n selected={selected}\n source={history}\n />\n <div className=\"vuuUserPanel-buttonBar\">\n <Button aria-label=\"logout\" onClick={handleLogout}>\n <ExportIcon /> Logout\n </Button>\n </div>\n </div>\n );\n});\n", "import { VuuUser } from \"./shell\";\n\nexport interface LayoutHistoryItem {\n user: string;\n id: string;\n uniqueId: string;\n lastUpdate: number;\n}\n\nexport const getLayoutHistory = async (\n user: VuuUser\n): Promise<LayoutHistoryItem[]> => {\n const history = await fetch(`api/vui/${user.username}`, {})\n .then((response) => {\n return response.ok ? response.json() : null;\n })\n .catch(() => {\n // TODO we should set a layout with a warning here\n console.log(`error getting history`);\n });\n\n return history;\n};\n", "import {\n ToggleButton,\n ToggleButtonGroup,\n ToggleButtonGroupChangeEventHandler,\n} from \"@heswell/salt-lab\";\nimport cx from \"classnames\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\n\nexport type ThemeMode = \"light\" | \"dark\";\n\nexport interface ThemeSwitchProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultMode?: ThemeMode;\n mode?: ThemeMode;\n onChange: (mode: ThemeMode) => void;\n}\n\nconst modes: ThemeMode[] = [\"light\", \"dark\"];\n\nexport const ThemeSwitch = ({\n className: classNameProp,\n defaultMode: defaultModeProp,\n mode: modeProp,\n onChange,\n ...htmlAttributes\n}: ThemeSwitchProps) => {\n const [mode, setMode] = useControlled<ThemeMode>({\n controlled: modeProp,\n default: defaultModeProp ?? \"light\",\n name: \"ThemeSwitch\",\n state: \"mode\",\n });\n\n const selectedIndex = modes.indexOf(mode);\n\n const handleChangeSecondary: ToggleButtonGroupChangeEventHandler =\n useCallback(\n (_evt, index) => {\n const mode = modes[index];\n setMode(mode);\n onChange(mode);\n },\n [onChange, setMode]\n );\n const className = cx(classBase, classNameProp);\n return (\n <ToggleButtonGroup\n className={className}\n {...htmlAttributes}\n onChange={handleChangeSecondary}\n selectedIndex={selectedIndex}\n >\n <ToggleButton\n aria-label=\"alert\"\n tooltipText=\"Light Theme\"\n data-icon=\"light\"\n />\n <ToggleButton\n aria-label=\"home\"\n tooltipText=\"Dark Theme\"\n data-icon=\"dark\"\n />\n </ToggleButtonGroup>\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["src_exports", "__export", "Feature", "LoginPanel", "Shell", "ShellContextProvider", "ThemeSwitch", "getAuthDetailsFromCookies", "logout", "redirectToLogin", "useShellContext", "__toCommonJS", "import_react", "import_vuu_layout", "import_react", "import_jsx_runtime", "ErrorBoundary", "React", "props", "error", "errorInfo", "import_jsx_runtime", "Loader", "importCSS", "path", "container", "x", "import_jsx_runtime", "RawFeature", "url", "css", "params", "props", "importCSS", "styleSheet", "LazyFeature", "React", "ErrorBoundary", "Loader", "Feature", "import_react", "import_core", "import_salt_lab", "import_jsx_runtime", "classBase", "LoginPanel", "onSubmit", "username", "setUserName", "password", "setPassword", "login", "handleUsername", "_event", "value", "handlePassword", "dataIsValid", "getCookieValue", "name", "_a", "row", "getAuthDetailsFromCookies", "username", "token", "redirectToLogin", "loginUrl", "logout", "import_vuu_data", "import_react", "import_react", "useLayoutConfig", "user", "defaultLayout", "layout", "_setLayout", "setLayout", "load", "id", "response", "saveData", "data", "loadLayoutById", "use_layout_config_default", "import_react", "import_jsx_runtime", "defaultConfig", "ShellContext", "Provider", "children", "context", "inheritedContext", "mergedContext", "ShellContextProvider", "value", "useShellContext", "import_classnames", "import_vuu_layout", "import_react", "import_core", "import_salt_lab", "import_icons", "import_vuu_utils", "import_salt_lab", "import_core", "import_icons", "import_react", "getLayoutHistory", "user", "response", "import_jsx_runtime", "byLastUpdate", "l1", "l2", "HistoryListItem", "props", "UserPanel", "loginUrl", "onNavigate", "user", "layoutId", "forwardedRef", "history", "setHistory", "getHistory", "sortedHistory", "getLayoutHistory", "item", "id", "lastUpdate", "handleHisorySelected", "evt", "selected", "handleLogout", "logout", "i", "import_jsx_runtime", "UserProfile", "layoutId", "loginUrl", "onNavigate", "user", "UserPanel", "id", "import_salt_lab", "import_classnames", "import_core", "import_react", "import_jsx_runtime", "classBase", "modes", "ThemeSwitch", "classNameProp", "defaultModeProp", "modeProp", "onChange", "htmlAttributes", "mode", "setMode", "selectedIndex", "handleChangeSecondary", "_evt", "index", "className", "cx", "import_classnames", "import_jsx_runtime", "classBase", "AppHeader", "classNameProp", "layoutId", "loginUrl", "onNavigate", "onSwitchTheme", "themeMode", "user", "htmlAttributes", "className", "cx", "handleSwitchTheme", "mode", "ThemeSwitch", "UserProfile", "import_jsx_runtime", "warningLayout", "Shell", "children", "classNameProp", "defaultLayout", "leftSidePanel", "loginUrl", "serverUrl", "user", "htmlAttributes", "rootRef", "density", "paletteView", "open", "setOpen", "layoutId", "layout", "setLayoutConfig", "loadLayoutById", "use_layout_config_default", "handleLayoutChange", "handleSwitchTheme", "mode", "handleDrawerClick", "e", "_a", "target", "handleNavigate", "id", "getDrawers", "drawers", "className", "cx", "ShellContextProvider", "AppHeader"]
|
|
7
7
|
}
|
package/esm/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import D,{Suspense as
|
|
1
|
+
import D,{Suspense as he}from"react";import{registerComponent as ge}from"@vuu-ui/vuu-layout";import ue from"react";import{Fragment as ce,jsx as U,jsxs as de}from"react/jsx-runtime";var x=class extends ue.Component{constructor(e){super(e),this.state={errorMessage:null}}static getDerivedStateFromError(e){return{errorMessage:e.message}}componentDidCatch(e,o){console.log(e,o)}render(){return this.state.errorMessage?de(ce,{children:[U("h1",{children:"Something went wrong."}),U("p",{children:this.state.errorMessage})]}):this.props.children}};import{jsx as pe}from"react/jsx-runtime";var k=()=>pe("div",{className:"hwLoader",children:"loading"});var E=async t=>{let e=new CSSStyleSheet;return fetch(t).then(o=>o.text()).then(o=>e.replace(o))};import{jsx as C}from"react/jsx-runtime";function fe({url:t,css:e,params:o,...r}){e&&E(e).then(n=>{document.adoptedStyleSheets=[...document.adoptedStyleSheets,n]});let s=D.lazy(()=>import(t));return C(x,{children:C(he,{fallback:C(k,{}),children:C(s,{...r,...o})})})}var I=D.memo(fe);I.displayName="Feature";ge("Feature",I,"view");import{useState as R}from"react";import{Button as ye}from"@salt-ds/core";import{FormField as B,Input as F}from"@heswell/salt-lab";import{jsx as v,jsxs as ve}from"react/jsx-runtime";var A="vuuLoginPanel",Nt=({onSubmit:t})=>{let[e,o]=R(""),[r,s]=R(""),n=()=>{t(e,r)},a=(l,u)=>{o(u)},m=(l,u)=>{s(u)},i=e.trim()!==""&&r.trim()!=="";return ve("div",{className:A,children:[v(B,{label:"Username",style:{width:200},children:v(F,{value:e,id:"text-username",onChange:a})}),v(B,{label:"Password",style:{width:200},children:v(F,{type:"password",value:r,id:"text-password",onChange:m})}),v(ye,{className:`${A}-login`,disabled:!i,onClick:n,variant:"cta",children:"Login"})]})};var V=t=>{var e;return(e=document.cookie.split("; ").find(o=>o.startsWith(`${t}=`)))==null?void 0:e.split("=")[1]},Et=()=>{let t=V("vuu-username"),e=V("vuu-auth-token");return[t,e]},xe=(t="/login.html")=>{window.location.href=t},O=t=>{document.cookie="vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT",document.cookie="vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT",xe(t)};import{connectToServer as Ye}from"@vuu-ui/vuu-data";import{useCallback as H,useEffect as Ze,useRef as M,useState as ee}from"react";import{useCallback as P,useEffect as Ce,useState as Le}from"react";var Pe=(t,e)=>{let[o,r]=Le(e),s=i=>{r(i)},n=P(async(i="latest")=>{fetch(`api/vui/${t.username}/${i}`,{}).then(l=>l.ok?l.json():e).then(s).catch(()=>{s(e)})},[e,t.username]);Ce(()=>{n()},[n]);let a=P(i=>{fetch(`api/vui/${t.username}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(i)}).then(l=>l.ok?l.json():e)},[e,t]),m=P(i=>{n(i)},[n]);return[o,a,m]},$=Pe;import{createContext as Se,useContext as Te}from"react";import{jsx as S}from"react/jsx-runtime";var we={},T=Se(we),He=({children:t,context:e,inheritedContext:o})=>{let r={...o,...e};return S(T.Provider,{value:r,children:t})},G=({children:t,value:e})=>S(T.Consumer,{children:o=>S(He,{context:e,inheritedContext:o,children:t})}),Gt=()=>Te(T);import je from"classnames";import{Chest as et,DraggableLayout as te,Drawer as tt,Flexbox as ot,LayoutProvider as rt,View as nt}from"@vuu-ui/vuu-layout";import{useCallback as We}from"react";import{Button as Fe}from"@salt-ds/core";import{DropdownBase as Ae}from"@heswell/salt-lab";import{UserSolidIcon as Ve}from"@salt-ds/icons";import{formatDate as Me}from"@vuu-ui/vuu-utils";import{List as be,ListItem as Ne}from"@heswell/salt-lab";import{Button as Ue}from"@salt-ds/core";import{ExportIcon as ke}from"@salt-ds/icons";import{forwardRef as Ee,useCallback as _,useEffect as De,useState as Ie}from"react";var J=async t=>await fetch(`api/vui/${t.username}`,{}).then(o=>o.ok?o.json():null).catch(()=>{console.log("error getting history")});import{jsx as L,jsxs as z}from"react/jsx-runtime";var Re=({lastUpdate:t},{lastUpdate:e})=>e===t?0:e<t?-1:1,Be=t=>L(Ne,{...t}),q=Ee(function({loginUrl:e,onNavigate:o,user:r,layoutId:s="latest"},n){let[a,m]=Ie([]);De(()=>{async function d(){let g=(await J(r)).filter(f=>f.id!=="latest").sort(Re).map(({id:f,lastUpdate:y})=>({lastUpdate:y,id:f,label:`Saved at ${Me(new Date(y),"kk:mm:ss")}`}));console.log({sortedHistory:g}),m(g)}d()},[r]);let i=_((d,p)=>{p&&o(p.id)},[o]),l=_(()=>{O(e)},[e]),u=a.length===0?null:s==="latest"?a[0]:a.find(d=>d.id===s);return z("div",{className:"vuuUserPanel",ref:n,children:[L(be,{ListItem:Be,className:"vuuUserPanel-history",onSelect:i,selected:u,source:a}),L("div",{className:"vuuUserPanel-buttonBar",children:z(Ue,{"aria-label":"logout",onClick:l,children:[L(ke,{})," Logout"]})})]})});import{jsx as w,jsxs as Oe}from"react/jsx-runtime";var W=({layoutId:t,loginUrl:e,onNavigate:o,user:r})=>Oe(Ae,{className:"vuuUserProfile",placement:"bottom-end",children:[w(Fe,{variant:"secondary",children:w(Ve,{})}),w(q,{layoutId:t,loginUrl:e,onNavigate:n=>{o(n)},user:r})]});import{ToggleButton as K,ToggleButtonGroup as $e}from"@heswell/salt-lab";import Ge from"classnames";import{useControlled as Je}from"@salt-ds/core";import{useCallback as _e}from"react";import{jsx as X,jsxs as qe}from"react/jsx-runtime";var ze="vuuThemeSwitch",Q=["light","dark"],Y=({className:t,defaultMode:e,mode:o,onChange:r,...s})=>{let[n,a]=Je({controlled:o,default:e!=null?e:"light",name:"ThemeSwitch",state:"mode"}),m=Q.indexOf(n),i=_e((u,d)=>{let p=Q[d];a(p),r(p)},[r,a]),l=Ge(ze,t);return qe($e,{className:l,...s,onChange:i,selectedIndex:m,children:[X(K,{"aria-label":"alert",tooltipText:"Light Theme","data-icon":"light"}),X(K,{"aria-label":"home",tooltipText:"Dark Theme","data-icon":"dark"})]})};import Ke from"classnames";import{jsx as Z,jsxs as Xe}from"react/jsx-runtime";var Qe="vuuAppHeader",j=({className:t,layoutId:e,loginUrl:o,onNavigate:r,onSwitchTheme:s,themeMode:n="light",user:a,...m})=>{let i=Ke(Qe,t,"salt-density-medium"),l=We(u=>s==null?void 0:s(u),[s]);return Xe("header",{className:i,...m,children:[Z(Y,{defaultMode:n,onChange:l}),Z(W,{layoutId:e,loginUrl:o,onNavigate:r,user:a})]})};import{jsx as h,jsxs as oe}from"react/jsx-runtime";var st={type:"View",props:{style:{height:"calc(100% - 6px)"}},children:[{props:{className:"vuuShell-warningPlaceholder"},type:"Placeholder"}]},ar=({children:t,className:e,defaultLayout:o=st,leftSidePanel:r,loginUrl:s,serverUrl:n,user:a,...m})=>{let i=M(null),[l]=ee("high"),u=M(null),[d,p]=ee(!1),g=M("latest"),[f,y,b]=$(a,o),re=H(c=>{y(c)},[y]),ne=H(c=>{i.current&&(i.current.dataset.mode=c)},[]),se=c=>{var N;let me=c.target;(N=u.current)!=null&&N.contains(me)||p(!d)},ae=H(c=>{g.current=c,b(c)},[b]);Ze(()=>{n&&a.token&&Ye(n,a.token)},[n,a.token]);let ie=()=>{let c=[];return r&&c.push(h(tt,{onClick:se,open:d,position:"left",inline:!0,peekaboo:!0,sizeOpen:200,toggleButton:"end",children:h(nt,{className:"vuuShell-palette",id:"vw-app-palette",ref:u,style:{height:"100%"},children:r},"app-palette")},"left-panel")),c},le=je("vuuShell",e,"salt-theme",`salt-density-${l}`);return oe(G,{value:void 0,children:[h(rt,{layout:f,onLayoutChange:re,children:h(te,{className:le,"data-mode":"light",ref:i,...m,children:oe(ot,{className:"App",style:{flexDirection:"column",height:"100%",width:"100%"},children:[h(j,{layoutId:g.current,loginUrl:s,user:a,onNavigate:ae,onSwitchTheme:ne}),h(et,{style:{flex:1},children:ie().concat(h(te,{dropTarget:!0,style:{width:"100%",height:"100%"}},"main-content"))})]})})}),t]})};export{I as Feature,Nt as LoginPanel,ar as Shell,G as ShellContextProvider,Y as ThemeSwitch,Et as getAuthDetailsFromCookies,O as logout,xe as redirectToLogin,Gt as useShellContext};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../packages/vuu-shell/src/feature/Feature.tsx", "../../../packages/vuu-shell/src/feature/ErrorBoundary.jsx", "../../../packages/vuu-shell/src/feature/Loader.tsx", "../../../packages/vuu-shell/src/feature/css-module-loader.ts", "../../../packages/vuu-shell/src/login/LoginPanel.tsx", "../../../packages/vuu-shell/src/login/login-utils.ts", "../../../packages/vuu-shell/src/shell.tsx", "../../../packages/vuu-shell/src/use-layout-config.js", "../../../packages/vuu-shell/src/ShellContextProvider.tsx", "../../../packages/vuu-shell/src/app-header/AppHeader.tsx", "../../../packages/vuu-shell/src/user-profile/UserProfile.tsx", "../../../packages/vuu-shell/src/user-profile/UserPanel.tsx", "../../../packages/vuu-shell/src/get-layout-history.
|
|
4
|
-
"sourcesContent": ["import React, { Suspense } from \"react\";\nimport { registerComponent } from \"@vuu-ui/vuu-layout\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { Loader } from \"./Loader\";\nimport { importCSS } from \"./css-module-loader\";\n\nexport interface FeatureProps<Params extends object | undefined = undefined> {\n height?: number;\n url: string;\n css?: string;\n width?: number;\n params: Params;\n}\n\n// const RawFeature = <Params extends object | undefined>({\nfunction RawFeature<Params extends object | undefined>({\n url,\n css,\n params,\n ...props\n}: FeatureProps<Params>) {\n if (css) {\n // import(/* @vite-ignore */ css, { assert: { type: \"css\" } }).then(\n // (cssModule) => {\n // document.adoptedStyleSheets = [\n // ...document.adoptedStyleSheets,\n // cssModule.default,\n // ];\n // }\n // );\n // Polyfill until vite build supports import assertions\n // Note: already fully supported in esbuild, so vite dev\n importCSS(css).then((styleSheet) => {\n document.adoptedStyleSheets = [\n ...document.adoptedStyleSheets,\n styleSheet,\n ];\n });\n }\n const LazyFeature = React.lazy(() => import(/* @vite-ignore */ url));\n return (\n <ErrorBoundary>\n <Suspense fallback={<Loader />}>\n <LazyFeature {...props} {...params} />\n </Suspense>\n </ErrorBoundary>\n );\n}\n\nexport const Feature = React.memo(RawFeature);\nFeature.displayName = \"Feature\";\nregisterComponent(\"Feature\", Feature, \"view\");\n", "import React from 'react';\n// TODO\nexport class ErrorBoundary extends React.Component {\n constructor(props) {\n super(props);\n this.state = { errorMessage: null };\n }\n\n static getDerivedStateFromError(error) {\n // Update state so the next render will show the fallback UI.\n return { errorMessage: error.message };\n }\n\n componentDidCatch(error, errorInfo) {\n // You can also log the error to an error reporting service\n console.log(error, errorInfo);\n }\n\n render() {\n if (this.state.errorMessage) {\n return (\n <>\n <h1>Something went wrong.</h1>\n <p>{this.state.errorMessage}</p>\n </>\n );\n }\n\n return this.props.children;\n }\n}\n", "// TODO\nexport const Loader = () => <div className=\"hwLoader\">loading</div>;\n", "export const importCSS = async (path: string) => {\n const container = new CSSStyleSheet();\n return fetch(path)\n .then((x) => x.text())\n .then((x) => container.replace(x));\n};\n", "import { ChangeEvent, HTMLAttributes, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { FormField, Input } from \"@heswell/salt-lab\";\n\nimport \"./LoginPanel.css\";\n\nconst classBase = \"vuuLoginPanel\";\n\nexport interface LoginPanelProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onSubmit\"> {\n onSubmit: (username: string, password: string) => void;\n}\n\nexport const LoginPanel = ({ onSubmit }: LoginPanelProps) => {\n const [username, setUserName] = useState(\"\");\n const [password, setPassword] = useState(\"\");\n\n const login = () => {\n onSubmit(username, password);\n };\n\n const handleUsername = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setUserName(value);\n };\n\n const handlePassword = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setPassword(value);\n };\n\n const dataIsValid = username.trim() !== \"\" && password.trim() !== \"\";\n\n return (\n <div className={classBase}>\n <FormField label=\"Username\" style={{ width: 200 }}>\n <Input value={username} id=\"text-username\" onChange={handleUsername} />\n </FormField>\n\n <FormField label=\"Password\" style={{ width: 200 }}>\n <Input\n type=\"password\"\n value={password}\n id=\"text-password\"\n onChange={handlePassword}\n />\n </FormField>\n\n <Button\n className={`${classBase}-login`}\n disabled={!dataIsValid}\n onClick={login}\n variant=\"cta\"\n >\n Login\n </Button>\n </div>\n );\n};\n", "const getCookieValue = (name: string) =>\n document.cookie\n .split(\"; \")\n .find((row) => row.startsWith(`${name}=`))\n ?.split(\"=\")[1];\n\nexport const getAuthDetailsFromCookies = () => {\n const username = getCookieValue(\"vuu-username\");\n const token = getCookieValue(\"vuu-auth-token\");\n return [username, token];\n};\n\nexport const redirectToLogin = (loginUrl = \"/login.html\") => {\n window.location.href = loginUrl;\n};\n\nexport const logout = (loginUrl?: string) => {\n document.cookie = \"vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n document.cookie = \"vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n redirectToLogin(loginUrl);\n};\n", "import { connectToServer } from \"@vuu-ui/vuu-data\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport useLayoutConfig from \"./use-layout-config\";\nimport { ShellContextProvider } from \"./ShellContextProvider\";\nimport cx from \"classnames\";\n\nimport {\n Chest,\n DraggableLayout,\n Drawer,\n FlexboxLayout as Flexbox,\n LayoutProvider,\n View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { AppHeader } from \"./app-header\";\n// import { AppPalette } from \"./app-palette\";\n\nimport { LayoutJSON } from \"@vuu-ui/vuu-layout/src/layout-reducer\";\nimport \"./shell.css\";\nimport { ThemeMode } from \"./theme-switch\";\n\nexport type VuuUser = {\n username: string;\n token: string;\n};\n\nconst warningLayout = {\n type: \"View\",\n props: {\n style: { height: \"calc(100% - 6px)\" },\n },\n children: [\n {\n props: {\n className: \"vuuShell-warningPlaceholder\",\n },\n type: \"Placeholder\",\n },\n ],\n};\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n defaultLayout?: LayoutJSON;\n leftSidePanel?: ReactElement;\n loginUrl?: string;\n // paletteConfig: any;\n serverUrl?: string;\n user: VuuUser;\n}\n\nexport const Shell = ({\n children,\n className: classNameProp,\n defaultLayout = warningLayout,\n leftSidePanel,\n loginUrl,\n serverUrl,\n user,\n ...htmlAttributes\n}: ShellProps) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const [density] = useState<\"high\" | \"medium\" | \"low\" | \"touch\">(\"high\");\n const paletteView = useRef<HTMLDivElement>(null);\n const [open, setOpen] = useState(false);\n const layoutId = useRef(\"latest\");\n\n const [layout, setLayoutConfig, loadLayoutById] = useLayoutConfig(\n user,\n defaultLayout\n );\n\n const handleLayoutChange = useCallback(\n (layout) => {\n setLayoutConfig(layout);\n },\n [setLayoutConfig]\n );\n\n const handleSwitchTheme = useCallback((mode: ThemeMode) => {\n if (rootRef.current) {\n rootRef.current.dataset.mode = mode;\n }\n }, []);\n\n const handleDrawerClick = (e: MouseEvent<HTMLElement>) => {\n const target = e.target as HTMLElement;\n if (!paletteView.current?.contains(target)) {\n setOpen(!open);\n }\n };\n\n const handleNavigate = useCallback(\n (id) => {\n layoutId.current = id;\n loadLayoutById(id);\n },\n [loadLayoutById]\n );\n\n useEffect(() => {\n if (serverUrl && user.token) {\n connectToServer(serverUrl, user.token);\n }\n }, [serverUrl, user.token]);\n\n const getDrawers = () => {\n const drawers: ReactElement[] = [];\n if (leftSidePanel) {\n drawers.push(\n <Drawer\n key=\"left-panel\"\n onClick={handleDrawerClick}\n open={open}\n position=\"left\"\n inline\n peekaboo\n sizeOpen={200}\n toggleButton=\"end\"\n >\n <View\n className=\"vuuShell-palette\"\n id=\"vw-app-palette\"\n key=\"app-palette\"\n ref={paletteView}\n style={{ height: \"100%\" }}\n >\n {leftSidePanel}\n </View>\n </Drawer>\n );\n }\n\n return drawers;\n };\n\n const className = cx(\n \"vuuShell\",\n classNameProp,\n \"salt-theme\",\n `salt-density-${density}`\n );\n\n return (\n // ShellContext TBD\n <ShellContextProvider value={undefined}>\n <LayoutProvider layout={layout} onLayoutChange={handleLayoutChange}>\n <DraggableLayout\n className={className}\n data-mode=\"light\"\n ref={rootRef}\n {...htmlAttributes}\n >\n <Flexbox\n className=\"App\"\n style={{ flexDirection: \"column\", height: \"100%\", width: \"100%\" }}\n >\n <AppHeader\n layoutId={layoutId.current}\n loginUrl={loginUrl}\n user={user}\n onNavigate={handleNavigate}\n onSwitchTheme={handleSwitchTheme}\n />\n <Chest style={{ flex: 1 }}>\n {getDrawers().concat(\n <DraggableLayout\n dropTarget\n key=\"main-content\"\n style={{ width: \"100%\", height: \"100%\" }}\n />\n )}\n </Chest>\n </Flexbox>\n </DraggableLayout>\n </LayoutProvider>\n {children}\n </ShellContextProvider>\n );\n};\n", "import { useCallback, useEffect, useState } from \"react\";\n\nconst useLayoutConfig = (user, defaultLayout) => {\n const [layout, _setLayout] = useState(defaultLayout);\n\n const setLayout = (layout) => {\n _setLayout(layout);\n };\n\n const load = useCallback(\n async (id = \"latest\") => {\n fetch(`api/vui/${user.username}/${id}`, {})\n .then((response) => {\n return response.ok ? response.json() : defaultLayout;\n })\n .then(setLayout)\n .catch(() => {\n // TODO we should set a layout with a warning here\n setLayout(defaultLayout);\n });\n },\n [defaultLayout, user.username]\n );\n\n useEffect(() => {\n load();\n }, [load]);\n\n const saveData = useCallback(\n (data) => {\n fetch(`api/vui/${user.username}`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(data),\n }).then((response) => {\n return response.ok ? response.json() : defaultLayout;\n });\n // .then((data) => console.log(data));\n },\n [defaultLayout, user]\n );\n\n const loadLayoutById = useCallback(\n (id) => {\n load(id);\n },\n [load]\n );\n\n return [layout, saveData, loadLayoutById];\n};\n\nexport default useLayoutConfig;\n", "import { MenuRpcResponse } from \"@vuu-ui/vuu-data\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-datagrid-types\";\nimport { createContext, ReactElement, ReactNode, useContext } from \"react\";\n\nexport interface ShellContextProps {\n getDefaultColumnConfig?: (\n tableName: string,\n columnName: string\n ) => Partial<ColumnDescriptor>;\n handleRpcResponse?: (response?: MenuRpcResponse) => void;\n}\n\nconst defaultConfig = {};\n\nconst ShellContext = createContext<ShellContextProps>(defaultConfig);\n\nexport interface ShellProviderProps {\n children: ReactNode;\n value: ShellContextProps;\n}\n\nconst Provider = ({\n children,\n context,\n inheritedContext,\n}: {\n children: ReactNode;\n context?: ShellContextProps;\n inheritedContext?: ShellContextProps;\n}) => {\n // TODO functions provided at multiple levels must be merged\n const mergedContext = {\n ...inheritedContext,\n ...context,\n };\n return (\n <ShellContext.Provider value={mergedContext}>\n {children}\n </ShellContext.Provider>\n );\n};\n\nexport const ShellContextProvider = ({\n children,\n value,\n}: ShellProviderProps): ReactElement => {\n return (\n <ShellContext.Consumer>\n {(context) => (\n <Provider context={value} inheritedContext={context}>\n {children}\n </Provider>\n )}\n </ShellContext.Consumer>\n );\n};\n\nexport const useShellContext = () => {\n return useContext(ShellContext);\n};\n", "import { HTMLAttributes, useCallback } from \"react\";\nimport { VuuUser } from \"../shell\";\nimport { UserProfile } from \"../user-profile\";\nimport { ThemeMode, ThemeSwitch } from \"../theme-switch\";\nimport cx from \"classnames\";\n\nimport \"./AppHeader.css\";\n\nconst classBase = \"vuuAppHeader\";\nexport interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {\n layoutId: string;\n loginUrl?: string;\n onNavigate: (id: string) => void;\n onSwitchTheme?: (mode: ThemeMode) => void;\n themeMode?: ThemeMode;\n user: VuuUser;\n}\n\nexport const AppHeader = ({\n className: classNameProp,\n layoutId,\n loginUrl,\n onNavigate,\n onSwitchTheme,\n themeMode = \"light\",\n user,\n ...htmlAttributes\n}: AppHeaderProps) => {\n const className = cx(classBase, classNameProp, \"salt-density-medium\");\n const handleSwitchTheme = useCallback(\n (mode: ThemeMode) => onSwitchTheme?.(mode),\n [onSwitchTheme]\n );\n return (\n <header className={className} {...htmlAttributes}>\n <ThemeSwitch defaultMode={themeMode} onChange={handleSwitchTheme} />\n <UserProfile\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={onNavigate}\n user={user}\n />\n </header>\n );\n};\n", "import React, { useCallback, useRef, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { DropdownBase } from \"@heswell/salt-lab\";\nimport { UserSolidIcon } from \"@salt-ds/icons\";\nimport { UserPanel } from \"./UserPanel\";\n\nimport \"./UserProfile.css\";\n\nexport const UserProfile = ({ layoutId, loginUrl, onNavigate, user }) => {\n const [open, setOpen] = useState(false);\n const openRef = useRef(false);\n const buttonRef = useRef(null);\n\n const toggle = useCallback(() => {\n setOpen((isOpen) => {\n return (openRef.current = !isOpen);\n });\n requestAnimationFrame(() => {\n if (!openRef.current) {\n requestAnimationFrame(() => {\n buttonRef.current.focus();\n });\n }\n });\n }, []);\n\n const handleNavigate = (id) => {\n setOpen(false);\n onNavigate(id);\n };\n\n return (\n <DropdownBase\n className=\"vuuUserProfile\"\n placement=\"bottom-end\"\n onCancel={toggle}\n >\n <Button ref={buttonRef} variant=\"secondary\">\n <UserSolidIcon />\n </Button>\n <UserPanel\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={handleNavigate}\n user={user}\n />\n </DropdownBase>\n );\n};\n", "import React, { forwardRef, useCallback, useEffect, useState } from \"react\";\nimport { formatDate } from \"@vuu-ui/vuu-utils\";\nimport { logout } from \"../login\";\nimport { getLayoutHistory } from \"../get-layout-history\";\nimport { ExportIcon } from \"@salt-ds/icons\";\nimport { Button } from \"@salt-ds/core\";\nimport { List, ListItem } from \"@heswell/salt-lab\";\n\nimport \"./UserPanel.css\";\n\nconst byLastUpdate = ({ lastUpdate: l1 }, { lastUpdate: l2 }) => {\n return l2 === l1 ? 0 : l2 < l1 ? -1 : 1;\n};\n\nconst HistoryListItem = (props) => {\n return <ListItem {...props} />;\n};\n\nexport const UserPanel = forwardRef(function UserPanel(\n { loginUrl, onNavigate, user, layoutId = \"latest\" },\n forwardedRef\n) {\n const [history, setHistory] = useState([]);\n\n useEffect(() => {\n async function getHistory() {\n const history = await getLayoutHistory(user);\n console.log({ history });\n const sortedHistory = history\n .filter((item) => item.id !== \"latest\")\n .sort(byLastUpdate)\n .map(({ id, lastUpdate }) => ({\n lastUpdate,\n id,\n label: `Saved at ${formatDate(new Date(lastUpdate), \"kk:mm:ss\")}`,\n }));\n console.log({ sortedHistory });\n setHistory(sortedHistory);\n }\n\n getHistory();\n }, [user]);\n\n const handleHisorySelected = useCallback(\n (evt, selected) => {\n if (selected) {\n onNavigate(selected.id);\n }\n },\n [onNavigate]\n );\n\n const handleLogout = useCallback(() => {\n logout(loginUrl);\n }, [loginUrl]);\n\n const selected =\n history.length === 0\n ? []\n : layoutId === \"latest\"\n ? history[0]\n : history.find((i) => i.id === layoutId);\n console.log({ selected });\n\n return (\n <div className=\"vuuUserPanel\" ref={forwardedRef}>\n <List\n ListItem={HistoryListItem}\n className=\"vuuUserPanel-history\"\n onSelect={handleHisorySelected}\n selected={selected}\n source={history}\n />\n <div className=\"vuuUserPanel-buttonBar\">\n <Button aria-label=\"logout\" onClick={handleLogout}>\n <ExportIcon /> Logout\n </Button>\n </div>\n </div>\n );\n});\n", "export const getLayoutHistory = async (user) => {\n const history = await fetch(`api/vui/${user.username}`, {})\n .then((response) => {\n return response.ok ? response.json() : null;\n })\n .catch(() => {\n // TODO we should set a layout with a warning here\n console.log(`error getting history`);\n });\n\n return history;\n};\n", "import {\n ToggleButton,\n ToggleButtonGroup,\n ToggleButtonGroupChangeEventHandler,\n} from \"@heswell/salt-lab\";\nimport cx from \"classnames\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\n\nexport type ThemeMode = \"light\" | \"dark\";\n\nexport interface ThemeSwitchProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultMode?: ThemeMode;\n mode?: ThemeMode;\n onChange: (mode: ThemeMode) => void;\n}\n\nconst modes: ThemeMode[] = [\"light\", \"dark\"];\n\nexport const ThemeSwitch = ({\n className: classNameProp,\n defaultMode: defaultModeProp,\n mode: modeProp,\n onChange,\n ...htmlAttributes\n}: ThemeSwitchProps) => {\n const [mode, setMode] = useControlled<ThemeMode>({\n controlled: modeProp,\n default: defaultModeProp ?? \"light\",\n name: \"ThemeSwitch\",\n state: \"mode\",\n });\n\n const selectedIndex = modes.indexOf(mode);\n\n const handleChangeSecondary: ToggleButtonGroupChangeEventHandler =\n useCallback(\n (_evt, index) => {\n const mode = modes[index];\n setMode(mode);\n onChange(mode);\n },\n [onChange, setMode]\n );\n const className = cx(classBase, classNameProp);\n return (\n <ToggleButtonGroup\n className={className}\n {...htmlAttributes}\n onChange={handleChangeSecondary}\n selectedIndex={selectedIndex}\n >\n <ToggleButton\n aria-label=\"alert\"\n tooltipText=\"Light Theme\"\n data-icon=\"light\"\n />\n <ToggleButton\n aria-label=\"home\"\n tooltipText=\"Dark Theme\"\n data-icon=\"dark\"\n />\n </ToggleButtonGroup>\n );\n};\n"],
|
|
5
|
-
"mappings": "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
|
|
6
|
-
"names": ["React", "Suspense", "registerComponent", "React", "Fragment", "jsx", "jsxs", "ErrorBoundary", "props", "error", "errorInfo", "jsx", "Loader", "importCSS", "path", "container", "x", "jsx", "RawFeature", "url", "css", "params", "props", "importCSS", "styleSheet", "LazyFeature", "React", "ErrorBoundary", "Suspense", "Loader", "Feature", "registerComponent", "useState", "Button", "FormField", "Input", "jsx", "jsxs", "classBase", "LoginPanel", "onSubmit", "username", "setUserName", "useState", "password", "setPassword", "login", "handleUsername", "_event", "value", "handlePassword", "dataIsValid", "FormField", "Input", "Button", "getCookieValue", "name", "_a", "row", "getAuthDetailsFromCookies", "username", "token", "redirectToLogin", "loginUrl", "logout", "connectToServer", "useCallback", "useEffect", "useRef", "useState", "useCallback", "useEffect", "useState", "useLayoutConfig", "user", "defaultLayout", "layout", "_setLayout", "setLayout", "load", "id", "response", "saveData", "data", "loadLayoutById", "use_layout_config_default", "createContext", "useContext", "jsx", "defaultConfig", "ShellContext", "Provider", "children", "context", "inheritedContext", "mergedContext", "ShellContextProvider", "value", "useShellContext", "cx", "Chest", "DraggableLayout", "Drawer", "Flexbox", "LayoutProvider", "View", "useCallback", "
|
|
3
|
+
"sources": ["../../../packages/vuu-shell/src/feature/Feature.tsx", "../../../packages/vuu-shell/src/feature/ErrorBoundary.jsx", "../../../packages/vuu-shell/src/feature/Loader.tsx", "../../../packages/vuu-shell/src/feature/css-module-loader.ts", "../../../packages/vuu-shell/src/login/LoginPanel.tsx", "../../../packages/vuu-shell/src/login/login-utils.ts", "../../../packages/vuu-shell/src/shell.tsx", "../../../packages/vuu-shell/src/use-layout-config.js", "../../../packages/vuu-shell/src/ShellContextProvider.tsx", "../../../packages/vuu-shell/src/app-header/AppHeader.tsx", "../../../packages/vuu-shell/src/user-profile/UserProfile.tsx", "../../../packages/vuu-shell/src/user-profile/UserPanel.tsx", "../../../packages/vuu-shell/src/get-layout-history.ts", "../../../packages/vuu-shell/src/theme-switch/ThemeSwitch.tsx"],
|
|
4
|
+
"sourcesContent": ["import React, { Suspense } from \"react\";\nimport { registerComponent } from \"@vuu-ui/vuu-layout\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { Loader } from \"./Loader\";\nimport { importCSS } from \"./css-module-loader\";\n\nexport interface FeatureProps<Params extends object | undefined = undefined> {\n height?: number;\n url: string;\n css?: string;\n width?: number;\n params: Params;\n}\n\n// const RawFeature = <Params extends object | undefined>({\nfunction RawFeature<Params extends object | undefined>({\n url,\n css,\n params,\n ...props\n}: FeatureProps<Params>) {\n if (css) {\n // import(/* @vite-ignore */ css, { assert: { type: \"css\" } }).then(\n // (cssModule) => {\n // document.adoptedStyleSheets = [\n // ...document.adoptedStyleSheets,\n // cssModule.default,\n // ];\n // }\n // );\n // Polyfill until vite build supports import assertions\n // Note: already fully supported in esbuild, so vite dev\n importCSS(css).then((styleSheet) => {\n document.adoptedStyleSheets = [\n ...document.adoptedStyleSheets,\n styleSheet,\n ];\n });\n }\n const LazyFeature = React.lazy(() => import(/* @vite-ignore */ url));\n return (\n <ErrorBoundary>\n <Suspense fallback={<Loader />}>\n <LazyFeature {...props} {...params} />\n </Suspense>\n </ErrorBoundary>\n );\n}\n\nexport const Feature = React.memo(RawFeature);\nFeature.displayName = \"Feature\";\nregisterComponent(\"Feature\", Feature, \"view\");\n", "import React from 'react';\n// TODO\nexport class ErrorBoundary extends React.Component {\n constructor(props) {\n super(props);\n this.state = { errorMessage: null };\n }\n\n static getDerivedStateFromError(error) {\n // Update state so the next render will show the fallback UI.\n return { errorMessage: error.message };\n }\n\n componentDidCatch(error, errorInfo) {\n // You can also log the error to an error reporting service\n console.log(error, errorInfo);\n }\n\n render() {\n if (this.state.errorMessage) {\n return (\n <>\n <h1>Something went wrong.</h1>\n <p>{this.state.errorMessage}</p>\n </>\n );\n }\n\n return this.props.children;\n }\n}\n", "// TODO\nexport const Loader = () => <div className=\"hwLoader\">loading</div>;\n", "export const importCSS = async (path: string) => {\n const container = new CSSStyleSheet();\n return fetch(path)\n .then((x) => x.text())\n .then((x) => container.replace(x));\n};\n", "import { ChangeEvent, HTMLAttributes, useState } from \"react\";\nimport { Button } from \"@salt-ds/core\";\nimport { FormField, Input } from \"@heswell/salt-lab\";\n\nimport \"./LoginPanel.css\";\n\nconst classBase = \"vuuLoginPanel\";\n\nexport interface LoginPanelProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onSubmit\"> {\n onSubmit: (username: string, password: string) => void;\n}\n\nexport const LoginPanel = ({ onSubmit }: LoginPanelProps) => {\n const [username, setUserName] = useState(\"\");\n const [password, setPassword] = useState(\"\");\n\n const login = () => {\n onSubmit(username, password);\n };\n\n const handleUsername = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setUserName(value);\n };\n\n const handlePassword = (\n _event: ChangeEvent<HTMLInputElement>,\n value: string\n ) => {\n setPassword(value);\n };\n\n const dataIsValid = username.trim() !== \"\" && password.trim() !== \"\";\n\n return (\n <div className={classBase}>\n <FormField label=\"Username\" style={{ width: 200 }}>\n <Input value={username} id=\"text-username\" onChange={handleUsername} />\n </FormField>\n\n <FormField label=\"Password\" style={{ width: 200 }}>\n <Input\n type=\"password\"\n value={password}\n id=\"text-password\"\n onChange={handlePassword}\n />\n </FormField>\n\n <Button\n className={`${classBase}-login`}\n disabled={!dataIsValid}\n onClick={login}\n variant=\"cta\"\n >\n Login\n </Button>\n </div>\n );\n};\n", "const getCookieValue = (name: string) =>\n document.cookie\n .split(\"; \")\n .find((row) => row.startsWith(`${name}=`))\n ?.split(\"=\")[1];\n\nexport const getAuthDetailsFromCookies = () => {\n const username = getCookieValue(\"vuu-username\");\n const token = getCookieValue(\"vuu-auth-token\");\n return [username, token];\n};\n\nexport const redirectToLogin = (loginUrl = \"/login.html\") => {\n window.location.href = loginUrl;\n};\n\nexport const logout = (loginUrl?: string) => {\n document.cookie = \"vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n document.cookie = \"vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT\";\n redirectToLogin(loginUrl);\n};\n", "import { connectToServer } from \"@vuu-ui/vuu-data\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport useLayoutConfig from \"./use-layout-config\";\nimport { ShellContextProvider } from \"./ShellContextProvider\";\nimport cx from \"classnames\";\n\nimport {\n Chest,\n DraggableLayout,\n Drawer,\n Flexbox,\n LayoutProvider,\n View,\n} from \"@vuu-ui/vuu-layout\";\n\nimport { AppHeader } from \"./app-header\";\n\nimport { LayoutJSON } from \"@vuu-ui/vuu-layout/src/layout-reducer\";\nimport \"./shell.css\";\nimport { ThemeMode } from \"./theme-switch\";\n\nexport type VuuUser = {\n username: string;\n token: string;\n};\n\nconst warningLayout = {\n type: \"View\",\n props: {\n style: { height: \"calc(100% - 6px)\" },\n },\n children: [\n {\n props: {\n className: \"vuuShell-warningPlaceholder\",\n },\n type: \"Placeholder\",\n },\n ],\n};\n\nexport interface ShellProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n defaultLayout?: LayoutJSON;\n leftSidePanel?: ReactElement;\n loginUrl?: string;\n // paletteConfig: any;\n serverUrl?: string;\n user: VuuUser;\n}\n\nexport const Shell = ({\n children,\n className: classNameProp,\n defaultLayout = warningLayout,\n leftSidePanel,\n loginUrl,\n serverUrl,\n user,\n ...htmlAttributes\n}: ShellProps) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const [density] = useState<\"high\" | \"medium\" | \"low\" | \"touch\">(\"high\");\n const paletteView = useRef<HTMLDivElement>(null);\n const [open, setOpen] = useState(false);\n const layoutId = useRef(\"latest\");\n\n const [layout, setLayoutConfig, loadLayoutById] = useLayoutConfig(\n user,\n defaultLayout\n );\n\n const handleLayoutChange = useCallback(\n (layout) => {\n setLayoutConfig(layout);\n },\n [setLayoutConfig]\n );\n\n const handleSwitchTheme = useCallback((mode: ThemeMode) => {\n if (rootRef.current) {\n rootRef.current.dataset.mode = mode;\n }\n }, []);\n\n const handleDrawerClick = (e: MouseEvent<HTMLElement>) => {\n const target = e.target as HTMLElement;\n if (!paletteView.current?.contains(target)) {\n setOpen(!open);\n }\n };\n\n const handleNavigate = useCallback(\n (id) => {\n layoutId.current = id;\n loadLayoutById(id);\n },\n [loadLayoutById]\n );\n\n useEffect(() => {\n if (serverUrl && user.token) {\n connectToServer(serverUrl, user.token);\n }\n }, [serverUrl, user.token]);\n\n const getDrawers = () => {\n const drawers: ReactElement[] = [];\n if (leftSidePanel) {\n drawers.push(\n <Drawer\n key=\"left-panel\"\n onClick={handleDrawerClick}\n open={open}\n position=\"left\"\n inline\n peekaboo\n sizeOpen={200}\n toggleButton=\"end\"\n >\n <View\n className=\"vuuShell-palette\"\n id=\"vw-app-palette\"\n key=\"app-palette\"\n ref={paletteView}\n style={{ height: \"100%\" }}\n >\n {leftSidePanel}\n </View>\n </Drawer>\n );\n }\n\n return drawers;\n };\n\n const className = cx(\n \"vuuShell\",\n classNameProp,\n \"salt-theme\",\n `salt-density-${density}`\n );\n\n return (\n // ShellContext TBD\n <ShellContextProvider value={undefined}>\n <LayoutProvider layout={layout} onLayoutChange={handleLayoutChange}>\n <DraggableLayout\n className={className}\n data-mode=\"light\"\n ref={rootRef}\n {...htmlAttributes}\n >\n <Flexbox\n className=\"App\"\n style={{ flexDirection: \"column\", height: \"100%\", width: \"100%\" }}\n >\n <AppHeader\n layoutId={layoutId.current}\n loginUrl={loginUrl}\n user={user}\n onNavigate={handleNavigate}\n onSwitchTheme={handleSwitchTheme}\n />\n <Chest style={{ flex: 1 }}>\n {getDrawers().concat(\n <DraggableLayout\n dropTarget\n key=\"main-content\"\n style={{ width: \"100%\", height: \"100%\" }}\n />\n )}\n </Chest>\n </Flexbox>\n </DraggableLayout>\n </LayoutProvider>\n {children}\n </ShellContextProvider>\n );\n};\n", "import { useCallback, useEffect, useState } from \"react\";\n\nconst useLayoutConfig = (user, defaultLayout) => {\n const [layout, _setLayout] = useState(defaultLayout);\n\n const setLayout = (layout) => {\n _setLayout(layout);\n };\n\n const load = useCallback(\n async (id = \"latest\") => {\n fetch(`api/vui/${user.username}/${id}`, {})\n .then((response) => {\n return response.ok ? response.json() : defaultLayout;\n })\n .then(setLayout)\n .catch(() => {\n // TODO we should set a layout with a warning here\n setLayout(defaultLayout);\n });\n },\n [defaultLayout, user.username]\n );\n\n useEffect(() => {\n load();\n }, [load]);\n\n const saveData = useCallback(\n (data) => {\n fetch(`api/vui/${user.username}`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify(data),\n }).then((response) => {\n return response.ok ? response.json() : defaultLayout;\n });\n },\n [defaultLayout, user]\n );\n\n const loadLayoutById = useCallback(\n (id) => {\n load(id);\n },\n [load]\n );\n\n return [layout, saveData, loadLayoutById];\n};\n\nexport default useLayoutConfig;\n", "import { MenuRpcResponse } from \"@vuu-ui/vuu-data\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-datagrid-types\";\nimport { createContext, ReactElement, ReactNode, useContext } from \"react\";\n\nexport interface ShellContextProps {\n getDefaultColumnConfig?: (\n tableName: string,\n columnName: string\n ) => Partial<ColumnDescriptor>;\n handleRpcResponse?: (response?: MenuRpcResponse) => void;\n}\n\nconst defaultConfig = {};\n\nconst ShellContext = createContext<ShellContextProps>(defaultConfig);\n\nexport interface ShellProviderProps {\n children: ReactNode;\n value?: ShellContextProps;\n}\n\nconst Provider = ({\n children,\n context,\n inheritedContext,\n}: {\n children: ReactNode;\n context?: ShellContextProps;\n inheritedContext?: ShellContextProps;\n}) => {\n // TODO functions provided at multiple levels must be merged\n const mergedContext = {\n ...inheritedContext,\n ...context,\n };\n return (\n <ShellContext.Provider value={mergedContext}>\n {children}\n </ShellContext.Provider>\n );\n};\n\nexport const ShellContextProvider = ({\n children,\n value,\n}: ShellProviderProps): ReactElement => {\n return (\n <ShellContext.Consumer>\n {(context) => (\n <Provider context={value} inheritedContext={context}>\n {children}\n </Provider>\n )}\n </ShellContext.Consumer>\n );\n};\n\nexport const useShellContext = () => {\n return useContext(ShellContext);\n};\n", "import { HTMLAttributes, useCallback } from \"react\";\nimport { VuuUser } from \"../shell\";\nimport { UserProfile } from \"../user-profile\";\nimport { ThemeMode, ThemeSwitch } from \"../theme-switch\";\nimport cx from \"classnames\";\n\nimport \"./AppHeader.css\";\n\nconst classBase = \"vuuAppHeader\";\nexport interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {\n layoutId: string;\n loginUrl?: string;\n onNavigate: (id: string) => void;\n onSwitchTheme?: (mode: ThemeMode) => void;\n themeMode?: ThemeMode;\n user: VuuUser;\n}\n\nexport const AppHeader = ({\n className: classNameProp,\n layoutId,\n loginUrl,\n onNavigate,\n onSwitchTheme,\n themeMode = \"light\",\n user,\n ...htmlAttributes\n}: AppHeaderProps) => {\n const className = cx(classBase, classNameProp, \"salt-density-medium\");\n const handleSwitchTheme = useCallback(\n (mode: ThemeMode) => onSwitchTheme?.(mode),\n [onSwitchTheme]\n );\n return (\n <header className={className} {...htmlAttributes}>\n <ThemeSwitch defaultMode={themeMode} onChange={handleSwitchTheme} />\n <UserProfile\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={onNavigate}\n user={user}\n />\n </header>\n );\n};\n", "import { Button } from \"@salt-ds/core\";\nimport { DropdownBase } from \"@heswell/salt-lab\";\nimport { UserSolidIcon } from \"@salt-ds/icons\";\nimport { UserPanel } from \"./UserPanel\";\n\nimport \"./UserProfile.css\";\nimport { VuuUser } from \"../shell\";\n\nexport interface UserProfileProps {\n layoutId: string;\n loginUrl?: string;\n onNavigate: (id: string) => void;\n user: VuuUser;\n}\n\nexport const UserProfile = ({\n layoutId,\n loginUrl,\n onNavigate,\n user,\n}: UserProfileProps) => {\n const handleNavigate = (id: string) => {\n onNavigate(id);\n };\n\n return (\n <DropdownBase className=\"vuuUserProfile\" placement=\"bottom-end\">\n <Button variant=\"secondary\">\n <UserSolidIcon />\n </Button>\n <UserPanel\n layoutId={layoutId}\n loginUrl={loginUrl}\n onNavigate={handleNavigate}\n user={user}\n />\n </DropdownBase>\n );\n};\n", "import { formatDate } from \"@vuu-ui/vuu-utils\";\nimport { List, ListItem, ListItemProps } from \"@heswell/salt-lab\";\nimport { Button } from \"@salt-ds/core\";\nimport { ExportIcon } from \"@salt-ds/icons\";\nimport {\n ForwardedRef,\n forwardRef,\n HTMLAttributes,\n useCallback,\n useEffect,\n useState,\n} from \"react\";\nimport { getLayoutHistory, LayoutHistoryItem } from \"../get-layout-history\";\nimport { logout } from \"../login\";\nimport { VuuUser } from \"../shell\";\n\nimport \"./UserPanel.css\";\n\nconst byLastUpdate = (\n { lastUpdate: l1 }: LayoutHistoryItem,\n { lastUpdate: l2 }: LayoutHistoryItem\n) => {\n return l2 === l1 ? 0 : l2 < l1 ? -1 : 1;\n};\n\ntype HistoryEntry = {\n id: string;\n label: string;\n lastUpdate: number;\n};\n\nconst HistoryListItem = (props: ListItemProps<HistoryEntry>) => {\n return <ListItem {...props} />;\n};\n\nexport interface UserPanelProps extends HTMLAttributes<HTMLDivElement> {\n loginUrl?: string;\n onNavigate: (id: string) => void;\n user: VuuUser;\n layoutId: string;\n}\n\nexport const UserPanel = forwardRef(function UserPanel(\n { loginUrl, onNavigate, user, layoutId = \"latest\" }: UserPanelProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const [history, setHistory] = useState<HistoryEntry[]>([]);\n\n useEffect(() => {\n async function getHistory() {\n const history = await getLayoutHistory(user);\n const sortedHistory = history\n .filter((item) => item.id !== \"latest\")\n .sort(byLastUpdate)\n .map<HistoryEntry>(({ id, lastUpdate }) => ({\n lastUpdate,\n id,\n label: `Saved at ${formatDate(new Date(lastUpdate), \"kk:mm:ss\")}`,\n }));\n console.log({ sortedHistory });\n setHistory(sortedHistory);\n }\n\n getHistory();\n }, [user]);\n\n const handleHisorySelected = useCallback(\n (evt, selected) => {\n if (selected) {\n onNavigate(selected.id);\n }\n },\n [onNavigate]\n );\n\n const handleLogout = useCallback(() => {\n logout(loginUrl);\n }, [loginUrl]);\n\n const selected =\n history.length === 0\n ? null\n : layoutId === \"latest\"\n ? history[0]\n : history.find((i) => i.id === layoutId);\n\n return (\n <div className=\"vuuUserPanel\" ref={forwardedRef}>\n <List<HistoryEntry>\n ListItem={HistoryListItem}\n className=\"vuuUserPanel-history\"\n onSelect={handleHisorySelected}\n selected={selected}\n source={history}\n />\n <div className=\"vuuUserPanel-buttonBar\">\n <Button aria-label=\"logout\" onClick={handleLogout}>\n <ExportIcon /> Logout\n </Button>\n </div>\n </div>\n );\n});\n", "import { VuuUser } from \"./shell\";\n\nexport interface LayoutHistoryItem {\n user: string;\n id: string;\n uniqueId: string;\n lastUpdate: number;\n}\n\nexport const getLayoutHistory = async (\n user: VuuUser\n): Promise<LayoutHistoryItem[]> => {\n const history = await fetch(`api/vui/${user.username}`, {})\n .then((response) => {\n return response.ok ? response.json() : null;\n })\n .catch(() => {\n // TODO we should set a layout with a warning here\n console.log(`error getting history`);\n });\n\n return history;\n};\n", "import {\n ToggleButton,\n ToggleButtonGroup,\n ToggleButtonGroupChangeEventHandler,\n} from \"@heswell/salt-lab\";\nimport cx from \"classnames\";\nimport { useControlled } from \"@salt-ds/core\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport \"./ThemeSwitch.css\";\n\nconst classBase = \"vuuThemeSwitch\";\n\nexport type ThemeMode = \"light\" | \"dark\";\n\nexport interface ThemeSwitchProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n defaultMode?: ThemeMode;\n mode?: ThemeMode;\n onChange: (mode: ThemeMode) => void;\n}\n\nconst modes: ThemeMode[] = [\"light\", \"dark\"];\n\nexport const ThemeSwitch = ({\n className: classNameProp,\n defaultMode: defaultModeProp,\n mode: modeProp,\n onChange,\n ...htmlAttributes\n}: ThemeSwitchProps) => {\n const [mode, setMode] = useControlled<ThemeMode>({\n controlled: modeProp,\n default: defaultModeProp ?? \"light\",\n name: \"ThemeSwitch\",\n state: \"mode\",\n });\n\n const selectedIndex = modes.indexOf(mode);\n\n const handleChangeSecondary: ToggleButtonGroupChangeEventHandler =\n useCallback(\n (_evt, index) => {\n const mode = modes[index];\n setMode(mode);\n onChange(mode);\n },\n [onChange, setMode]\n );\n const className = cx(classBase, classNameProp);\n return (\n <ToggleButtonGroup\n className={className}\n {...htmlAttributes}\n onChange={handleChangeSecondary}\n selectedIndex={selectedIndex}\n >\n <ToggleButton\n aria-label=\"alert\"\n tooltipText=\"Light Theme\"\n data-icon=\"light\"\n />\n <ToggleButton\n aria-label=\"home\"\n tooltipText=\"Dark Theme\"\n data-icon=\"dark\"\n />\n </ToggleButtonGroup>\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["React", "Suspense", "registerComponent", "React", "Fragment", "jsx", "jsxs", "ErrorBoundary", "props", "error", "errorInfo", "jsx", "Loader", "importCSS", "path", "container", "x", "jsx", "RawFeature", "url", "css", "params", "props", "importCSS", "styleSheet", "LazyFeature", "React", "ErrorBoundary", "Suspense", "Loader", "Feature", "registerComponent", "useState", "Button", "FormField", "Input", "jsx", "jsxs", "classBase", "LoginPanel", "onSubmit", "username", "setUserName", "useState", "password", "setPassword", "login", "handleUsername", "_event", "value", "handlePassword", "dataIsValid", "FormField", "Input", "Button", "getCookieValue", "name", "_a", "row", "getAuthDetailsFromCookies", "username", "token", "redirectToLogin", "loginUrl", "logout", "connectToServer", "useCallback", "useEffect", "useRef", "useState", "useCallback", "useEffect", "useState", "useLayoutConfig", "user", "defaultLayout", "layout", "_setLayout", "setLayout", "load", "id", "response", "saveData", "data", "loadLayoutById", "use_layout_config_default", "createContext", "useContext", "jsx", "defaultConfig", "ShellContext", "Provider", "children", "context", "inheritedContext", "mergedContext", "ShellContextProvider", "value", "useShellContext", "cx", "Chest", "DraggableLayout", "Drawer", "Flexbox", "LayoutProvider", "View", "useCallback", "Button", "DropdownBase", "UserSolidIcon", "formatDate", "List", "ListItem", "Button", "ExportIcon", "forwardRef", "useCallback", "useEffect", "useState", "getLayoutHistory", "user", "response", "jsx", "jsxs", "byLastUpdate", "l1", "l2", "HistoryListItem", "props", "ListItem", "UserPanel", "forwardRef", "loginUrl", "onNavigate", "user", "layoutId", "forwardedRef", "history", "setHistory", "useState", "useEffect", "getHistory", "sortedHistory", "getLayoutHistory", "item", "id", "lastUpdate", "formatDate", "handleHisorySelected", "useCallback", "evt", "selected", "handleLogout", "logout", "i", "List", "Button", "ExportIcon", "jsx", "jsxs", "UserProfile", "layoutId", "loginUrl", "onNavigate", "user", "DropdownBase", "Button", "UserSolidIcon", "UserPanel", "id", "ToggleButton", "ToggleButtonGroup", "cx", "useControlled", "useCallback", "jsx", "jsxs", "classBase", "modes", "ThemeSwitch", "classNameProp", "defaultModeProp", "modeProp", "onChange", "htmlAttributes", "mode", "setMode", "useControlled", "selectedIndex", "handleChangeSecondary", "useCallback", "_evt", "index", "className", "cx", "ToggleButtonGroup", "ToggleButton", "cx", "jsx", "jsxs", "classBase", "AppHeader", "classNameProp", "layoutId", "loginUrl", "onNavigate", "onSwitchTheme", "themeMode", "user", "htmlAttributes", "className", "cx", "handleSwitchTheme", "useCallback", "mode", "ThemeSwitch", "UserProfile", "jsx", "jsxs", "warningLayout", "Shell", "children", "classNameProp", "defaultLayout", "leftSidePanel", "loginUrl", "serverUrl", "user", "htmlAttributes", "rootRef", "useRef", "density", "useState", "paletteView", "open", "setOpen", "layoutId", "layout", "setLayoutConfig", "loadLayoutById", "use_layout_config_default", "handleLayoutChange", "useCallback", "handleSwitchTheme", "mode", "handleDrawerClick", "e", "_a", "target", "handleNavigate", "id", "useEffect", "connectToServer", "getDrawers", "drawers", "Drawer", "View", "className", "cx", "ShellContextProvider", "LayoutProvider", "DraggableLayout", "Flexbox", "AppHeader", "Chest"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vuu-ui/vuu-shell",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.6",
|
|
4
4
|
"description": "VUU UI Shell",
|
|
5
5
|
"author": "heswell",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -8,9 +8,9 @@
|
|
|
8
8
|
"@salt-ds/core": "1.0.0",
|
|
9
9
|
"@salt-ds/icons": "1.0.0",
|
|
10
10
|
"@heswell/salt-lab": "1.0.0-alpha.0-vuu.1",
|
|
11
|
-
"@vuu-ui/vuu-data": "0.6.
|
|
12
|
-
"@vuu-ui/vuu-layout": "0.6.
|
|
13
|
-
"@vuu-ui/vuu-utils": "0.6.
|
|
11
|
+
"@vuu-ui/vuu-data": "0.6.6",
|
|
12
|
+
"@vuu-ui/vuu-layout": "0.6.6",
|
|
13
|
+
"@vuu-ui/vuu-utils": "0.6.6",
|
|
14
14
|
"classnames": "^2.2.6",
|
|
15
15
|
"react": "^17.0.2",
|
|
16
16
|
"react-dom": "^17.0.2"
|
|
@@ -19,8 +19,10 @@
|
|
|
19
19
|
"cjs",
|
|
20
20
|
"esm",
|
|
21
21
|
"index.css",
|
|
22
|
-
"index.css.map"
|
|
22
|
+
"index.css.map",
|
|
23
|
+
"/types"
|
|
23
24
|
],
|
|
24
25
|
"module": "esm/index.js",
|
|
25
|
-
"main": "cjs/index.js"
|
|
26
|
+
"main": "cjs/index.js",
|
|
27
|
+
"types": "types/index.d.ts"
|
|
26
28
|
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { MenuRpcResponse } from "@vuu-ui/vuu-data";
|
|
2
|
+
import { ColumnDescriptor } from "@vuu-ui/vuu-datagrid-types";
|
|
3
|
+
import { ReactElement, ReactNode } from "react";
|
|
4
|
+
export interface ShellContextProps {
|
|
5
|
+
getDefaultColumnConfig?: (tableName: string, columnName: string) => Partial<ColumnDescriptor>;
|
|
6
|
+
handleRpcResponse?: (response?: MenuRpcResponse) => void;
|
|
7
|
+
}
|
|
8
|
+
export interface ShellProviderProps {
|
|
9
|
+
children: ReactNode;
|
|
10
|
+
value?: ShellContextProps;
|
|
11
|
+
}
|
|
12
|
+
export declare const ShellContextProvider: ({ children, value, }: ShellProviderProps) => ReactElement;
|
|
13
|
+
export declare const useShellContext: () => ShellContextProps;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { HTMLAttributes } from "react";
|
|
2
|
+
import { VuuUser } from "../shell";
|
|
3
|
+
import { ThemeMode } from "../theme-switch";
|
|
4
|
+
import "./AppHeader.css";
|
|
5
|
+
export interface AppHeaderProps extends HTMLAttributes<HTMLDivElement> {
|
|
6
|
+
layoutId: string;
|
|
7
|
+
loginUrl?: string;
|
|
8
|
+
onNavigate: (id: string) => void;
|
|
9
|
+
onSwitchTheme?: (mode: ThemeMode) => void;
|
|
10
|
+
themeMode?: ThemeMode;
|
|
11
|
+
user: VuuUser;
|
|
12
|
+
}
|
|
13
|
+
export declare const AppHeader: ({ className: classNameProp, layoutId, loginUrl, onNavigate, onSwitchTheme, themeMode, user, ...htmlAttributes }: AppHeaderProps) => JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './AppHeader';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export class ErrorBoundary extends React.Component<any, any, any> {
|
|
2
|
+
static getDerivedStateFromError(error: any): {
|
|
3
|
+
errorMessage: any;
|
|
4
|
+
};
|
|
5
|
+
constructor(props: any);
|
|
6
|
+
state: {
|
|
7
|
+
errorMessage: null;
|
|
8
|
+
};
|
|
9
|
+
componentDidCatch(error: any, errorInfo: any): void;
|
|
10
|
+
}
|
|
11
|
+
import React from "react";
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface FeatureProps<Params extends object | undefined = undefined> {
|
|
3
|
+
height?: number;
|
|
4
|
+
url: string;
|
|
5
|
+
css?: string;
|
|
6
|
+
width?: number;
|
|
7
|
+
params: Params;
|
|
8
|
+
}
|
|
9
|
+
declare function RawFeature<Params extends object | undefined>({ url, css, params, ...props }: FeatureProps<Params>): JSX.Element;
|
|
10
|
+
export declare const Feature: React.MemoExoticComponent<typeof RawFeature>;
|
|
11
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const importCSS: (path: string) => Promise<CSSStyleSheet>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Feature';
|
package/types/index.d.ts
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { HTMLAttributes } from "react";
|
|
2
|
+
import "./LoginPanel.css";
|
|
3
|
+
export interface LoginPanelProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSubmit"> {
|
|
4
|
+
onSubmit: (username: string, password: string) => void;
|
|
5
|
+
}
|
|
6
|
+
export declare const LoginPanel: ({ onSubmit }: LoginPanelProps) => JSX.Element;
|
package/types/shell.d.ts
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { HTMLAttributes, ReactElement, ReactNode } from "react";
|
|
2
|
+
import { LayoutJSON } from "@vuu-ui/vuu-layout/src/layout-reducer";
|
|
3
|
+
import "./shell.css";
|
|
4
|
+
export type VuuUser = {
|
|
5
|
+
username: string;
|
|
6
|
+
token: string;
|
|
7
|
+
};
|
|
8
|
+
export interface ShellProps extends HTMLAttributes<HTMLDivElement> {
|
|
9
|
+
children?: ReactNode;
|
|
10
|
+
defaultLayout?: LayoutJSON;
|
|
11
|
+
leftSidePanel?: ReactElement;
|
|
12
|
+
loginUrl?: string;
|
|
13
|
+
serverUrl?: string;
|
|
14
|
+
user: VuuUser;
|
|
15
|
+
}
|
|
16
|
+
export declare const Shell: ({ children, className: classNameProp, defaultLayout, leftSidePanel, loginUrl, serverUrl, user, ...htmlAttributes }: ShellProps) => JSX.Element;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
declare global {
|
|
2
|
+
const vuuConfig: Promise<VuuConfig>;
|
|
3
|
+
}
|
|
4
|
+
export interface FeatureConfig {
|
|
5
|
+
name: string;
|
|
6
|
+
title: string;
|
|
7
|
+
url: string;
|
|
8
|
+
css?: string;
|
|
9
|
+
}
|
|
10
|
+
export type Features = {
|
|
11
|
+
[key: string]: FeatureConfig;
|
|
12
|
+
};
|
|
13
|
+
export interface VuuConfig {
|
|
14
|
+
features: Features;
|
|
15
|
+
websocketUrl: string;
|
|
16
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { ReactElement } from "react";
|
|
2
|
+
export declare const DEFAULT_DENSITY = "medium";
|
|
3
|
+
export declare const DEFAULT_THEME = "salt-theme";
|
|
4
|
+
export type Density = "high" | "medium" | "low" | "touch";
|
|
5
|
+
export interface ThemeContextProps {
|
|
6
|
+
density?: Density;
|
|
7
|
+
themes?: string[];
|
|
8
|
+
theme?: string;
|
|
9
|
+
}
|
|
10
|
+
export declare const ThemeContext: React.Context<ThemeContextProps>;
|
|
11
|
+
interface ThemeProviderProps {
|
|
12
|
+
children: ReactElement;
|
|
13
|
+
density?: Density;
|
|
14
|
+
theme?: string;
|
|
15
|
+
applyClassesToChild?: true;
|
|
16
|
+
}
|
|
17
|
+
export declare const ThemeProvider: ({ children, density: densityProp, theme: themeProp, }: ThemeProviderProps) => JSX.Element;
|
|
18
|
+
export {};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { HTMLAttributes } from "react";
|
|
2
|
+
import "./ThemeSwitch.css";
|
|
3
|
+
export type ThemeMode = "light" | "dark";
|
|
4
|
+
export interface ThemeSwitchProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
|
|
5
|
+
defaultMode?: ThemeMode;
|
|
6
|
+
mode?: ThemeMode;
|
|
7
|
+
onChange: (mode: ThemeMode) => void;
|
|
8
|
+
}
|
|
9
|
+
export declare const ThemeSwitch: ({ className: classNameProp, defaultMode: defaultModeProp, mode: modeProp, onChange, ...htmlAttributes }: ThemeSwitchProps) => JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./ThemeSwitch";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export function useForceRender(): import("react").Dispatch<import("react").SetStateAction<{}>>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { HTMLAttributes } from "react";
|
|
2
|
+
import { VuuUser } from "../shell";
|
|
3
|
+
import "./UserPanel.css";
|
|
4
|
+
export interface UserPanelProps extends HTMLAttributes<HTMLDivElement> {
|
|
5
|
+
loginUrl?: string;
|
|
6
|
+
onNavigate: (id: string) => void;
|
|
7
|
+
user: VuuUser;
|
|
8
|
+
layoutId: string;
|
|
9
|
+
}
|
|
10
|
+
export declare const UserPanel: import("react").ForwardRefExoticComponent<UserPanelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import "./UserProfile.css";
|
|
3
|
+
import { VuuUser } from "../shell";
|
|
4
|
+
export interface UserProfileProps {
|
|
5
|
+
layoutId: string;
|
|
6
|
+
loginUrl?: string;
|
|
7
|
+
onNavigate: (id: string) => void;
|
|
8
|
+
user: VuuUser;
|
|
9
|
+
}
|
|
10
|
+
export declare const UserProfile: ({ layoutId, loginUrl, onNavigate, user, }: UserProfileProps) => JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './UserProfile';
|