@reportportal/ui-kit 0.0.1-alpha.21 → 0.0.1-alpha.210

package/package.json

@@ -1,16 +1,19 @@
 {
   "name": "@reportportal/ui-kit",
-  "version": "0.0.1-alpha.21",
+  "version": "0.0.1-alpha.210",
   "description": "The UI-kit library for ReportPortal Design System.",
   "type": "module",
   "scripts": {
     "start": "storybook dev -p 6006",
     "build": "tsc && vite build",
     "build:storybook": "storybook build",
-    "lint": "eslint \"src/**/*.{js,jsx,ts,tsx}\"",
+    "type-check": "tsc --noEmit",
+    "lint": "npm run type-check && eslint \"src/**/*.{js,jsx,ts,tsx}\"",
     "format": "npm run lint -- --fix",
-    "test": "exit 0",
-    "test:coverage": "exit 0",
+    "test": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "test:ci": "vitest run",
+    "test:ui": "vitest --ui",
     "prepare": "husky install"
   },
   "files": [
@@ -19,6 +22,24 @@
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/components/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./style.css": "./dist/style.css",
+    "./common": {
+      "types": "./dist/common/types/index.d.ts",
+      "import": "./dist/common.js",
+      "default": "./dist/common.js"
+    },
+    "./*": {
+      "types": "./dist/components/*/index.d.ts",
+      "import": "./dist/*.js",
+      "default": "./dist/*.js"
+    }
+  },
   "peerDependencies": {
     "react": "17.x-18.x",
     "react-dom": "17.x-18.x"
@@ -28,26 +49,37 @@
     "@floating-ui/react-dom": "^2.0.1",
     "classnames": "^2.3.2",
     "downshift": "^6.1.12",
+    "es-toolkit": "^1.39.10",
     "framer-motion": "^10.15.2",
     "rc-scrollbars": "^1.1.6",
-    "react-datepicker": "^7.3.0"
+    "react-datepicker": "^7.6.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
+    "react-dropzone": "^14.3.8",
+    "react-resizable": "^3.0.5"
   },
   "devDependencies": {
-    "@storybook/addon-essentials": "^7.2.0",
-    "@storybook/addon-interactions": "^7.2.0",
-    "@storybook/addon-links": "^7.2.0",
-    "@storybook/addon-onboarding": "^1.0.8",
-    "@storybook/blocks": "^7.2.0",
-    "@storybook/react": "^7.2.0",
-    "@storybook/react-vite": "^7.2.0",
-    "@storybook/testing-library": "^0.2.0",
+    "@storybook/addon-essentials": "^8.6.14",
+    "@storybook/addon-interactions": "^8.6.14",
+    "@storybook/addon-links": "^8.6.14",
+    "@storybook/addon-onboarding": "^8.6.14",
+    "@storybook/blocks": "^8.6.14",
+    "@storybook/react": "^8.6.14",
+    "@storybook/react-vite": "^8.6.14",
+    "@storybook/testing-library": "^0.2.2",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.1.0",
+    "@testing-library/user-event": "^14.5.2",
     "@types/node": "^20.4.5",
     "@types/react": "^18.3.3",
     "@types/react-datepicker": "^6.2.0",
     "@types/react-dom": "^18.2.7",
+    "@types/react-resizable": "^3.0.8",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
     "@vitejs/plugin-react": "^4.0.3",
+    "@vitest/coverage-v8": "^2.1.8",
+    "@vitest/ui": "^2.1.8",
     "date-fns": "^3.6.0",
     "eslint": "^8.46.0",
     "eslint-config-airbnb-typescript": "^15.0.0",
@@ -58,19 +90,21 @@
     "eslint-plugin-react": "^7.33.1",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.3",
-    "eslint-plugin-storybook": "^0.6.13",
+    "eslint-plugin-storybook": "^0.8.0",
     "husky": "^8.0.3",
+    "jsdom": "^25.0.1",
     "lint-staged": "^13.2.3",
     "prettier": "^3.0.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "sass": "^1.64.1",
-    "storybook": "^7.2.2",
+    "storybook": "^8.6.14",
     "typescript": "^5.0.2",
-    "vite": "^4.4.5",
+    "vite": "^4.5.14",
     "vite-plugin-dts": "^3.4.0",
     "vite-plugin-svgr": "^3.2.0",
-    "vite-tsconfig-paths": "^4.2.0"
+    "vite-tsconfig-paths": "^4.2.0",
+    "vitest": "^2.1.8"
   },
   "repository": {
     "type": "git",

package/dist/baseIconButton-b6adc843.js

@@ -1,25 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { c } from "./bind-06a7ff84.js";
-const b = "_disabled_1q88n_12", i = {
-  "base-icon-button": "_base-icon-button_1q88n_1",
-  disabled: b
-}, r = c.bind(i), m = ({
-  children: s,
-  className: o,
-  disabled: t = !1,
-  onClick: n,
-  ...a
-}) => /* @__PURE__ */ e(
-  "button",
-  {
-    className: r("base-icon-button", o, { disabled: t }),
-    type: "button",
-    disabled: t,
-    onClick: n,
-    ...a,
-    children: s
-  }
-);
-export {
-  m as B
-};

package/dist/bubblesLoader-a7e709d4.js

@@ -1,17 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import { c as a } from "./bind-06a7ff84.js";
-const n = "_bubble_kn4ln_1", c = "_bubbles_kn4ln_1", r = {
-  "bubbles-loader": "_bubbles-loader_kn4ln_1",
-  "color-topaz": "_color-topaz_kn4ln_4",
-  bubble: n,
-  bubbles: c
-}, s = a.bind(r), _ = 7, i = ({
-  color: b = "topaz",
-  className: o
-}) => /* @__PURE__ */ l("div", { className: s("bubbles-loader", o, { [`color-${b}`]: b }), children: Array(_).fill(void 0).map((t, e) => (
-  // eslint-disable-next-line react/no-array-index-key
-  /* @__PURE__ */ l("div", { className: s("bubble") }, e)
-)) });
-export {
-  i as B
-};

package/dist/button-bb309472.js

@@ -1,62 +0,0 @@
-import { jsxs as p, jsx as h } from "react/jsx-runtime";
-import { forwardRef as l } from "react";
-import { c as u } from "./bind-06a7ff84.js";
-const w = "_button_1szj1_1", x = "_primary_1szj1_19", f = "_disabled_1szj1_24", g = "_ghost_1szj1_36", y = "_danger_1szj1_54", N = "_text_1szj1_70", B = "_icon_1szj1_116", $ = {
-  button: w,
-  primary: x,
-  disabled: f,
-  ghost: g,
-  danger: y,
-  text: N,
-  "width-wide-content": "_width-wide-content_1szj1_106",
-  "width-parent": "_width-parent_1szj1_111",
-  icon: B,
-  "icon-start": "_icon-start_1szj1_122",
-  "icon-end": "_icon-end_1szj1_126"
-}, c = u.bind($), q = l(
-  ({
-    variant: t = "primary",
-    icon: e,
-    iconPlace: s = "start",
-    adjustWidthOn: n = "content",
-    type: r = "button",
-    children: i,
-    disabled: o = !1,
-    onClick: a,
-    title: d,
-    className: m,
-    ...j
-  }, z) => {
-    const b = c("button", t, m, {
-      disabled: o,
-      [`width-${n}`]: n
-    }), _ = t === "text" && e;
-    return /* @__PURE__ */ p(
-      "button",
-      {
-        ref: z,
-        type: r,
-        disabled: o,
-        className: b,
-        onClick: a,
-        title: d,
-        ...j,
-        children: [
-          _ && /* @__PURE__ */ h(
-            "i",
-            {
-              className: c("icon", {
-                [`icon-${s}`]: s
-              }),
-              children: _
-            }
-          ),
-          i
-        ]
-      }
-    );
-  }
-);
-export {
-  q as B
-};

package/dist/checkbox-6777be17.js

@@ -1,73 +0,0 @@
-import { jsxs as x, jsx as t } from "react/jsx-runtime";
-import { c as m } from "./bind-06a7ff84.js";
-import { useRef as f } from "react";
-import { K as _ } from "./keyCodes-f63c0e11.js";
-const y = "_checkbox_189ko_1", C = "_disabled_189ko_11", E = "_input_189ko_16", D = "_control_189ko_23", K = "_children_189ko_149", N = {
-  checkbox: y,
-  disabled: C,
-  input: E,
-  control: D,
-  "partially-checked": "_partially-checked_189ko_76",
-  children: K
-}, e = m.bind(N), Y = ({
-  children: l,
-  disabled: c = !1,
-  onChange: p,
-  className: h,
-  value: r,
-  partiallyChecked: b,
-  title: s,
-  ...d
-}) => {
-  const o = f(null), u = (n) => {
-    var i, k;
-    const { keyCode: a } = n;
-    if (a === _.SPACE_KEY_CODE) {
-      n.preventDefault(), (i = o.current) == null || i.click();
-      return;
-    }
-    a === _.ENTER_KEY_CODE && (n.preventDefault(), (k = o.current) == null || k.click());
-  };
-  return /* @__PURE__ */ x(
-    "label",
-    {
-      id: "rp-ui-kit-checkbox-label",
-      className: e("checkbox", h, {
-        disabled: c
-      }),
-      title: s,
-      children: [
-        /* @__PURE__ */ t(
-          "input",
-          {
-            ref: o,
-            tabIndex: 0,
-            type: "checkbox",
-            onKeyDown: u,
-            className: e("input", { "partially-checked": b }),
-            disabled: c,
-            onChange: p,
-            checked: r,
-            title: s,
-            ...d
-          }
-        ),
-        /* @__PURE__ */ t(
-          "span",
-          {
-            "aria-labelledby": "rp-ui-kit-checkbox-label",
-            role: "checkbox",
-            "aria-checked": r,
-            className: e("control", {
-              disabled: c
-            })
-          }
-        ),
-        l && /* @__PURE__ */ t("span", { className: e("children", { disabled: c }), children: l })
-      ]
-    }
-  );
-};
-export {
-  Y as C
-};

package/dist/dropdown-c21b0d67.js

@@ -1,216 +0,0 @@
-import { jsx as d, jsxs as L } from "react/jsx-runtime";
-import * as R from "react";
-import { forwardRef as B, useState as Y, useRef as ee } from "react";
-import { c as A } from "./bind-06a7ff84.js";
-import { useFloating as te, offset as ne, flip as oe } from "@floating-ui/react-dom";
-import { useSelect as N } from "downshift";
-import { Scrollbars as se } from "rc-scrollbars";
-import { u as ae } from "./useOnClickOutside-c332f7d3.js";
-import { K as h } from "./keyCodes-f63c0e11.js";
-import { B as de } from "./baseIconButton-b6adc843.js";
-const le = (t) => /* @__PURE__ */ R.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ R.createElement("path", { d: "M14.2174 5.82426C14.3736 5.66805 14.3736 5.41479 14.2174 5.25858L14.0759 5.11716C13.9197 4.96095 13.6665 4.96095 13.5103 5.11716L8.16726 10.4602L2.82426 5.11716C2.66805 4.96095 2.41479 4.96095 2.25858 5.11716L2.11716 5.25858C1.96095 5.41479 1.96095 5.66805 2.11716 5.82426L7.89176 11.5989C8.04797 11.7551 8.30124 11.7551 8.45745 11.5989L8.88171 11.1746L8.87436 11.1673L14.2174 5.82426Z", fill: "#A2AAB5" })), re = "_disabled_f4c9h_11", ie = "_hidden_f4c9h_15", ce = "_selected_f4c9h_21", _e = "_hover_f4c9h_24", he = {
-  "dropdown-option": "_dropdown-option_f4c9h_1",
-  disabled: re,
-  hidden: ie,
-  selected: ce,
-  hover: _e,
-  "single-option": "_single-option_f4c9h_37",
-  "sub-option": "_sub-option_f4c9h_45"
-}, P = A.bind(he), fe = B(
-  (t, n) => {
-    const {
-      option: { value: a, disabled: f, hidden: w, label: l, title: o, groupRef: O },
-      selected: b,
-      onChange: g,
-      render: p,
-      highlightHovered: E,
-      onMouseEnter: m
-    } = t, D = () => {
-      g && g(a);
-    };
-    return /* @__PURE__ */ d(
-      "div",
-      {
-        className: P("dropdown-option", {
-          selected: b,
-          disabled: f,
-          hidden: w,
-          hover: E
-        }),
-        title: o,
-        onClick: D,
-        ref: n,
-        onMouseEnter: m,
-        children: /* @__PURE__ */ d("div", { className: P("single-option", { "sub-option": !!O }), children: p ? p(t) : l })
-      }
-    );
-  }
-), pe = [
-  h.ENTER_KEY_CODE,
-  h.SPACE_KEY_CODE,
-  h.ARROW_DOWN_KEY_CODE
-], ge = [h.ESCAPE_KEY_CODE, h.TAB_KEY_CODE];
-var _ = /* @__PURE__ */ ((t) => (t.ON_KEY_DOWN = "onKeyDown", t.ON_CLICK = "onClick", t))(_ || {});
-const me = (t, n) => t.map(({ value: a }) => a).indexOf(n), ue = (t, n) => (t % n + n) % n, K = (t, n = 0, a = 1) => {
-  if (!t[n].disabled)
-    return n;
-  const f = t.length;
-  return K(
-    t,
-    ue(n + a, f),
-    a
-  );
-}, ve = (t, n) => K(t, n), Ce = (t, n) => K(t, n, -1), we = "_container_vh03o_1", Oe = "_icon_vh03o_7", be = "_arrow_vh03o_13", Ee = "_dropdown_vh03o_19", De = "_disabled_vh03o_36", Ne = "_value_vh03o_43", Ke = "_error_vh03o_46", ye = "_touched_vh03o_46", xe = "_opened_vh03o_50", Ie = "_placeholder_vh03o_72", ke = "_ghost_vh03o_118", Se = {
-  container: we,
-  icon: Oe,
-  arrow: be,
-  dropdown: Ee,
-  "transparent-background": "_transparent-background_vh03o_33",
-  disabled: De,
-  value: Ne,
-  error: Ke,
-  touched: ye,
-  opened: xe,
-  placeholder: Ie,
-  "mobile-disabled": "_mobile-disabled_vh03o_87",
-  "select-list": "_select-list_vh03o_92",
-  "limited-width": "_limited-width_vh03o_109",
-  "options-container": "_options-container_vh03o_113",
-  ghost: ke
-}, i = A.bind(Se), je = ({
-  value: t = "",
-  options: n = [],
-  disabled: a = !1,
-  error: f,
-  onChange: w,
-  onFocus: l,
-  onBlur: o,
-  mobileDisabled: O,
-  title: b,
-  touched: g = !1,
-  icon: p,
-  variant: E,
-  placeholder: m = "",
-  renderOption: D,
-  transparentBackground: T = !1,
-  className: W,
-  toggleButtonClassName: H,
-  isListWidthLimited: M = !1
-}) => {
-  const [r, c] = Y(!1), y = ee(null), [$, u] = Y(null), { refs: x, floatingStyles: j } = te({
-    middleware: [
-      ne(5),
-      oe({
-        fallbackPlacements: ["bottom", "top"]
-      })
-    ]
-  });
-  ae(y, () => {
-    r && (c(!1), o == null || o());
-  });
-  const I = (e) => {
-    e.disabled || (w(e.value), c((s) => !s));
-  }, V = () => n.find(({ value: e }) => e === t), k = me(n, t), {
-    getToggleButtonProps: U,
-    getMenuProps: Z,
-    getItemProps: q,
-    setHighlightedIndex: v,
-    highlightedIndex: S,
-    selectedItem: C
-  } = N({
-    items: n,
-    itemToString: (e) => (e != null && e.label ? String(e.label) : m) || "",
-    selectedItem: V(),
-    isOpen: r,
-    circularNavigation: !0,
-    defaultHighlightedIndex: k,
-    onHighlightedIndexChange: (e) => {
-      switch (e.type) {
-        case N.stateChangeTypes.MenuKeyDownArrowUp:
-          return u(_.ON_KEY_DOWN), v(Ce(n, e.highlightedIndex)), e;
-        case N.stateChangeTypes.MenuKeyDownArrowDown:
-          return u(_.ON_KEY_DOWN), v(ve(n, e.highlightedIndex)), e;
-        default:
-          return e;
-      }
-    }
-  }), z = () => {
-    a || (c((e) => !e), r ? o == null || o() : l == null || l(), u(_.ON_CLICK));
-  }, G = () => {
-    if (!t && t !== !1 && t !== 0)
-      return m;
-    let e = t;
-    return n.forEach((s) => {
-      s.value === t && (e = s.label);
-    }), e;
-  }, J = (e) => {
-    const { keyCode: s } = e;
-    pe.includes(s) && !r && (e.preventDefault(), v(k), c(!0), l == null || l(), u(_.ON_KEY_DOWN));
-  }, Q = (e) => {
-    const { keyCode: s } = e;
-    if (s === h.ENTER_KEY_CODE) {
-      const F = n[S];
-      I(F), c(!1), o == null || o();
-      return;
-    }
-    ge.includes(s) && (e.stopPropagation(), c(!1), o == null || o());
-  }, X = () => /* @__PURE__ */ d("div", { className: i("options-container"), children: n.map((e, s) => /* @__PURE__ */ d(
-    fe,
-    {
-      ...q({
-        item: e,
-        index: s
-      }),
-      selected: e.value === ((C == null ? void 0 : C.value) ?? C),
-      option: { title: e.label, ...e },
-      highlightHovered: S === s && $ !== _.ON_CLICK,
-      render: D,
-      onChange: e.disabled ? null : () => I(e),
-      onMouseEnter: () => v(s)
-    },
-    e.value
-  )) });
-  return /* @__PURE__ */ L("div", { ref: y, className: i("container", W), title: b, children: [
-    /* @__PURE__ */ L(
-      "button",
-      {
-        disabled: a,
-        ...U({
-          className: i("dropdown", E, H, {
-            "transparent-background": T,
-            opened: r,
-            disabled: a,
-            error: f,
-            touched: g,
-            "mobile-disabled": O
-          }),
-          onClick: z,
-          onKeyDown: J,
-          ref: x.setReference
-        }),
-        type: "button",
-        children: [
-          p && /* @__PURE__ */ d("span", { className: i("icon"), children: p }),
-          /* @__PURE__ */ d("span", { className: i("value", { placeholder: !t }), children: G() }),
-          /* @__PURE__ */ d(de, { className: i("arrow"), tabIndex: -1, children: /* @__PURE__ */ d(le, {}) })
-        ]
-      }
-    ),
-    r && /* @__PURE__ */ d(
-      "div",
-      {
-        style: j,
-        className: i("select-list", { opened: r, "limited-width": M }),
-        ...Z({
-          onKeyDown: Q,
-          ref: x.setFloating
-        }),
-        children: /* @__PURE__ */ d(se, { autoHeight: !0, autoHeightMax: 216, hideTracksWhenNotNeeded: !0, children: X() })
-      }
-    )
-  ] });
-};
-export {
-  je as D,
-  le as S
-};

package/dist/fieldNumber-d20f48d6.js

@@ -1,127 +0,0 @@
-import { jsxs as K, jsx as l } from "react/jsx-runtime";
-import * as d from "react";
-import { useRef as A, useMemo as B } from "react";
-import { c as T } from "./bind-06a7ff84.js";
-import { K as e } from "./keyCodes-f63c0e11.js";
-import { B as f } from "./baseIconButton-b6adc843.js";
-const W = (t) => /* @__PURE__ */ d.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "#C1C7D0", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ d.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.00117 2.62046C7.63142 2.6189 7.33294 2.91738 7.3345 3.28712L7.35159 7.35159L3.28712 7.3345C2.91738 7.33295 2.6189 7.63142 2.62045 8.00117C2.62201 8.37091 2.92301 8.67191 3.29275 8.67346L7.35722 8.69056L7.37391 12.6599C7.37547 13.0296 7.67647 13.3306 8.04621 13.3322C8.41596 13.3337 8.71443 13.0352 8.71288 12.6655L8.69619 8.69619L12.6655 8.71288C13.0352 8.71444 13.3337 8.41596 13.3322 8.04621C13.3306 7.67647 13.0296 7.37547 12.6599 7.37392L8.69056 7.35722L8.67346 3.29275C8.67191 2.92301 8.37091 2.62201 8.00117 2.62046Z" })), v = (t) => /* @__PURE__ */ d.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "#C1C7D0", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ d.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.31082 7.31081C2.94108 7.30926 2.6426 7.60773 2.64415 7.97748C2.64571 8.34722 2.9467 8.64822 3.31645 8.64977L12.6892 8.68919C13.0589 8.69074 13.3574 8.39227 13.3559 8.02252C13.3543 7.65278 13.0533 7.35178 12.6836 7.35023L3.31082 7.31081Z" })), y = 5, h = 16, S = [
-  e.TAB_KEY_CODE,
-  e.BACKSPACE_KEY_CODE,
-  e.ARROW_LEFT_KEY_CODE,
-  e.ARROW_UP_KEY_CODE,
-  e.ARROW_RIGHT_KEY_CODE,
-  e.ARROW_DOWN_KEY_CODE,
-  e.DELETE_KEY_CODE,
-  e.NUM_LOCK_0_KEY_CODE,
-  e.NUM_LOCK_1_KEY_CODE,
-  e.NUM_LOCK_2_KEY_CODE,
-  e.NUM_LOCK_3_KEY_CODE,
-  e.NUM_LOCK_4_KEY_CODE,
-  e.NUM_LOCK_5_KEY_CODE,
-  e.NUM_LOCK_6_KEY_CODE,
-  e.NUM_LOCK_7_KEY_CODE,
-  e.NUM_LOCK_8_KEY_CODE,
-  e.NUM_LOCK_9_KEY_CODE
-], I = "_disabled_3tc9r_6", b = "_label_3tc9r_10", k = "_sign_3tc9r_21", F = "_error_3tc9r_36", H = "_touched_3tc9r_36", V = "_filled_3tc9r_41", P = "_input_3tc9r_26", j = {
-  "field-number": "_field-number_3tc9r_1",
-  disabled: I,
-  label: b,
-  sign: k,
-  "input-container": "_input-container_3tc9r_26",
-  error: F,
-  touched: H,
-  filled: V,
-  "input-field": "_input-field_3tc9r_48",
-  input: P
-}, r = T.bind(j), z = ({
-  value: t = "",
-  placeholder: D = "0",
-  disabled: c = !1,
-  onChange: i,
-  onFocus: a,
-  onBlur: G,
-  label: O,
-  postfix: s = "",
-  min: o = 0,
-  max: E = Number.MAX_SAFE_INTEGER,
-  title: p,
-  error: m,
-  touched: L = !1,
-  ...N
-}) => {
-  const C = A(null), R = (_) => {
-    let n = _.target.value.replace(/^0(?=\d+|^\d)/g, "");
-    if (n === "") {
-      i("");
-      return;
-    }
-    n = +n, n >= o && n <= E && i(n);
-  }, Y = (_) => {
-    const { keyCode: n } = _;
-    S.includes(n) || (n < e.NUMBER_START_KEY_CODE || n > e.NUMBER_END_KEY_CODE || _.shiftKey) && _.preventDefault();
-  }, w = () => {
-    const _ = +t - 1;
-    _ >= o && _ <= E && i(_);
-  }, g = () => {
-    const _ = +t + 1;
-    _ >= o && _ <= E && i(_);
-  }, u = D + s, M = B(() => {
-    let _ = (String(t) || u).length;
-    return s && !t && (_ += 1), _ > h ? `${h}ch` : `${_ || y}ch`;
-  }, [u, s, t]), U = () => {
-    C && C.current && C.current.focus(), a && a();
-  };
-  return /* @__PURE__ */ K("div", { className: r("field-number", { disabled: c }), children: [
-    O && /* @__PURE__ */ l("span", { className: r("label"), children: O }),
-    /* @__PURE__ */ K(
-      "div",
-      {
-        className: r("input-container", {
-          filled: !!t || t === 0,
-          error: m,
-          disabled: c,
-          touched: L
-        }),
-        title: p,
-        children: [
-          /* @__PURE__ */ l(
-            f,
-            {
-              className: r("sign", "minus"),
-              disabled: c,
-              onClick: w,
-              children: /* @__PURE__ */ l(v, {})
-            }
-          ),
-          /* @__PURE__ */ K("span", { className: r("input-field", { disabled: c }), onClick: U, children: [
-            /* @__PURE__ */ l(
-              "input",
-              {
-                ref: C,
-                className: r("input"),
-                type: "number",
-                value: t,
-                placeholder: u,
-                disabled: c,
-                min: o,
-                max: E,
-                onKeyDown: c ? void 0 : Y,
-                onChange: c ? void 0 : R,
-                onFocus: c ? void 0 : a,
-                style: { width: M },
-                ...N
-              }
-            ),
-            !!s && (t === 0 || !!t) && /* @__PURE__ */ l("span", { children: s.slice(0, 1) })
-          ] }),
-          /* @__PURE__ */ l(f, { className: r("sign", "plus"), disabled: c, onClick: g, children: /* @__PURE__ */ l(W, {}) })
-        ]
-      }
-    )
-  ] });
-};
-export {
-  z as F,
-  W as S,
-  v as a
-};