@operato/grist-editor 1.0.0-alpha.9 → 1.0.0-beta.41
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.
- package/.storybook/main.js +2 -2
- package/.storybook/server.mjs +4 -4
- package/CHANGELOG.md +12 -3
- package/LICENSE +2 -2
- package/README.md +29 -9
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.js +15 -1
- package/dist/src/index.js.map +1 -1
- package/dist/src/ox-grist-editor-crontab.d.ts +8 -0
- package/dist/src/ox-grist-editor-crontab.js +50 -0
- package/dist/src/ox-grist-editor-crontab.js.map +1 -0
- package/dist/src/ox-grist-editor-duration.d.ts +8 -0
- package/dist/src/ox-grist-editor-duration.js +50 -0
- package/dist/src/ox-grist-editor-duration.js.map +1 -0
- package/dist/src/ox-grist-editor-parameters.d.ts +12 -0
- package/dist/src/{parameters/parameters-editor.js → ox-grist-editor-parameters.js} +17 -39
- package/dist/src/ox-grist-editor-parameters.js.map +1 -0
- package/dist/src/ox-grist-editor-partition-keys.d.ts +11 -0
- package/dist/src/ox-grist-editor-partition-keys.js +74 -0
- package/dist/src/ox-grist-editor-partition-keys.js.map +1 -0
- package/dist/src/ox-grist-editor-value-map.d.ts +11 -0
- package/dist/src/ox-grist-editor-value-map.js +74 -0
- package/dist/src/ox-grist-editor-value-map.js.map +1 -0
- package/dist/src/ox-grist-renderer-crontab.d.ts +2 -0
- package/dist/src/ox-grist-renderer-crontab.js +26 -0
- package/dist/src/ox-grist-renderer-crontab.js.map +1 -0
- package/dist/src/{parameters/parameters-editor-builder.d.ts → ox-parameters-builder.d.ts} +1 -1
- package/dist/src/{parameters/parameters-editor-builder.js → ox-parameters-builder.js} +12 -15
- package/dist/src/ox-parameters-builder.js.map +1 -0
- package/dist/src/ox-popup-crontab-input.d.ts +11 -0
- package/dist/src/ox-popup-crontab-input.js +75 -0
- package/dist/src/ox-popup-crontab-input.js.map +1 -0
- package/dist/src/ox-popup-duration-input.d.ts +11 -0
- package/dist/src/ox-popup-duration-input.js +75 -0
- package/dist/src/ox-popup-duration-input.js.map +1 -0
- package/dist/src/{parameters/parameters-editor-popup.d.ts → ox-popup-parameters-builder.d.ts} +1 -1
- package/dist/src/{parameters/parameters-editor-popup.js → ox-popup-parameters-builder.js} +20 -19
- package/dist/src/ox-popup-parameters-builder.js.map +1 -0
- package/dist/src/ox-popup-partition-keys-input.d.ts +12 -0
- package/dist/src/ox-popup-partition-keys-input.js +100 -0
- package/dist/src/ox-popup-partition-keys-input.js.map +1 -0
- package/dist/src/ox-popup-value-map-input.d.ts +12 -0
- package/dist/src/ox-popup-value-map-input.js +105 -0
- package/dist/src/ox-popup-value-map-input.js.map +1 -0
- package/dist/stories/ox-grist-editor-crontab.stories.d.ts +24 -0
- package/dist/stories/ox-grist-editor-crontab.stories.js +406 -0
- package/dist/stories/ox-grist-editor-crontab.stories.js.map +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +36 -24
- package/src/index.ts +18 -0
- package/src/ox-grist-editor-crontab.ts +62 -0
- package/src/ox-grist-editor-duration.ts +62 -0
- package/src/{parameters/parameters-editor.ts → ox-grist-editor-parameters.ts} +14 -27
- package/src/ox-grist-editor-partition-keys.ts +86 -0
- package/src/ox-grist-editor-value-map.ts +86 -0
- package/src/ox-grist-renderer-crontab.ts +31 -0
- package/src/{parameters/parameters-editor-builder.ts → ox-parameters-builder.ts} +6 -10
- package/src/ox-popup-crontab-input.ts +75 -0
- package/src/ox-popup-duration-input.ts +75 -0
- package/src/{parameters/parameters-editor-popup.ts → ox-popup-parameters-builder.ts} +10 -9
- package/src/ox-popup-partition-keys-input.ts +97 -0
- package/src/ox-popup-value-map-input.ts +102 -0
- package/stories/ox-grist-editor-crontab.stories.ts +429 -0
- package/themes/app-theme.css +142 -0
- package/themes/form-theme.css +75 -0
- package/themes/grist-theme.css +194 -0
- package/themes/oops-theme.css +26 -0
- package/themes/report-theme.css +47 -0
- package/translations/en.json +3 -0
- package/translations/ko.json +3 -0
- package/translations/ms.json +3 -0
- package/translations/zh.json +3 -0
- package/web-dev-server.config.mjs +9 -8
- package/web-test-runner.config.mjs +7 -19
- package/.editorconfig +0 -29
- package/demo/data-grist-test.html +0 -456
- package/demo/index.html +0 -33
- package/dist/src/code/code-editor.d.ts +0 -6
- package/dist/src/code/code-editor.js +0 -50
- package/dist/src/code/code-editor.js.map +0 -1
- package/dist/src/code/index.d.ts +0 -1
- package/dist/src/code/index.js +0 -5
- package/dist/src/code/index.js.map +0 -1
- package/dist/src/id/id-input.d.ts +0 -19
- package/dist/src/id/id-input.js +0 -119
- package/dist/src/id/id-input.js.map +0 -1
- package/dist/src/id/id-renderer.d.ts +0 -2
- package/dist/src/id/id-renderer.js +0 -9
- package/dist/src/id/id-renderer.js.map +0 -1
- package/dist/src/id/id-selector.d.ts +0 -23
- package/dist/src/id/id-selector.js +0 -197
- package/dist/src/id/id-selector.js.map +0 -1
- package/dist/src/id/index.d.ts +0 -1
- package/dist/src/id/index.js +0 -7
- package/dist/src/id/index.js.map +0 -1
- package/dist/src/object/index.d.ts +0 -1
- package/dist/src/object/index.js +0 -6
- package/dist/src/object/index.js.map +0 -1
- package/dist/src/object/object-editor.d.ts +0 -18
- package/dist/src/object/object-editor.js +0 -152
- package/dist/src/object/object-editor.js.map +0 -1
- package/dist/src/object/object-selector.d.ts +0 -38
- package/dist/src/object/object-selector.js +0 -338
- package/dist/src/object/object-selector.js.map +0 -1
- package/dist/src/parameters/index.d.ts +0 -1
- package/dist/src/parameters/index.js +0 -6
- package/dist/src/parameters/index.js.map +0 -1
- package/dist/src/parameters/parameters-editor-builder.js.map +0 -1
- package/dist/src/parameters/parameters-editor-popup.js.map +0 -1
- package/dist/src/parameters/parameters-editor.d.ts +0 -18
- package/dist/src/parameters/parameters-editor.js.map +0 -1
- package/src/code/code-editor.ts +0 -78
- package/src/code/index.ts +0 -6
- package/src/id/id-input.ts +0 -135
- package/src/id/id-renderer.ts +0 -12
- package/src/id/id-selector.ts +0 -189
- package/src/id/index.ts +0 -8
- package/src/object/index.ts +0 -8
- package/src/object/object-editor.ts +0 -162
- package/src/object/object-selector.ts +0 -346
- package/src/parameters/index.ts +0 -8
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import cronstrue from 'cronstrue/i18n';
|
|
2
|
+
import i18next from 'i18next';
|
|
3
|
+
import { html } from 'lit';
|
|
4
|
+
import { detectOverflow } from '@operato/utils';
|
|
5
|
+
function onmouseover(e) {
|
|
6
|
+
const element = e.target;
|
|
7
|
+
if (detectOverflow(element)) {
|
|
8
|
+
element.setAttribute('data-tooltip', element.textContent);
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
function onmouseout(e) {
|
|
12
|
+
const element = e.target;
|
|
13
|
+
element.removeAttribute('data-tooltip');
|
|
14
|
+
}
|
|
15
|
+
export const OxGristRendererCrontab = (value, column, record, rowIndex, field) => {
|
|
16
|
+
let text = '';
|
|
17
|
+
try {
|
|
18
|
+
const language = (i18next.language || 'en').substring(0, 2);
|
|
19
|
+
text = !value ? '' : cronstrue.toString(value, { locale: language || 'en' });
|
|
20
|
+
}
|
|
21
|
+
catch (e) {
|
|
22
|
+
console.error(e);
|
|
23
|
+
}
|
|
24
|
+
return html `<span @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</span>`;
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=ox-grist-renderer-crontab.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ox-grist-renderer-crontab.js","sourceRoot":"","sources":["../../src/ox-grist-renderer-crontab.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,gBAAgB,CAAA;AACtC,OAAO,OAAO,MAAM,SAAS,CAAA;AAC7B,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,SAAS,WAAW,CAAC,CAAQ;IAC3B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAyB,CAAA;IAC3C,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;QAC3B,OAAO,CAAC,YAAY,CAAC,cAAc,EAAE,OAAO,CAAC,WAAY,CAAC,CAAA;KAC3D;AACH,CAAC;AAED,SAAS,UAAU,CAAC,CAAQ;IAC1B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAyB,CAAA;IAC3C,OAAO,CAAC,eAAe,CAAC,cAAc,CAAC,CAAA;AACzC,CAAC;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC9F,IAAI,IAAI,GAAG,EAAE,CAAA;IAEb,IAAI;QACF,MAAM,QAAQ,GAAG,CAAC,OAAO,CAAC,QAAQ,IAAI,IAAI,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;QAC3D,IAAI,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,IAAI,IAAI,EAAE,CAAC,CAAA;KAC7E;IAAC,OAAO,CAAC,EAAE;QACV,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;KACjB;IAED,OAAO,IAAI,CAAA,oBAAoB,WAAW,cAAc,UAAU,IAAI,IAAI,SAAS,CAAA;AACrF,CAAC,CAAA","sourcesContent":["import cronstrue from 'cronstrue/i18n'\nimport i18next from 'i18next'\nimport { html } from 'lit'\n\nimport { FieldRenderer } from '@operato/data-grist'\nimport { detectOverflow } from '@operato/utils'\n\nfunction onmouseover(e: Event) {\n const element = e.target as HTMLSpanElement\n if (detectOverflow(element)) {\n element.setAttribute('data-tooltip', element.textContent!)\n }\n}\n\nfunction onmouseout(e: Event) {\n const element = e.target as HTMLSpanElement\n element.removeAttribute('data-tooltip')\n}\n\nexport const OxGristRendererCrontab: FieldRenderer = (value, column, record, rowIndex, field) => {\n let text = ''\n\n try {\n const language = (i18next.language || 'en').substring(0, 2)\n text = !value ? '' : cronstrue.toString(value, { locale: language || 'en' })\n } catch (e) {\n console.error(e)\n }\n\n return html`<span @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</span>`\n}\n"]}
|
|
@@ -2,23 +2,20 @@
|
|
|
2
2
|
* @license Copyright © HatioLab Inc. All rights reserved.
|
|
3
3
|
*/
|
|
4
4
|
import { __decorate } from "tslib";
|
|
5
|
-
import '
|
|
6
|
-
import { LitElement, html } from 'lit';
|
|
7
|
-
import { OxPropertyEditor } from '@operato/property-editor';
|
|
5
|
+
import { html, LitElement } from 'lit';
|
|
8
6
|
import { customElement, property } from 'lit/decorators.js';
|
|
9
|
-
import {
|
|
10
|
-
import { store } from '@operato/shell';
|
|
7
|
+
import { OxPropertyEditor } from '@operato/property-editor';
|
|
11
8
|
/**
|
|
12
9
|
모든 에디터들은 change 이벤트를 지원해야 한다. 또한, 모든 에디터들은 value속성에 값을 가져야 한다.
|
|
13
10
|
|
|
14
11
|
Example:
|
|
15
12
|
|
|
16
|
-
<ox-parameters-
|
|
13
|
+
<ox-parameters-builder value="{{value}}">
|
|
17
14
|
<label>Center X</label>
|
|
18
15
|
<input type="number" .value="${value.cx}">
|
|
19
16
|
<label>Width</label>
|
|
20
17
|
<input type="number" .value="${value.width}">
|
|
21
|
-
</ox-parameters-
|
|
18
|
+
</ox-parameters-builder>
|
|
22
19
|
*/
|
|
23
20
|
const DEFAULT_VALUE = {
|
|
24
21
|
legend: '',
|
|
@@ -40,7 +37,7 @@ const DEFAULT_VALUE = {
|
|
|
40
37
|
options: null,
|
|
41
38
|
date: null
|
|
42
39
|
};
|
|
43
|
-
let
|
|
40
|
+
let OxParametersBuilder = class OxParametersBuilder extends LitElement {
|
|
44
41
|
render() {
|
|
45
42
|
return html `<slot></slot>`;
|
|
46
43
|
}
|
|
@@ -106,14 +103,14 @@ let ParametersEditorBuilder = class ParametersEditorBuilder extends connect(stor
|
|
|
106
103
|
};
|
|
107
104
|
__decorate([
|
|
108
105
|
property({ type: Object })
|
|
109
|
-
],
|
|
106
|
+
], OxParametersBuilder.prototype, "value", void 0);
|
|
110
107
|
__decorate([
|
|
111
108
|
property({ type: Array })
|
|
112
|
-
],
|
|
109
|
+
], OxParametersBuilder.prototype, "props", void 0);
|
|
113
110
|
__decorate([
|
|
114
111
|
property({ type: Object })
|
|
115
|
-
],
|
|
116
|
-
|
|
117
|
-
customElement('ox-parameters-
|
|
118
|
-
],
|
|
119
|
-
//# sourceMappingURL=parameters-
|
|
112
|
+
], OxParametersBuilder.prototype, "host", void 0);
|
|
113
|
+
OxParametersBuilder = __decorate([
|
|
114
|
+
customElement('ox-parameters-builder')
|
|
115
|
+
], OxParametersBuilder);
|
|
116
|
+
//# sourceMappingURL=ox-parameters-builder.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ox-parameters-builder.js","sourceRoot":"","sources":["../../src/ox-parameters-builder.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\n\n/**\n모든 에디터들은 change 이벤트를 지원해야 한다. 또한, 모든 에디터들은 value속성에 값을 가져야 한다.\n\nExample:\n\n <ox-parameters-builder value=\"{{value}}\">\n <label>Center X</label>\n <input type=\"number\" .value=\"${value.cx}\">\n <label>Width</label>\n <input type=\"number\" .value=\"${value.width}\">\n </ox-parameters-builder>\n*/\n\nconst DEFAULT_VALUE = {\n legend: '',\n number: 0,\n angle: 0,\n string: '',\n text: '',\n textarea: '',\n checkbox: false,\n select: '',\n color: '#000000',\n 'solidcolor-stops': null,\n 'gradientcolor-stops': null,\n 'gltf-selector': '',\n 'image-selector': '',\n multiplecolor: null,\n editortable: null,\n imageselector: '',\n options: null,\n date: null\n} as any\n\n@customElement('ox-parameters-builder')\nclass OxParametersBuilder extends LitElement {\n @property({ type: Object }) value: any\n @property({ type: Array }) props?: PropertySpec[]\n @property({ type: Object }) host: any\n\n render() {\n return html`<slot></slot>`\n }\n\n firstUpdated() {\n this.addEventListener('change', this._onValueChanged.bind(this))\n }\n\n updated(changes: PropertyValues<this>) {\n changes.has('props') && this._onPropsChanged(this.props)\n changes.has('value') && this._setValues()\n }\n\n _onPropsChanged(props: PropertySpec[] | undefined) {\n this.textContent = ''\n ;(props || []).forEach(prop => {\n let elementType = OxPropertyEditor.getEditor(prop.type)\n if (!elementType) {\n console.warn('Property Editor not defined', prop.type)\n return\n }\n let element = document.createElement(elementType) as OxPropertyEditor\n\n element.label = prop.label\n element.type = prop.type\n element.placeholder = prop.placeholder\n element.host = this.host\n // element.context = this.context\n element.setAttribute('name', prop.name)\n\n if (prop.observe) {\n element.observe = prop.observe\n }\n element.property = prop.property\n element.setAttribute('property-editor', '')\n\n this.appendChild(element)\n })\n }\n\n _setValues() {\n var value = this.value || {}\n Array.from(this.querySelectorAll('[name]')).forEach(propertyEditor => {\n const editor = propertyEditor as OxPropertyEditor\n let name = editor.getAttribute('name')\n editor.value = value[name!] === undefined ? DEFAULT_VALUE[editor.type] : value[name!]\n })\n }\n\n _getValues() {\n var value = {} as any\n Array.from(this.querySelectorAll('[name]')).forEach(propertyEditor => {\n const editor = propertyEditor as OxPropertyEditor\n let name = editor.getAttribute('name')\n value[name!] = editor.value === undefined ? DEFAULT_VALUE[editor.type] : editor.value\n })\n\n return value\n }\n\n _onValueChanged(e: Event) {\n e.stopPropagation()\n var prop = e.target as HTMLElement\n\n if (!prop || !prop.hasAttribute('property-editor')) {\n return\n }\n\n this.dispatchEvent(\n new CustomEvent('property-change', {\n bubbles: true,\n composed: true,\n detail: this._getValues()\n })\n )\n }\n}\n"]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import '@operato/input/ox-input-crontab.js';
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
export declare class OxPopupCrontabInput extends LitElement {
|
|
4
|
+
static styles: import("lit").CSSResult[];
|
|
5
|
+
value: any;
|
|
6
|
+
confirmCallback: (newval: any) => void;
|
|
7
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
8
|
+
private onChange;
|
|
9
|
+
private onCancel;
|
|
10
|
+
private onConfirm;
|
|
11
|
+
}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { __decorate } from "tslib";
|
|
2
|
+
import '@operato/input/ox-input-crontab.js';
|
|
3
|
+
import { css, html, LitElement } from 'lit';
|
|
4
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
5
|
+
import { i18next } from '@operato/i18n';
|
|
6
|
+
import { closePopup } from '@operato/popup';
|
|
7
|
+
import { ScrollbarStyles } from '@operato/styles';
|
|
8
|
+
let OxPopupCrontabInput = class OxPopupCrontabInput extends LitElement {
|
|
9
|
+
render() {
|
|
10
|
+
return html `
|
|
11
|
+
<ox-input-crontab .value=${this.value} @change=${this.onChange.bind(this)}> </ox-input-crontab>
|
|
12
|
+
|
|
13
|
+
<div class="button-container">
|
|
14
|
+
<mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>
|
|
15
|
+
<mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>
|
|
16
|
+
</div>
|
|
17
|
+
`;
|
|
18
|
+
}
|
|
19
|
+
onChange(e) {
|
|
20
|
+
e.stopPropagation();
|
|
21
|
+
this.value = e.detail;
|
|
22
|
+
}
|
|
23
|
+
onCancel(e) {
|
|
24
|
+
closePopup(this);
|
|
25
|
+
}
|
|
26
|
+
onConfirm(e) {
|
|
27
|
+
this.confirmCallback && this.confirmCallback(this.value);
|
|
28
|
+
closePopup(this);
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
OxPopupCrontabInput.styles = [
|
|
32
|
+
ScrollbarStyles,
|
|
33
|
+
css `
|
|
34
|
+
:host {
|
|
35
|
+
display: flex;
|
|
36
|
+
flex-direction: column;
|
|
37
|
+
|
|
38
|
+
background-color: #fff;
|
|
39
|
+
|
|
40
|
+
width: var(--overlay-center-normal-width, 50%);
|
|
41
|
+
height: var(--overlay-center-normal-height, 50%);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
ox-input-crontab {
|
|
45
|
+
flex: 1;
|
|
46
|
+
overflow-y: auto;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
span {
|
|
50
|
+
flex: 1;
|
|
51
|
+
|
|
52
|
+
display: flex;
|
|
53
|
+
align-items: center;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
|
|
56
|
+
color: var(--primary-color);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.button-container {
|
|
60
|
+
display: flex;
|
|
61
|
+
margin-left: auto;
|
|
62
|
+
}
|
|
63
|
+
`
|
|
64
|
+
];
|
|
65
|
+
__decorate([
|
|
66
|
+
property({ type: Object })
|
|
67
|
+
], OxPopupCrontabInput.prototype, "value", void 0);
|
|
68
|
+
__decorate([
|
|
69
|
+
property({ type: Object })
|
|
70
|
+
], OxPopupCrontabInput.prototype, "confirmCallback", void 0);
|
|
71
|
+
OxPopupCrontabInput = __decorate([
|
|
72
|
+
customElement('ox-popup-crontab-input')
|
|
73
|
+
], OxPopupCrontabInput);
|
|
74
|
+
export { OxPopupCrontabInput };
|
|
75
|
+
//# sourceMappingURL=ox-popup-crontab-input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ox-popup-crontab-input.js","sourceRoot":"","sources":["../../src/ox-popup-crontab-input.ts"],"names":[],"mappings":";AAAA,OAAO,oCAAoC,CAAA;AAE3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGjD,IAAa,mBAAmB,GAAhC,MAAa,mBAAoB,SAAQ,UAAU;IAuCjD,MAAM;QACJ,OAAO,IAAI,CAAA;iCACkB,IAAI,CAAC,KAAK,YAAY,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;6BAGlD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;6BACtD,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;KAEhF,CAAA;IACH,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAA;IACvB,CAAC;IAEO,QAAQ,CAAC,CAAQ;QACvB,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;CACF,CAAA;AA/DQ,0BAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8BF;CACF,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4DAAwC;AArCxD,mBAAmB;IAD/B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,mBAAmB,CAgE/B;SAhEY,mBAAmB","sourcesContent":["import '@operato/input/ox-input-crontab.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-popup-crontab-input')\nexport class OxPopupCrontabInput extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n\n width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-input-crontab {\n flex: 1;\n overflow-y: auto;\n }\n\n span {\n flex: 1;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n color: var(--primary-color);\n }\n\n .button-container {\n display: flex;\n margin-left: auto;\n }\n `\n ]\n\n @property({ type: Object }) value: any\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n return html`\n <ox-input-crontab .value=${this.value} @change=${this.onChange.bind(this)}> </ox-input-crontab>\n\n <div class=\"button-container\">\n <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>\n <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>\n </div>\n `\n }\n\n private onChange(e: CustomEvent) {\n e.stopPropagation()\n\n this.value = e.detail\n }\n\n private onCancel(e: Event) {\n closePopup(this)\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n closePopup(this)\n }\n}\n"]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import '@operato/input/ox-input-duration.js';
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
export declare class OxPopupDurationInput extends LitElement {
|
|
4
|
+
static styles: import("lit").CSSResult[];
|
|
5
|
+
value: any;
|
|
6
|
+
confirmCallback: (newval: any) => void;
|
|
7
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
8
|
+
private onChange;
|
|
9
|
+
private onCancel;
|
|
10
|
+
private onConfirm;
|
|
11
|
+
}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { __decorate } from "tslib";
|
|
2
|
+
import '@operato/input/ox-input-duration.js';
|
|
3
|
+
import { css, html, LitElement } from 'lit';
|
|
4
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
5
|
+
import { i18next } from '@operato/i18n';
|
|
6
|
+
import { closePopup } from '@operato/popup';
|
|
7
|
+
import { ScrollbarStyles } from '@operato/styles';
|
|
8
|
+
let OxPopupDurationInput = class OxPopupDurationInput extends LitElement {
|
|
9
|
+
render() {
|
|
10
|
+
return html `
|
|
11
|
+
<ox-input-duration .value=${this.value} @change=${this.onChange.bind(this)}> </ox-input-duration>
|
|
12
|
+
|
|
13
|
+
<div class="button-container">
|
|
14
|
+
<mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>
|
|
15
|
+
<mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>
|
|
16
|
+
</div>
|
|
17
|
+
`;
|
|
18
|
+
}
|
|
19
|
+
onChange(e) {
|
|
20
|
+
e.stopPropagation();
|
|
21
|
+
this.value = e.detail;
|
|
22
|
+
}
|
|
23
|
+
onCancel(e) {
|
|
24
|
+
closePopup(this);
|
|
25
|
+
}
|
|
26
|
+
onConfirm(e) {
|
|
27
|
+
this.confirmCallback && this.confirmCallback(this.value);
|
|
28
|
+
closePopup(this);
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
OxPopupDurationInput.styles = [
|
|
32
|
+
ScrollbarStyles,
|
|
33
|
+
css `
|
|
34
|
+
:host {
|
|
35
|
+
display: flex;
|
|
36
|
+
flex-direction: column;
|
|
37
|
+
|
|
38
|
+
background-color: #fff;
|
|
39
|
+
|
|
40
|
+
width: var(--overlay-center-normal-width, 50%);
|
|
41
|
+
height: var(--overlay-center-normal-height, 50%);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
ox-input-duration {
|
|
45
|
+
flex: 1;
|
|
46
|
+
overflow-y: auto;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
span {
|
|
50
|
+
flex: 1;
|
|
51
|
+
|
|
52
|
+
display: flex;
|
|
53
|
+
align-items: center;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
|
|
56
|
+
color: var(--primary-color);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.button-container {
|
|
60
|
+
display: flex;
|
|
61
|
+
margin-left: auto;
|
|
62
|
+
}
|
|
63
|
+
`
|
|
64
|
+
];
|
|
65
|
+
__decorate([
|
|
66
|
+
property({ type: Object })
|
|
67
|
+
], OxPopupDurationInput.prototype, "value", void 0);
|
|
68
|
+
__decorate([
|
|
69
|
+
property({ type: Object })
|
|
70
|
+
], OxPopupDurationInput.prototype, "confirmCallback", void 0);
|
|
71
|
+
OxPopupDurationInput = __decorate([
|
|
72
|
+
customElement('ox-popup-duration-input')
|
|
73
|
+
], OxPopupDurationInput);
|
|
74
|
+
export { OxPopupDurationInput };
|
|
75
|
+
//# sourceMappingURL=ox-popup-duration-input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ox-popup-duration-input.js","sourceRoot":"","sources":["../../src/ox-popup-duration-input.ts"],"names":[],"mappings":";AAAA,OAAO,qCAAqC,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGjD,IAAa,oBAAoB,GAAjC,MAAa,oBAAqB,SAAQ,UAAU;IAuClD,MAAM;QACJ,OAAO,IAAI,CAAA;kCACmB,IAAI,CAAC,KAAK,YAAY,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;6BAGnD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;6BACtD,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;KAEhF,CAAA;IACH,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAA;IACvB,CAAC;IAEO,QAAQ,CAAC,CAAQ;QACvB,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;CACF,CAAA;AA/DQ,2BAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8BF;CACF,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DAAwC;AArCxD,oBAAoB;IADhC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,oBAAoB,CAgEhC;SAhEY,oBAAoB","sourcesContent":["import '@operato/input/ox-input-duration.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-popup-duration-input')\nexport class OxPopupDurationInput extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n\n width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-input-duration {\n flex: 1;\n overflow-y: auto;\n }\n\n span {\n flex: 1;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n color: var(--primary-color);\n }\n\n .button-container {\n display: flex;\n margin-left: auto;\n }\n `\n ]\n\n @property({ type: Object }) value: any\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n return html`\n <ox-input-duration .value=${this.value} @change=${this.onChange.bind(this)}> </ox-input-duration>\n\n <div class=\"button-container\">\n <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>\n <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>\n </div>\n `\n }\n\n private onChange(e: CustomEvent) {\n e.stopPropagation()\n\n this.value = e.detail\n }\n\n private onCancel(e: Event) {\n closePopup(this)\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n closePopup(this)\n }\n}\n"]}
|
|
@@ -1,22 +1,23 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
|
-
import {
|
|
2
|
+
import { css, html, LitElement } from 'lit';
|
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
-
import { ScrollbarStyles } from '@operato/styles';
|
|
5
4
|
import { i18next } from '@operato/i18n';
|
|
6
|
-
|
|
5
|
+
import { closePopup } from '@operato/popup';
|
|
6
|
+
import { ScrollbarStyles } from '@operato/styles';
|
|
7
|
+
let OxPopupParametersBuilder = class OxPopupParametersBuilder extends LitElement {
|
|
7
8
|
render() {
|
|
8
9
|
var props = this.props instanceof Array ? this.props : [];
|
|
9
10
|
return html `
|
|
10
11
|
${props.length > 0
|
|
11
12
|
? html `
|
|
12
|
-
<ox-parameters-
|
|
13
|
+
<ox-parameters-builder
|
|
13
14
|
.value=${this.value}
|
|
14
15
|
.props=${props}
|
|
15
16
|
.host=${this.host}
|
|
16
17
|
.context=${this.context}
|
|
17
18
|
@property-change=${this.onChange.bind(this)}
|
|
18
19
|
>
|
|
19
|
-
</ox-parameters-
|
|
20
|
+
</ox-parameters-builder>
|
|
20
21
|
`
|
|
21
22
|
: html ` <span><i18n-msg msgid="text.no properties to set"></i18n-msg></span> `}
|
|
22
23
|
|
|
@@ -48,14 +49,14 @@ let ParametersEditorPopup = class ParametersEditorPopup extends LitElement {
|
|
|
48
49
|
Object.assign(this.value, e.detail);
|
|
49
50
|
}
|
|
50
51
|
onCancel(e) {
|
|
51
|
-
|
|
52
|
+
closePopup(this);
|
|
52
53
|
}
|
|
53
54
|
onConfirm(e) {
|
|
54
55
|
this.confirmCallback && this.confirmCallback(this.value);
|
|
55
|
-
|
|
56
|
+
closePopup(this);
|
|
56
57
|
}
|
|
57
58
|
};
|
|
58
|
-
|
|
59
|
+
OxPopupParametersBuilder.styles = [
|
|
59
60
|
ScrollbarStyles,
|
|
60
61
|
css `
|
|
61
62
|
:host {
|
|
@@ -68,7 +69,7 @@ ParametersEditorPopup.styles = [
|
|
|
68
69
|
height: var(--overlay-center-normal-height, 50%);
|
|
69
70
|
}
|
|
70
71
|
|
|
71
|
-
ox-parameters-
|
|
72
|
+
ox-parameters-builder {
|
|
72
73
|
flex: 1;
|
|
73
74
|
overflow-y: auto;
|
|
74
75
|
}
|
|
@@ -91,21 +92,21 @@ ParametersEditorPopup.styles = [
|
|
|
91
92
|
];
|
|
92
93
|
__decorate([
|
|
93
94
|
property({ type: Object })
|
|
94
|
-
],
|
|
95
|
+
], OxPopupParametersBuilder.prototype, "value", void 0);
|
|
95
96
|
__decorate([
|
|
96
97
|
property({ type: Object })
|
|
97
|
-
],
|
|
98
|
+
], OxPopupParametersBuilder.prototype, "props", void 0);
|
|
98
99
|
__decorate([
|
|
99
100
|
property({ type: Object })
|
|
100
|
-
],
|
|
101
|
+
], OxPopupParametersBuilder.prototype, "host", void 0);
|
|
101
102
|
__decorate([
|
|
102
103
|
property({ type: Object })
|
|
103
|
-
],
|
|
104
|
+
], OxPopupParametersBuilder.prototype, "context", void 0);
|
|
104
105
|
__decorate([
|
|
105
106
|
property({ type: Object })
|
|
106
|
-
],
|
|
107
|
-
|
|
108
|
-
customElement('ox-parameters-
|
|
109
|
-
],
|
|
110
|
-
export {
|
|
111
|
-
//# sourceMappingURL=parameters-
|
|
107
|
+
], OxPopupParametersBuilder.prototype, "confirmCallback", void 0);
|
|
108
|
+
OxPopupParametersBuilder = __decorate([
|
|
109
|
+
customElement('ox-popup-parameters-builder')
|
|
110
|
+
], OxPopupParametersBuilder);
|
|
111
|
+
export { OxPopupParametersBuilder };
|
|
112
|
+
//# sourceMappingURL=ox-popup-parameters-builder.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ox-popup-parameters-builder.js","sourceRoot":"","sources":["../../src/ox-popup-parameters-builder.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGjD,IAAa,wBAAwB,GAArC,MAAa,wBAAyB,SAAQ,UAAU;IA0CtD,MAAM;QACJ,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA;QAEzD,OAAO,IAAI,CAAA;QACP,KAAK,CAAC,MAAM,GAAG,CAAC;YAChB,CAAC,CAAC,IAAI,CAAA;;uBAES,IAAI,CAAC,KAAK;uBACV,KAAK;sBACN,IAAI,CAAC,IAAI;yBACN,IAAI,CAAC,OAAO;iCACJ,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;WAG9C;YACH,CAAC,CAAC,IAAI,CAAA,wEAAwE;;;6BAGzD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;6BACtD,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;KAEhF,CAAA;IACH,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB;;;;;;;;;;UAUE;QACF,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA;SAChB;QAED,KAAK,IAAI,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE;YAC1B,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;SACvB;QACD,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAA;IACrC,CAAC;IAEO,QAAQ,CAAC,CAAQ;QACvB,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;CACF,CAAA;AAjGQ,+BAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8BF;CACF,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAAU;AACT;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yDAAa;AACZ;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iEAAwC;AAxCxD,wBAAwB;IADpC,aAAa,CAAC,6BAA6B,CAAC;GAChC,wBAAwB,CAkGpC;SAlGY,wBAAwB","sourcesContent":["import { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-popup-parameters-builder')\nexport class OxPopupParametersBuilder extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n\n width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-parameters-builder {\n flex: 1;\n overflow-y: auto;\n }\n\n span {\n flex: 1;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n color: var(--primary-color);\n }\n\n .button-container {\n display: flex;\n margin-left: auto;\n }\n `\n ]\n\n @property({ type: Object }) value: any\n @property({ type: Object }) props: any\n @property({ type: Object }) host: any\n @property({ type: Object }) context: any\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n var props = this.props instanceof Array ? this.props : []\n\n return html`\n ${props.length > 0\n ? html`\n <ox-parameters-builder\n .value=${this.value}\n .props=${props}\n .host=${this.host}\n .context=${this.context}\n @property-change=${this.onChange.bind(this)}\n >\n </ox-parameters-builder>\n `\n : html` <span><i18n-msg msgid=\"text.no properties to set\"></i18n-msg></span> `}\n\n <div class=\"button-container\">\n <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>\n <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>\n </div>\n `\n }\n\n private onChange(e: CustomEvent) {\n e.stopPropagation()\n\n /* \n 주의 : 이 팝업 템플릿은 layout 모듈에 의해서 render 되므로, \n layout의 구성에 변화가 발생하면, 다시 render된다.\n 이 팝업이 떠 있는 상태에서, 또 다른 팝업이 뜨는 경우도 layout 구성의 변화를 야기한다. (overlay의 갯수의 증가)\n 이 경우 value, options, confirmCallback 등 클로져를 사용한 것들이 초기 바인딩된 값으로 다시 바인딩되게 되는데,\n 만약, 템플릿 내부에서 이들 속성의 레퍼런스가 변화했다면, 원래 상태로 되돌아가는 현상이 발생하게 된다.\n 따라서, 가급적 이들 속성의 레퍼런스를 변화시키지 않는 것이 좋다.\n (이 팝업 클래스를 템플릿으로 사용한 곳의 코드를 참조하세요.)\n => \n 이런 이유로, Object.assign(...)을 사용하였다.\n */\n if (!this.value) {\n this.value = {}\n }\n\n for (let key in this.value) {\n delete this.value[key]\n }\n Object.assign(this.value, e.detail)\n }\n\n private onCancel(e: Event) {\n closePopup(this)\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n closePopup(this)\n }\n}\n"]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import '@operato/input/ox-input-partition-keys.js';
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
export declare class OxPopupPartitionKeysInput extends LitElement {
|
|
4
|
+
static styles: import("lit").CSSResult[];
|
|
5
|
+
value: any;
|
|
6
|
+
valuetype: string;
|
|
7
|
+
confirmCallback: (newval: any) => void;
|
|
8
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
9
|
+
private onChange;
|
|
10
|
+
private onCancel;
|
|
11
|
+
private onConfirm;
|
|
12
|
+
}
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
import { __decorate } from "tslib";
|
|
2
|
+
import '@operato/input/ox-input-partition-keys.js';
|
|
3
|
+
import { css, html, LitElement } from 'lit';
|
|
4
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
5
|
+
import { i18next } from '@operato/i18n';
|
|
6
|
+
import { closePopup } from '@operato/popup';
|
|
7
|
+
import { ScrollbarStyles } from '@operato/styles';
|
|
8
|
+
let OxPopupPartitionKeysInput = class OxPopupPartitionKeysInput extends LitElement {
|
|
9
|
+
constructor() {
|
|
10
|
+
super(...arguments);
|
|
11
|
+
this.valuetype = 'string';
|
|
12
|
+
}
|
|
13
|
+
render() {
|
|
14
|
+
return html `
|
|
15
|
+
<ox-input-partition-keys .value=${this.value} @change=${this.onChange.bind(this)}> </ox-input-partition-keys>
|
|
16
|
+
|
|
17
|
+
<div class="button-container">
|
|
18
|
+
<mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>
|
|
19
|
+
<mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>
|
|
20
|
+
</div>
|
|
21
|
+
`;
|
|
22
|
+
}
|
|
23
|
+
onChange(e) {
|
|
24
|
+
e.stopPropagation();
|
|
25
|
+
/*
|
|
26
|
+
주의 : 이 팝업 템플릿은 layout 모듈에 의해서 render 되므로,
|
|
27
|
+
layout의 구성에 변화가 발생하면, 다시 render된다.
|
|
28
|
+
이 팝업이 떠 있는 상태에서, 또 다른 팝업이 뜨는 경우도 layout 구성의 변화를 야기한다. (overlay의 갯수의 증가)
|
|
29
|
+
이 경우 value, options, confirmCallback 등 클로져를 사용한 것들이 초기 바인딩된 값으로 다시 바인딩되게 되는데,
|
|
30
|
+
만약, 템플릿 내부에서 이들 속성의 레퍼런스가 변화했다면, 원래 상태로 되돌아가는 현상이 발생하게 된다.
|
|
31
|
+
따라서, 가급적 이들 속성의 레퍼런스를 변화시키지 않는 것이 좋다.
|
|
32
|
+
(이 팝업 클래스를 템플릿으로 사용한 곳의 코드를 참조하세요.)
|
|
33
|
+
=>
|
|
34
|
+
이런 이유로, Object.assign(...)을 사용하였다.
|
|
35
|
+
*/
|
|
36
|
+
if (!this.value || typeof this.value !== 'object') {
|
|
37
|
+
this.value = {};
|
|
38
|
+
}
|
|
39
|
+
for (let key in this.value) {
|
|
40
|
+
delete this.value[key];
|
|
41
|
+
}
|
|
42
|
+
Object.assign(this.value, e.detail);
|
|
43
|
+
}
|
|
44
|
+
onCancel(e) {
|
|
45
|
+
closePopup(this);
|
|
46
|
+
}
|
|
47
|
+
onConfirm(e) {
|
|
48
|
+
this.confirmCallback && this.confirmCallback(this.value);
|
|
49
|
+
closePopup(this);
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
OxPopupPartitionKeysInput.styles = [
|
|
53
|
+
ScrollbarStyles,
|
|
54
|
+
css `
|
|
55
|
+
:host {
|
|
56
|
+
display: flex;
|
|
57
|
+
flex-direction: column;
|
|
58
|
+
|
|
59
|
+
background-color: #fff;
|
|
60
|
+
|
|
61
|
+
width: var(--overlay-center-normal-width, 50%);
|
|
62
|
+
height: var(--overlay-center-normal-height, 50%);
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
ox-input-partition-keys {
|
|
66
|
+
flex: 1;
|
|
67
|
+
overflow-y: auto;
|
|
68
|
+
padding: 10px;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
span {
|
|
72
|
+
flex: 1;
|
|
73
|
+
|
|
74
|
+
display: flex;
|
|
75
|
+
align-items: center;
|
|
76
|
+
justify-content: center;
|
|
77
|
+
|
|
78
|
+
color: var(--primary-color);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.button-container {
|
|
82
|
+
display: flex;
|
|
83
|
+
margin-left: auto;
|
|
84
|
+
}
|
|
85
|
+
`
|
|
86
|
+
];
|
|
87
|
+
__decorate([
|
|
88
|
+
property({ type: Object })
|
|
89
|
+
], OxPopupPartitionKeysInput.prototype, "value", void 0);
|
|
90
|
+
__decorate([
|
|
91
|
+
property({ type: String })
|
|
92
|
+
], OxPopupPartitionKeysInput.prototype, "valuetype", void 0);
|
|
93
|
+
__decorate([
|
|
94
|
+
property({ type: Object })
|
|
95
|
+
], OxPopupPartitionKeysInput.prototype, "confirmCallback", void 0);
|
|
96
|
+
OxPopupPartitionKeysInput = __decorate([
|
|
97
|
+
customElement('ox-popup-partition-keys-input')
|
|
98
|
+
], OxPopupPartitionKeysInput);
|
|
99
|
+
export { OxPopupPartitionKeysInput };
|
|
100
|
+
//# sourceMappingURL=ox-popup-partition-keys-input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ox-popup-partition-keys-input.js","sourceRoot":"","sources":["../../src/ox-popup-partition-keys-input.ts"],"names":[],"mappings":";AAAA,OAAO,2CAA2C,CAAA;AAElD,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGjD,IAAa,yBAAyB,GAAtC,MAAa,yBAA0B,SAAQ,UAAU;IAAzD;;QAsC8B,cAAS,GAAW,QAAQ,CAAA;IAgD1D,CAAC;IA7CC,MAAM;QACJ,OAAO,IAAI,CAAA;wCACyB,IAAI,CAAC,KAAK,YAAY,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;6BAGzD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;6BACtD,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;KAEhF,CAAA;IACH,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB;;;;;;;;;;UAUE;QAEF,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;YACjD,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA;SAChB;QAED,KAAK,IAAI,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE;YAC1B,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;SACvB;QAED,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,CAAA;IACrC,CAAC;IAEO,QAAQ,CAAC,CAAQ;QACvB,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;CACF,CAAA;AArFQ,gCAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+BF;CACF,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4DAA6B;AAC5B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kEAAwC;AAvCxD,yBAAyB;IADrC,aAAa,CAAC,+BAA+B,CAAC;GAClC,yBAAyB,CAsFrC;SAtFY,yBAAyB","sourcesContent":["import '@operato/input/ox-input-partition-keys.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-popup-partition-keys-input')\nexport class OxPopupPartitionKeysInput extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n\n width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-input-partition-keys {\n flex: 1;\n overflow-y: auto;\n padding: 10px;\n }\n\n span {\n flex: 1;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n color: var(--primary-color);\n }\n\n .button-container {\n display: flex;\n margin-left: auto;\n }\n `\n ]\n\n @property({ type: Object }) value: any\n @property({ type: String }) valuetype: string = 'string'\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n return html`\n <ox-input-partition-keys .value=${this.value} @change=${this.onChange.bind(this)}> </ox-input-partition-keys>\n\n <div class=\"button-container\">\n <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>\n <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>\n </div>\n `\n }\n\n private onChange(e: CustomEvent) {\n e.stopPropagation()\n\n /* \n 주의 : 이 팝업 템플릿은 layout 모듈에 의해서 render 되므로, \n layout의 구성에 변화가 발생하면, 다시 render된다.\n 이 팝업이 떠 있는 상태에서, 또 다른 팝업이 뜨는 경우도 layout 구성의 변화를 야기한다. (overlay의 갯수의 증가)\n 이 경우 value, options, confirmCallback 등 클로져를 사용한 것들이 초기 바인딩된 값으로 다시 바인딩되게 되는데,\n 만약, 템플릿 내부에서 이들 속성의 레퍼런스가 변화했다면, 원래 상태로 되돌아가는 현상이 발생하게 된다.\n 따라서, 가급적 이들 속성의 레퍼런스를 변화시키지 않는 것이 좋다.\n (이 팝업 클래스를 템플릿으로 사용한 곳의 코드를 참조하세요.)\n => \n 이런 이유로, Object.assign(...)을 사용하였다.\n */\n\n if (!this.value || typeof this.value !== 'object') {\n this.value = {}\n }\n\n for (let key in this.value) {\n delete this.value[key]\n }\n\n Object.assign(this.value, e.detail)\n }\n\n private onCancel(e: Event) {\n closePopup(this)\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n closePopup(this)\n }\n}\n"]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import '@operato/input/ox-input-value-map.js';
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
export declare class OxPopupValueMapInput extends LitElement {
|
|
4
|
+
static styles: import("lit").CSSResult[];
|
|
5
|
+
value: any;
|
|
6
|
+
valuetype: string;
|
|
7
|
+
confirmCallback: (newval: any) => void;
|
|
8
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
9
|
+
private onChange;
|
|
10
|
+
private onCancel;
|
|
11
|
+
private onConfirm;
|
|
12
|
+
}
|