@vkontakte/vkui 4.24.0 → 4.25.0

package/dist/components/FormItem/FormItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FormItem/FormItem.tsx"],"names":["React","classNames","useExternRef","usePlatform","getClassName","hasReactNode","noop","Subhead","Caption","useAdaptivity","Removable","FormItem","children","top","bottom","status","Component","removable","onRemove","removePlaceholder","getRootRef","restProps","platform","rootEl","sizeY","wrappedChildren","e","current"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,YAAT,EAAuBC,IAAvB;AACA,OAAOC,OAAP;AACA,OAAOC,OAAP;AACA,SAASC,aAAT;AACA,SAASC,SAAT;AAiBA,OAAO,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAW5B;AAAA,MAVnBC,QAUmB,QAVnBA,QAUmB;AAAA,MATnBC,GASmB,QATnBA,GASmB;AAAA,MARnBC,MAQmB,QARnBA,MAQmB;AAAA,yBAPnBC,MAOmB;AAAA,MAPnBA,MAOmB,4BAPV,SAOU;AAAA,4BANnBC,SAMmB;AAAA,MANnBA,SAMmB,+BANP,KAMO;AAAA,MALnBC,SAKmB,QALnBA,SAKmB;AAAA,2BAJnBC,QAImB;AAAA,MAJnBA,SAImB,8BAJRZ,IAIQ;AAAA,mCAHnBa,iBAGmB;AAAA,MAHnBA,iBAGmB,sCAHC,SAGD;AAAA,MAFnBC,UAEmB,QAFnBA,UAEmB;AAAA,MADhBC,SACgB;;AACnB,MAAMC,QAAQ,GAAGnB,WAAW,EAA5B;AACA,MAAMoB,MAAM,GAAGrB,YAAY,CAACkB,UAAD,CAA3B;;AACA,uBAAkBX,aAAa,EAA/B;AAAA,MAAQe,KAAR,kBAAQA,KAAR;;AAEA,MAAMC,eAAe,GACnB,oBAAC,KAAD,CAAO,QAAP,QACGpB,YAAY,CAACQ,GAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,MAAM,EAAC,SAAhB;AAA0B,IAAA,SAAS,EAAC;AAApC,KACGA,GADH,CAFJ,EAMGD,QANH,EAOGP,YAAY,CAACS,MAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,KAAK,EAAC,GAAf;AAAmB,IAAA,MAAM,EAAC,SAA1B;AAAoC,IAAA,SAAS,EAAC;AAA9C,KACGA,MADH,CARJ,CADF;AAgBA,SACE,oBAAC,SAAD,eACMO,SADN;AAEE,IAAA,GAAG,EAAEE,MAFP;AAGE,IAAA,SAAS,EAAEtB,UAAU,CACnBG,YAAY,CAAC,UAAD,EAAakB,QAAb,CADO,sBAENP,MAFM,6BAGAS,KAHA,GAInB;AACE,2BAAqBnB,YAAY,CAACQ,GAAD,CADnC;AAEE,6BAAuBI;AAFzB,KAJmB;AAHvB,MAaGA,SAAS,GACR,oBAAC,SAAD;AACE,IAAA,KAAK,EAAC,OADR;AAEE,IAAA,QAAQ,EAAE,kBAACS,CAAD;AAAA,aAAOR,SAAQ,CAACQ,CAAD,EAAIH,MAAJ,aAAIA,MAAJ,uBAAIA,MAAM,CAAEI,OAAZ,CAAf;AAAA,KAFZ;AAGE,IAAA,iBAAiB,EAAER;AAHrB,KAKE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAsCM,eAAtC,CALF,CADQ,GASRA,eAtBJ,CADF;AA2BD,CA3DM","sourcesContent":["import * as React from \"react\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { hasReactNode, noop } from \"../../lib/utils\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { Removable, RemovableProps } from \"../Removable/Removable\";\nimport \"./FormItem.css\";\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  top?: React.ReactNode;\n  bottom?: React.ReactNode;\n  status?: \"default\" | \"error\" | \"valid\";\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   */\n  removable?: boolean;\n}\n\nexport const FormItem: React.FC<FormItemProps> = ({\n  children,\n  top,\n  bottom,\n  status = \"default\",\n  Component = \"div\",\n  removable,\n  onRemove = noop,\n  removePlaceholder = \"Удалить\",\n  getRootRef,\n  ...restProps\n}: FormItemProps) => {\n  const platform = usePlatform();\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {hasReactNode(top) && (\n        <Subhead weight=\"regular\" vkuiClass=\"FormItem__top\">\n          {top}\n        </Subhead>\n      )}\n      {children}\n      {hasReactNode(bottom) && (\n        <Caption level=\"1\" weight=\"regular\" vkuiClass=\"FormItem__bottom\">\n          {bottom}\n        </Caption>\n      )}\n    </React.Fragment>\n  );\n\n  return (\n    <Component\n      {...restProps}\n      ref={rootEl}\n      vkuiClass={classNames(\n        getClassName(\"FormItem\", platform),\n        `FormItem--${status}`,\n        `FormItem--sizeY-${sizeY}`,\n        {\n          \"FormItem--withTop\": hasReactNode(top),\n          \"FormItem--removable\": removable,\n        }\n      )}\n    >\n      {removable ? (\n        <Removable\n          align=\"start\"\n          onRemove={(e) => onRemove(e, rootEl?.current)}\n          removePlaceholder={removePlaceholder}\n        >\n          <div vkuiClass=\"FormItem__removable\">{wrappedChildren}</div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"file":"FormItem.js"}
+{"version":3,"sources":["../../../src/components/FormItem/FormItem.tsx"],"names":["React","classNames","useExternRef","usePlatform","getClassName","hasReactNode","noop","Subhead","Caption","useAdaptivity","Removable","FormItem","children","top","bottom","status","Component","removable","onRemove","removePlaceholder","getRootRef","restProps","platform","rootEl","sizeY","wrappedChildren","e","current"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,YAAT,EAAuBC,IAAvB;AACA,OAAOC,OAAP;AACA,OAAOC,OAAP;AACA,SAASC,aAAT;AACA,SAASC,SAAT;AAiBA,OAAO,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAW5B;AAAA,MAVnBC,QAUmB,QAVnBA,QAUmB;AAAA,MATnBC,GASmB,QATnBA,GASmB;AAAA,MARnBC,MAQmB,QARnBA,MAQmB;AAAA,yBAPnBC,MAOmB;AAAA,MAPnBA,MAOmB,4BAPV,SAOU;AAAA,4BANnBC,SAMmB;AAAA,MANnBA,SAMmB,+BANP,KAMO;AAAA,MALnBC,SAKmB,QALnBA,SAKmB;AAAA,2BAJnBC,QAImB;AAAA,MAJnBA,SAImB,8BAJRZ,IAIQ;AAAA,mCAHnBa,iBAGmB;AAAA,MAHnBA,iBAGmB,sCAHC,SAGD;AAAA,MAFnBC,UAEmB,QAFnBA,UAEmB;AAAA,MADhBC,SACgB;;AACnB,MAAMC,QAAQ,GAAGnB,WAAW,EAA5B;AACA,MAAMoB,MAAM,GAAGrB,YAAY,CAACkB,UAAD,CAA3B;;AACA,uBAAkBX,aAAa,EAA/B;AAAA,MAAQe,KAAR,kBAAQA,KAAR;;AAEA,MAAMC,eAAe,GACnB,oBAAC,KAAD,CAAO,QAAP,QACGpB,YAAY,CAACQ,GAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,MAAM,EAAC,SAAhB;AAA0B,IAAA,SAAS,EAAC;AAApC,KACGA,GADH,CAFJ,EAMGD,QANH,EAOGP,YAAY,CAACS,MAAD,CAAZ,IACC,oBAAC,OAAD;AAAS,IAAA,KAAK,EAAC,GAAf;AAAmB,IAAA,MAAM,EAAC,SAA1B;AAAoC,IAAA,SAAS,EAAC;AAA9C,KACGA,MADH,CARJ,CADF;AAgBA,SACE,oBAAC,SAAD,eACMO,SADN;AAEE,IAAA,GAAG,EAAEE,MAFP;AAGE,IAAA,SAAS,EAAEtB,UAAU,CACnBG,YAAY,CAAC,UAAD,EAAakB,QAAb,CADO,sBAENP,MAFM,6BAGAS,KAHA,GAInB;AACE,2BAAqBnB,YAAY,CAACQ,GAAD,CADnC;AAEE,6BAAuBI;AAFzB,KAJmB;AAHvB,MAaGA,SAAS,GACR,oBAAC,SAAD;AACE,IAAA,KAAK,EAAC,OADR;AAEE,IAAA,QAAQ,EAAE,kBAACS,CAAD,EAAO;AACf,UAAIH,MAAJ,aAAIA,MAAJ,eAAIA,MAAM,CAAEI,OAAZ,EAAqB;AACnBT,QAAAA,SAAQ,CAACQ,CAAD,EAAIH,MAAM,CAACI,OAAX,CAAR;AACD;AACF,KANH;AAOE,IAAA,iBAAiB,EAAER;AAPrB,KASE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAsCM,eAAtC,CATF,CADQ,GAaRA,eA1BJ,CADF;AA+BD,CA/DM","sourcesContent":["import * as React from \"react\";\nimport { HasComponent, HasRootRef } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { hasReactNode, noop } from \"../../lib/utils\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Caption from \"../Typography/Caption/Caption\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { Removable, RemovableProps } from \"../Removable/Removable\";\nimport \"./FormItem.css\";\n\nexport interface FormItemProps\n  extends React.AllHTMLAttributes<HTMLElement>,\n    HasRootRef<HTMLElement>,\n    HasComponent,\n    RemovableProps {\n  top?: React.ReactNode;\n  bottom?: React.ReactNode;\n  status?: \"default\" | \"error\" | \"valid\";\n  /**\n   * Дает возможность удалить `FormItem`. Рекомендуется использовать только для `Input` или `Select`.\n   */\n  removable?: boolean;\n}\n\nexport const FormItem: React.FC<FormItemProps> = ({\n  children,\n  top,\n  bottom,\n  status = \"default\",\n  Component = \"div\",\n  removable,\n  onRemove = noop,\n  removePlaceholder = \"Удалить\",\n  getRootRef,\n  ...restProps\n}: FormItemProps) => {\n  const platform = usePlatform();\n  const rootEl = useExternRef(getRootRef);\n  const { sizeY } = useAdaptivity();\n\n  const wrappedChildren = (\n    <React.Fragment>\n      {hasReactNode(top) && (\n        <Subhead weight=\"regular\" vkuiClass=\"FormItem__top\">\n          {top}\n        </Subhead>\n      )}\n      {children}\n      {hasReactNode(bottom) && (\n        <Caption level=\"1\" weight=\"regular\" vkuiClass=\"FormItem__bottom\">\n          {bottom}\n        </Caption>\n      )}\n    </React.Fragment>\n  );\n\n  return (\n    <Component\n      {...restProps}\n      ref={rootEl}\n      vkuiClass={classNames(\n        getClassName(\"FormItem\", platform),\n        `FormItem--${status}`,\n        `FormItem--sizeY-${sizeY}`,\n        {\n          \"FormItem--withTop\": hasReactNode(top),\n          \"FormItem--removable\": removable,\n        }\n      )}\n    >\n      {removable ? (\n        <Removable\n          align=\"start\"\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n          removePlaceholder={removePlaceholder}\n        >\n          <div vkuiClass=\"FormItem__removable\">{wrappedChildren}</div>\n        </Removable>\n      ) : (\n        wrappedChildren\n      )}\n    </Component>\n  );\n};\n"],"file":"FormItem.js"}

package/dist/components/FormLayout/FormLayout.d.ts

@@ -2,5 +2,5 @@ import * as React from "react";
 import { HasComponent, HasRef } from "../../types";
 import "./FormLayout.css";
 export declare type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> & HasRef<HTMLElement> & HasComponent;
-declare const FormLayout: React.FunctionComponent<FormLayoutProps>;
+declare const FormLayout: React.FC<FormLayoutProps>;
 export default FormLayout;

package/dist/components/FormLayout/FormLayout.js

@@ -11,9 +11,11 @@ var preventDefault = function preventDefault(e) {
 
 var FormLayout = function FormLayout(props) {
   var children = props.children,
-      Component = props.Component,
+      _props$Component = props.Component,
+      Component = _props$Component === void 0 ? "form" : _props$Component,
       getRef = props.getRef,
-      onSubmit = props.onSubmit,
+      _props$onSubmit = props.onSubmit,
+      onSubmit = _props$onSubmit === void 0 ? preventDefault : _props$onSubmit,
       restProps = _objectWithoutProperties(props, _excluded);
 
   var platform = usePlatform();
@@ -28,11 +30,8 @@ var FormLayout = function FormLayout(props) {
     vkuiClass: "FormLayout__submit",
     value: ""
   }));
-};
+}; // eslint-disable-next-line import/no-default-export
+
 
