@wulperstudio/editor-render 0.0.4-beta → 0.0.5-beta

package/dist/index.d.ts

@@ -1,11 +1,10 @@
 /// <reference types="react" />
 import * as react from 'react';
-import react__default, { ReactNode } from 'react';
+import react__default from 'react';
 import * as _emotion_styled from '@emotion/styled';
 import * as _mui_system from '@mui/system';
 import * as _mui_material from '@mui/material';
 import { CheckboxProps } from '@mui/material';
-import { DOMNode } from 'html-react-parser';
 
 declare type BlockItemType = 'paragraph' | 'header' | 'delimiter' | 'list' | 'image' | 'table' | 'embed' | 'rawTool' | 'quote' | 'code' | 'checklist' | 'linkTool';
 
@@ -124,10 +123,10 @@ interface RootContainerProps$1 {
 declare const RootContainer: _emotion_styled.StyledComponent<_mui_system.MUIStyledCommonProps<_mui_material.Theme> & RootContainerProps$1, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
 declare type RootContainerProps = react__default.ComponentPropsWithRef<typeof RootContainer>;
-interface ContainerModel extends RootContainerProps {
+interface ContainerProps extends RootContainerProps {
     stretched?: boolean;
 }
-declare const Container: (props: ContainerModel) => JSX.Element;
+declare const Container: (props: ContainerProps) => JSX.Element;
 
 declare const RootParagraph: _emotion_styled.StyledComponent<_mui_system.MUIStyledCommonProps<_mui_material.Theme>, react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
 
@@ -153,8 +152,8 @@ declare const List: ({ ...props }: ListProps) => JSX.Element;
 
 declare const RootListItem$1: _emotion_styled.StyledComponent<_mui_system.MUIStyledCommonProps<_mui_material.Theme>, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
-declare type RootItemProps$1 = react__default.ComponentPropsWithRef<typeof RootListItem$1>;
-interface ItemModel$1 extends RootItemProps$1 {
+declare type RootItemProps = react__default.ComponentPropsWithRef<typeof RootListItem$1>;
+interface ItemModel$1 extends RootItemProps {
 }
 declare const ListItem: (props: ItemModel$1) => JSX.Element;
 
@@ -267,8 +266,8 @@ declare const Code: (props: CodeProps) => JSX.Element;
 
 declare const RootLink: _emotion_styled.StyledComponent<_mui_system.MUIStyledCommonProps<_mui_material.Theme>, react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
 
-declare type LinkRootProps = react__default.ComponentPropsWithRef<typeof RootLink>;
-interface LinkProps extends Omit<LinkRootProps, 'children'> {
+declare type LinkRootProps = Omit<react__default.ComponentPropsWithRef<typeof RootLink>, 'children'>;
+interface LinkProps extends LinkRootProps {
     image?: string;
     title?: string;
     description?: string;
@@ -285,106 +284,192 @@ declare const CheckList: (props: CheckListProps) => JSX.Element;
 
 declare const RootListItem: _emotion_styled.StyledComponent<_mui_system.MUIStyledCommonProps<_mui_material.Theme>, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
-declare type RootItemProps = react__default.ComponentPropsWithRef<typeof RootListItem>;
-interface ItemModel extends RootItemProps {
+declare type RootCheckListItemProps = react__default.ComponentPropsWithRef<typeof RootListItem>;
+interface ItemModel extends RootCheckListItemProps {
 }
 declare const CheckListItem: (props: ItemModel) => JSX.Element;
 
 declare const CheckBox: ({ checked, ...props }: CheckboxProps) => JSX.Element;
 
-declare type RecursiveNodeType = false | void | object | JSX.Element | null | undefined;
-declare const RecursiveNode: (domNode: DOMNode, idx: string) => RecursiveNodeType;
+declare type Props$1 = {
+    html: string;
+    id: string;
+};
+declare const RecursiveNode: ({ html, id }: Props$1) => JSX.Element;
 
-interface ParagraphNodeModel {
+interface ParagraphNodeProps {
     type: 'paragraph';
     data: DataParagraph;
     id: string;
+    Container?: RootContainerProps;
+    Paragraph?: ParagraphRootProps;
 }
-declare const ParagraphNode: ({ type, data, id, }: ParagraphNodeModel) => react__default.ReactNode;
+declare const ParagraphNode: ({ type, data, id, Container, Paragraph, }: ParagraphNodeProps) => JSX.Element;
 
-interface HeaderNodeModel {
+interface HeaderNodeProps {
     type: 'header';
     data: DataHeader;
     id: string;
+    Container?: RootContainerProps;
+    Header?: HeaderRootProps;
 }
-declare const HeaderNode: ({ type, data, id, }: HeaderNodeModel) => react__default.ReactNode;
+declare const HeaderNode: ({ type, data, id, Container, Header, }: HeaderNodeProps) => JSX.Element;
 
 interface ListNodeModel {
     type: 'list';
     data: DataList;
     id: string;
     tunes?: any;
+    Container?: RootContainerProps;
+    List?: ListRootProps;
+    Item?: RootItemProps;
 }
-declare const ListNode: ({ type, data, id, tunes, }: ListNodeModel) => react__default.ReactNode;
+declare const ListNode: ({ type, data, id, tunes, List, Item }: ListNodeModel) => JSX.Element;
 
-interface ImageNodeModel {
+interface ImageNodeProps {
     type: 'image';
     data: DataImage;
     id: string;
+    Container?: RootContainerProps;
+    Image?: ImageRootProps;
 }
-declare const ImageNode: ({ type, data, id, }: ImageNodeModel) => react__default.ReactNode;
+declare const ImageNode: ({ type, data, id, Container, Image }: ImageNodeProps) => JSX.Element;
 
-interface TableNodeModel {
+interface TableNodeProps {
     type: 'table';
     data: DataTable;
     id: string;
+    Container?: RootContainerProps;
+    Table?: TableRootProps;
+    Row?: TableRowRootProps;
+    Cell?: TableCellRootProps;
 }
-declare const TableNode: ({ type, data, id, }: TableNodeModel) => react__default.ReactNode;
+declare const TableNode: ({ type, data, id, Container }: TableNodeProps) => JSX.Element;
 
-interface DelimiterNodeModel {
+interface DelimiterNodeProps {
     type: 'delimiter';
     data: DataDelimiter;
     id: string;
+    Delimiter?: DelimiterRootProps;
+    Container?: RootContainerProps;
 }
-declare const DelimiterNode: ({ type, id, }: DelimiterNodeModel) => react__default.ReactNode;
+declare const DelimiterNode: ({ type, id, Delimiter, Container }: DelimiterNodeProps) => JSX.Element;
 
-interface EmbedNodeModel {
+interface EmbedNodeProps {
     type: 'embed';
     data: DataEmbed;
     id: string;
+    Container?: RootContainerProps;
+    Embed?: EmbedRootProps;
 }
-declare const EmbedNode: ({ type, data, id, }: EmbedNodeModel) => react__default.ReactNode;
+declare const EmbedNode: ({ type, data, id, Container, Embed }: EmbedNodeProps) => JSX.Element;
 
-interface RawNodeModel {
+interface RawNodeProps {
     type: 'rawTool';
     data: DataRawTool;
     id: string;
+    Container?: RootContainerProps;
+    Raw?: RawRootProps;
 }
-declare const RawNode: ({ type, data, id }: RawNodeModel) => react__default.ReactNode;
+declare const RawNode: ({ type, data, id, Container, Raw }: RawNodeProps) => JSX.Element;
 
-interface QuoteNodeModel {
+interface QuoteNodeProps {
     type: 'quote';
     data: DataQuote;
     id: string;
+    Container?: RootContainerProps;
+    Quote?: QuoteRootProps;
 }
-declare const QuoteNode: ({ type, data, id, }: QuoteNodeModel) => react__default.ReactNode;
+declare const QuoteNode: ({ type, data, id, Container, Quote, }: QuoteNodeProps) => JSX.Element;
 
-interface CodeNodeModel {
+interface CodeNodeProps {
     type: 'code';
     data: DataCodeLang;
     id: string;
+    Container?: RootContainerProps;
+    Code?: CodeRootProps;
 }
-declare const CodeNode: ({ type, data, id }: CodeNodeModel) => react__default.ReactNode;
+declare const CodeNode: ({ type, data, id, Container, Code, }: CodeNodeProps) => JSX.Element;
 
-interface LinkNodeModel {
+interface LinkNodeProps {
     type: 'linkTool';
     data: DataLinkTool;
     id: string;
+    Container?: RootContainerProps;
+    Link?: LinkRootProps;
 }
-declare const LinkNode: ({ type, data, id, }: LinkNodeModel) => react__default.ReactNode;
+declare const LinkNode: ({ type, data, id, Container, Link }: LinkNodeProps) => JSX.Element;
 
-interface CheckListNodeModel {
+interface CheckListNodeProps {
     type: 'checklist';
     data: DataCheckList;
     id: string;
     tunes?: any;
+    Container?: RootContainerProps;
+    CheckList?: CheckListRootProps;
+    Item?: RootCheckListItemProps;
 }
-declare const CheckListNode: ({ type, data, id, tunes, }: CheckListNodeModel) => react__default.ReactNode;
+declare const CheckListNode: ({ type, data, id, tunes, Container, CheckList, Item, }: CheckListNodeProps) => JSX.Element;
 
 declare const PurifyHtml: (html: string) => string;
 declare const ForkIdWithType: (id: string, type: string) => string;
 declare const getFlexBasis: (columns: number, gap: number) => string;
 
-declare const getBaseNodesFromEditor: (value: EditorDataModel) => ReactNode[];
+declare type Props = {
+    value: EditorDataModel;
+    ParagraphSlot?: {
+        Container?: RootContainerProps;
+        Paragraph?: ParagraphRootProps;
+    };
+    HeaderSlot?: {
+        Container?: RootContainerProps;
+        Header?: HeaderRootProps;
+    };
+    DelimiterSlot?: {
+        Container?: RootContainerProps;
+        Delimiter?: DelimiterRootProps;
+    };
+    ListSlot?: {
+        Container?: RootContainerProps;
+        List?: ListRootProps;
+        Item?: RootItemProps;
+    };
+    ImageSlot?: {
+        Container?: RootContainerProps;
+        Image?: ImageRootProps;
+    };
+    TableSlot?: {
+        Container?: RootContainerProps;
+        Table?: TableRootProps;
+        Row?: TableRowRootProps;
+        Cell?: TableCellRootProps;
+    };
+    EmbedSlot?: {
+        Container?: RootContainerProps;
+        Embed?: EmbedRootProps;
+    };
+    RawSlot?: {
+        Container?: RootContainerProps;
+        Raw?: RawRootProps;
+    };
+    QuoteSlot?: {
+        Container?: RootContainerProps;
+        Quote?: QuoteRootProps;
+    };
+    CodeSlot?: {
+        Container?: RootContainerProps;
+        Code?: CodeRootProps;
+    };
+    LinkSlot?: {
+        Container?: RootContainerProps;
+        Link?: LinkRootProps;
+    };
+    CheckListSlot?: {
+        Container?: RootContainerProps;
+        CheckList?: CheckListRootProps;
+        Item?: RootCheckListItemProps;
+    };
+};
+declare const BaseNodesEditor: ({ value, ParagraphSlot, HeaderSlot, DelimiterSlot, ListSlot, ImageSlot, TableSlot, EmbedSlot, RawSlot, QuoteSlot, CodeSlot, LinkSlot, CheckListSlot, }: Props) => (JSX.Element | null)[];
 
-export { BlockCheckListModel, BlockCodeModel, BlockDelimiterModel, BlockEmbedModel, BlockHeaderModel, BlockImageModel, BlockItemType, BlockLinkToolModel, BlockListModel, BlockParagraphModel, BlockQuoteModel, BlockRawToolModel, BlockTableModel, CheckListNode, CheckListNodeModel, CodeNode, CodeNodeModel, DataCheckList, DataChecklistItem, DataCodeLang, DataDelimiter, DataEmbed, DataHeader, DataImage, DataLinkTool, DataList, DataMetaLink, DataParagraph, DataQuote, DataRawTool, DataTable, DelimiterNode, DelimiterNodeModel, Anchor as EditorAnchor, Bold as EditorBold, CheckBox as EditorCheckBox, CheckList as EditorCheckList, CheckListItem as EditorCheckListItem, Code as EditorCode, Container as EditorContainer, EditorDataModel, Delimiter as EditorDelimiter, Embed as EditorEmbed, Header as EditorHeader, Image as EditorImage, InlineCode as EditorInlineCode, Italic as EditorItalic, Link as EditorLink, List as EditorList, ListItem as EditorListItem, Marker as EditorMarker, Paragraph as EditorParagraph, Quote as EditorQuote, Raw as EditorRaw, Table as EditorTable, TableCell as EditorTableCell, TableRow as EditorTableRow, EmbedNode, EmbedNodeModel, ForkIdWithType, HeaderNode, HeaderNodeModel, ImageNode, ImageNodeModel, LinkNode, LinkNodeModel, ListNode, ListNodeModel, ParagraphNode, ParagraphNodeModel, PurifyHtml, QuoteNode, QuoteNodeModel, RawNode, RawNodeModel, RecursiveNode, TableNode, TableNodeModel, Tune, getBaseNodesFromEditor, getFlexBasis };
+export { BaseNodesEditor, BlockCheckListModel, BlockCodeModel, BlockDelimiterModel, BlockEmbedModel, BlockHeaderModel, BlockImageModel, BlockItemType, BlockLinkToolModel, BlockListModel, BlockParagraphModel, BlockQuoteModel, BlockRawToolModel, BlockTableModel, CheckListNode, CheckListNodeProps as CheckListNodeModel, CodeNode, CodeNodeProps as CodeNodeModel, DataCheckList, DataChecklistItem, DataCodeLang, DataDelimiter, DataEmbed, DataHeader, DataImage, DataLinkTool, DataList, DataMetaLink, DataParagraph, DataQuote, DataRawTool, DataTable, DelimiterNode, DelimiterNodeProps as DelimiterNodeModel, Anchor as EditorAnchor, Bold as EditorBold, CheckBox as EditorCheckBox, CheckList as EditorCheckList, CheckListItem as EditorCheckListItem, Code as EditorCode, Container as EditorContainer, EditorDataModel, Delimiter as EditorDelimiter, Embed as EditorEmbed, Header as EditorHeader, Image as EditorImage, InlineCode as EditorInlineCode, Italic as EditorItalic, Link as EditorLink, List as EditorList, ListItem as EditorListItem, Marker as EditorMarker, Paragraph as EditorParagraph, Quote as EditorQuote, Raw as EditorRaw, Table as EditorTable, TableCell as EditorTableCell, TableRow as EditorTableRow, EmbedNode, EmbedNodeProps as EmbedNodeModel, ForkIdWithType, HeaderNode, HeaderNodeProps as HeaderNodeModel, ImageNode, ImageNodeProps as ImageNodeModel, LinkNode, LinkNodeProps as LinkNodeModel, ListNode, ListNodeModel, ParagraphNode, ParagraphNodeProps as ParagraphNodeModel, PurifyHtml, QuoteNode, QuoteNodeProps as QuoteNodeModel, RawNode, RawNodeProps as RawNodeModel, RecursiveNode, TableNode, TableNodeProps as TableNodeModel, Tune, getFlexBasis };

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wulperstudio/editor-render",
-  "version": "0.0.4-beta",
+  "version": "0.0.5-beta",
   "author": "@wulperstudio",
   "repository": "https://github.com/WulperStudio/editor-render.git",
   "license": "MIT",
@@ -9,10 +9,10 @@
     "test:lint": "eslint '*/**/*.{ts,tsx}' || eslint src\\**\\*.{ts,tsx} "
   },
   "peerDependencies": {
-    "react": "^17.0.0 || ^18.0.0",
-    "react-dom": "^17.0.0 || ^18.0.0",
     "@types/react": "^17.0.0 || ^18.0.0",
-    "@types/react-dom": "^17.0.0 || ^18.0.0"
+    "@types/react-dom": "^17.0.0 || ^18.0.0",
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0"
   },
   "dependencies": {
     "@emotion/react": "^11.9.0",
@@ -36,6 +36,8 @@
     "eslint-plugin-import": "^2.25.2",
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-react": "^7.26.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "rollup": "^2.75.5",
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-dts": "^4.2.2",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wulperstudio/editor-render",
-  "version": "0.0.4-beta",
+  "version": "0.0.5-beta",
   "author": "@wulperstudio",
   "repository": "https://github.com/WulperStudio/editor-render.git",
   "license": "MIT",
@@ -9,10 +9,10 @@
     "test:lint": "eslint '*/**/*.{ts,tsx}' || eslint src\\**\\*.{ts,tsx} "
   },
   "peerDependencies": {
-    "react": "^17.0.0 || ^18.0.0",
-    "react-dom": "^17.0.0 || ^18.0.0",
     "@types/react": "^17.0.0 || ^18.0.0",
-    "@types/react-dom": "^17.0.0 || ^18.0.0"
+    "@types/react-dom": "^17.0.0 || ^18.0.0",
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0"
   },
   "dependencies": {
     "@emotion/react": "^11.9.0",
@@ -36,6 +36,8 @@
     "eslint-plugin-import": "^2.25.2",
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-react": "^7.26.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "rollup": "^2.75.5",
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-dts": "^4.2.2",