@iframe-resizer/vue 5.0.1-alpha.1 → 5.0.1-beta.1

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.
Files changed (6) hide show
  1. package/README.md +1 -1
  2. package/iframe-resizer.vue +79 -25
  3. package/index.cjs.js +82 -7
  4. package/index.esm.js +83 -8
  5. package/index.umd.js +122 -0
  6. package/package.json +5 -2
package/README.md CHANGED
@@ -22,4 +22,4 @@ yarn add @iframe-resizer/vue
22
22
 
23
23
  ---
24
24
 
25
- _iframe-resizer version 5.0.1 2024-05-27 - 17:26:46.228Z_
25
+ _iframe-resizer version 5.0.1 2024-05-29 - 15:28:21.014Z_
package/iframe-resizer.vue CHANGED
@@ -1,35 +1,89 @@
1
1
  <template>
2
- <div ref='IframeResizer'>
3
- <slot></slot>
4
- </div>
2
+ <iframe ref="iframe" v-bind="$attrs"></iframe>
5
3
  </template>
6
4
 
7
- <script lang="ts">
8
- // Rollup-plug-vue blows up with the types included!
9
-
5
+ <script>
10
6
  import connectResizer from '@iframe-resizer/core'
11
- // import { Directive, DirectiveBinding } from 'vue'
12
-
13
- // interface ResizableHTMLElement extends HTMLElement {
14
- // iframeResizer?: {
15
- // moveToAnchor: (string) => void
16
- // resize: (x: number, y: number) => void
17
- // sendMessage: (string) => void
18
- // }
19
- // }
20
-
21
- const iframeResizer /* : Directive */ = {
22
- mounted(el /* : HTMLElement */, binding /*: DirectiveBinding */) {
23
- const options = binding.value || {}
7
+
8
+ export default {
9
+ name: 'IframeResizer',
10
+
11
+ props: {
12
+ license: {
13
+ type: String,
14
+ required: true
15
+ },
16
+ bodyBackground: {
17
+ type: String,
18
+ },
19
+ bodyMargin: {
20
+ type: String,
21
+ },
22
+ bodyPadding: {
23
+ type: String,
24
+ },
25
+ checkOrigin: {
26
+ type: Boolean,
27
+ default: true,
28
+ },
29
+ direction: {
30
+ type: String,
31
+ },
32
+ inPageLinks: {
33
+ type: Boolean,
34
+ },
35
+ offset: {
36
+ type: Number,
37
+ },
38
+ scrolling: {
39
+ type: Boolean,
40
+ },
41
+ tolerance: {
42
+ type: Number,
43
+ },
44
+ warningTimeout: {
45
+ type: Number,
46
+ },
47
+ },
48
+
49
+ mounted() {
50
+ const self = this
51
+ const { iframe } = this.$refs
52
+ const options = {
53
+ ...Object.fromEntries(
54
+ Object
55
+ .entries(this.$props)
56
+ .filter(([key, value]) => value !== undefined)
57
+ ),
58
+
59
+ onClose: () => false, // Disable close methods, use Vue to remove iframe
60
+ onReady: (...args) => self.$emit('onReady', ...args),
61
+ onMessage: (...args) => self.$emit('onMessage', ...args),
62
+ onResized: (...args) => self.$emit('onResized', ...args),
63
+ }
64
+
24
65
  const connectWithOptions = connectResizer(options)
25
- el.addEventListener('load', () => connectWithOptions(el))
66
+
67
+ iframe.addEventListener("load", () => {
68
+ self.resizer = connectWithOptions(iframe)
69
+ })
26
70
  },
27
- unmounted(el /*: HTMLElement */) {
28
- const resizableEl = el /* as ResizableHTMLElement */
29
- resizableEl?.iframeResizer.disconnect()
71
+
72
+ beforeUnmount() {
73
+ this.resizer?.disconnect()
30
74
  },
31
- }
32
75
 
33
- export default resize
76
+ methods: {
77
+ moveToAnchor(anchor) {
78
+ this.resizer.moveToAnchor(anchor)
79
+ },
80
+ resize() {
81
+ this.resizer.resize()
82
+ },
83
+ sendMessage(msg, target) {
84
+ this.resizer.sendMessage(msg, target)
85
+ },
86
+ },
87
+ }
34
88
 
35
89
  </script>
package/index.cjs.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /*!
2
2
  * @preserve
3
3
  *
4
- * @module iframe-resizer/vue 5.0.1 (cjs) - 2024-05-27
4
+ * @module iframe-resizer/vue 5.0.1 (cjs) - 2024-05-29
5
5
  *
6
6
  * @license GPL-3.0 for non-commercial use only.
7
7
  * For commercial use, you must purchase a license from
@@ -19,17 +19,92 @@
19
19
 
20
20
  'use strict';
21
21
 
22
- require('@iframe-resizer/core');
22
+ const connectResizer = require('@iframe-resizer/core');
23
23
  const vue = require('vue');
24
24
 
25
- const script = resize;
25
+ const script = {
26
+ name: 'IframeResizer',
26
27
 
27
- const _hoisted_1 = { ref: "IframeResizer" };
28
+ props: {
29
+ license: {
30
+ type: String,
31
+ required: true
32
+ },
33
+ bodyBackground: {
34
+ type: String,
35
+ },
36
+ bodyMargin: {
37
+ type: String,
38
+ },
39
+ bodyPadding: {
40
+ type: String,
41
+ },
42
+ checkOrigin: {
43
+ type: Boolean,
44
+ default: true,
45
+ },
46
+ direction: {
47
+ type: String,
48
+ },
49
+ inPageLinks: {
50
+ type: Boolean,
51
+ },
52
+ offset: {
53
+ type: Number,
54
+ },
55
+ scrolling: {
56
+ type: Boolean,
57
+ },
58
+ tolerance: {
59
+ type: Number,
60
+ },
61
+ warningTimeout: {
62
+ type: Number,
63
+ },
64
+ },
65
+
66
+ mounted() {
67
+ const self = this;
68
+ const { iframe } = this.$refs;
69
+ const options = {
70
+ ...Object.fromEntries(
71
+ Object
72
+ .entries(this.$props)
73
+ .filter(([key, value]) => value !== undefined)
74
+ ),
75
+
76
+ onClose: () => false, // Disable close methods, use Vue to remove iframe
77
+ onReady: (...args) => self.$emit('onReady', ...args),
78
+ onMessage: (...args) => self.$emit('onMessage', ...args),
79
+ onResized: (...args) => self.$emit('onResized', ...args),
80
+ };
81
+
82
+ const connectWithOptions = connectResizer(options);
83
+
84
+ iframe.addEventListener("load", () => {
85
+ self.resizer = connectWithOptions(iframe);
86
+ });
87
+ },
88
+
89
+ beforeUnmount() {
90
+ this.resizer?.disconnect();
91
+ },
92
+
93
+ methods: {
94
+ moveToAnchor(anchor) {
95
+ this.resizer.moveToAnchor(anchor);
96
+ },
97
+ resize() {
98
+ this.resizer.resize();
99
+ },
100
+ sendMessage(msg, target) {
101
+ this.resizer.sendMessage(msg, target);
102
+ },
103
+ },
104
+ };
28
105
 
29
106
  function render(_ctx, _cache, $props, $setup, $data, $options) {
30
- return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
31
- vue.renderSlot(_ctx.$slots, "default")
32
- ], 512 /* NEED_PATCH */))
107
+ return (vue.openBlock(), vue.createElementBlock("iframe", vue.mergeProps({ ref: "iframe" }, _ctx.$attrs), null, 16 /* FULL_PROPS */))
33
108
  }
