@genesislcap/pbc-reconciliation-ui 0.0.2 → 0.0.3

package/dist/esm/components/configurations-panel/configurations-panel.styles.js

@@ -0,0 +1,63 @@
+import { css } from '@microsoft/fast-element';
+const allConfigurations = css `
+  .all-configurations {
+    border-right: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+    display: flex;
+    flex-direction: column;
+  }
+
+  .title {
+    width: max-content;
+  }
+`;
+const configuration = css `
+  .configuration {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+  }
+
+  .configuration-content {
+    display: flex;
+    height: 100%;
+  }
+
+  .configuration-name-and-data-sources {
+    display: flex;
+    flex-direction: column;
+    border-right: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+  }
+
+  .reconciliation-rules {
+    display: flex;
+    width: 100%;
+  }
+
+  .configuration-footer {
+    display: flex;
+    flex-direction: row-reverse;
+    border-top: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+    padding: calc(var(--design-unit) * 2px);
+  }
+`;
+export const ConfigurationsPanelStyles = css `
+  :host {
+    display: flex;
+    height: 100%;
+    width: 100%;
+  }
+  
+  .configurations-panel {
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+  }
+
+  ${allConfigurations}
+  ${configuration}
+
+  zero-button {
+    margin: 0;
+  }
+`;
+//# sourceMappingURL=configurations-panel.styles.js.map

package/dist/esm/components/configurations-panel/configurations-panel.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"configurations-panel.styles.js","sourceRoot":"","sources":["../../../../src/components/configurations-panel/configurations-panel.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAE9C,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;CAU5B,CAAC;AAEF,MAAM,aAAa,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BxB,CAAC;AAEF,MAAM,CAAC,MAAM,yBAAyB,GAAG,GAAG,CAAA;;;;;;;;;;;;;IAaxC,iBAAiB;IACjB,aAAa;;;;;CAKhB,CAAC"}

package/dist/esm/components/configurations-panel/configurations-panel.template.js

@@ -0,0 +1,33 @@
+import { html } from '@microsoft/fast-element';
+export const ConfigurationsPanelTemplate = html `
+  <div class="configurations-panel">
+    <div class="all-configurations">
+      <div class="title">
+        All Configurations
+      </div>
+    </div>
+    
+    <div class="configuration">
+      <div class="configuration-content">
+        <div class="configuration-name-and-data-sources">
+          <div class="configuration-name">
+            Configuration Name
+          </div>
+
+          <div class="data-sources">
+            Data Sources
+          </div>
+        </div>
+        
+        <div class="reconciliation-rules">
+          Reconciliation Rules
+        </div>
+      </div>
+      
+      <div class="configuration-footer">
+        <zero-button appearance="accent" @click=${(x) => x.submit()}>Submit</zero-button>
+      </div>
+    </div>
+  </div>
+`;
+//# sourceMappingURL=configurations-panel.template.js.map

package/dist/esm/components/configurations-panel/configurations-panel.template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"configurations-panel.template.js","sourceRoot":"","sources":["../../../../src/components/configurations-panel/configurations-panel.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAG/C,MAAM,CAAC,MAAM,2BAA2B,GAAG,IAAI,CAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;kDA0BlB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE;;;;CAIlE,CAAC"}

package/dist/esm/components/reconciliations-panel/reconciliations-panel.js

@@ -0,0 +1,15 @@
+import { __decorate } from "tslib";
+import { FASTElement, customElement } from '@microsoft/fast-element';
+import { ReconciliationsPanelTemplate } from './reconciliations-panel.template';
+import { ReconciliationsPanelStyles } from './reconciliations-panel.styles';
+let ReconciliationsPanel = class ReconciliationsPanel extends FASTElement {
+};
+ReconciliationsPanel = __decorate([
+    customElement({
+        name: 'reconciliations-panel',
+        template: ReconciliationsPanelTemplate,
+        styles: ReconciliationsPanelStyles,
+    })
+], ReconciliationsPanel);
+export { ReconciliationsPanel };
+//# sourceMappingURL=reconciliations-panel.js.map

