rn-css 1.11.10 → 1.11.11

package/dist/convertUnits.js

@@ -17,7 +17,7 @@ function convertValue(key, value, units) {
         return 0;
     }
     // colors should be left untouched
-    if (value.startsWith('#'))
+    if (value.startsWith('#') || value.startsWith('linear-gradient'))
         return value;
     // Percentage values need to rely on an other unit as reference
     const finalUnits = { ...units };

package/dist/cssToRN/convert.js

@@ -136,7 +136,9 @@ function placeContent(value) {
 exports.placeContent = placeContent;
 function background(value) {
     const values = value.match(/(linear-gradient\(|url\().*?\)|[^\s]+/mg) || [];
-    const backgroundColor = values.reverse().find(isColor) || 'transparent';
+    const backgroundColor = values.reverse().find(isColor) ||
+        (values[0]?.startsWith('linear-gradient') && values[0].split(',').map(val => val.trim()).find(isColor)) ||
+        'transparent';
     // We support everything on web
     return react_native_1.Platform.OS === 'web' ? { backgroundColor, background: value } : { backgroundColor };
 }

package/dist/styleComponent.js

@@ -26,7 +26,7 @@ function buildCSSString(chunks, functs, props, shared) {
         .map((chunk, i) => ([chunk, (functs[i] instanceof Function) ? functs[i]({ shared, theme: shared, ...props }) : functs[i]]))
         .flat()
         // Convert the objects to string if the result is not a primitive
-        .map(chunk => typeof chunk === 'object' ? (0, rnToCss_1.default)(chunk) : chunk)
+        .map(chunk => chunk && typeof chunk === 'object' ? (0, rnToCss_1.default)(chunk) : chunk)
         .join('');
     if (props.rnCSS)
         computedString += props.rnCSS.replace(/=/gm, ':') + ';';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rn-css",
-  "version": "1.11.10",
+  "version": "1.11.11",
   "exports": {
     ".": {
       "import": "./dist/index.js",

package/src/convertUnits.ts

@@ -16,7 +16,7 @@ export function convertValue (key: keyof PartialStyle | keyof Transform, value:
     return 0
   }
   // colors should be left untouched
-  if (value.startsWith('#')) return value
+  if (value.startsWith('#') || value.startsWith('linear-gradient')) return value
 
   // Percentage values need to rely on an other unit as reference
   const finalUnits = { ...units }

package/src/cssToRN/convert.ts

@@ -119,7 +119,9 @@ export function placeContent (value: string) {
 
 export function background (value: string) {
   const values = value.match(/(linear-gradient\(|url\().*?\)|[^\s]+/mg) || []
-  const backgroundColor = values.reverse().find(isColor) || 'transparent'
+  const backgroundColor = values.reverse().find(isColor) ||
+    (values[0]?.startsWith('linear-gradient') && values[0].split(',').map(val => val.trim()).find(isColor)) ||
+    'transparent'
   // We support everything on web
   return Platform.OS === 'web' ? { backgroundColor, background: value } : { backgroundColor }
 }

package/src/styleComponent.tsx

@@ -44,7 +44,7 @@ function buildCSSString<T extends { rnCSS?: string }> (chunks: TemplateStringsAr
     .map((chunk, i) => ([chunk, (functs[i] instanceof Function) ? (functs[i] as Functs<T>)({ shared, theme: (shared as DefaultTheme), ...props }) : functs[i]]))
     .flat()
     // Convert the objects to string if the result is not a primitive
-    .map(chunk => typeof chunk === 'object' ? rnToCSS(chunk as Partial<CompleteStyle>) : chunk)
+    .map(chunk => chunk && typeof chunk === 'object' ? rnToCSS(chunk as Partial<CompleteStyle>) : chunk)
     .join('')
   if (props.rnCSS) computedString += props.rnCSS.replace(/=/gm, ':') + ';'
   return computedString