@genesislcap/blank-app-seed 5.7.0-prerelease.3 → 5.7.0-prerelease.30

package/client-tmp/react/src/layouts/blank/BlankLayout.tsx

@@ -1,7 +1,7 @@
 import React, { ReactNode, useEffect, useRef } from 'react';
 import { configureDesignSystem } from '@genesislcap/foundation-ui';
 import styles from './BlankLayout.module.css';
-import * as designTokens from '@/styles/design-tokens.json';
+import * as designTokens from '../../styles/design-tokens.json';
 
 interface BlankLayoutProps {
   children: ReactNode;

package/client-tmp/react/src/layouts/default/DefaultLayout.module.css

@@ -17,6 +17,14 @@
   border: none;
 }
 
+.default-layout foundation-header::part(logo) {
+  max-width: 50px;
+  max-height: 24px;
+  width: auto;
+  height: auto;
+  object-fit: contain;
+}
+
 .routes-wrapper {
   display: flex;
   gap: calc(var(--design-unit) * 2px);

package/client-tmp/react/src/layouts/default/DefaultLayout.tsx

@@ -6,10 +6,10 @@ import {
   StandardLuminance,
 } from '@microsoft/fast-components';
 import styles from './DefaultLayout.module.css';
-import PBCElementsRenderer from '@/pbc/elementsRenderer';
-import * as designTokens from '@/styles/design-tokens.json';
-import { useRoutesContext } from '@/store/RoutesContext';
-import { AUTH_PATH } from '@/config';
+import PBCElementsRenderer from '../../pbc/elementsRenderer';
+import * as designTokens from '../../styles/design-tokens.json';
+import { useRoutesContext } from '../../store/RoutesContext';
+import { AUTH_PATH } from '../../config';
 import { LOGOUT_URL } from '@genesislcap/foundation-utils';
 
 interface DefaultLayoutProps {}
@@ -57,6 +57,9 @@ const DefaultLayout: React.FC<DefaultLayoutProps> = () => {
     <rapid-design-system-provider ref={designSystemProviderRef} class={className}>
       <PBCElementsRenderer target={['layout-start']} />
       <foundation-header
+{{#if headerLogoSrc}}
+        logo-src="{{headerLogoSrc}}"
+{{/if}}
         onluminance-icon-clicked={onLuminanceToggle}
         logout={async () => {
           await fetch(LOGOUT_URL);

package/client-tmp/react/src/main.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 import App from './App.tsx'
 
-import { registerPBCs } from '@/pbc/utils';
+import { registerPBCs } from './pbc/utils';
 import { createLogger } from '@genesislcap/foundation-logger';
 
 import './styles/styles.css'

package/client-tmp/react/src/pages/AuthPage/AuthPage.tsx

@@ -1,6 +1,6 @@
 import React, {useEffect} from 'react';
 import './AuthPage.css';
-import { configureFoundationLogin } from "@/share/foundation-login.ts";
+import { configureFoundationLogin } from '../../share/foundation-login.ts';
 import { useNavigate, useLocation } from 'react-router-dom';
 
 const AuthPage: React.FC = () => {

package/client-tmp/react/src/pages/NotFoundPage/NotFoundPage.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import ErrorMessage from '@/components/ErrorMessage/ErrorMessage';
+import ErrorMessage from '../../components/ErrorMessage/ErrorMessage';
 import './NotFoundPage.css';
 
 const NotFoundPage: React.FC = () => {

package/client-tmp/react/src/pages/NotPermittedPage/NotPermittedPage.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen } from '@testing-library/react';
 import NotPermittedPage from './NotPermittedPage';
 
-jest.mock('@/components/ErrorMessage/ErrorMessage', () => {
+jest.mock('../../components/ErrorMessage/ErrorMessage', () => {
   return jest.fn((props: { message: string }) => <h1 data-testid="error-message">{props.message}</h1>);
 });
 

package/client-tmp/react/src/pages/NotPermittedPage/NotPermittedPage.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import ErrorMessage from '@/components/ErrorMessage/ErrorMessage';
+import ErrorMessage from '../../components/ErrorMessage/ErrorMessage';
 import './NotPermittedPage.css';
 
 const NotPermittedPage: React.FC = () => {

package/client-tmp/react/src/pbc/container.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useRef } from 'react';
 import { deriveElementTag } from './utils';
-import { useRoutesContext } from '@/store/RoutesContext';
+import { useRoutesContext } from '../store/RoutesContext';
 import { useLocation, RouteObject } from 'react-router-dom';
 
 type ExtendedRouteObject = RouteObject & {

package/client-tmp/react/src/share/foundation-login.ts

@@ -1,6 +1,6 @@
 import { configure, defaultAuthConfig } from '@genesislcap/foundation-auth/config';
-import { AUTH_PATH } from '@/config';
-import { environment } from "@/environments/environment.ts";
+import { AUTH_PATH } from '../config';
+import { environment } from '../environments/environment.ts';
 import { Connect } from '@genesislcap/foundation-comms';
 import { DI } from '@genesislcap/web-core';
 import type { NavigateFunction, Location as RouterLocation } from 'react-router-dom';

package/client-tmp/react/src/share/genesis-components.ts

@@ -4,8 +4,9 @@ import { foundationLayoutComponents } from '@genesislcap/foundation-layout';
 import { getApp } from '@genesislcap/foundation-shell/app';
 import { g2plotChartsComponents } from '@genesislcap/g2plot-chart';
 import * as rapidDesignSystem from '@genesislcap/rapid-design-system';
-import { rapidGridComponents } from '@genesislcap/rapid-grid-pro';
+import { rapidGridComponents, rapidGridPro, rapidGridProStyles } from '@genesislcap/rapid-grid-pro';
 import { FoundationRouter } from '@genesislcap/foundation-ui';
+import { css } from "@genesislcap/web-core";
 
 /**
  * Ensure tree shaking doesn't remove these.
@@ -32,6 +33,16 @@ export async function registerComponents() {
     .provideDesignSystem()
     .register(
       rapidDesignSystem.baseComponents,
+      rapidGridPro({
+        styles: css`
+          ${rapidGridProStyles}
+          .ag-theme-genesis-rapid,
+          .ag-theme-genesis-rapid-dark,
+          .ag-theme-genesis-rapid-light {
+            --ag-selected-row-background-color: var(--accent-fill-rest);
+          }
+        `,
+      }),
       rapidGridComponents,
       g2plotChartsComponents,
       foundationLayoutComponents,

package/client-tmp/react/src/store/RoutesContext.tsx

@@ -1,14 +1,14 @@
 import React, { createContext, useContext, ReactNode } from 'react';
 import { RouteObject, Navigate } from 'react-router-dom';
 import { getApp } from '@genesislcap/foundation-shell/app';
-import AuthPage from '@/pages/AuthPage/AuthPage';
-import NotFoundPage from '@/pages/NotFoundPage/NotFoundPage';
-import NotPermittedPage from '@/pages/NotPermittedPage/NotPermittedPage';
+import AuthPage from '../pages/AuthPage/AuthPage';
+import NotFoundPage from '../pages/NotFoundPage/NotFoundPage';
+import NotPermittedPage from '../pages/NotPermittedPage/NotPermittedPage';
 {{#each routes}}
-import {{pascalCase this.name}} from '@/pages/{{pascalCase this.name}}/{{pascalCase this.name}}';
+import {{pascalCase this.name}} from '../pages/{{pascalCase this.name}}/{{pascalCase this.name}}';
 {{/each}}
-import PBCContainer from '@/pbc/container';
-import { AUTH_PATH, NOT_PERMITTED_PATH } from '@/config';
+import PBCContainer from '../pbc/container';
+import { AUTH_PATH, NOT_PERMITTED_PATH } from '../config';
 
 const routes = [
   {

package/client-tmp/react/src/styles/design-tokens.json

@@ -12,7 +12,7 @@
     },
     "fontFamily": {
       "bodyFont": {
-        "$value": "Roboto, \"Segoe UI\", Arial, Helvetica, sans-serif",
+        "$value": "{{#if fontFamily}}{{fontFamily}}, {{/if}}Roboto, \"Segoe UI\", Arial, Helvetica, sans-serif",
         "$type": "fontFamily"
       }
     },

package/client-tmp/react/src/styles/styles.css

@@ -1,11 +1,25 @@
+{{#if fontData}}
+{{#each fontData}}
+@font-face {
+  font-family: "{{../fontFamily}}";
+  src: url("../public/fonts/{{filename}}") format("{{format}}");
+  font-weight: {{weight}};
+  font-style: normal;
+  font-display: swap;
+}
+{{/each}}
+{{/if}}
+
+{{#unless fontFamily}}
 @font-face {
   font-family: Segoe UI;
   font-weight: 300;
   src: local("Segoe UI Semilight"), local("Segoe UI");
 }
+{{/unless}}
 
 * {
-  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif; 
+  font-family: {{#if fontFamily}}"{{fontFamily}}", {{/if}}"Segoe UI", "Helvetica Neue", Arial, sans-serif;
   font-style: normal;
   font-weight: normal;
 }

package/client-tmp/react/src/utils/getLayoutNameByRoute.ts

@@ -1,4 +1,4 @@
-import { routeLayouts } from '@/config';
+import { routeLayouts } from '../config';
 
 export const getLayoutNameByRoute = (route: string) => {
   return routeLayouts[route] || 'default';

package/client-tmp/react/src/utils/goldenLayout.helper.ts

@@ -0,0 +1,59 @@
+const ERROR_PREFIX = 'Golden layout helper - ';
+
+export const setComponentItemsMap = (
+  layoutNativeElement: any,
+  componentMapInstance: Map<string, any>,
+): (() => void) => {
+  if (!layoutNativeElement || !layoutNativeElement.layout) {
+    throw new Error(`${ERROR_PREFIX} - layout is not defined`);
+  }
+
+  const componentSetter = ({ _target: componentItem }: any) => {
+    componentMapInstance.set(componentItem.componentName, componentItem);
+  };
+
+  layoutNativeElement.layout.on('componentCreated', componentSetter);
+
+  return () => layoutNativeElement.layout.off('componentCreated', componentSetter);
+};
+
+const getElementRoot = (componentInstance: any): any => {
+  if (componentInstance) {
+    const { _element } = componentInstance;
+    return _element;
+  }
+
+  throw new Error(`${ERROR_PREFIX} - component instance is not defined`);
+};
+
+export const getElementsBySelectorFromComponent = (
+  componentInstance: any,
+  selectorValue: string,
+): any => {
+  const element = getElementRoot(componentInstance);
+  return element.querySelectorAll(`[data-selector=${selectorValue}]`);
+};
+
+export const getElementBySelectorFromComponent = (
+  componentInstance: any,
+  selector: string,
+): any => {
+  return getElementsBySelectorFromComponent(componentInstance, selector)[0];
+};
+
+export const getElementsByTagFromComponent = (
+  componentInstance: any,
+  tag: string,
+): any => {
+  const element = getElementRoot(componentInstance);
+  return element.getElementsByTagName(tag);
+};
+
+export const getElementByTagFromComponent = (
+  componentInstance: any,
+  tag: string,
+): any => {
+  return getElementsByTagFromComponent(componentInstance, tag)[0];
+};
+
+

package/client-tmp/react/test/e2e/fixture.ts

@@ -1,6 +1,6 @@
 import { base, Page } from '@genesislcap/foundation-testing/e2e';
 import { ProtectedPage } from './pages';
-import { PORT } from '@/playwright.config';
+import { PORT } from '../../playwright.config';
 
 export type FixtureConfig = {
   API_HOST: string;

package/client-tmp/web-components/package.json

@@ -91,6 +91,7 @@
   "dependencies": {
     "@genesislcap/foundation-auth": "{{versions.UI}}",
     "@genesislcap/foundation-comms": "{{versions.UI}}",
+    "@genesislcap/foundation-criteria": "{{versions.UI}}",
     "@genesislcap/foundation-entity-management": "{{versions.UI}}",
     "@genesislcap/foundation-events": "{{versions.UI}}",
     {{#if FDC3.includeDependencies}}
@@ -103,6 +104,7 @@
     "@genesislcap/foundation-notifications": "{{versions.UI}}",
     "@genesislcap/foundation-shell": "{{versions.UI}}",
     "@genesislcap/foundation-store": "{{versions.UI}}",
+    "@genesislcap/foundation-redux": "{{versions.UI}}",
     "@genesislcap/foundation-ui": "{{versions.UI}}",
     "@genesislcap/foundation-utils": "{{versions.UI}}",
     "@genesislcap/foundation-user": "{{versions.UI}}",
@@ -122,6 +124,7 @@
     "@analytics/core": "0.12.17",
     "@genesislcap/foundation-auth": "{{versions.UI}}",
     "@genesislcap/foundation-comms": "{{versions.UI}}",
+    "@genesislcap/foundation-criteria": "{{versions.UI}}",
     "@genesislcap/foundation-entity-management": "{{versions.UI}}",
     "@genesislcap/foundation-events": "{{versions.UI}}",
     {{#if FDC3.includeDependencies}}
@@ -134,6 +137,7 @@
     "@genesislcap/foundation-notifications": "{{versions.UI}}",
     "@genesislcap/foundation-shell": "{{versions.UI}}",
     "@genesislcap/foundation-store": "{{versions.UI}}",
+    "@genesislcap/foundation-redux": "{{versions.UI}}",
     "@genesislcap/foundation-ui": "{{versions.UI}}",
     "@genesislcap/foundation-utils": "{{versions.UI}}",
     "@genesislcap/foundation-user": "{{versions.UI}}",

package/client-tmp/web-components/src/components/components.ts

@@ -6,7 +6,8 @@ import { FoundationRouter } from '@genesislcap/foundation-ui';
 import * as zeroDesignSystem from '@genesislcap/foundation-zero';
 import { g2plotChartsComponents } from '@genesislcap/g2plot-chart';
 import * as rapidDesignSystem from '@genesislcap/rapid-design-system';
-import { rapidGridComponents } from '@genesislcap/rapid-grid-pro';
+import { rapidGridComponents, rapidGridPro, rapidGridProStyles } from '@genesislcap/rapid-grid-pro';
+import { css } from '@genesislcap/web-core';
 import { NotPermittedComponent } from './not-permitted-component';
 
 /**
@@ -31,14 +32,22 @@ export async function registerComponents() {
     designSystem: rapidDesignSystem,
   });
 
-  rapidDesignSystem
-    .provideDesignSystem()
-    .register(
-      rapidDesignSystem.baseComponents,
-      rapidGridComponents,
-      g2plotChartsComponents,
-      foundationLayoutComponents,
-    );
+  rapidDesignSystem.provideDesignSystem().register(
+    rapidDesignSystem.baseComponents,
+    rapidGridPro({
+      styles: css`
+        ${rapidGridProStyles}
+        .ag-theme-genesis-rapid,
+        .ag-theme-genesis-rapid-dark,
+        .ag-theme-genesis-rapid-light {
+          --ag-selected-row-background-color: var(--accent-fill-rest);
+        }
+      `,
+    }),
+    rapidGridComponents,
+    g2plotChartsComponents,
+    foundationLayoutComponents,
+  );
 
   configureHeader({
     templateOptions: {

package/client-tmp/web-components/src/layouts/default.ts

@@ -1,9 +1,8 @@
 import { getApp } from '@genesislcap/foundation-shell/app';
 import type { FoundationRouter } from '@genesislcap/foundation-ui';
 import { css, GenesisElementLayout, html } from '@genesislcap/web-core';
-import type { Store } from '../store';
 
-type ClientAppRouter = FoundationRouter & { store: Store };
+type ClientAppRouter = FoundationRouter;
 
 const app = getApp();
 
@@ -40,6 +39,9 @@ export const defaultLayout = new GenesisElementLayout(
     <div class="container">
       ${app.registerElementsTarget('layout-start')}
       <foundation-header
+{{#if headerLogoSrc}}
+        logo-src="{{headerLogoSrc}}"
+{{/if}}
         show-luminance-toggle-button
         show-misc-toggle-button
         :routeNavItems=${(x) => x.config.getNavItems()}
@@ -92,5 +94,13 @@ export const defaultLayout = new GenesisElementLayout(
     rapid-flyout::part(content) {
       height: 100%;
     }
+
+    foundation-header::part(logo) {
+      max-width: 50px;
+      max-height: 24px;
+      width: auto;
+      height: auto;
+      object-fit: contain;
+    }
   `.withBehaviors(app.registerStylesTarget('layout')),
 );

package/client-tmp/web-components/src/main/main.css

@@ -15,3 +15,15 @@ foundation-router {
 :not(:defined) {
   visibility: hidden;
 }
+
+{{#if fontData}}
+{{#each fontData}}
+@font-face {
+  font-family: "{{../fontFamily}}";
+  src: url("../../public/fonts/{{filename}}") format("{{format}}");
+  font-weight: {{weight}};
+  font-style: normal;
+  font-display: swap;
+}
+{{/each}}
+{{/if}}

package/client-tmp/web-components/src/main/main.template.ts

@@ -18,6 +18,5 @@ export const MainTemplate: ViewTemplate<MainApplication> = html`
   <foundation-router
     @luminance-icon-clicked=${(x) => x.onDarkModeToggle()}
     :config=${(x) => x.config}
-    :store=${(x) => x.store}
   ></foundation-router>
 `;

package/client-tmp/web-components/src/main/main.ts

@@ -1,5 +1,4 @@
 import { Connect, ConnectConfig, defaultConnectConfig } from '@genesislcap/foundation-comms';
-import { EventEmitter } from '@genesislcap/foundation-events';
 import { App } from '@genesislcap/foundation-shell/app';
 import { importPBCAssets } from '@genesislcap/foundation-shell/pbc';
 import { configureDesignSystem } from '@genesislcap/foundation-ui';
@@ -17,7 +16,6 @@ import {
 } from '@genesislcap/web-core';
 import * as Components from '../components';
 import { MainRouterConfig } from '../routes';
-import { Store, StoreEventDetailMap } from '../store';
 import designTokens from '../styles/design-tokens.json';
 {{#if FDC3.channels.length}}
 import { listenToChannel, onFDC3Ready } from '../utils';
@@ -27,20 +25,15 @@ import { DynamicTemplate as template, LoadingTemplate, MainTemplate } from './ma
 
 const name = '{{rootElement}}';
 
-/**
- * @fires store-connected - Fired when the store is connected.
- * @fires store-ready - Fired when the store is ready.
- */
 @customElement({
   name,
   template,
   styles,
 })
-export class MainApplication extends EventEmitter<StoreEventDetailMap>(GenesisElement) {
+export class MainApplication extends GenesisElement {
   @App app: App;
   @Connect connect!: Connect;
   @Container container!: Container;
-  @Store store: Store;
 
   @inject(MainRouterConfig) config!: MainRouterConfig;
 
@@ -51,8 +44,6 @@ export class MainApplication extends EventEmitter<StoreEventDetailMap>(GenesisEl
   async connectedCallback() {
     this.registerDIDependencies();
     super.connectedCallback();
-    this.addEventListeners();
-    this.readyStore();
     await this.loadPBCs();
     await this.loadRemotes();
     {{#if FDC3.channels.length}}
@@ -63,12 +54,6 @@ export class MainApplication extends EventEmitter<StoreEventDetailMap>(GenesisEl
     });
   }
 
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    this.removeEventListeners();
-    this.disconnectStore();
-  }
-
   onDarkModeToggle() {
     baseLayerLuminance.setValueFor(
       this.provider,
@@ -145,22 +130,4 @@ export class MainApplication extends EventEmitter<StoreEventDetailMap>(GenesisEl
        */
     );
   }
-
-  protected addEventListeners() {
-    this.addEventListener('store-connected', this.store.onConnected);
-  }
-
-  protected removeEventListeners() {
-    this.removeEventListener('store-connected', this.store.onConnected);
-  }
-
-  protected readyStore() {
-    // @ts-ignore
-    this.$emit('store-connected', this);
-    this.$emit('store-ready', true);
-  }
-
-  protected disconnectStore() {
-    this.$emit('store-disconnected');
-  }
 }

package/client-tmp/web-components/src/styles/design-tokens.json

@@ -12,7 +12,7 @@
     },
     "fontFamily": {
       "bodyFont": {
-        "$value": "Roboto, \"Segoe UI\", Arial, Helvetica, sans-serif",
+        "$value": "{{#if fontFamily}}{{fontFamily}}, {{/if}}Roboto, \"Segoe UI\", Arial, Helvetica, sans-serif",
         "$type": "fontFamily"
       }
     },

package/client-tmp/web-components/src/styles/typography.ts

@@ -1,22 +1,24 @@
-const mixinSegoeUI = (style = 'normal', weight = 'normal') => `
-  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif; 
+const mixinFont = (style = 'normal', weight = 'normal') => `
+  font-family: {{#if fontFamily}}"{{fontFamily}}", {{/if}}"Segoe UI", "Helvetica Neue", Arial, sans-serif; 
   font-style: ${style};
   font-weight: ${weight};
 `;
 
 export const stylesFontFaces = `
+{{#unless fontFamily}}
   @font-face {
     font-family: Segoe UI;
     font-weight: 300;
     src: local("Segoe UI Semilight"), local("Segoe UI");
   }
+{{/unless}}
 
   * {
-    ${mixinSegoeUI()}
+    ${mixinFont()}
   }
 `;
 
-export const mixinCardTitle = mixinSegoeUI('normal', 'bold');
+export const mixinCardTitle = mixinFont('normal', 'bold');
 
 export const stylesHeaders = `
   h1, h2, h3, h4, h5, h6 {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/blank-app-seed",
   "description": "Genesis Blank App Seed",
-  "version": "5.7.0-prerelease.3",
+  "version": "5.7.0-prerelease.30",
   "license": "Apache-2.0",
   "scripts": {
     "release": "semantic-release"

package/client-tmp/angular/src/app/store/store.ts

@@ -1,34 +0,0 @@
-import { CustomEventMap } from '@genesislcap/foundation-events';
-import { getApp } from '@genesislcap/foundation-shell/app';
-import {
-  AbstractStoreRoot,
-  registerStore,
-  StoreRoot,
-  StoreRootEventDetailMap,
-} from '@genesislcap/foundation-store';
-import { DI } from '@genesislcap/web-core';
-
-export interface Store extends StoreRoot {}
-
-export type StoreEventDetailMap = StoreRootEventDetailMap & {};
-
-declare global {
-  interface HTMLElementEventMap extends CustomEventMap<StoreEventDetailMap> {}
-}
-
-class DefaultStore extends AbstractStoreRoot<Store, StoreEventDetailMap> implements Store {
-  constructor() {
-    super();
-
-    /**
-     * Register the store root
-     */
-    getApp().registerStoreRoot(this);
-  }
-}
-
-export const Store = registerStore(DefaultStore, 'Store');
-
-export function getStore(): Store {
-  return DI.getOrCreateDOMContainer().get(Store) as Store;
-}

package/client-tmp/react/lint-css.ts

@@ -1,19 +0,0 @@
-import { execSync } from 'child_process';
-import glob from 'glob';
-import path from 'path';
-
-const cssFiles: string[] = glob.sync(path.join(__dirname, '**/*.css'));
-
-if (cssFiles.length === 0) {
-  console.log('No CSS files found.');
-  process.exit(0);
-}
-
-const command: string = `genx lint -l stylelint ${cssFiles.join(' ')}`;
-
-try {
-  execSync(command, { stdio: 'inherit' });
-} catch (error) {
-  console.error('Error running stylelint:', error);
-  process.exit(1);
-}

package/client-tmp/react/src/services/store.service.ts

@@ -1,48 +0,0 @@
-
-import { CustomEventMap } from '@genesislcap/foundation-events';
-import { getApp } from '@genesislcap/foundation-shell/app';
-import {
-  AbstractStoreRoot,
-  registerStore,
-  StoreRoot,
-  StoreRootEventDetailMap,
-} from '@genesislcap/foundation-store';
-import { DI } from '@genesislcap/web-core';
-
-interface Store extends StoreRoot {}
-type StoreEventDetailMap = StoreRootEventDetailMap & Record<string, never>;
-
-declare global {
-  interface HTMLElementEventMap extends CustomEventMap<StoreEventDetailMap> {}
-}
-
-class DefaultStore extends AbstractStoreRoot<Store, StoreEventDetailMap> implements Store {
-  constructor() {
-    super();
-
-    /**
-     * Register the store root
-     */
-    getApp().registerStoreRoot(this);
-  }
-}
-
-const Store = registerStore(DefaultStore, 'Store');
-
-class StoreService {
-  private store: any;
-
-  constructor() {
-    this.store = DI.getOrCreateDOMContainer().get(Store) as Store;
-  }
-
-  getStore() {
-    return this.store;
-  }
-
-  onConnected(event?: CustomEvent) {
-    this.store.onConnected(event);
-  }
-}
-
-export const storeService = new StoreService();