package/dist/esm/components/reconciliations-panel/reconciliations-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reconciliations-panel.js","sourceRoot":"","sources":["../../../../src/components/reconciliations-panel/reconciliations-panel.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACrE,OAAO,EAAE,4BAA4B,EAAE,MAAM,kCAAkC,CAAC;AAChF,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAOrE,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,WAAW;CACpD,CAAA;AADY,oBAAoB;IALhC,aAAa,CAAC;QACb,IAAI,EAAE,uBAAuB;QAC7B,QAAQ,EAAE,4BAA4B;QACtC,MAAM,EAAE,0BAA0B;KACnC,CAAC;GACW,oBAAoB,CAChC;SADY,oBAAoB"}

package/dist/esm/components/reconciliations-panel/reconciliations-panel.styles.js

@@ -0,0 +1,4 @@
+import { css } from '@microsoft/fast-element';
+export const ReconciliationsPanelStyles = css `
+`;
+//# sourceMappingURL=reconciliations-panel.styles.js.map

package/dist/esm/components/reconciliations-panel/reconciliations-panel.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reconciliations-panel.styles.js","sourceRoot":"","sources":["../../../../src/components/reconciliations-panel/reconciliations-panel.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAE9C,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAG,CAAA;CAC5C,CAAC"}

package/dist/esm/components/reconciliations-panel/reconciliations-panel.template.js

@@ -0,0 +1,6 @@
+import { html } from '@microsoft/fast-element';
+export const ReconciliationsPanelTemplate = html `
+  <div class="reconciliations-panel">
+  </div>
+`;
+//# sourceMappingURL=reconciliations-panel.template.js.map

package/dist/esm/components/reconciliations-panel/reconciliations-panel.template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reconciliations-panel.template.js","sourceRoot":"","sources":["../../../../src/components/reconciliations-panel/reconciliations-panel.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAG/C,MAAM,CAAC,MAAM,4BAA4B,GAAG,IAAI,CAAsB;;;CAGrE,CAAC"}

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export * from './main/index';
+export * from './main';
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}

package/dist/esm/main/index.js

@@ -1,3 +1,4 @@
 export * from './main.template';
+export * from './main.styles';
 export * from './main';
 //# sourceMappingURL=index.js.map

package/dist/esm/main/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/main/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/main/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC"}

package/dist/esm/main/main.js

@@ -1,116 +1,38 @@
 import { __awaiter, __decorate } from "tslib";
