@things-factory/integration-ui 9.0.0-beta.79 → 9.0.0-beta.80

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-client/analysis/graph-viewer.js +16 -1
  2. package/dist-client/analysis/graph-viewer.js.map +1 -1
  3. package/dist-client/editors/entity-editor.js +1 -2
  4. package/dist-client/editors/entity-editor.js.map +1 -1
  5. package/dist-client/editors/entity-selector.js +53 -33
  6. package/dist-client/editors/entity-selector.js.map +1 -1
  7. package/dist-client/editors/property-editor.js +3 -3
  8. package/dist-client/editors/property-editor.js.map +1 -1
  9. package/dist-client/editors/things-editor-db-procedure.js +98 -95
  10. package/dist-client/editors/things-editor-db-procedure.js.map +1 -1
  11. package/dist-client/editors/things-editor-entity-selector.js +27 -27
  12. package/dist-client/editors/things-editor-entity-selector.js.map +1 -1
  13. package/dist-client/editors/things-editor-http-body.js +50 -47
  14. package/dist-client/editors/things-editor-http-body.js.map +1 -1
  15. package/dist-client/editors/things-editor-http-headers.js +47 -47
  16. package/dist-client/editors/things-editor-http-headers.js.map +1 -1
  17. package/dist-client/editors/things-editor-http-parameters.js +47 -47
  18. package/dist-client/editors/things-editor-http-parameters.js.map +1 -1
  19. package/dist-client/editors/things-editor-tag-scenarios.js +63 -63
  20. package/dist-client/editors/things-editor-tag-scenarios.js.map +1 -1
  21. package/dist-client/grist/task-type-selector.js +1 -2
  22. package/dist-client/grist/task-type-selector.js.map +1 -1
  23. package/dist-client/pages/connection-importer.js +17 -18
  24. package/dist-client/pages/connection-importer.js.map +1 -1
  25. package/dist-client/pages/connection.js +30 -24
  26. package/dist-client/pages/connection.js.map +1 -1
  27. package/dist-client/pages/integration-analysis.js +31 -32
  28. package/dist-client/pages/integration-analysis.js.map +1 -1
  29. package/dist-client/pages/integration-monitor.js +63 -61
  30. package/dist-client/pages/integration-monitor.js.map +1 -1
  31. package/dist-client/pages/scenario-detail.js +19 -20
  32. package/dist-client/pages/scenario-detail.js.map +1 -1
  33. package/dist-client/pages/scenario-importer.js +17 -18
  34. package/dist-client/pages/scenario-importer.js.map +1 -1
  35. package/dist-client/pages/scenario.js +22 -7
  36. package/dist-client/pages/scenario.js.map +1 -1
  37. package/dist-client/pages/state-register.js +30 -22
  38. package/dist-client/pages/state-register.js.map +1 -1
  39. package/dist-client/tsconfig.tsbuildinfo +1 -1
  40. package/dist-client/viewparts/connections-monitor.js +77 -77
  41. package/dist-client/viewparts/connections-monitor.js.map +1 -1
  42. package/dist-client/viewparts/monitoring-summary.js +55 -55
  43. package/dist-client/viewparts/monitoring-summary.js.map +1 -1
  44. package/dist-client/viewparts/pending-q-monitor.js +110 -113
  45. package/dist-client/viewparts/pending-q-monitor.js.map +1 -1
  46. package/dist-client/viewparts/scenario-instance-log-view.js +45 -46
  47. package/dist-client/viewparts/scenario-instance-log-view.js.map +1 -1
  48. package/dist-client/viewparts/scenario-instance-monitor.js +73 -73
  49. package/dist-client/viewparts/scenario-instance-monitor.js.map +1 -1
  50. package/dist-client/viewparts/scenario-instance-view.js +107 -108
  51. package/dist-client/viewparts/scenario-instance-view.js.map +1 -1
  52. package/dist-client/viewparts/scenario-monitor.js +99 -99
  53. package/dist-client/viewparts/scenario-monitor.js.map +1 -1
  54. package/dist-client/viewparts/scenarios-monitor.js +36 -36
  55. package/dist-client/viewparts/scenarios-monitor.js.map +1 -1
  56. package/dist-server/tsconfig.tsbuildinfo +1 -1
  57. package/package.json +3 -3
@@ -28,12 +28,97 @@ let ThingsEditorProcedureParameters = class ThingsEditorProcedureParameters exte
28
28
  this.parameters = [];
29
29
  this._changingNow = false;
30
30
  }
31
+ static { this.styles = [
32
+ css `
33
+ :host {
34
+ display: flex;
35
+ flex-direction: column;
36
+ overflow: hidden;
37
+ margin-bottom: var(--spacing-large);
38
+ }
39
+
40
+ div {
41
+ display: flex;
42
+ flex-flow: row nowrap;
43
+ gap: var(--spacing-medium);
44
+ margin-bottom: var(--spacing-small);
45
+ }
46
+
47
+ pre {
48
+ flex: 1;
49
+ background-color: #333;
50
+ color: white;
51
+ margin: 0;
52
+ padding: 4px 6px;
53
+ font-size: 1.5em;
54
+ display: flex;
55
+ border-radius: var(--spacing-small);
56
+ }
57
+
58
+ code {
59
+ flex: 1;
60
+ white-space: pre;
61
+ min-height: 32px;
62
+ }
63
+
64
+ button {
65
+ border: var(--button-border);
66
+ border-radius: var(--border-radius);
67
+ background-color: var(--button-background-color);
68
+ padding: var(--spacing-small) var(--spacing-medium);
69
+ line-height: 0.8;
70
+ color: var(--button-color);
71
+ cursor: pointer;
72
+ }
73
+
74
+ button + button {
75
+ margin-left: -5px;
76
+ }
77
+
78
+ button md-icon {
79
+ --md-icon-size: var(--fontsize-default);
80
+ }
81
+
82
+ button:focus,
83
+ button:hover,
84
+ button:active {
85
+ border: var(--button-activ-border);
86
+ background-color: var(--button-background-focus-color);
87
+ color: var(--md-sys-color-on-primary);
88
+ }
89
+
90
+ input {
91
+ flex: 1;
92
+ border: 0;
93
+ border-bottom: var(--border-dim-color);
94
+ padding: var(--input-padding);
95
+ font: var(--input-font);
96
+ min-width: 50px;
97
+ }
98
+
99
+ input:focus {
100
+ outline: none;
101
+ border-bottom: 1px solid var(--md-sys-color-primary);
102
+ }
103
+
104
+ button.hidden {
105
+ opacity: 0;
106
+ cursor: default;
107
+ }
108
+
109
+ select,
110
+ ox-select,
111
+ input:not([type='checkbox']) {
112
+ border: 1px solid rgba(0, 0, 0, 0.2);
113
+ border-radius: 4px;
114
+ }
115
+ `
116
+ ]; }
31
117
  firstUpdated() {
32
118
  this.renderRoot.addEventListener('change', this._onChange.bind(this));
33
119
  }
34
120
  render() {
35
- var _a;
36
- const code = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.code) || '';
121
+ const code = this.value?.code || '';
37
122
  const parameters = this.parameters || [];
38
123
  const procedure = this.procedure || '';
39
124
  const dbtype = this.dbtype || 'oracle';
@@ -284,8 +369,8 @@ let ThingsEditorProcedureParameters = class ThingsEditorProcedureParameters exte
284
369
  return `${this.procedure}(${args});`;
285
370
  }
