@genesislcap/pbc-reporting-ui 1.0.5 → 1.0.7

package/dist/dts/main/main.d.ts

@@ -1,18 +1,112 @@
-import { Session } from '@genesislcap/foundation-comms';
-import { FASTElement } from '@microsoft/fast-element';
-import { Container } from '@microsoft/fast-foundation';
-import { MainRouterConfig } from '../routes';
-export declare class Reporting extends FASTElement {
-    config: MainRouterConfig;
-    container: Container;
-    session: Session;
-    provider: any;
-    ready: boolean;
-    data: any;
-    connectedCallback(): void;
-    checkForSSOToken(): void;
-    loadRemotes(): Promise<void>;
-    selectTemplate(): import("@microsoft/fast-element").ViewTemplate<Reporting, any>;
-    providerChanged(): void;
+import { Connect } from '@genesislcap/foundation-comms';
+import type { Tabs } from '@genesislcap/foundation-ui';
+import { GenesisElement, NavigationPhase } from '@genesislcap/web-core';
+import { List } from '../components/list';
+import { Notification, Settings } from './types';
+import { ReportingConfig } from '../config/config';
+/**
+ * FoundationReporting.
+ *
+ * @remarks
+ * Base MF export used by host application `configure` calls. It does not set up a design system or components. Both are
+ * expected to be registered in the host application, which should provide the details of which to the MF via
+ * TemplateOptions.
+ *
+ * See the {@link configure} hook for more information on how to set up and use this micro frontend in your application.
+ *
+ * @public
+ */
+export declare class FoundationReporting extends GenesisElement {
+    connect: Connect;
+    fields: string[];
+    selectedRows: any[];
+    activeReport: any;
+    notifications: Notification[];
+    datasourceSettings: any;
+    config: ReportingConfig;
+    listBox: HTMLElement;
+    reportsGrid: List;
+    tabs: Tabs;
+    enter(phase: NavigationPhase<Settings>): Promise<void>;
+    connectedCallback(): Promise<void>;
+    create(): void;
+    edit(rowData: any): void;
+    run(rowData: any): Promise<void>;
+    setPageTab(tab: string): void;
+    getFields(resourceName: string): Promise<void>;
+}
+/**
+ * RapidReporting.
+ *
+ * @remarks
+ * A rapid version that pre-registers rapid components and uses the rapid design system.
+ *
+ * @example
+ * ```ts
+ * import { RapidReporting } from '@genesislcap/pbc-reporting-ui';
+ * ...
+ * RapidReporting
+ * ```
+ *
+ * @example Load the micro frontend on-demand
+ * ```ts
+
+ *   const { RapidReporting } = await import('@genesislcap/pbc-reporting-ui');
+ *   return RapidReporting;
+ * },
+ * ```
+ *
+ * @public
+ */
+export declare class RapidReporting extends FoundationReporting {
+    /**
+     * @internal
+     */
+    connectedCallback(): Promise<void>;
+    /**
+     * @internal
+     */
+    protected loadRemotes(): Promise<void>;
+}
+/**
+ * ZeroReporting.
+ *
+ * @remarks
+ * A zero version that pre-registers zero components and uses the zero design system.
+ *
+ * @example
+ * ```ts
+ * import { ZeroReporting } from '@genesislcap/pbc-reporting-ui';
+ * ...
+ * ZeroReporting
+ * ```
+ *
+ * @example Load the micro frontend on-demand
+ * ```ts
+
+ *   const { ZeroReporting } = await import('@genesislcap/pbc-reporting-ui');
+ *   return ZeroReporting;
+ * },
+ * ```
+ *
+ * @public
+ */
+export declare class ZeroReporting extends FoundationReporting {
+    /**
+     * @internal
+     */
+    connectedCallback(): Promise<void>;
+    /**
+     * @internal
+     */
+    protected loadRemotes(): Promise<void>;
+}
+/**
+ * @privateRemarks
+ * Keeps backwards compatability with original export.
+ *
+ * @public
+ */
+export declare class Reporting extends ZeroReporting {
 }
 //# sourceMappingURL=main.d.ts.map

package/dist/dts/main/main.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../../src/main/main.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EAAiB,WAAW,EAAc,MAAM,yBAAyB,CAAC;AACjF,OAAO,EAAE,SAAS,EAAwB,MAAM,4BAA4B,CAAC;AAG7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAO7C,qBAKa,SAAU,SAAQ,WAAW;IACd,MAAM,EAAG,gBAAgB,CAAC;IACzC,SAAS,EAAG,SAAS,CAAC;IACxB,OAAO,EAAG,OAAO,CAAC;IACf,QAAQ,EAAG,GAAG,CAAC;IACf,KAAK,EAAE,OAAO,CAAS;IACvB,IAAI,EAAE,GAAG,CAAQ;IAE7B,iBAAiB;IAYjB,gBAAgB;IAQV,WAAW;IAajB,cAAc;IAId,eAAe;CAKhB"}
+{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../../../src/main/main.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAsB,MAAM,+BAA+B,CAAC;AAC5E,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AACvD,OAAO,EAAiB,cAAc,EAAE,eAAe,EAAc,MAAM,uBAAuB,CAAC;AACnG,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG1C,OAAO,EAAE,YAAY,EAA2B,QAAQ,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEnD;;;;;;;;;;;GAWG;AACH,qBAKa,mBAAoB,SAAQ,cAAc;IAC5C,OAAO,EAAG,OAAO,CAAC;IACf,MAAM,EAAE,MAAM,EAAE,CAAM;IACtB,YAAY,QAAM;IAClB,YAAY,EAAE,GAAG,CAAM;IACvB,aAAa,EAAE,YAAY,EAAE,CAAM;IACnC,kBAAkB,MAAC;IACd,MAAM,EAAG,eAAe,CAAC;IAEnC,OAAO,EAAE,WAAW,CAAC;IACrB,WAAW,EAAG,IAAI,CAAC;IACnB,IAAI,EAAE,IAAI,CAAC;IAEZ,KAAK,CAAC,KAAK,EAAE,eAAe,CAAC,QAAQ,CAAC;IAOtC,iBAAiB,IAAI,OAAO,CAAC,IAAI,CAAC;IAsBjC,MAAM;IAKN,IAAI,CAAC,OAAO,KAAA;IAQN,GAAG,CAAC,OAAO,KAAA;IAQjB,UAAU,CAAC,GAAG,EAAE,MAAM;IAIhB,SAAS,CAAC,YAAY,EAAE,MAAM;CAO5C;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBAKa,cAAe,SAAQ,mBAAmB;IACrD;;OAEG;IACG,iBAAiB;IAKvB;;OAEG;cACa,WAAW;CAI5B;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBAKa,aAAc,SAAQ,mBAAmB;IACpD;;OAEG;IACG,iBAAiB;IAKvB;;OAEG;cACa,WAAW;CAI5B;AAED;;;;;GAKG;AACH,qBAAa,SAAU,SAAQ,aAAa;CAAG"}

package/dist/dts/main/main.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"main.styles.d.ts","sourceRoot":"","sources":["../../../src/main/main.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,iDAatB,CAAC"}
+{"version":3,"file":"main.styles.d.ts","sourceRoot":"","sources":["../../../src/main/main.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,UAAU,iDAgEtB,CAAC"}

package/dist/dts/main/main.template.d.ts

@@ -1,6 +1,4 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { Reporting } from './main';
-export declare const DynamicTemplate: ViewTemplate<Reporting>;
-export declare const LoadingTemplate: ViewTemplate<Reporting>;
-export declare const MainTemplate: ViewTemplate<Reporting>;
+import { ViewTemplate } from "@genesislcap/web-core";
+import type { Reporting } from "./main";
+export declare const MainTemplate: ViewTemplate<Reporting, any>;
 //# sourceMappingURL=main.template.d.ts.map

package/dist/dts/main/main.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"main.template.d.ts","sourceRoot":"","sources":["../../../src/main/main.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAExC,eAAO,MAAM,eAAe,EAAE,YAAY,CAAC,SAAS,CAInD,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,YAAY,CAAC,SAAS,CAEnD,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,YAAY,CAAC,SAAS,CAEhD,CAAC"}
+{"version":3,"file":"main.template.d.ts","sourceRoot":"","sources":["../../../src/main/main.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAA2B,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAQ9E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAgExC,eAAO,MAAM,YAAY,8BAiDxB,CAAC"}

package/dist/dts/main/types.d.ts

@@ -0,0 +1,24 @@
+export type Settings = {
+    public?: boolean;
+    resetPassword?: boolean;
+    requestAccount?: boolean;
+    forgotPassword?: boolean;
+    logoSrc?: string;
+    logoWidth?: string;
+    logoHeight?: string;
+    maxRows?: number;
+    maxView?: number;
+};
+export type Notification = {
+    type: string;
+    title: string;
+    message?: string;
+    autoClose?: boolean;
+};
+export declare enum ReportingEventListeners {
+    notify = "notify",
+    listReports = "listReports",
+    runReport = "runReport",
+    editReport = "editReport"
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/dts/main/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/main/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,QAAQ,GAAG;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,oBAAY,uBAAuB;IACjC,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,SAAS,cAAc;IACvB,UAAU,eAAe;CAC1B"}

package/dist/dts/styles/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/styles/helpers.ts"],"names":[],"mappings":"AAUA;;GAEG;AACH,eAAO,MAAM,YAAY,iDA2KxB,CAAC"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/styles/helpers.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,eAAO,MAAM,YAAY,iDA+KxB,CAAC"}

package/dist/dts/styles/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/styles/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB,iDAS7B,CAAC;AAEF,eAAO,MAAM,WAAW,aAAa,MAAM,WAM1C,CAAC;AAEF,eAAO,MAAM,eAAe,uCAE3B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/styles/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,iDAS7B,CAAC;AAEF,eAAO,MAAM,WAAW,aAAa,MAAM,WAM1C,CAAC;AAEF,eAAO,MAAM,eAAe,uCAE3B,CAAC"}

package/dist/dts/tags/index.d.ts

@@ -0,0 +1,2 @@
+export * from './tags';
+//# sourceMappingURL=index.d.ts.map

package/dist/dts/tags/index.d.ts.map

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

package/dist/dts/tags/tags.d.ts

@@ -0,0 +1,64 @@
+/**
+ * It's important this file isn't referenced ahead of a `configure` call, otherwise these values may remain fixed at
+ * their defaults. Consumers must use the `/config` subpath to help avoid this. Files with references to tags should be
+ * lazily loaded. There is an alternative `getTags` utility at the end which could offer another approach, but direct
+ * tag exports and inline template references feel cleaner than having to convert all component `template` and `styles`
+ * exports to functions to call `getTags` on execution.
+ */
+/**
+ * @internal
+ */
+export declare const templateOptions: import("../config/templates").TemplateOptions;
+/**
+ * @internal
+ */
+export declare const iconTag: string;
+/**
+ * @internal
+ */
+export declare const buttonTag: string;
+/**
+ * @internal
+ */
+export declare const cardTag: string;
+/**
+ * @internal
+ */
+export declare const tabsTag: string;
+/**
+ * @internal
+ */
+export declare const tabTag: string;
+/**
+ * @internal
+ */
+export declare const tabPanelTag: string;
+/**
+ * @internal
+ */
+export declare const textFieldTag: string;
+/**
+ * @internal
+ */
+export declare const textAreaTag: string;
+/**
+ * @internal
+ */
+export declare const radioGroupTag: string;
+/**
+ * @internal
+ */
+export declare const radioTag: string;
+/**
+ * @internal
+ */
+export declare const toastTag: string;
+/**
+ * @internal
+ */
+export declare const designSystemProviderTag: string;
+/**
+ * @internal
+ */
+export declare const gridTag: string;
+//# sourceMappingURL=tags.d.ts.map

package/dist/dts/tags/tags.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tags.d.ts","sourceRoot":"","sources":["../../../src/tags/tags.ts"],"names":[],"mappings":"AAKA;;;;;;GAMG;AAEH;;GAEG;AACH,eAAO,MAAQ,eAAe,+CACqB,CAAC;AAEpD;;GAEG;AACH,eAAO,MAAM,OAAO,QAA+B,CAAC;AAEpD;;GAEG;AACH,eAAO,MAAM,SAAS,QAAiC,CAAC;AAExD;;GAEG;AACH,eAAO,MAAM,OAAO,QAA+B,CAAC;AAEpD;;GAEG;AACH,eAAO,MAAM,OAAO,QAA+B,CAAC;AAEpD;;GAEG;AACH,eAAO,MAAM,MAAM,QAA8B,CAAC;AAClD;;GAEG;AACH,eAAO,MAAM,WAAW,QAAmC,CAAC;AAC5D;;GAEG;AACH,eAAO,MAAM,YAAY,QAAoC,CAAC;AAC9D;;GAEG;AACH,eAAO,MAAM,WAAW,QAAmC,CAAC;AAC5D;;GAEG;AACH,eAAO,MAAM,aAAa,QAAqC,CAAC;AAChE;;GAEG;AACH,eAAO,MAAM,QAAQ,QAAgC,CAAC;AACtD;;GAEG;AACH,eAAO,MAAM,QAAQ,QAAgC,CAAC;AACtD;;GAEG;AACH,eAAO,MAAM,uBAAuB,QAA+C,CAAC;AACpF;;GAEG;AACH,eAAO,MAAM,OAAO,QAA+B,CAAC"}

package/dist/esm/components/create-edit/create-edit.js

@@ -1,11 +1,11 @@
 import { __awaiter, __decorate } from "tslib";
 import { Connect } from '@genesislcap/foundation-comms';
-import { customElement, FASTElement, observable } from '@microsoft/fast-element';
-import { ReportingEventListeners } from '../../routes/reporting-home/types';
+import { customElement, GenesisElement, observable } from '@genesislcap/web-core';
+import { ReportingEventListeners } from '../../main/types';
 import { CreateEditStyles as styles } from './create-edit.styles';
 import { CreateEditTemplate as template } from './create-edit.template';
 const name = 'reporting-create-edit';
-let CreateEdit = class CreateEdit extends FASTElement {
+let CreateEdit = class CreateEdit extends GenesisElement {
     constructor() {
         super(...arguments);
         this.report = {};

package/dist/esm/components/create-edit/create-edit.styles.js

@@ -1,14 +1,11 @@
-import { neutralForegroundRest } from '@microsoft/fast-components';
-import { css } from '@microsoft/fast-element';
-import { ColorHEX } from '../../styles';
-const { blackPearl } = ColorHEX;
+import { css } from '@genesislcap/web-core';
 export const CreateEditStyles = css `
   .create-edit {
     width: 100%;
     height: 98%;
     margin: 0;
     padding: 0;
-    color: ${neutralForegroundRest};
+    color: var(--neutral-foreground-rest);
   }
 
   .container {

package/dist/esm/components/create-edit/create-edit.template.js

@@ -1,4 +1,4 @@
-import { html } from '@microsoft/fast-element';
+import { html } from '@genesislcap/web-core';
 export const CreateEditTemplate = html `
   <div class="create-edit page" data-test-id="create-edit-page">
     <div class="container create-edit page">

package/dist/esm/components/list/columns.js

@@ -1,5 +1,4 @@
 import { formatDateTimestamp } from '@genesislcap/foundation-utils';
-import { ColorHEX } from '../../styles';
 export var REPORT_FIELDS;
 (function (REPORT_FIELDS) {
     REPORT_FIELDS["REPORT_ID"] = "REPORT_ID";
@@ -32,7 +31,7 @@ export function REPORT_COLUMN_DEFS(context) {
                 justifyContent: 'flex-start',
                 alignItems: 'center',
                 textAlign: 'left',
-                color: ColorHEX.lightBlue,
+                color: 'var(--accent-fill-rest)',
             },
             cellRendererSelector: (params) => {
                 return {
@@ -94,7 +93,7 @@ export function REPORT_COLUMN_DEFS(context) {
                     params: {
                         actionClick: () => { var _a; return context.runReport((_a = params === null || params === void 0 ? void 0 : params.node) === null || _a === void 0 ? void 0 : _a.data); },
                         actionName: 'Run',
-                        appearance: 'primary-gradient',
+                        appearance: context.config.buttonAppearance,
                     },
                 };
             },

package/dist/esm/components/list/list.js

@@ -1,14 +1,14 @@
 import { __awaiter, __decorate } from "tslib";
 import { Connect } from '@genesislcap/foundation-comms';
-import { getActionsMenuDef } from '@genesislcap/foundation-zero-grid-pro';
-import { customElement, FASTElement, observable } from '@microsoft/fast-element';
+import { getActionsMenuDef } from '@genesislcap/grid-pro';
+import { customElement, GenesisElement, observable } from '@genesislcap/web-core';
 import { actionsOpenIcon } from '../../assets/images';
-import { ReportingEventListeners } from '../../routes/reporting-home/types';
-import { ColorHEX } from '../../styles';
+import { ReportingEventListeners } from '../../main/types';
 import { ListStyles as styles } from './list.styles';
 import { ListTemplate as template } from './list.template';
+import { ReportingConfig } from '../../config/config';
 const name = 'reporting-list';
-let List = class List extends FASTElement {
+let List = class List extends GenesisElement {
     constructor() {
         super(...arguments);
         this.userInteractedRow = {};
@@ -37,7 +37,7 @@ let List = class List extends FASTElement {
                 callback: (rowData) => {
                     this.delete(rowData);
                 },
-                color: ColorHEX.orange,
+                color: 'var(--error-color)',
             },
         ], {
             width: 60,
@@ -117,6 +117,9 @@ __decorate([
 __decorate([
     observable
 ], List.prototype, "selectedRows", void 0);
+__decorate([
+    ReportingConfig
+], List.prototype, "config", void 0);
 List = __decorate([
     customElement({
         name,

package/dist/esm/components/list/list.styles.js

@@ -1,28 +1,8 @@
-import { neutralForegroundRest } from '@microsoft/fast-components';
-import { css } from '@microsoft/fast-element';
-import { ColorHEX } from '../../styles';
-const { dark } = ColorHEX;
+import { css } from '@genesislcap/web-core';
 export const ListStyles = css `
   :host {
     display: block;
     width: 100%;
     height: 100%;
-
-    --design-unit: 3.5;
-  }
-
-  .container {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    width: 100%;
-    color: ${neutralForegroundRest};
-    background-color: ${dark};
-  }
-
-  .saved-reports-grid {
-    padding: 10px;
-    width: 100%;
-    height: 80%;
   }
 `;

package/dist/esm/components/list/list.template.js

@@ -1,8 +1,9 @@
-import { html, repeat, ref } from '@microsoft/fast-element';
+import { html, repeat, ref } from '@genesislcap/web-core';
 import { REPORT_COLUMN_DEFS } from './columns';
+import { gridTag } from '../../tags';
 // TODO: provide gridoptions in class
 export const ListTemplate = html `
-  <zero-grid-pro
+  <${gridTag}
     ${ref('grid')}
     data-test-id="report-grid"
     only-template-col-defs
@@ -21,5 +22,5 @@ export const ListTemplate = html `
       data-test-id="report-grid-actions-column"
       :definition=${(x) => x.actionsMenuSlottedConfig}
     ></grid-pro-column>
-  </zero-grid-pro>
+  </${gridTag}>
 `;

package/dist/esm/components/preview/preview.js

@@ -1,12 +1,13 @@
 import { __awaiter, __decorate } from "tslib";
 import { Datasource } from '@genesislcap/foundation-comms';
 import { formatDateTimestamp, formatDateTimeTimestamp } from '@genesislcap/foundation-utils';
-import { customElement, FASTElement, observable, attr } from '@microsoft/fast-element';
+import { customElement, GenesisElement, observable, attr } from '@genesislcap/web-core';
 import { getColumns, getGridOptions } from './columns';
 import { PreviewStyles as styles } from './preview.styles';
 import { PreviewReportTemplate as template } from './preview.template';
+import { ReportingConfig } from '../../config/config';
 const name = 'reporting-preview';
-let Preview = class Preview extends FASTElement {
+let Preview = class Preview extends GenesisElement {
     constructor() {
         super(...arguments);
         this.report = {};
@@ -101,6 +102,9 @@ __decorate([
 __decorate([
     observable
 ], Preview.prototype, "datasourceSettings", void 0);
+__decorate([
+    ReportingConfig
+], Preview.prototype, "config", void 0);
 Preview = __decorate([
     customElement({
         name,

package/dist/esm/components/preview/preview.styles.js

@@ -1,4 +1,4 @@
-import { css } from '@microsoft/fast-element';
+import { css } from '@genesislcap/web-core';
 import { helperStyles } from '../../styles';
 export const PreviewStyles = css `
   ${helperStyles}

package/dist/esm/components/preview/preview.template.js

@@ -1,30 +1,31 @@
-import { html, ref } from '@microsoft/fast-element';
+import { html, ref } from '@genesislcap/web-core';
+import { buttonTag, cardTag, gridTag, iconTag } from '../../tags';
 export const PreviewReportTemplate = html `
   <div class="preview" data-test-id="preview">
-    <zero-card class="card">
+    <${cardTag} class="card">
       <div class="header">
         <div>
           <h3 class="card-title">${(x) => x.report['REPORT_NAME']}</h3>
           <p>${(x) => x.report['REPORT_DESCRIPTION']}</p>
         </div>
         <div class="controls">
-          <zero-button
-            appearance="primary-gradient"
+          <${buttonTag}
+            appearance="${(x) => x.config.buttonAppearance}"
             @click=${(x) => x.exportToCsv()}
             data-test-id="export-csv-button"
           >
             Export to csv
-            <zero-icon class="ml-5px" name="arrow-down"></zero-icon>
-          </zero-button>
+            <${iconTag} class="ml-5px" name="arrow-down"></${iconTag}>
+          </${buttonTag}>
         </div>
       </div>
       <div class="w-full h-90pc">
-        <zero-grid-pro
+        <${gridTag}
           ${ref('grid')}
           floatingFilter="false"
           rowSelection="multiple"
-        ></zero-grid-pro>
+        ></${gridTag}>
       </div>
-    </zero-card>
+    </${cardTag}>
   </div>
 `;

package/dist/esm/components/rapid-components.js

@@ -0,0 +1,21 @@
+import { __awaiter } from "tslib";
+import { baseComponents, provideDesignSystem, rapidIcon, rapidButton, rapidCard, rapidTabs, rapidTab, rapidTabPanel, rapidTextField, rapidTextArea, rapidRadioGroup, rapidRadio, rapidToast, } from '@genesislcap/rapid-design-system';
+import { rapidGridComponents } from '@genesislcap/rapid-grid-pro';
+/**
+ * @public
+ */
+export const registerCommonRapidComponents = () => __awaiter(void 0, void 0, void 0, function* () {
+    /**
+     * Register the components the app is using with the system.
+     */
+    provideDesignSystem()
+        .register(
+    /**
+     * Common across most routes, so batch register these lightweight components upfront.
+     */
+    rapidIcon(), rapidButton(), rapidCard(), rapidTabs(), rapidTab(), rapidTabPanel(), rapidTextField(), rapidTextArea(), rapidRadioGroup(), rapidRadio(), rapidToast(), 
+    /**
+     * A re-export of designSystemProvider is missing from the top level index file in rapid
+     */
+    baseComponents.designSystemProvider(), rapidGridComponents);
+});

package/dist/esm/components/select-fields/select-fields.js

@@ -1,12 +1,13 @@
 import { __awaiter, __decorate } from "tslib";
 import { Connect } from '@genesislcap/foundation-comms';
-import { ZeroAgTextRenderer } from '@genesislcap/foundation-zero-grid-pro';
-import { customElement, FASTElement, observable, attr } from '@microsoft/fast-element';
+import { RapidAgTextRenderer } from '@genesislcap/rapid-grid-pro';
+import { customElement, GenesisElement, observable, attr } from '@genesislcap/web-core';
 import { filterObjectArray, getSelectedFields } from '../../utils';
 import { FIELD_SELECT_CONFIG, SELECTED_FIELDS_CONFIG } from './columns';
 import { SelectFieldsStyles } from './select-fields.styles';
 import { SelectFieldsTemplate } from './select-fields.template';
-let SelectFields = class SelectFields extends FASTElement {
+import { ReportingConfig } from '../../config/config';
+let SelectFields = class SelectFields extends GenesisElement {
     constructor() {
         super(...arguments);
         this.fieldsToRemove = [];
@@ -126,7 +127,7 @@ let SelectFields = class SelectFields extends FASTElement {
                     {
                         field: 'displayName',
                         headerName: 'Display name',
-                        cellRenderer: ZeroAgTextRenderer,
+                        cellRenderer: RapidAgTextRenderer,
                         cellRendererParams: {
                             accessor: 'displayName',
                             onChange: this.onTextFieldChange,
@@ -187,6 +188,9 @@ __decorate([
 __decorate([
     attr
 ], SelectFields.prototype, "selectedDatasource", void 0);
+__decorate([
+    ReportingConfig
+], SelectFields.prototype, "config", void 0);
 SelectFields = __decorate([
     customElement({
         name: 'reporting-select-fields',

package/dist/esm/components/select-fields/select-fields.styles.js

@@ -1,5 +1,5 @@
-import { neutralLayer3 } from '@microsoft/fast-components';
-import { css } from '@microsoft/fast-element';
+import { css } from '@genesislcap/web-core';
+import { cardTag } from '../../tags';
 import { helperStyles, normalizeStyles } from '../../styles';
 export const SelectFieldsStyles = css `
   ${helperStyles}
@@ -15,7 +15,7 @@ export const SelectFieldsStyles = css `
     height: 100%;
   }
 
-  zero-card {
-    background-color: ${neutralLayer3};
+  ${cardTag} {
+    background-color: var(--neutral-layer-3);
   }
 `;

package/dist/esm/components/select-fields/select-fields.template.js

@@ -1,44 +1,45 @@
-import { html, ref } from '@microsoft/fast-element';
+import { html, ref } from '@genesislcap/web-core';
+import { buttonTag, cardTag, gridTag } from '../../tags';
 const availableFieldsTemplate = html `
   <section class="available-fields" slot="left-section">
     <h3 class="mt-1 section-title dark-grey">Select fields</h3>
-    <zero-card class="card">
+    <${cardTag} class="card">
       <div class="flex space-between">
         <h5 class="card-title">All fields</h5>
       </div>
 
       <div class="w-full h-90pc">
-        <zero-grid-pro
+        <${gridTag}
           ${ref('allFieldsGrid')}
           rowSelection="multiple"
           data-test-id="select-fields-available"
-        ></zero-grid-pro>
+        ></${gridTag}>
       </div>
-    </zero-card>
+    </${cardTag}>
   </section>
 `;
 const selectedFieldsTemplate = html `
   <section class="selected-fields" slot="right-section">
     <div class="spacer-3"></div>
-    <zero-card class="card">
+    <${cardTag} class="card">
       <div class="flex space-between">
         <h5 class="card-title">Selected fields</h5>
-        <zero-button
+        <${buttonTag}
           @click=${(x) => x.removeSelectedFields()}
           ?disabled=${(x) => !x.fieldsToRemove.length}
-          appearance="primary-gradient"
+          appearance="${(x) => x.config.buttonAppearance}"
         >
           Remove fields
-        </zero-button>
+        </${buttonTag}>
       </div>
       <div class="w-full h-90pc">
-        <zero-grid-pro
+        <${gridTag}
           ${ref('selectedFieldsGrid')}
           rowSelection="multiple"
           data-test-id="select-fields-selected"
-        ></zero-grid-pro>
+        ></${gridTag}>
       </div>
-    </zero-card>
+    </${cardTag}>
   </section>
 `;
 // TODO: review classes from merge conflict