@things-factory/reference-app 7.0.6 → 7.0.7

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.
@@ -8,14 +8,15 @@ import { i18next, localize } from '@operato/i18n'
8
8
 
9
9
  import { PageView } from '@operato/shell'
10
10
  import { isMobileDevice } from '@operato/utils'
11
+ import { CommonGristStyles, CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'
11
12
  import { ReferencePageStyles } from './reference-page-styles'
12
- import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
13
13
 
14
14
  @customElement('grist-filters')
15
15
  class GristFilters extends localize(i18next)(PageView) {
16
16
  static styles = [
17
17
  ScrollbarStyles,
18
18
  CommonGristStyles,
19
+ CommonHeaderStyles,
19
20
  ReferencePageStyles,
20
21
  css`
21
22
  :host {
@@ -33,6 +34,10 @@ class GristFilters extends localize(i18next)(PageView) {
33
34
  ox-grist {
34
35
  flex: 2;
35
36
  }
37
+
38
+ ox-filters-form {
39
+ flex: 1;
40
+ }
36
41
  `
37
42
  ]
38
43
 
@@ -41,7 +46,6 @@ class GristFilters extends localize(i18next)(PageView) {
41
46
  @state() gristConfig?: any
42
47
  @state() fetchParameters?: any
43
48
 
44
- @query('#sorter-control') sorterControl?: any
45
49
  @query('ox-grist') grist!: DataGrist
46
50
 
47
51
  get context() {
@@ -60,31 +64,14 @@ class GristFilters extends localize(i18next)(PageView) {
60
64
  </div>
61
65
 
62
66
  <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
63
- <div slot="headroom">
64
- <div id="filters">
67
+ <div slot="headroom" class="header">
68
+ <div class="filters">
65
69
  <ox-filters-form autofocus without-search></ox-filters-form>
66
- </div>
67
-
68
- <div id="sorters">
69
- Sort
70
- <md-icon
71
- @click=${e => {
72
- const target = e.currentTarget
73
- this.sorterControl.open({
74
- right: 0,
75
- top: target.offsetTop + target.offsetHeight
76
- })
77
- }}
78
- >expand_more</md-icon
79
- >
80
- <ox-popup id="sorter-control">
81
- <ox-sorters-control> </ox-sorters-control>
82
- </ox-popup>
83
- </div>
84
70
 
85
- <div id="modes">
86
- <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
87
- <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
71
+ <div id="modes">
72
+ <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
73
+ <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
74
+ </div>
88
75
  </div>
89
76
  </div>
90
77
  </ox-grist>
@@ -126,7 +113,8 @@ class GristFilters extends localize(i18next)(PageView) {
126
113
  rate: Math.round(Math.random() * 100),
127
114
  dynamicType: ['text', 'email', 'checkbox', 'color', 'progress', 'barcode'][idx % 5],
128
115
  dynamicValue: ['abcdefghijkl', 'heartyoh@hatiolab.com', 'true', 'orange', '50', '1234567890'][idx % 5],
129
- homepage: idx % 2 ? `http://hatiolab.com/${start + idx + 1}` : `http://deadpool.hatiolab.com/${start + idx + 1}`,
116
+ homepage:
117
+ idx % 2 ? `http://hatiolab.com/${start + idx + 1}` : `http://deadpool.hatiolab.com/${start + idx + 1}`,
130
118
  createdAt: Date.now(),
131
119
  updatedAt: Date.now()
132
120
  }
@@ -5,17 +5,18 @@ import { customElement, property, query, state } from 'lit/decorators.js'
5
5
 
6
6
  import { DataGrist, getEditor, getRenderer } from '@operato/data-grist'
7
7
  import { i18next, localize } from '@operato/i18n'
8
-
9
8
  import { PageView } from '@operato/shell'
10
9
  import { isMobileDevice } from '@operato/utils'
10
+ import { CommonGristStyles, CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'
11
+
11
12
  import { ReferencePageStyles } from './reference-page-styles'
12
- import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
13
13
 
14
14
  @customElement('grist-fulltext-search')
15
15
  class GristFulltextSearch extends localize(i18next)(PageView) {
16
16
  static styles = [
17
17
  ScrollbarStyles,
18
18
  CommonGristStyles,
19
+ CommonHeaderStyles,
19
20
  ReferencePageStyles,
20
21
  css`
21
22
  :host {
@@ -33,6 +34,10 @@ class GristFulltextSearch extends localize(i18next)(PageView) {
33
34
  ox-grist {
34
35
  flex: 1;
35
36
  }
37
+
38
+ ox-filters-form {
39
+ flex: 1;
40
+ }
36
41
  `
37
42
  ]
38
43
 
@@ -261,7 +266,6 @@ class GristFulltextSearch extends localize(i18next)(PageView) {
261
266
  }
262
267
  }
263
268
 
264
- @query('#sorter-control') sorterControl?: any
265
269
  @query('ox-grist') grist!: DataGrist
266
270
 
267
271
  get context() {
@@ -291,31 +295,14 @@ class GristFulltextSearch extends localize(i18next)(PageView) {
291
295
  </div>
292
296
 
293
297
  <ox-grist .mode=${mode} .config=${this.config} .fetchHandler=${this.fetchHandler.bind(this)}>
294
- <div slot="headroom">
295
- <div id="filters">
298
+ <div slot="headroom" class="header">
299
+ <div class="filters">
296
300
  <ox-filters-form autofocus without-search></ox-filters-form>
297
- </div>
298
-
299
- <div id="sorters">
300
- Sort
301
- <md-icon
302
- @click=${e => {
303
- const target = e.currentTarget
304
- this.sorterControl.open({
305
- right: 0,
306
- top: target.offsetTop + target.offsetHeight
307
- })
308
- }}
309
- >expand_more</md-icon
310
- >
311
- <ox-popup id="sorter-control">
312
- <ox-sorters-control> </ox-sorters-control>
313
- </ox-popup>
314
- </div>
315
301
 
316
- <div id="modes">
317
- <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
318
- <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
302
+ <div id="modes">
303
+ <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
304
+ <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
305
+ </div>
319
306
  </div>
320
307
  </div>
321
308
  </ox-grist>
@@ -357,7 +344,8 @@ class GristFulltextSearch extends localize(i18next)(PageView) {
357
344
  rate: Math.round(Math.random() * 100),
358
345
  dynamicType: ['text', 'email', 'checkbox', 'color', 'progress', 'barcode'][idx % 5],
359
346
  dynamicValue: ['abcdefghijkl', 'heartyoh@hatiolab.com', 'true', 'orange', '50', '1234567890'][idx % 5],
360
- homepage: idx % 2 ? `http://hatiolab.com/${start + idx + 1}` : `http://deadpool.hatiolab.com/${start + idx + 1}`,
347
+ homepage:
348
+ idx % 2 ? `http://hatiolab.com/${start + idx + 1}` : `http://deadpool.hatiolab.com/${start + idx + 1}`,
361
349
  createdAt: Date.now(),
362
350
  updatedAt: Date.now()
363
351
  }