skillgrid 0.0.80 → 0.0.82

package/dist/components/Progress/lib/resolve-circle-indicator-class-name.js

@@ -0,0 +1,7 @@
+const n = (i, r, t) => {
+  if (i)
+    return i.startsWith("typography-") ? i in r ? r[i] : void 0 : i in t ? t[i] : void 0;
+};
+export {
+  n as resolveCircleIndicatorClassName
+};

package/dist/components/Radio/Radio.js

@@ -0,0 +1,108 @@
+import { jsxs as c, jsx as m } from "react/jsx-runtime";
+import { forwardRef as O } from "react";
+import { clsx as d } from "clsx";
+import a from "./Radio.module.css.js";
+const P = "radio-container-", j = "radio-label", q = O(
+  (y, C) => {
+    const {
+      name: f,
+      id: R,
+      value: o,
+      size: b = "large",
+      loading: v = !1,
+      error: h,
+      disabled: D = !1,
+      checked: l = !1,
+      containerClassName: p,
+      className: T,
+      children: N,
+      clickable: _ = "all",
+      mode: n = "default",
+      tabIndex: $,
+      style: g,
+      containerStyle: w,
+      onChange: e,
+      "data-testid": E,
+      ...A
+    } = y, I = !!h, r = D || v, t = _ === "all", k = n === "card", u = a[`${b}Card`], s = R ?? f, S = (i) => {
+      r || e == null || e(o, i);
+    }, B = (i) => {
+      i.key === "Enter" && !r && (i.preventDefault(), e == null || e(o));
+    }, F = (i) => i.stopPropagation(), L = () => /* @__PURE__ */ c(
+      "div",
+      {
+        className: d(
+          a.radio,
+          a[b],
+          {
+            [a.checked]: l,
+            [a.disabled]: r,
+            [a.error]: I && !r
+          },
+          T
+        ),
+        style: g,
+        tabIndex: $ || 1,
+        "data-testid": `${P}${s}`,
+        children: [
+          /* @__PURE__ */ m(
+            "input",
+            {
+              "aria-errormessage": h,
+              "aria-invalid": I,
+              checked: l,
+              className: a.input,
+              "data-testid": `radio-${s}`,
+              disabled: r,
+              id: s,
+              name: f,
+              ref: C,
+              type: "radio",
+              value: o,
+              onChange: S,
+              onClick: F
+            }
+          ),
+          /* @__PURE__ */ m("svg", { "data-testid": `radio-icon-${s}`, viewBox: "0 0 8 8", className: a.icon, children: /* @__PURE__ */ m("circle", { cx: 4, cy: 4, fill: "current", r: 4 }) })
+        ]
+      }
+    ), x = () => /* @__PURE__ */ c(
+      "label",
+      {
+        "aria-checked": l,
+        "aria-disabled": r,
+        "data-testid": t ? E : j,
+        htmlFor: s,
+        style: w,
+        className: d(a.label, {
+          [d(a.container, a[n], p)]: t,
+          [u]: t && k
+        }),
+        onKeyDown: B,
+        ...A,
+        children: [
+          L(),
+          t && N
+        ]
+      }
+    );
+    return t ? x() : /* @__PURE__ */ c(
+      "div",
+      {
+        className: d(a.container, a[n], p, {
+          [u]: k
+        }),
+        "data-testid": E,
+        children: [
+          x(),
+          N
+        ]
+      }
+    );
+  }
+);
+export {
+  P as RADIO_CONTAINER_TEST_PREFIX,
+  j as RADIO_LABEL_TEST_PREFIX,
+  q as Radio
+};

package/dist/components/Radio/Radio.module.css.js

