@omegagrid/tabs 0.10.0 → 0.10.2

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.
Files changed (41) hide show
  1. package/package.json +2 -2
  2. package/dist/components/index.d.ts +0 -4
  3. package/dist/components/index.d.ts.map +0 -1
  4. package/dist/components/index.js +0 -4
  5. package/dist/components/index.js.map +0 -1
  6. package/dist/components/tabContainer.d.ts +0 -59
  7. package/dist/components/tabContainer.d.ts.map +0 -1
  8. package/dist/components/tabContainer.js +0 -292
  9. package/dist/components/tabContainer.js.map +0 -1
  10. package/dist/components/tabContainer.style.d.ts +0 -2
  11. package/dist/components/tabContainer.style.d.ts.map +0 -1
  12. package/dist/components/tabContainer.style.js +0 -30
  13. package/dist/components/tabContainer.style.js.map +0 -1
  14. package/dist/components/tabSplitContainer.d.ts +0 -43
  15. package/dist/components/tabSplitContainer.d.ts.map +0 -1
  16. package/dist/components/tabSplitContainer.js +0 -291
  17. package/dist/components/tabSplitContainer.js.map +0 -1
  18. package/dist/components/tabs.d.ts +0 -66
  19. package/dist/components/tabs.d.ts.map +0 -1
  20. package/dist/components/tabs.js +0 -360
  21. package/dist/components/tabs.js.map +0 -1
  22. package/dist/components/tabs.style.d.ts +0 -2
  23. package/dist/components/tabs.style.d.ts.map +0 -1
  24. package/dist/components/tabs.style.js +0 -191
  25. package/dist/components/tabs.style.js.map +0 -1
  26. package/dist/constants.d.ts +0 -49
  27. package/dist/constants.d.ts.map +0 -1
  28. package/dist/constants.js +0 -7
  29. package/dist/constants.js.map +0 -1
  30. package/dist/index.d.ts +0 -4
  31. package/dist/index.d.ts.map +0 -1
  32. package/dist/index.js +0 -4
  33. package/dist/index.js.map +0 -1
  34. package/dist/model/index.d.ts +0 -26
  35. package/dist/model/index.d.ts.map +0 -1
  36. package/dist/model/index.js +0 -122
  37. package/dist/model/index.js.map +0 -1
  38. package/dist/types.d.ts +0 -14
  39. package/dist/types.d.ts.map +0 -1
  40. package/dist/types.js +0 -2
  41. package/dist/types.js.map +0 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@omegagrid/tabs",
3
- "version": "0.10.0",
3
+ "version": "0.10.2",
4
4
  "license": "UNLICENSED",
5
5
  "description": "Universal tabbed layout component",
6
6
  "main": "./dist/index.js",
@@ -27,7 +27,7 @@
27
27
  "_prepublish": "yarn test && yarn lint"
28
28
  },
