@epam/ai-dial-ui-kit 0.14.0-dev.4 → 0.14.0-dev.41

package/dist/components/FileManager/hooks/use-grid-context-menu.js

@@ -0,0 +1,188 @@
+import { jsx as i } from "react/jsx-runtime";
+import { useMemo as F } from "react";
+import { DialFileNodeType as r, DialFilePermission as U } from "../../../models/file.js";
+import { DialFileManagerActions as e } from "../../../types/file-manager.js";
+import { IconExternalLink as A, IconCopy as X, IconDownload as _, IconEye as j, IconTrashX as W, IconPencilMinus as $, IconInfoCircle as q, IconUserX as B } from "@tabler/icons-react";
+import H from "../../../assets/icons/copy-to.svg.js";
+import J from "../../../assets/icons/move-to.svg.js";
+import K from "../../../assets/icons/unshare.svg.js";
+import Q from "../../../assets/icons/add-child.svg.js";
+import V from "../../../assets/icons/add-sibling.svg.js";
+import { BASE_ICON_PROPS as n } from "../../../constants/icon.js";
+import { DropdownItemType as Y } from "../../../types/dropdown.js";
+import { cleanForbiddenSymbolsRegExp as Z } from "../utils.js";
+const de = ({
+  actionLabels: s,
+  onDuplicate: u,
+  onCopy: a,
+  onMove: k,
+  onDownload: l,
+  onRename: C,
+  onDelete: T,
+  onInfo: I,
+  onUnshare: x,
+  onRemoveAccess: c,
+  sharedWithMeIds: N,
+  sharedByMePaths: g,
+  onManagePermissions: m,
+  onPreview: d,
+  onOpenInNewTab: y,
+  previewExtensions: D,
+  isRenameFileAvailable: v = !0,
+  isDuplicateFolderAvailable: E = !0,
+  forbiddenSymbolsRegExp: z,
+  onGridCreateSiblingFolder: w,
+  onGridCreateChildFolder: M
+}) => F(() => (o) => {
+  const t = [];
+  if (!s)
+    return t;
+  const p = Z(
+    z
+  )?.test(o.name);
+  s[e.AddSibling] && o.nodeType === r.FOLDER && t.push({
+    key: "addSibling",
+    label: s[e.AddSibling],
+    icon: /* @__PURE__ */ i(
+      V,
+      {
+        width: n.size,
+        height: n.size,
+        className: "text-secondary"
+      }
+    ),
+    onClick: () => w([o])
+  }), s[e.AddChild] && o.nodeType === r.FOLDER && !p && t.push(
+    {
+      key: "addChild",
+      label: s[e.AddChild],
+      icon: /* @__PURE__ */ i(
+        Q,
+        {
+          width: n.size,
+          height: n.size,
+          className: "text-secondary"
+        }
+      ),
+      onClick: () => M([o])
+    },
+    {
+      key: "divider",
+      type: Y.Divider
+    }
+  ), s[e.OpenInNewTab] && typeof y == "function" && o.nodeType === r.ITEM && !p && t.push({
+    key: e.OpenInNewTab,
+    label: s[e.OpenInNewTab],
+    icon: /* @__PURE__ */ i(A, { ...n, className: "text-secondary" }),
+    onClick: () => y?.(o)
+  });
+  const O = o.nodeType === r.ITEM || o.nodeType === r.FOLDER && E;
+  s[e.Duplicate] && O && !p && t.push({
+    key: e.Duplicate,
+    label: s[e.Duplicate],
+    icon: /* @__PURE__ */ i(X, { ...n, className: "text-secondary" }),
+    onClick: () => u(o)
+  }), s[e.Copy] && !p && t.push({
+    key: e.Copy,
+    label: s[e.Copy],
+    icon: /* @__PURE__ */ i(
+      H,
+      {
+        width: n.size,
+        height: n.size,
+        className: "text-secondary"
+      }
+    ),
+    onClick: () => a(o)
+  }), s[e.Move] && !p && t.push({
+    key: e.Move,
+    label: s[e.Move],
+    icon: /* @__PURE__ */ i(
+      J,
+      {
+        width: n.size,
+        height: n.size,
+        className: "text-secondary"
+      }
+    ),
+    onClick: () => k(o)
+  }), s[e.Download] && !p && t.push({
+    key: e.Download,
+    label: s[e.Download],
+    icon: /* @__PURE__ */ i(_, { ...n, className: "text-secondary" }),
+    onClick: () => l(o)
+  }), s[e.ManagePermissions] && typeof m == "function" && o.nodeType === r.FOLDER && !p && t.push({
+    key: e.ManagePermissions,
+    label: s[e.ManagePermissions],
+    icon: /* @__PURE__ */ i(A, { ...n, className: "text-secondary" }),
+    onClick: () => m?.(o.path)
+  });
+  const h = o.name.split("."), R = h.length > 1 ? h[h.length - 1] : "", P = R && D?.includes(`.${R}`);
+  s[e.Preview] && typeof d == "function" && o.nodeType === r.ITEM && P && !p && t.push({
+    key: e.Preview,
+    label: s[e.Preview],
+    icon: /* @__PURE__ */ i(j, { ...n, className: "text-secondary" }),
+    onClick: () => d?.(o.path)
+  });
+  const S = !o.permissions || o.permissions.includes(U.WRITE);
+  s[e.Delete] && S && t.push({
+    key: e.Delete,
+    label: s[e.Delete],
+    icon: /* @__PURE__ */ i(W, { ...n, className: "text-secondary" }),
+    onClick: () => T(o, o.parentPath ?? "")
+  });
+  const f = o.nodeType === r.FOLDER || o.nodeType === r.ITEM && v;
+  return s[e.Rename] && f && S && t.push({
+    key: e.Rename,
+    label: s[e.Rename],
+    icon: /* @__PURE__ */ i($, { ...n, className: "text-secondary" }),
+    onClick: () => C(o.path)
+  }), s[e.Info] && o.nodeType === r.ITEM && !p && t.push({
+    key: e.Info,
+    label: s[e.Info],
+    icon: /* @__PURE__ */ i(q, { ...n, className: "text-secondary" }),
+    onClick: () => I(o)
+  }), s[e.Unshare] && N?.includes(o.path) && t.push({
+    key: e.Unshare,
+    label: s[e.Unshare],
+    icon: /* @__PURE__ */ i(
+      K,
+      {
+        width: n.size,
+        height: n.size,
+        className: "text-secondary"
+      }
+    ),
+    onClick: () => x(o)
+  }), s[e.RemoveAccess] && g?.has(o.path) && c && t.push({
+    key: e.RemoveAccess,
+    label: s[e.RemoveAccess],
+    icon: /* @__PURE__ */ i(B, { size: n.size, className: "text-secondary" }),
+    onClick: () => c(o)
+  }), t;
+}, [
+  s,
+  u,
+  a,
+  k,
+  l,
+  T,
+  C,
+  I,
+  x,
+  c,
+  N,
+  g,
+  m,
+  d,
+  y,
+  D,
+  v,
+  E,
+  z,
+  M,
+  w
+]);
+export {
+  de as useGridContextMenu
+};