34
109
 
35
110
  script.render = render;
package/index.esm.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /*!
2
2
  * @preserve
3
3
  *
4
- * @module iframe-resizer/vue 5.0.1 (esm) - 2024-05-27
4
+ * @module iframe-resizer/vue 5.0.1 (esm) - 2024-05-29
5
5
  *
6
6
  * @license GPL-3.0 for non-commercial use only.
7
7
  * For commercial use, you must purchase a license from
@@ -17,17 +17,92 @@
17
17
  */
18
18
 
19
19
 
20
- import '@iframe-resizer/core';
21
- import { openBlock, createElementBlock, renderSlot } from 'vue';
20
+ import connectResizer from '@iframe-resizer/core';
21
+ import { openBlock, createElementBlock, mergeProps } from 'vue';
22
22
 
23
- const script = resize;
23
+ const script = {
24
+ name: 'IframeResizer',
24
25
 
25
- const _hoisted_1 = { ref: "IframeResizer" };
26
+ props: {
27
+ license: {
28
+ type: String,
29
+ required: true
30
+ },
31
+ bodyBackground: {
32
+ type: String,
33
+ },
34
+ bodyMargin: {
35
+ type: String,
36
+ },
37
+ bodyPadding: {
38
+ type: String,
39
+ },
40
+ checkOrigin: {
41
+ type: Boolean,
42
+ default: true,
43
+ },
44
+ direction: {
45
+ type: String,
46
+ },
47
+ inPageLinks: {
48
+ type: Boolean,
49
+ },
50
+ offset: {
51
+ type: Number,
52
+ },
53
+ scrolling: {
54
+ type: Boolean,
55
+ },
56
+ tolerance: {
57
+ type: Number,
58
+ },
59
+ warningTimeout: {
60
+ type: Number,
61
+ },
62
+ },
63
+
64
+ mounted() {
65
+ const self = this;
66
+ const { iframe } = this.$refs;
67
+ const options = {
68
+ ...Object.fromEntries(
69
+ Object
70
+ .entries(this.$props)
71
+ .filter(([key, value]) => value !== undefined)
72
+ ),
73
+
74
+ onClose: () => false, // Disable close methods, use Vue to remove iframe
75
+ onReady: (...args) => self.$emit('onReady', ...args),
76
+ onMessage: (...args) => self.$emit('onMessage', ...args),
77
+ onResized: (...args) => self.$emit('onResized', ...args),
78
+ };
79
+
80
+ const connectWithOptions = connectResizer(options);
81
+
82
+ iframe.addEventListener("load", () => {
83
+ self.resizer = connectWithOptions(iframe);
84
+ });
85
+ },
86
+
87
+ beforeUnmount() {
88
+ this.resizer?.disconnect();
89
+ },
90
+
91
+ methods: {
92
+ moveToAnchor(anchor) {
93
+ this.resizer.moveToAnchor(anchor);
94
+ },
95
+ resize() {
96
+ this.resizer.resize();
97
+ },
98
+ sendMessage(msg, target) {
99
+ this.resizer.sendMessage(msg, target);
100
+ },
101
+ },
102
+ };
26
103
 
