@lumen-stack/react 0.9.3 → 0.10.0
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 +26 -10
- package/dist/index.cjs +3 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +54 -4
- package/dist/index.d.ts +54 -4
- package/dist/index.js +3 -3
- package/dist/index.js.map +1 -1
- package/dist/styles.css +17 -6
- package/package.json +2 -2
package/dist/styles.css
CHANGED
|
@@ -327,6 +327,10 @@
|
|
|
327
327
|
align-items: stretch;
|
|
328
328
|
justify-content: center;
|
|
329
329
|
padding: 0;
|
|
330
|
+
/* Raise the sheet above the soft keyboard when its height is known (a WebView
|
|
331
|
+
host injecting --lumen-keyboard-inset, or visualViewport on the web). 0 when
|
|
332
|
+
no keyboard, so non-keyboard states are pixel-identical to before. */
|
|
333
|
+
padding-bottom: var(--lumen-keyboard-inset, 0px);
|
|
330
334
|
font-family: var(--lumen-font-ui);
|
|
331
335
|
color: var(--lumen-fg);
|
|
332
336
|
animation: lumen-backdrop-in var(--lumen-dur) var(--lumen-ease);
|
|
@@ -358,11 +362,14 @@
|
|
|
358
362
|
letter-spacing: -0.008em;
|
|
359
363
|
width: 100%;
|
|
360
364
|
max-width: 100%;
|
|
361
|
-
|
|
365
|
+
/* Shrink to the space left above the keyboard (var is 0 when none), so the
|
|
366
|
+
* sheet's top stays on-screen and its body scrolls. */
|
|
367
|
+
max-height: calc(92dvh - var(--lumen-keyboard-inset, 0px));
|
|
362
368
|
/* Stable sheet height: steps fill the same space so the sheet never
|
|
363
369
|
* jumps/resizes between capture → describe → review. Content taller
|
|
364
|
-
* than this scrolls inside the body instead of growing the sheet.
|
|
365
|
-
|
|
370
|
+
* than this scrolls inside the body instead of growing the sheet. Clamped so
|
|
371
|
+
* a tall keyboard can't force the min-height past the available space. */
|
|
372
|
+
min-height: min(58dvh, calc(92dvh - var(--lumen-keyboard-inset, 0px)));
|
|
366
373
|
margin-top: auto;
|
|
367
374
|
display: flex;
|
|
368
375
|
flex-direction: column;
|
|
@@ -399,12 +406,16 @@
|
|
|
399
406
|
align-items: center;
|
|
400
407
|
padding: var(--lumen-s-4);
|
|
401
408
|
padding-top: max(env(safe-area-inset-top, 0px), var(--lumen-s-4));
|
|
402
|
-
padding-bottom: max(
|
|
409
|
+
padding-bottom: max(
|
|
410
|
+
env(safe-area-inset-bottom, 0px),
|
|
411
|
+
var(--lumen-s-4),
|
|
412
|
+
var(--lumen-keyboard-inset, 0px)
|
|
413
|
+
);
|
|
403
414
|
}
|
|
404
415
|
.lumen-modal {
|
|
405
416
|
max-width: 760px;
|
|
406
|
-
max-height: min(86dvh, 820px);
|
|
407
|
-
min-height: min(560px, 78dvh);
|
|
417
|
+
max-height: calc(min(86dvh, 820px) - var(--lumen-keyboard-inset, 0px));
|
|
418
|
+
min-height: min(560px, 78dvh, calc(86dvh - var(--lumen-keyboard-inset, 0px)));
|
|
408
419
|
margin: auto;
|
|
409
420
|
border-radius: var(--lumen-r-lg);
|
|
410
421
|
border: 1px solid var(--lumen-border);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lumen-stack/react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.10.0",
|
|
4
4
|
"description": "React SDK for Lumen — screenshot capture, annotation, and feedback widget.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"publishConfig": {
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"react-dom": ">=18"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@lumen-stack/core": "^0.
|
|
42
|
+
"@lumen-stack/core": "^0.11.0",
|
|
43
43
|
"html2canvas-pro": "^1.5.8",
|
|
44
44
|
"sonner": "^1.7.1"
|
|
45
45
|
},
|