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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -339,9 +339,7 @@ function Grid({
339
339
 
340
340
  // src/button/Button.tsx
341
341
  var import_react7 = require("react");
342
- var import_react_native8 = require("react-native");
343
342
  var import_react_native9 = require("react-native");
344
- var import_react_native10 = require("react-native");
345
343
  var import_core5 = require("@onlynative/core");
346
344
 
347
345
  // ../utils/dist/chunk-OQRDRRQA.mjs
@@ -355,6 +353,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
355
353
  // ../utils/dist/index.mjs
356
354
  var import_react_native5 = require("react-native");
357
355
  var import_react_native6 = require("react-native");
356
+ var import_react_native7 = require("react-native");
358
357
  function parseHexColor(color) {
359
358
  const normalized = color.replace("#", "");
360
359
  if (normalized.length !== 6 && normalized.length !== 8) {
@@ -437,15 +436,37 @@ function getMaterialCommunityIcons() {
437
436
  }
438
437
  return _MCIcons;
439
438
  }
439
+ function resolvePressableStyle(base, hovered, pressed, disabled, isDisabled, style) {
440
+ if (typeof style === "function") {
441
+ return (state) => [
442
+ base,
443
+ state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
444
+ state.pressed && !isDisabled ? pressed : void 0,
445
+ isDisabled ? disabled : void 0,
446
+ style(state)
447
+ ];
448
+ }
449
+ return (state) => [
450
+ base,
451
+ state.hovered && !state.pressed && !isDisabled ? hovered : void 0,
452
+ state.pressed && !isDisabled ? pressed : void 0,
453
+ isDisabled ? disabled : void 0,
454
+ style
455
+ ];
456
+ }
457
+ function resolveColorFromStyle(...styles3) {
458
+ const flattened = import_react_native6.StyleSheet.flatten(styles3);
459
+ return typeof (flattened == null ? void 0 : flattened.color) === "string" ? flattened.color : void 0;
460
+ }
440
461
  function transformOrigin(vertical = "top") {
441
- return import_react_native6.I18nManager.isRTL ? `right ${vertical}` : `left ${vertical}`;
462
+ return import_react_native7.I18nManager.isRTL ? `right ${vertical}` : `left ${vertical}`;
442
463
  }
443
464
  function selectRTL(ltr, rtl) {
444
- return import_react_native6.I18nManager.isRTL ? rtl : ltr;
465
+ return import_react_native7.I18nManager.isRTL ? rtl : ltr;
445
466
  }
446
467
 
447
468
  // src/button/styles.ts
448
- var import_react_native7 = require("react-native");
469
+ var import_react_native8 = require("react-native");
449
470
  function getVariantColors(theme, variant) {
450
471
  const disabledContainerColor = alphaColor(theme.colors.onSurface, 0.12);
451
472
  const disabledLabelColor = alphaColor(theme.colors.onSurface, 0.38);
@@ -626,7 +647,7 @@ function createStyles(theme, variant, hasLeadingIcon, hasTrailingIcon, container
626
647
  const elevationLevel1 = elevationStyle(theme.elevation.level1);
627
648
  const elevationLevel2 = elevationStyle(theme.elevation.level2);
628
649
  const baseElevation = variant === "elevated" ? elevationLevel1 : elevationLevel0;
629
- return import_react_native7.StyleSheet.create({
650
+ return import_react_native8.StyleSheet.create({
630
651
  container: {
631
652
  alignSelf: "flex-start",
632
653
  alignItems: "center",
@@ -679,24 +700,6 @@ function createStyles(theme, variant, hasLeadingIcon, hasTrailingIcon, container
679
700
 
680
701
  // src/button/Button.tsx
681
702
  var import_jsx_runtime7 = require("react/jsx-runtime");
682
- function resolveStyle(containerStyle, hoveredContainerStyle, pressedContainerStyle, disabledContainerStyle, disabled, style) {
683
- if (typeof style === "function") {
684
- return (state) => [
685
- containerStyle,
686
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
687
- state.pressed && !disabled ? pressedContainerStyle : void 0,
688
- disabled ? disabledContainerStyle : void 0,
689
- style(state)
690
- ];
691
- }
692
- return (state) => [
693
- containerStyle,
694
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
695
- state.pressed && !disabled ? pressedContainerStyle : void 0,
696
- disabled ? disabledContainerStyle : void 0,
697
- style
698
- ];
699
- }
700
703
  function Button({
701
704
  children,
702
705
  style,
@@ -726,13 +729,13 @@ function Button({
726
729
  [theme, variant, hasLeading, hasTrailing, containerColor, contentColor]
727
730
  );
728
731
  const MaterialCommunityIcons = leadingIcon || trailingIcon ? getMaterialCommunityIcons() : null;
729
- const resolvedIconColor = (0, import_react7.useMemo)(() => {
730
- const base = import_react_native9.StyleSheet.flatten([
732
+ const resolvedIconColor = (0, import_react7.useMemo)(
733
+ () => resolveColorFromStyle(
731
734
  styles3.label,
732
735
  isDisabled ? styles3.disabledLabel : void 0
733
- ]);
734
- return typeof (base == null ? void 0 : base.color) === "string" ? base.color : void 0;
735
- }, [styles3.label, styles3.disabledLabel, isDisabled]);
736
+ ),
737
+ [styles3.label, styles3.disabledLabel, isDisabled]
738
+ );
736
739
  const computedLabelStyle = (0, import_react7.useMemo)(
737
740
  () => [
738
741
  styles3.label,
@@ -742,14 +745,14 @@ function Button({
742
745
  [isDisabled, styles3.disabledLabel, styles3.label, labelStyleOverride]
743
746
  );
744
747
  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
745
- import_react_native8.Pressable,
748
+ import_react_native9.Pressable,
746
749
  {
747
750
  ...props,
748
751
  accessibilityRole: "button",
749
752
  accessibilityState: { disabled: isDisabled },
750
- hitSlop: import_react_native8.Platform.OS === "web" ? void 0 : 4,
753
+ hitSlop: import_react_native9.Platform.OS === "web" ? void 0 : 4,
751
754
  disabled: isDisabled,
752
- style: resolveStyle(
755
+ style: resolvePressableStyle(
753
756
  styles3.container,
754
757
  styles3.hoveredContainer,
755
758
  styles3.pressedContainer,
@@ -767,7 +770,7 @@ function Button({
767
770
  style: styles3.leadingIcon
768
771
  }
769
772
  ) : null,
770
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react_native10.Text, { style: computedLabelStyle, children }),
773
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react_native9.Text, { style: computedLabelStyle, children }),
771
774
  trailingIcon ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
772
775
  MaterialCommunityIcons,
773
776
  {
@@ -784,16 +787,16 @@ function Button({
784
787
 
785
788
  // src/icon-button/IconButton.tsx
786
789
  var import_react8 = require("react");
787
- var import_react_native12 = require("react-native");
790
+ var import_react_native11 = require("react-native");
788
791
  var import_core6 = require("@onlynative/core");
789
792
 
790
793
  // src/icon-button/styles.ts
791
- var import_react_native11 = require("react-native");
794
+ var import_react_native10 = require("react-native");
792
795
  function createStyles2(theme) {
793
796
  const disabledContainerColor = alphaColor(theme.colors.onSurface, 0.12);
794
797
  const disabledOutlineColor = alphaColor(theme.colors.onSurface, 0.12);
795
798
  const toggleUnselectedContainerColor = theme.colors.surfaceContainerHighest;
796
- return import_react_native11.StyleSheet.create({
799
+ return import_react_native10.StyleSheet.create({
797
800
  container: {
798
801
  borderRadius: theme.shape.cornerFull,
799
802
  alignItems: "center",
@@ -1231,7 +1234,7 @@ function IconButton({
1231
1234
  };
1232
1235
  }, [containerColor, resolvedIconColor, theme.stateLayer]);
1233
1236
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1234
- import_react_native12.Pressable,
1237
+ import_react_native11.Pressable,
1235
1238
  {
1236
1239
  ...props,
1237
1240
  accessibilityRole: "button",
@@ -1274,12 +1277,12 @@ function IconButton({
1274
1277
 
1275
1278
  // src/appbar/AppBar.tsx
1276
1279
  var import_react9 = require("react");
1277
- var import_react_native14 = require("react-native");
1280
+ var import_react_native13 = require("react-native");
1278
1281
  var import_react_native_safe_area_context2 = require("react-native-safe-area-context");
1279
1282
  var import_core8 = require("@onlynative/core");
1280
1283
 
1281
1284
  // src/appbar/styles.ts
1282
- var import_react_native13 = require("react-native");
1285
+ var import_react_native12 = require("react-native");
1283
1286
  var import_core7 = require("@onlynative/core");
1284
1287
  function getColorSchemeColors(theme, colorScheme) {
1285
1288
  switch (colorScheme) {
@@ -1337,7 +1340,7 @@ function getColorSchemeColors(theme, colorScheme) {
1337
1340
  function createStyles3(theme, schemeColors) {
1338
1341
  var _a;
1339
1342
  const topAppBar = (_a = theme.topAppBar) != null ? _a : import_core7.defaultTopAppBarTokens;
1340
- return import_react_native13.StyleSheet.create({
1343
+ return import_react_native12.StyleSheet.create({
1341
1344
  root: {
1342
1345
  backgroundColor: schemeColors.containerColor
1343
1346
  },
@@ -1426,7 +1429,7 @@ function createStyles3(theme, schemeColors) {
1426
1429
  // src/appbar/AppBar.tsx
1427
1430
  var import_jsx_runtime9 = require("react/jsx-runtime");
1428
1431
  function getBackIcon() {
1429
- if (import_react_native14.Platform.OS === "ios") {
1432
+ if (import_react_native13.Platform.OS === "ios") {
1430
1433
  return selectRTL("chevron-left", "chevron-right");
1431
1434
  }
1432
1435
  return selectRTL("arrow-left", "arrow-right");
@@ -1457,7 +1460,7 @@ function withTopInset(enabled, content, style) {
1457
1460
  if (enabled) {
1458
1461
  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native_safe_area_context2.SafeAreaView, { edges: ["top"], style, children: content });
1459
1462
  }
1460
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native14.View, { style, children: content });
1463
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native13.View, { style, children: content });
1461
1464
  }
1462
1465
  function measureWidth(event) {
1463
1466
  return Math.round(event.nativeEvent.layout.width);
@@ -1518,7 +1521,7 @@ function AppBar({
1518
1521
  if (!canGoBack) {
1519
1522
  return null;
1520
1523
  }
1521
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native14.View, { style: styles3.iconFrame, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1524
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native13.View, { style: styles3.iconFrame, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1522
1525
  IconButton,
1523
1526
  {
1524
1527
  icon: getBackIcon(),
@@ -1537,8 +1540,8 @@ function AppBar({
1537
1540
  if (!actions || actions.length === 0) {
1538
1541
  return null;
1539
1542
  }
1540
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native14.View, { style: styles3.actionsRow, children: actions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1541
- import_react_native14.View,
1543
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native13.View, { style: styles3.actionsRow, children: actions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1544
+ import_react_native13.View,
1542
1545
  {
1543
1546
  style: styles3.iconFrame,
1544
1547
  children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
@@ -1575,9 +1578,9 @@ function AppBar({
1575
1578
  return nextWidth;
1576
1579
  });
1577
1580
  }, []);
1578
- const topRow = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native14.View, { style: styles3.topRow, children: [
1581
+ const topRow = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native13.View, { style: styles3.topRow, children: [
1579
1582
  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1580
- import_react_native14.View,
1583
+ import_react_native13.View,
1581
1584
  {
1582
1585
  collapsable: false,
1583
1586
  onLayout: onLeadingLayout,
@@ -1585,9 +1588,9 @@ function AppBar({
1585
1588
  children: leadingContent
1586
1589
  }
1587
1590
  ),
1588
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native14.View, { style: styles3.topRowSpacer }),
1591
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native13.View, { style: styles3.topRowSpacer }),
1589
1592
  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1590
- import_react_native14.View,
1593
+ import_react_native13.View,
1591
1594
  {
1592
1595
  collapsable: false,
1593
1596
  onLayout: onActionsLayout,
@@ -1609,10 +1612,10 @@ function AppBar({
1609
1612
  containerOverride
1610
1613
  ];
1611
1614
  if (isExpanded) {
1612
- const content2 = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native14.View, { style: [styles3.expandedContainer, getSizeStyle2(styles3, size)], children: [
1615
+ const content2 = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native13.View, { style: [styles3.expandedContainer, getSizeStyle2(styles3, size)], children: [
1613
1616
  topRow,
1614
1617
  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1615
- import_react_native14.View,
1618
+ import_react_native13.View,
1616
1619
  {
1617
1620
  style: [
1618
1621
  styles3.expandedTitleContainer,
@@ -1636,11 +1639,11 @@ function AppBar({
1636
1639
  }
1637
1640
  )
1638
1641
  ] });
1639
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native14.View, { style: rootStyle, children: withTopInset(insetTop, content2, safeAreaStyle) });
1642
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native13.View, { style: rootStyle, children: withTopInset(insetTop, content2, safeAreaStyle) });
1640
1643
  }
1641
- const content = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native14.View, { style: styles3.smallContainer, children: [
1644
+ const content = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react_native13.View, { style: styles3.smallContainer, children: [
1642
1645
  topRow,
1643
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native14.View, { style: [styles3.overlayTitleContainer, overlayTitleInsetStyle], children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1646
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native13.View, { style: [styles3.overlayTitleContainer, overlayTitleInsetStyle], children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1644
1647
  Typography,
1645
1648
  {
1646
1649
  ...APP_BAR_TITLE_TEXT_PROPS,
@@ -1655,16 +1658,16 @@ function AppBar({
1655
1658
  }
1656
1659
  ) })
1657
1660
  ] });
1658
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native14.View, { style: rootStyle, children: withTopInset(insetTop, content, safeAreaStyle) });
1661
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_native13.View, { style: rootStyle, children: withTopInset(insetTop, content, safeAreaStyle) });
1659
1662
  }
1660
1663
 
1661
1664
  // src/card/Card.tsx
1662
1665
  var import_react10 = require("react");
1663
- var import_react_native16 = require("react-native");
1666
+ var import_react_native15 = require("react-native");
1664
1667
  var import_core9 = require("@onlynative/core");
1665
1668
 
1666
1669
  // src/card/styles.ts
1667
- var import_react_native15 = require("react-native");
1670
+ var import_react_native14 = require("react-native");
1668
1671
  function getVariantColors2(theme, variant) {
1669
1672
  const disabledContainerColor = alphaColor(theme.colors.onSurface, 0.12);
1670
1673
  const disabledOutlineColor = alphaColor(theme.colors.onSurface, 0.12);
@@ -1748,7 +1751,7 @@ function createStyles4(theme, variant, containerColor) {
1748
1751
  const elevationLevel1 = elevationStyle(theme.elevation.level1);
1749
1752
  const elevationLevel2 = elevationStyle(theme.elevation.level2);
1750
1753
  const baseElevation = variant === "elevated" ? elevationLevel1 : elevationLevel0;
1751
- return import_react_native15.StyleSheet.create({
1754
+ return import_react_native14.StyleSheet.create({
1752
1755
  container: {
1753
1756
  borderRadius: theme.shape.cornerMedium,
1754
1757
  backgroundColor: colors.backgroundColor,
@@ -1798,38 +1801,37 @@ function Card({
1798
1801
  [theme, variant, containerColor]
1799
1802
  );
1800
1803
  if (!isInteractive) {
1801
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native16.View, { ...props, style: [styles3.container, style], children });
1802
- }
1803
- const resolvedStyle = (state) => [
1804
- styles3.container,
1805
- styles3.interactiveContainer,
1806
- state.hovered && !state.pressed && !isDisabled ? styles3.hoveredContainer : void 0,
1807
- state.pressed && !isDisabled ? styles3.pressedContainer : void 0,
1808
- isDisabled ? styles3.disabledContainer : void 0,
1809
- typeof style === "function" ? style(state) : style
1810
- ];
1804
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native15.View, { ...props, style: [styles3.container, style], children });
1805
+ }
1811
1806
  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1812
- import_react_native16.Pressable,
1807
+ import_react_native15.Pressable,
1813
1808
  {
1814
1809
  ...props,
1815
1810
  role: "button",
1816
1811
  accessibilityState: { disabled: isDisabled },
1817
- hitSlop: import_react_native16.Platform.OS === "web" ? void 0 : 4,
1812
+ hitSlop: import_react_native15.Platform.OS === "web" ? void 0 : 4,
1818
1813
  disabled: isDisabled,
1819
1814
  onPress,
1820
- style: resolvedStyle,
1821
- children: isDisabled ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native16.View, { style: styles3.disabledContent, children }) : children
1815
+ style: resolvePressableStyle(
1816
+ [styles3.container, styles3.interactiveContainer],
1817
+ styles3.hoveredContainer,
1818
+ styles3.pressedContainer,
1819
+ styles3.disabledContainer,
1820
+ isDisabled,
1821
+ style
1822
+ ),
1823
+ children: isDisabled ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_native15.View, { style: styles3.disabledContent, children }) : children
1822
1824
  }
1823
1825
  );
1824
1826
  }
1825
1827
 
1826
1828
  // src/chip/Chip.tsx
1827
1829
  var import_react11 = require("react");
1828
- var import_react_native18 = require("react-native");
1830
+ var import_react_native17 = require("react-native");
1829
1831
  var import_core10 = require("@onlynative/core");
1830
1832
 
1831
1833
  // src/chip/styles.ts
1832
- var import_react_native17 = require("react-native");
1834
+ var import_react_native16 = require("react-native");
1833
1835
  function getVariantColors3(theme, variant, elevated, selected) {
1834
1836
  const disabledContainerColor = alphaColor(theme.colors.onSurface, 0.12);
1835
1837
  const disabledLabelColor = alphaColor(theme.colors.onSurface, 0.38);
@@ -1957,7 +1959,7 @@ function createStyles5(theme, variant, elevated, selected, hasLeadingContent, ha
1957
1959
  const elevationLevel2 = elevationStyle(theme.elevation.level2);
1958
1960
  const isElevated = elevated && variant !== "input";
1959
1961
  const baseElevation = isElevated ? elevationLevel1 : elevationLevel0;
1960
- return import_react_native17.StyleSheet.create({
1962
+ return import_react_native16.StyleSheet.create({
1961
1963
  container: {
1962
1964
  alignSelf: "flex-start",
1963
1965
  alignItems: "center",
@@ -2014,24 +2016,6 @@ function createStyles5(theme, variant, elevated, selected, hasLeadingContent, ha
2014
2016
 
2015
2017
  // src/chip/Chip.tsx
2016
2018
  var import_jsx_runtime11 = require("react/jsx-runtime");
2017
- function resolveStyle2(containerStyle, hoveredContainerStyle, pressedContainerStyle, disabledContainerStyle, disabled, style) {
2018
- if (typeof style === "function") {
2019
- return (state) => [
2020
- containerStyle,
2021
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
2022
- state.pressed && !disabled ? pressedContainerStyle : void 0,
2023
- disabled ? disabledContainerStyle : void 0,
2024
- style(state)
2025
- ];
2026
- }
2027
- return (state) => [
2028
- containerStyle,
2029
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
2030
- state.pressed && !disabled ? pressedContainerStyle : void 0,
2031
- disabled ? disabledContainerStyle : void 0,
2032
- style
2033
- ];
2034
- }
2035
2019
  function Chip({
2036
2020
  children,
2037
2021
  style,
@@ -2079,13 +2063,13 @@ function Chip({
2079
2063
  contentColor
2080
2064
  ]
2081
2065
  );
2082
- const resolvedIconColor = (0, import_react11.useMemo)(() => {
2083
- const base = import_react_native18.StyleSheet.flatten([
2066
+ const resolvedIconColor = (0, import_react11.useMemo)(
2067
+ () => resolveColorFromStyle(
2084
2068
  styles3.label,
2085
2069
  isDisabled ? styles3.disabledLabel : void 0
2086
- ]);
2087
- return typeof (base == null ? void 0 : base.color) === "string" ? base.color : void 0;
2088
- }, [styles3.label, styles3.disabledLabel, isDisabled]);
2070
+ ),
2071
+ [styles3.label, styles3.disabledLabel, isDisabled]
2072
+ );
2089
2073
  const computedLabelStyle = (0, import_react11.useMemo)(
2090
2074
  () => [
2091
2075
  styles3.label,
@@ -2096,7 +2080,7 @@ function Chip({
2096
2080
  );
2097
2081
  const renderLeadingContent = () => {
2098
2082
  if (variant === "input" && avatar) {
2099
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_native18.View, { style: styles3.avatar, children: avatar });
2083
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_native17.View, { style: styles3.avatar, children: avatar });
2100
2084
  }
2101
2085
  if (leadingIcon) {
2102
2086
  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
@@ -2123,7 +2107,7 @@ function Chip({
2123
2107
  return null;
2124
2108
  };
2125
2109
  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
2126
- import_react_native18.Pressable,
2110
+ import_react_native17.Pressable,
2127
2111
  {
2128
2112
  ...props,
2129
2113
  accessibilityRole: "button",
@@ -2131,9 +2115,9 @@ function Chip({
2131
2115
  disabled: isDisabled,
2132
2116
  ...variant === "filter" ? { selected: isSelected } : void 0
2133
2117
  },
2134
- hitSlop: import_react_native18.Platform.OS === "web" ? void 0 : 4,
2118
+ hitSlop: import_react_native17.Platform.OS === "web" ? void 0 : 4,
2135
2119
  disabled: isDisabled,
2136
- style: resolveStyle2(
2120
+ style: resolvePressableStyle(
2137
2121
  styles3.container,
2138
2122
  styles3.hoveredContainer,
2139
2123
  styles3.pressedContainer,
@@ -2143,9 +2127,9 @@ function Chip({
2143
2127
  ),
2144
2128
  children: [
2145
2129
  renderLeadingContent(),
2146
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_native18.Text, { style: computedLabelStyle, children }),
2130
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_native17.Text, { style: computedLabelStyle, children }),
2147
2131
  showCloseIcon ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
2148
- import_react_native18.Pressable,
2132
+ import_react_native17.Pressable,
2149
2133
  {
2150
2134
  onPress: onClose,
2151
2135
  accessibilityRole: "button",
@@ -2169,11 +2153,11 @@ function Chip({
2169
2153
 
2170
2154
  // src/checkbox/Checkbox.tsx
2171
2155
  var import_react12 = require("react");
2172
- var import_react_native20 = require("react-native");
2156
+ var import_react_native19 = require("react-native");
2173
2157
  var import_core11 = require("@onlynative/core");
2174
2158
 
2175
2159
  // src/checkbox/styles.ts
2176
- var import_react_native19 = require("react-native");
2160
+ var import_react_native18 = require("react-native");
2177
2161
  function getColors(theme, checked) {
2178
2162
  const disabledOnSurface38 = alphaColor(theme.colors.onSurface, 0.38);
2179
2163
  if (checked) {
@@ -2249,7 +2233,7 @@ function createStyles6(theme, checked, containerColor, contentColor) {
2249
2233
  );
2250
2234
  const size = 18;
2251
2235
  const touchTarget = 48;
2252
- return import_react_native19.StyleSheet.create({
2236
+ return import_react_native18.StyleSheet.create({
2253
2237
  container: {
2254
2238
  width: touchTarget,
2255
2239
  height: touchTarget,
@@ -2294,24 +2278,6 @@ function createStyles6(theme, checked, containerColor, contentColor) {
2294
2278
 
2295
2279
  // src/checkbox/Checkbox.tsx
2296
2280
  var import_jsx_runtime12 = require("react/jsx-runtime");
2297
- function resolveStyle3(containerStyle, hoveredContainerStyle, pressedContainerStyle, disabledContainerStyle, disabled, style) {
2298
- if (typeof style === "function") {
2299
- return (state) => [
2300
- containerStyle,
2301
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
2302
- state.pressed && !disabled ? pressedContainerStyle : void 0,
2303
- disabled ? disabledContainerStyle : void 0,
2304
- style(state)
2305
- ];
2306
- }
2307
- return (state) => [
2308
- containerStyle,
2309
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
2310
- state.pressed && !disabled ? pressedContainerStyle : void 0,
2311
- disabled ? disabledContainerStyle : void 0,
2312
- style
2313
- ];
2314
- }
2315
2281
  function Checkbox({
2316
2282
  style,
2317
2283
  value = false,
@@ -2329,20 +2295,20 @@ function Checkbox({
2329
2295
  () => createStyles6(theme, isChecked, containerColor, contentColor),
2330
2296
  [theme, isChecked, containerColor, contentColor]
2331
2297
  );
2332
- const resolvedIconColor = (0, import_react12.useMemo)(() => {
2333
- const base = import_react_native20.StyleSheet.flatten([
2298
+ const resolvedIconColor = (0, import_react12.useMemo)(
2299
+ () => resolveColorFromStyle(
2334
2300
  styles3.iconColor,
2335
2301
  isDisabled ? styles3.disabledIconColor : void 0
2336
- ]);
2337
- return typeof (base == null ? void 0 : base.color) === "string" ? base.color : void 0;
2338
- }, [styles3.iconColor, styles3.disabledIconColor, isDisabled]);
2302
+ ),
2303
+ [styles3.iconColor, styles3.disabledIconColor, isDisabled]
2304
+ );
2339
2305
  const handlePress = () => {
2340
2306
  if (!isDisabled) {
2341
2307
  onValueChange == null ? void 0 : onValueChange(!isChecked);
2342
2308
  }
2343
2309
  };
2344
2310
  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
2345
- import_react_native20.Pressable,
2311
+ import_react_native19.Pressable,
2346
2312
  {
2347
2313
  ...props,
2348
2314
  accessibilityRole: "checkbox",
@@ -2350,10 +2316,10 @@ function Checkbox({
2350
2316
  disabled: isDisabled,
2351
2317
  checked: isChecked
2352
2318
  },
2353
- hitSlop: import_react_native20.Platform.OS === "web" ? void 0 : 4,
2319
+ hitSlop: import_react_native19.Platform.OS === "web" ? void 0 : 4,
2354
2320
  disabled: isDisabled,
2355
2321
  onPress: handlePress,
2356
- style: resolveStyle3(
2322
+ style: resolvePressableStyle(
2357
2323
  styles3.container,
2358
2324
  styles3.hoveredContainer,
2359
2325
  styles3.pressedContainer,
@@ -2361,7 +2327,7 @@ function Checkbox({
2361
2327
  isDisabled,
2362
2328
  style
2363
2329
  ),
2364
- children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native20.View, { style: [styles3.box, isDisabled ? styles3.disabledBox : void 0], children: isChecked ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
2330
+ children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_native19.View, { style: [styles3.box, isDisabled ? styles3.disabledBox : void 0], children: isChecked ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
2365
2331
  MaterialCommunityIcons,
2366
2332
  {
2367
2333
  name: "check",
@@ -2375,11 +2341,11 @@ function Checkbox({
2375
2341
 
2376
2342
  // src/radio/Radio.tsx
2377
2343
  var import_react13 = require("react");
2378
- var import_react_native22 = require("react-native");
2344
+ var import_react_native21 = require("react-native");
2379
2345
  var import_core12 = require("@onlynative/core");
2380
2346
 
2381
2347
  // src/radio/styles.ts
2382
- var import_react_native21 = require("react-native");
2348
+ var import_react_native20 = require("react-native");
2383
2349
  function getColors2(theme, selected) {
2384
2350
  const disabledOnSurface38 = alphaColor(theme.colors.onSurface, 0.38);
2385
2351
  if (selected) {
@@ -2443,7 +2409,7 @@ function createStyles7(theme, selected, containerColor, contentColor) {
2443
2409
  const outerSize = 20;
2444
2410
  const innerSize = 10;
2445
2411
  const touchTarget = 48;
2446
- return import_react_native21.StyleSheet.create({
2412
+ return import_react_native20.StyleSheet.create({
2447
2413
  container: {
2448
2414
  width: touchTarget,
2449
2415
  height: touchTarget,
@@ -2488,24 +2454,6 @@ function createStyles7(theme, selected, containerColor, contentColor) {
2488
2454
 
2489
2455
  // src/radio/Radio.tsx
2490
2456
  var import_jsx_runtime13 = require("react/jsx-runtime");
2491
- function resolveStyle4(containerStyle, hoveredContainerStyle, pressedContainerStyle, disabledContainerStyle, disabled, style) {
2492
- if (typeof style === "function") {
2493
- return (state) => [
2494
- containerStyle,
2495
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
2496
- state.pressed && !disabled ? pressedContainerStyle : void 0,
2497
- disabled ? disabledContainerStyle : void 0,
2498
- style(state)
2499
- ];
2500
- }
2501
- return (state) => [
2502
- containerStyle,
2503
- state.hovered && !state.pressed && !disabled ? hoveredContainerStyle : void 0,
2504
- state.pressed && !disabled ? pressedContainerStyle : void 0,
2505
- disabled ? disabledContainerStyle : void 0,
2506
- style
2507
- ];
2508
- }
2509
2457
  function Radio({
2510
2458
  style,
2511
2459
  value = false,
@@ -2528,7 +2476,7 @@ function Radio({
2528
2476
  }
2529
2477
  };
2530
2478
  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
2531
- import_react_native22.Pressable,
2479
+ import_react_native21.Pressable,
2532
2480
  {
2533
2481
  ...props,
2534
2482
  accessibilityRole: "radio",
@@ -2536,10 +2484,10 @@ function Radio({
2536
2484
  disabled: isDisabled,
2537
2485
  checked: isSelected
2538
2486
  },
2539
- hitSlop: import_react_native22.Platform.OS === "web" ? void 0 : 4,
2487
+ hitSlop: import_react_native21.Platform.OS === "web" ? void 0 : 4,
2540
2488
  disabled: isDisabled,
2541
2489
  onPress: handlePress,
2542
- style: resolveStyle4(
2490
+ style: resolvePressableStyle(
2543
2491
  styles3.container,
2544
2492
  styles3.hoveredContainer,
2545
2493
  styles3.pressedContainer,
@@ -2548,11 +2496,11 @@ function Radio({
2548
2496
  style
2549
2497
  ),
2550
2498
  children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
2551
- import_react_native22.View,
2499
+ import_react_native21.View,
2552
2500
  {
2553
2501
  style: [styles3.outer, isDisabled ? styles3.disabledOuter : void 0],
2554
2502
  children: isSelected ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
2555
- import_react_native22.View,
2503
+ import_react_native21.View,
2556
2504
  {
2557
2505
  style: [
2558
2506
  styles3.inner,
@@ -2568,11 +2516,11 @@ function Radio({
2568
2516
 
2569
2517
  // src/switch/Switch.tsx
2570
2518
  var import_react14 = require("react");
2571
- var import_react_native24 = require("react-native");
2519
+ var import_react_native23 = require("react-native");
2572
2520
  var import_core13 = require("@onlynative/core");
2573
2521
 
2574
2522
  // src/switch/styles.ts
2575
- var import_react_native23 = require("react-native");
2523
+ var import_react_native22 = require("react-native");
2576
2524
  function getColors3(theme, selected) {
2577
2525
  const disabledOnSurface12 = alphaColor(theme.colors.onSurface, 0.12);
2578
2526
  const disabledOnSurface38 = alphaColor(theme.colors.onSurface, 0.38);
@@ -2660,7 +2608,7 @@ function createStyles8(theme, selected, hasIcon, containerColor, contentColor) {
2660
2608
  const trackHeight = 32;
2661
2609
  const trackPadding = 4;
2662
2610
  const thumbOffset = selected ? trackWidth - trackPadding - thumbSize : trackPadding;
2663
- return import_react_native23.StyleSheet.create({
2611
+ return import_react_native22.StyleSheet.create({
2664
2612
  track: {
2665
2613
  width: trackWidth,
2666
2614
  height: trackHeight,
@@ -2706,24 +2654,6 @@ function createStyles8(theme, selected, hasIcon, containerColor, contentColor) {
2706
2654
 
2707
2655
  // src/switch/Switch.tsx
2708
2656
  var import_jsx_runtime14 = require("react/jsx-runtime");
2709
- function resolveStyle5(trackStyle, hoveredTrackStyle, pressedTrackStyle, disabledTrackStyle, disabled, style) {
2710
- if (typeof style === "function") {
2711
- return (state) => [
2712
- trackStyle,
2713
- state.hovered && !state.pressed && !disabled ? hoveredTrackStyle : void 0,
2714
- state.pressed && !disabled ? pressedTrackStyle : void 0,
2715
- disabled ? disabledTrackStyle : void 0,
2716
- style(state)
2717
- ];
2718
- }
2719
- return (state) => [
2720
- trackStyle,
2721
- state.hovered && !state.pressed && !disabled ? hoveredTrackStyle : void 0,
2722
- state.pressed && !disabled ? pressedTrackStyle : void 0,
2723
- disabled ? disabledTrackStyle : void 0,
2724
- style
2725
- ];
2726
- }
2727
2657
  function Switch({
2728
2658
  style,
2729
2659
  value = false,
@@ -2743,13 +2673,13 @@ function Switch({
2743
2673
  () => createStyles8(theme, isSelected, hasIcon, containerColor, contentColor),
2744
2674
  [theme, isSelected, hasIcon, containerColor, contentColor]
2745
2675
  );
2746
- const resolvedIconColor = (0, import_react14.useMemo)(() => {
2747
- const base = import_react_native24.StyleSheet.flatten([
2676
+ const resolvedIconColor = (0, import_react14.useMemo)(
2677
+ () => resolveColorFromStyle(
2748
2678
  styles3.iconColor,
2749
2679
  isDisabled ? styles3.disabledIconColor : void 0
2750
- ]);
2751
- return typeof (base == null ? void 0 : base.color) === "string" ? base.color : void 0;
2752
- }, [styles3.iconColor, styles3.disabledIconColor, isDisabled]);
2680
+ ),
2681
+ [styles3.iconColor, styles3.disabledIconColor, isDisabled]
2682
+ );
2753
2683
  const handlePress = () => {
2754
2684
  if (!isDisabled) {
2755
2685
  onValueChange == null ? void 0 : onValueChange(!isSelected);
@@ -2759,7 +2689,7 @@ function Switch({
2759
2689
  const MaterialCommunityIcons = iconName ? getMaterialCommunityIcons() : null;
2760
2690
  const iconSize = 16;
2761
2691
  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
2762
- import_react_native24.Pressable,
2692
+ import_react_native23.Pressable,
2763
2693
  {
2764
2694
  ...props,
2765
2695
  accessibilityRole: "switch",
@@ -2767,10 +2697,10 @@ function Switch({
2767
2697
  disabled: isDisabled,
2768
2698
  checked: isSelected
2769
2699
  },
2770
- hitSlop: import_react_native24.Platform.OS === "web" ? void 0 : 4,
2700
+ hitSlop: import_react_native23.Platform.OS === "web" ? void 0 : 4,
2771
2701
  disabled: isDisabled,
2772
2702
  onPress: handlePress,
2773
- style: resolveStyle5(
2703
+ style: resolvePressableStyle(
2774
2704
  styles3.track,
2775
2705
  styles3.hoveredTrack,
2776
2706
  styles3.pressedTrack,
@@ -2779,7 +2709,7 @@ function Switch({
2779
2709
  style
2780
2710
  ),
2781
2711
  children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
2782
- import_react_native24.View,
2712
+ import_react_native23.View,
2783
2713
  {
2784
2714
  style: [styles3.thumb, isDisabled ? styles3.disabledThumb : void 0],
2785
2715
  children: iconName ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
@@ -2798,11 +2728,11 @@ function Switch({
2798
2728
 
2799
2729
  // src/text-field/TextField.tsx
2800
2730
  var import_react15 = require("react");
2801
- var import_react_native26 = require("react-native");
2731
+ var import_react_native25 = require("react-native");
2802
2732
  var import_core14 = require("@onlynative/core");
2803
2733
 
2804
2734
  // src/text-field/styles.ts
2805
- var import_react_native25 = require("react-native");
2735
+ var import_react_native24 = require("react-native");
2806
2736
  var CONTAINER_HEIGHT = 56;
2807
2737
  var ICON_SIZE = 24;
2808
2738
  var LABEL_FLOATED_LINE_HEIGHT = 16;
@@ -2861,7 +2791,7 @@ function createStyles9(theme, variant) {
2861
2791
  const isFilled = variant === "filled";
2862
2792
  return {
2863
2793
  colors,
2864
- styles: import_react_native25.StyleSheet.create({
2794
+ styles: import_react_native24.StyleSheet.create({
2865
2795
  root: {
2866
2796
  alignSelf: "stretch"
2867
2797
  },
@@ -3038,13 +2968,13 @@ function TextField({
3038
2968
  const isControlled = value !== void 0;
3039
2969
  const hasValue = isControlled ? value !== "" : internalHasText;
3040
2970
  const isLabelFloated = isFocused || hasValue;
3041
- const labelAnimRef = (0, import_react15.useRef)(new import_react_native26.Animated.Value(isLabelFloated ? 1 : 0));
2971
+ const labelAnimRef = (0, import_react15.useRef)(new import_react_native25.Animated.Value(isLabelFloated ? 1 : 0));
3042
2972
  const labelAnim = labelAnimRef.current;
3043
2973
  (0, import_react15.useEffect)(() => {
3044
- import_react_native26.Animated.timing(labelAnim, {
2974
+ import_react_native25.Animated.timing(labelAnim, {
3045
2975
  toValue: isLabelFloated ? 1 : 0,
3046
2976
  duration: 150,
3047
- useNativeDriver: import_react_native26.Platform.OS !== "web"
2977
+ useNativeDriver: import_react_native25.Platform.OS !== "web"
3048
2978
  }).start();
3049
2979
  }, [isLabelFloated, labelAnim]);
3050
2980
  const labelScale = (0, import_react15.useMemo)(() => {
@@ -3122,9 +3052,9 @@ function TextField({
3122
3052
  [styles3, isFocused, isError, isDisabled]
3123
3053
  );
3124
3054
  const displaySupportingText = isError ? errorText : supportingText;
3125
- return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react_native26.View, { style: [styles3.root, style], children: [
3126
- /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native26.Pressable, { onPress: handleContainerPress, disabled: isDisabled, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react_native26.View, { style: containerStyle, children: [
3127
- leadingIcon ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native26.View, { style: styles3.leadingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3055
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react_native25.View, { style: [styles3.root, style], children: [
3056
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native25.Pressable, { onPress: handleContainerPress, disabled: isDisabled, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react_native25.View, { style: containerStyle, children: [
3057
+ leadingIcon ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native25.View, { style: styles3.leadingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3128
3058
  MaterialCommunityIcons,
3129
3059
  {
3130
3060
  name: leadingIcon,
@@ -3133,14 +3063,14 @@ function TextField({
3133
3063
  }
3134
3064
  ) }) : null,
3135
3065
  /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3136
- import_react_native26.View,
3066
+ import_react_native25.View,
3137
3067
  {
3138
3068
  style: [
3139
3069
  styles3.inputWrapper,
3140
3070
  label ? styles3.inputWrapperWithLabel : void 0
3141
3071
  ],
3142
3072
  children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3143
- import_react_native26.TextInput,
3073
+ import_react_native25.TextInput,
3144
3074
  {
3145
3075
  ref: inputRef,
3146
3076
  ...textInputProps,
@@ -3166,14 +3096,14 @@ function TextField({
3166
3096
  }
3167
3097
  ),
3168
3098
  trailingIcon ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3169
- import_react_native26.Pressable,
3099
+ import_react_native25.Pressable,
3170
3100
  {
3171
3101
  onPress: onTrailingIconPress,
3172
3102
  disabled: isDisabled || !onTrailingIconPress,
3173
3103
  accessibilityRole: "button",
3174
3104
  hitSlop: 12,
3175
3105
  style: styles3.trailingIconPressable,
3176
- children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native26.View, { style: styles3.trailingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3106
+ children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native25.View, { style: styles3.trailingIcon, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3177
3107
  MaterialCommunityIcons,
3178
3108
  {
3179
3109
  name: trailingIcon,
@@ -3184,7 +3114,7 @@ function TextField({
3184
3114
  }
3185
3115
  ) : null,
3186
3116
  label ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3187
- import_react_native26.Animated.Text,
3117
+ import_react_native25.Animated.Text,
3188
3118
  {
3189
3119
  numberOfLines: 1,
3190
3120
  style: [
@@ -3204,10 +3134,10 @@ function TextField({
3204
3134
  children: label
3205
3135
  }
3206
3136
  ) : null,
3207
- isFilled ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native26.View, { style: indicatorStyle }) : null
3137
+ isFilled ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native25.View, { style: indicatorStyle }) : null
3208
3138
  ] }) }),
3209
- displaySupportingText ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native26.View, { style: styles3.supportingTextRow, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3210
- import_react_native26.Text,
3139
+ displaySupportingText ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react_native25.View, { style: styles3.supportingTextRow, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
3140
+ import_react_native25.Text,
3211
3141
  {
3212
3142
  style: [
3213
3143
  styles3.supportingText,
@@ -3221,11 +3151,11 @@ function TextField({
3221
3151
 
3222
3152
  // src/list/List.tsx
3223
3153
  var import_react16 = require("react");
3224
- var import_react_native28 = require("react-native");
3154
+ var import_react_native27 = require("react-native");
3225
3155
  var import_core15 = require("@onlynative/core");
3226
3156
 
3227
3157
  // src/list/styles.ts
3228
- var import_react_native27 = require("react-native");
3158
+ var import_react_native26 = require("react-native");
3229
3159
  var ITEM_PADDING_VERTICAL = 12;
3230
3160
  var INSET_START = 56;
3231
3161
  var MIN_HEIGHT = {
@@ -3234,7 +3164,7 @@ var MIN_HEIGHT = {
3234
3164
  3: 88
3235
3165
  };
3236
3166
  function createListStyles(theme) {
3237
- return import_react_native27.StyleSheet.create({
3167
+ return import_react_native26.StyleSheet.create({
3238
3168
  container: {
3239
3169
  paddingVertical: theme.spacing.sm
3240
3170
  }
@@ -3271,7 +3201,7 @@ function getItemColors(theme, containerColor) {
3271
3201
  }
3272
3202
  function createListItemStyles(theme, lines, containerColor) {
3273
3203
  const colors = getItemColors(theme, containerColor);
3274
- return import_react_native27.StyleSheet.create({
3204
+ return import_react_native26.StyleSheet.create({
3275
3205
  container: {
3276
3206
  flexDirection: "row",
3277
3207
  alignItems: lines === 3 ? "flex-start" : "center",
@@ -3326,7 +3256,7 @@ function createListItemStyles(theme, lines, containerColor) {
3326
3256
  });
3327
3257
  }
3328
3258
  function createDividerStyles(theme, inset) {
3329
- return import_react_native27.StyleSheet.create({
3259
+ return import_react_native26.StyleSheet.create({
3330
3260
  divider: {
3331
3261
  height: 1,
3332
3262
  backgroundColor: theme.colors.outlineVariant,
@@ -3340,12 +3270,12 @@ var import_jsx_runtime16 = require("react/jsx-runtime");
3340
3270
  function List({ children, style, ...props }) {
3341
3271
  const theme = (0, import_core15.useTheme)();
3342
3272
  const styles3 = (0, import_react16.useMemo)(() => createListStyles(theme), [theme]);
3343
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native28.View, { ...props, style: [styles3.container, style], children });
3273
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native27.View, { ...props, style: [styles3.container, style], children });
3344
3274
  }
3345
3275
 
3346
3276
  // src/list/ListItem.tsx
3347
3277
  var import_react17 = require("react");
3348
- var import_react_native29 = require("react-native");
3278
+ var import_react_native28 = require("react-native");
3349
3279
  var import_core16 = require("@onlynative/core");
3350
3280
  var import_jsx_runtime17 = require("react/jsx-runtime");
3351
3281
  function getLines(supportingText, overlineText, supportingTextNumberOfLines) {
@@ -3372,18 +3302,22 @@ function ListItem({
3372
3302
  const isDisabled = Boolean(disabled);
3373
3303
  const isInteractive = onPress !== void 0;
3374
3304
  const theme = (0, import_core16.useTheme)();
3375
- const lines = getLines(supportingText, overlineText, supportingTextNumberOfLines);
3305
+ const lines = getLines(
3306
+ supportingText,
3307
+ overlineText,
3308
+ supportingTextNumberOfLines
3309
+ );
3376
3310
  const styles3 = (0, import_react17.useMemo)(
3377
3311
  () => createListItemStyles(theme, lines, containerColor),
3378
3312
  [theme, lines, containerColor]
3379
3313
  );
3380
3314
  const content = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
3381
- leadingContent != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native29.View, { style: styles3.leadingContent, children: leadingContent }),
3382
- /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_react_native29.View, { style: styles3.textBlock, children: [
3383
- overlineText != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native29.Text, { style: styles3.overlineText, numberOfLines: 1, children: overlineText }),
3384
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native29.Text, { style: styles3.headlineText, numberOfLines: 1, children: headlineText }),
3315
+ leadingContent != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native28.View, { style: styles3.leadingContent, children: leadingContent }),
3316
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_react_native28.View, { style: styles3.textBlock, children: [
3317
+ overlineText != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native28.Text, { style: styles3.overlineText, numberOfLines: 1, children: overlineText }),
3318
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native28.Text, { style: styles3.headlineText, numberOfLines: 1, children: headlineText }),
3385
3319
  supportingText != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3386
- import_react_native29.Text,
3320
+ import_react_native28.Text,
3387
3321
  {
3388
3322
  style: styles3.supportingText,
3389
3323
  numberOfLines: supportingTextNumberOfLines,
@@ -3391,40 +3325,39 @@ function ListItem({
3391
3325
  }
3392
3326
  )
3393
3327
  ] }),
3394
- (trailingContent != null || trailingSupportingText != null) && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_react_native29.View, { style: styles3.trailingBlock, children: [
3395
- trailingSupportingText != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native29.Text, { style: styles3.trailingSupportingText, numberOfLines: 1, children: trailingSupportingText }),
3328
+ (trailingContent != null || trailingSupportingText != null) && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_react_native28.View, { style: styles3.trailingBlock, children: [
3329
+ trailingSupportingText != null && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native28.Text, { style: styles3.trailingSupportingText, numberOfLines: 1, children: trailingSupportingText }),
3396
3330
  trailingContent
3397
3331
  ] })
3398
3332
  ] });
3399
3333
  if (!isInteractive) {
3400
- return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native29.View, { ...props, style: [styles3.container, style], children: content });
3401
- }
3402
- const resolvedStyle = (state) => [
3403
- styles3.container,
3404
- styles3.interactiveContainer,
3405
- state.hovered && !state.pressed && !isDisabled ? styles3.hoveredContainer : void 0,
3406
- state.pressed && !isDisabled ? styles3.pressedContainer : void 0,
3407
- isDisabled ? styles3.disabledContainer : void 0,
3408
- typeof style === "function" ? style(state) : style
3409
- ];
3334
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native28.View, { ...props, style: [styles3.container, style], children: content });
3335
+ }
3410
3336
  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
3411
- import_react_native29.Pressable,
3337
+ import_react_native28.Pressable,
3412
3338
  {
3413
3339
  ...props,
3414
3340
  role: "button",
3415
3341
  accessibilityState: { disabled: isDisabled },
3416
- hitSlop: import_react_native29.Platform.OS === "web" ? void 0 : 4,
3342
+ hitSlop: import_react_native28.Platform.OS === "web" ? void 0 : 4,
3417
3343
  disabled: isDisabled,
3418
3344
  onPress,
3419
- style: resolvedStyle,
3420
- children: isDisabled ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native29.View, { style: styles3.disabledContentWrapper, children: content }) : content
3345
+ style: resolvePressableStyle(
3346
+ [styles3.container, styles3.interactiveContainer],
3347
+ styles3.hoveredContainer,
3348
+ styles3.pressedContainer,
3349
+ styles3.disabledContainer,
3350
+ isDisabled,
3351
+ style
3352
+ ),
3353
+ children: isDisabled ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native28.View, { style: styles3.disabledContentWrapper, children: content }) : content
3421
3354
  }
3422
3355
  );
3423
3356
  }
3424
3357
 
3425
3358
  // src/list/ListDivider.tsx
3426
3359
  var import_react18 = require("react");
3427
- var import_react_native30 = require("react-native");
3360
+ var import_react_native29 = require("react-native");
3428
3361
  var import_core17 = require("@onlynative/core");
3429
3362
  var import_jsx_runtime18 = require("react/jsx-runtime");
3430
3363
  function ListDivider({
@@ -3437,16 +3370,16 @@ function ListDivider({
3437
3370
  () => createDividerStyles(theme, inset),
3438
3371
  [theme, inset]
3439
3372
  );
3440
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_native30.View, { ...props, style: [styles3.divider, style] });
3373
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_native29.View, { ...props, style: [styles3.divider, style] });
3441
3374
  }
3442
3375
 
3443
3376
  // src/keyboard-avoiding-wrapper/KeyboardAvoidingWrapper.tsx
3444
3377
  var import_react19 = require("react");
3445
- var import_react_native32 = require("react-native");
3378
+ var import_react_native31 = require("react-native");
3446
3379
 
3447
3380
  // src/keyboard-avoiding-wrapper/styles.ts
3448
- var import_react_native31 = require("react-native");
3449
- var styles2 = import_react_native31.StyleSheet.create({
3381
+ var import_react_native30 = require("react-native");
3382
+ var styles2 = import_react_native30.StyleSheet.create({
3450
3383
  root: {
3451
3384
  flex: 1
3452
3385
  },
@@ -3457,7 +3390,7 @@ var styles2 = import_react_native31.StyleSheet.create({
3457
3390
 
3458
3391
  // src/keyboard-avoiding-wrapper/KeyboardAvoidingWrapper.tsx
3459
3392
  var import_jsx_runtime19 = require("react/jsx-runtime");
3460
- var isIOS = import_react_native32.Platform.OS === "ios";
3393
+ var isIOS = import_react_native31.Platform.OS === "ios";
3461
3394
  function KeyboardAvoidingWrapper({
3462
3395
  children,
3463
3396
  behavior = "padding",
@@ -3474,13 +3407,13 @@ function KeyboardAvoidingWrapper({
3474
3407
  if (onKeyboardShow) {
3475
3408
  const showEvent = isIOS ? "keyboardWillShow" : "keyboardDidShow";
3476
3409
  subscriptions.push(
3477
- import_react_native32.Keyboard.addListener(showEvent, onKeyboardShow)
3410
+ import_react_native31.Keyboard.addListener(showEvent, onKeyboardShow)
3478
3411
  );
3479
3412
  }
3480
3413
  if (onKeyboardHide) {
3481
3414
  const hideEvent = isIOS ? "keyboardWillHide" : "keyboardDidHide";
3482
3415
  subscriptions.push(
3483
- import_react_native32.Keyboard.addListener(hideEvent, onKeyboardHide)
3416
+ import_react_native31.Keyboard.addListener(hideEvent, onKeyboardHide)
3484
3417
  );
3485
3418
  }
3486
3419
  return () => {
@@ -3488,14 +3421,14 @@ function KeyboardAvoidingWrapper({
3488
3421
  };
3489
3422
  }, [onKeyboardShow, onKeyboardHide]);
3490
3423
  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
3491
- import_react_native32.KeyboardAvoidingView,
3424
+ import_react_native31.KeyboardAvoidingView,
3492
3425
  {
3493
3426
  style: [styles2.root, style],
3494
3427
  behavior,
3495
3428
  keyboardVerticalOffset,
3496
3429
  enabled: !isIOS && enabled,
3497
3430
  children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
3498
- import_react_native32.ScrollView,
3431
+ import_react_native31.ScrollView,
3499
3432
  {
3500
3433
  automaticallyAdjustKeyboardInsets: isIOS && enabled,
3501
3434
  keyboardShouldPersistTaps: "handled",
@@ -3511,13 +3444,13 @@ function KeyboardAvoidingWrapper({
3511
3444
 
3512
3445
  // src/avatar/Avatar.tsx
3513
3446
  var import_react20 = require("react");
3514
- var import_react_native34 = require("react-native");
3447
+ var import_react_native33 = require("react-native");
3515
3448
  var import_core18 = require("@onlynative/core");
3516
3449
 
3517
3450
  // src/avatar/styles.ts
3518
- var import_react_native33 = require("react-native");
3451
+ var import_react_native32 = require("react-native");
3519
3452
  function createStyles10(theme) {
3520
- return import_react_native33.StyleSheet.create({
3453
+ return import_react_native32.StyleSheet.create({
3521
3454
  container: {
3522
3455
  borderRadius: theme.shape.cornerFull,
3523
3456
  alignItems: "center",
@@ -3612,7 +3545,7 @@ function Avatar({
3612
3545
  }),
3613
3546
  [bgColor, fgColor, theme.stateLayer]
3614
3547
  );
3615
- const content = imageUri ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native34.Image, { source: { uri: imageUri }, style: styles3.image, accessible: false }) : label && !icon ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native34.Text, { style: initialsStyle, numberOfLines: 1, allowFontScaling: false, children: initials }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3548
+ const content = imageUri ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native33.Image, { source: { uri: imageUri }, style: styles3.image, accessible: false }) : label && !icon ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_native33.Text, { style: initialsStyle, numberOfLines: 1, allowFontScaling: false, children: initials }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3616
3549
  MaterialCommunityIcons,
3617
3550
  {
3618
3551
  name: icon != null ? icon : "account",
@@ -3622,7 +3555,7 @@ function Avatar({
3622
3555
  );
3623
3556
  if (!isInteractive) {
3624
3557
  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3625
- import_react_native34.View,
3558
+ import_react_native33.View,
3626
3559
  {
3627
3560
  ...props,
3628
3561
  accessibilityLabel,
@@ -3632,7 +3565,7 @@ function Avatar({
3632
3565
  );
3633
3566
  }
3634
3567
  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3635
- import_react_native34.Pressable,
3568
+ import_react_native33.Pressable,
3636
3569
  {
3637
3570
  ...props,
3638
3571
  accessibilityRole: "button",