@indielayer/ui 0.2.3 → 0.2.4

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 (9) hide show
  1. package/lib/cjs/components/collapse/Collapse.vue_vue_type_script_lang.js +8 -5
  2. package/lib/cjs/components/textarea/Textarea.vue_vue_type_script_lang.js +10 -1
  3. package/lib/esm/components/collapse/Collapse.vue_vue_type_script_lang.js +8 -5
  4. package/lib/esm/components/textarea/Textarea.vue_vue_type_script_lang.js +10 -1
  5. package/lib/umd/index.js +18 -6
  6. package/package.json +2 -2
  7. package/src/components/collapse/Collapse.vue +8 -5
  8. package/src/components/textarea/Textarea.vue +10 -1
  9. package/src/nuxt.js +6 -0
package/lib/cjs/components/collapse/Collapse.vue_vue_type_script_lang.js CHANGED
@@ -29,19 +29,22 @@ var script = {
29
29
  return {
30
30
  collapsed: !this.expanded,
31
31
  maxHeight: !this.expanded ? 0 : 'auto',
32
+ observer: null,
32
33
  }
33
34
  },
34
35
 
35
36
  beforeMount() {
36
- window.addEventListener('resize', this.resizeContent);
37
+ window.addEventListener('resize', this.onResize);
37
38
  },
38
39
 
39
40
  beforeUnmount() {
40
- window.removeEventListener('resize', this.resizeContent);
41
+ this.observer.disconnect();
42
+ window.removeEventListener('resize', this.onResize);
41
43
  },
42
44
 
43
45
  mounted() {
44
- this.resizeContent();
46
+ this.observer = new ResizeObserver(this.onResize);
47
+ this.observer.observe(this.$refs.content);
45
48
  },
46
49
 
