@xh/hoist 59.0.3 → 59.2.0

package/admin/tabs/userData/jsonblob/JsonBlobModel.ts

@@ -4,6 +4,7 @@
  *
  * Copyright © 2023 Extremely Heavy Industries Inc.
  */
+import {exportFilenameWithDate} from '@xh/hoist/admin/AdminUtils';
 import {AppModel} from '@xh/hoist/admin/AppModel';
 import * as Col from '@xh/hoist/admin/columns';
 import {HoistModel, LoadSpec, managed, XH} from '@xh/hoist/core';
@@ -18,7 +19,6 @@ import {
 } from '@xh/hoist/desktop/cmp/rest';
 import {fmtDateTime} from '@xh/hoist/format';
 import {action, makeObservable, observable} from '@xh/hoist/mobx';
-import {LocalDate} from '@xh/hoist/utils/datetime';
 import {isDate} from 'lodash';
 import {DifferModel} from '../../../differ/DifferModel';
 import * as JBCol from './JsonBlobColumns';
@@ -46,7 +46,7 @@ export class JsonBlobModel extends HoistModel {
             persistWith: this.persistWith,
             colChooserModel: true,
             enableExport: true,
-            exportOptions: {filename: `${XH.appCode}-json-blobs-${LocalDate.today()}`},
+            exportOptions: {filename: exportFilenameWithDate('json-blobs')},
             selModel: 'multiple',
             store: {
                 url: 'rest/jsonBlobAdmin',

package/admin/tabs/userData/prefs/PreferenceModel.ts

@@ -4,6 +4,7 @@
  *
  * Copyright © 2023 Extremely Heavy Industries Inc.
  */
+import {exportFilenameWithDate} from '@xh/hoist/admin/AdminUtils';
 import {AppModel} from '@xh/hoist/admin/AppModel';
 import * as Col from '@xh/hoist/admin/columns';
 import {HoistModel, LoadSpec, managed, XH} from '@xh/hoist/core';
@@ -11,7 +12,6 @@ import {FieldSpec} from '@xh/hoist/data';
 import {textArea} from '@xh/hoist/desktop/cmp/input';
 import {addAction, deleteAction, editAction, RestGridModel} from '@xh/hoist/desktop/cmp/rest';
 import {action, makeObservable, observable} from '@xh/hoist/mobx';
-import {LocalDate} from '@xh/hoist/utils/datetime';
 import {DifferModel} from '../../../differ/DifferModel';
 import {RegroupDialogModel} from '../../../regroup/RegroupDialogModel';
 
@@ -41,7 +41,7 @@ export class PreferenceModel extends HoistModel {
             persistWith: this.persistWith,
             colChooserModel: true,
             enableExport: true,
-            exportOptions: {filename: `${XH.appCode}-prefs-${LocalDate.today()}`},
+            exportOptions: {filename: exportFilenameWithDate('prefs')},
             selModel: 'multiple',
             store: {
                 url: 'rest/preferenceAdmin',

package/admin/tabs/userData/prefs/UserPreferencePanel.ts

@@ -4,12 +4,12 @@
  *
  * Copyright © 2023 Extremely Heavy Industries Inc.
  */
+import {exportFilenameWithDate} from '@xh/hoist/admin/AdminUtils';
 import {AppModel} from '@xh/hoist/admin/AppModel';
 import * as Col from '@xh/hoist/admin/columns';
-import {hoistCmp, XH} from '@xh/hoist/core';
+import {hoistCmp} from '@xh/hoist/core';
 import {FieldSpec} from '@xh/hoist/data';
 import {restGrid, RestGridConfig} from '@xh/hoist/desktop/cmp/rest';
-import {LocalDate} from '@xh/hoist/utils/datetime';
 
 export const userPreferencePanel = hoistCmp.factory(() =>
     restGrid({modelConfig: {...modelSpec, readonly: AppModel.readonly}})
@@ -22,7 +22,7 @@ const modelSpec: RestGridConfig = {
     persistWith: {localStorageKey: 'xhAdminUserPreferenceState'},
     colChooserModel: true,
     enableExport: true,
-    exportOptions: {filename: `${XH.appCode}-user-prefs-${LocalDate.today()}`},
+    exportOptions: {filename: exportFilenameWithDate('user-prefs')},
     selModel: 'multiple',
     store: {
         url: 'rest/userPreferenceAdmin',

package/appcontainer/ExceptionDialogModel.ts

@@ -49,6 +49,12 @@ export class ExceptionDialogModel extends HoistModel {
         this.displayData = {exception, options};
     }
 
+    @action
+    showDetails(exception: HoistException, options: ExceptionHandlerOptions) {
+        this.show(exception, options);
+        this.openDetails();
+    }
+
     @action
     close() {
         this.displayData = null;

package/cmp/ag-grid/AgGrid.scss

@@ -5,6 +5,14 @@
  * Copyright © 2023 Extremely Heavy Industries Inc.
  */
 
+@mixin group-border($side) {
+  border-#{$side}: var(--xh-border-solid);
+}
+
+@mixin pinned-border {
+  border-right: 1px solid var(--xh-grid-pinned-column-border-color);
+}
+
 // Ag-grid installs an outer div around itself.
 .xh-ag-grid > div {
   width: 100%;
@@ -121,12 +129,14 @@
 
   &--no-row-borders {
     .ag-row {
-      border-color: transparent;
+      border-bottom: none;
+      border-top: none;
 
       // Deliberately keep border on full-width grouped rows even when we aren't adding row borders.
       // Without this collapsed groups (which don't stripe) blend together in a solid block.
       &.ag-row-group.ag-full-width-row {
-        border-color: var(--xh-grid-group-border-color);
+        border-bottom: 1px solid var(--xh-grid-group-border-color);
+        border-top: 1px solid var(--xh-grid-group-border-color);
       }
     }
   }
@@ -188,7 +198,7 @@
   }
 
   .ag-cell.ag-cell-last-left-pinned:not(.ag-cell-focus) {
-    border-right: 1px solid var(--xh-grid-pinned-column-border-color);
+    @include pinned-border;
   }
 
   // We use flexbox to consistently vertically center cell contents across
@@ -227,7 +237,7 @@
   &--no-cell-borders {
     .ag-cell,
     .ag-context-menu-open .ag-cell-focus:not(.ag-cell-range-selected) {
-      border-color: transparent;
+      border: none;
     }
   }
 
@@ -235,7 +245,19 @@
   &--no-cell-focus {
     .ag-has-focus {
       .ag-cell-focus:not(.ag-cell-range-selected) {
-        border-color: transparent;
+        border: none;
+
+        &.ag-cell.ag-cell-last-left-pinned {
+          @include pinned-border;
+        }
+
+        &.ag-cell.xh-cell--group-border-left {
+          @include group-border(left);
+        }
+
+        &.ag-cell.xh-cell--group-border-right {
+          @include group-border(right);
+        }
       }
     }
   }

package/cmp/error/ErrorBoundary.ts

@@ -0,0 +1,68 @@
+/*
+ * This file belongs to Hoist, an application development toolkit
+ * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
+ *
+ * Copyright © 2023 Extremely Heavy Industries Inc.
+ */
+import {elementFactory, hoistCmp, uses, XH} from '@xh/hoist/core';
+import {errorMessage as desktopErrorMessage} from '@xh/hoist/dynamics/desktop';
+import {errorMessage as mobileErrorMessage} from '@xh/hoist/dynamics/mobile';
+import {Component, ReactNode} from 'react';
+import {ErrorBoundaryModel} from './ErrorBoundaryModel';
+
+/**
+ * A wrapper component that will catch an otherwise unhandled React lifecycle error from any child
+ * component, preventing such an error from bringing down the entire app. Upon catching an error,
+ * this comp will swap out its children with an `ErrorMessage` component (or other configured
+ * renderer), giving the user the chance to report the exception and optionally try again.
+ *
+ * This wrapper will automatically only catch and handle exceptions that occur during the React
+ * lifecycle, but applications that wish to use this component to display other caught exceptions
+ * may explicitly use it to handle those exceptions.
+ */
+export const [ErrorBoundary, errorBoundary] = hoistCmp.withFactory<ErrorBoundaryModel>({
+    displayName: 'ErrorBoundary',
+    model: uses(ErrorBoundaryModel, {
+        createDefault: true,
+        fromContext: false,
+        publishMode: 'limited'
+    }),
+
+    render({model, ...props}) {
+        let {error, errorRenderer} = model;
+
+        if (!error) return reactErrorBoundary({model, ...props});
+        if (errorRenderer) return errorRenderer(error);
+
+        const cmp = XH.isMobileApp ? mobileErrorMessage : desktopErrorMessage;
+        return cmp({
+            error,
+            title: 'Unexpected error while rendering this component',
+            actionFn: () => model.clear(),
+            detailsFn: () => XH.exceptionHandler.showExceptionDetails(error)
+        });
+    }
+});
+
+//------------------------------------------------------------------
+// Standard recipe from React Docs, requires class based component
+// See https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary
+//------------------------------------------------------------------
+class ReactErrorBoundary extends Component<
+    {children: ReactNode; model: ErrorBoundaryModel},
+    {error: unknown}
+> {
+    override state = {error: null};
+    override render() {
+        return !this.state.error ? this.props.children : null;
+    }
+
+    static getDerivedStateFromError(error: unknown) {
+        return {error};
+    }
+
+    override componentDidCatch(e: unknown) {
+        this.props.model.handleError(e);
+    }
+}
+const reactErrorBoundary = elementFactory(ReactErrorBoundary);

package/cmp/error/ErrorBoundaryModel.ts

@@ -0,0 +1,77 @@
+/*
+ * This file belongs to Hoist, an application development toolkit
+ * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
+ *
+ * Copyright © 2023 Extremely Heavy Industries Inc.
+ */
+import {ExceptionHandlerOptions, HoistModel, XH} from '@xh/hoist/core';
+import {isFunction} from 'lodash';
+import {action, makeObservable, observable} from 'mobx';
+import {ReactNode} from 'react';
+
+export interface ErrorBoundaryConfig {
+    /**
+     * Config for {@link XH.handleException}, or a custom function to handle any error caught by
+     * the boundary. Defaults to `{showAlert: false}`.
+     */
+    errorHandler?: ExceptionHandlerOptions | ((e: unknown) => void);
+
+    /**
+     * Function to render any error caught by the boundary - return will be rendered in lieu of the
+     * component's normal children. Defaults to a platform-appropriate {@link ErrorMessage}.
+     */
+    errorRenderer?: (e: unknown) => ReactNode;
+}
+
+export class ErrorBoundaryModel extends HoistModel {
+    errorHandler: ExceptionHandlerOptions | ((e: unknown) => void);
+    errorRenderer: (e: unknown) => ReactNode;
+
+    /**
+     * Caught error being displayed instead of the content.
+     * Null if content rendering normally.
+     */
+    @observable.ref error: unknown;
+
+    constructor(config?: ErrorBoundaryConfig) {
+        super();
+        makeObservable(this);
+        this.errorHandler = config?.errorHandler ?? {showAlert: false};
+        this.errorRenderer = config?.errorRenderer;
+    }
+
+    /**
+     * Handle the exception and replace the contents of the component with a rendered error.
+     *
+     * This method does not need to be called for React Lifecycle events that occur within its
+     * rendered content - that is handled automatically by the component. It is publicly available
+     * for apps that wish to use this component to handle and display other caught exceptions.
+     *
+     * For exceptions that have already been handled, call {@link showError} instead.
+     */
+    @action
+    handleError(e: unknown) {
+        let handler = this.errorHandler;
+        if (handler) {
+            isFunction(handler) ? handler(e) : XH.handleException(e, handler as any);
+        }
+        this.error = e;
+    }
+
+    /**
+     * Replace the contents of the component with a rendered error.
+     *
+     * Note that unlike {@link handleError} this method will *not* report or take any other action
+     * on the error. It is intended for use with exceptions that have already been handled.
+     */
+    @action
+    showError(e: unknown) {
+        this.error = e;
+    }
+
+    /** Reset this component to clear the current error and attempt to re-render its contents. */
+    @action
+    clear() {
+        this.error = null;
+    }
+}

package/cmp/grid/Grid.scss

@@ -6,6 +6,7 @@
  */
 
 @use 'sass:math';
+@use '../ag-grid/AgGrid';
 
 .xh-grid:not(.xh-data-view) {
   //------------------------
@@ -124,6 +125,15 @@
     }
   }
 
+  // Render left / right group borders
+  .ag-cell.xh-cell--group-border-left {
+    @include AgGrid.group-border(left);
+  }
+
+  .ag-cell.xh-cell--group-border-right {
+    @include AgGrid.group-border(right);
+  }
+
   .xh-ag-grid {
     &--tiny {
       .ag-cell.xh-cell--invalid::before {

package/cmp/grid/GridModel.ts

@@ -8,6 +8,7 @@ import {
     CellClickedEvent,
     CellContextMenuEvent,
     CellDoubleClickedEvent,
+    ColumnEvent,
     RowClickedEvent,
     RowDoubleClickedEvent
 } from '@ag-grid-community/core';
@@ -20,7 +21,8 @@ import {
     GridAutosizeMode,
     GridFilterModelConfig,
     GridGroupSortFn,
-    TreeStyle
+    TreeStyle,
+    ColumnCellClassRuleFn
 } from '@xh/hoist/cmp/grid';
 import {GridFilterModel} from '@xh/hoist/cmp/grid/filter/GridFilterModel';
 import {br, fragment} from '@xh/hoist/cmp/layout';
@@ -63,7 +65,7 @@ import {
     withDefault
 } from '@xh/hoist/utils/js';
 import equal from 'fast-deep-equal';
-import _, {
+import {
     castArray,
     clone,
     cloneDeep,
@@ -72,6 +74,7 @@ import _, {
     defaultsDeep,
     every,
     find,
+    first,
     forEach,
     isArray,
     isEmpty,
@@ -81,6 +84,7 @@ import _, {
     isString,
     isUndefined,
     keysIn,
+    last,
     max,
     min,
     omit,
@@ -1179,6 +1183,10 @@ export class GridModel extends HoistModel {
         return this.findColumn(this.columns, colId);
     }
 
+    getColumnGroup(groupId: string): ColumnGroup {
+        return this.findColumnGroup(this.columns, groupId);
+    }
+
     /** Return all leaf-level columns - i.e. excluding column groups. */
     getLeafColumns(): Column[] {
         return this.gatherLeaves(this.columns);
@@ -1217,6 +1225,22 @@ export class GridModel extends HoistModel {
         this.setColumnVisible(colId, false);
     }
 
+    setColumnGroupVisible(groupId: string, visible: boolean) {
+        this.applyColumnStateChanges(
+            this.getColumnGroup(groupId)
+                .getLeafColumns()
+                .map(({colId}) => ({colId, hidden: !visible}))
+        );
+    }
+
+    showColumnGroup(groupId: string) {
+        this.setColumnGroupVisible(groupId, true);
+    }
+
+    hideColumnGroup(groupId: string) {
+        this.setColumnGroupVisible(groupId, false);
+    }
+
     /**
      * Determine if a leaf-level column is currently pinned.
      *
@@ -1228,7 +1252,7 @@ export class GridModel extends HoistModel {
         return state ? state.pinned : null;
     }
 
-    /** Return matching leaf-level Column object from the provided collection.*/
+    /** Return matching leaf-level Column object from the provided collection. */
     findColumn(cols: Array<Column | ColumnGroup>, colId: string): Column {
         for (let col of cols) {
             if (col instanceof ColumnGroup) {
@@ -1241,6 +1265,18 @@ export class GridModel extends HoistModel {
         return null;
     }
 
+    /** Return matching ColumnGroup from the provided collection. */
+    findColumnGroup(cols: Array<Column | ColumnGroup>, groupId: string): ColumnGroup {
+        for (let col of cols) {
+            if (col instanceof ColumnGroup) {
+                if (col.groupId === groupId) return col;
+                const ret = this.findColumnGroup(col.children, groupId);
+                if (ret) return ret;
+            }
+        }
+        return null;
+    }
+
     /**
      * Return the current state object representation for the given colId.
      *
@@ -1252,30 +1288,6 @@ export class GridModel extends HoistModel {
         return find(this.columnState, {colId});
     }
 
-    buildColumn(config: ColumnGroupSpec | ColumnSpec) {
-        // Merge leaf config with defaults.
-        // Ensure *any* tooltip setting on column itself always wins.
-        if (this.colDefaults && !this.isGroupSpec(config)) {
-            let colDefaults = {...this.colDefaults};
-            if (config.tooltip) colDefaults.tooltip = null;
-            config = defaultsDeep({}, config, colDefaults);
-        }
-
-        const omit = isFunction(config.omit) ? config.omit() : config.omit;
-        if (omit) return null;
-
-        if (this.isGroupSpec(config)) {
-            const children = compact(config.children.map(c => this.buildColumn(c))) as Array<
-                ColumnGroup | Column
-            >;
-            return !isEmpty(children)
-                ? new ColumnGroup(config as ColumnGroupSpec, this, children)
-                : null;
-        }
-
-        return new Column(config, this);
-    }
-
     /**
      * Autosize columns to fit their contents.
      *
@@ -1436,6 +1448,35 @@ export class GridModel extends HoistModel {
     //-----------------------
     // Implementation
     //-----------------------
+    private buildColumn(config: ColumnGroupSpec | ColumnSpec, borderedGroup?: ColumnGroupSpec) {
+        // Merge leaf config with defaults.
+        // Ensure *any* tooltip setting on column itself always wins.
+        if (this.colDefaults && !this.isGroupSpec(config)) {
+            let colDefaults = {...this.colDefaults};
+            if (config.tooltip) colDefaults.tooltip = null;
+            config = defaultsDeep({}, config, colDefaults);
+        }
+
+        const omit = isFunction(config.omit) ? config.omit() : config.omit;
+        if (omit) return null;
+
+        if (this.isGroupSpec(config)) {
+            if (config.borders) borderedGroup = config;
+            const children = compact(
+                config.children.map(c => this.buildColumn(c, borderedGroup))
+            ) as Array<ColumnGroup | Column>;
+            return !isEmpty(children)
+                ? new ColumnGroup(config as ColumnGroupSpec, this, children)
+                : null;
+        }
+
+        if (borderedGroup) {
+            config = this.enhanceConfigWithGroupBorders(config, borderedGroup);
+        }
+
+        return new Column(config, this);
+    }
+
     private async autosizeColsInternalAsync(colIds, options) {
         await this.whenReadyAsync();
         if (!this.isReady) return;
@@ -1543,18 +1584,16 @@ export class GridModel extends HoistModel {
         if (isEmpty(cols)) return;
 
         const ids = this.collectIds(cols);
-        const nonUnique = _(ids)
-            .groupBy()
-            .pickBy(x => x.length > 1)
-            .keys();
-        if (!nonUnique.isEmpty()) {
+        const nonUnique = ids.filter((item, index) => ids.indexOf(item) !== index);
+
+        if (!isEmpty(nonUnique)) {
             const msg =
                 `Non-unique ids: [${nonUnique}] ` +
                 "Use 'ColumnSpec'/'ColumnGroupSpec' configs to resolve a unique ID for each column/group.";
             throw XH.exception(msg);
         }
 
-        const treeCols = cols.filter(it => it.isTreeColumn);
+        const treeCols = this.gatherLeaves(cols).filter(it => it.isTreeColumn);
         warnIf(
             this.treeMode && treeCols.length != 1,
             'Grids in treeMode should include exactly one column with isTreeColumn:true.'
@@ -1752,4 +1791,69 @@ export class GridModel extends HoistModel {
     defaultGroupSortFn = (a, b) => {
         return a < b ? -1 : a > b ? 1 : 0;
     };
+
+    private readonly LEFT_BORDER_CLASS = 'xh-cell--group-border-left';
+    private readonly RIGHT_BORDER_CLASS = 'xh-cell--group-border-right';
+
+    private enhanceConfigWithGroupBorders(config: ColumnSpec, group: ColumnGroupSpec): ColumnSpec {
+        return {
+            ...config,
+            cellClassRules: {
+                ...config.cellClassRules,
+                [this.LEFT_BORDER_CLASS]: this.createGroupBorderFn('left', group),
+                [this.RIGHT_BORDER_CLASS]: this.createGroupBorderFn('right', group)
+            }
+        };
+    }
+
+    private createGroupBorderFn(
+        side: 'left' | 'right',
+        group: ColumnGroupSpec
+    ): ColumnCellClassRuleFn {
+        return ({api, column, columnApi, ...ctx}) => {
+            if (!api || !column || !columnApi) return false;
+
+            // Re-evaluate cell class rules when column is re-ordered
+            // See https://www.ag-grid.com/javascript-data-grid/column-object/#reference-events
+            if (!column['xhAppliedGroupBorderListener']) {
+                column['xhAppliedGroupBorderListener'] = true;
+                column.addEventListener('leftChanged', ({api, columns, source}: ColumnEvent) => {
+                    if (source === 'uiColumnMoved') api.refreshCells({columns});
+                });
+            }
+
+            // Don't render a left-border if col is first or if prev col already has right-border
+            if (side === 'left') {
+                const prevCol = columnApi.getDisplayedColBefore(column);
+
+                if (!prevCol) return false;
+
+                const prevColDef = prevCol.getColDef(),
+                    prevRule = prevColDef.cellClassRules[this.RIGHT_BORDER_CLASS];
+                if (
+                    isFunction(prevRule) &&
+                    prevRule({
+                        ...ctx,
+                        api,
+                        colDef: prevColDef,
+                        column: prevCol,
+                        columnApi
+                    })
+                ) {
+                    return false;
+                }
+            }
+
+            // Walk up parent groups to find "bordered" group. Return true if on relevant edge.
+            const getter = side === 'left' ? first : last;
+            for (let parent = column?.getParent(); parent; parent = parent.getParent()) {
+                if (
+                    group.groupId === parent.getGroupId() &&
+                    getter(parent.getDisplayedLeafColumns()) === column
+                ) {
+                    return true;
+                }
+            }
+        };
+    }
 }

package/cmp/grid/columns/ColumnGroup.ts

@@ -26,6 +26,8 @@ export interface ColumnGroupSpec {
     headerClass?: Some<string> | ColumnHeaderClassFn;
     /** Horizontal alignment of header contents. */
     headerAlign?: HAlign;
+    /** True to render borders on column group edges. */
+    borders?: boolean;
 
     /**
      * "Escape hatch" object to pass directly to Ag-Grid for desktop implementations. Note
@@ -50,6 +52,7 @@ export class ColumnGroup {
     readonly headerName: ReactNode | ColumnHeaderNameFn;
     readonly headerClass: Some<string> | ColumnHeaderClassFn;
     readonly headerAlign: HAlign;
+    readonly borders: boolean;
 
     /**
      * "Escape hatch" object to pass directly to Ag-Grid for desktop implementations. Note
@@ -79,6 +82,7 @@ export class ColumnGroup {
             headerClass,
             headerAlign,
             agOptions,
+            borders,
             ...rest
         } = config;
 
@@ -94,6 +98,7 @@ export class ColumnGroup {
         this.headerName = withDefault(headerName, genDisplayName(this.groupId));
         this.headerClass = headerClass;
         this.headerAlign = headerAlign;
+        this.borders = withDefault(borders, true);
         this.children = children;
         this.gridModel = gridModel;
         this.agOptions = agOptions ? clone(agOptions) : {};
@@ -119,4 +124,10 @@ export class ColumnGroup {
             ...this.agOptions
         };
     }
+
+    getLeafColumns(): Column[] {
+        return this.children.flatMap(child =>
+            child instanceof Column ? child : child.getLeafColumns()
+        );
+    }
 }

package/cmp/markdown/Markdown.ts

@@ -0,0 +1,32 @@
+/*
+ * This file belongs to Hoist, an application development toolkit
+ * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
+ *
+ * Copyright © 2023 Extremely Heavy Industries Inc.
+ */
+import {hoistCmp, HoistProps} from '@xh/hoist/core';
+import {reactMarkdown} from '@xh/hoist/kit/react-markdown';
+import remarkBreaks from 'remark-breaks';
+
+interface MarkdownProps extends HoistProps {
+    /**
+     * Markdown formatted string to render.
+     */
+    content: string;
+
+    /** True (default) to render new lines with <br/> tags. */
+    lineBreaks?: boolean;
+}
+
+/**
+ * Render Markdown formatted strings as HTML (e.g. **foo** becomes <strong>foo</strong>).
+ */
+export const [Markdown, markdown] = hoistCmp.withFactory<MarkdownProps>({
+    displayName: 'Markdown',
+    render({content, lineBreaks = true}) {
+        return reactMarkdown({
+            item: content,
+            remarkPlugins: lineBreaks ? [remarkBreaks] : null
+        });
+    }
+});

package/cmp/markdown/index.ts

@@ -0,0 +1 @@
+export * from './Markdown';