@portabletext/types

TypeScript types for Portable Text

Installation

npm install --save @portabletext/types
Copy

Documentation

See https://portabletext.github.io/types/

Usage

import type {
  PortableTextBlock,
  PortableTextSpan,
  PortableTextLink
} from '@portabletext/types'

const headingSpan: PortableTextSpan = {
  _type: 'span',
  _key: '5p4n',
  text: 'A simple Portable Text heading block',
  marks: [],
}

const myBlocks: PortableTextBlock[] = [
  {
    _type: 'block',
    _key: 'abc123',
    style: 'h1',
    children: [headingSpan],
    markDefs: [],
  },
  {
    _type: 'block',
    _key: 'xyz987',
    style: 'normal',
    children: [
      {_type: 'span', _key: 'c7', text: 'Check out the ', marks: []}
      {_type: 'span', _key: 'x2', text: 'TypeScript definitions', marks: ['m4hl1nk']},
      {_type: 'span', _key: 'u5', text: ' if you are using TS!', marks: []}
    ],
    markDefs: [
      {
        _key: 'm4hl1nk',
        _type: 'link',
        href: 'https://github.com/portabletext/types'
      }
    ],
  },
]

/**
 * Very specific Portable Text block, where:
 * - Only link and author references (custom) are allowed as marks
 * - Only Portable Text spans and `localCurrency` objects can be inline children
 * - Blocks can only be of style `normal` or `call-to-action` (custom)
 * - List items can only be of type `bullet`
 */
type MyCustomBlock = PortableTextListItemBlock<
  PortableTextLink | AuthorReference, // `M`: Marks
  PortableTextSpan | LocalCurrency,   // `C`: Children
  'normal' | 'call-to-action',        // `S`: Styles
  'bullet'                            // `L`: List item types
>
Copy

License

MIT © Sanity.io