{
  "name": "svelte-ui-word-counter",
  "title": "svelte-ui-word-counter",
  "type": "registry:component",
  "description": "",
  "registryDependencies": [],
  "dependencies": [
    "prosekit@^0.22.0"
  ],
  "files": [
    {
      "path": "registry/src/svelte/ui/word-counter/index.ts",
      "type": "registry:component",
      "target": "components/editor/ui/word-counter/index.ts",
      "content": "export { default as WordCounter } from './word-counter.svelte'\n"
    },
    {
      "path": "registry/src/svelte/ui/word-counter/word-counter.svelte",
      "type": "registry:component",
      "target": "components/editor/ui/word-counter/word-counter.svelte",
      "content": "<script lang=\"ts\">\nimport type { Editor } from 'prosekit/core'\nimport { useEditorDerivedValue } from 'prosekit/svelte'\n\nfunction getCounts(editor: Editor) {\n  const doc = editor.state.doc\n  const words = doc ? doc.textBetween(0, doc.content.size, ' ') : ''\n  const wordCount = words.split(/\\s+/).filter((word) => word).length\n  const characterCount = doc ? doc.textContent.length : 0\n  return { wordCount, characterCount }\n}\n\nconst counts = useEditorDerivedValue(getCounts)\n</script>\n\n<div class=\"p-4 text-center italic tabular-nums\">\n  Word Count: {$counts.wordCount}\n  <br />\n  Character Count: {$counts.characterCount}\n</div>\n"
    }
  ],
  "meta": {
    "hasIcons": false,
    "hidden": false,
    "story": "",
    "framework": "svelte",
    "accumulatedFiles": [
      "registry/src/svelte/ui/word-counter/index.ts",
      "registry/src/svelte/ui/word-counter/word-counter.svelte"
    ],
    "internalDependencies": []
  },
  "$schema": "https://ui.shadcn.com/schema/registry-item.json"
}