@embedpdf/react 3.0.0-next.10 → 3.0.0-next.11
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/dist/{AnnotationListSnapshot-DDxHpJQU-BG32YXxG.d.ts → AnnotationListSnapshot-C1U3XUxP-6kGwNoxy.d.cts} +223 -24
- package/dist/{AnnotationListSnapshot-DDxHpJQU-BG32YXxG.d.cts → AnnotationListSnapshot-C1U3XUxP-6kGwNoxy.d.ts} +223 -24
- package/dist/actions.cjs +42 -0
- package/dist/actions.cjs.map +1 -0
- package/dist/actions.d.cts +18 -0
- package/dist/actions.d.ts +18 -0
- package/dist/actions.js +34 -0
- package/dist/actions.js.map +1 -0
- package/dist/annotation-BCED_p9H.d.cts +160 -0
- package/dist/annotation-anchors-CetwM1g7.js +15 -0
- package/dist/annotation-anchors-CetwM1g7.js.map +1 -0
- package/dist/annotation-anchors-DuYRBJLl.cjs +26 -0
- package/dist/annotation-anchors-DuYRBJLl.cjs.map +1 -0
- package/dist/annotation-hooks-BB5ZhPpf.cjs +16 -0
- package/dist/annotation-hooks-BB5ZhPpf.cjs.map +1 -0
- package/dist/annotation-hooks-Df8EmzDO.js +11 -0
- package/dist/annotation-hooks-Df8EmzDO.js.map +1 -0
- package/dist/annotation-k38KDlIZ.d.ts +160 -0
- package/dist/annotation-menu.cjs +5 -5
- package/dist/annotation-menu.cjs.map +1 -1
- package/dist/annotation-menu.js +2 -2
- package/dist/annotation-menu.js.map +1 -1
- package/dist/annotation.cjs +5 -19
- package/dist/annotation.cjs.map +1 -1
- package/dist/annotation.d.cts +2 -159
- package/dist/annotation.d.ts +2 -159
- package/dist/annotation.js +2 -16
- package/dist/annotation.js.map +1 -1
- package/dist/form-BwrLFpKN.js +805 -0
- package/dist/form-BwrLFpKN.js.map +1 -0
- package/dist/form-D-ZSfGmB.cjs +836 -0
- package/dist/form-D-ZSfGmB.cjs.map +1 -0
- package/dist/form.cjs +8 -551
- package/dist/form.d.cts +4 -21
- package/dist/form.d.ts +4 -21
- package/dist/form.js +3 -544
- package/dist/index.cjs +15 -11
- package/dist/index.d.cts +7 -6
- package/dist/index.d.ts +7 -6
- package/dist/index.js +8 -5
- package/dist/link.cjs +48 -8
- package/dist/link.cjs.map +1 -1
- package/dist/link.d.cts +2 -2
- package/dist/link.d.ts +2 -2
- package/dist/link.js +49 -9
- package/dist/link.js.map +1 -1
- package/dist/{runtime-Cvi0wQ4d.d.cts → runtime-DE76hlnl.d.ts} +13 -5
- package/dist/{runtime-DXxr8T4L.d.ts → runtime-umHA_xHt.d.cts} +13 -5
- package/dist/runtime.cjs +19 -0
- package/dist/runtime.cjs.map +1 -1
- package/dist/runtime.d.cts +2 -2
- package/dist/runtime.d.ts +2 -2
- package/dist/runtime.js +19 -1
- package/dist/runtime.js.map +1 -1
- package/dist/scrollbar.cjs +3 -3
- package/dist/scrollbar.cjs.map +1 -1
- package/dist/scrollbar.d.cts +1 -1
- package/dist/scrollbar.d.ts +1 -1
- package/dist/scrollbar.js +1 -1
- package/dist/scrollbar.js.map +1 -1
- package/dist/search.d.cts +1 -1
- package/dist/search.d.ts +1 -1
- package/dist/selection.cjs +2 -2
- package/dist/selection.cjs.map +1 -1
- package/dist/selection.d.cts +1 -1
- package/dist/selection.d.ts +1 -1
- package/dist/selection.js +1 -1
- package/dist/selection.js.map +1 -1
- package/dist/stage.cjs +2 -2
- package/dist/stage.cjs.map +1 -1
- package/dist/stage.d.cts +1 -1
- package/dist/stage.d.ts +1 -1
- package/dist/stage.js +1 -1
- package/dist/stage.js.map +1 -1
- package/dist/toolbar.cjs +4 -4
- package/dist/toolbar.cjs.map +1 -1
- package/dist/toolbar.d.cts +1 -1
- package/dist/toolbar.d.ts +1 -1
- package/dist/toolbar.js +1 -1
- package/dist/toolbar.js.map +1 -1
- package/package.json +29 -23
- package/dist/form.cjs.map +0 -1
- package/dist/form.js.map +0 -1
package/dist/form.cjs
CHANGED
|
@@ -1,553 +1,12 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
let _embedpdf_plugin_form = require("@embedpdf/plugin-form");
|
|
11
|
-
//#region src/form.tsx
|
|
12
|
-
/** Content rect → a view-px box (the page wrapper's own coordinate space). */
|
|
13
|
-
function viewBox(r, page) {
|
|
14
|
-
const tl = page.transform.toPixels({
|
|
15
|
-
x: r.x,
|
|
16
|
-
y: r.y
|
|
17
|
-
});
|
|
18
|
-
const br = page.transform.toPixels({
|
|
19
|
-
x: r.x + r.width,
|
|
20
|
-
y: r.y + r.height
|
|
21
|
-
});
|
|
22
|
-
return {
|
|
23
|
-
left: tl.x,
|
|
24
|
-
top: tl.y,
|
|
25
|
-
width: br.x - tl.x,
|
|
26
|
-
height: br.y - tl.y
|
|
27
|
-
};
|
|
28
|
-
}
|
|
29
|
-
/**
|
|
30
|
-
* Keep the interaction hub out of gestures that begin inside a fill control.
|
|
31
|
-
* Native listener (not React's) so it runs during real DOM bubbling, before
|
|
32
|
-
* the Stage's own native listener on an ancestor — same trick as FreeText.
|
|
33
|
-
*/
|
|
34
|
-
function useIsolated() {
|
|
35
|
-
const ref = (0, react.useRef)(null);
|
|
36
|
-
(0, react.useEffect)(() => {
|
|
37
|
-
const el = ref.current;
|
|
38
|
-
if (!el) return;
|
|
39
|
-
const stop = (e) => e.stopPropagation();
|
|
40
|
-
el.addEventListener("pointerdown", stop);
|
|
41
|
-
return () => el.removeEventListener("pointerdown", stop);
|
|
42
|
-
}, []);
|
|
43
|
-
return ref;
|
|
44
|
-
}
|
|
45
|
-
/**
|
|
46
|
-
* Fulfil form-script UI requests for the active document. By default alerts use
|
|
47
|
-
* the browser dialog, page navigation uses the main Stage, and print delegates
|
|
48
|
-
* to the browser. Pass handlers (or one raw provider) to replace that policy.
|
|
49
|
-
*/
|
|
50
|
-
function useFormScriptingProvider(adapter) {
|
|
51
|
-
const form = require_runtime.useOptionalCapability(_embedpdf_plugin_form.FormToken);
|
|
52
|
-
const stage = require_runtime.useOptionalCapability(_embedpdf_plugin_stage.StageToken);
|
|
53
|
-
const adapterRef = (0, react.useRef)(adapter);
|
|
54
|
-
adapterRef.current = adapter;
|
|
55
|
-
(0, react.useEffect)(() => {
|
|
56
|
-
if (!form) return;
|
|
57
|
-
const provider = (effect) => {
|
|
58
|
-
const current = adapterRef.current;
|
|
59
|
-
if (typeof current === "function") {
|
|
60
|
-
current(effect);
|
|
61
|
-
return;
|
|
62
|
-
}
|
|
63
|
-
switch (effect.kind) {
|
|
64
|
-
case "alert":
|
|
65
|
-
if (current?.alert) current.alert(effect.message, effect);
|
|
66
|
-
else if (typeof globalThis.alert === "function") globalThis.alert(effect.message);
|
|
67
|
-
break;
|
|
68
|
-
case "gotoPage":
|
|
69
|
-
if (current?.gotoPage) current.gotoPage(effect.page, effect);
|
|
70
|
-
else stage?.goToPage(effect.page);
|
|
71
|
-
break;
|
|
72
|
-
case "print":
|
|
73
|
-
if (current?.print) current.print(effect);
|
|
74
|
-
else if (typeof globalThis.print === "function") globalThis.print();
|
|
75
|
-
break;
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
form.setUiEffectProvider(provider);
|
|
79
|
-
return () => form.setUiEffectProvider(null);
|
|
80
|
-
}, [form, stage]);
|
|
81
|
-
}
|
|
82
|
-
/** The baked /AP raster, blitted by its OWN box (exactly like BakedImage). */
|
|
83
|
-
function Picture({ page, appearance, apBox, frame, hidden }) {
|
|
84
|
-
if (!appearance) return null;
|
|
85
|
-
const b = viewBox(apBox ?? appearance.box, page);
|
|
86
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
|
|
87
|
-
src: appearance.url,
|
|
88
|
-
alt: "",
|
|
89
|
-
draggable: false,
|
|
90
|
-
style: {
|
|
91
|
-
position: "absolute",
|
|
92
|
-
left: b.left - (frame?.left ?? 0),
|
|
93
|
-
top: b.top - (frame?.top ?? 0),
|
|
94
|
-
width: b.width,
|
|
95
|
-
height: b.height,
|
|
96
|
-
maxWidth: "none",
|
|
97
|
-
pointerEvents: "none",
|
|
98
|
-
visibility: hidden ? "hidden" : "visible"
|
|
99
|
-
}
|
|
100
|
-
});
|
|
101
|
-
}
|
|
102
|
-
/**
|
|
103
|
-
* Dispatch one engaged widget to its fill control. The FIELD plane (value,
|
|
104
|
-
* behavior, disabled) comes from the form plugin's single-widget projection;
|
|
105
|
-
* the WIDGET plane (live box, /DA font, baked raster) rides in on the
|
|
106
|
-
* renderer props — no geometry is read from the form model here.
|
|
107
|
-
*/
|
|
108
|
-
function FormWidget({ item, page, appearance }) {
|
|
109
|
-
const annot = item.ref?.kind === "objectNumber" ? item.ref.annotObjectNumber : 0;
|
|
110
|
-
const fill = require_runtime.useSelector(_embedpdf_plugin_form.FormToken, (c) => annot > 0 ? c.fillItem(annot) : null);
|
|
111
|
-
if (!fill) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Picture, {
|
|
112
|
-
page,
|
|
113
|
-
appearance,
|
|
114
|
-
apBox: item.apBox
|
|
115
|
-
});
|
|
116
|
-
switch (fill.control) {
|
|
117
|
-
case "text": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextWidget, {
|
|
118
|
-
fill,
|
|
119
|
-
item,
|
|
120
|
-
page,
|
|
121
|
-
appearance
|
|
122
|
-
});
|
|
123
|
-
case "toggle": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleWidget, {
|
|
124
|
-
fill,
|
|
125
|
-
item,
|
|
126
|
-
page,
|
|
127
|
-
appearance
|
|
128
|
-
});
|
|
129
|
-
case "choice": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChoiceWidget, {
|
|
130
|
-
fill,
|
|
131
|
-
item,
|
|
132
|
-
page,
|
|
133
|
-
appearance
|
|
134
|
-
});
|
|
135
|
-
case "button": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonWidget, {
|
|
136
|
-
fill,
|
|
137
|
-
item,
|
|
138
|
-
page,
|
|
139
|
-
appearance
|
|
140
|
-
});
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
function ButtonWidget({ fill, item, page, appearance }) {
|
|
144
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
145
|
-
const wrap = useIsolated();
|
|
146
|
-
const b = viewBox(item.box, page);
|
|
147
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
148
|
-
ref: wrap,
|
|
149
|
-
type: "button",
|
|
150
|
-
"aria-label": fill.label,
|
|
151
|
-
disabled: fill.disabled,
|
|
152
|
-
onClick: () => {
|
|
153
|
-
if (item.ref) form.activateWidget(fill.key, item.ref);
|
|
154
|
-
},
|
|
155
|
-
style: {
|
|
156
|
-
position: "absolute",
|
|
157
|
-
left: b.left,
|
|
158
|
-
top: b.top,
|
|
159
|
-
width: b.width,
|
|
160
|
-
height: b.height,
|
|
161
|
-
boxSizing: "border-box",
|
|
162
|
-
padding: 0,
|
|
163
|
-
border: 0,
|
|
164
|
-
background: "transparent",
|
|
165
|
-
cursor: fill.disabled ? "default" : "pointer",
|
|
166
|
-
pointerEvents: fill.disabled ? "none" : "auto"
|
|
167
|
-
},
|
|
168
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Picture, {
|
|
169
|
-
page,
|
|
170
|
-
appearance,
|
|
171
|
-
apBox: item.apBox,
|
|
172
|
-
frame: b
|
|
173
|
-
})
|
|
174
|
-
});
|
|
175
|
-
}
|
|
176
|
-
function TextWidget({ fill, item, page, appearance }) {
|
|
177
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
178
|
-
const wrap = useIsolated();
|
|
179
|
-
const [focused, setFocused] = (0, react.useState)(false);
|
|
180
|
-
const [draft, setDraft] = (0, react.useState)(fill.value);
|
|
181
|
-
const cancelled = (0, react.useRef)(false);
|
|
182
|
-
(0, react.useEffect)(() => {
|
|
183
|
-
if (!focused) setDraft(fill.value);
|
|
184
|
-
}, [fill.value, focused]);
|
|
185
|
-
const b = viewBox(item.box, page);
|
|
186
|
-
const scale = item.box.width > 0 ? b.width / item.box.width : 1;
|
|
187
|
-
const fontSize = item.text && item.text.fontSize > 0 ? item.text.fontSize * scale : fill.multiline ? 12 * scale : Math.max(6, b.height * .72);
|
|
188
|
-
const editorStyle = {
|
|
189
|
-
position: "absolute",
|
|
190
|
-
inset: 0,
|
|
191
|
-
width: "100%",
|
|
192
|
-
height: "100%",
|
|
193
|
-
boxSizing: "border-box",
|
|
194
|
-
border: "none",
|
|
195
|
-
outline: focused ? "2px solid rgba(66, 133, 244, 0.8)" : "none",
|
|
196
|
-
outlineOffset: -2,
|
|
197
|
-
padding: "0 2px",
|
|
198
|
-
margin: 0,
|
|
199
|
-
background: item.style.interiorColor ?? "#fff",
|
|
200
|
-
color: item.text?.fontColor ?? "#000",
|
|
201
|
-
fontFamily: item.text?.fontFamily ?? "Helvetica, Arial, sans-serif",
|
|
202
|
-
fontSize,
|
|
203
|
-
textAlign: item.text?.textAlign ?? "left",
|
|
204
|
-
resize: "none",
|
|
205
|
-
cursor: "text",
|
|
206
|
-
opacity: focused ? 1 : 0
|
|
207
|
-
};
|
|
208
|
-
const editorProps = {
|
|
209
|
-
value: draft,
|
|
210
|
-
maxLength: fill.maxLength ?? void 0,
|
|
211
|
-
"aria-label": fill.label,
|
|
212
|
-
disabled: fill.disabled,
|
|
213
|
-
onFocus: () => setFocused(true),
|
|
214
|
-
onChange: (e) => setDraft(e.target.value),
|
|
215
|
-
onBlur: () => {
|
|
216
|
-
setFocused(false);
|
|
217
|
-
if (cancelled.current) {
|
|
218
|
-
cancelled.current = false;
|
|
219
|
-
setDraft(fill.value);
|
|
220
|
-
return;
|
|
221
|
-
}
|
|
222
|
-
if (draft !== fill.value) form.setText(fill.key, draft);
|
|
223
|
-
},
|
|
224
|
-
style: editorStyle
|
|
225
|
-
};
|
|
226
|
-
const onKeys = (e) => {
|
|
227
|
-
if (e.key === "Escape") {
|
|
228
|
-
cancelled.current = true;
|
|
229
|
-
e.currentTarget.blur();
|
|
230
|
-
}
|
|
231
|
-
if (e.key === "Enter" && !fill.multiline) e.currentTarget.blur();
|
|
232
|
-
};
|
|
233
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
234
|
-
ref: wrap,
|
|
235
|
-
style: {
|
|
236
|
-
position: "absolute",
|
|
237
|
-
left: b.left,
|
|
238
|
-
top: b.top,
|
|
239
|
-
width: b.width,
|
|
240
|
-
height: b.height,
|
|
241
|
-
pointerEvents: fill.disabled ? "none" : "auto"
|
|
242
|
-
},
|
|
243
|
-
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Picture, {
|
|
244
|
-
page,
|
|
245
|
-
appearance,
|
|
246
|
-
apBox: item.apBox,
|
|
247
|
-
frame: b,
|
|
248
|
-
hidden: focused
|
|
249
|
-
}), fill.multiline ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
|
|
250
|
-
...editorProps,
|
|
251
|
-
onKeyDown: onKeys
|
|
252
|
-
}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
|
|
253
|
-
...editorProps,
|
|
254
|
-
type: fill.password ? "password" : "text",
|
|
255
|
-
onKeyDown: onKeys
|
|
256
|
-
})]
|
|
257
|
-
});
|
|
258
|
-
}
|
|
259
|
-
function ToggleWidget({ fill, item, page, appearance }) {
|
|
260
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
261
|
-
const wrap = useIsolated();
|
|
262
|
-
const [focused, setFocused] = (0, react.useState)(false);
|
|
263
|
-
const b = viewBox(item.box, page);
|
|
264
|
-
const toggle = () => {
|
|
265
|
-
if (fill.disabled) return;
|
|
266
|
-
form.toggle(fill.key, fill.kind === "checkbox" && fill.checked ? null : fill.onState);
|
|
267
|
-
};
|
|
268
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
269
|
-
ref: wrap,
|
|
270
|
-
role: fill.kind === "checkbox" ? "checkbox" : "radio",
|
|
271
|
-
"aria-checked": fill.checked,
|
|
272
|
-
"aria-label": fill.label,
|
|
273
|
-
tabIndex: fill.disabled ? -1 : 0,
|
|
274
|
-
onClick: toggle,
|
|
275
|
-
onFocus: () => setFocused(true),
|
|
276
|
-
onBlur: () => setFocused(false),
|
|
277
|
-
onKeyDown: (e) => {
|
|
278
|
-
if (e.key === " " || e.key === "Enter") {
|
|
279
|
-
e.preventDefault();
|
|
280
|
-
toggle();
|
|
281
|
-
}
|
|
282
|
-
},
|
|
283
|
-
style: {
|
|
284
|
-
position: "absolute",
|
|
285
|
-
left: b.left,
|
|
286
|
-
top: b.top,
|
|
287
|
-
width: b.width,
|
|
288
|
-
height: b.height,
|
|
289
|
-
cursor: fill.disabled ? "default" : "pointer",
|
|
290
|
-
pointerEvents: fill.disabled ? "none" : "auto",
|
|
291
|
-
outline: focused ? "2px solid rgba(66, 133, 244, 0.8)" : "none",
|
|
292
|
-
outlineOffset: -2
|
|
293
|
-
},
|
|
294
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Picture, {
|
|
295
|
-
page,
|
|
296
|
-
appearance,
|
|
297
|
-
apBox: item.apBox,
|
|
298
|
-
frame: b
|
|
299
|
-
})
|
|
300
|
-
});
|
|
301
|
-
}
|
|
302
|
-
function ChoiceWidget({ fill, item, page, appearance }) {
|
|
303
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
304
|
-
const wrap = useIsolated();
|
|
305
|
-
const [focused, setFocused] = (0, react.useState)(false);
|
|
306
|
-
const b = viewBox(item.box, page);
|
|
307
|
-
const multiple = fill.kind === "list" && fill.multi;
|
|
308
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
309
|
-
ref: wrap,
|
|
310
|
-
style: {
|
|
311
|
-
position: "absolute",
|
|
312
|
-
left: b.left,
|
|
313
|
-
top: b.top,
|
|
314
|
-
width: b.width,
|
|
315
|
-
height: b.height,
|
|
316
|
-
pointerEvents: fill.disabled ? "none" : "auto",
|
|
317
|
-
outline: focused ? "2px solid rgba(66, 133, 244, 0.8)" : "none",
|
|
318
|
-
outlineOffset: -2
|
|
319
|
-
},
|
|
320
|
-
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Picture, {
|
|
321
|
-
page,
|
|
322
|
-
appearance,
|
|
323
|
-
apBox: item.apBox,
|
|
324
|
-
frame: b
|
|
325
|
-
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
|
|
326
|
-
multiple,
|
|
327
|
-
size: fill.kind === "list" ? Math.max(2, fill.options.length) : void 0,
|
|
328
|
-
defaultValue: multiple ? fill.selected : fill.selected[0] ?? "",
|
|
329
|
-
"aria-label": fill.label,
|
|
330
|
-
disabled: fill.disabled,
|
|
331
|
-
onFocus: () => setFocused(true),
|
|
332
|
-
onBlur: () => setFocused(false),
|
|
333
|
-
onChange: (e) => {
|
|
334
|
-
const values = Array.from(e.currentTarget.selectedOptions).map((o) => o.value);
|
|
335
|
-
form.choose(fill.key, values);
|
|
336
|
-
},
|
|
337
|
-
style: {
|
|
338
|
-
position: "absolute",
|
|
339
|
-
inset: 0,
|
|
340
|
-
width: "100%",
|
|
341
|
-
height: "100%",
|
|
342
|
-
opacity: 0,
|
|
343
|
-
cursor: fill.disabled ? "default" : "pointer"
|
|
344
|
-
},
|
|
345
|
-
children: fill.options.map((o, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
|
|
346
|
-
value: o.value,
|
|
347
|
-
children: o.label
|
|
348
|
-
}, i))
|
|
349
|
-
}, fill.selected.join("\0"))]
|
|
350
|
-
});
|
|
351
|
-
}
|
|
352
|
-
/**
|
|
353
|
-
* The form plugin's renderer entry, ready for
|
|
354
|
-
* `<AnnotationLayer renderers={[formWidgetRenderer]} />`. It answers for the
|
|
355
|
-
* PLUGIN-registered 'form-widgets' Behavior — the form plugin decides when
|
|
356
|
-
* widgets are fill controls vs. editable annotations, never the app.
|
|
357
|
-
*/
|
|
358
|
-
const formWidgetRenderer = {
|
|
359
|
-
behavior: "form-widgets",
|
|
360
|
-
component: FormWidget
|
|
361
|
-
};
|
|
362
|
-
const controlBase = {
|
|
363
|
-
position: "absolute",
|
|
364
|
-
boxSizing: "border-box",
|
|
365
|
-
border: "1px solid rgba(56, 88, 233, 0.55)",
|
|
366
|
-
background: "rgba(255, 255, 255, 0.92)",
|
|
367
|
-
borderRadius: 2,
|
|
368
|
-
font: "inherit"
|
|
369
|
-
};
|
|
370
|
-
const fillBox = (item, page) => viewBox(item.box, page);
|
|
371
|
-
/** Text control: keystrokes stay LOCAL (the input is the draft store);
|
|
372
|
-
* the engine write happens on blur or Enter. */
|
|
373
|
-
function FillText({ item, page }) {
|
|
374
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
375
|
-
const [draft, setDraft] = (0, react.useState)(item.value);
|
|
376
|
-
(0, react.useEffect)(() => setDraft(item.value), [item.value]);
|
|
377
|
-
const css = fillBox(item, page);
|
|
378
|
-
const fontSize = Math.max(9, Math.min(css.height * .62, 24));
|
|
379
|
-
const commit = () => {
|
|
380
|
-
if (draft !== item.value) form.setText(item.key, draft).catch(() => setDraft(item.value));
|
|
381
|
-
};
|
|
382
|
-
const shared = {
|
|
383
|
-
...controlBase,
|
|
384
|
-
...css,
|
|
385
|
-
fontSize,
|
|
386
|
-
padding: "0 3px",
|
|
387
|
-
...item.comb ? { letterSpacing: css.width / Math.max(1, item.maxLength ?? 1) / 2 } : {}
|
|
388
|
-
};
|
|
389
|
-
return item.multiline ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
|
|
390
|
-
"aria-label": item.label,
|
|
391
|
-
value: draft,
|
|
392
|
-
disabled: item.disabled,
|
|
393
|
-
onChange: (e) => setDraft(e.target.value),
|
|
394
|
-
onBlur: commit,
|
|
395
|
-
style: {
|
|
396
|
-
...shared,
|
|
397
|
-
resize: "none"
|
|
398
|
-
}
|
|
399
|
-
}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
|
|
400
|
-
"aria-label": item.label,
|
|
401
|
-
type: item.password ? "password" : "text",
|
|
402
|
-
value: draft,
|
|
403
|
-
maxLength: item.maxLength ?? void 0,
|
|
404
|
-
disabled: item.disabled,
|
|
405
|
-
onChange: (e) => setDraft(e.target.value),
|
|
406
|
-
onBlur: commit,
|
|
407
|
-
onKeyDown: (e) => {
|
|
408
|
-
if (e.key === "Enter") e.target.blur();
|
|
409
|
-
},
|
|
410
|
-
style: shared
|
|
411
|
-
});
|
|
412
|
-
}
|
|
413
|
-
function FillToggle({ item, page }) {
|
|
414
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
415
|
-
const css = fillBox(item, page);
|
|
416
|
-
const glyphSize = Math.min(css.width, css.height) * .72;
|
|
417
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
418
|
-
role: item.kind,
|
|
419
|
-
"aria-checked": item.checked,
|
|
420
|
-
"aria-label": item.label,
|
|
421
|
-
disabled: item.disabled,
|
|
422
|
-
onClick: () => void form.toggle(item.key, item.kind === "checkbox" && item.checked ? null : item.onState),
|
|
423
|
-
style: {
|
|
424
|
-
...controlBase,
|
|
425
|
-
...css,
|
|
426
|
-
cursor: item.disabled ? "default" : "pointer",
|
|
427
|
-
display: "grid",
|
|
428
|
-
placeItems: "center",
|
|
429
|
-
padding: 0,
|
|
430
|
-
borderRadius: item.kind === "radio" ? "50%" : 2,
|
|
431
|
-
fontSize: glyphSize,
|
|
432
|
-
lineHeight: 1,
|
|
433
|
-
color: "#1f2a44"
|
|
434
|
-
},
|
|
435
|
-
children: item.checked ? item.kind === "radio" ? "●" : "✓" : ""
|
|
436
|
-
});
|
|
437
|
-
}
|
|
438
|
-
function FillChoice({ item, page }) {
|
|
439
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
440
|
-
const css = fillBox(item, page);
|
|
441
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
|
|
442
|
-
"aria-label": item.label,
|
|
443
|
-
multiple: item.multi,
|
|
444
|
-
disabled: item.disabled,
|
|
445
|
-
value: item.multi ? item.selected : item.selected[0] ?? "",
|
|
446
|
-
onChange: (e) => {
|
|
447
|
-
const values = item.multi ? Array.from(e.target.selectedOptions).map((o) => o.value) : [e.target.value];
|
|
448
|
-
form.choose(item.key, values);
|
|
449
|
-
},
|
|
450
|
-
style: {
|
|
451
|
-
...controlBase,
|
|
452
|
-
...css,
|
|
453
|
-
fontSize: Math.max(9, Math.min(css.height * .55, 18))
|
|
454
|
-
},
|
|
455
|
-
children: [!item.multi && item.selected.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", { value: "" }), item.options.map((o) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
|
|
456
|
-
value: o.value,
|
|
457
|
-
children: o.label
|
|
458
|
-
}, o.value))]
|
|
459
|
-
});
|
|
460
|
-
}
|
|
461
|
-
function FillButton({ item, page }) {
|
|
462
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
463
|
-
const css = fillBox(item, page);
|
|
464
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
|
|
465
|
-
type: "button",
|
|
466
|
-
"aria-label": item.label,
|
|
467
|
-
disabled: item.disabled,
|
|
468
|
-
onClick: () => void form.activateWidget(item.key, {
|
|
469
|
-
kind: "objectNumber",
|
|
470
|
-
pageObjectNumber: page.pon,
|
|
471
|
-
annotObjectNumber: item.annotObjectNumber
|
|
472
|
-
}),
|
|
473
|
-
style: {
|
|
474
|
-
...controlBase,
|
|
475
|
-
...css,
|
|
476
|
-
padding: 0,
|
|
477
|
-
border: 0,
|
|
478
|
-
background: "transparent",
|
|
479
|
-
cursor: item.disabled ? "default" : "pointer"
|
|
480
|
-
}
|
|
481
|
-
});
|
|
482
|
-
}
|
|
483
|
-
/**
|
|
484
|
-
* Fill-mode form controls for one page, positioned from the form model's own
|
|
485
|
-
* widget geometry — the ANNOTATION-LESS path (a fill-only viewer whose page
|
|
486
|
-
* pixels come from an annotated RenderLayer raster). Active whenever the
|
|
487
|
-
* active tool carries the 'form-fill' tag (the built-in pointer/pan tools
|
|
488
|
-
* do); any other tool stands the controls down. Do not mount next to an
|
|
489
|
-
* AnnotationLayer wired with `formWidgetBehaviors`.
|
|
490
|
-
*/
|
|
491
|
-
function FormLayer() {
|
|
492
|
-
const page = require_runtime.usePage();
|
|
493
|
-
const form = require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
494
|
-
const active = require_runtime.useSelector(_embedpdf_plugin_interaction.InteractionToken, (c) => c.activeTool().enables.has("form-fill"));
|
|
495
|
-
(0, react.useEffect)(() => {
|
|
496
|
-
if (active) form.ensureGeom(page.pon);
|
|
497
|
-
}, [
|
|
498
|
-
active,
|
|
499
|
-
form,
|
|
500
|
-
page.pon
|
|
501
|
-
]);
|
|
502
|
-
const items = require_runtime.useSelector(_embedpdf_plugin_form.FormToken, (c) => c.fillItems(page.pon), require_runtime.shallowArray);
|
|
503
|
-
if (!active) return null;
|
|
504
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
505
|
-
style: {
|
|
506
|
-
position: "absolute",
|
|
507
|
-
inset: 0
|
|
508
|
-
},
|
|
509
|
-
children: items.map((item) => item.control === "text" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FillText, {
|
|
510
|
-
item,
|
|
511
|
-
page
|
|
512
|
-
}, `${item.key}:${item.annotObjectNumber}`) : item.control === "toggle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FillToggle, {
|
|
513
|
-
item,
|
|
514
|
-
page
|
|
515
|
-
}, `${item.key}:${item.annotObjectNumber}`) : item.control === "choice" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FillChoice, {
|
|
516
|
-
item,
|
|
517
|
-
page
|
|
518
|
-
}, `${item.key}:${item.annotObjectNumber}`) : item.control === "button" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FillButton, {
|
|
519
|
-
item,
|
|
520
|
-
page
|
|
521
|
-
}, `${item.key}:${item.annotObjectNumber}`) : null)
|
|
522
|
-
});
|
|
523
|
-
}
|
|
524
|
-
/** The form capability — values, interchange, design-mode verbs. */
|
|
525
|
-
function useForm() {
|
|
526
|
-
return require_runtime.useCapability(_embedpdf_plugin_form.FormToken);
|
|
527
|
-
}
|
|
528
|
-
/** The reconciled form snapshot (null until the first load lands),
|
|
529
|
-
* re-rendering on every form model change. */
|
|
530
|
-
function useFormSnapshot() {
|
|
531
|
-
return require_runtime.useSelector(_embedpdf_plugin_form.FormToken, (c) => c.snapshot());
|
|
532
|
-
}
|
|
533
|
-
/**
|
|
534
|
-
* The FIELD behind the currently selected widget annotation (single
|
|
535
|
-
* selection), or null. The design-mode join: widget selection lives in the
|
|
536
|
-
* annotation plane, field properties live here.
|
|
537
|
-
*/
|
|
538
|
-
function useFormField() {
|
|
539
|
-
const selected = require_annotation.useAnnotationSelected();
|
|
540
|
-
const widget = selected.length === 1 && selected[0].subtype === "widget" ? selected[0] : null;
|
|
541
|
-
const objnum = widget && widget.ref.kind === "objectNumber" ? widget.ref.annotObjectNumber : 0;
|
|
542
|
-
return require_runtime.useSelector(_embedpdf_plugin_form.FormToken, (c) => objnum > 0 ? c.fieldForWidget(objnum) : null);
|
|
543
|
-
}
|
|
544
|
-
//#endregion
|
|
545
|
-
exports.FormLayer = FormLayer;
|
|
546
|
-
exports.formWidgetRenderer = formWidgetRenderer;
|
|
547
|
-
exports.useForm = useForm;
|
|
548
|
-
exports.useFormField = useFormField;
|
|
549
|
-
exports.useFormScriptingProvider = useFormScriptingProvider;
|
|
550
|
-
exports.useFormSnapshot = useFormSnapshot;
|
|
2
|
+
require("./runtime.cjs");
|
|
3
|
+
const require_form = require("./form-D-ZSfGmB.cjs");
|
|
4
|
+
exports.FormLayer = require_form.FormLayer;
|
|
5
|
+
exports.formWidgetRenderer = require_form.formWidgetRenderer;
|
|
6
|
+
exports.useForm = require_form.useForm;
|
|
7
|
+
exports.useFormField = require_form.useFormField;
|
|
8
|
+
exports.useFormSnapshot = require_form.useFormSnapshot;
|
|
9
|
+
var _embedpdf_plugin_form = require("@embedpdf/plugin-form");
|
|
551
10
|
Object.keys(_embedpdf_plugin_form).forEach(function(k) {
|
|
552
11
|
if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
|
|
553
12
|
enumerable: true,
|
|
@@ -556,5 +15,3 @@ Object.keys(_embedpdf_plugin_form).forEach(function(k) {
|
|
|
556
15
|
}
|
|
557
16
|
});
|
|
558
17
|
});
|
|
559
|
-
|
|
560
|
-
//# sourceMappingURL=form.cjs.map
|
package/dist/form.d.cts
CHANGED
|
@@ -1,25 +1,8 @@
|
|
|
1
|
-
import { AnnotationRenderer } from "./annotation.cjs";
|
|
2
|
-
import { t as FormSnapshot } from "./AnnotationListSnapshot-
|
|
3
|
-
import { FormFieldDTO
|
|
1
|
+
import { o as AnnotationRenderer } from "./annotation-BCED_p9H.cjs";
|
|
2
|
+
import { t as FormSnapshot } from "./AnnotationListSnapshot-C1U3XUxP-6kGwNoxy.cjs";
|
|
3
|
+
import { FormFieldDTO } from "@embedpdf/plugin-form";
|
|
4
4
|
export * from "@embedpdf/plugin-form";
|
|
5
5
|
//#region src/form.d.ts
|
|
6
|
-
interface FormScriptingUiHandlers {
|
|
7
|
-
alert?: (message: string, effect: Extract<FormUiEffect, {
|
|
8
|
-
kind: 'alert';
|
|
9
|
-
}>) => void;
|
|
10
|
-
print?: (effect: Extract<FormUiEffect, {
|
|
11
|
-
kind: 'print';
|
|
12
|
-
}>) => void;
|
|
13
|
-
gotoPage?: (page: number, effect: Extract<FormUiEffect, {
|
|
14
|
-
kind: 'gotoPage';
|
|
15
|
-
}>) => void;
|
|
16
|
-
}
|
|
17
|
-
/**
|
|
18
|
-
* Fulfil form-script UI requests for the active document. By default alerts use
|
|
19
|
-
* the browser dialog, page navigation uses the main Stage, and print delegates
|
|
20
|
-
* to the browser. Pass handlers (or one raw provider) to replace that policy.
|
|
21
|
-
*/
|
|
22
|
-
declare function useFormScriptingProvider(adapter?: FormScriptingUiHandlers | FormUiEffectProvider): void;
|
|
23
6
|
/**
|
|
24
7
|
* The form plugin's renderer entry, ready for
|
|
25
8
|
* `<AnnotationLayer renderers={[formWidgetRenderer]} />`. It answers for the
|
|
@@ -48,5 +31,5 @@ declare function useFormSnapshot(): FormSnapshot | null;
|
|
|
48
31
|
*/
|
|
49
32
|
declare function useFormField(): FormFieldDTO | null;
|
|
50
33
|
//#endregion
|
|
51
|
-
export { FormLayer,
|
|
34
|
+
export { FormLayer, formWidgetRenderer, useForm, useFormField, useFormSnapshot };
|
|
52
35
|
//# sourceMappingURL=form.d.cts.map
|
package/dist/form.d.ts
CHANGED
|
@@ -1,25 +1,8 @@
|
|
|
1
|
-
import { AnnotationRenderer } from "./annotation.js";
|
|
2
|
-
import { t as FormSnapshot } from "./AnnotationListSnapshot-
|
|
3
|
-
import { FormFieldDTO
|
|
1
|
+
import { o as AnnotationRenderer } from "./annotation-k38KDlIZ.js";
|
|
2
|
+
import { t as FormSnapshot } from "./AnnotationListSnapshot-C1U3XUxP-6kGwNoxy.js";
|
|
3
|
+
import { FormFieldDTO } from "@embedpdf/plugin-form";
|
|
4
4
|
export * from "@embedpdf/plugin-form";
|
|
5
5
|
//#region src/form.d.ts
|
|
6
|
-
interface FormScriptingUiHandlers {
|
|
7
|
-
alert?: (message: string, effect: Extract<FormUiEffect, {
|
|
8
|
-
kind: 'alert';
|
|
9
|
-
}>) => void;
|
|
10
|
-
print?: (effect: Extract<FormUiEffect, {
|
|
11
|
-
kind: 'print';
|
|
12
|
-
}>) => void;
|
|
13
|
-
gotoPage?: (page: number, effect: Extract<FormUiEffect, {
|
|
14
|
-
kind: 'gotoPage';
|
|
15
|
-
}>) => void;
|
|
16
|
-
}
|
|
17
|
-
/**
|
|
18
|
-
* Fulfil form-script UI requests for the active document. By default alerts use
|
|
19
|
-
* the browser dialog, page navigation uses the main Stage, and print delegates
|
|
20
|
-
* to the browser. Pass handlers (or one raw provider) to replace that policy.
|
|
21
|
-
*/
|
|
22
|
-
declare function useFormScriptingProvider(adapter?: FormScriptingUiHandlers | FormUiEffectProvider): void;
|
|
23
6
|
/**
|
|
24
7
|
* The form plugin's renderer entry, ready for
|
|
25
8
|
* `<AnnotationLayer renderers={[formWidgetRenderer]} />`. It answers for the
|
|
@@ -48,5 +31,5 @@ declare function useFormSnapshot(): FormSnapshot | null;
|
|
|
48
31
|
*/
|
|
49
32
|
declare function useFormField(): FormFieldDTO | null;
|
|
50
33
|
//#endregion
|
|
51
|
-
export { FormLayer,
|
|
34
|
+
export { FormLayer, formWidgetRenderer, useForm, useFormField, useFormSnapshot };
|
|
52
35
|
//# sourceMappingURL=form.d.ts.map
|