@@ -0,0 +1,36 @@
+import '../../assets/components/Radio/Radio.module-TNOIshDX.css';const d = "_radio_nm7dp_59", _ = "_checked_nm7dp_80", n = "_error_nm7dp_85", a = "_disabled_nm7dp_94", e = "_icon_nm7dp_130", m = "_small_nm7dp_138", r = "_medium_nm7dp_145", c = "_large_nm7dp_152", l = "_label_nm7dp_159", o = "_container_nm7dp_185", s = "_input_nm7dp_198", t = "_card_nm7dp_205", i = "_smallCard_nm7dp_211", p = "_mediumCard_nm7dp_215", u = "_largeCard_nm7dp_219", C = {
+  default: "_default_nm7dp_53",
+  radio: d,
+  checked: _,
+  error: n,
+  disabled: a,
+  icon: e,
+  small: m,
+  medium: r,
+  large: c,
+  label: l,
+  container: o,
+  input: s,
+  card: t,
+  smallCard: i,
+  mediumCard: p,
+  largeCard: u
+};
+export {
+  t as card,
+  _ as checked,
+  o as container,
+  C as default,
+  a as disabled,
+  n as error,
+  e as icon,
+  s as input,
+  l as label,
+  c as large,
+  u as largeCard,
+  r as medium,
+  p as mediumCard,
+  d as radio,
+  m as small,
+  i as smallCard
+};

package/dist/components/Radio/RadioGroup/RadioGroup.js

@@ -0,0 +1,51 @@
+import { jsx as s } from "react/jsx-runtime";
+import { forwardRef as b } from "react";
+import R from "classnames";
+import t from "./RadioGroup.module.css.js";
+import { Radio as S } from "../Radio.js";
+const w = b(
+  (e, i) => {
+    const {
+      id: o,
+      name: a,
+      value: m,
+      options: c,
+      className: l,
+      radioClassName: n,
+      disabled: p = !1,
+      layout: f = "vertical",
+      "data-testid": u,
+      ...g
+    } = e;
+    return /* @__PURE__ */ s(
+      "div",
+      {
+        className: R(t.group, t[f], l),
+        "data-testid": u ?? `radio-group-${a}`,
+        id: o,
+        ref: i,
+        children: c.map(({ label: v, value: r, disabled: N }) => {
+          const d = `${a}-${String(r)}`, h = String(r) === String(m);
+          return /* @__PURE__ */ s(
+            S,
+            {
+              id: d,
+              checked: h,
+              "data-testid": d,
+              disabled: p || N,
+              name: a,
+              value: r,
+              className: n,
+              ...g,
+              children: v
+            },
+            d
+          );
+        })
+      }
+    );
+  }
+);
+export {
+  w as RadioGroup
+};

package/dist/components/Radio/RadioGroup/RadioGroup.module.css.js

@@ -0,0 +1,11 @@
+import '../../../assets/components/Radio/RadioGroup/RadioGroup.module-DkqUcs7C.css';const t = "_group_tnviu_7", o = "_vertical_tnviu_12", n = "_horizontal_tnviu_16", r = {
+  group: t,
+  vertical: o,
+  horizontal: n
+};
+export {
+  r as default,
+  t as group,
+  n as horizontal,
+  o as vertical
+};

package/dist/components/Radio/index.js

@@ -0,0 +1,8 @@
+import { Radio as o } from "./Radio.js";
+import { RadioGroup as i } from "./RadioGroup/RadioGroup.js";
+const p = Object.assign(o, {
+  Group: i
+});
+export {
+  p as Radio
+};

package/dist/components/SegmentedControl/SegmentedControl.js

