feat(CharacterCount): Add counter function to CharacterCount extension.

[ho991217]

Changes Overview

Made CharacterCount's text and word counting logic to accessible from outside, which can solve issues with string containing emoji.

Implementation Approach

I've just added these two options

export interface CharacterCountOptions {
  /**
   * The text counter function to use. Defaults to a simple character count.
   * @default (text) => text.length
   * @example (text) => [...new Intl.Segmenter().segment(text)].length
   */
  textCounter: (text: string) => number
  /**
   * The word counter function to use. Defaults to a simple word count.
   * @default (text) => text.split(' ').filter(word => word !== '').length
   * @example (text) => text.split(/\s+/).filter(word => word !== '').length
   */
  wordCounter: (text: string) => number
}

and default options

      textCounter: text => text.length,
      wordCounter: text => text.split(' ').filter(word => word !== '').length,

Testing Done

Verification Steps

Additional Notes

Checklist

• I have created a changeset for this PR if necessary.
• My changes do not break the library.
• I have added tests where applicable.
• I have followed the project guidelines.
• I have fixed any lint issues.

Related Issues

[changeset-bot]

🦋 Changeset detected

Latest commit: 2d0a255

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 54 packages

Name	Type
@tiptap/extension-character-count	Minor
@tiptap/core	Minor
@tiptap/extension-blockquote	Minor
@tiptap/extension-bold	Minor
@tiptap/extension-bubble-menu	Minor
@tiptap/extension-bullet-list	Minor
@tiptap/extension-code-block-lowlight	Minor
@tiptap/extension-code-block	Minor
@tiptap/extension-code	Minor
@tiptap/extension-collaboration-cursor	Minor
@tiptap/extension-collaboration	Minor
@tiptap/extension-color	Minor
@tiptap/extension-document	Minor
@tiptap/extension-dropcursor	Minor
@tiptap/extension-floating-menu	Minor
@tiptap/extension-focus	Minor
@tiptap/extension-font-family	Minor
@tiptap/extension-gapcursor	Minor
@tiptap/extension-hard-break	Minor
@tiptap/extension-heading	Minor
@tiptap/extension-highlight	Minor
@tiptap/extension-history	Minor
@tiptap/extension-horizontal-rule	Minor
@tiptap/extension-image	Minor
@tiptap/extension-italic	Minor
@tiptap/extension-link	Minor
@tiptap/extension-list-item	Minor
@tiptap/extension-list-keymap	Minor
@tiptap/extension-mention	Minor
@tiptap/extension-ordered-list	Minor
@tiptap/extension-paragraph	Minor
@tiptap/extension-placeholder	Minor
@tiptap/extension-strike	Minor
@tiptap/extension-subscript	Minor
@tiptap/extension-superscript	Minor
@tiptap/extension-table-cell	Minor
@tiptap/extension-table-header	Minor
@tiptap/extension-table-row	Minor
@tiptap/extension-table	Minor
@tiptap/extension-task-item	Minor
@tiptap/extension-task-list	Minor
@tiptap/extension-text-align	Minor
@tiptap/extension-text-style	Minor
@tiptap/extension-text	Minor
@tiptap/extension-typography	Minor
@tiptap/extension-underline	Minor
@tiptap/extension-youtube	Minor
@tiptap/html	Minor
@tiptap/pm	Minor
@tiptap/react	Minor
@tiptap/starter-kit	Minor
@tiptap/suggestion	Minor
@tiptap/vue-2	Minor
@tiptap/vue-3	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[netlify]

✅ Deploy Preview for tiptap-embed ready!

Name	Link
🔨 Latest commit	2d0a255
🔍 Latest deploy log	https://app.netlify.com/sites/tiptap-embed/deploys/66f6402bee59bb0008eb6d92
😎 Deploy Preview	https://deploy-preview-5674--tiptap-embed.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[gethari]

just a thought !

how about adding a flag that can ignore/consider emoji as a character ? user's can decided between the flags ?

[bdbch]

Nice idea - LGTM

[nperez0111]

how about adding a flag that can ignore/consider emoji as a character ? user's can decided between the flags ?

I think that a function gives the most flexibility to the end user on how they would want to implement this. Let's just go with this for now