@elcrm/components 0.2.6 → 0.2.8

package/dist/PanelInfo-A5y5ysH8.js

@@ -0,0 +1,81 @@
+import e from "react";
+import { T as b } from "./TextGroup-DmhuyMR1.js";
+import { c as h } from "./cx-CcykAxZN.js";
+import { a as B, r as N } from "./overlayZ-BvHbYC1x.js";
+import './PanelInfo.css';const x = "pBr", g = "pBs", k = "pBh", I = "pBt", L = "pBa", O = "pBc", z = "pBb", M = "pBf", S = "pBd", n = {
+  r: x,
+  s: g,
+  h: k,
+  t: I,
+  a: L,
+  c: O,
+  b: z,
+  f: M,
+  d: S
+}, m = "(max-width: 56rem)";
+function T({
+  open: a,
+  title: s,
+  onClose: o,
+  children: f,
+  footer: l,
+  headerExtra: u,
+  close: v,
+  "aria-label": y,
+  className: E
+}) {
+  const [r, p] = e.useState(
+    () => typeof window < "u" ? window.matchMedia(m).matches : !1
+  ), [i, d] = e.useState();
+  e.useEffect(() => {
+    const t = window.matchMedia(m), c = () => p(t.matches);
+    return c(), t.addEventListener("change", c), () => t.removeEventListener("change", c);
+  }, []), e.useEffect(() => {
+    if (!a || !r) {
+      d(void 0);
+      return;
+    }
+    const t = B();
+    return d(t), () => {
+      N(t), d(void 0);
+    };
+  }, [a, r]), e.useEffect(() => {
+    if (!a) return;
+    const t = (c) => {
+      c.key === "Escape" && (c.preventDefault(), o());
+    };
+    return window.addEventListener("keydown", t), () => window.removeEventListener("keydown", t);
+  }, [a, o]), e.useEffect(() => {
+    if (!a || !r) return;
+    const t = document.body.style.overflow;
+    return document.body.style.overflow = "hidden", () => {
+      document.body.style.overflow = t;
+    };
+  }, [a, r]);
+  const w = y ?? (typeof s == "string" && s.trim() ? s : "Панель");
+  return /* @__PURE__ */ e.createElement(
+    "aside",
+    {
+      className: h(n.r, E),
+      "data-open": a ? "true" : "false",
+      "data-overlay": r ? "true" : "false",
+      "aria-hidden": !a,
+      "aria-label": a ? w : void 0,
+      style: i != null ? { zIndex: i } : void 0
+    },
+    a && r ? /* @__PURE__ */ e.createElement("div", { className: n.d, role: "presentation", onClick: o }) : null,
+    /* @__PURE__ */ e.createElement("div", { className: n.s }, /* @__PURE__ */ e.createElement("div", { className: n.h }, /* @__PURE__ */ e.createElement("div", { className: n.t }, typeof s == "string" || typeof s == "number" ? /* @__PURE__ */ e.createElement(b, { title: String(s), size: "m" }) : s), /* @__PURE__ */ e.createElement("div", { className: n.a }, u, v ?? /* @__PURE__ */ e.createElement(
+      "button",
+      {
+        type: "button",
+        className: n.c,
+        "aria-label": "Закрыть",
+        onClick: o
+      },
+      "×"
+    ))), /* @__PURE__ */ e.createElement("div", { className: n.b }, f), l != null ? /* @__PURE__ */ e.createElement("div", { className: n.f }, l) : null)
+  );
+}
+export {
+  T as P
+};

package/dist/PanelInfo.css

@@ -0,0 +1 @@
+@layer elcrm-components{.pBr{flex:0 0 auto;position:relative;width:0;min-width:0;min-height:0;align-self:stretch;overflow:hidden;opacity:0;pointer-events:none;transition:width .22s ease,opacity .18s ease,min-width .22s ease}.pBr[data-open=true]{width:var(--panel-info-width);min-width:var(--panel-info-width-min);opacity:1;pointer-events:auto}.pBs{display:flex;flex-direction:column;height:100%;min-height:0;width:var(--panel-info-width);min-width:var(--panel-info-width-min);box-sizing:border-box;border:var(--chat-border);border-radius:var(--chat-radius);background:var(--chat-background);color:var(--shell-color)}.pBh{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--shell-gap-sm);padding:var(--shell-gap);border-bottom:var(--chat-border)}.pBt{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pBa{flex:0 0 auto;display:flex;align-items:center;gap:.25rem}.pBc{width:2rem;height:2rem;border:0;border-radius:var(--shell-radius);background:transparent;color:var(--shell-color-muted);font-size:1.35rem;line-height:1;cursor:pointer}.pBc:hover{color:var(--shell-color);background:var(--shell-background-muted)}.pBb{flex:1 1 auto;min-height:0;overflow:auto;padding:var(--shell-gap)}.pBf{flex:0 0 auto;padding:var(--shell-gap);border-top:var(--chat-border)}.pBd{display:none}@media (max-width: 56rem){.pBr[data-open=true]{width:0;min-width:0;opacity:1;overflow:visible;pointer-events:none}.pBr[data-open=true] .pBd{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:inherit;pointer-events:auto;background:var(--panel-info-backdrop);cursor:pointer}.pBr[data-open=true] .pBs{position:fixed;top:0;right:0;bottom:0;z-index:inherit;width:min(100vw,var(--panel-info-overlay-max));min-width:0;max-width:100vw;border-radius:0;border-left:var(--chat-border);border-right:none;border-top:none;border-bottom:none;pointer-events:auto;box-shadow:var(--popup-shadow)}}}

package/dist/PanelInfo.d.ts