package/dist/components/FileManager/hooks/use-item-renaming.js

@@ -0,0 +1,124 @@
+import { useState as F, useMemo as N, useCallback as u } from "react";
+import { findNodeByPath as g } from "../utils.js";
+import { DialFileNodeType as I } from "../../../models/file.js";
+import { DEFAULT_ERRORS as W, DEFAULT_WARNINGS as L } from "../errors.js";
+const P = {
+  emptyName: "Name cannot be empty",
+  duplicateName: "An item with this name already exists",
+  hiddenItemWarning: L.hiddenItemWarning,
+  consecutiveDotsError: W.consecutiveDotsError
+};
+function b(t) {
+  let e = t.length;
+  for (; e > 0 && t[e - 1] === "/"; ) e--;
+  return t.slice(0, e);
+}
+function v(t, e) {
+  const d = b(t), c = d.lastIndexOf("/");
+  return c === -1 ? e : d.slice(0, c + 1) + e;
+}
+function O(t) {
+  const e = t.lastIndexOf(".");
+  return e === -1 || e === 0 ? t : t.substring(0, e);
+}
+function E(t) {
+  const e = t.lastIndexOf(".");
+  return e === -1 || e === 0 ? "" : t.substring(e);
+}
+const _ = ({
+  items: t,
+  onRenameValidate: e,
+  validationMessages: d,
+  onMoveToFiles: c
+}) => {
+  const [n, m] = F(), l = N(
+    () => ({
+      ...P,
+      ...d
+    }),
+    [d]
+  ), x = N(() => n?.path, [n]), y = u(
+    (o) => {
+      const i = g(t, o);
+      i && m(i);
+    },
+    [t]
+  ), T = u(() => {
+    m(void 0);
+  }, []), D = u(
+    (o) => {
+      if (!n || !c) {
+        m(void 0);
+        return;
+      }
+      const i = n.nodeType === I.ITEM;
+      let s = o.trim();
+      if (i) {
+        const r = E(n.name);
+        r && !s.endsWith(r) && (s = s + r);
+      }
+      if (s === n.name) {
+        m(void 0);
+        return;
+      }
+      const p = v(
+        n.path,
+        s
+      ), a = n.parentPath;
+      if (!a) {
+        m(void 0);
+        return;
+      }
+      const f = {
+        sourceUrl: n.path,
+        destinationUrl: p,
+        nodeType: n.nodeType
+      };
+      c([f], a, a), m(void 0);
+    },
+    [n, c]
+  ), S = u(
+    (o, i) => {
+      const s = o.trim();
+      if (!s)
+        return l.emptyName;
+      if (s.includes(".."))
+        return l.consecutiveDotsError;
+      if (s.startsWith("."))
+        return l.hiddenItemWarning;
+      const p = i.nodeType === I.ITEM;
+      let a = s;
+      if (p) {
+        const r = E(i.name);
+        r && !a.endsWith(r) && (a = a + r);
+      }
+      const f = i.parentPath;
+      if (f) {
+        const r = g(t, f);
+        if (r && new Set(
+          (r.items ?? []).filter((h) => h.path !== i.path).map((h) => h.name.toLowerCase())
+        ).has(a.toLowerCase()))
+          return l.duplicateName;
+      }
+      if (e) {
+        const r = e(a, i);
+        if (r)
+          return r;
+      }
+      return null;
+    },
+    [e, l, t]
+  ), A = u((o) => o.nodeType === I.ITEM ? O(o.name) : o.name, []);
+  return {
+    renamedPath: x,
+    renamedItem: n,
+    renameHandler: y,
+    renameSaveHandler: D,
+    renameCancelHandler: T,
+    renameValidateHandler: S,
+    getDisplayName: A
+  };
+};
+export {
+  _ as useItemRenaming
+};

