npm - @things-factory/operato-mms - Versions diffs - 7.0.0-alpha.9 → 7.0.0 - Mend

@things-factory/operato-mms 7.0.0-alpha.9 → 7.0.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 (122) hide show

package/_index.html CHANGED Viewed

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
@@ -52,6 +52,10 @@
     <!-- Performance tip: hint to the browser to start the handshake for the fonts site -->
     <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin />
     <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
+    <link href="/node_modules/material-symbols/index.css" rel="stylesheet" />
+    <link href="/node_modules/@fontsource/roboto/index.css" rel="stylesheet" />
+    <link rel="stylesheet" href="/theme.css" />
     <style>
       body {
         margin: 0;
@@ -65,7 +69,8 @@
         line-height: 1.5;
         -webkit-font-smoothing: antialiased;
-        accent-color: var(--primary-color);
+        accent-color: var(--md-sys-color-primary);
+        background-color: var(--md-sys-color-background);
       }
     </style>
@@ -89,7 +94,7 @@
       }
     </script>
   </head>
-  <body>
+  <body class="light">
     <things-app></things-app>
     <noscript> Please enable JavaScript to view this website. </noscript>
     <!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->

package/client/actions/mms.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import gql from 'graphql-tag'
-import { client } from '@things-factory/shell'
+import { client } from '@operato/graphql'
 export const REFRESH_MMS = 'REFRESH_MMS'

package/client/bootstrap.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import '@operato/i18n/ox-i18n.js'
-import '@things-factory/auth-ui' /* for domain-switch */
+import '@things-factory/auth-ui/dist-client' /* for domain-switch */
+import '@things-factory/setting-ui/dist-client' /* theme-mode-setting-let */
 import '@things-factory/notification'
 import './menu'
 import './viewparts/user-circle'
@@ -7,17 +8,17 @@ import './viewparts/user-circle'
 import { html } from 'lit'
 import { registerDefaultGroups } from '@operato/board/register-default-groups.js'
-import { APPEND_APP_TOOL } from '@things-factory/apptool-base'
-import { setupAppToolPart } from '@things-factory/apptool-ui'
+import { APPEND_APP_TOOL } from '@things-factory/apptool-base/client'
+import { setupAppToolPart } from '@things-factory/apptool-ui/dist-client'
 import { auth, hasPrivilege } from '@things-factory/auth-base/dist-client'
-import { setAuthManagementMenus } from '@things-factory/auth-ui'
+import { setAuthManagementMenus } from '@things-factory/auth-ui/dist-client'
 import { appendViewpart, toggleOverlay, TOOL_POSITION, VIEWPART_POSITION } from '@operato/layout'
 import { setupMenuPart } from '@things-factory/lite-menu'
-import { setupContextUIPart } from '@things-factory/context-ui'
-import { ADD_MORENDA } from '@things-factory/more-base'
-import { ADD_SETTING } from '@things-factory/setting-base'
-import { navigate, store } from '@things-factory/shell'
-import { isMobileDevice } from '@things-factory/utils'
+import { setupContextUIPart } from '@things-factory/context-ui/dist-client'
+import { ADD_MORENDA } from '@things-factory/more-base/client'
+import { ADD_SETTING } from '@things-factory/setting-base/dist-client'
+import { navigate, store } from '@operato/shell'
+import { isMobileDevice } from '@operato/utils'
 import { fetchMmsStatus } from './actions/mms'
 import mms from './reducers/mms'
@@ -51,7 +52,7 @@ export default async function bootstrap() {
   })
   await setupMenuPart({
-    slotTemplate: html` <domain-switch slot="head"></domain-switch> `
+    slotTemplate: html` <domain-switch attrname="description" slot="head"></domain-switch> `
   })
   store.addReducers({ mms })
