a react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package
APACHE-2.0 License
Bot releases are visible (Hide)
Published by jcfilben about 1 month ago
attrs
function introduced in v2.39.0 of Grommet. (#7304)onClickOutside
. (#7300)Published by jcfilben 2 months ago
defaultVisible
prop to Tip to control the initial visibility of the tooltip. (https://github.com/grommet/grommet/pull/7255)showIndex
boolean prop to List to control whether the index number for the list item is displayed when using onOrder
. (https://github.com/grommet/grommet/pull/7271)view.columns
to Data to track the visibility of columns in DataTableColumns and DataTable. (https://github.com/grommet/grommet/pull/7281)Published by britt6612 4 months ago
General:
anchor.icon.color
. (#7236)tip
to options for ToggleGroup. (#7258)Published by jcfilben 5 months ago
This release is compatible with both styled components v5 and v6. Please note that if you are upgrading to styled components v6 there are various changes to be aware of. Refer to the styled components migration guide: https://styled-components.com/docs/faqs#what-do-i-need-to-do-to-migrate-to-v6.
One major difference in styled-components v6 is the removal of CSS vendor prefixes by default since most CSS styles have broad cross-browser support. If you’d like to enable vendor prefixes for your project, you can do so following the steps provided in the styled components migration guide.
Published by taysea 6 months ago
General:
pinned
to DataTableColumns options
to allow pinning of specific columns in “Order columns”. (#7193)pinned
to accept object containing icon, background, color, and items. (#7213)extend
to Skeleton theme. (#7176)round
not respecting responsive={false}
. (#7187)step
to allow it to be controlled. (#7188)General:
readOnlyCopy
button in DateInput and TextInput. (#7168)summary
on Pagination was out of sync with active page. (#7169)Published by jcfilben 7 months ago
General:
rangeInput.wheel
to theme to allow for opting out of the scroll wheel behavior on RangeInput. (#7130)summary
and stepOptions
to Pagination. (#7133)validate
prop in FormField to allow easier implementation of a character counter by passing an object with max
and threshold
to the validate
prop (#6550)gap
to accept an object with row
and column
. (#7147)readOnly
styling through the theme property global.input.readOnly
. (#7123)readOnlyCopy
boolean prop to TextInput and DateInput to support a copy to clipboard button within a readOnly
input. (#7123)icon
contains extra space. (#6534)dropHeight
of SelectMultiple in DataFilter. (#7157)List:
list.primaryKey
to theme to enable primaryKey
styling. (#7136)onOrder
button via keyboard. (#7144)onOrder
. (#7140)Published by jcfilben 9 months ago
NEW Data components for turn-key implementations of complex filtering, searching, and sorting of data collections.
The following components have now been move out of “beta” and are available for production use:
General:
label
leaking as attribute in Checkbox. (#7101)SelectMultiple:
onSearch
. (#7079)StarRating:
Published by jcfilben 10 months ago
General:
onClick
prop. (#7018)search
in Select. (#6901)Beta:
aria-label
for DataFilter inputs. (#7038)step
. (https://github.com/grommet/grommet/pull/6942)message
to better support plural and singular grammar. (#7022)layer
when presented using Data toolbar
prop to align with design best practices. (#7057)Published by jcfilben 12 months ago
This is a pre-release
This release is compatible with both styled components v5 and v6. Please note that if you are upgrading to styled components v6 there are various changes to be aware of. Refer to the styled components migration guide: https://styled-components.com/docs/faqs#what-do-i-need-to-do-to-migrate-to-v6.
One major difference in styled-components v6 is the removal of CSS vendor prefixes by default since most CSS styles have broad cross-browser support. If you are using styled-components v6 alongside this pre-release and run into any issues related to vendor prefixes, please file an issue so we can add the necessary vendor prefix to the appropriate Grommet component. Alternately, if you’d like to enable vendor prefixes for your project, you can do so following the steps provided in the styled components migration guide.
Published by jcfilben 12 months ago
General:
radiobutton.check.background.color
to RadioButton. (#5243)level
prop to PageHeader. (#6952)tag.icon.remove
to Tag to allow the remove icon to be provided from the theme. (#6960)allowSelectAll
prop to DataTable to have the option to not have the select all CheckBox in the header cell. (#6843)Typescript:
Published by jcfilben about 1 year ago
General:
Beta:
Published by jcfilben over 1 year ago
General:
direction
prop to DataChart to support displaying charts horizontally. (#6799)menu.item.align
property to the theme. (#6835)primaryKey
behavior to align behavior for undefined and null. (#6865)valueLabel
when value={0}
. (#6833)align.bottom = 'top'
. (#6844)Beta:
data
is empty. (#6866)Published by jcfilben over 1 year ago
theme.select.emptySearchMessage
prop to allow styling of the empty search message container and text in Select and SelectMultiple. (#6815)reverse
prop. (#6398)searchPlaceholder
. (#6811)modal={true}
. (#6801)fill={true}
. (#6819)Published by jcfilben over 1 year ago
General:
groupBy
when value
is 0 (#6770).defaultValue
is 0 and retrieve correct selected value in onChange
using event.value
instead of event.target.value
(#6752).dropRef.current.style
without first checking if dropRef.current
is defined (#6804).use client
when exporting Grommet components so that they can be imported into a project using React Server Components (#6797).Beta:
Published by jcfilben over 1 year ago
General:
border
between in a border
array. (#6642)level
prop to Accordion to control what semantic heading should be rendered. (#6754)busy
, messages
, and success
props to Button to support an animation while button is loading and when the button action succeeds. (#6656)status-error
color to meet accessibility contrast requirements. (#6690)DataTable:
border
is not applied to CheckBox cells. (#6718)onSelect
was always undefined. (#6750)SelectMultiple:
showSelectedInline
. (#6738)Typescript:
children
prop. (#6687)Data: (beta)
Published by taysea over 1 year ago
General:
theme.icon.matchSize
to use a component’s size
property as the size
property value on its icon. (#6653)theme.icon.disableScaleDown
to theme Typescript definition. (#6668)medium
at small breakpoint. (#6689)children
Typescript definition. (#6648)Button:
pad
property. (#6686)theme.button.badge.align
to allow a theme to specify if the badge should align to the button’s edge. (#6692)SelectMultiple:
help
text. (#6685)Beta features:
”Select view”
to align with placeholder conventions. (#6673)Published by jcfilben over 1 year ago
General:
dropTarget
when opened. (#6613)position
to display correctly on the screen when a portion of the Drop is not visible. (#6611)places
show in the correct position after a re-render. (#6587)header.skeleton.width
in the theme to have a min
and max
width. (#6603)calendar[size].title
. (#6639)anchor.size[size].color
, anchor.size[size].fontWeight
and anchor.size[size].textDecoration
at different Anchor sizes. (#6643)width
prop to TextInput. (#6624)theme.tabs.header.alignSelf
to allow the theme to drive alignment of Tabs header along axis. (#6649)Button:
background
is dark. (#6629)theme.button[kind].direction
to allow the theme to drive the direction of icon + label. (#6606)theme.button.size[size].iconOnly.pad
which allows the caller to specify padding for icon only Buttons across different Button sizes. (#6604)DataTable:
height
to 100%. (#6590)rowProps
to target group header rows. (#6627)size
to accept any CSS string. (#6622)Layer:
layer.overlay.backdropFilter
to the theme which supports passing a string value for any CSS supported backdrop-filter. (#6605)Beta:
range
prop and convert the correct values. (#6631)updateOn=’change’
(#6617)drop
and responsive
props. (#6633)overflow
prop to DataFilters. (#6634)drop
prop to DataSort. (#6628)layer
prop to DataFilters. (#6600)