From b61211d84102cb587a9b4476f5e5c4700adab3d5 Mon Sep 17 00:00:00 2001 From: Vince Picone Date: Thu, 21 Mar 2019 15:50:38 -0500 Subject: [PATCH] fix: deprecate the appendTo prop in date picker (#2062) * fix: deprecate the appendTo prop in date picker * fix: Add deprecation warning * fix: typos in warning --- src/components/DatePicker/DatePicker.js | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/src/components/DatePicker/DatePicker.js b/src/components/DatePicker/DatePicker.js index 97dfe7391e..b420abfcb8 100644 --- a/src/components/DatePicker/DatePicker.js +++ b/src/components/DatePicker/DatePicker.js @@ -12,9 +12,10 @@ import flatpickr from 'flatpickr'; import l10n from 'flatpickr/dist/l10n/index'; import rangePlugin from 'flatpickr/dist/plugins/rangePlugin'; import { settings } from 'carbon-components'; +import warning from 'warning'; import DatePickerInput from '../DatePickerInput'; import Icon from '../Icon'; -import { componentsX } from '../../internal/FeatureFlags'; +import { componentsX, breakingChangesX } from '../../internal/FeatureFlags'; const { prefix } = settings; @@ -251,10 +252,18 @@ export default class DatePicker extends Component { const onHook = (electedDates, dateStr, instance) => { this.updateClassNames(instance); }; - const appendToNode = - typeof appendTo === 'string' - ? document.querySelector(appendTo) - : appendTo; + + let appendToNode; + if (typeof appendTo === 'string' && !breakingChangesX) { + warning( + false, + `The DatePicker appendTo prop will be deprecated in Carbon X. + - If you were using appendTo for styling, consider using a className. + - If you were using appendTo for attaching to a specific DOM node, consider a React portal.` + ); + appendToNode = document.querySelector(appendTo); + } + // inputField ref might not be set in enzyme tests if (this.inputField) { this.cal = new flatpickr(this.inputField, {