@@ -0,0 +1,52 @@
+import { default as React } from 'react';
+export type PanelInfoProps = {
+    /** Открыта ли панель. */
+    open: boolean;
+    /** Заголовок шапки. */
+    title: React.ReactNode;
+    /** Закрытие: крестик / фон / Escape. */
+    onClose: () => void;
+    /**
+     * Тело — форма (`@elcrm/form` поля) или любой контент.
+     * Скроллится между шапкой и footer.
+     */
+    children?: React.ReactNode;
+    /**
+     * Низ вне скролла — обычно `Stack` + `@elcrm/button`
+     * («Отмена» / «Сохранить»).
+     */
+    footer?: React.ReactNode;
+    /** Доп. действия в шапке слева от крестика. */
+    headerExtra?: React.ReactNode;
+    /**
+     * Слот кнопки закрытия. По умолчанию — крестик.
+     * Приложение может подставить `@elcrm/button`.
+     */
+    close?: React.ReactNode;
+    /** `aria-label` для `<aside>`, если title не строка. */
+    "aria-label"?: string;
+    /** Доп. CSS-класс. */
+    className?: string;
+};
+/**
+ * Выезжающая панель справа: шапка / body / footer.
+ *
+ * Широкий экран — flex-колонка рядом со списком.
+ * Узкий (`max-width: 56rem`) — поверх контента с затемнением
+ * и `acquireOverlayZIndex`.
+ *
+ * @example
+ * ```tsx
+ * <PanelInfo
+ *   open={!!row}
+ *   title={row?.name ?? ""}
+ *   onClose={() => setId(null)}
+ *   footer={<Button width="l" label="Сохранить" onSend={onSave} />}
+ * >
+ *   <StringField name="name" form={form} label="Название" />
+ * </PanelInfo>
+ * ```
+ *
+ * Токены: `--panel-info-width`, `--panel-info-backdrop`, `--shell-*`, `--chat-*`.
+ */
+export declare function PanelInfo({ open, title, onClose, children, footer, headerExtra, close, "aria-label": ariaLabel, className, }: PanelInfoProps): React.JSX.Element;

package/dist/PanelInfo.js

@@ -0,0 +1,4 @@
+import { P as e } from "./PanelInfo-A5y5ysH8.js";
+export {
+  e as PanelInfo
+};

package/dist/Popover-DWdvZTuA.js

@@ -0,0 +1,135 @@
+import u, { useRef as E, useId as Y, useState as N, useLayoutEffect as O, useEffect as S } from "react";
+import { createPortal as _ } from "react-dom";
+import { c as T } from "./cx-CcykAxZN.js";
+import { a as $, r as V } from "./overlayZ-BvHbYC1x.js";
+import { u as ee } from "./useControllableValue-CWqH1kpM.js";
+import './Popover.css';const te = "c3r", ne = "c3t", oe = "c3p", H = {
+  r: te,
+  t: ne,
+  p: oe
+};
+function ie(t, e) {
+  const c = (e == null ? void 0 : e.querySelector("button, a, [role='button']")) ?? (e == null ? void 0 : e.firstElementChild);
+  return (c instanceof HTMLElement ? c : e ?? t).getBoundingClientRect();
+}
+function re(t, e) {
+  return t != null && t.top === e.top && t.left === e.left && t.minWidth === e.minWidth && t.maxHeight === e.maxHeight;
+}
+function se(t, e, c, p) {
+  if (!u.isValidElement(t)) return t;
+  const d = t.props.onClick;
+  return u.cloneElement(t, {
+    "aria-haspopup": "menu",
+    "aria-expanded": e,
+    "aria-controls": e ? c : void 0,
+    onClick: (h) => {
+      d == null || d(h), p();
+    }
+  });
+}
+function fe({
+  trigger: t,
+  children: e,
+  open: c,
+  defaultOpen: p = !1,
+  onOpenChange: d,
+  align: h = "end",
+  placement: w = "auto",
+  disabled: W = !1,
+  label: Z,
+  role: D = "menu",
+  className: F,
+  panelClassName: K
+}) {
+  const x = E(null), b = E(null), g = E(null), y = Y(), [i = !1, j] = ee(
+    c,
+    p,
+    d
+  ), [m, P] = N(null), [a, k] = N(null), L = E(null);
+  L.current = a;
+  const M = (o) => {
+    W && o || j(o);
+  };
+  O(() => {
+    if (i) {
+      a == null && k($());
+      return;
+    }
+    a != null && (V(a), k(null));
+  }, [i, a]), S(() => () => {
+    L.current != null && V(L.current);
+  }, []);
+  const R = () => {
+    var A;
+    const o = x.current;
+    if (!o) return;
+    const n = ie(o, b.current), r = 8, l = 8, s = ((A = g.current) == null ? void 0 : A.offsetHeight) ?? 0, f = window.innerHeight - n.bottom - r - l, J = n.top - r - l, Q = s > 0 ? s : 160, I = w === "bottom" || w !== "top" && f >= Q, U = Math.min(
+      420,
+      Math.max(120, I ? f : J)
+    ), v = Math.max(200, n.width), X = h === "end" ? Math.max(8, Math.min(n.right - v, window.innerWidth - v - 8)) : Math.max(8, Math.min(n.left, window.innerWidth - v - 8)), q = { top: I ? n.bottom + r : Math.max(l, n.top - r - (s > 0 ? s : 0)), left: X, minWidth: v, maxHeight: U };
+    P((B) => re(B, q) ? B : q);
+  };
+  O(() => {
+    if (!i) {
+      P(null);
+      return;
+    }
+    R();
+    const o = window.requestAnimationFrame(() => R()), n = () => R();
+    return window.addEventListener("resize", n), window.addEventListener("scroll", n, !0), () => {
+      window.cancelAnimationFrame(o), window.removeEventListener("resize", n), window.removeEventListener("scroll", n, !0);
+    };
+  }, [i, h, w, e]), S(() => {
+    if (!i) return;
+    const o = (r) => {
+      var s, f;
+      const l = r.target;
+      (s = x.current) != null && s.contains(l) || (f = g.current) != null && f.contains(l) || M(!1);
+    }, n = (r) => {
+      r.key === "Escape" && M(!1);
+    };
+    return document.addEventListener("mousedown", o), document.addEventListener("keydown", n), () => {
+      document.removeEventListener("mousedown", o), document.removeEventListener("keydown", n);
+    };
+  }, [i]);
+  const G = {
+    position: "fixed",
+    zIndex: a ?? 1e3,
+    ...m ? {
+      top: m.top,
+      bottom: "auto",
+      left: m.left,
+      minWidth: m.minWidth,
+      maxHeight: m.maxHeight
+    } : { visibility: "hidden", pointerEvents: "none" }
+  }, z = i ? /* @__PURE__ */ u.createElement(
+    "div",
+    {
+      ref: g,
+      id: y,
+      role: D,
+      "aria-label": Z,
+      className: T(H.p, K),
+      style: G,
+      onMouseDown: (o) => o.stopPropagation()
+    },
+    e
+  ) : null, C = () => {
+    W || M(!i);
+  };
+  return /* @__PURE__ */ u.createElement("div", { ref: x, className: T(H.r, F) }, /* @__PURE__ */ u.createElement(
+    "div",
+    {
+      ref: b,
+      className: H.t,
+      "aria-haspopup": "menu",
+      "aria-expanded": i,
+      "aria-controls": i ? y : void 0,
+      onClick: u.isValidElement(t) ? void 0 : C
+    },
+    se(t, i, y, C)
+  ), z && typeof document < "u" ? _(z, document.body) : null);
+}
+export {
+  fe as P
+};

