enactjs/enact 3.0.0

Release 3.0.0

on GitHub

For information about upgrading from Enact 2.x, refer to the Enact 3.0.0 migration guide at docs/migration/enact/migrating-to-enact-3.md

NOTE: Support for 2019 TV platform (Blink <68) has been dropped from this version of Enact

Removed

• core/kind config property contextTypes
• i18n/ilib embedded copy of iLib in favour of the NPM package ilib
• i18n/Uppercase HOC, replaced by i18n/util casing functions
• moonstone/Button and moonstone/Panels.Header prop casing which is no longer supported
• moonstone/Divider, replaced by moonstone/Heading
• moonstone/Divider, moonstone/Dialog, and moonstone/Heading prop casing
• moonstone/Input.InputBase prop focused which was used to indicate when the internal input field had focused but was replaced by the :focus-within pseudo-selector
• moonstone/VirtualList and moonstone/VirtualList.VirtualGridList property isItemDisabled
• small prop in moonstone/Input, moonstone/ToggleButton, moonstone/Button, moonstone/Icon, moonstone/IconButton, and moonstone/LabeledIcon, replaced by size prop, which accepts "small" or "large"

Added

• core/util.clamp to safely clamp a value between min and max bounds
• ilib@^14.2.0 package as a peer dependency for @enact/i18n and @enact/moonstone, which apps will need to include
• moonstone/BodyText prop size to offer a new "small" size
• moonstone/Button prop iconPosition
• moonstone/ContextualPopup config noArrow
• moonstone/Dropdown component
• moonstone/Dropdown property width to support 'small', 'medium', and 'large' sizes
• moonstone/Dropdown widths tiny, and huge
• moonstone/Panels.Header prop centered to support immersive apps with a completely centered design
• moonstone/Panels.Header prop hideLine to hide the bottom separator line
• moonstone/Panels.Header sample
• moonstone/Panels.Header type "dense" for "AlwaysViewing" Panels types
• moonstone/Heading component, an improved version of moonstone/Divider with additional features
• moonstone/Heading prop spacing with default value 'small'
• moonstone/Icon.icons entries for new icons
• moonstone/LabeledIconButton prop flip to flip the icon horizontally, vertically, or both
• moonstone/Panels slot <controls> to easily add custom controls next to the Panels' "close" button
• moonstone/Panels support for managing share state of contained components
• moonstone/Popup public class names body and closeContainer
• moonstone/Scroller and moonstone/VirtualList support for restoring scroll position when within a moonstone/Panels.Panel
• moonstone/Spinner prop size to support a new "small" size for use inside SlotItem components
• moonstone/TooltipDecorator prop tooltipRelative and moonstone/TooltipDecorator.Tooltip prop relative to support relative positioning. This is an advanced feature and requires a container with specific rules. See documentation for details.
• ui/Button public class .hasIcon which is present on the root node only when an icon has been provided
• ui/Heading component
• ui/Icon, ui/IconButton, and ui/LabeledIcon prop flip to flip the icon horizontally, vertically, or both
• ui/Measurable HOC and Hook for quick and convenient measuring of simple components
• ui/Scroller, ui/VirtualList.VirtualGridList, and ui/VirtualList.VirtualList prop noScrollByWheel for preventing scroll by wheel
• ui/Toggleable HOC config prop eventProps to allow wrapped components to specify additional event information
• ui/VirtualList.VirtualGridList and ui/VirtualList.VirtualList support for resizing a window

Changed

• moonstone/Button.ButtonDecorator to remove i18n/Uppercase HOC
• moonstone/Button, moonstone/Checkbox, moonstone/CheckboxItem, moonstone/ContextualPopupDecorator, moonstone/FormCheckbox, moonstone/FormCheckboxItem, moonstone/Panels.Header, moonstone/Notification, moonstone/RadioItem, and moonstone/Tooltip appearance to match the latest designs
• moonstone/Button, moonstone/Dropdown, moonstone/Icon, moonstone/IconButton, moonstone/Input, and moonstone/ToggleButton default size to "small", which unifies their initial heights
• moonstone/DaySelector to have squared check boxes to match the rest of the checkmark components
• moonstone/Dialog appearance to match the latest designs
• moonstone/Dropdown to prevent spotlight moving out of the popup
• moonstone/Dropdown to use radio selection which allows only changing the selection but not deselection
• moonstone/LabeledIcon and moonstone/LabeledIconButton text size to be smaller
• moonstone/Panel and moonstone/Panels now allocate slightly more screen edge space for a cleaner look
• moonstone/Scroller and other scrolling components to scroll via remote page up/down buttons when the scrollbar is hidden
• moonstone/Scroller to scroll when no spottable child exists in the pressed 5-way key direction and, when focusableScrollbar is set, focus the scrollbar button
• moonstone/Scroller.Scroller, moonstone/VirtualList.VirtualGridList, and moonstone/VirtualList.VirtualList scrollbar button to gain focus when pressing a page up or down key if focusableScrollbar is true
• sampler look and feel by updating to Storybook 5 and applying an Enact theme
• spotlight containers to include nodes identified on the aria-owns attribute of the container node as candidates within that container
• spotlight/Spottable to allow disabled items to be focused
• ui/ViewManager to use Web Animations instead of animation callbacks to improve performance resulting in API changes to Arranger and the pre-configured arrangers SlideArranger, SlideBottomArranger, SlideLeftArranger, SlideRightArranger, and SlideTopArranger
• global styling rules affecting standard font-weight, disabled opacity, and LESS color variable definitions

