1 | "use strict";
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 | exports.default = void 0;
|
7 |
|
8 | var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));
|
9 |
|
10 | var _vue = require("vue");
|
11 |
|
12 | var _BaseMixin = _interopRequireDefault(require("../_util/BaseMixin"));
|
13 |
|
14 | var _propsUtil = require("../_util/props-util");
|
15 |
|
16 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
17 |
|
18 |
|
19 |
|
20 | var VueResizeObserver = (0, _vue.defineComponent)({
|
21 | name: 'ResizeObserver',
|
22 | mixins: [_BaseMixin.default],
|
23 | props: {
|
24 | disabled: Boolean,
|
25 | onResize: Function
|
26 | },
|
27 | data: function data() {
|
28 | this.currentElement = null;
|
29 | this.resizeObserver = null;
|
30 | return {
|
31 | width: 0,
|
32 | height: 0
|
33 | };
|
34 | },
|
35 | mounted: function mounted() {
|
36 | this.onComponentUpdated();
|
37 | },
|
38 | updated: function updated() {
|
39 | this.onComponentUpdated();
|
40 | },
|
41 | beforeUnmount: function beforeUnmount() {
|
42 | this.destroyObserver();
|
43 | },
|
44 | methods: {
|
45 | onComponentUpdated: function onComponentUpdated() {
|
46 | var disabled = this.$props.disabled;
|
47 |
|
48 | if (disabled) {
|
49 | this.destroyObserver();
|
50 | return;
|
51 | }
|
52 |
|
53 |
|
54 | var element = (0, _propsUtil.findDOMNode)(this);
|
55 | var elementChanged = element !== this.currentElement;
|
56 |
|
57 | if (elementChanged) {
|
58 | this.destroyObserver();
|
59 | this.currentElement = element;
|
60 | }
|
61 |
|
62 | if (!this.resizeObserver && element) {
|
63 | this.resizeObserver = new _resizeObserverPolyfill.default(this.handleResize);
|
64 | this.resizeObserver.observe(element);
|
65 | }
|
66 | },
|
67 | handleResize: function handleResize(entries) {
|
68 | var target = entries[0].target;
|
69 |
|
70 | var _target$getBoundingCl = target.getBoundingClientRect(),
|
71 | width = _target$getBoundingCl.width,
|
72 | height = _target$getBoundingCl.height;
|
73 | |
74 |
|
75 |
|
76 |
|
77 |
|
78 |
|
79 |
|
80 | var fixedWidth = Math.floor(width);
|
81 | var fixedHeight = Math.floor(height);
|
82 |
|
83 | if (this.width !== fixedWidth || this.height !== fixedHeight) {
|
84 | var size = {
|
85 | width: fixedWidth,
|
86 | height: fixedHeight
|
87 | };
|
88 | this.width = fixedWidth;
|
89 | this.height = fixedHeight;
|
90 |
|
91 | this.__emit('resize', size);
|
92 | }
|
93 | },
|
94 | destroyObserver: function destroyObserver() {
|
95 | if (this.resizeObserver) {
|
96 | this.resizeObserver.disconnect();
|
97 | this.resizeObserver = null;
|
98 | }
|
99 | }
|
100 | },
|
101 | render: function render() {
|
102 | var _a, _b;
|
103 |
|
104 | return (_b = (_a = this.$slots).default) === null || _b === void 0 ? void 0 : _b.call(_a)[0];
|
105 | }
|
106 | });
|
107 | var _default = VueResizeObserver;
|
108 | exports.default = _default; |
\ | No newline at end of file |