@jetbrains/ring-ui 5.0.68 → 5.0.69

package/components/date-picker/date-picker.css

@@ -34,6 +34,26 @@
   &.inline {
     padding: 0;
   }
+
+  &.sizeS {
+    width: calc(unit * 12);
+  }
+
+  &.sizeM {
+    width: calc(unit * 30);
+  }
+
+  &.sizeL {
+    width: calc(unit * 50);
+  }
+
+  &.sizeFULL {
+    width: 100%;
+  }
+
+  &.sizeAUTO {
+    max-width: 100%;
+  }
 }
 
 .displayDate {
@@ -95,10 +115,11 @@
 }
 
 .anchor {
-  min-width: calc(unit * 30);
+  width: 100%;
   padding: 0 unit;
 
   text-align: start;
+  white-space: nowrap;
 
   @nest .inline & {
     min-width: initial;

package/components/date-picker/date-picker.d.ts

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import type { Locale } from 'date-fns';
 import Popup from '../popup/popup';
 import { DropdownAttrs } from '../dropdown/dropdown';
+import { Size } from '../input/input';
 import { DatePopupProps } from './date-popup';
 import { DateInputTranslations, DatePickerChange } from './consts';
 export interface DatePickerTranslations extends Partial<DateInputTranslations> {
@@ -26,6 +27,7 @@ export type DatePickerProps = Omit<DatePopupProps, 'translations' | 'parseDateIn
     rangePlaceholder: string;
     disabled?: boolean | null | undefined;
     parseDateInput: (input: string | null | undefined) => Date | null;
+    size?: Size;
 };
 /**
  * @name Date Picker
@@ -57,6 +59,7 @@ export default class DatePicker extends PureComponent<DatePickerProps> {
         maxDate: PropTypes.Requireable<NonNullable<string | number | Date | null | undefined>>;
         translations: PropTypes.Requireable<object>;
         locale: PropTypes.Requireable<object>;
+        size: PropTypes.Requireable<Size>;
     };
     static defaultProps: DatePickerProps;
     handleChange: (change: DatePickerChange | Date | null | undefined) => void;

package/components/date-picker/date-picker.js

@@ -16,6 +16,7 @@ import Dropdown from '../dropdown/dropdown';
 import Icon from '../icon';
 import Button from '../button/button';
 import Link from '../link/link';
+import { Size } from '../input/input';
 import DatePopup from './date-popup';
 import { dateType } from './consts';
 import styles from './date-picker.css';
@@ -66,7 +67,8 @@ export default class DatePicker extends PureComponent {
         minDate: dateType,
         maxDate: dateType,
         translations: PropTypes.object,
-        locale: PropTypes.object
+        locale: PropTypes.object,
+        size: PropTypes.oneOf(Object.values(Size))
     };
     static defaultProps = {
         className: '',
@@ -77,6 +79,7 @@ export default class DatePicker extends PureComponent {
         to: null,
         clear: false,
         inline: false,
+        size: Size.M,
         displayFormat: (date, locale) => (date ? formatDate(date, 'd MMM yyyy', { locale }) : ''),
         displayMonthFormat: (date, locale) => (date ? formatDate(date, 'd MMM', { locale }) : ''),
         displayDayFormat: (date, locale) => (date ? formatDate(date, 'd', { locale }) : ''),
@@ -202,7 +205,7 @@ export default class DatePicker extends PureComponent {
         </Button>);
         }
         const { className, popupClassName, clear, inline, dropdownProps, translations, ...datePopupProps } = this.props;
-        const classes = classNames(styles.datePicker, className, {
+        const classes = classNames(styles.datePicker, className, styles[`size${this.props.size}`], {
             [styles.inline]: inline
         });
         return (<Dropdown className={classes} anchor={inline

package/dist/_helpers/_rollupPluginBabelHelpers.js

@@ -1,4 +1,5 @@
 function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
   if (key in obj) {
     Object.defineProperty(obj, key, {
       value: value,
@@ -25,5 +26,19 @@ function _extends() {
   };
   return _extends.apply(this, arguments);
 }
+function _toPrimitive(input, hint) {
+  if (typeof input !== "object" || input === null) return input;
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (typeof res !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
+}
+function _toPropertyKey(arg) {
+  var key = _toPrimitive(arg, "string");
+  return typeof key === "symbol" ? key : String(key);
+}
 
 export { _defineProperty as _, _extends as a };

package/dist/_helpers/date-picker.js

@@ -1,3 +1,3 @@
-var modules_0c7b7d96 = {"unit":"8px","footer-height":"64px","breakpoint-small":"640px","breakpoint-middle":"960px","breakpoint-large":"1200px","extra-small-screen-media":"(max-width: 639px)","small-screen-media":"(min-width: 640px) and (max-width: 959px)","middle-screen-media":"(min-width: 960px) and (max-width: 1199px)","large-screen-media":"(min-width: 1200px)","cellSize":"24px","calHeight":"288px","calWidth":"296px","yearHeight":"32px","yearWidth":"48px","light":"light_rui_e0bd","clearfix":"clearfix_rui_e0bd","font":"font_rui_e0bd","font-lower":"font-lower_rui_e0bd font_rui_e0bd","font-smaller":"font-smaller_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","font-smaller-lower":"font-smaller-lower_rui_e0bd font-smaller_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","font-larger-lower":"font-larger-lower_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","font-larger":"font-larger_rui_e0bd font-larger-lower_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","thin-font":"thin-font_rui_e0bd","monospace-font":"monospace-font_rui_e0bd","ellipsis":"ellipsis_rui_e0bd","resetButton":"resetButton_rui_e0bd","container":"container_rui_e0bd","hoverable":"hoverable_rui_e0bd","datePicker":"datePicker_rui_e0bd","inline":"inline_rui_e0bd","displayDate":"displayDate_rui_e0bd","displayRange":"displayRange_rui_e0bd","clear":"clear_rui_e0bd","datePopup":"datePopup_rui_e0bd","filterWrapper":"filterWrapper_rui_e0bd filterWrapper_rui_531d","filter":"filter_rui_e0bd filter_rui_531d","calendarIcon":"calendarIcon_rui_e0bd","anchor":"anchor_rui_e0bd","anchorContent":"anchorContent_rui_e0bd","chevronDownIcon":"chevronDownIcon_rui_e0bd","fromInput":"fromInput_rui_e0bd","fromInputWithDivider":"fromInputWithDivider_rui_e0bd","toInput":"toInput_rui_e0bd","dateInput":"dateInput_rui_e0bd","timeInputWithDivider":"timeInputWithDivider_rui_e0bd","weekdays":"weekdays_rui_e0bd","weekday":"weekday_rui_e0bd","weekend":"weekend_rui_e0bd","calendar":"calendar_rui_e0bd","months":"months_rui_e0bd","days":"days_rui_e0bd","month":"month_rui_e0bd","monthTitle":"monthTitle_rui_e0bd","day":"day_rui_e0bd resetButton_rui_8bff","between":"between_rui_e0bd","activeBetween":"activeBetween_rui_e0bd","current":"current_rui_e0bd","active":"active_rui_e0bd","disabled":"disabled_rui_e0bd","from":"from_rui_e0bd","to":"to_rui_e0bd","Monday":"Monday_rui_e0bd","spread":"spread_rui_e0bd","activeSpread":"activeSpread_rui_e0bd","first":"first_rui_e0bd","Tuesday":"Tuesday_rui_e0bd","Friday":"Friday_rui_e0bd","Saturday":"Saturday_rui_e0bd","Sunday":"Sunday_rui_e0bd","empty":"empty_rui_e0bd","today":"today_rui_e0bd","year":"year_rui_e0bd hoverable_rui_e0bd resetButton_rui_8bff","monthNames":"monthNames_rui_e0bd","monthName":"monthName_rui_e0bd hoverable_rui_e0bd resetButton_rui_8bff","monthSlider":"monthSlider_rui_e0bd resetButton_rui_8bff","dragging":"dragging_rui_e0bd","range":"range_rui_e0bd","years":"years_rui_e0bd","currentYear":"currentYear_rui_e0bd"};
+var modules_0c7b7d96 = {"unit":"8px","footer-height":"64px","breakpoint-small":"640px","breakpoint-middle":"960px","breakpoint-large":"1200px","extra-small-screen-media":"(max-width: 639px)","small-screen-media":"(min-width: 640px) and (max-width: 959px)","middle-screen-media":"(min-width: 960px) and (max-width: 1199px)","large-screen-media":"(min-width: 1200px)","cellSize":"24px","calHeight":"288px","calWidth":"296px","yearHeight":"32px","yearWidth":"48px","light":"light_rui_e0bd","clearfix":"clearfix_rui_e0bd","font":"font_rui_e0bd","font-lower":"font-lower_rui_e0bd font_rui_e0bd","font-smaller":"font-smaller_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","font-smaller-lower":"font-smaller-lower_rui_e0bd font-smaller_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","font-larger-lower":"font-larger-lower_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","font-larger":"font-larger_rui_e0bd font-larger-lower_rui_e0bd font-lower_rui_e0bd font_rui_e0bd","thin-font":"thin-font_rui_e0bd","monospace-font":"monospace-font_rui_e0bd","ellipsis":"ellipsis_rui_e0bd","resetButton":"resetButton_rui_e0bd","container":"container_rui_e0bd","hoverable":"hoverable_rui_e0bd","datePicker":"datePicker_rui_e0bd","inline":"inline_rui_e0bd","sizeS":"sizeS_rui_e0bd","sizeM":"sizeM_rui_e0bd","sizeL":"sizeL_rui_e0bd","sizeFULL":"sizeFULL_rui_e0bd","sizeAUTO":"sizeAUTO_rui_e0bd","displayDate":"displayDate_rui_e0bd","displayRange":"displayRange_rui_e0bd","clear":"clear_rui_e0bd","datePopup":"datePopup_rui_e0bd","filterWrapper":"filterWrapper_rui_e0bd filterWrapper_rui_531d","filter":"filter_rui_e0bd filter_rui_531d","calendarIcon":"calendarIcon_rui_e0bd","anchor":"anchor_rui_e0bd","anchorContent":"anchorContent_rui_e0bd","chevronDownIcon":"chevronDownIcon_rui_e0bd","fromInput":"fromInput_rui_e0bd","fromInputWithDivider":"fromInputWithDivider_rui_e0bd","toInput":"toInput_rui_e0bd","dateInput":"dateInput_rui_e0bd","timeInputWithDivider":"timeInputWithDivider_rui_e0bd","weekdays":"weekdays_rui_e0bd","weekday":"weekday_rui_e0bd","weekend":"weekend_rui_e0bd","calendar":"calendar_rui_e0bd","months":"months_rui_e0bd","days":"days_rui_e0bd","month":"month_rui_e0bd","monthTitle":"monthTitle_rui_e0bd","day":"day_rui_e0bd resetButton_rui_8bff","between":"between_rui_e0bd","activeBetween":"activeBetween_rui_e0bd","current":"current_rui_e0bd","active":"active_rui_e0bd","disabled":"disabled_rui_e0bd","from":"from_rui_e0bd","to":"to_rui_e0bd","Monday":"Monday_rui_e0bd","spread":"spread_rui_e0bd","activeSpread":"activeSpread_rui_e0bd","first":"first_rui_e0bd","Tuesday":"Tuesday_rui_e0bd","Friday":"Friday_rui_e0bd","Saturday":"Saturday_rui_e0bd","Sunday":"Sunday_rui_e0bd","empty":"empty_rui_e0bd","today":"today_rui_e0bd","year":"year_rui_e0bd hoverable_rui_e0bd resetButton_rui_8bff","monthNames":"monthNames_rui_e0bd","monthName":"monthName_rui_e0bd hoverable_rui_e0bd resetButton_rui_8bff","monthSlider":"monthSlider_rui_e0bd resetButton_rui_8bff","dragging":"dragging_rui_e0bd","range":"range_rui_e0bd","years":"years_rui_e0bd","currentYear":"currentYear_rui_e0bd"};
 
 export { modules_0c7b7d96 as m };

package/dist/date-picker/date-picker.d.ts

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import type { Locale } from 'date-fns';
 import Popup from '../popup/popup';
 import { DropdownAttrs } from '../dropdown/dropdown';
+import { Size } from '../input/input';
 import { DatePopupProps } from './date-popup';
 import { DateInputTranslations, DatePickerChange } from './consts';
 export interface DatePickerTranslations extends Partial<DateInputTranslations> {
@@ -26,6 +27,7 @@ export type DatePickerProps = Omit<DatePopupProps, 'translations' | 'parseDateIn
     rangePlaceholder: string;
     disabled?: boolean | null | undefined;
     parseDateInput: (input: string | null | undefined) => Date | null;
+    size?: Size;
 };
 /**
  * @name Date Picker
@@ -57,6 +59,7 @@ export default class DatePicker extends PureComponent<DatePickerProps> {
         maxDate: PropTypes.Requireable<NonNullable<string | number | Date | null | undefined>>;
         translations: PropTypes.Requireable<object>;
         locale: PropTypes.Requireable<object>;
+        size: PropTypes.Requireable<Size>;
     };
     static defaultProps: DatePickerProps;
     handleChange: (change: DatePickerChange | Date | null | undefined) => void;

package/dist/date-picker/date-picker.js

@@ -17,6 +17,7 @@ import Dropdown from '../dropdown/dropdown.js';
 import Icon from '../icon/icon.js';
 import { Button } from '../button/button.js';
 import Link from '../link/link.js';
+import { Size } from '../input/input.js';
 import DatePopup from './date-popup.js';
 import { dateType } from './consts.js';
 import { m as modules_0c7b7d96 } from '../_helpers/date-picker.js';
@@ -48,6 +49,11 @@ import '../link/clickableLink.js';
 import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 import '../_helpers/link.js';
+import '@jetbrains/icons/close-12px';
+import '../global/prop-types.js';
+import '../global/composeRefs.js';
+import '../_helpers/input.js';
+import '../input/input-label.js';
 import 'date-fns/isAfter';
 import 'date-fns/isBefore';
 import 'date-fns/startOfDay';
@@ -77,12 +83,6 @@ import 'date-fns/isThisYear';
 import 'date-fns/setYear';
 import './weekdays.js';
 import 'date-fns/add';
-import '../input/input.js';
-import '@jetbrains/icons/close-12px';
-import '../global/prop-types.js';
-import '../global/composeRefs.js';
-import '../_helpers/input.js';
-import '../input/input-label.js';
 
 const PopupComponent = _ref => {
   let {
@@ -242,7 +242,7 @@ class DatePicker extends PureComponent {
       translations,
       ...datePopupProps
     } = this.props;
-    const classes = classNames(modules_0c7b7d96.datePicker, className, {
+    const classes = classNames(modules_0c7b7d96.datePicker, className, modules_0c7b7d96[`size${this.props.size}`], {
       [modules_0c7b7d96.inline]: inline
     });
     return /*#__PURE__*/React.createElement(Dropdown, _extends({
@@ -298,7 +298,8 @@ _defineProperty(DatePicker, "propTypes", {
   minDate: dateType,
   maxDate: dateType,
   translations: PropTypes.object,
-  locale: PropTypes.object
+  locale: PropTypes.object,
+  size: PropTypes.oneOf(Object.values(Size))
 });
 _defineProperty(DatePicker, "defaultProps", {
   className: '',
@@ -309,6 +310,7 @@ _defineProperty(DatePicker, "defaultProps", {
   to: null,
   clear: false,
   inline: false,
+  size: Size.M,
   displayFormat: (date, locale) => date ? format(date, 'd MMM yyyy', {
     locale
   }) : '',