@vkontakte/vkui 8.2.3 → 8.3.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "type": "module",
-  "version": "8.2.3",
+  "version": "8.3.1",
   "name": "@vkontakte/vkui",
   "description": "VKUI library",
   "module": "./dist/index.js",
@@ -87,16 +87,17 @@
     "react-dom": "^18.2.0 || ^19.0.0"
   },
   "dependencies": {
-    "@swc/helpers": "^0.5.21",
-    "@vkontakte/icons": "^3.0.0",
+    "@swc/helpers": "^0.5.23",
+    "@vkontakte/icons": "^3.58.0",
     "@vkontakte/vkjs": "^2.0.2",
     "@vkontakte/vkui-date-fns-tz": "^0.0.6",
     "@vkontakte/vkui-floating-ui": "^0.2.8"
   },
   "devDependencies": {
-    "@biomejs/biome": "^2.4.15",
+    "@biomejs/biome": "^2.5.0",
     "@types/node": "*",
     "@types/postcss-import": "^14.0.3",
+    "@vkontakte/storybook-addons": "^1.0.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "size-limit": "^12.1.0",

package/src/components/CalendarTime/ComboBox.tsx

@@ -178,6 +178,7 @@ export function ComboBox({
           autoUpdateOnTargetResize
           flipMiddlewareFallbackAxisSideDirection="none"
           offsetByMainAxis={0}
+          usePortal={false}
         >
           <CustomScrollView tabIndex={-1} className={styles.customScroll}>
             {labelsElements}

package/src/components/FormField/FormField.module.css

@@ -172,11 +172,14 @@
 /* [end] */
 
 .disabled {
-  pointer-events: none;
-  cursor: default;
+  cursor: not-allowed;
   opacity: var(--vkui--opacity_disable);
 }
 
+.disabled > .scrollContainer {
+  pointer-events: none;
+}
+
 /**
  * CMP:
  * NativeSelect
@@ -210,7 +213,7 @@
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
 :global(
     .vkuiInternalFormLayoutGroup--segmented.vkuiInternalFormLayoutGroup--mode-horizontal
-    .vkuiInternalFormItem
+      .vkuiInternalFormItem
   ):first-of-type
   .host {
   border-start-start-radius: var(--vkui--size_border_radius--regular);
@@ -220,7 +223,7 @@
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
 :global(
     .vkuiInternalFormLayoutGroup--segmented.vkuiInternalFormLayoutGroup--mode-horizontal
-    .vkuiInternalFormItem
+      .vkuiInternalFormItem
   ):last-of-type
   .host {
   border-start-end-radius: var(--vkui--size_border_radius--regular);
@@ -230,7 +233,7 @@
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
 :global(
     .vkuiInternalFormLayoutGroup--segmented.vkuiInternalFormLayoutGroup--mode-vertical
-    .vkuiInternalFormItem
+      .vkuiInternalFormItem
   ):first-of-type
   .host {
   border-start-start-radius: var(--vkui--size_border_radius--regular);
@@ -240,7 +243,7 @@
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
 :global(
     .vkuiInternalFormLayoutGroup--segmented.vkuiInternalFormLayoutGroup--mode-vertical
-    .vkuiInternalFormItem
+      .vkuiInternalFormItem
   ):last-of-type
   .host {
   border-end-start-radius: var(--vkui--size_border_radius--regular);

package/src/components/FormField/FormField.module.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["./FormField.module.css"],"names":["host","scrollContainer","content","densityCompact","densityNone","iconWrapper","before","after","iconAlignStart","iconAlignEnd","border","modeDefault","hover","focusVisible","statusError","statusValid","disabled"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAYAC,iB,WAZA;AAAA,E,aAqBAC,S,WArBA;AAAA,E,aA4BAC,gB,WA5BA;AAAA,E,aAiCEC,a,WAjCF;AAAA,E,aAuCAJ,M,WAvCA;AAAA,E,aA4CAK,a,WA5CA;AAAA,E,aAoDAC,Q,WApDA;AAAA,E,aAqDAC,O,WArDA;AAAA,E,aA+DAJ,gB,WA/DA;AAAA,E,aA+DgBG,Q,WA/DhB;AAAA,E,aAgEAH,gB,WAhEA;AAAA,E,aAgEgBI,O,WAhEhB;AAAA,E,aAqEEH,a,WArEF;AAAA,E,aAqEeE,Q,WArEf;AAAA,E,aAsEIF,a,WAtEJ;AAAA,E,aAsEiBG,O,WAtEjB;AAAA,E,aA2EAC,gB,WA3EA;AAAA,E,aA+EAC,c,WA/EA;AAAA,E,aAmFAH,Q,WAnFA;AAAA,E,aAuFAC,O,WAvFA;AAAA,E,aA2FAG,Q,WA3FA;AAAA,E,aAyGAC,a,WAzGA;AAAA,E,aAyGeD,Q,WAzGf;AAAA,E,aA6GAC,a,WA7GA;AAAA,E,aAiHAC,O,WAjHA;AAAA,E,aAqHAD,a,WArHA;AAAA,E,aAqHYC,O,WArHZ;AAAA,E,aAqHqBF,Q,WArHrB;AAAA,E,aA8HAG,c,WA9HA;AAAA,E,aA8HaA,c,WA9Hb;AAAA,E,aA8H6BH,Q,WA9H7B;AAAA,E,aAwI6CC,a,WAxI7C;AAAA,E,aAwI4DD,Q,WAxI5D;AAAA,E,aA2IEG,c,WA3IF;AAAA,E,aA4IIH,Q,WA5IJ;AAAA,E,aA6IAI,a,WA7IA;AAAA,E,aA6IYH,a,WA7IZ;AAAA,E,aA6I2BD,Q,WA7I3B;AAAA,E,aA8IAI,a,WA9IA;AAAA,E,aA8IYD,c,WA9IZ;AAAA,E,aA8I4BH,Q,WA9I5B;AAAA,E,aAoJ6CV,M,WApJ7C;AAAA,E,aAqJAc,a,WArJA;AAAA,E,aA2J6CH,a,WA3J7C;AAAA,E,aA2J4DD,Q,WA3J5D;AAAA,E,aA8JEG,c,WA9JF;AAAA,E,aA+JIH,Q,WA/JJ;AAAA,E,aAgKAK,a,WAhKA;AAAA,E,aAgKYJ,a,WAhKZ;AAAA,E,aAgK2BD,Q,WAhK3B;AAAA,E,aAiKAK,a,WAjKA;AAAA,E,aAiKYF,c,WAjKZ;AAAA,E,aAiK4BH,Q,WAjK5B;AAAA,E,aAuK6CV,M,WAvK7C;AAAA,E,aAuKuDW,a,WAvKvD;AAAA,E,aAwKAI,a,WAxKA;AAAA,E,aAwKiBJ,a,WAxKjB;AAAA,E,aA6KAK,U,WA7KA;AAAA,E,aAwLmCT,O,WAxLnC;AAAA,E,aAiM6CA,O,WAjM7C;AAAA,E,aA2MiDP,M,WA3MjD;AAAA,E,aAsNEA,M,WAtNF;AAAA,E,aAgOEA,M,WAhOF;AAAA,E,aA0OEA,M,WA1OF;AAAA,E,aAoPEA,M,WApPF;AAAA;AAAA","file":"FormField.module.css.d.ts","sourceRoot":""}
+{"version":3,"sources":["./FormField.module.css"],"names":["host","scrollContainer","content","densityCompact","densityNone","iconWrapper","before","after","iconAlignStart","iconAlignEnd","border","modeDefault","hover","focusVisible","statusError","statusValid","disabled"],"mappings":"AAAA;AAAA,E,aAAAA,M,WAAA;AAAA,E,aAYAC,iB,WAZA;AAAA,E,aAqBAC,S,WArBA;AAAA,E,aA4BAC,gB,WA5BA;AAAA,E,aAiCEC,a,WAjCF;AAAA,E,aAuCAJ,M,WAvCA;AAAA,E,aA4CAK,a,WA5CA;AAAA,E,aAoDAC,Q,WApDA;AAAA,E,aAqDAC,O,WArDA;AAAA,E,aA+DAJ,gB,WA/DA;AAAA,E,aA+DgBG,Q,WA/DhB;AAAA,E,aAgEAH,gB,WAhEA;AAAA,E,aAgEgBI,O,WAhEhB;AAAA,E,aAqEEH,a,WArEF;AAAA,E,aAqEeE,Q,WArEf;AAAA,E,aAsEIF,a,WAtEJ;AAAA,E,aAsEiBG,O,WAtEjB;AAAA,E,aA2EAC,gB,WA3EA;AAAA,E,aA+EAC,c,WA/EA;AAAA,E,aAmFAH,Q,WAnFA;AAAA,E,aAuFAC,O,WAvFA;AAAA,E,aA2FAG,Q,WA3FA;AAAA,E,aAyGAC,a,WAzGA;AAAA,E,aAyGeD,Q,WAzGf;AAAA,E,aA6GAC,a,WA7GA;AAAA,E,aAiHAC,O,WAjHA;AAAA,E,aAqHAD,a,WArHA;AAAA,E,aAqHYC,O,WArHZ;AAAA,E,aAqHqBF,Q,WArHrB;AAAA,E,aA8HAG,c,WA9HA;AAAA,E,aA8HaA,c,WA9Hb;AAAA,E,aA8H6BH,Q,WA9H7B;AAAA,E,aAwI6CC,a,WAxI7C;AAAA,E,aAwI4DD,Q,WAxI5D;AAAA,E,aA2IEG,c,WA3IF;AAAA,E,aA4IIH,Q,WA5IJ;AAAA,E,aA6IAI,a,WA7IA;AAAA,E,aA6IYH,a,WA7IZ;AAAA,E,aA6I2BD,Q,WA7I3B;AAAA,E,aA8IAI,a,WA9IA;AAAA,E,aA8IYD,c,WA9IZ;AAAA,E,aA8I4BH,Q,WA9I5B;AAAA,E,aAoJ6CV,M,WApJ7C;AAAA,E,aAqJAc,a,WArJA;AAAA,E,aA2J6CH,a,WA3J7C;AAAA,E,aA2J4DD,Q,WA3J5D;AAAA,E,aA8JEG,c,WA9JF;AAAA,E,aA+JIH,Q,WA/JJ;AAAA,E,aAgKAK,a,WAhKA;AAAA,E,aAgKYJ,a,WAhKZ;AAAA,E,aAgK2BD,Q,WAhK3B;AAAA,E,aAiKAK,a,WAjKA;AAAA,E,aAiKYF,c,WAjKZ;AAAA,E,aAiK4BH,Q,WAjK5B;AAAA,E,aAuK6CV,M,WAvK7C;AAAA,E,aAuKuDW,a,WAvKvD;AAAA,E,aAwKAI,a,WAxKA;AAAA,E,aAwKiBJ,a,WAxKjB;AAAA,E,aA6KAK,U,WA7KA;AAAA,E,aAkLAA,U,WAlLA;AAAA,E,aAkLYf,iB,WAlLZ;AAAA,E,aA2LmCM,O,WA3LnC;AAAA,E,aAoM6CA,O,WApM7C;AAAA,E,aA8MiDP,M,WA9MjD;AAAA,E,aAyNEA,M,WAzNF;AAAA,E,aAmOEA,M,WAnOF;AAAA,E,aA6OEA,M,WA7OF;AAAA,E,aAuPEA,M,WAvPF;AAAA;AAAA","file":"FormField.module.css.d.ts","sourceRoot":""}

package/src/components/View/ViewInfinite.tsx

@@ -195,14 +195,14 @@ class ViewInfiniteComponent extends React.Component<
       if (this.shouldDisableTransitionMotion()) {
         this.flushTransition(prevProps.activePanel, isBack);
       } else {
-        this.setState({
+        this.setState(() => ({
           visiblePanels: [prevProps.activePanel, this.props.activePanel],
           prevPanel: prevProps.activePanel,
           nextPanel: this.props.activePanel,
           activePanel: null,
           animated: true,
           isBack,
-        });
+        }));
       }
     }
 
@@ -268,14 +268,14 @@ class ViewInfiniteComponent extends React.Component<
 
     // Закончился Safari свайп
     if (prevProps.activePanel !== this.props.activePanel && this.state.browserSwipe) {
-      this.setState({
+      this.setState(() => ({
         browserSwipe: false,
         nextPanel: null,
         prevPanel: null,
         animated: false,
         visiblePanels: [this.props.activePanel],
         activePanel: this.props.activePanel,
-      });
+      }));
     }
   }
 
@@ -462,12 +462,12 @@ class ViewInfiniteComponent extends React.Component<
         ]);
       }
 
-      this.setState({
+      this.setState((prevState) => ({
         swipingBack: true,
         swipeBackStartX: event.startX,
-        swipeBackPrevPanel: this.state.activePanel,
-        swipeBackNextPanel: this.props.history.slice(-2)[0],
-      });
+        swipeBackPrevPanel: prevState.activePanel,
+        swipeBackNextPanel: this.props.history?.slice(-2)[0] ?? null,
+      }));
     }
 
     if (this.state.swipingBack) {

package/src/hooks/useSnackbarManager/components/SnackbarHolder.tsx

@@ -40,7 +40,7 @@ export const SnackbarHolder: React.FC<SnackbarHolderProps> = ({
         continue;
       }
 
-      if (placement !== undefined && !map[placement]) {
+      if (!map[placement]) {
         map[placement] = [];
         openedSnackbarsCountersByPlacement[placement] = 0;
         placements.push(placement);

package/src/index.ts

@@ -552,6 +552,7 @@ export type { PopperProps } from './components/Popper/Popper';
 /**
  * Types
  */
+export type { LayoutProps } from './lib/layouts';
 export type { AlignType, HasPlatform, HasRef, HasRootRef } from './types';
 export type { NavIdProps } from './lib/getNavId';
 export type { PlatformType } from './lib/platform';