@bitrise/bitkit 10.35.0-alpha-datepicker-rewrite.1 → 10.35.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit",
   "description": "Bitrise React component library",
-  "version": "10.35.0-alpha-datepicker-rewrite.1",
+  "version": "10.35.0",
   "repository": "git@github.com:bitrise-io/bitkit.git",
   "main": "src/index.ts",
   "license": "UNLICENSED",
@@ -47,8 +47,6 @@
     "@chakra-ui/cli": "^2.1.2",
     "@commitlint/cli": "^16.3.0",
     "@commitlint/config-conventional": "^16.2.4",
-    "@emotion/cache": "^11.10.3",
-    "@emotion/jest": "^11.10.0",
     "@google-cloud/storage": "^5.20.5",
     "@semantic-release/changelog": "^6.0.1",
     "@semantic-release/commit-analyzer": "^9.0.2",

package/src/Components/DatePicker/DatePicker.test.tsx

@@ -1,28 +1,21 @@
 import { render, screen, waitFor, within } from '@testing-library/react';
 import { DateTime } from 'luxon';
-import { CacheProvider } from '@emotion/react';
-import createCache from '@emotion/cache';
 import userEventGlobal from '@testing-library/user-event';
 import Provider from '../Provider/Provider';
-import useResponsive from '../../hooks/useResponsive';
 import DatePicker, { DatePickerProps } from './DatePicker';
 import { DateRange } from './useDateRange';
 
-const cache = createCache({ key: 'test', stylisPlugins: [] });
-
 jest.mock('../../hooks/useResponsive', () => jest.fn(() => ({ isMobile: false })));
 
 jest.useFakeTimers();
 jest.setSystemTime(DateTime.local(2022, 1, 2).toJSDate());
 const userEvent = userEventGlobal.setup({ advanceTimers: (t) => jest.advanceTimersByTime(t) });
 const Subject = (props: Partial<DatePickerProps>) => (
-  <CacheProvider value={cache}>
-    <Provider>
-      <DatePicker onClose={() => {}} visible {...props}>
-        <div />
-      </DatePicker>
-    </Provider>
-  </CacheProvider>
+  <Provider>
+    <DatePicker onClose={() => {}} visible {...props}>
+      <div />
+    </DatePicker>
+  </Provider>
 );
 describe('DatePicker', () => {
   it('works', async () => {
@@ -51,34 +44,7 @@ describe('DatePicker', () => {
     expect(begin?.toObject()).toMatchObject({ year: 2022, month: 10, day: 23 });
     expect(end?.toObject()).toMatchObject({ year: 2023, month: 2, day: 10 });
   });
-  describe('defaults', () => {
-    it('renders exactly as before', async () => {
-      render(<Subject />);
-      expect(document.body).toMatchSnapshot();
-    });
-  });
-  describe('with selectable range', () => {
-    it('renders exactly as before', async () => {
-      render(<Subject selectable={new DateRange(DateTime.local(2022, 2, 1), DateTime.local(2022, 2, 7))} />);
-      expect(document.body).toMatchSnapshot();
-    });
-  });
   describe('with range pre-selected', () => {
-    describe('when range is entirely inside the current month', () => {
-      it('renders exactly as before', () => {
-        render(<Subject selected={new DateRange(DateTime.local(2022, 2, 1), DateTime.local(2022, 2, 7))} />);
-        expect(document.body).toMatchSnapshot();
-      });
-    });
-    describe('on mobile', () => {
-      describe('when range is partially in the next month', () => {
-        it('renders exactly as before', () => {
-          jest.mocked(useResponsive).mockReturnValueOnce({ isMobile: true } as any);
-          render(<Subject selected={new DateRange(DateTime.local(2022, 2, 20), DateTime.local(2022, 3, 3))} />);
-          expect(document.body).toMatchSnapshot();
-        });
-      });
-    });
     describe('when range start/end is in the same month', () => {
       it('shows the start month on the left and the next month on the right', async () => {
         render(<Subject selected={new DateRange(DateTime.local(2022, 2, 1), DateTime.local(2022, 2, 7))} />);
@@ -108,13 +74,6 @@ describe('DatePicker', () => {
     });
   });
   describe('month selector', () => {
-    it('renders correctly', async () => {
-      render(<Subject />);
-      const left = await screen.findByRole('button', { name: 'January' });
-      await userEvent.click(left);
-      await screen.findByRole('spinbutton', { name: 'year' });
-      expect(document.body).toMatchSnapshot();
-    });
     it('shows current month as selected', async () => {
       render(<Subject />);
       const left = await screen.findByRole('button', { name: 'January' });

package/src/index.ts

@@ -203,7 +203,7 @@ export type { TextareaProps } from './Components/Form/Textarea/Textarea';
 export { default as Textarea } from './Components/Form/Textarea/Textarea';
 
 export type { DatePickerProps } from './Components/DatePicker/DatePicker';
-export { default as DatePicker } from './Components/DatePicker/DatePicker';
+export { default as DatePicker, DateRange, useDateRange } from './Components/DatePicker/DatePicker';
 
 export type { FadeProps } from './Components/Fade/Fade';
 export { default as Fade } from './Components/Fade/Fade';