canvu-react 0.4.26 → 0.4.28
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/index.cjs.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/native.cjs +36 -3
- package/dist/native.cjs.map +1 -1
- package/dist/native.js +36 -3
- package/dist/native.js.map +1 -1
- package/dist/react.cjs +4 -3
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +4 -3
- package/dist/react.js.map +1 -1
- package/dist/tldraw.cjs.map +1 -1
- package/dist/tldraw.js.map +1 -1
- package/package.json +1 -1
package/dist/native.cjs
CHANGED
|
@@ -43,6 +43,7 @@ function escapeHtmlText(s) {
|
|
|
43
43
|
return s.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
|
|
44
44
|
}
|
|
45
45
|
var DEFAULT_TEXT_FONT_SIZE = 18;
|
|
46
|
+
var DEFAULT_TEXT_TOOL_FONT_SIZE = 28;
|
|
46
47
|
var TEXT_FONT_FAMILY = "Inter, -apple-system, BlinkMacSystemFont, ui-sans-serif, system-ui, sans-serif";
|
|
47
48
|
var LINE_HEIGHT_RATIO = 22 / 18;
|
|
48
49
|
var FIRST_LINE_BASELINE_RATIO = 20 / 18;
|
|
@@ -83,6 +84,12 @@ function lineHeightFor(fontSize) {
|
|
|
83
84
|
function firstLineBaselineY(fontSize) {
|
|
84
85
|
return fontSize * FIRST_LINE_BASELINE_RATIO;
|
|
85
86
|
}
|
|
87
|
+
function textBaselineYFor(fontSize) {
|
|
88
|
+
return firstLineBaselineY(fontSize);
|
|
89
|
+
}
|
|
90
|
+
function textLineHeightFor(fontSize) {
|
|
91
|
+
return lineHeightFor(fontSize);
|
|
92
|
+
}
|
|
86
93
|
function measureTextBoundsLocal(content, fontSize = DEFAULT_TEXT_FONT_SIZE) {
|
|
87
94
|
const cacheKey = textMeasureCacheKey(content, fontSize);
|
|
88
95
|
const cached = textMeasureCache.get(cacheKey);
|
|
@@ -3065,6 +3072,25 @@ var DEFAULT_NATIVE_OVERFLOW_TOOL_IDS = [
|
|
|
3065
3072
|
"laser",
|
|
3066
3073
|
"image"
|
|
3067
3074
|
];
|
|
3075
|
+
var ARCHITECTURAL_CLOUD_ICON_PATH = "M1.5 12 A 4.94 5.23 0 0 1 9.07 6 A 4.94 5.23 0 0 1 14.93 6 A 4.94 5.23 0 0 1 22.5 12 A 4.94 5.23 0 0 1 14.93 18 A 4.94 5.23 0 0 1 9.07 18 A 4.94 5.23 0 0 1 1.5 12 Z";
|
|
3076
|
+
function NativeArchitecturalCloudIcon({
|
|
3077
|
+
color,
|
|
3078
|
+
size = 19,
|
|
3079
|
+
strokeWidth = 2
|
|
3080
|
+
}) {
|
|
3081
|
+
const scale = size / 24;
|
|
3082
|
+
return /* @__PURE__ */ jsxRuntime.jsx(reactNativeSkia.Canvas, { style: { width: size, height: size }, children: /* @__PURE__ */ jsxRuntime.jsx(reactNativeSkia.Group, { transform: [{ scale }], children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3083
|
+
reactNativeSkia.Path,
|
|
3084
|
+
{
|
|
3085
|
+
path: ARCHITECTURAL_CLOUD_ICON_PATH,
|
|
3086
|
+
color,
|
|
3087
|
+
style: "stroke",
|
|
3088
|
+
strokeWidth,
|
|
3089
|
+
strokeCap: "round",
|
|
3090
|
+
strokeJoin: "round"
|
|
3091
|
+
}
|
|
3092
|
+
) }) });
|
|
3093
|
+
}
|
|
3068
3094
|
var DEFAULT_NATIVE_VECTOR_TOOLS = [
|
|
3069
3095
|
{ id: "hand", label: "Hand", shortcutHint: "H", shortLabel: "H" },
|
|
3070
3096
|
{ id: "select", label: "Select", shortcutHint: "V", shortLabel: "V" },
|
|
@@ -3361,6 +3387,9 @@ function renderNativeToolButton(input) {
|
|
|
3361
3387
|
);
|
|
3362
3388
|
}
|
|
3363
3389
|
function renderNativeToolFallback(tool, foregroundColor, toolLabelStyle) {
|
|
3390
|
+
if (tool.id === "architectural-cloud") {
|
|
3391
|
+
return /* @__PURE__ */ jsxRuntime.jsx(NativeArchitecturalCloudIcon, { color: foregroundColor });
|
|
3392
|
+
}
|
|
3364
3393
|
return /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles2.shortLabel, { color: foregroundColor }, toolLabelStyle], children: tool.shortLabel ?? tool.label.slice(0, 1).toUpperCase() });
|
|
3365
3394
|
}
|
|
3366
3395
|
var styles2 = reactNative.StyleSheet.create({
|
|
@@ -4634,17 +4663,21 @@ var NativeVectorViewport = react.forwardRef(function NativeVectorViewport2({
|
|
|
4634
4663
|
if (!change) return;
|
|
4635
4664
|
if (st.tool === "text") {
|
|
4636
4665
|
const id = createShapeId();
|
|
4666
|
+
const fs = DEFAULT_TEXT_TOOL_FONT_SIZE;
|
|
4667
|
+
const baseline = textBaselineYFor(fs);
|
|
4668
|
+
const lh = textLineHeightFor(fs);
|
|
4669
|
+
const minH = Math.max(26, baseline + Math.max(4, lh * 0.2));
|
|
4637
4670
|
const item = createTextItem(
|
|
4638
4671
|
id,
|
|
4639
4672
|
{
|
|
4640
4673
|
x: st.startWorld.x - 4,
|
|
4641
|
-
y: st.startWorld.y -
|
|
4674
|
+
y: st.startWorld.y - baseline,
|
|
4642
4675
|
width: 160,
|
|
4643
|
-
height:
|
|
4676
|
+
height: minH
|
|
4644
4677
|
},
|
|
4645
4678
|
"Text",
|
|
4646
4679
|
strokeStyleRef.current,
|
|
4647
|
-
|
|
4680
|
+
fs
|
|
4648
4681
|
);
|
|
4649
4682
|
change([...itemsRef.current, item]);
|
|
4650
4683
|
onSelectionChangeRef.current?.([id]);
|