@skyscanner/backpack-web 25.4.0-alpha → 25.4.1

package/bpk-component-calendar/src/composeCalendar-test.tsx

@@ -1,163 +0,0 @@
-/*
- * 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 { render } from '@testing-library/react';
-
-import { weekDays, formatMonth, formatDateFull } from '../test-utils';
-
-import composeCalendar from './composeCalendar';
-
-const CalendarComponent = composeCalendar('Nav', 'Header', 'Grid', 'Date');
-
-const CustomCalendarComponent = composeCalendar(null, null, 'Grid', 'Date');
-
-const HeaderAndGridCalendar = composeCalendar('Nav', null, 'Grid', 'Date');
-
-describe('composeCalendar', () => {
-  it('should compose a nav, header, grid and date component correctly', () => {
-    const { asFragment } = render(
-      <CalendarComponent
-        id="myCalendar"
-        formatMonth={formatMonth}
-        formatDateFull={formatDateFull}
-        daysOfWeek={weekDays}
-        weekStartsOn={1}
-        changeMonthLabel="Change month"
-        previousMonthLabel="Go to previous month"
-        nextMonthLabel="Go to next month"
-        minDate={new Date(Date.UTC(2010, 1, 15))}
-        maxDate={new Date(Date.UTC(2010, 2, 15))}
-        month={new Date(Date.UTC(2010, 1, 15))}
-      />,
-    );
-    expect(asFragment()).toMatchSnapshot();
-  });
-
-  it('should render with custom className prop correctly', () => {
-    const { asFragment } = render(
-      <CalendarComponent
-        id="myCalendar"
-        formatMonth={formatMonth}
-        formatDateFull={formatDateFull}
-        daysOfWeek={weekDays}
-        weekStartsOn={1}
-        changeMonthLabel="Change month"
-        previousMonthLabel="Go to previous month"
-        nextMonthLabel="Go to next month"
-        minDate={new Date(Date.UTC(2010, 1, 15))}
-        maxDate={new Date(Date.UTC(2010, 2, 15))}
-        month={new Date(Date.UTC(2010, 1, 15))}
-        className="my-custom-class"
-      />,
-    );
-    expect(asFragment()).toMatchSnapshot();
-  });
-
-  it('should render with "fixedWidth" set to false', () => {
-    const { asFragment } = render(
-      <CalendarComponent
-        id="myCalendar"
-        formatMonth={formatMonth}
-        formatDateFull={formatDateFull}
-        daysOfWeek={weekDays}
-        weekStartsOn={1}
-        changeMonthLabel="Change month"
-        previousMonthLabel="Go to previous month"
-        nextMonthLabel="Go to next month"
-        minDate={new Date(Date.UTC(2010, 1, 15))}
-        maxDate={new Date(Date.UTC(2010, 2, 15))}
-        month={new Date(Date.UTC(2010, 1, 15))}
-        fixedWidth={false}
-      />,
-    );
-    expect(asFragment()).toMatchSnapshot();
-  });
-
-  it('should render without a nav or header element', () => {
-    const { asFragment } = render(
-      <CustomCalendarComponent
-        id="myCalendar"
-        formatMonth={formatMonth}
-        formatDateFull={formatDateFull}
-        daysOfWeek={weekDays}
-        weekStartsOn={1}
-        changeMonthLabel="Change month"
-        previousMonthLabel="Go to previous month"
-        nextMonthLabel="Go to next month"
-        minDate={new Date(Date.UTC(2010, 1, 15))}
-        maxDate={new Date(Date.UTC(2010, 2, 15))}
-        month={new Date(Date.UTC(2010, 1, 15))}
-      />,
-    );
-    expect(asFragment()).toMatchSnapshot();
-  });
-
-  it('should render without a header element', () => {
-    const { asFragment } = render(
-      <HeaderAndGridCalendar
-        id="myCalendar"
-        formatMonth={formatMonth}
-        formatDateFull={formatDateFull}
-        daysOfWeek={weekDays}
-        weekStartsOn={1}
-        changeMonthLabel="Change month"
-        previousMonthLabel="Go to previous month"
-        nextMonthLabel="Go to next month"
-        minDate={new Date(Date.UTC(2010, 1, 15))}
-        maxDate={new Date(Date.UTC(2010, 2, 15))}
-        month={new Date(Date.UTC(2010, 1, 15))}
-      />,
-    );
-    expect(asFragment()).toMatchSnapshot();
-  });
-
-  it('should pass props to their respective components', () => {
-    const PropsBasedCalendarComponent = composeCalendar(
-      (props) => props.name,
-      (props) => props.name,
-      (props) => (
-        <div>
-          <h1>{props.name}</h1>
-          <props.DateComponent {...props.dateProps} />
-        </div>
-      ),
-      (props) => props.name,
-    );
-
-    const { asFragment } = render(
-      <PropsBasedCalendarComponent
-        id="myCalendar"
-        formatMonth={formatMonth}
-        formatDateFull={formatDateFull}
-        daysOfWeek={weekDays}
-        weekStartsOn={1}
-        changeMonthLabel="Change month"
-        previousMonthLabel="Go to previous month"
-        nextMonthLabel="Go to next month"
-        minDate={new Date(Date.UTC(2010, 1, 15))}
-        maxDate={new Date(Date.UTC(2010, 2, 15))}
-        month={new Date(Date.UTC(2010, 1, 15))}
-        navProps={{ name: 'Nav' }}
-        headerProps={{ name: 'Header' }}
-        gridProps={{ name: 'Grid' }}
-        dateProps={{ name: 'Date' }}
-      />,
-    );
-    expect(asFragment()).toMatchSnapshot();
-  });
-});

package/bpk-component-calendar/src/composeCalendar.tsx

@@ -1,187 +0,0 @@
-/*
- * 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 type { ComponentType } from 'react';
-
-import { cssModules } from '../../bpk-react-utils';
-
-import { CALENDAR_SELECTION_TYPE } from './custom-proptypes';
-import type {
-  DaysOfWeek,
-  SelectionConfiguration,
-  DateModifiers,
-} from './custom-proptypes';
-import STYLES from './BpkCalendar.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-type Props = {
-  changeMonthLabel?: string | null;
-  daysOfWeek: DaysOfWeek;
-  formatDateFull: (date: Date) => Date | string;
-  formatMonth: (date: Date) => Date | string;
-  id: string;
-  maxDate: Date;
-  minDate: Date;
-  month: Date;
-  nextMonthLabel?: string | null;
-  previousMonthLabel?: string | null;
-  weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
-  className?: string | null;
-  dateModifiers?: DateModifiers;
-  fixedWidth?: boolean;
-  focusedDate?: Date | null;
-  markOutsideDays?: boolean;
-  markToday?: boolean;
-  onMonthChange?:
-    | ((
-        event: UIEvent,
-        { month, source }: { month: Date; source: string },
-      ) => void)
-    | null;
-  onDateClick?: ((date: Date) => void) | null;
-  onDateKeyDown?: ((event: KeyboardEvent) => void) | null;
-  preventKeyboardFocus?: boolean;
-  selectionConfiguration?: SelectionConfiguration;
-  gridClassName?: string | null;
-  weekDayKey?: string;
-  navProps?: {} | null;
-  headerProps?: {} | null;
-  gridProps?: {} | null;
-  dateProps?: {} | null;
-};
-
-const composeCalendar = (
-  Nav: ComponentType<any> | string | null,
-  GridHeader: ComponentType<any> | string | null,
-  Grid: ComponentType<any> | string,
-  CalendarDate: ComponentType<any> | string | null,
-) => {
-  const BpkCalendar = ({
-    changeMonthLabel = null,
-    className = null,
-    dateModifiers = {},
-    dateProps = {},
-    daysOfWeek,
-    fixedWidth = true,
-    focusedDate = null,
-    formatDateFull,
-    formatMonth,
-    gridClassName = null,
-    gridProps = {},
-    headerProps = {},
-    id,
-    markOutsideDays = true,
-    markToday = true,
-    maxDate,
-    minDate,
-    month,
-    navProps = {},
-    nextMonthLabel = null,
-    onDateClick = null,
-    onDateKeyDown = null,
-    onMonthChange = null,
-    preventKeyboardFocus = false,
-    previousMonthLabel = null,
-    selectionConfiguration = {
-      type: CALENDAR_SELECTION_TYPE.single,
-      date: null,
-    },
-    weekDayKey = 'nameAbbr',
-    weekStartsOn,
-  }: Props) => {
-    const classNames = [getClassName('bpk-calendar')];
-
-    if (className) {
-      classNames.push(className);
-    }
-    if (fixedWidth) {
-      classNames.push(getClassName('bpk-calendar--fixed'));
-    }
-
-    const headerClasses = [];
-    // If the Nav is present add `bpk-calendar__header` which
-    // adds spacing between the nav and header.
-    if (Nav) {
-      headerClasses.push(getClassName('bpk-calendar__header'));
-    }
-
-    const gridClasses = [];
-    // If the GridHeader is not present add `bpk-calendar__grid` which
-    // adds spacing between the nav and grid.
-    if (!GridHeader && Nav) {
-      gridClasses.push(getClassName('bpk-calendar__grid'));
-    }
-    if (gridClassName) {
-      gridClasses.push(gridClassName);
-    }
-
-    return (
-      <div className={classNames.join(' ')}>
-        {Nav && (
-          <Nav
-            changeMonthLabel={changeMonthLabel}
-            formatMonth={formatMonth}
-            id={`${id}__bpk_calendar_nav`}
-            maxDate={maxDate}
-            minDate={minDate}
-            month={month}
-            nextMonthLabel={nextMonthLabel}
-            onMonthChange={onMonthChange}
-            previousMonthLabel={previousMonthLabel}
-            {...navProps}
-          />
-        )}
-        {GridHeader && (
-          <GridHeader
-            daysOfWeek={daysOfWeek}
-            weekStartsOn={weekStartsOn}
-            weekDayKey={weekDayKey}
-            className={headerClasses.join(' ')}
-            {...headerProps}
-          />
-        )}
-        <Grid
-          DateComponent={CalendarDate}
-          dateModifiers={dateModifiers}
-          daysOfWeek={daysOfWeek}
-          formatDateFull={formatDateFull}
-          formatMonth={formatMonth}
-          month={month}
-          onDateClick={onDateClick}
-          onDateKeyDown={onDateKeyDown}
-          preventKeyboardFocus={preventKeyboardFocus}
-          weekStartsOn={weekStartsOn}
-          maxDate={maxDate}
-          minDate={minDate}
-          focusedDate={focusedDate}
-          markToday={markToday}
-          markOutsideDays={markOutsideDays}
-          className={gridClasses.join(' ')}
-          dateProps={dateProps}
-          selectionConfiguration={selectionConfiguration}
-          {...gridProps}
-        />
-      </div>
-    );
-  };
-
-  return BpkCalendar;
-};
-
-export default composeCalendar;

package/bpk-component-calendar/src/custom-proptypes.ts

@@ -1,52 +0,0 @@
-/*
- * 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 type { ReactElement } from 'react';
-
-export const CALENDAR_SELECTION_TYPE = {
-  single: 'single',
-  range: 'range',
-} as const;
-
-export type SelectionConfigurationSingle = {
-  type: typeof CALENDAR_SELECTION_TYPE.single;
-  date: Date | null;
-};
-
-export type SelectionConfigurationRange = {
-  type: typeof CALENDAR_SELECTION_TYPE.range;
-  startDate: Date | null;
-  endDate: Date | null;
-};
-
-export type SelectionConfiguration =
-  | SelectionConfigurationSingle
-  | SelectionConfigurationRange;
-
-export type WeekDay = {
-  name: string;
-  nameAbbr: string;
-  index: number;
-  isWeekend: boolean;
-  [key: string]: any;
-};
-
-export type WeekDayKey = string;
-export type DaysOfWeek = WeekDay[];
-export type DateModifiers = { [key: string]: Function };
-export type ReactComponent = string | ((props: any) => ReactElement);

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

@@ -1,229 +0,0 @@
-/*
- * 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 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';
-
-import type { DaysOfWeek } from './custom-proptypes';
-
-const ONE_MINUTE_IN_MS = 60 * 1000;
-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
-// to BRT (Brasilia) and type new Date(2018, 10, 4) on Safari's console.
-// It will return `Nov 03 2018 23:00:00` whereas Chrome and Firefox return `Nov 04 2018 01:00:00`.
-//
-// To go aroud this problem we're mostly avoiding date objects and using UTC when that's not
-// possible.
-
-function utc(year: number, month: number, date?: number) {
-  return new Date(Date.UTC(year, month, date));
-}
-
-function daysInMonth(year: number, month: number) {
-  // Gets the last day of the month specified
-  return new Date(year, month + 1, 0).getDate();
-}
-
-function dateAtStartOfDay(year: number, month: number, day?: number) {
-  const date = utc(year, month, day);
-  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);
-
-  // 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;
-}
-
-function addDay(year: number, month: number, day?: number) {
-  const date = utc(year, month, day);
-  date.setUTCDate(date.getUTCDate() + 1);
-  return [date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()];
-}
-
-function startOfWeek(
-  year: number,
-  month: number,
-  day: number,
-  weekStartsOn: number,
-) {
-  const date = utc(year, month, day);
-  const weekDay = date.getUTCDay();
-  const diff = (weekDay < weekStartsOn ? 7 : 0) + weekDay - weekStartsOn;
-  date.setUTCDate(date.getUTCDate() - diff);
-  return [date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()];
-}
-
-function getCalendarMonthWeeks(date: Date, weekStartsOn: number) {
-  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: DaysOfWeek) {
-  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: DaysOfWeek) {
-  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: DaysOfWeek, weekStartsOn: number) => {
-  // 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),
-  ];
-};
-
-/* Takes arbitrary dates and returns the beginning of the first and enf of the last month containing these dates  */
-function getMonthRange(from: Date, to: Date) {
-  return {
-    min: startOfMonth(from),
-    max: endOfMonth(to),
-  };
-}
-
-function getMonthsInRange(from: Date, to: Date) {
-  const { max, min } = getMonthRange(from, to);
-  let currentMonth = startOfMonth(from);
-  const monthsInRange = [];
-
-  while (isWithinRange(currentMonth, { start: min, end: max })) {
-    monthsInRange.push(currentMonth);
-    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: Date | null, minDate: Date, maxDate: Date) => {
-  if (!date) {
-    return minDate;
-  }
-  if (isWithinRange(date, { start: minDate, end: maxDate })) {
-    return date;
-  }
-  if (isBefore(date, minDate)) {
-    return minDate;
-  }
-  return maxDate;
-};
-
-const setMonthYear = (date: Date | null, newMonth: number, newYear: number) => {
-  const dateToUse = date || new Date(newYear, newMonth, 1);
-  return setYear(setMonth(dateToUse, newMonth), newYear);
-};
-
-const parseIsoDate = parseISO;
-const formatIsoDate = (date: Date) => format(date, 'yyyy-MM-dd');
-const formatIsoMonth = (date: 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-test.ts

@@ -1,36 +0,0 @@
-/*
- * 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 themeAttributes from './themeAttributes';
-
-describe('themeAttributes', () => {
-  it('should export the expected themeAttributes', () => {
-    expect(themeAttributes).toEqual([
-      'calendarDateTextColor',
-      'calendarDateTextHoverColor',
-      'calendarDateTextActiveColor',
-      'calendarDateTextFocusColor',
-      'calendarDateTextSelectedColor',
-      'calendarDateSelectedBackgroundColor',
-      'calendarDateFocusedBorderColor',
-      'calendarNudgerIconColor',
-      'calendarNudgerIconHoverColor',
-      'calendarNudgerIconActiveColor',
-    ]);
-  });
-});

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

@@ -1,30 +0,0 @@
-/*
- * 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.
- */
-
-export default [
-  'calendarDateTextColor',
-  'calendarDateTextHoverColor',
-  'calendarDateTextActiveColor',
-  'calendarDateTextFocusColor',
-  'calendarDateTextSelectedColor',
-  'calendarDateSelectedBackgroundColor',
-  'calendarDateFocusedBorderColor',
-  'calendarNudgerIconColor',
-  'calendarNudgerIconHoverColor',
-  'calendarNudgerIconActiveColor',
-];