286
371
  _buildMssqlCode() {
287
- var _a, _b, _c;
288
- const declareClauses = (_a = this.parameters) === null || _a === void 0 ? void 0 : _a.map(({ name, dir, type, val, maxSize = 0 }) => {
372
+ const declareClauses = this.parameters
373
+ ?.map(({ name, dir, type, val, maxSize = 0 }) => {
289
374
  const ptype = PARAMETERIZED_TYPES.includes(type) ? `${type}(${maxSize})` : type;
290
375
  if (dir == 'Out') {
291
376
  return `DECLARE @${name} ${ptype};`;
@@ -294,10 +379,11 @@ let ThingsEditorProcedureParameters = class ThingsEditorProcedureParameters exte
294
379
  const pvalue = NUMBERS.includes(type) ? `${val}` : `'${val}'`;
295
380
  return `DECLARE @${name} ${ptype} = ${pvalue};`;
296
381
  }
297
- }).join('\n');
382
+ })
383
+ .join('\n');
298
384
  const execClause = [
299
385
  `EXEC ${this.procedure}`,
300
- ...(((_b = this.parameters) === null || _b === void 0 ? void 0 : _b.map(({ name, dir }, index, array) => {
386
+ ...(this.parameters?.map(({ name, dir }, index, array) => {
301
387
  const period = index === array.length - 1 ? '' : ',';
302
388
  if (dir == 'In') {
303
389
  return ` @${name} = @${name}${period}`;
@@ -305,13 +391,16 @@ let ThingsEditorProcedureParameters = class ThingsEditorProcedureParameters exte
305
391
  else {
306
392
  return ` @${name} = @${name} OUTPUT${period}`;
307
393
  }
308
- })) || [])
394
+ }) || [])
309
395
  ].join('\n') + ';';
310
396
  const seleceClause = `SELECT ` +
311
- ((_c = this.parameters) === null || _c === void 0 ? void 0 : _c.filter(({ dir }) => dir !== 'In').map(({ name }, index, array) => {
397
+ this.parameters
398
+ ?.filter(({ dir }) => dir !== 'In')
399
+ .map(({ name }, index, array) => {
312
400
  const period = index === array.length - 1 ? '' : ',';
313
401
  return `@${name} AS ${name}${period}`;
314
- }).join(' ')) +
402
+ })
403
+ .join(' ') +
315
404
  ';';
316
405
  return [declareClauses, execClause, seleceClause].filter(Boolean).join('\n\n');
317
406
  }
@@ -378,92 +467,6 @@ let ThingsEditorProcedureParameters = class ThingsEditorProcedureParameters exte
378
467
  this._updateValue();
379
468
  }
380
469
  };
