@layers-app/shared 0.2.5 → 0.2.7

package/dist/components/IntegrationFlowAnimation/IntegrationFlowAnimation.js

@@ -0,0 +1,73 @@
+import { jsxs as y, jsx as t } from "react/jsx-runtime";
+import { useRef as z, useEffect as T } from "react";
+import { Center as _, Box as r } from "@mantine/core";
+import n from "./IntegrationFlowAnimation.module.css.js";
+const a = {
+  blue: ["#4C6EF5", "#5C7CFF", "#748FFC", "#4263EB", "#3B5BDB", "#7950F2"],
+  green: ["#51CF66", "#69DB7C", "#40C057"],
+  yellowOrange: ["#FFA94D", "#FFD43B", "#FCC419"]
+}, k = [
+  ...a.blue,
+  ...a.blue,
+  ...a.blue,
+  ...a.green,
+  ...a.green,
+  ...a.yellowOrange
+], x = ({ children: i }) => /* @__PURE__ */ t(r, { className: n.iconContainer, children: /* @__PURE__ */ t(r, { className: n.iconInner, children: i }) }), S = {
+  rowCount: 4,
+  baseDuration: 3.5,
+  durationVariation: 1.5,
+  chaosRange: 12,
+  maxDelay: 4,
+  sizeRange: { min: 4, max: 6 },
+  waveAmplitudeRange: { min: 8, max: 16 },
+  waveOffsetRange: { min: -10, max: 10 },
+  speedRange: { min: 0.1, max: 0.95 }
+}, G = ({
+  leftIcon: i,
+  rightIcon: w,
+  height: F = 100,
+  particleCount: u = 24,
+  colors: s = k,
+  backgroundImage: R = "/images/import-bg.png"
+}) => {
+  const g = z(null);
+  return T(() => {
+    const m = g.current;
+    if (!m) return;
+    const {
+      rowCount: h,
+      baseDuration: b,
+      durationVariation: D,
+      chaosRange: v,
+      maxDelay: A,
+      sizeRange: c,
+      waveAmplitudeRange: l,
+      waveOffsetRange: d,
+      speedRange: p
+    } = S;
+    for (let o = 0; o < u; o++) {
+      const e = document.createElement("div"), M = o % h, C = 100 / h, O = M * C + C / 2, $ = (Math.random() - 0.5) * v, E = Math.random() * A, f = c.min + Math.random() * (c.max - c.min), I = s[Math.floor(Math.random() * s.length)], N = b + (Math.random() - 0.5) * D, B = l.min + Math.random() * (l.max - l.min), L = d.min + Math.random() * (d.max - d.min), P = Math.min(p.min + Math.random(), p.max);
+      e.className = n.particle, e.style.width = `${f}px`, e.style.height = `${f}px`, e.style.backgroundColor = I, e.style.top = `${O}%`, e.style.animationDuration = `${N}s`, e.style.animationTimingFunction = `cubic-bezier(0.25, 0.46, 0.45, ${P})`, e.style.animationDelay = `${E}s`, e.style.setProperty("--chaos", `${$}px`), e.style.setProperty("--wave-amplitude", `${B}px`), e.style.setProperty("--wave-offset", `${L}px`), m.appendChild(e);
+    }
+    return () => {
+      m.querySelectorAll("div").forEach((o) => o.remove());
+    };
+  }, [u, s]), /* @__PURE__ */ y(_, { h: F, className: n.animationRoot, children: [
+    /* @__PURE__ */ t(
+      r,
+      {
+        className: n.backgroundImage,
+        style: { backgroundImage: `url(${R})` }
+      }
+    ),
+    /* @__PURE__ */ y(r, { className: n.animationContainer, children: [
+      /* @__PURE__ */ t(x, { children: i }),
+      /* @__PURE__ */ t(r, { ref: g, className: n.particleContainer }),
+      /* @__PURE__ */ t(x, { children: w })
+    ] })
+  ] });
+};
+export {
+  G as IntegrationFlowAnimation
+};

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

