@ni/nimble-components 20.14.7 → 20.14.9

package/dist/esm/number-field/index.js

@@ -55,6 +55,7 @@ const nimbleNumberField = NumberField.compose({
             appearance="ghost"
             content-hidden
             tabindex="-1"
+            aria-hidden="true"
         >
             ${x => numericDecrementLabel.getValueFor(x)}
             <${iconMinusWideTag}
@@ -69,6 +70,7 @@ const nimbleNumberField = NumberField.compose({
             appearance="ghost"
             content-hidden
             tabindex="-1"
+            aria-hidden="true"
         >
             ${x => numericIncrementLabel.getValueFor(x)}
             <${iconAddTag}

package/dist/esm/number-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/number-field/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EACH,YAAY,EACZ,WAAW,IAAI,qBAAqB,EAEpC,mBAAmB,IAAI,QAAQ,EAClC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAE/D,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AACnE,OAAO,EACH,qBAAqB,EACrB,qBAAqB,EACxB,MAAM,qCAAqC,CAAC;AAQ7C;;GAEG;AACH,MAAM,OAAO,WAAY,SAAQ,qBAAqB;IAAtD;;QAEW,eAAU,GAA0B,qBAAqB,CAAC,SAAS,CAAC;QAapE,iBAAY,GAAG,KAAK,CAAC;IAQhC,CAAC;IANmB,iBAAiB;QAC7B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,qFAAqF;QACrF,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;IACpD,CAAC;CACJ;AArBG;IADC,IAAI;+CACsE;AAU3E;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;8CACR;AAG1B;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;iDAC1B;AAUhC;;;;;;;GAOG;AACH,MAAM,iBAAiB,GAAG,WAAW,CAAC,OAAO,CAAqB;IAC9D,QAAQ,EAAE,cAAc;IACxB,SAAS,EAAE,qBAAqB;IAChC,QAAQ;IACR,MAAM;IACN,aAAa,EAAE;QACX,cAAc,EAAE,IAAI;KACvB;IACD,aAAa,EAAE,IAAI,CAAa;WACzB,SAAS;;;;;;cAMN,CAAC,CAAC,EAAE,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;eACxC,gBAAgB;;;gBAGf,gBAAgB;YACpB,SAAS;KAChB;IACD,WAAW,EAAE,IAAI,CAAa;WACvB,SAAS;;;;;;cAMN,CAAC,CAAC,EAAE,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;eACxC,UAAU;;gBAET,UAAU;YACd,SAAS;KAChB;IACD,GAAG,EAAE,IAAI,CAAa;WACf,sBAAsB;;;aAGpB,sBAAsB;UACzB,iBAAiB;KACtB;CACJ,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAC9E,MAAM,CAAC,MAAM,cAAc,GAAG,YAAY,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/number-field/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EACH,YAAY,EACZ,WAAW,IAAI,qBAAqB,EAEpC,mBAAmB,IAAI,QAAQ,EAClC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAE/D,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AACnE,OAAO,EACH,qBAAqB,EACrB,qBAAqB,EACxB,MAAM,qCAAqC,CAAC;AAQ7C;;GAEG;AACH,MAAM,OAAO,WAAY,SAAQ,qBAAqB;IAAtD;;QAEW,eAAU,GAA0B,qBAAqB,CAAC,SAAS,CAAC;QAapE,iBAAY,GAAG,KAAK,CAAC;IAQhC,CAAC;IANmB,iBAAiB;QAC7B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,qFAAqF;QACrF,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;IACpD,CAAC;CACJ;AArBG;IADC,IAAI;+CACsE;AAU3E;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;8CACR;AAG1B;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;iDAC1B;AAUhC;;;;;;;GAOG;AACH,MAAM,iBAAiB,GAAG,WAAW,CAAC,OAAO,CAAqB;IAC9D,QAAQ,EAAE,cAAc;IACxB,SAAS,EAAE,qBAAqB;IAChC,QAAQ;IACR,MAAM;IACN,aAAa,EAAE;QACX,cAAc,EAAE,IAAI;KACvB;IACD,aAAa,EAAE,IAAI,CAAa;WACzB,SAAS;;;;;;;cAON,CAAC,CAAC,EAAE,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;eACxC,gBAAgB;;;gBAGf,gBAAgB;YACpB,SAAS;KAChB;IACD,WAAW,EAAE,IAAI,CAAa;WACvB,SAAS;;;;;;;cAON,CAAC,CAAC,EAAE,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;eACxC,UAAU;;gBAET,UAAU;YACd,SAAS;KAChB;IACD,GAAG,EAAE,IAAI,CAAa;WACf,sBAAsB;;;aAGpB,sBAAsB;UACzB,iBAAiB;KACtB;CACJ,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAC9E,MAAM,CAAC,MAAM,cAAc,GAAG,YAAY,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC"}

package/dist/esm/rich-text/models/markdown-parser-mention-configuration.d.ts

@@ -0,0 +1,15 @@
+import type { RichTextMentionConfig } from '../../rich-text-mention/base';
+import type { MentionInternals } from '../../rich-text-mention/base/models/mention-internals';
+/**
+ * A configuration object for a Markdown parser, to be used by the viewer and editor components.
+ * This object maintains the necessary internal values for handling mentions within the Markdown parser.
+ */
+export declare class MarkdownParserMentionConfiguration {
+    readonly viewElement: string;
+    private readonly regexPattern;
+    private readonly mappingConfigs?;
+    constructor(mentionInternals: MentionInternals<RichTextMentionConfig>);
+    isValidMentionHref(mentionHref: string): boolean;
+    getDisplayName(mentionHref: string): string | undefined;
+    private extractMentionId;
+}

package/dist/esm/rich-text/models/markdown-parser-mention-configuration.js

@@ -0,0 +1,26 @@
+/**
+ * A configuration object for a Markdown parser, to be used by the viewer and editor components.
+ * This object maintains the necessary internal values for handling mentions within the Markdown parser.
+ */
+export class MarkdownParserMentionConfiguration {
+    constructor(mentionInternals) {
+        this.regexPattern = new RegExp(mentionInternals.pattern ?? '');
+        this.mappingConfigs = mentionInternals.mentionConfig?.mappingConfigs;
+        this.viewElement = mentionInternals.viewElement;
+    }
+    isValidMentionHref(mentionHref) {
+        return this.regexPattern.test(mentionHref);
+    }
+    getDisplayName(mentionHref) {
+        const mentionMapping = this.mappingConfigs?.get(mentionHref);
+        const mentionId = this.extractMentionId(mentionHref);
+        return mentionMapping?.displayName ?? mentionId;
+    }
+    extractMentionId(mentionHref) {
+        const regexpArray = this.regexPattern.exec(mentionHref);
+        // Matches and gets the first group specified in the regex pattern
+        // that renders as an alternative to the display name if missing.
+        return regexpArray?.[1] ?? undefined;
+    }
+}
+//# sourceMappingURL=markdown-parser-mention-configuration.js.map

package/dist/esm/rich-text/models/markdown-parser-mention-configuration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown-parser-mention-configuration.js","sourceRoot":"","sources":["../../../../src/rich-text/models/markdown-parser-mention-configuration.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,MAAM,OAAO,kCAAkC;IAM3C,YACI,gBAAyD;QAEzD,IAAI,CAAC,YAAY,GAAG,IAAI,MAAM,CAAC,gBAAgB,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC;QAC/D,IAAI,CAAC,cAAc,GAAG,gBAAgB,CAAC,aAAa,EAAE,cAAc,CAAC;QACrE,IAAI,CAAC,WAAW,GAAG,gBAAgB,CAAC,WAAW,CAAC;IACpD,CAAC;IAEM,kBAAkB,CAAC,WAAmB;QACzC,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IAC/C,CAAC;IAEM,cAAc,CAAC,WAAmB;QACrC,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;QAC7D,MAAM,SAAS,GAAG,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC;QACrD,OAAO,cAAc,EAAE,WAAW,IAAI,SAAS,CAAC;IACpD,CAAC;IAEO,gBAAgB,CAAC,WAAmB;QACxC,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAExD,kEAAkE;QAClE,iEAAiE;QACjE,OAAO,WAAW,EAAE,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC;IACzC,CAAC;CACJ"}

package/dist/esm/rich-text/models/markdown-parser.d.ts

@@ -1,3 +1,4 @@
+import type { MarkdownParserMentionConfiguration } from './markdown-parser-mention-configuration';
 /**
  * Provides markdown parser for rich text components
  */
@@ -5,12 +6,18 @@ export declare class RichTextMarkdownParser {
     private static readonly updatedSchema;
     private static readonly markdownParser;
     private static readonly domSerializer;
+    /**
+     * The markdown parser is static (shared across all rich text components) because it is expensive to create.
+     * To configure parse calls with the mention configurations which can be unique per component instance
+     * we store static configuration in this member and access it from Prosemirror callbacks.
+     */
+    private static mentionConfigs?;
     /**
      * This function takes a markdown string, parses it using the ProseMirror MarkdownParser, serializes the parsed content into a
      * DOM structure using a DOMSerializer, and returns the serialized result.
      * If the markdown parser returns null, it will clear the viewer component by creating an empty document fragment.
      */
-    static parseMarkdownToDOM(value: string): HTMLElement | DocumentFragment;
+    static parseMarkdownToDOM(value: string, markdownParserMentionConfig?: MarkdownParserMentionConfiguration[]): HTMLElement | DocumentFragment;
     private static initializeMarkdownParser;
-    private static getSchemaWithLinkConfiguration;
+    private static getCustomSchemaConfiguration;
 }

package/dist/esm/rich-text/models/markdown-parser.js

@@ -11,12 +11,18 @@ export class RichTextMarkdownParser {
      * DOM structure using a DOMSerializer, and returns the serialized result.
      * If the markdown parser returns null, it will clear the viewer component by creating an empty document fragment.
      */
-    static parseMarkdownToDOM(value) {
-        const parsedMarkdownContent = this.markdownParser.parse(value);
-        if (parsedMarkdownContent === null) {
-            return document.createDocumentFragment();
+    static parseMarkdownToDOM(value, markdownParserMentionConfig) {
+        try {
+            this.mentionConfigs = markdownParserMentionConfig;
+            const parsedMarkdownContent = this.markdownParser.parse(value);
+            if (parsedMarkdownContent === null) {
+                return document.createDocumentFragment();
+            }
+            return this.domSerializer.serializeFragment(parsedMarkdownContent.content);
+        }
+        finally {
+            this.mentionConfigs = undefined;
         }
-        return this.domSerializer.serializeFragment(parsedMarkdownContent.content);
     }
     static initializeMarkdownParser() {
         /**
@@ -35,7 +41,6 @@ export class RichTextMarkdownParser {
             'autolink',
             'newline'
         ]);
-        supportedTokenizerRules.validateLink = href => /^https?:\/\//i.test(href);
         /**
          * In order to display encoded characters, non-ASCII characters, emojis, and other special characters in their original form,
          * we bypass the default normalization of link text in markdown-it. This is done because we support only "AutoLink" feature in CommonMark flavor.
@@ -47,7 +52,7 @@ export class RichTextMarkdownParser {
         supportedTokenizerRules.normalizeLinkText = url => url;
         return new MarkdownParser(this.updatedSchema, supportedTokenizerRules, defaultMarkdownParser.tokens);
     }
-    static getSchemaWithLinkConfiguration() {
+    static getCustomSchemaConfiguration() {
         return new Schema({
             nodes: schema.spec.nodes,
             marks: {
@@ -63,10 +68,30 @@ export class RichTextMarkdownParser {
                     // See: https://github.com/ni/nimble/issues/1527
                     excludes: '_',
                     toDOM(node) {
+                        const href = node.attrs.href;
+                        const currentMention = RichTextMarkdownParser.mentionConfigs?.find(mention => mention.isValidMentionHref(href));
+                        const displayName = currentMention?.getDisplayName(href);
+                        if (currentMention && displayName) {
+                            return [
+                                currentMention.viewElement,
+                                {
+                                    'mention-href': href,
+                                    'mention-label': displayName,
+                                    'disable-editing': true
+                                }
+                            ];
+                        }
                         return [
                             anchorTag,
                             {
-                                href: node.attrs.href,
+                                /**
+                                 * Both mention and absolute link markdown share the autolink format in CommonMark flavor.
+                                 * Absolute links with HTTP/HTTPS will be rendered as links. Absolute links that match the
+                                 * mention pattern will be rendered as mention view element. Absolute links without HTTP/HTTPS
+                                 * scheme and no matching mention pattern will be rendered as plain text (anchor with no href).
+                                 * With this, the user can click the links only when the scheme is HTTP/HTTPS
+                                 */
+                                href: /^https?:\/\//i.test(href) ? href : null,
                                 rel: node.attrs.rel
                             }
                         ];
@@ -79,7 +104,7 @@ export class RichTextMarkdownParser {
     }
 }
 _a = RichTextMarkdownParser;
-RichTextMarkdownParser.updatedSchema = _a.getSchemaWithLinkConfiguration();
+RichTextMarkdownParser.updatedSchema = _a.getCustomSchemaConfiguration();
 RichTextMarkdownParser.markdownParser = _a.initializeMarkdownParser();
 RichTextMarkdownParser.domSerializer = DOMSerializer.fromSchema(_a.updatedSchema);
 //# sourceMappingURL=markdown-parser.js.map

package/dist/esm/rich-text/models/markdown-parser.js.map

@@ -1 +1 @@
-{"version":3,"file":"markdown-parser.js","sourceRoot":"","sources":["../../../../src/rich-text/models/markdown-parser.ts"],"names":[],"mappings":";AAAA,OAAO,EACH,MAAM,EACN,qBAAqB,EACrB,cAAc,EACjB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC;;GAEG;AACH,MAAM,OAAO,sBAAsB;IAQ/B;;;;OAIG;IACI,MAAM,CAAC,kBAAkB,CAC5B,KAAa;QAEb,MAAM,qBAAqB,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC/D,IAAI,qBAAqB,KAAK,IAAI,EAAE;YAChC,OAAO,QAAQ,CAAC,sBAAsB,EAAE,CAAC;SAC5C;QACD,OAAO,IAAI,CAAC,aAAa,CAAC,iBAAiB,CACvC,qBAAqB,CAAC,OAAO,CAChC,CAAC;IACN,CAAC;IAEO,MAAM,CAAC,wBAAwB;QACnC;;;;;WAKG;QACH,MAAM,0BAA0B,GAAG,qBAAqB,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;QAErF,uGAAuG;QACvG,oCAAoC;QACpC,MAAM,uBAAuB,GAAG,0BAA0B,CAAC,MAAM,CAAC;YAC9D,UAAU;YACV,MAAM;YACN,QAAQ;YACR,UAAU;YACV,SAAS;SACZ,CAAC,CAAC;QAEH,uBAAuB,CAAC,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAE1E;;;;;;;WAOG;QACH,uBAAuB,CAAC,iBAAiB,GAAG,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC;QAEvD,OAAO,IAAI,cAAc,CACrB,IAAI,CAAC,aAAa,EAClB,uBAAuB,EACvB,qBAAqB,CAAC,MAAM,CAC/B,CAAC;IACN,CAAC;IAEO,MAAM,CAAC,8BAA8B;QACzC,OAAO,IAAI,MAAM,CAAC;YACd,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK;YACxB,KAAK,EAAE;gBACH,IAAI,EAAE;oBACF,KAAK,EAAE;wBACH,IAAI,EAAE,EAAE;wBACR,GAAG,EAAE,EAAE,OAAO,EAAE,qBAAqB,EAAE;qBAC1C;oBACD,wDAAwD;oBACxD,gDAAgD;oBAChD,SAAS,EAAE,KAAK;oBAChB,+DAA+D;oBAC/D,gDAAgD;oBAChD,QAAQ,EAAE,GAAG;oBACb,KAAK,CAAC,IAAI;wBACN,OAAO;4BACH,SAAS;4BACT;gCACI,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAY;gCAC7B,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAW;6BAC9B;yBACJ,CAAC;oBACN,CAAC;iBACJ;gBACD,EAAE,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAE;gBAChC,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAE;aAC3C;SACJ,CAAC,CAAC;IACP,CAAC;;;AA3FuB,oCAAa,GAAG,EAAI,CAAC,8BAA8B,EAAE,CAAC;AAEtD,qCAAc,GAAG,EAAI,CAAC,wBAAwB,EAAE,CAAC;AACjD,oCAAa,GAAG,aAAa,CAAC,UAAU,CAC5D,EAAI,CAAC,aAAa,CACrB,CAAC"}
+{"version":3,"file":"markdown-parser.js","sourceRoot":"","sources":["../../../../src/rich-text/models/markdown-parser.ts"],"names":[],"mappings":"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"}

package/dist/esm/rich-text/models/testing/markdown-parser-utils.d.ts

@@ -1,4 +1,5 @@
 export declare const getTagsFromElement: (doc: DocumentFragment | HTMLElement) => string[];
 export declare const getLeafContentsFromElement: (doc: DocumentFragment | HTMLElement) => string[];
 export declare const getLastChildElementAttribute: (attribute: string, doc: DocumentFragment | HTMLElement) => string;
+export declare const lastChildElementHasAttribute: (attribute: string, doc: DocumentFragment | HTMLElement) => boolean;
 export declare function getLastChildElement(doc: DocumentFragment | HTMLElement): Element | null | undefined;

package/dist/esm/rich-text/models/testing/markdown-parser-utils.js

@@ -13,6 +13,9 @@ export const getLeafContentsFromElement = (doc) => {
 export const getLastChildElementAttribute = (attribute, doc) => {
     return getLastChildElement(doc)?.getAttribute(attribute) ?? '';
 };
+export const lastChildElementHasAttribute = (attribute, doc) => {
+    return getLastChildElement(doc)?.hasAttribute(attribute) ?? false;
+};
 export function getLastChildElement(doc) {
     let lastElement = doc.lastElementChild;
     while (lastElement?.lastElementChild) {

package/dist/esm/rich-text/models/testing/markdown-parser-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"markdown-parser-utils.js","sourceRoot":"","sources":["../../../../../src/rich-text/models/testing/markdown-parser-utils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAC9B,GAAmC,EAC3B,EAAE;IACV,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;IAC1E,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,CACtC,GAAmC,EAC3B,EAAE;IACV,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;SAC9C,MAAM,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE;QACd,OAAO,EAAE,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;IACpC,CAAC,CAAC;SACD,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC;IACrC,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,4BAA4B,GAAG,CACxC,SAAiB,EACjB,GAAmC,EAC7B,EAAE;IACR,OAAO,mBAAmB,CAAC,GAAG,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;AACnE,CAAC,CAAC;AAEF,MAAM,UAAU,mBAAmB,CAC/B,GAAmC;IAEnC,IAAI,WAAW,GAAG,GAAG,CAAC,gBAAgB,CAAC;IAEvC,OAAO,WAAW,EAAE,gBAAgB,EAAE;QAClC,WAAW,GAAG,WAAW,CAAC,gBAAgB,CAAC;KAC9C;IACD,OAAO,WAAW,CAAC;AACvB,CAAC"}
+{"version":3,"file":"markdown-parser-utils.js","sourceRoot":"","sources":["../../../../../src/rich-text/models/testing/markdown-parser-utils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAC9B,GAAmC,EAC3B,EAAE;IACV,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;IAC1E,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,CACtC,GAAmC,EAC3B,EAAE;IACV,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;SAC9C,MAAM,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE;QACd,OAAO,EAAE,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;IACpC,CAAC,CAAC;SACD,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC;IACrC,OAAO,KAAK,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,4BAA4B,GAAG,CACxC,SAAiB,EACjB,GAAmC,EAC7B,EAAE;IACR,OAAO,mBAAmB,CAAC,GAAG,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;AACnE,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,4BAA4B,GAAG,CACxC,SAAiB,EACjB,GAAmC,EAC5B,EAAE;IACT,OAAO,mBAAmB,CAAC,GAAG,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,IAAI,KAAK,CAAC;AACtE,CAAC,CAAC;AAEF,MAAM,UAAU,mBAAmB,CAC/B,GAAmC;IAEnC,IAAI,WAAW,GAAG,GAAG,CAAC,gBAAgB,CAAC;IAEvC,OAAO,WAAW,EAAE,gBAAgB,EAAE;QAClC,WAAW,GAAG,WAAW,CAAC,gBAAgB,CAAC;KAC9C;IACD,OAAO,WAAW,CAAC;AACvB,CAAC"}

package/dist/esm/rich-text/viewer/index.d.ts

@@ -1,4 +1,6 @@
 import { FoundationElement } from '@microsoft/fast-foundation';
+import { RichTextMention } from '../../rich-text-mention/base';
+import { MarkdownParserMentionConfiguration } from '../models/markdown-parser-mention-configuration';
 declare global {
     interface HTMLElementTagNameMap {
         'nimble-rich-text-viewer': RichTextViewer;
@@ -18,6 +20,19 @@ export declare class RichTextViewer extends FoundationElement {
      * @internal
      */
     viewer: HTMLDivElement;
+    /**
+     * @internal
+     */
+    mentionElements: RichTextMention[];
+    /**
+     * @internal
+     */
+    mentionInternalsConfig: MarkdownParserMentionConfiguration[];
+    /**
+     * @internal
+     */
+    readonly childItems: Element[];
+    private mentionInternalsNotifiers;
     /**
      * @internal
      */
@@ -26,6 +41,15 @@ export declare class RichTextViewer extends FoundationElement {
      * @internal
      */
     markdownChanged(): void;
+    /**
+     * @internal
+     */
+    handleChange(source: unknown, args: unknown): void;
+    private childItemsChanged;
+    private updateMentionsFromChildItems;
+    private observeMentions;
+    private removeMentionObservers;
+    private updateMentionInternalsConfig;
     private updateView;
 }
 export declare const richTextViewerTag: string;

package/dist/esm/rich-text/viewer/index.js

@@ -1,9 +1,12 @@
 import { __decorate } from "tslib";
 import { DesignSystem, FoundationElement } from '@microsoft/fast-foundation';
-import { observable } from '@microsoft/fast-element';
+import { Observable, observable } from '@microsoft/fast-element';
 import { template } from './template';
 import { styles } from './styles';
 import { RichTextMarkdownParser } from '../models/markdown-parser';
+import { RichTextMention } from '../../rich-text-mention/base';
+import { MentionInternals } from '../../rich-text-mention/base/models/mention-internals';
+import { MarkdownParserMentionConfiguration } from '../models/markdown-parser-mention-configuration';
 /**
  * A nimble styled rich text viewer
  */
@@ -16,6 +19,19 @@ export class RichTextViewer extends FoundationElement {
          * Markdown string to render its corresponding rich text content in the component.
          */
         this.markdown = '';
+        /**
+         * @internal
+         */
+        this.mentionElements = [];
+        /**
+         * @internal
+         */
+        this.mentionInternalsConfig = [];
+        /**
+         * @internal
+         */
+        this.childItems = [];
+        this.mentionInternalsNotifiers = [];
     }
     /**
      * @internal
@@ -28,13 +44,56 @@ export class RichTextViewer extends FoundationElement {
      * @internal
      */
     markdownChanged() {
-        if (this.$fastController.isConnected) {
-            this.updateView();
+        this.updateView();
+    }
+    /**
+     * @internal
+     */
+    handleChange(source, args) {
+        if (source instanceof MentionInternals && typeof args === 'string') {
+            this.updateMentionInternalsConfig();
         }
     }
+    childItemsChanged() {
+        void this.updateMentionsFromChildItems();
+    }
+    async updateMentionsFromChildItems() {
+        const definedElements = this.childItems.map(async (item) => (item.matches(':not(:defined)')
+            ? customElements.whenDefined(item.localName)
+            : Promise.resolve()));
+        await Promise.all(definedElements);
+        this.mentionElements = this.childItems.filter((x) => x instanceof RichTextMention);
+        this.observeMentions();
+        this.updateMentionInternalsConfig();
+    }
+    observeMentions() {
+        this.removeMentionObservers();
+        for (const mention of this.mentionElements) {
+            const notifierInternals = Observable.getNotifier(mention.mentionInternals);
+            notifierInternals.subscribe(this);
+            this.mentionInternalsNotifiers.push(notifierInternals);
+        }
+    }
+    removeMentionObservers() {
+        this.mentionInternalsNotifiers.forEach(notifier => {
+            notifier.unsubscribe(this);
+        });
+        this.mentionInternalsNotifiers = [];
+    }
+    updateMentionInternalsConfig() {
+        // TODO: Add a rich text validator to check if the `mentionElements` contains duplicate configuration element
+        // For example, having two `nimble-rich-text-mention-users` within the children of rich text viewer or editor is an invalid configuration
+        this.mentionInternalsConfig = this.mentionElements
+            .filter(mention => mention.mentionInternals.validConfiguration)
+            .map(mention => new MarkdownParserMentionConfiguration(mention.mentionInternals));
+        this.updateView();
+    }
     updateView() {
+        if (!this.$fastController.isConnected) {
+            return;
+        }
         if (this.markdown) {
-            const serializedContent = RichTextMarkdownParser.parseMarkdownToDOM(this.markdown);
+            const serializedContent = RichTextMarkdownParser.parseMarkdownToDOM(this.markdown, this.mentionInternalsConfig);
             this.viewer.replaceChildren(serializedContent);
         }
         else {
@@ -45,6 +104,9 @@ export class RichTextViewer extends FoundationElement {
 __decorate([
     observable
 ], RichTextViewer.prototype, "markdown", void 0);
+__decorate([
+    observable
+], RichTextViewer.prototype, "childItems", void 0);
 const nimbleRichTextViewer = RichTextViewer.compose({
     baseName: 'rich-text-viewer',
     template,

package/dist/esm/rich-text/viewer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/rich-text/viewer/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAQnE;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,iBAAiB;IAArD;;QACI;;;;WAIG;QAEI,aAAQ,GAAG,EAAE,CAAC;IAkCzB,CAAC;IA3BG;;OAEG;IACa,iBAAiB;QAC7B,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,UAAU,EAAE,CAAC;IACtB,CAAC;IAED;;OAEG;IACI,eAAe;QAClB,IAAI,IAAI,CAAC,eAAe,CAAC,WAAW,EAAE;YAClC,IAAI,CAAC,UAAU,EAAE,CAAC;SACrB;IACL,CAAC;IAEO,UAAU;QACd,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,MAAM,iBAAiB,GAAG,sBAAsB,CAAC,kBAAkB,CAC/D,IAAI,CAAC,QAAQ,CAChB,CAAC;YACF,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,iBAAiB,CAAC,CAAC;SAClD;aAAM;YACH,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,EAAE,CAAC;SAC9B;IACL,CAAC;CACJ;AAlCG;IADC,UAAU;gDACU;AAoCzB,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,CAAC;IAChD,QAAQ,EAAE,kBAAkB;IAC5B,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE;KACrB,UAAU,CAAC,QAAQ,CAAC;KACpB,QAAQ,CAAC,oBAAoB,EAAE,CAAC,CAAC;AACtC,MAAM,CAAC,MAAM,iBAAiB,GAAG,YAAY,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/rich-text/viewer/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/rich-text/viewer/styles.js

@@ -1,6 +1,6 @@
 import { css } from '@microsoft/fast-element';
 import { display } from '@microsoft/fast-foundation';
-import { bodyFont, bodyFontColor } from '../../theme-provider/design-tokens';
+import { bodyFont, bodyFontColor, linkFontColor } from '../../theme-provider/design-tokens';
 export const styles = css `
     ${display('flex')}
 
@@ -39,5 +39,18 @@ export const styles = css `
     li > p:empty {
         display: none;
     }
+
+    ${
+/**
+ * When an absolute link is not HTTPS/HTTP, the anchor tag renders without an `href`, appearing as plain text.
+ * However, the `nimble-anchor` displays differently in color when the `href` attribute is absent.
+ * To ensure a consistent appearance, the font color is forced to the default link color regardless of the `href`
+ * attribute's presence.
+ *
+ * See models/markdown-parser.ts where link elements are emitted for more info.
+ */ ''}
+    nimble-anchor::part(control) {
+        color: ${linkFontColor};
+    }
 `;
 //# sourceMappingURL=styles.js.map

package/dist/esm/rich-text/viewer/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/rich-text/viewer/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAE7E,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;;;gBAGL,QAAQ;;iBAEP,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;MA2BxB;AACE,gLAAgL,CAAC,EACrL;;;;CAIH,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/rich-text/viewer/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,QAAQ,EACR,aAAa,EACb,aAAa,EAChB,MAAM,oCAAoC,CAAC;AAE5C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;;;gBAGL,QAAQ;;iBAEP,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;MA2BxB;AACE,gLAAgL,CAAC,EACrL;;;;;MAKE;AACE;;;;;;;GAOG,CAAC,EACR;;iBAEa,aAAa;;CAE7B,CAAC"}

package/dist/esm/rich-text/viewer/template.js

@@ -1,5 +1,7 @@
-import { html, ref } from '@microsoft/fast-element';
+import { children, elements, html, ref } from '@microsoft/fast-element';
 export const template = html `
-    <div ${ref('viewer')} class="viewer"></div>
+    <template ${children({ property: 'childItems', filter: elements() })}>
+        <div ${ref('viewer')} class="viewer"></div>
+    </template>
 `;
 //# sourceMappingURL=template.js.map

package/dist/esm/rich-text/viewer/template.js.map

@@ -1 +1 @@
-{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../src/rich-text/viewer/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAGpD,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAgB;WACjC,GAAG,CAAC,QAAQ,CAAC;CACvB,CAAC"}
+{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../src/rich-text/viewer/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAGxE,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAgB;gBAC5B,QAAQ,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,CAAC;eACzD,GAAG,CAAC,QAAQ,CAAC;;CAE3B,CAAC"}

package/dist/esm/rich-text/viewer/testing/rich-text-viewer.pageobject.d.ts

@@ -21,6 +21,7 @@ export declare class RichTextViewerPageObject {
      * @returns An array of text contents of last elements in a tree
      */
     getRenderedMarkdownLeafContents(): string[];
+    getRenderedMarkdownAttributeValues(attribute: string): string[];
     private getMarkdownRenderedElement;
     private getLastChildMarkdownRenderedElement;
 }

package/dist/esm/rich-text/viewer/testing/rich-text-viewer.pageobject.js

@@ -43,11 +43,14 @@ export class RichTextViewerPageObject {
      */
     getRenderedMarkdownLeafContents() {
         return Array.from(this.getMarkdownRenderedElement().querySelectorAll('*'))
-            .filter((el, _) => {
-            return el.children.length === 0;
-        })
+            .filter((el, _) => el.children.length === 0)
             .map(el => el.textContent || '');
     }
+    getRenderedMarkdownAttributeValues(attribute) {
+        return Array.from(this.getMarkdownRenderedElement().querySelectorAll('*'))
+            .filter((el, _) => el.children.length === 0)
+            .map(el => el.getAttribute(attribute) || '');
+    }
     getMarkdownRenderedElement() {
         return this.richTextViewerElement.shadowRoot?.querySelector('.viewer');
     }

package/dist/esm/rich-text/viewer/testing/rich-text-viewer.pageobject.js.map

@@ -1 +1 @@
-{"version":3,"file":"rich-text-viewer.pageobject.js","sourceRoot":"","sources":["../../../../../src/rich-text/viewer/testing/rich-text-viewer.pageobject.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,OAAO,wBAAwB;IACjC,YACqB,qBAAqC;QAArC,0BAAqB,GAArB,qBAAqB,CAAgB;IACvD,CAAC;IAEG,oCAAoC;QACvC,OAAO,IAAI,CAAC,mCAAmC,EAAE,EAAE,WAAW,IAAI,EAAE,CAAC;IACzE,CAAC;IAEM,qCAAqC,CAAC,SAAiB;QAC1D,OAAO,CACH,IAAI,CAAC,mCAAmC,EAAE,EAAE,YAAY,CACpD,SAAS,CACZ,IAAI,EAAE,CACV,CAAC;IACN,CAAC;IAED;;;OAGG;IACI,2BAA2B;QAC9B,OAAO,KAAK,CAAC,IAAI,CACb,IAAI,CAAC,0BAA0B,EAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAC3D,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;IAC5B,CAAC;IAED;;OAEG;IACI,0CAA0C;QAC7C,MAAM,QAAQ,GAAa,EAAE,CAAC;QAC9B,MAAM,eAAe,GAAG,IAAI,CAAC,0BAA0B,EAAE,CAAC;QAE1D,MAAM,WAAW,GAAG,CAAC,IAAU,EAAQ,EAAE;YACrC,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE;gBACrC,MAAM,EAAE,GAAG,IAAe,CAAC;gBAC3B,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;gBAE1B,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;gBAEnC,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC;aACnC;QACL,CAAC,CAAC;QAEF,IAAI,eAAe,EAAE;YACjB,WAAW,CAAC,eAAe,CAAC,CAAC;SAChC;QAED,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;IACjC,CAAC;IAED;;;OAGG;IACI,+BAA+B;QAClC,OAAO,KAAK,CAAC,IAAI,CACb,IAAI,CAAC,0BAA0B,EAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAC3D;aACI,MAAM,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE;YACd,OAAO,EAAE,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;QACpC,CAAC,CAAC;aACD,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC;IACzC,CAAC;IAEO,0BAA0B;QAC9B,OAAO,IAAI,CAAC,qBAAqB,CAAC,UAAU,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAC3E,CAAC;IAEO,mCAAmC;QACvC,IAAI,WAAW,GAAG,IAAI,CAAC,0BAA0B,EAAE,EAAE,gBAAgB,CAAC;QAEtE,OAAO,WAAW,EAAE,gBAAgB,EAAE;YAClC,WAAW,GAAG,WAAW,EAAE,gBAAgB,CAAC;SAC/C;QACD,OAAO,WAAW,CAAC;IACvB,CAAC;CACJ"}
+{"version":3,"file":"rich-text-viewer.pageobject.js","sourceRoot":"","sources":["../../../../../src/rich-text/viewer/testing/rich-text-viewer.pageobject.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,OAAO,wBAAwB;IACjC,YACqB,qBAAqC;QAArC,0BAAqB,GAArB,qBAAqB,CAAgB;IACvD,CAAC;IAEG,oCAAoC;QACvC,OAAO,IAAI,CAAC,mCAAmC,EAAE,EAAE,WAAW,IAAI,EAAE,CAAC;IACzE,CAAC;IAEM,qCAAqC,CAAC,SAAiB;QAC1D,OAAO,CACH,IAAI,CAAC,mCAAmC,EAAE,EAAE,YAAY,CACpD,SAAS,CACZ,IAAI,EAAE,CACV,CAAC;IACN,CAAC;IAED;;;OAGG;IACI,2BAA2B;QAC9B,OAAO,KAAK,CAAC,IAAI,CACb,IAAI,CAAC,0BAA0B,EAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAC3D,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;IAC5B,CAAC;IAED;;OAEG;IACI,0CAA0C;QAC7C,MAAM,QAAQ,GAAa,EAAE,CAAC;QAC9B,MAAM,eAAe,GAAG,IAAI,CAAC,0BAA0B,EAAE,CAAC;QAE1D,MAAM,WAAW,GAAG,CAAC,IAAU,EAAQ,EAAE;YACrC,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE;gBACrC,MAAM,EAAE,GAAG,IAAe,CAAC;gBAC3B,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;gBAE1B,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;gBAEnC,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC;aACnC;QACL,CAAC,CAAC;QAEF,IAAI,eAAe,EAAE;YACjB,WAAW,CAAC,eAAe,CAAC,CAAC;SAChC;QAED,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;IACjC,CAAC;IAED;;;OAGG;IACI,+BAA+B;QAClC,OAAO,KAAK,CAAC,IAAI,CACb,IAAI,CAAC,0BAA0B,EAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAC3D;aACI,MAAM,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;aAC3C,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC;IACzC,CAAC;IAEM,kCAAkC,CAAC,SAAiB;QACvD,OAAO,KAAK,CAAC,IAAI,CACb,IAAI,CAAC,0BAA0B,EAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAC3D;aACI,MAAM,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;aAC3C,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC;IACrD,CAAC;IAEO,0BAA0B;QAC9B,OAAO,IAAI,CAAC,qBAAqB,CAAC,UAAU,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAC3E,CAAC;IAEO,mCAAmC;QACvC,IAAI,WAAW,GAAG,IAAI,CAAC,0BAA0B,EAAE,EAAE,gBAAgB,CAAC;QAEtE,OAAO,WAAW,EAAE,gBAAgB,EAAE;YAClC,WAAW,GAAG,WAAW,EAAE,gBAAgB,CAAC;SAC/C;QACD,OAAO,WAAW,CAAC;IACvB,CAAC;CACJ"}

package/dist/esm/rich-text-mention/base/models/mention-internals.d.ts

@@ -1,6 +1,7 @@
 export interface MentionInternalsOptions {
     readonly icon: string;
     readonly character: string;
+    readonly viewElement: string;
 }
 /**
  * Internal mention state
@@ -26,5 +27,9 @@ export declare class MentionInternals<TMentionConfig> {
      * Character to show respective mention list
      */
     readonly character: string;
+    /**
+     * Mention view element to render in rich text components
+     */
+    readonly viewElement: string;
     constructor(options: MentionInternalsOptions);
 }

package/dist/esm/rich-text-mention/base/models/mention-internals.js

@@ -11,6 +11,7 @@ export class MentionInternals {
         this.validConfiguration = true;
         this.icon = options.icon;
         this.character = options.character;
+        this.viewElement = options.viewElement;
     }
 }
 __decorate([

package/dist/esm/rich-text-mention/base/models/mention-internals.js.map

@@ -1 +1 @@
-{"version":3,"file":"mention-internals.js","sourceRoot":"","sources":["../../../../../src/rich-text-mention/base/models/mention-internals.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAOrD;;GAEG;AACH,MAAM,OAAO,gBAAgB;IA4BzB,YAAmB,OAAgC;QArBnD;;WAEG;QAEI,uBAAkB,GAAG,IAAI,CAAC;QAkB7B,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;QACzB,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;IACvC,CAAC;CACJ;AA3BG;IADC,UAAU;uDAC2B;AAMtC;IADC,UAAU;4DACsB"}
+{"version":3,"file":"mention-internals.js","sourceRoot":"","sources":["../../../../../src/rich-text-mention/base/models/mention-internals.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAQrD;;GAEG;AACH,MAAM,OAAO,gBAAgB;IAiCzB,YAAmB,OAAgC;QA1BnD;;WAEG;QAEI,uBAAkB,GAAG,IAAI,CAAC;QAuB7B,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;QACzB,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;QACnC,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;IAC3C,CAAC;CACJ;AAjCG;IADC,UAAU;uDAC2B;AAMtC;IADC,UAAU;4DACsB"}

package/dist/esm/rich-text-mention/users/index.js

@@ -5,6 +5,7 @@ import { template } from '../base/template';
 import { iconAtTag } from '../../icons/at';
 import { MappingUser } from '../../mapping/user';
 import { RichTextMentionUsersValidator } from './models/rich-text-mention-users-validator';
+import { richTextMentionUsersViewTag } from './view';
 /**
  * Rich Text user mention configuration element which will have MappingMentionUser elements as children
  */
@@ -15,7 +16,8 @@ export class RichTextMentionUsers extends RichTextMention {
     getMentionInternalsOptions() {
         return {
             icon: iconAtTag,
-            character: '@'
+            character: '@',
+            viewElement: richTextMentionUsersViewTag
         };
     }
     createMentionConfig(mappingConfigs) {

package/dist/esm/rich-text-mention/users/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/rich-text-mention/users/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAEH,eAAe,EAElB,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAGjD,OAAO,EAAE,6BAA6B,EAAE,MAAM,4CAA4C,CAAC;AAQ3F;;GAEG;AACH,MAAM,OAAO,oBAAqB,SAAQ,eAGzC;IACsB,eAAe;QAC9B,OAAO,IAAI,6BAA6B,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACpE,CAAC;IAEkB,0BAA0B;QACzC,OAAO;YACH,IAAI,EAAE,SAAS;YACf,SAAS,EAAE,GAAG;SACjB,CAAC;IACN,CAAC;IAEkB,mBAAmB,CAClC,cAA8B;QAE9B,OAAO;YACH,cAAc;SACjB,CAAC;IACN,CAAC;IAES,mBAAmB,CACzB,OAAgC;QAEhC,IAAI,OAAO,YAAY,WAAW,EAAE;YAChC,OAAO,IAAI,iBAAiB,CAAC,OAAO,CAAC,GAAG,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;SAClE;QACD,+EAA+E;QAC/E,mEAAmE;QACnE,MAAM,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAAC;IAC3C,CAAC;CACJ;AACD,MAAM,0BAA0B,GAAG,oBAAoB,CAAC,OAAO,CAAC;IAC5D,QAAQ,EAAE,yBAAyB;IACnC,QAAQ;CACX,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE;KACrB,UAAU,CAAC,QAAQ,CAAC;KACpB,QAAQ,CAAC,0BAA0B,EAAE,CAAC,CAAC;AAC5C,MAAM,CAAC,MAAM,uBAAuB,GAAG,YAAY,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/rich-text-mention/users/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAEH,eAAe,EAElB,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAGjD,OAAO,EAAE,6BAA6B,EAAE,MAAM,4CAA4C,CAAC;AAC3F,OAAO,EAAE,2BAA2B,EAAE,MAAM,QAAQ,CAAC;AAQrD;;GAEG;AACH,MAAM,OAAO,oBAAqB,SAAQ,eAGzC;IACsB,eAAe;QAC9B,OAAO,IAAI,6BAA6B,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACpE,CAAC;IAEkB,0BAA0B;QACzC,OAAO;YACH,IAAI,EAAE,SAAS;YACf,SAAS,EAAE,GAAG;YACd,WAAW,EAAE,2BAA2B;SAC3C,CAAC;IACN,CAAC;IAEkB,mBAAmB,CAClC,cAA8B;QAE9B,OAAO;YACH,cAAc;SACjB,CAAC;IACN,CAAC;IAES,mBAAmB,CACzB,OAAgC;QAEhC,IAAI,OAAO,YAAY,WAAW,EAAE;YAChC,OAAO,IAAI,iBAAiB,CAAC,OAAO,CAAC,GAAG,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;SAClE;QACD,+EAA+E;QAC/E,mEAAmE;QACnE,MAAM,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAAC;IAC3C,CAAC;CACJ;AACD,MAAM,0BAA0B,GAAG,oBAAoB,CAAC,OAAO,CAAC;IAC5D,QAAQ,EAAE,yBAAyB;IACnC,QAAQ;CACX,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE;KACrB,UAAU,CAAC,QAAQ,CAAC;KACpB,QAAQ,CAAC,0BAA0B,EAAE,CAAC,CAAC;AAC5C,MAAM,CAAC,MAAM,uBAAuB,GAAG,YAAY,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ni/nimble-components",
-  "version": "20.14.7",
+  "version": "20.14.9",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
     "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",