solid-tom-ui 0.2.0 → 0.2.2
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.
- package/README.md +49 -98
- package/dist/components/image-preview/image-preview.d.ts.map +1 -1
- package/dist/components/image-preview/image-preview.js +1 -1
- package/dist/components/image-preview/image-preview.js.map +1 -1
- package/dist/lib.d.ts +0 -1
- package/dist/lib.d.ts.map +1 -1
- package/dist/lib.js +1 -1
- package/package.json +2 -2
- package/dist/components/blank/blank.js +0 -2
- package/dist/components/blank/blank.js.map +0 -1
package/README.md
CHANGED
|
@@ -17,12 +17,16 @@ Built on **Tailwind CSS 4** and **DaisyUI 5**, leveraging SolidJS fine-grained r
|
|
|
17
17
|
|
|
18
18
|
```bash
|
|
19
19
|
npm install solid-tom-ui
|
|
20
|
+
|
|
21
|
+
pnpm i solid-tom-ui
|
|
22
|
+
|
|
23
|
+
bun i solid-tom-ui
|
|
20
24
|
```
|
|
21
25
|
|
|
22
26
|
### Peer dependencies
|
|
23
27
|
|
|
24
28
|
```bash
|
|
25
|
-
npm install solid-js
|
|
29
|
+
npm install solid-js
|
|
26
30
|
```
|
|
27
31
|
|
|
28
32
|
Optional (only needed for specific components):
|
|
@@ -42,7 +46,17 @@ Optional (only needed for specific components):
|
|
|
42
46
|
@import 'solid-tom-ui/styles';
|
|
43
47
|
```
|
|
44
48
|
|
|
45
|
-
|
|
49
|
+
Make sure this CSS file is imported in your app entry point:
|
|
50
|
+
|
|
51
|
+
```tsx
|
|
52
|
+
// src/index.tsx
|
|
53
|
+
import './app.css';
|
|
54
|
+
import { render } from 'solid-js/web';
|
|
55
|
+
import App from './App';
|
|
56
|
+
|
|
57
|
+
render(() => <App />, document.getElementById('root')!);
|
|
58
|
+
```
|
|
59
|
+
---
|
|
46
60
|
|
|
47
61
|
### 2. Use components
|
|
48
62
|
|
|
@@ -60,38 +74,47 @@ function App() {
|
|
|
60
74
|
|
|
61
75
|
---
|
|
62
76
|
|
|
63
|
-
|
|
77
|
+
## Advanced Setup (Custom Theme)
|
|
64
78
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
```bash
|
|
68
|
-
npm install tailwindcss daisyui
|
|
69
|
-
```
|
|
79
|
+
Overwrite css variable
|
|
70
80
|
|
|
71
81
|
```css
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
82
|
+
:root {
|
|
83
|
+
--color-base-100: white;
|
|
84
|
+
--color-base-content: black;
|
|
75
85
|
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
```
|
|
86
|
+
--color-primary: red;
|
|
87
|
+
--color-primary-content: white;
|
|
79
88
|
|
|
80
|
-
|
|
89
|
+
--color-secondary: red;
|
|
90
|
+
--color-secondary-content: white;
|
|
91
|
+
|
|
92
|
+
--color-accent: red;
|
|
93
|
+
--color-accent-content: white;
|
|
81
94
|
|
|
82
|
-
|
|
95
|
+
--color-neutral: red;
|
|
96
|
+
--color-neutral-content: white;
|
|
83
97
|
|
|
84
|
-
|
|
98
|
+
--color-info: red;
|
|
99
|
+
--color-info-content: white;
|
|
85
100
|
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
| `solidUi` | Light (default) | `data-theme="solidUi"` |
|
|
89
|
-
| `dim` | Dark (prefers-dark) | `data-theme="dim"` |
|
|
101
|
+
--color-success: red;
|
|
102
|
+
--color-success-content: white;
|
|
90
103
|
|
|
91
|
-
|
|
104
|
+
--color-warning: red;
|
|
105
|
+
--color-warning-content: white;
|
|
92
106
|
|
|
93
|
-
|
|
94
|
-
|
|
107
|
+
--color-error: red;
|
|
108
|
+
--color-error-content: white;
|
|
109
|
+
--radius-selector: 8px;
|
|
110
|
+
--radius-field: 4px;
|
|
111
|
+
--radius-box: 6px;
|
|
112
|
+
--size-selector: 4px;
|
|
113
|
+
--size-field: 4px;
|
|
114
|
+
--border: 1px;
|
|
115
|
+
--depth: 0;
|
|
116
|
+
--noise: 0;
|
|
117
|
+
}
|
|
95
118
|
```
|
|
96
119
|
|
|
97
120
|
---
|
|
@@ -162,7 +185,7 @@ document.documentElement.setAttribute('data-theme', 'dim');
|
|
|
162
185
|
### Utilities
|
|
163
186
|
| Component | Description |
|
|
164
187
|
|-----------|-------------|
|
|
165
|
-
| `
|
|
188
|
+
| `CodePreview` | Code preview |
|
|
166
189
|
|
|
167
190
|
---
|
|
168
191
|
|
|
@@ -201,78 +224,6 @@ Every component exposes a `class` prop to override individual slots:
|
|
|
201
224
|
/>
|
|
202
225
|
```
|
|
203
226
|
|
|
204
|
-
### Utilities
|
|
205
|
-
|
|
206
|
-
```tsx
|
|
207
|
-
import { cn, getColor, renderCSSAnimation, createThrottle } from 'solid-tom-ui';
|
|
208
|
-
|
|
209
|
-
// Tailwind class merging
|
|
210
|
-
cn('btn btn-primary', isActive && 'btn-active', props.class);
|
|
211
|
-
|
|
212
|
-
// Get DaisyUI color class
|
|
213
|
-
getColor('primary'); // → 'color-primary'
|
|
214
|
-
```
|
|
215
|
-
|
|
216
|
-
## Toast
|
|
217
|
-
|
|
218
|
-
```tsx
|
|
219
|
-
import { toast, Toaster } from 'solid-tom-ui';
|
|
220
|
-
|
|
221
|
-
// Add <Toaster /> once at the app root
|
|
222
|
-
function App() {
|
|
223
|
-
return (
|
|
224
|
-
<>
|
|
225
|
-
<Toaster />
|
|
226
|
-
<MyPage />
|
|
227
|
-
</>
|
|
228
|
-
);
|
|
229
|
-
}
|
|
230
|
-
|
|
231
|
-
// Use anywhere
|
|
232
|
-
toast.success('Saved!');
|
|
233
|
-
toast.error('Something went wrong', { duration: 5000 });
|
|
234
|
-
toast.info('New update available');
|
|
235
|
-
toast.warning('Disk space low');
|
|
236
|
-
toast('Custom message', { color: 'accent' });
|
|
237
|
-
```
|
|
238
|
-
|
|
239
|
-
## Table
|
|
240
|
-
|
|
241
|
-
The `Table` component supports virtual scrolling, column pinning, sort, filter, expandable rows, and pagination via `@tanstack/solid-table`.
|
|
242
|
-
|
|
243
|
-
```tsx
|
|
244
|
-
import { Table } from 'solid-tom-ui';
|
|
245
|
-
import { createSolidTable, getCoreRowModel } from '@tanstack/solid-table';
|
|
246
|
-
|
|
247
|
-
const table = createSolidTable({
|
|
248
|
-
get data() { return rows(); },
|
|
249
|
-
columns,
|
|
250
|
-
getCoreRowModel: getCoreRowModel(),
|
|
251
|
-
});
|
|
252
|
-
|
|
253
|
-
<Table table={table} height={400} />
|
|
254
|
-
```
|
|
255
|
-
|
|
256
|
-
## Input variants
|
|
257
|
-
|
|
258
|
-
```tsx
|
|
259
|
-
import {
|
|
260
|
-
InputText,
|
|
261
|
-
InputPassword,
|
|
262
|
-
InputNumber,
|
|
263
|
-
InputTextarea,
|
|
264
|
-
InputOTP,
|
|
265
|
-
InputRange,
|
|
266
|
-
InputColor,
|
|
267
|
-
InputDate,
|
|
268
|
-
} from 'solid-tom-ui';
|
|
269
|
-
|
|
270
|
-
<InputText placeholder="Name" />
|
|
271
|
-
<InputPassword placeholder="Password" />
|
|
272
|
-
<InputNumber min={0} max={100} />
|
|
273
|
-
<InputOTP length={6} onComplete={code => verify(code)} />
|
|
274
|
-
```
|
|
275
|
-
|
|
276
227
|
## TypeScript
|
|
277
228
|
|
|
278
229
|
All prop types are exported:
|
|
@@ -283,4 +234,4 @@ import type { ButtonProps, ModalProps, BaseColorProps, SolidComponent } from 'so
|
|
|
283
234
|
|
|
284
235
|
## License
|
|
285
236
|
|
|
286
|
-
MIT © [
|
|
237
|
+
MIT © [Truong Tom](https://github.com/truongtom1993)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image-preview.d.ts","sourceRoot":"","sources":["../../../src/components/image-preview/image-preview.tsx"],"names":[],"mappings":"AAaA,KAAK,sBAAsB,GAAG;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC1B,UAAU,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,sBAAsB,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AA8BF,wBAAgB,YAAY,CAAC,CAAC,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"image-preview.d.ts","sourceRoot":"","sources":["../../../src/components/image-preview/image-preview.tsx"],"names":[],"mappings":"AAaA,KAAK,sBAAsB,GAAG;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC1B,UAAU,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,sBAAsB,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AA8BF,wBAAgB,YAAY,CAAC,CAAC,EAAE,iBAAiB,kCAqQhD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{cn as e}from"../../utils/cn.js";import{ZIndexType as t}from"../z-index/z-index.types.js";import{ZIndex as n}from"../z-index/z-index.js";import{x_default as r}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/x.js";import{flip_horizontal_2_default as i}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/flip-horizontal-2.js";import{flip_vertical_2_default as a}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/flip-vertical-2.js";import{info_default as o}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/info.js";import{maximize_2_default as s}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/maximize-2.js";import{rotate_ccw_default as c}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/rotate-ccw.js";import{rotate_cw_default as l}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/rotate-cw.js";import{zoom_in_default as u}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/zoom-in.js";import{zoom_out_default as d}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/zoom-out.js";import{addEventListener as f,className as p,createComponent as m,delegateEvents as h,effect as g,insert as _,memo as v,setAttribute as y,setStyleProperty as ee,template as b,use as x}from"solid-js/web";import{Show as S,createSignal as C,mergeProps as w,onCleanup as T,onMount as E}from"solid-js";var D=b(`<div class="flex items-start gap-2"><span class="w-24 shrink-0 text-white/40"></span><span class="min-w-0 break-all text-white/90">`),O=b(`<div class=img07>`),k=b(`<div><p class="mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase">
|
|
1
|
+
import{cn as e}from"../../utils/cn.js";import{ZIndexType as t}from"../z-index/z-index.types.js";import{ZIndex as n}from"../z-index/z-index.js";import{x_default as r}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/x.js";import{flip_horizontal_2_default as i}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/flip-horizontal-2.js";import{flip_vertical_2_default as a}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/flip-vertical-2.js";import{info_default as o}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/info.js";import{maximize_2_default as s}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/maximize-2.js";import{rotate_ccw_default as c}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/rotate-ccw.js";import{rotate_cw_default as l}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/rotate-cw.js";import{zoom_in_default as u}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/zoom-in.js";import{zoom_out_default as d}from"../../node_modules/.pnpm/lucide-solid@1.8.0_solid-js@1.9.11/node_modules/lucide-solid/dist/source/icons/zoom-out.js";import{addEventListener as f,className as p,createComponent as m,delegateEvents as h,effect as g,insert as _,memo as v,setAttribute as y,setStyleProperty as ee,template as b,use as x}from"solid-js/web";import{Show as S,createSignal as C,mergeProps as w,onCleanup as T,onMount as E}from"solid-js";var D=b(`<div class="flex items-start gap-2"><span class="w-24 shrink-0 text-white/40"></span><span class="min-w-0 break-all text-white/90">`),O=b(`<div class=img07>`),k=b(`<div><p class="mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase">Image Info</p><div class="flex flex-col gap-1.5 text-xs">`),A=b(`<div class=relative><button title="Image info">`),j=b(`<div><button></button><div><img></div><div><button title="Flip vertically"></button><button title="Flip horizontally"></button><div class=img07></div><button title="Rotate counter-clockwise"></button><button title="Rotate clockwise"></button><div class=img07></div><button title="Zoom out"></button><span>%</span><button title="Zoom in"></button><div class=img07></div><button title="Reset to 100%">`),M=.25,N=.25,P=4;function F(e){if(!e)return;let t=e instanceof Date?e:new Date(e);return isNaN(t.getTime())?String(e):t.toLocaleString(`en-US`,{day:`2-digit`,month:`2-digit`,year:`numeric`,hour:`2-digit`,minute:`2-digit`})}function I(e){return m(S,{get when(){return e.value},get children(){var t=D(),n=t.firstChild,r=n.nextSibling;return _(n,()=>e.label),_(r,()=>e.value),t}})}function L(h){h=w({closeOnBackdrop:!1,closeOnEsc:!0},h);let[b,D]=C(0),[L,R]=C(!1),[z,B]=C(!1),[V,H]=C(1),[U,W]=C(0),[te,G]=C(0),[K,ne]=C(!1),[q,re]=C(!1),[J,ie]=C(null),Y=0,ae=0,oe=0,se=0,ce=()=>V()>1,le=()=>{let e=L()?-V():V(),t=z()?-V():V();return`translate(${U()}px, ${te()}px) rotate(${b()}deg) scale(${e}, ${t})`},ue=()=>H(e=>Math.min(+(e+M).toFixed(2),P)),de=()=>{let e=Math.max(+(V()-M).toFixed(2),N);H(e),e<=1&&(W(0),G(0))},fe=()=>{H(1),W(0),G(0)},pe=()=>{D(e=>e+90),W(0),G(0)},me=()=>{D(e=>e-90),W(0),G(0)},he=()=>R(e=>!e),ge=()=>B(e=>!e),_e=e=>{ce()&&(e.preventDefault(),e.currentTarget.setPointerCapture(e.pointerId),ne(!0),Y=e.clientX,ae=e.clientY,oe=U(),se=te())},ve=e=>{K()&&(W(oe+e.clientX-Y),G(se+e.clientY-ae))},ye=()=>ne(!1),X,Z,Q,$;E(()=>{let e=e=>{e.preventDefault();let t=e.deltaY<0?M:-M,n=V(),r=Math.min(Math.max(+(n+t).toFixed(2),N),P);if(r===n)return;let i=Z.getBoundingClientRect(),a=e.clientX-i.left-i.width/2,o=e.clientY-i.top-i.height/2,s=r/n-1;H(r),W(e=>e-(a-e)*s),G(e=>e-(o-e)*s),r<=1&&(W(0),G(0))},t=e=>{e.key===`Escape`&&(h.closeOnEsc??!0)&&(e.stopImmediatePropagation(),h.onClose())},n=e=>{if(!q())return;let t=e.target;!Q?.contains(t)&&!$?.contains(t)&&re(!1)},r=e=>e.preventDefault();X.addEventListener(`wheel`,r,{passive:!1}),Z.addEventListener(`wheel`,e,{passive:!1}),document.addEventListener(`pointerdown`,n),document.addEventListener(`keydown`,t,{capture:!0}),T(function(){X.removeEventListener(`wheel`,r),Z.removeEventListener(`wheel`,e),document.removeEventListener(`pointerdown`,n),document.removeEventListener(`keydown`,t,{capture:!0})})});let be=()=>!!(h.imageName||h.size||h.createdAt||h.modifiedAt);return m(n,{open:!0,get type(){return t.MODAL},blockScroll:!0,positioning:`fixed`,preRender:!1,get customValue(){return h.zIndex},class:`inset-0`,get children(){var t=j(),n=t.firstChild,b=n.nextSibling,C=b.firstChild,w=b.nextSibling,T=w.firstChild,E=T.nextSibling,D=E.nextSibling.nextSibling,M=D.nextSibling,L=M.nextSibling.nextSibling,R=L.nextSibling,z=R.firstChild,B=R.nextSibling,H=B.nextSibling.nextSibling;f(t,`click`,h.closeOnBackdrop?h.onClose:void 0,!0);var U=X;typeof U==`function`?x(U,t):X=t,f(n,`click`,h.onClose,!0),_(n,m(r,{size:20})),b.addEventListener(`pointercancel`,ye),b.$$pointerup=ye,b.$$pointermove=ve,b.$$pointerdown=_e,b.$$click=e=>e.stopPropagation();var W=Z;return typeof W==`function`?x(W,b):Z=b,C.addEventListener(`load`,e=>{let t=e.currentTarget;ie({w:t.naturalWidth,h:t.naturalHeight})}),y(C,`draggable`,!1),w.$$click=e=>e.stopPropagation(),T.$$click=ge,_(T,m(a,{size:16})),E.$$click=he,_(E,m(i,{size:16})),D.$$click=me,_(D,m(c,{size:16})),M.$$click=pe,_(M,m(l,{size:16})),L.$$click=de,_(L,m(d,{size:16})),_(R,()=>Math.round(V()*100),z),B.$$click=ue,_(B,m(u,{size:16})),H.$$click=fe,_(H,m(s,{size:16})),_(w,m(S,{get when(){return be()},get children(){return[O(),(()=>{var t=A(),n=t.firstChild;n.$$click=()=>re(e=>!e);var r=$;return typeof r==`function`?x(r,n):$=n,_(n,m(o,{size:16})),_(t,m(S,{get when(){return q()},get children(){var t=k(),n=t.firstChild.nextSibling,r=Q;return typeof r==`function`?x(r,t):Q=t,_(n,m(I,{label:`File name`,get value(){return h.imageName}}),null),_(n,m(I,{label:`Size`,get value(){return h.size}}),null),_(n,m(I,{label:`Dimension`,get value(){return v(()=>!!J())()?`${J().w} × ${J().h} px`:void 0}}),null),_(n,m(I,{label:`Created`,get value(){return F(h.createdAt)}}),null),_(n,m(I,{label:`Modified`,get value(){return F(h.modifiedAt)}}),null),g(()=>p(t,e(`img09`,h.class?.infoPopup))),t}}),null),g(()=>p(n,e(`img06`,q()&&`bg-white/20 text-white`,h.class?.toolBtn))),t})()]}}),null),g(r=>{var i=e(`img01`,h.class?.backdrop),a=e(`img02`,h.class?.close),o=e(`img03`,ce()&&(K()?`cursor-grabbing`:`cursor-grab`),h.class?.box),s=h.src,c=h.imageName,l=e(`img04`,K()&&`img04--drag`,h.class?.img),u=le(),d=e(`img05`,h.class?.toolbar),f=e(`img06`,h.class?.toolBtn),m=e(`img06`,h.class?.toolBtn),g=e(`img06`,h.class?.toolBtn),_=e(`img06`,h.class?.toolBtn),v=e(`img06`,h.class?.toolBtn),x=V()<=N,S=e(`img08`,h.class?.zoomLabel),O=e(`img06`,h.class?.toolBtn),k=V()>=P,A=e(`img06`,h.class?.toolBtn),j=V()===1;return i!==r.e&&p(t,r.e=i),a!==r.t&&p(n,r.t=a),o!==r.a&&p(b,r.a=o),s!==r.o&&y(C,`src`,r.o=s),c!==r.i&&y(C,`alt`,r.i=c),l!==r.n&&p(C,r.n=l),u!==r.s&&ee(C,`transform`,r.s=u),d!==r.h&&p(w,r.h=d),f!==r.r&&p(T,r.r=f),m!==r.d&&p(E,r.d=m),g!==r.l&&p(D,r.l=g),_!==r.u&&p(M,r.u=_),v!==r.c&&p(L,r.c=v),x!==r.w&&(L.disabled=r.w=x),S!==r.m&&p(R,r.m=S),O!==r.f&&p(B,r.f=O),k!==r.y&&(B.disabled=r.y=k),A!==r.g&&p(H,r.g=A),j!==r.p&&(H.disabled=r.p=j),r},{e:void 0,t:void 0,a:void 0,o:void 0,i:void 0,n:void 0,s:void 0,h:void 0,r:void 0,d:void 0,l:void 0,u:void 0,c:void 0,w:void 0,m:void 0,f:void 0,y:void 0,g:void 0,p:void 0}),t}})}h([`click`,`pointerdown`,`pointermove`,`pointerup`]);export{L as ImagePreview};
|
|
2
2
|
//# sourceMappingURL=image-preview.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image-preview.js","names":["cn","ZIndex","ZIndexType","FlipHorizontal2","FlipVertical2","Info","Maximize2","RotateCcw","RotateCw","X","ZoomIn","ZoomOut","createSignal","mergeProps","onCleanup","onMount","Show","ImagePreviewClassProps","backdrop","close","box","img","toolbar","toolBtn","zoomLabel","infoPopup","ImagePreviewProps","src","imageName","size","createdAt","Date","modifiedAt","onClose","closeOnBackdrop","closeOnEsc","class","zIndex","ZOOM_STEP","ZOOM_MIN","ZOOM_MAX","formatDate","value","undefined","d","isNaN","getTime","String","toLocaleString","day","month","year","hour","minute","InfoRow","props","label","_$createComponent","when","children","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$insert","ImagePreview","p","rotate","setRotate","flipH","setFlipH","flipV","setFlipV","scale","setScale","offsetX","setOffsetX","offsetY","setOffsetY","isDragging","setIsDragging","showInfo","setShowInfo","naturalSize","setNaturalSize","w","h","dragStartX","dragStartY","dragStartOffsetX","dragStartOffsetY","canPan","imgTransform","sx","sy","zoomIn","s","Math","min","toFixed","zoomOut","next","max","resetView","rotateCw","r","rotateCcw","doFlipH","v","doFlipV","onPointerDown","e","PointerEvent","preventDefault","currentTarget","HTMLElement","setPointerCapture","pointerId","clientX","clientY","onPointerMove","onPointerUp","backdropRef","HTMLDivElement","boxRef","infoPopupRef","infoBtnRef","HTMLButtonElement","onWheel","WheelEvent","delta","deltaY","oldScale","newScale","rect","getBoundingClientRect","cx","left","width","cy","top","height","ratio","ox","oy","onKeyDown","KeyboardEvent","key","stopImmediatePropagation","onDocPointerDown","target","Node","contains","preventScroll","addEventListener","passive","document","capture","removePreviewEventListeners","removeEventListener","hasInfo","open","type","MODAL","blockScroll","positioning","preRender","customValue","_el$4","_tmpl$5","_el$5","_el$6","_el$7","_el$8","_el$9","_el$0","_el$1","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_$addEventListener","_ref$","_$use","$$pointerup","$$pointermove","$$pointerdown","$$click","stopPropagation","_ref$2","HTMLImageElement","naturalWidth","naturalHeight","_$setAttribute","round","_tmpl$2","_el$20","_tmpl$4","_el$21","_ref$3","_el$22","_tmpl$3","_el$23","_el$24","_ref$4","_$memo","_$effect","_$className","_p$","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","_v$0","_v$1","_v$10","_v$11","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","t","a","o","i","n","_$setStyleProperty","l","u","c","disabled","m","f","y","g","_$delegateEvents"],"sources":["../../../src/components/image-preview/image-preview.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { ZIndex, ZIndexType } from '@components/z-index';\nimport FlipHorizontal2 from 'lucide-solid/icons/flip-horizontal-2';\nimport FlipVertical2 from 'lucide-solid/icons/flip-vertical-2';\nimport Info from 'lucide-solid/icons/info';\nimport Maximize2 from 'lucide-solid/icons/maximize-2';\nimport RotateCcw from 'lucide-solid/icons/rotate-ccw';\nimport RotateCw from 'lucide-solid/icons/rotate-cw';\nimport X from 'lucide-solid/icons/x';\nimport ZoomIn from 'lucide-solid/icons/zoom-in';\nimport ZoomOut from 'lucide-solid/icons/zoom-out';\nimport { createSignal, mergeProps, onCleanup, onMount, Show } from 'solid-js';\n\ntype ImagePreviewClassProps = {\n backdrop?: string;\n close?: string;\n box?: string;\n img?: string;\n toolbar?: string;\n toolBtn?: string;\n zoomLabel?: string;\n infoPopup?: string;\n};\n\nexport type ImagePreviewProps = {\n src: string;\n imageName?: string;\n size?: string;\n createdAt?: Date | string;\n modifiedAt?: Date | string;\n onClose: () => void;\n closeOnBackdrop?: boolean;\n closeOnEsc?: boolean;\n class?: ImagePreviewClassProps;\n zIndex?: number;\n};\n\nconst ZOOM_STEP = 0.25;\nconst ZOOM_MIN = 0.25;\nconst ZOOM_MAX = 4;\n\nfunction formatDate(value: Date | string | undefined): string | undefined {\n if (!value) return undefined;\n const d = value instanceof Date ? value : new Date(value);\n if (isNaN(d.getTime())) return String(value);\n return d.toLocaleString('vi-VN', {\n day: '2-digit',\n month: '2-digit',\n year: 'numeric',\n hour: '2-digit',\n minute: '2-digit',\n });\n}\n\nfunction InfoRow(props: { label: string; value: string | undefined }) {\n return (\n <Show when={props.value}>\n <div class=\"flex items-start gap-2\">\n <span class=\"w-24 shrink-0 text-white/40\">{props.label}</span>\n <span class=\"min-w-0 break-all text-white/90\">{props.value}</span>\n </div>\n </Show>\n );\n}\n\nexport function ImagePreview(p: ImagePreviewProps) {\n p = mergeProps({ closeOnBackdrop: false, closeOnEsc: true }, p);\n const [rotate, setRotate] = createSignal(0);\n const [flipH, setFlipH] = createSignal(false);\n const [flipV, setFlipV] = createSignal(false);\n const [scale, setScale] = createSignal(1);\n const [offsetX, setOffsetX] = createSignal(0);\n const [offsetY, setOffsetY] = createSignal(0);\n const [isDragging, setIsDragging] = createSignal(false);\n const [showInfo, setShowInfo] = createSignal(false);\n const [naturalSize, setNaturalSize] = createSignal<{ w: number; h: number } | null>(null);\n\n let dragStartX = 0;\n let dragStartY = 0;\n let dragStartOffsetX = 0;\n let dragStartOffsetY = 0;\n\n const canPan = () => scale() > 1;\n\n const imgTransform = () => {\n const sx = flipH() ? -scale() : scale();\n const sy = flipV() ? -scale() : scale();\n return `translate(${offsetX()}px, ${offsetY()}px) rotate(${rotate()}deg) scale(${sx}, ${sy})`;\n };\n\n const zoomIn = () => setScale(s => Math.min(+(s + ZOOM_STEP).toFixed(2), ZOOM_MAX));\n\n const zoomOut = () => {\n const next = Math.max(+(scale() - ZOOM_STEP).toFixed(2), ZOOM_MIN);\n setScale(next);\n if (next <= 1) {\n setOffsetX(0);\n setOffsetY(0);\n }\n };\n\n const resetView = () => {\n setScale(1);\n setOffsetX(0);\n setOffsetY(0);\n setRotate(0);\n setFlipH(false);\n setFlipV(false);\n };\n\n const rotateCw = () => {\n setRotate(r => r + 90);\n setOffsetX(0);\n setOffsetY(0);\n };\n const rotateCcw = () => {\n setRotate(r => r - 90);\n setOffsetX(0);\n setOffsetY(0);\n };\n const doFlipH = () => setFlipH(v => !v);\n const doFlipV = () => setFlipV(v => !v);\n\n const onPointerDown = (e: PointerEvent) => {\n if (!canPan()) return;\n e.preventDefault();\n (e.currentTarget as HTMLElement).setPointerCapture(e.pointerId);\n setIsDragging(true);\n dragStartX = e.clientX;\n dragStartY = e.clientY;\n dragStartOffsetX = offsetX();\n dragStartOffsetY = offsetY();\n };\n\n const onPointerMove = (e: PointerEvent) => {\n if (!isDragging()) return;\n setOffsetX(dragStartOffsetX + e.clientX - dragStartX);\n setOffsetY(dragStartOffsetY + e.clientY - dragStartY);\n };\n\n const onPointerUp = () => setIsDragging(false);\n\n let backdropRef!: HTMLDivElement;\n let boxRef!: HTMLDivElement;\n let infoPopupRef!: HTMLDivElement;\n let infoBtnRef!: HTMLButtonElement;\n\n onMount(() => {\n const onWheel = (e: WheelEvent) => {\n e.preventDefault();\n const delta = e.deltaY < 0 ? ZOOM_STEP : -ZOOM_STEP;\n const oldScale = scale();\n const newScale = Math.min(Math.max(+(oldScale + delta).toFixed(2), ZOOM_MIN), ZOOM_MAX);\n if (newScale === oldScale) return;\n\n const rect = boxRef.getBoundingClientRect();\n const cx = e.clientX - rect.left - rect.width / 2;\n const cy = e.clientY - rect.top - rect.height / 2;\n const ratio = newScale / oldScale - 1;\n\n setScale(newScale);\n setOffsetX(ox => ox - (cx - ox) * ratio);\n setOffsetY(oy => oy - (cy - oy) * ratio);\n\n if (newScale <= 1) {\n setOffsetX(0);\n setOffsetY(0);\n }\n };\n\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Escape' && (p.closeOnEsc ?? true)) {\n e.stopImmediatePropagation();\n p.onClose();\n }\n };\n\n const onDocPointerDown = (e: PointerEvent) => {\n if (!showInfo()) return;\n const target = e.target as Node;\n if (!infoPopupRef?.contains(target) && !infoBtnRef?.contains(target)) {\n setShowInfo(false);\n }\n };\n\n const preventScroll = (e: WheelEvent) => e.preventDefault();\n backdropRef.addEventListener('wheel', preventScroll, { passive: false });\n boxRef.addEventListener('wheel', onWheel, { passive: false });\n document.addEventListener('pointerdown', onDocPointerDown);\n document.addEventListener('keydown', onKeyDown, { capture: true });\n\n onCleanup(function removePreviewEventListeners() {\n backdropRef.removeEventListener('wheel', preventScroll);\n boxRef.removeEventListener('wheel', onWheel);\n document.removeEventListener('pointerdown', onDocPointerDown);\n document.removeEventListener('keydown', onKeyDown, { capture: true });\n });\n });\n\n const hasInfo = () => !!(p.imageName || p.size || p.createdAt || p.modifiedAt);\n\n return (\n <ZIndex\n open={true}\n type={ZIndexType.MODAL}\n blockScroll={true}\n positioning=\"fixed\"\n preRender={false}\n customValue={p.zIndex}\n class=\"inset-0\"\n >\n <div\n ref={backdropRef}\n class={cn('img01', p.class?.backdrop)}\n onClick={p.closeOnBackdrop ? p.onClose : undefined}\n >\n <button class={cn('img02', p.class?.close)} onClick={p.onClose}>\n <X size={20} />\n </button>\n\n <div\n ref={boxRef}\n class={cn(\n 'img03',\n canPan() && (isDragging() ? 'cursor-grabbing' : 'cursor-grab'),\n p.class?.box,\n )}\n onClick={e => e.stopPropagation()}\n onPointerDown={onPointerDown}\n onPointerMove={onPointerMove}\n onPointerUp={onPointerUp}\n onPointerCancel={onPointerUp}\n >\n <img\n src={p.src}\n alt={p.imageName}\n class={cn('img04', isDragging() && 'img04--drag', p.class?.img)}\n style={{ transform: imgTransform() }}\n draggable={false}\n onLoad={e => {\n const img = e.currentTarget as HTMLImageElement;\n setNaturalSize({ w: img.naturalWidth, h: img.naturalHeight });\n }}\n />\n </div>\n\n <div class={cn('img05', p.class?.toolbar)} onClick={e => e.stopPropagation()}>\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipV} title=\"Lật dọc\">\n <FlipVertical2 size={16} />\n </button>\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipH} title=\"Lật ngang\">\n <FlipHorizontal2 size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={rotateCcw}\n title=\"Xoay ngược chiều kim đồng hồ\"\n >\n <RotateCcw size={16} />\n </button>\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={rotateCw}\n title=\"Xoay thuận chiều kim đồng hồ\"\n >\n <RotateCw size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={zoomOut}\n title=\"Thu nhỏ\"\n disabled={scale() <= ZOOM_MIN}\n >\n <ZoomOut size={16} />\n </button>\n <span class={cn('img08', p.class?.zoomLabel)}>{Math.round(scale() * 100)}%</span>\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={zoomIn}\n title=\"Phóng to\"\n disabled={scale() >= ZOOM_MAX}\n >\n <ZoomIn size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={resetView}\n title=\"Reset về 100%\"\n disabled={scale() === 1 && rotate() === 0 && !flipH() && !flipV()}\n >\n <Maximize2 size={16} />\n </button>\n\n <Show when={hasInfo()}>\n <div class=\"img07\" />\n <div class=\"relative\">\n <button\n ref={infoBtnRef}\n class={cn('img06', showInfo() && 'bg-white/20 text-white', p.class?.toolBtn)}\n onClick={() => setShowInfo(v => !v)}\n title=\"Thông tin ảnh\"\n >\n <Info size={16} />\n </button>\n\n <Show when={showInfo()}>\n <div ref={infoPopupRef} class={cn('img09', p.class?.infoPopup)}>\n <p class=\"mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase\">\n Thông tin ảnh\n </p>\n <div class=\"flex flex-col gap-1.5 text-xs\">\n <InfoRow label=\"Tên file\" value={p.imageName} />\n <InfoRow label=\"Kích thước\" value={p.size} />\n <InfoRow\n label=\"Dimension\"\n value={\n naturalSize() ? `${naturalSize()!.w} × ${naturalSize()!.h} px` : undefined\n }\n />\n <InfoRow label=\"Ngày tạo\" value={formatDate(p.createdAt)} />\n <InfoRow label=\"Ngày sửa\" value={formatDate(p.modifiedAt)} />\n </div>\n </div>\n </Show>\n </div>\n </Show>\n </div>\n </div>\n </ZIndex>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"image-preview.js","names":["cn","ZIndex","ZIndexType","FlipHorizontal2","FlipVertical2","Info","Maximize2","RotateCcw","RotateCw","X","ZoomIn","ZoomOut","createSignal","mergeProps","onCleanup","onMount","Show","ImagePreviewClassProps","backdrop","close","box","img","toolbar","toolBtn","zoomLabel","infoPopup","ImagePreviewProps","src","imageName","size","createdAt","Date","modifiedAt","onClose","closeOnBackdrop","closeOnEsc","class","zIndex","ZOOM_STEP","ZOOM_MIN","ZOOM_MAX","formatDate","value","undefined","d","isNaN","getTime","String","toLocaleString","day","month","year","hour","minute","InfoRow","props","label","_$createComponent","when","children","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$insert","ImagePreview","p","rotate","setRotate","flipH","setFlipH","flipV","setFlipV","scale","setScale","offsetX","setOffsetX","offsetY","setOffsetY","isDragging","setIsDragging","showInfo","setShowInfo","naturalSize","setNaturalSize","w","h","dragStartX","dragStartY","dragStartOffsetX","dragStartOffsetY","canPan","imgTransform","sx","sy","zoomIn","s","Math","min","toFixed","zoomOut","next","max","resetView","rotateCw","r","rotateCcw","doFlipH","v","doFlipV","onPointerDown","e","PointerEvent","preventDefault","currentTarget","HTMLElement","setPointerCapture","pointerId","clientX","clientY","onPointerMove","onPointerUp","backdropRef","HTMLDivElement","boxRef","infoPopupRef","infoBtnRef","HTMLButtonElement","onWheel","WheelEvent","delta","deltaY","oldScale","newScale","rect","getBoundingClientRect","cx","left","width","cy","top","height","ratio","ox","oy","onKeyDown","KeyboardEvent","key","stopImmediatePropagation","onDocPointerDown","target","Node","contains","preventScroll","addEventListener","passive","document","capture","removePreviewEventListeners","removeEventListener","hasInfo","open","type","MODAL","blockScroll","positioning","preRender","customValue","_el$4","_tmpl$5","_el$5","_el$6","_el$7","_el$8","_el$9","_el$0","_el$1","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_$addEventListener","_ref$","_$use","$$pointerup","$$pointermove","$$pointerdown","$$click","stopPropagation","_ref$2","HTMLImageElement","naturalWidth","naturalHeight","_$setAttribute","round","_tmpl$2","_el$20","_tmpl$4","_el$21","_ref$3","_el$22","_tmpl$3","_el$23","_el$24","_ref$4","_$memo","_$effect","_$className","_p$","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_v$7","_v$8","_v$9","_v$0","_v$1","_v$10","_v$11","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","t","a","o","i","n","_$setStyleProperty","l","u","c","disabled","m","f","y","g","_$delegateEvents"],"sources":["../../../src/components/image-preview/image-preview.tsx"],"sourcesContent":["import { cn } from '@/utils/cn';\nimport { ZIndex, ZIndexType } from '@components/z-index';\nimport FlipHorizontal2 from 'lucide-solid/icons/flip-horizontal-2';\nimport FlipVertical2 from 'lucide-solid/icons/flip-vertical-2';\nimport Info from 'lucide-solid/icons/info';\nimport Maximize2 from 'lucide-solid/icons/maximize-2';\nimport RotateCcw from 'lucide-solid/icons/rotate-ccw';\nimport RotateCw from 'lucide-solid/icons/rotate-cw';\nimport X from 'lucide-solid/icons/x';\nimport ZoomIn from 'lucide-solid/icons/zoom-in';\nimport ZoomOut from 'lucide-solid/icons/zoom-out';\nimport { createSignal, mergeProps, onCleanup, onMount, Show } from 'solid-js';\n\ntype ImagePreviewClassProps = {\n backdrop?: string;\n close?: string;\n box?: string;\n img?: string;\n toolbar?: string;\n toolBtn?: string;\n zoomLabel?: string;\n infoPopup?: string;\n};\n\nexport type ImagePreviewProps = {\n src: string;\n imageName?: string;\n size?: string;\n createdAt?: Date | string;\n modifiedAt?: Date | string;\n onClose: () => void;\n closeOnBackdrop?: boolean;\n closeOnEsc?: boolean;\n class?: ImagePreviewClassProps;\n zIndex?: number;\n};\n\nconst ZOOM_STEP = 0.25;\nconst ZOOM_MIN = 0.25;\nconst ZOOM_MAX = 4;\n\nfunction formatDate(value: Date | string | undefined): string | undefined {\n if (!value) return undefined;\n const d = value instanceof Date ? value : new Date(value);\n if (isNaN(d.getTime())) return String(value);\n return d.toLocaleString('en-US', {\n day: '2-digit',\n month: '2-digit',\n year: 'numeric',\n hour: '2-digit',\n minute: '2-digit',\n });\n}\n\nfunction InfoRow(props: { label: string; value: string | undefined }) {\n return (\n <Show when={props.value}>\n <div class=\"flex items-start gap-2\">\n <span class=\"w-24 shrink-0 text-white/40\">{props.label}</span>\n <span class=\"min-w-0 break-all text-white/90\">{props.value}</span>\n </div>\n </Show>\n );\n}\n\nexport function ImagePreview(p: ImagePreviewProps) {\n p = mergeProps({ closeOnBackdrop: false, closeOnEsc: true }, p);\n const [rotate, setRotate] = createSignal(0);\n const [flipH, setFlipH] = createSignal(false);\n const [flipV, setFlipV] = createSignal(false);\n const [scale, setScale] = createSignal(1);\n const [offsetX, setOffsetX] = createSignal(0);\n const [offsetY, setOffsetY] = createSignal(0);\n const [isDragging, setIsDragging] = createSignal(false);\n const [showInfo, setShowInfo] = createSignal(false);\n const [naturalSize, setNaturalSize] = createSignal<{ w: number; h: number } | null>(null);\n\n let dragStartX = 0;\n let dragStartY = 0;\n let dragStartOffsetX = 0;\n let dragStartOffsetY = 0;\n\n const canPan = () => scale() > 1;\n\n const imgTransform = () => {\n const sx = flipH() ? -scale() : scale();\n const sy = flipV() ? -scale() : scale();\n return `translate(${offsetX()}px, ${offsetY()}px) rotate(${rotate()}deg) scale(${sx}, ${sy})`;\n };\n\n const zoomIn = () => setScale(s => Math.min(+(s + ZOOM_STEP).toFixed(2), ZOOM_MAX));\n\n const zoomOut = () => {\n const next = Math.max(+(scale() - ZOOM_STEP).toFixed(2), ZOOM_MIN);\n setScale(next);\n if (next <= 1) {\n setOffsetX(0);\n setOffsetY(0);\n }\n };\n\n const resetView = () => {\n setScale(1);\n setOffsetX(0);\n setOffsetY(0);\n };\n\n const rotateCw = () => {\n setRotate(r => r + 90);\n setOffsetX(0);\n setOffsetY(0);\n };\n const rotateCcw = () => {\n setRotate(r => r - 90);\n setOffsetX(0);\n setOffsetY(0);\n };\n const doFlipH = () => setFlipH(v => !v);\n const doFlipV = () => setFlipV(v => !v);\n\n const onPointerDown = (e: PointerEvent) => {\n if (!canPan()) return;\n e.preventDefault();\n (e.currentTarget as HTMLElement).setPointerCapture(e.pointerId);\n setIsDragging(true);\n dragStartX = e.clientX;\n dragStartY = e.clientY;\n dragStartOffsetX = offsetX();\n dragStartOffsetY = offsetY();\n };\n\n const onPointerMove = (e: PointerEvent) => {\n if (!isDragging()) return;\n setOffsetX(dragStartOffsetX + e.clientX - dragStartX);\n setOffsetY(dragStartOffsetY + e.clientY - dragStartY);\n };\n\n const onPointerUp = () => setIsDragging(false);\n\n let backdropRef!: HTMLDivElement;\n let boxRef!: HTMLDivElement;\n let infoPopupRef!: HTMLDivElement;\n let infoBtnRef!: HTMLButtonElement;\n\n onMount(() => {\n const onWheel = (e: WheelEvent) => {\n e.preventDefault();\n const delta = e.deltaY < 0 ? ZOOM_STEP : -ZOOM_STEP;\n const oldScale = scale();\n const newScale = Math.min(Math.max(+(oldScale + delta).toFixed(2), ZOOM_MIN), ZOOM_MAX);\n if (newScale === oldScale) return;\n\n const rect = boxRef.getBoundingClientRect();\n const cx = e.clientX - rect.left - rect.width / 2;\n const cy = e.clientY - rect.top - rect.height / 2;\n const ratio = newScale / oldScale - 1;\n\n setScale(newScale);\n setOffsetX(ox => ox - (cx - ox) * ratio);\n setOffsetY(oy => oy - (cy - oy) * ratio);\n\n if (newScale <= 1) {\n setOffsetX(0);\n setOffsetY(0);\n }\n };\n\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Escape' && (p.closeOnEsc ?? true)) {\n e.stopImmediatePropagation();\n p.onClose();\n }\n };\n\n const onDocPointerDown = (e: PointerEvent) => {\n if (!showInfo()) return;\n const target = e.target as Node;\n if (!infoPopupRef?.contains(target) && !infoBtnRef?.contains(target)) {\n setShowInfo(false);\n }\n };\n\n const preventScroll = (e: WheelEvent) => e.preventDefault();\n backdropRef.addEventListener('wheel', preventScroll, { passive: false });\n boxRef.addEventListener('wheel', onWheel, { passive: false });\n document.addEventListener('pointerdown', onDocPointerDown);\n document.addEventListener('keydown', onKeyDown, { capture: true });\n\n onCleanup(function removePreviewEventListeners() {\n backdropRef.removeEventListener('wheel', preventScroll);\n boxRef.removeEventListener('wheel', onWheel);\n document.removeEventListener('pointerdown', onDocPointerDown);\n document.removeEventListener('keydown', onKeyDown, { capture: true });\n });\n });\n\n const hasInfo = () => !!(p.imageName || p.size || p.createdAt || p.modifiedAt);\n\n return (\n <ZIndex\n open={true}\n type={ZIndexType.MODAL}\n blockScroll={true}\n positioning=\"fixed\"\n preRender={false}\n customValue={p.zIndex}\n class=\"inset-0\"\n >\n <div\n ref={backdropRef}\n class={cn('img01', p.class?.backdrop)}\n onClick={p.closeOnBackdrop ? p.onClose : undefined}\n >\n <button class={cn('img02', p.class?.close)} onClick={p.onClose}>\n <X size={20} />\n </button>\n\n <div\n ref={boxRef}\n class={cn(\n 'img03',\n canPan() && (isDragging() ? 'cursor-grabbing' : 'cursor-grab'),\n p.class?.box,\n )}\n onClick={e => e.stopPropagation()}\n onPointerDown={onPointerDown}\n onPointerMove={onPointerMove}\n onPointerUp={onPointerUp}\n onPointerCancel={onPointerUp}\n >\n <img\n src={p.src}\n alt={p.imageName}\n class={cn('img04', isDragging() && 'img04--drag', p.class?.img)}\n style={{ transform: imgTransform() }}\n draggable={false}\n onLoad={e => {\n const img = e.currentTarget as HTMLImageElement;\n setNaturalSize({ w: img.naturalWidth, h: img.naturalHeight });\n }}\n />\n </div>\n\n <div class={cn('img05', p.class?.toolbar)} onClick={e => e.stopPropagation()}>\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipV} title=\"Flip vertically\">\n <FlipVertical2 size={16} />\n </button>\n <button class={cn('img06', p.class?.toolBtn)} onClick={doFlipH} title=\"Flip horizontally\">\n <FlipHorizontal2 size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={rotateCcw}\n title=\"Rotate counter-clockwise\"\n >\n <RotateCcw size={16} />\n </button>\n <button class={cn('img06', p.class?.toolBtn)} onClick={rotateCw} title=\"Rotate clockwise\">\n <RotateCw size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={zoomOut}\n title=\"Zoom out\"\n disabled={scale() <= ZOOM_MIN}\n >\n <ZoomOut size={16} />\n </button>\n <span class={cn('img08', p.class?.zoomLabel)}>{Math.round(scale() * 100)}%</span>\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={zoomIn}\n title=\"Zoom in\"\n disabled={scale() >= ZOOM_MAX}\n >\n <ZoomIn size={16} />\n </button>\n <div class=\"img07\" />\n <button\n class={cn('img06', p.class?.toolBtn)}\n onClick={resetView}\n title=\"Reset to 100%\"\n disabled={scale() === 1}\n >\n <Maximize2 size={16} />\n </button>\n\n <Show when={hasInfo()}>\n <div class=\"img07\" />\n <div class=\"relative\">\n <button\n ref={infoBtnRef}\n class={cn('img06', showInfo() && 'bg-white/20 text-white', p.class?.toolBtn)}\n onClick={() => setShowInfo(v => !v)}\n title=\"Image info\"\n >\n <Info size={16} />\n </button>\n\n <Show when={showInfo()}>\n <div ref={infoPopupRef} class={cn('img09', p.class?.infoPopup)}>\n <p class=\"mb-2 text-xs font-semibold tracking-wide text-white/50 uppercase\">\n Image Info\n </p>\n <div class=\"flex flex-col gap-1.5 text-xs\">\n <InfoRow label=\"File name\" value={p.imageName} />\n <InfoRow label=\"Size\" value={p.size} />\n <InfoRow\n label=\"Dimension\"\n value={\n naturalSize() ? `${naturalSize()!.w} × ${naturalSize()!.h} px` : undefined\n }\n />\n <InfoRow label=\"Created\" value={formatDate(p.createdAt)} />\n <InfoRow label=\"Modified\" value={formatDate(p.modifiedAt)} />\n </div>\n </div>\n </Show>\n </div>\n </Show>\n </div>\n </div>\n </ZIndex>\n );\n}\n"],"mappings":"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"}
|
package/dist/lib.d.ts
CHANGED
|
@@ -2,7 +2,6 @@ export type { AnimationConfig } from './utils/helper';
|
|
|
2
2
|
export type { BaseColorProps, SolidComponent } from './type';
|
|
3
3
|
export * from './components/avatar';
|
|
4
4
|
export * from './components/badge';
|
|
5
|
-
export * from './components/blank';
|
|
6
5
|
export * from './components/breadcrumb';
|
|
7
6
|
export * from './components/button';
|
|
8
7
|
export * from './components/carousel';
|
package/dist/lib.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lib.d.ts","sourceRoot":"","sources":["../src/lib.ts"],"names":[],"mappings":"AACA,YAAY,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG7D,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,
|
|
1
|
+
{"version":3,"file":"lib.d.ts","sourceRoot":"","sources":["../src/lib.ts"],"names":[],"mappings":"AACA,YAAY,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG7D,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC"}
|
package/dist/lib.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Avatar as e}from"./components/avatar/avatar.js";import{Badge as t}from"./components/badge/badge.js";import{
|
|
1
|
+
import{Avatar as e}from"./components/avatar/avatar.js";import{Badge as t}from"./components/badge/badge.js";import{Breadcrumb as n}from"./components/breadcrumb/breadcrumb.js";import{Button as r}from"./components/button/button.js";import{Carousel as i}from"./components/carousel/carousel.js";import{ChatBubble as a}from"./components/chat-bubble/chatBubble.js";import{Checkbox as o}from"./components/checkbox/checkbox.js";import{Collapse as s}from"./components/collapse/collapse.js";import{createContextMenuHandle as c}from"./components/context-menu/context-menu.store.js";import{ContextMenu as l}from"./components/context-menu/context-menu.js";import{CODE_PREVIEW_THEMES as u,CodePreview as d}from"./components/code-preview/code-preview.js";import{Diff as f}from"./components/diff/diff.js";import{Divider as p}from"./components/divider/divider.js";import{ComponentDrawer as m,Drawer as h}from"./components/drawer/drawer.js";import{Dropdown as g}from"./components/dropdown/dropdown.js";import{FloatButton as _}from"./components/float-button/float-button.js";import{ImagePreview as v}from"./components/image-preview/image-preview.js";import{Hover3DImage as y}from"./components/hover-3d-image/hover-3d-image.js";import{Indicator as b}from"./components/indicator/indicator.js";import{Input as x}from"./components/input/input.js";import{Loading as S,Spinner as C}from"./components/loading/loading.js";import{Mansory as w}from"./components/mansory/mansory.js";import{Menu as T}from"./components/menu/menu.js";import{Modal as E}from"./components/modal/modal.js";import{closeAllModals as D,createModal as O}from"./components/modal/modalContext.js";import{Select as k}from"./components/select/select.js";import{Pagination as A}from"./components/pagination/pagination.js";import{progressBar as j}from"./components/progress-bar/progress-bar.js";import{QrCode as M}from"./components/qr-code/qr-code.js";import{Rating as N}from"./components/rating/rating.js";import{SelectZone as P,SelectZoneItem as F}from"./components/select-zone/select-zone.js";import{Skeleton as I}from"./components/skeleton/skeleton.js";import{Slider as L}from"./components/slider/slider.js";import{Splitter as R,SplitterPanel as z}from"./components/splitter/splitter.js";import{Steps as B}from"./components/steps/steps.js";import{Swap as V}from"./components/swap/swap.js";import{Switch as H}from"./components/switch/switch.js";import{Tooltip as U}from"./components/tooltip/tooltip.js";import{Tab as W}from"./components/tab/tab.js";import{Table as G}from"./components/table/table.js";import{createColumnHelper as K}from"./components/table/index.js";import{TextRotate as q}from"./components/text-rotate/text-rotate.js";import{Timeline as J}from"./components/timeline/timeline.js";import{Toaster as Y,toast as X}from"./components/toast/toast.js";import{createTour as Z}from"./components/tour/tour.js";import{Upload as Q}from"./components/upload/upload.js";export{e as Avatar,t as Badge,n as Breadcrumb,r as Button,u as CODE_PREVIEW_THEMES,i as Carousel,a as ChatBubble,o as Checkbox,d as CodePreview,s as Collapse,m as ComponentDrawer,l as ContextMenu,f as Diff,p as Divider,h as Drawer,g as Dropdown,_ as FloatButton,y as Hover3DImage,v as ImagePreview,b as Indicator,x as Input,S as Loading,w as Mansory,T as Menu,E as Modal,A as Pagination,M as QrCode,N as Rating,k as Select,P as SelectZone,F as SelectZoneItem,I as Skeleton,L as Slider,C as Spinner,R as Splitter,z as SplitterPanel,B as Steps,V as Swap,H as Switch,W as Tab,G as Table,q as TextRotate,J as Timeline,Y as Toaster,U as Tooltip,Q as Upload,D as closeAllModals,K as createColumnHelper,c as createContextMenuHandle,O as createModal,Z as createTour,j as progressBar,X as toast};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "solid-tom-ui",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.2",
|
|
4
4
|
"description": "SolidJS UI component library (Ant Design–inspired, Tailwind CSS + DaisyUI)",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"clear:comment": "python src/utils/minify.py",
|
|
53
53
|
"extract": "npx tsx src/utils/extractor.ts",
|
|
54
54
|
"sb": "storybook dev -p 6006 --no-open",
|
|
55
|
-
"build-sb": "storybook build",
|
|
55
|
+
"build-sb": "storybook build && node scripts/zip-sb.js",
|
|
56
56
|
"release:patch": "npm version patch && npm publish",
|
|
57
57
|
"release:minor": "npm version minor && npm publish",
|
|
58
58
|
"release:major": "npm version major && npm publish"
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"blank.js","names":["Component","BlankProps","Blank","p"],"sources":["../../../src/components/blank/blank.tsx"],"sourcesContent":["import { Component } from 'solid-js';\n\ntype BlankProps = {};\nexport const Blank: Component<BlankProps> = p => {\n return <></>;\n};\n"],"mappings":"AAGA,IAAaE,EAA+BC,GAC1C,EAAA"}
|