@portabletext/block-tools 1.0.2 → 1.1.0

package/src/HtmlDeserializer/rules/index.ts

@@ -7,7 +7,7 @@ import createWordRules from './word'
 
 export function createRules(
   blockContentType: ArraySchemaType,
-  options: BlockEnabledFeatures,
+  options: BlockEnabledFeatures & {keyGenerator?: () => string},
 ): DeserializerRule[] {
   return [
     ...createWordRules(),

package/src/index.ts

@@ -23,7 +23,9 @@ export function htmlToBlocks(
   options: HtmlDeserializerOptions = {},
 ): (TypedObject | PortableTextTextBlock)[] {
   const deserializer = new HtmlDeserializer(blockContentType, options)
-  return deserializer.deserialize(html).map((block) => normalizeBlock(block))
+  return deserializer
+    .deserialize(html)
+    .map((block) => normalizeBlock(block, {keyGenerator: options.keyGenerator}))
 }
 
 /**
@@ -39,9 +41,6 @@ export function getBlockContentFeatures(
   return blockContentTypeFeatures(blockContentType)
 }
 
-export {normalizeBlock}
-export {randomKey} from './util/randomKey'
-export type {BlockContentFeatures, HtmlDeserializerOptions, TypedObject}
 export type {
   ArbitraryTypedObject,
   BlockEditorSchemaProps,
@@ -50,3 +49,6 @@ export type {
   ResolvedAnnotationType,
 } from './types'
 export type {BlockNormalizationOptions} from './util/normalizeBlock'
+export {randomKey} from './util/randomKey'
+export {normalizeBlock}
+export type {BlockContentFeatures, HtmlDeserializerOptions, TypedObject}

package/src/types.ts

@@ -100,6 +100,7 @@ export type WhiteSpacePasteMode = 'preserve' | 'remove' | 'normalize'
  * @public
  */
 export interface HtmlDeserializerOptions {
+  keyGenerator?: () => string
   rules?: DeserializerRule[]
   parseHtml?: HtmlParser
   unstable_whitespaceOnPasteMode?: WhiteSpacePasteMode

package/src/util/normalizeBlock.ts

@@ -5,7 +5,7 @@ import {
 } from '@sanity/types'
 import {isEqual} from 'lodash'
 import type {TypedObject} from '../types'
-import {randomKey} from './randomKey'
+import {keyGenerator} from './randomKey'
 
 /**
  * Block normalization options
@@ -22,6 +22,11 @@ export interface BlockNormalizationOptions {
    * Name of the portable text block type, if not `block`
    */
   blockTypeName?: string
+
+  /**
+   * Custom key generator function
+   */
+  keyGenerator?: () => string
 }
 
 /**
@@ -51,26 +56,30 @@ export function normalizeBlock(
   if (node._type !== (options.blockTypeName || 'block')) {
     return '_key' in node
       ? (node as TypedObject & {_key: string})
-      : {...node, _key: randomKey(12)}
+      : {
+          ...node,
+          _key: options.keyGenerator ? options.keyGenerator() : keyGenerator(),
+        }
   }
 
   const block: Omit<
     PortableTextTextBlock<TypedObject | PortableTextSpan>,
     'style'
   > = {
-    _key: randomKey(12),
+    _key: options.keyGenerator ? options.keyGenerator() : keyGenerator(),
     children: [],
     markDefs: [],
     ...node,
   }
 
   const lastChild = block.children[block.children.length - 1]
+
   if (!lastChild) {
     // A block must at least have an empty span type child
     block.children = [
       {
         _type: 'span',
-        _key: `${block._key}${0}`,
+        _key: options.keyGenerator ? options.keyGenerator() : keyGenerator(),
         text: '',
         marks: [],
       },
@@ -111,12 +120,15 @@ export function normalizeBlock(
       },
       [] as (TypedObject | PortableTextSpan)[],
     )
-    .map((child, index) => {
+    .map((child) => {
       if (!child) {
         throw new Error('missing child')
       }
 
-      child._key = `${block._key}${index}`
+      child._key = options.keyGenerator
+        ? options.keyGenerator()
+        : keyGenerator()
+
       if (isPortableTextSpan(child)) {
         if (!child.marks) {
           child.marks = []
@@ -138,5 +150,6 @@ export function normalizeBlock(
   block.markDefs = (block.markDefs || []).filter((markDef) =>
     usedMarkDefs.includes(markDef._key),
   )
+
   return block
 }

package/src/util/randomKey.ts

@@ -1,5 +1,9 @@
 import getRandomValues from 'get-random-values-esm'
 
+export function keyGenerator() {
+  return randomKey(12)
+}
+
 // WHATWG crypto RNG - https://w3c.github.io/webcrypto/Overview.html
 function whatwgRNG(length = 16) {
   const rnds8 = new Uint8Array(length)