Support custom block types inlined in Portable Text

[aadgrant]

Sanity now supports inline custom objects/_types!

These objects are embedded on the block level, but you may also need objects that appear inline with text useful for stuff like footnotes, ticker-symbols or sparklines. Add these to an array under the of key in the block type object:
{ title: 'Rich text', type: 'array', of: [ { type: 'block', of: [ {type: 'footnote'} ] } ] }

This may not be the best way to achieve this
I've added another layer of testing the _type for custom serializers before finally testing the Marks.

[codecov]

Codecov Report

Merging #216 (68bef56) into main (6a22420) will increase coverage by 0.53%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##             main     #216      +/-   ##
==========================================
+ Coverage   95.07%   95.60%   +0.53%     
==========================================
  Files           8        8              
  Lines         203      205       +2     
  Branches       84       87       +3     
==========================================
+ Hits          193      196       +3     
+ Misses         10        9       -1     

Impacted Files	Coverage Δ
src/components/sanity-content.ts	93.81% <100.00%> (+1.18%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 6a22420...68bef56. Read the comment docs.

[danielroe]

This looks great!

Would you add a test + snapshot to cover possible options in the line you edited? For example:
https://github.com/nuxt-community/sanity-module/blob/e7b1a9bf323e1393b342f0fcacdbafa2f54bd68f/test/unit/sanity-content.test.ts#L15-L28

[aadgrant]

This looks great!

Would you add a test + snapshot to cover possible options in the line you edited? For example:
https://github.com/nuxt-community/sanity-module/blob/e7b1a9bf323e1393b342f0fcacdbafa2f54bd68f/test/unit/sanity-content.test.ts#L15-L28

Done!

I wrote a customLink component as an example but decided to keep it simple and didn't include. Code below if helpful.

  <i class="customIcon">
    <svg
      v-if="icon === 'cog'"
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 512 512"
    >
      <path
        d="M444.788 291.1l42.616 24.599c4.867 2.809 7.126 8.618 5.459 13.985-11.07 35.642-29.97 67.842-54.689 94.586a12.016 12.016 0 0 1-14.832 2.254l-42.584-24.595a191.577 191.577 0 0 1-60.759 35.13v49.182a12.01 12.01 0 0 1-9.377 11.718c-34.956 7.85-72.499 8.256-109.219.007-5.49-1.233-9.403-6.096-9.403-11.723v-49.184a191.555 191.555 0 0 1-60.759-35.13l-42.584 24.595a12.016 12.016 0 0 1-14.832-2.254c-24.718-26.744-43.619-58.944-54.689-94.586-1.667-5.366.592-11.175 5.459-13.985L67.212 291.1a193.48 193.48 0 0 1 0-70.199l-42.616-24.599c-4.867-2.809-7.126-8.618-5.459-13.985 11.07-35.642 29.97-67.842 54.689-94.586a12.016 12.016 0 0 1 14.832-2.254l42.584 24.595a191.577 191.577 0 0 1 60.759-35.13V25.759a12.01 12.01 0 0 1 9.377-11.718c34.956-7.85 72.499-8.256 109.219-.007 5.49 1.233 9.403 6.096 9.403 11.723v49.184a191.555 191.555 0 0 1 60.759 35.13l42.584-24.595a12.016 12.016 0 0 1 14.832 2.254c24.718 26.744 43.619 58.944 54.689 94.586 1.667 5.366-.592 11.175-5.459 13.985L444.788 220.9a193.485 193.485 0 0 1 0 70.2zM336 256c0-44.112-35.888-80-80-80s-80 35.888-80 80 35.888 80 80 80 80-35.888 80-80z"
      />
    </svg>
    {{ text }}
  </i>
</template>

<script>
export default {
  props: {
    icon: { type: String, default: undefined },
    text: { type: String, default: undefined },
  },
}
</script>```

[danielroe]

Thank you ❤️