diff --git a/packages/eds-lab-react/CHANGELOG.md b/packages/eds-lab-react/CHANGELOG.md index 4ab9bfa736..1e5c9d94da 100644 --- a/packages/eds-lab-react/CHANGELOG.md +++ b/packages/eds-lab-react/CHANGELOG.md @@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [unreleased] - 2024-03-12 + +### Changed + +- 🗑️ `DatePicker`: We removed import of CSS. You need to require the CSS file from `react-datepicker`. We will continue providing the style overrides encapsulated in our DatePicker component abstraction. + ## [0.7.6] - 2024-03-01 ### Changed diff --git a/packages/eds-lab-react/README.md b/packages/eds-lab-react/README.md index 0ba78d25bf..a06474c101 100644 --- a/packages/eds-lab-react/README.md +++ b/packages/eds-lab-react/README.md @@ -14,12 +14,11 @@ If you use Typescript, make sure you have typescript >= 3.8 as a devDependency: npm install typescript --save-dev ``` -## Known issues and workarounds -### Datepicker +### DatePicker -Under some circumstances `` is missing it’s styles. A temporary workaround is to import the css explicitly as reported in issue [#2081](https://github.com/equinor/design-system/issues/2081). +You will need to require the CSS file from the `react-datepicker` package (or provide your own). The example below shows how to include the CSS from this package if your build system supports requiring CSS files. ```css import 'react-datepicker/dist/react-datepicker.css'; -``` +``` \ No newline at end of file diff --git a/packages/eds-lab-react/src/components/DatePicker/DatePicker.stories.tsx b/packages/eds-lab-react/src/components/DatePicker/DatePicker.stories.tsx index 025d7d6ece..0fbafcdcb9 100644 --- a/packages/eds-lab-react/src/components/DatePicker/DatePicker.stories.tsx +++ b/packages/eds-lab-react/src/components/DatePicker/DatePicker.stories.tsx @@ -1,3 +1,5 @@ +import 'react-datepicker/dist/react-datepicker.css' + import { useState } from 'react' import styled from 'styled-components' import { StoryObj, Meta } from '@storybook/react' diff --git a/packages/eds-lab-react/src/components/DatePicker/DatePicker.tsx b/packages/eds-lab-react/src/components/DatePicker/DatePicker.tsx index 1dc22e7a48..331f5fcb0a 100644 --- a/packages/eds-lab-react/src/components/DatePicker/DatePicker.tsx +++ b/packages/eds-lab-react/src/components/DatePicker/DatePicker.tsx @@ -12,7 +12,6 @@ import DatePicker, { registerLocale, ReactDatePickerProps, } from 'react-datepicker' -import 'react-datepicker/dist/react-datepicker.css' import { enGB } from 'date-fns/locale' import styled, { css,