feat: improved css-shadow parser

packages/core/ui/text-base/index.d.ts

@@ -3,6 +3,7 @@ import { FormattedString } from './formatted-string';
 import { Style } from '../styling/style';
 import { Length } from '../styling/style-properties';
 import { Property, CssProperty, InheritedCssProperty } from '../core/properties';
+import { CSSShadow } from '../styling/css-shadow';
 
 export class TextBase extends View implements AddChildFromBuilder {
 	/**
@@ -54,7 +55,7 @@ export class TextBase extends View implements AddChildFromBuilder {
 	/**
 	 * Gets or sets text shadow style property.
 	 */
-	textShadow: TextShadow;
+	textShadow: CSSShadow;
 
 	/**
 	 * Gets or sets white space style property.
@@ -125,12 +126,6 @@ export type WhiteSpace = 'initial' | 'normal' | 'nowrap';
 export type TextAlignment = 'initial' | 'left' | 'center' | 'right';
 export type TextTransform = 'initial' | 'none' | 'capitalize' | 'uppercase' | 'lowercase';
 export type TextDecoration = 'none' | 'underline' | 'line-through' | 'underline line-through';
-export type TextShadow = {
-	offsetX: Length;
-	offsetY: Length;
-	blurRadius: Length;
-	color: Color;
-};
 
 export const textAlignmentProperty: InheritedCssProperty<Style, TextAlignment>;
 export const textDecorationProperty: CssProperty<Style, TextDecoration>;

packages/core/ui/text-base/index.ios.ts

@@ -1,5 +1,6 @@
 // Types
-import { TextDecoration, TextAlignment, TextTransform, TextShadow, getClosestPropertyValue } from './text-base-common';
+import { TextDecoration, TextAlignment, TextTransform, getClosestPropertyValue } from './text-base-common';
+import { CSSShadow } from '../styling/css-shadow';
 
 // Requires
 import { Font } from '../styling/font';
@@ -348,7 +349,7 @@ export class TextBase extends TextBaseCommon {
 		}
 	}
 
-	_setShadow(value: TextShadow): void {
+	_setShadow(value: CSSShadow): void {
 		const layer = getShadowLayer(this);
 		if (!layer) {
 			Trace.write('text-shadow not applied, no layer.', Trace.categories.Style, Trace.messageType.info);
@@ -504,6 +505,7 @@ export function getTransformedText(text: string, textTransform: TextTransform):
 	}
 }
 
+// todo: clean up nesting & logs
 export function getShadowLayer(view: TextBase): CALayer {
 	let layer: CALayer;
 	const name = 'shadow-layer';

packages/core/ui/text-base/text-base-common.ts

@@ -9,13 +9,13 @@ import { Span } from './span';
 import { View } from '../core/view';
 import { Property, CssProperty, InheritedCssProperty, makeValidator, makeParser } from '../core/properties';
 import { Style } from '../styling/style';
-import { Length, parseShadowProperites } from '../styling/style-properties';
+import { Length } from '../styling/style-properties';
 import { Observable } from '../../data/observable';
 
 import { TextAlignment, TextDecoration, TextTransform, WhiteSpace } from './text-base-interfaces';
 import { TextBase as TextBaseDefinition } from '.';
 import { Color } from '../../color';
-import { CSSShadow } from '../styling/css-shadow';
+import { CSSShadow, parseCSSShadow } from '../styling/css-shadow';
 
 export * from './text-base-interfaces';
 
@@ -115,10 +115,10 @@ export abstract class TextBaseCommon extends View implements TextBaseDefinition
 		this.style.textTransform = value;
 	}
 
-	get textShadow(): TextShadow {
+	get textShadow(): CSSShadow {
 		return this.style.textShadow;
 	}
-	set textShadow(value: TextShadow) {
+	set textShadow(value: CSSShadow) {
 		this.style.textShadow = value;
 	}
 
@@ -273,7 +273,7 @@ export const textShadowProperty = new CssProperty<Style, string | CSSShadow>({
 	cssName: 'text-shadow',
 	affectsLayout: global.isIOS,
 	valueConverter: (value) => {
-		return parseShadowProperites(value);
+		return parseCSSShadow(value);
 	},
 });
 textShadowProperty.register(Style);