@azure/communication-react 1.14.1-alpha-202403290012 → 1.15.0-beta.1

package/dist/dist-esm/react-components/src/components/ReactionButton.d.ts

@@ -1,56 +0,0 @@
-/// <reference types="react" />
-import { ControlBarButtonProps } from './ControlBarButton';
-import { ReactionResources } from '..';
-/**
- * Props for {@link ReactionButton}.
- *
- * @beta
- */
-export interface ReactionButtonProps extends ControlBarButtonProps {
-    /**
-     * Optional strings to override in component
-     */
-    strings?: Partial<ReactionButtonStrings>;
-    /**
-     * Click event to send reaction to meeting
-     */
-    onReactionClick: (reaction: string) => Promise<void>;
-    /**
-     * Reaction resource locator and parameters
-     */
-    reactionResources: ReactionResources;
-}
-/**
- * Strings of {@link ReactionButton} that can be overridden.
- *
- * @beta
- */
-export interface ReactionButtonStrings {
-    /** Label of the button. */
-    label: string;
-    /** Aria label for reaction button accessibility announcement */
-    ariaLabel: string;
-    /** Tooltip content when the button is disabled. */
-    tooltipDisabledContent?: string;
-    /** Tooltip content when the button is enabled. */
-    tooltipContent?: string;
-    /** Tooltip content of like reaction button. */
-    likeReactionTooltipContent?: string;
-    /** Tooltip content of heart reaction button. */
-    heartReactionTooltipContent?: string;
-    /** Tooltip content of laugh reaction button. */
-    laughReactionTooltipContent?: string;
-    /** Tooltip content of clap reaction button. */
-    applauseReactionTooltipContent?: string;
-    /** Tooltip content of surprised reaction button. */
-    surprisedReactionTooltipContent?: string;
-}
-/**
- * A button to send reactions.
- *
- * Can be used with {@link ControlBar}.
- *
- * @beta
- */
-export declare const ReactionButton: (props: ReactionButtonProps) => JSX.Element;
-//# sourceMappingURL=ReactionButton.d.ts.map

package/dist/dist-esm/react-components/src/components/ReactionButton.js

@@ -1,89 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-/* @conditional-compile-remove(reaction) */
-import { ContextualMenuItemType, DefaultPalette, IconButton, mergeStyles, TooltipHost, useTheme } from '@fluentui/react';
-/* @conditional-compile-remove(reaction) */
-import React, { useState } from 'react';
-/* @conditional-compile-remove(reaction) */
-import { ControlBarButton } from './ControlBarButton';
-/* @conditional-compile-remove(reaction) */
-import { _HighContrastAwareIcon } from './HighContrastAwareIcon';
-/* @conditional-compile-remove(reaction) */
-import { useLocale } from '../localization';
-/* @conditional-compile-remove(reaction) */
-import { emojiStyles, reactionEmojiMenuStyles, reactionToolTipHostStyle } from './styles/ReactionButton.styles';
-/* @conditional-compile-remove(reaction) */
-import { isDarkThemed } from '../theming/themeUtils';
-/* @conditional-compile-remove(reaction) */
-/**
- * A button to send reactions.
- *
- * Can be used with {@link ControlBar}.
- *
- * @beta
- */
-export const ReactionButton = (props) => {
-    var _a, _b, _c, _d, _e, _f, _g;
-    const localeStrings = useLocale().strings.reactionButton;
-    const strings = Object.assign(Object.assign({}, localeStrings), props.strings);
-    const theme = useTheme();
-    const styles = reactionButtonStyles(theme);
-    const onRenderIcon = () => (React.createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "ReactionButtonIcon" }));
-    const [isHoveredMap, setIsHoveredMap] = useState(new Map());
-    const emojis = ['like', 'heart', 'laugh', 'applause', 'surprised'];
-    const emojiButtonTooltip = new Map([
-        ['like', strings.likeReactionTooltipContent],
-        ['heart', strings.heartReactionTooltipContent],
-        ['laugh', strings.laughReactionTooltipContent],
-        ['applause', strings.applauseReactionTooltipContent],
-        ['surprised', strings.surprisedReactionTooltipContent]
-    ]);
-    const emojiResource = new Map([
-        ['like', (_a = props.reactionResources.likeReaction) === null || _a === void 0 ? void 0 : _a.url],
-        ['heart', (_b = props.reactionResources.heartReaction) === null || _b === void 0 ? void 0 : _b.url],
-        ['laugh', (_c = props.reactionResources.laughReaction) === null || _c === void 0 ? void 0 : _c.url],
-        ['applause', (_d = props.reactionResources.applauseReaction) === null || _d === void 0 ? void 0 : _d.url],
-        ['surprised', (_e = props.reactionResources.surprisedReaction) === null || _e === void 0 ? void 0 : _e.url]
-    ]);
-    const calloutStyle = { root: { padding: 0 }, calloutMain: { padding: '0.5rem' } };
-    const calloutProps = {
-        gapSpace: 4,
-        styles: calloutStyle,
-        backgroundColor: isDarkThemed(theme) ? theme.palette.neutralLighter : ''
-    };
-    const renderEmoji = (item, dismissMenu) => (React.createElement("div", { style: reactionEmojiMenuStyles() }, emojis.map((emoji, index) => {
-        const resourceUrl = emojiResource.get(emoji);
-        return (React.createElement(TooltipHost, { key: index, "data-ui-id": index, hidden: props.disableTooltip, content: emojiButtonTooltip.get(emoji), styles: reactionToolTipHostStyle(), calloutProps: Object.assign({}, calloutProps) },
-            React.createElement(IconButton, { key: index, onClick: () => {
-                    props.onReactionClick(emoji);
-                    setIsHoveredMap((prevMap) => {
-                        return new Map(prevMap).set(emoji, false);
-                    });
-                    dismissMenu();
-                }, style: emojiStyles(resourceUrl ? resourceUrl : '', isHoveredMap.get(emoji) ? 'running' : 'paused'), onMouseEnter: () => setIsHoveredMap((prevMap) => {
-                    return new Map(prevMap).set(emoji, true);
-                }), onMouseLeave: () => setIsHoveredMap((prevMap) => {
-                    return new Map(prevMap).set(emoji, false);
-                }) })));
-    })));
-    const emojiList = [
-        { key: 'reactions', itemType: ContextualMenuItemType.Normal, onRender: renderEmoji }
-    ];
-    return (React.createElement(ControlBarButton, Object.assign({}, props, { className: mergeStyles(styles, props.styles), menuProps: {
-            shouldFocusOnMount: true,
-            items: emojiList
-        }, onRenderIcon: (_f = props.onRenderIcon) !== null && _f !== void 0 ? _f : onRenderIcon, strings: strings, labelKey: (_g = props.labelKey) !== null && _g !== void 0 ? _g : 'reactionButtonLabel', onRenderMenuIcon: () => React.createElement("div", null), disabled: props.disabled, ariaLabel: strings.ariaLabel })));
-};
-/* @conditional-compile-remove(reaction) */
-const reactionButtonStyles = (theme) => ({
-    rootChecked: {
-        background: theme.palette.themePrimary,
-        color: DefaultPalette.white
-    },
-    rootCheckedHovered: {
-        background: theme.palette.themePrimary,
-        color: DefaultPalette.white
-    },
-    labelChecked: { color: DefaultPalette.white }
-});
-//# sourceMappingURL=ReactionButton.js.map

