@jxsuite/studio 0.25.5 → 0.26.1
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/studio.js +23 -10
- package/dist/studio.js.map +3 -3
- package/package.json +7 -7
- package/src/ui/unit-selector.ts +21 -9
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jxsuite/studio",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.26.1",
|
|
4
4
|
"description": "Jx Studio — visual builder for Jx documents",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -32,9 +32,9 @@
|
|
|
32
32
|
"dependencies": {
|
|
33
33
|
"@atlaskit/pragmatic-drag-and-drop": "^1.8.1",
|
|
34
34
|
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.2.0",
|
|
35
|
-
"@jxsuite/parser": "^0.
|
|
36
|
-
"@jxsuite/runtime": "^0.
|
|
37
|
-
"@jxsuite/schema": "^0.
|
|
35
|
+
"@jxsuite/parser": "^0.26.1",
|
|
36
|
+
"@jxsuite/runtime": "^0.26.1",
|
|
37
|
+
"@jxsuite/schema": "^0.26.1",
|
|
38
38
|
"@spectrum-web-components/accordion": "^1.12.1",
|
|
39
39
|
"@spectrum-web-components/action-bar": "1.12.1",
|
|
40
40
|
"@spectrum-web-components/action-button": "^1.12.1",
|
|
@@ -84,11 +84,11 @@
|
|
|
84
84
|
"yaml": "^2.9.0"
|
|
85
85
|
},
|
|
86
86
|
"devDependencies": {
|
|
87
|
-
"@happy-dom/global-registrator": "^20.
|
|
87
|
+
"@happy-dom/global-registrator": "^20.10.2",
|
|
88
88
|
"@types/mdast": "^4.0.4",
|
|
89
|
-
"@webref/css": "^8.5.
|
|
89
|
+
"@webref/css": "^8.5.8",
|
|
90
90
|
"@webref/elements": "^2.7.1",
|
|
91
|
-
"@webref/idl": "^3.
|
|
91
|
+
"@webref/idl": "^3.80.0"
|
|
92
92
|
},
|
|
93
93
|
"//vue-reactivity": "Exact pin required — must match @jxsuite/runtime to avoid cross-boundary proxy bugs"
|
|
94
94
|
}
|
package/src/ui/unit-selector.ts
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
import { html, nothing } from "lit-html";
|
|
10
10
|
import { live } from "lit-html/directives/live.js";
|
|
11
11
|
import { classMap } from "lit-html/directives/class-map.js";
|
|
12
|
-
import { debouncedStyleCommit } from "../store";
|
|
12
|
+
import { debouncedStyleCommit, cancelStyleDebounce } from "../store";
|
|
13
13
|
|
|
14
14
|
export const UNIT_RE = /^(-?[\d.]+)(px|rem|em|%|vw|vh|svw|svh|dvh|ms|s|fr|ch|ex|deg)?$/;
|
|
15
15
|
|
|
@@ -46,26 +46,38 @@ export function renderUnitSelector(
|
|
|
46
46
|
displayValue = isNaN(num) ? strVal : String(num);
|
|
47
47
|
} else displayValue = "";
|
|
48
48
|
|
|
49
|
+
// Parse placeholder so inherited values display as "500" not "500px"
|
|
50
|
+
const placeholderMatch = placeholder.match(UNIT_RE);
|
|
51
|
+
const numericPlaceholder = placeholderMatch ? placeholderMatch[1] : placeholder || "0";
|
|
52
|
+
|
|
49
53
|
const isExpression = isKeyword || (displayValue !== "" && !isNumericVal(displayValue));
|
|
50
54
|
const hasUnits = units.length > 0 || keywords.length > 0;
|
|
51
55
|
const btnId = `style-unit-${prop}`;
|
|
52
56
|
|
|
57
|
+
const commitValue = (rawVal: string) => {
|
|
58
|
+
const val = rawVal.trim();
|
|
59
|
+
if (val === "") {
|
|
60
|
+
onChange("");
|
|
61
|
+
return;
|
|
62
|
+
}
|
|
63
|
+
if (isNumericVal(val)) onChange(units.length > 0 ? val + currentUnit : val);
|
|
64
|
+
else onChange(val);
|
|
65
|
+
};
|
|
66
|
+
|
|
53
67
|
return html`
|
|
54
68
|
<div class="style-input-number-unit">
|
|
55
69
|
<div class=${classMap({ "input-group": true, "is-expression": isExpression })}>
|
|
56
70
|
<sp-textfield
|
|
57
71
|
size="s"
|
|
58
|
-
placeholder=${
|
|
72
|
+
placeholder=${numericPlaceholder}
|
|
59
73
|
.value=${live(displayValue)}
|
|
60
74
|
@input=${debouncedStyleCommit(`nui:${prop}`, 400, (e: Event) => {
|
|
61
|
-
|
|
62
|
-
if (val === "") {
|
|
63
|
-
onChange("");
|
|
64
|
-
return;
|
|
65
|
-
}
|
|
66
|
-
if (isNumericVal(val)) onChange(units.length > 0 ? val + currentUnit : val);
|
|
67
|
-
else onChange(val);
|
|
75
|
+
commitValue((e.target as HTMLInputElement).value);
|
|
68
76
|
})}
|
|
77
|
+
@change=${(e: Event) => {
|
|
78
|
+
cancelStyleDebounce(`nui:${prop}`);
|
|
79
|
+
commitValue((e.target as HTMLInputElement).value);
|
|
80
|
+
}}
|
|
69
81
|
></sp-textfield>
|
|
70
82
|
${hasUnits
|
|
71
83
|
? html`
|