@operato/form 2.0.0-alpha.92 → 2.0.0-beta.0

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 (97) hide show
  1. package/CHANGELOG.md +281 -0
  2. package/dist/src/components/ox-custom-input.js +5 -5
  3. package/dist/src/components/ox-custom-input.js.map +1 -1
  4. package/dist/src/components/ox-custom-select.js +2 -1
  5. package/dist/src/components/ox-custom-select.js.map +1 -1
  6. package/dist/src/components/ox-file-uploader.js +1 -1
  7. package/dist/src/components/ox-file-uploader.js.map +1 -1
  8. package/dist/src/components/ox-search-form.d.ts +12 -23
  9. package/dist/src/components/ox-search-form.js +227 -91
  10. package/dist/src/components/ox-search-form.js.map +1 -1
  11. package/dist/src/filters/filter-checkbox.js +2 -1
  12. package/dist/src/filters/filter-checkbox.js.map +1 -1
  13. package/dist/src/filters/filter-input-barcode.js +5 -3
  14. package/dist/src/filters/filter-input-barcode.js.map +1 -1
  15. package/dist/src/filters/filter-input.js +2 -1
  16. package/dist/src/filters/filter-input.js.map +1 -1
  17. package/dist/src/filters/filter-range-date.js +3 -1
  18. package/dist/src/filters/filter-range-date.js.map +1 -1
  19. package/dist/src/filters/filter-range-number.js +3 -1
  20. package/dist/src/filters/filter-range-number.js.map +1 -1
  21. package/dist/src/filters/filter-select.js +23 -11
  22. package/dist/src/filters/filter-select.js.map +1 -1
  23. package/dist/src/filters/filter-styles.js +56 -24
  24. package/dist/src/filters/filter-styles.js.map +1 -1
  25. package/dist/src/filters/ox-filter-personalizer.d.ts +8 -0
  26. package/dist/src/filters/ox-filter-personalizer.js +175 -0
  27. package/dist/src/filters/ox-filter-personalizer.js.map +1 -0
  28. package/dist/src/filters/ox-filters-form-base.d.ts +13 -3
  29. package/dist/src/filters/ox-filters-form-base.js +197 -61
  30. package/dist/src/filters/ox-filters-form-base.js.map +1 -1
  31. package/dist/src/styles/multi-column-form-styles.js +6 -6
  32. package/dist/src/styles/multi-column-form-styles.js.map +1 -1
  33. package/dist/src/styles/search-form-styles.js +23 -18
  34. package/dist/src/styles/search-form-styles.js.map +1 -1
  35. package/dist/src/styles/single-column-form-styles.js +5 -5
  36. package/dist/src/styles/single-column-form-styles.js.map +1 -1
  37. package/dist/src/types.d.ts +42 -2
  38. package/dist/src/types.js.map +1 -1
  39. package/dist/stories/ox-filters-form-barcode.stories.d.ts +5 -0
  40. package/dist/stories/ox-filters-form-barcode.stories.js +51 -12
  41. package/dist/stories/ox-filters-form-barcode.stories.js.map +1 -1
  42. package/dist/stories/ox-filters-form-base-bounded.stories.d.ts +35 -0
  43. package/dist/stories/ox-filters-form-base-bounded.stories.js +187 -0
  44. package/dist/stories/ox-filters-form-base-bounded.stories.js.map +1 -0
  45. package/dist/stories/ox-filters-form-base-change-handler.stories.d.ts +35 -0
  46. package/dist/stories/ox-filters-form-base-change-handler.stories.js +199 -0
  47. package/dist/stories/ox-filters-form-base-change-handler.stories.js.map +1 -0
  48. package/dist/stories/ox-filters-form-base-page-preference.stories.d.ts +31 -0
  49. package/dist/stories/ox-filters-form-base-page-preference.stories.js +173 -0
  50. package/dist/stories/ox-filters-form-base-page-preference.stories.js.map +1 -0
  51. package/dist/stories/ox-filters-form-base.stories.d.ts +5 -0
  52. package/dist/stories/ox-filters-form-base.stories.js +57 -27
  53. package/dist/stories/ox-filters-form-base.stories.js.map +1 -1
  54. package/dist/stories/ox-search-form-change-handler.stories.d.ts +34 -0
  55. package/dist/stories/ox-search-form-change-handler.stories.js +227 -0
  56. package/dist/stories/ox-search-form-change-handler.stories.js.map +1 -0
  57. package/dist/stories/ox-search-form.stories.d.ts +45 -0
  58. package/dist/stories/ox-search-form.stories.js +235 -0
  59. package/dist/stories/ox-search-form.stories.js.map +1 -0
  60. package/dist/tsconfig.tsbuildinfo +1 -1
  61. package/package.json +7 -5
  62. package/src/components/ox-custom-input.ts +5 -5
  63. package/src/components/ox-custom-select.ts +2 -1
  64. package/src/components/ox-file-uploader.ts +1 -1
  65. package/src/components/ox-search-form.ts +231 -97
  66. package/src/filters/filter-checkbox.ts +2 -1
  67. package/src/filters/filter-input-barcode.ts +5 -3
  68. package/src/filters/filter-input.ts +2 -1
  69. package/src/filters/filter-range-date.ts +3 -1
  70. package/src/filters/filter-range-number.ts +3 -1
  71. package/src/filters/filter-select.ts +29 -20
  72. package/src/filters/filter-styles.ts +56 -24
  73. package/src/filters/ox-filter-personalizer.ts +188 -0
  74. package/src/filters/ox-filters-form-base.ts +222 -79
  75. package/src/styles/multi-column-form-styles.ts +6 -6
  76. package/src/styles/search-form-styles.ts +23 -18
  77. package/src/styles/single-column-form-styles.ts +5 -5
  78. package/src/types.ts +48 -2
  79. package/stories/ox-filters-form-barcode.stories.ts +54 -14
  80. package/stories/ox-filters-form-base-bounded.stories.ts +213 -0
  81. package/stories/ox-filters-form-base-change-handler.stories.ts +225 -0
  82. package/stories/ox-filters-form-base-page-preference.stories.ts +192 -0
  83. package/stories/ox-filters-form-base.stories.ts +63 -31
  84. package/stories/ox-search-form-change-handler.stories.ts +252 -0
  85. package/stories/ox-search-form.stories.ts +269 -0
  86. package/themes/dark-hc.css +151 -0
  87. package/themes/dark-mc.css +151 -0
  88. package/themes/dark.css +151 -0
  89. package/themes/grist-theme.css +169 -0
  90. package/themes/light-hc.css +151 -0
  91. package/themes/light-mc.css +151 -0
  92. package/themes/light.css +151 -0
  93. package/themes/md-typescale-styles.css +100 -0
  94. package/themes/spacing.css +43 -0
  95. package/themes/state-color.css +6 -0
  96. package/themes/app-theme.css +0 -145
  97. package/themes/form-theme.css +0 -75
@@ -3,110 +3,179 @@ import '@material/web/icon/icon.js';
3
3
  import './ox-custom-input.js';
4
4
  import './ox-custom-select.js';