package/dist/Popover.js

@@ -1,4 +1,4 @@
-import { P as e } from "./Popover-D5RymtcJ.js";
+import { P as e } from "./Popover-DWdvZTuA.js";
 export {
   e as Popover
 };

package/dist/{Sidebar-BSOLtF8H.js → Sidebar-BgZiGEDH.js}

@@ -1,6 +1,6 @@
 import e from "react";
 import { B as h } from "./Badge-jp-9iNNL.js";
-import { D as w } from "./Dropdown-B9AodUFf.js";
+import { D as w } from "./Dropdown-DosvDR13.js";
 import { I as y } from "./Item-D4okhsfW.js";
 import { b as C } from "./badgeText-CRzlIzi3.js";
 import { c as u } from "./cx-CcykAxZN.js";

package/dist/Sidebar.js

@@ -1,4 +1,4 @@
-import { S as e } from "./Sidebar-BSOLtF8H.js";
+import { S as e } from "./Sidebar-BgZiGEDH.js";
 export {
   e as Sidebar
 };

package/dist/Toolbar-C1zAk9ak.js

@@ -0,0 +1,42 @@
+import t from "react";
+import { c as i } from "./cx-CcykAxZN.js";
+import './Toolbar.css';const m = "cCr", f = {
+  r: m
+}, a = t.createContext(null);
+function x() {
+  return t.useContext(a);
+}
+function s(e, n) {
+  return t.Children.map(e, (r) => t.isValidElement(r) ? r.type === t.Fragment ? s(
+    r.props.children,
+    n
+  ) : typeof r.type == "string" || r.props.size != null ? r : t.cloneElement(r, { size: n }) : r);
+}
+function C({
+  size: e = "s",
+  label: n = "Тулбар",
+  align: r = "start",
+  width: o = "l",
+  className: l,
+  children: p,
+  ...u
+}) {
+  return /* @__PURE__ */ t.createElement(a.Provider, { value: { size: e } }, /* @__PURE__ */ t.createElement(
+    "div",
+    {
+      className: i(f.r, l),
+      role: "toolbar",
+      "aria-label": n,
+      "data-size": e,
+      "data-align": r,
+      "data-width": o,
+      ...u
+    },
+    s(p, e)
+  ));
+}
+export {
+  C as T,
+  s as a,
+  x as u
+};

package/dist/Toolbar.css

@@ -0,0 +1 @@
+@layer elcrm-components{.cCr{display:flex;flex-wrap:wrap;align-items:center;gap:var(--toolbar-gap);width:100%;min-width:0;box-sizing:border-box}.cCr[data-width=s]{display:inline-flex;width:auto;max-width:100%}.cCr[data-align=center]{justify-content:center}.cCr[data-align=end]{justify-content:flex-end}.cCr[data-align=between]{justify-content:space-between}.cCr[data-size=s]{--control-height: var(--control-height-s);--field-height: var(--control-height-s);--control-font-size: 13px;--button-height: var(--button-height-s);--button-height-m: var(--button-height-s);--button-padding: var(--button-padding-s);--button-size-m: var(--button-size-s)}.cCr[data-size=l]{--control-height: var(--control-height-l);--field-height: var(--control-height-l);--button-height: var(--button-height-l);--button-height-m: var(--button-height-l);--button-size-m: var(--button-size-l)}}

package/dist/Toolbar.d.ts

@@ -0,0 +1,63 @@
+import { default as React } from 'react';
+import { UiSize } from './types';
+/** Контекст размера тулбара — дети без своего `size` его подхватывают. */
+export type ToolbarContextValue = {
+    size: UiSize;
+};
+/** Размер ближайшего {@link Toolbar}, либо `null` вне тулбара. */
+export declare function useToolbar(): ToolbarContextValue | null;
+export type ToolbarAlign = "start" | "center" | "end" | "between";
+/** Ширина ряда: `l` — 100%, `s` — по содержимому (как `width` у Button). */
+export type ToolbarWidth = "s" | "l";
+export type ToolbarProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
+    /**
+     * Общий размер вложенных Field / Search / Button / Dropdown / Badge.
+     * Явный `size` у ребёнка важнее.
+     * @default "s"
+     */
+    size?: UiSize;
+    /** Подпись для `aria-label`. */
+    label?: string;
+    /**
+     * Направление ряда (`justify-content`).
+     * @default "start"
+     */
+    align?: ToolbarAlign;
+    /**
+     * Ширина корня: `l` — `100%` (фильтры над списком),
+     * `s` — по контенту (компактный ряд, не растягивать).
+     * @default "l"
+     */
+    width?: ToolbarWidth;
+    /**
+     * Узлы тулбара (`*Field`, `Search`, `Button`, `Dropdown`, …).
+     * Компонентам без `size` прокидывается размер тулбара.
+     */
+    children?: React.ReactNode;
+};
+/** Прокинуть `size` прямым детям-компонентам, если у них его ещё нет. */
+export declare function applyToolbarSize(node: React.ReactNode, size: UiSize): React.ReactNode;
+/**
+ * Ряд контролов одной высоты: поиск, поля, кнопки, меню.
+ *
+ * Роли: Toolbar = фильтры / действия над списком (`PageHead.children`).
+ * Иконки в карточке — `ActionGroup`.
+ *
+ * Пакет не зависит от `@elcrm/form` / `@elcrm/button`:
+ * размер уходит пропом `size` и токенами `--field-height` / `--button-height-*`.
+ *
+ * @example
+ * ```tsx
+ * <Toolbar size="s" align="end" label="Фильтры">
+ *   <Search value={q} onValue={setQ} />
+ *   <Button label="Создать" />
+ * </Toolbar>
+ * <Toolbar width="s" align="center">
+ *   <Button label="Отмена" />
+ *   <Button label="Сохранить" />
+ * </Toolbar>
+ * ```
+ *
+ * Токены: `--toolbar-gap`, `--control-height-*`, `--button-height-*`.
+ */
+export declare function Toolbar({ size, label, align, width, className, children, ...rest }: ToolbarProps): React.JSX.Element;

package/dist/Toolbar.js

