diff --git a/CHANGELOG.md b/CHANGELOG.md index e69315a9431..1a4bc7170df 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ ## [`master`](https://github.com/elastic/eui/tree/master) - Added `sortBy` and `sortShift` props to `euiPaletteColorBlind()` for sorting along the color wheel ([#3387](https://github.com/elastic/eui/pull/3387)) +- Added `utcOffset` prop to `EuiSuperDatePicker` ([#3436](https://github.com/elastic/eui/pull/3436)) - Added `partition` key to `EuiChartThemeType` for Partition chart support ([#3387](https://github.com/elastic/eui/pull/3387)) - Updated `EuiImage`'s `caption` prop type from `string` to `ReactNode` ([#3387](https://github.com/elastic/eui/pull/3387)) diff --git a/src/components/date_picker/super_date_picker/date_popover/absolute_tab.tsx b/src/components/date_picker/super_date_picker/date_popover/absolute_tab.tsx index 3401e4e286a..57363b233aa 100644 --- a/src/components/date_picker/super_date_picker/date_popover/absolute_tab.tsx +++ b/src/components/date_picker/super_date_picker/date_popover/absolute_tab.tsx @@ -36,6 +36,7 @@ export interface EuiAbsoluteTabProps { onChange: EuiDatePopoverContentProps['onChange']; roundUp: boolean; position: 'start' | 'end'; + utcOffset?: number; } interface EuiAbsoluteTabState { @@ -106,37 +107,38 @@ export class EuiAbsoluteTab extends Component< }; render() { + const { dateFormat, timeFormat, locale, utcOffset } = this.props; + const { + valueAsMoment, + isTextInvalid, + textInputValue, + sentenceCasedPosition, + } = this.state; + return (
+ isInvalid={isTextInvalid} + error={isTextInvalid ? `Expected format ${dateFormat}` : undefined}> - {this.state.sentenceCasedPosition} date - - } + prepend={{sentenceCasedPosition} date} />
diff --git a/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx b/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx index e589753c278..12061f79046 100644 --- a/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx +++ b/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx @@ -49,6 +49,7 @@ export interface EuiDatePopoverButtonProps { roundUp?: boolean; timeFormat: string; value: string; + utcOffset?: number; } export const EuiDatePopoverButton: FunctionComponent< @@ -65,6 +66,7 @@ export const EuiDatePopoverButton: FunctionComponent< onChange, locale, dateFormat, + utcOffset, timeFormat, isOpen, onPopoverToggle, @@ -120,6 +122,7 @@ export const EuiDatePopoverButton: FunctionComponent< timeFormat={timeFormat} locale={locale} position={position} + utcOffset={utcOffset} /> ); diff --git a/src/components/date_picker/super_date_picker/date_popover/date_popover_content.tsx b/src/components/date_picker/super_date_picker/date_popover/date_popover_content.tsx index 31e8f86d5f5..008d3639765 100644 --- a/src/components/date_picker/super_date_picker/date_popover/date_popover_content.tsx +++ b/src/components/date_picker/super_date_picker/date_popover/date_popover_content.tsx @@ -45,6 +45,7 @@ export interface EuiDatePopoverContentProps { timeFormat: string; locale?: LocaleSpecifier; position: 'start' | 'end'; + utcOffset?: number; } export const EuiDatePopoverContent: FunctionComponent< @@ -57,6 +58,7 @@ export const EuiDatePopoverContent: FunctionComponent< timeFormat, locale, position, + utcOffset, }) => { const onTabClick: EuiTabbedContentProps['onTabClick'] = selectedTab => { switch (selectedTab.id) { @@ -84,6 +86,7 @@ export const EuiDatePopoverContent: FunctionComponent< onChange={onChange} roundUp={roundUp} position={position} + utcOffset={utcOffset} /> ), 'data-test-subj': 'superDatePickerAbsoluteTab', diff --git a/src/components/date_picker/super_date_picker/super_date_picker.tsx b/src/components/date_picker/super_date_picker/super_date_picker.tsx index 89553378878..91b8e16ab06 100644 --- a/src/components/date_picker/super_date_picker/super_date_picker.tsx +++ b/src/components/date_picker/super_date_picker/super_date_picker.tsx @@ -119,6 +119,7 @@ export type EuiSuperDatePickerProps = CommonProps & { * Specifies the formatted used when displaying times */ timeFormat: string; + utcOffset?: number; }; interface EuiSuperDatePickerState { @@ -359,6 +360,7 @@ export class EuiSuperDatePicker extends Component< locale, refreshInterval, timeFormat, + utcOffset, } = this.props; if (isAutoRefreshOnly) { @@ -425,6 +427,7 @@ export class EuiSuperDatePicker extends Component< onChange={this.setStart} value={start} dateFormat={dateFormat} + utcOffset={utcOffset} timeFormat={timeFormat} locale={locale || contextLocale} isOpen={this.state.isStartDatePopoverOpen} @@ -441,6 +444,7 @@ export class EuiSuperDatePicker extends Component< onChange={this.setEnd} value={end} dateFormat={dateFormat} + utcOffset={utcOffset} timeFormat={timeFormat} locale={locale || contextLocale} roundUp