@oneplatformdev/ui 0.1.99-beta.272 → 0.1.99-beta.273

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,16 +1,16 @@
1
1
  import { jsxs as c, jsx as t } from "react/jsx-runtime";
2
- import { useState as y, useMemo as d, useEffect as w } from "react";
3
- import { isFile as N } from "./DropzoneUtils.js";
4
- import { X as x, FileIcon as v, Video as k, PencilIcon as L, Trash2 as F } from "lucide-react";
5
- import { MediaPlayer as P, MediaProvider as z } from "@vidstack/react";
6
- import { DefaultVideoLayout as E, defaultLayoutIcons as I } from "@vidstack/react/player/layouts/default";
7
- import { Button as U } from "../Button/Button.js";
2
+ import { useState as w, useMemo as u, useEffect as N } from "react";
3
+ import { isVideoUrl as v, isFile as k } from "./DropzoneUtils.js";
4
+ import { X as x, FileIcon as L, Video as F, PencilIcon as P, Trash2 as U } from "lucide-react";
5
+ import { MediaPlayer as z, MediaProvider as E } from "@vidstack/react";
6
+ import { DefaultVideoLayout as I, defaultLayoutIcons as j } from "@vidstack/react/player/layouts/default";
7
+ import { Button as C } from "../Button/Button.js";
8
8
  import "@vidstack/react/player/styles/base.css";
9
9
  import "@vidstack/react/player/styles/default/theme.css";
10
10
  import "@vidstack/react/player/styles/default/layouts/video.css";
11
11
  /* empty css */