-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';
-import { baseLayerLuminance, StandardLuminance } from '@microsoft/fast-components';
-import { FASTElement, customElement, observable, DOM } from '@microsoft/fast-element';
-import { Container, inject, Registration } from '@microsoft/fast-foundation';
-import { DefaultRouteRecognizer } from '@microsoft/fast-router';
-import * as Components from '../components';
-import { MainRouterConfig } from '../routes';
-import { Store } from '../store';
-import designTokens from '../styles/design-tokens.json';
-import { MainStyles as styles } from './main.styles';
-import { DynamicTemplate as template, LoadingTemplate, MainTemplate } from './main.template';
-const name = 'reconciliation-root';
-let MainApplication = class MainApplication extends EventEmitter(FASTElement) {
+import { FASTElement, customElement, observable } from '@microsoft/fast-element';
+import { FoundationReconciliationTemplate } from './main.template';
+import { FoundationReconciliationStyles } from './main.styles';
+import { loadRemotes } from '../components/components';
+let FoundationReconciliation = class FoundationReconciliation extends FASTElement {
     constructor() {
         super(...arguments);
         this.ready = false;
-        this.data = null;
     }
     connectedCallback() {
         const _super = Object.create(null, {
             connectedCallback: { get: () => super.connectedCallback }
         });
         return __awaiter(this, void 0, void 0, function* () {
-            this.registerDIDependencies();
             _super.connectedCallback.call(this);
-            this.addEventListeners();
-            this.readyStore();
-            yield this.loadPBCs();
             yield this.loadRemotes();
-            DOM.queueUpdate(() => {
-                configureDesignSystem(this.provider, designTokens);
-            });
-        });
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        this.removeEventListeners();
-        this.disconnectStore();
-    }
-    onDarkModeToggle() {
-        baseLayerLuminance.setValueFor(this.provider, baseLayerLuminance.getValueFor(this.provider) === StandardLuminance.DarkMode
-            ? StandardLuminance.LightMode
-            : StandardLuminance.DarkMode);
-    }
-    loadPBCs() {
-        return __awaiter(this, void 0, void 0, function* () {
-            const pbcAssets = yield importPBCAssets();
-            this.app.registerAssets(pbcAssets);
-            this.app.registerRouteCollection(this.config.routes);
         });
     }
     loadRemotes() {
         return __awaiter(this, void 0, void 0, function* () {
-            const { registerComponents } = Components;
-            yield registerComponents();
+            const remoteComponents = yield loadRemotes();
             this.ready = true;
         });
     }
-    selectTemplate() {
-        return this.ready ? MainTemplate : LoadingTemplate;
-    }
-    registerDIDependencies() {
-        this.container.register(Registration.transient(DefaultRouteRecognizer, DefaultRouteRecognizer), Registration.instance(ConnectConfig, Object.assign(Object.assign({}, defaultConnectConfig), { connect: Object.assign(Object.assign({}, defaultConnectConfig.connect), { heartbeatInterval: 15000 }) })));
-    }
-    addEventListeners() {
-        this.addEventListener('store-connected', this.store.onConnected);
-    }
-    removeEventListeners() {
-        this.removeEventListener('store-connected', this.store.onConnected);
-    }
-    readyStore() {
-        this.$emit('store-connected', this);
-        this.$emit('store-ready', true);
-    }
-    disconnectStore() {
-        this.$emit('store-disconnected');
-    }
 };
-__decorate([
-    App
-], MainApplication.prototype, "app", void 0);
-__decorate([
-    Connect
-], MainApplication.prototype, "connect", void 0);
-__decorate([
-    Container
-], MainApplication.prototype, "container", void 0);
-__decorate([
-    Store
-], MainApplication.prototype, "store", void 0);
-__decorate([
-    inject(MainRouterConfig)
-], MainApplication.prototype, "config", void 0);
-__decorate([
-    observable
-], MainApplication.prototype, "provider", void 0);
-__decorate([
-    observable
-], MainApplication.prototype, "ready", void 0);
 __decorate([
     observable
-], MainApplication.prototype, "data", void 0);
-MainApplication = __decorate([
+], FoundationReconciliation.prototype, "ready", void 0);
+FoundationReconciliation = __decorate([
     customElement({
-        name,
-        template,
-        styles,
+        name: 'foundation-reconciliation',
+        template: FoundationReconciliationTemplate,
+        styles: FoundationReconciliationStyles,
     })
-], MainApplication);
-export { MainApplication };
+], FoundationReconciliation);
+export { FoundationReconciliation };
 //# sourceMappingURL=main.js.map

package/dist/esm/main/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sourceRoot":"","sources":["../../../src/main/main.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"main.js","sourceRoot":"","sources":["../../../src/main/main.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACjF,OAAO,EAAE,gCAAgC,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAUhD,IAAM,wBAAwB,GAA9B,MAAM,wBAAyB,SAAQ,WAAW;IAAlD;;QACO,UAAK,GAAY,KAAK,CAAC;IAgBrC,CAAC;IAdO,iBAAiB;;;;;YACrB,OAAM,iBAAiB,YAAG;YAC1B,MAAM,IAAI,CAAC,WAAW,EAAE,CAAC;QAC3B,CAAC;KAAA;IAOK,WAAW;;YACf,MAAM,gBAAgB,GAAG,MAAM,WAAW,EAAE,CAAC;YAC7C,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QACpB,CAAC;KAAA;CACF,CAAA;AAhBa;IAAX,UAAU;uDAAwB;AADxB,wBAAwB;IALpC,aAAa,CAAC;QACb,IAAI,EAAE,2BAA2B;QACjC,QAAQ,EAAE,gCAAgC;QAC1C,MAAM,EAAE,8BAA8B;KACvC,CAAC;GACW,wBAAwB,CAiBpC;SAjBY,wBAAwB"}

