botframework-webchat-component 4.19.0 → 4.19.1-main.20260529.6bcfcee

package/src/ActivityStatus/SendStatus/private/SendFailedRetry.js

@@ -1,28 +0,0 @@
-import { hooks } from 'botframework-webchat-api';
-import PropTypes from 'prop-types';
-import React, { useCallback } from 'react';
-
-import InlineMarkdown from '../../../Utils/InlineMarkdown';
-
-const { useLocalizer } = hooks;
-
-const MARKDOWN_REFERENCES = ['RETRY'];
-
-const SendFailedRetry = ({ onRetryClick }) => {
-  const handleReference = useCallback(({ data }) => data === 'RETRY' && onRetryClick(), [onRetryClick]);
-  const localize = useLocalizer();
-
-  const sendFailedText = localize('ACTIVITY_STATUS_SEND_FAILED_RETRY');
-
-  return (
-    <InlineMarkdown onReference={handleReference} references={MARKDOWN_REFERENCES}>
-      {sendFailedText}
-    </InlineMarkdown>
-  );
-};
-
-SendFailedRetry.propTypes = {
-  onRetryClick: PropTypes.func.isRequired
-};
-
-export default SendFailedRetry;

package/src/Utils/InlineMarkdown.js

@@ -1,154 +0,0 @@
-/* eslint react/no-danger: "off" */
-
-import { hooks } from 'botframework-webchat-api';
-import { isForbiddenPropertyName } from 'botframework-webchat-core';
-import PropTypes from 'prop-types';
-import React, { useCallback, useMemo } from 'react';
-import updateIn from 'simple-update-in';
-
-import createCustomEvent from './createCustomEvent';
-import randomId from './randomId';
-import useInternalMarkdownIt from '../hooks/internal/useInternalMarkdownIt';
-import { useStyleToEmotionObject } from '../hooks/internal/styleToEmotionObject';
-import walkMarkdownTokens from './walkMarkdownTokens';
-
-const { useStyleOptions } = hooks;
-
-function replaceAnchorWithButton(markdownTokens) {
-  return walkMarkdownTokens(markdownTokens, markdownToken => {
-    markdownToken = { ...markdownToken };
-
-    switch (markdownToken.type) {
-      case 'link_open':
-        markdownToken.tag = 'button';
-        markdownToken.attrs = [
-          ...updateIn(
-            markdownToken.attrs,
-            [([name, value]) => name === 'href' && value.startsWith('#')],
-            ([, value]) => ['data-markdown-href', value.substr(1)]
-          ),
-          ['type', 'button']
-        ];
-        break;
-
-      case 'link_close':
-        markdownToken.tag = 'button';
-        break;
-
-      default:
-        break;
-    }
-
-    return markdownToken;
-  });
-}
-
-const InlineMarkdown = ({ children, onReference, references }) => {
-  if (typeof children !== 'string') {
-    console.warn('botframework-webchat: "children" prop passed to <InlineMarkdown> must be of type string.');
-
-    // Shortcut for disabling invalid props.
-    // eslint-disable-next-line react-hooks/immutability
-    children = '';
-  }
-
-  const [markdownIt] = useInternalMarkdownIt();
-  const [{ accent }] = useStyleOptions();
-  const styleToClassName = useStyleToEmotionObject();
-
-  // We inlined the style here because this style is:
-  // 1. Internal to Web Chat
-  // 2. Not customizable from developers (other than setting `styleOptions.accent`)
-  const className = useMemo(
-    () =>
-      styleToClassName({
-        '& button[data-markdown-href]': {
-          appearance: 'none',
-          backgroundColor: 'transparent',
-          border: 0,
-          color: accent,
-          cursor: 'pointer',
-          fontFamily: 'inherit',
-          fontSize: 'inherit',
-          padding: 0
-        },
-        '@media screen and (forced-colors: active)': {
-          '& button[data-markdown-href]': {
-            color: 'LinkText',
-            textDecoration: 'underline'
-          }
-        }
-      }) + '',
-    [accent, styleToClassName]
-  );
-
-  // Markdown-It only support references in uppercase.
-  // Re-shaping input.
-  // eslint-disable-next-line react-hooks/immutability
-  references = references.map(reference => reference.toUpperCase());
-
-  const { hrefToRef, refToHref } = references.reduce(
-    ({ hrefToRef, refToHref }, ref) => {
-      const href = randomId();
-
-      return {
-        hrefToRef: { ...hrefToRef, [href]: ref },
-        refToHref: { ...refToHref, [ref]: href }
-      };
-    },
-    { hrefToRef: {}, refToHref: {} }
-  );
-
-  const html = useMemo(() => {
-    const tree = markdownIt.parseInline(children, {
-      references: references.reduce(
-        (references, key) =>
-          // Mitigated through denylisting.
-          // eslint-disable-next-line security/detect-object-injection
-          isForbiddenPropertyName(key) ? references : { ...references, [key]: { href: `#${refToHref[key]}` } },
-        {}
-      )
-    });
-
-    // Turn "<a href="#retry">Retry</a>" into "<button data-ref="retry" type="button">Retry</button>"
-    const updatedTree = replaceAnchorWithButton(tree);
-
-    return { __html: markdownIt.renderer.render(updatedTree) };
-  }, [children, refToHref, markdownIt, references]);
-
-  const handleClick = useCallback(
-    event => {
-      event.stopPropagation();
-
-      const href = event.target.getAttribute('data-markdown-href');
-
-      href &&
-        onReference &&
-        onReference(
-          createCustomEvent(
-            'reference',
-            // Mitigated through denylisting.
-            // eslint-disable-next-line security/detect-object-injection
-            isForbiddenPropertyName(href) ? {} : { data: hrefToRef[href] }
-          )
-        );
-    },
-    [hrefToRef, onReference]
-  );
-
-  return <span className={className} dangerouslySetInnerHTML={html} onClick={handleClick} />;
-};
-
-InlineMarkdown.defaultProps = {
-  children: '',
-  onReference: undefined,
-  references: []
-};
-
-InlineMarkdown.propTypes = {
-  children: PropTypes.string,
-  onReference: PropTypes.func,
-  references: PropTypes.arrayOf(PropTypes.string)
-};
-
-export default InlineMarkdown;

