Merge branch 'master' into 4179_search-a11y

packages/components/src/components/tag/_tag.scss

@@ -107,7 +107,7 @@
   }
 
   .#{$prefix}--tag--filter:focus > svg {
-    border: 2px solid $inverse-01;
+    box-shadow: inset 0 0 0 2px $inverse-focus-ui;
     border-radius: 50%;
   }
 

packages/react/src/components/DatePicker/DatePicker.js

@@ -10,10 +10,10 @@ import React, { Component } from 'react';
 import classNames from 'classnames';
 import flatpickr from 'flatpickr';
 import l10n from 'flatpickr/dist/l10n/index';
-import rangePlugin from 'flatpickr/dist/plugins/rangePlugin';
 import { settings } from 'carbon-components';
 import DatePickerInput from '../DatePickerInput';
 import carbonFlatpickrFixEventsPlugin from './plugins/fixEventsPlugin';
+import carbonFlatpickrRangePlugin from './plugins/rangePlugin';
 import { match, keys } from '../../internal/keyboard';
 
 const { prefix } = settings;
@@ -348,7 +348,7 @@ export default class DatePicker extends Component {
           maxDate: maxDate,
           plugins: [
             datePickerType === 'range'
-              ? new rangePlugin({ input: this.toInputField, position: 'left' })
+              ? new carbonFlatpickrRangePlugin({ input: this.toInputField })
               : () => {},
             carbonFlatpickrMonthSelectPlugin({
               selectorFlatpickrMonthYearContainer: '.flatpickr-current-month',

packages/react/src/components/DatePicker/plugins/rangePlugin.js

@@ -0,0 +1,15 @@
+import rangePlugin from 'flatpickr/dist/plugins/rangePlugin';
+
+/**
+ * @param {object} config Plugin configuration.
+ * @returns {Plugin} An extension of Flatpickr `rangePlugin` that does the following:
+ *   * Better ensures the calendar dropdown is always aligned to the `<input>` for the starting date.
+ *     Workaround for: https://github.com/flatpickr/flatpickr/issues/1944
+ */
+export default config => {
+  const factory = rangePlugin(Object.assign({ position: 'left' }, config));
+  return fp =>
+    Object.assign(factory(fp), {
+      onPreCalendarPosition() {},
+    });
+};