alinea/dist/ui/Tabs.js

Headless git-based CMS

import {
  Lift_module_default
} from "../chunks/chunk-CKT37OYJ.js";
import {
  F,
  P,
  T,
  _ as _2
} from "../chunks/chunk-HSIHEWFC.js";
import {
  f,
  s as s2
} from "../chunks/chunk-AICQFCVN.js";
import {
  $6179b936705e76d3$export$ae780daf29e6d456,
  $f7dceffc5ad7768b$export$4e328f61c538687f,
  K,
  L,
  O,
  _,
  e,
  n,
  o2 as o,
  o3 as o2,
  r,
  s2 as s,
  t,
  u,
  u2,
  w,
  y
} from "../chunks/chunk-VUACWPFC.js";
import {
  dist_default
} from "../chunks/chunk-A5O3N2GS.js";
import "../chunks/chunk-NZLE2WMY.js";

// node_modules/@headlessui/react/dist/hooks/use-is-mounted.js
import { useRef as r2 } from "react";
function f2() {
  let e2 = r2(false);
  return n(() => (e2.current = true, () => {
    e2.current = false;
  }), []), e2;
}

// node_modules/@headlessui/react/dist/components/tabs/tabs.js
import U, { createContext as ae, useContext as le, useMemo as F2, useReducer as be, useRef as z, useState as me } from "react";

// node_modules/@headlessui/react/dist/internal/focus-sentinel.js
import s3, { useState as c } from "react";
function b({ onFocus: n2 }) {
  let [r3, o3] = c(true), u3 = f2();
  return r3 ? s3.createElement(f, { as: "button", type: "button", features: s2.Focusable, onFocus: (a2) => {
    a2.preventDefault();
    let e2, i = 50;
    function t2() {
      if (i-- <= 0) {
        e2 && cancelAnimationFrame(e2);
        return;
      }
      if (n2()) {
        if (cancelAnimationFrame(e2), !u3.current) return;
        o3(false);
        return;
      }
      e2 = requestAnimationFrame(t2);
    }
    e2 = requestAnimationFrame(t2);
  } }) : null;
}

// node_modules/@headlessui/react/dist/utils/stable-collection.js
import * as l from "react";
var s4 = l.createContext(null);
function a() {
  return { groups: /* @__PURE__ */ new Map(), get(o3, e2) {
    var i;
    let t2 = this.groups.get(o3);
    t2 || (t2 = /* @__PURE__ */ new Map(), this.groups.set(o3, t2));
    let n2 = (i = t2.get(e2)) != null ? i : 0;
    t2.set(e2, n2 + 1);
    let r3 = Array.from(t2.keys()).indexOf(e2);
    function u3() {
      let c2 = t2.get(e2);
      c2 > 1 ? t2.set(e2, c2 - 1) : t2.delete(e2);
    }
    return [r3, u3];
  } };
}
function f3({ children: o3 }) {
  let e2 = l.useRef(a());
  return l.createElement(s4.Provider, { value: e2 }, o3);
}
function C(o3) {
  let e2 = l.useContext(s4);
  if (!e2) throw new Error("You must wrap your component in a <StableCollection>");
  let t2 = l.useId(), [n2, r3] = e2.current.get(o3, t2);
  return l.useEffect(() => r3, []), n2;
}