package/src/Utils/addTargetBlankToHyperlinksMarkdown.js

@@ -1,28 +0,0 @@
-import updateMarkdownAttrs from './updateMarkdownAttrs';
-import walkMarkdownTokens from './walkMarkdownTokens';
-
-export default function addTargetBlankToHyperlinksMarkdown(tokens) {
-  return walkMarkdownTokens(tokens, token => {
-    switch (token.type) {
-      case 'link_open':
-        token = updateMarkdownAttrs(token, attrs =>
-          // Adds only for external links, e.g. https://, data:
-          // Don't add for internal links, e.g. #ref-1, ?q=doc
-          /^\w/u.test(attrs.href)
-            ? {
-                ...attrs,
-                rel: 'noopener noreferrer',
-                target: '_blank'
-              }
-            : attrs
-        );
-
-        break;
-
-      default:
-        break;
-    }
-
-    return token;
-  });
-}

package/src/Utils/addTargetBlankToHyperlinksMarkdown.spec.js

@@ -1,45 +0,0 @@
-import MarkdownIt from 'markdown-it';
-
-import addTargetBlankToHyperlinksMarkdown from './addTargetBlankToHyperlinksMarkdown';
-
-test('add to external links', () => {
-  const markdownIt = new MarkdownIt();
-  const markdown = 'Hello, [Microsoft](https://microsoft.com/)!';
-  const tree = markdownIt.parseInline(markdown);
-  const updatedTree = addTargetBlankToHyperlinksMarkdown(tree);
-  const html = markdownIt.renderer.render(updatedTree);
-
-  expect(html).toMatchInlineSnapshot(
-    `"Hello, <a href="https://microsoft.com/" rel="noopener noreferrer" target="_blank">Microsoft</a>!"`
-  );
-});
-
-test("don't add for hashes", () => {
-  const markdownIt = new MarkdownIt();
-  const markdown = 'Hello, [Microsoft](#microsoft)!';
-  const tree = markdownIt.parseInline(markdown);
-  const updatedTree = addTargetBlankToHyperlinksMarkdown(tree);
-  const html = markdownIt.renderer.render(updatedTree);
-
-  expect(html).toMatchInlineSnapshot(`"Hello, <a href="#microsoft">Microsoft</a>!"`);
-});
-
-test("don't add for searches", () => {
-  const markdownIt = new MarkdownIt();
-  const markdown = 'Hello, [Microsoft](?q=microsoft)!';
-  const tree = markdownIt.parseInline(markdown);
-  const updatedTree = addTargetBlankToHyperlinksMarkdown(tree);
-  const html = markdownIt.renderer.render(updatedTree);
-
-  expect(html).toMatchInlineSnapshot(`"Hello, <a href="?q=microsoft">Microsoft</a>!"`);
-});
-
-test("don't add for cross references", () => {
-  const markdownIt = new MarkdownIt();
-  const markdown = 'Hello, [Microsoft]!';
-  const tree = markdownIt.parseInline(markdown, { references: { MICROSOFT: { href: '#microsoft' } } });
-  const updatedTree = addTargetBlankToHyperlinksMarkdown(tree);
-  const html = markdownIt.renderer.render(updatedTree);
-
-  expect(html).toMatchInlineSnapshot(`"Hello, <a href="#microsoft">Microsoft</a>!"`);
-});

