tmp any

apps/www/public/r/styles/default/blockquote-element.json

@@ -17,7 +17,7 @@
   },
   "files": [
     {
-      "content": "'use client';\n\nimport React from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\n\nimport { PlateElement } from './plate-element';\n\nexport const BlockquoteElement = withRef<typeof PlateElement>(\n  ({ children, className, ...props }, ref) => {\n    return (\n      <PlateElement\n        ref={ref}\n        as=\"blockquote\"\n        className={cn('my-1 border-l-2 pl-6 italic', className)}\n        {...props}\n      >\n        {children}\n      </PlateElement>\n    );\n  }\n);\n",
+      "content": "'use client';\nimport React from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\n\nimport { PlateElement } from './plate-element';\n\nexport const BlockquoteElement = withRef<typeof PlateElement>(\n  ({ children, className, ...props }, ref) => {\n    return (\n      <PlateElement\n        ref={ref}\n        as=\"blockquote\"\n        className={cn('my-1 border-l-2 pl-6 italic', className)}\n        {...props}\n      >\n        {children}\n      </PlateElement>\n    );\n  }\n);\n",
       "path": "plate-ui/blockquote-element.tsx",
       "target": "components/plate-ui/blockquote-element.tsx",
       "type": "registry:ui"

apps/www/public/r/styles/default/code-block-element.json

@@ -19,7 +19,7 @@
   },
   "files": [
     {
-      "content": "'use client';\n\nimport React from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\nimport { useCodeBlockElementState } from '@udecode/plate-code-block/react';\n\nimport { CodeBlockCombobox } from './code-block-combobox';\nimport { PlateElement } from './plate-element';\n\nimport './code-block-element.css';\n\nexport const CodeBlockElement = withRef<typeof PlateElement>(\n  ({ children, className, ...props }, ref) => {\n    const { element } = props;\n    const state = useCodeBlockElementState({ element });\n\n    return (\n      <PlateElement\n        ref={ref}\n        className={cn('relative py-1', state.className, className)}\n        {...props}\n      >\n        <pre className=\"overflow-x-auto rounded-md bg-muted px-6 py-8 font-mono text-sm leading-[normal] [tab-size:2]\">\n          <code>{children}</code>\n        </pre>\n\n        {state.syntax && (\n          <div\n            className=\"absolute right-2 top-2 z-10 select-none\"\n            contentEditable={false}\n          >\n            <CodeBlockCombobox />\n          </div>\n        )}\n      </PlateElement>\n    );\n  }\n);\n",
+      "content": "'use client';\nimport React from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\nimport { useCodeBlockElementState } from '@udecode/plate-code-block/react';\n\nimport { CodeBlockCombobox } from './code-block-combobox';\nimport { PlateElement } from './plate-element';\n\nimport './code-block-element.css';\n\nexport const CodeBlockElement = withRef<typeof PlateElement>(\n  ({ children, className, ...props }, ref) => {\n    const { element } = props;\n\n    const state = useCodeBlockElementState({ element });\n\n    return (\n      <PlateElement\n        ref={ref}\n        className={cn('relative py-1', state.className, className)}\n        {...props}\n      >\n        <pre className=\"overflow-x-auto rounded-md bg-muted px-6 py-8 font-mono text-sm leading-[normal] [tab-size:2]\">\n          <code>{children}</code>\n        </pre>\n\n        {state.syntax && (\n          <div\n            className=\"absolute right-2 top-2 z-10 select-none\"\n            contentEditable={false}\n          >\n            <CodeBlockCombobox />\n          </div>\n        )}\n      </PlateElement>\n    );\n  }\n);\n",
       "path": "plate-ui/code-block-element.tsx",
       "target": "components/plate-ui/code-block-element.tsx",
       "type": "registry:ui"

apps/www/public/r/styles/default/code-leaf.json

@@ -16,7 +16,7 @@
   },
   "files": [
     {
-      "content": "'use client';\n\nimport React from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\nimport { PlateLeaf } from '@udecode/plate-common/react';\n\nexport const CodeLeaf = withRef<typeof PlateLeaf>(\n  ({ children, className, ...props }, ref) => {\n    return (\n      <PlateLeaf\n        ref={ref}\n        asChild\n        className={cn(\n          'whitespace-pre-wrap rounded-md bg-muted px-[0.3em] py-[0.2em] font-mono text-sm',\n          className\n        )}\n        {...props}\n      >\n        <code>{children}</code>\n      </PlateLeaf>\n    );\n  }\n);\n",
+      "content": "'use client';\nimport React from 'react';\n\nimport { cn, withRef } from '@udecode/cn';\nimport { PlateLeaf } from '@udecode/plate-common/react';\n\nexport const CodeLeaf = withRef<typeof PlateLeaf>(\n  ({ children, className, ...props }, ref) => {\n    return (\n      <PlateLeaf\n        ref={ref}\n        asChild\n        className={cn(\n          'whitespace-pre-wrap rounded-md bg-muted px-[0.3em] py-[0.2em] font-mono text-sm',\n          className\n        )}\n        {...props}\n      >\n        <code>{children}</code>\n      </PlateLeaf>\n    );\n  }\n);\n",
       "path": "plate-ui/code-leaf.tsx",
       "target": "components/plate-ui/code-leaf.tsx",
       "type": "registry:ui"

apps/www/public/r/styles/default/code-line-element.json

@@ -17,7 +17,7 @@
   },
   "files": [
     {
-      "content": "'use client';\n\nimport React from 'react';\n\nimport { withRef } from '@udecode/cn';\n\nimport { PlateElement } from './plate-element';\n\nexport const CodeLineElement = withRef<typeof PlateElement>((props, ref) => (\n  <PlateElement ref={ref} {...props} />\n));\n",
+      "content": "'use client';\nimport React from 'react';\n\nimport { withRef } from '@udecode/cn';\n\nimport { PlateElement } from './plate-element';\n\nexport const CodeLineElement = withRef<typeof PlateElement>((props, ref) => (\n  <PlateElement ref={ref} {...props} />\n));\n",
       "path": "plate-ui/code-line-element.tsx",
       "target": "components/plate-ui/code-line-element.tsx",
       "type": "registry:ui"

apps/www/public/r/styles/default/editor.json

@@ -15,7 +15,7 @@
   },
   "files": [
     {
-      "content": "'use client';\n\nimport React from 'react';\n\nimport type { PlateContentProps } from '@udecode/plate-common/react';\nimport type { VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@udecode/cn';\nimport {\n  PlateContent,\n  useEditorContainerRef,\n  useEditorRef,\n} from '@udecode/plate-common/react';\nimport { cva } from 'class-variance-authority';\n\nconst editorContainerVariants = cva(\n  'relative w-full cursor-text overflow-y-auto caret-primary selection:bg-brand/25 focus-visible:outline-none [&_.slate-selection-area]:border [&_.slate-selection-area]:border-brand/25 [&_.slate-selection-area]:bg-brand/15',\n  {\n    defaultVariants: {\n      variant: 'default',\n    },\n    variants: {\n      variant: {\n        default: 'h-full',\n        demo: 'h-[650px]',\n        select: cn(\n          'group rounded-md border border-input ring-offset-background focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2',\n          'has-[[data-readonly]]:w-fit has-[[data-readonly]]:cursor-default has-[[data-readonly]]:border-transparent has-[[data-readonly]]:focus-within:[box-shadow:none]'\n        ),\n      },\n    },\n  }\n);\n\nexport const EditorContainer = ({\n  className,\n  variant,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement> &\n  VariantProps<typeof editorContainerVariants>) => {\n  const editor = useEditorRef();\n  const containerRef = useEditorContainerRef();\n\n  return (\n    <div\n      id={editor.uid}\n      ref={containerRef}\n      className={cn(\n        'ignore-click-outside/toolbar',\n        editorContainerVariants({ variant }),\n        className\n      )}\n      {...props}\n    />\n  );\n};\n\nEditorContainer.displayName = 'EditorContainer';\n\nconst editorVariants = cva(\n  cn(\n    'group/editor',\n    'relative w-full overflow-x-hidden whitespace-pre-wrap break-words',\n    'rounded-md ring-offset-background placeholder:text-muted-foreground/80 focus-visible:outline-none',\n    '[&_[data-slate-placeholder]]:text-muted-foreground/80 [&_[data-slate-placeholder]]:!opacity-100',\n    '[&_[data-slate-placeholder]]:top-[auto_!important]',\n    '[&_strong]:font-bold'\n  ),\n  {\n    defaultVariants: {\n      variant: 'default',\n    },\n    variants: {\n      disabled: {\n        true: 'cursor-not-allowed opacity-50',\n      },\n      focused: {\n        true: 'ring-2 ring-ring ring-offset-2',\n      },\n      variant: {\n        ai: 'w-full px-0 text-base md:text-sm',\n        aiChat:\n          'max-h-[min(70vh,320px)] w-full max-w-[700px] overflow-y-auto px-3 py-2 text-base md:text-sm',\n        default:\n          'size-full px-16 pb-72 pt-4 text-base sm:px-[max(64px,calc(50%-350px))]',\n        demo: 'size-full px-16 pb-72 pt-4 text-base sm:px-[max(64px,calc(50%-350px))]',\n        fullWidth: 'size-full px-16 pb-72 pt-4 text-base sm:px-24',\n        none: '',\n        select: 'px-3 py-2 text-base data-[readonly]:w-fit',\n      },\n    },\n  }\n);\n\nexport type EditorProps = PlateContentProps &\n  VariantProps<typeof editorVariants>;\n\nexport const Editor = React.forwardRef<HTMLDivElement, EditorProps>(\n  ({ className, disabled, focused, variant, ...props }, ref) => {\n    return (\n      <PlateContent\n        ref={ref}\n        className={cn(\n          editorVariants({\n            disabled,\n            focused,\n            variant,\n          }),\n          className\n        )}\n        disabled={disabled}\n        disableDefaultStyles\n        {...props}\n      />\n    );\n  }\n);\n\nEditor.displayName = 'Editor';\n",
+      "content": "'use client';\n\nimport React from 'react';\n\nimport type { PlateContentProps } from '@udecode/plate-common/react';\nimport type { VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@udecode/cn';\nimport {\n  PlateContent,\n  useEditorContainerRef,\n  useEditorRef,\n} from '@udecode/plate-common/react';\nimport { cva } from 'class-variance-authority';\n\nexport const editorContainerVariants = cva(\n  'relative w-full cursor-text overflow-y-auto caret-primary selection:bg-brand/25 focus-visible:outline-none [&_.slate-selection-area]:border [&_.slate-selection-area]:border-brand/25 [&_.slate-selection-area]:bg-brand/15',\n  {\n    defaultVariants: {\n      variant: 'default',\n    },\n    variants: {\n      variant: {\n        default: 'h-full',\n        demo: 'h-[650px]',\n        select: cn(\n          'group rounded-md border border-input ring-offset-background focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2',\n          'has-[[data-readonly]]:w-fit has-[[data-readonly]]:cursor-default has-[[data-readonly]]:border-transparent has-[[data-readonly]]:focus-within:[box-shadow:none]'\n        ),\n      },\n    },\n  }\n);\n\nexport const EditorContainer = ({\n  className,\n  variant,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement> &\n  VariantProps<typeof editorContainerVariants>) => {\n  const editor = useEditorRef();\n  const containerRef = useEditorContainerRef();\n\n  return (\n    <div\n      id={editor.uid}\n      ref={containerRef}\n      className={cn(\n        'ignore-click-outside/toolbar',\n        editorContainerVariants({ variant }),\n        className\n      )}\n      {...props}\n    />\n  );\n};\n\nEditorContainer.displayName = 'EditorContainer';\n\nexport const editorVariants = cva(\n  cn(\n    'group/editor',\n    'relative w-full overflow-x-hidden whitespace-pre-wrap break-words',\n    'rounded-md ring-offset-background placeholder:text-muted-foreground/80 focus-visible:outline-none',\n    '[&_[data-slate-placeholder]]:text-muted-foreground/80 [&_[data-slate-placeholder]]:!opacity-100',\n    '[&_[data-slate-placeholder]]:top-[auto_!important]',\n    '[&_strong]:font-bold'\n  ),\n  {\n    defaultVariants: {\n      variant: 'default',\n    },\n    variants: {\n      disabled: {\n        true: 'cursor-not-allowed opacity-50',\n      },\n      focused: {\n        true: 'ring-2 ring-ring ring-offset-2',\n      },\n      variant: {\n        ai: 'w-full px-0 text-base md:text-sm',\n        aiChat:\n          'max-h-[min(70vh,320px)] w-full max-w-[700px] overflow-y-auto px-3 py-2 text-base md:text-sm',\n        default:\n          'size-full px-16 pb-72 pt-4 text-base sm:px-[max(64px,calc(50%-350px))]',\n        demo: 'size-full px-16 pb-72 pt-4 text-base sm:px-[max(64px,calc(50%-350px))]',\n        fullWidth: 'size-full px-16 pb-72 pt-4 text-base sm:px-24',\n        none: '',\n        select: 'px-3 py-2 text-base data-[readonly]:w-fit',\n      },\n    },\n  }\n);\n\nexport type EditorProps = PlateContentProps &\n  VariantProps<typeof editorVariants>;\n\nexport const Editor = React.forwardRef<HTMLDivElement, EditorProps>(\n  ({ className, disabled, focused, variant, ...props }, ref) => {\n    return (\n      <PlateContent\n        ref={ref}\n        className={cn(\n          editorVariants({\n            disabled,\n            focused,\n            variant,\n          }),\n          className\n        )}\n        disabled={disabled}\n        disableDefaultStyles\n        {...props}\n      />\n    );\n  }\n);\n\nEditor.displayName = 'Editor';\n",
       "path": "plate-ui/editor.tsx",
       "target": "components/plate-ui/editor.tsx",
       "type": "registry:ui"

apps/www/public/r/styles/default/heading-element.json

@@ -17,7 +17,7 @@
   },
   "files": [
     {
-      "content": "'use client';\n\nimport React from 'react';\n\nimport { withRef, withVariants } from '@udecode/cn';\nimport { cva } from 'class-variance-authority';\n\nimport { PlateElement } from './plate-element';\n\nconst headingVariants = cva('relative mb-1', {\n  variants: {\n    variant: {\n      h1: 'mt-[1.6em] pb-1 font-heading text-4xl font-bold',\n      h2: 'mt-[1.4em] pb-px font-heading text-2xl font-semibold tracking-tight',\n      h3: 'mt-[1em] pb-px font-heading text-xl font-semibold tracking-tight',\n      h4: 'mt-[0.75em] font-heading text-lg font-semibold tracking-tight',\n      h5: 'mt-[0.75em] text-lg font-semibold tracking-tight',\n      h6: 'mt-[0.75em] text-base font-semibold tracking-tight',\n    },\n  },\n});\n\nconst HeadingElementVariants = withVariants(PlateElement, headingVariants, [\n  'variant',\n]);\n\nexport const HeadingElement = withRef<typeof HeadingElementVariants>(\n  ({ children, variant = 'h1', ...props }, ref) => {\n    return (\n      <HeadingElementVariants\n        ref={ref}\n        as={variant!}\n        variant={variant}\n        {...props}\n      >\n        {children}\n      </HeadingElementVariants>\n    );\n  }\n);\n",
+      "content": "'use client';\n\nimport React from 'react';\n\nimport { withRef, withVariants } from '@udecode/cn';\nimport { cva } from 'class-variance-authority';\n\nimport { PlateElement } from './plate-element';\n\nexport const headingVariants = cva('relative mb-1', {\n  variants: {\n    variant: {\n      h1: 'mt-[1.6em] pb-1 font-heading text-4xl font-bold',\n      h2: 'mt-[1.4em] pb-px font-heading text-2xl font-semibold tracking-tight',\n      h3: 'mt-[1em] pb-px font-heading text-xl font-semibold tracking-tight',\n      h4: 'mt-[0.75em] font-heading text-lg font-semibold tracking-tight',\n      h5: 'mt-[0.75em] text-lg font-semibold tracking-tight',\n      h6: 'mt-[0.75em] text-base font-semibold tracking-tight',\n    },\n  },\n});\n\nconst HeadingElementVariants = withVariants(PlateElement, headingVariants, [\n  'variant',\n]);\n\nexport const HeadingElement = withRef<typeof HeadingElementVariants>(\n  ({ children, variant = 'h1', ...props }, ref) => {\n    return (\n      <HeadingElementVariants\n        ref={ref}\n        as={variant!}\n        variant={variant}\n        {...props}\n      >\n        {children}\n      </HeadingElementVariants>\n    );\n  }\n);\n",
       "path": "plate-ui/heading-element.tsx",
       "target": "components/plate-ui/heading-element.tsx",
       "type": "registry:ui"

apps/www/src/registry/default/plate-static-ui/heading-element.tsx

@@ -1,11 +1,24 @@
 import type { StaticElementProps } from '@udecode/plate-core';
 
-import { headingVariants } from '../plate-ui/heading-element';
+import { cva } from 'class-variance-authority';
 
 interface HeadingElementViewProps extends StaticElementProps {
   variant?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 }
 
+export const headingVariants = cva('relative mb-1', {
+  variants: {
+    variant: {
+      h1: 'mt-[1.6em] pb-1 font-heading text-4xl font-bold',
+      h2: 'mt-[1.4em] pb-px font-heading text-2xl font-semibold tracking-tight',
+      h3: 'mt-[1em] pb-px font-heading text-xl font-semibold tracking-tight',
+      h4: 'mt-[0.75em] font-heading text-lg font-semibold tracking-tight',
+      h5: 'mt-[0.75em] text-lg font-semibold tracking-tight',
+      h6: 'mt-[0.75em] text-base font-semibold tracking-tight',
+    },
+  },
+});
+
 export const HeadingStaticElement = ({
   attributes,
   children,

apps/www/src/registry/default/plate-ui/heading-element.tsx

@@ -3,23 +3,10 @@
 import React from 'react';
 
 import { withRef, withVariants } from '@udecode/cn';
-import { cva } from 'class-variance-authority';
 
+import { headingVariants } from '../plate-static-ui/heading-element';
 import { PlateElement } from './plate-element';
 
-export const headingVariants = cva('relative mb-1', {
-  variants: {
-    variant: {
-      h1: 'mt-[1.6em] pb-1 font-heading text-4xl font-bold',
-      h2: 'mt-[1.4em] pb-px font-heading text-2xl font-semibold tracking-tight',
-      h3: 'mt-[1em] pb-px font-heading text-xl font-semibold tracking-tight',
-      h4: 'mt-[0.75em] font-heading text-lg font-semibold tracking-tight',
-      h5: 'mt-[0.75em] text-lg font-semibold tracking-tight',
-      h6: 'mt-[0.75em] text-base font-semibold tracking-tight',
-    },
-  },
-});
-
 const HeadingElementVariants = withVariants(PlateElement, headingVariants, [
   'variant',
 ]);