@instructure/ui-position 11.6.0 → 11.6.1-pr-snapshot-1779894247159
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 +8 -0
- package/{lib/Position/props.js → babel.config.cjs} +13 -7
- package/package.json +14 -16
- package/lib/Position/index.js +0 -243
- package/lib/Position/styles.js +0 -50
- package/lib/Position/theme.js +0 -45
- package/lib/PositionPropTypes.js +0 -57
- package/lib/calculateElementPosition.js +0 -528
- package/lib/executeMirrorFunction.js +0 -42
- package/lib/index.js +0 -47
- package/lib/mirrorHorizontalPlacement.js +0 -60
- package/lib/mirrorPlacement.js +0 -63
- package/lib/package.json +0 -1
- package/lib/parsePlacement.js +0 -12
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [11.6.1-pr-snapshot-1779894247159](https://github.com/instructure/instructure-ui/compare/v11.6.0...v11.6.1-pr-snapshot-1779894247159) (2026-05-27)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @instructure/ui-position
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
# [11.6.0](https://github.com/instructure/instructure-ui/compare/v11.5.0...v11.6.0) (2026-02-18)
|
|
7
15
|
|
|
8
16
|
**Note:** Version bump only for package @instructure/ui-position
|
|
@@ -1,9 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.allowedProps = void 0;
|
|
7
1
|
/*
|
|
8
2
|
* The MIT License (MIT)
|
|
9
3
|
*
|
|
@@ -28,4 +22,16 @@ exports.allowedProps = void 0;
|
|
|
28
22
|
* SOFTWARE.
|
|
29
23
|
*/
|
|
30
24
|
|
|
31
|
-
|
|
25
|
+
module.exports = {
|
|
26
|
+
presets: [
|
|
27
|
+
[
|
|
28
|
+
require('@instructure/ui-babel-preset'),
|
|
29
|
+
{
|
|
30
|
+
coverage: Boolean(process.env.COVERAGE),
|
|
31
|
+
esModules: Boolean(process.env.ES_MODULES),
|
|
32
|
+
removeConsole: process.env.NODE_ENV === 'production',
|
|
33
|
+
transformImports: Boolean(process.env.TRANSFORM_IMPORTS)
|
|
34
|
+
}
|
|
35
|
+
]
|
|
36
|
+
]
|
|
37
|
+
}
|
package/package.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@instructure/ui-position",
|
|
3
|
-
"version": "11.6.
|
|
3
|
+
"version": "11.6.1-pr-snapshot-1779894247159",
|
|
4
|
+
"type": "module",
|
|
4
5
|
"description": "A component for positioning content with respect to a designated target.",
|
|
5
6
|
"author": "Instructure, Inc. Engineering and Product Design",
|
|
6
7
|
"module": "./es/index.js",
|
|
7
|
-
"main": "./lib/index.js",
|
|
8
8
|
"types": "./types/index.d.ts",
|
|
9
9
|
"repository": {
|
|
10
10
|
"type": "git",
|
|
@@ -15,22 +15,22 @@
|
|
|
15
15
|
"license": "MIT",
|
|
16
16
|
"dependencies": {
|
|
17
17
|
"@babel/runtime": "^7.27.6",
|
|
18
|
-
"@instructure/debounce": "11.6.
|
|
19
|
-
"@instructure/
|
|
20
|
-
"@instructure/
|
|
21
|
-
"@instructure/ui-portal": "11.6.
|
|
22
|
-
"@instructure/
|
|
23
|
-
"@instructure/ui-utils": "11.6.
|
|
24
|
-
"@instructure/
|
|
25
|
-
"@instructure/
|
|
18
|
+
"@instructure/debounce": "11.6.1-pr-snapshot-1779894247159",
|
|
19
|
+
"@instructure/shared-types": "11.6.1-pr-snapshot-1779894247159",
|
|
20
|
+
"@instructure/ui-dom-utils": "11.6.1-pr-snapshot-1779894247159",
|
|
21
|
+
"@instructure/ui-portal": "11.6.1-pr-snapshot-1779894247159",
|
|
22
|
+
"@instructure/emotion": "11.6.1-pr-snapshot-1779894247159",
|
|
23
|
+
"@instructure/ui-react-utils": "11.6.1-pr-snapshot-1779894247159",
|
|
24
|
+
"@instructure/ui-utils": "11.6.1-pr-snapshot-1779894247159",
|
|
25
|
+
"@instructure/uid": "11.6.1-pr-snapshot-1779894247159"
|
|
26
26
|
},
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"@testing-library/jest-dom": "^6.6.3",
|
|
29
29
|
"@testing-library/react": "15.0.7",
|
|
30
30
|
"vitest": "^3.2.2",
|
|
31
|
-
"@instructure/ui-babel-preset": "11.6.
|
|
32
|
-
"@instructure/ui-color-utils": "11.6.
|
|
33
|
-
"@instructure/ui-themes": "11.6.
|
|
31
|
+
"@instructure/ui-babel-preset": "11.6.1-pr-snapshot-1779894247159",
|
|
32
|
+
"@instructure/ui-color-utils": "11.6.1-pr-snapshot-1779894247159",
|
|
33
|
+
"@instructure/ui-themes": "11.6.1-pr-snapshot-1779894247159"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
36
36
|
"react": ">=18 <=19"
|
|
@@ -43,10 +43,8 @@
|
|
|
43
43
|
".": {
|
|
44
44
|
"types": "./types/index.d.ts",
|
|
45
45
|
"import": "./es/index.js",
|
|
46
|
-
"require": "./lib/index.js",
|
|
47
46
|
"default": "./es/index.js"
|
|
48
47
|
},
|
|
49
|
-
"./lib/*": "./lib/*",
|
|
50
48
|
"./es/*": "./es/*",
|
|
51
49
|
"./types/*": "./types/*",
|
|
52
50
|
"./package.json": "./package.json",
|
|
@@ -56,7 +54,7 @@
|
|
|
56
54
|
"lint": "ui-scripts lint",
|
|
57
55
|
"lint:fix": "ui-scripts lint --fix",
|
|
58
56
|
"clean": "ui-scripts clean",
|
|
59
|
-
"build": "ui-scripts build
|
|
57
|
+
"build": "ui-scripts build",
|
|
60
58
|
"build:watch": "pnpm run ts:check -- --watch & ui-scripts build --watch",
|
|
61
59
|
"build:types": "tsc -p tsconfig.build.json",
|
|
62
60
|
"ts:check": "tsc -p tsconfig.build.json --noEmit --emitDeclarationOnly false"
|
package/lib/Position/index.js
DELETED
|
@@ -1,243 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = exports.Position = void 0;
|
|
8
|
-
var _react = require("react");
|
|
9
|
-
var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
|
|
10
|
-
var _ensureSingleChild = require("@instructure/ui-react-utils/lib/ensureSingleChild.js");
|
|
11
|
-
var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
|
|
12
|
-
var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
|
|
13
|
-
var _addPositionChangeListener = require("@instructure/ui-dom-utils/lib/addPositionChangeListener.js");
|
|
14
|
-
var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
|
|
15
|
-
var _deepEqual = require("@instructure/ui-utils/lib/deepEqual.js");
|
|
16
|
-
var _shallowEqual = require("@instructure/ui-utils/lib/shallowEqual.js");
|
|
17
|
-
var _combineDataCid = require("@instructure/ui-utils/lib/combineDataCid.js");
|
|
18
|
-
var _debounce = require("@instructure/debounce");
|
|
19
|
-
var _Portal = require("@instructure/ui-portal/lib/Portal");
|
|
20
|
-
var _emotion = require("@instructure/emotion");
|
|
21
|
-
var _styles = _interopRequireDefault(require("./styles"));
|
|
22
|
-
var _theme = _interopRequireDefault(require("./theme"));
|
|
23
|
-
var _props = require("./props");
|
|
24
|
-
var _calculateElementPosition = require("../calculateElementPosition");
|
|
25
|
-
var _jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
26
|
-
var _dec, _dec2, _class, _Position;
|
|
27
|
-
/*
|
|
28
|
-
* The MIT License (MIT)
|
|
29
|
-
*
|
|
30
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
31
|
-
*
|
|
32
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
33
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
34
|
-
* in the Software without restriction, including without limitation the rights
|
|
35
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
36
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
37
|
-
* furnished to do so, subject to the following conditions:
|
|
38
|
-
*
|
|
39
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
40
|
-
* copies or substantial portions of the Software.
|
|
41
|
-
*
|
|
42
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
43
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
44
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
45
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
46
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
47
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
48
|
-
* SOFTWARE.
|
|
49
|
-
*/
|
|
50
|
-
/**
|
|
51
|
-
---
|
|
52
|
-
category: components/utilities
|
|
53
|
-
---
|
|
54
|
-
**/
|
|
55
|
-
let Position = exports.Position = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = (_Position = class Position extends _react.Component {
|
|
56
|
-
constructor(props) {
|
|
57
|
-
super(props);
|
|
58
|
-
this.ref = null;
|
|
59
|
-
this._id = void 0;
|
|
60
|
-
this._timeouts = [];
|
|
61
|
-
this._listener = null;
|
|
62
|
-
this._content = void 0;
|
|
63
|
-
this._target = void 0;
|
|
64
|
-
this.handleRef = el => {
|
|
65
|
-
const elementRef = this.props.elementRef;
|
|
66
|
-
this.ref = el;
|
|
67
|
-
if (typeof elementRef === 'function') {
|
|
68
|
-
elementRef(el);
|
|
69
|
-
}
|
|
70
|
-
};
|
|
71
|
-
this.handlePortalOpen = () => {
|
|
72
|
-
this.position();
|
|
73
|
-
if (this.props.shouldTrackPosition) {
|
|
74
|
-
this.startTracking();
|
|
75
|
-
}
|
|
76
|
-
this._timeouts.push(setTimeout(() => {
|
|
77
|
-
if (this.state.positioned && typeof this.props.onPositioned === 'function') {
|
|
78
|
-
this.props.onPositioned({
|
|
79
|
-
top: this.state.style.top,
|
|
80
|
-
left: this.state.style.left,
|
|
81
|
-
placement: this.state.placement
|
|
82
|
-
});
|
|
83
|
-
}
|
|
84
|
-
}, 0));
|
|
85
|
-
};
|
|
86
|
-
this.position = () => {
|
|
87
|
-
this.setState({
|
|
88
|
-
positioned: true,
|
|
89
|
-
...this.calculatePosition(this.props)
|
|
90
|
-
});
|
|
91
|
-
};
|
|
92
|
-
this.state = {
|
|
93
|
-
positioned: false,
|
|
94
|
-
...this.calculatePosition(props)
|
|
95
|
-
};
|
|
96
|
-
this.position = (0, _debounce.debounce)(this.position, 0, {
|
|
97
|
-
leading: false,
|
|
98
|
-
trailing: true
|
|
99
|
-
});
|
|
100
|
-
this._id = this.props.id || props.deterministicId();
|
|
101
|
-
}
|
|
102
|
-
shouldComponentUpdate(nextProps, nextState, nextContext) {
|
|
103
|
-
return !(0, _deepEqual.deepEqual)(this.state, nextState) || !(0, _shallowEqual.shallowEqual)(this.props, nextProps) || !(0, _shallowEqual.shallowEqual)(this.context, nextContext);
|
|
104
|
-
}
|
|
105
|
-
componentDidMount() {
|
|
106
|
-
var _this$props$makeStyle, _this$props;
|
|
107
|
-
this.toggleLocatorAttributes(true);
|
|
108
|
-
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
109
|
-
}
|
|
110
|
-
componentDidUpdate(prevProps, prevState) {
|
|
111
|
-
var _this$props$makeStyle2, _this$props2;
|
|
112
|
-
this.position();
|
|
113
|
-
this.toggleLocatorAttributes(true);
|
|
114
|
-
if (this.props.shouldTrackPosition !== prevProps.shouldTrackPosition) {
|
|
115
|
-
this.props.shouldTrackPosition ? this.startTracking() : this.stopTracking();
|
|
116
|
-
}
|
|
117
|
-
const _this$state = this.state,
|
|
118
|
-
style = _this$state.style,
|
|
119
|
-
placement = _this$state.placement;
|
|
120
|
-
if (style && prevState.style && (placement !== prevState.placement || style.top !== prevState.style.top || style.left !== prevState.style.left) && typeof this.props.onPositionChanged === 'function') {
|
|
121
|
-
this.props.onPositionChanged({
|
|
122
|
-
top: style.top,
|
|
123
|
-
left: style.left,
|
|
124
|
-
placement
|
|
125
|
-
});
|
|
126
|
-
}
|
|
127
|
-
(_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
|
|
128
|
-
}
|
|
129
|
-
componentWillUnmount() {
|
|
130
|
-
;
|
|
131
|
-
this.position.cancel();
|
|
132
|
-
this.stopTracking();
|
|
133
|
-
this._timeouts.forEach(timeout => clearTimeout(timeout));
|
|
134
|
-
this.toggleLocatorAttributes(false);
|
|
135
|
-
}
|
|
136
|
-
toggleLocatorAttributes(set) {
|
|
137
|
-
// We have to find the actual DOM nodes and append the attributes
|
|
138
|
-
// directly, as we can't be sure when safe cloning the child that
|
|
139
|
-
// it will accept the data attribute as a prop
|
|
140
|
-
this.toggleLocatorAttribute((0, _findDOMNode.findDOMNode)(this._content), Position.contentLocatorAttribute, set);
|
|
141
|
-
this.toggleLocatorAttribute((0, _findDOMNode.findDOMNode)(this._target), Position.targetLocatorAttribute, set);
|
|
142
|
-
}
|
|
143
|
-
toggleLocatorAttribute(node, locator, set) {
|
|
144
|
-
if (node && node.hasAttribute) {
|
|
145
|
-
if (set && !node.hasAttribute(locator)) {
|
|
146
|
-
;
|
|
147
|
-
node.setAttribute(locator, this._id);
|
|
148
|
-
}
|
|
149
|
-
if (!set && node.hasAttribute(locator)) {
|
|
150
|
-
;
|
|
151
|
-
node.removeAttribute(locator);
|
|
152
|
-
}
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
calculatePosition(props) {
|
|
156
|
-
return (0, _calculateElementPosition.calculateElementPosition)(this._content, this._target, {
|
|
157
|
-
placement: props.placement,
|
|
158
|
-
offsetX: props.offsetX,
|
|
159
|
-
offsetY: props.offsetY,
|
|
160
|
-
constrain: props.constrain,
|
|
161
|
-
container: props.mountNode,
|
|
162
|
-
over: props.shouldPositionOverTarget
|
|
163
|
-
});
|
|
164
|
-
}
|
|
165
|
-
startTracking() {
|
|
166
|
-
this._listener = this._listener || (0, _addPositionChangeListener.addPositionChangeListener)(this._target, this.position);
|
|
167
|
-
}
|
|
168
|
-
stopTracking() {
|
|
169
|
-
if (this._listener) {
|
|
170
|
-
this._listener.remove();
|
|
171
|
-
this._listener = null;
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
// content that needs to be positioned relative to the target
|
|
176
|
-
renderContent() {
|
|
177
|
-
let content = (0, _ensureSingleChild.ensureSingleChild)(this.props.children);
|
|
178
|
-
if (content) {
|
|
179
|
-
var _this$props$styles;
|
|
180
|
-
content = (0, _safeCloneElement.safeCloneElement)(content, {
|
|
181
|
-
ref: el => {
|
|
182
|
-
this._content = el;
|
|
183
|
-
},
|
|
184
|
-
style: {
|
|
185
|
-
boxSizing: 'border-box',
|
|
186
|
-
zIndex: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.zIndex,
|
|
187
|
-
...content.props.style,
|
|
188
|
-
...this.state.style
|
|
189
|
-
},
|
|
190
|
-
...(content.props.className && {
|
|
191
|
-
className: content.props.className
|
|
192
|
-
}),
|
|
193
|
-
[Position.contentLocatorAttribute]: this._id
|
|
194
|
-
});
|
|
195
|
-
content = (0, _jsxRuntime.jsx)(_Portal.Portal, {
|
|
196
|
-
open: true,
|
|
197
|
-
onOpen: this.handlePortalOpen,
|
|
198
|
-
mountNode: this.props.mountNode,
|
|
199
|
-
insertAt: this.props.insertAt,
|
|
200
|
-
children: content
|
|
201
|
-
});
|
|
202
|
-
}
|
|
203
|
-
return content;
|
|
204
|
-
}
|
|
205
|
-
renderTarget() {
|
|
206
|
-
const target = (0, _callRenderProp.callRenderProp)(this.props.renderTarget);
|
|
207
|
-
if (target) {
|
|
208
|
-
return (0, _safeCloneElement.safeCloneElement)(target, {
|
|
209
|
-
ref: el => {
|
|
210
|
-
this._target = el;
|
|
211
|
-
},
|
|
212
|
-
[Position.targetLocatorAttribute]: this._id
|
|
213
|
-
});
|
|
214
|
-
} else if (this.props.target) {
|
|
215
|
-
this._target = (0, _callRenderProp.callRenderProp)(this.props.target);
|
|
216
|
-
}
|
|
217
|
-
return null;
|
|
218
|
-
}
|
|
219
|
-
render() {
|
|
220
|
-
var _this$props$styles2;
|
|
221
|
-
const props = {
|
|
222
|
-
[Position.locatorAttribute]: this._id
|
|
223
|
-
};
|
|
224
|
-
return (0, _jsxRuntime.jsxs)("span", {
|
|
225
|
-
...props,
|
|
226
|
-
css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.position,
|
|
227
|
-
ref: this.handleRef,
|
|
228
|
-
"data-cid": (0, _combineDataCid.combineDataCid)('Position', this.props),
|
|
229
|
-
children: [this.renderTarget(), this.renderContent()]
|
|
230
|
-
});
|
|
231
|
-
}
|
|
232
|
-
}, _Position.displayName = "Position", _Position.componentId = 'Position', _Position.allowedProps = _props.allowedProps, _Position.defaultProps = {
|
|
233
|
-
placement: 'bottom center',
|
|
234
|
-
mountNode: null,
|
|
235
|
-
insertAt: 'bottom',
|
|
236
|
-
constrain: 'window',
|
|
237
|
-
offsetX: 0,
|
|
238
|
-
offsetY: 0,
|
|
239
|
-
shouldTrackPosition: true,
|
|
240
|
-
shouldPositionOverTarget: false,
|
|
241
|
-
children: null
|
|
242
|
-
}, _Position.locatorAttribute = 'data-position', _Position.targetLocatorAttribute = 'data-position-target', _Position.contentLocatorAttribute = 'data-position-content', _Position)) || _class) || _class);
|
|
243
|
-
var _default = exports.default = Position;
|
package/lib/Position/styles.js
DELETED
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
/*
|
|
8
|
-
* The MIT License (MIT)
|
|
9
|
-
*
|
|
10
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
11
|
-
*
|
|
12
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
13
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
14
|
-
* in the Software without restriction, including without limitation the rights
|
|
15
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
16
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
17
|
-
* furnished to do so, subject to the following conditions:
|
|
18
|
-
*
|
|
19
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
20
|
-
* copies or substantial portions of the Software.
|
|
21
|
-
*
|
|
22
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
23
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
24
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
25
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
26
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
27
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
28
|
-
* SOFTWARE.
|
|
29
|
-
*/
|
|
30
|
-
|
|
31
|
-
/**
|
|
32
|
-
* ---
|
|
33
|
-
* private: true
|
|
34
|
-
* ---
|
|
35
|
-
* Generates the style object from the theme and provided additional information
|
|
36
|
-
* @param {Object} componentTheme The theme variable object.
|
|
37
|
-
* @param {Object} props the props of the component, the style is applied to
|
|
38
|
-
* @param {Object} state the state of the component, the style is applied to
|
|
39
|
-
* @return {Object} The final style object, which will be used in the component
|
|
40
|
-
*/
|
|
41
|
-
const generateStyle = (componentTheme, props) => {
|
|
42
|
-
return {
|
|
43
|
-
position: {
|
|
44
|
-
label: 'position',
|
|
45
|
-
display: props.containerDisplay
|
|
46
|
-
},
|
|
47
|
-
zIndex: componentTheme.zIndex
|
|
48
|
-
};
|
|
49
|
-
};
|
|
50
|
-
var _default = exports.default = generateStyle;
|
package/lib/Position/theme.js
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
/*
|
|
8
|
-
* The MIT License (MIT)
|
|
9
|
-
*
|
|
10
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
11
|
-
*
|
|
12
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
13
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
14
|
-
* in the Software without restriction, including without limitation the rights
|
|
15
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
16
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
17
|
-
* furnished to do so, subject to the following conditions:
|
|
18
|
-
*
|
|
19
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
20
|
-
* copies or substantial portions of the Software.
|
|
21
|
-
*
|
|
22
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
23
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
24
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
25
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
26
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
27
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
28
|
-
* SOFTWARE.
|
|
29
|
-
*/
|
|
30
|
-
|
|
31
|
-
/**
|
|
32
|
-
* Generates the theme object for the component from the theme and provided additional information
|
|
33
|
-
* @param {Object} theme The actual theme object.
|
|
34
|
-
* @return {Object} The final theme object with the overrides and component variables
|
|
35
|
-
*/
|
|
36
|
-
const generateComponentTheme = theme => {
|
|
37
|
-
const stacking = theme.stacking;
|
|
38
|
-
const componentVariables = {
|
|
39
|
-
zIndex: stacking === null || stacking === void 0 ? void 0 : stacking.topmost
|
|
40
|
-
};
|
|
41
|
-
return {
|
|
42
|
-
...componentVariables
|
|
43
|
-
};
|
|
44
|
-
};
|
|
45
|
-
var _default = exports.default = generateComponentTheme;
|
package/lib/PositionPropTypes.js
DELETED
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.placementPropValues = exports.mirrorMap = void 0;
|
|
7
|
-
/*
|
|
8
|
-
* The MIT License (MIT)
|
|
9
|
-
*
|
|
10
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
11
|
-
*
|
|
12
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
13
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
14
|
-
* in the Software without restriction, including without limitation the rights
|
|
15
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
16
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
17
|
-
* furnished to do so, subject to the following conditions:
|
|
18
|
-
*
|
|
19
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
20
|
-
* copies or substantial portions of the Software.
|
|
21
|
-
*
|
|
22
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
23
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
24
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
25
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
26
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
27
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
28
|
-
* SOFTWARE.
|
|
29
|
-
*/
|
|
30
|
-
|
|
31
|
-
const placementPropValues = exports.placementPropValues = ['top', 'bottom', 'start', 'end', 'top start', 'top center', 'top end', 'top stretch', 'bottom start', 'bottom center', 'bottom end', 'bottom stretch', 'start top', 'start center', 'start bottom', 'start stretch', 'end top', 'end center', 'end bottom', 'end stretch', 'center start', 'center end', 'offscreen'];
|
|
32
|
-
|
|
33
|
-
/**
|
|
34
|
-
* The placement of the content in relation to the trigger
|
|
35
|
-
*/
|
|
36
|
-
|
|
37
|
-
// TODO: merge with PropTypes once react-docgen can parse `typeof array[number]`
|
|
38
|
-
|
|
39
|
-
/**
|
|
40
|
-
* An element or a function returning an element to use as the mount node
|
|
41
|
-
*/
|
|
42
|
-
|
|
43
|
-
/**
|
|
44
|
-
* The parent in which to constrain a placement
|
|
45
|
-
*/
|
|
46
|
-
|
|
47
|
-
// TODO: merge with PropTypes once react-docgen can parse `typeof array[number]`
|
|
48
|
-
|
|
49
|
-
const mirrorMap = exports.mirrorMap = {
|
|
50
|
-
center: 'center',
|
|
51
|
-
start: 'end',
|
|
52
|
-
end: 'start',
|
|
53
|
-
top: 'bottom',
|
|
54
|
-
bottom: 'top',
|
|
55
|
-
stretch: 'stretch',
|
|
56
|
-
offscreen: 'offscreen'
|
|
57
|
-
};
|
|
@@ -1,528 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.calculateElementPosition = calculateElementPosition;
|
|
8
|
-
exports.default = void 0;
|
|
9
|
-
exports.parsePlacement = parsePlacement;
|
|
10
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
11
|
-
var _getBoundingClientRect = require("@instructure/ui-dom-utils/lib/getBoundingClientRect.js");
|
|
12
|
-
var _getScrollParents = require("@instructure/ui-dom-utils/lib/getScrollParents.js");
|
|
13
|
-
var _getOffsetParents = require("@instructure/ui-dom-utils/lib/getOffsetParents.js");
|
|
14
|
-
var _canUseDOM = require("@instructure/ui-dom-utils/lib/canUseDOM.js");
|
|
15
|
-
var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
|
|
16
|
-
var _ownerDocument3 = require("@instructure/ui-dom-utils/lib/ownerDocument.js");
|
|
17
|
-
var _ownerWindow = require("@instructure/ui-dom-utils/lib/ownerWindow.js");
|
|
18
|
-
var _mirrorPlacement = require("./mirrorPlacement");
|
|
19
|
-
/*
|
|
20
|
-
* The MIT License (MIT)
|
|
21
|
-
*
|
|
22
|
-
* Copyright (c) 2015 - present Instructure, Inc.
|
|
23
|
-
*
|
|
24
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
25
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
26
|
-
* in the Software without restriction, including without limitation the rights
|
|
27
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
28
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
29
|
-
* furnished to do so, subject to the following conditions:
|
|
30
|
-
*
|
|
31
|
-
* The above copyright notice and this permission notice shall be included in all
|
|
32
|
-
* copies or substantial portions of the Software.
|
|
33
|
-
*
|
|
34
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
35
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
36
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
37
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
38
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
39
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
40
|
-
* SOFTWARE.
|
|
41
|
-
*/
|
|
42
|
-
|
|
43
|
-
// @ts-expect-error will be needed for fix in the `offsetToPx` method
|
|
44
|
-
|
|
45
|
-
/**
|
|
46
|
-
* ---
|
|
47
|
-
* category: utilities/position
|
|
48
|
-
* ---
|
|
49
|
-
*
|
|
50
|
-
* Calculate the coordinates to attach an element
|
|
51
|
-
* to a designated target with specified constraints
|
|
52
|
-
* @module
|
|
53
|
-
* @param element - component or DOM node
|
|
54
|
-
* @param target - the target DOM node
|
|
55
|
-
* @param options - constraints for the positioning
|
|
56
|
-
* @param options.placement - designates where the element will be attached
|
|
57
|
-
* ('top', 'bottom', 'left', 'right', 'top left' etc.)
|
|
58
|
-
* @param options.container - DOM node where the element is contained
|
|
59
|
-
* @param options.over - whether or not you want the element to position over the target
|
|
60
|
-
* @param options.constrain - if the element should be constrained to 'window',
|
|
61
|
-
* 'scroll-parent', 'parent', or 'none'
|
|
62
|
-
* @param options.offsetX - the horizontal offset for the positioned element
|
|
63
|
-
* @param options.offsetY - the vertical offset for the positioned element
|
|
64
|
-
* @returns object containing style with the calculated position in the 'transform'
|
|
65
|
-
* property
|
|
66
|
-
*/
|
|
67
|
-
function calculateElementPosition(element, target, options = {}) {
|
|
68
|
-
if (!element || options.placement === 'offscreen') {
|
|
69
|
-
// hide offscreen content at the bottom of the DOM from screenreaders
|
|
70
|
-
// unless content is contained somewhere else
|
|
71
|
-
const hide = !options.container && element;
|
|
72
|
-
return {
|
|
73
|
-
placement: options.placement,
|
|
74
|
-
style: {
|
|
75
|
-
left: '-9999em',
|
|
76
|
-
overflow: 'hidden',
|
|
77
|
-
position: 'absolute',
|
|
78
|
-
top: 0,
|
|
79
|
-
display: hide ? 'none' : null
|
|
80
|
-
}
|
|
81
|
-
};
|
|
82
|
-
}
|
|
83
|
-
const pos = new PositionData(element, target, options);
|
|
84
|
-
return {
|
|
85
|
-
placement: pos.placement,
|
|
86
|
-
style: pos.style
|
|
87
|
-
};
|
|
88
|
-
}
|
|
89
|
-
class PositionedElement {
|
|
90
|
-
constructor(element, placement, offset = {
|
|
91
|
-
top: 0,
|
|
92
|
-
left: 0
|
|
93
|
-
}) {
|
|
94
|
-
this.node = void 0;
|
|
95
|
-
this.placement = void 0;
|
|
96
|
-
this.rect = void 0;
|
|
97
|
-
this._offset = void 0;
|
|
98
|
-
this.node = (0, _findDOMNode.findDOMNode)(element);
|
|
99
|
-
if (typeof placement === 'string') {
|
|
100
|
-
this.placement = parsePlacement(placement);
|
|
101
|
-
} else if (Array.isArray(placement)) {
|
|
102
|
-
this.placement = placement;
|
|
103
|
-
} else {
|
|
104
|
-
this.placement = ['bottom', 'center'];
|
|
105
|
-
}
|
|
106
|
-
this.rect = (0, _getBoundingClientRect.getBoundingClientRect)(this.node);
|
|
107
|
-
this._offset = offsetToPx(offset, this.size, this.node);
|
|
108
|
-
}
|
|
109
|
-
get width() {
|
|
110
|
-
return this.rect.width;
|
|
111
|
-
}
|
|
112
|
-
get height() {
|
|
113
|
-
return this.rect.height;
|
|
114
|
-
}
|
|
115
|
-
get size() {
|
|
116
|
-
return {
|
|
117
|
-
width: this.width,
|
|
118
|
-
height: this.height
|
|
119
|
-
};
|
|
120
|
-
}
|
|
121
|
-
get position() {
|
|
122
|
-
return {
|
|
123
|
-
top: this.rect.top,
|
|
124
|
-
left: this.rect.left
|
|
125
|
-
};
|
|
126
|
-
}
|
|
127
|
-
get hasVerticalPlacement() {
|
|
128
|
-
return ['top', 'bottom'].indexOf(this.placement[0]) >= 0;
|
|
129
|
-
}
|
|
130
|
-
get hasHorizontalPlacement() {
|
|
131
|
-
return ['start', 'end'].indexOf(this.placement[0]) >= 0;
|
|
132
|
-
}
|
|
133
|
-
get shouldStretchVertically() {
|
|
134
|
-
return this.placement[1] === 'stretch' && this.hasVerticalPlacement;
|
|
135
|
-
}
|
|
136
|
-
get shouldStretchHorizontally() {
|
|
137
|
-
return this.placement[1] === 'stretch' && this.hasHorizontalPlacement;
|
|
138
|
-
}
|
|
139
|
-
get mirroredPlacement() {
|
|
140
|
-
return (0, _mirrorPlacement.mirrorPlacement)(this.placement);
|
|
141
|
-
}
|
|
142
|
-
calculateOffset(placement) {
|
|
143
|
-
const offsetMap = {
|
|
144
|
-
top: 0,
|
|
145
|
-
start: 0,
|
|
146
|
-
center: '50%',
|
|
147
|
-
bottom: '100%',
|
|
148
|
-
end: '100%',
|
|
149
|
-
stretch: 0
|
|
150
|
-
};
|
|
151
|
-
let _placement = (0, _slicedToArray2.default)(placement, 2),
|
|
152
|
-
first = _placement[0],
|
|
153
|
-
second = _placement[1];
|
|
154
|
-
if (['start', 'end'].indexOf(first) >= 0) {
|
|
155
|
-
;
|
|
156
|
-
var _ref = [second, first];
|
|
157
|
-
first = _ref[0];
|
|
158
|
-
second = _ref[1];
|
|
159
|
-
}
|
|
160
|
-
let top = 0;
|
|
161
|
-
let left = 0;
|
|
162
|
-
if (typeof offsetMap[first] !== 'undefined') {
|
|
163
|
-
top = offsetMap[first];
|
|
164
|
-
}
|
|
165
|
-
if (typeof offsetMap[second] !== 'undefined') {
|
|
166
|
-
left = offsetMap[second];
|
|
167
|
-
}
|
|
168
|
-
return addOffsets([offsetToPx({
|
|
169
|
-
top,
|
|
170
|
-
left
|
|
171
|
-
}, this.size, this.node), parseOffset(this._offset, this.placement)]);
|
|
172
|
-
}
|
|
173
|
-
get scrollParentsOffset() {
|
|
174
|
-
const parents = (0, _getScrollParents.getScrollParents)(this.node);
|
|
175
|
-
let offsetY = 0;
|
|
176
|
-
let offsetX = 0;
|
|
177
|
-
for (let i = 1; i < parents.length; i++) {
|
|
178
|
-
const parent = parents[i];
|
|
179
|
-
const child = parents[i - 1];
|
|
180
|
-
if (parent) {
|
|
181
|
-
offsetY = offsetY + (this.normalizeScrollTop(parent) - this.normalizeScrollTop(child));
|
|
182
|
-
offsetX = offsetX + (parent.scrollLeft - child.scrollLeft);
|
|
183
|
-
}
|
|
184
|
-
}
|
|
185
|
-
return {
|
|
186
|
-
top: offsetY,
|
|
187
|
-
left: offsetX
|
|
188
|
-
};
|
|
189
|
-
}
|
|
190
|
-
get positionedParentsOffset() {
|
|
191
|
-
// If the element container is within a positioned
|
|
192
|
-
// element, it will position absolutely with respect to that
|
|
193
|
-
// ancestor. We calculate the offset between the child and
|
|
194
|
-
// positioned parent so we can negate that distance
|
|
195
|
-
const parents = (0, _getOffsetParents.getOffsetParents)(this.node);
|
|
196
|
-
const doc = (0, _ownerDocument3.ownerDocument)(this.node);
|
|
197
|
-
|
|
198
|
-
// If there is more than one parent, the offset on the
|
|
199
|
-
// documentElement should be calculated appropriately.
|
|
200
|
-
// Otherwise we need to explictly account for that offset
|
|
201
|
-
let offsetY = parents.length > 1 ? 0 : (0, _getBoundingClientRect.getBoundingClientRect)(doc === null || doc === void 0 ? void 0 : doc.documentElement).top;
|
|
202
|
-
let offsetX = 0;
|
|
203
|
-
let scrollY = 0;
|
|
204
|
-
for (let i = 1; i < parents.length; i++) {
|
|
205
|
-
const parent = (0, _getBoundingClientRect.getBoundingClientRect)(parents[i]);
|
|
206
|
-
const child = (0, _getBoundingClientRect.getBoundingClientRect)(parents[i - 1]);
|
|
207
|
-
offsetY = offsetY + (child.top - parent.top);
|
|
208
|
-
offsetX = offsetX + (child.left - parent.left);
|
|
209
|
-
if (parents[i] === (doc === null || doc === void 0 ? void 0 : doc.body)) {
|
|
210
|
-
// accounts for any margin on body
|
|
211
|
-
offsetY = offsetY + parent.top;
|
|
212
|
-
offsetX = offsetX + parent.left;
|
|
213
|
-
}
|
|
214
|
-
scrollY = scrollY + this.normalizeScrollTop(parents[i]);
|
|
215
|
-
}
|
|
216
|
-
// Account for any scrolling on positioned parents
|
|
217
|
-
// Without this, unnecessary scroll offset could be applied
|
|
218
|
-
// to our target element
|
|
219
|
-
offsetY = offsetY + scrollY;
|
|
220
|
-
return {
|
|
221
|
-
top: offsetY,
|
|
222
|
-
left: offsetX
|
|
223
|
-
};
|
|
224
|
-
}
|
|
225
|
-
normalizeScrollTop(element) {
|
|
226
|
-
var _ownerDocument;
|
|
227
|
-
// Account for cross browser differences with scrollTop attribute on the
|
|
228
|
-
// body element https://bugs.chromium.org/p/chromium/issues/detail?id=766938
|
|
229
|
-
return ((_ownerDocument = (0, _ownerDocument3.ownerDocument)(this.node)) === null || _ownerDocument === void 0 ? void 0 : _ownerDocument.body) === element ? 0 : element.scrollTop;
|
|
230
|
-
}
|
|
231
|
-
}
|
|
232
|
-
class PositionData {
|
|
233
|
-
constructor(element, target, options) {
|
|
234
|
-
var _ownerDocument2;
|
|
235
|
-
this.options = void 0;
|
|
236
|
-
this.container = void 0;
|
|
237
|
-
this.element = void 0;
|
|
238
|
-
this.target = void 0;
|
|
239
|
-
this.options = options || {};
|
|
240
|
-
const _this$options = this.options,
|
|
241
|
-
container = _this$options.container,
|
|
242
|
-
constrain = _this$options.constrain,
|
|
243
|
-
placement = _this$options.placement,
|
|
244
|
-
over = _this$options.over;
|
|
245
|
-
if (!element || placement === 'offscreen') return;
|
|
246
|
-
this.container = container || ((_ownerDocument2 = (0, _ownerDocument3.ownerDocument)(element)) === null || _ownerDocument2 === void 0 ? void 0 : _ownerDocument2.body);
|
|
247
|
-
this.element = new PositionedElement(element, placement, {
|
|
248
|
-
top: this.options.offsetY,
|
|
249
|
-
left: this.options.offsetX
|
|
250
|
-
});
|
|
251
|
-
this.target = new PositionedElement(target || this.container, over ? this.element.placement : this.element.mirroredPlacement);
|
|
252
|
-
if (constrain === 'window') {
|
|
253
|
-
this.constrainTo((0, _ownerWindow.ownerWindow)(element));
|
|
254
|
-
} else if (constrain === 'scroll-parent') {
|
|
255
|
-
this.constrainTo((0, _getScrollParents.getScrollParents)(this.target.node)[0]);
|
|
256
|
-
} else if (constrain === 'parent') {
|
|
257
|
-
this.constrainTo(this.container);
|
|
258
|
-
} else if (typeof constrain === 'function') {
|
|
259
|
-
this.constrainTo((0, _findDOMNode.findDOMNode)(constrain.call(null)));
|
|
260
|
-
} else if (typeof constrain === 'object') {
|
|
261
|
-
this.constrainTo((0, _findDOMNode.findDOMNode)(constrain));
|
|
262
|
-
}
|
|
263
|
-
}
|
|
264
|
-
get offset() {
|
|
265
|
-
const _this$target$calculat = this.target.calculateOffset(this.element.placement),
|
|
266
|
-
top = _this$target$calculat.top,
|
|
267
|
-
left = _this$target$calculat.left;
|
|
268
|
-
const offset = addOffsets([this.element.calculateOffset(this.target.placement), this.element.scrollParentsOffset, this.element.positionedParentsOffset]);
|
|
269
|
-
return {
|
|
270
|
-
top: top - offset.top,
|
|
271
|
-
left: left - offset.left
|
|
272
|
-
};
|
|
273
|
-
}
|
|
274
|
-
get placement() {
|
|
275
|
-
return formatPlacement(this.element.placement);
|
|
276
|
-
}
|
|
277
|
-
get minWidth() {
|
|
278
|
-
return this.element.shouldStretchVertically ? this.target.width : null;
|
|
279
|
-
}
|
|
280
|
-
get minHeight() {
|
|
281
|
-
return this.element.shouldStretchHorizontally ? this.target.height : null;
|
|
282
|
-
}
|
|
283
|
-
get position() {
|
|
284
|
-
const win = (0, _ownerWindow.ownerWindow)(this.target.node);
|
|
285
|
-
let _addOffsets = addOffsets([this.target.position, this.offset]),
|
|
286
|
-
left = _addOffsets.left,
|
|
287
|
-
top = _addOffsets.top;
|
|
288
|
-
if (_canUseDOM.canUseDOM && win !== null && win !== void 0 && win.matchMedia) {
|
|
289
|
-
const retina = win.matchMedia('only screen and (min-resolution: 1.3dppx)').matches || win.matchMedia('only screen and (-webkit-min-device-pixel-ratio: 1.3)').matches;
|
|
290
|
-
if (!retina) {
|
|
291
|
-
left = Math.round(left);
|
|
292
|
-
top = Math.round(top);
|
|
293
|
-
}
|
|
294
|
-
}
|
|
295
|
-
return {
|
|
296
|
-
left,
|
|
297
|
-
top
|
|
298
|
-
};
|
|
299
|
-
}
|
|
300
|
-
get style() {
|
|
301
|
-
// when rendered offscreen first, element has no dimension on first calculation,
|
|
302
|
-
// so we hide it offscreen until measurements are completed
|
|
303
|
-
const _this$element$size = this.element.size,
|
|
304
|
-
width = _this$element$size.width,
|
|
305
|
-
height = _this$element$size.height;
|
|
306
|
-
const elementNotFullyRendered = width === 0 && height === 0;
|
|
307
|
-
return {
|
|
308
|
-
top: 0,
|
|
309
|
-
left: elementNotFullyRendered ? '-9999em' : 0,
|
|
310
|
-
minWidth: this.minWidth,
|
|
311
|
-
minHeight: this.minHeight,
|
|
312
|
-
position: 'absolute',
|
|
313
|
-
transform: `translateX(${this.position.left}px) translateY(${this.position.top}px) translateZ(0)`
|
|
314
|
-
};
|
|
315
|
-
}
|
|
316
|
-
overflow(element) {
|
|
317
|
-
const parentWindow = (0, _ownerWindow.ownerWindow)(element);
|
|
318
|
-
const elementBounds = (0, _getBoundingClientRect.getBoundingClientRect)(element);
|
|
319
|
-
const windowBounds = (0, _getBoundingClientRect.getBoundingClientRect)(parentWindow);
|
|
320
|
-
const offsets = addOffsets([this.target.position, this.offset]);
|
|
321
|
-
const parentOffset = {
|
|
322
|
-
top: this.element.positionedParentsOffset.top + this.element.scrollParentsOffset.top,
|
|
323
|
-
left: this.element.positionedParentsOffset.left + this.element.scrollParentsOffset.left
|
|
324
|
-
};
|
|
325
|
-
let left = offsets.left + parentOffset.left;
|
|
326
|
-
let right = offsets.left + this.element.width + parentOffset.left;
|
|
327
|
-
let top = offsets.top + parentOffset.top;
|
|
328
|
-
let bottom = offsets.top + this.element.height + parentOffset.top;
|
|
329
|
-
|
|
330
|
-
// adjust for vertical placements
|
|
331
|
-
if (this.element.placement[0] === 'bottom') {
|
|
332
|
-
top -= this.element.height + this.target.height;
|
|
333
|
-
} else if (this.element.placement[0] === 'top') {
|
|
334
|
-
bottom += this.element.height + this.target.height;
|
|
335
|
-
}
|
|
336
|
-
if (this.element.placement[1] === 'start') {
|
|
337
|
-
left -= this.element.width - this.target.width;
|
|
338
|
-
} else if (this.element.placement[1] === 'end') {
|
|
339
|
-
right += this.element.width - this.target.width;
|
|
340
|
-
}
|
|
341
|
-
|
|
342
|
-
// adjust for horizontal placements
|
|
343
|
-
if (this.element.placement[1] === 'top') {
|
|
344
|
-
top -= this.element.height - this.target.height;
|
|
345
|
-
} else if (this.element.placement[1] === 'bottom') {
|
|
346
|
-
bottom += this.element.height - this.target.height;
|
|
347
|
-
}
|
|
348
|
-
if (this.element.placement[0] === 'end') {
|
|
349
|
-
left -= this.element.width + this.target.width;
|
|
350
|
-
} else if (this.element.placement[0] === 'start') {
|
|
351
|
-
right += this.element.width + this.target.width;
|
|
352
|
-
}
|
|
353
|
-
const bounds = element === parentWindow ? elementBounds : {
|
|
354
|
-
top: windowBounds.top + elementBounds.top,
|
|
355
|
-
bottom: elementBounds.top + elementBounds.height,
|
|
356
|
-
left: windowBounds.left + elementBounds.left,
|
|
357
|
-
right: elementBounds.left + elementBounds.width
|
|
358
|
-
};
|
|
359
|
-
return {
|
|
360
|
-
top: top < bounds.top ? bounds.top - top : 0,
|
|
361
|
-
bottom: bottom > bounds.bottom ? bottom - bounds.bottom : 0,
|
|
362
|
-
left: left < bounds.left ? bounds.left - left : 0,
|
|
363
|
-
right: right > bounds.right ? right - bounds.right : 0
|
|
364
|
-
};
|
|
365
|
-
}
|
|
366
|
-
constrainTo(element) {
|
|
367
|
-
if (!element) return;
|
|
368
|
-
const overflow = this.overflow(element);
|
|
369
|
-
const oob = {
|
|
370
|
-
top: overflow.top > 0,
|
|
371
|
-
bottom: overflow.bottom > 0,
|
|
372
|
-
left: overflow.left > 0,
|
|
373
|
-
right: overflow.right > 0
|
|
374
|
-
};
|
|
375
|
-
if (this.element.hasVerticalPlacement) {
|
|
376
|
-
if (this.element.placement[1] !== 'stretch') {
|
|
377
|
-
if (oob.left && oob.right) {
|
|
378
|
-
this.element.placement[1] = 'center';
|
|
379
|
-
this.target.placement[1] = 'center';
|
|
380
|
-
} else if (oob.left) {
|
|
381
|
-
this.element.placement[1] = 'start';
|
|
382
|
-
this.target.placement[1] = 'start';
|
|
383
|
-
} else if (oob.right) {
|
|
384
|
-
this.element.placement[1] = 'end';
|
|
385
|
-
this.target.placement[1] = 'end';
|
|
386
|
-
}
|
|
387
|
-
}
|
|
388
|
-
if (oob.top && oob.bottom) {
|
|
389
|
-
// if top and bottom bounds broken
|
|
390
|
-
if (overflow.bottom < overflow.top) {
|
|
391
|
-
// more room on bottom, position below
|
|
392
|
-
this.element.placement[0] = 'bottom';
|
|
393
|
-
this.target.placement[0] = 'top';
|
|
394
|
-
} else if (overflow.bottom > overflow.top) {
|
|
395
|
-
// more room on top, position above
|
|
396
|
-
this.element.placement[0] = 'top';
|
|
397
|
-
this.target.placement[0] = 'bottom';
|
|
398
|
-
}
|
|
399
|
-
} else if (oob.top) {
|
|
400
|
-
// if top bound broken, position below
|
|
401
|
-
this.element.placement[0] = 'bottom';
|
|
402
|
-
this.target.placement[0] = 'top';
|
|
403
|
-
} else if (oob.bottom) {
|
|
404
|
-
// if bottom bound broken, position above
|
|
405
|
-
this.element.placement[0] = 'top';
|
|
406
|
-
this.target.placement[0] = 'bottom';
|
|
407
|
-
}
|
|
408
|
-
} else if (this.element.hasHorizontalPlacement) {
|
|
409
|
-
if (oob.top && oob.bottom) {
|
|
410
|
-
this.element.placement[1] = 'center';
|
|
411
|
-
this.target.placement[1] = 'center';
|
|
412
|
-
} else if (oob.top) {
|
|
413
|
-
this.element.placement[1] = 'top';
|
|
414
|
-
this.target.placement[1] = 'top';
|
|
415
|
-
} else if (oob.bottom) {
|
|
416
|
-
this.element.placement[1] = 'bottom';
|
|
417
|
-
this.target.placement[1] = 'bottom';
|
|
418
|
-
}
|
|
419
|
-
if (oob.left && oob.right) {
|
|
420
|
-
// if left and right bounds broken
|
|
421
|
-
if (overflow.left > overflow.right) {
|
|
422
|
-
// more room at end, position after
|
|
423
|
-
this.element.placement[0] = 'end';
|
|
424
|
-
this.target.placement[0] = 'start';
|
|
425
|
-
} else if (overflow.left < overflow.right) {
|
|
426
|
-
// more room at start, position before
|
|
427
|
-
this.element.placement[0] = 'start';
|
|
428
|
-
this.target.placement[0] = 'end';
|
|
429
|
-
}
|
|
430
|
-
} else {
|
|
431
|
-
if (oob.left) {
|
|
432
|
-
this.element.placement[0] = 'end';
|
|
433
|
-
this.target.placement[0] = 'start';
|
|
434
|
-
} else if (oob.right) {
|
|
435
|
-
this.element.placement[0] = 'start';
|
|
436
|
-
this.target.placement[0] = 'end';
|
|
437
|
-
}
|
|
438
|
-
}
|
|
439
|
-
}
|
|
440
|
-
}
|
|
441
|
-
}
|
|
442
|
-
function addOffsets(offsets) {
|
|
443
|
-
return offsets.reduce((sum, offset) => {
|
|
444
|
-
return {
|
|
445
|
-
top: sum.top + offset.top,
|
|
446
|
-
left: sum.left + offset.left
|
|
447
|
-
};
|
|
448
|
-
}, {
|
|
449
|
-
top: 0,
|
|
450
|
-
left: 0
|
|
451
|
-
});
|
|
452
|
-
}
|
|
453
|
-
function parseOffset(offset, placement) {
|
|
454
|
-
let top = offset.top,
|
|
455
|
-
left = offset.left;
|
|
456
|
-
if (typeof left === 'string') {
|
|
457
|
-
left = parseFloat(left);
|
|
458
|
-
}
|
|
459
|
-
if (typeof top === 'string') {
|
|
460
|
-
top = parseFloat(top);
|
|
461
|
-
}
|
|
462
|
-
if (placement[0] === 'bottom') {
|
|
463
|
-
top = 0 - top;
|
|
464
|
-
}
|
|
465
|
-
if (placement[0] === 'end') {
|
|
466
|
-
left = 0 - left;
|
|
467
|
-
}
|
|
468
|
-
return {
|
|
469
|
-
top,
|
|
470
|
-
left
|
|
471
|
-
};
|
|
472
|
-
}
|
|
473
|
-
function offsetToPx(offset, size,
|
|
474
|
-
// @ts-expect-error will be needed for the TODO below
|
|
475
|
-
node) {
|
|
476
|
-
let left = offset.left,
|
|
477
|
-
top = offset.top;
|
|
478
|
-
if (typeof left === 'string') {
|
|
479
|
-
if (left.indexOf('%') !== -1) {
|
|
480
|
-
left = parseFloat(left) / 100 * size.width;
|
|
481
|
-
} else {
|
|
482
|
-
// TODO this fixes INSTUI-3505, but it is a breaking change, so uncomment it in V9 with the appropriate release notes
|
|
483
|
-
// left = px(left, node)
|
|
484
|
-
}
|
|
485
|
-
}
|
|
486
|
-
if (typeof top === 'string') {
|
|
487
|
-
if (top.indexOf('%') !== -1) {
|
|
488
|
-
top = parseFloat(top) / 100 * size.height;
|
|
489
|
-
} else {
|
|
490
|
-
// TODO this fixes INSTUI-3505, but it is a breaking change, so uncomment it in V9 with the appropriate release notes
|
|
491
|
-
// top = px(top, node)
|
|
492
|
-
}
|
|
493
|
-
}
|
|
494
|
-
return {
|
|
495
|
-
top,
|
|
496
|
-
left
|
|
497
|
-
};
|
|
498
|
-
}
|
|
499
|
-
function sortPlacement(placement) {
|
|
500
|
-
let _placement2 = (0, _slicedToArray2.default)(placement, 2),
|
|
501
|
-
first = _placement2[0],
|
|
502
|
-
second = _placement2[1];
|
|
503
|
-
if (first === 'center') {
|
|
504
|
-
;
|
|
505
|
-
var _ref2 = [second, first];
|
|
506
|
-
first = _ref2[0];
|
|
507
|
-
second = _ref2[1];
|
|
508
|
-
}
|
|
509
|
-
return [first, second];
|
|
510
|
-
}
|
|
511
|
-
|
|
512
|
-
/**
|
|
513
|
-
* Returns the following:
|
|
514
|
-
* - When the input is just 1 element, then `[input, 'center']`, else:
|
|
515
|
-
* - if the first element is `center`, it reverses the order
|
|
516
|
-
* - otherwise, it just returns the split input as an array
|
|
517
|
-
*/
|
|
518
|
-
function parsePlacement(placement) {
|
|
519
|
-
let parsed = placement.split(' ');
|
|
520
|
-
if (parsed.length === 1) {
|
|
521
|
-
parsed = [placement, 'center'];
|
|
522
|
-
}
|
|
523
|
-
return sortPlacement(parsed);
|
|
524
|
-
}
|
|
525
|
-
function formatPlacement(placement) {
|
|
526
|
-
return placement.join(' ');
|
|
527
|
-
}
|
|
528
|
-
var _default = exports.default = calculateElementPosition;
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
exports.executeMirrorFunction = executeMirrorFunction;
|
|
9
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
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
|
-
function executeMirrorFunction(placement, mirrorFunction, delimiter) {
|
|
35
|
-
const _ref = Array.isArray(placement) ? placement : placement.split(' '),
|
|
36
|
-
_ref2 = (0, _slicedToArray2.default)(_ref, 2),
|
|
37
|
-
first = _ref2[0],
|
|
38
|
-
second = _ref2[1];
|
|
39
|
-
const result = mirrorFunction(first, second).filter(value => value);
|
|
40
|
-
return delimiter ? result.join(delimiter) : result;
|
|
41
|
-
}
|
|
42
|
-
var _default = exports.default = executeMirrorFunction;
|
package/lib/index.js
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "Position", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function () {
|
|
9
|
-
return _Position.Position;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
Object.defineProperty(exports, "calculateElementPosition", {
|
|
13
|
-
enumerable: true,
|
|
14
|
-
get: function () {
|
|
15
|
-
return _calculateElementPosition.calculateElementPosition;
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
Object.defineProperty(exports, "executeMirrorFunction", {
|
|
19
|
-
enumerable: true,
|
|
20
|
-
get: function () {
|
|
21
|
-
return _executeMirrorFunction.executeMirrorFunction;
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
Object.defineProperty(exports, "mirrorHorizontalPlacement", {
|
|
25
|
-
enumerable: true,
|
|
26
|
-
get: function () {
|
|
27
|
-
return _mirrorHorizontalPlacement.mirrorHorizontalPlacement;
|
|
28
|
-
}
|
|
29
|
-
});
|
|
30
|
-
Object.defineProperty(exports, "mirrorPlacement", {
|
|
31
|
-
enumerable: true,
|
|
32
|
-
get: function () {
|
|
33
|
-
return _mirrorPlacement.mirrorPlacement;
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
Object.defineProperty(exports, "parsePlacement", {
|
|
37
|
-
enumerable: true,
|
|
38
|
-
get: function () {
|
|
39
|
-
return _parsePlacement.parsePlacement;
|
|
40
|
-
}
|
|
41
|
-
});
|
|
42
|
-
var _Position = require("./Position");
|
|
43
|
-
var _calculateElementPosition = require("./calculateElementPosition");
|
|
44
|
-
var _executeMirrorFunction = require("./executeMirrorFunction");
|
|
45
|
-
var _mirrorHorizontalPlacement = require("./mirrorHorizontalPlacement");
|
|
46
|
-
var _mirrorPlacement = require("./mirrorPlacement");
|
|
47
|
-
var _parsePlacement = require("./parsePlacement");
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
exports.mirrorHorizontalPlacement = mirrorHorizontalPlacement;
|
|
9
|
-
var _PositionPropTypes = require("./PositionPropTypes");
|
|
10
|
-
var _executeMirrorFunction = _interopRequireDefault(require("./executeMirrorFunction"));
|
|
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
|
-
* Given a string or array of one or two placement values, mirrors the placement
|
|
37
|
-
* horizontally.
|
|
38
|
-
*
|
|
39
|
-
* Examples
|
|
40
|
-
* ```js
|
|
41
|
-
* mirrorHorizontalPlacement('top start') // input
|
|
42
|
-
* ['top', 'end'] // output
|
|
43
|
-
*
|
|
44
|
-
* mirrorPlacement('top start', ' ') // input
|
|
45
|
-
* 'top end' //output
|
|
46
|
-
* ```
|
|
47
|
-
*
|
|
48
|
-
* @param {string|Array} placement - a string of the form '`<value>` `<value>`' or array [`<value>`, `<value>`]
|
|
49
|
-
* @param {string} delimiter - when provided, a value with which the result array will be joined
|
|
50
|
-
* @returns {string|Array} - an array of values or, if the delimiter was supplied, a string of
|
|
51
|
-
* delimiter separated values
|
|
52
|
-
*/
|
|
53
|
-
function mirrorHorizontalPlacement(placement, delimiter) {
|
|
54
|
-
return (0, _executeMirrorFunction.default)(placement, (first, second) => {
|
|
55
|
-
return [first, second].map(value => {
|
|
56
|
-
return value === 'start' || value === 'end' ? _PositionPropTypes.mirrorMap[value] : value;
|
|
57
|
-
});
|
|
58
|
-
}, delimiter);
|
|
59
|
-
}
|
|
60
|
-
var _default = exports.default = mirrorHorizontalPlacement;
|
package/lib/mirrorPlacement.js
DELETED
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
exports.mirrorPlacement = mirrorPlacement;
|
|
9
|
-
var _PositionPropTypes = require("./PositionPropTypes");
|
|
10
|
-
var _executeMirrorFunction = _interopRequireDefault(require("./executeMirrorFunction"));
|
|
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: utilities/position
|
|
38
|
-
* ---
|
|
39
|
-
* Given a string or array of one or two placement values, mirrors the placement
|
|
40
|
-
* vertically or horizontally based on the first value.
|
|
41
|
-
*
|
|
42
|
-
* Examples
|
|
43
|
-
* ```js-code
|
|
44
|
-
* mirrorPlacement('top start') // input
|
|
45
|
-
* ['bottom', 'start'] // output
|
|
46
|
-
*
|
|
47
|
-
* mirrorPlacement('top start', ' ') // input
|
|
48
|
-
* 'bottom start' //output
|
|
49
|
-
* ```
|
|
50
|
-
*
|
|
51
|
-
* @param {string|Array} placement - a string of the form '`<value>` `<value>`' or array [`<value>`, `<value>`]
|
|
52
|
-
* @param {string} delimiter - when provided, a value with which the result array will be joined
|
|
53
|
-
* @returns {string|Array} - an array of values or, if the delimiter was supplied, a string of
|
|
54
|
-
* delimiter separated values
|
|
55
|
-
*
|
|
56
|
-
* @module mirrorPlacement
|
|
57
|
-
**/
|
|
58
|
-
function mirrorPlacement(placement, delimiter) {
|
|
59
|
-
return (0, _executeMirrorFunction.default)(placement, (first, second) => {
|
|
60
|
-
return [_PositionPropTypes.mirrorMap[first], second];
|
|
61
|
-
}, delimiter);
|
|
62
|
-
}
|
|
63
|
-
var _default = exports.default = mirrorPlacement;
|
package/lib/package.json
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"type":"commonjs"}
|
package/lib/parsePlacement.js
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
Object.defineProperty(exports, "parsePlacement", {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: function () {
|
|
9
|
-
return _calculateElementPosition.parsePlacement;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
var _calculateElementPosition = require("./calculateElementPosition");
|