package/src/Utils/betterLinks.ts

@@ -1,157 +0,0 @@
-/* eslint-disable security/detect-object-injection */
-import MarkdownIt from 'markdown-it';
-
-function iterator(md, ruleName, tokenType, iterator) {
-  function scan(state) {
-    const { env = {} } = state;
-    for (let blkIdx = state.tokens.length - 1; blkIdx >= 0; blkIdx--) {
-      if (state.tokens[blkIdx].type !== 'inline') {
-        continue;
-      }
-      const inlineTokens = state.tokens[blkIdx].children;
-      for (let i = inlineTokens.length - 1; i >= 0; i--) {
-        if (inlineTokens[i].type !== tokenType) {
-          continue;
-        }
-        iterator(inlineTokens, i, env);
-      }
-    }
-  }
-  md.core.ruler.push(ruleName, scan);
-}
-
-// Put a transparent pixel instead of the "open in new window" icon, so developers can easily modify the icon in CSS.
-const TRANSPARENT_GIF = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
-
-type AttributeSetter = false | string | ((value?: string) => string);
-
-export type LinkOptions = {
-  /** Value of "aria-label" attribute of the link. If set to `false`, remove existing attribute. */
-  ariaLabel?: AttributeSetter;
-
-  /** Turns this link into a <button> with "value" attribute instead of "href". */
-  asButton?: boolean;
-
-  /** Value of "class" attribute of the link. If set to `false`, remove existing attribute. */
-  className?: AttributeSetter;
-
-  /** Alternate text of the image icon appended to the link. */
-  iconAlt?: string;
-
-  /** Class name of the image icon appended to the link. */
-  iconClassName?: string;
-
-  /** Value of "rel" attribute of the link. If set to `false`, remove existing attribute. */
-  rel?: AttributeSetter;
-
-  /** Value of "target" attribute of the link. If set to `false`, remove existing attribute. */
-  target?: AttributeSetter;
-
-  /** Value of "title" attribute of the link. If set to `false`, remove existing attribute. */
-  title?: AttributeSetter;
-
-  /** Wraps the link with zero-width space. */
-  wrapZeroWidthSpace?: boolean;
-};
-
-export type BetterLinkEnv = {
-  decorateLink?: (href: string, textContent: string, linkOptions: LinkOptions) => LinkOptions | undefined;
-  linkOptions?: LinkOptions;
-};
-
-// This is used for parsing Markdown for external links.
-const internalMarkdownIt = new MarkdownIt();
-
-const ZERO_WIDTH_SPACE_TOKEN = {
-  content: '\u200b',
-  type: 'text'
-};
-
-function setTokenAttribute(attrs: Array<[string, string]>, name: string, value?: AttributeSetter) {
-  const index = attrs.findIndex(entry => entry[0] === name);
-
-  if (value === false) {
-    ~index && attrs.splice(index, 1);
-  } else if (typeof value === 'string') {
-    if (~index) {
-      attrs[+index][1] = value;
-    } else {
-      attrs.push([name, value]);
-    }
-  } else if (typeof value === 'function') {
-    if (~index) {
-      attrs[+index][1] = value(attrs[+index][1]);
-    } else {
-      attrs.push([name, value()]);
-    }
-  }
-}
-
-const betterLinks = (markdown: typeof MarkdownIt): typeof MarkdownIt =>
-  markdown.use(iterator, 'url_new_win', 'link_open', (tokens, index, env) => {
-    const { decorateLink, linkOptions }: BetterLinkEnv = env;
-
-    const indexOfLinkCloseToken = tokens.indexOf(tokens.slice(index + 1).find(({ type }) => type === 'link_close'));
-    // eslint-disable-next-line no-magic-numbers
-    const updatedTokens = tokens.splice(index, ~indexOfLinkCloseToken ? indexOfLinkCloseToken - index + 1 : 2);
-
-    try {
-      const [linkOpenToken] = updatedTokens;
-      const linkCloseToken = updatedTokens[updatedTokens.length - 1];
-
-      const [, href] = linkOpenToken.attrs.find(([name]) => name === 'href');
-      const nodesInLink = updatedTokens.slice(1, updatedTokens.length - 1);
-
-      const textContent = nodesInLink
-        .filter(({ type }) => type === 'text')
-        .map(({ content }) => content)
-        .join(' ');
-
-      const decoration = decorateLink?.(href, textContent, linkOptions);
-
-      if (!decoration) {
-        return;
-      }
-
-      const { ariaLabel, asButton, className, iconAlt, iconClassName, rel, target, title, wrapZeroWidthSpace } =
-        decoration;
-
-      setTokenAttribute(linkOpenToken.attrs, 'aria-label', ariaLabel);
-      setTokenAttribute(linkOpenToken.attrs, 'class', className);
-      setTokenAttribute(linkOpenToken.attrs, 'title', title);
-
-      if (iconClassName) {
-        const iconTokens = internalMarkdownIt.parseInline(`![](${TRANSPARENT_GIF})`)[0].children;
-
-        setTokenAttribute(iconTokens[0].attrs, 'class', iconClassName);
-        setTokenAttribute(iconTokens[0].attrs, 'title', iconAlt);
-
-        // Add an icon before </a>.
-        // eslint-disable-next-line no-magic-numbers
-        updatedTokens.splice(-1, 0, ...iconTokens);
-      }
-
-      if (asButton) {
-        setTokenAttribute(linkOpenToken.attrs, 'href', false);
-
-        linkOpenToken.tag = 'button';
-
-        setTokenAttribute(linkOpenToken.attrs, 'type', 'button');
-        setTokenAttribute(linkOpenToken.attrs, 'value', href);
-
-        linkCloseToken.tag = 'button';
-      } else {
-        setTokenAttribute(linkOpenToken.attrs, 'rel', rel);
-        setTokenAttribute(linkOpenToken.attrs, 'target', target);
-      }
-
-      if (wrapZeroWidthSpace) {
-        updatedTokens.splice(0, 0, ZERO_WIDTH_SPACE_TOKEN);
-        updatedTokens.splice(Infinity, 0, ZERO_WIDTH_SPACE_TOKEN);
-      }
-    } finally {
-      tokens.splice(index, 0, ...updatedTokens);
-    }
-  });
-
-export default betterLinks;