5
5
  import gql from 'graphql-tag';
6
- import { css, html, LitElement } from 'lit';
7
- import { customElement, property, query, queryAll } from 'lit/decorators.js';
6
+ import { css, html, LitElement, nothing } from 'lit';
7
+ import { customElement, property, query, queryAll, queryAsync } from 'lit/decorators.js';
8
+ import { ifDefined } from 'lit/directives/if-defined.js';
9
+ import { until } from 'lit/directives/until.js';
10
+ import { styles as MDTypeScaleStyles } from '@material/web/typography/md-typescale-styles';
8
11
  import { buildArgs, client } from '@operato/graphql';
9
12
  import { SearchFormStyles } from '../styles/search-form-styles.js';
10
- let SearchForm = class SearchForm extends LitElement {
13
+ function buildOptions(field, options) {
14
+ const selectOptionObjects = options.map(option => {
15
+ switch (typeof option) {
16
+ case 'string':
17
+ return {
18
+ name: option,
19
+ value: option
20
+ };
21
+ case 'object':
22
+ return {
23
+ name: option.name || option.display,
24
+ value: option.value
25
+ };
26
+ default:
27
+ return option;
28
+ }
29
+ });
30
+ return html `
31
+ ${selectOptionObjects === null || selectOptionObjects === void 0 ? void 0 : selectOptionObjects.map(({ value, display, name }) => html `
32
+ <option ?selected=${value == field.value} value=${value}>${name || display}</option>
33
+ `)}
34
+ `;
35
+ }
36
+ let OxSearchForm = class OxSearchForm extends LitElement {
11
37
  constructor() {
12
38
  super(...arguments);
13
39
  this.hideSearchButton = false;
14
40
  this.autofocus = false;
41
+ this.autoUpdateTargetsOnChange = {};
15
42
  }
16
43
  render() {
17
44
  var autofocusConsumed = 0;
18
45
  return html `
19
46
  <form
20
- class="search-form"
21
- @keypress=${(e) => {
22
- if (e.key === 'Enter') {
23
- e.preventDefault();
47
+ class="search-form md-typescale-body-medium-prominent"
48
+ @change=${async (e) => {
49
+ var _a;
50
+ const field = e.target;
51
+ const name = field === null || field === void 0 ? void 0 : field.getAttribute('name');
52
+ const value = field.value;
53
+ if (name && this.autoUpdateTargetsOnChange[name]) {
54
+ ;
55
+ (this.autoUpdateTargetsOnChange[name] || []).forEach(name => {
56
+ const target = this.renderRoot.querySelector(`[name='${name}']`);
57
+ if (target) {
58
+ ;
59
+ target.value = '';
60
+ }
61
+ });
62
+ this.requestUpdate();
63
+ }
64
+ const { onchange } = ((_a = this.fields) === null || _a === void 0 ? void 0 : _a.find(field => field.name == name)) || {};
65
+ const keepGoing = onchange ? await onchange.call(null, value, this) : true;
66
+ if (keepGoing) {
67
+ this.dispatchEvent(new CustomEvent('change', { detail: value }));
24
68
  this.submit();
25
69
  }
26
70
  }}
27
71
  >
28
72
  ${(this.fields || []).map(field => html `
29
73
  ${field.type === 'select'
30
- ? html `
31
- <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>
32
- <select
33
- .value=${field.value}
34
- .name=${field.name}
35
- ?hidden=${field.hidden}
36
- .placeholder=${field.placeholder || ''}
37
- >
38
- ${(field.options || []).map((option) => html `
39
- <option ?selected=${option.value == field.value} value=${option.value}>${option.name}</option>
40
- `)}
41
- </select>
42
- `
74
+ ? this.renderSelect(field)
43
75
  : field.type === 'checkbox'
44
- ? html `
45
- <input
46
- id="ckbx_${field.name}"
47
- type="checkbox"
48
- ?checked="${field.value}"
49
- .name=${field.name}
50
- ?hidden=${field.hidden}
51
- @click=${(e) => {
52
- const checkbox = e.currentTarget;
53
- if (checkbox.hasAttribute('indeterminate')) {
54
- const values = [undefined, 'on', 'off'];
55
- const currentValue = checkbox._value;
56
- const newValue = values.indexOf(currentValue) + 1 > values.length - 1
57
- ? values[0]
58
- : values[values.indexOf(currentValue) + 1];
59
- if (newValue === 'on') {
60
- checkbox.checked = true;
61
- }
62
- else if (newValue === 'off') {
63
- checkbox.checked = false;
64
- }
65
- else {
66
- checkbox.indeterminate = true;
67
- }
68
- checkbox._value = newValue;
69
- }
70
- }}
71
- />
72
- <label for="ckbx_${field.name}" ?hidden=${field.hidden}
73
- >${field.label || field.name || field.id}</label
74
- >
75
- `
76
+ ? this.renderCheckbox(field)
76
77
  : field.type === 'object'
77
- ? html `
78
- <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>
79
- <input
80
- .type=${field.type}
81
- .value=${field.value || ''}
82
- .name=${field.name}
83
- .field=${field.field}
84
- .queryName=${field.queryName}
85
- .placeholder=${field.placeholder || ''}
86
- ?hidden=${field.hidden}
87
- ?autofocus=${!field.hidden && 0 === autofocusConsumed++}
88
- />
89
- `
90
- : html `
91
- <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>
92
- <input
93
- .type=${field.type}
94
- .value=${field.value || ''}
95
- .name=${field.name}
96
- .placeholder=${field.placeholder || ''}
97
- ?hidden=${field.hidden}
98
- ?autofocus=${!field.hidden && 0 === autofocusConsumed++}
99
- />
100
- `}
78
+ ? this.renderObject(field, autofocusConsumed++)
79
+ : this.renderElse(field, autofocusConsumed++)}
101
80
  `)}
102
- ${this.hideSearchButton || false
103
- ? ``
81
+ ${!!this.hideSearchButton
82
+ ? nothing
104
83
  : html `<md-icon @click=${(e) => this.submit()} search>search</md-icon>`}
105
84
  </form>
106
85
  `;
107
86
  }
87
+ renderSelect(field) {
88
+ var { id, options, readonly, label, name, value, placeholder, hidden } = field;
89
+ if (typeof options === 'function') {
90
+ options = options.call(field, this);
91
+ if (options instanceof Promise) {
92
+ var optionsTemplate = html `${until(options.then(options => buildOptions(field, options)))}`;
93
+ }
94
+ else {
95
+ var optionsTemplate = buildOptions(field, (options || []));
96
+ }
97
+ }
98
+ else {
99
+ var optionsTemplate = buildOptions(field, (options || []));
100
+ }
101
+ return html `
102
+ <label ?hidden=${hidden}>${label || name || id}</label>
103
+ <select
104
+ .value=${value}
105
+ name=${ifDefined(name)}
106
+ placeholder=${ifDefined(placeholder)}
107
+ ?hidden=${hidden}
108
+ ?readonly=${readonly}
109
+ >
110
+ ${optionsTemplate}
111
+ </select>
112
+ `;
113
+ }
114
+ renderCheckbox(field) {
115
+ return html `
116
+ <input
117
+ id="ckbx_${field.name}"
118
+ type="checkbox"
119
+ name=${ifDefined(field.name)}
120
+ ?checked=${field.value}
121
+ ?hidden=${field.hidden}
122
+ ?readonly=${field.readonly}
123
+ @click=${(e) => {
124
+ const checkbox = e.currentTarget;
125
+ if (checkbox.hasAttribute('indeterminate')) {
126
+ const values = [undefined, 'on', 'off'];
127
+ const currentValue = checkbox._value;
128
+ const newValue = values.indexOf(currentValue) + 1 > values.length - 1
129
+ ? values[0]
130
+ : values[values.indexOf(currentValue) + 1];
131
+ if (newValue === 'on') {
132
+ checkbox.checked = true;
133
+ }
134
+ else if (newValue === 'off') {
135
+ checkbox.checked = false;
136
+ }
137
+ else {
138
+ checkbox.indeterminate = true;
139
+ }
140
+ checkbox._value = newValue;
141
+ }
142
+ }}
143
+ />
144
+ <label for="ckbx_${field.name}" ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>
145
+ `;
146
+ }
147
+ renderObject(field, autofocusConsumed) {
148
+ return html `
149
+ <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>
150
+ <input
151
+ .type=${field.type}
152
+ name=${ifDefined(field.name)}
153
+ placeholder=${ifDefined(field.placeholder)}
154
+ .value=${field.value || ''}
155
+ .field=${field.field}
156
+ .queryName=${field.queryName}
157
+ ?hidden=${field.hidden}
158
+ ?readonly=${field.readonly}
159
+ ?autofocus=${!field.hidden && 0 === autofocusConsumed}
160
+ />
161
+ `;
162
+ }
163
+ renderElse(field, autofocusConsumed) {
164
+ return html `
165
+ <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>
166
+ <input
167
+ .type=${field.type}
168
+ .value=${field.value || ''}
169
+ name=${ifDefined(field.name)}
170
+ placeholder=${ifDefined(field.placeholder)}
171
+ ?hidden=${field.hidden}
172
+ ?readonly=${field.readonly}
173
+ ?autofocus=${!field.hidden && 0 === autofocusConsumed++}
174
+ />
175
+ `;
176
+ }
108
177
  async updated(changes) {
109
- var _a;
178
+ var _a, _b;
110
179
  if (changes.has('fields')) {
111
180
  this._checkInputValidity();
112
181
  var formFields = Array.from(this.formFields);
@@ -141,8 +210,20 @@ let SearchForm = class SearchForm extends LitElement {
141
210
  await this.requestUpdate();
142
211
  (_a = this.autofocused) === null || _a === void 0 ? void 0 : _a.focus();
143
212
  }
213
+ this.autoUpdateTargetsOnChange = {};
214
+ (_b = this.fields) === null || _b === void 0 ? void 0 : _b.filter(filter => filter.boundTo && filter.boundTo.length > 0).map(({ name, boundTo }) => {
215
+ boundTo.forEach(to => {
216
+ const origin = this.autoUpdateTargetsOnChange[to] || [];
217
+ if (name && !origin.includes(name)) {
218
+ this.autoUpdateTargetsOnChange[to] = [...origin, name];
219
+ }
220
+ });
221
+ });
144
222
  }
145
223
  }
224
+ getFieldByName(name) {
225
+ return this.renderRoot.querySelector(`[name=${name}]`);
226
+ }
146
227
  _checkInputValidity() {
147
228
  var _a;
148
229
  const names = ((_a = this.fields) === null || _a === void 0 ? void 0 : _a.map(i => i.name)) || [];
@@ -256,46 +337,101 @@ let SearchForm = class SearchForm extends LitElement {
256
337
  });
257
338
  return data;
258
339
  }