// node_modules/@headlessui/react/dist/components/tabs/tabs.js
var Le = ((t2) => (t2[t2.Forwards = 0] = "Forwards", t2[t2.Backwards = 1] = "Backwards", t2))(Le || {});
var _e = ((l2) => (l2[l2.Less = -1] = "Less", l2[l2.Equal = 0] = "Equal", l2[l2.Greater = 1] = "Greater", l2))(_e || {});
var De = ((n2) => (n2[n2.SetSelectedIndex = 0] = "SetSelectedIndex", n2[n2.RegisterTab = 1] = "RegisterTab", n2[n2.UnregisterTab = 2] = "UnregisterTab", n2[n2.RegisterPanel = 3] = "RegisterPanel", n2[n2.UnregisterPanel = 4] = "UnregisterPanel", n2))(De || {});
var Se = { [0](e2, r3) {
  var d;
  let t2 = _2(e2.tabs, (u3) => u3.current), l2 = _2(e2.panels, (u3) => u3.current), a2 = t2.filter((u3) => {
    var T2;
    return !((T2 = u3.current) != null && T2.hasAttribute("disabled"));
  }), n2 = { ...e2, tabs: t2, panels: l2 };
  if (r3.index < 0 || r3.index > t2.length - 1) {
    let u3 = u2(Math.sign(r3.index - e2.selectedIndex), { [-1]: () => 1, [0]: () => u2(Math.sign(r3.index), { [-1]: () => 0, [0]: () => 0, [1]: () => 1 }), [1]: () => 0 });
    if (a2.length === 0) return n2;
    let T2 = u2(u3, { [0]: () => t2.indexOf(a2[0]), [1]: () => t2.indexOf(a2[a2.length - 1]) });
    return { ...n2, selectedIndex: T2 === -1 ? e2.selectedIndex : T2 };
  }
  let s5 = t2.slice(0, r3.index), b2 = [...t2.slice(r3.index), ...s5].find((u3) => a2.includes(u3));
  if (!b2) return n2;
  let f4 = (d = t2.indexOf(b2)) != null ? d : e2.selectedIndex;
  return f4 === -1 && (f4 = e2.selectedIndex), { ...n2, selectedIndex: f4 };
}, [1](e2, r3) {
  if (e2.tabs.includes(r3.tab)) return e2;
  let t2 = e2.tabs[e2.selectedIndex], l2 = _2([...e2.tabs, r3.tab], (n2) => n2.current), a2 = e2.selectedIndex;
  return e2.info.current.isControlled || (a2 = l2.indexOf(t2), a2 === -1 && (a2 = e2.selectedIndex)), { ...e2, tabs: l2, selectedIndex: a2 };
}, [2](e2, r3) {
  return { ...e2, tabs: e2.tabs.filter((t2) => t2 !== r3.tab) };
}, [3](e2, r3) {
  return e2.panels.includes(r3.panel) ? e2 : { ...e2, panels: _2([...e2.panels, r3.panel], (t2) => t2.current) };
}, [4](e2, r3) {
  return { ...e2, panels: e2.panels.filter((t2) => t2 !== r3.panel) };
} };
var V = ae(null);
V.displayName = "TabsDataContext";
function C2(e2) {
  let r3 = le(V);
  if (r3 === null) {
    let t2 = new Error(`<${e2} /> is missing a parent <Tab.Group /> component.`);
    throw Error.captureStackTrace && Error.captureStackTrace(t2, C2), t2;
  }
  return r3;
}
var Q = ae(null);
Q.displayName = "TabsActionsContext";
function Y(e2) {
  let r3 = le(Q);
  if (r3 === null) {
    let t2 = new Error(`<${e2} /> is missing a parent <Tab.Group /> component.`);
    throw Error.captureStackTrace && Error.captureStackTrace(t2, Y), t2;
  }
  return r3;
}
function Fe(e2, r3) {
  return u2(r3.type, Se, e2, r3);
}
var Ie = "div";
function he(e2, r3) {
  let { defaultIndex: t2 = 0, vertical: l2 = false, manual: a2 = false, onChange: n2, selectedIndex: s5 = null, ...g } = e2;
  const b2 = l2 ? "vertical" : "horizontal", f4 = a2 ? "manual" : "auto";
  let d = s5 !== null, u3 = s({ isControlled: d }), T2 = y(r3), [p, c2] = be(Fe, { info: u3, selectedIndex: s5 != null ? s5 : t2, tabs: [], panels: [] }), h = F2(() => ({ selectedIndex: p.selectedIndex }), [p.selectedIndex]), m = s(n2 || (() => {
  })), M = s(p.tabs), S = F2(() => ({ orientation: b2, activation: f4, ...p }), [b2, f4, p]), P2 = o((i) => (c2({ type: 1, tab: i }), () => c2({ type: 2, tab: i }))), A = o((i) => (c2({ type: 3, panel: i }), () => c2({ type: 4, panel: i }))), E = o((i) => {
    _3.current !== i && m.current(i), d || c2({ type: 0, index: i });
  }), _3 = s(d ? e2.selectedIndex : p.selectedIndex), D = F2(() => ({ registerTab: P2, registerPanel: A, change: E }), []);
  n(() => {
    c2({ type: 0, index: s5 != null ? s5 : t2 });
  }, [s5]), n(() => {
    if (_3.current === void 0 || p.tabs.length <= 0) return;
    let i = _2(p.tabs, (R) => R.current);
    i.some((R, X) => p.tabs[X] !== R) && E(i.indexOf(p.tabs[_3.current]));
  });
  let K2 = { ref: T2 }, J = L();
  return U.createElement(f3, null, U.createElement(Q.Provider, { value: D }, U.createElement(V.Provider, { value: S }, S.tabs.length <= 0 && U.createElement(b, { onFocus: () => {
    var i, G;
    for (let R of M.current) if (((i = R.current) == null ? void 0 : i.tabIndex) === 0) return (G = R.current) == null || G.focus(), true;
    return false;
  } }), J({ ourProps: K2, theirProps: g, slot: h, defaultTag: Ie, name: "Tabs" }))));
}
var ve = "div";
function Ce(e2, r3) {
  let { orientation: t2, selectedIndex: l2 } = C2("Tab.List"), a2 = y(r3), n2 = F2(() => ({ selectedIndex: l2 }), [l2]), s5 = e2, g = { ref: a2, role: "tablist", "aria-orientation": t2 };
  return L()({ ourProps: g, theirProps: s5, slot: n2, defaultTag: ve, name: "Tabs.List" });
}
var Me = "button";
function Ge(e2, r3) {
  var ee, te;
  let t2 = r(), { id: l2 = `headlessui-tabs-tab-${t2}`, disabled: a2 = false, autoFocus: n2 = false, ...s5 } = e2, { orientation: g, activation: b2, selectedIndex: f4, tabs: d, panels: u3 } = C2("Tab"), T2 = Y("Tab"), p = C2("Tab"), [c2, h] = me(null), m = z(null), M = y(m, r3, h);
  n(() => T2.registerTab(m), [T2, m]);
  let S = C("tabs"), P2 = d.indexOf(m);
  P2 === -1 && (P2 = S);
  let A = P2 === f4, E = o((o3) => {
    var $;
    let L2 = o3();
    if (L2 === T.Success && b2 === "auto") {
      let q = ($ = u(m)) == null ? void 0 : $.activeElement, re = p.tabs.findIndex((ce) => ce.current === q);
      re !== -1 && T2.change(re);
    }
    return L2;
  }), _3 = o((o3) => {
    let L2 = d.map((q) => q.current).filter(Boolean);
    if (o3.key === o2.Space || o3.key === o2.Enter) {
      o3.preventDefault(), o3.stopPropagation(), T2.change(P2);
      return;
    }
    switch (o3.key) {
      case o2.Home:
      case o2.PageUp:
        return o3.preventDefault(), o3.stopPropagation(), E(() => P(L2, F.First));
      case o2.End:
      case o2.PageDown:
        return o3.preventDefault(), o3.stopPropagation(), E(() => P(L2, F.Last));
    }
    if (E(() => u2(g, { vertical() {
      return o3.key === o2.ArrowUp ? P(L2, F.Previous | F.WrapAround) : o3.key === o2.ArrowDown ? P(L2, F.Next | F.WrapAround) : T.Error;
    }, horizontal() {
      return o3.key === o2.ArrowLeft ? P(L2, F.Previous | F.WrapAround) : o3.key === o2.ArrowRight ? P(L2, F.Next | F.WrapAround) : T.Error;
    } })) === T.Success) return o3.preventDefault();
  }), D = z(false), K2 = o(() => {
    var o3;
    D.current || (D.current = true, (o3 = m.current) == null || o3.focus({ preventScroll: true }), T2.change(P2), t(() => {
      D.current = false;
    }));
  }), J = o((o3) => {
    o3.preventDefault();
  }), { isFocusVisible: i, focusProps: G } = $f7dceffc5ad7768b$export$4e328f61c538687f({ autoFocus: n2 }), { isHovered: R, hoverProps: X } = $6179b936705e76d3$export$ae780daf29e6d456({ isDisabled: a2 }), { pressed: Z, pressProps: ue } = w({ disabled: a2 }), Te = F2(() => ({ selected: A, hover: R, active: Z, focus: i, autofocus: n2, disabled: a2 }), [A, R, i, Z, n2, a2]), de = _({ ref: M, onKeyDown: _3, onMouseDown: J, onClick: K2, id: l2, role: "tab", type: e(e2, c2), "aria-controls": (te = (ee = u3[P2]) == null ? void 0 : ee.current) == null ? void 0 : te.id, "aria-selected": A, tabIndex: A ? 0 : -1, disabled: a2 || void 0, autoFocus: n2 }, G, X, ue);
  return L()({ ourProps: de, theirProps: s5, slot: Te, defaultTag: Me, name: "Tabs.Tab" });
}
var Ue = "div";
function He(e2, r3) {
  let { selectedIndex: t2 } = C2("Tab.Panels"), l2 = y(r3), a2 = F2(() => ({ selectedIndex: t2 }), [t2]), n2 = e2, s5 = { ref: l2 };
  return L()({ ourProps: s5, theirProps: n2, slot: a2, defaultTag: Ue, name: "Tabs.Panels" });
}
var we = "div";
var Oe = O.RenderStrategy | O.Static;
function Ne(e2, r3) {
  var A, E, _3, D;
  let t2 = r(), { id: l2 = `headlessui-tabs-panel-${t2}`, tabIndex: a2 = 0, ...n2 } = e2, { selectedIndex: s5, tabs: g, panels: b2 } = C2("Tab.Panel"), f4 = Y("Tab.Panel"), d = z(null), u3 = y(d, r3);
  n(() => f4.registerPanel(d), [f4, d]);
  let T2 = C("panels"), p = b2.indexOf(d);
  p === -1 && (p = T2);
  let c2 = p === s5, { isFocusVisible: h, focusProps: m } = $f7dceffc5ad7768b$export$4e328f61c538687f(), M = F2(() => ({ selected: c2, focus: h }), [c2, h]), S = _({ ref: u3, id: l2, role: "tabpanel", "aria-labelledby": (E = (A = g[p]) == null ? void 0 : A.current) == null ? void 0 : E.id, tabIndex: c2 ? a2 : -1 }, m), P2 = L();
  return !c2 && ((_3 = n2.unmount) == null || _3) && !((D = n2.static) != null && D) ? U.createElement(f, { "aria-hidden": "true", ...S }) : P2({ ourProps: S, theirProps: n2, slot: M, defaultTag: we, features: Oe, visible: c2, name: "Tabs.Panel" });
}
var ke = K(Ge);
var Be = K(he);
var We = K(Ce);
var je = K(He);
var Ke = K(Ne);
var Tt = Object.assign(ke, { Group: Be, List: We, Panels: je, Panel: Ke });

