@instructure/ui-i18n 8.11.2-snapshot.7 → 8.11.2-snapshot.70
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/ApplyTextDirection/index.js +3 -8
- package/es/DateTime.js +37 -2
- package/es/TextDirectionContext.js +17 -1
- package/es/bidirectional.js +19 -7
- package/es/getTextDirection.js +3 -2
- package/es/index.js +2 -1
- package/es/package.json +1 -0
- package/es/textDirectionContextConsumer.js +59 -0
- package/lib/ApplyTextDirection/index.js +4 -10
- package/lib/DateTime.js +37 -2
- package/lib/TextDirectionContext.js +17 -1
- package/lib/bidirectional.js +19 -7
- package/lib/getTextDirection.js +3 -2
- package/lib/index.js +8 -6
- package/lib/textDirectionContextConsumer.js +68 -0
- package/package.json +10 -10
- package/src/ApplyTextDirection/README.md +4 -0
- package/src/ApplyTextDirection/index.tsx +3 -9
- package/src/ApplyTextDirection/props.ts +15 -2
- package/src/DateTime.ts +35 -3
- package/src/TextDirectionContext.ts +15 -0
- package/src/bidirectional.tsx +17 -6
- package/src/getTextDirection.ts +3 -2
- package/src/index.ts +3 -4
- package/src/textDirectionContextConsumer.tsx +61 -0
- package/types/ApplyTextDirection/index.d.ts +2 -6
- package/types/ApplyTextDirection/index.d.ts.map +1 -1
- package/types/ApplyTextDirection/props.d.ts +13 -2
- package/types/ApplyTextDirection/props.d.ts.map +1 -1
- package/types/DateTime.d.ts +21 -2
- package/types/DateTime.d.ts.map +1 -1
- package/types/TextDirectionContext.d.ts +14 -0
- package/types/TextDirectionContext.d.ts.map +1 -1
- package/types/bidirectional.d.ts +5 -2
- package/types/bidirectional.d.ts.map +1 -1
- package/types/getTextDirection.d.ts +3 -2
- package/types/getTextDirection.d.ts.map +1 -1
- package/types/index.d.ts +3 -1
- package/types/index.d.ts.map +1 -1
- package/types/textDirectionContextConsumer.d.ts +41 -0
- package/types/textDirectionContextConsumer.d.ts.map +1 -0
|
@@ -29,10 +29,11 @@ import { DIRECTION, TextDirectionContext } from '../TextDirectionContext';
|
|
|
29
29
|
---
|
|
30
30
|
category: components/utilities
|
|
31
31
|
---
|
|
32
|
+
DEPRECATED. Please use TextDirectionContext instead.
|
|
32
33
|
@tsProps
|
|
33
34
|
**/
|
|
34
35
|
const ApplyTextDirection = props => {
|
|
35
|
-
const context =
|
|
36
|
+
const context = useContext(TextDirectionContext);
|
|
36
37
|
const dir = props.dir || context;
|
|
37
38
|
const ElementType = getElementType(ApplyTextDirection, props);
|
|
38
39
|
return /*#__PURE__*/React.createElement(TextDirectionContext.Provider, {
|
|
@@ -47,10 +48,4 @@ ApplyTextDirection.defaultProps = {
|
|
|
47
48
|
as: 'span',
|
|
48
49
|
children: null
|
|
49
50
|
};
|
|
50
|
-
ApplyTextDirection
|
|
51
|
-
|
|
52
|
-
const useTextDirectionContext = () => {
|
|
53
|
-
return useContext(TextDirectionContext);
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
export { ApplyTextDirection, useTextDirectionContext };
|
|
51
|
+
export { ApplyTextDirection };
|
package/es/DateTime.js
CHANGED
|
@@ -27,7 +27,8 @@ import moment from 'moment-timezone';
|
|
|
27
27
|
* category: utilities/i18n
|
|
28
28
|
* ---
|
|
29
29
|
* @deprecated
|
|
30
|
-
*
|
|
30
|
+
* #### DEPRECATION WARNING: Will be removed in v9, which wil include a
|
|
31
|
+
* time library agnostic API.
|
|
31
32
|
* A wrapper for [moment](https://momentjs.com/) utils.
|
|
32
33
|
* @module DateTime
|
|
33
34
|
*/
|
|
@@ -79,6 +80,38 @@ function isValid(dateString) {
|
|
|
79
80
|
function browserTimeZone() {
|
|
80
81
|
return moment.tz.guess();
|
|
81
82
|
}
|
|
83
|
+
/**
|
|
84
|
+
* Returns the days of the week in the given locale,
|
|
85
|
+
* for example ["Monday", "Tuesday",..]. It always begins with Monday.
|
|
86
|
+
* @param locale A locale accepted by the browser, e.g. America/New_York
|
|
87
|
+
* @param format If set to 'short' it will be maximum 3 letters long,
|
|
88
|
+
* if set to 'long' it will be the full word.
|
|
89
|
+
*/
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
function getLocalDayNamesOfTheWeek(locale, format) {
|
|
93
|
+
const ret = [];
|
|
94
|
+
const toFormat = format === 'short' ? 'dd' : 'dddd';
|
|
95
|
+
let currentDay = getFirstDayOfWeek(now(locale, browserTimeZone()));
|
|
96
|
+
|
|
97
|
+
for (let i = 0; i < 7; i++) {
|
|
98
|
+
ret.push(currentDay.format(toFormat));
|
|
99
|
+
currentDay = currentDay.add(1, 'day'); // TODO this is mutable
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
return ret;
|
|
103
|
+
}
|
|
104
|
+
/**
|
|
105
|
+
* Returns the first day of the week in the given locale.
|
|
106
|
+
* The locale decides what is the first day, e.g. Sunday in the US, Monday in
|
|
107
|
+
* the EU.
|
|
108
|
+
* @param date A Moment Datetime object
|
|
109
|
+
*/
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
function getFirstDayOfWeek(date) {
|
|
113
|
+
return date.clone().weekday(0);
|
|
114
|
+
}
|
|
82
115
|
/**
|
|
83
116
|
* Return a localized date + time with timezone as a ISO 8601 string
|
|
84
117
|
* @param {String} dateString
|
|
@@ -105,7 +138,9 @@ const DateTime = {
|
|
|
105
138
|
parse,
|
|
106
139
|
browserTimeZone,
|
|
107
140
|
isValid,
|
|
108
|
-
toLocaleString
|
|
141
|
+
toLocaleString,
|
|
142
|
+
getFirstDayOfWeek,
|
|
143
|
+
getLocalDayNamesOfTheWeek
|
|
109
144
|
};
|
|
110
145
|
export default DateTime;
|
|
111
146
|
export { DateTime };
|
|
@@ -23,10 +23,26 @@
|
|
|
23
23
|
*/
|
|
24
24
|
import { createContext } from 'react';
|
|
25
25
|
import { getTextDirection } from './getTextDirection';
|
|
26
|
+
/**
|
|
27
|
+
* ---
|
|
28
|
+
* category: utilities/i18n
|
|
29
|
+
* ---
|
|
30
|
+
*
|
|
31
|
+
* This React context the text direction. I can have 2 values:
|
|
32
|
+
* `ltr`, `rtl`. Its default value is the document's `dir` value, if
|
|
33
|
+
* this is not given then `ltr`. For more info on the values see
|
|
34
|
+
* [mdn](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).
|
|
35
|
+
* If its set to `ltr` or `rtl` then some InstUI components (e.g.
|
|
36
|
+
* [DrawerLayout](#DrawerLayout) will automatically orient based on its value.
|
|
37
|
+
*
|
|
38
|
+
* @module TextDirectionContext
|
|
39
|
+
*/
|
|
40
|
+
|
|
26
41
|
const TextDirectionContext = /*#__PURE__*/createContext(getTextDirection() || 'ltr');
|
|
27
42
|
const DIRECTION = {
|
|
28
43
|
ltr: 'ltr',
|
|
29
|
-
rtl: 'rtl'
|
|
44
|
+
rtl: 'rtl' //TODO add auto: 'auto' in the future
|
|
45
|
+
|
|
30
46
|
};
|
|
31
47
|
export default TextDirectionContext;
|
|
32
48
|
export { TextDirectionContext, DIRECTION };
|
package/es/bidirectional.js
CHANGED
|
@@ -36,6 +36,9 @@ import hoistNonReactStatics from 'hoist-non-react-statics'; // This is a workaro
|
|
|
36
36
|
* ---
|
|
37
37
|
* category: utilities/i18n
|
|
38
38
|
* ---
|
|
39
|
+
*
|
|
40
|
+
* #### DEPRECATED: This has been renamed to `textDirectionContextConsumer`, its functionality remains similar.
|
|
41
|
+
*
|
|
39
42
|
* A decorator or higher order component that makes a component `bidirectional`.
|
|
40
43
|
*
|
|
41
44
|
* As a HOC:
|
|
@@ -52,8 +55,8 @@ import hoistNonReactStatics from 'hoist-non-react-statics'; // This is a workaro
|
|
|
52
55
|
* export default bidirectional()(Example)
|
|
53
56
|
* ```
|
|
54
57
|
*
|
|
55
|
-
* When used as a child of [
|
|
56
|
-
* the direction provided in
|
|
58
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
59
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
57
60
|
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
58
61
|
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
59
62
|
* if it is not present.
|
|
@@ -66,12 +69,21 @@ const bidirectional = decorator(ComposedComponent => {
|
|
|
66
69
|
render() {
|
|
67
70
|
const _this$props = this.props,
|
|
68
71
|
forwardedRef = _this$props.forwardedRef,
|
|
69
|
-
rest = _objectWithoutProperties(_this$props, _excluded);
|
|
72
|
+
rest = _objectWithoutProperties(_this$props, _excluded); // Quite complex code, this is the priority order of applying the `dir` prop:
|
|
73
|
+
// 1. The highest priority is adding it via a prop
|
|
74
|
+
// 2. If there is a <TextDirectionContext.Provider> (or <ApplyTextDirection>
|
|
75
|
+
// which uses it) above the @bidirectional in the DOM, use its value.
|
|
76
|
+
// 3. If TextDirectionContext.Provider was called without params
|
|
77
|
+
// TextDirectionContext calls getTextDirection() which returns
|
|
78
|
+
// the 'dir' prop of the HTML document element.
|
|
79
|
+
|
|
70
80
|
|
|
71
|
-
return /*#__PURE__*/React.createElement(TextDirectionContext.Consumer, null, dir =>
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
81
|
+
return /*#__PURE__*/React.createElement(TextDirectionContext.Consumer, null, dir => {
|
|
82
|
+
return /*#__PURE__*/React.createElement(ComposedComponent, Object.assign({
|
|
83
|
+
ref: forwardedRef,
|
|
84
|
+
dir: dir
|
|
85
|
+
}, rest));
|
|
86
|
+
});
|
|
75
87
|
}
|
|
76
88
|
|
|
77
89
|
}
|
package/es/getTextDirection.js
CHANGED
|
@@ -65,10 +65,11 @@ const getDefaultDir = () => {
|
|
|
65
65
|
* category: utilities/i18n
|
|
66
66
|
* ---
|
|
67
67
|
*
|
|
68
|
-
* Return the direction ('ltr' or 'rtl') of an element
|
|
68
|
+
* Return the direction ('ltr' or 'rtl' or 'auto') of an element. If no element
|
|
69
|
+
* is given, it returns the document's 'dir' value.
|
|
69
70
|
* @module getTextDirection
|
|
70
71
|
* @param {Element} element will use the <html> element by default
|
|
71
|
-
* @returns {String} 'ltr' or 'rtl' (or `undefined` if no DOM is present)
|
|
72
|
+
* @returns {String} 'ltr' or 'rtl' or 'auto' (or `undefined` if no DOM is present)
|
|
72
73
|
*/
|
|
73
74
|
|
|
74
75
|
|
package/es/index.js
CHANGED
|
@@ -24,9 +24,10 @@
|
|
|
24
24
|
export { ApplyLocale } from './ApplyLocale';
|
|
25
25
|
export { ApplyLocaleContext } from './ApplyLocale/ApplyLocaleContext';
|
|
26
26
|
export { bidirectional } from './bidirectional';
|
|
27
|
+
export { textDirectionContextConsumer } from './textDirectionContextConsumer';
|
|
27
28
|
export { DateTime } from './DateTime';
|
|
28
29
|
export { getTextDirection } from './getTextDirection';
|
|
29
30
|
export { I18nPropTypes } from './I18nPropTypes';
|
|
30
31
|
export { Locale } from './Locale';
|
|
31
32
|
export { DIRECTION, TextDirectionContext } from './TextDirectionContext';
|
|
32
|
-
export {
|
|
33
|
+
export { ApplyTextDirection } from './ApplyTextDirection';
|
package/es/package.json
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"type":"module"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* The MIT License (MIT)
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
+
*
|
|
6
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
+
* in the Software without restriction, including without limitation the rights
|
|
9
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
+
* furnished to do so, subject to the following conditions:
|
|
12
|
+
*
|
|
13
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
+
* copies or substantial portions of the Software.
|
|
15
|
+
*
|
|
16
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
+
* SOFTWARE.
|
|
23
|
+
*/
|
|
24
|
+
import { bidirectional } from './bidirectional';
|
|
25
|
+
/**
|
|
26
|
+
* ---
|
|
27
|
+
* category: utilities/i18n
|
|
28
|
+
* ---
|
|
29
|
+
*
|
|
30
|
+
* A decorator or higher order component that supplies the text direction to
|
|
31
|
+
* components.
|
|
32
|
+
*
|
|
33
|
+
* As a HOC:
|
|
34
|
+
*
|
|
35
|
+
* ```js
|
|
36
|
+
* import { textDirectionContextConsumer } from '@instructure/ui-i18n'
|
|
37
|
+
*
|
|
38
|
+
* class Example extends React.Component {
|
|
39
|
+
* render () {
|
|
40
|
+
* return this.props.dir === textDirectionContextConsumer.DIRECTION.rtl ? <div>rtl</div> : <div>ltr</div>
|
|
41
|
+
* }
|
|
42
|
+
* }
|
|
43
|
+
*
|
|
44
|
+
* export default textDirectionContextConsumer()(Example)
|
|
45
|
+
* ```
|
|
46
|
+
*
|
|
47
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
48
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
49
|
+
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
50
|
+
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
51
|
+
* if it is not present.
|
|
52
|
+
*
|
|
53
|
+
* @module textDirectionContextConsumer
|
|
54
|
+
* @return The decorator that composes the bidirectional component.
|
|
55
|
+
*/
|
|
56
|
+
|
|
57
|
+
const textDirectionContextConsumer = bidirectional;
|
|
58
|
+
export default textDirectionContextConsumer;
|
|
59
|
+
export { textDirectionContextConsumer };
|
|
@@ -5,7 +5,7 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.
|
|
8
|
+
exports.ApplyTextDirection = void 0;
|
|
9
9
|
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
11
|
|
|
@@ -41,10 +41,11 @@ var _TextDirectionContext = require("../TextDirectionContext");
|
|
|
41
41
|
---
|
|
42
42
|
category: components/utilities
|
|
43
43
|
---
|
|
44
|
+
DEPRECATED. Please use TextDirectionContext instead.
|
|
44
45
|
@tsProps
|
|
45
46
|
**/
|
|
46
47
|
const ApplyTextDirection = props => {
|
|
47
|
-
const context =
|
|
48
|
+
const context = (0, _react.useContext)(_TextDirectionContext.TextDirectionContext);
|
|
48
49
|
const dir = props.dir || context;
|
|
49
50
|
const ElementType = (0, _getElementType.getElementType)(ApplyTextDirection, props);
|
|
50
51
|
return /*#__PURE__*/_react.default.createElement(_TextDirectionContext.TextDirectionContext.Provider, {
|
|
@@ -59,11 +60,4 @@ ApplyTextDirection.defaultProps = {
|
|
|
59
60
|
dir: void 0,
|
|
60
61
|
as: 'span',
|
|
61
62
|
children: null
|
|
62
|
-
};
|
|
63
|
-
ApplyTextDirection.DIRECTION = _TextDirectionContext.DIRECTION;
|
|
64
|
-
|
|
65
|
-
const useTextDirectionContext = () => {
|
|
66
|
-
return (0, _react.useContext)(_TextDirectionContext.TextDirectionContext);
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
exports.useTextDirectionContext = useTextDirectionContext;
|
|
63
|
+
};
|
package/lib/DateTime.js
CHANGED
|
@@ -38,7 +38,8 @@ var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
|
|
|
38
38
|
* category: utilities/i18n
|
|
39
39
|
* ---
|
|
40
40
|
* @deprecated
|
|
41
|
-
*
|
|
41
|
+
* #### DEPRECATION WARNING: Will be removed in v9, which wil include a
|
|
42
|
+
* time library agnostic API.
|
|
42
43
|
* A wrapper for [moment](https://momentjs.com/) utils.
|
|
43
44
|
* @module DateTime
|
|
44
45
|
*/
|
|
@@ -89,6 +90,38 @@ function isValid(dateString) {
|
|
|
89
90
|
function browserTimeZone() {
|
|
90
91
|
return _momentTimezone.default.tz.guess();
|
|
91
92
|
}
|
|
93
|
+
/**
|
|
94
|
+
* Returns the days of the week in the given locale,
|
|
95
|
+
* for example ["Monday", "Tuesday",..]. It always begins with Monday.
|
|
96
|
+
* @param locale A locale accepted by the browser, e.g. America/New_York
|
|
97
|
+
* @param format If set to 'short' it will be maximum 3 letters long,
|
|
98
|
+
* if set to 'long' it will be the full word.
|
|
99
|
+
*/
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
function getLocalDayNamesOfTheWeek(locale, format) {
|
|
103
|
+
const ret = [];
|
|
104
|
+
const toFormat = format === 'short' ? 'dd' : 'dddd';
|
|
105
|
+
let currentDay = getFirstDayOfWeek(now(locale, browserTimeZone()));
|
|
106
|
+
|
|
107
|
+
for (let i = 0; i < 7; i++) {
|
|
108
|
+
ret.push(currentDay.format(toFormat));
|
|
109
|
+
currentDay = currentDay.add(1, 'day'); // TODO this is mutable
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
return ret;
|
|
113
|
+
}
|
|
114
|
+
/**
|
|
115
|
+
* Returns the first day of the week in the given locale.
|
|
116
|
+
* The locale decides what is the first day, e.g. Sunday in the US, Monday in
|
|
117
|
+
* the EU.
|
|
118
|
+
* @param date A Moment Datetime object
|
|
119
|
+
*/
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
function getFirstDayOfWeek(date) {
|
|
123
|
+
return date.clone().weekday(0);
|
|
124
|
+
}
|
|
92
125
|
/**
|
|
93
126
|
* Return a localized date + time with timezone as a ISO 8601 string
|
|
94
127
|
* @param {String} dateString
|
|
@@ -115,7 +148,9 @@ const DateTime = {
|
|
|
115
148
|
parse,
|
|
116
149
|
browserTimeZone,
|
|
117
150
|
isValid,
|
|
118
|
-
toLocaleString
|
|
151
|
+
toLocaleString,
|
|
152
|
+
getFirstDayOfWeek,
|
|
153
|
+
getLocalDayNamesOfTheWeek
|
|
119
154
|
};
|
|
120
155
|
exports.DateTime = DateTime;
|
|
121
156
|
var _default = DateTime;
|
|
@@ -32,11 +32,27 @@ var _getTextDirection = require("./getTextDirection");
|
|
|
32
32
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
33
33
|
* SOFTWARE.
|
|
34
34
|
*/
|
|
35
|
+
|
|
36
|
+
/**
|
|
37
|
+
* ---
|
|
38
|
+
* category: utilities/i18n
|
|
39
|
+
* ---
|
|
40
|
+
*
|
|
41
|
+
* This React context the text direction. I can have 2 values:
|
|
42
|
+
* `ltr`, `rtl`. Its default value is the document's `dir` value, if
|
|
43
|
+
* this is not given then `ltr`. For more info on the values see
|
|
44
|
+
* [mdn](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).
|
|
45
|
+
* If its set to `ltr` or `rtl` then some InstUI components (e.g.
|
|
46
|
+
* [DrawerLayout](#DrawerLayout) will automatically orient based on its value.
|
|
47
|
+
*
|
|
48
|
+
* @module TextDirectionContext
|
|
49
|
+
*/
|
|
35
50
|
const TextDirectionContext = /*#__PURE__*/(0, _react.createContext)((0, _getTextDirection.getTextDirection)() || 'ltr');
|
|
36
51
|
exports.TextDirectionContext = TextDirectionContext;
|
|
37
52
|
const DIRECTION = {
|
|
38
53
|
ltr: 'ltr',
|
|
39
|
-
rtl: 'rtl'
|
|
54
|
+
rtl: 'rtl' //TODO add auto: 'auto' in the future
|
|
55
|
+
|
|
40
56
|
};
|
|
41
57
|
exports.DIRECTION = DIRECTION;
|
|
42
58
|
var _default = TextDirectionContext;
|
package/lib/bidirectional.js
CHANGED
|
@@ -25,6 +25,9 @@ const _excluded = ["forwardedRef"];
|
|
|
25
25
|
* ---
|
|
26
26
|
* category: utilities/i18n
|
|
27
27
|
* ---
|
|
28
|
+
*
|
|
29
|
+
* #### DEPRECATED: This has been renamed to `textDirectionContextConsumer`, its functionality remains similar.
|
|
30
|
+
*
|
|
28
31
|
* A decorator or higher order component that makes a component `bidirectional`.
|
|
29
32
|
*
|
|
30
33
|
* As a HOC:
|
|
@@ -41,8 +44,8 @@ const _excluded = ["forwardedRef"];
|
|
|
41
44
|
* export default bidirectional()(Example)
|
|
42
45
|
* ```
|
|
43
46
|
*
|
|
44
|
-
* When used as a child of [
|
|
45
|
-
* the direction provided in
|
|
47
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
48
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
46
49
|
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
47
50
|
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
48
51
|
* if it is not present.
|
|
@@ -55,11 +58,20 @@ const bidirectional = (0, _decorator.decorator)(ComposedComponent => {
|
|
|
55
58
|
render() {
|
|
56
59
|
const _this$props = this.props,
|
|
57
60
|
forwardedRef = _this$props.forwardedRef,
|
|
58
|
-
rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
61
|
+
rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded); // Quite complex code, this is the priority order of applying the `dir` prop:
|
|
62
|
+
// 1. The highest priority is adding it via a prop
|
|
63
|
+
// 2. If there is a <TextDirectionContext.Provider> (or <ApplyTextDirection>
|
|
64
|
+
// which uses it) above the @bidirectional in the DOM, use its value.
|
|
65
|
+
// 3. If TextDirectionContext.Provider was called without params
|
|
66
|
+
// TextDirectionContext calls getTextDirection() which returns
|
|
67
|
+
// the 'dir' prop of the HTML document element.
|
|
68
|
+
|
|
69
|
+
return /*#__PURE__*/_react.default.createElement(_TextDirectionContext.TextDirectionContext.Consumer, null, dir => {
|
|
70
|
+
return /*#__PURE__*/_react.default.createElement(ComposedComponent, Object.assign({
|
|
71
|
+
ref: forwardedRef,
|
|
72
|
+
dir: dir
|
|
73
|
+
}, rest));
|
|
74
|
+
});
|
|
63
75
|
}
|
|
64
76
|
|
|
65
77
|
}
|
package/lib/getTextDirection.js
CHANGED
|
@@ -76,10 +76,11 @@ const getDefaultDir = () => {
|
|
|
76
76
|
* category: utilities/i18n
|
|
77
77
|
* ---
|
|
78
78
|
*
|
|
79
|
-
* Return the direction ('ltr' or 'rtl') of an element
|
|
79
|
+
* Return the direction ('ltr' or 'rtl' or 'auto') of an element. If no element
|
|
80
|
+
* is given, it returns the document's 'dir' value.
|
|
80
81
|
* @module getTextDirection
|
|
81
82
|
* @param {Element} element will use the <html> element by default
|
|
82
|
-
* @returns {String} 'ltr' or 'rtl' (or `undefined` if no DOM is present)
|
|
83
|
+
* @returns {String} 'ltr' or 'rtl' or 'auto' (or `undefined` if no DOM is present)
|
|
83
84
|
*/
|
|
84
85
|
|
|
85
86
|
|
package/lib/index.js
CHANGED
|
@@ -21,6 +21,12 @@ Object.defineProperty(exports, "bidirectional", {
|
|
|
21
21
|
return _bidirectional.bidirectional;
|
|
22
22
|
}
|
|
23
23
|
});
|
|
24
|
+
Object.defineProperty(exports, "textDirectionContextConsumer", {
|
|
25
|
+
enumerable: true,
|
|
26
|
+
get: function () {
|
|
27
|
+
return _textDirectionContextConsumer.textDirectionContextConsumer;
|
|
28
|
+
}
|
|
29
|
+
});
|
|
24
30
|
Object.defineProperty(exports, "DateTime", {
|
|
25
31
|
enumerable: true,
|
|
26
32
|
get: function () {
|
|
@@ -57,12 +63,6 @@ Object.defineProperty(exports, "TextDirectionContext", {
|
|
|
57
63
|
return _TextDirectionContext.TextDirectionContext;
|
|
58
64
|
}
|
|
59
65
|
});
|
|
60
|
-
Object.defineProperty(exports, "useTextDirectionContext", {
|
|
61
|
-
enumerable: true,
|
|
62
|
-
get: function () {
|
|
63
|
-
return _ApplyTextDirection.useTextDirectionContext;
|
|
64
|
-
}
|
|
65
|
-
});
|
|
66
66
|
Object.defineProperty(exports, "ApplyTextDirection", {
|
|
67
67
|
enumerable: true,
|
|
68
68
|
get: function () {
|
|
@@ -76,6 +76,8 @@ var _ApplyLocaleContext = require("./ApplyLocale/ApplyLocaleContext");
|
|
|
76
76
|
|
|
77
77
|
var _bidirectional = require("./bidirectional");
|
|
78
78
|
|
|
79
|
+
var _textDirectionContextConsumer = require("./textDirectionContextConsumer");
|
|
80
|
+
|
|
79
81
|
var _DateTime = require("./DateTime");
|
|
80
82
|
|
|
81
83
|
var _getTextDirection = require("./getTextDirection");
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.textDirectionContextConsumer = exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _bidirectional = require("./bidirectional");
|
|
9
|
+
|
|
10
|
+
/*
|
|
11
|
+
* The MIT License (MIT)
|
|
12
|
+
*
|
|
13
|
+
* Copyright (c) 2015 - present Instructure, Inc.
|
|
14
|
+
*
|
|
15
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
16
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
17
|
+
* in the Software without restriction, including without limitation the rights
|
|
18
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
19
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
20
|
+
* furnished to do so, subject to the following conditions:
|
|
21
|
+
*
|
|
22
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
23
|
+
* copies or substantial portions of the Software.
|
|
24
|
+
*
|
|
25
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
26
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
27
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
28
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
29
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
30
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
31
|
+
* SOFTWARE.
|
|
32
|
+
*/
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* ---
|
|
36
|
+
* category: utilities/i18n
|
|
37
|
+
* ---
|
|
38
|
+
*
|
|
39
|
+
* A decorator or higher order component that supplies the text direction to
|
|
40
|
+
* components.
|
|
41
|
+
*
|
|
42
|
+
* As a HOC:
|
|
43
|
+
*
|
|
44
|
+
* ```js
|
|
45
|
+
* import { textDirectionContextConsumer } from '@instructure/ui-i18n'
|
|
46
|
+
*
|
|
47
|
+
* class Example extends React.Component {
|
|
48
|
+
* render () {
|
|
49
|
+
* return this.props.dir === textDirectionContextConsumer.DIRECTION.rtl ? <div>rtl</div> : <div>ltr</div>
|
|
50
|
+
* }
|
|
51
|
+
* }
|
|
52
|
+
*
|
|
53
|
+
* export default textDirectionContextConsumer()(Example)
|
|
54
|
+
* ```
|
|
55
|
+
*
|
|
56
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
57
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
58
|
+
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
59
|
+
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
60
|
+
* if it is not present.
|
|
61
|
+
*
|
|
62
|
+
* @module textDirectionContextConsumer
|
|
63
|
+
* @return The decorator that composes the bidirectional component.
|
|
64
|
+
*/
|
|
65
|
+
const textDirectionContextConsumer = _bidirectional.bidirectional;
|
|
66
|
+
exports.textDirectionContextConsumer = textDirectionContextConsumer;
|
|
67
|
+
var _default = textDirectionContextConsumer;
|
|
68
|
+
exports.default = _default;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@instructure/ui-i18n",
|
|
3
|
-
"version": "8.11.2-snapshot.
|
|
3
|
+
"version": "8.11.2-snapshot.70+9653a896e",
|
|
4
4
|
"description": "Helper components and utilities for internationalization.",
|
|
5
5
|
"author": "Instructure, Inc. Engineering and Product Design",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -24,18 +24,18 @@
|
|
|
24
24
|
},
|
|
25
25
|
"license": "MIT",
|
|
26
26
|
"devDependencies": {
|
|
27
|
-
"@instructure/ui-babel-preset": "8.11.2-snapshot.
|
|
28
|
-
"@instructure/ui-test-utils": "8.11.2-snapshot.
|
|
27
|
+
"@instructure/ui-babel-preset": "8.11.2-snapshot.70+9653a896e",
|
|
28
|
+
"@instructure/ui-test-utils": "8.11.2-snapshot.70+9653a896e",
|
|
29
29
|
"@types/hoist-non-react-statics": "^3.3.1"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
32
|
"@babel/runtime": "^7.13.10",
|
|
33
|
-
"@instructure/shared-types": "8.11.2-snapshot.
|
|
34
|
-
"@instructure/ui-decorator": "8.11.2-snapshot.
|
|
35
|
-
"@instructure/ui-dom-utils": "8.11.2-snapshot.
|
|
36
|
-
"@instructure/ui-prop-types": "8.11.2-snapshot.
|
|
37
|
-
"@instructure/ui-react-utils": "8.11.2-snapshot.
|
|
38
|
-
"@instructure/ui-utils": "8.11.2-snapshot.
|
|
33
|
+
"@instructure/shared-types": "8.11.2-snapshot.70+9653a896e",
|
|
34
|
+
"@instructure/ui-decorator": "8.11.2-snapshot.70+9653a896e",
|
|
35
|
+
"@instructure/ui-dom-utils": "8.11.2-snapshot.70+9653a896e",
|
|
36
|
+
"@instructure/ui-prop-types": "8.11.2-snapshot.70+9653a896e",
|
|
37
|
+
"@instructure/ui-react-utils": "8.11.2-snapshot.70+9653a896e",
|
|
38
|
+
"@instructure/ui-utils": "8.11.2-snapshot.70+9653a896e",
|
|
39
39
|
"hoist-non-react-statics": "^3.3.2",
|
|
40
40
|
"moment-timezone": "^0.5",
|
|
41
41
|
"prop-types": "^15"
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"access": "public"
|
|
48
48
|
},
|
|
49
49
|
"sideEffects": false,
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "9653a896e80ba4d73335225e80807746a232d96d"
|
|
51
51
|
}
|
|
@@ -2,6 +2,10 @@
|
|
|
2
2
|
describes: ApplyTextDirection
|
|
3
3
|
---
|
|
4
4
|
|
|
5
|
+
#### DEPRECATED
|
|
6
|
+
|
|
7
|
+
Please use [TextDirectionContext](#TextDirectionContext) instead.
|
|
8
|
+
|
|
5
9
|
A utility component used to manage text direction. In addition to appending the `dir` attribute to
|
|
6
10
|
its underlying DOM node, `<ApplyTextDirection />` also creates a direction context which can be
|
|
7
11
|
consumed by child components that have implemented [bidirectional](#bidirectional).
|
|
@@ -32,13 +32,13 @@ import { ApplyTextDirectionProps } from './props'
|
|
|
32
32
|
---
|
|
33
33
|
category: components/utilities
|
|
34
34
|
---
|
|
35
|
+
DEPRECATED. Please use TextDirectionContext instead.
|
|
35
36
|
@tsProps
|
|
36
37
|
**/
|
|
37
38
|
const ApplyTextDirection = (props: ApplyTextDirectionProps) => {
|
|
38
|
-
const context =
|
|
39
|
+
const context = useContext(TextDirectionContext)
|
|
39
40
|
const dir = props.dir || context
|
|
40
41
|
const ElementType = getElementType(ApplyTextDirection, props)
|
|
41
|
-
|
|
42
42
|
return (
|
|
43
43
|
<TextDirectionContext.Provider value={dir}>
|
|
44
44
|
{
|
|
@@ -58,10 +58,4 @@ ApplyTextDirection.defaultProps = {
|
|
|
58
58
|
children: null
|
|
59
59
|
} as const
|
|
60
60
|
|
|
61
|
-
ApplyTextDirection
|
|
62
|
-
|
|
63
|
-
const useTextDirectionContext = () => {
|
|
64
|
-
return useContext(TextDirectionContext)
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
export { ApplyTextDirection, useTextDirectionContext }
|
|
61
|
+
export { ApplyTextDirection }
|
|
@@ -25,8 +25,21 @@
|
|
|
25
25
|
import React from 'react'
|
|
26
26
|
import { AsElementType } from '@instructure/shared-types'
|
|
27
27
|
|
|
28
|
+
type DirValues = 'ltr' | 'rtl' | 'auto'
|
|
29
|
+
|
|
28
30
|
export type ApplyTextDirectionProps = {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
+
/**
|
|
32
|
+
* The direction value to use. For values and their effects see
|
|
33
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir
|
|
34
|
+
*/
|
|
35
|
+
dir?: DirValues
|
|
36
|
+
/**
|
|
37
|
+
* The children of this component. Either a React node or a function
|
|
38
|
+
* that receives 2 parameters (text direction, is rtl direction?) and
|
|
39
|
+
* returns a React node
|
|
40
|
+
*/
|
|
41
|
+
children?:
|
|
42
|
+
| React.ReactNode
|
|
43
|
+
| ((dir: DirValues, isRtl: boolean) => React.ReactNode)
|
|
31
44
|
as?: AsElementType
|
|
32
45
|
}
|
package/src/DateTime.ts
CHANGED
|
@@ -22,14 +22,15 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import moment from 'moment-timezone'
|
|
25
|
+
import moment, { Moment } from 'moment-timezone'
|
|
26
26
|
|
|
27
27
|
/**
|
|
28
28
|
* ---
|
|
29
29
|
* category: utilities/i18n
|
|
30
30
|
* ---
|
|
31
31
|
* @deprecated
|
|
32
|
-
*
|
|
32
|
+
* #### DEPRECATION WARNING: Will be removed in v9, which wil include a
|
|
33
|
+
* time library agnostic API.
|
|
33
34
|
* A wrapper for [moment](https://momentjs.com/) utils.
|
|
34
35
|
* @module DateTime
|
|
35
36
|
*/
|
|
@@ -81,6 +82,34 @@ function browserTimeZone() {
|
|
|
81
82
|
return moment.tz.guess()
|
|
82
83
|
}
|
|
83
84
|
|
|
85
|
+
/**
|
|
86
|
+
* Returns the days of the week in the given locale,
|
|
87
|
+
* for example ["Monday", "Tuesday",..]. It always begins with Monday.
|
|
88
|
+
* @param locale A locale accepted by the browser, e.g. America/New_York
|
|
89
|
+
* @param format If set to 'short' it will be maximum 3 letters long,
|
|
90
|
+
* if set to 'long' it will be the full word.
|
|
91
|
+
*/
|
|
92
|
+
function getLocalDayNamesOfTheWeek(locale: string, format: 'short' | 'long') {
|
|
93
|
+
const ret: string[] = []
|
|
94
|
+
const toFormat = format === 'short' ? 'dd' : 'dddd'
|
|
95
|
+
let currentDay = getFirstDayOfWeek(now(locale, browserTimeZone()))
|
|
96
|
+
for (let i = 0; i < 7; i++) {
|
|
97
|
+
ret.push(currentDay.format(toFormat))
|
|
98
|
+
currentDay = currentDay.add(1, 'day') // TODO this is mutable
|
|
99
|
+
}
|
|
100
|
+
return ret
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* Returns the first day of the week in the given locale.
|
|
105
|
+
* The locale decides what is the first day, e.g. Sunday in the US, Monday in
|
|
106
|
+
* the EU.
|
|
107
|
+
* @param date A Moment Datetime object
|
|
108
|
+
*/
|
|
109
|
+
function getFirstDayOfWeek(date: Moment) {
|
|
110
|
+
return date.clone().weekday(0)
|
|
111
|
+
}
|
|
112
|
+
|
|
84
113
|
/**
|
|
85
114
|
* Return a localized date + time with timezone as a ISO 8601 string
|
|
86
115
|
* @param {String} dateString
|
|
@@ -110,8 +139,11 @@ const DateTime = {
|
|
|
110
139
|
parse,
|
|
111
140
|
browserTimeZone,
|
|
112
141
|
isValid,
|
|
113
|
-
toLocaleString
|
|
142
|
+
toLocaleString,
|
|
143
|
+
getFirstDayOfWeek,
|
|
144
|
+
getLocalDayNamesOfTheWeek
|
|
114
145
|
}
|
|
115
146
|
|
|
116
147
|
export default DateTime
|
|
117
148
|
export { DateTime }
|
|
149
|
+
export type { Moment }
|
|
@@ -25,11 +25,26 @@
|
|
|
25
25
|
import { createContext } from 'react'
|
|
26
26
|
import { getTextDirection } from './getTextDirection'
|
|
27
27
|
|
|
28
|
+
/**
|
|
29
|
+
* ---
|
|
30
|
+
* category: utilities/i18n
|
|
31
|
+
* ---
|
|
32
|
+
*
|
|
33
|
+
* This React context the text direction. I can have 2 values:
|
|
34
|
+
* `ltr`, `rtl`. Its default value is the document's `dir` value, if
|
|
35
|
+
* this is not given then `ltr`. For more info on the values see
|
|
36
|
+
* [mdn](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).
|
|
37
|
+
* If its set to `ltr` or `rtl` then some InstUI components (e.g.
|
|
38
|
+
* [DrawerLayout](#DrawerLayout) will automatically orient based on its value.
|
|
39
|
+
*
|
|
40
|
+
* @module TextDirectionContext
|
|
41
|
+
*/
|
|
28
42
|
const TextDirectionContext = createContext(getTextDirection() || 'ltr')
|
|
29
43
|
|
|
30
44
|
const DIRECTION = {
|
|
31
45
|
ltr: 'ltr',
|
|
32
46
|
rtl: 'rtl'
|
|
47
|
+
//TODO add auto: 'auto' in the future
|
|
33
48
|
}
|
|
34
49
|
|
|
35
50
|
export default TextDirectionContext
|
package/src/bidirectional.tsx
CHANGED
|
@@ -31,7 +31,7 @@ import hoistNonReactStatics from 'hoist-non-react-statics'
|
|
|
31
31
|
// that uses the bidirectional decorator.
|
|
32
32
|
// see https://github.com/microsoft/TypeScript/issues/4881
|
|
33
33
|
export type BidirectionalProps = {
|
|
34
|
-
dir?: 'ltr' | 'rtl'
|
|
34
|
+
dir?: 'ltr' | 'rtl' // TODO add | 'auto' in the future
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
type BidirectionalInternalProps = {
|
|
@@ -47,6 +47,9 @@ type BidirectionalType = {
|
|
|
47
47
|
* ---
|
|
48
48
|
* category: utilities/i18n
|
|
49
49
|
* ---
|
|
50
|
+
*
|
|
51
|
+
* #### DEPRECATED: This has been renamed to `textDirectionContextConsumer`, its functionality remains similar.
|
|
52
|
+
*
|
|
50
53
|
* A decorator or higher order component that makes a component `bidirectional`.
|
|
51
54
|
*
|
|
52
55
|
* As a HOC:
|
|
@@ -63,8 +66,8 @@ type BidirectionalType = {
|
|
|
63
66
|
* export default bidirectional()(Example)
|
|
64
67
|
* ```
|
|
65
68
|
*
|
|
66
|
-
* When used as a child of [
|
|
67
|
-
* the direction provided in
|
|
69
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
70
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
68
71
|
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
69
72
|
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
70
73
|
* if it is not present.
|
|
@@ -76,11 +79,18 @@ const bidirectional: BidirectionalType = decorator((ComposedComponent) => {
|
|
|
76
79
|
class BidirectionalComponent extends React.Component<BidirectionalInternalProps> {
|
|
77
80
|
render() {
|
|
78
81
|
const { forwardedRef, ...rest } = this.props
|
|
82
|
+
// Quite complex code, this is the priority order of applying the `dir` prop:
|
|
83
|
+
// 1. The highest priority is adding it via a prop
|
|
84
|
+
// 2. If there is a <TextDirectionContext.Provider> (or <ApplyTextDirection>
|
|
85
|
+
// which uses it) above the @bidirectional in the DOM, use its value.
|
|
86
|
+
// 3. If TextDirectionContext.Provider was called without params
|
|
87
|
+
// TextDirectionContext calls getTextDirection() which returns
|
|
88
|
+
// the 'dir' prop of the HTML document element.
|
|
79
89
|
return (
|
|
80
90
|
<TextDirectionContext.Consumer>
|
|
81
|
-
{(dir) =>
|
|
82
|
-
<ComposedComponent ref={forwardedRef} dir={dir} {...rest} />
|
|
83
|
-
|
|
91
|
+
{(dir) => {
|
|
92
|
+
return <ComposedComponent ref={forwardedRef} dir={dir} {...rest} />
|
|
93
|
+
}}
|
|
84
94
|
</TextDirectionContext.Consumer>
|
|
85
95
|
)
|
|
86
96
|
}
|
|
@@ -103,5 +113,6 @@ const bidirectional: BidirectionalType = decorator((ComposedComponent) => {
|
|
|
103
113
|
}) as BidirectionalType
|
|
104
114
|
|
|
105
115
|
bidirectional.DIRECTION = DIRECTION
|
|
116
|
+
|
|
106
117
|
export default bidirectional
|
|
107
118
|
export { bidirectional }
|
package/src/getTextDirection.ts
CHANGED
|
@@ -64,10 +64,11 @@ const getDefaultDir = () => {
|
|
|
64
64
|
* category: utilities/i18n
|
|
65
65
|
* ---
|
|
66
66
|
*
|
|
67
|
-
* Return the direction ('ltr' or 'rtl') of an element
|
|
67
|
+
* Return the direction ('ltr' or 'rtl' or 'auto') of an element. If no element
|
|
68
|
+
* is given, it returns the document's 'dir' value.
|
|
68
69
|
* @module getTextDirection
|
|
69
70
|
* @param {Element} element will use the <html> element by default
|
|
70
|
-
* @returns {String} 'ltr' or 'rtl' (or `undefined` if no DOM is present)
|
|
71
|
+
* @returns {String} 'ltr' or 'rtl' or 'auto' (or `undefined` if no DOM is present)
|
|
71
72
|
*/
|
|
72
73
|
function getTextDirection(element?: Element) {
|
|
73
74
|
if (canUseDOM) {
|
package/src/index.ts
CHANGED
|
@@ -26,16 +26,15 @@ export { ApplyLocale } from './ApplyLocale'
|
|
|
26
26
|
export { ApplyLocaleContext } from './ApplyLocale/ApplyLocaleContext'
|
|
27
27
|
|
|
28
28
|
export { bidirectional } from './bidirectional'
|
|
29
|
+
export { textDirectionContextConsumer } from './textDirectionContextConsumer'
|
|
29
30
|
export { DateTime } from './DateTime'
|
|
30
31
|
export { getTextDirection } from './getTextDirection'
|
|
31
32
|
export { I18nPropTypes } from './I18nPropTypes'
|
|
32
33
|
export { Locale } from './Locale'
|
|
33
34
|
export { DIRECTION, TextDirectionContext } from './TextDirectionContext'
|
|
34
|
-
export {
|
|
35
|
-
useTextDirectionContext,
|
|
36
|
-
ApplyTextDirection
|
|
37
|
-
} from './ApplyTextDirection'
|
|
35
|
+
export { ApplyTextDirection } from './ApplyTextDirection'
|
|
38
36
|
|
|
37
|
+
export type { Moment } from './DateTime'
|
|
39
38
|
export type { BidirectionalProps } from './bidirectional'
|
|
40
39
|
export type { ApplyLocaleProps } from './ApplyLocale/props'
|
|
41
40
|
export type { ApplyTextDirectionProps } from './ApplyTextDirection/props'
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* The MIT License (MIT)
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) 2015 - present Instructure, Inc.
|
|
5
|
+
*
|
|
6
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
8
|
+
* in the Software without restriction, including without limitation the rights
|
|
9
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
11
|
+
* furnished to do so, subject to the following conditions:
|
|
12
|
+
*
|
|
13
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
14
|
+
* copies or substantial portions of the Software.
|
|
15
|
+
*
|
|
16
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
+
* SOFTWARE.
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
import { bidirectional } from './bidirectional'
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* ---
|
|
29
|
+
* category: utilities/i18n
|
|
30
|
+
* ---
|
|
31
|
+
*
|
|
32
|
+
* A decorator or higher order component that supplies the text direction to
|
|
33
|
+
* components.
|
|
34
|
+
*
|
|
35
|
+
* As a HOC:
|
|
36
|
+
*
|
|
37
|
+
* ```js
|
|
38
|
+
* import { textDirectionContextConsumer } from '@instructure/ui-i18n'
|
|
39
|
+
*
|
|
40
|
+
* class Example extends React.Component {
|
|
41
|
+
* render () {
|
|
42
|
+
* return this.props.dir === textDirectionContextConsumer.DIRECTION.rtl ? <div>rtl</div> : <div>ltr</div>
|
|
43
|
+
* }
|
|
44
|
+
* }
|
|
45
|
+
*
|
|
46
|
+
* export default textDirectionContextConsumer()(Example)
|
|
47
|
+
* ```
|
|
48
|
+
*
|
|
49
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
50
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
51
|
+
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
52
|
+
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
53
|
+
* if it is not present.
|
|
54
|
+
*
|
|
55
|
+
* @module textDirectionContextConsumer
|
|
56
|
+
* @return The decorator that composes the bidirectional component.
|
|
57
|
+
*/
|
|
58
|
+
const textDirectionContextConsumer = bidirectional
|
|
59
|
+
|
|
60
|
+
export default textDirectionContextConsumer
|
|
61
|
+
export { textDirectionContextConsumer }
|
|
@@ -4,6 +4,7 @@ import { ApplyTextDirectionProps } from './props';
|
|
|
4
4
|
---
|
|
5
5
|
category: components/utilities
|
|
6
6
|
---
|
|
7
|
+
DEPRECATED. Please use TextDirectionContext instead.
|
|
7
8
|
@tsProps
|
|
8
9
|
**/
|
|
9
10
|
declare const ApplyTextDirection: {
|
|
@@ -13,11 +14,6 @@ declare const ApplyTextDirection: {
|
|
|
13
14
|
readonly as: "span";
|
|
14
15
|
readonly children: null;
|
|
15
16
|
};
|
|
16
|
-
DIRECTION: {
|
|
17
|
-
ltr: string;
|
|
18
|
-
rtl: string;
|
|
19
|
-
};
|
|
20
17
|
};
|
|
21
|
-
|
|
22
|
-
export { ApplyTextDirection, useTextDirectionContext };
|
|
18
|
+
export { ApplyTextDirection };
|
|
23
19
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ApplyTextDirection/index.tsx"],"names":[],"mappings":";AA4BA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAEjD
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ApplyTextDirection/index.tsx"],"names":[],"mappings":";AA4BA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAA;AAEjD;;;;;;GAMG;AACH,QAAA,MAAM,kBAAkB;YAAW,uBAAuB;;;;;;CAezD,CAAA;AAQD,OAAO,EAAE,kBAAkB,EAAE,CAAA"}
|
|
@@ -1,8 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { AsElementType } from '@instructure/shared-types';
|
|
3
|
+
declare type DirValues = 'ltr' | 'rtl' | 'auto';
|
|
3
4
|
export declare type ApplyTextDirectionProps = {
|
|
4
|
-
|
|
5
|
-
|
|
5
|
+
/**
|
|
6
|
+
* The direction value to use. For values and their effects see
|
|
7
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir
|
|
8
|
+
*/
|
|
9
|
+
dir?: DirValues;
|
|
10
|
+
/**
|
|
11
|
+
* The children of this component. Either a React node or a function
|
|
12
|
+
* that receives 2 parameters (text direction, is rtl direction?) and
|
|
13
|
+
* returns a React node
|
|
14
|
+
*/
|
|
15
|
+
children?: React.ReactNode | ((dir: DirValues, isRtl: boolean) => React.ReactNode);
|
|
6
16
|
as?: AsElementType;
|
|
7
17
|
};
|
|
18
|
+
export {};
|
|
8
19
|
//# sourceMappingURL=props.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/ApplyTextDirection/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEzD,oBAAY,uBAAuB,GAAG;IACpC,GAAG,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/ApplyTextDirection/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEzD,aAAK,SAAS,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,CAAA;AAEvC,oBAAY,uBAAuB,GAAG;IACpC;;;OAGG;IACH,GAAG,CAAC,EAAE,SAAS,CAAA;IACf;;;;OAIG;IACH,QAAQ,CAAC,EACL,KAAK,CAAC,SAAS,GACf,CAAC,CAAC,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;IACzD,EAAE,CAAC,EAAE,aAAa,CAAA;CACnB,CAAA"}
|
package/types/DateTime.d.ts
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
import moment from 'moment-timezone';
|
|
1
|
+
import moment, { Moment } from 'moment-timezone';
|
|
2
2
|
/**
|
|
3
3
|
* ---
|
|
4
4
|
* category: utilities/i18n
|
|
5
5
|
* ---
|
|
6
6
|
* @deprecated
|
|
7
|
-
*
|
|
7
|
+
* #### DEPRECATION WARNING: Will be removed in v9, which wil include a
|
|
8
|
+
* time library agnostic API.
|
|
8
9
|
* A wrapper for [moment](https://momentjs.com/) utils.
|
|
9
10
|
* @module DateTime
|
|
10
11
|
*/
|
|
@@ -35,6 +36,21 @@ declare function isValid(dateString: string): boolean;
|
|
|
35
36
|
* @returns {String} a time zone identifier (see https://en.wikipedia.org/wiki/List_of_tz_database_time_zones)
|
|
36
37
|
*/
|
|
37
38
|
declare function browserTimeZone(): string;
|
|
39
|
+
/**
|
|
40
|
+
* Returns the days of the week in the given locale,
|
|
41
|
+
* for example ["Monday", "Tuesday",..]. It always begins with Monday.
|
|
42
|
+
* @param locale A locale accepted by the browser, e.g. America/New_York
|
|
43
|
+
* @param format If set to 'short' it will be maximum 3 letters long,
|
|
44
|
+
* if set to 'long' it will be the full word.
|
|
45
|
+
*/
|
|
46
|
+
declare function getLocalDayNamesOfTheWeek(locale: string, format: 'short' | 'long'): string[];
|
|
47
|
+
/**
|
|
48
|
+
* Returns the first day of the week in the given locale.
|
|
49
|
+
* The locale decides what is the first day, e.g. Sunday in the US, Monday in
|
|
50
|
+
* the EU.
|
|
51
|
+
* @param date A Moment Datetime object
|
|
52
|
+
*/
|
|
53
|
+
declare function getFirstDayOfWeek(date: Moment): moment.Moment;
|
|
38
54
|
/**
|
|
39
55
|
* Return a localized date + time with timezone as a ISO 8601 string
|
|
40
56
|
* @param {String} dateString
|
|
@@ -50,7 +66,10 @@ declare const DateTime: {
|
|
|
50
66
|
browserTimeZone: typeof browserTimeZone;
|
|
51
67
|
isValid: typeof isValid;
|
|
52
68
|
toLocaleString: typeof toLocaleString;
|
|
69
|
+
getFirstDayOfWeek: typeof getFirstDayOfWeek;
|
|
70
|
+
getLocalDayNamesOfTheWeek: typeof getLocalDayNamesOfTheWeek;
|
|
53
71
|
};
|
|
54
72
|
export default DateTime;
|
|
55
73
|
export { DateTime };
|
|
74
|
+
export type { Moment };
|
|
56
75
|
//# sourceMappingURL=DateTime.d.ts.map
|
package/types/DateTime.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTime.d.ts","sourceRoot":"","sources":["../src/DateTime.ts"],"names":[],"mappings":"AAwBA,OAAO,MAAM,MAAM,iBAAiB,CAAA;
|
|
1
|
+
{"version":3,"file":"DateTime.d.ts","sourceRoot":"","sources":["../src/DateTime.ts"],"names":[],"mappings":"AAwBA,OAAO,MAAM,EAAE,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AAEhD;;;;;;;;;GASG;AAEH;;;;;GAKG;AACH,iBAAS,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,iBAG5C;AAED;;;;;;GAMG;AACH,iBAAS,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,iBASlE;AAED;;;;GAIG;AACH,iBAAS,OAAO,CAAC,UAAU,EAAE,MAAM,WAElC;AAED;;;;GAIG;AACH,iBAAS,eAAe,WAEvB;AAED;;;;;;GAMG;AACH,iBAAS,yBAAyB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,MAAM,YAS1E;AAED;;;;;GAKG;AACH,iBAAS,iBAAiB,CAAC,IAAI,EAAE,MAAM,iBAEtC;AAED;;;;;;;GAOG;AACH,iBAAS,cAAc,CACrB,UAAU,EAAE,MAAM,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,MAAM,EAChB,MAAM,CAAC,EAAE,MAAM,UAKhB;AAOD,QAAA,MAAM,QAAQ;;;;;;;;CAQb,CAAA;AAED,eAAe,QAAQ,CAAA;AACvB,OAAO,EAAE,QAAQ,EAAE,CAAA;AACnB,YAAY,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -1,4 +1,18 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/**
|
|
3
|
+
* ---
|
|
4
|
+
* category: utilities/i18n
|
|
5
|
+
* ---
|
|
6
|
+
*
|
|
7
|
+
* This React context the text direction. I can have 2 values:
|
|
8
|
+
* `ltr`, `rtl`. Its default value is the document's `dir` value, if
|
|
9
|
+
* this is not given then `ltr`. For more info on the values see
|
|
10
|
+
* [mdn](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir).
|
|
11
|
+
* If its set to `ltr` or `rtl` then some InstUI components (e.g.
|
|
12
|
+
* [DrawerLayout](#DrawerLayout) will automatically orient based on its value.
|
|
13
|
+
*
|
|
14
|
+
* @module TextDirectionContext
|
|
15
|
+
*/
|
|
2
16
|
declare const TextDirectionContext: import("react").Context<"ltr" | "rtl" | "auto">;
|
|
3
17
|
declare const DIRECTION: {
|
|
4
18
|
ltr: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextDirectionContext.d.ts","sourceRoot":"","sources":["../src/TextDirectionContext.ts"],"names":[],"mappings":";AA2BA,QAAA,MAAM,oBAAoB,iDAA6C,CAAA;AAEvE,QAAA,MAAM,SAAS;;;
|
|
1
|
+
{"version":3,"file":"TextDirectionContext.d.ts","sourceRoot":"","sources":["../src/TextDirectionContext.ts"],"names":[],"mappings":";AA2BA;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,oBAAoB,iDAA6C,CAAA;AAEvE,QAAA,MAAM,SAAS;;;CAId,CAAA;AAED,eAAe,oBAAoB,CAAA;AACnC,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,CAAA"}
|
package/types/bidirectional.d.ts
CHANGED
|
@@ -10,6 +10,9 @@ declare type BidirectionalType = {
|
|
|
10
10
|
* ---
|
|
11
11
|
* category: utilities/i18n
|
|
12
12
|
* ---
|
|
13
|
+
*
|
|
14
|
+
* #### DEPRECATED: This has been renamed to `textDirectionContextConsumer`, its functionality remains similar.
|
|
15
|
+
*
|
|
13
16
|
* A decorator or higher order component that makes a component `bidirectional`.
|
|
14
17
|
*
|
|
15
18
|
* As a HOC:
|
|
@@ -26,8 +29,8 @@ declare type BidirectionalType = {
|
|
|
26
29
|
* export default bidirectional()(Example)
|
|
27
30
|
* ```
|
|
28
31
|
*
|
|
29
|
-
* When used as a child of [
|
|
30
|
-
* the direction provided in
|
|
32
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
33
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
31
34
|
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
32
35
|
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
33
36
|
* if it is not present.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bidirectional.d.ts","sourceRoot":"","sources":["../src/bidirectional.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAAE,SAAS,EAAwB,MAAM,wBAAwB,CAAA;AAOxE,oBAAY,kBAAkB,GAAG;IAC/B,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAA;CACpB,CAAA;AAMD,aAAK,iBAAiB,GAAG;IAEvB,IAAI,CAAC,iBAAiB,EAAE,GAAG,KAAK,GAAG,CAAA;IACnC,SAAS,EAAE,OAAO,SAAS,CAAA;CAC5B,CAAA;AACD
|
|
1
|
+
{"version":3,"file":"bidirectional.d.ts","sourceRoot":"","sources":["../src/bidirectional.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAAE,SAAS,EAAwB,MAAM,wBAAwB,CAAA;AAOxE,oBAAY,kBAAkB,GAAG;IAC/B,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAA;CACpB,CAAA;AAMD,aAAK,iBAAiB,GAAG;IAEvB,IAAI,CAAC,iBAAiB,EAAE,GAAG,KAAK,GAAG,CAAA;IACnC,SAAS,EAAE,OAAO,SAAS,CAAA;CAC5B,CAAA;AACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,QAAA,MAAM,aAAa,EAAE,iBAmCE,CAAA;AAIvB,eAAe,aAAa,CAAA;AAC5B,OAAO,EAAE,aAAa,EAAE,CAAA"}
|
|
@@ -3,10 +3,11 @@
|
|
|
3
3
|
* category: utilities/i18n
|
|
4
4
|
* ---
|
|
5
5
|
*
|
|
6
|
-
* Return the direction ('ltr' or 'rtl') of an element
|
|
6
|
+
* Return the direction ('ltr' or 'rtl' or 'auto') of an element. If no element
|
|
7
|
+
* is given, it returns the document's 'dir' value.
|
|
7
8
|
* @module getTextDirection
|
|
8
9
|
* @param {Element} element will use the <html> element by default
|
|
9
|
-
* @returns {String} 'ltr' or 'rtl' (or `undefined` if no DOM is present)
|
|
10
|
+
* @returns {String} 'ltr' or 'rtl' or 'auto' (or `undefined` if no DOM is present)
|
|
10
11
|
*/
|
|
11
12
|
declare function getTextDirection(element?: Element): "ltr" | "rtl" | "auto" | null | undefined;
|
|
12
13
|
export default getTextDirection;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getTextDirection.d.ts","sourceRoot":"","sources":["../src/getTextDirection.ts"],"names":[],"mappings":"AA6DA
|
|
1
|
+
{"version":3,"file":"getTextDirection.d.ts","sourceRoot":"","sources":["../src/getTextDirection.ts"],"names":[],"mappings":"AA6DA;;;;;;;;;;GAUG;AACH,iBAAS,gBAAgB,CAAC,OAAO,CAAC,EAAE,OAAO,6CAU1C;AACD,eAAe,gBAAgB,CAAA;AAC/B,OAAO,EAAE,gBAAgB,EAAE,CAAA"}
|
package/types/index.d.ts
CHANGED
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
export { ApplyLocale } from './ApplyLocale';
|
|
2
2
|
export { ApplyLocaleContext } from './ApplyLocale/ApplyLocaleContext';
|
|
3
3
|
export { bidirectional } from './bidirectional';
|
|
4
|
+
export { textDirectionContextConsumer } from './textDirectionContextConsumer';
|
|
4
5
|
export { DateTime } from './DateTime';
|
|
5
6
|
export { getTextDirection } from './getTextDirection';
|
|
6
7
|
export { I18nPropTypes } from './I18nPropTypes';
|
|
7
8
|
export { Locale } from './Locale';
|
|
8
9
|
export { DIRECTION, TextDirectionContext } from './TextDirectionContext';
|
|
9
|
-
export {
|
|
10
|
+
export { ApplyTextDirection } from './ApplyTextDirection';
|
|
11
|
+
export type { Moment } from './DateTime';
|
|
10
12
|
export type { BidirectionalProps } from './bidirectional';
|
|
11
13
|
export type { ApplyLocaleProps } from './ApplyLocale/props';
|
|
12
14
|
export type { ApplyTextDirectionProps } from './ApplyTextDirection/props';
|
package/types/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAA;AAErE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAA;AAErE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAA;AAC7E,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAEzD,YAAY,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACxC,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACzD,YAAY,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAA;AAC3D,YAAY,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAA"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ---
|
|
3
|
+
* category: utilities/i18n
|
|
4
|
+
* ---
|
|
5
|
+
*
|
|
6
|
+
* A decorator or higher order component that supplies the text direction to
|
|
7
|
+
* components.
|
|
8
|
+
*
|
|
9
|
+
* As a HOC:
|
|
10
|
+
*
|
|
11
|
+
* ```js
|
|
12
|
+
* import { textDirectionContextConsumer } from '@instructure/ui-i18n'
|
|
13
|
+
*
|
|
14
|
+
* class Example extends React.Component {
|
|
15
|
+
* render () {
|
|
16
|
+
* return this.props.dir === textDirectionContextConsumer.DIRECTION.rtl ? <div>rtl</div> : <div>ltr</div>
|
|
17
|
+
* }
|
|
18
|
+
* }
|
|
19
|
+
*
|
|
20
|
+
* export default textDirectionContextConsumer()(Example)
|
|
21
|
+
* ```
|
|
22
|
+
*
|
|
23
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
24
|
+
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
25
|
+
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
26
|
+
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
27
|
+
* if it is not present.
|
|
28
|
+
*
|
|
29
|
+
* @module textDirectionContextConsumer
|
|
30
|
+
* @return The decorator that composes the bidirectional component.
|
|
31
|
+
*/
|
|
32
|
+
declare const textDirectionContextConsumer: {
|
|
33
|
+
(): (ComposedComponent: any) => any;
|
|
34
|
+
DIRECTION: {
|
|
35
|
+
ltr: string;
|
|
36
|
+
rtl: string;
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
export default textDirectionContextConsumer;
|
|
40
|
+
export { textDirectionContextConsumer };
|
|
41
|
+
//# sourceMappingURL=textDirectionContextConsumer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textDirectionContextConsumer.d.ts","sourceRoot":"","sources":["../src/textDirectionContextConsumer.tsx"],"names":[],"mappings":"AA0BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,QAAA,MAAM,4BAA4B;;;;;;CAAgB,CAAA;AAElD,eAAe,4BAA4B,CAAA;AAC3C,OAAO,EAAE,4BAA4B,EAAE,CAAA"}
|