package/dist/dist-esm/react-components/src/components/ReactionButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ReactionButton.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ReactionButton.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(reaction) */\nimport {\n  ContextualMenuItemType,\n  DefaultPalette,\n  IButtonStyles,\n  ICalloutContentStyles,\n  IconButton,\n  IContextualMenuItem,\n  mergeStyles,\n  Theme,\n  TooltipHost,\n  useTheme\n} from '@fluentui/react';\n/* @conditional-compile-remove(reaction) */\nimport React, { useState } from 'react';\n/* @conditional-compile-remove(reaction) */\nimport { ControlBarButton, ControlBarButtonProps } from './ControlBarButton';\n/* @conditional-compile-remove(reaction) */\nimport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\n/* @conditional-compile-remove(reaction) */\nimport { useLocale } from '../localization';\n/* @conditional-compile-remove(reaction) */\nimport { emojiStyles, reactionEmojiMenuStyles, reactionToolTipHostStyle } from './styles/ReactionButton.styles';\n/* @conditional-compile-remove(reaction) */\nimport { isDarkThemed } from '../theming/themeUtils';\n/* @conditional-compile-remove(reaction) */\nimport { ReactionResources } from '..';\n\n/* @conditional-compile-remove(reaction) */\n/**\n * Props for {@link ReactionButton}.\n *\n * @beta\n */\nexport interface ReactionButtonProps extends ControlBarButtonProps {\n  /**\n   * Optional strings to override in component\n   */\n  strings?: Partial<ReactionButtonStrings>;\n  /**\n   * Click event to send reaction to meeting\n   */\n  onReactionClick: (reaction: string) => Promise<void>;\n  /**\n   * Reaction resource locator and parameters\n   */\n  reactionResources: ReactionResources;\n}\n\n/* @conditional-compile-remove(reaction) */\n/**\n * Strings of {@link ReactionButton} that can be overridden.\n *\n * @beta\n */\nexport interface ReactionButtonStrings {\n  /** Label of the button. */\n  label: string;\n  /** Aria label for reaction button accessibility announcement */\n  ariaLabel: string;\n  /** Tooltip content when the button is disabled. */\n  tooltipDisabledContent?: string;\n  /** Tooltip content when the button is enabled. */\n  tooltipContent?: string;\n  /** Tooltip content of like reaction button. */\n  likeReactionTooltipContent?: string;\n  /** Tooltip content of heart reaction button. */\n  heartReactionTooltipContent?: string;\n  /** Tooltip content of laugh reaction button. */\n  laughReactionTooltipContent?: string;\n  /** Tooltip content of clap reaction button. */\n  applauseReactionTooltipContent?: string;\n  /** Tooltip content of surprised reaction button. */\n  surprisedReactionTooltipContent?: string;\n}\n\n/* @conditional-compile-remove(reaction) */\n/**\n * A button to send reactions.\n *\n * Can be used with {@link ControlBar}.\n *\n * @beta\n */\nexport const ReactionButton = (props: ReactionButtonProps): JSX.Element => {\n  const localeStrings = useLocale().strings.reactionButton;\n  const strings = { ...localeStrings, ...props.strings };\n  const theme = useTheme();\n  const styles = reactionButtonStyles(theme);\n  const onRenderIcon = (): JSX.Element => (\n    <_HighContrastAwareIcon disabled={props.disabled} iconName=\"ReactionButtonIcon\" />\n  );\n\n  const [isHoveredMap, setIsHoveredMap] = useState(new Map());\n  const emojis = ['like', 'heart', 'laugh', 'applause', 'surprised'];\n  const emojiButtonTooltip: Map<string, string | undefined> = new Map([\n    ['like', strings.likeReactionTooltipContent],\n    ['heart', strings.heartReactionTooltipContent],\n    ['laugh', strings.laughReactionTooltipContent],\n    ['applause', strings.applauseReactionTooltipContent],\n    ['surprised', strings.surprisedReactionTooltipContent]\n  ]);\n  const emojiResource: Map<string, string | undefined> = new Map([\n    ['like', props.reactionResources.likeReaction?.url],\n    ['heart', props.reactionResources.heartReaction?.url],\n    ['laugh', props.reactionResources.laughReaction?.url],\n    ['applause', props.reactionResources.applauseReaction?.url],\n    ['surprised', props.reactionResources.surprisedReaction?.url]\n  ]);\n\n  const calloutStyle: Partial<ICalloutContentStyles> = { root: { padding: 0 }, calloutMain: { padding: '0.5rem' } };\n\n  const calloutProps = {\n    gapSpace: 4,\n    styles: calloutStyle,\n    backgroundColor: isDarkThemed(theme) ? theme.palette.neutralLighter : ''\n  };\n\n  const renderEmoji = (item: IContextualMenuItem, dismissMenu: () => void): React.JSX.Element => (\n    <div style={reactionEmojiMenuStyles()}>\n      {emojis.map((emoji, index) => {\n        const resourceUrl = emojiResource.get(emoji);\n        return (\n          <TooltipHost\n            key={index}\n            data-ui-id={index}\n            hidden={props.disableTooltip}\n            content={emojiButtonTooltip.get(emoji)}\n            styles={reactionToolTipHostStyle()}\n            calloutProps={{ ...calloutProps }}\n          >\n            <IconButton\n              key={index}\n              onClick={() => {\n                props.onReactionClick(emoji);\n                setIsHoveredMap((prevMap) => {\n                  return new Map(prevMap).set(emoji, false);\n                });\n                dismissMenu();\n              }}\n              style={emojiStyles(resourceUrl ? resourceUrl : '', isHoveredMap.get(emoji) ? 'running' : 'paused')}\n              onMouseEnter={() =>\n                setIsHoveredMap((prevMap) => {\n                  return new Map(prevMap).set(emoji, true);\n                })\n              }\n              onMouseLeave={() =>\n                setIsHoveredMap((prevMap) => {\n                  return new Map(prevMap).set(emoji, false);\n                })\n              }\n            />\n          </TooltipHost>\n        );\n      })}\n    </div>\n  );\n\n  const emojiList: IContextualMenuItem[] = [\n    { key: 'reactions', itemType: ContextualMenuItemType.Normal, onRender: renderEmoji }\n  ];\n\n  return (\n    <ControlBarButton\n      {...props}\n      className={mergeStyles(styles, props.styles)}\n      menuProps={{\n        shouldFocusOnMount: true,\n        items: emojiList\n      }}\n      onRenderIcon={props.onRenderIcon ?? onRenderIcon}\n      strings={strings}\n      labelKey={props.labelKey ?? 'reactionButtonLabel'}\n      onRenderMenuIcon={() => <div />}\n      disabled={props.disabled}\n      ariaLabel={strings.ariaLabel}\n    />\n  );\n};\n\n/* @conditional-compile-remove(reaction) */\nconst reactionButtonStyles = (theme: Theme): IButtonStyles => ({\n  rootChecked: {\n    background: theme.palette.themePrimary,\n    color: DefaultPalette.white\n  },\n  rootCheckedHovered: {\n    background: theme.palette.themePrimary,\n    color: DefaultPalette.white\n  },\n  labelChecked: { color: DefaultPalette.white }\n});\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/RichTextRibbonButtons.d.ts

@@ -1,7 +0,0 @@
-import { Theme } from '@fluentui/react';
-import { RibbonButton } from 'roosterjs-react';
-/**
- * @private
- */
-export declare const ribbonButtons: (theme: Theme) => RibbonButton<string>[];
-//# sourceMappingURL=RichTextRibbonButtons.d.ts.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/RichTextRibbonButtons.js

@@ -1,82 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-import { ContextualMenuItemType } from '@fluentui/react';
-import { KnownRibbonButtonKey, getButtons } from 'roosterjs-react';
-import { ribbonButtonStyle, ribbonDividerStyle } from '../../styles/RichTextEditor.styles';
-import { insertTableButton } from './Table/RichTextInsertTableButton';
-const MaxRowsNumber = 5;
-const MaxColumnsNumber = 5;
-const dividerRibbonButton = (theme, key) => {
-    return {
-        key: key,
-        iconName: 'RichTextDividerIcon',
-        unlocalizedText: '',
-        onClick: () => { },
-        isDisabled: () => true,
-        commandBarProperties: {
-            // show the item correctly for the overflow menu
-            itemType: ContextualMenuItemType.Divider,
-            buttonStyles: ribbonDividerStyle(theme),
-            // this is still needed to remove checkmark icon space even though it is a divider
-            canCheck: false
-        }
-    };
-};
-const boldButton = (theme) => {
-    return createKnownRibbonButton(KnownRibbonButtonKey.Bold, theme, 'RichTextBoldButtonIcon');
-};
-const italicButton = (theme) => {
-    return createKnownRibbonButton(KnownRibbonButtonKey.Italic, theme, 'RichTextItalicButtonIcon');
-};
-const underlineButton = (theme) => {
-    return createKnownRibbonButton(KnownRibbonButtonKey.Underline, theme, 'RichTextUnderlineButtonIcon');
-};
-const bulletListButton = (theme) => {
-    return createKnownRibbonButton(KnownRibbonButtonKey.BulletedList, theme, 'RichTextBulletListButtonIcon');
-};
-const numberListButton = (theme) => {
-    return createKnownRibbonButton(KnownRibbonButtonKey.NumberedList, theme, 'RichTextNumberListButtonIcon');
-};
-const indentIncreaseButton = (theme) => {
-    return createKnownRibbonButton(KnownRibbonButtonKey.IncreaseIndent, theme, 'RichTextIndentIncreaseButtonIcon');
-};
-const indentDecreaseButton = (theme) => {
-    return createKnownRibbonButton(KnownRibbonButtonKey.DecreaseIndent, theme, 'RichTextIndentDecreaseButtonIcon');
-};
-const createKnownRibbonButton = (key, theme, icon) => {
-    var _a;
-    const buttons = getButtons([key]);
-    if (buttons.length > 0) {
-        const button = buttons[0];
-        // AllButtonStringKeys is a union of all the string keys of all the buttons
-        const result = buttons[0];
-        button.iconName = icon;
-        button.commandBarProperties = Object.assign(Object.assign({}, button.commandBarProperties), { buttonStyles: Object.assign(Object.assign({}, (_a = button.commandBarProperties) === null || _a === void 0 ? void 0 : _a.buttonStyles), ribbonButtonStyle(theme)), canCheck: false });
-        return result;
-    }
-    return undefined;
-};
-/**
- * @private
- */
-export const ribbonButtons = (theme) => {
-    const buttons = [];
-    [
-        boldButton(theme),
-        italicButton(theme),
-        underlineButton(theme),
-        dividerRibbonButton(theme, 'RichTextRibbonTextFormatDivider'),
-        bulletListButton(theme),
-        numberListButton(theme),
-        indentIncreaseButton(theme),
-        indentDecreaseButton(theme),
-        dividerRibbonButton(theme, 'RichTextRibbonTableDivider'),
-        insertTableButton(theme, MaxRowsNumber, MaxColumnsNumber)
-    ].forEach((item) => {
-        if (item !== undefined) {
-            buttons.push(item);
-        }
-    });
-    return buttons;
-};
-//# sourceMappingURL=RichTextRibbonButtons.js.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/RichTextRibbonButtons.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RichTextRibbonButtons.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/RichTextEditor/Buttons/RichTextRibbonButtons.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ContextualMenuItemType, Theme } from '@fluentui/react';\nimport { KnownRibbonButtonKey, RibbonButton, getButtons } from 'roosterjs-react';\nimport { ribbonButtonStyle, ribbonDividerStyle } from '../../styles/RichTextEditor.styles';\nimport { insertTableButton } from './Table/RichTextInsertTableButton';\n\nconst MaxRowsNumber = 5;\nconst MaxColumnsNumber = 5;\n\nconst dividerRibbonButton = (theme: Theme, key: string): RibbonButton<string> => {\n  return {\n    key: key,\n    iconName: 'RichTextDividerIcon',\n    unlocalizedText: '',\n    onClick: () => {},\n    isDisabled: () => true,\n    commandBarProperties: {\n      // show the item correctly for the overflow menu\n      itemType: ContextualMenuItemType.Divider,\n      buttonStyles: ribbonDividerStyle(theme),\n      // this is still needed to remove checkmark icon space even though it is a divider\n      canCheck: false\n    }\n  };\n};\n\nconst boldButton = (theme: Theme): RibbonButton<string> | undefined => {\n  return createKnownRibbonButton(KnownRibbonButtonKey.Bold, theme, 'RichTextBoldButtonIcon');\n};\n\nconst italicButton = (theme: Theme): RibbonButton<string> | undefined => {\n  return createKnownRibbonButton(KnownRibbonButtonKey.Italic, theme, 'RichTextItalicButtonIcon');\n};\n\nconst underlineButton = (theme: Theme): RibbonButton<string> | undefined => {\n  return createKnownRibbonButton(KnownRibbonButtonKey.Underline, theme, 'RichTextUnderlineButtonIcon');\n};\n\nconst bulletListButton = (theme: Theme): RibbonButton<string> | undefined => {\n  return createKnownRibbonButton(KnownRibbonButtonKey.BulletedList, theme, 'RichTextBulletListButtonIcon');\n};\n\nconst numberListButton = (theme: Theme): RibbonButton<string> | undefined => {\n  return createKnownRibbonButton(KnownRibbonButtonKey.NumberedList, theme, 'RichTextNumberListButtonIcon');\n};\n\nconst indentIncreaseButton = (theme: Theme): RibbonButton<string> | undefined => {\n  return createKnownRibbonButton(KnownRibbonButtonKey.IncreaseIndent, theme, 'RichTextIndentIncreaseButtonIcon');\n};\n\nconst indentDecreaseButton = (theme: Theme): RibbonButton<string> | undefined => {\n  return createKnownRibbonButton(KnownRibbonButtonKey.DecreaseIndent, theme, 'RichTextIndentDecreaseButtonIcon');\n};\n\nconst createKnownRibbonButton = (\n  key: KnownRibbonButtonKey,\n  theme: Theme,\n  icon: string\n): RibbonButton<string> | undefined => {\n  const buttons = getButtons([key]);\n  if (buttons.length > 0) {\n    const button = buttons[0];\n    // AllButtonStringKeys is a union of all the string keys of all the buttons\n    const result = buttons[0] as RibbonButton<typeof button.key>;\n    button.iconName = icon;\n    button.commandBarProperties = {\n      ...button.commandBarProperties,\n      buttonStyles: {\n        ...button.commandBarProperties?.buttonStyles,\n        ...ribbonButtonStyle(theme)\n      },\n      canCheck: false\n    };\n    return result;\n  }\n  return undefined;\n};\n\n/**\n * @private\n */\nexport const ribbonButtons = (theme: Theme): RibbonButton<string>[] => {\n  const buttons: RibbonButton<string>[] = [];\n  [\n    boldButton(theme),\n    italicButton(theme),\n    underlineButton(theme),\n    dividerRibbonButton(theme, 'RichTextRibbonTextFormatDivider'),\n    bulletListButton(theme),\n    numberListButton(theme),\n    indentIncreaseButton(theme),\n    indentDecreaseButton(theme),\n    dividerRibbonButton(theme, 'RichTextRibbonTableDivider'),\n    insertTableButton(theme, MaxRowsNumber, MaxColumnsNumber)\n  ].forEach((item) => {\n    if (item !== undefined) {\n      buttons.push(item);\n    }\n  });\n\n  return buttons;\n};\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTableButton.d.ts

@@ -1,7 +0,0 @@
-import type { RibbonButton } from 'roosterjs-react';
-import type { Theme } from '@fluentui/react';
-/**
- * "Insert table" button for the RoosterJS ribbon
- */
-export declare const insertTableButton: (theme: Theme, maxRowsNumber: number, maxColumnsNumber: number) => RibbonButton<string>;
-//# sourceMappingURL=RichTextInsertTableButton.d.ts.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTableButton.js

@@ -1,56 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-import React from 'react';
-import { Icon, Stack } from '@fluentui/react';
-import { insertTable as insertTableAction } from './insertTableAction';
-import { insertTableMenuTablePane, ribbonTableButtonStyle } from '../../../styles/RichTextEditor.styles';
-import { RichTextInsertTablePane } from './RichTextInsertTablePane';
-import { ColumnRowReplaceString, parseKey } from '../../../utils/RichTextTableUtils';
-// This file uses RoosterJS React package implementation with updates to UI components and styles.
-/**
- * "Insert table" button for the RoosterJS ribbon
- */
-export const insertTableButton = (theme, maxRowsNumber, maxColumnsNumber) => {
-    return {
-        key: 'buttonNameInsertTable',
-        unlocalizedText: 'Insert table',
-        // Icon will be set in onRenderIcon callback
-        iconName: '',
-        onClick: (editor, key) => {
-            const { row, column } = parseKey(key);
-            insertTableAction(editor, column, row);
-        },
-        dropDownMenu: {
-            items: {
-                // the key of the item is also used as a key for localization
-                insertTablePane: `Insert ${ColumnRowReplaceString} table`
-            },
-            itemRender: (item, onClick) => {
-                return (React.createElement(RichTextInsertTablePane, { item: item, onClick: onClick, theme: theme, maxColumnsNumber: maxColumnsNumber, maxRowsNumber: maxRowsNumber }));
-            },
-            commandBarSubMenuProperties: {
-                className: insertTableMenuTablePane
-            }
-        },
-        commandBarProperties: {
-            // hide the chevron icon
-            menuIconProps: {
-                hidden: true
-            },
-            onRenderIcon: (item) => {
-                console.log('onRenderIcon', item);
-                return React.createElement(TableIcon, null);
-            },
-            buttonStyles: ribbonTableButtonStyle(theme),
-            canCheck: false
-        }
-    };
-};
-const TableIcon = () => {
-    return (
-    // update the visibility of the Table Icon with css classes that are triggered by command bar's state
-    React.createElement(Stack, null,
-        React.createElement(Icon, { iconName: "RichTextInsertTableFilledIcon", className: 'ribbon-table-button-filled-icon' }),
-        React.createElement(Icon, { iconName: "RichTextInsertTableRegularIcon", className: 'ribbon-table-button-regular-icon' })));
-};
-//# sourceMappingURL=RichTextInsertTableButton.js.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTableButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RichTextInsertTableButton.js","sourceRoot":"","sources":["../../../../../../../../../react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTableButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,WAAW,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGvE,OAAO,EAAE,wBAAwB,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AACzG,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,sBAAsB,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAErF,kGAAkG;AAElG;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,KAAY,EACZ,aAAqB,EACrB,gBAAwB,EACF,EAAE;IACxB,OAAO;QACL,GAAG,EAAE,uBAAuB;QAC5B,eAAe,EAAE,cAAc;QAC/B,4CAA4C;QAC5C,QAAQ,EAAE,EAAE;QACZ,OAAO,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE;YACvB,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC;YACtC,iBAAiB,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC;QACzC,CAAC;QACD,YAAY,EAAE;YACZ,KAAK,EAAE;gBACL,6DAA6D;gBAC7D,eAAe,EAAE,UAAU,sBAAsB,QAAQ;aAC1D;YACD,UAAU,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE;gBAC5B,OAAO,CACL,oBAAC,uBAAuB,IACtB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,gBAAgB,EAAE,gBAAgB,EAClC,aAAa,EAAE,aAAa,GAC5B,CACH,CAAC;YACJ,CAAC;YACD,2BAA2B,EAAE;gBAC3B,SAAS,EAAE,wBAAwB;aACpC;SACF;QACD,oBAAoB,EAAE;YACpB,wBAAwB;YACxB,aAAa,EAAE;gBACb,MAAM,EAAE,IAAI;aACb;YACD,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE;gBACrB,OAAO,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;gBAClC,OAAO,oBAAC,SAAS,OAAG,CAAC;YACvB,CAAC;YACD,YAAY,EAAE,sBAAsB,CAAC,KAAK,CAAC;YAC3C,QAAQ,EAAE,KAAK;SAChB;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,GAAgB,EAAE;IAClC,OAAO;IACL,qGAAqG;IACrG,oBAAC,KAAK;QACJ,oBAAC,IAAI,IAAC,QAAQ,EAAC,+BAA+B,EAAC,SAAS,EAAE,iCAAiC,GAAI;QAC/F,oBAAC,IAAI,IAAC,QAAQ,EAAC,gCAAgC,EAAC,SAAS,EAAE,kCAAkC,GAAI,CAC3F,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { Icon, Stack } from '@fluentui/react';\nimport { insertTable as insertTableAction } from './insertTableAction';\nimport type { RibbonButton } from 'roosterjs-react';\nimport type { Theme } from '@fluentui/react';\nimport { insertTableMenuTablePane, ribbonTableButtonStyle } from '../../../styles/RichTextEditor.styles';\nimport { RichTextInsertTablePane } from './RichTextInsertTablePane';\nimport { ColumnRowReplaceString, parseKey } from '../../../utils/RichTextTableUtils';\n\n// This file uses RoosterJS React package implementation with updates to UI components and styles.\n\n/**\n * \"Insert table\" button for the RoosterJS ribbon\n */\nexport const insertTableButton = (\n  theme: Theme,\n  maxRowsNumber: number,\n  maxColumnsNumber: number\n): RibbonButton<string> => {\n  return {\n    key: 'buttonNameInsertTable',\n    unlocalizedText: 'Insert table',\n    // Icon will be set in onRenderIcon callback\n    iconName: '',\n    onClick: (editor, key) => {\n      const { row, column } = parseKey(key);\n      insertTableAction(editor, column, row);\n    },\n    dropDownMenu: {\n      items: {\n        // the key of the item is also used as a key for localization\n        insertTablePane: `Insert ${ColumnRowReplaceString} table`\n      },\n      itemRender: (item, onClick) => {\n        return (\n          <RichTextInsertTablePane\n            item={item}\n            onClick={onClick}\n            theme={theme}\n            maxColumnsNumber={maxColumnsNumber}\n            maxRowsNumber={maxRowsNumber}\n          />\n        );\n      },\n      commandBarSubMenuProperties: {\n        className: insertTableMenuTablePane\n      }\n    },\n    commandBarProperties: {\n      // hide the chevron icon\n      menuIconProps: {\n        hidden: true\n      },\n      onRenderIcon: (item) => {\n        console.log('onRenderIcon', item);\n        return <TableIcon />;\n      },\n      buttonStyles: ribbonTableButtonStyle(theme),\n      canCheck: false\n    }\n  };\n};\n\nconst TableIcon = (): JSX.Element => {\n  return (\n    // update the visibility of the Table Icon with css classes that are triggered by command bar's state\n    <Stack>\n      <Icon iconName=\"RichTextInsertTableFilledIcon\" className={'ribbon-table-button-filled-icon'} />\n      <Icon iconName=\"RichTextInsertTableRegularIcon\" className={'ribbon-table-button-regular-icon'} />\n    </Stack>\n  );\n};\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTablePane.d.ts

@@ -1,16 +0,0 @@
-import React from 'react';
-import type { IContextualMenuItem, Theme } from '@fluentui/react';
-interface RichTextInsertTablePaneProps {
-    theme: Theme;
-    item: IContextualMenuItem;
-    onClick: (e: React.MouseEvent<Element> | React.KeyboardEvent<Element>, item: IContextualMenuItem) => void;
-    maxRowsNumber: number;
-    maxColumnsNumber: number;
-}
-/**
- * @private
- * Component for the insert table pane
- */
-export declare const RichTextInsertTablePane: (props: RichTextInsertTablePaneProps) => JSX.Element;
-export {};
-//# sourceMappingURL=RichTextInsertTablePane.d.ts.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTablePane.js

@@ -1,62 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-import React, { useMemo } from 'react';
-import { FocusZone, FocusZoneDirection, mergeStyles } from '@fluentui/react';
-import { insertTableMenuCellButtonSelectedStyles, insertTableMenuCellButtonStyles, insertTableMenuFocusZone, insertTableMenuTitleStyles } from '../../../styles/RichTextEditor.styles';
-import { ColumnRowReplaceString, createKey } from '../../../utils/RichTextTableUtils';
-// This file uses RoosterJS React package implementation with updates to UI components and styles.
-const RowColumnInitialValue = 0;
-/**
- * @private
- * Component for the insert table pane
- */
-export const RichTextInsertTablePane = (props) => {
-    const { item, onClick, theme, maxColumnsNumber, maxRowsNumber } = props;
-    const [column, setColumn] = React.useState(RowColumnInitialValue);
-    const [row, setRow] = React.useState(RowColumnInitialValue);
-    const updateSize = React.useCallback((target) => {
-        if (target !== undefined && target.dataset.column !== undefined && target.dataset.row !== undefined) {
-            const column = parseInt(target.dataset.column);
-            const row = parseInt(target.dataset.row);
-            if (column >= RowColumnInitialValue &&
-                column < maxColumnsNumber &&
-                row >= RowColumnInitialValue &&
-                row < maxRowsNumber) {
-                setColumn(column);
-                setRow(row);
-            }
-        }
-    }, [maxColumnsNumber, maxRowsNumber]);
-    const onMouseEnter = React.useCallback((e) => {
-        updateSize(e.target);
-    }, [updateSize]);
-    const onClickButton = React.useCallback((e) => {
-        onClick(e, Object.assign(Object.assign({}, item), { key: createKey(formatRowColumnText(row), formatRowColumnText(column)) }));
-    }, [row, column, onClick, item]);
-    const items = React.useMemo(() => {
-        var _a;
-        const items = [];
-        for (let i = 0; i < maxRowsNumber; i++) {
-            for (let j = 0; j < maxColumnsNumber; j++) {
-                const key = `cell_${i}_${j}`;
-                const isSelected = j <= column && i <= row;
-                items.push(React.createElement("button", { className: mergeStyles(insertTableMenuCellButtonStyles(theme), isSelected ? insertTableMenuCellButtonSelectedStyles(theme) : undefined), onClick: onClickButton, key: key, id: key, "data-column": j, "data-row": i, "data-is-focusable": true, onMouseEnter: onMouseEnter, "aria-label": formatText((_a = item.text) !== null && _a !== void 0 ? _a : '', i, j) }));
-            }
-        }
-        return items;
-    }, [maxRowsNumber, maxColumnsNumber, column, row, theme, onClickButton, onMouseEnter, item.text]);
-    const text = useMemo(() => {
-        var _a;
-        return formatText((_a = item.text) !== null && _a !== void 0 ? _a : '', formatRowColumnText(row), formatRowColumnText(column));
-    }, [column, item.text, row]);
-    return (React.createElement("div", null,
-        React.createElement("div", { className: insertTableMenuTitleStyles }, text),
-        React.createElement(FocusZone, { defaultTabbableElement: `cell_${RowColumnInitialValue}_${RowColumnInitialValue}`, direction: FocusZoneDirection.bidirectional, onActiveElementChanged: updateSize, className: insertTableMenuFocusZone(theme) }, items)));
-};
-const formatText = (text, row, column) => {
-    return text.replace(`${ColumnRowReplaceString}`, `${column.toString()} x ${row.toString()}`);
-};
-const formatRowColumnText = (value) => {
-    return value + 1;
-};
-//# sourceMappingURL=RichTextInsertTablePane.js.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTablePane.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RichTextInsertTablePane.js","sourceRoot":"","sources":["../../../../../../../../../react-components/src/components/RichTextEditor/Buttons/Table/RichTextInsertTablePane.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport { FocusZone, FocusZoneDirection, mergeStyles } from '@fluentui/react';\nimport type { IContextualMenuItem, Theme } from '@fluentui/react';\nimport {\n  insertTableMenuCellButtonSelectedStyles,\n  insertTableMenuCellButtonStyles,\n  insertTableMenuFocusZone,\n  insertTableMenuTitleStyles\n} from '../../../styles/RichTextEditor.styles';\nimport { ColumnRowReplaceString, createKey } from '../../../utils/RichTextTableUtils';\n\n// This file uses RoosterJS React package implementation with updates to UI components and styles.\nconst RowColumnInitialValue = 0;\n\ninterface RichTextInsertTablePaneProps {\n  theme: Theme;\n  item: IContextualMenuItem;\n  onClick: (e: React.MouseEvent<Element> | React.KeyboardEvent<Element>, item: IContextualMenuItem) => void;\n  maxRowsNumber: number;\n  maxColumnsNumber: number;\n}\n\n/**\n * @private\n * Component for the insert table pane\n */\nexport const RichTextInsertTablePane = (props: RichTextInsertTablePaneProps): JSX.Element => {\n  const { item, onClick, theme, maxColumnsNumber, maxRowsNumber } = props;\n  const [column, setColumn] = React.useState(RowColumnInitialValue);\n  const [row, setRow] = React.useState(RowColumnInitialValue);\n\n  const updateSize = React.useCallback(\n    (target?: HTMLElement) => {\n      if (target !== undefined && target.dataset.column !== undefined && target.dataset.row !== undefined) {\n        const column = parseInt(target.dataset.column);\n        const row = parseInt(target.dataset.row);\n\n        if (\n          column >= RowColumnInitialValue &&\n          column < maxColumnsNumber &&\n          row >= RowColumnInitialValue &&\n          row < maxRowsNumber\n        ) {\n          setColumn(column);\n          setRow(row);\n        }\n      }\n    },\n    [maxColumnsNumber, maxRowsNumber]\n  );\n\n  const onMouseEnter = React.useCallback(\n    (e: React.MouseEvent<HTMLButtonElement>) => {\n      updateSize(e.target as HTMLElement);\n    },\n    [updateSize]\n  );\n\n  const onClickButton = React.useCallback(\n    (e: React.MouseEvent<HTMLButtonElement>) => {\n      onClick(e, {\n        ...item,\n        key: createKey(formatRowColumnText(row), formatRowColumnText(column))\n      });\n    },\n    [row, column, onClick, item]\n  );\n\n  const items = React.useMemo(() => {\n    const items: JSX.Element[] = [];\n\n    for (let i = 0; i < maxRowsNumber; i++) {\n      for (let j = 0; j < maxColumnsNumber; j++) {\n        const key = `cell_${i}_${j}`;\n        const isSelected = j <= column && i <= row;\n        items.push(\n          <button\n            className={mergeStyles(\n              insertTableMenuCellButtonStyles(theme),\n              isSelected ? insertTableMenuCellButtonSelectedStyles(theme) : undefined\n            )}\n            onClick={onClickButton}\n            key={key}\n            id={key}\n            data-column={j}\n            data-row={i}\n            data-is-focusable={true}\n            onMouseEnter={onMouseEnter}\n            aria-label={formatText(item.text ?? '', i, j)}\n          />\n        );\n      }\n    }\n\n    return items;\n  }, [maxRowsNumber, maxColumnsNumber, column, row, theme, onClickButton, onMouseEnter, item.text]);\n\n  const text = useMemo(() => {\n    return formatText(item.text ?? '', formatRowColumnText(row), formatRowColumnText(column));\n  }, [column, item.text, row]);\n\n  return (\n    <div>\n      <div className={insertTableMenuTitleStyles}>{text}</div>\n      <FocusZone\n        defaultTabbableElement={`cell_${RowColumnInitialValue}_${RowColumnInitialValue}`}\n        direction={FocusZoneDirection.bidirectional}\n        onActiveElementChanged={updateSize}\n        className={insertTableMenuFocusZone(theme)}\n      >\n        {items}\n      </FocusZone>\n    </div>\n  );\n};\n\nconst formatText = (text: string, row: number, column: number): string => {\n  return text.replace(`${ColumnRowReplaceString}`, `${column.toString()} x ${row.toString()}`);\n};\n\nconst formatRowColumnText = (value: number): number => {\n  return value + 1;\n};\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextTableContextMenu.d.ts

@@ -1,8 +0,0 @@
-import { EditorPlugin } from 'roosterjs-editor-types-compatible';
-import { LocalizedStrings } from 'roosterjs-react';
-/**
- * Create a new instance of ContextMenuProvider to support table editing functionalities in context menu
- * @returns A new ContextMenuProvider
- */
-export declare const createTableEditMenuProvider: (strings?: LocalizedStrings<string>) => EditorPlugin;
-//# sourceMappingURL=RichTextTableContextMenu.d.ts.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextTableContextMenu.js

@@ -1,57 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-import { editTable } from 'roosterjs-editor-api';
-import { CompatibleTableOperation } from 'roosterjs-editor-types-compatible';
-import { createContextMenuProvider } from 'roosterjs-react';
-import { tableContextMenuStrings } from '../../../utils/RichTextEditorStringsUtils';
-const onClick = (key, editor) => {
-    editor.focus();
-    const operation = TableEditOperationMap[key];
-    if (typeof operation === 'number') {
-        editTable(editor, operation);
-    }
-};
-const TableEditOperationMap = {
-    menuNameTableInsertAbove: CompatibleTableOperation.InsertAbove,
-    menuNameTableInsertBelow: CompatibleTableOperation.InsertBelow,
-    menuNameTableInsertLeft: CompatibleTableOperation.InsertLeft,
-    menuNameTableInsertRight: CompatibleTableOperation.InsertRight,
-    menuNameTableDeleteTable: CompatibleTableOperation.DeleteTable,
-    menuNameTableDeleteColumn: CompatibleTableOperation.DeleteColumn,
-    menuNameTableDeleteRow: CompatibleTableOperation.DeleteRow
-};
-const tableEditInsertMenuItem = {
-    key: 'menuNameTableInsert',
-    unlocalizedText: 'Insert123',
-    subItems: {
-        menuNameTableInsertAbove: 'Insert above121312 ',
-        menuNameTableInsertBelow: 'Insert below',
-        menuNameTableInsertLeft: 'Insert left123 ',
-        menuNameTableInsertRight: 'Insert right'
-    },
-    onClick
-};
-const tableEditDeleteMenuItem = {
-    key: 'menuNameTableDelete',
-    unlocalizedText: 'Delete',
-    subItems: {
-        menuNameTableDeleteColumn: 'Delete column',
-        menuNameTableDeleteRow: 'Delete row',
-        menuNameTableDeleteTable: 'Delete table'
-    },
-    onClick
-};
-const tableActions = [tableEditInsertMenuItem, tableEditDeleteMenuItem];
-/**
- * Create a new instance of ContextMenuProvider to support table editing functionalities in context menu
- * @returns A new ContextMenuProvider
- */
-export const createTableEditMenuProvider = (strings) => {
-    return createContextMenuProvider('tableEdit', tableActions, tableContextMenuStrings(strings !== null && strings !== void 0 ? strings : {}), (editor, node) => !!getEditingTable(editor, node));
-};
-const getEditingTable = (editor, node) => {
-    const td = editor.getElementAtCursor('TD,TH', node);
-    const table = td && editor.getElementAtCursor('table', td);
-    return (table === null || table === void 0 ? void 0 : table.isContentEditable) ? { table, td } : null;
-};
-//# sourceMappingURL=RichTextTableContextMenu.js.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/RichTextTableContextMenu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RichTextTableContextMenu.js","sourceRoot":"","sources":["../../../../../../../../../react-components/src/components/RichTextEditor/Buttons/Table/RichTextTableContextMenu.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,wBAAwB,EAAyB,MAAM,mCAAmC,CAAC;AACpG,OAAO,EAAmB,yBAAyB,EAAoB,MAAM,iBAAiB,CAAC;AAC/F,OAAO,EAAE,uBAAuB,EAAE,MAAM,2CAA2C,CAAC;AAEpF,MAAM,OAAO,GAAG,CAAC,GAAW,EAAE,MAAe,EAAQ,EAAE;IACrD,MAAM,CAAC,KAAK,EAAE,CAAC;IACf,MAAM,SAAS,GAAG,qBAAqB,CAAC,GAAG,CAAC,CAAC;IAC7C,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE,CAAC;QAClC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAC/B,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,qBAAqB,GAAsD;IAC/E,wBAAwB,EAAE,wBAAwB,CAAC,WAAW;IAC9D,wBAAwB,EAAE,wBAAwB,CAAC,WAAW;IAC9D,uBAAuB,EAAE,wBAAwB,CAAC,UAAU;IAC5D,wBAAwB,EAAE,wBAAwB,CAAC,WAAW;IAC9D,wBAAwB,EAAE,wBAAwB,CAAC,WAAW;IAC9D,yBAAyB,EAAE,wBAAwB,CAAC,YAAY;IAChE,sBAAsB,EAAE,wBAAwB,CAAC,SAAS;CAC3D,CAAC;AAEF,MAAM,uBAAuB,GAA4B;IACvD,GAAG,EAAE,qBAAqB;IAC1B,eAAe,EAAE,WAAW;IAC5B,QAAQ,EAAE;QACR,wBAAwB,EAAE,qBAAqB;QAC/C,wBAAwB,EAAE,cAAc;QACxC,uBAAuB,EAAE,iBAAiB;QAC1C,wBAAwB,EAAE,cAAc;KACzC;IACD,OAAO;CACR,CAAC;AAEF,MAAM,uBAAuB,GAA4B;IACvD,GAAG,EAAE,qBAAqB;IAC1B,eAAe,EAAE,QAAQ;IACzB,QAAQ,EAAE;QACR,yBAAyB,EAAE,eAAe;QAC1C,sBAAsB,EAAE,YAAY;QACpC,wBAAwB,EAAE,cAAc;KACzC;IACD,OAAO;CACR,CAAC;AAEF,MAAM,YAAY,GAA8B,CAAC,uBAAuB,EAAE,uBAAuB,CAAC,CAAC;AAEnG;;;GAGG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,OAAkC,EAAgB,EAAE;IAC9F,OAAO,yBAAyB,CAC9B,WAAW,EACX,YAAY,EACZ,uBAAuB,CAAC,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,EAAE,CAAC,EACtC,CAAC,MAAe,EAAE,IAAU,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,MAAM,EAAE,IAAI,CAAC,CACjE,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CAAC,MAAe,EAAE,IAAU,EAAgE,EAAE;IACpH,MAAM,EAAE,GAAG,MAAM,CAAC,kBAAkB,CAAC,OAAO,EAAE,IAAI,CAAyB,CAAC;IAC5E,MAAM,KAAK,GAAG,EAAE,IAAK,MAAM,CAAC,kBAAkB,CAAC,OAAO,EAAE,EAAE,CAAsB,CAAC;IAEjF,OAAO,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,iBAAiB,EAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;AACzD,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport { editTable } from 'roosterjs-editor-api';\nimport { CompatibleTableOperation, EditorPlugin, IEditor } from 'roosterjs-editor-types-compatible';\nimport { ContextMenuItem, createContextMenuProvider, LocalizedStrings } from 'roosterjs-react';\nimport { tableContextMenuStrings } from '../../../utils/RichTextEditorStringsUtils';\n\nconst onClick = (key: string, editor: IEditor): void => {\n  editor.focus();\n  const operation = TableEditOperationMap[key];\n  if (typeof operation === 'number') {\n    editTable(editor, operation);\n  }\n};\n\nconst TableEditOperationMap: Partial<Record<string, CompatibleTableOperation>> = {\n  menuNameTableInsertAbove: CompatibleTableOperation.InsertAbove,\n  menuNameTableInsertBelow: CompatibleTableOperation.InsertBelow,\n  menuNameTableInsertLeft: CompatibleTableOperation.InsertLeft,\n  menuNameTableInsertRight: CompatibleTableOperation.InsertRight,\n  menuNameTableDeleteTable: CompatibleTableOperation.DeleteTable,\n  menuNameTableDeleteColumn: CompatibleTableOperation.DeleteColumn,\n  menuNameTableDeleteRow: CompatibleTableOperation.DeleteRow\n};\n\nconst tableEditInsertMenuItem: ContextMenuItem<string> = {\n  key: 'menuNameTableInsert',\n  unlocalizedText: 'Insert123',\n  subItems: {\n    menuNameTableInsertAbove: 'Insert above121312 ',\n    menuNameTableInsertBelow: 'Insert below',\n    menuNameTableInsertLeft: 'Insert left123 ',\n    menuNameTableInsertRight: 'Insert right'\n  },\n  onClick\n};\n\nconst tableEditDeleteMenuItem: ContextMenuItem<string> = {\n  key: 'menuNameTableDelete',\n  unlocalizedText: 'Delete',\n  subItems: {\n    menuNameTableDeleteColumn: 'Delete column',\n    menuNameTableDeleteRow: 'Delete row',\n    menuNameTableDeleteTable: 'Delete table'\n  },\n  onClick\n};\n\nconst tableActions: ContextMenuItem<string>[] = [tableEditInsertMenuItem, tableEditDeleteMenuItem];\n\n/**\n * Create a new instance of ContextMenuProvider to support table editing functionalities in context menu\n * @returns A new ContextMenuProvider\n */\nexport const createTableEditMenuProvider = (strings?: LocalizedStrings<string>): EditorPlugin => {\n  return createContextMenuProvider(\n    'tableEdit',\n    tableActions,\n    tableContextMenuStrings(strings ?? {}),\n    (editor: IEditor, node: Node) => !!getEditingTable(editor, node)\n  );\n};\n\nconst getEditingTable = (editor: IEditor, node: Node): { table: HTMLTableElement; td: HTMLTableCellElement } | null => {\n  const td = editor.getElementAtCursor('TD,TH', node) as HTMLTableCellElement;\n  const table = td && (editor.getElementAtCursor('table', td) as HTMLTableElement);\n\n  return table?.isContentEditable ? { table, td } : null;\n};\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/insertTableAction.d.ts

@@ -1,9 +0,0 @@
-import type { IEditor } from 'roosterjs-editor-types-compatible';
-/**
- * Insert table into editor at current selection
- * @param editor The editor instance
- * @param columns Number of columns in table
- * @param rows Number of rows in table
- */
-export declare const insertTable: (editor: IEditor, columns: number, rows: number) => void;
-//# sourceMappingURL=insertTableAction.d.ts.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/insertTableAction.js

@@ -1,34 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-import { Position, VTable } from 'roosterjs-editor-dom';
-import { CompatibleChangeSource, CompatiblePositionType } from 'roosterjs-editor-types-compatible';
-// This file  uses RoosterJS React package implementation with updates to change table's size and remove styles
-/**
- * Insert table into editor at current selection
- * @param editor The editor instance
- * @param columns Number of columns in table
- * @param rows Number of rows in table
- */
-export const insertTable = (editor, columns, rows) => {
-    const document = editor.getDocument();
-    const table = document.createElement('table');
-    for (let i = 0; i < rows; i++) {
-        const tr = document.createElement('tr');
-        table.appendChild(tr);
-        for (let j = 0; j < columns; j++) {
-            const td = document.createElement('td');
-            tr.appendChild(td);
-            td.appendChild(document.createElement('br'));
-        }
-    }
-    editor.focus();
-    editor.addUndoSnapshot(() => {
-        const vTable = new VTable(table);
-        vTable.writeBack();
-        editor.insertNode(table);
-        editor.runAsync((editor) => editor.select(new Position(table, CompatiblePositionType.Begin).normalize()));
-    }, CompatibleChangeSource.Format, undefined /* canUndoByBackspace */, {
-        formatApiName: 'insertTable'
-    });
-};
-//# sourceMappingURL=insertTableAction.js.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/Buttons/Table/insertTableAction.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"insertTableAction.js","sourceRoot":"","sources":["../../../../../../../../../react-components/src/components/RichTextEditor/Buttons/Table/insertTableAction.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAC;AAEnG,+GAA+G;AAE/G;;;;;GAKG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAe,EAAE,OAAe,EAAE,IAAY,EAAQ,EAAE;IAClF,MAAM,QAAQ,GAAG,MAAM,CAAC,WAAW,EAAE,CAAC;IACtC,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAqB,CAAC;IAClE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC;QAC9B,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAwB,CAAC;QAC/D,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;QACtB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC;YACjC,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAyB,CAAC;YAChE,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;YACnB,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC;QAC/C,CAAC;IACH,CAAC;IAED,MAAM,CAAC,KAAK,EAAE,CAAC;IACf,MAAM,CAAC,eAAe,CACpB,GAAG,EAAE;QACH,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC;QACjC,MAAM,CAAC,SAAS,EAAE,CAAC;QACnB,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QACzB,MAAM,CAAC,QAAQ,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,QAAQ,CAAC,KAAK,EAAE,sBAAsB,CAAC,KAAK,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;IAC5G,CAAC,EACD,sBAAsB,CAAC,MAAM,EAC7B,SAAS,CAAC,wBAAwB,EAClC;QACE,aAAa,EAAE,aAAa;KAC7B,CACF,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport { Position, VTable } from 'roosterjs-editor-dom';\nimport type { IEditor } from 'roosterjs-editor-types-compatible';\nimport { CompatibleChangeSource, CompatiblePositionType } from 'roosterjs-editor-types-compatible';\n\n// This file  uses RoosterJS React package implementation with updates to change table's size and remove styles\n\n/**\n * Insert table into editor at current selection\n * @param editor The editor instance\n * @param columns Number of columns in table\n * @param rows Number of rows in table\n */\nexport const insertTable = (editor: IEditor, columns: number, rows: number): void => {\n  const document = editor.getDocument();\n  const table = document.createElement('table') as HTMLTableElement;\n  for (let i = 0; i < rows; i++) {\n    const tr = document.createElement('tr') as HTMLTableRowElement;\n    table.appendChild(tr);\n    for (let j = 0; j < columns; j++) {\n      const td = document.createElement('td') as HTMLTableCellElement;\n      tr.appendChild(td);\n      td.appendChild(document.createElement('br'));\n    }\n  }\n\n  editor.focus();\n  editor.addUndoSnapshot(\n    () => {\n      const vTable = new VTable(table);\n      vTable.writeBack();\n      editor.insertNode(table);\n      editor.runAsync((editor) => editor.select(new Position(table, CompatiblePositionType.Begin).normalize()));\n    },\n    CompatibleChangeSource.Format,\n    undefined /* canUndoByBackspace */,\n    {\n      formatApiName: 'insertTable'\n    }\n  );\n};\n"]}