urfu-ui-kit-react 2.1.3 → 2.1.4

package/dist/components/Multiselect/Multiselect.js

@@ -0,0 +1,408 @@
+import { jsxs as x, jsx as o, Fragment as Le } from "react/jsx-runtime";
+import { getFieldAccessibility$u as Be } from "../../shared/fieldAccessibility.js";
+import { useState as z, useRef as k, useMemo as le, useEffect as Ie } from "react";
+/* empty css                 */
+/* empty css             */
+/* empty css                                         */
+/* empty css                  */
+/* empty css                 */
+import { createPortal as We } from "react-dom";
+import _e from "../../hooks/useDebounce.js";
+import { useSelectEngine$u as Ge } from "../../hooks/useSelectEngine.js";
+import { OPTION_STATE_COLORS$u as ce } from "../../shared/optionStateColors.js";
+import { isSameOptionValue$u as h, getOptionKeys$u as Ye } from "../../shared/optionValue.js";
+import { getPopupTransitionStyle$u as re } from "../../shared/popupTransition.js";
+import { sizeClassName$u as Je, isCompact$u as Qe } from "../../shared/size.js";
+import { useMobilePicker$u as Ue } from "../../hooks/useMobilePicker.js";
+import { MobileOptionSheet$u as Xe } from "../Select/MobileOptionSheet.js";
+import { getPortalScopeProps$u as Ze } from "../../shared/uiKitDefaults.js";
+import { resolveValidation$u as qe } from "../../vanilla/core/validation.js";
+import { resolveSheetTitle$u as Ve } from "../../vanilla/core/sheetTitle.js";
+const yt = ({
+  "aria-label": C,
+  "aria-labelledby": M,
+  "aria-describedby": se,
+  title: y = "",
+  required: E = !1,
+  options: w,
+  styleSelectContainer: ne,
+  styleTitle: ae,
+  styleSelect: A,
+  lineUp: ue = !1,
+  placeholder: K = "Не выбрано",
+  values: i,
+  setValues: O,
+  isClearable: me = !1,
+  className: pe,
+  tableView: F = !1,
+  size: L,
+  validationText: de = "Заполните поле",
+  validationOn: B,
+  error: fe,
+  absoluteValidationText: xe,
+  disabled: l,
+  portalOn: he,
+  isSearchable: n,
+  onInputChange: b,
+  loading: g,
+  inputValue: v = "",
+  onInputValueChange: a,
+  noScroll: R,
+  id: be,
+  mobilePicker: ge
+}) => {
+  const s = Qe(L, F), I = Je(L, F), P = qe({ error: fe, validationOn: B, validationText: de }), [H, W] = z(""), S = k(null), _ = _e(H, 300), m = le(() => w.filter((e) => (e.label ?? "").toLowerCase().includes((_ || "").toLowerCase())), [_, w]), G = m.findIndex(
+    (e) => i.some((t) => h(t == null ? void 0 : t.value, e == null ? void 0 : e.value))
+  ), u = Ge({
+    optionsLength: m.length,
+    initialIndex: Math.max(0, G),
+    selectedIndex: G,
+    disabled: l,
+    portalOn: he,
+    loading: g,
+    id: be,
+    idPrefix: "u-multiselect",
+    getPortalPosition: (e) => ({ x: e.x, y: e.y + 60 + e.height + e.scrollY }),
+    // Поле растёт от чипов: строке варианта нужна его базовая высота, а не текущая.
+    measureFieldHeight: (e) => {
+      const t = parseFloat(getComputedStyle(e).minHeight), r = e.getBoundingClientRect().height;
+      return t > 0 ? Math.min(t, r) : r;
+    },
+    onSelectByIndex: (e) => {
+      const t = m[e];
+      t && Z.current(t);
+    }
+  }), {
+    isOpen: f,
+    blockRef: Y,
+    portalOptionsRef: ve,
+    optionsListRef: ye,
+    listboxId: p,
+    activeDescendantId: Oe,
+    activeIndex: Se,
+    hoveredIndex: Ne,
+    setHoveredIndex: J,
+    handleKeyDown: Q,
+    shouldRenderPortal: ke,
+    portalStatus: we,
+    shouldRenderLocal: Re,
+    localStatus: Pe,
+    isAnimated: U,
+    portalWidth: He,
+    usePortal: X
+  } = u, d = u.portalPosition, je = Be(p, y, E, P, {
+    "aria-label": C,
+    "aria-labelledby": M,
+    "aria-describedby": se
+  }), N = (e) => {
+    var t;
+    l || (i.some((r) => h(r.value, e.value)) ? O(i.filter((r) => !h(r.value, e.value))) : O([...i, e]), n && (W(""), (t = S.current) == null || t.focus()), n && a && a(""));
+  }, Z = k(N);
+  Z.current = N;
+  const De = (e) => {
+    l || O(i.filter((t) => !h(t.value, e.value)));
+  }, q = k(null), V = me && !l && (i == null ? void 0 : i.length) > 0, $e = () => {
+    if (l) return;
+    O([]), u.close();
+    const e = n && !c ? S.current : q.current;
+    e == null || e.focus();
+  }, j = typeof v == "string" && typeof a == "function", Te = j ? v : H, ze = (e) => {
+    l || (j ? a && a(e.target.value) : W(e.target.value), b && b(e.target.value));
+  }, Ce = le(() => Ye(m), [m]), c = Ue(ge), [ee, D] = z(!1), [Me, Ee] = z(""), te = k(u.close);
+  te.current = u.close, Ie(() => {
+    c ? te.current() : D(!1);
+  }, [c]);
+  const oe = () => {
+    l || (Ee(Ve(Y.current, { title: y, ariaLabel: C, ariaLabelledBy: M, placeholder: K })), D(!0));
+  }, Ae = (e) => {
+    e.key !== "Enter" && e.key !== " " && e.key !== "ArrowDown" || (e.preventDefault(), oe());
+  }, Ke = (e) => {
+    j && (a == null || a(e)), b == null || b(e);
+  }, ie = (e, t, r) => {
+    const $ = i.some((T) => h(T.value, e.value)), Fe = Ne === t || Se === t;
+    return /* @__PURE__ */ o(
+      "div",
+      {
+        className: "u-multiselectbox-option",
+        "data-option-index": t,
+        id: `${p}-option-${t}`,
+        role: "option",
+        "aria-selected": $,
+        style: Object.assign(
+          {},
+          s ? {
+            // Плотное поле — 43, а строка была 37: держим её не ниже поля
+            // и центрируем текст по вертикали.
+            minHeight: "var(--u-option-min-height, var(--u-compact-height))",
+            display: "flex",
+            alignItems: "center",
+            fontSize: "var(--u-compact-font-size)",
+            lineHeight: 1.6667,
+            padding: "calc(8 * var(--u-unit, 1px)) calc(5 * var(--u-unit, 1px))"
+          } : null,
+          $ ? { backgroundColor: ce.selectedBackground } : Fe ? { backgroundColor: ce.hoveredBackground } : null,
+          r && R ? {
+            maxHeight: "none"
+          } : null,
+          A
+        ),
+        onMouseEnter: () => J(t),
+        onMouseLeave: () => J(null),
+        children: /* @__PURE__ */ x(
+          "label",
+          {
+            className: "u-multiselectbox-option-checkbox",
+            style: s ? {
+              // Строка плотного варианта — flex: без растяжения метка сжималась
+              // до ширины текста, и клик по правой части строки не отмечал вариант.
+              flex: 1,
+              minHeight: 0,
+              padding: 0,
+              lineHeight: "calc(20 * var(--u-unit, 1px))",
+              color: "var(--u-option-color, #222222)"
+            } : { color: "var(--u-option-color, #222222)" },
+            children: [
+              /* @__PURE__ */ o(
+                "input",
+                {
+                  type: "checkbox",
+                  checked: $,
+                  onChange: (T) => {
+                    T.stopPropagation(), N(e);
+                  }
+                }
+              ),
+              /* @__PURE__ */ o("div", { style: s ? { marginRight: "calc(8 * var(--u-unit, 1px))" } : null }),
+              e.label
+            ]
+          }
+        )
+      },
+      Ce[t]
+    );
+  };
+  return /* @__PURE__ */ x(
+    "div",
+    {
+      className: `u-react-multiselect-container${I ? ` ${I}` : ""} ${pe ?? ""}`,
+      children: [
+        /* @__PURE__ */ x(
+          "div",
+          {
+            style: Object.assign(
+              {
+                display: "flex",
+                gap: "calc(4 * var(--u-preset-unit, 1px))",
+                flexDirection: ue ? "row" : "column"
+              },
+              ne
+            ),
+            children: [
+              y && /* @__PURE__ */ o(
+                "div",
+                {
+                  id: `${p}-label`,
+                  className: `${E ? "u-required" : ""} u-react-select-title`,
+                  style: Object.assign(
+                    {
+                      color: "var(--u-field-title-color, #545454)",
+                      fontSize: "var(--u-field-label-size-main, calc(14 * var(--u-unit, 1px)))"
+                    },
+                    ae
+                  ),
+                  children: y
+                }
+              ),
+              /* @__PURE__ */ x(
+                "div",
+                {
+                  className: `u-multiselectbox${l ? " u-multiselectbox-disabled" : ""} u-react-multiselect`,
+                  ref: Y,
+                  style: Object.assign(
+                    {
+                      width: "100%"
+                    },
+                    A
+                  ),
+                  children: [
+                    /* @__PURE__ */ x(
+                      "div",
+                      {
+                        ref: q,
+                        className: f ? "u-multiselectbox-select u-multiselectbox-select-open" : "u-multiselectbox-select",
+                        tabIndex: n && !c || l ? -1 : 0,
+                        role: "combobox",
+                        ...je,
+                        "aria-expanded": c ? ee : f,
+                        "aria-haspopup": c ? "dialog" : "listbox",
+                        "aria-controls": c ? void 0 : p,
+                        "aria-disabled": l || void 0,
+                        "aria-activedescendant": c ? void 0 : Oe,
+                        onKeyDown: c ? Ae : n ? void 0 : Q,
+                        onClick: (e) => {
+                          var t;
+                          if (c) {
+                            oe();
+                            return;
+                          }
+                          !f && n && !l && ((t = S.current) == null || t.focus()), u.toggle(e.currentTarget);
+                        },
+                        style: Object.assign(
+                          s ? {
+                            padding: "calc(6 * var(--u-unit, 1px)) calc(28 * var(--u-unit, 1px)) calc(5 * var(--u-unit, 1px)) calc(10 * var(--u-unit, 1px))",
+                            gridRowGap: "calc(4 * var(--u-unit, 1px))",
+                            borderRadius: "calc(8 * var(--u-unit, 1px))",
+                            minHeight: "calc(43 * var(--u-unit, 1px))"
+                          } : {},
+                          // Плотному полю справа хватало места только под стрелку — крестику нужен свой резерв.
+                          s && V ? { paddingRight: "calc(56 * var(--u-unit, 1px))" } : {},
+                          B && { border: "1px solid var(--u-color-error, #EF302B)" }
+                        ),
+                        children: [
+                          (i == null ? void 0 : i.length) <= 0 && H.length === 0 && (v == null ? void 0 : v.length) === 0 ? /* @__PURE__ */ o(
+                            "span",
+                            {
+                              style: Object.assign(
+                                { color: "var(--u-field-title-color, #545454)" },
+                                s ? { fontSize: "var(--u-compact-font-size)" } : {}
+                              ),
+                              className: "u-multiselectbox-select-label",
+                              children: K
+                            }
+                          ) : /* @__PURE__ */ o(Le, {}),
+                          i == null ? void 0 : i.map((e, t) => /* @__PURE__ */ o("div", { className: "u-multiselectbox-select-item-wrapper", children: /* @__PURE__ */ x("div", { className: `u-multiselectbox-select-item-container${s ? " u-multiselectbox-select-item-container--compact" : ""}`, children: [
+                            /* @__PURE__ */ o("span", { className: "u-multiselectbox-select-item", children: e.label }),
+                            /* @__PURE__ */ o("div", { className: "u-multiselectbox-select-cross", onClick: (r) => {
+                              r.stopPropagation(), De(e);
+                            } })
+                          ] }) }, t)),
+                          n && !c && /* @__PURE__ */ o(
+                            "input",
+                            {
+                              ref: S,
+                              className: "u-multiselectbox-search",
+                              disabled: l,
+                              "aria-disabled": l || void 0,
+                              value: Te,
+                              onChange: ze,
+                              onClick: (e) => {
+                                f && e.stopPropagation();
+                              },
+                              onKeyDown: Q
+                            }
+                          ),
+                          V ? /* @__PURE__ */ o(
+                            "i",
+                            {
+                              className: `u-selectbox-select-icon-cross u-multiselectbox-clear${s ? " u-multiselectbox-clear--compact" : ""}`,
+                              role: "button",
+                              "aria-label": "Очистить",
+                              onClick: (e) => {
+                                e.stopPropagation(), $e();
+                              }
+                            }
+                          ) : null,
+                          /* @__PURE__ */ o(
+                            "i",
+                            {
+                              className: "u-multiselectbox-select-icon-arrow",
+                              style: Object.assign(
+                                f ? {
+                                  transform: "rotate(180deg)"
+                                } : {},
+                                s ? {
+                                  top: "calc(15 * var(--u-unit, 1px))"
+                                } : {}
+                              )
+                            }
+                          )
+                        ]
+                      }
+                    ),
+                    f && g ? /* @__PURE__ */ o("div", { className: "u-multiselectbox-options", style: { textAlign: "center", padding: "calc(16 * var(--u-unit, 1px))" }, children: /* @__PURE__ */ o("span", { className: "u-multiselectbox-loading", children: "Загрузка..." }) }) : null,
+                    !g && X && ke && d && We(
+                      /* @__PURE__ */ o(
+                        "div",
+                        {
+                          className: "u-multiselectbox-options",
+                          ref: ve,
+                          ...Ze(),
+                          id: p,
+                          role: "listbox",
+                          "aria-multiselectable": !0,
+                          style: Object.assign(
+                            {
+                              width: He,
+                              left: d == null ? void 0 : d.x,
+                              top: (d == null ? void 0 : d.y) - 60,
+                              opacity: 1,
+                              visibility: "visible",
+                              height: "fit-content",
+                              // Переменная, чтобы список внутри модалки можно было
+                              // поднять над ней, не трогая код потребителя.
+                              zIndex: "var(--u-select-popup-z, 10010)",
+                              display: "block"
+                            },
+                            R ? {
+                              maxHeight: "none"
+                            } : {},
+                            u.optionsStyle,
+                            re(we, U)
+                          ),
+                          children: m.map((e, t) => ie(e, t, !1))
+                        }
+                      ),
+                      document.body
+                    ),
+                    !g && !X && Re ? /* @__PURE__ */ o(
+                      "div",
+                      {
+                        ref: ye,
+                        id: p,
+                        role: "listbox",
+                        "aria-multiselectable": !0,
+                        className: "u-multiselectbox-options",
+                        style: Object.assign(
+                          {},
+                          // см. Select: свой `display` на всё время жизни узла,
+                          // иначе переход срывается кадром с `display: none`
+                          { display: "block" },
+                          R ? {
+                            maxHeight: "none"
+                          } : {},
+                          u.optionsStyle,
+                          re(Pe, U)
+                        ),
+                        children: m.map((e, t) => ie(e, t, !0))
+                      }
+                    ) : null
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        P.showText && /* @__PURE__ */ o("h5", { id: `${p}-error`, className: "h5 clr-red-main", style: xe ? {
+          position: "absolute",
+          bottom: "calc(-20 * var(--u-unit, 1px))"
+        } : { position: "relative", marginTop: "calc(4 * var(--u-unit, 1px))" }, children: P.text }),
+        c ? /* @__PURE__ */ o(
+          Xe,
+          {
+            active: ee,
+            title: Me,
+            options: w,
+            multiple: !0,
+            isSelected: (e) => i.some((t) => h(t == null ? void 0 : t.value, e == null ? void 0 : e.value)),
+            onSelect: N,
+            onClose: () => D(!1),
+            searchable: n,
+            onSearchChange: Ke,
+            loading: g
+          }
+        ) : null
+      ]
+    }
+  );
+};
+export { yt as Multiselect$u };

package/dist/components/Notification/Notification.d.ts

@@ -1,5 +1,5 @@
 
-import './Notification.less';
+
 import React from 'react';
 /**
  * Оформление уведомления. Обратите внимание: ошибка — это `fail`, а не `error`;

package/dist/components/Notification/Notification.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":"AAEA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,qBAAqB,CAAC;AAC7B,OAAO,KAAK,MAAM,OAAO,CAAC;AA8H1B;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;AAE1E,wEAAwE;AACxE,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gHAAgH;IAChH,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,mBAAmB;IAChC,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iFAAiF;IACjF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,yGAAyG;IACzG,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC;CAC/B;AAED,MAAM,WAAW,eAAe;IAC5B;;;;;OAKG;IACH,gBAAgB,EAAE;QACd,CAAC,OAAO,EAAE,mBAAmB,GAAG,MAAM,GAAG,MAAM,CAAC;QAChD,CACI,OAAO,EAAE,mBAAmB,EAC5B,OAAO,EAAE,KAAK,CAAC,SAAS,EACxB,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,SAAS,GAAG,SAAS,CAAC,GAC3D,MAAM,GAAG,MAAM,CAAC;KACtB,CAAC;IACF,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAChD,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACnC;AA8BD,MAAM,WAAW,yBAAyB;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,oBAAoB,GAAI,4BAA4B,yBAAyB,4CA+ElF,CAAC;AAEF,QAAA,MAAM,eAAe,QAAO,eAM3B,CAAC;AAGF,iGAAiG;AACjG,QAAA,MAAM,uBAAuB,QAAO,eAAe,GAAG,SAA4C,CAAC;AAEnG,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,uBAAuB,EAAE,CAAC"}
+{"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":"AAEA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,2DAA2D,CAAC;AACnE,OAAO,KAAK,MAAM,OAAO,CAAC;AA8H1B;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;AAE1E,wEAAwE;AACxE,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gHAAgH;IAChH,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,mBAAmB;IAChC,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iFAAiF;IACjF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,yGAAyG;IACzG,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC;CAC/B;AAED,MAAM,WAAW,eAAe;IAC5B;;;;;OAKG;IACH,gBAAgB,EAAE;QACd,CAAC,OAAO,EAAE,mBAAmB,GAAG,MAAM,GAAG,MAAM,CAAC;QAChD,CACI,OAAO,EAAE,mBAAmB,EAC5B,OAAO,EAAE,KAAK,CAAC,SAAS,EACxB,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,SAAS,GAAG,SAAS,CAAC,GAC3D,MAAM,GAAG,MAAM,CAAC;KACtB,CAAC;IACF,gBAAgB,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAChD,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACnC;AA8BD,MAAM,WAAW,yBAAyB;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,oBAAoB,GAAI,4BAA4B,yBAAyB,4CAgFlF,CAAC;AAEF,QAAA,MAAM,eAAe,QAAO,eAM3B,CAAC;AAGF,iGAAiG;AACjG,QAAA,MAAM,uBAAuB,QAAO,eAAe,GAAG,SAA4C,CAAC;AAEnG,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,uBAAuB,EAAE,CAAC"}

package/dist/components/Notification/Notification.js

@@ -0,0 +1,156 @@
+import { jsxs as I, jsx as g } from "react/jsx-runtime";
+import { useState as S, useRef as p, useEffect as M, useCallback as C, useMemo as E, useContext as j, createContext as J, useLayoutEffect as L } from "react";
+import { createPortal as q } from "react-dom";
+/* empty css                 */
+/* empty css                                          */
+import { Button$u as G } from "../Button/Button.js";
+import { getPortalScopeProps$u as H } from "../../shared/uiKitDefaults.js";
+import { registerKitNotificationStack$u as Q, ownKitNode$u as R } from "../../vanilla/core/kitRegistry.js";
+const U = ({
+  variant: s,
+  children: w,
+  onHide: x,
+  show: a,
+  top: d,
+  right: o,
+  left: f,
+  zIndex: P,
+  inStack: b = !1,
+  autoHide: N,
+  duration: T = 3e3,
+  fadeOutDuration: r = 1e3,
+  onFadeOutEnd: t,
+  closable: e = !0
+}) => {
+  const [i, n] = S(a), [c, m] = S(0), [y, v] = S(150), h = p(null), k = p(null), $ = p(null), A = p(i);
+  A.current = i;
+  const u = p(t);
+  u.current = t, M(() => (a ? (n(!0), v(150), $.current = setTimeout(() => m(1), 10), N && T > r && (h.current = setTimeout(() => {
+    v(r), m(0);
+  }, T - r), k.current = setTimeout(() => {
+    var l;
+    n(!1), (l = u.current) == null || l.call(u);
+  }, T))) : A.current && (v(r), m(0), k.current = setTimeout(() => {
+    var l;
+    n(!1), (l = u.current) == null || l.call(u);
+  }, r)), () => {
+    clearTimeout(h.current), clearTimeout(k.current), clearTimeout($.current);
+  }), [a, T, r, N]);
+  const K = () => {
+    x(), N && (clearTimeout(h.current), clearTimeout(k.current), v(r), m(0), k.current = setTimeout(() => {
+      var l;
+      n(!1), (l = u.current) == null || l.call(u);
+    }, r));
+  }, B = (l) => {
+    switch (l) {
+      case "info":
+        return "u-notification";
+      case "fail":
+        return "u-notification-fail";
+      case "success":
+        return "u-notification-success";
+      case "warning":
+        return "u-notification-warning";
+      default:
+        return "u-notification";
+    }
+  };
+  return i && /* @__PURE__ */ I(
+    "div",
+    {
+      style: {
+        position: b ? "relative" : "fixed",
+        top: d,
+        right: o,
+        left: f,
+        zIndex: P,
+        opacity: c,
+        transition: `opacity ${y}ms`
+      },
+      role: s === "fail" || s === "warning" ? "alert" : "status",
+      className: `${B(s)} u-notification-responsive`,
+      children: [
+        w,
+        e && /* @__PURE__ */ g("button", { "aria-label": "Закрыть уведомление", onClick: K, className: "u-notification-hide" })
+      ]
+    }
+  );
+}, z = J(void 0), W = ({ queued: s, className: w, style: x, children: a }) => {
+  const d = p(null);
+  return L(() => {
+    const o = d.current;
+    if (o)
+      return s ? Q(o) : R(o);
+  }, [s]), /* @__PURE__ */ g("div", { ref: d, ...H(), className: w, style: x, children: a });
+}, tt = ({ children: s, headerHeight: w }) => {
+  const [x, a] = S([]), d = p(0), o = p(/* @__PURE__ */ new Map());
+  M(() => {
+    const t = o.current;
+    return () => {
+      t.forEach(clearTimeout), t.clear();
+    };
+  }, []);
+  const f = C((t) => {
+    clearTimeout(o.current.get(t)), o.current.delete(t), a((e) => e.map((i) => i.totalId === t ? { ...i, show: !1 } : i));
+  }, []), P = C((t) => {
+    a((e) => e.filter((i) => i.totalId !== t));
+  }, []), b = C((t, e, i) => {
+    const n = {
+      variant: "info",
+      message: "",
+      // top и right пустые — место задаёт .u-notification-stack: под шапкой, по макету.
+      duration: 3e3,
+      left: "unset",
+      top: "",
+      right: "",
+      zIndex: "101",
+      closable: !0,
+      ...typeof t == "string" ? { variant: t, message: e ?? "", ...i } : t
+    }, c = n.id ?? `notification-${++d.current}`;
+    return clearTimeout(o.current.get(c)), o.current.delete(c), a((m) => [...m.filter((y) => y.totalId !== c), { ...n, totalId: c, show: !0 }]), n.duration > 0 && !n.action && o.current.set(c, setTimeout(() => f(c), n.duration)), c;
+  }, [f]), N = C(() => {
+    o.current.forEach(clearTimeout), o.current.clear(), a((t) => t.map((e) => ({ ...e, show: !1 })));
+  }, []), T = E(
+    () => ({ showNotification: b, hideNotification: f, hideAllNotification: N }),
+    [b, f, N]
+  ), r = /* @__PURE__ */ new Map();
+  return x.forEach((t) => {
+    const e = JSON.stringify([t.top, t.right, t.left, t.zIndex]), i = r.get(e) ?? [];
+    i.push(t), r.set(e, i);
+  }), /* @__PURE__ */ I(z.Provider, { value: T, children: [
+    s,
+    typeof document < "u" && q(Array.from(r, ([t, e]) => /* @__PURE__ */ g(W, { queued: !e[0].top && !e[0].right && (e[0].left === "unset" || e[0].left === "auto"), className: `u-notification-stack ${e[0].left !== "unset" && e[0].left !== "auto" ? "u-notification-stack-left" : ""}`, style: {
+      top: e[0].top || void 0,
+      right: e[0].right || void 0,
+      left: e[0].left,
+      zIndex: e[0].zIndex,
+      "--u-app-header-height": w
+    }, children: e.map(({ totalId: i, variant: n, message: c, show: m, duration: y, closable: v, action: h }) => /* @__PURE__ */ g(
+      U,
+      {
+        inStack: !0,
+        show: m,
+        variant: n,
+        onHide: () => f(i),
+        onFadeOutEnd: () => P(i),
+        autoHide: !1,
+        duration: y,
+        closable: v,
+        children: h ? /* @__PURE__ */ I("span", { className: "u-notification-content", children: [
+          c,
+          " ",
+          /* @__PURE__ */ g(G, { variant: "text", className: "u-notification-action", onClick: () => {
+            h.closeOnAction !== !1 && f(i), h.onClick();
+          }, children: h.label })
+        ] }) : c
+      },
+      i
+    )) }, t)), document.body)
+  ] });
+}, et = () => {
+  const s = j(z);
+  if (!s)
+    throw new Error("useNotification must be used within a NotificationProvider");
+  return s;
+}, it = () => j(z);
+export { tt as NotificationProvider$u, et as useNotification$u, it as useOptionalNotification$u };

package/dist/components/OfflineBanner/OfflineBanner.d.ts

@@ -1,7 +1,7 @@
 import { type ReactNode } from 'react';
 import { type NotificationOptions } from '../Notification/Notification';
 import '../../styles/tokens.less';
-import './OfflineBanner.less';
+
 export interface OfflineBannerProperties {
     /** Текст, пока связи нет. */
     text?: ReactNode;

package/dist/components/OfflineBanner/OfflineBanner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OfflineBanner.d.ts","sourceRoot":"","sources":["../../../src/components/OfflineBanner/OfflineBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,EAA2B,KAAK,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACjG,OAAO,0BAA0B,CAAC;AAClC,OAAO,sBAAsB,CAAC;AAE9B,MAAM,WAAW,uBAAuB;IACpC,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,uEAAuE;IACvE,YAAY,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAChC;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,SAAS,GAAG,SAAS,GAAG,IAAI,GAAG,UAAU,CAAC,GAAG,KAAK,CAAC;IAC5F,2FAA2F;IAC3F,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,sFAAsF;IACtF,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,0FAA0F;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAOD;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,EAC1B,IAAmB,EAAE,YAAoC,EAAE,gBAAuB,EAClF,YAAmC,EACnC,WAAW,EAAE,OAAO,EAAE,SAAc,GACvC,EAAE,uBAAuB,2CAiDzB"}
+{"version":3,"file":"OfflineBanner.d.ts","sourceRoot":"","sources":["../../../src/components/OfflineBanner/OfflineBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,EAA2B,KAAK,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACjG,OAAO,0BAA0B,CAAC;AAClC,OAAO,6DAA6D,CAAC;AAErE,MAAM,WAAW,uBAAuB;IACpC,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,uEAAuE;IACvE,YAAY,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAChC;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,SAAS,GAAG,SAAS,GAAG,IAAI,GAAG,UAAU,CAAC,GAAG,KAAK,CAAC;IAC5F,2FAA2F;IAC3F,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,sFAAsF;IACtF,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,0FAA0F;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAOD;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,EAC1B,IAAmB,EAAE,YAAoC,EAAE,gBAAuB,EAClF,YAAmC,EACnC,WAAW,EAAE,OAAO,EAAE,SAAc,GACvC,EAAE,uBAAuB,2CAiDzB"}

package/dist/components/OfflineBanner/OfflineBanner.js

@@ -0,0 +1,40 @@
+import { jsx as u, jsxs as g } from "react/jsx-runtime";
+import { useState as R, useRef as E, useId as S, useEffect as _ } from "react";
+import { useOnlineStatus$u as A } from "../../hooks/useOnlineStatus.js";
+import { useOptionalNotification$u as D } from "../Notification/Notification.js";
+/* empty css                  */
+/* empty css                                            */
+const F = "Нет связи с интернетом. Показаны ранее загруженные данные — они могут быть неактуальны.", $ = "Связь восстановлена", h = { duration: 6e3, top: "16px", right: "16px", zIndex: "2000" };
+function z({
+  text: o = F,
+  restoredText: i = $,
+  restoredDuration: d = 3e3,
+  notification: s = h,
+  onReconnect: m,
+  offline: w,
+  className: O = ""
+}) {
+  const I = A(), t = w ?? !I, [b, r] = R(!1), a = E(t), f = D(), v = !!f && s !== !1, l = `u-offline-${S()}`, p = E({ onReconnect: m, text: o, restoredText: i, restoredDuration: d, notification: s, notifications: f });
+  p.current = { onReconnect: m, text: o, restoredText: i, restoredDuration: d, notification: s, notifications: f }, _(() => {
+    var T;
+    const e = p.current, n = e.notification !== !1 ? e.notifications : void 0, N = e.notification || h;
+    if (t)
+      return a.current = !0, r(!1), n == null || n.showNotification({ ...N, id: l, variant: "warning", message: e.text, duration: 0, closable: !1 }), () => {
+        n == null || n.hideNotification(l);
+      };
+    if (!a.current || (a.current = !1, (T = e.onReconnect) == null || T.call(e), e.restoredText === null)) return;
+    if (n) {
+      n.showNotification({ ...N, variant: "success", message: e.restoredText });
+      return;
+    }
+    r(!0);
+    const x = window.setTimeout(() => r(!1), e.restoredDuration);
+    return () => window.clearTimeout(x);
+  }, [t, l]);
+  const c = v ? null : t ? "offline" : b ? "restored" : null;
+  return /* @__PURE__ */ u("div", { className: `u-offline-banner-region ${O}`, role: "status", "aria-live": "polite", children: c && /* @__PURE__ */ g("div", { className: `u-offline-banner u-offline-banner-${c}`, children: [
+    /* @__PURE__ */ u("span", { className: "u-offline-banner-icon", "aria-hidden": "true" }),
+    /* @__PURE__ */ u("span", { className: "u-offline-banner-text", children: c === "offline" ? o : i })
+  ] }) });
+}
+export { z as OfflineBanner$u };

package/dist/components/Pagination/Pagination.d.ts

@@ -1,4 +1,4 @@
-import "./Pagination.less";
+
 import type { PaginationProps } from "./Pagination.types";
 export declare function Pagination({ totalItems, currentPage, pageSize, onPageChange, onPageSizeChange, dataLength, pageWindow, pageSizeOptions, resultsRenderer, hideResults, className, style, marginTop, }: PaginationProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Pagination.d.ts.map

package/dist/components/Pagination/Pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EACV,eAAe,EAEhB,MAAM,oBAAoB,CAAC;AA4D5B,wBAAgB,UAAU,CAAC,EACzB,UAAU,EACV,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,UAAc,EACd,eAAe,EACf,eAAe,EACf,WAAmB,EACnB,SAAc,EACd,KAAK,EACL,SAAS,GACV,EAAE,eAAe,2CAoHjB"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,yDAAyD,CAAC;AACjE,OAAO,KAAK,EACV,eAAe,EAEhB,MAAM,oBAAoB,CAAC;AA4D5B,wBAAgB,UAAU,CAAC,EACzB,UAAU,EACV,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,UAAc,EACd,eAAe,EACf,eAAe,EACf,WAAmB,EACnB,SAAc,EACd,KAAK,EACL,SAAS,GACV,EAAE,eAAe,2CAsHjB"}