alinea
Version:
[](https://npmjs.org/package/alinea) [](https://packagephobia.com/result?p=alinea)
54 lines (50 loc) • 2.63 kB
JavaScript
import "../../../chunks/chunk-U5RRZUYZ.js";
// src/dashboard/view/media/MediaThumbnail.tsx
import { renderLabel } from "alinea/core";
import { link } from "alinea/dashboard/util/HashRouter";
import { fromModule, px } from "alinea/ui";
import { useContrastColor } from "alinea/ui/hook/UseContrastColor";
import { IcRoundInsertDriveFile } from "alinea/ui/icons/IcRoundInsertDriveFile";
import { useNav } from "../../hook/UseNav.js";
// src/dashboard/view/media/MediaThumbnail.module.scss
var MediaThumbnail_module_default = {
"root": "alinea-MediaThumbnail",
"root-preview": "alinea-MediaThumbnail-preview",
"rootPreview": "alinea-MediaThumbnail-preview",
"root-preview-picture": "alinea-MediaThumbnail-preview-picture",
"rootPreviewPicture": "alinea-MediaThumbnail-preview-picture",
"root-preview-picture-image": "alinea-MediaThumbnail-preview-picture-image",
"rootPreviewPictureImage": "alinea-MediaThumbnail-preview-picture-image",
"root-preview-icon": "alinea-MediaThumbnail-preview-icon",
"rootPreviewIcon": "alinea-MediaThumbnail-preview-icon",
"root-title": "alinea-MediaThumbnail-title",
"rootTitle": "alinea-MediaThumbnail-title",
"root-title-text": "alinea-MediaThumbnail-title-text",
"rootTitleText": "alinea-MediaThumbnail-title-text",
"root-title-extension": "alinea-MediaThumbnail-title-extension",
"rootTitleExtension": "alinea-MediaThumbnail-title-extension"
};
// src/dashboard/view/media/MediaThumbnail.tsx
import { jsx, jsxs } from "react/jsx-runtime";
var styles = fromModule(MediaThumbnail_module_default);
function MediaThumbnail({ file }) {
const nav = useNav();
const { extension, preview, averageColor: color } = file;
const fontColor = useContrastColor(color);
return /* @__PURE__ */ jsx("a", { ...link(nav.entry(file)), className: styles.root(), children: /* @__PURE__ */ jsxs("div", { className: styles.root.preview(), children: [
/* @__PURE__ */ jsx("div", { className: styles.root.preview.picture(), children: preview ? /* @__PURE__ */ jsx(
"img",
{
src: preview,
className: styles.root.preview.picture.image()
}
) : /* @__PURE__ */ jsx("div", { className: styles.root.preview.icon(), children: /* @__PURE__ */ jsx(IcRoundInsertDriveFile, { style: { fontSize: px(36) } }) }) }),
/* @__PURE__ */ jsxs("div", { className: styles.root.title(), children: [
/* @__PURE__ */ jsx("span", { className: styles.root.title.text(), children: renderLabel(file.title) }),
/* @__PURE__ */ jsx("div", { className: styles.root.title.extension(), children: extension })
] })
] }) });
}
export {
MediaThumbnail
};