🩹

OliverWales · Sep 2, 2023 · fe3a11d · fe3a11d
1 parent 4fbc394
commit fe3a11d
Show file tree

Hide file tree

Showing 2 changed files with 1 addition and 2 deletions.
diff --git a/apps/www/public/registry/styles/default/image-element.json b/apps/www/public/registry/styles/default/image-element.json
@@ -11,7 +11,7 @@
   "files": [
     {
       "name": "image-element.tsx",
-      "content": "import React from 'react';\nimport { PlateElement, PlateElementProps, Value } from '@udecode/plate-common';\nimport {\n  ELEMENT_IMAGE,\n  Image,\n  TImageElement,\n  useMediaState,\n} from '@udecode/plate-media';\nimport { useResizableStore } from '@udecode/plate-resizable';\n\nimport { cn } from '@/lib/utils';\n\nimport { Caption, CaptionTextarea } from './caption';\nimport { MediaPopover } from './media-popover';\nimport {\n  mediaResizeHandleVariants,\n  Resizable,\n  ResizeHandle,\n} from './resizable';\n\nexport function ImageElement({\n  className,\n  children,\n  nodeProps,\n  ...props\n}: PlateElementProps<Value, TImageElement>) {\n  const { readOnly, focused, selected, align = 'center' } = useMediaState();\n  const width = useResizableStore().get.width();\n\n  return (\n    <MediaPopover pluginKey={ELEMENT_IMAGE}>\n      <PlateElement className={cn('py-2.5', className)} {...props}>\n        <figure className=\"group relative m-0\" contentEditable={false}>\n          <Resizable\n            align={align}\n            options={{\n              align,\n              readOnly,\n            }}\n          >\n            <ResizeHandle\n              options={{ direction: 'left' }}\n              className={mediaResizeHandleVariants({ direction: 'left' })}\n            />\n            <Image\n              className={cn(\n                'block w-full max-w-full cursor-pointer object-cover px-0',\n                'rounded-sm',\n                focused && selected && 'ring-2 ring-ring ring-offset-2'\n              )}\n              alt=\"\"\n              {...nodeProps}\n            />\n            <ResizeHandle\n              options={{ direction: 'right' }}\n              className={mediaResizeHandleVariants({ direction: 'right' })}\n            />\n          </Resizable>\n\n          <Caption align={align} style={{ width }}>\n            <CaptionTextarea\n              placeholder=\"Write a caption...\"\n              options={{}}\n              readOnly={readOnly}\n            />\n          </Caption>\n        </figure>\n\n        {children}\n      </PlateElement>\n    </MediaPopover>\n  );\n}\n"
+      "content": "import React from 'react';\nimport { PlateElement, PlateElementProps, Value } from '@udecode/plate-common';\nimport {\n  ELEMENT_IMAGE,\n  Image,\n  TImageElement,\n  useMediaState,\n} from '@udecode/plate-media';\nimport { useResizableStore } from '@udecode/plate-resizable';\n\nimport { cn } from '@/lib/utils';\n\nimport { Caption, CaptionTextarea } from './caption';\nimport { MediaPopover } from './media-popover';\nimport {\n  mediaResizeHandleVariants,\n  Resizable,\n  ResizeHandle,\n} from './resizable';\n\nexport function ImageElement({\n  className,\n  children,\n  nodeProps,\n  ...props\n}: PlateElementProps<Value, TImageElement>) {\n  const { readOnly, focused, selected, align = 'center' } = useMediaState();\n  const width = useResizableStore().get.width();\n\n  return (\n    <MediaPopover pluginKey={ELEMENT_IMAGE}>\n      <PlateElement className={cn('py-2.5', className)} {...props}>\n        <figure className=\"group relative m-0\" contentEditable={false}>\n          <Resizable\n            align={align}\n            options={{\n              align,\n              readOnly,\n            }}\n          >\n            <ResizeHandle\n              options={{ direction: 'left' }}\n              className={mediaResizeHandleVariants({ direction: 'left' })}\n            />\n            <Image\n              className={cn(\n                'block w-full max-w-full cursor-pointer object-cover px-0',\n                'rounded-sm',\n                focused && selected && 'ring-2 ring-ring ring-offset-2'\n              )}\n              alt=\"\"\n              {...nodeProps}\n            />\n            <ResizeHandle\n              options={{ direction: 'right' }}\n              className={mediaResizeHandleVariants({ direction: 'right' })}\n            />\n          </Resizable>\n\n          <Caption align={align} style={{ width }}>\n            <CaptionTextarea\n              placeholder=\"Write a caption...\"\n              readOnly={readOnly}\n            />\n          </Caption>\n        </figure>\n\n        {children}\n      </PlateElement>\n    </MediaPopover>\n  );\n}\n"
     }
   ],
   "type": "components:plate-ui"

diff --git a/apps/www/src/registry/default/plate-ui/image-element.tsx b/apps/www/src/registry/default/plate-ui/image-element.tsx
@@ -60,7 +60,6 @@ export function ImageElement({
           <Caption align={align} style={{ width }}>
             <CaptionTextarea
               placeholder="Write a caption..."
-              options={{}}
               readOnly={readOnly}
             />
           </Caption>