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 he, Children as pe, cloneElement as be, useRef as A, 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 re } from "./index-PAaZGbyz.js";
import { t as xe } from "./throttle-BDBzFeFj.js";
import { f as ze } from "./forwardRefWithAs-8eP3ZN15.js";
var b = [], Re = function() {
  return b.some(function(e) {
    return e.activeTargets.length > 0;
  });
}, we = function() {
  return b.some(function(e) {
    return e.skippedTargets.length > 0;
  });
}, $ = "ResizeObserver loop completed with undelivered notifications.", Oe = 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);
}, Ee = /* @__PURE__ */ function() {
  function e(t, r) {
    this.inlineSize = t, this.blockSize = r, g(this);
  }
  return e;
}(), ne = 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, c = t.left, v = t.width, u = t.height;
    return { x: r, y: n, top: i, right: o, bottom: s, left: c, width: v, height: u };
  }, 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;
}, ie = 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);
}, ye = 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/, Te = /^tb|vertical/, Be = /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 Ee((r ? t : e) || 0, (r ? e : t) || 0);
}, Y = g({
  devicePixelContentBoxSize: z(),
  borderBoxSize: z(),
  contentBoxSize: z(),
  contentRect: new ne(0, 0, 0, 0)
}), oe = function(e, t) {
  if (t === void 0 && (t = !1), S.has(e) && !t)
    return S.get(e);
  if (ie(e))
    return S.set(e, Y), Y;
  var r = getComputedStyle(e), n = P(e) && e.ownerSVGElement && e.getBBox(), i = !Be && r.boxSizing === "border-box", o = Te.test(r.writingMode || ""), s = !n && U.test(r.overflowY || ""), c = !n && U.test(r.overflowX || ""), v = n ? 0 : d(r.paddingTop), u = 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), l = n ? 0 : d(r.borderBottomWidth), m = n ? 0 : d(r.borderLeftWidth), p = f + u, x = v + h, O = m + a, D = w + l, G = c ? e.offsetHeight - D - e.clientHeight : 0, F = s ? e.offsetWidth - O - e.clientWidth : 0, ue = i ? p + O : 0, le = i ? x + D : 0, T = n ? n.width : d(r.width) - ue - F, B = n ? n.height : d(r.height) - le - G, de = T + p + F + O, fe = B + x + G + D, H = g({
    devicePixelContentBoxSize: z(Math.round(T * devicePixelRatio), Math.round(B * devicePixelRatio), o),
    borderBoxSize: z(de, fe, o),
    contentBoxSize: z(T, B, o),
    contentRect: new ne(f, v, T, B)
  });
  return S.set(e, H), H;
}, se = function(e, t, r) {
  var n = oe(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;
  }
}, Se = /* @__PURE__ */ function() {
  function e(t) {
    var r = oe(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;
}(), ae = function(e) {
  if (ie(e))
    return 1 / 0;
  for (var t = 0, r = e.parentNode; r; )
    t += 1, r = r.parentNode;
  return t;
}, _e = function() {
  var e = 1 / 0, t = [];
  b.forEach(function(s) {
    if (s.activeTargets.length !== 0) {
      var c = [];
      s.activeTargets.forEach(function(u) {
        var h = new Se(u.target), f = ae(u.target);
        c.push(h), u.lastReportedSize = se(u.target, u.observedBox), f < e && (e = f);
      }), t.push(function() {
        s.callback.call(s.observer, c, 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() && (ae(i.target) > e ? r.activeTargets.push(i) : r.skippedTargets.push(i));
    });
  });
}, Ce = function() {
  var e = 0;
  for (j(e); Re(); )
    e = _e(), j(e);
  return we() && Oe(), e > 0;
}, M, ce = [], Ne = function() {
  return ce.splice(0).forEach(function(e) {
    return e();
  });
}, ke = function(e) {
  if (!M) {
    var t = 0, r = document.createTextNode(""), n = { characterData: !0 };
    new MutationObserver(function() {
      return Ne();
    }).observe(r, n), M = function() {
      r.textContent = "".concat(t ? t-- : t++);
    };
  }
  ce.push(e), M();
}, De = function(e) {
  ke(function() {
    requestAnimationFrame(e);
  });
}, N = 0, Ae = function() {
  return !!N;
}, Me = 250, Ie = { 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, Le = 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);
      De(function() {
        var i = !1;
        try {
          i = Ce();
        } finally {
          if (I = !1, t = n - Q(), !Ae())
            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, Ie);
    };
    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 Le(), Z = function(e) {
  !N && e > 0 && W.start(), N += e, !N && W.stop();
}, We = function(e) {
  return !P(e) && !ye(e) && getComputedStyle(e).display === "inline";
}, Pe = 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 = se(this.target, this.observedBox, !0);
    return We(this.target) && (this.lastReportedSize = t), this.lastReportedSize.inlineSize !== t.inlineSize || this.lastReportedSize.blockSize !== t.blockSize;
  }, e;
}(), Ge = /* @__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 Ge(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 Pe(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;
}(), Fe = 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 He = (e, t, r) => Math.min(Math.max(e, t), r), Ve = "_root_ce14e_2", Xe = "_list_ce14e_14", ve = {
  root: Ve,
  list: Xe,
  "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 = re(ve), qe = ze(
  ({ as: e = "a", children: t, "data-testid": r, isActive: n, separator: i, ...o }, s) => {
    const c = o.href || o.to;
    return /* @__PURE__ */ te("li", { "aria-label": "breadcrumb", className: L("item-wrapper"), "data-testid": r, children: [
      i ? /* @__PURE__ */ R("span", { className: L("item-separator"), role: "presentation", children: i }) : null,
      /* @__PURE__ */ R(
        e,
        {
          "aria-current": n ? "page" : void 0,
          "aria-disabled": !c,
          ...o,
          className: L("item-content", o.className),
          ref: s,
          children: t
        }
      )
    ] });
  }
), k = re(ve), $e = he(
  ({ children: e, lastChildNotClickable: t = !0, separator: r = /* @__PURE__ */ R(me, { size: "xs" }), ...n }, i) => {
    const o = pe.toArray(e).filter(Boolean), s = o.length, c = o.map((w, a) => {
      const l = s === 1 || s === a + 1;
      return be(w, {
        isActive: l && t,
        key: `breadcrumb-${a}`,
        separator: l ? void 0 : r,
        ...w.props
      });
    }), { endGradient: v, listRef: u, onListScroll: h, startGradient: f } = Je();
    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: u, children: c.reverse() }),
      v
    ] });
  }
), tt = Object.assign($e, {
  Item: qe
}), Je = () => {
  const e = A(null), t = A(), r = A(), [n, i] = V(!1), [o, s] = V(0), c = (a, l) => {
    a && (a.style.transform = `scale3d(${l}, 1, 1)`);
  }, v = X((a) => {
    const l = 1 - a;
    c(t.current, l), c(r.current, a);
  }, []), u = X(() => {
    const {
      current: { offsetWidth: a, scrollLeft: l, scrollWidth: m }
    } = e, p = m - a, O = He(Math.abs(l - o), 0, p) / p;
    v(O);
  }, [o, v]), h = ge(
    () => xe(
      (a) => {
        const [
          {
            // Is offsetWidth really needed ?
            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
            // @ts-ignore
            target: { offsetWidth: l, scrollLeft: m, scrollWidth: p }
          }
        ] = a, x = p - l;
        o || s(m === 0 ? 0 : x), i(x > 0);
      },
      300,
      !1
    ),
    [o]
  );
  q(() => {
    const a = new Fe(h);
    return a.observe(e.current), () => a.disconnect();
  }, []), q(() => {
    t.current && r.current && v(0);
  }, [n, v]);
  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: u, startGradient: f };
};
export {
  tt as Breadcrumb,
  $e as BreadcrumbComponent
};