nn-widgets 0.1.17 → 0.1.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nn-widgets",
-  "version": "0.1.17",
+  "version": "0.1.18",
   "description": "Expo config plugin for adding native widgets (iOS WidgetKit & Android App Widgets)",
   "main": "build/index.js",
   "types": "build/index.d.ts",

package/plugin/build/withAndroidWidget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"withAndroidWidget.d.ts","sourceRoot":"","sources":["../src/withAndroidWidget.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAuB,MAAM,sBAAsB,CAAC;AAGzE,OAAO,KAAK,EACV,oBAAoB,EAGrB,MAAM,SAAS,CAAC;AAo8BjB,eAAO,MAAM,iBAAiB,EAAE,YAAY,CAAC,oBAAoB,CAmPhE,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"withAndroidWidget.d.ts","sourceRoot":"","sources":["../src/withAndroidWidget.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAuB,MAAM,sBAAsB,CAAC;AAGzE,OAAO,KAAK,EACV,oBAAoB,EAGrB,MAAM,SAAS,CAAC;AAmgCjB,eAAO,MAAM,iBAAiB,EAAE,YAAY,CAAC,oBAAoB,CAyQhE,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/plugin/build/withAndroidWidget.js

@@ -39,6 +39,38 @@ const fs = __importStar(require("fs"));
 const path = __importStar(require("path"));
 const withIosWidget_1 = require("./withIosWidget");
 // ──────────────────────────────────────────────
+//  Constants and helpers
+// ──────────────────────────────────────────────
+// Material background names that should use blur effect on Android 12+
+const BLUR_BACKGROUNDS = [
+    "blur",
+    "ultraThinMaterial",
+    "thinMaterial",
+    "regularMaterial",
+    "thickMaterial",
+    "ultraThickMaterial",
+];
+/**
+ * Check if backgroundColor should use blur effect
+ */
+function isBlurBackground(bgColor) {
+    return bgColor ? BLUR_BACKGROUNDS.includes(bgColor) : false;
+}
+/**
+ * Resolve Android background attribute for XML.
+ * - If blur/material: use system widget background (API 31+) or transparent
+ * - Otherwise: use the color directly
+ */
+function resolveAndroidBackground(bgColor) {
+    if (!bgColor)
+        return "#FFFFFF";
+    if (isBlurBackground(bgColor)) {
+        // Will be handled by drawable resource
+        return "@drawable/widget_blur_background";
+    }
+    return bgColor;
+}
+// ──────────────────────────────────────────────
 //  Code generation helpers (per widget)
 // ──────────────────────────────────────────────
 function generateWidgetProviderCode(w, packageName, deepLinkUrl) {
@@ -646,7 +678,7 @@ function generateWidgetLayoutXml(w) {
     }
     // ── List layout ──
     if (w.type === "list") {
-        const bgColor = w.style?.backgroundColor || "#FFFFFF";
+        const bgColor = resolveAndroidBackground(w.style?.backgroundColor);
         const titleColor = w.style?.titleColor || "#000000";
         const subtitleColor = w.style?.subtitleColor || "#888888";
         return `<?xml version="1.0" encoding="utf-8"?>
@@ -699,7 +731,7 @@ function generateWidgetLayoutXml(w) {
     }
     // ── Flex-grid layout ──
     if (w.type === "flex-grid") {
-        const bgColor = w.style?.backgroundColor || "#FFFFFF";
+        const bgColor = resolveAndroidBackground(w.style?.backgroundColor);
         const titleColor = w.style?.titleColor || "#000000";
         const subtitleColor = w.style?.subtitleColor || "#888888";
         return `<?xml version="1.0" encoding="utf-8"?>
@@ -751,7 +783,7 @@ function generateWidgetLayoutXml(w) {
 `;
     }
     // ── Single (default) styled text layout ──
-    const bgColor = w.style?.backgroundColor || "#FFFFFF";
+    const bgColor = resolveAndroidBackground(w.style?.backgroundColor);
     const titleColor = w.style?.titleColor || "#000000";
     const subtitleColor = w.style?.subtitleColor || "#888888";
     const accentColor = w.style?.accentColor || "#6200EE";
@@ -948,6 +980,32 @@ function generateFlexGridCellCardLayoutXml(w) {
 </LinearLayout>
 `;
 }
+/**
+ * Generate blur background drawable for API 31+ (Android 12+)
+ * Uses the system widget background with rounded corners
+ */
+function generateBlurBackgroundDrawableV31() {
+    return `<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <corners android:radius="16dp" />
+    <solid android:color="@android:color/system_accent1_50" />
+</shape>
+`;
+}
+/**
+ * Generate blur background drawable for pre-API 31 (fallback)
+ * Uses semi-transparent white with rounded corners
+ */
+function generateBlurBackgroundDrawableFallback() {
+    return `<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <corners android:radius="16dp" />
+    <solid android:color="#E6FFFFFF" />
+</shape>
+`;
+}
 function generateWidgetInfoXml(w, updatePeriodMillis) {
     return `<?xml version="1.0" encoding="utf-8"?>
 <appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
@@ -979,17 +1037,29 @@ const withAndroidWidget = (config, props = {}) => {
         const resXmlPath = path.join(androidPath, "res", "xml");
         const resValuesPath = path.join(androidPath, "res", "values");
         const resDrawablePath = path.join(androidPath, "res", "drawable");
+        const resDrawableV31Path = path.join(androidPath, "res", "drawable-v31");
         [
             widgetPackagePath,
             resLayoutPath,
             resXmlPath,
             resValuesPath,
             resDrawablePath,
+            resDrawableV31Path,
         ].forEach((dir) => {
             if (!fs.existsSync(dir)) {
                 fs.mkdirSync(dir, { recursive: true });
             }
         });
+        // Check if any widget uses blur background
+        const hasBlurWidget = resolvedProps.widgets.some((w) => isBlurBackground(w.style?.backgroundColor));
+        // Generate blur background drawables if needed
+        if (hasBlurWidget) {
+            // Fallback drawable (pre-API 31)
+            fs.writeFileSync(path.join(resDrawablePath, "widget_blur_background.xml"), generateBlurBackgroundDrawableFallback());
+            // API 31+ drawable
+            fs.writeFileSync(path.join(resDrawableV31Path, "widget_blur_background.xml"), generateBlurBackgroundDrawableV31());
+            console.log("[nn-widgets] Generated Android blur background drawables");
+        }
         // Generate files for each widget
         for (const w of resolvedProps.widgets) {
             // Widget provider Kotlin