package/src/Utils/parseDocumentFragmentFromString.ts

@@ -1,9 +0,0 @@
-export default function parseDocumentFragmentFromString(html: string): DocumentFragment {
-  const parser = new DOMParser();
-  const parsedDocument = parser.parseFromString(html, 'text/html');
-  const fragment = parsedDocument.createDocumentFragment();
-
-  fragment.append(...parsedDocument.body.childNodes);
-
-  return fragment;
-}

package/src/Utils/serializeDocumentFragmentIntoString.ts

@@ -1,3 +0,0 @@
-export default function serializeDocumentFragmentIntoString(documentFragment: DocumentFragment): string {
-  return new XMLSerializer().serializeToString(documentFragment);
-}

package/src/Utils/updateMarkdownAttrs.js

@@ -1,10 +0,0 @@
-import updateIn from 'simple-update-in';
-
-export default function updateMarkdownItAttrs(token, updater) {
-  return updateIn(token, ['attrs'], attrs => {
-    const map = Object.fromEntries(attrs);
-    const nextMap = updater(map);
-
-    return Object.entries(nextMap);
-  });
-}

package/src/Utils/updateMarkdownAttrs.spec.js

@@ -1,71 +0,0 @@
-import updateMarkdownAttrs from './updateMarkdownAttrs';
-
-test('add "rel" and "target" attributes', () => {
-  const token = {
-    attrs: [['href', 'https://example.org/']]
-  };
-
-  const actual = updateMarkdownAttrs(token, attrs => ({ ...attrs, rel: 'noopener noreferrer', target: '_blank' }));
-
-  expect(actual).toMatchInlineSnapshot(`
-    {
-      "attrs": [
-        [
-          "href",
-          "https://example.org/",
-        ],
-        [
-          "rel",
-          "noopener noreferrer",
-        ],
-        [
-          "target",
-          "_blank",
-        ],
-      ],
-    }
-  `);
-
-  // The token passed in should kept unchanged
-  expect(token).toMatchInlineSnapshot(`
-    {
-      "attrs": [
-        [
-          "href",
-          "https://example.org/",
-        ],
-      ],
-    }
-  `);
-});
-
-test('replace "href" attribute', () => {
-  const token = {
-    attrs: [['href', 'https://example.org/']]
-  };
-
-  const actual = updateMarkdownAttrs(token, () => ({ href: 'https://microsoft.com/' }));
-
-  expect(actual).toMatchInlineSnapshot(`
-    {
-      "attrs": [
-        [
-          "href",
-          "https://microsoft.com/",
-        ],
-      ],
-    }
-  `);
-
-  // The token passed in should kept unchanged
-  expect(token).toMatchInlineSnapshot(`
-    {
-      "attrs": [
-        [
-          "href",
-          "https://example.org/",
-        ],
-      ],
-    }
-  `);
-});

