Remove CommonJS imports

minio · Oct 22, 2024 · 832ce6b · 832ce6b
1 parent f5587b9
commit 832ce6b
Show file tree

Hide file tree

Showing 5 changed files with 457 additions and 149 deletions.
diff --git a/package.json b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "mds3",
+  "name": "mds",
   "version": "3.0.0",
   "description": "A MinIO Components Library",
   "homepage": ".",
@@ -70,10 +70,10 @@
     "react-dom": "^18.3.1",
     "remark-gfm": "^4.0.0",
     "rollup": "^4.24.0",
-    "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-import-css": "^3.5.5",
     "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-rebase": "^4.1.1",
     "rollup-plugin-terser": "^7.0.2",
     "storybook": "^8.3.5",
     "storybook-dark-mode": "^4.0.2",
@@ -82,5 +82,5 @@
     "typescript": "^5.6.3",
     "typescript-eslint": "^8.9.0"
   },
-  "packageManager": "[email protected].0"
+  "packageManager": "[email protected].1"
 }
diff --git a/rollup.config.mjs b/rollup.config.mjs
@@ -5,7 +5,7 @@ import commonjs from "@rollup/plugin-commonjs";
 import typescript from "@rollup/plugin-typescript";
 import css from "rollup-plugin-import-css";
 import peerDepsExternal from "rollup-plugin-peer-deps-external";
-import copy from "rollup-plugin-copy";
+import rebase from "rollup-plugin-rebase";
 
 export default [
   {
@@ -18,6 +18,7 @@ export default [
         sourcemap: true,
       },
     ],
+    makeAbsoluteExternalsRelative: true,
     plugins: [
       peerDepsExternal(),
       resolve({
@@ -27,8 +28,9 @@ export default [
       typescript({ tsconfig: "./tsconfig.json" }),
       terser(),
       css({ alwaysOutput: true, minify: true }),
-      copy({
-        targets: [{ src: "src/components/assets", dest: "dist" }],
+      rebase({
+        assetFolder: "assets",
+        keepName: true,
       }),
     ],
     external: ["react", "react-dom", "emotion", "emotion/react"],

diff --git a/src/components/GlobalStyles/index.tsx b/src/components/GlobalStyles/index.tsx
@@ -1,5 +1,3 @@
-/* eslint-disable @typescript-eslint/no-require-imports */
-
 // This file is part of MinIO Design System
 // Copyright (c) 2022 MinIO, Inc.
 //
@@ -18,15 +16,15 @@
 
 import { css, Global, useTheme } from "@emotion/react";
 
-const GeistBlackWoff2 = require("../assets/fonts/Geist/Geist-Black.woff2");
-const GeistBoldWoff2 = require("../assets/fonts/Geist/Geist-Bold.woff2");
-const GeistLightWoff2 = require("../assets/fonts/Geist/Geist-Light.woff2");
-const GeistRegularWoff2 = require("../assets/fonts/Geist/Geist-Regular.woff2");
-const GeistThinWoff2 = require("../assets/fonts/Geist/Geist-Thin.woff2");
-const GeistSemiBoldWoff2 = require("../assets/fonts/Geist/Geist-SemiBold.woff2");
-const GeistMediumWoff2 = require("../assets/fonts/Geist/Geist-Medium.woff2");
-const GeistUltraLightWoff2 = require("../assets/fonts/Geist/Geist-UltraLight.woff2");
-const GeistMonoRegularWoff2 = require("../assets/fonts/Geist/GeistMono-Regular.woff2");
+import GeistBlackWoff2 from "../assets/fonts/Geist/Geist-Black.woff2";
+import GeistBoldWoff2 from "../assets/fonts/Geist/Geist-Bold.woff2";
+import GeistLightWoff2 from "../assets/fonts/Geist/Geist-Light.woff2";
+import GeistMediumWoff2 from "../assets/fonts/Geist/Geist-Medium.woff2";
+import GeistRegularWoff2 from "../assets/fonts/Geist/Geist-Regular.woff2";
+import GeistSemiBoldWoff2 from "../assets/fonts/Geist/Geist-SemiBold.woff2";
+import GeistThinWoff2 from "../assets/fonts/Geist/Geist-Thin.woff2";
+import GeistUltraLightWoff2 from "../assets/fonts/Geist/Geist-UltraLight.woff2";
+import GeistMonoRegularWoff2 from "../assets/fonts/Geist/GeistMono-Regular.woff2";
 
 const geistFonts = css([
   {

diff --git a/src/components/LoginWrapper/index.tsx b/src/components/LoginWrapper/index.tsx
@@ -19,13 +19,12 @@ import { useTheme } from "@emotion/react";
 import { getGPUTier } from "detect-gpu";
 
 import ApplicationLogo from "../ApplicationLogo";
+import poster from "../assets/background/loginAnimationPoster.png";
+import bgVideo from "../assets/video/videoBG.mp4";
 import Box from "../Box";
 import { customLoginStyles } from "./LoginWrapper.styles";
 import { LoginWrapperProps } from "./LoginWrapper.types";
 
-const bgVideo = require("../assets/video/videoBG.mp4");
-const poster = require("../assets/background/loginAnimationPoster.png");
-
 const LoginWrapper: FC<LoginWrapperProps> = ({
   logoProps,
   form,