@@ -0,0 +1,6 @@
+import { T as r, a as l, u as s } from "./Toolbar-C1zAk9ak.js";
+export {
+  r as Toolbar,
+  l as applyToolbarSize,
+  s as useToolbar
+};

package/dist/index.css

@@ -16,7 +16,7 @@
 
 @layer elcrm-components{.c8r{display:flex;flex-direction:column;box-sizing:border-box;min-width:0;min-height:0;height:100%;overflow:hidden;background:var(--chat-background);border:var(--chat-border);border-radius:var(--chat-radius)}.c8l{width:var(--chat-list-width);max-width:100%}.c8g{width:100%}.c8h{flex:0 0 auto;padding:var(--chat-header-padding);border-bottom:var(--chat-border)}.c8b{flex:1 1 auto;min-height:0;overflow:auto;padding:var(--chat-body-padding)}.c8g .c8h{padding:var(--chat-messages-header-padding)}.c8g .c8b{display:flex;flex-direction:column;padding:var(--chat-messages-body-padding)}.c8f{flex:0 0 auto;padding:var(--chat-footer-padding);border-top:var(--chat-border)}.c8g .c8f{padding:var(--chat-messages-footer-padding)}.c8p{display:flex;align-items:stretch;gap:var(--chat-split-gap);min-height:0;height:100%}.c8p>*{min-height:0}}
 
-@layer elcrm-components{.crr{position:relative;display:inline-flex;vertical-align:middle}.crt{display:inline-flex;align-items:center;gap:var(--shell-gap-sm);margin:0;padding:var(--shell-padding);box-sizing:border-box;font:inherit;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.2}.crt:hover{background:var(--shell-background-hover)}.crt[data-open=true]{border-color:var(--shell-color-accent);color:var(--shell-color-accent)}.crc{display:inline-flex;width:var(--shell-icon-size);height:var(--shell-icon-size);flex-shrink:0;color:var(--shell-color-muted)}.crt[data-open=true] .crc{color:var(--shell-color-accent)}.crp{min-width:0}.crh{margin:0;padding:var(--shell-padding);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);color:var(--shell-color-muted);line-height:1.3}.crg{display:flex;flex-direction:column;gap:2px}.crd{height:0;margin:var(--shell-gap-sm) 0;border:0;border-top:1px solid var(--shell-border)}.cri{display:flex;align-items:center;gap:var(--shell-gap-sm);width:100%;margin:0;padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;font-size:var(--shell-font-size);font-weight:500;color:var(--shell-color);background:transparent;border:none;border-radius:calc(var(--shell-radius) * .7);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.35}.cri:hover:not(:disabled),.cri:focus-visible:not(:disabled){background:var(--shell-background-hover);outline:none}.cri[data-checked=true]{background:var(--shell-background-selected)}.cri[data-danger=true]{color:var(--shell-color-danger)}.cri[data-danger=true] .crn,.cri[data-danger=true] .crm{color:inherit}.cri:disabled,.cri[aria-disabled=true]{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.crn,.crk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-icon-size);height:var(--shell-icon-size);color:var(--shell-color-muted)}.crk{color:var(--shell-color-accent)}.crl{flex:1;min-width:0}.cru{flex-shrink:0;margin-left:auto;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.crm{display:inline-flex;flex-shrink:0;margin-left:auto;width:var(--shell-icon-size);height:var(--shell-icon-size);color:var(--shell-color-muted)}.crb{display:inline-flex;flex-shrink:0;width:var(--shell-status-size);height:var(--shell-status-size);border-radius:50%}.cro{background:var(--shell-color-success)}.crf{background:var(--shell-color-muted)}.crx{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;box-sizing:border-box;width:var(--shell-check-size);height:var(--shell-check-size);border:1px solid var(--shell-border);border-radius:calc(var(--shell-radius) * .4);background:var(--shell-background);color:var(--avatar-color)}.cry{border-color:var(--shell-color-accent);background:var(--shell-color-accent)}.crv{width:70%;height:70%;display:block}}
+@layer elcrm-components{.crr{position:relative;display:inline-flex;vertical-align:middle}.crt{display:inline-flex;align-items:center;gap:var(--shell-gap-sm);margin:0;padding:var(--shell-padding);box-sizing:border-box;font:inherit;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.2}.crt[data-size]{height:var(--control-height);min-height:var(--control-height);padding-block:0;box-sizing:border-box}.crt:hover{background:var(--shell-background-hover)}.crt[data-open=true]{border-color:var(--shell-color-accent);color:var(--shell-color-accent)}.crc{display:inline-flex;width:var(--shell-icon-size);height:var(--shell-icon-size);flex-shrink:0;color:var(--shell-color-muted)}.crt[data-open=true] .crc{color:var(--shell-color-accent)}.crp{min-width:0}.crh{margin:0;padding:var(--shell-padding);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);color:var(--shell-color-muted);line-height:1.3}.crg{display:flex;flex-direction:column;gap:2px}.crd{height:0;margin:var(--shell-gap-sm) 0;border:0;border-top:1px solid var(--shell-border)}.cri{display:flex;align-items:center;gap:var(--shell-gap-sm);width:100%;margin:0;padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;font-size:var(--shell-font-size);font-weight:500;color:var(--shell-color);background:transparent;border:none;border-radius:calc(var(--shell-radius) * .7);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.35}.cri:hover:not(:disabled),.cri:focus-visible:not(:disabled){background:var(--shell-background-hover);outline:none}.cri[data-checked=true]{background:var(--shell-background-selected)}.cri[data-danger=true]{color:var(--shell-color-danger)}.cri[data-danger=true] .crn,.cri[data-danger=true] .crm{color:inherit}.cri:disabled,.cri[aria-disabled=true]{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.crn,.crk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-icon-size);height:var(--shell-icon-size);color:var(--shell-color-muted)}.crk{color:var(--shell-color-accent)}.crl{flex:1;min-width:0}.cru{flex-shrink:0;margin-left:auto;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.crm{display:inline-flex;flex-shrink:0;margin-left:auto;width:var(--shell-icon-size);height:var(--shell-icon-size);color:var(--shell-color-muted)}.crb{display:inline-flex;flex-shrink:0;width:var(--shell-status-size);height:var(--shell-status-size);border-radius:50%}.cro{background:var(--shell-color-success)}.crf{background:var(--shell-color-muted)}.crx{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;box-sizing:border-box;width:var(--shell-check-size);height:var(--shell-check-size);border:1px solid var(--shell-border);border-radius:calc(var(--shell-radius) * .4);background:var(--shell-background);color:var(--avatar-color)}.cry{border-color:var(--shell-color-accent);background:var(--shell-color-accent)}.crv{width:70%;height:70%;display:block}}
 
 @layer elcrm-components{.cpr{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--shell-gap);padding:var(--shell-padding);text-align:center;color:var(--shell-color-muted)}.cpi{display:flex;margin-bottom:var(--shell-gap-sm);color:var(--shell-color-muted)}.cpt{margin:0;font-size:var(--shell-font-size-lg);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cpd{margin:0;max-width:22rem;font-size:var(--shell-font-size);color:var(--shell-color-muted);line-height:1.45}.cpa{display:flex;flex-wrap:wrap;gap:var(--shell-gap-sm);justify-content:center;margin-top:var(--shell-gap)}}
 
