"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[2859],{13251:(p,f,s)=>{s.d(f,{EmbeddedDashboard:()=>m});var r=s(74848),c=s(32196),l=s(96540),u=s(76885),_=s(17388),D=s(42418),g=s(62930),P=s(40845),v=s(31678),M=s(72255);function m(a){const e=(0,M.sP)(),{dashboard:t,loadError:n}=e.useState();return(0,l.useEffect)(()=>(e.loadDashboard({uid:a.uid,route:v.DashboardRoutes.Embedded}),()=>{e.clearState()}),[e,a.uid]),n?(0,r.jsx)(D.F,{severity:"error",title:"Failed to load dashboard",children:n}):t?(0,r.jsx)(b,{model:t,...a}):(0,r.jsx)(g.y,{})}function b({model:a,initialState:e,onStateChange:t}){const[n,E]=(0,l.useState)(!1),{controls:o,body:d}=a.useState(),i=(0,P.of)(h);return(0,l.useEffect)(()=>{if(E(!0),e){const x=new URLSearchParams(e);_.Go.syncStateFromSearchParams(a,x)}return a.activate()},[a]),O(t,a),n?(0,r.jsxs)("div",{className:(0,c.cx)(i.canvas,o&&i.canvasWithControls),children:[o&&(0,r.jsx)("div",{className:i.controlsWrapper,children:(0,r.jsx)(o.Component,{model:o})}),(0,r.jsx)("div",{className:i.body,children:(0,r.jsx)(d.Component,{model:d})})]}):null}function O(a,e){(0,l.useEffect)(()=>{if(!a)return;let t="";const n=e.subscribeToEvent(_.bZ,E=>{if(E.payload.changedObject.urlSync){const o=_.Go.getUrlState(e),d=u.kM.renderUrl("",o);t!==d&&(t=d,a(d))}});return()=>n.unsubscribe()},[e,a])}function h(a){return{canvas:(0,c.css)({label:"canvas-content",display:"grid",gridTemplateAreas:`
        "panels"`,gridTemplateColumns:"1fr",gridTemplateRows:"1fr",flexBasis:"100%",flexGrow:1}),canvasWithControls:(0,c.css)({gridTemplateAreas:`
        "controls"
        "panels"`,gridTemplateRows:"auto 1fr"}),body:(0,c.css)({label:"body",flexGrow:1,display:"flex",gap:"8px",gridArea:"panels",marginBottom:a.spacing(2)}),controlsWrapper:(0,c.css)({display:"flex",flexDirection:"column",flexGrow:0,gridArea:"controls",padding:a.spacing(2,0,2,2)})}}}}]);

//# sourceMappingURL=EmbeddedDashboard.4a44fd26dfc27d9d6c06.js.map