The following is a curated list of changes in the Enact agate module, newest changes on the top.
- Updated
React
dependency to version19.0.0
agate/Scroller
andagate/VirtualList
to have default prop whenundefined
prop is passed
agate/ToggleButton
underline position forhuge
,small
andsmallest
sizes
agate/ContextualPopupDecorator
andagate/Dropdown
to have sibling DOM node as alternative to findDOMNode API which will be removed in React 19
agate/Panels
to animate properly whencover
prop ispartial
horizontally
No significant changes.
No significant changes.
No significant changes.
agate/Scroller
,agate/VirtualList
andagate/VirtualGridList
default value forscrollMode
tonative
No significant changes.
agate/MediaPlayer
active knob size to not overlay the text on Silicon and Carbon skins whentype
istiny
agate/ImageItem
to haveimageItem
,caption
andimage
publicClassnamesagate/Popup
to have acontent
publicClassnameagate/TabGroup
proponSelect
to handleonClick
event on it
agate/Keypad
to fireonChange
event with a correct value payloadagate/Panels/TabbedPanels
to not show console error when there is no childrenagate/SwitchItem
border color for Gallium skin when selected and focusedagate/TabGroup
to passonSelect
toui/Group
agate/IncrementSlider
sliderRef
prop to pass reference to the slider nodeagate/Slider
sliderRef
prop to pass reference to the slider node
agate/Picker
andagate/RangePicker
width of the focus background
agate/Panels
padding to show correctly all Picker samples for Electro skin
agate/ArcPicker
,agate/ArcSlider
foreground color for all skins except Carbonagate/ArcPicker
,agate/FanSpeedControl
segments color to be visible on Carbon skinagate/ArcSlider
progress and knob color to be visible on Carbon skinagate/DatePicker
,agate/DateTimePicker
,agate/Picker
,agate/RangePicker
, andagate/TimePicker
text color for Copper skinagate/DatePicker
,agate/DateTimePicker
, andagate/TimePicker
to match latest design for Silicon skinagate/DatePicker
,agate/RangePicker
, andagate/TimePicker
text color to be visible on Carbon skinagate/Dropdown
layout issues for Carbon, Cobalt, Copper, Titanium skinsagate/Input
to be selectable via double tapagate/MediaPlayer
layout issues for Cobalt, Carbon, Copper, Electro, Titanium skinsagate/Picker
andagate/RangePicker
to match latest design for Silicon skinagate/Scroller
to update scrollButtons state on initial renderagate/Scroller
should not scroll when focus moves from a scroll button to anotheragate/TemperatureControl
to have text inline for Spanish localeagate/ThemeDecorator
to apply the background color and background image properly
agate/AgateDecorator
,agate/FullscreenPopup
,agate/GridListImageItem
andagate/LabeledItem
component
- Update dependencies including React 18.0.0
agate/Header
Marquee for title, subtitle, and titleAbove
agate/GridListImageItem
, to be removed in 2.0.0. Useagate/ImageItem
instead
agate/ContextualPopupDecorator
layout for Carbon, Cobalt, Copper, Electro, Titanium skinsagate/IncrementSlider
style to have a proper layout for every skinagate/MediaPlayer
layout issues for Cobalt, Carbon, Copper, Electro, Titanium skinsagate/MediaPlayer
shuffle button color for Cobalt, and Copper skinsagate/Panel
andagate/TabGroup
padding for RTL localesagate/Picker
andagate/RangePicker
to match latest design for Silicon skinagate/PopupMenu
title to marquee for long textagate/RadioItem
icons to not be bigger than icon containeragate/TabGroup
button padding for Cobalt and Copper skinsagate/VirtualList
5-way navigation between scroll buttons whenfocusableScrollbar
agate/Heading
propshowBackButton
agate/Input
propclearButton
andclearIcon
agate/Keypad
propactiveCall
to render different icons depending on whether there is an active call or notagate/MediaPlayer
proptype
agate/Dropdown
style to match latest design for Silicon skinagate/Heading
style to match latest design for Silicon skinagate/Heading
position of underline when size="tile" on Carbon, Cobalt, Copper, Electro, Titanium skinsagate/Input
to match latest design for Silicon skinagate/Item
for inline with label and labelPosition "after" or "before" on Gallium skin to not change item width on hoveragate/Keypad
to match latest design for Silicon skinagate/LabeledIconButton
to match the latest design for Silicon skinagate/MediaPlayer
style to match latest design for Silicon skinagate/Slider
height whenorientation="vertical"
on Carbon, Cobalt, Copper, Electro, Titanium skinsagate/SwitchItem
style to match latest design for Silicon skinagate/TooltipDecorator
to to match latest design for Silicon skin
Noto Sans
font as the default font
agate/ArcSlider
text size be the same on all skinsagate/ArcSlider
style to match latest design for Silicon skinagate/Button
badge background color for Cobalt and Copper skinsagate/Button
to center icon when iconOnly prop is true, for Cobalt and Copper skins, RTLagate/Checkbox
icon font-size and focus color for Carbon, Cobalt, Copper, Electro, and Titanium skinsagate/CheckboxItem
style to match latest design for Silicon skinagate/ContextualPopupDecorator
style to match latest design for Silicon skinagate/ColorPicker
layout for Carbon, Electro, Gallium, Silicon skinsagate/Popup
to have the same background-color for body and buttons section for all skins except Siliconagate/Popup
to match latest design for Silicon skinagate/RadioItem
style to match latest design for Silicon skinagate/RadioItem
icon border-color to be visible when item is focused in Carbon skinagate/Scroller
to be more visible on Carbon, Cobalt, Copper, Electro, Titanium skinsagate/Slider
to have a more visible background-color on Cobalt skinagate/Slider
to apply focus styling while dragging by touchagate/SliderButton
button text color to be more visible on Carbon skinagate/ThumbnailItem
to match latest design for Silicon skinagate/ThumbnailItem
to display thumbnail image properly in all skins
agate/ImageItem
propsizing
to support image sizingagate/Drawer
onShow
,spotlightId
, andspotlightRestrict
props to handle focus with 5-way navigation
Copper
skin to use lighter color for text in order to be more visible
agate/Checkbox
,agate/FanSpeedControl
,agate/ImageItem
,agate/Item
, andagate/WindDirectionControl
to match latest design for Silicon skinagate/Dropdown
misalignment ofButton
andContextualPopup
on the edge of screenagate/Popup
to apply marquee for long title
agate/ContextualPopup
andagate/ContextualPopupDecorator
propcss
to support customizationsagate/Dropdown
propwidth
to support multiple widthsagate/IncrementSlider
propactivateOnFocus
to support slider activation when slider gets focusedagate/IncrementSlider
,agate/ProgressBar
, andagate/Slider
proptooltip
to enable the built-in tooltipagate/Item
to have aselected
publicClassnameagate/MediaPlayer
propspotlightDisabled
to disable 5-way navigationagate/Popup
aria-live
androle
props to support accessibilityagate/Popup
onShow
,spotlightId
, andspotlightRestrict
props to handle focus with 5-way navigationagate/PopupMenu
onShow
andspotlightId
props to handle focus with 5-way navigationagate/RadioItem
propslotBefore
agate/ProgressBar
propshighlighted
andbackgroundProgress
agate/ProgressBarTooltip
componentagate/Slider
propbackgroundProgress
agate/SliderTooltip
componentagate/Spinner
propchildren
to support the display of text below the iconagate/Tooltip
propmarquee
to allow to marqueeagate/TooltipDecorator
proptooltipMarquee
to support marquee for long tooltip and proptooltipWidth
to set a width for tooltip text
agate/Dropdown
to useagate/ContextualPopup
agate/ThemeDecorator
to excludeenact-fit
className whendisableFullscreen
is trueagate/ArcPicker
andagate/ArcSlider
to have a max-width forslotCenter
agate/ArcSlider
andagate/TemperatureControl
broken layout whenmin
prop is not smaller thanmax
propagate/BodyText
,agate/Button
,agate/IncrementSlider
,agate/LabeledIcon
, andagate/Slider
to match latest design for Silicon skinagate/Button
to apply active styling only when it is not disabledagate/Button
to apply active styling on enter key pressagate/ImageItem
width/height proportion whenorientation
ishorizontal
agate/LabeledIconButton
styling to preserve behavior and look when props are missingagate/SliderButton
5-way navigation functionality to change value via direction keysagate/SliderButton
styling to visually show the focused stateagate/TooltipDecorator
to position correctly on rtl locale
- The framework was updated to support React 17.0.1
agate/ThemeDecorator
configrootId
to specify React DOM tree root for global event handlers
agate/FullScreenPopup
, useagate/Popup
instead
agate/ArcPicker
andagate/ArcSlider
propdisabled
to be inactiveagate/ArcSlider
proparia-valuetext
to overridearia-valuetext
for itagate/DateTimePicker
propdayAriaLabel
,hourAriaLabel
,meridiemAriaLabel
,minuteAriaLabel
,monthAriaLabel
, andyearAriaLabel
agate/Heading
propmarqueOn
to determine when marquee beginsagate/Input
propinvalid
to display a tooltip with a message wheninvalid
prop is trueagate/Input
propinvalidMessage
to customize the tooltip message wheninvalid
prop is trueagate/Input
propsize
to change the size of both input and icons (default large)agate/Item
propcentered
,disabled
,inline
,marqueeOn
, andsize
agate/Keypad
propspotlightDisabled
to disable 5-way navigationagate/Popup
content padding and margin withcloseButton
agate/Popup
bottom
,fullscreen
,left
, andright
values toposition
propagate/Popup
duration
andtype
props
agate/Heading
to support marquee
agate/Button
to not center the icon when it hasminWidth
agate/DatePicker
transition direction for day when month is changedagate/Dropdown
to show focused icon color for Silicon skinagate/Dropdown
to not show double marquee textagate/Dropdown
to not close when clicking the list scrolleragate/LabeledIconButton
to display label text on multiple lines (removed marquee)agate/LabeledIconButton
max-width
to display huge sized icon correctlyagate/MediaPlayer
previous button functionality to play media from the beginning after being pausedagate/TabGroup
tabborder-bottom
to be applied for vertical orientationagate/TimePicker
transition direction for meridiem when hour is changed
- Sampler build failure
agate/Button
propiconOnly
,iconPosition
, andminWidth
agate/Checkbox
propdisabled
,indeterminate
, andindeterminateIcon
agate/CheckboxItem
propdisabled
,indeterminate
,indeterminateIcon
, andslotbefore
agate/DatePicker
proponSpotlightDisappear
andspotlightDisabled
agate/Marquee
componentagate/Picker
propnoAnimation
andwrap
agate/RangePicker
propnoAnimation
andwrap
agate/ThemeDecorator
contextThemeContext
to applyaccent
color toagate/ArcPicker
andagate/ArcSlider
when they're focusedagate/TimePicker
proponSpotlightDisappear
andspotlightDisabled
agate/ArcPicker
,agate/ArcSlider
,agate/FanSpeedControl
,agate/TemperatureControl
, andagate/WindDirectionControl
to read out audio guidance when focused via 5-way keysagate/FullscreenPopup
propduration
to support any valid CSS value
agate/ArcPicker
to display correctfont-size
andfont-weight
agate/Button
to marquee when focusedagate/Button
to show a tooltip when hoveredagate/DateTimePicker
returned value by onChange eventagate/Dropdown
to support closing dropdown with back keyagate/FanSpeedControl
to center text when there is no iconagate/Heading
to supportspacing
for Gallium and Siliconagate/IncrementSlider
button color for Gallium skinagate/Input
run time error when usingdismissOnEnter
agate/Keypad
to not show console error in sampleragate/Keypad
,agate/MediaPlayer
, andagate/ToggleButton
to have buttons with proper widthagate/LabeledIconButton
button shape to circularagate/MediaPlayer
to not show console error when next or previous button is pressed several times during playingagate/Panels
to show close button properly for night modeagate/Picker
picker item width in horizontal for siliconagate/PopupMenu
to display distinguishable titleagate/SliderButton
to not show console error in sampleragate/Spinner
to pause the animation whenpaused
prop is trueagate/Spinner
to show correct layout whentype
isloading
inright-to-left
localeagate/Spinner
to supporttransparent
prop properlyagate/SwitchItem
icon position for all skins in RTL locale and Electro/Titanium in all localesagate/TemperatureControl
to not be draggable when it's disabled
Initial release.