`; Added `padding-top` and `padding-bottom` to `.rrui__snackbar__text`). Added `action` and `close` parameters to ``. 0.14.135 / 06.05.2019 ==================== * Added `placement` to ``: "top", "left", "bottom", "right". * Renamed CSS variables: `--rrui-tooltip-y-visible` -> `--rrui-tooltip-visible-distance`, `--rrui-tooltip-y-hidden` -> `--rrui-tooltip-hidden-distance`. 0.14.133 / 25.04.2019 ==================== * Changed ``'s top positions: removed `margin-top` and added three CSS variables: ```css --rrui-tooltip-animation-duration : 120ms; --rrui-tooltip-y-visible : -0.4em; --rrui-tooltip-y-hidden : -0.1em; ``` 0.14.130 / 09.04.2019 ==================== * Added the missing `-webkit-appearance : none` on `.rrui__input-field`. * Added `background-color` to `.rrui__input-field`. * Added `icon` property to ``. * Changed `` design (incl. animation). 0.14.127 / 24.01.2019 ==================== * `--rrui-card-text-color` default value changed from `currentColor` to `--rrui-black-color` because `currentColor` had some issues in MS Edge (not in IE). * Removed `color: currentColor` from `.rrui__slideout-menu__item` (that was a weird CSS rule). 0.14.124 / 22.01.2019 ==================== * Removed `react-dnd` from the library because it's buggy and is no longer supported. Replaced with simple native HTML file drag-n-drop. * Multiple file upload/drop now passes an `Array` instead of an `DataTransferItemsList` or `FileList` to `onChange()`. 0.14.97 / 20.12.2018 ==================== * Fixed `` SVG path animation using 100% CPU for some reason. `` component got replaced for that, and the line thickness is now fixed compared of the older percentage value. Line thickness can be set as `.rrui__activity-indicator__arc { border-width: ... }`. 0.14.87 / 12.12.2018 ==================== * (CSS breaking change) Removed the default padding from `.rrui__date-picker .rrui__expandable__content` and added the default padding to `.DayPicker-wrapper`. Also changed the positioning of `.DayPicker-NavButton`s. Added a border to `.DayPicker-wrapper` when it's focused (accessibility). 0.14.84 / 12.12.2018 ==================== * Fixed `rrui__outline` CSS class across components. 0.14.83 / 11.12.2018 ==================== * Removed default `aria-haspopup` and `aria-label` attributes from ``: pass them manually if required. * Renamed `rrui__outline` to `rrui__outline--default`. `rrui__outline` is now always added to all focusable components and can be used to define custom "outline"-like styling (for example, via `box-shadow`). * Added `` component which sets `rrui__tabbing` CSS class on `document.body`. It can be used to only show outlines on buttons/links when the user is actually tabbing. It's still not considered a 100%-formally-correct solution because "screen readers" still emit all kinds of mouse events. It's more of an experimental feature. * Added `buttonAriaLabel` property to ``. 0.14.81 / 09.12.2018 ==================== * Added focus on `` upon expanding it. Added close `` on Escape. Added focus on `` upon collapsing the menu. 0.14.80 / 09.12.2018 ==================== * Renamed ``'s `contentLabel` to `ariaLabel`. `contentLabel` still works but is deprecated. * Added `togglerAriaHasPopup` property to ``. 0.14.79 / 07.12.2018 ==================== * Removed the recently added `showOutline()` function. Use `rrui__outline` CSS class directly to retain outlines. * `` now accepts `toggler`, `togglerAriaLabel` and `togglerClassName` properties. The older way of `toggler` being the first child is now deprecated. * ``'s `.rrui__file-upload__area` now has `tabIndex` property which is `0` by default (for accessibility), and pressing `Enter` or `Spacebar` triggers `click` event. `` and `` both wrap ``. * Some ARIA-related fixes. 0.14.76 / 07.12.2018 ==================== * A couple of `:focus` fixes (accessibility). * Added `showOutline(true)` function for not adding `outline: none` CSS rule to buttons, inputs and selects (some people prefer this). * Increased default `` width and height. Shouldn't break anyone's code because users of this library almost 100% re-define the menu button dimensions. * Fixed `` focusing on the toggler `` instead of the hidden ``. 0.14.51 / 08.10.2018 ==================== * (CSS breaking change) Introduced a list of "CSS variables" for components for easier customization. This may possibly cause a couple of small breaking changes to CSS: `color` property is now being explicitly set on components (e.g. `` options) instead of being not defined which could potentially overwrite someone's color if it was previously being inherited from a parent. Also, `` now has `background-color`, `color` and `font-size: inherit` set explicitly (previously wasn't set and was using defaults for these). Also `` box size changed from `unit * 2` to `0.9em`. Also renamed `--rrui-list-icon-margin` to `--rrui-list-icon-margin`. 0.14.42 / 06.10.2018 ==================== * (breaking change) ``'s `closeButton` was previously styled as `float: right` which resulted in multiline content for single-line notifications. Re-styled `closeButton` without `float` using `flex`. 0.14.38 / 29.09.2018 ==================== * (CSS breaking change) Refactored `` styles. * `` animation duration increased (added a new CSS variable for that). * `` now takes an optional `anchor` property which can be one of: `left`, `right`, `top`, `bottom`. * `` now takes an optional `fullscreen` boolean property. 0.14.35 / 27.09.2018 ==================== * Refactored menu icon component, and it's now exported as ``. * (breaking change) Removed `.rrui__menu-button-icon-x` class, use `.rrui__menu-icon` instead. 0.14.25 / 22.08.2018 ==================== * Removed `reset` property from ``. It's not required now. 0.14.13 / 14.08.2018 ==================== * Added `value` property to `` and renamed `onSelectItem` to `onChange`. `onSelectItem` property still works but is deprecated. * Added the currently selected item indication to `` (and the components using it like `` and ``): `.rrui__list__item--selected`. 0.14.10 / 28.07.2018 ==================== * `.rrui__file-upload` component now has two children: `.rrui__file-upload__area` and `.rrui__input-error`. This is unlikely to break existing code because `.rrui__input-error` is `display: none`, so if `error` is not passed then it doesn't matter much which CSS class is customized: `.rrui__file-upload` or `.rrui__file-upload__area`. * Renamed `` `action` property to `onChange`. `action` still works but is deprecated. * Added `` and ``. 0.14.7 / 27.07.2018 =================== * Reduced React requirements for most components (now >= 0.14) for `PureComponent`. * (breaking change) Renamed `SegmentedControl` to `Switcher` and `rrui__segmented-control__...` to `rrui__switcher__...`. 0.14.6 / 26.07.2018 =================== * Rewrote `` without using `` for older React support (>= 15.3.0 for `PureComponent` support). 0.14.4 / 22.07.2018 =================== * (could be a minor breaking change) `indicateInvalid` is now `true` by default, and is considered an "undocumented" feature. 0.14.0 / 20.07.2018 =================== * (breaking change) Changed how `` works: it is now just a wrapper for its `children`. If `` or `` are present then it creates a ``. Otherwise it just renders `children` (adding some props to them, like `onClick` and `onMouseDown`). * (breaking change) `` no longer receives `value` of type `String` — only an object of shape `{ content, type, component, ... }` is accepted. * (breaking change) Renamed `SegmentedControl` to `Switcher` and `rrui__segmented-control__...` to `rrui__switcher__...`. * (could be a minor breaking change) `indicateInvalid` is now `true` by default, and is considered an "undocumented" feature. 0.13.0 / 12.07.2018 =================== * (breaking change) React >= 16.3 is required ("React Portals" are used for ``, which requires React >= 16; `react-dnd@5` requires React >= 16.3). Still, components other than `` and `@DragAndDrop` can be used with older React. * (breaking change) `react-dnd` updated from version `2.x` to version `5.x`. * (breaking change) Some things got refactored so something might theoretically break. * (breaking change) `` changed the icon for SVG to a CSS-animated HTML. * (breaking change) Rewrote `` and split it into ``, `` and ``; their CSS structure got rewritten and CSS class names changed. Extracted `` into ``. Due to the rewrite of `` it may possibly be a breaking change for existing applications in some non-generic cases. * (breaking change) `` `toggler` property moved to `children` of ``. * (breaking change) Renamed `` to ``. * (breaking change) Renamed ``'s `concise` property to `icon`. * (breaking change) Renamed ``'s `maxItems` property to `scrollMaxItems`. * (breaking change) Renamed ``'s `autocompleteShowAll` property to `showAllMatchingOptions`. * (breaking change) `` `icon` can now only be a React component (not an element). `` `toggler` can now only be a React component (not an element). * (breaking change) `` `onToggle` property replaced with `onExpand` and `onCollapse`. * (breaking change) `` design changed. * (breaking change) ``'s `action` property is deprecated, use `onClick` instead. * (breaking change) `` now accepts `content` property instead of `text`, and `content` is now a `React.Element` instead of a function. * (breaking change) `` no longer accepts `email` and `password` properties. Use `type="..."` directly instead. * (breaking change) `.rrui__button--link` CSS class renamed to `.rrui__button-reset--link`. * (breaking change) `Select.Fullscreen.css` renamed to `Expandable.Fullscreen.css`. * (breaking change) `DatePicker.Fullscreen.css` merged into `Expandable.Fullscreen.css`. * `` now accepts `inputComponent` property. * Added `` component. 0.12.13 / 01.05.2018 =================== * (breaking change) ``: `autocomplete` now always renders only `` (not a button), and native `` is always rendered in a transparent overlay so that native select is activated on mobile devices when there's too much options (for better UX) and custom select is always activated on desktop (if no `touchstart` has been received). `.rrui__select__native-expanded` CSS class removed and replaced with `.rrui__select__native` (mostly the same). Removed `onFocus` property of ``. * (breaking change) `` no longer accepts both `label` and `placeholder`. 0.12.5 / 28.04.2018 =================== * (breaking change) `small-screen.css` file has been split into individual per-component files (see the updated README). * (breaking change) `` `icon` is now a React component instead of a React element, and there's a default one, and the `icon` is hidden by default via CSS (a developer must explicitly set `display: block` for `.rrui__date-picker__icon` in order for the `icon` to be visible), and also `.rrui__date-picker__icon` CSS class styling changed. * Fixed `` input focus upon expansion on mobile devices. * Fixed `` too many options rendered when collapsed. 0.12.0 / 23.04.2018 =================== * (breaking change) Introduced CSS variables which must be set before including the CSS files on a page (see the updated README). * (breaking change) `` now comes with default `margin-left` and `margin-right` (previously had no margins). And the `busy` indicator changed from a spinner to an underline. * (breaking change) `` now comes with negative `margin`. * (breaking change) On small screens (see `small-screen.css`) the "Close" cross for fullscreen `` is now on the bottom-right (not on the top-right). * (breaking change) On small screens (see `small-screen.css`) ``s and ``s now expand themselves to fullscreen even if inside ``s, and the expand animation changed from "dropdown" to "fade-in/scale". * (breaking change) Changed `` CSS styles (including `small-screen.css`): `.rrui__modal__content` class (which defines all CSS styles and animations for opening/closing) was renamed to `.rrui__modal__contents` (along with `rrui__modal__content--fullscreen` and `.rrui__modal__content-body`). `` now provides three child components: ``, `` and ``. Before `.rrui__modal__content-body` had `margin` — now that margin has been moved to these three new child components. Tweaked `` opening/closing animation on small screens (see `small-screen.css`). * (breaking change) ``'s `closeButton` property removed and replaced with `closeButtonIcon` property (which is for the icon, not for the button). `closeButtonIcon` is now either a `Component` (not `Element`) or `true` (which renders a default cross icon). * (breaking change) ``'s `closeButton` property removed and replaced with `closeButtonIcon` property (which is for the icon, not for the button). * (breaking change) ``'s `closeButton` property removed and replaced with `closeButtonIcon` property (which is for the icon, not for the button). * (breaking change) If someone was overriding `.rrui__close__icon` CSS styles: its `padding` was moved to `.rrui__close`. * (breaking change) `` CSS styles changed and it is now positioned in the left bottom corner of the screen (with some margin) instead of being in the middle on the bottom (without margin). * (breaking change) ``'s list of options (except `autocomplete`) has been moved up to cover the toggler button: added `margin-top` to `.rrui__select__options`. * (breaking change) ``'s `.rrui__select__option` side padding reduced a bit: changed `.rrui__select__option`'s `padding-left`/`padding-right` and `min-width`, `.rrui__select__options--left-aligned`'s `left`, `.rrui__select__options--right-aligned`'s `right` and `.rrui__select__options`'s `min-width`. * (breaking change) ``'s `.rrui__select__option` side padding changed a bit. * (breaking change) `.rrui__select--menu` is now `display: inline-block` by default. * (breaking change) `` layout and styling changed a bit, added `.rrui__switch__box`. * (breaking change) `` sizes changed. * (breaking change) `` was rewritten (the `` is no longer wrapped in a `

