radix-native-ui 0.1.1 → 0.1.3
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/README.md +1 -1
- package/dist/index.cjs +64 -56
- package/dist/index.d.cts +78 -47
- package/dist/index.d.mts +78 -47
- package/dist/index.mjs +64 -57
- package/package.json +29 -25
- package/LICENSE +0 -21
package/dist/index.mjs
CHANGED
|
@@ -3932,10 +3932,10 @@ AnimatedPressable.displayName = "AnimatedPressable";
|
|
|
3932
3932
|
//#endregion
|
|
3933
3933
|
//#region src/components/layout/Box.tsx
|
|
3934
3934
|
const areEqual$12 = (prevProps, nextProps) => {
|
|
3935
|
-
if (prevProps.children === nextProps.children && prevProps.style === nextProps.style && prevProps.backgroundColor === nextProps.backgroundColor && prevProps.display === nextProps.display && prevProps.flexDirection === nextProps.flexDirection && prevProps.opacity === nextProps.opacity && prevProps.radius === nextProps.radius) return true;
|
|
3935
|
+
if (prevProps.children === nextProps.children && prevProps.style === nextProps.style && prevProps.backgroundColor === nextProps.backgroundColor && prevProps.display === nextProps.display && prevProps.flexDirection === nextProps.flexDirection && prevProps.flex === nextProps.flex && prevProps.opacity === nextProps.opacity && prevProps.radius === nextProps.radius) return true;
|
|
3936
3936
|
return false;
|
|
3937
3937
|
};
|
|
3938
|
-
const Box = React.memo(React.forwardRef(({ asChild = false, children, style, backgroundColor, radius, display, flexDirection, justifyContent, alignItems, flexWrap, flexGrow, flexShrink, flexBasis, alignSelf, width, height, minWidth, maxWidth, minHeight, maxHeight, position, top, right, bottom, left, zIndex, overflow, margin, marginTop, marginBottom, marginLeft, marginRight, marginHorizontal, marginVertical, padding, paddingTop, paddingBottom, paddingLeft, paddingRight, paddingHorizontal, paddingVertical, borderWidth, borderRadius: borderRadiusProp, borderColor, opacity, elevation, ...rest }, ref) => {
|
|
3938
|
+
const Box = React.memo(React.forwardRef(({ asChild = false, children, style, backgroundColor, radius, display, flexDirection, justifyContent, alignItems, flexWrap, flex, flexGrow, flexShrink, flexBasis, alignSelf, width, height, minWidth, maxWidth, minHeight, maxHeight, position, top, right, bottom, left, zIndex, overflow, margin, marginTop, marginBottom, marginLeft, marginRight, marginHorizontal, marginVertical, padding, paddingTop, paddingBottom, paddingLeft, paddingRight, paddingHorizontal, paddingVertical, borderWidth, borderRadius: borderRadiusProp, borderColor, opacity, elevation, ...rest }, ref) => {
|
|
3939
3939
|
const theme = useTheme$1();
|
|
3940
3940
|
const colors = theme.colors.gray;
|
|
3941
3941
|
const radii = theme.radii;
|
|
@@ -3959,6 +3959,7 @@ const Box = React.memo(React.forwardRef(({ asChild = false, children, style, bac
|
|
|
3959
3959
|
justifyContent,
|
|
3960
3960
|
alignItems,
|
|
3961
3961
|
flexWrap,
|
|
3962
|
+
flex,
|
|
3962
3963
|
flexGrow,
|
|
3963
3964
|
flexShrink,
|
|
3964
3965
|
flexBasis,
|
|
@@ -4001,6 +4002,7 @@ const Box = React.memo(React.forwardRef(({ asChild = false, children, style, bac
|
|
|
4001
4002
|
justifyContent,
|
|
4002
4003
|
alignItems,
|
|
4003
4004
|
flexWrap,
|
|
4005
|
+
flex,
|
|
4004
4006
|
flexGrow,
|
|
4005
4007
|
flexShrink,
|
|
4006
4008
|
flexBasis,
|
|
@@ -4481,21 +4483,20 @@ Separator.displayName = "Separator";
|
|
|
4481
4483
|
* </Stack>
|
|
4482
4484
|
*/
|
|
4483
4485
|
const Stack = React.memo(({ children, direction = "vertical", gap, align, justify, wrap = "nowrap", asChild = false, style, width, height, flexGrow, flexShrink, padding, backgroundColor }) => {
|
|
4484
|
-
const theme = useTheme$1();
|
|
4485
4486
|
const stackStyle = useMemo(() => {
|
|
4486
4487
|
const baseStyle = {
|
|
4487
4488
|
display: "flex",
|
|
4488
4489
|
flexDirection: direction === "horizontal" ? "row" : "column",
|
|
4489
4490
|
flexWrap: wrap
|
|
4490
4491
|
};
|
|
4491
|
-
if (gap !== void 0) baseStyle.gap =
|
|
4492
|
+
if (gap !== void 0) baseStyle.gap = gap;
|
|
4492
4493
|
if (align !== void 0) baseStyle.alignItems = align;
|
|
4493
4494
|
if (justify !== void 0) baseStyle.justifyContent = justify;
|
|
4494
4495
|
if (width !== void 0) baseStyle.width = width;
|
|
4495
4496
|
if (height !== void 0) baseStyle.height = height;
|
|
4496
4497
|
if (flexGrow !== void 0) baseStyle.flexGrow = flexGrow;
|
|
4497
4498
|
if (flexShrink !== void 0) baseStyle.flexShrink = flexShrink;
|
|
4498
|
-
if (padding !== void 0) baseStyle.padding =
|
|
4499
|
+
if (padding !== void 0) baseStyle.padding = padding;
|
|
4499
4500
|
if (backgroundColor !== void 0) baseStyle.backgroundColor = backgroundColor;
|
|
4500
4501
|
return baseStyle;
|
|
4501
4502
|
}, [
|
|
@@ -4509,8 +4510,7 @@ const Stack = React.memo(({ children, direction = "vertical", gap, align, justif
|
|
|
4509
4510
|
flexGrow,
|
|
4510
4511
|
flexShrink,
|
|
4511
4512
|
padding,
|
|
4512
|
-
backgroundColor
|
|
4513
|
-
theme.space
|
|
4513
|
+
backgroundColor
|
|
4514
4514
|
]);
|
|
4515
4515
|
return /* @__PURE__ */ jsx(asChild ? Slot : RnView, {
|
|
4516
4516
|
style: [stackStyle, style],
|
|
@@ -5382,8 +5382,8 @@ const TextFieldRoot = React.forwardRef(({ children, ...props }, ref) => {
|
|
|
5382
5382
|
const variantColors = getVariantColors(theme, activeColor, mode, variant || "outline", highContrast || false);
|
|
5383
5383
|
const [isFocused, setIsFocused] = React.useState(false);
|
|
5384
5384
|
const getSizeValues = () => {
|
|
5385
|
-
switch (size) {
|
|
5386
|
-
case
|
|
5385
|
+
switch (Number(size)) {
|
|
5386
|
+
case 1: return {
|
|
5387
5387
|
fontSize: theme.typography.fontSizes[4].fontSize,
|
|
5388
5388
|
paddingVertical: theme.space[2],
|
|
5389
5389
|
paddingHorizontal: theme.space[3],
|
|
@@ -5391,7 +5391,7 @@ const TextFieldRoot = React.forwardRef(({ children, ...props }, ref) => {
|
|
|
5391
5391
|
height: multiline ? void 0 : 36,
|
|
5392
5392
|
slotPadding: theme.space[1]
|
|
5393
5393
|
};
|
|
5394
|
-
case
|
|
5394
|
+
case 3: return {
|
|
5395
5395
|
fontSize: theme.typography.fontSizes[6].fontSize,
|
|
5396
5396
|
paddingVertical: theme.space[4],
|
|
5397
5397
|
paddingHorizontal: theme.space[4],
|
|
@@ -5654,13 +5654,13 @@ const TextAreaRoot = React.forwardRef(({ children, ...props }, ref) => {
|
|
|
5654
5654
|
const variantColors = getVariantColors(theme, activeColor, mode, variant, highContrast);
|
|
5655
5655
|
const accentColorScale = getColorScale(theme, activeColor, mode);
|
|
5656
5656
|
const getSizeValues = () => {
|
|
5657
|
-
switch (size) {
|
|
5658
|
-
case
|
|
5657
|
+
switch (Number(size)) {
|
|
5658
|
+
case 1: return {
|
|
5659
5659
|
fontSize: theme.typography.fontSizes[4].fontSize,
|
|
5660
5660
|
padding: theme.space[2],
|
|
5661
5661
|
height: 100
|
|
5662
5662
|
};
|
|
5663
|
-
case
|
|
5663
|
+
case 3: return {
|
|
5664
5664
|
fontSize: theme.typography.fontSizes[6].fontSize,
|
|
5665
5665
|
padding: theme.space[4],
|
|
5666
5666
|
height: 140
|
|
@@ -5824,8 +5824,8 @@ const Checkbox = React.forwardRef(({ checked, defaultChecked = false, onCheckedC
|
|
|
5824
5824
|
getContrast(theme, activeColor, mode, highContrast);
|
|
5825
5825
|
const variantColors = getVariantColors(theme, activeColor, mode, variant, highContrast);
|
|
5826
5826
|
const getSizeValues = () => {
|
|
5827
|
-
switch (size) {
|
|
5828
|
-
case
|
|
5827
|
+
switch (Number(size)) {
|
|
5828
|
+
case 1: return {
|
|
5829
5829
|
boxSize: 20,
|
|
5830
5830
|
iconSize: 11,
|
|
5831
5831
|
fontSize: theme.typography.fontSizes[1].fontSize,
|
|
@@ -5833,7 +5833,7 @@ const Checkbox = React.forwardRef(({ checked, defaultChecked = false, onCheckedC
|
|
|
5833
5833
|
borderWidth: 1,
|
|
5834
5834
|
height: 2.5
|
|
5835
5835
|
};
|
|
5836
|
-
case
|
|
5836
|
+
case 3: return {
|
|
5837
5837
|
boxSize: 28,
|
|
5838
5838
|
iconSize: 16,
|
|
5839
5839
|
fontSize: theme.typography.fontSizes[3].fontSize,
|
|
@@ -6050,15 +6050,15 @@ const CheckboxCardsItem = React.forwardRef(({ value, side: itemSide, disabled: i
|
|
|
6050
6050
|
getAccentColor(theme, mode);
|
|
6051
6051
|
const variantColors = getVariantColors(theme, color || theme.accentColor, mode, variant, highContrast);
|
|
6052
6052
|
const getSizeValues = () => {
|
|
6053
|
-
switch (size) {
|
|
6054
|
-
case
|
|
6053
|
+
switch (Number(size)) {
|
|
6054
|
+
case 1: return {
|
|
6055
6055
|
padding: theme.space[3],
|
|
6056
6056
|
indicatorSize: 18,
|
|
6057
6057
|
innerIndicatorSize: 6,
|
|
6058
6058
|
borderWidth: 1,
|
|
6059
6059
|
checkHeight: 2.2
|
|
6060
6060
|
};
|
|
6061
|
-
case
|
|
6061
|
+
case 3: return {
|
|
6062
6062
|
padding: theme.space[5],
|
|
6063
6063
|
indicatorSize: 26,
|
|
6064
6064
|
innerIndicatorSize: 10,
|
|
@@ -6157,15 +6157,15 @@ const Radio = React.forwardRef(({ defaultChecked, value, selected, onSelect, dis
|
|
|
6157
6157
|
const [isInternallySelected, setIsInternallySelected] = React.useState(defaultChecked ?? false);
|
|
6158
6158
|
const isSelected = selected !== void 0 ? selected : isInternallySelected;
|
|
6159
6159
|
const getSizeValues = () => {
|
|
6160
|
-
switch (size) {
|
|
6161
|
-
case
|
|
6160
|
+
switch (Number(size)) {
|
|
6161
|
+
case 1: return {
|
|
6162
6162
|
boxSize: 18,
|
|
6163
6163
|
innerSize: 6,
|
|
6164
6164
|
iconSize: 8,
|
|
6165
6165
|
fontSize: theme.typography.fontSizes[1].fontSize,
|
|
6166
6166
|
gap: theme.space[1]
|
|
6167
6167
|
};
|
|
6168
|
-
case
|
|
6168
|
+
case 3: return {
|
|
6169
6169
|
boxSize: 28,
|
|
6170
6170
|
innerSize: 12,
|
|
6171
6171
|
iconSize: 16,
|
|
@@ -6388,14 +6388,14 @@ const RadioCardsItem = React.forwardRef(({ value, side: itemSide, disabled: item
|
|
|
6388
6388
|
getAccentColor(theme, mode);
|
|
6389
6389
|
const variantColors = getVariantColors(theme, color || theme.accentColor, mode, variant, highContrast);
|
|
6390
6390
|
const getSizeValues = () => {
|
|
6391
|
-
switch (size) {
|
|
6392
|
-
case
|
|
6391
|
+
switch (Number(size)) {
|
|
6392
|
+
case 1: return {
|
|
6393
6393
|
padding: theme.space[3],
|
|
6394
6394
|
indicatorSize: 18,
|
|
6395
6395
|
innerIndicatorSize: 8,
|
|
6396
6396
|
borderWidth: 1
|
|
6397
6397
|
};
|
|
6398
|
-
case
|
|
6398
|
+
case 3: return {
|
|
6399
6399
|
padding: theme.space[5],
|
|
6400
6400
|
indicatorSize: 26,
|
|
6401
6401
|
innerIndicatorSize: 12,
|
|
@@ -6523,15 +6523,15 @@ const Switch = React.forwardRef(({ defaultChecked, checked, onCheckedChange, dis
|
|
|
6523
6523
|
}).start();
|
|
6524
6524
|
}, [isChecked]);
|
|
6525
6525
|
const getSizeValues = () => {
|
|
6526
|
-
switch (size) {
|
|
6527
|
-
case
|
|
6526
|
+
switch (Number(size)) {
|
|
6527
|
+
case 1: return {
|
|
6528
6528
|
trackWidth: 32,
|
|
6529
6529
|
trackHeight: 20,
|
|
6530
6530
|
thumbSize: 14,
|
|
6531
6531
|
gap: theme.space[1],
|
|
6532
6532
|
fontSize: theme.typography.fontSizes[1].fontSize
|
|
6533
6533
|
};
|
|
6534
|
-
case
|
|
6534
|
+
case 3: return {
|
|
6535
6535
|
trackWidth: 58,
|
|
6536
6536
|
trackHeight: 32,
|
|
6537
6537
|
thumbSize: 26,
|
|
@@ -7574,18 +7574,18 @@ const Slider = React.forwardRef(({ value: controlledValue, defaultValue, onValue
|
|
|
7574
7574
|
};
|
|
7575
7575
|
const thumbAnimations = useRef(values.map((v) => new Animated.Value(getInitialPosition(v)))).current;
|
|
7576
7576
|
const sizeValues = useMemo(() => {
|
|
7577
|
-
switch (size) {
|
|
7578
|
-
case
|
|
7577
|
+
switch (Number(size)) {
|
|
7578
|
+
case 1: return {
|
|
7579
7579
|
trackHeight: 4,
|
|
7580
7580
|
thumbSize: 16,
|
|
7581
7581
|
fontSize: theme.typography.fontSizes[1].fontSize
|
|
7582
7582
|
};
|
|
7583
|
-
case
|
|
7583
|
+
case 3: return {
|
|
7584
7584
|
trackHeight: 8,
|
|
7585
7585
|
thumbSize: 28,
|
|
7586
7586
|
fontSize: theme.typography.fontSizes[3].fontSize
|
|
7587
7587
|
};
|
|
7588
|
-
case
|
|
7588
|
+
case 4: return {
|
|
7589
7589
|
trackHeight: 10,
|
|
7590
7590
|
thumbSize: 34,
|
|
7591
7591
|
fontSize: theme.typography.fontSizes[4].fontSize
|
|
@@ -11917,7 +11917,7 @@ const FancyList = ({ data, renderItem, keyExtractor, style, showDividers = true,
|
|
|
11917
11917
|
const backgroundColor = isDark ? grayAlpha["2"] : grayAlpha["1"];
|
|
11918
11918
|
const defaultKeyExtractor = (item, index) => {
|
|
11919
11919
|
if (keyExtractor) return keyExtractor(item, index);
|
|
11920
|
-
if ("id" in item) return String(item.id);
|
|
11920
|
+
if (item && typeof item === "object" && "id" in item) return String(item.id);
|
|
11921
11921
|
return String(index);
|
|
11922
11922
|
};
|
|
11923
11923
|
const renderListItem = (info) => {
|
|
@@ -12173,11 +12173,9 @@ const PULSE_ANIMATION = {
|
|
|
12173
12173
|
duration: 1e3,
|
|
12174
12174
|
useNativeDriver: true
|
|
12175
12175
|
};
|
|
12176
|
-
const SKELEON_COLORS = {
|
|
12177
|
-
light: "#E5E7EB",
|
|
12178
|
-
dark: "#D1D5DB"
|
|
12179
|
-
};
|
|
12180
12176
|
const Skeleton = React.forwardRef(({ children, loading = true, style, textStyle, width, height, accessibilityLabel = "Loading", testID }, ref) => {
|
|
12177
|
+
const theme = useTheme$1();
|
|
12178
|
+
const grayScale = useThemeMode$1() === "dark" ? theme.colors.gray.dark : theme.colors.gray;
|
|
12181
12179
|
const pulseAnim = useRef(new Animated.Value(0)).current;
|
|
12182
12180
|
useEffect(() => {
|
|
12183
12181
|
const animation = Animated.loop(Animated.sequence([Animated.timing(pulseAnim, {
|
|
@@ -12194,7 +12192,7 @@ const Skeleton = React.forwardRef(({ children, loading = true, style, textStyle,
|
|
|
12194
12192
|
}, [pulseAnim]);
|
|
12195
12193
|
const pulseStyle = { backgroundColor: pulseAnim.interpolate({
|
|
12196
12194
|
inputRange: [0, 1],
|
|
12197
|
-
outputRange: [
|
|
12195
|
+
outputRange: [grayScale[3], grayScale[5]]
|
|
12198
12196
|
}) };
|
|
12199
12197
|
if (!loading) return /* @__PURE__ */ jsx(Fragment, { children });
|
|
12200
12198
|
if (!React.isValidElement(children) && typeof children === "string") return /* @__PURE__ */ jsx(Animated.Text, {
|
|
@@ -12340,12 +12338,12 @@ const TableColumnHeaderCell = React.forwardRef(({ children, width, align = "left
|
|
|
12340
12338
|
const theme = useTheme$1();
|
|
12341
12339
|
const grayScale = useThemeMode$1() === "dark" ? theme.colors.gray.dark : theme.colors.gray;
|
|
12342
12340
|
const getSizePadding = () => {
|
|
12343
|
-
switch (context.size) {
|
|
12344
|
-
case
|
|
12341
|
+
switch (Number(context.size)) {
|
|
12342
|
+
case 1: return {
|
|
12345
12343
|
paddingVertical: theme.space[2],
|
|
12346
12344
|
paddingHorizontal: theme.space[3]
|
|
12347
12345
|
};
|
|
12348
|
-
case
|
|
12346
|
+
case 3: return {
|
|
12349
12347
|
paddingVertical: theme.space[4],
|
|
12350
12348
|
paddingHorizontal: theme.space[5]
|
|
12351
12349
|
};
|
|
@@ -12356,9 +12354,9 @@ const TableColumnHeaderCell = React.forwardRef(({ children, width, align = "left
|
|
|
12356
12354
|
}
|
|
12357
12355
|
};
|
|
12358
12356
|
const getSizeFont = () => {
|
|
12359
|
-
switch (context.size) {
|
|
12360
|
-
case
|
|
12361
|
-
case
|
|
12357
|
+
switch (Number(context.size)) {
|
|
12358
|
+
case 1: return { fontSize: theme.typography.fontSizes[1].fontSize };
|
|
12359
|
+
case 3: return { fontSize: theme.typography.fontSizes[3].fontSize };
|
|
12362
12360
|
default: return { fontSize: theme.typography.fontSizes[2].fontSize };
|
|
12363
12361
|
}
|
|
12364
12362
|
};
|
|
@@ -12395,12 +12393,12 @@ const TableCell = React.forwardRef(({ children, align = "left", style }, ref) =>
|
|
|
12395
12393
|
const theme = useTheme$1();
|
|
12396
12394
|
const grayScale = useThemeMode$1() === "dark" ? theme.colors.gray.dark : theme.colors.gray;
|
|
12397
12395
|
const getSizePadding = () => {
|
|
12398
|
-
switch (context.size) {
|
|
12399
|
-
case
|
|
12396
|
+
switch (Number(context.size)) {
|
|
12397
|
+
case 1: return {
|
|
12400
12398
|
paddingVertical: theme.space[2],
|
|
12401
12399
|
paddingHorizontal: theme.space[3]
|
|
12402
12400
|
};
|
|
12403
|
-
case
|
|
12401
|
+
case 3: return {
|
|
12404
12402
|
paddingVertical: theme.space[4],
|
|
12405
12403
|
paddingHorizontal: theme.space[5]
|
|
12406
12404
|
};
|
|
@@ -12411,9 +12409,9 @@ const TableCell = React.forwardRef(({ children, align = "left", style }, ref) =>
|
|
|
12411
12409
|
}
|
|
12412
12410
|
};
|
|
12413
12411
|
const getSizeFont = () => {
|
|
12414
|
-
switch (context.size) {
|
|
12415
|
-
case
|
|
12416
|
-
case
|
|
12412
|
+
switch (Number(context.size)) {
|
|
12413
|
+
case 1: return { fontSize: theme.typography.fontSizes[1].fontSize };
|
|
12414
|
+
case 3: return { fontSize: theme.typography.fontSizes[3].fontSize };
|
|
12417
12415
|
default: return { fontSize: theme.typography.fontSizes[2].fontSize };
|
|
12418
12416
|
}
|
|
12419
12417
|
};
|
|
@@ -13081,15 +13079,15 @@ const AccordionTrigger = React.forwardRef(({ children, style, icon, hapticFeedba
|
|
|
13081
13079
|
}).start();
|
|
13082
13080
|
}, [open, rotationAnim]);
|
|
13083
13081
|
const getSizeStyles = () => {
|
|
13084
|
-
switch (size) {
|
|
13085
|
-
case
|
|
13082
|
+
switch (Number(size)) {
|
|
13083
|
+
case 1: return {
|
|
13086
13084
|
paddingVertical: theme.space[2],
|
|
13087
13085
|
paddingHorizontal: theme.space[3],
|
|
13088
13086
|
fontSize: theme.typography.fontSizes[1].fontSize,
|
|
13089
13087
|
lineHeight: theme.typography.fontSizes[1].lineHeight,
|
|
13090
13088
|
iconSize: 14
|
|
13091
13089
|
};
|
|
13092
|
-
case
|
|
13090
|
+
case 3: return {
|
|
13093
13091
|
paddingVertical: theme.space[4],
|
|
13094
13092
|
paddingHorizontal: theme.space[5],
|
|
13095
13093
|
fontSize: theme.typography.fontSizes[4].fontSize,
|
|
@@ -13195,9 +13193,9 @@ const AccordionContent = React.forwardRef(({ children, style }, ref) => {
|
|
|
13195
13193
|
const heightAnim = useRef(new Animated.Value(0)).current;
|
|
13196
13194
|
const opacityAnim = useRef(new Animated.Value(0)).current;
|
|
13197
13195
|
const getContentPadding = () => {
|
|
13198
|
-
switch (size) {
|
|
13199
|
-
case
|
|
13200
|
-
case
|
|
13196
|
+
switch (Number(size)) {
|
|
13197
|
+
case 1: return theme.space[2];
|
|
13198
|
+
case 3: return theme.space[5];
|
|
13201
13199
|
default: return theme.space[4];
|
|
13202
13200
|
}
|
|
13203
13201
|
};
|
|
@@ -13324,4 +13322,13 @@ const useResponsive = (breakpoints = defaultBreakpoints) => {
|
|
|
13324
13322
|
};
|
|
13325
13323
|
|
|
13326
13324
|
//#endregion
|
|
13327
|
-
|
|
13325
|
+
//#region src/utils/size.ts
|
|
13326
|
+
/**
|
|
13327
|
+
* Normalize a SizeInput to its canonical numeric form.
|
|
13328
|
+
* Returns the value unchanged when already numeric, the parsed number for
|
|
13329
|
+
* legacy string inputs, or `undefined` when absent.
|
|
13330
|
+
*/
|
|
13331
|
+
const toNumericSize = (size) => size === void 0 ? void 0 : Number(size);
|
|
13332
|
+
|
|
13333
|
+
//#endregion
|
|
13334
|
+
export { AbsoluteCenter, Accordion, AccordionContent, AccordionHeader, AccordionItem, AccordionRoot, AccordionTrigger, RnActivityIndicator as ActivityIndicator, AlertDialogComponent as AlertDialog, AnimatedPressable, AspectRatio, Avatar, Badge, Blockquote, BottomSheet, Box, Button, ButtonIcon, ButtonLabel, Callout, CalloutIcon, CalloutRoot, CalloutText, Card, Center, Checkbox, CheckboxCards, CheckboxCardsItem, CheckboxCardsRoot, CheckboxGroup, Code, Container, ContextMenu, DataList, DataListItem, DataListLabel, DataListRoot, DataListValue, Dialog, DropdownMenu, Em, FancyList, RnFlatList as FlatList, Flex, Grid, HCenter, HStack, Heading, IconButton, RnImage as Image, Inset, Kbd, Link, ManagedPortal, Popover, Portal, PortalProvider, RnPressable as Pressable, RnText as PrimitiveText, Progress, Radio, RadioCards, RadioCardsItem, RadioCardsRoot, RadioGroup, RadioGroupItem, RadioGroupRoot, ScrollArea, RnScrollView as ScrollView, SegmentedControl, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectOverlay, SelectPortal, SelectRoot, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, Skeleton, Slider, Slot, Spacer, Spinner, Stack, Strong, Switch, TabNav, Table, Tabs, TextComponent as Text, TextArea, TextField, RnTextInput as TextInput, ThemeProvider, Toast, TooltipExport as Tooltip, RnTouchableHighlight as TouchableHighlight, RnTouchableOpacity as TouchableOpacity, VCenter, VStack, RnView as View, VisuallyHidden, addColorSchemeListener, amber, amberAlpha, black, blackAlpha, blue, blueAlpha, bronze, bronzeAlpha, brown, brownAlpha, calculatePopoverPosition, createTheme, crimson, crimsonAlpha, cyan, cyanAlpha, defaultTheme, fontFamilies, getAccentAlpha, getAccentAlphaScale, getAccentColor, getAccentContrast, getAccentScale, getAccentTextColor, getActiveColors, getColorAlpha, getColorScale, getColorScheme, getContrast, getDisabledColors, getExtendedAccentScale, getFocusColor, getForegroundColor, getGrayAlpha, getGrayScale, getHighContrastBackground, getHighContrastTextColor, getHoverColors, getRadii, getSelectionColor, getShadow, getShadows, getSpace, getThemeColors, getThemeShadow, getTypography, getVariantColors, gold, goldAlpha, grass, grassAlpha, gray, grayAlpha, green, greenAlpha, indigo, indigoAlpha, iris, irisAlpha, jade, jadeAlpha, lime, limeAlpha, mauve, mauveAlpha, mint, mintAlpha, needsDarkText, olive, oliveAlpha, orange, orangeAlpha, pink, pinkAlpha, plum, plumAlpha, purple, purpleAlpha, radii, radiusFactors, red, redAlpha, ruby, rubyAlpha, sage, sageAlpha, sand, sandAlpha, scalingOptions, shadows, sky, skyAlpha, slate, slateAlpha, space, teal, tealAlpha, toNumericSize, tomato, tomatoAlpha, typography, useAnchorPosition, useDeviceColorScheme, useHaptics, usePortal, useResponsive, useTheme, useThemeActions, useThemeColors, useThemeContext, useThemeMode, useToast, useToastContext, violet, violetAlpha, white, whiteAlpha, yellow, yellowAlpha };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "radix-native-ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"description": "A React Native component library inspired by the Radix Themes design system",
|
|
5
5
|
"main": "dist/index.cjs",
|
|
6
6
|
"module": "dist/index.mjs",
|
|
@@ -8,14 +8,31 @@
|
|
|
8
8
|
"type": "module",
|
|
9
9
|
"exports": {
|
|
10
10
|
".": {
|
|
11
|
-
"
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
"import": {
|
|
12
|
+
"types": "./dist/index.d.mts",
|
|
13
|
+
"default": "./dist/index.mjs"
|
|
14
|
+
},
|
|
15
|
+
"require": {
|
|
16
|
+
"types": "./dist/index.d.cts",
|
|
17
|
+
"default": "./dist/index.cjs"
|
|
18
|
+
}
|
|
14
19
|
}
|
|
15
20
|
},
|
|
16
21
|
"files": [
|
|
17
22
|
"dist"
|
|
18
23
|
],
|
|
24
|
+
"scripts": {
|
|
25
|
+
"build": "tsdown",
|
|
26
|
+
"dev": "tsdown --watch",
|
|
27
|
+
"build:tsdown": "tsdown",
|
|
28
|
+
"dev:tsdown": "tsdown --watch",
|
|
29
|
+
"test": "jest",
|
|
30
|
+
"clean": "rm -rf dist .turbo coverage",
|
|
31
|
+
"yalc:publish": "yalc publish",
|
|
32
|
+
"yalc:push": "yalc push",
|
|
33
|
+
"yalc:watch": "yalc publish --watch",
|
|
34
|
+
"dev:for-demo-app": "pnpm dev:tsdown && pnpm yalc:watch"
|
|
35
|
+
},
|
|
19
36
|
"peerDependencies": {
|
|
20
37
|
"expo": ">=48",
|
|
21
38
|
"expo-haptics": "^55.0.8",
|
|
@@ -23,14 +40,13 @@
|
|
|
23
40
|
"react-native": ">=0.70"
|
|
24
41
|
},
|
|
25
42
|
"devDependencies": {
|
|
26
|
-
"@react-native/babel-preset": "^0.
|
|
27
|
-
"@testing-library/
|
|
28
|
-
"@
|
|
29
|
-
"@types/react": "^19.0.2",
|
|
43
|
+
"@react-native/babel-preset": "^0.81.5",
|
|
44
|
+
"@testing-library/react-native": "^13.3.3",
|
|
45
|
+
"@types/react": "19.1.17",
|
|
30
46
|
"jest": "^29.6.0",
|
|
31
|
-
"react": "^
|
|
32
|
-
"react-native": "^0.
|
|
33
|
-
"react-test-renderer": "^
|
|
47
|
+
"react": "^19.1.0",
|
|
48
|
+
"react-native": "^0.81.5",
|
|
49
|
+
"react-test-renderer": "^19.1.0",
|
|
34
50
|
"tsdown": "^0.20.1",
|
|
35
51
|
"typescript": "^5.1.0"
|
|
36
52
|
},
|
|
@@ -50,17 +66,5 @@
|
|
|
50
66
|
"bugs": {
|
|
51
67
|
"url": "https://github.com/Copy-Labs/radix-native-ui/issues"
|
|
52
68
|
},
|
|
53
|
-
"homepage": "https://github.com/Copy-Labs/radix-native-ui#readme"
|
|
54
|
-
|
|
55
|
-
"build": "tsdown",
|
|
56
|
-
"dev": "tsdown --watch",
|
|
57
|
-
"build:tsdown": "tsdown",
|
|
58
|
-
"dev:tsdown": "tsdown --watch",
|
|
59
|
-
"test": "jest",
|
|
60
|
-
"clean": "rm -rf dist .turbo coverage",
|
|
61
|
-
"yalc:publish": "yalc publish",
|
|
62
|
-
"yalc:push": "yalc push",
|
|
63
|
-
"yalc:watch": "yalc publish --watch",
|
|
64
|
-
"dev:for-demo-app": "pnpm dev:tsdown && pnpm yalc:watch"
|
|
65
|
-
}
|
|
66
|
-
}
|
|
69
|
+
"homepage": "https://github.com/Copy-Labs/radix-native-ui#readme"
|
|
70
|
+
}
|
package/LICENSE
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2023 WorkOS
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|