@skyscanner/backpack-web 9.2.0-beta.3 → 10.0.0

package/bpk-animate-height/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-animate-height",
-  "version": "5.0.1",
+  "version": "5.0.3",
   "description": "Animate height using CSS transitions.",
   "license": "Apache-2.0",
   "repository": {
@@ -20,7 +20,7 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-button": "^7.0.1"
+    "@skyscanner/bpk-foundations-web": "^9.2.0",
+    "bpk-component-button": "^7.0.3"
   }
 }

package/bpk-component-accordion/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-accordion",
-  "version": "6.1.0",
+  "version": "6.1.2",
   "description": "Backpack accordion component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,10 +14,10 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-animate-height": "^5.0.1",
-    "bpk-component-icon": "^10.0.1",
-    "bpk-component-text": "^8.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-animate-height": "^5.0.3",
+    "bpk-component-icon": "^10.0.3",
+    "bpk-component-text": "^8.0.3",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
@@ -25,7 +25,7 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-checkbox": "^5.0.1"
+    "@skyscanner/bpk-foundations-web": "^9.2.0",
+    "bpk-component-checkbox": "^5.0.3"
   }
 }

package/bpk-component-aria-live/README.md

@@ -10,7 +10,7 @@ npm install bpk-component-aria-live --save-dev
 
 ## Usage
 
-```js
+```tsx
 import React from 'react';
 import BpkAriaLive, { ARIA_LIVE_POLITENESS_SETTINGS } from 'bpk-component-aria-live';
 
