@kiva/kv-components 4.2.1 → 4.3.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.
Files changed (4) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/components/KvSideSheet.vue +10 -2
  3. package/package.json +2 -2
  4. package/vue/KvSideSheet.vue +10 -2
package/CHANGELOG.md CHANGED
@@ -3,6 +3,28 @@
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
+ # [4.3.0](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@4.2.2...@kiva/kv-components@4.3.0) (2024-12-10)
7
+
8
+
9
+ ### Features
10
+
11
+ * scroll user to original position when sheet is opening in mobile ([0c783fa](https://github.com/kiva/kv-ui-elements/commit/0c783fae5f61cb2958fb6220baa284c4287bedac))
12
+
13
+
14
+
15
+
16
+
17
+ ## [4.2.2](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@4.2.1...@kiva/kv-components@4.2.2) (2024-12-09)
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * opacity-low left a white space when closing sidesheet ([5ac062e](https://github.com/kiva/kv-ui-elements/commit/5ac062ed16bf4ddba1fc8a64ada95084b271546f))
23
+
24
+
25
+
26
+
27
+
6
28
  ## [4.2.1](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@4.2.0...@kiva/kv-components@4.2.1) (2024-12-09)
7
29
 
8
30
 
package/dist/components/KvSideSheet.vue CHANGED
@@ -13,7 +13,7 @@
13
13
  class="tw-absolute tw-right-0 tw-h-full tw-transition-all tw-duration-300 tw-bg-white
14
14
  tw-overflow-hidden"
15
15
  :class="{
16
- 'tw-w-0 tw-p-0 tw-delay-200 tw-opacity-low': !open,
16
+ 'tw-w-0 tw-p-0 tw-delay-200 tw-opacity-0': !open,
17
17
  'lg:tw-w-1/2 tw-w-full tw-p-2 tw-opacity-full': open,
18
18
  }"
19
19
  :style="modalStyles"
@@ -119,12 +119,18 @@ export default {
119
119
  const open = ref(false);
120
120
  const initialStyles = ref({});
121
121
  const modalStyles = ref({});
122
+ const userScrollPosition = ref(0);
122
123
 
123
124
  const closeSideSheet = () => {
124
125
  open.value = false;
125
126
  kvTrackFunction.value(trackEventCategory.value, 'click', 'side-sheet-closed');
126
127
 
127
- if (animationSourceElement.value) {
128
+ if (animationSourceElement.value && window.scrollTo) {
129
+ window.scrollTo({
130
+ top: userScrollPosition.value,
131
+ behavior: 'smooth',
132
+ });
133
+
128
134
  modalStyles.value = {
129
135
  ...initialStyles.value,
130
136
  transition: 'all 0.5s ease-in-out',
@@ -154,6 +160,8 @@ export default {
154
160
  const height = rect?.height ?? 0;
155
161
 
156
162
  if (top || left || width || height) {
163
+ userScrollPosition.value = window.scrollY ?? 0;
164
+
157
165
  initialStyles.value = {
158
166
  position: 'fixed',
159
167
  top: `${top}px`,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kiva/kv-components",
3
- "version": "4.2.1",
3
+ "version": "4.3.0",
4
4
  "type": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -96,5 +96,5 @@
96
96
  "peerDependencies": {
97
97
  "vue": ">=3.0.0"
98
98
  },
99
- "gitHead": "60d3d90e5999f0e39dcd44799bcd739e27bb1866"
99
+ "gitHead": "59cde71cb180af5440ab3ac7792ae58ea12eb843"
100
100
  }
package/vue/KvSideSheet.vue CHANGED
@@ -13,7 +13,7 @@
13
13
  class="tw-absolute tw-right-0 tw-h-full tw-transition-all tw-duration-300 tw-bg-white
14
14
  tw-overflow-hidden"
15
15
  :class="{
16
- 'tw-w-0 tw-p-0 tw-delay-200 tw-opacity-low': !open,
16
+ 'tw-w-0 tw-p-0 tw-delay-200 tw-opacity-0': !open,
17
17
  'lg:tw-w-1/2 tw-w-full tw-p-2 tw-opacity-full': open,
18
18
  }"
19
19
  :style="modalStyles"
@@ -119,12 +119,18 @@ export default {
119
119
  const open = ref(false);
120
120
  const initialStyles = ref({});
121
121
  const modalStyles = ref({});
122
+ const userScrollPosition = ref(0);
122
123
 
123
124
  const closeSideSheet = () => {
124
125
  open.value = false;
125
126
  kvTrackFunction.value(trackEventCategory.value, 'click', 'side-sheet-closed');
126
127
 
127
- if (animationSourceElement.value) {
128
+ if (animationSourceElement.value && window.scrollTo) {
129
+ window.scrollTo({
130
+ top: userScrollPosition.value,
131
+ behavior: 'smooth',
132
+ });
133
+
128
134
  modalStyles.value = {
129
135
  ...initialStyles.value,
130
136
  transition: 'all 0.5s ease-in-out',
@@ -154,6 +160,8 @@ export default {
154
160
  const height = rect?.height ?? 0;
155
161
 
156
162
  if (top || left || width || height) {
163
+ userScrollPosition.value = window.scrollY ?? 0;
164
+
157
165
  initialStyles.value = {
158
166
  position: 'fixed',
159
167
  top: `${top}px`,