@xiping/react-components 1.0.11 → 1.0.13
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 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),m=require("@heroui/modal"),S=require("@heroui/spinner"),p=require("react-icons/io5"),z=require("../pinch-content/PinchContent.js"),L=require("@radix-ui/react-scroll-area"),f=require("react"),O=require("clsx");function q(t){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const s in t)if(s!=="default"){const a=Object.getOwnPropertyDescriptor(t,s);Object.defineProperty(o,s,a.get?a:{enumerable:!0,get:()=>t[s]})}}return o.default=t,Object.freeze(o)}const i=q(L),x=t=>{t.preventDefault()},I=t=>{const{isOpen:o,onClose:s,imgSrc:a,canDownload:g=!1,wrapperClassName:j}=t,c=Array.isArray(a)?a:[a],[d,w]=f.useState(0),[v,u]=f.useState(!0),h=()=>{u(!0),s()},N=async()=>{const r=c[d];try{const k=await(await fetch(r)).blob(),b=window.URL.createObjectURL(k),l=document.createElement("a");l.href=b,l.download=r.split("/").pop()||"image",document.body.appendChild(l),l.click(),window.URL.revokeObjectURL(b),document.body.removeChild(l)}catch(n){console.error("Error downloading image:",n)}},y=()=>{u(!1)},C=()=>{u(!1)};return f.useEffect(()=>{if(o)return document.addEventListener("touchmove",x,{passive:!1}),()=>{document.removeEventListener("touchmove",x)}},[o]),e.jsx(m.Modal,{isOpen:o,size:"full",onClose:h,classNames:{wrapper:O("",j)},className:"bg-black bg-opacity-70",hideCloseButton:!0,portalContainer:document.body,children:e.jsx(m.ModalContent,{className:"overflow-hidden",children:e.jsxs("div",{className:"w-screen h-screen relative flex flex-col pt-safe-offset-0",children:[e.jsxs("div",{className:"absolute top-2 right-2 flex gap-4 z-10",children:[g&&e.jsx(p.IoDownloadOutline,{size:24,className:"text-white cursor-pointer",onClick:N}),e.jsx(p.IoCloseSharp,{size:24,className:"text-white cursor-pointer",onClick:h})]}),e.jsxs("div",{className:"flex-1 min-h-0 relative flex items-center justify-center",children:[e.jsx(z.default,{canRotate:!1,className:"w-full h-full",children:e.jsx("img",{draggable:"false",src:c[d],alt:"",className:"w-screen h-full object-contain pointer-events-none",onLoad:y,onError:C})}),v&&e.jsx("div",{className:"absolute inset-0 flex items-center justify-center bg-black bg-opacity-50",children:e.jsx(S.Spinner,{color:"white",size:"lg"})})]}),c.length>1&&e.jsx("div",{className:"h-24 bg-black bg-opacity-50 shrink-0 z-10 pb-safe-offset-0 pl-safe-offset-0 pr-safe-offset-0",children:e.jsxs(i.Root,{className:"h-24 w-screen",type:"auto",children:[e.jsx(i.Viewport,{className:"pppp h-full w-full",children:e.jsx("div",{className:"flex gap-2 p-2 h-24",children:c.map((r,n)=>e.jsx("div",{className:`h-full aspect-square flex-shrink-0 cursor-pointer border-2 transition-all ${n===d?"border-white":"border-transparent"}`,onClick:()=>w(n),children:e.jsx("img",{src:r,alt:"",className:"w-full h-full object-contain",draggable:"false"})},r))})}),e.jsx(i.Scrollbar,{className:"flex select-none touch-none p-0.5 bg-black/50 transition-colors duration-150 ease-out hover:bg-black/80 data-[orientation=horizontal]:h-2.5 data-[orientation=vertical]:w-2.5 data-[orientation=horizontal]:flex-col",orientation:"horizontal",children:e.jsx(i.Thumb,{className:"flex-1 bg-white/50 rounded-[10px] relative before:content-[''] before:absolute before:top-1/2 before:left-1/2 before:-translate-x-1/2 before:-translate-y-1/2 before:w-full before:h-full before:min-w-[44px] before:min-h-[44px]"})})]})})]})})})};exports.default=I;
|
|
@@ -1,75 +1,94 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as e, jsxs as l } from "react/jsx-runtime";
|
|
3
|
-
import { Modal as
|
|
4
|
-
import { Spinner as
|
|
5
|
-
import { IoDownloadOutline as
|
|
6
|
-
import
|
|
3
|
+
import { Modal as L, ModalContent as z } from "@heroui/modal";
|
|
4
|
+
import { Spinner as j } from "@heroui/spinner";
|
|
5
|
+
import { IoDownloadOutline as I, IoCloseSharp as E } from "react-icons/io5";
|
|
6
|
+
import R from "../pinch-content/PinchContent.js";
|
|
7
7
|
import * as n from "@radix-ui/react-scroll-area";
|
|
8
|
-
import { useState as
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
8
|
+
import { useState as p, useEffect as S } from "react";
|
|
9
|
+
import D from "clsx";
|
|
10
|
+
const u = (s) => {
|
|
11
|
+
s.preventDefault();
|
|
12
|
+
}, G = (s) => {
|
|
13
|
+
const {
|
|
14
|
+
isOpen: i,
|
|
15
|
+
onClose: b,
|
|
16
|
+
imgSrc: c,
|
|
17
|
+
canDownload: g = !1,
|
|
18
|
+
wrapperClassName: w
|
|
19
|
+
} = s, r = Array.isArray(c) ? c : [c], [f, v] = p(0), [x, d] = p(!0), m = () => {
|
|
20
|
+
d(!0), b();
|
|
21
|
+
}, N = async () => {
|
|
22
|
+
const o = r[f];
|
|
14
23
|
try {
|
|
15
|
-
const
|
|
16
|
-
|
|
17
|
-
} catch (
|
|
18
|
-
console.error("Error downloading image:",
|
|
24
|
+
const k = await (await fetch(o)).blob(), h = window.URL.createObjectURL(k), a = document.createElement("a");
|
|
25
|
+
a.href = h, a.download = o.split("/").pop() || "image", document.body.appendChild(a), a.click(), window.URL.revokeObjectURL(h), document.body.removeChild(a);
|
|
26
|
+
} catch (t) {
|
|
27
|
+
console.error("Error downloading image:", t);
|
|
19
28
|
}
|
|
20
|
-
},
|
|
21
|
-
|
|
22
|
-
},
|
|
23
|
-
|
|
29
|
+
}, C = () => {
|
|
30
|
+
d(!1);
|
|
31
|
+
}, y = () => {
|
|
32
|
+
d(!1);
|
|
24
33
|
};
|
|
25
|
-
return
|
|
26
|
-
|
|
34
|
+
return S(() => {
|
|
35
|
+
if (i)
|
|
36
|
+
return document.addEventListener("touchmove", u, {
|
|
37
|
+
passive: !1
|
|
38
|
+
}), () => {
|
|
39
|
+
document.removeEventListener("touchmove", u);
|
|
40
|
+
};
|
|
41
|
+
}, [i]), /* @__PURE__ */ e(
|
|
42
|
+
L,
|
|
27
43
|
{
|
|
28
|
-
isOpen:
|
|
44
|
+
isOpen: i,
|
|
29
45
|
size: "full",
|
|
30
|
-
onClose:
|
|
46
|
+
onClose: m,
|
|
47
|
+
classNames: {
|
|
48
|
+
wrapper: D("", w)
|
|
49
|
+
},
|
|
31
50
|
className: "bg-black bg-opacity-70",
|
|
32
51
|
hideCloseButton: !0,
|
|
33
52
|
portalContainer: document.body,
|
|
34
|
-
children: /* @__PURE__ */ e(
|
|
53
|
+
children: /* @__PURE__ */ e(z, { className: "overflow-hidden", children: /* @__PURE__ */ l("div", { className: "w-screen h-screen relative flex flex-col pt-safe-offset-0", children: [
|
|
35
54
|
/* @__PURE__ */ l("div", { className: "absolute top-2 right-2 flex gap-4 z-10", children: [
|
|
36
|
-
|
|
37
|
-
|
|
55
|
+
g && /* @__PURE__ */ e(
|
|
56
|
+
I,
|
|
38
57
|
{
|
|
39
58
|
size: 24,
|
|
40
59
|
className: "text-white cursor-pointer",
|
|
41
|
-
onClick:
|
|
60
|
+
onClick: N
|
|
42
61
|
}
|
|
43
62
|
),
|
|
44
63
|
/* @__PURE__ */ e(
|
|
45
|
-
|
|
64
|
+
E,
|
|
46
65
|
{
|
|
47
66
|
size: 24,
|
|
48
67
|
className: "text-white cursor-pointer",
|
|
49
|
-
onClick:
|
|
68
|
+
onClick: m
|
|
50
69
|
}
|
|
51
70
|
)
|
|
52
71
|
] }),
|
|
53
72
|
/* @__PURE__ */ l("div", { className: "flex-1 min-h-0 relative flex items-center justify-center", children: [
|
|
54
|
-
/* @__PURE__ */ e(
|
|
73
|
+
/* @__PURE__ */ e(R, { canRotate: !1, className: "w-full h-full", children: /* @__PURE__ */ e(
|
|
55
74
|
"img",
|
|
56
75
|
{
|
|
57
76
|
draggable: "false",
|
|
58
|
-
src: r[
|
|
77
|
+
src: r[f],
|
|
59
78
|
alt: "",
|
|
60
79
|
className: "w-screen h-full object-contain pointer-events-none",
|
|
61
|
-
onLoad:
|
|
62
|
-
onError:
|
|
80
|
+
onLoad: C,
|
|
81
|
+
onError: y
|
|
63
82
|
}
|
|
64
83
|
) }),
|
|
65
|
-
|
|
84
|
+
x && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center bg-black bg-opacity-50", children: /* @__PURE__ */ e(j, { color: "white", size: "lg" }) })
|
|
66
85
|
] }),
|
|
67
86
|
r.length > 1 && /* @__PURE__ */ e("div", { className: "h-24 bg-black bg-opacity-50 shrink-0 z-10 pb-safe-offset-0 pl-safe-offset-0 pr-safe-offset-0", children: /* @__PURE__ */ l(n.Root, { className: "h-24 w-screen", type: "auto", children: [
|
|
68
|
-
/* @__PURE__ */ e(n.Viewport, { className: "pppp h-full w-full", children: /* @__PURE__ */ e("div", { className: "flex gap-2 p-2 h-24", children: r.map((o,
|
|
87
|
+
/* @__PURE__ */ e(n.Viewport, { className: "pppp h-full w-full", children: /* @__PURE__ */ e("div", { className: "flex gap-2 p-2 h-24", children: r.map((o, t) => /* @__PURE__ */ e(
|
|
69
88
|
"div",
|
|
70
89
|
{
|
|
71
|
-
className: `h-full aspect-square flex-shrink-0 cursor-pointer border-2 transition-all ${
|
|
72
|
-
onClick: () =>
|
|
90
|
+
className: `h-full aspect-square flex-shrink-0 cursor-pointer border-2 transition-all ${t === f ? "border-white" : "border-transparent"}`,
|
|
91
|
+
onClick: () => v(t),
|
|
73
92
|
children: /* @__PURE__ */ e(
|
|
74
93
|
"img",
|
|
75
94
|
{
|
|
@@ -96,5 +115,5 @@ const D = (h) => {
|
|
|
96
115
|
);
|
|
97
116
|
};
|
|
98
117
|
export {
|
|
99
|
-
|
|
118
|
+
G as default
|
|
100
119
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xiping/react-components",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.13",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/cjs/index.js",
|
|
7
7
|
"module": "./dist/es/index.js",
|
|
@@ -33,9 +33,9 @@
|
|
|
33
33
|
"react-dom": ">=18 || >= 19"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@heroui/button": "^2.2.
|
|
37
|
-
"@heroui/modal": "^2.2.
|
|
38
|
-
"@heroui/spinner": "^2.2.
|
|
36
|
+
"@heroui/button": "^2.2.21",
|
|
37
|
+
"@heroui/modal": "^2.2.18",
|
|
38
|
+
"@heroui/spinner": "^2.2.18",
|
|
39
39
|
"@monaco-editor/react": "4.7.0",
|
|
40
40
|
"@nextui-org/theme": "^2.4.5",
|
|
41
41
|
"@radix-ui/react-scroll-area": "^1.2.9",
|
|
@@ -43,12 +43,12 @@
|
|
|
43
43
|
"@use-gesture/react": "^10.3.1",
|
|
44
44
|
"@xiping/llm-utils": "1.0.10",
|
|
45
45
|
"ahooks": "^3.8.5",
|
|
46
|
-
"axios": "^1.
|
|
46
|
+
"axios": "^1.10.0",
|
|
47
47
|
"class-variance-authority": "^0.7.1",
|
|
48
48
|
"clsx": "^2.1.1",
|
|
49
49
|
"dayjs": "^1.11.13",
|
|
50
50
|
"lodash-es": "^4.17.21",
|
|
51
|
-
"motion": "^12.
|
|
51
|
+
"motion": "^12.17.0",
|
|
52
52
|
"qrcode.react": "^4.2.0",
|
|
53
53
|
"react": "^18.3.1",
|
|
54
54
|
"react-dom": "^18.3.1",
|
|
@@ -56,38 +56,38 @@
|
|
|
56
56
|
"react-icons": "^5.5.0",
|
|
57
57
|
"react-markdown": "^10.1.0",
|
|
58
58
|
"react-resizable-panels": "^2.1.9",
|
|
59
|
-
"react-router-dom": "^7.6.
|
|
59
|
+
"react-router-dom": "^7.6.2",
|
|
60
60
|
"zustand": "^5.0.5"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
63
|
"@chromatic-com/storybook": "^4.0.0",
|
|
64
|
-
"@eslint/js": "^9.
|
|
64
|
+
"@eslint/js": "^9.29.0",
|
|
65
65
|
"@faker-js/faker": "^9.8.0",
|
|
66
|
-
"@storybook/addon-docs": "9.0.
|
|
67
|
-
"@storybook/addon-onboarding": "^9.0.
|
|
68
|
-
"@storybook/react-vite": "^9.0.
|
|
66
|
+
"@storybook/addon-docs": "^9.0.10",
|
|
67
|
+
"@storybook/addon-onboarding": "^9.0.9",
|
|
68
|
+
"@storybook/react-vite": "^9.0.9",
|
|
69
69
|
"@types/lodash-es": "^4.17.12",
|
|
70
|
-
"@types/node": "^22.15.
|
|
70
|
+
"@types/node": "^22.15.31",
|
|
71
71
|
"@types/react": "^18.3.23",
|
|
72
72
|
"@types/react-dom": "^18.3.7",
|
|
73
|
-
"@vitejs/plugin-react": "^4.5.
|
|
73
|
+
"@vitejs/plugin-react": "^4.5.2",
|
|
74
74
|
"autoprefixer": "^10.4.21",
|
|
75
|
-
"eslint": "^9.
|
|
75
|
+
"eslint": "^9.29.0",
|
|
76
76
|
"eslint-plugin-react-hooks": "^5.2.0",
|
|
77
77
|
"eslint-plugin-react-refresh": "^0.4.20",
|
|
78
|
-
"eslint-plugin-storybook": "^9.0.
|
|
78
|
+
"eslint-plugin-storybook": "^9.0.10",
|
|
79
79
|
"globals": "^16.2.0",
|
|
80
|
-
"postcss": "^8.5.
|
|
80
|
+
"postcss": "^8.5.5",
|
|
81
81
|
"rollup-preserve-directives": "^1.1.3",
|
|
82
82
|
"sharp": "^0.34.2",
|
|
83
|
-
"storybook": "^9.0.
|
|
83
|
+
"storybook": "^9.0.9",
|
|
84
84
|
"svgo": "^3.3.2",
|
|
85
85
|
"tailwind-merge": "^2.6.0",
|
|
86
86
|
"tailwind-scrollbar": "^3.1.0",
|
|
87
87
|
"tailwindcss": "^3.4.17",
|
|
88
88
|
"tailwindcss-safe-area": "^0.6.0",
|
|
89
89
|
"typescript": "^5.8.3",
|
|
90
|
-
"typescript-eslint": "^8.
|
|
90
|
+
"typescript-eslint": "^8.34.0",
|
|
91
91
|
"vite": "^6.3.5",
|
|
92
92
|
"vite-plugin-dts": "^4.5.4",
|
|
93
93
|
"vite-plugin-image-optimizer": "^1.1.8",
|
|
@@ -102,5 +102,5 @@
|
|
|
102
102
|
"engines": {
|
|
103
103
|
"node": ">=20"
|
|
104
104
|
},
|
|
105
|
-
"gitHead": "
|
|
105
|
+
"gitHead": "2241fd579443d54339afba75c192a73d68f9043e"
|
|
106
106
|
}
|