md-components-mdigial-azamat 0.0.310 → 0.0.311

package/dist/Header/components/VisuallyImpaired/VisuallyImpaired.js

@@ -198,7 +198,7 @@ const R = ({
       }
     )
   ] });
-}, q = ({ isOpen: n, onClose: a }) => {
+}, O = ({ isOpen: n, onClose: a }) => {
   const [t, c] = x(
     f
   ), [m, h] = x(!1), { ref: u } = L(n, a);
@@ -316,6 +316,12 @@ const R = ({
         ref: u,
         className: s(
           "fixed right-[-100%] top-1/2 z-[10041] flex max-h-[80vh] w-[560px] -translate-y-1/2 flex-col rounded-[24px] bg-white shadow-[0_4px_12px_rgba(0,0,0,0.15)] transition-all duration-500",
+          // В закрытом состоянии гасим по видимости, а не только геометрией:
+          // fixed-слой при анимации адресной строки дёргается и модалка мелькает.
+          // `visibility` анимируется дискретно — при transition-all элемент виден
+          // всю анимацию открытия/закрытия и становится invisible только по её
+          // завершении, поэтому шторка снизу выезжает так же плавно.
+          !n && "invisible pointer-events-none",
           n && "right-[44px]",
           // На мобилке прячем через translateY(100%) от собственной высоты
           // (тоже 100dvh), а не bottom:-100% в % вьюпорта — иначе при анимации
@@ -499,5 +505,5 @@ const R = ({
   ] });
 };
 export {
-  q as default
+  O as default
 };

package/dist/HeroIconsBanner/HeroIconsBanner.js

@@ -1,91 +1,104 @@
-import { jsxs as n, Fragment as I, jsx as e } from "react/jsx-runtime";
-import { memo as _ } from "react";
-import { ButtonsList as B } from "../ButtonsList/ButtonsList.js";
-import { IconList as j } from "../IconList/IconList.js";
-import { C as k } from "../ComponentContainer-dca711c6.js";
+import { jsxs as a, Fragment as j, jsx as e } from "react/jsx-runtime";
+import { memo as k, useState as H, useEffect as L } from "react";
+import { ButtonsList as E } from "../ButtonsList/ButtonsList.js";
+import { IconList as z } from "../IconList/IconList.js";
+import { C } from "../ComponentContainer-dca711c6.js";
 import { F as r } from "../Flex-86aee720.js";
-import { I as d } from "../index-df8034eb.js";
-import { S as C } from "../SafeHtml-c00e29eb.js";
-import { c as h } from "../cn-6a4bf187.js";
-import { HeroIconsBannerArrows as F } from "./HeroIconsBannerArrows.js";
-import { HeroIconsBannerIndicator as H } from "./HeroIconsBannerIndicator.js";
-import { propsToEdit as L } from "./schema.js";
-import { useHeroIconsBanner as z } from "./useHeroIconsBanner.js";
-import '../assets/HeroIconsBanner.15c9ffb1.css';const p = _(j), D = ({
-  autoplay_delay_seconds: f,
+import { I as f } from "../index-df8034eb.js";
+import { S as F } from "../SafeHtml-c00e29eb.js";
+import { c as u } from "../cn-6a4bf187.js";
+import { HeroIconsBannerArrows as S } from "./HeroIconsBannerArrows.js";
+import { HeroIconsBannerIndicator as D } from "./HeroIconsBannerIndicator.js";
+import { propsToEdit as P } from "./schema.js";
+import { useHeroIconsBanner as T } from "./useHeroIconsBanner.js";
+import '../assets/HeroIconsBanner.15c9ffb1.css';const p = k(z), W = ({
+  autoplay_delay_seconds: g,
   icon_list: s,
-  slides: u
+  slides: b
 }) => {
   const {
     activeSlide: t,
-    activeSlideIndex: l,
-    goToNextSlide: b,
-    goToPrevSlide: x,
-    handleBannerClick: g,
-    handleBannerKeyDown: v,
-    hasBannerLink: i,
+    activeSlideIndex: i,
+    goToNextSlide: x,
+    goToPrevSlide: w,
+    handleBannerClick: v,
+    handleBannerKeyDown: y,
+    hasBannerLink: l,
     hasMultipleSlides: c,
     resolvedSlides: m,
     setActiveSlideIndex: N,
-    slideChangeDelay: y,
-    visibleBackgroundIndexes: w
-  } = z({
-    autoplay_delay_seconds: f,
-    slides: u
-  });
-  return /* @__PURE__ */ n(I, { children: [
-    /* @__PURE__ */ n(
+    slideChangeDelay: I,
+    visibleBackgroundIndexes: _
+  } = T({
+    autoplay_delay_seconds: g,
+    slides: b
+  }), [d, B] = H(void 0);
+  return L(() => {
+    if (typeof window > "u")
+      return;
+    const n = () => B(window.innerHeight);
+    n();
+    let o = window.innerWidth;
+    const h = () => {
+      window.innerWidth !== o && (o = window.innerWidth, n());
+    };
+    return window.addEventListener("resize", h), window.addEventListener("orientationchange", n), () => {
+      window.removeEventListener("resize", h), window.removeEventListener("orientationchange", n);
+    };
+  }, []), /* @__PURE__ */ a(j, { children: [
+    /* @__PURE__ */ a(
       r,
       {
         component: "section",
         vertical: !0,
-        className: h(
+        className: u(
           "relative w-full h-[100svh] overflow-hidden",
-          i && "cursor-pointer"
+          l && "cursor-pointer"
         ),
-        onClick: g,
-        onKeyDown: v,
-        role: i ? "link" : void 0,
-        tabIndex: i ? 0 : void 0,
+        style: d ? { height: `${d}px` } : void 0,
+        onClick: v,
+        onKeyDown: y,
+        role: l ? "link" : void 0,
+        tabIndex: l ? 0 : void 0,
         children: [
-          /* @__PURE__ */ n("div", { className: "absolute inset-0 z-0 bg-black", children: [
-            w.map((a) => {
-              const o = m[a];
+          /* @__PURE__ */ a("div", { className: "absolute inset-0 z-0 bg-black", children: [
+            _.map((n) => {
+              const o = m[n];
               return o != null && o.bg_image ? /* @__PURE__ */ e(
                 "div",
                 {
-                  className: h(
+                  className: u(
                     "absolute inset-0 bg-black transition-opacity duration-700 ease-out",
-                    l === a ? "opacity-100" : "opacity-0"
+                    i === n ? "opacity-100" : "opacity-0"
                   ),
                   children: /* @__PURE__ */ e(
-                    d,
+                    f,
                     {
                       src: o.bg_image,
                       alt: "background",
                       className: "absolute inset-0 h-full w-full",
                       imageStyles: "h-full w-full object-cover object-center",
-                      loading: a === 0 ? "eager" : "lazy",
-                      fetchPriority: a === 0 ? "high" : "auto",
+                      loading: n === 0 ? "eager" : "lazy",
+                      fetchPriority: n === 0 ? "high" : "auto",
                       disableLoadingEffect: !0
                     }
                   )
                 },
-                `${a}-${o.bg_image}`
+                `${n}-${o.bg_image}`
               ) : null;
             }),
             /* @__PURE__ */ e("div", { className: "hero-icons-banner__media-overlay pointer-events-none absolute inset-0" }),
             /* @__PURE__ */ e("div", { className: "hero-icons-banner__bottom-fade pointer-events-none absolute inset-x-0 bottom-0 h-[320px] max-tablet:h-[40px]" })
           ] }),
           c && /* @__PURE__ */ e(
-            F,
+            S,
             {
-              onNext: b,
-              onPrev: x
+              onNext: x,
+              onPrev: w
             }
           ),
-          /* @__PURE__ */ n(k, { className: "relative z-10 flex flex-col justify-between pb-[10px] pt-[116px] h-full", children: [
-            /* @__PURE__ */ e("div", { className: "hero-icons-banner__content flex-1 min-h-0", children: /* @__PURE__ */ n(
+          /* @__PURE__ */ a(C, { className: "relative z-10 flex flex-col justify-between pb-[10px] pt-[116px] h-full", children: [
+            /* @__PURE__ */ e("div", { className: "hero-icons-banner__content flex-1 min-h-0", children: /* @__PURE__ */ a(
               r,
               {
                 vertical: !0,
@@ -102,7 +115,7 @@ import '../assets/HeroIconsBanner.15c9ffb1.css';const p = _(j), D = ({
                     }
                   ),
                   (t == null ? void 0 : t.description) && /* @__PURE__ */ e(
-                    C,
+                    F,
                     {
                       html: t.description,
                       as: "div",
@@ -116,23 +129,23 @@ import '../assets/HeroIconsBanner.15c9ffb1.css';const p = _(j), D = ({
                       align: "center",
                       className: "hero-icons-banner__central_image",
                       children: (t == null ? void 0 : t.central_image) && /* @__PURE__ */ e(
-                        d,
+                        f,
                         {
                           src: t.central_image,
                           alt: "central",
                           className: "w-full h-full",
                           imageStyles: "h-full w-full object-contain",
-                          loading: l === 0 ? "eager" : "lazy",
-                          fetchPriority: l === 0 ? "high" : "auto"
+                          loading: i === 0 ? "eager" : "lazy",
+                          fetchPriority: i === 0 ? "high" : "auto"
                         }
                       )
                     }
                   ),
-                  /* @__PURE__ */ e(B, { buttons: t == null ? void 0 : t.buttons })
+                  /* @__PURE__ */ e(E, { buttons: t == null ? void 0 : t.buttons })
                 ]
               }
             ) }),
-            /* @__PURE__ */ n(
+            /* @__PURE__ */ a(
               r,
               {
                 vertical: !0,
@@ -140,11 +153,11 @@ import '../assets/HeroIconsBanner.15c9ffb1.css';const p = _(j), D = ({
                 className: "shrink-0 gap-3 mt-2 max-tablet:mt-0 max-tablet:mb-10",
                 children: [
                   c && /* @__PURE__ */ e(
-                    H,
+                    D,
                     {
                       count: m.length,
-                      activeIndex: l,
-                      duration: y,
+                      activeIndex: i,
+                      duration: I,
                       onSelect: N
                     }
                   ),
@@ -159,7 +172,7 @@ import '../assets/HeroIconsBanner.15c9ffb1.css';const p = _(j), D = ({
     /* @__PURE__ */ e("div", { className: "mt-8 hidden w-full justify-center max-tablet:flex", children: /* @__PURE__ */ e(p, { items: s }) })
   ] });
 };
-D.propsToEdit = L;
+W.propsToEdit = P;
 export {
-  D as HeroIconsBanner
+  W as HeroIconsBanner
 };

package/dist/SegmentsIcons/SegmentsIcons.js

@@ -7,17 +7,17 @@ import { c as m } from "../cn-6a4bf187.js";
 import { propsToEdit as I } from "./schema.js";
 const N = ({
   data: r,
-  activeSegment: n = 0,
-  onChange: s
+  activeSegment: s = 0,
+  onChange: n
 }) => {
   var x;
-  const [o, d] = b(n), [u, w] = b({
+  const [o, d] = b(s), [u, w] = b({
     left: 0,
     width: 0
   }), i = y([]), { ref: l, events: v } = S();
   f(() => {
-    d(n);
-  }, [n]), f(() => {
+    d(s);
+  }, [s]), f(() => {
     const t = () => {
       const e = i.current[o];
       e && w({
@@ -39,7 +39,7 @@ const N = ({
     t.scrollTo({ left: L, behavior: "smooth" });
   }, [o, l]);
   const g = (t) => {
-    d(t), s == null || s(t);
+    d(t), n == null || n(t);
   };
   return /* @__PURE__ */ p(
     h,
@@ -70,7 +70,7 @@ const N = ({
             align: "center",
             onClick: () => g(e),
             className: m(
-              "gap-3 justify-start max-tablet:justify-center cursor-pointer whitespace-nowrap transition-all duration-300 ease-in-out p-4 flex-1 max-tablet:flex-none rounded-[20px] max-tablet:pl-3 max-tablet:pr-4 relative z-10",
+              "gap-3 justify-start max-tablet:justify-center cursor-pointer whitespace-nowrap transition-colors duration-300 ease-in-out p-4 flex-1 max-tablet:flex-none rounded-[20px] max-tablet:pl-3 max-tablet:pr-4 relative z-10",
               "min-w-[186px] max-tablet:min-w-min"
             ),
             children: [

package/package.json

@@ -2,7 +2,7 @@
   "name": "md-components-mdigial-azamat",
   "author": "Azamat Raimbekov",
   "private": false,
-  "version": "0.0.310",
+  "version": "0.0.311",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",