{
  "name": "svelte-sample-sample-doc-block-handle",
  "title": "svelte-sample-sample-doc-block-handle",
  "type": "registry:component",
  "description": "",
  "registryDependencies": [],
  "dependencies": [
    "prosekit@^0.22.0"
  ],
  "files": [
    {
      "path": "registry/src/svelte/sample/sample-doc-block-handle.ts",
      "type": "registry:component",
      "target": "components/editor/sample/sample-doc-block-handle.ts",
      "content": "import type { NodeJSON } from 'prosekit/core'\n\nexport const sampleContent: NodeJSON = {\n  type: 'doc',\n  content: [\n    {\n      type: 'heading',\n      attrs: {\n        level: 1,\n      },\n      content: [\n        {\n          type: 'text',\n          text: 'Drag and Drop Demo',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'Try dragging any paragraph or heading by clicking on the handle that appears on the left when you hover over it.',\n        },\n      ],\n    },\n    {\n      type: 'heading',\n      attrs: {\n        level: 2,\n      },\n      content: [\n        {\n          type: 'text',\n          text: 'Getting Started',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'Hover over any block to see the drag handle appear. Click and drag to reorder content.',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'This paragraph can be moved above or below other blocks.',\n        },\n      ],\n    },\n    {\n      type: 'heading',\n      attrs: {\n        level: 2,\n      },\n      content: [\n        {\n          type: 'text',\n          text: 'Different Block Types',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'You can drag paragraphs, headings, lists, code blocks, and more.',\n        },\n      ],\n    },\n    {\n      type: 'heading',\n      attrs: {\n        level: 3,\n      },\n      content: [\n        {\n          type: 'text',\n          text: 'Lists Work Too',\n        },\n      ],\n    },\n    {\n      type: 'list',\n      attrs: {\n        kind: 'bullet',\n        order: null,\n        checked: false,\n        collapsed: false,\n      },\n      content: [\n        {\n          type: 'paragraph',\n          content: [\n            {\n              type: 'text',\n              text: 'This entire list can be dragged',\n            },\n          ],\n        },\n      ],\n    },\n    {\n      type: 'list',\n      attrs: {\n        kind: 'bullet',\n        order: null,\n        checked: false,\n        collapsed: false,\n      },\n      content: [\n        {\n          type: 'paragraph',\n          content: [\n            {\n              type: 'text',\n              text: 'Individual list items stay together',\n            },\n          ],\n        },\n      ],\n    },\n    {\n      type: 'list',\n      attrs: {\n        kind: 'bullet',\n        order: null,\n        checked: false,\n        collapsed: false,\n      },\n      content: [\n        {\n          type: 'paragraph',\n          content: [\n            {\n              type: 'text',\n              text: 'Try moving this list around',\n            },\n          ],\n        },\n      ],\n    },\n    {\n      type: 'list',\n      attrs: {\n        kind: 'ordered',\n        order: null,\n        checked: false,\n        collapsed: false,\n      },\n      content: [\n        {\n          type: 'paragraph',\n          content: [\n            {\n              type: 'text',\n              text: 'Ordered lists also support dragging',\n            },\n          ],\n        },\n      ],\n    },\n    {\n      type: 'list',\n      attrs: {\n        kind: 'ordered',\n        order: null,\n        checked: false,\n        collapsed: false,\n      },\n      content: [\n        {\n          type: 'paragraph',\n          content: [\n            {\n              type: 'text',\n              text: 'The numbering updates automatically',\n            },\n          ],\n        },\n      ],\n    },\n    {\n      type: 'list',\n      attrs: {\n        kind: 'ordered',\n        order: null,\n        checked: false,\n        collapsed: false,\n      },\n      content: [\n        {\n          type: 'paragraph',\n          content: [\n            {\n              type: 'text',\n              text: 'Drag this list to see it in action',\n            },\n          ],\n        },\n      ],\n    },\n    {\n      type: 'heading',\n      attrs: {\n        level: 3,\n      },\n      content: [\n        {\n          type: 'text',\n          text: 'Code Blocks',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'Even code blocks can be moved:',\n        },\n      ],\n    },\n    {\n      type: 'codeBlock',\n      attrs: {\n        language: 'javascript',\n      },\n      content: [\n        {\n          type: 'text',\n          text: '// This code block can be dragged\\nfunction dragAndDrop() {\\n  return \"Easy to rearrange!\"\\n}',\n        },\n      ],\n    },\n    {\n      type: 'heading',\n      attrs: {\n        level: 2,\n      },\n      content: [\n        {\n          type: 'text',\n          text: 'Nested Content',\n        },\n      ],\n    },\n    {\n      type: 'blockquote',\n      content: [\n        {\n          type: 'paragraph',\n          content: [\n            {\n              type: 'text',\n              text: 'This blockquote can be moved as a single unit.',\n            },\n          ],\n        },\n        {\n          type: 'blockquote',\n          content: [\n            {\n              type: 'paragraph',\n              content: [\n                {\n                  type: 'text',\n                  text: 'Nested blockquotes move together with their parent.',\n                },\n              ],\n            },\n          ],\n        },\n      ],\n    },\n    {\n      type: 'heading',\n      attrs: {\n        level: 2,\n      },\n      content: [\n        {\n          type: 'text',\n          text: 'Try It Yourself',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'Practice by moving this paragraph to the top of the document.',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'Or drag this one to between the headings above.',\n        },\n      ],\n    },\n    {\n      type: 'paragraph',\n      content: [\n        {\n          type: 'text',\n          text: 'The drag handles make it easy to reorganize your content exactly how you want it.',\n        },\n      ],\n    },\n  ],\n}\n"
    }
  ],
  "meta": {
    "hasIcons": false,
    "hidden": false,
    "story": "",
    "framework": "svelte",
    "accumulatedFiles": [
      "registry/src/svelte/sample/sample-doc-block-handle.ts"
    ],
    "internalDependencies": []
  },
  "$schema": "https://ui.shadcn.com/schema/registry-item.json"
}
