From 3f17db6145e5a617dc95463fa1b4dd04c2e75dc7 Mon Sep 17 00:00:00 2001 From: Simon Ser Date: Mon, 20 Jan 2025 17:32:42 +0100 Subject: [PATCH] all: stop importing CSS files from library code We were importing CSS files directly from library code. This causes issues for downstream users, because they are forced to configure their build system to support CSS imports (e.g. webpack doesn't support this by default). Moreover, this makes it impossible to use the library without a build system (e.g. importing it directly from pure HTML/JS files). Make users responsible for including the CSS one way or another. Our stories do this using CSS imports already, but other downstream consumers might prefer to use a or similar. Signed-off-by: Simon Ser --- package-lock.json | 4 ++++ storybook/package.json | 4 ++++ .../TrackOccupancyDiagram/TrackOccupancyDiagram.stories.tsx | 3 +++ ui-core/src/index.ts | 2 -- ui-manchette-with-spacetimechart/src/index.ts | 2 -- ui-manchette/src/components/Waypoint.tsx | 1 - ui-manchette/src/index.ts | 2 -- ui-spacetimechart/src/index.ts | 2 -- ui-speedspacechart/src/index.ts | 3 --- ui-trackoccupancydiagram/src/index.ts | 3 --- 10 files changed, 11 insertions(+), 15 deletions(-) diff --git a/package-lock.json b/package-lock.json index 9bf8010f6..36058c4c5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18601,6 +18601,10 @@ }, "storybook": { "name": "@osrd-project/storybook", + "dependencies": { + "@osrd-project/ui-core": "0.0.1-dev", + "@osrd-project/ui-trackoccupancydiagram": "0.0.1-dev" + }, "devDependencies": { "@chromatic-com/storybook": "^3.2.0", "@storybook/addon-essentials": "^8.0.2", diff --git a/storybook/package.json b/storybook/package.json index 2386fd211..3e858e8c9 100644 --- a/storybook/package.json +++ b/storybook/package.json @@ -19,5 +19,9 @@ "clean": "rimraf storybook-static", "start": "storybook dev -p 6006", "build": "storybook build" + }, + "dependencies": { + "@osrd-project/ui-core": "0.0.1-dev", + "@osrd-project/ui-trackoccupancydiagram": "0.0.1-dev" } } diff --git a/storybook/stories/TrackOccupancyDiagram/TrackOccupancyDiagram.stories.tsx b/storybook/stories/TrackOccupancyDiagram/TrackOccupancyDiagram.stories.tsx index d497e6564..58c9a69e1 100755 --- a/storybook/stories/TrackOccupancyDiagram/TrackOccupancyDiagram.stories.tsx +++ b/storybook/stories/TrackOccupancyDiagram/TrackOccupancyDiagram.stories.tsx @@ -37,6 +37,9 @@ import { import occupancyZones from '../samples/TrackOccupancyDiagramSamples/occupancyZones'; import tracks from '../samples/TrackOccupancyDiagramSamples/tracks'; +import '@osrd-project/ui-core/dist/theme.css'; +import '@osrd-project/ui-trackoccupancydiagram/dist/theme.css'; + type TrackOccupancyDiagramProps = { xZoomLevel: number; yZoomLevel: number; diff --git a/ui-core/src/index.ts b/ui-core/src/index.ts index 52d0e3202..7ede4bff3 100644 --- a/ui-core/src/index.ts +++ b/ui-core/src/index.ts @@ -1,5 +1,3 @@ -import './styles/main.css'; - export { default as Button, ButtonProps } from './components/buttons/Button'; export { default as ComboBox, diff --git a/ui-manchette-with-spacetimechart/src/index.ts b/ui-manchette-with-spacetimechart/src/index.ts index 680a312ae..1b17b48dc 100644 --- a/ui-manchette-with-spacetimechart/src/index.ts +++ b/ui-manchette-with-spacetimechart/src/index.ts @@ -1,5 +1,3 @@ -import './styles/main.css'; - export { default as useManchettesWithSpaceTimeChart } from './hooks/useManchetteWithSpaceTimeChart'; export { DEFAULT_ZOOM_MS_PER_PX } from './consts'; export { timeScaleToZoomValue } from './helpers'; diff --git a/ui-manchette/src/components/Waypoint.tsx b/ui-manchette/src/components/Waypoint.tsx index eb91ca958..516436cb9 100644 --- a/ui-manchette/src/components/Waypoint.tsx +++ b/ui-manchette/src/components/Waypoint.tsx @@ -3,7 +3,6 @@ import React from 'react'; import cx from 'classnames'; import { type InteractiveWaypoint } from '../types'; -import '@osrd-project/ui-core/dist/theme.css'; import { positionMmToKm } from '../utils'; type WaypointProps = { diff --git a/ui-manchette/src/index.ts b/ui-manchette/src/index.ts index 015b9a2ef..5bb3bef52 100644 --- a/ui-manchette/src/index.ts +++ b/ui-manchette/src/index.ts @@ -1,5 +1,3 @@ -import '@osrd-project/ui-core/dist/theme.css'; -import './styles/main.css'; import './components/consts'; import Manchette from './components/Manchette'; diff --git a/ui-spacetimechart/src/index.ts b/ui-spacetimechart/src/index.ts index ab79245f3..fec28fe77 100644 --- a/ui-spacetimechart/src/index.ts +++ b/ui-spacetimechart/src/index.ts @@ -1,5 +1,3 @@ -import './styles/main.css'; - export type { HoveredItem, SpaceTimeChartProps } from './lib/types'; export * from './components/SpaceTimeChart'; diff --git a/ui-speedspacechart/src/index.ts b/ui-speedspacechart/src/index.ts index 1306b14e4..bed201dff 100644 --- a/ui-speedspacechart/src/index.ts +++ b/ui-speedspacechart/src/index.ts @@ -1,4 +1 @@ -import '@osrd-project/ui-core/dist/theme.css'; -import './styles/main.css'; - export { default as SpeedSpaceChart } from './components/SpeedSpaceChart'; diff --git a/ui-trackoccupancydiagram/src/index.ts b/ui-trackoccupancydiagram/src/index.ts index 32bfef2f5..6b03034d4 100644 --- a/ui-trackoccupancydiagram/src/index.ts +++ b/ui-trackoccupancydiagram/src/index.ts @@ -1,5 +1,2 @@ -import '@osrd-project/ui-core/dist/theme.css'; -import './styles/main.css'; - export { default as TrackOccupancyCanvas } from './components/TrackOccupancyCanvas'; export { default as TrackOccupancyManchette } from './components/TrackOccupancyManchette';