aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/organisms/widgets/image-widget.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/organisms/widgets/image-widget.tsx')
-rw-r--r--src/components/organisms/widgets/image-widget.tsx20
1 files changed, 12 insertions, 8 deletions
diff --git a/src/components/organisms/widgets/image-widget.tsx b/src/components/organisms/widgets/image-widget.tsx
index f3dc92f..07c4b11 100644
--- a/src/components/organisms/widgets/image-widget.tsx
+++ b/src/components/organisms/widgets/image-widget.tsx
@@ -1,9 +1,9 @@
-import { FC } from 'react';
+import type { FC } from 'react';
import {
ResponsiveImage,
type ResponsiveImageProps,
- Widget,
- type WidgetProps,
+ Collapsible,
+ type CollapsibleProps,
} from '../../molecules';
import styles from './image-widget.module.scss';
@@ -14,9 +14,9 @@ export type Image = Pick<
'alt' | 'height' | 'src' | 'width'
>;
-export type ImageWidgetProps = Pick<
- WidgetProps,
- 'className' | 'expanded' | 'level' | 'title'
+export type ImageWidgetProps = Omit<
+ CollapsibleProps,
+ 'children' | 'onToggle'
> & {
/**
* The content alignment.
@@ -51,19 +51,23 @@ export const ImageWidget: FC<ImageWidgetProps> = ({
description,
image,
imageClassName = '',
+ isCollapsed,
url,
...props
}) => {
const alignmentClass = `widget--${alignment}`;
return (
- <Widget className={`${styles[alignmentClass]} ${className}`} {...props}>
+ <Collapsible
+ {...props}
+ className={`${styles[alignmentClass]} ${className}`}
+ >
<ResponsiveImage
{...image}
caption={description}
className={`${styles.figure} ${imageClassName}`}
target={url}
/>
- </Widget>
+ </Collapsible>
);
};