`). `

` now has default `height`. `linkDownload` property removed (pass `download` property directly instead). * (breaking change) `` now stretched to full width by default. * (breaking change) `` CSS changed: it now resides in the lower bottom corner. Hide animation time changed from `400` to `195`. `content` can now also be a React component taking `hide` property (a function that hides the notification). * (breaking change) `` now goes fullscreen. * (breaking change) `` no longer takes an `input` property. 0.11.0 / 20.04.2018 =================== * Migrated to new React 17 lifecycles (`componentWillReceiveProps` -> `getDerivedStateFromProps`) and new React 17 Context API. Still compatible with older versions of React. * Refactored `` and implemented `async getOptions()` for asynchronous autocomplete. * (breaking change) ``. Arrow CSS styles tweaked: `margin-top: 0.2em; margin-right: 0.4em; border-width: 0.35em 0.22em 0 0.22em;` (inside `style.css`). The `closeButton` property is now a `React.Component` (not `React.Element`). `closeAriaLabel` property renamed to `closeLabel`. `rrui__select__toggler` `height: 100%` removed. Added `line-height` rule to `.rrui__select__option` CSS class. `.rrui__select__option:hover` `background-color` tweaked from `#fbfdfd` to `#f7f7f7`. * (breaking change) `` `closeButtonLabel` property removed and replaced the "Close" button with a cross icon with `position: fixed` (changed the styles inside `style.css` and `small-screen.css`). The new property is `closeButton` and is a `React.Component` (not `React.Element`). * (breaking change) Changed `` design. * (breaking change) `` now doesn't take `router` property from context. Instead, `` now listens directly to `history` transitions. ``'s `.rrui__slideout-menu--shown` CSS class renamed to `.rrui__slideout-menu--expanded`. `` now has `.rrui__page--menu-overlay` CSS class added on menu expanded which adds a semi-transparent overlay. 0.10.28 / 26.02.2018 ==================== * Disabled "scroll into view" feature for `` in IE. 0.10.15 / 11.01.2018 ==================== * CSS has been split on per-component basis (not icluding `small-screen.css`) and is available in the `styles` folder of the package. 0.10.0 / 10.10.2017 =================== * (CSS breaking change) `.rrui__text-input__input` -> `.rrui__input-field` * (CSS breaking change) `.rrui__text-input__input--multiline` -> `.rrui__input-field--multiline` 0.9.1 / 20.09.2017 =================== (CSS breaking change) Refactored `` CSS class names: * `.rrui__select__selected--autocomplete` -> `.rrui__select__autocomplete` * `.rrui__select__selected` -> `.rrui__select__button` * `.rrui__select__selected--nothing` -> `.rrui__select__button--empty` * `.rrui__select__selected--expanded` -> `.rrui__select__button--expanded` * `.rrui__select__selected--disabled` -> `.rrui__select__button--disabled` * `.rrui__select__selected--invalid` -> `.rrui__select__button--invalid` (CSS breaking change) Focused input label CSS selector changed. From this: ```css /* Focused input label */ .rrui__text-input__input:focus + .rrui__input-label:not(.rrui__text-input__label--placeholder), .rrui__select__button:focus + .rrui__input-label, .rrui__select__autocomplete:focus + .rrui__input-label, .rrui__date-picker__input:focus + .rrui__input-label ``` To this: ```css /* Focused input label */ .rrui__input-element:focus + .rrui__input-label ``` And the floating label now floats to top always when the input is focused regardless of whether it's empty or not. So this: ```css .rrui__text-input__label--placeholder transform: ... ``` Changes into this: ```css .rrui__input-field:not(:focus) + .rrui__text-input__label--placeholder transform: ... ``` (CSS breaking change) ``'s autocomplete `` is now `.rrui__text-input__input`. (CSS breaking change) ``'s ``s have now `height` set. 0.8.55 / 18.09.2017 =================== * Added `` property which makes the `` not stretch to 100% width by making it `inline-block`. * (CSS breaking change) `` are now `inline-block` too (but I guess perhaps no one even used that property since it's `concise` which means "inline" to me). * Added `.rrui__select--menu` CSS class so `.rrui__select__options:not(.rrui__select__options--menu)` becomes just `.rrui__select__options` which simplifies the stylesheet. 0.8.22 / 27.07.2017 =================== * (CSS breaking change) `` CSS classes got refactored but it shouldn't break anyone's apps. 0.8.0 / 03.05.2017 =================== * (CSS breaking change) Removed vertical padding from the first and the last `` `

