@operato/context 2.0.0-alpha.8 → 2.0.0-alpha.81

package/CHANGELOG.md

@@ -3,6 +3,400 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.0-alpha.81](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.80...v2.0.0-alpha.81) (2024-04-15)
+
+
+### :bug: Bug Fix
+
+* use button-container styles ([bd91be3](https://github.com/hatiolab/operato/commit/bd91be3eaf5337a0ffe8cfc3b37191b6427ce5f6))
+
+
+
+## [2.0.0-alpha.80](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.79...v2.0.0-alpha.80) (2024-04-15)
+
+
+### :bug: Bug Fix
+
+* context btn style & app theme ([80d9f5a](https://github.com/hatiolab/operato/commit/80d9f5acc9a363e5fee22aa8bc618a6234d55745))
+* material theme ([7f9acfb](https://github.com/hatiolab/operato/commit/7f9acfbd97e933812bee45eaf4ab4bf90dc2e5dc))
+* stories for styling ([f81021d](https://github.com/hatiolab/operato/commit/f81021d6ba12aa100bf29a0ea311cb46a6e99e45))
+
+
+
+## [2.0.0-alpha.77](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.76...v2.0.0-alpha.77) (2024-04-14)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.71](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.70...v2.0.0-alpha.71) (2024-04-13)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.69](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.68...v2.0.0-alpha.69) (2024-04-13)
+
+
+### :bug: Bug Fix
+
+* mwc=>md for context ([972f5fd](https://github.com/hatiolab/operato/commit/972f5fd8da02820b6d6238cf1dd099591f97d8df))
+
+
+
+## [2.0.0-alpha.68](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.67...v2.0.0-alpha.68) (2024-04-13)
+
+
+### :bug: Bug Fix
+
+* mwc=>md for context ([2bc13f2](https://github.com/hatiolab/operato/commit/2bc13f285f257782f73e5d7b5d1ddd197df85393))
+
+
+
+## [2.0.0-alpha.67](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.66...v2.0.0-alpha.67) (2024-04-13)
+
+
+### :bug: Bug Fix
+
+* mwc=>md for context ([eacd9a5](https://github.com/hatiolab/operato/commit/eacd9a5b698969156f430f3d26233fdf7edccdf3))
+
+
+
+## [2.0.0-alpha.66](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.65...v2.0.0-alpha.66) (2024-04-13)
+
+
+### :bug: Bug Fix
+
+* mwc=>md for context ([3d4217a](https://github.com/hatiolab/operato/commit/3d4217ae178ce568823697af2bdfbb244fda93c3))
+
+
+
+## [2.0.0-alpha.65](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.64...v2.0.0-alpha.65) (2024-04-13)
+
+
+### :bug: Bug Fix
+
+* mwc=>md for context ([2b1a13b](https://github.com/hatiolab/operato/commit/2b1a13b9a214836ac7135717afd2dda536f1f487))
+
+
+
+## [2.0.0-alpha.64](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.63...v2.0.0-alpha.64) (2024-04-13)
+
+
+### :bug: Bug Fix
+
+* context button style ([8b169de](https://github.com/hatiolab/operato/commit/8b169de8c18919c36e9e8a69059046046fb5293a))
+* icon size ([b2e93e0](https://github.com/hatiolab/operato/commit/b2e93e04200145b2547edd11208ed6c895c156bc))
+* mwc=>md for context ([269d5fe](https://github.com/hatiolab/operato/commit/269d5fedca38096ce41850afe88a17ed1fd656dd))
+
+
+
+## [2.0.0-alpha.63](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.62...v2.0.0-alpha.63) (2024-04-12)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.62](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.61...v2.0.0-alpha.62) (2024-04-12)
+
+
+### :bug: Bug Fix
+
+* mwc=>md for context ([2a469f4](https://github.com/hatiolab/operato/commit/2a469f429544bd0cf9947a2efc381efafe8b0336))
+
+
+
+## [2.0.0-alpha.61](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.60...v2.0.0-alpha.61) (2024-04-11)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.60](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.59...v2.0.0-alpha.60) (2024-04-11)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.59](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.58...v2.0.0-alpha.59) (2024-04-11)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.57](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.56...v2.0.0-alpha.57) (2024-04-07)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.54](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.53...v2.0.0-alpha.54) (2024-04-01)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.53](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.52...v2.0.0-alpha.53) (2024-04-01)
+
+
+### :bug: Bug Fix
+
+* storybook for ox-context-page-toolbar ([fa5b32d](https://github.com/hatiolab/operato/commit/fa5b32dfffd36db262e51c2706a5fbd719eed8ba))
+
+
+
+## [2.0.0-alpha.52](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.51...v2.0.0-alpha.52) (2024-03-29)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.51](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.50...v2.0.0-alpha.51) (2024-03-29)
+
+
+### :bug: Bug Fix
+
+* upgrade lit ([e661c33](https://github.com/hatiolab/operato/commit/e661c333d2bb97f784b5ac2c0e365714ee5e80ff))
+
+
+
+## [2.0.0-alpha.49](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.48...v2.0.0-alpha.49) (2024-03-28)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.48](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.47...v2.0.0-alpha.48) (2024-03-28)
+
+
+### :bug: Bug Fix
+
+* context module stories ([052ac6a](https://github.com/hatiolab/operato/commit/052ac6adc0c7cae6ddaff2babc3b344302e2aca8))
+
+
+
+## [2.0.0-alpha.47](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.46...v2.0.0-alpha.47) (2024-03-27)
+
+
+### :bug: Bug Fix
+
+* storybook 실행 환경 ([6a2940f](https://github.com/hatiolab/operato/commit/6a2940fb89dc26566acdce7cf1781a71cbad61c5))
+
+
+
+## [2.0.0-alpha.46](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.45...v2.0.0-alpha.46) (2024-03-26)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.44](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.43...v2.0.0-alpha.44) (2024-03-24)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.43](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.42...v2.0.0-alpha.43) (2024-03-24)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.37](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.36...v2.0.0-alpha.37) (2024-03-18)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.35](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.34...v2.0.0-alpha.35) (2024-03-13)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.34](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.33...v2.0.0-alpha.34) (2024-03-12)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.32](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.31...v2.0.0-alpha.32) (2024-03-12)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.31](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.30...v2.0.0-alpha.31) (2024-03-03)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.30](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.29...v2.0.0-alpha.30) (2024-03-03)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.27...v2.0.0-alpha.28) (2024-02-20)
+
+
+### :bug: Bug Fix
+
+* upgrade devDependencies for webcomponents ([1489b8b](https://github.com/hatiolab/operato/commit/1489b8b790d9bcee779a070a630697f25c01728f))
+
+
+
+## [2.0.0-alpha.27](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.26...v2.0.0-alpha.27) (2024-02-17)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.22...v2.0.0-alpha.23) (2024-02-10)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.21...v2.0.0-alpha.22) (2024-02-10)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.21](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.20...v2.0.0-alpha.21) (2024-02-09)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.20](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.19...v2.0.0-alpha.20) (2024-02-05)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.19](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.18...v2.0.0-alpha.19) (2024-02-05)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.17](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.16...v2.0.0-alpha.17) (2024-02-04)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.16](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.15...v2.0.0-alpha.16) (2024-02-03)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.13](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.12...v2.0.0-alpha.13) (2024-01-28)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.12](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.11...v2.0.0-alpha.12) (2024-01-24)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.11](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.10...v2.0.0-alpha.11) (2024-01-24)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.10](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.9...v2.0.0-alpha.10) (2024-01-22)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
+## [2.0.0-alpha.9](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.8...v2.0.0-alpha.9) (2024-01-20)
+
+**Note:** Version bump only for package @operato/context
+
+
+
+
+
 ## [2.0.0-alpha.8](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.7...v2.0.0-alpha.8) (2024-01-20)
 
 **Note:** Version bump only for package @operato/context

package/demo/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en-GB">
   <head>
     <meta charset="utf-8" />
@@ -16,7 +16,18 @@
       }
     </style>
     <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
-    <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
+      rel="stylesheet"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
+      rel="stylesheet"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
+      rel="stylesheet"
+    />
   </head>
   <body>
     <div id="demo"></div>

package/dist/src/layouts/ox-context-page-toolbar.d.ts

@@ -1,5 +1,6 @@
-import '@material/mwc-icon';
-import { LitElement } from 'lit';
+import '@material/web/icon/icon.js';
+import { LitElement, TemplateResult } from 'lit';
+import { TOOL_POSITION } from '@operato/layout';
 declare const ContextPageToolbar_base: (new (...args: any[]) => {
     _storeUnsubscribe: import("redux").Unsubscribe;
     connectedCallback(): void;
@@ -10,8 +11,12 @@ declare const ContextPageToolbar_base: (new (...args: any[]) => {
 export declare class ContextPageToolbar extends ContextPageToolbar_base {
     static get styles(): import("lit").CSSResult[];
     context: any;
-    private tools?;
-    render(): import("lit").TemplateResult<1>;
+    tools?: {
+        position: TOOL_POSITION;
+        template: TemplateResult;
+        context?: string;
+    }[];
+    render(): TemplateResult<1>;
     stateChanged(state: any): void;
 }
 export {};

package/dist/src/layouts/ox-context-page-toolbar.js

@@ -1,7 +1,7 @@
 import { __decorate } from "tslib";
-import '@material/mwc-icon';
+import '@material/web/icon/icon.js';
 import { css, html, LitElement, nothing } from 'lit';
-import { customElement, property, state } from 'lit/decorators.js';
+import { customElement, property } from 'lit/decorators.js';
 import { connect } from 'pwa-helpers/connect-mixin.js';
 import { TOOL_POSITION } from '@operato/layout';
 import { store } from '@operato/shell';
@@ -20,9 +20,7 @@ let ContextPageToolbar = class ContextPageToolbar extends connect(store)(LitElem
           --context-action-bar-button-margin: 0px;
           --context-action-bar-more-button-border-radius: 2px;
 
-          --mdc-icon-size: 20px;
-          --mdc-button-height: 20px;
-          --mdc-button-horizontal-padding: 2px;
+          --md-icon-size: 20px;
         }
 
         :host > div {
@@ -30,17 +28,36 @@ let ContextPageToolbar = class ContextPageToolbar extends connect(store)(LitElem
           flex-direction: row;
 
           align-items: center;
+          gap: var(--padding-narrow);
         }
 
         * {
           cursor: pointer;
         }
 
-        mwc-icon {
-          background-color: var(--theme-white-color);
+        md-icon {
+          background-color: var(--button-background-color, #fafbfc);
           border: 1px solid rgba(var(--primary-color-rgb), 0.5);
-          padding: 1px 2px;
+          border-radius: var(--button-border-radius);
+          padding: var(--iconbtn-padding, 4px);
+
           color: var(--primary-color);
+
+          &:hover {
+            background-color: var(--primary-color);
+
+            color: var(--theme-white-color);
+          }
+        }
+
+        @media screen and (max-width: 460px) {
+          :host > div {
+            gap: 0;
+          }
+
+          md-icon {
+            border-radius: 0;
+          }
         }
       `
         ];
@@ -74,14 +91,17 @@ let ContextPageToolbar = class ContextPageToolbar extends connect(store)(LitElem
     `;
     }
     stateChanged(state) {
-        this.tools = state.context.tools;
+        var _a;
+        if (state.context) {
+            this.tools = (_a = state.context) === null || _a === void 0 ? void 0 : _a.tools;
+        }
     }
 };
 __decorate([
     property({ type: Object })
 ], ContextPageToolbar.prototype, "context", void 0);
 __decorate([
-    state()
+    property({ type: Array })
 ], ContextPageToolbar.prototype, "tools", void 0);
 ContextPageToolbar = __decorate([
     customElement('ox-context-page-toolbar')

package/dist/src/layouts/ox-context-page-toolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-context-page-toolbar.js","sourceRoot":"","sources":["../../../src/layouts/ox-context-page-toolbar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { TOOL_POSITION } from '@operato/layout'\nimport { store } from '@operato/shell'\n\n@customElement('ox-context-page-toolbar')\nexport class ContextPageToolbar extends connect(store)(LitElement) {\n  static get styles() {\n    return [\n      css`\n        :host {\n          display: flex;\n          flex-direction: row-reverse;\n          position: relative;\n\n          justify-content: end;\n          align-items: center;\n\n          --context-action-bar-button-margin: 0px;\n          --context-action-bar-more-button-border-radius: 2px;\n\n          --mdc-icon-size: 20px;\n          --mdc-button-height: 20px;\n          --mdc-button-horizontal-padding: 2px;\n        }\n\n        :host > div {\n          display: flex;\n          flex-direction: row;\n\n          align-items: center;\n        }\n\n        * {\n          cursor: pointer;\n        }\n\n        mwc-icon {\n          background-color: var(--theme-white-color);\n          border: 1px solid rgba(var(--primary-color-rgb), 0.5);\n          padding: 1px 2px;\n          color: var(--primary-color);\n        }\n      `\n    ]\n  }\n\n  @property({ type: Object }) context: any\n  @state() private tools?: any[]\n\n  render() {\n    let contextKeys = Object.keys(this.context).filter(key => !!this.context[key])\n    let tools = (this.tools || []).filter(tool => {\n      if (!tool.context || contextKeys.includes(tool.context)) {\n        return tool\n      }\n    })\n\n    let frontEndTools = tools.filter(tool => tool.position == TOOL_POSITION.FRONT_END)\n    let frontTools = tools.filter(tool => tool.position == TOOL_POSITION.FRONT)\n    let centerTools = tools.filter(tool => tool.position == TOOL_POSITION.CENTER)\n    let rearTools = tools.filter(tool => tool.position == TOOL_POSITION.REAR)\n    let rearEndTools = tools.filter(tool => tool.position == TOOL_POSITION.REAR_END)\n\n    return html`\n      ${frontEndTools.length > 0\n        ? html`<div id=\"front-end\">${frontEndTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n      ${frontTools.length > 0\n        ? html`<div id=\"front\">${frontTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n      ${centerTools.length > 0\n        ? html`<div id=\"center\">${centerTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n      ${rearTools.length > 0 ? html`<div id=\"rear\">${rearTools.map(tool => html` ${tool.template} `)}</div>` : nothing}\n      ${rearEndTools.length > 0\n        ? html`<div id=\"rear-end\">${rearEndTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n    `\n  }\n\n  stateChanged(state: any) {\n    this.tools = state.context.tools\n  }\n}\n"]}
+{"version":3,"file":"ox-context-page-toolbar.js","sourceRoot":"","sources":["../../../src/layouts/ox-context-page-toolbar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement, TemplateResult, nothing } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { TOOL_POSITION } from '@operato/layout'\nimport { store } from '@operato/shell'\n\n@customElement('ox-context-page-toolbar')\nexport class ContextPageToolbar extends connect(store)(LitElement) {\n  static get styles() {\n    return [\n      css`\n        :host {\n          display: flex;\n          flex-direction: row-reverse;\n          position: relative;\n\n          justify-content: end;\n          align-items: center;\n\n          --context-action-bar-button-margin: 0px;\n          --context-action-bar-more-button-border-radius: 2px;\n\n          --md-icon-size: 20px;\n        }\n\n        :host > div {\n          display: flex;\n          flex-direction: row;\n\n          align-items: center;\n          gap: var(--padding-narrow);\n        }\n\n        * {\n          cursor: pointer;\n        }\n\n        md-icon {\n          background-color: var(--button-background-color, #fafbfc);\n          border: 1px solid rgba(var(--primary-color-rgb), 0.5);\n          border-radius: var(--button-border-radius);\n          padding: var(--iconbtn-padding, 4px);\n\n          color: var(--primary-color);\n\n          &:hover {\n            background-color: var(--primary-color);\n\n            color: var(--theme-white-color);\n          }\n        }\n\n        @media screen and (max-width: 460px) {\n          :host > div {\n            gap: 0;\n          }\n\n          md-icon {\n            border-radius: 0;\n          }\n        }\n      `\n    ]\n  }\n\n  @property({ type: Object }) context: any\n  @property({ type: Array }) tools?: {\n    position: TOOL_POSITION\n    template: TemplateResult\n    context?: string\n  }[]\n\n  render() {\n    let contextKeys = Object.keys(this.context).filter(key => !!this.context[key])\n    let tools = (this.tools || []).filter(tool => {\n      if (!tool.context || contextKeys.includes(tool.context)) {\n        return tool\n      }\n    })\n\n    let frontEndTools = tools.filter(tool => tool.position == TOOL_POSITION.FRONT_END)\n    let frontTools = tools.filter(tool => tool.position == TOOL_POSITION.FRONT)\n    let centerTools = tools.filter(tool => tool.position == TOOL_POSITION.CENTER)\n    let rearTools = tools.filter(tool => tool.position == TOOL_POSITION.REAR)\n    let rearEndTools = tools.filter(tool => tool.position == TOOL_POSITION.REAR_END)\n\n    return html`\n      ${frontEndTools.length > 0\n        ? html`<div id=\"front-end\">${frontEndTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n      ${frontTools.length > 0\n        ? html`<div id=\"front\">${frontTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n      ${centerTools.length > 0\n        ? html`<div id=\"center\">${centerTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n      ${rearTools.length > 0 ? html`<div id=\"rear\">${rearTools.map(tool => html` ${tool.template} `)}</div>` : nothing}\n      ${rearEndTools.length > 0\n        ? html`<div id=\"rear-end\">${rearEndTools.map(tool => html` ${tool.template} `)}</div>`\n        : nothing}\n    `\n  }\n\n  stateChanged(state: any) {\n    if (state.context) {\n      this.tools = state.context?.tools\n    }\n  }\n}\n"]}

package/dist/src/layouts/ox-context-toolbar.d.ts

@@ -1,4 +1,4 @@
-import '@material/mwc-icon';
+import '@material/web/icon/icon.js';
 import { LitElement, nothing } from 'lit';
 declare const ContextToolbar_base: (new (...args: any[]) => {
     _storeUnsubscribe: import("redux").Unsubscribe;
@@ -11,7 +11,7 @@ export declare class ContextToolbar extends ContextToolbar_base {
     static get styles(): import("lit").CSSResult[];
     private context;
     private tools?;
-    render(): import("lit").TemplateResult<1> | typeof nothing;
+    render(): typeof nothing | import("lit-html").TemplateResult<1>;
     stateChanged(state: any): void;
 }
 export {};