@operato/input 1.13.14 → 1.17.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +18 -0
- package/dist/src/ox-input-data.d.ts +1 -0
- package/dist/src/ox-input-data.js +58 -20
- package/dist/src/ox-input-data.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/src/ox-input-data.ts +66 -22
- package/yarn-error.log +17084 -0
package/CHANGELOG.md
CHANGED
@@ -3,6 +3,24 @@
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
5
5
|
|
6
|
+
### [1.17.2](https://github.com/hatiolab/operato/compare/v1.17.1...v1.17.2) (2024-02-28)
|
7
|
+
|
8
|
+
**Note:** Version bump only for package @operato/input
|
9
|
+
|
10
|
+
|
11
|
+
|
12
|
+
|
13
|
+
|
14
|
+
### [1.14.3](https://github.com/hatiolab/operato/compare/v1.14.2...v1.14.3) (2024-02-05)
|
15
|
+
|
16
|
+
|
17
|
+
### :bug: Bug Fix
|
18
|
+
|
19
|
+
* bug on ox-input-data ([a277474](https://github.com/hatiolab/operato/commit/a2774741fd475e7458a5ad0a450a88a94ac0a53d))
|
20
|
+
* bug on ox-input-data ([6710eb1](https://github.com/hatiolab/operato/commit/6710eb12bfd4ab5cea30193e67bca327eeeaea28))
|
21
|
+
|
22
|
+
|
23
|
+
|
6
24
|
### [1.13.14](https://github.com/hatiolab/operato/compare/v1.13.13...v1.13.14) (2024-01-24)
|
7
25
|
|
8
26
|
|
@@ -15,6 +15,7 @@ export declare class OxInputData extends OxFormField {
|
|
15
15
|
static styles: import("lit").CSSResult[];
|
16
16
|
render(): import("lit").TemplateResult<1>;
|
17
17
|
firstUpdated(): void;
|
18
|
+
_setDataTypeAndValue(type: string | undefined | null, value: any): void;
|
18
19
|
_setDataType(type: string | undefined | null): void;
|
19
20
|
_clearData(): void;
|
20
21
|
_getStringData(data: any): string;
|
@@ -7,6 +7,7 @@ import { css, html } from 'lit';
|
|
7
7
|
import { customElement } from 'lit/decorators.js';
|
8
8
|
import { live } from 'lit/directives/live.js';
|
9
9
|
import { OxFormField } from './ox-form-field.js';
|
10
|
+
import { isEqual } from 'lodash-es';
|
10
11
|
/**
|
11
12
|
WEB Component for code-mirror based data editor.
|
12
13
|
|
@@ -83,7 +84,16 @@ let OxInputData = class OxInputData extends OxFormField {
|
|
83
84
|
<mwc-icon @click=${() => this._clearData()} title="delete">delete_forever</mwc-icon>
|
84
85
|
</div>
|
85
86
|
|
86
|
-
<ox-input-code
|
87
|
+
<ox-input-code
|
88
|
+
.value=${this._getStringData(this.value)}
|
89
|
+
language="text"
|
90
|
+
editor
|
91
|
+
?disabled=${this.disabled}
|
92
|
+
@change=${(e) => {
|
93
|
+
e.stopPropagation();
|
94
|
+
this._setDataTypeAndValue(valueType, e.target.value);
|
95
|
+
}}
|
96
|
+
>
|
87
97
|
</ox-input-code>
|
88
98
|
`;
|
89
99
|
}
|
@@ -99,28 +109,56 @@ let OxInputData = class OxInputData extends OxFormField {
|
|
99
109
|
}
|
100
110
|
});
|
101
111
|
}
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
break;
|
115
|
-
case 'object':
|
116
|
-
this.value = eval('(' + value + ')');
|
117
|
-
break;
|
118
|
-
}
|
112
|
+
_setDataTypeAndValue(type, value) {
|
113
|
+
/* value must be a string */
|
114
|
+
try {
|
115
|
+
switch (type) {
|
116
|
+
case 'number':
|
117
|
+
if (!isNaN(Number(value))) {
|
118
|
+
value = Number(value);
|
119
|
+
}
|
120
|
+
break;
|
121
|
+
case 'object':
|
122
|
+
value = eval('(' + value + ')');
|
123
|
+
break;
|
119
124
|
}
|
120
|
-
|
121
|
-
|
125
|
+
}
|
126
|
+
catch (e) { }
|
127
|
+
if (isEqual(this.value, value)) {
|
128
|
+
return;
|
129
|
+
}
|
130
|
+
this.value = value;
|
131
|
+
this.requestUpdate();
|
132
|
+
this._onAfterValueChange();
|
133
|
+
}
|
134
|
+
_setDataType(type) {
|
135
|
+
if (typeof this.value == type) {
|
136
|
+
return;
|
137
|
+
}
|
138
|
+
var value = this.value;
|
139
|
+
try {
|
140
|
+
switch (type) {
|
141
|
+
case 'string':
|
142
|
+
value = this._getStringData(value);
|
143
|
+
break;
|
144
|
+
case 'number':
|
145
|
+
if (!isNaN(value)) {
|
146
|
+
value = Number(value);
|
147
|
+
}
|
148
|
+
break;
|
149
|
+
case 'object':
|
150
|
+
value = eval('(' + value + ')');
|
151
|
+
break;
|
122
152
|
}
|
123
153
|
}
|
154
|
+
catch (e) {
|
155
|
+
console.log(e);
|
156
|
+
}
|
157
|
+
if (isEqual(this.value, value)) {
|
158
|
+
this.requestUpdate();
|
159
|
+
return;
|
160
|
+
}
|
161
|
+
this.value = value;
|
124
162
|
this.requestUpdate();
|
125
163
|
this._onAfterValueChange();
|
126
164
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ox-input-data.js","sourceRoot":"","sources":["../../src/ox-input-data.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,iBAAiB,CAAA;AAExB,OAAO,EAAE,GAAG,EAAE,IAAI,
|
1
|
+
{"version":3,"file":"ox-input-data.js","sourceRoot":"","sources":["../../src/ox-input-data.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport './ox-input-code'\n\nimport { css, html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport { live } from 'lit/directives/live.js'\n\nimport { OxFormField } from './ox-form-field.js'\nimport { OxInputCode } from './ox-input-code.js'\nimport { isEqual } from 'lodash-es'\n\n/**\nWEB Component for code-mirror based data editor.\n\nExample:\n\n <ox-input-data value=${text}>\n </ox-input-data>\n*/\n@customElement('ox-input-data')\nexport class OxInputData extends OxFormField {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n position: relative;\n }\n\n div[datatype] {\n display: flex;\n align-items: center;\n padding: 2px;\n background-color: rgba(0, 0, 0, 0.08);\n font-size: small;\n }\n\n div[datatype] mwc-icon {\n margin-left: auto;\n }\n\n ox-input-code {\n flex: 1;\n max-width: 260px;\n overflow: auto;\n }\n `\n ]\n\n render() {\n const valueType = typeof this.value\n\n return html`\n <div datatype>\n <input\n id=\"string\"\n type=\"radio\"\n name=\"data-type\"\n data-value=\"string\"\n .checked=${live(valueType == 'string')}\n @click=${() => this._setDataType('string')}\n ?disabled=${this.disabled}\n />\n <label for=\"string\">string</label>\n\n <input\n id=\"number\"\n type=\"radio\"\n name=\"data-type\"\n data-value=\"number\"\n .checked=${live(valueType == 'number')}\n @click=${() => this._setDataType('number')}\n ?disabled=${this.disabled}\n />\n <label for=\"number\">number</label>\n\n <input\n id=\"object\"\n type=\"radio\"\n name=\"data-type\"\n data-value=\"object\"\n .checked=${live(valueType == 'object')}\n @click=${() => this._setDataType('object')}\n ?disabled=${this.disabled}\n />\n <label for=\"object\">object</label>\n\n <mwc-icon @click=${() => this._clearData()} title=\"delete\">delete_forever</mwc-icon>\n </div>\n\n <ox-input-code\n .value=${this._getStringData(this.value)}\n language=\"text\"\n editor\n ?disabled=${this.disabled}\n @change=${(e: CustomEvent) => {\n e.stopPropagation()\n this._setDataTypeAndValue(valueType, (e.target as any).value)\n }}\n >\n </ox-input-code>\n `\n }\n\n firstUpdated() {\n this.renderRoot.addEventListener('change', e => {\n e.stopPropagation()\n\n const target = e.target as OxInputCode\n if (target.hasAttribute('editor')) {\n if (this.value === undefined && target.value == '') {\n return\n }\n this.value = target.value\n }\n })\n }\n\n _setDataTypeAndValue(type: string | undefined | null, value: any) {\n /* value must be a string */\n try {\n switch (type) {\n case 'number':\n if (!isNaN(Number(value))) {\n value = Number(value)\n }\n break\n case 'object':\n value = eval('(' + value + ')')\n break\n }\n } catch (e) {}\n\n if (isEqual(this.value, value)) {\n return\n }\n\n this.value = value\n\n this.requestUpdate()\n this._onAfterValueChange()\n }\n\n _setDataType(type: string | undefined | null) {\n if (typeof this.value == type) {\n return\n }\n\n var value = this.value\n\n try {\n switch (type) {\n case 'string':\n value = this._getStringData(value)\n break\n case 'number':\n if (!isNaN(value)) {\n value = Number(value)\n }\n break\n case 'object':\n value = eval('(' + value + ')')\n break\n }\n } catch (e) {\n console.log(e)\n }\n\n if (isEqual(this.value, value)) {\n this.requestUpdate()\n return\n }\n\n this.value = value\n\n this.requestUpdate()\n this._onAfterValueChange()\n }\n\n _clearData() {\n this.value = undefined\n this._onAfterValueChange()\n }\n\n _getStringData(data: any) {\n const type = typeof data\n\n switch (type) {\n case 'object':\n return JSON.stringify(data, null, 1)\n case 'undefined':\n return ''\n default:\n return String(data) || ''\n }\n }\n\n async _onAfterValueChange() {\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true\n })\n )\n }\n}\n"]}
|