@things-factory/setting-ui 7.0.1-alpha.98 → 7.0.1-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 (28) hide show
  1. package/client/bootstrap.ts +3 -11
  2. package/client/components/partner-selector.ts +4 -2
  3. package/client/pages/partner-setting-list.ts +1 -1
  4. package/client/pages/setting.ts +1 -1
  5. package/client/set-theme-mode.ts +36 -4
  6. package/client/setting-lets/secure-iplist-setting-let.ts +11 -5
  7. package/client/setting-lets/theme-mode-setting-let.ts +1 -1
  8. package/client/themes/setting-theme.css +3 -3
  9. package/dist-client/bootstrap.d.ts +1 -1
  10. package/dist-client/bootstrap.js +4 -11
  11. package/dist-client/bootstrap.js.map +1 -1
  12. package/dist-client/components/partner-selector.js +4 -2
  13. package/dist-client/components/partner-selector.js.map +1 -1
  14. package/dist-client/pages/partner-setting-list.js +1 -1
  15. package/dist-client/pages/partner-setting-list.js.map +1 -1
  16. package/dist-client/pages/setting.js +1 -1
  17. package/dist-client/pages/setting.js.map +1 -1
  18. package/dist-client/set-theme-mode.js +29 -3
  19. package/dist-client/set-theme-mode.js.map +1 -1
  20. package/dist-client/setting-lets/secure-iplist-setting-let.js +5 -3
  21. package/dist-client/setting-lets/secure-iplist-setting-let.js.map +1 -1
  22. package/dist-client/setting-lets/theme-mode-setting-let.js +1 -1
  23. package/dist-client/setting-lets/theme-mode-setting-let.js.map +1 -1
  24. package/dist-client/themes/setting-theme.css +3 -3
  25. package/dist-client/tsconfig.tsbuildinfo +1 -1
  26. package/dist-server/tsconfig.tsbuildinfo +1 -1
  27. package/package.json +8 -8
  28. package/things-factory.config.js +2 -0
package/client/bootstrap.ts CHANGED
@@ -1,16 +1,8 @@
1
1
  import { clientSettingStore } from '@operato/shell'
2
2
  import { setThemeMode } from './set-theme-mode.js'
3
3
 
4
- export default function bootstrap() {
5
- document.addEventListener('DOMContentLoaded', async () => {
6
- const themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'
4
+ export default async function bootstrap() {
5
+ const themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'
7
6
 
8
- setThemeMode(themeMode)
9
-
10
- if (themeMode === 'auto') {
11
- window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
12
- themeMode('auto')
13
- })
14
- }
15
- })
7
+ setThemeMode(themeMode)
16
8
  }
package/client/components/partner-selector.ts CHANGED
@@ -22,7 +22,7 @@ class PartnerSelector extends LitElement {
22
22
  display: flex;
23
23
  flex-direction: column;
24
24
  overflow: hidden;
25
- background-color: white;
25
+ background-color: var(--md-sys-color-surface);
26
26
  }
27
27
  `
28
28
  ]
@@ -44,7 +44,9 @@ class PartnerSelector extends LitElement {
44
44
  </ox-grist>
45
45
 
46
46
  <div class="button-container">
47
- <button @click="${this.select.bind(this)}"><md-icon>select_check_box</md-icon>${i18next.t('button.select')}</button>
47
+ <button @click="${this.select.bind(this)}">
48
+ <md-icon>select_check_box</md-icon>${i18next.t('button.select')}
49
+ </button>
48
50
  </div>
49
51
  `
50
52
  }