Fixed

• Fonts for non-Latin to not intermix font weights for bold when using a combination of Latin and non-Latin glyphs
• Fonts to correctly use the new font files and updated the international font name from "Moonstone LG Display" to "Moonstone Global"
• Language-specific fonts so they always use the correct typeface for their locale
• Moonstone Fonts to use the updated names of global fonts available in the system
• Non-Latin locale font assignments to match the new font family support in LG Smart UI
• core/platform logic for webOS detection
• i18n/Text to generate a proper TypeScript definition and to properly detect if translations were available when async
• moonstone disabled focus appearance to match the latest designs
• moonstone fonts be consolidated under "Moonstone" font-family to properly display all localized fonts when representing glyphs from any locale
• moonstone to support custom font for simplified Chinese
• moonstone/Button background colors for translucent and lightTranslucent
• moonstone/Checkbox by updating colors for both dark and light skins
• moonstone/Checkbox, moonstone/FormCheckbox, moonstone/Panels.Header, moonstone/RadioItem, moonstone/Slider, and moonstone/Switch to render correctly in high contrast
• moonstone/ContextualPopupDecorator arrow rendering issue in Chromium
• moonstone/ContextualPopupDecorator layout in large text mode in RTL locales
• moonstone/DatePicker, moonstone/DayPicker, moonstone/ExpandableList, and moonstone/TimePicker disabled opacity in high contrast mode
• moonstone/DaySelector item text size in large-text mode
• moonstone/Dropdown button to not animate
• moonstone/Dropdown children propType so it supports the same format as ui/Group (an array of strings or an array of objects with props)
• moonstone/Dropdown performance when using many options
• moonstone/Dropdown popup scroller arrows showing in non-latin locales and added large-text mode support
• moonstone/Dropdown remaining open after it becomes disabled
• moonstone/Dropdown to scroll to and focus the selected item when opened
• moonstone/Dropdown to support voice readout
• moonstone/EditableIntegerPicker to properly rerender when the edited value is invalid
• moonstone/ExpandableItem.ExpandableItemBase to not error if onClose or onOpen was not supplied
• moonstone/FormCheckbox, moonstone/Input, moonstone/ProgressBar, moonstone/RadioItem, moonstone/SwitchItem, and moonstone/Tooltip light skin colors.
• moonstone/FormCheckboxItem so it doesn't change size between normal and large text mode
• moonstone/FormCheckboxItem to marquee its contents
• moonstone/FormCheckboxItem to match the designs
• moonstone/GridListImageItem to support overriding the image CSS class name
• moonstone/Header input highlight positioning
• moonstone/Heading to have a bit more space between the text and the line, when the line is present
• moonstone/IncrementSlider to support aria-label when disabled
• moonstone/Input caret color to match the designs (black bar on white background, white bar on black background, standard inversion)
• moonstone/Input text color when focused and disabled
• moonstone/Item height in non-latin locales
• moonstone/LabeledItem to not clip the bottom of descender glyphs in large text mode
• moonstone/LabeledItem to pass marqueeOn prop to its contents
• moonstone/MediaOverlay to not mute media playback
• moonstone/Panels animation performance issues on low powered hardware
• moonstone/Panels to allow 5-way navigation to components within controls when used with a Header with headerInput
• moonstone/Panels to treat all components within controls as part of the active panel for the purposes of accessibility
• moonstone/Panels.Header to use the latest designs with better spacing between the titles below
• moonstone/Panels.Header with Input to not have a distracting white background color
• moonstone/Picker accessibility read out when a button becomes disabled
• moonstone/Picker to avoid overlapping items on render
• moonstone/Popup to properly handle closing in mid-transition
• moonstone/ProgressBar fill color when highlighted is set
• moonstone/ProgressBar, moonstone/Slider, and moonstone/IncrementSlider to use the latest set of design colors
• moonstone/RadioItem and moonstone/SelectableItem icon size in large-text mode
• moonstone/RadioItem to have a much prettier dot in dark and light skins
• moonstone/Scroller and other scrolling components to properly scroll via remote page up/down buttons when nested within another scrolling component
• moonstone/Scroller to correctly handle horizontally scrolling focused elements into view when using a direction value of 'both'
• moonstone/Scroller to not jump to the top when right key is pressed in the right most item of a vertical scroller
• moonstone/Scroller to not scroll horizontally via 5-way down in horizontal scroller
• moonstone/Scroller to properly move focus out of the container
• moonstone/Scroller to scroll and to move focus to the paging control properly if the current item sticking to the top is only spottable
• moonstone/Scroller, moonstone/VirtualList.VirtualGridList, and moonstone/VirtualList.VirtualList to scroll via a page up or down key when focus is on any vertical paging control while in pointer mode
• moonstone/Scroller, moonstone/VirtualList.VirtualGridList, and moonstone/VirtualList.VirtualList to correctly set focus after scrolling by page up/down keys
• moonstone/Scroller, moonstone/VirtualList.VirtualGridList, and moonstone/VirtualList.VirtualList not to scroll too far by page up/down keys
• moonstone/Scroller, moonstone/VirtualList.VirtualGridList, and moonstone/VirtualList.VirtualList not to scroll via a page up or down key when focus is on any horizontal paging control
• moonstone/Skinnable TypeScript signature
• moonstone/Slider progress bar fill color when focused with noFill set
• moonstone/Spinner to use the latest designs
• moonstone/Tooltip arrow gap
• moonstone/Tooltip layer order so it doesn't interfere with other positioned elements, like ContextualPopup
• moonstone/VideoPlayer feedback tooltip to overlap in non-latin locale
• moonstone/VideoPlayer more button tooltip to not clip or reverse text in RTL locales
• moonstone/VideoPlayer to have correct jump forward/backward icon
• moonstone/VideoPlayer to have correct sized control buttons
• moonstone/VideoPlayer to hide scrim for high contrast if bottom controls are hidden
• moonstone/VirtualList to allow keydown events to bubble up when not handled by the component
• moonstone/VirtualList to restore focus to an item when scrollbars are visible
• moonstone/VirtualList to scroll to the focused item when navigating out of the viewport via 5-way
• moonstone/VirtualList.VirtualGridList and moonstone/VirtualList.VirtualList to correctly scroll to a selected component when focused via 5way
• moonstone/VirtualList.VirtualGridList and moonstone/VirtualList.VirtualList to focus an item properly after an update
• moonstone/VirtualList.VirtualGridList and moonstone/VirtualList.VirtualList to navigate items properly in RTL languages
• moonstone/VirtualList.VirtualGridList and moonstone/VirtualList.VirtualList to properly navigate from paging controls to controls out of the list
• moonstone/VirtualList.VirtualGridList and moonstone/VirtualList.VirtualList to properly respond to 5way directional key presses
• moonstone/VirtualList.VirtualGridList and moonstone/VirtualList.VirtualList to render the first item properly when the dataSize prop is updated and the function as a parameter of the cbScrollTo prop is called
• sampler to limit the fields included in the Actions tab to improve serialization performance on low-powered hardware
• spotlight to attempt to restore focus through ancestor containers when the pointer hides
• spotlight to attempt to restore focus to an element nearest the pointer position when the pointer hides within an overflow container
• spotlight TypeScript signatures
• spotlight/SpotlightContainerDecorator to correctly forward onFocusCapture and onBlurCapture events
• ui/Icon to support arbitrary icon name strings, like in material icons
• ui/Measurable to remeasure after a re-layout so the measurement value is always correct
• ui/ProgressBar public class name bar to support customizing the background of the bar
• ui/Scroller TypeScript signatures
• ui/Scroller, ui/VirtualList.VirtualGridList, and ui/VirtualList.VirtualList not to scroll by wheel at the same time when multiple lists/scrollers are nested
• ui/Scroller, ui/VirtualList.VirtualGridList, and ui/VirtualList.VirtualList to handle mouse down events on scrollbars
• ui/styles/mixins.less mixins: .buildLocaleFont, .buildLocaleFonts, .buildFontFace to properly support font-weight ranges, font-weight default values, and font-stretch values
• ui/ToggleItem to send its value prop when toggled
• ui/ViewManager to correctly arrange views when initially rendering a non-zero index
• ui/VirtualList.VirtualGridList and ui/VirtualList.VirtualList to apply will-change CSS property to the proper node
• ui/VirtualList.VirtualGridList and ui/VirtualList.VirtualList to retain the proper scroll position when updating the itemSize or spacing props
• webos/LS2Request to automatically prefix luna:// service protocol when absent
• webos/LS2Request to return an error for a null response from a service