-FormLayout.defaultProps = {
-  Component: "form",
-  onSubmit: preventDefault
-};
 export default FormLayout;
 //# sourceMappingURL=FormLayout.js.map

package/dist/components/FormLayout/FormLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FormLayout/FormLayout.tsx"],"names":["getClassName","usePlatform","preventDefault","e","FormLayout","props","children","Component","getRef","onSubmit","restProps","platform","defaultProps"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,WAAT;;AAIA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAACC,CAAD;AAAA,SAAwBA,CAAC,CAACD,cAAF,EAAxB;AAAA,CAAvB;;AAMA,IAAME,UAAoD,GAAG,SAAvDA,UAAuD,CAC3DC,KAD2D,EAExD;AACH,MAAQC,QAAR,GAAgED,KAAhE,CAAQC,QAAR;AAAA,MAAkBC,SAAlB,GAAgEF,KAAhE,CAAkBE,SAAlB;AAAA,MAA6BC,MAA7B,GAAgEH,KAAhE,CAA6BG,MAA7B;AAAA,MAAqCC,QAArC,GAAgEJ,KAAhE,CAAqCI,QAArC;AAAA,MAAkDC,SAAlD,4BAAgEL,KAAhE;;AAEA,MAAMM,QAAQ,GAAGV,WAAW,EAA5B;AACA,SACE,oBAAC,SAAD,eACMS,SADN;AAEE,IAAA,SAAS,EAAEV,YAAY,CAAC,YAAD,EAAeW,QAAf,CAFzB;AAGE,IAAA,QAAQ,EAAEF,QAHZ;AAIE,IAAA,GAAG,EAAED;AAJP,MAME;AAAK,IAAA,SAAS,EAAC;AAAf,KAAwCF,QAAxC,CANF,EAOGC,SAAS,KAAK,MAAd,IACC;AAAO,IAAA,IAAI,EAAC,QAAZ;AAAqB,IAAA,SAAS,EAAC,oBAA/B;AAAoD,IAAA,KAAK,EAAC;AAA1D,IARJ,CADF;AAaD,CAnBD;;AAqBAH,UAAU,CAACQ,YAAX,GAA0B;AACxBL,EAAAA,SAAS,EAAE,MADa;AAExBE,EAAAA,QAAQ,EAAEP;AAFc,CAA1B;AAKA,eAAeE,UAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasComponent, HasRef } from \"../../types\";\nimport \"./FormLayout.css\";\n\nconst preventDefault = (e: React.FormEvent) => e.preventDefault();\n\nexport type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> &\n  HasRef<HTMLElement> &\n  HasComponent;\n\nconst FormLayout: React.FunctionComponent<FormLayoutProps> = (\n  props: FormLayoutProps\n) => {\n  const { children, Component, getRef, onSubmit, ...restProps } = props;\n\n  const platform = usePlatform();\n  return (\n    <Component\n      {...restProps}\n      vkuiClass={getClassName(\"FormLayout\", platform)}\n      onSubmit={onSubmit}\n      ref={getRef}\n    >\n      <div vkuiClass=\"FormLayout__container\">{children}</div>\n      {Component === \"form\" && (\n        <input type=\"submit\" vkuiClass=\"FormLayout__submit\" value=\"\" />\n      )}\n    </Component>\n  );\n};\n\nFormLayout.defaultProps = {\n  Component: \"form\",\n  onSubmit: preventDefault,\n};\n\nexport default FormLayout;\n"],"file":"FormLayout.js"}
+{"version":3,"sources":["../../../src/components/FormLayout/FormLayout.tsx"],"names":["getClassName","usePlatform","preventDefault","e","FormLayout","props","children","Component","getRef","onSubmit","restProps","platform"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,WAAT;;AAIA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAACC,CAAD;AAAA,SAAwBA,CAAC,CAACD,cAAF,EAAxB;AAAA,CAAvB;;AAMA,IAAME,UAAqC,GAAG,SAAxCA,UAAwC,CAACC,KAAD,EAA4B;AACxE,MACEC,QADF,GAMID,KANJ,CACEC,QADF;AAAA,yBAMID,KANJ,CAEEE,SAFF;AAAA,MAEEA,SAFF,iCAEc,MAFd;AAAA,MAGEC,MAHF,GAMIH,KANJ,CAGEG,MAHF;AAAA,wBAMIH,KANJ,CAIEI,QAJF;AAAA,MAIEA,QAJF,gCAIaP,cAJb;AAAA,MAKKQ,SALL,4BAMIL,KANJ;;AAQA,MAAMM,QAAQ,GAAGV,WAAW,EAA5B;AACA,SACE,oBAAC,SAAD,eACMS,SADN;AAEE,IAAA,SAAS,EAAEV,YAAY,CAAC,YAAD,EAAeW,QAAf,CAFzB;AAGE,IAAA,QAAQ,EAAEF,QAHZ;AAIE,IAAA,GAAG,EAAED;AAJP,MAME;AAAK,IAAA,SAAS,EAAC;AAAf,KAAwCF,QAAxC,CANF,EAOGC,SAAS,KAAK,MAAd,IACC;AAAO,IAAA,IAAI,EAAC,QAAZ;AAAqB,IAAA,SAAS,EAAC,oBAA/B;AAAoD,IAAA,KAAK,EAAC;AAA1D,IARJ,CADF;AAaD,CAvBD,C,CAyBA;;;AACA,eAAeH,UAAf","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasComponent, HasRef } from \"../../types\";\nimport \"./FormLayout.css\";\n\nconst preventDefault = (e: React.FormEvent) => e.preventDefault();\n\nexport type FormLayoutProps = React.AllHTMLAttributes<HTMLElement> &\n  HasRef<HTMLElement> &\n  HasComponent;\n\nconst FormLayout: React.FC<FormLayoutProps> = (props: FormLayoutProps) => {\n  const {\n    children,\n    Component = \"form\",\n    getRef,\n    onSubmit = preventDefault,\n    ...restProps\n  } = props;\n\n  const platform = usePlatform();\n  return (\n    <Component\n      {...restProps}\n      vkuiClass={getClassName(\"FormLayout\", platform)}\n      onSubmit={onSubmit}\n      ref={getRef}\n    >\n      <div vkuiClass=\"FormLayout__container\">{children}</div>\n      {Component === \"form\" && (\n        <input type=\"submit\" vkuiClass=\"FormLayout__submit\" value=\"\" />\n      )}\n    </Component>\n  );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default FormLayout;\n"],"file":"FormLayout.js"}

