welcome-ui/dist/Breadcrumb.js

Customizable design system with react, typescript, tailwindcss and ariakit.

"use client";
import { jsxs as te, jsx as R } from "react/jsx-runtime";
import { forwardRef as re, Children as pe, cloneElement as be, useRef as M, useState as V, useCallback as X, useMemo as ge, useEffect as q } from "react";
import "./Icon-BisRi8B3.js";
import { R as me } from "./index-Dcq5gh3E.js";
import { c as ne } from "./index-PAaZGbyz.js";
import { t as xe } from "./throttle-BDBzFeFj.js";
var b = [], ze = function() {
  return b.some(function(e) {
    return e.activeTargets.length > 0;
  });
}, Re = function() {
  return b.some(function(e) {
    return e.skippedTargets.length > 0;
  });
}, $ = "ResizeObserver loop completed with undelivered notifications.", we = function() {
  var e;
  typeof ErrorEvent == "function" ? e = new ErrorEvent("error", {
    message: $
  }) : (e = document.createEvent("Event"), e.initEvent("error", !1, !1), e.message = $), window.dispatchEvent(e);
}, y;
(function(e) {
  e.BORDER_BOX = "border-box", e.CONTENT_BOX = "content-box", e.DEVICE_PIXEL_CONTENT_BOX = "device-pixel-content-box";
})(y || (y = {}));
var g = function(e) {
  return Object.freeze(e);
}, Oe = /* @__PURE__ */ function() {
  function e(t, r) {
    this.inlineSize = t, this.blockSize = r, g(this);
  }
  return e;
}(), ie = function() {
  function e(t, r, n, i) {
    return this.x = t, this.y = r, this.width = n, this.height = i, this.top = this.y, this.left = this.x, this.bottom = this.top + this.height, this.right = this.left + this.width, g(this);
  }
  return e.prototype.toJSON = function() {
    var t = this, r = t.x, n = t.y, i = t.top, o = t.right, s = t.bottom, l = t.left, c = t.width, v = t.height;
    return { x: r, y: n, top: i, right: o, bottom: s, left: l, width: c, height: v };
  }, e.fromRect = function(t) {
    return new e(t.x, t.y, t.width, t.height);
  }, e;
}(), P = function(e) {
  return e instanceof SVGElement && "getBBox" in e;
}, oe = function(e) {
  if (P(e)) {
    var t = e.getBBox(), r = t.width, n = t.height;
    return !r && !n;
  }
  var i = e, o = i.offsetWidth, s = i.offsetHeight;
  return !(o || s || e.getClientRects().length);
}, J = function(e) {
  var t;
  if (e instanceof Element)
    return !0;
  var r = (t = e == null ? void 0 : e.ownerDocument) === null || t === void 0 ? void 0 : t.defaultView;
  return !!(r && e instanceof r.Element);
}, Ee = function(e) {
  switch (e.tagName) {
    case "INPUT":
      if (e.type !== "image")
        break;
    case "VIDEO":
    case "AUDIO":
    case "EMBED":
    case "OBJECT":
    case "CANVAS":
    case "IFRAME":
    case "IMG":
      return !0;
  }
  return !1;
}, E = typeof window < "u" ? window : {}, S = /* @__PURE__ */ new WeakMap(), U = /auto|scroll/, ye = /^tb|vertical/, Te = /msie|trident/i.test(E.navigator && E.navigator.userAgent), d = function(e) {
  return parseFloat(e || "0");
}, z = function(e, t, r) {
  return e === void 0 && (e = 0), t === void 0 && (t = 0), r === void 0 && (r = !1), new Oe((r ? t : e) || 0, (r ? e : t) || 0);
}, Y = g({
  devicePixelContentBoxSize: z(),
  borderBoxSize: z(),
  contentBoxSize: z(),
  contentRect: new ie(0, 0, 0, 0)
}), se = function(e, t) {
  if (t === void 0 && (t = !1), S.has(e) && !t)
    return S.get(e);
  if (oe(e))
    return S.set(e, Y), Y;
  var r = getComputedStyle(e), n = P(e) && e.ownerSVGElement && e.getBBox(), i = !Te && r.boxSizing === "border-box", o = ye.test(r.writingMode || ""), s = !n && U.test(r.overflowY || ""), l = !n && U.test(r.overflowX || ""), c = n ? 0 : d(r.paddingTop), v = n ? 0 : d(r.paddingRight), h = n ? 0 : d(r.paddingBottom), f = n ? 0 : d(r.paddingLeft), w = n ? 0 : d(r.borderTopWidth), a = n ? 0 : d(r.borderRightWidth), u = n ? 0 : d(r.borderBottomWidth), m = n ? 0 : d(r.borderLeftWidth), p = f + v, x = c + h, O = m + a, D = w + u, G = l ? e.offsetHeight - D - e.clientHeight : 0, F = s ? e.offsetWidth - O - e.clientWidth : 0, le = i ? p + O : 0, de = i ? x + D : 0, T = n ? n.width : d(r.width) - le - F, B = n ? n.height : d(r.height) - de - G, fe = T + p + F + O, he = B + x + G + D, H = g({
    devicePixelContentBoxSize: z(Math.round(T * devicePixelRatio), Math.round(B * devicePixelRatio), o),
    borderBoxSize: z(fe, he, o),
    contentBoxSize: z(T, B, o),
    contentRect: new ie(f, c, T, B)
  });
  return S.set(e, H), H;
}, ae = function(e, t, r) {
  var n = se(e, r), i = n.borderBoxSize, o = n.contentBoxSize, s = n.devicePixelContentBoxSize;
  switch (t) {
    case y.DEVICE_PIXEL_CONTENT_BOX:
      return s;
    case y.BORDER_BOX:
      return i;
    default:
      return o;
  }
}, Be = /* @__PURE__ */ function() {
  function e(t) {
    var r = se(t);
    this.target = t, this.contentRect = r.contentRect, this.borderBoxSize = g([r.borderBoxSize]), this.contentBoxSize = g([r.contentBoxSize]), this.devicePixelContentBoxSize = g([r.devicePixelContentBoxSize]);
  }
  return e;
}(), ce = function(e) {
  if (oe(e))
    return 1 / 0;
  for (var t = 0, r = e.parentNode; r; )
    t += 1, r = r.parentNode;
  return t;
}, Se = function() {
  var e = 1 / 0, t = [];
  b.forEach(function(s) {
    if (s.activeTargets.length !== 0) {
      var l = [];
      s.activeTargets.forEach(function(v) {
        var h = new Be(v.target), f = ce(v.target);
        l.push(h), v.lastReportedSize = ae(v.target, v.observedBox), f < e && (e = f);
      }), t.push(function() {
        s.callback.call(s.observer, l, s.observer);
      }), s.activeTargets.splice(0, s.activeTargets.length);
    }
  });
  for (var r = 0, n = t; r < n.length; r++) {
    var i = n[r];
    i();
  }
  return e;
}, j = function(e) {
  b.forEach(function(r) {
    r.activeTargets.splice(0, r.activeTargets.length), r.skippedTargets.splice(0, r.skippedTargets.length), r.observationTargets.forEach(function(i) {
      i.isActive() && (ce(i.target) > e ? r.activeTargets.push(i) : r.skippedTargets.push(i));
    });
  });
}, _e = function() {
  var e = 0;
  for (j(e); ze(); )
    e = Se(), j(e);
  return Re() && we(), e > 0;
}, A, ve = [], Ce = function() {
  return ve.splice(0).forEach(function(e) {
    return e();
  });
}, Ne = function(e) {
  if (!A) {
    var t = 0, r = document.createTextNode(""), n = { characterData: !0 };
    new MutationObserver(function() {
      return Ce();
    }).observe(r, n), A = function() {
      r.textContent = "".concat(t ? t-- : t++);
    };
  }
  ve.push(e), A();
}, ke = function(e) {
  Ne(function() {
    requestAnimationFrame(e);
  });
}, N = 0, De = function() {
  return !!N;
}, Me = 250, Ae = { attributes: !0, characterData: !0, childList: !0, subtree: !0 }, K = [
  "resize",
  "load",
  "transitionend",
  "animationend",
  "animationstart",
  "animationiteration",
  "keyup",
  "keydown",
  "mouseup",
  "mousedown",
  "mouseover",
  "mouseout",
  "blur",
  "focus"
], Q = function(e) {
  return e === void 0 && (e = 0), Date.now() + e;
}, I = !1, Ie = function() {
  function e() {
    var t = this;
    this.stopped = !0, this.listener = function() {
      return t.schedule();
    };
  }
  return e.prototype.run = function(t) {
    var r = this;
    if (t === void 0 && (t = Me), !I) {
      I = !0;
      var n = Q(t);
      ke(function() {
        var i = !1;
        try {
          i = _e();
        } finally {
          if (I = !1, t = n - Q(), !De())
            return;
          i ? r.run(1e3) : t > 0 ? r.run(t) : r.start();
        }
      });
    }
  }, e.prototype.schedule = function() {
    this.stop(), this.run();
  }, e.prototype.observe = function() {
    var t = this, r = function() {
      return t.observer && t.observer.observe(document.body, Ae);
    };
    document.body ? r() : E.addEventListener("DOMContentLoaded", r);
  }, e.prototype.start = function() {
    var t = this;
    this.stopped && (this.stopped = !1, this.observer = new MutationObserver(this.listener), this.observe(), K.forEach(function(r) {
      return E.addEventListener(r, t.listener, !0);
    }));
  }, e.prototype.stop = function() {
    var t = this;
    this.stopped || (this.observer && this.observer.disconnect(), K.forEach(function(r) {
      return E.removeEventListener(r, t.listener, !0);
    }), this.stopped = !0);
  }, e;
}(), W = new Ie(), Z = function(e) {
  !N && e > 0 && W.start(), N += e, !N && W.stop();
}, Le = function(e) {
  return !P(e) && !Ee(e) && getComputedStyle(e).display === "inline";
}, We = function() {
  function e(t, r) {
    this.target = t, this.observedBox = r || y.CONTENT_BOX, this.lastReportedSize = {
      inlineSize: 0,
      blockSize: 0
    };
  }
  return e.prototype.isActive = function() {
    var t = ae(this.target, this.observedBox, !0);
    return Le(this.target) && (this.lastReportedSize = t), this.lastReportedSize.inlineSize !== t.inlineSize || this.lastReportedSize.blockSize !== t.blockSize;
  }, e;
}(), Pe = /* @__PURE__ */ function() {
  function e(t, r) {
    this.activeTargets = [], this.skippedTargets = [], this.observationTargets = [], this.observer = t, this.callback = r;
  }
  return e;
}(), _ = /* @__PURE__ */ new WeakMap(), ee = function(e, t) {
  for (var r = 0; r < e.length; r += 1)
    if (e[r].target === t)
      return r;
  return -1;
}, C = function() {
  function e() {
  }
  return e.connect = function(t, r) {
    var n = new Pe(t, r);
    _.set(t, n);
  }, e.observe = function(t, r, n) {
    var i = _.get(t), o = i.observationTargets.length === 0;
    ee(i.observationTargets, r) < 0 && (o && b.push(i), i.observationTargets.push(new We(r, n && n.box)), Z(1), W.schedule());
  }, e.unobserve = function(t, r) {
    var n = _.get(t), i = ee(n.observationTargets, r), o = n.observationTargets.length === 1;
    i >= 0 && (o && b.splice(b.indexOf(n), 1), n.observationTargets.splice(i, 1), Z(-1));
  }, e.disconnect = function(t) {
    var r = this, n = _.get(t);
    n.observationTargets.slice().forEach(function(i) {
      return r.unobserve(t, i.target);
    }), n.activeTargets.splice(0, n.activeTargets.length);
  }, e;
}(), Ge = function() {
  function e(t) {
    if (arguments.length === 0)
      throw new TypeError("Failed to construct 'ResizeObserver': 1 argument required, but only 0 present.");
    if (typeof t != "function")
      throw new TypeError("Failed to construct 'ResizeObserver': The callback provided as parameter 1 is not a function.");
    C.connect(this, t);
  }
  return e.prototype.observe = function(t, r) {
    if (arguments.length === 0)
      throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': 1 argument required, but only 0 present.");
    if (!J(t))
      throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': parameter 1 is not of type 'Element");
    C.observe(this, t, r);
  }, e.prototype.unobserve = function(t) {
    if (arguments.length === 0)
      throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': 1 argument required, but only 0 present.");
    if (!J(t))
      throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': parameter 1 is not of type 'Element");
    C.unobserve(this, t);
  }, e.prototype.disconnect = function() {
    C.disconnect(this);
  }, e.toString = function() {
    return "function ResizeObserver () { [polyfill code] }";
  }, e;
}();
const Fe = (e, t, r) => Math.min(Math.max(e, t), r), He = "_root_ce14e_2", Ve = "_list_ce14e_14", ue = {
  root: He,
  list: Ve,
  "start-gradient": "_start-gradient_ce14e_24",
  "end-gradient": "_end-gradient_ce14e_28",
  "item-wrapper": "_item-wrapper_ce14e_39",
  "item-content": "_item-content_ce14e_44",
  "item-separator": "_item-separator_ce14e_58"
}, L = ne(ue), Xe = re(
  ({ children: e, "data-testid": t, isActive: r, separator: n, ...i }, o) => {
    const s = i.href || i.to;
    return /* @__PURE__ */ te("li", { "aria-label": "breadcrumb", className: L("item-wrapper"), "data-testid": t, children: [
      n ? /* @__PURE__ */ R("span", { className: L("item-separator"), role: "presentation", children: n }) : null,
      /* @__PURE__ */ R(
        "a",
        {
          "aria-current": r ? "page" : void 0,
          "aria-disabled": !s,
          ...i,
          className: L("item-content", i.className),
          ref: o,
          children: e
        }
      )
    ] });
  }
), k = ne(ue), qe = re(
  ({ children: e, lastChildNotClickable: t = !0, separator: r = /* @__PURE__ */ R(me, { size: "xs" }), ...n }, i) => {
    const o = pe.toArray(e).filter(Boolean), s = o.length, l = o.map((w, a) => {
      const u = s === 1 || s === a + 1;
      return be(w, {
        isActive: u && t,
        key: `breadcrumb-${a}`,
        separator: u ? void 0 : r,
        ...w.props
      });
    }), { endGradient: c, listRef: v, onListScroll: h, startGradient: f } = $e();
    return /* @__PURE__ */ te("nav", { ref: i, ...n, className: k("root", n.className), children: [
      f,
      /* @__PURE__ */ R("ol", { className: k("list"), dir: "rtl", onScroll: h, ref: v, children: l.reverse() }),
      c
    ] });
  }
), Ze = Object.assign(qe, {
  Item: Xe
}), $e = () => {
  const e = M(null), t = M(), r = M(), [n, i] = V(!1), [o, s] = V(0), l = (a, u) => {
    a && (a.style.transform = `scale3d(${u}, 1, 1)`);
  }, c = X((a) => {
    const u = 1 - a;
    l(t.current, u), l(r.current, a);
  }, []), v = X(() => {
    const {
      current: { offsetWidth: a, scrollLeft: u, scrollWidth: m }
    } = e, p = m - a, O = Fe(Math.abs(u - o), 0, p) / p;
    c(O);
  }, [o, c]), h = ge(
    () => xe(
      (a) => {
        const [
          {
            // Is offsetWidth really needed ?
            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
            // @ts-ignore
            target: { offsetWidth: u, scrollLeft: m, scrollWidth: p }
          }
        ] = a, x = p - u;
        o || s(m === 0 ? 0 : x), i(x > 0);
      },
      300,
      !1
    ),
    [o]
  );
  q(() => {
    const a = new Ge(h);
    return a.observe(e.current), () => a.disconnect();
  }, []), q(() => {
    t.current && r.current && c(0);
  }, [n, c]);
  const f = n ? /* @__PURE__ */ R(
    "span",
    {
      className: k("start-gradient", "bg-linear-to-r  from-neutral-10 to-transparent"),
      ref: t
    }
  ) : null;
  return { endGradient: n ? /* @__PURE__ */ R(
    "span",
    {
      className: k("end-gradient", "bg-linear-to-l from-neutral-10 to-transparent"),
      ref: r
    }
  ) : null, listRef: e, onListScroll: v, startGradient: f };
};
export {
  Ze as Breadcrumb,
  qe as BreadcrumbComponent
};