@covalent/components 11.19.3 → 11.19.4

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.
@@ -55,6 +55,7 @@ export declare class CovalentNotebookCell extends LitElement {
55
55
  private _isMenuOpen;
56
56
  private _menuMaxHeight;
57
57
  private _menuPosition;
58
+ private _editorStale;
58
59
  editorOptions: {
59
60
  minimap: {
60
61
  enabled: boolean;
package/notebook-cell.js CHANGED
@@ -1,16 +1,16 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./query-assigned-elements-8EurZY45.js"),r=require("./property-DYTC_2-m.js"),v=require("./state-C3HoXfoa.js"),p=require("./class-map-DTzB8z-1.js"),g=require("./code-editor-N1lvcT2t.js");require("./code-snippet.js");require("./icon-button.js");require("./typography.js");const b=":host{--mdc-icon-button-size: 2rem;font-family:var(--mdc-typography-body1-font-family);width:100%}cv-code-snippet{background-color:var(--cv-theme-surface);border-radius:0;box-sizing:border-box}cv-code-snippet::part(code){font-size:var(--mdc-typography-body2-font-size);line-height:var(--mdc-typography-body2-line-height);padding:0;white-space:pre-wrap}cv-code-editor{margin-top:-1px}.selectionIndicator{background-color:var(--cv-theme-primary);border-radius:2px;height:100%;visibility:hidden}.selectionIndicatorWrapper{min-width:8px}.selectionIndicatorWrapper:hover .selectionIndicator{visibility:visible}.status{padding:0 1px;position:relative}.loading{top:2.5px}.timesExecuted{--cv-icon-button-cursor: grab;align-items:center;box-sizing:border-box;color:var(--cv-theme-on-surface-38);display:flex;font-family:var(--cv-typography-subtitle2-font-family);font-size:var(--cv-typography-subtitle2-font-size);gap:.5rem;height:56px;line-height:var(--cv-typography-headline6-line-height)}.timesExecuted .executionCount{padding-right:1rem;overflow:hidden;text-align:right;text-overflow:ellipsis;-webkit-user-select:none;user-select:none;white-space:nowrap;width:52px}.timesExecuted .dragHandle{color:var(--cv-theme-on-surface-variant);cursor:grab;padding-left:.5rem;transition:visibility .3s ease;visibility:hidden}.timesExecuted .dragHandle:active{--cv-icon-button-cursor: grabbing}.timesExecutedWrapper{cursor:grab}.timesExecutedWrapper:active{cursor:grabbing}.timesExecutedWrapper:hover .dragHandle{visibility:visible}.cell{box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;position:relative;transition:background-color .2s ease;-webkit-user-select:auto;user-select:auto}.cell.focused .selectionIndicator,.cell.selected .selectionIndicator{visibility:visible}.cell:hover{background-color:var(--cv-theme-secondary-4)}.cell:hover .selectionIndicator{visibility:visible;background-color:var(--cv-theme-on-secondary-container-38)}.cell:active{background-color:var(--cv-theme-secondary-12)}.cell:active .selectionIndicator{visibility:visible;background-color:var(--cv-theme-on-secondary-container-74)}.cellWrapper{display:flex;flex-direction:column;width:100%}.cellOutputWrapper{display:flex;flex-direction:column;max-width:calc(100% - 130px);flex:1}.contextMenu{background-color:var(--cv-theme-surface-canvas);border-radius:8px;box-shadow:0 8px 12px 6px #00000026,0 4px 4px #0000004d;display:flex;flex-direction:column;position:fixed;visibility:hidden;z-index:1000}.contextMenuContent{border-radius:4px;flex-grow:1;max-height:100%;overflow:auto}.contextMenu.open{visibility:visible}.editorContainer{box-sizing:border-box;background-color:var(--cv-theme-surface);border:1px solid var(--cv-theme-outline-variant);border-radius:var(--cv-editor-border-radius, 4px);min-height:56px;overflow:hidden;padding:1rem}.errors,.output{max-width:100%;width:100%}";var x=Object.defineProperty,m=Object.getOwnPropertyDescriptor,s=(c,e,t,i)=>{for(var o=i>1?void 0:i?m(e,t):e,l=c.length-1,a;l>=0;l--)(a=c[l])&&(o=(i?a(e,t,o):a(o))||o);return i&&o&&x(e,t,o),o};exports.CovalentNotebookCell=class extends n.s{constructor(){super(),this.code="",this.language="",this.loading=!1,this.selected=!1,this.timesExecuted=0,this.hideEditor=!1,this.hideCount=!1,this.editorTheme="",this._editorFocused=!1,this._isMenuOpen=!1,this._menuMaxHeight="auto",this._menuPosition={top:0,left:0},this.editorOptions={minimap:{enabled:!1},wordWrap:"on",fontSize:"14px",glyphMargin:!1,folding:!1,lineHeight:20,lineNumbers:"off",lineDecorationsWidth:0,lineNumbersMinChars:0,renderIndentGuides:!1,renderLineHighlight:"none",overviewRulerLanes:0,hideCursorInOverviewRuler:!0,scrollbar:{alwaysConsumeMouseWheel:!1,vertical:"hidden"}},this.closeContextMenu=this.closeContextMenu.bind(this),this.showContextMenu=this.showContextMenu.bind(this)}closeContextMenu(){this._isMenuOpen=!1}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.closeContextMenu)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.closeContextMenu)}handleCodeChange(e){this.code=e.detail.code}setEditorFocus(e,t){e.stopImmediatePropagation(),this._editorFocused=t,this.requestUpdate()}setEditorInstance(e){e.stopImmediatePropagation(),this._editor=e.detail.editor,this._editor.onKeyDown(t=>{t.shiftKey&&t.keyCode===g.KeyCode.Enter&&t.preventDefault()})}showContextMenu(e){var u;e.preventDefault();const t=document.querySelectorAll("cv-notebook-cell");t==null||t.forEach(h=>{h.closeContextMenu()});const i=(u=this.shadowRoot)==null?void 0:u.querySelector(".contextMenu"),o=i==null?void 0:i.offsetHeight,a=window.innerHeight-e.clientY,d=e.clientY;a>=o?(this._menuPosition={top:e.clientY,left:e.clientX},this._menuMaxHeight=`${a}px`):d>=o?(this._menuPosition={top:e.clientY-o,left:e.clientX},this._menuMaxHeight=`${o}px`):(this._menuPosition={top:e.clientY-d,left:e.clientX},this._menuMaxHeight=`${d}px`),this._isMenuOpen=!0}updated(e){var i,o;const t=(i=this.shadowRoot)==null?void 0:i.querySelector("cv-code-editor");if(e.has("code")||e.has("language"))if(t)t.code=this.code,t.language=this.language;else{const l=(o=this.shadowRoot)==null?void 0:o.querySelector("cv-code-snippet");l&&!this.selected&&l.highlight()}super.updated(e)}getEditorBgColor(){var i;const e=(i=this.shadowRoot)==null?void 0:i.querySelector(".editorContainer");return e?window.getComputedStyle(e).getPropertyValue("background-color"):""}renderEditor(){const e=this.selected?n.x`<cv-code-editor
2
- @code-change="${this.handleCodeChange}"
3
- @editor-ready="${this.setEditorInstance}"
4
- @editor-focus="${t=>this.setEditorFocus(t,!0)}"
5
- @editor-blur="${t=>this.setEditorFocus(t,!1)}"
6
- .code="${this.code}"
7
- .language="${this.language}"
8
- .options="${this.editorOptions}"
9
- .theme="${this.editorTheme}"
10
- disableScroll
11
- ></cv-code-editor>`:n.x`<cv-code-snippet hideHeader .language="${this.language}"
12
- >${this.code}</cv-code-snippet
13
- >`;return n.x`${this.hideEditor?"":n.x`<div class="editorContainer">${e}</div>`}`}renderOutput(){const e=n.x` <div class="errors"><slot name="error"></slot></div>
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./query-assigned-elements-8EurZY45.js"),r=require("./property-DYTC_2-m.js"),h=require("./state-C3HoXfoa.js"),p=require("./class-map-DTzB8z-1.js"),g=require("./code-editor-N1lvcT2t.js");require("./code-snippet.js");require("./icon-button.js");require("./typography.js");const b=":host{--mdc-icon-button-size: 2rem;font-family:var(--mdc-typography-body1-font-family);width:100%}cv-code-snippet{background-color:var(--cv-theme-surface);border-radius:0;box-sizing:border-box}cv-code-snippet::part(code){font-size:var(--mdc-typography-body2-font-size);line-height:var(--mdc-typography-body2-line-height);padding:0;white-space:pre-wrap}cv-code-editor{margin-top:-1px}.selectionIndicator{background-color:var(--cv-theme-primary);border-radius:2px;height:100%;visibility:hidden}.selectionIndicatorWrapper{min-width:8px}.selectionIndicatorWrapper:hover .selectionIndicator{visibility:visible}.status{padding:0 1px;position:relative}.loading{top:2.5px}.timesExecuted{--cv-icon-button-cursor: grab;align-items:center;box-sizing:border-box;color:var(--cv-theme-on-surface-38);display:flex;font-family:var(--cv-typography-subtitle2-font-family);font-size:var(--cv-typography-subtitle2-font-size);gap:.5rem;height:56px;line-height:var(--cv-typography-headline6-line-height)}.timesExecuted .executionCount{padding-right:1rem;overflow:hidden;text-align:right;text-overflow:ellipsis;-webkit-user-select:none;user-select:none;white-space:nowrap;width:52px}.timesExecuted .dragHandle{color:var(--cv-theme-on-surface-variant);cursor:grab;padding-left:.5rem;transition:visibility .3s ease;visibility:hidden}.timesExecuted .dragHandle:active{--cv-icon-button-cursor: grabbing}.timesExecutedWrapper{cursor:grab}.timesExecutedWrapper:active{cursor:grabbing}.timesExecutedWrapper:hover .dragHandle{visibility:visible}.cell{box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;position:relative;transition:background-color .2s ease;-webkit-user-select:auto;user-select:auto}.cell.focused .selectionIndicator,.cell.selected .selectionIndicator{visibility:visible}.cell:hover{background-color:var(--cv-theme-secondary-4)}.cell:hover .selectionIndicator{visibility:visible;background-color:var(--cv-theme-on-secondary-container-38)}.cell:active{background-color:var(--cv-theme-secondary-12)}.cell:active .selectionIndicator{visibility:visible;background-color:var(--cv-theme-on-secondary-container-74)}.cellWrapper{display:flex;flex-direction:column;width:100%}.cellOutputWrapper{display:flex;flex-direction:column;max-width:calc(100% - 130px);flex:1}.contextMenu{background-color:var(--cv-theme-surface-canvas);border-radius:8px;box-shadow:0 8px 12px 6px #00000026,0 4px 4px #0000004d;display:flex;flex-direction:column;position:fixed;visibility:hidden;z-index:1000}.contextMenuContent{border-radius:4px;flex-grow:1;max-height:100%;overflow:auto}.contextMenu.open{visibility:visible}.editorContainer{box-sizing:border-box;background-color:var(--cv-theme-surface);border:1px solid var(--cv-theme-outline-variant);border-radius:var(--cv-editor-border-radius, 4px);min-height:56px;overflow:hidden;padding:1rem}.errors,.output{max-width:100%;width:100%}";var x=Object.defineProperty,f=Object.getOwnPropertyDescriptor,s=(d,e,t,i)=>{for(var o=i>1?void 0:i?f(e,t):e,l=d.length-1,a;l>=0;l--)(a=d[l])&&(o=(i?a(e,t,o):a(o))||o);return i&&o&&x(e,t,o),o};exports.CovalentNotebookCell=class extends n.s{constructor(){super(),this.code="",this.language="",this.loading=!1,this.selected=!1,this.timesExecuted=0,this.hideEditor=!1,this.hideCount=!1,this.editorTheme="",this._editorFocused=!1,this._isMenuOpen=!1,this._menuMaxHeight="auto",this._menuPosition={top:0,left:0},this._editorStale=!1,this.editorOptions={minimap:{enabled:!1},wordWrap:"on",fontSize:"14px",glyphMargin:!1,folding:!1,lineHeight:20,lineNumbers:"off",lineDecorationsWidth:0,lineNumbersMinChars:0,renderIndentGuides:!1,renderLineHighlight:"none",overviewRulerLanes:0,hideCursorInOverviewRuler:!0,scrollbar:{alwaysConsumeMouseWheel:!1,vertical:"hidden"}},this.closeContextMenu=this.closeContextMenu.bind(this),this.showContextMenu=this.showContextMenu.bind(this)}closeContextMenu(){this._isMenuOpen=!1}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.closeContextMenu),this._editorStale&&this.updateComplete.then(()=>{this._editorStale=!1})}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.closeContextMenu),this.selected&&(this._editorStale=!0)}handleCodeChange(e){this.code=e.detail.code}setEditorFocus(e,t){e.stopImmediatePropagation(),this._editorFocused=t,this.requestUpdate()}setEditorInstance(e){e.stopImmediatePropagation(),this._editor=e.detail.editor,this._editor.onKeyDown(t=>{t.shiftKey&&t.keyCode===g.KeyCode.Enter&&t.preventDefault()})}showContextMenu(e){var u;e.preventDefault();const t=document.querySelectorAll("cv-notebook-cell");t==null||t.forEach(v=>{v.closeContextMenu()});const i=(u=this.shadowRoot)==null?void 0:u.querySelector(".contextMenu"),o=i==null?void 0:i.offsetHeight,a=window.innerHeight-e.clientY,c=e.clientY;a>=o?(this._menuPosition={top:e.clientY,left:e.clientX},this._menuMaxHeight=`${a}px`):c>=o?(this._menuPosition={top:e.clientY-o,left:e.clientX},this._menuMaxHeight=`${o}px`):(this._menuPosition={top:e.clientY-c,left:e.clientX},this._menuMaxHeight=`${c}px`),this._isMenuOpen=!0}updated(e){var i,o;const t=(i=this.shadowRoot)==null?void 0:i.querySelector("cv-code-editor");if(e.has("code")||e.has("language"))if(t)t.code=this.code,t.language=this.language;else{const l=(o=this.shadowRoot)==null?void 0:o.querySelector("cv-code-snippet");l&&!this.selected&&l.highlight()}super.updated(e)}getEditorBgColor(){var i;const e=(i=this.shadowRoot)==null?void 0:i.querySelector(".editorContainer");return e?window.getComputedStyle(e).getPropertyValue("background-color"):""}renderEditor(){const e=this.selected&&!this._editorStale?n.x`<cv-code-editor
2
+ @code-change="${this.handleCodeChange}"
3
+ @editor-ready="${this.setEditorInstance}"
4
+ @editor-focus="${t=>this.setEditorFocus(t,!0)}"
5
+ @editor-blur="${t=>this.setEditorFocus(t,!1)}"
6
+ .code="${this.code}"
7
+ .language="${this.language}"
8
+ .options="${this.editorOptions}"
9
+ .theme="${this.editorTheme}"
10
+ disableScroll
11
+ ></cv-code-editor>`:n.x`<cv-code-snippet hideHeader .language="${this.language}"
12
+ >${this.code}</cv-code-snippet
13
+ >`;return n.x`${this.hideEditor?"":n.x`<div class="editorContainer">${e}</div>`}`}renderOutput(){const e=n.x` <div class="errors"><slot name="error"></slot></div>
14
14
  <div class="output">
15
15
  <slot name="output"></slot>
16
16
  <slot name="input"></slot>
@@ -45,4 +45,4 @@
45
45
  </div>
46
46
  `}};exports.CovalentNotebookCell.styles=[n.i`
47
47
  ${n.r(b)}
48
- `];s([r.n({type:Number})],exports.CovalentNotebookCell.prototype,"index",2);s([r.n({type:String})],exports.CovalentNotebookCell.prototype,"code",2);s([r.n({type:String})],exports.CovalentNotebookCell.prototype,"language",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"loading",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"selected",2);s([r.n({type:Number})],exports.CovalentNotebookCell.prototype,"timesExecuted",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"hideEditor",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"hideCount",2);s([r.n({type:String})],exports.CovalentNotebookCell.prototype,"editorTheme",2);s([v.t()],exports.CovalentNotebookCell.prototype,"_isMenuOpen",2);exports.CovalentNotebookCell=s([n.e("cv-notebook-cell")],exports.CovalentNotebookCell);const f=exports.CovalentNotebookCell;exports.default=f;
48
+ `];s([r.n({type:Number})],exports.CovalentNotebookCell.prototype,"index",2);s([r.n({type:String})],exports.CovalentNotebookCell.prototype,"code",2);s([r.n({type:String})],exports.CovalentNotebookCell.prototype,"language",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"loading",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"selected",2);s([r.n({type:Number})],exports.CovalentNotebookCell.prototype,"timesExecuted",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"hideEditor",2);s([r.n({type:Boolean,reflect:!0})],exports.CovalentNotebookCell.prototype,"hideCount",2);s([r.n({type:String})],exports.CovalentNotebookCell.prototype,"editorTheme",2);s([h.t()],exports.CovalentNotebookCell.prototype,"_isMenuOpen",2);s([h.t()],exports.CovalentNotebookCell.prototype,"_editorStale",2);exports.CovalentNotebookCell=s([n.e("cv-notebook-cell")],exports.CovalentNotebookCell);const m=exports.CovalentNotebookCell;exports.default=m;
package/notebook-cell.mjs CHANGED
@@ -1,20 +1,20 @@
1
- import { r as v, i as g, s as m, x as c, e as x } from "./query-assigned-elements-D930kELM.mjs";
2
- import { n as d } from "./property-DJzm_oB9.mjs";
3
- import { t as f } from "./state-B_tK3mBm.mjs";
1
+ import { r as g, i as m, s as x, x as d, e as f } from "./query-assigned-elements-D930kELM.mjs";
2
+ import { n as a } from "./property-DJzm_oB9.mjs";
3
+ import { t as h } from "./state-B_tK3mBm.mjs";
4
4
  import { o as p } from "./class-map-DPUylGZM.mjs";
5
5
  import { K as b } from "./code-editor-CcOx9dQY.mjs";
6
6
  import "./code-snippet.mjs";
7
7
  import "./icon-button.mjs";
8
8
  import "./typography.mjs";
9
9
  const y = ":host{--mdc-icon-button-size: 2rem;font-family:var(--mdc-typography-body1-font-family);width:100%}cv-code-snippet{background-color:var(--cv-theme-surface);border-radius:0;box-sizing:border-box}cv-code-snippet::part(code){font-size:var(--mdc-typography-body2-font-size);line-height:var(--mdc-typography-body2-line-height);padding:0;white-space:pre-wrap}cv-code-editor{margin-top:-1px}.selectionIndicator{background-color:var(--cv-theme-primary);border-radius:2px;height:100%;visibility:hidden}.selectionIndicatorWrapper{min-width:8px}.selectionIndicatorWrapper:hover .selectionIndicator{visibility:visible}.status{padding:0 1px;position:relative}.loading{top:2.5px}.timesExecuted{--cv-icon-button-cursor: grab;align-items:center;box-sizing:border-box;color:var(--cv-theme-on-surface-38);display:flex;font-family:var(--cv-typography-subtitle2-font-family);font-size:var(--cv-typography-subtitle2-font-size);gap:.5rem;height:56px;line-height:var(--cv-typography-headline6-line-height)}.timesExecuted .executionCount{padding-right:1rem;overflow:hidden;text-align:right;text-overflow:ellipsis;-webkit-user-select:none;user-select:none;white-space:nowrap;width:52px}.timesExecuted .dragHandle{color:var(--cv-theme-on-surface-variant);cursor:grab;padding-left:.5rem;transition:visibility .3s ease;visibility:hidden}.timesExecuted .dragHandle:active{--cv-icon-button-cursor: grabbing}.timesExecutedWrapper{cursor:grab}.timesExecutedWrapper:active{cursor:grabbing}.timesExecutedWrapper:hover .dragHandle{visibility:visible}.cell{box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;position:relative;transition:background-color .2s ease;-webkit-user-select:auto;user-select:auto}.cell.focused .selectionIndicator,.cell.selected .selectionIndicator{visibility:visible}.cell:hover{background-color:var(--cv-theme-secondary-4)}.cell:hover .selectionIndicator{visibility:visible;background-color:var(--cv-theme-on-secondary-container-38)}.cell:active{background-color:var(--cv-theme-secondary-12)}.cell:active .selectionIndicator{visibility:visible;background-color:var(--cv-theme-on-secondary-container-74)}.cellWrapper{display:flex;flex-direction:column;width:100%}.cellOutputWrapper{display:flex;flex-direction:column;max-width:calc(100% - 130px);flex:1}.contextMenu{background-color:var(--cv-theme-surface-canvas);border-radius:8px;box-shadow:0 8px 12px 6px #00000026,0 4px 4px #0000004d;display:flex;flex-direction:column;position:fixed;visibility:hidden;z-index:1000}.contextMenuContent{border-radius:4px;flex-grow:1;max-height:100%;overflow:auto}.contextMenu.open{visibility:visible}.editorContainer{box-sizing:border-box;background-color:var(--cv-theme-surface);border:1px solid var(--cv-theme-outline-variant);border-radius:var(--cv-editor-border-radius, 4px);min-height:56px;overflow:hidden;padding:1rem}.errors,.output{max-width:100%;width:100%}";
10
- var C = Object.defineProperty, w = Object.getOwnPropertyDescriptor, n = (e, t, o, r) => {
11
- for (var s = r > 1 ? void 0 : r ? w(t, o) : t, l = e.length - 1, a; l >= 0; l--)
12
- (a = e[l]) && (s = (r ? a(t, o, s) : a(s)) || s);
13
- return r && s && C(t, o, s), s;
10
+ var C = Object.defineProperty, w = Object.getOwnPropertyDescriptor, r = (e, t, o, s) => {
11
+ for (var n = s > 1 ? void 0 : s ? w(t, o) : t, c = e.length - 1, l; c >= 0; c--)
12
+ (l = e[c]) && (n = (s ? l(t, o, n) : l(n)) || n);
13
+ return s && n && C(t, o, n), n;
14
14
  };
15
- let i = class extends m {
15
+ let i = class extends x {
16
16
  constructor() {
17
- super(), this.code = "", this.language = "", this.loading = !1, this.selected = !1, this.timesExecuted = 0, this.hideEditor = !1, this.hideCount = !1, this.editorTheme = "", this._editorFocused = !1, this._isMenuOpen = !1, this._menuMaxHeight = "auto", this._menuPosition = { top: 0, left: 0 }, this.editorOptions = {
17
+ super(), this.code = "", this.language = "", this.loading = !1, this.selected = !1, this.timesExecuted = 0, this.hideEditor = !1, this.hideCount = !1, this.editorTheme = "", this._editorFocused = !1, this._isMenuOpen = !1, this._menuMaxHeight = "auto", this._menuPosition = { top: 0, left: 0 }, this._editorStale = !1, this.editorOptions = {
18
18
  minimap: { enabled: !1 },
19
19
  // Disable minimap to save space
20
20
  wordWrap: "on",
@@ -40,10 +40,12 @@ let i = class extends m {
40
40
  this._isMenuOpen = !1;
41
41
  }
42
42
  connectedCallback() {
43
- super.connectedCallback(), document.addEventListener("click", this.closeContextMenu);
43
+ super.connectedCallback(), document.addEventListener("click", this.closeContextMenu), this._editorStale && this.updateComplete.then(() => {
44
+ this._editorStale = !1;
45
+ });
44
46
  }
45
47
  disconnectedCallback() {
46
- super.disconnectedCallback(), document.removeEventListener("click", this.closeContextMenu);
48
+ super.disconnectedCallback(), document.removeEventListener("click", this.closeContextMenu), this.selected && (this._editorStale = !0);
47
49
  }
48
50
  handleCodeChange(e) {
49
51
  this.code = e.detail.code;
@@ -60,23 +62,23 @@ let i = class extends m {
60
62
  var u;
61
63
  e.preventDefault();
62
64
  const t = document.querySelectorAll("cv-notebook-cell");
63
- t == null || t.forEach((h) => {
64
- h.closeContextMenu();
65
+ t == null || t.forEach((v) => {
66
+ v.closeContextMenu();
65
67
  });
66
68
  const o = (u = this.shadowRoot) == null ? void 0 : u.querySelector(
67
69
  ".contextMenu"
68
- ), r = o == null ? void 0 : o.offsetHeight, l = window.innerHeight - e.clientY, a = e.clientY;
69
- l >= r ? (this._menuPosition = { top: e.clientY, left: e.clientX }, this._menuMaxHeight = `${l}px`) : a >= r ? (this._menuPosition = { top: e.clientY - r, left: e.clientX }, this._menuMaxHeight = `${r}px`) : (this._menuPosition = { top: e.clientY - a, left: e.clientX }, this._menuMaxHeight = `${a}px`), this._isMenuOpen = !0;
70
+ ), s = o == null ? void 0 : o.offsetHeight, c = window.innerHeight - e.clientY, l = e.clientY;
71
+ c >= s ? (this._menuPosition = { top: e.clientY, left: e.clientX }, this._menuMaxHeight = `${c}px`) : l >= s ? (this._menuPosition = { top: e.clientY - s, left: e.clientX }, this._menuMaxHeight = `${s}px`) : (this._menuPosition = { top: e.clientY - l, left: e.clientX }, this._menuMaxHeight = `${l}px`), this._isMenuOpen = !0;
70
72
  }
71
73
  updated(e) {
72
- var o, r;
74
+ var o, s;
73
75
  const t = (o = this.shadowRoot) == null ? void 0 : o.querySelector("cv-code-editor");
74
76
  if (e.has("code") || e.has("language"))
75
77
  if (t)
76
78
  t.code = this.code, t.language = this.language;
77
79
  else {
78
- const s = (r = this.shadowRoot) == null ? void 0 : r.querySelector("cv-code-snippet");
79
- s && !this.selected && s.highlight();
80
+ const n = (s = this.shadowRoot) == null ? void 0 : s.querySelector("cv-code-snippet");
81
+ n && !this.selected && n.highlight();
80
82
  }
81
83
  super.updated(e);
82
84
  }
@@ -86,37 +88,37 @@ let i = class extends m {
86
88
  return e ? window.getComputedStyle(e).getPropertyValue("background-color") : "";
87
89
  }
88
90
  renderEditor() {
89
- const e = this.selected ? c`<cv-code-editor
90
- @code-change="${this.handleCodeChange}"
91
- @editor-ready="${this.setEditorInstance}"
92
- @editor-focus="${(t) => this.setEditorFocus(t, !0)}"
93
- @editor-blur="${(t) => this.setEditorFocus(t, !1)}"
94
- .code="${this.code}"
95
- .language="${this.language}"
96
- .options="${this.editorOptions}"
97
- .theme="${this.editorTheme}"
98
- disableScroll
99
- ></cv-code-editor>` : c`<cv-code-snippet hideHeader .language="${this.language}"
100
- >${this.code}</cv-code-snippet
101
- >`;
102
- return c`${this.hideEditor ? "" : c`<div class="editorContainer">${e}</div>`}`;
91
+ const e = this.selected && !this._editorStale ? d`<cv-code-editor
92
+ @code-change="${this.handleCodeChange}"
93
+ @editor-ready="${this.setEditorInstance}"
94
+ @editor-focus="${(t) => this.setEditorFocus(t, !0)}"
95
+ @editor-blur="${(t) => this.setEditorFocus(t, !1)}"
96
+ .code="${this.code}"
97
+ .language="${this.language}"
98
+ .options="${this.editorOptions}"
99
+ .theme="${this.editorTheme}"
100
+ disableScroll
101
+ ></cv-code-editor>` : d`<cv-code-snippet hideHeader .language="${this.language}"
102
+ >${this.code}</cv-code-snippet
103
+ >`;
104
+ return d`${this.hideEditor ? "" : d`<div class="editorContainer">${e}</div>`}`;
103
105
  }
104
106
  renderOutput() {
105
- const e = c` <div class="errors"><slot name="error"></slot></div>
107
+ const e = d` <div class="errors"><slot name="error"></slot></div>
106
108
  <div class="output">
107
109
  <slot name="output"></slot>
108
110
  <slot name="input"></slot>
109
111
  </div>`;
110
- return c`${e}`;
112
+ return d`${e}`;
111
113
  }
112
114
  renderExecutionCount() {
113
115
  if (this.hideCount)
114
- return c`&nbsp;`;
116
+ return d`&nbsp;`;
115
117
  const e = {
116
118
  status: !0,
117
119
  loading: this.loading
118
120
  };
119
- return c`[<span class="${p(e)}"
121
+ return d`[<span class="${p(e)}"
120
122
  >${this.loading ? "*" : this.timesExecuted || " "}</span
121
123
  >] :`;
122
124
  }
@@ -126,7 +128,7 @@ let i = class extends m {
126
128
  selected: this.selected,
127
129
  focused: this._editorFocused
128
130
  };
129
- return c`
131
+ return d`
130
132
  <div class="${p(e)}" @contextmenu=${this.showContextMenu}>
131
133
  <div class="selectionIndicatorWrapper">
132
134
  <div class="selectionIndicator"></div>
@@ -157,45 +159,48 @@ let i = class extends m {
157
159
  }
158
160
  };
159
161
  i.styles = [
160
- g`
161
- ${v(y)}
162
+ m`
163
+ ${g(y)}
162
164
  `
163
165
  ];
164
- n([
165
- d({ type: Number })
166
+ r([
167
+ a({ type: Number })
166
168
  ], i.prototype, "index", 2);
167
- n([
168
- d({ type: String })
169
+ r([
170
+ a({ type: String })
169
171
  ], i.prototype, "code", 2);
170
- n([
171
- d({ type: String })
172
+ r([
173
+ a({ type: String })
172
174
  ], i.prototype, "language", 2);
173
- n([
174
- d({ type: Boolean, reflect: !0 })
175
+ r([
176
+ a({ type: Boolean, reflect: !0 })
175
177
  ], i.prototype, "loading", 2);
176
- n([
177
- d({ type: Boolean, reflect: !0 })
178
+ r([
179
+ a({ type: Boolean, reflect: !0 })
178
180
  ], i.prototype, "selected", 2);
179
- n([
180
- d({ type: Number })
181
+ r([
182
+ a({ type: Number })
181
183
  ], i.prototype, "timesExecuted", 2);
182
- n([
183
- d({ type: Boolean, reflect: !0 })
184
+ r([
185
+ a({ type: Boolean, reflect: !0 })
184
186
  ], i.prototype, "hideEditor", 2);
185
- n([
186
- d({ type: Boolean, reflect: !0 })
187
+ r([
188
+ a({ type: Boolean, reflect: !0 })
187
189
  ], i.prototype, "hideCount", 2);
188
- n([
189
- d({ type: String })
190
+ r([
191
+ a({ type: String })
190
192
  ], i.prototype, "editorTheme", 2);
191
- n([
192
- f()
193
+ r([
194
+ h()
193
195
  ], i.prototype, "_isMenuOpen", 2);
194
- i = n([
195
- x("cv-notebook-cell")
196
+ r([
197
+ h()
198
+ ], i.prototype, "_editorStale", 2);
199
+ i = r([
200
+ f("cv-notebook-cell")
196
201
  ], i);
197
- const W = i;
202
+ const O = i;
198
203
  export {
199
204
  i as CovalentNotebookCell,
200
- W as default
205
+ O as default
201
206
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@covalent/components",
3
- "version": "11.19.3",
3
+ "version": "11.19.4",
4
4
  "description": "a catalog of material components for covalent",
5
5
  "main": "./index.js",
6
6
  "module": "./index.mjs",