bleam 0.0.6 → 0.0.7

package/dist/ui.cjs

@@ -3,7 +3,7 @@ const require_native_runtime = require('./native-runtime-CsXnXkQn.cjs');
 let react_native = require("react-native");
 react_native = require_chunk.__toESM(react_native);
 
-//#region src/ui.tsx
+//#region src/ui/shared.ts
 function textFromChildren(children) {
 	if (typeof children === "string" || typeof children === "number") return String(children);
 	if (Array.isArray(children)) return children.filter((child) => typeof child === "string" || typeof child === "number").join("");
@@ -22,19 +22,30 @@ function colorFromHex(hex) {
 	return UIColor.colorWithRedGreenBlueAlpha(red, green, blue, 1);
 }
 function colorFromStyle(value) {
-	return typeof value === "string" ? colorFromHex(value) : void 0;
+	if (value == null) return;
+	if (typeof value === "string") {
+		const hexColor = colorFromHex(value);
+		if (hexColor) return hexColor;
+	}
+	const color = (0, react_native.processColor)(value);
+	if (typeof color !== "number") return;
+	const alpha = (color >>> 24 & 255) / 255;
+	const red = (color >>> 16 & 255) / 255;
+	const green = (color >>> 8 & 255) / 255;
+	const blue = (color & 255) / 255;
+	return UIColor.colorWithRedGreenBlueAlpha(red, green, blue, alpha);
 }
-function labelText(props) {
-	return props.text ?? textFromChildren(props.children) ?? "";
+function fontFromStyle(style) {
+	if (typeof style?.fontSize !== "number") return;
+	if (style.fontWeight === "700" || style.fontWeight === "bold") return UIFont.boldSystemFontOfSize(style.fontSize);
+	return UIFont.systemFontOfSize(style.fontSize);
 }
+
+//#endregion
+//#region src/ui/button.tsx
 function buttonTitle(props) {
 	return props.title ?? textFromChildren(props.children) ?? "";
 }
-function defaultLabelColor(tone) {
-	if (tone === "secondary") return UIColor.secondaryLabelColor;
-	if (tone === "tertiary") return UIColor.tertiaryLabelColor;
-	return UIColor.labelColor;
-}
 function buttonConfiguration(variant) {
 	if (variant === "secondary") return UIButtonConfiguration.borderedButtonConfiguration();
 	if (variant === "plain") return UIButtonConfiguration.plainButtonConfiguration();
@@ -45,10 +56,47 @@ function buttonSize(size) {
 	if (size === "large") return UIButtonConfigurationSize.Large;
 	return UIButtonConfigurationSize.Medium;
 }
-function fontFromStyle(style) {
-	if (typeof style?.fontSize !== "number") return;
-	if (style.fontWeight === "700" || style.fontWeight === "bold") return UIFont.boldSystemFontOfSize(style.fontSize);
-	return UIFont.systemFontOfSize(style.fontSize);
+const Button = require_native_runtime.ensureNativeScript().defineUIKitView({
+	name: "Button",
+	layout: {
+		sizing: "intrinsic",
+		defaultSize: {
+			width: 1,
+			height: 34
+		}
+	},
+	create(ctx) {
+		const button = UIButton.buttonWithType(UIButtonType.System);
+		ctx.targetAction(button, UIControlEvents.TouchUpInside, () => {
+			ctx.emit("onPress");
+		});
+		return button;
+	},
+	update(button, props, _previousProps, ctx) {
+		const style = styleFromProps(props.style);
+		const configuration = buttonConfiguration(props.variant);
+		configuration.title = buttonTitle(props);
+		configuration.buttonSize = buttonSize(props.size);
+		configuration.showsActivityIndicator = props.loading ?? false;
+		const foregroundColor = colorFromStyle(style?.color);
+		if (foregroundColor) configuration.baseForegroundColor = foregroundColor;
+		const backgroundColor = colorFromStyle(style?.backgroundColor);
+		if (backgroundColor) configuration.baseBackgroundColor = backgroundColor;
+		button.configuration = configuration;
+		button.enabled = !(props.disabled || props.loading);
+		ctx?.invalidateLayout();
+	}
+});
+
+//#endregion
+//#region src/ui/label.tsx
+function labelText(props) {
+	return props.text ?? textFromChildren(props.children) ?? "";
+}
+function defaultLabelColor(tone) {
+	if (tone === "secondary") return UIColor.secondaryLabelColor;
+	if (tone === "tertiary") return UIColor.tertiaryLabelColor;
+	return UIColor.labelColor;
 }
 const Label = require_native_runtime.ensureNativeScript().defineUIKitView({
 	name: "Label",
@@ -76,38 +124,241 @@ const Label = require_native_runtime.ensureNativeScript().defineUIKitView({
 		ctx?.invalidateLayout();
 	}
 });
-const Button = require_native_runtime.ensureNativeScript().defineUIKitView({
-	name: "Button",
+
+//#endregion
+//#region src/ui/symbol.tsx
+function symbolWeight(weight) {
+	switch (weight) {
+		case "ultraLight": return UIImageSymbolWeight.UltraLight;
+		case "thin": return UIImageSymbolWeight.Thin;
+		case "light": return UIImageSymbolWeight.Light;
+		case "medium": return UIImageSymbolWeight.Medium;
+		case "semibold": return UIImageSymbolWeight.Semibold;
+		case "bold": return UIImageSymbolWeight.Bold;
+		case "heavy": return UIImageSymbolWeight.Heavy;
+		case "black": return UIImageSymbolWeight.Black;
+		default: return UIImageSymbolWeight.Regular;
+	}
+}
+function symbolScale(scale) {
+	if (scale === "small") return UIImageSymbolScale.Small;
+	if (scale === "large") return UIImageSymbolScale.Large;
+	return UIImageSymbolScale.Medium;
+}
+function symbolConfiguration(props, style) {
+	const size = props.size ?? style?.fontSize ?? 17;
+	return UIImageSymbolConfiguration.configurationWithPointSizeWeightScale(size, symbolWeight(props.weight), symbolScale(props.scale));
+}
+function symbolImage(name, configuration) {
+	if (configuration) return UIImage.systemImageNamedWithConfiguration(name, configuration);
+	return UIImage.systemImageNamed(name);
+}
+const Symbol = require_native_runtime.ensureNativeScript().defineUIKitView({
+	name: "Symbol",
 	layout: {
 		sizing: "intrinsic",
 		defaultSize: {
-			width: 1,
-			height: 34
+			width: 17,
+			height: 17
 		}
 	},
-	create(ctx) {
-		const button = UIButton.buttonWithType(UIButtonType.System);
-		ctx.targetAction(button, UIControlEvents.TouchUpInside, () => {
-			ctx.emit("onPress");
-		});
-		return button;
+	create() {
+		const imageView = UIImageView.new();
+		imageView.contentMode = UIViewContentMode.ScaleAspectFit;
+		return imageView;
 	},
-	update(button, props, _previousProps, ctx) {
+	update(imageView, props, _previousProps, ctx) {
 		const style = styleFromProps(props.style);
-		const configuration = buttonConfiguration(props.variant);
-		configuration.title = buttonTitle(props);
-		configuration.buttonSize = buttonSize(props.size);
-		configuration.showsActivityIndicator = props.loading ?? false;
-		const foregroundColor = colorFromStyle(style?.color);
-		if (foregroundColor) configuration.baseForegroundColor = foregroundColor;
-		const backgroundColor = colorFromStyle(style?.backgroundColor);
-		if (backgroundColor) configuration.baseBackgroundColor = backgroundColor;
-		button.configuration = configuration;
-		button.enabled = !(props.disabled || props.loading);
+		const configuration = symbolConfiguration(props, style);
+		imageView.image = symbolImage(props.symbol, configuration);
+		imageView.tintColor = colorFromStyle(props.color) ?? colorFromStyle(style?.tintColor) ?? colorFromStyle(style?.color) ?? UIColor.labelColor;
+		ctx?.invalidateLayout();
+	}
+});
+
+//#endregion
+//#region src/ui/glass-shared.ts
+function glassStyleValue(style) {
+	return typeof style === "object" ? style.style : style ?? "regular";
+}
+function glassEffect(style) {
+	if (style === "none") return null;
+	return UIGlassEffect.effectWithStyle(style === "clear" ? UIGlassEffectStyle.Clear : UIGlassEffectStyle.Regular);
+}
+function createGlassHost(effect) {
+	const rootView = UIVisualEffectView.alloc().initWithEffect(effect);
+	const childrenView = UIView.new();
+	rootView.backgroundColor = UIColor.clearColor;
+	rootView.contentView.backgroundColor = UIColor.clearColor;
+	childrenView.backgroundColor = UIColor.clearColor;
+	rootView.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
+	rootView.contentView.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
+	childrenView.translatesAutoresizingMaskIntoConstraints = false;
+	rootView.contentView.addSubview(childrenView);
+	const constraints = {
+		top: childrenView.topAnchor.constraintEqualToAnchorConstant(rootView.contentView.topAnchor, 0),
+		right: rootView.contentView.rightAnchor.constraintEqualToAnchorConstant(childrenView.rightAnchor, 0),
+		bottom: rootView.contentView.bottomAnchor.constraintEqualToAnchorConstant(childrenView.bottomAnchor, 0),
+		left: childrenView.leftAnchor.constraintEqualToAnchorConstant(rootView.contentView.leftAnchor, 0)
+	};
+	NSLayoutConstraint.activateConstraints([
+		constraints.top,
+		constraints.right,
+		constraints.bottom,
+		constraints.left
+	]);
+	return {
+		rootView,
+		childrenView
+	};
+}
+function applyGlassShape(view, style) {
+	const radius = typeof style?.cornerRadius === "number" ? style.cornerRadius : 0;
+	view.layer.cornerRadius = radius;
+	view.contentView.layer.cornerRadius = radius;
+	view.layer.cornerCurve = kCACornerCurveContinuous;
+	view.contentView.layer.cornerCurve = kCACornerCurveContinuous;
+	view.clipsToBounds = radius > 0;
+	view.contentView.clipsToBounds = radius > 0;
+	view.layer.masksToBounds = radius > 0;
+	view.contentView.layer.masksToBounds = radius > 0;
+	view.layer.borderWidth = typeof style?.borderWidth === "number" ? style.borderWidth : 0;
+	const borderColor = colorFromStyle(style?.borderColor);
+	view.layer.borderColor = borderColor?.CGColor ?? null;
+}
+function updateGlassEffect(view, props) {
+	const style = glassStyleValue(props.glassEffectStyle);
+	const effect = glassEffect(style);
+	if (style !== "none") {
+		const tintColor = props.tintColor ? colorFromHex(props.tintColor) : void 0;
+		const glass = effect;
+		glass.interactive = props.isInteractive ?? false;
+		if (tintColor) glass.tintColor = tintColor;
+	}
+	if (typeof props.glassEffectStyle === "object" && props.glassEffectStyle.animate) UIView.animateWithDurationAnimations(props.glassEffectStyle.animationDuration ?? .35, () => {
+		view.effect = effect;
+	});
+	else view.effect = effect;
+}
+function updateGlassContainerEffect(view, spacing) {
+	const effect = UIGlassContainerEffect.new();
+	effect.spacing = spacing ?? 0;
+	view.effect = effect;
+}
+
+//#endregion
+//#region src/ui/glass-view.tsx
+const GlassView = require_native_runtime.ensureNativeScript().defineUIKitContainer({
+	name: "GlassView",
+	layout: {
+		sizing: "fill",
+		defaultSize: {
+			width: 0,
+			height: 0
+		}
+	},
+	create() {
+		return createGlassHost(glassEffect("regular"));
+	},
+	update(view, props, _previousProps, ctx) {
+		updateGlassEffect(view.rootView, props);
+		applyGlassShape(view.rootView, props.glassStyle);
+		ctx?.invalidateLayout();
+	}
+});
+
+//#endregion
+//#region src/ui/glass-container.tsx
+const GlassContainer = require_native_runtime.ensureNativeScript().defineUIKitContainer({
+	name: "GlassContainer",
+	layout: {
+		sizing: "fill",
+		defaultSize: {
+			width: 0,
+			height: 0
+		}
+	},
+	create() {
+		const host = createGlassHost(UIGlassContainerEffect.new());
+		updateGlassContainerEffect(host.rootView, void 0);
+		return host;
+	},
+	update(view, props, _previousProps, ctx) {
+		updateGlassContainerEffect(view.rootView, props.spacing);
+		applyGlassShape(view.rootView, props.glassStyle);
+		ctx?.invalidateLayout();
+	}
+});
+
+//#endregion
+//#region src/ui/blur-view.tsx
+function blurStyle(intensity, colorScheme) {
+	const scheme = colorScheme ?? "auto";
+	const level = intensity ?? "regular";
+	if (scheme === "light") switch (level) {
+		case "ultraThin": return UIBlurEffectStyle.SystemUltraThinMaterialLight;
+		case "thin": return UIBlurEffectStyle.SystemThinMaterialLight;
+		case "thick": return UIBlurEffectStyle.SystemThickMaterialLight;
+		case "chrome": return UIBlurEffectStyle.SystemChromeMaterialLight;
+		default: return UIBlurEffectStyle.SystemMaterialLight;
+	}
+	if (scheme === "dark") switch (level) {
+		case "ultraThin": return UIBlurEffectStyle.SystemUltraThinMaterialDark;
+		case "thin": return UIBlurEffectStyle.SystemThinMaterialDark;
+		case "thick": return UIBlurEffectStyle.SystemThickMaterialDark;
+		case "chrome": return UIBlurEffectStyle.SystemChromeMaterialDark;
+		default: return UIBlurEffectStyle.SystemMaterialDark;
+	}
+	switch (level) {
+		case "ultraThin": return UIBlurEffectStyle.SystemUltraThinMaterial;
+		case "thin": return UIBlurEffectStyle.SystemThinMaterial;
+		case "thick": return UIBlurEffectStyle.SystemThickMaterial;
+		case "chrome": return UIBlurEffectStyle.SystemChromeMaterial;
+		default: return UIBlurEffectStyle.SystemMaterial;
+	}
+}
+function createEffectHost(effect) {
+	const rootView = UIVisualEffectView.alloc().initWithEffect(effect);
+	rootView.backgroundColor = UIColor.clearColor;
+	rootView.contentView.backgroundColor = UIColor.clearColor;
+	rootView.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
+	rootView.contentView.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
+	return {
+		rootView,
+		childrenView: rootView.contentView
+	};
+}
+function applyContainerStyle(view, style) {
+	const borderRadius = style?.borderRadius;
+	if (typeof borderRadius === "number") view.layer.cornerRadius = borderRadius;
+	view.clipsToBounds = style?.overflow === "hidden" || typeof borderRadius === "number";
+}
+function updateBlurEffect(view, props) {
+	view.effect = UIBlurEffect.effectWithStyle(blurStyle(props.intensity, props.colorScheme));
+}
+const BlurView = require_native_runtime.ensureNativeScript().defineUIKitContainer({
+	name: "BlurView",
+	layout: {
+		sizing: "fill",
+		defaultSize: {
+			width: 0,
+			height: 0
+		}
+	},
+	create() {
+		return createEffectHost(UIBlurEffect.effectWithStyle(UIBlurEffectStyle.SystemMaterial));
+	},
+	update(view, props, _previousProps, ctx) {
+		updateBlurEffect(view.rootView, props);
+		applyContainerStyle(view.rootView, styleFromProps(props.style));
 		ctx?.invalidateLayout();
 	}
 });
 
 //#endregion
+exports.BlurView = BlurView;
 exports.Button = Button;
-exports.Label = Label;
+exports.GlassContainer = GlassContainer;
+exports.GlassView = GlassView;
+exports.Label = Label;
+exports.Symbol = Symbol;

package/dist/ui.d.cts

@@ -1,30 +1,2 @@
-import { ReactNode } from "react";
-import { StyleProp, TextStyle, ViewStyle } from "react-native";
-import * as _nativescript_react_native0 from "@nativescript/react-native";
-
-//#region src/ui.d.ts
-type NativeStyle = ViewStyle & TextStyle;
-type ButtonVariant = 'primary' | 'secondary' | 'plain';
-type ButtonSize = 'regular' | 'small' | 'large';
-type ButtonProps = {
-  children?: ReactNode;
-  title?: string;
-  variant?: ButtonVariant;
-  size?: ButtonSize;
-  disabled?: boolean;
-  loading?: boolean;
-  onPress?: () => void;
-  style?: StyleProp<NativeStyle>;
-};
-type LabelTone = 'primary' | 'secondary' | 'tertiary';
-type LabelProps = {
-  children?: ReactNode;
-  text?: string;
-  tone?: LabelTone;
-  numberOfLines?: number;
-  style?: StyleProp<NativeStyle>;
-};
-declare const Label: _nativescript_react_native0.UIKitViewComponent<LabelProps, UILabel>;
-declare const Button: _nativescript_react_native0.UIKitViewComponent<ButtonProps, UIButton>;
-//#endregion
-export { Button, ButtonProps, ButtonSize, ButtonVariant, Label, LabelProps, LabelTone };
+import { C as ButtonVariant, S as ButtonSize, _ as Label, a as GlassContainer, b as Button, c as GlassEffectStyleConfig, d as GlassVisualStyle, f as Symbol, g as SymbolWeight, h as SymbolScale, i as BlurViewProps, l as GlassStyle, m as SymbolProps, n as BlurIntensity, o as GlassView, p as SymbolName, r as BlurView, s as GlassContainerProps, t as BlurColorScheme, u as GlassViewProps, v as LabelProps, x as ButtonProps, y as LabelTone } from "./ui-1WepaMS4.cjs";
+export { BlurColorScheme, BlurIntensity, BlurView, BlurViewProps, Button, ButtonProps, ButtonSize, ButtonVariant, GlassContainer, GlassContainerProps, GlassEffectStyleConfig, GlassStyle, GlassView, GlassViewProps, GlassVisualStyle, Label, LabelProps, LabelTone, Symbol, SymbolName, SymbolProps, SymbolScale, SymbolWeight };

package/dist/ui.d.ts

@@ -1,30 +1,2 @@
-import * as _nativescript_react_native0 from "@nativescript/react-native";
-import { ReactNode } from "react";
-import { StyleProp, TextStyle, ViewStyle } from "react-native";
-
-//#region src/ui.d.ts
-type NativeStyle = ViewStyle & TextStyle;
-type ButtonVariant = 'primary' | 'secondary' | 'plain';
-type ButtonSize = 'regular' | 'small' | 'large';
-type ButtonProps = {
-  children?: ReactNode;
-  title?: string;
-  variant?: ButtonVariant;
-  size?: ButtonSize;
-  disabled?: boolean;
-  loading?: boolean;
-  onPress?: () => void;
-  style?: StyleProp<NativeStyle>;
-};
-type LabelTone = 'primary' | 'secondary' | 'tertiary';
-type LabelProps = {
-  children?: ReactNode;
-  text?: string;
-  tone?: LabelTone;
-  numberOfLines?: number;
-  style?: StyleProp<NativeStyle>;
-};
-declare const Label: _nativescript_react_native0.UIKitViewComponent<LabelProps, UILabel>;
-declare const Button: _nativescript_react_native0.UIKitViewComponent<ButtonProps, UIButton>;
-//#endregion
-export { Button, ButtonProps, ButtonSize, ButtonVariant, Label, LabelProps, LabelTone };
+import { C as ButtonVariant, S as ButtonSize, _ as Label, a as GlassContainer, b as Button, c as GlassEffectStyleConfig, d as GlassVisualStyle, f as Symbol, g as SymbolWeight, h as SymbolScale, i as BlurViewProps, l as GlassStyle, m as SymbolProps, n as BlurIntensity, o as GlassView, p as SymbolName, r as BlurView, s as GlassContainerProps, t as BlurColorScheme, u as GlassViewProps, v as LabelProps, x as ButtonProps, y as LabelTone } from "./ui-WQvnXL0W.js";
+export { BlurColorScheme, BlurIntensity, BlurView, BlurViewProps, Button, ButtonProps, ButtonSize, ButtonVariant, GlassContainer, GlassContainerProps, GlassEffectStyleConfig, GlassStyle, GlassView, GlassViewProps, GlassVisualStyle, Label, LabelProps, LabelTone, Symbol, SymbolName, SymbolProps, SymbolScale, SymbolWeight };