@vuu-ui/vuu-shell 0.8.26 → 0.8.27-debug

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 CHANGED
@@ -1,3 +1,3125 @@
1
- "use strict";var ia=Object.create;var _e=Object.defineProperty;var sa=Object.getOwnPropertyDescriptor;var ua=Object.getOwnPropertyNames;var la=Object.getPrototypeOf,ca=Object.prototype.hasOwnProperty;var da=(e,t)=>{for(var o in t)_e(e,o,{get:t[o],enumerable:!0})},Ot=(e,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ua(t))!ca.call(e,n)&&n!==o&&_e(e,n,{get:()=>t[n],enumerable:!(a=sa(t,n))||a.enumerable});return e};var M=(e,t,o)=>(o=e!=null?ia(la(e)):{},Ot(t||!e||!e.__esModule?_e(o,"default",{value:e,enumerable:!0}):o,e)),pa=e=>Ot(_e({},"__esModule",{value:!0}),e);var zt=(e,t,o)=>{if(!t.has(e))throw TypeError("Cannot "+o)};var ft=(e,t,o)=>(zt(e,t,"read from private field"),o?o.call(e):t.get(e)),Ut=(e,t,o)=>{if(t.has(e))throw TypeError("Cannot add the same private member more than once");t instanceof WeakSet?t.add(e):t.set(e,o)},Zt=(e,t,o,a)=>(zt(e,t,"write to private field"),a?a.call(e,o):t.set(e,o),o);var En={};da(En,{AppHeader:()=>yt,ConnectionStatusIcon:()=>fa,ContextPanel:()=>Ht,Feature:()=>Re,FeatureList:()=>lt,LayoutList:()=>Dt,LayoutManagementContext:()=>Et,LayoutManagementProvider:()=>pn,LeftNav:()=>hn,LoginPanel:()=>ma,SaveLayoutPanel:()=>Pt,SessionEditingForm:()=>gn,Shell:()=>xn,ShellContextProvider:()=>Sn,SidePanel:()=>At,ThemeSwitch:()=>Mn,getAuthDetailsFromCookies:()=>Ve,getAuthModeFromCookies:()=>Wt,isTableSchema:()=>Cn,isWildcardSchema:()=>bn,logout:()=>vt,redirectToLogin:()=>Gt,useLayoutManager:()=>de,useShellContext:()=>Pn,useShellLayout:()=>Rt});module.exports=pa(En);var Qt=require("react"),Xt=require("@vuu-ui/vuu-ui-controls"),Kt=M(require("clsx"));var W=require("react"),ee=require("@salt-ds/core"),gt=require("@vuu-ui/vuu-ui-controls");var qt=require("react"),x=require("react/jsx-runtime"),Jt=()=>(0,qt.useMemo)(()=>(0,x.jsxs)("svg",{width:"184",height:"90",viewBox:"0 0 184 90",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,x.jsxs)("g",{clipPath:"url(#clip0_1173_59965)",children:[(0,x.jsx)("path",{d:"M77.0775 31.1019L69.4572 15.1795L66.3997 13.7093L47.6353 44.165L75.7224 61.2361L81.8124 51.2694L77.0775 31.1019Z",fill:"url(#paint0_linear_1173_59965)"}),(0,x.jsx)("path",{d:"M82.4101 49.7431C81.0488 51.8314 79.1993 53.648 76.8897 54.9809C74.2954 56.4792 71.4601 57.194 68.6623 57.194C63.3422 57.194 58.1597 54.6188 55.0209 49.971L30.5358 7.8193L30.5232 7.84116C25.8791 0.274825 16.0118 -2.26289 8.27258 2.21011C0.411306 6.74866 -2.26753 16.7872 2.28587 24.625L35.5054 81.8189C36.9856 84.3691 39.0542 86.3668 41.4358 87.7527C41.4545 87.7652 41.4733 87.7777 41.4921 87.7902C41.5015 87.7964 41.514 87.8027 41.5234 87.8089C42.6312 88.4457 43.8079 88.942 45.0253 89.3072C45.116 89.3353 45.2099 89.3634 45.3007 89.3883C45.7388 89.5101 46.1801 89.6193 46.6276 89.7067C46.7121 89.7223 46.7966 89.7317 46.8811 89.7473C47.241 89.8097 47.604 89.8628 47.967 89.9003C48.111 89.9159 48.2549 89.9315 48.3989 89.9408C48.8151 89.9752 49.2313 89.997 49.6507 90.0001C49.6726 90.0001 49.6945 90.0001 49.7132 90.0001C49.7195 90.0001 49.7226 90.0001 49.7289 90.0001C49.7352 90.0001 49.7383 90.0001 49.7445 90.0001C50.1983 90.0001 50.6552 89.9752 51.109 89.9377C51.2123 89.9283 51.3155 89.919 51.422 89.9065C51.8663 89.8597 52.3107 89.8004 52.7551 89.7192C52.7614 89.7192 52.7676 89.7192 52.7739 89.7192C53.2621 89.6287 53.7503 89.5101 54.2322 89.3727C54.2635 89.3634 54.2917 89.354 54.323 89.3446C55.024 89.1418 55.7156 88.8889 56.3978 88.5861C56.4104 88.5799 56.426 88.5736 56.4385 88.5674C56.958 88.3364 57.4712 88.0836 57.9751 87.7933C58.4852 87.4999 58.9703 87.1815 59.4334 86.8413C59.8371 86.5478 60.2252 86.2357 60.6039 85.9048C61.0639 85.499 61.4989 85.0745 61.9026 84.6282C62.2062 84.2942 62.4972 83.9446 62.7757 83.5825C62.8665 83.4639 62.951 83.3421 63.0355 83.2235C63.2264 82.9613 63.4079 82.6929 63.5831 82.4182C63.6739 82.2746 63.7646 82.1342 63.8523 81.9906C63.8867 81.9344 63.9242 81.8813 63.9555 81.8251L82.5854 49.7525H82.4039L82.4101 49.7431Z",fill:"url(#paint1_linear_1173_59965)"}),(0,x.jsx)("path",{d:"M82.8264 32.8436L81.4181 30.4464L75.3375 19.1687L72.5178 14.3929C71.9858 13.1225 70.7309 12.2266 69.26 12.2266C67.3104 12.2266 65.7331 13.8029 65.7331 15.7445C65.7331 16.4031 65.924 17.0086 66.2401 17.5362L66.2025 17.5611L77.1557 36.1617C78.4764 38.4372 78.83 41.0873 78.1509 43.6281C77.4718 46.169 75.8445 48.2915 73.5631 49.6119C72.0609 50.4797 70.3553 50.9385 68.6341 50.9385C65.1166 50.9385 61.84 49.0563 60.0812 46.0285L44.3368 19.2654H44.3681L37.7179 7.81917L37.7054 7.84102C37.5896 7.65061 37.455 7.47893 37.333 7.29477L37.1452 6.97326C37.1452 6.97326 37.1296 6.98262 37.1233 6.98887C34.0001 2.55332 29.0054 0.0780356 23.8512 0.0187285V0H15.3515V0.0436999C21.2881 -0.368328 27.2247 2.46593 30.5232 7.84102L30.5357 7.81917L55.0177 49.974C58.1566 54.6187 63.3422 57.197 68.6592 57.197C71.4569 57.197 74.2922 56.4853 76.8866 54.9839C79.1961 53.651 81.0425 51.8312 82.407 49.7461H82.5885L82.5259 49.8523C83.399 48.4695 84.0687 46.9462 84.5006 45.3231C85.6304 41.0904 85.042 36.6705 82.8201 32.8467L82.8264 32.8436Z",fill:"#F37880"}),(0,x.jsxs)("g",{opacity:"0.86",children:[(0,x.jsx)("path",{d:"M66.1994 17.5642L77.1526 36.1648C78.4732 38.4403 78.8269 41.0904 78.1478 43.6313C77.7347 45.1795 76.9648 46.5716 75.9133 47.7234C77.2903 46.4686 78.2823 44.8486 78.7737 43.007C79.4527 40.4661 79.0991 37.816 77.7785 35.5405L66.8253 16.94L66.8628 16.915C66.5467 16.3875 66.3558 15.7819 66.3558 15.1233C66.3558 14.3117 66.6344 13.5657 67.0975 12.9695C66.2651 13.6125 65.7299 14.6176 65.7299 15.7476C65.7299 16.4062 65.9208 17.0118 66.2369 17.5393L66.1994 17.5642Z",fill:"white"}),(0,x.jsx)("path",{d:"M82.5382 49.8335L82.5291 49.8487C82.5291 49.8487 82.5352 49.8365 82.5413 49.8304C82.5413 49.8304 82.5413 49.8304 82.5413 49.8335H82.5382Z",fill:"white"}),(0,x.jsx)("path",{d:"M77.5156 54.3596C74.9213 55.8579 72.0859 56.5727 69.2882 56.5727C63.9681 56.5727 58.7856 53.9975 55.6467 49.3497L31.1616 7.19488L31.1491 7.21673C28.9053 3.56154 25.4441 1.08626 21.5917 0H15.3515V0.0436999C21.2881 -0.368328 27.2247 2.46593 30.5232 7.84102L30.5357 7.81917L55.0177 49.974C58.1566 54.6187 63.3422 57.197 68.6592 57.197C71.4569 57.197 74.2922 56.4853 76.8866 54.9839C78.2698 54.1848 79.4809 53.2109 80.5293 52.1122C79.6311 52.9581 78.6266 53.7166 77.5125 54.3596H77.5156Z",fill:"white"})]})]}),(0,x.jsx)("path",{d:"M117.046 58.661C116.362 58.661 115.792 58.509 115.336 58.205C114.906 57.8757 114.551 57.3943 114.272 56.761L104.354 34.493C104.076 33.8597 104 33.3023 104.126 32.821C104.253 32.3397 104.519 31.9597 104.924 31.681C105.33 31.4023 105.811 31.263 106.368 31.263C107.103 31.263 107.648 31.4277 108.002 31.757C108.382 32.061 108.699 32.5297 108.952 33.163L117.958 54.025H116.324L125.292 33.125C125.571 32.517 125.9 32.061 126.28 31.757C126.66 31.4277 127.192 31.263 127.876 31.263C128.434 31.263 128.89 31.4023 129.244 31.681C129.624 31.9597 129.865 32.3397 129.966 32.821C130.068 33.3023 129.979 33.8597 129.7 34.493L119.782 56.761C119.504 57.3943 119.149 57.8757 118.718 58.205C118.313 58.509 117.756 58.661 117.046 58.661Z",fill:"white"}),(0,x.jsx)("path",{d:"M144.63 58.737C142.781 58.737 141.147 58.4963 139.728 58.015C138.335 57.5337 137.157 56.8243 136.194 55.887C135.232 54.9243 134.51 53.7337 134.028 52.315C133.547 50.8963 133.306 49.2497 133.306 47.375V33.733C133.306 32.897 133.509 32.2763 133.914 31.871C134.345 31.4657 134.953 31.263 135.738 31.263C136.524 31.263 137.119 31.4657 137.524 31.871C137.955 32.2763 138.17 32.897 138.17 33.733V47.337C138.17 49.7437 138.715 51.555 139.804 52.771C140.919 53.9617 142.528 54.557 144.63 54.557C146.733 54.557 148.329 53.9617 149.418 52.771C150.508 51.555 151.052 49.7437 151.052 47.337V33.733C151.052 32.897 151.255 32.2763 151.66 31.871C152.091 31.4657 152.699 31.263 153.484 31.263C154.244 31.263 154.827 31.4657 155.232 31.871C155.663 32.2763 155.878 32.897 155.878 33.733V47.375C155.878 49.8577 155.448 51.9477 154.586 53.645C153.75 55.3423 152.496 56.6217 150.824 57.483C149.152 58.319 147.088 58.737 144.63 58.737Z",fill:"white"}),(0,x.jsx)("path",{d:"M172.685 58.737C170.836 58.737 169.202 58.4963 167.783 58.015C166.39 57.5337 165.212 56.8243 164.249 55.887C163.286 54.9243 162.564 53.7337 162.083 52.315C161.602 50.8963 161.361 49.2497 161.361 47.375V33.733C161.361 32.897 161.564 32.2763 161.969 31.871C162.4 31.4657 163.008 31.263 163.793 31.263C164.578 31.263 165.174 31.4657 165.579 31.871C166.01 32.2763 166.225 32.897 166.225 33.733V47.337C166.225 49.7437 166.77 51.555 167.859 52.771C168.974 53.9617 170.582 54.557 172.685 54.557C174.788 54.557 176.384 53.9617 177.473 52.771C178.562 51.555 179.107 49.7437 179.107 47.337V33.733C179.107 32.897 179.31 32.2763 179.715 31.871C180.146 31.4657 180.754 31.263 181.539 31.263C182.299 31.263 182.882 31.4657 183.287 31.871C183.718 32.2763 183.933 32.897 183.933 33.733V47.375C183.933 49.8577 183.502 51.9477 182.641 53.645C181.805 55.3423 180.551 56.6217 178.879 57.483C177.207 58.319 175.142 58.737 172.685 58.737Z",fill:"white"}),(0,x.jsxs)("defs",{children:[(0,x.jsxs)("linearGradient",{id:"paint0_linear_1173_59965",x1:"47.6353",y1:"37.4727",x2:"81.8124",y2:"37.4727",gradientUnits:"userSpaceOnUse",children:[(0,x.jsx)("stop",{stopColor:"#4906A5"}),(0,x.jsx)("stop",{offset:"1",stopColor:"#D3423A"})]}),(0,x.jsxs)("linearGradient",{id:"paint1_linear_1173_59965",x1:"0.0670626",y1:"45.0017",x2:"82.5916",y2:"45.0017",gradientUnits:"userSpaceOnUse",children:[(0,x.jsx)("stop",{stopColor:"#7C06A5"}),(0,x.jsx)("stop",{offset:"1",stopColor:"#D3423A"})]}),(0,x.jsx)("clipPath",{id:"clip0_1173_59965",children:(0,x.jsx)("rect",{width:"85",height:"90",fill:"white",transform:"translate(0.0670471)"})})]})]}),[]);var _t=M(require("clsx"));var D=require("react/jsx-runtime"),re="vuuLoginPanel",ma=({appName:e="Demo App",className:t,requirePassword:o=!0,onSubmit:a,...n})=>{let[r,i]=(0,W.useState)(""),[s,u]=(0,W.useState)(""),c=(0,W.useRef)(null),d=()=>{a(r,s)},h=f=>{i(f.target.value)},b=f=>{u(f.target.value)},y=(0,W.useCallback)(()=>{o||a(r)},[a,o,r]),p=(0,W.useCallback)(()=>{r&&a(r,s)},[a,s,r]),l=r.trim()!==""&&(o===!1||s.trim()!=="");return(0,W.useEffect)(()=>{var f;console.log("inputRef",{input:c.current}),(f=c.current)==null||f.focus()},[]),(0,D.jsxs)("div",{...n,className:(0,_t.default)(re,t),children:[(0,D.jsxs)("div",{className:`${re}-branding`,children:[(0,D.jsx)(Jt,{}),(0,D.jsx)("div",{className:`${re}-appName`,children:e})]}),(0,D.jsxs)("div",{className:`${re}-form`,children:[(0,D.jsx)("div",{className:`${re}-title`,children:"Welcome Back"}),(0,D.jsxs)(ee.FormField,{children:[(0,D.jsx)(ee.FormFieldLabel,{children:"Username"}),(0,D.jsx)(gt.VuuInput,{value:r,id:"text-username",inputRef:c,onChange:h,onCommit:y})]}),o?(0,D.jsxs)(ee.FormField,{children:[(0,D.jsx)(ee.FormFieldLabel,{children:"Password"}),(0,D.jsx)(gt.VuuInput,{className:`${re}-password`,inputProps:{type:"password"},value:s,id:"text-password",onChange:b,onCommit:p,endAdornment:(0,D.jsx)("span",{"data-icon":"eye",style:{cursor:"pointer"}})})]}):null,(0,D.jsx)(ee.Button,{className:`${re}-login`,disabled:!l,onClick:d,variant:"cta",children:"Login"})]})]})};var We=require("@vuu-ui/vuu-utils"),Wt=()=>{let e=(0,We.getCookieValue)("vuu-auth-mode");return e!=null?e:""},Ve=()=>{let e=(0,We.getCookieValue)("vuu-username"),t=(0,We.getCookieValue)("vuu-auth-token");return[e,t]},ha=()=>Wt()==="login"?"login.html":"demo.html",Gt=(e=ha())=>{window.location.href=e},vt=e=>{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",Gt(e)};var He=require("@salt-ds/core");var Q=require("react/jsx-runtime"),Fe="vuuAppHeader",yt=({className:e,layoutId:t,loginUrl:o,onNavigate:a,onSwitchTheme:n,themeMode:r,user:i,...s})=>{let u=(0,Kt.default)(Fe,e),c=(0,Qt.useCallback)(()=>{vt(o)},[o]);return(0,Q.jsxs)(Xt.Toolbar,{alignItems:"end",className:u,showSeparators:!0,...s,children:[(0,Q.jsx)(He.Button,{className:`${Fe}-menuItem`,variant:"secondary",children:"Help"}),(0,Q.jsxs)(He.Button,{className:`${Fe}-menuItem`,variant:"secondary",children:["History ",(0,Q.jsx)("span",{"data-icon":"history"})]}),(0,Q.jsxs)(He.Button,{className:`${Fe}-menuItem`,variant:"secondary",children:["View ",(0,Q.jsx)("span",{"data-icon":"settings"})]}),(0,Q.jsx)(He.Button,{className:`${Fe}-menuItem`,onClick:c,variant:"secondary",children:"Log out"})]})};var xe=M(require("react")),Yt=M(require("clsx"));var ie=require("react/jsx-runtime"),fa=({connectionStatus:e,className:t,element:o="span",...a})=>{let[n,r]=(0,xe.useState)("vuuConnectingStatus");(0,xe.useEffect)(()=>{switch(e){case"connected":case"reconnected":r("vuuActiveStatus");break;case"connecting":r("vuuConnectingStatus");break;case"disconnected":r("vuuDisconnectedStatus");break;default:break}},[e]);let i=xe.default.createElement(o,{...a,className:(0,Yt.default)("vuuStatus vuuIcon",n,t)});return(0,ie.jsx)(ie.Fragment,{children:(0,ie.jsxs)("div",{className:"vuuStatus-container salt-theme",children:[i,(0,ie.jsxs)("div",{className:"vuuStatus-text",children:["Status: ",e.toUpperCase()]})]})})};var ue=M(require("react")),ao=require("@vuu-ui/vuu-layout");var jt=M(require("react")),se=require("react/jsx-runtime"),Ge=class extends jt.default.Component{constructor(t){super(t),this.state={errorMessage:null}}static getDerivedStateFromError(t){return{errorMessage:t.message}}componentDidCatch(t,o){console.log(`error creating component at ${this.props.url}`),console.log(t,o)}render(){return this.state.errorMessage?(0,se.jsxs)(se.Fragment,{children:[(0,se.jsx)("h1",{children:"An error occured while creating component."}),(0,se.jsx)("p",{children:this.state.errorMessage})]}):this.props.children}};var to=require("react/jsx-runtime"),eo=()=>(0,to.jsx)("div",{className:"hwLoader"});var oo=async e=>{let t=new CSSStyleSheet;return fetch(e).then(o=>o.text()).then(o=>t.replace(o))};var Ae=require("react/jsx-runtime"),Qe=new Map,ga=e=>{(0,ue.useEffect)(()=>()=>{Qe.delete(e)},[e]),Qe.has(e)||Qe.set(e,ue.default.lazy(()=>import(e)));let t=Qe.get(e);if(t)return t;throw Error(`Unable to load Lazy Feature at url ${e}`)};function va({url:e,css:t,ComponentProps:o,...a}){t&&oo(t).then(r=>{document.adoptedStyleSheets=[...document.adoptedStyleSheets,r]});let n=ga(e);return(0,Ae.jsx)(Ge,{url:e,children:(0,Ae.jsx)(ue.Suspense,{fallback:(0,Ae.jsx)(eo,{}),children:(0,Ae.jsx)(n,{...a,...o})})})}var Re=ue.default.memo(va);Re.displayName="Feature";(0,ao.registerComponent)("Feature",Re,"view");var Le=require("@vuu-ui/vuu-ui-controls");function no(e,t){if(e.match(/^[a-z]+:\/\//i))return e;if(e.match(/^\/\//))return window.location.protocol+e;if(e.match(/^[a-z]+:/i))return e;let o=document.implementation.createHTMLDocument(),a=o.createElement("base"),n=o.createElement("a");return o.head.appendChild(a),o.body.appendChild(n),t&&(a.href=t),n.href=e,n.href}var ro=(()=>{let e=0,t=()=>`0000${(Math.random()*36**4<<0).toString(36)}`.slice(-4);return()=>(e+=1,`u${t()}${e}`)})();function A(e){let t=[];for(let o=0,a=e.length;o<a;o++)t.push(e[o]);return t}function Xe(e,t){let a=(e.ownerDocument.defaultView||window).getComputedStyle(e).getPropertyValue(t);return a?parseFloat(a.replace("px","")):0}function ya(e){let t=Xe(e,"border-left-width"),o=Xe(e,"border-right-width");return e.clientWidth+t+o}function xa(e){let t=Xe(e,"border-top-width"),o=Xe(e,"border-bottom-width");return e.clientHeight+t+o}function xt(e,t={}){let o=t.width||ya(e),a=t.height||xa(e);return{width:o,height:a}}function io(){let e,t;try{t=process}catch{}let o=t&&t.env?t.env.devicePixelRatio:null;return o&&(e=parseInt(o,10),Number.isNaN(e)&&(e=1)),e||window.devicePixelRatio||1}var H=16384;function so(e){(e.width>H||e.height>H)&&(e.width>H&&e.height>H?e.width>e.height?(e.height*=H/e.width,e.width=H):(e.width*=H/e.height,e.height=H):e.width>H?(e.height*=H/e.width,e.width=H):(e.width*=H/e.height,e.height=H))}function be(e){return new Promise((t,o)=>{let a=new Image;a.decode=()=>t(a),a.onload=()=>t(a),a.onerror=o,a.crossOrigin="anonymous",a.decoding="async",a.src=e})}async function ba(e){return Promise.resolve().then(()=>new XMLSerializer().serializeToString(e)).then(encodeURIComponent).then(t=>`data:image/svg+xml;charset=utf-8,${t}`)}async function uo(e,t,o){let a="http://www.w3.org/2000/svg",n=document.createElementNS(a,"svg"),r=document.createElementNS(a,"foreignObject");return n.setAttribute("width",`${t}`),n.setAttribute("height",`${o}`),n.setAttribute("viewBox",`0 0 ${t} ${o}`),r.setAttribute("width","100%"),r.setAttribute("height","100%"),r.setAttribute("x","0"),r.setAttribute("y","0"),r.setAttribute("externalResourcesRequired","true"),n.appendChild(r),r.appendChild(e),ba(n)}var k=(e,t)=>{if(e instanceof t)return!0;let o=Object.getPrototypeOf(e);return o===null?!1:o.constructor.name===t.name||k(o,t)};function Ca(e){let t=e.getPropertyValue("content");return`${e.cssText} content: '${t.replace(/'|"/g,"")}';`}function wa(e){return A(e).map(t=>{let o=e.getPropertyValue(t),a=e.getPropertyPriority(t);return`${t}: ${o}${a?" !important":""};`}).join(" ")}function La(e,t,o){let a=`.${e}:${t}`,n=o.cssText?Ca(o):wa(o);return document.createTextNode(`${a}{${n}}`)}function lo(e,t,o){let a=window.getComputedStyle(e,o),n=a.getPropertyValue("content");if(n===""||n==="none")return;let r=ro();try{t.className=`${t.className} ${r}`}catch{return}let i=document.createElement("style");i.appendChild(La(r,o,a)),t.appendChild(i)}function co(e,t){lo(e,t,":before"),lo(e,t,":after")}var po="application/font-woff",mo="image/jpeg",Sa={woff:po,woff2:po,ttf:"application/font-truetype",eot:"application/vnd.ms-fontobject",png:"image/png",jpg:mo,jpeg:mo,gif:"image/gif",tiff:"image/tiff",svg:"image/svg+xml",webp:"image/webp"};function Pa(e){let t=/\.([^./]*?)$/g.exec(e);return t?t[1]:""}function Ce(e){let t=Pa(e).toLowerCase();return Sa[t]||""}function Ta(e){return e.split(/,/)[1]}function Be(e){return e.search(/^(data:)/)!==-1}function Ct(e,t){return`data:${t};base64,${e}`}async function wt(e,t,o){let a=await fetch(e,t);if(a.status===404)throw new Error(`Resource "${a.url}" not found`);let n=await a.blob();return new Promise((r,i)=>{let s=new FileReader;s.onerror=i,s.onloadend=()=>{try{r(o({res:a,result:s.result}))}catch(u){i(u)}},s.readAsDataURL(n)})}var bt={};function Ma(e,t,o){let a=e.replace(/\?.*/,"");return o&&(a=e),/ttf|otf|eot|woff2?/i.test(a)&&(a=a.replace(/.*\//,"")),t?`[${t}]${a}`:a}async function we(e,t,o){let a=Ma(e,t,o.includeQueryParams);if(bt[a]!=null)return bt[a];o.cacheBust&&(e+=(/\?/.test(e)?"&":"?")+new Date().getTime());let n;try{let r=await wt(e,o.fetchRequestInit,({res:i,result:s})=>(t||(t=i.headers.get("Content-Type")||""),Ta(s)));n=Ct(r,t)}catch(r){n=o.imagePlaceholder||"";let i=`Failed to fetch resource: ${e}`;r&&(i=typeof r=="string"?r:r.message),i&&console.warn(i)}return bt[a]=n,n}async function Ea(e){let t=e.toDataURL();return t==="data:,"?e.cloneNode(!1):be(t)}async function Na(e,t){if(e.currentSrc){let r=document.createElement("canvas"),i=r.getContext("2d");r.width=e.clientWidth,r.height=e.clientHeight,i==null||i.drawImage(e,0,0,r.width,r.height);let s=r.toDataURL();return be(s)}let o=e.poster,a=Ce(o),n=await we(o,a,t);return be(n)}async function Da(e){var t;try{if(!((t=e==null?void 0:e.contentDocument)===null||t===void 0)&&t.body)return await $e(e.contentDocument.body,{},!0)}catch{}return e.cloneNode(!1)}async function ka(e,t){return k(e,HTMLCanvasElement)?Ea(e):k(e,HTMLVideoElement)?Na(e,t):k(e,HTMLIFrameElement)?Da(e):e.cloneNode(!1)}var Va=e=>e.tagName!=null&&e.tagName.toUpperCase()==="SLOT";async function Fa(e,t,o){var a,n;let r=[];return Va(e)&&e.assignedNodes?r=A(e.assignedNodes()):k(e,HTMLIFrameElement)&&(!((a=e.contentDocument)===null||a===void 0)&&a.body)?r=A(e.contentDocument.body.childNodes):r=A(((n=e.shadowRoot)!==null&&n!==void 0?n:e).childNodes),r.length===0||k(e,HTMLVideoElement)||await r.reduce((i,s)=>i.then(()=>$e(s,o)).then(u=>{u&&t.appendChild(u)}),Promise.resolve()),t}function Ha(e,t){let o=t.style;if(!o)return;let a=window.getComputedStyle(e);a.cssText?(o.cssText=a.cssText,o.transformOrigin=a.transformOrigin):A(a).forEach(n=>{let r=a.getPropertyValue(n);n==="font-size"&&r.endsWith("px")&&(r=`${Math.floor(parseFloat(r.substring(0,r.length-2)))-.1}px`),k(e,HTMLIFrameElement)&&n==="display"&&r==="inline"&&(r="block"),n==="d"&&t.getAttribute("d")&&(r=`path(${t.getAttribute("d")})`),o.setProperty(n,r,a.getPropertyPriority(n))})}function Aa(e,t){k(e,HTMLTextAreaElement)&&(t.innerHTML=e.value),k(e,HTMLInputElement)&&t.setAttribute("value",e.value)}function Ra(e,t){if(k(e,HTMLSelectElement)){let o=t,a=Array.from(o.children).find(n=>e.value===n.getAttribute("value"));a&&a.setAttribute("selected","")}}function Ba(e,t){return k(t,Element)&&(Ha(e,t),co(e,t),Aa(e,t),Ra(e,t)),t}async function $a(e,t){let o=e.querySelectorAll?e.querySelectorAll("use"):[];if(o.length===0)return e;let a={};for(let r=0;r<o.length;r++){let s=o[r].getAttribute("xlink:href");if(s){let u=e.querySelector(s),c=document.querySelector(s);!u&&c&&!a[s]&&(a[s]=await $e(c,t,!0))}}let n=Object.values(a);if(n.length){let r="http://www.w3.org/1999/xhtml",i=document.createElementNS(r,"svg");i.setAttribute("xmlns",r),i.style.position="absolute",i.style.width="0",i.style.height="0",i.style.overflow="hidden",i.style.display="none";let s=document.createElementNS(r,"defs");i.appendChild(s);for(let u=0;u<n.length;u++)s.appendChild(n[u]);e.appendChild(i)}return e}async function $e(e,t,o){return!o&&t.filter&&!t.filter(e)?null:Promise.resolve(e).then(a=>ka(a,t)).then(a=>Fa(e,a,t)).then(a=>Ba(e,a)).then(a=>$a(a,t))}var ho=/url\((['"]?)([^'"]+?)\1\)/g,Ia=/url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g,Oa=/src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;function za(e){let t=e.replace(/([.*+?^${}()|\[\]\/\\])/g,"\\$1");return new RegExp(`(url\\(['"]?)(${t})(['"]?\\))`,"g")}function Ua(e){let t=[];return e.replace(ho,(o,a,n)=>(t.push(n),o)),t.filter(o=>!Be(o))}async function Za(e,t,o,a,n){try{let r=o?no(t,o):t,i=Ce(t),s;if(n){let u=await n(r);s=Ct(u,i)}else s=await we(r,i,a);return e.replace(za(t),`$1${s}$3`)}catch{}return e}function qa(e,{preferredFontFormat:t}){return t?e.replace(Oa,o=>{for(;;){let[a,,n]=Ia.exec(o)||[];if(!n)return"";if(n===t)return`src: ${a};`}}):e}function Lt(e){return e.search(ho)!==-1}async function Ke(e,t,o){if(!Lt(e))return e;let a=qa(e,o);return Ua(a).reduce((r,i)=>r.then(s=>Za(s,i,t,o)),Promise.resolve(a))}async function Ye(e,t,o){var a;let n=(a=t.style)===null||a===void 0?void 0:a.getPropertyValue(e);if(n){let r=await Ke(n,null,o);return t.style.setProperty(e,r,t.style.getPropertyPriority(e)),!0}return!1}async function Ja(e,t){await Ye("background",e,t)||await Ye("background-image",e,t),await Ye("mask",e,t)||await Ye("mask-image",e,t)}async function _a(e,t){let o=k(e,HTMLImageElement);if(!(o&&!Be(e.src))&&!(k(e,SVGImageElement)&&!Be(e.href.baseVal)))return;let a=o?e.src:e.href.baseVal,n=await we(a,Ce(a),t);await new Promise((r,i)=>{e.onload=r,e.onerror=i;let s=e;s.decode&&(s.decode=r),s.loading==="lazy"&&(s.loading="eager"),o?(e.srcset="",e.src=n):e.href.baseVal=n})}async function Wa(e,t){let a=A(e.childNodes).map(n=>St(n,t));await Promise.all(a).then(()=>e)}async function St(e,t){k(e,Element)&&(await Ja(e,t),await _a(e,t),await Wa(e,t))}function fo(e,t){let{style:o}=e;t.backgroundColor&&(o.backgroundColor=t.backgroundColor),t.width&&(o.width=`${t.width}px`),t.height&&(o.height=`${t.height}px`);let a=t.style;return a!=null&&Object.keys(a).forEach(n=>{o[n]=a[n]}),e}var go={};async function vo(e){let t=go[e];if(t!=null)return t;let a=await(await fetch(e)).text();return t={url:e,cssText:a},go[e]=t,t}async function yo(e,t){let o=e.cssText,a=/url\(["']?([^"')]+)["']?\)/g,r=(o.match(/url\([^)]+\)/g)||[]).map(async i=>{let s=i.replace(a,"$1");return s.startsWith("https://")||(s=new URL(s,e.url).href),wt(s,t.fetchRequestInit,({result:u})=>(o=o.replace(i,`url(${u})`),[i,u]))});return Promise.all(r).then(()=>o)}function xo(e){if(e==null)return[];let t=[],o=/(\/\*[\s\S]*?\*\/)/gi,a=e.replace(o,""),n=new RegExp("((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})","gi");for(;;){let u=n.exec(a);if(u===null)break;t.push(u[0])}a=a.replace(n,"");let r=/@import[\s\S]*?url\([^)]*\)[\s\S]*?;/gi,i="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})",s=new RegExp(i,"gi");for(;;){let u=r.exec(a);if(u===null){if(u=s.exec(a),u===null)break;r.lastIndex=s.lastIndex}else s.lastIndex=r.lastIndex;t.push(u[0])}return t}async function Ga(e,t){let o=[],a=[];return e.forEach(n=>{if("cssRules"in n)try{A(n.cssRules||[]).forEach((r,i)=>{if(r.type===CSSRule.IMPORT_RULE){let s=i+1,u=r.href,c=vo(u).then(d=>yo(d,t)).then(d=>xo(d).forEach(h=>{try{n.insertRule(h,h.startsWith("@import")?s+=1:n.cssRules.length)}catch(b){console.error("Error inserting rule from remote css",{rule:h,error:b})}})).catch(d=>{console.error("Error loading remote css",d.toString())});a.push(c)}})}catch(r){let i=e.find(s=>s.href==null)||document.styleSheets[0];n.href!=null&&a.push(vo(n.href).then(s=>yo(s,t)).then(s=>xo(s).forEach(u=>{i.insertRule(u,n.cssRules.length)})).catch(s=>{console.error("Error loading remote stylesheet",s)})),console.error("Error inlining remote css file",r)}}),Promise.all(a).then(()=>(e.forEach(n=>{if("cssRules"in n)try{A(n.cssRules||[]).forEach(r=>{o.push(r)})}catch(r){console.error(`Error while reading CSS rules from ${n.href}`,r)}}),o))}function Qa(e){return e.filter(t=>t.type===CSSRule.FONT_FACE_RULE).filter(t=>Lt(t.style.getPropertyValue("src")))}async function Xa(e,t){if(e.ownerDocument==null)throw new Error("Provided element is not within a Document");let o=A(e.ownerDocument.styleSheets),a=await Ga(o,t);return Qa(a)}async function bo(e,t){let o=await Xa(e,t);return(await Promise.all(o.map(n=>{let r=n.parentStyleSheet?n.parentStyleSheet.href:null;return Ke(n.cssText,r,t)}))).join(`
2
- `)}async function Co(e,t){let o=t.fontEmbedCSS!=null?t.fontEmbedCSS:t.skipFonts?null:await bo(e,t);if(o){let a=document.createElement("style"),n=document.createTextNode(o);a.appendChild(n),e.firstChild?e.insertBefore(a,e.firstChild):e.appendChild(a)}}async function Ka(e,t={}){let{width:o,height:a}=xt(e,t),n=await $e(e,t,!0);return await Co(n,t),await St(n,t),fo(n,t),await uo(n,o,a)}async function Ya(e,t={}){let{width:o,height:a}=xt(e,t),n=await Ka(e,t),r=await be(n),i=document.createElement("canvas"),s=i.getContext("2d"),u=t.pixelRatio||io(),c=t.canvasWidth||o,d=t.canvasHeight||a;return i.width=c*u,i.height=d*u,t.skipAutoScale||so(i),i.style.width=`${c}`,i.style.height=`${d}`,t.backgroundColor&&(s.fillStyle=t.backgroundColor,s.fillRect(0,0,i.width,i.height)),s.drawImage(r,0,0,i.width,i.height),i}async function wo(e,t={}){return(await Ya(e,t)).toDataURL()}var Lo=e=>new Promise((t,o)=>{wo(e,{cacheBust:!0}).then(a=>{a||o(new Error("No Screenshot available")),t(a)}).catch(a=>{console.error("the following error occurred while taking a screenshot of a DOMNode",a),o(new Error("Error taking screenshot"))})});var E=require("@salt-ds/core"),U=require("react");var v=require("react/jsx-runtime"),R="saveLayoutPanel",je=`${R}-formField`,ja=["Group 1","Group 2","Group 3","Group 4","Group 5"],en=["Value 1","Value 2","Value 3"],So=["Value 1","Value 2","Value 3"],Pt=e=>{let{defaultTitle:t="",onCancel:o,onSave:a,componentId:n}=e,[r,i]=(0,U.useState)(t),[s,u]=(0,U.useState)(""),[c,d]=(0,U.useState)([]),[h,b]=(0,U.useState)(So[0]),[y,p]=(0,U.useState)(),[l,f]=(0,U.useState)(),[P]=Ve();(0,U.useEffect)(()=>{n&&Lo(document.getElementById(n)).then(g=>{p(g)}).catch(g=>{f(g.message)})},[n]);let B=()=>{a({name:r,group:s,screenshot:y!=null?y:"",user:P})},V=(0,U.useMemo)(()=>y?(0,v.jsx)("img",{className:`${R}-screenshot`,src:y,alt:"screenshot of current layout"}):l?(0,v.jsx)(E.Text,{children:l}):(0,v.jsx)("div",{className:"spinner"}),[y,l]);return(0,v.jsxs)("div",{className:`${R}-panelContainer`,children:[(0,v.jsxs)("div",{className:`${R}-panelContent`,children:[(0,v.jsxs)("div",{className:`${R}-formContainer`,children:[(0,v.jsxs)(E.FormField,{className:je,children:[(0,v.jsx)(E.FormFieldLabel,{children:"Group"}),(0,v.jsx)(Le.ComboBox,{source:ja,allowFreeText:!0,InputProps:{inputProps:{className:`${R}-inputText`,placeholder:"Select Group or Enter New Name",onChange:g=>u(g.target.value)}},width:"100%",onSelectionChange:(g,F)=>u(F||"")})]}),(0,v.jsxs)(E.FormField,{className:je,children:[(0,v.jsx)(E.FormFieldLabel,{children:"Layout Name"}),(0,v.jsx)(E.Input,{inputProps:{className:`${R}-inputText`,placeholder:"Enter Layout Name"},onChange:g=>i(g.target.value),value:r})]}),(0,v.jsxs)(E.FormField,{className:je,children:[(0,v.jsx)(E.FormFieldLabel,{children:"Some Layout Setting"}),(0,v.jsx)("div",{className:`${R}-settingsGroup`,children:en.map((g,F)=>(0,v.jsx)(Le.Checkbox,{onToggle:()=>d(T=>T.includes(g)?T.filter($=>$!==g):[...T,g]),checked:c.includes(g),label:g},F))})]}),(0,v.jsxs)(E.FormField,{className:je,children:[(0,v.jsx)(E.FormFieldLabel,{children:"Some Layout Setting"}),(0,v.jsx)("div",{className:`${R}-settingsGroup`,children:So.map((g,F)=>(0,v.jsx)(Le.RadioButton,{onClick:()=>b(g),checked:h===g,label:g,groupName:"radioGroup"},F))})]})]}),(0,v.jsx)("div",{className:`${R}-screenshotContainer`,children:V})]}),(0,v.jsxs)("div",{className:`${R}-buttonsContainer`,children:[(0,v.jsx)(E.Button,{className:`${R}-cancelButton`,onClick:o,children:"Cancel"}),(0,v.jsx)(E.Button,{className:`${R}-saveButton`,onClick:B,disabled:r===""||s==="",children:"Save"})]})]})};var Uo=require("@vuu-ui/vuu-ui-controls");var C=M(require("react")),Ue=require("@vuu-ui/vuu-layout");var No=M(require("clsx")),Do=require("@vuu-ui/vuu-utils"),le=require("react");var et=require("@salt-ds/core"),Po=M(require("clsx"));var Ie=require("react/jsx-runtime"),tn="vuuDialogHeader",To=({hideCloseButton:e=!1,title:t,onClose:o,...a})=>(0,Ie.jsxs)("div",{...a,className:(0,Po.default)(tn,"vuuToolbarProxy"),children:[(0,Ie.jsx)(et.Text,{className:"dialogHeader",children:t}),!e&&(0,Ie.jsx)(et.Button,{onClick:o,"data-align":"end","data-icon":"close",variant:"secondary"},"close")]});var te=require("react");var Tt=(e,t,o,a,n,r)=>{let{bottom:i,height:s,left:u,right:c,top:d,width:h}=e.getBoundingClientRect();switch(t){case"below":return{left:u+o,top:i+a};case"right":return{left:c+o,top:d+a};case"below-center":return{left:u+h/2+o,top:i+a};case"below-right":return{left:u,minWidth:n,top:i+a};case"below-full-width":return{left:u+o,minWidth:n,top:i+a,width:h};case"center":return r?{left:h/2-r.width/2+o,top:s/2-r.height/2+a,visibility:"visible"}:{left:h/2+o,top:s/2+a,visibility:"hidden"};default:throw Error(`Popup getPositionRelativeToAnchor non-supported placement value ${t}`)}};var Mo=({anchorElement:e,minWidth:t,offsetLeft:o=0,offsetTop:a=0,placement:n,position:r})=>{let i=(0,te.useRef)(null),[s,u]=(0,te.useState)(r);(0,te.useLayoutEffect)(()=>{if(n==="absolute"&&r)u(r);else if(e.current&&n!=="auto"){let d=i.current===null?void 0:i.current.getBoundingClientRect(),h=Tt(e.current,n,o,a,t,d);u(h)}},[e,t,o,a,n,r]);let c=(0,te.useCallback)(d=>{if(i.current=d,d&&n==="center"&&e.current){let{height:h,width:b}=d.getBoundingClientRect();u(Tt(e.current,n,o,a,void 0,{height:h,width:b}))}},[e,o,a,n]);return{position:s,popupRef:n==="center"?c:void 0}};var Se=require("react/jsx-runtime"),Eo="vuuDialog",on={current:document.body},an={},ko=({PopupProps:e=an,children:t,className:o,isOpen:a=!1,onClose:n,style:r,title:i,hideCloseButton:s=!1,...u})=>{let{anchorElement:c=on,offsetLeft:d=0,offsetTop:h=0,placement:b="auto"}=e,y=(0,le.useRef)(null),p=(0,le.useRef)(null),[l,f,P]=(0,Do.useThemeAttributes)(),{position:B}=Mo({anchorElement:c,offsetLeft:d,offsetTop:h,placement:b}),V=(0,le.useCallback)(()=>{n==null||n()},[n]);return(0,le.useLayoutEffect)(()=>{if(y.current){if(a){y.current.showModal();let{left:g,top:F}=y.current.getBoundingClientRect();p.current&&(p.current.style.cssText=`left:-${g}px;position:absolute;top:-${F}px;`)}else y.current.close();if(b.endsWith("center")){let{width:g}=y.current.getBoundingClientRect();y.current.style.marginLeft=`-${g/2}px`}}},[a,b]),(0,Se.jsxs)("dialog",{...u,className:(0,No.default)(Eo,l),"data-mode":P,onClose:V,id:"vuu-dialog",ref:y,style:{...r,...B},children:[(0,Se.jsx)(To,{hideCloseButton:s,onClose:V,title:i}),(0,Se.jsx)("div",{className:`${Eo}-body`,children:t}),(0,Se.jsx)("div",{id:"vuu-dialog-portal-root",ref:p})]})};var tt=require("react");var Fo=require("react/jsx-runtime"),Vo=()=>{let[e,t]=(0,tt.useState)(),o=(0,tt.useCallback)(()=>{t(void 0)},[]);return{dialog:e?(0,Fo.jsx)(ko,{className:"vuDialog",isOpen:!0,onClose:o,style:{maxHeight:500},title:e.title,hideCloseButton:e.hideCloseButton,children:e.content}):null,setDialogState:t}};var Pe=require("react"),ot=require("react/jsx-runtime"),Ho=(0,Pe.createContext)(null),nn=({children:e,context:t,menuActionHandler:o,menuBuilder:a})=>{let n=(0,Pe.useMemo)(()=>t!=null&&t.menuBuilders&&a?t.menuBuilders.concat(a):a?[a]:(t==null?void 0:t.menuBuilders)||[],[t,a]),r=(0,Pe.useCallback)(i=>{var s;if(o!=null&&o(i)||(s=t==null?void 0:t.menuActionHandler)!=null&&s.call(t,i))return!0},[t,o]);return(0,ot.jsx)(Ho.Provider,{value:{menuActionHandler:r,menuBuilders:n},children:e})},Ao=({children:e,label:t,menuActionHandler:o,menuBuilder:a})=>(0,ot.jsx)(Ho.Consumer,{children:n=>(0,ot.jsx)(nn,{context:n,label:t,menuActionHandler:o,menuBuilder:a,children:e})});var ce=M(require("react")),rn=M(require("clsx")),sn=require("@vuu-ui/vuu-utils");var Bo=require("react/jsx-runtime");var un=ce.default.createContext({notify:()=>"have you forgotten to provide a NotificationProvider?"});var Ro=()=>(0,ce.useContext)(un);var at={layout:{type:"Component",id:"loading-main",props:{}}},nt={layout:{type:"Stack",id:"main-tabs",props:{className:"vuuShell-mainTabs",TabstripProps:{allowAddTab:!0,allowCloseTab:!0,allowRenameTab:!0,animateSelectionThumb:!1,location:"main-tab",variant:"primary"},preserve:!0,active:0},children:[{props:{id:"tab1",title:"Tab 1",className:"vuuShell-Placeholder"},type:"Placeholder"}]}};var oe=require("@vuu-ui/vuu-filters");var it=require("@vuu-ui/vuu-utils");var ln="layouts/metadata",cn="layouts/layouts",Te,rt=class{constructor(t){this.username=Ve()[0];this.metadataSaveLocation=`${ln}/${this.username}`;this.layoutsSaveLocation=`${cn}/${this.username}`;Ut(this,Te,`api/vui/${this.username}`);this.loadLayouts=()=>new Promise(t=>{let o=(0,oe.getLocalEntity)(this.layoutsSaveLocation);t(o||[])});this.saveLayoutsWithMetadata=(t,o)=>{(0,oe.saveLocalEntity)(this.layoutsSaveLocation,t),(0,oe.saveLocalEntity)(this.metadataSaveLocation,o)};this.validateIds=async t=>Promise.all([this.validateId(t,"metadata").catch(o=>o.message),this.validateId(t,"layout").catch(o=>o.message)]).then(o=>{let a=o.filter(n=>n!==void 0).join("; ");if(a)throw new Error(a)});this.validateId=(t,o)=>new Promise((a,n)=>{(o==="metadata"?()=>this.loadMetadata():()=>this.loadLayouts())().then(i=>{switch(i.filter(u=>u.id===t).length){case 1:{a();break}case 0:{n(new Error(`No ${o} with ID ${t}`));break}default:n(new Error(`Non-unique ${o} with ID ${t}`))}})});t&&Zt(this,Te,t)}createLayout(t,o){return new Promise(a=>{Promise.all([this.loadLayouts(),this.loadMetadata()]).then(([n,r])=>{let i=(0,it.getUniqueId)(),s={...t,id:i,created:(0,it.formatDate)({date:"dd.mm.yyyy"})(new Date)};this.saveLayoutsWithMetadata([...n,{id:i,json:o}],[...r,s]),a(s)})})}updateLayout(t,o,a){return new Promise((n,r)=>{this.validateIds(t).then(()=>Promise.all([this.loadLayouts(),this.loadMetadata()])).then(([i,s])=>{let u=i.map(d=>d.id===t?{...d,json:a}:d),c=s.map(d=>d.id===t?{...d,...o}:d);this.saveLayoutsWithMetadata(u,c),n()}).catch(i=>r(i))})}deleteLayout(t){return new Promise((o,a)=>{this.validateIds(t).then(()=>Promise.all([this.loadLayouts(),this.loadMetadata()])).then(([n,r])=>{let i=n.filter(u=>u.id!==t),s=r.filter(u=>u.id!==t);this.saveLayoutsWithMetadata(i,s),o()}).catch(n=>a(n))})}loadLayout(t){return new Promise((o,a)=>{this.validateId(t,"layout").then(()=>this.loadLayouts()).then(n=>{let r=n.find(i=>i.id===t);r?o(r.json):a(new Error(`no layout found matching id ${t}`))}).catch(n=>a(n))})}loadMetadata(){return new Promise(t=>{let o=(0,oe.getLocalEntity)(this.metadataSaveLocation);t(o||[])})}loadApplicationJSON(){return new Promise(t=>{let o=(0,oe.getLocalEntity)(ft(this,Te));t(o||nt)})}saveApplicationJSON(t){return new Promise((o,a)=>{(0,oe.saveLocalEntity)(ft(this,Te),t)?o():a(new Error("Application Json failed to save"))})}};Te=new WeakMap;var Oe=require("react");var Io=require("react/jsx-runtime"),$o=e=>{let{saveLayout:t}=de(),o=(0,Oe.useCallback)(()=>{e(void 0)},[e]),a=(0,Oe.useCallback)(i=>{t(i),e(void 0)},[t,e]),[n,r]=(0,Oe.useMemo)(()=>[(i,s)=>{let u=i.split(" "),c=[];return u.includes("main-tab")&&c.push({label:"Save Layout",action:"save-layout",options:s},{label:"Layout Settings",action:"layout-settings",options:s}),c},i=>{var s,u;return console.log("menu action",{action:i}),i.menuId==="save-layout"?(e({content:(0,Io.jsx)(Pt,{onCancel:o,onSave:a,componentId:(s=i.options)==null?void 0:s.controlledComponentId,defaultTitle:(u=i.options)==null?void 0:u.controlledComponentTitle}),title:"Save Layout",hideCloseButton:!0}),!0):!1}],[o,a,e]);return{buildMenuOptions:n,handleMenuAction:r}};var Oo=require("react/jsx-runtime"),Mt,ze=()=>(Mt===void 0&&(Mt=new rt),Mt),Et=C.default.createContext({getApplicationSettings:()=>{},layoutMetadata:[],saveLayout:()=>{},applicationJson:nt,saveApplicationLayout:()=>{},saveApplicationSettings:()=>{},loadLayoutById:()=>{}}),dn=(e,t)=>{var o;return((o=e.props)==null?void 0:o.title)!==void 0?e:{...e,props:{...e.props,title:t.name}}},pn=e=>{let[t,o]=(0,C.useState)([]),[,a]=(0,C.useState)({}),{notify:n}=Ro(),r=(0,C.useRef)(at),i=(0,C.useCallback)((p,l=!0)=>{r.current=p,l&&a({})},[]),s=(0,C.useCallback)((p,l=!0)=>{i({...r.current,layout:p},l)},[i]),u=(0,C.useCallback)(p=>{i({...r.current,settings:{...r.current.settings,...p}},!1)},[i]);(0,C.useEffect)(()=>{let p=ze();p.loadMetadata().then(l=>{o(l)}).catch(l=>{n({type:"error",header:"Failed to Load Layouts",body:"Could not load list of available layouts"}),console.error("Error occurred while retrieving metadata",l)}),p.loadApplicationJSON().then(l=>{i(l)}).catch(l=>{n({type:"error",header:"Failed to Load Layout",body:"Could not load your latest view"}),console.error("Error occurred while retrieving application layout",l)})},[n,i]);let c=(0,C.useCallback)(p=>{(0,Ue.isLayoutJSON)(p)?(s(p,!1),ze().saveApplicationJSON(r.current)):console.error("Tried to save invalid application layout",p)},[s]),d=(0,C.useCallback)(p=>{let l=(0,Ue.resolveJSONPath)(r.current.layout,"#main-tabs.ACTIVE_CHILD");l&&(0,Ue.isLayoutJSON)(l)?ze().createLayout(p,dn(l,p)).then(f=>{n({type:"success",header:"Layout Saved Successfully",body:`${f.name} saved successfully`}),o(P=>[...P,f])}).catch(f=>{n({type:"error",header:"Failed to Save Layout",body:`Failed to save layout ${p.name}`}),console.error("Error occurred while saving layout",f)}):(console.error("Tried to save invalid layout",l),n({type:"error",header:"Failed to Save Layout",body:"Cannot save invalid layout"}))},[n]),h=(0,C.useCallback)((p,l)=>{let{settings:f}=r.current;u(l?{...f,[l]:p}:p),ze().saveApplicationJSON(r.current)},[u]),b=(0,C.useCallback)(p=>{let{settings:l}=r.current;return p?l==null?void 0:l[p]:l},[]),y=(0,C.useCallback)(p=>{ze().loadLayout(p).then(l=>{var P,B;let{layout:f}=r.current;s({...f,children:(f.children||[]).concat(l),props:{...f.props,active:(B=(P=f.children)==null?void 0:P.length)!=null?B:0}})}).catch(l=>{n({type:"error",header:"Failed to Load Layout",body:"Failed to load the requested layout"}),console.error("Error occurred while loading layout",l)})},[n,s]);return(0,Oo.jsx)(Et.Provider,{value:{getApplicationSettings:b,layoutMetadata:t,saveLayout:d,applicationJson:r.current,saveApplicationLayout:c,saveApplicationSettings:h,loadLayoutById:y},children:e.children})},de=()=>(0,C.useContext)(Et);var X=require("react/jsx-runtime"),st="vuuLayoutTile",zo=e=>{let{metadata:t,handleLoadLayout:o}=e;return(0,X.jsx)("div",{role:"listitem",children:(0,X.jsxs)("div",{className:`${st}-layoutTile`,role:"button",onClick:()=>o(t==null?void 0:t.id),children:[(0,X.jsx)("img",{className:`${st}-screenshot`,src:t==null?void 0:t.screenshot}),(0,X.jsxs)("div",{children:[(0,X.jsx)("div",{className:`${st}-layoutName`,children:t==null?void 0:t.name}),(0,X.jsx)("div",{className:`${st}-layoutDetails`,children:(0,X.jsx)("div",{children:`${t==null?void 0:t.user}, ${t==null?void 0:t.created}`})})]})]},t==null?void 0:t.id)})};var Z=require("react/jsx-runtime"),Nt="vuuLayoutList",Dt=e=>{let{layoutMetadata:t,loadLayoutById:o}=de(),a=r=>{r&&o(r)},n=t.reduce((r,i)=>r[i.group]?{...r,[i.group]:[...r[i.group],i]}:{...r,[i.group]:[i]},{});return(0,Z.jsxs)("div",{className:Nt,...e,role:"listbox","aria-label":"my layouts",children:[(0,Z.jsx)("div",{className:`${Nt}-header`,children:"My Layouts"}),(0,Z.jsx)(Uo.List,{height:"auto",source:Object.entries(n),ListItem:({item:r})=>{if(!r)return(0,Z.jsx)(Z.Fragment,{});let[i,s]=r;return(0,Z.jsxs)("div",{role:"list","aria-label":i,children:[(0,Z.jsx)("div",{className:`${Nt}-groupName`,children:i}),s.map(u=>(0,Z.jsx)(zo,{metadata:u,handleLoadLayout:a},u.id))]})}})]})};var Zo=require("@vuu-ui/vuu-icons"),dt=require("@vuu-ui/vuu-layout"),pe=require("@vuu-ui/vuu-ui-controls"),qo=require("@vuu-ui/vuu-utils"),ct=M(require("clsx")),Ee=require("react");var ut=require("@vuu-ui/vuu-layout");var ae=require("react/jsx-runtime"),kt="vuuFeatureList",lt=({features:e,title:t="VUU TABLES",...o})=>{let a={},n={height:"100%"};return(0,ae.jsxs)("div",{...o,className:kt,children:[(0,ae.jsx)("div",{className:`${kt}-header`,children:t}),(0,ae.jsx)("div",{className:`${kt}-content`,children:(0,ae.jsx)(ut.Palette,{orientation:"vertical",ListProps:n,ViewProps:a,children:e.map((r,i)=>(0,ae.jsx)(ut.PaletteItem,{closeable:!0,label:r.title,resizeable:!0,resize:"defer",header:!0,children:(0,ae.jsx)(Re,{...r})},i))})})]})};var L=require("react/jsx-runtime"),Me="vuuLeftNav",mn=(e,t)=>e===0?t?"menu-full":"menu-icons":t?"menu-full-content":"menu-icons-content",hn=e=>{let t=(0,dt.useLayoutProviderDispatch)(),[o]=(0,qo.useThemeAttributes)(),{"data-path":a,defaultExpanded:n=!0,defaultActiveTabIndex:r=0,features:i,onActiveChange:s,onTogglePrimaryMenu:u,sizeCollapsed:c=80,sizeContent:d=300,sizeExpanded:h=240,style:b,tableFeatures:y,...p}=e,[l,f]=(0,Ee.useState)({activeTabIndex:r,expanded:n}),P=(0,Ee.useCallback)((T,$)=>T===0?$?h:c:$?h+d:c+d,[c,d,h]),B=(0,Ee.useCallback)(T=>{let{activeTabIndex:$,expanded:_}=l;if(f({activeTabIndex:T,expanded:_}),T===0||$===0){let w=P(T,_);t({type:"layout-resize",path:"#vuu-side-panel",size:w})}s==null||s(T)},[t,P,l,s]),V=mn(l.activeTabIndex,l.expanded),g=(0,Ee.useCallback)(()=>{let{activeTabIndex:T,expanded:$}=l,_=!$;f({activeTabIndex:T,expanded:_}),t({type:"layout-resize",path:"#vuu-side-panel",size:P(T,_)}),u==null||u(_)},[t,P,l,u]),F={...b,"--nav-menu-collapsed-width":`${c}px`,"--nav-menu-expanded-width":`${h}px`,"--nav-menu-content-width":`${d}px`};return(0,L.jsxs)("div",{...p,className:(0,ct.default)(Me,`${Me}-${V}`),style:F,children:[(0,L.jsxs)("div",{className:(0,ct.default)(`${Me}-menu-primary`,o),"data-mode":"dark",children:[(0,L.jsx)("div",{className:"vuuLeftNav-logo",children:(0,L.jsx)(Zo.VuuLogo,{})}),(0,L.jsx)("div",{className:`${Me}-main`,children:(0,L.jsxs)(pe.Tabstrip,{activeTabIndex:l.activeTabIndex,animateSelectionThumb:!1,className:`${Me}-Tabstrip`,onActiveChange:B,orientation:"vertical",children:[(0,L.jsx)(pe.Tab,{"data-icon":"demo",label:"DEMO"}),(0,L.jsx)(pe.Tab,{"data-icon":"features",label:"VUU FEATURES"}),(0,L.jsx)(pe.Tab,{"data-icon":"tables",label:"VUU TABLES"}),(0,L.jsx)(pe.Tab,{"data-icon":"layouts",label:"MY LAYOUTS"})]})}),(0,L.jsx)("div",{className:"vuuLeftNav-buttonBar",children:(0,L.jsx)("button",{className:(0,ct.default)("vuuLeftNav-toggleButton",{"vuuLeftNav-toggleButton-open":V.startsWith("menu-full"),"vuuLeftNav-toggleButton-closed":V.startsWith("menu-icons")}),"data-icon":V.startsWith("menu-full")?"chevron-left":"chevron-right",onClick:g})})]}),(0,L.jsxs)(dt.Stack,{active:l.activeTabIndex-1,className:`${Me}-menu-secondary`,showTabs:!1,children:[(0,L.jsx)(lt,{features:i,title:"VUU FEATURES"}),(0,L.jsx)(lt,{features:y,title:"VUU TABLES"}),(0,L.jsx)("div",{className:"vuuLeftNav-drawer",children:(0,L.jsx)(Dt,{})})]})]})};var Go=require("@vuu-ui/vuu-data-remote"),q=require("@vuu-ui/vuu-utils"),Ze=require("@salt-ds/core"),Vt=M(require("clsx")),S=require("react");var I=require("react/jsx-runtime"),K="vuuSessionEditingForm",Jo=(e,t)=>{let o=e.find(a=>a.name===t);if(o)return o;throw Error(`SessionEditingForm, no field '${t}' found`)},_o=e=>{let{dataset:{field:t},value:o}=e.target;if(t===void 0)throw Error("SessionEditingForm, form field has no field name");return[t,o]},Y={uninitialised:0,unchanged:1,changed:2,invalid:3};function Wo(e,t,o=!1){switch(t){case"int":case"long":{let a=parseInt(e,10);if((0,q.isValidNumber)(a))return a;if(o)throw Error("SessionEditingForm getTypedValue");return}case"double":{let a=parseFloat(e);return(0,q.isValidNumber)(a)?a:void 0}case"boolean":return e==="true";default:return e}}var fn=(e,t)=>{if(e)return e;if(t)return new Go.VuuDataSource({bufferSize:0,table:t.table,columns:t.columns.map(o=>o.name)});throw Error("SessionEditingForm: either a DataSource or a TableSchema must be provided")},gn=({className:e,config:{fields:t,key:o},dataSource:a,id:n,onClose:r,schema:i,...s})=>{let[u,c]=(0,S.useState)(),[d,h]=(0,S.useState)(""),b=(0,S.useRef)(null),y=(0,S.useRef)(),p=(0,S.useRef)(Y.uninitialised),l=(0,S.useMemo)(()=>{let m=z=>{if(O){let N={};for(let ye of l.columns)N[ye]=z[O[ye]];p.current===Y.uninitialised&&(p.current=Y.unchanged,y.current=N),c(N)}},w=fn(a,i),O=(0,q.buildColumnMap)(w.columns);return w.subscribe({range:{from:0,to:5}},z=>{z.type==="viewport-update"&&z.rows&&(p.current===Y.uninitialised?m(z.rows[0]):console.log("what do we do with server updates"))}),w},[a,i]),f=(0,Ze.useIdMemo)(n),P=(0,S.useCallback)(m=>{let[w,O]=_o(m),{type:z}=Jo(t,w),N=Wo(O,z);c((ye={})=>{let It={...ye,[w]:N},ra=(0,q.shallowEquals)(It,y.current);return p.current=ra?Y.unchanged:N!==void 0?Y.changed:Y.invalid,It})},[t]),B=(0,S.useCallback)(m=>{let[w,O]=_o(m),{type:z}=Jo(t,w),N=u==null?void 0:u[o],ye=Wo(O,z,!0);typeof N=="string"&&l.menuRpcCall({rowKey:N,field:w,value:ye,type:"VP_EDIT_CELL_RPC"})},[l,t,o,u]),V=(0,S.useCallback)(m=>{typeof m=="object"&&m!==null&&"type"in m&&m.type==="CLOSE_DIALOG_ACTION"&&r()},[r]),g=(0,S.useCallback)(async()=>{let m=await l.menuRpcCall({type:"VP_EDIT_SUBMIT_FORM_RPC"});(0,q.isErrorResponse)(m)?h(m.error):(0,q.hasAction)(m)&&V(m.action)},[V,l]),F=(0,S.useCallback)(m=>{m.key==="Enter"&&p.current===Y.changed&&g()},[g]),T=(0,S.useCallback)(()=>{r()},[r]),$=m=>{var O;let w=String((O=u==null?void 0:u[m.name])!=null?O:"");return m.readonly||m.name===o?(0,I.jsx)("div",{className:`${K}-fieldValue vuuReadOnly`,children:w}):(0,I.jsx)("input",{className:`${K}-fieldValue`,"data-field":m.name,onBlur:B,onChange:P,type:"text",value:w,id:`${f}-input-${m.name}`})};(0,S.useEffect)(()=>{if(b.current){let m=b.current.querySelector("input");m&&setTimeout(()=>{m.focus(),m.select()},100)}},[]),(0,S.useEffect)(()=>()=>{l&&l.unsubscribe()},[l]);let _=p.current===Y.changed;return(0,I.jsxs)("div",{...s,className:(0,Vt.default)(K,e),children:[d?(0,I.jsx)("div",{className:`${K}-errorBanner`,"data-icon":"error",title:d,children:"Error, edit(s) not saved"}):void 0,(0,I.jsx)("div",{className:`${K}-content`,ref:b,onKeyDown:F,children:t.map(m=>{var w;return(0,I.jsxs)("div",{className:`${K}-field`,children:[(0,I.jsx)("label",{className:(0,Vt.default)(`${K}-fieldLabel`,{[`${K}-required`]:m.required}),htmlFor:`${f}-input-${m.name}`,children:(w=m==null?void 0:m.label)!=null?w:m.description}),$(m)]},m.name)})}),(0,I.jsxs)("div",{className:`${K}-buttonbar salt-theme salt-density-high`,children:[(0,I.jsx)(Ze.Button,{type:"submit",variant:"cta",disabled:!_,onClick:g,children:"Submit"}),(0,I.jsx)(Ze.Button,{variant:"secondary",onClick:T,children:"Cancel"})]})]})};var ta=require("@vuu-ui/vuu-data-remote"),De=require("@vuu-ui/vuu-layout");var ke=require("@vuu-ui/vuu-utils"),oa=M(require("clsx")),j=require("react");var Qo=require("@salt-ds/core"),Ft=M(require("clsx")),pt=require("react"),Ne=require("@vuu-ui/vuu-layout");var ne=require("react/jsx-runtime"),J="vuuContextPanel",Ht=({className:e,expanded:t=!1,content:o,overlay:a=!1,title:n})=>{let r=(0,Ne.useLayoutProviderDispatch)(),i=(0,pt.useCallback)(()=>{r({path:"#context-panel",propName:"expanded",propValue:!1,type:"set-prop"})},[r]),s=(0,Ft.default)(J,e,{[`${J}-expanded`]:t,[`${J}-inline`]:a!==!0,[`${J}-overlay`]:a}),u=(0,pt.useMemo)(()=>o&&t?(0,Ne.layoutFromJson)(o,"context-0"):null,[o,t]);return(0,ne.jsx)("div",{className:(0,Ft.default)(J,s,{[`${J}-expanded`]:t}),children:(0,ne.jsxs)(Ne.View,{className:`${J}-inner`,header:!1,id:"context-panel",children:[(0,ne.jsxs)("div",{className:`${J}-header`,children:[(0,ne.jsx)("h2",{className:`${J}-title`,children:n}),(0,ne.jsx)(Qo.Button,{className:`${J}-close`,"data-icon":"close",onClick:i,variant:"secondary"})]}),(0,ne.jsx)("div",{className:`${J}-content`,children:u})]})})};var qe=require("@vuu-ui/vuu-layout");var Xo=require("react"),Ko=M(require("clsx"));var Yo=require("react/jsx-runtime"),vn="vuuShellSidePanel",At=({children:e,open:t=!0,sizeClosed:o=90,sizeOpen:a=200,style:n,...r})=>{let i=(0,Xo.useMemo)(()=>({...n,"--shell-left-nav-size":t?`${a}px`:`${o}px`}),[t,o,a,n]);return(0,Yo.jsx)("div",{...r,className:(0,Ko.default)(vn),style:i,children:e})};var me=require("react/jsx-runtime"),jo=({appHeader:e,LeftSidePanelProps:t})=>(0,me.jsxs)(qe.Flexbox,{className:"App",style:{flexDirection:"row",height:"100%",width:"100%"},children:[(0,me.jsx)(At,{...t,id:"vuu-side-panel"}),(0,me.jsxs)(qe.Flexbox,{className:"vuuShell-content",style:{flex:1,flexDirection:"column"},children:[e,(0,me.jsx)(qe.DraggableLayout,{dropTarget:!0,style:{flex:1}},"main-content")]}),(0,me.jsx)(Ht,{id:"context-panel",overlay:!0})]});var G=require("@vuu-ui/vuu-layout"),fe=require("react"),he=require("react/jsx-runtime"),ea=({appHeader:e,LeftSidePanelProps:t})=>{let o=(0,fe.useRef)(null),[a,n]=(0,fe.useState)(!0),r=(0,fe.useCallback)(s=>{var c;let u=s.target;(c=o.current)!=null&&c.contains(u)||n(!a)},[a]),i=(0,fe.useCallback)(s=>{let u=[];return u.push((0,he.jsx)(G.Drawer,{onClick:r,open:a,position:"left",inline:!0,peekaboo:!0,sizeOpen:200,toggleButton:"end",children:(0,he.jsx)(G.View,{className:"vuuShell-palette",id:"vw-app-palette",ref:o,style:{height:"100%"},children:s},"app-palette")},"left-panel")),u},[r,a]);return(0,he.jsxs)(G.Flexbox,{className:"App",style:{flexDirection:"column",height:"100%",width:"100%"},children:[e,(0,he.jsx)(G.DockLayout,{style:{flex:1},children:i(t==null?void 0:t.children).concat((0,he.jsx)(G.DraggableLayout,{dropTarget:!0,style:{width:"100%",height:"100%"}},"main-content"))})]})};var Rt=({leftSidePanelLayout:e="inlay",...t})=>(e==="inlay"?ea:jo)(t);var ge=require("react/jsx-runtime");typeof De.StackLayout!="function"&&console.warn("StackLayout module not loaded, will be unsbale to deserialize from layout JSON");var{error:Bt}=(0,ke.logger)("Shell"),yn={},xn=({LayoutProps:e,LeftSidePanelProps:t=yn,children:o,className:a,leftSidePanelLayout:n,loginUrl:r,saveLocation:i,saveUrl:s,serverUrl:u,user:c,...d})=>{let h=(0,j.useRef)(null),{dialog:b,setDialogState:y}=Vo(),p=(0,j.useRef)("latest"),{applicationJson:l,saveApplicationLayout:f,loadLayoutById:P}=de(),{buildMenuOptions:B,handleMenuAction:V}=$o(y),g=(0,j.useCallback)(N=>{try{f(N)}catch{Bt==null||Bt("Failed to save layout")}},[f]),F=(0,j.useCallback)(N=>{h.current&&(h.current.dataset.mode=N)},[]),T=(0,j.useCallback)(N=>{p.current=N,P(N)},[P]);(0,j.useEffect)(()=>{u&&c.token&&(0,ta.connectToServer)({authToken:c.token,url:u,username:c.username})},[u,c.token,c.username]);let[$,_,m]=(0,ke.useThemeAttributes)(),w=(0,oa.default)("vuuShell",a,$,_),O=l===at,z=Rt({LeftSidePanelProps:t,leftSidePanelLayout:n,appHeader:(0,ge.jsx)(yt,{layoutId:p.current,loginUrl:r,user:c,onNavigate:T,onSwitchTheme:F})});return O?null:(0,ge.jsx)(ke.ThemeProvider,{children:(0,ge.jsxs)(Ao,{menuActionHandler:V,menuBuilder:B,children:[(0,ge.jsx)(De.LayoutProvider,{...e,layout:l.layout,onLayoutChange:g,children:(0,ge.jsx)(De.DraggableLayout,{className:w,"data-mode":m,ref:h,...d,children:z})}),o||b]})})};var bn=e=>e==="*",Cn=e=>typeof e=="object"&&typeof e.module=="string"&&typeof e.table=="string";var ht=require("react"),mt=require("react/jsx-runtime"),wn={},$t=(0,ht.createContext)(wn),Ln=({children:e,context:t,inheritedContext:o})=>{let a={...o,...t};return(0,mt.jsx)($t.Provider,{value:a,children:e})},Sn=({children:e,value:t})=>(0,mt.jsx)($t.Consumer,{children:o=>(0,mt.jsx)(Ln,{context:t,inheritedContext:o,children:e})}),Pn=()=>(0,ht.useContext)($t);var aa=M(require("clsx")),ve=require("@salt-ds/core"),na=require("react");var Je=require("react/jsx-runtime"),Tn="vuuThemeSwitch",Mn=({className:e,defaultMode:t,mode:o,onChange:a,...n})=>{let[r,i]=(0,ve.useControlled)({controlled:o,default:t!=null?t:"light",name:"ThemeSwitch",state:"mode"}),s=(0,na.useCallback)(c=>{let{value:d}=c.target;i(d),a(d)},[a,i]),u=(0,aa.default)(Tn,e);return(0,Je.jsxs)(ve.ToggleButtonGroup,{className:u,...n,onChange:s,value:r,children:[(0,Je.jsx)(ve.ToggleButton,{"aria-label":"alert","data-icon":"light",value:"light"}),(0,Je.jsx)(ve.ToggleButton,{"aria-label":"home","data-icon":"dark",value:"dark"})]})};
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var __accessCheck = (obj, member, msg) => {
30
+ if (!member.has(obj))
31
+ throw TypeError("Cannot " + msg);
32
+ };
33
+ var __privateGet = (obj, member, getter) => {
34
+ __accessCheck(obj, member, "read from private field");
35
+ return getter ? getter.call(obj) : member.get(obj);
36
+ };
37
+ var __privateAdd = (obj, member, value) => {
38
+ if (member.has(obj))
39
+ throw TypeError("Cannot add the same private member more than once");
40
+ member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
41
+ };
42
+ var __privateSet = (obj, member, value, setter) => {
43
+ __accessCheck(obj, member, "write to private field");
44
+ setter ? setter.call(obj, value) : member.set(obj, value);
45
+ return value;
46
+ };
47
+
48
+ // src/index.ts
49
+ var src_exports = {};
50
+ __export(src_exports, {
51
+ AppHeader: () => AppHeader,
52
+ ConnectionStatusIcon: () => ConnectionStatusIcon,
53
+ ContextPanel: () => ContextPanel,
54
+ Feature: () => Feature,
55
+ FeatureList: () => FeatureList,
56
+ LayoutList: () => LayoutList,
57
+ LayoutManagementContext: () => LayoutManagementContext,
58
+ LayoutManagementProvider: () => LayoutManagementProvider,
59
+ LeftNav: () => LeftNav,
60
+ LoginPanel: () => LoginPanel,
61
+ SaveLayoutPanel: () => SaveLayoutPanel,
62
+ SessionEditingForm: () => SessionEditingForm,
63
+ Shell: () => Shell,
64
+ ShellContextProvider: () => ShellContextProvider,
65
+ SidePanel: () => SidePanel,
66
+ ThemeSwitch: () => ThemeSwitch,
67
+ getAuthDetailsFromCookies: () => getAuthDetailsFromCookies,
68
+ getAuthModeFromCookies: () => getAuthModeFromCookies,
69
+ isTableSchema: () => isTableSchema,
70
+ isWildcardSchema: () => isWildcardSchema,
71
+ logout: () => logout,
72
+ redirectToLogin: () => redirectToLogin,
73
+ useLayoutManager: () => useLayoutManager,
74
+ useShellContext: () => useShellContext,
75
+ useShellLayout: () => useShellLayout
76
+ });
77
+ module.exports = __toCommonJS(src_exports);
78
+
79
+ // src/app-header/AppHeader.tsx
80
+ var import_react3 = require("react");
81
+ var import_vuu_ui_controls2 = require("@vuu-ui/vuu-ui-controls");
82
+ var import_clsx2 = __toESM(require("clsx"));
83
+
84
+ // src/login/LoginPanel.tsx
85
+ var import_react2 = require("react");
86
+ var import_core = require("@salt-ds/core");
87
+ var import_vuu_ui_controls = require("@vuu-ui/vuu-ui-controls");
88
+
89
+ // src/login/VuuLogo.tsx
90
+ var import_react = require("react");
91
+ var import_jsx_runtime = require("react/jsx-runtime");
92
+ var VuuLogo = () => {
93
+ const logo = (0, import_react.useMemo)(
94
+ () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
95
+ "svg",
96
+ {
97
+ width: "184",
98
+ height: "90",
99
+ viewBox: "0 0 184 90",
100
+ fill: "none",
101
+ xmlns: "http://www.w3.org/2000/svg",
102
+ children: [
103
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { clipPath: "url(#clip0_1173_59965)", children: [
104
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
105
+ "path",
106
+ {
107
+ d: "M77.0775 31.1019L69.4572 15.1795L66.3997 13.7093L47.6353 44.165L75.7224 61.2361L81.8124 51.2694L77.0775 31.1019Z",
108
+ fill: "url(#paint0_linear_1173_59965)"
109
+ }
110
+ ),
111
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
112
+ "path",
113
+ {
114
+ d: "M82.4101 49.7431C81.0488 51.8314 79.1993 53.648 76.8897 54.9809C74.2954 56.4792 71.4601 57.194 68.6623 57.194C63.3422 57.194 58.1597 54.6188 55.0209 49.971L30.5358 7.8193L30.5232 7.84116C25.8791 0.274825 16.0118 -2.26289 8.27258 2.21011C0.411306 6.74866 -2.26753 16.7872 2.28587 24.625L35.5054 81.8189C36.9856 84.3691 39.0542 86.3668 41.4358 87.7527C41.4545 87.7652 41.4733 87.7777 41.4921 87.7902C41.5015 87.7964 41.514 87.8027 41.5234 87.8089C42.6312 88.4457 43.8079 88.942 45.0253 89.3072C45.116 89.3353 45.2099 89.3634 45.3007 89.3883C45.7388 89.5101 46.1801 89.6193 46.6276 89.7067C46.7121 89.7223 46.7966 89.7317 46.8811 89.7473C47.241 89.8097 47.604 89.8628 47.967 89.9003C48.111 89.9159 48.2549 89.9315 48.3989 89.9408C48.8151 89.9752 49.2313 89.997 49.6507 90.0001C49.6726 90.0001 49.6945 90.0001 49.7132 90.0001C49.7195 90.0001 49.7226 90.0001 49.7289 90.0001C49.7352 90.0001 49.7383 90.0001 49.7445 90.0001C50.1983 90.0001 50.6552 89.9752 51.109 89.9377C51.2123 89.9283 51.3155 89.919 51.422 89.9065C51.8663 89.8597 52.3107 89.8004 52.7551 89.7192C52.7614 89.7192 52.7676 89.7192 52.7739 89.7192C53.2621 89.6287 53.7503 89.5101 54.2322 89.3727C54.2635 89.3634 54.2917 89.354 54.323 89.3446C55.024 89.1418 55.7156 88.8889 56.3978 88.5861C56.4104 88.5799 56.426 88.5736 56.4385 88.5674C56.958 88.3364 57.4712 88.0836 57.9751 87.7933C58.4852 87.4999 58.9703 87.1815 59.4334 86.8413C59.8371 86.5478 60.2252 86.2357 60.6039 85.9048C61.0639 85.499 61.4989 85.0745 61.9026 84.6282C62.2062 84.2942 62.4972 83.9446 62.7757 83.5825C62.8665 83.4639 62.951 83.3421 63.0355 83.2235C63.2264 82.9613 63.4079 82.6929 63.5831 82.4182C63.6739 82.2746 63.7646 82.1342 63.8523 81.9906C63.8867 81.9344 63.9242 81.8813 63.9555 81.8251L82.5854 49.7525H82.4039L82.4101 49.7431Z",
115
+ fill: "url(#paint1_linear_1173_59965)"
116
+ }
117
+ ),
118
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
119
+ "path",
120
+ {
121
+ d: "M82.8264 32.8436L81.4181 30.4464L75.3375 19.1687L72.5178 14.3929C71.9858 13.1225 70.7309 12.2266 69.26 12.2266C67.3104 12.2266 65.7331 13.8029 65.7331 15.7445C65.7331 16.4031 65.924 17.0086 66.2401 17.5362L66.2025 17.5611L77.1557 36.1617C78.4764 38.4372 78.83 41.0873 78.1509 43.6281C77.4718 46.169 75.8445 48.2915 73.5631 49.6119C72.0609 50.4797 70.3553 50.9385 68.6341 50.9385C65.1166 50.9385 61.84 49.0563 60.0812 46.0285L44.3368 19.2654H44.3681L37.7179 7.81917L37.7054 7.84102C37.5896 7.65061 37.455 7.47893 37.333 7.29477L37.1452 6.97326C37.1452 6.97326 37.1296 6.98262 37.1233 6.98887C34.0001 2.55332 29.0054 0.0780356 23.8512 0.0187285V0H15.3515V0.0436999C21.2881 -0.368328 27.2247 2.46593 30.5232 7.84102L30.5357 7.81917L55.0177 49.974C58.1566 54.6187 63.3422 57.197 68.6592 57.197C71.4569 57.197 74.2922 56.4853 76.8866 54.9839C79.1961 53.651 81.0425 51.8312 82.407 49.7461H82.5885L82.5259 49.8523C83.399 48.4695 84.0687 46.9462 84.5006 45.3231C85.6304 41.0904 85.042 36.6705 82.8201 32.8467L82.8264 32.8436Z",
122
+ fill: "#F37880"
123
+ }
124
+ ),
125
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { opacity: "0.86", children: [
126
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
127
+ "path",
128
+ {
129
+ d: "M66.1994 17.5642L77.1526 36.1648C78.4732 38.4403 78.8269 41.0904 78.1478 43.6313C77.7347 45.1795 76.9648 46.5716 75.9133 47.7234C77.2903 46.4686 78.2823 44.8486 78.7737 43.007C79.4527 40.4661 79.0991 37.816 77.7785 35.5405L66.8253 16.94L66.8628 16.915C66.5467 16.3875 66.3558 15.7819 66.3558 15.1233C66.3558 14.3117 66.6344 13.5657 67.0975 12.9695C66.2651 13.6125 65.7299 14.6176 65.7299 15.7476C65.7299 16.4062 65.9208 17.0118 66.2369 17.5393L66.1994 17.5642Z",
130
+ fill: "white"
131
+ }
132
+ ),
133
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
134
+ "path",
135
+ {
136
+ d: "M82.5382 49.8335L82.5291 49.8487C82.5291 49.8487 82.5352 49.8365 82.5413 49.8304C82.5413 49.8304 82.5413 49.8304 82.5413 49.8335H82.5382Z",
137
+ fill: "white"
138
+ }
139
+ ),
140
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
141
+ "path",
142
+ {
143
+ d: "M77.5156 54.3596C74.9213 55.8579 72.0859 56.5727 69.2882 56.5727C63.9681 56.5727 58.7856 53.9975 55.6467 49.3497L31.1616 7.19488L31.1491 7.21673C28.9053 3.56154 25.4441 1.08626 21.5917 0H15.3515V0.0436999C21.2881 -0.368328 27.2247 2.46593 30.5232 7.84102L30.5357 7.81917L55.0177 49.974C58.1566 54.6187 63.3422 57.197 68.6592 57.197C71.4569 57.197 74.2922 56.4853 76.8866 54.9839C78.2698 54.1848 79.4809 53.2109 80.5293 52.1122C79.6311 52.9581 78.6266 53.7166 77.5125 54.3596H77.5156Z",
144
+ fill: "white"
145
+ }
146
+ )
147
+ ] })
148
+ ] }),
149
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
150
+ "path",
151
+ {
152
+ d: "M117.046 58.661C116.362 58.661 115.792 58.509 115.336 58.205C114.906 57.8757 114.551 57.3943 114.272 56.761L104.354 34.493C104.076 33.8597 104 33.3023 104.126 32.821C104.253 32.3397 104.519 31.9597 104.924 31.681C105.33 31.4023 105.811 31.263 106.368 31.263C107.103 31.263 107.648 31.4277 108.002 31.757C108.382 32.061 108.699 32.5297 108.952 33.163L117.958 54.025H116.324L125.292 33.125C125.571 32.517 125.9 32.061 126.28 31.757C126.66 31.4277 127.192 31.263 127.876 31.263C128.434 31.263 128.89 31.4023 129.244 31.681C129.624 31.9597 129.865 32.3397 129.966 32.821C130.068 33.3023 129.979 33.8597 129.7 34.493L119.782 56.761C119.504 57.3943 119.149 57.8757 118.718 58.205C118.313 58.509 117.756 58.661 117.046 58.661Z",
153
+ fill: "white"
154
+ }
155
+ ),
156
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
157
+ "path",
158
+ {
159
+ d: "M144.63 58.737C142.781 58.737 141.147 58.4963 139.728 58.015C138.335 57.5337 137.157 56.8243 136.194 55.887C135.232 54.9243 134.51 53.7337 134.028 52.315C133.547 50.8963 133.306 49.2497 133.306 47.375V33.733C133.306 32.897 133.509 32.2763 133.914 31.871C134.345 31.4657 134.953 31.263 135.738 31.263C136.524 31.263 137.119 31.4657 137.524 31.871C137.955 32.2763 138.17 32.897 138.17 33.733V47.337C138.17 49.7437 138.715 51.555 139.804 52.771C140.919 53.9617 142.528 54.557 144.63 54.557C146.733 54.557 148.329 53.9617 149.418 52.771C150.508 51.555 151.052 49.7437 151.052 47.337V33.733C151.052 32.897 151.255 32.2763 151.66 31.871C152.091 31.4657 152.699 31.263 153.484 31.263C154.244 31.263 154.827 31.4657 155.232 31.871C155.663 32.2763 155.878 32.897 155.878 33.733V47.375C155.878 49.8577 155.448 51.9477 154.586 53.645C153.75 55.3423 152.496 56.6217 150.824 57.483C149.152 58.319 147.088 58.737 144.63 58.737Z",
160
+ fill: "white"
161
+ }
162
+ ),
163
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
164
+ "path",
165
+ {
166
+ d: "M172.685 58.737C170.836 58.737 169.202 58.4963 167.783 58.015C166.39 57.5337 165.212 56.8243 164.249 55.887C163.286 54.9243 162.564 53.7337 162.083 52.315C161.602 50.8963 161.361 49.2497 161.361 47.375V33.733C161.361 32.897 161.564 32.2763 161.969 31.871C162.4 31.4657 163.008 31.263 163.793 31.263C164.578 31.263 165.174 31.4657 165.579 31.871C166.01 32.2763 166.225 32.897 166.225 33.733V47.337C166.225 49.7437 166.77 51.555 167.859 52.771C168.974 53.9617 170.582 54.557 172.685 54.557C174.788 54.557 176.384 53.9617 177.473 52.771C178.562 51.555 179.107 49.7437 179.107 47.337V33.733C179.107 32.897 179.31 32.2763 179.715 31.871C180.146 31.4657 180.754 31.263 181.539 31.263C182.299 31.263 182.882 31.4657 183.287 31.871C183.718 32.2763 183.933 32.897 183.933 33.733V47.375C183.933 49.8577 183.502 51.9477 182.641 53.645C181.805 55.3423 180.551 56.6217 178.879 57.483C177.207 58.319 175.142 58.737 172.685 58.737Z",
167
+ fill: "white"
168
+ }
169
+ ),
170
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("defs", { children: [
171
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
172
+ "linearGradient",
173
+ {
174
+ id: "paint0_linear_1173_59965",
175
+ x1: "47.6353",
176
+ y1: "37.4727",
177
+ x2: "81.8124",
178
+ y2: "37.4727",
179
+ gradientUnits: "userSpaceOnUse",
180
+ children: [
181
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { stopColor: "#4906A5" }),
182
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "1", stopColor: "#D3423A" })
183
+ ]
184
+ }
185
+ ),
186
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
187
+ "linearGradient",
188
+ {
189
+ id: "paint1_linear_1173_59965",
190
+ x1: "0.0670626",
191
+ y1: "45.0017",
192
+ x2: "82.5916",
193
+ y2: "45.0017",
194
+ gradientUnits: "userSpaceOnUse",
195
+ children: [
196
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { stopColor: "#7C06A5" }),
197
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "1", stopColor: "#D3423A" })
198
+ ]
199
+ }
200
+ ),
201
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("clipPath", { id: "clip0_1173_59965", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
202
+ "rect",
203
+ {
204
+ width: "85",
205
+ height: "90",
206
+ fill: "white",
207
+ transform: "translate(0.0670471)"
208
+ }
209
+ ) })
210
+ ] })
211
+ ]
212
+ }
213
+ ),
214
+ []
215
+ );
216
+ return logo;
217
+ };
218
+
219
+ // src/login/LoginPanel.tsx
220
+ var import_clsx = __toESM(require("clsx"));
221
+ var import_jsx_runtime2 = require("react/jsx-runtime");
222
+ var classBase = "vuuLoginPanel";
223
+ var LoginPanel = ({
224
+ appName = "Demo App",
225
+ className,
226
+ requirePassword = true,
227
+ onSubmit,
228
+ ...htmlAttributes
229
+ }) => {
230
+ const [username, setUserName] = (0, import_react2.useState)("");
231
+ const [password, setPassword] = (0, import_react2.useState)("");
232
+ const inputRef = (0, import_react2.useRef)(null);
233
+ const login = () => {
234
+ onSubmit(username, password);
235
+ };
236
+ const handleUsername = (evt) => {
237
+ setUserName(evt.target.value);
238
+ };
239
+ const handlePassword = (evt) => {
240
+ setPassword(evt.target.value);
241
+ };
242
+ const handleCommitName = (0, import_react2.useCallback)(() => {
243
+ if (!requirePassword) {
244
+ onSubmit(username);
245
+ }
246
+ }, [onSubmit, requirePassword, username]);
247
+ const handleCommitPassword = (0, import_react2.useCallback)(() => {
248
+ if (username) {
249
+ onSubmit(username, password);
250
+ }
251
+ }, [onSubmit, password, username]);
252
+ const dataIsValid = username.trim() !== "" && (requirePassword === false || password.trim() !== "");
253
+ (0, import_react2.useEffect)(() => {
254
+ var _a;
255
+ console.log(`inputRef`, {
256
+ input: inputRef.current
257
+ });
258
+ (_a = inputRef.current) == null ? void 0 : _a.focus();
259
+ }, []);
260
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { ...htmlAttributes, className: (0, import_clsx.default)(classBase, className), children: [
261
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: `${classBase}-branding`, children: [
262
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(VuuLogo, {}),
263
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: `${classBase}-appName`, children: appName })
264
+ ] }),
265
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: `${classBase}-form`, children: [
266
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: `${classBase}-title`, children: "Welcome Back" }),
267
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core.FormField, { children: [
268
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core.FormFieldLabel, { children: "Username" }),
269
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
270
+ import_vuu_ui_controls.VuuInput,
271
+ {
272
+ value: username,
273
+ id: "text-username",
274
+ inputRef,
275
+ onChange: handleUsername,
276
+ onCommit: handleCommitName
277
+ }
278
+ )
279
+ ] }),
280
+ requirePassword ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core.FormField, { children: [
281
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core.FormFieldLabel, { children: "Password" }),
282
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
283
+ import_vuu_ui_controls.VuuInput,
284
+ {
285
+ className: `${classBase}-password`,
286
+ inputProps: {
287
+ type: "password"
288
+ },
289
+ value: password,
290
+ id: "text-password",
291
+ onChange: handlePassword,
292
+ onCommit: handleCommitPassword,
293
+ endAdornment: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "data-icon": "eye", style: { cursor: "pointer" } })
294
+ }
295
+ )
296
+ ] }) : null,
297
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
298
+ import_core.Button,
299
+ {
300
+ className: `${classBase}-login`,
301
+ disabled: !dataIsValid,
302
+ onClick: login,
303
+ variant: "cta",
304
+ children: "Login"
305
+ }
306
+ )
307
+ ] })
308
+ ] });
309
+ };
310
+
311
+ // src/login/login-utils.ts
312
+ var import_vuu_utils = require("@vuu-ui/vuu-utils");
313
+ var getAuthModeFromCookies = () => {
314
+ const mode = (0, import_vuu_utils.getCookieValue)("vuu-auth-mode");
315
+ return mode != null ? mode : "";
316
+ };
317
+ var getAuthDetailsFromCookies = () => {
318
+ const username = (0, import_vuu_utils.getCookieValue)("vuu-username");
319
+ const token = (0, import_vuu_utils.getCookieValue)("vuu-auth-token");
320
+ return [username, token];
321
+ };
322
+ var getDefaultLoginUrl = () => {
323
+ const authMode = getAuthModeFromCookies();
324
+ return authMode === "login" ? "login.html" : "demo.html";
325
+ };
326
+ var redirectToLogin = (loginUrl = getDefaultLoginUrl()) => {
327
+ window.location.href = loginUrl;
328
+ };
329
+ var logout = (loginUrl) => {
330
+ document.cookie = "vuu-username= ; expires = Thu, 01 Jan 1970 00:00:00 GMT";
331
+ document.cookie = "vuu-auth-token= ; expires = Thu, 01 Jan 1970 00:00:00 GMT";
332
+ redirectToLogin(loginUrl);
333
+ };
334
+
335
+ // src/app-header/AppHeader.tsx
336
+ var import_core2 = require("@salt-ds/core");
337
+ var import_jsx_runtime3 = require("react/jsx-runtime");
338
+ var classBase2 = "vuuAppHeader";
339
+ var AppHeader = ({
340
+ className: classNameProp,
341
+ layoutId,
342
+ loginUrl,
343
+ onNavigate,
344
+ onSwitchTheme,
345
+ themeMode: _,
346
+ user,
347
+ ...htmlAttributes
348
+ }) => {
349
+ const className = (0, import_clsx2.default)(classBase2, classNameProp);
350
+ const handleLogout = (0, import_react3.useCallback)(() => {
351
+ logout(loginUrl);
352
+ }, [loginUrl]);
353
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
354
+ import_vuu_ui_controls2.Toolbar,
355
+ {
356
+ alignItems: "end",
357
+ className,
358
+ showSeparators: true,
359
+ ...htmlAttributes,
360
+ children: [
361
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Button, { className: `${classBase2}-menuItem`, variant: "secondary", children: "Help" }),
362
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core2.Button, { className: `${classBase2}-menuItem`, variant: "secondary", children: [
363
+ "History ",
364
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { "data-icon": "history" })
365
+ ] }),
366
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core2.Button, { className: `${classBase2}-menuItem`, variant: "secondary", children: [
367
+ "View ",
368
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { "data-icon": "settings" })
369
+ ] }),
370
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
371
+ import_core2.Button,
372
+ {
373
+ className: `${classBase2}-menuItem`,
374
+ onClick: handleLogout,
375
+ variant: "secondary",
376
+ children: "Log out"
377
+ }
378
+ )
379
+ ]
380
+ }
381
+ );
382
+ };
383
+
384
+ // src/connection-status/ConnectionStatusIcon.tsx
385
+ var import_react4 = __toESM(require("react"));
386
+ var import_clsx3 = __toESM(require("clsx"));
387
+ var import_jsx_runtime4 = require("react/jsx-runtime");
388
+ var ConnectionStatusIcon = ({
389
+ connectionStatus,
390
+ className,
391
+ element = "span",
392
+ ...props
393
+ }) => {
394
+ const [classBase14, setClassBase] = (0, import_react4.useState)("vuuConnectingStatus");
395
+ (0, import_react4.useEffect)(() => {
396
+ switch (connectionStatus) {
397
+ case "connected":
398
+ case "reconnected":
399
+ setClassBase("vuuActiveStatus");
400
+ break;
401
+ case "connecting":
402
+ setClassBase("vuuConnectingStatus");
403
+ break;
404
+ case "disconnected":
405
+ setClassBase("vuuDisconnectedStatus");
406
+ break;
407
+ default:
408
+ break;
409
+ }
410
+ }, [connectionStatus]);
411
+ const statusIcon = import_react4.default.createElement(element, {
412
+ ...props,
413
+ className: (0, import_clsx3.default)("vuuStatus vuuIcon", classBase14, className)
414
+ });
415
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "vuuStatus-container salt-theme", children: [
416
+ statusIcon,
417
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "vuuStatus-text", children: [
418
+ "Status: ",
419
+ connectionStatus.toUpperCase()
420
+ ] })
421
+ ] }) });
422
+ };
423
+
424
+ // src/feature/Feature.tsx
425
+ var import_react6 = __toESM(require("react"));
426
+ var import_vuu_layout = require("@vuu-ui/vuu-layout");
427
+
428
+ // src/feature/FeatureErrorBoundary.tsx
429
+ var import_react5 = __toESM(require("react"));
430
+ var import_jsx_runtime5 = require("react/jsx-runtime");
431
+ var FeatureErrorBoundary = class extends import_react5.default.Component {
432
+ constructor(props) {
433
+ super(props);
434
+ this.state = { errorMessage: null };
435
+ }
436
+ static getDerivedStateFromError(error2) {
437
+ return { errorMessage: error2.message };
438
+ }
439
+ componentDidCatch(error2, errorInfo) {
440
+ console.log(`error creating component at ${this.props.url}`);
441
+ console.log(error2, errorInfo);
442
+ }
443
+ render() {
444
+ if (this.state.errorMessage) {
445
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
446
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h1", { children: "An error occured while creating component." }),
447
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { children: this.state.errorMessage })
448
+ ] });
449
+ }
450
+ return this.props.children;
451
+ }
452
+ };
453
+
454
+ // src/feature/Loader.tsx
455
+ var import_jsx_runtime6 = require("react/jsx-runtime");
456
+ var Loader = () => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "hwLoader" });
457
+
458
+ // src/feature/css-module-loader.ts
459
+ var importCSS = async (path) => {
460
+ const container = new CSSStyleSheet();
461
+ return fetch(path).then((x) => x.text()).then((x) => container.replace(x));
462
+ };
463
+
464
+ // src/feature/Feature.tsx
465
+ var import_jsx_runtime7 = require("react/jsx-runtime");
466
+ var componentsMap = /* @__PURE__ */ new Map();
467
+ var useCachedFeature = (url) => {
468
+ (0, import_react6.useEffect)(
469
+ () => () => {
470
+ componentsMap.delete(url);
471
+ },
472
+ [url]
473
+ );
474
+ if (!componentsMap.has(url)) {
475
+ componentsMap.set(
476
+ url,
477
+ import_react6.default.lazy(() => import(
478
+ /* @vite-ignore */
479
+ url
480
+ ))
481
+ );
482
+ }
483
+ const lazyFeature = componentsMap.get(url);
484
+ if (!lazyFeature) {
485
+ throw Error(`Unable to load Lazy Feature at url ${url}`);
486
+ } else {
487
+ return lazyFeature;
488
+ }
489
+ };
490
+ function RawFeature({
491
+ url,
492
+ css,
493
+ ComponentProps: params,
494
+ ...props
495
+ }) {
496
+ if (css) {
497
+ importCSS(css).then((styleSheet) => {
498
+ document.adoptedStyleSheets = [
499
+ ...document.adoptedStyleSheets,
500
+ styleSheet
501
+ ];
502
+ });
503
+ }
504
+ const LazyFeature = useCachedFeature(url);
505
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FeatureErrorBoundary, { url, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react6.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Loader, {}), children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LazyFeature, { ...props, ...params }) }) });
506
+ }
507
+ var Feature = import_react6.default.memo(RawFeature);
508
+ Feature.displayName = "Feature";
509
+ (0, import_vuu_layout.registerComponent)("Feature", Feature, "view");
510
+
511
+ // src/layout-management/SaveLayoutPanel.tsx
512
+ var import_vuu_ui_controls3 = require("@vuu-ui/vuu-ui-controls");
513
+
514
+ // ../../node_modules/html-to-image/es/util.js
515
+ function resolveUrl(url, baseUrl) {
516
+ if (url.match(/^[a-z]+:\/\//i)) {
517
+ return url;
518
+ }
519
+ if (url.match(/^\/\//)) {
520
+ return window.location.protocol + url;
521
+ }
522
+ if (url.match(/^[a-z]+:/i)) {
523
+ return url;
524
+ }
525
+ const doc = document.implementation.createHTMLDocument();
526
+ const base = doc.createElement("base");
527
+ const a = doc.createElement("a");
528
+ doc.head.appendChild(base);
529
+ doc.body.appendChild(a);
530
+ if (baseUrl) {
531
+ base.href = baseUrl;
532
+ }
533
+ a.href = url;
534
+ return a.href;
535
+ }
536
+ var uuid = /* @__PURE__ */ (() => {
537
+ let counter = 0;
538
+ const random = () => (
539
+ // eslint-disable-next-line no-bitwise
540
+ `0000${(Math.random() * 36 ** 4 << 0).toString(36)}`.slice(-4)
541
+ );
542
+ return () => {
543
+ counter += 1;
544
+ return `u${random()}${counter}`;
545
+ };
546
+ })();
547
+ function toArray(arrayLike) {
548
+ const arr = [];
549
+ for (let i = 0, l = arrayLike.length; i < l; i++) {
550
+ arr.push(arrayLike[i]);
551
+ }
552
+ return arr;
553
+ }
554
+ function px(node, styleProperty) {
555
+ const win = node.ownerDocument.defaultView || window;
556
+ const val = win.getComputedStyle(node).getPropertyValue(styleProperty);
557
+ return val ? parseFloat(val.replace("px", "")) : 0;
558
+ }
559
+ function getNodeWidth(node) {
560
+ const leftBorder = px(node, "border-left-width");
561
+ const rightBorder = px(node, "border-right-width");
562
+ return node.clientWidth + leftBorder + rightBorder;
563
+ }
564
+ function getNodeHeight(node) {
565
+ const topBorder = px(node, "border-top-width");
566
+ const bottomBorder = px(node, "border-bottom-width");
567
+ return node.clientHeight + topBorder + bottomBorder;
568
+ }
569
+ function getImageSize(targetNode, options = {}) {
570
+ const width = options.width || getNodeWidth(targetNode);
571
+ const height = options.height || getNodeHeight(targetNode);
572
+ return { width, height };
573
+ }
574
+ function getPixelRatio() {
575
+ let ratio;
576
+ let FINAL_PROCESS;
577
+ try {
578
+ FINAL_PROCESS = process;
579
+ } catch (e) {
580
+ }
581
+ const val = FINAL_PROCESS && FINAL_PROCESS.env ? FINAL_PROCESS.env.devicePixelRatio : null;
582
+ if (val) {
583
+ ratio = parseInt(val, 10);
584
+ if (Number.isNaN(ratio)) {
585
+ ratio = 1;
586
+ }
587
+ }
588
+ return ratio || window.devicePixelRatio || 1;
589
+ }
590
+ var canvasDimensionLimit = 16384;
591
+ function checkCanvasDimensions(canvas) {
592
+ if (canvas.width > canvasDimensionLimit || canvas.height > canvasDimensionLimit) {
593
+ if (canvas.width > canvasDimensionLimit && canvas.height > canvasDimensionLimit) {
594
+ if (canvas.width > canvas.height) {
595
+ canvas.height *= canvasDimensionLimit / canvas.width;
596
+ canvas.width = canvasDimensionLimit;
597
+ } else {
598
+ canvas.width *= canvasDimensionLimit / canvas.height;
599
+ canvas.height = canvasDimensionLimit;
600
+ }
601
+ } else if (canvas.width > canvasDimensionLimit) {
602
+ canvas.height *= canvasDimensionLimit / canvas.width;
603
+ canvas.width = canvasDimensionLimit;
604
+ } else {
605
+ canvas.width *= canvasDimensionLimit / canvas.height;
606
+ canvas.height = canvasDimensionLimit;
607
+ }
608
+ }
609
+ }
610
+ function createImage(url) {
611
+ return new Promise((resolve, reject) => {
612
+ const img = new Image();
613
+ img.decode = () => resolve(img);
614
+ img.onload = () => resolve(img);
615
+ img.onerror = reject;
616
+ img.crossOrigin = "anonymous";
617
+ img.decoding = "async";
618
+ img.src = url;
619
+ });
620
+ }
621
+ async function svgToDataURL(svg) {
622
+ return Promise.resolve().then(() => new XMLSerializer().serializeToString(svg)).then(encodeURIComponent).then((html) => `data:image/svg+xml;charset=utf-8,${html}`);
623
+ }
624
+ async function nodeToDataURL(node, width, height) {
625
+ const xmlns = "http://www.w3.org/2000/svg";
626
+ const svg = document.createElementNS(xmlns, "svg");
627
+ const foreignObject = document.createElementNS(xmlns, "foreignObject");
628
+ svg.setAttribute("width", `${width}`);
629
+ svg.setAttribute("height", `${height}`);
630
+ svg.setAttribute("viewBox", `0 0 ${width} ${height}`);
631
+ foreignObject.setAttribute("width", "100%");
632
+ foreignObject.setAttribute("height", "100%");
633
+ foreignObject.setAttribute("x", "0");
634
+ foreignObject.setAttribute("y", "0");
635
+ foreignObject.setAttribute("externalResourcesRequired", "true");
636
+ svg.appendChild(foreignObject);
637
+ foreignObject.appendChild(node);
638
+ return svgToDataURL(svg);
639
+ }
640
+ var isInstanceOfElement = (node, instance) => {
641
+ if (node instanceof instance)
642
+ return true;
643
+ const nodePrototype = Object.getPrototypeOf(node);
644
+ if (nodePrototype === null)
645
+ return false;
646
+ return nodePrototype.constructor.name === instance.name || isInstanceOfElement(nodePrototype, instance);
647
+ };
648
+
649
+ // ../../node_modules/html-to-image/es/clone-pseudos.js
650
+ function formatCSSText(style) {
651
+ const content = style.getPropertyValue("content");
652
+ return `${style.cssText} content: '${content.replace(/'|"/g, "")}';`;
653
+ }
654
+ function formatCSSProperties(style) {
655
+ return toArray(style).map((name) => {
656
+ const value = style.getPropertyValue(name);
657
+ const priority = style.getPropertyPriority(name);
658
+ return `${name}: ${value}${priority ? " !important" : ""};`;
659
+ }).join(" ");
660
+ }
661
+ function getPseudoElementStyle(className, pseudo, style) {
662
+ const selector = `.${className}:${pseudo}`;
663
+ const cssText = style.cssText ? formatCSSText(style) : formatCSSProperties(style);
664
+ return document.createTextNode(`${selector}{${cssText}}`);
665
+ }
666
+ function clonePseudoElement(nativeNode, clonedNode, pseudo) {
667
+ const style = window.getComputedStyle(nativeNode, pseudo);
668
+ const content = style.getPropertyValue("content");
669
+ if (content === "" || content === "none") {
670
+ return;
671
+ }
672
+ const className = uuid();
673
+ try {
674
+ clonedNode.className = `${clonedNode.className} ${className}`;
675
+ } catch (err) {
676
+ return;
677
+ }
678
+ const styleElement = document.createElement("style");
679
+ styleElement.appendChild(getPseudoElementStyle(className, pseudo, style));
680
+ clonedNode.appendChild(styleElement);
681
+ }
682
+ function clonePseudoElements(nativeNode, clonedNode) {
683
+ clonePseudoElement(nativeNode, clonedNode, ":before");
684
+ clonePseudoElement(nativeNode, clonedNode, ":after");
685
+ }
686
+
687
+ // ../../node_modules/html-to-image/es/mimes.js
688
+ var WOFF = "application/font-woff";
689
+ var JPEG = "image/jpeg";
690
+ var mimes = {
691
+ woff: WOFF,
692
+ woff2: WOFF,
693
+ ttf: "application/font-truetype",
694
+ eot: "application/vnd.ms-fontobject",
695
+ png: "image/png",
696
+ jpg: JPEG,
697
+ jpeg: JPEG,
698
+ gif: "image/gif",
699
+ tiff: "image/tiff",
700
+ svg: "image/svg+xml",
701
+ webp: "image/webp"
702
+ };
703
+ function getExtension(url) {
704
+ const match = /\.([^./]*?)$/g.exec(url);
705
+ return match ? match[1] : "";
706
+ }
707
+ function getMimeType(url) {
708
+ const extension = getExtension(url).toLowerCase();
709
+ return mimes[extension] || "";
710
+ }
711
+
712
+ // ../../node_modules/html-to-image/es/dataurl.js
713
+ function getContentFromDataUrl(dataURL) {
714
+ return dataURL.split(/,/)[1];
715
+ }
716
+ function isDataUrl(url) {
717
+ return url.search(/^(data:)/) !== -1;
718
+ }
719
+ function makeDataUrl(content, mimeType) {
720
+ return `data:${mimeType};base64,${content}`;
721
+ }
722
+ async function fetchAsDataURL(url, init, process2) {
723
+ const res = await fetch(url, init);
724
+ if (res.status === 404) {
725
+ throw new Error(`Resource "${res.url}" not found`);
726
+ }
727
+ const blob = await res.blob();
728
+ return new Promise((resolve, reject) => {
729
+ const reader = new FileReader();
730
+ reader.onerror = reject;
731
+ reader.onloadend = () => {
732
+ try {
733
+ resolve(process2({ res, result: reader.result }));
734
+ } catch (error2) {
735
+ reject(error2);
736
+ }
737
+ };
738
+ reader.readAsDataURL(blob);
739
+ });
740
+ }
741
+ var cache = {};
742
+ function getCacheKey(url, contentType, includeQueryParams) {
743
+ let key = url.replace(/\?.*/, "");
744
+ if (includeQueryParams) {
745
+ key = url;
746
+ }
747
+ if (/ttf|otf|eot|woff2?/i.test(key)) {
748
+ key = key.replace(/.*\//, "");
749
+ }
750
+ return contentType ? `[${contentType}]${key}` : key;
751
+ }
752
+ async function resourceToDataURL(resourceUrl, contentType, options) {
753
+ const cacheKey = getCacheKey(resourceUrl, contentType, options.includeQueryParams);
754
+ if (cache[cacheKey] != null) {
755
+ return cache[cacheKey];
756
+ }
757
+ if (options.cacheBust) {
758
+ resourceUrl += (/\?/.test(resourceUrl) ? "&" : "?") + (/* @__PURE__ */ new Date()).getTime();
759
+ }
760
+ let dataURL;
761
+ try {
762
+ const content = await fetchAsDataURL(resourceUrl, options.fetchRequestInit, ({ res, result }) => {
763
+ if (!contentType) {
764
+ contentType = res.headers.get("Content-Type") || "";
765
+ }
766
+ return getContentFromDataUrl(result);
767
+ });
768
+ dataURL = makeDataUrl(content, contentType);
769
+ } catch (error2) {
770
+ dataURL = options.imagePlaceholder || "";
771
+ let msg = `Failed to fetch resource: ${resourceUrl}`;
772
+ if (error2) {
773
+ msg = typeof error2 === "string" ? error2 : error2.message;
774
+ }
775
+ if (msg) {
776
+ console.warn(msg);
777
+ }
778
+ }
779
+ cache[cacheKey] = dataURL;
780
+ return dataURL;
781
+ }
782
+
783
+ // ../../node_modules/html-to-image/es/clone-node.js
784
+ async function cloneCanvasElement(canvas) {
785
+ const dataURL = canvas.toDataURL();
786
+ if (dataURL === "data:,") {
787
+ return canvas.cloneNode(false);
788
+ }
789
+ return createImage(dataURL);
790
+ }
791
+ async function cloneVideoElement(video, options) {
792
+ if (video.currentSrc) {
793
+ const canvas = document.createElement("canvas");
794
+ const ctx = canvas.getContext("2d");
795
+ canvas.width = video.clientWidth;
796
+ canvas.height = video.clientHeight;
797
+ ctx === null || ctx === void 0 ? void 0 : ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
798
+ const dataURL2 = canvas.toDataURL();
799
+ return createImage(dataURL2);
800
+ }
801
+ const poster = video.poster;
802
+ const contentType = getMimeType(poster);
803
+ const dataURL = await resourceToDataURL(poster, contentType, options);
804
+ return createImage(dataURL);
805
+ }
806
+ async function cloneIFrameElement(iframe) {
807
+ var _a;
808
+ try {
809
+ if ((_a = iframe === null || iframe === void 0 ? void 0 : iframe.contentDocument) === null || _a === void 0 ? void 0 : _a.body) {
810
+ return await cloneNode(iframe.contentDocument.body, {}, true);
811
+ }
812
+ } catch (_b) {
813
+ }
814
+ return iframe.cloneNode(false);
815
+ }
816
+ async function cloneSingleNode(node, options) {
817
+ if (isInstanceOfElement(node, HTMLCanvasElement)) {
818
+ return cloneCanvasElement(node);
819
+ }
820
+ if (isInstanceOfElement(node, HTMLVideoElement)) {
821
+ return cloneVideoElement(node, options);
822
+ }
823
+ if (isInstanceOfElement(node, HTMLIFrameElement)) {
824
+ return cloneIFrameElement(node);
825
+ }
826
+ return node.cloneNode(false);
827
+ }
828
+ var isSlotElement = (node) => node.tagName != null && node.tagName.toUpperCase() === "SLOT";
829
+ async function cloneChildren(nativeNode, clonedNode, options) {
830
+ var _a, _b;
831
+ let children = [];
832
+ if (isSlotElement(nativeNode) && nativeNode.assignedNodes) {
833
+ children = toArray(nativeNode.assignedNodes());
834
+ } else if (isInstanceOfElement(nativeNode, HTMLIFrameElement) && ((_a = nativeNode.contentDocument) === null || _a === void 0 ? void 0 : _a.body)) {
835
+ children = toArray(nativeNode.contentDocument.body.childNodes);
836
+ } else {
837
+ children = toArray(((_b = nativeNode.shadowRoot) !== null && _b !== void 0 ? _b : nativeNode).childNodes);
838
+ }
839
+ if (children.length === 0 || isInstanceOfElement(nativeNode, HTMLVideoElement)) {
840
+ return clonedNode;
841
+ }
842
+ await children.reduce((deferred, child) => deferred.then(() => cloneNode(child, options)).then((clonedChild) => {
843
+ if (clonedChild) {
844
+ clonedNode.appendChild(clonedChild);
845
+ }
846
+ }), Promise.resolve());
847
+ return clonedNode;
848
+ }
849
+ function cloneCSSStyle(nativeNode, clonedNode) {
850
+ const targetStyle = clonedNode.style;
851
+ if (!targetStyle) {
852
+ return;
853
+ }
854
+ const sourceStyle = window.getComputedStyle(nativeNode);
855
+ if (sourceStyle.cssText) {
856
+ targetStyle.cssText = sourceStyle.cssText;
857
+ targetStyle.transformOrigin = sourceStyle.transformOrigin;
858
+ } else {
859
+ toArray(sourceStyle).forEach((name) => {
860
+ let value = sourceStyle.getPropertyValue(name);
861
+ if (name === "font-size" && value.endsWith("px")) {
862
+ const reducedFont = Math.floor(parseFloat(value.substring(0, value.length - 2))) - 0.1;
863
+ value = `${reducedFont}px`;
864
+ }
865
+ if (isInstanceOfElement(nativeNode, HTMLIFrameElement) && name === "display" && value === "inline") {
866
+ value = "block";
867
+ }
868
+ if (name === "d" && clonedNode.getAttribute("d")) {
869
+ value = `path(${clonedNode.getAttribute("d")})`;
870
+ }
871
+ targetStyle.setProperty(name, value, sourceStyle.getPropertyPriority(name));
872
+ });
873
+ }
874
+ }
875
+ function cloneInputValue(nativeNode, clonedNode) {
876
+ if (isInstanceOfElement(nativeNode, HTMLTextAreaElement)) {
877
+ clonedNode.innerHTML = nativeNode.value;
878
+ }
879
+ if (isInstanceOfElement(nativeNode, HTMLInputElement)) {
880
+ clonedNode.setAttribute("value", nativeNode.value);
881
+ }
882
+ }
883
+ function cloneSelectValue(nativeNode, clonedNode) {
884
+ if (isInstanceOfElement(nativeNode, HTMLSelectElement)) {
885
+ const clonedSelect = clonedNode;
886
+ const selectedOption = Array.from(clonedSelect.children).find((child) => nativeNode.value === child.getAttribute("value"));
887
+ if (selectedOption) {
888
+ selectedOption.setAttribute("selected", "");
889
+ }
890
+ }
891
+ }
892
+ function decorate(nativeNode, clonedNode) {
893
+ if (isInstanceOfElement(clonedNode, Element)) {
894
+ cloneCSSStyle(nativeNode, clonedNode);
895
+ clonePseudoElements(nativeNode, clonedNode);
896
+ cloneInputValue(nativeNode, clonedNode);
897
+ cloneSelectValue(nativeNode, clonedNode);
898
+ }
899
+ return clonedNode;
900
+ }
901
+ async function ensureSVGSymbols(clone, options) {
902
+ const uses = clone.querySelectorAll ? clone.querySelectorAll("use") : [];
903
+ if (uses.length === 0) {
904
+ return clone;
905
+ }
906
+ const processedDefs = {};
907
+ for (let i = 0; i < uses.length; i++) {
908
+ const use = uses[i];
909
+ const id = use.getAttribute("xlink:href");
910
+ if (id) {
911
+ const exist = clone.querySelector(id);
912
+ const definition = document.querySelector(id);
913
+ if (!exist && definition && !processedDefs[id]) {
914
+ processedDefs[id] = await cloneNode(definition, options, true);
915
+ }
916
+ }
917
+ }
918
+ const nodes = Object.values(processedDefs);
919
+ if (nodes.length) {
920
+ const ns = "http://www.w3.org/1999/xhtml";
921
+ const svg = document.createElementNS(ns, "svg");
922
+ svg.setAttribute("xmlns", ns);
923
+ svg.style.position = "absolute";
924
+ svg.style.width = "0";
925
+ svg.style.height = "0";
926
+ svg.style.overflow = "hidden";
927
+ svg.style.display = "none";
928
+ const defs = document.createElementNS(ns, "defs");
929
+ svg.appendChild(defs);
930
+ for (let i = 0; i < nodes.length; i++) {
931
+ defs.appendChild(nodes[i]);
932
+ }
933
+ clone.appendChild(svg);
934
+ }
935
+ return clone;
936
+ }
937
+ async function cloneNode(node, options, isRoot) {
938
+ if (!isRoot && options.filter && !options.filter(node)) {
939
+ return null;
940
+ }
941
+ return Promise.resolve(node).then((clonedNode) => cloneSingleNode(clonedNode, options)).then((clonedNode) => cloneChildren(node, clonedNode, options)).then((clonedNode) => decorate(node, clonedNode)).then((clonedNode) => ensureSVGSymbols(clonedNode, options));
942
+ }
943
+
944
+ // ../../node_modules/html-to-image/es/embed-resources.js
945
+ var URL_REGEX = /url\((['"]?)([^'"]+?)\1\)/g;
946
+ var URL_WITH_FORMAT_REGEX = /url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g;
947
+ var FONT_SRC_REGEX = /src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;
948
+ function toRegex(url) {
949
+ const escaped = url.replace(/([.*+?^${}()|\[\]\/\\])/g, "\\$1");
950
+ return new RegExp(`(url\\(['"]?)(${escaped})(['"]?\\))`, "g");
951
+ }
952
+ function parseURLs(cssText) {
953
+ const urls = [];
954
+ cssText.replace(URL_REGEX, (raw, quotation, url) => {
955
+ urls.push(url);
956
+ return raw;
957
+ });
958
+ return urls.filter((url) => !isDataUrl(url));
959
+ }
960
+ async function embed(cssText, resourceURL, baseURL, options, getContentFromUrl) {
961
+ try {
962
+ const resolvedURL = baseURL ? resolveUrl(resourceURL, baseURL) : resourceURL;
963
+ const contentType = getMimeType(resourceURL);
964
+ let dataURL;
965
+ if (getContentFromUrl) {
966
+ const content = await getContentFromUrl(resolvedURL);
967
+ dataURL = makeDataUrl(content, contentType);
968
+ } else {
969
+ dataURL = await resourceToDataURL(resolvedURL, contentType, options);
970
+ }
971
+ return cssText.replace(toRegex(resourceURL), `$1${dataURL}$3`);
972
+ } catch (error2) {
973
+ }
974
+ return cssText;
975
+ }
976
+ function filterPreferredFontFormat(str, { preferredFontFormat }) {
977
+ return !preferredFontFormat ? str : str.replace(FONT_SRC_REGEX, (match) => {
978
+ while (true) {
979
+ const [src, , format] = URL_WITH_FORMAT_REGEX.exec(match) || [];
980
+ if (!format) {
981
+ return "";
982
+ }
983
+ if (format === preferredFontFormat) {
984
+ return `src: ${src};`;
985
+ }
986
+ }
987
+ });
988
+ }
989
+ function shouldEmbed(url) {
990
+ return url.search(URL_REGEX) !== -1;
991
+ }
992
+ async function embedResources(cssText, baseUrl, options) {
993
+ if (!shouldEmbed(cssText)) {
994
+ return cssText;
995
+ }
996
+ const filteredCSSText = filterPreferredFontFormat(cssText, options);
997
+ const urls = parseURLs(filteredCSSText);
998
+ return urls.reduce((deferred, url) => deferred.then((css) => embed(css, url, baseUrl, options)), Promise.resolve(filteredCSSText));
999
+ }
1000
+
1001
+ // ../../node_modules/html-to-image/es/embed-images.js
1002
+ async function embedProp(propName, node, options) {
1003
+ var _a;
1004
+ const propValue = (_a = node.style) === null || _a === void 0 ? void 0 : _a.getPropertyValue(propName);
1005
+ if (propValue) {
1006
+ const cssString = await embedResources(propValue, null, options);
1007
+ node.style.setProperty(propName, cssString, node.style.getPropertyPriority(propName));
1008
+ return true;
1009
+ }
1010
+ return false;
1011
+ }
1012
+ async function embedBackground(clonedNode, options) {
1013
+ if (!await embedProp("background", clonedNode, options)) {
1014
+ await embedProp("background-image", clonedNode, options);
1015
+ }
1016
+ if (!await embedProp("mask", clonedNode, options)) {
1017
+ await embedProp("mask-image", clonedNode, options);
1018
+ }
1019
+ }
1020
+ async function embedImageNode(clonedNode, options) {
1021
+ const isImageElement = isInstanceOfElement(clonedNode, HTMLImageElement);
1022
+ if (!(isImageElement && !isDataUrl(clonedNode.src)) && !(isInstanceOfElement(clonedNode, SVGImageElement) && !isDataUrl(clonedNode.href.baseVal))) {
1023
+ return;
1024
+ }
1025
+ const url = isImageElement ? clonedNode.src : clonedNode.href.baseVal;
1026
+ const dataURL = await resourceToDataURL(url, getMimeType(url), options);
1027
+ await new Promise((resolve, reject) => {
1028
+ clonedNode.onload = resolve;
1029
+ clonedNode.onerror = reject;
1030
+ const image = clonedNode;
1031
+ if (image.decode) {
1032
+ image.decode = resolve;
1033
+ }
1034
+ if (image.loading === "lazy") {
1035
+ image.loading = "eager";
1036
+ }
1037
+ if (isImageElement) {
1038
+ clonedNode.srcset = "";
1039
+ clonedNode.src = dataURL;
1040
+ } else {
1041
+ clonedNode.href.baseVal = dataURL;
1042
+ }
1043
+ });
1044
+ }
1045
+ async function embedChildren(clonedNode, options) {
1046
+ const children = toArray(clonedNode.childNodes);
1047
+ const deferreds = children.map((child) => embedImages(child, options));
1048
+ await Promise.all(deferreds).then(() => clonedNode);
1049
+ }
1050
+ async function embedImages(clonedNode, options) {
1051
+ if (isInstanceOfElement(clonedNode, Element)) {
1052
+ await embedBackground(clonedNode, options);
1053
+ await embedImageNode(clonedNode, options);
1054
+ await embedChildren(clonedNode, options);
1055
+ }
1056
+ }
1057
+
1058
+ // ../../node_modules/html-to-image/es/apply-style.js
1059
+ function applyStyle(node, options) {
1060
+ const { style } = node;
1061
+ if (options.backgroundColor) {
1062
+ style.backgroundColor = options.backgroundColor;
1063
+ }
1064
+ if (options.width) {
1065
+ style.width = `${options.width}px`;
1066
+ }
1067
+ if (options.height) {
1068
+ style.height = `${options.height}px`;
1069
+ }
1070
+ const manual = options.style;
1071
+ if (manual != null) {
1072
+ Object.keys(manual).forEach((key) => {
1073
+ style[key] = manual[key];
1074
+ });
1075
+ }
1076
+ return node;
1077
+ }
1078
+
1079
+ // ../../node_modules/html-to-image/es/embed-webfonts.js
1080
+ var cssFetchCache = {};
1081
+ async function fetchCSS(url) {
1082
+ let cache2 = cssFetchCache[url];
1083
+ if (cache2 != null) {
1084
+ return cache2;
1085
+ }
1086
+ const res = await fetch(url);
1087
+ const cssText = await res.text();
1088
+ cache2 = { url, cssText };
1089
+ cssFetchCache[url] = cache2;
1090
+ return cache2;
1091
+ }
1092
+ async function embedFonts(data, options) {
1093
+ let cssText = data.cssText;
1094
+ const regexUrl = /url\(["']?([^"')]+)["']?\)/g;
1095
+ const fontLocs = cssText.match(/url\([^)]+\)/g) || [];
1096
+ const loadFonts = fontLocs.map(async (loc) => {
1097
+ let url = loc.replace(regexUrl, "$1");
1098
+ if (!url.startsWith("https://")) {
1099
+ url = new URL(url, data.url).href;
1100
+ }
1101
+ return fetchAsDataURL(url, options.fetchRequestInit, ({ result }) => {
1102
+ cssText = cssText.replace(loc, `url(${result})`);
1103
+ return [loc, result];
1104
+ });
1105
+ });
1106
+ return Promise.all(loadFonts).then(() => cssText);
1107
+ }
1108
+ function parseCSS(source) {
1109
+ if (source == null) {
1110
+ return [];
1111
+ }
1112
+ const result = [];
1113
+ const commentsRegex = /(\/\*[\s\S]*?\*\/)/gi;
1114
+ let cssText = source.replace(commentsRegex, "");
1115
+ const keyframesRegex = new RegExp("((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})", "gi");
1116
+ while (true) {
1117
+ const matches = keyframesRegex.exec(cssText);
1118
+ if (matches === null) {
1119
+ break;
1120
+ }
1121
+ result.push(matches[0]);
1122
+ }
1123
+ cssText = cssText.replace(keyframesRegex, "");
1124
+ const importRegex = /@import[\s\S]*?url\([^)]*\)[\s\S]*?;/gi;
1125
+ const combinedCSSRegex = "((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})";
1126
+ const unifiedRegex = new RegExp(combinedCSSRegex, "gi");
1127
+ while (true) {
1128
+ let matches = importRegex.exec(cssText);
1129
+ if (matches === null) {
1130
+ matches = unifiedRegex.exec(cssText);
1131
+ if (matches === null) {
1132
+ break;
1133
+ } else {
1134
+ importRegex.lastIndex = unifiedRegex.lastIndex;
1135
+ }
1136
+ } else {
1137
+ unifiedRegex.lastIndex = importRegex.lastIndex;
1138
+ }
1139
+ result.push(matches[0]);
1140
+ }
1141
+ return result;
1142
+ }
1143
+ async function getCSSRules(styleSheets, options) {
1144
+ const ret = [];
1145
+ const deferreds = [];
1146
+ styleSheets.forEach((sheet) => {
1147
+ if ("cssRules" in sheet) {
1148
+ try {
1149
+ toArray(sheet.cssRules || []).forEach((item, index) => {
1150
+ if (item.type === CSSRule.IMPORT_RULE) {
1151
+ let importIndex = index + 1;
1152
+ const url = item.href;
1153
+ const deferred = fetchCSS(url).then((metadata) => embedFonts(metadata, options)).then((cssText) => parseCSS(cssText).forEach((rule) => {
1154
+ try {
1155
+ sheet.insertRule(rule, rule.startsWith("@import") ? importIndex += 1 : sheet.cssRules.length);
1156
+ } catch (error2) {
1157
+ console.error("Error inserting rule from remote css", {
1158
+ rule,
1159
+ error: error2
1160
+ });
1161
+ }
1162
+ })).catch((e) => {
1163
+ console.error("Error loading remote css", e.toString());
1164
+ });
1165
+ deferreds.push(deferred);
1166
+ }
1167
+ });
1168
+ } catch (e) {
1169
+ const inline = styleSheets.find((a) => a.href == null) || document.styleSheets[0];
1170
+ if (sheet.href != null) {
1171
+ deferreds.push(fetchCSS(sheet.href).then((metadata) => embedFonts(metadata, options)).then((cssText) => parseCSS(cssText).forEach((rule) => {
1172
+ inline.insertRule(rule, sheet.cssRules.length);
1173
+ })).catch((err) => {
1174
+ console.error("Error loading remote stylesheet", err);
1175
+ }));
1176
+ }
1177
+ console.error("Error inlining remote css file", e);
1178
+ }
1179
+ }
1180
+ });
1181
+ return Promise.all(deferreds).then(() => {
1182
+ styleSheets.forEach((sheet) => {
1183
+ if ("cssRules" in sheet) {
1184
+ try {
1185
+ toArray(sheet.cssRules || []).forEach((item) => {
1186
+ ret.push(item);
1187
+ });
1188
+ } catch (e) {
1189
+ console.error(`Error while reading CSS rules from ${sheet.href}`, e);
1190
+ }
1191
+ }
1192
+ });
1193
+ return ret;
1194
+ });
1195
+ }
1196
+ function getWebFontRules(cssRules) {
1197
+ return cssRules.filter((rule) => rule.type === CSSRule.FONT_FACE_RULE).filter((rule) => shouldEmbed(rule.style.getPropertyValue("src")));
1198
+ }
1199
+ async function parseWebFontRules(node, options) {
1200
+ if (node.ownerDocument == null) {
1201
+ throw new Error("Provided element is not within a Document");
1202
+ }
1203
+ const styleSheets = toArray(node.ownerDocument.styleSheets);
1204
+ const cssRules = await getCSSRules(styleSheets, options);
1205
+ return getWebFontRules(cssRules);
1206
+ }
1207
+ async function getWebFontCSS(node, options) {
1208
+ const rules = await parseWebFontRules(node, options);
1209
+ const cssTexts = await Promise.all(rules.map((rule) => {
1210
+ const baseUrl = rule.parentStyleSheet ? rule.parentStyleSheet.href : null;
1211
+ return embedResources(rule.cssText, baseUrl, options);
1212
+ }));
1213
+ return cssTexts.join("\n");
1214
+ }
1215
+ async function embedWebFonts(clonedNode, options) {
1216
+ const cssText = options.fontEmbedCSS != null ? options.fontEmbedCSS : options.skipFonts ? null : await getWebFontCSS(clonedNode, options);
1217
+ if (cssText) {
1218
+ const styleNode = document.createElement("style");
1219
+ const sytleContent = document.createTextNode(cssText);
1220
+ styleNode.appendChild(sytleContent);
1221
+ if (clonedNode.firstChild) {
1222
+ clonedNode.insertBefore(styleNode, clonedNode.firstChild);
1223
+ } else {
1224
+ clonedNode.appendChild(styleNode);
1225
+ }
1226
+ }
1227
+ }
1228
+
1229
+ // ../../node_modules/html-to-image/es/index.js
1230
+ async function toSvg(node, options = {}) {
1231
+ const { width, height } = getImageSize(node, options);
1232
+ const clonedNode = await cloneNode(node, options, true);
1233
+ await embedWebFonts(clonedNode, options);
1234
+ await embedImages(clonedNode, options);
1235
+ applyStyle(clonedNode, options);
1236
+ const datauri = await nodeToDataURL(clonedNode, width, height);
1237
+ return datauri;
1238
+ }
1239
+ async function toCanvas(node, options = {}) {
1240
+ const { width, height } = getImageSize(node, options);
1241
+ const svg = await toSvg(node, options);
1242
+ const img = await createImage(svg);
1243
+ const canvas = document.createElement("canvas");
1244
+ const context = canvas.getContext("2d");
1245
+ const ratio = options.pixelRatio || getPixelRatio();
1246
+ const canvasWidth = options.canvasWidth || width;
1247
+ const canvasHeight = options.canvasHeight || height;
1248
+ canvas.width = canvasWidth * ratio;
1249
+ canvas.height = canvasHeight * ratio;
1250
+ if (!options.skipAutoScale) {
1251
+ checkCanvasDimensions(canvas);
1252
+ }
1253
+ canvas.style.width = `${canvasWidth}`;
1254
+ canvas.style.height = `${canvasHeight}`;
1255
+ if (options.backgroundColor) {
1256
+ context.fillStyle = options.backgroundColor;
1257
+ context.fillRect(0, 0, canvas.width, canvas.height);
1258
+ }
1259
+ context.drawImage(img, 0, 0, canvas.width, canvas.height);
1260
+ return canvas;
1261
+ }
1262
+ async function toPng(node, options = {}) {
1263
+ const canvas = await toCanvas(node, options);
1264
+ return canvas.toDataURL();
1265
+ }
1266
+
1267
+ // src/layout-management/screenshot-utils.ts
1268
+ var takeScreenshot = (node) => {
1269
+ return new Promise((resolve, reject) => {
1270
+ toPng(node, {
1271
+ cacheBust: true
1272
+ }).then((screenshot) => {
1273
+ if (!screenshot) {
1274
+ reject(new Error("No Screenshot available"));
1275
+ }
1276
+ resolve(screenshot);
1277
+ }).catch((error2) => {
1278
+ console.error(
1279
+ "the following error occurred while taking a screenshot of a DOMNode",
1280
+ error2
1281
+ );
1282
+ reject(new Error("Error taking screenshot"));
1283
+ });
1284
+ });
1285
+ };
1286
+
1287
+ // src/layout-management/SaveLayoutPanel.tsx
1288
+ var import_core3 = require("@salt-ds/core");
1289
+ var import_react7 = require("react");
1290
+ var import_jsx_runtime8 = require("react/jsx-runtime");
1291
+ var classBase3 = "saveLayoutPanel";
1292
+ var formField = `${classBase3}-formField`;
1293
+ var groups = ["Group 1", "Group 2", "Group 3", "Group 4", "Group 5"];
1294
+ var checkboxValues = ["Value 1", "Value 2", "Value 3"];
1295
+ var radioValues = ["Value 1", "Value 2", "Value 3"];
1296
+ var SaveLayoutPanel = (props) => {
1297
+ const { defaultTitle = "", onCancel, onSave, componentId } = props;
1298
+ const [layoutName, setLayoutName] = (0, import_react7.useState)(defaultTitle);
1299
+ const [group, setGroup] = (0, import_react7.useState)("");
1300
+ const [checkValues, setCheckValues] = (0, import_react7.useState)([]);
1301
+ const [radioValue, setRadioValue] = (0, import_react7.useState)(radioValues[0]);
1302
+ const [screenshot, setScreenshot] = (0, import_react7.useState)();
1303
+ const [screenshotErrorMessage, setScreenshotErrorMessage] = (0, import_react7.useState)();
1304
+ const [username] = getAuthDetailsFromCookies();
1305
+ (0, import_react7.useEffect)(() => {
1306
+ if (componentId) {
1307
+ takeScreenshot(document.getElementById(componentId)).then((screenshot2) => {
1308
+ setScreenshot(screenshot2);
1309
+ }).catch((error2) => {
1310
+ setScreenshotErrorMessage(error2.message);
1311
+ });
1312
+ }
1313
+ }, [componentId]);
1314
+ const handleSubmit = () => {
1315
+ onSave({
1316
+ name: layoutName,
1317
+ group,
1318
+ screenshot: screenshot != null ? screenshot : "",
1319
+ user: username
1320
+ });
1321
+ };
1322
+ const screenshotContent = (0, import_react7.useMemo)(() => {
1323
+ if (screenshot) {
1324
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1325
+ "img",
1326
+ {
1327
+ className: `${classBase3}-screenshot`,
1328
+ src: screenshot,
1329
+ alt: "screenshot of current layout"
1330
+ }
1331
+ );
1332
+ }
1333
+ if (screenshotErrorMessage) {
1334
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core3.Text, { children: screenshotErrorMessage });
1335
+ }
1336
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "spinner" });
1337
+ }, [screenshot, screenshotErrorMessage]);
1338
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `${classBase3}-panelContainer`, children: [
1339
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `${classBase3}-panelContent`, children: [
1340
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `${classBase3}-formContainer`, children: [
1341
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core3.FormField, { className: formField, children: [
1342
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core3.FormFieldLabel, { children: "Group" }),
1343
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1344
+ import_vuu_ui_controls3.ComboBox,
1345
+ {
1346
+ source: groups,
1347
+ allowFreeText: true,
1348
+ InputProps: {
1349
+ inputProps: {
1350
+ className: `${classBase3}-inputText`,
1351
+ placeholder: "Select Group or Enter New Name",
1352
+ onChange: (event) => setGroup(event.target.value)
1353
+ }
1354
+ },
1355
+ width: "100%",
1356
+ onSelectionChange: (_, value) => setGroup(value || "")
1357
+ }
1358
+ )
1359
+ ] }),
1360
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core3.FormField, { className: formField, children: [
1361
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core3.FormFieldLabel, { children: "Layout Name" }),
1362
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1363
+ import_core3.Input,
1364
+ {
1365
+ inputProps: {
1366
+ className: `${classBase3}-inputText`,
1367
+ placeholder: "Enter Layout Name"
1368
+ },
1369
+ onChange: (event) => setLayoutName(event.target.value),
1370
+ value: layoutName
1371
+ }
1372
+ )
1373
+ ] }),
1374
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core3.FormField, { className: formField, children: [
1375
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core3.FormFieldLabel, { children: "Some Layout Setting" }),
1376
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `${classBase3}-settingsGroup`, children: checkboxValues.map((value, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1377
+ import_vuu_ui_controls3.Checkbox,
1378
+ {
1379
+ onToggle: () => setCheckValues(
1380
+ (prev) => prev.includes(value) ? prev.filter((entry) => entry !== value) : [...prev, value]
1381
+ ),
1382
+ checked: checkValues.includes(value),
1383
+ label: value
1384
+ },
1385
+ i
1386
+ )) })
1387
+ ] }),
1388
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core3.FormField, { className: formField, children: [
1389
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core3.FormFieldLabel, { children: "Some Layout Setting" }),
1390
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `${classBase3}-settingsGroup`, children: radioValues.map((value, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1391
+ import_vuu_ui_controls3.RadioButton,
1392
+ {
1393
+ onClick: () => setRadioValue(value),
1394
+ checked: radioValue === value,
1395
+ label: value,
1396
+ groupName: "radioGroup"
1397
+ },
1398
+ i
1399
+ )) })
1400
+ ] })
1401
+ ] }),
1402
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `${classBase3}-screenshotContainer`, children: screenshotContent })
1403
+ ] }),
1404
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `${classBase3}-buttonsContainer`, children: [
1405
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core3.Button, { className: `${classBase3}-cancelButton`, onClick: onCancel, children: "Cancel" }),
1406
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1407
+ import_core3.Button,
1408
+ {
1409
+ className: `${classBase3}-saveButton`,
1410
+ onClick: handleSubmit,
1411
+ disabled: layoutName === "" || group === "",
1412
+ children: "Save"
1413
+ }
1414
+ )
1415
+ ] })
1416
+ ] });
1417
+ };
1418
+
1419
+ // src/layout-management/LayoutList.tsx
1420
+ var import_vuu_ui_controls4 = require("@vuu-ui/vuu-ui-controls");
1421
+
1422
+ // src/layout-management/useLayoutManager.tsx
1423
+ var import_react14 = __toESM(require("react"));
1424
+ var import_vuu_layout2 = require("@vuu-ui/vuu-layout");
1425
+
1426
+ // ../vuu-popups/src/dialog/Dialog.tsx
1427
+ var import_clsx5 = __toESM(require("clsx"));
1428
+ var import_vuu_utils2 = require("@vuu-ui/vuu-utils");
1429
+ var import_react9 = require("react");
1430
+
1431
+ // ../vuu-popups/src/dialog-header/DialogHeader.tsx
1432
+ var import_core4 = require("@salt-ds/core");
1433
+ var import_clsx4 = __toESM(require("clsx"));
1434
+ var import_jsx_runtime9 = require("react/jsx-runtime");
1435
+ var classBase4 = "vuuDialogHeader";
1436
+ var DialogHeader = ({
1437
+ hideCloseButton = false,
1438
+ title,
1439
+ onClose,
1440
+ ...htmlAttributes
1441
+ }) => {
1442
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { ...htmlAttributes, className: (0, import_clsx4.default)(classBase4, "vuuToolbarProxy"), children: [
1443
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.Text, { className: "dialogHeader", children: title }),
1444
+ !hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1445
+ import_core4.Button,
1446
+ {
1447
+ onClick: onClose,
1448
+ "data-align": "end",
1449
+ "data-icon": "close",
1450
+ variant: "secondary"
1451
+ },
1452
+ "close"
1453
+ )
1454
+ ] });
1455
+ };
1456
+
1457
+ // ../vuu-popups/src/popup/useAnchoredPosition.ts
1458
+ var import_react8 = require("react");
1459
+
1460
+ // ../vuu-popups/src/popup/getPositionRelativeToAnchor.ts
1461
+ var getPositionRelativeToAnchor = (anchorElement, placement, offsetLeft, offsetTop, minWidth, dimensions) => {
1462
+ const { bottom, height, left, right, top, width } = anchorElement.getBoundingClientRect();
1463
+ switch (placement) {
1464
+ case "below":
1465
+ return { left: left + offsetLeft, top: bottom + offsetTop };
1466
+ case "right":
1467
+ return { left: right + offsetLeft, top: top + offsetTop };
1468
+ case "below-center":
1469
+ return { left: left + width / 2 + offsetLeft, top: bottom + offsetTop };
1470
+ case "below-right":
1471
+ return { left, minWidth, top: bottom + offsetTop };
1472
+ case "below-full-width":
1473
+ return {
1474
+ left: left + offsetLeft,
1475
+ minWidth,
1476
+ top: bottom + offsetTop,
1477
+ width
1478
+ };
1479
+ case "center":
1480
+ if (dimensions) {
1481
+ return {
1482
+ left: width / 2 - dimensions.width / 2 + offsetLeft,
1483
+ top: height / 2 - dimensions.height / 2 + offsetTop,
1484
+ visibility: "visible"
1485
+ };
1486
+ } else {
1487
+ return {
1488
+ left: width / 2 + offsetLeft,
1489
+ top: height / 2 + offsetTop,
1490
+ visibility: "hidden"
1491
+ };
1492
+ }
1493
+ default:
1494
+ throw Error(
1495
+ `Popup getPositionRelativeToAnchor non-supported placement value ${placement}`
1496
+ );
1497
+ }
1498
+ };
1499
+
1500
+ // ../vuu-popups/src/popup/useAnchoredPosition.ts
1501
+ var useAnchoredPosition = ({
1502
+ anchorElement,
1503
+ minWidth,
1504
+ offsetLeft = 0,
1505
+ offsetTop = 0,
1506
+ placement,
1507
+ position: positionProp
1508
+ }) => {
1509
+ const popupRef = (0, import_react8.useRef)(null);
1510
+ const [position, setPosition] = (0, import_react8.useState)(positionProp);
1511
+ (0, import_react8.useLayoutEffect)(() => {
1512
+ if (placement === "absolute" && positionProp) {
1513
+ setPosition(positionProp);
1514
+ } else if (anchorElement.current && placement !== "auto") {
1515
+ const dimensions = popupRef.current === null ? void 0 : popupRef.current.getBoundingClientRect();
1516
+ const position2 = getPositionRelativeToAnchor(
1517
+ anchorElement.current,
1518
+ placement,
1519
+ offsetLeft,
1520
+ offsetTop,
1521
+ minWidth,
1522
+ dimensions
1523
+ );
1524
+ setPosition(position2);
1525
+ }
1526
+ }, [anchorElement, minWidth, offsetLeft, offsetTop, placement, positionProp]);
1527
+ const popupCallbackRef = (0, import_react8.useCallback)(
1528
+ (el) => {
1529
+ popupRef.current = el;
1530
+ if (el && placement === "center" && anchorElement.current) {
1531
+ const { height, width } = el.getBoundingClientRect();
1532
+ setPosition(
1533
+ getPositionRelativeToAnchor(
1534
+ anchorElement.current,
1535
+ placement,
1536
+ offsetLeft,
1537
+ offsetTop,
1538
+ void 0,
1539
+ { height, width }
1540
+ )
1541
+ );
1542
+ }
1543
+ },
1544
+ [anchorElement, offsetLeft, offsetTop, placement]
1545
+ );
1546
+ return {
1547
+ position,
1548
+ popupRef: placement === "center" ? popupCallbackRef : void 0
1549
+ };
1550
+ };
1551
+
1552
+ // ../vuu-popups/src/dialog/Dialog.tsx
1553
+ var import_jsx_runtime10 = require("react/jsx-runtime");
1554
+ var classBase5 = "vuuDialog";
1555
+ var AnchorBody = { current: document.body };
1556
+ var EMPTY_PROPS = {};
1557
+ var Dialog = ({
1558
+ PopupProps = EMPTY_PROPS,
1559
+ children,
1560
+ className,
1561
+ isOpen = false,
1562
+ onClose,
1563
+ style,
1564
+ title,
1565
+ hideCloseButton = false,
1566
+ ...htmlAttributes
1567
+ }) => {
1568
+ const {
1569
+ anchorElement = AnchorBody,
1570
+ offsetLeft = 0,
1571
+ offsetTop = 0,
1572
+ placement = "auto"
1573
+ } = PopupProps;
1574
+ const rootRef = (0, import_react9.useRef)(null);
1575
+ const portalRef = (0, import_react9.useRef)(null);
1576
+ const [themeClass, _, dataMode] = (0, import_vuu_utils2.useThemeAttributes)();
1577
+ const { position } = useAnchoredPosition({
1578
+ anchorElement,
1579
+ offsetLeft,
1580
+ offsetTop,
1581
+ placement
1582
+ });
1583
+ const close = (0, import_react9.useCallback)(() => {
1584
+ onClose == null ? void 0 : onClose();
1585
+ }, [onClose]);
1586
+ (0, import_react9.useLayoutEffect)(() => {
1587
+ if (rootRef.current) {
1588
+ if (isOpen) {
1589
+ rootRef.current.showModal();
1590
+ const { left, top } = rootRef.current.getBoundingClientRect();
1591
+ if (portalRef.current) {
1592
+ portalRef.current.style.cssText = `left:-${left}px;position:absolute;top:-${top}px;`;
1593
+ }
1594
+ } else {
1595
+ rootRef.current.close();
1596
+ }
1597
+ if (placement.endsWith("center")) {
1598
+ const { width } = rootRef.current.getBoundingClientRect();
1599
+ rootRef.current.style.marginLeft = `-${width / 2}px`;
1600
+ }
1601
+ }
1602
+ }, [isOpen, placement]);
1603
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
1604
+ "dialog",
1605
+ {
1606
+ ...htmlAttributes,
1607
+ className: (0, import_clsx5.default)(classBase5, themeClass),
1608
+ "data-mode": dataMode,
1609
+ onClose: close,
1610
+ id: "vuu-dialog",
1611
+ ref: rootRef,
1612
+ style: { ...style, ...position },
1613
+ children: [
1614
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1615
+ DialogHeader,
1616
+ {
1617
+ hideCloseButton,
1618
+ onClose: close,
1619
+ title
1620
+ }
1621
+ ),
1622
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: `${classBase5}-body`, children }),
1623
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { id: "vuu-dialog-portal-root", ref: portalRef })
1624
+ ]
1625
+ }
1626
+ );
1627
+ };
1628
+
1629
+ // ../vuu-popups/src/dialog/useDialog.tsx
1630
+ var import_react10 = require("react");
1631
+ var import_jsx_runtime11 = require("react/jsx-runtime");
1632
+ var useDialog = () => {
1633
+ const [dialogState, setDialogState] = (0, import_react10.useState)();
1634
+ const handleClose = (0, import_react10.useCallback)(() => {
1635
+ setDialogState(void 0);
1636
+ }, []);
1637
+ const dialog = dialogState ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1638
+ Dialog,
1639
+ {
1640
+ className: "vuDialog",
1641
+ isOpen: true,
1642
+ onClose: handleClose,
1643
+ style: { maxHeight: 500 },
1644
+ title: dialogState.title,
1645
+ hideCloseButton: dialogState.hideCloseButton,
1646
+ children: dialogState.content
1647
+ }
1648
+ ) : null;
1649
+ return {
1650
+ dialog,
1651
+ setDialogState
1652
+ };
1653
+ };
1654
+
1655
+ // ../vuu-popups/src/menu/context-menu-provider.tsx
1656
+ var import_react11 = require("react");
1657
+ var import_jsx_runtime12 = require("react/jsx-runtime");
1658
+ var ContextMenuContext = (0, import_react11.createContext)(
1659
+ null
1660
+ );
1661
+ var Provider = ({
1662
+ children,
1663
+ context,
1664
+ menuActionHandler,
1665
+ menuBuilder
1666
+ }) => {
1667
+ const menuBuilders = (0, import_react11.useMemo)(() => {
1668
+ if ((context == null ? void 0 : context.menuBuilders) && menuBuilder) {
1669
+ return context.menuBuilders.concat(menuBuilder);
1670
+ } else if (menuBuilder) {
1671
+ return [menuBuilder];
1672
+ } else {
1673
+ return (context == null ? void 0 : context.menuBuilders) || [];
1674
+ }
1675
+ }, [context, menuBuilder]);
1676
+ const handleMenuAction = (0, import_react11.useCallback)(
1677
+ (reason) => {
1678
+ var _a;
1679
+ if (menuActionHandler == null ? void 0 : menuActionHandler(reason)) {
1680
+ return true;
1681
+ }
1682
+ if ((_a = context == null ? void 0 : context.menuActionHandler) == null ? void 0 : _a.call(context, reason)) {
1683
+ return true;
1684
+ }
1685
+ },
1686
+ [context, menuActionHandler]
1687
+ );
1688
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1689
+ ContextMenuContext.Provider,
1690
+ {
1691
+ value: {
1692
+ menuActionHandler: handleMenuAction,
1693
+ menuBuilders
1694
+ },
1695
+ children
1696
+ }
1697
+ );
1698
+ };
1699
+ var ContextMenuProvider = ({
1700
+ children,
1701
+ label,
1702
+ menuActionHandler,
1703
+ menuBuilder
1704
+ }) => {
1705
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ContextMenuContext.Consumer, { children: (parentContext) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1706
+ Provider,
1707
+ {
1708
+ context: parentContext,
1709
+ label,
1710
+ menuActionHandler,
1711
+ menuBuilder,
1712
+ children
1713
+ }
1714
+ ) });
1715
+ };
1716
+
1717
+ // ../vuu-popups/src/notifications/NotificationsProvider.tsx
1718
+ var import_react12 = __toESM(require("react"));
1719
+ var import_clsx6 = __toESM(require("clsx"));
1720
+ var import_vuu_utils3 = require("@vuu-ui/vuu-utils");
1721
+ var import_jsx_runtime13 = require("react/jsx-runtime");
1722
+ var NotificationsContext = import_react12.default.createContext({
1723
+ notify: () => "have you forgotten to provide a NotificationProvider?"
1724
+ });
1725
+ var useNotifications = () => (0, import_react12.useContext)(NotificationsContext);
1726
+
1727
+ // src/persistence-management/defaultApplicationJson.ts
1728
+ var loadingApplicationJson = {
1729
+ layout: {
1730
+ type: "Component",
1731
+ id: "loading-main",
1732
+ props: {}
1733
+ }
1734
+ };
1735
+ var defaultApplicationJson = {
1736
+ layout: {
1737
+ type: "Stack",
1738
+ id: "main-tabs",
1739
+ props: {
1740
+ className: "vuuShell-mainTabs",
1741
+ TabstripProps: {
1742
+ allowAddTab: true,
1743
+ allowCloseTab: true,
1744
+ allowRenameTab: true,
1745
+ animateSelectionThumb: false,
1746
+ location: "main-tab",
1747
+ variant: "primary"
1748
+ },
1749
+ preserve: true,
1750
+ active: 0
1751
+ },
1752
+ children: [
1753
+ {
1754
+ props: {
1755
+ id: "tab1",
1756
+ title: "Tab 1",
1757
+ className: "vuuShell-Placeholder"
1758
+ },
1759
+ type: "Placeholder"
1760
+ }
1761
+ ]
1762
+ }
1763
+ };
1764
+
1765
+ // src/persistence-management/LocalPersistenceManager.ts
1766
+ var import_vuu_filters = require("@vuu-ui/vuu-filters");
1767
+ var import_vuu_utils4 = require("@vuu-ui/vuu-utils");
1768
+ var baseMetadataSaveLocation = "layouts/metadata";
1769
+ var baseLayoutsSaveLocation = "layouts/layouts";
1770
+ var _urlKey;
1771
+ var LocalPersistenceManager = class {
1772
+ constructor(urlKey) {
1773
+ this.username = getAuthDetailsFromCookies()[0];
1774
+ this.metadataSaveLocation = `${baseMetadataSaveLocation}/${this.username}`;
1775
+ this.layoutsSaveLocation = `${baseLayoutsSaveLocation}/${this.username}`;
1776
+ __privateAdd(this, _urlKey, `api/vui/${this.username}`);
1777
+ this.loadLayouts = () => {
1778
+ return new Promise((resolve) => {
1779
+ const layouts = (0, import_vuu_filters.getLocalEntity)(this.layoutsSaveLocation);
1780
+ resolve(layouts || []);
1781
+ });
1782
+ };
1783
+ this.saveLayoutsWithMetadata = (layouts, metadata) => {
1784
+ (0, import_vuu_filters.saveLocalEntity)(this.layoutsSaveLocation, layouts);
1785
+ (0, import_vuu_filters.saveLocalEntity)(this.metadataSaveLocation, metadata);
1786
+ };
1787
+ // Ensures that there is exactly one Layout entry and exactly one Metadata
1788
+ // entry in local storage corresponding to the provided ID.
1789
+ this.validateIds = async (id) => {
1790
+ return Promise.all([
1791
+ this.validateId(id, "metadata").catch((error2) => error2.message),
1792
+ this.validateId(id, "layout").catch((error2) => error2.message)
1793
+ ]).then((errorMessages) => {
1794
+ const combinedMessage = errorMessages.filter((msg) => msg !== void 0).join("; ");
1795
+ if (combinedMessage) {
1796
+ throw new Error(combinedMessage);
1797
+ }
1798
+ });
1799
+ };
1800
+ // Ensures that there is exactly one element (Layout or Metadata) in local
1801
+ // storage corresponding to the provided ID.
1802
+ this.validateId = (id, dataType) => {
1803
+ return new Promise((resolve, reject) => {
1804
+ const loadFunc = dataType === "metadata" ? () => this.loadMetadata() : () => this.loadLayouts();
1805
+ loadFunc().then((array) => {
1806
+ const count = array.filter((element) => element.id === id).length;
1807
+ switch (count) {
1808
+ case 1: {
1809
+ resolve();
1810
+ break;
1811
+ }
1812
+ case 0: {
1813
+ reject(new Error(`No ${dataType} with ID ${id}`));
1814
+ break;
1815
+ }
1816
+ default:
1817
+ reject(new Error(`Non-unique ${dataType} with ID ${id}`));
1818
+ }
1819
+ });
1820
+ });
1821
+ };
1822
+ if (urlKey) {
1823
+ __privateSet(this, _urlKey, urlKey);
1824
+ }
1825
+ }
1826
+ createLayout(metadata, layout) {
1827
+ return new Promise((resolve) => {
1828
+ Promise.all([this.loadLayouts(), this.loadMetadata()]).then(
1829
+ ([existingLayouts, existingMetadata]) => {
1830
+ const id = (0, import_vuu_utils4.getUniqueId)();
1831
+ const newMetadata = {
1832
+ ...metadata,
1833
+ id,
1834
+ created: (0, import_vuu_utils4.formatDate)({ date: "dd.mm.yyyy" })(/* @__PURE__ */ new Date())
1835
+ };
1836
+ this.saveLayoutsWithMetadata(
1837
+ [...existingLayouts, { id, json: layout }],
1838
+ [...existingMetadata, newMetadata]
1839
+ );
1840
+ resolve(newMetadata);
1841
+ }
1842
+ );
1843
+ });
1844
+ }
1845
+ updateLayout(id, newMetadata, newLayout) {
1846
+ return new Promise((resolve, reject) => {
1847
+ this.validateIds(id).then(() => Promise.all([this.loadLayouts(), this.loadMetadata()])).then(([existingLayouts, existingMetadata]) => {
1848
+ const updatedLayouts = existingLayouts.map(
1849
+ (layout) => layout.id === id ? { ...layout, json: newLayout } : layout
1850
+ );
1851
+ const updatedMetadata = existingMetadata.map(
1852
+ (metadata) => metadata.id === id ? { ...metadata, ...newMetadata } : metadata
1853
+ );
1854
+ this.saveLayoutsWithMetadata(updatedLayouts, updatedMetadata);
1855
+ resolve();
1856
+ }).catch((e) => reject(e));
1857
+ });
1858
+ }
1859
+ deleteLayout(id) {
1860
+ return new Promise((resolve, reject) => {
1861
+ this.validateIds(id).then(() => Promise.all([this.loadLayouts(), this.loadMetadata()])).then(([existingLayouts, existingMetadata]) => {
1862
+ const layouts = existingLayouts.filter((layout) => layout.id !== id);
1863
+ const metadata = existingMetadata.filter(
1864
+ (metadata2) => metadata2.id !== id
1865
+ );
1866
+ this.saveLayoutsWithMetadata(layouts, metadata);
1867
+ resolve();
1868
+ }).catch((e) => reject(e));
1869
+ });
1870
+ }
1871
+ loadLayout(id) {
1872
+ return new Promise((resolve, reject) => {
1873
+ this.validateId(id, "layout").then(() => this.loadLayouts()).then((existingLayouts) => {
1874
+ const foundLayout = existingLayouts.find(
1875
+ (layout) => layout.id === id
1876
+ );
1877
+ if (foundLayout) {
1878
+ resolve(foundLayout.json);
1879
+ } else {
1880
+ reject(new Error(`no layout found matching id ${id}`));
1881
+ }
1882
+ }).catch((e) => reject(e));
1883
+ });
1884
+ }
1885
+ loadMetadata() {
1886
+ return new Promise((resolve) => {
1887
+ const metadata = (0, import_vuu_filters.getLocalEntity)(
1888
+ this.metadataSaveLocation
1889
+ );
1890
+ resolve(metadata || []);
1891
+ });
1892
+ }
1893
+ loadApplicationJSON() {
1894
+ return new Promise((resolve) => {
1895
+ const applicationJSON = (0, import_vuu_filters.getLocalEntity)(__privateGet(this, _urlKey));
1896
+ if (applicationJSON) {
1897
+ resolve(applicationJSON);
1898
+ } else {
1899
+ resolve(defaultApplicationJson);
1900
+ }
1901
+ });
1902
+ }
1903
+ saveApplicationJSON(applicationJSON) {
1904
+ return new Promise((resolve, reject) => {
1905
+ const savedLayout = (0, import_vuu_filters.saveLocalEntity)(
1906
+ __privateGet(this, _urlKey),
1907
+ applicationJSON
1908
+ );
1909
+ if (savedLayout) {
1910
+ resolve();
1911
+ } else {
1912
+ reject(new Error("Application Json failed to save"));
1913
+ }
1914
+ });
1915
+ }
1916
+ };
1917
+ _urlKey = new WeakMap();
1918
+
1919
+ // src/persistence-management/useLayoutContextMenuItems.tsx
1920
+ var import_react13 = require("react");
1921
+ var import_jsx_runtime14 = require("react/jsx-runtime");
1922
+ var useLayoutContextMenuItems = (setDialogState) => {
1923
+ const { saveLayout } = useLayoutManager();
1924
+ const handleCloseDialog = (0, import_react13.useCallback)(() => {
1925
+ setDialogState(void 0);
1926
+ }, [setDialogState]);
1927
+ const handleSave = (0, import_react13.useCallback)(
1928
+ (layoutMetadata) => {
1929
+ saveLayout(layoutMetadata);
1930
+ setDialogState(void 0);
1931
+ },
1932
+ [saveLayout, setDialogState]
1933
+ );
1934
+ const [buildMenuOptions, handleMenuAction] = (0, import_react13.useMemo)(() => {
1935
+ return [
1936
+ (location, options) => {
1937
+ const locations = location.split(" ");
1938
+ const menuDescriptors = [];
1939
+ if (locations.includes("main-tab")) {
1940
+ menuDescriptors.push(
1941
+ {
1942
+ label: "Save Layout",
1943
+ action: "save-layout",
1944
+ options
1945
+ },
1946
+ {
1947
+ label: "Layout Settings",
1948
+ action: "layout-settings",
1949
+ options
1950
+ }
1951
+ );
1952
+ }
1953
+ return menuDescriptors;
1954
+ },
1955
+ (action) => {
1956
+ var _a, _b;
1957
+ console.log("menu action", {
1958
+ action
1959
+ });
1960
+ if (action.menuId === "save-layout") {
1961
+ setDialogState({
1962
+ content: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1963
+ SaveLayoutPanel,
1964
+ {
1965
+ onCancel: handleCloseDialog,
1966
+ onSave: handleSave,
1967
+ componentId: (_a = action.options) == null ? void 0 : _a.controlledComponentId,
1968
+ defaultTitle: (_b = action.options) == null ? void 0 : _b.controlledComponentTitle
1969
+ }
1970
+ ),
1971
+ title: "Save Layout",
1972
+ hideCloseButton: true
1973
+ });
1974
+ return true;
1975
+ }
1976
+ return false;
1977
+ }
1978
+ ];
1979
+ }, [handleCloseDialog, handleSave, setDialogState]);
1980
+ return {
1981
+ buildMenuOptions,
1982
+ handleMenuAction
1983
+ };
1984
+ };
1985
+
1986
+ // src/layout-management/useLayoutManager.tsx
1987
+ var import_jsx_runtime15 = require("react/jsx-runtime");
1988
+ var _persistenceManager;
1989
+ var getPersistenceManager = () => {
1990
+ if (_persistenceManager === void 0) {
1991
+ _persistenceManager = true ? new LocalPersistenceManager() : new RemotePersistenceManager();
1992
+ }
1993
+ return _persistenceManager;
1994
+ };
1995
+ var LayoutManagementContext = import_react14.default.createContext({
1996
+ getApplicationSettings: () => void 0,
1997
+ layoutMetadata: [],
1998
+ saveLayout: () => void 0,
1999
+ // The default Application JSON will be served if no LayoutManagementProvider
2000
+ applicationJson: defaultApplicationJson,
2001
+ saveApplicationLayout: () => void 0,
2002
+ saveApplicationSettings: () => void 0,
2003
+ loadLayoutById: () => void 0
2004
+ });
2005
+ var ensureLayoutHasTitle = (layout, layoutMetadata) => {
2006
+ var _a;
2007
+ if (((_a = layout.props) == null ? void 0 : _a.title) !== void 0) {
2008
+ return layout;
2009
+ } else {
2010
+ return {
2011
+ ...layout,
2012
+ props: {
2013
+ ...layout.props,
2014
+ title: layoutMetadata.name
2015
+ }
2016
+ };
2017
+ }
2018
+ };
2019
+ var LayoutManagementProvider = (props) => {
2020
+ const [layoutMetadata, setLayoutMetadata] = (0, import_react14.useState)([]);
2021
+ const [, forceRefresh] = (0, import_react14.useState)({});
2022
+ const { notify } = useNotifications();
2023
+ const applicationJSONRef = (0, import_react14.useRef)(loadingApplicationJson);
2024
+ const setApplicationJSON = (0, import_react14.useCallback)(
2025
+ (applicationJSON, rerender = true) => {
2026
+ applicationJSONRef.current = applicationJSON;
2027
+ if (rerender) {
2028
+ forceRefresh({});
2029
+ }
2030
+ },
2031
+ []
2032
+ );
2033
+ const setApplicationLayout = (0, import_react14.useCallback)(
2034
+ (layout, rerender = true) => {
2035
+ setApplicationJSON(
2036
+ {
2037
+ ...applicationJSONRef.current,
2038
+ layout
2039
+ },
2040
+ rerender
2041
+ );
2042
+ },
2043
+ [setApplicationJSON]
2044
+ );
2045
+ const setApplicationSettings = (0, import_react14.useCallback)(
2046
+ (settings) => {
2047
+ setApplicationJSON(
2048
+ {
2049
+ ...applicationJSONRef.current,
2050
+ settings: {
2051
+ ...applicationJSONRef.current.settings,
2052
+ ...settings
2053
+ }
2054
+ },
2055
+ false
2056
+ );
2057
+ },
2058
+ [setApplicationJSON]
2059
+ );
2060
+ (0, import_react14.useEffect)(() => {
2061
+ const persistenceManager = getPersistenceManager();
2062
+ persistenceManager.loadMetadata().then((metadata) => {
2063
+ setLayoutMetadata(metadata);
2064
+ }).catch((error2) => {
2065
+ notify({
2066
+ type: "error" /* Error */,
2067
+ header: "Failed to Load Layouts",
2068
+ body: "Could not load list of available layouts"
2069
+ });
2070
+ console.error("Error occurred while retrieving metadata", error2);
2071
+ });
2072
+ persistenceManager.loadApplicationJSON().then((applicationJSON) => {
2073
+ setApplicationJSON(applicationJSON);
2074
+ }).catch((error2) => {
2075
+ notify({
2076
+ type: "error" /* Error */,
2077
+ header: "Failed to Load Layout",
2078
+ body: "Could not load your latest view"
2079
+ });
2080
+ console.error(
2081
+ "Error occurred while retrieving application layout",
2082
+ error2
2083
+ );
2084
+ });
2085
+ }, [notify, setApplicationJSON]);
2086
+ const saveApplicationLayout = (0, import_react14.useCallback)(
2087
+ (layout) => {
2088
+ if ((0, import_vuu_layout2.isLayoutJSON)(layout)) {
2089
+ setApplicationLayout(layout, false);
2090
+ getPersistenceManager().saveApplicationJSON(applicationJSONRef.current);
2091
+ } else {
2092
+ console.error("Tried to save invalid application layout", layout);
2093
+ }
2094
+ },
2095
+ [setApplicationLayout]
2096
+ );
2097
+ const saveLayout = (0, import_react14.useCallback)(
2098
+ (metadata) => {
2099
+ const layoutToSave = (0, import_vuu_layout2.resolveJSONPath)(
2100
+ applicationJSONRef.current.layout,
2101
+ "#main-tabs.ACTIVE_CHILD"
2102
+ );
2103
+ if (layoutToSave && (0, import_vuu_layout2.isLayoutJSON)(layoutToSave)) {
2104
+ getPersistenceManager().createLayout(metadata, ensureLayoutHasTitle(layoutToSave, metadata)).then((metadata2) => {
2105
+ notify({
2106
+ type: "success" /* Success */,
2107
+ header: "Layout Saved Successfully",
2108
+ body: `${metadata2.name} saved successfully`
2109
+ });
2110
+ setLayoutMetadata((prev) => [...prev, metadata2]);
2111
+ }).catch((error2) => {
2112
+ notify({
2113
+ type: "error" /* Error */,
2114
+ header: "Failed to Save Layout",
2115
+ body: `Failed to save layout ${metadata.name}`
2116
+ });
2117
+ console.error("Error occurred while saving layout", error2);
2118
+ });
2119
+ } else {
2120
+ console.error("Tried to save invalid layout", layoutToSave);
2121
+ notify({
2122
+ type: "error" /* Error */,
2123
+ header: "Failed to Save Layout",
2124
+ body: "Cannot save invalid layout"
2125
+ });
2126
+ }
2127
+ },
2128
+ [notify]
2129
+ );
2130
+ const saveApplicationSettings = (0, import_react14.useCallback)(
2131
+ (settings, key) => {
2132
+ const { settings: applicationSettings } = applicationJSONRef.current;
2133
+ if (key) {
2134
+ setApplicationSettings({
2135
+ ...applicationSettings,
2136
+ [key]: settings
2137
+ });
2138
+ } else {
2139
+ setApplicationSettings(settings);
2140
+ }
2141
+ getPersistenceManager().saveApplicationJSON(applicationJSONRef.current);
2142
+ },
2143
+ [setApplicationSettings]
2144
+ );
2145
+ const getApplicationSettings = (0, import_react14.useCallback)(
2146
+ (key) => {
2147
+ const { settings } = applicationJSONRef.current;
2148
+ return key ? settings == null ? void 0 : settings[key] : settings;
2149
+ },
2150
+ []
2151
+ );
2152
+ const loadLayoutById = (0, import_react14.useCallback)(
2153
+ (id) => {
2154
+ getPersistenceManager().loadLayout(id).then((layoutJson) => {
2155
+ var _a, _b;
2156
+ const { layout: currentLayout } = applicationJSONRef.current;
2157
+ setApplicationLayout({
2158
+ ...currentLayout,
2159
+ children: (currentLayout.children || []).concat(layoutJson),
2160
+ props: {
2161
+ ...currentLayout.props,
2162
+ active: (_b = (_a = currentLayout.children) == null ? void 0 : _a.length) != null ? _b : 0
2163
+ }
2164
+ });
2165
+ }).catch((error2) => {
2166
+ notify({
2167
+ type: "error" /* Error */,
2168
+ header: "Failed to Load Layout",
2169
+ body: "Failed to load the requested layout"
2170
+ });
2171
+ console.error("Error occurred while loading layout", error2);
2172
+ });
2173
+ },
2174
+ [notify, setApplicationLayout]
2175
+ );
2176
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
2177
+ LayoutManagementContext.Provider,
2178
+ {
2179
+ value: {
2180
+ getApplicationSettings,
2181
+ layoutMetadata,
2182
+ saveLayout,
2183
+ applicationJson: applicationJSONRef.current,
2184
+ saveApplicationLayout,
2185
+ saveApplicationSettings,
2186
+ loadLayoutById
2187
+ },
2188
+ children: props.children
2189
+ }
2190
+ );
2191
+ };
2192
+ var useLayoutManager = () => (0, import_react14.useContext)(LayoutManagementContext);
2193
+
2194
+ // src/layout-management/LayoutTile.tsx
2195
+ var import_jsx_runtime16 = require("react/jsx-runtime");
2196
+ var classBase6 = "vuuLayoutTile";
2197
+ var LayoutTile = (props) => {
2198
+ const { metadata, handleLoadLayout } = props;
2199
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { role: "listitem", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
2200
+ "div",
2201
+ {
2202
+ className: `${classBase6}-layoutTile`,
2203
+ role: "button",
2204
+ onClick: () => handleLoadLayout(metadata == null ? void 0 : metadata.id),
2205
+ children: [
2206
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("img", { className: `${classBase6}-screenshot`, src: metadata == null ? void 0 : metadata.screenshot }),
2207
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { children: [
2208
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: `${classBase6}-layoutName`, children: metadata == null ? void 0 : metadata.name }),
2209
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: `${classBase6}-layoutDetails`, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children: `${metadata == null ? void 0 : metadata.user}, ${metadata == null ? void 0 : metadata.created}` }) })
2210
+ ] })
2211
+ ]
2212
+ },
2213
+ metadata == null ? void 0 : metadata.id
2214
+ ) });
2215
+ };
2216
+
2217
+ // src/layout-management/LayoutList.tsx
2218
+ var import_jsx_runtime17 = require("react/jsx-runtime");
2219
+ var classBase7 = "vuuLayoutList";
2220
+ var LayoutList = (props) => {
2221
+ const { layoutMetadata, loadLayoutById } = useLayoutManager();
2222
+ const handleLoadLayout = (layoutId) => {
2223
+ if (layoutId) {
2224
+ loadLayoutById(layoutId);
2225
+ }
2226
+ };
2227
+ const layoutsByGroup = layoutMetadata.reduce((acc, cur) => {
2228
+ if (acc[cur.group]) {
2229
+ return {
2230
+ ...acc,
2231
+ [cur.group]: [...acc[cur.group], cur]
2232
+ };
2233
+ }
2234
+ return {
2235
+ ...acc,
2236
+ [cur.group]: [cur]
2237
+ };
2238
+ }, {});
2239
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
2240
+ "div",
2241
+ {
2242
+ className: classBase7,
2243
+ ...props,
2244
+ role: "listbox",
2245
+ "aria-label": "my layouts",
2246
+ children: [
2247
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: `${classBase7}-header`, children: "My Layouts" }),
2248
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
2249
+ import_vuu_ui_controls4.List,
2250
+ {
2251
+ height: "auto",
2252
+ source: Object.entries(layoutsByGroup),
2253
+ ListItem: ({ item }) => {
2254
+ if (!item)
2255
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, {});
2256
+ const [groupName, layoutMetadata2] = item;
2257
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { role: "list", "aria-label": groupName, children: [
2258
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: `${classBase7}-groupName`, children: groupName }),
2259
+ layoutMetadata2.map((metadata) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
2260
+ LayoutTile,
2261
+ {
2262
+ metadata,
2263
+ handleLoadLayout
2264
+ },
2265
+ metadata.id
2266
+ ))
2267
+ ] });
2268
+ }
2269
+ }
2270
+ )
2271
+ ]
2272
+ }
2273
+ );
2274
+ };
2275
+
2276
+ // src/left-nav/LeftNav.tsx
2277
+ var import_vuu_icons = require("@vuu-ui/vuu-icons");
2278
+ var import_vuu_layout4 = require("@vuu-ui/vuu-layout");
2279
+ var import_vuu_ui_controls5 = require("@vuu-ui/vuu-ui-controls");
2280
+ var import_vuu_utils5 = require("@vuu-ui/vuu-utils");
2281
+ var import_clsx7 = __toESM(require("clsx"));
2282
+ var import_react15 = require("react");
2283
+
2284
+ // src/feature-list/FeatureList.tsx
2285
+ var import_vuu_layout3 = require("@vuu-ui/vuu-layout");
2286
+ var import_jsx_runtime18 = require("react/jsx-runtime");
2287
+ var classBase8 = "vuuFeatureList";
2288
+ var FeatureList = ({
2289
+ features,
2290
+ title = "VUU TABLES",
2291
+ ...htmlAttributes
2292
+ }) => {
2293
+ const ViewProps2 = {};
2294
+ const listProps = {
2295
+ height: "100%"
2296
+ };
2297
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { ...htmlAttributes, className: classBase8, children: [
2298
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: `${classBase8}-header`, children: title }),
2299
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: `${classBase8}-content`, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
2300
+ import_vuu_layout3.Palette,
2301
+ {
2302
+ orientation: "vertical",
2303
+ ListProps: listProps,
2304
+ ViewProps: ViewProps2,
2305
+ children: features.map((featureProps, i) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
2306
+ import_vuu_layout3.PaletteItem,
2307
+ {
2308
+ closeable: true,
2309
+ label: featureProps.title,
2310
+ resizeable: true,
2311
+ resize: "defer",
2312
+ header: true,
2313
+ children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Feature, { ...featureProps })
2314
+ },
2315
+ i
2316
+ ))
2317
+ }
2318
+ ) })
2319
+ ] });
2320
+ };
2321
+
2322
+ // src/left-nav/LeftNav.tsx
2323
+ var import_jsx_runtime19 = require("react/jsx-runtime");
2324
+ var classBase9 = "vuuLeftNav";
2325
+ var getDisplayStatus = (activeTabIndex, expanded) => {
2326
+ if (activeTabIndex === 0) {
2327
+ return expanded ? "menu-full" : "menu-icons";
2328
+ } else {
2329
+ return expanded ? "menu-full-content" : "menu-icons-content";
2330
+ }
2331
+ };
2332
+ var LeftNav = (props) => {
2333
+ const dispatch = (0, import_vuu_layout4.useLayoutProviderDispatch)();
2334
+ const [themeClass] = (0, import_vuu_utils5.useThemeAttributes)();
2335
+ const {
2336
+ "data-path": path,
2337
+ defaultExpanded = true,
2338
+ defaultActiveTabIndex = 0,
2339
+ features,
2340
+ onActiveChange,
2341
+ onTogglePrimaryMenu,
2342
+ sizeCollapsed = 80,
2343
+ sizeContent = 300,
2344
+ sizeExpanded = 240,
2345
+ style: styleProp,
2346
+ tableFeatures,
2347
+ ...htmlAttributes
2348
+ } = props;
2349
+ const [navState, setNavState] = (0, import_react15.useState)({
2350
+ activeTabIndex: defaultActiveTabIndex,
2351
+ expanded: defaultExpanded
2352
+ });
2353
+ const getFullWidth = (0, import_react15.useCallback)(
2354
+ (tabIndex, expanded) => {
2355
+ if (tabIndex === 0) {
2356
+ return expanded ? sizeExpanded : sizeCollapsed;
2357
+ } else {
2358
+ return expanded ? sizeExpanded + sizeContent : sizeCollapsed + sizeContent;
2359
+ }
2360
+ },
2361
+ [sizeCollapsed, sizeContent, sizeExpanded]
2362
+ );
2363
+ const handleTabSelection = (0, import_react15.useCallback)(
2364
+ (activeTabIndex) => {
2365
+ const { activeTabIndex: currentIndex, expanded } = navState;
2366
+ const newState = { activeTabIndex, expanded };
2367
+ setNavState(newState);
2368
+ if (activeTabIndex === 0 || currentIndex === 0) {
2369
+ const width = getFullWidth(activeTabIndex, expanded);
2370
+ dispatch({
2371
+ type: "layout-resize",
2372
+ path: "#vuu-side-panel",
2373
+ size: width
2374
+ });
2375
+ }
2376
+ onActiveChange == null ? void 0 : onActiveChange(activeTabIndex);
2377
+ },
2378
+ [dispatch, getFullWidth, navState, onActiveChange]
2379
+ );
2380
+ const displayStatus = getDisplayStatus(
2381
+ navState.activeTabIndex,
2382
+ navState.expanded
2383
+ );
2384
+ const toggleExpanded = (0, import_react15.useCallback)(() => {
2385
+ const { activeTabIndex, expanded } = navState;
2386
+ const primaryMenuExpanded = !expanded;
2387
+ const newState = { activeTabIndex, expanded: primaryMenuExpanded };
2388
+ setNavState(newState);
2389
+ dispatch({
2390
+ type: "layout-resize",
2391
+ path: "#vuu-side-panel",
2392
+ size: getFullWidth(activeTabIndex, primaryMenuExpanded)
2393
+ });
2394
+ onTogglePrimaryMenu == null ? void 0 : onTogglePrimaryMenu(primaryMenuExpanded);
2395
+ }, [dispatch, getFullWidth, navState, onTogglePrimaryMenu]);
2396
+ const style = {
2397
+ ...styleProp,
2398
+ "--nav-menu-collapsed-width": `${sizeCollapsed}px`,
2399
+ "--nav-menu-expanded-width": `${sizeExpanded}px`,
2400
+ "--nav-menu-content-width": `${sizeContent}px`
2401
+ };
2402
+ return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
2403
+ "div",
2404
+ {
2405
+ ...htmlAttributes,
2406
+ className: (0, import_clsx7.default)(classBase9, `${classBase9}-${displayStatus}`),
2407
+ style,
2408
+ children: [
2409
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
2410
+ "div",
2411
+ {
2412
+ className: (0, import_clsx7.default)(`${classBase9}-menu-primary`, themeClass),
2413
+ "data-mode": "dark",
2414
+ children: [
2415
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "vuuLeftNav-logo", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_vuu_icons.VuuLogo, {}) }),
2416
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: `${classBase9}-main`, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
2417
+ import_vuu_ui_controls5.Tabstrip,
2418
+ {
2419
+ activeTabIndex: navState.activeTabIndex,
2420
+ animateSelectionThumb: false,
2421
+ className: `${classBase9}-Tabstrip`,
2422
+ onActiveChange: handleTabSelection,
2423
+ orientation: "vertical",
2424
+ children: [
2425
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_vuu_ui_controls5.Tab, { "data-icon": "demo", label: "DEMO" }),
2426
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_vuu_ui_controls5.Tab, { "data-icon": "features", label: "VUU FEATURES" }),
2427
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_vuu_ui_controls5.Tab, { "data-icon": "tables", label: "VUU TABLES" }),
2428
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_vuu_ui_controls5.Tab, { "data-icon": "layouts", label: "MY LAYOUTS" })
2429
+ ]
2430
+ }
2431
+ ) }),
2432
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "vuuLeftNav-buttonBar", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
2433
+ "button",
2434
+ {
2435
+ className: (0, import_clsx7.default)("vuuLeftNav-toggleButton", {
2436
+ "vuuLeftNav-toggleButton-open": displayStatus.startsWith("menu-full"),
2437
+ "vuuLeftNav-toggleButton-closed": displayStatus.startsWith("menu-icons")
2438
+ }),
2439
+ "data-icon": displayStatus.startsWith("menu-full") ? "chevron-left" : "chevron-right",
2440
+ onClick: toggleExpanded
2441
+ }
2442
+ ) })
2443
+ ]
2444
+ }
2445
+ ),
2446
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
2447
+ import_vuu_layout4.Stack,
2448
+ {
2449
+ active: navState.activeTabIndex - 1,
2450
+ className: `${classBase9}-menu-secondary`,
2451
+ showTabs: false,
2452
+ children: [
2453
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(FeatureList, { features, title: "VUU FEATURES" }),
2454
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(FeatureList, { features: tableFeatures, title: "VUU TABLES" }),
2455
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "vuuLeftNav-drawer", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LayoutList, {}) })
2456
+ ]
2457
+ }
2458
+ )
2459
+ ]
2460
+ }
2461
+ );
2462
+ };
2463
+
2464
+ // src/session-editing-form/SessionEditingForm.tsx
2465
+ var import_vuu_data_remote = require("@vuu-ui/vuu-data-remote");
2466
+ var import_vuu_utils6 = require("@vuu-ui/vuu-utils");
2467
+ var import_core5 = require("@salt-ds/core");
2468
+ var import_clsx8 = __toESM(require("clsx"));
2469
+ var import_react16 = require("react");
2470
+ var import_jsx_runtime20 = require("react/jsx-runtime");
2471
+ var classBase10 = "vuuSessionEditingForm";
2472
+ var getField = (fields, name) => {
2473
+ const field = fields.find((f) => f.name === name);
2474
+ if (field) {
2475
+ return field;
2476
+ } else {
2477
+ throw Error(`SessionEditingForm, no field '${name}' found`);
2478
+ }
2479
+ };
2480
+ var getFieldNameAndValue = (evt) => {
2481
+ const {
2482
+ dataset: { field },
2483
+ value
2484
+ } = evt.target;
2485
+ if (field === void 0) {
2486
+ throw Error("SessionEditingForm, form field has no field name");
2487
+ }
2488
+ return [field, value];
2489
+ };
2490
+ var Status = {
2491
+ uninitialised: 0,
2492
+ unchanged: 1,
2493
+ changed: 2,
2494
+ invalid: 3
2495
+ };
2496
+ function getTypedValue(value, type, throwIfUndefined = false) {
2497
+ switch (type) {
2498
+ case "int":
2499
+ case "long": {
2500
+ const typedValue = parseInt(value, 10);
2501
+ if ((0, import_vuu_utils6.isValidNumber)(typedValue)) {
2502
+ return typedValue;
2503
+ } else if (throwIfUndefined) {
2504
+ throw Error("SessionEditingForm getTypedValue");
2505
+ } else {
2506
+ return void 0;
2507
+ }
2508
+ }
2509
+ case "double": {
2510
+ const typedValue = parseFloat(value);
2511
+ if ((0, import_vuu_utils6.isValidNumber)(typedValue)) {
2512
+ return typedValue;
2513
+ }
2514
+ return void 0;
2515
+ }
2516
+ case "boolean":
2517
+ return value === "true" ? true : false;
2518
+ default:
2519
+ return value;
2520
+ }
2521
+ }
2522
+ var getDataSource = (dataSource, schema) => {
2523
+ if (dataSource) {
2524
+ return dataSource;
2525
+ } else if (schema) {
2526
+ return new import_vuu_data_remote.VuuDataSource({
2527
+ bufferSize: 0,
2528
+ table: schema.table,
2529
+ columns: schema.columns.map((col) => col.name)
2530
+ });
2531
+ } else {
2532
+ throw Error(
2533
+ "SessionEditingForm: either a DataSource or a TableSchema must be provided"
2534
+ );
2535
+ }
2536
+ };
2537
+ var SessionEditingForm = ({
2538
+ className,
2539
+ config: { fields, key: keyField },
2540
+ dataSource: dataSourceProp,
2541
+ id: idProp,
2542
+ onClose,
2543
+ schema,
2544
+ ...htmlAttributes
2545
+ }) => {
2546
+ const [values, setValues] = (0, import_react16.useState)();
2547
+ const [errorMessage, setErrorMessage] = (0, import_react16.useState)("");
2548
+ const formContentRef = (0, import_react16.useRef)(null);
2549
+ const initialDataRef = (0, import_react16.useRef)();
2550
+ const dataStatusRef = (0, import_react16.useRef)(Status.uninitialised);
2551
+ const dataSource = (0, import_react16.useMemo)(() => {
2552
+ const applyServerData = (data) => {
2553
+ if (columnMap) {
2554
+ const values2 = {};
2555
+ for (const column of dataSource.columns) {
2556
+ values2[column] = data[columnMap[column]];
2557
+ }
2558
+ if (dataStatusRef.current === Status.uninitialised) {
2559
+ dataStatusRef.current = Status.unchanged;
2560
+ initialDataRef.current = values2;
2561
+ }
2562
+ setValues(values2);
2563
+ }
2564
+ };
2565
+ const ds = getDataSource(dataSourceProp, schema);
2566
+ const columnMap = (0, import_vuu_utils6.buildColumnMap)(ds.columns);
2567
+ ds.subscribe({ range: { from: 0, to: 5 } }, (message) => {
2568
+ if (message.type === "viewport-update" && message.rows) {
2569
+ if (dataStatusRef.current === Status.uninitialised) {
2570
+ applyServerData(message.rows[0]);
2571
+ } else {
2572
+ console.log("what do we do with server updates");
2573
+ }
2574
+ }
2575
+ });
2576
+ return ds;
2577
+ }, [dataSourceProp, schema]);
2578
+ const id = (0, import_core5.useIdMemo)(idProp);
2579
+ const handleChange = (0, import_react16.useCallback)(
2580
+ (evt) => {
2581
+ const [field, value] = getFieldNameAndValue(evt);
2582
+ const { type } = getField(fields, field);
2583
+ const typedValue = getTypedValue(value, type);
2584
+ setValues((values2 = {}) => {
2585
+ const newValues = {
2586
+ ...values2,
2587
+ [field]: typedValue
2588
+ };
2589
+ const notUpdated = (0, import_vuu_utils6.shallowEquals)(newValues, initialDataRef.current);
2590
+ dataStatusRef.current = notUpdated ? Status.unchanged : typedValue !== void 0 ? Status.changed : Status.invalid;
2591
+ return newValues;
2592
+ });
2593
+ },
2594
+ [fields]
2595
+ );
2596
+ const handleBlur = (0, import_react16.useCallback)(
2597
+ (evt) => {
2598
+ const [field, value] = getFieldNameAndValue(evt);
2599
+ const { type } = getField(fields, field);
2600
+ const rowKey = values == null ? void 0 : values[keyField];
2601
+ const typedValue = getTypedValue(value, type, true);
2602
+ if (typeof rowKey === "string") {
2603
+ dataSource.menuRpcCall({
2604
+ rowKey,
2605
+ field,
2606
+ value: typedValue,
2607
+ type: "VP_EDIT_CELL_RPC"
2608
+ });
2609
+ }
2610
+ },
2611
+ [dataSource, fields, keyField, values]
2612
+ );
2613
+ const applyAction = (0, import_react16.useCallback)(
2614
+ (action) => {
2615
+ if (typeof action === "object" && action !== null) {
2616
+ if ("type" in action && action.type === "CLOSE_DIALOG_ACTION") {
2617
+ onClose();
2618
+ }
2619
+ }
2620
+ },
2621
+ [onClose]
2622
+ );
2623
+ const handleSubmit = (0, import_react16.useCallback)(async () => {
2624
+ const response = await dataSource.menuRpcCall({
2625
+ type: "VP_EDIT_SUBMIT_FORM_RPC"
2626
+ });
2627
+ if ((0, import_vuu_utils6.isErrorResponse)(response)) {
2628
+ setErrorMessage(response.error);
2629
+ } else if ((0, import_vuu_utils6.hasAction)(response)) {
2630
+ applyAction(response.action);
2631
+ }
2632
+ }, [applyAction, dataSource]);
2633
+ const handleKeyDown = (0, import_react16.useCallback)(
2634
+ (evt) => {
2635
+ if (evt.key === "Enter" && dataStatusRef.current === Status.changed) {
2636
+ handleSubmit();
2637
+ }
2638
+ },
2639
+ [handleSubmit]
2640
+ );
2641
+ const handleCancel = (0, import_react16.useCallback)(() => {
2642
+ onClose();
2643
+ }, [onClose]);
2644
+ const getFormControl = (field) => {
2645
+ var _a;
2646
+ const value = String((_a = values == null ? void 0 : values[field.name]) != null ? _a : "");
2647
+ if (field.readonly || field.name === keyField) {
2648
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: `${classBase10}-fieldValue vuuReadOnly`, children: value });
2649
+ } else {
2650
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
2651
+ "input",
2652
+ {
2653
+ className: `${classBase10}-fieldValue`,
2654
+ "data-field": field.name,
2655
+ onBlur: handleBlur,
2656
+ onChange: handleChange,
2657
+ type: "text",
2658
+ value,
2659
+ id: `${id}-input-${field.name}`
2660
+ }
2661
+ );
2662
+ }
2663
+ };
2664
+ (0, import_react16.useEffect)(() => {
2665
+ if (formContentRef.current) {
2666
+ const firstInput = formContentRef.current.querySelector(
2667
+ "input"
2668
+ );
2669
+ if (firstInput) {
2670
+ setTimeout(() => {
2671
+ firstInput.focus();
2672
+ firstInput.select();
2673
+ }, 100);
2674
+ }
2675
+ }
2676
+ }, []);
2677
+ (0, import_react16.useEffect)(() => {
2678
+ return () => {
2679
+ if (dataSource) {
2680
+ dataSource.unsubscribe();
2681
+ }
2682
+ };
2683
+ }, [dataSource]);
2684
+ const isDirty = dataStatusRef.current === Status.changed;
2685
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { ...htmlAttributes, className: (0, import_clsx8.default)(classBase10, className), children: [
2686
+ errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
2687
+ "div",
2688
+ {
2689
+ className: `${classBase10}-errorBanner`,
2690
+ "data-icon": "error",
2691
+ title: errorMessage,
2692
+ children: "Error, edit(s) not saved"
2693
+ }
2694
+ ) : void 0,
2695
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
2696
+ "div",
2697
+ {
2698
+ className: `${classBase10}-content`,
2699
+ ref: formContentRef,
2700
+ onKeyDown: handleKeyDown,
2701
+ children: fields.map((field) => {
2702
+ var _a;
2703
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: `${classBase10}-field`, children: [
2704
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
2705
+ "label",
2706
+ {
2707
+ className: (0, import_clsx8.default)(`${classBase10}-fieldLabel`, {
2708
+ [`${classBase10}-required`]: field.required
2709
+ }),
2710
+ htmlFor: `${id}-input-${field.name}`,
2711
+ children: (_a = field == null ? void 0 : field.label) != null ? _a : field.description
2712
+ }
2713
+ ),
2714
+ getFormControl(field)
2715
+ ] }, field.name);
2716
+ })
2717
+ }
2718
+ ),
2719
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: `${classBase10}-buttonbar salt-theme salt-density-high`, children: [
2720
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
2721
+ import_core5.Button,
2722
+ {
2723
+ type: "submit",
2724
+ variant: "cta",
2725
+ disabled: !isDirty,
2726
+ onClick: handleSubmit,
2727
+ children: "Submit"
2728
+ }
2729
+ ),
2730
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_core5.Button, { variant: "secondary", onClick: handleCancel, children: "Cancel" })
2731
+ ] })
2732
+ ] });
2733
+ };
2734
+
2735
+ // src/shell.tsx
2736
+ var import_vuu_data_remote2 = require("@vuu-ui/vuu-data-remote");
2737
+ var import_vuu_layout8 = require("@vuu-ui/vuu-layout");
2738
+ var import_vuu_utils7 = require("@vuu-ui/vuu-utils");
2739
+ var import_clsx11 = __toESM(require("clsx"));
2740
+ var import_react20 = require("react");
2741
+
2742
+ // src/shell-layouts/context-panel/ContextPanel.tsx
2743
+ var import_core6 = require("@salt-ds/core");
2744
+ var import_clsx9 = __toESM(require("clsx"));
2745
+ var import_react17 = require("react");
2746
+ var import_vuu_layout5 = require("@vuu-ui/vuu-layout");
2747
+ var import_jsx_runtime21 = require("react/jsx-runtime");
2748
+ var classBase11 = "vuuContextPanel";
2749
+ var ContextPanel = ({
2750
+ className: classNameProp,
2751
+ expanded = false,
2752
+ content: contentProp,
2753
+ overlay = false,
2754
+ title
2755
+ }) => {
2756
+ const dispatchLayoutAction = (0, import_vuu_layout5.useLayoutProviderDispatch)();
2757
+ const handleClose = (0, import_react17.useCallback)(() => {
2758
+ dispatchLayoutAction({
2759
+ path: "#context-panel",
2760
+ propName: "expanded",
2761
+ propValue: false,
2762
+ type: "set-prop"
2763
+ });
2764
+ }, [dispatchLayoutAction]);
2765
+ const className = (0, import_clsx9.default)(classBase11, classNameProp, {
2766
+ [`${classBase11}-expanded`]: expanded,
2767
+ [`${classBase11}-inline`]: overlay !== true,
2768
+ [`${classBase11}-overlay`]: overlay
2769
+ });
2770
+ const content = (0, import_react17.useMemo)(
2771
+ () => contentProp && expanded ? (0, import_vuu_layout5.layoutFromJson)(contentProp, "context-0") : null,
2772
+ [contentProp, expanded]
2773
+ );
2774
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
2775
+ "div",
2776
+ {
2777
+ className: (0, import_clsx9.default)(classBase11, className, {
2778
+ [`${classBase11}-expanded`]: expanded
2779
+ }),
2780
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_vuu_layout5.View, { className: `${classBase11}-inner`, header: false, id: "context-panel", children: [
2781
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: `${classBase11}-header`, children: [
2782
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h2", { className: `${classBase11}-title`, children: title }),
2783
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
2784
+ import_core6.Button,
2785
+ {
2786
+ className: `${classBase11}-close`,
2787
+ "data-icon": "close",
2788
+ onClick: handleClose,
2789
+ variant: "secondary"
2790
+ }
2791
+ )
2792
+ ] }),
2793
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: `${classBase11}-content`, children: content })
2794
+ ] })
2795
+ }
2796
+ );
2797
+ };
2798
+
2799
+ // src/shell-layouts/useFullHeightLeftPanel.tsx
2800
+ var import_vuu_layout6 = require("@vuu-ui/vuu-layout");
2801
+
2802
+ // src/shell-layouts/side-panel/SidePanel.tsx
2803
+ var import_react18 = require("react");
2804
+ var import_clsx10 = __toESM(require("clsx"));
2805
+ var import_jsx_runtime22 = require("react/jsx-runtime");
2806
+ var classBase12 = "vuuShellSidePanel";
2807
+ var SidePanel = ({
2808
+ children,
2809
+ open = true,
2810
+ sizeClosed = 90,
2811
+ sizeOpen = 200,
2812
+ style: styleProp,
2813
+ ...htmlAttributes
2814
+ }) => {
2815
+ const style = (0, import_react18.useMemo)(
2816
+ () => ({
2817
+ ...styleProp,
2818
+ "--shell-left-nav-size": open ? `${sizeOpen}px` : `${sizeClosed}px`
2819
+ }),
2820
+ [open, sizeClosed, sizeOpen, styleProp]
2821
+ );
2822
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { ...htmlAttributes, className: (0, import_clsx10.default)(classBase12), style, children });
2823
+ };
2824
+
2825
+ // src/shell-layouts/useFullHeightLeftPanel.tsx
2826
+ var import_jsx_runtime23 = require("react/jsx-runtime");
2827
+ var useFullHeightLeftPanel = ({
2828
+ appHeader,
2829
+ LeftSidePanelProps
2830
+ }) => {
2831
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
2832
+ import_vuu_layout6.Flexbox,
2833
+ {
2834
+ className: "App",
2835
+ style: {
2836
+ flexDirection: "row",
2837
+ height: "100%",
2838
+ width: "100%"
2839
+ },
2840
+ children: [
2841
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SidePanel, { ...LeftSidePanelProps, id: "vuu-side-panel" }),
2842
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
2843
+ import_vuu_layout6.Flexbox,
2844
+ {
2845
+ className: "vuuShell-content",
2846
+ style: { flex: 1, flexDirection: "column" },
2847
+ children: [
2848
+ appHeader,
2849
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_vuu_layout6.DraggableLayout, { dropTarget: true, style: { flex: 1 } }, "main-content")
2850
+ ]
2851
+ }
2852
+ ),
2853
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ContextPanel, { id: "context-panel", overlay: true })
2854
+ ]
2855
+ }
2856
+ );
2857
+ };
2858
+
2859
+ // src/shell-layouts/useInlayLeftPanel.tsx
2860
+ var import_vuu_layout7 = require("@vuu-ui/vuu-layout");
2861
+ var import_react19 = require("react");
2862
+ var import_jsx_runtime24 = require("react/jsx-runtime");
2863
+ var useInlayLeftPanel = ({
2864
+ appHeader,
2865
+ LeftSidePanelProps
2866
+ }) => {
2867
+ const paletteView = (0, import_react19.useRef)(null);
2868
+ const [open, setOpen] = (0, import_react19.useState)(true);
2869
+ const handleDrawerClick = (0, import_react19.useCallback)(
2870
+ (e) => {
2871
+ var _a;
2872
+ const target = e.target;
2873
+ if (!((_a = paletteView.current) == null ? void 0 : _a.contains(target))) {
2874
+ setOpen(!open);
2875
+ }
2876
+ },
2877
+ [open]
2878
+ );
2879
+ const getDrawers = (0, import_react19.useCallback)(
2880
+ (leftSidePanel) => {
2881
+ const drawers = [];
2882
+ drawers.push(
2883
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
2884
+ import_vuu_layout7.Drawer,
2885
+ {
2886
+ onClick: handleDrawerClick,
2887
+ open,
2888
+ position: "left",
2889
+ inline: true,
2890
+ peekaboo: true,
2891
+ sizeOpen: 200,
2892
+ toggleButton: "end",
2893
+ children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
2894
+ import_vuu_layout7.View,
2895
+ {
2896
+ className: "vuuShell-palette",
2897
+ id: "vw-app-palette",
2898
+ ref: paletteView,
2899
+ style: { height: "100%" },
2900
+ children: leftSidePanel
2901
+ },
2902
+ "app-palette"
2903
+ )
2904
+ },
2905
+ "left-panel"
2906
+ )
2907
+ );
2908
+ return drawers;
2909
+ },
2910
+ [handleDrawerClick, open]
2911
+ );
2912
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
2913
+ import_vuu_layout7.Flexbox,
2914
+ {
2915
+ className: "App",
2916
+ style: { flexDirection: "column", height: "100%", width: "100%" },
2917
+ children: [
2918
+ appHeader,
2919
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_vuu_layout7.DockLayout, { style: { flex: 1 }, children: getDrawers(LeftSidePanelProps == null ? void 0 : LeftSidePanelProps.children).concat(
2920
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
2921
+ import_vuu_layout7.DraggableLayout,
2922
+ {
2923
+ dropTarget: true,
2924
+ style: { width: "100%", height: "100%" }
2925
+ },
2926
+ "main-content"
2927
+ )
2928
+ ) })
2929
+ ]
2930
+ }
2931
+ );
2932
+ };
2933
+
2934
+ // src/shell-layouts/useShellLayout.ts
2935
+ var useShellLayout = ({
2936
+ leftSidePanelLayout = "inlay",
2937
+ ...props
2938
+ }) => {
2939
+ const useLayoutHook = leftSidePanelLayout === "inlay" ? useInlayLeftPanel : useFullHeightLeftPanel;
2940
+ return useLayoutHook(props);
2941
+ };
2942
+
2943
+ // src/shell.tsx
2944
+ var import_jsx_runtime25 = require("react/jsx-runtime");
2945
+ if (typeof import_vuu_layout8.StackLayout !== "function") {
2946
+ console.warn(
2947
+ "StackLayout module not loaded, will be unsbale to deserialize from layout JSON"
2948
+ );
2949
+ }
2950
+ var { error } = (0, import_vuu_utils7.logger)("Shell");
2951
+ var defaultLeftSidePanel = {};
2952
+ var Shell = ({
2953
+ LayoutProps,
2954
+ LeftSidePanelProps = defaultLeftSidePanel,
2955
+ children,
2956
+ className: classNameProp,
2957
+ leftSidePanelLayout,
2958
+ loginUrl,
2959
+ saveLocation: _,
2960
+ saveUrl,
2961
+ serverUrl,
2962
+ user,
2963
+ ...htmlAttributes
2964
+ }) => {
2965
+ const rootRef = (0, import_react20.useRef)(null);
2966
+ const { dialog, setDialogState } = useDialog();
2967
+ const layoutId = (0, import_react20.useRef)("latest");
2968
+ const { applicationJson, saveApplicationLayout, loadLayoutById } = useLayoutManager();
2969
+ const { buildMenuOptions, handleMenuAction } = useLayoutContextMenuItems(setDialogState);
2970
+ const [connectionStatus, setConnectionStatus] = (0, import_react20.useState)("connected");
2971
+ const handleLayoutChange = (0, import_react20.useCallback)(
2972
+ (layout) => {
2973
+ try {
2974
+ saveApplicationLayout(layout);
2975
+ } catch {
2976
+ error == null ? void 0 : error("Failed to save layout");
2977
+ }
2978
+ },
2979
+ [saveApplicationLayout]
2980
+ );
2981
+ const handleSwitchTheme = (0, import_react20.useCallback)((mode) => {
2982
+ if (rootRef.current) {
2983
+ rootRef.current.dataset.mode = mode;
2984
+ }
2985
+ }, []);
2986
+ const handleNavigate = (0, import_react20.useCallback)(
2987
+ (id) => {
2988
+ layoutId.current = id;
2989
+ loadLayoutById(id);
2990
+ },
2991
+ [loadLayoutById]
2992
+ );
2993
+ (0, import_react20.useMemo)(async () => {
2994
+ if (serverUrl && user.token) {
2995
+ const connectionStatus2 = await (0, import_vuu_data_remote2.connectToServer)({
2996
+ authToken: user.token,
2997
+ url: serverUrl,
2998
+ username: user.username
2999
+ });
3000
+ setConnectionStatus(connectionStatus2);
3001
+ }
3002
+ }, [serverUrl, user.token, user.username]);
3003
+ const [themeClass, densityClass, dataMode] = (0, import_vuu_utils7.useThemeAttributes)();
3004
+ const className = (0, import_clsx11.default)("vuuShell", classNameProp, themeClass, densityClass);
3005
+ const isLoading = applicationJson === loadingApplicationJson;
3006
+ const shellLayout = useShellLayout({
3007
+ LeftSidePanelProps,
3008
+ leftSidePanelLayout,
3009
+ appHeader: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
3010
+ AppHeader,
3011
+ {
3012
+ layoutId: layoutId.current,
3013
+ loginUrl,
3014
+ user,
3015
+ onNavigate: handleNavigate,
3016
+ onSwitchTheme: handleSwitchTheme
3017
+ }
3018
+ )
3019
+ });
3020
+ if (connectionStatus === "rejected") {
3021
+ console.log("game over, no connection to server");
3022
+ }
3023
+ return isLoading ? null : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_vuu_utils7.ThemeProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
3024
+ ContextMenuProvider,
3025
+ {
3026
+ menuActionHandler: handleMenuAction,
3027
+ menuBuilder: buildMenuOptions,
3028
+ children: [
3029
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
3030
+ import_vuu_layout8.LayoutProvider,
3031
+ {
3032
+ ...LayoutProps,
3033
+ layout: applicationJson.layout,
3034
+ onLayoutChange: handleLayoutChange,
3035
+ children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
3036
+ import_vuu_layout8.DraggableLayout,
3037
+ {
3038
+ className,
3039
+ "data-mode": dataMode,
3040
+ ref: rootRef,
3041
+ ...htmlAttributes,
3042
+ children: shellLayout
3043
+ }
3044
+ )
3045
+ }
3046
+ ),
3047
+ children || dialog
3048
+ ]
3049
+ }
3050
+ ) });
3051
+ };
3052
+
3053
+ // src/shellTypes.ts
3054
+ var isWildcardSchema = (schema) => schema === "*";
3055
+ var isTableSchema = (schema) => typeof schema === "object" && typeof schema.module === "string" && typeof schema.table === "string";
3056
+
3057
+ // src/ShellContextProvider.tsx
3058
+ var import_react21 = require("react");
3059
+ var import_jsx_runtime26 = require("react/jsx-runtime");
3060
+ var defaultConfig = {};
3061
+ var ShellContext = (0, import_react21.createContext)(defaultConfig);
3062
+ var Provider2 = ({
3063
+ children,
3064
+ context,
3065
+ inheritedContext
3066
+ }) => {
3067
+ const mergedContext = {
3068
+ ...inheritedContext,
3069
+ ...context
3070
+ };
3071
+ return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ShellContext.Provider, { value: mergedContext, children });
3072
+ };
3073
+ var ShellContextProvider = ({
3074
+ children,
3075
+ value
3076
+ }) => {
3077
+ return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ShellContext.Consumer, { children: (context) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Provider2, { context: value, inheritedContext: context, children }) });
3078
+ };
3079
+ var useShellContext = () => {
3080
+ return (0, import_react21.useContext)(ShellContext);
3081
+ };
3082
+
3083
+ // src/theme-switch/ThemeSwitch.tsx
3084
+ var import_clsx12 = __toESM(require("clsx"));
3085
+ var import_core7 = require("@salt-ds/core");
3086
+ var import_react22 = require("react");
3087
+ var import_jsx_runtime27 = require("react/jsx-runtime");
3088
+ var classBase13 = "vuuThemeSwitch";
3089
+ var ThemeSwitch = ({
3090
+ className: classNameProp,
3091
+ defaultMode: defaultModeProp,
3092
+ mode: modeProp,
3093
+ onChange,
3094
+ ...htmlAttributes
3095
+ }) => {
3096
+ const [mode, setMode] = (0, import_core7.useControlled)({
3097
+ controlled: modeProp,
3098
+ default: defaultModeProp != null ? defaultModeProp : "light",
3099
+ name: "ThemeSwitch",
3100
+ state: "mode"
3101
+ });
3102
+ const handleChangeSecondary = (0, import_react22.useCallback)(
3103
+ (evt) => {
3104
+ const { value } = evt.target;
3105
+ setMode(value);
3106
+ onChange(value);
3107
+ },
3108
+ [onChange, setMode]
3109
+ );
3110
+ const className = (0, import_clsx12.default)(classBase13, classNameProp);
3111
+ return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
3112
+ import_core7.ToggleButtonGroup,
3113
+ {
3114
+ className,
3115
+ ...htmlAttributes,
3116
+ onChange: handleChangeSecondary,
3117
+ value: mode,
3118
+ children: [
3119
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core7.ToggleButton, { "aria-label": "alert", "data-icon": "light", value: "light" }),
3120
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_core7.ToggleButton, { "aria-label": "home", "data-icon": "dark", value: "dark" })
3121
+ ]
3122
+ }
3123
+ );
3124
+ };
3
3125
  //# sourceMappingURL=index.js.map