5.2.0 (2023-08-26)
- AutocompleteField: incorrect typing for object results (7a31bf3)
- CheckboxSetField: missing
aria-describedby
for helper text (9aa0361) - NecessityIndicator: wrong theme variable reference (3f5ebf7)
- RadioSetField: missing
aria-describedby
for helper text (396cddb) - remove
DateField
temporarily due to build issues with @mui/x-date-pickers (a68547a)
- add support for system theme detection (cfee60b)
- improvements to theme configuration and integration with Storybook dark mode toggle (df23f07)
5.1.0 (2023-08-03)
- AutocompleteField: add
load
prop for an async callback to load suggestions (ac1d9ba)
5.0.0 (2023-08-03)
Main branch release of beta.4
5.0.0-beta.4 (2023-08-03)
- add LinkList, TextLink, ConfirmButton, and CloseButton from 5.0-alpha (62f574d)
5.0.0-beta.3 (2023-08-03)
- read only state not supported by multiple components (e2c99cf)
5.0.0-beta.2 (2023-07-28)
- clipping issues for focus indicators on multiple components (9a1ab32)
- FormField: propagate error state down to MUI (e937cec)
- OhioStateNavbar: links are not typed (d3956f5)
- add new
Admonition
(d12e953) - add the full brand color palette (1f96f93)
- refactor Ohio State brand components into MUI (4016acc)
- TextField: add
autoFocus
andtype
props (ba8d953)
5.0.0-beta.1 (2023-07-26)
- Dropped use of TailwindCSS in favor of Material UI 5. This removes redundant components (Box, Stack, Text, etc) and introduces a TSS styling system to replace the previous CSS bundling. Form components have been refactored to take advantage of new MUI base fields and several components have been introduced to wrap MUI components to be always-accessible. Components that are not an immediate need for the Office of Research applications (e.g. Interview, Listicle) have been dropped from the beta. (54efe9f)
5.0.0-alpha.23 (2023-07-07)
- add
Prose
component that applies Tailwind Typography to content (14e6cbf) - Admonition: add style system prop support (ed8318f)
5.0.0-alpha.22 (2023-05-28)
- ComboBoxField: use string over key for value types (be0c34a)
- docs: add forced rerender of uncontrolled form components for a form's
onReset
(753b53f), closes #59 - Icon:
aria-label
not propagating down to the DOM attributes (14aacfa) - NumberField: use larger click areas for increment/decrement buttons (0f42e9b)
- polymorphics incompatible with components with
as
props (4536326), closes #83 - ProgressBar: incompatibility with React Aria upgrade (9502118)
- RadioIcon:
className
causes built-in styles to be dropped (80bde26) - SelectField: disabled state not propagated down to the
Interactive
(37665be) - state not correctly passed down for checkbox and radio sets (7d30870), closes #50
- SwitchIcon:
className
causes built-in styles to be dropped (02ffb50)
- add
LazyLoaded
component from UI 4 (061c69e) - add
SplitButton
component (26379ff) - add more flexible
MenuButton
component to replace oldMenu
(67dd24d)
5.0.0-alpha.21 (2023-05-25)
- Arrow: alignment issue in tooltips (7f5de3e)
- DateField: change exposed form field type from
DateValue
tostring
(2f628c5), closes #66 - NumberField: reference to missing component (2a799bf)
- PaginationButtons: prev/next buttons do not disable when on the first/last page (c839bdf)
- remove BackToTop and Markdown components. Neither were fully implemented (d21fa93)
- remove unneeded dependency on react-transition-group (68e6f61)
- rename all slot props to have a
render
prefix to improve compatibility with the eslint rulereact/no-unstable-nested-components
(924de55) - rename LinkButton to TextLink to conform to BUX's conventions (b09aff9)
- SelectField: missing chevron icon (3d2b96a)
- UnstyledButton: block usage of native
onClick
to force developers to useonPress
for better a11y (974222b)
- add
SliderField
component (7f83742) - add DateRangeField (1a5c7e9), closes #70
- add new
Interactive
base component for handling all stateful styling of interactive fields (inputs, selects, etc) (146b060) - add PaginationButtons components (c0dfa4a), closes #78
- add source files to distribution bundle (8a271ac)
- add Tailwind preset for apps that use their own Tailwind runtimes may include and extend RUI's config (b395c49)
- switch to newer, more consistent, semantics for color tokens (8f4df30)
5.0.0-alpha.20 (2023-04-27)
- SelectField: add check for the placeholder prop (9a7b2cb)
5.0.0-alpha.19 (2023-04-26)
5.0.0-alpha.18 (2023-04-23)
- add missing
useDebouncedState
hook export (948ffe6) - add missing
useStyleSystemProps
export (4aa8316) - CheckboxSetField: detect change to
undefined
while in controlled mode (8c02dfc) - ComboBoxField: add missing label to inner list (08324f7)
- DateField: low text contrast (0a1285d)
- FormErrors: compatibility with RHF 7 (cc964d9), closes #58
- FormField: do not render label element when using
aria-label
(79ae72f), closes #67 - hide default buttons on webkit browers for
input[type="search"]
(c4ff676) - Icon:
style
prop should not be passed down to inner component (c98f338) - incorrect type for
overlayProps
in Modal and Popover (352157c) - mergeProps: type conflict for newer TS (782c7e4)
- RadioSetField: detect change to
undefined
while in controlled mode (02d0469) - useRUIForm: use correct type for
onBlur
(a6199df), closes #69
- add new LookupField that supports any object shape (06e8fea)
- ListBox: add style system control props to the parent and all items (48bff36)
5.0.0-alpha.17 (2023-04-12)
- add a hidden
input
element inComboBoxField
andLookupField
to assign their selected key to their field name (d2bf7ba), closes #20 #56 - Button: incorrect display mode when used as a polymorphed element (a8af1f1)
- Button: omit hover styles while disabled (b9566e6)
- CheckboxIcon and RadioIcon: prevent the icons from being compressed when their following text is very long (a5d655c), closes #25 #45
- CheckboxIcon: incorrect ARIA role (74430e7)
- CheckboxIcon: incorrect colors when disabled (3e1d462)
- Details: hide the detail marker in Safari (4326081), closes #1 #43
- disable prettier errors when using the VSCode plugin (62c68ce)
- FormErrors: incorrect type for errorMessage keys (2819ad4)
- Icon: missing aria-label when role is img (56e28ac)
- NecessityIndicator: set
aria-label
instead of label (b558ddd) - NumberField: add a hidden
input
element to tie aNumberField
's numberValue to its name inFormData
(3c2dc46), closes #55 #60 - RadioIcon: incorrect colors when disabled (39293f0)
- RadioSetField: prevent react-aria warnings (9f24b80), closes #61
- react-aria warnings when children or aria-label were not provided to the hook (c4a7acd)
- ScrollArea: adaptive height when the viewport is smaller than the area limits (62c416f)
- SwitchIcon: set a min width to prevent resizing (70b499f)
- useScreenSize: screens larger than xxl do not get correct breakpoints applied (f7fe24c), closes #48
- YesNoField: fix exposed types in value/onChange (9540655)
- Add
Section
component to avoid needing to expose react-stately to consumers (c449b18) - add Figma token file for use with Tokens Studio (a24c203)
- add ProgressBar component (0eef567), closes #13
- Arrow: add
size
prop (286cfd7) - CheckboxSetField: add
placeholder
prop and compatibility with React Stately lists (9ba9ffc) - Icon: add optional
label
prop to set role toimg
when defined (9269141) - ListBox: add support for sections (dc2770a)
- Menu: add
isDisabled
prop (9dd8b2b), closes #54 - Menu: add support for sections (e4c6d58)
- RadioSetField: support custom item renderers (9f4be1d)
- Tooltip: add placement and offset props (e5b6b06)
- UnstyledButton: add
data-disabled
when the disabled state is passed down (e8ed19b)
- refactoring dependencies to reduce bundle size (fe24bff)
5.0.0-alpha.16 (2023-03-16)
- refactoring dependencies to reduce bundle size (85dea0a)
5.0.0-alpha.15 (2023-03-16)
- Avatar: renders broken image placeholders in Safari and Chrome (4b626c9), closes #3
- Button: incorrect display mode when used as a polymorphed element (b586474)
- Button: omit hover styles while disabled (299437a)
- deps:
react-hook-form
is an optional dependency (e454ea6) - FormErrors: incorrect type for errorMessage keys (44603a9)
- Image: standardize broken image placeholder across browsers (2facb72), closes #5
- inconsistent value and onChange types behaviour across form fields (70a6d02)
- OhioStateFooter: do not use semantic
footer
element (dd5001c), closes #46 - SwitchField: incorrect value, defaultValue, and onChange types (6e67ef6), closes #24
- ToggleButton:
variant
prop should be optional (0f0f991) - UnstyledToggleButton: remove polymorphism to avoid conflict with base button props (cf45d30), closes #31
- YesNoField: fix exposed types in value/onChange (18ee1ad)
- add Admonition component for non-alert content (a892060), closes #39
- add ScrollArea component (a2a92a7)
- RadioSetField: support custom item renderers (4ff9340)
- UnstyledButton: add
data-disabled
when the disabled state is passed down (7fc4859)
5.0.0-alpha.14 (2023-03-15)
- CheckboxIcon and RadioIcon: prevent the icons from being compressed when their following text is very long (e5e3406), closes #25 #45
- Details: hide the detail marker in Safari (3a6352c), closes #1 #43
5.0.0-alpha.13 (2023-02-20)
- added
cursor-not-allowed
attribute to stop the cursor rendering as a pointer when it's disabled (b9a602d), closes #6
5.0.0-alpha.12 (2023-01-31)
- build: reconfigure tsc to target ES5 and DOM (51d2fda)
- build: remove bundling of react-hook-form and internationalized/date (317613b)
- Chip: isRemovable prop is optional (cc17cb7)
- ComboBoxField: misaligned dropdowns (99fa9cf)
- missing hook export (9d843c8)
- NumberField: incorrect base type for props (ca58a26), closes #21
- remove array spread from collection iterators (d67da70), closes #23
- TextAreaField: extraneous rows rendered (d3ba156), closes #26
- add edit icon (5a93e43), closes #27
- Heading: add className, id, and style props (c61e912), closes #28
- LookupField: add support for a custom icon and using the item renderer for the selection (3efde0c)
5.0.0-alpha.11 (2023-01-27)
- build: resolve a number of issues around the build process for d.ts files (57ef153)
- Button: subtle variant missing text contrast for dark mode (1d23a3f)
- ComboBoxField: icon size to match the rest (1013587)
- Divider: invalid width when in a flex-grow container (19606a5)
- Icon: add role for aria labeling (8287cb8)
- LookupField: close icon alignment (607713b)
- missing TS declarations path (f56317f)
- RadioIcon: incorrect border color when disabled (328a841)
- add DateField component (8e8fd0c)
- add FormErrors component for standardizing a list of errors and a11y focus links (b44c3f0)
- add Table component (14e9116)
- add ToggleButton and HamburgerButton components (e54060e)
- add useRUIForm hook to support react-hook-form integration across all field components (5af4f7f)
- add useTabularData hook to support typical use cases for data tables (7075183)
- Code: add block display mode (c5935f3)
- FormField: add
data-field
anddata-label-for
for a11y focus control without a context (ad71c50) - Icon: add
blank
for a placeholder that renders no content (fc77be8) - standardize on
value
andonChange
props for collection fields CheckboxSet, ComboBox, Lookup, and Select (ad5e833) - Table: add sort icons to columns (886d15b)
- Table: add support for style system props (7f128c3)
5.0.0-alpha.10 (2023-01-20)
- Button: bad Omit prop type (dd6e706)
- Callout: using the wrong type for
placement
prop (0d51958) - Chip: mismatched padding (8b75cdb)
- improve CSS cascading issues with theme tokens, now RUI Providers may be nested safely (1f6b141)
- storybook: automatic detection of component doc pages (aab8ab8)
- storybook: build does not reference correct SVG path (844518e)
- storybook: include props from React Aria and React Stately in docs (1415402)
- storybook: Safari does not render
backdrop-filter
(closes #4) (af415e1) - UnstyledButton: force prop coercion to work around rollup issue (3c1a5aa)
- UnstyledButton: merge forwarded ref with button ref (065d8b5)
- add LookupField, ComboBoxField, and NumberField components (4b8607b)
- add Menu component (7c8b4e7)
- add Ohio State Navbar (6caad37)
- add RadioSetField (b716d95)
- add SelectField for single option selection (7a345f7)
- add YesNoField component (a12fcc2)
- OhioStateNavbar: add light and dark variants (3d20cca)
- Popover: add option to disable the arrow (4fe5717)
- Popover: add support for manually defining placement (bf3ff03)
- RUI Provider: add theme control (2bb8a8d)
- storybook: resolve lag issue when a component has too many event handler props, specifically inputs (bec0e69)
5.0.0-alpha.9 (2023-01-10)
- ci: lock semantic-release to v19 due to Node 18+ requirements in v20 (71edfb1)
- Details: missing focus ring (937f077)
- Divider: incorrect width (cd04e3e)
- Grid: make props optional (469a14a)
- InputField: add missing necessity indicator (a77d1a0)
- missing focus ring on icon slot components (39a746c)
- Stack: match Groups defaults for align and justify (f2facd9)
- TabPanel: disabled state is still interactive (839ee4d)
- TabPanel: remove panel background for simple variant (7b93b34)
- tailwind: reduce intensity of ping animation (d788d13)
- tailwind: remove Tailwind forms to better support our own UX (7867288)
- UnstyledButton: react-aria button props override passed down props (deb668b)
- useStyleSystem: responsive font props are not resolved (d05b8a2)
- add a factory method to generate a placeholder component on required slots (535afa1)
- add Arrow component (2bbdaee)
- add Chip component (89bc66c)
- add FormDialog, InformationDialog, ConfirmDialog, Modal, and ConfirmButton components (86df804)
- add logo (6b601e6)
- add Ohio State Footer component (0bc4e63)
- add SwitchIcon and SwitchField components (80420c0)
- add TextField and TextAreaField components (ca24e91)
- Alert: improve dark mode colors (60e59d8)
- Button: add accented variant for usage against accent backgrounds (f620aad)
- Callout: add support for accent backgrounds (cefa606)
- CheckboxIcon: match BUX for disabled state (fb5a0e4)
- Image: add support for theme responsive
src
(03e33cc) - InputField: add left and right slots (31132bb)
- Popover: add arrow and accented background support (06d42e3)
- storybook: add support for automatically embedding component diagram SVGs (4573772)
5.0.0-alpha.8 (2023-01-05)
- Badge: uniform vertical alignment and gap for children (0c0b47e)
- CloseButton: pass down padding to the icon (3bf3f18)
- Divider: increase line width to match BUX (e073397)
- IconButton: icon did not center within larger button surfaces (602f865)
- Indicator: size requires pixels instead of spacing units (d95466a)
- Popover: keyboard focus will no longer leave the popover' (4ab509e)
- PrimaryButton: match BUX's button padding (379af43)
- Table: width should be 100% of the content (a287269)
- theme tokens: wrong dimmed-contrast for dark theme (f64d9f4)
- Tooltip: absolute positioning relative to the trigger (e649c77)
- UnstyledToggle: add missing focus ring (d9ca6b9)
- utils: handle responsive props that resolve to undefined (1d42b85)
- add
position: relative
as default behaviour for Group and Stack (027896e) - add BUX-style Back to Top button (b908123)
- add Code component (143a65b)
- add CSS Grid layout component (a3db432)
- add illustrations for content empty states and brand SVGs (8fcc05f)
- add Kbd component (902fac7)
- add Tooltip component (308a843)
- Group: add support for wrapping content (3e76a92)
- Icon: improve alignment and add support for passing down props to the svg (63b45e0)
- Paper: add support for accents (0e06027)
- style system: add standard grid layout props and theme-resolved props (95a782a)
- TabPanel: add variants, focus rings, and button semantics for tab buttons (8685eae)
- UnstyledButton: add
data-pressed
attribute during pressed states - active pseudo is not used via React Aria's useButton (35cbbfd)
5.0.0-alpha.7 (2023-01-03)
- style system: resolve CSSProperties instead of spacing tokens for size props w, h, miw, mih, maw, and mah (30b15ad)
- add Callout and Popover components (83b6d42)
- add Focus Ring, Underlay, Unstyled Toggle, RUI Provider, and Radio Icon components (68d5920)
- simplify and standardize focus ring styles (c7a69af)
- Underlay: add variants (6c53892)
5.0.0-alpha.6 (2023-01-02)
- add components for checkboxes and checkbox groups (6e91322)
- add contrast tokens for accent colors (c4b591a)
- add External Link, Missing Slot, and Necessity Indicator components (8655803)
- add input field abstractions (ebf624e)
- add ToggleField for abstracting boolean and keyword atomic fields (19b22aa)
- add useStyleSystemProps hook for reducing props to only StyleSystemProps (8ea785b)
- Badge: add support for accent colors (407a546)
- style system: add support for that occassionally useful negative pixel (e64343e)
5.0.0-alpha.5 (2023-01-01)
- deps: drop unecessary import of tailwind utilities to cut build size in half (aebe361)
- DocumentPagination: add missing forwarded ref (c4acdb1)
- eslint: no longer creates false reports of unused variables on typescript types (05d1268)
- Icon: add missing forwarded ref (ce00264)
- Interview: hide Q+A labels from screen readers (e455b76)
- remove cyclic dependencies that slow down builds (745d639)
- tailwind: add missing min-width and min-height spacing tokens (29fa6e7)
- add AvatarGroup component (e491057)
- add Image component (98a0ba7)
- add useScreenSize hook (ab1326a)
- Avatar: improve edge anti-aliasing and add polymorphism (f9d7dd3)
- IconButton: add background shade on hover (0490585)
- storybook: add live demo for each breakpoint (148412d)
5.0.0-alpha.4 (2022-12-29)
- polymorphics: compile-time prop checking and support for non-ReactNode children - required by React Aria components (d0bf92b)
- add constants and types for style system prop groups (96490aa)
- add new UnstyledList component (84f20fe)
- add our own mergeRefs function with polymorphic ref support (28ac028)
- add type checks for responsive and theme map types (153095f)
- add useStyleSystem and useSlots hooks (9c56645)
- TabPanel: add controlled component support (5740db4)
5.0.0-alpha.3 (2022-12-26)
- Badge: vertically center content (fdd59f8)
- add Item component based on Adobe's React Stately (4c5ad9e)
- add support for
full
andauto
spacing values (03a099c) - add TabPanel component (df81faf)
- Table: add variants and striped flag (e8abe86)
- tailwind: add box shadow underline variants (957c8ca)
5.0.0-alpha.2 (2022-12-26)
- Details: add missing ref and prop spread (6c45531)
- IconButton: use theme breaks instead of exact pixel values (4927c05)
- tailwind: add missing patterns for xxs spacing (8dd413e)
- add a11y and badge addons to Storybook and wrap redundant story code with factories (4a3c1e5)
- add HashLink component (f5c900c)
- add new Section Title component to replace the Title variant (a8c1649)
- Box: add bgc prop (9ae46f0)
- Button: add leftSlot and rightSlot props (54976af)
- Icon: add inline support (56abecb)
- Icon: add rotate and flip props (3eed6a9)
- Indicator: add style system support (0d9c1fc)
- scripts: add index rebuilding as part of the new component script (9e9fb5b)
- Title: add BUX's responsive font sizes (ba48854)
5.0.0-alpha.1 (2022-12-21)
- UI 5 rewrite 📝 (f5f0f28)
- Overhaul of the entire framework for v5
- Switch from Styleguidist to Storybook for the design system reference
- Switch from Bootstrap to Tailwind for styling and colocated styles
- Switch to microbundle for bundling ESM/CJS/etc distributions
- Refactor the base of all components to introduce standardized style props
- Complete visual rework to align with the BUX design system
- Accessibility-first component development process
4.8.1 (2022-12-21)
- ci: add missing publishConfig key (44d19ea)
4.8.0 (2022-12-20)
- add Upload form component (f11c819)
4.7.1 (2022-10-25)
- missing type information for DropOverlay.Menu props (80707ce)
4.7.0 (2022-10-25)
- add optional
className
prop toDropOverlay.Menu
andDropOverlay.Menu.Item
(d2b1217)
4.6.1 (2022-10-21)
- a11y:
Text.Rich
no longer uses h1-h3 DOM elements to avoid conflicts with existing page layout (resolves #17) (c7aaf87) - division symbol deprecation warnings in sass files (7364811)
4.6.0 (2022-10-13)
- a11y: link themed buttons will now correctly show a focus ring (resolves #20) (0c2e9fa)
- ChangeParams and ChangeTargetOptions missing from exports (resolves #8) (67f62fc)
- invalid import paths to JsonObject (5c5b52b)
4.5.1 (2022-07-29)
- LazyLoaded content now displays as soon as loading is complete without delay. Screen reader enhancements no longer affect visual display (cc1de76)
4.5.0 (2022-07-26)
- Added icons to invalid and valid form feedback text so they can pass WCAG 1.4.1 (8763d2a)
- Alert close button position style (e4636f3)
- ARIA issue with Alert - allow users to choose the role, since role='alert' should be used sparingly and is rather inaccessible if not used properly. Keeping the default role as alert to prevent a breaking change. (4873183)
- Change default Alert role to status (8441a69)
- Correct documentation for adding accessible text to an
<Icon>
(23e6c94) - dangerouslySetInnerHTML for Checkbox and Radio labels (resolves FWK-374) (81814bf)
- Give
Navbar
a unique label (resolves FWK-401) (bc3aae6) - Handle Dropdown.readOnly and MultiSelect.readOnly props (resolves FWK-378) (eea9f50)
- Increase contrast ratio between navigation item and NavBar (resolves FWK-399) (e24ad8d)
- LazyLoaded display logic where toggling back to loading would not show the placeholder (b814f9a)
- Properly handle onBlur for DateTime component (partially resolves FWK-379) (974596e)
- Remove experimental
AppSearch
andDocumentReview
components (6e39829) - Resolve CSS validation errors, excluding SVG false positive errors (resolves FWK-400) (f730ff5)
- Set document title to Page title prop every time that prop changes (3d7aacb)
- Use state to control the visibility of Alerts, instead of the Bootstrap data-dismiss attribute (resolves FWK-383) (3f3c9ed)
- Add
<Page>
component to improve application accessibility (4fab2f8) - CheckboxSet component for Checkbox fieldsets (2c22118)
- LazyLoaded component for better lazy loaded content accessibility (f2aa02b)
- RadioSet component for Radios in fieldsets (3c41d3e)
4.4.11 (2022-04-13)
- remove package-level exports of search drivers introduced in 4.4.10 (c047162)
4.4.10 (2022-04-13)
- incorrect export of
SearchFilters
as a type (resolves FWK-384) (418655e) - missing search drivers and interfaces to package export (resolves FWK-385) (8ae10e9)
4.4.9 (2022-03-22)
- Add
name
andid
props to Text.Rich component (resolves FWK-375 and FWK-377) (d764f13) - Show asterisk for required single checkboxes (resolves FWK-376) (f856c5a)
4.4.8 (2022-03-11)
- Update type of children prop for
<FieldSet.Legend>
to ReactChild, allowing both JSX elements and strings (9b808b8)
4.4.7 (2022-03-10)
- className gnored on all top level form components (resolves FWK-373) (5df45b4)
- FeldSet does not use
id
attribute (resolves FWK-365) (1b68d26) - Labels do not support HTML content (resolves FWK-374) (f670f9c)
- Update FieldSet to not require a
name
and to inherit theid
as thename
if no name is set (follows the pattern of the rest of the components) (bb6ce81)
4.4.6 (2022-01-21)
- styleguide: add a .htaccess so deployed styleguides can be accessed from just the project root (7b6c3f2)
Bug Fixes:
- Fixes issue introduced in the previous release where
Lookup.Input
result could not be selected by mouse click. - Input focus event now passed to
onBlur
callback onLookup.Input
.
Bug Fixes:
- Improve results pane behavior on
Lookup.Input
component.
Bug Fixes:
props.onChange()
is no longer invoked whenreadOnly
is set to true in theCheckbox.Input
,Number.Input
,Radio.Input
,Text.Area
,Text.Email
,Text.Input
, andText.Rich
components.
Bug Fixes:
- Data objects inlined for
MultiSelect
,Dropdown
,DataTable
, andTreeTable
component examples (resolves FWK-308) - Added error handling for
Paginator
component for when the search limit is set to a number less than one (1) (resolves FWK-309) - Added missing keys to
Filters.Active
andFilters.OneOf
- Added optional
id
property toFilter.Toggle
component (resolves FWK-296)
Bumping version due to a version conflict on UCR's package repository
Deprecated Components:
Modal
(superseded by PrimeReactDialog
)
Breaking Changes:
- Potential breaking changes in all PrimeReact components due to upgrade to version 6.3.0 (see #1738, #1566, and #1877)
useSearchProvider
- Renameresults
toresponse
andsetResults
tosetResponse
in the returned object
New Features:
- Added pagination support for Search components (
offset
andlimit
getters/setters in Search context). Apollo
search driver updated to include pagination support.SyncSearchWithURL
updated to include pagination support.- Added
Paginator
component to be used within aSearchProvider
. - Added support for parameters in
JsonApi
Search driver. - Added
Avatar
component with https://opic.osu.edu integration. - Added
EmailLink
component. - PrimeReact updated from version 5.0.0 to version 6.3.0.
- New PrimeReact component support in ORIS/ui:
Dialog
(replaces Modal),Toast
(viauseToast
hook andToastProvider
), andSkeleton
.
- New PrimeReact component support in ORIS/ui:
Bug Fixes:
- The
DateTime.Input
calendar now displays above all DOM elements. This resolves an issue where the calendar would be cut off when used in a Modal or Dialog. - The
DateTime.Input
field no longer ignores direct keyboard input. SyncSearchWithURL
now conditionally checks that the initial URL actually has filters prior to replacing them in the Search provider.
Minor Backwards Breaking Changes:
- Internal imports have changed to use the uppercase package name
@ORIS
instead of@oris
to support NPM > 6. If you have the package installed as@osuresearch/ui
you may encounter build errors. Reinstall as@osuresearch/ui
.
Bug Fixes:
- The Lookup form component can now be properly used as a controlled component. If the value passed into the
Lookup.Input
subcomponent is updated, the internal state will be updated to reflect the new value. An example for clearingLookup.Input
using this method was added to the README file for theLookup
component. - Resolves FWK-279 - the Lookup.Input clear button no longer triggers form submission
New Features:
- Integration of the PrimeReact UI Library, with support for its
DataTable
,TreeTable
, andAccordion
components (support for additional PrimeReact components forthcoming) - New
Alert
component based on Bootstrap Alerts - New
Chips
form component based on the PrimeReact component of the same name - New
Dropdown
form component based on the PrimeReact component of the same name - New
DropOverlay
component based on Bootstrap Dropdowns - New
MultiSelect
form component based on the PrimeReact component of the same name - New search components
SearchProvider
andFilters.*
to standardize search and filtering tools in apps (supports both GraphQL and JSON:API backends) - New
Lookup
form component that uses the new search and filtering tools - Navigation improvements to styleguide by categorizing components
Internal changes:
- The base styleguide page no longer loads all of the components in the styleguide
- Added the ability to override the component path line; if
componentPathLine
is set in a component, it will override the default (i.e.import { Component } from '@osuresearch/ui'
) - Improved the method of wrapping component names in brackets
- Moved component files into category folders within the components folder
- Removed (now) redundant HTML docs
New Features:
- Adds support for installation through UCR's package repository
Accessibility Fixes:
- Resolves color-contrast issues with link text (FWK-250) and theme colors (FWK-237)
This version adds additional documentation for form components.
Bug Fixes:
- The
name
property of form field components inside of aFieldSet
is no longer overridden by thename
property in theFieldSet
bind - An
onBlur
callback was added toText.Rich
for RHF compatability - Improved error state styles for
Text.Rich
- Error and Success subcomponents will display when the parent
.ui-form-element
also has.is-invalid
or.is-valid
class, respectively (resolves FWK-251)
Accessibility Fixes:
- The common Label component included an
aria-label
that denoted required fields. This was removed in favor of adding anaria-required
attribute to form inputs/controls - the more semantic solution aria-live
was removed from the Error component, sincerole="alert"
automatically makes the component an assertive live region. Additionally, a recommendation to perform validation on blur was added to the Form component documentation. Validating on blur will allow for the alerts to perform properly, per this article recommended by Jen and testing in macOS VoiceOver.- Added the
aria-invalid
attribute to form inputs/controls to aid in error validation for users of assistive technologies.
Bug Fixes:
- Fixed a minor display bug for help text and success/error messages in Chrome
Bug Fixes:
- Removed outdated form components from the distribution folder that were causing some form subcomponents to crash
Internal Changes:
- Build process will now delete the dist folder prior to build
Deprecated Components:
Components marked as deprecated will be removed in a future release. They will continue to work until their removal.
Richtext
has been deprecated in favor ofText.Rich
in the new Form Components
Minor Breaking Changes:
Button
- Changed the default theme toprimary
(previously wassecondary
)
New Features:
- Introduces new Form Components (
Form
,FieldSet
,Checkbox
,Text
, etc) to abstract away the complexities of setting up accessible forms. Richtext
- Addedid
propButton
- Addedtype
prop (one of'button' | 'reset' | 'submit'
- defaults tobutton
).Button
- Addedto
prop. When specified, the button renders as a React Router<Link>
to the designated route
Bug Fixes:
- Changed defaults for
$vendor-fonts
and$vendor-images
to not use a local server copy of/assets
and instead point to the production copy atorapps.osu.edu
- Fixed text underlines on badges that were wrapped within anchors
Navbar
- Removedexact
from Link elements to fix compatibility with newer React Router versionsSearch
- Fixed bug where Search inputs withoutdefaultValue
focus on load
Internal Changes:
- Fixed Styleguidst mangling component names during styleguide builds - preventing deployments
- Added support for deploying a build of the styleguide to the dev server
Rebuilt ES5 distribution files that were not correctly built for the 4.1.0 release.
Deprecated Components:
Components marked as deprecated will be removed in a future release. They will continue to work until their removal.
Profile
- Now part of the @ORIS/auth package.Emulate
- Now part of the @ORIS/auth package.
Minor Breaking Changes:
Button
- Removedsmall
prop. UseclassName="btn-sm"
instead.Icon
- Removed the use ofchildren
prop for screen reader labeling. Uselabel
prop instead.ModalHeader
- Changed default ofhasCloseButton
prop totrue
. Previous usage that assumed the close button would be hidden
New Features:
- New
Richtext
component based on CKEditor 4 - New
TabList
andTabItem
components for a responsive list of many tabs Button
- Added optionalclassName
anddisabled
propsIcon
- Added optionallabel
prop for screen reader labels
UI Changes:
ExternalLink
- Made the icon less obtrusiveFooter
- Replaced webmaster contact with Accessibility Coordinator. For technical support contact, use theSupport
component.
Bug Fixes:
- Refactored package dependencies to no longer require specific builds of node-sass or react-scripts installed when installing
@osuresearch/ui
through npm.- Minimum supported React versions are defined via
peerDependencies
to issue warnings duringnpm install
if these are not met.
- Minimum supported React versions are defined via
Note that with the above fix react-dom
and react-router-dom
will no longer be installed alongside @osuresearch/ui
. If your project was using an older version of @osuresearch/ui
, you will need to install these dependencies manually via:
npm install react-dom react-router-dom --save
New Styleguide and Interactive Examples System:
Styleguide documentation has been integrated directly into the project via React Styleguidist. Simply git checkout
a copy of oris/ui and do a npm start
to start up a local interactive styleguide.
Backwards Breaking Changes:
- All non-React components have been removed or replaced with React-equivalents
- This does not include every Bootstrap component. Use those as you typically would.
- Composer support has been removed. Now installable as a
npm
package - Component imports must now come from the
@osuresearch/ui
package Lookup
component has been replaced bySearch
- with similar arguments and less jQueryModal
component now has additional wrapper DOM. Recommended to use newModalHeader
andModalBody
as the only children.- Removed
AppLoader
component - Removed
AppError
component - Removed
ShibbolethMonitor
component - see FWK-185 for a future replacement - Removed
Util.debounce
function
New Features:
- New
ExternalLink
component to automatically handle accessibility and security standards for links out of an application. - New
Icon
component to automatically handle accessibility standards for Font Awesome icons. - New
Search
component to replace legacy$.Lookup
- No longer jQuery-based
- Has multiple new props for configuration
- New
Footer
component to display the standard brand footer - New
OhioStateNavbar
component to encapsulate the required OSU brand navbar - New
PersonSearchResult
renderer component forSearch
to standardize how person results look across applications. - New
Button
component - New
Badge
component - New
ModalHeader
component - New
ModalBody
component
Accessibility Improvements:
- Links now have an underline by default
Search
"Clear" button has been changed to an X that is now always persistent as long as there is text in the input.
Bug Fixes:
- Multiple React components: Fixed
fetch
compatibility issues with Edge < 18
New Features:
- Add new React components for common ORIS application features (Emulate, AppLoader, AppError, Lookup, Modal, Profile, Navbar, SystemAlert, ShibbolethMonitor)
- Add
i.required-asterisk
component style to render out the red asterisk used on required fields in any context that a designer wants (e.g. for individual checkbox labels or a form heading)
Bug Fixes:
- Lookup: Fix component not updating
$.Lookup
whenvalue, valueKey
props mutate - DataTables: Fix _empty container class always inheriting underlying
.even, .odd
styles - Fix extra margins added for adjacent inputs in a group
UI Changes:
- DataTables: Swapped what row is "darkened" for a
.stripe
table to improve the look of paginated tables with an even number of records per page - Added Capita as an available font - with Times New Roman fallback
- Change
h1, h2
headings to scarlet Capita - Add a slight additional margin between navbar links to reduce crowding
- Slightly adjust the grey of
.navbar
tabs to better support embedding into modals
Bug Fixes:
- Emulate: Fixed incorrect property call to Lookup
New Features:
- Uploader: Added user confirmation prior to sending a request to delete a file
- Uploader: Added
dataField
option (default:filedata
) to support changing the target for$_FILES
- Uploader: Added the ability to specify per-file metadata (submitted to delete/download endpoints as
file-metadata
)
Bug Fixes:
- Removed specificity for
form-group.is-required
label star suffixes - fails for cases where labels are inside a BS4 rowset - Fixed
.form-group
margins for the case when the.form-group
is combined with a.col-*
class (margins failed to collapse due to additional padding) - Fixed edge case of incorrect margins for a
.form-group
that is defined as afieldset
(fieldsets do not allow margin collapse) - Update gulp-sass dependency to
^3
due to 404 errors being thrown for the old^2
branch's dependencies - Component: Fixed a missing ifelse causing all function calls to be treated as property getters
- Uploader: Fixed static method call for item template DOM
- Uploader: Improved error handling and error states
- Uploader: Moved request body payload to query parameters for DELETE requests to support certain webservers ignoring the body of a DELETE request
- Uploader: Fixed event listeners handling events in the same call stack as the Uploader plugin
- Uploader: Fixed various edge cases causing
isEmpty
to incorrectly return false
UI Changes:
- Rounded badges to make them look less like buttons
- Changed DataTables pagination controls to look/behave like Bootstrap 4
- Removed some redundant (noisy) borders from tables/DataTables
- Defaulting DataTables to a non-paging simple table-only view. Additional features are to be turned on at developer’s discretion
- Uploader: Changed default file info to
Complete
for previously uploaded files without a custominfo
field
Internal Changes:
- Uploader: Defaulting
download
option to false - Uploader: Cleaned up SASS
Bug Fixes:
- Lookup: Fixed support for array notation in lookup input names.
name="foo[arr]"
will require a sibling input withname="foo-key[arr]"
- Lookup: Fixed incorrect variable reference for
keyValue
method
Backwards Breaking Changes:
- Lookup: Changed
store
option tokey
to better reflect its purpose - Lookup: Will no longer move the
name
attribute from the Lookup input to the hidden "key" input. This changes how data is POSTed alongside forms, as you will no longer get the hidden key value but instead the original display text of the input for the named field. Key value will now be stored and submitted via an input named the same as the original lookup input, but with the suffix-key
.
Bug Fixes:
- Fixed Lookup incorrectly forcing focus to the input when
set()
orclear()
methods are called via Javascript - Fixed Lookup not automatically setting itself to
readonly
if prepopulated with a value - Fixed margins for checks/radios inside a
.form-check-inline
group
Implemented Enhancements:
- Lookup: Now supports using a pre-populated "key" input on initial DOM load. The input MUST be a sibling to the lookup input and named the same plus the suffix
-key
. E.g. for<input data-provide="lookup" name="foo" ...>
there would be an<input name="foo-key" ...>
sibling. If one could not be found, a hidden input will be created automatically that meets the requirements. - Added kebabcase synonym for all frontend components registered in the jQuery prototype. E.g.
$.fn.CoolTool
is also now registered as$.fn['cool-tool']
- Added rule to throw an error if a component name overrides an existing entry in jQuery's prototype
There's Always Something Edition
Bug Fixes:
- Fixed class names for Emulate component DOM template (changed for BS4 Release)
- Fixed checkboxes for Feedback component DOM template (changed for BS4 Release)
- Fixed Lookup setting a
display: block
on the clear button - causing adjacent buttons to be misaligned
Upgrade to Bootstrap 4.0.0 Release and to ES6 for Javascript components
This upgrade requires changes to the gulpfile.js
in ES5 applications (any application doing an upgrade from oris/ui 2.0 to 3.0),
changes to the version of Bootstrap included from Assets, and contains a number of backwards breaking changes
between Bootstrap 4 Beta 2 and Release.
See the migration guide on the OR Wiki
Backwards Breaking Changes:
- Upgrade to Bootstrap 4.0.0 Release
- Rewrite of Javascript components to ES6
- Rename
scss
directory tosass
to be consistent with the applications navbar-nav
will now be hidden on displays<= sm
with the expectation that atabbar
will be visible for navigation.- Removed unused Bootstrap 3 + Symfony Forms templates
Fixed Bugs:
- Fixed responsive navbar rules for when a
form-inline
is adjacent to aprofile
- Fixed alignment of icons for inputs included in a navbar's
form-inline
- Fixed outline buttons looking too similar to disabled buttons
- Fixed
header.is-sticky
not supporting variable height headers (e.g. when extra message banners are visible) - Fixed cursor to be a pointer for default button styles
- Fixed z-indexes for custom components going higher than Bootstrap components (e.g. navbar being rendered over modals)
Implemented Enhancements:
- Added
src/dist/ui.es5.js
full backwards compatible build for ES5 applications - Added new
ApplicationAlert
component for displaying important server-wide notice banners on applications - Added new
Profile
component and DOM template (src/twig/profile.html) - Added new
Support
component and DOM template (src/twig/support.html) - Added new
Emulate
component and DOM template (src/twig/emulate.html) - Added
Util
function group, and a general purposeUtil.debounce
function for frequent event handlers - Lookup: Added
set(display, store)
method - Lookup: Added getters
displayValue
andstoreValue
Upgrade for Bootstrap 4 Beta.2
There are a handful of breaking changes between BS4 Alpha to BS4 Beta. Be sure to thoroughly read the two ship lists:
The following changelog only applies to ORIS components or adjustments made on top of Bootstrap 4.
Backwards Breaking Changes:
- Replaced
$.Lookup
with a new 2.0. See the Styleguide for new usage documentation. - Now requires jQuery 3+
- Removed
tether.js
vendor library .is-error
/.error
form validation classes removed. Now uses BS4's validation structure (see official docs)- Replaced
.navbar-thick
with.navbar-main
to better consolidate a number of required classes into one .navbar-expand
has been merged directly into.navbar
so all navbars are horizontal flex by default- Removed
.z-depth-*
classes - Removed
@mixin vertical-align
- Complete rewrite of the OSU Brand Header. See Styleguide for new DOM structure.
Fixed Bugs:
- Fixed icons not displaying for mobile in the OSU Brand Header
- Fixed default render theme for components when a developer forgets to add a theme class
Implemented Enhancements:
- Added new
tabbar
component - Added new
uploader
component - Added new
richtext
component - Added extended color palette for SASS
- No longer using an absolutely positioned/absolute height footer
- Added
.is-horizontal-scroll
for the body element to make a horizontally scrollable body with fixed headers
Upgrade for Bootstrap 4 alpha.6
Backwards Breaking Changes:
- All layout components (
.nav
,.row
, etc) are now 100% based on Flexbox .nav-stacked
changed toflex-column
.container
changed to.wrapper
for the OSU Navbar componentcol-xs
breakpoints have been removed. Usecol-
for default non-responsive layout behavior. Example:col-xs-12
is now justcol-12
Fixed Bugs:
- Fixed color contrast between enabled and disabled dates in the Datepicker component
- Fixed brand font-face not being applied to control elements
- Fix margin for custom control groups
Implemented Enhancements:
- All Javascript has been refactored to follow the AirBNB ES5 styleguide
- Lookup component has been implemented with real AJAX requests
- Prefix
.input-group-addon
icons are now embedded within adjacent inputs (previously was presented as a button) - Simplified
.table
display - Changed sm breakpoint to 500px to force col-sm-* support for Chrome 57+ printing
Initial stable release based on Bootstrap 4 alpha.4