381
- ThingsEditorProcedureParameters.styles = [
382
- css `
383
- :host {
384
- display: flex;
385
- flex-direction: column;
386
- overflow: hidden;
387
- margin-bottom: var(--spacing-large);
388
- }
389
-
390
- div {
391
- display: flex;
392
- flex-flow: row nowrap;
393
- gap: var(--spacing-medium);
394
- margin-bottom: var(--spacing-small);
395
- }
396
-
397
- pre {
398
- flex: 1;
399
- background-color: #333;
400
- color: white;
401
- margin: 0;
402
- padding: 4px 6px;
403
- font-size: 1.5em;
404
- display: flex;
405
- border-radius: var(--spacing-small);
406
- }
407
-
408
- code {
409
- flex: 1;
410
- white-space: pre;
411
- min-height: 32px;
412
- }
413
-
414
- button {
415
- border: var(--button-border);
416
- border-radius: var(--border-radius);
417
- background-color: var(--button-background-color);
418
- padding: var(--spacing-small) var(--spacing-medium);
419
- line-height: 0.8;
420
- color: var(--button-color);
421
- cursor: pointer;
422
- }
423
-
424
- button + button {
425
- margin-left: -5px;
426
- }
427
-
428
- button md-icon {
429
- --md-icon-size: var(--fontsize-default);
430
- }
431
-
432
- button:focus,
433
- button:hover,
434
- button:active {
435
- border: var(--button-activ-border);
436
- background-color: var(--button-background-focus-color);
437
- color: var(--md-sys-color-on-primary);
438
- }
439
-
440
- input {
441
- flex: 1;
442
- border: 0;
443
- border-bottom: var(--border-dim-color);
444
- padding: var(--input-padding);
445
- font: var(--input-font);
446
- min-width: 50px;
447
- }
448
-
449
- input:focus {
450
- outline: none;
451
- border-bottom: 1px solid var(--md-sys-color-primary);
452
- }
453
-
454
- button.hidden {
455
- opacity: 0;
456
- cursor: default;
457
- }
458
-
459
- select,
460
- ox-select,
461
- input:not([type='checkbox']) {
462
- border: 1px solid rgba(0, 0, 0, 0.2);
463
- border-radius: 4px;
464
- }
465
- `
466
- ];
467
470
  __decorate([
468
471
  property({ type: Object }),
469
472
  __metadata("design:type", Object)
@@ -1 +1 @@
1
- {"version":3,"file":"things-editor-db-procedure.js","sourceRoot":"","sources":["../../client/editors/things-editor-db-procedure.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/web/icon/icon.js'\n\nimport '@operato/i18n/ox-i18n.js'\nimport { css, html } from 'lit'\nimport { customElement, property, queryAll, state } from 'lit/decorators.js'\n\nimport { OxFormField } from '@operato/input'\n\ntype ProcedureParameterType = {\n name: string\n dir: string\n type: string\n val?: any\n accessor?: string\n maxSize?: number\n}\n\ntype ValueType = {\n code?: string\n procedure?: string\n parameters?: ProcedureParameterType[]\n}\n\nconst NUMBERS = ['TINYINT', 'SMALLINT', 'INT', 'BIGINT', 'FLOAT', 'READ', 'DECIMAL', 'NUMERIC', 'MONEY', 'SMALLMONEY']\nconst PARAMETERIZED_TYPES = ['NCHAR', 'VARCHAR', 'NVARCHAR', 'TEXT', 'NTEXT', 'DECIMAL', 'NUMERIC']\n\n/**\n input component for procedure-parameters\n \n Example:\n \n <things-editor-db-procedure \n value=${map}\n </things-editor-db-procedure>\n */\n@customElement('things-editor-db-procedure')\nexport class ThingsEditorProcedureParameters extends OxFormField {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n margin-bottom: var(--spacing-large);\n }\n\n div {\n display: flex;\n flex-flow: row nowrap;\n gap: var(--spacing-medium);\n margin-bottom: var(--spacing-small);\n }\n\n pre {\n flex: 1;\n background-color: #333;\n color: white;\n margin: 0;\n padding: 4px 6px;\n font-size: 1.5em;\n display: flex;\n border-radius: var(--spacing-small);\n }\n\n code {\n flex: 1;\n white-space: pre;\n min-height: 32px;\n }\n\n button {\n border: var(--button-border);\n border-radius: var(--border-radius);\n background-color: var(--button-background-color);\n padding: var(--spacing-small) var(--spacing-medium);\n line-height: 0.8;\n color: var(--button-color);\n cursor: pointer;\n }\n\n button + button {\n margin-left: -5px;\n }\n\n button md-icon {\n --md-icon-size: var(--fontsize-default);\n }\n\n button:focus,\n button:hover,\n button:active {\n border: var(--button-activ-border);\n background-color: var(--button-background-focus-color);\n color: var(--md-sys-color-on-primary);\n }\n\n input {\n flex: 1;\n border: 0;\n border-bottom: var(--border-dim-color);\n padding: var(--input-padding);\n font: var(--input-font);\n min-width: 50px;\n }\n\n input:focus {\n outline: none;\n border-bottom: 1px solid var(--md-sys-color-primary);\n }\n\n button.hidden {\n opacity: 0;\n cursor: default;\n }\n\n select,\n ox-select,\n input:not([type='checkbox']) {\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n }\n `\n ]\n\n @property({ type: Object }) value: ValueType = {}\n @property({ type: Array }) steps: string[] = []\n @property({ type: String }) dbtype: 'oracle' | 'mssql' = 'oracle'\n\n @state() private procedure?: string = ''\n @state() private parameters?: ProcedureParameterType[] = []\n private _changingNow: boolean = false\n\n @queryAll('[data-record]') records!: NodeListOf<HTMLElement>\n\n firstUpdated() {\n this.renderRoot.addEventListener('change', this._onChange.bind(this))\n }\n\n render() {\n const code = this.value?.code || ''\n const parameters = this.parameters || []\n const procedure = this.procedure || ''\n const dbtype = this.dbtype || 'oracle'\n\n const steps = this.steps || []\n\n return html`\n <div>\n <label><ox-i18n msgid=\"label.procedure-code\"></ox-i18n></label>\n </div>\n\n <div>\n <pre>\n <code>${code}</code>\n </pre\n >\n </div>\n\n <div>\n <label><ox-i18n msgid=\"label.procedure-name\"></ox-i18n></label>\n </div>\n\n <div>\n <input type=\"text\" data-procedure .value=${procedure} />\n </div>\n\n <div>\n <label><ox-i18n msgid=\"label.parameters\"></ox-i18n></label>\n </div>\n\n ${parameters.map(\n item => html`\n <div data-record>\n <input type=\"text\" data-name placeholder=\"name\" .value=${item.name} />\n <select data-dir placeholder=\"dir\" .value=${item.dir}>\n <option value=\"\" ?selected=${item.dir == ''}>&nbsp;</option>\n <option value=\"In\" ?selected=${item.dir == 'In'}>In</option>\n <option value=\"Inout\" ?selected=${item.dir == 'Inout'}>Inout</option>\n <option value=\"Out\" ?selected=${item.dir == 'Out'}>Out</option>\n </select>\n <select data-type placeholder=\"type\" .value=${item.type}>\n ${dbtype == 'oracle'\n ? html`\n <option value=\"\" ?selected=${item.type == ''}>&nbsp;</option>\n <option value=\"String\" ?selected=${item.type == 'String'}>String</option>\n <option value=\"Number\" ?selected=${item.type == 'Number'}>Number</option>\n <option value=\"Date\" ?selected=${item.type == 'Date'}>Date</option>\n <!-- \n <option value=\"Buffer\" ?selected=${item.type == 'Buffer'}>Buffer</option>\n <option value=\"Blob\" ?selected=${item.type == 'Blob'}>Blob</option>\n <option value=\"Clob\" ?selected=${item.type == 'Clob'}>Clob</option>\n -->\n <option value=\"Cursor\" ?selected=${item.type == 'Cursor'}>Cursor</option>\n `\n : html`\n <option value=\"\" ?selected=${item.type == ''}>&nbsp;</option>\n ${[\n 'CHAR',\n 'VARCHAR',\n 'NCHAR',\n 'NVARCHAR',\n 'TEXT',\n 'NTEXT',\n 'TINYINT',\n 'SMALLINT',\n 'INT',\n 'BIGINT',\n 'FLOAT',\n 'REAL',\n 'DECIMAL',\n 'NUMERIC',\n 'MONEY',\n 'SMALLMONEY',\n 'SMALLDATETIME',\n 'DATE',\n 'TIME',\n 'DATETIME',\n 'DATETIME2',\n 'DATETIMEOFFSET'\n ].map(type => html`<option value=${type} ?selected=${item.type == type}>${type}</option>`)}\n `}\n </select>\n <input type=\"text\" data-accessor placeholder=\"accessor\" .value=${item.accessor || ''} list=\"step-list\" />\n <input type=\"text\" data-val placeholder=\"val\" .value=${item.val || ''} />\n <input type=\"number\" data-max-size placeholder=\"max-size\" .value=${String(item.maxSize)} />\n\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._delete(e)} tabindex=\"-1\">\n <md-icon>remove</md-icon>\n </button>\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._up(e)} tabindex=\"-1\">\n <md-icon>arrow_upward</md-icon>\n </button>\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._down(e)} tabindex=\"-1\">\n <md-icon>arrow_downward</md-icon>\n </button>\n </div>\n `\n )}\n\n <div data-record-new>\n <input type=\"text\" data-name placeholder=\"name\" value=\"\" />\n <select data-dir placeholder=\"dir\">\n <option value=\"\" selected>&nbsp;</option>\n <option value=\"In\">In</option>\n <option value=\"Inout\">Inout</option>\n <option value=\"Out\">Out</option>\n </select>\n <select data-type placeholder=\"type\" value=\"\">\n ${dbtype == 'oracle'\n ? html`\n <option value=\"\" selected>&nbsp;</option>\n <option value=\"String\">String</option>\n <option value=\"Number\">Number</option>\n <option value=\"Date\">Date</option>\n <!-- \n <option value=\"Buffer\">Buffer</option>\n <option value=\"Blob\">Blob</option>\n <option value=\"Clob\">Clob</option>\n -->\n <option value=\"Cursor\">Cursor</option>\n `\n : html`\n <option value=\"\" selected>&nbsp;</option>\n ${[\n 'CHAR',\n 'VARCHAR',\n 'NCHAR',\n 'NVARCHAR',\n 'TEXT',\n 'NTEXT',\n 'TINYINT',\n 'SMALLINT',\n 'INT',\n 'BIGINT',\n 'FLOAT',\n 'REAL',\n 'DECIMAL',\n 'NUMERIC',\n 'MONEY',\n 'SMALLMONEY',\n 'SMALLDATETIME',\n 'DATE',\n 'TIME',\n 'DATETIME',\n 'DATETIME2',\n 'DATETIMEOFFSET'\n ].map(type => html`<option value=${type}>${type}</option>`)}\n `}\n </select>\n <input type=\"text\" data-accessor placeholder=\"accessor\" value=\"\" list=\"step-list\" />\n <input type=\"text\" data-val placeholder=\"val\" value=\"\" />\n <input type=\"number\" data-max-size placeholder=\"max-size\" value=\"\" />\n\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._add()} tabindex=\"-1\">\n <md-icon>add</md-icon>\n </button>\n <button class=\"hidden\"><md-icon>add</md-icon></button>\n <button class=\"hidden\"><md-icon>add</md-icon></button>\n </div>\n\n <datalist id=\"step-list\">${steps.map(id => html` <option value=${id}></option> `)}</datalist>\n `\n }\n\n updated(changes: any) {\n if (changes.has('value')) {\n /* 하위 호환성때문에, Array타입 값을 처리하도록 함. 다음 마이너 업그레이드시에 제거할 것. */\n const value = (Array.isArray(this.value) ? { parameters: this.value } : this.value) as ValueType\n\n const { procedure, parameters } = value || {}\n\n this.procedure = procedure\n this.parameters = parameters\n }\n }\n\n _onChange(e: Event) {\n if (this._changingNow) {\n return\n }\n\n this._changingNow = true\n\n const input = e.target as HTMLInputElement\n\n if (input.hasAttribute('data-procedure')) {\n this.procedure = input.value\n this._updateValue()\n } else {\n const record = (e.target as Element).closest('[data-record],[data-record-new]') as HTMLElement\n\n if (record.hasAttribute('data-record')) {\n this._build()\n } else if (record.hasAttribute('data-record-new') && input.hasAttribute('data-type')) {\n this._add()\n }\n }\n\n this._changingNow = false\n }\n\n _adjust({ name, type, dir, maxSize, val, accessor }: ProcedureParameterType): ProcedureParameterType {\n const entry = {\n name: name && String(name).trim(),\n type,\n dir,\n accessor: accessor && String(accessor).trim()\n } as ProcedureParameterType\n\n if (\n /* for oracle */\n dir != 'In' &&\n (type == 'String' || type == 'Buffer') &&\n maxSize !== null &&\n maxSize !== undefined &&\n !isNaN(maxSize)\n ) {\n entry.maxSize = maxSize\n } else if (\n /* for mssql */\n PARAMETERIZED_TYPES.includes(type) &&\n maxSize !== null &&\n maxSize !== undefined &&\n !isNaN(maxSize)\n ) {\n entry.maxSize = maxSize\n }\n\n if (dir != 'Out' && val !== null && val !== undefined && val != '') {\n entry.val = type == 'Number' || NUMBERS.includes(type) ? Number(val) : val\n }\n\n return entry\n }\n\n _build(includeNewRecord?: boolean) {\n if (includeNewRecord) {\n var records = this.renderRoot.querySelectorAll('[data-record],[data-record-new]') as NodeListOf<HTMLElement>\n } else {\n var records = this.renderRoot.querySelectorAll('[data-record]') as NodeListOf<HTMLElement>\n }\n\n var newmap: ProcedureParameterType[] = []\n\n for (var i = 0; i < records.length; i++) {\n var record = records[i]\n\n const name = (record.querySelector('[data-name]') as HTMLInputElement).value\n const type = (record.querySelector('[data-type]') as HTMLInputElement).value\n const dir = (record.querySelector('[data-dir]') as HTMLInputElement).value\n const val = (record.querySelector('[data-val]') as HTMLInputElement).value\n const accessor = (record.querySelector('[data-accessor]') as HTMLInputElement).value\n const maxSize = (record.querySelector('[data-max-size]') as HTMLInputElement).valueAsNumber\n\n const inputs = record.querySelectorAll(\n '[data-type]:not([style*=\"display: none\"])'\n ) as NodeListOf<HTMLInputElement>\n\n if (!inputs || inputs.length == 0) {\n continue\n }\n\n if (name) {\n newmap.push(this._adjust({ name, type, dir, val, accessor, maxSize }))\n }\n }\n\n this.parameters = newmap\n this._updateValue()\n }\n\n _buildOracleCode() {\n const args = (this.parameters || []).map(p => ':' + p.name).join(', ')\n\n return `${this.procedure}(${args});`\n }\n\n _buildMssqlCode() {\n const declareClauses = this.parameters\n ?.map(({ name, dir, type, val, maxSize = 0 }) => {\n const ptype = PARAMETERIZED_TYPES.includes(type) ? `${type}(${maxSize})` : type\n\n if (dir == 'Out') {\n return `DECLARE @${name} ${ptype};`\n } else {\n const pvalue = NUMBERS.includes(type) ? `${val}` : `'${val}'`\n return `DECLARE @${name} ${ptype} = ${pvalue};`\n }\n })\n .join('\\n')\n\n const execClause =\n [\n `EXEC ${this.procedure}`,\n ...(this.parameters?.map(({ name, dir }, index, array) => {\n const period = index === array.length - 1 ? '' : ','\n\n if (dir == 'In') {\n return ` @${name} = @${name}${period}`\n } else {\n return ` @${name} = @${name} OUTPUT${period}`\n }\n }) || [])\n ].join('\\n') + ';'\n\n const seleceClause =\n `SELECT ` +\n this.parameters\n ?.filter(({ dir }) => dir !== 'In')\n .map(({ name }, index, array) => {\n const period = index === array.length - 1 ? '' : ','\n\n return `@${name} AS ${name}${period}`\n })\n .join(' ') +\n ';'\n\n return [declareClauses, execClause, seleceClause].filter(Boolean).join('\\n\\n')\n }\n\n _updateValue() {\n this.value = {\n code: this.dbtype == 'oracle' ? this._buildOracleCode() : this._buildMssqlCode(),\n procedure: this.procedure,\n parameters: this.parameters\n }\n\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))\n }\n\n _add() {\n this._build(true)\n\n const inputs = this.renderRoot.querySelectorAll(\n '[data-record-new] input:not([style*=\"display: none\"])'\n ) as NodeListOf<HTMLInputElement & { value: any }>\n\n for (var i = 0; i < inputs.length; i++) {\n let input = inputs[i]\n\n input.value = ''\n }\n\n inputs[0].focus()\n }\n\n _delete(e: MouseEvent) {\n const record = (e.target as Element).closest('[data-record]') as HTMLElement\n\n ;(record!.querySelector('[data-name]') as HTMLInputElement)!.value = ''\n\n this._build()\n }\n\n _up(e: MouseEvent) {\n const record = (e.target as Element).closest('[data-record]') as HTMLElement\n const array = Array.from(this.records)\n const index = array.indexOf(record) - 1\n\n if (index < 0) {\n return\n }\n\n const deleted = array.splice(index, 1)\n array.splice(index + 1, 0, ...deleted)\n\n this.parameters = array.map(record => {\n const name = (record.querySelector('[data-name]') as HTMLInputElement).value\n const dir = (record.querySelector('[data-dir]') as HTMLInputElement).value\n const type = (record.querySelector('[data-type]') as HTMLInputElement).value\n const val = (record.querySelector('[data-val]') as HTMLInputElement).value\n const accessor = (record.querySelector('[data-accessor]') as HTMLInputElement).value\n const maxSize = (record.querySelector('[data-max-size]') as HTMLInputElement).valueAsNumber\n\n return this._adjust({ name, dir, type, val, accessor, maxSize })\n })\n\n this._updateValue()\n }\n\n _down(e: MouseEvent) {\n const record = (e.target as Element).closest('[data-record]') as HTMLElement\n const array = Array.from(this.records)\n const index = array.indexOf(record)\n\n if (index > array.length) {\n return\n }\n\n array.splice(index, 1)\n array.splice(index + 1, 0, record)\n\n this.parameters = array.map(record => {\n const name = (record.querySelector('[data-name]') as HTMLInputElement).value\n const dir = (record.querySelector('[data-dir]') as HTMLInputElement).value\n const type = (record.querySelector('[data-type]') as HTMLInputElement).value\n const val = (record.querySelector('[data-val]') as HTMLInputElement).value\n const accessor = (record.querySelector('[data-accessor]') as HTMLInputElement).value\n const maxSize = (record.querySelector('[data-max-size]') as HTMLInputElement).valueAsNumber\n\n return this._adjust({ name, dir, type, val, accessor, maxSize })\n })\n\n this._updateValue()\n }\n}\n"]}
1
+ {"version":3,"file":"things-editor-db-procedure.js","sourceRoot":"","sources":["../../client/editors/things-editor-db-procedure.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/web/icon/icon.js'\n\nimport '@operato/i18n/ox-i18n.js'\nimport { css, html } from 'lit'\nimport { customElement, property, queryAll, state } from 'lit/decorators.js'\n\nimport { OxFormField } from '@operato/input'\n\ntype ProcedureParameterType = {\n name: string\n dir: string\n type: string\n val?: any\n accessor?: string\n maxSize?: number\n}\n\ntype ValueType = {\n code?: string\n procedure?: string\n parameters?: ProcedureParameterType[]\n}\n\nconst NUMBERS = ['TINYINT', 'SMALLINT', 'INT', 'BIGINT', 'FLOAT', 'READ', 'DECIMAL', 'NUMERIC', 'MONEY', 'SMALLMONEY']\nconst PARAMETERIZED_TYPES = ['NCHAR', 'VARCHAR', 'NVARCHAR', 'TEXT', 'NTEXT', 'DECIMAL', 'NUMERIC']\n\n/**\n input component for procedure-parameters\n \n Example:\n \n <things-editor-db-procedure \n value=${map}\n </things-editor-db-procedure>\n */\n@customElement('things-editor-db-procedure')\nexport class ThingsEditorProcedureParameters extends OxFormField {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n margin-bottom: var(--spacing-large);\n }\n\n div {\n display: flex;\n flex-flow: row nowrap;\n gap: var(--spacing-medium);\n margin-bottom: var(--spacing-small);\n }\n\n pre {\n flex: 1;\n background-color: #333;\n color: white;\n margin: 0;\n padding: 4px 6px;\n font-size: 1.5em;\n display: flex;\n border-radius: var(--spacing-small);\n }\n\n code {\n flex: 1;\n white-space: pre;\n min-height: 32px;\n }\n\n button {\n border: var(--button-border);\n border-radius: var(--border-radius);\n background-color: var(--button-background-color);\n padding: var(--spacing-small) var(--spacing-medium);\n line-height: 0.8;\n color: var(--button-color);\n cursor: pointer;\n }\n\n button + button {\n margin-left: -5px;\n }\n\n button md-icon {\n --md-icon-size: var(--fontsize-default);\n }\n\n button:focus,\n button:hover,\n button:active {\n border: var(--button-activ-border);\n background-color: var(--button-background-focus-color);\n color: var(--md-sys-color-on-primary);\n }\n\n input {\n flex: 1;\n border: 0;\n border-bottom: var(--border-dim-color);\n padding: var(--input-padding);\n font: var(--input-font);\n min-width: 50px;\n }\n\n input:focus {\n outline: none;\n border-bottom: 1px solid var(--md-sys-color-primary);\n }\n\n button.hidden {\n opacity: 0;\n cursor: default;\n }\n\n select,\n ox-select,\n input:not([type='checkbox']) {\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n }\n `\n ]\n\n @property({ type: Object }) value: ValueType = {}\n @property({ type: Array }) steps: string[] = []\n @property({ type: String }) dbtype: 'oracle' | 'mssql' = 'oracle'\n\n @state() private procedure?: string = ''\n @state() private parameters?: ProcedureParameterType[] = []\n private _changingNow: boolean = false\n\n @queryAll('[data-record]') records!: NodeListOf<HTMLElement>\n\n firstUpdated() {\n this.renderRoot.addEventListener('change', this._onChange.bind(this))\n }\n\n render() {\n const code = this.value?.code || ''\n const parameters = this.parameters || []\n const procedure = this.procedure || ''\n const dbtype = this.dbtype || 'oracle'\n\n const steps = this.steps || []\n\n return html`\n <div>\n <label><ox-i18n msgid=\"label.procedure-code\"></ox-i18n></label>\n </div>\n\n <div>\n <pre>\n <code>${code}</code>\n </pre\n >\n </div>\n\n <div>\n <label><ox-i18n msgid=\"label.procedure-name\"></ox-i18n></label>\n </div>\n\n <div>\n <input type=\"text\" data-procedure .value=${procedure} />\n </div>\n\n <div>\n <label><ox-i18n msgid=\"label.parameters\"></ox-i18n></label>\n </div>\n\n ${parameters.map(\n item => html`\n <div data-record>\n <input type=\"text\" data-name placeholder=\"name\" .value=${item.name} />\n <select data-dir placeholder=\"dir\" .value=${item.dir}>\n <option value=\"\" ?selected=${item.dir == ''}>&nbsp;</option>\n <option value=\"In\" ?selected=${item.dir == 'In'}>In</option>\n <option value=\"Inout\" ?selected=${item.dir == 'Inout'}>Inout</option>\n <option value=\"Out\" ?selected=${item.dir == 'Out'}>Out</option>\n </select>\n <select data-type placeholder=\"type\" .value=${item.type}>\n ${dbtype == 'oracle'\n ? html`\n <option value=\"\" ?selected=${item.type == ''}>&nbsp;</option>\n <option value=\"String\" ?selected=${item.type == 'String'}>String</option>\n <option value=\"Number\" ?selected=${item.type == 'Number'}>Number</option>\n <option value=\"Date\" ?selected=${item.type == 'Date'}>Date</option>\n <!-- \n <option value=\"Buffer\" ?selected=${item.type == 'Buffer'}>Buffer</option>\n <option value=\"Blob\" ?selected=${item.type == 'Blob'}>Blob</option>\n <option value=\"Clob\" ?selected=${item.type == 'Clob'}>Clob</option>\n -->\n <option value=\"Cursor\" ?selected=${item.type == 'Cursor'}>Cursor</option>\n `\n : html`\n <option value=\"\" ?selected=${item.type == ''}>&nbsp;</option>\n ${[\n 'CHAR',\n 'VARCHAR',\n 'NCHAR',\n 'NVARCHAR',\n 'TEXT',\n 'NTEXT',\n 'TINYINT',\n 'SMALLINT',\n 'INT',\n 'BIGINT',\n 'FLOAT',\n 'REAL',\n 'DECIMAL',\n 'NUMERIC',\n 'MONEY',\n 'SMALLMONEY',\n 'SMALLDATETIME',\n 'DATE',\n 'TIME',\n 'DATETIME',\n 'DATETIME2',\n 'DATETIMEOFFSET'\n ].map(type => html`<option value=${type} ?selected=${item.type == type}>${type}</option>`)}\n `}\n </select>\n <input type=\"text\" data-accessor placeholder=\"accessor\" .value=${item.accessor || ''} list=\"step-list\" />\n <input type=\"text\" data-val placeholder=\"val\" .value=${item.val || ''} />\n <input type=\"number\" data-max-size placeholder=\"max-size\" .value=${String(item.maxSize)} />\n\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._delete(e)} tabindex=\"-1\">\n <md-icon>remove</md-icon>\n </button>\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._up(e)} tabindex=\"-1\">\n <md-icon>arrow_upward</md-icon>\n </button>\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._down(e)} tabindex=\"-1\">\n <md-icon>arrow_downward</md-icon>\n </button>\n </div>\n `\n )}\n\n <div data-record-new>\n <input type=\"text\" data-name placeholder=\"name\" value=\"\" />\n <select data-dir placeholder=\"dir\">\n <option value=\"\" selected>&nbsp;</option>\n <option value=\"In\">In</option>\n <option value=\"Inout\">Inout</option>\n <option value=\"Out\">Out</option>\n </select>\n <select data-type placeholder=\"type\" value=\"\">\n ${dbtype == 'oracle'\n ? html`\n <option value=\"\" selected>&nbsp;</option>\n <option value=\"String\">String</option>\n <option value=\"Number\">Number</option>\n <option value=\"Date\">Date</option>\n <!-- \n <option value=\"Buffer\">Buffer</option>\n <option value=\"Blob\">Blob</option>\n <option value=\"Clob\">Clob</option>\n -->\n <option value=\"Cursor\">Cursor</option>\n `\n : html`\n <option value=\"\" selected>&nbsp;</option>\n ${[\n 'CHAR',\n 'VARCHAR',\n 'NCHAR',\n 'NVARCHAR',\n 'TEXT',\n 'NTEXT',\n 'TINYINT',\n 'SMALLINT',\n 'INT',\n 'BIGINT',\n 'FLOAT',\n 'REAL',\n 'DECIMAL',\n 'NUMERIC',\n 'MONEY',\n 'SMALLMONEY',\n 'SMALLDATETIME',\n 'DATE',\n 'TIME',\n 'DATETIME',\n 'DATETIME2',\n 'DATETIMEOFFSET'\n ].map(type => html`<option value=${type}>${type}</option>`)}\n `}\n </select>\n <input type=\"text\" data-accessor placeholder=\"accessor\" value=\"\" list=\"step-list\" />\n <input type=\"text\" data-val placeholder=\"val\" value=\"\" />\n <input type=\"number\" data-max-size placeholder=\"max-size\" value=\"\" />\n\n <button class=\"record-action\" @click=${(e: MouseEvent) => this._add()} tabindex=\"-1\">\n <md-icon>add</md-icon>\n </button>\n <button class=\"hidden\"><md-icon>add</md-icon></button>\n <button class=\"hidden\"><md-icon>add</md-icon></button>\n </div>\n\n <datalist id=\"step-list\">${steps.map(id => html` <option value=${id}></option> `)}</datalist>\n `\n }\n\n updated(changes: any) {\n if (changes.has('value')) {\n /* 하위 호환성때문에, Array타입 값을 처리하도록 함. 다음 마이너 업그레이드시에 제거할 것. */\n const value = (Array.isArray(this.value) ? { parameters: this.value } : this.value) as ValueType\n\n const { procedure, parameters } = value || {}\n\n this.procedure = procedure\n this.parameters = parameters\n }\n }\n\n _onChange(e: Event) {\n if (this._changingNow) {\n return\n }\n\n this._changingNow = true\n\n const input = e.target as HTMLInputElement\n\n if (input.hasAttribute('data-procedure')) {\n this.procedure = input.value\n this._updateValue()\n } else {\n const record = (e.target as Element).closest('[data-record],[data-record-new]') as HTMLElement\n\n if (record.hasAttribute('data-record')) {\n this._build()\n } else if (record.hasAttribute('data-record-new') && input.hasAttribute('data-type')) {\n this._add()\n }\n }\n\n this._changingNow = false\n }\n\n _adjust({ name, type, dir, maxSize, val, accessor }: ProcedureParameterType): ProcedureParameterType {\n const entry = {\n name: name && String(name).trim(),\n type,\n dir,\n accessor: accessor && String(accessor).trim()\n } as ProcedureParameterType\n\n if (\n /* for oracle */\n dir != 'In' &&\n (type == 'String' || type == 'Buffer') &&\n maxSize !== null &&\n maxSize !== undefined &&\n !isNaN(maxSize)\n ) {\n entry.maxSize = maxSize\n } else if (\n /* for mssql */\n PARAMETERIZED_TYPES.includes(type) &&\n maxSize !== null &&\n maxSize !== undefined &&\n !isNaN(maxSize)\n ) {\n entry.maxSize = maxSize\n }\n\n if (dir != 'Out' && val !== null && val !== undefined && val != '') {\n entry.val = type == 'Number' || NUMBERS.includes(type) ? Number(val) : val\n }\n\n return entry\n }\n\n _build(includeNewRecord?: boolean) {\n if (includeNewRecord) {\n var records = this.renderRoot.querySelectorAll('[data-record],[data-record-new]') as NodeListOf<HTMLElement>\n } else {\n var records = this.renderRoot.querySelectorAll('[data-record]') as NodeListOf<HTMLElement>\n }\n\n var newmap: ProcedureParameterType[] = []\n\n for (var i = 0; i < records.length; i++) {\n var record = records[i]\n\n const name = (record.querySelector('[data-name]') as HTMLInputElement).value\n const type = (record.querySelector('[data-type]') as HTMLInputElement).value\n const dir = (record.querySelector('[data-dir]') as HTMLInputElement).value\n const val = (record.querySelector('[data-val]') as HTMLInputElement).value\n const accessor = (record.querySelector('[data-accessor]') as HTMLInputElement).value\n const maxSize = (record.querySelector('[data-max-size]') as HTMLInputElement).valueAsNumber\n\n const inputs = record.querySelectorAll(\n '[data-type]:not([style*=\"display: none\"])'\n ) as NodeListOf<HTMLInputElement>\n\n if (!inputs || inputs.length == 0) {\n continue\n }\n\n if (name) {\n newmap.push(this._adjust({ name, type, dir, val, accessor, maxSize }))\n }\n }\n\n this.parameters = newmap\n this._updateValue()\n }\n\n _buildOracleCode() {\n const args = (this.parameters || []).map(p => ':' + p.name).join(', ')\n\n return `${this.procedure}(${args});`\n }\n\n _buildMssqlCode() {\n const declareClauses = this.parameters\n ?.map(({ name, dir, type, val, maxSize = 0 }) => {\n const ptype = PARAMETERIZED_TYPES.includes(type) ? `${type}(${maxSize})` : type\n\n if (dir == 'Out') {\n return `DECLARE @${name} ${ptype};`\n } else {\n const pvalue = NUMBERS.includes(type) ? `${val}` : `'${val}'`\n return `DECLARE @${name} ${ptype} = ${pvalue};`\n }\n })\n .join('\\n')\n\n const execClause =\n [\n `EXEC ${this.procedure}`,\n ...(this.parameters?.map(({ name, dir }, index, array) => {\n const period = index === array.length - 1 ? '' : ','\n\n if (dir == 'In') {\n return ` @${name} = @${name}${period}`\n } else {\n return ` @${name} = @${name} OUTPUT${period}`\n }\n }) || [])\n ].join('\\n') + ';'\n\n const seleceClause =\n `SELECT ` +\n this.parameters\n ?.filter(({ dir }) => dir !== 'In')\n .map(({ name }, index, array) => {\n const period = index === array.length - 1 ? '' : ','\n\n return `@${name} AS ${name}${period}`\n })\n .join(' ') +\n ';'\n\n return [declareClauses, execClause, seleceClause].filter(Boolean).join('\\n\\n')\n }\n\n _updateValue() {\n this.value = {\n code: this.dbtype == 'oracle' ? this._buildOracleCode() : this._buildMssqlCode(),\n procedure: this.procedure,\n parameters: this.parameters\n }\n\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))\n }\n\n _add() {\n this._build(true)\n\n const inputs = this.renderRoot.querySelectorAll(\n '[data-record-new] input:not([style*=\"display: none\"])'\n ) as NodeListOf<HTMLInputElement & { value: any }>\n\n for (var i = 0; i < inputs.length; i++) {\n let input = inputs[i]\n\n input.value = ''\n }\n\n inputs[0].focus()\n }\n\n _delete(e: MouseEvent) {\n const record = (e.target as Element).closest('[data-record]') as HTMLElement\n\n ;(record!.querySelector('[data-name]') as HTMLInputElement)!.value = ''\n\n this._build()\n }\n\n _up(e: MouseEvent) {\n const record = (e.target as Element).closest('[data-record]') as HTMLElement\n const array = Array.from(this.records)\n const index = array.indexOf(record) - 1\n\n if (index < 0) {\n return\n }\n\n const deleted = array.splice(index, 1)\n array.splice(index + 1, 0, ...deleted)\n\n this.parameters = array.map(record => {\n const name = (record.querySelector('[data-name]') as HTMLInputElement).value\n const dir = (record.querySelector('[data-dir]') as HTMLInputElement).value\n const type = (record.querySelector('[data-type]') as HTMLInputElement).value\n const val = (record.querySelector('[data-val]') as HTMLInputElement).value\n const accessor = (record.querySelector('[data-accessor]') as HTMLInputElement).value\n const maxSize = (record.querySelector('[data-max-size]') as HTMLInputElement).valueAsNumber\n\n return this._adjust({ name, dir, type, val, accessor, maxSize })\n })\n\n this._updateValue()\n }\n\n _down(e: MouseEvent) {\n const record = (e.target as Element).closest('[data-record]') as HTMLElement\n const array = Array.from(this.records)\n const index = array.indexOf(record)\n\n if (index > array.length) {\n return\n }\n\n array.splice(index, 1)\n array.splice(index + 1, 0, record)\n\n this.parameters = array.map(record => {\n const name = (record.querySelector('[data-name]') as HTMLInputElement).value\n const dir = (record.querySelector('[data-dir]') as HTMLInputElement).value\n const type = (record.querySelector('[data-type]') as HTMLInputElement).value\n const val = (record.querySelector('[data-val]') as HTMLInputElement).value\n const accessor = (record.querySelector('[data-accessor]') as HTMLInputElement).value\n const maxSize = (record.querySelector('[data-max-size]') as HTMLInputElement).valueAsNumber\n\n return this._adjust({ name, dir, type, val, accessor, maxSize })\n })\n\n this._updateValue()\n }\n}\n"]}
@@ -9,6 +9,33 @@ import { customElement, property } from 'lit/decorators.js';
9
9
  import { i18next } from '@operato/i18n';
10
10
  import { openPopup } from '@operato/layout';
11
11
  let ThingsEditorEntitySelector = class ThingsEditorEntitySelector extends LitElement {
12
+ static { this.styles = [
13
+ css `
14
+ :host {
15
+ position: relative;
16
+ display: inline-block;
17
+ }
18
+
19
+ input[type='text'] {
20
+ box-sizing: border-box;
21
+ width: 100%;
22
+ height: 100%;
23
+ }
24
+
25
+ md-icon {
26
+ position: absolute;
27
+ top: 0;
28
+ right: 0;
29
+ }
30
+
31
+ select,
32
+ ox-select,
33
+ input:not([type='checkbox']) {
34
+ border: 1px solid rgba(0, 0, 0, 0.2);
35
+ border-radius: 4px;
36
+ }
37
+ `
38
+ ]; }
12
39
  render() {
13
40
  return html `
14
41
  <input id="text" type="text" .value=${this.value || ''} @change=${e => this._onInputChanged(e)} />
@@ -52,33 +79,6 @@ let ThingsEditorEntitySelector = class ThingsEditorEntitySelector extends LitEle
52
79
  });
53
80
  }
54
81
  };
55
- ThingsEditorEntitySelector.styles = [
56
- css `
57
- :host {
58
- position: relative;
59
- display: inline-block;
60
- }
61
-
62
- input[type='text'] {
63
- box-sizing: border-box;
64
- width: 100%;
65
- height: 100%;
66
- }
67
-
68
- md-icon {
69
- position: absolute;
70
- top: 0;
71
- right: 0;
72
- }
73
-
74
- select,
75
- ox-select,
76
- input:not([type='checkbox']) {
77
- border: 1px solid rgba(0, 0, 0, 0.2);
78
- border-radius: 4px;
79
- }
80
- `
81
- ];
82
82
  __decorate([
83
83
  property({ type: String }),
84
84
  __metadata("design:type", String)
@@ -1 +1 @@
1
- {"version":3,"file":"things-editor-entity-selector.js","sourceRoot":"","sources":["../../client/editors/things-editor-entity-selector.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,4BAA4B,CAAA;AACnC,OAAO,sBAAsB,CAAA;AAE7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAG5B,IAAM,0BAA0B,GAAhC,MAAM,0BAA2B,SAAQ,UAAU;IAkChE,MAAM;QACJ,OAAO,IAAI,CAAA;4CAC6B,IAAI,CAAC,KAAK,IAAI,EAAE,YAAY,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC;;wBAE5E,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE;KAC3C,CAAA;IACH,CAAC;IAED,eAAe,CAAC,CAAC;QACf,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAA;QAC3B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;YACxB,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CACH,CAAA;IACH,CAAC;IAED,YAAY;QACV,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,OAAO,IAAI,CAAC,KAAK,CAAA;QACnB,CAAC;QAED,IAAI,QAAQ,GAAG,IAAI,CAAA;;qBAEF,IAAI;qBACJ,IAAI,CAAC,UAAU,CAAC,SAAS;iBAC7B,IAAI,CAAC,KAAK;2BACA,CAAC,CAAC,EAAE;YACrB,CAAC,CAAC,eAAe,EAAE,CAAA;YAEnB,IAAI,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,MAAM,CAAA;YAC5B,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,IAAI,IAAI,CAAC,CAAA;YAErD,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;gBACxB,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CACH,CAAA;YAED,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;QAClC,CAAC;;KAEJ,CAAA;QAED,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,QAAQ,EAAE;YAC/B,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,qBAAqB,CAAC;SACxC,CAAC,CAAA;IACJ,CAAC;;AAtFM,iCAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;KAwBF;CACF,AA1BY,CA0BZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;yDAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;8DAAgB;AA9BxB,0BAA0B;IAD9C,aAAa,CAAC,+BAA+B,CAAC;GAC1B,0BAA0B,CAwF9C;eAxFoB,0BAA0B","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/web/icon/icon.js'\nimport './entity-selector.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\n\n@customElement('things-editor-entity-selector')\nexport default class ThingsEditorEntitySelector extends LitElement {\n static styles = [\n css`\n :host {\n position: relative;\n display: inline-block;\n }\n\n input[type='text'] {\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n }\n\n md-icon {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n select,\n ox-select,\n input:not([type='checkbox']) {\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n }\n `\n ]\n\n @property({ type: String }) value?: string\n @property({ type: Object }) properties: any\n\n popup: any\n\n render() {\n return html`\n <input id=\"text\" type=\"text\" .value=${this.value || ''} @change=${e => this._onInputChanged(e)} />\n\n <md-icon @click=${e => this.openSelector()}>dashboard</md-icon>\n `\n }\n\n _onInputChanged(e) {\n e.stopPropagation()\n\n this.value = e.target.value\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true\n })\n )\n }\n\n openSelector() {\n if (this.popup) {\n delete this.popup\n }\n\n var template = html`\n <entity-selector\n .creatable=${true}\n .queryName=${this.properties.queryName}\n .value=${this.value}\n @entity-selected=${e => {\n e.stopPropagation()\n\n var entity = e.detail.entity\n this.value = entity[this.properties.valueKey || 'id']\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true\n })\n )\n\n this.popup && this.popup.close()\n }}\n ></entity-selector>\n `\n\n this.popup = openPopup(template, {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.select entity')\n })\n }\n}\n"]}
1
+ {"version":3,"file":"things-editor-entity-selector.js","sourceRoot":"","sources":["../../client/editors/things-editor-entity-selector.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,4BAA4B,CAAA;AACnC,OAAO,sBAAsB,CAAA;AAE7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAG5B,IAAM,0BAA0B,GAAhC,MAAM,0BAA2B,SAAQ,UAAU;aACzD,WAAM,GAAG;QACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;KAwBF;KACF,AA1BY,CA0BZ;IAOD,MAAM;QACJ,OAAO,IAAI,CAAA;4CAC6B,IAAI,CAAC,KAAK,IAAI,EAAE,YAAY,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC;;wBAE5E,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE;KAC3C,CAAA;IACH,CAAC;IAED,eAAe,CAAC,CAAC;QACf,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAA;QAC3B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;YACxB,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CACH,CAAA;IACH,CAAC;IAED,YAAY;QACV,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,OAAO,IAAI,CAAC,KAAK,CAAA;QACnB,CAAC;QAED,IAAI,QAAQ,GAAG,IAAI,CAAA;;qBAEF,IAAI;qBACJ,IAAI,CAAC,UAAU,CAAC,SAAS;iBAC7B,IAAI,CAAC,KAAK;2BACA,CAAC,CAAC,EAAE;YACrB,CAAC,CAAC,eAAe,EAAE,CAAA;YAEnB,IAAI,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,MAAM,CAAA;YAC5B,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,IAAI,IAAI,CAAC,CAAA;YAErD,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;gBACxB,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CACH,CAAA;YAED,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;QAClC,CAAC;;KAEJ,CAAA;QAED,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,QAAQ,EAAE;YAC/B,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,qBAAqB,CAAC;SACxC,CAAC,CAAA;IACJ,CAAC;;AA1D2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;yDAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;8DAAgB;AA9BxB,0BAA0B;IAD9C,aAAa,CAAC,+BAA+B,CAAC;GAC1B,0BAA0B,CAwF9C;eAxFoB,0BAA0B","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/web/icon/icon.js'\nimport './entity-selector.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\n\n@customElement('things-editor-entity-selector')\nexport default class ThingsEditorEntitySelector extends LitElement {\n static styles = [\n css`\n :host {\n position: relative;\n display: inline-block;\n }\n\n input[type='text'] {\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n }\n\n md-icon {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n select,\n ox-select,\n input:not([type='checkbox']) {\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n }\n `\n ]\n\n @property({ type: String }) value?: string\n @property({ type: Object }) properties: any\n\n popup: any\n\n render() {\n return html`\n <input id=\"text\" type=\"text\" .value=${this.value || ''} @change=${e => this._onInputChanged(e)} />\n\n <md-icon @click=${e => this.openSelector()}>dashboard</md-icon>\n `\n }\n\n _onInputChanged(e) {\n e.stopPropagation()\n\n this.value = e.target.value\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true\n })\n )\n }\n\n openSelector() {\n if (this.popup) {\n delete this.popup\n }\n\n var template = html`\n <entity-selector\n .creatable=${true}\n .queryName=${this.properties.queryName}\n .value=${this.value}\n @entity-selected=${e => {\n e.stopPropagation()\n\n var entity = e.detail.entity\n this.value = entity[this.properties.valueKey || 'id']\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true\n })\n )\n\n this.popup && this.popup.close()\n }}\n ></entity-selector>\n `\n\n this.popup = openPopup(template, {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.select entity')\n })\n }\n}\n"]}
@@ -17,6 +17,52 @@ let ThingsEditorHttpBody = class ThingsEditorHttpBody extends LitElement {
17
17
  super(...arguments);
18
18
  this.value = {};
19
19
  }
20
+ static { this.styles = [
21
+ css `
22
+ :host {
23
+ display: flex;
24
+ flex-direction: column;
25
+ align-content: center;
26
+
27
+ width: 100%;
28
+ overflow: hidden;
29
+ border: 1px solid #ccc;
30
+ margin: 5px 0;
31
+ }
32
+
33
+ div {
34
+ display: flex;
35
+ flex-flow: row nowrap;
36
+ align-items: center;
37
+ }
38
+
39
+ div[kind] {
40
+ border-bottom: 1px solid #aaa;
41
+ background-color: #ddd;
42
+ }
43
+
44
+ div[accessor] {
45
+ background-color: #eee;
46
+ }
47
+
48
+ label {
49
+ margin: 0 12px 0 3px;
50
+ }
51
+
52
+ #accessor {
53
+ flex: 1;
54
+ min-height: 20px;
55
+ margin: 2px;
56
+ }
57
+
58
+ select,
59
+ ox-select,
60
+ input:not([type='checkbox']) {
61
+ border: 1px solid rgba(0, 0, 0, 0.2);
62
+ border-radius: 4px;
63
+ }
64
+ `
65
+ ]; }
20
66
  firstUpdated() {
21
67
  this.renderRoot.addEventListener('change', this._onChange.bind(this));
22
68
  }
@@ -76,56 +122,13 @@ let ThingsEditorHttpBody = class ThingsEditorHttpBody extends LitElement {
76
122
  }
77
123
  _onChange(e) {
78
124
  var input = e.target;
79
- this.value = Object.assign(Object.assign({}, this.value), { [input.name]: input.value });
125
+ this.value = {
126
+ ...this.value,
127
+ [input.name]: input.value
128
+ };
80
129
  this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
81
130
  }
82
131
  };
83
- ThingsEditorHttpBody.styles = [
84
- css `
85
- :host {
86
- display: flex;
87
- flex-direction: column;
88
- align-content: center;
89
-
90
- width: 100%;
91
- overflow: hidden;
92
- border: 1px solid #ccc;
93
- margin: 5px 0;
94
- }
95
-
96
- div {
97
- display: flex;
98
- flex-flow: row nowrap;
99
- align-items: center;
100
- }
101
-
102
- div[kind] {
103
- border-bottom: 1px solid #aaa;
104
- background-color: #ddd;
105
- }
106
-
107
- div[accessor] {
108
- background-color: #eee;
109
- }
110
-
111
- label {
112
- margin: 0 12px 0 3px;
113
- }
114
-
115
- #accessor {
116
- flex: 1;
117
- min-height: 20px;
118
- margin: 2px;
119
- }
120
-
121
- select,
122
- ox-select,
123
- input:not([type='checkbox']) {
124
- border: 1px solid rgba(0, 0, 0, 0.2);
125
- border-radius: 4px;
126
- }
127
- `
128
- ];
129
132
  __decorate([
130
133
  property({ type: Object }),
131
134
  __metadata("design:type", Object)
@@ -1 +1 @@
1
- {"version":3,"file":"things-editor-http-body.js","sourceRoot":"","sources":["../../client/editors/things-editor-http-body.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE;;;;;;;EAOE;AAGa,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAA7C;;QAgDe,UAAK,GAA8B,EAAE,CAAA;IAyEnE,CAAC;IAvEC,YAAY;QACV,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IACvE,CAAC;IAED,MAAM;QACJ,IAAI,EAAE,IAAI,GAAG,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAEpE,OAAO,IAAI,CAAA;;6DAE8C,IAAI,IAAI,MAAM;;;kEAGT,IAAI,IAAI,WAAW;;;;;;;qBAOhE,IAAI,IAAI,uBAAuB;;;;;4DAKQ,IAAI,IAAI,KAAK;;;+DAGV,IAAI,IAAI,QAAQ;;;gEAGf,IAAI,IAAI,SAAS;;;;QAIzE,IAAI,KAAK,MAAM;YACf,CAAC,CAAC,IAAI,CAAA;cACA,IAAI,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE;;;+FAGqB,QAAQ;;WAE5F;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;KACX,CAAA;IACH,CAAC;IAED,iBAAiB,CAAC,WAAW;QAC3B,OAAO,IAAI,CAAA;;;;sEAIuD,WAAW,IAAI,MAAM;;;sEAGrB,WAAW,IAAI,MAAM;;;;KAItF,CAAA;IACH,CAAC;IAED,SAAS,CAAC,CAAC;QACT,IAAI,KAAK,GAAG,CAAC,CAAC,MAAM,CAAA;QAEpB,IAAI,CAAC,KAAK,mCACL,IAAI,CAAC,KAAK,KACb,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,KAAK,GAC1B,CAAA;QAED,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IAClF,CAAC;;AAvHM,2BAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2CF;CACF,AA7CY,CA6CZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;mDAAsC;AAhD9C,oBAAoB;IADxC,aAAa,CAAC,yBAAyB,CAAC;GACpB,oBAAoB,CAyHxC;eAzHoB,oBAAoB","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\n/**\nhttp body editor element\n\nExample:\n\n <things-editor-http-body value=${map}>\n </things-editor-http-body>\n*/\n\n@customElement('things-editor-http-body')\nexport default class ThingsEditorHttpBody extends LitElement {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n\n width: 100%;\n overflow: hidden;\n border: 1px solid #ccc;\n margin: 5px 0;\n }\n\n div {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n }\n\n div[kind] {\n border-bottom: 1px solid #aaa;\n background-color: #ddd;\n }\n\n div[accessor] {\n background-color: #eee;\n }\n\n label {\n margin: 0 12px 0 3px;\n }\n\n #accessor {\n flex: 1;\n min-height: 20px;\n margin: 2px;\n }\n\n select,\n ox-select,\n input:not([type='checkbox']) {\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n }\n `\n ]\n\n @property({ type: Object }) value: { [key: string]: string } = {}\n\n firstUpdated() {\n this.renderRoot.addEventListener('change', this._onChange.bind(this))\n }\n\n render() {\n var { kind = 'none', accessor = '', contentType } = this.value || {}\n\n return html`\n <div kind>\n <input type=\"radio\" id=\"none\" name=\"kind\" .checked=${kind == 'none'} value=\"none\" />\n <label for=\"none\">none</label>\n\n <input type=\"radio\" id=\"form-data\" name=\"kind\" .checked=${kind == 'form-data'} value=\"form-data\" disabled />\n <label for=\"form-data\">form-data</label>\n\n <input\n type=\"radio\"\n id=\"x-www-form-urlencoded\"\n name=\"kind\"\n .checked=${kind == 'x-www-form-urlencoded'}\n value=\"x-www-form-urlencoded\"\n />\n <label for=\"x-www-form-urlencoded\">x-www-form-urlencoded</label>\n\n <input type=\"radio\" id=\"raw\" name=\"kind\" .checked=${kind == 'raw'} value=\"raw\" />\n <label for=\"raw\">raw</label>\n\n <input type=\"radio\" id=\"binary\" name=\"kind\" .checked=${kind == 'binary'} value=\"binary\" disabled />\n <label for=\"binary\">binary</label>\n\n <input type=\"radio\" id=\"GraphQL\" name=\"kind\" .checked=${kind == 'GraphQL'} value=\"GraphQL\" disabled />\n <label for=\"GraphQL\">GraphQL</label>\n </div>\n\n ${kind !== 'none'\n ? html`\n ${kind == 'raw' ? this.renderContentType(contentType) : html``}\n <div accessor>\n <label for=\"accessor\">accessor</label>\n <input type=\"text\" id=\"accessor\" name=\"accessor\" placeholder=\"accessor\" .value=${accessor} />\n </div>\n `\n : html``}\n `\n }\n\n renderContentType(contentType) {\n return html`\n <div>\n <label>content-type</label>\n <div>\n <input type=\"radio\" id=\"text\" name=\"contentType\" .checked=${contentType == 'text'} value=\"text\" />\n <label for=\"text\">Text</label>\n\n <input type=\"radio\" id=\"json\" name=\"contentType\" .checked=${contentType == 'json'} value=\"json\" disabled />\n <label for=\"json\">Json</label>\n </div>\n </div>\n `\n }\n\n _onChange(e) {\n var input = e.target\n\n this.value = {\n ...this.value,\n [input.name]: input.value\n }\n\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }))\n }\n}\n"]}
1
+ {"version":3,"file":"things-editor-http-body.js","sourceRoot":"","sources":["../../client/editors/things-editor-http-body.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE;;;;;;;EAOE;AAGa,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAA7C;;QAgDe,UAAK,GAA8B,EAAE,CAAA;IAyEnE,CAAC;aAxHQ,WAAM,GAAG;QACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2CF;KACF,AA7CY,CA6CZ;IAID,YAAY;QACV,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IACvE,CAAC;IAED,MAAM;QACJ,IAAI,EAAE,IAAI,GAAG,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAEpE,OAAO,IAAI,CAAA;;6DAE8C,IAAI,IAAI,MAAM;;;kEAGT,IAAI,IAAI,WAAW;;;;;;;qBAOhE,IAAI,IAAI,uBAAuB;;;;;4DAKQ,IAAI,IAAI,KAAK;;;+DAGV,IAAI,IAAI,QAAQ;;;gEAGf,IAAI,IAAI,SAAS;;;;QAIzE,IAAI,KAAK,MAAM;YACf,CAAC,CAAC,IAAI,CAAA;cACA,IAAI,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE;;;+FAGqB,QAAQ;;WAE5F;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;KACX,CAAA;IACH,CAAC;IAED,iBAAiB,CAAC,WAAW;QAC3B,OAAO,IAAI,CAAA;;;;sEAIuD,WAAW,IAAI,MAAM;;;sEAGrB,WAAW,IAAI,MAAM;;;;KAItF,CAAA;IACH,CAAC;IAED,SAAS,CAAC,CAAC;QACT,IAAI,KAAK,GAAG,CAAC,CAAC,MAAM,CAAA;QAEpB,IAAI,CAAC,KAAK,GAAG;YACX,GAAG,IAAI,CAAC,KAAK;YACb,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,KAAK;SAC1B,CAAA;QAED,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IAClF,CAAC;;AAxE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;mDAAsC;AAhD9C,oBAAoB;IADxC,aAAa,CAAC,yBAAyB,CAAC;GACpB,oBAAoB,CAyHxC;eAzHoB,oBAAoB","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\n/**\nhttp body editor element\n\nExample:\n\n <things-editor-http-body value=${map}>\n </things-editor-http-body>\n*/\n\n@customElement('things-editor-http-body')\nexport default class ThingsEditorHttpBody extends LitElement {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n\n width: 100%;\n overflow: hidden;\n border: 1px solid #ccc;\n margin: 5px 0;\n }\n\n div {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n }\n\n div[kind] {\n border-bottom: 1px solid #aaa;\n background-color: #ddd;\n }\n\n div[accessor] {\n background-color: #eee;\n }\n\n label {\n margin: 0 12px 0 3px;\n }\n\n #accessor {\n flex: 1;\n min-height: 20px;\n margin: 2px;\n }\n\n select,\n ox-select,\n input:not([type='checkbox']) {\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 4px;\n }\n `\n ]\n\n @property({ type: Object }) value: { [key: string]: string } = {}\n\n firstUpdated() {\n this.renderRoot.addEventListener('change', this._onChange.bind(this))\n }\n\n render() {\n var { kind = 'none', accessor = '', contentType } = this.value || {}\n\n return html`\n <div kind>\n <input type=\"radio\" id=\"none\" name=\"kind\" .checked=${kind == 'none'} value=\"none\" />\n <label for=\"none\">none</label>\n\n <input type=\"radio\" id=\"form-data\" name=\"kind\" .checked=${kind == 'form-data'} value=\"form-data\" disabled />\n <label for=\"form-data\">form-data</label>\n\n <input\n type=\"radio\"\n id=\"x-www-form-urlencoded\"\n name=\"kind\"\n .checked=${kind == 'x-www-form-urlencoded'}\n value=\"x-www-form-urlencoded\"\n />\n <label for=\"x-www-form-urlencoded\">x-www-form-urlencoded</label>\n\n <input type=\"radio\" id=\"raw\" name=\"kind\" .checked=${kind == 'raw'} value=\"raw\" />\n <label for=\"raw\">raw</label>\n\n <input type=\"radio\" id=\"binary\" name=\"kind\" .checked=${kind == 'binary'} value=\"binary\" disabled />\n <label for=\"binary\">binary</label>\n\n <input type=\"radio\" id=\"GraphQL\" name=\"kind\" .checked=${kind == 'GraphQL'} value=\"GraphQL\" disabled />\n <label for=\"GraphQL\">GraphQL</label>\n </div>\n\n ${kind !== 'none'\n ? html`\n ${kind == 'raw' ? this.renderContentType(contentType) : html``}\n <div accessor>\n <label for=\"accessor\">accessor</label>\n <input type=\"text\" id=\"accessor\" name=\"accessor\" placeholder=\"accessor\" .value=${accessor} />\n </div>\n `\n : html``}\n `\n }\n\n renderContentType(contentType) {\n return html`\n <div>\n <label>content-type</label>\n <div>\n <input type=\"radio\" id=\"text\" name=\"contentType\" .checked=${contentType == 'text'} value=\"text\" />\n <label for=\"text\">Text</label>\n\n <input type=\"radio\" id=\"json\" name=\"contentType\" .checked=${contentType == 'json'} value=\"json\" disabled />\n <label for=\"json\">Json</label>\n </div>\n </div>\n `\n }\n\n _onChange(e) {\n var input = e.target\n\n this.value = {\n ...this.value,\n [input.name]: input.value\n }\n\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }))\n }\n}\n"]}