@verdaccio/ui-components 5.0.0-next-9.24 → 5.0.0-next-9.26

package/build/components/Loading/PackageListSkeleton.mjs

@@ -0,0 +1,65 @@
+import "react";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Box from "@mui/material/Box";
+import Divider from "@mui/material/Divider";
+import Skeleton from "@mui/material/Skeleton";
+//#region src/components/Loading/PackageListSkeleton.tsx
+var ROWS = 5;
+var PackageListSkeleton = () => {
+	const { t } = useTranslation();
+	return /* @__PURE__ */ jsx(Box, {
+		"aria-busy": true,
+		"aria-label": t("loading"),
+		"data-testid": "package-list-skeleton",
+		role: "status",
+		children: Array.from({ length: ROWS }, (_, index) => /* @__PURE__ */ jsxs(Box, { children: [index !== 0 && /* @__PURE__ */ jsx(Divider, {}), /* @__PURE__ */ jsxs(Box, {
+			sx: {
+				px: 2,
+				py: 1.5
+			},
+			children: [
+				/* @__PURE__ */ jsx(Skeleton, {
+					height: 32,
+					variant: "text",
+					width: "35%"
+				}),
+				/* @__PURE__ */ jsx(Skeleton, {
+					variant: "text",
+					width: "80%"
+				}),
+				/* @__PURE__ */ jsxs(Box, {
+					sx: {
+						display: "flex",
+						alignItems: "center",
+						gap: 2,
+						mt: 1
+					},
+					children: [
+						/* @__PURE__ */ jsx(Skeleton, {
+							height: 20,
+							variant: "circular",
+							width: 20
+						}),
+						/* @__PURE__ */ jsx(Skeleton, {
+							variant: "text",
+							width: 80
+						}),
+						/* @__PURE__ */ jsx(Skeleton, {
+							variant: "text",
+							width: 60
+						}),
+						/* @__PURE__ */ jsx(Skeleton, {
+							variant: "text",
+							width: 110
+						})
+					]
+				})
+			]
+		})] }, index))
+	});
+};
+//#endregion
+export { PackageListSkeleton as default };
+
+//# sourceMappingURL=PackageListSkeleton.mjs.map

package/build/components/Loading/PackageListSkeleton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PackageListSkeleton.mjs","names":[],"sources":["../../../src/components/Loading/PackageListSkeleton.tsx"],"sourcesContent":["import Box from '@mui/material/Box';\nimport Divider from '@mui/material/Divider';\nimport Skeleton from '@mui/material/Skeleton';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nconst ROWS = 5;\n\nconst PackageListSkeleton: React.FC = () => {\n  const { t } = useTranslation();\n  return (\n    <Box\n      aria-busy={true}\n      aria-label={t('loading')}\n      data-testid=\"package-list-skeleton\"\n      role=\"status\"\n    >\n      {Array.from({ length: ROWS }, (_, index) => (\n        <Box key={index}>\n          {index !== 0 && <Divider />}\n          <Box sx={{ px: 2, py: 1.5 }}>\n            <Skeleton height={32} variant=\"text\" width=\"35%\" />\n            <Skeleton variant=\"text\" width=\"80%\" />\n            <Box sx={{ display: 'flex', alignItems: 'center', gap: 2, mt: 1 }}>\n              <Skeleton height={20} variant=\"circular\" width={20} />\n              <Skeleton variant=\"text\" width={80} />\n              <Skeleton variant=\"text\" width={60} />\n              <Skeleton variant=\"text\" width={110} />\n            </Box>\n          </Box>\n        </Box>\n      ))}\n    </Box>\n  );\n};\n\nexport default PackageListSkeleton;\n"],"mappings":";;;;;;;AAMA,IAAM,OAAO;AAEb,IAAM,4BAAsC;CAC1C,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,oBAAC,KAAD;EACE,aAAW;EACX,cAAY,EAAE,SAAS;EACvB,eAAY;EACZ,MAAK;EAEJ,UAAA,MAAM,KAAK,EAAE,QAAQ,KAAK,IAAI,GAAG,UAChC,qBAAC,KAAD,EAAA,UAAA,CACG,UAAU,KAAK,oBAAC,SAAD,CAAU,CAAA,GAC1B,qBAAC,KAAD;GAAK,IAAI;IAAE,IAAI;IAAG,IAAI;GAAI;GAA1B,UAAA;IACE,oBAAC,UAAD;KAAU,QAAQ;KAAI,SAAQ;KAAO,OAAM;IAAO,CAAA;IAClD,oBAAC,UAAD;KAAU,SAAQ;KAAO,OAAM;IAAO,CAAA;IACtC,qBAAC,KAAD;KAAK,IAAI;MAAE,SAAS;MAAQ,YAAY;MAAU,KAAK;MAAG,IAAI;KAAE;KAAhE,UAAA;MACE,oBAAC,UAAD;OAAU,QAAQ;OAAI,SAAQ;OAAW,OAAO;MAAK,CAAA;MACrD,oBAAC,UAAD;OAAU,SAAQ;OAAO,OAAO;MAAK,CAAA;MACrC,oBAAC,UAAD;OAAU,SAAQ;OAAO,OAAO;MAAK,CAAA;MACrC,oBAAC,UAAD;OAAU,SAAQ;OAAO,OAAO;MAAM,CAAA;KACnC;;GACF;EACF,CAAA,CAAA,EAAA,GAZK,KAYL,CACN;CACE,CAAA;AAET"}

package/build/components/Loading/VersionSkeleton.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const VersionSkeleton: React.FC;
+export default VersionSkeleton;

package/build/components/Loading/VersionSkeleton.js

@@ -0,0 +1,119 @@
+const require_runtime = require("../../_virtual/_rolldown/runtime.js");
+let react = require("react");
+react = require_runtime.__toESM(react);
+let react_i18next = require("react-i18next");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _mui_material_Box = require("@mui/material/Box");
+_mui_material_Box = require_runtime.__toESM(_mui_material_Box);
+let _mui_material_Card = require("@mui/material/Card");
+_mui_material_Card = require_runtime.__toESM(_mui_material_Card);
+let _mui_material_CardContent = require("@mui/material/CardContent");
+_mui_material_CardContent = require_runtime.__toESM(_mui_material_CardContent);
+let _mui_material_Grid = require("@mui/material/Grid");
+_mui_material_Grid = require_runtime.__toESM(_mui_material_Grid);
+let _mui_material_Skeleton = require("@mui/material/Skeleton");
+_mui_material_Skeleton = require_runtime.__toESM(_mui_material_Skeleton);
+let _mui_material_Paper = require("@mui/material/Paper");
+_mui_material_Paper = require_runtime.__toESM(_mui_material_Paper);
+//#region src/components/Loading/VersionSkeleton.tsx
+var VersionSkeleton = () => {
+	const { t } = (0, react_i18next.useTranslation)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mui_material_Grid.default, {
+		"aria-busy": true,
+		"aria-label": t("loading"),
+		className: "container content",
+		container: true,
+		"data-testid": "version-skeleton",
+		role: "status",
+		spacing: 0,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mui_material_Grid.default, {
+			size: {
+				md: 8,
+				xs: 12
+			},
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Box.default, {
+				sx: {
+					display: "flex",
+					gap: 2,
+					mb: 2
+				},
+				children: [
+					0,
+					1,
+					2
+				].map((tab) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+					height: 48,
+					sx: { flex: 1 },
+					variant: "text"
+				}, tab))
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Card.default, {
+				sx: { mb: 2 },
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mui_material_CardContent.default, { children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+						height: 40,
+						variant: "text",
+						width: "50%"
+					}),
+					[
+						95,
+						88,
+						92,
+						70,
+						85,
+						60
+					].map((width, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+						variant: "text",
+						width: `${width}%`
+					}, index)),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+						height: 140,
+						sx: { mt: 2 },
+						variant: "rounded"
+					})
+				] })
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Grid.default, {
+			size: {
+				md: 4,
+				xs: 12
+			},
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mui_material_Paper.default, {
+				sx: {
+					p: 2,
+					ml: {
+						xs: 0,
+						md: 2
+					}
+				},
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+						height: 28,
+						variant: "text",
+						width: "60%"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+						variant: "text",
+						width: "40%"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+						height: 36,
+						sx: { my: 2 },
+						variant: "rounded"
+					}),
+					[
+						0,
+						1,
+						2
+					].map((row) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Skeleton.default, {
+						height: 28,
+						variant: "text"
+					}, row))
+				]
+			})
+		})]
+	});
+};
+//#endregion
+exports.default = VersionSkeleton;
+
+//# sourceMappingURL=VersionSkeleton.js.map