340
+ reset(value) {
341
+ this.form
342
+ .then((form) => {
343
+ if (value) {
344
+ if (value instanceof Array) {
345
+ value
346
+ .filter(item => typeof item == 'string')
347
+ .forEach(item => {
348
+ const field = this.getFieldByName(item);
349
+ if (field) {
350
+ ;
351
+ field.value = '';
352
+ }
353
+ });
354
+ }
355
+ else {
356
+ const keys = Object.keys(value);
357
+ keys
358
+ .filter(key => typeof key == 'string')
359
+ .forEach(key => {
360
+ const field = this.getFieldByName(key);
361
+ if (field) {
362
+ ;
363
+ field.value = value[key];
364
+ }
365
+ });
366
+ }
367
+ }
368
+ else {
369
+ form.reset();
370
+ }
371
+ })
372
+ .catch((error) => {
373
+ console.error('Error resetting the form:', error);
374
+ });
375
+ }
259
376
  submit() {
260
377
  this.dispatchEvent(new CustomEvent('submit'));
261
378
  }
262
379
  };
263
- SearchForm.styles = [
380
+ OxSearchForm.styles = [
381
+ MDTypeScaleStyles,
264
382
  SearchFormStyles,
265
383
  css `
266
384
  :host {
267
385
  display: flex;
268
386
  flex-direction: column;
387
+ padding: var(--spacing-small);
269
388
 
270
389
  position: relative;
271
390
  }
272
391
 
273
392
  ::placeholder {
274
393
  text-transform: capitalize;
275
- color: var(--theme-white-color);
394
+ color: rgba(var(--secondary-color-rgb), 0.5);
395
+ }
396
+ label {
397
+ font-size: var(--md-sys-typescale-label-large-size, 0.875rem);
398
+ color: var(--md-sys-color-primary);
399
+ }
400
+ select,
401
+ input {
402
+ border: none;
403
+ border-bottom: var(--ox-filters-input-border, 1px solid var(--md-sys-color-outline));
404
+ font: var(--ox-filters-input-font);
405
+ }
406
+
407
+ select:focus,
408
+ input:focus {
409
+ outline: none;
410
+ border-bottom: var(--ox-filters-input-focus-border, 1px solid var(--md-ref-palette-primary50));
411
+ color: var(--ox-filters-input-focus-color, var(--md-sys-color-primary));
276
412
  }
277
413
  `
278
414
  ];
279
415
  __decorate([
280
416
  property({ type: Array })
281
- ], SearchForm.prototype, "fields", void 0);
417
+ ], OxSearchForm.prototype, "fields", void 0);
282
418
  __decorate([
283
419
  property({ type: Boolean })
284
- ], SearchForm.prototype, "hideSearchButton", void 0);
420
+ ], OxSearchForm.prototype, "hideSearchButton", void 0);
285
421
  __decorate([
286
422
  property({ type: Boolean, attribute: true })
287
- ], SearchForm.prototype, "autofocus", void 0);
423
+ ], OxSearchForm.prototype, "autofocus", void 0);
288
424
  __decorate([
289
- query('form')
290
- ], SearchForm.prototype, "form", void 0);
425
+ queryAsync('form')
426
+ ], OxSearchForm.prototype, "form", void 0);
291
427
  __decorate([
292
428
  query('input[autofocus]')
293
- ], SearchForm.prototype, "autofocused", void 0);
429
+ ], OxSearchForm.prototype, "autofocused", void 0);
294
430
  __decorate([
295
431
  queryAll('input, select')
296
- ], SearchForm.prototype, "formFields", void 0);
297
- SearchForm = __decorate([
432
+ ], OxSearchForm.prototype, "formFields", void 0);
433
+ OxSearchForm = __decorate([
298
434
  customElement('ox-search-form')
299
- ], SearchForm);
300
- export { SearchForm };
435
+ ], OxSearchForm);
436
+ export { OxSearchForm };
301
437
  //# sourceMappingURL=ox-search-form.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ox-search-form.js","sourceRoot":"","sources":["../../../src/components/ox-search-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport './ox-custom-input.js'\nimport './ox-custom-select.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query, queryAll } from 'lit/decorators.js'\n\nimport { buildArgs, client } from '@operato/graphql'\n\nimport { SearchFormStyles } from '../styles/search-form-styles.js'\n\n@customElement('ox-search-form')\nexport class SearchForm extends LitElement {\n static styles = [\n SearchFormStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n position: relative;\n }\n\n ::placeholder {\n text-transform: capitalize;\n color: var(--theme-white-color);\n }\n `\n ]\n\n @property({ type: Array }) fields?: {\n type: string\n hidden: boolean\n name: string\n id: string\n label: string\n placeholder: string\n value: any\n field: string\n queryName: string\n props: { [prop: string]: string }\n attrs: string[]\n options: { name: string; value: string }[]\n handlers: { [event: string]: EventListener }\n }[]\n @property({ type: Boolean }) hideSearchButton: boolean = false\n @property({ type: Boolean, attribute: true }) autofocus: boolean = false\n\n @query('form') form!: HTMLFormElement\n @query('input[autofocus]') autofocused?: HTMLInputElement\n @queryAll('input, select') formFields!: ((HTMLInputElement | HTMLSelectElement) & { field: string; _value: any })[]\n\n render() {\n var autofocusConsumed = 0\n\n return html`\n <form\n class=\"search-form\"\n @keypress=${(e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n e.preventDefault()\n this.submit()\n }\n }}\n >\n ${(this.fields || []).map(\n field => html`\n ${field.type === 'select'\n ? html`\n <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n <select\n .value=${field.value}\n .name=${field.name}\n ?hidden=${field.hidden}\n .placeholder=${field.placeholder || ''}\n >\n ${(field.options || []).map(\n (option: { name: string; value: string }) => html`\n <option ?selected=${option.value == field.value} value=${option.value}>${option.name}</option>\n `\n )}\n </select>\n `\n : field.type === 'checkbox'\n ? html`\n <input\n id=\"ckbx_${field.name}\"\n type=\"checkbox\"\n ?checked=\"${field.value}\"\n .name=${field.name}\n ?hidden=${field.hidden}\n @click=${(e: MouseEvent) => {\n const checkbox = e.currentTarget as HTMLInputElement & { _value: any }\n if (checkbox.hasAttribute('indeterminate')) {\n const values = [undefined, 'on', 'off']\n const currentValue = checkbox._value\n const newValue =\n values.indexOf(currentValue) + 1 > values.length - 1\n ? values[0]\n : values[values.indexOf(currentValue) + 1]\n\n if (newValue === 'on') {\n checkbox.checked = true\n } else if (newValue === 'off') {\n checkbox.checked = false\n } else {\n checkbox.indeterminate = true\n }\n checkbox._value = newValue\n }\n }}\n />\n <label for=\"ckbx_${field.name}\" ?hidden=${field.hidden}\n >${field.label || field.name || field.id}</label\n >\n `\n : field.type === 'object'\n ? html`\n <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n <input\n .type=${field.type}\n .value=${field.value || ''}\n .name=${field.name}\n .field=${field.field}\n .queryName=${field.queryName}\n .placeholder=${field.placeholder || ''}\n ?hidden=${field.hidden}\n ?autofocus=${!field.hidden && 0 === autofocusConsumed++}\n />\n `\n : html`\n <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n <input\n .type=${field.type}\n .value=${field.value || ''}\n .name=${field.name}\n .placeholder=${field.placeholder || ''}\n ?hidden=${field.hidden}\n ?autofocus=${!field.hidden && 0 === autofocusConsumed++}\n />\n `}\n `\n )}\n ${this.hideSearchButton || false\n ? ``\n : html`<md-icon @click=${(e: MouseEvent) => this.submit()} search>search</md-icon>`}\n </form>\n `\n }\n\n async updated(changes: PropertyValues<this>) {\n if (changes.has('fields')) {\n this._checkInputValidity()\n\n var formFields = Array.from(this.formFields)\n this.fields &&\n this.fields.forEach(field => {\n var formField = formFields.find(f => f.name == field.name)\n if (field.props instanceof Object && !Array.isArray(field.props)) {\n for (let prop in field.props) {\n if (field.props[prop]) {\n formField!.setAttribute(prop, field.props[prop])\n }\n }\n }\n\n if (field.attrs && Array.isArray(field.attrs)) {\n field.attrs.forEach(attr => {\n if (attr === 'indeterminate') {\n ;(formField as HTMLInputElement).indeterminate = true\n } else {\n formField!.setAttribute(attr, '')\n }\n })\n }\n\n if (field.handlers instanceof Object && !Array.isArray(field.handlers)) {\n for (let eventName in field.handlers) {\n formField!.addEventListener(eventName, field.handlers[eventName])\n }\n }\n })\n\n if (this.autofocus) {\n await this.requestUpdate()\n this.autofocused?.focus()\n }\n }\n }\n\n _checkInputValidity() {\n const names = this.fields?.map(i => i.name) || []\n const result = names.every(name => {\n return names.indexOf(name) === names.lastIndexOf(name)\n })\n if (!result) {\n throw new Error('Field name is duplicated.')\n }\n }\n\n get searchParams() {\n let searchParam = new URLSearchParams()\n const fields = Array.from(this.formFields)\n fields.forEach(field => searchParam.append(field.name, field.value))\n\n return decodeURI(searchParam.toString())\n }\n\n get queryFilters() {\n return Array.from(this.formFields)\n .filter(\n field =>\n (field.type !== 'checkbox' && field.value && field.value !== '') ||\n (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n )\n .map(field => {\n const operator = field.getAttribute('searchOper') || ''\n let value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n return {\n name: field.name,\n value:\n field.type === 'text'\n ? value\n : field.type === 'checkbox'\n ? field.hasAttribute('indeterminate')\n ? field._value === 'on'\n ? true\n : false\n : (field as HTMLInputElement).checked\n : field.type === 'number'\n ? parseFloat(value)\n : value,\n operator\n }\n })\n }\n\n public async getQueryFilters() {\n return await Promise.all(\n Array.from(this.formFields)\n .filter(\n field =>\n (field.type !== 'checkbox' && field.value && field.value !== '') ||\n (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n )\n .map(async field => {\n const name = field.name\n const operator = (field.type === 'text' && field.field ? 'in' : field.getAttribute('searchOper')) || ''\n const value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n const filter = {\n name,\n operator,\n value:\n field.type === 'text' && field.getAttribute('type') === 'object'\n ? await this._getResourceIds(field)\n : field.type === 'text'\n ? value\n : field.type === 'checkbox'\n ? field.hasAttribute('indeterminate')\n ? field._value === 'on'\n ? true\n : false\n : (field as HTMLInputElement).checked\n : field.type === 'number'\n ? parseFloat(value)\n : value,\n relation: field.type === 'text' && field.getAttribute('type') === 'object'\n }\n return filter\n })\n )\n }\n\n private async _getResourceIds(inputField: HTMLInputElement | HTMLSelectElement) {\n const {\n field = 'name',\n value,\n queryName\n } = inputField as (HTMLInputElement | HTMLSelectElement) & { field: string; queryName: string }\n\n const response = await client.query({\n query: gql`\n query {\n fetch: ${queryName}(${buildArgs({\n filters: [\n {\n name: field,\n operator: 'i_like',\n value: `%${value}%`\n }\n ]\n })}) {\n items {\n id\n }\n }\n }\n `\n })\n\n if (!response.errors) {\n const items = response.data.fetch.items as { id: string }[]\n return (items && items.map(item => item.id)) || []\n }\n }\n\n serialize() {\n let data: { [name: string]: any } = {}\n\n Array.from(this.formFields).forEach(field => {\n const name = field.name\n if (field.type === 'number') {\n data[name] = parseFloat(field.value)\n } else if (field.type === 'checkbox') {\n data[name] = (field as HTMLInputElement).checked\n } else {\n data[name] = field.value\n }\n })\n\n return data\n }\n\n submit() {\n this.dispatchEvent(new CustomEvent('submit'))\n }\n}\n"]}
