@gravity-ui/page-constructor 8.13.1 → 8.13.2

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.
@@ -25,13 +25,13 @@
25
25
  transition: 300ms opacity;
26
26
  transform: translate3d(0, 0, 0);
27
27
  z-index: 10;
28
- }
29
- .swiper-pagination.swiper-pagination-hidden {
30
- opacity: 0;
31
- }
32
- .swiper-pagination-disabled > .swiper-pagination,
33
- .swiper-pagination.swiper-pagination-disabled {
34
- display: none !important;
28
+ &.swiper-pagination-hidden {
29
+ opacity: 0;
30
+ }
31
+ .swiper-pagination-disabled > &,
32
+ &.swiper-pagination-disabled {
33
+ display: none !important;
34
+ }
35
35
  }
36
36
  /* Common Styles */
37
37
  .swiper-pagination-fraction,
@@ -47,28 +47,28 @@
47
47
  .swiper-pagination-bullets-dynamic {
48
48
  overflow: hidden;
49
49
  font-size: 0;
50
- }
51
- .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
52
- transform: scale(0.33);
53
- position: relative;
54
- }
55
- .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
56
- transform: scale(1);
57
- }
58
- .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
59
- transform: scale(1);
60
- }
61
- .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
62
- transform: scale(0.66);
63
- }
64
- .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
65
- transform: scale(0.33);
66
- }
67
- .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
68
- transform: scale(0.66);
69
- }
70
- .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
71
- transform: scale(0.33);
50
+ .swiper-pagination-bullet {
51
+ transform: scale(0.33);
52
+ position: relative;
53
+ }
54
+ .swiper-pagination-bullet-active {
55
+ transform: scale(1);
56
+ }
57
+ .swiper-pagination-bullet-active-main {
58
+ transform: scale(1);
59
+ }
60
+ .swiper-pagination-bullet-active-prev {
61
+ transform: scale(0.66);
62
+ }
63
+ .swiper-pagination-bullet-active-prev-prev {
64
+ transform: scale(0.33);
65
+ }
66
+ .swiper-pagination-bullet-active-next {
67
+ transform: scale(0.66);
68
+ }
69
+ .swiper-pagination-bullet-active-next-next {
70
+ transform: scale(0.33);
71
+ }
72
72
  }
73
73
  .swiper-pagination-bullet {
74
74
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
@@ -77,64 +77,68 @@
77
77
  border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
78
78
  background: var(--swiper-pagination-bullet-inactive-color, #000);
79
79
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
80
- }
81
- button.swiper-pagination-bullet {
82
- border: none;
83
- margin: 0;
84
- padding: 0;
85
- box-shadow: none;
86
- -webkit-appearance: none;
87
- appearance: none;
88
- }
89
- .swiper-pagination-clickable .swiper-pagination-bullet {
90
- cursor: pointer;
91
- }
92
- .swiper-pagination-bullet:only-child {
93
- display: none !important;
80
+ button& {
81
+ border: none;
82
+ margin: 0;
83
+ padding: 0;
84
+ box-shadow: none;
85
+ appearance: none;
86
+ }
87
+ .swiper-pagination-clickable & {
88
+ cursor: pointer;
89
+ }
90
+
91
+ &:only-child {
92
+ display: none !important;
93
+ }
94
94
  }
95
95
  .swiper-pagination-bullet-active {
96
96
  opacity: var(--swiper-pagination-bullet-opacity, 1);
97
97
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
98
98
  }
99
+
99
100
  .swiper-vertical > .swiper-pagination-bullets,
100
101
  .swiper-pagination-vertical.swiper-pagination-bullets {
101
102
  right: var(--swiper-pagination-right, 8px);
102
103
  left: var(--swiper-pagination-left, auto);
103
104
  top: 50%;
104
105
  transform: translate3d(0px, -50%, 0);
106
+ .swiper-pagination-bullet {
107
+ margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
108
+ display: block;
109
+ }
110
+ &.swiper-pagination-bullets-dynamic {
111
+ top: 50%;
112
+ transform: translateY(-50%);
113
+ width: 8px;
114
+ .swiper-pagination-bullet {
115
+ display: inline-block;
116
+ transition:
117
+ 200ms transform,
118
+ 200ms top;
119
+ }
120
+ }
105
121
  }
106
- .swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet,
107
- .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet {
108
- margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
109
- display: block;
110
- }
111
- .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
112
- .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
113
- top: 50%;
114
- transform: translateY(-50%);
115
- width: 8px;
116
- }
117
- .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
118
- .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
119
- display: inline-block;
120
- transition: 200ms transform, 200ms top;
121
- }
122
- .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
123
- .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
124
- margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
125
- }
126
- .swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
127
- .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
128
- left: 50%;
129
- transform: translateX(-50%);
130
- white-space: nowrap;
131
- }
132
- .swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
133
- .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
134
- transition: 200ms transform, 200ms left;
122
+ .swiper-horizontal > .swiper-pagination-bullets,
123
+ .swiper-pagination-horizontal.swiper-pagination-bullets {
124
+ .swiper-pagination-bullet {
125
+ margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
126
+ }
127
+ &.swiper-pagination-bullets-dynamic {
128
+ left: 50%;
129
+ transform: translateX(-50%);
130
+ white-space: nowrap;
131
+ .swiper-pagination-bullet {
132
+ transition:
133
+ 200ms transform,
134
+ 200ms left;
135
+ }
136
+ }
135
137
  }
