@omegagrid/editor 0.10.2 → 0.10.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 (141) hide show
  1. package/dist/commands/index.d.ts +3 -0
  2. package/dist/commands/index.d.ts.map +1 -0
  3. package/dist/commands/index.js +34 -0
  4. package/dist/commands/index.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 +2 -0
  8. package/dist/index.js.map +1 -0
  9. package/dist/options.d.ts +12 -0
  10. package/dist/options.d.ts.map +1 -0
  11. package/dist/options.js +14 -0
  12. package/dist/options.js.map +1 -0
  13. package/dist/ui/editor.d.ts +76 -0
  14. package/dist/ui/editor.d.ts.map +1 -0
  15. package/dist/ui/editor.js +338 -0
  16. package/dist/ui/editor.js.map +1 -0
  17. package/dist/ui/editor.style.d.ts +2 -0
  18. package/dist/ui/editor.style.d.ts.map +1 -0
  19. package/dist/ui/editor.style.js +38 -0
  20. package/dist/ui/editor.style.js.map +1 -0
  21. package/dist/ui/editorZoom.d.ts +16 -0
  22. package/dist/ui/editorZoom.d.ts.map +1 -0
  23. package/dist/ui/editorZoom.js +82 -0
  24. package/dist/ui/editorZoom.js.map +1 -0
  25. package/dist/ui/editors/hyperlinkEditor.d.ts +10 -0
  26. package/dist/ui/editors/hyperlinkEditor.d.ts.map +1 -0
  27. package/dist/ui/editors/hyperlinkEditor.js +70 -0
  28. package/dist/ui/editors/hyperlinkEditor.js.map +1 -0
  29. package/dist/ui/editors/index.d.ts +6 -0
  30. package/dist/ui/editors/index.d.ts.map +1 -0
  31. package/dist/ui/editors/index.js +6 -0
  32. package/dist/ui/editors/index.js.map +1 -0
  33. package/dist/ui/editors/ruleEditor.d.ts +27 -0
  34. package/dist/ui/editors/ruleEditor.d.ts.map +1 -0
  35. package/dist/ui/editors/ruleEditor.js +251 -0
  36. package/dist/ui/editors/ruleEditor.js.map +1 -0
  37. package/dist/ui/editors/styleEditor.d.ts +14 -0
  38. package/dist/ui/editors/styleEditor.d.ts.map +1 -0
  39. package/dist/ui/editors/styleEditor.js +160 -0
  40. package/dist/ui/editors/styleEditor.js.map +1 -0
  41. package/dist/ui/editors/themeEditor.d.ts +24 -0
  42. package/dist/ui/editors/themeEditor.d.ts.map +1 -0
  43. package/dist/ui/editors/themeEditor.js +138 -0
  44. package/dist/ui/editors/themeEditor.js.map +1 -0
  45. package/dist/ui/editors/themeItemEditor.d.ts +22 -0
  46. package/dist/ui/editors/themeItemEditor.d.ts.map +1 -0
  47. package/dist/ui/editors/themeItemEditor.js +181 -0
  48. package/dist/ui/editors/themeItemEditor.js.map +1 -0
  49. package/dist/ui/forms/configForm.d.ts +12 -0
  50. package/dist/ui/forms/configForm.d.ts.map +1 -0
  51. package/dist/ui/forms/configForm.js +101 -0
  52. package/dist/ui/forms/configForm.js.map +1 -0
  53. package/dist/ui/forms/headerForm.d.ts +18 -0
  54. package/dist/ui/forms/headerForm.d.ts.map +1 -0
  55. package/dist/ui/forms/headerForm.js +144 -0
  56. package/dist/ui/forms/headerForm.js.map +1 -0
  57. package/dist/ui/forms/index.d.ts +9 -0
  58. package/dist/ui/forms/index.d.ts.map +1 -0
  59. package/dist/ui/forms/index.js +9 -0
  60. package/dist/ui/forms/index.js.map +1 -0
  61. package/dist/ui/forms/namesForm.d.ts +21 -0
  62. package/dist/ui/forms/namesForm.d.ts.map +1 -0
  63. package/dist/ui/forms/namesForm.js +124 -0
  64. package/dist/ui/forms/namesForm.js.map +1 -0
  65. package/dist/ui/forms/ruleForm.d.ts +13 -0
  66. package/dist/ui/forms/ruleForm.d.ts.map +1 -0
  67. package/dist/ui/forms/ruleForm.js +56 -0
  68. package/dist/ui/forms/ruleForm.js.map +1 -0
  69. package/dist/ui/forms/ruleForm.style.d.ts +2 -0
  70. package/dist/ui/forms/ruleForm.style.d.ts.map +1 -0
  71. package/dist/ui/forms/ruleForm.style.js +50 -0
  72. package/dist/ui/forms/ruleForm.style.js.map +1 -0
  73. package/dist/ui/forms/ruleFormThreshold.d.ts +19 -0
  74. package/dist/ui/forms/ruleFormThreshold.d.ts.map +1 -0
  75. package/dist/ui/forms/ruleFormThreshold.js +97 -0
  76. package/dist/ui/forms/ruleFormThreshold.js.map +1 -0
  77. package/dist/ui/forms/ruleList.d.ts +25 -0
  78. package/dist/ui/forms/ruleList.d.ts.map +1 -0
  79. package/dist/ui/forms/ruleList.js +169 -0
  80. package/dist/ui/forms/ruleList.js.map +1 -0
  81. package/dist/ui/forms/ruleList.style.d.ts +3 -0
  82. package/dist/ui/forms/ruleList.style.d.ts.map +1 -0
  83. package/dist/ui/forms/ruleList.style.js +69 -0
  84. package/dist/ui/forms/ruleList.style.js.map +1 -0
  85. package/dist/ui/forms/sparklineForm.d.ts +22 -0
  86. package/dist/ui/forms/sparklineForm.d.ts.map +1 -0
  87. package/dist/ui/forms/sparklineForm.js +199 -0
  88. package/dist/ui/forms/sparklineForm.js.map +1 -0
  89. package/dist/ui/forms/sparklineForm.style.d.ts +3 -0
  90. package/dist/ui/forms/sparklineForm.style.d.ts.map +1 -0
  91. package/dist/ui/forms/sparklineForm.style.js +94 -0
  92. package/dist/ui/forms/sparklineForm.style.js.map +1 -0
  93. package/dist/ui/forms/styleForm.d.ts +14 -0
  94. package/dist/ui/forms/styleForm.d.ts.map +1 -0
  95. package/dist/ui/forms/styleForm.js +151 -0
  96. package/dist/ui/forms/styleForm.js.map +1 -0
  97. package/dist/ui/formulabar.d.ts +23 -0
  98. package/dist/ui/formulabar.d.ts.map +1 -0
  99. package/dist/ui/formulabar.js +155 -0
  100. package/dist/ui/formulabar.js.map +1 -0
  101. package/dist/ui/formulabar.style.d.ts +2 -0
  102. package/dist/ui/formulabar.style.d.ts.map +1 -0
  103. package/dist/ui/formulabar.style.js +48 -0
  104. package/dist/ui/formulabar.style.js.map +1 -0
  105. package/dist/ui/gridStats.d.ts +11 -0
  106. package/dist/ui/gridStats.d.ts.map +1 -0
  107. package/dist/ui/gridStats.js +71 -0
  108. package/dist/ui/gridStats.js.map +1 -0
  109. package/dist/ui/index.d.ts +11 -0
  110. package/dist/ui/index.d.ts.map +1 -0
  111. package/dist/ui/index.js +11 -0
  112. package/dist/ui/index.js.map +1 -0
  113. package/dist/ui/sidebars/baseSidebar.d.ts +10 -0
  114. package/dist/ui/sidebars/baseSidebar.d.ts.map +1 -0
  115. package/dist/ui/sidebars/baseSidebar.js +24 -0
  116. package/dist/ui/sidebars/baseSidebar.js.map +1 -0
  117. package/dist/ui/sidebars/index.d.ts +2 -0
  118. package/dist/ui/sidebars/index.d.ts.map +1 -0
  119. package/dist/ui/sidebars/index.js +2 -0
  120. package/dist/ui/sidebars/index.js.map +1 -0
  121. package/dist/ui/sidebars/themeEditorSidebar.d.ts +14 -0
  122. package/dist/ui/sidebars/themeEditorSidebar.d.ts.map +1 -0
  123. package/dist/ui/sidebars/themeEditorSidebar.js +110 -0
  124. package/dist/ui/sidebars/themeEditorSidebar.js.map +1 -0
  125. package/dist/ui/statusbar.d.ts +19 -0
  126. package/dist/ui/statusbar.d.ts.map +1 -0
  127. package/dist/ui/statusbar.js +69 -0
  128. package/dist/ui/statusbar.js.map +1 -0
  129. package/dist/ui/toolbar.config.d.ts +7 -0
  130. package/dist/ui/toolbar.config.d.ts.map +1 -0
  131. package/dist/ui/toolbar.config.js +166 -0
  132. package/dist/ui/toolbar.config.js.map +1 -0
  133. package/dist/ui/toolbar.d.ts +42 -0
  134. package/dist/ui/toolbar.d.ts.map +1 -0
  135. package/dist/ui/toolbar.js +356 -0
  136. package/dist/ui/toolbar.js.map +1 -0
  137. package/dist/ui/toolbar.style.d.ts +2 -0
  138. package/dist/ui/toolbar.style.d.ts.map +1 -0
  139. package/dist/ui/toolbar.style.js +22 -0
  140. package/dist/ui/toolbar.style.js.map +1 -0
  141. package/package.json +10 -10
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ruleForm.style.js","sourceRoot":"","sources":["../../../src/ui/forms/ruleForm.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+CvB,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: block;\n\t}\n\n\t.p {\n\t\tpadding: 5px;\n\t}\n\n\t.row {\n\t\tline-height: 22px;\n\t}\n\n\tog-dropdown-list, og-dropdown-colorpicker {\n\t\theight: 22px;\n\t}\n\n\tog-input {\n\t\tdisplay: block;\n\t}\n\n\t.item-content {\n\t\theight: 100%;\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t}\n\n\t.item-form {\n\t\tflex: 1;\n\t}\n\n\t.item-controls {\n\t\tflex: 0;\n\t\tpadding: 0 2px;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: 2px;\n\t}\n\t\n\t.item-controls og-button {\n\t\twidth: 24px;\n\t\tdisplay: block;\n\t}\n`;"]}
@@ -0,0 +1,19 @@
1
+ import { ConditionalFormatThreshold, ConditionalFormatThresholdType } from '@omegagrid/grid';
2
+ import { LitElement } from 'lit';
3
+ import { DropdownList, NumericInput, events } from '@omegagrid/core';
4
+ type ThreadsholdType = ConditionalFormatThresholdType | 'auto';
5
+ export declare class RuleThreshold extends LitElement {
6
+ static styles: import("lit").CSSResult;
7
+ value: ConditionalFormatThreshold;
8
+ first: boolean;
9
+ allowedTypes: ThreadsholdType[];
10
+ typeInput: DropdownList;
11
+ valueInput: NumericInput;
12
+ get isDisabled(): boolean;
13
+ get format(): string;
14
+ _onTypeChange: (e: events.ChangeEvent) => void;
15
+ _onChange: () => void;
16
+ render: () => import("lit-html").TemplateResult<1>;
17
+ }
18
+ export {};
19
+ //# sourceMappingURL=ruleFormThreshold.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ruleFormThreshold.d.ts","sourceRoot":"","sources":["../../../src/ui/forms/ruleFormThreshold.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,8BAA8B,EAAE,MAAM,iBAAiB,CAAC;AAC7F,OAAO,EAAa,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAErE,KAAK,eAAe,GAAG,8BAA8B,GAAG,MAAM,CAAC;AAa/D,qBACa,aAAc,SAAQ,UAAU;IAE5C,MAAM,CAAC,MAAM,0BAkBX;IAGF,KAAK,EAAE,0BAA0B,CAAC;IAGlC,KAAK,UAAS;IAGd,YAAY,EAAE,eAAe,EAAE,CAAsB;IAGrD,SAAS,EAAE,YAAY,CAAC;IAGxB,UAAU,EAAE,YAAY,CAAC;IAEzB,IAAI,UAAU,YAAiG;IAE/G,IAAI,MAAM,WAAwD;IAElE,aAAa,GAAI,GAAG,MAAM,CAAC,WAAW,UAMrC;IAED,SAAS,aAGR;IAED,MAAM,6CAkBJ;CACF"}
@@ -0,0 +1,97 @@
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
+ import { customElement, property, query } from 'lit/decorators.js';
8
+ import { css, html, LitElement } from 'lit';
9
+ import { events } from '@omegagrid/core';
10
+ const threasholdTypes = [
11
+ { key: 'auto', value: 'automatic' },
12
+ { key: 'num', value: 'number' },
13
+ { key: 'percent', value: 'percent' }
14
+ ];
15
+ const formatMap = {
16
+ 'num': '#,##0.00',
17
+ 'percent': '#,##0.00" %"',
18
+ };
19
+ let RuleThreshold = class RuleThreshold extends LitElement {
20
+ constructor() {
21
+ super(...arguments);
22
+ this.first = false;
23
+ this.allowedTypes = ['num', 'percent'];
24
+ this._onTypeChange = (e) => {
25
+ if (e.value === 'auto') {
26
+ this.value = null;
27
+ }
28
+ else if (formatMap[e.value]) {
29
+ this.value = { t: e.value, v: this.value?.v || 0 };
30
+ }
31
+ };
32
+ this._onChange = () => {
33
+ this.value = { t: this.typeInput.value, v: this.valueInput.value };
34
+ this.dispatchEvent(new events.ChangeEvent(this.value));
35
+ };
36
+ this.render = () => html `
37
+ <og-dropdown-list
38
+ id="type"
39
+ style="flex: 0; min-width: 100px"
40
+ .items="${threasholdTypes.filter(item => this.allowedTypes.includes(item.key))}"
41
+ .value="${this.value?.t || 'auto'}"
42
+ @change="${this._onTypeChange}">
43
+ </og-dropdown-list>
44
+
45
+ <og-numericinput
46
+ buttons
47
+ ?disabled="${this.isDisabled}"
48
+ .value="${this.value?.v}"
49
+ format="${this.format}"
50
+ id="value"
51
+ @change="${this._onChange}"
52
+ style="flex: 1">
53
+ </og-numericinput>
54
+ `;
55
+ }
56
+ get isDisabled() { return (this.first && this.value?.t === 'percent') || (this.value?.t || 'auto') === 'auto'; }
57
+ get format() { return this.value ? formatMap[this.value.t] : '0'; }
58
+ };
59
+ RuleThreshold.styles = css `
60
+ * {
61
+ box-sizing: border-box;
62
+ }
63
+
64
+ :host {
65
+ display: flex;
66
+ flex-direction: row;
67
+ gap: 2px;
68
+ }
69
+
70
+ og-dropdown-list {
71
+ height: 100%;
72
+ }
73
+
74
+ og-form-numericinput {
75
+ height: 100%;
76
+ }
77
+ `;
78
+ __decorate([
79
+ property({ type: Object })
80
+ ], RuleThreshold.prototype, "value", void 0);
81
+ __decorate([
82
+ property({ type: Boolean })
83
+ ], RuleThreshold.prototype, "first", void 0);
84
+ __decorate([
85
+ property({ type: Array })
86
+ ], RuleThreshold.prototype, "allowedTypes", void 0);
87
+ __decorate([
88
+ query('og-dropdown-list#type')
89
+ ], RuleThreshold.prototype, "typeInput", void 0);
90
+ __decorate([
91
+ query('og-numericinput#value')
92
+ ], RuleThreshold.prototype, "valueInput", void 0);
93
+ RuleThreshold = __decorate([
94
+ customElement('og-editor-rule-threshold')
95
+ ], RuleThreshold);
96
+ export { RuleThreshold };
97
+ //# sourceMappingURL=ruleFormThreshold.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ruleFormThreshold.js","sourceRoot":"","sources":["../../../src/ui/forms/ruleFormThreshold.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, query } from 'lit/decorators.js';\nimport { ConditionalFormatThreshold, ConditionalFormatThresholdType } from '@omegagrid/grid';\nimport { css, html, LitElement } from 'lit';\nimport { DropdownList, NumericInput, events } from '@omegagrid/core';\n\ntype ThreadsholdType = ConditionalFormatThresholdType | 'auto';\n\nconst threasholdTypes: {key: ThreadsholdType, value: string}[] = [\n\t{key: 'auto', value: 'automatic'},\n\t{key: 'num', value: 'number'},\n\t{key: 'percent', value: 'percent'}\n];\n\nconst formatMap: Partial<Record<ConditionalFormatThresholdType, string>> = {\n\t'num': '#,##0.00',\n\t'percent': '#,##0.00\" %\"',\n};\n\n@customElement('og-editor-rule-threshold')\nexport class RuleThreshold extends LitElement {\n\n\tstatic styles = css`\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: row;\n\t\t\tgap: 2px;\n\t\t}\n\n\t\tog-dropdown-list {\n\t\t\theight: 100%;\n\t\t}\n\n\t\tog-form-numericinput {\n\t\t\theight: 100%;\n\t\t}\n\t`;\n\n\t@property({type: Object})\n\tvalue: ConditionalFormatThreshold;\n\n\t@property({type: Boolean})\n\tfirst = false;\n\n\t@property({type: Array})\n\tallowedTypes: ThreadsholdType[] = ['num', 'percent'];\n\n\t@query('og-dropdown-list#type')\n\ttypeInput: DropdownList;\n\n\t@query('og-numericinput#value')\n\tvalueInput: NumericInput;\n\n\tget isDisabled() { return (this.first && this.value?.t === 'percent') || (this.value?.t || 'auto') === 'auto' }\n\n\tget format() { return this.value ? formatMap[this.value.t] : '0' }\n\n\t_onTypeChange = (e: events.ChangeEvent) => {\n\t\tif (e.value === 'auto') {\n\t\t\tthis.value = null;\n\t\t} else if (formatMap[e.value as ConditionalFormatThresholdType]) {\n\t\t\tthis.value = {t: e.value as ConditionalFormatThresholdType, v: this.value?.v || 0};\n\t\t}\n\t}\n\n\t_onChange = () => {\n\t\tthis.value = {t: this.typeInput.value as ConditionalFormatThresholdType, v: this.valueInput.value};\n\t\tthis.dispatchEvent(new events.ChangeEvent(this.value));\n\t}\n\n\trender = () => html`\n\t\t<og-dropdown-list\n\t\t\tid=\"type\"\n\t\t\tstyle=\"flex: 0; min-width: 100px\"\n\t\t\t.items=\"${threasholdTypes.filter(item => this.allowedTypes.includes(item.key))}\"\n\t\t\t.value=\"${this.value?.t || 'auto'}\"\n\t\t\t@change=\"${this._onTypeChange}\">\n\t\t</og-dropdown-list>\n\n\t\t<og-numericinput\n\t\t\tbuttons\n\t\t\t?disabled=\"${this.isDisabled}\"\n\t\t\t.value=\"${this.value?.v}\"\n\t\t\tformat=\"${this.format}\"\n\t\t\tid=\"value\"\n\t\t\t@change=\"${this._onChange}\"\n\t\t\tstyle=\"flex: 1\">\n\t\t</og-numericinput>\n\t`;\n}\n"]}
@@ -0,0 +1,25 @@
1
+ import { List } from '@omegagrid/core';
2
+ import { ConditionalFormat, ConditionalFormatType, Grid, GridModel } from '@omegagrid/grid';
3
+ import { LitElement } from 'lit';
4
+ import { events } from '@omegagrid/core';
5
+ export declare class RuleList extends LitElement {
6
+ static styles: import("lit").CSSResult[];
7
+ grid: Grid;
8
+ model: GridModel;
9
+ list: List;
10
+ connectedCallback(): void;
11
+ updateList: () => void;
12
+ moveRuleUp(index: number): void;
13
+ moveRuleDown(index: number): void;
14
+ deleteRule(index: number): void;
15
+ toggleRuleStop(index: number): void;
16
+ addRule(): void;
17
+ _onApplyClick: () => void;
18
+ _onInputChange(e: Event, format: ConditionalFormat): void;
19
+ _onStyleChange(e: events.ChangeEvent, format: ConditionalFormat): void;
20
+ getFormatByIndex(index: number): ConditionalFormat;
21
+ changeType(index: number, type: ConditionalFormatType): void;
22
+ _itemRenderer: (_div: HTMLDivElement, index: number) => import("lit-html").TemplateResult<1>;
23
+ render: () => "" | import("lit-html").TemplateResult<1>;
24
+ }
25
+ //# sourceMappingURL=ruleList.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ruleList.d.ts","sourceRoot":"","sources":["../../../src/ui/forms/ruleList.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,IAAI,EAAa,MAAM,iBAAiB,CAAC;AAEzD,OAAO,EAAa,iBAAiB,EAAE,qBAAqB,EAAE,IAAI,EAAE,SAAS,EAAS,MAAM,iBAAiB,CAAC;AAC9G,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AASzC,qBACa,QAAS,SAAQ,UAAU;IAEvC,MAAM,CAAC,MAAM,4BAAW;IAGxB,IAAI,EAAE,IAAI,CAAC;IAGX,KAAK,EAAE,SAAS,CAAC;IAGjB,IAAI,EAAE,IAAI,CAAC;IAEX,iBAAiB;IAIjB,UAAU,aAGT;IAED,UAAU,CAAC,KAAK,EAAE,MAAM;IAOxB,YAAY,CAAC,KAAK,EAAE,MAAM;IAO1B,UAAU,CAAC,KAAK,EAAE,MAAM;IAMxB,cAAc,CAAC,KAAK,EAAE,MAAM;IAM5B,OAAO;IAMP,aAAa,aAGZ;IAED,cAAc,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,iBAAiB;IAQlD,cAAc,CAAC,CAAC,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,EAAE,iBAAiB;IAI/D,gBAAgB,CAAC,KAAK,EAAE,MAAM;IAI9B,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,qBAAqB;IAMrD,aAAa,GAAI,MAAM,cAAc,EAAE,OAAO,MAAM,0CAiDlD;IAEF,MAAM,kDAkBC;CACP"}
@@ -0,0 +1,169 @@
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
+ import { constants } from '@omegagrid/core';
8
+ import { customElement, property, query } from 'lit/decorators.js';
9
+ import { CellRange } from '@omegagrid/grid';
10
+ import { html, LitElement } from 'lit';
11
+ import { itemStyle, style } from './ruleList.style';
12
+ import { msg } from '@omegagrid/localize';
13
+ const ruleTypes = {
14
+ 'formula': 'Formula',
15
+ 'scale': 'Scale',
16
+ 'bar': 'Data Bar',
17
+ 'icon': 'Icon Set',
18
+ };
19
+ let RuleList = class RuleList extends LitElement {
20
+ constructor() {
21
+ super(...arguments);
22
+ this.updateList = () => {
23
+ this.list.size = this.model.conditionalFormats.formats.length;
24
+ this.list.renderItems(true);
25
+ };
26
+ this._onApplyClick = () => {
27
+ this.model.clearCalculatedStyles();
28
+ this.grid.rendering.render(false);
29
+ };
30
+ this._itemRenderer = (_div, index) => html `
31
+ <div class="header" style="padding-right: ${constants.SLIDER_SIZE}px">
32
+ <div>Rule #${index + 1}</div>
33
+
34
+ <div>
35
+ <og-dropdown-list
36
+ .value = "${this.getFormatByIndex(index).type}"
37
+ .items="${Object.entries(ruleTypes).map(e => ({ key: e[0], value: e[1] }))}"
38
+ @change="${(e) => this.changeType(index, e.value)}">
39
+ </og-dropdown-list>
40
+ </div>
41
+
42
+ <div>
43
+ <og-dropdown-menu
44
+ noCaret
45
+ dynamicWidth
46
+ alignment="right"
47
+ icon="bars"
48
+ .items="${[{
49
+ key: 'stop',
50
+ value: msg('Stop if true'),
51
+ icon: this.getFormatByIndex(index).stop ? 'square-check' : 'square',
52
+ exec: () => this.toggleRuleStop(index)
53
+ }, {
54
+ key: 'moveUp',
55
+ value: msg('Move up'),
56
+ icon: 'arrow-up',
57
+ exec: () => this.moveRuleUp(index)
58
+ }, {
59
+ key: 'moveDown',
60
+ value: msg('Move down'),
61
+ icon: 'arrow-down',
62
+ exec: () => this.moveRuleDown(index)
63
+ }, {
64
+ key: 'delete',
65
+ value: msg('Delete'),
66
+ icon: 'trash',
67
+ color: 'red',
68
+ exec: () => this.deleteRule(index)
69
+ }]}">
70
+ </og-dropdown-menu>
71
+ </div>
72
+ </div>
73
+ <div style="padding-right: ${constants.SLIDER_SIZE}px">
74
+ <og-editor-form-rule
75
+ .format="${this.getFormatByIndex(index)}"
76
+ .model="${this.model}">
77
+ </og-editor-form-rule>
78
+ </div>
79
+ `;
80
+ this.render = () => this.model ? html `
81
+ <div class="controls p">
82
+ <og-button text="+" @click="${() => this.addRule()}"></og-button>
83
+ <og-button @click="${this._onApplyClick}">
84
+ <div slot="content"><og-icon icon="refresh"></og-icon> ${msg('Apply')}</div>
85
+ </og-button>
86
+ </div>
87
+ <div class="body">
88
+ <og-list
89
+ disabledSelect
90
+ dynamicItemHeight
91
+ ?nativeHeight="${true}"
92
+ itemHeight="170"
93
+ .customStyle=${itemStyle}
94
+ .itemRenderer="${this._itemRenderer}"
95
+ .size="${this.model.conditionalFormats.formats.length}">
96
+ </og-list>
97
+ </div>
98
+ ` : '';
99
+ }
100
+ connectedCallback() {
101
+ super.connectedCallback();
102
+ }
103
+ moveRuleUp(index) {
104
+ if (index == 0)
105
+ return;
106
+ const formats = this.model.conditionalFormats.formats;
107
+ formats.splice(index - 1, 0, formats.splice(index, 1)[0]);
108
+ this.updateList();
109
+ }
110
+ moveRuleDown(index) {
111
+ const formats = this.model.conditionalFormats.formats;
112
+ if (index >= formats.length)
113
+ return;
114
+ formats.splice(index + 1, 0, formats.splice(index, 1)[0]);
115
+ this.updateList();
116
+ }
117
+ deleteRule(index) {
118
+ const formats = this.model.conditionalFormats.formats;
119
+ formats.splice(index, 1);
120
+ this.updateList();
121
+ }
122
+ toggleRuleStop(index) {
123
+ const format = this.getFormatByIndex(index);
124
+ format.stop = !format.stop;
125
+ this.updateList();
126
+ }
127
+ addRule() {
128
+ const formats = this.model.conditionalFormats.formats;
129
+ formats.push({});
130
+ this.updateList();
131
+ }
132
+ _onInputChange(e, format) {
133
+ const input = e.target;
134
+ switch (input.dataset.id) {
135
+ case 'ranges':
136
+ format.ranges = CellRange.fromA1s(input.value);
137
+ break;
138
+ case 'condition':
139
+ format.condition = input.value;
140
+ break;
141
+ }
142
+ }
143
+ _onStyleChange(e, format) {
144
+ format.style = this.model.styles.add(e.value);
145
+ }
146
+ getFormatByIndex(index) {
147
+ return this.model.conditionalFormats.formats[index];
148
+ }
149
+ changeType(index, type) {
150
+ const format = this.getFormatByIndex(index);
151
+ format.type = type;
152
+ this.updateList();
153
+ }
154
+ };
155
+ RuleList.styles = [style];
156
+ __decorate([
157
+ property({ type: Object })
158
+ ], RuleList.prototype, "grid", void 0);
159
+ __decorate([
160
+ property({ type: Object })
161
+ ], RuleList.prototype, "model", void 0);
162
+ __decorate([
163
+ query('og-list')
164
+ ], RuleList.prototype, "list", void 0);
165
+ RuleList = __decorate([
166
+ customElement('og-editor-rules')
167
+ ], RuleList);
168
+ export { RuleList };
169
+ //# sourceMappingURL=ruleList.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ruleList.js","sourceRoot":"","sources":["../../../src/ui/forms/ruleList.ts"],"names":[],"mappings":"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","sourcesContent":["import { Input, List, constants } from '@omegagrid/core';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { CellRange, ConditionalFormat, ConditionalFormatType, Grid, GridModel, Style } from '@omegagrid/grid';\nimport { html, LitElement } from 'lit';\nimport { itemStyle, style } from './ruleList.style';\nimport { msg } from '@omegagrid/localize';\nimport { events } from '@omegagrid/core';\n\nconst ruleTypes: Record<string, string> = {\n\t'formula': 'Formula',\n\t'scale': 'Scale',\n\t'bar': 'Data Bar',\n\t'icon': 'Icon Set',\n};\n\n@customElement('og-editor-rules')\nexport class RuleList extends LitElement {\n\n\tstatic styles = [style];\n\n\t@property({type: Object})\n\tgrid: Grid;\n\n\t@property({type: Object})\n\tmodel: GridModel;\n\n\t@query('og-list')\n\tlist: List;\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback();\n\t}\n\n\tupdateList = () => {\n\t\tthis.list.size = this.model.conditionalFormats.formats.length;\n\t\tthis.list.renderItems(true);\n\t}\n\n\tmoveRuleUp(index: number) {\n\t\tif (index == 0) return;\n\t\tconst formats = this.model.conditionalFormats.formats;\n\t\tformats.splice(index - 1, 0, formats.splice(index, 1)[0]);\n\t\tthis.updateList();\n\t}\n\t\n\tmoveRuleDown(index: number) {\n\t\tconst formats = this.model.conditionalFormats.formats;\n\t\tif (index >= formats.length) return;\n\t\tformats.splice(index + 1, 0, formats.splice(index, 1)[0]);\n\t\tthis.updateList();\n\t}\n\n\tdeleteRule(index: number) {\n\t\tconst formats = this.model.conditionalFormats.formats;\n\t\tformats.splice(index, 1);\n\t\tthis.updateList();\n\t}\n\n\ttoggleRuleStop(index: number) {\n\t\tconst format = this.getFormatByIndex(index);\n\t\tformat.stop = !format.stop;\n\t\tthis.updateList();\n\t}\n\n\taddRule() {\n\t\tconst formats = this.model.conditionalFormats.formats;\n\t\tformats.push({} as ConditionalFormat);\n\t\tthis.updateList();\n\t}\n\n\t_onApplyClick = () => {\n\t\tthis.model.clearCalculatedStyles();\n\t\tthis.grid.rendering.render(false);\n\t}\n\n\t_onInputChange(e: Event, format: ConditionalFormat) {\n\t\tconst input = e.target as Input;\n\t\tswitch (input.dataset.id) {\n\t\t\tcase 'ranges': format.ranges = CellRange.fromA1s(input.value); break;\n\t\t\tcase 'condition': format.condition = input.value; break;\n\t\t}\n\t}\n\n\t_onStyleChange(e: events.ChangeEvent, format: ConditionalFormat) {\n\t\tformat.style = this.model.styles.add(e.value as Style);\n\t}\n\n\tgetFormatByIndex(index: number) {\n\t\treturn this.model.conditionalFormats.formats[index];\n\t}\n\n\tchangeType(index: number, type: ConditionalFormatType) {\n\t\tconst format = this.getFormatByIndex(index);\n\t\tformat.type = type;\n\t\tthis.updateList();\n\t}\n\n\t_itemRenderer = (_div: HTMLDivElement, index: number) => html`\n\t\t<div class=\"header\" style=\"padding-right: ${constants.SLIDER_SIZE}px\">\n\t\t\t<div>Rule #${index + 1}</div>\n\t\t\t\n\t\t\t<div>\n\t\t\t\t<og-dropdown-list\n\t\t\t\t\t.value = \"${this.getFormatByIndex(index).type}\"\n\t\t\t\t\t.items=\"${Object.entries(ruleTypes).map(e => ({key: e[0], value: e[1]}))}\"\n\t\t\t\t\t@change=\"${(e: events.ChangeEvent) => this.changeType(index, e.value as ConditionalFormatType)}\">\n\t\t\t\t</og-dropdown-list>\n\t\t\t</div>\n\n\t\t\t<div>\n\t\t\t\t<og-dropdown-menu\n\t\t\t\t\tnoCaret\n\t\t\t\t\tdynamicWidth\n\t\t\t\t\talignment=\"right\"\n\t\t\t\t\ticon=\"bars\"\n\t\t\t\t\t.items=\"${[{\n\t\t\t\t\t\tkey: 'stop',\n\t\t\t\t\t\tvalue: msg('Stop if true'),\n\t\t\t\t\t\ticon: this.getFormatByIndex(index).stop ? 'square-check' : 'square',\n\t\t\t\t\t\texec: () => this.toggleRuleStop(index)\n\t\t\t\t\t}, {\n\t\t\t\t\t\tkey: 'moveUp',\n\t\t\t\t\t\tvalue: msg('Move up'),\n\t\t\t\t\t\ticon: 'arrow-up',\n\t\t\t\t\t\texec: () => this.moveRuleUp(index)\n\t\t\t\t\t}, {\n\t\t\t\t\t\tkey: 'moveDown',\n\t\t\t\t\t\tvalue: msg('Move down'),\n\t\t\t\t\t\ticon: 'arrow-down',\n\t\t\t\t\t\texec: () => this.moveRuleDown(index)\n\t\t\t\t\t}, {\n\t\t\t\t\t\tkey: 'delete',\n\t\t\t\t\t\tvalue: msg('Delete'),\n\t\t\t\t\t\ticon: 'trash',\n\t\t\t\t\t\tcolor: 'red',\n\t\t\t\t\t\texec: () => this.deleteRule(index)\n\t\t\t\t\t}]}\">\n\t\t\t\t</og-dropdown-menu>\n\t\t\t</div>\n\t\t</div>\n\t\t<div style=\"padding-right: ${constants.SLIDER_SIZE}px\">\n\t\t\t<og-editor-form-rule\n\t\t\t\t.format=\"${this.getFormatByIndex(index)}\"\n\t\t\t\t.model=\"${this.model}\">\n\t\t\t</og-editor-form-rule>\n\t\t</div>\n\t`;\n\t\n\trender = () => this.model ? html`\n\t\t<div class=\"controls p\">\n\t\t\t<og-button text=\"+\" @click=\"${() => this.addRule()}\"></og-button>\n\t\t\t<og-button @click=\"${this._onApplyClick}\">\n\t\t\t\t<div slot=\"content\"><og-icon icon=\"refresh\"></og-icon> ${msg('Apply')}</div>\n\t\t\t</og-button>\n\t\t</div>\n\t\t<div class=\"body\">\n\t\t\t<og-list\n\t\t\t\tdisabledSelect\n\t\t\t\tdynamicItemHeight\n\t\t\t\t?nativeHeight=\"${true}\"\n\t\t\t\titemHeight=\"170\"\n\t\t\t\t.customStyle=${itemStyle}\n\t\t\t\t.itemRenderer=\"${this._itemRenderer}\"\n\t\t\t\t.size=\"${this.model.conditionalFormats.formats.length}\">\n\t\t\t</og-list>\n\t\t</div>\n\t` : '';\n}"]}
@@ -0,0 +1,3 @@
1
+ export declare const style: import("lit").CSSResult;
2
+ export declare const itemStyle: import("lit").CSSResult;
3
+ //# sourceMappingURL=ruleList.style.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ruleList.style.d.ts","sourceRoot":"","sources":["../../../src/ui/forms/ruleList.style.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK,yBAgCjB,CAAC;AAEF,eAAO,MAAM,SAAS,yBAiCrB,CAAC"}
@@ -0,0 +1,69 @@
1
+ import { css } from 'lit';
2
+ export const style = css `
3
+ * {
4
+ box-sizing: border-box;
5
+ }
6
+
7
+ :host {
8
+ font-size: var(--og-font-size);
9
+ display: flex;
10
+ flex-direction: column;
11
+ }
12
+
13
+ .controls {
14
+ flex: 0;
15
+ display: flex;
16
+ flex-direction: row;
17
+ gap: 2px;
18
+ padding: 2px;
19
+ }
20
+
21
+ .controls > * {
22
+ flex: 1;
23
+ text-align: center
24
+ }
25
+
26
+ .body {
27
+ flex: 1;
28
+ overflow: hidden;
29
+ }
30
+
31
+ og-list {
32
+ height: 100%;
33
+ }
34
+ `;
35
+ export const itemStyle = css `
36
+ .item {
37
+ padding: 4px;
38
+ border-top: 1px solid var(--og-accent-color);
39
+ }
40
+
41
+ .header {
42
+ display: flex;
43
+ gap: 4px;
44
+ flex-direction: row;
45
+ line-height: 22px;
46
+ max-height: 22px;
47
+ }
48
+
49
+ .header div:first-child {
50
+ background-color: var(--og-accent-color);
51
+ color: var(--og-colortype-accent-text-color);
52
+ padding: 0 2px;
53
+ }
54
+
55
+ .header div:nth-child(2) {
56
+ flex: 1;
57
+ }
58
+
59
+ .header og-dropdown-list, .header og-dropdown-menu {
60
+ height: 100%;
61
+ border-color: var(--og-accent-color);
62
+ }
63
+
64
+ .header og-dropdown-menu {
65
+ width: 20px;
66
+ }
67
+
68
+ `;
69
+ //# sourceMappingURL=ruleList.style.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ruleList.style.js","sourceRoot":"","sources":["../../../src/ui/forms/ruleList.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCvB,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiC3B,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\tfont-size: var(--og-font-size);\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.controls {\n\t\tflex: 0;\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tgap: 2px;\n\t\tpadding: 2px;\n\t}\n\n\t.controls > * {\n\t\tflex: 1;\n\t\ttext-align: center\n\t}\n\n\t.body {\n\t\tflex: 1;\n\t\toverflow: hidden;\n\t}\n\n\tog-list {\n\t\theight: 100%;\n\t}\n`;\n\nexport const itemStyle = css`\n\t.item {\n\t\tpadding: 4px;\n\t\tborder-top: 1px solid var(--og-accent-color);\n\t}\n\n\t.header {\n\t\tdisplay: flex;\n\t\tgap: 4px;\n\t\tflex-direction: row;\n\t\tline-height: 22px;\n\t\tmax-height: 22px;\n\t}\n\t\n\t.header div:first-child {\n\t\tbackground-color: var(--og-accent-color);\n\t\tcolor: var(--og-colortype-accent-text-color);\n\t\tpadding: 0 2px;\n\t}\n\n\t.header div:nth-child(2) {\n\t\tflex: 1;\n\t}\n\n\t.header og-dropdown-list, .header og-dropdown-menu {\n\t\theight: 100%;\n\t\tborder-color: var(--og-accent-color);\n\t}\n\n\t.header og-dropdown-menu {\n\t\twidth: 20px;\n\t}\n\n`;"]}
@@ -0,0 +1,22 @@
1
+ import { actions, List } from '@omegagrid/core';
2
+ import { Grid, GridModel, SparklineOptions } from '@omegagrid/grid';
3
+ import { LitElement } from 'lit';
4
+ export declare class SparklineForm extends LitElement {
5
+ static styles: import("lit").CSSResult[];
6
+ grid: Grid;
7
+ model: GridModel;
8
+ list: List;
9
+ _groupIndexMap: Map<number, number>;
10
+ get groupIndexMap(): Map<number, number>;
11
+ connectedCallback(): void;
12
+ updateList: () => void;
13
+ deleteGroup(index: number): void;
14
+ addGroup(): void;
15
+ _onApplyClick: () => void;
16
+ _onInputChange(e: Event, groupIndex: number): void;
17
+ _onOptionsToolbarAction: (e: actions.ActionEvent, groupIndex: number) => void;
18
+ getToolbarValues(options: SparklineOptions): Record<string, unknown>;
19
+ _itemRenderer: (_div: HTMLDivElement, index: number) => import("lit-html").TemplateResult<1>;
20
+ render: () => "" | import("lit-html").TemplateResult<1>;
21
+ }
22
+ //# sourceMappingURL=sparklineForm.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sparklineForm.d.ts","sourceRoot":"","sources":["../../../src/ui/forms/sparklineForm.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAS,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEvD,OAAO,EAAa,IAAI,EAAE,SAAS,EAAyB,gBAAgB,EAAiB,MAAM,iBAAiB,CAAC;AACrH,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AA0BvC,qBACa,aAAc,SAAQ,UAAU;IAE5C,MAAM,CAAC,MAAM,4BAAW;IAGxB,IAAI,EAAE,IAAI,CAAC;IAGX,KAAK,EAAE,SAAS,CAAC;IAGjB,IAAI,EAAE,IAAI,CAAC;IAEX,cAAc,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,IAAI,aAAa,wBAOhB;IAED,iBAAiB;IAIjB,UAAU,aAIT;IAgBD,WAAW,CAAC,KAAK,EAAE,MAAM;IAKzB,QAAQ;IAKR,aAAa,aAGZ;IAED,cAAc,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM;IAc3C,uBAAuB,GAAI,GAAG,OAAO,CAAC,WAAW,EAAE,YAAY,MAAM,UAUpE;IAED,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IASpE,aAAa,GAAI,MAAM,cAAc,EAAE,OAAO,MAAM,0CAgDnD;IAED,MAAM,kDAeC;CACP"}