// src/ui/Tabs.module.scss
var Tabs_module_default = {
  "list": "alinea-Tabs-list",
  "trigger": "alinea-Tabs-trigger",
  "is-selected": "alinea-Tabs-is-selected",
  "isSelected": "alinea-Tabs-is-selected"
};

// src/ui/Tabs.tsx
import { jsx } from "react/jsx-runtime";
var styles = dist_default(Tabs_module_default);
var liftStyles = dist_default(Lift_module_default);
var Tabs;
((Tabs2) => {
  Tabs2.Root = Tt.Group;
  function List({
    backdrop = true,
    ...props
  }) {
    return /* @__PURE__ */ jsx(
      Tt.List,
      {
        className: backdrop ? liftStyles.header.mergeProps(props).with(styles.list)() : styles.list,
        ...props
      }
    );
  }
  Tabs2.List = List;
  function Trigger(props) {
    return /* @__PURE__ */ jsx(
      Tt,
      {
        ...props,
        className: ({ selected }) => styles.trigger.mergeProps(props)({ selected })
      }
    );
  }
  Tabs2.Trigger = Trigger;
  Tabs2.Panels = Tt.Panels;
  Tabs2.Panel = Tt.Panel;
})(Tabs || (Tabs = {}));
export {
  Tabs
};