zkit-ui 1.0.0 → 1.0.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/ui/Button/index.d.ts.map +1 -1
- package/dist/ui/Button/index.js +140 -15
- package/dist/ui/Checkbox/index.d.ts.map +1 -1
- package/dist/ui/Checkbox/index.js +18 -4
- package/dist/ui/Radio/index.d.ts.map +1 -1
- package/dist/ui/Radio/index.js +17 -6
- package/dist/ui/Text/index.d.ts.map +1 -1
- package/dist/ui/Text/index.js +65 -17
- package/package.json +1 -1
- package/src/ui/Button/README.md +4 -0
- package/src/ui/Button/index.tsx +359 -54
- package/src/ui/Checkbox/README.md +4 -1
- package/src/ui/Checkbox/index.tsx +19 -4
- package/src/ui/Radio/README.md +4 -1
- package/src/ui/Radio/index.tsx +23 -10
- package/src/ui/Text/README.md +5 -2
- package/src/ui/Text/index.tsx +107 -32
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/index.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/ui/Button/index.js
CHANGED
|
@@ -538,7 +538,10 @@ function resolveWebCursorStyle(disabled) {
|
|
|
538
538
|
return undefined;
|
|
539
539
|
return { cursor: disabled ? 'not-allowed' : 'pointer' };
|
|
540
540
|
}
|
|
541
|
-
function
|
|
541
|
+
function shouldUseStaticButtonPath({ disabled, loading, pressEffect, }) {
|
|
542
|
+
return !loading && (pressEffect === 'none' || disabled === true);
|
|
543
|
+
}
|
|
544
|
+
function useButtonFrame({ variant = 'solid', tone = 'primary', size = 'md', shape = 'rounded', block = false, disabled = false, loading = false, icon, iconPlacement = 'start', iconOnly = false, color, colors, border, layout, gradient, shadow = 'none', children, textStyle, accessibilityLabel, }) {
|
|
542
545
|
var _a, _b;
|
|
543
546
|
const theme = (0, useTheme_1.useTheme)();
|
|
544
547
|
const scheme = (0, react_native_1.useColorScheme)();
|
|
@@ -551,8 +554,6 @@ function ButtonImpl({ variant = 'solid', tone = 'primary', size = 'md', shape =
|
|
|
551
554
|
const hasGradientBackground = Boolean(variant === 'solid' && gradientCfg && LinearGradientComponent);
|
|
552
555
|
const interactionDisabled = disabled || loading;
|
|
553
556
|
const visualDisabled = disabled;
|
|
554
|
-
const resolvedLoadingMode = iconOnly ? 'overlay' : loadingMode;
|
|
555
|
-
const centeredLoading = resolvedLoadingMode !== 'inline';
|
|
556
557
|
const visualColors = React.useMemo(() => resolveVisualColors({
|
|
557
558
|
accentColor,
|
|
558
559
|
colors,
|
|
@@ -629,12 +630,6 @@ function ButtonImpl({ variant = 'solid', tone = 'primary', size = 'md', shape =
|
|
|
629
630
|
const hasText = resolvedText != null;
|
|
630
631
|
const hasIcon = icon != null;
|
|
631
632
|
const iconSize = (_a = layout === null || layout === void 0 ? void 0 : layout.iconSize) !== null && _a !== void 0 ? _a : metrics.iconSize;
|
|
632
|
-
const loadingSize = React.useMemo(() => resolveLoadingSize({
|
|
633
|
-
iconOnly,
|
|
634
|
-
layout,
|
|
635
|
-
metrics,
|
|
636
|
-
variant,
|
|
637
|
-
}), [iconOnly, layout, metrics, variant]);
|
|
638
633
|
const contentGap = (_b = layout === null || layout === void 0 ? void 0 : layout.gap) !== null && _b !== void 0 ? _b : metrics.gap;
|
|
639
634
|
const iconBaseBoxStyle = React.useMemo(() => resolveIconBoxStyle(hasIcon, iconSize), [hasIcon, iconSize]);
|
|
640
635
|
const iconPlacedBoxStyle = React.useMemo(() => {
|
|
@@ -648,6 +643,114 @@ function ButtonImpl({ variant = 'solid', tone = 'primary', size = 'md', shape =
|
|
|
648
643
|
}, [contentGap, hasIcon, hasText, iconPlacement, iconSize]);
|
|
649
644
|
const inferredAccessibilityLabel = iconOnly && isPrimitiveTextChild(children) ? String(children) : undefined;
|
|
650
645
|
const resolvedAccessibilityLabel = accessibilityLabel !== null && accessibilityLabel !== void 0 ? accessibilityLabel : inferredAccessibilityLabel;
|
|
646
|
+
return {
|
|
647
|
+
accentColor,
|
|
648
|
+
contentGap,
|
|
649
|
+
contentSizeStyle,
|
|
650
|
+
defaultHitSlop,
|
|
651
|
+
gradientCfg,
|
|
652
|
+
hasGradientBackground,
|
|
653
|
+
hasIcon,
|
|
654
|
+
hasText,
|
|
655
|
+
iconBaseBoxStyle,
|
|
656
|
+
iconPlacedBoxStyle,
|
|
657
|
+
iconSize,
|
|
658
|
+
interactionDisabled,
|
|
659
|
+
LinearGradientComponent,
|
|
660
|
+
metrics,
|
|
661
|
+
paddingStyle,
|
|
662
|
+
radiusStyle,
|
|
663
|
+
resolvedAccessibilityLabel,
|
|
664
|
+
resolvedText,
|
|
665
|
+
rootSizeStyle,
|
|
666
|
+
shadowStyle,
|
|
667
|
+
visualColors,
|
|
668
|
+
visualDisabled,
|
|
669
|
+
webCursorStyle,
|
|
670
|
+
borderStyle,
|
|
671
|
+
};
|
|
672
|
+
}
|
|
673
|
+
function ButtonStaticImpl({ variant = 'solid', tone = 'primary', size = 'md', shape = 'rounded', block = false, disabled = false, loading = false, loadingMode: _loadingMode = 'inline', pressEffect: _pressEffect = 'auto', icon, iconPlacement = 'start', iconOnly = false, color, colors, border, layout, gradient, shadow = 'none', children, style, contentStyle, textStyle, accessibilityLabel, accessibilityState, hitSlop, onPress, testID, ...pressableProps }, ref) {
|
|
674
|
+
const frame = useButtonFrame({
|
|
675
|
+
accessibilityLabel,
|
|
676
|
+
block,
|
|
677
|
+
border,
|
|
678
|
+
children,
|
|
679
|
+
color,
|
|
680
|
+
colors,
|
|
681
|
+
disabled,
|
|
682
|
+
gradient,
|
|
683
|
+
icon,
|
|
684
|
+
iconOnly,
|
|
685
|
+
iconPlacement,
|
|
686
|
+
layout,
|
|
687
|
+
loading,
|
|
688
|
+
shadow,
|
|
689
|
+
shape,
|
|
690
|
+
size,
|
|
691
|
+
textStyle,
|
|
692
|
+
tone,
|
|
693
|
+
variant,
|
|
694
|
+
});
|
|
695
|
+
const { borderStyle, contentSizeStyle, defaultHitSlop, gradientCfg, hasIcon, iconBaseBoxStyle, iconPlacedBoxStyle, interactionDisabled, LinearGradientComponent, paddingStyle, radiusStyle, resolvedAccessibilityLabel, resolvedText, rootSizeStyle, shadowStyle, visualColors, visualDisabled, webCursorStyle, } = frame;
|
|
696
|
+
const handlePress = React.useCallback((event) => {
|
|
697
|
+
if (interactionDisabled)
|
|
698
|
+
return;
|
|
699
|
+
onPress === null || onPress === void 0 ? void 0 : onPress(event);
|
|
700
|
+
}, [interactionDisabled, onPress]);
|
|
701
|
+
return ((0, jsx_runtime_1.jsx)(react_native_1.Pressable, { ...pressableProps, ref: ref, accessibilityLabel: resolvedAccessibilityLabel, accessibilityRole: "button", accessibilityState: {
|
|
702
|
+
...accessibilityState,
|
|
703
|
+
busy: Boolean(loading || (accessibilityState === null || accessibilityState === void 0 ? void 0 : accessibilityState.busy)),
|
|
704
|
+
disabled: Boolean(interactionDisabled || (accessibilityState === null || accessibilityState === void 0 ? void 0 : accessibilityState.disabled)),
|
|
705
|
+
}, disabled: interactionDisabled, hitSlop: hitSlop !== null && hitSlop !== void 0 ? hitSlop : defaultHitSlop, onPress: handlePress, style: [
|
|
706
|
+
styles.root,
|
|
707
|
+
rootSizeStyle,
|
|
708
|
+
radiusStyle,
|
|
709
|
+
shadowStyle,
|
|
710
|
+
visualDisabled ? styles.disabledRoot : null,
|
|
711
|
+
webCursorStyle,
|
|
712
|
+
style,
|
|
713
|
+
], testID: testID, children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { pointerEvents: "none", style: [
|
|
714
|
+
styles.content,
|
|
715
|
+
contentSizeStyle,
|
|
716
|
+
paddingStyle,
|
|
717
|
+
radiusStyle,
|
|
718
|
+
borderStyle,
|
|
719
|
+
{ backgroundColor: visualColors.backgroundColor },
|
|
720
|
+
contentStyle,
|
|
721
|
+
], children: [LinearGradientComponent && gradientCfg ? ((0, jsx_runtime_1.jsx)(LinearGradientComponent, { pointerEvents: "none", colors: gradientCfg.colors, start: gradientCfg.start, end: gradientCfg.end, style: [react_native_1.StyleSheet.absoluteFillObject, radiusStyle] })) : null, iconOnly ? ((icon !== null && icon !== void 0 ? icon : resolvedText)) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [icon && iconPlacement === 'start' ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [iconBaseBoxStyle, iconPlacedBoxStyle], children: icon })) : null, resolvedText, icon && iconPlacement === 'end' ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [iconBaseBoxStyle, iconPlacedBoxStyle], children: icon })) : null] }))] }) }));
|
|
722
|
+
}
|
|
723
|
+
function ButtonAnimatedImpl({ variant = 'solid', tone = 'primary', size = 'md', shape = 'rounded', block = false, disabled = false, loading = false, loadingMode = 'inline', pressEffect = 'auto', icon, iconPlacement = 'start', iconOnly = false, color, colors, border, layout, gradient, shadow = 'none', children, style, contentStyle, textStyle, accessibilityLabel, accessibilityState, hitSlop, onPress, onPressIn, onPressOut, testID, ...pressableProps }, ref) {
|
|
724
|
+
const resolvedLoadingMode = iconOnly ? 'overlay' : loadingMode;
|
|
725
|
+
const centeredLoading = resolvedLoadingMode !== 'inline';
|
|
726
|
+
const frame = useButtonFrame({
|
|
727
|
+
accessibilityLabel,
|
|
728
|
+
block,
|
|
729
|
+
border,
|
|
730
|
+
children,
|
|
731
|
+
color,
|
|
732
|
+
colors,
|
|
733
|
+
disabled,
|
|
734
|
+
gradient,
|
|
735
|
+
icon,
|
|
736
|
+
iconOnly,
|
|
737
|
+
iconPlacement,
|
|
738
|
+
layout,
|
|
739
|
+
loading,
|
|
740
|
+
shadow,
|
|
741
|
+
shape,
|
|
742
|
+
size,
|
|
743
|
+
textStyle,
|
|
744
|
+
tone,
|
|
745
|
+
variant,
|
|
746
|
+
});
|
|
747
|
+
const { accentColor, borderStyle, contentGap, contentSizeStyle, defaultHitSlop, gradientCfg, hasGradientBackground, hasIcon, hasText, iconBaseBoxStyle, iconPlacedBoxStyle, iconSize, interactionDisabled, LinearGradientComponent, metrics, paddingStyle, radiusStyle, resolvedAccessibilityLabel, resolvedText, rootSizeStyle, shadowStyle, visualColors, visualDisabled, webCursorStyle, } = frame;
|
|
748
|
+
const loadingSize = React.useMemo(() => resolveLoadingSize({
|
|
749
|
+
iconOnly,
|
|
750
|
+
layout,
|
|
751
|
+
metrics,
|
|
752
|
+
variant,
|
|
753
|
+
}), [iconOnly, layout, metrics, variant]);
|
|
651
754
|
const pressSv = (0, react_native_reanimated_1.useSharedValue)(0);
|
|
652
755
|
const loadingSv = (0, react_native_reanimated_1.useSharedValue)(loading ? 1 : 0);
|
|
653
756
|
const [spinnerMounted, setSpinnerMounted] = React.useState(loading);
|
|
@@ -675,20 +778,29 @@ function ButtonImpl({ variant = 'solid', tone = 'primary', size = 'md', shape =
|
|
|
675
778
|
}
|
|
676
779
|
if (loading) {
|
|
677
780
|
setSpinnerMounted(true);
|
|
781
|
+
loadingSv.value = (0, react_native_reanimated_1.withTiming)(1, LOADING_TIMING);
|
|
782
|
+
return () => {
|
|
783
|
+
if (hideSpinnerTimerRef.current) {
|
|
784
|
+
clearTimeout(hideSpinnerTimerRef.current);
|
|
785
|
+
hideSpinnerTimerRef.current = null;
|
|
786
|
+
}
|
|
787
|
+
};
|
|
678
788
|
}
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
setSpinnerMounted(false);
|
|
683
|
-
}, LOADING_TIMING.duration);
|
|
789
|
+
if (!spinnerMounted) {
|
|
790
|
+
loadingSv.value = 0;
|
|
791
|
+
return undefined;
|
|
684
792
|
}
|
|
793
|
+
loadingSv.value = (0, react_native_reanimated_1.withTiming)(0, LOADING_TIMING);
|
|
794
|
+
hideSpinnerTimerRef.current = setTimeout(() => {
|
|
795
|
+
setSpinnerMounted(false);
|
|
796
|
+
}, LOADING_TIMING.duration);
|
|
685
797
|
return () => {
|
|
686
798
|
if (hideSpinnerTimerRef.current) {
|
|
687
799
|
clearTimeout(hideSpinnerTimerRef.current);
|
|
688
800
|
hideSpinnerTimerRef.current = null;
|
|
689
801
|
}
|
|
690
802
|
};
|
|
691
|
-
}, [loading, loadingSv]);
|
|
803
|
+
}, [loading, loadingSv, spinnerMounted]);
|
|
692
804
|
const rootAnimatedStyle = (0, react_native_reanimated_1.useAnimatedStyle)(() => {
|
|
693
805
|
const baseOpacity = visualDisabled ? DISABLED_OPACITY : 1;
|
|
694
806
|
const scale = pressScaleEnabled
|
|
@@ -789,6 +901,16 @@ function ButtonImpl({ variant = 'solid', tone = 'primary', size = 'md', shape =
|
|
|
789
901
|
overlayAnimatedStyle,
|
|
790
902
|
] }), iconOnly ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: [styles.centerOverlay, centeredSpinnerAnimatedStyle], children: spinnerVisible ? ((0, jsx_runtime_1.jsx)(LoadingSpinner_1.LoadingSpinner, { animating: spinnerVisible, color: visualColors.loadingColor, size: loadingSize })) : null }), (icon !== null && icon !== void 0 ? icon : resolvedText) ? ((0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: contentAnimatedStyle, children: icon !== null && icon !== void 0 ? icon : resolvedText })) : null] })) : centeredLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(react_native_reanimated_1.default.View, { style: [styles.centerContent, contentAnimatedStyle], children: [icon && iconPlacement === 'start' ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [iconBaseBoxStyle, iconPlacedBoxStyle], children: icon })) : null, showContent ? resolvedText : null, icon && iconPlacement === 'end' ? ((0, jsx_runtime_1.jsx)(react_native_1.View, { style: [iconBaseBoxStyle, iconPlacedBoxStyle], children: icon })) : null] }), (0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: [styles.centerOverlay, centeredSpinnerAnimatedStyle], children: spinnerVisible ? ((0, jsx_runtime_1.jsx)(LoadingSpinner_1.LoadingSpinner, { animating: spinnerVisible, color: visualColors.loadingColor, size: loadingSize })) : null })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: [styles.spinnerBox, { height: loadingSize }, inlineSpinnerAnimatedStyle], children: spinnerVisible ? ((0, jsx_runtime_1.jsx)(LoadingSpinner_1.LoadingSpinner, { animating: spinnerVisible, color: visualColors.loadingColor, size: loadingSize })) : null }), icon && iconPlacement === 'start' ? ((0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: [iconBaseBoxStyle, iconAnimatedStyle], children: icon })) : null, resolvedText ? (0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: contentAnimatedStyle, children: resolvedText }) : null, icon && iconPlacement === 'end' ? ((0, jsx_runtime_1.jsx)(react_native_reanimated_1.default.View, { style: [iconBaseBoxStyle, iconAnimatedStyle], children: icon })) : null] }))] }) }));
|
|
791
903
|
}
|
|
904
|
+
const ButtonStaticWithRef = React.forwardRef(ButtonStaticImpl);
|
|
905
|
+
ButtonStaticWithRef.displayName = 'ButtonStatic';
|
|
906
|
+
const ButtonAnimatedWithRef = React.forwardRef(ButtonAnimatedImpl);
|
|
907
|
+
ButtonAnimatedWithRef.displayName = 'ButtonAnimated';
|
|
908
|
+
function ButtonImpl(props, ref) {
|
|
909
|
+
if (shouldUseStaticButtonPath(props)) {
|
|
910
|
+
return (0, jsx_runtime_1.jsx)(ButtonStaticWithRef, { ...props, ref: ref });
|
|
911
|
+
}
|
|
912
|
+
return (0, jsx_runtime_1.jsx)(ButtonAnimatedWithRef, { ...props, ref: ref });
|
|
913
|
+
}
|
|
792
914
|
const ButtonWithRef = React.forwardRef(ButtonImpl);
|
|
793
915
|
ButtonWithRef.displayName = 'Button';
|
|
794
916
|
exports.Button = React.memo(ButtonWithRef);
|
|
@@ -818,6 +940,9 @@ const styles = react_native_1.StyleSheet.create({
|
|
|
818
940
|
textDecorationLine: 'underline',
|
|
819
941
|
},
|
|
820
942
|
root: {},
|
|
943
|
+
disabledRoot: {
|
|
944
|
+
opacity: DISABLED_OPACITY,
|
|
945
|
+
},
|
|
821
946
|
spinnerBox: {
|
|
822
947
|
alignItems: 'center',
|
|
823
948
|
justifyContent: 'center',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/index.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -126,6 +126,7 @@ const SIZE_TOKENS = {
|
|
|
126
126
|
const DISABLED_OPACITY = 0.48;
|
|
127
127
|
const PRESSED_OPACITY = 0.86;
|
|
128
128
|
const PRESSED_SCALE = 0.965;
|
|
129
|
+
const CUSTOM_INDICATOR_ICON_SIZE_RATIO = 0.625;
|
|
129
130
|
const VALUE_TIMING_DURATION = 170;
|
|
130
131
|
const PRESS_IN_DURATION = 90;
|
|
131
132
|
const PRESS_OUT_DURATION = 140;
|
|
@@ -244,21 +245,34 @@ function resolveVariantColors(variant, accent, onAccent, colors, theme, scheme)
|
|
|
244
245
|
function resolveCheckboxMetrics(size, shape, layout) {
|
|
245
246
|
var _a;
|
|
246
247
|
const token = (_a = SIZE_TOKENS[size]) !== null && _a !== void 0 ? _a : SIZE_TOKENS.md;
|
|
247
|
-
const
|
|
248
|
-
const
|
|
248
|
+
const tokenIndicatorSize = (0, zkit_tools_1.wp)(token.indicatorSize);
|
|
249
|
+
const tokenIndicatorIconSize = (0, zkit_tools_1.wp)(token.indicatorIconSize);
|
|
250
|
+
const hasCustomIndicatorSize = isPositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorSize);
|
|
251
|
+
const indicatorSize = resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorSize, tokenIndicatorSize);
|
|
252
|
+
const fallbackIconSize = hasCustomIndicatorSize
|
|
253
|
+
? Math.max((0, zkit_tools_1.wp)(1), Math.round(indicatorSize * CUSTOM_INDICATOR_ICON_SIZE_RATIO))
|
|
254
|
+
: tokenIndicatorIconSize;
|
|
255
|
+
const fallbackRadius = shape === 'circle'
|
|
256
|
+
? Math.round(indicatorSize / 2)
|
|
257
|
+
: shape === 'square'
|
|
258
|
+
? 0
|
|
259
|
+
: (0, zkit_tools_1.wp)(token.indicatorRadius);
|
|
249
260
|
return {
|
|
250
261
|
indicatorSize,
|
|
251
262
|
indicatorRadius: resolveNonNegativeNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorRadius, fallbackRadius),
|
|
252
263
|
indicatorBorderWidth: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorBorderWidth, (0, zkit_tools_1.wp)(token.indicatorBorderWidth)),
|
|
253
|
-
indicatorIconSize: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorIconSize,
|
|
264
|
+
indicatorIconSize: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorIconSize, fallbackIconSize),
|
|
254
265
|
gap: resolveNonNegativeNumber(layout === null || layout === void 0 ? void 0 : layout.gap, (0, zkit_tools_1.wp)(token.gap)),
|
|
255
266
|
minTouchTarget: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.minTouchTarget, (0, zkit_tools_1.wp)(44)),
|
|
256
267
|
focusRingWidth: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.focusRingWidth, (0, zkit_tools_1.wp)(2)),
|
|
257
268
|
focusRingOffset: resolveNonNegativeNumber(layout === null || layout === void 0 ? void 0 : layout.focusRingOffset, (0, zkit_tools_1.wp)(3)),
|
|
258
269
|
};
|
|
259
270
|
}
|
|
271
|
+
function isPositiveNumber(value) {
|
|
272
|
+
return typeof value === 'number' && Number.isFinite(value) && value > 0;
|
|
273
|
+
}
|
|
260
274
|
function resolvePositiveNumber(value, fallback) {
|
|
261
|
-
return
|
|
275
|
+
return isPositiveNumber(value) ? value : fallback;
|
|
262
276
|
}
|
|
263
277
|
function resolveNonNegativeNumber(value, fallback) {
|
|
264
278
|
return typeof value === 'number' && Number.isFinite(value) && value >= 0 ? value : fallback;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Radio/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAIV,SAAS,EACT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,EAGL,SAAS,EAKT,IAAI,EACL,MAAM,cAAc,CAAC;AAgBtB,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;AACzC,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC3C,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC1F,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AACxD,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,KAAK,CAAC;AAClD,MAAM,MAAM,qBAAqB,GAAG,YAAY,GAAG,UAAU,CAAC;AAC9D,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;AAErE,MAAM,MAAM,WAAW,GAAG;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,YAAY,CAAC;IACtB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Radio/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/ui/Radio/index.js
CHANGED
|
@@ -101,6 +101,7 @@ const SIZE_TOKENS = {
|
|
|
101
101
|
const DISABLED_OPACITY = 0.48;
|
|
102
102
|
const PRESSED_OPACITY = 0.86;
|
|
103
103
|
const PRESSED_SCALE = 0.965;
|
|
104
|
+
const CUSTOM_INDICATOR_DOT_SIZE_RATIO = 0.45;
|
|
104
105
|
const VALUE_TIMING_DURATION = 170;
|
|
105
106
|
const PRESS_IN_DURATION = 90;
|
|
106
107
|
const PRESS_OUT_DURATION = 140;
|
|
@@ -213,10 +214,17 @@ function resolveVariantColors(variant, accent, onAccent, colors, theme, scheme)
|
|
|
213
214
|
function resolveRadioMetrics(size, layout) {
|
|
214
215
|
var _a;
|
|
215
216
|
const token = (_a = SIZE_TOKENS[size]) !== null && _a !== void 0 ? _a : SIZE_TOKENS.md;
|
|
216
|
-
const
|
|
217
|
+
const tokenIndicatorSize = (0, zkit_tools_1.wp)(token.indicatorSize);
|
|
218
|
+
const tokenIndicatorDotSize = (0, zkit_tools_1.wp)(token.indicatorDotSize);
|
|
219
|
+
const hasCustomIndicatorSize = isPositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorSize);
|
|
220
|
+
const indicatorSize = resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorSize, tokenIndicatorSize);
|
|
221
|
+
const fallbackDotSize = hasCustomIndicatorSize
|
|
222
|
+
? Math.max((0, zkit_tools_1.wp)(1), Math.round(indicatorSize * CUSTOM_INDICATOR_DOT_SIZE_RATIO))
|
|
223
|
+
: tokenIndicatorDotSize;
|
|
217
224
|
return {
|
|
218
225
|
indicatorSize,
|
|
219
|
-
|
|
226
|
+
indicatorRadius: Math.round(indicatorSize / 2),
|
|
227
|
+
indicatorDotSize: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorDotSize, fallbackDotSize),
|
|
220
228
|
indicatorBorderWidth: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.indicatorBorderWidth, (0, zkit_tools_1.wp)(token.indicatorBorderWidth)),
|
|
221
229
|
gap: resolveNonNegativeNumber(layout === null || layout === void 0 ? void 0 : layout.gap, (0, zkit_tools_1.wp)(token.gap)),
|
|
222
230
|
minTouchTarget: resolvePositiveNumber(layout === null || layout === void 0 ? void 0 : layout.minTouchTarget, (0, zkit_tools_1.wp)(44)),
|
|
@@ -224,8 +232,11 @@ function resolveRadioMetrics(size, layout) {
|
|
|
224
232
|
focusRingOffset: resolveNonNegativeNumber(layout === null || layout === void 0 ? void 0 : layout.focusRingOffset, (0, zkit_tools_1.wp)(3)),
|
|
225
233
|
};
|
|
226
234
|
}
|
|
235
|
+
function isPositiveNumber(value) {
|
|
236
|
+
return typeof value === 'number' && Number.isFinite(value) && value > 0;
|
|
237
|
+
}
|
|
227
238
|
function resolvePositiveNumber(value, fallback) {
|
|
228
|
-
return
|
|
239
|
+
return isPositiveNumber(value) ? value : fallback;
|
|
229
240
|
}
|
|
230
241
|
function resolveNonNegativeNumber(value, fallback) {
|
|
231
242
|
return typeof value === 'number' && Number.isFinite(value) && value >= 0 ? value : fallback;
|
|
@@ -472,9 +483,9 @@ function RadioImpl({ value, checked: checkedProp, defaultChecked = false, onChan
|
|
|
472
483
|
const indicatorFrameStyle = React.useMemo(() => ({
|
|
473
484
|
width: metrics.indicatorSize,
|
|
474
485
|
height: metrics.indicatorSize,
|
|
475
|
-
borderRadius: metrics.
|
|
486
|
+
borderRadius: metrics.indicatorRadius,
|
|
476
487
|
borderWidth: metrics.indicatorBorderWidth,
|
|
477
|
-
}), [metrics.indicatorBorderWidth, metrics.indicatorSize]);
|
|
488
|
+
}), [metrics.indicatorBorderWidth, metrics.indicatorRadius, metrics.indicatorSize]);
|
|
478
489
|
const indicatorNode = showIndicator ? ((0, jsx_runtime_1.jsxs)(react_native_reanimated_1.default.View, { style: [
|
|
479
490
|
styles.indicatorFrame,
|
|
480
491
|
indicatorFrameStyle,
|
|
@@ -488,7 +499,7 @@ function RadioImpl({ value, checked: checkedProp, defaultChecked = false, onChan
|
|
|
488
499
|
bottom: -metrics.focusRingOffset,
|
|
489
500
|
left: -metrics.focusRingOffset,
|
|
490
501
|
right: -metrics.focusRingOffset,
|
|
491
|
-
borderRadius: metrics.
|
|
502
|
+
borderRadius: metrics.indicatorRadius + metrics.focusRingOffset,
|
|
492
503
|
borderWidth: metrics.focusRingWidth,
|
|
493
504
|
borderColor: resolvedColors.focusRing,
|
|
494
505
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Text/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,IAAI,IAAI,MAAM,EAEd,KAAK,SAAS,EACd,KAAK,SAAS,IAAI,WAAW,EAC7B,KAAK,SAAS,EAGf,MAAM,cAAc,CAAC;AAKtB,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAClG,MAAM,MAAM,QAAQ,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AACxF,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC9C,MAAM,MAAM,QAAQ,GAChB,SAAS,GACT,SAAS,GACT,OAAO,GACP,QAAQ,GACR,SAAS,GACT,SAAS,GACT,SAAS,GACT,QAAQ,GACR,MAAM,GACN,UAAU,GACV,SAAS,GACT,WAAW,GACX,aAAa,GACb,SAAS,CAAC;AACd,MAAM,MAAM,UAAU,GAClB,SAAS,GACT,QAAQ,GACR,UAAU,GACV,MAAM,GACN,OAAO,GACP,OAAO,GACP,WAAW,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC;AACzC,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,MAAM,CAAC;AAE5C,KAAK,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,UAAU,GAAG,eAAe,GAAG,eAAe,CAAC,CAAC;AAEnG,MAAM,MAAM,OAAO,GAAG,KAAK,CAAC,YAAY,CAAC,OAAO,MAAM,CAAC,CAAC;AAExD,MAAM,WAAW,SAAU,SAAQ,eAAe;IAChD;;OAEG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IAC/B,SAAS,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAC7C,aAAa,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Text/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAGL,IAAI,IAAI,MAAM,EAEd,KAAK,SAAS,EACd,KAAK,SAAS,IAAI,WAAW,EAC7B,KAAK,SAAS,EAGf,MAAM,cAAc,CAAC;AAKtB,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAClG,MAAM,MAAM,QAAQ,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AACxF,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC9C,MAAM,MAAM,QAAQ,GAChB,SAAS,GACT,SAAS,GACT,OAAO,GACP,QAAQ,GACR,SAAS,GACT,SAAS,GACT,SAAS,GACT,QAAQ,GACR,MAAM,GACN,UAAU,GACV,SAAS,GACT,WAAW,GACX,aAAa,GACb,SAAS,CAAC;AACd,MAAM,MAAM,UAAU,GAClB,SAAS,GACT,QAAQ,GACR,UAAU,GACV,MAAM,GACN,OAAO,GACP,OAAO,GACP,WAAW,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC;AACzC,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,MAAM,CAAC;AAE5C,KAAK,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,UAAU,GAAG,eAAe,GAAG,eAAe,CAAC,CAAC;AAEnG,MAAM,MAAM,OAAO,GAAG,KAAK,CAAC,YAAY,CAAC,OAAO,MAAM,CAAC,CAAC;AAExD,MAAM,WAAW,SAAU,SAAQ,eAAe;IAChD;;OAEG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;IAC/B,SAAS,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAC7C,aAAa,CAAC,EAAE,WAAW,CAAC,eAAe,CAAC,CAAC;IAC7C,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAgcD,eAAO,MAAM,IAAI,qEAAuB,CAAC"}
|
package/dist/ui/Text/index.js
CHANGED
|
@@ -120,6 +120,8 @@ const baseStyles = react_native_1.StyleSheet.create({
|
|
|
120
120
|
padding: 0,
|
|
121
121
|
},
|
|
122
122
|
});
|
|
123
|
+
const DEFAULT_LINE_HEIGHT_RATIO = 1.4;
|
|
124
|
+
const NestedTextContext = React.createContext(false);
|
|
123
125
|
function isFiniteNumber(value) {
|
|
124
126
|
return typeof value === 'number' && Number.isFinite(value);
|
|
125
127
|
}
|
|
@@ -243,21 +245,39 @@ function resolveTypographyToken(size) {
|
|
|
243
245
|
const fontSize = Math.max(0, size);
|
|
244
246
|
return {
|
|
245
247
|
fontSize,
|
|
246
|
-
lineHeight: Math.ceil(fontSize *
|
|
248
|
+
lineHeight: Math.ceil(fontSize * DEFAULT_LINE_HEIGHT_RATIO),
|
|
247
249
|
};
|
|
248
250
|
}
|
|
249
|
-
function
|
|
250
|
-
const
|
|
251
|
-
return
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
251
|
+
function readStyleNumber(style, key) {
|
|
252
|
+
const value = style === null || style === void 0 ? void 0 : style[key];
|
|
253
|
+
return isFiniteNumber(value) ? Math.max(0, value) : undefined;
|
|
254
|
+
}
|
|
255
|
+
function resolveTypographyStyle({ explicitLineHeight, hasExplicitSize, shouldUseVariantDefaults, size, styleFontSize, styleLineHeight, }) {
|
|
256
|
+
const shouldResolveSize = hasExplicitSize || shouldUseVariantDefaults;
|
|
257
|
+
const token = shouldResolveSize ? resolveTypographyToken(size) : undefined;
|
|
258
|
+
const nextStyle = {};
|
|
259
|
+
let hasStyle = false;
|
|
260
|
+
if (token) {
|
|
261
|
+
nextStyle.fontSize = (0, zkit_tools_1.wp)(token.fontSize);
|
|
262
|
+
hasStyle = true;
|
|
263
|
+
}
|
|
264
|
+
if (styleLineHeight != null) {
|
|
265
|
+
return hasStyle ? nextStyle : undefined;
|
|
266
|
+
}
|
|
267
|
+
if (isFiniteNumber(explicitLineHeight)) {
|
|
268
|
+
nextStyle.lineHeight = (0, zkit_tools_1.wp)(Math.max(0, explicitLineHeight));
|
|
269
|
+
hasStyle = true;
|
|
270
|
+
}
|
|
271
|
+
else if (token && styleFontSize == null) {
|
|
272
|
+
nextStyle.lineHeight = (0, zkit_tools_1.wp)(token.lineHeight);
|
|
273
|
+
hasStyle = true;
|
|
274
|
+
}
|
|
275
|
+
return hasStyle ? nextStyle : undefined;
|
|
255
276
|
}
|
|
256
|
-
function normalizeStyleFontWeight(style) {
|
|
277
|
+
function normalizeStyleFontWeight(style, flattenedStyle) {
|
|
257
278
|
if (!style)
|
|
258
279
|
return style;
|
|
259
|
-
const
|
|
260
|
-
const fontWeight = flattened === null || flattened === void 0 ? void 0 : flattened.fontWeight;
|
|
280
|
+
const fontWeight = flattenedStyle === null || flattenedStyle === void 0 ? void 0 : flattenedStyle.fontWeight;
|
|
261
281
|
if (fontWeight == null)
|
|
262
282
|
return style;
|
|
263
283
|
const normalizedFontWeight = normalizeFontWeight(fontWeight);
|
|
@@ -281,27 +301,54 @@ function resolveAccessibilityState(disabled, accessibilityState) {
|
|
|
281
301
|
disabled: true,
|
|
282
302
|
};
|
|
283
303
|
}
|
|
284
|
-
const TextBase = React.forwardRef(function Text({ variant
|
|
304
|
+
const TextBase = React.forwardRef(function Text({ variant: variantProp, size, lineHeight, weight, tone = 'default', color, align, transform, truncate, tabularNumbers = false, disabled = false, style, maxFontSizeMultiplier, allowFontScaling, numberOfLines, ellipsizeMode, accessibilityState, children, ...rest }, ref) {
|
|
285
305
|
var _a;
|
|
306
|
+
const nested = React.useContext(NestedTextContext);
|
|
286
307
|
const theme = (0, useTheme_1.useTheme)();
|
|
287
308
|
const { width: viewportWidth } = (0, react_native_1.useWindowDimensions)();
|
|
309
|
+
const hasExplicitVariant = variantProp != null;
|
|
310
|
+
const shouldUseVariantDefaults = !nested || hasExplicitVariant;
|
|
311
|
+
const variant = variantProp !== null && variantProp !== void 0 ? variantProp : 'body';
|
|
288
312
|
const variantToken = (_a = VARIANT_TOKENS[variant]) !== null && _a !== void 0 ? _a : VARIANT_TOKENS.body;
|
|
313
|
+
const hasExplicitSize = size != null;
|
|
289
314
|
const resolvedSize = size !== null && size !== void 0 ? size : variantToken.size;
|
|
290
|
-
const resolvedWeight = weight !== null && weight !== void 0 ? weight : variantToken.weight;
|
|
315
|
+
const resolvedWeight = weight !== null && weight !== void 0 ? weight : (shouldUseVariantDefaults ? variantToken.weight : undefined);
|
|
291
316
|
const toneColor = resolveToneColor(theme.colors, disabled ? 'disabled' : tone);
|
|
292
317
|
const resolvedColor = resolveColorToken(color, toneColor, theme);
|
|
293
318
|
const resolvedNumberOfLines = resolveNumberOfLines(truncate, numberOfLines);
|
|
294
319
|
const resolvedEllipsizeMode = truncate ? (ellipsizeMode !== null && ellipsizeMode !== void 0 ? ellipsizeMode : 'tail') : ellipsizeMode;
|
|
295
320
|
const resolvedAccessibilityState = React.useMemo(() => resolveAccessibilityState(disabled, accessibilityState), [accessibilityState, disabled]);
|
|
296
|
-
const
|
|
321
|
+
const flattenedStyle = React.useMemo(() => react_native_1.StyleSheet.flatten(style), [style]);
|
|
322
|
+
const styleFontSize = readStyleNumber(flattenedStyle, 'fontSize');
|
|
323
|
+
const styleLineHeight = readStyleNumber(flattenedStyle, 'lineHeight');
|
|
324
|
+
const typographyStyle = React.useMemo(() => resolveTypographyStyle({
|
|
325
|
+
explicitLineHeight: lineHeight,
|
|
326
|
+
hasExplicitSize,
|
|
327
|
+
shouldUseVariantDefaults,
|
|
328
|
+
size: resolvedSize,
|
|
329
|
+
styleFontSize,
|
|
330
|
+
styleLineHeight,
|
|
331
|
+
}), [
|
|
332
|
+
hasExplicitSize,
|
|
333
|
+
lineHeight,
|
|
334
|
+
resolvedSize,
|
|
335
|
+
shouldUseVariantDefaults,
|
|
336
|
+
styleFontSize,
|
|
337
|
+
styleLineHeight,
|
|
338
|
+
viewportWidth,
|
|
339
|
+
]);
|
|
297
340
|
const semanticStyle = React.useMemo(() => {
|
|
298
341
|
const nextStyle = {
|
|
299
|
-
fontFamily: variantToken.fontFamily,
|
|
300
342
|
fontVariant: tabularNumbers ? ['tabular-nums'] : undefined,
|
|
301
|
-
fontWeight: normalizeFontWeight(resolveTextWeight(resolvedWeight)),
|
|
302
343
|
textAlign: align,
|
|
303
344
|
textTransform: transform,
|
|
304
345
|
};
|
|
346
|
+
if (shouldUseVariantDefaults && variantToken.fontFamily !== undefined) {
|
|
347
|
+
nextStyle.fontFamily = variantToken.fontFamily;
|
|
348
|
+
}
|
|
349
|
+
if (resolvedWeight !== undefined) {
|
|
350
|
+
nextStyle.fontWeight = normalizeFontWeight(resolveTextWeight(resolvedWeight));
|
|
351
|
+
}
|
|
305
352
|
if (resolvedColor !== undefined) {
|
|
306
353
|
nextStyle.color = resolvedColor;
|
|
307
354
|
}
|
|
@@ -310,15 +357,16 @@ const TextBase = React.forwardRef(function Text({ variant = 'body', size, lineHe
|
|
|
310
357
|
align,
|
|
311
358
|
resolvedColor,
|
|
312
359
|
resolvedWeight,
|
|
360
|
+
shouldUseVariantDefaults,
|
|
313
361
|
tabularNumbers,
|
|
314
362
|
transform,
|
|
315
363
|
variantToken.fontFamily,
|
|
316
364
|
]);
|
|
317
|
-
const normalizedStyle = React.useMemo(() => normalizeStyleFontWeight(style), [style]);
|
|
365
|
+
const normalizedStyle = React.useMemo(() => normalizeStyleFontWeight(style, flattenedStyle), [flattenedStyle, style]);
|
|
318
366
|
const finalStyle = React.useMemo(() => normalizedStyle
|
|
319
367
|
? [baseStyles.root, typographyStyle, semanticStyle, normalizedStyle]
|
|
320
368
|
: [baseStyles.root, typographyStyle, semanticStyle], [normalizedStyle, semanticStyle, typographyStyle]);
|
|
321
|
-
return ((0, jsx_runtime_1.jsx)(react_native_1.Text, { ref: ref, ...rest, accessibilityState: resolvedAccessibilityState, allowFontScaling: allowFontScaling, disabled: disabled, ellipsizeMode: resolvedEllipsizeMode, maxFontSizeMultiplier: allowFontScaling === false ? maxFontSizeMultiplier : (maxFontSizeMultiplier !== null && maxFontSizeMultiplier !== void 0 ? maxFontSizeMultiplier : (0, zkit_tools_1.getMaxFontSizeMultiplier)()), numberOfLines: resolvedNumberOfLines, style: finalStyle, children: children }));
|
|
369
|
+
return ((0, jsx_runtime_1.jsx)(NestedTextContext.Provider, { value: true, children: (0, jsx_runtime_1.jsx)(react_native_1.Text, { ref: ref, ...rest, accessibilityState: resolvedAccessibilityState, allowFontScaling: allowFontScaling, disabled: disabled, ellipsizeMode: resolvedEllipsizeMode, maxFontSizeMultiplier: allowFontScaling === false ? maxFontSizeMultiplier : (maxFontSizeMultiplier !== null && maxFontSizeMultiplier !== void 0 ? maxFontSizeMultiplier : (0, zkit_tools_1.getMaxFontSizeMultiplier)()), numberOfLines: resolvedNumberOfLines, style: finalStyle, children: children }) }));
|
|
322
370
|
});
|
|
323
371
|
TextBase.displayName = 'Text';
|
|
324
372
|
exports.Text = React.memo(TextBase);
|
package/package.json
CHANGED
package/src/ui/Button/README.md
CHANGED
|
@@ -156,6 +156,10 @@ export function Demo() {
|
|
|
156
156
|
|
|
157
157
|
渐变依赖 `expo-linear-gradient`,缺失时会使用第一段颜色作为稳定兜底。按压、loading 显隐与内容切换都走 Reanimated,减少 JS 抖动对关键帧的影响。
|
|
158
158
|
|
|
159
|
+
## 列表高频渲染
|
|
160
|
+
|
|
161
|
+
在 `FlatList` / `FlashList` cell 中批量渲染普通静态按钮时,建议显式使用 `pressEffect="none"`。非 loading 场景会走轻量 `Pressable + View` 路径,避免为每个 cell 挂载 Reanimated press/loading 动画结构。
|
|
162
|
+
|
|
159
163
|
## 常用 Props
|
|
160
164
|
|
|
161
165
|
- `variant?: 'solid' | 'soft' | 'outline' | 'ghost' | 'link'`
|