package/src/Utils/walkMarkdownTokens.js

@@ -1,15 +0,0 @@
-export default function walkMarkdownTokens(tokens, walker) {
-  return tokens.map(token => {
-    if (token) {
-      const nextToken = walker(token);
-
-      if (nextToken.children) {
-        nextToken.children = walkMarkdownTokens(nextToken.children, walker);
-      }
-
-      return nextToken;
-    }
-
-    return token;
-  });
-}

package/src/Utils/walkMarkdownTokens.spec.js

@@ -1,18 +0,0 @@
-import MarkdownIt from 'markdown-it';
-import updateIn from 'simple-update-in';
-
-import walkMarkdownTokens from './walkMarkdownTokens';
-
-test('walk every node and add class="markdown"', () => {
-  const markdownIt = new MarkdownIt();
-  const tree = markdownIt.parse('Hello, [World](#world)!');
-  const patchedTree = walkMarkdownTokens(tree, token =>
-    updateIn(token, ['attrs'], attrs => [...(attrs || []), ['class', 'markdown']])
-  );
-  const actual = markdownIt.renderer.render(patchedTree);
-
-  expect(actual).toMatchInlineSnapshot(`
-    "<p class="markdown">Hello, <a href="#world" class="markdown">World</a class="markdown">!</p class="markdown">
-    "
-  `);
-});

package/src/hooks/internal/useInternalMarkdownIt.js

@@ -1,7 +0,0 @@
-import useWebChatUIContext from './useWebChatUIContext';
-
-function useInternalMarkdownIt() {
-  return useWebChatUIContext().internalMarkdownItState;
-}
-
-export default useInternalMarkdownIt;

package/src/hooks/internal/useInternalRenderMarkdownInline.js

@@ -1,9 +0,0 @@
-import useWebChatUIContext from './useWebChatUIContext';
-
-function useInternalRenderMarkdownInline() {
-  const { internalRenderMarkdownInline } = useWebChatUIContext();
-
-  return internalRenderMarkdownInline;
-}
-
-export default useInternalRenderMarkdownInline;