47
50
  methods: {
@@ -50,10 +53,10 @@ var script = {
50
53
 
51
54
  this.collapsed = !this.collapsed;
52
55
  this.$emit('toggle', this.collapsed);
53
- this.resizeContent();
56
+ this.onResize();
54
57
  },
55
58
 
56
- resizeContent() {
59
+ onResize() {
57
60
  if (this.collapsed) {
58
61
  this.maxHeight = 0;
59
62
  } else {
package/lib/cjs/components/textarea/Textarea.vue_vue_type_script_lang.js CHANGED
@@ -69,6 +69,12 @@ var script = {
69
69
  }
70
70
  },
71
71
 
72
+ data() {
73
+ return {
74
+ observer: null,
75
+ }
76
+ },
77
+
72
78
  watch: {
73
79
  modelValue() {
74
80
  setTimeout(this.resize);
@@ -79,11 +85,14 @@ var script = {
79
85
  },
80
86
 
81
87
  mounted() {
82
- this.resize();
88
+ this.observer = new ResizeObserver(this.resize);
89
+ this.observer.observe(this.$refs.focusRef);
90
+
83
91
  window.addEventListener('resize', this.resize);
84
92
  },
85
93
 
86
94
  beforeUnmount() {
95
+ this.observer.disconnect();
87
96
  window.removeEventListener('resize', this.resize);
88
97
  },
89
98
 
package/lib/esm/components/collapse/Collapse.vue_vue_type_script_lang.js CHANGED
@@ -27,19 +27,22 @@ var script = {
27
27
  return {
28
28
  collapsed: !this.expanded,
29
29
  maxHeight: !this.expanded ? 0 : 'auto',
30
+ observer: null,
30
31
  }
31
32
  },
32
33
 
33
34
  beforeMount() {
34
- window.addEventListener('resize', this.resizeContent);
35
+ window.addEventListener('resize', this.onResize);
35
36
  },
36
37
 
37
38
  beforeUnmount() {
38
- window.removeEventListener('resize', this.resizeContent);
39
+ this.observer.disconnect();
40
+ window.removeEventListener('resize', this.onResize);
39
41
  },
40
42
 
41
43
  mounted() {
42
- this.resizeContent();
44
+ this.observer = new ResizeObserver(this.onResize);
45
+ this.observer.observe(this.$refs.content);
43
46
  },
44
47
 
45
48
  methods: {
@@ -48,10 +51,10 @@ var script = {
48
51
 
49
52
  this.collapsed = !this.collapsed;
50
53
  this.$emit('toggle', this.collapsed);
51
- this.resizeContent();
54
+ this.onResize();
52
55
  },
53
56
 
54
- resizeContent() {
57
+ onResize() {
55
58
  if (this.collapsed) {
56
59
  this.maxHeight = 0;
57
60
  } else {
package/lib/esm/components/textarea/Textarea.vue_vue_type_script_lang.js CHANGED
@@ -67,6 +67,12 @@ var script = {
67
67
  }
68
68
  },
69
69
 
70
+ data() {
71
+ return {
72
+ observer: null,
73
+ }
74
+ },
75
+
70
76
  watch: {
71
77
  modelValue() {
72
78
  setTimeout(this.resize);
@@ -77,11 +83,14 @@ var script = {
77
83
  },
78
84
 
79
85
  mounted() {
80
- this.resize();
86
+ this.observer = new ResizeObserver(this.resize);
87
+ this.observer.observe(this.$refs.focusRef);
88
+
81
89
  window.addEventListener('resize', this.resize);
82
90
  },
83
91
 
84
92
  beforeUnmount() {
93
+ this.observer.disconnect();
85
94
  window.removeEventListener('resize', this.resize);
86
95
  },
87
96
 
package/lib/umd/index.js CHANGED
@@ -802,19 +802,22 @@
802
802
  return {
803
803
  collapsed: !this.expanded,
804
804
  maxHeight: !this.expanded ? 0 : 'auto',
805
+ observer: null,
805
806
  }
806
807
  },
807
808
 
808
809
  beforeMount() {
809
- window.addEventListener('resize', this.resizeContent);
810
+ window.addEventListener('resize', this.onResize);
810
811
  },
811
812
 
812
813
  beforeUnmount() {
813
- window.removeEventListener('resize', this.resizeContent);
814
+ this.observer.disconnect();
815
+ window.removeEventListener('resize', this.onResize);
814
816
  },
815
817
 
816
818
  mounted() {
817
- this.resizeContent();
819
+ this.observer = new ResizeObserver(this.onResize);
820
+ this.observer.observe(this.$refs.content);
818
821
  },
819
822
 
820
823
  methods: {
@@ -823,10 +826,10 @@
823
826
 
824
827
  this.collapsed = !this.collapsed;
825
828
  this.$emit('toggle', this.collapsed);
826
- this.resizeContent();
829
+ this.onResize();
827
830
  },
828
831
 
829
- resizeContent() {
832
+ onResize() {
830
833
  if (this.collapsed) {
831
834
  this.maxHeight = 0;
832
835
  } else {
@@ -3413,6 +3416,12 @@
3413
3416
  }
3414
3417
  },
3415
3418
 
3419
+ data() {
3420
+ return {
3421
+ observer: null,
3422
+ }
3423
+ },
3424
+
3416
3425
  watch: {
3417
3426
  modelValue() {
3418
3427
  setTimeout(this.resize);
@@ -3423,11 +3432,14 @@
3423
3432
  },
3424
3433
 
3425
3434
  mounted() {
3426
- this.resize();
3435
+ this.observer = new ResizeObserver(this.resize);
3436
+ this.observer.observe(this.$refs.focusRef);
3437
+
3427
3438
  window.addEventListener('resize', this.resize);
3428
3439
  },
3429
3440
 
3430
3441
  beforeUnmount() {
3442
+ this.observer.disconnect();
3431
3443
  window.removeEventListener('resize', this.resize);
3432
3444
  },
3433
3445
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@indielayer/ui",
3
- "version": "0.2.3",
3
+ "version": "0.2.4",
4
4
  "description": "Indielayer UI Components with Tailwind CSS build for Vue 3",
5
5
  "author": {
6
6
  "name": "João Teixeira",
@@ -73,5 +73,5 @@
73
73
  "publishConfig": {
74
74
  "access": "public"
75
75
  },
76
- "gitHead": "584d734f14dae0f255b8b9207cf03c39e995ca94"
76
+ "gitHead": "bc828716102b0e6063aa0db9cd74c84e46fbe9a7"
77
77
  }
package/src/components/collapse/Collapse.vue CHANGED
@@ -82,19 +82,22 @@ export default {
82
82
  return {
83
83
  collapsed: !this.expanded,
84
84
  maxHeight: !this.expanded ? 0 : 'auto',
85
+ observer: null,
85
86
  }
86
87
  },
87
88
 
88
89
  beforeMount() {
89
- window.addEventListener('resize', this.resizeContent)
90
+ window.addEventListener('resize', this.onResize)
90
91
  },
91
92
 
92
93
  beforeUnmount() {
93
- window.removeEventListener('resize', this.resizeContent)
94
+ this.observer.disconnect()
95
+ window.removeEventListener('resize', this.onResize)
94
96
  },
95
97
 
96
98
  mounted() {
97
- this.resizeContent()
99
+ this.observer = new ResizeObserver(this.onResize)
100
+ this.observer.observe(this.$refs.content)
98
101
  },
99
102
 
100
103
  methods: {
@@ -103,10 +106,10 @@ export default {
103
106
 
104
107
  this.collapsed = !this.collapsed
105
108
  this.$emit('toggle', this.collapsed)
106
- this.resizeContent()
109
+ this.onResize()
107
110
  },
108
111
 
109
- resizeContent() {
112
+ onResize() {
110
113
  if (this.collapsed) {
111
114
  this.maxHeight = 0
112
115
  } else {
package/src/components/textarea/Textarea.vue CHANGED
@@ -123,6 +123,12 @@ export default {
123
123
  }
124
124
  },
125
125
 
126
+ data() {
127
+ return {
128
+ observer: null,
129
+ }
130
+ },
131
+
126
132
  watch: {
127
133
  modelValue() {
128
134
  setTimeout(this.resize)
@@ -133,11 +139,14 @@ export default {
133
139
  },
134
140
 
135
141
  mounted() {
136
- this.resize()
142
+ this.observer = new ResizeObserver(this.resize)
143
+ this.observer.observe(this.$refs.focusRef)
144
+
137
145
  window.addEventListener('resize', this.resize)
138
146
  },
139
147
 
140
148
  beforeUnmount() {
149
+ this.observer.disconnect()
141
150
  window.removeEventListener('resize', this.resize)
142
151
  },
143
152
 
package/src/nuxt.js CHANGED
@@ -8,6 +8,12 @@ export default defineNuxtModule((nuxt) => ({
8
8
  path: join(__dirname, 'components'),
9
9
  prefix: options?.prefix ? options?.prefix : 'X',
10
10
  })
11
+
12
+ // temp import XTab - would be XTabsTab
13
+ dirs.push({
14
+ path: join(__dirname, 'components/tabs'),
15
+ prefix: options?.prefix ? options?.prefix : 'X',
16
+ })
11
17
  })
12
18
  },
13
19
  }))