package/client/pages/partner-setting-list.ts CHANGED
@@ -40,7 +40,7 @@ export class PartnerSettingList extends connect(store)(localize(i18next)(PageVie
40
40
  border-radius: var(--border-radius);
41
41
  margin: var(--input-margin);
42
42
  padding: var(--input-padding);
43
- background-color: var(--theme-white-color);
43
+ background-color: var(--md-sys-color-surface);
44
44
  font: var(--input-font);
45
45
  }
46
46
  `
package/client/pages/setting.ts CHANGED
@@ -11,7 +11,7 @@ export class SettingPage extends connect(store)(localize(i18next)(PageView)) {
11
11
  css`
12
12
  :host {
13
13
  overflow-y: auto;
14
- background-color: var(--setting-background);
14
+ background-color: var(--md-sys-color-background);
15
15
  }
16
16
  div {
17
17
  margin: var(--setting-icon-margin);
package/client/set-theme-mode.ts CHANGED
@@ -1,4 +1,35 @@
1
+ import { clientSettingStore } from '@operato/shell'
2
+
3
+ var prefersColorSchemeMedia
4
+
5
+ function getPrefersColorSchemeMedia() {
6
+ if (!prefersColorSchemeMedia) {
7
+ prefersColorSchemeMedia = window.matchMedia('(prefers-color-scheme: dark)')
8
+ }
9
+ return prefersColorSchemeMedia
10
+ }
11
+
12
+ async function onPreferColorSchemeChanged() {
13
+ const themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'
14
+
15
+ if (themeMode !== 'auto') {
16
+ getPrefersColorSchemeMedia().removeEventListener('change', onPreferColorSchemeChanged)
17
+
18
+ return
19
+ }
20
+
21
+ if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
22
+ document.body.classList.add('dark')
23
+ document.body.classList.remove('light')
24
+ } else {
25
+ document.body.classList.add('light')
26
+ document.body.classList.remove('dark')
27
+ }
28
+ }
29
+
1
30
  export function setThemeMode(mode) {
31
+ getPrefersColorSchemeMedia().removeEventListener('change', onPreferColorSchemeChanged)
32
+
2
33
  if (mode === 'dark') {
3
34
  document.body.classList.add('dark')
4
35
  document.body.classList.remove('light')
@@ -6,13 +37,14 @@ export function setThemeMode(mode) {
6
37
  document.body.classList.add('light')
7
38
  document.body.classList.remove('dark')
8
39
  } else {
9
- document.body.classList.remove('dark')
10
- document.body.classList.remove('light')
11
-
12
- if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
40
+ if (getPrefersColorSchemeMedia().matches) {
13
41
  document.body.classList.add('dark')
42
+ document.body.classList.remove('light')
14
43
  } else {
15
44
  document.body.classList.add('light')
45
+ document.body.classList.remove('dark')
16
46
  }
47
+
48
+ getPrefersColorSchemeMedia().addEventListener('change', onPreferColorSchemeChanged)
17
49
  }
18
50
  }
package/client/setting-lets/secure-iplist-setting-let.ts CHANGED
@@ -21,14 +21,14 @@ export class SecureIPListSettingLet extends LitElement {
21
21
 
22
22
  ul {
23
23
  flex: 1;
24
- background-color: var(--theme-white-color);
24
+ background-color: var(--md-sys-color-primary-container);
25
25
  overflow: auto;
26
26
  display: grid;
27
27
  grid-template-columns: 1fr 1fr;
28
28
  margin: 0;
29
29
  padding: var(--padding-default);
30
30
  list-style: none;
31
- border: 1px dashed rgba(0, 0, 0, 0.1);
31
+ border: 1px dashed var(--md-sys-color-outline);
32
32
  border-width: 1px 0;
33
33
  }
34
34
 
@@ -67,7 +67,9 @@ export class SecureIPListSettingLet extends LitElement {
67
67
 
68
68
  return html`
69
69
  <setting-let>
70
- <ox-title-with-help slot="title" topic="setting/secure-ip-list" msgid="title.secure-ip-list">secure IP list</ox-title-with-help>
70
+ <ox-title-with-help slot="title" topic="setting/secure-ip-list" msgid="title.secure-ip-list"
71
+ >secure IP list</ox-title-with-help
72
+ >
71
73
 
72
74
  <div slot="content" @change=${() => this.onSave()}>
73
75
  <md-filled-text-field
@@ -117,7 +119,9 @@ export class SecureIPListSettingLet extends LitElement {
117
119
  <input
118
120
  type="checkbox"
119
121
  id=${id}
120
- .checked=${!!privileges.find(p => p.privilege == privilege.privilege && p.category == privilege.category)}
122
+ .checked=${!!privileges.find(
123
+ p => p.privilege == privilege.privilege && p.category == privilege.category
124
+ )}
121
125
  .data-privilege=${privilege}
122
126
  />
123
127
  <label for="${id}">${privilege.description}</label>
@@ -161,7 +165,9 @@ export class SecureIPListSettingLet extends LitElement {
161
165
  }
162
166
 
163
167
  checkAll(checked) {
164
- Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(checkbox => ((checkbox as HTMLInputElement).checked = checked))
168
+ Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(
169
+ checkbox => ((checkbox as HTMLInputElement).checked = checked)
170
+ )
165
171
  }
166
172
 
167
173
  oncheckAll(e) {
package/client/setting-lets/theme-mode-setting-let.ts CHANGED
@@ -19,7 +19,7 @@ export class ThemeModeSettingLet extends localize(i18next)(LitElement) {
19
19
  align-items: center;
20
20
 
21
21
  font: var(--label-font);
22
- color: var(--label-color);
22
+ color: var(--md-sys-color-on-primary-container);
23
23
  text-transform: var(--label-text-transform);
24
24
  }
25
25
 
package/client/themes/setting-theme.css CHANGED
@@ -1,5 +1,5 @@
1
1
  body {
2
- --setting-background: var(--main-section-background-color);
2
+ --setting-background: var(--md-sys-color-background);
3
3
 
4
4
  --setting-let-background: var(--theme-white-color);
5
5
  --setting-let-margin: var(--margin-wide);
@@ -11,13 +11,13 @@ body {
11
11
 
12
12
  --setting-content-padding: var(--padding-wide);
13
13
  --setting-content-font: normal 0.9em var(--theme-font);
14
- --setting-content-color: var(--secondary-color);
14
+ --setting-content-color: var(--md-sys-color-secondary);
15
15
 
16
16
  --setting-info-content-padding: 10px 15px;
17
17
  --setting-info-background-color: #f0f0f0;
18
18
  --setting-info-font: normal 14px/14px var(--theme-font);
19
19
  --setting-info-color: #666;
20
- --setting-info-appname-color: var(--primary-color);
20
+ --setting-info-appname-color: var(--md-sys-color-primary);
21
21
 
22
22
  --setting-icon-height: 170px;
23
23
  --setting-icon-margin: 40px 0 5px 0;
package/dist-client/bootstrap.d.ts CHANGED
@@ -1 +1 @@
1
- export default function bootstrap(): void;
1
+ export default function bootstrap(): Promise<void>;
package/dist-client/bootstrap.js CHANGED
@@ -1,15 +1,8 @@
1
1
  import { clientSettingStore } from '@operato/shell';
2
2
  import { setThemeMode } from './set-theme-mode.js';
3
- export default function bootstrap() {
4
- document.addEventListener('DOMContentLoaded', async () => {
5
- var _a;
6
- const themeMode = (((_a = (await clientSettingStore.get('theme'))) === null || _a === void 0 ? void 0 : _a.value) || {}).mode || 'light';
7
- setThemeMode(themeMode);
8
- if (themeMode === 'auto') {
9
- window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
10
- themeMode('auto');
11
- });
12
- }
13
- });
3
+ export default async function bootstrap() {
4
+ var _a;
5
+ const themeMode = (((_a = (await clientSettingStore.get('theme'))) === null || _a === void 0 ? void 0 : _a.value) || {}).mode || 'light';
6
+ setThemeMode(themeMode);
14
7
  }
15
8
  //# sourceMappingURL=bootstrap.js.map
package/dist-client/bootstrap.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAA;AAElD,MAAM,CAAC,OAAO,UAAU,SAAS;IAC/B,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,KAAK,IAAI,EAAE;;QACvD,MAAM,SAAS,GAAG,CAAC,CAAA,MAAA,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,IAAI,IAAI,OAAO,CAAA;QAExF,YAAY,CAAC,SAAS,CAAC,CAAA;QAEvB,IAAI,SAAS,KAAK,MAAM,EAAE;YACxB,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE;gBAC/E,SAAS,CAAC,MAAM,CAAC,CAAA;YACnB,CAAC,CAAC,CAAA;SACH;IACH,CAAC,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import { clientSettingStore } from '@operato/shell'\nimport { setThemeMode } from './set-theme-mode.js'\n\nexport default function bootstrap() {\n document.addEventListener('DOMContentLoaded', async () => {\n const themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'\n\n setThemeMode(themeMode)\n\n if (themeMode === 'auto') {\n window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {\n themeMode('auto')\n })\n }\n })\n}\n"]}
1
+ {"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAA;AAElD,MAAM,CAAC,OAAO,CAAC,KAAK,UAAU,SAAS;;IACrC,MAAM,SAAS,GAAG,CAAC,CAAA,MAAA,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,IAAI,IAAI,OAAO,CAAA;IAExF,YAAY,CAAC,SAAS,CAAC,CAAA;AACzB,CAAC","sourcesContent":["import { clientSettingStore } from '@operato/shell'\nimport { setThemeMode } from './set-theme-mode.js'\n\nexport default async function bootstrap() {\n const themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'\n\n setThemeMode(themeMode)\n}\n"]}
package/dist-client/components/partner-selector.js CHANGED
@@ -26,7 +26,9 @@ let PartnerSelector = class PartnerSelector extends LitElement {
26
26
  </ox-grist>
27
27
 
28
28
  <div class="button-container">
29
- <button @click="${this.select.bind(this)}"><md-icon>select_check_box</md-icon>${i18next.t('button.select')}</button>
29
+ <button @click="${this.select.bind(this)}">
30
+ <md-icon>select_check_box</md-icon>${i18next.t('button.select')}
31
+ </button>
30
32
  </div>
31
33
  `;
32
34
  }
@@ -105,7 +107,7 @@ PartnerSelector.styles = [
105
107
  display: flex;
106
108
  flex-direction: column;
107
109
  overflow: hidden;
108
- background-color: white;
110
+ background-color: var(--md-sys-color-surface);
109
111
  }
110
112
  `
111
113
  ];
package/dist-client/components/partner-selector.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"partner-selector.js","sourceRoot":"","sources":["../../client/components/partner-selector.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@things-factory/form-ui'\nimport '@operato/data-grist'\n\nimport { i18next } from '@operato/i18n'\nimport { client, gqlContext } from '@operato/graphql'\nimport { isMobileDevice } from '@operato/utils'\nimport { CommonGristStyles } from '@operato/styles'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { ButtonContainerStyles } from '@operato/styles'\n\n@customElement('partner-selector')\nclass PartnerSelector extends LitElement {\n static styles = [\n ButtonContainerStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background-color: white;\n }\n `\n ]\n\n @state() private config: any\n @state() private data: any\n @state() private mode: string = isMobileDevice() ? 'LIST' : 'GRID'\n\n @query('ox-grist') private dataGrist: any\n\n render() {\n return html`\n <ox-grist .mode=${this.mode} auto-fetch .config=${this.config} .fetchHandler=${this.fetchHandler.bind(this)}>\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form></ox-filters-form>\n </div>\n </div>\n </ox-grist>\n\n <div class=\"button-container\">\n <button @click=\"${this.select.bind(this)}\"><md-icon>select_check_box</md-icon>${i18next.t('button.select')}</button>\n </div>\n `\n }\n\n firstUpdated() {\n this.config = {\n list: { fields: ['name', 'description'] },\n rows: { selectable: { multiple: true }, appendable: false, handlers: { click: 'select-row-toggle' } },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: false },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 100\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 200\n }\n ]\n }\n }\n\n async fetchHandler({ filters, page, limit, sorters = [] }) {\n const pagination = { page, limit }\n const sortings = sorters\n\n const response = await client.query({\n query: gql`\n query searchCustomers($filters: [Filter!]!, $pagination: Pagination!, $sortings: [Sorting!]!) {\n searchCustomers(filters: $filters, pagination: $pagination, sortings: $sortings) {\n items {\n id\n name\n description\n }\n total\n }\n }\n `,\n variables: { filters, pagination, sortings },\n context: gqlContext()\n })\n\n return {\n records: response.data.searchCustomers.items || [],\n total: response.data.searchCustomers.total || 0\n }\n }\n\n select() {\n const selectedItems = this.dataGrist.selected\n if (!selectedItems.length) {\n this.showToast(i18next.t('text.nothing_selected'))\n return\n }\n\n history.back()\n\n this.dispatchEvent(\n new CustomEvent('select', {\n detail: selectedItems[0]\n })\n )\n }\n\n showToast(message) {\n document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n }\n}\n"]}
1
+ {"version":3,"file":"partner-selector.js","sourceRoot":"","sources":["../../client/components/partner-selector.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@things-factory/form-ui'\nimport '@operato/data-grist'\n\nimport { i18next } from '@operato/i18n'\nimport { client, gqlContext } from '@operato/graphql'\nimport { isMobileDevice } from '@operato/utils'\nimport { CommonGristStyles } from '@operato/styles'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { ButtonContainerStyles } from '@operato/styles'\n\n@customElement('partner-selector')\nclass PartnerSelector extends LitElement {\n static styles = [\n ButtonContainerStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background-color: var(--md-sys-color-surface);\n }\n `\n ]\n\n @state() private config: any\n @state() private data: any\n @state() private mode: string = isMobileDevice() ? 'LIST' : 'GRID'\n\n @query('ox-grist') private dataGrist: any\n\n render() {\n return html`\n <ox-grist .mode=${this.mode} auto-fetch .config=${this.config} .fetchHandler=${this.fetchHandler.bind(this)}>\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form></ox-filters-form>\n </div>\n </div>\n </ox-grist>\n\n <div class=\"button-container\">\n <button @click=\"${this.select.bind(this)}\">\n <md-icon>select_check_box</md-icon>${i18next.t('button.select')}\n </button>\n </div>\n `\n }\n\n firstUpdated() {\n this.config = {\n list: { fields: ['name', 'description'] },\n rows: { selectable: { multiple: true }, appendable: false, handlers: { click: 'select-row-toggle' } },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: false },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 100\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 200\n }\n ]\n }\n }\n\n async fetchHandler({ filters, page, limit, sorters = [] }) {\n const pagination = { page, limit }\n const sortings = sorters\n\n const response = await client.query({\n query: gql`\n query searchCustomers($filters: [Filter!]!, $pagination: Pagination!, $sortings: [Sorting!]!) {\n searchCustomers(filters: $filters, pagination: $pagination, sortings: $sortings) {\n items {\n id\n name\n description\n }\n total\n }\n }\n `,\n variables: { filters, pagination, sortings },\n context: gqlContext()\n })\n\n return {\n records: response.data.searchCustomers.items || [],\n total: response.data.searchCustomers.total || 0\n }\n }\n\n select() {\n const selectedItems = this.dataGrist.selected\n if (!selectedItems.length) {\n this.showToast(i18next.t('text.nothing_selected'))\n return\n }\n\n history.back()\n\n this.dispatchEvent(\n new CustomEvent('select', {\n detail: selectedItems[0]\n })\n )\n }\n\n showToast(message) {\n document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n }\n}\n"]}
package/dist-client/pages/partner-setting-list.js CHANGED
@@ -323,7 +323,7 @@ PartnerSettingList.styles = [
323
323
  border-radius: var(--border-radius);
324
324
  margin: var(--input-margin);
325
325
  padding: var(--input-padding);
326
- background-color: var(--theme-white-color);
326
+ background-color: var(--md-sys-color-surface);
327
327
  font: var(--input-font);
328
328
  }