package/dist/esm/main/main.styles.js

@@ -1,22 +1,9 @@
-import { getApp } from '@genesislcap/foundation-shell/app';
 import { css } from '@microsoft/fast-element';
-import { stylesFontFaces } from '../styles';
-import './main.css';
-export const MainStyles = css `
-  ${stylesFontFaces}
-  :host {
-    contain: content;
-
-    --nav-height: 60px;
-  }
-
-  :host,
-  zero-design-system-provider,
-  .dynamic-template,
-  foundation-router {
-    display: flex;
-    width: 100%;
+export const FoundationReconciliationStyles = css `
+  .reconciliation,
+  zero-tabs,
+  zero-tab-panel {
     height: 100%;
   }
-`.withBehaviors(getApp().registerStylesTarget('main'));
+`;
 //# sourceMappingURL=main.styles.js.map

package/dist/esm/main/main.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.styles.js","sourceRoot":"","sources":["../../../src/main/main.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAC5C,OAAO,YAAY,CAAC;AAEpB,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;IACzB,eAAe;;;;;;;;;;;;;;;CAelB,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC"}
+{"version":3,"file":"main.styles.js","sourceRoot":"","sources":["../../../src/main/main.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAK9C,MAAM,CAAC,MAAM,8BAA8B,GAAG,GAAG,CAAA;;;;;;CAMhD,CAAC"}

package/dist/esm/main/main.template.js

@@ -1,20 +1,18 @@
-import { LAYOUT_POPOUT_CONTAINER_CLASS } from '@genesislcap/foundation-layout';
-import { html, ref } from '@microsoft/fast-element';
-export const DynamicTemplate = html `
-  <template>
-    <zero-design-system-provider ${ref('provider')} class="${LAYOUT_POPOUT_CONTAINER_CLASS}">
-      <div class="dynamic-template">${(x) => x.selectTemplate()}</div>
-    </zero-design-system-provider>
-  </template>
-`;
-export const LoadingTemplate = html `
-  <zero-progress-ring></zero-progress-ring>
-`;
-export const MainTemplate = html `
-  <foundation-router
-    @luminance-icon-clicked=${(x) => x.onDarkModeToggle()}
-    :config=${(x) => x.config}
-    :store=${(x) => x.store}
-  ></foundation-router>
+import { html } from '@microsoft/fast-element';
+export const FoundationReconciliationTemplate = html `
+  <div class="reconciliation">
+    <zero-tabs appearance="secondary" class="tabs">
+      <zero-tab appearance="secondary" slot="configurations-tab">Configurations</zero-tab>
+      <zero-tab appearance="secondary" slot="reconciliations-tab">Reconciliations</zero-tab>
+
+      <zero-tab-panel slot="configurations-tab" id="configurations-tab-panel">
+        <configurations-panel></configurations-panel>
+      </zero-tab-panel>
+      
+      <zero-tab-panel slot="reconciliations-tab" id="reconciliations-tab-panel">
+        <reconciliations-panel></reconciliations-panel>
+      </zero-tab-panel>
+    </zero-tabs>
+  </div>
 `;
 //# sourceMappingURL=main.template.js.map

package/dist/esm/main/main.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.template.js","sourceRoot":"","sources":["../../../src/main/main.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAIpD,MAAM,CAAC,MAAM,eAAe,GAAkC,IAAI,CAAA;;mCAE/B,GAAG,CAAC,UAAU,CAAC,WAAW,6BAA6B;sCACpD,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE;;;CAG9D,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAkC,IAAI,CAAA;;CAEjE,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAkC,IAAI,CAAA;;8BAEjC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,gBAAgB,EAAE;cAC3C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM;aAChB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK;;CAE1B,CAAC"}
+{"version":3,"file":"main.template.js","sourceRoot":"","sources":["../../../src/main/main.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAM/C,MAAM,CAAC,MAAM,gCAAgC,GAAG,IAAI,CAA0B;;;;;;;;;;;;;;;CAe7E,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/pbc-reconciliation-ui",
   "description": "Genesis PBC reconciliation UI",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
   "types": "dist/reconciliation.d.ts",

package/src/components/components.ts

@@ -1,75 +1,52 @@
-import { EntityManagement } from '@genesislcap/foundation-entity-management';
-import { Form } from '@genesislcap/foundation-forms';
-import { Navigation } from '@genesislcap/foundation-header';
 import { foundationLayoutComponents } from '@genesislcap/foundation-layout';
-import { getApp } from '@genesislcap/foundation-shell/app';
-import { FoundationRouter } from '@genesislcap/foundation-ui';
-import {
-  assureDesignSystem,
-  DesignSystemModule,
-  ResourceType,
-} from '@genesislcap/foundation-utils';
-import { zeroGridComponents } from '@genesislcap/foundation-zero-grid-pro';
-import { g2plotChartsComponents } from '@genesislcap/g2plot-chart';
 import { logger } from '../utils';
+import { ConfigurationsPanel } from './configurations-panel/configurations-panel';
+import { ReconciliationsPanel } from './reconciliations-panel/reconciliations-panel';
+import { allComponents, provideFASTDesignSystem } from '@microsoft/fast-components';
+import { zeroDesignSystemProvider } from '@genesislcap/foundation-zero';
 
-/**
- * Ensure tree shaking doesn't remove these.
- */
-FoundationRouter;
-Navigation;
-EntityManagement;
-Form;
+// Components
+ConfigurationsPanel;
+ReconciliationsPanel;
 
-/**
- * zeroDesignSystemImport.
- * @remarks
- * Attempts to use a module federation version of zero before falling back to the version that was bundled with the app.
- * @internal
- */
-async function zeroDesignSystemImport(): Promise<DesignSystemModule> {
-  let module: DesignSystemModule;
-  let type: ResourceType = ResourceType.remote;
+enum ResourceType {
+  LOCAL = 'LOCAL',
+  REMOTE = 'REMOTE',
+}
+
+// TODO: Think about sharing import functions across micro frontends.
+function loadZeroFallback() {
+  return import(
+    /* webpackMode: "lazy" */
+    '@genesislcap/foundation-zero'
+  );
+}
+
+// Granular
+async function loadZeroDesignSystem() {
+  let type = ResourceType.REMOTE;
   try {
-    module = await import(
-      /* webpackChunkName: "foundation-zero" */
-      'foundationZero/ZeroDesignSystem'
-    );
-    return assureDesignSystem(module);
+    return await import('foundationZero/ZeroDesignSystem');
   } catch (e) {
-    logger.info(
-      `Please note remoteEntry.js load errors are expected if module federated dependencies are offline. Falling back to locally bundled versions.`,
-    );
-    type = ResourceType.local;
-    module = await import(
-      /* webpackChunkName: "foundation-zero" */
-      '@genesislcap/foundation-zero'
-    );
-    return assureDesignSystem(module);
+    type = ResourceType.LOCAL;
+    return await loadZeroFallback();
   } finally {
-    logger.debug(`Using '${type}' version of foundation-zero`);
+    logger.debug(`Using '${type}' version of foundationZero/ZeroDesignSystem`);
   }
 }
 
-/**
- * registerComponents.
- * @public
- */
-export async function registerComponents() {
-  const designSystem = await zeroDesignSystemImport();
-  const { provideDesignSystem, baseComponents } = designSystem;
-
-  /**
-   * Register any PBC components with the design system
-   */
-  getApp().registerComponents({
-    designSystem,
-  });
+export async function loadRemotes() {
+  const { registerZeroDesignSystem, provideDesignSystem } = await loadZeroDesignSystem();
 
-  provideDesignSystem().register(
-    baseComponents,
-    zeroGridComponents,
-    g2plotChartsComponents,
-    foundationLayoutComponents,
-  );
+  return {
+    ZeroDesignSystem: {
+      ...registerZeroDesignSystem(),
+      ...provideDesignSystem().register(foundationLayoutComponents),
+    },
+  };
 }
+
+provideFASTDesignSystem().register(
+  allComponents,
+  zeroDesignSystemProvider()
+);

package/src/components/configurations-panel/configurations-panel.styles.ts

@@ -0,0 +1,65 @@
+import { css } from '@microsoft/fast-element';
+
+const allConfigurations = css`
+  .all-configurations {
+    border-right: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+    display: flex;
+    flex-direction: column;
+  }
+
+  .title {
+    width: max-content;
+  }
+`;
+
+const configuration = css`
+  .configuration {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+  }
+
+  .configuration-content {
+    display: flex;
+    height: 100%;
+  }
+
+  .configuration-name-and-data-sources {
+    display: flex;
+    flex-direction: column;
+    border-right: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+  }
+
+  .reconciliation-rules {
+    display: flex;
+    width: 100%;
+  }
+
+  .configuration-footer {
+    display: flex;
+    flex-direction: row-reverse;
+    border-top: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+    padding: calc(var(--design-unit) * 2px);
+  }
+`;
+
+export const ConfigurationsPanelStyles = css`
+  :host {
+    display: flex;
+    height: 100%;
+    width: 100%;
+  }
+  
+  .configurations-panel {
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+  }
+
+  ${allConfigurations}
+  ${configuration}
+
+  zero-button {
+    margin: 0;
+  }
+`;

package/src/components/configurations-panel/configurations-panel.template.ts

@@ -0,0 +1,34 @@
+import { html } from '@microsoft/fast-element';
+import { ConfigurationsPanel } from './configurations-panel';
+
+export const ConfigurationsPanelTemplate = html<ConfigurationsPanel>`
+  <div class="configurations-panel">
+    <div class="all-configurations">
+      <div class="title">
+        All Configurations
+      </div>
+    </div>
+    
+    <div class="configuration">
+      <div class="configuration-content">
+        <div class="configuration-name-and-data-sources">
+          <div class="configuration-name">
+            Configuration Name
+          </div>
+
+          <div class="data-sources">
+            Data Sources
+          </div>
+        </div>
+        
+        <div class="reconciliation-rules">
+          Reconciliation Rules
+        </div>
+      </div>
+      
+      <div class="configuration-footer">
+        <zero-button appearance="accent" @click=${(x) => x.submit()}>Submit</zero-button>
+      </div>
+    </div>
+  </div>
+`;

package/src/components/configurations-panel/configurations-panel.ts

@@ -0,0 +1,14 @@
+import { FASTElement, customElement } from '@microsoft/fast-element';
+import { ConfigurationsPanelTemplate } from './configurations-panel.template';
+import { ConfigurationsPanelStyles } from './configurations-panel.styles';
+
+@customElement({
+  name: 'configurations-panel',
+  template: ConfigurationsPanelTemplate,
+  styles: ConfigurationsPanelStyles,
+})
+export class ConfigurationsPanel extends FASTElement {
+
+  submit() {
+  }
+}

package/src/components/reconciliations-panel/reconciliations-panel.styles.ts

@@ -0,0 +1,4 @@
+import { css } from '@microsoft/fast-element';
+
+export const ReconciliationsPanelStyles = css`
+`;

package/src/components/reconciliations-panel/reconciliations-panel.template.ts

@@ -0,0 +1,7 @@
+import { html } from '@microsoft/fast-element';
+import { ReconciliationsPanel } from './reconciliations-panel';
+
+export const ReconciliationsPanelTemplate = html<ReconciliationsPanel>`
+  <div class="reconciliations-panel">
+  </div>
+`;