package/dist/components/FileManager/hooks/use-new-actions.js

@@ -0,0 +1,67 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useMemo as m } from "react";
+import { IconFolder as b, IconPlus as n, IconFile as I, IconFileZip as h } from "@tabler/icons-react";
+import { BASE_ICON_PROPS as o } from "../../../constants/icon.js";
+import { DialFilePermission as k } from "../../../models/file.js";
+const P = ({
+  newActions: l,
+  currentFolder: d,
+  onUploadFiles: a,
+  onCreateFolder: s,
+  onUploadArchive: c,
+  onCreateNewItem: r,
+  isNewButtonDisabled: p
+}) => {
+  const u = m(() => {
+    const i = [];
+    return l && (l.newFolder && i.push({
+      key: "new-folder",
+      label: l.newFolder.label,
+      icon: l?.newFolder?.icon !== void 0 ? l?.newFolder?.icon : /* @__PURE__ */ e(b, { ...o, className: "text-secondary" }),
+      onClick: () => {
+        s && s();
+      }
+    }), l.newItem && i.push({
+      key: "new-item",
+      label: l.newItem.label,
+      icon: l?.newItem?.icon !== void 0 ? l?.newItem?.icon : /* @__PURE__ */ e(n, { ...o, className: "text-secondary" }),
+      onClick: () => {
+        r && r();
+      }
+    }), l.uploadFiles && i.push({
+      key: "upload-file",
+      label: l.uploadFiles.label,
+      icon: l?.uploadFiles?.icon !== void 0 ? l?.uploadFiles?.icon : /* @__PURE__ */ e(I, { ...o, className: "text-secondary" }),
+      onClick: () => {
+        a && a();
+      }
+    }), l.uploadArchive && i.push({
+      key: "upload-archive",
+      label: l.uploadArchive.label,
+      icon: l?.uploadArchive?.icon !== void 0 ? l?.uploadArchive?.icon : /* @__PURE__ */ e(h, { ...o, className: "text-secondary" }),
+      onClick: () => {
+        c && c();
+      }
+    })), i;
+  }, [
+    l,
+    s,
+    a,
+    c,
+    r
+  ]), f = m(
+    () => u?.length > 0,
+    [u]
+  ), t = m(
+    () => !d?.permissions?.includes(k.WRITE) || !!p,
+    [d, p]
+  );
+  return {
+    newActions: u,
+    isNewButtonVisible: f,
+    isNewButtonDisabled: t
+  };
+};
+export {
+  P as useNewActions
+};

