openalgo-charts
Version:
From-scratch, dependency-free canvas charting engine for OpenAlgo: professional-grade interactive rendering, advanced on-chart trading, and a one-call widget tier that adds the toolbar, drawing rail, dialogs and shortcuts.
3 lines (2 loc) • 5.93 kB
JavaScript
import{layoutIconPath as t,chromeIconSvg as e}from"./openalgo-charts.draw.mjs";import{createLayoutsController as a,s as n,e as o,b as r,d as s,f as i,widgetText as c,widgetLayoutTarget as l,h as d,CHART_GRID_LAYOUTS as u,j as p,a as h,i as m,l as g,k as b,r as f,g as y}from"./openalgo-charts.widget.mjs";import{isReplaying as x}from"./openalgo-charts.mjs";function k(t){const{grid:e}=t,d=!1===t.layouts?null:t.layouts??null;if(!1===t.layouts||null===d&&void 0===t.workspaces)return null;const u=(e,a,n={})=>c(t.context(),`schema.ui.layouts.${e}`,n,a),p=a=>{e.isDestroyed||t.context().status(a,"error")};let h=null,m=[];const g=()=>{for(const t of m.splice(0))t();const t=h;null!==t&&(m=e.cells().map(e=>l(e.widget).subscribe(t)))},b={capture(){const t=e.getWorkspace();return{...t,activePaneId:t.panes[0].id,panes:t.panes.map(t=>({...t,chart:i(t.chart)}))}},apply:t=>e.applyWorkspace(t),subscribe(t){h=t,g();const a=[e.on("layout",({reason:e})=>{"preset"!==e&&"workspace"!==e||g(),t()}),e.on("links",t)];return()=>{h=null,g();for(const t of a)t()}},suspended:()=>e.cells().some(t=>x(t.widget.chart))},f=null===d?a(t.workspaces,b):null,y=d??f,k={handle:null,waiting:null};let _=!1;return null!==f&&(n(f,u,p),t.ready.then(()=>_?null:f.reload()).then(async e=>{if(_||null==e||null===e.activeWorkspaceId||t.opened())return;const a=await f.open(e.activeWorkspaceId);a.applied||_||p(u("notReopened","The last layout could not open here: {error}",{error:a.reason??""}))}).catch(e=>{_||p(u("notLoaded","Saved layouts could not be read: {error}",{error:o(t.context(),e)}))})),{controller:y,open(a){_||s(t.context(),y,a,k,()=>!_&&!e.isDestroyed)},status:()=>r(t.context(),y.state()),flush(){_||f?.flush()},destroy(){_||(_=!0,f?.destroy())}}}function _(e){const a=u[e];return p(t(a.rows,a.columns,a.slots))}const v=(t,e)=>{const a=d(t,"span","oac-glyph oac-glyph--chrome",{"aria-hidden":"true"});return a.innerHTML=e,a};function w(t,a){const n=t.doc,o=(t=>t.text)(t);h(n,L);const r=(t,e)=>d(n,"button",`oac-btn ${t}`,{type:"button","aria-label":e}),s=()=>{const t=d(n,"span","oac-chev",{"aria-hidden":"true"});return t.innerHTML=e("chevron-down"),t},i=r("oac-grid__layout",c(o,"Arrange charts"));i.setAttribute("aria-haspopup","menu");const l=v(n,e("layout")),u=d(n,"span","oac-grid__bar-text");i.append(l,u,s()),t.tips.attach(i,()=>{const e=t.layout();return{title:m(e)?c(o,"Arrange charts: {name}",{name:g(o,e)}):c(o,"Arrange charts"),side:"bottom"}}),i.addEventListener("click",()=>t.openMenu("layouts",i)),i.hidden=0===t.layouts.length;const p=r("oac-btn--icon oac-grid__max",c(o,"Maximize the chart")),x=v(n,e("maximize"));p.appendChild(x);t.tips.attach(p,()=>({title:c(o,t.maximized()?"Restore the grid":"Maximize the chart"),sub:t.maximizeBlocked()??void 0,side:"bottom"})),p.addEventListener("click",()=>{null===t.maximizeBlocked()&&t.toggleMaximize()});const k=r("oac-grid__link",c(o,"Link"));k.setAttribute("aria-haspopup","menu");const w=d(n,"span","oac-grid__bar-text");w.textContent=c(o,"Link");const A=d(n,"span","oac-grid__bar-mark");k.append(v(n,e("link")),w,A,s()),t.tips.attach(k,()=>{const e=t.links.current();return{title:c(o,"Link: {name}",{name:null===e?c(o,"Not linked"):e.name}),side:"bottom"}}),k.addEventListener("click",()=>t.openMenu("link",k));const z=r("oac-btn--icon oac-grid__capture",c(o,"Capture every chart"));z.setAttribute("aria-haspopup","menu"),z.appendChild(v(n,e("capture-grid"))),t.tips.attach(z,()=>({title:c(o,"Capture every chart"),sub:t.capture.blocked()??void 0,side:"bottom"})),z.addEventListener("click",()=>t.openMenu("capture",z));const M=()=>d(n,"span","oac-sep",{role:"separator"});a.append(i,p,M(),k,M(),z);let C=null,E=null;if(void 0!==t.saved){const{controller:s}=t.saved,i=c(o,"schema.ui.layouts.title",{},"Layouts"),l=()=>{const t=s.state();return t.catalog?.workspaces.find(e=>e.id===t.layoutId)?.name??null},u=C=r("oac-grid__saved",i);u.setAttribute("aria-haspopup","dialog");const p=d(n,"span","oac-grid__bar-text");u.append(v(n,e("folder")),p),t.tips.attach(u,()=>{const e=l(),a=null===e?i:`${i}: ${e}`,n=t.saved?.status();return{title:a,label:b(s.state())?`${a}, ${n??""}`:void 0,sub:n,side:"bottom"}});const h=()=>{p.textContent=l()??i,u.dataset.attention=String(b(s.state())),t.tips.refreshLabel(u)};E=s.subscribe(h),h(),u.addEventListener("click",()=>t.saved?.open(u)),a.append(d(n,"span","oac-grid__spacer"),u)}const $=[i,p,k,z,C].filter(t=>null!==t&&!t.hidden);a.addEventListener("keydown",t=>{const e=$.indexOf(n.activeElement),a=f(t.key,e,$.length,["ArrowLeft","ArrowRight"]);a<0||(t.preventDefault(),t.stopPropagation(),$[a].focus())});const T=()=>{const a=t.layout(),r=m(a);l.innerHTML=r?_(a):e("layout"),u.textContent=r?g(o,a):"",u.hidden=!r;const s=t.maximized();x.innerHTML=e(s?"restore":"maximize");const c=t.maximizeBlocked();p.classList.toggle("is-off",null!==c),p.setAttribute("aria-disabled",String(null!==c));const d=t.links.current();A.replaceChildren(y(n,d)),z.classList.toggle("is-off",null!==t.capture.blocked());for(const e of[i,p,k,z])t.tips.refreshLabel(e);const h=t.tips.target();h!==i&&h!==p&&h!==k&&h!==z||t.tips.show(h)};return T(),{el:a,refresh:T,destroy:()=>{E?.(),a.textContent=""}}}const L="\n.oac-grid__bar .oac-grid__bar-text { max-width: 22ch; overflow: hidden; text-overflow: ellipsis; }\n.oac-grid__bar-mark { display: inline-flex; }\n.oac-grid__spacer { flex: 1 1 auto; }\n.oac-grid__saved { min-width: 0; }\n.oac-grid__saved[data-attention=\"true\"]::after { content: ''; width: 6px; height: 6px; flex: none; border-radius: 50%; background: var(--oac-amber); }\n/* A phone's bar keeps the glyph and the mark; the held layout's name stays in the tip and the accessible name. */\n@container oac-grid-bar (max-width: 520px) { .oac-grid__saved > .oac-grid__bar-text { display: none; } }\n";export{k as attachGridSaved,v as chrome,_ as layoutTileSvg,w as mountGridBar};
//# sourceMappingURL=openalgo-charts.widget.grid-bar-Cm_CyA2j.mjs.map