package/build/components/Loading/VersionSkeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VersionSkeleton.js","names":["useTranslation","Grid","Box","Skeleton","Card","CardContent","Paper"],"sources":["../../../src/components/Loading/VersionSkeleton.tsx"],"sourcesContent":["import Box from '@mui/material/Box';\nimport Card from '@mui/material/Card';\nimport CardContent from '@mui/material/CardContent';\nimport Grid from '@mui/material/Grid';\nimport Paper from '@mui/material/Paper';\nimport Skeleton from '@mui/material/Skeleton';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nconst VersionSkeleton: React.FC = () => {\n  const { t } = useTranslation();\n  return (\n    <Grid\n      aria-busy={true}\n      aria-label={t('loading')}\n      className={'container content'}\n      container={true}\n      data-testid=\"version-skeleton\"\n      role=\"status\"\n      spacing={0}\n    >\n      <Grid size={{ md: 8, xs: 12 }}>\n        <Box sx={{ display: 'flex', gap: 2, mb: 2 }}>\n          {[0, 1, 2].map((tab) => (\n            <Skeleton height={48} key={tab} sx={{ flex: 1 }} variant=\"text\" />\n          ))}\n        </Box>\n        <Card sx={{ mb: 2 }}>\n          <CardContent>\n            <Skeleton height={40} variant=\"text\" width=\"50%\" />\n            {[95, 88, 92, 70, 85, 60].map((width, index) => (\n              <Skeleton key={index} variant=\"text\" width={`${width}%`} />\n            ))}\n            <Skeleton height={140} sx={{ mt: 2 }} variant=\"rounded\" />\n          </CardContent>\n        </Card>\n      </Grid>\n      <Grid size={{ md: 4, xs: 12 }}>\n        <Paper sx={{ p: 2, ml: { xs: 0, md: 2 } }}>\n          <Skeleton height={28} variant=\"text\" width=\"60%\" />\n          <Skeleton variant=\"text\" width=\"40%\" />\n          <Skeleton height={36} sx={{ my: 2 }} variant=\"rounded\" />\n          {[0, 1, 2].map((row) => (\n            <Skeleton height={28} key={row} variant=\"text\" />\n          ))}\n        </Paper>\n      </Grid>\n    </Grid>\n  );\n};\n\nexport default VersionSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;AASA,IAAM,wBAAkC;CACtC,MAAM,EAAE,OAAA,GAAMA,cAAAA,eAAAA,CAAe;CAC7B,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,mBAAAA,SAAD;EACE,aAAW;EACX,cAAY,EAAE,SAAS;EACvB,WAAW;EACX,WAAW;EACX,eAAY;EACZ,MAAK;EACL,SAAS;EAPX,UAAA,CASE,iBAAA,GAAA,kBAAA,KAAA,CAACA,mBAAAA,SAAD;GAAM,MAAM;IAAE,IAAI;IAAG,IAAI;GAAG;GAA5B,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,kBAAAA,SAAD;IAAK,IAAI;KAAE,SAAS;KAAQ,KAAK;KAAG,IAAI;IAAE;IACvC,UAAA;KAAC;KAAG;KAAG;IAAC,CAAC,CAAC,KAAK,QACd,iBAAA,GAAA,kBAAA,IAAA,CAACC,uBAAAA,SAAD;KAAU,QAAQ;KAAc,IAAI,EAAE,MAAM,EAAE;KAAG,SAAQ;IAAQ,GAAtC,GAAsC,CAClE;GACE,CAAA,GACL,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,SAAD;IAAM,IAAI,EAAE,IAAI,EAAE;IAChB,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAACC,0BAAAA,SAAD,EAAA,UAAA;KACE,iBAAA,GAAA,kBAAA,IAAA,CAACF,uBAAAA,SAAD;MAAU,QAAQ;MAAI,SAAQ;MAAO,OAAM;KAAO,CAAA;KACjD;MAAC;MAAI;MAAI;MAAI;MAAI;MAAI;KAAE,CAAC,CAAC,KAAK,OAAO,UACpC,iBAAA,GAAA,kBAAA,IAAA,CAACA,uBAAAA,SAAD;MAAsB,SAAQ;MAAO,OAAO,GAAG,MAAM;KAAK,GAA3C,KAA2C,CAC3D;KACD,iBAAA,GAAA,kBAAA,IAAA,CAACA,uBAAAA,SAAD;MAAU,QAAQ;MAAK,IAAI,EAAE,IAAI,EAAE;MAAG,SAAQ;KAAW,CAAA;IAC9C,EAAA,CAAA;GACT,CAAA,CACF;EACN,CAAA,GAAA,iBAAA,GAAA,kBAAA,IAAA,CAACF,mBAAAA,SAAD;GAAM,MAAM;IAAE,IAAI;IAAG,IAAI;GAAG;GAC1B,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAACK,oBAAAA,SAAD;IAAO,IAAI;KAAE,GAAG;KAAG,IAAI;MAAE,IAAI;MAAG,IAAI;KAAE;IAAE;IAAxC,UAAA;KACE,iBAAA,GAAA,kBAAA,IAAA,CAACH,uBAAAA,SAAD;MAAU,QAAQ;MAAI,SAAQ;MAAO,OAAM;KAAO,CAAA;KAClD,iBAAA,GAAA,kBAAA,IAAA,CAACA,uBAAAA,SAAD;MAAU,SAAQ;MAAO,OAAM;KAAO,CAAA;KACtC,iBAAA,GAAA,kBAAA,IAAA,CAACA,uBAAAA,SAAD;MAAU,QAAQ;MAAI,IAAI,EAAE,IAAI,EAAE;MAAG,SAAQ;KAAW,CAAA;KACvD;MAAC;MAAG;MAAG;KAAC,CAAC,CAAC,KAAK,QACd,iBAAA,GAAA,kBAAA,IAAA,CAACA,uBAAAA,SAAD;MAAU,QAAQ;MAAc,SAAQ;KAAQ,GAArB,GAAqB,CACjD;IACI;;EACH,CAAA,CACF;;AAEV"}

package/build/components/Loading/VersionSkeleton.mjs

@@ -0,0 +1,111 @@
+import "react";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Box from "@mui/material/Box";
+import Card from "@mui/material/Card";
+import CardContent from "@mui/material/CardContent";
+import Grid from "@mui/material/Grid";
+import Skeleton from "@mui/material/Skeleton";
+import Paper from "@mui/material/Paper";
+//#region src/components/Loading/VersionSkeleton.tsx
+var VersionSkeleton = () => {
+	const { t } = useTranslation();
+	return /* @__PURE__ */ jsxs(Grid, {
+		"aria-busy": true,
+		"aria-label": t("loading"),
+		className: "container content",
+		container: true,
+		"data-testid": "version-skeleton",
+		role: "status",
+		spacing: 0,
+		children: [/* @__PURE__ */ jsxs(Grid, {
+			size: {
+				md: 8,
+				xs: 12
+			},
+			children: [/* @__PURE__ */ jsx(Box, {
+				sx: {
+					display: "flex",
+					gap: 2,
+					mb: 2
+				},
+				children: [
+					0,
+					1,
+					2
+				].map((tab) => /* @__PURE__ */ jsx(Skeleton, {
+					height: 48,
+					sx: { flex: 1 },
+					variant: "text"
+				}, tab))
+			}), /* @__PURE__ */ jsx(Card, {
+				sx: { mb: 2 },
+				children: /* @__PURE__ */ jsxs(CardContent, { children: [
+					/* @__PURE__ */ jsx(Skeleton, {
+						height: 40,
+						variant: "text",
+						width: "50%"
+					}),
+					[
+						95,
+						88,
+						92,
+						70,
+						85,
+						60
+					].map((width, index) => /* @__PURE__ */ jsx(Skeleton, {
+						variant: "text",
+						width: `${width}%`
+					}, index)),
+					/* @__PURE__ */ jsx(Skeleton, {
+						height: 140,
+						sx: { mt: 2 },
+						variant: "rounded"
+					})
+				] })
+			})]
+		}), /* @__PURE__ */ jsx(Grid, {
+			size: {
+				md: 4,
+				xs: 12
+			},
+			children: /* @__PURE__ */ jsxs(Paper, {
+				sx: {
+					p: 2,
+					ml: {
+						xs: 0,
+						md: 2
+					}
+				},
+				children: [
+					/* @__PURE__ */ jsx(Skeleton, {
+						height: 28,
+						variant: "text",
+						width: "60%"
+					}),
+					/* @__PURE__ */ jsx(Skeleton, {
+						variant: "text",
+						width: "40%"
+					}),
+					/* @__PURE__ */ jsx(Skeleton, {
+						height: 36,
+						sx: { my: 2 },
+						variant: "rounded"
+					}),
+					[
+						0,
+						1,
+						2
+					].map((row) => /* @__PURE__ */ jsx(Skeleton, {
+						height: 28,
+						variant: "text"
+					}, row))
+				]
+			})
+		})]
+	});
+};
+//#endregion
+export { VersionSkeleton as default };
+
+//# sourceMappingURL=VersionSkeleton.mjs.map

package/build/components/Loading/VersionSkeleton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VersionSkeleton.mjs","names":[],"sources":["../../../src/components/Loading/VersionSkeleton.tsx"],"sourcesContent":["import Box from '@mui/material/Box';\nimport Card from '@mui/material/Card';\nimport CardContent from '@mui/material/CardContent';\nimport Grid from '@mui/material/Grid';\nimport Paper from '@mui/material/Paper';\nimport Skeleton from '@mui/material/Skeleton';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nconst VersionSkeleton: React.FC = () => {\n  const { t } = useTranslation();\n  return (\n    <Grid\n      aria-busy={true}\n      aria-label={t('loading')}\n      className={'container content'}\n      container={true}\n      data-testid=\"version-skeleton\"\n      role=\"status\"\n      spacing={0}\n    >\n      <Grid size={{ md: 8, xs: 12 }}>\n        <Box sx={{ display: 'flex', gap: 2, mb: 2 }}>\n          {[0, 1, 2].map((tab) => (\n            <Skeleton height={48} key={tab} sx={{ flex: 1 }} variant=\"text\" />\n          ))}\n        </Box>\n        <Card sx={{ mb: 2 }}>\n          <CardContent>\n            <Skeleton height={40} variant=\"text\" width=\"50%\" />\n            {[95, 88, 92, 70, 85, 60].map((width, index) => (\n              <Skeleton key={index} variant=\"text\" width={`${width}%`} />\n            ))}\n            <Skeleton height={140} sx={{ mt: 2 }} variant=\"rounded\" />\n          </CardContent>\n        </Card>\n      </Grid>\n      <Grid size={{ md: 4, xs: 12 }}>\n        <Paper sx={{ p: 2, ml: { xs: 0, md: 2 } }}>\n          <Skeleton height={28} variant=\"text\" width=\"60%\" />\n          <Skeleton variant=\"text\" width=\"40%\" />\n          <Skeleton height={36} sx={{ my: 2 }} variant=\"rounded\" />\n          {[0, 1, 2].map((row) => (\n            <Skeleton height={28} key={row} variant=\"text\" />\n          ))}\n        </Paper>\n      </Grid>\n    </Grid>\n  );\n};\n\nexport default VersionSkeleton;\n"],"mappings":";;;;;;;;;;AASA,IAAM,wBAAkC;CACtC,MAAM,EAAE,MAAM,eAAe;CAC7B,OACE,qBAAC,MAAD;EACE,aAAW;EACX,cAAY,EAAE,SAAS;EACvB,WAAW;EACX,WAAW;EACX,eAAY;EACZ,MAAK;EACL,SAAS;EAPX,UAAA,CASE,qBAAC,MAAD;GAAM,MAAM;IAAE,IAAI;IAAG,IAAI;GAAG;GAA5B,UAAA,CACE,oBAAC,KAAD;IAAK,IAAI;KAAE,SAAS;KAAQ,KAAK;KAAG,IAAI;IAAE;IACvC,UAAA;KAAC;KAAG;KAAG;IAAC,CAAC,CAAC,KAAK,QACd,oBAAC,UAAD;KAAU,QAAQ;KAAc,IAAI,EAAE,MAAM,EAAE;KAAG,SAAQ;IAAQ,GAAtC,GAAsC,CAClE;GACE,CAAA,GACL,oBAAC,MAAD;IAAM,IAAI,EAAE,IAAI,EAAE;IAChB,UAAA,qBAAC,aAAD,EAAA,UAAA;KACE,oBAAC,UAAD;MAAU,QAAQ;MAAI,SAAQ;MAAO,OAAM;KAAO,CAAA;KACjD;MAAC;MAAI;MAAI;MAAI;MAAI;MAAI;KAAE,CAAC,CAAC,KAAK,OAAO,UACpC,oBAAC,UAAD;MAAsB,SAAQ;MAAO,OAAO,GAAG,MAAM;KAAK,GAA3C,KAA2C,CAC3D;KACD,oBAAC,UAAD;MAAU,QAAQ;MAAK,IAAI,EAAE,IAAI,EAAE;MAAG,SAAQ;KAAW,CAAA;IAC9C,EAAA,CAAA;GACT,CAAA,CACF;EACN,CAAA,GAAA,oBAAC,MAAD;GAAM,MAAM;IAAE,IAAI;IAAG,IAAI;GAAG;GAC1B,UAAA,qBAAC,OAAD;IAAO,IAAI;KAAE,GAAG;KAAG,IAAI;MAAE,IAAI;MAAG,IAAI;KAAE;IAAE;IAAxC,UAAA;KACE,oBAAC,UAAD;MAAU,QAAQ;MAAI,SAAQ;MAAO,OAAM;KAAO,CAAA;KAClD,oBAAC,UAAD;MAAU,SAAQ;MAAO,OAAM;KAAO,CAAA;KACtC,oBAAC,UAAD;MAAU,QAAQ;MAAI,IAAI,EAAE,IAAI,EAAE;MAAG,SAAQ;KAAW,CAAA;KACvD;MAAC;MAAG;MAAG;KAAC,CAAC,CAAC,KAAK,QACd,oBAAC,UAAD;MAAU,QAAQ;MAAc,SAAQ;KAAQ,GAArB,GAAqB,CACjD;IACI;;EACH,CAAA,CACF;;AAEV"}

package/build/components/Loading/index.d.ts

@@ -1 +1,3 @@
 export { default } from './Loading';
+export { default as PackageListSkeleton } from './PackageListSkeleton';
+export { default as VersionSkeleton } from './VersionSkeleton';

package/build/components/Loading/index.js

@@ -1,2 +1,6 @@
 const require_Loading = require("./Loading.js");
+const require_PackageListSkeleton = require("./PackageListSkeleton.js");
+const require_VersionSkeleton = require("./VersionSkeleton.js");
+exports.PackageListSkeleton = require_PackageListSkeleton.default;
+exports.VersionSkeleton = require_VersionSkeleton.default;
 exports.default = require_Loading.default;

package/build/components/Loading/index.mjs

@@ -1 +1,4 @@
-export { default } from "./Loading.mjs";
+import Loading from "./Loading.mjs";
+import PackageListSkeleton from "./PackageListSkeleton.mjs";
+import VersionSkeleton from "./VersionSkeleton.mjs";
+export { PackageListSkeleton, VersionSkeleton, Loading as default };

package/build/components/Package/Package.js

@@ -49,7 +49,11 @@ var Package = ({ author: { name: authorName, avatar: authorAvatar }, bugs, descr
 		const link = tarballDist.replace(`https://registry.npmjs.org/`, config.base);
 		downloadTarball?.({ link });
 	}, [config, downloadTarball]);
-	const renderVersionInfo = () => version && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_styles.OverviewItem, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledVersion, {}), t("package.version", { version })] });
+	const renderVersionInfo = () => version && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_styles.OverviewItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_styles.VersionLink, {
+		"data-testid": "package-version-link",
+		to: `${require_routes.Route.DETAIL}${packageName}/v/${version}`,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledVersion, {}), t("package.version", { version })]
+	}) });
 	const renderAuthorInfo = () => {
 		const name = require_utils.getAuthorName(authorName);
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_styles.OverviewItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_styles.Author, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_styles.Avatar, {

package/build/components/Package/Package.js.map

@@ -1 +1 @@
-{"version":3,"file":"Package.js","names":["getConfiguration","useTranslation","useManifests","useDownload","useCallback","OverviewItem","Author","Avatar","Details","Published","LinkExternal","Tooltip","IconButton","HomeIcon","BugReport","CircularProgress","DownloadIcon","Grid","WrapperLink","Route","PackageTitle","GridRightAligned","Description","PackageListItemText","ListItem","List","KeywordListItems","Wrapper","grey","common","Version","FileBinary","Law","Time"],"sources":["../../../src/components/Package/Package.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport BugReport from '@mui/icons-material/BugReport';\nimport DownloadIcon from '@mui/icons-material/CloudDownload';\nimport HomeIcon from '@mui/icons-material/Home';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Grid from '@mui/material/Grid';\nimport List from '@mui/material/List';\nimport ListItem from '@mui/material/ListItem';\nimport Tooltip from '@mui/material/Tooltip';\nimport { common, grey } from '@mui/material/colors';\nimport React, { useCallback } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { Theme } from '../../';\nimport { LinkExternal, useDownload, useManifests } from '../../';\nimport { FileBinary, Law, Time, Version } from '../../components/Icons';\nimport { getConfiguration } from '../../configuration';\nimport type { Author as PackageAuthor } from '../../providers/ManifestsProvider/ManifestsProvider';\nimport type { PackageMetaInterface } from '../../types/packageMeta';\nimport { Route, url, utils } from '../../utils';\nimport KeywordListItems from '../Keywords/KeywordListItems';\nimport {\n  Author,\n  Avatar,\n  Description,\n  Details,\n  GridRightAligned,\n  IconButton,\n  OverviewItem,\n  PackageListItemText,\n  PackageTitle,\n  Published,\n  Wrapper,\n  WrapperLink,\n} from './styles';\n\ninterface Bugs {\n  url: string;\n}\n\ninterface Dist {\n  unpackedSize: number;\n  tarball: string;\n}\n\nexport interface PackageInterface {\n  name: string;\n  version: string;\n  time?: number | string;\n  author: PackageAuthor;\n  description?: string;\n  keywords?: PackageMetaInterface['latest']['keywords'];\n  license?: PackageMetaInterface['latest']['license'];\n  homepage?: string;\n  bugs?: Bugs | string;\n  dist?: Dist;\n  showDownload?: boolean;\n}\n\nconst Package: React.FC<PackageInterface> = ({\n  author: { name: authorName, avatar: authorAvatar },\n  bugs,\n  description,\n  dist,\n  homepage,\n  keywords,\n  license,\n  name: packageName,\n  time,\n  showDownload = true,\n  version,\n}) => {\n  const config = getConfiguration();\n  const { t } = useTranslation();\n  const { isLoading } = useManifests();\n  const { downloadTarball } = useDownload();\n\n  const handleDownload = useCallback(\n    async (tarballDist: string) => {\n      // FIXME: check, the dist might be different thant npmjs\n      const link = tarballDist.replace(`https://registry.npmjs.org/`, config.base);\n      downloadTarball?.({ link });\n    },\n    [config, downloadTarball]\n  );\n\n  const renderVersionInfo = (): React.ReactNode =>\n    version && (\n      <OverviewItem>\n        <StyledVersion />\n        {t('package.version', { version })}\n      </OverviewItem>\n    );\n\n  const renderAuthorInfo = (): React.ReactNode => {\n    const name = utils.getAuthorName(authorName);\n    return (\n      <OverviewItem>\n        <Author>\n          <Avatar alt={name} src={authorAvatar} />\n          <Details>{name}</Details>\n        </Author>\n      </OverviewItem>\n    );\n  };\n\n  const renderFileSize = (): React.ReactNode =>\n    dist?.unpackedSize ? (\n      <OverviewItem>\n        <StyledFileBinary />\n        {utils.fileSizeSI(dist.unpackedSize)}\n      </OverviewItem>\n    ) : null;\n\n  const renderLicenseInfo = (): React.ReactNode =>\n    license && (\n      <OverviewItem>\n        <StyledLaw />\n        {license as string}\n      </OverviewItem>\n    );\n\n  const renderPublishedInfo = (): React.ReactNode =>\n    time && (\n      <OverviewItem>\n        <StyledTime />\n        <Published title={utils.formatDate(time)}>\n          {t('package.published-on', { time: utils.formatDateDistance(time) })}\n        </Published>\n      </OverviewItem>\n    );\n\n  const renderHomePageLink = (): React.ReactNode =>\n    homepage &&\n    url.isURL(homepage) && (\n      <LinkExternal to={homepage}>\n        <Tooltip aria-label={t('package.homepage')} title={t('package.visit-home-page')}>\n          <IconButton aria-label={t('package.homepage')} color=\"primary\" size=\"large\">\n            <HomeIcon />\n          </IconButton>\n        </Tooltip>\n      </LinkExternal>\n    );\n\n  const renderBugsLink = (): React.ReactNode => {\n    // bugs can be the object form or a plain url string, both valid in npm\n    const bugsUrl = utils.getBugsUrl(bugs);\n    return (\n      bugsUrl &&\n      url.isURL(bugsUrl) && (\n        <LinkExternal to={bugsUrl}>\n          <Tooltip aria-label={t('package.bugs')} title={t('package.open-an-issue')}>\n            <IconButton aria-label={t('package.bugs')} color=\"primary\" size=\"large\">\n              <BugReport />\n            </IconButton>\n          </Tooltip>\n        </LinkExternal>\n      )\n    );\n  };\n\n  const renderDownloadLink = (): React.ReactNode =>\n    dist?.tarball &&\n    url.isURL(dist.tarball) && (\n      // a plain button: wrapping it in <Link to=\"#\"> pushed a stray `#` entry\n      // into the browser history on every download\n      <Tooltip\n        aria-label={t('package.download', { what: t('package.the-tar-file') })}\n        title={t('package.tarball')}\n      >\n        <IconButton\n          aria-label={t('package.download')}\n          color=\"primary\"\n          data-testid=\"download-tarball\"\n          onClick={() => {\n            handleDownload(dist.tarball);\n          }}\n          size=\"large\"\n        >\n          {isLoading ? <CircularProgress size={13} /> : <DownloadIcon />}\n        </IconButton>\n      </Tooltip>\n    );\n\n  const renderPrimaryComponent = (): React.ReactNode => {\n    return (\n      <Grid alignItems=\"center\" container={true} size={{ xs: 12 }} wrap=\"wrap\">\n        <Grid size=\"grow\">\n          <WrapperLink to={`${Route.DETAIL}${packageName}`}>\n            <PackageTitle className=\"package-title\" data-testid=\"package-title\">\n              {packageName}\n            </PackageTitle>\n          </WrapperLink>\n        </Grid>\n        <GridRightAligned size=\"auto\">\n          {renderHomePageLink()}\n          {renderBugsLink()}\n          {showDownload && renderDownloadLink()}\n        </GridRightAligned>\n      </Grid>\n    );\n  };\n\n  const renderSecondaryComponent = (): React.ReactNode => <Description>{description}</Description>;\n\n  const renderPackageListItemText = (): React.ReactNode => (\n    <PackageListItemText\n      primary={renderPrimaryComponent()}\n      secondary={renderSecondaryComponent()}\n    />\n  );\n\n  const renderKeywords = (): React.ReactNode => (\n    <ListItem alignItems={'flex-start'} sx={{ py: 0, my: 0 }}>\n      <List sx={{ p: 0, my: 0 }}>\n        <KeywordListItems keywords={keywords} />\n      </List>\n    </ListItem>\n  );\n\n  return (\n    <Wrapper className={'package'} data-testid=\"package-item-list\">\n      <ListItem alignItems={'flex-start'} sx={{ mb: 0 }}>\n        {renderPackageListItemText()}\n      </ListItem>\n      {keywords && keywords?.length > 0 ? renderKeywords() : null}\n      <ListItem alignItems={'flex-start'} sx={{ mt: 0 }}>\n        {renderAuthorInfo()}\n        {renderVersionInfo()}\n        {renderPublishedInfo()}\n        {renderFileSize()}\n        {renderLicenseInfo()}\n      </ListItem>\n    </Wrapper>\n  );\n};\n\nexport default Package;\n\nconst iconStyle = ({ theme }: { theme: Theme }) => css`\n  margin: 0 10px 0 0;\n  fill: ${theme.palette.mode === 'light' ? grey[900] : common.white};\n`;\n\nconst StyledVersion = styled(Version)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledFileBinary = styled(FileBinary)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledLaw = styled(Law)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledTime = styled(Time)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n"],"mappings":"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"}
+{"version":3,"file":"Package.js","names":["getConfiguration","useTranslation","useManifests","useDownload","useCallback","OverviewItem","VersionLink","Route","Author","Avatar","Details","Published","LinkExternal","Tooltip","IconButton","HomeIcon","BugReport","CircularProgress","DownloadIcon","Grid","WrapperLink","PackageTitle","GridRightAligned","Description","PackageListItemText","ListItem","List","KeywordListItems","Wrapper","grey","common","Version","FileBinary","Law","Time"],"sources":["../../../src/components/Package/Package.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport BugReport from '@mui/icons-material/BugReport';\nimport DownloadIcon from '@mui/icons-material/CloudDownload';\nimport HomeIcon from '@mui/icons-material/Home';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Grid from '@mui/material/Grid';\nimport List from '@mui/material/List';\nimport ListItem from '@mui/material/ListItem';\nimport Tooltip from '@mui/material/Tooltip';\nimport { common, grey } from '@mui/material/colors';\nimport React, { useCallback } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { Theme } from '../../';\nimport { LinkExternal, useDownload, useManifests } from '../../';\nimport { FileBinary, Law, Time, Version } from '../../components/Icons';\nimport { getConfiguration } from '../../configuration';\nimport type { Author as PackageAuthor } from '../../providers/ManifestsProvider/ManifestsProvider';\nimport type { PackageMetaInterface } from '../../types/packageMeta';\nimport { Route, url, utils } from '../../utils';\nimport KeywordListItems from '../Keywords/KeywordListItems';\nimport {\n  Author,\n  Avatar,\n  Description,\n  Details,\n  GridRightAligned,\n  IconButton,\n  OverviewItem,\n  PackageListItemText,\n  PackageTitle,\n  Published,\n  Wrapper,\n  VersionLink,\n  WrapperLink,\n} from './styles';\n\ninterface Bugs {\n  url: string;\n}\n\ninterface Dist {\n  unpackedSize: number;\n  tarball: string;\n}\n\nexport interface PackageInterface {\n  name: string;\n  version: string;\n  time?: number | string;\n  author: PackageAuthor;\n  description?: string;\n  keywords?: PackageMetaInterface['latest']['keywords'];\n  license?: PackageMetaInterface['latest']['license'];\n  homepage?: string;\n  bugs?: Bugs | string;\n  dist?: Dist;\n  showDownload?: boolean;\n}\n\nconst Package: React.FC<PackageInterface> = ({\n  author: { name: authorName, avatar: authorAvatar },\n  bugs,\n  description,\n  dist,\n  homepage,\n  keywords,\n  license,\n  name: packageName,\n  time,\n  showDownload = true,\n  version,\n}) => {\n  const config = getConfiguration();\n  const { t } = useTranslation();\n  const { isLoading } = useManifests();\n  const { downloadTarball } = useDownload();\n\n  const handleDownload = useCallback(\n    async (tarballDist: string) => {\n      // FIXME: check, the dist might be different thant npmjs\n      const link = tarballDist.replace(`https://registry.npmjs.org/`, config.base);\n      downloadTarball?.({ link });\n    },\n    [config, downloadTarball]\n  );\n\n  const renderVersionInfo = (): React.ReactNode =>\n    version && (\n      <OverviewItem>\n        <VersionLink\n          data-testid=\"package-version-link\"\n          to={`${Route.DETAIL}${packageName}/v/${version}`}\n        >\n          <StyledVersion />\n          {t('package.version', { version })}\n        </VersionLink>\n      </OverviewItem>\n    );\n\n  const renderAuthorInfo = (): React.ReactNode => {\n    const name = utils.getAuthorName(authorName);\n    return (\n      <OverviewItem>\n        <Author>\n          <Avatar alt={name} src={authorAvatar} />\n          <Details>{name}</Details>\n        </Author>\n      </OverviewItem>\n    );\n  };\n\n  const renderFileSize = (): React.ReactNode =>\n    dist?.unpackedSize ? (\n      <OverviewItem>\n        <StyledFileBinary />\n        {utils.fileSizeSI(dist.unpackedSize)}\n      </OverviewItem>\n    ) : null;\n\n  const renderLicenseInfo = (): React.ReactNode =>\n    license && (\n      <OverviewItem>\n        <StyledLaw />\n        {license as string}\n      </OverviewItem>\n    );\n\n  const renderPublishedInfo = (): React.ReactNode =>\n    time && (\n      <OverviewItem>\n        <StyledTime />\n        <Published title={utils.formatDate(time)}>\n          {t('package.published-on', { time: utils.formatDateDistance(time) })}\n        </Published>\n      </OverviewItem>\n    );\n\n  const renderHomePageLink = (): React.ReactNode =>\n    homepage &&\n    url.isURL(homepage) && (\n      <LinkExternal to={homepage}>\n        <Tooltip aria-label={t('package.homepage')} title={t('package.visit-home-page')}>\n          <IconButton aria-label={t('package.homepage')} color=\"primary\" size=\"large\">\n            <HomeIcon />\n          </IconButton>\n        </Tooltip>\n      </LinkExternal>\n    );\n\n  const renderBugsLink = (): React.ReactNode => {\n    // bugs can be the object form or a plain url string, both valid in npm\n    const bugsUrl = utils.getBugsUrl(bugs);\n    return (\n      bugsUrl &&\n      url.isURL(bugsUrl) && (\n        <LinkExternal to={bugsUrl}>\n          <Tooltip aria-label={t('package.bugs')} title={t('package.open-an-issue')}>\n            <IconButton aria-label={t('package.bugs')} color=\"primary\" size=\"large\">\n              <BugReport />\n            </IconButton>\n          </Tooltip>\n        </LinkExternal>\n      )\n    );\n  };\n\n  const renderDownloadLink = (): React.ReactNode =>\n    dist?.tarball &&\n    url.isURL(dist.tarball) && (\n      // a plain button: wrapping it in <Link to=\"#\"> pushed a stray `#` entry\n      // into the browser history on every download\n      <Tooltip\n        aria-label={t('package.download', { what: t('package.the-tar-file') })}\n        title={t('package.tarball')}\n      >\n        <IconButton\n          aria-label={t('package.download')}\n          color=\"primary\"\n          data-testid=\"download-tarball\"\n          onClick={() => {\n            handleDownload(dist.tarball);\n          }}\n          size=\"large\"\n        >\n          {isLoading ? <CircularProgress size={13} /> : <DownloadIcon />}\n        </IconButton>\n      </Tooltip>\n    );\n\n  const renderPrimaryComponent = (): React.ReactNode => {\n    return (\n      <Grid alignItems=\"center\" container={true} size={{ xs: 12 }} wrap=\"wrap\">\n        <Grid size=\"grow\">\n          <WrapperLink to={`${Route.DETAIL}${packageName}`}>\n            <PackageTitle className=\"package-title\" data-testid=\"package-title\">\n              {packageName}\n            </PackageTitle>\n          </WrapperLink>\n        </Grid>\n        <GridRightAligned size=\"auto\">\n          {renderHomePageLink()}\n          {renderBugsLink()}\n          {showDownload && renderDownloadLink()}\n        </GridRightAligned>\n      </Grid>\n    );\n  };\n\n  const renderSecondaryComponent = (): React.ReactNode => <Description>{description}</Description>;\n\n  const renderPackageListItemText = (): React.ReactNode => (\n    <PackageListItemText\n      primary={renderPrimaryComponent()}\n      secondary={renderSecondaryComponent()}\n    />\n  );\n\n  const renderKeywords = (): React.ReactNode => (\n    <ListItem alignItems={'flex-start'} sx={{ py: 0, my: 0 }}>\n      <List sx={{ p: 0, my: 0 }}>\n        <KeywordListItems keywords={keywords} />\n      </List>\n    </ListItem>\n  );\n\n  return (\n    <Wrapper className={'package'} data-testid=\"package-item-list\">\n      <ListItem alignItems={'flex-start'} sx={{ mb: 0 }}>\n        {renderPackageListItemText()}\n      </ListItem>\n      {keywords && keywords?.length > 0 ? renderKeywords() : null}\n      <ListItem alignItems={'flex-start'} sx={{ mt: 0 }}>\n        {renderAuthorInfo()}\n        {renderVersionInfo()}\n        {renderPublishedInfo()}\n        {renderFileSize()}\n        {renderLicenseInfo()}\n      </ListItem>\n    </Wrapper>\n  );\n};\n\nexport default Package;\n\nconst iconStyle = ({ theme }: { theme: Theme }) => css`\n  margin: 0 10px 0 0;\n  fill: ${theme.palette.mode === 'light' ? grey[900] : common.white};\n`;\n\nconst StyledVersion = styled(Version)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledFileBinary = styled(FileBinary)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledLaw = styled(Law)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledTime = styled(Time)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n"],"mappings":"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"}

package/build/components/Package/Package.mjs

@@ -12,7 +12,7 @@ import { FileBinary } from "../Icons/FileBinary.mjs";
 import { Law } from "../Icons/Law.mjs";
 import "../Icons/index.mjs";
 import KeywordListItems from "../Keywords/KeywordListItems.mjs";
-import { Author, Avatar, Description, Details, GridRightAligned, IconButton, OverviewItem, PackageListItemText, PackageTitle, Published, Wrapper, WrapperLink } from "./styles.mjs";
+import { Author, Avatar, Description, Details, GridRightAligned, IconButton, OverviewItem, PackageListItemText, PackageTitle, Published, VersionLink, Wrapper, WrapperLink } from "./styles.mjs";
 import "../../index.mjs";
 import styled from "@emotion/styled";
 import Tooltip from "@mui/material/Tooltip";
@@ -38,7 +38,11 @@ var Package = ({ author: { name: authorName, avatar: authorAvatar }, bugs, descr
 		const link = tarballDist.replace(`https://registry.npmjs.org/`, config.base);
 		downloadTarball?.({ link });
 	}, [config, downloadTarball]);
-	const renderVersionInfo = () => version && /* @__PURE__ */ jsxs(OverviewItem, { children: [/* @__PURE__ */ jsx(StyledVersion, {}), t("package.version", { version })] });
+	const renderVersionInfo = () => version && /* @__PURE__ */ jsx(OverviewItem, { children: /* @__PURE__ */ jsxs(VersionLink, {
+		"data-testid": "package-version-link",
+		to: `${Route.DETAIL}${packageName}/v/${version}`,
+		children: [/* @__PURE__ */ jsx(StyledVersion, {}), t("package.version", { version })]
+	}) });
 	const renderAuthorInfo = () => {
 		const name = getAuthorName(authorName);
 		return /* @__PURE__ */ jsx(OverviewItem, { children: /* @__PURE__ */ jsxs(Author, { children: [/* @__PURE__ */ jsx(Avatar, {

package/build/components/Package/Package.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Package.mjs","names":["utils.getAuthorName","utils.fileSizeSI","utils.formatDate","utils.formatDateDistance","url.isURL","utils.getBugsUrl","BugReport"],"sources":["../../../src/components/Package/Package.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport BugReport from '@mui/icons-material/BugReport';\nimport DownloadIcon from '@mui/icons-material/CloudDownload';\nimport HomeIcon from '@mui/icons-material/Home';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Grid from '@mui/material/Grid';\nimport List from '@mui/material/List';\nimport ListItem from '@mui/material/ListItem';\nimport Tooltip from '@mui/material/Tooltip';\nimport { common, grey } from '@mui/material/colors';\nimport React, { useCallback } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { Theme } from '../../';\nimport { LinkExternal, useDownload, useManifests } from '../../';\nimport { FileBinary, Law, Time, Version } from '../../components/Icons';\nimport { getConfiguration } from '../../configuration';\nimport type { Author as PackageAuthor } from '../../providers/ManifestsProvider/ManifestsProvider';\nimport type { PackageMetaInterface } from '../../types/packageMeta';\nimport { Route, url, utils } from '../../utils';\nimport KeywordListItems from '../Keywords/KeywordListItems';\nimport {\n  Author,\n  Avatar,\n  Description,\n  Details,\n  GridRightAligned,\n  IconButton,\n  OverviewItem,\n  PackageListItemText,\n  PackageTitle,\n  Published,\n  Wrapper,\n  WrapperLink,\n} from './styles';\n\ninterface Bugs {\n  url: string;\n}\n\ninterface Dist {\n  unpackedSize: number;\n  tarball: string;\n}\n\nexport interface PackageInterface {\n  name: string;\n  version: string;\n  time?: number | string;\n  author: PackageAuthor;\n  description?: string;\n  keywords?: PackageMetaInterface['latest']['keywords'];\n  license?: PackageMetaInterface['latest']['license'];\n  homepage?: string;\n  bugs?: Bugs | string;\n  dist?: Dist;\n  showDownload?: boolean;\n}\n\nconst Package: React.FC<PackageInterface> = ({\n  author: { name: authorName, avatar: authorAvatar },\n  bugs,\n  description,\n  dist,\n  homepage,\n  keywords,\n  license,\n  name: packageName,\n  time,\n  showDownload = true,\n  version,\n}) => {\n  const config = getConfiguration();\n  const { t } = useTranslation();\n  const { isLoading } = useManifests();\n  const { downloadTarball } = useDownload();\n\n  const handleDownload = useCallback(\n    async (tarballDist: string) => {\n      // FIXME: check, the dist might be different thant npmjs\n      const link = tarballDist.replace(`https://registry.npmjs.org/`, config.base);\n      downloadTarball?.({ link });\n    },\n    [config, downloadTarball]\n  );\n\n  const renderVersionInfo = (): React.ReactNode =>\n    version && (\n      <OverviewItem>\n        <StyledVersion />\n        {t('package.version', { version })}\n      </OverviewItem>\n    );\n\n  const renderAuthorInfo = (): React.ReactNode => {\n    const name = utils.getAuthorName(authorName);\n    return (\n      <OverviewItem>\n        <Author>\n          <Avatar alt={name} src={authorAvatar} />\n          <Details>{name}</Details>\n        </Author>\n      </OverviewItem>\n    );\n  };\n\n  const renderFileSize = (): React.ReactNode =>\n    dist?.unpackedSize ? (\n      <OverviewItem>\n        <StyledFileBinary />\n        {utils.fileSizeSI(dist.unpackedSize)}\n      </OverviewItem>\n    ) : null;\n\n  const renderLicenseInfo = (): React.ReactNode =>\n    license && (\n      <OverviewItem>\n        <StyledLaw />\n        {license as string}\n      </OverviewItem>\n    );\n\n  const renderPublishedInfo = (): React.ReactNode =>\n    time && (\n      <OverviewItem>\n        <StyledTime />\n        <Published title={utils.formatDate(time)}>\n          {t('package.published-on', { time: utils.formatDateDistance(time) })}\n        </Published>\n      </OverviewItem>\n    );\n\n  const renderHomePageLink = (): React.ReactNode =>\n    homepage &&\n    url.isURL(homepage) && (\n      <LinkExternal to={homepage}>\n        <Tooltip aria-label={t('package.homepage')} title={t('package.visit-home-page')}>\n          <IconButton aria-label={t('package.homepage')} color=\"primary\" size=\"large\">\n            <HomeIcon />\n          </IconButton>\n        </Tooltip>\n      </LinkExternal>\n    );\n\n  const renderBugsLink = (): React.ReactNode => {\n    // bugs can be the object form or a plain url string, both valid in npm\n    const bugsUrl = utils.getBugsUrl(bugs);\n    return (\n      bugsUrl &&\n      url.isURL(bugsUrl) && (\n        <LinkExternal to={bugsUrl}>\n          <Tooltip aria-label={t('package.bugs')} title={t('package.open-an-issue')}>\n            <IconButton aria-label={t('package.bugs')} color=\"primary\" size=\"large\">\n              <BugReport />\n            </IconButton>\n          </Tooltip>\n        </LinkExternal>\n      )\n    );\n  };\n\n  const renderDownloadLink = (): React.ReactNode =>\n    dist?.tarball &&\n    url.isURL(dist.tarball) && (\n      // a plain button: wrapping it in <Link to=\"#\"> pushed a stray `#` entry\n      // into the browser history on every download\n      <Tooltip\n        aria-label={t('package.download', { what: t('package.the-tar-file') })}\n        title={t('package.tarball')}\n      >\n        <IconButton\n          aria-label={t('package.download')}\n          color=\"primary\"\n          data-testid=\"download-tarball\"\n          onClick={() => {\n            handleDownload(dist.tarball);\n          }}\n          size=\"large\"\n        >\n          {isLoading ? <CircularProgress size={13} /> : <DownloadIcon />}\n        </IconButton>\n      </Tooltip>\n    );\n\n  const renderPrimaryComponent = (): React.ReactNode => {\n    return (\n      <Grid alignItems=\"center\" container={true} size={{ xs: 12 }} wrap=\"wrap\">\n        <Grid size=\"grow\">\n          <WrapperLink to={`${Route.DETAIL}${packageName}`}>\n            <PackageTitle className=\"package-title\" data-testid=\"package-title\">\n              {packageName}\n            </PackageTitle>\n          </WrapperLink>\n        </Grid>\n        <GridRightAligned size=\"auto\">\n          {renderHomePageLink()}\n          {renderBugsLink()}\n          {showDownload && renderDownloadLink()}\n        </GridRightAligned>\n      </Grid>\n    );\n  };\n\n  const renderSecondaryComponent = (): React.ReactNode => <Description>{description}</Description>;\n\n  const renderPackageListItemText = (): React.ReactNode => (\n    <PackageListItemText\n      primary={renderPrimaryComponent()}\n      secondary={renderSecondaryComponent()}\n    />\n  );\n\n  const renderKeywords = (): React.ReactNode => (\n    <ListItem alignItems={'flex-start'} sx={{ py: 0, my: 0 }}>\n      <List sx={{ p: 0, my: 0 }}>\n        <KeywordListItems keywords={keywords} />\n      </List>\n    </ListItem>\n  );\n\n  return (\n    <Wrapper className={'package'} data-testid=\"package-item-list\">\n      <ListItem alignItems={'flex-start'} sx={{ mb: 0 }}>\n        {renderPackageListItemText()}\n      </ListItem>\n      {keywords && keywords?.length > 0 ? renderKeywords() : null}\n      <ListItem alignItems={'flex-start'} sx={{ mt: 0 }}>\n        {renderAuthorInfo()}\n        {renderVersionInfo()}\n        {renderPublishedInfo()}\n        {renderFileSize()}\n        {renderLicenseInfo()}\n      </ListItem>\n    </Wrapper>\n  );\n};\n\nexport default Package;\n\nconst iconStyle = ({ theme }: { theme: Theme }) => css`\n  margin: 0 10px 0 0;\n  fill: ${theme.palette.mode === 'light' ? grey[900] : common.white};\n`;\n\nconst StyledVersion = styled(Version)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledFileBinary = styled(FileBinary)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledLaw = styled(Law)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledTime = styled(Time)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n"],"mappings":"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"}
+{"version":3,"file":"Package.mjs","names":["utils.getAuthorName","utils.fileSizeSI","utils.formatDate","utils.formatDateDistance","url.isURL","utils.getBugsUrl","BugReport"],"sources":["../../../src/components/Package/Package.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport BugReport from '@mui/icons-material/BugReport';\nimport DownloadIcon from '@mui/icons-material/CloudDownload';\nimport HomeIcon from '@mui/icons-material/Home';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Grid from '@mui/material/Grid';\nimport List from '@mui/material/List';\nimport ListItem from '@mui/material/ListItem';\nimport Tooltip from '@mui/material/Tooltip';\nimport { common, grey } from '@mui/material/colors';\nimport React, { useCallback } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { Theme } from '../../';\nimport { LinkExternal, useDownload, useManifests } from '../../';\nimport { FileBinary, Law, Time, Version } from '../../components/Icons';\nimport { getConfiguration } from '../../configuration';\nimport type { Author as PackageAuthor } from '../../providers/ManifestsProvider/ManifestsProvider';\nimport type { PackageMetaInterface } from '../../types/packageMeta';\nimport { Route, url, utils } from '../../utils';\nimport KeywordListItems from '../Keywords/KeywordListItems';\nimport {\n  Author,\n  Avatar,\n  Description,\n  Details,\n  GridRightAligned,\n  IconButton,\n  OverviewItem,\n  PackageListItemText,\n  PackageTitle,\n  Published,\n  Wrapper,\n  VersionLink,\n  WrapperLink,\n} from './styles';\n\ninterface Bugs {\n  url: string;\n}\n\ninterface Dist {\n  unpackedSize: number;\n  tarball: string;\n}\n\nexport interface PackageInterface {\n  name: string;\n  version: string;\n  time?: number | string;\n  author: PackageAuthor;\n  description?: string;\n  keywords?: PackageMetaInterface['latest']['keywords'];\n  license?: PackageMetaInterface['latest']['license'];\n  homepage?: string;\n  bugs?: Bugs | string;\n  dist?: Dist;\n  showDownload?: boolean;\n}\n\nconst Package: React.FC<PackageInterface> = ({\n  author: { name: authorName, avatar: authorAvatar },\n  bugs,\n  description,\n  dist,\n  homepage,\n  keywords,\n  license,\n  name: packageName,\n  time,\n  showDownload = true,\n  version,\n}) => {\n  const config = getConfiguration();\n  const { t } = useTranslation();\n  const { isLoading } = useManifests();\n  const { downloadTarball } = useDownload();\n\n  const handleDownload = useCallback(\n    async (tarballDist: string) => {\n      // FIXME: check, the dist might be different thant npmjs\n      const link = tarballDist.replace(`https://registry.npmjs.org/`, config.base);\n      downloadTarball?.({ link });\n    },\n    [config, downloadTarball]\n  );\n\n  const renderVersionInfo = (): React.ReactNode =>\n    version && (\n      <OverviewItem>\n        <VersionLink\n          data-testid=\"package-version-link\"\n          to={`${Route.DETAIL}${packageName}/v/${version}`}\n        >\n          <StyledVersion />\n          {t('package.version', { version })}\n        </VersionLink>\n      </OverviewItem>\n    );\n\n  const renderAuthorInfo = (): React.ReactNode => {\n    const name = utils.getAuthorName(authorName);\n    return (\n      <OverviewItem>\n        <Author>\n          <Avatar alt={name} src={authorAvatar} />\n          <Details>{name}</Details>\n        </Author>\n      </OverviewItem>\n    );\n  };\n\n  const renderFileSize = (): React.ReactNode =>\n    dist?.unpackedSize ? (\n      <OverviewItem>\n        <StyledFileBinary />\n        {utils.fileSizeSI(dist.unpackedSize)}\n      </OverviewItem>\n    ) : null;\n\n  const renderLicenseInfo = (): React.ReactNode =>\n    license && (\n      <OverviewItem>\n        <StyledLaw />\n        {license as string}\n      </OverviewItem>\n    );\n\n  const renderPublishedInfo = (): React.ReactNode =>\n    time && (\n      <OverviewItem>\n        <StyledTime />\n        <Published title={utils.formatDate(time)}>\n          {t('package.published-on', { time: utils.formatDateDistance(time) })}\n        </Published>\n      </OverviewItem>\n    );\n\n  const renderHomePageLink = (): React.ReactNode =>\n    homepage &&\n    url.isURL(homepage) && (\n      <LinkExternal to={homepage}>\n        <Tooltip aria-label={t('package.homepage')} title={t('package.visit-home-page')}>\n          <IconButton aria-label={t('package.homepage')} color=\"primary\" size=\"large\">\n            <HomeIcon />\n          </IconButton>\n        </Tooltip>\n      </LinkExternal>\n    );\n\n  const renderBugsLink = (): React.ReactNode => {\n    // bugs can be the object form or a plain url string, both valid in npm\n    const bugsUrl = utils.getBugsUrl(bugs);\n    return (\n      bugsUrl &&\n      url.isURL(bugsUrl) && (\n        <LinkExternal to={bugsUrl}>\n          <Tooltip aria-label={t('package.bugs')} title={t('package.open-an-issue')}>\n            <IconButton aria-label={t('package.bugs')} color=\"primary\" size=\"large\">\n              <BugReport />\n            </IconButton>\n          </Tooltip>\n        </LinkExternal>\n      )\n    );\n  };\n\n  const renderDownloadLink = (): React.ReactNode =>\n    dist?.tarball &&\n    url.isURL(dist.tarball) && (\n      // a plain button: wrapping it in <Link to=\"#\"> pushed a stray `#` entry\n      // into the browser history on every download\n      <Tooltip\n        aria-label={t('package.download', { what: t('package.the-tar-file') })}\n        title={t('package.tarball')}\n      >\n        <IconButton\n          aria-label={t('package.download')}\n          color=\"primary\"\n          data-testid=\"download-tarball\"\n          onClick={() => {\n            handleDownload(dist.tarball);\n          }}\n          size=\"large\"\n        >\n          {isLoading ? <CircularProgress size={13} /> : <DownloadIcon />}\n        </IconButton>\n      </Tooltip>\n    );\n\n  const renderPrimaryComponent = (): React.ReactNode => {\n    return (\n      <Grid alignItems=\"center\" container={true} size={{ xs: 12 }} wrap=\"wrap\">\n        <Grid size=\"grow\">\n          <WrapperLink to={`${Route.DETAIL}${packageName}`}>\n            <PackageTitle className=\"package-title\" data-testid=\"package-title\">\n              {packageName}\n            </PackageTitle>\n          </WrapperLink>\n        </Grid>\n        <GridRightAligned size=\"auto\">\n          {renderHomePageLink()}\n          {renderBugsLink()}\n          {showDownload && renderDownloadLink()}\n        </GridRightAligned>\n      </Grid>\n    );\n  };\n\n  const renderSecondaryComponent = (): React.ReactNode => <Description>{description}</Description>;\n\n  const renderPackageListItemText = (): React.ReactNode => (\n    <PackageListItemText\n      primary={renderPrimaryComponent()}\n      secondary={renderSecondaryComponent()}\n    />\n  );\n\n  const renderKeywords = (): React.ReactNode => (\n    <ListItem alignItems={'flex-start'} sx={{ py: 0, my: 0 }}>\n      <List sx={{ p: 0, my: 0 }}>\n        <KeywordListItems keywords={keywords} />\n      </List>\n    </ListItem>\n  );\n\n  return (\n    <Wrapper className={'package'} data-testid=\"package-item-list\">\n      <ListItem alignItems={'flex-start'} sx={{ mb: 0 }}>\n        {renderPackageListItemText()}\n      </ListItem>\n      {keywords && keywords?.length > 0 ? renderKeywords() : null}\n      <ListItem alignItems={'flex-start'} sx={{ mt: 0 }}>\n        {renderAuthorInfo()}\n        {renderVersionInfo()}\n        {renderPublishedInfo()}\n        {renderFileSize()}\n        {renderLicenseInfo()}\n      </ListItem>\n    </Wrapper>\n  );\n};\n\nexport default Package;\n\nconst iconStyle = ({ theme }: { theme: Theme }) => css`\n  margin: 0 10px 0 0;\n  fill: ${theme.palette.mode === 'light' ? grey[900] : common.white};\n`;\n\nconst StyledVersion = styled(Version)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledFileBinary = styled(FileBinary)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledLaw = styled(Law)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n\nconst StyledTime = styled(Time)<{ theme?: Theme }>`\n  ${iconStyle};\n`;\n"],"mappings":"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"}

package/build/components/Package/styles.d.ts

@@ -21,6 +21,9 @@ export declare const Avatar: import("@emotion/styled").StyledComponent<any, {},
 export declare const WrapperLink: import("@emotion/styled").StyledComponent<import("react-router").LinkProps & import("react").RefAttributes<HTMLAnchorElement> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;
+export declare const VersionLink: import("@emotion/styled").StyledComponent<import("react-router").LinkProps & import("react").RefAttributes<HTMLAnchorElement> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
 export declare const PackageTitle: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/build/components/Package/styles.js

@@ -40,6 +40,13 @@ var Avatar = (0, _emotion_styled.default)(_mui_material_Avatar.default)({
 	height: "20px"
 });
 var WrapperLink = (0, _emotion_styled.default)(react_router.Link)({ textDecoration: "none" });
+var VersionLink = (0, _emotion_styled.default)(react_router.Link)({
+	display: "flex",
+	alignItems: "center",
+	color: "inherit",
+	textDecoration: "none",
+	":hover, :focus-visible": { textDecoration: "underline" }
+});
 var PackageTitle = (0, _emotion_styled.default)("span")(({ theme }) => ({
 	fontWeight: theme.fontWeight.bold,
 	fontSize: 20,
@@ -77,6 +84,7 @@ exports.OverviewItem = OverviewItem;
 exports.PackageListItemText = PackageListItemText;
 exports.PackageTitle = PackageTitle;
 exports.Published = Published;
+exports.VersionLink = VersionLink;
 exports.Wrapper = Wrapper;
 exports.WrapperLink = WrapperLink;
 

package/build/components/Package/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","names":["styled","common","Photo","Link","Grid","List","MuiIconButton","ListItemText","greyDark"],"sources":["../../../src/components/Package/styles.ts"],"sourcesContent":["import styled from '@emotion/styled';\nimport { default as Photo } from '@mui/material/Avatar';\nimport Grid from '@mui/material/Grid';\nimport { default as MuiIconButton } from '@mui/material/IconButton';\nimport List from '@mui/material/List';\nimport ListItemText from '@mui/material/ListItemText';\nimport { common } from '@mui/material/colors';\nimport { Link } from 'react-router';\n\nimport type { Theme } from '../../';\nimport { greyDark } from '../../Theme/colors';\n\nexport const OverviewItem = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  margin: '0 20px 0 0',\n  color: theme.palette.mode === 'light' ? theme.palette.greyDark2 : common.white,\n  fontSize: 12,\n  [`@media (max-width: ${theme.breakPoints.medium}px)`]: {\n    ':nth-of-type(3)': {\n      display: 'none',\n    },\n  },\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    ':nth-of-type(4)': {\n      display: 'none',\n    },\n  },\n}));\n\nexport const Published = styled('span')({\n  margin: '0 5px 0 0',\n});\n\nexport const Details = styled('span')({\n  marginLeft: '5px',\n  lineHeight: 1.5,\n  display: 'flex',\n  flexDirection: 'column',\n});\n\nexport const Author = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nexport const Avatar = styled(Photo)({\n  width: '20px',\n  height: '20px',\n});\n\nexport const WrapperLink = styled(Link)({\n  textDecoration: 'none',\n});\n\nexport const PackageTitle = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: theme.fontWeight.bold,\n  fontSize: 20,\n  display: 'block',\n  color: theme.palette.primary.main,\n  cursor: 'pointer',\n  textDecoration: 'none',\n  wordBreak: 'break-word',\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    fontSize: 16,\n  },\n}));\n\nexport const GridRightAligned = styled(Grid)({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'flex-end',\n});\n\nexport const Wrapper = styled(List)<{ theme?: Theme }>(({ theme }) => ({\n  '&:hover': {\n    backgroundColor: theme.palette.action.hover,\n  },\n}));\n\nexport const IconButton = styled(MuiIconButton)({\n  padding: 6,\n  svg: {\n    fontSize: 16,\n  },\n});\n\nexport const PackageListItemText = styled(ListItemText)({\n  paddingRight: 0,\n});\n\nexport const Description = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  color: theme.palette.mode === 'light' ? greyDark : common.white,\n  fontSize: '14px',\n  paddingRight: 0,\n}));\n"],"mappings":";;;;;;;;;;;;;;;;;AAYA,IAAa,gBAAA,GAAeA,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,SAAS;CACT,YAAY;CACZ,QAAQ;CACR,OAAO,MAAM,QAAQ,SAAS,UAAU,MAAM,QAAQ,YAAYC,qBAAAA,OAAO;CACzE,UAAU;EACT,sBAAsB,MAAM,YAAY,OAAO,OAAO,EACrD,mBAAmB,EACjB,SAAS,OACX,EACF;EACC,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,mBAAmB,EACjB,SAAS,OACX,EACF;AACF,EAAE;AAEF,IAAa,aAAA,GAAYD,gBAAAA,QAAAA,CAAO,MAAM,CAAC,CAAC,EACtC,QAAQ,YACV,CAAC;AAED,IAAa,WAAA,GAAUA,gBAAAA,QAAAA,CAAO,MAAM,CAAC,CAAC;CACpC,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,eAAe;AACjB,CAAC;AAED,IAAa,UAAA,GAASA,gBAAAA,QAAAA,CAAO,KAAK,CAAC,CAAC;CAClC,SAAS;CACT,YAAY;AACd,CAAC;AAED,IAAa,UAAA,GAASA,gBAAAA,QAAAA,CAAOE,qBAAAA,OAAK,CAAC,CAAC;CAClC,OAAO;CACP,QAAQ;AACV,CAAC;AAED,IAAa,eAAA,GAAcF,gBAAAA,QAAAA,CAAOG,aAAAA,IAAI,CAAC,CAAC,EACtC,gBAAgB,OAClB,CAAC;AAED,IAAa,gBAAA,GAAeH,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,YAAY,MAAM,WAAW;CAC7B,UAAU;CACV,SAAS;CACT,OAAO,MAAM,QAAQ,QAAQ;CAC7B,QAAQ;CACR,gBAAgB;CAChB,WAAW;EACV,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,UAAU,GACZ;AACF,EAAE;AAEF,IAAa,oBAAA,GAAmBA,gBAAAA,QAAAA,CAAOI,mBAAAA,OAAI,CAAC,CAAC;CAC3C,SAAS;CACT,YAAY;CACZ,gBAAgB;AAClB,CAAC;AAED,IAAa,WAAA,GAAUJ,gBAAAA,QAAAA,CAAOK,mBAAAA,OAAI,CAAC,EAAqB,EAAE,aAAa,EACrE,WAAW,EACT,iBAAiB,MAAM,QAAQ,OAAO,MACxC,EACF,EAAE;AAEF,IAAa,cAAA,GAAaL,gBAAAA,QAAAA,CAAOM,yBAAAA,OAAa,CAAC,CAAC;CAC9C,SAAS;CACT,KAAK,EACH,UAAU,GACZ;AACF,CAAC;AAED,IAAa,uBAAA,GAAsBN,gBAAAA,QAAAA,CAAOO,2BAAAA,OAAY,CAAC,CAAC,EACtD,cAAc,EAChB,CAAC;AAED,IAAa,eAAA,GAAcP,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC3E,OAAO,MAAM,QAAQ,SAAS,UAAUQ,eAAAA,WAAWP,qBAAAA,OAAO;CAC1D,UAAU;CACV,cAAc;AAChB,EAAE"}
+{"version":3,"file":"styles.js","names":["styled","common","Photo","Link","Grid","List","MuiIconButton","ListItemText","greyDark"],"sources":["../../../src/components/Package/styles.ts"],"sourcesContent":["import styled from '@emotion/styled';\nimport { default as Photo } from '@mui/material/Avatar';\nimport Grid from '@mui/material/Grid';\nimport { default as MuiIconButton } from '@mui/material/IconButton';\nimport List from '@mui/material/List';\nimport ListItemText from '@mui/material/ListItemText';\nimport { common } from '@mui/material/colors';\nimport { Link } from 'react-router';\n\nimport type { Theme } from '../../';\nimport { greyDark } from '../../Theme/colors';\n\nexport const OverviewItem = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  margin: '0 20px 0 0',\n  color: theme.palette.mode === 'light' ? theme.palette.greyDark2 : common.white,\n  fontSize: 12,\n  [`@media (max-width: ${theme.breakPoints.medium}px)`]: {\n    ':nth-of-type(3)': {\n      display: 'none',\n    },\n  },\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    ':nth-of-type(4)': {\n      display: 'none',\n    },\n  },\n}));\n\nexport const Published = styled('span')({\n  margin: '0 5px 0 0',\n});\n\nexport const Details = styled('span')({\n  marginLeft: '5px',\n  lineHeight: 1.5,\n  display: 'flex',\n  flexDirection: 'column',\n});\n\nexport const Author = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nexport const Avatar = styled(Photo)({\n  width: '20px',\n  height: '20px',\n});\n\nexport const WrapperLink = styled(Link)({\n  textDecoration: 'none',\n});\n\nexport const VersionLink = styled(Link)({\n  display: 'flex',\n  alignItems: 'center',\n  color: 'inherit',\n  textDecoration: 'none',\n  ':hover, :focus-visible': {\n    textDecoration: 'underline',\n  },\n});\n\nexport const PackageTitle = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: theme.fontWeight.bold,\n  fontSize: 20,\n  display: 'block',\n  color: theme.palette.primary.main,\n  cursor: 'pointer',\n  textDecoration: 'none',\n  wordBreak: 'break-word',\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    fontSize: 16,\n  },\n}));\n\nexport const GridRightAligned = styled(Grid)({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'flex-end',\n});\n\nexport const Wrapper = styled(List)<{ theme?: Theme }>(({ theme }) => ({\n  '&:hover': {\n    backgroundColor: theme.palette.action.hover,\n  },\n}));\n\nexport const IconButton = styled(MuiIconButton)({\n  padding: 6,\n  svg: {\n    fontSize: 16,\n  },\n});\n\nexport const PackageListItemText = styled(ListItemText)({\n  paddingRight: 0,\n});\n\nexport const Description = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  color: theme.palette.mode === 'light' ? greyDark : common.white,\n  fontSize: '14px',\n  paddingRight: 0,\n}));\n"],"mappings":";;;;;;;;;;;;;;;;;AAYA,IAAa,gBAAA,GAAeA,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,SAAS;CACT,YAAY;CACZ,QAAQ;CACR,OAAO,MAAM,QAAQ,SAAS,UAAU,MAAM,QAAQ,YAAYC,qBAAAA,OAAO;CACzE,UAAU;EACT,sBAAsB,MAAM,YAAY,OAAO,OAAO,EACrD,mBAAmB,EACjB,SAAS,OACX,EACF;EACC,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,mBAAmB,EACjB,SAAS,OACX,EACF;AACF,EAAE;AAEF,IAAa,aAAA,GAAYD,gBAAAA,QAAAA,CAAO,MAAM,CAAC,CAAC,EACtC,QAAQ,YACV,CAAC;AAED,IAAa,WAAA,GAAUA,gBAAAA,QAAAA,CAAO,MAAM,CAAC,CAAC;CACpC,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,eAAe;AACjB,CAAC;AAED,IAAa,UAAA,GAASA,gBAAAA,QAAAA,CAAO,KAAK,CAAC,CAAC;CAClC,SAAS;CACT,YAAY;AACd,CAAC;AAED,IAAa,UAAA,GAASA,gBAAAA,QAAAA,CAAOE,qBAAAA,OAAK,CAAC,CAAC;CAClC,OAAO;CACP,QAAQ;AACV,CAAC;AAED,IAAa,eAAA,GAAcF,gBAAAA,QAAAA,CAAOG,aAAAA,IAAI,CAAC,CAAC,EACtC,gBAAgB,OAClB,CAAC;AAED,IAAa,eAAA,GAAcH,gBAAAA,QAAAA,CAAOG,aAAAA,IAAI,CAAC,CAAC;CACtC,SAAS;CACT,YAAY;CACZ,OAAO;CACP,gBAAgB;CAChB,0BAA0B,EACxB,gBAAgB,YAClB;AACF,CAAC;AAED,IAAa,gBAAA,GAAeH,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,YAAY,MAAM,WAAW;CAC7B,UAAU;CACV,SAAS;CACT,OAAO,MAAM,QAAQ,QAAQ;CAC7B,QAAQ;CACR,gBAAgB;CAChB,WAAW;EACV,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,UAAU,GACZ;AACF,EAAE;AAEF,IAAa,oBAAA,GAAmBA,gBAAAA,QAAAA,CAAOI,mBAAAA,OAAI,CAAC,CAAC;CAC3C,SAAS;CACT,YAAY;CACZ,gBAAgB;AAClB,CAAC;AAED,IAAa,WAAA,GAAUJ,gBAAAA,QAAAA,CAAOK,mBAAAA,OAAI,CAAC,EAAqB,EAAE,aAAa,EACrE,WAAW,EACT,iBAAiB,MAAM,QAAQ,OAAO,MACxC,EACF,EAAE;AAEF,IAAa,cAAA,GAAaL,gBAAAA,QAAAA,CAAOM,yBAAAA,OAAa,CAAC,CAAC;CAC9C,SAAS;CACT,KAAK,EACH,UAAU,GACZ;AACF,CAAC;AAED,IAAa,uBAAA,GAAsBN,gBAAAA,QAAAA,CAAOO,2BAAAA,OAAY,CAAC,CAAC,EACtD,cAAc,EAChB,CAAC;AAED,IAAa,eAAA,GAAcP,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC3E,OAAO,MAAM,QAAQ,SAAS,UAAUQ,eAAAA,WAAWP,qBAAAA,OAAO;CAC1D,UAAU;CACV,cAAc;AAChB,EAAE"}

package/build/components/Package/styles.mjs

@@ -33,6 +33,13 @@ var Avatar$1 = styled(Avatar)({
 	height: "20px"
 });
 var WrapperLink = styled(Link)({ textDecoration: "none" });
+var VersionLink = styled(Link)({
+	display: "flex",
+	alignItems: "center",
+	color: "inherit",
+	textDecoration: "none",
+	":hover, :focus-visible": { textDecoration: "underline" }
+});
 var PackageTitle = styled("span")(({ theme }) => ({
 	fontWeight: theme.fontWeight.bold,
 	fontSize: 20,
@@ -60,6 +67,6 @@ var Description = styled("span")(({ theme }) => ({
 	paddingRight: 0
 }));
 //#endregion
-export { Author, Avatar$1 as Avatar, Description, Details, GridRightAligned, IconButton$1 as IconButton, OverviewItem, PackageListItemText, PackageTitle, Published, Wrapper, WrapperLink };
+export { Author, Avatar$1 as Avatar, Description, Details, GridRightAligned, IconButton$1 as IconButton, OverviewItem, PackageListItemText, PackageTitle, Published, VersionLink, Wrapper, WrapperLink };
 
 //# sourceMappingURL=styles.mjs.map

package/build/components/Package/styles.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"styles.mjs","names":["Avatar","Photo","IconButton","MuiIconButton"],"sources":["../../../src/components/Package/styles.ts"],"sourcesContent":["import styled from '@emotion/styled';\nimport { default as Photo } from '@mui/material/Avatar';\nimport Grid from '@mui/material/Grid';\nimport { default as MuiIconButton } from '@mui/material/IconButton';\nimport List from '@mui/material/List';\nimport ListItemText from '@mui/material/ListItemText';\nimport { common } from '@mui/material/colors';\nimport { Link } from 'react-router';\n\nimport type { Theme } from '../../';\nimport { greyDark } from '../../Theme/colors';\n\nexport const OverviewItem = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  margin: '0 20px 0 0',\n  color: theme.palette.mode === 'light' ? theme.palette.greyDark2 : common.white,\n  fontSize: 12,\n  [`@media (max-width: ${theme.breakPoints.medium}px)`]: {\n    ':nth-of-type(3)': {\n      display: 'none',\n    },\n  },\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    ':nth-of-type(4)': {\n      display: 'none',\n    },\n  },\n}));\n\nexport const Published = styled('span')({\n  margin: '0 5px 0 0',\n});\n\nexport const Details = styled('span')({\n  marginLeft: '5px',\n  lineHeight: 1.5,\n  display: 'flex',\n  flexDirection: 'column',\n});\n\nexport const Author = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nexport const Avatar = styled(Photo)({\n  width: '20px',\n  height: '20px',\n});\n\nexport const WrapperLink = styled(Link)({\n  textDecoration: 'none',\n});\n\nexport const PackageTitle = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: theme.fontWeight.bold,\n  fontSize: 20,\n  display: 'block',\n  color: theme.palette.primary.main,\n  cursor: 'pointer',\n  textDecoration: 'none',\n  wordBreak: 'break-word',\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    fontSize: 16,\n  },\n}));\n\nexport const GridRightAligned = styled(Grid)({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'flex-end',\n});\n\nexport const Wrapper = styled(List)<{ theme?: Theme }>(({ theme }) => ({\n  '&:hover': {\n    backgroundColor: theme.palette.action.hover,\n  },\n}));\n\nexport const IconButton = styled(MuiIconButton)({\n  padding: 6,\n  svg: {\n    fontSize: 16,\n  },\n});\n\nexport const PackageListItemText = styled(ListItemText)({\n  paddingRight: 0,\n});\n\nexport const Description = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  color: theme.palette.mode === 'light' ? greyDark : common.white,\n  fontSize: '14px',\n  paddingRight: 0,\n}));\n"],"mappings":";;;;;;;;;;AAYA,IAAa,eAAe,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,SAAS;CACT,YAAY;CACZ,QAAQ;CACR,OAAO,MAAM,QAAQ,SAAS,UAAU,MAAM,QAAQ,YAAY,OAAO;CACzE,UAAU;EACT,sBAAsB,MAAM,YAAY,OAAO,OAAO,EACrD,mBAAmB,EACjB,SAAS,OACX,EACF;EACC,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,mBAAmB,EACjB,SAAS,OACX,EACF;AACF,EAAE;AAEF,IAAa,YAAY,OAAO,MAAM,CAAC,CAAC,EACtC,QAAQ,YACV,CAAC;AAED,IAAa,UAAU,OAAO,MAAM,CAAC,CAAC;CACpC,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,eAAe;AACjB,CAAC;AAED,IAAa,SAAS,OAAO,KAAK,CAAC,CAAC;CAClC,SAAS;CACT,YAAY;AACd,CAAC;AAED,IAAaA,WAAS,OAAOC,MAAK,CAAC,CAAC;CAClC,OAAO;CACP,QAAQ;AACV,CAAC;AAED,IAAa,cAAc,OAAO,IAAI,CAAC,CAAC,EACtC,gBAAgB,OAClB,CAAC;AAED,IAAa,eAAe,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,YAAY,MAAM,WAAW;CAC7B,UAAU;CACV,SAAS;CACT,OAAO,MAAM,QAAQ,QAAQ;CAC7B,QAAQ;CACR,gBAAgB;CAChB,WAAW;EACV,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,UAAU,GACZ;AACF,EAAE;AAEF,IAAa,mBAAmB,OAAO,IAAI,CAAC,CAAC;CAC3C,SAAS;CACT,YAAY;CACZ,gBAAgB;AAClB,CAAC;AAED,IAAa,UAAU,OAAO,IAAI,CAAC,EAAqB,EAAE,aAAa,EACrE,WAAW,EACT,iBAAiB,MAAM,QAAQ,OAAO,MACxC,EACF,EAAE;AAEF,IAAaC,eAAa,OAAOC,UAAa,CAAC,CAAC;CAC9C,SAAS;CACT,KAAK,EACH,UAAU,GACZ;AACF,CAAC;AAED,IAAa,sBAAsB,OAAO,YAAY,CAAC,CAAC,EACtD,cAAc,EAChB,CAAC;AAED,IAAa,cAAc,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC3E,OAAO,MAAM,QAAQ,SAAS,UAAU,WAAW,OAAO;CAC1D,UAAU;CACV,cAAc;AAChB,EAAE"}
+{"version":3,"file":"styles.mjs","names":["Avatar","Photo","IconButton","MuiIconButton"],"sources":["../../../src/components/Package/styles.ts"],"sourcesContent":["import styled from '@emotion/styled';\nimport { default as Photo } from '@mui/material/Avatar';\nimport Grid from '@mui/material/Grid';\nimport { default as MuiIconButton } from '@mui/material/IconButton';\nimport List from '@mui/material/List';\nimport ListItemText from '@mui/material/ListItemText';\nimport { common } from '@mui/material/colors';\nimport { Link } from 'react-router';\n\nimport type { Theme } from '../../';\nimport { greyDark } from '../../Theme/colors';\n\nexport const OverviewItem = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  margin: '0 20px 0 0',\n  color: theme.palette.mode === 'light' ? theme.palette.greyDark2 : common.white,\n  fontSize: 12,\n  [`@media (max-width: ${theme.breakPoints.medium}px)`]: {\n    ':nth-of-type(3)': {\n      display: 'none',\n    },\n  },\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    ':nth-of-type(4)': {\n      display: 'none',\n    },\n  },\n}));\n\nexport const Published = styled('span')({\n  margin: '0 5px 0 0',\n});\n\nexport const Details = styled('span')({\n  marginLeft: '5px',\n  lineHeight: 1.5,\n  display: 'flex',\n  flexDirection: 'column',\n});\n\nexport const Author = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nexport const Avatar = styled(Photo)({\n  width: '20px',\n  height: '20px',\n});\n\nexport const WrapperLink = styled(Link)({\n  textDecoration: 'none',\n});\n\nexport const VersionLink = styled(Link)({\n  display: 'flex',\n  alignItems: 'center',\n  color: 'inherit',\n  textDecoration: 'none',\n  ':hover, :focus-visible': {\n    textDecoration: 'underline',\n  },\n});\n\nexport const PackageTitle = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: theme.fontWeight.bold,\n  fontSize: 20,\n  display: 'block',\n  color: theme.palette.primary.main,\n  cursor: 'pointer',\n  textDecoration: 'none',\n  wordBreak: 'break-word',\n  [`@media (max-width: ${theme.breakPoints.small}px)`]: {\n    fontSize: 16,\n  },\n}));\n\nexport const GridRightAligned = styled(Grid)({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'flex-end',\n});\n\nexport const Wrapper = styled(List)<{ theme?: Theme }>(({ theme }) => ({\n  '&:hover': {\n    backgroundColor: theme.palette.action.hover,\n  },\n}));\n\nexport const IconButton = styled(MuiIconButton)({\n  padding: 6,\n  svg: {\n    fontSize: 16,\n  },\n});\n\nexport const PackageListItemText = styled(ListItemText)({\n  paddingRight: 0,\n});\n\nexport const Description = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  color: theme.palette.mode === 'light' ? greyDark : common.white,\n  fontSize: '14px',\n  paddingRight: 0,\n}));\n"],"mappings":";;;;;;;;;;AAYA,IAAa,eAAe,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,SAAS;CACT,YAAY;CACZ,QAAQ;CACR,OAAO,MAAM,QAAQ,SAAS,UAAU,MAAM,QAAQ,YAAY,OAAO;CACzE,UAAU;EACT,sBAAsB,MAAM,YAAY,OAAO,OAAO,EACrD,mBAAmB,EACjB,SAAS,OACX,EACF;EACC,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,mBAAmB,EACjB,SAAS,OACX,EACF;AACF,EAAE;AAEF,IAAa,YAAY,OAAO,MAAM,CAAC,CAAC,EACtC,QAAQ,YACV,CAAC;AAED,IAAa,UAAU,OAAO,MAAM,CAAC,CAAC;CACpC,YAAY;CACZ,YAAY;CACZ,SAAS;CACT,eAAe;AACjB,CAAC;AAED,IAAa,SAAS,OAAO,KAAK,CAAC,CAAC;CAClC,SAAS;CACT,YAAY;AACd,CAAC;AAED,IAAaA,WAAS,OAAOC,MAAK,CAAC,CAAC;CAClC,OAAO;CACP,QAAQ;AACV,CAAC;AAED,IAAa,cAAc,OAAO,IAAI,CAAC,CAAC,EACtC,gBAAgB,OAClB,CAAC;AAED,IAAa,cAAc,OAAO,IAAI,CAAC,CAAC;CACtC,SAAS;CACT,YAAY;CACZ,OAAO;CACP,gBAAgB;CAChB,0BAA0B,EACxB,gBAAgB,YAClB;AACF,CAAC;AAED,IAAa,eAAe,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC5E,YAAY,MAAM,WAAW;CAC7B,UAAU;CACV,SAAS;CACT,OAAO,MAAM,QAAQ,QAAQ;CAC7B,QAAQ;CACR,gBAAgB;CAChB,WAAW;EACV,sBAAsB,MAAM,YAAY,MAAM,OAAO,EACpD,UAAU,GACZ;AACF,EAAE;AAEF,IAAa,mBAAmB,OAAO,IAAI,CAAC,CAAC;CAC3C,SAAS;CACT,YAAY;CACZ,gBAAgB;AAClB,CAAC;AAED,IAAa,UAAU,OAAO,IAAI,CAAC,EAAqB,EAAE,aAAa,EACrE,WAAW,EACT,iBAAiB,MAAM,QAAQ,OAAO,MACxC,EACF,EAAE;AAEF,IAAaC,eAAa,OAAOC,UAAa,CAAC,CAAC;CAC9C,SAAS;CACT,KAAK,EACH,UAAU,GACZ;AACF,CAAC;AAED,IAAa,sBAAsB,OAAO,YAAY,CAAC,CAAC,EACtD,cAAc,EAChB,CAAC;AAED,IAAa,cAAc,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC3E,OAAO,MAAM,QAAQ,SAAS,UAAU,WAAW,OAAO;CAC1D,UAAU;CACV,cAAc;AAChB,EAAE"}