@@ -24,15 +24,17 @@
 
 @layer elcrm-components{.chr{display:flex;align-items:center;gap:var(--shell-gap);flex-shrink:0;min-height:var(--header-height);padding:var(--shell-padding);color:var(--shell-color);background:var(--shell-background);border:var(--header-border);border-radius:var(--header-radius);box-shadow:var(--header-shadow);margin:var(--header-margin);position:relative;z-index:var(--header-z)}.chn{display:flex;flex:1;align-items:center;min-width:0;justify-content:var(--header-nav-justify)}.cha{display:flex;align-items:center;gap:var(--shell-gap-sm);flex-shrink:0;margin:auto}}
 
+@layer elcrm-components{.hAr{display:flex;gap:var(--shell-gap);align-items:stretch;width:100%}.hAc,.hAa{border:1px solid var(--shell-border);border-radius:var(--shell-radius);background:var(--shell-background);box-sizing:border-box}.hAc{flex:1;min-width:0;display:flex;flex-direction:column;padding:var(--shell-gap-lg) var(--shell-padding-inline);overflow-x:auto}.hAh{margin-bottom:var(--shell-gap-sm)}.hAt{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color)}.hAm{position:relative;margin:0 0 4px 26px;height:16px;font-size:11px;color:var(--shell-color-muted)}.hAo{position:absolute;top:0;white-space:nowrap}.hAn{display:flex;gap:4px;align-items:flex-start;flex:1}.hAd{display:grid;grid-template-rows:repeat(7,var(--healthmap-cell));gap:var(--healthmap-gap);width:22px;font-size:10px;line-height:var(--healthmap-cell);color:var(--shell-color-muted);flex-shrink:0;align-content:center}.hAw{display:grid;gap:var(--healthmap-gap);align-content:center}.hAk{display:grid;grid-template-rows:repeat(7,var(--healthmap-cell));gap:var(--healthmap-gap)}.hAe{width:var(--healthmap-cell);height:var(--healthmap-cell);padding:0;border:0;border-radius:2px;background:var(--healthmap-l0);box-sizing:border-box;cursor:default;display:block}.hAe:focus-visible{outline:2px solid var(--shell-color-accent);outline-offset:1px}.hAe[data-level="1"]{background:var(--healthmap-l1)}.hAe[data-level="2"]{background:var(--healthmap-l2)}.hAe[data-level="3"]{background:var(--healthmap-l3)}.hAe[data-level="4"]{background:var(--healthmap-l4)}.hAf{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;margin-top:auto;padding-top:10px;margin-left:26px;font-size:11px;color:var(--shell-color-muted)}.hAi{min-width:0}.hAg{display:flex;align-items:center;gap:4px;justify-self:end}.hAa{flex:0 0 180px;display:flex;flex-direction:column;gap:var(--shell-gap-lg);padding:var(--shell-gap-lg) 18px}.hAb{display:flex;flex-direction:column;gap:2px;line-height:1.2}.hAb>span:first-child{font-size:var(--shell-font-size-lg);font-weight:700;letter-spacing:-.02em;color:var(--shell-color)}.hAb>span:last-child{font-size:11px;color:var(--shell-color-muted);text-transform:uppercase;letter-spacing:.04em}.hAp{display:flex;flex-direction:column;gap:var(--shell-gap-sm);flex:1;justify-content:center}.hAq{display:flex;flex-direction:column;gap:2px}.hAv{font-size:20px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--shell-color);line-height:1.1}.hAl{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.hAz{display:flex;align-items:center;justify-content:center;gap:4px;justify-self:center}.hAj{display:flex;align-items:center;gap:4px}.hAu{width:28px;height:28px;border:0;border-radius:var(--shell-radius);background:transparent;color:var(--shell-color-muted);font-size:18px;line-height:1;cursor:pointer}.hAu:hover:not(:disabled){color:var(--shell-color);background:var(--shell-background-muted)}.hAu:disabled{opacity:var(--shell-disabled-opacity);cursor:default}.hAx{border:0;background:transparent;color:var(--shell-color-muted);font-size:var(--shell-font-size-sm);padding:5px 11px;border-radius:999px;cursor:pointer}.hAx:hover{color:var(--shell-color)}.hAs{background:var(--shell-color-accent);color:var(--shell-background)}.hAy{position:fixed;z-index:calc(var(--shell-z) + 50);transform:translate(-50%,calc(-100% - 10px));min-width:160px;max-width:280px;padding:var(--shell-gap-sm) var(--shell-gap);border-radius:var(--shell-radius);background:var(--shell-background);border:1px solid var(--shell-border);box-shadow:var(--popup-shadow);pointer-events:none;color:var(--shell-color)}.hAy>:first-child{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.hAy>:last-child{font-size:var(--shell-font-size);font-weight:600}@media (max-width: 720px){.hAr{flex-direction:column}.hAa{flex:none;width:100%}.hAf{grid-template-columns:1fr;margin-left:0;justify-items:start}.hAg,.hAz{justify-self:start}}}
+
 @layer elcrm-components{.cir{display:flex;align-items:center;gap:var(--shell-gap-sm);padding:var(--shell-padding);color:var(--shell-color);background:transparent;border:1px solid transparent;border-radius:var(--shell-radius);cursor:default}.cir:is(button,a){-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;text-align:left;width:100%;cursor:pointer}.cir:hover{background:var(--shell-background-hover)}.cia,.cir[aria-current=true],.cir[data-active=true]{background:var(--shell-background-selected)}.cic{align-items:flex-start;gap:var(--shell-gap);padding:var(--shell-padding);border:1px solid var(--shell-border);border-radius:var(--shell-radius);background:var(--shell-background-muted);flex-shrink:0}.cic:hover,.cic.cia,.cic[data-active=true]{background:color-mix(in srgb,var(--shell-color-accent) 12%,var(--shell-background-muted));border-color:color-mix(in srgb,var(--shell-color-accent) 35%,transparent)}}
 
 @layer elcrm-components{.c7r{display:flex;align-items:flex-start;gap:var(--item-column-gap);min-width:0;width:100%;text-align:left}.c7i{flex-shrink:0;box-sizing:border-box;width:var(--item-column-icon-size);height:var(--item-column-icon-size);border-radius:var(--item-column-icon-radius);display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--shell-color-accent) 14%,transparent);color:var(--shell-color-accent)}.c7b{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.c7h{display:flex;align-items:center;gap:8px;min-width:0}.c7t{flex:1;min-width:0;margin:0;font-size:var(--item-column-title-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:var(--item-column-title-line);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.c7x{flex-shrink:0;display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px}.c7d{margin:0;font-size:var(--shell-font-size-sm);font-weight:400;color:var(--shell-color);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.c7f{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 6px;font-size:12px;color:var(--shell-color-muted);line-height:1.35}.c7p{opacity:.5;-webkit-user-select:none;user-select:none}.c7a{flex-shrink:0;display:inline-flex;align-items:flex-start}.c7s .c7t{font-size:var(--shell-font-size-sm)}.c7s .c7d{font-size:12px}.c7l .c7t{font-size:var(--shell-font-size-lg)}.c7l .c7d{font-size:var(--shell-font-size)}.c7k .c7t{font-weight:700}}
 
-@layer elcrm-components{.clr{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;background:var(--shell-background-muted);margin:var(--layout-margin);padding:var(--layout-padding);max-width:var(--layout-max-width);gap:0}.clx{height:var(--layout-height, 100dvh);max-height:var(--layout-height, 100dvh);overflow:hidden}.clm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain}.clr:not(.clx){height:auto;max-height:none;overflow:visible}.clr:not(.clx) .clm{overflow:visible;flex:0 1 auto;min-height:auto}.cls{flex-direction:row;align-items:stretch}.clb{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}.clr:not(.clx) .clb{overflow:visible}.cla{display:flex;flex-direction:column;flex:0 0 var(--sidebar-width, 248px);width:var(--sidebar-width, 248px);min-width:0;min-height:0;align-self:stretch}.clk{overflow:hidden}.cla:not(.clk){overflow:auto}.cla>*{flex:1 1 auto;min-height:0;width:100%;height:100%;max-height:100%}@media (max-width: 900px){.cla{flex-basis:72px;width:72px}}.clh,.clf{flex:0 0 auto;min-width:0}}
+@layer elcrm-components{.clr{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;box-sizing:border-box;background:var(--shell-background-muted);margin:var(--layout-margin);padding:var(--layout-padding);max-width:var(--layout-max-width);gap:0}.clx{height:var(--layout-height, 100dvh);max-height:var(--layout-height, 100dvh);overflow:hidden}.clm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain}.clr:not(.clx){height:auto;max-height:none;overflow:visible}.clr:not(.clx) .clm{overflow:visible;flex:0 1 auto;min-height:auto}.cls{flex-direction:row;align-items:stretch;gap:var(--layout-gap, 0)}.clb{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background:var(--layout-main-background, transparent);border-radius:var(--layout-main-radius, 0);box-shadow:var(--layout-main-shadow, none);border:var(--layout-main-border, none)}.clr:not(.clx) .clb{overflow:visible}.cla{display:flex;flex-direction:column;flex:0 0 var(--sidebar-width, 248px);width:var(--sidebar-width, 248px);min-width:0;min-height:0;align-self:stretch}.clk{overflow:hidden}.cla:not(.clk){overflow:auto}.cla>*{flex:1 1 auto;min-height:0;width:100%;height:100%;max-height:100%}@media (max-width: 900px){.cla{flex-basis:72px;width:72px}}.clh,.clf{flex:0 0 auto;min-width:0}}
 
 @layer elcrm-components{.csr{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:0;margin:0;list-style:none}.csh{flex-direction:row;flex-wrap:wrap}}
 
-@layer elcrm-components{.cgr{display:flex;align-items:center;justify-content:center;gap:var(--shell-gap-sm);padding:var(--shell-gap-lg);color:var(--shell-color-muted)}.cgi{box-sizing:border-box;width:var(--shell-icon-size);height:var(--shell-icon-size);border:2px solid var(--shell-border);border-top-color:var(--shell-color-accent);border-radius:var(--avatar-radius);animation:cgspin .7s linear infinite}}@keyframes cgspin{to{transform:rotate(360deg)}}
+@layer elcrm-components{.cgr{display:flex;align-items:center;justify-content:center;gap:var(--shell-gap-sm);padding:var(--shell-gap-lg);color:var(--shell-color-muted)}.cgi{box-sizing:border-box;width:var(--shell-icon-size);height:var(--shell-icon-size);border:2px solid var(--shell-border);border-top-color:var(--shell-color-accent);border-radius:var(--avatar-radius);animation:cgk .7s linear infinite}}@keyframes cgk{to{transform:rotate(360deg)}}
 
 @layer elcrm-components{.cmr{display:flex;align-items:center;gap:var(--shell-gap-sm);margin:0;padding:0;list-style:none}.cmv{flex-direction:column;align-items:stretch}.cmi{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--button-color-muted);padding:var(--button-padding);border-radius:var(--button-radius);font:inherit;line-height:1;cursor:pointer;text-align:left;gap:var(--shell-gap-sm)}.cmd{flex-shrink:0;min-width:16px;height:16px;padding:0 4px;font-size:10px}.cmi>svg{display:block;flex-shrink:0}.cmi:hover{background:var(--button-background-hover);color:var(--button-color)}.cma,.cmi[aria-current=page],.cmi[data-active=true]{background:var(--button-background-selected);color:var(--button-color)}.cmu{width:100%;align-items:stretch;gap:1.25rem;padding:0;border-bottom:1px solid var(--shell-border)}.cmu .cmi{border-radius:0;background:transparent;padding:.45rem .1rem .55rem;border-bottom:2px solid transparent;margin-bottom:-1px}.cmu .cmi:hover{background:transparent;color:var(--shell-color)}.cmu .cma,.cmu .cmi[aria-current=page],.cmu .cmi[data-active=true]{background:transparent;color:var(--shell-color);border-bottom-color:var(--shell-color-accent)}}
 