package/dist/components/FileManager/hooks/use-paths-selection.js

@@ -0,0 +1,28 @@
+import { useState as f, useMemo as d, useCallback as l } from "react";
+function w({
+  selectedPaths: t,
+  defaultSelectedPaths: i,
+  onSelectedPathsChange: o
+}) {
+  const e = t !== void 0, [s, r] = f(() => i ?? /* @__PURE__ */ new Set()), S = d(
+    () => e ? t : s,
+    [e, t, s]
+  ), n = l(
+    (u) => {
+      const c = new Set(u);
+      o?.(c), e || r(c);
+    },
+    [e, o]
+  ), a = l(() => {
+    n(/* @__PURE__ */ new Set());
+  }, [n]);
+  return {
+    selectedPaths: S,
+    setSelectedPaths: n,
+    clearSelection: a,
+    isControlled: e
+  };
+}
+export {
+  w as usePathsSelection
+};

package/dist/components/FileManager/hooks/use-show-hidden-files.js

@@ -0,0 +1,20 @@
+import { useState as h, useCallback as d } from "react";
+const H = (e) => {
+  const [t, n] = h(e?.showHiddenFiles ?? !1), i = !!e?.onShowHiddenFilesChange, l = i ? e.showHiddenFiles ?? !1 : t, o = d(
+    (s) => {
+      i ? e?.onShowHiddenFilesChange?.(s) : n(s);
+    },
+    [i, e]
+  ), a = d(() => {
+    const s = !l;
+    i ? e?.onShowHiddenFilesChange?.(s) : n(s);
+  }, [l, i, e]);
+  return {
+    areHiddenFilesVisible: l,
+    toggleHiddenFilesVisibility: a,
+    setAreHiddenFilesVisible: o
+  };
+};
+export {
+  H as useShowHiddenFiles
+};

package/dist/components/FileManager/hooks/use-tree-additional-buttons.js

@@ -0,0 +1,39 @@
+import { jsxs as n, Fragment as l, jsx as s } from "react/jsx-runtime";
+import { DialIconButton as a } from "../../IconButton/IconButton.js";
+import { mergeClasses as m } from "../../../utils/merge-classes.js";
+import { IconCopyMinus as c } from "@tabler/icons-react";
+import { useMemo as d } from "react";
+import { ElementSize as u } from "../../../types/size.js";
+import { DIAL_ICON_SIZE as p } from "../../../constants/icon.js";
+const z = ({
+  additionalButtons: r,
+  expandedPathsLength: t,
+  collapseAll: e
+}) => {
+  const o = t === 0;
+  return {
+    additionalButtons: d(() => {
+      const i = m([
+        "hover:text-accent-primary",
+        o && "controls-secondary-disable hover:controls-secondary-disable disabled:hover:cursor-default"
+      ]);
+      return /* @__PURE__ */ n(l, { children: [
+        r,
+        /* @__PURE__ */ s(
+          a,
+          {
+            disabled: o,
+            className: i,
+            size: u.Small,
+            onClick: e,
+            icon: /* @__PURE__ */ s(c, { size: p.LG, stroke: 1.5 }),
+            "aria-label": "collapse-all"
+          }
+        )
+      ] });
+    }, [r, o, e])
+  };
+};
+export {
+  z as useTreeAdditionalButtons
+};

