@enact/i18n

@enact/i18n

Enact library for internationalization

@enact/i18n provides a decorator that can be used to wrap a root component in a React (or Enact) application. This decorator provides a context to child components that can be used to determine locale text directionality and to update the current locale. Additionally, it provides a locale-aware Uppercase Higher Order Component (HOC).

Usage

import {I18nDecorator, contextTypes} from `@enact/i18n/I18nDecorator`;

const MyComponent = (props, context) => (
    <div>{context.rtl ? "right to left" : "left to right"}</div>
);

// Without contextTypes, your component will not receive context!
MyComponent.contextTypes = contextTypes;

const MyApp = () => (
    <div>
        <MyComponent />
    </div>
);

const MyI18nApp = I18nDecorator(MyApp);

Uppercase may be used independently of the app decorator. By default, it uppercases the children property of the wrapped component, provided it is a string.

import Uppercase from `@enact/i18n/Uppercase`

const MyComponent = (props) => (
    <div {...props} />
);

const MyUppercaseComponent = Uppercase(MyComponent);

Passing preserveCase in the props to MyUppercaseComponent will prevent uppercasing.

Install

npm install --save @enact/i18n

Acknowledgments

This module is built upon the iLib library.

Copyright and License Information

Unless otherwise specified, all content, including all source code files and documentation files in this repository are:

Copyright (c) 2016-2017 LG Electronics

Unless otherwise specified or set forth in the NOTICE file, all content, including all source code files and documentation files in this repository are: Licensed under the Apache License, Version 2.0 (the "License"); you may not use this content except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

This work is based on the Apache-2.0 licensed iLib from JEDLsoft.

Changelog

[1.0.0-beta.4] - 2017-03-10

Added

• core/kind support for contextTypes
• core/utils function extractAriaProps() for redirecting ARIA props when the root node of a component isn't focusable
• moonstone/VirtualList indexToFocus option to scrollTo method to focus on item with specified index
• moonstone/IconButton and moonstone/Button color property to add a remote control key color to the button
• moonstone/Scrollbar property disabled to disable both paging controls when it is true
• moonstone/VirtualList parameter moreInfo to pass firstVisibleIndex and lastVisibleIndex when scroll events are firing
• Accessibility support to UI components
• moonstone/VideoPlayer property onUMSMediaInfo to support the custom webOS “umsmediainfo” event
• moonstone/Region component which encourages wrapping components for improved accessibility rather than only preceding the components with a moonstone/Divider
• moonstone/Slider tooltip. It's enabled by default and comes with options like noTooltip, tooltipAsPercent, and tooltipSide. See the component docs for more details.
• moonstone/Spinner properties blockClickOn and scrim to block click events behind spinner
• ui/A11yDecorator to facilitate adding pre/post hints to components
• ui/AnnounceDecorator to facilitate announcing actions for accessibility
• webos/pmloglib logging method perfLog which calls PmLogInfoWithClock

Changed

• core/handle to allow binding to components. This also introduces a breaking change in the return value of handle methods.
• moonstone/VirtualGridImageItem styles to reduce redundant style code app side
• moonstone/VirtualList and moonstone/VirtualGridList to add essential CSS for list items automatically
• moonstone/VirtualList and moonstone/VirtualGridList to not add data-index to their item DOM elements directly, but to pass data-index as the parameter of their component prop like the key parameter of their component prop
• moonstone/ExpandableItem and derivatives to defer focusing the contents until animation completes
• moonstone/LabeledItem, moonstone/ExpandableItem, moonstone/ExpandableList to each support the node type in their label property. Best used with ui/Slottable.
• spotlight.Spottable to prevent emulating mouse events for repeated key events

Fixed

• moonstone/VirtualList.GridListImageItem to have proper padding size according to the existence of caption/subcaption
• moonstone/Scrollable to display scrollbars with proper size
• moonstone/VirtualGridList to not be truncated
• webos/LS2Request to return failure in isomorphic mode