@@ -0,0 +1,102 @@
+import { jsxs as S, jsx as m } from "react/jsx-runtime";
+import { clsx as f } from "clsx";
+import r from "./SegmentedControl.module.css.js";
+import u from "../../styles/typography.module.css.js";
+import { useState as b, useRef as w, useEffect as A, useLayoutEffect as J, Fragment as P } from "react";
+import { useCompatId as W } from "../../hooks/useCompatId.js";
+import { generateHash as B } from "../../lib/generate-hash.js";
+const N = {
+  s: u["typography-label-3-regular"],
+  m: u["typography-label-2-regular"],
+  l: u["typography-label-2-regular"]
+}, U = (C) => {
+  const {
+    className: I,
+    defaultValue: x,
+    value: a,
+    size: o = "m",
+    segments: t,
+    stretched: g,
+    disabled: n = !1,
+    mode: h = "label",
+    onChange: i,
+    ...k
+  } = C, p = W("segmented-control"), [y, v] = b(x || t[0].value), [E, V] = b({ width: 0, left: 0, height: 0 }), s = w(null);
+  A(() => {
+    a != null && v(a);
+  }, [a]), J(() => {
+    j();
+  }, [y, t, o, g, h]);
+  const j = () => {
+    if (!(s != null && s.current)) return;
+    const e = s.current.querySelector(
+      '[data-is-active-segment="true"]'
+    );
+    e && V({
+      width: e.offsetWidth,
+      left: e.offsetLeft,
+      height: e.offsetHeight
+    });
+  }, z = (e) => {
+    n || (v(e), i == null || i(e));
+  };
+  return (t == null ? void 0 : t.length) === 0 ? null : /* @__PURE__ */ S(
+    "fieldset",
+    {
+      className: f(
+        r.segmentedControl,
+        r[o],
+        r[h],
+        {
+          [r.stretched]: g,
+          [r.disabled]: n
+        },
+        I
+      ),
+      "data-testid": "segmented-control-container",
+      ref: s,
+      disabled: n,
+      ...k,
+      children: [
+        t == null ? void 0 : t.map(({ label: e, value: c, containerProps: F = {} }, H) => {
+          const { className: L, ...O } = F, q = () => z(c), l = JSON.stringify(c), d = y === c;
+          return /* @__PURE__ */ S(P, { children: [
+            /* @__PURE__ */ m(
+              "input",
+              {
+                id: p + l,
+                value: l,
+                type: "radio",
+                checked: d,
+                readOnly: !0
+              }
+            ),
+            /* @__PURE__ */ m(
+              "label",
+              {
+                "data-is-active-segment": d,
+                className: f(r.segment, N[o], { [r.selected]: d }, L),
+                htmlFor: p + l,
+                "data-testid": "segmented-control-segment",
+                onClick: q,
+                ...O,
+                children: e
+              }
+            )
+          ] }, B(l) + H);
+        }),
+        /* @__PURE__ */ m(
+          "div",
+          {
+            className: f(r.activeSegmentIndicator, N[o]),
+            "data-testid": "segmented-control-segment-active-indicator",
+            style: E
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  U as SegmentedControl
+};

package/dist/components/SegmentedControl/SegmentedControl.module.css.js

@@ -0,0 +1,71 @@
+import '../../assets/components/SegmentedControl/SegmentedControl.module-BTus_O5Y.css';const t = "_base_4dkq5_1", o = "_content_4dkq5_1", _ = "_background_4dkq5_1", n = "_button_4dkq5_1", d = "_link_4dkq5_1", e = "_input_4dkq5_1", c = "_suffix_4dkq5_1", s = "_prefix_4dkq5_1", a = "_tooltip_4dkq5_1", r = "_hint_4dkq5_1", i = "_dropdown_4dkq5_1", l = "_popover_4dkq5_1", k = "_modalBackdrop_4dkq5_1", q = "_modal_4dkq5_1", p = "_overlay_4dkq5_1", m = "_drawer_4dkq5_1", b = "_notification_4dkq5_1", g = "_alert_4dkq5_1", f = "_toast_4dkq5_1", u = "_loading_4dkq5_1", v = "_error_4dkq5_1", x = "_critical_4dkq5_1", h = "_segmentedControl_4dkq5_7", w = "_segment_4dkq5_7", y = "_activeSegmentIndicator_4dkq5_61", B = "_selected_4dkq5_80", C = "_stretched_4dkq5_89", I = "_disabled_4dkq5_97", S = "_s_4dkq5_7", $ = "_icon_4dkq5_110", j = "_label_4dkq5_114", z = "_m_4dkq5_1", A = "_l_4dkq5_114", D = {
+  base: t,
+  content: o,
+  background: _,
+  button: n,
+  link: d,
+  input: e,
+  suffix: c,
+  prefix: s,
+  tooltip: a,
+  hint: r,
+  dropdown: i,
+  popover: l,
+  modalBackdrop: k,
+  modal: q,
+  overlay: p,
+  drawer: m,
+  notification: b,
+  alert: g,
+  toast: f,
+  loading: u,
+  error: v,
+  critical: x,
+  segmentedControl: h,
+  segment: w,
+  activeSegmentIndicator: y,
+  selected: B,
+  stretched: C,
+  disabled: I,
+  s: S,
+  icon: $,
+  label: j,
+  m: z,
+  l: A
+};
+export {
+  y as activeSegmentIndicator,
+  g as alert,
+  _ as background,
+  t as base,
+  n as button,
+  o as content,
+  x as critical,
+  D as default,
+  I as disabled,
+  m as drawer,
+  i as dropdown,
+  v as error,
+  r as hint,
+  $ as icon,
+  e as input,
+  A as l,
+  j as label,
+  d as link,
+  u as loading,
+  z as m,
+  q as modal,
+  k as modalBackdrop,
+  b as notification,
+  p as overlay,
+  l as popover,
+  s as prefix,
+  S as s,
+  w as segment,
+  h as segmentedControl,
+  B as selected,
+  C as stretched,
+  c as suffix,
+  f as toast,
+  a as tooltip
+};

package/dist/components/Snackbar/Provider/SnackbarProvider.js

@@ -0,0 +1,76 @@
+import { jsx as n, jsxs as y } from "react/jsx-runtime";
+import { useReducer as I, useEffect as c } from "react";
+import d from "react-dom";
+import T from "classnames";
+import { nanoid as k } from "nanoid";
+import i from "./SnackbarProvider.module.css.js";
+import { Snackbar as w } from "../Snackbar.js";
+import { snackbarReducer as O } from "../lib/snackbarReducer/snackbarReducer.js";
+import { MAX_VISIBLE as R } from "../lib/constants.js";
+import { SnackbarContext as q } from "../lib/useSnackbar.js";
+const V = (p) => {
+  const { children: m, dataTestId: f = "snackbar-wrapper" } = p, [o, s] = I(O, { visible: [], queue: [] }), u = (e) => {
+    const t = k(), r = { ...e, id: t, open: !0 };
+    s({ type: "ENQUEUE", snack: r });
+  }, S = (e) => {
+    s({ type: "REMOVE", id: e });
+  };
+  c(() => {
+    s({ type: "SHOW_NEXT" });
+  }, [o.queue, o.visible]), c(() => {
+    if (o.queue.length !== 0)
+      if (o.visible.length >= R) {
+        const e = o.visible[0];
+        s({ type: "START_EXIT", id: e.id });
+      } else
+        s({ type: "SHOW_NEXT" });
+  }, [o.queue]);
+  const l = (e) => e.map((t, r) => {
+    const g = (e.length - 1 - r) * -8, a = e.length > 1;
+    a && !t.wasInStack && (t.wasInStack = !0);
+    const x = t.wasInStack || a ? "fix" : t.mode;
+    return /* @__PURE__ */ n(
+      "div",
+      {
+        "data-testid": f,
+        className: i.snackWrapper,
+        style: {
+          transform: `translateY(${g}px)`
+        },
+        children: /* @__PURE__ */ n(
+          w,
+          {
+            ...t,
+            open: !t.exiting,
+            isStack: a,
+            mode: x,
+            forceClose: t.exiting,
+            onClose: () => S(t.id)
+          }
+        )
+      },
+      t.id
+    );
+  }), b = o.visible.filter((e) => !e.parent), h = o.visible.filter((e) => e.parent), v = d.createPortal(
+    /* @__PURE__ */ n("div", { className: i.stack, children: l(b) }),
+    document.body
+  ), E = h.reduce((e, t) => {
+    if (!t.parent) return e;
+    const r = t.parent.id || `parent-${t.parent.className}`;
+    return (e[r] || (e[r] = [])).push(t), e;
+  }, {}), N = Object.entries(E).map(([e, t]) => {
+    const r = t[0];
+    return r.parent ? d.createPortal(
+      /* @__PURE__ */ n("div", { className: T(i.stack, i.local), children: l(t) }, e),
+      r.parent
+    ) : null;
+  });
+  return /* @__PURE__ */ y(q.Provider, { value: { show: u }, children: [
+    m,
+    v,
+    N
+  ] });
+};
+export {
+  V as SnackbarProvider
+};

package/dist/components/Snackbar/Provider/SnackbarProvider.module.css.js

@@ -0,0 +1,11 @@
+import '../../../assets/components/Snackbar/Provider/SnackbarProvider.module-F1FVM9qU.css';const a = "_stack_11xtv_1", c = "_local_11xtv_19", s = "_snackWrapper_11xtv_28", t = {
+  stack: a,
+  local: c,
+  snackWrapper: s
+};
+export {
+  t as default,
+  c as local,
+  s as snackWrapper,
+  a as stack
+};

package/dist/components/Snackbar/Snackbar.js

@@ -0,0 +1,157 @@
+import { jsxs as w, jsx as n } from "react/jsx-runtime";
+import { forwardRef as W, useRef as i, useState as x, useEffect as a } from "react";
+import e from "./Snackbar.module.css.js";
+import b from "classnames";
+import { useSwipe as Z } from "./lib/useSwipe.js";
+import { Typography as _ } from "../Typography/Typography.js";
+import { Button as E } from "../Button/Button.js";
+import { CloseIcon as $ } from "./assets/close.js";
+import { stackDurationMap as tt, durationMap as et, animationMap as nt } from "./lib/constants.js";
+import { Loader as ot } from "../Loader/Loader.js";
+import { InfoIcon as it } from "./assets/info.js";
+import { ErrorIcon as st } from "./assets/error.js";
+import { SuccessIcon as rt } from "./assets/success.js";
+const xt = W((M, u) => {
+  const {
+    open: o,
+    variant: d = "info",
+    mode: H = "fix",
+    onClose: p,
+    autoHideDuration: S = 6e3,
+    disableAutoHide: h = !1,
+    showButtonClose: A = !0,
+    showIcon: B = !0,
+    content: v,
+    classNameSnackbarRoot: D,
+    icon: N,
+    isStack: k = !1,
+    forceClose: R,
+    linkButtonProps: y,
+    closeOnLinkClick: V = !0,
+    "data-testid": j = "snackbar"
+  } = M, L = i(null), T = i(null), [g, z] = x(!1), [l, m] = x(!1), [C, f] = x(), F = i(0), O = i(0), X = i(0), Y = i(0), q = i(!1), s = i(null), c = (t) => {
+    clearTimeout(s.current || 0), s.current = null;
+    const r = k ? tt[t] : et[t];
+    t === "swipe" || (m(!0), f(t)), s.current = setTimeout(() => {
+      p == null || p(), m(!1), f(void 0), s.current = null;
+    }, r);
+  };
+  Z({
+    ref: T,
+    open: o,
+    onClose: c,
+    setExiting: m,
+    setExitReason: f,
+    swiping: q,
+    startX: F,
+    startY: O,
+    currentX: X,
+    currentY: Y
+  }), a(() => {
+    R && c("close");
+  }, [R]), a(() => {
+    if (o && !h && d !== "loading") {
+      const t = setTimeout(() => c("timeout"), S);
+      return () => clearTimeout(t);
+    }
+  }, [o, h, d, S]), a(() => {
+    o && (m(!1), f(void 0));
+  }, [o]), a(() => {
+    const t = L.current;
+    t && requestAnimationFrame(() => {
+      const r = parseFloat(getComputedStyle(t).lineHeight), I = t.offsetHeight, U = Math.round(I / r);
+      z(U > 1);
+    });
+  }, [v]), a(() => {
+    if (!o) return;
+    const t = (r) => {
+      r.key === "Escape" && c("escape");
+    };
+    return window.addEventListener("keydown", t), () => window.removeEventListener("keydown", t);
+  }, [o]), a(() => () => {
+    s.current && (clearTimeout(s.current), s.current = null);
+  }, []);
+  const K = l && C && e[nt[C]];
+  if (!o && !l) return null;
+  const P = {
+    success: /* @__PURE__ */ n(rt, { className: e.icon }),
+    error: /* @__PURE__ */ n(st, { className: e.icon }),
+    info: /* @__PURE__ */ n(it, { className: e.icon }),
+    loading: /* @__PURE__ */ n(ot, { "data-testid": "snackbar-icon-loading", variant: "contrast" })
+  }, G = b(
+    e.snackbar,
+    e[H],
+    { [e.exiting]: l && C },
+    { [e.snackbarVertical]: g },
+    D,
+    K,
+    {
+      [e.snackbarStack]: k && !l,
+      // при появлении стека
+      [e.exitingStack]: k && l
+      // при уходе стека
+    }
+  ), J = (t) => {
+    T.current = t, u && (typeof u == "function" ? u(t) : u.current = t);
+  }, Q = (t, r) => {
+    t == null || t(r);
+  };
+  return /* @__PURE__ */ w("div", { ref: J, "data-testid": j, className: G, children: [
+    /* @__PURE__ */ w(
+      "div",
+      {
+        className: b(e.content, {
+          [e.contentVertical]: g
+        }),
+        children: [
+          B && /* @__PURE__ */ n("div", { className: e.icon, children: N || P[d] }),
+          /* @__PURE__ */ w(
+            "div",
+            {
+              className: b(e.textActionsContainer, {
+                [e.textActionsContainerVertical]: g
+              }),
+              children: [
+                /* @__PURE__ */ n(
+                  _.Label,
+                  {
+                    className: e.contentText,
+                    ref: L,
+                    typographyStyle: "contrast",
+                    children: v
+                  }
+                ),
+                y && /* @__PURE__ */ n(
+                  E.Link,
+                  {
+                    size: "s",
+                    className: e.buttonLink,
+                    buttonStyle: "contrast",
+                    ...y,
+                    onClick: (t) => {
+                      Q(y.onClick, t), V && c("timeout");
+                    }
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    A && /* @__PURE__ */ n(
+      E,
+      {
+        iconLeft: /* @__PURE__ */ n($, {}),
+        onClick: () => c("close"),
+        mode: "tertiary",
+        size: "l",
+        buttonStyle: "contrast",
+        style: { padding: "0px" }
+      }
+    )
+  ] });
+});
+export {
+  xt as Snackbar
+};

package/dist/components/Snackbar/Snackbar.module.css.js

@@ -0,0 +1,47 @@
+import '../../assets/components/Snackbar/Snackbar.module-KVPJ2b4w.css';const t = "_snackbar_1j7iw_15", i = "_slideIn_1j7iw_1", n = "_snackbarStack_1j7iw_44", e = "_snackbarVertical_1j7iw_49", c = "_fix_1j7iw_57", _ = "_fill_1j7iw_63", o = "_hug_1j7iw_69", s = "_content_1j7iw_75", a = "_textActionsContainer_1j7iw_85", r = "_textActionsContainerVertical_1j7iw_92", x = "_contentVertical_1j7iw_97", l = "_contentText_1j7iw_101", w = "_icon_1j7iw_106", j = "_buttonLink_1j7iw_111", g = "_exiting_1j7iw_117", k = "_slideOut_1j7iw_1", u = "_exitingTimeout_1j7iw_123", b = "_exitingClose_1j7iw_128", C = "_exitingStack_1j7iw_135", T = "_swipeTransition_1j7iw_142", V = "_exitingEscape_1j7iw_148", d = {
+  snackbar: t,
+  slideIn: i,
+  snackbarStack: n,
+  snackbarVertical: e,
+  fix: c,
+  fill: _,
+  hug: o,
+  content: s,
+  textActionsContainer: a,
+  textActionsContainerVertical: r,
+  contentVertical: x,
+  contentText: l,
+  icon: w,
+  buttonLink: j,
+  exiting: g,
+  slideOut: k,
+  exitingTimeout: u,
+  exitingClose: b,
+  exitingStack: C,
+  swipeTransition: T,
+  exitingEscape: V
+};
+export {
+  j as buttonLink,
+  s as content,
+  l as contentText,
+  x as contentVertical,
+  d as default,
+  g as exiting,
+  b as exitingClose,
+  V as exitingEscape,
+  C as exitingStack,
+  u as exitingTimeout,
+  _ as fill,
+  c as fix,
+  o as hug,
+  w as icon,
+  i as slideIn,
+  k as slideOut,
+  t as snackbar,
+  n as snackbarStack,
+  e as snackbarVertical,
+  T as swipeTransition,
+  a as textActionsContainer,
+  r as textActionsContainerVertical
+};