12
- import { ButtonIcon as j } from "../ButtonIcon/ButtonIcon.js";
13
- const C = (e) => {
12
+ import { ButtonIcon as S } from "../ButtonIcon/ButtonIcon.js";
13
+ const R = (e) => {
14
14
  if (!e) return "";
15
15
  switch (!0) {
16
16
  case (typeof e == "string" && !!e.trim() && e !== "null"):
@@ -22,7 +22,7 @@ const C = (e) => {
22
22
  default:
23
23
  return "";
24
24
  }
25
- }, S = (e) => {
25
+ }, B = (e) => {
26
26
  if (!e) return !1;
27
27
  try {
28
28
  const i = new URL(e).hostname.toLowerCase();
@@ -30,97 +30,100 @@ const C = (e) => {
30
30
  } catch {
31
31
  return !1;
32
32
  }
33
- }, B = (e) => {
33
+ }, V = (e) => {
34
34
  try {
35
- const o = new URL(e);
36
- if (o.hostname.toLowerCase().includes("youtu.be"))
37
- return o.pathname.replace("/", "").trim();
38
- const f = o.searchParams.get("v");
35
+ const n = new URL(e);
36
+ if (n.hostname.toLowerCase().includes("youtu.be"))
37
+ return n.pathname.replace("/", "").trim();
38
+ const f = n.searchParams.get("v");
39
39
  if (f) return f.trim();
40
- const u = o.pathname.split("/").filter(Boolean), s = u.findIndex((h) => h === "embed");
41
- return s >= 0 && u[s + 1] ? u[s + 1].trim() : "";
40
+ const d = n.pathname.split("/").filter(Boolean), l = d.findIndex((h) => h === "embed");
41
+ return l >= 0 && d[l + 1] ? d[l + 1].trim() : "";
42
42
  } catch {
43
43
  return "";
44
44
  }
45
- }, G = ({
45
+ }, J = ({
46
46
  item: e,
47
- disabled: o,
47
+ disabled: n,
48
48
  onRemoveClick: i,
49
49
  onReplaceClick: f,
50
- labelReplace: u = "Замінити"
50
+ labelReplace: d = "Замінити"
51
51
  }) => {
52
- const [s, h] = y(""), n = N(e), m = n ? e.name : e, l = d(
53
- () => typeof e == "string" && S(e),
52
+ const [l, h] = w(""), s = k(e), p = s ? e.name : e, r = u(
53
+ () => typeof e == "string" && B(e),
54
54
  [e]
55
- ), g = d(() => {
56
- if (!l || typeof e != "string") return "";
57
- const r = B(e);
58
- return r ? `youtube/${r}` : e;
59
- }, [l, e]), p = d(() => n && e.type?.includes("image") || typeof e == "string" && !l, [e, n, l]), a = d(() => n && e.type?.includes("video") || l, [e, n, l]), b = d(() => n ? `${(e.size / (1024 * 1024)).toFixed(0)} MB` : "", [e, n]);
60
- return w(() => {
61
- if (p || a) {
62
- const r = C(e);
63
- if (h(r), n && r)
64
- return () => URL.revokeObjectURL(r);
55
+ ), m = u(
56
+ () => typeof e == "string" && !r && v(e),
57
+ [e, r]
58
+ ), y = u(() => {
59
+ if (!r || typeof e != "string") return "";
60
+ const o = V(e);
61
+ return o ? `youtube/${o}` : e;
62
+ }, [r, e]), g = u(() => s && e.type?.includes("image") || typeof e == "string" && !r && !m, [e, s, r, m]), a = u(() => s && e.type?.includes("video") || r || m, [e, s, r, m]), b = u(() => s ? `${(e.size / (1024 * 1024)).toFixed(0)} MB` : "", [e, s]);
63
+ return N(() => {
64
+ if (g || a) {
65
+ const o = R(e);
66
+ if (h(o), s && o)
67
+ return () => URL.revokeObjectURL(o);
65
68
  } else
66
69
  h("");
67
- }, [e, n, p, a]), /* @__PURE__ */ c("div", { className: "relative w-full h-full overflow-hidden", children: [
68
- a && s ? /* @__PURE__ */ t("div", { className: "w-full h-64 sm:h-80 md:h-96 rounded-lg overflow-hidden bg-black", onClick: (r) => r.stopPropagation(), children: /* @__PURE__ */ c(
69
- P,
70
+ }, [e, s, g, a]), /* @__PURE__ */ c("div", { className: "relative w-full overflow-hidden", children: [
71
+ a && l ? /* @__PURE__ */ t("div", { className: "w-full h-64 sm:h-80 md:h-96 rounded-lg overflow-hidden bg-black", onClick: (o) => o.stopPropagation(), children: /* @__PURE__ */ c(
72
+ z,
70
73
  {
71
- src: l ? g : { src: s, type: n ? e.type : void 0 },
72
- className: `h-full w-full bg-black text-white ${l ? "dropzone-youtube-player" : ""}`,
74
+ src: r ? y : { src: l, type: s ? e.type : void 0 },
75
+ className: `h-full w-full bg-black text-white ${r ? "dropzone-youtube-player" : ""}`,
73
76
  playsInline: !0,
74
77
  children: [
75
- /* @__PURE__ */ t(z, {}),
76
- /* @__PURE__ */ t(E, { icons: I })
78
+ /* @__PURE__ */ t(E, {}),
79
+ /* @__PURE__ */ t(I, { icons: j })
77
80
  ]
78
81
  }
79
- ) }) : !a && s ? /* @__PURE__ */ c("div", { className: "relative w-full h-full overflow-hidden outline-[#E4E4E7] outline-2 outline-dashed -outline-offset-1 rounded-lg", children: [
80
- !o && /* @__PURE__ */ t("div", { className: "absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm", onClick: i, children: /* @__PURE__ */ t(x, { size: 16, strokeWidth: 2, color: "black" }) }),
82
+ ) }) : !a && l ? /* @__PURE__ */ c("div", { className: "relative w-full h-64 sm:h-80 md:h-96 overflow-hidden outline-[#E4E4E7] outline-2 outline-dashed -outline-offset-1 rounded-lg", children: [
83
+ !n && /* @__PURE__ */ t("div", { className: "absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm", onClick: i, children: /* @__PURE__ */ t(x, { size: 16, strokeWidth: 2, color: "black" }) }),
81
84
  /* @__PURE__ */ t(
82
85
  "img",
83
86
  {
84
- src: s,
85
- alt: m?.toString(),
87
+ src: l,
88
+ alt: p?.toString(),
86
89
  className: "w-full h-full object-cover rounded-lg"
87
90
  }
88
91
  )
89
92
  ] }) : a ? null : /* @__PURE__ */ c("div", { className: "relative w-full h-64 sm:h-80 md:h-96 overflow-hidden outline-[#E4E4E7] outline-2 outline-dashed -outline-offset-1 rounded-lg", children: [
90
- !o && /* @__PURE__ */ t("div", { className: "absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm", onClick: i, children: /* @__PURE__ */ t(x, { size: 16, strokeWidth: 2, color: "black" }) }),
93
+ !n && /* @__PURE__ */ t("div", { className: "absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm", onClick: i, children: /* @__PURE__ */ t(x, { size: 16, strokeWidth: 2, color: "black" }) }),
91
94
  /* @__PURE__ */ c("div", { className: "w-full h-full flex flex-col items-center justify-center text-gray-600", children: [
92
- /* @__PURE__ */ t(v, { size: 28 }),
93
- /* @__PURE__ */ t("span", { className: "text-sm mt-2 break-all px-2 text-center", children: m?.toString() })
95
+ /* @__PURE__ */ t(L, { size: 28 }),
96
+ /* @__PURE__ */ t("span", { className: "text-sm mt-2 break-all px-2 text-center", children: p?.toString() })
94
97
  ] })
95
98
  ] }),
96
- a && !l && /* @__PURE__ */ c(
99
+ a && !r && /* @__PURE__ */ c(
97
100
  "div",
98
101
  {
99
102
  className: "mt-2 w-full h-auto min-h-14 rounded-[8px] border border-[#E8E9EB] bg-[#FCFCFC] p-2 flex items-center gap-4",
100
- onClick: (r) => r.stopPropagation(),
103
+ onClick: (o) => o.stopPropagation(),
101
104
  children: [
102
- /* @__PURE__ */ t("div", { className: "size-10 rounded-[8px] bg-[#9368FF1F] flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(k, { className: "size-6 text-[#06080D]" }) }),
105
+ /* @__PURE__ */ t("div", { className: "size-10 rounded-[8px] bg-[#9368FF1F] flex items-center justify-center shrink-0", children: /* @__PURE__ */ t(F, { className: "size-6 text-[#06080D]" }) }),
103
106
  /* @__PURE__ */ c("div", { className: "flex flex-col items-start text-left gap-1 min-w-0 flex-1 justify-start", children: [
104
- /* @__PURE__ */ t("span", { className: "w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate text-left", children: m?.toString() }),
107
+ /* @__PURE__ */ t("span", { className: "w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate text-left", children: p?.toString() }),
105
108
  /* @__PURE__ */ t("span", { className: "w-full text-[12px] font-medium leading-[120%] text-[#363B4E] text-left", children: b })
106
109
  ] }),
107
- !o && /* @__PURE__ */ t(
108
- U,
110
+ !n && /* @__PURE__ */ t(
111
+ C,
109
112
  {
110
113
  type: "button",
111
114
  color: "secondary",
112
- startAdornment: L,
115
+ startAdornment: P,
113
116
  size: "md",
114
- onClick: (r) => {
115
- r.stopPropagation(), f?.(r);
117
+ onClick: (o) => {
118
+ o.stopPropagation(), f?.(o);
116
119
  },
117
- children: u
120
+ children: d
118
121
  }
119
122
  ),
120
- !o && /* @__PURE__ */ t(
121
- j,
123
+ !n && /* @__PURE__ */ t(
124
+ S,
122
125
  {
123
- icon: F,
126
+ icon: U,
124
127
  variant: "outlined",
125
128
  size: "md",
126
129
  color: "secondary",
@@ -133,7 +136,7 @@ const C = (e) => {
133
136
  ] });
134
137
  };
135
138
  export {
136
- G as DropzoneSinglePickPreview,
137
- C as transformImageToSrc
139
+ J as DropzoneSinglePickPreview,
140
+ R as transformImageToSrc
138
141
  };
139
142
  //# sourceMappingURL=DropzoneSinglePickPreview.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DropzoneSinglePickPreview.js","sources":["../../src/Dropzone/DropzoneSinglePickPreview.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\r\nimport { DropzoneValueItem } from './Dropzone.types';\r\nimport { isFile } from './DropzoneUtils';\r\nimport { FileIcon, PencilIcon, Trash2, Video, X } from 'lucide-react';\r\nimport { MediaPlayer, MediaProvider } from '@vidstack/react';\r\nimport { defaultLayoutIcons, DefaultVideoLayout } from '@vidstack/react/player/layouts/default';\r\nimport { Button } from '../Button/Button';\r\n\r\nimport '@vidstack/react/player/styles/base.css';\r\nimport '@vidstack/react/player/styles/default/theme.css';\r\nimport '@vidstack/react/player/styles/default/layouts/video.css';\r\nimport './DropzoneSinglePickPreview.css';\r\nimport { ButtonIcon } from \"../ButtonIcon\";\r\n\r\nexport const transformImageToSrc = (preview?: string | File | null): string => {\r\n if (!preview) return '';\r\n switch (true) {\r\n case typeof preview === 'string' && !!preview.trim() && preview !== 'null':\r\n return preview;\r\n case preview instanceof File:\r\n return URL.createObjectURL(preview);\r\n case preview instanceof FileList:\r\n return preview[0] ? URL.createObjectURL(preview[0]) : '';\r\n default:\r\n return '';\r\n }\r\n};\r\n\r\nconst isYoutubeUrl = (value?: string | null) => {\r\n if (!value) return false;\r\n try {\r\n const url = new URL(value);\r\n const hostname = url.hostname.toLowerCase();\r\n return hostname.includes('youtube.com') || hostname.includes('youtu.be');\r\n } catch {\r\n return false;\r\n }\r\n};\r\n\r\nconst extractYoutubeId = (value: string) => {\r\n try {\r\n const url = new URL(value);\r\n const hostname = url.hostname.toLowerCase();\r\n\r\n if (hostname.includes('youtu.be')) {\r\n return url.pathname.replace('/', '').trim();\r\n }\r\n\r\n const searchId = url.searchParams.get('v');\r\n if (searchId) return searchId.trim();\r\n\r\n const pathParts = url.pathname.split('/').filter(Boolean);\r\n const embedIndex = pathParts.findIndex((part) => part === 'embed');\r\n if (embedIndex >= 0 && pathParts[embedIndex + 1]) {\r\n return pathParts[embedIndex + 1].trim();\r\n }\r\n\r\n return '';\r\n } catch {\r\n return '';\r\n }\r\n};\r\n\r\ninterface SinglePickPreviewProps {\r\n item: DropzoneValueItem;\r\n disabled?: boolean;\r\n onRemoveClick: (e: React.MouseEvent<HTMLElement>) => void;\r\n onReplaceClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;\r\n labelUploaded?: string;\r\n labelReplace?: string;\r\n}\r\n\r\nexport const DropzoneSinglePickPreview = ({\r\n item,\r\n disabled,\r\n onRemoveClick,\r\n onReplaceClick,\r\n labelReplace = 'Замінити',\r\n}: SinglePickPreviewProps) => {\r\n const [previewUrl, setPreviewUrl] = useState('');\r\n const isFileType = isFile(item);\r\n const fileName = isFileType ? item.name : item;\r\n\r\n const isYoutubeVideo = useMemo(\r\n () => typeof item === 'string' && isYoutubeUrl(item),\r\n [item]\r\n );\r\n const youtubeSource = useMemo(() => {\r\n if (!isYoutubeVideo || typeof item !== 'string') return '';\r\n const id = extractYoutubeId(item);\r\n return id ? `youtube/${id}` : item;\r\n }, [isYoutubeVideo, item]);\r\n\r\n const showImage = useMemo(() => {\r\n return (isFileType && item.type?.includes('image')) || (typeof item === 'string' && !isYoutubeVideo);\r\n }, [item, isFileType, isYoutubeVideo]);\r\n\r\n const showVideo = useMemo(() => {\r\n return (isFileType && item.type?.includes('video')) || isYoutubeVideo;\r\n }, [item, isFileType, isYoutubeVideo]);\r\n\r\n const fileSize = useMemo(() => {\r\n if (!isFileType) return '';\r\n return `${(item.size / (1024 * 1024)).toFixed(0)} MB`;\r\n }, [item, isFileType]);\r\n\r\n useEffect(() => {\r\n if (showImage || showVideo) {\r\n const nextPreview = transformImageToSrc(item);\r\n setPreviewUrl(nextPreview);\r\n\r\n if (isFileType && nextPreview) {\r\n return () => URL.revokeObjectURL(nextPreview);\r\n }\r\n } else {\r\n setPreviewUrl('');\r\n }\r\n\r\n return undefined;\r\n }, [item, isFileType, showImage, showVideo]);\r\n\r\n return (\r\n <div className=\"relative w-full h-full overflow-hidden\">\r\n {showVideo && previewUrl ? (\r\n <div className=\"w-full h-64 sm:h-80 md:h-96 rounded-lg overflow-hidden bg-black\" onClick={(event) => event.stopPropagation()}>\r\n <MediaPlayer\r\n src={\r\n isYoutubeVideo\r\n ? youtubeSource\r\n : { src: previewUrl, type: isFileType ? item.type : undefined }\r\n }\r\n className={`h-full w-full bg-black text-white ${\r\n isYoutubeVideo ? 'dropzone-youtube-player' : ''\r\n }`}\r\n playsInline\r\n >\r\n <MediaProvider />\r\n <DefaultVideoLayout icons={defaultLayoutIcons} />\r\n </MediaPlayer>\r\n </div>\r\n ) : !showVideo && previewUrl ? (\r\n <div className=\"relative w-full h-full overflow-hidden outline-[#E4E4E7] outline-2 outline-dashed -outline-offset-1 rounded-lg\">\r\n {!disabled && (\r\n <div className=\"absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm\" onClick={onRemoveClick} >\r\n <X size={16} strokeWidth={2} color=\"black\" />\r\n </div>\r\n )}\r\n <img\r\n src={previewUrl}\r\n alt={fileName?.toString()}\r\n className=\"w-full h-full object-cover rounded-lg\"\r\n />\r\n </div>\r\n ) : !showVideo ? (\r\n <div className=\"relative w-full h-64 sm:h-80 md:h-96 overflow-hidden outline-[#E4E4E7] outline-2 outline-dashed -outline-offset-1 rounded-lg\">\r\n {!disabled && (\r\n <div className=\"absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm\" onClick={onRemoveClick} >\r\n <X size={16} strokeWidth={2} color=\"black\" />\r\n </div>\r\n )}\r\n <div className=\"w-full h-full flex flex-col items-center justify-center text-gray-600\">\r\n <FileIcon size={28} />\r\n <span className=\"text-sm mt-2 break-all px-2 text-center\">\r\n {fileName?.toString()}\r\n </span>\r\n </div>\r\n </div>\r\n ) : null}\r\n\r\n {showVideo && !isYoutubeVideo && (\r\n <div\r\n className=\"mt-2 w-full h-auto min-h-14 rounded-[8px] border border-[#E8E9EB] bg-[#FCFCFC] p-2 flex items-center gap-4\"\r\n onClick={(event) => event.stopPropagation()}\r\n >\r\n <div className=\"size-10 rounded-[8px] bg-[#9368FF1F] flex items-center justify-center shrink-0\">\r\n <Video className=\"size-6 text-[#06080D]\" />\r\n </div>\r\n\r\n <div className=\"flex flex-col items-start text-left gap-1 min-w-0 flex-1 justify-start\">\r\n <span className=\"w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate text-left\">\r\n {fileName?.toString()}\r\n </span>\r\n <span className=\"w-full text-[12px] font-medium leading-[120%] text-[#363B4E] text-left\">\r\n {fileSize}\r\n </span>\r\n </div>\r\n\r\n {!disabled && (\r\n <Button\r\n type=\"button\"\r\n color=\"secondary\"\r\n startAdornment={PencilIcon}\r\n size=\"md\"\r\n onClick={(event) => {\r\n event.stopPropagation();\r\n onReplaceClick?.(event);\r\n }}\r\n >\r\n {labelReplace}\r\n </Button>\r\n )}\r\n\r\n {!disabled && (\r\n <ButtonIcon\r\n icon={Trash2}\r\n variant=\"outlined\"\r\n size=\"md\"\r\n color=\"secondary\"\r\n onClick={onRemoveClick}\r\n />\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n};\r\n"],"names":["transformImageToSrc","preview","isYoutubeUrl","value","hostname","extractYoutubeId","url","searchId","pathParts","embedIndex","part","DropzoneSinglePickPreview","item","disabled","onRemoveClick","onReplaceClick","labelReplace","previewUrl","setPreviewUrl","useState","isFileType","isFile","fileName","isYoutubeVideo","useMemo","youtubeSource","id","showImage","showVideo","fileSize","useEffect","nextPreview","jsxs","jsx","event","MediaPlayer","MediaProvider","DefaultVideoLayout","defaultLayoutIcons","X","FileIcon","Video","Button","PencilIcon","ButtonIcon","Trash2"],"mappings":"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"}
1
+ {"version":3,"file":"DropzoneSinglePickPreview.js","sources":["../../src/Dropzone/DropzoneSinglePickPreview.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\r\nimport { DropzoneValueItem } from './Dropzone.types';\r\nimport { isFile, isVideoUrl } from './DropzoneUtils';\r\nimport { FileIcon, PencilIcon, Trash2, Video, X } from 'lucide-react';\r\nimport { MediaPlayer, MediaProvider } from '@vidstack/react';\r\nimport { defaultLayoutIcons, DefaultVideoLayout } from '@vidstack/react/player/layouts/default';\r\nimport { Button } from '../Button/Button';\r\n\r\nimport '@vidstack/react/player/styles/base.css';\r\nimport '@vidstack/react/player/styles/default/theme.css';\r\nimport '@vidstack/react/player/styles/default/layouts/video.css';\r\nimport './DropzoneSinglePickPreview.css';\r\nimport { ButtonIcon } from \"../ButtonIcon\";\r\n\r\nexport const transformImageToSrc = (preview?: string | File | null): string => {\r\n if (!preview) return '';\r\n switch (true) {\r\n case typeof preview === 'string' && !!preview.trim() && preview !== 'null':\r\n return preview;\r\n case preview instanceof File:\r\n return URL.createObjectURL(preview);\r\n case preview instanceof FileList:\r\n return preview[0] ? URL.createObjectURL(preview[0]) : '';\r\n default:\r\n return '';\r\n }\r\n};\r\n\r\nconst isYoutubeUrl = (value?: string | null) => {\r\n if (!value) return false;\r\n try {\r\n const url = new URL(value);\r\n const hostname = url.hostname.toLowerCase();\r\n return hostname.includes('youtube.com') || hostname.includes('youtu.be');\r\n } catch {\r\n return false;\r\n }\r\n};\r\n\r\nconst extractYoutubeId = (value: string) => {\r\n try {\r\n const url = new URL(value);\r\n const hostname = url.hostname.toLowerCase();\r\n\r\n if (hostname.includes('youtu.be')) {\r\n return url.pathname.replace('/', '').trim();\r\n }\r\n\r\n const searchId = url.searchParams.get('v');\r\n if (searchId) return searchId.trim();\r\n\r\n const pathParts = url.pathname.split('/').filter(Boolean);\r\n const embedIndex = pathParts.findIndex((part) => part === 'embed');\r\n if (embedIndex >= 0 && pathParts[embedIndex + 1]) {\r\n return pathParts[embedIndex + 1].trim();\r\n }\r\n\r\n return '';\r\n } catch {\r\n return '';\r\n }\r\n};\r\n\r\ninterface SinglePickPreviewProps {\r\n item: DropzoneValueItem;\r\n disabled?: boolean;\r\n onRemoveClick: (e: React.MouseEvent<HTMLElement>) => void;\r\n onReplaceClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;\r\n labelUploaded?: string;\r\n labelReplace?: string;\r\n}\r\n\r\nexport const DropzoneSinglePickPreview = ({\r\n item,\r\n disabled,\r\n onRemoveClick,\r\n onReplaceClick,\r\n labelReplace = 'Замінити',\r\n}: SinglePickPreviewProps) => {\r\n const [previewUrl, setPreviewUrl] = useState('');\r\n const isFileType = isFile(item);\r\n const fileName = isFileType ? item.name : item;\r\n\r\n const isYoutubeVideo = useMemo(\r\n () => typeof item === 'string' && isYoutubeUrl(item),\r\n [item]\r\n );\r\n const isRemoteVideo = useMemo(\r\n () => typeof item === 'string' && !isYoutubeVideo && isVideoUrl(item),\r\n [item, isYoutubeVideo]\r\n );\r\n const youtubeSource = useMemo(() => {\r\n if (!isYoutubeVideo || typeof item !== 'string') return '';\r\n const id = extractYoutubeId(item);\r\n return id ? `youtube/${id}` : item;\r\n }, [isYoutubeVideo, item]);\r\n\r\n const showImage = useMemo(() => {\r\n return (isFileType && item.type?.includes('image')) || (typeof item === 'string' && !isYoutubeVideo && !isRemoteVideo);\r\n }, [item, isFileType, isYoutubeVideo, isRemoteVideo]);\r\n\r\n const showVideo = useMemo(() => {\r\n return (isFileType && item.type?.includes('video')) || isYoutubeVideo || isRemoteVideo;\r\n }, [item, isFileType, isYoutubeVideo, isRemoteVideo]);\r\n\r\n const fileSize = useMemo(() => {\r\n if (!isFileType) return '';\r\n return `${(item.size / (1024 * 1024)).toFixed(0)} MB`;\r\n }, [item, isFileType]);\r\n\r\n useEffect(() => {\r\n if (showImage || showVideo) {\r\n const nextPreview = transformImageToSrc(item);\r\n setPreviewUrl(nextPreview);\r\n\r\n if (isFileType && nextPreview) {\r\n return () => URL.revokeObjectURL(nextPreview);\r\n }\r\n } else {\r\n setPreviewUrl('');\r\n }\r\n\r\n return undefined;\r\n }, [item, isFileType, showImage, showVideo]);\r\n\r\n return (\r\n <div className=\"relative w-full overflow-hidden\">\r\n {showVideo && previewUrl ? (\r\n <div className=\"w-full h-64 sm:h-80 md:h-96 rounded-lg overflow-hidden bg-black\" onClick={(event) => event.stopPropagation()}>\r\n <MediaPlayer\r\n src={isYoutubeVideo ? youtubeSource : { src: previewUrl, type: isFileType ? (item as File).type : undefined }}\r\n className={`h-full w-full bg-black text-white ${\r\n isYoutubeVideo ? 'dropzone-youtube-player' : ''\r\n }`}\r\n playsInline\r\n >\r\n <MediaProvider />\r\n <DefaultVideoLayout icons={defaultLayoutIcons} />\r\n </MediaPlayer>\r\n </div>\r\n ) : !showVideo && previewUrl ? (\r\n <div className=\"relative w-full h-64 sm:h-80 md:h-96 overflow-hidden outline-[#E4E4E7] outline-2 outline-dashed -outline-offset-1 rounded-lg\">\r\n {!disabled && (\r\n <div className=\"absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm\" onClick={onRemoveClick} >\r\n <X size={16} strokeWidth={2} color=\"black\" />\r\n </div>\r\n )}\r\n <img\r\n src={previewUrl}\r\n alt={fileName?.toString()}\r\n className=\"w-full h-full object-cover rounded-lg\"\r\n />\r\n </div>\r\n ) : !showVideo ? (\r\n <div className=\"relative w-full h-64 sm:h-80 md:h-96 overflow-hidden outline-[#E4E4E7] outline-2 outline-dashed -outline-offset-1 rounded-lg\">\r\n {!disabled && (\r\n <div className=\"absolute top-2 right-2 cursor-pointer bg-white/70 rounded-[4px] p-1 shadow-sm\" onClick={onRemoveClick} >\r\n <X size={16} strokeWidth={2} color=\"black\" />\r\n </div>\r\n )}\r\n <div className=\"w-full h-full flex flex-col items-center justify-center text-gray-600\">\r\n <FileIcon size={28} />\r\n <span className=\"text-sm mt-2 break-all px-2 text-center\">\r\n {fileName?.toString()}\r\n </span>\r\n </div>\r\n </div>\r\n ) : null}\r\n\r\n {showVideo && !isYoutubeVideo && (\r\n <div\r\n className=\"mt-2 w-full h-auto min-h-14 rounded-[8px] border border-[#E8E9EB] bg-[#FCFCFC] p-2 flex items-center gap-4\"\r\n onClick={(event) => event.stopPropagation()}\r\n >\r\n <div className=\"size-10 rounded-[8px] bg-[#9368FF1F] flex items-center justify-center shrink-0\">\r\n <Video className=\"size-6 text-[#06080D]\" />\r\n </div>\r\n\r\n <div className=\"flex flex-col items-start text-left gap-1 min-w-0 flex-1 justify-start\">\r\n <span className=\"w-full text-[14px] font-semibold leading-[125%] text-[#06080D] truncate text-left\">\r\n {fileName?.toString()}\r\n </span>\r\n <span className=\"w-full text-[12px] font-medium leading-[120%] text-[#363B4E] text-left\">\r\n {fileSize}\r\n </span>\r\n </div>\r\n\r\n {!disabled && (\r\n <Button\r\n type=\"button\"\r\n color=\"secondary\"\r\n startAdornment={PencilIcon}\r\n size=\"md\"\r\n onClick={(event) => {\r\n event.stopPropagation();\r\n onReplaceClick?.(event);\r\n }}\r\n >\r\n {labelReplace}\r\n </Button>\r\n )}\r\n\r\n {!disabled && (\r\n <ButtonIcon\r\n icon={Trash2}\r\n variant=\"outlined\"\r\n size=\"md\"\r\n color=\"secondary\"\r\n onClick={onRemoveClick}\r\n />\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n );\r\n};\r\n"],"names":["transformImageToSrc","preview","isYoutubeUrl","value","hostname","extractYoutubeId","url","searchId","pathParts","embedIndex","part","DropzoneSinglePickPreview","item","disabled","onRemoveClick","onReplaceClick","labelReplace","previewUrl","setPreviewUrl","useState","isFileType","isFile","fileName","isYoutubeVideo","useMemo","isRemoteVideo","isVideoUrl","youtubeSource","id","showImage","showVideo","fileSize","useEffect","nextPreview","jsxs","jsx","event","MediaPlayer","MediaProvider","DefaultVideoLayout","defaultLayoutIcons","X","FileIcon","Video","Button","PencilIcon","ButtonIcon","Trash2"],"mappings":"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"}
@@ -1,5 +1,6 @@
1
1
  import { DropzoneValueItem } from './Dropzone.types';
2
2
  export declare function isFile(item: DropzoneValueItem): item is File;
3
+ export declare function isVideoUrl(item: DropzoneValueItem): boolean;
3
4
  export declare function extractName(url: string): string;
4
5
  export declare const DefaultFileIcon: () => import("react/jsx-runtime").JSX.Element;
5
6
  //# sourceMappingURL=DropzoneUtils.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DropzoneUtils.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneUtils.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,wBAAgB,MAAM,CAAC,IAAI,EAAE,iBAAiB,GAAG,IAAI,IAAI,IAAI,CAE5D;AAED,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,UAOtC;AAED,eAAO,MAAM,eAAe,+CAe3B,CAAC"}
1
+ {"version":3,"file":"DropzoneUtils.d.ts","sourceRoot":"","sources":["../../src/Dropzone/DropzoneUtils.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,wBAAgB,MAAM,CAAC,IAAI,EAAE,iBAAiB,GAAG,IAAI,IAAI,IAAI,CAE5D;AAID,wBAAgB,UAAU,CAAC,IAAI,EAAE,iBAAiB,GAAG,OAAO,CAQ3D;AAED,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,UAOtC;AAED,eAAO,MAAM,eAAe,+CAe3B,CAAC"}
@@ -1,8 +1,18 @@
1
- import { jsxs as t, jsx as l } from "react/jsx-runtime";
1
+ import { jsxs as n, jsx as l } from "react/jsx-runtime";
2
2
  function d(e) {
3
3
  return e instanceof File;
4
4
  }
5
- function r(e) {
5
+ const r = [".mp4", ".mov", ".avi", ".webm", ".mkv", ".m4v"];
6
+ function s(e) {
7
+ if (typeof e != "string") return !1;
8
+ try {
9
+ const i = new URL(e).pathname.toLowerCase();
10
+ return r.some((t) => i.endsWith(t));
11
+ } catch {
12
+ return !1;
13
+ }
14
+ }
15
+ function a(e) {
6
16
  try {
7
17
  const i = e.split("?")[0].split("#")[0].split("/");
8
18
  return i[i.length - 1] || e;
@@ -10,7 +20,7 @@ function r(e) {
10
20
  return e;
11
21
  }
12
22
  }
13
- const o = () => /* @__PURE__ */ t("svg", { width: "55", height: "55", viewBox: "0 0 55 55", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
23
+ const c = () => /* @__PURE__ */ n("svg", { width: "55", height: "55", viewBox: "0 0 55 55", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
14
24
  /* @__PURE__ */ l("mask", { id: "mask0_2430_114601", maskUnits: "userSpaceOnUse", x: "7", y: "4", width: "39", height: "46", children: /* @__PURE__ */ l("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.25 4.68359H45.6174V49.354H7.25V4.68359Z", fill: "white" }) }),
15
25
  /* @__PURE__ */ l("g", { mask: "url(#mask0_2430_114601)", children: /* @__PURE__ */ l("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M17.5386 8.05859C13.8103 8.05859 10.7143 11.0781 10.6266 14.8018V38.9196C10.5456 42.7468 13.5606 45.8968 17.3518 45.9801H35.5386C39.2938 45.8451 42.2661 42.7468 42.2413 38.9308V18.9216L31.8148 8.05859H17.5656H17.5386ZM17.5664 49.3551H17.2829C11.6309 49.2336 7.1309 44.5356 7.2524 38.8836V14.7613C7.38515 9.17909 11.9932 4.68359 17.5327 4.68359H17.5732H32.5334C32.9924 4.68359 33.4312 4.87034 33.7507 5.20109L45.1492 17.0743C45.4484 17.3871 45.6172 17.8078 45.6172 18.2421V38.9196C45.6532 44.5648 41.2522 49.1526 35.5979 49.3551H17.5664Z", fill: "#0D0E2B", "fill-opacity": "0.7" }) }),
16
26
  /* @__PURE__ */ l("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M43.9198 20.3703H37.7233C33.6036 20.359 30.2578 17.002 30.2578 12.889V6.34375C30.2578 5.41225 31.0138 4.65625 31.9453 4.65625C32.8768 4.65625 33.6328 5.41225 33.6328 6.34375V12.889C33.6328 15.148 35.4688 16.9885 37.7278 16.9953H43.9198C44.8513 16.9953 45.6073 17.7513 45.6073 18.6828C45.6073 19.6143 44.8513 20.3703 43.9198 20.3703Z", fill: "#0D0E2B", "fill-opacity": "0.7" }),
@@ -18,8 +28,9 @@ const o = () => /* @__PURE__ */ t("svg", { width: "55", height: "55", viewBox: "
18
28
  /* @__PURE__ */ l("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M25.5678 37.7279C25.1201 37.7279 24.6881 37.5501 24.3731 37.2306L19.0968 31.9341C18.4398 31.2726 18.4421 30.2039 19.1013 29.5469C19.7628 28.8899 20.8316 28.8899 21.4886 29.5514L25.5678 33.6509L29.6471 29.5514C30.3041 28.8899 31.3728 28.8899 32.0343 29.5469C32.6936 30.2039 32.6958 31.2726 32.0388 31.9341L26.7626 37.2306C26.4476 37.5501 26.0156 37.7279 25.5678 37.7279Z", fill: "#0D0E2B", "fill-opacity": "0.7" })
19
29
  ] });
20
30
  export {
21
- o as DefaultFileIcon,
22
- r as extractName,
23
- d as isFile
31
+ c as DefaultFileIcon,
32
+ a as extractName,
33
+ d as isFile,
34
+ s as isVideoUrl
24
35
  };
25
36
  //# sourceMappingURL=DropzoneUtils.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DropzoneUtils.js","sources":["../../src/Dropzone/DropzoneUtils.tsx"],"sourcesContent":["import { DropzoneValueItem } from './Dropzone.types';\r\n\r\nexport function isFile(item: DropzoneValueItem): item is File {\r\n return item instanceof File;\r\n}\r\n\r\nexport function extractName(url: string) {\r\n try {\r\n const parts = url.split('?')[0].split('#')[0].split('/');\r\n return parts[parts.length - 1] || url;\r\n } catch {\r\n return url;\r\n }\r\n}\r\n\r\nexport const DefaultFileIcon = () => {\r\n return (\r\n <svg width=\"55\" height=\"55\" viewBox=\"0 0 55 55\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <mask id=\"mask0_2430_114601\" maskUnits=\"userSpaceOnUse\" x=\"7\" y=\"4\" width=\"39\" height=\"46\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.25 4.68359H45.6174V49.354H7.25V4.68359Z\" fill=\"white\"/>\r\n </mask>\r\n <g mask=\"url(#mask0_2430_114601)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M17.5386 8.05859C13.8103 8.05859 10.7143 11.0781 10.6266 14.8018V38.9196C10.5456 42.7468 13.5606 45.8968 17.3518 45.9801H35.5386C39.2938 45.8451 42.2661 42.7468 42.2413 38.9308V18.9216L31.8148 8.05859H17.5656H17.5386ZM17.5664 49.3551H17.2829C11.6309 49.2336 7.1309 44.5356 7.2524 38.8836V14.7613C7.38515 9.17909 11.9932 4.68359 17.5327 4.68359H17.5732H32.5334C32.9924 4.68359 33.4312 4.87034 33.7507 5.20109L45.1492 17.0743C45.4484 17.3871 45.6172 17.8078 45.6172 18.2421V38.9196C45.6532 44.5648 41.2522 49.1526 35.5979 49.3551H17.5664Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n </g>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M43.9198 20.3703H37.7233C33.6036 20.359 30.2578 17.002 30.2578 12.889V6.34375C30.2578 5.41225 31.0138 4.65625 31.9453 4.65625C32.8768 4.65625 33.6328 5.41225 33.6328 6.34375V12.889C33.6328 15.148 35.4688 16.9885 37.7278 16.9953H43.9198C44.8513 16.9953 45.6073 17.7513 45.6073 18.6828C45.6073 19.6143 44.8513 20.3703 43.9198 20.3703Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M25.5708 37.729C24.6393 37.729 23.8833 36.973 23.8833 36.0415V22.4492C23.8833 21.5177 24.6393 20.7617 25.5708 20.7617C26.5023 20.7617 27.2583 21.5177 27.2583 22.4492V36.0415C27.2583 36.973 26.5023 37.729 25.5708 37.729Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M25.5678 37.7279C25.1201 37.7279 24.6881 37.5501 24.3731 37.2306L19.0968 31.9341C18.4398 31.2726 18.4421 30.2039 19.1013 29.5469C19.7628 28.8899 20.8316 28.8899 21.4886 29.5514L25.5678 33.6509L29.6471 29.5514C30.3041 28.8899 31.3728 28.8899 32.0343 29.5469C32.6936 30.2039 32.6958 31.2726 32.0388 31.9341L26.7626 37.2306C26.4476 37.5501 26.0156 37.7279 25.5678 37.7279Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n </svg>\r\n \r\n );\r\n};\r\n"],"names":["isFile","item","extractName","url","parts","DefaultFileIcon","jsxs","jsx"],"mappings":";AAEO,SAASA,EAAOC,GAAuC;AAC5D,SAAOA,aAAgB;AACzB;AAEO,SAASC,EAAYC,GAAa;AACvC,MAAI;AACF,UAAMC,IAAQD,EAAI,MAAM,GAAG,EAAE,CAAC,EAAE,MAAM,GAAG,EAAE,CAAC,EAAE,MAAM,GAAG;AACvD,WAAOC,EAAMA,EAAM,SAAS,CAAC,KAAKD;AAAA,EACpC,QAAQ;AACN,WAAOA;AAAA,EACT;AACF;AAEO,MAAME,IAAkB,MAE3B,gBAAAC,EAAC,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,OAAM,8BAClE,UAAA;AAAA,EAAA,gBAAAC,EAAC,QAAA,EAAK,IAAG,qBAAoB,WAAU,kBAAiB,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MACtF,UAAA,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,8CAA6C,MAAK,QAAA,CAAO,EAAA,CACzG;AAAA,oBACC,KAAA,EAAE,MAAK,2BACR,UAAA,gBAAAA,EAAC,UAAK,aAAU,WAAU,aAAU,WAAU,GAAE,4hBAA2hB,MAAK,WAAU,gBAAa,OAAK,GAC5mB;AAAA,EACA,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,gVAA+U,MAAK,WAAU,gBAAa,MAAA,CAAK;AAAA,EACha,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,+NAA8N,MAAK,WAAU,gBAAa,MAAA,CAAK;AAAA,EAC/S,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,qXAAoX,MAAK,WAAU,gBAAa,MAAA,CAAK;AAAA,GACrc;"}
1
+ {"version":3,"file":"DropzoneUtils.js","sources":["../../src/Dropzone/DropzoneUtils.tsx"],"sourcesContent":["import { DropzoneValueItem } from './Dropzone.types';\r\n\r\nexport function isFile(item: DropzoneValueItem): item is File {\r\n return item instanceof File;\r\n}\r\n\r\nconst VIDEO_EXTENSIONS = ['.mp4', '.mov', '.avi', '.webm', '.mkv', '.m4v'];\r\n\r\nexport function isVideoUrl(item: DropzoneValueItem): boolean {\r\n if (typeof item !== 'string') return false;\r\n try {\r\n const path = new URL(item).pathname.toLowerCase();\r\n return VIDEO_EXTENSIONS.some((ext) => path.endsWith(ext));\r\n } catch {\r\n return false;\r\n }\r\n}\r\n\r\nexport function extractName(url: string) {\r\n try {\r\n const parts = url.split('?')[0].split('#')[0].split('/');\r\n return parts[parts.length - 1] || url;\r\n } catch {\r\n return url;\r\n }\r\n}\r\n\r\nexport const DefaultFileIcon = () => {\r\n return (\r\n <svg width=\"55\" height=\"55\" viewBox=\"0 0 55 55\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <mask id=\"mask0_2430_114601\" maskUnits=\"userSpaceOnUse\" x=\"7\" y=\"4\" width=\"39\" height=\"46\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.25 4.68359H45.6174V49.354H7.25V4.68359Z\" fill=\"white\"/>\r\n </mask>\r\n <g mask=\"url(#mask0_2430_114601)\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M17.5386 8.05859C13.8103 8.05859 10.7143 11.0781 10.6266 14.8018V38.9196C10.5456 42.7468 13.5606 45.8968 17.3518 45.9801H35.5386C39.2938 45.8451 42.2661 42.7468 42.2413 38.9308V18.9216L31.8148 8.05859H17.5656H17.5386ZM17.5664 49.3551H17.2829C11.6309 49.2336 7.1309 44.5356 7.2524 38.8836V14.7613C7.38515 9.17909 11.9932 4.68359 17.5327 4.68359H17.5732H32.5334C32.9924 4.68359 33.4312 4.87034 33.7507 5.20109L45.1492 17.0743C45.4484 17.3871 45.6172 17.8078 45.6172 18.2421V38.9196C45.6532 44.5648 41.2522 49.1526 35.5979 49.3551H17.5664Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n </g>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M43.9198 20.3703H37.7233C33.6036 20.359 30.2578 17.002 30.2578 12.889V6.34375C30.2578 5.41225 31.0138 4.65625 31.9453 4.65625C32.8768 4.65625 33.6328 5.41225 33.6328 6.34375V12.889C33.6328 15.148 35.4688 16.9885 37.7278 16.9953H43.9198C44.8513 16.9953 45.6073 17.7513 45.6073 18.6828C45.6073 19.6143 44.8513 20.3703 43.9198 20.3703Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M25.5708 37.729C24.6393 37.729 23.8833 36.973 23.8833 36.0415V22.4492C23.8833 21.5177 24.6393 20.7617 25.5708 20.7617C26.5023 20.7617 27.2583 21.5177 27.2583 22.4492V36.0415C27.2583 36.973 26.5023 37.729 25.5708 37.729Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M25.5678 37.7279C25.1201 37.7279 24.6881 37.5501 24.3731 37.2306L19.0968 31.9341C18.4398 31.2726 18.4421 30.2039 19.1013 29.5469C19.7628 28.8899 20.8316 28.8899 21.4886 29.5514L25.5678 33.6509L29.6471 29.5514C30.3041 28.8899 31.3728 28.8899 32.0343 29.5469C32.6936 30.2039 32.6958 31.2726 32.0388 31.9341L26.7626 37.2306C26.4476 37.5501 26.0156 37.7279 25.5678 37.7279Z\" fill=\"#0D0E2B\" fill-opacity=\"0.7\"/>\r\n </svg>\r\n \r\n );\r\n};\r\n"],"names":["isFile","item","VIDEO_EXTENSIONS","isVideoUrl","path","ext","extractName","url","parts","DefaultFileIcon","jsxs","jsx"],"mappings":";AAEO,SAASA,EAAOC,GAAuC;AAC5D,SAAOA,aAAgB;AACzB;AAEA,MAAMC,IAAmB,CAAC,QAAQ,QAAQ,QAAQ,SAAS,QAAQ,MAAM;AAElE,SAASC,EAAWF,GAAkC;AAC3D,MAAI,OAAOA,KAAS,SAAU,QAAO;AACrC,MAAI;AACF,UAAMG,IAAO,IAAI,IAAIH,CAAI,EAAE,SAAS,YAAA;AACpC,WAAOC,EAAiB,KAAK,CAACG,MAAQD,EAAK,SAASC,CAAG,CAAC;AAAA,EAC1D,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAEO,SAASC,EAAYC,GAAa;AACvC,MAAI;AACF,UAAMC,IAAQD,EAAI,MAAM,GAAG,EAAE,CAAC,EAAE,MAAM,GAAG,EAAE,CAAC,EAAE,MAAM,GAAG;AACvD,WAAOC,EAAMA,EAAM,SAAS,CAAC,KAAKD;AAAA,EACpC,QAAQ;AACN,WAAOA;AAAA,EACT;AACF;AAEO,MAAME,IAAkB,MAE3B,gBAAAC,EAAC,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,OAAM,8BAClE,UAAA;AAAA,EAAA,gBAAAC,EAAC,QAAA,EAAK,IAAG,qBAAoB,WAAU,kBAAiB,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MACtF,UAAA,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,8CAA6C,MAAK,QAAA,CAAO,EAAA,CACzG;AAAA,oBACC,KAAA,EAAE,MAAK,2BACR,UAAA,gBAAAA,EAAC,UAAK,aAAU,WAAU,aAAU,WAAU,GAAE,4hBAA2hB,MAAK,WAAU,gBAAa,OAAK,GAC5mB;AAAA,EACA,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,gVAA+U,MAAK,WAAU,gBAAa,MAAA,CAAK;AAAA,EACha,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,+NAA8N,MAAK,WAAU,gBAAa,MAAA,CAAK;AAAA,EAC/S,gBAAAA,EAAC,QAAA,EAAK,aAAU,WAAU,aAAU,WAAU,GAAE,qXAAoX,MAAK,WAAU,gBAAa,MAAA,CAAK;AAAA,GACrc;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oneplatformdev/ui",
3
- "version": "0.1.99-beta.272",
3
+ "version": "0.1.99-beta.273",
4
4
  "description": "UI component library for OnePlatform",
5
5
  "author": "One Platform Development Team",
6
6
  "keywords": [
@@ -109,9 +109,9 @@
109
109
  "recharts": "^3.2.0",
110
110
  "sonner": "^2.0.7",
111
111
  "vaul": "^1.1.2",
112
- "@oneplatformdev/tokens": "^0.1.99-beta.272",
113
- "@oneplatformdev/utils": "^0.1.99-beta.272",
114
- "@oneplatformdev/hooks": "^0.1.99-beta.272"
112
+ "@oneplatformdev/tokens": "^0.1.99-beta.273",
113
+ "@oneplatformdev/hooks": "^0.1.99-beta.273",
114
+ "@oneplatformdev/utils": "^0.1.99-beta.273"
115
115
  },
116
116
  "scripts": {
117
117
  "chromatic": "chromatic"