@@ -60,7 +61,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>settings</mwc-icon> `,
+      icon: html` <md-icon>settings</md-icon> `,
       name: html` <ox-i18n msgid="label.setting"></ox-i18n> `,
       action: () => {
         navigate('setting')
@@ -75,7 +76,7 @@ export default async function bootstrap() {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html` <mwc-icon>view_list</mwc-icon> `,
+        icon: html` <md-icon>view_list</md-icon> `,
         name: html` <ox-i18n msgid="text.addon-menu management"></ox-i18n> `,
         action: () => {
           navigate('addon-menu-setting')
@@ -104,7 +105,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>help</mwc-icon> `,
+      icon: html` <md-icon>help</md-icon> `,
       name: html` <ox-i18n msgid="text.help"></ox-i18n> `,
       action: () => {
         navigate('help')
@@ -143,7 +144,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>device_hub</mwc-icon> `,
+      icon: html` <md-icon>device_hub</md-icon> `,
       name: html` <ox-i18n msgid="text.connection"></ox-i18n> `,
       action: () => {
         navigate('connection')
@@ -154,7 +155,7 @@ export default async function bootstrap() {
   store.dispatch({
     type: ADD_MORENDA,
     morenda: {
-      icon: html` <mwc-icon>format_list_numbered</mwc-icon> `,
+      icon: html` <md-icon>format_list_numbered</md-icon> `,
       name: html` <ox-i18n msgid="text.scenario"></ox-i18n> `,
       action: () => {
         navigate('scenario')
@@ -162,6 +163,14 @@ export default async function bootstrap() {
     }
   })
+  store.dispatch({
+    type: ADD_SETTING,
+    setting: {
+      seq: 10,
+      template: html` <theme-mode-setting-let></theme-mode-setting-let> `
+    }
+  })
   store.dispatch({
     type: ADD_SETTING,
     setting: {

package/client/components/attachment-viewer.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { css, html, LitElement } from 'lit'
 class AttachmentViewer extends localize(i18next)(LitElement) {
@@ -19,7 +19,7 @@ class AttachmentViewer extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-x: overlay;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
         }
         .container {
           display: flex;

package/client/components/category-selector-popup.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { css, html, LitElement } from 'lit'
-import { i18next, localize } from '@things-factory/i18n-base'
-import { ScrollbarStyles } from '@things-factory/styles'
+import { i18next, localize } from '@operato/i18n'
+import { ScrollbarStyles } from '@operato/styles'
 export class CategorySelectorPopup extends localize(i18next)(LitElement) {
   static get properties() {
@@ -20,7 +20,7 @@ export class CategorySelectorPopup extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
-          background-color: #fff;
+          background-color: var(--md-sys-color-surface);
         }
         .button-container {
@@ -42,11 +42,11 @@ export class CategorySelectorPopup extends localize(i18next)(LitElement) {
         }
         [path] {
-          padding: var(--padding-wide, 15px);
-          color: var(--secondary-color);
+          padding: var(--spacing-large, 15px);
+          color: var(--md-sys-color-secondary);
         }
         [path] strong {
-          color: var(--primary-color);
+          color: var(--md-sys-color-primary);
         }
         [categories] {
@@ -59,9 +59,9 @@ export class CategorySelectorPopup extends localize(i18next)(LitElement) {
           overflow-x: auto;
-          background-color: var(--main-section-background-color);
-          padding: var(--padding-wide, 15px);
-          border: var(--border-dark-color);
+          background-color: var(--md-sys-color-background);
+          padding: var(--spacing-large, 15px);
+          border: var(--border-dim-color);
           border-width: 2px 0 1px 0;
         }
@@ -72,13 +72,13 @@ export class CategorySelectorPopup extends localize(i18next)(LitElement) {
           margin-right: -1px;
           border-radius: var(--border-radius);
-          border: var(--border-dark-color);
-          padding: var(--padding-narrow, 4px);
-          background-color: #fff;
+          border: var(--border-dim-color);
+          padding: var(--spacing-small, 4px);
+          background-color: var(--md-sys-color-surface);
         }
         [category-level] > div {
-          padding: var(--padding-narrow, 4px) var(--padding-default, 9px);
-          color: var(--secondary-color);
+          padding: var(--spacing-small, 4px) var(--spacing-medium, 9px);
+          color: var(--md-sys-color-secondary);
           font-size: 0.9rem;
         }
@@ -89,7 +89,7 @@ export class CategorySelectorPopup extends localize(i18next)(LitElement) {
         [category-level] > div[selected] {
           background: rgba(0, 0, 0, 0.09);
-          color: var(--primary-color);
+          color: var(--md-sys-color-primary);
           font-weight: bold;
         }
         div[search] {
@@ -99,12 +99,12 @@ export class CategorySelectorPopup extends localize(i18next)(LitElement) {
           --mdc-icon-size: 20px;
           flex: 20px;
-          border-bottom: var(--border-dark-color);
+          border-bottom: var(--border-dim-color);
         }
         div[search] input {
           flex: 1;
           border: none;
-          border-bottom: var(--border-dark-color);
+          border-bottom: var(--border-dim-color);
           max-width: 90%;
           font-size: 1rem;
         }
@@ -124,12 +124,11 @@ export class CategorySelectorPopup extends localize(i18next)(LitElement) {
         <div search><mwc-icon>search</mwc-icon> <input type="text" /></div>
         ${categories.map(
-          category =>
-            html`
-              <div @click=${e => this.onclickCategory(category)} ?selected=${selected === category.id}>
-                ${category.name} <span>${category.hasSubcategories ? '>' : ''}</span>
-              </div>
-            `
+          category => html`
+            <div @click=${e => this.onclickCategory(category)} ?selected=${selected === category.id}>
+              ${category.name} <span>${category.hasSubcategories ? '>' : ''}</span>
+            </div>
+          `
         )}
       </div>

package/client/components/image-viewer.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { css, html, LitElement } from 'lit'
 class ImageViewer extends localize(i18next)(LitElement) {
@@ -19,7 +19,7 @@ class ImageViewer extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-x: overlay;
-          background-color: var(--main-section-background-color);
+          background-color: var(--md-sys-color-background);
         }
         .container {
           display: flex;

package/client/components/marketplace-order-max-weight.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { client, CustomAlert } from '@things-factory/shell'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
@@ -7,9 +7,9 @@ class MarketplaceOrderMaxWeight extends localize(i18next)(LitElement) {
   static get styles() {
     return css`
       [field-2column] {
-        background-color: var(--theme-white-color);
-        margin: var(--margin-wide) 0;
-        padding: var(--padding-wide);
+        background-color: var(--md-sys-color-surface-variant);
+        margin: var(--spacing-large) 0;
+        padding: var(--spacing-large);
         border-radius: var(--border-radius);
         box-shadow: var(--box-shadow);
         max-width: var(--input-container-max-width);
@@ -20,14 +20,14 @@ class MarketplaceOrderMaxWeight extends localize(i18next)(LitElement) {
       [field] {
         display: flex;
         flex-direction: column;
-        padding-bottom: var(--padding-default);
+        padding-bottom: var(--spacing-medium);
       }
       [grid-span] {
         grid-column: span 2;
       }
       input {
-        border: var(--border-dark-color);
+        border: var(--border-dim-color);
         border-radius: var(--border-radius);
         margin: var(--input-margin);
         padding: var(--input-padding);
@@ -39,7 +39,7 @@ class MarketplaceOrderMaxWeight extends localize(i18next)(LitElement) {
         flex-direction: column;
         font: var(--label-font);
-        color: var(--label-color);
+        color: var(--label-color, var(--md-sys-color-on-surface));
         text-transform: var(--label-text-transform);
       }
       mwc-button {

package/client/components/mms-home-cards.js CHANGED Viewed

@@ -10,7 +10,7 @@ class MmsHomeCards extends LitElement {
         }
         ul {
-          margin: 0 0 var(--margin-wide) 0;
+          margin: 0 0 var(--spacing-large) 0;
           padding: 0;
           overflow: hidden;
           list-style: none;
@@ -19,17 +19,17 @@ class MmsHomeCards extends LitElement {
         li {
           display: block;
           float: left;
-          background-color: var(--theme-white-color);
+          background-color: var(--md-sys-color-surface-variant);
           border-radius: var(--border-radius);
-          border: 1px solid var(--theme-white-color);
+          border: 1px solid var(--md-sys-color-on-primary);
           box-shadow: var(--box-shadow);
-          margin: var(--margin-narrow) var(--margin-default) var(--margin-default) 0;
-          padding: var(--padding-default) var(--padding-default) var(--padding-narrow) var(--padding-default);
+          margin: var(--spacing-small) var(--spacing-medium) var(--spacing-medium) 0;
+          padding: var(--spacing-medium) var(--spacing-medium) var(--spacing-small) var(--spacing-medium);
           text-align: center;
         }
         li:hover {
-          border: 1px solid var(--primary-color);
+          border: 1px solid var(--md-sys-color-primary);
         }
         * {
@@ -41,11 +41,11 @@ class MmsHomeCards extends LitElement {
           cursor: pointer;
           text-decoration: none;
           font-size: var(--fontsize-small);
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         mwc-icon {
-          color: var(--primary-color);
+          color: var(--md-sys-color-primary);
         }
         strong {
@@ -58,11 +58,11 @@ class MmsHomeCards extends LitElement {
           max-width: 100%;
           min-height: 20px;
           opacity: 0.8;
-          border-top: var(--border-dark-color);
-          margin-top: var(--margin-narrow);
+          border-top: var(--border-dim-color);
+          margin-top: var(--spacing-small);
           font-size: var(--fontsize-small);
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
         }
         a,
         strong,

package/client/components/stock-allocation-ratio.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { client, CustomAlert } from '@things-factory/shell'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
@@ -7,9 +7,9 @@ class StockAllocationRatio extends localize(i18next)(LitElement) {
   static get styles() {
     return css`
       [field-2column] {
-        background-color: var(--theme-white-color);
-        margin: var(--margin-wide) 0;
-        padding: var(--padding-wide);
+        background-color: var(--md-sys-color-surface-variant);
+        margin: var(--spacing-large) 0;
+        padding: var(--spacing-large);
         border-radius: var(--border-radius);
         box-shadow: var(--box-shadow);
         max-width: var(--input-container-max-width);
@@ -20,14 +20,14 @@ class StockAllocationRatio extends localize(i18next)(LitElement) {
       [field] {
         display: flex;
         flex-direction: column;
-        padding-bottom: var(--padding-default);
+        padding-bottom: var(--spacing-medium);
       }
       [grid-span] {
         grid-column: span 2;
       }
       input {
-        border: var(--border-dark-color);
+        border: var(--border-dim-color);
         border-radius: var(--border-radius);
         margin: var(--input-margin);
         padding: var(--input-padding);
@@ -39,7 +39,7 @@ class StockAllocationRatio extends localize(i18next)(LitElement) {
         flex-direction: column;
         font: var(--label-font);
-        color: var(--label-color);
+        color: var(--label-color, var(--md-sys-color-on-surface));
         text-transform: var(--label-text-transform);
       }
       mwc-button {
@@ -68,17 +68,16 @@ class StockAllocationRatio extends localize(i18next)(LitElement) {
       <div field-2column>
         ${ratioSettings?.length
           ? ratioSettings.map(
-              setting =>
-                html`
-                  <label>${setting?.marketplaceStore.storeName} </label>
-                  <input
-                    name="${setting?.marketplaceStore.id}"
-                    value="${parseInt(setting.value)}"
-                    type="number"
-                    max="100"
-                    required
-                  />
-                `
+              setting => html`
+                <label>${setting?.marketplaceStore.storeName} </label>
+                <input
+                  name="${setting?.marketplaceStore.id}"
+                  value="${parseInt(setting.value)}"
+                  type="number"
+                  max="100"
+                  required
+                />
+              `
             )
           : ''}

package/client/components/variant-option-editor.js CHANGED Viewed

@@ -8,20 +8,20 @@ export class VariantOptionEditor extends LitElement {
           display: flex;
           flex-direction: row;
           flex-wrap: wrap;
-          margin-bottom: var(--margin-narrow);
-          padding: var(--padding-default);
+          margin-bottom: var(--spacing-small);
+          padding: var(--spacing-medium);
           padding-left: 0;
-          border-bottom: var(--border-dark-color);
+          border-bottom: var(--border-dim-color);
         }
         select,
         input,
         [option] {
-          border: var(--border-dark-color);
+          border: var(--border-dim-color);
           border-radius: var(--border-radius);
-          padding: var(--padding-narrow);
-          margin-right: var(--margin-narrow);
-          margin-bottom: var(--margin-narrow);
+          padding: var(--spacing-small);
+          margin-right: var(--spacing-small);
+          margin-bottom: var(--spacing-small);
           font-size: 0.9rem;
         }
@@ -35,7 +35,7 @@ export class VariantOptionEditor extends LitElement {
         [option] {
           display: inline-block;
-          background-color: var(--primary-color);
+          background-color: var(--md-sys-color-primary);
           margin: 1px 3px 4px 0;
           padding: 3px 5px;
           color: white;
@@ -43,7 +43,7 @@ export class VariantOptionEditor extends LitElement {
         }
         [delete] {
-          margin-left: var(--margin-narrow);
+          margin-left: var(--spacing-small);
           opacity: 0.5;
         }
         [delete]:hover {

package/client/components/variant-options-editor.js CHANGED Viewed

@@ -9,16 +9,16 @@ export class VariantOptionsEditor extends LitElement {
           display: flex;
           flex-direction: column;
           min-height: 200px;
-          color: var(--secondary-color);
+          color: var(--md-sys-color-secondary);
           font-size: 1rem;
         }
         label strong {
           font-weight: bold;
-          color: var(--primary-color);
+          color: var(--md-sys-color-primary);
         }
         label mwc-icon {
-          --mdc-icon-size: 20px;
+          --md-icon-size: 20px;
           float: right;
           opacity: 0.8;
           cursor: pointer;
@@ -27,7 +27,7 @@ export class VariantOptionsEditor extends LitElement {
         label mwc-icon:hover,
         label mwc-icon:active {
           opacity: 1;
-          color: var(--primary-color);
+          color: var(--md-sys-color-primary);
         }
         button {

package/client/components/wizard-view.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { LitElement, html, css } from 'lit'
 import '@material/mwc-button'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 export class WizardView extends localize(i18next)(LitElement) {
   static get styles() {
@@ -66,8 +66,8 @@ export class WizardView extends localize(i18next)(LitElement) {
       typeof step == 'string'
         ? this.querySelector(`[name=${step}]`)
         : typeof step == 'number'
-        ? this.querySelector(`:nth-child(${step})`)
-        : step
+          ? this.querySelector(`:nth-child(${step})`)
+          : step
     this.current?.toggleAttribute('active', true)

package/client/menu.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import '@material/mwc-icon'
 import { updateMenuTemplate } from '@things-factory/lite-menu'
-import { store } from '@things-factory/shell'
+import { store } from '@operato/shell'
 var stores, platforms

package/client/pages/catalogue/basic-product-setting.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { getCodeByName } from '@things-factory/code-base'
 import { MultiColumnFormStyles } from '@things-factory/form-ui'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import { client, CustomAlert } from '@things-factory/shell'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
@@ -26,7 +26,7 @@ class BasicProductSetting extends localize(i18next)(LitElement) {
           display: flex;
           flex-direction: column;
           overflow-y: auto;
-          background-color: white;
+          background-color: var(--md-sys-color-surface);
         }
         .form-container {
           flex: 1;
@@ -102,8 +102,9 @@ class BasicProductSetting extends localize(i18next)(LitElement) {
             <select name="storageType" required>
               <option value="">--${i18next.t('label.select_a_type')}--</option>
               ${(this.storageTypes || []).map(
-                storageType =>
-                  html` <option value="${storageType && storageType.name}">${storageType && storageType.name}</option> `
+                storageType => html`
+                  <option value="${storageType && storageType.name}">${storageType && storageType.name}</option>
+                `
               )}
             </select>
           </fieldset>
@@ -129,15 +130,14 @@ class BasicProductSetting extends localize(i18next)(LitElement) {
             <legend>${i18next.t('title.uploaded_images')}</legend>
             <div class="do-preview">
               ${(this._attachments || []).map(
-                attachment =>
-                  html`
-                    <image-viewer
-                      name="${attachment.name}"
-                      src="${location.origin}/attachment/${attachment.path}"
-                      .mimetype="${attachment.mimetype}"
-                      .downloadable="${this._downloadable}"
-                    ></image-viewer>
-                  `
+                attachment => html`
+                  <image-viewer
+                    name="${attachment.name}"
+                    src="${location.origin}/attachment/${attachment.path}"
+                    .mimetype="${attachment.mimetype}"
+                    .downloadable="${this._downloadable}"
+                  ></image-viewer>
+                `
               )}
             </div>
           </fieldset>

package/client/pages/catalogue/constants/product-type.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i18next } from '@things-factory/i18n-base'
+import { i18next } from '@operato/i18n'
 export const PRODUCT_TYPE = [
   {

package/client/pages/catalogue/create-new-product-popup.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { css, html, LitElement } from 'lit'
-import { i18next, localize } from '@things-factory/i18n-base'
+import { i18next, localize } from '@operato/i18n'
 import '../../components/wizard-view'
@@ -20,7 +20,7 @@ class CreateNewProdutPopup extends localize(i18next)(LitElement) {
         :host {
           display: flex;
           flex-direction: row;
-          background-color: white;
+          background-color: var(--md-sys-color-surface);
         }
         wizard-summary {
           flex: 1;
@@ -62,7 +62,7 @@ class CreateNewProdutPopup extends localize(i18next)(LitElement) {
           width: var(--wizard-step-size, 22px);
           height: var(--wizard-step-size, 22px);
           line-height: 1.2em;
-          background-color: #fff;
+          background-color: var(--md-sys-color-surface);
           border: 1px solid var(--wizard-step-color, #4c526b);
           text-align: center;
           font-size: var(--wizard-step-number-size, 17px);