@@ -42,6 +44,8 @@
 
 @layer elcrm-components{.ckr{flex:1 1 auto;min-height:0;height:100%;width:100%;display:flex;flex-direction:column;box-sizing:border-box;padding:var(--shell-padding);overflow:hidden}.ckw{max-width:none}.ckb{flex:1 1 auto;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:var(--shell-gap)}.ckf{flex:0 0 auto;padding-top:var(--shell-gap-sm)}.cko{overflow:visible;height:auto}.cko .ckb{overflow:visible;flex:0 1 auto;min-height:auto}}
 
+@layer elcrm-components{.pBr{flex:0 0 auto;position:relative;width:0;min-width:0;min-height:0;align-self:stretch;overflow:hidden;opacity:0;pointer-events:none;transition:width .22s ease,opacity .18s ease,min-width .22s ease}.pBr[data-open=true]{width:var(--panel-info-width);min-width:var(--panel-info-width-min);opacity:1;pointer-events:auto}.pBs{display:flex;flex-direction:column;height:100%;min-height:0;width:var(--panel-info-width);min-width:var(--panel-info-width-min);box-sizing:border-box;border:var(--chat-border);border-radius:var(--chat-radius);background:var(--chat-background);color:var(--shell-color)}.pBh{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--shell-gap-sm);padding:var(--shell-gap);border-bottom:var(--chat-border)}.pBt{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pBa{flex:0 0 auto;display:flex;align-items:center;gap:.25rem}.pBc{width:2rem;height:2rem;border:0;border-radius:var(--shell-radius);background:transparent;color:var(--shell-color-muted);font-size:1.35rem;line-height:1;cursor:pointer}.pBc:hover{color:var(--shell-color);background:var(--shell-background-muted)}.pBb{flex:1 1 auto;min-height:0;overflow:auto;padding:var(--shell-gap)}.pBf{flex:0 0 auto;padding:var(--shell-gap);border-top:var(--chat-border)}.pBd{display:none}@media (max-width: 56rem){.pBr[data-open=true]{width:0;min-width:0;opacity:1;overflow:visible;pointer-events:none}.pBr[data-open=true] .pBd{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:inherit;pointer-events:auto;background:var(--panel-info-backdrop);cursor:pointer}.pBr[data-open=true] .pBs{position:fixed;top:0;right:0;bottom:0;z-index:inherit;width:min(100vw,var(--panel-info-overlay-max));min-width:0;max-width:100vw;border-radius:0;border-left:var(--chat-border);border-right:none;border-top:none;border-bottom:none;pointer-events:auto;box-shadow:var(--popup-shadow)}}}
+
 @layer elcrm-components{.c3r{position:relative;display:inline-flex;vertical-align:middle}.c3t{display:inline-flex;align-items:center;min-width:0;height:auto}.c3p{box-sizing:border-box;overflow:auto;padding:var(--shell-gap-sm);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);box-shadow:var(--popup-shadow);color:var(--shell-color);min-width:var(--dropdown-min-width);max-width:var(--dropdown-max-width);max-height:var(--dropdown-max-height)}}
 
 @layer elcrm-components{.cur{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--pricing-card-min-width),1fr));gap:var(--shell-gap-lg);align-items:stretch}.cui{position:relative;display:flex;flex-direction:column;gap:var(--shell-gap);padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);box-shadow:var(--shell-shadow)}.cui[data-selectable=true]{cursor:pointer}.cui:disabled,.cui[aria-disabled=true]{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cus,.cui[data-selected=true],.cui[data-highlighted=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected);box-shadow:var(--shell-shadow)}.cub{display:flex;align-items:center;justify-content:center;margin:calc(-1 * var(--shell-padding-block)) calc(-1 * var(--shell-padding-inline)) 0;padding:var(--shell-gap-sm) var(--shell-padding-inline);border-radius:var(--shell-radius) var(--shell-radius) 0 0;background:var(--shell-color-accent);color:var(--avatar-color);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);text-align:center}.cug{display:inline-flex;align-items:center;width:fit-content;padding:.15rem .5rem;border-radius:999px;background:var(--shell-background-hover);color:var(--shell-color-accent);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);line-height:1.2}.cua{position:absolute;top:0;left:50%;transform:translate(-50%,-50%)}.cum{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:calc(var(--shell-icon-size) * 1.6);height:calc(var(--shell-icon-size) * 1.6);color:var(--shell-color-accent);background:var(--shell-background-hover);border-radius:50%;overflow:hidden}.cuh{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}.cut{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cup{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm)}.cuz{font-size:calc(var(--shell-font-size-lg) * 1.35);font-weight:700;color:var(--shell-color);line-height:1.15}.cui[data-highlighted=true] .cuz,.cui[data-selected=true] .cuz{color:var(--shell-color-accent)}.cuo{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);text-decoration:line-through}.cue{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.cud{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cux{display:flex;flex-direction:column;gap:var(--shell-gap-sm)}.cuf{display:flex;flex-direction:column;gap:var(--shell-gap-sm);margin:auto calc(-1 * var(--shell-padding-inline)) calc(-1 * var(--shell-padding-block));padding:var(--shell-padding);background:var(--shell-background-muted);border-top:1px solid var(--shell-border);border-radius:0 0 var(--shell-radius) var(--shell-radius)}.cuy{display:flex;flex-direction:column;gap:var(--shell-gap-sm);margin-top:auto}.cul{margin:0;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);letter-spacing:.04em;text-transform:uppercase;color:var(--shell-color-muted)}.cuu{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.4}.cun{display:flex;flex-direction:column;gap:var(--shell-gap-sm);margin:0;padding:0;list-style:none}.cuc{display:flex;align-items:flex-start;gap:var(--shell-gap-sm);font-size:var(--shell-font-size-sm);color:var(--shell-color);line-height:1.4}.cuk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);margin-top:.1em;color:var(--avatar-color);background:var(--shell-color-success);border-radius:50%}.cuw{width:60%;height:60%;display:block}}
