UNPKG

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) • 9.61 kB
import{eventToCombo as e}from"./openalgo-charts.mjs";import{chromeIconSvg as t}from"./openalgo-charts.draw.mjs";import{a as o,h as n,widgetText as a,eventKeyCombo as c}from"./openalgo-charts.widget.mjs";const s=/(^|\+)(Dead|Process|Compose)$/;function d(e,t){const o=Intl.ListFormat;if(void 0===o)return e.join(", ");try{return new o(t,{type:"conjunction"}).format(e)}catch{return e.join(", ")}}function r(r,l){const h=r.document,p=r.keymap;o(h,i);const m=n(h,"div","oac-keys-dialog",{"aria-label":a(r,"Keyboard shortcuts")}),g=n(h,"div","oac-dialog__head"),u=n(h,"div","oac-dialog__title");u.textContent=a(r,"Keyboard shortcuts");const y=n(h,"button","oac-btn oac-btn--icon",{type:"button","aria-label":a(r,"Close")});y.innerHTML=t("close"),g.appendChild(u),g.appendChild(y);const b=n(h,"div","oac-dialog__body"),f=n(h,"div","oac-keys"),k=n(h,"div","oac-keys__note");b.appendChild(f),b.appendChild(k),m.appendChild(g),m.appendChild(b);const v=n(h,"div","oac-dialog__foot"),_=n(h,"button","oac-btn oac-keys__reset-all",{type:"button"}),w=n(h,"div","oac-keys__status",{role:"status","aria-live":"polite"}),x=n(h,"button","oac-btn",{type:"button"}),C=n(h,"button","oac-btn oac-btn--primary",{type:"button"}),L=n(h,"button","oac-btn",{type:"button"});if(x.textContent=a(r,"Cancel"),C.textContent=a(r,"Reset all"),L.textContent=a(r,"Close"),l){for(const e of[_,w,x,C,L])v.appendChild(e);m.appendChild(v)}let K=null,E=!1,P=!1,M=null,j="";const A=new Map,T=new Map,$=e=>(null!==e.command?A.get(e.command):void 0)??e.label,z=e=>{j=e,w.textContent=e},O=()=>{M?.(),M=null,"capture"===K?.kind&&(K=null)},R=(e,t)=>a(r,`schema.shortcuts.${e}.${t.defaultCombo??t.combo}`,{},t.label),N=e=>{f.textContent="",T.clear(),A.clear();let t=0;const o=p.describe();for(const e of o)for(const t of e.rows)void 0!==t.command&&A.set(t.command,R(e.group,t));for(const e of o){const o=n(h,"div","oac-keys__group"),c=n(h,"div","oac-head");c.textContent=a(r,`schema.shortcuts.group.${e.group}`,{},"Widget"===e.group?"General":e.group),o.appendChild(c);for(const c of e.rows){const s=R(e.group,c),d=n(h,"div","oac-keys__row"),i=n(h,"span");i.textContent=s;const m=n(h,"kbd"),g="capture"===K?.kind&&K.command===c.command;m.textContent=g?a(r,"Press keys"):""!==c.display?c.display:a(r,"Not set"),m.classList.toggle("is-empty",!g&&""===c.display),d.appendChild(i),d.appendChild(m),void 0!==c.shadowedBy&&(d.classList.add("is-shadowed"),d.title=a(r,"Claimed by {name}",{name:c.shadowedBy}),t++);const u=c.command;if(void 0!==u&&(d.dataset.command=u,d.classList.toggle("is-changed",!0===c.changed)),d.classList.toggle("is-listening",g),o.appendChild(d),!l)continue;const y=n(h,"div","oac-keys__acts");if(d.appendChild(y),void 0===u||!0!==c.rebindable)continue;const b=n(h,"button","oac-btn oac-keys__change",{type:"button"});b.textContent=a(r,g?"Cancel":"Change"),b.setAttribute("aria-label",a(r,g?"Cancel changing {name}":"Change {name}",{name:s})),b.addEventListener("click",()=>{g?(O(),z(""),N({command:u,part:"change"})):W(u)});const f=n(h,"button","oac-btn oac-keys__reset",{type:"button"});f.textContent=a(r,"Reset");const k=void 0===c.defaultCombo||""===c.defaultCombo?a(r,"Not set"):p.format(c.defaultCombo);f.setAttribute("aria-label",a(r,"Reset {name} to {chord}",{name:s,chord:k})),f.disabled=!0!==c.changed,f.classList.toggle("is-idle",!0!==c.changed),f.addEventListener("click",()=>{F(u,null,k,!0,!1)}),y.appendChild(b),y.appendChild(f),T.set(u,{change:b,reset:f}),"conflict"===K?.kind&&K.command===u&&o.appendChild(S(K))}f.appendChild(o)}if(k.textContent=0===t?"":a(r,1===t?"{count} chart shortcut struck through: another shortcut uses the same chord here and takes precedence.":"{count} chart shortcuts struck through: another shortcut uses the same chord here and takes precedence.",{count:t}),k.hidden=0===t,B(),void 0!==e){const t=T.get(e.command),o=t?.[e.part];(void 0===o||o.disabled?t?.change:o)?.focus()}},S=e=>{const t=n(h,"div","oac-keys__conflict",{role:"group"}),o=n(h,"span");o.textContent=a(r,"{chord} is used by {names}.",{chord:e.chord,names:d(e.holders.map($),r.locale)});const c=n(h,"button","oac-btn",{type:"button"});c.textContent=a(r,"Cancel");const s=n(h,"button","oac-btn oac-btn--primary",{type:"button"});s.textContent=a(r,"Replace"),t.setAttribute("aria-label",o.textContent),c.addEventListener("click",()=>{K=null,z(""),N({command:e.command,part:"change"})}),s.addEventListener("click",()=>{F(e.command,e.combo,e.chord,e.reset,!0)}),t.appendChild(o),t.appendChild(c),t.appendChild(s);const i=T.get(e.command);return void 0!==i&&(i.replace=s),t},B=()=>{const e=Object.keys(p.overrides()).length>0;_.textContent=a(r,"Reset all"),_.disabled=!e,_.hidden=E,x.hidden=!E,C.hidden=!E,L.hidden=E,w.textContent=E?a(r,"Put every shortcut back to its default?"):j},F=(e,t,o,n,c)=>{let s;P=!0;try{s=n?p.reset(e,{replace:c}):p.rebind(e,t,{replace:c})}finally{P=!1}const i=d(s.conflicts.map($),r.locale);if(s.ok){O(),K=null;const t=A.get(e)??e;z(a(r,n?"{name} is back to {chord}.":"{name} is now {chord}.",{name:t,chord:o})+(s.conflicts.length>0?" "+a(r,"Taken from {names}.",{names:i}):"")),N({command:e,part:"change"})}else if("taken"===s.reason&&s.conflicts.every(e=>e.rebindable))O(),K={kind:"conflict",command:e,combo:t??"",chord:o,holders:s.conflicts,reset:n},z(""),N({command:e,part:"replace"});else if("taken"===s.reason){const e=s.conflicts.filter(e=>!e.rebindable).map($);z(a(r,"{chord} belongs to {names}, which cannot change. Press another.",{chord:o,names:d(e,r.locale)}))}else"reserved"===s.reason?z(a(r,"{chord} belongs to the browser. Press another.",{chord:o})):z(a(r,"That key cannot be used here. Press another."))},W=t=>{O(),E=!1,K={kind:"capture",command:t},M=p.capture((t=>o=>{const n=!0===o.ctrlKey||!0===o.metaKey||!0===o.altKey||!0===o.shiftKey;if("Tab"===o.key)return O(),z(""),N({command:t,part:"change"}),!1;if("Escape"===o.key&&!n)return O(),z(a(r,"Nothing changed.")),void N({command:t,part:"change"});const d=c(o);if(""===d)return;if(s.test(d))return void z(a(r,"That key cannot be used here. Press another."));const i=p.format(d),l=p.isMac?"Cmd":"Ctrl",h=p.isMac?"Opt":"Alt";if(/^(Shift\+)?[a-z0-9]$/.test(d))return void z(a(r,"{chord} types into the chart. Add {mod} or {alt}.",{chord:i,mod:l,alt:h}));if(/^(Shift\+)?Space$/.test(d))return void z(a(r,"{chord} presses the focused control. Add {mod} or {alt}.",{chord:i,mod:l,alt:h}));const m=t.startsWith("chart:"),g=o.ctrlKey||o.metaKey,u=m?e({code:o.code,key:o.key,altKey:o.altKey,shiftKey:o.shiftKey,ctrlKey:!p.isMac&&g,metaKey:p.isMac&&g},p.isMac):"";m&&""===u?z(a(r,"That key cannot be used here. Press another.")):F(t,m?u:d,i,!1,!1)})(t)),z(a(r,"Press the new shortcut for {name}. Esc cancels.",{name:A.get(t)??t})),N({command:t,part:"change"})};_.addEventListener("click",()=>{O(),K=null,E=!0,N(),x.focus()}),x.addEventListener("click",()=>{E=!1,B(),_.focus()}),C.addEventListener("click",()=>{E=!1,P=!0;try{p.resetAll()}finally{P=!1}z(a(r,"Every shortcut is back to its default.")),N(),L.focus()});const D=p.onChange(()=>{P||N((()=>{const e=h.activeElement;for(const[t,o]of T)for(const n of["change","reset","replace"])if(void 0!==o[n]&&o[n]===e)return{command:t,part:n}})())});N();const G=r.openOverlay(m,{placement:"center",dismissOnOutside:!0,initialFocus:l?m:void 0,onClose:()=>{O(),D()}});return y.addEventListener("click",G),L.addEventListener("click",G),G}const i="\n.oac-widget .oac-keys-dialog { width: 880px; }\n.oac-widget .oac-keys { columns: 2; column-gap: 28px; min-width: 0; }\n.oac-widget .oac-keys__group { margin-bottom: 0; padding-bottom: 8px; }\n.oac-widget .oac-keys__row { min-height: 30px; padding: 2px 0; }\n.oac-widget .oac-keys__row > kbd { min-width: 44px; text-align: center; }\n.oac-widget .oac-keys__row.is-changed > kbd { color: var(--oac-acc-2); border-color: var(--oac-on-bd); background: var(--oac-on-bg); }\n.oac-widget .oac-keys__row > kbd.is-empty { border-style: dashed; font-family: inherit; }\n.oac-widget .oac-keys__row:not(.is-changed) > kbd.is-empty { background: transparent; color: var(--oac-faint); }\n.oac-widget .oac-keys__acts { flex: none; display: flex; align-items: center; gap: 2px; min-width: 118px; }\n.oac-widget .oac-keys__row.is-listening > kbd { color: var(--oac-acc-2); border-color: var(--oac-acc); border-style: solid; font-family: inherit; }\n.oac-widget .oac-keys__change, .oac-widget .oac-keys__reset { flex: none; height: 24px; padding: 0 8px; font-size: 11.5px; color: var(--oac-mut); }\n.oac-widget .oac-keys__change:hover, .oac-widget .oac-keys__reset:hover { color: var(--oac-tx); }\n.oac-widget .oac-keys__row.is-listening .oac-keys__change { color: var(--oac-acc-2); border-color: var(--oac-on-bd); }\n.oac-widget .oac-keys__reset.is-idle { visibility: hidden; }\n.oac-widget .oac-keys__conflict { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 2px 0 6px; padding: 6px 8px;\n border: 1px solid var(--oac-bd-soft); border-left: 3px solid var(--oac-amber); border-radius: 6px; background: var(--oac-elev); break-inside: avoid; }\n.oac-widget .oac-keys__conflict > span { flex: 1 1 180px; min-width: 0; color: var(--oac-tx); font-size: 12px; overflow-wrap: anywhere; }\n.oac-widget .oac-keys__conflict > .oac-btn { height: 24px; font-size: 11.5px; }\n.oac-widget .oac-keys__status { flex: 1 1 200px; min-width: 0; color: var(--oac-mut); font-size: 12px; overflow-wrap: anywhere; }\n.oac-widget .oac-keys__note:empty { display: none; }\n@container oac-widget (max-width: 920px) {\n .oac-widget .oac-keys { columns: 1; }\n}\n";export{r as mountShortcutsPanel}; //# sourceMappingURL=openalgo-charts.widget.keymap-editor-Uozy6qFE.mjs.map