database-devtools 0.1.4 → 0.1.5

package/dist/{DatabaseDevTools-CdpQJBqG.d.ts → DatabaseDevTools-CQXd9NST.d.ts}

@@ -32,8 +32,12 @@ type DatabaseDevToolsProps = {
     onFloatingPositionChange?: (position: FloatingButtonPosition) => void;
     /** Optional style for the floating button database icon. */
     style?: StyleProp<TextStyle>;
+    /** Floating button background color. */
+    buttonColor?: string;
+    /** Database icon color. */
+    iconColor?: string;
     onConnectionStateChange?: (state: ConnectionState) => void;
 };
-declare function DatabaseDevTools({ database, type, adapter, serverUrl, enabled, position, draggable, snapToEdges, floatingPosition, onFloatingPositionChange, style, onConnectionStateChange, }: DatabaseDevToolsProps): react_jsx_runtime.JSX.Element | null;
+declare function DatabaseDevTools({ database, type, adapter, serverUrl, enabled, position, draggable, snapToEdges, floatingPosition, onFloatingPositionChange, style, buttonColor, iconColor, onConnectionStateChange, }: DatabaseDevToolsProps): react_jsx_runtime.JSX.Element | null;
 
 export { DatabaseDevTools as D, type FloatingButtonPosition as F, type DatabaseDevToolsProps as a, type DatabaseDialect as b };

package/dist/{DatabaseDevTools-sw1wX5nW.d.cts → DatabaseDevTools-CZmvO9uq.d.cts}

@@ -32,8 +32,12 @@ type DatabaseDevToolsProps = {
     onFloatingPositionChange?: (position: FloatingButtonPosition) => void;
     /** Optional style for the floating button database icon. */
     style?: StyleProp<TextStyle>;
+    /** Floating button background color. */
+    buttonColor?: string;
+    /** Database icon color. */
+    iconColor?: string;
     onConnectionStateChange?: (state: ConnectionState) => void;
 };
-declare function DatabaseDevTools({ database, type, adapter, serverUrl, enabled, position, draggable, snapToEdges, floatingPosition, onFloatingPositionChange, style, onConnectionStateChange, }: DatabaseDevToolsProps): react_jsx_runtime.JSX.Element | null;
+declare function DatabaseDevTools({ database, type, adapter, serverUrl, enabled, position, draggable, snapToEdges, floatingPosition, onFloatingPositionChange, style, buttonColor, iconColor, onConnectionStateChange, }: DatabaseDevToolsProps): react_jsx_runtime.JSX.Element | null;
 
 export { DatabaseDevTools as D, type FloatingButtonPosition as F, type DatabaseDevToolsProps as a, type DatabaseDialect as b };

package/dist/{chunk-KIQ3TEVO.js → chunk-SFLXGLHQ.js}

@@ -1344,9 +1344,12 @@ function isFloatingButtonTap(totalMovement) {
 }
 var DEFAULT_ICON_SIZE = 22;
 var DEFAULT_ICON_COLOR = "#f8fafc";
+var DEFAULT_BUTTON_COLOR = "#1e293b";
 function FloatingDevToolsButton({
   position = "bottom-right",
   iconStyle,
+  buttonColor,
+  iconColor,
   draggable = true,
   snapToEdges = true,
   floatingPosition,
@@ -1450,22 +1453,24 @@ function FloatingDevToolsButton({
   if (!renderedPosition) {
     return null;
   }
+  const resolvedButtonColor = buttonColor ?? DEFAULT_BUTTON_COLOR;
+  const resolvedIconColor = iconColor ?? StyleSheet.flatten(iconStyle)?.color ?? DEFAULT_ICON_COLOR;
+  const buttonStyle = { backgroundColor: resolvedButtonColor };
+  const statusDotStyle = {
+    backgroundColor: getConnectionDotColor(connectionState),
+    borderColor: resolvedButtonColor
+  };
   const buttonContent = /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       MaterialCommunityIcons,
       {
-        color: DEFAULT_ICON_COLOR,
+        color: resolvedIconColor,
         name: "database",
         size: DEFAULT_ICON_SIZE,
         style: iconStyle
       }
     ),
-    /* @__PURE__ */ jsx(
-      View,
-      {
-        style: [styles4.statusDot, { backgroundColor: getConnectionDotColor(connectionState) }]
-      }
-    )
+    /* @__PURE__ */ jsx(View, { style: [styles4.statusDot, statusDotStyle] })
   ] });
   if (!draggable) {
     const positionStyle = position === "bottom-left" ? styles4.bottomLeft : styles4.bottomRight;
@@ -1475,7 +1480,11 @@ function FloatingDevToolsButton({
         accessibilityLabel: "Open Database DevTools",
         accessibilityRole: "button",
         onPress: openLauncher,
-        style: ({ pressed }) => [styles4.button, pressed && styles4.buttonPressed],
+        style: ({ pressed }) => [
+          styles4.button,
+          buttonStyle,
+          pressed && styles4.buttonPressed
+        ],
         children: buttonContent
       }
     ) });
@@ -1500,7 +1509,7 @@ function FloatingDevToolsButton({
           accessibilityHint: "Drag to move. Tap to open DevTools launcher.",
           accessibilityLabel: "Open Database DevTools",
           accessibilityRole: "button",
-          style: [styles4.button, dragPosition && styles4.buttonDragging],
+          style: [styles4.button, buttonStyle, dragPosition && styles4.buttonDragging],
           children: buttonContent
         }
       )
@@ -1529,7 +1538,6 @@ var styles4 = StyleSheet.create({
     width: FLOATING_BUTTON_SIZE,
     height: FLOATING_BUTTON_SIZE,
     borderRadius: FLOATING_BUTTON_SIZE / 2,
-    backgroundColor: "#1e293b",
     alignItems: "center",
     justifyContent: "center",
     shadowColor: "#000",
@@ -1552,8 +1560,7 @@ var styles4 = StyleSheet.create({
     width: 10,
     height: 10,
     borderRadius: 5,
-    borderWidth: 2,
-    borderColor: "#1e293b"
+    borderWidth: 2
   }
 });
 var explorerColors = {
@@ -2696,6 +2703,8 @@ function DatabaseDevTools({
   floatingPosition,
   onFloatingPositionChange,
   style,
+  buttonColor,
+  iconColor,
   onConnectionStateChange
 }) {
   if (!isDevToolsEnabled(enabled)) {
@@ -2713,8 +2722,10 @@ function DatabaseDevTools({
         /* @__PURE__ */ jsx(
           FloatingDevToolsButton,
           {
+            buttonColor,
             draggable,
             floatingPosition,
+            iconColor,
             iconStyle: style,
             onFloatingPositionChange,
             position,
@@ -2730,5 +2741,5 @@ function DatabaseDevTools({
 }
 
 export { DatabaseDevTools, createExpoSqliteInspector, handleBeginTransaction, handleCommitTransaction, handleExecuteWrite, handleRollbackTransaction, isEditableDatabaseAdapter, isWritableDatabaseAdapter };
-//# sourceMappingURL=chunk-KIQ3TEVO.js.map
-//# sourceMappingURL=chunk-KIQ3TEVO.js.map
+//# sourceMappingURL=chunk-SFLXGLHQ.js.map
+//# sourceMappingURL=chunk-SFLXGLHQ.js.map