package/dist/components/FormLayoutGroup/FormLayoutGroup.js

@@ -39,10 +39,13 @@ var FormLayoutGroup = function FormLayoutGroup(_ref) {
     align: "start",
     removePlaceholder: removePlaceholder,
     onRemove: function onRemove(e) {
-      return _onRemove(e, rootEl === null || rootEl === void 0 ? void 0 : rootEl.current);
+      if (rootEl !== null && rootEl !== void 0 && rootEl.current) {
+        _onRemove(e, rootEl.current);
+      }
     }
   }, children) : children);
-};
+}; // eslint-disable-next-line import/no-default-export
+
 
 export default FormLayoutGroup;
 //# sourceMappingURL=FormLayoutGroup.js.map

package/dist/components/FormLayoutGroup/FormLayoutGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"names":["getClassName","classNames","noop","useExternRef","usePlatform","Removable","useAdaptivity","FormLayoutGroup","children","mode","removable","removePlaceholder","onRemove","getRootRef","restProps","platform","sizeY","isRemovable","rootEl","e","current"],"mappings":";;;;AAEA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,IAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,SAAT;AACA,SAASC,aAAT;;AAcA,IAAMC,eAA+C,GAAG,SAAlDA,eAAkD,OAQ5B;AAAA,MAP1BC,QAO0B,QAP1BA,QAO0B;AAAA,uBAN1BC,IAM0B;AAAA,MAN1BA,IAM0B,0BANnB,UAMmB;AAAA,MAL1BC,SAK0B,QAL1BA,SAK0B;AAAA,mCAJ1BC,iBAI0B;AAAA,MAJ1BA,iBAI0B,sCAJN,SAIM;AAAA,2BAH1BC,QAG0B;AAAA,MAH1BA,SAG0B,8BAHfV,IAGe;AAAA,MAF1BW,UAE0B,QAF1BA,UAE0B;AAAA,MADvBC,SACuB;;AAC1B,MAAMC,QAAQ,GAAGX,WAAW,EAA5B;;AACA,uBAAkBE,aAAa,EAA/B;AAAA,MAAQU,KAAR,kBAAQA,KAAR;;AACA,MAAMC,WAAW,GAAGP,SAAS,IAAID,IAAI,KAAK,YAA1C;AACA,MAAMS,MAAM,GAAGf,YAAY,CAACU,UAAD,CAA3B;AAEA,SACE;AACE,IAAA,GAAG,EAAEK,MADP;AAEE,IAAA,SAAS,EAAEjB,UAAU,CACnBD,YAAY,CAAC,iBAAD,EAAoBe,QAApB,CADO,mCAEOC,KAFP,8BAGCP,IAHD,GAInB;AACE,oCAA8BQ;AADhC,KAJmB;AAFvB,KAUMH,SAVN,GAYGG,WAAW,GACV,oBAAC,SAAD;AACE,IAAA,SAAS,EAAC,4BADZ;AAEE,IAAA,KAAK,EAAC,OAFR;AAGE,IAAA,iBAAiB,EAAEN,iBAHrB;AAIE,IAAA,QAAQ,EAAE,kBAACQ,CAAD;AAAA,aAAOP,SAAQ,CAACO,CAAD,EAAID,MAAJ,aAAIA,MAAJ,uBAAIA,MAAM,CAAEE,OAAZ,CAAf;AAAA;AAJZ,KAMGZ,QANH,CADU,GAUVA,QAtBJ,CADF;AA2BD,CAzCD;;AA2CA,eAAeD,eAAf","sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { noop } from \"../../lib/utils\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { Removable, RemovableProps } from \"../Removable/Removable\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport \"./FormLayoutGroup.css\";\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: \"vertical\" | \"horizontal\";\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   */\n  removable?: boolean;\n}\n\nconst FormLayoutGroup: React.FC<FormLayoutGroupProps> = ({\n  children,\n  mode = \"vertical\",\n  removable,\n  removePlaceholder = \"Удалить\",\n  onRemove = noop,\n  getRootRef,\n  ...restProps\n}: FormLayoutGroupProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const isRemovable = removable && mode === \"horizontal\";\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <div\n      ref={rootEl}\n      vkuiClass={classNames(\n        getClassName(\"FormLayoutGroup\", platform),\n        `FormLayoutGroup--sizeY-${sizeY}`,\n        `FormLayoutGroup--${mode}`,\n        {\n          \"FormLayoutGroup--removable\": isRemovable,\n        }\n      )}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          vkuiClass=\"FormLayoutGroup__removable\"\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => onRemove(e, rootEl?.current)}\n        >\n          {children}\n        </Removable>\n      ) : (\n        children\n      )}\n    </div>\n  );\n};\n\nexport default FormLayoutGroup;\n"],"file":"FormLayoutGroup.js"}
+{"version":3,"sources":["../../../src/components/FormLayoutGroup/FormLayoutGroup.tsx"],"names":["getClassName","classNames","noop","useExternRef","usePlatform","Removable","useAdaptivity","FormLayoutGroup","children","mode","removable","removePlaceholder","onRemove","getRootRef","restProps","platform","sizeY","isRemovable","rootEl","e","current"],"mappings":";;;;AAEA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,IAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AACA,SAASC,SAAT;AACA,SAASC,aAAT;;AAcA,IAAMC,eAA+C,GAAG,SAAlDA,eAAkD,OAQ5B;AAAA,MAP1BC,QAO0B,QAP1BA,QAO0B;AAAA,uBAN1BC,IAM0B;AAAA,MAN1BA,IAM0B,0BANnB,UAMmB;AAAA,MAL1BC,SAK0B,QAL1BA,SAK0B;AAAA,mCAJ1BC,iBAI0B;AAAA,MAJ1BA,iBAI0B,sCAJN,SAIM;AAAA,2BAH1BC,QAG0B;AAAA,MAH1BA,SAG0B,8BAHfV,IAGe;AAAA,MAF1BW,UAE0B,QAF1BA,UAE0B;AAAA,MADvBC,SACuB;;AAC1B,MAAMC,QAAQ,GAAGX,WAAW,EAA5B;;AACA,uBAAkBE,aAAa,EAA/B;AAAA,MAAQU,KAAR,kBAAQA,KAAR;;AACA,MAAMC,WAAW,GAAGP,SAAS,IAAID,IAAI,KAAK,YAA1C;AACA,MAAMS,MAAM,GAAGf,YAAY,CAACU,UAAD,CAA3B;AAEA,SACE;AACE,IAAA,GAAG,EAAEK,MADP;AAEE,IAAA,SAAS,EAAEjB,UAAU,CACnBD,YAAY,CAAC,iBAAD,EAAoBe,QAApB,CADO,mCAEOC,KAFP,8BAGCP,IAHD,GAInB;AACE,oCAA8BQ;AADhC,KAJmB;AAFvB,KAUMH,SAVN,GAYGG,WAAW,GACV,oBAAC,SAAD;AACE,IAAA,SAAS,EAAC,4BADZ;AAEE,IAAA,KAAK,EAAC,OAFR;AAGE,IAAA,iBAAiB,EAAEN,iBAHrB;AAIE,IAAA,QAAQ,EAAE,kBAACQ,CAAD,EAAO;AACf,UAAID,MAAJ,aAAIA,MAAJ,eAAIA,MAAM,CAAEE,OAAZ,EAAqB;AACnBR,QAAAA,SAAQ,CAACO,CAAD,EAAID,MAAM,CAACE,OAAX,CAAR;AACD;AACF;AARH,KAUGZ,QAVH,CADU,GAcVA,QA1BJ,CADF;AA+BD,CA7CD,C,CA+CA;;;AACA,eAAeD,eAAf","sourcesContent":["import * as React from \"react\";\nimport { HasRootRef } from \"../../types\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { noop } from \"../../lib/utils\";\nimport { useExternRef } from \"../../hooks/useExternRef\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { Removable, RemovableProps } from \"../Removable/Removable\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport \"./FormLayoutGroup.css\";\n\nexport interface FormLayoutGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    RemovableProps,\n    HasRootRef<HTMLDivElement> {\n  mode?: \"vertical\" | \"horizontal\";\n  /**\n   * Только для режима horizontal. Дает возможность удалить всю группу `FormItem`.\n   */\n  removable?: boolean;\n}\n\nconst FormLayoutGroup: React.FC<FormLayoutGroupProps> = ({\n  children,\n  mode = \"vertical\",\n  removable,\n  removePlaceholder = \"Удалить\",\n  onRemove = noop,\n  getRootRef,\n  ...restProps\n}: FormLayoutGroupProps) => {\n  const platform = usePlatform();\n  const { sizeY } = useAdaptivity();\n  const isRemovable = removable && mode === \"horizontal\";\n  const rootEl = useExternRef(getRootRef);\n\n  return (\n    <div\n      ref={rootEl}\n      vkuiClass={classNames(\n        getClassName(\"FormLayoutGroup\", platform),\n        `FormLayoutGroup--sizeY-${sizeY}`,\n        `FormLayoutGroup--${mode}`,\n        {\n          \"FormLayoutGroup--removable\": isRemovable,\n        }\n      )}\n      {...restProps}\n    >\n      {isRemovable ? (\n        <Removable\n          vkuiClass=\"FormLayoutGroup__removable\"\n          align=\"start\"\n          removePlaceholder={removePlaceholder}\n          onRemove={(e) => {\n            if (rootEl?.current) {\n              onRemove(e, rootEl.current);\n            }\n          }}\n        >\n          {children}\n        </Removable>\n      ) : (\n        children\n      )}\n    </div>\n  );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default FormLayoutGroup;\n"],"file":"FormLayoutGroup.js"}