27
104
  function render(_ctx, _cache, $props, $setup, $data, $options) {
28
- return (openBlock(), createElementBlock("div", _hoisted_1, [
29
- renderSlot(_ctx.$slots, "default")
30
- ], 512 /* NEED_PATCH */))
105
+ return (openBlock(), createElementBlock("iframe", mergeProps({ ref: "iframe" }, _ctx.$attrs), null, 16 /* FULL_PROPS */))
31
106
  }
32
107
 
33
108
  script.render = render;
package/index.umd.js ADDED
@@ -0,0 +1,122 @@
1
+ /*!
2
+ * @preserve
3
+ *
4
+ * @module iframe-resizer/vue 5.0.1 (umd) - 2024-05-29
5
+ *
6
+ * @license GPL-3.0 for non-commercial use only.
7
+ * For commercial use, you must purchase a license from
8
+ * https://iframe-resizer.com/pricing
9
+ *
10
+ * @desciption Keep same and cross domain iFrames sized to their content
11
+ *
12
+ * @author David J. Bradshaw <info@iframe-resizer.com>
13
+ *
14
+ * @see {@link https://iframe-resizer.com}
15
+ *
16
+ * @copyright (c) 2013 - 2024, David J. Bradshaw. All rights reserved.
17
+ */
18
+
19
+
20
+ (function (global, factory) {
21
+ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('@iframe-resizer/core'), require('vue')) :
22
+ typeof define === 'function' && define.amd ? define(['@iframe-resizer/core', 'vue'], factory) :
23
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.IframeResizer = factory(global.connectResizer, global.vue));
24
+ })(this, (function (connectResizer, vue) { 'use strict';
25
+
26
+ const script = {
27
+ name: 'IframeResizer',
28
+
29
+ props: {
30
+ license: {
31
+ type: String,
32
+ required: true
33
+ },
34
+ bodyBackground: {
35
+ type: String,
36
+ },
37
+ bodyMargin: {
38
+ type: String,
39
+ },
40
+ bodyPadding: {
41
+ type: String,
42
+ },
43
+ checkOrigin: {
44
+ type: Boolean,
45
+ default: true,
46
+ },
47
+ direction: {
48
+ type: String,
49
+ },
50
+ inPageLinks: {
51
+ type: Boolean,
52
+ },
53
+ offset: {
54
+ type: Number,
55
+ },
56
+ scrolling: {
57
+ type: Boolean,
58
+ },
59
+ tolerance: {
60
+ type: Number,
61
+ },
62
+ warningTimeout: {
63
+ type: Number,
64
+ },
65
+ },
66
+
67
+ mounted() {
68
+ const self = this;
69
+ const { iframe } = this.$refs;
70
+ const options = {
71
+ ...Object.fromEntries(
72
+ Object
73
+ .entries(this.$props)
74
+ .filter(([key, value]) => value !== undefined)
75
+ ),
76
+
77
+ onClose: () => false, // Disable close methods, use Vue to remove iframe
78
+ onReady: (...args) => self.$emit('onReady', ...args),
79
+ onMessage: (...args) => self.$emit('onMessage', ...args),
80
+ onResized: (...args) => self.$emit('onResized', ...args),
81
+ };
82
+
83
+ const connectWithOptions = connectResizer(options);
84
+
85
+ iframe.addEventListener("load", () => {
86
+ self.resizer = connectWithOptions(iframe);
87
+ });
88
+ },
89
+
90
+ beforeUnmount() {
91
+ this.resizer?.disconnect();
92
+ },
93
+
94
+ methods: {
95
+ moveToAnchor(anchor) {
96
+ this.resizer.moveToAnchor(anchor);
97
+ },
98
+ resize() {
99
+ this.resizer.resize();
100
+ },
101
+ sendMessage(msg, target) {
102
+ this.resizer.sendMessage(msg, target);
103
+ },
104
+ },
105
+ };
106
+
107
+ function render(_ctx, _cache, $props, $setup, $data, $options) {
108
+ return (vue.openBlock(), vue.createElementBlock("iframe", vue.mergeProps({ ref: "iframe" }, _ctx.$attrs), null, 16 /* FULL_PROPS */))
109
+ }
110
+
111
+ script.render = render;
112
+ script.__file = "./iframe-resizer.vue";
113
+
114
+ const index = {
115
+ install(Vue) {
116
+ Vue.component('IframeResizer', script);
117
+ },
118
+ };
119
+
120
+ return index;
121
+
122
+ }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@iframe-resizer/vue",
3
- "version": "5.0.1-alpha.1",
3
+ "version": "5.0.1-beta.1",
4
4
  "license": "GPL-3.0",
5
5
  "homepage": "https://iframe-resizer.com",
6
6
  "author": {
@@ -17,8 +17,11 @@
17
17
  "type": "individual",
18
18
  "url": "https://iframe-resizer.com/pricing/"
19
19
  },
20
- "main": "index.cjs.js",
20
+ "main": "index.umd.js",
21
21
  "module": "index.esm.js",
22
+ "browser": {
23
+ "./sfc": "iframe-resizer.vue"
24
+ },
22
25
  "peerDependencies": {
23
26
  "vue": "^2.6.0 || ^3.0.0"
24
27
  },