How to use the draft-convert.convertToHTML function in draft-convert

To help you get started, we’ve selected a few draft-convert examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github LessWrong2 / Lesswrong2 / packages / lesswrong / lib / editor / utils.js View on Github external
//     data: {}
    //   };
    // }
    if (nodeName === 'hr') { // This currently appears to be broken, sadly. TODO: Fix this
      return {
        type: 'divider',
        data: {},
        text: 'as',
        depth: 0,
        inlineStyleRanges: [ { offset: 0, length: 2, style: 'ITALIC' } ],
      }
    }
  }
})

export const draftToHTML = convertToHTML({
  //eslint-disable-next-line react/display-name
  styleToHTML: (style) => {
    if (style === 'STRIKETHROUGH') {
      return <span style="{{textDecoration:">;
    }
  },
  entityToHTML: (entity, originalText) =&gt; {
    if (entity.type === 'image' || entity.type === 'IMAGE') {
      let classNames = 'draft-image '
      if (entity.data.alignment) {
        classNames = classNames + entity.data.alignment;
      }
      let style = "width:" + (entity.data.width || 40) + "%"
      return `<figure><img style="${style}" class="${classNames}" src="${entity.data.src}"></figure>`;
    }
    if (entity.type === 'LINK') {</span>
github assembl / assembl / assembl / static2 / js / app / utils / draftjs.js View on Github external
return undefined;
}

const customConvertFromHTML = convertFromHTML({
  htmlToBlock: htmlToBlock,
  htmlToEntity: function (nodeName: string, node: HTMLElement, createEntity: Function): EntityInstance | null {
    if (nodeName === 'a') {
      // $FlowFixMe: if nodeName is 'a', node should be an HTMLAnchorElement
      return linkConverters.htmlToEntity(nodeName, node, createEntity, addProtocol);
    }

    return attachmentsConverters.htmlToEntity(nodeName, node, createEntity);
  }
});

const customConvertToHTML = convertToHTML({
  blockToHTML: blockToHTML,
  entityToHTML: (entity: EntityInstance, originalText: string): string =&gt; {
    if (entity.type === ENTITY_TYPES.document || entity.type === ENTITY_TYPES.image) {
      return attachmentsConverters.entityToHTML(entity);
    } else if (entity.type === ENTITY_TYPES.link) {
      return linkConverters.entityToHTML(entity, originalText);
    }

    return originalText;
  }
});

export function convertEntries(converter: Function): Function {
  return function (entries: Array): Array {
    return entries.map(entry =&gt; ({
      ...entry,
github Foundry376 / Mailspring / app / src / components / composer-editor / draftjs-config.jsx View on Github external
export function convertToHTML(contentState) {
  return DraftConvert.convertToHTML({
    styleToHTML: style =&gt; {
      switch (style) {
        case 'BOLD':
          return <strong>;
        case 'ITALIC':
          return <em>;
        case 'UNDERLINE':
          return <u>;
        case 'CODE':
          return <code>;
        default:
          for (const p of plugins) {
            const result = p.styleToHTML &amp;&amp; p.styleToHTML(style);
            if (result) return result;
          }
          return <span>;</span></code></u></em></strong>
github strues / boldr / src / shared / scenes / Admin / Content / NewArticle / NewArticleContainer.js View on Github external
createArticle: values =>
      mutate({
        variables: {
          input: {
            title: values.title,
            slug: values.title,
            content: convertToHTML(values.content),
            rawContent: values.rawContent,
            featured: values.featured,
            published: values.published,
            excerpt: values.excerpt,
            featureImage: values.featureImage,
            tags: values.tags,
          },
        },
      }),
  }),
github strues / boldr / packages / frontend / BoldrText / BoldrText.js View on Github external
getContent(format: string) {
    format = format || this.props.contentFormat || 'raw';
    const contentState = this.getContentState();

    const colors = defaultOptions.colors;
    const fontSizes = defaultOptions.fontSizes;
    const fontFamilies = defaultOptions.fontFamilies;

    return format === 'html'
      ? convertToHTML(
          getToHTMLConfig({
            contentState,
            colors,
            fontSizes,
            fontFamilies,
          }),
        )(contentState)
      : convertToRaw(this.getContentState());
  }
github brijeshb42 / medium-draft / src / exporter.js View on Github external
export const setRenderOptions = (htmlOptions = options) => convertToHTML(htmlOptions);
github Heigvd / Wegas / wegas-app / src / main / webapp / wegas-react-form / src / Views / RTE / styles.tsx View on Github external
};
        }
        if (entity.type === 'VIDEO') {
            return {
                start: "<video controls="" src="&quot; + entity.data.url + &quot;">",
                end: '</video>',
            };
        }
    },
    blockToHTML: block =&gt; {
        if (block.type === 'atomic') {
            return <figure>;
        }
    },
};
export const StateToHTML = convertToHTML(options);
</figure>
github meriadec / overdraft / src / exportToHTML.js View on Github external
export default function exportToHTML(content) {
  return convertToHTML(options)(content)
}
github tubackkhoa / tkframework / client / ui / shared / components / Text / shared / Converter / index.js View on Github external
}        
        break

      case 'img':
        if(inBlock !=='atomic')
          return 'atomic'
        break

      default:
        break
    }               
  },

})

export const ContentState2HTML = convertToHTML({  
  blockToHTML(block) {    
    if (block.type === 'atomic') {
      return <figure>
    }
  },

  entityToHTML(entity, originalText) {
    switch(entity.type){
      case 'LINK' : return <a href="{entity.data.href}">{originalText}</a>
      case 'IMAGE': return `<img src="${entity.data.src}">`
      default     : return originalText
    }        
  },
})</figure>
github chaskiq / chaskiq / app / javascript / src / textEditor / index.js View on Github external
if (block.type === 'PARAGRAPH') {
          return <p>;
        }
      },
      entityToHTML: (entity, originalText) =&gt; {
        if (entity.type === 'LINK') {
          return <a href="{entity.data.url}">{originalText}</a>;
        }
        return originalText;
      }
    }

    const currentContent = context.editorState().getCurrentContent()
    this.props.setDisabled &amp;&amp; this.props.setDisabled(!currentContent.hasText())

    let html = convertToHTML(convertOptions)(currentContent)
    const serialized = JSON.stringify(content)
    const plain = context.getTextFromEditor(content)

    if(this.props.data.serialized_content === serialized)
      return

    this.props.updateState &amp;&amp; this.props.updateState({
      status: "saving...",
      statusButton: "success",
      content: {
        html: html,
        serialized: serialized
      }
    })

    if (cb)</p>

draft-convert

Extensibly serialize & deserialize Draft.js ContentState

Apache-2.0
Latest version published 2 years ago

Package Health Score

57 / 100
Full package analysis