@atlaskit/adf-schema 49.0.5 → 49.1.0

package/dist/es2019/schema/nodes/emoji.js

@@ -1,5 +1,6 @@
 import { acNameToEmoji, acShortcutToEmoji } from '../../utils/confluence/emoji';
 import { emoji as emojiFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name emoji_node
@@ -58,4 +59,74 @@ export const emoji = emojiFactory({
     };
     return ['span', attrs, text];
   }
+});
+export const emojiWithLocalId = emojiFactory({
+  parseDOM: [
+  // Handle copy/paste beautiful panel from renderer />
+  {
+    tag: 'div.ak-editor-panel__icon span',
+    ignore: true
+  }, {
+    tag: 'span[data-emoji-short-name]',
+    getAttrs: domNode => {
+      const dom = domNode;
+      return {
+        shortName: dom.getAttribute('data-emoji-short-name') || emoji.attrs.shortName.default,
+        id: dom.getAttribute('data-emoji-id') || emoji.attrs.id.default,
+        text: dom.getAttribute('data-emoji-text') || emoji.attrs.text.default,
+        localId: uuid.generate()
+      };
+    }
+  },
+  // Handle copy/paste from old <ac:emoticon />
+  {
+    tag: 'img[data-emoticon-name]',
+    getAttrs: dom => {
+      const attrs = acNameToEmoji(dom.getAttribute('data-emoticon-name'));
+      return {
+        ...attrs,
+        localId: uuid.generate()
+      };
+    }
+  },
+  // Handle copy/paste from old <ac:hipchat-emoticons />
+  {
+    tag: 'img[data-hipchat-emoticon]',
+    getAttrs: dom => {
+      const attrs = acShortcutToEmoji(dom.getAttribute('data-hipchat-emoticon'));
+      return {
+        ...attrs,
+        localId: uuid.generate()
+      };
+    }
+  },
+  // Handle copy/paste from bitbucket's <img class="emoji" />
+  {
+    tag: 'img.emoji[data-emoji-short-name]',
+    getAttrs: domNode => {
+      const dom = domNode;
+      return {
+        shortName: dom.getAttribute('data-emoji-short-name') || emoji.attrs.shortName.default,
+        id: dom.getAttribute('data-emoji-id') || emoji.attrs.id.default,
+        text: dom.getAttribute('data-emoji-text') || emoji.attrs.text.default,
+        localId: uuid.generate()
+      };
+    }
+  }],
+  toDOM(node) {
+    var _node$attrs;
+    const {
+      shortName,
+      id,
+      text
+    } = node.attrs;
+    const attrs = {
+      'data-emoji-short-name': shortName,
+      'data-emoji-id': id,
+      'data-emoji-text': text,
+      contenteditable: 'false',
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
+    };
+    return ['span', attrs, text];
+  }
 });

package/dist/es2019/schema/nodes/expand.js

@@ -1,4 +1,5 @@
 import { expand as expandFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name expand_node
@@ -52,6 +53,64 @@ const nodeSpecOptions = {
   }
 };
 export const expandWithNestedExpand = expandFactory(nodeSpecOptions);