1
+ {"version":3,"file":"ox-search-form.js","sourceRoot":"","sources":["../../../src/components/ox-search-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport './ox-custom-input.js'\nimport './ox-custom-select.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement, nothing, PropertyValues } from 'lit'\nimport { customElement, property, query, queryAll, queryAsync } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { until } from 'lit/directives/until.js'\nimport { styles as MDTypeScaleStyles } from '@material/web/typography/md-typescale-styles'\n\nimport { buildArgs, client } from '@operato/graphql'\n\nimport { SearchFormStyles } from '../styles/search-form-styles.js'\nimport { SearchFormField, SelectOption, SelectOptionObject } from '../types.js'\n\nfunction buildOptions(field: SearchFormField, options: SelectOption[]) {\n const selectOptionObjects = options.map(option => {\n switch (typeof option) {\n case 'string':\n return {\n name: option,\n value: option\n }\n case 'object':\n return {\n name: option.name || option.display,\n value: option.value\n }\n default:\n return option\n }\n }) as SelectOptionObject[]\n\n return html`\n ${selectOptionObjects?.map(\n ({ value, display, name }) => html`\n <option ?selected=${value == field.value} value=${value}>${name || display}</option>\n `\n )}\n `\n}\n\n@customElement('ox-search-form')\nexport class OxSearchForm extends LitElement {\n static styles = [\n MDTypeScaleStyles,\n SearchFormStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n padding: var(--spacing-small);\n\n position: relative;\n }\n\n ::placeholder {\n text-transform: capitalize;\n color: rgba(var(--secondary-color-rgb), 0.5);\n }\n label {\n font-size: var(--md-sys-typescale-label-large-size, 0.875rem);\n color: var(--md-sys-color-primary);\n }\n select,\n input {\n border: none;\n border-bottom: var(--ox-filters-input-border, 1px solid var(--md-sys-color-outline));\n font: var(--ox-filters-input-font);\n }\n\n select:focus,\n input:focus {\n outline: none;\n border-bottom: var(--ox-filters-input-focus-border, 1px solid var(--md-ref-palette-primary50));\n color: var(--ox-filters-input-focus-color, var(--md-sys-color-primary));\n }\n `\n ]\n\n @property({ type: Array }) fields?: SearchFormField[]\n @property({ type: Boolean }) hideSearchButton: boolean = false\n @property({ type: Boolean, attribute: true }) autofocus: boolean = false\n\n @queryAsync('form') form!: HTMLFormElement\n @query('input[autofocus]') autofocused?: HTMLInputElement\n @queryAll('input, select') formFields!: ((HTMLInputElement | HTMLSelectElement) & { field: string; _value: any })[]\n\n private autoUpdateTargetsOnChange: { [name: string]: string[] } = {}\n\n render() {\n var autofocusConsumed = 0\n\n return html`\n <form\n class=\"search-form md-typescale-body-medium-prominent\"\n @change=${async (e: Event) => {\n const field = e.target as HTMLInputElement\n const name = field?.getAttribute('name')\n const value = field.value\n\n if (name && this.autoUpdateTargetsOnChange[name]) {\n ;(this.autoUpdateTargetsOnChange[name] || []).forEach(name => {\n const target = this.renderRoot.querySelector(`[name='${name}']`)\n if (target) {\n ;(target as HTMLInputElement).value = ''\n }\n })\n\n this.requestUpdate()\n }\n\n const { onchange } = this.fields?.find(field => field.name == name) || {}\n\n const keepGoing = onchange ? await onchange.call(null, value, this) : true\n\n if (keepGoing) {\n this.dispatchEvent(new CustomEvent('change', { detail: value }))\n this.submit()\n }\n }}\n >\n ${(this.fields || []).map(\n field => html`\n ${field.type === 'select'\n ? this.renderSelect(field)\n : field.type === 'checkbox'\n ? this.renderCheckbox(field)\n : field.type === 'object'\n ? this.renderObject(field, autofocusConsumed++)\n : this.renderElse(field, autofocusConsumed++)}\n `\n )}\n ${!!this.hideSearchButton\n ? nothing\n : html`<md-icon @click=${(e: MouseEvent) => this.submit()} search>search</md-icon>`}\n </form>\n `\n }\n\n renderSelect(field: SearchFormField) {\n var { id, options, readonly, label, name, value, placeholder, hidden } = field\n\n if (typeof options === 'function') {\n options = (options as Function).call(field, this)\n\n if (options instanceof Promise) {\n var optionsTemplate = html`${until(options.then(options => buildOptions(field, options)))}`\n } else {\n var optionsTemplate = buildOptions(field, (options || []) as SelectOption[])\n }\n } else {\n var optionsTemplate = buildOptions(field, (options || []) as SelectOption[])\n }\n\n return html`\n <label ?hidden=${hidden}>${label || name || id}</label>\n <select\n .value=${value}\n name=${ifDefined(name)}\n placeholder=${ifDefined(placeholder)}\n ?hidden=${hidden}\n ?readonly=${readonly}\n >\n ${optionsTemplate!}\n </select>\n `\n }\n\n renderCheckbox(field: SearchFormField) {\n return html`\n <input\n id=\"ckbx_${field.name}\"\n type=\"checkbox\"\n name=${ifDefined(field.name)}\n ?checked=${field.value}\n ?hidden=${field.hidden}\n ?readonly=${field.readonly}\n @click=${(e: MouseEvent) => {\n const checkbox = e.currentTarget as HTMLInputElement & { _value: any }\n if (checkbox.hasAttribute('indeterminate')) {\n const values = [undefined, 'on', 'off']\n const currentValue = checkbox._value\n const newValue =\n values.indexOf(currentValue) + 1 > values.length - 1\n ? values[0]\n : values[values.indexOf(currentValue) + 1]\n\n if (newValue === 'on') {\n checkbox.checked = true\n } else if (newValue === 'off') {\n checkbox.checked = false\n } else {\n checkbox.indeterminate = true\n }\n checkbox._value = newValue\n }\n }}\n />\n <label for=\"ckbx_${field.name}\" ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n `\n }\n\n renderObject(field: SearchFormField, autofocusConsumed: number) {\n return html`\n <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n <input\n .type=${field.type}\n name=${ifDefined(field.name)}\n placeholder=${ifDefined(field.placeholder)}\n .value=${field.value || ''}\n .field=${field.field}\n .queryName=${field.queryName}\n ?hidden=${field.hidden}\n ?readonly=${field.readonly}\n ?autofocus=${!field.hidden && 0 === autofocusConsumed}\n />\n `\n }\n\n renderElse(field: SearchFormField, autofocusConsumed: number) {\n return html`\n <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n <input\n .type=${field.type}\n .value=${field.value || ''}\n name=${ifDefined(field.name)}\n placeholder=${ifDefined(field.placeholder)}\n ?hidden=${field.hidden}\n ?readonly=${field.readonly}\n ?autofocus=${!field.hidden && 0 === autofocusConsumed++}\n />\n `\n }\n\n async updated(changes: PropertyValues<this>) {\n if (changes.has('fields')) {\n this._checkInputValidity()\n\n var formFields = Array.from(this.formFields)\n this.fields &&\n this.fields.forEach(field => {\n var formField = formFields.find(f => f.name == field.name)\n if (field.props instanceof Object && !Array.isArray(field.props)) {\n for (let prop in field.props) {\n if (field.props[prop]) {\n formField!.setAttribute(prop, field.props[prop])\n }\n }\n }\n\n if (field.attrs && Array.isArray(field.attrs)) {\n field.attrs.forEach(attr => {\n if (attr === 'indeterminate') {\n ;(formField as HTMLInputElement).indeterminate = true\n } else {\n formField!.setAttribute(attr, '')\n }\n })\n }\n\n if (field.handlers instanceof Object && !Array.isArray(field.handlers)) {\n for (let eventName in field.handlers) {\n formField!.addEventListener(eventName, field.handlers[eventName])\n }\n }\n })\n\n if (this.autofocus) {\n await this.requestUpdate()\n this.autofocused?.focus()\n }\n\n this.autoUpdateTargetsOnChange = {}\n this.fields\n ?.filter(filter => filter.boundTo && filter.boundTo.length > 0)\n .map(({ name, boundTo }) => {\n boundTo!.forEach(to => {\n const origin = this.autoUpdateTargetsOnChange[to] || []\n if (name && !origin.includes(name)) {\n this.autoUpdateTargetsOnChange[to] = [...origin, name]\n }\n })\n })\n }\n }\n\n getFieldByName(name: string) {\n return this.renderRoot.querySelector(`[name=${name}]`)\n }\n\n _checkInputValidity() {\n const names = this.fields?.map(i => i.name) || []\n const result = names.every(name => {\n return names.indexOf(name) === names.lastIndexOf(name)\n })\n if (!result) {\n throw new Error('Field name is duplicated.')\n }\n }\n\n get searchParams() {\n let searchParam = new URLSearchParams()\n const fields = Array.from(this.formFields)\n fields.forEach(field => searchParam.append(field.name, field.value))\n\n return decodeURI(searchParam.toString())\n }\n\n get queryFilters() {\n return Array.from(this.formFields)\n .filter(\n field =>\n (field.type !== 'checkbox' && field.value && field.value !== '') ||\n (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n )\n .map(field => {\n const operator = field.getAttribute('searchOper') || ''\n let value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n return {\n name: field.name,\n value:\n field.type === 'text'\n ? value\n : field.type === 'checkbox'\n ? field.hasAttribute('indeterminate')\n ? field._value === 'on'\n ? true\n : false\n : (field as HTMLInputElement).checked\n : field.type === 'number'\n ? parseFloat(value)\n : value,\n operator\n }\n })\n }\n\n public async getQueryFilters() {\n return await Promise.all(\n Array.from(this.formFields)\n .filter(\n field =>\n (field.type !== 'checkbox' && field.value && field.value !== '') ||\n (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n )\n .map(async field => {\n const name = field.name\n const operator = (field.type === 'text' && field.field ? 'in' : field.getAttribute('searchOper')) || ''\n const value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n const filter = {\n name,\n operator,\n value:\n field.type === 'text' && field.getAttribute('type') === 'object'\n ? await this._getResourceIds(field)\n : field.type === 'text'\n ? value\n : field.type === 'checkbox'\n ? field.hasAttribute('indeterminate')\n ? field._value === 'on'\n ? true\n : false\n : (field as HTMLInputElement).checked\n : field.type === 'number'\n ? parseFloat(value)\n : value,\n relation: field.type === 'text' && field.getAttribute('type') === 'object'\n }\n return filter\n })\n )\n }\n\n private async _getResourceIds(inputField: HTMLInputElement | HTMLSelectElement) {\n const {\n field = 'name',\n value,\n queryName\n } = inputField as (HTMLInputElement | HTMLSelectElement) & { field: string; queryName: string }\n\n const response = await client.query({\n query: gql`\n query {\n fetch: ${queryName}(${buildArgs({\n filters: [\n {\n name: field,\n operator: 'i_like',\n value: `%${value}%`\n }\n ]\n })}) {\n items {\n id\n }\n }\n }\n `\n })\n\n if (!response.errors) {\n const items = response.data.fetch.items as { id: string }[]\n return (items && items.map(item => item.id)) || []\n }\n }\n\n serialize() {\n let data: { [name: string]: any } = {}\n\n Array.from(this.formFields).forEach(field => {\n const name = field.name\n if (field.type === 'number') {\n data[name] = parseFloat(field.value)\n } else if (field.type === 'checkbox') {\n data[name] = (field as HTMLInputElement).checked\n } else {\n data[name] = field.value\n }\n })\n\n return data\n }\n\n reset(value?: string[] | { [field: string]: any }) {\n this.form\n .then((form: HTMLFormElement) => {\n if (value) {\n if (value instanceof Array) {\n value\n .filter(item => typeof item == 'string')\n .forEach(item => {\n const field = this.getFieldByName(item)\n if (field) {\n ;(field as HTMLInputElement).value = ''\n }\n })\n } else {\n const keys = Object.keys(value)\n keys\n .filter(key => typeof key == 'string')\n .forEach(key => {\n const field = this.getFieldByName(key)\n if (field) {\n ;(field as HTMLInputElement).value = value[key]\n }\n })\n }\n } else {\n form.reset()\n }\n })\n .catch((error: any) => {\n console.error('Error resetting the form:', error)\n })\n }\n\n submit() {\n this.dispatchEvent(new CustomEvent('submit'))\n }\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  import '@operato/input/ox-checkbox.js';
2
2
  import { html } from 'lit-html';
3
3
  export const FilterCheckbox = (filter, value, owner) => {
4
- const { name, label } = filter;
4
+ const { name, label, readonly } = filter;
5
5
  return html `
6
6
  <ox-checkbox
7
7
  name=${name}
@@ -21,6 +21,7 @@ export const FilterCheckbox = (filter, value, owner) => {
21
21
  }
22
22
  }));
23
23
  }}
24
+ ?readonly=${readonly}
24
25
  ><label><span>${label}</span></label></ox-checkbox
25
26
  >
26
27
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"filter-checkbox.js","sourceRoot":"","sources":["../../../src/filters/filter-checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,+BAA+B,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAI/B,MAAM,CAAC,MAAM,cAAc,GAAyB,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IAC3E,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,MAAM,CAAA;IAE9B,OAAO,IAAI,CAAA;;aAEA,IAAI;iBACA,KAAK;;uBAEC,KAAK,KAAK,SAAS;;gBAE1B,CAAC,CAAc,EAAE,EAAE;QAC3B,CAAC;QAAC,CAAC,CAAC,MAAsB,CAAC,aAAa,CACtC,IAAI,WAAW,CAAC,eAAe,EAAE;YAC/B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,MAAM,CAAC,QAAQ;gBACzB,KAAK,EAAG,CAAC,CAAC,MAAqD,CAAC,OAAO;aACxE;SACF,CAAC,CACH,CAAA;IACH,CAAC;sBACe,KAAK;;GAExB,CAAA;AACH,CAAC,CAAA","sourcesContent":["import '@operato/input/ox-checkbox.js'\n\nimport { html } from 'lit-html'\n\nimport { FilterSelectRenderer } from '../types.js'\n\nexport const FilterCheckbox: FilterSelectRenderer = (filter, value, owner) => {\n const { name, label } = filter\n\n return html`\n <ox-checkbox\n name=${name}\n ?checked=${value}\n indeterminatable\n ?indeterminate=${value === undefined}\n left-label\n @change=${(e: CustomEvent) => {\n ;(e.target as HTMLElement).dispatchEvent(\n new CustomEvent('filter-change', {\n bubbles: true,\n composed: true,\n detail: {\n name: name,\n operator: filter.operator,\n value: (e.target as Element & { checked: boolean | undefined }).checked\n }\n })\n )\n }}\n ><label><span>${label}</span></label></ox-checkbox\n >\n `\n}\n"]}
1
+ {"version":3,"file":"filter-checkbox.js","sourceRoot":"","sources":["../../../src/filters/filter-checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,+BAA+B,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAI/B,MAAM,CAAC,MAAM,cAAc,GAAyB,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IAC3E,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,MAAM,CAAA;IAExC,OAAO,IAAI,CAAA;;aAEA,IAAI;iBACA,KAAK;;uBAEC,KAAK,KAAK,SAAS;;gBAE1B,CAAC,CAAc,EAAE,EAAE;QAC3B,CAAC;QAAC,CAAC,CAAC,MAAsB,CAAC,aAAa,CACtC,IAAI,WAAW,CAAC,eAAe,EAAE;YAC/B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,MAAM,CAAC,QAAQ;gBACzB,KAAK,EAAG,CAAC,CAAC,MAAqD,CAAC,OAAO;aACxE;SACF,CAAC,CACH,CAAA;IACH,CAAC;kBACW,QAAQ;sBACJ,KAAK;;GAExB,CAAA;AACH,CAAC,CAAA","sourcesContent":["import '@operato/input/ox-checkbox.js'\n\nimport { html } from 'lit-html'\n\nimport { FilterSelectRenderer } from '../types.js'\n\nexport const FilterCheckbox: FilterSelectRenderer = (filter, value, owner) => {\n const { name, label, readonly } = filter\n\n return html`\n <ox-checkbox\n name=${name}\n ?checked=${value}\n indeterminatable\n ?indeterminate=${value === undefined}\n left-label\n @change=${(e: CustomEvent) => {\n ;(e.target as HTMLElement).dispatchEvent(\n new CustomEvent('filter-change', {\n bubbles: true,\n composed: true,\n detail: {\n name: name,\n operator: filter.operator,\n value: (e.target as Element & { checked: boolean | undefined }).checked\n }\n })\n )\n }}\n ?readonly=${readonly}\n ><label><span>${label}</span></label></ox-checkbox\n >\n `\n}\n"]}
@@ -1,8 +1,8 @@
1
1
  import '@operato/input/ox-input-barcode.js';
2
2
  import { html } from 'lit-html';
3
3
  export const FilterInputBarcode = (filter, value, owner) => {
4
- const { name, type } = filter;
5
- const { englishOnly, selectAfterChange } = filter.options || {};
4
+ const { name, readonly, options } = filter;
5
+ const { englishOnly, selectAfterChange } = (options || {});
6
6
  return html `
7
7
  <ox-input-barcode
8
8
  name=${name}
@@ -21,7 +21,9 @@ export const FilterInputBarcode = (filter, value, owner) => {
21
21
  }
22
22
  }));