` options and moved it to `.rrui__select__options` `

` itself. So if someone customized `.rrui__select__options-list-item:first-child` and `.rrui__select__options-list-item:last-child` vertical padding then those padding customizations should be moved to `.rrui__select__options` itself. * (CSS breaking change) Added `.rrui__select__option:hover` and `.rrui__select__option--focused:hover` background color for better UX. 0.7.11 / 15.04.2017 =================== * Added `selectYearsIntoPast` and `selectYearsIntoFuture` to ``. * `` is now more strict while parsing keyboard input. 0.7.0 / 12.04.2017 ================== * (breaking change) Dropped inline styles in favour of the CSS stylesheet (seems more convenient and theoretically more performant). Including the CSS via `require()` is the recommended way now. * (breaking change) Changed the path to style from `/styles/react-responsive-ui.css` to just `style.css`. * (breaking change) `` has been rewritten and no longer accepts `items` and instead accepts `children`. And it's always `slideout` now. Renamed `Menu` to `CollapsibleMenu`. 0.6.4 / 11.04.2017 ================== * Dropped both `moment` and `date-fns` in favour of a custom date formatter and parser (to reduce bundle size) 0.6.0 / 10.04.2017 ================== Refactoring component styling to better match CSS grid styling (`.col-x`): * (breaking change) Now it stretches the inputs to full column width by default. Because everyone uses CSS grids today (like Bootstrap Grid). See `react-responsive-ui.css` diff for the change (a simple `width: 100%` rule). * (breaking change) Changed `

