taro-uno-ui 0.9.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/README.md +21 -0
- package/dist/js/{index-DffLRSro.js → index-CDFsvu80.js} +15369 -10741
- package/dist/js/index-CDFsvu80.js.map +1 -0
- package/dist/js/index-DFdcksbe.js.map +1 -1
- package/dist/js/index-DXRIkWX1.js.map +1 -1
- package/dist/js/{index-6NJ3A1Dn.js → index-JffnTUrv.js} +15430 -10801
- package/dist/js/index-JffnTUrv.js.map +1 -0
- package/dist/utils/http/request.d.ts +280 -0
- package/package.json +14 -10
- package/src/components/basic/Button/Button.tsx +53 -13
- package/src/components/basic/Button/Button.types.ts +45 -9
- package/src/components/basic/Divider/Divider.tsx +60 -29
- package/src/components/basic/Icon/Icon.data.ts +474 -0
- package/src/components/basic/Icon/Icon.test.tsx +2 -2
- package/src/components/basic/Icon/Icon.tsx +48 -35
- package/src/components/basic/Icon/IconManager.ts +229 -0
- package/src/components/basic/Text/Text.styles.ts +3 -3
- package/src/components/basic/Text/Text.types.ts +14 -4
- package/src/components/basic/Typography/Typography.styles.ts +10 -9
- package/src/components/basic/Typography/Typography.tsx +15 -13
- package/src/components/basic/Typography/Typography.types.ts +41 -41
- package/src/components/basic/Typography/index.tsx +1 -1
- package/src/components/basic/Video/Video.styles.ts +777 -0
- package/src/components/basic/Video/Video.test.tsx +490 -0
- package/src/components/basic/Video/Video.tsx +1468 -0
- package/src/components/basic/Video/Video.types.ts +500 -0
- package/src/components/basic/Video/index.tsx +26 -0
- package/src/components/basic/index.tsx +13 -15
- package/src/components/common/ErrorBoundary.tsx +1 -1
- package/src/components/common/LazyComponent.tsx +9 -8
- package/src/components/common/SecurityProvider.tsx +2 -14
- package/src/components/common/ThemeProvider.tsx +43 -56
- package/src/components/common/VirtualList.tsx +187 -205
- package/src/components/common/index.tsx +25 -0
- package/src/components/display/Avatar/Avatar.styles.ts +1 -1
- package/src/components/display/Avatar/Avatar.tsx +6 -19
- package/src/components/display/Avatar/Avatar.types.ts +1 -1
- package/src/components/display/Avatar/index.ts +1 -1
- package/src/components/display/Badge/Badge.tsx +3 -16
- package/src/components/display/Badge/Badge.types.ts +1 -1
- package/src/components/display/Badge/index.ts +1 -1
- package/src/components/display/Calendar/Calendar.styles.ts +36 -36
- package/src/components/display/Calendar/Calendar.test.tsx +27 -15
- package/src/components/display/Calendar/Calendar.tsx +56 -35
- package/src/components/display/Calendar/Calendar.types.ts +1 -1
- package/src/components/display/Calendar/index.ts +1 -1
- package/src/components/display/Card/Card.styles.ts +2 -2
- package/src/components/display/Card/Card.test.tsx +6 -4
- package/src/components/display/Card/Card.tsx +1 -1
- package/src/components/display/Card/Card.types.ts +4 -4
- package/src/components/display/Card/index.ts +1 -1
- package/src/components/display/Carousel/Carousel.styles.ts +31 -31
- package/src/components/display/Carousel/Carousel.tsx +34 -39
- package/src/components/display/Carousel/Carousel.types.ts +1 -1
- package/src/components/display/Carousel/index.ts +1 -1
- package/src/components/display/List/List.styles.ts +3 -3
- package/src/components/display/List/List.tsx +0 -1
- package/src/components/display/List/index.ts +1 -1
- package/src/components/display/Rate/Rate.styles.ts +5 -17
- package/src/components/display/Rate/Rate.tsx +6 -14
- package/src/components/display/Rate/Rate.types.ts +4 -3
- package/src/components/display/Rate/index.ts +3 -11
- package/src/components/display/Table/Table.test.tsx +2 -0
- package/src/components/display/Table/Table.tsx +3 -7
- package/src/components/display/Table/Table.types.ts +3 -2
- package/src/components/display/Tag/Tag.styles.ts +31 -31
- package/src/components/display/Tag/Tag.tsx +9 -26
- package/src/components/display/Tag/Tag.types.ts +1 -1
- package/src/components/display/Tag/index.ts +1 -1
- package/src/components/display/Timeline/Timeline.styles.ts +32 -32
- package/src/components/display/Timeline/Timeline.tsx +23 -42
- package/src/components/display/Timeline/Timeline.types.ts +1 -1
- package/src/components/display/Timeline/index.ts +1 -1
- package/src/components/display/index.tsx +33 -29
- package/src/components/feedback/Loading/Loading.tsx +6 -1
- package/src/components/feedback/Loading/index.ts +2 -5
- package/src/components/feedback/Message/Message.styles.ts +3 -3
- package/src/components/feedback/Message/index.ts +2 -5
- package/src/components/feedback/Modal/Modal.styles.ts +1 -1
- package/src/components/feedback/Modal/Modal.tsx +9 -31
- package/src/components/feedback/Modal/Modal.types.ts +12 -2
- package/src/components/feedback/Notification/Notification.styles.ts +49 -39
- package/src/components/feedback/Notification/Notification.test.tsx +1 -1
- package/src/components/feedback/Notification/Notification.tsx +97 -120
- package/src/components/feedback/Notification/Notification.types.ts +11 -8
- package/src/components/feedback/Notification/NotificationManager.tsx +135 -106
- package/src/components/feedback/Notification/index.ts +10 -3
- package/src/components/feedback/Notification/index.tsx +16 -26
- package/src/components/feedback/Progress/Progress.styles.ts +23 -14
- package/src/components/feedback/Progress/Progress.tsx +93 -113
- package/src/components/feedback/Progress/Progress.types.ts +1 -1
- package/src/components/feedback/Progress/index.ts +1 -1
- package/src/components/feedback/Progress/utils/animation.ts +12 -23
- package/src/components/feedback/Progress/utils/index.ts +2 -2
- package/src/components/feedback/Progress/utils/progress-calculator.ts +14 -32
- package/src/components/feedback/Result/Result.styles.ts +29 -29
- package/src/components/feedback/Result/Result.tsx +8 -20
- package/src/components/feedback/Result/Result.types.ts +7 -7
- package/src/components/feedback/Result/index.tsx +1 -1
- package/src/components/feedback/Toast/Toast.styles.ts +1 -1
- package/src/components/feedback/Toast/Toast.tsx +25 -13
- package/src/components/feedback/Tooltip/Tooltip.examples.tsx +21 -44
- package/src/components/feedback/Tooltip/Tooltip.styles.ts +16 -22
- package/src/components/feedback/Tooltip/Tooltip.test.tsx +1 -1
- package/src/components/feedback/Tooltip/Tooltip.tsx +65 -46
- package/src/components/feedback/Tooltip/Tooltip.types.ts +14 -20
- package/src/components/feedback/Tooltip/index.ts +1 -1
- package/src/components/feedback/Tooltip/index.tsx +12 -24
- package/src/components/feedback/index.tsx +54 -42
- package/src/components/form/Cascader/Cascader.styles.ts +2 -2
- package/src/components/form/Cascader/Cascader.tsx +84 -88
- package/src/components/form/Cascader/Cascader.types.ts +49 -50
- package/src/components/form/Cascader/hooks/useCascaderFieldNames.ts +11 -8
- package/src/components/form/Cascader/hooks/useCascaderOptions.ts +73 -55
- package/src/components/form/Cascader/hooks/useCascaderState.ts +31 -25
- package/src/components/form/Cascader/index.ts +1 -1
- package/src/components/form/Cascader/utils/formatDisplayValue.ts +4 -4
- package/src/components/form/Checkbox/Checkbox.styles.ts +83 -84
- package/src/components/form/Checkbox/Checkbox.tsx +2 -9
- package/src/components/form/Checkbox/CheckboxGroup.tsx +7 -7
- package/src/components/form/DatePicker/DatePicker.test.tsx +1 -1
- package/src/components/form/DatePicker/DatePicker.tsx +91 -75
- package/src/components/form/DatePicker/DatePicker.types.ts +4 -1
- package/src/components/form/Form/Form.tsx +66 -504
- package/src/components/form/Form/Form.types.ts +16 -1
- package/src/components/form/Form/useFormLogic.ts +497 -0
- package/src/components/form/Input/Input.styles.ts +8 -1
- package/src/components/form/Input/Input.tsx +55 -291
- package/src/components/form/Input/Input.types.ts +13 -1
- package/src/components/form/Input/useInputLogic.test.ts +82 -0
- package/src/components/form/Input/useInputLogic.ts +260 -0
- package/src/components/form/InputNumber/InputNumber.styles.ts +76 -25
- package/src/components/form/InputNumber/InputNumber.tsx +53 -21
- package/src/components/form/InputNumber/InputNumber.types.ts +21 -3
- package/src/components/form/InputNumber/components/InputNumberClearButton.tsx +3 -11
- package/src/components/form/InputNumber/components/InputNumberControls.tsx +3 -12
- package/src/components/form/InputNumber/hooks/index.ts +1 -1
- package/src/components/form/InputNumber/hooks/useInputNumberState.ts +7 -9
- package/src/components/form/InputNumber/hooks/useInputNumberValidation.ts +18 -17
- package/src/components/form/InputNumber/index.ts +7 -7
- package/src/components/form/Radio/Radio.styles.ts +1 -8
- package/src/components/form/Radio/Radio.tsx +3 -9
- package/src/components/form/Radio/Radio.types.ts +5 -1
- package/src/components/form/Select/Select.styles.ts +5 -1
- package/src/components/form/Select/Select.tsx +15 -15
- package/src/components/form/Select/Select.types.ts +2 -1
- package/src/components/form/Slider/Slider.styles.ts +13 -13
- package/src/components/form/Slider/Slider.tsx +19 -33
- package/src/components/form/Slider/Slider.types.ts +14 -12
- package/src/components/form/Slider/index.tsx +2 -9
- package/src/components/form/Switch/Switch.styles.ts +1 -7
- package/src/components/form/Switch/Switch.tsx +7 -13
- package/src/components/form/Textarea/Textarea.styles.ts +4 -4
- package/src/components/form/Textarea/Textarea.tsx +7 -1
- package/src/components/form/Textarea/Textarea.types.ts +4 -1
- package/src/components/form/TimePicker/TimePicker.styles.ts +8 -12
- package/src/components/form/TimePicker/TimePicker.tsx +122 -100
- package/src/components/form/TimePicker/TimePicker.types.ts +2 -2
- package/src/components/form/TimePicker/index.ts +1 -1
- package/src/components/form/Transfer/Transfer.styles.ts +3 -15
- package/src/components/form/Transfer/Transfer.tsx +146 -134
- package/src/components/form/Transfer/Transfer.types.ts +34 -26
- package/src/components/form/Transfer/components/TransferItem.tsx +55 -62
- package/src/components/form/Transfer/components/TransferList.tsx +212 -199
- package/src/components/form/Transfer/components/TransferOperations.tsx +52 -55
- package/src/components/form/Transfer/components/TransferPagination.tsx +115 -111
- package/src/components/form/Transfer/components/TransferSearch.tsx +52 -55
- package/src/components/form/Transfer/hooks/useTransferData.ts +91 -81
- package/src/components/form/Transfer/hooks/useTransferState.ts +22 -16
- package/src/components/form/Transfer/index.ts +2 -8
- package/src/components/form/Upload/Upload.styles.ts +21 -21
- package/src/components/form/Upload/Upload.tsx +189 -142
- package/src/components/form/Upload/Upload.types.ts +31 -31
- package/src/components/form/Upload/index.tsx +1 -1
- package/src/components/form/index.tsx +60 -29
- package/src/components/index.tsx +0 -1
- package/src/components/layout/Affix/Affix.styles.ts +16 -11
- package/src/components/layout/Affix/Affix.tsx +67 -75
- package/src/components/layout/Affix/Affix.types.ts +18 -18
- package/src/components/layout/Affix/index.tsx +1 -1
- package/src/components/layout/Col/Col.styles.ts +17 -17
- package/src/components/layout/Col/Col.test.tsx +7 -5
- package/src/components/layout/Col/Col.tsx +3 -21
- package/src/components/layout/Col/Col.types.ts +1 -1
- package/src/components/layout/Container/Container.styles.ts +3 -1
- package/src/components/layout/Container/Container.tsx +2 -11
- package/src/components/layout/Grid/Grid.tsx +3 -53
- package/src/components/layout/Layout/Content.tsx +24 -32
- package/src/components/layout/Layout/Footer.tsx +24 -32
- package/src/components/layout/Layout/Header.tsx +24 -32
- package/src/components/layout/Layout/Layout.styles.ts +17 -17
- package/src/components/layout/Layout/Layout.tsx +14 -25
- package/src/components/layout/Layout/Layout.types.ts +29 -29
- package/src/components/layout/Layout/Sider.tsx +44 -56
- package/src/components/layout/Layout/index.tsx +16 -2
- package/src/components/layout/Row/Row.tsx +15 -43
- package/src/components/layout/Space/Space.tsx +3 -11
- package/src/components/layout/Space/Space.types.ts +1 -1
- package/src/components/layout/index.tsx +29 -19
- package/src/components/navigation/Menu/Menu.constants.ts +69 -0
- package/src/components/navigation/Menu/Menu.stories.tsx +107 -0
- package/src/components/navigation/Menu/Menu.styles.ts +25 -37
- package/src/components/navigation/Menu/Menu.tsx +8 -11
- package/src/components/navigation/Menu/Menu.types.ts +2 -2
- package/src/components/navigation/Menu/Menu.utils.ts +17 -17
- package/src/components/navigation/Menu/MenuItem.tsx +9 -11
- package/src/components/navigation/Menu/SubMenu.tsx +8 -6
- package/src/components/navigation/Menu/index.tsx +4 -69
- package/src/components/navigation/NavBar/NavBar.styles.ts +1 -1
- package/src/components/navigation/NavBar/NavBar.tsx +7 -10
- package/src/components/navigation/NavBar/NavBar.types.ts +3 -3
- package/src/components/navigation/NavBar/index.tsx +1 -1
- package/src/components/navigation/Pagination/Pagination.test.tsx +2 -3
- package/src/components/navigation/Pagination/Pagination.tsx +3 -3
- package/src/components/navigation/Pagination/Pagination.types.ts +3 -2
- package/src/components/navigation/Pagination/index.ts +9 -3
- package/src/components/navigation/Steps/Step.tsx +24 -44
- package/src/components/navigation/Steps/Steps.styles.ts +28 -13
- package/src/components/navigation/Steps/Steps.test.tsx +2 -0
- package/src/components/navigation/Steps/Steps.tsx +88 -89
- package/src/components/navigation/Steps/Steps.types.ts +30 -30
- package/src/components/navigation/Steps/index.tsx +1 -1
- package/src/components/navigation/Tabs/Tabs.test.tsx +3 -2
- package/src/components/navigation/Tabs/Tabs.types.ts +4 -3
- package/src/components/navigation/index.tsx +21 -16
- package/src/constants/index.ts +1 -1
- package/src/hooks/index.ts +52 -102
- package/src/hooks/types.ts +4 -5
- package/src/hooks/useAsync.ts +46 -47
- package/src/hooks/useClickOutside.ts +52 -0
- package/src/hooks/useCounter.ts +87 -0
- package/src/hooks/useDebounce.ts +150 -0
- package/src/hooks/useDeepCompareEffect.ts +88 -0
- package/src/hooks/useEventListener.ts +77 -0
- package/src/hooks/useMediaQuery.ts +75 -0
- package/src/hooks/useMutation.ts +233 -0
- package/src/hooks/usePerformance.ts +1 -64
- package/src/hooks/usePlatform.ts +3 -1
- package/src/hooks/usePrevious.ts +25 -0
- package/src/hooks/useRequest.ts +12 -7
- package/src/hooks/useStateManagement.ts +1 -1
- package/src/hooks/useStorage.ts +169 -0
- package/src/hooks/useStyle.ts +8 -2
- package/src/hooks/useToggle.ts +54 -0
- package/src/index.ts +34 -9
- package/src/theme/ThemeProvider.tsx +3 -7
- package/src/theme/ThemeProvider.types.ts +1 -1
- package/src/theme/defaults.ts +1 -1
- package/src/theme/design-system.ts +2 -2
- package/src/theme/design-tokens.ts +85 -99
- package/src/theme/generated/dark-theme.scss +1 -1
- package/src/theme/generated/tokens.scss +82 -18
- package/src/theme/index.ts +8 -29
- package/src/theme/responsive.tsx +36 -34
- package/src/theme/styles.ts +1 -1
- package/src/theme/useThemeUtils.ts +43 -43
- package/src/theme/utils.ts +32 -32
- package/src/theme/variables.ts +70 -51
- package/src/types/accessibility.ts +36 -37
- package/src/types/button.ts +25 -27
- package/src/types/component-props.ts +6 -1
- package/src/types/glob.d.ts +4 -0
- package/src/types/index.ts +2 -2
- package/src/types/standardized-components.ts +9 -3
- package/src/types/utils.ts +13 -23
- package/src/utils/__tests__/responsiveUtils.test.ts +5 -4
- package/src/utils/abort-controller.ts +48 -0
- package/src/utils/cache.ts +2 -6
- package/src/utils/createNamespace.ts +4 -4
- package/src/utils/environment.ts +26 -6
- package/src/utils/error-handler.ts +2 -2
- package/src/utils/errorLogger.ts +16 -20
- package/src/utils/formatUtils.ts +38 -70
- package/src/utils/http/error-codes.ts +314 -0
- package/src/utils/http/http-client.test.ts +63 -0
- package/src/utils/{network → http}/http-client.ts +45 -35
- package/src/utils/http/request-cache.ts +127 -0
- package/src/utils/http/request.ts +954 -0
- package/src/utils/http/taro-adapter.test.ts +74 -0
- package/src/utils/http/taro-adapter.ts +24 -0
- package/src/utils/http/types.ts +414 -0
- package/src/utils/http/web-adapter.ts +33 -0
- package/src/utils/index.ts +5 -8
- package/src/utils/inputValidator.ts +17 -14
- package/src/utils/performance/performance.ts +60 -71
- package/src/utils/responsiveUtils.ts +7 -16
- package/src/utils/rtl-support.ts +29 -19
- package/src/utils/security/api-security.ts +47 -39
- package/src/utils/securityHeaders.ts +61 -67
- package/src/utils/typeHelpers.ts +10 -10
- package/src/utils/types/dataProcessing.ts +93 -92
- package/src/utils/types/typeHelpers.ts +31 -21
- package/src/utils/xssProtection.ts +96 -48
- package/dist/js/index-6NJ3A1Dn.js.map +0 -1
- package/dist/js/index-DffLRSro.js.map +0 -1
- package/src/components/form/Input/Input.enhanced.tsx +0 -732
- package/src/components/navigation/Menu/__tests__/Menu.test.tsx +0 -687
- package/src/components/navigation/Tree/Tree.styles.ts +0 -553
- package/src/components/navigation/Tree/Tree.test.basic.tsx +0 -7
- package/src/components/navigation/Tree/Tree.test.functional.tsx +0 -496
- package/src/components/navigation/Tree/Tree.test.import.check.tsx +0 -6
- package/src/components/navigation/Tree/Tree.test.import.tsx +0 -6
- package/src/components/navigation/Tree/Tree.test.minimal.tsx +0 -5
- package/src/components/navigation/Tree/Tree.test.simple.tsx +0 -30
- package/src/components/navigation/Tree/Tree.test.tsx +0 -908
- package/src/components/navigation/Tree/Tree.test.working.tsx +0 -673
- package/src/components/navigation/Tree/Tree.tsx +0 -600
- package/src/components/navigation/Tree/Tree.types.ts +0 -909
- package/src/components/navigation/Tree/Tree.utils.ts +0 -452
- package/src/components/navigation/Tree/index.ts +0 -33
- package/src/components/navigation/Tree/index.tsx +0 -23
- package/src/utils/network/http-client.test.ts +0 -18
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { useState, useEffect, useCallback, useRef } from 'react';
|
|
2
2
|
import type { ITouchEvent } from '@tarojs/components';
|
|
3
|
-
import type {
|
|
4
|
-
InputNumberStatus,
|
|
5
|
-
InputNumberValidationResult,
|
|
3
|
+
import type {
|
|
4
|
+
InputNumberStatus,
|
|
5
|
+
InputNumberValidationResult,
|
|
6
6
|
InputNumberFormatConfig,
|
|
7
|
-
InputNumberRule
|
|
7
|
+
InputNumberRule,
|
|
8
8
|
} from '../InputNumber.types';
|
|
9
9
|
import { inputNumberStyles } from '../InputNumber.styles';
|
|
10
10
|
|
|
@@ -45,9 +45,7 @@ export interface UseInputNumberStateReturn {
|
|
|
45
45
|
setInternalReadonly: (readonly: boolean) => void;
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
-
export function useInputNumberState(
|
|
49
|
-
params: UseInputNumberStateParams
|
|
50
|
-
): UseInputNumberStateReturn {
|
|
48
|
+
export function useInputNumberState(params: UseInputNumberStateParams): UseInputNumberStateReturn {
|
|
51
49
|
const {
|
|
52
50
|
value: controlledValue,
|
|
53
51
|
defaultValue = null,
|
|
@@ -247,7 +245,7 @@ export function useInputNumberState(
|
|
|
247
245
|
async (text: string, event: ITouchEvent) => {
|
|
248
246
|
const parsedValue = inputNumberStyles['parseValue'](text, formatConfig);
|
|
249
247
|
const clampedValue = parsedValue !== null ? inputNumberStyles['clampValue'](parsedValue, min, max) : null;
|
|
250
|
-
|
|
248
|
+
|
|
251
249
|
if (clampedValue !== null) {
|
|
252
250
|
const roundedValue = inputNumberStyles['roundValue'](clampedValue, precision);
|
|
253
251
|
await handleValueChange(roundedValue, event);
|
|
@@ -312,4 +310,4 @@ export function useInputNumberState(
|
|
|
312
310
|
setInternalDisabled,
|
|
313
311
|
setInternalReadonly,
|
|
314
312
|
};
|
|
315
|
-
}
|
|
313
|
+
}
|
|
@@ -8,12 +8,7 @@ export interface UseInputNumberValidationParams {
|
|
|
8
8
|
max?: number;
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
export function useInputNumberValidation({
|
|
12
|
-
rules,
|
|
13
|
-
validator,
|
|
14
|
-
min,
|
|
15
|
-
max,
|
|
16
|
-
}: UseInputNumberValidationParams) {
|
|
11
|
+
export function useInputNumberValidation({ rules, validator, min, max }: UseInputNumberValidationParams) {
|
|
17
12
|
const validateInput = useCallback(
|
|
18
13
|
async (inputValue: number | null): Promise<InputNumberValidationResult> => {
|
|
19
14
|
if (!rules && !validator && inputValue === null) {
|
|
@@ -127,21 +122,27 @@ export function useInputNumberValidation({
|
|
|
127
122
|
[rules, validator, min, max],
|
|
128
123
|
);
|
|
129
124
|
|
|
130
|
-
const validateRequired = useCallback(
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
125
|
+
const validateRequired = useCallback(
|
|
126
|
+
(inputValue: number | null): boolean => {
|
|
127
|
+
if (!rules?.some((rule: any) => rule.required)) return true;
|
|
128
|
+
return inputValue !== null;
|
|
129
|
+
},
|
|
130
|
+
[rules],
|
|
131
|
+
);
|
|
134
132
|
|
|
135
|
-
const validateRange = useCallback(
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
133
|
+
const validateRange = useCallback(
|
|
134
|
+
(inputValue: number | null): boolean => {
|
|
135
|
+
if (inputValue === null) return true;
|
|
136
|
+
if (min !== undefined && inputValue < min) return false;
|
|
137
|
+
if (max !== undefined && inputValue > max) return false;
|
|
138
|
+
return true;
|
|
139
|
+
},
|
|
140
|
+
[min, max],
|
|
141
|
+
);
|
|
141
142
|
|
|
142
143
|
return {
|
|
143
144
|
validateInput,
|
|
144
145
|
validateRequired,
|
|
145
146
|
validateRange,
|
|
146
147
|
};
|
|
147
|
-
}
|
|
148
|
+
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export { InputNumber } from './InputNumber';
|
|
2
|
-
export type {
|
|
3
|
-
InputNumberProps,
|
|
4
|
-
InputNumberRef,
|
|
5
|
-
InputNumberSize,
|
|
6
|
-
InputNumberVariant,
|
|
2
|
+
export type {
|
|
3
|
+
InputNumberProps,
|
|
4
|
+
InputNumberRef,
|
|
5
|
+
InputNumberSize,
|
|
6
|
+
InputNumberVariant,
|
|
7
7
|
InputNumberStatus,
|
|
8
8
|
InputNumberControlsPosition,
|
|
9
9
|
InputNumberFormatter,
|
|
@@ -16,10 +16,10 @@ export type {
|
|
|
16
16
|
InputNumberStyleConfig,
|
|
17
17
|
InputNumberUtils,
|
|
18
18
|
InputNumberEvents,
|
|
19
|
-
InputNumberNativeProps
|
|
19
|
+
InputNumberNativeProps,
|
|
20
20
|
} from './InputNumber.types';
|
|
21
21
|
export { inputNumberStyles } from './InputNumber.styles';
|
|
22
22
|
|
|
23
23
|
// 重新导出默认导出
|
|
24
24
|
import { InputNumber as InputNumberComponent } from './InputNumber';
|
|
25
|
-
export default InputNumberComponent;
|
|
25
|
+
export default InputNumberComponent;
|
|
@@ -1,12 +1,5 @@
|
|
|
1
1
|
import { platform } from '@/utils';
|
|
2
|
-
import type {
|
|
3
|
-
RadioProps,
|
|
4
|
-
RadioSize,
|
|
5
|
-
RadioStatus,
|
|
6
|
-
RadioVariant,
|
|
7
|
-
RadioColor,
|
|
8
|
-
RadioStyleConfig,
|
|
9
|
-
} from './Radio.types';
|
|
2
|
+
import type { RadioProps, RadioSize, RadioStatus, RadioVariant, RadioColor, RadioStyleConfig } from './Radio.types';
|
|
10
3
|
|
|
11
4
|
/** 样式工具类 */
|
|
12
5
|
export class RadioStyles {
|
|
@@ -151,13 +151,13 @@ export const RadioComponent = forwardRef<RadioRef, RadioProps>((props, ref) => {
|
|
|
151
151
|
getSize: () => props.size || 'md',
|
|
152
152
|
setSize: (newSize: RadioSize) => {
|
|
153
153
|
// Radio size is controlled by parent, this is just for consistency
|
|
154
|
-
|
|
154
|
+
|
|
155
155
|
newSize;
|
|
156
156
|
},
|
|
157
157
|
getColor: () => props.color || 'primary',
|
|
158
158
|
setColor: (newColor: RadioColor) => {
|
|
159
159
|
// Radio color is controlled by parent, this is just for consistency
|
|
160
|
-
|
|
160
|
+
|
|
161
161
|
newColor;
|
|
162
162
|
},
|
|
163
163
|
getStatus: () => finalStatus,
|
|
@@ -174,7 +174,7 @@ export const RadioComponent = forwardRef<RadioRef, RadioProps>((props, ref) => {
|
|
|
174
174
|
getData: () => props.data,
|
|
175
175
|
setData: (newData: Record<string, any>) => {
|
|
176
176
|
// Radio data is controlled by parent, this is just for consistency
|
|
177
|
-
|
|
177
|
+
|
|
178
178
|
newData;
|
|
179
179
|
},
|
|
180
180
|
focus: () => {
|
|
@@ -185,13 +185,9 @@ export const RadioComponent = forwardRef<RadioRef, RadioProps>((props, ref) => {
|
|
|
185
185
|
},
|
|
186
186
|
shake: () => {
|
|
187
187
|
// Shake animation implementation would go here
|
|
188
|
-
|
|
189
|
-
console.log('shake animation');
|
|
190
188
|
},
|
|
191
189
|
pulse: () => {
|
|
192
190
|
// Pulse animation implementation would go here
|
|
193
|
-
|
|
194
|
-
console.log('pulse animation');
|
|
195
191
|
},
|
|
196
192
|
}),
|
|
197
193
|
[checked, internalDisabled, internalReadonly, validateRadio, onChange, finalStatus],
|
|
@@ -217,7 +213,6 @@ export const RadioComponent = forwardRef<RadioRef, RadioProps>((props, ref) => {
|
|
|
217
213
|
className,
|
|
218
214
|
});
|
|
219
215
|
|
|
220
|
-
|
|
221
216
|
return (
|
|
222
217
|
<View style={radioStyles['getContainerStyle']({ style: props.containerStyle })}>
|
|
223
218
|
<View style={radioStyles['getWrapperStyle']({ style: props.wrapperStyle })}>
|
|
@@ -280,4 +275,3 @@ RadioComponent.displayName = 'Radio';
|
|
|
280
275
|
|
|
281
276
|
/** 导出单选框组件 */
|
|
282
277
|
export const Radio = RadioComponent;
|
|
283
|
-
|
|
@@ -17,7 +17,11 @@ export type RadioColor = 'primary' | 'secondary' | 'success' | 'warning' | 'erro
|
|
|
17
17
|
export type RadioNativeProps = InputHTMLAttributes<HTMLInputElement>;
|
|
18
18
|
|
|
19
19
|
/** 单选框组件属性接口 */
|
|
20
|
-
export interface RadioProps
|
|
20
|
+
export interface RadioProps
|
|
21
|
+
extends Omit<
|
|
22
|
+
RadioNativeProps,
|
|
23
|
+
'size' | 'onChange' | 'checked' | 'onClick' | 'dangerouslySetInnerHTML' | 'onTouchStart'
|
|
24
|
+
> {
|
|
21
25
|
/** 单选框值 */
|
|
22
26
|
value: string | number;
|
|
23
27
|
/** 是否选中 */
|
|
@@ -98,7 +98,11 @@ export class SelectStyles {
|
|
|
98
98
|
backgroundColor: style?.backgroundColor || statusStyles['backgroundColor'] || variantStyles['backgroundColor'],
|
|
99
99
|
borderColor: style?.borderColor || statusStyles['borderColor'] || variantStyles['borderColor'],
|
|
100
100
|
borderWidth: style?.borderWidth || variantStyles['borderWidth'],
|
|
101
|
-
borderBottomWidth:
|
|
101
|
+
borderBottomWidth:
|
|
102
|
+
style?.borderBottomWidth ??
|
|
103
|
+
style?.borderWidth ??
|
|
104
|
+
variantStyles['borderBottomWidth'] ??
|
|
105
|
+
variantStyles['borderWidth'],
|
|
102
106
|
color: style?.color || statusStyles['color'],
|
|
103
107
|
opacity: disabled ? 0.5 : 1,
|
|
104
108
|
cursor: disabled ? 'not-allowed' : readonly ? 'default' : 'pointer',
|
|
@@ -2,13 +2,7 @@ import React, { forwardRef, useRef, useState, useEffect, useCallback } from 'rea
|
|
|
2
2
|
import { Picker, View, Text } from '@tarojs/components';
|
|
3
3
|
import type { ITouchEvent } from '@tarojs/components';
|
|
4
4
|
import { selectStyles } from './Select.styles';
|
|
5
|
-
import type {
|
|
6
|
-
SelectProps,
|
|
7
|
-
SelectRef,
|
|
8
|
-
SelectStatus,
|
|
9
|
-
SelectOption,
|
|
10
|
-
SelectOptionGroup,
|
|
11
|
-
} from './Select.types';
|
|
5
|
+
import type { SelectProps, SelectRef, SelectStatus, SelectOption, SelectOptionGroup } from './Select.types';
|
|
12
6
|
|
|
13
7
|
/** 选择器组件 */
|
|
14
8
|
export const SelectComponent = forwardRef<SelectRef, SelectProps>((props, ref) => {
|
|
@@ -53,7 +47,7 @@ export const SelectComponent = forwardRef<SelectRef, SelectProps>((props, ref) =
|
|
|
53
47
|
loading = false,
|
|
54
48
|
loadingText = '加载中...',
|
|
55
49
|
notFoundContent: _notFoundContent = '暂无数据',
|
|
56
|
-
style: _style
|
|
50
|
+
style: _style,
|
|
57
51
|
// ...restProps // Removed unused rest props
|
|
58
52
|
} = props;
|
|
59
53
|
|
|
@@ -257,7 +251,10 @@ export const SelectComponent = forwardRef<SelectRef, SelectProps>((props, ref) =
|
|
|
257
251
|
if (mode === 'single') {
|
|
258
252
|
return selectedOptions[0]?.label?.toString() || '';
|
|
259
253
|
} else {
|
|
260
|
-
return selectedOptions
|
|
254
|
+
return selectedOptions
|
|
255
|
+
.map((opt) => opt.label?.toString())
|
|
256
|
+
.filter(Boolean)
|
|
257
|
+
.join(', ');
|
|
261
258
|
}
|
|
262
259
|
}, [getSelectedOptions, placeholder, mode]);
|
|
263
260
|
|
|
@@ -266,7 +263,10 @@ export const SelectComponent = forwardRef<SelectRef, SelectProps>((props, ref) =
|
|
|
266
263
|
ref,
|
|
267
264
|
() => ({
|
|
268
265
|
element: selectRef.current,
|
|
269
|
-
getValue: () =>
|
|
266
|
+
getValue: () =>
|
|
267
|
+
value !== undefined && value !== null
|
|
268
|
+
? value
|
|
269
|
+
: ((mode === 'single' ? '' : []) as string | number | (string | number)[]),
|
|
270
270
|
setValue: (newValue) => {
|
|
271
271
|
if (!isControlled) {
|
|
272
272
|
setInternalValue(newValue);
|
|
@@ -327,9 +327,10 @@ export const SelectComponent = forwardRef<SelectRef, SelectProps>((props, ref) =
|
|
|
327
327
|
searchOptions: (keyword) => {
|
|
328
328
|
if (!keyword || typeof keyword !== 'string') return [];
|
|
329
329
|
const flatOptions = flattenOptions(options);
|
|
330
|
-
return flatOptions.filter(
|
|
331
|
-
opt
|
|
332
|
-
|
|
330
|
+
return flatOptions.filter(
|
|
331
|
+
(opt) =>
|
|
332
|
+
opt.label?.toString().toLowerCase().includes(keyword.toLowerCase()) ||
|
|
333
|
+
opt.value?.toString().toLowerCase().includes(keyword.toLowerCase()),
|
|
333
334
|
);
|
|
334
335
|
},
|
|
335
336
|
scrollToOption: (_optionValue) => {
|
|
@@ -353,7 +354,6 @@ export const SelectComponent = forwardRef<SelectRef, SelectProps>((props, ref) =
|
|
|
353
354
|
],
|
|
354
355
|
);
|
|
355
356
|
|
|
356
|
-
|
|
357
357
|
// 处理Picker变化
|
|
358
358
|
const handlePickerChange = (e: any) => {
|
|
359
359
|
const selectedIndex = e.detail?.value;
|
|
@@ -376,7 +376,7 @@ export const SelectComponent = forwardRef<SelectRef, SelectProps>((props, ref) =
|
|
|
376
376
|
// 获取当前选中的索引
|
|
377
377
|
const getCurrentIndex = () => {
|
|
378
378
|
if (value === undefined || value === null || value === '') return 0;
|
|
379
|
-
const index = options.findIndex(opt => {
|
|
379
|
+
const index = options.findIndex((opt) => {
|
|
380
380
|
if ('options' in opt) return false;
|
|
381
381
|
return opt.value === value;
|
|
382
382
|
});
|
|
@@ -53,7 +53,8 @@ export interface SelectOptionGroup {
|
|
|
53
53
|
export type SelectNativeProps = SelectHTMLAttributes<HTMLSelectElement>;
|
|
54
54
|
|
|
55
55
|
/** 选择器组件属性接口 */
|
|
56
|
-
export interface SelectProps
|
|
56
|
+
export interface SelectProps
|
|
57
|
+
extends Omit<SelectNativeProps, 'size' | 'onChange' | 'onFocus' | 'onBlur' | 'value' | 'defaultValue' | 'prefix'> {
|
|
57
58
|
/** 选择器值 */
|
|
58
59
|
value?: string | number | Array<string | number>;
|
|
59
60
|
/** 默认值(非受控模式) */
|
|
@@ -9,18 +9,18 @@ export const sliderStyles: Record<string, CSSProperties> = {
|
|
|
9
9
|
alignItems: 'center',
|
|
10
10
|
cursor: 'pointer',
|
|
11
11
|
},
|
|
12
|
-
|
|
12
|
+
|
|
13
13
|
vertical: {
|
|
14
14
|
width: '24px' as any,
|
|
15
15
|
height: '200px' as any,
|
|
16
16
|
flexDirection: 'column' as 'column',
|
|
17
17
|
},
|
|
18
|
-
|
|
18
|
+
|
|
19
19
|
disabled: {
|
|
20
20
|
opacity: 0.5,
|
|
21
21
|
cursor: 'not-allowed',
|
|
22
22
|
},
|
|
23
|
-
|
|
23
|
+
|
|
24
24
|
track: {
|
|
25
25
|
position: 'absolute',
|
|
26
26
|
width: '100%',
|
|
@@ -28,7 +28,7 @@ export const sliderStyles: Record<string, CSSProperties> = {
|
|
|
28
28
|
backgroundColor: '#e5e7eb',
|
|
29
29
|
borderRadius: '2px',
|
|
30
30
|
},
|
|
31
|
-
|
|
31
|
+
|
|
32
32
|
trackFill: {
|
|
33
33
|
position: 'absolute',
|
|
34
34
|
height: '100%',
|
|
@@ -37,7 +37,7 @@ export const sliderStyles: Record<string, CSSProperties> = {
|
|
|
37
37
|
left: 0,
|
|
38
38
|
top: 0,
|
|
39
39
|
},
|
|
40
|
-
|
|
40
|
+
|
|
41
41
|
handle: {
|
|
42
42
|
position: 'absolute',
|
|
43
43
|
width: '16px',
|
|
@@ -51,12 +51,12 @@ export const sliderStyles: Record<string, CSSProperties> = {
|
|
|
51
51
|
transition: 'all 0.2s ease-in-out',
|
|
52
52
|
zIndex: 2,
|
|
53
53
|
},
|
|
54
|
-
|
|
54
|
+
|
|
55
55
|
handleDragging: {
|
|
56
56
|
transform: 'translate(-50%, -50%) scale(1.2)',
|
|
57
57
|
boxShadow: '0 0 0 8px rgba(14, 165, 233, 0.2)',
|
|
58
58
|
},
|
|
59
|
-
|
|
59
|
+
|
|
60
60
|
tooltip: {
|
|
61
61
|
position: 'absolute',
|
|
62
62
|
bottom: '100%',
|
|
@@ -72,20 +72,20 @@ export const sliderStyles: Record<string, CSSProperties> = {
|
|
|
72
72
|
opacity: 0,
|
|
73
73
|
transition: 'opacity 0.2s ease-in-out',
|
|
74
74
|
},
|
|
75
|
-
|
|
75
|
+
|
|
76
76
|
marks: {
|
|
77
77
|
position: 'absolute',
|
|
78
78
|
width: '100%',
|
|
79
79
|
height: '100%',
|
|
80
80
|
},
|
|
81
|
-
|
|
81
|
+
|
|
82
82
|
mark: {
|
|
83
83
|
position: 'absolute',
|
|
84
84
|
display: 'flex',
|
|
85
85
|
flexDirection: 'column',
|
|
86
86
|
alignItems: 'center',
|
|
87
87
|
},
|
|
88
|
-
|
|
88
|
+
|
|
89
89
|
markDot: {
|
|
90
90
|
width: '8px',
|
|
91
91
|
height: '8px',
|
|
@@ -93,13 +93,13 @@ export const sliderStyles: Record<string, CSSProperties> = {
|
|
|
93
93
|
borderRadius: '50%',
|
|
94
94
|
marginBottom: '4px',
|
|
95
95
|
},
|
|
96
|
-
|
|
96
|
+
|
|
97
97
|
markLabel: {
|
|
98
98
|
fontSize: '12px',
|
|
99
99
|
color: '#6b7280',
|
|
100
100
|
marginTop: '4px',
|
|
101
101
|
},
|
|
102
|
-
|
|
102
|
+
|
|
103
103
|
// Vertical styles
|
|
104
104
|
verticalTrack: {
|
|
105
105
|
width: '4px',
|
|
@@ -136,4 +136,4 @@ export const sliderStyles: Record<string, CSSProperties> = {
|
|
|
136
136
|
marginLeft: '4px',
|
|
137
137
|
marginTop: 0,
|
|
138
138
|
},
|
|
139
|
-
};
|
|
139
|
+
};
|
|
@@ -44,7 +44,7 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
44
44
|
const handleChange = useCallback(
|
|
45
45
|
(newValue: number, _event?: ITouchEvent) => {
|
|
46
46
|
const clampedValue = Math.max(min, Math.min(max, newValue));
|
|
47
|
-
|
|
47
|
+
|
|
48
48
|
if (!isControlled) {
|
|
49
49
|
setInternalValue(clampedValue);
|
|
50
50
|
}
|
|
@@ -72,19 +72,19 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
72
72
|
const handleClick = useCallback(
|
|
73
73
|
(event: ITouchEvent) => {
|
|
74
74
|
if (internalDisabled) return;
|
|
75
|
-
|
|
75
|
+
|
|
76
76
|
const rect = (event.currentTarget as any).getBoundingClientRect();
|
|
77
77
|
const clientX = event.detail?.x || 0;
|
|
78
78
|
const clientY = event.detail?.y || 0;
|
|
79
|
-
|
|
80
|
-
const percentage = vertical
|
|
81
|
-
? reverse
|
|
82
|
-
? 1 - (
|
|
79
|
+
|
|
80
|
+
const percentage = vertical
|
|
81
|
+
? reverse
|
|
82
|
+
? 1 - (clientY - rect.top) / rect.height
|
|
83
83
|
: (clientY - rect.top) / rect.height
|
|
84
|
-
: reverse
|
|
85
|
-
? 1 - (
|
|
84
|
+
: reverse
|
|
85
|
+
? 1 - (clientX - rect.left) / rect.width
|
|
86
86
|
: (clientX - rect.left) / rect.width;
|
|
87
|
-
|
|
87
|
+
|
|
88
88
|
const newValue = Math.round((min + percentage * (max - min)) / step) * step;
|
|
89
89
|
handleChange(newValue, event);
|
|
90
90
|
},
|
|
@@ -112,10 +112,10 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
112
112
|
|
|
113
113
|
const percentage = vertical
|
|
114
114
|
? reverse
|
|
115
|
-
? 1 - (
|
|
115
|
+
? 1 - (clientY - rect.top) / rect.height
|
|
116
116
|
: (clientY - rect.top) / rect.height
|
|
117
117
|
: reverse
|
|
118
|
-
? 1 - (
|
|
118
|
+
? 1 - (clientX - rect.left) / rect.width
|
|
119
119
|
: (clientX - rect.left) / rect.width;
|
|
120
120
|
|
|
121
121
|
const newValue = Math.round((min + percentage * (max - min)) / step) * step;
|
|
@@ -125,7 +125,6 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
125
125
|
);
|
|
126
126
|
|
|
127
127
|
// 处理键盘交互
|
|
128
|
-
|
|
129
128
|
|
|
130
129
|
// 处理拖拽结束
|
|
131
130
|
const handleDragEnd = useCallback(() => {
|
|
@@ -141,11 +140,11 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
141
140
|
return Object.entries(marks).map(([markValue, markLabel]) => {
|
|
142
141
|
const val = Number(markValue);
|
|
143
142
|
const percentage = getPercentage(val);
|
|
144
|
-
const position = vertical
|
|
145
|
-
? reverse
|
|
143
|
+
const position = vertical
|
|
144
|
+
? reverse
|
|
146
145
|
? `${100 - percentage}%`
|
|
147
146
|
: `${percentage}%`
|
|
148
|
-
: reverse
|
|
147
|
+
: reverse
|
|
149
148
|
? `${100 - percentage}%`
|
|
150
149
|
: `${percentage}%`;
|
|
151
150
|
|
|
@@ -195,12 +194,8 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
195
194
|
onChange?.(defaultValue);
|
|
196
195
|
}
|
|
197
196
|
},
|
|
198
|
-
focus: () => {
|
|
199
|
-
|
|
200
|
-
},
|
|
201
|
-
blur: () => {
|
|
202
|
-
|
|
203
|
-
},
|
|
197
|
+
focus: () => {},
|
|
198
|
+
blur: () => {},
|
|
204
199
|
}),
|
|
205
200
|
[value, isControlled, internalDisabled, dragging, min, max, defaultValue, getPercentage, onChange],
|
|
206
201
|
);
|
|
@@ -271,7 +266,6 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
271
266
|
marginLeft: vertical ? '4px' : 0,
|
|
272
267
|
};
|
|
273
268
|
|
|
274
|
-
|
|
275
269
|
return (
|
|
276
270
|
<View
|
|
277
271
|
ref={containerRef}
|
|
@@ -279,20 +273,16 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
279
273
|
onClick={handleClick}
|
|
280
274
|
onTouchMove={(e) => handleDrag(e as unknown as ITouchEvent)}
|
|
281
275
|
onTouchEnd={() => handleDragEnd()}
|
|
282
|
-
|
|
283
276
|
role="slider"
|
|
284
277
|
aria-valuemin={min}
|
|
285
278
|
aria-valuemax={max}
|
|
286
279
|
aria-valuenow={value}
|
|
287
280
|
accessibilityLabel={restProps.accessibilityLabel || 'Slider'}
|
|
288
281
|
aria-disabled={internalDisabled}
|
|
289
|
-
|
|
290
282
|
{...restProps}
|
|
291
283
|
>
|
|
292
|
-
<View style={trackStyle}>
|
|
293
|
-
|
|
294
|
-
</View>
|
|
295
|
-
|
|
284
|
+
<View style={trackStyle}>{included && <View style={trackFillStyle} />}</View>
|
|
285
|
+
|
|
296
286
|
<View
|
|
297
287
|
style={{
|
|
298
288
|
...handleStyle,
|
|
@@ -309,11 +299,7 @@ export const SliderComponent = forwardRef<SliderRef, SliderProps>((props, ref) =
|
|
|
309
299
|
)}
|
|
310
300
|
</View>
|
|
311
301
|
|
|
312
|
-
{marks && (
|
|
313
|
-
<View style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}>
|
|
314
|
-
{renderMarks()}
|
|
315
|
-
</View>
|
|
316
|
-
)}
|
|
302
|
+
{marks && <View style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}>{renderMarks()}</View>}
|
|
317
303
|
</View>
|
|
318
304
|
);
|
|
319
305
|
});
|
|
@@ -26,12 +26,14 @@ export interface SliderProps {
|
|
|
26
26
|
/** 是否反向 */
|
|
27
27
|
reverse?: boolean;
|
|
28
28
|
/** 工具提示配置 */
|
|
29
|
-
tooltip?:
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
tooltip?:
|
|
30
|
+
| {
|
|
31
|
+
/** 是否显示工具提示 */
|
|
32
|
+
visible?: boolean;
|
|
33
|
+
/** 格式化函数 */
|
|
34
|
+
formatter?: (_value: number) => React.ReactNode;
|
|
35
|
+
}
|
|
36
|
+
| boolean;
|
|
35
37
|
/** 自定义样式类名 */
|
|
36
38
|
className?: string;
|
|
37
39
|
/** 自定义样式 */
|
|
@@ -78,7 +80,7 @@ export interface SliderMark {
|
|
|
78
80
|
style?: React.CSSProperties;
|
|
79
81
|
}
|
|
80
82
|
|
|
81
|
-
export interface
|
|
83
|
+
export interface SliderUtilsType {
|
|
82
84
|
/** 计算滑块位置 */
|
|
83
85
|
calculatePosition: (_value: number, min: number, max: number) => number;
|
|
84
86
|
/** 计算对应的值 */
|
|
@@ -89,20 +91,20 @@ export interface SliderUtils {
|
|
|
89
91
|
validateValue: (_value: number, min: number, max: number) => boolean;
|
|
90
92
|
}
|
|
91
93
|
|
|
92
|
-
export const SliderUtils:
|
|
94
|
+
export const SliderUtils: SliderUtilsType = {
|
|
93
95
|
calculatePosition: (value: number, min: number, max: number) => {
|
|
94
96
|
return ((value - min) / (max - min)) * 100;
|
|
95
97
|
},
|
|
96
|
-
|
|
98
|
+
|
|
97
99
|
calculateValue: (position: number, min: number, max: number) => {
|
|
98
100
|
return min + (position / 100) * (max - min);
|
|
99
101
|
},
|
|
100
|
-
|
|
102
|
+
|
|
101
103
|
formatValue: (value: number, step: number) => {
|
|
102
104
|
return Math.round(value / step) * step;
|
|
103
105
|
},
|
|
104
|
-
|
|
106
|
+
|
|
105
107
|
validateValue: (value: number, min: number, max: number) => {
|
|
106
108
|
return value >= min && value <= max;
|
|
107
109
|
},
|
|
108
|
-
};
|
|
110
|
+
};
|
|
@@ -1,10 +1,3 @@
|
|
|
1
1
|
export { Slider } from './Slider';
|
|
2
|
-
export type {
|
|
3
|
-
|
|
4
|
-
SliderRef,
|
|
5
|
-
SliderSize,
|
|
6
|
-
SliderVariant,
|
|
7
|
-
SliderMark,
|
|
8
|
-
SliderUtils,
|
|
9
|
-
} from './Slider.types';
|
|
10
|
-
export { sliderStyles } from './Slider.styles';
|
|
2
|
+
export type { SliderProps, SliderRef, SliderSize, SliderVariant, SliderMark, SliderUtils } from './Slider.types';
|
|
3
|
+
export { sliderStyles } from './Slider.styles';
|
|
@@ -3,13 +3,7 @@
|
|
|
3
3
|
* 开关组件样式
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
|
-
import type {
|
|
7
|
-
SwitchSize,
|
|
8
|
-
SwitchVariant,
|
|
9
|
-
SwitchStatus,
|
|
10
|
-
SwitchColor,
|
|
11
|
-
SwitchStyleConfig,
|
|
12
|
-
} from './Switch.types';
|
|
6
|
+
import type { SwitchSize, SwitchVariant, SwitchStatus, SwitchColor, SwitchStyleConfig } from './Switch.types';
|
|
13
7
|
|
|
14
8
|
// 默认样式配置
|
|
15
9
|
const defaultStyleConfig: SwitchStyleConfig = {
|
|
@@ -7,11 +7,7 @@ import React, { forwardRef, useRef, useState, useEffect, useCallback } from 'rea
|
|
|
7
7
|
import { View, Text } from '@tarojs/components';
|
|
8
8
|
import type { ITouchEvent } from '@tarojs/components';
|
|
9
9
|
import { switchStyles } from './Switch.styles';
|
|
10
|
-
import type {
|
|
11
|
-
SwitchProps,
|
|
12
|
-
SwitchRef,
|
|
13
|
-
SwitchValidationResult,
|
|
14
|
-
} from './Switch.types';
|
|
10
|
+
import type { SwitchProps, SwitchRef, SwitchValidationResult } from './Switch.types';
|
|
15
11
|
|
|
16
12
|
/** 开关组件 */
|
|
17
13
|
export const SwitchComponent = forwardRef<SwitchRef, SwitchProps>((props, ref) => {
|
|
@@ -259,11 +255,7 @@ export const SwitchComponent = forwardRef<SwitchRef, SwitchProps>((props, ref) =
|
|
|
259
255
|
// );
|
|
260
256
|
|
|
261
257
|
// 计算最终状态
|
|
262
|
-
const finalStatus = internalDisabled
|
|
263
|
-
? 'disabled'
|
|
264
|
-
: validationResult?.valid === false
|
|
265
|
-
? 'error'
|
|
266
|
-
: 'normal';
|
|
258
|
+
const finalStatus = internalDisabled ? 'disabled' : validationResult?.valid === false ? 'error' : 'normal';
|
|
267
259
|
|
|
268
260
|
// 更新当前状态引用
|
|
269
261
|
useEffect(() => {
|
|
@@ -316,7 +308,8 @@ export const SwitchComponent = forwardRef<SwitchRef, SwitchProps>((props, ref) =
|
|
|
316
308
|
// setStatus is required by interface but internalStatus is not used
|
|
317
309
|
// We'll keep the method for compatibility
|
|
318
310
|
},
|
|
319
|
-
getStatus: () =>
|
|
311
|
+
getStatus: () =>
|
|
312
|
+
currentStatusRef.current as 'normal' | 'error' | 'checked' | 'unchecked' | 'disabled' | 'loading',
|
|
320
313
|
validate: async () => {
|
|
321
314
|
const result = await validateSwitch(value);
|
|
322
315
|
// setInternalStatus(result.valid ? 'normal' : 'error'); // Commented out - internalStatus unused
|
|
@@ -345,7 +338,6 @@ export const SwitchComponent = forwardRef<SwitchRef, SwitchProps>((props, ref) =
|
|
|
345
338
|
],
|
|
346
339
|
);
|
|
347
340
|
|
|
348
|
-
|
|
349
341
|
// 获取标签文本
|
|
350
342
|
const getLabelText = () => {
|
|
351
343
|
if (!showLabel) return null;
|
|
@@ -436,7 +428,9 @@ export const SwitchComponent = forwardRef<SwitchRef, SwitchProps>((props, ref) =
|
|
|
436
428
|
</View>
|
|
437
429
|
|
|
438
430
|
{/* 加载文本 */}
|
|
439
|
-
{internalLoading && loadingText &&
|
|
431
|
+
{internalLoading && loadingText && (
|
|
432
|
+
<Text style={switchStyles['getHelperTextStyle']({ size })}>{loadingText}</Text>
|
|
433
|
+
)}
|
|
440
434
|
</View>
|
|
441
435
|
|
|
442
436
|
{/* 辅助文本 */}
|