23
23
  }}
24
- />
24
+ filter-input
25
+ ?readonly=${readonly}
26
+ ></ox-input-barcode>
25
27
  `;
26
28
  };
27
29
  //# sourceMappingURL=filter-input-barcode.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"filter-input-barcode.js","sourceRoot":"","sources":["../../../src/filters/filter-input-barcode.ts"],"names":[],"mappings":"AAAA,OAAO,oCAAoC,CAAA;AAE3C,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAI/B,MAAM,CAAC,MAAM,kBAAkB,GAAyB,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IAC/E,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,MAAM,CAAA;IAC7B,MAAM,EAAE,WAAW,EAAE,iBAAiB,EAAE,GAAG,MAAM,CAAC,OAAO,IAAI,EAAE,CAAA;IAE/D,OAAO,IAAI,CAAA;;aAEA,IAAI;sBACK,WAAW;6BACJ,iBAAiB;eAC/B,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;gBAC/B,CAAC,CAAc,EAAE,EAAE;QAC3B,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAA;QAC1C,KAAK,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,eAAe,EAAE;YAC/B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,IAAI;gBACJ,QAAQ,EAAE,MAAM,CAAC,QAAQ;gBACzB,KAAK,EAAE,KAAK,CAAC,KAAK;aACnB;SACF,CAAC,CACH,CAAA;IACH,CAAC;;GAEJ,CAAA;AACH,CAAC,CAAA","sourcesContent":["import '@operato/input/ox-input-barcode.js'\n\nimport { html } from 'lit-html'\n\nimport { FilterSelectRenderer } from '../types.js'\n\nexport const FilterInputBarcode: FilterSelectRenderer = (filter, value, owner) => {\n const { name, type } = filter\n const { englishOnly, selectAfterChange } = filter.options || {}\n\n return html`\n <ox-input-barcode\n name=${name}\n ?english-only=${englishOnly}\n ?select-after-change=${selectAfterChange}\n .value=${value === undefined ? '' : value}\n @change=${(e: CustomEvent) => {\n const input = e.target as HTMLInputElement\n input.dispatchEvent(\n new CustomEvent('filter-change', {\n bubbles: true,\n composed: true,\n detail: {\n name,\n operator: filter.operator,\n value: input.value\n }\n })\n )\n }}\n />\n `\n}\n"]}
1
+ {"version":3,"file":"filter-input-barcode.js","sourceRoot":"","sources":["../../../src/filters/filter-input-barcode.ts"],"names":[],"mappings":"AAAA,OAAO,oCAAoC,CAAA;AAE3C,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAI/B,MAAM,CAAC,MAAM,kBAAkB,GAAyB,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IAC/E,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,MAAM,CAAA;IAC1C,MAAM,EAAE,WAAW,EAAE,iBAAiB,EAAE,GAAG,CAAC,OAAO,IAAI,EAAE,CAA2B,CAAA;IAEpF,OAAO,IAAI,CAAA;;aAEA,IAAI;sBACK,WAAW;6BACJ,iBAAiB;eAC/B,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;gBAC/B,CAAC,CAAc,EAAE,EAAE;QAC3B,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAA;QAC1C,KAAK,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,eAAe,EAAE;YAC/B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,IAAI;gBACJ,QAAQ,EAAE,MAAM,CAAC,QAAQ;gBACzB,KAAK,EAAE,KAAK,CAAC,KAAK;aACnB;SACF,CAAC,CACH,CAAA;IACH,CAAC;;kBAEW,QAAQ;;GAEvB,CAAA;AACH,CAAC,CAAA","sourcesContent":["import '@operato/input/ox-input-barcode.js'\n\nimport { html } from 'lit-html'\n\nimport { FilterSelectRenderer } from '../types.js'\n\nexport const FilterInputBarcode: FilterSelectRenderer = (filter, value, owner) => {\n const { name, readonly, options } = filter\n const { englishOnly, selectAfterChange } = (options || {}) as { [key: string]: any }\n\n return html`\n <ox-input-barcode\n name=${name}\n ?english-only=${englishOnly}\n ?select-after-change=${selectAfterChange}\n .value=${value === undefined ? '' : value}\n @change=${(e: CustomEvent) => {\n const input = e.target as HTMLInputElement\n input.dispatchEvent(\n new CustomEvent('filter-change', {\n bubbles: true,\n composed: true,\n detail: {\n name,\n operator: filter.operator,\n value: input.value\n }\n })\n )\n }}\n filter-input\n ?readonly=${readonly}\n ></ox-input-barcode>\n `\n}\n"]}
@@ -1,6 +1,6 @@
1
1
  import { html } from 'lit-html';
2
2
  export const FilterInput = (filter, value, owner) => {
3
- const { name, type } = filter;
3
+ const { name, type, readonly } = filter;
4
4
  return html `
