@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.6.0] - 2017-08-04

Added

• moonstone/VideoPlayer ability to seek when holding down the right and left keys. Sensitivity can be adjusted using throttling options jumpDelay and initialJumpDelay.

• moonstone/VideoPlayer property no5WayJump to disable jumping done by 5-way

• moonstone/VideoPlayer support for the "More" button to use tooltips

• moonstone/VideoPlayer properties moreButtonLabel and moreButtonCloseLabel to allow customization of the "More" button's tooltip and Aria labels

• moonstone/VideoPlayer property moreButtonDisabled to disable the "More" button

• moonstone/Picker and moonstone/RangePicker prop aria-valuetext to support reading custom text instead of value

• moonstone/VideoPlayer methods showControls and hideControls to allow external interaction with the player

• moonstone/Scroller support for Page Up/Page Down keys in pointer mode when no item has focus

Changed

• moonstone/VideoPlayer to handle play, pause, stop, fast forward and rewind on remote controller
• moonstone/Marquee to also start when hovered if marqueeOnRender is set
• spotlight containers using a restrict value of 'self-only' will ignore leaveFor directives when attempting to leave the container via 5-way

Fixed

• moonstone/IconButton to fit image source within IconButton
• moonstone icon font sizes for wide icons
• moonstone/ContextualPopupDecorator to prefer setting focus to the appropriate popup instead of other underlying controls when using 5-way from the activating control
• moonstone/Scroller not scrolled via 5 way when moonstone/ExpandableList is opened
• moonstone/VirtualList no not let the focus move outside of container even if there are children left when navigating with 5way
• moonstone/Scrollable to update disability of paging controls when the scrollbar is set to visible and the content becomes shorter
• moonstone/VideoPlayer to focus on hover over play/pause button when video is loading
• moonstone/VideoPlayer to update and display proper time while moving knob when video is paused
• moonstone/VideoPlayer long title overlap issues
• moonstone/Panels.Header to apply marqueeOn prop to subTitleBelow and titleBelow
• moonstone/Picker wheeling in moonstone/Scroller
• moonstone/IncrementSlider and moonstone/Picker to read value changes when selecting buttons
• spotlight to not blur and re-focus an element that is already focused
• ui/PlaceholderDecorator to update bounds of Scroller when the visible state changed