@@ -37,6 +37,6 @@ export default () => (
 
 `aria-relevant` and `aria-atomic` props can also be set.
 
-`aria-relevant` determines what sort of changes should be read out. By default it is `additions` but can be `removals` or `all`. [Read more about `aria-relevant` on MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-relevant_attribute).
+`aria-relevant` determines what sort of changes should be read out. By default it is `text` but can be `additions`, `removals` or `all`. [Read more about `aria-relevant` on MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-relevant).
 
 `aria-atomic` is a boolean which determines whether changes should be read out, or the whole region should be read out. [Read more about `aria-atomic` on MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Use_Case:_Clock).

package/bpk-component-aria-live/{index.js → index.ts}

@@ -15,7 +15,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-/* @flow strict */
 
 import BpkAriaLive, {
   POLITENESS_SETTINGS as ARIA_LIVE_POLITENESS_SETTINGS,

package/bpk-component-aria-live/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-aria-live",
-  "version": "3.0.1",
+  "version": "3.1.0",
   "description": "Backpack aria-live component.",
   "license": "Apache-2.0",
   "repository": {
@@ -8,21 +8,20 @@
     "url": "git@github.com:Skyscanner/backpack.git"
   },
   "author": "Backpack Design System <backpack@skyscanner.net>",
-  "main": "index.js",
+  "main": "index.ts",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
-    "bpk-react-utils": "^7.0.0",
-    "prop-types": "^15.5.8"
+    "bpk-mixins": "^31.6.1",
+    "bpk-react-utils": "^7.0.0"
   },
   "devDependencies": {
-    "bpk-component-chip": "^6.0.1",
-    "bpk-component-code": "^4.0.1",
-    "bpk-component-fieldset": "^5.0.1",
-    "bpk-component-select": "^6.0.1",
-    "bpk-component-switch": "^3.0.1"
+    "bpk-component-chip": "^6.0.3",
+    "bpk-component-code": "^4.0.3",
+    "bpk-component-fieldset": "^5.0.3",
+    "bpk-component-select": "^6.0.3",
+    "bpk-component-switch": "^3.0.3"
   },
   "peerDependencies": {
     "react": "^17.0.2"

package/bpk-component-aria-live/src/BpkAriaLive-test.tsx

@@ -0,0 +1,60 @@
+/*
+ * Backpack - Skyscanner's Design System
+ *
+ * Copyright 2016 Skyscanner Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+
+import BpkAriaLive, { POLITENESS_SETTINGS } from './BpkAriaLive';
+import type { PolitenessSetting } from './BpkAriaLive';
+
+describe('BpkAriaLive', () => {
+  it('should render correctly', () => {
+    const { asFragment } = render(<BpkAriaLive>Backpack</BpkAriaLive>);
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  Object.keys(POLITENESS_SETTINGS).forEach((politenessSetting) => {
+    it(`should render correctly with politenessSetting="${politenessSetting}"`, () => {
+      const { asFragment } = render(
+        <BpkAriaLive politenessSetting={politenessSetting as PolitenessSetting}>
+          Backpack
+        </BpkAriaLive>,
+      );
+      expect(asFragment()).toMatchSnapshot();
+    });
+  });
+
+  it('should render correctly with the "visible" prop', () => {
+    const { asFragment } = render(<BpkAriaLive visible>Backpack</BpkAriaLive>);
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should support custom class names', () => {
+    const { asFragment } = render(
+      <BpkAriaLive className="custom-classname">Backpack</BpkAriaLive>,
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should support arbitrary props', () => {
+    const { asFragment } = render(
+      <BpkAriaLive testid="123">Backpack</BpkAriaLive>,
+    );
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/bpk-component-aria-live/src/{BpkAriaLive.js → BpkAriaLive.tsx}

@@ -15,11 +15,11 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-/* @flow strict */
 
-import PropTypes from 'prop-types';
-import React, { type Node } from 'react';
+import React from 'react';
+import type { ReactElement } from 'react';
 
+// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
 import { cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkAriaLive.module.scss';
@@ -30,38 +30,32 @@ export const POLITENESS_SETTINGS = {
   off: 'off',
   polite: 'polite',
   assertive: 'assertive',
-};
+} as const;
+
+export type PolitenessSetting =
+  typeof POLITENESS_SETTINGS[keyof typeof POLITENESS_SETTINGS];
 
 export type Props = {
-  children: Node,
-  politenessSetting: $Keys<typeof POLITENESS_SETTINGS>,
-  visible: boolean,
-  className: ?string,
+  children: ReactElement | string;
+  politenessSetting?: PolitenessSetting;
+  visible?: boolean;
+  className?: string | null;
+  [rest: string]: any; // Inexact rest. See decisions/inexact-rest.md
 };
-const BpkAriaLive = (props: Props) => {
-  const { className, politenessSetting, visible, ...rest } = props;
+
+const BpkAriaLive = ({
+  className = null,
+  politenessSetting = POLITENESS_SETTINGS.polite,
+  visible = false,
+  ...rest
+}: Props) => {
   const classNames = getClassName(
     'bpk-aria-live',
     !visible && 'bpk-aria-live--invisible',
     className,
   );
 
-  return (
-    // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
-    <div aria-live={politenessSetting} className={classNames} {...rest} />
-  );
-};
-
-BpkAriaLive.propTypes = {
-  className: PropTypes.string,
-  politenessSetting: PropTypes.oneOf(Object.keys(POLITENESS_SETTINGS)),
-  visible: PropTypes.bool,
-};
-
-BpkAriaLive.defaultProps = {
-  className: null,
-  politenessSetting: POLITENESS_SETTINGS.polite,
-  visible: false,
+  return <div aria-live={politenessSetting} className={classNames} {...rest} />;
 };
 
 export default BpkAriaLive;

package/bpk-component-aria-live/src/accessibility-test.tsx

@@ -0,0 +1,31 @@
+/*
+ * Backpack - Skyscanner's Design System
+ *
+ * Copyright 2016 Skyscanner Ltd
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { axe } from 'jest-axe';
+
+import BpkAriaLive from './BpkAriaLive';
+
+describe('BpkAriaLive accessibility tests', () => {
+  it('should not have programmatically-detectable accessibility issues', async () => {
+    const { container } = render(<BpkAriaLive>Backpack</BpkAriaLive>);
+    const results = await axe(container);
+    expect(results).toHaveNoViolations();
+  });
+});

package/bpk-component-autosuggest/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-autosuggest",
-  "version": "7.0.1",
+  "version": "7.0.3",
   "description": "Backpack autosuggest component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "4e4ec9add28e1db54d6a38a10c331bbd163f2926",
   "dependencies": {
-    "bpk-component-input": "^7.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-input": "^7.0.3",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2",
     "react-autosuggest": "^9.4.3"
@@ -24,6 +24,6 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-icon": "^10.0.1"
+    "bpk-component-icon": "^10.0.3"
   }
 }

package/bpk-component-badge/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-badge",
-  "version": "5.1.0",
+  "version": "5.1.2",
   "description": "Backpack badge component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
@@ -22,8 +22,8 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-icon": "^10.0.1",
-    "bpk-storybook-utils": "^2.0.1"
+    "@skyscanner/bpk-foundations-web": "^9.2.0",
+    "bpk-component-icon": "^10.0.3",
+    "bpk-storybook-utils": "^2.0.3"
   }
 }

package/bpk-component-banner-alert/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-banner-alert",
-  "version": "7.0.1",
+  "version": "7.0.3",
   "description": "Backpack banner alert component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,19 +14,19 @@
   },
   "gitHead": "4e4ec9add28e1db54d6a38a10c331bbd163f2926",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-animate-height": "^5.0.1",
-    "bpk-component-close-button": "^4.0.1",
-    "bpk-component-icon": "^10.0.1",
-    "bpk-mixins": "^31.4.0",
+    "@skyscanner/bpk-foundations-web": "^9.2.0",
+    "bpk-animate-height": "^5.0.3",
+    "bpk-component-close-button": "^4.0.3",
+    "bpk-component-icon": "^10.0.3",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2",
     "react-transition-group": "^2.5.3"
   },
   "devDependencies": {
-    "bpk-component-aria-live": "^3.0.1",
-    "bpk-component-button": "^7.0.1",
-    "bpk-storybook-utils": "^2.0.1"
+    "bpk-component-aria-live": "^3.1.0",
+    "bpk-component-button": "^7.0.3",
+    "bpk-storybook-utils": "^2.0.3"
   },
   "peerDependencies": {
     "react": "^17.0.2"

package/bpk-component-barchart/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-barchart",
-  "version": "5.0.1",
+  "version": "5.0.3",
   "description": "Backpack bar chart component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,9 +14,9 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-mobile-scroll-container": "^4.0.1",
-    "bpk-mixins": "^31.4.0",
+    "@skyscanner/bpk-foundations-web": "^9.2.0",
+    "bpk-component-mobile-scroll-container": "^4.0.3",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "d3-path": "^2.0.0",
     "d3-scale": "^4.0.2",
@@ -27,9 +27,9 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-breakpoint": "^5.0.1",
-    "bpk-component-content-container": "^6.0.1",
-    "bpk-component-rtl-toggle": "^4.0.1",
-    "bpk-component-text": "^8.0.1"
+    "bpk-component-breakpoint": "^5.0.3",
+    "bpk-component-content-container": "^6.0.3",
+    "bpk-component-rtl-toggle": "^4.0.3",
+    "bpk-component-text": "^8.0.3"
   }
 }

package/bpk-component-blockquote/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-blockquote",
-  "version": "4.1.0",
+  "version": "4.1.2",
   "description": "Backpack blockquote component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },

package/bpk-component-breadcrumb/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-breadcrumb",
-  "version": "4.0.1",
+  "version": "4.1.1",
   "description": "Backpack breadcrumb component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,10 +14,10 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-component-icon": "^10.0.1",
-    "bpk-component-link": "^4.0.1",
-    "bpk-component-text": "^8.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-icon": "^10.0.3",
+    "bpk-component-link": "^4.0.3",
+    "bpk-component-text": "^8.0.3",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },

package/bpk-component-breadcrumb/src/BpkBreadcrumbItem.module.scss

@@ -30,11 +30,11 @@ $bpk-spacing-v2: true;
   }
 
   &__active-item {
-    color: $bpk-color-sky-gray-tint-01;
+    color: $bpk-text-secondary-day;
   }
 
   &__arrow {
     margin: 0 bpk-spacing-sm();
-    fill: $bpk-color-sky-gray-tint-04;
+    fill: $bpk-text-disabled-day;
   }
 }

package/bpk-component-breakpoint/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-breakpoint",
-  "version": "5.0.1",
+  "version": "5.0.3",
   "description": "Backpack breakpoint component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2",
     "react-responsive": "^8.2.0"
@@ -23,6 +23,6 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0"
+    "@skyscanner/bpk-foundations-web": "^9.2.0"
   }
 }

package/bpk-component-button/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-button",
-  "version": "7.0.1",
+  "version": "7.0.3",
   "description": "Backpack button component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,11 +14,11 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.6.1",
     "prop-types": "^15.7.2"
   },
   "devDependencies": {
-    "bpk-storybook-utils": "^2.0.1"
+    "bpk-storybook-utils": "^2.0.3"
   },
   "peerDependencies": {
     "react": "^17.0.2"

package/bpk-component-calendar/DOCS.md

@@ -20,10 +20,4 @@ Calendar components -
 
     - `Week` - This is a container that will take the `DateComponent` to display each of the dates in the calendar
 
-  - `BpkCalendarDate` - is each date cell that would be displayed inside the calendar grid. This would be used to customise how each date cell is displayed e.g. coloured or with special pricing displayed.
-
-  It has a `cellType` prop which can be used to set a custom colour. An exported `CELL_TYPES` object offers the following cell types:
-    - `CELL_TYPES.positive` - sets the calendar cell to `Monteverde`
-    - `CELL_TYPES.neutral` - sets the calendar cell to `Erfoud`
-    - `CELL_TYPES.negative` - sets the calendar cell to `Panjin`
-    - `CELL_TYPES.default` - sets the calendar cell to `Sky Gray Tint 02`
+  - `BpkCalendarDate` - is each date cell that would be displayed inside the calendar grid. This would be used to customise how each date cell is displayed e.g. coloured or with special pricing displayed.

package/bpk-component-calendar/README.md

@@ -248,7 +248,6 @@ The BpkCalendarDate component is used to render the content of a cell
 | Property              | PropType             | Required | Default Value    |
 | --------------------- | -------------------- | -------- | ---------------- |
 | date                  | Date                 | true     | -                |
-| cellType              | oneOf(CELL_TYPES.default, CELL_TYPES.positive, CELL_TYPES.neutral, CELL_TYPES.negative)                     | false    | null             |
 | isBlocked             | bool                 | false    | false            |
 | isFocused             | bool                 | false    | false            |
 | isKeyboardFocusable   | bool                 | false    | true             |
@@ -261,15 +260,6 @@ The BpkCalendarDate component is used to render the content of a cell
 | selectionType         | oneOf(SELECTION_TYPES.single, SELECTION_TYPES.start, SELECTION_TYPES.middle, SELECTION_TYPES.end)      | false    | SELECTION_TYPES.single             |
 | style                 | object               | false    | null             |
 
-#### `cellType` prop
-
-This prop determines what the colour date cell is to be displayed.
-
-- `CELL_TYPES.positive` - sets the calendar cell to `Monteverde`
-- `CELL_TYPES.neutral` - sets the calendar cell to `Erfoud`
-- `CELL_TYPES.negative` - sets the calendar cell to `Panjin`
-- `CELL_TYPES.default` - sets the calendar cell to `Sky Gray Tint 02`
-
 #### `selectionType` prop
 
 This property determines which selected styles will be applied to the date cell. If using ranges use `start`, `middle` and `end` to apply the correct range styles.

package/bpk-component-calendar/index.js

@@ -26,7 +26,6 @@ import BpkCalendarGrid, {
 import BpkCalendarGridHeader from './src/BpkCalendarGridHeader';
 import BpkCalendarNav from './src/BpkCalendarNav';
 import BpkCalendarDate, {
-  CELL_TYPES,
   ROW_TYPES,
   SELECTION_TYPES,
   propTypes as BpkCalendarDatePropTypes,
@@ -47,7 +46,6 @@ export {
   BpkCalendarDate,
   CustomPropTypes,
   DateUtils,
-  CELL_TYPES,
   CALENDAR_SELECTION_TYPE,
   ROW_TYPES,
   SELECTION_TYPES,

package/bpk-component-calendar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-calendar",
-  "version": "12.0.1",
+  "version": "13.0.0",
   "description": "Backpack calendar component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,11 +14,11 @@
   },
   "gitHead": "4e4ec9add28e1db54d6a38a10c331bbd163f2926",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-aria-live": "^3.0.1",
-    "bpk-component-icon": "^10.0.1",
-    "bpk-component-select": "^6.0.1",
-    "bpk-mixins": "^31.4.0",
+    "@skyscanner/bpk-foundations-web": "^9.2.0",
+    "bpk-component-aria-live": "^3.1.0",
+    "bpk-component-icon": "^10.0.3",
+    "bpk-component-select": "^6.0.3",
+    "bpk-mixins": "^31.6.1",
     "bpk-react-utils": "^7.0.0",
     "date-fns": "^2.21.1",
     "prop-types": "^15.7.2"
@@ -27,8 +27,8 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-text": "^8.0.1",
-    "bpk-storybook-utils": "^2.0.1"
+    "bpk-component-button": "^7.0.3",
+    "bpk-component-text": "^8.0.3",
+    "bpk-storybook-utils": "^2.0.3"
   }
 }

package/bpk-component-calendar/src/BpkCalendarDate.js

@@ -26,13 +26,6 @@ import STYLES from './BpkCalendarDate.module.scss';
 
 const getClassName = cssModules(STYLES);
 
-export const CELL_TYPES = {
-  default: 'default',
-  negative: 'negative',
-  neutral: 'neutral',
-  positive: 'positive',
-};
-
 export const SELECTION_TYPES = {
   none: 'none',
   single: 'single',
@@ -99,7 +92,6 @@ class BpkCalendarDate extends PureComponent {
 
   render() {
     const {
-      cellType,
       className,
       date,
       isBlocked,
@@ -126,11 +118,6 @@ class BpkCalendarDate extends PureComponent {
       }
     });
 
-    if (cellType) {
-      classNames.push(getClassName(`bpk-calendar-date--colored`));
-      classNames.push(getClassName(`bpk-calendar-date--colored-${cellType}`));
-    }
-
     if (isFocused) {
       classNames.push(getClassName('bpk-calendar-date--focused'));
     }
@@ -183,7 +170,6 @@ export const propTypes = {
   // Required
   date: PropTypes.instanceOf(Date).isRequired,
   // Optional
-  cellType: PropTypes.oneOf(Object.keys(CELL_TYPES)),
   className: PropTypes.string,
   isBlocked: PropTypes.bool,
   isFocused: PropTypes.bool,
@@ -203,7 +189,6 @@ BpkCalendarDate.propTypes = { ...propTypes };
 
 export const defaultProps = {
   className: null,
-  cellType: null,
   isBlocked: false,
   isFocused: false,
   isKeyboardFocusable: true,