@instructure/ui-i18n 8.56.0 → 9.0.1-snapshot-0
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/CHANGELOG.md +16 -0
- package/README.md +0 -1
- package/es/index.js +1 -3
- package/es/textDirectionContextConsumer.js +56 -6
- package/lib/index.js +1 -15
- package/lib/textDirectionContextConsumer.js +58 -6
- package/package.json +9 -9
- package/src/index.ts +1 -4
- package/src/textDirectionContextConsumer.tsx +89 -5
- package/tsconfig.build.tsbuildinfo +1 -1
- package/types/index.d.ts +1 -4
- package/types/index.d.ts.map +1 -1
- package/types/textDirectionContextConsumer.d.ts +13 -10
- package/types/textDirectionContextConsumer.d.ts.map +1 -1
- package/es/ApplyTextDirection/index.js +0 -49
- package/es/ApplyTextDirection/props.js +0 -1
- package/es/bidirectional.js +0 -111
- package/lib/ApplyTextDirection/index.js +0 -56
- package/lib/ApplyTextDirection/props.js +0 -5
- package/lib/bidirectional.js +0 -117
- package/src/ApplyTextDirection/README.md +0 -62
- package/src/ApplyTextDirection/index.tsx +0 -60
- package/src/ApplyTextDirection/props.ts +0 -45
- package/src/bidirectional.tsx +0 -138
- package/types/ApplyTextDirection/index.d.ts +0 -18
- package/types/ApplyTextDirection/index.d.ts.map +0 -1
- package/types/ApplyTextDirection/props.d.ts +0 -19
- package/types/ApplyTextDirection/props.d.ts.map +0 -1
- package/types/bidirectional.d.ts +0 -45
- package/types/bidirectional.d.ts.map +0 -1
package/types/index.d.ts
CHANGED
|
@@ -1,15 +1,12 @@
|
|
|
1
1
|
export { ApplyLocale } from './ApplyLocale';
|
|
2
2
|
export { ApplyLocaleContext } from './ApplyLocale/ApplyLocaleContext';
|
|
3
|
-
export { bidirectional } from './bidirectional';
|
|
4
3
|
export { textDirectionContextConsumer } from './textDirectionContextConsumer';
|
|
5
4
|
export { DateTime } from './DateTime';
|
|
6
5
|
export { getTextDirection } from './getTextDirection';
|
|
7
6
|
export { I18nPropTypes } from './I18nPropTypes';
|
|
8
7
|
export { Locale } from './Locale';
|
|
9
8
|
export { DIRECTION, TextDirectionContext } from './TextDirectionContext';
|
|
10
|
-
export { ApplyTextDirection } from './ApplyTextDirection';
|
|
11
9
|
export type { Moment } from './DateTime';
|
|
12
|
-
export type {
|
|
10
|
+
export type { TextDirectionContextConsumerProps } from './textDirectionContextConsumer';
|
|
13
11
|
export type { ApplyLocaleProps } from './ApplyLocale/props';
|
|
14
|
-
export type { ApplyTextDirectionProps } from './ApplyTextDirection/props';
|
|
15
12
|
//# sourceMappingURL=index.d.ts.map
|
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,
|
|
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,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;AAExE,YAAY,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACxC,YAAY,EAAE,iCAAiC,EAAE,MAAM,gCAAgC,CAAA;AACvF,YAAY,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAA"}
|
|
@@ -1,3 +1,12 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
import { DIRECTION } from './TextDirectionContext';
|
|
3
|
+
export type TextDirectionContextConsumerProps = PropsWithChildren<{
|
|
4
|
+
dir?: 'ltr' | 'rtl';
|
|
5
|
+
}>;
|
|
6
|
+
type TextDirectionContextConsumerType = {
|
|
7
|
+
(): (ComposedComponent: any) => any;
|
|
8
|
+
DIRECTION: typeof DIRECTION;
|
|
9
|
+
};
|
|
1
10
|
/**
|
|
2
11
|
* ---
|
|
3
12
|
* category: utilities/i18n
|
|
@@ -20,22 +29,16 @@
|
|
|
20
29
|
* export default textDirectionContextConsumer()(Example)
|
|
21
30
|
* ```
|
|
22
31
|
*
|
|
23
|
-
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider),
|
|
32
|
+
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), textDirectionContextConsumer components use
|
|
24
33
|
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
25
34
|
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
26
|
-
*
|
|
35
|
+
* textDirectionContextConsumer components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
27
36
|
* if it is not present.
|
|
28
37
|
*
|
|
29
38
|
* @module textDirectionContextConsumer
|
|
30
|
-
* @return The decorator that composes the
|
|
39
|
+
* @return The decorator that composes the textDirectionContextConsumer component.
|
|
31
40
|
*/
|
|
32
|
-
declare const textDirectionContextConsumer:
|
|
33
|
-
(): (ComposedComponent: any) => any;
|
|
34
|
-
DIRECTION: {
|
|
35
|
-
ltr: string;
|
|
36
|
-
rtl: string;
|
|
37
|
-
};
|
|
38
|
-
};
|
|
41
|
+
declare const textDirectionContextConsumer: TextDirectionContextConsumerType;
|
|
39
42
|
export default textDirectionContextConsumer;
|
|
40
43
|
export { textDirectionContextConsumer };
|
|
41
44
|
//# sourceMappingURL=textDirectionContextConsumer.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textDirectionContextConsumer.d.ts","sourceRoot":"","sources":["../src/textDirectionContextConsumer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"textDirectionContextConsumer.d.ts","sourceRoot":"","sources":["../src/textDirectionContextConsumer.tsx"],"names":[],"mappings":"AAuBA,OAAc,EAA4B,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAO1E,OAAO,EAAE,SAAS,EAAwB,MAAM,wBAAwB,CAAA;AAOxE,MAAM,MAAM,iCAAiC,GAAG,iBAAiB,CAAC;IAChE,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAA;CACpB,CAAC,CAAA;AAMF,KAAK,gCAAgC,GAAG;IAEtC,IAAI,CAAC,iBAAiB,EAAE,GAAG,KAAK,GAAG,CAAA;IACnC,SAAS,EAAE,OAAO,SAAS,CAAA;CAC5B,CAAA;AACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,QAAA,MAAM,4BAA4B,EAAE,gCA0DI,CAAA;AAIxC,eAAe,4BAA4B,CAAA;AAC3C,OAAO,EAAE,4BAA4B,EAAE,CAAA"}
|
|
@@ -1,49 +0,0 @@
|
|
|
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 React, { useContext } from 'react';
|
|
26
|
-
import { getElementType } from '@instructure/ui-react-utils';
|
|
27
|
-
import { DIRECTION, TextDirectionContext } from '../TextDirectionContext';
|
|
28
|
-
/**
|
|
29
|
-
---
|
|
30
|
-
category: components/utilities
|
|
31
|
-
---
|
|
32
|
-
DEPRECATED. Please use TextDirectionContext instead.
|
|
33
|
-
**/
|
|
34
|
-
const ApplyTextDirection = props => {
|
|
35
|
-
const context = useContext(TextDirectionContext);
|
|
36
|
-
const dir = props.dir || context;
|
|
37
|
-
const ElementType = getElementType(ApplyTextDirection, props);
|
|
38
|
-
return /*#__PURE__*/React.createElement(TextDirectionContext.Provider, {
|
|
39
|
-
value: dir
|
|
40
|
-
}, /*#__PURE__*/React.createElement(ElementType, {
|
|
41
|
-
dir: dir
|
|
42
|
-
}, typeof props.children === 'function' ? props.children(dir, dir === DIRECTION.rtl) : props.children));
|
|
43
|
-
};
|
|
44
|
-
ApplyTextDirection.defaultProps = {
|
|
45
|
-
dir: void 0,
|
|
46
|
-
as: 'span',
|
|
47
|
-
children: null
|
|
48
|
-
};
|
|
49
|
-
export { ApplyTextDirection };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/es/bidirectional.js
DELETED
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
|
-
const _excluded = ["forwardedRef"];
|
|
3
|
-
/*
|
|
4
|
-
* The MIT License (MIT)
|
|
5
|
-
*
|
|
6
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
7
|
-
*
|
|
8
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
9
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
10
|
-
* in the Software without restriction, including without limitation the rights
|
|
11
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
12
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
13
|
-
* furnished to do so, subject to the following conditions:
|
|
14
|
-
*
|
|
15
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
16
|
-
* copies or substantial portions of the Software.
|
|
17
|
-
*
|
|
18
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
19
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
20
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
21
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
22
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
23
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
24
|
-
* SOFTWARE.
|
|
25
|
-
*/
|
|
26
|
-
import React, { forwardRef } from 'react';
|
|
27
|
-
import { decorator } from '@instructure/ui-decorator';
|
|
28
|
-
import { DIRECTION, TextDirectionContext } from './TextDirectionContext';
|
|
29
|
-
import hoistNonReactStatics from 'hoist-non-react-statics';
|
|
30
|
-
|
|
31
|
-
// This is a workaround because TS cannot take type information from
|
|
32
|
-
// decorators into account. This type needs to be added to every component,
|
|
33
|
-
// that uses the bidirectional decorator.
|
|
34
|
-
// see https://github.com/microsoft/TypeScript/issues/4881
|
|
35
|
-
/**
|
|
36
|
-
* ---
|
|
37
|
-
* category: utilities/i18n
|
|
38
|
-
* ---
|
|
39
|
-
*
|
|
40
|
-
* #### DEPRECATED: This has been renamed to `textDirectionContextConsumer`, its functionality remains similar.
|
|
41
|
-
*
|
|
42
|
-
* A decorator or higher order component that makes a component `bidirectional`.
|
|
43
|
-
*
|
|
44
|
-
* As a HOC:
|
|
45
|
-
*
|
|
46
|
-
* ```js-code
|
|
47
|
-
* import { bidirectional } from '@instructure/ui-i18n'
|
|
48
|
-
*
|
|
49
|
-
* class Example extends React.Component {
|
|
50
|
-
* render () {
|
|
51
|
-
* return this.props.dir === bidirectional.DIRECTION.rtl ? <div>rtl</div> : <div>ltr</div>
|
|
52
|
-
* }
|
|
53
|
-
* }
|
|
54
|
-
*
|
|
55
|
-
* export default bidirectional()(Example)
|
|
56
|
-
* ```
|
|
57
|
-
*
|
|
58
|
-
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
59
|
-
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
60
|
-
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
61
|
-
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
62
|
-
* if it is not present.
|
|
63
|
-
*
|
|
64
|
-
* @module bidirectional
|
|
65
|
-
* @return The decorator that composes the bidirectional component.
|
|
66
|
-
*/
|
|
67
|
-
const bidirectional = decorator(ComposedComponent => {
|
|
68
|
-
class BidirectionalComponent extends React.Component {
|
|
69
|
-
render() {
|
|
70
|
-
const _this$props = this.props,
|
|
71
|
-
forwardedRef = _this$props.forwardedRef,
|
|
72
|
-
rest = _objectWithoutProperties(_this$props, _excluded);
|
|
73
|
-
// Quite complex code, this is the priority order of applying the `dir` prop:
|
|
74
|
-
// 1. The highest priority is adding it via a prop
|
|
75
|
-
// 2. If there is a <TextDirectionContext.Provider> (or <ApplyTextDirection>
|
|
76
|
-
// which uses it) above the @bidirectional in the DOM, use its value.
|
|
77
|
-
// 3. If TextDirectionContext.Provider was called without params
|
|
78
|
-
// TextDirectionContext calls getTextDirection() which returns
|
|
79
|
-
// the 'dir' prop of the HTML document element.
|
|
80
|
-
return /*#__PURE__*/React.createElement(TextDirectionContext.Consumer, null, dir => {
|
|
81
|
-
if (process.env.NODE_ENV !== 'production' && dir === 'auto') {}
|
|
82
|
-
return /*#__PURE__*/React.createElement(ComposedComponent, Object.assign({
|
|
83
|
-
ref: forwardedRef,
|
|
84
|
-
dir: dir
|
|
85
|
-
}, rest));
|
|
86
|
-
});
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
BidirectionalComponent.displayName = "BidirectionalComponent";
|
|
90
|
-
const BidirectionalForwardingRef = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/React.createElement(BidirectionalComponent, Object.assign({}, props, {
|
|
91
|
-
forwardedRef: ref
|
|
92
|
-
})));
|
|
93
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
94
|
-
const displayName = ComposedComponent.displayName || ComposedComponent.name;
|
|
95
|
-
BidirectionalForwardingRef.displayName = `BidirectionalForwardingRef(${displayName})`;
|
|
96
|
-
}
|
|
97
|
-
hoistNonReactStatics(BidirectionalForwardingRef, ComposedComponent);
|
|
98
|
-
BidirectionalForwardingRef.defaultProps = ComposedComponent.defaultProps;
|
|
99
|
-
// eslint-disable-next-line react/forbid-foreign-prop-types
|
|
100
|
-
BidirectionalForwardingRef.propTypes = ComposedComponent.propTypes;
|
|
101
|
-
// @ts-expect-error These static fields exist on InstUI components
|
|
102
|
-
BidirectionalForwardingRef.allowedProps = ComposedComponent.allowedProps;
|
|
103
|
-
|
|
104
|
-
// added so it can be tested with ReactTestUtils
|
|
105
|
-
// more info: https://github.com/facebook/react/issues/13455
|
|
106
|
-
BidirectionalForwardingRef.originalType = ComposedComponent.originalType || ComposedComponent;
|
|
107
|
-
return BidirectionalForwardingRef;
|
|
108
|
-
});
|
|
109
|
-
bidirectional.DIRECTION = DIRECTION;
|
|
110
|
-
export default bidirectional;
|
|
111
|
-
export { bidirectional };
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.ApplyTextDirection = void 0;
|
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js");
|
|
10
|
-
var _TextDirectionContext = require("../TextDirectionContext");
|
|
11
|
-
/*
|
|
12
|
-
* The MIT License (MIT)
|
|
13
|
-
*
|
|
14
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
15
|
-
*
|
|
16
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
17
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
18
|
-
* in the Software without restriction, including without limitation the rights
|
|
19
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
20
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
21
|
-
* furnished to do so, subject to the following conditions:
|
|
22
|
-
*
|
|
23
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
24
|
-
* copies or substantial portions of the Software.
|
|
25
|
-
*
|
|
26
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
27
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
28
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
29
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
30
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
31
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
32
|
-
* SOFTWARE.
|
|
33
|
-
*/
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
---
|
|
37
|
-
category: components/utilities
|
|
38
|
-
---
|
|
39
|
-
DEPRECATED. Please use TextDirectionContext instead.
|
|
40
|
-
**/
|
|
41
|
-
const ApplyTextDirection = props => {
|
|
42
|
-
const context = (0, _react.useContext)(_TextDirectionContext.TextDirectionContext);
|
|
43
|
-
const dir = props.dir || context;
|
|
44
|
-
const ElementType = (0, _getElementType.getElementType)(ApplyTextDirection, props);
|
|
45
|
-
return /*#__PURE__*/_react.default.createElement(_TextDirectionContext.TextDirectionContext.Provider, {
|
|
46
|
-
value: dir
|
|
47
|
-
}, /*#__PURE__*/_react.default.createElement(ElementType, {
|
|
48
|
-
dir: dir
|
|
49
|
-
}, typeof props.children === 'function' ? props.children(dir, dir === _TextDirectionContext.DIRECTION.rtl) : props.children));
|
|
50
|
-
};
|
|
51
|
-
exports.ApplyTextDirection = ApplyTextDirection;
|
|
52
|
-
ApplyTextDirection.defaultProps = {
|
|
53
|
-
dir: void 0,
|
|
54
|
-
as: 'span',
|
|
55
|
-
children: null
|
|
56
|
-
};
|
package/lib/bidirectional.js
DELETED
|
@@ -1,117 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.default = exports.bidirectional = void 0;
|
|
9
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
var _decorator = require("@instructure/ui-decorator/lib/decorator.js");
|
|
12
|
-
var _TextDirectionContext = require("./TextDirectionContext");
|
|
13
|
-
var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
|
|
14
|
-
const _excluded = ["forwardedRef"];
|
|
15
|
-
/*
|
|
16
|
-
* The MIT License (MIT)
|
|
17
|
-
*
|
|
18
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
19
|
-
*
|
|
20
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
21
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
22
|
-
* in the Software without restriction, including without limitation the rights
|
|
23
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
24
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
25
|
-
* furnished to do so, subject to the following conditions:
|
|
26
|
-
*
|
|
27
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
28
|
-
* copies or substantial portions of the Software.
|
|
29
|
-
*
|
|
30
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
31
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
32
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
33
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
34
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
35
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
36
|
-
* SOFTWARE.
|
|
37
|
-
*/
|
|
38
|
-
// This is a workaround because TS cannot take type information from
|
|
39
|
-
// decorators into account. This type needs to be added to every component,
|
|
40
|
-
// that uses the bidirectional decorator.
|
|
41
|
-
// see https://github.com/microsoft/TypeScript/issues/4881
|
|
42
|
-
/**
|
|
43
|
-
* ---
|
|
44
|
-
* category: utilities/i18n
|
|
45
|
-
* ---
|
|
46
|
-
*
|
|
47
|
-
* #### DEPRECATED: This has been renamed to `textDirectionContextConsumer`, its functionality remains similar.
|
|
48
|
-
*
|
|
49
|
-
* A decorator or higher order component that makes a component `bidirectional`.
|
|
50
|
-
*
|
|
51
|
-
* As a HOC:
|
|
52
|
-
*
|
|
53
|
-
* ```js-code
|
|
54
|
-
* import { bidirectional } from '@instructure/ui-i18n'
|
|
55
|
-
*
|
|
56
|
-
* class Example extends React.Component {
|
|
57
|
-
* render () {
|
|
58
|
-
* return this.props.dir === bidirectional.DIRECTION.rtl ? <div>rtl</div> : <div>ltr</div>
|
|
59
|
-
* }
|
|
60
|
-
* }
|
|
61
|
-
*
|
|
62
|
-
* export default bidirectional()(Example)
|
|
63
|
-
* ```
|
|
64
|
-
*
|
|
65
|
-
* When used as a child of [InstUISettingsProvider](#InstUISettingsProvider), bidirectional components use
|
|
66
|
-
* the direction provided in `TextDirectionContext`. When used without [InstUISettingsProvider](#InstUISettingsProvider),
|
|
67
|
-
* the direction can be supplied explicitly via the `dir` prop. If no `dir` prop is provided,
|
|
68
|
-
* bidirectional components query the documentElement for the `dir` attribute, defaulting to `ltr`
|
|
69
|
-
* if it is not present.
|
|
70
|
-
*
|
|
71
|
-
* @module bidirectional
|
|
72
|
-
* @return The decorator that composes the bidirectional component.
|
|
73
|
-
*/
|
|
74
|
-
const bidirectional = exports.bidirectional = (0, _decorator.decorator)(ComposedComponent => {
|
|
75
|
-
class BidirectionalComponent extends _react.default.Component {
|
|
76
|
-
render() {
|
|
77
|
-
const _this$props = this.props,
|
|
78
|
-
forwardedRef = _this$props.forwardedRef,
|
|
79
|
-
rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
|
|
80
|
-
// Quite complex code, this is the priority order of applying the `dir` prop:
|
|
81
|
-
// 1. The highest priority is adding it via a prop
|
|
82
|
-
// 2. If there is a <TextDirectionContext.Provider> (or <ApplyTextDirection>
|
|
83
|
-
// which uses it) above the @bidirectional in the DOM, use its value.
|
|
84
|
-
// 3. If TextDirectionContext.Provider was called without params
|
|
85
|
-
// TextDirectionContext calls getTextDirection() which returns
|
|
86
|
-
// the 'dir' prop of the HTML document element.
|
|
87
|
-
return /*#__PURE__*/_react.default.createElement(_TextDirectionContext.TextDirectionContext.Consumer, null, dir => {
|
|
88
|
-
if (process.env.NODE_ENV !== 'production' && dir === 'auto') {}
|
|
89
|
-
return /*#__PURE__*/_react.default.createElement(ComposedComponent, Object.assign({
|
|
90
|
-
ref: forwardedRef,
|
|
91
|
-
dir: dir
|
|
92
|
-
}, rest));
|
|
93
|
-
});
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
BidirectionalComponent.displayName = "BidirectionalComponent";
|
|
97
|
-
const BidirectionalForwardingRef = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => /*#__PURE__*/_react.default.createElement(BidirectionalComponent, Object.assign({}, props, {
|
|
98
|
-
forwardedRef: ref
|
|
99
|
-
})));
|
|
100
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
101
|
-
const displayName = ComposedComponent.displayName || ComposedComponent.name;
|
|
102
|
-
BidirectionalForwardingRef.displayName = `BidirectionalForwardingRef(${displayName})`;
|
|
103
|
-
}
|
|
104
|
-
(0, _hoistNonReactStatics.default)(BidirectionalForwardingRef, ComposedComponent);
|
|
105
|
-
BidirectionalForwardingRef.defaultProps = ComposedComponent.defaultProps;
|
|
106
|
-
// eslint-disable-next-line react/forbid-foreign-prop-types
|
|
107
|
-
BidirectionalForwardingRef.propTypes = ComposedComponent.propTypes;
|
|
108
|
-
// @ts-expect-error These static fields exist on InstUI components
|
|
109
|
-
BidirectionalForwardingRef.allowedProps = ComposedComponent.allowedProps;
|
|
110
|
-
|
|
111
|
-
// added so it can be tested with ReactTestUtils
|
|
112
|
-
// more info: https://github.com/facebook/react/issues/13455
|
|
113
|
-
BidirectionalForwardingRef.originalType = ComposedComponent.originalType || ComposedComponent;
|
|
114
|
-
return BidirectionalForwardingRef;
|
|
115
|
-
});
|
|
116
|
-
bidirectional.DIRECTION = _TextDirectionContext.DIRECTION;
|
|
117
|
-
var _default = exports.default = bidirectional;
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
describes: ApplyTextDirection
|
|
3
|
-
---
|
|
4
|
-
|
|
5
|
-
#### DEPRECATED
|
|
6
|
-
|
|
7
|
-
Please use [TextDirectionContext](#TextDirectionContext) instead.
|
|
8
|
-
|
|
9
|
-
A utility component used to manage text direction. In addition to appending the `dir` attribute to
|
|
10
|
-
its underlying DOM node, `<ApplyTextDirection />` also creates a direction context which can be
|
|
11
|
-
consumed by child components that have implemented [bidirectional](#bidirectional).
|
|
12
|
-
|
|
13
|
-
If no `dir` prop is supplied, `<ApplyTextDirection />` will fallback to its parent context if it
|
|
14
|
-
exists. Otherwise it queries for and uses the documentElement `dir` attribute and defaults to `ltr`
|
|
15
|
-
if it is not found.
|
|
16
|
-
|
|
17
|
-
```javascript
|
|
18
|
-
---
|
|
19
|
-
type: example
|
|
20
|
-
---
|
|
21
|
-
<ApplyTextDirection dir="rtl">
|
|
22
|
-
<View
|
|
23
|
-
display="block"
|
|
24
|
-
background="primary"
|
|
25
|
-
padding="large"
|
|
26
|
-
borderWidth="none none none large"
|
|
27
|
-
>
|
|
28
|
-
<Heading>Rtl Content</Heading>
|
|
29
|
-
{lorem.paragraph()}
|
|
30
|
-
</View>
|
|
31
|
-
</ApplyTextDirection>
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
For exceptions, `<ApplyTextDirection />` can be nested and override parent context.
|
|
35
|
-
|
|
36
|
-
```javascript
|
|
37
|
-
---
|
|
38
|
-
type: example
|
|
39
|
-
---
|
|
40
|
-
<ApplyTextDirection dir="rtl">
|
|
41
|
-
<View
|
|
42
|
-
display="block"
|
|
43
|
-
background="primary"
|
|
44
|
-
padding="large"
|
|
45
|
-
borderWidth="none none none large"
|
|
46
|
-
>
|
|
47
|
-
<Heading>Rtl Content</Heading>
|
|
48
|
-
{lorem.paragraph()}
|
|
49
|
-
</View>
|
|
50
|
-
<ApplyTextDirection dir="ltr">
|
|
51
|
-
<View
|
|
52
|
-
display="block"
|
|
53
|
-
background="primary"
|
|
54
|
-
padding="large"
|
|
55
|
-
borderWidth="none none none large"
|
|
56
|
-
>
|
|
57
|
-
<Heading>Ltr Content</Heading>
|
|
58
|
-
{lorem.paragraph()}
|
|
59
|
-
</View>
|
|
60
|
-
</ApplyTextDirection>
|
|
61
|
-
</ApplyTextDirection>
|
|
62
|
-
```
|
|
@@ -1,60 +0,0 @@
|
|
|
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 React, { useContext } from 'react'
|
|
26
|
-
import { getElementType } from '@instructure/ui-react-utils'
|
|
27
|
-
|
|
28
|
-
import { DIRECTION, TextDirectionContext } from '../TextDirectionContext'
|
|
29
|
-
import { ApplyTextDirectionProps } from './props'
|
|
30
|
-
|
|
31
|
-
/**
|
|
32
|
-
---
|
|
33
|
-
category: components/utilities
|
|
34
|
-
---
|
|
35
|
-
DEPRECATED. Please use TextDirectionContext instead.
|
|
36
|
-
**/
|
|
37
|
-
const ApplyTextDirection = (props: ApplyTextDirectionProps) => {
|
|
38
|
-
const context = useContext(TextDirectionContext)
|
|
39
|
-
const dir = props.dir || context
|
|
40
|
-
const ElementType = getElementType(ApplyTextDirection, props)
|
|
41
|
-
return (
|
|
42
|
-
<TextDirectionContext.Provider value={dir}>
|
|
43
|
-
{
|
|
44
|
-
<ElementType dir={dir}>
|
|
45
|
-
{typeof props.children === 'function'
|
|
46
|
-
? props.children(dir, dir === DIRECTION.rtl)
|
|
47
|
-
: props.children}
|
|
48
|
-
</ElementType>
|
|
49
|
-
}
|
|
50
|
-
</TextDirectionContext.Provider>
|
|
51
|
-
)
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
ApplyTextDirection.defaultProps = {
|
|
55
|
-
dir: undefined,
|
|
56
|
-
as: 'span',
|
|
57
|
-
children: null
|
|
58
|
-
} as const
|
|
59
|
-
|
|
60
|
-
export { ApplyTextDirection }
|
|
@@ -1,45 +0,0 @@
|
|
|
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 React from 'react'
|
|
26
|
-
import { AsElementType } from '@instructure/shared-types'
|
|
27
|
-
|
|
28
|
-
type DirValues = 'ltr' | 'rtl' | 'auto'
|
|
29
|
-
|
|
30
|
-
export type ApplyTextDirectionProps = {
|
|
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)
|
|
44
|
-
as?: AsElementType
|
|
45
|
-
}
|