@omegagrid/toolbar 0.2.5

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 (57) hide show
  1. package/dist/constants.d.ts +45 -0
  2. package/dist/constants.d.ts.map +1 -0
  3. package/dist/constants.js +10 -0
  4. package/dist/constants.js.map +1 -0
  5. package/dist/index.d.ts +3 -0
  6. package/dist/index.d.ts.map +1 -0
  7. package/dist/index.js +19 -0
  8. package/dist/index.js.map +1 -0
  9. package/dist/types.d.ts +25 -0
  10. package/dist/types.d.ts.map +1 -0
  11. package/dist/types.js +3 -0
  12. package/dist/types.js.map +1 -0
  13. package/dist/ui/controls/index.d.ts +7 -0
  14. package/dist/ui/controls/index.d.ts.map +1 -0
  15. package/dist/ui/controls/index.js +23 -0
  16. package/dist/ui/controls/index.js.map +1 -0
  17. package/dist/ui/controls/renderers.d.ts +4 -0
  18. package/dist/ui/controls/renderers.d.ts.map +1 -0
  19. package/dist/ui/controls/renderers.js +83 -0
  20. package/dist/ui/controls/renderers.js.map +1 -0
  21. package/dist/ui/controls/toolbarButton.d.ts +10 -0
  22. package/dist/ui/controls/toolbarButton.d.ts.map +1 -0
  23. package/dist/ui/controls/toolbarButton.js +62 -0
  24. package/dist/ui/controls/toolbarButton.js.map +1 -0
  25. package/dist/ui/controls/toolbarColorPicker.d.ts +15 -0
  26. package/dist/ui/controls/toolbarColorPicker.d.ts.map +1 -0
  27. package/dist/ui/controls/toolbarColorPicker.js +99 -0
  28. package/dist/ui/controls/toolbarColorPicker.js.map +1 -0
  29. package/dist/ui/controls/toolbarDropdown.d.ts +13 -0
  30. package/dist/ui/controls/toolbarDropdown.d.ts.map +1 -0
  31. package/dist/ui/controls/toolbarDropdown.js +74 -0
  32. package/dist/ui/controls/toolbarDropdown.js.map +1 -0
  33. package/dist/ui/controls/toolbarDropdownButton.d.ts +19 -0
  34. package/dist/ui/controls/toolbarDropdownButton.d.ts.map +1 -0
  35. package/dist/ui/controls/toolbarDropdownButton.js +112 -0
  36. package/dist/ui/controls/toolbarDropdownButton.js.map +1 -0
  37. package/dist/ui/controls/toolbarGrid.d.ts +8 -0
  38. package/dist/ui/controls/toolbarGrid.d.ts.map +1 -0
  39. package/dist/ui/controls/toolbarGrid.js +43 -0
  40. package/dist/ui/controls/toolbarGrid.js.map +1 -0
  41. package/dist/ui/controls/toolbarText.d.ts +19 -0
  42. package/dist/ui/controls/toolbarText.d.ts.map +1 -0
  43. package/dist/ui/controls/toolbarText.js +112 -0
  44. package/dist/ui/controls/toolbarText.js.map +1 -0
  45. package/dist/ui/index.d.ts +3 -0
  46. package/dist/ui/index.d.ts.map +1 -0
  47. package/dist/ui/index.js +19 -0
  48. package/dist/ui/index.js.map +1 -0
  49. package/dist/ui/toolbar.d.ts +19 -0
  50. package/dist/ui/toolbar.d.ts.map +1 -0
  51. package/dist/ui/toolbar.js +85 -0
  52. package/dist/ui/toolbar.js.map +1 -0
  53. package/dist/ui/toolbar.style.d.ts +2 -0
  54. package/dist/ui/toolbar.style.d.ts.map +1 -0
  55. package/dist/ui/toolbar.style.js +71 -0
  56. package/dist/ui/toolbar.style.js.map +1 -0
  57. package/package.json +59 -0
