@skyscanner/backpack-web 9.1.0-alpha.1 → 9.2.0-beta.2

package/bpk-component-calendar/src/date-utils.js

@@ -1,170 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "addDays", {
-  enumerable: true,
-  get: function () {
-    return _addDays.default;
-  }
-});
-Object.defineProperty(exports, "addMonths", {
-  enumerable: true,
-  get: function () {
-    return _addMonths.default;
-  }
-});
-exports.dateToBoundaries = void 0;
-exports.daysInMonth = daysInMonth;
-Object.defineProperty(exports, "differenceInCalendarMonths", {
-  enumerable: true,
-  get: function () {
-    return _differenceInCalendarMonths.default;
-  }
-});
-Object.defineProperty(exports, "endOfMonth", {
-  enumerable: true,
-  get: function () {
-    return _endOfMonth.default;
-  }
-});
-Object.defineProperty(exports, "format", {
-  enumerable: true,
-  get: function () {
-    return _format.default;
-  }
-});
-exports.formatIsoMonth = exports.formatIsoDate = void 0;
-exports.getCalendarMonthWeeks = getCalendarMonthWeeks;
-Object.defineProperty(exports, "getDay", {
-  enumerable: true,
-  get: function () {
-    return _getDay.default;
-  }
-});
-exports.getFirstDayOfWeekend = getFirstDayOfWeekend;
-exports.getLastDayOfWeekend = getLastDayOfWeekend;
-exports.getMonthRange = getMonthRange;
-exports.getMonthsInRange = getMonthsInRange;
-Object.defineProperty(exports, "isAfter", {
-  enumerable: true,
-  get: function () {
-    return _isAfter.default;
-  }
-});
-Object.defineProperty(exports, "isBefore", {
-  enumerable: true,
-  get: function () {
-    return _isBefore.default;
-  }
-});
-Object.defineProperty(exports, "isSameDay", {
-  enumerable: true,
-  get: function () {
-    return _isSameDay.default;
-  }
-});
-Object.defineProperty(exports, "isSameMonth", {
-  enumerable: true,
-  get: function () {
-    return _isSameMonth.default;
-  }
-});
-Object.defineProperty(exports, "isSameWeek", {
-  enumerable: true,
-  get: function () {
-    return _isSameWeek.default;
-  }
-});
-Object.defineProperty(exports, "isSaturday", {
-  enumerable: true,
-  get: function () {
-    return _isSaturday.default;
-  }
-});
-Object.defineProperty(exports, "isSunday", {
-  enumerable: true,
-  get: function () {
-    return _isSunday.default;
-  }
-});
-Object.defineProperty(exports, "isToday", {
-  enumerable: true,
-  get: function () {
-    return _isToday.default;
-  }
-});
-Object.defineProperty(exports, "isWithinRange", {
-  enumerable: true,
-  get: function () {
-    return _isWithinInterval.default;
-  }
-});
-Object.defineProperty(exports, "lastDayOfMonth", {
-  enumerable: true,
-  get: function () {
-    return _lastDayOfMonth.default;
-  }
-});
-exports.setMonthYear = exports.parseIsoDate = exports.orderDaysOfWeek = void 0;
-Object.defineProperty(exports, "startOfDay", {
-  enumerable: true,
-  get: function () {
-    return _startOfDay.default;
-  }
-});
-Object.defineProperty(exports, "startOfMonth", {
-  enumerable: true,
-  get: function () {
-    return _startOfMonth.default;
-  }
-});
-
-var _startOfMonth = _interopRequireDefault(require("date-fns/startOfMonth"));
-
-var _endOfMonth = _interopRequireDefault(require("date-fns/endOfMonth"));
-
-var _lastDayOfMonth = _interopRequireDefault(require("date-fns/lastDayOfMonth"));
-
-var _getDay = _interopRequireDefault(require("date-fns/getDay"));
-
-var _isWithinInterval = _interopRequireDefault(require("date-fns/isWithinInterval"));
-
-var _isToday = _interopRequireDefault(require("date-fns/isToday"));
-
-var _isSaturday = _interopRequireDefault(require("date-fns/isSaturday"));
-
-var _isSunday = _interopRequireDefault(require("date-fns/isSunday"));
-
-var _isSameDay = _interopRequireDefault(require("date-fns/isSameDay"));
-
-var _isSameWeek = _interopRequireDefault(require("date-fns/isSameWeek"));
-
-var _isSameMonth = _interopRequireDefault(require("date-fns/isSameMonth"));
-
-var _isBefore = _interopRequireDefault(require("date-fns/isBefore"));
-
-var _isAfter = _interopRequireDefault(require("date-fns/isAfter"));
-
-var _differenceInCalendarMonths = _interopRequireDefault(require("date-fns/differenceInCalendarMonths"));
-
-var _addDays = _interopRequireDefault(require("date-fns/addDays"));
-
-var _addMonths = _interopRequireDefault(require("date-fns/addMonths"));
-
-var _setMonth = _interopRequireDefault(require("date-fns/setMonth"));
-
-var _setYear = _interopRequireDefault(require("date-fns/setYear"));
-
-var _startOfDay = _interopRequireDefault(require("date-fns/startOfDay"));
-
-var _parseISO = _interopRequireDefault(require("date-fns/parseISO"));
-
-var _format = _interopRequireDefault(require("date-fns/format"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -182,8 +15,33 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
+import startOfMonth from 'date-fns/startOfMonth';
+import endOfMonth from 'date-fns/endOfMonth';
+import lastDayOfMonth from 'date-fns/lastDayOfMonth';
+import getDay from 'date-fns/getDay';
+import isWithinRange from 'date-fns/isWithinInterval';
+import isToday from 'date-fns/isToday';
+import isSaturday from 'date-fns/isSaturday';
+import isSunday from 'date-fns/isSunday';
+import isSameDay from 'date-fns/isSameDay';
+import isSameWeek from 'date-fns/isSameWeek';
+import isSameMonth from 'date-fns/isSameMonth';
+import isBefore from 'date-fns/isBefore';
+import isAfter from 'date-fns/isAfter';
+import differenceInCalendarMonths from 'date-fns/differenceInCalendarMonths';
+import addDays from 'date-fns/addDays';
+import addMonths from 'date-fns/addMonths';
+import setMonth from 'date-fns/setMonth';
+import setYear from 'date-fns/setYear';
+import startOfDay from 'date-fns/startOfDay';
+import parseISO from 'date-fns/parseISO';
+import format from 'date-fns/format';
+
 const ONE_MINUTE_IN_MS = 60 * 1000;
-const ONE_HOUR_IN_MS = 60 * ONE_MINUTE_IN_MS; // TODO: Update to use date-fns functions.
+const ONE_HOUR_IN_MS = 60 * ONE_MINUTE_IN_MS;
+
+// TODO: Update to use date-fns functions.
 // see: https://github.com/date-fns/date-fns/issues/571 and https://bugs.webkit.org/show_bug.cgi?id=188001
 //
 // Safari has a problem with DST when the transition occurrs during midnight. To test set your timezone
@@ -204,16 +62,17 @@ function daysInMonth(year, month) {
 
 function dateAtStartOfDay(year, month, day) {
   const date = utc(year, month, day);
-  const tzOffset = date.getTimezoneOffset(); // Date is utc so we add/subtract the timezone hours.
+  const tzOffset = date.getTimezoneOffset();
+
+  // Date is utc so we add/subtract the timezone hours.
   // Using setTime is consistent on every browser so we have the same result everywhere.
+  date.setTime(date.getTime() + tzOffset * ONE_MINUTE_IN_MS);
 
-  date.setTime(date.getTime() + tzOffset * ONE_MINUTE_IN_MS); // Bug in Safari that only occurs when the transition from/to DST is during midnight (e.g. Brazil and Chile).
+  // Bug in Safari that only occurs when the transition from/to DST is during midnight (e.g. Brazil and Chile).
   // We want the exact day provided in the arguments so we adjust accordingly.
-
   if (day !== date.getDate() && date.getHours() === 23) {
     date.setTime(date.getTime() + ONE_HOUR_IN_MS);
   }
-
   return date;
 }
 
@@ -232,121 +91,132 @@ function startOfWeek(year, month, day, weekStartsOn) {
 }
 
 function getCalendarMonthWeeks(date, weekStartsOn) {
-  let [year, month, day] = startOfWeek(date.getFullYear(), date.getMonth(), 1, weekStartsOn);
+  let [year, month, day] = startOfWeek(
+    date.getFullYear(),
+    date.getMonth(),
+    1,
+    weekStartsOn,
+  );
+
   const weeksInMonth = [];
 
   for (let i = 0; i < 6; i += 1) {
     const currWeek = [];
-
     for (let j = 0; j < 7; j += 1) {
       currWeek.push(dateAtStartOfDay(year, month, day));
       [year, month, day] = addDay(year, month, day);
     }
-
     weeksInMonth.push(currWeek);
   }
-
   return weeksInMonth;
 }
 
 function getLastDayOfWeekend(daysOfWeek) {
-  const weekend = daysOfWeek.map(day => day.isWeekend);
+  const weekend = daysOfWeek.map((day) => day.isWeekend);
 
   if (weekend[0] && weekend[6]) {
     // weekend stretches over turn the of the week
     return daysOfWeek[weekend.indexOf(false) - 1].index;
   }
-
   return daysOfWeek[weekend.lastIndexOf(true)].index;
 }
 
 function getFirstDayOfWeekend(daysOfWeek) {
-  const weekend = daysOfWeek.map(day => day.isWeekend);
+  const weekend = daysOfWeek.map((day) => day.isWeekend);
 
   if (weekend[0] && weekend[6]) {
     // weekend stretches over turn the of the week
     return daysOfWeek[weekend.lastIndexOf(false) + 1].index;
   }
-
   return daysOfWeek[weekend.indexOf(true)].index;
 }
 
 const orderDaysOfWeek = (daysOfWeek, weekStartsOn) => {
   // Sorted in [sun, mon, ..., sat]
-  const sortedDaysOfWeek = daysOfWeek.slice().sort((a, b) => a.index - b.index); // Ordered according to weekStartsOn, e.g. [mon, tue, ..., sun]
-
-  return [...sortedDaysOfWeek.slice(weekStartsOn), ...sortedDaysOfWeek.slice(0, weekStartsOn)];
+  const sortedDaysOfWeek = daysOfWeek.slice().sort((a, b) => a.index - b.index);
+  // Ordered according to weekStartsOn, e.g. [mon, tue, ..., sun]
+  return [
+    ...sortedDaysOfWeek.slice(weekStartsOn),
+    ...sortedDaysOfWeek.slice(0, weekStartsOn),
+  ];
 };
-/* Takes arbitrary dates and returns the beginning of the first and enf of the last month containing these dates  */
-
-
-exports.orderDaysOfWeek = orderDaysOfWeek;
 
+/* Takes arbitrary dates and returns the beginning of the first and enf of the last month containing these dates  */
 function getMonthRange(from, to) {
   return {
-    min: (0, _startOfMonth.default)(from),
-    max: (0, _endOfMonth.default)(to)
+    min: startOfMonth(from),
+    max: endOfMonth(to),
   };
 }
 
 function getMonthsInRange(from, to) {
-  const {
-    max,
-    min
-  } = getMonthRange(from, to);
-  let currentMonth = (0, _startOfMonth.default)(from);
+  const { max, min } = getMonthRange(from, to);
+  let currentMonth = startOfMonth(from);
   const monthsInRange = [];
 
-  while ((0, _isWithinInterval.default)(currentMonth, {
-    start: min,
-    end: max
-  })) {
+  while (isWithinRange(currentMonth, { start: min, end: max })) {
     monthsInRange.push(currentMonth);
-    currentMonth = (0, _addMonths.default)(currentMonth, 1);
+    currentMonth = addMonths(currentMonth, 1);
   }
 
   return monthsInRange;
 }
+
 /*
 Adjusts a date, if necessary, to fit within a range.
 If date passed in is null, it'll return the minimum date.
 */
-
-
 const dateToBoundaries = (date, minDate, maxDate) => {
   if (!date) {
     return minDate;
   }
-
-  if ((0, _isWithinInterval.default)(date, {
-    start: minDate,
-    end: maxDate
-  })) {
+  if (isWithinRange(date, { start: minDate, end: maxDate })) {
     return date;
   }
-
-  if ((0, _isBefore.default)(date, minDate)) {
+  if (isBefore(date, minDate)) {
     return minDate;
   }
-
   return maxDate;
 };
 
-exports.dateToBoundaries = dateToBoundaries;
-
 const setMonthYear = (date, newMonth, newYear) => {
   const dateToUse = date || new Date(newYear, newMonth, 1);
-  return (0, _setYear.default)((0, _setMonth.default)(dateToUse, newMonth), newYear);
+  return setYear(setMonth(dateToUse, newMonth), newYear);
 };
 
-exports.setMonthYear = setMonthYear;
-const parseIsoDate = _parseISO.default;
-exports.parseIsoDate = parseIsoDate;
-
-const formatIsoDate = date => (0, _format.default)(date, 'yyyy-MM-dd');
-
-exports.formatIsoDate = formatIsoDate;
-
-const formatIsoMonth = date => (0, _format.default)(date, 'yyyy-MM');
-
-exports.formatIsoMonth = formatIsoMonth;
+const parseIsoDate = parseISO;
+const formatIsoDate = (date) => format(date, 'yyyy-MM-dd');
+const formatIsoMonth = (date) => format(date, 'yyyy-MM');
+
+export {
+  getCalendarMonthWeeks,
+  getFirstDayOfWeekend,
+  getLastDayOfWeekend,
+  getMonthsInRange,
+  getMonthRange,
+  getDay,
+  dateToBoundaries,
+  isWithinRange,
+  isSaturday,
+  isSunday,
+  isToday,
+  isSameDay,
+  isSameWeek,
+  isSameMonth,
+  isBefore,
+  isAfter,
+  differenceInCalendarMonths,
+  addMonths,
+  addDays,
+  orderDaysOfWeek,
+  setMonthYear,
+  startOfMonth,
+  lastDayOfMonth,
+  startOfDay,
+  format,
+  daysInMonth,
+  formatIsoDate,
+  formatIsoMonth,
+  parseIsoDate,
+  endOfMonth,
+};

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

@@ -1,10 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -22,5 +15,16 @@ exports.default = void 0;
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-var _default = ['calendarDateTextColor', 'calendarDateTextHoverColor', 'calendarDateTextActiveColor', 'calendarDateTextFocusColor', 'calendarDateTextSelectedColor', 'calendarDateSelectedBackgroundColor', 'calendarDateFocusedBorderColor', 'calendarNudgerIconColor', 'calendarNudgerIconHoverColor', 'calendarNudgerIconActiveColor'];
-exports.default = _default;
+
+export default [
+  'calendarDateTextColor',
+  'calendarDateTextHoverColor',
+  'calendarDateTextActiveColor',
+  'calendarDateTextFocusColor',
+  'calendarDateTextSelectedColor',
+  'calendarDateSelectedBackgroundColor',
+  'calendarDateFocusedBorderColor',
+  'calendarNudgerIconColor',
+  'calendarNudgerIconHoverColor',
+  'calendarNudgerIconActiveColor',
+];

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

@@ -1,12 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.isTransitionEndSupported = exports.getTransformStyles = exports.getCalendarGridWidth = void 0;
-
-var _base = require("@skyscanner/bpk-foundations-web/tokens/base.common");
-
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -24,46 +15,47 @@ var _base = require("@skyscanner/bpk-foundations-web/tokens/base.common");
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
+import {
+  calendarDaySize,
+  calendarDaySpacing,
+} from '@skyscanner/bpk-foundations-web/tokens/base.es6';
+
 const CSS_UNIT_REGEX = /(^[+-]?(?:\d*\.)?\d+)(.+)/i;
 
-const splitToken = value => {
+const splitToken = (value) => {
   const match = value.match(CSS_UNIT_REGEX);
-
   if (!match) {
-    throw new Error(`Invalid token value. Expecting a valid css unit, got ${value}`);
+    throw new Error(
+      `Invalid token value. Expecting a valid css unit, got ${value}`,
+    );
   }
-
   const [_, val, unit] = match; // eslint-disable-line no-unused-vars
-
   return [parseFloat(val), unit];
 };
 
-const getCalendarGridWidth = (multiplier = 1) => {
-  const [sizeValue, sizeUnit] = splitToken(_base.calendarDaySize);
-  const [spacingValue, spacingUnit] = splitToken(_base.calendarDaySpacing);
+export const getCalendarGridWidth = (multiplier = 1) => {
+  const [sizeValue, sizeUnit] = splitToken(calendarDaySize);
+  const [spacingValue, spacingUnit] = splitToken(calendarDaySpacing);
 
   if (sizeUnit !== spacingUnit) {
-    throw new Error(`'calendarDaySize' and 'calendarDaySpacing' must use the same unit. Got ${sizeUnit} and ${spacingUnit}`);
+    throw new Error(
+      `'calendarDaySize' and 'calendarDaySpacing' must use the same unit. Got ${sizeUnit} and ${spacingUnit}`,
+    );
   }
-
   const width = multiplier * (7 * (sizeValue + 2 * spacingValue));
   return `${width}${sizeUnit}`;
 };
 
-exports.getCalendarGridWidth = getCalendarGridWidth;
-
-const getTransformStyles = transformValue => {
+export const getTransformStyles = (transformValue) => {
   const transform = `translateX(${transformValue})`;
   return {
     transform,
     msTransform: transform,
     MozTransform: transform,
-    WebkitTransform: transform
+    WebkitTransform: transform,
   };
 };
 
-exports.getTransformStyles = getTransformStyles;
-
-const isTransitionEndSupported = () => !!(typeof window !== 'undefined' && 'TransitionEvent' in window);
-
-exports.isTransitionEndSupported = isTransitionEndSupported;
+export const isTransitionEndSupported = () =>
+  !!(typeof window !== 'undefined' && 'TransitionEvent' in window);