@@ -0,0 +1,19 @@
+const n = "_particle_1t002_52", t = "_iconContainer_1t002_63", o = "_iconInner_1t002_75", a = "_particleContainer_1t002_87", i = "_animationRoot_1t002_127", c = "_animationContainer_1t002_131", e = "_backgroundImage_1t002_141", r = {
+  particle: n,
+  iconContainer: t,
+  iconInner: o,
+  particleContainer: a,
+  animationRoot: i,
+  animationContainer: c,
+  backgroundImage: e
+};
+export {
+  c as animationContainer,
+  i as animationRoot,
+  e as backgroundImage,
+  r as default,
+  t as iconContainer,
+  o as iconInner,
+  n as particle,
+  a as particleContainer
+};

package/dist/components/IntegrationFlowAnimation/icons/GoogleDriveIcon.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+export interface GoogleDriveIconProps {
+    size?: number;
+}
+export declare function GoogleDriveIcon({ size }: GoogleDriveIconProps): ReactNode;
+//# sourceMappingURL=GoogleDriveIcon.d.ts.map

package/dist/components/IntegrationFlowAnimation/icons/GoogleDriveIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GoogleDriveIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/IntegrationFlowAnimation/icons/GoogleDriveIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,eAAe,CAAC,EAAE,IAAS,EAAE,EAAE,oBAAoB,GAAG,SAAS,CAmC9E"}

package/dist/components/IntegrationFlowAnimation/icons/GoogleDriveIcon.js

