Revert "feat: adds <th> table_header_cell element support"

This reverts commit 36ad6f4.

packages/html-to-slate-ast/src/index.ts

@@ -16,7 +16,7 @@ const ELEMENT_TAGS: Record<
  OL: () => ({ type: 'numbered-list' }),
  UL: () => ({ type: 'bulleted-list' }),
  P: () => ({ type: 'paragraph' }),
- A: el => {
+ A: (el) => {
  const href = el.getAttribute('href');
  if (href === null) return {};
  return {
@@ -43,8 +43,8 @@ const ELEMENT_TAGS: Record<
  TBODY: () => ({ type: 'table_body' }),
  TR: () => ({ type: 'table_row' }),
  TD: () => ({ type: 'table_cell' }),
- TH: () => ({ type: 'table_header_cell' }),
- IMG: el => {
+ TH: () => ({ type: 'table_cell' }),
+ IMG: (el) => {
  const href = el.getAttribute('src');
  const title = Boolean(el.getAttribute('alt'))
  ? el.getAttribute('alt')
@@ -108,7 +108,7 @@ function deserialize<
  parent = el.childNodes[0];
  }
  let children = Array.from(parent.childNodes)
- .map(c => deserialize(c, global))
+ .map((c) => deserialize(c, global))
  .flat();
 
  if (children.length === 0) {
@@ -124,7 +124,7 @@ function deserialize<
  if (
  isElementNode(el) &&
  Array.from(el.attributes).find(
- attr => attr.name === 'role' && attr.value === 'heading'
+ (attr) => attr.name === 'role' && attr.value === 'heading'
  )
  ) {
  const level = el.attributes.getNamedItem('aria-level')?.value;
@@ -158,15 +158,15 @@ function deserialize<
  // li children must be rendered in spans, like in list plugin
  if (nodeName === 'LI') {
  const hasNestedListChild = children.find(
- item =>
+ (item) =>
  SlateElement.isElement(item) &&
  // if element has a nested list as a child, all children must be wrapped in individual list-item-child nodes
  // TODO: sync with GCMS types for Slate elements
  // @ts-expect-error
  (item.type === 'numbered-list' || item.type === 'bulleted-list')
  );
  if (hasNestedListChild) {
- const wrappedChildren = children.map(item =>
+ const wrappedChildren = children.map((item) =>
  jsx('element', { type: 'list-item-child' }, item)
  );
  return jsx('element', attrs, wrappedChildren);
@@ -202,7 +202,7 @@ function deserialize<
  children: [{ text: '' }],
  },
  ]
- : childNodes.map(child => ({
+ : childNodes.map((child) => ({
  type: 'paragraph',
  children: [{ text: child.textContent ? child.textContent : '' }],
  }));
@@ -216,7 +216,7 @@ function deserialize<
  if (nodeName === 'DIV') {
  const childNodes = Array.from(el.childNodes);
  const isParagraph = childNodes.every(
- child =>
+ (child) =>
  (isElementNode(child) && isInlineElement(child)) || isTextNode(child)
  );
  if (isParagraph) {
@@ -254,15 +254,15 @@ function deserialize<
  const attrs = tagNames.reduce((acc, current) => {
  return { ...acc, ...TEXT_TAGS[current]() };
  }, {});
- return children.map(child => {
+ return children.map((child) => {
  if (typeof child === 'string') {
  return jsx('text', attrs, child);
  }
 
  if (isChildNode(child, global)) return child;
 
  if (SlateElement.isElement(child) && !SlateText.isText(child)) {
- child.children = child.children.map(c => ({ ...c, ...attrs }));
+ child.children = child.children.map((c) => ({ ...c, ...attrs }));
  return child;
  }
 
@@ -273,15 +273,15 @@ function deserialize<
 
  if (TEXT_TAGS[nodeName]) {
  const attrs = TEXT_TAGS[nodeName](el as HTMLElement);
- return children.map(child => {
+ return children.map((child) => {
  if (typeof child === 'string') {
  return jsx('text', attrs, child);
  }
 
  if (isChildNode(child, global)) return child;
 
  if (SlateElement.isElement(child) && !SlateText.isText(child)) {
- child.children = child.children.map(c => ({ ...c, ...attrs }));
+ child.children = child.children.map((c) => ({ ...c, ...attrs }));
  return child;
  }
 
@@ -453,7 +453,7 @@ export async function htmlToSlateAST(html: string) {
  const domDocument = await parseDomDocument(normalizedHTML);
  const global = await (async () => {
  if (typeof window !== 'undefined') return window;
- return await import('jsdom').then(jsdom => new jsdom.JSDOM().window);
+ return await import('jsdom').then((jsdom) => new jsdom.JSDOM().window);
  })();
  return deserialize(domDocument.body, global);
 }

packages/react-renderer/README.md

@@ -131,8 +131,6 @@ Below you can check the full list of elements you can customize, alongside the p
  - `children`: ReactNode;
 - `table_head`
  - `children`: ReactNode;
-- `table_header`
- - `children`: ReactNode;
 - `table_body`
  - `children`: ReactNode;
 - `table_row`

packages/react-renderer/src/defaultElements.tsx

@@ -38,7 +38,6 @@ export const defaultElements: Required<NodeRendererType> = {
  table_body: ({ children }) => <tbody>{children}</tbody>,
  table_row: ({ children }) => <tr>{children}</tr>,
  table_cell: ({ children }) => <td>{children}</td>,
- table_header_cell: ({ children }) => <th>{children}</th>,
  bold: ({ children }) => <b>{children}</b>,
  italic: ({ children }) => <i>{children}</i>,
  underline: ({ children }) => <u>{children}</u>,
@@ -58,9 +57,9 @@ export const defaultElements: Required<NodeRendererType> = {
  ),
  list_item_child: ({ children }) => <>{children}</>,
  Asset: {
- audio: props => <Audio {...props} url={props.url} />,
- image: props => <Image {...props} src={props.url} />,
- video: props => <Video {...props} src={props.url} />,
+ audio: (props) => <Audio {...props} url={props.url} />,
+ image: (props) => <Image {...props} src={props.url} />,
+ video: (props) => <Video {...props} src={props.url} />,
  font: FallbackForCustomAsset,
  application: FallbackForCustomAsset,
  model: FallbackForCustomAsset,
@@ -105,7 +104,6 @@ export const elementKeys: { [key: string]: string } = {
  table_body: 'table_body',
  table_row: 'table_row',
  table_cell: 'table_cell',
- table_header_cell: 'table_header_cell',
  'block-quote': 'blockquote',
  paragraph: 'p',
  bold: 'bold',

packages/react-renderer/test/RichText.test.tsx

@@ -13,7 +13,6 @@ import {
  emptyContent,
  embedAssetContent,
  simpleH1Content,
- tableContent,
 } from './content';
 
 describe('@graphcms/rich-text-react-renderer', () => {
@@ -101,45 +100,6 @@ describe('@graphcms/rich-text-react-renderer', () => {
  `);
  });
 
- it('should render a table', () => {
- const { container } = render(<RichText content={tableContent} />);
-
- expect(container).toMatchInlineSnapshot(`
- <div>
- <table>
- <thead>
- <tr>
- <th>
- <p>
- Row 1 - Header 1
- </p>
- </th>
- <th>
- <p>
- Row 1 - Header 2
- </p>
- </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>
- <p>
- Row 2 - Col 1
- </p>
- </td>
- <td>
- <p>
- Row 2 - Col 2
- </p>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- `);
- });
-
  it('should should render H1 with some text', () => {
  const { container } = render(<RichText content={simpleH1Content} />);
 

packages/react-renderer/test/content.ts

@@ -141,86 +141,6 @@ export const emptyContent: RichTextContent = [
  },
 ];
 
-export const tableContent: RichTextContent = [
- {
- type: 'table',
- children: [
- {
- type: 'table_head',
- children: [
- {
- type: 'table_row',
- children: [
- {
- type: 'table_header_cell',
- children: [
- {
- type: 'paragraph',
- children: [
- {
- text: 'Row 1 - Header 1',
- },
- ],
- },
- ],
- },
- {
- type: 'table_header_cell',
- children: [
- {
- type: 'paragraph',
- children: [
- {
- text: 'Row 1 - Header 2',
- },
- ],
- },
- ],
- },
- ],
- },
- ],
- },
- {
- type: 'table_body',
- children: [
- {
- type: 'table_row',
- children: [
- {
- type: 'table_cell',
- children: [
- {
- type: 'paragraph',
- children: [
- {
- text: 'Row 2 - Col 1',
- },
- ],
- },
- ],
- },
- {
- type: 'table_cell',
- children: [
- {
- type: 'paragraph',
- children: [
- {
- text: 'Row 2 - Col 2',
- },
- ],
- },
- ],
- },
- ],
- },
- ],
- },
- ],
- },
-];
-
 export const simpleH1Content: RichTextContent = [
  {
  type: 'heading-one',
@@ -275,8 +195,7 @@ export const iframeContent: RichTextContent = [
 
 export const imageContent: RichTextContent = [
  {
- src:
- 'https://media.graphcms.com/output=format:webp/resize=,width:667,height:1000/8xrjYm4CR721mAZ1YAoy',
+ src: 'https://media.graphcms.com/output=format:webp/resize=,width:667,height:1000/8xrjYm4CR721mAZ1YAoy',
  type: 'image',
  title: 'photo-1564631027894-5bdb17618445.jpg',
  width: 667,

packages/types/src/index.ts

@@ -12,7 +12,6 @@ export interface Element {
  | 'table_body'
  | 'table_row'
  | 'table_cell'
- | 'table_header_cell'
  | 'block-quote'
  | 'paragraph'
  | 'heading-one'
@@ -211,7 +210,6 @@ export interface NodeRendererType {
  table_body?: DefaultNodeRenderer;
  table_row?: DefaultNodeRenderer;
  table_cell?: DefaultNodeRenderer;
- table_header_cell?: DefaultNodeRenderer;
  blockquote?: DefaultNodeRenderer;
  bold?: DefaultNodeRenderer;
  italic?: DefaultNodeRenderer;