136
138
  .swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
137
- transition: 200ms transform, 200ms right;
139
+ transition:
140
+ 200ms transform,
141
+ 200ms right;
138
142
  }
139
143
  /* Fraction */
140
144
  .swiper-pagination-fraction {
@@ -144,37 +148,37 @@ button.swiper-pagination-bullet {
144
148
  .swiper-pagination-progressbar {
145
149
  background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));
146
150
  position: absolute;
147
- }
148
- .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
149
- background: var(--swiper-pagination-color, var(--swiper-theme-color));
150
- position: absolute;
151
- left: 0;
152
- top: 0;
153
- width: 100%;
154
- height: 100%;
155
- transform: scale(0);
156
- transform-origin: left top;
157
- }
158
- .swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
159
- transform-origin: right top;
160
- }
161
- .swiper-horizontal > .swiper-pagination-progressbar,
162
- .swiper-pagination-progressbar.swiper-pagination-horizontal,
163
- .swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
164
- .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
165
- width: 100%;
166
- height: var(--swiper-pagination-progressbar-size, 4px);
167
- left: 0;
168
- top: 0;
169
- }
170
- .swiper-vertical > .swiper-pagination-progressbar,
171
- .swiper-pagination-progressbar.swiper-pagination-vertical,
172
- .swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
173
- .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
174
- width: var(--swiper-pagination-progressbar-size, 4px);
175
- height: 100%;
176
- left: 0;
177
- top: 0;
151
+ .swiper-pagination-progressbar-fill {
152
+ background: var(--swiper-pagination-color, var(--swiper-theme-color));
153
+ position: absolute;
154
+ left: 0;
155
+ top: 0;
156
+ width: 100%;
157
+ height: 100%;
158
+ transform: scale(0);
159
+ transform-origin: left top;
160
+ }
161
+ .swiper-rtl & .swiper-pagination-progressbar-fill {
162
+ transform-origin: right top;
163
+ }
164
+ .swiper-horizontal > &,
165
+ &.swiper-pagination-horizontal,
166
+ .swiper-vertical > &.swiper-pagination-progressbar-opposite,
167
+ &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
168
+ width: 100%;
169
+ height: var(--swiper-pagination-progressbar-size, 4px);
170
+ left: 0;
171
+ top: 0;
172
+ }
173
+ .swiper-vertical > &,
174
+ &.swiper-pagination-vertical,
175
+ .swiper-horizontal > &.swiper-pagination-progressbar-opposite,
176
+ &.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
177
+ width: var(--swiper-pagination-progressbar-size, 4px);
178
+ height: 100%;
179
+ left: 0;
180
+ top: 0;
181
+ }
178
182
  }
179
183
  .swiper-pagination-lock {
180
184
  display: none;
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "swiper",
3
- "version": "10.3.1",
3
+ "version": "12.2.0",
4
4
  "type": "commonjs",
5
5
  "main": "./swiper.js",
6
6
  "exports": {
@@ -160,6 +160,10 @@ type SwiperProps = Omit<
160
160
  */
161
161
  onBeforeDestroy?: (swiper: SwiperClass) => void;
162
162
 
163
+ /**
164
+ * Event will be fired after slides and their sizes are calculated and updated
165
+ */
166
+ onSlidesUpdated?: (swiper: SwiperClass) => void;
163
167
  /**
164
168
  * Event will be fired when currently active slide is changed
165
169
  */
@@ -432,6 +436,7 @@ type SwiperProps = Omit<
432
436
  interface SlideData {
433
437
  isActive: boolean;
434
438
  isVisible: boolean;
439
+ isFullyVisible: boolean;
435
440
  isPrev: boolean;
436
441
  isNext: boolean;
437
442
  }