skillgrid 0.0.85 → 0.0.87

package/dist/assets/components/Dialog/Dialog.module-BvSBnHQm.css

@@ -0,0 +1 @@
+:root{--dialog-margin: 12px;--dialog-border-radius: 24px}._overlay_12slx_6{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;display:flex;flex-direction:column;background:#00000080;transition:opacity .2s ease-in-out}._container_12slx_19{position:absolute;overflow:hidden;overflow-y:auto;min-width:300px;background:var(--bg-primary);border-radius:var(--dialog-border-radius);box-shadow:0 4px 24px #0000001a}._placement-default_12slx_32{top:0;left:50%;translate:-50% 0;max-width:90dvw;max-height:90dvh;margin-right:auto;margin-left:auto;margin-block:80px}._placement-bottom-left_12slx_45{bottom:0;left:0;max-width:90dvw;max-height:90dvh;margin:12px}._placement-bottom-right_12slx_54{right:0;bottom:0;max-width:90dvw;max-height:90dvh;margin:12px}._placement-center_12slx_64{position:fixed;top:50%;left:50%;translate:-50% -50%;max-width:90dvw;max-height:90dvh;margin-right:auto;margin-left:auto}._placement-left-drawer_12slx_77{inset:0 auto 0 0;margin:12px;border-radius:16px}._placement-right-drawer_12slx_83{inset:0 0 0 auto;margin:12px;border-radius:16px}._placement-bottom-sheet_12slx_89{inset:auto 0 0;max-width:100dvw;max-height:90dvh;margin:0;border-radius:var(--dialog-border-radius) var(--dialog-border-radius) 0 0}._grabber_12slx_100{touch-action:none;position:absolute;z-index:1000;width:40px;height:4px;opacity:.7;background:var(--stroke-neutral);border-radius:4px}._grabber_12slx_100:before{content:"";position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px}._container_12slx_19:hover ._grabber_12slx_100{opacity:1}._grabber-top_12slx_127,._grabber-bottom_12slx_128{top:10px;left:50%;transform:translate(-50%)}._grabber-right_12slx_134{top:50%;left:10px;transform:translateY(-50%);width:4px;height:40px}._grabber-left_12slx_143{top:50%;right:10px;transform:translateY(-50%);width:4px;height:40px}

package/dist/assets/components/Snackbar/Provider/SnackbarProvider.module-CXp57W1g.css

@@ -0,0 +1 @@
+._stack_184s0_1{pointer-events:none;position:fixed;z-index:var(--z-toast);bottom:48px;left:50%;transform:translate(-50%);overflow-x:clip;display:flex;flex-direction:column;align-items:center;box-sizing:border-box;width:100%;padding:24px 24px 0}._stack_184s0_1._local_184s0_20{position:absolute;right:0;left:0;transform:none}._snackGroup_184s0_27{display:inline-flex;flex-direction:column;align-items:stretch;box-sizing:border-box;max-width:100%}._snackGroupHug_184s0_43{width:fit-content;max-width:100%}._snackGroupFix_184s0_54{width:600px;max-width:100%}._snackGroupFill_184s0_64{width:100%}._snackWrapper_184s0_68{pointer-events:none;display:flex;justify-content:center;width:100%;transition:transform var(--duration-400) var(--ease-in-out)}@media (width <= 600px){._stack_184s0_1{bottom:16px;padding:16px 16px 0}}

package/dist/assets/components/Snackbar/Snackbar.module-gnMPmaUr.css

@@ -0,0 +1 @@
+:root{--snackbar-content-gap: 8px;--snackbar-content-big-gap: 11px;--snackbar-vertical-padding: 24px;--snackbar-horizontal-padding: 16px 24px;--snackbar-vertical-radius: 24px;--snackbar-horizontal-radius: 64px;--snackbar-bg: #000000;--snackbar-color: var(--text-text-invert, #ffffff)}._snackbar_92a88_13{pointer-events:all;will-change:transform,opacity;z-index:var(--z-toast);overflow:hidden;display:flex;gap:var(--snackbar-content-big-gap);align-items:center;justify-content:space-between;padding:var(--snackbar-horizontal-padding);font-family:var(--font-family);font-weight:400;color:var(--snackbar-color);background-color:var(--snackbar-bg);border-radius:var(--snackbar-horizontal-radius);transition:transform var(--duration-300) var(--ease-in-out),opacity var(--duration-300) var(--ease-in-out);animation-name:_slideIn_92a88_1;animation-duration:var(--duration-300);animation-timing-function:var(--ease-in-out);animation-fill-mode:both}._snackbarStack_92a88_44{animation-duration:var(--duration-400);animation-timing-function:var(--ease-in-out)}._snackbarVertical_92a88_49{align-items:start;padding:var(--snackbar-vertical-padding);border-radius:var(--snackbar-vertical-radius)}._fix_92a88_56{box-sizing:border-box;width:100%;max-width:600px}._fill_92a88_62{box-sizing:border-box;width:100%;max-width:none}._hug_92a88_68{display:inline-flex;width:auto;max-width:100%}._snackbar_92a88_13._stackWidth_92a88_80{box-sizing:border-box;width:100%;max-width:100%}._content_92a88_86{touch-action:auto;display:flex;gap:var(--snackbar-content-gap);align-items:center;width:100%}._textActionsContainer_92a88_96{display:flex;gap:var(--snackbar-content-big-gap);align-items:center;width:100%}._textActionsContainerVertical_92a88_103{flex-direction:column;align-items:start}._contentVertical_92a88_108{align-items:start}._contentText_92a88_112{width:100%;overflow-wrap:anywhere}._icon_92a88_117{width:24px;height:24px}._buttonLink_92a88_122{min-width:fit-content;font-weight:600}._exiting_92a88_128{animation-name:_slideOut_92a88_1;animation-fill-mode:both}._exitingTimeout_92a88_134{animation-duration:var(--duration-500);animation-timing-function:var(--ease-in-out)}._exitingClose_92a88_139{animation-duration:var(--duration-100);animation-timing-function:var(--ease-in-out)}._exitingStack_92a88_145{animation-duration:var(--duration-400);animation-timing-function:var(--ease-in-out);animation-fill-mode:both}._swipeTransition_92a88_151{transition:transform var(--duration-300) var(--ease-in-out),opacity var(--duration-300) var(--ease-in-out)}._exitingEscape_92a88_157{animation-duration:var(--duration-100);animation-timing-function:var(--ease-in-out)}@keyframes _slideOut_92a88_1{0%{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(100%) scale(.75);opacity:0}}@keyframes _slideIn_92a88_1{0%{transform:translateY(100%) scale(.75);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}

package/dist/components/Dialog/Dialog.js

@@ -1,18 +1,18 @@
-import { jsxs as f, jsx as n } from "react/jsx-runtime";
+import { jsxs as p, jsx as n } from "react/jsx-runtime";
 import { useMergeRefs as w, FloatingPortal as V, FloatingOverlay as E, FloatingFocusManager as $ } from "@floating-ui/react";
-import o from "./Dialog.module.css.js";
+import a from "./Dialog.module.css.js";
 import { forwardRef as j } from "react";
 import { clsx as c } from "clsx";
 import { useDialogDraggable as I } from "./lib/use-dialog-draggable.js";
 import { useVisualViewportCenter as M } from "./lib/use-visual-viewport-center.js";
-const G = j((p, u) => {
+const B = j((f, u) => {
   const {
     placement: i = "default",
     open: d,
-    onOpenChange: m,
+    onOpenChange: g,
     overlayProps: e,
     portalProps: b,
-    focusManagement: a,
+    focusManagement: r,
     children: h,
     disableOutsideClick: N = !1,
     disableEscapeKey: O = !1,
@@ -22,29 +22,29 @@ const G = j((p, u) => {
     style: D,
     "data-testid": s,
     ...F
-  } = p;
+  } = f;
   d === void 0 && process.env.NODE_ENV !== "production" && console.error(
     "Dialog: компонент должен быть контролируемым. Используйте пропсы open и onOpenChange."
   );
-  const r = I({
+  const o = I({
     open: d,
-    onOpenChange: m,
+    onOpenChange: g,
     placement: i,
     disableEscapeKey: O,
     closeOnDrag: l
-  }), { isMounted: g, transitionStyles: t } = r, y = M(i === "center" && g), v = w([u, r.refs.setFloating]), k = () => {
-    N || m(!1);
+  }), { isMounted: m, transitionStyles: t } = o, y = M(i === "center" && m), v = w([u, o.refs.setFloating]), k = () => {
+    N || g(!1);
   };
-  return g ? (
+  return m ? (
     // `FloatingPortal` рендерит диалог в корне `document.body`,
     // чтобы избежать проблем с z-index и overflow.
-    /* @__PURE__ */ f(V, { ...b, children: [
+    /* @__PURE__ */ p(V, { ...b, children: [
       !x && /* @__PURE__ */ n(
         E,
         {
           onPointerDown: k,
           "data-testid": "dialog-overlay",
-          className: c(o.overlay, e == null ? void 0 : e.className),
+          className: c(a.overlay, e == null ? void 0 : e.className),
           lockScroll: (e == null ? void 0 : e.lockScroll) ?? !0,
           style: {
             // Стили для анимации прозрачности оверлея
@@ -58,35 +58,36 @@ const G = j((p, u) => {
         $,
         {
           initialFocus: 1 / 0,
-          ...a,
-          context: { ...r.context, ...a == null ? void 0 : a.context },
-          children: /* @__PURE__ */ f(
+          ...r,
+          context: { ...o.context, ...r == null ? void 0 : r.context },
+          children: /* @__PURE__ */ p(
             "section",
             {
               ref: v,
               "aria-modal": "true",
               role: "dialog",
-              className: c(C, o.container, o[`placement-${i}`]),
+              className: c(C, a.container, a[`placement-${i}`]),
               style: {
                 ...y ?? {},
                 ...D,
                 ...t
               },
               "data-testid": s,
-              ...r.getFloatingProps(F),
+              ...o.getFloatingProps(F),
               children: [
                 h,
                 l && /* @__PURE__ */ n(
                   "div",
                   {
                     className: c(
-                      o.grabber,
-                      o[`grabber-${l.direction}`]
+                      a.grabber,
+                      a[`grabber-${l.direction}`]
                       // classNames?.grabber,
                     ),
                     role: "presentation",
                     "aria-hidden": "true",
-                    "data-testid": s ? `${s}-grabber` : void 0
+                    "data-testid": s ? `${s}-grabber` : void 0,
+                    ...o.getGrabberProps()
                   }
                 )
               ]
@@ -98,5 +99,5 @@ const G = j((p, u) => {
   ) : null;
 });
 export {
-  G as Dialog
+  B as Dialog
 };

package/dist/components/Dialog/Dialog.module.css.js

@@ -1,18 +1,18 @@
-import '../../assets/components/Dialog/Dialog.module-OXi8ThCq.css';const e = "_overlay_1gisq_6", t = "_container_1gisq_19", r = "_grabber_1gisq_100", _ = {
+import '../../assets/components/Dialog/Dialog.module-BvSBnHQm.css';const e = "_overlay_12slx_6", t = "_container_12slx_19", r = "_grabber_12slx_100", _ = {
   overlay: e,
   container: t,
-  "placement-default": "_placement-default_1gisq_32",
-  "placement-bottom-left": "_placement-bottom-left_1gisq_45",
-  "placement-bottom-right": "_placement-bottom-right_1gisq_54",
-  "placement-center": "_placement-center_1gisq_64",
-  "placement-left-drawer": "_placement-left-drawer_1gisq_77",
-  "placement-right-drawer": "_placement-right-drawer_1gisq_83",
-  "placement-bottom-sheet": "_placement-bottom-sheet_1gisq_89",
+  "placement-default": "_placement-default_12slx_32",
+  "placement-bottom-left": "_placement-bottom-left_12slx_45",
+  "placement-bottom-right": "_placement-bottom-right_12slx_54",
+  "placement-center": "_placement-center_12slx_64",
+  "placement-left-drawer": "_placement-left-drawer_12slx_77",
+  "placement-right-drawer": "_placement-right-drawer_12slx_83",
+  "placement-bottom-sheet": "_placement-bottom-sheet_12slx_89",
   grabber: r,
-  "grabber-top": "_grabber-top_1gisq_118",
-  "grabber-bottom": "_grabber-bottom_1gisq_119",
-  "grabber-right": "_grabber-right_1gisq_125",
-  "grabber-left": "_grabber-left_1gisq_134"
+  "grabber-top": "_grabber-top_12slx_127",
+  "grabber-bottom": "_grabber-bottom_12slx_128",
+  "grabber-right": "_grabber-right_12slx_134",
+  "grabber-left": "_grabber-left_12slx_143"
 };
 export {
   t as container,

package/dist/components/Dialog/lib/use-dialog-draggable.d.ts

@@ -6,9 +6,12 @@ type UseDialogDraggableOptions = Pick<DialogProps, 'placement' | 'open' | 'disab
  * Оборачивает `useDialog` и добавляет обработчики событий указателя (`PointerEvents`)
  * для отслеживания перетаскивания и закрытия диалога при превышении порога.
  *
+ * Обработчики вешаются на граббер (`getGrabberProps`), а не на корень диалога: у контейнера
+ * есть `overflow-y: auto`, и на touch вертикальный жест иначе уходит в скролл.
+ *
  * @param {UseDialogDraggableOptions} options - Опции для конфигурации хука.
  * @returns Возвращает объект с данными и пропсами, аналогичный `useDialog`,
- * но с модифицированными `transitionStyles` и `getFloatingProps` для поддержки перетаскивания.
+ * но с модифицированными `transitionStyles` и `getGrabberProps` для поддержки перетаскивания.
  */
 export declare function useDialogDraggable({ open, onOpenChange, placement, disableEscapeKey, closeOnDrag, }: UseDialogDraggableOptions): {
     isMounted: boolean;
@@ -37,6 +40,7 @@ export declare function useDialogDraggable({ open, onOpenChange, placement, disa
         setFloating: (node: HTMLElement | null) => void;
     } & import('@floating-ui/react').ExtendedRefs<import('@floating-ui/react').ReferenceType>;
     transitionStyles: CSSProperties;
-    getFloatingProps: (userProps: HTMLProps<HTMLElement>) => Record<string, unknown>;
+    getFloatingProps: (userProps?: React.HTMLProps<HTMLElement>) => Record<string, unknown>;
+    getGrabberProps: () => HTMLProps<HTMLDivElement> | undefined;
 };
 export {};

package/dist/components/Dialog/lib/use-dialog-draggable.js

@@ -1,97 +1,108 @@
-import { useRef as T, useState as w, useEffect as C, useCallback as d, useMemo as k } from "react";
-import { useDialog as L } from "./use-dialog.js";
-const R = 80;
-function v({
-  open: u,
-  onOpenChange: h,
-  placement: E = "center",
-  disableEscapeKey: F = !1,
-  closeOnDrag: i
+import { useRef as w, useState as A, useEffect as _, useCallback as p, useMemo as L } from "react";
+import { useDialog as F } from "./use-dialog.js";
+const G = 80;
+function U(s, a, u, h) {
+  switch (s) {
+    case "bottom":
+      return Math.max(0, u);
+    // Разрешаем движение только вниз
+    case "top":
+      return Math.max(0, -u);
+    // Движение вверх (отрицательный dy)
+    case "right":
+      return Math.max(0, a);
+    // Только вправо
+    case "left":
+      return Math.max(0, -a);
+    // Только влево (отрицательный dx)
+    default:
+      return h ? u : a;
+  }
+}
+function $({
+  open: s,
+  onOpenChange: a,
+  placement: u = "center",
+  disableEscapeKey: h = !1,
+  closeOnDrag: o
 }) {
-  const { getFloatingProps: b, transitionStyles: f, isMounted: p, context: P, refs: x } = L({
-    open: u,
-    onOpenChange: h,
-    placement: E,
-    disableEscapeKey: F
-  }), r = T({ startX: 0, startY: 0, dragging: !1 }), [o, g] = w(0), a = i == null ? void 0 : i.direction, M = (i == null ? void 0 : i.threshold) ?? R, l = a === "top" || a === "bottom", e = u && !!a;
-  C(() => {
-    u || (r.current.dragging = !1, g(0));
-  }, [u]);
-  const S = d(
+  const { getFloatingProps: M, transitionStyles: l, isMounted: X, context: Y, refs: y } = F({
+    open: s,
+    onOpenChange: a,
+    placement: u,
+    disableEscapeKey: h
+  }), r = w({ startX: 0, startY: 0, dragging: !1 }), f = w(0), [S, P] = A(!1), [g, d] = A(0), e = o == null ? void 0 : o.direction, D = (o == null ? void 0 : o.threshold) ?? G, i = e === "top" || e === "bottom", n = s && !!e;
+  _(() => {
+    s || (r.current.dragging = !1, P(!1), f.current = 0, d(0));
+  }, [s]);
+  const T = p(
     (t) => {
-      e && (r.current.dragging = !0, r.current.startX = t.clientX, r.current.startY = t.clientY, g(0));
+      if (n) {
+        t.preventDefault(), t.stopPropagation(), r.current.startX = t.clientX, r.current.startY = t.clientY, r.current.dragging = !0, f.current = 0, P(!0), d(0);
+        try {
+          t.currentTarget.setPointerCapture(t.pointerId);
+        } catch {
+        }
+      }
     },
-    [e]
-  ), y = d(
+    [n]
+  ), v = p(
     (t) => {
-      if (!r.current.dragging || !e) return;
-      const n = t.clientX - r.current.startX, s = t.clientY - r.current.startY;
-      let c;
-      switch (a) {
-        case "bottom":
-          c = Math.max(0, s);
-          break;
-        case "top":
-          c = Math.max(0, -s);
-          break;
-        case "right":
-          c = Math.max(0, n);
-          break;
-        case "left":
-          c = Math.max(0, -n);
-          break;
-        default:
-          c = l ? s : n;
-      }
-      g(c);
+      if (!r.current.dragging || !n) return;
+      const c = t.clientX - r.current.startX, b = t.clientY - r.current.startY, x = U(e, c, b, i);
+      f.current = x, d(x);
     },
-    [e, a, l]
-  ), m = d(
+    [n, e, i]
+  ), m = p(
     (t) => {
-      var n, s;
-      if (!(!r.current.dragging || !e)) {
-        r.current.dragging = !1;
-        try {
-          (s = (n = t.currentTarget).hasPointerCapture) != null && s.call(n, t.pointerId) && t.currentTarget.releasePointerCapture(t.pointerId);
-        } catch {
-        }
-        o >= M ? h(!1) : g(0);
+      var I, R;
+      if (!r.current.dragging || !n) return;
+      r.current.dragging = !1, P(!1);
+      try {
+        (R = (I = t.currentTarget).hasPointerCapture) != null && R.call(I, t.pointerId) && t.currentTarget.releasePointerCapture(t.pointerId);
+      } catch {
       }
+      const c = t.clientX - r.current.startX, b = t.clientY - r.current.startY;
+      Math.max(
+        f.current,
+        U(e, c, b, i)
+      ) >= D ? a(!1) : (f.current = 0, d(0));
     },
-    [o, M, h, e]
-  ), X = k(() => {
-    if (!e) return f;
-    if (r.current.dragging) {
-      const t = { ...f, transitionProperty: "none" };
-      if (o > 0) {
-        const n = a === "left" || a === "top" ? -o : o;
-        t.transform = l ? `translateY(${n}px)` : `translateX(${n}px)`;
+    [D, a, n, e, i]
+  ), C = L(() => {
+    if (!n) return l;
+    if (S) {
+      const t = { ...l, transitionProperty: "none" };
+      if (g > 0) {
+        const c = e === "left" || e === "top" ? -g : g;
+        t.transform = i ? `translateY(${c}px)` : `translateX(${c}px)`;
       }
       return t;
     }
-    return f;
-  }, [f, o, e, l, a]), Y = d(
-    (t) => b(e ? {
-      ...t,
-      onPointerDown: S,
-      onPointerUp: m,
-      onPointerMove: y,
-      onPointerCancel: m
-      // Отмена (например, уход фокуса) также завершает перетаскивание
-    } : t),
-    [b, S, y, m, e]
-  );
-  return k(
+    return l;
+  }, [l, g, n, i, e, S]), E = p(() => {
+    if (n)
+      return {
+        onPointerDown: T,
+        onPointerUp: m,
+        onPointerMove: v,
+        onPointerCancel: m,
+        // Отмена (например, уход фокуса) также завершает перетаскивание
+        style: { touchAction: "none" }
+      };
+  }, [T, v, m, n]);
+  return L(
     () => ({
-      isMounted: p,
-      context: P,
-      refs: x,
-      transitionStyles: X,
-      getFloatingProps: Y
+      isMounted: X,
+      context: Y,
+      refs: y,
+      transitionStyles: C,
+      getFloatingProps: M,
+      getGrabberProps: E
     }),
-    [p, X, Y, P, x]
+    [X, C, M, E, Y, y]
   );
 }
 export {
-  v as useDialogDraggable
+  $ as useDialogDraggable
 };

package/dist/components/Snackbar/Provider/SnackbarProvider.js

@@ -1,76 +1,165 @@
-import { jsx as n, jsxs as y } from "react/jsx-runtime";
-import { useReducer as I, useEffect as c } from "react";
-import d from "react-dom";
-import T from "classnames";
-import { nanoid as k } from "nanoid";
-import i from "./SnackbarProvider.module.css.js";
-import { Snackbar as w } from "../Snackbar.js";
-import { snackbarReducer as O } from "../lib/snackbarReducer/snackbarReducer.js";
-import { MAX_VISIBLE as R } from "../lib/constants.js";
-import { SnackbarContext as q } from "../lib/useSnackbar.js";
-const V = (p) => {
-  const { children: m, dataTestId: f = "snackbar-wrapper" } = p, [o, s] = I(O, { visible: [], queue: [] }), u = (e) => {
-    const t = k(), r = { ...e, id: t, open: !0 };
-    s({ type: "ENQUEUE", snack: r });
-  }, S = (e) => {
-    s({ type: "REMOVE", id: e });
+import { jsx as u, jsxs as M } from "react/jsx-runtime";
+import { useReducer as O, useEffect as v, useRef as T, useState as S, useLayoutEffect as x } from "react";
+import E from "react-dom";
+import N from "classnames";
+import { nanoid as W } from "nanoid";
+import l from "./SnackbarProvider.module.css.js";
+import { Snackbar as C } from "../Snackbar.js";
+import { snackbarReducer as I } from "../lib/snackbarReducer/snackbarReducer.js";
+import { MAX_VISIBLE as k } from "../lib/constants.js";
+import { SnackbarContext as G } from "../lib/useSnackbar.js";
+const f = {
+  hug: 0,
+  fix: 1,
+  fill: 2
+}, H = (n) => n.reduce((d, p) => {
+  const t = p.mode ?? "fix";
+  return f[t] > f[d] ? t : d;
+}, "hug"), R = ({
+  snacks: n,
+  dataTestId: d,
+  onClose: p
+}) => {
+  const t = T(null), [s, h] = S("hug"), [m, g] = S(0), a = H(n), c = n.length > 0 && f[a] > f[s] ? a : s;
+  x(() => {
+    if (n.length === 0) {
+      h("hug"), g(0);
+      return;
+    }
+    h((r) => f[a] > f[r] ? a : r);
+  }, [n.length, a]), x(() => {
+    if (n.length === 0 || c !== "hug")
+      return;
+    const r = t.current;
+    if (!r) return;
+    const e = () => {
+      const i = r.getBoundingClientRect().width;
+      g(
+        (y) => Math.max(y, i)
+      );
+    };
+    e();
+    const o = new ResizeObserver(e);
+    return o.observe(r), () => o.disconnect();
+  }, [c, n.length]);
+  const b = n.length > 1;
+  return /* @__PURE__ */ u(
+    "div",
+    {
+      ref: t,
+      className: N(l.snackGroup, {
+        [l.snackGroupHug]: c === "hug",
+        [l.snackGroupFix]: c === "fix",
+        [l.snackGroupFill]: c === "fill"
+      }),
+      style: m > 0 ? {
+        /**
+         * Сохранённая hug-ширина продолжает действовать
+         * и после перехода в fix/fill.
+         *
+         * Например:
+         * hug 820px -> fix не должен уменьшить стек до 600px.
+         */
+        minWidth: `min(${m}px, 100%)`
+      } : void 0,
+      children: n.map((r, e) => {
+        const o = (n.length - 1 - e) * -8;
+        return /* @__PURE__ */ u(
+          "div",
+          {
+            "data-testid": d,
+            className: l.snackWrapper,
+            style: {
+              transform: `translateY(${o}px)`
+            },
+            children: /* @__PURE__ */ u(
+              C,
+              {
+                ...r,
+                open: !r.exiting,
+                isStack: b,
+                stretchToStack: !0,
+                forceClose: r.exiting,
+                onClose: () => p(r.id)
+              }
+            )
+          },
+          r.id
+        );
+      })
+    }
+  );
+}, B = (n) => {
+  const { children: d, dataTestId: p = "snackbar-wrapper" } = n, [t, s] = O(I, {
+    visible: [],
+    queue: []
+  }), h = (e) => {
+    const o = W(), i = {
+      ...e,
+      id: o,
+      open: !0
+    };
+    s({
+      type: "ENQUEUE",
+      snack: i
+    });
+  }, m = (e) => {
+    s({
+      type: "REMOVE",
+      id: e
+    });
   };
-  c(() => {
+  v(() => {
     s({ type: "SHOW_NEXT" });
-  }, [o.queue, o.visible]), c(() => {
-    if (o.queue.length !== 0)
-      if (o.visible.length >= R) {
-        const e = o.visible[0];
-        s({ type: "START_EXIT", id: e.id });
+  }, [t.queue, t.visible]), v(() => {
+    if (t.queue.length !== 0)
+      if (t.visible.length >= k) {
+        const e = t.visible[0];
+        s({
+          type: "START_EXIT",
+          id: e.id
+        });
       } else
         s({ type: "SHOW_NEXT" });
-  }, [o.queue]);
-  const l = (e) => e.map((t, r) => {
-    const g = (e.length - 1 - r) * -8, a = e.length > 1;
-    a && !t.wasInStack && (t.wasInStack = !0);
-    const x = t.wasInStack || a ? "fix" : t.mode;
-    return /* @__PURE__ */ n(
-      "div",
+  }, [t.queue]);
+  const g = t.visible.filter((e) => !e.parent), a = t.visible.filter((e) => e.parent), c = E.createPortal(
+    /* @__PURE__ */ u("div", { className: l.stack, children: /* @__PURE__ */ u(
+      R,
       {
-        "data-testid": f,
-        className: i.snackWrapper,
-        style: {
-          transform: `translateY(${g}px)`
-        },
-        children: /* @__PURE__ */ n(
-          w,
-          {
-            ...t,
-            open: !t.exiting,
-            isStack: a,
-            mode: x,
-            forceClose: t.exiting,
-            onClose: () => S(t.id)
-          }
-        )
-      },
-      t.id
-    );
-  }), b = o.visible.filter((e) => !e.parent), h = o.visible.filter((e) => e.parent), v = d.createPortal(
-    /* @__PURE__ */ n("div", { className: i.stack, children: l(b) }),
+        snacks: g,
+        dataTestId: p,
+        onClose: m
+      }
+    ) }),
     document.body
-  ), E = h.reduce((e, t) => {
-    if (!t.parent) return e;
-    const r = t.parent.id || `parent-${t.parent.className}`;
-    return (e[r] || (e[r] = [])).push(t), e;
-  }, {}), N = Object.entries(E).map(([e, t]) => {
-    const r = t[0];
-    return r.parent ? d.createPortal(
-      /* @__PURE__ */ n("div", { className: T(i.stack, i.local), children: l(t) }, e),
-      r.parent
+  ), b = a.reduce(
+    (e, o) => {
+      if (!o.parent) return e;
+      const i = o.parent.id || `parent-${o.parent.className}`;
+      return (e[i] || (e[i] = [])).push(o), e;
+    },
+    {}
+  ), r = Object.entries(b).map(([e, o]) => {
+    const i = o[0];
+    return i.parent ? E.createPortal(
+      /* @__PURE__ */ u("div", { className: N(l.stack, l.local), children: /* @__PURE__ */ u(
+        R,
+        {
+          snacks: o,
+          dataTestId: p,
+          onClose: m
+        }
+      ) }),
+      i.parent,
+      e
     ) : null;
   });
-  return /* @__PURE__ */ y(q.Provider, { value: { show: u }, children: [
-    m,
-    v,
-    N
+  return /* @__PURE__ */ M(G.Provider, { value: { show: h }, children: [
+    d,
+    c,
+    r
   ] });
 };
 export {
-  V as SnackbarProvider
+  B as SnackbarProvider
 };

package/dist/components/Snackbar/Provider/SnackbarProvider.module.css.js

@@ -1,11 +1,19 @@
-import '../../../assets/components/Snackbar/Provider/SnackbarProvider.module-F1FVM9qU.css';const a = "_stack_11xtv_1", c = "_local_11xtv_19", s = "_snackWrapper_11xtv_28", t = {
-  stack: a,
+import '../../../assets/components/Snackbar/Provider/SnackbarProvider.module-CXp57W1g.css';const s = "_stack_184s0_1", c = "_local_184s0_20", a = "_snackGroup_184s0_27", o = "_snackGroupHug_184s0_43", n = "_snackGroupFix_184s0_54", _ = "_snackGroupFill_184s0_64", p = "_snackWrapper_184s0_68", r = {
+  stack: s,
   local: c,
-  snackWrapper: s
+  snackGroup: a,
+  snackGroupHug: o,
+  snackGroupFix: n,
+  snackGroupFill: _,
+  snackWrapper: p
 };
 export {
-  t as default,
+  r as default,
   c as local,
-  s as snackWrapper,
-  a as stack
+  a as snackGroup,
+  _ as snackGroupFill,
+  n as snackGroupFix,
+  o as snackGroupHug,
+  p as snackWrapper,
+  s as stack
 };