mimir-ui-kit 1.43.11 → 1.43.13

package/dist/components/InputPassword/InputPassword.js

@@ -1,56 +1,60 @@
-import { jsxs as l, jsx as p } from "react/jsx-runtime";
-import { memo as _, forwardRef as w, useState as f, useCallback as r } from "react";
-import { Icon as g } from "../../icons/Icon.js";
-import { Button as v } from "../Button/Button.js";
-import { I as b } from "../../Input-CGZoshMl.js";
-import '../../assets/InputPassword.css';const N = "_input_qgg1v_2", q = "_wrapper_qgg1v_6", x = "_button_qgg1v_17", y = "_icon_qgg1v_33", e = {
-  input: N,
-  wrapper: q,
-  "input-wrapper": "_input-wrapper_qgg1v_13",
-  "button-wrapper": "_button-wrapper_qgg1v_17",
-  button: x,
-  icon: y
-}, M = _(
-  w(
-    ({ size: o, showOnHold: t = !1, ...n }, i) => {
-      const [a, s] = f(!1), u = r(() => {
-        t || s(!a);
-      }, [t, a]), c = r(() => {
-        t && s(!0);
+import { jsxs as _, jsx as o } from "react/jsx-runtime";
+import { c as l } from "../../index-DIxK0V-G.js";
+import { memo as d, forwardRef as b, useState as f, useCallback as r } from "react";
+import { Icon as x } from "../../icons/Icon.js";
+import { Button as N } from "../Button/Button.js";
+import { I as h } from "../../Input-BU_6U1CW.js";
+import '../../assets/InputPassword.css';const M = "_input_7b9x2_2", y = "_wrapper_7b9x2_6", I = "_button_7b9x2_17", v = "_icon_7b9x2_33", C = "_show_7b9x2_38", e = {
+  input: M,
+  wrapper: y,
+  "input-wrapper": "_input-wrapper_7b9x2_13",
+  "button-wrapper": "_button-wrapper_7b9x2_17",
+  button: I,
+  icon: v,
+  show: C
+}, P = d(
+  b(
+    ({ size: p, showOnHold: t = !1, ...n }, i) => {
+      const [s, a] = f(!1), c = r(() => {
+        t || a(!s);
+      }, [t, s]), u = r(() => {
+        t && a(!0);
       }, [t]), m = r(() => {
-        t && s(!1);
-      }, [t]), d = r(() => {
-        t && s(!1);
+        t && a(!1);
+      }, [t]), w = r(() => {
+        t && a(!1);
       }, [t]);
-      return /* @__PURE__ */ l("div", { className: e.wrapper, "data-testid": "input-password-wrapper", children: [
-        /* @__PURE__ */ p(
-          b,
+      return /* @__PURE__ */ _("div", { className: e.wrapper, "data-testid": "input-password-wrapper", children: [
+        /* @__PURE__ */ o(
+          h,
           {
             ref: i,
             className: e.input,
             wrapperClassName: e["input-wrapper"],
-            size: o,
-            type: a ? "text" : "password",
+            size: p,
+            type: s ? "text" : "password",
             "data-testid": "password-input",
             ...n
           }
         ),
-        /* @__PURE__ */ p("div", { className: e["button-wrapper"], children: /* @__PURE__ */ p(
-          v,
+        /* @__PURE__ */ o("div", { className: e["button-wrapper"], children: /* @__PURE__ */ o(
+          N,
           {
             clear: !0,
             type: "button",
             className: e.button,
-            onClick: u,
-            onMouseDown: c,
+            onClick: c,
+            onMouseDown: u,
             onMouseUp: m,
-            onMouseLeave: d,
+            onMouseLeave: w,
             "data-testid": "eye-icon",
-            children: /* @__PURE__ */ p(
-              g,
+            children: /* @__PURE__ */ o(
+              x,
               {
-                className: e.icon,
-                iconName: a ? "Eye24px" : "EyeClosed24px"
+                className: l(e.icon, {
+                  [e.show]: s
+                }),
+                iconName: "Eye24px"
               }
             )
           }
@@ -59,7 +63,7 @@ import '../../assets/InputPassword.css';const N = "_input_qgg1v_2", q = "_wrappe
     }
   )
 );
-M.displayName = "InputPassword";
+P.displayName = "InputPassword";
 export {
-  M as InputPassword
+  P as InputPassword
 };

package/dist/components/InputPhoneNumber/InputPhoneNumber.js

@@ -1,7 +1,7 @@
 import { jsx as d } from "react/jsx-runtime";
 import { memo as I, forwardRef as i, useState as c, useCallback as f, useImperativeHandle as P } from "react";
 import { getMaskedInputPhoneValue as m, getUnmaskedInputValue as o } from "./utils.js";
-import { I as b } from "../../Input-CGZoshMl.js";
+import { I as b } from "../../Input-BU_6U1CW.js";
 const h = I(
   i(
     ({ value: s = "", onChange: e, ...p }, a) => {

package/dist/components/InputRangeSlider/InputRangeSlider.js

@@ -1,191 +1,171 @@
-import { jsxs as _, jsx as c, Fragment as b } from "react/jsx-runtime";
-import { c as v } from "../../index-DIxK0V-G.js";
-import { memo as st, useState as N, useEffect as ct, useCallback as h } from "react";
-import { EInputRangeSliderPositions as j, EInputRangeSliderBorderState as z, DEFAULT_STEP as at, CONTROL_Z_INDEX as f } from "./constants.js";
-import '../../assets/InputRangeSlider.css';const it = "_wrapper_16xeq_8", lt = "_input_16xeq_18", pt = "_control_16xeq_40", mt = "_disabled_16xeq_156", ut = "_active_16xeq_133", dt = "_hover_16xeq_162", r = {
-  "main-wrapper": "_main-wrapper_16xeq_2",
-  wrapper: it,
-  "input-wrapper": "_input-wrapper_16xeq_18",
-  "info-wrapper": "_info-wrapper_16xeq_28",
-  "control-wrapper": "_control-wrapper_16xeq_40",
-  input: lt,
-  "equal-value": "_equal-value_16xeq_115",
-  "is-double-range": "_is-double-range_16xeq_118",
-  "background-track": "_background-track_16xeq_122",
-  "active-track": "_active-track_16xeq_133",
-  control: pt,
-  disabled: mt,
-  active: ut,
-  hover: dt
-}, ht = st(
+import { jsxs as o, jsx as i, Fragment as k } from "react/jsx-runtime";
+import { c as p } from "../../index-DIxK0V-G.js";
+import { memo as K, useState as T, useEffect as Q } from "react";
+import { EInputRangeSliderPositions as y, EInputRangeSliderBorderState as L, DEFAULT_STEP as X, DEFAULT_WIDTH as w } from "./constants.js";
+import '../../assets/InputRangeSlider.css';const Y = "_wrapper_1kfjr_8", Z = "_input_1kfjr_18", V = "_rail_1kfjr_115", C = "_off_1kfjr_124", S = "_right_1kfjr_124", rr = "_left_1kfjr_145", tr = "_control_1kfjr_36", nr = "_disabled_1kfjr_170", r = {
+  "main-wrapper": "_main-wrapper_1kfjr_2",
+  wrapper: Y,
+  "input-wrapper": "_input-wrapper_1kfjr_18",
+  "info-wrapper": "_info-wrapper_1kfjr_26",
+  "control-wrapper": "_control-wrapper_1kfjr_36",
+  input: Z,
+  "equal-value": "_equal-value_1kfjr_108",
+  "is-double-range": "_is-double-range_1kfjr_111",
+  rail: V,
+  off: C,
+  right: S,
+  "double-range": "_double-range_1kfjr_124",
+  "inner-rail": "_inner-rail_1kfjr_134",
+  left: rr,
+  control: tr,
+  disabled: nr
+}, er = K(
   ({
-    min: s,
-    max: p,
-    value: n,
-    disabled: m,
-    isMinEqualMax: E = !1,
-    isSingleSlider: i = !0,
-    onChange: u,
-    step: q = at,
-    borderState: R = z.ON,
-    positions: D = j.LEFT,
-    minMaxDescriptions: G,
-    onChangeValue: d,
-    wrapperClassName: H,
-    ...K
+    min: l,
+    max: j,
+    value: t,
+    disabled: N,
+    isMinEqualMax: $ = !1,
+    isSingleSlider: a = !0,
+    onChange: f,
+    step: x = X,
+    borderState: h = L.ON,
+    positions: b = y.LEFT,
+    minMaxDescriptions: q,
+    onChangeValue: _,
+    wrapperClassName: O,
+    ...W
   }) => {
-    const [a, T] = N(() => (n == null ? void 0 : n.min) ?? s), [o, P] = N(() => (n == null ? void 0 : n.max) ?? p), [x, O] = N(
-      null
-    ), [A, M] = N(
-      null
-    ), {
-      max: C,
-      min: L,
-      maxClassName: Y,
-      minClassName: X
-    } = G ?? {};
-    ct(() => {
-      n && (n.min !== void 0 && T(n.min), n.max !== void 0 && P(n.max));
-    }, [n]);
-    const Z = (t) => {
-      t.preventDefault();
-      let e = +t.target.value;
-      i || (E ? e = Math.min(e, o) : e = Math.min(e, o - q)), n || T(e), d == null || d({ min: e, max: o }), u == null || u(t);
-    }, J = (t) => {
-      t.preventDefault();
-      let e = +t.target.value;
-      i || (E ? e = Math.max(e, a) : e = Math.max(e, a + q)), n || P(e), d == null || d({ min: a, max: e }), u == null || u(t);
-    }, $ = h(
-      (t) => {
-        m || M(t);
-      },
-      [m]
-    ), Q = h(() => {
-      M(null);
-    }, []), F = h((t) => {
-      O(t), M(null);
-    }, []), V = h(() => {
-      O(null);
-    }, []), l = p - s, W = (a - s) / l, U = (o - s) / l, S = `calc(var(--thumb-width) / 2 + ${W} * (100% - var(--thumb-width)))`, tt = `calc(var(--thumb-width) / 2 + ${U} * (100% - var(--thumb-width)))`, k = D === j.LEFT, I = a === o && U !== 0, et = R === z.OFF, rt = () => {
-      const t = {
-        ...K,
+    const [m, D] = T(() => (t == null ? void 0 : t.min) ?? l), [d, F] = T(() => (t == null ? void 0 : t.max) ?? j), {
+      max: I,
+      min: R,
+      maxClassName: A,
+      minClassName: U
+    } = q ?? {};
+    Q(() => {
+      t && (t.min && D(t.min), t.max && F(t.max));
+    }, [t]);
+    const g = (n) => {
+      n.preventDefault();
+      const s = Math.min(
+        +n.target.value,
+        a || $ ? d : d - x
+      );
+      t || D(s), _ == null || _({ min: s, max: d }), f == null || f(n);
+    }, B = (n) => {
+      n.preventDefault();
+      const s = Math.max(
+        +n.target.value,
+        $ ? m : m + x
+      );
+      t || F(s), _ == null || _({ min: m, max: s }), f == null || f(n);
+    }, E = (m - l) / (j - l) * w, c = (d - l) / (j - l) * w, e = b === y.LEFT, H = m === d && c !== 0, M = h === L.OFF, v = () => {
+      const n = {
+        ...W,
         type: "range",
-        min: s,
-        max: p,
-        step: q,
-        onMouseUp: V,
-        onMouseLeave: Q
-      }, e = /* @__PURE__ */ c(
+        min: l,
+        max: j,
+        step: x
+      }, s = /* @__PURE__ */ i(
         "input",
         {
-          ...t,
-          className: v(r.input, {
-            [r["equal-value"]]: I,
-            [r["is-double-range"]]: !i
+          ...n,
+          className: p(r.input, {
+            [r["equal-value"]]: H,
+            [r["is-double-range"]]: !a
           }),
-          disabled: m,
-          value: a,
-          onChange: Z,
-          onMouseDown: () => F("min"),
-          onMouseEnter: () => $("min")
+          disabled: N,
+          value: m,
+          onChange: g
         }
-      ), w = /* @__PURE__ */ c(
+      ), u = /* @__PURE__ */ i(
         "input",
         {
-          ...t,
-          className: v(r.input, {
-            [r["is-double-range"]]: !i
+          ...n,
+          className: p(r.input, {
+            [r["is-double-range"]]: !a
           }),
-          disabled: m,
-          value: o,
-          onChange: J,
-          onMouseDown: () => F("max"),
-          onMouseEnter: () => $("max")
+          disabled: N,
+          value: d,
+          onChange: B
         }
       );
-      return i ? k ? e : w : /* @__PURE__ */ _(b, { children: [
-        e,
-        w
+      return a ? e ? s : u : /* @__PURE__ */ o(k, { children: [
+        s,
+        u
       ] });
-    }, y = h(
-      (t) => v(r.control, {
-        [r.disabled]: m,
-        [r.active]: x === t,
-        [r.hover]: A === t && x !== t
-      }),
-      [m, x, A]
-    ), nt = () => {
-      const t = /* @__PURE__ */ c(
+    }, z = () => {
+      const n = /* @__PURE__ */ i(
         "div",
         {
-          className: y("min"),
+          className: p(r.control, {
+            [r.disabled]: N
+          }),
           style: {
-            left: S,
-            zIndex: x === "min" ? f.ACTIVE : I ? f.PRIORITY : f.BACKGROUND
+            left: `${E}%`
           }
         }
-      ), e = /* @__PURE__ */ c(
+      ), s = /* @__PURE__ */ i(
         "div",
         {
-          className: y("max"),
+          className: p(r.control, {
+            [r.disabled]: N
+          }),
           style: {
-            left: tt,
-            zIndex: x === "max" ? f.ACTIVE : I ? f.BACKGROUND : f.PRIORITY
+            left: `${c}%`
           }
         }
-      ), w = et ? null : /* @__PURE__ */ c("div", { className: r["background-track"] }), B = /* @__PURE__ */ c(
-        "div",
-        {
-          style: (() => {
-            if (i)
-              return k ? {
-                left: "0%",
-                width: a === s ? "0%" : `${(a - s) / l * 100}%`
-              } : {
-                left: o === p ? "100%" : `${(o - s) / l * 100}%`,
-                width: o === p ? "0%" : `${(p - o) / l * 100}%`
-              };
-            {
-              const g = (a - s) / l * 100, ot = (o - s) / l * 100;
-              return {
-                left: `${g}%`,
-                width: `${ot - g}%`
-              };
-            }
-          })(),
-          className: v(
-            r["active-track"],
-            r[R],
-            r[D],
-            {
-              [r["double-range"]]: !i
-            }
-          )
-        }
-      );
-      return i ? /* @__PURE__ */ _(b, { children: [
-        w,
-        B,
-        k ? t : e
-      ] }) : /* @__PURE__ */ _(b, { children: [
-        w,
-        B,
-        t,
-        e
+      ), u = () => M ? e ? `${E}%` : `${w - c}%` : e ? void 0 : `${w - c}%`, G = a && !e ? "0%" : `${w - c}%`, J = a && !e ? u() : `${c - E}%`, P = /* @__PURE__ */ o(k, { children: [
+        /* @__PURE__ */ i(
+          "div",
+          {
+            style: {
+              width: !M && !e ? `${c}%` : u()
+            },
+            className: p(r.rail, r[h], r[b], {
+              [r["double-range"]]: !a
+            })
+          }
+        ),
+        /* @__PURE__ */ i(
+          "div",
+          {
+            style: {
+              right: G,
+              width: J
+            },
+            className: p(
+              r["inner-rail"],
+              r[h],
+              r[b],
+              {
+                [r["double-range"]]: !a
+              }
+            )
+          }
+        )
+      ] });
+      return a ? /* @__PURE__ */ o(k, { children: [
+        e ? n : s,
+        P
+      ] }) : /* @__PURE__ */ o(k, { children: [
+        n,
+        P,
+        s
       ] });
     };
-    return /* @__PURE__ */ _("div", { className: v(r["main-wrapper"], H), children: [
-      /* @__PURE__ */ _("div", { className: r["info-wrapper"], children: [
-        !!L && /* @__PURE__ */ c("div", { className: X, children: L }),
-        !!C && /* @__PURE__ */ c("div", { className: Y, children: C })
+    return /* @__PURE__ */ o("div", { className: p(r["main-wrapper"], O), children: [
+      /* @__PURE__ */ o("div", { className: r["info-wrapper"], children: [
+        !!R && /* @__PURE__ */ i("div", { className: U, children: R }),
+        !!I && /* @__PURE__ */ i("div", { className: A, children: I })
       ] }),
-      /* @__PURE__ */ _("div", { className: r.wrapper, children: [
-        /* @__PURE__ */ c("div", { className: r["control-wrapper"], children: nt() }),
-        /* @__PURE__ */ c("div", { className: r["input-wrapper"], children: rt() })
+      /* @__PURE__ */ o("div", { className: r.wrapper, children: [
+        /* @__PURE__ */ i("div", { className: r["control-wrapper"], children: z() }),
+        /* @__PURE__ */ i("div", { className: r["input-wrapper"], children: v() })
       ] })
     ] });
   }
 );
 export {
-  ht as InputRangeSlider
+  er as InputRangeSlider
 };

package/dist/components/InputRangeSlider/constants.d.ts

@@ -8,8 +8,3 @@ export declare enum EInputRangeSliderBorderState {
 }
 export declare const DEFAULT_STEP = 1;
 export declare const DEFAULT_WIDTH = 100;
-export declare const CONTROL_Z_INDEX: {
-    readonly ACTIVE: 10;
-    readonly PRIORITY: 5;
-    readonly BACKGROUND: 4;
-};

package/dist/components/InputRangeSlider/constants.js

@@ -1,13 +1,8 @@
-var O = /* @__PURE__ */ ((T) => (T.LEFT = "left", T.RIGHT = "right", T))(O || {}), D = /* @__PURE__ */ ((T) => (T.ON = "on", T.OFF = "off", T))(D || {});
-const F = 1, r = 100, A = {
-  ACTIVE: 10,
-  PRIORITY: 5,
-  BACKGROUND: 4
-};
+var F = /* @__PURE__ */ ((T) => (T.LEFT = "left", T.RIGHT = "right", T))(F || {}), r = /* @__PURE__ */ ((T) => (T.ON = "on", T.OFF = "off", T))(r || {});
+const f = 1, D = 100;
 export {
-  A as CONTROL_Z_INDEX,
-  F as DEFAULT_STEP,
-  r as DEFAULT_WIDTH,
-  D as EInputRangeSliderBorderState,
-  O as EInputRangeSliderPositions
+  f as DEFAULT_STEP,
+  D as DEFAULT_WIDTH,
+  r as EInputRangeSliderBorderState,
+  F as EInputRangeSliderPositions
 };

package/dist/components/ListFiles/ListFiles.js

@@ -1,59 +1,57 @@
-import { jsx as n, jsxs as l } from "react/jsx-runtime";
+import { jsx as r, jsxs as s } from "react/jsx-runtime";
 import { c as d } from "../../index-DIxK0V-G.js";
-import { useState as g, useEffect as u } from "react";
-import { EFileItemVariant as w } from "./constants.js";
-import { formating as N } from "../../utils/index.js";
-import { MiniButton as h } from "../MiniButton/MiniButton.js";
-import '../../assets/ListFiles.css';const z = "_white_1g4gc_62", x = "_gray_1g4gc_67", e = {
-  "file-info": "_file-info_1g4gc_2",
-  "file-info-size": "_file-info-size_1g4gc_8",
-  "file-info-name-wrapper": "_file-info-name-wrapper_1g4gc_19",
-  "file-info-name": "_file-info-name_1g4gc_19",
-  "file-upload-container": "_file-upload-container_1g4gc_38",
-  "file-upload-container-item": "_file-upload-container-item_1g4gc_46",
-  "delete-button": "_delete-button_1g4gc_55",
-  white: z,
-  gray: x
+import { useState as h, useEffect as u } from "react";
+import { EFileItemVariant as q } from "./constants.js";
+import { formating as w } from "../../utils/index.js";
+import { ClearButton as z } from "../InputClearButton/ClearButton.js";
+import '../../assets/ListFiles.css';const N = "_white_hpqrc_61", y = "_gray_hpqrc_66", e = {
+  "file-info": "_file-info_hpqrc_2",
+  "file-info-size": "_file-info-size_hpqrc_8",
+  "file-info-name-wrapper": "_file-info-name-wrapper_hpqrc_19",
+  "file-info-name": "_file-info-name_hpqrc_19",
+  "file-upload-container": "_file-upload-container_hpqrc_37",
+  "file-upload-container-item": "_file-upload-container-item_hpqrc_45",
+  "delete-button": "_delete-button_hpqrc_54",
+  white: N,
+  gray: y
 };
-function F({
-  value: o,
-  onChange: s,
-  classNameWrapper: f,
-  variant: r = w.white,
+function E({
+  value: n,
+  onChange: o,
+  classNameWrapper: l,
+  variant: c = q.white,
   disabled: m
 }) {
-  const [a, c] = g(o);
+  const [a, f] = h(n);
   u(() => {
-    c(o);
-  }, [o]);
-  const _ = async (i) => {
-    const t = [...a.filter((p) => p.id !== i)];
-    c(t), s == null || s({ deleteId: i, list: t });
+    f(n);
+  }, [n]);
+  const p = async (i) => {
+    const t = [...a.filter((_) => _.id !== i)];
+    f(t), o == null || o({ deleteId: i, list: t });
   };
-  return a.length ? /* @__PURE__ */ n(
+  return a.length ? /* @__PURE__ */ r(
     "ul",
     {
       className: d(
         e["file-upload-container"],
-        f,
-        e[r]
+        l,
+        e[c]
       ),
-      children: a.map((i, t) => /* @__PURE__ */ l("li", { className: e["file-upload-container-item"], children: [
-        /* @__PURE__ */ l("div", { className: e["file-info"], children: [
-          (i == null ? void 0 : i.size) && /* @__PURE__ */ l("span", { className: e["file-info-size"], children: [
+      children: a.map((i, t) => /* @__PURE__ */ s("li", { className: e["file-upload-container-item"], children: [
+        /* @__PURE__ */ s("div", { className: e["file-info"], children: [
+          (i == null ? void 0 : i.size) && /* @__PURE__ */ s("span", { className: e["file-info-size"], children: [
             " ",
-            N.Size(i == null ? void 0 : i.size)
+            w.Size(i == null ? void 0 : i.size)
           ] }),
-          /* @__PURE__ */ n("div", { className: e["file-info-name-wrapper"], children: /* @__PURE__ */ n("div", { className: e["file-info-name"], children: i.name }) })
+          /* @__PURE__ */ r("div", { className: e["file-info-name-wrapper"], children: /* @__PURE__ */ r("div", { className: e["file-info-name"], children: i.name }) })
         ] }),
-        !m && /* @__PURE__ */ n(
-          h,
+        !m && /* @__PURE__ */ r(
+          z,
           {
-            iconName: "Close12px",
             size: "m-s",
-            variant: "white",
-            className: e["delete-button"],
-            onClick: () => _(i.id)
+            variant: "gray",
+            onClick: () => p(i.id)
           }
         )
       ] }, t))
@@ -61,5 +59,5 @@ function F({
   ) : null;
 }
 export {
-  F as ListFiles
+  E as ListFiles
 };

package/dist/components/ListPhotos/ListPhotos.js

@@ -1,23 +1,23 @@
 import { jsx as l, jsxs as n } from "react/jsx-runtime";
-import { c as _ } from "../../index-DIxK0V-G.js";
-import { useState as f, useEffect as u } from "react";
-import { MiniButton as d } from "../MiniButton/MiniButton.js";
+import { c as u } from "../../index-DIxK0V-G.js";
+import { useState as _, useEffect as f } from "react";
+import { Button as d } from "../Button/Button.js";
 import '../../assets/ListPhotos.css';const i = {
-  "list-photos": "_list-photos_14sli_2",
-  "list-photos-item": "_list-photos-item_14sli_12",
-  "list-photos-image": "_list-photos-image_14sli_21",
-  "delete-button": "_delete-button_14sli_26"
+  "list-photos": "_list-photos_1tpc1_2",
+  "list-photos-item": "_list-photos-item_1tpc1_11",
+  "list-photos-image": "_list-photos-image_1tpc1_20",
+  "delete-button": "_delete-button_1tpc1_25"
 };
 function x({ value: o, onChange: s, classNameWrapper: r }) {
-  const [e, m] = f(o);
-  u(() => {
-    m(o);
+  const [e, c] = _(o);
+  f(() => {
+    c(o);
   }, [o]);
-  const a = async (t) => {
-    const c = [...e.filter((p) => p.id !== t)];
-    m(c), s == null || s({ deleteId: t, list: c });
+  const p = async (t) => {
+    const m = [...e.filter((a) => a.id !== t)];
+    c(m), s == null || s({ deleteId: t, list: m });
   };
-  return e.length ? /* @__PURE__ */ l("ul", { className: _(i["list-photos"], r), children: e.map((t) => /* @__PURE__ */ n("li", { className: i["list-photos-item"], children: [
+  return e.length ? /* @__PURE__ */ l("ul", { className: u(i["list-photos"], r), children: e.map((t) => /* @__PURE__ */ n("li", { className: i["list-photos-item"], children: [
     /* @__PURE__ */ l(
       "img",
       {
@@ -29,11 +29,12 @@ function x({ value: o, onChange: s, classNameWrapper: r }) {
     s && /* @__PURE__ */ l(
       d,
       {
-        size: "m-s",
-        variant: "gray",
+        isIconButton: !0,
         iconName: "Close12px",
+        size: "m-s",
+        variant: "secondary-gray",
         className: i["delete-button"],
-        onClick: () => a(t.id)
+        onClick: () => p(t.id)
       }
     )
   ] }, t.id)) }) : null;