@onlynative/components 0.0.0-alpha.0 → 0.0.0-alpha.1

package/dist/list/index.js

@@ -28,15 +28,16 @@ module.exports = __toCommonJS(list_exports);
 
 // src/list/List.tsx
 var import_react = require("react");
-var import_react_native4 = require("react-native");
+var import_react_native5 = require("react-native");
 var import_core = require("@onlynative/core");
 
 // src/list/styles.ts
-var import_react_native3 = require("react-native");
+var import_react_native4 = require("react-native");
 
 // ../utils/dist/index.mjs
 var import_react_native = require("react-native");
 var import_react_native2 = require("react-native");
+var import_react_native3 = require("react-native");
 function parseHexColor(color) {
   const normalized = color.replace("#", "");
   if (normalized.length !== 6 && normalized.length !== 8) {
@@ -79,6 +80,24 @@ function blendColor(base, overlay, overlayAlpha) {
   );
   return `rgb(${r}, ${g}, ${b})`;
 }
+function resolvePressableStyle(base, hovered, pressed, disabled, isDisabled, style) {
+  if (typeof style === "function") {
+    return (state) => [
+      base,
+      state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
+      state.pressed && !isDisabled ? pressed : void 0,
+      isDisabled ? disabled : void 0,
+      style(state)
+    ];
+  }
+  return (state) => [
+    base,
+    state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
+    state.pressed && !isDisabled ? pressed : void 0,
+    isDisabled ? disabled : void 0,
+    style
+  ];
+}
 
 // src/list/styles.ts
 var ITEM_PADDING_VERTICAL = 12;
@@ -89,7 +108,7 @@ var MIN_HEIGHT = {
   3: 88
 };
 function createListStyles(theme) {
-  return import_react_native3.StyleSheet.create({
+  return import_react_native4.StyleSheet.create({
     container: {
       paddingVertical: theme.spacing.sm
     }
@@ -126,7 +145,7 @@ function getItemColors(theme, containerColor) {
 }
 function createListItemStyles(theme, lines, containerColor) {
   const colors = getItemColors(theme, containerColor);
-  return import_react_native3.StyleSheet.create({
+  return import_react_native4.StyleSheet.create({
     container: {
       flexDirection: "row",
       alignItems: lines === 3 ? "flex-start" : "center",
@@ -181,7 +200,7 @@ function createListItemStyles(theme, lines, containerColor) {
   });
 }
 function createDividerStyles(theme, inset) {
-  return import_react_native3.StyleSheet.create({
+  return import_react_native4.StyleSheet.create({
     divider: {
       height: 1,
       backgroundColor: theme.colors.outlineVariant,
@@ -195,12 +214,12 @@ var import_jsx_runtime = require("react/jsx-runtime");
 function List({ children, style, ...props }) {
   const theme = (0, import_core.useTheme)();
   const styles = (0, import_react.useMemo)(() => createListStyles(theme), [theme]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native4.View, { ...props, style: [styles.container, style], children });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native5.View, { ...props, style: [styles.container, style], children });
 }
 
 // src/list/ListItem.tsx
 var import_react2 = require("react");
-var import_react_native5 = require("react-native");
+var import_react_native6 = require("react-native");
 var import_core2 = require("@onlynative/core");
 var import_jsx_runtime2 = require("react/jsx-runtime");
 function getLines(supportingText, overlineText, supportingTextNumberOfLines) {
@@ -227,18 +246,22 @@ function ListItem({
   const isDisabled = Boolean(disabled);
   const isInteractive = onPress !== void 0;
   const theme = (0, import_core2.useTheme)();
-  const lines = getLines(supportingText, overlineText, supportingTextNumberOfLines);
+  const lines = getLines(
+    supportingText,
+    overlineText,
+    supportingTextNumberOfLines
+  );
   const styles = (0, import_react2.useMemo)(
     () => createListItemStyles(theme, lines, containerColor),
     [theme, lines, containerColor]
   );
   const content = /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-    leadingContent != null && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native5.View, { style: styles.leadingContent, children: leadingContent }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react_native5.View, { style: styles.textBlock, children: [
-      overlineText != null && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native5.Text, { style: styles.overlineText, numberOfLines: 1, children: overlineText }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native5.Text, { style: styles.headlineText, numberOfLines: 1, children: headlineText }),
+    leadingContent != null && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native6.View, { style: styles.leadingContent, children: leadingContent }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react_native6.View, { style: styles.textBlock, children: [
+      overlineText != null && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native6.Text, { style: styles.overlineText, numberOfLines: 1, children: overlineText }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native6.Text, { style: styles.headlineText, numberOfLines: 1, children: headlineText }),
       supportingText != null && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        import_react_native5.Text,
+        import_react_native6.Text,
         {
           style: styles.supportingText,
           numberOfLines: supportingTextNumberOfLines,
@@ -246,40 +269,39 @@ function ListItem({
         }
       )
     ] }),
-    (trailingContent != null || trailingSupportingText != null) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react_native5.View, { style: styles.trailingBlock, children: [
-      trailingSupportingText != null && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native5.Text, { style: styles.trailingSupportingText, numberOfLines: 1, children: trailingSupportingText }),
+    (trailingContent != null || trailingSupportingText != null) && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react_native6.View, { style: styles.trailingBlock, children: [
+      trailingSupportingText != null && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native6.Text, { style: styles.trailingSupportingText, numberOfLines: 1, children: trailingSupportingText }),
       trailingContent
     ] })
   ] });
   if (!isInteractive) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native5.View, { ...props, style: [styles.container, style], children: content });
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native6.View, { ...props, style: [styles.container, style], children: content });
   }
-  const resolvedStyle = (state) => [
-    styles.container,
-    styles.interactiveContainer,
-    state.hovered && !state.pressed && !isDisabled ? styles.hoveredContainer : void 0,
-    state.pressed && !isDisabled ? styles.pressedContainer : void 0,
-    isDisabled ? styles.disabledContainer : void 0,
-    typeof style === "function" ? style(state) : style
-  ];
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    import_react_native5.Pressable,
+    import_react_native6.Pressable,
     {
       ...props,
       role: "button",
       accessibilityState: { disabled: isDisabled },
-      hitSlop: import_react_native5.Platform.OS === "web" ? void 0 : 4,
+      hitSlop: import_react_native6.Platform.OS === "web" ? void 0 : 4,
       disabled: isDisabled,
       onPress,
-      style: resolvedStyle,
-      children: isDisabled ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native5.View, { style: styles.disabledContentWrapper, children: content }) : content
+      style: resolvePressableStyle(
+        [styles.container, styles.interactiveContainer],
+        styles.hoveredContainer,
+        styles.pressedContainer,
+        styles.disabledContainer,
+        isDisabled,
+        style
+      ),
+      children: isDisabled ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native6.View, { style: styles.disabledContentWrapper, children: content }) : content
     }
   );
 }
 
 // src/list/ListDivider.tsx
 var import_react3 = require("react");
-var import_react_native6 = require("react-native");
+var import_react_native7 = require("react-native");
 var import_core3 = require("@onlynative/core");
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function ListDivider({
@@ -292,7 +314,7 @@ function ListDivider({
     () => createDividerStyles(theme, inset),
     [theme, inset]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native6.View, { ...props, style: [styles.divider, style] });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native7.View, { ...props, style: [styles.divider, style] });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/radio/index.js

@@ -26,15 +26,13 @@ module.exports = __toCommonJS(radio_exports);
 
 // src/radio/Radio.tsx
 var import_react = require("react");
-var import_react_native4 = require("react-native");
+var import_react_native5 = require("react-native");
 var import_core = require("@onlynative/core");
 
-// src/radio/styles.ts
-var import_react_native3 = require("react-native");
-
 // ../utils/dist/index.mjs
 var import_react_native = require("react-native");
 var import_react_native2 = require("react-native");
+var import_react_native3 = require("react-native");
 function parseHexColor(color) {
   const normalized = color.replace("#", "");
   if (normalized.length !== 6 && normalized.length !== 8) {
@@ -59,8 +57,27 @@ function alphaColor(color, alpha) {
   }
   return `rgba(${channels.r}, ${channels.g}, ${channels.b}, ${boundedAlpha})`;
 }
+function resolvePressableStyle(base, hovered, pressed, disabled, isDisabled, style) {
+  if (typeof style === "function") {
+    return (state) => [
+      base,
+      state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
+      state.pressed && !isDisabled ? pressed : void 0,
+      isDisabled ? disabled : void 0,
+      style(state)
+    ];
+  }
+  return (state) => [
+    base,
+    state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
+    state.pressed && !isDisabled ? pressed : void 0,
+    isDisabled ? disabled : void 0,
+    style
+  ];
+}
 
 // src/radio/styles.ts
+var import_react_native4 = require("react-native");
 function getColors(theme, selected) {
   const disabledOnSurface38 = alphaColor(theme.colors.onSurface, 0.38);
   if (selected) {
@@ -124,7 +141,7 @@ function createStyles(theme, selected, containerColor, contentColor) {
   const outerSize = 20;
   const innerSize = 10;
   const touchTarget = 48;
-  return import_react_native3.StyleSheet.create({
+  return import_react_native4.StyleSheet.create({
     container: {
       width: touchTarget,
       height: touchTarget,
@@ -169,24 +186,6 @@ function createStyles(theme, selected, containerColor, contentColor) {
 
 // src/radio/Radio.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
-function resolveStyle(containerStyle, hoveredContainerStyle, pressedContainerStyle, disabledContainerStyle, disabled, style) {
-  if (typeof style === "function") {
-    return (state) => [
-      containerStyle,
-      state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
-      state.pressed && !disabled ? pressedContainerStyle : void 0,
-      disabled ? disabledContainerStyle : void 0,
-      style(state)
-    ];
-  }
-  return (state) => [
-    containerStyle,
-    state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
-    state.pressed && !disabled ? pressedContainerStyle : void 0,
-    disabled ? disabledContainerStyle : void 0,
-    style
-  ];
-}
 function Radio({
   style,
   value = false,
@@ -209,7 +208,7 @@ function Radio({
     }
   };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_react_native4.Pressable,
+    import_react_native5.Pressable,
     {
       ...props,
       accessibilityRole: "radio",
@@ -217,10 +216,10 @@ function Radio({
         disabled: isDisabled,
         checked: isSelected
       },
-      hitSlop: import_react_native4.Platform.OS === "web" ? void 0 : 4,
+      hitSlop: import_react_native5.Platform.OS === "web" ? void 0 : 4,
       disabled: isDisabled,
       onPress: handlePress,
-      style: resolveStyle(
+      style: resolvePressableStyle(
         styles.container,
         styles.hoveredContainer,
         styles.pressedContainer,
@@ -229,11 +228,11 @@ function Radio({
         style
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_react_native4.View,
+        import_react_native5.View,
         {
           style: [styles.outer, isDisabled ? styles.disabledOuter : void 0],
           children: isSelected ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            import_react_native4.View,
+            import_react_native5.View,
             {
               style: [
                 styles.inner,

package/dist/switch/index.js

@@ -26,7 +26,7 @@ module.exports = __toCommonJS(switch_exports);
 
 // src/switch/Switch.tsx
 var import_react = require("react");
-var import_react_native4 = require("react-native");
+var import_react_native5 = require("react-native");
 var import_core = require("@onlynative/core");
 
 // ../utils/dist/chunk-OQRDRRQA.mjs
@@ -40,6 +40,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 // ../utils/dist/index.mjs
 var import_react_native = require("react-native");
 var import_react_native2 = require("react-native");
+var import_react_native3 = require("react-native");
 function parseHexColor(color) {
   const normalized = color.replace("#", "");
   if (normalized.length !== 6 && normalized.length !== 8) {
@@ -101,9 +102,31 @@ function getMaterialCommunityIcons() {
   }
   return _MCIcons;
 }
+function resolvePressableStyle(base, hovered, pressed, disabled, isDisabled, style) {
+  if (typeof style === "function") {
+    return (state) => [
+      base,
+      state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
+      state.pressed && !isDisabled ? pressed : void 0,
+      isDisabled ? disabled : void 0,
+      style(state)
+    ];
+  }
+  return (state) => [
+    base,
+    state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
+    state.pressed && !isDisabled ? pressed : void 0,
+    isDisabled ? disabled : void 0,
+    style
+  ];
+}
+function resolveColorFromStyle(...styles) {
+  const flattened = import_react_native2.StyleSheet.flatten(styles);
+  return typeof (flattened == null ? void 0 : flattened.color) === "string" ? flattened.color : void 0;
+}
 
 // src/switch/styles.ts
-var import_react_native3 = require("react-native");
+var import_react_native4 = require("react-native");
 function getColors(theme, selected) {
   const disabledOnSurface12 = alphaColor(theme.colors.onSurface, 0.12);
   const disabledOnSurface38 = alphaColor(theme.colors.onSurface, 0.38);
@@ -191,7 +214,7 @@ function createStyles(theme, selected, hasIcon, containerColor, contentColor) {
   const trackHeight = 32;
   const trackPadding = 4;
   const thumbOffset = selected ? trackWidth - trackPadding - thumbSize : trackPadding;
-  return import_react_native3.StyleSheet.create({
+  return import_react_native4.StyleSheet.create({
     track: {
       width: trackWidth,
       height: trackHeight,
@@ -237,24 +260,6 @@ function createStyles(theme, selected, hasIcon, containerColor, contentColor) {
 
 // src/switch/Switch.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
-function resolveStyle(trackStyle, hoveredTrackStyle, pressedTrackStyle, disabledTrackStyle, disabled, style) {
-  if (typeof style === "function") {
-    return (state) => [
-      trackStyle,
-      state.hovered && !state.pressed && !disabled ? hoveredTrackStyle : void 0,
-      state.pressed && !disabled ? pressedTrackStyle : void 0,
-      disabled ? disabledTrackStyle : void 0,
-      style(state)
-    ];
-  }
-  return (state) => [
-    trackStyle,
-    state.hovered && !state.pressed && !disabled ? hoveredTrackStyle : void 0,
-    state.pressed && !disabled ? pressedTrackStyle : void 0,
-    disabled ? disabledTrackStyle : void 0,
-    style
-  ];
-}
 function Switch({
   style,
   value = false,
@@ -274,13 +279,13 @@ function Switch({
     () => createStyles(theme, isSelected, hasIcon, containerColor, contentColor),
     [theme, isSelected, hasIcon, containerColor, contentColor]
   );
-  const resolvedIconColor = (0, import_react.useMemo)(() => {
-    const base = import_react_native4.StyleSheet.flatten([
+  const resolvedIconColor = (0, import_react.useMemo)(
+    () => resolveColorFromStyle(
       styles.iconColor,
       isDisabled ? styles.disabledIconColor : void 0
-    ]);
-    return typeof (base == null ? void 0 : base.color) === "string" ? base.color : void 0;
-  }, [styles.iconColor, styles.disabledIconColor, isDisabled]);
+    ),
+    [styles.iconColor, styles.disabledIconColor, isDisabled]
+  );
   const handlePress = () => {
     if (!isDisabled) {
       onValueChange == null ? void 0 : onValueChange(!isSelected);
@@ -290,7 +295,7 @@ function Switch({
   const MaterialCommunityIcons = iconName ? getMaterialCommunityIcons() : null;
   const iconSize = 16;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_react_native4.Pressable,
+    import_react_native5.Pressable,
     {
       ...props,
       accessibilityRole: "switch",
@@ -298,10 +303,10 @@ function Switch({
         disabled: isDisabled,
         checked: isSelected
       },
-      hitSlop: import_react_native4.Platform.OS === "web" ? void 0 : 4,
+      hitSlop: import_react_native5.Platform.OS === "web" ? void 0 : 4,
       disabled: isDisabled,
       onPress: handlePress,
-      style: resolveStyle(
+      style: resolvePressableStyle(
         styles.track,
         styles.hoveredTrack,
         styles.pressedTrack,
@@ -310,7 +315,7 @@ function Switch({
         style
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_react_native4.View,
+        import_react_native5.View,
         {
           style: [styles.thumb, isDisabled ? styles.disabledThumb : void 0],
           children: iconName ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(

package/dist/text-field/index.js

@@ -26,7 +26,7 @@ module.exports = __toCommonJS(text_field_exports);
 
 // src/text-field/TextField.tsx
 var import_react = require("react");
-var import_react_native4 = require("react-native");
+var import_react_native5 = require("react-native");
 var import_core = require("@onlynative/core");
 
 // ../utils/dist/chunk-OQRDRRQA.mjs
@@ -40,6 +40,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 // ../utils/dist/index.mjs
 var import_react_native = require("react-native");
 var import_react_native2 = require("react-native");
+var import_react_native3 = require("react-native");
 function parseHexColor(color) {
   const normalized = color.replace("#", "");
   if (normalized.length !== 6 && normalized.length !== 8) {
@@ -84,11 +85,11 @@ function getMaterialCommunityIcons() {
   return _MCIcons;
 }
 function transformOrigin(vertical = "top") {
-  return import_react_native2.I18nManager.isRTL ? `right ${vertical}` : `left ${vertical}`;
+  return import_react_native3.I18nManager.isRTL ? `right ${vertical}` : `left ${vertical}`;
 }
 
 // src/text-field/styles.ts
-var import_react_native3 = require("react-native");
+var import_react_native4 = require("react-native");
 var CONTAINER_HEIGHT = 56;
 var ICON_SIZE = 24;
 var LABEL_FLOATED_LINE_HEIGHT = 16;
@@ -147,7 +148,7 @@ function createStyles(theme, variant) {
   const isFilled = variant === "filled";
   return {
     colors,
-    styles: import_react_native3.StyleSheet.create({
+    styles: import_react_native4.StyleSheet.create({
       root: {
         alignSelf: "stretch"
       },
@@ -324,13 +325,13 @@ function TextField({
   const isControlled = value !== void 0;
   const hasValue = isControlled ? value !== "" : internalHasText;
   const isLabelFloated = isFocused || hasValue;
-  const labelAnimRef = (0, import_react.useRef)(new import_react_native4.Animated.Value(isLabelFloated ? 1 : 0));
+  const labelAnimRef = (0, import_react.useRef)(new import_react_native5.Animated.Value(isLabelFloated ? 1 : 0));
   const labelAnim = labelAnimRef.current;
   (0, import_react.useEffect)(() => {
-    import_react_native4.Animated.timing(labelAnim, {
+    import_react_native5.Animated.timing(labelAnim, {
       toValue: isLabelFloated ? 1 : 0,
       duration: 150,
-      useNativeDriver: import_react_native4.Platform.OS !== "web"
+      useNativeDriver: import_react_native5.Platform.OS !== "web"
     }).start();
   }, [isLabelFloated, labelAnim]);
   const labelScale = (0, import_react.useMemo)(() => {
@@ -408,9 +409,9 @@ function TextField({
     [styles, isFocused, isError, isDisabled]
   );
   const displaySupportingText = isError ? errorText : supportingText;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native4.View, { style: [styles.root, style], children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native4.Pressable, { onPress: handleContainerPress, disabled: isDisabled, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native4.View, { style: containerStyle, children: [
-      leadingIcon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native4.View, { style: styles.leadingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native5.View, { style: [styles.root, style], children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native5.Pressable, { onPress: handleContainerPress, disabled: isDisabled, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native5.View, { style: containerStyle, children: [
+      leadingIcon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native5.View, { style: styles.leadingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         MaterialCommunityIcons,
         {
           name: leadingIcon,
@@ -419,14 +420,14 @@ function TextField({
         }
       ) }) : null,
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_react_native4.View,
+        import_react_native5.View,
         {
           style: [
             styles.inputWrapper,
             label ? styles.inputWrapperWithLabel : void 0
           ],
           children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            import_react_native4.TextInput,
+            import_react_native5.TextInput,
             {
               ref: inputRef,
               ...textInputProps,
@@ -452,14 +453,14 @@ function TextField({
         }
       ),
       trailingIcon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_react_native4.Pressable,
+        import_react_native5.Pressable,
         {
           onPress: onTrailingIconPress,
           disabled: isDisabled || !onTrailingIconPress,
           accessibilityRole: "button",
           hitSlop: 12,
           style: styles.trailingIconPressable,
-          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native4.View, { style: styles.trailingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native5.View, { style: styles.trailingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             MaterialCommunityIcons,
             {
               name: trailingIcon,
@@ -470,7 +471,7 @@ function TextField({
         }
       ) : null,
       label ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_react_native4.Animated.Text,
+        import_react_native5.Animated.Text,
         {
           numberOfLines: 1,
           style: [
@@ -490,10 +491,10 @@ function TextField({
           children: label
         }
       ) : null,
-      isFilled ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native4.View, { style: indicatorStyle }) : null
+      isFilled ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native5.View, { style: indicatorStyle }) : null
     ] }) }),
-    displaySupportingText ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native4.View, { style: styles.supportingTextRow, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_react_native4.Text,
+    displaySupportingText ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native5.View, { style: styles.supportingTextRow, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_react_native5.Text,
       {
         style: [
           styles.supportingText,

package/llms.txt

@@ -1,7 +1,7 @@
 # @onlynative/components — MD3 UI Components for React Native
 
-> Version: 0.1.1-alpha.3
-> Peer deps: @onlynative/core >=0.1.1-alpha.3, react >=18, react-native >=0.72, react-native-safe-area-context >=4
+> Version: 0.0.0-alpha.1
+> Peer deps: @onlynative/core >=0.0.0-alpha.1, react >=18, react-native >=0.72, react-native-safe-area-context >=4
 > Optional: @expo/vector-icons >=14 (only needed for icon props)
 
 ## Usage

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@onlynative/components",
-  "version": "0.0.0-alpha.0",
-  "description": "Material Design 3 UI components for React Native — Button, Card, Chip, TextField, and more.",
+  "version": "0.0.0-alpha.1",
+  "description": "Material Design 3 UI components for React Native, part of OnlyNative UI.",
   "private": false,
   "sideEffects": false,
   "main": "dist/index.js",
@@ -13,91 +13,76 @@
     ".": {
       "types": "./dist/index.d.ts",
       "react-native": "./src/index.ts",
-      "browser": "./src/index.ts",
       "default": "./dist/index.js"
     },
     "./typography": {
       "types": "./dist/typography/index.d.ts",
       "react-native": "./src/typography/index.ts",
-      "browser": "./src/typography/index.ts",
       "default": "./dist/typography/index.js"
     },
     "./layout": {
       "types": "./dist/layout/index.d.ts",
       "react-native": "./src/layout/index.ts",
-      "browser": "./src/layout/index.ts",
       "default": "./dist/layout/index.js"
     },
     "./button": {
       "types": "./dist/button/index.d.ts",
       "react-native": "./src/button/index.ts",
-      "browser": "./src/button/index.ts",
       "default": "./dist/button/index.js"
     },
     "./icon-button": {
       "types": "./dist/icon-button/index.d.ts",
       "react-native": "./src/icon-button/index.ts",
-      "browser": "./src/icon-button/index.ts",
       "default": "./dist/icon-button/index.js"
     },
     "./appbar": {
       "types": "./dist/appbar/index.d.ts",
       "react-native": "./src/appbar/index.ts",
-      "browser": "./src/appbar/index.ts",
       "default": "./dist/appbar/index.js"
     },
     "./card": {
       "types": "./dist/card/index.d.ts",
       "react-native": "./src/card/index.ts",
-      "browser": "./src/card/index.ts",
       "default": "./dist/card/index.js"
     },
     "./chip": {
       "types": "./dist/chip/index.d.ts",
       "react-native": "./src/chip/index.ts",
-      "browser": "./src/chip/index.ts",
       "default": "./dist/chip/index.js"
     },
     "./checkbox": {
       "types": "./dist/checkbox/index.d.ts",
       "react-native": "./src/checkbox/index.ts",
-      "browser": "./src/checkbox/index.ts",
       "default": "./dist/checkbox/index.js"
     },
     "./radio": {
       "types": "./dist/radio/index.d.ts",
       "react-native": "./src/radio/index.ts",
-      "browser": "./src/radio/index.ts",
       "default": "./dist/radio/index.js"
     },
     "./switch": {
       "types": "./dist/switch/index.d.ts",
       "react-native": "./src/switch/index.ts",
-      "browser": "./src/switch/index.ts",
       "default": "./dist/switch/index.js"
     },
     "./text-field": {
       "types": "./dist/text-field/index.d.ts",
       "react-native": "./src/text-field/index.ts",
-      "browser": "./src/text-field/index.ts",
       "default": "./dist/text-field/index.js"
     },
     "./list": {
       "types": "./dist/list/index.d.ts",
       "react-native": "./src/list/index.ts",
-      "browser": "./src/list/index.ts",
       "default": "./dist/list/index.js"
     },
     "./keyboard-avoiding-wrapper": {
       "types": "./dist/keyboard-avoiding-wrapper/index.d.ts",
       "react-native": "./src/keyboard-avoiding-wrapper/index.ts",
-      "browser": "./src/keyboard-avoiding-wrapper/index.ts",
       "default": "./dist/keyboard-avoiding-wrapper/index.js"
     },
     "./avatar": {
       "types": "./dist/avatar/index.d.ts",
       "react-native": "./src/avatar/index.ts",
-      "browser": "./src/avatar/index.ts",
       "default": "./dist/avatar/index.js"
     }
   },
@@ -175,7 +160,7 @@
   },
   "peerDependencies": {
     "@expo/vector-icons": ">=14.0.0",
-    "@onlynative/core": ">=0.0.0-alpha.0",
+    "@onlynative/core": ">=0.0.0-alpha.1",
     "react": ">=18.0.0",
     "react-native": ">=0.72.0",
     "react-native-safe-area-context": ">=4.0.0"