canvu-react 0.4.36 → 0.4.38

package/dist/native.js

@@ -1,8 +1,8 @@
 import getStroke from 'perfect-freehand';
-import { Group, Canvas, Rect, Circle, Path, RoundedRect, Oval, DashPathEffect, Line, vec, matchFont, Text, Image } from '@shopify/react-native-skia';
+import { Group, Canvas, Rect, Circle, Path, RoundedRect, Oval, DashPathEffect, Line, vec, matchFont, Text as Text$1, Image } from '@shopify/react-native-skia';
 import { memo, forwardRef, useState, useRef, useCallback, useEffect, useMemo, useImperativeHandle } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { StyleSheet, PanResponder, View, Pressable, Text as Text$1, ScrollView } from 'react-native';
+import { StyleSheet, PanResponder, View, Modal, Text, TextInput, Pressable, ScrollView } from 'react-native';
 
 // src/math/rect.ts
 function rectsIntersect(a, b) {
@@ -1463,6 +1463,12 @@ function linkInitial(value) {
   const first = value.trim().charAt(0).toUpperCase();
   return first || "L";
 }
+function normalizeNativeLinkHref(value) {
+  const trimmed = value.trim();
+  if (!trimmed) return null;
+  if (/^[a-z][a-z0-9+.-]*:/i.test(trimmed)) return trimmed;
+  return `https://${trimmed}`;
+}
 function buildNativeLinkCardDisplay(link) {
   const hostname = linkHostname(link.href);
   const title = link.title?.trim() || hostname || "Link";
@@ -1707,6 +1713,11 @@ function rgbaFromHexAndOpacity(hex, opacity) {
 function toNum(v) {
   return typeof v === "number" ? v : Number(v) || 0;
 }
+function dashIntervalsFromStrokeDasharray(strokeDasharray) {
+  if (!strokeDasharray) return null;
+  const intervals = strokeDasharray.split(/[\s,]+/).map((part) => Number(part)).filter((part) => Number.isFinite(part) && part > 0);
+  return intervals.length > 0 ? intervals : null;
+}
 function SvgNodeRenderer({ nodes }) {
   return /* @__PURE__ */ jsx(Fragment, { children: nodes.map((node, i) => /* @__PURE__ */ jsx(SvgNodeItem, { node }, i)) });
 }
@@ -1821,6 +1832,7 @@ function SvgNodeItem({ node }) {
       const stroke = rgbaFromHexAndOpacity(node.stroke, node.strokeOpacity);
       const fill = isFill ? rgbaFromHexAndOpacity(node.fill, node.fillOpacity) ?? node.fill : void 0;
       const style = fill && fill !== "none" ? "fill" : "stroke";
+      const intervals = style === "stroke" ? dashIntervalsFromStrokeDasharray(node.strokeDasharray) : null;
       return /* @__PURE__ */ jsx(
         Path,
         {
@@ -1831,7 +1843,8 @@ function SvgNodeItem({ node }) {
           strokeCap: node.strokeLinecap === "round" ? "round" : "butt",
           strokeJoin: node.strokeLinejoin === "round" ? "round" : "miter",
           fillType: node.fillRule === "evenodd" ? "evenOdd" : "winding",
-          antiAlias: true
+          antiAlias: true,
+          children: intervals ? /* @__PURE__ */ jsx(DashPathEffect, { intervals }) : null
         }
       );
     }
@@ -1840,7 +1853,7 @@ function SvgNodeItem({ node }) {
       const fs = node.fontSize != null ? toNum(node.fontSize) : 16;
       const font = matchFont({ fontSize: fs });
       return /* @__PURE__ */ jsx(Fragment, { children: node.children.map((tspan, i) => /* @__PURE__ */ jsx(
-        Text,
+        Text$1,
         {
           x: tspan.x != null ? toNum(tspan.x) : node.x != null ? toNum(node.x) : 0,
           y: tspan.dy != null ? (node.y != null ? toNum(node.y) : fs) + toNum(tspan.dy) : (node.y != null ? toNum(node.y) : fs) + i * fs * 1.2,
@@ -2014,6 +2027,7 @@ function parsePathNode(attrs) {
     strokeOpacity: parseNumOpt(attrs["stroke-opacity"]),
     strokeLinecap: attrs["stroke-linecap"],
     strokeLinejoin: attrs["stroke-linejoin"],
+    strokeDasharray: attrs["stroke-dasharray"],
     shapeRendering: attrs["shape-rendering"],
     vectorEffect: attrs["vector-effect"]
   };
@@ -2231,7 +2245,7 @@ function NativeLinkCardRenderer({
       }
     ),
     /* @__PURE__ */ jsx(
-      Text,
+      Text$1,
       {
         x: 29.5,
         y: 41,
@@ -2240,7 +2254,7 @@ function NativeLinkCardRenderer({
         font: initialFont
       }
     ),
-    /* @__PURE__ */ jsx(Group, { clip: { x: 69, y: 13, width: 215, height: 24 }, children: /* @__PURE__ */ jsx(Text, { x: 69, y: 32, text: title, color: "#1f2937", font: titleFont }) }),
+    /* @__PURE__ */ jsx(Group, { clip: { x: 69, y: 13, width: 215, height: 24 }, children: /* @__PURE__ */ jsx(Text$1, { x: 69, y: 32, text: title, color: "#1f2937", font: titleFont }) }),
     display.secure ? /* @__PURE__ */ jsxs(Group, { transform: [{ translateX: 69 }, { translateY: 41 }], children: [
       /* @__PURE__ */ jsx(
         Rect,
@@ -2267,7 +2281,7 @@ function NativeLinkCardRenderer({
       )
     ] }) : null,
     /* @__PURE__ */ jsx(Group, { clip: { x: subtitleX, y: 34, width: subtitleWidth, height: 22 }, children: /* @__PURE__ */ jsx(
-      Text,
+      Text$1,
       {
         x: subtitleX,
         y: 51,
@@ -2415,7 +2429,7 @@ function NativeShapeRenderer({ item }) {
     const lines = item.text.split("\n");
     const font = matchFont({ fontSize: fs });
     return /* @__PURE__ */ jsx(Fragment, { children: lines.map((line, i) => /* @__PURE__ */ jsx(
-      Text,
+      Text$1,
       {
         x: 0,
         y: fs + i * fs * 1.2,
@@ -2638,7 +2652,7 @@ function pointsToSmoothPathD(points) {
   const d = smoothFreehandPointsToPathD(points);
   return d || null;
 }
-function dashIntervalsFromStrokeDasharray(strokeDasharray) {
+function dashIntervalsFromStrokeDasharray2(strokeDasharray) {
   if (!strokeDasharray) return null;
   const intervals = strokeDasharray.split(/\s+/).map((part) => Number(part)).filter((part) => Number.isFinite(part) && part > 0);
   return intervals.length > 0 ? intervals : null;
@@ -2928,7 +2942,7 @@ function NativeInteractionOverlay({
         );
       }
       if (payload.kind === "strokePath") {
-        const intervals = dashIntervalsFromStrokeDasharray(payload.strokeDasharray);
+        const intervals = dashIntervalsFromStrokeDasharray2(payload.strokeDasharray);
         return /* @__PURE__ */ jsx(
           Path,
           {
@@ -3161,7 +3175,7 @@ function NativeInteractionOverlay({
           }
         ),
         peer.displayName ? /* @__PURE__ */ jsx(
-          Text,
+          Text$1,
           {
             x: cursor.x + labelOffsetX,
             y: cursor.y + labelOffsetY,
@@ -3435,7 +3449,7 @@ function RangeControl({
         ]
       }
     ),
-    valueLabel ? /* @__PURE__ */ jsx(Text$1, { style: styles.rangeValue, children: valueLabel }) : null
+    valueLabel ? /* @__PURE__ */ jsx(Text, { style: styles.rangeValue, children: valueLabel }) : null
   ] });
 }
 function InspectorSection({
@@ -3443,7 +3457,7 @@ function InspectorSection({
   children
 }) {
   return /* @__PURE__ */ jsxs(View, { style: styles.section, children: [
-    /* @__PURE__ */ jsx(Text$1, { style: styles.sectionLabel, children: label }),
+    /* @__PURE__ */ jsx(Text, { style: styles.sectionLabel, children: label }),
     children
   ] });
 }
@@ -3465,7 +3479,7 @@ function SegmentControl({
         children: [
           segment.preview,
           /* @__PURE__ */ jsx(
-            Text$1,
+            Text,
             {
               style: [
                 styles.segmentLabel,
@@ -3911,7 +3925,7 @@ function NativeVectorToolbar({
                       disabled: toolLockDisabled,
                       foregroundColor: "#18181b",
                       onToggle: toggleToolLock
-                    }) ?? /* @__PURE__ */ jsx(Text$1, { style: styles2.lockGlyph, children: toolLocked ? "L" : "U" })
+                    }) ?? /* @__PURE__ */ jsx(Text, { style: styles2.lockGlyph, children: toolLocked ? "L" : "U" })
                   }
                 ),
                 /* @__PURE__ */ jsx(View, { style: styles2.toolLockDivider })
@@ -3958,8 +3972,8 @@ function NativeVectorToolbar({
                       disabled,
                       foregroundColor: "#18181b",
                       onSelect: () => onChange(activeOverflowTool.id)
-                    }) ?? renderNativeToolFallback(activeOverflowTool, "#18181b") : renderOverflowIcon?.(overflowRenderInput) ?? /* @__PURE__ */ jsx(Text$1, { style: styles2.shapesGlyph, children: "S" }) }),
-                    renderOverflowChevronIcon?.(overflowRenderInput) ?? /* @__PURE__ */ jsx(Text$1, { style: styles2.chevronGlyph, children: overflowOpen ? "^" : "v" })
+                    }) ?? renderNativeToolFallback(activeOverflowTool, "#18181b") : renderOverflowIcon?.(overflowRenderInput) ?? /* @__PURE__ */ jsx(Text, { style: styles2.shapesGlyph, children: "S" }) }),
+                    renderOverflowChevronIcon?.(overflowRenderInput) ?? /* @__PURE__ */ jsx(Text, { style: styles2.chevronGlyph, children: overflowOpen ? "^" : "v" })
                   ]
                 }
               ) : null
@@ -4029,7 +4043,7 @@ function renderNativeToolButton(input) {
       children: [
         /* @__PURE__ */ jsx(View, { style: styles2.iconSlot, children: icon }),
         input.density === "comfortable" ? /* @__PURE__ */ jsx(
-          Text$1,
+          Text,
           {
             numberOfLines: 1,
             style: [
@@ -4053,7 +4067,7 @@ function renderNativeToolFallback(tool, foregroundColor, toolLabelStyle) {
   if (tool.id === "link") {
     return /* @__PURE__ */ jsx(NativeLinkToolIcon, { color: foregroundColor });
   }
-  return /* @__PURE__ */ jsx(Text$1, { style: [styles2.shortLabel, { color: foregroundColor }, toolLabelStyle], children: tool.shortLabel ?? tool.label.slice(0, 1).toUpperCase() });
+  return /* @__PURE__ */ jsx(Text, { style: [styles2.shortLabel, { color: foregroundColor }, toolLabelStyle], children: tool.shortLabel ?? tool.label.slice(0, 1).toUpperCase() });
 }
 var styles2 = StyleSheet.create({
   shell: {
@@ -4651,6 +4665,13 @@ function resizeItemByHandle(item, start, handle, currentWorld) {
   }
   return { ...item, x: nb.x, y: nb.y, bounds: nb };
 }
+var DEFAULT_NATIVE_LINK_TOOL_DIALOG_LABELS = {
+  title: "Add link",
+  description: "Paste the link you want to add to the board.",
+  inputPlaceholder: "https://example.com",
+  cancelLabel: "Cancel",
+  addLabel: "Add"
+};
 var MIN_PLACE_SIZE = 8;
 var MIN_ARROW_DRAG_PX = 8;
 var TAP_PX = 20;
@@ -4734,6 +4755,7 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
   onItemsChange,
   onToolChangeRequest,
   onLinkToolRequest,
+  linkToolDialogLabels,
   onWorldPointerDown,
   onWorldPointerMove,
   onWorldPointerLeave,
@@ -4788,6 +4810,8 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
   );
   const [eraserTrail, setEraserTrail] = useState([]);
   const [laserTrail, setLaserTrail] = useState([]);
+  const [pendingNativeLinkRequest, setPendingNativeLinkRequest] = useState(null);
+  const [nativeLinkInputValue, setNativeLinkInputValue] = useState("");
   const laserClearTimerRef = useRef(null);
   const strokeStyleRef = useRef({ ...DEFAULT_STROKE_STYLE });
   const markerStrokeStyleRef = useRef({ ...MARKER_TOOL_STYLE });
@@ -4865,6 +4889,21 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
       onToolChangeRequestRef.current?.("select");
     }
   }, []);
+  const requestSelectToolAfterNativeLinkUse = useCallback(() => {
+    onToolChangeRequestRef.current?.("select");
+  }, []);
+  const closeNativeLinkDialog = useCallback(() => {
+    setPendingNativeLinkRequest(null);
+    setNativeLinkInputValue("");
+  }, []);
+  const submitNativeLinkDialog = useCallback(() => {
+    const href = normalizeNativeLinkHref(nativeLinkInputValue);
+    if (!href || !pendingNativeLinkRequest) return;
+    const inserted = pendingNativeLinkRequest.insertLink({ href });
+    if (inserted) {
+      closeNativeLinkDialog();
+    }
+  }, [closeNativeLinkDialog, nativeLinkInputValue, pendingNativeLinkRequest]);
   if (!cameraRef.current) {
     cameraRef.current = new Camera2D({ minZoom: 0.05, maxZoom: 32 });
   }
@@ -5442,7 +5481,7 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
             const item = createLinkItem(id, options.bounds ?? suggestedBounds, link);
             currentChange([...itemsRef.current, item]);
             onSelectionChangeRef.current?.([id]);
-            requestSelectToolAfterUse();
+            requestSelectToolAfterNativeLinkUse();
             return item;
           };
           const requestLink = onLinkToolRequestRef.current;
@@ -5458,17 +5497,16 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
             });
             return;
           }
-          const handleWorldPointerDown = onWorldPointerDownRef.current;
-          if (handleWorldPointerDown) {
-            handleWorldPointerDown({
-              toolId: "link",
-              worldX: st.startWorld.x,
-              worldY: st.startWorld.y,
-              screenX: st.startScreen.x,
-              screenY: st.startScreen.y
-            });
-            requestSelectToolAfterUse();
-          }
+          setNativeLinkInputValue("");
+          setPendingNativeLinkRequest({
+            toolId: "link",
+            worldX: st.startWorld.x,
+            worldY: st.startWorld.y,
+            screenX: st.startScreen.x,
+            screenY: st.startScreen.y,
+            suggestedBounds,
+            insertLink
+          });
           return;
         }
         if (!change) return;
@@ -5518,6 +5556,7 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
       dragStateRef.current = { kind: "idle" };
     },
     [
+      requestSelectToolAfterNativeLinkUse,
       requestSelectToolAfterUse,
       screenToWorld,
       setRealtimePlacementPreview,
@@ -5649,7 +5688,13 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
     [requestRender, size]
   );
   const activeStyleToolId = toolId === "draw" || toolId === "marker" ? toolId : null;
-  return /* @__PURE__ */ jsx(
+  const nativeLinkDialogLabels = {
+    ...DEFAULT_NATIVE_LINK_TOOL_DIALOG_LABELS,
+    ...linkToolDialogLabels ?? {}
+  };
+  const normalizedNativeLinkHref = normalizeNativeLinkHref(nativeLinkInputValue);
+  const nativeLinkCanSubmit = pendingNativeLinkRequest !== null && normalizedNativeLinkHref !== null && onItemsChange != null;
+  return /* @__PURE__ */ jsxs(
     View,
     {
       style: { flex: 1, overflow: "hidden" },
@@ -5663,80 +5708,225 @@ var NativeVectorViewport = forwardRef(function NativeVectorViewport2({
         notifyWorldPointerLeave();
       },
       ...panResponder.panHandlers,
-      children: size.width > 0 && size.height > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+      children: [
+        size.width > 0 && size.height > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            NativeSceneRenderer,
+            {
+              items: sceneItems,
+              camera,
+              width: size.width,
+              height: size.height
+            }
+          ),
+          interactive && /* @__PURE__ */ jsx(
+            NativeInteractionOverlay,
+            {
+              camera,
+              width: size.width,
+              height: size.height,
+              selectedItems,
+              showResizeHandles,
+              placementPreview,
+              laserTrail,
+              eraserTrail,
+              eraserPreviewItems: items.filter(
+                (it) => eraserPreviewIds.includes(it.id)
+              ),
+              previewStrokeStyle: strokeStyleState,
+              remotePresence
+            }
+          ),
+          interactive && showStyleInspector && activeStyleToolId ? /* @__PURE__ */ jsx(
+            View,
+            {
+              pointerEvents: "box-none",
+              style: styleInspectorPlacement === "top-left" ? {
+                position: "absolute",
+                left: 16,
+                top: 104,
+                alignItems: "flex-start"
+              } : {
+                position: "absolute",
+                left: 16,
+                right: 16,
+                bottom: 84,
+                alignItems: "center"
+              },
+              children: /* @__PURE__ */ jsx(
+                NativeVectorStyleInspector,
+                {
+                  toolId: activeStyleToolId,
+                  value: strokeStyleState,
+                  onChange: patchCurrentStrokeStyle
+                }
+              )
+            }
+          ) : null,
+          toolbar && /* @__PURE__ */ jsx(
+            View,
+            {
+              style: {
+                position: "absolute",
+                bottom: 16,
+                left: 16,
+                right: 16,
+                flexDirection: "row",
+                justifyContent: "center",
+                alignItems: "center"
+              },
+              pointerEvents: "box-none",
+              children: toolbar
+            }
+          )
+        ] }),
         /* @__PURE__ */ jsx(
-          NativeSceneRenderer,
-          {
-            items: sceneItems,
-            camera,
-            width: size.width,
-            height: size.height
-          }
-        ),
-        interactive && /* @__PURE__ */ jsx(
-          NativeInteractionOverlay,
-          {
-            camera,
-            width: size.width,
-            height: size.height,
-            selectedItems,
-            showResizeHandles,
-            placementPreview,
-            laserTrail,
-            eraserTrail,
-            eraserPreviewItems: items.filter(
-              (it) => eraserPreviewIds.includes(it.id)
-            ),
-            previewStrokeStyle: strokeStyleState,
-            remotePresence
-          }
-        ),
-        interactive && showStyleInspector && activeStyleToolId ? /* @__PURE__ */ jsx(
-          View,
-          {
-            pointerEvents: "box-none",
-            style: styleInspectorPlacement === "top-left" ? {
-              position: "absolute",
-              left: 16,
-              top: 104,
-              alignItems: "flex-start"
-            } : {
-              position: "absolute",
-              left: 16,
-              right: 16,
-              bottom: 84,
-              alignItems: "center"
-            },
-            children: /* @__PURE__ */ jsx(
-              NativeVectorStyleInspector,
-              {
-                toolId: activeStyleToolId,
-                value: strokeStyleState,
-                onChange: patchCurrentStrokeStyle
-              }
-            )
-          }
-        ) : null,
-        toolbar && /* @__PURE__ */ jsx(
-          View,
+          Modal,
           {
-            style: {
-              position: "absolute",
-              bottom: 16,
-              left: 16,
-              right: 16,
-              flexDirection: "row",
-              justifyContent: "center",
-              alignItems: "center"
-            },
-            pointerEvents: "box-none",
-            children: toolbar
+            animationType: "fade",
+            transparent: true,
+            visible: pendingNativeLinkRequest !== null,
+            onRequestClose: closeNativeLinkDialog,
+            children: /* @__PURE__ */ jsx(View, { style: styles3.nativeLinkDialogBackdrop, children: /* @__PURE__ */ jsxs(View, { style: styles3.nativeLinkDialogCard, children: [
+              /* @__PURE__ */ jsx(Text, { style: styles3.nativeLinkDialogTitle, children: nativeLinkDialogLabels.title }),
+              /* @__PURE__ */ jsx(Text, { style: styles3.nativeLinkDialogDescription, children: nativeLinkDialogLabels.description }),
+              /* @__PURE__ */ jsx(
+                TextInput,
+                {
+                  accessibilityLabel: nativeLinkDialogLabels.title,
+                  autoCapitalize: "none",
+                  autoCorrect: false,
+                  keyboardType: "url",
+                  onChangeText: setNativeLinkInputValue,
+                  onSubmitEditing: submitNativeLinkDialog,
+                  placeholder: nativeLinkDialogLabels.inputPlaceholder,
+                  returnKeyType: "done",
+                  style: styles3.nativeLinkDialogInput,
+                  value: nativeLinkInputValue
+                }
+              ),
+              /* @__PURE__ */ jsxs(View, { style: styles3.nativeLinkDialogActions, children: [
+                /* @__PURE__ */ jsx(
+                  Pressable,
+                  {
+                    accessibilityRole: "button",
+                    onPress: closeNativeLinkDialog,
+                    style: ({ pressed }) => [
+                      styles3.nativeLinkDialogButton,
+                      pressed ? styles3.nativeLinkDialogButtonPressed : void 0
+                    ],
+                    children: /* @__PURE__ */ jsx(Text, { style: styles3.nativeLinkDialogButtonText, children: nativeLinkDialogLabels.cancelLabel })
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Pressable,
+                  {
+                    accessibilityRole: "button",
+                    accessibilityState: { disabled: !nativeLinkCanSubmit },
+                    disabled: !nativeLinkCanSubmit,
+                    onPress: submitNativeLinkDialog,
+                    style: ({ pressed }) => [
+                      styles3.nativeLinkDialogButton,
+                      styles3.nativeLinkDialogPrimaryButton,
+                      pressed && nativeLinkCanSubmit ? styles3.nativeLinkDialogPrimaryButtonPressed : void 0,
+                      !nativeLinkCanSubmit ? styles3.nativeLinkDialogDisabledButton : void 0
+                    ],
+                    children: /* @__PURE__ */ jsx(Text, { style: styles3.nativeLinkDialogPrimaryButtonText, children: nativeLinkDialogLabels.addLabel })
+                  }
+                )
+              ] })
+            ] }) })
           }
         )
-      ] })
+      ]
     }
   );
 });
+var styles3 = StyleSheet.create({
+  nativeLinkDialogBackdrop: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    paddingHorizontal: 24,
+    backgroundColor: "rgba(0, 0, 0, 0.45)"
+  },
+  nativeLinkDialogCard: {
+    width: "100%",
+    maxWidth: 480,
+    padding: 24,
+    borderRadius: 16,
+    backgroundColor: "#ffffff",
+    shadowColor: "#000000",
+    shadowOpacity: 0.18,
+    shadowRadius: 24,
+    shadowOffset: { width: 0, height: 8 },
+    elevation: 12
+  },
+  nativeLinkDialogTitle: {
+    color: "#111827",
+    fontSize: 24,
+    fontWeight: "700",
+    lineHeight: 30
+  },
+  nativeLinkDialogDescription: {
+    marginTop: 12,
+    color: "#6b7280",
+    fontSize: 16,
+    lineHeight: 22
+  },
+  nativeLinkDialogInput: {
+    marginTop: 24,
+    height: 52,
+    paddingHorizontal: 14,
+    borderRadius: 10,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: "#d1d5db",
+    color: "#111827",
+    fontSize: 18,
+    backgroundColor: "#ffffff"
+  },
+  nativeLinkDialogActions: {
+    marginTop: 24,
+    flexDirection: "row",
+    justifyContent: "flex-end",
+    gap: 12
+  },
+  nativeLinkDialogButton: {
+    minWidth: 92,
+    height: 48,
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: 10,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: "#d1d5db",
+    backgroundColor: "#ffffff",
+    paddingHorizontal: 18
+  },
+  nativeLinkDialogButtonPressed: {
+    backgroundColor: "#f3f4f6"
+  },
+  nativeLinkDialogButtonText: {
+    color: "#111827",
+    fontSize: 17,
+    fontWeight: "600"
+  },
+  nativeLinkDialogPrimaryButton: {
+    borderColor: "#18181b",
+    backgroundColor: "#18181b"
+  },
+  nativeLinkDialogPrimaryButtonPressed: {
+    backgroundColor: "#27272a"
+  },
+  nativeLinkDialogDisabledButton: {
+    borderColor: "#9ca3af",
+    backgroundColor: "#9ca3af"
+  },
+  nativeLinkDialogPrimaryButtonText: {
+    color: "#ffffff",
+    fontSize: 17,
+    fontWeight: "700"
+  }
+});
 
 export { DEFAULT_LINK_CARD_SIZE, DEFAULT_NATIVE_OVERFLOW_TOOL_IDS, DEFAULT_NATIVE_VECTOR_TOOLS, NATIVE_STYLE_PALETTE, NativeInteractionOverlay, NativeSceneRenderer, NativeShapeRenderer, NativeVectorStyleInspector, NativeVectorToolbar, NativeVectorViewport, createFreehandStrokeItem, createImageItem, createLinkItem, createShapeId, getLinkData, isLinkItem, nativeStyleColorWithOpacity, normalizeNativeStyleHex, parseSvgFragment };
 //# sourceMappingURL=native.js.map