329
329
  `
package/dist-client/pages/partner-setting-list.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"partner-setting-list.js","sourceRoot":"","sources":["../../client/pages/partner-setting-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@things-factory/form-ui'\nimport '../components/partner-selector'\n\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin'\n\nimport { openPopup } from '@operato/layout'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView, store } from '@operato/shell'\nimport { client, gqlContext } from '@operato/graphql'\nimport { ScrollbarStyles, CommonButtonStyles, CommonGristStyles } from '@operato/styles'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\nimport { FetchOption, getEditor, getRenderer } from '@operato/data-grist'\nimport { isMobileDevice } from '@operato/utils'\n\n@customElement('partner-setting-list')\nexport class PartnerSettingList extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n CommonGristStyles,\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n fieldset {\n max-width: var(--input-container-max-width);\n border: none;\n }\n label {\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n input {\n border: var(--border-dark-color);\n border-radius: var(--border-radius);\n margin: var(--input-margin);\n padding: var(--input-padding);\n background-color: var(--theme-white-color);\n font: var(--input-font);\n }\n `\n ]\n\n @state() private config: any\n @state() private partnerDomain: any\n @state() private mode: 'GRID' | 'LIST' | 'CARD' = isMobileDevice() ? 'LIST' : 'GRID'\n\n @query('ox-grist') private dataGrist: any\n\n render() {\n return html`\n <form class=\"multi-column-form\">\n <fieldset>\n <label>${i18next.t('label.partner')}</label>\n <input\n readonly\n name=\"partnerDomain\"\n value=\"${this.partnerDomain?.name ? this.partnerDomain.name : ''}\"\n @click=\"${this.openPartnerSelector.bind(this)}\"\n placeholder=${String(i18next.t('text.please_choose_partner') || '')}\n />\n </fieldset>\n </form>\n\n <ox-grist\n .mode=${this.mode}\n .config=${this.config}\n .fetchHandler=\"${this.fetchHandler.bind(this)}\"\n @record-change=\"${this.onRecordChangeHandler.bind(this)}\"\n >\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form></ox-filters-form>\n </div>\n </div>\n </ox-grist>\n `\n }\n\n get context() {\n return {\n title: i18next.t('title.partner_setting'),\n help: 'setting/partner-setting',\n actions: [\n {\n title: i18next.t('button.save'),\n action: this.save.bind(this),\n ...CommonButtonStyles.save\n },\n {\n title: i18next.t('button.delete'),\n action: this.delete.bind(this),\n ...CommonButtonStyles.delete\n }\n ]\n }\n }\n\n pageInitialized() {\n this.config = {\n list: {\n fields: ['name', 'description', 'value']\n },\n rows: { selectable: { multiple: true } },\n columns: [\n { type: 'gutter', gutterName: 'dirty' },\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'object',\n name: 'setting',\n header: i18next.t('label.setting'),\n width: 280,\n record: {\n editable: true,\n options: {\n queryName: 'settings',\n select: [\n { name: 'id', hidden: true },\n { name: 'name', header: i18next.t('field.name') },\n { name: 'description', header: i18next.t('field.description') },\n { name: 'category', header: i18next.t('field.category') }\n ],\n list: { fields: ['name', 'description', 'category'] }\n }\n }\n },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 200\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 200\n },\n {\n type: 'code',\n name: 'category',\n header: i18next.t('field.category'),\n record: { editable: false, codeName: 'SETTING_CATEGORIES' },\n sortable: true,\n width: 150\n },\n {\n type: 'string',\n name: 'value',\n header: i18next.t('field.value'),\n record: {\n editor: function (value, column, record, rowIndex, field) {\n return getEditor(record.category)(value, column, record, rowIndex, field)\n },\n renderer: function (value, column, record, rowIndex, field) {\n return getRenderer(record.category)(value, column, record, rowIndex, field)\n },\n editable: true\n },\n sortable: true,\n width: 180\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n record: { editable: false, align: 'left' },\n sortable: true,\n width: 150\n },\n {\n type: 'object',\n name: 'updater',\n header: i18next.t('field.updater'),\n record: { editable: false, align: 'left' },\n sortable: true,\n width: 150\n }\n ]\n }\n }\n\n pageUpdated() {\n if (this.active) {\n this.partnerDomain = null\n this.dataGrist.data = { records: [], total: 0 }\n }\n }\n\n async fetchHandler({ filters, page, limit, sorters = [] }: FetchOption) {\n if (!this.partnerDomain) return { total: 0, records: [] }\n\n const pagination = { page, limit }\n const sortings = sorters\n\n const response = await client.query({\n query: gql`\n query partnerSettings(\n $filters: [Filter!]!\n $pagination: Pagination!\n $sortings: [Sorting!]!\n $partnerDomain: ObjectRef!\n ) {\n partnerSettings(\n filters: $filters\n pagination: $pagination\n sortings: $sortings\n partnerDomain: $partnerDomain\n ) {\n items {\n id\n setting {\n id\n name\n description\n category\n }\n name\n description\n category\n value\n updatedAt\n updater {\n id\n name\n description\n }\n }\n total\n }\n }\n `,\n variables: { filters, pagination, sortings, partnerDomain: { id: this.partnerDomain.id } },\n context: gqlContext()\n })\n\n return {\n records:\n response.data.partnerSettings.items.map(item => {\n return { ...item, description: item.setting.description, category: item.setting.category }\n }) || [],\n total: response.data.partnerSettings.total || 0\n }\n }\n\n async save() {\n let patches = this.dataGrist.dirtyRecords\n\n if (!patches?.length) {\n return this.showToast(i18next.t('text.nothing_changed'))\n }\n\n patches = patches.map(partnerSetting => {\n let patchField: any = {\n cuFlag: partnerSetting.__dirty__,\n setting: { id: partnerSetting.setting.id },\n partnerDomain: { id: this.partnerDomain.id }\n }\n if (partnerSetting.id) patchField.id = partnerSetting.id\n if (partnerSetting.value) patchField.value = partnerSetting.value\n\n return patchField\n })\n\n const response = await client.mutate({\n mutation: gql`\n mutation updateMultiplePartnerSetting($patches: [PartnerSettingPatch!]!) {\n updateMultiplePartnerSetting(patches: $patches) {\n name\n }\n }\n `,\n variables: { patches },\n context: gqlContext()\n })\n\n if (!response.errors?.length) {\n this.showToast(i18next.t('text.data_updated_successfully'))\n this.dataGrist.fetch()\n }\n }\n\n async delete() {\n if (!this.dataGrist.selected?.length) {\n return this.showToast(i18next.t('text.there_is_nothing_to_delete'))\n }\n\n const ids = this.dataGrist.selected.map(record => record.id)\n\n if (\n await OxPrompt.open({\n type: 'warning',\n title: i18next.t('button.delete'),\n text: i18next.t('text.are_you_sure'),\n confirmButton: { text: i18next.t('button.delete') },\n cancelButton: { text: i18next.t('button.cancel') }\n })\n ) {\n const response = await client.mutate({\n mutation: gql`\n mutation deletePartnerSettings($ids: [String!]!) {\n deletePartnerSettings(ids: $ids)\n }\n `,\n variables: { ids },\n context: gqlContext()\n })\n\n if (!response.errors) {\n await OxPrompt.open({\n type: 'success',\n title: i18next.t('text.completed'),\n text: i18next.t('text.data_deleted_successfully'),\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n this.dataGrist.fetch()\n }\n }\n }\n\n openPartnerSelector() {\n openPopup(\n html`\n <partner-selector\n @select=\"${e => {\n this.partnerDomain = e.detail\n this.dataGrist.fetch()\n }}\"\n ></partner-selector>\n `,\n {\n backdrop: true,\n title: i18next.t('label.partner')\n }\n )\n }\n\n onRecordChangeHandler({ detail: { after, column } }) {\n if (column.name === 'setting') {\n this.fillUpFields(after)\n }\n }\n\n fillUpFields(record) {\n record.name = record.setting.name\n record.description = record.setting.description\n record.category = record.setting.category\n }\n\n showToast(message) {\n document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n }\n}\n"]}
1
+ {"version":3,"file":"partner-setting-list.js","sourceRoot":"","sources":["../../client/pages/partner-setting-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@things-factory/form-ui'\nimport '../components/partner-selector'\n\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin'\n\nimport { openPopup } from '@operato/layout'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView, store } from '@operato/shell'\nimport { client, gqlContext } from '@operato/graphql'\nimport { ScrollbarStyles, CommonButtonStyles, CommonGristStyles } from '@operato/styles'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\nimport { FetchOption, getEditor, getRenderer } from '@operato/data-grist'\nimport { isMobileDevice } from '@operato/utils'\n\n@customElement('partner-setting-list')\nexport class PartnerSettingList extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n CommonGristStyles,\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n fieldset {\n max-width: var(--input-container-max-width);\n border: none;\n }\n label {\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n input {\n border: var(--border-dark-color);\n border-radius: var(--border-radius);\n margin: var(--input-margin);\n padding: var(--input-padding);\n background-color: var(--md-sys-color-surface);\n font: var(--input-font);\n }\n `\n ]\n\n @state() private config: any\n @state() private partnerDomain: any\n @state() private mode: 'GRID' | 'LIST' | 'CARD' = isMobileDevice() ? 'LIST' : 'GRID'\n\n @query('ox-grist') private dataGrist: any\n\n render() {\n return html`\n <form class=\"multi-column-form\">\n <fieldset>\n <label>${i18next.t('label.partner')}</label>\n <input\n readonly\n name=\"partnerDomain\"\n value=\"${this.partnerDomain?.name ? this.partnerDomain.name : ''}\"\n @click=\"${this.openPartnerSelector.bind(this)}\"\n placeholder=${String(i18next.t('text.please_choose_partner') || '')}\n />\n </fieldset>\n </form>\n\n <ox-grist\n .mode=${this.mode}\n .config=${this.config}\n .fetchHandler=\"${this.fetchHandler.bind(this)}\"\n @record-change=\"${this.onRecordChangeHandler.bind(this)}\"\n >\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form></ox-filters-form>\n </div>\n </div>\n </ox-grist>\n `\n }\n\n get context() {\n return {\n title: i18next.t('title.partner_setting'),\n help: 'setting/partner-setting',\n actions: [\n {\n title: i18next.t('button.save'),\n action: this.save.bind(this),\n ...CommonButtonStyles.save\n },\n {\n title: i18next.t('button.delete'),\n action: this.delete.bind(this),\n ...CommonButtonStyles.delete\n }\n ]\n }\n }\n\n pageInitialized() {\n this.config = {\n list: {\n fields: ['name', 'description', 'value']\n },\n rows: { selectable: { multiple: true } },\n columns: [\n { type: 'gutter', gutterName: 'dirty' },\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'object',\n name: 'setting',\n header: i18next.t('label.setting'),\n width: 280,\n record: {\n editable: true,\n options: {\n queryName: 'settings',\n select: [\n { name: 'id', hidden: true },\n { name: 'name', header: i18next.t('field.name') },\n { name: 'description', header: i18next.t('field.description') },\n { name: 'category', header: i18next.t('field.category') }\n ],\n list: { fields: ['name', 'description', 'category'] }\n }\n }\n },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 200\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: { editable: false, align: 'left' },\n sortable: true,\n filter: 'search',\n width: 200\n },\n {\n type: 'code',\n name: 'category',\n header: i18next.t('field.category'),\n record: { editable: false, codeName: 'SETTING_CATEGORIES' },\n sortable: true,\n width: 150\n },\n {\n type: 'string',\n name: 'value',\n header: i18next.t('field.value'),\n record: {\n editor: function (value, column, record, rowIndex, field) {\n return getEditor(record.category)(value, column, record, rowIndex, field)\n },\n renderer: function (value, column, record, rowIndex, field) {\n return getRenderer(record.category)(value, column, record, rowIndex, field)\n },\n editable: true\n },\n sortable: true,\n width: 180\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n record: { editable: false, align: 'left' },\n sortable: true,\n width: 150\n },\n {\n type: 'object',\n name: 'updater',\n header: i18next.t('field.updater'),\n record: { editable: false, align: 'left' },\n sortable: true,\n width: 150\n }\n ]\n }\n }\n\n pageUpdated() {\n if (this.active) {\n this.partnerDomain = null\n this.dataGrist.data = { records: [], total: 0 }\n }\n }\n\n async fetchHandler({ filters, page, limit, sorters = [] }: FetchOption) {\n if (!this.partnerDomain) return { total: 0, records: [] }\n\n const pagination = { page, limit }\n const sortings = sorters\n\n const response = await client.query({\n query: gql`\n query partnerSettings(\n $filters: [Filter!]!\n $pagination: Pagination!\n $sortings: [Sorting!]!\n $partnerDomain: ObjectRef!\n ) {\n partnerSettings(\n filters: $filters\n pagination: $pagination\n sortings: $sortings\n partnerDomain: $partnerDomain\n ) {\n items {\n id\n setting {\n id\n name\n description\n category\n }\n name\n description\n category\n value\n updatedAt\n updater {\n id\n name\n description\n }\n }\n total\n }\n }\n `,\n variables: { filters, pagination, sortings, partnerDomain: { id: this.partnerDomain.id } },\n context: gqlContext()\n })\n\n return {\n records:\n response.data.partnerSettings.items.map(item => {\n return { ...item, description: item.setting.description, category: item.setting.category }\n }) || [],\n total: response.data.partnerSettings.total || 0\n }\n }\n\n async save() {\n let patches = this.dataGrist.dirtyRecords\n\n if (!patches?.length) {\n return this.showToast(i18next.t('text.nothing_changed'))\n }\n\n patches = patches.map(partnerSetting => {\n let patchField: any = {\n cuFlag: partnerSetting.__dirty__,\n setting: { id: partnerSetting.setting.id },\n partnerDomain: { id: this.partnerDomain.id }\n }\n if (partnerSetting.id) patchField.id = partnerSetting.id\n if (partnerSetting.value) patchField.value = partnerSetting.value\n\n return patchField\n })\n\n const response = await client.mutate({\n mutation: gql`\n mutation updateMultiplePartnerSetting($patches: [PartnerSettingPatch!]!) {\n updateMultiplePartnerSetting(patches: $patches) {\n name\n }\n }\n `,\n variables: { patches },\n context: gqlContext()\n })\n\n if (!response.errors?.length) {\n this.showToast(i18next.t('text.data_updated_successfully'))\n this.dataGrist.fetch()\n }\n }\n\n async delete() {\n if (!this.dataGrist.selected?.length) {\n return this.showToast(i18next.t('text.there_is_nothing_to_delete'))\n }\n\n const ids = this.dataGrist.selected.map(record => record.id)\n\n if (\n await OxPrompt.open({\n type: 'warning',\n title: i18next.t('button.delete'),\n text: i18next.t('text.are_you_sure'),\n confirmButton: { text: i18next.t('button.delete') },\n cancelButton: { text: i18next.t('button.cancel') }\n })\n ) {\n const response = await client.mutate({\n mutation: gql`\n mutation deletePartnerSettings($ids: [String!]!) {\n deletePartnerSettings(ids: $ids)\n }\n `,\n variables: { ids },\n context: gqlContext()\n })\n\n if (!response.errors) {\n await OxPrompt.open({\n type: 'success',\n title: i18next.t('text.completed'),\n text: i18next.t('text.data_deleted_successfully'),\n confirmButton: { text: i18next.t('button.confirm') }\n })\n\n this.dataGrist.fetch()\n }\n }\n }\n\n openPartnerSelector() {\n openPopup(\n html`\n <partner-selector\n @select=\"${e => {\n this.partnerDomain = e.detail\n this.dataGrist.fetch()\n }}\"\n ></partner-selector>\n `,\n {\n backdrop: true,\n title: i18next.t('label.partner')\n }\n )\n }\n\n onRecordChangeHandler({ detail: { after, column } }) {\n if (column.name === 'setting') {\n this.fillUpFields(after)\n }\n }\n\n fillUpFields(record) {\n record.name = record.setting.name\n record.description = record.setting.description\n record.category = record.setting.category\n }\n\n showToast(message) {\n document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n }\n}\n"]}
package/dist-client/pages/setting.js CHANGED
@@ -31,7 +31,7 @@ SettingPage.styles = [
31
31
  css `
32
32
  :host {
33
33
  overflow-y: auto;
34
- background-color: var(--setting-background);
34
+ background-color: var(--md-sys-color-background);
35
35
  }
36
36
  div {
37
37
  margin: var(--setting-icon-margin);
package/dist-client/pages/setting.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"setting.js","sourceRoot":"","sources":["../../client/pages/setting.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAmB,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AAEtD,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAChD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAG1C,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC;IAArE;;QAgBY,cAAS,GAAU,EAAE,CAAA;IAsBxC,CAAC;IApBC,MAAM;QACJ,IAAI,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACjD,OAAO,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,CAAA;QACtB,CAAC,CAAC,CAAA;QAEF,OAAO,IAAI,CAAA;;QAEP,eAAe,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAA,IAAI,OAAO,CAAC,QAAQ,GAAG,CAAC;KAC9D,CAAA;IACH,CAAC;IAED,YAAY,CAAC,KAAK;QAChB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAA;IACzC,CAAC;IAED,IAAI,OAAO;QACT,OAAO;YACL,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;SAClC,CAAA;IACH,CAAC;;AApCM,kBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;KAWF;CACF,CAAA;AAED;IAAC,KAAK,EAAE;;8CAA8B;AAhB3B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAsCvB;SAtCY,WAAW","sourcesContent":["import { html, css } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { store, PageView } from '@operato/shell'\nimport { i18next, localize } from '@operato/i18n'\n\n@customElement('setting-page')\nexport class SettingPage extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n css`\n :host {\n overflow-y: auto;\n background-color: var(--setting-background);\n }\n div {\n margin: var(--setting-icon-margin);\n height: var(--setting-icon-height);\n background: url(/assets/images/icon-setting.png) center top no-repeat;\n background-size: contain;\n }\n `\n ]\n\n @state() private _settings: any[] = []\n\n render() {\n var _sortedSettings = this._settings.sort((a, b) => {\n return a.seq - b.seq\n })\n\n return html`\n <div class=\"page-icon\"></div>\n ${_sortedSettings.map(setting => html` ${setting.template} `)}\n `\n }\n\n stateChanged(state) {\n this._settings = state.setting.settings\n }\n\n get context() {\n return {\n title: i18next.t('title.setting')\n }\n }\n}\n"]}
1
+ {"version":3,"file":"setting.js","sourceRoot":"","sources":["../../client/pages/setting.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAmB,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AAEtD,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAChD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAG1C,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC;IAArE;;QAgBY,cAAS,GAAU,EAAE,CAAA;IAsBxC,CAAC;IApBC,MAAM;QACJ,IAAI,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACjD,OAAO,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,CAAA;QACtB,CAAC,CAAC,CAAA;QAEF,OAAO,IAAI,CAAA;;QAEP,eAAe,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAA,IAAI,OAAO,CAAC,QAAQ,GAAG,CAAC;KAC9D,CAAA;IACH,CAAC;IAED,YAAY,CAAC,KAAK;QAChB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAA;IACzC,CAAC;IAED,IAAI,OAAO;QACT,OAAO;YACL,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;SAClC,CAAA;IACH,CAAC;;AApCM,kBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;KAWF;CACF,CAAA;AAED;IAAC,KAAK,EAAE;;8CAA8B;AAhB3B,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAsCvB;SAtCY,WAAW","sourcesContent":["import { html, css } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { store, PageView } from '@operato/shell'\nimport { i18next, localize } from '@operato/i18n'\n\n@customElement('setting-page')\nexport class SettingPage extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n css`\n :host {\n overflow-y: auto;\n background-color: var(--md-sys-color-background);\n }\n div {\n margin: var(--setting-icon-margin);\n height: var(--setting-icon-height);\n background: url(/assets/images/icon-setting.png) center top no-repeat;\n background-size: contain;\n }\n `\n ]\n\n @state() private _settings: any[] = []\n\n render() {\n var _sortedSettings = this._settings.sort((a, b) => {\n return a.seq - b.seq\n })\n\n return html`\n <div class=\"page-icon\"></div>\n ${_sortedSettings.map(setting => html` ${setting.template} `)}\n `\n }\n\n stateChanged(state) {\n this._settings = state.setting.settings\n }\n\n get context() {\n return {\n title: i18next.t('title.setting')\n }\n }\n}\n"]}
package/dist-client/set-theme-mode.js CHANGED
@@ -1,4 +1,29 @@
1
+ import { clientSettingStore } from '@operato/shell';
2
+ var prefersColorSchemeMedia;
3
+ function getPrefersColorSchemeMedia() {
4
+ if (!prefersColorSchemeMedia) {
5
+ prefersColorSchemeMedia = window.matchMedia('(prefers-color-scheme: dark)');
6
+ }
7
+ return prefersColorSchemeMedia;
8
+ }
9
+ async function onPreferColorSchemeChanged() {
10
+ var _a;
11
+ const themeMode = (((_a = (await clientSettingStore.get('theme'))) === null || _a === void 0 ? void 0 : _a.value) || {}).mode || 'light';
12
+ if (themeMode !== 'auto') {
13
+ getPrefersColorSchemeMedia().removeEventListener('change', onPreferColorSchemeChanged);
14
+ return;
15
+ }
16
+ if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
17
+ document.body.classList.add('dark');
18
+ document.body.classList.remove('light');
19
+ }
20
+ else {
21
+ document.body.classList.add('light');
22
+ document.body.classList.remove('dark');
23
+ }
24
+ }
1
25
  export function setThemeMode(mode) {
26
+ getPrefersColorSchemeMedia().removeEventListener('change', onPreferColorSchemeChanged);
2
27
  if (mode === 'dark') {
3
28
  document.body.classList.add('dark');
4
29
  document.body.classList.remove('light');
@@ -8,14 +33,15 @@ export function setThemeMode(mode) {
8
33
  document.body.classList.remove('dark');
9
34
  }
10
35
  else {
11
- document.body.classList.remove('dark');
12
- document.body.classList.remove('light');
13
- if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
36
+ if (getPrefersColorSchemeMedia().matches) {
14
37
  document.body.classList.add('dark');
38
+ document.body.classList.remove('light');
15
39
  }
16
40
  else {
17
41
  document.body.classList.add('light');
42
+ document.body.classList.remove('dark');
18
43
  }
44
+ getPrefersColorSchemeMedia().addEventListener('change', onPreferColorSchemeChanged);
19
45
  }
20
46
  }
21
47
  //# sourceMappingURL=set-theme-mode.js.map
package/dist-client/set-theme-mode.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"set-theme-mode.js","sourceRoot":"","sources":["../client/set-theme-mode.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,YAAY,CAAC,IAAI;IAC/B,IAAI,IAAI,KAAK,MAAM,EAAE;QACnB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;QACnC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;KACxC;SAAM,IAAI,IAAI,KAAK,OAAO,EAAE;QAC3B,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;QACpC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;KACvC;SAAM;QACL,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;QACtC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;QAEvC,IAAI,MAAM,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO,EAAE;YAClF,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;SACpC;aAAM;YACL,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;SACrC;KACF;AACH,CAAC","sourcesContent":["export function setThemeMode(mode) {\n if (mode === 'dark') {\n document.body.classList.add('dark')\n document.body.classList.remove('light')\n } else if (mode === 'light') {\n document.body.classList.add('light')\n document.body.classList.remove('dark')\n } else {\n document.body.classList.remove('dark')\n document.body.classList.remove('light')\n\n if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n document.body.classList.add('dark')\n } else {\n document.body.classList.add('light')\n }\n }\n}\n"]}
1
+ {"version":3,"file":"set-theme-mode.js","sourceRoot":"","sources":["../client/set-theme-mode.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAEnD,IAAI,uBAAuB,CAAA;AAE3B,SAAS,0BAA0B;IACjC,IAAI,CAAC,uBAAuB,EAAE;QAC5B,uBAAuB,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAA;KAC5E;IACD,OAAO,uBAAuB,CAAA;AAChC,CAAC;AAED,KAAK,UAAU,0BAA0B;;IACvC,MAAM,SAAS,GAAG,CAAC,CAAA,MAAA,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,IAAI,IAAI,OAAO,CAAA;IAExF,IAAI,SAAS,KAAK,MAAM,EAAE;QACxB,0BAA0B,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,0BAA0B,CAAC,CAAA;QAEtF,OAAM;KACP;IAED,IAAI,MAAM,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO,EAAE;QAClF,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;QACnC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;KACxC;SAAM;QACL,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;QACpC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;KACvC;AACH,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,IAAI;IAC/B,0BAA0B,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,0BAA0B,CAAC,CAAA;IAEtF,IAAI,IAAI,KAAK,MAAM,EAAE;QACnB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;QACnC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;KACxC;SAAM,IAAI,IAAI,KAAK,OAAO,EAAE;QAC3B,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;QACpC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;KACvC;SAAM;QACL,IAAI,0BAA0B,EAAE,CAAC,OAAO,EAAE;YACxC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;YACnC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;SACxC;aAAM;YACL,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;YACpC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;SACvC;QAED,0BAA0B,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,0BAA0B,CAAC,CAAA;KACpF;AACH,CAAC","sourcesContent":["import { clientSettingStore } from '@operato/shell'\n\nvar prefersColorSchemeMedia\n\nfunction getPrefersColorSchemeMedia() {\n if (!prefersColorSchemeMedia) {\n prefersColorSchemeMedia = window.matchMedia('(prefers-color-scheme: dark)')\n }\n return prefersColorSchemeMedia\n}\n\nasync function onPreferColorSchemeChanged() {\n const themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'\n\n if (themeMode !== 'auto') {\n getPrefersColorSchemeMedia().removeEventListener('change', onPreferColorSchemeChanged)\n\n return\n }\n\n if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n document.body.classList.add('dark')\n document.body.classList.remove('light')\n } else {\n document.body.classList.add('light')\n document.body.classList.remove('dark')\n }\n}\n\nexport function setThemeMode(mode) {\n getPrefersColorSchemeMedia().removeEventListener('change', onPreferColorSchemeChanged)\n\n if (mode === 'dark') {\n document.body.classList.add('dark')\n document.body.classList.remove('light')\n } else if (mode === 'light') {\n document.body.classList.add('light')\n document.body.classList.remove('dark')\n } else {\n if (getPrefersColorSchemeMedia().matches) {\n document.body.classList.add('dark')\n document.body.classList.remove('light')\n } else {\n document.body.classList.add('light')\n document.body.classList.remove('dark')\n }\n\n getPrefersColorSchemeMedia().addEventListener('change', onPreferColorSchemeChanged)\n }\n}\n"]}
package/dist-client/setting-lets/secure-iplist-setting-let.js CHANGED
@@ -16,7 +16,9 @@ let SecureIPListSettingLet = class SecureIPListSettingLet extends LitElement {
16
16
  const { whitelist = [], blacklist = [], protectedlist = [], privileges = [] } = this.value || {};
17
17
  return html `
18
18
  <setting-let>
19
- <ox-title-with-help slot="title" topic="setting/secure-ip-list" msgid="title.secure-ip-list">secure IP list</ox-title-with-help>
19
+ <ox-title-with-help slot="title" topic="setting/secure-ip-list" msgid="title.secure-ip-list"
20
+ >secure IP list</ox-title-with-help
21
+ >
20
22
 
21
23
  <div slot="content" @change=${() => this.onSave()}>
22
24
  <md-filled-text-field
@@ -149,14 +151,14 @@ SecureIPListSettingLet.styles = [
149
151
 
150
152
  ul {
151
153
  flex: 1;
152
- background-color: var(--theme-white-color);
154
+ background-color: var(--md-sys-color-primary-container);
153
155
  overflow: auto;
154
156
  display: grid;
155
157
  grid-template-columns: 1fr 1fr;
156
158
  margin: 0;
157
159
  padding: var(--padding-default);
158
160
  list-style: none;
159
- border: 1px dashed rgba(0, 0, 0, 0.1);
161
+ border: 1px dashed var(--md-sys-color-outline);
160
162
  border-width: 1px 0;
161
163
  }
162
164
 
package/dist-client/setting-lets/secure-iplist-setting-let.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"secure-iplist-setting-let.js","sourceRoot":"","sources":["../../client/setting-lets/secure-iplist-setting-let.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/textfield/filled-text-field.js'\nimport '@things-factory/setting-base'\nimport '@operato/i18n/ox-i18n.js'\n\nimport gql from 'graphql-tag'\nimport { html, css, LitElement, PropertyValueMap } from 'lit'\nimport { customElement, property, query, queryAll, state } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { client } from '@operato/graphql'\n\n@customElement('secure-iplist-setting-let')\nexport class SecureIPListSettingLet extends LitElement {\n static styles = [\n css`\n div[slot='content'] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n }\n\n ul {\n flex: 1;\n background-color: var(--theme-white-color);\n overflow: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n margin: 0;\n padding: var(--padding-default);\n list-style: none;\n border: 1px dashed rgba(0, 0, 0, 0.1);\n border-width: 1px 0;\n }\n\n [hidden] {\n display: none;\n }\n\n @media screen and (max-width: 480px) {\n ul {\n grid-template-columns: 1fr;\n }\n }\n `\n ]\n\n @property({ type: Object }) value?: {\n blacklist?: string[]\n whitelist?: string[]\n protectedlist?: string[]\n privileges?: any[]\n }\n\n @state() private allPrivileges: {\n privilege: string\n category: string\n description: string\n }[] = []\n\n @query('[name=\"whitelist\"]') whitelist\n @query('[name=\"blacklist\"]') blacklist\n @query('[name=\"protectedlist\"]') protectedlist\n @queryAll('ul[privileges] input[type=checkbox]:checked') protectedPrivileges\n\n render() {\n const { whitelist = [], blacklist = [], protectedlist = [], privileges = [] } = this.value || {}\n\n return html`\n <setting-let>\n <ox-title-with-help slot=\"title\" topic=\"setting/secure-ip-list\" msgid=\"title.secure-ip-list\">secure IP list</ox-title-with-help>\n\n <div slot=\"content\" @change=${() => this.onSave()}>\n <md-filled-text-field\n type=\"text\"\n name=\"whitelist\"\n .label=${String(i18next.t('label.whitelist'))}\n icon=\"health_and_safety\"\n value=${whitelist.join(', ')}\n supporting-text=${String(i18next.t('text.supporting text for whitelist'))}\n hidden\n >\n <md-icon slot=\"leading-icon\">health_and_safety</md-icon>\n </md-filled-text-field>\n\n <md-filled-text-field\n type=\"text\"\n name=\"blacklist\"\n .label=${String(i18next.t('label.blacklist'))}\n value=${blacklist.join(', ')}\n supporting-text=${String(i18next.t('text.supporting text for blacklist'))}\n >\n <md-icon slot=\"leading-icon\">block</md-icon>\n </md-filled-text-field>\n\n <md-filled-text-field\n type=\"text\"\n name=\"protectedlist\"\n .label=${String(i18next.t('label.protectedlist'))}\n value=${protectedlist.join(', ')}\n supporting-text=${String(i18next.t('text.supporting text for protected ip-list'))}\n >\n <md-icon slot=\"leading-icon\">security</md-icon>\n </md-filled-text-field>\n\n <div>\n <h3><ox-i18n msgid=\"title.protected-privileges\"></ox-i18n></h3>\n <div>\n <input id=\"checkAll\" type=\"checkbox\" @change=${e => this.oncheckAll(e)} />\n <label for=\"checkAll\">Check all</label>\n </div>\n\n <ul privileges>\n ${this.allPrivileges.map(privilege => {\n const id = `${privilege.category}-${privilege.privilege}`\n return html`\n <li>\n <input\n type=\"checkbox\"\n id=${id}\n .checked=${!!privileges.find(p => p.privilege == privilege.privilege && p.category == privilege.category)}\n .data-privilege=${privilege}\n />\n <label for=\"${id}\">${privilege.description}</label>\n </li>\n `\n })}\n </ul>\n </div>\n </div>\n </setting-let>\n `\n }\n\n async firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): Promise<void> {\n var { data } = await client.query({\n query: gql`\n query {\n privileges {\n items {\n privilege\n category\n description\n }\n total\n }\n }\n `\n })\n\n this.allPrivileges = data?.privileges.items || []\n\n var { data } = await client.query({\n query: gql`\n query {\n secureIPList\n }\n `\n })\n\n this.value = data ? data.secureIPList : {}\n }\n\n checkAll(checked) {\n Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(checkbox => ((checkbox as HTMLInputElement).checked = checked))\n }\n\n oncheckAll(e) {\n this.checkAll(e.target.checked)\n }\n\n async onSave() {\n const whitelist = !this.whitelist.value ? [] : this.whitelist.value.split(',').map(ip => ip.trim())\n const blacklist = !this.blacklist.value ? [] : this.blacklist.value.split(',').map(ip => ip.trim())\n const protectedlist = !this.protectedlist.value ? [] : this.protectedlist.value.split(',').map(ip => ip.trim())\n const privileges = Array.from(this.protectedPrivileges)\n .map((e: any) => e['data-privilege'])\n .map((priv: any) => {\n const { description, ...others } = priv\n return others\n })\n\n const iplist = {\n whitelist,\n blacklist,\n protectedlist,\n privileges\n }\n\n const { data } = await client.query({\n query: gql`\n mutation ($iplist: Object!) {\n updateSecureIPList(iplist: $iplist)\n }\n `,\n variables: {\n iplist\n }\n })\n\n this.value = data ? data.updateSecureIPList : {}\n }\n}\n"]}
1
+ {"version":3,"file":"secure-iplist-setting-let.js","sourceRoot":"","sources":["../../client/setting-lets/secure-iplist-setting-let.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/textfield/filled-text-field.js'\nimport '@things-factory/setting-base'\nimport '@operato/i18n/ox-i18n.js'\n\nimport gql from 'graphql-tag'\nimport { html, css, LitElement, PropertyValueMap } from 'lit'\nimport { customElement, property, query, queryAll, state } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { client } from '@operato/graphql'\n\n@customElement('secure-iplist-setting-let')\nexport class SecureIPListSettingLet extends LitElement {\n static styles = [\n css`\n div[slot='content'] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n }\n\n ul {\n flex: 1;\n background-color: var(--md-sys-color-primary-container);\n overflow: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n margin: 0;\n padding: var(--padding-default);\n list-style: none;\n border: 1px dashed var(--md-sys-color-outline);\n border-width: 1px 0;\n }\n\n [hidden] {\n display: none;\n }\n\n @media screen and (max-width: 480px) {\n ul {\n grid-template-columns: 1fr;\n }\n }\n `\n ]\n\n @property({ type: Object }) value?: {\n blacklist?: string[]\n whitelist?: string[]\n protectedlist?: string[]\n privileges?: any[]\n }\n\n @state() private allPrivileges: {\n privilege: string\n category: string\n description: string\n }[] = []\n\n @query('[name=\"whitelist\"]') whitelist\n @query('[name=\"blacklist\"]') blacklist\n @query('[name=\"protectedlist\"]') protectedlist\n @queryAll('ul[privileges] input[type=checkbox]:checked') protectedPrivileges\n\n render() {\n const { whitelist = [], blacklist = [], protectedlist = [], privileges = [] } = this.value || {}\n\n return html`\n <setting-let>\n <ox-title-with-help slot=\"title\" topic=\"setting/secure-ip-list\" msgid=\"title.secure-ip-list\"\n >secure IP list</ox-title-with-help\n >\n\n <div slot=\"content\" @change=${() => this.onSave()}>\n <md-filled-text-field\n type=\"text\"\n name=\"whitelist\"\n .label=${String(i18next.t('label.whitelist'))}\n icon=\"health_and_safety\"\n value=${whitelist.join(', ')}\n supporting-text=${String(i18next.t('text.supporting text for whitelist'))}\n hidden\n >\n <md-icon slot=\"leading-icon\">health_and_safety</md-icon>\n </md-filled-text-field>\n\n <md-filled-text-field\n type=\"text\"\n name=\"blacklist\"\n .label=${String(i18next.t('label.blacklist'))}\n value=${blacklist.join(', ')}\n supporting-text=${String(i18next.t('text.supporting text for blacklist'))}\n >\n <md-icon slot=\"leading-icon\">block</md-icon>\n </md-filled-text-field>\n\n <md-filled-text-field\n type=\"text\"\n name=\"protectedlist\"\n .label=${String(i18next.t('label.protectedlist'))}\n value=${protectedlist.join(', ')}\n supporting-text=${String(i18next.t('text.supporting text for protected ip-list'))}\n >\n <md-icon slot=\"leading-icon\">security</md-icon>\n </md-filled-text-field>\n\n <div>\n <h3><ox-i18n msgid=\"title.protected-privileges\"></ox-i18n></h3>\n <div>\n <input id=\"checkAll\" type=\"checkbox\" @change=${e => this.oncheckAll(e)} />\n <label for=\"checkAll\">Check all</label>\n </div>\n\n <ul privileges>\n ${this.allPrivileges.map(privilege => {\n const id = `${privilege.category}-${privilege.privilege}`\n return html`\n <li>\n <input\n type=\"checkbox\"\n id=${id}\n .checked=${!!privileges.find(\n p => p.privilege == privilege.privilege && p.category == privilege.category\n )}\n .data-privilege=${privilege}\n />\n <label for=\"${id}\">${privilege.description}</label>\n </li>\n `\n })}\n </ul>\n </div>\n </div>\n </setting-let>\n `\n }\n\n async firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): Promise<void> {\n var { data } = await client.query({\n query: gql`\n query {\n privileges {\n items {\n privilege\n category\n description\n }\n total\n }\n }\n `\n })\n\n this.allPrivileges = data?.privileges.items || []\n\n var { data } = await client.query({\n query: gql`\n query {\n secureIPList\n }\n `\n })\n\n this.value = data ? data.secureIPList : {}\n }\n\n checkAll(checked) {\n Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(\n checkbox => ((checkbox as HTMLInputElement).checked = checked)\n )\n }\n\n oncheckAll(e) {\n this.checkAll(e.target.checked)\n }\n\n async onSave() {\n const whitelist = !this.whitelist.value ? [] : this.whitelist.value.split(',').map(ip => ip.trim())\n const blacklist = !this.blacklist.value ? [] : this.blacklist.value.split(',').map(ip => ip.trim())\n const protectedlist = !this.protectedlist.value ? [] : this.protectedlist.value.split(',').map(ip => ip.trim())\n const privileges = Array.from(this.protectedPrivileges)\n .map((e: any) => e['data-privilege'])\n .map((priv: any) => {\n const { description, ...others } = priv\n return others\n })\n\n const iplist = {\n whitelist,\n blacklist,\n protectedlist,\n privileges\n }\n\n const { data } = await client.query({\n query: gql`\n mutation ($iplist: Object!) {\n updateSecureIPList(iplist: $iplist)\n }\n `,\n variables: {\n iplist\n }\n })\n\n this.value = data ? data.updateSecureIPList : {}\n }\n}\n"]}
package/dist-client/setting-lets/theme-mode-setting-let.js CHANGED
@@ -63,7 +63,7 @@ ThemeModeSettingLet.styles = [
63
63
  align-items: center;
64
64
 
65
65
  font: var(--label-font);
66
- color: var(--label-color);
66
+ color: var(--md-sys-color-on-primary-container);
67
67
  text-transform: var(--label-text-transform);
68
68
  }
