@khanacademy/wonder-blocks-popover 5.0.8 → 5.1.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/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2018 Khan Academy
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/dist/es/index.js CHANGED
@@ -145,7 +145,7 @@ class PopoverEventListener extends React.Component {
145
145
  });
146
146
  return;
147
147
  }
148
- const node = ReactDOM.findDOMNode((_this$props$contentRe = this.props.contentRef) == null ? void 0 : _this$props$contentRe.current);
148
+ const node = ReactDOM.findDOMNode((_this$props$contentRe = this.props.contentRef) == null ? undefined : _this$props$contentRe.current);
149
149
  if (node && !node.contains(e.target)) {
150
150
  e.preventDefault();
151
151
  e.stopPropagation();
@@ -211,8 +211,8 @@ class InitialFocus extends React.Component {
211
211
  class FocusManager extends React.Component {
212
212
  constructor(...args) {
213
213
  super(...args);
214
- this.nextElementAfterPopover = void 0;
215
- this.rootNode = void 0;
214
+ this.nextElementAfterPopover = undefined;
215
+ this.rootNode = undefined;
216
216
  this.elementsThatCanBeFocusableInsidePopover = [];
217
217
  this.firstFocusableElementInPopover = null;
218
218
  this.lastFocusableElementInPopover = null;
@@ -248,14 +248,14 @@ class FocusManager extends React.Component {
248
248
  if (e.key === "Tab" && e.shiftKey) {
249
249
  var _this$props$anchorEle;
250
250
  e.preventDefault();
251
- (_this$props$anchorEle = this.props.anchorElement) == null ? void 0 : _this$props$anchorEle.focus();
251
+ (_this$props$anchorEle = this.props.anchorElement) == null || _this$props$anchorEle.focus();
252
252
  }
253
253
  };
254
254
  this.handleKeydownLastFocusableElement = e => {
255
255
  if (this.nextElementAfterPopover && e.key === "Tab" && !e.shiftKey) {
256
256
  var _this$nextElementAfte;
257
257
  e.preventDefault();
258
- (_this$nextElementAfte = this.nextElementAfterPopover) == null ? void 0 : _this$nextElementAfte.focus();
258
+ (_this$nextElementAfte = this.nextElementAfterPopover) == null || _this$nextElementAfte.focus();
259
259
  }
260
260
  };
261
261
  this.getNextFocusableElement = () => {
@@ -307,14 +307,14 @@ class FocusManager extends React.Component {
307
307
  if (e.key === "Tab" && !e.shiftKey) {
308
308
  var _this$firstFocusableE;
309
309
  e.preventDefault();
310
- (_this$firstFocusableE = this.firstFocusableElementInPopover) == null ? void 0 : _this$firstFocusableE.focus();
310
+ (_this$firstFocusableE = this.firstFocusableElementInPopover) == null || _this$firstFocusableE.focus();
311
311
  }
312
312
  };
313
313
  this.handleKeydownNextFocusableElement = e => {
314
314
  if (e.key === "Tab" && e.shiftKey) {
315
315
  var _this$lastFocusableEl;
316
316
  e.preventDefault();
317
- (_this$lastFocusableEl = this.lastFocusableElementInPopover) == null ? void 0 : _this$lastFocusableEl.focus();
317
+ (_this$lastFocusableEl = this.lastFocusableElementInPopover) == null || _this$lastFocusableEl.focus();
318
318
  }
319
319
  };
320
320
  }
@@ -389,7 +389,7 @@ class Popover extends React.Component {
389
389
  } = this.props;
390
390
  if (closedFocusId) {
391
391
  const focusElement = ReactDOM.findDOMNode(document.getElementById(closedFocusId));
392
- focusElement == null ? void 0 : focusElement.focus();
392
+ focusElement == null || focusElement.focus();
393
393
  return;
394
394
  }
395
395
  if (anchorElement) {
@@ -401,7 +401,7 @@ class Popover extends React.Component {
401
401
  opened: false
402
402
  }, () => {
403
403
  var _this$props$onClose, _this$props;
404
- (_this$props$onClose = (_this$props = this.props).onClose) == null ? void 0 : _this$props$onClose.call(_this$props);
404
+ (_this$props$onClose = (_this$props = this.props).onClose) == null || _this$props$onClose.call(_this$props);
405
405
  if (shouldReturnFocus) {
406
406
  this.maybeReturnFocus();
407
407
  }
@@ -478,9 +478,10 @@ class Popover extends React.Component {
478
478
  initialFocusId: initialFocusId
479
479
  }, popperContent);
480
480
  } else {
481
- return React.createElement(InitialFocus, {
482
- initialFocusId: initialFocusId
483
- }, popperContent);
481
+ return (React.createElement(InitialFocus, {
482
+ initialFocusId: initialFocusId
483
+ }, popperContent)
484
+ );
484
485
  }
485
486
  }
486
487
  getHost() {
@@ -621,7 +622,7 @@ const styles$1 = StyleSheet.create({
621
622
  }
622
623
  });
623
624
 
624
- const StyledImage = addStyle("img");
625
+ const StyledImg = addStyle("img");
625
626
  class PopoverContent extends React.Component {
626
627
  constructor(...args) {
627
628
  super(...args);
@@ -647,7 +648,7 @@ class PopoverContent extends React.Component {
647
648
  }
648
649
  return React.createElement(View, {
649
650
  style: styles.iconContainer
650
- }, typeof icon !== "string" ? icon : React.createElement(StyledImage, {
651
+ }, typeof icon !== "string" ? icon : React.createElement(StyledImg, {
651
652
  src: icon,
652
653
  style: styles.icon
653
654
  }));
package/dist/index.js CHANGED
@@ -1,7 +1,5 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var _extends = require('@babel/runtime/helpers/extends');
6
4
  var React = require('react');
7
5
  var ReactDOM = require('react-dom');
@@ -14,10 +12,7 @@ var wonderBlocksTypography = require('@khanacademy/wonder-blocks-typography');
14
12
  var xIcon = require('@phosphor-icons/core/regular/x.svg');
15
13
  var IconButton = require('@khanacademy/wonder-blocks-icon-button');
16
14
 
17
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
18
-
19
- function _interopNamespace(e) {
20
- if (e && e.__esModule) return e;
15
+ function _interopNamespaceDefault(e) {
21
16
  var n = Object.create(null);
22
17
  if (e) {
23
18
  Object.keys(e).forEach(function (k) {
@@ -30,15 +25,12 @@ function _interopNamespace(e) {
30
25
  }
31
26
  });
32
27
  }
33
- n["default"] = e;
28
+ n.default = e;
34
29
  return Object.freeze(n);
35
30
  }
36
31
 
37
- var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
38
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
39
- var ReactDOM__namespace = /*#__PURE__*/_interopNamespace(ReactDOM);
40
- var xIcon__default = /*#__PURE__*/_interopDefaultLegacy(xIcon);
41
- var IconButton__default = /*#__PURE__*/_interopDefaultLegacy(IconButton);
32
+ var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
33
+ var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
42
34
 
43
35
  const defaultContext = {
44
36
  close: undefined,
@@ -73,7 +65,7 @@ class PopoverAnchor extends React__namespace.Component {
73
65
  });
74
66
  return React__namespace.cloneElement(renderedChildren, sharedProps);
75
67
  } else {
76
- return React__namespace.cloneElement(children, _extends__default["default"]({}, children.props, sharedProps, {
68
+ return React__namespace.cloneElement(children, _extends({}, children.props, sharedProps, {
77
69
  onClick: children.props.onClick ? e => {
78
70
  e.stopPropagation();
79
71
  children.props.onClick();
@@ -175,7 +167,7 @@ class PopoverEventListener extends React__namespace.Component {
175
167
  });
176
168
  return;
177
169
  }
178
- const node = ReactDOM__namespace.findDOMNode((_this$props$contentRe = this.props.contentRef) == null ? void 0 : _this$props$contentRe.current);
170
+ const node = ReactDOM__namespace.findDOMNode((_this$props$contentRe = this.props.contentRef) == null ? undefined : _this$props$contentRe.current);
179
171
  if (node && !node.contains(e.target)) {
180
172
  e.preventDefault();
181
173
  e.stopPropagation();
@@ -241,8 +233,8 @@ class InitialFocus extends React__namespace.Component {
241
233
  class FocusManager extends React__namespace.Component {
242
234
  constructor(...args) {
243
235
  super(...args);
244
- this.nextElementAfterPopover = void 0;
245
- this.rootNode = void 0;
236
+ this.nextElementAfterPopover = undefined;
237
+ this.rootNode = undefined;
246
238
  this.elementsThatCanBeFocusableInsidePopover = [];
247
239
  this.firstFocusableElementInPopover = null;
248
240
  this.lastFocusableElementInPopover = null;
@@ -278,14 +270,14 @@ class FocusManager extends React__namespace.Component {
278
270
  if (e.key === "Tab" && e.shiftKey) {
279
271
  var _this$props$anchorEle;
280
272
  e.preventDefault();
281
- (_this$props$anchorEle = this.props.anchorElement) == null ? void 0 : _this$props$anchorEle.focus();
273
+ (_this$props$anchorEle = this.props.anchorElement) == null || _this$props$anchorEle.focus();
282
274
  }
283
275
  };
284
276
  this.handleKeydownLastFocusableElement = e => {
285
277
  if (this.nextElementAfterPopover && e.key === "Tab" && !e.shiftKey) {
286
278
  var _this$nextElementAfte;
287
279
  e.preventDefault();
288
- (_this$nextElementAfte = this.nextElementAfterPopover) == null ? void 0 : _this$nextElementAfte.focus();
280
+ (_this$nextElementAfte = this.nextElementAfterPopover) == null || _this$nextElementAfte.focus();
289
281
  }
290
282
  };
291
283
  this.getNextFocusableElement = () => {
@@ -337,14 +329,14 @@ class FocusManager extends React__namespace.Component {
337
329
  if (e.key === "Tab" && !e.shiftKey) {
338
330
  var _this$firstFocusableE;
339
331
  e.preventDefault();
340
- (_this$firstFocusableE = this.firstFocusableElementInPopover) == null ? void 0 : _this$firstFocusableE.focus();
332
+ (_this$firstFocusableE = this.firstFocusableElementInPopover) == null || _this$firstFocusableE.focus();
341
333
  }
342
334
  };
343
335
  this.handleKeydownNextFocusableElement = e => {
344
336
  if (e.key === "Tab" && e.shiftKey) {
345
337
  var _this$lastFocusableEl;
346
338
  e.preventDefault();
347
- (_this$lastFocusableEl = this.lastFocusableElementInPopover) == null ? void 0 : _this$lastFocusableEl.focus();
339
+ (_this$lastFocusableEl = this.lastFocusableElementInPopover) == null || _this$lastFocusableEl.focus();
348
340
  }
349
341
  };
350
342
  }
@@ -419,7 +411,7 @@ class Popover extends React__namespace.Component {
419
411
  } = this.props;
420
412
  if (closedFocusId) {
421
413
  const focusElement = ReactDOM__namespace.findDOMNode(document.getElementById(closedFocusId));
422
- focusElement == null ? void 0 : focusElement.focus();
414
+ focusElement == null || focusElement.focus();
423
415
  return;
424
416
  }
425
417
  if (anchorElement) {
@@ -431,7 +423,7 @@ class Popover extends React__namespace.Component {
431
423
  opened: false
432
424
  }, () => {
433
425
  var _this$props$onClose, _this$props;
434
- (_this$props$onClose = (_this$props = this.props).onClose) == null ? void 0 : _this$props$onClose.call(_this$props);
426
+ (_this$props$onClose = (_this$props = this.props).onClose) == null || _this$props$onClose.call(_this$props);
435
427
  if (shouldReturnFocus) {
436
428
  this.maybeReturnFocus();
437
429
  }
@@ -492,7 +484,7 @@ class Popover extends React__namespace.Component {
492
484
  placement: placement,
493
485
  rootBoundary: rootBoundary,
494
486
  viewportPadding: viewportPadding
495
- }, props => React__namespace.createElement(PopoverDialog, _extends__default["default"]({}, props, {
487
+ }, props => React__namespace.createElement(PopoverDialog, _extends({}, props, {
496
488
  "aria-label": ariaLabel,
497
489
  "aria-describedby": describedBy,
498
490
  "aria-labelledby": ariaLabelledBy,
@@ -508,9 +500,10 @@ class Popover extends React__namespace.Component {
508
500
  initialFocusId: initialFocusId
509
501
  }, popperContent);
510
502
  } else {
511
- return React__namespace.createElement(InitialFocus, {
512
- initialFocusId: initialFocusId
513
- }, popperContent);
503
+ return (React__namespace.createElement(InitialFocus, {
504
+ initialFocusId: initialFocusId
505
+ }, popperContent)
506
+ );
514
507
  }
515
508
  }
516
509
  getHost() {
@@ -576,8 +569,8 @@ class CloseButton extends React__namespace.Component {
576
569
  return React__namespace.createElement(PopoverContext.Consumer, null, ({
577
570
  close
578
571
  }) => {
579
- return React__namespace.createElement(IconButton__default["default"], {
580
- icon: xIcon__default["default"],
572
+ return React__namespace.createElement(IconButton, {
573
+ icon: xIcon,
581
574
  "aria-label": ariaLabel,
582
575
  onClick: close,
583
576
  kind: light ? "primary" : "tertiary",
@@ -651,7 +644,7 @@ const styles$1 = aphrodite.StyleSheet.create({
651
644
  }
652
645
  });
653
646
 
654
- const StyledImage = wonderBlocksCore.addStyle("img");
647
+ const StyledImg = wonderBlocksCore.addStyle("img");
655
648
  class PopoverContent extends React__namespace.Component {
656
649
  constructor(...args) {
657
650
  super(...args);
@@ -677,7 +670,7 @@ class PopoverContent extends React__namespace.Component {
677
670
  }
678
671
  return React__namespace.createElement(wonderBlocksCore.View, {
679
672
  style: styles.iconContainer
680
- }, typeof icon !== "string" ? icon : React__namespace.createElement(StyledImage, {
673
+ }, typeof icon !== "string" ? icon : React__namespace.createElement(StyledImg, {
681
674
  src: icon,
682
675
  style: styles.icon
683
676
  }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@khanacademy/wonder-blocks-popover",
3
- "version": "5.0.8",
3
+ "version": "5.1.0",
4
4
  "design": "v1",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -9,20 +9,16 @@
9
9
  "main": "dist/index.js",
10
10
  "module": "dist/es/index.js",
11
11
  "types": "dist/index.d.ts",
12
- "scripts": {
13
- "test": "echo \"Error: no test specified\" && exit 1",
14
- "prepublishOnly": "../../utils/publish/package-pre-publish-check.sh"
15
- },
16
12
  "author": "",
17
13
  "license": "MIT",
18
14
  "dependencies": {
19
- "@babel/runtime": "^7.18.6",
20
- "@khanacademy/wonder-blocks-core": "^12.0.0",
21
- "@khanacademy/wonder-blocks-icon-button": "^6.0.9",
22
- "@khanacademy/wonder-blocks-modal": "^7.0.7",
23
- "@khanacademy/wonder-blocks-tokens": "^4.1.0",
24
- "@khanacademy/wonder-blocks-tooltip": "^4.0.7",
25
- "@khanacademy/wonder-blocks-typography": "^3.0.6"
15
+ "@babel/runtime": "^7.24.5",
16
+ "@khanacademy/wonder-blocks-core": "12.1.0",
17
+ "@khanacademy/wonder-blocks-icon-button": "6.1.0",
18
+ "@khanacademy/wonder-blocks-modal": "7.1.0",
19
+ "@khanacademy/wonder-blocks-tokens": "4.2.0",
20
+ "@khanacademy/wonder-blocks-tooltip": "4.1.0",
21
+ "@khanacademy/wonder-blocks-typography": "3.1.0"
26
22
  },
27
23
  "peerDependencies": {
28
24
  "@phosphor-icons/core": "^2.0.2",
@@ -33,6 +29,9 @@
33
29
  "react-popper": "^2.0.0"
34
30
  },
35
31
  "devDependencies": {
36
- "@khanacademy/wb-dev-build-settings": "^2.0.0"
32
+ "@khanacademy/wb-dev-build-settings": "2.1.0"
33
+ },
34
+ "scripts": {
35
+ "test": "echo \"Error: no test specified\" && exit 1"
37
36
  }
38
37
  }