` and `` markup a bit: they're now wrapped in a `

` wrapper (and added `height: 100%` CSS rule for the contents). * `` now receives `className` parameter. * Added `stretch` flag for `

`s to stretch them to full width. * Added `floatingLabel` boolean flag for ``. 0.5.0 / 06.03.2017 =================== * (breaking change) Moved `position: relative` from inline styles to CSS for ``, ``, ``, ``. * (breaking change) Refactored CSS classes for `` and ``. * (breaking change) Refactored CSS classes for ``. * Fixed day clicking bug in `` on mobile devices. * Moved slideout menu styles to CSS classes `.rrui__slideout-menu`, `.rrui__slideout-menu--shown`, `.rrui__slideout-menu-list-item` and `.rrui__menu__item` 0.4.0 / 03.03.2017 =================== * (breaking change) `` now no longer takes `actions`, create the buttons manually instead. `title` property is gone too, use `

` instead. Changed `.rrui__modal__top-padding` and `.rrui__modal__bottom-padding` into `.rrui__modal__margin`. `cancel` property is gone, use `closeLabel` instead. Changed some styles for modal (see the relevant commit) * (breaking change) `

`'s `action` has been renamed to `submit`. * (might be a breaking change) Moved `

` option list styles from inline to `.rrui__select__options` 0.3.0 / 25.02.2017 =================== * (could be a breaking change) Moving `position: relative` from inline styles to the CSS file therefore if using an edited CSS file from older versions add `position: relative` for `.rrui__select` 0.2.14 / 07.02.2017 =================== * Added a custom `input` property for `` 0.2.11 / 06.02.2017 =================== * Added `.rrui__fixed-full-width` CSS class for self-adjusting the width of specific DOM elements when a modal opens 0.2.10 / 05.02.2017 =================== * Added `fullscreen` mode for `` * (breaking change) Refactoring `` (for better `fullscreen` support) 0.2.5 / 04.02.2017 ================== * (breaking change) Renamed `.rrui__text-input__label` to `.rrui__input-label` * `` can now have both a `placeholder` and a `label` * Added `label`s to `` and `` (analogous to text input) * (breaking change) Renamed `.rrui__text-input__error` to `.rrui__input-error` * (breaking change) Renamed `label` property of `` to `placeholer` * (breaking change) Renamed `.rrui__text-input__field` and `.rrui__text-input__input--single-line` to `.rrui__input` and `.rrui__input--multiline` 0.2.0 / 03.02.2017 ================== * (breaking change) Renamed `.rrui__text-input__field` to `.rrui__text-input__input`. `.rrui__text-input__field` now wraps `.rrui__text-input__input` and `.rrui__text-input__label`. This is done to be able to set `.rrui__text-input__field` exact height while also keeping `height: auto` for description and error message. * Dropped `description` property on `` 0.1.67 / 03.02.2017 =================== * Removed `--primary` and `--border` button flavours (use `className` manually instead since there are usually more than two kinds of buttons in an application UI) * Button contents are now a `

` and the button itself is not made `opacity: 0` during `busy` state but instead that contents `

` is * Refactoring floating label input 0.1.50 / 21.01.2017 =================== * Added drag'n'drop components 0.1.48 / 20.01.2017 =================== * (breaking change) Renamed `shown` property of `Modal` to `isOpen` * (breaking change) Renamed `.rrui__button__link` CSS class to `.rrui__button__button .rrui__button__button--link` * For "rich" components now not rendering static HTML fallback by default (unless `fallback` property is explicitly set to `true`) since it's a very exotic use case and therefore is not default behaviour now 0.1.27 / 07.01.2017 =================== * Added `` via `react-day-picker` and `moment` 0.1.25 / 30.12.2016 =================== * Added `className` and `style` properties to `` 0.1.22 / 24.12.2016 =================== * Fixed autocomplete up/down selection bug 0.1.19 / 20.12.2016 =================== * (breaking change) Renamed `.rrui__select__option--selected` CSS class to `.rrui__select__option--focused` * `` now automatically scrolls the options list down to the selected item and also while navigating with arrow keys 0.1.0 / 05.12.2016 ================== * Initial release.