@gravity-ui/page-constructor 1.16.1-alpha.0 → 1.16.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.
Files changed (12) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/build/cjs/components/OverflowScroller/OverflowScroller.css +5 -14
  3. package/build/cjs/components/OverflowScroller/OverflowScroller.d.ts +1 -1
  4. package/build/cjs/components/OverflowScroller/OverflowScroller.js +5 -13
  5. package/build/cjs/navigation/components/Header/Header.css +2 -1
  6. package/build/cjs/sub-blocks/HubspotForm/HubspotForm.css +12 -7
  7. package/build/esm/components/OverflowScroller/OverflowScroller.css +5 -14
  8. package/build/esm/components/OverflowScroller/OverflowScroller.d.ts +1 -1
  9. package/build/esm/components/OverflowScroller/OverflowScroller.js +5 -13
  10. package/build/esm/navigation/components/Header/Header.css +2 -1
  11. package/build/esm/sub-blocks/HubspotForm/HubspotForm.css +12 -7
  12. package/package.json +1 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Changelog
2
2
 
3
+ ## [1.16.2](https://github.com/gravity-ui/page-constructor/compare/v1.16.1...v1.16.2) (2023-02-16)
4
+
5
+
6
+ ### Bug Fixes
7
+
8
+ * **HubspotForm:** required checkbox ([#154](https://github.com/gravity-ui/page-constructor/issues/154)) ([6c948d1](https://github.com/gravity-ui/page-constructor/commit/6c948d1a3511e16902e6808d83ac3f0ac14b6d9c))
9
+
3
10
  ## [1.16.1](https://github.com/gravity-ui/page-constructor/compare/v1.16.0...v1.16.1) (2023-02-14)
4
11
 
5
12
 
package/build/cjs/components/OverflowScroller/OverflowScroller.css CHANGED
@@ -2,21 +2,11 @@
2
2
  position: relative;
3
3
  overflow-x: hidden;
4
4
  }
5
- .pc-overflow-scroller__container {
6
- width: 100%;
7
- position: relative;
8
- }
9
- .pc-overflow-scroller__container_padding-left {
10
- padding-left: 24px;
11
- }
12
- .pc-overflow-scroller__container_padding-right {
13
- padding-right: 24px;
14
- }
15
5
  .pc-overflow-scroller__wrapper {
16
6
  position: relative;
17
- transition: left 0.6s;
7
+ transition: left 0.3s;
18
8
  }
19
- .pc-overflow-scroller__arrow {
9
+ .pc-overflow-scroller__scroller {
20
10
  position: absolute;
21
11
  z-index: 10;
22
12
  top: 0;
@@ -27,11 +17,12 @@
27
17
  height: calc(100% - 1px);
28
18
  cursor: pointer;
29
19
  color: var(--yc-color-text-secondary);
20
+ background: linear-gradient(to left, var(--yc-color-base-background) 70%, var(--pc-transparent) 100%) no-repeat;
30
21
  }
31
- .pc-overflow-scroller__arrow_type_left {
22
+ .pc-overflow-scroller__scroller_type_left {
32
23
  left: 0;
33
24
  transform: rotate(180deg);
34
25
  }
35
- .pc-overflow-scroller__arrow_type_right {
26
+ .pc-overflow-scroller__scroller_type_right {
36
27
  right: 0;
37
28
  }
package/build/cjs/components/OverflowScroller/OverflowScroller.d.ts CHANGED
@@ -11,7 +11,7 @@ export interface OverflowScrollerState {
11
11
  }
12
12
  export default class OverflowScroller extends React.Component<PropsWithChildren<OverflowScrollerProps>, OverflowScrollerState> {
13
13
  state: {
14
- arrows: Arrow[];
14
+ arrows: never[];
15
15
  scrollValue: number;
16
16
  };
17
17
  containerRef: React.RefObject<HTMLDivElement>;
package/build/cjs/components/OverflowScroller/OverflowScroller.js CHANGED
@@ -7,7 +7,6 @@ const utils_1 = require("../../utils");
7
7
  const __1 = require("..");
8
8
  const b = (0, utils_1.block)('overflow-scroller');
9
9
  const TRANSITION_TIME = 300;
10
- const PADDING_SIZE = 24;
11
10
  class OverflowScroller extends react_1.default.Component {
12
11
  constructor() {
13
12
  super(...arguments);
@@ -31,7 +30,7 @@ class OverflowScroller extends react_1.default.Component {
31
30
  }
32
31
  }, 100);
33
32
  this.handleScrollClick = (e, arrow) => {
34
- const { scrollValue, arrows } = this.state;
33
+ const { scrollValue } = this.state;
35
34
  const { onScrollStart } = this.props;
36
35
  if (this.containerRef &&
37
36
  this.containerRef.current &&
@@ -40,9 +39,8 @@ class OverflowScroller extends react_1.default.Component {
40
39
  const containerWidth = this.containerRef.current.offsetWidth;
41
40
  const wrapperWidth = this.wrapperRef.current.offsetWidth;
42
41
  const hiddenWidth = arrow === 'right' ? wrapperWidth - (containerWidth + scrollValue) : scrollValue;
43
- const padding = arrows.length > 1 && hiddenWidth + PADDING_SIZE > containerWidth ? PADDING_SIZE : 0;
44
42
  const delta = containerWidth > hiddenWidth ? hiddenWidth : containerWidth;
45
- const newScrollValue = arrow === 'right' ? scrollValue + delta + padding : scrollValue - delta - padding;
43
+ const newScrollValue = arrow === 'right' ? scrollValue + delta : scrollValue - delta;
46
44
  let newArrows = ['left', 'right'];
47
45
  if (newScrollValue + containerWidth >= wrapperWidth) {
48
46
  newArrows = ['left'];
@@ -75,15 +73,9 @@ class OverflowScroller extends react_1.default.Component {
75
73
  const { className, children } = this.props;
76
74
  const { arrows, scrollValue } = this.state;
77
75
  const wrapperStyle = arrows.length ? { left: -scrollValue } : { left: 0 };
78
- const paddingLeft = arrows.includes('left');
79
- const paddingRight = arrows.includes('right');
80
- return (react_1.default.createElement("div", { className: b('container', {
81
- 'padding-left': paddingLeft,
82
- 'padding-right': paddingRight,
83
- }) },
84
- react_1.default.createElement("div", { className: b(null, className), ref: this.containerRef },
85
- react_1.default.createElement("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef }, children)),
86
- arrows.map((direction) => (react_1.default.createElement("div", { key: direction, className: b('arrow', { type: direction }), onClick: (e) => this.handleScrollClick(e, direction) },
76
+ return (react_1.default.createElement("div", { className: b(null, className), ref: this.containerRef },
77
+ react_1.default.createElement("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef }, children),
78
+ arrows.map((direction) => (react_1.default.createElement("div", { key: direction, className: b('scroller', { type: direction }), onClick: (e) => this.handleScrollClick(e, direction) },
87
79
  react_1.default.createElement(__1.ToggleArrow, { size: 18, type: 'horizontal', iconType: "navigation" }))))));
88
80
  }
89
81
  }
package/build/cjs/navigation/components/Header/Header.css CHANGED
@@ -29,6 +29,7 @@ unpredictable css rules order in build */
29
29
  }
30
30
  .pc-header__navigation.pc-header__navigation {
31
31
  position: relative;
32
+ margin-right: 20px;
32
33
  flex: 1 0 0;
33
34
  justify-content: flex-start;
34
35
  }
@@ -48,7 +49,7 @@ unpredictable css rules order in build */
48
49
  flex: 1 0 0;
49
50
  justify-content: space-between;
50
51
  align-items: center;
51
- margin-right: 32px;
52
+ margin-right: 20px;
52
53
  }
53
54
  .pc-header__buttons {
54
55
  display: flex;
package/build/cjs/sub-blocks/HubspotForm/HubspotForm.css CHANGED
@@ -126,9 +126,9 @@ unpredictable css rules order in build */
126
126
  opacity: 0;
127
127
  flex-shrink: 0;
128
128
  }
129
- .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span,
130
- .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span,
131
- .pc-hubspot-form .hs-form-field .hs-form-radio-display span {
129
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required),
130
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required),
131
+ .pc-hubspot-form .hs-form-field .hs-form-radio-display span:not(.hs-form-required) {
132
132
  color: var(--yc-color-text-primary);
133
133
  font-size: var(--yc-text-body-2-font-size);
134
134
  line-height: 16px;
@@ -136,12 +136,17 @@ unpredictable css rules order in build */
136
136
  margin: 0;
137
137
  flex-grow: 1;
138
138
  }
139
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display .hs-form-required,
140
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display .hs-form-required,
141
+ .pc-hubspot-form .hs-form-field .hs-form-radio-display .hs-form-required {
142
+ top: 0;
143
+ }
139
144
  .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display,
140
145
  .pc-hubspot-form .hs-form-field .hs-form-checkbox-display {
141
146
  position: relative;
142
147
  }
143
- .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:before,
144
- .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:before {
148
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required):before,
149
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required):before {
145
150
  content: "";
146
151
  position: absolute;
147
152
  top: 0;
@@ -153,8 +158,8 @@ unpredictable css rules order in build */
153
158
  border: 1px solid var(--yc-color-line-generic-accent);
154
159
  transition: background-color 0.1s linear;
155
160
  }
156
- .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:after,
157
- .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:after {
161
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required):after,
162
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required):after {
158
163
  content: "";
159
164
  position: absolute;
160
165
  top: -10px;
package/build/esm/components/OverflowScroller/OverflowScroller.css CHANGED
@@ -2,21 +2,11 @@
2
2
  position: relative;
3
3
  overflow-x: hidden;
4
4
  }
5
- .pc-overflow-scroller__container {
6
- width: 100%;
7
- position: relative;
8
- }
9
- .pc-overflow-scroller__container_padding-left {
10
- padding-left: 24px;
11
- }
12
- .pc-overflow-scroller__container_padding-right {
13
- padding-right: 24px;
14
- }
15
5
  .pc-overflow-scroller__wrapper {
16
6
  position: relative;
17
- transition: left 0.6s;
7
+ transition: left 0.3s;
18
8
  }
19
- .pc-overflow-scroller__arrow {
9
+ .pc-overflow-scroller__scroller {
20
10
  position: absolute;
21
11
  z-index: 10;
22
12
  top: 0;
@@ -27,11 +17,12 @@
27
17
  height: calc(100% - 1px);
28
18
  cursor: pointer;
29
19
  color: var(--yc-color-text-secondary);
20
+ background: linear-gradient(to left, var(--yc-color-base-background) 70%, var(--pc-transparent) 100%) no-repeat;
30
21
  }
31
- .pc-overflow-scroller__arrow_type_left {
22
+ .pc-overflow-scroller__scroller_type_left {
32
23
  left: 0;
33
24
  transform: rotate(180deg);
34
25
  }
35
- .pc-overflow-scroller__arrow_type_right {
26
+ .pc-overflow-scroller__scroller_type_right {
36
27
  right: 0;
37
28
  }
package/build/esm/components/OverflowScroller/OverflowScroller.d.ts CHANGED
@@ -12,7 +12,7 @@ export interface OverflowScrollerState {
12
12
  }
13
13
  export default class OverflowScroller extends React.Component<PropsWithChildren<OverflowScrollerProps>, OverflowScrollerState> {
14
14
  state: {
15
- arrows: Arrow[];
15
+ arrows: never[];
16
16
  scrollValue: number;
17
17
  };
18
18
  containerRef: React.RefObject<HTMLDivElement>;
package/build/esm/components/OverflowScroller/OverflowScroller.js CHANGED
@@ -5,7 +5,6 @@ import { ToggleArrow } from '..';
5
5
  import './OverflowScroller.css';
6
6
  const b = block('overflow-scroller');
7
7
  const TRANSITION_TIME = 300;
8
- const PADDING_SIZE = 24;
9
8
  export default class OverflowScroller extends React.Component {
10
9
  constructor() {
11
10
  super(...arguments);
@@ -29,7 +28,7 @@ export default class OverflowScroller extends React.Component {
29
28
  }
30
29
  }, 100);
31
30
  this.handleScrollClick = (e, arrow) => {
32
- const { scrollValue, arrows } = this.state;
31
+ const { scrollValue } = this.state;
33
32
  const { onScrollStart } = this.props;
34
33
  if (this.containerRef &&
35
34
  this.containerRef.current &&
@@ -38,9 +37,8 @@ export default class OverflowScroller extends React.Component {
38
37
  const containerWidth = this.containerRef.current.offsetWidth;
39
38
  const wrapperWidth = this.wrapperRef.current.offsetWidth;
40
39
  const hiddenWidth = arrow === 'right' ? wrapperWidth - (containerWidth + scrollValue) : scrollValue;
41
- const padding = arrows.length > 1 && hiddenWidth + PADDING_SIZE > containerWidth ? PADDING_SIZE : 0;
42
40
  const delta = containerWidth > hiddenWidth ? hiddenWidth : containerWidth;
43
- const newScrollValue = arrow === 'right' ? scrollValue + delta + padding : scrollValue - delta - padding;
41
+ const newScrollValue = arrow === 'right' ? scrollValue + delta : scrollValue - delta;
44
42
  let newArrows = ['left', 'right'];
45
43
  if (newScrollValue + containerWidth >= wrapperWidth) {
46
44
  newArrows = ['left'];
@@ -73,15 +71,9 @@ export default class OverflowScroller extends React.Component {
73
71
  const { className, children } = this.props;
74
72
  const { arrows, scrollValue } = this.state;
75
73
  const wrapperStyle = arrows.length ? { left: -scrollValue } : { left: 0 };
76
- const paddingLeft = arrows.includes('left');
77
- const paddingRight = arrows.includes('right');
78
- return (React.createElement("div", { className: b('container', {
79
- 'padding-left': paddingLeft,
80
- 'padding-right': paddingRight,
81
- }) },
82
- React.createElement("div", { className: b(null, className), ref: this.containerRef },
83
- React.createElement("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef }, children)),
84
- arrows.map((direction) => (React.createElement("div", { key: direction, className: b('arrow', { type: direction }), onClick: (e) => this.handleScrollClick(e, direction) },
74
+ return (React.createElement("div", { className: b(null, className), ref: this.containerRef },
75
+ React.createElement("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef }, children),
76
+ arrows.map((direction) => (React.createElement("div", { key: direction, className: b('scroller', { type: direction }), onClick: (e) => this.handleScrollClick(e, direction) },
85
77
  React.createElement(ToggleArrow, { size: 18, type: 'horizontal', iconType: "navigation" }))))));
86
78
  }
87
79
  }
package/build/esm/navigation/components/Header/Header.css CHANGED
@@ -29,6 +29,7 @@ unpredictable css rules order in build */
29
29
  }
30
30
  .pc-header__navigation.pc-header__navigation {
31
31
  position: relative;
32
+ margin-right: 20px;
32
33
  flex: 1 0 0;
33
34
  justify-content: flex-start;
34
35
  }
@@ -48,7 +49,7 @@ unpredictable css rules order in build */
48
49
  flex: 1 0 0;
49
50
  justify-content: space-between;
50
51
  align-items: center;
51
- margin-right: 32px;
52
+ margin-right: 20px;
52
53
  }
53
54
  .pc-header__buttons {
54
55
  display: flex;
package/build/esm/sub-blocks/HubspotForm/HubspotForm.css CHANGED
@@ -126,9 +126,9 @@ unpredictable css rules order in build */
126
126
  opacity: 0;
127
127
  flex-shrink: 0;
128
128
  }
129
- .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span,
130
- .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span,
131
- .pc-hubspot-form .hs-form-field .hs-form-radio-display span {
129
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required),
130
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required),
131
+ .pc-hubspot-form .hs-form-field .hs-form-radio-display span:not(.hs-form-required) {
132
132
  color: var(--yc-color-text-primary);
133
133
  font-size: var(--yc-text-body-2-font-size);
134
134
  line-height: 16px;
@@ -136,12 +136,17 @@ unpredictable css rules order in build */
136
136
  margin: 0;
137
137
  flex-grow: 1;
138
138
  }
139
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display .hs-form-required,
140
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display .hs-form-required,
141
+ .pc-hubspot-form .hs-form-field .hs-form-radio-display .hs-form-required {
142
+ top: 0;
143
+ }
139
144
  .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display,
140
145
  .pc-hubspot-form .hs-form-field .hs-form-checkbox-display {
141
146
  position: relative;
142
147
  }
143
- .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:before,
144
- .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:before {
148
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required):before,
149
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required):before {
145
150
  content: "";
146
151
  position: absolute;
147
152
  top: 0;
@@ -153,8 +158,8 @@ unpredictable css rules order in build */
153
158
  border: 1px solid var(--yc-color-line-generic-accent);
154
159
  transition: background-color 0.1s linear;
155
160
  }
156
- .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:after,
157
- .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:after {
161
+ .pc-hubspot-form .hs-form-field .hs-form-booleancheckbox-display span:not(.hs-form-required):after,
162
+ .pc-hubspot-form .hs-form-field .hs-form-checkbox-display span:not(.hs-form-required):after {
158
163
  content: "";
159
164
  position: absolute;
160
165
  top: -10px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/page-constructor",
3
- "version": "1.16.1-alpha.0",
3
+ "version": "1.16.2",
4
4
  "description": "Gravity UI Page Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -135,8 +135,5 @@
135
135
  "*.{json,yaml,yml,md}": [
136
136
  "prettier --write"
137
137
  ]
138
- },
139
- "publishConfig": {
140
- "tag": "alpha"
141
138
  }
142
139
  }