@xaui/native 0.2.7 → 0.9.1-alpha.0

package/dist/view/index.cjs

@@ -1,1361 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }require('../chunk-56RPWZD2.cjs');
-
-
-
-var _chunk7UFBLUMVcjs = require('../chunk-7UFBLUMV.cjs');
-
-// src/components/view/container/container.tsx
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnative = require('react-native');
-
-// src/components/view/container/container.utils.ts
-var resolveEdgeInsets = (value, prefix) => {
-  if (typeof value === "number") {
-    return prefix === "padding" ? { padding: value } : { margin: value };
-  }
-  const style = {};
-  if (prefix === "padding") {
-    if (value.horizontal !== void 0) style.paddingHorizontal = value.horizontal;
-    if (value.vertical !== void 0) style.paddingVertical = value.vertical;
-    if (value.top !== void 0) style.paddingTop = value.top;
-    if (value.bottom !== void 0) style.paddingBottom = value.bottom;
-    if (value.left !== void 0) style.paddingLeft = value.left;
-    if (value.right !== void 0) style.paddingRight = value.right;
-  } else {
-    if (value.horizontal !== void 0) style.marginHorizontal = value.horizontal;
-    if (value.vertical !== void 0) style.marginVertical = value.vertical;
-    if (value.top !== void 0) style.marginTop = value.top;
-    if (value.bottom !== void 0) style.marginBottom = value.bottom;
-    if (value.left !== void 0) style.marginLeft = value.left;
-    if (value.right !== void 0) style.marginRight = value.right;
-  }
-  return style;
-};
-var ALIGNMENT_MAP = {
-  topLeft: { justifyContent: "flex-start", alignItems: "flex-start" },
-  topCenter: { justifyContent: "flex-start", alignItems: "center" },
-  topRight: { justifyContent: "flex-start", alignItems: "flex-end" },
-  centerLeft: { justifyContent: "center", alignItems: "flex-start" },
-  center: { justifyContent: "center", alignItems: "center" },
-  centerRight: { justifyContent: "center", alignItems: "flex-end" },
-  bottomLeft: { justifyContent: "flex-end", alignItems: "flex-start" },
-  bottomCenter: { justifyContent: "flex-end", alignItems: "center" },
-  bottomRight: { justifyContent: "flex-end", alignItems: "flex-end" }
-};
-var toFlexPosition = (v) => {
-  if (v <= 0) return "flex-start";
-  if (v >= 1) return "flex-end";
-  return "center";
-};
-var resolveAlignment = (value) => {
-  if (typeof value === "object") {
-    return {
-      justifyContent: toFlexPosition(value.y),
-      alignItems: toFlexPosition(value.x)
-    };
-  }
-  return _nullishCoalesce(ALIGNMENT_MAP[value], () => ( {
-    justifyContent: "flex-start",
-    alignItems: "flex-start"
-  }));
-};
-var resolveBorderRadius = (value) => {
-  if (typeof value === "number") {
-    return { borderRadius: value };
-  }
-  const style = {};
-  if (value.topLeft !== void 0) style.borderTopLeftRadius = value.topLeft;
-  if (value.topRight !== void 0) style.borderTopRightRadius = value.topRight;
-  if (value.bottomLeft !== void 0) style.borderBottomLeftRadius = value.bottomLeft;
-  if (value.bottomRight !== void 0)
-    style.borderBottomRightRadius = value.bottomRight;
-  return style;
-};
-var resolveBorderSide = (side, position) => {
-  const style = {};
-  if (position === "") {
-    if (side.width !== void 0) style.borderWidth = side.width;
-    if (side.color !== void 0) style.borderColor = side.color;
-    if (side.style !== void 0) style.borderStyle = side.style;
-    return style;
-  }
-  if (position === "Top") {
-    if (side.width !== void 0) style.borderTopWidth = side.width;
-    if (side.color !== void 0) style.borderTopColor = side.color;
-  } else if (position === "Bottom") {
-    if (side.width !== void 0) style.borderBottomWidth = side.width;
-    if (side.color !== void 0) style.borderBottomColor = side.color;
-  } else if (position === "Left") {
-    if (side.width !== void 0) style.borderLeftWidth = side.width;
-    if (side.color !== void 0) style.borderLeftColor = side.color;
-  } else {
-    if (side.width !== void 0) style.borderRightWidth = side.width;
-    if (side.color !== void 0) style.borderRightColor = side.color;
-  }
-  return style;
-};
-var resolveBorder = (value) => {
-  const dir = value;
-  if (dir.top !== void 0 || dir.bottom !== void 0 || dir.left !== void 0 || dir.right !== void 0) {
-    return {
-      ...dir.top ? resolveBorderSide(dir.top, "Top") : {},
-      ...dir.bottom ? resolveBorderSide(dir.bottom, "Bottom") : {},
-      ...dir.left ? resolveBorderSide(dir.left, "Left") : {},
-      ...dir.right ? resolveBorderSide(dir.right, "Right") : {}
-    };
-  }
-  return resolveBorderSide(value, "");
-};
-var resolveShadow = (value) => ({
-  shadowColor: _nullishCoalesce(value.color, () => ( "#000000")),
-  shadowOffset: {
-    width: _nullishCoalesce(_optionalChain([value, 'access', _2 => _2.offset, 'optionalAccess', _3 => _3.x]), () => ( 0)),
-    height: _nullishCoalesce(_optionalChain([value, 'access', _4 => _4.offset, 'optionalAccess', _5 => _5.y]), () => ( 4))
-  },
-  shadowOpacity: _nullishCoalesce(value.opacity, () => ( 0.1)),
-  shadowRadius: _nullishCoalesce(value.blur, () => ( 4)),
-  elevation: _nullishCoalesce(value.elevation, () => ( 2))
-});
-var resolveTransform = (value) => {
-  const transforms = [];
-  if (value.rotate !== void 0) transforms.push({ rotate: value.rotate });
-  if (value.rotateX !== void 0) transforms.push({ rotateX: value.rotateX });
-  if (value.rotateY !== void 0) transforms.push({ rotateY: value.rotateY });
-  if (value.scale !== void 0) transforms.push({ scale: value.scale });
-  if (value.scaleX !== void 0) transforms.push({ scaleX: value.scaleX });
-  if (value.scaleY !== void 0) transforms.push({ scaleY: value.scaleY });
-  if (value.translateX !== void 0)
-    transforms.push({ translateX: value.translateX });
-  if (value.translateY !== void 0)
-    transforms.push({ translateY: value.translateY });
-  if (value.skewX !== void 0) transforms.push({ skewX: value.skewX });
-  if (value.skewY !== void 0) transforms.push({ skewY: value.skewY });
-  return transforms;
-};
-
-// src/components/view/container/container.tsx
-var buildStyle = (props) => ({
-  ...props.width !== void 0 && { width: props.width },
-  ...props.height !== void 0 && { height: props.height },
-  ...props.minWidth !== void 0 && { minWidth: props.minWidth },
-  ...props.maxWidth !== void 0 && { maxWidth: props.maxWidth },
-  ...props.minHeight !== void 0 && { minHeight: props.minHeight },
-  ...props.maxHeight !== void 0 && { maxHeight: props.maxHeight },
-  ...props.aspectRatio !== void 0 && { aspectRatio: props.aspectRatio },
-  ...props.flex !== void 0 && { flex: props.flex },
-  ...props.color !== void 0 && { backgroundColor: props.color },
-  ...props.clip && { overflow: "hidden" },
-  ...props.opacity !== void 0 && { opacity: props.opacity },
-  ...props.padding !== void 0 && resolveEdgeInsets(props.padding, "padding"),
-  ...props.margin !== void 0 && resolveEdgeInsets(props.margin, "margin"),
-  ...props.alignment !== void 0 && resolveAlignment(props.alignment),
-  ...props.borderRadius !== void 0 && resolveBorderRadius(props.borderRadius),
-  ...props.border !== void 0 && resolveBorder(props.border),
-  ...props.shadow !== void 0 && resolveShadow(props.shadow),
-  ...props.transform !== void 0 && {
-    transform: resolveTransform(props.transform)
-  }
-});
-var Container = (props) => {
-  const {
-    children,
-    onPress,
-    onLongPress,
-    onPressIn,
-    onPressOut,
-    disabled = false,
-    accessibilityLabel,
-    accessibilityRole,
-    accessibilityState,
-    accessible,
-    testID,
-    style
-  } = props;
-  const containerStyle = buildStyle(props);
-  const isInteractive = !!(_nullishCoalesce(_nullishCoalesce(_nullishCoalesce(onPress, () => ( onLongPress)), () => ( onPressIn)), () => ( onPressOut)));
-  if (isInteractive) {
-    return /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.Pressable,
-      {
-        onPress: disabled ? void 0 : onPress,
-        onLongPress: disabled ? void 0 : onLongPress,
-        onPressIn: disabled ? void 0 : onPressIn,
-        onPressOut: disabled ? void 0 : onPressOut,
-        disabled,
-        accessibilityLabel,
-        accessibilityRole,
-        accessibilityState,
-        accessible,
-        testID,
-        style: [containerStyle, style]
-      },
-      children
-    );
-  }
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      accessibilityLabel,
-      accessibilityRole,
-      accessibilityState,
-      accessible,
-      testID,
-      style: [containerStyle, style]
-    },
-    children
-  );
-};
-Container.displayName = "Container";
-
-// src/components/view/flex/flex.tsx
-
-
-
-// src/components/view/layout-utils.ts
-var MAIN_AXIS_JUSTIFY_MAP = {
-  start: "flex-start",
-  center: "center",
-  end: "flex-end",
-  spaceBetween: "space-between",
-  spaceAround: "space-around",
-  spaceEvenly: "space-evenly"
-};
-var CROSS_AXIS_ALIGN_MAP = {
-  start: "flex-start",
-  center: "center",
-  end: "flex-end",
-  stretch: "stretch"
-};
-var resolveMainAxisAlignment = (alignment) => MAIN_AXIS_JUSTIFY_MAP[_nullishCoalesce(alignment, () => ( "start"))];
-var resolveCrossAxisAlignment = (alignment) => CROSS_AXIS_ALIGN_MAP[_nullishCoalesce(alignment, () => ( "center"))];
-var resolveMainAxisSize = (size = "max", direction) => {
-  if (size === "min") return {};
-  return direction === "vertical" ? { flex: 1 } : { width: "100%" };
-};
-
-// src/components/view/flex/flex.tsx
-var Flex = ({
-  children,
-  direction,
-  mainAxisAlignment,
-  crossAxisAlignment,
-  mainAxisSize,
-  wrap = false,
-  gap,
-  reversed = false,
-  flex,
-  style,
-  testID
-}) => {
-  const flexDir = direction === "horizontal" ? reversed ? "row-reverse" : "row" : reversed ? "column-reverse" : "column";
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      testID,
-      style: [
-        resolveMainAxisSize(mainAxisSize, direction),
-        {
-          flexDirection: flexDir,
-          justifyContent: resolveMainAxisAlignment(mainAxisAlignment),
-          alignItems: resolveCrossAxisAlignment(crossAxisAlignment),
-          flexWrap: wrap ? "wrap" : "nowrap",
-          ...gap !== void 0 && { gap },
-          ...flex !== void 0 && { flex }
-        },
-        style
-      ]
-    },
-    children
-  );
-};
-Flex.displayName = "Flex";
-
-// src/components/view/column/column.tsx
-
-var Column = (props) => /* @__PURE__ */ _react2.default.createElement(Flex, { ...props, direction: "vertical" });
-Column.displayName = "Column";
-
-// src/components/view/row/row.tsx
-
-var Row = (props) => /* @__PURE__ */ _react2.default.createElement(Flex, { ...props, direction: "horizontal" });
-Row.displayName = "Row";
-
-// src/components/view/expanded/expanded.tsx
-
-
-var Expanded = ({
-  children,
-  flex = 1,
-  style,
-  testID
-}) => /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { testID, style: [{ flex }, style] }, children);
-Expanded.displayName = "Expanded";
-
-// src/components/view/flexible/flexible.tsx
-
-
-var Flexible = ({
-  children,
-  flex = 1,
-  fit = "loose",
-  style,
-  testID
-}) => /* @__PURE__ */ _react2.default.createElement(
-  _reactnative.View,
-  {
-    testID,
-    style: [
-      fit === "tight" ? { flex } : { flexGrow: flex, flexShrink: 1, flexBasis: "auto" },
-      style
-    ]
-  },
-  children
-);
-Flexible.displayName = "Flexible";
-
-// src/components/view/spacer/spacer.tsx
-
-
-var Spacer = ({ flex = 1, style }) => {
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        {
-          flexGrow: flex,
-          flexShrink: 1,
-          flexBasis: 0
-        },
-        style
-      ]
-    }
-  );
-};
-Spacer.displayName = "Spacer";
-
-// src/components/view/wrap/wrap.tsx
-
-
-var Wrap = ({
-  children,
-  direction = "horizontal",
-  alignment,
-  runAlignment,
-  spacing = 0,
-  runSpacing = 0,
-  style,
-  testID
-}) => /* @__PURE__ */ _react2.default.createElement(
-  _reactnative.View,
-  {
-    testID,
-    style: [
-      {
-        flexDirection: direction === "horizontal" ? "row" : "column",
-        flexWrap: "wrap",
-        justifyContent: resolveMainAxisAlignment(alignment),
-        alignContent: resolveMainAxisAlignment(runAlignment),
-        gap: spacing,
-        rowGap: direction === "horizontal" ? runSpacing : spacing,
-        columnGap: direction === "horizontal" ? spacing : runSpacing
-      },
-      style
-    ]
-  },
-  children
-);
-Wrap.displayName = "Wrap";
-
-// src/components/view/padding/padding.tsx
-
-
-var Padding = ({ children, padding, style }) => /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [resolveEdgeInsets(padding, "padding"), style] }, children);
-Padding.displayName = "Padding";
-
-// src/components/view/margin/margin.tsx
-
-
-var Margin = ({ children, margin, style }) => /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [resolveEdgeInsets(margin, "margin"), style] }, children);
-Margin.displayName = "Margin";
-
-// src/components/view/sized-box/sized-box.tsx
-
-
-var SizedBox = ({
-  children,
-  width,
-  height,
-  expand,
-  shrink,
-  style,
-  testID
-}) => {
-  if (shrink) {
-    return /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.View,
-      {
-        testID,
-        style: [{ width: 0, height: 0, overflow: "hidden" }, style]
-      },
-      children
-    );
-  }
-  if (expand) {
-    return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { testID, style: [{ flex: 1, alignSelf: "stretch" }, style] }, children);
-  }
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { testID, style: [{ width, height }, style] }, children);
-};
-SizedBox.displayName = "SizedBox";
-
-// src/components/view/constrained-box/constrained-box.tsx
-
-
-var ConstrainedBox = ({
-  children,
-  constraints,
-  style,
-  testID
-}) => /* @__PURE__ */ _react2.default.createElement(
-  _reactnative.View,
-  {
-    testID,
-    style: [
-      {
-        minWidth: constraints.minWidth,
-        maxWidth: constraints.maxWidth,
-        minHeight: constraints.minHeight,
-        maxHeight: constraints.maxHeight
-      },
-      style
-    ]
-  },
-  children
-);
-ConstrainedBox.displayName = "ConstrainedBox";
-
-// src/components/view/fractionally-sized-box/fractionally-sized-box.tsx
-
-
-var FractionallySizedBox = ({
-  children,
-  widthFactor,
-  heightFactor,
-  alignment,
-  style,
-  testID
-}) => {
-  const sizedStyle = {};
-  if (widthFactor !== void 0) sizedStyle.width = `${widthFactor * 100}%`;
-  if (heightFactor !== void 0) sizedStyle.height = `${heightFactor * 100}%`;
-  const alignStyle = alignment ? resolveAlignment(alignment) : {};
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { testID, style: [sizedStyle, alignStyle, style] }, children);
-};
-FractionallySizedBox.displayName = "FractionallySizedBox";
-
-// src/components/view/positioned-view/positioned-view.tsx
-
-
-var PositionedView = ({
-  children,
-  top,
-  right,
-  bottom,
-  left,
-  zIndex,
-  style
-}) => {
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        {
-          position: "absolute",
-          top,
-          right,
-          bottom,
-          left,
-          zIndex
-        },
-        style
-      ]
-    },
-    children
-  );
-};
-PositionedView.displayName = "PositionedView";
-
-// src/components/view/blur-view/blur-view.tsx
-
-
-var styles = _reactnative.StyleSheet.create({
-  container: {
-    position: "relative"
-  },
-  overlay: {
-    ..._reactnative.StyleSheet.absoluteFillObject
-  }
-});
-var BlurView = ({
-  children,
-  unlockable = false,
-  intensity = 0.6,
-  overlayColor = "rgba(0, 0, 0, 0.12)",
-  style
-}) => {
-  const overlayOpacity = Math.min(1, Math.max(0, intensity));
-  const overlayAnim = _react.useRef.call(void 0, 
-    new _reactnative.Animated.Value(unlockable ? 0 : overlayOpacity)
-  ).current;
-  const scaleAnim = _react.useRef.call(void 0, new _reactnative.Animated.Value(unlockable ? 1 : 0.98)).current;
-  _react.useEffect.call(void 0, () => {
-    if (unlockable) {
-      _reactnative.Animated.parallel([
-        _reactnative.Animated.timing(overlayAnim, {
-          toValue: 0,
-          duration: 220,
-          useNativeDriver: true
-        }),
-        _reactnative.Animated.timing(scaleAnim, {
-          toValue: 1,
-          duration: 220,
-          useNativeDriver: true
-        })
-      ]).start();
-      return;
-    }
-    overlayAnim.setValue(overlayOpacity);
-    scaleAnim.setValue(0.98);
-  }, [overlayAnim, overlayOpacity, scaleAnim, unlockable]);
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [styles.container, style] }, /* @__PURE__ */ _react2.default.createElement(_reactnative.Animated.View, { style: { transform: [{ scale: scaleAnim }] } }, children), /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Animated.View,
-    {
-      pointerEvents: unlockable ? "none" : "auto",
-      style: [styles.overlay, { opacity: overlayAnim }]
-    },
-    /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [styles.overlay, { backgroundColor: overlayColor }] })
-  ));
-};
-BlurView.displayName = "BlurView";
-
-// src/components/view/rounded-view/rounded-view.tsx
-
-
-
-// src/components/view/rounded-view/rounded-view.hook.ts
-
-var useRoundedViewStyle = (props) => {
-  const {
-    all = 0,
-    top,
-    bottom,
-    left,
-    right,
-    topLeft,
-    topRight,
-    bottomLeft,
-    bottomRight
-  } = props;
-  return _react.useMemo.call(void 0, () => {
-    return {
-      borderTopLeftRadius: _nullishCoalesce(_nullishCoalesce(_nullishCoalesce(topLeft, () => ( top)), () => ( left)), () => ( all)),
-      borderTopRightRadius: _nullishCoalesce(_nullishCoalesce(_nullishCoalesce(topRight, () => ( top)), () => ( right)), () => ( all)),
-      borderBottomLeftRadius: _nullishCoalesce(_nullishCoalesce(_nullishCoalesce(bottomLeft, () => ( bottom)), () => ( left)), () => ( all)),
-      borderBottomRightRadius: _nullishCoalesce(_nullishCoalesce(_nullishCoalesce(bottomRight, () => ( bottom)), () => ( right)), () => ( all))
-    };
-  }, [all, top, bottom, left, right, topLeft, topRight, bottomLeft, bottomRight]);
-};
-
-// src/components/view/rounded-view/rounded-view.tsx
-var RoundedView = ({
-  children,
-  all,
-  top,
-  bottom,
-  left,
-  right,
-  topLeft,
-  topRight,
-  bottomLeft,
-  bottomRight,
-  fullWidth = false,
-  backgroundColor,
-  style,
-  noGrowth = false
-}) => {
-  const borderRadiusStyle = useRoundedViewStyle({
-    all,
-    top,
-    bottom,
-    left,
-    right,
-    topLeft,
-    topRight,
-    bottomLeft,
-    bottomRight
-  });
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        borderRadiusStyle,
-        fullWidth && { width: "100%" },
-        noGrowth ? void 0 : { flex: 1 },
-        backgroundColor && { backgroundColor },
-        style
-      ]
-    },
-    children
-  );
-};
-
-// src/components/view/aspect-ratio/aspect-ratio.tsx
-
-
-var AspectRatio = ({
-  children,
-  ratio,
-  alignment,
-  clip,
-  style,
-  testID
-}) => {
-  const alignStyle = alignment ? resolveAlignment(alignment) : {};
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      testID,
-      style: [
-        {
-          aspectRatio: ratio,
-          overflow: clip ? "hidden" : "visible"
-        },
-        alignStyle,
-        style
-      ]
-    },
-    children
-  );
-};
-AspectRatio.displayName = "AspectRatio";
-
-// src/components/view/surface/surface.tsx
-
-
-var _core = require('@xaui/core');
-var resolveBackgroundColor = (color, theme) => {
-  if (color === "background" || color === "foreground") {
-    return theme.colors[color];
-  }
-  const safeColor = _core.getSafeThemeColor.call(void 0, color);
-  return theme.colors[safeColor].container;
-};
-var Surface = ({
-  children,
-  themeColor = "background",
-  padding,
-  radius = "none",
-  fullWidth = false,
-  style
-}) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const radiusStyle = _chunk7UFBLUMVcjs.useBorderRadiusStyles.call(void 0, radius);
-  const background = resolveBackgroundColor(themeColor, theme);
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        radiusStyle,
-        fullWidth && { flexShrink: 1, flexBasis: "auto", width: "100%" },
-        {
-          backgroundColor: background,
-          padding
-        },
-        style
-      ]
-    },
-    children
-  );
-};
-Surface.displayName = "Surface";
-
-// src/components/view/screen/screen.tsx
-
-
-var _reactnativesafeareacontext = require('react-native-safe-area-context');
-var Screen = ({
-  children,
-  padding,
-  backgroundColor,
-  safeArea = false,
-  style
-}) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const resolvedBackgroundColor = _nullishCoalesce(backgroundColor, () => ( theme.colors.background));
-  const containerStyle = [
-    { flex: 1, backgroundColor: resolvedBackgroundColor, padding },
-    style
-  ];
-  if (safeArea) {
-    return /* @__PURE__ */ _react2.default.createElement(_reactnativesafeareacontext.SafeAreaView, { style: containerStyle }, children);
-  }
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: containerStyle }, children);
-};
-Screen.displayName = "Screen";
-
-// src/components/view/align/align.tsx
-
-
-var Align = ({ children, alignment, style }) => /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [{ flex: 1 }, resolveAlignment(alignment), style] }, children);
-Align.displayName = "Align";
-
-// src/components/view/center/center.tsx
-
-var Center = ({ children, style }) => /* @__PURE__ */ _react2.default.createElement(Align, { alignment: "center", style }, children);
-Center.displayName = "Center";
-
-// src/components/view/grid/grid.tsx
-
-
-
-
-
-// src/components/view/grid/grid-item.tsx
-
-
-var GridItem = ({ children, style }) => {
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style }, children);
-};
-GridItem.displayName = "GridItem";
-
-// src/components/view/grid/grid.tsx
-var getSafeColumns = (columns) => {
-  if (!columns || columns <= 0) return 1;
-  return Math.floor(columns);
-};
-var getSafeSpan = (span, columns) => {
-  if (!span || span <= 0) return 1;
-  return Math.min(Math.floor(span), columns);
-};
-var isGridItemElement = (child) => {
-  if (!_react2.default.isValidElement(child)) return false;
-  if (child.type === GridItem) return true;
-  const displayName = child.type.displayName;
-  return displayName === "GridItem";
-};
-var Grid = ({
-  children,
-  columns = 2,
-  spacing,
-  rowSpacing,
-  columnSpacing,
-  style,
-  itemStyle
-}) => {
-  const [containerWidth, setContainerWidth] = _react.useState.call(void 0, );
-  const safeColumns = getSafeColumns(columns);
-  const resolvedRowSpacing = _nullishCoalesce(_nullishCoalesce(rowSpacing, () => ( spacing)), () => ( 0));
-  const resolvedColumnSpacing = _nullishCoalesce(_nullishCoalesce(columnSpacing, () => ( spacing)), () => ( 0));
-  const itemWidth = `${100 / safeColumns}%`;
-  const items = _react2.default.Children.toArray(children);
-  const totalColumnGap = resolvedColumnSpacing * (safeColumns - 1);
-  const baseItemWidth = _react.useMemo.call(void 0, () => {
-    if (!containerWidth) return void 0;
-    return (containerWidth - totalColumnGap) / safeColumns;
-  }, [containerWidth, safeColumns, totalColumnGap]);
-  let currentColumn = 0;
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        {
-          flexDirection: "row",
-          flexWrap: "wrap",
-          rowGap: resolvedRowSpacing
-        },
-        style
-      ],
-      onLayout: (event) => {
-        const nextWidth = event.nativeEvent.layout.width;
-        if (!nextWidth || nextWidth === containerWidth) return;
-        setContainerWidth(nextWidth);
-      }
-    },
-    items.map((child, index) => {
-      const key = _react2.default.isValidElement(child) && child.key ? child.key : `grid-${index}`;
-      const span = isGridItemElement(child) ? getSafeSpan(child.props.span, safeColumns) : 1;
-      const spanWidth = baseItemWidth === void 0 ? `${100 / safeColumns * span}%` : baseItemWidth * span + resolvedColumnSpacing * (span - 1);
-      if (currentColumn + span > safeColumns) {
-        currentColumn = 0;
-      }
-      const isEndOfRow = currentColumn + span >= safeColumns;
-      const marginRight = isEndOfRow ? 0 : resolvedColumnSpacing;
-      if (isGridItemElement(child)) {
-        const mergedStyle = [
-          {
-            flexBasis: spanWidth,
-            maxWidth: spanWidth,
-            flexGrow: 0,
-            flexShrink: 0,
-            marginRight
-          },
-          itemStyle,
-          child.props.style
-        ];
-        const element2 = _react2.default.cloneElement(child, {
-          key,
-          style: mergedStyle
-        });
-        currentColumn = isEndOfRow ? 0 : currentColumn + span;
-        return element2;
-      }
-      const defaultItemWidth = baseItemWidth === void 0 ? itemWidth : baseItemWidth;
-      const element = /* @__PURE__ */ _react2.default.createElement(
-        _reactnative.View,
-        {
-          key,
-          style: [
-            {
-              flexBasis: defaultItemWidth,
-              maxWidth: defaultItemWidth,
-              flexGrow: 0,
-              flexShrink: 0,
-              marginRight
-            },
-            itemStyle
-          ]
-        },
-        child
-      );
-      currentColumn = isEndOfRow ? 0 : currentColumn + span;
-      return element;
-    })
-  );
-};
-
-// src/components/view/grid/grid-builder.tsx
-
-
-
-
-
-
-var getSafeColumns2 = (columns) => {
-  if (!columns || columns <= 0) return 1;
-  return Math.floor(columns);
-};
-var resolveGridData = (data, itemCount) => {
-  if (data) return data;
-  if (!itemCount || itemCount <= 0) return [];
-  return Array.from({ length: itemCount }, (_, index) => index);
-};
-var GridBuilder = ({
-  data,
-  itemCount,
-  renderItem,
-  itemBuilder,
-  keyExtractor,
-  columns = 2,
-  spacing,
-  rowSpacing,
-  columnSpacing,
-  style,
-  itemStyle,
-  scrollEnabled,
-  onEndReached,
-  onEndReachedThreshold = 0.1,
-  contentContainerStyle,
-  header,
-  footer
-}) => {
-  const safeColumns = getSafeColumns2(columns);
-  const resolvedRowSpacing = _nullishCoalesce(_nullishCoalesce(rowSpacing, () => ( spacing)), () => ( 0));
-  const resolvedColumnSpacing = _nullishCoalesce(_nullishCoalesce(columnSpacing, () => ( spacing)), () => ( 0));
-  const resolvedData = _react.useMemo.call(void 0, 
-    () => resolveGridData(data, itemCount),
-    [data, itemCount]
-  );
-  const paddedData = _react.useMemo.call(void 0, () => {
-    const remainder = resolvedData.length % safeColumns;
-    const placeholders = remainder === 0 ? 0 : safeColumns - remainder;
-    if (placeholders === 0)
-      return resolvedData.map((item, index) => ({
-        type: "data",
-        item,
-        index
-      }));
-    return [
-      ...resolvedData.map((item, index) => ({
-        type: "data",
-        item,
-        index
-      })),
-      ...Array.from({ length: placeholders }, (_, index) => ({
-        type: "placeholder",
-        key: `placeholder-${resolvedData.length + index}`
-      }))
-    ];
-  }, [resolvedData, safeColumns]);
-  const resolvedKeyExtractor = _react.useMemo.call(void 0, () => {
-    if (keyExtractor)
-      return (item, index) => item.type === "data" ? keyExtractor(item.item, item.index) : _nullishCoalesce(item.key, () => ( `placeholder-${index}`));
-    return (item, index) => item.type === "data" ? `grid-${item.index}` : _nullishCoalesce(item.key, () => ( `placeholder-${index}`));
-  }, [keyExtractor]);
-  const resolvedRenderer = _react.useMemo.call(void 0, () => {
-    if (renderItem) return renderItem;
-    if (itemBuilder)
-      return ({ item, index }) => itemBuilder({ item, index });
-    return void 0;
-  }, [renderItem, itemBuilder]);
-  if (!resolvedRenderer) return null;
-  const renderGridItem = ({
-    item,
-    index
-  }) => {
-    if (item.type === "placeholder") {
-      const isLastColumn2 = (index + 1) % safeColumns === 0;
-      const totalItems2 = paddedData.length;
-      const lastRowStart2 = totalItems2 === 0 ? 0 : totalItems2 - (totalItems2 % safeColumns || safeColumns);
-      const isLastRow2 = index >= lastRowStart2;
-      const placeholderStyle = [
-        {
-          flex: 1,
-          marginRight: isLastColumn2 ? 0 : resolvedColumnSpacing,
-          marginBottom: isLastRow2 ? 0 : resolvedRowSpacing
-        },
-        itemStyle
-      ];
-      return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: placeholderStyle, pointerEvents: "none" });
-    }
-    const element = resolvedRenderer({ item: item.item, index: item.index });
-    if (element === null) return null;
-    const isLastColumn = (index + 1) % safeColumns === 0;
-    const totalItems = paddedData.length;
-    const lastRowStart = totalItems === 0 ? 0 : totalItems - (totalItems % safeColumns || safeColumns);
-    const isLastRow = index >= lastRowStart;
-    const wrapperStyle = [
-      {
-        flex: 1,
-        marginRight: isLastColumn ? 0 : resolvedColumnSpacing,
-        marginBottom: isLastRow ? 0 : resolvedRowSpacing
-      },
-      itemStyle
-    ];
-    return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: wrapperStyle }, element);
-  };
-  const flattenedStyle = _nullishCoalesce(_reactnative.StyleSheet.flatten(style), () => ( {}));
-  const {
-    alignItems,
-    justifyContent,
-    alignContent,
-    gap,
-    rowGap,
-    columnGap,
-    ...restStyle
-  } = flattenedStyle;
-  const layoutStyle = {
-    ...alignItems !== void 0 ? { alignItems } : {},
-    ...justifyContent !== void 0 ? { justifyContent } : {},
-    ...alignContent !== void 0 ? { alignContent } : {},
-    ...gap !== void 0 ? { gap } : {},
-    ...rowGap !== void 0 ? { rowGap } : {},
-    ...columnGap !== void 0 ? { columnGap } : {}
-  };
-  const hasLayoutStyle = Object.keys(layoutStyle).length > 0;
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.FlatList,
-    {
-      data: paddedData,
-      renderItem: renderGridItem,
-      keyExtractor: resolvedKeyExtractor,
-      numColumns: safeColumns,
-      scrollEnabled,
-      onEndReached,
-      onEndReachedThreshold,
-      contentContainerStyle: hasLayoutStyle ? [contentContainerStyle, layoutStyle] : contentContainerStyle,
-      ListHeaderComponent: header,
-      ListFooterComponent: footer,
-      style: Object.keys(restStyle).length > 0 ? restStyle : void 0
-    }
-  );
-};
-GridBuilder.displayName = "GridBuilder";
-
-// src/components/view/conditional/conditional-view.tsx
-
-
-
-// src/components/view/conditional/conditional-view.utils.ts
-var FINAL_VALUES = {
-  opacity: 1,
-  scale: 1,
-  translateX: 0,
-  translateY: 0
-};
-var getInitialValues = (animation) => {
-  switch (animation) {
-    case "fade":
-      return { opacity: 0.5, scale: 1, translateX: 0, translateY: 0 };
-    case "scale":
-    default:
-      return { opacity: 1, scale: 0.5, translateX: 0, translateY: 0 };
-  }
-};
-var getExitValues = (animation) => {
-  switch (animation) {
-    case "fade":
-      return { opacity: 0.5, scale: 1, translateX: 0, translateY: 0 };
-    case "scale":
-    default:
-      return getInitialValues(animation);
-  }
-};
-
-// src/components/view/conditional/conditional-view.animation.ts
-
-var runConditionalViewAnimation = ({
-  opacity,
-  scale,
-  translateX,
-  translateY,
-  toValues,
-  onComplete
-}) => {
-  const easing = _reactnative.Easing.out(_reactnative.Easing.cubic);
-  const animation = _reactnative.Animated.parallel([
-    _reactnative.Animated.timing(opacity, {
-      toValue: toValues.opacity,
-      duration: 800,
-      easing,
-      useNativeDriver: true
-    }),
-    _reactnative.Animated.timing(scale, {
-      toValue: toValues.scale,
-      duration: 800,
-      easing,
-      useNativeDriver: true
-    }),
-    _reactnative.Animated.timing(translateX, {
-      toValue: toValues.translateX,
-      duration: 800,
-      easing,
-      useNativeDriver: true
-    }),
-    _reactnative.Animated.timing(translateY, {
-      toValue: toValues.translateY,
-      duration: 800,
-      easing,
-      useNativeDriver: true
-    })
-  ]);
-  animation.start(({ finished }) => {
-    if (finished) {
-      _optionalChain([onComplete, 'optionalCall', _6 => _6()]);
-    }
-  });
-  return animation;
-};
-
-// src/components/view/conditional/conditional-view.tsx
-var ConditionalView = ({
-  isVisible,
-  children,
-  animation = "fade",
-  disableAnimation = false
-}) => {
-  const [shouldRender, setShouldRender] = _react.useState.call(void 0, isVisible);
-  const animationRef = _react.useRef.call(void 0, null);
-  const initialValues = _react.useMemo.call(void 0, () => getInitialValues(animation), [animation]);
-  const exitValues = _react.useMemo.call(void 0, () => getExitValues(animation), [animation]);
-  const opacity = _react.useRef.call(void 0, 
-    new _reactnative.Animated.Value(
-      disableAnimation ? FINAL_VALUES.opacity : initialValues.opacity
-    )
-  ).current;
-  const scale = _react.useRef.call(void 0, 
-    new _reactnative.Animated.Value(disableAnimation ? FINAL_VALUES.scale : initialValues.scale)
-  ).current;
-  const translateX = _react.useRef.call(void 0, 
-    new _reactnative.Animated.Value(
-      disableAnimation ? FINAL_VALUES.translateX : initialValues.translateX
-    )
-  ).current;
-  const translateY = _react.useRef.call(void 0, 
-    new _reactnative.Animated.Value(
-      disableAnimation ? FINAL_VALUES.translateY : initialValues.translateY
-    )
-  ).current;
-  _react.useEffect.call(void 0, () => {
-    if (isVisible) {
-      setShouldRender(true);
-    }
-  }, [isVisible]);
-  _react.useEffect.call(void 0, () => {
-    if (!shouldRender) return;
-    const startValues = isVisible ? disableAnimation ? FINAL_VALUES : initialValues : FINAL_VALUES;
-    const targetValues = isVisible ? FINAL_VALUES : exitValues;
-    opacity.setValue(startValues.opacity);
-    scale.setValue(startValues.scale);
-    translateX.setValue(startValues.translateX);
-    translateY.setValue(startValues.translateY);
-    if (disableAnimation) {
-      if (!isVisible) {
-        setShouldRender(false);
-      }
-      return;
-    }
-    _optionalChain([animationRef, 'access', _7 => _7.current, 'optionalAccess', _8 => _8.stop, 'call', _9 => _9()]);
-    animationRef.current = runConditionalViewAnimation({
-      opacity,
-      scale,
-      translateX,
-      translateY,
-      toValues: targetValues,
-      onComplete: !isVisible ? () => setShouldRender(false) : void 0
-    });
-  }, [
-    isVisible,
-    shouldRender,
-    disableAnimation,
-    initialValues,
-    exitValues,
-    opacity,
-    scale,
-    translateX,
-    translateY
-  ]);
-  const animatedStyle = _react.useMemo.call(void 0, 
-    () => ({
-      opacity,
-      transform: [{ translateX }, { translateY }, { scale }]
-    }),
-    [opacity, scale, translateX, translateY]
-  );
-  if (!shouldRender) {
-    return null;
-  }
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.Animated.View, { style: animatedStyle }, children);
-};
-
-// src/components/view/masonry-grid/masonry-grid.tsx
-
-
-var getSafeColumns3 = (columns) => {
-  if (!columns || columns <= 0) return 1;
-  return Math.floor(columns);
-};
-var getItemKey = (child, index) => {
-  return _react2.default.isValidElement(child) && child.key ? String(child.key) : `masonry-${index}`;
-};
-var MasonryGrid = ({
-  children,
-  columns = 2,
-  spacing,
-  rowSpacing,
-  columnSpacing,
-  style,
-  columnStyle
-}) => {
-  const [containerWidth, setContainerWidth] = _react.useState.call(void 0, );
-  const heightMapRef = _react.useRef.call(void 0, {});
-  const [layoutVersion, setLayoutVersion] = _react.useState.call(void 0, 0);
-  const safeColumns = getSafeColumns3(columns);
-  const resolvedRowSpacing = _nullishCoalesce(_nullishCoalesce(rowSpacing, () => ( spacing)), () => ( 0));
-  const resolvedColumnSpacing = _nullishCoalesce(_nullishCoalesce(columnSpacing, () => ( spacing)), () => ( 0));
-  const totalColumnGap = resolvedColumnSpacing * (safeColumns - 1);
-  const columnWidth = _react.useMemo.call(void 0, () => {
-    if (!containerWidth) return void 0;
-    return (containerWidth - totalColumnGap) / safeColumns;
-  }, [containerWidth, safeColumns, totalColumnGap]);
-  const items = _react.useMemo.call(void 0, 
-    () => _react2.default.Children.toArray(children).map((child, index) => ({
-      key: getItemKey(child, index),
-      element: child
-    })),
-    [children]
-  );
-  const columnsItems = _react.useMemo.call(void 0, () => {
-    const buckets = Array.from({ length: safeColumns }, () => []);
-    const heights = new Array(safeColumns).fill(0);
-    items.forEach((item) => {
-      const height = heightMapRef.current[item.key];
-      const targetIndex = heights.indexOf(Math.min(...heights));
-      buckets[targetIndex].push(item);
-      heights[targetIndex] += (_nullishCoalesce(height, () => ( 0))) + resolvedRowSpacing;
-    });
-    return buckets;
-  }, [items, layoutVersion, resolvedRowSpacing, safeColumns]);
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        {
-          flexDirection: "row"
-        },
-        style
-      ],
-      onLayout: (event) => {
-        const nextWidth = event.nativeEvent.layout.width;
-        if (!nextWidth || nextWidth === containerWidth) return;
-        setContainerWidth(nextWidth);
-      }
-    },
-    columnsItems.map((column, columnIndex) => {
-      const isLastColumn = columnIndex === columnsItems.length - 1;
-      const columnStyles = [
-        {
-          width: columnWidth,
-          marginRight: isLastColumn ? 0 : resolvedColumnSpacing
-        },
-        columnStyle
-      ];
-      return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { key: `masonry-col-${columnIndex}`, style: columnStyles }, column.map((item, index) => {
-        const isLastRow = index === column.length - 1;
-        return /* @__PURE__ */ _react2.default.createElement(
-          _reactnative.View,
-          {
-            key: item.key,
-            style: { marginBottom: isLastRow ? 0 : resolvedRowSpacing },
-            onLayout: (event) => {
-              const nextHeight = event.nativeEvent.layout.height;
-              if (heightMapRef.current[item.key] === nextHeight) return;
-              heightMapRef.current[item.key] = nextHeight;
-              setLayoutVersion((value) => value + 1);
-            }
-          },
-          item.element
-        );
-      }));
-    })
-  );
-};
-
-// src/components/view/masonry-grid/masonry-grid-item.tsx
-
-
-var MasonryGridItem = ({
-  children,
-  style
-}) => {
-  return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style }, children);
-};
-MasonryGridItem.displayName = "MasonryGridItem";
-
-// src/components/view/masonry-grid/masonry-grid-builder.tsx
-
-
-
-
-var resolveMasonryData = (data, itemCount) => {
-  if (data) return data;
-  if (!itemCount || itemCount <= 0) return [];
-  return Array.from({ length: itemCount }, (_, index) => index);
-};
-var MasonryGridBuilder = ({
-  data,
-  itemCount,
-  renderItem,
-  itemBuilder,
-  keyExtractor,
-  columns = 2,
-  spacing,
-  rowSpacing,
-  columnSpacing,
-  style,
-  columnStyle,
-  onEndReached,
-  onEndReachedThreshold = 0.1,
-  header,
-  footer,
-  scrollEnabled,
-  contentContainerStyle,
-  showsVerticalScrollIndicator,
-  showsHorizontalScrollIndicator,
-  bounces,
-  onScroll
-}) => {
-  const resolvedData = _react.useMemo.call(void 0, 
-    () => resolveMasonryData(data, itemCount),
-    [data, itemCount]
-  );
-  const resolvedKeyExtractor = _react.useMemo.call(void 0, () => {
-    if (keyExtractor) return keyExtractor;
-    return (_, index) => `masonry-${index}`;
-  }, [keyExtractor]);
-  const resolvedRenderer = _react.useMemo.call(void 0, () => {
-    if (renderItem) return renderItem;
-    if (itemBuilder)
-      return ({ item, index }) => itemBuilder({ item, index });
-    return void 0;
-  }, [renderItem, itemBuilder]);
-  const lastEndReachedHeight = _react.useRef.call(void 0, 0);
-  if (!resolvedRenderer) return null;
-  const handleScroll = (event) => {
-    _optionalChain([onScroll, 'optionalCall', _10 => _10(event)]);
-    if (!onEndReached) return;
-    const { layoutMeasurement, contentOffset, contentSize } = event.nativeEvent;
-    if (!_optionalChain([layoutMeasurement, 'optionalAccess', _11 => _11.height])) return;
-    const distanceFromEnd = contentSize.height - (layoutMeasurement.height + contentOffset.y);
-    const threshold = onEndReachedThreshold * layoutMeasurement.height;
-    if (distanceFromEnd <= threshold && contentSize.height !== lastEndReachedHeight.current) {
-      lastEndReachedHeight.current = contentSize.height;
-      onEndReached();
-    }
-  };
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.ScrollView,
-    {
-      scrollEventThrottle: 16,
-      scrollEnabled,
-      contentContainerStyle,
-      showsVerticalScrollIndicator,
-      showsHorizontalScrollIndicator,
-      bounces,
-      onScroll: handleScroll
-    },
-    header,
-    /* @__PURE__ */ _react2.default.createElement(
-      MasonryGrid,
-      {
-        columns,
-        spacing,
-        rowSpacing,
-        columnSpacing,
-        style: [{ width: "100%" }, style],
-        columnStyle
-      },
-      resolvedData.map((item, index) => /* @__PURE__ */ _react2.default.createElement(MasonryGridItem, { key: resolvedKeyExtractor(item, index) }, resolvedRenderer({ item, index })))
-    ),
-    footer
-  );
-};
-MasonryGridBuilder.displayName = "MasonryGridBuilder";
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-exports.Align = Align; exports.AspectRatio = AspectRatio; exports.BlurView = BlurView; exports.Center = Center; exports.Column = Column; exports.ConditionalView = ConditionalView; exports.ConstrainedBox = ConstrainedBox; exports.Container = Container; exports.Expanded = Expanded; exports.Flex = Flex; exports.Flexible = Flexible; exports.FractionallySizedBox = FractionallySizedBox; exports.Grid = Grid; exports.GridBuilder = GridBuilder; exports.GridItem = GridItem; exports.Margin = Margin; exports.MasonryGrid = MasonryGrid; exports.MasonryGridBuilder = MasonryGridBuilder; exports.MasonryGridItem = MasonryGridItem; exports.Padding = Padding; exports.PositionedView = PositionedView; exports.RoundedView = RoundedView; exports.Row = Row; exports.Screen = Screen; exports.SizedBox = SizedBox; exports.Spacer = Spacer; exports.Surface = Surface; exports.Wrap = Wrap;