package/dist/components/Gallery/Gallery.d.ts

@@ -35,5 +35,5 @@ export interface GallerySlidesState {
     coordX: number;
     width: number;
 }
-declare const _default: React.FC<GalleryProps>;
+declare const _default: React.FC<Pick<GalleryProps, "hidden" | "dir" | "slot" | "style" | "title" | "timeout" | "color" | "translate" | "bullets" | "prefix" | "children" | "className" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "scheme" | "align" | "onEnd" | "getRootRef" | "getRef" | "showArrows" | "slideWidth" | "slideIndex" | "isDraggable" | "initialSlideIndex">>;
 export default _default;

package/dist/components/Gallery/Gallery.js

@@ -34,11 +34,11 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
 
     _this = _super.call(this, props);
 
-    _defineProperty(_assertThisInitialized(_this), "container", void 0);
+    _defineProperty(_assertThisInitialized(_this), "container", null);
 
     _defineProperty(_assertThisInitialized(_this), "slidesStore", void 0);
 
-    _defineProperty(_assertThisInitialized(_this), "viewport", void 0);
+    _defineProperty(_assertThisInitialized(_this), "viewport", null);
 
     _defineProperty(_assertThisInitialized(_this), "onStart", function () {
       _this.setState({
@@ -64,14 +64,18 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "onEnd", function (e) {
-      var targetIndex = e.isSlide ? _this.getTarget(e) : _this.props.slideIndex;
+      var _this$props$slideInde;
+
+      var targetIndex = e.isSlide ? _this.getTarget(e) : (_this$props$slideInde = _this.props.slideIndex) !== null && _this$props$slideInde !== void 0 ? _this$props$slideInde : 0;
       _this.props.onDragEnd && _this.props.onDragEnd(e);
 
       _this.setState({
         deltaX: 0,
         animation: true
       }, function () {
-        return _this.props.onChange(targetIndex);
+        var _this$props$onChange, _this$props;
+
+        return (_this$props$onChange = (_this$props = _this.props).onChange) === null || _this$props$onChange === void 0 ? void 0 : _this$props$onChange.call(_this$props, targetIndex);
       });
 
       if (_this.props.onEnd) {
@@ -88,31 +92,33 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "slideLeft", function () {
-      var _this$props = _this.props,
-          slideIndex = _this$props.slideIndex,
-          onChange = _this$props.onChange;
+      var _this$props2 = _this.props,
+          _this$props2$slideInd = _this$props2.slideIndex,
+          slideIndex = _this$props2$slideInd === void 0 ? 0 : _this$props2$slideInd,
+          onChange = _this$props2.onChange;
 
       if (_this.canSlideLeft) {
         _this.setState({
           deltaX: 0,
           animation: true
         }, function () {
-          return onChange(slideIndex - 1);
+          return onChange === null || onChange === void 0 ? void 0 : onChange(slideIndex - 1);
         });
       }
     });
 
     _defineProperty(_assertThisInitialized(_this), "slideRight", function () {
-      var _this$props2 = _this.props,
-          slideIndex = _this$props2.slideIndex,
-          onChange = _this$props2.onChange;
+      var _this$props3 = _this.props,
+          _this$props3$slideInd = _this$props3.slideIndex,
+          slideIndex = _this$props3$slideInd === void 0 ? 0 : _this$props3$slideInd,
+          onChange = _this$props3.onChange;
 
       if (_this.canSlideRight) {
         _this.setState({
           deltaX: 0,
           animation: true
         }, function () {
-          return onChange(slideIndex + 1);
+          return onChange === null || onChange === void 0 ? void 0 : onChange(slideIndex + 1);
         });
       }
     });
@@ -125,12 +131,18 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "getViewportRef", function (viewport) {
       _this.viewport = viewport;
-      setRef(viewport, _this.props.getRef);
+
+      if (_this.props.getRef) {
+        setRef(viewport, _this.props.getRef);
+      }
     });
 
     _defineProperty(_assertThisInitialized(_this), "getRootRef", function (container) {
       _this.container = container;
-      setRef(container, _this.props.getRootRef);
+
+      if (_this.props.getRootRef) {
+        setRef(container, _this.props.getRootRef);
+      }
     });
 
     _this.state = {
@@ -153,18 +165,23 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "initializeSlides",
     value: function initializeSlides() {
-      var _this2 = this;
+      var _React$Children$map,
+          _this2 = this,
+          _this$container$offse,
+          _this$container;
 
       var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      var slides = React.Children.map(this.props.children, function (_item, i) {
+      var slides = (_React$Children$map = React.Children.map(this.props.children, function (_item, i) {
+        var _elem$offsetLeft, _elem$offsetWidth;
+
         var elem = _this2.slidesStore["slide-".concat(i)];
 
         return {
-          coordX: elem.offsetLeft,
-          width: elem.offsetWidth
+          coordX: (_elem$offsetLeft = elem === null || elem === void 0 ? void 0 : elem.offsetLeft) !== null && _elem$offsetLeft !== void 0 ? _elem$offsetLeft : 0,
+          width: (_elem$offsetWidth = elem === null || elem === void 0 ? void 0 : elem.offsetWidth) !== null && _elem$offsetWidth !== void 0 ? _elem$offsetWidth : 0
         };
-      });
-      var containerWidth = this.container.offsetWidth;
+      })) !== null && _React$Children$map !== void 0 ? _React$Children$map : [];
+      var containerWidth = (_this$container$offse = (_this$container = this.container) === null || _this$container === void 0 ? void 0 : _this$container.offsetWidth) !== null && _this$container$offse !== void 0 ? _this$container$offse : 0;
       var layerWidth = slides.reduce(function (val, slide) {
         return slide.width + val;
       }, 0);
@@ -183,38 +200,45 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
         containerWidth: containerWidth,
         slides: slides
       }, function () {
-        var shiftX = _this2.calculateIndent(_this2.props.slideIndex);
+        if (_this2.props.slideIndex !== undefined) {
+          var shiftX = _this2.calculateIndent(_this2.props.slideIndex);
 
-        if (_this2.state.shiftX === shiftX) {
-          return;
-        }
+          if (_this2.state.shiftX === shiftX) {
+            return;
+          }
 
-        var isValidShift = _this2.state.shiftX === _this2.validateIndent(_this2.state.shiftX);
+          var isValidShift = _this2.state.shiftX === _this2.validateIndent(_this2.state.shiftX);
 
-        var _options$animation = options.animation,
-            animation = _options$animation === void 0 ? isValidShift : _options$animation;
+          var _options$animation = options.animation,
+              animation = _options$animation === void 0 ? isValidShift : _options$animation;
 
-        _this2.setState({
-          shiftX: shiftX,
-          animation: animation
-        }, function () {
-          if (!_this2.state.animation) {
-            _this2.props.window.requestAnimationFrame(function () {
-              return _this2.setState({
-                animation: true
+          _this2.setState({
+            shiftX: shiftX,
+            animation: animation
+          }, function () {
+            if (!_this2.state.animation) {
+              var _this2$props$window;
+
+              (_this2$props$window = _this2.props.window) === null || _this2$props$window === void 0 ? void 0 : _this2$props$window.requestAnimationFrame(function () {
+                return _this2.setState({
+                  animation: true
+                });
               });
-            });
-          }
-        });
+            }
+          });
+        }
       });
     }
   }, {
     key: "calcMin",
     value: function calcMin(_ref) {
+      var _this$viewport$offset, _this$viewport;
+
       var containerWidth = _ref.containerWidth,
-          layerWidth = _ref.layerWidth,
+          _ref$layerWidth = _ref.layerWidth,
+          layerWidth = _ref$layerWidth === void 0 ? 0 : _ref$layerWidth,
           slides = _ref.slides;
-      var viewportWidth = this.viewport.offsetWidth;
+      var viewportWidth = (_this$viewport$offset = (_this$viewport = this.viewport) === null || _this$viewport === void 0 ? void 0 : _this$viewport.offsetWidth) !== null && _this$viewport$offset !== void 0 ? _this$viewport$offset : 0;
 
       switch (this.props.align) {
         case "left":
@@ -234,12 +258,16 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
           }
 
       }
+
+      return undefined;
     }
   }, {
     key: "calcMax",
     value: function calcMax(_ref2) {
+      var _this$viewport$offset2, _this$viewport2;
+
       var slides = _ref2.slides;
-      var viewportWidth = this.viewport.offsetWidth;
+      var viewportWidth = (_this$viewport$offset2 = (_this$viewport2 = this.viewport) === null || _this$viewport2 === void 0 ? void 0 : _this$viewport2.offsetWidth) !== null && _this$viewport$offset2 !== void 0 ? _this$viewport$offset2 : 0;
 
       if (this.isCenterWithCustomWidth && slides.length) {
         var _slides$ = slides[0],
@@ -270,7 +298,9 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
             width = targetSlide.width;
 
         if (this.isCenterWithCustomWidth) {
-          var viewportWidth = this.viewport.offsetWidth;
+          var _this$viewport$offset3, _this$viewport3;
+
+          var viewportWidth = (_this$viewport$offset3 = (_this$viewport3 = this.viewport) === null || _this$viewport3 === void 0 ? void 0 : _this$viewport3.offsetWidth) !== null && _this$viewport$offset3 !== void 0 ? _this$viewport$offset3 : 0;
           return viewportWidth / 2 - coordX - width / 2;
         }
 
@@ -289,8 +319,10 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
       var _this$state = this.state,
           shiftX = _this$state.shiftX,
           deltaX = _this$state.deltaX,
-          min = _this$state.min,
-          max = _this$state.max;
+          _this$state$min = _this$state.min,
+          min = _this$state$min === void 0 ? 0 : _this$state$min,
+          _this$state$max = _this$state.max,
+          max = _this$state$max === void 0 ? 0 : _this$state$max;
       var indent = shiftX + deltaX;
 
       if (indent > max) {
@@ -305,8 +337,10 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
     key: "validateIndent",
     value: function validateIndent(value) {
       var _this$state2 = this.state,
-          min = _this$state2.min,
-          max = _this$state2.max;
+          _this$state2$min = _this$state2.min,
+          min = _this$state2$min === void 0 ? 0 : _this$state2$min,
+          _this$state2$max = _this$state2.max,
+          max = _this$state2$max === void 0 ? 0 : _this$state2$max;
 
       if (value < min) {
         return min;
@@ -319,7 +353,9 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "isFullyVisible",
     get: function get() {
-      return this.state.layerWidth <= this.state.containerWidth;
+      var _this$state$layerWidt;
+
+      return ((_this$state$layerWidt = this.state.layerWidth) !== null && _this$state$layerWidt !== void 0 ? _this$state$layerWidt : 0) <= this.state.containerWidth;
     }
     /*
      * Получает индекс слайда, к которому будет осуществлен переход
@@ -332,8 +368,10 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
           slides = _this$state3.slides,
           deltaX = _this$state3.deltaX,
           shiftX = _this$state3.shiftX,
-          max = _this$state3.max;
-      var slideIndex = this.props.slideIndex;
+          _this$state3$max = _this$state3.max,
+          max = _this$state3$max === void 0 ? 0 : _this$state3$max;
+      var _this$props$slideInde2 = this.props.slideIndex,
+          slideIndex = _this$props$slideInde2 === void 0 ? 0 : _this$props$slideInde2;
       var expectDeltaX = deltaX / e.duration * 240 * 0.6;
       var shift = shiftX + deltaX + expectDeltaX - max;
       var direction = deltaX < 0 ? 1 : -1; // Находим ближайшую границу слайда к текущему отступу
@@ -367,13 +405,17 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
     get: function get() {
       var _this$state4 = this.state,
           containerWidth = _this$state4.containerWidth,
-          layerWidth = _this$state4.layerWidth,
+          _this$state4$layerWid = _this$state4.layerWidth,
+          layerWidth = _this$state4$layerWid === void 0 ? 0 : _this$state4$layerWid,
           shiftX = _this$state4.shiftX,
           slides = _this$state4.slides;
-      var _this$props3 = this.props,
-          align = _this$props3.align,
-          slideIndex = _this$props3.slideIndex;
-      return !this.isFullyVisible && (align === "left" && containerWidth - shiftX < layerWidth || align !== "left" && slideIndex < slides.length - 1);
+      var _this$props4 = this.props,
+          align = _this$props4.align,
+          _this$props4$slideInd = _this$props4.slideIndex,
+          slideIndex = _this$props4$slideInd === void 0 ? 0 : _this$props4$slideInd;
+      return !this.isFullyVisible && ( // we can't move right when gallery layer fully scrolled right, if gallery aligned by left side
+      align === "left" && containerWidth - shiftX < layerWidth || // otherwise we need to check current slide index (align = right or align = center)
+      align !== "left" && slideIndex < slides.length - 1);
     }
   }, {
     key: "componentDidMount",
@@ -394,10 +436,12 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
       if (widthChanged || slideCountChanged || isCustomWidth && isPropUpdate) {
         this.initializeSlides();
       } else if (this.props.slideIndex !== prevProps.slideIndex) {
+        var _this$props$slideInde3;
+
         this.setState({
           animation: true,
           deltaX: 0,
-          shiftX: this.calculateIndent(this.props.slideIndex)
+          shiftX: this.calculateIndent((_this$props$slideInde3 = this.props.slideIndex) !== null && _this$props$slideInde3 !== void 0 ? _this$props$slideInde3 : 0)
         });
       }
     }
@@ -416,25 +460,26 @@ var BaseGallery = /*#__PURE__*/function (_React$Component) {
           duration = _this$state5.duration,
           dragging = _this$state5.dragging;
 
-      var _this$props4 = this.props,
-          children = _this$props4.children,
-          slideWidth = _this$props4.slideWidth,
-          slideIndex = _this$props4.slideIndex,
-          isDraggable = _this$props4.isDraggable,
-          onDragStart = _this$props4.onDragStart,
-          onDragEnd = _this$props4.onDragEnd,
-          onChange = _this$props4.onChange,
-          onEnd = _this$props4.onEnd,
-          align = _this$props4.align,
-          bullets = _this$props4.bullets,
-          platform = _this$props4.platform,
-          hasMouse = _this$props4.hasMouse,
-          showArrows = _this$props4.showArrows,
-          window = _this$props4.window,
-          document = _this$props4.document,
-          getRef = _this$props4.getRef,
-          getRootRef = _this$props4.getRootRef,
-          restProps = _objectWithoutProperties(_this$props4, _excluded);
+      var _this$props5 = this.props,
+          children = _this$props5.children,
+          slideWidth = _this$props5.slideWidth,
+          _this$props5$slideInd = _this$props5.slideIndex,
+          slideIndex = _this$props5$slideInd === void 0 ? 0 : _this$props5$slideInd,
+          isDraggable = _this$props5.isDraggable,
+          onDragStart = _this$props5.onDragStart,
+          onDragEnd = _this$props5.onDragEnd,
+          onChange = _this$props5.onChange,
+          onEnd = _this$props5.onEnd,
+          align = _this$props5.align,
+          bullets = _this$props5.bullets,
+          platform = _this$props5.platform,
+          hasMouse = _this$props5.hasMouse,
+          showArrows = _this$props5.showArrows,
+          window = _this$props5.window,
+          document = _this$props5.document,
+          getRef = _this$props5.getRef,
+          getRootRef = _this$props5.getRootRef,
+          restProps = _objectWithoutProperties(_this$props5, _excluded);
 
       var indent = dragging ? this.calculateDragIndent() : this.calculateIndent(slideIndex);
       var layerStyle = {
@@ -504,10 +549,13 @@ var BaseGalleryAdaptive = withAdaptivity(withDOM(BaseGallery), {
 });
 
 var Gallery = function Gallery(_ref3) {
+  var _props$slideIndex;
+
   var _ref3$initialSlideInd = _ref3.initialSlideIndex,
       initialSlideIndex = _ref3$initialSlideInd === void 0 ? 0 : _ref3$initialSlideInd,
       children = _ref3.children,
-      timeout = _ref3.timeout,
+      _ref3$timeout = _ref3.timeout,
+      timeout = _ref3$timeout === void 0 ? 0 : _ref3$timeout,
       onChange = _ref3.onChange,
       props = _objectWithoutProperties(_ref3, _excluded2);
 
@@ -517,7 +565,7 @@ var Gallery = function Gallery(_ref3) {
       setSlideIndex = _React$useState2[1];
 
   var isControlled = typeof props.slideIndex === "number";
-  var slideIndex = isControlled ? props.slideIndex : localSlideIndex;
+  var slideIndex = isControlled ? (_props$slideIndex = props.slideIndex) !== null && _props$slideIndex !== void 0 ? _props$slideIndex : 0 : localSlideIndex;
   var isDraggable = !isControlled || Boolean(onChange);
   var slides = React.Children.toArray(children).filter(function (item) {
     return Boolean(item);
@@ -530,13 +578,13 @@ var Gallery = function Gallery(_ref3) {
 
     !isControlled && setSlideIndex(current);
     onChange && onChange(current);
-  }, [onChange, slideIndex]);
+  }, [isControlled, onChange, slideIndex]);
   var autoplay = useTimeout(function () {
     return handleChange((slideIndex + 1) % childCount);
   }, timeout);
   React.useEffect(function () {
     return timeout ? autoplay.set() : autoplay.clear();
-  }, [timeout, slideIndex]); // prevent invalid slideIndex
+  }, [timeout, slideIndex, autoplay]); // prevent invalid slideIndex
   // any slide index is invalid with no slides, just keep it as is
 
   var safeSlideIndex = childCount > 0 ? clamp(slideIndex, 0, childCount - 1) : slideIndex; // notify parent in controlled mode
@@ -545,14 +593,15 @@ var Gallery = function Gallery(_ref3) {
     if (onChange && safeSlideIndex !== slideIndex) {
       onChange(safeSlideIndex);
     }
-  }, [safeSlideIndex]);
+  }, [onChange, safeSlideIndex, slideIndex]);
   return createScopedElement(BaseGalleryAdaptive, _extends({
     isDraggable: isDraggable
   }, props, {
     slideIndex: safeSlideIndex,
     onChange: handleChange
   }), slides);
-};
+}; // eslint-disable-next-line import/no-default-export
+
 
 export default withPlatform(Gallery);
 //# sourceMappingURL=Gallery.js.map