@daisforge/ui 1.12.2 → 1.14.0

package/chunks/Stories--_pE4YtR.mjs

@@ -1,668 +0,0 @@
-import { jsx as n, jsxs as L, Fragment as ve } from "react/jsx-runtime";
-import { Spinner as we, IconButton as ee } from "@salutejs/sdds-finai";
-import { IconDisclosureLeftOutline as be, IconDisclosureRightOutline as Ie, IconClose as _e } from "@salutejs/plasma-icons";
-import { useRef as P, useEffect as A, useContext as Ce, createContext as Ne, useSyncExternalStore as Pe, useState as pe, useCallback as ue, lazy as Te, forwardRef as ke, Children as Oe, useImperativeHandle as Re, cloneElement as Ee, isValidElement as Ae, Suspense as ze } from "react";
-import { createPortal as $e, flushSync as De } from "react-dom";
-import { E as Be } from "./EmptyState-Bct6Wrxv.mjs";
-import { n as Ge, x as Ve, y as te } from "./utils-C5SQhoON.mjs";
-import { surfaceSolidCard as Le, onLightSurfaceTransparentDeep as je, onDarkSurfaceTransparentDeep as Fe, onLightSurfaceTransparentTertiary as He, onDarkSurfaceTransparentTertiary as Me, textAccent as Xe, shadowDownSoftL as We, textPrimary as Ye } from "@salutejs/sdds-themes/tokens/sdds_finai";
-import S, { keyframes as G, css as ge, createGlobalStyle as Ze } from "styled-components";
-import { a as Ke } from "./AnalyticalWidget-CBi-2MtJ.mjs";
-const qe = ({
-  controller: e,
-  pauseHoldDelay: t,
-  tapPrevZone: o,
-  isOpen: r
-}) => {
-  const i = P(), f = P(!1), l = P("next"), d = () => {
-    i.current && (clearTimeout(i.current), i.current = void 0);
-  }, h = (y) => {
-    const a = y.currentTarget.getBoundingClientRect(), v = a.width > 0 ? (y.clientX - a.left) / a.width : 1;
-    l.current = v < o ? "prev" : "next", f.current = !1, d(), i.current = setTimeout(() => {
-      f.current = !0, e.pause();
-    }, t);
-  }, u = () => {
-    if (d(), f.current) {
-      f.current = !1, e.resume();
-      return;
-    }
-    l.current === "prev" ? e.prev() : e.next();
-  }, g = () => {
-    d(), f.current && (f.current = !1, e.resume());
-  };
-  return A(() => {
-    if (!r)
-      return;
-    const y = (a) => {
-      a.key === "ArrowLeft" ? (a.preventDefault(), e.prev()) : a.key === "ArrowRight" ? (a.preventDefault(), e.next()) : a.key === "Escape" && (a.preventDefault(), e.close());
-    };
-    return window.addEventListener("keydown", y), () => window.removeEventListener("keydown", y);
-  }, [r, e]), {
-    onPointerDown: h,
-    onPointerUp: u,
-    onPointerLeave: g,
-    onPointerCancel: g
-  };
-}, fe = Ne(null), Ue = fe.Provider, W = () => {
-  const e = Ce(fe);
-  if (!e)
-    throw new Error("Компоненты Stories должны использоваться внутри <Stories>.");
-  return e;
-}, Y = (e) => Pe(e.subscribe, e.getSnapshot, e.getSnapshot), _ = {
-  root: "df-stories",
-  preview: "df-stories-preview",
-  previewRing: "df-stories-preview__ring",
-  previewGap: "df-stories-preview__gap",
-  previewBody: "df-stories-preview__body",
-  previewTitle: "df-stories-preview__title",
-  viewer: "df-stories-viewer",
-  overlay: "df-stories-viewer__overlay",
-  stage: "df-stories-viewer__stage",
-  banner: "df-stories-banner",
-  progress: "df-stories-progress",
-  progressItem: "df-stories-progress__item",
-  content: "df-stories-content",
-  action: "df-stories-banner__action",
-  arrowPrev: "df-stories-viewer__arrow-prev",
-  arrowNext: "df-stories-viewer__arrow-next",
-  close: "df-stories-viewer__close"
-}, Je = "linear-gradient(135deg, #08c6c9 0%, #99b0fe 100%)", Qe = "#ecf6fc", V = "df-stories-banner", X = {
-  /** Длительность показа сегмента по умолчанию, мс. */
-  duration: 5e3,
-  /** Порог удержания указателя, после которого включается пауза (мс). До него — тап-навигация. */
-  pauseHoldDelay: 200,
-  /** Доля ширины баннера слева, отвечающая за переход к предыдущему сегменту (⅓). */
-  tapPrevZone: 1 / 3,
-  /** Цвет оверлея (тот же, что у ModalDF). */
-  overlayColor: "#060a0c47",
-  /** z-index оверлея; баннер получает zIndex + 1. */
-  zIndex: 9e3
-}, I = {
-  /** Диаметр круглого триггера, px. */
-  circle: 98,
-  /** Толщина каждого кольца (градиент / белый зазор), px. */
-  ring: 2,
-  /** Отступ от триггера до подписи, px. */
-  titleGap: 6,
-  /** Радиусы прямоугольного триггера: внешнее кольцо / белый зазор / тело. */
-  rectRadiusOuter: 12,
-  rectRadiusBody: 8,
-  /** Баннер. */
-  bannerMaxWidth: 430,
-  bannerMaxHeight: 900,
-  bannerRadius: 16,
-  bannerPadding: 28,
-  /** Внешний контейнер вьюера (баннер + просветы под стрелки). */
-  stageWidth: 558,
-  /** Прогресс-индикаторы. */
-  progressHeight: 4,
-  progressRadius: 2,
-  progressFillRadius: 6,
-  progressGap: 4
-}, et = "StoriesPreview", le = S.div.withConfig({
-  displayName: "StoriesContentstyled__StyledContent"
-})(["position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:", ";"], Le), tt = S.img.withConfig({
-  displayName: "StoriesContentstyled__StyledImage"
-})(["width:100%;height:100%;object-fit:", ";opacity:", ";transition:opacity 0.2s ease;user-select:none;"], ({
-  $objectFit: e
-}) => e, ({
-  $loaded: e
-}) => e ? 1 : 0), nt = S.div.withConfig({
-  displayName: "StoriesContentstyled__StyledSpinner"
-})(["position:absolute;display:flex;align-items:center;justify-content:center;"]), ot = S.div.withConfig({
-  displayName: "StoriesContentstyled__StyledErrorSlot"
-})(["position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:", "px;"], I.bannerPadding), rt = ({
-  slide: e,
-  status: t,
-  errorNode: o
-}) => {
-  const r = e.objectFit ?? "cover", i = t === "loaded";
-  return t === "error" ? /* @__PURE__ */ n(le, { className: _.content, children: /* @__PURE__ */ n(ot, { children: o }) }) : /* @__PURE__ */ L(le, { className: _.content, children: [
-    /* @__PURE__ */ n(tt, { src: e.src, alt: "", draggable: !1, $objectFit: r, $loaded: i }),
-    t === "loading" ? /* @__PURE__ */ n(nt, { children: /* @__PURE__ */ n(we, { view: "default", size: "l" }) }) : null
-  ] });
-}, de = (e, t) => {
-  e && (e.style.transform = `scaleX(${t})`);
-}, it = ({
-  fillRef: e,
-  active: t,
-  duration: o,
-  isPlaying: r,
-  isReady: i,
-  resetKey: f,
-  onComplete: l
-}) => {
-  const d = P(0), h = P(l);
-  h.current = l, A(() => {
-    d.current = 0, de(e.current, 0);
-  }, [f, e]), A(() => {
-    if (!t || !r || !i || o <= 0)
-      return;
-    let u = 0, g = performance.now();
-    const y = (a) => {
-      d.current += a - g, g = a;
-      const v = Math.min(1, d.current / o);
-      if (de(e.current, v), v >= 1) {
-        h.current();
-        return;
-      }
-      u = requestAnimationFrame(y);
-    };
-    return u = requestAnimationFrame(y), () => cancelAnimationFrame(u);
-  }, [t, r, i, o, f, e]);
-}, st = S.div.withConfig({
-  displayName: "StoriesProgressstyled__StyledProgress"
-})(["display:flex;gap:", "px;width:100%;"], I.progressGap), at = S.div.withConfig({
-  displayName: "StoriesProgressstyled__StyledItem"
-})(["position:relative;flex:1 1 0;height:", "px;border-radius:", "px;overflow:hidden;background:", ";"], I.progressHeight, I.progressRadius, ({
-  $bg: e
-}) => e), lt = S.span.withConfig({
-  displayName: "StoriesProgressstyled__StyledFill"
-})(["position:absolute;inset:0;border-radius:", "px;background:", ";transform:scaleX(0);transform-origin:left center;will-change:transform;"], I.progressFillRadius, ({
-  $color: e
-}) => e), dt = ({
-  isReady: e
-}) => {
-  var E;
-  const {
-    store: t,
-    controller: o,
-    groups: r,
-    defaultDuration: i,
-    mode: f
-  } = W(), {
-    groupIndex: l,
-    slideIndex: d,
-    isPlaying: h,
-    isOpen: u
-  } = Y(t), g = Ge(), a = (f ?? g) === "dark", v = a ? He : Me, p = a ? je : Fe, w = r[l], T = (w == null ? void 0 : w.slides) ?? [], z = P(null), k = ((E = T[d]) == null ? void 0 : E.duration) ?? (w == null ? void 0 : w.defaultDuration) ?? i;
-  return it({
-    fillRef: z,
-    active: u,
-    duration: k,
-    isPlaying: h,
-    isReady: e,
-    resetKey: `${l}-${d}`,
-    onComplete: o.next
-  }), /* @__PURE__ */ n(st, { className: _.progress, children: T.map(($, N) => {
-    const D = $.id ?? `${l}-${N}`, O = N < d, j = N === d;
-    return /* @__PURE__ */ n(at, { className: _.progressItem, $bg: O ? p : v, children: j ? /* @__PURE__ */ n(lt, { ref: z, $color: p }) : null }, D);
-  }) });
-}, ct = G(["from{opacity:0;transform:scale(0.92) translateY(8px);}to{opacity:1;transform:scale(1) translateY(0);}"]), pt = G(["from{opacity:1;transform:scale(1) translateY(0);}to{opacity:0;transform:scale(0.96) translateY(6px);}"]), ut = S.div.withConfig({
-  displayName: "StoriesBannerstyled__StyledBanner"
-})(["position:relative;width:min(", "px,calc(100vw - 100px));height:100%;max-height:", "px;border-radius:", "px;overflow:hidden;view-transition-name:", ";animation:", " ", " ease forwards;"], I.bannerMaxWidth, I.bannerMaxHeight, I.bannerRadius, V, ({
-  $closing: e
-}) => e ? pt : ct, ({
-  $closing: e
-}) => e ? "0.2s" : "0.24s"), gt = S.div.withConfig({
-  displayName: "StoriesBannerstyled__StyledTapLayer"
-})(["position:absolute;inset:0;z-index:1;touch-action:none;"]), ft = S.div.withConfig({
-  displayName: "StoriesBannerstyled__StyledTop"
-})(["position:absolute;top:0;left:0;right:0;z-index:2;padding:", "px;pointer-events:none;"], I.bannerPadding), yt = S.div.withConfig({
-  displayName: "StoriesBannerstyled__StyledBottom"
-})(["position:absolute;bottom:0;left:0;right:0;z-index:2;padding:", "px;pointer-events:none;"], I.bannerPadding), mt = S.div.withConfig({
-  displayName: "StoriesBannerstyled__StyledActionSlot"
-})(["pointer-events:auto;"]), St = ({
-  closing: e,
-  onAnimationEnd: t
-}) => {
-  const {
-    store: o,
-    controller: r,
-    groups: i,
-    pauseHoldDelay: f,
-    tapPrevZone: l,
-    loadingDelay: d,
-    onError: h,
-    renderError: u
-  } = W(), {
-    groupIndex: g,
-    slideIndex: y,
-    isOpen: a
-  } = Y(o), v = i[g], p = v == null ? void 0 : v.slides[y], {
-    status: w,
-    reload: T
-  } = Ve(p == null ? void 0 : p.src, d), z = qe({
-    controller: r,
-    pauseHoldDelay: f,
-    tapPrevZone: l,
-    isOpen: a
-  }), k = P();
-  A(() => {
-    if (w !== "error" || !p)
-      return;
-    const O = `${g}-${y}`;
-    k.current !== O && (k.current = O, h == null || h({
-      groupIndex: g,
-      slideIndex: y,
-      slide: p,
-      retry: T
-    }));
-  }, [w, g, y, p, h, T]);
-  const E = (O) => O.stopPropagation(), $ = (O) => {
-    O.target === O.currentTarget && t();
-  };
-  if (!p)
-    return null;
-  const {
-    footer: N
-  } = p, D = u ? u({
-    groupIndex: g,
-    slideIndex: y,
-    slide: p,
-    retry: T
-  }) : /* @__PURE__ */ n(Be, { size: "s", variant: "not-found", title: "Не удалось загрузить", subtitle: "Проверьте соединение и попробуйте снова", centered: !0, buttons: [{
-    type: "button",
-    props: {
-      text: "Попробовать снова",
-      view: "secondary",
-      onClick: T
-    }
-  }] });
-  return /* @__PURE__ */ L(ut, { className: _.banner, $closing: e, onClick: E, onAnimationEnd: $, children: [
-    /* @__PURE__ */ n(rt, { slide: p, status: w, errorNode: D }),
-    w === "error" ? null : /* @__PURE__ */ n(gt, { ...z }),
-    /* @__PURE__ */ n(ft, { children: /* @__PURE__ */ n(dt, { isReady: w === "loaded" }) }),
-    N ? /* @__PURE__ */ n(yt, { children: /* @__PURE__ */ n(mt, { className: _.action, children: N }) }) : null
-  ] });
-}, ne = {
-  ring: () => Je,
-  fallback: () => Qe,
-  boxShadow: () => We
-}, oe = (e, t) => e === "circle" ? "50%" : `${{
-  outer: I.rectRadiusOuter,
-  body: I.rectRadiusBody
-}[t]}px`, xt = S.div.withConfig({
-  displayName: "StoriesPreviewstyled__StyledPreview"
-})(["display:flex;flex-direction:column;align-items:center;width:", "px;"], ({
-  $width: e
-}) => e), ht = S.button.withConfig({
-  displayName: "StoriesPreviewstyled__StyledTrigger"
-})(["position:relative;display:block;box-sizing:border-box;width:", "px;height:", "px;padding:0;margin:0;border:0;background:transparent;cursor:pointer;border-radius:", ";outline:none;&:focus-visible{outline:2px solid ", ";outline-offset:2px;}"], ({
-  $width: e
-}) => e, ({
-  $height: e
-}) => e, ({
-  $shape: e
-}) => oe(e, "outer"), Xe), vt = S.div.withConfig({
-  displayName: "StoriesPreviewstyled__StyledRing"
-})(["position:absolute;inset:0;box-sizing:border-box;padding:", "px;background:", ";border-radius:", ";-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;"], I.ring, ne.ring, ({
-  $shape: e
-}) => oe(e, "outer")), wt = S.div.withConfig({
-  displayName: "StoriesPreviewstyled__StyledBody"
-})(["position:absolute;inset:", "px;box-sizing:border-box;box-shadow:", ";background-color:", ";background-position:center;background-size:cover;background-repeat:no-repeat;", " border-radius:", ";"], ({
-  $viewed: e
-}) => e ? 0 : I.ring * 2, ne.boxShadow, ne.fallback, ({
-  $image: e
-}) => e && ge(["background-image:url(", ");"], e), ({
-  $shape: e,
-  $viewed: t
-}) => oe(e, t ? "outer" : "body")), bt = S.div.withConfig({
-  displayName: "StoriesPreviewstyled__StyledTitle"
-})(["margin-top:", "px;width:100%;text-align:", ";& > *{width:100%;}"], I.titleGap, ({
-  $align: e
-}) => e), ye = (e) => {
-  var Z;
-  const {
-    slides: t,
-    shape: o = "circle",
-    title: r,
-    titleProps: i,
-    image: f,
-    viewed: l = !1,
-    size: d = I.circle,
-    width: h,
-    height: u,
-    renderTrigger: g,
-    className: y,
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    __index: a = 0
-  } = e, {
-    store: v,
-    controller: p,
-    preloadOnHover: w
-  } = W(), T = Y(v), z = T.isOpen && T.groupIndex === a, k = o === "rect" ? h ?? d : d, E = o === "rect" ? u ?? d : d, $ = () => p.open(a), N = () => {
-    w && t[0] && te(t[0].src);
-  }, D = () => g ? g({
-    index: a,
-    viewed: l,
-    isActive: z
-  }) : /* @__PURE__ */ L(ve, { children: [
-    l ? null : /* @__PURE__ */ n(vt, { className: _.previewRing, $shape: o }),
-    /* @__PURE__ */ n(wt, { className: _.previewBody, $shape: o, $viewed: l, $image: f })
-  ] }), O = {
-    variant: "BodyXXS",
-    bold: !0,
-    lines: 2,
-    tooltipText: r,
-    color: Ye,
-    ...i,
-    children: r
-  }, j = ((Z = i == null ? void 0 : i.style) == null ? void 0 : Z.textAlign) ?? "center";
-  return /* @__PURE__ */ L(xt, { className: [_.preview, y].filter(Boolean).join(" "), "data-component": et, $width: k, children: [
-    /* @__PURE__ */ n(ht, { type: "button", "aria-label": r, $width: k, $height: E, $shape: o, onClick: $, onMouseEnter: N, children: D() }),
-    r ? /* @__PURE__ */ n(bt, { className: _.previewTitle, style: {
-      maxWidth: k
-    }, $align: j, children: /* @__PURE__ */ n(Ke, { ...O }) }) : null
-  ] });
-}, It = G(["from{opacity:0;}to{opacity:1;}"]), _t = G(["from{opacity:1;}to{opacity:0;}"]), me = (e) => ge(["animation:", " ", " ease forwards;"], e ? _t : It, e ? "0.2s" : "0.24s"), Ct = S.div.withConfig({
-  displayName: "StoriesViewerstyled__StyledRoot"
-})(["position:fixed;inset:0;z-index:", ";display:flex;align-items:center;justify-content:center;"], ({
-  $zIndex: e
-}) => e), Nt = S.div.withConfig({
-  displayName: "StoriesViewerstyled__StyledOverlay"
-})(["position:absolute;inset:0;background:", ";opacity:", ";transition:opacity 0.24s ease;"], ({
-  $color: e
-}) => e, ({
-  $closing: e
-}) => e ? 0 : 1), Pt = S.div.withConfig({
-  displayName: "StoriesViewerstyled__StyledStage"
-})(["position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:min(", "px,100vw);height:min(", "px,calc(100vh - 32px));outline:none;"], I.stageWidth, I.bannerMaxHeight), ce = S.div.withConfig({
-  displayName: "StoriesViewerstyled__StyledArrow"
-})(["position:absolute;top:50%;", " z-index:3;transform:translateY(-50%);", ""], ({
-  $side: e
-}) => e === "prev" ? "left: 0;" : "right: 0;", ({
-  $closing: e
-}) => me(e)), Tt = S.div.withConfig({
-  displayName: "StoriesViewerstyled__StyledClose"
-})(["position:absolute;top:0;right:0;z-index:3;", ""], ({
-  $closing: e
-}) => me(e)), kt = G(["from{transform:translateX(24px);opacity:0;}to{transform:translateX(0);opacity:1;}"]), Ot = G(["from{transform:translateX(0);opacity:1;}to{transform:translateX(-24px);opacity:0;}"]), Rt = G(["from{transform:translateX(-24px);opacity:0;}to{transform:translateX(0);opacity:1;}"]), Et = G(["from{transform:translateX(0);opacity:1;}to{transform:translateX(24px);opacity:0;}"]), At = Ze(["::view-transition-old(", "),::view-transition-new(", "){animation-duration:0.3s;animation-timing-function:ease;}html[data-df-stories-dir='next']::view-transition-new(", "){animation-name:", ";}html[data-df-stories-dir='next']::view-transition-old(", "){animation-name:", ";}html[data-df-stories-dir='prev']::view-transition-new(", "){animation-name:", ";}html[data-df-stories-dir='prev']::view-transition-old(", "){animation-name:", ";}"], V, V, V, kt, V, Ot, V, Rt, V, Et), zt = () => {
-  const {
-    store: e,
-    controller: t,
-    groups: o,
-    overlay: r,
-    overlayColor: i,
-    zIndex: f,
-    groupTransition: l,
-    arrows: d,
-    preloadGroup: h
-  } = W(), {
-    isOpen: u,
-    groupIndex: g
-  } = Y(e), [y, a] = pe(u), v = P(null);
-  A(() => {
-    u && a(!0);
-  }, [u]), A(() => {
-    var N;
-    u && ((N = v.current) == null || N.focus());
-  }, [u]), A(() => {
-    u && h(g);
-  }, [u, g, h]);
-  const p = y && !u, w = ue(() => {
-    p && a(!1);
-  }, [p]);
-  if (!y || typeof document > "u")
-    return null;
-  const T = g > 0, z = g < o.length - 1, k = d === "always" || d === "auto" && o.length > 1, E = (N) => N.stopPropagation(), $ = /* @__PURE__ */ L(Ct, { className: _.viewer, $zIndex: f, onClick: () => t.close(), children: [
-    r ? /* @__PURE__ */ n(Nt, { className: _.overlay, $color: i, $closing: p }) : null,
-    l === "slide" ? /* @__PURE__ */ n(At, {}) : null,
-    /* @__PURE__ */ L(Pt, { ref: v, tabIndex: -1, className: _.stage, children: [
-      k ? /* @__PURE__ */ n(ce, { className: _.arrowPrev, $side: "prev", $closing: p, onClick: E, children: /* @__PURE__ */ n(ee, { size: "s", view: "white", pin: "circle-circle", "aria-label": "Предыдущая группа", disabled: !T, onClick: () => t.prevGroup(), children: /* @__PURE__ */ n(be, { size: "s" }) }) }) : null,
-      /* @__PURE__ */ n(St, { closing: p, onAnimationEnd: w }),
-      k ? /* @__PURE__ */ n(ce, { className: _.arrowNext, $side: "next", $closing: p, onClick: E, children: /* @__PURE__ */ n(ee, { size: "s", view: "white", pin: "circle-circle", "aria-label": "Следующая группа", disabled: !z, onClick: () => t.nextGroup(), children: /* @__PURE__ */ n(Ie, { size: "s" }) }) }) : null,
-      /* @__PURE__ */ n(Tt, { className: _.close, $closing: p, onClick: E, children: /* @__PURE__ */ n(ee, { size: "s", view: "white", pin: "circle-circle", "aria-label": "Закрыть", onClick: () => t.close(), children: /* @__PURE__ */ n(_e, { size: "s" }) }) })
-    ] })
-  ] });
-  return $e($, document.body);
-}, $t = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  StoriesViewer: zt
-}, Symbol.toStringTag, { value: "Module" })), Dt = Te(() => Promise.resolve().then(() => $t).then((e) => ({
-  default: e.StoriesViewer
-}))), Bt = (e) => {
-  const t = P(e);
-  return t.current = e, ue((o) => {
-    const r = t.current[o];
-    if (!r)
-      return;
-    r.slides.forEach((f) => te(f.src));
-    const i = t.current[o + 1];
-    i != null && i.slides[0] && te(i.slides[0].src);
-  }, []);
-}, Gt = {
-  isOpen: !1,
-  groupIndex: 0,
-  slideIndex: 0,
-  isPlaying: !0,
-  direction: "next"
-}, Vt = (e) => {
-  let t = {
-    ...Gt,
-    ...e
-  };
-  const o = /* @__PURE__ */ new Set();
-  return {
-    getSnapshot: () => t,
-    subscribe: (r) => (o.add(r), () => {
-      o.delete(r);
-    }),
-    setState: (r) => {
-      Object.keys(r).some((l) => t[l] !== r[l]) && (t = {
-        ...t,
-        ...r
-      }, o.forEach((l) => l()));
-    }
-  };
-}, Lt = () => typeof document < "u" && typeof document.startViewTransition == "function", jt = (e, t) => {
-  const {
-    direction: o = "next",
-    enabled: r = !0
-  } = t ?? {};
-  if (!r || !Lt()) {
-    e();
-    return;
-  }
-  const i = document;
-  i.documentElement.dataset.dfStoriesDir = o, i.startViewTransition(() => De(e)).finished.finally(() => {
-    delete i.documentElement.dataset.dfStoriesDir;
-  });
-}, Ft = S.div.withConfig({
-  displayName: "Storiesstyled__StyledStories"
-})(["display:flex;align-items:flex-start;gap:16px;"]), Ht = (e) => Ae(e) && e.type === ye, Mt = () => {
-  const {
-    store: e
-  } = W(), {
-    isOpen: t
-  } = Y(e), [o, r] = pe(t);
-  return A(() => {
-    t && r(!0);
-  }, [t]), o ? /* @__PURE__ */ n(ze, { fallback: null, children: /* @__PURE__ */ n(Dt, {}) }) : null;
-}, Xt = (e, t) => {
-  const {
-    children: o,
-    defaultDuration: r = X.duration,
-    open: i,
-    defaultOpen: f,
-    activeGroupIndex: l,
-    activeSlideIndex: d,
-    onOpenChange: h,
-    onGroupChange: u,
-    onSlideChange: g,
-    onComplete: y,
-    onGroupComplete: a,
-    onClose: v,
-    onError: p,
-    renderError: w,
-    overlay: T = !0,
-    overlayColor: z = X.overlayColor,
-    zIndex: k = X.zIndex,
-    preloadOnHover: E = !0,
-    loadingDelay: $ = 0,
-    pauseHoldDelay: N = X.pauseHoldDelay,
-    groupTransition: D = "slide",
-    arrows: O = "auto",
-    mode: j,
-    className: Z
-  } = e, re = Oe.toArray(o).filter(Ht), K = re.map((b) => ({
-    slides: b.props.slides ?? [],
-    defaultDuration: b.props.defaultDuration
-  })), U = P();
-  U.current || (U.current = Vt({
-    isOpen: f ?? !1
-  }));
-  const c = U.current, q = P(K);
-  q.current = K;
-  const ie = P({
-    groupTransition: D
-  });
-  ie.current = {
-    groupTransition: D
-  };
-  const F = P({
-    onOpenChange: h,
-    onGroupChange: u,
-    onSlideChange: g,
-    onComplete: y,
-    onGroupComplete: a,
-    onClose: v
-  });
-  F.current = {
-    onOpenChange: h,
-    onGroupChange: u,
-    onSlideChange: g,
-    onComplete: y,
-    onGroupComplete: a,
-    onClose: v
-  };
-  const J = P();
-  if (!J.current) {
-    const b = (s, C) => c.setState({
-      slideIndex: s,
-      direction: C,
-      isPlaying: !0
-    }), m = (s, C, R) => jt(() => c.setState({
-      groupIndex: s,
-      slideIndex: C,
-      direction: R,
-      isPlaying: !0
-    }), {
-      direction: R,
-      enabled: ie.current.groupTransition !== "none"
-    }), x = () => {
-      var s, C;
-      (C = (s = F.current).onComplete) == null || C.call(s), c.setState({
-        isOpen: !1,
-        isPlaying: !1
-      });
-    };
-    J.current = {
-      open: (s, C) => {
-        const R = c.getSnapshot();
-        c.setState({
-          isOpen: !0,
-          groupIndex: s ?? R.groupIndex,
-          slideIndex: C ?? 0,
-          isPlaying: !0,
-          direction: "next"
-        });
-      },
-      close: () => c.setState({
-        isOpen: !1,
-        isPlaying: !1
-      }),
-      next: () => {
-        var R, B, H, M, ae;
-        const s = c.getSnapshot(), C = ((R = q.current[s.groupIndex]) == null ? void 0 : R.slides.length) ?? 0;
-        s.slideIndex + 1 < C ? b(s.slideIndex + 1, "next") : s.groupIndex + 1 < q.current.length ? ((H = (B = F.current).onGroupComplete) == null || H.call(B, s.groupIndex), m(s.groupIndex + 1, 0, "next")) : ((ae = (M = F.current).onGroupComplete) == null || ae.call(M, s.groupIndex), x());
-      },
-      prev: () => {
-        const s = c.getSnapshot();
-        s.slideIndex > 0 ? b(s.slideIndex - 1, "prev") : s.groupIndex > 0 && m(s.groupIndex - 1, 0, "prev");
-      },
-      nextGroup: () => {
-        const s = c.getSnapshot();
-        s.groupIndex + 1 < q.current.length && m(s.groupIndex + 1, 0, "next");
-      },
-      prevGroup: () => {
-        const s = c.getSnapshot();
-        s.groupIndex > 0 && m(s.groupIndex - 1, 0, "prev");
-      },
-      goTo: (s, C) => {
-        const R = c.getSnapshot(), B = s < R.groupIndex ? "prev" : "next";
-        s === R.groupIndex ? b(C ?? 0, B) : m(s, C ?? 0, B);
-      },
-      pause: () => c.setState({
-        isPlaying: !1
-      }),
-      resume: () => c.setState({
-        isPlaying: !0
-      })
-    };
-  }
-  const Q = J.current, xe = Bt(K), se = P(c.getSnapshot());
-  A(() => c.subscribe(() => {
-    var s, C, R, B, H, M;
-    const b = se.current, m = c.getSnapshot();
-    se.current = m;
-    const x = F.current;
-    if (b.isOpen !== m.isOpen) {
-      (s = x.onOpenChange) == null || s.call(x, m.isOpen, {
-        groupIndex: m.groupIndex
-      }), m.isOpen ? ((C = x.onGroupChange) == null || C.call(x, m.groupIndex), (R = x.onSlideChange) == null || R.call(x, m.groupIndex, m.slideIndex)) : (B = x.onClose) == null || B.call(x);
-      return;
-    }
-    m.isOpen && (b.groupIndex !== m.groupIndex && ((H = x.onGroupChange) == null || H.call(x, m.groupIndex)), (b.groupIndex !== m.groupIndex || b.slideIndex !== m.slideIndex) && ((M = x.onSlideChange) == null || M.call(x, m.groupIndex, m.slideIndex)));
-  }), [c]), A(() => {
-    i !== void 0 && c.setState({
-      isOpen: i
-    });
-  }, [i, c]), A(() => {
-    l !== void 0 && c.setState({
-      groupIndex: l
-    });
-  }, [l, c]), A(() => {
-    d !== void 0 && c.setState({
-      slideIndex: d
-    });
-  }, [d, c]), Re(t, () => ({
-    ...Q,
-    getState: () => {
-      const b = c.getSnapshot();
-      return {
-        isOpen: b.isOpen,
-        groupIndex: b.groupIndex,
-        slideIndex: b.slideIndex,
-        isPlaying: b.isPlaying
-      };
-    }
-  }), [Q, c]);
-  const he = {
-    store: c,
-    controller: Q,
-    groups: K,
-    defaultDuration: r,
-    pauseHoldDelay: N,
-    tapPrevZone: X.tapPrevZone,
-    preloadGroup: xe,
-    preloadOnHover: E,
-    loadingDelay: $,
-    overlay: T,
-    overlayColor: z,
-    zIndex: k,
-    groupTransition: D,
-    arrows: O,
-    mode: j,
-    onError: p,
-    renderError: w
-  };
-  return /* @__PURE__ */ L(Ue, { value: he, children: [
-    /* @__PURE__ */ n(Ft, { className: [_.root, Z].filter(Boolean).join(" "), children: re.map((b, m) => Ee(b, {
-      __index: m
-    })) }),
-    /* @__PURE__ */ n(Mt, {})
-  ] });
-}, Se = ke(Xt);
-Se.Preview = ye;
-Se.displayName = "Stories";
-export {
-  Se as S,
-  ye as a,
-  rt as b,
-  dt as c,
-  St as d,
-  zt as e,
-  Dt as f,
-  _ as s
-};