@ecohouse/ui 0.1.21 → 0.1.23
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.cjs +314 -198
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +29 -14
- package/dist/index.d.ts +29 -14
- package/dist/index.js +316 -201
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/SegmentedToggle/SegmentedToggle.tsx +7 -19
- package/src/index.ts +3 -0
- package/src/primitives/Amenity/Amenity.stories.tsx +64 -0
- package/src/primitives/Amenity/Amenity.tsx +178 -0
- package/src/primitives/Amenity/index.ts +2 -0
- package/src/primitives/index.ts +3 -0
- package/src/theme/colors.test.ts +1 -1
- package/src/theme/typography.ts +2 -2
package/dist/index.cjs
CHANGED
|
@@ -105,7 +105,7 @@ var segmentedToggleTypography = {
|
|
|
105
105
|
fontFamily: fonts.sans,
|
|
106
106
|
fontSize: 12,
|
|
107
107
|
fontWeight: "500",
|
|
108
|
-
lineHeight:
|
|
108
|
+
lineHeight: 14,
|
|
109
109
|
letterSpacing: 0
|
|
110
110
|
};
|
|
111
111
|
var languageSwitcherTypography = {
|
|
@@ -1459,6 +1459,138 @@ function useApplyWebClassName(ref, className, enabled = true) {
|
|
|
1459
1459
|
};
|
|
1460
1460
|
}, [ref, className, enabled]);
|
|
1461
1461
|
}
|
|
1462
|
+
var Amenity = react.forwardRef(function Amenity2({
|
|
1463
|
+
icon,
|
|
1464
|
+
label,
|
|
1465
|
+
variant = "display",
|
|
1466
|
+
selected,
|
|
1467
|
+
defaultSelected = false,
|
|
1468
|
+
onSelectedChange,
|
|
1469
|
+
disabled = false,
|
|
1470
|
+
style,
|
|
1471
|
+
labelStyle,
|
|
1472
|
+
className,
|
|
1473
|
+
accessibilityLabel,
|
|
1474
|
+
...rest
|
|
1475
|
+
}, forwardedRef) {
|
|
1476
|
+
const rootRef = react.useRef(null);
|
|
1477
|
+
const setRootRef = react.useMemo(() => mergeRefs(rootRef, forwardedRef), [forwardedRef]);
|
|
1478
|
+
const isControlled = typeof selected === "boolean";
|
|
1479
|
+
const [uncontrolledSelected, setUncontrolledSelected] = react.useState(defaultSelected);
|
|
1480
|
+
const isSelected = isControlled ? selected : uncontrolledSelected;
|
|
1481
|
+
const isSelectable = variant === "selectable";
|
|
1482
|
+
const iconColor = isSelectable && isSelected ? colors.primary : colors.white;
|
|
1483
|
+
useApplyWebClassName(rootRef, className?.trim() || void 0);
|
|
1484
|
+
const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1485
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles.iconSlot, children: /* @__PURE__ */ jsxRuntime.jsx(AmenityIcon, { color: iconColor, name: icon }) }),
|
|
1486
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1487
|
+
reactNative.Text,
|
|
1488
|
+
{
|
|
1489
|
+
style: [
|
|
1490
|
+
styles.label,
|
|
1491
|
+
isSelectable ? styles.selectableLabel : styles.displayLabel,
|
|
1492
|
+
reactNative.Platform.OS === "android" ? styles.labelAndroid : null,
|
|
1493
|
+
labelStyle
|
|
1494
|
+
],
|
|
1495
|
+
children: label
|
|
1496
|
+
}
|
|
1497
|
+
)
|
|
1498
|
+
] });
|
|
1499
|
+
if (!isSelectable) {
|
|
1500
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1501
|
+
reactNative.View,
|
|
1502
|
+
{
|
|
1503
|
+
...rest,
|
|
1504
|
+
ref: setRootRef,
|
|
1505
|
+
accessibilityLabel: accessibilityLabel ?? label,
|
|
1506
|
+
accessibilityRole: "text",
|
|
1507
|
+
style: [styles.base, styles.display, style],
|
|
1508
|
+
children: content
|
|
1509
|
+
}
|
|
1510
|
+
);
|
|
1511
|
+
}
|
|
1512
|
+
const handlePress = () => {
|
|
1513
|
+
if (disabled) return;
|
|
1514
|
+
const nextSelected = !isSelected;
|
|
1515
|
+
if (!isControlled) setUncontrolledSelected(nextSelected);
|
|
1516
|
+
onSelectedChange?.(nextSelected);
|
|
1517
|
+
};
|
|
1518
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1519
|
+
reactNative.Pressable,
|
|
1520
|
+
{
|
|
1521
|
+
...rest,
|
|
1522
|
+
ref: setRootRef,
|
|
1523
|
+
accessibilityLabel: accessibilityLabel ?? label,
|
|
1524
|
+
accessibilityRole: "checkbox",
|
|
1525
|
+
accessibilityState: { checked: isSelected, disabled },
|
|
1526
|
+
disabled,
|
|
1527
|
+
onPress: handlePress,
|
|
1528
|
+
style: [
|
|
1529
|
+
styles.base,
|
|
1530
|
+
styles.selectable,
|
|
1531
|
+
isSelected && styles.selected,
|
|
1532
|
+
disabled && styles.disabled,
|
|
1533
|
+
style
|
|
1534
|
+
],
|
|
1535
|
+
children: content
|
|
1536
|
+
}
|
|
1537
|
+
);
|
|
1538
|
+
});
|
|
1539
|
+
var styles = reactNative.StyleSheet.create({
|
|
1540
|
+
base: {
|
|
1541
|
+
height: 44,
|
|
1542
|
+
paddingVertical: 12,
|
|
1543
|
+
paddingHorizontal: 16,
|
|
1544
|
+
flexDirection: "row",
|
|
1545
|
+
alignItems: "center",
|
|
1546
|
+
alignSelf: "flex-start",
|
|
1547
|
+
backgroundColor: colors.grey700
|
|
1548
|
+
},
|
|
1549
|
+
display: {
|
|
1550
|
+
gap: 8,
|
|
1551
|
+
borderRadius: 39,
|
|
1552
|
+
backgroundColor: colors.grey750
|
|
1553
|
+
},
|
|
1554
|
+
selectable: {
|
|
1555
|
+
gap: 12,
|
|
1556
|
+
borderWidth: 1,
|
|
1557
|
+
borderColor: "transparent",
|
|
1558
|
+
borderStyle: "solid",
|
|
1559
|
+
borderRadius: 79
|
|
1560
|
+
},
|
|
1561
|
+
selected: {
|
|
1562
|
+
borderColor: colors.primary
|
|
1563
|
+
},
|
|
1564
|
+
disabled: {
|
|
1565
|
+
opacity: 0.6
|
|
1566
|
+
},
|
|
1567
|
+
iconSlot: {
|
|
1568
|
+
width: 20,
|
|
1569
|
+
height: 20,
|
|
1570
|
+
alignItems: "center",
|
|
1571
|
+
justifyContent: "center",
|
|
1572
|
+
flexShrink: 0
|
|
1573
|
+
},
|
|
1574
|
+
label: {
|
|
1575
|
+
fontFamily: fonts.sans,
|
|
1576
|
+
color: colors.white
|
|
1577
|
+
},
|
|
1578
|
+
displayLabel: {
|
|
1579
|
+
fontSize: 14,
|
|
1580
|
+
fontWeight: "500",
|
|
1581
|
+
lineHeight: 14,
|
|
1582
|
+
letterSpacing: 0
|
|
1583
|
+
},
|
|
1584
|
+
selectableLabel: {
|
|
1585
|
+
fontSize: 12,
|
|
1586
|
+
fontWeight: "700",
|
|
1587
|
+
lineHeight: 13.44,
|
|
1588
|
+
letterSpacing: 0
|
|
1589
|
+
},
|
|
1590
|
+
labelAndroid: {
|
|
1591
|
+
includeFontPadding: false
|
|
1592
|
+
}
|
|
1593
|
+
});
|
|
1462
1594
|
var ITEM_RADIUS = 12;
|
|
1463
1595
|
var ICON_SIZE = 16;
|
|
1464
1596
|
var MenuItem = react.forwardRef(function MenuItem2({
|
|
@@ -1513,19 +1645,19 @@ var MenuItem = react.forwardRef(function MenuItem2({
|
|
|
1513
1645
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
1514
1646
|
accessibilityState: { disabled },
|
|
1515
1647
|
style: [
|
|
1516
|
-
|
|
1648
|
+
styles2.root,
|
|
1517
1649
|
{ backgroundColor: resolvedBackground },
|
|
1518
|
-
disabled &&
|
|
1650
|
+
disabled && styles2.disabled,
|
|
1519
1651
|
style
|
|
1520
1652
|
],
|
|
1521
1653
|
children: [
|
|
1522
|
-
icon ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
1523
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
1654
|
+
icon ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles2.iconSlot, children: icon }) : null,
|
|
1655
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles2.label, labelStyle], numberOfLines: 1, children: label })
|
|
1524
1656
|
]
|
|
1525
1657
|
}
|
|
1526
1658
|
);
|
|
1527
1659
|
});
|
|
1528
|
-
var
|
|
1660
|
+
var styles2 = reactNative.StyleSheet.create({
|
|
1529
1661
|
root: {
|
|
1530
1662
|
minHeight: 40,
|
|
1531
1663
|
borderRadius: ITEM_RADIUS,
|
|
@@ -1593,10 +1725,10 @@ var FavoritesButton = react.forwardRef(
|
|
|
1593
1725
|
hitSlop,
|
|
1594
1726
|
onPress: handlePress,
|
|
1595
1727
|
style: ({ pressed }) => [
|
|
1596
|
-
|
|
1728
|
+
styles3.button,
|
|
1597
1729
|
webBlurStyle,
|
|
1598
|
-
pressed &&
|
|
1599
|
-
disabled &&
|
|
1730
|
+
pressed && styles3.pressed,
|
|
1731
|
+
disabled && styles3.disabled,
|
|
1600
1732
|
style
|
|
1601
1733
|
],
|
|
1602
1734
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1612,7 +1744,7 @@ var FavoritesButton = react.forwardRef(
|
|
|
1612
1744
|
);
|
|
1613
1745
|
}
|
|
1614
1746
|
);
|
|
1615
|
-
var
|
|
1747
|
+
var styles3 = reactNative.StyleSheet.create({
|
|
1616
1748
|
button: {
|
|
1617
1749
|
padding: 12,
|
|
1618
1750
|
gap: 10,
|
|
@@ -1790,7 +1922,7 @@ var Avatar = react.forwardRef(function Avatar2({
|
|
|
1790
1922
|
}, [isOpen, closeAndFocusTrigger]);
|
|
1791
1923
|
const hasImage = Boolean(imageUrl) && !imageFailed;
|
|
1792
1924
|
const resolvedAccessibilityLabel = accessibilityLabel ?? [name, email].filter(Boolean).join(", ");
|
|
1793
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ref: wrapperRef, style: [
|
|
1925
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ref: wrapperRef, style: [styles4.wrapper, isOpen && styles4.wrapperOpen], children: [
|
|
1794
1926
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1795
1927
|
reactNative.Pressable,
|
|
1796
1928
|
{
|
|
@@ -1802,25 +1934,25 @@ var Avatar = react.forwardRef(function Avatar2({
|
|
|
1802
1934
|
accessibilityRole: isInteractive ? "button" : void 0,
|
|
1803
1935
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
1804
1936
|
accessibilityState: isInteractive ? { disabled, expanded: hasMenu ? isOpen : void 0 } : void 0,
|
|
1805
|
-
style: [
|
|
1937
|
+
style: [styles4.root, disabled && styles4.disabled, style],
|
|
1806
1938
|
children: [
|
|
1807
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
1939
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles4.imageWrap, children: hasImage ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1808
1940
|
reactNative.Image,
|
|
1809
1941
|
{
|
|
1810
1942
|
source: { uri: imageUrl ?? void 0 },
|
|
1811
|
-
style:
|
|
1943
|
+
style: styles4.image,
|
|
1812
1944
|
onError: () => setImageFailed(true)
|
|
1813
1945
|
}
|
|
1814
|
-
) : /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
1815
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
1816
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
1817
|
-
email ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
1946
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles4.imageFallback, children: /* @__PURE__ */ jsxRuntime.jsx(UserIcon, { size: FALLBACK_ICON_SIZE, color: colors.primary }) }) }),
|
|
1947
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles4.textColumn, children: [
|
|
1948
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles4.name, numberOfLines: 1, children: name }),
|
|
1949
|
+
email ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles4.email, numberOfLines: 1, children: email }) : null
|
|
1818
1950
|
] }),
|
|
1819
|
-
showChevron ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [
|
|
1951
|
+
showChevron ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles4.chevronSlot, isOpen && styles4.chevronOpen], children: /* @__PURE__ */ jsxRuntime.jsx(ChevronDownIcon, { size: CHEVRON_SIZE, color: isOpen ? colors.primary : colors.grey100 }) }) : null
|
|
1820
1952
|
]
|
|
1821
1953
|
}
|
|
1822
1954
|
),
|
|
1823
|
-
hasMenu && isOpen ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [
|
|
1955
|
+
hasMenu && isOpen ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles4.menu, menuWidth != null && { right: void 0, width: menuWidth }], children: resolvedMenuItems.map((item) => {
|
|
1824
1956
|
const itemKey = item.key ?? item.label;
|
|
1825
1957
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1826
1958
|
MenuItem,
|
|
@@ -1837,7 +1969,7 @@ var Avatar = react.forwardRef(function Avatar2({
|
|
|
1837
1969
|
}) }) : null
|
|
1838
1970
|
] });
|
|
1839
1971
|
});
|
|
1840
|
-
var
|
|
1972
|
+
var styles4 = reactNative.StyleSheet.create({
|
|
1841
1973
|
wrapper: {
|
|
1842
1974
|
position: "relative",
|
|
1843
1975
|
alignSelf: "flex-start"
|
|
@@ -1953,22 +2085,22 @@ var Badge = react.forwardRef(function Badge2({ label, variant = "default", icon:
|
|
|
1953
2085
|
...rest,
|
|
1954
2086
|
ref: setContainerRef,
|
|
1955
2087
|
style: [
|
|
1956
|
-
|
|
2088
|
+
styles5.base,
|
|
1957
2089
|
{ backgroundColor: preset.backgroundColor },
|
|
1958
|
-
preset.border ?
|
|
2090
|
+
preset.border ? styles5.transparentBorder : null,
|
|
1959
2091
|
preset.blur ? webBlurStyle2 : null,
|
|
1960
2092
|
style
|
|
1961
2093
|
],
|
|
1962
2094
|
accessibilityRole: "text",
|
|
1963
2095
|
accessibilityLabel: accessibilityLabel ?? label,
|
|
1964
2096
|
children: [
|
|
1965
|
-
Icon2 ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
1966
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
2097
|
+
Icon2 ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles5.iconSlot, children: /* @__PURE__ */ jsxRuntime.jsx(Icon2, { size: ICON_SIZE3, color: preset.iconColor }) }) : null,
|
|
2098
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles5.label, reactNative.Platform.OS === "android" ? styles5.labelAndroid : null], children: label })
|
|
1967
2099
|
]
|
|
1968
2100
|
}
|
|
1969
2101
|
);
|
|
1970
2102
|
});
|
|
1971
|
-
var
|
|
2103
|
+
var styles5 = reactNative.StyleSheet.create({
|
|
1972
2104
|
base: {
|
|
1973
2105
|
flexDirection: "row",
|
|
1974
2106
|
alignItems: "center",
|
|
@@ -2041,7 +2173,7 @@ var Counter = react.forwardRef(function Counter2({
|
|
|
2041
2173
|
if (!isControlled) setUncontrolledValue(next);
|
|
2042
2174
|
onValueChange?.(next);
|
|
2043
2175
|
};
|
|
2044
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ...rest, ref: setContainerRef, style: [
|
|
2176
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ...rest, ref: setContainerRef, style: [styles6.base, style], children: [
|
|
2045
2177
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2046
2178
|
reactNative.Pressable,
|
|
2047
2179
|
{
|
|
@@ -2051,11 +2183,11 @@ var Counter = react.forwardRef(function Counter2({
|
|
|
2051
2183
|
accessibilityRole: "button",
|
|
2052
2184
|
accessibilityLabel: "Decrease value",
|
|
2053
2185
|
accessibilityState: { disabled: decrementDisabled },
|
|
2054
|
-
style: [
|
|
2186
|
+
style: [styles6.button, webBlurStyle3, decrementDisabled && styles6.buttonDisabled],
|
|
2055
2187
|
children: /* @__PURE__ */ jsxRuntime.jsx(MinusIcon, {})
|
|
2056
2188
|
}
|
|
2057
2189
|
),
|
|
2058
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
2190
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles6.value, children: resolvedValue }),
|
|
2059
2191
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2060
2192
|
reactNative.Pressable,
|
|
2061
2193
|
{
|
|
@@ -2065,13 +2197,13 @@ var Counter = react.forwardRef(function Counter2({
|
|
|
2065
2197
|
accessibilityRole: "button",
|
|
2066
2198
|
accessibilityLabel: "Increase value",
|
|
2067
2199
|
accessibilityState: { disabled: incrementDisabled },
|
|
2068
|
-
style: [
|
|
2200
|
+
style: [styles6.button, webBlurStyle3, incrementDisabled && styles6.buttonDisabled],
|
|
2069
2201
|
children: /* @__PURE__ */ jsxRuntime.jsx(PlusIcon, {})
|
|
2070
2202
|
}
|
|
2071
2203
|
)
|
|
2072
2204
|
] });
|
|
2073
2205
|
});
|
|
2074
|
-
var
|
|
2206
|
+
var styles6 = reactNative.StyleSheet.create({
|
|
2075
2207
|
base: {
|
|
2076
2208
|
flexDirection: "row",
|
|
2077
2209
|
alignItems: "center",
|
|
@@ -2098,6 +2230,7 @@ var styles5 = reactNative.StyleSheet.create({
|
|
|
2098
2230
|
var ICON_SIZE4 = 20;
|
|
2099
2231
|
var ANIMATION_DURATION = 200;
|
|
2100
2232
|
var OPTION_HORIZONTAL_PADDING = 16;
|
|
2233
|
+
var OPTION_MIN_WIDTH = 97;
|
|
2101
2234
|
var SegmentedToggle = react.forwardRef(
|
|
2102
2235
|
function SegmentedToggle2({
|
|
2103
2236
|
options,
|
|
@@ -2123,12 +2256,9 @@ var SegmentedToggle = react.forwardRef(
|
|
|
2123
2256
|
const resolvedClassName = className?.trim() || void 0;
|
|
2124
2257
|
const setContainerRef = react.useMemo(() => mergeRefs(containerRef, forwardedRef), [forwardedRef]);
|
|
2125
2258
|
const progress = react.useRef(new reactNative.Animated.Value(selectedIndex)).current;
|
|
2126
|
-
const [contentWidths, setContentWidths] = react.useState([0, 0]);
|
|
2127
2259
|
const [containerWidth, setContainerWidth] = react.useState(0);
|
|
2128
2260
|
const availableOptionWidth = Math.max(0, (containerWidth - 12) / 2);
|
|
2129
|
-
const
|
|
2130
|
-
const contentBasedOptionWidth = widestContentWidth > 0 ? widestContentWidth + OPTION_HORIZONTAL_PADDING * 2 : 0;
|
|
2131
|
-
const optionWidth = fullWidth ? availableOptionWidth : contentBasedOptionWidth;
|
|
2261
|
+
const optionWidth = fullWidth ? availableOptionWidth : OPTION_MIN_WIDTH;
|
|
2132
2262
|
const indicatorTranslateX = progress.interpolate({
|
|
2133
2263
|
inputRange: [0, 1],
|
|
2134
2264
|
outputRange: [0, optionWidth + 4]
|
|
@@ -2162,9 +2292,9 @@ var SegmentedToggle = react.forwardRef(
|
|
|
2162
2292
|
onLayout?.(event);
|
|
2163
2293
|
},
|
|
2164
2294
|
style: [
|
|
2165
|
-
|
|
2166
|
-
fullWidth ?
|
|
2167
|
-
disabled &&
|
|
2295
|
+
styles7.base,
|
|
2296
|
+
fullWidth ? styles7.fullWidth : styles7.contentWidth,
|
|
2297
|
+
disabled && styles7.disabled,
|
|
2168
2298
|
style
|
|
2169
2299
|
],
|
|
2170
2300
|
accessibilityRole: "radiogroup",
|
|
@@ -2174,12 +2304,12 @@ var SegmentedToggle = react.forwardRef(
|
|
|
2174
2304
|
{
|
|
2175
2305
|
pointerEvents: "none",
|
|
2176
2306
|
style: [
|
|
2177
|
-
|
|
2307
|
+
styles7.activeIndicator,
|
|
2178
2308
|
{ width: optionWidth, transform: [{ translateX: indicatorTranslateX }] }
|
|
2179
2309
|
]
|
|
2180
2310
|
}
|
|
2181
2311
|
) : null,
|
|
2182
|
-
options.map(({ value: optionValue, label, icon: Icon2 }
|
|
2312
|
+
options.map(({ value: optionValue, label, icon: Icon2 }) => {
|
|
2183
2313
|
const selected = optionValue === selectedValue;
|
|
2184
2314
|
const iconColor = selected ? colors.primary : colors.whiteAlpha20;
|
|
2185
2315
|
const labelColor = selected ? colors.whiteAlpha86 : colors.whiteAlpha40;
|
|
@@ -2193,28 +2323,13 @@ var SegmentedToggle = react.forwardRef(
|
|
|
2193
2323
|
accessibilityLabel: label,
|
|
2194
2324
|
accessibilityState: { selected, disabled },
|
|
2195
2325
|
style: [
|
|
2196
|
-
|
|
2197
|
-
fullWidth ?
|
|
2326
|
+
styles7.option,
|
|
2327
|
+
fullWidth ? styles7.optionFullWidth : { width: OPTION_MIN_WIDTH, minWidth: OPTION_MIN_WIDTH }
|
|
2198
2328
|
],
|
|
2199
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2200
|
-
|
|
2201
|
-
{
|
|
2202
|
-
|
|
2203
|
-
const nextWidth = event.nativeEvent.layout.width;
|
|
2204
|
-
setContentWidths((currentWidths) => {
|
|
2205
|
-
if (currentWidths[index] === nextWidth) return currentWidths;
|
|
2206
|
-
const nextWidths = [currentWidths[0], currentWidths[1]];
|
|
2207
|
-
nextWidths[index] = nextWidth;
|
|
2208
|
-
return nextWidths;
|
|
2209
|
-
});
|
|
2210
|
-
},
|
|
2211
|
-
style: styles6.optionContent,
|
|
2212
|
-
children: [
|
|
2213
|
-
Icon2 ? /* @__PURE__ */ jsxRuntime.jsx(Icon2, { size: ICON_SIZE4, color: iconColor }) : null,
|
|
2214
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: [styles6.label, { color: labelColor }], children: label })
|
|
2215
|
-
]
|
|
2216
|
-
}
|
|
2217
|
-
)
|
|
2329
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles7.optionContent, children: [
|
|
2330
|
+
Icon2 ? /* @__PURE__ */ jsxRuntime.jsx(Icon2, { size: ICON_SIZE4, color: iconColor }) : null,
|
|
2331
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: [styles7.label, { color: labelColor }], children: label })
|
|
2332
|
+
] })
|
|
2218
2333
|
},
|
|
2219
2334
|
optionValue
|
|
2220
2335
|
);
|
|
@@ -2224,7 +2339,7 @@ var SegmentedToggle = react.forwardRef(
|
|
|
2224
2339
|
);
|
|
2225
2340
|
}
|
|
2226
2341
|
);
|
|
2227
|
-
var
|
|
2342
|
+
var styles7 = reactNative.StyleSheet.create({
|
|
2228
2343
|
base: {
|
|
2229
2344
|
height: 44,
|
|
2230
2345
|
flexDirection: "row",
|
|
@@ -2362,7 +2477,7 @@ var LanguageSwitcher = react.forwardRef(
|
|
|
2362
2477
|
{
|
|
2363
2478
|
...rest,
|
|
2364
2479
|
ref: setWrapperRef,
|
|
2365
|
-
style: [
|
|
2480
|
+
style: [styles8.wrapper, isOpen && styles8.wrapperOpen, disabled && styles8.disabled, style],
|
|
2366
2481
|
children: [
|
|
2367
2482
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2368
2483
|
reactNative.Pressable,
|
|
@@ -2377,17 +2492,17 @@ var LanguageSwitcher = react.forwardRef(
|
|
|
2377
2492
|
onHoverIn: () => setTriggerHovered(true),
|
|
2378
2493
|
onHoverOut: () => setTriggerHovered(false),
|
|
2379
2494
|
style: ({ pressed }) => [
|
|
2380
|
-
|
|
2381
|
-
(triggerHovered || pressed || isOpen) &&
|
|
2495
|
+
styles8.trigger,
|
|
2496
|
+
(triggerHovered || pressed || isOpen) && styles8.triggerActive
|
|
2382
2497
|
],
|
|
2383
2498
|
children: [
|
|
2384
2499
|
/* @__PURE__ */ jsxRuntime.jsx(GlobeIcon, { size: ICON_SIZE5, color: colors.white, strokeWidth: 2 }),
|
|
2385
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
2386
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [
|
|
2500
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles8.triggerLabel, numberOfLines: 1, children: selectedOption?.label ?? "" }),
|
|
2501
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles8.chevron, isOpen && styles8.chevronOpen], children: /* @__PURE__ */ jsxRuntime.jsx(ChevronDownIcon, { size: ICON_SIZE5, color: colors.white, strokeWidth: 2 }) })
|
|
2387
2502
|
]
|
|
2388
2503
|
}
|
|
2389
2504
|
),
|
|
2390
|
-
isOpen && options.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
2505
|
+
isOpen && options.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles8.menu, accessibilityRole: "menu", children: options.map((option) => {
|
|
2391
2506
|
const selected = option.value === selectedValue;
|
|
2392
2507
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2393
2508
|
reactNative.Pressable,
|
|
@@ -2399,10 +2514,10 @@ var LanguageSwitcher = react.forwardRef(
|
|
|
2399
2514
|
onHoverIn: () => setHoveredValue(option.value),
|
|
2400
2515
|
onHoverOut: () => setHoveredValue(null),
|
|
2401
2516
|
style: ({ pressed }) => [
|
|
2402
|
-
|
|
2403
|
-
selected ?
|
|
2517
|
+
styles8.item,
|
|
2518
|
+
selected ? styles8.itemSelected : (hoveredValue === option.value || pressed) && styles8.itemHovered
|
|
2404
2519
|
],
|
|
2405
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
2520
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles8.itemLabel, selected && styles8.itemLabelSelected], children: option.label })
|
|
2406
2521
|
},
|
|
2407
2522
|
option.value
|
|
2408
2523
|
);
|
|
@@ -2412,7 +2527,7 @@ var LanguageSwitcher = react.forwardRef(
|
|
|
2412
2527
|
);
|
|
2413
2528
|
}
|
|
2414
2529
|
);
|
|
2415
|
-
var
|
|
2530
|
+
var styles8 = reactNative.StyleSheet.create({
|
|
2416
2531
|
wrapper: {
|
|
2417
2532
|
position: "relative",
|
|
2418
2533
|
width: CONTROL_WIDTH,
|
|
@@ -2508,17 +2623,17 @@ var StatCard = react.forwardRef(function StatCard2({
|
|
|
2508
2623
|
{
|
|
2509
2624
|
...rest,
|
|
2510
2625
|
ref: setContainerRef,
|
|
2511
|
-
style: [
|
|
2626
|
+
style: [styles9.base, style],
|
|
2512
2627
|
accessibilityRole: "text",
|
|
2513
2628
|
accessibilityLabel: accessibilityLabel ?? label,
|
|
2514
2629
|
children: [
|
|
2515
2630
|
/* @__PURE__ */ jsxRuntime.jsx(Icon2, { ...iconProps, size: iconSize, color: iconProps?.color ?? colors.white }),
|
|
2516
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
2631
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles9.label, children: label })
|
|
2517
2632
|
]
|
|
2518
2633
|
}
|
|
2519
2634
|
);
|
|
2520
2635
|
});
|
|
2521
|
-
var
|
|
2636
|
+
var styles9 = reactNative.StyleSheet.create({
|
|
2522
2637
|
base: {
|
|
2523
2638
|
width: 204.5,
|
|
2524
2639
|
minHeight: 114,
|
|
@@ -2604,7 +2719,7 @@ var Button = react.forwardRef(
|
|
|
2604
2719
|
useApplyWebClassName(textRef, textClassName);
|
|
2605
2720
|
const iconNode = customIcon ?? /* @__PURE__ */ jsxRuntime.jsx(ArrowRightIcon, { size: metrics.iconSize, color: preset.iconColor });
|
|
2606
2721
|
const containerStyle = [
|
|
2607
|
-
|
|
2722
|
+
styles10.base,
|
|
2608
2723
|
{
|
|
2609
2724
|
minHeight: metrics.minHeight,
|
|
2610
2725
|
borderRadius: metrics.borderRadius,
|
|
@@ -2615,16 +2730,16 @@ var Button = react.forwardRef(
|
|
|
2615
2730
|
paddingRight: hasIcon ? metrics.paddingRightWithIcon : metrics.paddingRight,
|
|
2616
2731
|
gap: hasIcon ? metrics.gap : 0
|
|
2617
2732
|
},
|
|
2618
|
-
hasIcon ?
|
|
2619
|
-
disabled &&
|
|
2733
|
+
hasIcon ? styles10.contentWithIcon : styles10.contentWithoutIcon,
|
|
2734
|
+
disabled && styles10.disabled,
|
|
2620
2735
|
style
|
|
2621
2736
|
];
|
|
2622
2737
|
const labelStyle = [
|
|
2623
|
-
|
|
2738
|
+
styles10.label,
|
|
2624
2739
|
metrics.text,
|
|
2625
2740
|
{ color: preset.textColor },
|
|
2626
|
-
reactNative.Platform.OS === "android" ?
|
|
2627
|
-
!hasIcon &&
|
|
2741
|
+
reactNative.Platform.OS === "android" ? styles10.labelAndroid : null,
|
|
2742
|
+
!hasIcon && styles10.labelCentered,
|
|
2628
2743
|
textStyle
|
|
2629
2744
|
];
|
|
2630
2745
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -2645,7 +2760,7 @@ var Button = react.forwardRef(
|
|
|
2645
2760
|
reactNative.View,
|
|
2646
2761
|
{
|
|
2647
2762
|
style: [
|
|
2648
|
-
|
|
2763
|
+
styles10.iconContainer,
|
|
2649
2764
|
{
|
|
2650
2765
|
width: metrics.iconContainerSize,
|
|
2651
2766
|
height: metrics.iconContainerSize,
|
|
@@ -2661,7 +2776,7 @@ var Button = react.forwardRef(
|
|
|
2661
2776
|
);
|
|
2662
2777
|
}
|
|
2663
2778
|
);
|
|
2664
|
-
var
|
|
2779
|
+
var styles10 = reactNative.StyleSheet.create({
|
|
2665
2780
|
base: {
|
|
2666
2781
|
flexDirection: "row",
|
|
2667
2782
|
alignItems: "center",
|
|
@@ -2745,13 +2860,13 @@ var Checkbox = react.forwardRef(function Checkbox2({
|
|
|
2745
2860
|
accessibilityRole: "checkbox",
|
|
2746
2861
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
2747
2862
|
accessibilityState: { checked: isActive, disabled },
|
|
2748
|
-
style: [
|
|
2863
|
+
style: [styles11.root, disabled && styles11.disabled, style],
|
|
2749
2864
|
children: [
|
|
2750
2865
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2751
2866
|
reactNative.View,
|
|
2752
2867
|
{
|
|
2753
2868
|
style: [
|
|
2754
|
-
|
|
2869
|
+
styles11.box,
|
|
2755
2870
|
{
|
|
2756
2871
|
backgroundColor: chrome.backgroundColor,
|
|
2757
2872
|
borderColor: chrome.borderColor
|
|
@@ -2760,12 +2875,12 @@ var Checkbox = react.forwardRef(function Checkbox2({
|
|
|
2760
2875
|
children: isActive ? /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, { size: CHECK_SIZE, color: colors.primary, strokeWidth: CHECK_STROKE }) : null
|
|
2761
2876
|
}
|
|
2762
2877
|
),
|
|
2763
|
-
labelContent != null && labelContent !== false ? typeof labelContent === "string" || typeof labelContent === "number" ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
2878
|
+
labelContent != null && labelContent !== false ? typeof labelContent === "string" || typeof labelContent === "number" ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles11.label, labelStyle], children: labelContent }) : labelContent : null
|
|
2764
2879
|
]
|
|
2765
2880
|
}
|
|
2766
2881
|
);
|
|
2767
2882
|
});
|
|
2768
|
-
var
|
|
2883
|
+
var styles11 = reactNative.StyleSheet.create({
|
|
2769
2884
|
root: {
|
|
2770
2885
|
flexDirection: "row",
|
|
2771
2886
|
alignItems: "center",
|
|
@@ -3016,9 +3131,9 @@ var DatePicker = react.forwardRef(
|
|
|
3016
3131
|
{
|
|
3017
3132
|
...rest,
|
|
3018
3133
|
ref: setRootRef,
|
|
3019
|
-
style: [
|
|
3134
|
+
style: [styles12.root, isOpen && styles12.rootOpen, disabled && styles12.disabled, style],
|
|
3020
3135
|
accessibilityState: { disabled, expanded: isOpen },
|
|
3021
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [
|
|
3136
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [styles12.triggerWrap, isOpen && styles12.triggerWrapOpen], children: [
|
|
3022
3137
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3023
3138
|
reactNative.Pressable,
|
|
3024
3139
|
{
|
|
@@ -3029,17 +3144,17 @@ var DatePicker = react.forwardRef(
|
|
|
3029
3144
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
3030
3145
|
accessibilityState: { disabled, expanded: isOpen },
|
|
3031
3146
|
style: [
|
|
3032
|
-
|
|
3147
|
+
styles12.trigger,
|
|
3033
3148
|
{ borderColor: triggerBorderColor, backgroundColor: colors.grey700 }
|
|
3034
3149
|
],
|
|
3035
3150
|
children: [
|
|
3036
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
3037
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
3151
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles12.triggerText, { color: triggerTextColor }], numberOfLines: 1, children: triggerLabel }),
|
|
3152
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles12.iconSlot, children: /* @__PURE__ */ jsxRuntime.jsx(CalendarOutlineIcon, { size: ICON_SIZE7, color: colors.grey100 }) })
|
|
3038
3153
|
]
|
|
3039
3154
|
}
|
|
3040
3155
|
),
|
|
3041
|
-
isOpen ? /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [
|
|
3042
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
3156
|
+
isOpen ? /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [styles12.menu, calendarStyle], children: [
|
|
3157
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles12.calendarHeader, children: [
|
|
3043
3158
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3044
3159
|
reactNative.Pressable,
|
|
3045
3160
|
{
|
|
@@ -3047,11 +3162,11 @@ var DatePicker = react.forwardRef(
|
|
|
3047
3162
|
hitSlop: 8,
|
|
3048
3163
|
accessibilityRole: "button",
|
|
3049
3164
|
accessibilityLabel: "Previous month",
|
|
3050
|
-
style:
|
|
3165
|
+
style: styles12.navButton,
|
|
3051
3166
|
children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeftIcon, { size: NAV_ICON_SIZE, color: colors.white })
|
|
3052
3167
|
}
|
|
3053
3168
|
),
|
|
3054
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.Text, { style:
|
|
3169
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.Text, { style: styles12.monthHeading, children: [
|
|
3055
3170
|
monthNames[visibleMonth.getMonth()],
|
|
3056
3171
|
" ",
|
|
3057
3172
|
visibleMonth.getFullYear()
|
|
@@ -3063,13 +3178,13 @@ var DatePicker = react.forwardRef(
|
|
|
3063
3178
|
hitSlop: 8,
|
|
3064
3179
|
accessibilityRole: "button",
|
|
3065
3180
|
accessibilityLabel: "Next month",
|
|
3066
|
-
style:
|
|
3067
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
3181
|
+
style: styles12.navButton,
|
|
3182
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles12.navIconMirror, children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeftIcon, { size: NAV_ICON_SIZE, color: colors.white }) })
|
|
3068
3183
|
}
|
|
3069
3184
|
)
|
|
3070
3185
|
] }),
|
|
3071
3186
|
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { children: [
|
|
3072
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
3187
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles12.weekdayRow, children: weekdayLabels.map((weekdayLabel, index) => /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles12.dayCellWrap, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles12.weekdayText, children: weekdayLabel }) }, `${weekdayLabel}-${index}`)) }),
|
|
3073
3188
|
weeks.map((week, weekIndex) => {
|
|
3074
3189
|
let rangeHighlightStyle = null;
|
|
3075
3190
|
if (isRange && rangeValue.start && rangeValue.end) {
|
|
@@ -3106,13 +3221,13 @@ var DatePicker = react.forwardRef(
|
|
|
3106
3221
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3107
3222
|
reactNative.View,
|
|
3108
3223
|
{
|
|
3109
|
-
style: [
|
|
3224
|
+
style: [styles12.weekRow, weekIndex > 0 && styles12.weekRowSpaced],
|
|
3110
3225
|
children: [
|
|
3111
3226
|
rangeHighlightStyle ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3112
3227
|
reactNative.View,
|
|
3113
3228
|
{
|
|
3114
3229
|
pointerEvents: "none",
|
|
3115
|
-
style: [
|
|
3230
|
+
style: [styles12.rangeHighlight, rangeHighlightStyle]
|
|
3116
3231
|
}
|
|
3117
3232
|
) : null,
|
|
3118
3233
|
week.map((day, dayIndex) => {
|
|
@@ -3135,7 +3250,7 @@ var DatePicker = react.forwardRef(
|
|
|
3135
3250
|
onHoverOut: () => setHoveredDayKey((current) => current === dayKey ? null : current),
|
|
3136
3251
|
onPressIn: () => setHoveredDayKey(dayKey),
|
|
3137
3252
|
onPressOut: () => setHoveredDayKey((current) => current === dayKey ? null : current),
|
|
3138
|
-
style:
|
|
3253
|
+
style: styles12.dayCellWrap,
|
|
3139
3254
|
accessibilityRole: "button",
|
|
3140
3255
|
accessibilityLabel: formatValue(day),
|
|
3141
3256
|
accessibilityState: {
|
|
@@ -3147,14 +3262,14 @@ var DatePicker = react.forwardRef(
|
|
|
3147
3262
|
reactNative.View,
|
|
3148
3263
|
{
|
|
3149
3264
|
style: [
|
|
3150
|
-
|
|
3151
|
-
isSelectedEndpoint &&
|
|
3152
|
-
isHovered &&
|
|
3265
|
+
styles12.dayCircle,
|
|
3266
|
+
isSelectedEndpoint && styles12.dayCircleSelected,
|
|
3267
|
+
isHovered && styles12.dayCircleHovered
|
|
3153
3268
|
],
|
|
3154
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
3269
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles12.dayText, { color: dayTextColor }], children: day.getDate() })
|
|
3155
3270
|
}
|
|
3156
3271
|
),
|
|
3157
|
-
isToday && !isSelectedEndpoint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
3272
|
+
isToday && !isSelectedEndpoint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles12.todayDot }) : null
|
|
3158
3273
|
]
|
|
3159
3274
|
},
|
|
3160
3275
|
dayIndex
|
|
@@ -3172,7 +3287,7 @@ var DatePicker = react.forwardRef(
|
|
|
3172
3287
|
);
|
|
3173
3288
|
}
|
|
3174
3289
|
);
|
|
3175
|
-
var
|
|
3290
|
+
var styles12 = reactNative.StyleSheet.create({
|
|
3176
3291
|
root: {
|
|
3177
3292
|
width: DEFAULT_WIDTH,
|
|
3178
3293
|
gap: 8,
|
|
@@ -3451,13 +3566,13 @@ var Input = react.forwardRef(function Input2({
|
|
|
3451
3566
|
});
|
|
3452
3567
|
useApplyWebClassName(rootRef, className);
|
|
3453
3568
|
useApplyWebClassName(inputRef, inputClassName);
|
|
3454
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ref: rootRef, style: [
|
|
3455
|
-
showLabel && label ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
3569
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ref: rootRef, style: [styles13.root, disabled && styles13.disabled, style], children: [
|
|
3570
|
+
showLabel && label ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles13.label, { color: chrome.labelColor }], children: label }) : null,
|
|
3456
3571
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3457
3572
|
reactNative.View,
|
|
3458
3573
|
{
|
|
3459
3574
|
style: [
|
|
3460
|
-
|
|
3575
|
+
styles13.field,
|
|
3461
3576
|
{
|
|
3462
3577
|
height: metrics.height,
|
|
3463
3578
|
borderRadius: metrics.borderRadius,
|
|
@@ -3472,7 +3587,7 @@ var Input = react.forwardRef(function Input2({
|
|
|
3472
3587
|
fieldStyle
|
|
3473
3588
|
],
|
|
3474
3589
|
children: [
|
|
3475
|
-
hasLeftIcon ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [
|
|
3590
|
+
hasLeftIcon ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles13.iconSlot, { width: metrics.iconSize, height: metrics.iconSize }], children: leftIconNode }) : null,
|
|
3476
3591
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3477
3592
|
reactNative.TextInput,
|
|
3478
3593
|
{
|
|
@@ -3496,11 +3611,11 @@ var Input = react.forwardRef(function Input2({
|
|
|
3496
3611
|
onBlur?.(event);
|
|
3497
3612
|
},
|
|
3498
3613
|
style: [
|
|
3499
|
-
|
|
3614
|
+
styles13.input,
|
|
3500
3615
|
metrics.text,
|
|
3501
3616
|
{ color: chrome.textColor },
|
|
3502
|
-
reactNative.Platform.OS === "web" ?
|
|
3503
|
-
reactNative.Platform.OS === "android" ?
|
|
3617
|
+
reactNative.Platform.OS === "web" ? styles13.inputWeb : null,
|
|
3618
|
+
reactNative.Platform.OS === "android" ? styles13.inputAndroid : null,
|
|
3504
3619
|
inputStyle
|
|
3505
3620
|
],
|
|
3506
3621
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
@@ -3512,20 +3627,20 @@ var Input = react.forwardRef(function Input2({
|
|
|
3512
3627
|
{
|
|
3513
3628
|
onPress: onRightIconPress,
|
|
3514
3629
|
disabled,
|
|
3515
|
-
style: [
|
|
3630
|
+
style: [styles13.iconSlot, { width: metrics.iconSize, height: metrics.iconSize }],
|
|
3516
3631
|
accessibilityRole: "button",
|
|
3517
3632
|
accessibilityLabel: rightIconAccessibilityLabel,
|
|
3518
3633
|
hitSlop: 8,
|
|
3519
3634
|
children: rightIconNode
|
|
3520
3635
|
}
|
|
3521
|
-
) : /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [
|
|
3636
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles13.iconSlot, { width: metrics.iconSize, height: metrics.iconSize }], children: rightIconNode }) : null
|
|
3522
3637
|
]
|
|
3523
3638
|
}
|
|
3524
3639
|
),
|
|
3525
|
-
showHint && hint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
3640
|
+
showHint && hint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles13.hint, { color: chrome.hintColor }], children: hint }) : null
|
|
3526
3641
|
] });
|
|
3527
3642
|
});
|
|
3528
|
-
var
|
|
3643
|
+
var styles13 = reactNative.StyleSheet.create({
|
|
3529
3644
|
root: {
|
|
3530
3645
|
width: DEFAULT_WIDTH2,
|
|
3531
3646
|
gap: 8,
|
|
@@ -3641,25 +3756,25 @@ function MultiValueChips({ options, disabled, onRemove }) {
|
|
|
3641
3756
|
const next = Math.ceil(event.nativeEvent.layout.width);
|
|
3642
3757
|
setEllipsisWidth((current) => current === next ? current : next);
|
|
3643
3758
|
};
|
|
3644
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
3645
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { pointerEvents: "none", style:
|
|
3759
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles14.multiValueRoot, children: [
|
|
3760
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { pointerEvents: "none", style: styles14.measureRow, children: [
|
|
3646
3761
|
options.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3647
3762
|
reactNative.View,
|
|
3648
3763
|
{
|
|
3649
|
-
style:
|
|
3764
|
+
style: styles14.chip,
|
|
3650
3765
|
onLayout: (event) => handleChipLayout(option.value, event),
|
|
3651
3766
|
children: [
|
|
3652
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
3653
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
3767
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.chipLabel, numberOfLines: 1, children: option.label }),
|
|
3768
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.chipRemove, children: "\xD7" })
|
|
3654
3769
|
]
|
|
3655
3770
|
},
|
|
3656
3771
|
`measure-${option.value}`
|
|
3657
3772
|
)),
|
|
3658
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
3773
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles14.ellipsis, onLayout: handleEllipsisLayout, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.ellipsisText, children: "..." }) })
|
|
3659
3774
|
] }),
|
|
3660
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
3661
|
-
visible.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
3662
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
3775
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles14.chipsRow, onLayout: handleContainerLayout, children: [
|
|
3776
|
+
visible.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles14.chip, children: [
|
|
3777
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.chipLabel, numberOfLines: 1, children: option.label }),
|
|
3663
3778
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3664
3779
|
reactNative.Pressable,
|
|
3665
3780
|
{
|
|
@@ -3671,11 +3786,11 @@ function MultiValueChips({ options, disabled, onRemove }) {
|
|
|
3671
3786
|
hitSlop: 6,
|
|
3672
3787
|
accessibilityRole: "button",
|
|
3673
3788
|
accessibilityLabel: `Remove ${option.label}`,
|
|
3674
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
3789
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.chipRemove, children: "\xD7" })
|
|
3675
3790
|
}
|
|
3676
3791
|
)
|
|
3677
3792
|
] }, option.value)),
|
|
3678
|
-
hasOverflow ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
3793
|
+
hasOverflow ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles14.ellipsis, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.ellipsisText, children: "..." }) }) : null
|
|
3679
3794
|
] })
|
|
3680
3795
|
] });
|
|
3681
3796
|
}
|
|
@@ -3899,11 +4014,11 @@ var Select = react.forwardRef(
|
|
|
3899
4014
|
{
|
|
3900
4015
|
...rest,
|
|
3901
4016
|
ref: setRootRef,
|
|
3902
|
-
style: [
|
|
4017
|
+
style: [styles14.root, isOpen && styles14.rootOpen, disabled && styles14.disabled, style],
|
|
3903
4018
|
accessibilityState: { disabled, expanded: isOpen },
|
|
3904
4019
|
children: [
|
|
3905
|
-
showLabel && label ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
3906
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [
|
|
4020
|
+
showLabel && label ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles14.label, { color: labelColor }], children: label }) : null,
|
|
4021
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [styles14.triggerWrap, isOpen && styles14.triggerWrapOpen], children: [
|
|
3907
4022
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3908
4023
|
reactNative.Pressable,
|
|
3909
4024
|
{
|
|
@@ -3914,29 +4029,29 @@ var Select = react.forwardRef(
|
|
|
3914
4029
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
3915
4030
|
accessibilityState: { disabled, expanded: isOpen },
|
|
3916
4031
|
style: [
|
|
3917
|
-
|
|
4032
|
+
styles14.trigger,
|
|
3918
4033
|
{
|
|
3919
4034
|
borderColor: triggerBorderColor,
|
|
3920
4035
|
backgroundColor: colors.grey700
|
|
3921
4036
|
}
|
|
3922
4037
|
],
|
|
3923
4038
|
children: [
|
|
3924
|
-
hasLeftIcon ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
3925
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
4039
|
+
hasLeftIcon ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles14.iconSlot, children: leftIconNode }) : null,
|
|
4040
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles14.triggerContent, children: multiple && hasValue ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
3926
4041
|
MultiValueChips,
|
|
3927
4042
|
{
|
|
3928
4043
|
options: selectedOptions,
|
|
3929
4044
|
disabled,
|
|
3930
4045
|
onRemove: handleRemoveChip
|
|
3931
4046
|
}
|
|
3932
|
-
) : /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
3933
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [
|
|
4047
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles14.triggerText, { color: triggerTextColor }], numberOfLines: 1, children: multiple ? placeholder : singleLabel }) }),
|
|
4048
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [styles14.iconSlot, isOpen && styles14.chevronOpen], children: /* @__PURE__ */ jsxRuntime.jsx(ChevronDownIcon, { size: ICON_SIZE8, color: isOpen ? colors.primary : colors.grey100 }) })
|
|
3934
4049
|
]
|
|
3935
4050
|
}
|
|
3936
4051
|
),
|
|
3937
|
-
isOpen ? /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
3938
|
-
showSearch ? /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
3939
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
4052
|
+
isOpen ? /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles14.menu, children: [
|
|
4053
|
+
showSearch ? /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles14.searchField, children: [
|
|
4054
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles14.iconSlot, children: /* @__PURE__ */ jsxRuntime.jsx(SearchIcon, { size: ICON_SIZE8, color: colors.grey100 }) }),
|
|
3940
4055
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3941
4056
|
reactNative.TextInput,
|
|
3942
4057
|
{
|
|
@@ -3947,9 +4062,9 @@ var Select = react.forwardRef(
|
|
|
3947
4062
|
placeholder: searchPlaceholder,
|
|
3948
4063
|
placeholderTextColor: colors.grey100,
|
|
3949
4064
|
style: [
|
|
3950
|
-
|
|
3951
|
-
reactNative.Platform.OS === "web" ?
|
|
3952
|
-
reactNative.Platform.OS === "android" ?
|
|
4065
|
+
styles14.searchInput,
|
|
4066
|
+
reactNative.Platform.OS === "web" ? styles14.searchInputWeb : null,
|
|
4067
|
+
reactNative.Platform.OS === "android" ? styles14.searchInputAndroid : null
|
|
3953
4068
|
],
|
|
3954
4069
|
accessibilityLabel: searchPlaceholder
|
|
3955
4070
|
}
|
|
@@ -3958,12 +4073,12 @@ var Select = react.forwardRef(
|
|
|
3958
4073
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
3959
4074
|
reactNative.ScrollView,
|
|
3960
4075
|
{
|
|
3961
|
-
style:
|
|
3962
|
-
contentContainerStyle:
|
|
4076
|
+
style: styles14.optionList,
|
|
4077
|
+
contentContainerStyle: styles14.optionListContent,
|
|
3963
4078
|
keyboardShouldPersistTaps: "handled",
|
|
3964
4079
|
showsVerticalScrollIndicator: false,
|
|
3965
4080
|
children: [
|
|
3966
|
-
loading ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
4081
|
+
loading ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles14.statusRow, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.statusText, children: "Loading..." }) }) : filteredOptions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles14.statusRow, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.statusText, children: emptyText }) }) : null,
|
|
3967
4082
|
!loading && filteredOptions.map((option) => {
|
|
3968
4083
|
const isSelected = selectedValues.includes(option.value);
|
|
3969
4084
|
const isHovered = hoveredValue === option.value;
|
|
@@ -3980,14 +4095,14 @@ var Select = react.forwardRef(
|
|
|
3980
4095
|
accessibilityRole: multiple ? "checkbox" : "button",
|
|
3981
4096
|
accessibilityState: { selected: isSelected, checked: isSelected, disabled },
|
|
3982
4097
|
style: [
|
|
3983
|
-
|
|
4098
|
+
styles14.item,
|
|
3984
4099
|
{
|
|
3985
4100
|
backgroundColor: itemBackground(visualState)
|
|
3986
4101
|
}
|
|
3987
4102
|
],
|
|
3988
4103
|
children: [
|
|
3989
|
-
multiple ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { pointerEvents: "none", style:
|
|
3990
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style:
|
|
4104
|
+
multiple ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { pointerEvents: "none", style: styles14.itemCheckbox, children: /* @__PURE__ */ jsxRuntime.jsx(Checkbox, { value: isSelected, variant: "light" }) }) : null,
|
|
4105
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles14.itemLabel, numberOfLines: 1, children: option.label })
|
|
3991
4106
|
]
|
|
3992
4107
|
},
|
|
3993
4108
|
option.value
|
|
@@ -3998,13 +4113,13 @@ var Select = react.forwardRef(
|
|
|
3998
4113
|
)
|
|
3999
4114
|
] }) : null
|
|
4000
4115
|
] }),
|
|
4001
|
-
showHint && hint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
4116
|
+
showHint && hint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles14.hint, { color: hintColor }], children: hint }) : null
|
|
4002
4117
|
]
|
|
4003
4118
|
}
|
|
4004
4119
|
);
|
|
4005
4120
|
}
|
|
4006
4121
|
);
|
|
4007
|
-
var
|
|
4122
|
+
var styles14 = reactNative.StyleSheet.create({
|
|
4008
4123
|
root: {
|
|
4009
4124
|
width: DEFAULT_WIDTH3,
|
|
4010
4125
|
gap: 8,
|
|
@@ -4266,13 +4381,13 @@ var Textarea = react.forwardRef(function Textarea2({
|
|
|
4266
4381
|
const resolvedAccessibilityLabel = accessibilityLabel ?? (showLabel ? void 0 : label);
|
|
4267
4382
|
useApplyWebClassName(rootRef, className);
|
|
4268
4383
|
useApplyWebClassName(inputRef, inputClassName);
|
|
4269
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ref: rootRef, style: [
|
|
4270
|
-
showLabel && label ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
4384
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ref: rootRef, style: [styles15.root, disabled && styles15.disabled, style], children: [
|
|
4385
|
+
showLabel && label ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles15.label, { color: chrome.labelColor }], children: label }) : null,
|
|
4271
4386
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4272
4387
|
reactNative.View,
|
|
4273
4388
|
{
|
|
4274
4389
|
style: [
|
|
4275
|
-
|
|
4390
|
+
styles15.field,
|
|
4276
4391
|
{
|
|
4277
4392
|
borderColor: chrome.borderColor,
|
|
4278
4393
|
backgroundColor: chrome.backgroundColor
|
|
@@ -4304,11 +4419,11 @@ var Textarea = react.forwardRef(function Textarea2({
|
|
|
4304
4419
|
onBlur?.(event);
|
|
4305
4420
|
},
|
|
4306
4421
|
style: [
|
|
4307
|
-
|
|
4422
|
+
styles15.input,
|
|
4308
4423
|
textareaTypography.field,
|
|
4309
4424
|
{ color: chrome.textColor },
|
|
4310
|
-
reactNative.Platform.OS === "web" ?
|
|
4311
|
-
reactNative.Platform.OS === "android" ?
|
|
4425
|
+
reactNative.Platform.OS === "web" ? styles15.inputWeb : null,
|
|
4426
|
+
reactNative.Platform.OS === "android" ? styles15.inputAndroid : null,
|
|
4312
4427
|
inputStyle
|
|
4313
4428
|
],
|
|
4314
4429
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
@@ -4317,10 +4432,10 @@ var Textarea = react.forwardRef(function Textarea2({
|
|
|
4317
4432
|
)
|
|
4318
4433
|
}
|
|
4319
4434
|
),
|
|
4320
|
-
showHint && hint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
4435
|
+
showHint && hint ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles15.hint, { color: chrome.hintColor }], children: hint }) : null
|
|
4321
4436
|
] });
|
|
4322
4437
|
});
|
|
4323
|
-
var
|
|
4438
|
+
var styles15 = reactNative.StyleSheet.create({
|
|
4324
4439
|
root: {
|
|
4325
4440
|
width: DEFAULT_WIDTH4,
|
|
4326
4441
|
gap: 8,
|
|
@@ -4420,13 +4535,13 @@ var Toggle = react.forwardRef(function Toggle2({
|
|
|
4420
4535
|
accessibilityRole: "switch",
|
|
4421
4536
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
4422
4537
|
accessibilityState: { checked: isActive, disabled },
|
|
4423
|
-
style: [
|
|
4538
|
+
style: [styles16.pressable, disabled && styles16.disabled, style],
|
|
4424
4539
|
children: [
|
|
4425
4540
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4426
4541
|
reactNative.Animated.View,
|
|
4427
4542
|
{
|
|
4428
4543
|
style: [
|
|
4429
|
-
|
|
4544
|
+
styles16.track,
|
|
4430
4545
|
{
|
|
4431
4546
|
backgroundColor: trackBackgroundColor
|
|
4432
4547
|
}
|
|
@@ -4435,7 +4550,7 @@ var Toggle = react.forwardRef(function Toggle2({
|
|
|
4435
4550
|
reactNative.Animated.View,
|
|
4436
4551
|
{
|
|
4437
4552
|
style: [
|
|
4438
|
-
|
|
4553
|
+
styles16.thumb,
|
|
4439
4554
|
{
|
|
4440
4555
|
transform: [{ translateX: thumbTranslateX }]
|
|
4441
4556
|
}
|
|
@@ -4444,12 +4559,12 @@ var Toggle = react.forwardRef(function Toggle2({
|
|
|
4444
4559
|
)
|
|
4445
4560
|
}
|
|
4446
4561
|
),
|
|
4447
|
-
labelContent != null && labelContent !== false ? typeof labelContent === "string" || typeof labelContent === "number" ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [
|
|
4562
|
+
labelContent != null && labelContent !== false ? typeof labelContent === "string" || typeof labelContent === "number" ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: [styles16.label, labelStyle], children: labelContent }) : labelContent : null
|
|
4448
4563
|
]
|
|
4449
4564
|
}
|
|
4450
4565
|
);
|
|
4451
4566
|
});
|
|
4452
|
-
var
|
|
4567
|
+
var styles16 = reactNative.StyleSheet.create({
|
|
4453
4568
|
pressable: {
|
|
4454
4569
|
flexDirection: "row",
|
|
4455
4570
|
alignItems: "center",
|
|
@@ -4524,21 +4639,21 @@ var RatingInput = react.forwardRef(
|
|
|
4524
4639
|
{
|
|
4525
4640
|
...rest,
|
|
4526
4641
|
ref: setContainerRef,
|
|
4527
|
-
style: [
|
|
4642
|
+
style: [styles17.root, disabled && styles17.disabled, style],
|
|
4528
4643
|
children: [
|
|
4529
|
-
showValue ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: [
|
|
4644
|
+
showValue ? /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: [styles17.value, valueStyle], children: selectedValue.toFixed(precision) }) : null,
|
|
4530
4645
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4531
4646
|
reactNative.View,
|
|
4532
4647
|
{
|
|
4533
4648
|
accessibilityRole: readOnly ? "image" : "radiogroup",
|
|
4534
4649
|
accessibilityLabel: resolvedAccessibilityLabel,
|
|
4535
4650
|
accessibilityState: { disabled },
|
|
4536
|
-
style: [
|
|
4651
|
+
style: [styles17.stars, { gap: resolvedStarGap }],
|
|
4537
4652
|
children: Array.from({ length: STAR_COUNT }, (_, index) => {
|
|
4538
4653
|
const starValue = index + 1;
|
|
4539
4654
|
const isSelected = starValue <= selectedStarCount;
|
|
4540
4655
|
const icon = isSelected ? /* @__PURE__ */ jsxRuntime.jsx(StarFilledIcon, { size: iconWidth, height: iconHeight }) : /* @__PURE__ */ jsxRuntime.jsx(StarIcon, { size: iconWidth, height: iconHeight });
|
|
4541
|
-
const itemStyle = [
|
|
4656
|
+
const itemStyle = [styles17.starItem, { width: size, height: size }];
|
|
4542
4657
|
if (readOnly) {
|
|
4543
4658
|
return /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: itemStyle, children: icon }, starValue);
|
|
4544
4659
|
}
|
|
@@ -4564,7 +4679,7 @@ var RatingInput = react.forwardRef(
|
|
|
4564
4679
|
);
|
|
4565
4680
|
}
|
|
4566
4681
|
);
|
|
4567
|
-
var
|
|
4682
|
+
var styles17 = reactNative.StyleSheet.create({
|
|
4568
4683
|
root: {
|
|
4569
4684
|
flexDirection: "row",
|
|
4570
4685
|
alignItems: "center",
|
|
@@ -4628,19 +4743,19 @@ var CommentCard = react.forwardRef(
|
|
|
4628
4743
|
setExpanded(next);
|
|
4629
4744
|
onExpandedChange?.(next);
|
|
4630
4745
|
};
|
|
4631
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ...rest, ref: setContainerRef, style: [
|
|
4632
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
4633
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
4746
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ...rest, ref: setContainerRef, style: [styles18.root, style], children: [
|
|
4747
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles18.header, children: [
|
|
4748
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles18.avatar, children: hasImage ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
4634
4749
|
reactNative.Image,
|
|
4635
4750
|
{
|
|
4636
4751
|
source: { uri: imageUrl ?? void 0 },
|
|
4637
|
-
style:
|
|
4752
|
+
style: styles18.avatarImage,
|
|
4638
4753
|
onError: () => setImageFailed(true)
|
|
4639
4754
|
}
|
|
4640
4755
|
) : /* @__PURE__ */ jsxRuntime.jsx(UserIcon, { size: 20, color: colors.primary }) }),
|
|
4641
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
4642
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style:
|
|
4643
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style:
|
|
4756
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles18.identity, children: [
|
|
4757
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: styles18.name, children: userName }),
|
|
4758
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { numberOfLines: 1, style: styles18.date, children: date })
|
|
4644
4759
|
] }),
|
|
4645
4760
|
/* @__PURE__ */ jsxRuntime.jsx(RatingInput, { value: rating, readOnly: true, showValue: false, size: 16 })
|
|
4646
4761
|
] }),
|
|
@@ -4648,7 +4763,7 @@ var CommentCard = react.forwardRef(
|
|
|
4648
4763
|
reactNative.Text,
|
|
4649
4764
|
{
|
|
4650
4765
|
numberOfLines: expanded ? void 0 : maxCommentLines,
|
|
4651
|
-
style: [
|
|
4766
|
+
style: [styles18.comment, commentStyle],
|
|
4652
4767
|
children: commentText
|
|
4653
4768
|
}
|
|
4654
4769
|
),
|
|
@@ -4661,14 +4776,14 @@ var CommentCard = react.forwardRef(
|
|
|
4661
4776
|
hitSlop: 6,
|
|
4662
4777
|
onHoverIn: () => setActionHovered(true),
|
|
4663
4778
|
onHoverOut: () => setActionHovered(false),
|
|
4664
|
-
style:
|
|
4779
|
+
style: styles18.action,
|
|
4665
4780
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
4666
4781
|
reactNative.Text,
|
|
4667
4782
|
{
|
|
4668
4783
|
style: [
|
|
4669
|
-
|
|
4670
|
-
expanded &&
|
|
4671
|
-
actionHovered && (expanded ?
|
|
4784
|
+
styles18.actionText,
|
|
4785
|
+
expanded && styles18.closeActionText,
|
|
4786
|
+
actionHovered && (expanded ? styles18.closeActionTextHovered : styles18.openActionTextHovered)
|
|
4672
4787
|
],
|
|
4673
4788
|
children: expanded ? readLessLabel : readMoreLabel
|
|
4674
4789
|
}
|
|
@@ -4678,7 +4793,7 @@ var CommentCard = react.forwardRef(
|
|
|
4678
4793
|
] });
|
|
4679
4794
|
}
|
|
4680
4795
|
);
|
|
4681
|
-
var
|
|
4796
|
+
var styles18 = reactNative.StyleSheet.create({
|
|
4682
4797
|
root: {
|
|
4683
4798
|
width: CARD_WIDTH,
|
|
4684
4799
|
minHeight: CARD_MIN_HEIGHT,
|
|
@@ -5117,7 +5232,7 @@ var Range = react.forwardRef(function Range2({
|
|
|
5117
5232
|
...rest,
|
|
5118
5233
|
ref: setRootRef,
|
|
5119
5234
|
onLayout,
|
|
5120
|
-
style: [
|
|
5235
|
+
style: [styles19.root, disabled && styles19.disabled, style],
|
|
5121
5236
|
children: [
|
|
5122
5237
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
5123
5238
|
reactNative.Pressable,
|
|
@@ -5131,16 +5246,16 @@ var Range = react.forwardRef(function Range2({
|
|
|
5131
5246
|
updateNearestFromTrack(event.nativeEvent.offsetX);
|
|
5132
5247
|
} : void 0,
|
|
5133
5248
|
onPress: reactNative.Platform.OS === "web" ? void 0 : handleTrackPress,
|
|
5134
|
-
style:
|
|
5249
|
+
style: styles19.sliderPlane,
|
|
5135
5250
|
tabIndex: -1,
|
|
5136
5251
|
children: [
|
|
5137
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { pointerEvents: "none", style:
|
|
5252
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { pointerEvents: "none", style: styles19.track }),
|
|
5138
5253
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5139
5254
|
reactNative.View,
|
|
5140
5255
|
{
|
|
5141
5256
|
pointerEvents: "none",
|
|
5142
5257
|
style: [
|
|
5143
|
-
|
|
5258
|
+
styles19.activeTrack,
|
|
5144
5259
|
{
|
|
5145
5260
|
left: TRACK_HORIZONTAL_INSET + fromOffset,
|
|
5146
5261
|
width: toOffset - fromOffset + THUMB_SIZE2
|
|
@@ -5182,9 +5297,9 @@ var Range = react.forwardRef(function Range2({
|
|
|
5182
5297
|
onAccessibilityAction: (event) => handleAccessibilityAction(event, effectiveFrom, updateFromInput),
|
|
5183
5298
|
pointerEvents: disabled ? "none" : "auto",
|
|
5184
5299
|
style: [
|
|
5185
|
-
|
|
5186
|
-
reactNative.Platform.OS === "web" &&
|
|
5187
|
-
focusedThumb === "from" && reactNative.Platform.OS === "web" &&
|
|
5300
|
+
styles19.thumb,
|
|
5301
|
+
reactNative.Platform.OS === "web" && styles19.thumbWeb,
|
|
5302
|
+
focusedThumb === "from" && reactNative.Platform.OS === "web" && styles19.thumbFocusedWeb,
|
|
5188
5303
|
{ left: TRACK_HORIZONTAL_INSET + fromOffset }
|
|
5189
5304
|
],
|
|
5190
5305
|
tabIndex: disabled ? -1 : 0
|
|
@@ -5224,9 +5339,9 @@ var Range = react.forwardRef(function Range2({
|
|
|
5224
5339
|
onAccessibilityAction: (event) => handleAccessibilityAction(event, effectiveTo, updateToInput),
|
|
5225
5340
|
pointerEvents: disabled ? "none" : "auto",
|
|
5226
5341
|
style: [
|
|
5227
|
-
|
|
5228
|
-
reactNative.Platform.OS === "web" &&
|
|
5229
|
-
focusedThumb === "to" && reactNative.Platform.OS === "web" &&
|
|
5342
|
+
styles19.thumb,
|
|
5343
|
+
reactNative.Platform.OS === "web" && styles19.thumbWeb,
|
|
5344
|
+
focusedThumb === "to" && reactNative.Platform.OS === "web" && styles19.thumbFocusedWeb,
|
|
5230
5345
|
{ left: TRACK_HORIZONTAL_INSET + toOffset }
|
|
5231
5346
|
],
|
|
5232
5347
|
tabIndex: disabled ? -1 : 0
|
|
@@ -5235,7 +5350,7 @@ var Range = react.forwardRef(function Range2({
|
|
|
5235
5350
|
]
|
|
5236
5351
|
}
|
|
5237
5352
|
),
|
|
5238
|
-
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style:
|
|
5353
|
+
/* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: styles19.inputs, children: [
|
|
5239
5354
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5240
5355
|
RangeInput,
|
|
5241
5356
|
{
|
|
@@ -5286,7 +5401,7 @@ function RangeInput({
|
|
|
5286
5401
|
placeholder,
|
|
5287
5402
|
value
|
|
5288
5403
|
}) {
|
|
5289
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [
|
|
5404
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [styles19.inputField, focused && styles19.inputFieldFocused], children: [
|
|
5290
5405
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5291
5406
|
reactNative.TextInput,
|
|
5292
5407
|
{
|
|
@@ -5302,15 +5417,15 @@ function RangeInput({
|
|
|
5302
5417
|
placeholder,
|
|
5303
5418
|
placeholderTextColor: colors.grey150,
|
|
5304
5419
|
returnKeyType: "done",
|
|
5305
|
-
style: [
|
|
5420
|
+
style: [styles19.input, reactNative.Platform.OS === "web" && styles19.inputWeb],
|
|
5306
5421
|
tabIndex: disabled ? -1 : void 0,
|
|
5307
5422
|
value
|
|
5308
5423
|
}
|
|
5309
5424
|
),
|
|
5310
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style:
|
|
5425
|
+
/* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: styles19.currencySlot, children: /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: styles19.currency, children: currency }) })
|
|
5311
5426
|
] });
|
|
5312
5427
|
}
|
|
5313
|
-
var
|
|
5428
|
+
var styles19 = reactNative.StyleSheet.create({
|
|
5314
5429
|
root: {
|
|
5315
5430
|
width: DEFAULT_WIDTH5,
|
|
5316
5431
|
gap: 15,
|
|
@@ -5414,6 +5529,7 @@ var styles18 = reactNative.StyleSheet.create({
|
|
|
5414
5529
|
}
|
|
5415
5530
|
});
|
|
5416
5531
|
|
|
5532
|
+
exports.Amenity = Amenity;
|
|
5417
5533
|
exports.AmenityIcon = AmenityIcon;
|
|
5418
5534
|
exports.AppleIcon = AppleIcon;
|
|
5419
5535
|
exports.AreaExpandIcon = AreaExpandIcon;
|