rich-react-component 0.2.0 → 0.3.1

package/dist/index.js

@@ -1,141 +1,141 @@
-import { jsxs as p, jsx as a, Fragment as H } from "react/jsx-runtime";
-import { useRef as O, useState as M, useCallback as A, useId as F, useEffect as _, createContext as he, useMemo as ne, useContext as be } from "react";
-function f(...e) {
+import { jsxs as y, jsx as o, Fragment as Q } from "react/jsx-runtime";
+import { useRef as L, useState as M, useCallback as F, useId as W, useEffect as U, createContext as Ve, useMemo as J, useContext as we, useLayoutEffect as _r } from "react";
+function h(...e) {
   return e.filter(Boolean).join(" ");
 }
-function $e({ htmlFor: e, required: n, className: t, children: r }) {
-  return /* @__PURE__ */ p("label", { htmlFor: e, className: f("form-label", t), children: [
-    r,
-    n && /* @__PURE__ */ a("span", { className: "text-danger", children: " *" })
+function xr({ htmlFor: e, required: r, className: n, children: t }) {
+  return /* @__PURE__ */ y("label", { htmlFor: e, className: h("form-label", "rrc-label", n), children: [
+    t,
+    r && /* @__PURE__ */ o("span", { className: "text-danger", children: " *" })
   ] });
 }
-function pe({ error: e, helpText: n, className: t }) {
-  return e ? /* @__PURE__ */ a("div", { className: f("invalid-feedback d-block", t), children: e }) : n ? /* @__PURE__ */ a("div", { className: f("form-text", t), children: n }) : null;
+function er({ error: e, helpText: r, className: n }) {
+  return e ? /* @__PURE__ */ o("div", { className: h("invalid-feedback d-block", "rrc-field__error", n), children: e }) : r ? /* @__PURE__ */ o("div", { className: h("form-text", "rrc-field__help", n), children: r }) : null;
 }
-function B({ id: e, label: n, required: t, error: r, helpText: l, className: i, children: o }) {
-  return /* @__PURE__ */ p("div", { className: f("mb-3", i), children: [
-    n && /* @__PURE__ */ a($e, { htmlFor: e, required: t, children: n }),
-    o,
-    /* @__PURE__ */ a(pe, { error: r, helpText: l })
+function Y({ id: e, label: r, required: n, error: t, helpText: a, className: i, children: l }) {
+  return /* @__PURE__ */ y("div", { className: h("mb-3", "rrc-field", i), children: [
+    r && /* @__PURE__ */ o(xr, { htmlFor: e, required: n, children: r }),
+    l,
+    /* @__PURE__ */ o(er, { error: t, helpText: a })
   ] });
 }
 function T({
   value: e,
-  defaultValue: n,
-  onChange: t
+  defaultValue: r,
+  onChange: n
 }) {
-  const r = e !== void 0, l = O(r);
-  process.env.NODE_ENV !== "production" && l.current !== r && console.error(
+  const t = e !== void 0, a = L(t);
+  process.env.NODE_ENV !== "production" && a.current !== t && console.error(
     "[react-components] A component switched between controlled and uncontrolled `value`. Decide between passing `value` (controlled) or `defaultValue` (uncontrolled) for the lifetime of the component, per the library's controlled/uncontrolled policy."
   );
-  const [i, o] = M(n), c = r ? e : i, s = A(
+  const [i, l] = M(r), c = t ? e : i, s = F(
     (d) => {
-      r || o(d), t == null || t(d);
+      t || l(d), n == null || n(d);
     },
-    [r, t]
+    [t, n]
   );
   return [c, s];
 }
-function Z(e) {
+function de(e) {
   const {
-    id: n,
-    name: t,
-    disabled: r,
-    readOnly: l,
+    id: r,
+    name: n,
+    disabled: t,
+    readOnly: a,
     required: i,
-    className: o,
+    className: l,
     label: c,
     placeholder: s,
     helpText: d,
     error: u,
-    value: h,
+    value: f,
     defaultValue: m,
-    onChange: v,
-    onBlur: g,
-    type: w = "text",
-    maxLength: k,
-    autoFocus: y,
-    inputProps: S,
-    endAdornment: x
-  } = e, [I, b] = T({
-    value: h,
+    onChange: p,
+    onBlur: k,
+    type: S = "text",
+    maxLength: x,
+    autoFocus: _,
+    inputProps: C,
+    endAdornment: v
+  } = e, [N, b] = T({
+    value: f,
     defaultValue: m ?? "",
-    onChange: v
-  }), N = F(), C = n ?? N, D = /* @__PURE__ */ a(
+    onChange: p
+  }), w = W(), g = r ?? w, I = /* @__PURE__ */ o(
     "input",
     {
-      id: C,
-      name: t,
-      className: f("form-control", u && "is-invalid"),
-      disabled: r,
-      readOnly: l,
+      id: g,
+      name: n,
+      className: h("form-control", "rrc-input", u && "is-invalid"),
+      disabled: t,
+      readOnly: a,
       required: i,
       placeholder: s,
-      maxLength: k,
-      autoFocus: y,
-      value: I,
-      onChange: ($) => b($.target.value),
-      onBlur: g,
-      type: w,
-      ...S
+      maxLength: x,
+      autoFocus: _,
+      value: N,
+      onChange: (D) => b(D.target.value),
+      onBlur: k,
+      type: S,
+      ...C
     }
   );
-  return /* @__PURE__ */ a(B, { id: C, label: c, required: i, error: u, helpText: d, className: o, children: x ? /* @__PURE__ */ p("div", { className: "input-group", children: [
-    D,
-    x
-  ] }) : D });
+  return /* @__PURE__ */ o(Y, { id: g, label: c, required: i, error: u, helpText: d, className: l, children: v ? /* @__PURE__ */ y("div", { className: "input-group rrc-input-group", children: [
+    I,
+    v
+  ] }) : I });
 }
-function Kn(e) {
+function nt(e) {
   const {
-    id: n,
-    name: t,
-    disabled: r,
-    readOnly: l,
+    id: r,
+    name: n,
+    disabled: t,
+    readOnly: a,
     required: i,
-    className: o,
+    className: l,
     label: c,
     placeholder: s,
     helpText: d,
     error: u,
-    value: h,
+    value: f,
     defaultValue: m,
-    onChange: v,
-    onBlur: g,
-    rows: w = 3,
-    maxLength: k
-  } = e, [y, S] = T({
-    value: h,
+    onChange: p,
+    onBlur: k,
+    rows: S = 3,
+    maxLength: x
+  } = e, [_, C] = T({
+    value: f,
     defaultValue: m ?? "",
-    onChange: v
-  }), x = F(), I = n ?? x;
-  return /* @__PURE__ */ a(B, { id: I, label: c, required: i, error: u, helpText: d, className: o, children: /* @__PURE__ */ a(
+    onChange: p
+  }), v = W(), N = r ?? v;
+  return /* @__PURE__ */ o(Y, { id: N, label: c, required: i, error: u, helpText: d, className: l, children: /* @__PURE__ */ o(
     "textarea",
     {
-      id: I,
-      name: t,
-      className: f("form-control", u && "is-invalid"),
-      disabled: r,
-      readOnly: l,
+      id: N,
+      name: n,
+      className: h("form-control", "rrc-input", u && "is-invalid"),
+      disabled: t,
+      readOnly: a,
       required: i,
       placeholder: s,
-      rows: w,
-      maxLength: k,
-      value: y,
-      onChange: (b) => S(b.target.value),
-      onBlur: g
+      rows: S,
+      maxLength: x,
+      value: _,
+      onChange: (b) => C(b.target.value),
+      onBlur: k
     }
   ) });
 }
-function Bn({ value: e, defaultValue: n, onChange: t, min: r, max: l, step: i, ...o }) {
+function tt({ value: e, defaultValue: r, onChange: n, min: t, max: a, step: i, ...l }) {
   const [c, s] = T({
     value: e,
-    defaultValue: n ?? null,
-    onChange: t
+    defaultValue: r ?? null,
+    onChange: n
   });
-  return /* @__PURE__ */ a(
-    Z,
+  return /* @__PURE__ */ o(
+    de,
     {
-      ...o,
+      ...l,
       value: c === null ? "" : String(c),
       onChange: (d) => {
         if (d.trim() === "") {
@@ -145,90 +145,90 @@ function Bn({ value: e, defaultValue: n, onChange: t, min: r, max: l, step: i, .
         const u = Number(d);
         Number.isNaN(u) || s(u);
       },
-      inputProps: { inputMode: "decimal", min: r, max: l, step: i }
+      inputProps: { inputMode: "decimal", min: t, max: a, step: i }
     }
   );
 }
-function jn(e) {
-  const [n, t] = M(!1);
-  return /* @__PURE__ */ a(
-    Z,
+function at(e) {
+  const [r, n] = M(!1);
+  return /* @__PURE__ */ o(
+    de,
     {
       ...e,
-      inputProps: { type: n ? "text" : "password", autoComplete: "current-password" },
-      endAdornment: /* @__PURE__ */ a(
+      inputProps: { type: r ? "text" : "password", autoComplete: "current-password" },
+      endAdornment: /* @__PURE__ */ o(
         "button",
         {
           type: "button",
-          className: "btn btn-outline-secondary",
-          "aria-label": n ? "Hide password" : "Show password",
-          "aria-pressed": n,
-          onClick: () => t((r) => !r),
-          children: n ? "Hide" : "Show"
+          className: "btn btn-outline-secondary rrc-btn rrc-input-group__action",
+          "aria-label": r ? "Hide password" : "Show password",
+          "aria-pressed": r,
+          onClick: () => n((t) => !t),
+          children: r ? "Hide" : "Show"
         }
       )
     }
   );
 }
-function Hn({ id: e, name: n, disabled: t, required: r, className: l, label: i, helpText: o, error: c, accept: s, multiple: d, onChange: u }) {
-  const h = F(), m = e ?? h;
-  return /* @__PURE__ */ a(B, { id: m, label: i, required: r, error: c, helpText: o, className: l, children: /* @__PURE__ */ a(
+function ot({ id: e, name: r, disabled: n, required: t, className: a, label: i, helpText: l, error: c, accept: s, multiple: d, onChange: u }) {
+  const f = W(), m = e ?? f;
+  return /* @__PURE__ */ o(Y, { id: m, label: i, required: t, error: c, helpText: l, className: a, children: /* @__PURE__ */ o(
     "input",
     {
       id: m,
-      name: n,
+      name: r,
       type: "file",
-      className: f("form-control", c && "is-invalid"),
-      disabled: t,
-      required: r,
+      className: h("form-control", "rrc-input", c && "is-invalid"),
+      disabled: n,
+      required: t,
       accept: s,
       multiple: d,
-      onChange: (v) => u == null ? void 0 : u(v.target.files)
+      onChange: (p) => u == null ? void 0 : u(p.target.files)
     }
   ) });
 }
-function ve({
+function rr({
   id: e,
-  name: n,
-  disabled: t,
-  required: r,
-  wrapperClassName: l,
+  name: r,
+  disabled: n,
+  required: t,
+  wrapperClassName: a,
   role: i,
-  label: o,
+  label: l,
   helpText: c,
   error: s,
   checked: d,
   onChange: u,
-  className: h
+  className: f
 }) {
-  const m = F(), v = e ?? m;
-  return /* @__PURE__ */ p("div", { className: f(l, h), children: [
-    /* @__PURE__ */ a(
+  const m = W(), p = e ?? m;
+  return /* @__PURE__ */ y("div", { className: h(a, f), children: [
+    /* @__PURE__ */ o(
       "input",
       {
-        id: v,
-        name: n,
+        id: p,
+        name: r,
         type: "checkbox",
         role: i,
-        className: f("form-check-input", s && "is-invalid"),
-        disabled: t,
-        required: r,
+        className: h("form-check-input", "rrc-check", s && "is-invalid"),
+        disabled: n,
+        required: t,
         checked: d,
-        onChange: (g) => u(g.target.checked)
+        onChange: (k) => u(k.target.checked)
       }
     ),
-    o && /* @__PURE__ */ a("label", { htmlFor: v, className: "form-check-label", children: o }),
-    /* @__PURE__ */ a(pe, { error: s, helpText: c })
+    l && /* @__PURE__ */ o("label", { htmlFor: p, className: "form-check-label rrc-check__label", children: l }),
+    /* @__PURE__ */ o(er, { error: s, helpText: c })
   ] });
 }
-function _n(e) {
-  const [n, t] = T({
+function it(e) {
+  const [r, n] = T({
     value: e.checked,
     defaultValue: e.defaultChecked ?? !1,
     onChange: e.onChange
   });
-  return /* @__PURE__ */ a(
-    ve,
+  return /* @__PURE__ */ o(
+    rr,
     {
       id: e.id,
       name: e.name,
@@ -239,19 +239,19 @@ function _n(e) {
       label: e.label,
       helpText: e.helpText,
       error: e.error,
-      checked: n,
-      onChange: t
+      checked: r,
+      onChange: n
     }
   );
 }
-function Un(e) {
-  const [n, t] = T({
+function lt(e) {
+  const [r, n] = T({
     value: e.checked,
     defaultValue: e.defaultChecked ?? !1,
     onChange: e.onChange
   });
-  return /* @__PURE__ */ a(
-    ve,
+  return /* @__PURE__ */ o(
+    rr,
     {
       id: e.id,
       name: e.name,
@@ -263,158 +263,158 @@ function Un(e) {
       label: e.label,
       helpText: e.helpText,
       error: e.error,
-      checked: n,
-      onChange: t
+      checked: r,
+      onChange: n
     }
   );
 }
-function Te({
+function Sr({
   id: e,
-  name: n,
-  value: t,
-  label: r,
-  checked: l,
+  name: r,
+  value: n,
+  label: t,
+  checked: a,
   disabled: i,
-  className: o,
+  className: l,
   onChange: c
 }) {
-  const s = F(), d = e ?? s;
-  return /* @__PURE__ */ p("div", { className: f("form-check", o), children: [
-    /* @__PURE__ */ a(
+  const s = W(), d = e ?? s;
+  return /* @__PURE__ */ y("div", { className: h("form-check", "rrc-check-row", l), children: [
+    /* @__PURE__ */ o(
       "input",
       {
         id: d,
-        name: n,
+        name: r,
         type: "radio",
-        className: "form-check-input",
-        value: String(t),
-        checked: l,
+        className: "form-check-input rrc-check",
+        value: String(n),
+        checked: a,
         disabled: i,
-        onChange: () => c == null ? void 0 : c(t)
+        onChange: () => c == null ? void 0 : c(n)
       }
     ),
-    r && /* @__PURE__ */ a("label", { htmlFor: d, className: "form-check-label", children: r })
+    t && /* @__PURE__ */ o("label", { htmlFor: d, className: "form-check-label rrc-check__label", children: t })
   ] });
 }
-function qn({
+function st({
   options: e,
-  value: n,
-  defaultValue: t,
-  onChange: r,
-  inline: l,
+  value: r,
+  defaultValue: n,
+  onChange: t,
+  inline: a,
   id: i,
-  name: o,
+  name: l,
   disabled: c,
   required: s,
   className: d,
   label: u,
-  helpText: h,
+  helpText: f,
   error: m
 }) {
-  const [v, g] = T({
-    value: n,
-    defaultValue: t ?? null,
-    onChange: (y) => {
-      y !== null && (r == null || r(y));
+  const [p, k] = T({
+    value: r,
+    defaultValue: n ?? null,
+    onChange: (_) => {
+      _ !== null && (t == null || t(_));
     }
-  }), w = F(), k = o ?? i ?? w;
-  return /* @__PURE__ */ a(B, { label: u, required: s, error: m, helpText: h, className: d, children: /* @__PURE__ */ a("div", { role: "radiogroup", "aria-label": u, "aria-required": s, className: f(l && "d-flex gap-3"), children: e.map((y) => /* @__PURE__ */ a(
-    Te,
+  }), S = W(), x = l ?? i ?? S;
+  return /* @__PURE__ */ o(Y, { label: u, required: s, error: m, helpText: f, className: d, children: /* @__PURE__ */ o("div", { role: "radiogroup", "aria-label": u, "aria-required": s, className: h("rrc-radio-group", a && "d-flex gap-3 rrc-radio-group--inline"), children: e.map((_) => /* @__PURE__ */ o(
+    Sr,
     {
-      name: k,
-      value: y.value,
-      label: y.label,
-      checked: y.value === v,
-      disabled: c || y.disabled,
-      onChange: (S) => g(S)
+      name: x,
+      value: _.value,
+      label: _.label,
+      checked: _.value === p,
+      disabled: c || _.disabled,
+      onChange: (C) => k(C)
     },
-    String(y.value)
+    String(_.value)
   )) }) });
 }
-function Ee({
+function Cr({
   options: e,
-  value: n,
-  defaultValue: t,
-  onChange: r,
-  placeholder: l,
+  value: r,
+  defaultValue: n,
+  onChange: t,
+  placeholder: a,
   loading: i,
-  id: o,
+  id: l,
   name: c,
   disabled: s,
   readOnly: d,
   required: u,
-  className: h,
+  className: f,
   label: m,
-  helpText: v,
-  error: g
+  helpText: p,
+  error: k
 }) {
-  const [w, k] = T({
-    value: n,
-    defaultValue: t ?? null,
-    onChange: r
-  }), y = F(), S = o ?? y;
-  return /* @__PURE__ */ a(B, { id: S, label: m, required: u, error: g, helpText: v, className: h, children: /* @__PURE__ */ p(
+  const [S, x] = T({
+    value: r,
+    defaultValue: n ?? null,
+    onChange: t
+  }), _ = W(), C = l ?? _;
+  return /* @__PURE__ */ o(Y, { id: C, label: m, required: u, error: k, helpText: p, className: f, children: /* @__PURE__ */ y(
     "select",
     {
-      id: S,
+      id: C,
       name: c,
-      className: f("form-select", g && "is-invalid"),
+      className: h("form-select", "rrc-select", k && "is-invalid"),
       disabled: s || d || i,
       required: u,
-      value: w === null ? "" : String(w),
-      onChange: (x) => {
-        const I = x.target.value;
-        if (I === "") {
-          k(null);
+      value: S === null ? "" : String(S),
+      onChange: (v) => {
+        const N = v.target.value;
+        if (N === "") {
+          x(null);
           return;
         }
-        const b = e.find((N) => String(N.value) === I);
-        k(b ? b.value : null);
+        const b = e.find((w) => String(w.value) === N);
+        x(b ? b.value : null);
       },
       children: [
-        i && /* @__PURE__ */ a("option", { value: "", children: "Loading…" }),
-        !i && l && /* @__PURE__ */ a("option", { value: "", children: l }),
-        e.map((x) => /* @__PURE__ */ a("option", { value: String(x.value), disabled: x.disabled, children: x.label }, String(x.value)))
+        i && /* @__PURE__ */ o("option", { value: "", children: "Loading…" }),
+        !i && a && /* @__PURE__ */ o("option", { value: "", children: a }),
+        e.map((v) => /* @__PURE__ */ o("option", { value: String(v.value), disabled: v.disabled, children: v.label }, String(v.value)))
       ]
     }
   ) });
 }
-function ie(e, n) {
-  _(() => {
+function _e(e, r) {
+  U(() => {
     if (!e)
       return;
-    function t(r) {
-      r.key === "Escape" && n();
+    function n(t) {
+      t.key === "Escape" && r();
     }
-    return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
-  }, [e, n]);
+    return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
+  }, [e, r]);
 }
-function W({ open: e, onClose: n, anchorRef: t, className: r, role: l, children: i }) {
-  const o = O(null);
-  return ie(e, n), _(() => {
+function oe({ open: e, onClose: r, anchorRef: n, className: t, role: a, children: i }) {
+  const l = L(null);
+  return _e(e, r), U(() => {
     if (!e)
       return;
     function c(s) {
-      var u, h;
+      var u, f;
       const d = s.target;
-      (u = o.current) != null && u.contains(d) || (h = t.current) != null && h.contains(d) || n();
+      (u = l.current) != null && u.contains(d) || (f = n.current) != null && f.contains(d) || r();
     }
     return document.addEventListener("mousedown", c), () => document.removeEventListener("mousedown", c);
-  }, [e, n, t]), e ? /* @__PURE__ */ a("div", { ref: o, className: f("show", r), role: l, children: i }) : null;
+  }, [e, r, n]), e ? /* @__PURE__ */ o("div", { ref: l, className: h("show", "rrc-popup", t), role: a, children: i }) : null;
 }
-function re({
+function xe({
   itemCount: e,
-  isOpen: n,
-  onSelect: t,
-  onClose: r
+  isOpen: r,
+  onSelect: n,
+  onClose: t
 }) {
-  const [l, i] = M(-1);
-  _(() => {
-    n || i(-1);
-  }, [n]), ie(n, r);
-  const o = A(
+  const [a, i] = M(-1);
+  U(() => {
+    r || i(-1);
+  }, [r]), _e(r, t);
+  const l = F(
     (c) => {
-      if (!n) {
+      if (!r) {
         (c.key === "ArrowDown" || c.key === "Enter") && c.preventDefault();
         return;
       }
@@ -432,690 +432,706 @@ function re({
           c.preventDefault(), i(e === 0 ? -1 : e - 1);
           break;
         case "Enter":
-          l >= 0 && (c.preventDefault(), t(l));
+          a >= 0 && (c.preventDefault(), n(a));
           break;
       }
     },
-    [n, e, l, t]
+    [r, e, a, n]
   );
-  return { activeIndex: l, setActiveIndex: i, handleKeyDown: o };
+  return { activeIndex: a, setActiveIndex: i, handleKeyDown: l };
 }
-function Me({
+function Ir({
   options: e,
-  values: n,
-  defaultValues: t,
-  onChange: r,
-  loading: l,
+  values: r,
+  defaultValues: n,
+  onChange: t,
+  loading: a,
   emptyText: i = "No options",
-  id: o,
+  id: l,
   name: c,
   disabled: s,
   readOnly: d,
   required: u,
-  className: h,
+  className: f,
   label: m,
-  placeholder: v = "Select...",
-  helpText: g,
-  error: w
+  placeholder: p = "Select...",
+  helpText: k,
+  error: S
 }) {
-  const [k, y] = T({
-    value: n,
-    defaultValue: t ?? [],
-    onChange: r
-  }), [S, x] = M(!1), I = O(null), b = F(), N = o ?? b, C = new Set(k), D = A(() => x(!1), []), $ = A(
-    (V) => {
-      const K = e[V];
-      if (!K || K.disabled)
+  const [x, _] = T({
+    value: r,
+    defaultValue: n ?? [],
+    onChange: t
+  }), [C, v] = M(!1), N = L(null), b = W(), w = l ?? b, g = new Set(x), I = F(() => v(!1), []), D = F(
+    (A) => {
+      const H = e[A];
+      if (!H || H.disabled)
         return;
-      const J = C.has(K.value) ? k.filter((ae) => ae !== K.value) : [...k, K.value];
-      y(J);
+      const R = g.has(H.value) ? x.filter((Z) => Z !== H.value) : [...x, H.value];
+      _(R);
     },
-    [e, k, C, y]
-  ), { activeIndex: E, setActiveIndex: U, handleKeyDown: G } = re({
+    [e, x, g, _]
+  ), { activeIndex: O, setActiveIndex: q, handleKeyDown: G } = xe({
     itemCount: e.length,
-    isOpen: S,
-    onSelect: $,
-    onClose: D
-  }), R = e.filter((V) => C.has(V.value)).map((V) => V.label).join(", ");
-  return /* @__PURE__ */ a(B, { id: N, label: m, required: u, error: w, helpText: g, className: h, children: /* @__PURE__ */ p("div", { className: "position-relative", children: [
-    /* @__PURE__ */ a(
+    isOpen: C,
+    onSelect: D,
+    onClose: I
+  }), V = e.filter((A) => g.has(A.value)).map((A) => A.label).join(", ");
+  return /* @__PURE__ */ o(Y, { id: w, label: m, required: u, error: S, helpText: k, className: f, children: /* @__PURE__ */ y("div", { className: "position-relative", children: [
+    /* @__PURE__ */ o(
       "button",
       {
-        ref: I,
-        id: N,
+        ref: N,
+        id: w,
         type: "button",
         name: c,
-        className: f("form-select text-start", w && "is-invalid"),
+        className: h("form-select text-start", "rrc-select", "rrc-select__trigger", S && "is-invalid"),
         disabled: s || d,
         "aria-haspopup": "listbox",
-        "aria-expanded": S,
-        onClick: () => x((V) => !V),
+        "aria-expanded": C,
+        onClick: () => v((A) => !A),
         onKeyDown: G,
-        children: R || /* @__PURE__ */ a("span", { className: "text-body-secondary", children: v })
+        children: V || /* @__PURE__ */ o("span", { className: "text-body-secondary", children: p })
       }
     ),
-    /* @__PURE__ */ a(W, { open: S, onClose: D, anchorRef: I, className: "dropdown-menu w-100", role: "listbox", children: l ? /* @__PURE__ */ a("div", { className: "px-3 py-2 text-body-secondary", children: "Loading…" }) : e.length === 0 ? /* @__PURE__ */ a("div", { className: "px-3 py-2 text-body-secondary", children: i }) : e.map((V, K) => /* @__PURE__ */ p(
+    /* @__PURE__ */ o(oe, { open: C, onClose: I, anchorRef: N, className: "dropdown-menu w-100 rrc-menu rrc-select__menu", role: "listbox", children: a ? /* @__PURE__ */ o("div", { className: "px-3 py-2 text-body-secondary", children: "Loading…" }) : e.length === 0 ? /* @__PURE__ */ o("div", { className: "px-3 py-2 text-body-secondary", children: i }) : e.map((A, H) => /* @__PURE__ */ y(
       "div",
       {
         role: "option",
-        "aria-selected": C.has(V.value),
-        className: f(
+        "aria-selected": g.has(A.value),
+        className: h(
           "dropdown-item d-flex align-items-center gap-2",
-          K === E && "active",
-          V.disabled && "disabled"
+          H === O && "active",
+          A.disabled && "disabled"
         ),
-        onMouseEnter: () => U(K),
-        onMouseDown: (J) => {
-          J.preventDefault(), V.disabled || $(K);
+        onMouseEnter: () => q(H),
+        onMouseDown: (R) => {
+          R.preventDefault(), A.disabled || D(H);
         },
         children: [
-          /* @__PURE__ */ a("input", { type: "checkbox", className: "form-check-input m-0", checked: C.has(V.value), readOnly: !0, tabIndex: -1 }),
-          V.label
+          /* @__PURE__ */ o("input", { type: "checkbox", className: "form-check-input m-0", checked: g.has(A.value), readOnly: !0, tabIndex: -1 }),
+          A.label
         ]
       },
-      String(V.value)
+      String(A.value)
     )) })
   ] }) });
 }
-function z(e) {
+function ae(e) {
   if (!e)
     return "";
-  const n = e.getFullYear(), t = String(e.getMonth() + 1).padStart(2, "0"), r = String(e.getDate()).padStart(2, "0");
-  return `${n}-${t}-${r}`;
+  const r = e.getFullYear(), n = String(e.getMonth() + 1).padStart(2, "0"), t = String(e.getDate()).padStart(2, "0");
+  return `${r}-${n}-${t}`;
 }
-function ge(e) {
+function nr(e) {
   if (!e)
     return null;
-  const n = e.split("-").map(Number), [t, r, l] = n;
-  return !t || !r || !l ? null : new Date(t, r - 1, l);
+  const r = e.split("-").map(Number), [n, t, a] = r;
+  return !n || !t || !a ? null : new Date(n, t - 1, a);
 }
-function Oe({ value: e, defaultValue: n, onChange: t, min: r, max: l, ...i }) {
-  const [o, c] = T({
+function Er({ value: e, defaultValue: r, onChange: n, min: t, max: a, ...i }) {
+  const [l, c] = T({
     value: e,
-    defaultValue: n ?? null,
-    onChange: t
+    defaultValue: r ?? null,
+    onChange: n
   });
-  return /* @__PURE__ */ a(
-    Z,
+  return /* @__PURE__ */ o(
+    de,
     {
       ...i,
-      value: z(o),
-      onChange: (s) => c(ge(s)),
+      value: ae(l),
+      onChange: (s) => c(nr(s)),
       inputProps: {
         type: "date",
-        min: r ? z(r) : void 0,
-        max: l ? z(l) : void 0
+        min: t ? ae(t) : void 0,
+        max: a ? ae(a) : void 0
       }
     }
   );
 }
-function ye(e) {
+function tr(e) {
   if (!e)
     return "";
-  const n = String(e.getHours()).padStart(2, "0"), t = String(e.getMinutes()).padStart(2, "0");
-  return `${n}:${t}`;
+  const r = String(e.getHours()).padStart(2, "0"), n = String(e.getMinutes()).padStart(2, "0");
+  return `${r}:${n}`;
 }
-function Ne(e) {
+function ar(e) {
   if (!e)
     return null;
-  const [n, t] = e.split(":").map(Number);
-  return n === void 0 || t === void 0 || Number.isNaN(n) || Number.isNaN(t) ? null : new Date(1970, 0, 1, n, t, 0, 0);
+  const [r, n] = e.split(":").map(Number);
+  return r === void 0 || n === void 0 || Number.isNaN(r) || Number.isNaN(n) ? null : new Date(1970, 0, 1, r, n, 0, 0);
 }
-function zn({ value: e, defaultValue: n, onChange: t, step: r, ...l }) {
-  const [i, o] = T({
+function ct({ value: e, defaultValue: r, onChange: n, step: t, ...a }) {
+  const [i, l] = T({
     value: e,
-    defaultValue: n ?? null,
-    onChange: t
+    defaultValue: r ?? null,
+    onChange: n
   });
-  return /* @__PURE__ */ a(
-    Z,
+  return /* @__PURE__ */ o(
+    de,
     {
-      ...l,
-      value: ye(i),
-      onChange: (c) => o(Ne(c)),
-      inputProps: { type: "time", step: r }
+      ...a,
+      value: tr(i),
+      onChange: (c) => l(ar(c)),
+      inputProps: { type: "time", step: t }
     }
   );
 }
-function oe(e, n) {
-  const t = ge(e);
-  if (!t)
+function We(e, r) {
+  const n = nr(e);
+  if (!n)
     return null;
-  const r = Ne(n || "00:00");
-  return r && t.setHours(r.getHours(), r.getMinutes(), 0, 0), t;
+  const t = ar(r || "00:00");
+  return t && n.setHours(t.getHours(), t.getMinutes(), 0, 0), n;
 }
-function Gn({
+function dt({
   value: e,
-  defaultValue: n,
-  onChange: t,
-  min: r,
-  max: l,
+  defaultValue: r,
+  onChange: n,
+  min: t,
+  max: a,
   id: i,
-  name: o,
+  name: l,
   disabled: c,
   readOnly: s,
   required: d,
   className: u,
-  label: h,
+  label: f,
   helpText: m,
-  error: v
+  error: p
 }) {
-  const [g, w] = T({
+  const [k, S] = T({
     value: e,
-    defaultValue: n ?? null,
-    onChange: t
-  }), k = F(), y = i ?? k, S = z(g), x = ye(g);
-  return /* @__PURE__ */ a(B, { id: y, label: h, required: d, error: v, helpText: m, className: u, children: /* @__PURE__ */ p("div", { className: "d-flex gap-2", children: [
-    /* @__PURE__ */ a(
+    defaultValue: r ?? null,
+    onChange: n
+  }), x = W(), _ = i ?? x, C = ae(k), v = tr(k);
+  return /* @__PURE__ */ o(Y, { id: _, label: f, required: d, error: p, helpText: m, className: u, children: /* @__PURE__ */ y("div", { className: "d-flex gap-2", children: [
+    /* @__PURE__ */ o(
       "input",
       {
-        id: y,
-        name: o ? `${o}-date` : void 0,
+        id: _,
+        name: l ? `${l}-date` : void 0,
         type: "date",
-        className: f("form-control", v && "is-invalid"),
+        className: h("form-control", "rrc-input", p && "is-invalid"),
         disabled: c,
         readOnly: s,
         required: d,
-        min: r ? z(r) : void 0,
-        max: l ? z(l) : void 0,
-        value: S,
-        onChange: (I) => w(oe(I.target.value, x))
+        min: t ? ae(t) : void 0,
+        max: a ? ae(a) : void 0,
+        value: C,
+        onChange: (N) => S(We(N.target.value, v))
       }
     ),
-    /* @__PURE__ */ a(
+    /* @__PURE__ */ o(
       "input",
       {
-        name: o ? `${o}-time` : void 0,
+        name: l ? `${l}-time` : void 0,
         type: "time",
-        className: f("form-control", v && "is-invalid"),
+        className: h("form-control", "rrc-input", p && "is-invalid"),
         disabled: c,
         readOnly: s,
         required: d,
-        value: x,
-        onChange: (I) => w(oe(S || z(/* @__PURE__ */ new Date()), I.target.value))
+        value: v,
+        onChange: (N) => S(We(C || ae(/* @__PURE__ */ new Date()), N.target.value))
       }
     )
   ] }) });
 }
-function Re({
+function Ar({
   options: e,
-  value: n,
-  defaultValue: t,
-  onChange: r,
-  loading: l,
+  value: r,
+  defaultValue: n,
+  onChange: t,
+  loading: a,
   emptyText: i = "No options",
-  id: o,
+  id: l,
   name: c,
   disabled: s,
   readOnly: d,
   required: u,
-  className: h,
+  className: f,
   label: m,
-  placeholder: v = "Select...",
-  helpText: g,
-  error: w
+  placeholder: p = "Select...",
+  helpText: k,
+  error: S
 }) {
-  const [k, y] = T({
-    value: n,
-    defaultValue: t ?? null,
-    onChange: r
-  }), [S, x] = M(!1), I = O(null), b = F(), N = o ?? b, C = e.find((L) => L.value === k) ?? null, D = A(() => x(!1), []), $ = A(
-    (L) => {
-      const R = e[L];
-      !R || R.disabled || (y(R.value), D());
+  const [x, _] = T({
+    value: r,
+    defaultValue: n ?? null,
+    onChange: t
+  }), [C, v] = M(!1), N = L(null), b = W(), w = l ?? b, g = e.find((P) => P.value === x) ?? null, I = F(() => v(!1), []), D = F(
+    (P) => {
+      const V = e[P];
+      !V || V.disabled || (_(V.value), I());
     },
-    [e, y, D]
-  ), { activeIndex: E, setActiveIndex: U, handleKeyDown: G } = re({
+    [e, _, I]
+  ), { activeIndex: O, setActiveIndex: q, handleKeyDown: G } = xe({
     itemCount: e.length,
-    isOpen: S,
-    onSelect: $,
-    onClose: D
+    isOpen: C,
+    onSelect: D,
+    onClose: I
   });
-  return /* @__PURE__ */ a(B, { id: N, label: m, required: u, error: w, helpText: g, className: h, children: /* @__PURE__ */ p("div", { className: "position-relative", children: [
-    /* @__PURE__ */ a(
+  return /* @__PURE__ */ o(Y, { id: w, label: m, required: u, error: S, helpText: k, className: f, children: /* @__PURE__ */ y("div", { className: "position-relative", children: [
+    /* @__PURE__ */ o(
       "button",
       {
-        ref: I,
-        id: N,
+        ref: N,
+        id: w,
         type: "button",
         name: c,
-        className: f("form-select text-start", w && "is-invalid"),
+        className: h("form-select text-start", "rrc-select", "rrc-select__trigger", S && "is-invalid"),
         disabled: s || d,
         "aria-haspopup": "listbox",
-        "aria-expanded": S,
-        onClick: () => x((L) => !L),
+        "aria-expanded": C,
+        onClick: () => v((P) => !P),
         onKeyDown: G,
-        children: C ? C.label : /* @__PURE__ */ a("span", { className: "text-body-secondary", children: v })
+        children: g ? g.label : /* @__PURE__ */ o("span", { className: "text-body-secondary", children: p })
       }
     ),
-    /* @__PURE__ */ a(W, { open: S, onClose: D, anchorRef: I, className: "dropdown-menu w-100", role: "listbox", children: l ? /* @__PURE__ */ a("div", { className: "px-3 py-2 text-body-secondary", children: "Loading…" }) : e.length === 0 ? /* @__PURE__ */ a("div", { className: "px-3 py-2 text-body-secondary", children: i }) : e.map((L, R) => /* @__PURE__ */ a(
+    /* @__PURE__ */ o(oe, { open: C, onClose: I, anchorRef: N, className: "dropdown-menu w-100 rrc-menu rrc-select__menu", role: "listbox", children: a ? /* @__PURE__ */ o("div", { className: "px-3 py-2 text-body-secondary", children: "Loading…" }) : e.length === 0 ? /* @__PURE__ */ o("div", { className: "px-3 py-2 text-body-secondary", children: i }) : e.map((P, V) => /* @__PURE__ */ o(
       "div",
       {
         role: "option",
-        "aria-selected": L.value === k,
-        className: f("dropdown-item", R === E && "active", L.disabled && "disabled"),
-        onMouseEnter: () => U(R),
-        onMouseDown: (V) => {
-          V.preventDefault(), L.disabled || $(R);
+        "aria-selected": P.value === x,
+        className: h("dropdown-item", "rrc-menu__item", V === O && "active", P.disabled && "disabled"),
+        onMouseEnter: () => q(V),
+        onMouseDown: (A) => {
+          A.preventDefault(), P.disabled || D(V);
         },
-        children: L.label
+        children: P.label
       },
-      String(L.value)
+      String(P.value)
     )) })
   ] }) });
 }
-function Ae(e, n) {
-  return n ? e.label.toLowerCase().includes(n.toLowerCase()) : !0;
+function Dr(e, r) {
+  return r ? e.label.toLowerCase().includes(r.toLowerCase()) : !0;
 }
-function Le({
+function Tr({
   options: e,
-  value: n,
-  defaultValue: t,
-  onChange: r,
-  inputValue: l,
+  value: r,
+  defaultValue: n,
+  onChange: t,
+  inputValue: a,
   onInputValueChange: i,
-  loading: o,
+  loading: l,
   emptyText: c = "No results",
   filter: s,
   id: d,
   name: u,
-  disabled: h,
+  disabled: f,
   readOnly: m,
-  required: v,
-  className: g,
-  label: w,
-  placeholder: k,
-  helpText: y,
-  error: S
+  required: p,
+  className: k,
+  label: S,
+  placeholder: x,
+  helpText: _,
+  error: C
 }) {
-  const [x, I] = T({
-    value: n,
-    defaultValue: t ?? null,
-    onChange: r
-  }), b = e.find((P) => P.value === x) ?? null, [N, C] = T({
-    value: l,
+  const [v, N] = T({
+    value: r,
+    defaultValue: n ?? null,
+    onChange: t
+  }), b = e.find((K) => K.value === v) ?? null, [w, g] = T({
+    value: a,
     defaultValue: (b == null ? void 0 : b.label) ?? "",
     onChange: i
-  }), [D, $] = M(!1), E = O(null), U = F(), G = d ?? U, L = s ?? Ae, R = e.filter((P) => L(P, N)), V = A(() => $(!1), []), K = A(
-    (P) => {
-      const j = R[P];
-      !j || j.disabled || (I(j.value), C(j.label), V());
+  }), [I, D] = M(!1), O = L(null), q = W(), G = d ?? q, P = s ?? Dr, V = e.filter((K) => P(K, w)), A = F(() => D(!1), []), H = F(
+    (K) => {
+      const j = V[K];
+      !j || j.disabled || (N(j.value), g(j.label), A());
     },
-    [R, I, C, V]
-  ), { activeIndex: J, setActiveIndex: ae, handleKeyDown: De } = re({
-    itemCount: R.length,
-    isOpen: D,
-    onSelect: K,
-    onClose: V
+    [V, N, g, A]
+  ), { activeIndex: R, setActiveIndex: Z, handleKeyDown: X } = xe({
+    itemCount: V.length,
+    isOpen: I,
+    onSelect: H,
+    onClose: A
   });
-  return /* @__PURE__ */ a(B, { id: G, label: w, required: v, error: S, helpText: y, className: g, children: /* @__PURE__ */ p("div", { className: "position-relative", children: [
-    /* @__PURE__ */ a(
+  return /* @__PURE__ */ o(Y, { id: G, label: S, required: p, error: C, helpText: _, className: k, children: /* @__PURE__ */ y("div", { className: "position-relative", children: [
+    /* @__PURE__ */ o(
       "input",
       {
-        ref: E,
+        ref: O,
         id: G,
         name: u,
         type: "text",
-        className: f("form-control", S && "is-invalid"),
-        disabled: h,
+        className: h("form-control", "rrc-input", C && "is-invalid"),
+        disabled: f,
         readOnly: m,
-        required: v,
-        placeholder: k,
+        required: p,
+        placeholder: x,
         autoComplete: "off",
         role: "combobox",
-        "aria-expanded": D,
+        "aria-expanded": I,
         "aria-haspopup": "listbox",
-        value: N,
-        onFocus: () => $(!0),
-        onChange: (P) => {
-          const j = P.target.value;
-          C(j), $(!0), x !== null && I(null);
+        value: w,
+        onFocus: () => D(!0),
+        onChange: (K) => {
+          const j = K.target.value;
+          g(j), D(!0), v !== null && N(null);
         },
-        onKeyDown: De
+        onKeyDown: X
       }
     ),
-    /* @__PURE__ */ a(W, { open: D, onClose: V, anchorRef: E, className: "dropdown-menu w-100", role: "listbox", children: o ? /* @__PURE__ */ a("div", { className: "px-3 py-2 text-body-secondary", children: "Loading…" }) : R.length === 0 ? /* @__PURE__ */ a("div", { className: "px-3 py-2 text-body-secondary", children: c }) : R.map((P, j) => /* @__PURE__ */ a(
+    /* @__PURE__ */ o(oe, { open: I, onClose: A, anchorRef: O, className: "dropdown-menu w-100 rrc-menu rrc-select__menu", role: "listbox", children: l ? /* @__PURE__ */ o("div", { className: "px-3 py-2 text-body-secondary", children: "Loading…" }) : V.length === 0 ? /* @__PURE__ */ o("div", { className: "px-3 py-2 text-body-secondary", children: c }) : V.map((K, j) => /* @__PURE__ */ o(
       "div",
       {
         role: "option",
-        "aria-selected": P.value === x,
-        className: f("dropdown-item", j === J && "active", P.disabled && "disabled"),
-        onMouseEnter: () => ae(j),
-        onMouseDown: (Ve) => {
-          Ve.preventDefault(), P.disabled || K(j);
+        "aria-selected": K.value === v,
+        className: h("dropdown-item", "rrc-menu__item", j === R && "active", K.disabled && "disabled"),
+        onMouseEnter: () => Z(j),
+        onMouseDown: (E) => {
+          E.preventDefault(), K.disabled || H(j);
         },
-        children: P.label
+        children: K.label
       },
-      String(P.value)
+      String(K.value)
     )) })
   ] }) });
 }
-function Wn(e) {
-  return /* @__PURE__ */ a(B, { ...e });
+function ut(e) {
+  return /* @__PURE__ */ o(Y, { ...e });
 }
-function Pe({ open: e, onClose: n, title: t, children: r, footer: l, className: i }) {
-  return ie(e, n), e ? /* @__PURE__ */ p(H, { children: [
-    /* @__PURE__ */ a("div", { className: "modal d-block", tabIndex: -1, role: "dialog", "aria-modal": "true", children: /* @__PURE__ */ a("div", { className: f("modal-dialog", i), role: "document", children: /* @__PURE__ */ p("div", { className: "modal-content", children: [
-      /* @__PURE__ */ p("div", { className: "modal-header", children: [
-        t && /* @__PURE__ */ a("h5", { className: "modal-title", children: t }),
-        /* @__PURE__ */ a("button", { type: "button", className: "btn-close", "aria-label": "Close", onClick: n })
+function Vr({ open: e, onClose: r, title: n, children: t, footer: a, className: i }) {
+  return _e(e, r), e ? /* @__PURE__ */ y(Q, { children: [
+    /* @__PURE__ */ o("div", { className: "modal d-block rrc-modal", tabIndex: -1, role: "dialog", "aria-modal": "true", children: /* @__PURE__ */ o("div", { className: h("modal-dialog", "rrc-modal__dialog", i), role: "document", children: /* @__PURE__ */ y("div", { className: "modal-content rrc-modal__content", children: [
+      /* @__PURE__ */ y("div", { className: "modal-header rrc-modal__header", children: [
+        n && /* @__PURE__ */ o("h5", { className: "modal-title", children: n }),
+        /* @__PURE__ */ o("button", { type: "button", className: "btn-close", "aria-label": "Close", onClick: r })
       ] }),
-      /* @__PURE__ */ a("div", { className: "modal-body", children: r }),
-      l && /* @__PURE__ */ a("div", { className: "modal-footer", children: l })
+      /* @__PURE__ */ o("div", { className: "modal-body rrc-modal__body", children: t }),
+      a && /* @__PURE__ */ o("div", { className: "modal-footer rrc-modal__footer", children: a })
     ] }) }) }),
-    /* @__PURE__ */ a("div", { className: "modal-backdrop show", onClick: n })
+    /* @__PURE__ */ o("div", { className: "modal-backdrop show rrc-modal__backdrop", onClick: r })
   ] }) : null;
 }
-function Fe(e, n, t) {
-  const r = [], l = Math.max(1, e - t), i = Math.min(n, e + t);
-  l > 1 && (r.push(1), l > 2 && r.push("ellipsis"));
-  for (let o = l; o <= i; o++)
-    r.push(o);
-  return i < n && (i < n - 1 && r.push("ellipsis"), r.push(n)), r;
-}
-function Ke({ currentPage: e, pageSize: n, totalItems: t, onPageChange: r, siblingCount: l = 1, className: i }) {
-  const o = Math.max(1, Math.ceil(t / n)), c = Fe(e, o, l);
-  return /* @__PURE__ */ a("nav", { "aria-label": "Pagination", className: i, children: /* @__PURE__ */ p("ul", { className: "pagination mb-0", children: [
-    /* @__PURE__ */ a("li", { className: f("page-item", e <= 1 && "disabled"), children: /* @__PURE__ */ a(
+function Lr(e, r, n) {
+  const t = [], a = Math.max(1, e - n), i = Math.min(r, e + n);
+  a > 1 && (t.push(1), a > 2 && t.push("ellipsis"));
+  for (let l = a; l <= i; l++)
+    t.push(l);
+  return i < r && (i < r - 1 && t.push("ellipsis"), t.push(r)), t;
+}
+function Rr({ currentPage: e, pageSize: r, totalItems: n, onPageChange: t, siblingCount: a = 1, className: i }) {
+  const l = Math.max(1, Math.ceil(n / r)), c = Lr(e, l, a);
+  return /* @__PURE__ */ o("nav", { "aria-label": "Pagination", className: i, children: /* @__PURE__ */ y("ul", { className: "pagination mb-0 rrc-pagination", children: [
+    /* @__PURE__ */ o("li", { className: h("page-item", e <= 1 && "disabled"), children: /* @__PURE__ */ o(
       "button",
       {
         type: "button",
         className: "page-link",
         disabled: e <= 1,
-        onClick: () => r(e - 1),
+        onClick: () => t(e - 1),
         children: "Previous"
       }
     ) }),
     c.map(
-      (s, d) => s === "ellipsis" ? /* @__PURE__ */ a("li", { className: "page-item disabled", children: /* @__PURE__ */ a("span", { className: "page-link", children: "…" }) }, `ellipsis-${d}`) : /* @__PURE__ */ a("li", { className: f("page-item", s === e && "active"), children: /* @__PURE__ */ a(
+      (s, d) => s === "ellipsis" ? /* @__PURE__ */ o("li", { className: "page-item disabled", children: /* @__PURE__ */ o("span", { className: "page-link", children: "…" }) }, `ellipsis-${d}`) : /* @__PURE__ */ o("li", { className: h("page-item", s === e && "active"), children: /* @__PURE__ */ o(
         "button",
         {
           type: "button",
           className: "page-link",
           "aria-current": s === e ? "page" : void 0,
-          onClick: () => r(s),
+          onClick: () => t(s),
           children: s
         }
       ) }, s)
     ),
-    /* @__PURE__ */ a("li", { className: f("page-item", e >= o && "disabled"), children: /* @__PURE__ */ a(
+    /* @__PURE__ */ o("li", { className: h("page-item", e >= l && "disabled"), children: /* @__PURE__ */ o(
       "button",
       {
         type: "button",
         className: "page-link",
-        disabled: e >= o,
-        onClick: () => r(e + 1),
+        disabled: e >= l,
+        onClick: () => t(e + 1),
         children: "Next"
       }
     ) })
   ] }) });
 }
-const Be = {
+const $r = {
   text: (e) => e == null ? "" : String(e),
   boolean: (e) => e ? "Yes" : "No",
   date: (e) => {
     if (e == null || e === "")
       return "";
-    const n = e instanceof Date ? e : new Date(String(e));
-    return Number.isNaN(n.getTime()) ? String(e) : n.toLocaleDateString();
+    const r = e instanceof Date ? e : new Date(String(e));
+    return Number.isNaN(r.getTime()) ? String(e) : r.toLocaleDateString();
   },
   currency: (e) => {
-    const n = Number(e);
-    return Number.isFinite(n) ? n.toLocaleString(void 0, { style: "currency", currency: "USD" }) : String(e ?? "");
+    const r = Number(e);
+    return Number.isFinite(r) ? r.toLocaleString(void 0, { style: "currency", currency: "USD" }) : String(e ?? "");
   }
 };
-function je(e, n) {
-  return !e || e.key !== n ? { key: n, direction: "asc" } : e.direction === "asc" ? { key: n, direction: "desc" } : null;
+function Or(e, r) {
+  return !e || e.key !== r ? { key: r, direction: "asc" } : e.direction === "asc" ? { key: r, direction: "desc" } : null;
 }
-function ce(e) {
+function Ge(e) {
   return e.key ?? e.field ?? e.header;
 }
-function He(e, n) {
-  const t = e.field ?? e.key;
-  return t ? n[t] : void 0;
+function Mr(e, r) {
+  const n = e.field ?? e.key;
+  return n ? r[n] : void 0;
 }
-function _e(e, n) {
+function Pr(e, r) {
   if (e.render)
-    return e.render(n);
-  const t = He(e, n);
-  return e.formatter ? e.formatter(t, n) : e.format ? Be[e.format](t) : t == null ? "" : String(t);
+    return e.render(r);
+  const n = Mr(e, r);
+  return e.formatter ? e.formatter(n, r) : e.format ? $r[e.format](n) : n == null ? "" : String(n);
 }
-function de(e) {
+function Je(e) {
   return e && `text-${e}`;
 }
-function Ue({
+function Kr({
   columns: e,
-  rows: n,
-  rowKey: t,
-  loading: r,
-  error: l,
+  rows: r,
+  rowKey: n,
+  loading: t,
+  error: a,
   emptyText: i = "No data",
-  className: o,
+  className: l,
   selectedRowKeys: c,
   onSelectionChange: s,
   sort: d,
   onSortChange: u,
-  page: h,
+  page: f,
   pageSize: m,
-  totalCount: v,
-  onPageChange: g
+  totalCount: p,
+  onPageChange: k
 }) {
-  const w = !!s, k = new Set(c ?? []), y = h !== void 0 && m !== void 0 && v !== void 0, S = y ? Math.max(1, Math.ceil(v / m)) : 1;
-  function x() {
-    s && (k.size === n.length ? s([]) : s(n.map(t)));
+  const S = !!s, x = new Set(c ?? []), _ = f !== void 0 && m !== void 0 && p !== void 0, C = _ ? Math.max(1, Math.ceil(p / m)) : 1;
+  function v() {
+    s && (x.size === r.length ? s([]) : s(r.map(n)));
   }
-  function I(b) {
+  function N(b) {
     if (!s)
       return;
-    const N = new Set(k);
-    N.has(b) ? N.delete(b) : N.add(b), s(Array.from(N));
+    const w = new Set(x);
+    w.has(b) ? w.delete(b) : w.add(b), s(Array.from(w));
   }
-  return /* @__PURE__ */ p("div", { className: f("table-responsive", o), children: [
-    /* @__PURE__ */ p("table", { className: "table table-hover align-middle", children: [
-      /* @__PURE__ */ a("thead", { children: /* @__PURE__ */ p("tr", { children: [
-        w && /* @__PURE__ */ a("th", { style: { width: "2.5rem" }, children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ y("div", { className: h("table-responsive", "rrc-data-grid", l), children: [
+    /* @__PURE__ */ y("table", { className: "table table-hover align-middle rrc-data-grid__table", children: [
+      /* @__PURE__ */ o("thead", { children: /* @__PURE__ */ y("tr", { children: [
+        S && /* @__PURE__ */ o("th", { style: { width: "2.5rem" }, children: /* @__PURE__ */ o(
           "input",
           {
             type: "checkbox",
             className: "form-check-input",
-            checked: n.length > 0 && k.size === n.length,
-            onChange: x,
+            checked: r.length > 0 && x.size === r.length,
+            onChange: v,
             "aria-label": "Select all rows"
           }
         ) }),
         e.map((b) => {
-          const N = ce(b);
-          return /* @__PURE__ */ p(
+          const w = Ge(b);
+          return /* @__PURE__ */ y(
             "th",
             {
-              className: de(b.headerAlign ?? b.align),
+              className: Je(b.headerAlign ?? b.align),
               style: { width: b.width, minWidth: b.minWidth, maxWidth: b.maxWidth },
               role: b.sortable ? "button" : void 0,
-              onClick: b.sortable && u ? () => u(je(d, N)) : void 0,
+              onClick: b.sortable && u ? () => u(Or(d, w)) : void 0,
               children: [
                 b.header,
-                b.sortable && (d == null ? void 0 : d.key) === N && /* @__PURE__ */ p("span", { "aria-hidden": "true", children: [
+                b.sortable && (d == null ? void 0 : d.key) === w && /* @__PURE__ */ y("span", { "aria-hidden": "true", children: [
                   " ",
                   d.direction === "asc" ? "▲" : "▼"
                 ] })
               ]
             },
-            N
+            w
           );
         })
       ] }) }),
-      /* @__PURE__ */ a("tbody", { children: r ? /* @__PURE__ */ a("tr", { children: /* @__PURE__ */ a("td", { colSpan: e.length + (w ? 1 : 0), className: "text-center text-body-secondary py-4", children: "Loading…" }) }) : l ? /* @__PURE__ */ a("tr", { children: /* @__PURE__ */ a("td", { colSpan: e.length + (w ? 1 : 0), className: "text-center text-danger py-4", children: l }) }) : n.length === 0 ? /* @__PURE__ */ a("tr", { children: /* @__PURE__ */ a("td", { colSpan: e.length + (w ? 1 : 0), className: "text-center text-body-secondary py-4", children: i }) }) : n.map((b) => {
-        const N = t(b);
-        return /* @__PURE__ */ p("tr", { children: [
-          w && /* @__PURE__ */ a("td", { children: /* @__PURE__ */ a(
+      /* @__PURE__ */ o("tbody", { children: t ? /* @__PURE__ */ o("tr", { children: /* @__PURE__ */ o("td", { colSpan: e.length + (S ? 1 : 0), className: "text-center text-body-secondary py-4", children: "Loading…" }) }) : a ? /* @__PURE__ */ o("tr", { children: /* @__PURE__ */ o("td", { colSpan: e.length + (S ? 1 : 0), className: "text-center text-danger py-4", children: a }) }) : r.length === 0 ? /* @__PURE__ */ o("tr", { children: /* @__PURE__ */ o("td", { colSpan: e.length + (S ? 1 : 0), className: "text-center text-body-secondary py-4", children: i }) }) : r.map((b) => {
+        const w = n(b);
+        return /* @__PURE__ */ y("tr", { children: [
+          S && /* @__PURE__ */ o("td", { children: /* @__PURE__ */ o(
             "input",
             {
               type: "checkbox",
               className: "form-check-input",
-              checked: k.has(N),
-              onChange: () => I(N),
+              checked: x.has(w),
+              onChange: () => N(w),
               "aria-label": "Select row"
             }
           ) }),
-          e.map((C) => /* @__PURE__ */ a("td", { className: de(C.align), children: _e(C, b) }, ce(C)))
-        ] }, N);
+          e.map((g) => /* @__PURE__ */ o("td", { className: Je(g.align), children: Pr(g, b) }, Ge(g)))
+        ] }, w);
       }) })
     ] }),
-    y && /* @__PURE__ */ p("div", { className: "d-flex justify-content-between align-items-center mt-2", children: [
-      /* @__PURE__ */ p("span", { className: "text-body-secondary small", children: [
+    _ && /* @__PURE__ */ y("div", { className: "d-flex justify-content-between align-items-center mt-2 rrc-data-grid__footer", children: [
+      /* @__PURE__ */ y("span", { className: "text-body-secondary small", children: [
         "Page ",
-        h,
+        f,
         " of ",
-        S,
+        C,
         " (",
-        v,
+        p,
         " rows)"
       ] }),
-      /* @__PURE__ */ a(Ke, { currentPage: h, pageSize: m, totalItems: v, onPageChange: g })
+      /* @__PURE__ */ o(Rr, { currentPage: f, pageSize: m, totalItems: p, onPageChange: k })
     ] })
   ] });
 }
-function qe({ size: e = "md", variant: n, className: t, label: r = "Loading..." }) {
-  return /* @__PURE__ */ a(
+function Br({ size: e = "md", variant: r, className: n, label: t = "Loading..." }) {
+  return /* @__PURE__ */ o(
     "span",
     {
-      className: f("spinner-border", e === "sm" && "spinner-border-sm", n && `text-${n}`, t),
+      className: h("spinner-border", "rrc-spinner", e === "sm" && "spinner-border-sm", r && `text-${r}`, n),
       role: "status",
-      children: /* @__PURE__ */ a("span", { className: "visually-hidden", children: r })
+      children: /* @__PURE__ */ o("span", { className: "visually-hidden", children: t })
     }
   );
 }
-function te({
+function ke({
   variant: e = "primary",
-  size: n,
-  disabled: t,
-  loading: r,
-  type: l = "button",
+  size: r,
+  disabled: n,
+  loading: t,
+  type: a = "button",
   className: i,
-  children: o,
+  children: l,
   onClick: c,
   ...s
 }) {
-  const d = t || r;
-  return /* @__PURE__ */ p(
+  const d = n || t;
+  return /* @__PURE__ */ y(
     "button",
     {
-      type: l,
-      className: f("btn", `btn-${e}`, n && `btn-${n}`, i),
+      type: a,
+      className: h("btn", `btn-${e}`, r && `btn-${r}`, "rrc-btn", `rrc-btn--${e}`, i),
       disabled: d,
-      "aria-busy": r || void 0,
+      "aria-busy": t || void 0,
       onClick: d ? void 0 : c,
       ...s,
       children: [
-        r && /* @__PURE__ */ a(qe, { size: "sm", className: "me-2", label: "" }),
-        o
+        t && /* @__PURE__ */ o(Br, { size: "sm", className: "me-2", label: "" }),
+        l
       ]
     }
   );
 }
-function xe({ variant: e = "info", dismissible: n, onDismiss: t, className: r, children: l }) {
-  return /* @__PURE__ */ p("div", { className: f("alert", `alert-${e}`, n && "alert-dismissible", r), role: "alert", children: [
-    l,
-    n && /* @__PURE__ */ a("button", { type: "button", className: "btn-close", "aria-label": "Close", onClick: t })
+function or({ variant: e = "info", dismissible: r, onDismiss: n, className: t, children: a }) {
+  return /* @__PURE__ */ y("div", { className: h("alert", `alert-${e}`, r && "alert-dismissible", "rrc-alert", `rrc-alert--${e}`, t), role: "alert", children: [
+    a,
+    r && /* @__PURE__ */ o("button", { type: "button", className: "btn-close", "aria-label": "Close", onClick: n })
   ] });
 }
-const we = he(null), ze = 4e3;
-function Jn({ children: e }) {
-  const [n, t] = M([]), r = O(0), l = O(/* @__PURE__ */ new Map());
-  _(() => {
-    const s = l.current;
+const ir = Ve(null), Fr = 4e3;
+function mt({ children: e }) {
+  const [r, n] = M([]), t = L(0), a = L(/* @__PURE__ */ new Map());
+  U(() => {
+    const s = a.current;
     return () => {
       s.forEach(clearTimeout), s.clear();
     };
   }, []);
-  const i = A((s) => {
-    const d = l.current.get(s);
-    d && (clearTimeout(d), l.current.delete(s)), t((u) => u.filter((h) => h.id !== s));
-  }, []), o = A(
+  const i = F((s) => {
+    const d = a.current.get(s);
+    d && (clearTimeout(d), a.current.delete(s)), n((u) => u.filter((f) => f.id !== s));
+  }, []), l = F(
     (s, d) => {
-      const u = r.current++, h = (d == null ? void 0 : d.variant) ?? "info", m = (d == null ? void 0 : d.duration) ?? ze;
-      return t((v) => [...v, { id: u, message: s, variant: h }]), m > 0 && l.current.set(
+      const u = t.current++, f = (d == null ? void 0 : d.variant) ?? "info", m = (d == null ? void 0 : d.duration) ?? Fr;
+      return n((p) => [...p, { id: u, message: s, variant: f }]), m > 0 && a.current.set(
         u,
         setTimeout(() => i(u), m)
       ), u;
     },
     [i]
-  ), c = ne(
+  ), c = J(
     () => ({
-      show: o,
+      show: l,
       dismiss: i,
-      success: (s, d) => o(s, { ...d, variant: "success" }),
-      error: (s, d) => o(s, { ...d, variant: "danger" }),
-      info: (s, d) => o(s, { ...d, variant: "info" }),
-      warning: (s, d) => o(s, { ...d, variant: "warning" })
+      success: (s, d) => l(s, { ...d, variant: "success" }),
+      error: (s, d) => l(s, { ...d, variant: "danger" }),
+      info: (s, d) => l(s, { ...d, variant: "info" }),
+      warning: (s, d) => l(s, { ...d, variant: "warning" })
     }),
-    [o, i]
+    [l, i]
   );
-  return /* @__PURE__ */ p(we.Provider, { value: c, children: [
+  return /* @__PURE__ */ y(ir.Provider, { value: c, children: [
     e,
-    /* @__PURE__ */ a("div", { className: "toast-container position-fixed bottom-0 end-0 p-3", style: { zIndex: 1090 }, children: n.map((s) => /* @__PURE__ */ a(xe, { variant: s.variant, dismissible: !0, onDismiss: () => i(s.id), className: "shadow-sm", children: s.message }, s.id)) })
+    /* @__PURE__ */ o("div", { className: "toast-container position-fixed bottom-0 end-0 p-3 rrc-toast-container", style: { zIndex: 1090 }, children: r.map((s) => /* @__PURE__ */ o(or, { variant: s.variant, dismissible: !0, onDismiss: () => i(s.id), className: "shadow-sm", children: s.message }, s.id)) })
   ] });
 }
-function Zn() {
-  const e = be(we);
+function ft() {
+  const e = we(ir);
   if (!e)
     throw new Error("useToast must be used within a ToastProvider");
   return e;
 }
-const ke = he(null);
-function Yn({ children: e }) {
-  const [n, t] = M(null), r = A((i) => new Promise((o) => {
-    t({ ...i, resolve: o });
-  }), []), l = A(
+const lr = Ve(null);
+function ht({ children: e }) {
+  const [r, n] = M(null), t = F((i) => new Promise((l) => {
+    n({ ...i, resolve: l });
+  }), []), a = F(
     (i) => {
-      n == null || n.resolve(i), t(null);
+      r == null || r.resolve(i), n(null);
     },
-    [n]
+    [r]
   );
-  return /* @__PURE__ */ p(ke.Provider, { value: r, children: [
+  return /* @__PURE__ */ y(lr.Provider, { value: t, children: [
     e,
-    /* @__PURE__ */ a(
-      Pe,
+    /* @__PURE__ */ o(
+      Vr,
       {
-        open: n !== null,
-        onClose: () => l(!1),
-        title: (n == null ? void 0 : n.title) ?? "Confirm",
-        footer: /* @__PURE__ */ p(H, { children: [
-          /* @__PURE__ */ a(te, { variant: "outline-secondary", onClick: () => l(!1), children: (n == null ? void 0 : n.cancelLabel) ?? "Cancel" }),
-          /* @__PURE__ */ a(te, { variant: (n == null ? void 0 : n.confirmVariant) ?? "danger", onClick: () => l(!0), children: (n == null ? void 0 : n.confirmLabel) ?? "Confirm" })
+        open: r !== null,
+        onClose: () => a(!1),
+        title: (r == null ? void 0 : r.title) ?? "Confirm",
+        footer: /* @__PURE__ */ y(Q, { children: [
+          /* @__PURE__ */ o(ke, { variant: "outline-secondary", onClick: () => a(!1), children: (r == null ? void 0 : r.cancelLabel) ?? "Cancel" }),
+          /* @__PURE__ */ o(ke, { variant: (r == null ? void 0 : r.confirmVariant) ?? "danger", onClick: () => a(!0), children: (r == null ? void 0 : r.confirmLabel) ?? "Confirm" })
         ] }),
-        children: n == null ? void 0 : n.message
+        children: r == null ? void 0 : r.message
       }
     )
   ] });
 }
-function Qn() {
-  const e = be(ke);
+function pt() {
+  const e = we(lr);
   if (!e)
     throw new Error("useConfirm must be used within a ConfirmProvider");
   return e;
 }
-function Ge({ variant: e = "primary", pill: n, className: t, children: r }) {
-  return /* @__PURE__ */ a("span", { className: f("badge", `bg-${e}`, n && "rounded-pill", t), children: r });
+function Hr({ variant: e = "primary", appearance: r = "solid", pill: n, className: t, children: a }) {
+  return /* @__PURE__ */ o(
+    "span",
+    {
+      className: h(
+        "badge",
+        // Bootstrap's own solid fill is only correct for the solid appearance;
+        // the tinted forms are painted by this library's stylesheet instead.
+        r === "solid" && `bg-${e}`,
+        n && "rounded-pill",
+        "rrc-badge",
+        `rrc-badge--${e}`,
+        `rrc-badge--${r}`,
+        t
+      ),
+      children: a
+    }
+  );
 }
-const We = {
+const jr = {
   sm: "0.875em",
   lg: "1.5em",
   xl: "2em"
 };
-function se({ name: e, size: n, className: t, label: r }) {
-  return /* @__PURE__ */ a(
+function Le({ name: e, size: r, className: n, label: t }) {
+  return /* @__PURE__ */ o(
     "i",
     {
-      className: f(e, t),
-      style: n ? { fontSize: We[n] } : void 0,
-      role: r ? "img" : void 0,
-      "aria-label": r,
-      "aria-hidden": r ? void 0 : !0
+      className: h(e, "rrc-icon", n),
+      style: r ? { fontSize: jr[r] } : void 0,
+      role: t ? "img" : void 0,
+      "aria-label": t,
+      "aria-hidden": t ? void 0 : !0
     }
   );
 }
-function Je(e) {
+function Ur(e) {
   switch (e) {
     case "pill":
       return "nav-pills";
@@ -1127,207 +1143,210 @@ function Je(e) {
       return "nav-tabs";
   }
 }
-const Ze = {
+const qr = {
   sm: "small",
   lg: "fs-5"
 };
-function Xn({ items: e, activeKey: n, defaultActiveKey: t, onChange: r, variant: l = "default", orientation: i = "horizontal", size: o, stretch: c, className: s }) {
-  var I;
+function bt({ items: e, activeKey: r, defaultActiveKey: n, onChange: t, variant: a = "default", orientation: i = "horizontal", size: l, stretch: c, className: s }) {
+  var N;
   const [d, u] = T({
-    value: n,
-    defaultValue: t ?? ((I = e[0]) == null ? void 0 : I.key) ?? "",
-    onChange: r
-  }), h = e.find((b) => b.key === d), m = l === "button", v = i === "vertical", g = O([]);
-  function w(b, N) {
-    var D;
-    const C = e[b];
-    C && (u(C.key), N && ((D = g.current[b]) == null || D.focus()));
+    value: r,
+    defaultValue: n ?? ((N = e[0]) == null ? void 0 : N.key) ?? "",
+    onChange: t
+  }), f = e.find((b) => b.key === d), m = a === "button", p = i === "vertical", k = L([]);
+  function S(b, w) {
+    var I;
+    const g = e[b];
+    g && (u(g.key), w && ((I = k.current[b]) == null || I.focus()));
   }
-  function k(b, N) {
-    var D;
+  function x(b, w) {
+    var I;
     if (e.length === 0)
       return b;
-    let C = b;
-    for (let $ = 0; $ < e.length; $++)
-      if (C = (C + N + e.length) % e.length, !((D = e[C]) != null && D.disabled))
-        return C;
+    let g = b;
+    for (let D = 0; D < e.length; D++)
+      if (g = (g + w + e.length) % e.length, !((I = e[g]) != null && I.disabled))
+        return g;
     return b;
   }
-  function y(b) {
-    var $;
-    const N = e.findIndex((E) => E.key === d), C = v ? "ArrowDown" : "ArrowRight", D = v ? "ArrowUp" : "ArrowLeft";
-    if (b.key === C)
-      b.preventDefault(), w(k(N, 1), !0);
-    else if (b.key === D)
-      b.preventDefault(), w(k(N, -1), !0);
+  function _(b) {
+    var D;
+    const w = e.findIndex((O) => O.key === d), g = p ? "ArrowDown" : "ArrowRight", I = p ? "ArrowUp" : "ArrowLeft";
+    if (b.key === g)
+      b.preventDefault(), S(x(w, 1), !0);
+    else if (b.key === I)
+      b.preventDefault(), S(x(w, -1), !0);
     else if (b.key === "Home") {
       b.preventDefault();
-      const E = e.findIndex((U) => !U.disabled);
-      E >= 0 && w(E, !0);
+      const O = e.findIndex((q) => !q.disabled);
+      O >= 0 && S(O, !0);
     } else if (b.key === "End") {
       b.preventDefault();
-      for (let E = e.length - 1; E >= 0; E--)
-        if (!(($ = e[E]) != null && $.disabled)) {
-          w(E, !0);
+      for (let O = e.length - 1; O >= 0; O--)
+        if (!((D = e[O]) != null && D.disabled)) {
+          S(O, !0);
           break;
         }
     }
   }
-  const S = /* @__PURE__ */ a(
+  const C = /* @__PURE__ */ o(
     "div",
     {
-      className: f(
+      className: h(
         m ? "btn-group" : "nav",
-        !m && Je(l),
-        !m && v && "flex-column",
+        "rrc-tabs__list",
+        `rrc-tabs__list--${a}`,
+        !m && Ur(a),
+        !m && p && "flex-column",
         !m && c && "nav-fill",
-        !m && o && Ze[o]
+        !m && l && qr[l]
       ),
       role: "tablist",
       "aria-orientation": i,
-      onKeyDown: y,
-      children: e.map((b, N) => {
-        const C = b.key === d, D = /* @__PURE__ */ p(H, { children: [
-          b.icon && /* @__PURE__ */ a(se, { name: b.icon, size: "sm", className: "me-1" }),
+      onKeyDown: _,
+      children: e.map((b, w) => {
+        const g = b.key === d, I = /* @__PURE__ */ y(Q, { children: [
+          b.icon && /* @__PURE__ */ o(Le, { name: b.icon, size: "sm", className: "me-1" }),
           b.label,
-          b.badge != null && /* @__PURE__ */ a(Ge, { variant: C && !m ? "primary" : "secondary", pill: !0, className: "ms-2", children: b.badge })
-        ] }), $ = /* @__PURE__ */ a(
+          b.badge != null && /* @__PURE__ */ o(Hr, { variant: g && !m ? "primary" : "secondary", appearance: "light", pill: !0, className: "ms-2", children: b.badge })
+        ] }), D = /* @__PURE__ */ o(
           "button",
           {
-            ref: (E) => {
-              g.current[N] = E;
+            ref: (O) => {
+              k.current[w] = O;
             },
             type: "button",
             id: `tab-${b.key}`,
-            className: f(m ? f("btn", o ? `btn-${o}` : "btn-sm", C ? "btn-primary" : "btn-outline-primary") : f("nav-link", C && "active")),
+            className: h(m ? h("btn", l ? `btn-${l}` : "btn-sm", g ? "btn-primary" : "btn-outline-primary") : h("nav-link", "rrc-tabs__link", g && "active")),
             role: "tab",
-            "aria-selected": C,
+            "aria-selected": g,
             "aria-controls": `tabpanel-${b.key}`,
-            tabIndex: C ? 0 : -1,
+            tabIndex: g ? 0 : -1,
             disabled: b.disabled,
-            onClick: () => w(N, !1),
-            children: D
+            onClick: () => S(w, !1),
+            children: I
           },
           b.key
         );
-        return m ? $ : /* @__PURE__ */ a("div", { className: "nav-item", role: "presentation", children: $ }, b.key);
+        return m ? D : /* @__PURE__ */ o("div", { className: "nav-item", role: "presentation", children: D }, b.key);
       })
     }
-  ), x = (h == null ? void 0 : h.content) != null && /* @__PURE__ */ a("div", { id: `tabpanel-${h.key}`, className: f("tab-content", !v && "pt-3"), role: "tabpanel", "aria-labelledby": `tab-${h.key}`, children: h.content });
-  return v ? /* @__PURE__ */ p("div", { className: f("d-flex align-items-start gap-3", s), children: [
-    S,
-    x && /* @__PURE__ */ a("div", { className: "flex-grow-1", children: x })
-  ] }) : /* @__PURE__ */ p("div", { className: s, children: [
-    S,
-    x
+  ), v = (f == null ? void 0 : f.content) != null && /* @__PURE__ */ o("div", { id: `tabpanel-${f.key}`, className: h("tab-content", "rrc-tabs__panel", !p && "pt-3"), role: "tabpanel", "aria-labelledby": `tab-${f.key}`, children: f.content });
+  return p ? /* @__PURE__ */ y("div", { className: h("d-flex align-items-start gap-3", "rrc-tabs", "rrc-tabs--vertical", s), children: [
+    C,
+    v && /* @__PURE__ */ o("div", { className: "flex-grow-1", children: v })
+  ] }) : /* @__PURE__ */ y("div", { className: h("rrc-tabs", s), children: [
+    C,
+    v
   ] });
 }
-function Ye({ items: e, multiple: n = !1, openKeys: t, defaultOpenKeys: r, onChange: l, className: i }) {
-  const [o, c] = T({
-    value: t,
-    defaultValue: r ?? [],
-    onChange: l
-  }), s = new Set(o);
+function vt({ items: e, multiple: r = !1, openKeys: n, defaultOpenKeys: t, onChange: a, className: i }) {
+  const [l, c] = T({
+    value: n,
+    defaultValue: t ?? [],
+    onChange: a
+  }), s = new Set(l);
   function d(u) {
-    s.has(u) ? c(o.filter((h) => h !== u)) : c(n ? [...o, u] : [u]);
+    s.has(u) ? c(l.filter((f) => f !== u)) : c(r ? [...l, u] : [u]);
   }
-  return /* @__PURE__ */ a("div", { className: f("accordion", i), children: e.map((u) => {
-    const h = s.has(u.key);
-    return /* @__PURE__ */ p("div", { className: "accordion-item", children: [
-      /* @__PURE__ */ a("h2", { className: "accordion-header", children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ o("div", { className: h("accordion", "rrc-accordion", i), children: e.map((u) => {
+    const f = s.has(u.key);
+    return /* @__PURE__ */ y("div", { className: "accordion-item rrc-accordion__item", children: [
+      /* @__PURE__ */ o("h2", { className: "accordion-header", children: /* @__PURE__ */ o(
         "button",
         {
           type: "button",
-          className: f("accordion-button", !h && "collapsed"),
-          "aria-expanded": h,
+          className: h("accordion-button", "rrc-accordion__button", !f && "collapsed"),
+          "aria-expanded": f,
           disabled: u.disabled,
           onClick: () => d(u.key),
           children: u.header
         }
       ) }),
-      h && /* @__PURE__ */ a("div", { className: "accordion-collapse", children: /* @__PURE__ */ a("div", { className: "accordion-body", children: u.content }) })
+      f && /* @__PURE__ */ o("div", { className: "accordion-collapse", children: /* @__PURE__ */ o("div", { className: "accordion-body rrc-accordion__body", children: u.content }) })
     ] }, u.key);
   }) });
 }
-function Qe({ content: e, children: n, placement: t = "top", className: r }) {
-  const [l, i] = M(!1), o = O(null), c = F();
-  return /* @__PURE__ */ p(
+function sr({ content: e, children: r, placement: n = "top", className: t, wrapperClassName: a }) {
+  const [i, l] = M(!1), c = L(null), s = W();
+  return /* @__PURE__ */ y(
     "span",
     {
-      ref: o,
-      className: "position-relative d-inline-block",
-      onMouseEnter: () => i(!0),
-      onMouseLeave: () => i(!1),
-      onFocus: () => i(!0),
-      onBlur: () => i(!1),
-      "aria-describedby": l ? c : void 0,
+      ref: c,
+      className: h("position-relative", a ?? "d-inline-block"),
+      onMouseEnter: () => l(!0),
+      onMouseLeave: () => l(!1),
+      onFocus: () => l(!0),
+      onBlur: () => l(!1),
+      "aria-describedby": i ? s : void 0,
       children: [
-        n,
-        /* @__PURE__ */ a(
-          W,
+        r,
+        /* @__PURE__ */ o(
+          oe,
           {
-            open: l,
-            onClose: () => i(!1),
-            anchorRef: o,
-            className: f("tooltip show", `bs-tooltip-${t}`, "position-absolute", "w-auto", r),
-            children: /* @__PURE__ */ a("span", { id: c, role: "tooltip", className: "tooltip-inner", children: e })
+            open: i,
+            onClose: () => l(!1),
+            anchorRef: c,
+            className: h("tooltip show", `bs-tooltip-${n}`, "position-absolute", "w-auto", "rrc-tooltip", t),
+            children: /* @__PURE__ */ o("span", { id: s, role: "tooltip", className: "tooltip-inner", children: e })
           }
         )
       ]
     }
   );
 }
-function et({ title: e, content: n, children: t, placement: r = "bottom", className: l }) {
-  const [i, o] = M(!1), c = O(null);
-  return /* @__PURE__ */ p("span", { ref: c, className: "position-relative d-inline-block", onClick: () => o((s) => !s), children: [
-    t,
-    /* @__PURE__ */ p(
-      W,
+function gt({ title: e, content: r, children: n, placement: t = "bottom", className: a }) {
+  const [i, l] = M(!1), c = L(null);
+  return /* @__PURE__ */ y("span", { ref: c, className: "position-relative d-inline-block", onClick: () => l((s) => !s), children: [
+    n,
+    /* @__PURE__ */ y(
+      oe,
       {
         open: i,
-        onClose: () => o(!1),
+        onClose: () => l(!1),
         anchorRef: c,
-        className: f("popover show", `bs-popover-${r}`, "position-absolute", "w-auto", l),
+        className: h("popover show", `bs-popover-${t}`, "position-absolute", "w-auto", "rrc-popover", a),
         children: [
-          e && /* @__PURE__ */ a("h3", { className: "popover-header", children: e }),
-          /* @__PURE__ */ a("div", { className: "popover-body", children: n })
+          e && /* @__PURE__ */ o("h3", { className: "popover-header rrc-popover__header", children: e }),
+          /* @__PURE__ */ o("div", { className: "popover-body rrc-popover__body", children: r })
         ]
       }
     )
   ] });
 }
-function ee({ width: e = "100%", height: n = "1rem", circle: t, className: r }) {
-  return /* @__PURE__ */ a("span", { className: f("placeholder-glow d-inline-block", r), style: { width: e, height: n }, "aria-hidden": "true", children: /* @__PURE__ */ a("span", { className: f("placeholder w-100 h-100 d-block", t && "rounded-circle") }) });
+function ye({ width: e = "100%", height: r = "1rem", circle: n, className: t }) {
+  return /* @__PURE__ */ o("span", { className: h("placeholder-glow d-inline-block", "rrc-skeleton", t), style: { width: e, height: r }, "aria-hidden": "true", children: /* @__PURE__ */ o("span", { className: h("placeholder w-100 h-100 d-block", n && "rounded-circle") }) });
 }
-function Se({ direction: e = "column", gap: n = 2, align: t, justify: r, wrap: l, className: i, children: o }) {
-  return /* @__PURE__ */ a(
+function cr({ direction: e = "column", gap: r = 2, align: n, justify: t, wrap: a, className: i, children: l }) {
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: f(
+      className: h(
         "d-flex",
+        "rrc-stack",
         e === "row" ? "flex-row" : "flex-column",
-        `gap-${n}`,
-        t && `align-items-${t}`,
-        r && `justify-content-${r}`,
-        l && "flex-wrap",
+        `gap-${r}`,
+        n && `align-items-${n}`,
+        t && `justify-content-${t}`,
+        a && "flex-wrap",
         i
       ),
-      children: o
+      children: l
     }
   );
 }
-const Xe = {
+const zr = {
   xs: "0.75rem",
   sm: "0.875rem",
   md: "1rem",
   lg: "1.25rem",
   xl: "1.5rem"
-}, en = {
+}, Wr = {
   normal: "fw-normal",
   medium: "fw-medium",
   semibold: "fw-semibold",
   bold: "fw-bold"
-}, nn = {
+}, Gr = {
   default: void 0,
   muted: "text-body-secondary",
   primary: "text-primary",
@@ -1336,134 +1355,136 @@ const Xe = {
   warning: "text-warning",
   info: "text-info"
 };
-function q({ as: e, size: n = "md", weight: t, tone: r = "default", align: l, truncate: i, wrap: o = !0, className: c, children: s }) {
-  return /* @__PURE__ */ a(
+function te({ as: e, size: r = "md", weight: n, tone: t = "default", align: a, truncate: i, wrap: l = !0, className: c, children: s }) {
+  return /* @__PURE__ */ o(
     e ?? "span",
     {
-      className: f(
-        t && en[t],
-        nn[r],
-        l && `text-${l}`,
+      className: h(
+        "rrc-text",
+        n && Wr[n],
+        Gr[t],
+        a && `text-${a}`,
         i && "text-truncate",
-        !o && !i && "text-nowrap",
+        !l && !i && "text-nowrap",
         c
       ),
-      style: { fontSize: Xe[n] },
+      style: { fontSize: zr[r] },
       children: s
     }
   );
 }
-function tn({ title: e, subtitle: n, icon: t, avatar: r, actions: l }) {
-  return /* @__PURE__ */ p("div", { className: "d-flex align-items-center justify-content-between gap-3", children: [
-    /* @__PURE__ */ p("div", { className: "d-flex align-items-center gap-3", style: { minWidth: 0 }, children: [
-      r || t && /* @__PURE__ */ a("span", { className: "fs-2 lh-1", children: t }),
-      (e || n) && /* @__PURE__ */ p("div", { style: { minWidth: 0 }, children: [
-        e && /* @__PURE__ */ a(q, { as: "div", size: "lg", weight: "semibold", truncate: !0, children: e }),
-        n && /* @__PURE__ */ a(q, { as: "div", size: "sm", tone: "muted", truncate: !0, children: n })
+function Jr({ title: e, subtitle: r, icon: n, avatar: t, actions: a }) {
+  return /* @__PURE__ */ y("div", { className: "d-flex align-items-center justify-content-between gap-3 rrc-card__header-row", children: [
+    /* @__PURE__ */ y("div", { className: "d-flex align-items-center gap-3", style: { minWidth: 0 }, children: [
+      t || n && /* @__PURE__ */ o("span", { className: "fs-2 lh-1", children: n }),
+      (e || r) && /* @__PURE__ */ y("div", { style: { minWidth: 0 }, children: [
+        e && /* @__PURE__ */ o(te, { as: "div", size: "lg", weight: "semibold", truncate: !0, children: e }),
+        r && /* @__PURE__ */ o(te, { as: "div", size: "sm", tone: "muted", truncate: !0, children: r })
       ] })
     ] }),
-    l && /* @__PURE__ */ a("div", { className: "d-flex align-items-center gap-2 flex-shrink-0", children: l })
+    a && /* @__PURE__ */ o("div", { className: "d-flex align-items-center gap-2 flex-shrink-0", children: a })
   ] });
 }
-function nt({ title: e, subtitle: n, icon: t, avatar: r, actions: l, header: i, footer: o, loading: c, className: s, children: d }) {
-  const h = i ?? (!!(e || n || t || r || l) ? /* @__PURE__ */ a(tn, { title: e, subtitle: n, icon: t, avatar: r, actions: l }) : void 0);
-  return /* @__PURE__ */ p("div", { className: f("card", s), children: [
-    h && /* @__PURE__ */ a("div", { className: "card-header", children: h }),
-    /* @__PURE__ */ a("div", { className: "card-body", children: c ? /* @__PURE__ */ p(Se, { gap: 2, children: [
-      /* @__PURE__ */ a(ee, { height: "1rem", width: "60%" }),
-      /* @__PURE__ */ a(ee, { height: "1rem" }),
-      /* @__PURE__ */ a(ee, { height: "1rem", width: "80%" })
+function yt({ title: e, subtitle: r, icon: n, avatar: t, actions: a, header: i, footer: l, loading: c, className: s, children: d }) {
+  const f = i ?? (!!(e || r || n || t || a) ? /* @__PURE__ */ o(Jr, { title: e, subtitle: r, icon: n, avatar: t, actions: a }) : void 0);
+  return /* @__PURE__ */ y("div", { className: h("card", "rrc-card", s), children: [
+    f && /* @__PURE__ */ o("div", { className: "card-header rrc-card__header", children: f }),
+    /* @__PURE__ */ o("div", { className: "card-body rrc-card__body", children: c ? /* @__PURE__ */ y(cr, { gap: 2, children: [
+      /* @__PURE__ */ o(ye, { height: "1rem", width: "60%" }),
+      /* @__PURE__ */ o(ye, { height: "1rem" }),
+      /* @__PURE__ */ o(ye, { height: "1rem", width: "80%" })
     ] }) : d }),
-    o && /* @__PURE__ */ a("div", { className: "card-footer", children: o })
+    l && /* @__PURE__ */ o("div", { className: "card-footer rrc-card__footer", children: l })
   ] });
 }
-function tt({ className: e, vertical: n, label: t }) {
-  return n ? /* @__PURE__ */ a("div", { className: f("vr", e), role: "separator", "aria-orientation": "vertical" }) : t ? /* @__PURE__ */ p("div", { className: f("d-flex align-items-center gap-2 my-3", e), role: "separator", children: [
-    /* @__PURE__ */ a("hr", { className: "flex-grow-1 m-0" }),
-    /* @__PURE__ */ a("span", { className: "text-body-secondary small", children: t }),
-    /* @__PURE__ */ a("hr", { className: "flex-grow-1 m-0" })
-  ] }) : /* @__PURE__ */ a("hr", { className: f("my-3", e), role: "separator" });
+function Zr({ className: e, vertical: r, label: n }) {
+  return r ? /* @__PURE__ */ o("div", { className: h("vr", "rrc-divider", e), role: "separator", "aria-orientation": "vertical" }) : n ? /* @__PURE__ */ y("div", { className: h("d-flex align-items-center gap-2 my-3", "rrc-divider", "rrc-divider--labelled", e), role: "separator", children: [
+    /* @__PURE__ */ o("hr", { className: "flex-grow-1 m-0" }),
+    /* @__PURE__ */ o("span", { className: "text-body-secondary small", children: n }),
+    /* @__PURE__ */ o("hr", { className: "flex-grow-1 m-0" })
+  ] }) : /* @__PURE__ */ o("hr", { className: h("my-3", "rrc-divider", e), role: "separator" });
 }
-function rt({ fluid: e, className: n, children: t }) {
-  return /* @__PURE__ */ a("div", { className: f(e ? "container-fluid" : "container", n), children: t });
+function Nt({ fluid: e, className: r, children: n }) {
+  return /* @__PURE__ */ o("div", { className: h(e ? "container-fluid" : "container", "rrc-container", r), children: n });
 }
-function lt({ className: e, children: n }) {
-  return /* @__PURE__ */ a("div", { className: f("row", e), children: n });
+function kt({ className: e, children: r }) {
+  return /* @__PURE__ */ o("div", { className: h("row", "rrc-row", e), children: r });
 }
-function at({ span: e, sm: n, md: t, lg: r, xl: l, className: i, children: o }) {
-  return /* @__PURE__ */ a(
+function wt({ span: e, sm: r, md: n, lg: t, xl: a, className: i, children: l }) {
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: f(
+      className: h(
         e ? `col-${e}` : "col",
-        n ? `col-sm-${n}` : void 0,
-        t ? `col-md-${t}` : void 0,
-        r ? `col-lg-${r}` : void 0,
-        l ? `col-xl-${l}` : void 0,
+        "rrc-col",
+        r ? `col-sm-${r}` : void 0,
+        n ? `col-md-${n}` : void 0,
+        t ? `col-lg-${t}` : void 0,
+        a ? `col-xl-${a}` : void 0,
         i
       ),
-      children: o
+      children: l
     }
   );
 }
-function rn({ items: e, className: n }) {
-  return /* @__PURE__ */ a("nav", { "aria-label": "breadcrumb", className: n, children: /* @__PURE__ */ a("ol", { className: "breadcrumb mb-0", children: e.map((t, r) => {
-    const l = r === e.length - 1, i = !l && (t.href || t.onClick);
-    return /* @__PURE__ */ a("li", { className: f("breadcrumb-item", l && "active"), "aria-current": l ? "page" : void 0, children: i ? /* @__PURE__ */ a(
+function Yr({ items: e, className: r }) {
+  return /* @__PURE__ */ o("nav", { "aria-label": "breadcrumb", className: h("rrc-breadcrumb", r), children: /* @__PURE__ */ o("ol", { className: "breadcrumb mb-0 rrc-breadcrumb__list", children: e.map((n, t) => {
+    const a = t === e.length - 1, i = !a && (n.href || n.onClick);
+    return /* @__PURE__ */ o("li", { className: h("breadcrumb-item", a && "active"), "aria-current": a ? "page" : void 0, children: i ? /* @__PURE__ */ o(
       "a",
       {
-        href: t.href ?? "#",
-        onClick: (o) => {
+        href: n.href ?? "#",
+        onClick: (l) => {
           var c;
-          t.href || o.preventDefault(), (c = t.onClick) == null || c.call(t);
+          n.href || l.preventDefault(), (c = n.onClick) == null || c.call(n);
         },
-        children: t.label
+        children: n.label
       }
-    ) : t.label }, r);
+    ) : n.label }, t);
   }) }) });
 }
-function it({ items: e, children: n, placement: t = "start", className: r }) {
-  const [l, i] = M(!1), o = O(null), c = A(() => i(!1), []), s = A(
+function _t({ items: e, children: r, placement: n = "start", className: t }) {
+  const [a, i] = M(!1), l = L(null), c = F(() => i(!1), []), s = F(
     (m) => {
-      var g;
-      const v = e[m];
-      !v || v.disabled || ((g = v.onSelect) == null || g.call(v), c());
+      var k;
+      const p = e[m];
+      !p || p.disabled || ((k = p.onSelect) == null || k.call(p), c());
     },
     [e, c]
-  ), { activeIndex: d, setActiveIndex: u, handleKeyDown: h } = re({
+  ), { activeIndex: d, setActiveIndex: u, handleKeyDown: f } = xe({
     itemCount: e.length,
-    isOpen: l,
+    isOpen: a,
     onSelect: s,
     onClose: c
   });
-  return /* @__PURE__ */ p(
+  return /* @__PURE__ */ y(
     "span",
     {
-      ref: o,
+      ref: l,
       className: "position-relative d-inline-block",
       onClick: () => i((m) => !m),
-      onKeyDown: h,
+      onKeyDown: f,
       children: [
-        n,
-        /* @__PURE__ */ a(
-          W,
+        r,
+        /* @__PURE__ */ o(
+          oe,
           {
-            open: l,
+            open: a,
             onClose: c,
-            anchorRef: o,
+            anchorRef: l,
             role: "menu",
-            className: f("dropdown-menu show", t === "end" && "dropdown-menu-end", r),
-            children: e.map((m, v) => /* @__PURE__ */ a(
+            className: h("dropdown-menu show", n === "end" && "dropdown-menu-end", "rrc-menu", t),
+            children: e.map((m, p) => /* @__PURE__ */ o(
               "button",
               {
                 type: "button",
                 role: "menuitem",
-                className: f("dropdown-item", v === d && "active", m.disabled && "disabled", m.danger && "text-danger"),
+                className: h("dropdown-item", "rrc-menu__item", p === d && "active", m.disabled && "disabled", m.danger && "text-danger"),
                 disabled: m.disabled,
-                onMouseEnter: () => u(v),
-                onMouseDown: (g) => g.preventDefault(),
-                onClick: (g) => {
-                  g.stopPropagation(), s(v);
+                onMouseEnter: () => u(p),
+                onMouseDown: (k) => k.preventDefault(),
+                onClick: (k) => {
+                  k.stopPropagation(), s(p);
                 },
                 children: m.label
               },
@@ -1475,67 +1496,67 @@ function it({ items: e, children: n, placement: t = "start", className: r }) {
     }
   );
 }
-function st({ steps: e, currentStep: n, className: t }) {
-  return /* @__PURE__ */ a("ol", { className: f("d-flex list-unstyled align-items-center", t), children: e.map((r, l) => {
-    const i = l < n ? "complete" : l === n ? "active" : "upcoming", o = l === e.length - 1;
-    return /* @__PURE__ */ p("li", { className: f("d-flex align-items-center", !o && "flex-grow-1"), children: [
-      /* @__PURE__ */ p("div", { className: "d-flex align-items-center gap-2", children: [
-        /* @__PURE__ */ a(
+function xt({ steps: e, currentStep: r, className: n }) {
+  return /* @__PURE__ */ o("ol", { className: h("d-flex list-unstyled align-items-center", "rrc-stepper", n), children: e.map((t, a) => {
+    const i = a < r ? "complete" : a === r ? "active" : "upcoming", l = a === e.length - 1;
+    return /* @__PURE__ */ y("li", { className: h("d-flex align-items-center", !l && "flex-grow-1"), children: [
+      /* @__PURE__ */ y("div", { className: "d-flex align-items-center gap-2", children: [
+        /* @__PURE__ */ o(
           "span",
           {
-            className: f(
+            className: h(
               "d-flex align-items-center justify-content-center rounded-circle flex-shrink-0",
               i === "complete" ? "bg-primary text-white" : i === "active" ? "border border-primary text-primary" : "border text-body-secondary"
             ),
             style: { width: "2rem", height: "2rem" },
             "aria-current": i === "active" ? "step" : void 0,
-            children: i === "complete" ? "✓" : l + 1
+            children: i === "complete" ? "✓" : a + 1
           }
         ),
-        /* @__PURE__ */ p("div", { children: [
-          /* @__PURE__ */ a("div", { className: f("small fw-semibold", i === "upcoming" && "text-body-secondary"), children: r.label }),
-          r.description && /* @__PURE__ */ a("div", { className: "small text-body-secondary", children: r.description })
+        /* @__PURE__ */ y("div", { children: [
+          /* @__PURE__ */ o("div", { className: h("small fw-semibold", i === "upcoming" && "text-body-secondary"), children: t.label }),
+          t.description && /* @__PURE__ */ o("div", { className: "small text-body-secondary", children: t.description })
         ] })
       ] }),
-      !o && /* @__PURE__ */ a("hr", { className: "flex-grow-1 mx-2" })
-    ] }, r.key);
+      !l && /* @__PURE__ */ o("hr", { className: "flex-grow-1 mx-2" })
+    ] }, t.key);
   }) });
 }
-function ln(e) {
-  var l, i;
-  const n = e.trim().split(/\s+/), t = ((l = n[0]) == null ? void 0 : l[0]) ?? "", r = n.length > 1 ? ((i = n[n.length - 1]) == null ? void 0 : i[0]) ?? "" : "";
-  return (t + r).toUpperCase();
+function Qr(e) {
+  var a, i;
+  const r = e.trim().split(/\s+/), n = ((a = r[0]) == null ? void 0 : a[0]) ?? "", t = r.length > 1 ? ((i = r[r.length - 1]) == null ? void 0 : i[0]) ?? "" : "";
+  return (n + t).toUpperCase();
 }
-const an = {
+const Xr = {
   sm: "1.75rem",
   md: "2.5rem",
   lg: "3.5rem"
 };
-function ot({ src: e, name: n, size: t = "md", className: r }) {
-  const l = an[t];
-  return e ? /* @__PURE__ */ a(
+function St({ src: e, name: r, size: n = "md", className: t }) {
+  const a = Xr[n];
+  return e ? /* @__PURE__ */ o(
     "img",
     {
       src: e,
-      alt: n ?? "",
-      className: f("rounded-circle", r),
-      style: { width: l, height: l, objectFit: "cover" }
+      alt: r ?? "",
+      className: h("rounded-circle", "rrc-avatar", t),
+      style: { width: a, height: a, objectFit: "cover" }
     }
-  ) : /* @__PURE__ */ a(
+  ) : /* @__PURE__ */ o(
     "span",
     {
-      className: f("d-inline-flex align-items-center justify-content-center rounded-circle bg-secondary text-white", r),
-      style: { width: l, height: l, fontSize: `calc(${l} * 0.4)` },
-      role: n ? "img" : void 0,
-      "aria-label": n,
-      children: n ? ln(n) : null
+      className: h("d-inline-flex align-items-center justify-content-center rounded-circle bg-secondary text-white", "rrc-avatar", "rrc-avatar--initials", t),
+      style: { width: a, height: a, fontSize: `calc(${a} * 0.4)` },
+      role: r ? "img" : void 0,
+      "aria-label": r,
+      children: r ? Qr(r) : null
     }
   );
 }
-function ct({ variant: e = "secondary", onRemove: n, className: t, children: r }) {
-  return /* @__PURE__ */ p("span", { className: f("badge d-inline-flex align-items-center gap-1", `bg-${e}`, t), children: [
-    r,
-    n && /* @__PURE__ */ a(
+function Ct({ variant: e = "secondary", appearance: r = "solid", onRemove: n, className: t, children: a }) {
+  return /* @__PURE__ */ y("span", { className: h("badge d-inline-flex align-items-center gap-1", r === "solid" && `bg-${e}`, "rrc-tag", `rrc-tag--${e}`, `rrc-tag--${r}`, t), children: [
+    a,
+    n && /* @__PURE__ */ o(
       "button",
       {
         type: "button",
@@ -1547,333 +1568,1169 @@ function ct({ variant: e = "secondary", onRemove: n, className: t, children: r }
     )
   ] });
 }
-function dt({
+function It({
   value: e,
-  defaultValue: n,
-  onChange: t,
-  min: r = 0,
-  max: l = 100,
+  defaultValue: r,
+  onChange: n,
+  min: t = 0,
+  max: a = 100,
   step: i = 1,
-  id: o,
+  id: l,
   name: c,
   disabled: s,
   required: d,
   className: u,
-  label: h,
+  label: f,
   helpText: m,
-  error: v
+  error: p
 }) {
-  const [g, w] = T({
+  const [k, S] = T({
     value: e,
-    defaultValue: n ?? r,
-    onChange: t
-  }), k = F(), y = o ?? k;
-  return /* @__PURE__ */ p(B, { id: y, label: h, required: d, error: v, helpText: m, className: u, children: [
-    /* @__PURE__ */ a(
+    defaultValue: r ?? t,
+    onChange: n
+  }), x = W(), _ = l ?? x;
+  return /* @__PURE__ */ y(Y, { id: _, label: f, required: d, error: p, helpText: m, className: u, children: [
+    /* @__PURE__ */ o(
       "input",
       {
-        id: y,
+        id: _,
         name: c,
         type: "range",
-        className: "form-range",
+        className: "form-range rrc-range",
         disabled: s,
         required: d,
-        min: r,
-        max: l,
+        min: t,
+        max: a,
         step: i,
-        value: g,
-        onChange: (S) => w(Number(S.target.value))
+        value: k,
+        onChange: (C) => S(Number(C.target.value))
       }
     ),
-    /* @__PURE__ */ a("div", { className: "small text-body-secondary", children: g })
+    /* @__PURE__ */ o("div", { className: "small text-body-secondary", children: k })
   ] });
 }
-function ut({ value: e, defaultValue: n, onChange: t, max: r = 5, disabled: l, className: i }) {
-  const [o, c] = T({
+function Et({ value: e, defaultValue: r, onChange: n, max: t = 5, disabled: a, className: i }) {
+  const [l, c] = T({
     value: e,
-    defaultValue: n ?? 0,
-    onChange: t
+    defaultValue: r ?? 0,
+    onChange: n
   });
-  return /* @__PURE__ */ a("div", { className: f("d-inline-flex gap-1", i), role: "radiogroup", "aria-label": "Rating", children: Array.from({ length: r }, (s, d) => d + 1).map((s) => /* @__PURE__ */ a(
+  return /* @__PURE__ */ o("div", { className: h("d-inline-flex gap-1", "rrc-rating", i), role: "radiogroup", "aria-label": "Rating", children: Array.from({ length: t }, (s, d) => d + 1).map((s) => /* @__PURE__ */ o(
     "button",
     {
       type: "button",
-      className: "btn btn-link p-0 border-0",
-      disabled: l,
+      className: "btn btn-link p-0 border-0 rrc-rating__star",
+      disabled: a,
       role: "radio",
-      "aria-checked": s === o,
+      "aria-checked": s === l,
       "aria-label": `${s} star${s > 1 ? "s" : ""}`,
       onClick: () => c(s),
-      children: /* @__PURE__ */ a("span", { "aria-hidden": "true", style: { fontSize: "1.25rem", color: s <= o ? "#f5b301" : "#ced4da" }, children: "★" })
+      children: /* @__PURE__ */ o("span", { "aria-hidden": "true", style: { fontSize: "1.25rem", color: s <= l ? "#f5b301" : "#ced4da" }, children: "★" })
     },
     s
   )) });
 }
-function ft({ value: e, variant: n = "primary", label: t, className: r }) {
-  const l = Math.max(0, Math.min(100, e));
-  return /* @__PURE__ */ a("div", { className: f("progress", r), role: "progressbar", "aria-valuenow": l, "aria-valuemin": 0, "aria-valuemax": 100, children: /* @__PURE__ */ a("div", { className: f("progress-bar", `bg-${n}`), style: { width: `${l}%` }, children: t ? `${Math.round(l)}%` : null }) });
+function At({ value: e, variant: r = "primary", label: n, className: t }) {
+  const a = Math.max(0, Math.min(100, e));
+  return /* @__PURE__ */ o("div", { className: h("progress", "rrc-progress", t), role: "progressbar", "aria-valuenow": a, "aria-valuemin": 0, "aria-valuemax": 100, children: /* @__PURE__ */ o("div", { className: h("progress-bar", "rrc-progress__bar", `bg-${r}`), style: { width: `${a}%` }, children: n ? `${Math.round(a)}%` : null }) });
 }
-function mt({ brand: e, start: n, end: t, variant: r = "light", className: l }) {
-  return /* @__PURE__ */ a(
+function Dt({ brand: e, start: r, end: n, variant: t = "light", className: a }) {
+  return /* @__PURE__ */ o(
     "nav",
     {
-      className: f(
+      className: h(
         "navbar navbar-expand-lg border-bottom",
-        r === "dark" ? "navbar-dark bg-dark" : "navbar-light bg-light",
-        l
+        "rrc-navbar",
+        t === "dark" ? "navbar-dark bg-dark" : "navbar-light bg-light",
+        a
       ),
-      children: /* @__PURE__ */ p("div", { className: "container-fluid", children: [
-        e && /* @__PURE__ */ a("span", { className: "navbar-brand mb-0", children: e }),
-        n && /* @__PURE__ */ a("div", { className: "d-flex align-items-center gap-3", children: n }),
-        t && /* @__PURE__ */ a("div", { className: "d-flex align-items-center gap-3 ms-auto", children: t })
+      children: /* @__PURE__ */ y("div", { className: "container-fluid", children: [
+        e && /* @__PURE__ */ o("span", { className: "navbar-brand mb-0", children: e }),
+        r && /* @__PURE__ */ o("div", { className: "d-flex align-items-center gap-3", children: r }),
+        n && /* @__PURE__ */ o("div", { className: "d-flex align-items-center gap-3 ms-auto", children: n })
       ] })
     }
   );
 }
+const dr = [
+  "primary",
+  "primaryActive",
+  "primaryLight",
+  "primaryInverse",
+  "primaryRgb",
+  "componentActiveColor",
+  "componentActiveBg",
+  "componentHoverColor",
+  "componentHoverBg",
+  "componentCheckedColor",
+  "componentCheckedBg",
+  "menuLinkColorHover",
+  "menuLinkColorShow",
+  "menuLinkColorHere",
+  "menuLinkColorActive"
+];
+function en(e) {
+  if (typeof e != "object" || e === null)
+    return !1;
+  const r = e;
+  if (typeof r.id != "string" || r.id.length === 0 || typeof r.tokens != "object" || r.tokens === null)
+    return !1;
+  const n = r.tokens;
+  return dr.every((t) => typeof n[t] == "string" && n[t].length > 0);
+}
+function ve(e) {
+  const { id: r, primary: n, primaryActive: t, primaryLight: a, primaryInverse: i, primaryRgb: l, swatch: c } = e;
+  return {
+    id: r,
+    ...c !== void 0 ? { swatch: c } : {},
+    tokens: {
+      primary: n,
+      primaryActive: t,
+      primaryLight: a,
+      primaryInverse: i,
+      primaryRgb: l,
+      componentActiveColor: i,
+      componentActiveBg: n,
+      componentHoverColor: t,
+      componentHoverBg: a,
+      componentCheckedColor: i,
+      componentCheckedBg: n,
+      menuLinkColorHover: t,
+      menuLinkColorShow: t,
+      menuLinkColorHere: t,
+      menuLinkColorActive: n
+    }
+  };
+}
+const rn = [
+  ve({
+    id: "blue",
+    primary: "#0d6efd",
+    primaryActive: "#0a58ca",
+    primaryLight: "#cfe2ff",
+    primaryInverse: "#ffffff",
+    primaryRgb: "13, 110, 253"
+  }),
+  ve({
+    id: "indigo",
+    primary: "#6610f2",
+    primaryActive: "#520dc2",
+    primaryLight: "#e0cffc",
+    primaryInverse: "#ffffff",
+    primaryRgb: "102, 16, 242"
+  }),
+  // Deliberately taken from the deeper end of Bootstrap's teal ramp: a scheme
+  // must carry usable contrast values, and `--bs-teal` (#20c997) is a surface
+  // color that measures ~2:1 as text on white.
+  ve({
+    id: "teal",
+    primary: "#13795b",
+    primaryActive: "#0d503c",
+    primaryLight: "#d2f4ea",
+    primaryInverse: "#ffffff",
+    primaryRgb: "19, 121, 91",
+    swatch: "#20c997"
+  }),
+  ve({
+    id: "green",
+    primary: "#198754",
+    primaryActive: "#146c43",
+    primaryLight: "#d1e7dd",
+    primaryInverse: "#ffffff",
+    primaryRgb: "25, 135, 84"
+  })
+], Re = "blue", ce = new Map(rn.map((e) => [e.id, e]));
+function Tt(e) {
+  if (!en(e))
+    throw new Error(
+      "[react-components] registerColorScheme() requires a complete token family: " + dr.join(", ") + "."
+    );
+  ce.set(e.id, e);
+}
+function nn(e) {
+  return ce.get(e);
+}
+function tn() {
+  return [...ce.values()];
+}
+function an(e) {
+  const r = e !== void 0 ? ce.get(e) : void 0;
+  return r || ce.get(Re);
+}
+function on(e) {
+  const r = e.tokens;
+  return {
+    "--bs-primary": r.primary,
+    "--bs-primary-rgb": r.primaryRgb,
+    "--bs-primary-active": r.primaryActive,
+    "--bs-primary-light": r.primaryLight,
+    "--bs-primary-inverse": r.primaryInverse,
+    "--bs-component-active-color": r.componentActiveColor,
+    "--bs-component-active-bg": r.componentActiveBg,
+    "--bs-component-hover-color": r.componentHoverColor,
+    "--bs-component-hover-bg": r.componentHoverBg,
+    "--bs-component-checked-color": r.componentCheckedColor,
+    "--bs-component-checked-bg": r.componentCheckedBg,
+    "--bs-menu-link-color-hover": r.menuLinkColorHover,
+    "--bs-menu-link-color-show": r.menuLinkColorShow,
+    "--bs-menu-link-color-here": r.menuLinkColorHere,
+    "--bs-menu-link-color-active": r.menuLinkColorActive,
+    // This repository's own tokens. Only the theme-independent ones are
+    // published here: these are applied as an inline style on the root, which
+    // outranks every stylesheet rule, so a token whose value depends on the
+    // light/dark theme must not be set from a scheme. The stylesheet resolves
+    // those from the `--bs-*` names above in light mode and derives its own
+    // values under `[data-bs-theme="dark"]`; publishing a light-mode shade here
+    // pinned the dark sidebar's menu links to ~2:1.
+    "--rrc-primary": r.primary,
+    "--rrc-primary-rgb": r.primaryRgb,
+    "--rrc-primary-active": r.primaryActive,
+    "--rrc-primary-inverse": r.primaryInverse,
+    "--rrc-component-active-color": r.componentActiveColor,
+    "--rrc-component-active-bg": r.componentActiveBg,
+    "--rrc-component-hover-bg": r.componentHoverBg,
+    "--rrc-component-checked-color": r.componentCheckedColor,
+    "--rrc-component-checked-bg": r.componentCheckedBg
+  };
+}
+const ur = ["light", "dark", "system"], mr = ["compact", "grouped"], fr = ["light", "dark", "auto"], $e = Ve(void 0);
+function ln(e) {
+  return typeof e == "string" && ur.includes(e);
+}
 function sn(e) {
+  return typeof e == "string" && mr.includes(e);
+}
+function cn(e) {
+  return typeof e == "string" && fr.includes(e);
+}
+function dn(e, r) {
+  let n;
+  try {
+    n = e.getItem(r);
+  } catch {
+    return {};
+  }
+  if (!n)
+    return {};
+  let t;
+  try {
+    t = JSON.parse(n);
+  } catch {
+    return {};
+  }
+  if (typeof t != "object" || t === null)
+    return {};
+  const a = t, i = {};
+  return ln(a.mode) && (i.mode = a.mode), sn(a.sidebarPresentation) && (i.sidebarPresentation = a.sidebarPresentation), cn(a.sidebarTone) && (i.sidebarTone = a.sidebarTone), typeof a.colorSchemeId == "string" && nn(a.colorSchemeId) && (i.colorSchemeId = a.colorSchemeId), i;
+}
+function Vt({
+  children: e,
+  mode: r,
+  defaultMode: n,
+  onModeChange: t,
+  sidebarPresentation: a,
+  defaultSidebarPresentation: i,
+  onSidebarPresentationChange: l,
+  sidebarTone: c,
+  defaultSidebarTone: s,
+  onSidebarToneChange: d,
+  colorSchemeId: u,
+  defaultColorSchemeId: f,
+  onColorSchemeIdChange: m,
+  storage: p,
+  storageKey: k,
+  applyTo: S = "none",
+  themeAttribute: x = "data-bs-theme"
+}) {
+  const [_, C] = T({
+    value: r,
+    defaultValue: n ?? "system",
+    onChange: t
+  }), [v, N] = T({
+    value: a,
+    defaultValue: i ?? "grouped",
+    onChange: l
+  }), [b, w] = T({
+    value: c,
+    defaultValue: s ?? "auto",
+    onChange: d
+  }), [g, I] = T({
+    value: u,
+    defaultValue: f ?? Re,
+    onChange: m
+  }), [D, O] = M("light");
+  U(() => {
+    if (typeof window > "u" || typeof window.matchMedia != "function")
+      return;
+    const E = window.matchMedia("(prefers-color-scheme: dark)");
+    O(E.matches ? "dark" : "light");
+    const B = (z) => O(z.matches ? "dark" : "light");
+    if (typeof E.addEventListener == "function")
+      return E.addEventListener("change", B), () => E.removeEventListener("change", B);
+    if (typeof E.addListener == "function")
+      return E.addListener(B), () => E.removeListener(B);
+  }, []);
+  const q = p !== void 0 && k !== void 0, [G, P] = M(!1), V = {
+    mode: r !== void 0,
+    sidebarPresentation: a !== void 0,
+    sidebarTone: c !== void 0,
+    colorSchemeId: u !== void 0
+  }, A = L(V);
+  A.current = V;
+  const H = L({ setMode: C, setSidebarPresentation: N, setSidebarTone: w, setColorSchemeId: I });
+  H.current = { setMode: C, setSidebarPresentation: N, setSidebarTone: w, setColorSchemeId: I }, U(() => {
+    if (!q)
+      return;
+    const E = dn(p, k), B = A.current, z = H.current;
+    E.mode !== void 0 && !B.mode && z.setMode(E.mode), E.sidebarPresentation !== void 0 && !B.sidebarPresentation && z.setSidebarPresentation(E.sidebarPresentation), E.sidebarTone !== void 0 && !B.sidebarTone && z.setSidebarTone(E.sidebarTone), E.colorSchemeId !== void 0 && !B.colorSchemeId && z.setColorSchemeId(E.colorSchemeId), P(!0);
+  }, [q, p, k]), U(() => {
+    if (!(!q || !G))
+      try {
+        p.setItem(
+          k,
+          JSON.stringify({
+            mode: _,
+            sidebarPresentation: v,
+            sidebarTone: b,
+            colorSchemeId: g
+          })
+        );
+      } catch {
+      }
+  }, [q, G, p, k, _, v, b, g]);
+  const R = _ === "system" ? D : _, Z = an(g), X = J(() => on(Z), [Z]);
+  U(() => {
+    if (S === "none" || typeof document > "u")
+      return;
+    const E = S === "body" ? document.body : document.documentElement;
+    if (!E)
+      return;
+    const B = E.getAttribute(x);
+    E.setAttribute(x, R);
+    for (const [z, ie] of Object.entries(X))
+      E.style.setProperty(z, ie);
+    return () => {
+      B === null ? E.removeAttribute(x) : E.setAttribute(x, B);
+      for (const z of Object.keys(X))
+        E.style.removeProperty(z);
+    };
+  }, [S, x, R, X]);
+  const K = J(
+    () => ({ "data-bs-theme": R, style: X }),
+    [R, X]
+  ), j = J(
+    () => ({
+      mode: _,
+      sidebarPresentation: v,
+      sidebarTone: b,
+      colorSchemeId: g,
+      resolvedTheme: R,
+      systemTheme: D,
+      colorScheme: Z,
+      setMode: C,
+      setSidebarPresentation: N,
+      setSidebarTone: w,
+      setColorSchemeId: I,
+      appearanceProps: K
+    }),
+    [
+      _,
+      v,
+      b,
+      g,
+      R,
+      D,
+      Z,
+      C,
+      N,
+      w,
+      I,
+      K
+    ]
+  );
+  return /* @__PURE__ */ o($e.Provider, { value: j, children: e });
+}
+function Lt() {
+  const e = we($e);
+  if (!e)
+    throw new Error("[react-components] useAppearance() must be used inside an <AppearanceProvider>.");
+  return e;
+}
+function hr() {
+  return we($e);
+}
+function Rt({
+  storageKey: e,
+  themeAttribute: r = "data-bs-theme",
+  target: n = "documentElement",
+  defaultMode: t = "system"
+}) {
+  const a = (d) => JSON.stringify(d).replace(/</g, "\\u003C"), i = a(e), l = a(r), c = a(t), s = n === "body" ? "document.body" : "document.documentElement";
+  return "(function(){try{var raw=window.localStorage.getItem(" + i + ");var mode=" + c + ";if(raw){var parsed=JSON.parse(raw);if(parsed&&typeof parsed.mode==='string'){mode=parsed.mode;}}var dark=mode==='dark'||(mode==='system'&&window.matchMedia('(prefers-color-scheme: dark)').matches);" + s + ".setAttribute(" + l + ",dark?'dark':'light');}catch(e){}})();";
+}
+function un(e) {
+  return e.type === "collapsible" || e.type === "group";
+}
+function pr(e) {
+  return e.type === "collapsible" || e.type === "group" && e.collapsible === !0;
+}
+function Oe(e) {
   return "items" in e;
 }
-function ue({ item: e }) {
-  return /* @__PURE__ */ p(
-    "a",
+function mn(e) {
+  return e.map((r) => Oe(r) ? fn(r) : br(r));
+}
+function fn(e) {
+  return {
+    type: "group",
+    key: e.key,
+    label: e.label,
+    collapsible: !0,
+    children: e.items.map(br)
+  };
+}
+function br(e) {
+  const r = {
+    key: e.key,
+    label: e.label,
+    ...e.icon !== void 0 ? { icon: e.icon } : {},
+    ...e.disabled !== void 0 ? { disabled: e.disabled } : {}
+  }, n = e.onClick ? () => {
+    var t;
+    return (t = e.onClick) == null ? void 0 : t.call(e);
+  } : void 0;
+  return e.href !== void 0 ? { ...r, type: "link", href: e.href, ...n ? { onSelect: n } : {} } : { ...r, type: "action", ...n ? { onSelect: n } : {} };
+}
+function hn(e) {
+  return e.filter(Oe).filter((r) => r.defaultOpen).map((r) => r.key);
+}
+function pn(e) {
+  for (const r of e)
+    if (Oe(r)) {
+      const n = r.items.find((t) => t.active);
+      if (n)
+        return n.key;
+    } else if (r.active)
+      return r.key;
+}
+function bn(e) {
+  const r = /* @__PURE__ */ new Map(), n = [], t = [];
+  function a(l, c, s) {
+    const d = [];
+    for (const u of l) {
+      const f = { item: u, key: u.key, depth: c, ancestors: s, children: [] };
+      r.has(u.key) ? t.push(u.key) : (r.set(u.key, f), n.push(u.key)), un(u) && (f.children = a(u.children, c + 1, [...s, u.key])), d.push(f);
+    }
+    return d;
+  }
+  return { roots: a(e, 0, []), byKey: r, order: n, duplicateKeys: t };
+}
+function le(e, r) {
+  const n = new Set(r), t = e.filter((i) => n.has(i)), a = new Set(t);
+  for (const i of n)
+    a.has(i) || t.push(i);
+  return t;
+}
+function vn(e, r, n, t) {
+  const a = e.byKey.get(n), i = new Set(r);
+  if (i.has(n)) {
+    if (i.delete(n), a)
+      for (const l of vr(a))
+        i.delete(l);
+    return le(e.order, i);
+  }
+  if (t === "single") {
+    const l = new Set(a ? a.ancestors : []);
+    return l.add(n), le(e.order, l);
+  }
+  if (i.add(n), a)
+    for (const l of a.ancestors)
+      i.add(l);
+  return le(e.order, i);
+}
+function Ze(e, r, n, t) {
+  if (n.length === 0)
+    return le(e.order, new Set(r));
+  if (t === "single")
+    return le(e.order, new Set(n));
+  const a = new Set(r);
+  for (const i of n)
+    a.add(i);
+  return le(e.order, a);
+}
+function gn(e, r) {
+  return e.length === r.length && e.every((n, t) => n === r[t]);
+}
+function vr(e) {
+  const r = [];
+  for (const n of e.children)
+    r.push(n.key), r.push(...vr(n));
+  return r;
+}
+function gr(e, r) {
+  var n;
+  return r === void 0 ? [] : ((n = e.byKey.get(r)) == null ? void 0 : n.ancestors) ?? [];
+}
+function Ye(e, r) {
+  return gr(e, r).filter((n) => {
+    const t = e.byKey.get(n);
+    return t !== void 0 && pr(t.item);
+  });
+}
+const yn = typeof document < "u" ? _r : U, Nn = Symbol("unresolved-active-key");
+function kn(e) {
+  if (e.type !== "divider")
+    return e.ariaLabel !== void 0 ? e.ariaLabel : typeof e.label == "string" ? e.label : void 0;
+}
+function wn(e, r) {
+  return `${e}-${r.replace(/[^A-Za-z0-9_-]/g, "_")}`;
+}
+function Ae({ node: e, expandable: r }) {
+  const n = e.item;
+  return n.type === "divider" ? null : /* @__PURE__ */ y(Q, { children: [
+    n.icon !== void 0 && /* @__PURE__ */ o("span", { className: "rrc-sidebar__icon", "aria-hidden": "true", children: n.icon }),
+    /* @__PURE__ */ o("span", { className: "rrc-sidebar__label", children: n.label }),
+    n.badge !== void 0 && /* @__PURE__ */ o("span", { className: "rrc-sidebar__badge", children: n.badge }),
+    r && /* @__PURE__ */ o("span", { className: "rrc-sidebar__arrow", "aria-hidden": "true" })
+  ] });
+}
+function De({ name: e, children: r }) {
+  return e === void 0 ? /* @__PURE__ */ o(Q, { children: r }) : /* @__PURE__ */ o(sr, { content: e, placement: "bottom", wrapperClassName: "rrc-sidebar__tooltip", children: r });
+}
+function _n(e) {
+  if (!e)
+    return;
+  const r = e.getBoundingClientRect(), n = (e.closest(".rrc-sidebar") ?? e).getBoundingClientRect(), t = getComputedStyle(e).direction === "rtl", a = document.documentElement.clientWidth;
+  e.style.setProperty("--rrc-rail-tip-block-start", `${Math.round(r.top + r.height / 2)}px`), e.style.setProperty("--rrc-rail-tip-inline-start", `${Math.round(t ? a - n.left : n.right)}px`);
+}
+function Te(e) {
+  if (!e)
+    return {};
+  const r = (n) => _n(n.currentTarget);
+  return { onPointerEnter: r, onFocusCapture: r };
+}
+function Ne({ node: e, ctx: r }) {
+  const n = e.item, t = L(null), [a, i] = M(!1), l = F(() => i(!1), []);
+  if (yn(() => {
+    const v = t.current;
+    if (!a || !v)
+      return;
+    const N = () => {
+      const b = v.getBoundingClientRect(), w = (v.closest(".rrc-sidebar") ?? v).getBoundingClientRect(), g = getComputedStyle(v).direction === "rtl", I = document.documentElement.clientWidth;
+      v.style.setProperty("--rrc-flyout-block-start", `${Math.round(b.top)}px`), v.style.setProperty("--rrc-flyout-inline-start", `${Math.round(g ? I - w.left : w.right)}px`);
+    };
+    return N(), window.addEventListener("scroll", N, !0), window.addEventListener("resize", N), () => {
+      window.removeEventListener("scroll", N, !0), window.removeEventListener("resize", N);
+    };
+  }, [a]), n.type === "divider")
+    return /* @__PURE__ */ o("li", { role: "none", className: h("rrc-sidebar__divider", n.className), children: /* @__PURE__ */ o(Zr, { className: "my-1" }) });
+  const c = { "--rrc-sidebar-depth": String(Math.max(0, e.depth - r.depthOffset)) }, s = kn(n), d = r.activeKey === n.key, u = r.activeAncestors.has(n.key), f = pr(n), m = f && r.expanded.has(n.key), p = wn(r.idPrefix, n.key), k = h(
+    "rrc-sidebar__row",
+    d && "rrc-sidebar__row--active",
+    u && "rrc-sidebar__row--active-ancestor",
+    n.disabled && "rrc-sidebar__row--disabled",
+    n.className
+  );
+  if (n.type === "link") {
+    const v = (w) => {
+      if (n.disabled) {
+        w.preventDefault();
+        return;
+      }
+      r.select(n, w);
+    }, N = {
+      item: n,
+      href: n.href,
+      className: h(k, "rrc-sidebar__row--link"),
+      style: c,
+      children: /* @__PURE__ */ o(Ae, { node: e, expandable: !1 }),
+      onClick: v,
+      "aria-current": d ? "page" : void 0,
+      "aria-disabled": n.disabled ? !0 : void 0,
+      "aria-label": r.collapsed ? s : void 0,
+      "data-active-ancestor": u ? "true" : void 0,
+      target: n.target,
+      rel: n.rel
+    }, b = r.renderLink ? r.renderLink(N) : /* @__PURE__ */ o(
+      "a",
+      {
+        href: N.href,
+        className: N.className,
+        style: N.style,
+        onClick: N.onClick,
+        "aria-current": N["aria-current"],
+        "aria-disabled": N["aria-disabled"],
+        "aria-label": N["aria-label"],
+        "data-active-ancestor": N["data-active-ancestor"],
+        target: N.target,
+        rel: N.rel,
+        children: N.children
+      }
+    );
+    return /* @__PURE__ */ o("li", { className: "rrc-sidebar__item", ...Te(r.collapsed), children: r.collapsed ? /* @__PURE__ */ o(De, { name: s, children: b }) : b });
+  }
+  if (n.type === "action") {
+    const v = /* @__PURE__ */ o(
+      "button",
+      {
+        type: "button",
+        className: h(k, "rrc-sidebar__row--action"),
+        style: c,
+        disabled: n.disabled,
+        "aria-label": r.collapsed ? s : void 0,
+        "data-active-ancestor": u ? "true" : void 0,
+        "data-active": d ? "true" : void 0,
+        onClick: (N) => r.select(n, N),
+        children: /* @__PURE__ */ o(Ae, { node: e, expandable: !1 })
+      }
+    );
+    return /* @__PURE__ */ o("li", { className: "rrc-sidebar__item", ...Te(r.collapsed), children: r.collapsed ? /* @__PURE__ */ o(De, { name: s, children: v }) : v });
+  }
+  if (!f) {
+    const v = `${p}-title`;
+    return /* @__PURE__ */ y("li", { className: h("rrc-sidebar__item", "rrc-sidebar__group", n.className), children: [
+      /* @__PURE__ */ y("div", { className: "rrc-sidebar__group-title", id: v, style: c, children: [
+        n.icon !== void 0 && /* @__PURE__ */ o("span", { className: "rrc-sidebar__icon", "aria-hidden": "true", children: n.icon }),
+        /* @__PURE__ */ o("span", { className: "rrc-sidebar__label", children: n.label }),
+        n.badge !== void 0 && /* @__PURE__ */ o("span", { className: "rrc-sidebar__badge", children: n.badge })
+      ] }),
+      /* @__PURE__ */ o("ul", { className: "rrc-sidebar__menu rrc-sidebar__submenu", "aria-labelledby": v, children: e.children.map((N) => /* @__PURE__ */ o(Ne, { node: N, ctx: { ...r, depthOffset: r.depthOffset + 1 } }, N.key)) })
+    ] });
+  }
+  const S = /* @__PURE__ */ o("ul", { className: "rrc-sidebar__menu rrc-sidebar__submenu", id: p, children: e.children.map((v) => /* @__PURE__ */ o(Ne, { node: v, ctx: r }, v.key)) }), x = r.collapsed, _ = () => {
+    n.disabled || (x ? i((v) => !v) : r.toggle(n.key));
+  }, C = /* @__PURE__ */ o(
+    "button",
     {
-      href: e.href ?? "#",
-      className: f("nav-link d-flex align-items-center gap-2", e.active && "active", e.disabled && "disabled"),
-      "aria-current": e.active ? "page" : void 0,
-      "aria-disabled": e.disabled,
-      onClick: (n) => {
-        var t;
-        e.href || n.preventDefault(), !e.disabled && ((t = e.onClick) == null || t.call(e));
-      },
+      type: "button",
+      className: h(k, "rrc-sidebar__row--toggle", n.type === "group" && "rrc-sidebar__row--group-toggle"),
+      style: c,
+      disabled: n.disabled,
+      "aria-expanded": x ? a : m,
+      "aria-controls": p,
+      "aria-label": r.collapsed ? s : void 0,
+      "data-active-ancestor": u ? "true" : void 0,
+      onClick: _,
+      children: /* @__PURE__ */ o(Ae, { node: e, expandable: !0 })
+    }
+  );
+  return /* @__PURE__ */ y(
+    "li",
+    {
+      ref: t,
+      className: h("rrc-sidebar__item", x && "rrc-sidebar__item--flyout-anchor"),
+      ...Te(r.collapsed),
       children: [
-        e.icon,
-        e.label
+        x ? /* @__PURE__ */ o(De, { name: s, children: C }) : C,
+        x ? /* @__PURE__ */ o(oe, { open: a, onClose: l, anchorRef: t, className: "rrc-sidebar__flyout", children: /* @__PURE__ */ o("ul", { className: "rrc-sidebar__menu rrc-sidebar__submenu", id: p, children: e.children.map((v) => (
+          // Inside the panel the branch is fully expanded again, and its
+          // rows start flush rather than inheriting the aside's indentation.
+          /* @__PURE__ */ o(Ne, { node: v, ctx: { ...r, collapsed: !1, depthOffset: e.depth + 1 } }, v.key)
+        )) }) }) : m && S
       ]
     }
   );
 }
-function ht({ sections: e, header: n, footer: t, className: r }) {
-  return /* @__PURE__ */ p("div", { className: f("d-flex flex-column h-100", r), children: [
-    n && /* @__PURE__ */ a("div", { className: "p-3 border-bottom", children: n }),
-    /* @__PURE__ */ a("nav", { className: "nav flex-column flex-grow-1 p-2 gap-1", children: e.map(
-      (l) => sn(l) ? /* @__PURE__ */ a(
-        Ye,
-        {
-          className: "border-0",
-          defaultOpenKeys: l.defaultOpen ? [l.key] : [],
-          items: [
-            {
-              key: l.key,
-              header: l.label,
-              content: /* @__PURE__ */ a("div", { className: "nav flex-column ps-2 gap-1", children: l.items.map((i) => /* @__PURE__ */ a(ue, { item: i }, i.key)) })
-            }
-          ]
-        },
-        l.key
-      ) : /* @__PURE__ */ a(ue, { item: l }, l.key)
-    ) }),
-    t && /* @__PURE__ */ a("div", { className: "p-3 border-top", children: t })
-  ] });
+function xn({ collapsed: e, toggle: r, label: n }) {
+  return /* @__PURE__ */ o("button", { type: "button", className: "rrc-sidebar__collapse-btn", "aria-label": n, onClick: r, children: /* @__PURE__ */ o(
+    "svg",
+    {
+      className: h("rrc-sidebar__collapse-icon", e && "rrc-sidebar__collapse-icon--collapsed"),
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: /* @__PURE__ */ o("path", { d: "M14.5 6.5 9 12l5.5 5.5" })
+    }
+  ) });
 }
-function bt({ title: e, description: n, breadcrumbItems: t, actions: r, className: l }) {
-  return /* @__PURE__ */ p("div", { className: f("mb-4", l), children: [
-    t && t.length > 0 && /* @__PURE__ */ a(rn, { items: t, className: "mb-2" }),
-    /* @__PURE__ */ p("div", { className: "d-flex align-items-start justify-content-between gap-3 flex-wrap", children: [
-      /* @__PURE__ */ p("div", { children: [
-        /* @__PURE__ */ a("h1", { className: "h3 mb-1", children: e }),
-        n && /* @__PURE__ */ a("p", { className: "text-body-secondary mb-0", children: n })
+function $t({
+  items: e,
+  sections: r,
+  variant: n,
+  tone: t,
+  activeKey: a,
+  expandActivePath: i = !1,
+  activePathExpansion: l,
+  expandedKeys: c,
+  defaultExpandedKeys: s,
+  onExpandedKeysChange: d,
+  expandMode: u = "multiple",
+  collapsed: f,
+  defaultCollapsed: m,
+  onCollapsedChange: p,
+  collapsible: k = !1,
+  renderCollapseControl: S,
+  collapseLabel: x = "Collapse sidebar",
+  expandLabel: _ = "Expand sidebar",
+  mobileOpen: C,
+  defaultMobileOpen: v,
+  onMobileOpenChange: N,
+  mobileLabel: b,
+  closeMobileOnSelect: w = !0,
+  header: g,
+  footer: I,
+  collapsedFooter: D,
+  className: O,
+  navLabel: q,
+  onSelect: G,
+  renderLink: P
+}) {
+  const V = hr(), A = r ?? [], H = J(
+    () => e !== void 0 ? e : mn(A),
+    // `legacySections` is a fresh array only when `sections` changes.
+    [e, r]
+    // eslint-disable-line react-hooks/exhaustive-deps
+  ), R = J(() => bn(H), [H]), Z = R.duplicateKeys.join(", ");
+  U(() => {
+    process.env.NODE_ENV !== "production" && Z.length > 0 && console.error(
+      "[react-components] Sidebar received duplicate item keys: " + Z + ". Keys must be unique and stable: expansion and active state are keyed by them, so every duplicate shares one identity and the first occurrence in tree order defines it."
+    );
+  }, [Z]);
+  const X = J(() => hn(A), [r]), K = a ?? (e === void 0 ? pn(A) : void 0), j = l ?? (i ? "on-active-change" : "never"), E = L(null);
+  if (E.current === null) {
+    const $ = s ?? X;
+    E.current = j === "never" ? $ : Ze(R, $, Ye(R, K), u);
+  }
+  const [B, z] = T({
+    value: c,
+    defaultValue: E.current,
+    onChange: d
+  }), [ie, kr] = T({
+    value: f,
+    defaultValue: m ?? !1,
+    onChange: p
+  }), [ee, he] = T({
+    value: C,
+    defaultValue: v ?? !1,
+    onChange: N
+  }), re = K, pe = J(
+    () => new Set(gr(R, re)),
+    [R, re]
+  ), Me = J(() => {
+    const $ = new Set(B);
+    if (j === "always")
+      for (const ne of pe)
+        $.add(ne);
+    return $;
+  }, [B, j, pe]), Ce = L(B);
+  Ce.current = B;
+  const Ie = L(Nn);
+  U(() => {
+    if (j !== "on-active-change") {
+      Ie.current = re;
+      return;
+    }
+    if (Ie.current === re)
+      return;
+    Ie.current = re;
+    const $ = Ye(R, re);
+    if ($.length === 0)
+      return;
+    const ne = Ze(R, Ce.current, $, u);
+    gn(ne, Ce.current) || z(ne);
+  }, [j, re, R, u, z]);
+  const Pe = F(
+    ($) => z(vn(R, B, $, u)),
+    [R, B, u, z]
+  ), Ke = F(() => he(!1), [he]);
+  _e(ee, Ke);
+  const Ee = L(null);
+  U(() => {
+    if (typeof document > "u")
+      return;
+    if (ee) {
+      Ee.current = document.activeElement;
+      return;
+    }
+    const $ = Ee.current;
+    Ee.current = null, $ instanceof HTMLElement && $.isConnected && $.focus();
+  }, [ee]);
+  const Be = F(
+    ($, ne) => {
+      var ze;
+      $.disabled || ((ze = $.onSelect) == null || ze.call($, $, ne), G == null || G($, ne), w && ee && he(!1));
+    },
+    [G, w, ee, he]
+  ), Fe = W(), be = n ?? (V == null ? void 0 : V.sidebarPresentation) ?? "grouped", He = t ?? (V == null ? void 0 : V.sidebarTone) ?? "auto", se = ie && !ee, wr = J(
+    () => ({
+      variant: be,
+      collapsed: se,
+      expanded: Me,
+      activeKey: re,
+      activeAncestors: pe,
+      toggle: Pe,
+      select: Be,
+      renderLink: P,
+      idPrefix: Fe,
+      depthOffset: 0
+    }),
+    [be, se, Me, re, pe, Pe, Be, P, Fe]
+  ), je = {
+    collapsed: ie,
+    toggle: () => kr(!ie),
+    label: ie ? _ : x
+  }, Ue = se ? D : I, qe = /* @__PURE__ */ y(
+    "aside",
+    {
+      className: h(
+        "rrc-sidebar",
+        `rrc-sidebar--${be}`,
+        se ? "rrc-sidebar--collapsed" : "rrc-sidebar--expanded",
+        ee && "rrc-sidebar--mobile-open",
+        O
+      ),
+      "data-variant": be,
+      "data-collapsed": se ? "true" : "false",
+      "data-bs-theme": He === "auto" ? void 0 : He,
+      ...ee ? { role: "dialog", "aria-modal": !0, "aria-label": b ?? q } : {},
+      children: [
+        /* @__PURE__ */ y("div", { className: "rrc-sidebar__panel", children: [
+          (g !== void 0 || k) && /* @__PURE__ */ o("div", { className: "rrc-sidebar__header", children: g !== void 0 && /* @__PURE__ */ o("div", { className: "rrc-sidebar__brand", children: g }) }),
+          /* @__PURE__ */ o("nav", { className: "rrc-sidebar__body", "aria-label": q, children: /* @__PURE__ */ o("ul", { className: "rrc-sidebar__menu rrc-sidebar__menu--root", children: R.roots.map(($) => /* @__PURE__ */ o(Ne, { node: $, ctx: wr }, $.key)) }) }),
+          Ue !== void 0 && /* @__PURE__ */ o("div", { className: "rrc-sidebar__footer", children: Ue })
+        ] }),
+        k && /* @__PURE__ */ o("div", { className: "rrc-sidebar__collapse", children: S ? S(je) : /* @__PURE__ */ o(xn, { ...je }) })
+      ]
+    }
+  );
+  return ee ? /* @__PURE__ */ y("div", { className: "rrc-sidebar-drawer", children: [
+    /* @__PURE__ */ o("div", { className: "rrc-sidebar-drawer__backdrop", onClick: Ke, "data-testid": "rrc-sidebar-backdrop" }),
+    qe
+  ] }) : qe;
+}
+function Ot({ title: e, description: r, breadcrumbItems: n, actions: t, className: a }) {
+  return /* @__PURE__ */ y("div", { className: h("mb-4", "rrc-page-header", a), children: [
+    n && n.length > 0 && /* @__PURE__ */ o(Yr, { items: n, className: "mb-2 rrc-page-header__breadcrumb" }),
+    /* @__PURE__ */ y("div", { className: "d-flex align-items-start justify-content-between gap-3 flex-wrap rrc-page-header__row", children: [
+      /* @__PURE__ */ y("div", { children: [
+        /* @__PURE__ */ o("h1", { className: "h3 mb-1 rrc-page-header__title", children: e }),
+        r && /* @__PURE__ */ o("p", { className: "text-body-secondary mb-0 rrc-page-header__description", children: r })
       ] }),
-      r && /* @__PURE__ */ a("div", { className: "d-flex align-items-center gap-2", children: r })
+      t && /* @__PURE__ */ o("div", { className: "d-flex align-items-center gap-2 rrc-page-header__actions", children: t })
     ] })
   ] });
 }
-const on = {
+const Sn = {
   xs: 1,
   sm: 2,
   md: 3,
   lg: 4,
   xl: 5
 };
-function cn(e) {
-  return typeof e == "number" ? e : on[e];
+function Cn(e) {
+  return typeof e == "number" ? e : Sn[e];
 }
-function pt({ direction: e = "row", gap: n = "sm", grow: t, shrink: r, fullWidth: l, className: i, ...o }) {
-  return /* @__PURE__ */ a(
-    Se,
+function Mt({ direction: e = "row", gap: r = "sm", grow: n, shrink: t, fullWidth: a, className: i, ...l }) {
+  return /* @__PURE__ */ o(
+    cr,
     {
       direction: e,
-      gap: cn(n),
-      className: f(t && "flex-grow-1", r && "flex-shrink-0", l && "w-100", i),
-      ...o
+      gap: Cn(r),
+      className: h("rrc-flex", n && "flex-grow-1", t && "flex-shrink-0", a && "w-100", i),
+      ...l
     }
   );
 }
-function vt({ icon: e, "aria-label": n, iconSize: t, tooltip: r, variant: l = "light", loading: i, className: o, ...c }) {
-  const s = /* @__PURE__ */ a(te, { variant: l, loading: i, className: f("btn-icon", o), "aria-label": n, ...c, children: !i && /* @__PURE__ */ a(se, { name: e, size: t }) });
-  return r ? /* @__PURE__ */ a(Qe, { content: r, children: s }) : s;
+function Pt({ icon: e, "aria-label": r, iconSize: n, tooltip: t, variant: a = "light", loading: i, className: l, ...c }) {
+  const s = /* @__PURE__ */ o(ke, { variant: a, loading: i, className: h("btn-icon", "rrc-btn-icon", l), "aria-label": r, ...c, children: !i && /* @__PURE__ */ o(Le, { name: e, size: n }) });
+  return t ? /* @__PURE__ */ o(sr, { content: t, children: s }) : s;
 }
-function gt({ leading: e, title: n, description: t, trailing: r, onClick: l, disabled: i, dense: o, className: c }) {
-  const s = /* @__PURE__ */ p(H, { children: [
-    e && /* @__PURE__ */ a("span", { className: "flex-shrink-0 d-inline-flex align-items-center", children: e }),
-    /* @__PURE__ */ p("span", { className: "flex-grow-1", style: { minWidth: 0 }, children: [
-      /* @__PURE__ */ a("span", { className: "d-block text-truncate", children: n }),
-      t && /* @__PURE__ */ a("span", { className: "d-block text-truncate small text-body-secondary", children: t })
+function Kt({ leading: e, title: r, description: n, trailing: t, onClick: a, disabled: i, dense: l, className: c }) {
+  const s = /* @__PURE__ */ y(Q, { children: [
+    e && /* @__PURE__ */ o("span", { className: "flex-shrink-0 d-inline-flex align-items-center rrc-list-item__leading", children: e }),
+    /* @__PURE__ */ y("span", { className: "flex-grow-1", style: { minWidth: 0 }, children: [
+      /* @__PURE__ */ o("span", { className: "d-block text-truncate rrc-list-item__title", children: r }),
+      n && /* @__PURE__ */ o("span", { className: "d-block text-truncate small text-body-secondary rrc-list-item__description", children: n })
     ] }),
-    r && /* @__PURE__ */ a("span", { className: "flex-shrink-0 d-inline-flex align-items-center", children: r })
-  ] }), d = f(
+    t && /* @__PURE__ */ o("span", { className: "flex-shrink-0 d-inline-flex align-items-center rrc-list-item__trailing", children: t })
+  ] }), d = h(
     "d-flex align-items-center text-start",
-    o ? "gap-2 py-1" : "gap-3 py-2",
-    l && "w-100 border-0 bg-transparent",
+    "rrc-list-item",
+    a && "rrc-list-item--interactive",
+    l ? "gap-2 py-1" : "gap-3 py-2",
+    a && "w-100 border-0 bg-transparent",
     i && "opacity-50",
     c
   );
-  return l ? /* @__PURE__ */ a("button", { type: "button", className: d, onClick: l, disabled: i, children: s }) : /* @__PURE__ */ a("div", { className: d, "aria-disabled": i || void 0, children: s });
+  return a ? /* @__PURE__ */ o("button", { type: "button", className: d, onClick: a, disabled: i, children: s }) : /* @__PURE__ */ o("div", { className: d, "aria-disabled": i || void 0, children: s });
 }
-function dn(e, n, t, r) {
+function In(e, r, n, t) {
   if (e.length === 0)
     return [];
-  const l = Math.min(...e), o = Math.max(...e) - l || 1, c = n - r * 2, s = t - r * 2, d = e.length > 1 ? c / (e.length - 1) : 0;
-  return e.map((u, h) => {
-    const m = r + d * h, v = r + s - (u - l) / o * s;
-    return [m, v];
+  const a = Math.min(...e), l = Math.max(...e) - a || 1, c = r - t * 2, s = n - t * 2, d = e.length > 1 ? c / (e.length - 1) : 0;
+  return e.map((u, f) => {
+    const m = t + d * f, p = t + s - (u - a) / l * s;
+    return [m, p];
   });
 }
-function un({ type: e, data: n, width: t, height: r, strokeWidth: l }) {
-  const i = l, o = dn(n, t, r, i);
-  if (o.length === 0)
+function En({ type: e, data: r, width: n, height: t, strokeWidth: a }) {
+  const i = a, l = In(r, n, t, i);
+  if (l.length === 0)
     return null;
-  const c = o.map(([s, d]) => `${s},${d}`).join(" ");
-  return /* @__PURE__ */ p(H, { children: [
-    e === "area" && /* @__PURE__ */ a(
+  const c = l.map(([s, d]) => `${s},${d}`).join(" ");
+  return /* @__PURE__ */ y(Q, { children: [
+    e === "area" && /* @__PURE__ */ o(
       "polygon",
       {
-        points: `${i},${r - i} ${c} ${t - i},${r - i}`,
+        points: `${i},${t - i} ${c} ${n - i},${t - i}`,
         fill: "currentColor",
         opacity: 0.2,
         stroke: "none"
       }
     ),
-    /* @__PURE__ */ a("polyline", { points: c, fill: "none", stroke: "currentColor", strokeWidth: l, strokeLinecap: "round", strokeLinejoin: "round" })
+    /* @__PURE__ */ o("polyline", { points: c, fill: "none", stroke: "currentColor", strokeWidth: a, strokeLinecap: "round", strokeLinejoin: "round" })
   ] });
 }
-function fn({ data: e, width: n, height: t }) {
+function An({ data: e, width: r, height: n }) {
   if (e.length === 0)
     return null;
-  const r = Math.min(0, ...e), i = Math.max(0, ...e) - r || 1, o = 2, c = Math.max((n - o * (e.length - 1)) / e.length, 1);
-  return /* @__PURE__ */ a(H, { children: e.map((s, d) => {
-    const u = Math.max((s - r) / i * t, 1), h = d * (c + o), m = t - u;
-    return /* @__PURE__ */ a("rect", { x: h, y: m, width: c, height: u, rx: 1, fill: "currentColor" }, d);
+  const t = Math.min(0, ...e), i = Math.max(0, ...e) - t || 1, l = 2, c = Math.max((r - l * (e.length - 1)) / e.length, 1);
+  return /* @__PURE__ */ o(Q, { children: e.map((s, d) => {
+    const u = Math.max((s - t) / i * n, 1), f = d * (c + l), m = n - u;
+    return /* @__PURE__ */ o("rect", { x: f, y: m, width: c, height: u, rx: 1, fill: "currentColor" }, d);
   }) });
 }
-function yt({ type: e = "line", data: n, tone: t = "primary", width: r = 80, height: l = 28, strokeWidth: i = 2, className: o, label: c }) {
-  return /* @__PURE__ */ a(
+function Bt({ type: e = "line", data: r, tone: n = "primary", width: t = 80, height: a = 28, strokeWidth: i = 2, className: l, label: c }) {
+  return /* @__PURE__ */ o(
     "svg",
     {
-      width: r,
-      height: l,
-      viewBox: `0 0 ${r} ${l}`,
-      className: f(`text-${t}`, o),
+      width: t,
+      height: a,
+      viewBox: `0 0 ${t} ${a}`,
+      className: h(`text-${n}`, "rrc-sparkline", l),
       role: c ? "img" : void 0,
       "aria-label": c,
       "aria-hidden": c ? void 0 : !0,
-      children: e === "bar" ? /* @__PURE__ */ a(fn, { data: n, width: r, height: l }) : /* @__PURE__ */ a(un, { type: e, data: n, width: r, height: l, strokeWidth: i })
+      children: e === "bar" ? /* @__PURE__ */ o(An, { data: r, width: t, height: a }) : /* @__PURE__ */ o(En, { type: e, data: r, width: t, height: a, strokeWidth: i })
     }
   );
 }
-const mn = {
+const Dn = {
   up: "success",
   down: "danger",
   neutral: "muted"
-}, hn = {
+}, Tn = {
   up: "bi bi-arrow-up-short",
   down: "bi bi-arrow-down-short",
   neutral: "bi bi-dash"
 };
-function bn(e, n) {
-  return typeof e == "number" && n != null ? e.toFixed(n) : String(e);
-}
-function Nt({ label: e, value: n, prefix: t, suffix: r, precision: l, trend: i, delta: o, loading: c, className: s }) {
-  return /* @__PURE__ */ p("div", { className: f("d-flex flex-column gap-1", s), children: [
-    /* @__PURE__ */ a(q, { size: "sm", tone: "muted", children: e }),
-    c ? /* @__PURE__ */ a(ee, { height: "1.75rem", width: "60%" }) : /* @__PURE__ */ p("div", { className: "d-flex align-items-baseline gap-1", children: [
-      t && /* @__PURE__ */ a(q, { size: "lg", weight: "semibold", children: t }),
-      /* @__PURE__ */ a(q, { size: "xl", weight: "bold", children: bn(n, l) }),
-      r && /* @__PURE__ */ a(q, { size: "lg", weight: "semibold", children: r })
+function Vn(e, r) {
+  return typeof e == "number" && r != null ? e.toFixed(r) : String(e);
+}
+function Ft({ label: e, value: r, prefix: n, suffix: t, precision: a, trend: i, delta: l, loading: c, className: s }) {
+  return /* @__PURE__ */ y("div", { className: h("d-flex flex-column gap-1", "rrc-statistic", s), children: [
+    /* @__PURE__ */ o(te, { size: "sm", tone: "muted", children: e }),
+    c ? /* @__PURE__ */ o(ye, { height: "1.75rem", width: "60%" }) : /* @__PURE__ */ y("div", { className: "d-flex align-items-baseline gap-1", children: [
+      n && /* @__PURE__ */ o(te, { size: "lg", weight: "semibold", children: n }),
+      /* @__PURE__ */ o(te, { size: "xl", weight: "bold", children: Vn(r, a) }),
+      t && /* @__PURE__ */ o(te, { size: "lg", weight: "semibold", children: t })
     ] }),
-    !c && (i || o != null) && /* @__PURE__ */ p(q, { size: "sm", tone: i ? mn[i] : "muted", className: "d-inline-flex align-items-center gap-1", children: [
-      i && /* @__PURE__ */ a(se, { name: hn[i], size: "sm" }),
-      o
+    !c && (i || l != null) && /* @__PURE__ */ y(te, { size: "sm", tone: i ? Dn[i] : "muted", className: "d-inline-flex align-items-center gap-1", children: [
+      i && /* @__PURE__ */ o(Le, { name: Tn[i], size: "sm" }),
+      l
     ] })
   ] });
 }
-class pn extends Error {
-  constructor(n, t, r) {
-    super(`HTTP ${n} ${t} for ${r}`), this.name = "HttpError", this.status = n, this.statusText = t, this.url = r;
+function ge({
+  title: e,
+  options: r,
+  value: n,
+  onChange: t,
+  className: a
+}) {
+  const i = W(), l = L([]);
+  function c(d, u) {
+    var p;
+    if (r.length === 0)
+      return;
+    const f = (d + u + r.length) % r.length, m = r[f];
+    m && (t(m.value), (p = l.current[f]) == null || p.focus());
+  }
+  function s(d) {
+    const u = r.findIndex((f) => f.value === n);
+    d.key === "ArrowDown" || d.key === "ArrowRight" ? (d.preventDefault(), c(u, 1)) : (d.key === "ArrowUp" || d.key === "ArrowLeft") && (d.preventDefault(), c(u, -1));
+  }
+  return /* @__PURE__ */ y("div", { className: h("rrc-appearance__section", a), children: [
+    /* @__PURE__ */ o("div", { className: "rrc-appearance__title", id: i, children: e }),
+    /* @__PURE__ */ o("div", { className: "rrc-appearance__options", role: "radiogroup", "aria-labelledby": i, onKeyDown: s, children: r.map((d, u) => {
+      const f = d.value === n;
+      return /* @__PURE__ */ y(
+        "button",
+        {
+          ref: (m) => {
+            l.current[u] = m;
+          },
+          type: "button",
+          role: "radio",
+          "aria-checked": f,
+          tabIndex: f ? 0 : -1,
+          className: h("rrc-appearance__option", f && "rrc-appearance__option--selected"),
+          onClick: () => t(d.value),
+          children: [
+            d.adornment,
+            /* @__PURE__ */ o("span", { className: "rrc-appearance__option-label", children: d.label }),
+            /* @__PURE__ */ o("span", { className: "rrc-appearance__check", "aria-hidden": "true" })
+          ]
+        },
+        d.value
+      );
+    }) })
+  ] });
+}
+function Ht({
+  labels: e,
+  sections: r,
+  className: n,
+  mode: t,
+  onModeChange: a,
+  sidebarPresentation: i,
+  onSidebarPresentationChange: l,
+  sidebarTone: c,
+  onSidebarToneChange: s,
+  colorSchemeId: d,
+  onColorSchemeIdChange: u,
+  colorSchemes: f
+}) {
+  const m = hr(), p = {
+    presentation: (r == null ? void 0 : r.presentation) ?? !0,
+    mode: (r == null ? void 0 : r.mode) ?? !0,
+    tone: (r == null ? void 0 : r.tone) ?? !0,
+    colorScheme: (r == null ? void 0 : r.colorScheme) ?? !0
+  }, k = t ?? (m == null ? void 0 : m.mode) ?? "system", S = i ?? (m == null ? void 0 : m.sidebarPresentation) ?? "grouped", x = c ?? (m == null ? void 0 : m.sidebarTone) ?? "auto", _ = d ?? (m == null ? void 0 : m.colorSchemeId) ?? Re, C = (g) => {
+    a == null || a(g), t === void 0 && (m == null || m.setMode(g));
+  }, v = (g) => {
+    l == null || l(g), i === void 0 && (m == null || m.setSidebarPresentation(g));
+  }, N = (g) => {
+    s == null || s(g), c === void 0 && (m == null || m.setSidebarTone(g));
+  }, b = (g) => {
+    u == null || u(g), d === void 0 && (m == null || m.setColorSchemeId(g));
+  }, w = f ?? tn();
+  return /* @__PURE__ */ y("div", { className: h("rrc-appearance", n), children: [
+    p.presentation && /* @__PURE__ */ o(
+      ge,
+      {
+        title: e.presentation.title,
+        value: S,
+        onChange: v,
+        options: mr.map((g) => ({ value: g, label: e.presentation[g] }))
+      }
+    ),
+    p.mode && /* @__PURE__ */ o(
+      ge,
+      {
+        title: e.mode.title,
+        value: k,
+        onChange: C,
+        options: ur.map((g) => ({ value: g, label: e.mode[g] }))
+      }
+    ),
+    p.tone && /* @__PURE__ */ o(
+      ge,
+      {
+        title: e.tone.title,
+        value: x,
+        onChange: N,
+        options: fr.map((g) => ({ value: g, label: e.tone[g] }))
+      }
+    ),
+    p.colorScheme && /* @__PURE__ */ o(
+      ge,
+      {
+        title: e.colorScheme.title,
+        value: _,
+        onChange: b,
+        className: "rrc-appearance__section--schemes",
+        options: w.map((g) => ({
+          value: g.id,
+          // Falls back to the registered identifier rather than to invented
+          // English copy, so a swatch always has a real accessible name.
+          label: e.colorScheme.options[g.id] ?? g.id,
+          adornment: /* @__PURE__ */ o(
+            "span",
+            {
+              className: "rrc-appearance__swatch",
+              style: { backgroundColor: g.swatch ?? g.tokens.primary },
+              "aria-hidden": "true"
+            }
+          )
+        }))
+      }
+    )
+  ] });
+}
+class Ln extends Error {
+  constructor(r, n, t) {
+    super(`HTTP ${r} ${n} for ${t}`), this.name = "HttpError", this.status = r, this.statusText = n, this.url = t;
   }
 }
-function vn(e) {
+function Rn(e) {
   if (!e)
     return "";
-  const n = new URLSearchParams();
-  for (const [r, l] of Object.entries(e))
-    l != null && n.set(r, String(l));
-  const t = n.toString();
-  return t ? `?${t}` : "";
-}
-function gn(e = {}) {
-  const { baseUrl: n = "", fetcher: t = fetch, buildRequestInit: r } = e;
+  const r = new URLSearchParams();
+  for (const [t, a] of Object.entries(e))
+    a != null && r.set(t, String(a));
+  const n = r.toString();
+  return n ? `?${n}` : "";
+}
+function $n(e = {}) {
+  const { baseUrl: r = "", fetcher: n = fetch, buildRequestInit: t } = e;
   return {
-    async get(l, i = {}) {
-      const o = `${n}${l}${vn(i.params)}`;
+    async get(a, i = {}) {
+      const l = `${r}${a}${Rn(i.params)}`;
       let c = { method: "GET", signal: i.signal };
-      r && (c = r(o, c));
-      const s = await t(o, c);
+      t && (c = t(l, c));
+      const s = await n(l, c);
       if (!s.ok)
-        throw new pn(s.status, s.statusText, o);
+        throw new Ln(s.status, s.statusText, l);
       return await s.json();
     }
   };
 }
-const yn = gn();
-function Nn(e) {
-  return Object.keys(e).sort().reduce((n, t) => (n[t] = e[t], n), {});
+const On = $n();
+function Mn(e) {
+  return Object.keys(e).sort().reduce((r, n) => (r[n] = e[n], r), {});
 }
-function Y({
-  client: e = yn,
-  url: n,
-  params: t,
-  mapResponse: r,
-  enabled: l = !0
+function ue({
+  client: e = On,
+  url: r,
+  params: n,
+  mapResponse: t,
+  enabled: a = !0
 }) {
-  const [i, o] = M("idle"), [c, s] = M([]), [d, u] = M(null), [h, m] = M(0), v = ne(() => t ? JSON.stringify(Nn(t)) : "", [t]), g = O(0), w = O(r);
-  w.current = r, _(() => {
-    if (!l || !n) {
-      o("idle"), s([]), u(null);
+  const [i, l] = M("idle"), [c, s] = M([]), [d, u] = M(null), [f, m] = M(0), p = J(() => n ? JSON.stringify(Mn(n)) : "", [n]), k = L(0), S = L(t);
+  S.current = t, U(() => {
+    if (!a || !r) {
+      l("idle"), s([]), u(null);
       return;
     }
-    const y = ++g.current, S = new AbortController();
-    return o("loading"), u(null), e.get(n, { params: t, signal: S.signal }).then((x) => {
-      if (y !== g.current)
+    const _ = ++k.current, C = new AbortController();
+    return l("loading"), u(null), e.get(r, { params: n, signal: C.signal }).then((v) => {
+      if (_ !== k.current)
         return;
-      const I = w.current(x);
-      s(I), o(I.length === 0 ? "empty" : "success");
-    }).catch((x) => {
-      y === g.current && (x instanceof DOMException && x.name === "AbortError" || (u(x instanceof Error ? x : new Error(String(x))), o("error")));
+      const N = S.current(v);
+      s(N), l(N.length === 0 ? "empty" : "success");
+    }).catch((v) => {
+      _ === k.current && (v instanceof DOMException && v.name === "AbortError" || (u(v instanceof Error ? v : new Error(String(v))), l("error")));
     }), () => {
-      S.abort();
+      C.abort();
     };
-  }, [e, n, v, l, h]);
-  const k = A(() => m((y) => y + 1), []);
-  return { state: i, items: c, error: d, reload: k };
-}
-function xn(e, n) {
-  const [t, r] = M(e);
-  return _(() => {
-    const l = setTimeout(() => r(e), n);
-    return () => clearTimeout(l);
-  }, [e, n]), t;
-}
-function Q(e) {
+  }, [e, r, p, a, f]);
+  const x = F(() => m((_) => _ + 1), []);
+  return { state: i, items: c, error: d, reload: x };
+}
+function Pn(e, r) {
+  const [n, t] = M(e);
+  return U(() => {
+    const a = setTimeout(() => t(e), r);
+    return () => clearTimeout(a);
+  }, [e, r]), n;
+}
+function me(e) {
   if (Array.isArray(e))
     return e;
   if (e && typeof e == "object" && Array.isArray(e.items))
@@ -1882,497 +2739,518 @@ function Q(e) {
     "Unable to normalize remote response into an array. Provide an explicit `mapResponse` for this endpoint's response shape."
   );
 }
-function le(e, n, t) {
+function Se(e, r, n) {
   if (e === null || typeof e != "object")
     throw new Error("Remote item is not an object; cannot read valueMember/displayMember from it.");
-  const r = e;
+  const t = e;
   return {
-    value: r[n],
-    label: String(r[t] ?? "")
+    value: t[r],
+    label: String(t[n] ?? "")
   };
 }
-function wn({
+function Kn({
   url: e,
-  params: n,
-  valueMember: t,
-  displayMember: r,
-  mapResponse: l,
+  params: r,
+  valueMember: n,
+  displayMember: t,
+  mapResponse: a,
   client: i,
-  enabled: o,
+  enabled: l,
   ...c
 }) {
-  const { state: s, items: d, error: u } = Y({
+  const { state: s, items: d, error: u } = ue({
     client: i,
     url: e,
-    params: n,
-    enabled: o,
-    mapResponse: (m) => (l ? l(m) : Q(m)).map((g) => le(g, t, r))
-  }), h = c.error ?? (s === "error" ? (u == null ? void 0 : u.message) ?? "Failed to load options" : void 0);
-  return /* @__PURE__ */ a(Re, { ...c, options: d, loading: s === "loading", error: h });
+    params: r,
+    enabled: l,
+    mapResponse: (m) => (a ? a(m) : me(m)).map((k) => Se(k, n, t))
+  }), f = c.error ?? (s === "error" ? (u == null ? void 0 : u.message) ?? "Failed to load options" : void 0);
+  return /* @__PURE__ */ o(Ar, { ...c, options: d, loading: s === "loading", error: f });
 }
-function xt({
+function jt({
   url: e,
-  params: n,
-  searchParam: t,
-  valueMember: r,
-  displayMember: l,
+  params: r,
+  searchParam: n,
+  valueMember: t,
+  displayMember: a,
   mapResponse: i,
-  minSearchLength: o = 1,
+  minSearchLength: l = 1,
   debounceMs: c = 300,
   client: s,
   inputValue: d,
   onInputValueChange: u,
-  ...h
+  ...f
 }) {
-  const [m, v] = T({
+  const [m, p] = T({
     value: d,
     defaultValue: "",
     onChange: u
-  }), g = xn(m, c), w = g.length >= o, { state: k, items: y, error: S } = Y({
+  }), k = Pn(m, c), S = k.length >= l, { state: x, items: _, error: C } = ue({
     client: s,
     url: e,
-    enabled: w,
-    params: { ...n, [t]: g },
-    mapResponse: (I) => (i ? i(I) : Q(I)).map((N) => le(N, r, l))
-  }), x = h.error ?? (k === "error" ? (S == null ? void 0 : S.message) ?? "Failed to load suggestions" : void 0);
-  return /* @__PURE__ */ a(
-    Le,
+    enabled: S,
+    params: { ...r, [n]: k },
+    mapResponse: (N) => (i ? i(N) : me(N)).map((w) => Se(w, t, a))
+  }), v = f.error ?? (x === "error" ? (C == null ? void 0 : C.message) ?? "Failed to load suggestions" : void 0);
+  return /* @__PURE__ */ o(
+    Tr,
     {
-      ...h,
-      options: y,
-      loading: k === "loading",
-      error: x,
+      ...f,
+      options: _,
+      loading: x === "loading",
+      error: v,
       inputValue: m,
-      onInputValueChange: v,
+      onInputValueChange: p,
       filter: () => !0
     }
   );
 }
-function kn({
+function Bn({
   url: e,
-  params: n,
-  mapResponse: t,
-  getTotalCount: r,
-  pageSize: l = 20,
+  params: r,
+  mapResponse: n,
+  getTotalCount: t,
+  pageSize: a = 20,
   client: i,
-  ...o
+  ...l
 }) {
-  const [c, s] = M(1), [d, u] = M(null), h = ne(() => JSON.stringify(n ?? {}), [n]), m = O(!0);
-  _(() => {
+  const [c, s] = M(1), [d, u] = M(null), f = J(() => JSON.stringify(r ?? {}), [r]), m = L(!0);
+  U(() => {
     if (m.current) {
       m.current = !1;
       return;
     }
     s(1);
-  }, [h]);
-  const v = ne(
+  }, [f]);
+  const p = J(
     () => ({
-      ...n,
+      ...r,
       page: c,
-      pageSize: l,
+      pageSize: a,
       ...d ? { sortKey: d.key, sortDirection: d.direction } : {}
     }),
-    [n, c, l, d]
-  ), g = O(void 0), { state: w, items: k, error: y } = Y({
+    [r, c, a, d]
+  ), k = L(void 0), { state: S, items: x, error: _ } = ue({
     client: i,
     url: e,
-    params: v,
-    mapResponse: (N) => (g.current = N, t ? t(N) : Q(N))
-  }), S = g.current !== void 0 ? r == null ? void 0 : r(g.current) : void 0, I = k.length >= l && l > 0 ? c * l + 1 : (c - 1) * l + k.length, b = S ?? I;
-  return /* @__PURE__ */ a(
-    Ue,
+    params: p,
+    mapResponse: (w) => (k.current = w, n ? n(w) : me(w))
+  }), C = k.current !== void 0 ? t == null ? void 0 : t(k.current) : void 0, N = x.length >= a && a > 0 ? c * a + 1 : (c - 1) * a + x.length, b = C ?? N;
+  return /* @__PURE__ */ o(
+    Kr,
     {
-      ...o,
-      rows: k,
-      loading: w === "loading",
-      error: y == null ? void 0 : y.message,
+      ...l,
+      rows: x,
+      loading: S === "loading",
+      error: _ == null ? void 0 : _.message,
       page: c,
-      pageSize: l,
+      pageSize: a,
       totalCount: b,
       onPageChange: s,
       sort: d,
-      onSortChange: (N) => {
-        u(N), s(1);
+      onSortChange: (w) => {
+        u(w), s(1);
       }
     }
   );
 }
-function wt({
+function Ut({
   url: e,
-  params: n,
-  valueMember: t,
-  displayMember: r,
-  mapResponse: l,
+  params: r,
+  valueMember: n,
+  displayMember: t,
+  mapResponse: a,
   client: i,
-  enabled: o,
+  enabled: l,
   ...c
 }) {
-  const { state: s, items: d, error: u } = Y({
+  const { state: s, items: d, error: u } = ue({
     client: i,
     url: e,
-    params: n,
-    enabled: o,
-    mapResponse: (m) => (l ? l(m) : Q(m)).map((g) => le(g, t, r))
-  }), h = c.error ?? (s === "error" ? (u == null ? void 0 : u.message) ?? "Failed to load options" : void 0);
-  return /* @__PURE__ */ a(Ee, { ...c, options: d, loading: s === "loading", error: h });
+    params: r,
+    enabled: l,
+    mapResponse: (m) => (a ? a(m) : me(m)).map((k) => Se(k, n, t))
+  }), f = c.error ?? (s === "error" ? (u == null ? void 0 : u.message) ?? "Failed to load options" : void 0);
+  return /* @__PURE__ */ o(Cr, { ...c, options: d, loading: s === "loading", error: f });
 }
-function kt({
+function qt({
   url: e,
-  params: n,
-  valueMember: t,
-  displayMember: r,
-  mapResponse: l,
+  params: r,
+  valueMember: n,
+  displayMember: t,
+  mapResponse: a,
   client: i,
-  enabled: o,
+  enabled: l,
   ...c
 }) {
-  const { state: s, items: d, error: u } = Y({
+  const { state: s, items: d, error: u } = ue({
     client: i,
     url: e,
-    params: n,
-    enabled: o,
-    mapResponse: (m) => (l ? l(m) : Q(m)).map((g) => le(g, t, r))
-  }), h = c.error ?? (s === "error" ? (u == null ? void 0 : u.message) ?? "Failed to load options" : void 0);
-  return /* @__PURE__ */ a(Me, { ...c, options: d, loading: s === "loading", error: h });
-}
-function St() {
-  const e = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Set();
+    params: r,
+    enabled: l,
+    mapResponse: (m) => (a ? a(m) : me(m)).map((k) => Se(k, n, t))
+  }), f = c.error ?? (s === "error" ? (u == null ? void 0 : u.message) ?? "Failed to load options" : void 0);
+  return /* @__PURE__ */ o(Ir, { ...c, options: d, loading: s === "loading", error: f });
+}
+function zt() {
+  const e = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Set();
   return {
-    register(t, r) {
-      e.set(t, r);
+    register(n, t) {
+      e.set(n, t);
     },
-    resolve(t, r) {
-      const l = e.get(t.component);
-      return l ? l(t, r) : (n.has(t.component) || (n.add(t.component), console.warn(
-        `Smart: no resolver registered for component "${t.component}" (field "${t.name}"). Skipping.`
+    resolve(n, t) {
+      const a = e.get(n.component);
+      return a ? a(n, t) : (r.has(n.component) || (r.add(n.component), console.warn(
+        `Smart: no resolver registered for component "${n.component}" (field "${n.name}"). Skipping.`
       )), null);
     },
-    has(t) {
-      return e.has(t);
+    has(n) {
+      return e.has(n);
     }
   };
 }
-function Ct(e) {
-  const n = new Map(Object.entries(e ?? {}));
+function Wt(e) {
+  const r = new Map(Object.entries(e ?? {}));
   return {
-    register(t, r) {
-      n.set(t, r);
+    register(n, t) {
+      r.set(n, t);
     },
-    resolve(t) {
-      return n.get(t);
+    resolve(n) {
+      return r.get(n);
     }
   };
 }
-function It() {
+function Gt() {
   const e = /* @__PURE__ */ new Map();
   return {
-    register(n, t) {
-      e.set(n, t);
+    register(r, n) {
+      e.set(r, n);
     },
-    resolve(n) {
-      return e.get(n);
+    resolve(r) {
+      return e.get(r);
     }
   };
 }
-function Sn(e) {
+function Fn(e) {
   return "dataSource" in e;
 }
-function Cn(e, n) {
+function Hn(e, r) {
   if (!e)
     return;
-  const t = {};
-  for (const [r, l] of Object.entries(e))
-    t[r] = l.kind === "static" ? l.value : n[l.field];
-  return t;
+  const n = {};
+  for (const [t, a] of Object.entries(e))
+    n[t] = a.kind === "static" ? a.value : r[a.field];
+  return n;
 }
-function fe(e, n, t) {
-  return n && t ? t(n) : e;
+function Qe(e, r, n) {
+  return r && n ? n(r) : e;
 }
-function X(e, n) {
-  const { values: t, translate: r } = n;
+function fe(e, r) {
+  const { values: n, translate: t } = r;
   return {
     metadata: e,
     visible: e.visible ?? !0,
     readOnly: e.readOnly ?? !1,
     disabled: e.disabled ?? !1,
     required: e.required ?? !1,
-    label: fe(e.label, e.labelKey, r),
+    label: Qe(e.label, e.labelKey, t),
     placeholder: e.placeholder,
     helpText: e.helpText,
-    validationMessage: fe(e.validationMessage, e.validationMessageKey, r),
-    params: Sn(e) ? Cn(e.dataSource.params, t) : void 0
+    validationMessage: Qe(e.validationMessage, e.validationMessageKey, t),
+    params: Fn(e) ? Hn(e.dataSource.params, n) : void 0
   };
 }
-function Dt(e, n, t) {
-  const r = n == null ? void 0 : n.fields.find((l) => l.name === e);
-  if (r)
-    return X(r, t);
-}
-const In = [];
-function Dn(e, n) {
-  const t = {};
-  for (const r of n)
-    t[r] = e[r];
-  return t;
-}
-function Vn(e, n, t) {
-  const r = e ?? In, l = Dn(n, r), i = r.length === 0 ? "" : JSON.stringify(l), o = O(null), c = O(t);
-  c.current = t, _(() => {
+function Jt(e, r, n) {
+  const t = r == null ? void 0 : r.fields.find((a) => a.name === e);
+  if (t)
+    return fe(t, n);
+}
+const jn = [];
+function Un(e, r) {
+  const n = {};
+  for (const t of r)
+    n[t] = e[t];
+  return n;
+}
+function qn(e, r, n) {
+  const t = e ?? jn, a = Un(r, t), i = t.length === 0 ? "" : JSON.stringify(a), l = L(null), c = L(n);
+  c.current = n, U(() => {
     var d;
-    if (r.length === 0)
+    if (t.length === 0)
       return;
-    const s = o.current;
+    const s = l.current;
     if (s && s.key !== i)
-      for (const u of r)
-        Object.is(s.snapshot[u], l[u]) || (d = c.current) == null || d.call(c, u);
-    o.current = { key: i, snapshot: l };
+      for (const u of t)
+        Object.is(s.snapshot[u], a[u]) || (d = c.current) == null || d.call(c, u);
+    l.current = { key: i, snapshot: a };
   }, [i]);
 }
-function Ce(e, n) {
-  const { actions: t, translate: r } = n, l = t.resolve(e.id);
+function yr(e, r) {
+  const { actions: n, translate: t } = r, a = n.resolve(e.id);
   return {
     metadata: e,
     visible: e.visible ?? !0,
-    enabled: (e.enabled ?? !0) && !!l,
-    label: e.labelKey && r ? r(e.labelKey) : e.label,
-    handler: l
+    enabled: (e.enabled ?? !0) && !!a,
+    label: e.labelKey && t ? t(e.labelKey) : e.label,
+    handler: a
   };
 }
-function Vt(e, n, t) {
-  var l;
-  const r = (l = n == null ? void 0 : n.actions) == null ? void 0 : l.find((i) => i.id === e);
-  if (r)
-    return Ce(r, t);
+function Zt(e, r, n) {
+  var a;
+  const t = (a = r == null ? void 0 : r.actions) == null ? void 0 : a.find((i) => i.id === e);
+  if (t)
+    return yr(t, n);
 }
-const $n = (e, n) => {
-  const t = X(e, { values: n.values, translate: n.translate });
-  if (!t.visible)
+const zn = (e, r) => {
+  const n = fe(e, { values: r.values, translate: r.translate });
+  if (!n.visible)
     return null;
-  const r = n.dataSources.resolve(e.dataSource.id);
-  return r ? /* @__PURE__ */ a(
-    wn,
+  const t = r.dataSources.resolve(e.dataSource.id);
+  return t ? /* @__PURE__ */ o(
+    Kn,
     {
-      label: t.label,
-      url: r.url,
-      client: r.client,
-      params: t.params,
+      label: n.label,
+      url: t.url,
+      client: t.client,
+      params: n.params,
       valueMember: e.valueMember,
       displayMember: e.displayMember,
-      required: t.required,
-      readOnly: t.readOnly,
-      disabled: t.disabled,
-      helpText: t.helpText,
-      error: t.validationMessage,
-      value: n.values[e.name] ?? null,
-      onChange: (l) => n.onFieldChange(e.name, l)
+      required: n.required,
+      readOnly: n.readOnly,
+      disabled: n.disabled,
+      helpText: n.helpText,
+      error: n.validationMessage,
+      value: r.values[e.name] ?? null,
+      onChange: (a) => r.onFieldChange(e.name, a)
     }
   ) : (console.warn(`Smart: no data source registered for id "${e.dataSource.id}" (field "${e.name}"). Skipping.`), null);
 };
-function Tn(e, n) {
+function Wn(e, r) {
   if (e.visible === !1)
     return null;
-  const t = e.headerKey && n ? n(e.headerKey) : e.header ?? e.key, r = e.format === "boolean" && !!n;
+  const n = e.headerKey && r ? r(e.headerKey) : e.header ?? e.key, t = e.format === "boolean" && !!r;
   return {
     key: e.key,
-    header: t,
+    header: n,
     sortable: e.sortable,
-    format: r ? void 0 : e.format,
-    formatter: r ? (l) => n(l ? "smart.boolean.true" : "smart.boolean.false") : void 0
+    format: t ? void 0 : e.format,
+    formatter: t ? (a) => r(a ? "smart.boolean.true" : "smart.boolean.false") : void 0
   };
 }
-const En = (e, n) => {
-  const t = X(e, { values: n.values, translate: n.translate });
-  if (!t.visible)
+const Gn = (e, r) => {
+  const n = fe(e, { values: r.values, translate: r.translate });
+  if (!n.visible)
     return null;
-  const r = n.dataSources.resolve(e.dataSource.id);
-  if (!r)
+  const t = r.dataSources.resolve(e.dataSource.id);
+  if (!t)
     return console.warn(`Smart: no data source registered for id "${e.dataSource.id}" (field "${e.name}"). Skipping.`), null;
-  const l = e.columns.map((c) => Tn(c, n.translate)).filter((c) => c !== null), i = e.totalCountField, o = i ? (c) => {
+  const a = e.columns.map((c) => Wn(c, r.translate)).filter((c) => c !== null), i = e.totalCountField, l = i ? (c) => {
     const s = c == null ? void 0 : c[i];
     return typeof s == "number" ? s : void 0;
   } : void 0;
-  return /* @__PURE__ */ a(
-    kn,
+  return /* @__PURE__ */ o(
+    Bn,
     {
-      url: r.url,
-      client: r.client,
-      params: t.params,
-      columns: l,
+      url: t.url,
+      client: t.client,
+      params: n.params,
+      columns: a,
       rowKey: (c) => c[e.rowKey],
-      getTotalCount: o
+      getTotalCount: l
     }
   );
 };
-function me(e) {
+function Xe(e) {
   if (!e)
     return;
-  const n = new Date(e);
-  return Number.isNaN(n.getTime()) ? void 0 : n;
+  const r = new Date(e);
+  return Number.isNaN(r.getTime()) ? void 0 : r;
 }
-const Mn = (e, n) => {
-  const t = X(e, { values: n.values, translate: n.translate });
-  return t.visible ? /* @__PURE__ */ a(
-    Oe,
+const Jn = (e, r) => {
+  const n = fe(e, { values: r.values, translate: r.translate });
+  return n.visible ? /* @__PURE__ */ o(
+    Er,
     {
-      label: t.label,
-      required: t.required,
-      readOnly: t.readOnly,
-      disabled: t.disabled,
-      helpText: t.helpText,
-      error: t.validationMessage,
-      min: me(e.minDate),
-      max: me(e.maxDate),
-      value: n.values[e.name] ?? null,
-      onChange: (r) => n.onFieldChange(e.name, r)
+      label: n.label,
+      required: n.required,
+      readOnly: n.readOnly,
+      disabled: n.disabled,
+      helpText: n.helpText,
+      error: n.validationMessage,
+      min: Xe(e.minDate),
+      max: Xe(e.maxDate),
+      value: r.values[e.name] ?? null,
+      onChange: (t) => r.onFieldChange(e.name, t)
     }
   ) : null;
-}, On = (e, n) => {
-  const t = X(e, { values: n.values, translate: n.translate });
-  return t.visible ? /* @__PURE__ */ a(
-    Z,
+}, Zn = (e, r) => {
+  const n = fe(e, { values: r.values, translate: r.translate });
+  return n.visible ? /* @__PURE__ */ o(
+    de,
     {
-      label: t.label,
-      required: t.required,
-      readOnly: t.readOnly,
-      disabled: t.disabled,
-      helpText: t.helpText,
-      placeholder: t.placeholder,
-      error: t.validationMessage,
+      label: n.label,
+      required: n.required,
+      readOnly: n.readOnly,
+      disabled: n.disabled,
+      helpText: n.helpText,
+      placeholder: n.placeholder,
+      error: n.validationMessage,
       maxLength: e.maxLength,
-      value: n.values[e.name] ?? "",
-      onChange: (r) => n.onFieldChange(e.name, r)
+      value: r.values[e.name] ?? "",
+      onChange: (t) => r.onFieldChange(e.name, t)
     }
   ) : null;
 };
-function $t(e) {
-  e.register("Input", On), e.register("ComboBox", $n), e.register("DatePicker", Mn), e.register("DataGrid", En);
+function Yt(e) {
+  e.register("Input", Zn), e.register("ComboBox", zn), e.register("DatePicker", Jn), e.register("DataGrid", Gn);
 }
-function Rn({ metadata: e, ctx: n }) {
-  const t = n.onMetadataRefreshNeeded;
-  return Vn(
+function Yn({ metadata: e, ctx: r }) {
+  const n = r.onMetadataRefreshNeeded;
+  return qn(
     e.dependsOn,
-    n.values,
-    t ? (r) => t(e.name, r) : void 0
-  ), e.visible === !1 ? null : n.registry.resolve(e, n);
+    r.values,
+    n ? (t) => n(e.name, t) : void 0
+  ), e.visible === !1 ? null : r.registry.resolve(e, r);
 }
-const Ie = 1;
-function An(e) {
-  const n = Number(e.split(".")[0]);
-  return Number.isFinite(n) && n === Ie;
+const Nr = 1;
+function Qn(e) {
+  const r = Number(e.split(".")[0]);
+  return Number.isFinite(r) && r === Nr;
 }
-function Tt({ metadata: e, ctx: n }) {
-  return An(e.schemaVersion) ? /* @__PURE__ */ a(H, { children: e.fields.map((t) => /* @__PURE__ */ a(Rn, { metadata: t, ctx: n }, t.name)) }) : /* @__PURE__ */ p(xe, { variant: "danger", children: [
+function Qt({ metadata: e, ctx: r }) {
+  return Qn(e.schemaVersion) ? /* @__PURE__ */ o(Q, { children: e.fields.map((n) => /* @__PURE__ */ o(Yn, { metadata: n, ctx: r }, n.name)) }) : /* @__PURE__ */ y(or, { variant: "danger", children: [
     'Unsupported form schema version "',
     e.schemaVersion,
     '" — this app understands schema version ',
-    Ie,
+    Nr,
     ".x."
   ] });
 }
-function Ln({ metadata: e, ctx: n }) {
-  const t = Ce(e, n);
-  return t.visible ? /* @__PURE__ */ a(te, { disabled: !t.enabled, onClick: () => {
-    var r;
-    return (r = t.handler) == null ? void 0 : r.call(t);
-  }, children: t.label ?? e.id }) : null;
+function Xn({ metadata: e, ctx: r }) {
+  const n = yr(e, r);
+  return n.visible ? /* @__PURE__ */ o(ke, { disabled: !n.enabled, onClick: () => {
+    var t;
+    return (t = n.handler) == null ? void 0 : t.call(n);
+  }, children: n.label ?? e.id }) : null;
 }
-function Et({ metadata: e, ctx: n }) {
-  return !e.actions || e.actions.length === 0 ? null : /* @__PURE__ */ a(H, { children: e.actions.map((t) => /* @__PURE__ */ a(Ln, { metadata: t, ctx: n }, t.id)) });
+function Xt({ metadata: e, ctx: r }) {
+  return !e.actions || e.actions.length === 0 ? null : /* @__PURE__ */ o(Q, { children: e.actions.map((n) => /* @__PURE__ */ o(Xn, { metadata: n, ctx: r }, n.id)) });
 }
 export {
-  Ye as Accordion,
-  xe as Alert,
-  Le as AutoComplete,
-  ot as Avatar,
-  Ge as Badge,
-  rn as Breadcrumb,
-  te as Button,
-  nt as Card,
-  _n as CheckBox,
-  at as Col,
-  Re as ComboBox,
-  Yn as ConfirmProvider,
-  rt as Container,
-  Ue as DataGrid,
-  Oe as DatePicker,
-  Gn as DateTimePicker,
-  tt as Divider,
-  Hn as FileInput,
-  pt as Flex,
-  Wn as FormField,
-  pn as HttpError,
-  se as Icon,
-  vt as IconButton,
-  Z as Input,
-  $e as Label,
-  gt as ListItem,
-  it as Menu,
-  Pe as Modal,
-  Me as MultiSelect,
-  mt as Navbar,
-  Bn as NumberInput,
-  bt as PageHeader,
-  Ke as Pagination,
-  jn as PasswordInput,
-  et as Popover,
-  W as Popup,
-  ft as ProgressBar,
-  Te as RadioButton,
-  qn as RadioGroup,
-  ut as Rating,
-  xt as RemoteAutoComplete,
-  wn as RemoteComboBox,
-  kn as RemoteDataGrid,
-  kt as RemoteMultiSelect,
-  wt as RemoteSelect,
-  lt as Row,
-  Ee as Select,
-  ht as Sidebar,
-  ee as Skeleton,
-  dt as Slider,
-  Ln as SmartAction,
-  Et as SmartActions,
-  Rn as SmartField,
-  Tt as SmartForm,
-  yt as Sparkline,
-  qe as Spinner,
-  Se as Stack,
-  Nt as Statistic,
-  st as Stepper,
-  Un as Switch,
-  Xn as Tabs,
-  ct as Tag,
-  q as Text,
-  Kn as TextArea,
-  zn as TimePicker,
-  Jn as ToastProvider,
-  Qe as Tooltip,
-  pe as ValidationMessage,
-  $n as comboBoxResolver,
-  gn as createHttpClient,
-  It as createSmartActionRegistry,
-  St as createSmartComponentRegistry,
-  Ct as createSmartDataSourceRegistry,
-  Be as dataGridFormatters,
-  En as dataGridResolver,
-  Mn as datePickerResolver,
-  Q as defaultArrayNormalization,
-  yn as defaultHttpClient,
-  ge as fromDateInputValue,
-  Ne as fromTimeInputValue,
-  On as inputResolver,
-  $t as registerBuiltInResolvers,
-  Ce as resolveSmartActionMetadata,
-  X as resolveSmartFieldMetadata,
-  z as toDateInputValue,
-  le as toSelectOption,
-  ye as toTimeInputValue,
-  Qn as useConfirm,
-  xn as useDebouncedValue,
-  Y as useRemoteData,
-  Vt as useSmartAction,
-  Vn as useSmartDependencies,
-  Dt as useSmartField,
-  Zn as useToast
+  vt as Accordion,
+  or as Alert,
+  Ht as AppearanceMenu,
+  Vt as AppearanceProvider,
+  Tr as AutoComplete,
+  St as Avatar,
+  Hr as Badge,
+  Yr as Breadcrumb,
+  ke as Button,
+  dr as COLOR_SCHEME_TOKEN_KEYS,
+  yt as Card,
+  it as CheckBox,
+  wt as Col,
+  Ar as ComboBox,
+  ht as ConfirmProvider,
+  Nt as Container,
+  Re as DEFAULT_COLOR_SCHEME_ID,
+  Kr as DataGrid,
+  Er as DatePicker,
+  dt as DateTimePicker,
+  Zr as Divider,
+  ot as FileInput,
+  Mt as Flex,
+  ut as FormField,
+  Ln as HttpError,
+  Le as Icon,
+  Pt as IconButton,
+  de as Input,
+  xr as Label,
+  Kt as ListItem,
+  _t as Menu,
+  Vr as Modal,
+  Ir as MultiSelect,
+  Dt as Navbar,
+  tt as NumberInput,
+  Ot as PageHeader,
+  Rr as Pagination,
+  at as PasswordInput,
+  gt as Popover,
+  oe as Popup,
+  At as ProgressBar,
+  Sr as RadioButton,
+  st as RadioGroup,
+  Et as Rating,
+  jt as RemoteAutoComplete,
+  Kn as RemoteComboBox,
+  Bn as RemoteDataGrid,
+  qt as RemoteMultiSelect,
+  Ut as RemoteSelect,
+  kt as Row,
+  mr as SIDEBAR_PRESENTATIONS,
+  fr as SIDEBAR_TONES,
+  Cr as Select,
+  $t as Sidebar,
+  ye as Skeleton,
+  It as Slider,
+  Xn as SmartAction,
+  Xt as SmartActions,
+  Yn as SmartField,
+  Qt as SmartForm,
+  Bt as Sparkline,
+  Br as Spinner,
+  cr as Stack,
+  Ft as Statistic,
+  xt as Stepper,
+  lt as Switch,
+  ur as THEME_MODES,
+  bt as Tabs,
+  Ct as Tag,
+  te as Text,
+  nt as TextArea,
+  ct as TimePicker,
+  mt as ToastProvider,
+  sr as Tooltip,
+  er as ValidationMessage,
+  on as colorSchemeCssVariables,
+  zn as comboBoxResolver,
+  Rt as createAppearanceInitScript,
+  ve as createColorScheme,
+  $n as createHttpClient,
+  Gt as createSmartActionRegistry,
+  zt as createSmartComponentRegistry,
+  Wt as createSmartDataSourceRegistry,
+  $r as dataGridFormatters,
+  Gn as dataGridResolver,
+  Jn as datePickerResolver,
+  me as defaultArrayNormalization,
+  On as defaultHttpClient,
+  nr as fromDateInputValue,
+  ar as fromTimeInputValue,
+  nn as getColorScheme,
+  Zn as inputResolver,
+  pr as isSidebarExpandable,
+  un as isSidebarParent,
+  en as isValidColorScheme,
+  pn as legacyActiveKey,
+  hn as legacyDefaultExpandedKeys,
+  tn as listColorSchemes,
+  Yt as registerBuiltInResolvers,
+  Tt as registerColorScheme,
+  an as resolveColorScheme,
+  yr as resolveSmartActionMetadata,
+  fe as resolveSmartFieldMetadata,
+  ae as toDateInputValue,
+  Se as toSelectOption,
+  mn as toSidebarItems,
+  tr as toTimeInputValue,
+  Lt as useAppearance,
+  pt as useConfirm,
+  Pn as useDebouncedValue,
+  ue as useRemoteData,
+  Zt as useSmartAction,
+  qn as useSmartDependencies,
+  Jt as useSmartField,
+  ft as useToast
 };
 //# sourceMappingURL=index.js.map