69
69
 
package/dist-client/setting-lets/theme-mode-setting-let.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme-mode-setting-let.js","sourceRoot":"","sources":["../../client/setting-lets/theme-mode-setting-let.ts"],"names":[],"mappings":";AAAA,OAAO,0BAA0B,CAAA;AACjC,OAAO,8BAA8B,CAAA;AAErC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAG5C,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAA/D;;QAoBgD,cAAS,GAA8B,OAAO,CAAA;IA+CrG,CAAC;IA7CC,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAEhC,OAAO,IAAI,CAAA;;;;sCAIuB,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC;6EACA,SAAS,IAAI,MAAM;;;+EAGjB,SAAS,IAAI,OAAO;;;6EAGtB,SAAS,IAAI,MAAM;;;;KAI3F,CAAA;IACH,CAAC;IAED,KAAK,CAAC,YAAY;;QAChB,IAAI,CAAC,SAAS,GAAG,CAAC,CAAA,MAAA,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,IAAI,IAAI,OAAO,CAAA;IACzF,CAAC;IAED,KAAK,CAAC,iBAAiB,CAAC,CAAQ;;QAC9B,MAAM,MAAM,GAAG,CAAC,CAAC,MAAiB,CAAA;QAClC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA;QAC1B,MAAM,IAAI,GAAG,CAAA,MAAC,IAAI,CAAC,aAAa,CAAC,mBAAmB,CAAa,0CAAE,KAAK,KAAI,KAAK,CAAA;QAEjF,IAAI,IAAI,EAAE;YACR,IAAI;gBACF,MAAM,kBAAkB,CAAC,GAAG,CAAC;oBAC3B,GAAG,EAAE,OAAO;oBACZ,KAAK,EAAE;wBACL,IAAI;qBACL;iBACF,CAAC,CAAA;gBAEF,YAAY,CAAC,IAAI,CAAC,CAAA;aACnB;YAAC,OAAO,CAAC,EAAE;gBACV,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;aACjB;SACF;IACH,CAAC;;AAjEM,0BAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;KAeF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;;sDAA+C;AApBxF,mBAAmB;IAD/B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,mBAAmB,CAmE/B;SAnEY,mBAAmB","sourcesContent":["import '@operato/i18n/ox-i18n.js'\nimport '@material/web/radio/radio.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { clientSettingStore } from '@operato/shell'\nimport { MdRadio } from '@material/web/radio/radio.js'\nimport { setThemeMode } from '../set-theme-mode.js'\n\n@customElement('theme-mode-setting-let')\nexport class ThemeModeSettingLet extends localize(i18next)(LitElement) {\n static styles = [\n css`\n label {\n display: flex;\n gap: 10px;\n align-items: center;\n\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n\n div[slot='content'] {\n display: flex;\n gap: 10px;\n }\n `\n ]\n\n @property({ type: String, attribute: 'theme-mode' }) themeMode: 'dark' | 'light' | 'auto' = 'light'\n\n render() {\n const themeMode = this.themeMode\n\n return html`\n <setting-let>\n <ox-i18n slot=\"title\" msgid=\"title.theme setting\"></ox-i18n>\n\n <div slot=\"content\" @change=${(e: Event) => this.onChangeThemeMode(e)}>\n <md-radio id=\"dark-mode\" name=\"theme-mode\" value=\"dark\" ?checked=${themeMode == 'dark'}></md-radio>\n <label for=\"dark-mode\">dark mode</label>\n\n <md-radio id=\"light-mode\" name=\"theme-mode\" value=\"light\" ?checked=${themeMode == 'light'}></md-radio>\n <label for=\"light-mode\">light mode</label>\n\n <md-radio id=\"auto-mode\" name=\"theme-mode\" value=\"auto\" ?checked=${themeMode == 'auto'}></md-radio>\n <label for=\"auto-mode\">auto mode</label>\n </div>\n </setting-let>\n `\n }\n\n async firstUpdated() {\n this.themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'\n }\n\n async onChangeThemeMode(e: Event) {\n const target = e.target as MdRadio\n const value = target.value\n const mode = (this.querySelector('md-radio[checked]') as MdRadio)?.value || value\n\n if (mode) {\n try {\n await clientSettingStore.put({\n key: 'theme',\n value: {\n mode\n }\n })\n\n setThemeMode(mode)\n } catch (e) {\n console.error(e)\n }\n }\n }\n}\n"]}
1
+ {"version":3,"file":"theme-mode-setting-let.js","sourceRoot":"","sources":["../../client/setting-lets/theme-mode-setting-let.ts"],"names":[],"mappings":";AAAA,OAAO,0BAA0B,CAAA;AACjC,OAAO,8BAA8B,CAAA;AAErC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAG5C,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAA/D;;QAoBgD,cAAS,GAA8B,OAAO,CAAA;IA+CrG,CAAC;IA7CC,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAEhC,OAAO,IAAI,CAAA;;;;sCAIuB,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC;6EACA,SAAS,IAAI,MAAM;;;+EAGjB,SAAS,IAAI,OAAO;;;6EAGtB,SAAS,IAAI,MAAM;;;;KAI3F,CAAA;IACH,CAAC;IAED,KAAK,CAAC,YAAY;;QAChB,IAAI,CAAC,SAAS,GAAG,CAAC,CAAA,MAAA,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,0CAAE,KAAK,KAAI,EAAE,CAAC,CAAC,IAAI,IAAI,OAAO,CAAA;IACzF,CAAC;IAED,KAAK,CAAC,iBAAiB,CAAC,CAAQ;;QAC9B,MAAM,MAAM,GAAG,CAAC,CAAC,MAAiB,CAAA;QAClC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA;QAC1B,MAAM,IAAI,GAAG,CAAA,MAAC,IAAI,CAAC,aAAa,CAAC,mBAAmB,CAAa,0CAAE,KAAK,KAAI,KAAK,CAAA;QAEjF,IAAI,IAAI,EAAE;YACR,IAAI;gBACF,MAAM,kBAAkB,CAAC,GAAG,CAAC;oBAC3B,GAAG,EAAE,OAAO;oBACZ,KAAK,EAAE;wBACL,IAAI;qBACL;iBACF,CAAC,CAAA;gBAEF,YAAY,CAAC,IAAI,CAAC,CAAA;aACnB;YAAC,OAAO,CAAC,EAAE;gBACV,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;aACjB;SACF;IACH,CAAC;;AAjEM,0BAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;KAeF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;;sDAA+C;AApBxF,mBAAmB;IAD/B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,mBAAmB,CAmE/B;SAnEY,mBAAmB","sourcesContent":["import '@operato/i18n/ox-i18n.js'\nimport '@material/web/radio/radio.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { clientSettingStore } from '@operato/shell'\nimport { MdRadio } from '@material/web/radio/radio.js'\nimport { setThemeMode } from '../set-theme-mode.js'\n\n@customElement('theme-mode-setting-let')\nexport class ThemeModeSettingLet extends localize(i18next)(LitElement) {\n static styles = [\n css`\n label {\n display: flex;\n gap: 10px;\n align-items: center;\n\n font: var(--label-font);\n color: var(--md-sys-color-on-primary-container);\n text-transform: var(--label-text-transform);\n }\n\n div[slot='content'] {\n display: flex;\n gap: 10px;\n }\n `\n ]\n\n @property({ type: String, attribute: 'theme-mode' }) themeMode: 'dark' | 'light' | 'auto' = 'light'\n\n render() {\n const themeMode = this.themeMode\n\n return html`\n <setting-let>\n <ox-i18n slot=\"title\" msgid=\"title.theme setting\"></ox-i18n>\n\n <div slot=\"content\" @change=${(e: Event) => this.onChangeThemeMode(e)}>\n <md-radio id=\"dark-mode\" name=\"theme-mode\" value=\"dark\" ?checked=${themeMode == 'dark'}></md-radio>\n <label for=\"dark-mode\">dark mode</label>\n\n <md-radio id=\"light-mode\" name=\"theme-mode\" value=\"light\" ?checked=${themeMode == 'light'}></md-radio>\n <label for=\"light-mode\">light mode</label>\n\n <md-radio id=\"auto-mode\" name=\"theme-mode\" value=\"auto\" ?checked=${themeMode == 'auto'}></md-radio>\n <label for=\"auto-mode\">auto mode</label>\n </div>\n </setting-let>\n `\n }\n\n async firstUpdated() {\n this.themeMode = ((await clientSettingStore.get('theme'))?.value || {}).mode || 'light'\n }\n\n async onChangeThemeMode(e: Event) {\n const target = e.target as MdRadio\n const value = target.value\n const mode = (this.querySelector('md-radio[checked]') as MdRadio)?.value || value\n\n if (mode) {\n try {\n await clientSettingStore.put({\n key: 'theme',\n value: {\n mode\n }\n })\n\n setThemeMode(mode)\n } catch (e) {\n console.error(e)\n }\n }\n }\n}\n"]}