29
29
  "dependencies": {
30
- "@omegagrid/core": "^0.10.0",
30
+ "@omegagrid/core": "^0.10.2",
31
31
  "lit": "^3.1.1",
32
32
  "lit-html": "^3.1.1",
33
33
  "ts-debounce": "^4.0.0"
@@ -1,4 +0,0 @@
1
- export * from './tabs';
2
- export * from './tabContainer';
3
- export * from './tabSplitContainer';
4
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC"}
@@ -1,4 +0,0 @@
1
- export * from './tabs';
2
- export * from './tabContainer';
3
- export * from './tabSplitContainer';
4
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC","sourcesContent":["export * from './tabs';\nexport * from './tabContainer';\nexport * from './tabSplitContainer';"]}
@@ -1,59 +0,0 @@
1
- import { LitElement } from "lit";
2
- import { ContainerTabItem } from '../types';
3
- import { ComponentFactory, actions, Layout, ComponentId, DirectionalPosition, VerticalPosition } from "@omegagrid/core";
4
- import { TabEvent, Tabs, TabSize } from "./tabs";
5
- export type TabsActionArgs = {
6
- index: number;
7
- };
8
- export declare class TabContainer extends LitElement implements Layout {
9
- #private;
10
- static dropPosition: DirectionalPosition;
11
- static dragParent: TabContainer;
12
- static dropTarget: TabContainer;
13
- static styles: import("lit").CSSResult[];
14
- set inactive(value: boolean);
15
- get inactive(): boolean;
16
- topLevelComponent: HTMLElement;
17
- items: ContainerTabItem[];
18
- closable: boolean;
19
- createComponent: ComponentFactory;
20
- tabs: Tabs;
21
- actions: actions.Action[];
22
- addButton: boolean;
23
- scrollableTabs: boolean;
24
- draggableTabs: boolean;
25
- tabSize: TabSize;
26
- private _selectedIndex;
27
- get selectedIndex(): number;
28
- set selectedIndex(value: number);
29
- get selectedId(): ComponentId;
30
- tabPosition: VerticalPosition;
31
- cacheComponents: boolean;
32
- container: HTMLDivElement;
33
- overlay: HTMLDivElement;
34
- readonly components: Map<ComponentId, HTMLElement>;
35
- private currentComponent;
36
- get component(): HTMLElement;
37
- _firstLoad: boolean;
38
- _itemMap: Map<ComponentId, ContainerTabItem>;
39
- layout(): void;
40
- updateTabs(): void;
41
- getComponent(componentId: ComponentId): Promise<HTMLElement>;
42
- loadComponent(id: ComponentId): Promise<void>;
43
- refresh(): void;
44
- _onSelect: () => void;
45
- _onRemove: (e: TabEvent) => void;
46
- open(item: ContainerTabItem, dispatchEvent?: boolean): void;
47
- willUpdate(props: Map<PropertyKey, unknown>): void;
48
- firstUpdated(): void;
49
- positionOverlay(pos: DirectionalPosition): HTMLElement;
50
- hideOverlay: () => void;
51
- calculateOverlayPosition(x: number, y: number): DirectionalPosition;
52
- _onDragover: (e: DragEvent) => void;
53
- _onDrop: () => void;
54
- _onDragStart: (_e: DragEvent) => void;
55
- _onDragStop: () => void;
56
- _onTabDrop: (e: DragEvent) => void;
57
- render: () => import("lit-html").TemplateResult<1>;
58
- }
59
- //# sourceMappingURL=tabContainer.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"tabContainer.d.ts","sourceRoot":"","sources":["../../src/components/tabContainer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAO,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAC7H,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEjD,MAAM,MAAM,cAAc,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAA;CACb,CAAA;AAED,qBACa,YAAa,SAAQ,UAAW,YAAW,MAAM;;IAE7D,MAAM,CAAC,YAAY,EAAE,mBAAmB,CAAC;IACzC,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC;IAChC,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC;IAEhC,MAAM,CAAC,MAAM,4BAAW;IAGxB,IACI,QAAQ,CAAC,KAAK,EAAE,OAAO,EAG1B;IACD,IAAI,QAAQ,IAJQ,OAAO,CAIa;IAGxC,iBAAiB,EAAE,WAAW,CAAC;IAG/B,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAG1B,QAAQ,UAAS;IAGjB,eAAe,EAAE,gBAAgB,CAAC;IAGlC,IAAI,EAAE,IAAI,CAAC;IAGX,OAAO,EAAE,OAAO,CAAC,MAAM,EAAE,CAAC;IAG1B,SAAS,UAAS;IAGlB,cAAc,UAAS;IAGvB,aAAa,UAAS;IAGtB,OAAO,EAAE,OAAO,CAAU;IAE1B,OAAO,CAAC,cAAc,CAAM;IAC5B,IACI,aAAa,IAAI,MAAM,CAA+B;IAC1D,IAAI,aAAa,CAAC,KAAK,EAAE,MAAM,EAK9B;IAED,IAAI,UAAU,IAAI,WAAW,CAE5B;IAGD,WAAW,EAAE,gBAAgB,CAAS;IAGtC,eAAe,UAAS;IAGxB,SAAS,EAAE,cAAc,CAAC;IAG1B,OAAO,EAAE,cAAc,CAAC;IAGxB,SAAgB,UAAU,gCAAuC;IACjE,OAAO,CAAC,gBAAgB,CAAc;IACtC,IAAI,SAAS,gBAAmC;IAEhD,UAAU,UAAQ;IAClB,QAAQ,qCAA0C;IAElD,MAAM;IAIN,UAAU;IAEJ,YAAY,CAAC,WAAW,EAAE,WAAW;IAarC,aAAa,CAAC,EAAE,EAAE,WAAW;IAqCnC,OAAO;IAMP,SAAS,aAAwB;IAEjC,SAAS,GAAI,GAAG,QAAQ,UAKtB;IAEF,IAAI,CAAC,IAAI,EAAE,gBAAgB,EAAE,aAAa,UAAO;IAYjD,UAAU,CAAC,KAAK,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;IAY3C,YAAY;IAIZ,eAAe,CAAC,GAAG,EAAE,mBAAmB;IAkBxC,WAAW,aAGV;IAED,wBAAwB,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM;IAQ7C,WAAW,GAAI,GAAG,SAAS,UAO1B;IAED,OAAO,aAIN;IAED,YAAY,GAAI,IAAI,SAAS,UAE5B;IAED,WAAW,aAEV;IAED,UAAU,GAAI,GAAG,SAAS,UAGzB;IAED,MAAM,6CAqCJ;CAEF"}
@@ -1,292 +0,0 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
8
- if (kind === "m") throw new TypeError("Private method is not writable");
9
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
10
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
11
- return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
12
- };
13
- var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
14
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
15
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
16
- return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
17
- };
18
- var _TabContainer_inactive;
19
- var TabContainer_1;
20
- import { LitElement, html } from "lit";
21
- import { customElement, property, query } from "lit/decorators.js";
22
- import { style } from './tabContainer.style';
23
- import { dom } from "@omegagrid/core";
24
- import { Tabs } from "./tabs";
25
- let TabContainer = TabContainer_1 = class TabContainer extends LitElement {
26
- constructor() {
27
- super(...arguments);
28
- _TabContainer_inactive.set(this, false);
29
- this.closable = false;
30
- this.addButton = false;
31
- this.scrollableTabs = false;
32
- this.draggableTabs = false;
33
- this.tabSize = 'auto';
34
- this._selectedIndex = -1;
35
- this.tabPosition = 'top';
36
- this.cacheComponents = false;
37
- this.components = new Map();
38
- this._firstLoad = true;
39
- this._itemMap = new Map;
40
- this._onSelect = () => this.refresh();
41
- this._onRemove = (e) => {
42
- this.components.delete(e.tab.id);
43
- if (this.tabs.items?.length === 0) {
44
- dom.showElement(this.tabs, 'flex');
45
- }
46
- };
47
- this.hideOverlay = () => {
48
- dom.hideElement(this.overlay);
49
- this.tabs.hideOverlay();
50
- };
51
- this._onDragover = (e) => {
52
- if (!TabContainer_1.dragParent || !Tabs.dragParent)
53
- return;
54
- if (TabContainer_1.dragParent.topLevelComponent != this.topLevelComponent && Tabs.dragParent.topLevelComponent != this.topLevelComponent)
55
- return;
56
- e.preventDefault();
57
- e.stopPropagation();
58
- e.dataTransfer.dropEffect = 'move';
59
- this.positionOverlay(this.calculateOverlayPosition(e.offsetX, e.offsetY));
60
- };
61
- this._onDrop = () => {
62
- if (TabContainer_1.dragParent?.topLevelComponent != this.topLevelComponent && Tabs.dragParent?.topLevelComponent != this.topLevelComponent)
63
- return;
64
- TabContainer_1.dropTarget = this;
65
- this.hideOverlay();
66
- };
67
- this._onDragStart = (_e) => {
68
- TabContainer_1.dragParent = this;
69
- };
70
- this._onDragStop = () => {
71
- TabContainer_1.dragParent = null;
72
- };
73
- this._onTabDrop = (e) => {
74
- TabContainer_1.dragParent = null;
75
- e.stopPropagation();
76
- };
77
- this.render = () => {
78
- const tabs = html `
79
- <og-tabs
80
- class="${this.inactive ? 'inactive' : ''}"
81
- style="${this.items?.length ? '' : 'display: none;'}"
82
- ?scrollable="${this.scrollableTabs}"
83
- ?draggable="${this.draggableTabs}"
84
- .topLevelComponent="${this.topLevelComponent}"
85
- .items="${this.items}"
86
- .actions="${this.actions}"
87
- .selectedIndex="${this.selectedIndex}"
88
- .position="${this.tabPosition}"
89
- .tabSize="${this.tabSize}"
90
- ?closable="${this.closable}"
91
- ?addButton="${this.addButton}"
92
- @tab.select="${this._onSelect}"
93
- @tab.remove="${this._onRemove}"
94
- @dragstart="${this._onDragStart}"
95
- @dragstop="${this._onDragStop}"
96
- @drop="${this._onTabDrop}">
97
- </og-tabs>
98
- `;
99
- const container = html `
100
- <div
101
- id="container"
102
- @drop="${this._onDrop}"
103
- @dragover="${this._onDragover}"
104
- @dragleave="${() => this.hideOverlay()}">
105
- </div>
106
- `;
107
- return html `
108
- ${this.tabPosition == 'top' ? tabs : container}
109
- ${this.tabPosition == 'bottom' ? tabs : container}
110
- <div id="overlay" style="display: none"></div>
111
- `;
112
- };
113
- }
114
- set inactive(value) {
115
- __classPrivateFieldSet(this, _TabContainer_inactive, value, "f");
116
- if (this.tabs)
117
- this.tabs.classList.toggle('inactive', value);
118
- }
119
- get inactive() { return __classPrivateFieldGet(this, _TabContainer_inactive, "f"); }
120
- get selectedIndex() { return this._selectedIndex; }
121
- set selectedIndex(value) {
122
- if (value != this._selectedIndex) {
123
- this.requestUpdate('selectedIndex', this._selectedIndex);
124
- this._selectedIndex = value;
125
- }
126
- }
127
- get selectedId() {
128
- return this.tabs?.selectedItem?.id;
129
- }
130
- get component() { return this.currentComponent; }
131
- layout() {
132
- if (this.currentComponent?.layout)
133
- this.currentComponent.layout();
134
- }
135
- updateTabs() { this.tabs.requestUpdate(); }
136
- async getComponent(componentId) {
137
- if (!this.createComponent)
138
- return null;
139
- const cacheComponent = this.cacheComponents || this._itemMap?.get(componentId)?.preventDisconnect;
140
- if (!cacheComponent || !this.components.has(componentId)) {
141
- const component = await this.createComponent(componentId);
142
- component.dataset.preventDisconnect = this._itemMap?.get(componentId)?.preventDisconnect ? '1' : '0';
143
- if (!cacheComponent)
144
- return component;
145
- this.components.set(componentId, component);
146
- }
147
- return this.components.get(componentId);
148
- }
149
- async loadComponent(id) {
150
- if (id != null) {
151
- const prevComponent = this.currentComponent;
152
- this.currentComponent = await this.getComponent(id);
153
- if (prevComponent) {
154
- const preventDisconnect = prevComponent?.dataset?.preventDisconnect === '1';
155
- if (preventDisconnect) {
156
- dom.hideElement(prevComponent);
157
- }
158
- else {
159
- prevComponent.remove();
160
- }
161
- }
162
- if (this.currentComponent) {
163
- if (this.currentComponent.parentElement !== this.container) {
164
- dom.appendElement(this.container, this.currentComponent);
165
- }
166
- dom.showElement(this.currentComponent);
167
- }
168
- if (this._firstLoad) {
169
- this._firstLoad = false;
170
- this.dispatchEvent(new Event('load'));
171
- }
172
- }
173
- else {
174
- dom.empty(this.container);
175
- this.currentComponent = null;
176
- }
177
- if (this._firstLoad) {
178
- this._firstLoad = false;
179
- this.layout();
180
- }
181
- }
182
- refresh() {
183
- const id = this.tabs?.selectedItem?.id;
184
- this._selectedIndex = this.tabs?.selectedIndex ?? -1;
185
- if (id != null)
186
- this.loadComponent(this.tabs.selectedItem?.id);
187
- }
188
- open(item, dispatchEvent = true) {
189
- const tabIndex = this.tabs.getIndexById(item.id);
190
- if (tabIndex > -1) {
191
- this.tabs.selectTab(tabIndex, dispatchEvent);
192
- }
193
- else {
194
- this.tabs.addTab(item);
195
- this.tabs.selectTabById(item.id, dispatchEvent);
196
- }
197
- dom.showElement(this.tabs, 'flex');
198
- }
199
- willUpdate(props) {
200
- if (!this.topLevelComponent)
201
- this.topLevelComponent = this;
202
- this.selectedIndex = this.items?.length > 0
203
- ? Math.max(0, Math.min(this.selectedIndex ?? -1, this.items.length - 1))
204
- : -1;
205
- if (props.has('items')) {
206
- this._firstLoad = true;
207
- this._itemMap = new Map(this.items.map(item => [item.id, item]));
208
- }
209
- }
210
- firstUpdated() {
211
- if (this.selectedIndex > -1)
212
- this.open(this.items[this.selectedIndex]);
213
- }
214
- positionOverlay(pos) {
215
- TabContainer_1.dropPosition = pos;
216
- this.tabs.hideOverlay();
217
- if (pos == null) {
218
- this.tabs.positionOverlay(this.tabs.empty);
219
- return dom.hideElement(this.overlay);
220
- }
221
- dom.showElement(this.overlay);
222
- dom.setPosition(this.overlay, {
223
- t: (pos == 'bottom' ? this.container.clientHeight / 2 : 0) + this.container.offsetTop,
224
- l: pos == 'right' ? this.container.clientWidth / 2 : 0,
225
- b: pos == 'top' ? this.container.clientHeight / 2 : 0,
226
- r: pos == 'left' ? this.container.clientWidth / 2 : 0,
227
- });
228
- }
229
- calculateOverlayPosition(x, y) {
230
- const [w, h] = [this.container.clientWidth, this.container.clientHeight];
231
- const margin = 0.3;
232
- if (x > w * margin && x < w - (w * margin) && y > h * margin && y < h - (h * margin))
233
- return null;
234
- const [q1, q2] = [w / h > x / y, w / h > x / (h - y)];
235
- return (q1 ? (q2 ? 'left' : 'bottom') : (q2 ? 'top' : 'right'));
236
- }
237
- };
238
- _TabContainer_inactive = new WeakMap();
239
- TabContainer.styles = [style];
240
- __decorate([
241
- property({ type: Boolean, noAccessor: true })
242
- ], TabContainer.prototype, "inactive", null);
243
- __decorate([
244
- property({ type: Object })
245
- ], TabContainer.prototype, "topLevelComponent", void 0);
246
- __decorate([
247
- property({ type: Array })
248
- ], TabContainer.prototype, "items", void 0);
249
- __decorate([
250
- property({ type: Boolean })
251
- ], TabContainer.prototype, "closable", void 0);
252
- __decorate([
253
- property({ type: Object })
254
- ], TabContainer.prototype, "createComponent", void 0);
255
- __decorate([
256
- query('og-tabs')
257
- ], TabContainer.prototype, "tabs", void 0);
258
- __decorate([
259
- property({ type: Array })
260
- ], TabContainer.prototype, "actions", void 0);
261
- __decorate([
262
- property({ type: Boolean })
263
- ], TabContainer.prototype, "addButton", void 0);
264
- __decorate([
265
- property({ type: Boolean })
266
- ], TabContainer.prototype, "scrollableTabs", void 0);
267
- __decorate([
268
- property({ type: Boolean })
269
- ], TabContainer.prototype, "draggableTabs", void 0);
270
- __decorate([
271
- property({ type: String })
272
- ], TabContainer.prototype, "tabSize", void 0);
273
- __decorate([
274
- property({ type: Number, reflect: true, noAccessor: true })
275
- ], TabContainer.prototype, "selectedIndex", null);
276
- __decorate([
277
- property({ type: String, reflect: true })
278
- ], TabContainer.prototype, "tabPosition", void 0);
279
- __decorate([
280
- property({ type: Boolean })
281
- ], TabContainer.prototype, "cacheComponents", void 0);
282
- __decorate([
283
- query('#container')
284
- ], TabContainer.prototype, "container", void 0);
285
- __decorate([
286
- query('#overlay')
287
- ], TabContainer.prototype, "overlay", void 0);
288
- TabContainer = TabContainer_1 = __decorate([
289
- customElement('og-tabcontainer')
290
- ], TabContainer);
291
- export { TabContainer };
292
- //# sourceMappingURL=tabContainer.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"tabContainer.js","sourceRoot":"","sources":["../../src/components/tabContainer.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,OAAO,EAAE,GAAG,EAAyF,MAAM,iBAAiB,CAAC;AAC7H,OAAO,EAAY,IAAI,EAAW,MAAM,QAAQ,CAAC;AAO1C,IAAM,YAAY,oBAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAQN,iCAAY,KAAK,EAAC;QAelB,aAAQ,GAAG,KAAK,CAAC;QAYjB,cAAS,GAAG,KAAK,CAAC;QAGlB,mBAAc,GAAG,KAAK,CAAC;QAGvB,kBAAa,GAAG,KAAK,CAAC;QAGtB,YAAO,GAAY,MAAM,CAAC;QAElB,mBAAc,GAAG,CAAC,CAAC,CAAC;QAe5B,gBAAW,GAAqB,KAAK,CAAC;QAGtC,oBAAe,GAAG,KAAK,CAAC;QASR,eAAU,GAAG,IAAI,GAAG,EAA4B,CAAC;QAIjE,eAAU,GAAG,IAAI,CAAC;QAClB,aAAQ,GAAG,IAAI,GAAkC,CAAC;QAgElD,cAAS,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;QAEjC,cAAS,GAAG,CAAC,CAAW,EAAE,EAAE;YAC3B,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;YACjC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM,KAAK,CAAC,EAAE,CAAC;gBACnC,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;YACpC,CAAC;QACF,CAAC,CAAC;QAgDF,gBAAW,GAAG,GAAG,EAAE;YAClB,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YAC9B,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;QACzB,CAAC,CAAA;QAUD,gBAAW,GAAG,CAAC,CAAY,EAAE,EAAE;YAC9B,IAAI,CAAC,cAAY,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,UAAU;gBAAE,OAAO;YACzD,IAAI,cAAY,CAAC,UAAU,CAAC,iBAAiB,IAAI,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,UAAU,CAAC,iBAAiB,IAAI,IAAI,CAAC,iBAAiB;gBAAE,OAAO;YAC/I,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,CAAC,CAAC,YAAY,CAAC,UAAU,GAAG,MAAM,CAAC;YACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;QAC3E,CAAC,CAAA;QAED,YAAO,GAAG,GAAG,EAAE;YACd,IAAI,cAAY,CAAC,UAAU,EAAE,iBAAiB,IAAI,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,UAAU,EAAE,iBAAiB,IAAI,IAAI,CAAC,iBAAiB;gBAAE,OAAO;YACjJ,cAAY,CAAC,UAAU,GAAG,IAAI,CAAC;YAC/B,IAAI,CAAC,WAAW,EAAE,CAAC;QACpB,CAAC,CAAA;QAED,iBAAY,GAAG,CAAC,EAAa,EAAE,EAAE;YAChC,cAAY,CAAC,UAAU,GAAG,IAAI,CAAC;QAChC,CAAC,CAAA;QAED,gBAAW,GAAG,GAAG,EAAE;YAClB,cAAY,CAAC,UAAU,GAAG,IAAI,CAAC;QAChC,CAAC,CAAA;QAED,eAAU,GAAG,CAAC,CAAY,EAAE,EAAE;YAC7B,cAAY,CAAC,UAAU,GAAG,IAAI,CAAC;YAC/B,CAAC,CAAC,eAAe,EAAE,CAAC;QACrB,CAAC,CAAA;QAED,WAAM,GAAG,GAAG,EAAE;YACb,MAAM,IAAI,GAAG,IAAI,CAAA;;aAEN,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;aAC/B,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,gBAAgB;mBACpC,IAAI,CAAC,cAAc;kBACpB,IAAI,CAAC,aAAa;0BACV,IAAI,CAAC,iBAAiB;cAClC,IAAI,CAAC,KAAK;gBACR,IAAI,CAAC,OAAO;sBACN,IAAI,CAAC,aAAa;iBACvB,IAAI,CAAC,WAAW;gBACjB,IAAI,CAAC,OAAO;iBACX,IAAI,CAAC,QAAQ;kBACZ,IAAI,CAAC,SAAS;mBACb,IAAI,CAAC,SAAS;mBACd,IAAI,CAAC,SAAS;kBACf,IAAI,CAAC,YAAY;iBAClB,IAAI,CAAC,WAAW;aACpB,IAAI,CAAC,UAAU;;GAEzB,CAAC;YAEF,MAAM,SAAS,GAAG,IAAI,CAAA;;;aAGX,IAAI,CAAC,OAAO;iBACR,IAAI,CAAC,WAAW;kBACf,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;;GAEvC,CAAC;YAEF,OAAO,IAAI,CAAA;KACR,IAAI,CAAC,WAAW,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;KAC5C,IAAI,CAAC,WAAW,IAAI,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;;GAEjD,CAAA;QACF,CAAC,CAAC;IAEH,CAAC;IA3QA,IAAI,QAAQ,CAAC,KAAc;QAC1B,uBAAA,IAAI,0BAAa,KAAK,MAAA,CAAC;QACvB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAC9D,CAAC;IACD,IAAI,QAAQ,KAAK,OAAO,uBAAA,IAAI,8BAAU,CAAA,CAAC,CAAC;IAkCxC,IAAI,aAAa,KAAa,OAAO,IAAI,CAAC,cAAc,CAAA,CAAC,CAAC;IAC1D,IAAI,aAAa,CAAC,KAAa;QAC9B,IAAI,KAAK,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YAClC,IAAI,CAAC,aAAa,CAAC,eAAe,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;YACzD,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC7B,CAAC;IACF,CAAC;IAED,IAAI,UAAU;QACb,OAAO,IAAI,CAAC,IAAI,EAAE,YAAY,EAAE,EAAE,CAAC;IACpC,CAAC;IAiBD,IAAI,SAAS,KAAK,OAAO,IAAI,CAAC,gBAAgB,CAAA,CAAC,CAAC;IAKhD,MAAM;QACL,IAAK,IAAI,CAAC,gBAA2B,EAAE,MAAM;YAAG,IAAI,CAAC,gBAA2B,CAAC,MAAM,EAAE,CAAC;IAC3F,CAAC;IAED,UAAU,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAA,CAAC,CAAC;IAE1C,KAAK,CAAC,YAAY,CAAC,WAAwB;QAC1C,IAAI,CAAC,IAAI,CAAC,eAAe;YAAE,OAAO,IAAI,CAAC;QAEvC,MAAM,cAAc,GAAG,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,WAAW,CAAC,EAAE,iBAAiB,CAAC;QAClG,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC;YAC1D,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;YAC1D,SAAS,CAAC,OAAO,CAAC,iBAAiB,GAAG,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,WAAW,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;YACrG,IAAI,CAAC,cAAc;gBAAE,OAAO,SAAS,CAAC;YACtC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;QAC7C,CAAC;QACD,OAAO,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IACzC,CAAC;IAED,KAAK,CAAC,aAAa,CAAC,EAAe;QAClC,IAAI,EAAE,IAAI,IAAI,EAAE,CAAC;YAChB,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,CAAC;YAC5C,IAAI,CAAC,gBAAgB,GAAG,MAAM,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;YAEpD,IAAI,aAAa,EAAE,CAAC;gBACnB,MAAM,iBAAiB,GAAG,aAAa,EAAE,OAAO,EAAE,iBAAiB,KAAK,GAAG,CAAC;gBAE5E,IAAI,iBAAiB,EAAE,CAAC;oBACvB,GAAG,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;gBAChC,CAAC;qBAAM,CAAC;oBACP,aAAa,CAAC,MAAM,EAAE,CAAC;gBACxB,CAAC;YACF,CAAC;YAED,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBAC3B,IAAI,IAAI,CAAC,gBAAgB,CAAC,aAAa,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;oBAC5D,GAAG,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;gBAC1D,CAAC;gBACD,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACxC,CAAC;YAED,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;gBACrB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;gBACxB,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;YACvC,CAAC;QACF,CAAC;aAAM,CAAC;YACP,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;YAC1B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;QAC9B,CAAC;QAED,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,MAAM,EAAE,CAAC;QACf,CAAC;IACF,CAAC;IAED,OAAO;QACN,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,YAAY,EAAE,EAAE,CAAC;QACvC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,IAAI,EAAE,aAAa,IAAI,CAAC,CAAC,CAAC;QACrD,IAAI,EAAE,IAAI,IAAI;YAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;IAChE,CAAC;IAWD,IAAI,CAAC,IAAsB,EAAE,aAAa,GAAG,IAAI;QAChD,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACjD,IAAI,QAAQ,GAAG,CAAC,CAAC,EAAE,CAAC;YACnB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;QAC9C,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,EAAE,aAAa,CAAC,CAAC;QACjD,CAAC;QAED,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;IACpC,CAAC;IAED,UAAU,CAAC,KAAgC;QAC1C,IAAI,CAAC,IAAI,CAAC,iBAAiB;YAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;QAC3D,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC;YAC1C,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;YACxE,CAAC,CAAC,CAAC,CAAC,CAAC;QAEN,IAAI,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;YACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;QAClE,CAAC;IACF,CAAC;IAED,YAAY;QACX,IAAI,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC;YAAE,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;IACxE,CAAC;IAED,eAAe,CAAC,GAAwB;QACvC,cAAY,CAAC,YAAY,GAAG,GAAG,CAAC;QAEhC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;QACxB,IAAI,GAAG,IAAI,IAAI,EAAE,CAAC;YACjB,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC3C,OAAO,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACtC,CAAC;QAED,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAC9B,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,EAAE;YAC7B,CAAC,EAAE,CAAC,GAAG,IAAI,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS;YACrF,CAAC,EAAE,GAAG,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;YACtD,CAAC,EAAE,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;YACrD,CAAC,EAAE,GAAG,IAAI,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;SACrD,CAAC,CAAC;IACJ,CAAC;IAOD,wBAAwB,CAAC,CAAS,EAAE,CAAS;QAC5C,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,EAAE,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;QACzE,MAAM,MAAM,GAAG,GAAG,CAAC;QACnB,IAAI,CAAC,GAAG,CAAC,GAAG,MAAM,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,MAAM,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC;YAAE,OAAO,IAAI,CAAC;QAClG,MAAM,CAAC,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QACtD,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAwB,CAAC;IACxF,CAAC;;;AA1MM,mBAAM,GAAG,CAAC,KAAK,CAAC,AAAV,CAAW;AAIxB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,IAAI,EAAC,CAAC;4CAI3C;AAID;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;uDACM;AAG/B;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,KAAK,EAAC,CAAC;2CACE;AAG1B;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;8CACT;AAGjB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;qDACS;AAGlC;IADC,KAAK,CAAC,SAAS,CAAC;0CACN;AAGX;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,KAAK,EAAC,CAAC;6CACE;AAG1B;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;+CACR;AAGlB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;oDACH;AAGvB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;mDACJ;AAGtB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACC;AAI1B;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAC,CAAC;iDACA;AAa1D;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;iDACF;AAGtC;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;qDACF;AAGxB;IADC,KAAK,CAAC,YAAY,CAAC;+CACM;AAG1B;IADC,KAAK,CAAC,UAAU,CAAC;6CACM;AAtEZ,YAAY;IADxB,aAAa,CAAC,iBAAiB,CAAC;GACpB,YAAY,CAqRxB","sourcesContent":["import { LitElement, html } from \"lit\";\nimport { customElement, property, query } from \"lit/decorators.js\";\nimport { style } from './tabContainer.style';\nimport { ContainerTabItem } from '../types';\nimport { dom, ComponentFactory, actions, Layout, ComponentId, DirectionalPosition, VerticalPosition } from \"@omegagrid/core\";\nimport { TabEvent, Tabs, TabSize } from \"./tabs\";\n\nexport type TabsActionArgs = {\n\tindex: number\n}\n\n@customElement('og-tabcontainer')\nexport class TabContainer extends LitElement implements Layout {\n\n\tstatic dropPosition: DirectionalPosition;\n\tstatic dragParent: TabContainer;\n\tstatic dropTarget: TabContainer;\n\n\tstatic styles = [style];\n\n\t#inactive = false;\n\t@property({type: Boolean, noAccessor: true})\n\tset inactive(value: boolean) {\n\t\tthis.#inactive = value;\n\t\tif (this.tabs) this.tabs.classList.toggle('inactive', value);\n\t}\n\tget inactive() { return this.#inactive }\n\n\t@property({type: Object})\n\ttopLevelComponent: HTMLElement;\n\n\t@property({type: Array})\n\titems: ContainerTabItem[];\n\n\t@property({type: Boolean})\n\tclosable = false;\n\n\t@property({type: Object})\n\tcreateComponent: ComponentFactory;\n\n\t@query('og-tabs')\n\ttabs: Tabs;\n\n\t@property({type: Array})\n\tactions: actions.Action[];\n\n\t@property({type: Boolean})\n\taddButton = false;\n\n\t@property({type: Boolean})\n\tscrollableTabs = false;\n\n\t@property({type: Boolean})\n\tdraggableTabs = false;\n\n\t@property({type: String})\n\ttabSize: TabSize = 'auto';\n\n\tprivate _selectedIndex = -1;\n\t@property({type: Number, reflect: true, noAccessor: true})\n\tget selectedIndex(): number { return this._selectedIndex }\n\tset selectedIndex(value: number) {\n\t\tif (value != this._selectedIndex) {\n\t\t\tthis.requestUpdate('selectedIndex', this._selectedIndex);\n\t\t\tthis._selectedIndex = value;\n\t\t}\n\t}\n\n\tget selectedId(): ComponentId {\n\t\treturn this.tabs?.selectedItem?.id;\n\t}\n\n\t@property({type: String, reflect: true})\n\ttabPosition: VerticalPosition = 'top';\n\n\t@property({type: Boolean})\n\tcacheComponents = false;\n\n\t@query('#container')\n\tcontainer: HTMLDivElement;\n\n\t@query('#overlay')\n\toverlay: HTMLDivElement;\n\n\n\tpublic readonly components = new Map<ComponentId, HTMLElement>();\n\tprivate currentComponent: HTMLElement;\n\tget component() { return this.currentComponent }\n\n\t_firstLoad = true;\n\t_itemMap = new Map<ComponentId, ContainerTabItem>;\n\n\tlayout() {\n\t\tif ((this.currentComponent as Layout)?.layout) (this.currentComponent as Layout).layout();\n\t}\n\n\tupdateTabs() { this.tabs.requestUpdate() }\n\n\tasync getComponent(componentId: ComponentId) {\n\t\tif (!this.createComponent) return null;\n\n\t\tconst cacheComponent = this.cacheComponents || this._itemMap?.get(componentId)?.preventDisconnect;\n\t\tif (!cacheComponent || !this.components.has(componentId)) {\n\t\t\tconst component = await this.createComponent(componentId);\n\t\t\tcomponent.dataset.preventDisconnect = this._itemMap?.get(componentId)?.preventDisconnect ? '1' : '0';\n\t\t\tif (!cacheComponent) return component;\n\t\t\tthis.components.set(componentId, component);\n\t\t}\n\t\treturn this.components.get(componentId);\n\t}\n\n\tasync loadComponent(id: ComponentId) {\n\t\tif (id != null) {\n\t\t\tconst prevComponent = this.currentComponent;\n\t\t\tthis.currentComponent = await this.getComponent(id);\n\n\t\t\tif (prevComponent) {\n\t\t\t\tconst preventDisconnect = prevComponent?.dataset?.preventDisconnect === '1';\n\n\t\t\t\tif (preventDisconnect) {\n\t\t\t\t\tdom.hideElement(prevComponent);\n\t\t\t\t} else {\n\t\t\t\t\tprevComponent.remove();\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (this.currentComponent) {\n\t\t\t\tif (this.currentComponent.parentElement !== this.container) {\n\t\t\t\t\tdom.appendElement(this.container, this.currentComponent);\n\t\t\t\t}\n\t\t\t\tdom.showElement(this.currentComponent);\n\t\t\t}\n\n\t\t\tif (this._firstLoad) {\n\t\t\t\tthis._firstLoad = false;\n\t\t\t\tthis.dispatchEvent(new Event('load'));\n\t\t\t}\n\t\t} else {\n\t\t\tdom.empty(this.container);\n\t\t\tthis.currentComponent = null;\n\t\t}\n\n\t\tif (this._firstLoad) {\n\t\t\tthis._firstLoad = false;\n\t\t\tthis.layout();\n\t\t}\n\t}\n\n\trefresh() {\n\t\tconst id = this.tabs?.selectedItem?.id;\n\t\tthis._selectedIndex = this.tabs?.selectedIndex ?? -1;\n\t\tif (id != null)\tthis.loadComponent(this.tabs.selectedItem?.id);\n\t}\n\n\t_onSelect = () => this.refresh();\n\n\t_onRemove = (e: TabEvent) => {\n\t\tthis.components.delete(e.tab.id);\n\t\tif (this.tabs.items?.length === 0) {\n\t\t\tdom.showElement(this.tabs, 'flex');\n\t\t}\n\t};\n\n\topen(item: ContainerTabItem, dispatchEvent = true) {\n\t\tconst tabIndex = this.tabs.getIndexById(item.id);\n\t\tif (tabIndex > -1) {\n\t\t\tthis.tabs.selectTab(tabIndex, dispatchEvent);\n\t\t} else {\n\t\t\tthis.tabs.addTab(item);\n\t\t\tthis.tabs.selectTabById(item.id, dispatchEvent);\n\t\t}\n\n\t\tdom.showElement(this.tabs, 'flex');\n\t}\n\n\twillUpdate(props: Map<PropertyKey, unknown>) {\n\t\tif (!this.topLevelComponent) this.topLevelComponent = this;\n\t\tthis.selectedIndex = this.items?.length > 0\n\t\t\t? Math.max(0, Math.min(this.selectedIndex ?? -1, this.items.length - 1))\n\t\t\t: -1;\n\n\t\tif (props.has('items')) {\n\t\t\tthis._firstLoad = true;\n\t\t\tthis._itemMap = new Map(this.items.map(item => [item.id, item]));\n\t\t}\n\t}\n\n\tfirstUpdated() {\n\t\tif (this.selectedIndex > -1) this.open(this.items[this.selectedIndex]);\n\t}\n\n\tpositionOverlay(pos: DirectionalPosition) {\n\t\tTabContainer.dropPosition = pos;\n\n\t\tthis.tabs.hideOverlay();\n\t\tif (pos == null) {\n\t\t\tthis.tabs.positionOverlay(this.tabs.empty);\n\t\t\treturn dom.hideElement(this.overlay);\n\t\t}\n\n\t\tdom.showElement(this.overlay);\n\t\tdom.setPosition(this.overlay, {\n\t\t\tt: (pos == 'bottom' ? this.container.clientHeight / 2 : 0) + this.container.offsetTop,\n\t\t\tl: pos == 'right' ? this.container.clientWidth / 2 : 0,\n\t\t\tb: pos == 'top' ? this.container.clientHeight / 2 : 0,\n\t\t\tr: pos == 'left' ? this.container.clientWidth / 2 : 0,\n\t\t});\n\t}\n\n\thideOverlay = () => {\n\t\tdom.hideElement(this.overlay);\n\t\tthis.tabs.hideOverlay();\n\t}\n\n\tcalculateOverlayPosition(x: number, y: number) {\n\t\tconst [w, h] = [this.container.clientWidth, this.container.clientHeight];\n\t\tconst margin = 0.3;\n\t\tif (x > w * margin && x < w - (w * margin) && y > h * margin && y < h - (h * margin)) return null;\n\t\tconst [q1, q2] = [w / h > x / y, w / h > x / (h - y)];\n\t\treturn (q1 ? (q2 ? 'left' : 'bottom') : (q2 ? 'top' : 'right')) as DirectionalPosition;\n\t}\n\n\t_onDragover = (e: DragEvent) => {\n\t\tif (!TabContainer.dragParent || !Tabs.dragParent) return;\n\t\tif (TabContainer.dragParent.topLevelComponent != this.topLevelComponent && Tabs.dragParent.topLevelComponent != this.topLevelComponent) return;\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\te.dataTransfer.dropEffect = 'move';\n\t\tthis.positionOverlay(this.calculateOverlayPosition(e.offsetX, e.offsetY));\n\t}\n\n\t_onDrop = () => {\n\t\tif (TabContainer.dragParent?.topLevelComponent != this.topLevelComponent && Tabs.dragParent?.topLevelComponent != this.topLevelComponent) return;\n\t\tTabContainer.dropTarget = this;\n\t\tthis.hideOverlay();\n\t}\n\n\t_onDragStart = (_e: DragEvent) => {\n\t\tTabContainer.dragParent = this;\n\t}\n\n\t_onDragStop = () => {\n\t\tTabContainer.dragParent = null;\n\t}\n\n\t_onTabDrop = (e: DragEvent) => {\n\t\tTabContainer.dragParent = null;\n\t\te.stopPropagation();\n\t}\n\n\trender = () => {\n\t\tconst tabs = html`\n\t\t\t<og-tabs\n\t\t\t\tclass=\"${this.inactive ? 'inactive' : ''}\"\n\t\t\t\tstyle=\"${this.items?.length ? '' : 'display: none;'}\"\n\t\t\t\t?scrollable=\"${this.scrollableTabs}\"\n\t\t\t\t?draggable=\"${this.draggableTabs}\"\n\t\t\t\t.topLevelComponent=\"${this.topLevelComponent}\"\n\t\t\t\t.items=\"${this.items}\"\n\t\t\t\t.actions=\"${this.actions}\"\n\t\t\t\t.selectedIndex=\"${this.selectedIndex}\"\n\t\t\t\t.position=\"${this.tabPosition}\"\n\t\t\t\t.tabSize=\"${this.tabSize}\"\n\t\t\t\t?closable=\"${this.closable}\"\n\t\t\t\t?addButton=\"${this.addButton}\"\n\t\t\t\t@tab.select=\"${this._onSelect}\"\n\t\t\t\t@tab.remove=\"${this._onRemove}\"\n\t\t\t\t@dragstart=\"${this._onDragStart}\"\n\t\t\t\t@dragstop=\"${this._onDragStop}\"\n\t\t\t\t@drop=\"${this._onTabDrop}\">\n\t\t\t</og-tabs>\n\t\t`;\n\n\t\tconst container = html`\n\t\t\t<div\n\t\t\t\tid=\"container\"\n\t\t\t\t@drop=\"${this._onDrop}\"\n\t\t\t\t@dragover=\"${this._onDragover}\"\n\t\t\t\t@dragleave=\"${() => this.hideOverlay()}\">\n\t\t\t</div>\n\t\t`;\n\n\t\treturn html`\n\t\t\t${this.tabPosition == 'top' ? tabs : container}\n\t\t\t${this.tabPosition == 'bottom' ? tabs : container}\n\t\t\t<div id=\"overlay\" style=\"display: none\"></div>\n\t\t`\n\t};\n\n}\n"]}
@@ -1,2 +0,0 @@
1
- export declare const style: import("lit").CSSResult;
2
- //# sourceMappingURL=tabContainer.style.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"tabContainer.style.d.ts","sourceRoot":"","sources":["../../src/components/tabContainer.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK,yBA2BjB,CAAC"}
@@ -1,30 +0,0 @@
1
- import { css } from "lit";
2
- export const style = css `
3
- * {
4
- box-sizing: border-box;
5
- }
6
-
7
- :host {
8
- display: flex;
9
- flex-direction: column;
10
- position: relative;
11
- }
12
-
13
- og-tabs {
14
- flex: 0;
15
- }
16
-
17
- #container {
18
- flex: 1;
19
- position: relative;
20
- overflow: hidden;
21
- background: var(--og-background-color-2);
22
- }
23
-
24
- #overlay {
25
- background-color: var(--og-accent-color);
26
- opacity: 0.5;
27
- pointer-events: none;
28
- }
29
- `;
30
- //# sourceMappingURL=tabContainer.style.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"tabContainer.style.js","sourceRoot":"","sources":["../../src/components/tabContainer.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BvB,CAAC","sourcesContent":["import { css } from \"lit\";\n\nexport const style = css`\n\t* {\n\t\tbox-sizing: border-box;\n\t}\n\n\t:host {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tposition: relative;\n\t}\n\t\n\tog-tabs {\n\t\tflex: 0;\n\t}\n\t\n\t#container {\n\t\tflex: 1;\n\t\tposition: relative;\n\t\toverflow: hidden;\n\t\tbackground: var(--og-background-color-2);\n\t}\n\n\t#overlay {\n\t\tbackground-color: var(--og-accent-color);\n\t\topacity: 0.5;\n\t\tpointer-events: none;\n\t}\n`;"]}
@@ -1,43 +0,0 @@
1
- import { LitElement } from "lit";
2
- import { TabItem } from '../types';
3
- import { ComponentFactory, SplitContainer, Layout, ComponentId, VerticalPosition } from "@omegagrid/core";
4
- import { TabContainer } from "./tabContainer";
5
- import { TabSplitContainerModel } from "../model";
6
- type TabSplitContainerTabContainer = TabContainer & {
7
- index: number;
8
- parentContainer: TabSplitContainer;
9
- };
10
- export declare class TabSplitContainer extends LitElement implements Layout {
11
- static styles: import("lit").CSSResult;
12
- topLevelComponent: HTMLElement;
13
- model: TabSplitContainerModel;
14
- addButton: boolean;
15
- closable: boolean;
16
- singleActive: boolean;
17
- tabPosition: VerticalPosition;
18
- scrollableTabs: boolean;
19
- createComponent: ComponentFactory;
20
- splitContainer: SplitContainer;
21
- tabContainers: Set<TabSplitContainer | TabSplitContainerTabContainer>;
22
- private _activeTabContainer;
23
- get activeTabContainer(): TabContainer;
24
- private _activeTab;
25
- get activeTab(): TabItem;
26
- private loadState;
27
- walk(cb: (splitContainer: TabSplitContainer, tabContainer: TabSplitContainerTabContainer) => boolean | void): void;
28
- willUpdate(): void;
29
- updateTabs(): void;
30
- updateTab(id: ComponentId, tab: Partial<TabItem>): void;
31
- removeEmptyContainers(): Promise<void>;
32
- updateActiveTab(): void;
33
- _createTabContainer: (containerIndex: number) => TabSplitContainerTabContainer;
34
- _createSplitContainer: (containerIndex: number) => TabSplitContainer;
35
- _createSplitContainerComponent: (id: ComponentId) => Promise<TabContainer | TabSplitContainer>;
36
- _onDrop: (e: DragEvent) => void;
37
- activate(id: ComponentId): void;
38
- open(item: TabItem, containerIndex?: number): void;
39
- render: () => "" | import("lit-html").TemplateResult<1>;
40
- layout(): void;
41
- }
42
- export {};
43
- //# sourceMappingURL=tabSplitContainer.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"tabSplitContainer.d.ts","sourceRoot":"","sources":["../../src/components/tabSplitContainer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,EAAO,gBAAgB,EAAE,cAAc,EAAE,MAAM,EAAE,WAAW,EAAe,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAC5H,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAElD,KAAK,6BAA6B,GAAG,YAAY,GAAG;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,iBAAiB,CAAA;CAClC,CAAC;AAEF,qBAEa,iBAAkB,SAAQ,UAAW,YAAW,MAAM;IAElE,MAAM,CAAC,MAAM,0BAQX;IAGF,iBAAiB,EAAE,WAAW,CAAC;IAG/B,KAAK,EAAE,sBAAsB,CAAC;IAG9B,SAAS,UAAS;IAGlB,QAAQ,UAAS;IAGjB,YAAY,UAAS;IAGrB,WAAW,EAAE,gBAAgB,CAAS;IAGtC,cAAc,UAAS;IAGvB,eAAe,EAAE,gBAAgB,CAAC;IAGlC,cAAc,EAAE,cAAc,CAAC;IAE/B,aAAa,yDAA8D;IAE3E,OAAO,CAAC,mBAAmB,CAAe;IAC1C,IAAI,kBAAkB,iBAAsC;IAE5D,OAAO,CAAC,UAAU,CAAU;IAC5B,IAAI,SAAS,YAA6B;IAE1C,OAAO,CAAC,SAAS,CAAK;IAEtB,IAAI,CAAC,EAAE,EAAE,CAAC,cAAc,EAAE,iBAAiB,EAAE,YAAY,EAAE,6BAA6B,KAAK,OAAO,GAAC,IAAI;IAUzG,UAAU;IAKV,UAAU;IAEV,SAAS,CAAC,EAAE,EAAE,WAAW,EAAE,GAAG,EAAE,OAAO,CAAC,OAAO,CAAC;IAkB1C,qBAAqB;IAQ3B,eAAe;IAOf,mBAAmB,GAAI,gBAAgB,MAAM,mCAqD3C;IAEF,qBAAqB,GAAI,gBAAgB,MAAM,uBAY7C;IAEF,8BAA8B,GAAI,IAAI,WAAW,+CAgB9C;IAEH,OAAO,GAAI,GAAG,SAAS,UA4DtB;IAED,QAAQ,CAAC,EAAE,EAAE,WAAW;IAIxB,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,cAAc,SAAI;IAwBtC,MAAM,kDAOC;IAEP,MAAM;CAIN"}