package/dist/components/FileManager/hooks/use-trigger-view-create-folder.js

@@ -0,0 +1,42 @@
+import { FileManagerCreateFolderTriggerView as r } from "../../../types/file-manager.js";
+import { useState as T, useCallback as o } from "react";
+const w = ({
+  onGridAddSibling: i,
+  onGridAddChild: a,
+  onTreeAddSibling: l,
+  onTreeAddChild: s
+}) => {
+  const [g, t] = T(
+    r.Grid
+  ), F = o(
+    (e) => {
+      i?.(e), t(r.Grid);
+    },
+    [i]
+  ), c = o(
+    (e) => {
+      l?.(e), t(r.Tree);
+    },
+    [l]
+  ), n = o(
+    (e) => {
+      a?.(e), t(r.Grid);
+    },
+    [a]
+  ), C = o(
+    (e) => {
+      s?.(e), t(r.Tree);
+    },
+    [s]
+  );
+  return {
+    createFolderTriggerView: g,
+    onGridCreateSiblingFolder: F,
+    onTreeCreateSiblingFolder: c,
+    onGridCreateChildFolder: n,
+    onTreeCreateChildFolder: C
+  };
+};
+export {
+  w as useTriggerViewCreateFolder
+};

package/dist/components/FileManager/hooks/use-trigger-view-rename.js

@@ -0,0 +1,25 @@
+import { FileManagerRenameTriggerView as i } from "../../../types/file-manager.js";
+import { useState as s, useCallback as g } from "react";
+const c = ({
+  onRename: e
+}) => {
+  const [a, t] = s(i.Grid), n = g(
+    (r) => {
+      e(r), t(i.Grid);
+    },
+    [e]
+  ), o = g(
+    (r) => {
+      e(r), t(i.Tree);
+    },
+    [e]
+  );
+  return {
+    renameTriggerView: a,
+    onGridRename: n,
+    onTreeRename: o
+  };
+};
+export {
+  c as useTriggerViewRename
+};

package/dist/components/FileManager/utils.js

