1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
|
import type { Props as ImageProps } from "corvos/plugins/images.ts";
import type { HTMLAttributes } from "corvos/plugins/jsx.ts";
import { Image } from "corvos/plugins/images.ts";
export type Props = HTMLAttributes<"a"> &
ImageProps & {
"x-bind:src"?: string;
"x-bind:srcset"?: string;
"x-bind:alt"?: string;
"variant"?: "static-black" | "static-white";
};
export const Thumbnail = ({
src,
srcset,
alt,
"x-bind:src": xbindSrc,
"x-bind:srcset": xbindSrcset,
"x-bind:alt": xbindAlt,
variant,
class: cls,
widths,
width,
height,
densities,
"no-transform": noTransform,
...props
}: Props) => (
<a class:list={["o-thumbnail", { [`o-thumbnail--${variant}`]: variant }, cls]} {...props}>
<Image
class="o-thumbnail__image"
src={src}
srcset={srcset}
widths={widths as undefined}
width={width}
height={height}
densities={densities}
no-transform={noTransform}
alt={alt}
x-bind:src={xbindSrc}
x-bind:srcset={xbindSrcset}
x-bind:alt={xbindAlt}
/>
</a>
);
|