@@ -61,3 +65,5 @@
 @layer elcrm-components{.ctr{display:flex;flex-direction:column;gap:var(--shell-gap);width:100%;min-width:0}.ctb{display:flex;align-items:flex-end;gap:var(--shell-gap);border-bottom:1px solid var(--shell-border);min-width:0}.ctn{display:flex;align-items:stretch;gap:var(--shell-gap-lg);flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:thin}.ctt{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:var(--shell-gap-sm);flex:0 0 auto;margin:0 0 -1px;padding:var(--shell-padding-block) .15rem;border:none;border-bottom:2px solid transparent;background:transparent;color:var(--shell-color-muted);font:inherit;font-size:var(--shell-font-size);font-weight:500;white-space:nowrap;cursor:pointer}.ctt:hover:not(:disabled){color:var(--shell-color)}.cta{color:var(--shell-color);border-bottom-color:var(--shell-color-accent)}.ctt:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cte{display:inline-flex;align-items:center;justify-content:center;min-width:1.15em;height:1.15em;padding:0 .35em;border-radius:999px;background:var(--shell-color-danger);color:var(--avatar-color);font-size:var(--sidebar-group-font-size);font-style:normal;font-weight:700;line-height:1}.cts{flex:0 0 auto;display:flex;align-items:center;padding-bottom:var(--shell-gap-sm)}.ctm{min-width:0;width:100%}}
 
 @layer elcrm-components{.c6r{display:flex;flex-direction:column;gap:2px;min-width:0;text-align:left}.c6t{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.c6d{margin:0;font-size:var(--shell-font-size-sm);font-weight:400;color:var(--shell-color-muted);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.c6s .c6t{font-size:var(--shell-font-size-sm)}.c6l .c6t{font-size:var(--shell-font-size-lg)}.c6l .c6d{font-size:var(--shell-font-size)}}
+
+@layer elcrm-components{.cCr{display:flex;flex-wrap:wrap;align-items:center;gap:var(--toolbar-gap);width:100%;min-width:0;box-sizing:border-box}.cCr[data-width=s]{display:inline-flex;width:auto;max-width:100%}.cCr[data-align=center]{justify-content:center}.cCr[data-align=end]{justify-content:flex-end}.cCr[data-align=between]{justify-content:space-between}.cCr[data-size=s]{--control-height: var(--control-height-s);--field-height: var(--control-height-s);--control-font-size: 13px;--button-height: var(--button-height-s);--button-height-m: var(--button-height-s);--button-padding: var(--button-padding-s);--button-size-m: var(--button-size-s)}.cCr[data-size=l]{--control-height: var(--control-height-l);--field-height: var(--control-height-l);--button-height: var(--button-height-l);--button-height-m: var(--button-height-l);--button-size-m: var(--button-size-l)}}

package/dist/index.d.ts

@@ -14,6 +14,8 @@ export { Card } from './Card';
 export type { CardProps } from './Card';
 export { ActionGroup } from './ActionGroup';
 export type { ActionGroupProps } from './ActionGroup';
+export { Toolbar, useToolbar, applyToolbarSize } from './Toolbar';
+export type { ToolbarProps, ToolbarAlign, ToolbarWidth, ToolbarContextValue, } from './Toolbar';
 export { TextGroup } from './TextGroup';
 export type { TextGroupProps } from './TextGroup';
 export { Stat } from './Stat';
@@ -30,7 +32,7 @@ export type { StackProps, StackDirection, StackColumns } from './Stack';
 export { Menu } from './Menu';
 export type { MenuProps, MenuItem } from './Menu';
 export { Dropdown } from './Dropdown';
-export type { DropdownProps, DropdownItem, DropdownGroup, } from './Dropdown';
+export type { DropdownProps, DropdownItem, DropdownGroup } from './Dropdown';
 export { Breadcrumb } from './Breadcrumb';
 export type { BreadcrumbProps, BreadcrumbItem, BreadcrumbSeparator, } from './Breadcrumb';
 export { Loading } from './Loading';
@@ -75,6 +77,10 @@ export { Sidebar } from './Sidebar';
 export type { SidebarProps, SidebarGroup, SidebarItem, SidebarVariant, } from './Sidebar';
 export { Popover } from './Popover';
 export type { PopoverProps, PopoverPlacement } from './Popover';
+export { Healthmap } from './Healthmap';
+export type { HealthmapProps, HealthmapData, HealthmapDay, HealthmapUnit, } from './Healthmap';
+export { PanelInfo } from './PanelInfo';
+export type { PanelInfoProps } from './PanelInfo';
 export { acquireOverlayZIndex, releaseOverlayZIndex, peekOverlayZIndex, } from './overlayZ';
 export { createLazyResolver } from './lazyRoute';
 export type { LazyRouteChunk } from './lazyRoute';

package/dist/index.es.d.ts

@@ -14,6 +14,8 @@ export { Card } from './Card';
 export type { CardProps } from './Card';
 export { ActionGroup } from './ActionGroup';
 export type { ActionGroupProps } from './ActionGroup';
+export { Toolbar, useToolbar, applyToolbarSize } from './Toolbar';
+export type { ToolbarProps, ToolbarAlign, ToolbarWidth, ToolbarContextValue, } from './Toolbar';
 export { TextGroup } from './TextGroup';
 export type { TextGroupProps } from './TextGroup';
 export { Stat } from './Stat';
@@ -30,7 +32,7 @@ export type { StackProps, StackDirection, StackColumns } from './Stack';
 export { Menu } from './Menu';
 export type { MenuProps, MenuItem } from './Menu';
 export { Dropdown } from './Dropdown';
-export type { DropdownProps, DropdownItem, DropdownGroup, } from './Dropdown';
+export type { DropdownProps, DropdownItem, DropdownGroup } from './Dropdown';
 export { Breadcrumb } from './Breadcrumb';
 export type { BreadcrumbProps, BreadcrumbItem, BreadcrumbSeparator, } from './Breadcrumb';
 export { Loading } from './Loading';
@@ -75,6 +77,10 @@ export { Sidebar } from './Sidebar';
 export type { SidebarProps, SidebarGroup, SidebarItem, SidebarVariant, } from './Sidebar';
 export { Popover } from './Popover';
 export type { PopoverProps, PopoverPlacement } from './Popover';
+export { Healthmap } from './Healthmap';
+export type { HealthmapProps, HealthmapData, HealthmapDay, HealthmapUnit, } from './Healthmap';
+export { PanelInfo } from './PanelInfo';
+export type { PanelInfoProps } from './PanelInfo';
 export { acquireOverlayZIndex, releaseOverlayZIndex, peekOverlayZIndex, } from './overlayZ';
 export { createLazyResolver } from './lazyRoute';
 export type { LazyRouteChunk } from './lazyRoute';