@genesislcap/pbc-reporting-ui 1.0.6 → 1.0.7

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

@@ -1,12 +1,13 @@
 import { __awaiter, __decorate } from "tslib";
 import { Connect } from '@genesislcap/foundation-comms';
-import { ZeroAgSelectRenderer, ZeroAgTextRenderer } from '@genesislcap/foundation-zero-grid-pro';
-import { customElement, FASTElement, observable } from '@microsoft/fast-element';
+import { RapidAgSelectRenderer, RapidAgTextRenderer } from '@genesislcap/rapid-grid-pro';
+import { customElement, GenesisElement, observable } from '@genesislcap/web-core';
 import { filterObjectArray, getFiltersByFieldType } from '../../utils';
 import { AVAILABLE_FIELDS_CONFIG, SELECTED_FILTERS_CONFIG } from './columns';
 import { SelectFiltersStyles } from './select-filters.styles';
 import { SelectFiltersTemplate } from './select-filters.template';
-let SelectFilters = class SelectFilters extends FASTElement {
+import { ReportingConfig } from '../../config/config';
+let SelectFilters = class SelectFilters extends GenesisElement {
     constructor() {
         super(...arguments);
         this.filtersToRemove = [];
@@ -120,7 +121,7 @@ let SelectFilters = class SelectFilters extends FASTElement {
                         paddingLeft: 0,
                         paddingRight: 0,
                     },
-                    cellRenderer: ZeroAgSelectRenderer,
+                    cellRenderer: RapidAgSelectRenderer,
                     cellRendererParams: {
                         accessor: 'filter.conditional',
                         defaultValue: 'Select filter',
@@ -129,7 +130,7 @@ let SelectFilters = class SelectFilters extends FASTElement {
                     },
                 },
                 {
-                    cellRenderer: ZeroAgTextRenderer,
+                    cellRenderer: RapidAgTextRenderer,
                     cellRendererParams: {
                         onChange: this.onFilterValueChange,
                         accessor: 'filter.value',
@@ -182,6 +183,9 @@ __decorate([
 __decorate([
     observable
 ], SelectFilters.prototype, "filterGridReady", void 0);
+__decorate([
+    ReportingConfig
+], SelectFilters.prototype, "config", void 0);
 SelectFilters = __decorate([
     customElement({
         name: 'reporting-select-filters',

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

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

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

@@ -1,47 +1,48 @@
-import { html, ref } from '@microsoft/fast-element';
+import { html, ref } from '@genesislcap/web-core';
+import { buttonTag, cardTag, gridTag } from '../../tags';
 const allFieldsTemplate = html `
   <section class="all-fields" slot="left-section" data-test-id="all-fields-section">
     <h3 class="mt-1 section-title dark-grey">Apply filters</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('availableFieldsGrid')}
           rowSelection="multiple"
           suppressRowClickSelection
           data-test-id="available-fields-grid"
-        ></zero-grid-pro>
+        ></${gridTag}>
       </div>
-    </zero-card>
+    </${cardTag}>
   </section>
 `;
 const selectedFiltersTemplate = html `
   <section class="selected-filters" slot="right-section" data-test-id="selected-filters-section">
     <div class="spacer-3"></div>
-    <zero-card class="card">
+    <${cardTag} class="card">
       <div class="flex space-between">
         <h5 class="card-title">Fields to Apply Filters</h5>
-        <zero-button
+        <${buttonTag}
           @click=${(x) => x.removeSelectedFilters()}
           ?disabled=${(x) => !x.filtersToRemove.length}
-          appearance="primary-gradient"
+          appearance="${(x) => x.config.buttonAppearance}"
           data-test-id="remove-filters-button"
         >
           Remove filters
-        </zero-button>
+        </${buttonTag}>
       </div>
       <div class="w-full h-90pc">
-        <zero-grid-pro
+        <${gridTag}
           ${ref('selectedFiltersGrid')}
           rowSelection="multiple"
           suppressRowClickSelection
           data-test-id="selected-filters-grid"
-        ></zero-grid-pro>
+        ></${gridTag}>
       </div>
-    </zero-card>
+    </${cardTag}>
   </section>
 `;
 export const SelectFiltersTemplate = html `

package/dist/esm/components/wizard/debug.js

@@ -1,4 +1,4 @@
-import { html } from '@microsoft/fast-element';
+import { html } from '@genesislcap/web-core';
 export const Debug = html `
   <div class="flex flex-column gap-1 overflow-auto">
     <div>

package/dist/esm/components/wizard/steps/filters.js

@@ -1,4 +1,4 @@
-import { html } from '@microsoft/fast-element';
+import { html } from '@genesislcap/web-core';
 export const FiltersStep = html `
   <div class="step h-90pc">
     <reporting-select-filters

package/dist/esm/components/wizard/steps/name.js

@@ -1,27 +1,28 @@
 import { sync } from '@genesislcap/foundation-utils';
-import { html, repeat } from '@microsoft/fast-element';
+import { html, repeat } from '@genesislcap/web-core';
+import { cardTag, radioGroupTag, radioTag, textAreaTag, textFieldTag } from '../../../tags';
 const reportDescriptionTemplate = html `
   <section class="report-details" slot="left-section" data-test-id="report-details-section">
     <h3 class="mt-1 section-title dark-grey" data-test-id="report-name-title">Name Report</h3>
-    <zero-card class="card">
+    <${cardTag} class="card">
       <h5 class="card-title">Report Set up</h5>
-      <zero-text-field
+      <${textFieldTag}
         :value=${sync((x) => x.reportName)}
         class="w-full"
         placeholder="Enter report name..."
         data-test-id="report-name-input"
       >
         Report Name
-      </zero-text-field>
-      <zero-text-area
+      </${textFieldTag}>
+      <${textAreaTag}
         :value=${sync((x) => x.reportDescription)}
         class="w-full mt-2"
         placeholder="Enter report description..."
         data-test-id="report-description-input"
       >
         Report Description
-      </zero-text-area>
-    </zero-card>
+      </${textAreaTag}>
+    </${cardTag}>
   </section>
 `;
 const dataSourceTemplate = html `
@@ -29,14 +30,14 @@ const dataSourceTemplate = html `
     <h3 class="mt-1 section-title dark-grey" data-test-id="select-datasource-title">
       Select Datasource
     </h3>
-    <zero-card class="card">
+    <${cardTag} class="card">
       <h5 class="card-title">Data Sources</h5>
       <div class="card-description">You have selected ${(x) => x.selectedDatasource}</div>
       <div class="divider"></div>
       <div class="radio-buttons" data-test-id="datasource-options">
-        <zero-radio-group :value=${(x) => x.selectedDatasource}>
+        <${radioGroupTag} :value=${(x) => x.selectedDatasource}>
           ${repeat((x) => x.datasourceOptions, html `
-              <zero-radio
+              <${radioTag}
                 @click=${(x, c) => c.parent.onDatasourceChange(x.name)}
                 :checked=${(x, c) => c.parent.selectedDatasource === x.name}
                 :value=${(x) => x.name}
@@ -44,11 +45,11 @@ const dataSourceTemplate = html `
                 data-test-id=${(x) => `datasource-option-${x.name}`}
               >
                 ${(x) => x.name}
-              </zero-radio>
+              </${radioTag}>
             `)}
-        </zero-radio-group>
+        </${radioGroupTag}>
       </div>
-    </zero-card>
+    </${cardTag}>
   </section>
 `;
 export const NameStep = html `

package/dist/esm/components/wizard/steps/run.js

@@ -1,4 +1,4 @@
-import { html } from '@microsoft/fast-element';
+import { html } from '@genesislcap/web-core';
 export const RunStep = html `
   <div class="step h-90pc mt-15px" data-test-id="run-report-step">
     <h3 class="mt-1 section-title dark-grey" data-test-id="run-report-step-title">Run Report</h3>

package/dist/esm/components/wizard/steps/select.js

@@ -1,4 +1,4 @@
-import { html } from '@microsoft/fast-element';
+import { html } from '@genesislcap/web-core';
 export const SelectStep = html `
   <div class="step h-90pc" data-test-id="select-fields-step">
     <reporting-select-fields

package/dist/esm/components/wizard/wizard.js

@@ -1,13 +1,14 @@
 import { __awaiter, __decorate, __rest } from "tslib";
 import { Connect } from '@genesislcap/foundation-comms';
-import { customElement, FASTElement, observable, volatile } from '@microsoft/fast-element';
-import { ReportingEventListeners } from '../../routes/reporting-home/types';
+import { customElement, GenesisElement, observable, volatile } from '@genesislcap/web-core';
+import { ReportingEventListeners } from '../../main/types';
 import { FiltersStep, NameStep, RunStep, SelectStep } from './steps';
 import { WizardStyles as styles } from './wizard.styles';
 import { WizardTemplate as template } from './wizard.template';
 import { WizardStep, } from './wizard.types';
+import { ReportingConfig } from '../../config/config';
 const name = 'reporting-wizard';
-let Wizard = class Wizard extends FASTElement {
+let Wizard = class Wizard extends GenesisElement {
     constructor() {
         super(...arguments);
         this.debug = false;
@@ -296,6 +297,9 @@ let Wizard = class Wizard extends FASTElement {
 __decorate([
     Connect
 ], Wizard.prototype, "connect", void 0);
+__decorate([
+    ReportingConfig
+], Wizard.prototype, "config", void 0);
 __decorate([
     observable
 ], Wizard.prototype, "debug", void 0);

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

@@ -1,8 +1,6 @@
-import { neutralFillStealthHover, neutralFillStealthRest, neutralForegroundHint, neutralForegroundRest, neutralLayer1, neutralLayer2, neutralLayer4, } from '@microsoft/fast-components';
-import { css } from '@microsoft/fast-element';
+import { css } from '@genesislcap/web-core';
 import { helperStyles, normalizeStyles } from '../../styles';
-import { ColorHEX } from '../../styles';
-const { cyan, darkGreen, lightGreen, lightBlue1 } = ColorHEX;
+import { radioGroupTag, radioTag, textAreaTag } from '../../tags';
 export const WizardStyles = css `
   ${normalizeStyles}
   ${helperStyles}
@@ -12,33 +10,32 @@ export const WizardStyles = css `
 
   .grid-container {
     display: grid;
-    gap: 1rem;
+    gap: calc(var(--design-unit) * 4px);
     grid-template-columns: minmax(250px, 10%) 1fr;
     grid-auto-rows: 1fr;
-    margin-top: 1rem;
-    margin-bottom: 1rem;
+    margin: calc(var(--design-unit) *4px) 0;
     height: 95%;
   }
 
   .nav {
     max-width: 248px;
-    background-color: ${neutralLayer2};
+    background-color: var(--neutral-layer-2);
   }
 
   .nav-item h5 {
     position: relative;
-    padding: 7px 15px;
-    margin-left: -15px;
-    margin-right: -15px;
+    padding: calc(var(--design-unit) * 2px) calc(var(--design-unit) *4px);
+    margin-left: calc(var(--design-unit) * -4px);
+    margin-right: calc(var(--design-unit) * -4px);
     margin-bottom: 0;
     vertical-align: middle;
-    color: ${neutralForegroundHint};
+    color: var(--neutral-foreground-hint);
   }
 
   .nav-item.active h5,
   .nav-item h5:hover {
-    color: ${neutralForegroundRest};
-    background-color: ${neutralFillStealthRest};
+    color: var(--neutral-foreground-rest);
+    background-color: var(--neutral-fill-stealth-rest);
   }
 
   .nav-item.active h5::after {
@@ -54,7 +51,7 @@ export const WizardStyles = css `
 
     background-image: linear-gradient(
       var(--primary-gradient-angle),
-      ${lightBlue1} 0%,
+      var(--accent-fill-rest) 0%,
       rgb(101 77 249 / 97%) 100%
     );
     box-sizing: border-box;
@@ -62,103 +59,103 @@ export const WizardStyles = css `
 
   .nav-item .step-number {
     display: inline-block;
-    width: 18px;
-    height: 18px;
+    width: calc(var(--base-height-multiplier)* 2px);
+    height: calc(var(--base-height-multiplier) * 2px);
     vertical-align: middle;
     text-align: center;
-    font-family: ArialMT, Arial, sans-serif;
-    font-size: 11px;
-    line-height: 16px;
-    color: ${neutralFillStealthHover};
+    font-family: var(--body-font);
+    font-size: var(--type-ramp-minus-2-font-size);
+    line-height: var(--type-ramp-minus-2-line-height);
+    color: var(--neutral-fill-stealth-hover);
     border-radius: 50%;
-    border: 1px solid ${cyan};
+    border: calc(var(--stroke-width) * 1px) solid var(--neutral-foreground-hint);
   }
 
   .nav-item.active .step-number,
   .nav-item h5:hover .step-number {
-    color: ${neutralForegroundHint};
-    border-color: ${neutralForegroundHint};
+    color: var(--neutral-foreground-hint);
+    border-color: var(--neutral-foreground-hint);
   }
 
   .nav-item .step-number.completed {
-    border-color: ${lightGreen};
-    background-color: ${lightGreen};
-    color: ${darkGreen};
+    border-color: var(--success-color);
+    background-color: var(--success-color);
   }
 
   .body {
-    background-color: ${neutralLayer4};
+    background-color: var(--neutral-layer-4);
     padding-left: 0;
     padding-top: 0;
+    box-shadow: none;
   }
 
   .description {
-    color: ${neutralForegroundHint};
-    font-size: 10px;
+    color: var(--neutral-foreground-hint);
+    font-size: var(--type-ramp-minus-2-font-size);
     font-weight: 700;
     line-height: normal;
-    margin-left: 30px;
+    margin-left: calc((var(--design-unit) + 1) * 6px);
   }
 
   .divider {
-    margin: 25px 0 20px;
-    border: 1px solid ${cyan};
+    margin: calc(var(--design-unit) * 4px) 0;
+    border: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-rest);
   }
 
   .nav-line.completed {
-    margin: 3px 0 3px 9px;
-    border-left: 2px solid ${lightGreen};
+    margin: calc(var(--design-unit) * 1px) 0 calc(var(--design-unit) * 1px) calc(var(--design-unit) * 2px);
+    border-left: calc(var(--stroke-width) * 2px) solid var(--success-color);
   }
 
   .context-container {
-    gap: 0.75rem;
+    gap: calc(var(--design-unit) * 3px);
   }
 
   .completed .context-container {
-    padding: 10px 0 20px;
+    padding: calc(var(--design-unit) * 2px) 0 calc(var(--design-unit) * 4px);
   }
 
   .context {
-    color: ${neutralForegroundHint};
-    font-size: 10px;
+    color: var(--neutral-foreground-hint);
+    font-size: calc(var(--type-ramp-minus-2-font-size) - 1px);
     font-weight: 700;
-    line-height: 12px;
+    line-height: calc(var(--type-ramp-minus-2-line-height) - calc(var(--design-unit) * 1px));
     max-height: 100px;
-    margin: 0 0 0 20px;
+    margin: 0 0 0 calc(var(--design-unit) * 5px);
     overflow: auto;
   }
 
   .context b {
-    color: ${neutralForegroundRest};
+    color: var(--neutral-foreground-rest);
   }
 
   .label {
-    font-size: 13px;
-    color: ${neutralForegroundHint};
-    margin-bottom: 5px;
+    font-size: var(--type-ramp-minus-1-font-size);
+    color: var(--neutral-foreground-hint);
+    margin-bottom: calc(var(--design-unit) * 1px);
   }
 
-  zero-radio-group::part(positioning-region) {
+  ${radioGroupTag}::part(positioning-region) {
     display: flex;
     flex-direction: column;
-    gap: 7px;
+    gap: calc(var(--design-unit) * 2px);
     width: 100%;
   }
 
   @media screen and (min-width: 1200px) {
-    zero-radio-group::part(positioning-region) {
+    ${radioGroupTag}::part(positioning-region) {
       display: grid;
       grid-template-columns: repeat(2, minmax(0, 1fr));
     }
   }
 
   .radio-button {
-    background-color: ${neutralLayer2};
-    border-radius: 2px;
+    background-color: var(--neutral-layer-2);
+    border-radius: calc((var(--control-corner-radius) - 2) * 1px);
     cursor: pointer;
     height: 42px;
     margin: 0;
-    padding: 0 10px;
+    padding: 0 calc(var(--design-unit) * 2px);
   }
 
   .radio-button::part(label) {
@@ -170,11 +167,11 @@ export const WizardStyles = css `
 
   .radio-button.active,
   .radio-button:hover {
-    background-color: ${neutralLayer1};
+    background-color: var(--neutral-layer-1);
   }
 
-  zero-radio:hover::part(control) {
-    border: 1px solid #fff;
+  ${radioTag}:hover::part(control) {
+    border: calc(var(--stroke-width) * 1px) solid var(--neutral-foreground-rest);
   }
 
   .arrow {
@@ -182,7 +179,7 @@ export const WizardStyles = css `
     justify-self: center;
   }
 
-  zero-text-area::part(control) {
+  ${textAreaTag}::part(control) {
     min-height: 170px;
   }
 
@@ -190,4 +187,9 @@ export const WizardStyles = css `
   .data-sources {
     height: 100%;
   }
+
+  .radio-buttons {
+    max-height: 560px;
+    overflow: auto;
+  }
 `;

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

@@ -1,7 +1,8 @@
-import { html, repeat, when } from '@microsoft/fast-element';
+import { html, repeat, when } from '@genesislcap/web-core';
 import { tickIcon } from '../../assets/images';
 import { Debug } from './debug';
 import { WizardStep } from './wizard.types';
+import { buttonTag, cardTag, iconTag } from '../../tags';
 const buttonLabel = (activeTab, content, isEdit) => {
     if (activeTab === content.length - 1) {
         return isEdit ? 'Update' : 'Save';
@@ -65,13 +66,13 @@ const TabOneContextTemplate = html `
 const WizardNavigation = html `
   <div class="nav-actions text-right" data-test-id="wizard-navigation">
     ${when((x) => x.activeTab > 0, html `
-        <zero-button @click=${(x) => x.setActiveTab(x.activeTab - 1)} data-test-id="back-button">
-          <zero-icon class="mr-5px" name="arrow-left"></zero-icon>
+        <${buttonTag} @click=${(x) => x.setActiveTab(x.activeTab - 1)} data-test-id="back-button">
+          <${iconTag} class="mr-5px" name="arrow-left"></${iconTag}>
           Back
-        </zero-button>
+        </${buttonTag}>
       `)}
-    <zero-button
-      appearance="primary-gradient"
+    <${buttonTag}
+      appearance="${(x) => x.config.buttonAppearance}"
       ?disabled=${(x) => x.isFormValid}
       @click=${(x) => x.activeTab === x.content.length - 1
     ? x.saveReport(x.isEdit, x.getData())
@@ -79,18 +80,18 @@ const WizardNavigation = html `
       data-test-id="next-button"
     >
       ${(x) => buttonLabel(x.activeTab, x.content, x.isEdit)}
-      <zero-icon class="ml-5px" name="arrow-right"></zero-icon>
-    </zero-button>
+      <${iconTag} class="ml-5px" name="arrow-right"></${iconTag}>
+    </${buttonTag}>
   </div>
 `;
 const WizardContent = html `
-  <zero-card class="card body" design-unit="5" data-test-id="wizard-content">
+  <${cardTag} class="card body" design-unit="5" data-test-id="wizard-content">
     ${(x) => x.viewTemplate}
-  </zero-card>
+  </${cardTag}>
 `;
 export const WizardTemplate = html `
   <div class="wizard grid-container">
-    <zero-card class="card nav flex flex-column" data-test-id="wizard-navigation-card">
+    <${cardTag} class="card nav flex flex-column" data-test-id="wizard-navigation-card">
       <h3 class="section-title light-grey">${(x) => (x.isEdit ? 'Edit' : 'Create')} Report</h3>
       ${repeat((x) => x.content, html `
           <div
@@ -107,7 +108,7 @@ export const WizardTemplate = html `
           </div>
         `, { positioning: true, recycle: false })}
       ${WizardNavigation} ${(x) => (x.debug ? Debug : null)}
-    </zero-card>
+    </${cardTag}>
     ${WizardContent}
   </div>
 `;

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

@@ -0,0 +1,17 @@
+import { __awaiter } from "tslib";
+import { provideDesignSystem, zeroIcon, zeroButton, zeroCard, zeroTabs, zeroTab, zeroTabPanel, zeroTextField, zeroTextArea, zeroRadioGroup, zeroRadio, zeroToast, zeroDesignSystemProvider, } from '@genesislcap/foundation-zero';
+import { zeroGridComponents } from '@genesislcap/foundation-zero-grid-pro';
+/**
+ * @public
+ */
+export const registerCommonZeroComponents = () => __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.
+     */
+    zeroIcon(), zeroButton(), zeroCard(), zeroTabs(), zeroTab(), zeroTabPanel(), zeroTextField(), zeroTextArea(), zeroRadioGroup(), zeroRadio(), zeroToast(), zeroDesignSystemProvider(), zeroGridComponents);
+});

package/dist/esm/config/config.js

@@ -0,0 +1,20 @@
+import { DI } from '@genesislcap/web-core';
+import { defaultTemplateOptions } from './templates';
+/**
+ * Default ReportingConfig DI implementation.
+ * @public
+ */
+export const defaultReportingConfig = {
+    name: 'foundation-reporting',
+    templateOptions: defaultTemplateOptions,
+    designSystemPrefix: 'rapid',
+    buttonAppearance: 'primary',
+};
+/**
+ * ReportingConfig DI key.
+ *
+ * @internal
+ * @privateRemarks
+ * Marked as internal to stop api-extractor becoming confused cross-linking tokens with the same name.
+ */
+export const ReportingConfig = DI.createInterface((x) => x.instance(defaultReportingConfig));

package/dist/esm/config/configure.js

@@ -0,0 +1,58 @@
+import { __awaiter } from "tslib";
+import { DI, GenesisElement, Registration } from '@genesislcap/web-core';
+import { ReportingConfig, defaultReportingConfig } from './config';
+/**
+ * configure.
+ *
+ * @remarks
+ * Configure the reporting micro frontend for host app integration.
+ *
+ * @example Providing template options to align to your host application.
+ * ```ts
+
+ * const { configure } = await import('@genesislcap/pbc-reporting-ui/config');
+ *  return configure({
+ *    name: 'rapid-document-manager',
+ *    templateOptions: {
+ *     icon: 'rapid-icon',
+ *     button: 'rapid-button',
+ *     grid: 'rapid-grid-pro',
+ *   },
+ *   designSystemPrefix: 'rapid',
+ *  });
+ * },
+ * ```
+ *
+ * This is just an example, as there is a `RapidReporting` which you can import and use.
+ *
+ * @param config - A partial ReportingConfig.
+ * @public
+ */
+export function configure(config) {
+    return __awaiter(this, void 0, void 0, function* () {
+        /**
+         * Merge the configs
+         */
+        const value = Object.assign(Object.assign({}, defaultReportingConfig), config);
+        if (config.templateOptions) {
+            value.templateOptions = Object.assign(Object.assign(Object.assign({}, defaultReportingConfig.templateOptions), { designSystemProvider: 'template' }), config.templateOptions);
+        }
+        /**
+         * Register a new ReportingConfig
+         */
+        DI.getOrCreateDOMContainer().register(Registration.instance(ReportingConfig, value));
+        /**
+         * Lazily reference and define the micro frontend element post config setting.
+         */
+        const { Reporting, MainStyles, MainTemplate } = yield import('../main');
+        const { name, attributes, shadowOptions, elementOptions } = value;
+        return GenesisElement.define(Reporting, {
+            name,
+            template: MainTemplate,
+            styles: MainStyles,
+            attributes,
+            shadowOptions,
+            elementOptions,
+        });
+    });
+}

package/dist/esm/config/index.js

@@ -0,0 +1,2 @@
+export * from './config';
+export * from './configure';

package/dist/esm/config/templates.js

@@ -0,0 +1,21 @@
+/**
+ * defaultTemplateOptions.
+ * @remarks
+ * The default template options this MF has been created with.
+ * @public
+ */
+export const defaultTemplateOptions = {
+    icon: 'rapid-icon',
+    button: 'rapid-button',
+    card: 'rapid-card',
+    tabs: 'rapid-tabs',
+    tab: 'rapid-tab',
+    tabPanel: 'rapid-tab-panel',
+    textField: 'rapid-text-field',
+    textArea: 'rapid-text-area',
+    radioGroup: 'rapid-radio-group',
+    radio: 'rapid-radio',
+    toast: 'rapid-toast',
+    designSystemProvider: 'rapid-design-system-provider',
+    grid: 'rapid-grid-pro',
+};