CODEWITHSUNDEEP
javascriptuser-inputsanity
HynekS
HynekS

Reputation: 3317

Sanity.io code input – how to add an input field for highlighted lines?

I've stuck trying to add highlightedLines field to Sanity.io code input. The only docs I've found yet are on npm page of the module, and there is an example data model:

{
  _type: 'code',
  language: 'js',
  highlightedLines: [1, 2], // <--- I need to have this field accessible in sanity studio
  code: 'const foo = "bar"\nconsole.log(foo.toUpperCase())\n// BAR'
}

I've tried (naively) to add fields: { foo: "array" } property to the "Code block" object in blockContent.js, but then the studio didn't compile, throwing Cannot override 'fields' of subtypes of "object" error.

Do I need to create new type from code and decorate it with additional fields separately?

// current blockContent.js

export default {
  title: "Block Content",
  name: "blockContent",
  type: "array",
  of: [
    {
    // ...  

    {
      type: "image",
      options: { hotspot: true },
    },
    {
      title: "Code block",
      name: "code",
      type: "code",
      options: {
        withFilename: true,
      }
    },
  ],
};

I'd gladly take any suggestions.

Upvotes: 1

Views: 683

Answers (1)

Andre Brdoch
Andre Brdoch

Reputation: 244

You can highlight a line by clicking on its line number on the left. Could be added to the documentation :)

highlight code line

Upvotes: 2

Related Questions