+export const expandWithNestedExpandLocalId = expandFactory({
+  parseDOM: [{
+    context: 'table//',
+    tag: 'div[data-node-type="expand"]',
+    getAttrs: dom => {
+      const attrs = getExpandAttrs(dom);
+      return {
+        ...attrs,
+        localId: uuid.generate()
+      };
+    }
+  }, {
+    context: 'expand//',
+    tag: '[data-node-type="expand"]',
+    getAttrs: dom => {
+      const attrs = getExpandAttrs(dom);
+      return {
+        ...attrs,
+        localId: uuid.generate()
+      };
+    }
+  }, {
+    context: 'nestedExpand//',
+    tag: '[data-node-type="expand"]',
+    getAttrs: dom => {
+      const attrs = getExpandAttrs(dom);
+      return {
+        ...attrs,
+        localId: uuid.generate()
+      };
+    }
+  }, {
+    tag: '[data-node-type="nestedExpand"] button',
+    ignore: true
+  }, {
+    tag: '[data-node-type="expand"] button',
+    ignore: true
+  }, {
+    tag: 'div[data-node-type="expand"]',
+    getAttrs: dom => {
+      const attrs = getExpandAttrs(dom);
+      return {
+        ...attrs,
+        localId: uuid.generate()
+      };
+    }
+  }],
+  toDOM(node) {
+    var _node$attrs;
+    const attrs = {
+      'data-node-type': 'expand',
+      'data-title': node.attrs.title,
+      'data-expanded': node.attrs.__expanded,
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
+    };
+    return ['div', attrs, 0];
+  }
+});
 export const toJSON = node => ({
   attrs: Object.keys(node.attrs).filter(key => !key.startsWith('__')).reduce((obj, key) => {
     return {

package/dist/es2019/schema/nodes/hard-break.js

@@ -1,3 +1,4 @@
+import { uuid } from '../../utils/uuid';
 import { hardBreak as hardBreakFactory } from '../../next-schema/generated/nodeTypes';
 
 /**
@@ -11,4 +12,18 @@ export const hardBreak = hardBreakFactory({
   toDOM() {
     return ['br'];
   }
+});
+export const hardBreakWithLocalId = hardBreakFactory({
+  parseDOM: [{
+    tag: 'br',
+    getAttrs: () => ({
+      localId: uuid.generate()
+    })
+  }],
+  toDOM(node) {
+    var _node$attrs;
+    return ['br', {
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
+    }];
+  }
 });

package/dist/es2019/schema/nodes/index.js

@@ -1,44 +1,44 @@
-export { expandWithNestedExpand, toJSON as expandToJSON } from './expand';
+export { expandWithNestedExpand, expandWithNestedExpandLocalId, toJSON as expandToJSON } from './expand';
 export { confluenceJiraIssue } from './confluence-jira-issue';
 export { confluenceUnsupportedBlock } from './confluence-unsupported-block';
 export { confluenceUnsupportedInline } from './confluence-unsupported-inline';
 export { doc } from './doc';
-export { blockquote, extendedBlockquote } from './blockquote';
-export { bulletList, bulletListSelector } from './bullet-list';
-export { codeBlock, toJSON as codeBlockToJSON } from './code-block';
-export { hardBreak } from './hard-break';
+export { blockquote, extendedBlockquote, extendedBlockquoteWithLocalId } from './blockquote';
+export { bulletList, bulletListSelector, bulletListWithLocalId } from './bullet-list';
+export { codeBlock, codeBlockWithLocalId, toJSON as codeBlockToJSON } from './code-block';
+export { hardBreak, hardBreakWithLocalId } from './hard-break';
 export { heading } from './heading';
-export { rule } from './rule';
-export { orderedList, orderedListSelector, orderedListWithOrder } from './ordered-list';
+export { rule, ruleWithLocalId } from './rule';
+export { orderedList, orderedListSelector, orderedListWithLocalId, orderedListWithOrder, orderedListWithOrderAndLocalId } from './ordered-list';
 export { paragraph } from './paragraph';
-export { emoji } from './emoji';
+export { emoji, emojiWithLocalId } from './emoji';
 export { image } from './image';
 export { mention, toJSON as mentionToJSON } from './mention';
 export { listItem, listItemWithDecisionStage0 } from './list-item';
-export { extendedPanel, PanelType } from './panel';
+export { extendedPanel, extendedPanelWithLocalId, PanelType } from './panel';
 export { text } from './text';
 export { default as unknownBlock } from './unknown-block';
-export { caption } from './caption';
+export { caption, captionWithLocalId } from './caption';
 export { media, copyPrivateAttributes as copyPrivateMediaAttributes, toJSON as mediaToJSON } from './media';
 export { mediaGroup } from './media-group';
 export { mediaInline } from './media-inline';
-export { mediaSingle, mediaSingleSpec, mediaSingleWithCaption, mediaSingleWithWidthType, mediaSingleFull, toJSON as mediaSingleToJSON } from './media-single';
+export { mediaSingle, mediaSingleSpec, mediaSingleWithCaption, mediaSingleWithWidthType, mediaSingleFull, mediaSingleFullWithLocalId, toJSON as mediaSingleToJSON } from './media-single';
 export { table, tableWithNestedTable, tableRowWithNestedTable, tableCellWithNestedTable, tableHeaderWithNestedTable, tableStage0, tableWithCustomWidth, tableToJSON, tableCell, toJSONTableCell, tableHeader, toJSONTableHeader, tableRow, tableBackgroundColorPalette, tableBackgroundBorderColor, tableBackgroundColorNames, getCellAttrs, getCellDomAttrs, tablePrefixSelector, tableCellSelector, tableHeaderSelector, tableCellContentWrapperSelector, tableCellContentDomSelector } from './tableNodes';
 export { decisionList, decisionListSelector } from './decision-list';
 export { decisionItem } from './decision-item';
 export { taskList, taskListSelector } from './task-list';
 export { taskItem } from './task-item';
-export { date } from './date';
-export { placeholder } from './placeholder';
-export { layoutSection, layoutSectionWithSingleColumn } from './layout-section';
-export { layoutColumn } from './layout-column';
-export { inlineCard } from './inline-card';
-export { blockCard } from './block-card';
+export { date, dateWithLocalId } from './date';
+export { placeholder, placeholderWithLocalId } from './placeholder';
+export { layoutSection, layoutSectionWithSingleColumn, layoutSectionWithSingleColumnLocalId } from './layout-section';
+export { layoutColumn, layoutColumnWithLocalId } from './layout-column';
+export { inlineCard, inlineCardWithLocalId } from './inline-card';
+export { blockCard, blockCardWithLocalId } from './block-card';
 export { unsupportedBlock } from './unsupported-block';
 export { unsupportedInline } from './unsupported-inline';
 export { status } from './status';
-export { nestedExpand } from './nested-expand';
-export { embedCard } from './embed-card';
+export { nestedExpand, nestedExpandWithLocalId } from './nested-expand';
+export { embedCard, embedCardWithLocalId } from './embed-card';
 // Extensions
 export { extension } from './extension';
 export { inlineExtension } from './inline-extension';

package/dist/es2019/schema/nodes/inline-card.js

@@ -1,4 +1,5 @@
 import { inlineCard as inlineCardFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name inlineCard_node
@@ -44,4 +45,48 @@ export const inlineCard = inlineCardFactory({
       return ['a', attrs];
     }
   }
+});
+export const inlineCardWithLocalId = inlineCardFactory({
+  parseDOM: [{
+    tag: 'a[data-inline-card], span[data-inline-card]',
+    // bump priority higher than hyperlink
+    priority: 100,
+    getAttrs: dom => {
+      const anchor = dom;
+      const data = anchor.getAttribute('data-card-data');
+
+      /* Support attrs from Editor and Renderer */
+      return {
+        url: anchor.getAttribute('href') || anchor.getAttribute('data-card-url') || null,
+        data: data ? JSON.parse(data) : null
+      };
+    }
+  },
+  // for renderer
+  {
+    tag: 'div[data-inline-card]',
+    getAttrs: dom => {
+      const anchor = dom;
+      const data = anchor.getAttribute('data-card-data');
+      return {
+        url: anchor.getAttribute('data-card-url'),
+        data: data ? JSON.parse(data) : null,
+        localId: uuid.generate()
+      };
+    }
+  }],
+  toDOM(node) {
+    var _node$attrs;
+    const attrs = {
+      'data-inline-card': '',
+      href: node.attrs.url || '',
+      'data-card-data': node.attrs.data ? JSON.stringify(node.attrs.data) : '',
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
+    };
+    if (node.attrs.url) {
+      return ['a', attrs, node.attrs.url];
+    } else {
+      return ['a', attrs];
+    }
+  }
 });