@@ -0,0 +1,121 @@
+import { DialFileNodeType as p } from "../../models/file.js";
+import { m as l } from "../../_virtual/index.js";
+import { DEFAULT_FOLDER_BASE_NAME as m } from "./constants.js";
+const u = (t, e) => {
+  if (!(!t || !t.length || !e))
+    for (const n of t) {
+      if (n.path === e) return n;
+      const r = u(n.items, e);
+      if (r) return r;
+    }
+}, x = (t, e) => {
+  if (!t?.length) return;
+  if (!e) return t[0];
+  const n = u(t, e);
+  if (n && n.nodeType === p.FOLDER) return n;
+  const r = e.split("/").filter(Boolean);
+  if (r.length <= 1) return t[0];
+  const o = "/" + r.slice(0, r.length - 1).join("/");
+  return u(t, o) ?? t[0];
+}, f = (t) => (t ?? "").toLowerCase(), D = (t) => f(t).replace(/^\./, ""), w = (t) => {
+  if (!t) return [];
+  const e = [], n = (r) => {
+    const o = r.items ?? [];
+    for (const s of o)
+      e.push(s), s.nodeType === p.FOLDER && n(s);
+  };
+  return n(t), e;
+}, A = (t) => (t.name ?? t.path.split("/").pop() ?? "").startsWith("."), h = (t) => {
+  if (!t) return "0 bytes";
+  const e = 1024, n = e * 1024;
+  return t >= n ? `${(t / n).toFixed(1)} MB` : t >= e ? `${(t / e).toFixed(0)} KB` : `${t} bytes`;
+}, E = (t, e = "en-US", n = {
+  year: "numeric",
+  month: "short",
+  day: "2-digit"
+}) => {
+  if (!t) return "";
+  try {
+    return new Intl.DateTimeFormat(e, n).format(new Date(t));
+  } catch {
+    return t;
+  }
+};
+function d(t, e, n) {
+  if (!t || t.includes("*/*"))
+    return !0;
+  const r = e.toLowerCase(), o = n && n.includes(".") ? `.${n.split(".").at(-1).toLowerCase()}` : void 0;
+  return t.some((s) => {
+    const i = s.toLowerCase();
+    if (i.startsWith("."))
+      return o === i;
+    if (i.endsWith("/*")) {
+      const c = i.slice(0, -1);
+      return r.startsWith(c);
+    }
+    return r === i;
+  });
+}
+const g = (t) => t?.map((e) => e.endsWith("/*") ? e.replace("/*", "s") : F(e).flat().map((n) => `.${n}`)).flat().join(", ") || "", F = (t) => {
+  const [e, n] = t.split("/");
+  return e === "*" ? ["all"] : n === "*" ? Object.entries(l.extensions).reduce((r, [o, s]) => {
+    const [i] = o.split("/");
+    return i === e && r.push(...s), r;
+  }, []) : l.extensions[t] || [];
+}, T = (t) => {
+  if (!t) return;
+  const e = t.flags.replace(/[gy]/g, "");
+  return new RegExp(t.source, e);
+};
+function v(t, e, n) {
+  if (e && T(e)?.test(t.name))
+    return n ?? `This ${t.isFolder ? "folder" : "file"} contains forbidden characters in its name. Please rename it.`;
+}
+const B = (t) => {
+  const e = t.lastIndexOf("/");
+  return e >= 0 ? {
+    parent: t.slice(0, e),
+    name: t.slice(e + 1)
+  } : { parent: "", name: t };
+}, O = (t, e, n) => {
+  const r = !t.contentLength || n == null || t.contentLength <= n, o = !t.contentType || d(e, t.contentType, t.name);
+  return r && o;
+}, C = (t, e, n, r, o) => {
+  if (t.nodeType === p.FOLDER) return;
+  const s = !t.contentLength || n == null || t.contentLength <= n;
+  if (!(!t.contentType || d(e, t.contentType, t.name)))
+    return r ?? (e?.length ? `Unsupported file type. Supported types: ${g(e)}.` : "Unsupported file type.");
+  if (!s)
+    return o ?? `File is too large. Maximum size: ${h(n)}.`;
+}, N = (t) => t.replace(/\/+$/, "").split("/").filter(Boolean).length, M = (t) => {
+  const e = `${m} `, n = new RegExp(`^${m} (\\d+)$`), r = new Set(
+    t.map((c) => c.name.toLowerCase())
+  ), o = t.map((c) => {
+    const a = c.name.match(n);
+    return a ? parseInt(a[1], 10) : 0;
+  }).reduce((c, a) => Math.max(c, a), 0);
+  let s = `${e}${o + 1}`, i = o + 1;
+  for (; r.has(s.toLowerCase()); )
+    i++, s = `${e}${i}`;
+  return s;
+};
+export {
+  T as cleanForbiddenSymbolsRegExp,
+  w as collectAllDescendants,
+  x as findFolderForPath,
+  u as findNodeByPath,
+  g as formatAllowedFileTypesForTooltip,
+  h as formatBytes,
+  E as formatDate,
+  F as getExtensionsListForMimeType,
+  N as getFolderNestingDepth,
+  v as getForbiddenSymbolsTooltip,
+  M as getNextFolderName,
+  C as getRowTooltip,
+  d as isFileAccepted,
+  O as isFileSelectable,
+  A as isHiddenDotFile,
+  D as normalizeExtensionWithoutDot,
+  f as normalizeToLowerCase,
+  B as splitPathAndName
+};