5
5
  <input
6
6
  type=${type}
@@ -18,6 +18,7 @@ export const FilterInput = (filter, value, owner) => {
18
18
  }
19
19
  }));
20
20
  }}
21
+ ?readonly=${readonly}
21
22
  />
22
23
  `;
23
24
  };
@@ -1 +1 @@
1
- {"version":3,"file":"filter-input.js","sourceRoot":"","sources":["../../../src/filters/filter-input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAI/B,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IACxE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,MAAM,CAAA;IAE7B,OAAO,IAAI,CAAA;;aAEA,IAAI;aACJ,IAAI;eACF,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;gBAC/B,CAAC,CAAc,EAAE,EAAE;QAC3B,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAA;QAC1C,KAAK,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,eAAe,EAAE;YAC/B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,MAAM,CAAC,QAAQ;gBACzB,KAAK,EAAE,KAAK,CAAC,KAAK;aACnB;SACF,CAAC,CACH,CAAA;IACH,CAAC;;GAEJ,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { html } from 'lit-html'\n\nimport { FilterSelectRenderer } from '../types.js'\n\nexport const FilterInput: FilterSelectRenderer = (filter, value, owner) => {\n const { name, type } = filter\n\n return html`\n <input\n type=${type}\n name=${name}\n .value=${value === undefined ? '' : value}\n @change=${(e: CustomEvent) => {\n const input = e.target as HTMLInputElement\n input.dispatchEvent(\n new CustomEvent('filter-change', {\n bubbles: true,\n composed: true,\n detail: {\n name: name,\n operator: filter.operator,\n value: input.value\n }\n })\n )\n }}\n />\n `\n}\n"]}
1
+ {"version":3,"file":"filter-input.js","sourceRoot":"","sources":["../../../src/filters/filter-input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAI/B,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;IACxE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,MAAM,CAAA;IAEvC,OAAO,IAAI,CAAA;;aAEA,IAAI;aACJ,IAAI;eACF,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;gBAC/B,CAAC,CAAc,EAAE,EAAE;QAC3B,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAA;QAC1C,KAAK,CAAC,aAAa,CACjB,IAAI,WAAW,CAAC,eAAe,EAAE;YAC/B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE;gBACN,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,MAAM,CAAC,QAAQ;gBACzB,KAAK,EAAE,KAAK,CAAC,KAAK;aACnB;SACF,CAAC,CACH,CAAA;IACH,CAAC;kBACW,QAAQ;;GAEvB,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { html } from 'lit-html'\n\nimport { FilterSelectRenderer } from '../types.js'\n\nexport const FilterInput: FilterSelectRenderer = (filter, value, owner) => {\n const { name, type, readonly } = filter\n\n return html`\n <input\n type=${type}\n name=${name}\n .value=${value === undefined ? '' : value}\n @change=${(e: CustomEvent) => {\n const input = e.target as HTMLInputElement\n input.dispatchEvent(\n new CustomEvent('filter-change', {\n bubbles: true,\n composed: true,\n detail: {\n name: name,\n operator: filter.operator,\n value: input.value\n }\n })\n )\n }}\n ?readonly=${readonly}\n />\n `\n}\n"]}
@@ -9,7 +9,7 @@ function formatDate(type, date) {
9
9
  return type == 'date' ? formatDate : formatDate + 'T' + hours + ':' + minutes;
10
10
  }
11
11
  export const FilterRangeDate = (filter, value, owner) => {
12
- var { name, type, operator } = filter;
12
+ var { name, type, operator, readonly } = filter;
13
13
  var [from, to] = value instanceof Array ? value : [];
14
14
  if (type === 'datetime') {
15
15
  type = 'datetime-local';
@@ -37,6 +37,7 @@ export const FilterRangeDate = (filter, value, owner) => {
37
37
  }
38
38
  }));
39
39
  }}
40
+ ?readonly=${readonly}
40
41
  />
41
42
  ~
42
43
  <input
@@ -59,6 +60,7 @@ export const FilterRangeDate = (filter, value, owner) => {
59
60
  }
60
61
  }));
61
62
  }}
63
+ ?readonly=${readonly}
62
64
  />
63
65
  `;
64
66
  };