package/dist/es2019/schema/nodes/layout-column.js

@@ -1,4 +1,5 @@
 import { layoutColumn as layoutColumnFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name layoutColumn_node
@@ -30,6 +31,43 @@ export const layoutColumn = layoutColumnFactory({
       attrs['data-column-width'] = `${width}`;
     }
 
+    // We need to apply a attribute to the inner most child to help
+    // ProseMirror identify its boundaries better.
+    const contentAttrs = {
+      'data-layout-content': 'true'
+    };
+    return ['div', attrs, ['div', contentAttrs, 0]];
+  }
+});
+export const layoutColumnWithLocalId = layoutColumnFactory({
+  parseDOM: [{
+    context: 'layoutColumn//',
+    tag: 'div[data-layout-column]',
+    skip: true
+  }, {
+    tag: 'div[data-layout-column]',
+    getAttrs: domNode => {
+      const dom = domNode;
+      return {
+        width: Number(dom.getAttribute('data-column-width')) || undefined,
+        localId: uuid.generate()
+      };
+    }
+  }],
+  toDOM(node) {
+    var _node$attrs;
+    const attrs = {
+      'data-layout-column': 'true',
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
+    };
+    const {
+      width
+    } = node.attrs;
+    if (width) {
+      attrs['style'] = `flex-basis: ${width}%`;
+      attrs['data-column-width'] = `${width}`;
+    }
+
     // We need to apply a attribute to the inner most child to help
     // ProseMirror identify its boundaries better.
     const contentAttrs = {

package/dist/es2019/schema/nodes/layout-section.js

@@ -1,5 +1,6 @@
 import { layoutSection as layoutSectionFactory, layoutSectionWithSingleColumnStage0 as layoutSectionWithSingleColumnStage0Factory } from '../../next-schema/generated/nodeTypes';
 import { layoutSectionFull as layoutSectionFullFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name layoutSection_node
@@ -74,4 +75,35 @@ export const layoutSectionWithSingleColumn = layoutSectionWithSingleColumnStage0
     };
     return ['div', attrs, 0];
   }
+});
+export const layoutSectionWithSingleColumnLocalId = layoutSectionWithSingleColumnStage0Factory({
+  parseDOM: [{
+    context: 'layoutSection//|layoutColumn//',
+    tag: 'div[data-layout-section]',
+    skip: true
+  }, {
+    tag: 'div[data-layout-section]',
+    getAttrs: dom => {
+      const columnRuleStyle = dom.getAttribute('data-column-rule-style');
+      const localId = uuid.generate();
+      return columnRuleStyle ? {
+        columnRuleStyle,
+        localId
+      } : {
+        localId
+      };
+    }
+  }],
+  toDOM(node) {
+    var _node$attrs;
+    const {
+      columnRuleStyle
+    } = node.attrs;
+    const attrs = {
+      'data-layout-section': 'true',
+      'data-column-rule-style': columnRuleStyle || undefined,
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
+    };
+    return ['div', attrs, 0];
+  }
 });

package/dist/es2019/schema/nodes/list-item.js

@@ -1,3 +1,4 @@
+import { uuid } from '../../utils';
 import { listItem as listItemFactory, listItemWithNestedDecisionStage0 as listItemWithNestedDecisionStage0Factory } from '../../next-schema/generated/nodeTypes';
 
 /**
@@ -12,6 +13,20 @@ export const listItem = listItemFactory({
     return ['li', 0];
   }
 });
+export const listItemWithLocalId = listItemFactory({
+  parseDOM: [{
+    tag: 'li',
+    getAttrs: () => ({
+      localId: uuid.generate()
+    })
+  }],
+  toDOM(node) {
+    var _node$attrs;
+    return ['li', {
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
+    }, 0];
+  }
+});
 
 /**
  * @name list_item_with_decision_stage0
@@ -24,4 +39,18 @@ export const listItemWithDecisionStage0 = listItemWithNestedDecisionStage0Factor
   toDOM() {
     return ['li', 0];
   }
+});
+export const listItemWithNestedDecisionAndLocalIdStage0 = listItemWithNestedDecisionStage0Factory({
+  parseDOM: [{
+    tag: 'li',
+    getAttrs: () => ({
+      localId: uuid.generate()
+    })
+  }],
+  toDOM(node) {
+    var _node$attrs2;
+    return ['li', {
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId) || undefined
+    }, 0];
+  }
 });

package/dist/es2019/schema/nodes/media-inline.js

@@ -1,8 +1,15 @@
 import { createMediaSpec } from './media';
+import { uuid } from '../../utils/uuid';
 import { mediaInline as mediaInlineFactory } from '../../next-schema/generated/nodeTypes';
 
 /**
  * @name mediaInline_node
  */
 
-export const mediaInline = createMediaSpec(mediaInlineFactory({}).attrs, true);
+export const mediaInline = createMediaSpec(mediaInlineFactory({}).attrs, true);
+export const mediaInlineWithLocalId = createMediaSpec({
+  ...mediaInlineFactory({}).attrs,
+  localId: {
+    default: uuid.generate()
+  }
+}, true, true);

package/dist/es2019/schema/nodes/media-single.js

@@ -1,6 +1,7 @@
 import { WidthType } from './types/rich-media-common';
 import { isDOMElement } from '../../utils/parseDOM';
 import { mediaSingle as mediaSingleFactory, mediaSingleCaption as mediaSingleCaptionFactory, mediaSingleFull as mediaSingleFullFactory, mediaSingleWidthType as mediaSingleWidthTypeFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name mediaSingle_node
@@ -34,7 +35,8 @@ export const defaultAttrs = {
 };
 export const mediaSingleSpec = ({
   withCaption = false,
-  withExtendedWidthTypes = false
+  withExtendedWidthTypes = false,
+  generateLocalId = false
 }) => {
   const getAttrs = dom => {
     if (!isDOMElement(dom)) {
@@ -46,6 +48,14 @@ export const mediaSingleSpec = ({
     const layout = dom.getAttribute('data-layout') || 'center';
     const width = Number(dom.getAttribute('data-width')) || null;
     const widthType = dom.getAttribute('data-width-type');
+    if (generateLocalId) {
+      return {
+        layout,
+        width,
+        widthType,
+        localId: uuid.generate()
+      };
+    }
     if (withExtendedWidthTypes) {
       return {
         layout,
@@ -75,6 +85,10 @@ export const mediaSingleSpec = ({
       'data-layout': layout,
       'data-width': ''
     };
+    if (generateLocalId) {
+      var _node$attrs;
+      attrs['data-local-id'] = (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined;
+    }
     if (width) {
       attrs['data-width'] = isFinite(width) && Math.floor(width) === width ? width : width.toFixed(2);
     }
@@ -148,6 +162,11 @@ export const mediaSingleFull = mediaSingleSpec({
   withCaption: true,
   withExtendedWidthTypes: true
 });
+export const mediaSingleFullWithLocalId = mediaSingleSpec({
+  withCaption: true,
+  withExtendedWidthTypes: true,
+  generateLocalId: true
+});
 export const toJSON = node => ({
   attrs: Object.keys(node.attrs).reduce((obj, key) => {
     if (node.attrs[key] !== null) {

package/dist/es2019/schema/nodes/media.js

@@ -1,13 +1,14 @@
 import { N30 } from '../../utils/colors';
 import { media as mediaFactory } from '../../next-schema/generated/nodeTypes';
 import { mediaInline as mediaInlineFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name media_node
  */
 
 export const defaultAttrs = mediaFactory({}).attrs;
-export const createMediaSpec = (attributes, inline = false) => {
+export const createMediaSpec = (attributes, inline = false, generateLocalId = false) => {
   const domNodeType = inline ? 'span' : 'div';
   const nodeName = inline ? 'mediaInline' : 'media';
   const parseDOM = [{
@@ -45,6 +46,7 @@ export const createMediaSpec = (attributes, inline = false) => {
     ignore: true
   }];
   const toDOM = node => {
+    var _node$attrs;
     const attrs = {
       'data-id': node.attrs.id,
       'data-node-type': `${nodeName}`,
@@ -61,7 +63,8 @@ export const createMediaSpec = (attributes, inline = false) => {
       title: 'Attachment',
       // Manually kept in sync with the style of media cards. The goal is to render a plain gray
       // rectangle that provides an affordance for media.
-      style: `display: inline-block; border-radius: 3px; background: ${N30}; box-shadow: 0 1px 1px rgba(9, 30, 66, 0.2), 0 0 1px 0 rgba(9, 30, 66, 0.24);`
+      style: `display: inline-block; border-radius: 3px; background: ${N30}; box-shadow: 0 1px 1px rgba(9, 30, 66, 0.2), 0 0 1px 0 rgba(9, 30, 66, 0.24);`,
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
     };
     copyPrivateAttributes(node.attrs, attrs, key => `data-${camelCaseToKebabCase(key.slice(2))}`);
     return [`${domNodeType}`, attrs];
@@ -79,17 +82,27 @@ export const createMediaSpec = (attributes, inline = false) => {
       // https://product-fabric.atlassian.net/browse/EDM-2996
       tag: 'img:not(.smart-link-icon)',
       getAttrs: dom => {
-        return {
+        const attrs = {
           type: 'external',
           url: dom.getAttribute('src') || '',
           alt: dom.getAttribute('alt') || ''
         };
+        if (generateLocalId) {
+          attrs.localId = uuid.generate();
+        }
+        return attrs;
       }
     }],
     toDOM
   });
 };
-export const media = createMediaSpec(defaultAttrs, false);
+export const media = createMediaSpec(defaultAttrs, false, false);
+export const mediaWithLocalId = createMediaSpec({
+  ...defaultAttrs,
+  localId: {
+    default: uuid.generate()
+  }
+}, false, true);
 export const camelCaseToKebabCase = str => str.replace(/([^A-Z]+)([A-Z])/g, (_, x, y) => `${x}-${y.toLowerCase()}`);
 export const copyPrivateAttributes = (from, to, map) => {
   if (media.attrs) {

package/dist/es2019/schema/nodes/nested-expand.js

@@ -1,4 +1,5 @@
 import { nestedExpand as nestedExpandFactory } from '../../next-schema/generated/nodeTypes';
+import { uuid } from '../../utils/uuid';
 
 /**
  * @name nestedExpand_content
@@ -14,18 +15,19 @@ import { nestedExpand as nestedExpandFactory } from '../../next-schema/generated
  * @name nestedExpand_with_no_marks_node
  */
 
-function getExpandAttrs(domNode) {
+function getExpandAttrs(domNode, generateLocalId) {
   const dom = domNode;
   return {
     title: dom.getAttribute('data-title'),
-    __expanded: true
+    __expanded: true,
+    localId: generateLocalId ? uuid.generate() : undefined
   };
 }
 const nestedExpandFactoryOptions = {
   parseDOM: [{
     context: 'nestedExpand//',
     tag: '[data-node-type="nestedExpand"]',
-    getAttrs: getExpandAttrs
+    getAttrs: domNode => getExpandAttrs(domNode, false)
   }, {
     tag: '[data-node-type="nestedExpand"] button',
     ignore: true
@@ -34,13 +36,15 @@ const nestedExpandFactoryOptions = {
     ignore: true
   }, {
     tag: 'div[data-node-type="nestedExpand"]',
-    getAttrs: getExpandAttrs
+    getAttrs: domNode => getExpandAttrs(domNode, false)
   }],
   toDOM(node) {
+    var _node$attrs;
     const attrs = {
       'data-node-type': 'nestedExpand',
       'data-title': node.attrs.title,
-      'data-expanded': node.attrs.__expanded
+      'data-expanded': node.attrs.__expanded,
+      'data-local-id': (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) || undefined
     };
     return ['div', attrs, 0];
   }
@@ -50,4 +54,15 @@ const nestedExpandFactoryOptions = {
  * @name nestedExpand
  * @description an expand that can be nested (eg. inside table, layout).
  */
-export const nestedExpand = nestedExpandFactory(nestedExpandFactoryOptions);
+export const nestedExpand = nestedExpandFactory(nestedExpandFactoryOptions);
+export const nestedExpandWithLocalId = nestedExpandFactory({
+  ...nestedExpandFactoryOptions,
+  parseDOM: [...nestedExpandFactoryOptions.parseDOM, {
+    context: 'nestedExpand//',
+    tag: '[data-node-type="nestedExpand"]',
+    getAttrs: domNode => getExpandAttrs(domNode, true)
+  }, {
+    tag: '[data-node-type="nestedExpand"]',
+    getAttrs: domNode => getExpandAttrs(domNode, true)
+  }]
+});