@things-factory/setting-ui 10.1.232 → 10.1.241
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist-client/setting-lets/secure-iplist-setting-let.js +1 -1
- package/dist-client/setting-lets/secure-iplist-setting-let.js.map +1 -1
- package/dist-client/setting-lets/theme-mode-setting-let.js +3 -3
- package/dist-client/setting-lets/theme-mode-setting-let.js.map +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/package.json +6 -6
- package/translations/en.json +5 -1
- package/translations/es.json +5 -1
- package/translations/ja.json +5 -1
- package/translations/ko.json +5 -1
- package/translations/ms.json +5 -1
- package/translations/zh.json +5 -1
|
@@ -89,7 +89,7 @@ let SecureIPListSettingLet = class SecureIPListSettingLet extends LitElement {
|
|
|
89
89
|
<h3><ox-i18n msgid="title.protected-privileges"></ox-i18n></h3>
|
|
90
90
|
<div>
|
|
91
91
|
<input id="checkAll" type="checkbox" @change=${e => this.oncheckAll(e)} />
|
|
92
|
-
<label for="checkAll"
|
|
92
|
+
<label for="checkAll"><ox-i18n msgid="label.check-all"></ox-i18n></label>
|
|
93
93
|
</div>
|
|
94
94
|
|
|
95
95
|
<ul privileges>
|
|
@@ -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(--md-sys-color-surface);\n overflow: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n margin: 0;\n padding: var(--spacing-medium);\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"]}
|
|
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-surface);\n overflow: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n margin: 0;\n padding: var(--spacing-medium);\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\"><ox-i18n msgid=\"label.check-all\"></ox-i18n></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"]}
|
|
@@ -37,13 +37,13 @@ let ThemeModeSettingLet = class ThemeModeSettingLet extends localize(i18next)(Li
|
|
|
37
37
|
|
|
38
38
|
<div slot="content" @change=${(e) => this.onChangeThemeMode(e)}>
|
|
39
39
|
<md-radio id="dark-mode" name="theme-mode" value="dark" ?checked=${themeMode == 'dark'}></md-radio>
|
|
40
|
-
<label for="dark-mode"
|
|
40
|
+
<label for="dark-mode"><ox-i18n msgid="label.theme-mode-dark"></ox-i18n></label>
|
|
41
41
|
|
|
42
42
|
<md-radio id="light-mode" name="theme-mode" value="light" ?checked=${themeMode == 'light'}></md-radio>
|
|
43
|
-
<label for="light-mode"
|
|
43
|
+
<label for="light-mode"><ox-i18n msgid="label.theme-mode-light"></ox-i18n></label>
|
|
44
44
|
|
|
45
45
|
<md-radio id="auto-mode" name="theme-mode" value="auto" ?checked=${themeMode == 'auto'}></md-radio>
|
|
46
|
-
<label for="auto-mode"
|
|
46
|
+
<label for="auto-mode"><ox-i18n msgid="label.theme-mode-auto"></ox-i18n></label>
|
|
47
47
|
</div>
|
|
48
48
|
</setting-let>
|
|
49
49
|
`;
|
|
@@ -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;aAlEQ,WAAM,GAAG;QACd,GAAG,CAAA;;;;;;;;;;;;;;;KAeF;KACF,AAjBY,CAiBZ;IAID,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,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,IAAI,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,GAAI,IAAI,CAAC,aAAa,CAAC,mBAAmB,CAAa,EAAE,KAAK,IAAI,KAAK,CAAA;QAEjF,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,CAAC;gBACH,MAAM,kBAAkB,CAAC,GAAG,CAAC;oBAC3B,GAAG,EAAE,OAAO;oBACZ,KAAK,EAAE;wBACL,IAAI;qBACL;iBACF,CAAC,CAAA;gBAEF,YAAY,CAAC,IAAI,CAAC,CAAA;YACpB,CAAC;YAAC,OAAO,CAAC,EAAE,CAAC;gBACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;YAClB,CAAC;QACH,CAAC;IACH,CAAC;;AA9CoD;IAApD,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","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-surface);\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\"
|
|
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;aAlEQ,WAAM,GAAG;QACd,GAAG,CAAA;;;;;;;;;;;;;;;KAeF;KACF,AAjBY,CAiBZ;IAID,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,CAAC,MAAM,kBAAkB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,IAAI,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,GAAI,IAAI,CAAC,aAAa,CAAC,mBAAmB,CAAa,EAAE,KAAK,IAAI,KAAK,CAAA;QAEjF,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,CAAC;gBACH,MAAM,kBAAkB,CAAC,GAAG,CAAC;oBAC3B,GAAG,EAAE,OAAO;oBACZ,KAAK,EAAE;wBACL,IAAI;qBACL;iBACF,CAAC,CAAA;gBAEF,YAAY,CAAC,IAAI,CAAC,CAAA;YACpB,CAAC;YAAC,OAAO,CAAC,EAAE,CAAC;gBACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;YAClB,CAAC;QACH,CAAC;IACH,CAAC;;AA9CoD;IAApD,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","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-surface);\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\"><ox-i18n msgid=\"label.theme-mode-dark\"></ox-i18n></label>\n\n <md-radio id=\"light-mode\" name=\"theme-mode\" value=\"light\" ?checked=${themeMode == 'light'}></md-radio>\n <label for=\"light-mode\"><ox-i18n msgid=\"label.theme-mode-light\"></ox-i18n></label>\n\n <md-radio id=\"auto-mode\" name=\"theme-mode\" value=\"auto\" ?checked=${themeMode == 'auto'}></md-radio>\n <label for=\"auto-mode\"><ox-i18n msgid=\"label.theme-mode-auto\"></ox-i18n></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"]}
|