{"_id":"@blazhkoma/draft-convert","_rev":"2-2dcbf3d8823e09a4d0355334204d30ec","name":"@blazhkoma/draft-convert","dist-tags":{"latest":"2.1.13-fork.2"},"versions":{"2.1.13-fork.1":{"name":"@blazhkoma/draft-convert","version":"2.1.13-fork.1","keywords":["draft","draftjs","draft-convert","convert"],"author":{"name":"bbriggs@hubspot.com"},"license":"Apache-2.0","_id":"@blazhkoma/draft-convert@2.1.13-fork.1","maintainers":[{"name":"blazhko.ma","email":"blazhko.ma@yandex.ru"}],"homepage":"https://github.com/BlazhkoMA/draft-convert#readme","bugs":{"url":"https://github.com/BlazhkoMA/draft-convert/issues"},"dist":{"shasum":"f8b46d08d9a3fbe48541ec3681aba7d5c1febc6e","tarball":"https://registry.npmjs.org/@blazhkoma/draft-convert/-/draft-convert-2.1.13-fork.1.tgz","fileCount":43,"integrity":"sha512-t9BKuzr/5Kat0jhu7LryFe9U2nfo76johH2YjSOpi4VtW0L/5qK/l/Y2Fcai20D/Z5k2jFEsEEgXhxnnEhnauA==","signatures":[{"sig":"MEUCIQDtrmla7iaFaaTeczhbGutOPGJC++XtxK2RaX7mksCVZgIgGi9ksVyLIXTDA06IfJZs/kuqVSVQ63y2l4yk46+ztUE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":223399},"jest":{"testRegex":"/test/spec/.*\\.js$"},"main":"lib/index.js","module":"esm/index.js","gitHead":"56fb9fd1cc75d4a0db6108d0dd25eac9e464f736","scripts":{"jest":"jest","lint":"eslint src/ test/","test":"npm run jest","build":"npm run build:cjs && npm run build:esm && npm run build:umd","clean":"rimraf ./dist ./lib ./esm","prepare":"npm run build","build:cjs":"cross-env BABEL_ENV=cjs babel src --out-dir lib","build:esm":"cross-env BABEL_ENV=esm babel src --out-dir esm","build:umd":"wp","test-once":"npm run jest","jest:debug":"node --debug-brk --inspect ./node_modules/.bin/jest -i","jest:watch":"jest --watch","prepublish":"npm run lint && npm run build","build-and-test":"npm run clean && npm run build && npm run test-once","prettier:write":"prettier --write ./{src,test}/*.js ./{src,test}/**/*.js"},"_npmUser":{"name":"blazhko.ma","email":"blazhko.ma@yandex.ru"},"repository":{"url":"git+https://github.com/BlazhkoMA/draft-convert.git","type":"git"},"_npmVersion":"10.8.2","description":"Extensibly serialize & deserialize Draft.js ContentState","directories":{},"_nodeVersion":"18.20.8","dependencies":{"immutable":"~3.7.4","invariant":"^2.2.1","@babel/runtime":"^7.5.5"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^24.8.0","react":"^18.0.0","eslint":"6.0.1","rimraf":"2.5.4","jasmine":"^2.2.0","webpack":"^4.35.3","prettier":"^1.8.2","cross-env":"^3.1.4","react-dom":"^18.0.0","@babel/cli":"^7.5.0","babel-jest":"^24.8.0","@babel/core":"^7.5.4","babel-eslint":"^10.0.2","babel-loader":"^8.0.6","webpack-nano":"^0.6.2","@babel/preset-env":"^7.5.4","@babel/preset-react":"^7.0.0","@blazhkoma/draft-js":"0.11.7-fork.3","eslint-plugin-react":"6.8.0","eslint-config-hubspot":"^7.0.0","eslint-config-prettier":"^2.2.0","@babel/plugin-transform-runtime":"^7.5.5"},"peerDependencies":{"react":"^15.0.2 || ^16.0.0-rc || ^16.0.0 || ^17.0.0 || ^18.0.0","react-dom":"^15.0.2 || ^16.0.0-rc || ^16.0.0 || ^17.0.0 || ^18.0.0","@blazhkoma/draft-js":">=0.7.0"},"_npmOperationalInternal":{"tmp":"tmp/draft-convert_2.1.13-fork.1_1747650790170_0.5116868339167526","host":"s3://npm-registry-packages-npm-production"}},"2.1.13-fork.2":{"name":"@blazhkoma/draft-convert","version":"2.1.13-fork.2","description":"Extensibly serialize & deserialize Draft.js ContentState","main":"lib/index.js","module":"esm/index.js","types":"index.d.ts","repository":{"type":"git","url":"git+https://github.com/BlazhkoMA/draft-convert.git"},"scripts":{"build":"npm run build:cjs && npm run build:esm && npm run build:umd","build:cjs":"cross-env BABEL_ENV=cjs babel src --out-dir lib","build:esm":"cross-env BABEL_ENV=esm babel src --out-dir esm","build:umd":"wp","jest":"jest","jest:watch":"jest --watch","jest:debug":"node --debug-brk --inspect ./node_modules/.bin/jest -i","test-once":"npm run jest","test":"npm run jest","clean":"rimraf ./dist ./lib ./esm","build-and-test":"npm run clean && npm run build && npm run test-once","lint":"eslint src/ test/","prepare":"npm run build","prepublish":"npm run lint && npm run build","prettier:write":"prettier --write ./{src,test}/*.js ./{src,test}/**/*.js"},"keywords":["draft","draftjs","draft-convert","convert"],"author":{"name":"bbriggs@hubspot.com"},"license":"Apache-2.0","peerDependencies":{"@blazhkoma/draft-js":">=0.7.0","react":"^15.0.2 || ^16.0.0-rc || ^16.0.0 || ^17.0.0 || ^18.0.0","react-dom":"^15.0.2 || ^16.0.0-rc || ^16.0.0 || ^17.0.0 || ^18.0.0"},"dependencies":{"@babel/runtime":"^7.5.5","immutable":"~3.7.4","invariant":"^2.2.1"},"devDependencies":{"@babel/cli":"^7.5.0","@babel/core":"^7.5.4","@babel/plugin-transform-runtime":"^7.5.5","@babel/preset-env":"^7.5.4","@babel/preset-react":"^7.0.0","babel-eslint":"^10.0.2","babel-jest":"^24.8.0","babel-loader":"^8.0.6","cross-env":"^3.1.4","@blazhkoma/draft-js":"0.11.7-fork.3","eslint":"6.0.1","eslint-config-hubspot":"^7.0.0","eslint-config-prettier":"^2.2.0","eslint-plugin-react":"6.8.0","jasmine":"^2.2.0","jest":"^24.8.0","prettier":"^1.8.2","react":"^18.0.0","react-dom":"^18.0.0","rimraf":"2.5.4","webpack":"^4.35.3","webpack-nano":"^0.6.2"},"jest":{"testRegex":"/test/spec/.*\\.js$"},"_id":"@blazhkoma/draft-convert@2.1.13-fork.2","gitHead":"cd17af75479f19b9cbd3323fe8b24fadd56fa2d4","bugs":{"url":"https://github.com/BlazhkoMA/draft-convert/issues"},"homepage":"https://github.com/BlazhkoMA/draft-convert#readme","_nodeVersion":"20.19.0","_npmVersion":"10.8.2","dist":{"integrity":"sha512-qdyPwt4T//EsJWQz7I2DnXcmbWF+DpkdDfpKymum/7MniwEjmH65hUANPoS6Po2eIDuEZVJm3HXP+GDYJr4jew==","shasum":"913c32e44cb09b7dfa1c493dc63d665c16bbde8a","tarball":"https://registry.npmjs.org/@blazhkoma/draft-convert/-/draft-convert-2.1.13-fork.2.tgz","fileCount":44,"unpackedSize":227536,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIBh3KHaF6+LSep+TUTT8q+NnkEjF1El7vVx6/XiSRm+eAiEAjR3hTVXahXOovFKgdXe5htWNmOSwhMKGwL5f4NgVzaU="}]},"_npmUser":{"name":"blazhko.ma","email":"blazhko.ma@yandex.ru"},"directories":{},"maintainers":[{"name":"blazhko.ma","email":"blazhko.ma@yandex.ru"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/draft-convert_2.1.13-fork.2_1755768763210_0.056055985806637176"},"_hasShrinkwrap":false}},"time":{"created":"2025-05-19T10:33:10.109Z","modified":"2025-08-21T09:32:43.574Z","2.1.13-fork.1":"2025-05-19T10:33:10.360Z","2.1.13-fork.2":"2025-08-21T09:32:43.381Z"},"bugs":{"url":"https://github.com/BlazhkoMA/draft-convert/issues"},"author":{"name":"bbriggs@hubspot.com"},"license":"Apache-2.0","homepage":"https://github.com/BlazhkoMA/draft-convert#readme","keywords":["draft","draftjs","draft-convert","convert"],"repository":{"type":"git","url":"git+https://github.com/BlazhkoMA/draft-convert.git"},"description":"Extensibly serialize & deserialize Draft.js ContentState","maintainers":[{"name":"blazhko.ma","email":"blazhko.ma@yandex.ru"}],"readme":"# **draft-convert**\n\n[![npm version](https://badge.fury.io/js/draft-convert.svg)](https://www.npmjs.com/package/draft-convert) [![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)\n\n*Extensibly serialize & deserialize [**Draft.js**](http://draftjs.org/) content with HTML*\n\n*See [**draft-extend**](http://github.com/HubSpot/draft-extend) for more on how to use draft-convert with plugins*\n\n## Installation\n\n`npm install draft-convert --save` or `yarn add draft-convert`\n\nJump to:\n\n- [convertToHTML](#converttohtml)\n- [convertFromHTML](#convertfromhtml)\n- [Middleware functions](#middleware-functions)\n\n## convertToHTML\n\n**Extensibly serialize Draft.js [`ContentState`](http://facebook.github.io/draft-js/docs/api-reference-content-state.html#content) to HTML.**\n\n**Basic usage:**\n```javascript\nconst html = convertToHTML(editorState.getCurrentContent());\n```\n**Advanced usage:**\n```javascript\n// convert to HTML with blue text, paragraphs, and links\nconst html = convertToHTML({\n  styleToHTML: (style) => {\n    if (style === 'BOLD') {\n      return <span style={{color: 'blue'}} />;\n    }\n  },\n  blockToHTML: (block) => {\n    if (block.type === 'PARAGRAPH') {\n      return <p />;\n    }\n  },\n  entityToHTML: (entity, originalText) => {\n    if (entity.type === 'LINK') {\n      return <a href={entity.data.url}>{originalText}</a>;\n    }\n    return originalText;\n  }\n})(editorState.getCurrentContent());\n\n// convert content state to HTML with functionality defined in the plugins applied\nconst html = compose(\n    FirstPlugin,\n    SecondPlugin,\n    ThirdPlugin\n)(convertToHTML)(editorState.getCurrentContent());\n```\n\n\n`styleToHTML`, `blockToHtml`, and `entityToHTML` are functions that take Draft content data and may return a `ReactElement` or an object of shape `{start, end}`  defining strings for the beginning and end tags of the style, block, or entity. `entityToHTML` may return either a string with or without HTML if the use case demands it. `blockToHTML` also may return an optional `empty` property to handle alternative behavior for empty blocks. To use this along with a `ReactElement` return value an object of shape `{element: ReactElement, empty: ReactElement}` may be returned. If no additional functionality is necessary `convertToHTML` can be invoked with just a `ContentState` to serialize using just the default Draft functionality. `convertToHTML` can be passed as an argument to a plugin to modularly augment its functionality.\n\n**Legacy alternative conversion options**\n`styleToHTML` and `blockToHTML` options may be plain objects keyed by style or block type with values of `ReactElement` s or `{start, end}`  objects. These objects will eventually be removed in favor of the functions described above.\n\n**Type info:**\n```javascript\ntype ContentStateConverter = (contentState: ContentState) => string\n\ntype Tag =\n  ReactElement |\n  {start: string, end: string, empty?: string} |\n  {element: ReactElement, empty?: ReactElement}\n\ntype RawEntity = {\n    type: string,\n    mutability: DraftEntityMutability,\n    data: Object\n}\n\ntype RawBlock = {\n    type: string,\n    depth: number,\n    data?: object,\n    text: string\n}\n\ntype convertToHTML = ContentStateConverter | ({\n    styleToHTML?: (style: string) => Tag,\n    blockToHTML?: (block: RawBlock) => Tag),\n    entityToHTML?: (entity: RawEntity, originalText: string) => Tag | string\n}) => ContentStateConverter\n```\n\n## convertFromHTML\n\n**Extensibly deserialize HTML to Draft.js [`ContentState`](http://facebook.github.io/draft-js/docs/api-reference-content-state.html#content).**\n\n**Basic usage:**\n```javascript\nconst editorState = EditorState.createWithContent(convertFromHTML(html));\n```\n\n**Advanced usage:**\n```javascript\n// convert HTML to ContentState with blue text, links, and at-mentions\nconst contentState = convertFromHTML({\n    htmlToStyle: (nodeName, node, currentStyle) => {\n        if (nodeName === 'span' && node.style.color === 'blue') {\n            return currentStyle.add('BLUE');\n        } else {\n            return currentStyle;\n        }\n    },\n    htmlToEntity: (nodeName, node, createEntity) => {\n        if (nodeName === 'a') {\n            return createEntity(\n                'LINK',\n                'MUTABLE',\n                {url: node.href}\n            )\n        }\n    },\n    textToEntity: (text, createEntity) => {\n        const result = [];\n        text.replace(/\\@(\\w+)/g, (match, name, offset) => {\n            const entityKey = createEntity(\n                'AT-MENTION',\n                'IMMUTABLE',\n                {name}\n            );\n            result.push({\n                entity: entityKey,\n                offset,\n                length: match.length,\n                result: match\n            });\n        });\n        return result;\n    },\n    htmlToBlock: (nodeName, node) => {\n        if (nodeName === 'blockquote') {\n            return {\n                type: 'blockquote',\n                data: {}\n            };\n        }\n    }\n})(html);\n\n// convert HTML to ContentState with functionality defined in the draft-extend plugins applied\nconst fromHTML = compose(\n    FirstPlugin,\n    SecondPlugin,\n    ThirdPlugin\n)(convertFromHTML);\nconst contentState = fromHTML(html);\n```\n\nIf no additional functionality is necessary `convertToHTML` can be invoked with just an HTML string to deserialize using just the default Draft functionality. Any `convertFromHTML` can be passed as an argument to a plugin to modularly augment its functionality. A `flat` option may be provided to force nested block elements to split into flat, separate blocks. For example, the HTML input `<p>line one<br />linetwo</p>` will produce two `unstyled` blocks in `flat` mode.\n\n**Type info:**\n```javascript\ntype HTMLConverter = (html: string, {flat: ?boolean}, DOMBuilder: ?Function, generateKey: ?Function) => ContentState\n\ntype EntityKey = string\n\ntype convertFromHTML = HTMLConverter | ({\n    htmlToStyle: ?(nodeName: string, node: Node) => DraftInlineStyle,\n    htmlToBlock: ?(nodeName: string, node: Node) => ?(DraftBlockType | {type: DraftBlockType, data: object} | false),\n    htmlToEntity: ?(\n        nodeName: string,\n        node: Node,\n        createEntity: (type: string, mutability: string, data: object) => EntityKey,\n        getEntity: (key: EntityKey) => Entity,\n        mergeEntityData: (key: string, data: object) => void,\n        replaceEntityData: (key: string, data: object) => void\n    ): ?EntityKey,\n    textToEntity: ?(\n        text: string,\n        createEntity: (type: string, mutability: string, data: object) => EntityKey,\n        getEntity: (key: EntityKey) => Entity,\n        mergeEntityData: (key: string, data: object) => void,\n        replaceEntityData: (key: string, data: object) => void\n    ) => Array<{entity: EntityKey, offset: number, length: number, result: ?string}>\n}) => HTMLConverter\n```\n\n## Middleware functions\n\nAny conversion option for `convertToHTML`  or `convertFromHTML` may also accept a middleware function of shape `(next) => (…args) => result` , where `…args` are the normal configuration function paramaters and `result` is the expected return type for that function. These functions can transform results of the default conversion included in `convertToHTML` or `convertFromHTML` by leveraging the result of `next(...args)`. These middleware functions are most useful when passed as the result of composition of [`draft-extend`](http://github.com/HubSpot/draft-extend) plugins. If you choose to use them independently, a `__isMiddleware` property must be set to `true` on the function for `draft-convert` to properly handle it.\n\n","readmeFilename":"README.md"}