@@ -0,0 +1,60 @@
+import { jsxs as h, jsx as l } from "react/jsx-runtime";
+function i({ size: c = 24 }) {
+  return /* @__PURE__ */ h(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: c,
+      height: c,
+      fill: "none",
+      viewBox: "0 0 87.3 78",
+      children: [
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#0066DA",
+            d: "m6.6 66.85 3.85 6.65c.8 1.4 1.95 2.5 3.3 3.3l13.75-23.8H1.2c0 1.55.4 3.1 1.2 4.5l4.2 9.35Z"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#00AC47",
+            d: "M43.65 25.15 29.9 1.35c-1.35.8-2.5 1.9-3.3 3.3L1.2 52.7c-.8 1.4-1.2 2.95-1.2 4.5h27.5l16.15-32.05Z"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#EA4335",
+            d: "M73.55 76.8c1.35-.8 2.5-1.9 3.3-3.3l1.6-2.75 7.65-13.25c.8-1.4 1.2-2.95 1.2-4.5H59.85L55.4 62.8l-13.75 14h18.6c1.9 0 3.75-.7 5.15-1.85l8.15-8.65Z"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#00832D",
+            d: "M43.65 25.15 57.4 1.35C56.05.55 54.5 0 52.85 0H34.45c-1.65 0-3.2.55-4.55 1.35l13.75 23.8Z"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#2684FC",
+            d: "M59.85 53H27.5L13.75 76.8c1.35.8 2.9 1.2 4.55 1.2h36.7c1.65 0 3.2-.4 4.55-1.2L59.85 53Z"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#FFBA00",
+            d: "m73.4 26.5-12.7-22c-.8-1.4-1.95-2.5-3.3-3.3L43.65 25.15 59.85 53h27.45c0-1.55-.4-3.1-1.2-4.5L73.4 26.5Z"
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  i as GoogleDriveIcon
+};

package/dist/components/IntegrationFlowAnimation/icons/LayersCubeIcon.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+export interface LayersCubeIconProps {
+    size?: number;
+}
+export declare const LayersCubeIcon: ({ size }: LayersCubeIconProps) => ReactNode;
+//# sourceMappingURL=LayersCubeIcon.d.ts.map

package/dist/components/IntegrationFlowAnimation/icons/LayersCubeIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayersCubeIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/IntegrationFlowAnimation/icons/LayersCubeIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,cAAc,GAAI,UAAe,mBAAmB,KAAG,SAenE,CAAC"}

package/dist/components/IntegrationFlowAnimation/icons/LayersCubeIcon.js

@@ -0,0 +1,21 @@
+import { jsx as v } from "react/jsx-runtime";
+const o = ({ size: c = 24 }) => /* @__PURE__ */ v(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: c,
+    height: c,
+    fill: "none",
+    viewBox: "0 0 24 24",
+    children: /* @__PURE__ */ v(
+      "path",
+      {
+        fill: "#000",
+        d: "M22.667 12.01v4.428c0 1.2-.515 2.102-1.545 2.627-2.5 1.426-5.002 2.927-7.503 4.428-1.103.676-2.06.676-3.163 0a397 397 0 0 0-7.577-4.428q-1.545-.788-1.545-2.477V7.431c0-1.126.441-1.877 1.398-2.477C5.38 3.453 7.955 1.952 10.529.45c1.03-.6 1.987-.6 3.017 0 2.574 1.502 5.075 3.003 7.65 4.429.956.6 1.471 1.426 1.471 2.552zm-11.55 9.907v-8.482c0-.675-.22-1.05-.808-1.35-2.06-1.202-4.12-2.402-6.106-3.528-.368-.225-.736-.376-1.177-.676v8.557c0 .6.22.976.736 1.276 2.942 1.651 6.694 3.903 7.356 4.278zm9.785-4.729v-5.93c0-4.202-.22-4.578-.662-4.878-2.943-1.726-8.092-4.654-8.313-4.729V4.58c0 .525.147.75.589.975l3.53 2.027c1.178.675 1.693 1.576 1.693 2.927v4.279c0 .225.147.525.294.675.883.526 1.765 1.05 2.795 1.651h.074zM7.145 4.504V7.58c0 .45.148.675.515.9 1.251.676 2.428 1.427 3.679 2.102 1.103.6 1.618 1.501 1.618 2.777v4.279c0 .225 0 .525.22.675.883.6 1.84 1.126 2.87 1.727v-5.93c0-4.203-.295-4.503-.515-4.729-1.03-.75-4.782-2.852-8.313-4.878z"
+      }
+    )
+  }
+);
+export {
+  o as LayersCubeIcon
+};

package/dist/components/IntegrationFlowAnimation/icons/NotionIcon.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+export interface NotionIconProps {
+    size?: number;
+}
+export declare const NotionIcon: ({ size }: NotionIconProps) => ReactNode;
+//# sourceMappingURL=NotionIcon.d.ts.map

package/dist/components/IntegrationFlowAnimation/icons/NotionIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotionIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/IntegrationFlowAnimation/icons/NotionIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,eAAe;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,UAAU,GAAI,UAAe,eAAe,KAAG,SA4B3D,CAAC"}

package/dist/components/IntegrationFlowAnimation/icons/NotionIcon.js

@@ -0,0 +1,35 @@
+import { jsxs as i, jsx as l } from "react/jsx-runtime";
+const o = ({ size: c = 24 }) => /* @__PURE__ */ i(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: c,
+    height: c,
+    fill: "none",
+    viewBox: "0 0 24 24",
+    children: [
+      /* @__PURE__ */ i("g", { clipPath: "url(#clip0_notion)", children: [
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#fff",
+            d: "m1.444 1.035 13.28-.981c1.631-.14 2.05-.046 3.076.7l4.24 2.986c.698.514.931.654.931 1.213V21.33c0 1.027-.373 1.634-1.677 1.727l-15.422.934c-.98.046-1.445-.094-1.958-.748L.792 19.185C.232 18.438 0 17.88 0 17.225V2.667c0-.84.373-1.54 1.444-1.632"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "path",
+          {
+            fill: "#000",
+            fillRule: "evenodd",
+            d: "m14.724.054-13.28.98C.373 1.129 0 1.829 0 2.668v14.558c0 .654.232 1.213.792 1.96l3.122 4.06c.513.653.979.793 1.958.746l15.422-.933c1.304-.093 1.677-.7 1.677-1.727V4.953c0-.53-.21-.683-.826-1.136L17.8.754c-1.025-.746-1.445-.84-3.076-.7M6.221 4.685c-1.26.085-1.545.104-2.26-.478L2.142 2.761c-.184-.187-.091-.42.374-.467l12.767-.933c1.072-.094 1.63.28 2.05.607l2.189 1.586c.093.047.326.326.046.326l-13.184.794zM4.753 21.192V7.288c0-.608.186-.888.744-.935l15.143-.886c.514-.047.746.28.746.886v13.811c0 .608-.094 1.121-.932 1.167l-14.49.84c-.839.047-1.211-.232-1.211-.98M19.057 8.033c.093.42 0 .84-.42.888l-.699.139v10.265c-.606.326-1.164.513-1.631.513-.746 0-.932-.234-1.49-.933l-4.568-7.186v6.953l1.445.327s0 .84-1.165.84l-3.214.186c-.094-.187 0-.653.326-.746l.839-.233V9.854L7.315 9.76c-.093-.42.14-1.027.792-1.074l3.448-.232 4.752 7.278V9.294l-1.211-.139c-.094-.514.28-.888.745-.933z",
+            clipRule: "evenodd"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l("defs", { children: /* @__PURE__ */ l("clipPath", { id: "clip0_notion", children: /* @__PURE__ */ l("path", { fill: "#fff", d: "M0 0h24v24H0z" }) }) })
+    ]
+  }
+);
+export {
+  o as NotionIcon
+};

package/dist/components/IntegrationFlowAnimation/icons/index.d.ts

@@ -0,0 +1,4 @@
+export { NotionIcon, type NotionIconProps } from './NotionIcon';
+export { GoogleDriveIcon, type GoogleDriveIconProps } from './GoogleDriveIcon';
+export { LayersCubeIcon, type LayersCubeIconProps } from './LayersCubeIcon';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/IntegrationFlowAnimation/icons/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/IntegrationFlowAnimation/icons/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC/E,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/components/IntegrationFlowAnimation/index.d.ts

@@ -0,0 +1,5 @@
+export { IntegrationFlowAnimation, type IntegrationFlowAnimationProps, } from './IntegrationFlowAnimation';
+export { NotionIcon, type NotionIconProps } from './icons/NotionIcon';
+export { GoogleDriveIcon, type GoogleDriveIconProps, } from './icons/GoogleDriveIcon';
+export { LayersCubeIcon, type LayersCubeIconProps, } from './icons/LayersCubeIcon';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/IntegrationFlowAnimation/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/IntegrationFlowAnimation/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,wBAAwB,EACxB,KAAK,6BAA6B,GACnC,MAAM,4BAA4B,CAAC;AAEpC,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACtE,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,GAC1B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,cAAc,EACd,KAAK,mBAAmB,GACzB,MAAM,wBAAwB,CAAC"}

package/dist/components/LanguagePicker/LanguagePicker.d.ts

@@ -1,7 +1,8 @@
 interface LanguagePickerProps {
     value: string;
     onChange: (value: string) => void;
+    label?: string;
 }
-export declare const LanguagePicker: ({ value, onChange }: LanguagePickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LanguagePicker: ({ value, onChange, label, }: LanguagePickerProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=LanguagePicker.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"LanguagePicker.d.ts","sourceRoot":"","sources":["../../../src/components/LanguagePicker/LanguagePicker.tsx"],"names":[],"mappings":"AAkBA,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAQD,eAAO,MAAM,cAAc,GAAI,qBAAqB,mBAAmB,4CAgCtE,CAAC"}
+{"version":3,"file":"LanguagePicker.d.ts","sourceRoot":"","sources":["../../../src/components/LanguagePicker/LanguagePicker.tsx"],"names":[],"mappings":"AAkBA,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA0BD,eAAO,MAAM,cAAc,GAAI,6BAI5B,mBAAmB,4CAkBrB,CAAC"}

package/dist/components/LanguagePicker/LanguagePicker.js

@@ -1,38 +1,51 @@
-import { jsx as a, jsxs as g } from "react/jsx-runtime";
-import { useMemo as u } from "react";
-import { Select as f, Image as o, Group as b } from "@mantine/core";
-import { IconCheck as d } from "@tabler/icons-react";
-import x from "../../assets/images/flags/es.svg.js";
-import S from "../../assets/images/flags/ru.svg.js";
-import h from "../../assets/images/flags/us.svg.js";
-import { useMenu as y } from "../../hooks/useMenu.js";
-import s from "./LanguagePicker.module.css.js";
-const l = {
-  ru: S,
-  en: h,
+import { jsx as o, jsxs as c } from "react/jsx-runtime";
+import { useMemo as p } from "react";
+import { Tick02Icon as g } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as f } from "@hugeicons/react";
+import { Select as u, Image as n, Group as d } from "@mantine/core";
+import x from "../../assets/svg/flags/es.svg.js";
+import b from "../../assets/svg/flags/ru.svg.js";
+import y from "../../assets/svg/flags/us.svg.js";
+import l from "./LanguagePicker.module.css.js";
+const m = {
+  ru: b,
+  en: y,
   es: x
-}, t = [
-  { value: "ru", label: "Русский (Россия)" },
-  { value: "en", label: "English (US)" },
+}, s = [
+  { value: "en", label: "English" },
+  { value: "ru", label: "Русский" },
   { value: "es", label: "Español (España)" }
-], O = ({ value: r, onChange: n }) => {
-  const { isMobile: m } = y(), i = ({
-    option: e,
-    checked: c
-  }) => /* @__PURE__ */ g(b, { flex: "1", gap: "xs", children: [
-    /* @__PURE__ */ a(o, { src: l[e.value], className: s.image }),
-    e.label,
-    c && /* @__PURE__ */ a(d, { style: { marginInlineStart: "auto" }, stroke: 1.2 })
-  ] }), p = u(() => t.find((e) => e.value === r) ? r : "en", [r]);
-  return /* @__PURE__ */ a(
+], E = ({
+  option: e,
+  checked: a
+}) => /* @__PURE__ */ c(d, { flex: "1", gap: "xs", children: [
+  /* @__PURE__ */ o(n, { src: m[e.value], className: l.image }),
+  e.label,
+  a && /* @__PURE__ */ o(
     f,
     {
-      w: m ? "100%" : 320,
-      onChange: (e) => e && n(e),
-      leftSection: /* @__PURE__ */ a(o, { src: l[r], className: s.image }),
-      value: p,
-      data: t,
-      renderOption: i
+      color: "var(--mantine-primary-color-filled)",
+      size: 16,
+      icon: g,
+      className: l.tickIcon
+    }
+  )
+] }), O = ({
+  value: e,
+  onChange: a,
+  label: t
+}) => {
+  const i = p(() => s.find((r) => r.value === e) ? e : "en", [e]);
+  return /* @__PURE__ */ o(
+    u,
+    {
+      label: t,
+      flex: 1,
+      onChange: (r) => r && a(r),
+      leftSection: /* @__PURE__ */ o(n, { src: m[e], className: l.image }),
+      value: i,
+      data: s,
+      renderOption: E
     }
   );
 };

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

@@ -1,7 +1,9 @@
-const e = "_image_vcu25_1", a = {
-  image: e
+const c = "_image_1re3l_1", t = "_tickIcon_1re3l_8", e = {
+  image: c,
+  tickIcon: t
 };
 export {
-  a as default,
-  e as image
+  e as default,
+  c as image,
+  t as tickIcon
 };

package/dist/components/MediaLibrary/MediaLibrary.d.ts

@@ -0,0 +1,3 @@
+import type { MediaLibraryProps } from './types';
+export declare const MediaLibrary: ({ children, items, isLoading, breadcrumbs, activeTab, tabs, onTabChange, onFolderClick, onBreadcrumbClick, onSelect, onOpenedChange, width, position, popoverProps, }: MediaLibraryProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MediaLibrary.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MediaLibrary.d.ts","sourceRoot":"","sources":["../../../src/components/MediaLibrary/MediaLibrary.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,SAAS,CAAC;AAYlE,eAAO,MAAM,YAAY,GAAI,uKAe1B,iBAAiB,4CAiFnB,CAAC"}

package/dist/components/MediaLibrary/MediaLibrary.js

@@ -0,0 +1,93 @@
+import { jsxs as c, jsx as s } from "react/jsx-runtime";
+import { useState as D, useMemo as F } from "react";
+import { Popover as n, Flex as r, Tabs as i, Stack as N } from "@mantine/core";
+import { MediaLibraryBrowser as P } from "./MediaLibraryBrowser.js";
+import d from "./MediaLibrary.module.css.js";
+const p = ["disk", "favorites", "shared"], B = {
+  disk: "My Disk",
+  favorites: "Favorites",
+  shared: "Shared"
+}, A = ({
+  children: h,
+  items: m,
+  isLoading: g,
+  breadcrumbs: b,
+  activeTab: f,
+  tabs: t = p,
+  onTabChange: u,
+  onFolderClick: v,
+  onBreadcrumbClick: x,
+  onSelect: T,
+  onOpenedChange: k,
+  width: y = 610,
+  position: w = "bottom-end",
+  popoverProps: C
+}) => {
+  const [o, S] = D(!1), l = F(
+    () => p.filter((e) => t.includes(e)),
+    [t]
+  ), L = f || l[0] || "disk", a = (e) => {
+    S(e), k?.(e);
+  }, M = (e) => {
+    u?.(e);
+  }, j = (e) => {
+    T?.(e), a(!1);
+  };
+  return /* @__PURE__ */ c(
+    n,
+    {
+      width: y,
+      radius: "var(--mantine-spacing-sm)",
+      position: w,
+      shadow: "md",
+      opened: o,
+      onChange: a,
+      withinPortal: !0,
+      ...C || {},
+      children: [
+        /* @__PURE__ */ s(n.Target, { children: /* @__PURE__ */ s(r, { onClick: () => a(!o), children: h }) }),
+        /* @__PURE__ */ c(n.Dropdown, { p: 0, children: [
+          /* @__PURE__ */ s(r, { justify: "space-between", align: "center", children: /* @__PURE__ */ s(
+            i,
+            {
+              value: L,
+              styles: {
+                list: {
+                  alignItems: "center",
+                  paddingRight: "var(--mantine-spacing-xs)"
+                }
+              },
+              w: "100%",
+              children: /* @__PURE__ */ s(i.List, { style: { gap: "4px" }, px: 8, h: 54, children: l.map((e) => /* @__PURE__ */ s(
+                i.Tab,
+                {
+                  className: d.originalTab,
+                  h: "100%",
+                  p: 0,
+                  value: e,
+                  onClick: () => M(e),
+                  children: /* @__PURE__ */ s(r, { className: d.customTab, px: "sm", h: 36, children: /* @__PURE__ */ s("span", { children: B[e] }) })
+                },
+                e
+              )) })
+            }
+          ) }),
+          /* @__PURE__ */ s(N, { gap: 0, px: 8, pb: 8, pt: "sm", children: /* @__PURE__ */ s(
+            P,
+            {
+              items: m,
+              isLoading: g,
+              breadcrumbs: b,
+              onFolderClick: v,
+              onBreadcrumbClick: x,
+              onSelect: j
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+};
+export {
+  A as MediaLibrary
+};

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

@@ -0,0 +1,17 @@
+const r = "_originalTab_p74jz_1", e = "_customTab_p74jz_7", t = "_headerRow_p74jz_17", a = "_rowGrid_p74jz_42", o = "_breadcrumbItem_p74jz_79", c = "_breadcrumbItemActive_p74jz_91", b = {
+  originalTab: r,
+  customTab: e,
+  headerRow: t,
+  rowGrid: a,
+  breadcrumbItem: o,
+  breadcrumbItemActive: c
+};
+export {
+  o as breadcrumbItem,
+  c as breadcrumbItemActive,
+  e as customTab,
+  b as default,
+  t as headerRow,
+  r as originalTab,
+  a as rowGrid
+};

package/dist/components/MediaLibrary/MediaLibraryBreadcrumbs.d.ts

@@ -0,0 +1,8 @@
+import type { BreadcrumbItem } from './types';
+interface MediaLibraryBreadcrumbsProps {
+    breadcrumbs: BreadcrumbItem[];
+    onBreadcrumbClick?: (crumb: BreadcrumbItem, index: number) => void;
+}
+export declare const MediaLibraryBreadcrumbs: ({ breadcrumbs, onBreadcrumbClick, }: MediaLibraryBreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MediaLibraryBreadcrumbs.d.ts.map

package/dist/components/MediaLibrary/MediaLibraryBreadcrumbs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaLibraryBreadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/components/MediaLibrary/MediaLibraryBreadcrumbs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAI9C,UAAU,4BAA4B;IACpC,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpE;AAED,eAAO,MAAM,uBAAuB,GAAI,qCAGrC,4BAA4B,4CAqB9B,CAAC"}

package/dist/components/MediaLibrary/MediaLibraryBreadcrumbs.js

@@ -0,0 +1,22 @@
+import { jsx as i } from "react/jsx-runtime";
+import { Breadcrumbs as s, Anchor as a } from "@mantine/core";
+import o from "./MediaLibrary.module.css.js";
+const p = ({
+  breadcrumbs: e,
+  onBreadcrumbClick: n
+}) => /* @__PURE__ */ i(s, { mb: "xs", children: e.map((r, m) => {
+  const t = m === e.length - 1;
+  return /* @__PURE__ */ i(
+    a,
+    {
+      className: t ? o.breadcrumbItemActive : o.breadcrumbItem,
+      onClick: t ? void 0 : () => n?.(r, m),
+      underline: "never",
+      children: r.name
+    },
+    r.id
+  );
+}) });
+export {
+  p as MediaLibraryBreadcrumbs
+};

package/dist/components/MediaLibrary/MediaLibraryBrowser.d.ts

@@ -0,0 +1,12 @@
+import type { BreadcrumbItem, MediaFile } from './types';
+interface MediaLibraryBrowserProps {
+    items: MediaFile[];
+    isLoading?: boolean;
+    breadcrumbs?: BreadcrumbItem[];
+    onFolderClick?: (folder: MediaFile) => void;
+    onBreadcrumbClick?: (crumb: BreadcrumbItem, index: number) => void;
+    onSelect?: (file: MediaFile) => void;
+}
+export declare const MediaLibraryBrowser: ({ items, isLoading, breadcrumbs, onFolderClick, onBreadcrumbClick, onSelect, }: MediaLibraryBrowserProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MediaLibraryBrowser.d.ts.map

package/dist/components/MediaLibrary/MediaLibraryBrowser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaLibraryBrowser.d.ts","sourceRoot":"","sources":["../../../src/components/MediaLibrary/MediaLibraryBrowser.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAIzD,UAAU,wBAAwB;IAChC,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,KAAK,IAAI,CAAC;IAC5C,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnE,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;CACtC;AAED,eAAO,MAAM,mBAAmB,GAAI,gFAOjC,wBAAwB,4CA2D1B,CAAC"}

package/dist/components/MediaLibrary/MediaLibraryBrowser.js

@@ -0,0 +1,52 @@
+import { jsx as e, jsxs as i, Fragment as n } from "react/jsx-runtime";
+import { Center as f, Loader as h, Stack as l, Text as r, ScrollArea as p } from "@mantine/core";
+import { IconFolder as x } from "@tabler/icons-react";
+import { MediaLibraryBreadcrumbs as z } from "./MediaLibraryBreadcrumbs.js";
+import { MediaLibraryRow as w } from "./MediaLibraryRow.js";
+import y from "./MediaLibrary.module.css.js";
+const k = ({
+  items: d,
+  isLoading: t,
+  breadcrumbs: o,
+  onFolderClick: c,
+  onBreadcrumbClick: s,
+  onSelect: a
+}) => t ? /* @__PURE__ */ e(f, { h: 200, children: /* @__PURE__ */ e(h, { size: "sm" }) }) : /* @__PURE__ */ i(l, { gap: 0, children: [
+  o && o.length > 1 && /* @__PURE__ */ e(
+    z,
+    {
+      breadcrumbs: o,
+      onBreadcrumbClick: s
+    }
+  ),
+  d.length === 0 ? /* @__PURE__ */ i(l, { align: "center", justify: "center", gap: "xs", py: "xl", mih: 150, children: [
+    /* @__PURE__ */ e(
+      x,
+      {
+        size: 40,
+        stroke: 1.5,
+        color: "var(--mantine-color-dimmed)"
+      }
+    ),
+    /* @__PURE__ */ e(r, { c: "dimmed", size: "sm", fw: 500, children: "No files yet" }),
+    /* @__PURE__ */ e(r, { c: "dimmed", size: "xs", ta: "center", maw: 250, children: "Upload files to your cloud storage to pick them here" })
+  ] }) : /* @__PURE__ */ i(n, { children: [
+    /* @__PURE__ */ i("div", { className: y.headerRow, children: [
+      /* @__PURE__ */ e(r, { fz: "xs", fw: 500, c: "dimmed", children: "Name" }),
+      /* @__PURE__ */ e(r, { fz: "xs", fw: 500, c: "dimmed", children: "Modified" }),
+      /* @__PURE__ */ e(r, { fz: "xs", fw: 500, c: "dimmed", children: "Size" })
+    ] }),
+    /* @__PURE__ */ e(p.Autosize, { mah: 350, offsetScrollbars: !0, scrollbarSize: 6, children: d.map((m) => /* @__PURE__ */ e(
+      w,
+      {
+        item: m,
+        onFolderClick: c,
+        onSelect: a
+      },
+      m.id
+    )) })
+  ] })
+] });
+export {
+  k as MediaLibraryBrowser
+};

package/dist/components/MediaLibrary/MediaLibraryRow.d.ts

@@ -0,0 +1,9 @@
+import type { MediaFile } from './types';
+interface MediaLibraryRowProps {
+    item: MediaFile;
+    onFolderClick?: (folder: MediaFile) => void;
+    onSelect?: (file: MediaFile) => void;
+}
+export declare const MediaLibraryRow: import("react").MemoExoticComponent<({ item, onFolderClick, onSelect }: MediaLibraryRowProps) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=MediaLibraryRow.d.ts.map

package/dist/components/MediaLibrary/MediaLibraryRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaLibraryRow.d.ts","sourceRoot":"","sources":["../../../src/components/MediaLibrary/MediaLibraryRow.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAWzC,UAAU,oBAAoB;IAC5B,IAAI,EAAE,SAAS,CAAC;IAChB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,KAAK,IAAI,CAAC;IAC5C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;CACtC;AAED,eAAO,MAAM,eAAe,0EACU,oBAAoB,6CA8BzD,CAAC"}