@@ -0,0 +1,45 @@
1
+ declare const _default: {
2
+ LOCALE: string;
3
+ PREFIX: string;
4
+ DEFAULT_ACCENT_COLOR: string;
5
+ DEFAULT_ACCENT_COLOR_2: import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<string | number | ArrayLike<number> | import("color")<any> | {
6
+ [key: string]: any;
7
+ }> | {
8
+ [key: string]: any;
9
+ }> | {
10
+ [key: string]: any;
11
+ }> | {
12
+ [key: string]: any;
13
+ }> | {
14
+ [key: string]: any;
15
+ }> | {
16
+ [key: string]: any;
17
+ }> | {
18
+ [key: string]: any;
19
+ }> | {
20
+ [key: string]: any;
21
+ }> | {
22
+ [key: string]: any;
23
+ }> | {
24
+ [key: string]: any;
25
+ }> | {
26
+ [key: string]: any;
27
+ }>;
28
+ SIZER_SIZE: number;
29
+ SLIDER_SIZE: number;
30
+ SLIDER_MIN_LENGTH: number;
31
+ EXPANDER_SIZE: number;
32
+ LIST_ITEM_HEIGHT: number;
33
+ LIST_RENDERING_TRESHOLD: number;
34
+ LIST_AUTOSCROLL_TRESHOLD: number;
35
+ LIST_AUTOSCROLL_DELAY: number;
36
+ DEFAULT_TEXT_HIGHLIGHT_COLOR: string;
37
+ TOOLTIP_MARGIN: number;
38
+ MENU_ITEM_HEIGHT: number;
39
+ COLORPICKER_COLOR_SIZE: number;
40
+ TOOLBAR_HEIGHT: number;
41
+ TOOLBAR_COMPONENT_SIZE_BASE: number;
42
+ TOOLBAR_TOOLTIP_DELAY: number;
43
+ };
44
+ export default _default;
45
+ //# sourceMappingURL=constants.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBAMC"}
@@ -0,0 +1,10 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const core_1 = require("@omegagrid/core");
4
+ exports.default = {
5
+ TOOLBAR_HEIGHT: 30,
6
+ TOOLBAR_COMPONENT_SIZE_BASE: 24,
7
+ TOOLBAR_TOOLTIP_DELAY: 200,
8
+ ...core_1.constants
9
+ };
10
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":";;AAAA,0CAA6D;AAE7D,kBAAe;IACd,cAAc,EAAE,EAAE;IAClB,2BAA2B,EAAE,EAAE;IAC/B,qBAAqB,EAAE,GAAG;IAC1B,GAAG,gBAAa;CAEhB,CAAA"}
@@ -0,0 +1,3 @@
1
+ export * from './ui';
2
+ export * from './types';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,MAAM,CAAC;AACrB,cAAc,SAAS,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,19 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./ui"), exports);
18
+ __exportStar(require("./types"), exports);
19
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,uCAAqB;AACrB,0CAAwB"}
@@ -0,0 +1,25 @@
1
+ import { ColorTypes, IconSpec } from "@omegagrid/core";
2
+ import { NodeSource } from "@omegagrid/tree";
3
+ import { TemplateResult } from "lit-html";
4
+ export type ToolbarItemType = 'divider' | 'button' | 'togglebutton' | 'dropdown' | 'dropdown-button' | 'color' | 'text' | 'label';
5
+ export type ToolbarItem = {
6
+ type: ToolbarItemType;
7
+ id: string;
8
+ title?: string;
9
+ value?: unknown;
10
+ tooltip?: string;
11
+ color?: ColorTypes;
12
+ icon?: IconSpec;
13
+ width?: number;
14
+ text?: string;
15
+ caption?: string;
16
+ content?: TemplateResult<1>;
17
+ items?: ToolbarItem[][] | NodeSource[];
18
+ colspan?: number;
19
+ default?: boolean;
20
+ placeholder?: string;
21
+ disabled?: boolean;
22
+ hidden?: boolean;
23
+ gap?: number;
24
+ };
25
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,MAAM,MAAM,eAAe,GAAG,SAAS,GAAC,QAAQ,GAAC,cAAc,GAAC,UAAU,GAAC,iBAAiB,GAAC,OAAO,GAAC,MAAM,GAAC,OAAO,CAAC;AAEpH,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,eAAe,CAAC;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IAC5B,KAAK,CAAC,EAAE,WAAW,EAAE,EAAE,GAAC,UAAU,EAAE,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAA;CACZ,CAAA"}
package/dist/types.js ADDED
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}
@@ -0,0 +1,7 @@
1
+ export * from './toolbarButton';
2
+ export * from './toolbarDropdown';
3
+ export * from './toolbarDropdownButton';
4
+ export * from './toolbarGrid';
5
+ export * from './toolbarText';
6
+ export * from './toolbarColorPicker';
7
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,yBAAyB,CAAC;AACxC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,sBAAsB,CAAC"}
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./toolbarButton"), exports);
18
+ __exportStar(require("./toolbarDropdown"), exports);
19
+ __exportStar(require("./toolbarDropdownButton"), exports);
20
+ __exportStar(require("./toolbarGrid"), exports);
21
+ __exportStar(require("./toolbarText"), exports);
22
+ __exportStar(require("./toolbarColorPicker"), exports);
23
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/controls/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kDAAgC;AAChC,oDAAkC;AAClC,0DAAwC;AACxC,gDAA8B;AAC9B,gDAA8B;AAC9B,uDAAqC"}
@@ -0,0 +1,4 @@
1
+ import { TemplateResult } from "lit-html";
2
+ import { ToolbarItem, ToolbarItemType } from "../../types";
3
+ export declare const renderers: Map<ToolbarItemType, (item: ToolbarItem, value?: unknown) => TemplateResult<1>>;
4
+ //# sourceMappingURL=renderers.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"renderers.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/renderers.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAmB3D,eAAO,MAAM,SAAS,8BAAmC,WAAW,UAAU,OAAO,KAAK,eAAe,CAAC,CAAC,CA0DzG,CAAC"}
@@ -0,0 +1,83 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.renderers = void 0;
4
+ const core_1 = require("@omegagrid/core");
5
+ const lit_1 = require("lit");
6
+ const style_map_js_1 = require("lit-html/directives/style-map.js");
7
+ const defaultStyles = new Map([
8
+ ['button', {}],
9
+ ['togglebutton', {}],
10
+ ['dropdown', {}],
11
+ ['dropdown-button', { width: '38px' }],
12
+ ['color', { width: '38px' }],
13
+ ['text', { width: '100px' }],
14
+ ]);
15
+ function getItemStyle(item) {
16
+ const style = defaultStyles.get(item.type) || {};
17
+ style.display = item.hidden ? 'none' : null;
18
+ if (item.width)
19
+ style.width = core_1.dom.numToPixels(item.width);
20
+ if (item.gap)
21
+ style.marginLeft = core_1.dom.numToPixels(item.gap);
22
+ return style;
23
+ }
24
+ exports.renderers = new Map([
25
+ ['button', (item) => (0, lit_1.html) `
26
+ <og-toolbar-button
27
+ data-id="${item.id}"
28
+ class="control"
29
+ .item="${item}"
30
+ ?disabled="${item.disabled}"
31
+ style="${(0, style_map_js_1.styleMap)(getItemStyle(item))}">
32
+ </og-toolbar-button>
33
+ `],
34
+ ['togglebutton', (item, value) => (0, lit_1.html) `
35
+ <og-toolbar-button
36
+ data-id="${item.id}"
37
+ class="control"
38
+ .item="${item}"
39
+ type="toggle"
40
+ state="${value ? 'checked' : 'unchecked'}"
41
+ style="${(0, style_map_js_1.styleMap)(getItemStyle(item))}">
42
+ </og-toolbar-button>
43
+ `],
44
+ ['dropdown', (item, value) => (0, lit_1.html) `
45
+ <og-toolbar-dropdown
46
+ data-id="${item.id}"
47
+ class="control"
48
+ .item="${item}"
49
+ .value="${value}"
50
+ style="${(0, style_map_js_1.styleMap)(getItemStyle(item))}">
51
+ </og-toolbar-dropdown>
52
+ `],
53
+ ['dropdown-button', (item) => (0, lit_1.html) `
54
+ <og-toolbar-dropdownbutton
55
+ data-id="${item.id}"
56
+ class="control"
57
+ .item="${item}"
58
+ style="${(0, style_map_js_1.styleMap)(getItemStyle(item))}">
59
+ </og-toolbar-dropdownbutton>
60
+ `],
61
+ ['color', (item, value) => (0, lit_1.html) `
62
+ <og-toolbar-colorpicker
63
+ data-id="${item.id}"
64
+ class="control"
65
+ .item="${item}"
66
+ .value="${value}"
67
+ style="${(0, style_map_js_1.styleMap)(getItemStyle(item))}">
68
+ </og-toolbar-colorpicker>
69
+ `],
70
+ ['text', (item, value) => (0, lit_1.html) `
71
+ <og-toolbar-text
72
+ data-id="${item.id}"
73
+ class="control"
74
+ .item="${item}"
75
+ .value="${value}"
76
+ style="${(0, style_map_js_1.styleMap)(getItemStyle(item))}">
77
+ </og-toolbar-text>
78
+ `],
79
+ ['label', (item, value) => (0, lit_1.html) `
80
+ <label style="${(0, style_map_js_1.styleMap)(getItemStyle(item))}">${value}</label>
81
+ `],
82
+ ]);
83
+ //# sourceMappingURL=renderers.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"renderers.js","sourceRoot":"","sources":["../../../src/ui/controls/renderers.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,10 @@
1
+ import { Button } from '@omegagrid/core';
2
+ import { ToolbarItem } from '../../types';
3
+ export declare class ToolbarButton extends Button {
4
+ static styles: import("lit").CSSResult[];
5
+ item: ToolbarItem;
6
+ constructor();
7
+ firstUpdated(): void;
8
+ willUpdate(changedProps: Map<PropertyKey, undefined>): void;
9
+ }
10
+ //# sourceMappingURL=toolbarButton.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"toolbarButton.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/toolbarButton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAc,MAAM,iBAAiB,CAAC;AAIrD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG1C,qBACa,aAAc,SAAQ,MAAM;IAExC,MAAM,CAAC,MAAM,4BAUV;IAGH,IAAI,EAAE,WAAW,CAAC;;IAOlB,YAAY;IAUZ,UAAU,CAAC,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,SAAS,CAAC;CAcpD"}
@@ -0,0 +1,62 @@
1
+ "use strict";
2
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
3
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
4
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
5
+ 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;
6
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
7
+ };
8
+ var __importDefault = (this && this.__importDefault) || function (mod) {
9
+ return (mod && mod.__esModule) ? mod : { "default": mod };
10
+ };
11
+ Object.defineProperty(exports, "__esModule", { value: true });
12
+ exports.ToolbarButton = void 0;
13
+ const core_1 = require("@omegagrid/core");
14
+ const constants_1 = __importDefault(require("../../constants"));
15
+ const lit_1 = require("lit");
16
+ const decorators_js_1 = require("lit/decorators.js");
17
+ const core_2 = require("@omegagrid/core");
18
+ let ToolbarButton = class ToolbarButton extends core_1.Button {
19
+ constructor() {
20
+ super();
21
+ this.color = null;
22
+ }
23
+ firstUpdated() {
24
+ this.addEventListener('click', () => {
25
+ core_2.actions.dispatchActionEvent(this, 'toolbar', {
26
+ type: 'change',
27
+ key: this.item.id,
28
+ value: this.type == 'toggle' ? (this.state == 'checked') : this.item.value
29
+ });
30
+ });
31
+ }
32
+ willUpdate(changedProps) {
33
+ if (changedProps.has('item') && this.item) {
34
+ this.icon = this.item.icon;
35
+ this.text = this.item.text;
36
+ this.color = this.item.color ? this.item.color : (this.type == 'normal' ? core_1.ColorTypes.Gray : core_1.ColorTypes.Accent);
37
+ if (this.item.content) {
38
+ (0, lit_1.render)((0, lit_1.html) `<div slot="content">${this.item.content}</div>`, this);
39
+ }
40
+ }
41
+ super.willUpdate(changedProps);
42
+ }
43
+ };
44
+ exports.ToolbarButton = ToolbarButton;
45
+ ToolbarButton.styles = [...core_1.Button.styles, (0, lit_1.css) `
46
+ :host {
47
+ box-sizing: border-box;
48
+ display: block;
49
+ min-width: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
50
+ height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
51
+ max-height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
52
+ line-height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
53
+ padding: 0;
54
+ }
55
+ `];
56
+ __decorate([
57
+ (0, decorators_js_1.property)({ type: Object })
58
+ ], ToolbarButton.prototype, "item", void 0);
59
+ exports.ToolbarButton = ToolbarButton = __decorate([
60
+ (0, decorators_js_1.customElement)('og-toolbar-button')
61
+ ], ToolbarButton);
62
+ //# sourceMappingURL=toolbarButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"toolbarButton.js","sourceRoot":"","sources":["../../../src/ui/controls/toolbarButton.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,0CAAqD;AACrD,gEAAwC;AACxC,6BAAwC;AACxC,qDAA4D;AAE5D,0CAA0C;AAGnC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,aAAM;IAiBxC;QACC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;IACnB,CAAC;IAED,YAAY;QACX,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;YACnC,cAAO,CAAC,mBAAmB,CAAC,IAAI,EAAE,SAAS,EAAE;gBAC5C,IAAI,EAAE,QAAQ;gBACd,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE;gBACjB,KAAK,EAAE,IAAI,CAAC,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK;aAC1E,CAAC,CAAC;QACJ,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,UAAU,CAAC,YAAyC;QACnD,IAAI,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YAC3C,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;YAC3B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;YAC3B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,iBAAU,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAU,CAAC,MAAM,CAAC,CAAC;YAE/G,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;gBACvB,IAAA,YAAM,EAAC,IAAA,UAAI,EAAA,uBAAuB,IAAI,CAAC,IAAI,CAAC,OAAO,QAAQ,EAAE,IAAI,CAAC,CAAC;YACpE,CAAC;QACF,CAAC;QAED,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAChC,CAAC;;AA5CW,sCAAa;AAElB,oBAAM,GAAG,CAAC,GAAG,aAAM,CAAC,MAAM,EAAE,IAAA,SAAG,EAAA;;;;gBAIvB,mBAAS,CAAC,2BAA2B;aACxC,mBAAS,CAAC,2BAA2B;iBACjC,mBAAS,CAAC,2BAA2B;kBACpC,mBAAS,CAAC,2BAA2B;;;EAGrD,CAAC,AAVW,CAUV;AAGH;IADC,IAAA,wBAAQ,EAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;2CACP;wBAfN,aAAa;IADzB,IAAA,6BAAa,EAAC,mBAAmB,CAAC;GACtB,aAAa,CA8CzB"}
@@ -0,0 +1,15 @@
1
+ import { LitElement } from 'lit';
2
+ import { ToolbarItem } from '../../types';
3
+ import { ColorpickerEvent, Dropdown } from '@omegagrid/core';
4
+ export declare class ToolbarColorPicker extends LitElement {
5
+ static styles: import("lit").CSSResult[];
6
+ item: ToolbarItem;
7
+ value: string;
8
+ dropdown: Dropdown;
9
+ btnContent: HTMLDivElement;
10
+ _onSelect: (e: ColorpickerEvent) => void;
11
+ _onPreview: (e: ColorpickerEvent) => void;
12
+ _onPreviewEnd: (e: ColorpickerEvent) => void;
13
+ render: () => import("lit-html").TemplateResult<1>;
14
+ }
15
+ //# sourceMappingURL=toolbarColorPicker.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"toolbarColorPicker.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/toolbarColorPicker.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,UAAU,EAAQ,MAAM,KAAK,CAAC;AAG5C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAG7D,qBACa,kBAAmB,SAAQ,UAAU;IAEjD,MAAM,CAAC,MAAM,4BA0BV;IAGH,IAAI,EAAE,WAAW,CAAC;IAGlB,KAAK,EAAE,MAAM,CAAC;IAGd,QAAQ,EAAE,QAAQ,CAAC;IAGnB,UAAU,EAAE,cAAc,CAAC;IAE3B,SAAS,MAAO,gBAAgB,UAI/B;IAED,UAAU,MAAO,gBAAgB,UAGhC;IAED,aAAa,MAAO,gBAAgB,UAGnC;IAED,MAAM,6CAmBJ;CAEF"}
@@ -0,0 +1,99 @@
1
+ "use strict";
2
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
3
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
4
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
5
+ 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;
6
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
7
+ };
8
+ var __importDefault = (this && this.__importDefault) || function (mod) {
9
+ return (mod && mod.__esModule) ? mod : { "default": mod };
10
+ };
11
+ Object.defineProperty(exports, "__esModule", { value: true });
12
+ exports.ToolbarColorPicker = void 0;
13
+ const constants_1 = __importDefault(require("../../constants"));
14
+ const lit_1 = require("lit");
15
+ const decorators_js_1 = require("lit/decorators.js");
16
+ const style_map_js_1 = require("lit/directives/style-map.js");
17
+ const core_1 = require("@omegagrid/core");
18
+ let ToolbarColorPicker = class ToolbarColorPicker extends lit_1.LitElement {
19
+ constructor() {
20
+ super(...arguments);
21
+ this._onSelect = (e) => {
22
+ this.btnContent.style.backgroundColor = e.color;
23
+ core_1.actions.dispatchActionEvent(this, 'toolbar', { type: 'select', key: this.item.id, value: e.color });
24
+ this.dropdown.close();
25
+ };
26
+ this._onPreview = (e) => {
27
+ this.btnContent.style.backgroundColor = e.color;
28
+ core_1.actions.dispatchActionEvent(this, 'toolbar', { type: 'preview', key: this.item.id, value: e.color });
29
+ };
30
+ this._onPreviewEnd = (e) => {
31
+ this.btnContent.style.backgroundColor = e.color;
32
+ core_1.actions.dispatchActionEvent(this, 'toolbar', { type: 'previewEnd', key: this.item.id, value: e.color });
33
+ };
34
+ this.render = () => (0, lit_1.html) `
35
+ <og-button mode="toggle" color="gray">
36
+ <div id="btnContent" slot="content" style="${(0, style_map_js_1.styleMap)({ backgroundColor: this.value })}">
37
+ ${this.item.icon ? (0, lit_1.html) `<og-icon .icon="${this.item.icon}"></og-icon>` : ``}
38
+ </div>
39
+ </og-button>
40
+ <og-dropdown
41
+ style="min-width: 14px; flex: 0"
42
+ color="gray"
43
+ alignment="left"
44
+ positionOffset="${-constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}">
45
+ <og-colorpicker
46
+ slot="content"
47
+ @select="${this._onSelect}"
48
+ @preview="${this._onPreview}"
49
+ @previewEnd="${this._onPreviewEnd}"
50
+ @mousedown="${(e) => e.stopPropagation()}">
51
+ </og-colorpicker>
52
+ </og-dropdown>
53
+ `;
54
+ }
55
+ };
56
+ exports.ToolbarColorPicker = ToolbarColorPicker;
57
+ ToolbarColorPicker.styles = [(0, lit_1.css) `
58
+ :host {
59
+ display: flex;
60
+ flex-direction: row;
61
+ max-height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
62
+ }
63
+
64
+ og-button {
65
+ box-sizing: border-box;
66
+ display: block;
67
+ width: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
68
+ height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
69
+ max-height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
70
+ min-width: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
71
+ line-height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
72
+ padding: 0;
73
+ flex: 0;
74
+ }
75
+
76
+ #btnContent {
77
+ width: 20px;
78
+ height: 20px;
79
+ line-height: 20px;
80
+ text-align: center;
81
+ margin-left: 1px;
82
+ }
83
+ `];
84
+ __decorate([
85
+ (0, decorators_js_1.property)({ type: Object })
86
+ ], ToolbarColorPicker.prototype, "item", void 0);
87
+ __decorate([
88
+ (0, decorators_js_1.property)({ type: String })
89
+ ], ToolbarColorPicker.prototype, "value", void 0);
90
+ __decorate([
91
+ (0, decorators_js_1.query)('og-dropdown')
92
+ ], ToolbarColorPicker.prototype, "dropdown", void 0);
93
+ __decorate([
94
+ (0, decorators_js_1.query)('#btnContent')
95
+ ], ToolbarColorPicker.prototype, "btnContent", void 0);
96
+ exports.ToolbarColorPicker = ToolbarColorPicker = __decorate([
97
+ (0, decorators_js_1.customElement)('og-toolbar-colorpicker')
98
+ ], ToolbarColorPicker);
99
+ //# sourceMappingURL=toolbarColorPicker.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"toolbarColorPicker.js","sourceRoot":"","sources":["../../../src/ui/controls/toolbarColorPicker.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,gEAAwC;AACxC,6BAA4C;AAC5C,qDAAmE;AACnE,8DAAuD;AAGvD,0CAA0C;AAGnC,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,gBAAU;IAA3C;;QA0CN,cAAS,GAAG,CAAC,CAAmB,EAAE,EAAE;YACnC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC;YAChD,cAAO,CAAC,mBAAmB,CAAC,IAAI,EAAE,SAAS,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,EAAC,CAAC,CAAC;YAClG,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;QACvB,CAAC,CAAA;QAED,eAAU,GAAG,CAAC,CAAmB,EAAE,EAAE;YACpC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC;YAChD,cAAO,CAAC,mBAAmB,CAAC,IAAI,EAAE,SAAS,EAAE,EAAC,IAAI,EAAE,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,EAAC,CAAC,CAAC;QACpG,CAAC,CAAA;QAED,kBAAa,GAAG,CAAC,CAAmB,EAAE,EAAE;YACvC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC;YAChD,cAAO,CAAC,mBAAmB,CAAC,IAAI,EAAE,SAAS,EAAE,EAAC,IAAI,EAAE,YAAY,EAAE,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,EAAC,CAAC,CAAC;QACvG,CAAC,CAAA;QAED,WAAM,GAAG,GAAG,EAAE,CAAC,IAAA,UAAI,EAAA;;gDAE4B,IAAA,uBAAQ,EAAC,EAAC,eAAe,EAAE,IAAI,CAAC,KAAK,EAAC,CAAC;MACjF,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAA,UAAI,EAAA,mBAAmB,IAAI,CAAC,IAAI,CAAC,IAAI,cAAc,CAAC,CAAC,CAAC,EAAE;;;;;;;qBAO1D,CAAC,mBAAS,CAAC,2BAA2B;;;eAG5C,IAAI,CAAC,SAAS;gBACb,IAAI,CAAC,UAAU;mBACZ,IAAI,CAAC,aAAa;kBACnB,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;;;EAGtD,CAAC;IAEH,CAAC;;AA/EY,gDAAkB;AAEvB,yBAAM,GAAG,CAAC,IAAA,SAAG,EAAA;;;;iBAIJ,mBAAS,CAAC,2BAA2B;;;;;;YAM1C,mBAAS,CAAC,2BAA2B;aACpC,mBAAS,CAAC,2BAA2B;iBACjC,mBAAS,CAAC,2BAA2B;gBACtC,mBAAS,CAAC,2BAA2B;kBACnC,mBAAS,CAAC,2BAA2B;;;;;;;;;;;;EAYrD,CAAC,AA1BW,CA0BV;AAGH;IADC,IAAA,wBAAQ,EAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;gDACP;AAGlB;IADC,IAAA,wBAAQ,EAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;iDACX;AAGd;IADC,IAAA,qBAAK,EAAC,aAAa,CAAC;oDACF;AAGnB;IADC,IAAA,qBAAK,EAAC,aAAa,CAAC;sDACM;6BAxCf,kBAAkB;IAD9B,IAAA,6BAAa,EAAC,wBAAwB,CAAC;GAC3B,kBAAkB,CA+E9B"}
@@ -0,0 +1,13 @@
1
+ import { LitElement } from 'lit';
2
+ import { ToolbarItem } from '../../types';
3
+ import { TreeDropdown } from '@omegagrid/tree';
4
+ export declare class ToolbarDropdown extends LitElement {
5
+ static styles: import("lit").CSSResult[];
6
+ tree: TreeDropdown;
7
+ item: ToolbarItem;
8
+ value: string;
9
+ updated(): void;
10
+ _onChange: () => void;
11
+ render: () => import("lit-html").TemplateResult<1>;
12
+ }
13
+ //# sourceMappingURL=toolbarDropdown.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"toolbarDropdown.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/toolbarDropdown.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAA2C,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAGxF,qBAEa,eAAgB,SAAQ,UAAU;IAE9C,MAAM,CAAC,MAAM,4BAMV;IAGH,IAAI,EAAE,YAAY,CAAC;IAGnB,IAAI,EAAE,WAAW,CAAC;IAGlB,KAAK,EAAE,MAAM,CAAC;IAEd,OAAO;IAYP,SAAS,aASR;IAED,MAAM,6CAOJ;CAEF"}
@@ -0,0 +1,74 @@
1
+ "use strict";
2
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
3
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
4
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
5
+ 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;
6
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
7
+ };
8
+ var __importDefault = (this && this.__importDefault) || function (mod) {
9
+ return (mod && mod.__esModule) ? mod : { "default": mod };
10
+ };
11
+ Object.defineProperty(exports, "__esModule", { value: true });
12
+ exports.ToolbarDropdown = void 0;
13
+ const core_1 = require("@omegagrid/core");
14
+ const constants_1 = __importDefault(require("../../constants"));
15
+ const lit_1 = require("lit");
16
+ const decorators_js_1 = require("lit/decorators.js");
17
+ const tree_1 = require("@omegagrid/tree");
18
+ const core_2 = require("@omegagrid/core");
19
+ let ToolbarDropdown = class ToolbarDropdown extends lit_1.LitElement {
20
+ constructor() {
21
+ super(...arguments);
22
+ this._onChange = () => {
23
+ this.tree.close();
24
+ const serializedValue = this.tree.value;
25
+ this.value = serializedValue && serializedValue[0] && serializedValue[0][0] ? serializedValue[0][0] : null;
26
+ core_2.actions.dispatchActionEvent(this, 'toolbar', {
27
+ type: 'change',
28
+ key: this.item.id,
29
+ value: this.value
30
+ });
31
+ };
32
+ this.render = () => (0, lit_1.html) `
33
+ <og-tree-dropdown
34
+ color="gray"
35
+ @change="${this._onChange}"
36
+ .caption="${this.item.caption}"
37
+ .value="${this.value == null ? null : [[this.value, 0, 1]]}">
38
+ </og-tree-dropdown>
39
+ `;
40
+ }
41
+ updated() {
42
+ if (this.item.width)
43
+ core_1.dom.setSize(this.tree, { w: this.item.width });
44
+ this.tree.setSourceData(this.item.items, {
45
+ globalLevels: false,
46
+ selectMode: tree_1.SelectMode.Single,
47
+ checkboxes: false,
48
+ expanders: false,
49
+ allowEmpty: false
50
+ });
51
+ }
52
+ };
53
+ exports.ToolbarDropdown = ToolbarDropdown;
54
+ ToolbarDropdown.styles = [(0, lit_1.css) `
55
+ :host {
56
+ display: flex;
57
+ flex-direction: row;
58
+ height: ${constants_1.default.TOOLBAR_COMPONENT_SIZE_BASE}px;
59
+ }
60
+ `];
61
+ __decorate([
62
+ (0, decorators_js_1.query)('og-tree-dropdown')
63
+ ], ToolbarDropdown.prototype, "tree", void 0);
64
+ __decorate([
65
+ (0, decorators_js_1.property)({ type: Object })
66
+ ], ToolbarDropdown.prototype, "item", void 0);
67
+ __decorate([
68
+ (0, decorators_js_1.property)({ type: String })
69
+ ], ToolbarDropdown.prototype, "value", void 0);
70
+ exports.ToolbarDropdown = ToolbarDropdown = __decorate([
71
+ (0, decorators_js_1.customElement)('og-toolbar-dropdown'),
72
+ (0, core_1.stylable)({ vars: ['background-color-2'] })
73
+ ], ToolbarDropdown);
74
+ //# sourceMappingURL=toolbarDropdown.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"toolbarDropdown.js","sourceRoot":"","sources":["../../../src/ui/controls/toolbarDropdown.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,0CAAgD;AAChD,gEAAwC;AACxC,6BAA4C;AAC5C,qDAAmE;AAEnE,0CAAwF;AACxF,0CAA0C;AAInC,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,gBAAU;IAAxC;;QA+BN,cAAS,GAAG,GAAG,EAAE;YAChB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAClB,MAAM,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;YACxC,IAAI,CAAC,KAAK,GAAG,eAAe,IAAI,eAAe,CAAC,CAAC,CAAC,IAAI,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;YAC3G,cAAO,CAAC,mBAAmB,CAAC,IAAI,EAAE,SAAS,EAAE;gBAC5C,IAAI,EAAE,QAAQ;gBACd,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE;gBACjB,KAAK,EAAE,IAAI,CAAC,KAAK;aACjB,CAAC,CAAC;QACJ,CAAC,CAAA;QAED,WAAM,GAAG,GAAG,EAAE,CAAC,IAAA,UAAI,EAAA;;;cAGN,IAAI,CAAC,SAAS;eACb,IAAI,CAAC,IAAI,CAAC,OAAO;aACnB,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAsB;;EAEhF,CAAC;IAEH,CAAC;IAhCA,OAAO;QACN,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE,UAAG,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,EAAC,CAAC,CAAC;QAElE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,KAAqB,EAAE;YACxD,YAAY,EAAE,KAAK;YACnB,UAAU,EAAE,iBAAU,CAAC,MAAM;YAC7B,UAAU,EAAE,KAAK;YACjB,SAAS,EAAE,KAAK;YAChB,UAAU,EAAE,KAAK;SACjB,CAAC,CAAC;IACJ,CAAC;;AA7BW,0CAAe;AAEpB,sBAAM,GAAG,CAAC,IAAA,SAAG,EAAA;;;;aAIR,mBAAS,CAAC,2BAA2B;;EAEhD,CAAC,AANW,CAMV;AAGH;IADC,IAAA,qBAAK,EAAC,kBAAkB,CAAC;6CACP;AAGnB;IADC,IAAA,wBAAQ,EAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACP;AAGlB;IADC,IAAA,wBAAQ,EAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;8CACX;0BAjBF,eAAe;IAF3B,IAAA,6BAAa,EAAC,qBAAqB,CAAC;IACpC,IAAA,eAAQ,EAAC,EAAC,IAAI,EAAE,CAAC,oBAAoB,CAAC,EAAC,CAAC;GAC5B,eAAe,CAmD3B"}
@@ -0,0 +1,19 @@
1
+ import { Dropdown } from '@omegagrid/core';
2
+ import { LitElement } from 'lit';
3
+ import { ToolbarItem } from '../../types';
4
+ import { ToolbarGrid } from './toolbarGrid';
5
+ import { ToolbarButton } from './toolbarButton';
6
+ export declare class ToolbarDropdownButton extends LitElement {
7
+ static styles: import("lit").CSSResult[];
8
+ gridRef: import("lit-html/directives/ref.js").Ref<ToolbarGrid>;
9
+ get grid(): ToolbarGrid;
10
+ dropdownRef: import("lit-html/directives/ref.js").Ref<Dropdown>;
11
+ get dropdown(): Dropdown;
12
+ button: ToolbarButton;
13
+ item: ToolbarItem;
14
+ currentItem: ToolbarItem;
15
+ willUpdate(): void;
16
+ firstUpdated(): void;
17
+ render: () => import("lit-html").TemplateResult<1>;
18
+ }
19
+ //# sourceMappingURL=toolbarDropdownButton.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"toolbarDropdownButton.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/toolbarDropdownButton.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,QAAQ,EAAY,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,qBAEa,qBAAsB,SAAQ,UAAU;IAEpD,MAAM,CAAC,MAAM,4BAgBV;IAEH,OAAO,wDAA4B;IACnC,IAAI,IAAI,gBAAgC;IAExC,WAAW,qDAAyB;IACpC,IAAI,QAAQ,aAAoC;IAGhD,MAAM,EAAE,aAAa,CAAC;IAGtB,IAAI,EAAE,WAAW,CAAC;IAGlB,WAAW,EAAE,WAAW,CAAC;IAEzB,UAAU;IAQV,YAAY;IAiCZ,MAAM,6CAiBJ;CAEF"}