@skyscanner/backpack-web 14.2.0-beta.1 → 15.1.0

package/bpk-component-button/src/BpkButtonOutline.module.scss

@@ -0,0 +1,23 @@
+/*
+ * 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 '~bpk-mixins/index.scss';
+
+.bpk-button--outline {
+  @include bpk-button--outline;
+}

package/bpk-component-button/src/BpkButtonPrimary.js

@@ -1,20 +1,33 @@
-"use strict";
+/*
+ * 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.
+ */
+
+/* @flow strict */
+
+import React from 'react';
+
+import { type Props, defaultProps, propTypes } from './common-types';
+import BpkButtonBase from './BpkButtonBase';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _commonTypes = require("./common-types");
-var _BpkButtonBase = _interopRequireDefault(require("./BpkButtonBase"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 // TODO: BpkButtonBase has the primary button style as it wasn't removed to
 // avoid a breaking change in the mixin. Review after this is tested.
-const BpkButtonPrimary = props => /*#__PURE__*/_react.default.createElement(_BpkButtonBase.default, props);
-BpkButtonPrimary.propTypes = _objectSpread({}, _commonTypes.propTypes);
-BpkButtonPrimary.defaultProps = _objectSpread({}, _commonTypes.defaultProps);
-var _default = BpkButtonPrimary;
-exports.default = _default;
+const BpkButtonPrimary = (props: Props) => <BpkButtonBase {...props} />;
+
+BpkButtonPrimary.propTypes = { ...propTypes };
+BpkButtonPrimary.defaultProps = { ...defaultProps };
+
+export default BpkButtonPrimary;

package/bpk-component-button/src/BpkButtonPrimaryOnDark.js

@@ -1,43 +1,48 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _commonTypes = require("./common-types");
-var _BpkButtonBase = _interopRequireWildcard(require("./BpkButtonBase"));
-var _BpkButtonPrimaryOnDarkModule = _interopRequireDefault(require("./BpkButtonPrimaryOnDark.module.css"));
-const _excluded = ["className"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-const getClassName = (0, _BpkButtonBase.cssModules)(_BpkButtonPrimaryOnDarkModule.default);
-const BpkButtonPrimaryOnDark = props => {
-  const {
-      className
-    } = props,
-    rest = _objectWithoutProperties(props, _excluded);
+/*
+ * 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.
+ */
+
+/* @flow strict */
+
+import React from 'react';
+
+import { type Props, defaultProps, propTypes } from './common-types';
+import BpkButtonBase, { cssModules } from './BpkButtonBase';
+import STYLES from './BpkButtonPrimaryOnDark.module.scss';
+
+const getClassName = cssModules(STYLES);
+
+const BpkButtonPrimaryOnDark = (props: Props) => {
+  const { className, ...rest } = props;
+
   const classNames = [getClassName('bpk-button--primary-on-dark')];
+
   if (className) {
     classNames.push(className);
   }
   const classNamesFinal = classNames.join(' ');
+
   return (
-    /*#__PURE__*/
     // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
-    _react.default.createElement(_BpkButtonBase.default, _extends({
-      className: classNamesFinal
-    }, rest))
+    <BpkButtonBase className={classNamesFinal} {...rest} />
   );
 };
-BpkButtonPrimaryOnDark.propTypes = _objectSpread({}, _commonTypes.propTypes);
-BpkButtonPrimaryOnDark.defaultProps = _objectSpread({}, _commonTypes.defaultProps);
-var _default = BpkButtonPrimaryOnDark;
-exports.default = _default;
+
+BpkButtonPrimaryOnDark.propTypes = { ...propTypes };
+BpkButtonPrimaryOnDark.defaultProps = { ...defaultProps };
+
+export default BpkButtonPrimaryOnDark;

package/bpk-component-button/src/BpkButtonPrimaryOnDark.module.scss

@@ -0,0 +1,23 @@
+/*
+ * 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 '~bpk-mixins/index.scss';
+
+.bpk-button--primary-on-dark {
+  @include bpk-button--primary-on-dark;
+}

package/bpk-component-button/src/BpkButtonPrimaryOnLight.js

@@ -1,43 +1,48 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _commonTypes = require("./common-types");
-var _BpkButtonBase = _interopRequireWildcard(require("./BpkButtonBase"));
-var _BpkButtonPrimaryOnLightModule = _interopRequireDefault(require("./BpkButtonPrimaryOnLight.module.css"));
-const _excluded = ["className"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-const getClassName = (0, _BpkButtonBase.cssModules)(_BpkButtonPrimaryOnLightModule.default);
-const BpkButtonPrimaryOnLight = props => {
-  const {
-      className
-    } = props,
-    rest = _objectWithoutProperties(props, _excluded);
+/*
+ * 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.
+ */
+
+/* @flow strict */
+
+import React from 'react';
+
+import { type Props, defaultProps, propTypes } from './common-types';
+import BpkButtonBase, { cssModules } from './BpkButtonBase';
+import STYLES from './BpkButtonPrimaryOnLight.module.scss';
+
+const getClassName = cssModules(STYLES);
+
+const BpkButtonPrimaryOnLight = (props: Props) => {
+  const { className, ...rest } = props;
+
   const classNames = [getClassName('bpk-button--primary-on-light')];
+
   if (className) {
     classNames.push(className);
   }
   const classNamesFinal = classNames.join(' ');
+
   return (
-    /*#__PURE__*/
     // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
-    _react.default.createElement(_BpkButtonBase.default, _extends({
-      className: classNamesFinal
-    }, rest))
+    <BpkButtonBase className={classNamesFinal} {...rest} />
   );
 };
-BpkButtonPrimaryOnLight.propTypes = _objectSpread({}, _commonTypes.propTypes);
-BpkButtonPrimaryOnLight.defaultProps = _objectSpread({}, _commonTypes.defaultProps);
-var _default = BpkButtonPrimaryOnLight;
-exports.default = _default;
+
+BpkButtonPrimaryOnLight.propTypes = { ...propTypes };
+BpkButtonPrimaryOnLight.defaultProps = { ...defaultProps };
+
+export default BpkButtonPrimaryOnLight;

package/bpk-component-button/src/BpkButtonPrimaryOnLight.module.scss

@@ -0,0 +1,23 @@
+/*
+ * 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 '~bpk-mixins/index.scss';
+
+.bpk-button--primary-on-light {
+  @include bpk-button--primary-on-light;
+}

package/bpk-component-button/src/BpkButtonSecondary.js

@@ -1,43 +1,48 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _commonTypes = require("./common-types");
-var _BpkButtonBase = _interopRequireWildcard(require("./BpkButtonBase"));
-var _BpkButtonSecondaryModule = _interopRequireDefault(require("./BpkButtonSecondary.module.css"));
-const _excluded = ["className"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-const getClassName = (0, _BpkButtonBase.cssModules)(_BpkButtonSecondaryModule.default);
-const BpkButtonSecondary = props => {
-  const {
-      className
-    } = props,
-    rest = _objectWithoutProperties(props, _excluded);
+/*
+ * 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.
+ */
+
+/* @flow strict */
+
+import React from 'react';
+
+import { type Props, defaultProps, propTypes } from './common-types';
+import BpkButtonBase, { cssModules } from './BpkButtonBase';
+import STYLES from './BpkButtonSecondary.module.scss';
+
+const getClassName = cssModules(STYLES);
+
+const BpkButtonSecondary = (props: Props) => {
+  const { className, ...rest } = props;
+
   const classNames = [getClassName('bpk-button--secondary')];
+
   if (className) {
     classNames.push(className);
   }
   const classNamesFinal = classNames.join(' ');
+
   return (
-    /*#__PURE__*/
     // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
-    _react.default.createElement(_BpkButtonBase.default, _extends({
-      className: classNamesFinal
-    }, rest))
+    <BpkButtonBase className={classNamesFinal} {...rest} />
   );
 };
-BpkButtonSecondary.propTypes = _objectSpread({}, _commonTypes.propTypes);
-BpkButtonSecondary.defaultProps = _objectSpread({}, _commonTypes.defaultProps);
-var _default = BpkButtonSecondary;
-exports.default = _default;
+
+BpkButtonSecondary.propTypes = { ...propTypes };
+BpkButtonSecondary.defaultProps = { ...defaultProps };
+
+export default BpkButtonSecondary;

package/bpk-component-button/src/BpkButtonSecondary.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
 */
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-button--secondary{color:#161616;color:var(--bpk-button-secondary-text-color, #161616);background-color:#e0e3e5;background-color:var(--bpk-button-secondary-background-color, #e0e3e5)}.bpk-no-touch-support .bpk-button--secondary:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-button-secondary-hover-text-color, #161616);background-color:#c2c9cd;background-color:var(--bpk-button-secondary-hover-background-color, #c2c9cd)}:global(.bpk-no-touch-support) .bpk-button--secondary:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-button-secondary-hover-text-color, #161616);background-color:#c2c9cd;background-color:var(--bpk-button-secondary-hover-background-color, #c2c9cd)}.bpk-button--secondary:active{color:#161616;color:var(--bpk-button-secondary-active-text-color, #161616);background-color:#c2c9cd;background-color:var(--bpk-button-secondary-active-background-color, #c2c9cd)}.bpk-button--secondary:disabled{background-color:#e0e3e5;color:rgba(0,0,0,0.2)}
+@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-button--secondary{background-image:none;color:#0770e3;color:var(--bpk-button-secondary-text-color, #0770e3);background-color:#fff;background-color:var(--bpk-button-secondary-background-color, #fff);box-shadow:0 0 0 2px #dddde5 inset;box-shadow:0 0 0 2px var(--bpk-button-secondary-border-color, #dddde5) inset}.bpk-no-touch-support .bpk-button--secondary:hover:not(:active):not(:disabled){background-image:none;box-shadow:0 0 0 2px #0770e3 inset;color:#0770e3;color:var(--bpk-button-secondary-hover-text-color, #0770e3);background-color:#fff;background-color:var(--bpk-button-secondary-hover-background-color, #fff);box-shadow:0 0 0 2px #0770e3 inset;box-shadow:0 0 0 2px var(--bpk-button-secondary-hover-border-color, #0770e3) inset}:global(.bpk-no-touch-support) .bpk-button--secondary:hover:not(:active):not(:disabled){background-image:none;box-shadow:0 0 0 2px #0770e3 inset;color:#0770e3;color:var(--bpk-button-secondary-hover-text-color, #0770e3);background-color:#fff;background-color:var(--bpk-button-secondary-hover-background-color, #fff);box-shadow:0 0 0 2px #0770e3 inset;box-shadow:0 0 0 2px var(--bpk-button-secondary-hover-border-color, #0770e3) inset}.bpk-button--secondary:active{background-image:none;box-shadow:0 0 0 3px #084eb2 inset;color:#084eb2;color:var(--bpk-button-secondary-active-text-color, #084eb2);background-color:#fff;background-color:var(--bpk-button-secondary-active-background-color, #fff);box-shadow:0 0 0 3px #084eb2 inset;box-shadow:0 0 0 3px var(--bpk-button-secondary-active-border-color, #084eb2) inset}.bpk-button--secondary:disabled{background-color:#dddde5;background-image:none;color:#b2b2bf;box-shadow:none}

package/bpk-component-button/src/BpkButtonSecondary.module.scss

@@ -0,0 +1,23 @@
+/*
+ * 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 '~bpk-mixins/index.scss';
+
+.bpk-button--secondary {
+  @include bpk-button--secondary;
+}

package/bpk-component-button/src/BpkButtonSecondaryOnDark.js

@@ -1,43 +1,48 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _commonTypes = require("./common-types");
-var _BpkButtonBase = _interopRequireWildcard(require("./BpkButtonBase"));
-var _BpkButtonSecondaryOnDarkModule = _interopRequireDefault(require("./BpkButtonSecondaryOnDark.module.css"));
-const _excluded = ["className"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-const getClassName = (0, _BpkButtonBase.cssModules)(_BpkButtonSecondaryOnDarkModule.default);
-const BpkButtonSecondaryOnDark = props => {
-  const {
-      className
-    } = props,
-    rest = _objectWithoutProperties(props, _excluded);
+/*
+ * 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.
+ */
+
+/* @flow strict */
+
+import React from 'react';
+
+import { type Props, defaultProps, propTypes } from './common-types';
+import BpkButtonBase, { cssModules } from './BpkButtonBase';
+import STYLES from './BpkButtonSecondaryOnDark.module.scss';
+
+const getClassName = cssModules(STYLES);
+
+const BpkButtonSecondaryOnDark = (props: Props) => {
+  const { className, ...rest } = props;
+
   const classNames = [getClassName('bpk-button--secondary-on-dark')];
+
   if (className) {
     classNames.push(className);
   }
   const classNamesFinal = classNames.join(' ');
+
   return (
-    /*#__PURE__*/
     // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
-    _react.default.createElement(_BpkButtonBase.default, _extends({
-      className: classNamesFinal
-    }, rest))
+    <BpkButtonBase className={classNamesFinal} {...rest} />
   );
 };
-BpkButtonSecondaryOnDark.propTypes = _objectSpread({}, _commonTypes.propTypes);
-BpkButtonSecondaryOnDark.defaultProps = _objectSpread({}, _commonTypes.defaultProps);
-var _default = BpkButtonSecondaryOnDark;
-exports.default = _default;
+
+BpkButtonSecondaryOnDark.propTypes = { ...propTypes };
+BpkButtonSecondaryOnDark.defaultProps = { ...defaultProps };
+
+export default BpkButtonSecondaryOnDark;

package/bpk-component-button/src/BpkButtonSecondaryOnDark.module.scss

@@ -0,0 +1,23 @@
+/*
+ * 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 '~bpk-mixins/index.scss';
+
+.bpk-button--secondary-on-dark {
+  @include bpk-button--secondary-on-dark;
+}

package/bpk-component-button/src/common-types.js

@@ -1,11 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.propTypes = exports.defaultProps = void 0;
-var _propTypes = _interopRequireDefault(require("prop-types"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -24,19 +16,37 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * limitations under the License.
  */
 
+/* @flow strict */
+
+import { type Node } from 'react';
+import PropTypes from 'prop-types';
+
+export type Props = {
+  children: Node,
+  href: ?string,
+  className: ?string,
+  disabled: boolean,
+  onClick: ?(event: SyntheticEvent<>) => mixed,
+  submit: boolean,
+  large: boolean,
+  iconOnly: boolean,
+  blank: boolean,
+  rel: ?string,
+};
+
 const propTypes = {
-  children: _propTypes.default.node.isRequired,
-  href: _propTypes.default.string,
-  className: _propTypes.default.string,
-  disabled: _propTypes.default.bool,
-  onClick: _propTypes.default.func,
-  submit: _propTypes.default.bool,
-  large: _propTypes.default.bool,
-  iconOnly: _propTypes.default.bool,
-  blank: _propTypes.default.bool,
-  rel: _propTypes.default.string
+  children: PropTypes.node.isRequired,
+  href: PropTypes.string,
+  className: PropTypes.string,
+  disabled: PropTypes.bool,
+  onClick: PropTypes.func,
+  submit: PropTypes.bool,
+  large: PropTypes.bool,
+  iconOnly: PropTypes.bool,
+  blank: PropTypes.bool,
+  rel: PropTypes.string,
 };
-exports.propTypes = propTypes;
+
 const defaultProps = {
   href: null,
   className: null,
@@ -46,6 +56,7 @@ const defaultProps = {
   large: false,
   iconOnly: false,
   blank: false,
-  rel: null
+  rel: null,
 };
-exports.defaultProps = defaultProps;
+
+export { propTypes, defaultProps };