@unif/react-native-ui 0.1.0 → 0.2.0
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/lib/commonjs/README.md +99 -0
- package/lib/commonjs/action-sheet/index.js +71 -0
- package/lib/commonjs/action-sheet/index.js.map +1 -0
- package/lib/commonjs/action-sheet/index.md +69 -0
- package/lib/commonjs/action-sheet/style/index.js +42 -0
- package/lib/commonjs/action-sheet/style/index.js.map +1 -0
- package/lib/commonjs/avatar/index.js +50 -0
- package/lib/commonjs/avatar/index.js.map +1 -0
- package/lib/commonjs/avatar/index.md +51 -0
- package/lib/commonjs/avatar/style/index.js +21 -0
- package/lib/commonjs/avatar/style/index.js.map +1 -0
- package/lib/commonjs/button/index.js +60 -0
- package/lib/commonjs/button/index.js.map +1 -0
- package/lib/commonjs/button/index.md +90 -0
- package/lib/commonjs/button/style/index.js +98 -0
- package/lib/commonjs/button/style/index.js.map +1 -0
- package/lib/commonjs/center/index.js +26 -0
- package/lib/commonjs/center/index.js.map +1 -0
- package/lib/commonjs/center/index.md +28 -0
- package/lib/commonjs/center/style/index.js +14 -0
- package/lib/commonjs/center/style/index.js.map +1 -0
- package/lib/commonjs/chip/index.js +69 -0
- package/lib/commonjs/chip/index.js.map +1 -0
- package/lib/commonjs/chip/index.md +60 -0
- package/lib/commonjs/chip/style/index.js +46 -0
- package/lib/commonjs/chip/style/index.js.map +1 -0
- package/lib/commonjs/column/index.js +35 -0
- package/lib/commonjs/column/index.js.map +1 -0
- package/lib/commonjs/column/index.md +34 -0
- package/lib/commonjs/column/style/index.js +13 -0
- package/lib/commonjs/column/style/index.js.map +1 -0
- package/lib/commonjs/divider/index.js +32 -0
- package/lib/commonjs/divider/index.js.map +1 -0
- package/lib/commonjs/divider/index.md +44 -0
- package/lib/commonjs/divider/style/index.js +22 -0
- package/lib/commonjs/divider/style/index.js.map +1 -0
- package/lib/commonjs/hooks/index.js +13 -0
- package/lib/commonjs/hooks/index.js.map +1 -0
- package/lib/commonjs/hooks/index.md +71 -0
- package/lib/commonjs/hooks/useMergeStyles.js +31 -0
- package/lib/commonjs/hooks/useMergeStyles.js.map +1 -0
- package/lib/commonjs/index.js +146 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/input/index.js +76 -0
- package/lib/commonjs/input/index.js.map +1 -0
- package/lib/commonjs/input/index.md +73 -0
- package/lib/commonjs/input/style/index.js +31 -0
- package/lib/commonjs/input/style/index.js.map +1 -0
- package/lib/commonjs/list-item/index.js +76 -0
- package/lib/commonjs/list-item/index.js.map +1 -0
- package/lib/commonjs/list-item/index.md +101 -0
- package/lib/commonjs/list-item/style/index.js +43 -0
- package/lib/commonjs/list-item/style/index.js.map +1 -0
- package/lib/commonjs/menu/index.js +68 -0
- package/lib/commonjs/menu/index.js.map +1 -0
- package/lib/commonjs/menu/style/index.js +32 -0
- package/lib/commonjs/menu/style/index.js.map +1 -0
- package/lib/commonjs/package.json +1 -0
- package/lib/commonjs/popover/index.js +68 -0
- package/lib/commonjs/popover/index.js.map +1 -0
- package/lib/commonjs/popover/index.md +57 -0
- package/lib/commonjs/popover/style/index.js +26 -0
- package/lib/commonjs/popover/style/index.js.map +1 -0
- package/lib/commonjs/row/index.js +36 -0
- package/lib/commonjs/row/index.js.map +1 -0
- package/lib/commonjs/row/index.md +46 -0
- package/lib/commonjs/row/style/index.js +19 -0
- package/lib/commonjs/row/style/index.js.map +1 -0
- package/lib/commonjs/space/index.js +25 -0
- package/lib/commonjs/space/index.js.map +1 -0
- package/lib/commonjs/space/index.md +31 -0
- package/lib/commonjs/space/style/index.js +15 -0
- package/lib/commonjs/space/style/index.js.map +1 -0
- package/lib/commonjs/text/index.js +40 -0
- package/lib/commonjs/text/index.js.map +1 -0
- package/lib/commonjs/text/index.md +63 -0
- package/lib/commonjs/text/style/index.js +56 -0
- package/lib/commonjs/text/style/index.js.map +1 -0
- package/lib/commonjs/theme/context.js +40 -0
- package/lib/commonjs/theme/context.js.map +1 -0
- package/lib/commonjs/theme/tokens.js +68 -0
- package/lib/commonjs/theme/tokens.js.map +1 -0
- package/lib/commonjs/touchable/index.js +40 -0
- package/lib/commonjs/touchable/index.js.map +1 -0
- package/lib/commonjs/touchable/index.md +42 -0
- package/lib/commonjs/touchable/style/index.js +13 -0
- package/lib/commonjs/touchable/style/index.js.map +1 -0
- package/lib/commonjs/wave-animation/index.js +72 -0
- package/lib/commonjs/wave-animation/index.js.map +1 -0
- package/lib/commonjs/wave-animation/index.md +50 -0
- package/lib/module/action-sheet/index.js +5 -2
- package/lib/module/action-sheet/index.js.map +1 -1
- package/lib/module/action-sheet/style/index.js +7 -8
- package/lib/module/action-sheet/style/index.js.map +1 -1
- package/lib/module/avatar/index.js +5 -2
- package/lib/module/avatar/index.js.map +1 -1
- package/lib/module/avatar/style/index.js +4 -5
- package/lib/module/avatar/style/index.js.map +1 -1
- package/lib/module/button/index.js +5 -2
- package/lib/module/button/index.js.map +1 -1
- package/lib/module/button/style/index.js +8 -9
- package/lib/module/button/style/index.js.map +1 -1
- package/lib/module/chip/index.js +7 -2
- package/lib/module/chip/index.js.map +1 -1
- package/lib/module/chip/style/index.js +12 -13
- package/lib/module/chip/style/index.js.map +1 -1
- package/lib/module/divider/index.js +13 -7
- package/lib/module/divider/index.js.map +1 -1
- package/lib/module/divider/style/index.js +4 -5
- package/lib/module/divider/style/index.js.map +1 -1
- package/lib/module/index.js +4 -4
- package/lib/module/index.js.map +1 -1
- package/lib/module/input/index.js +5 -3
- package/lib/module/input/index.js.map +1 -1
- package/lib/module/input/style/index.js +8 -9
- package/lib/module/input/style/index.js.map +1 -1
- package/lib/module/list-item/index.js +9 -7
- package/lib/module/list-item/index.js.map +1 -1
- package/lib/module/list-item/style/index.js +5 -6
- package/lib/module/list-item/style/index.js.map +1 -1
- package/lib/module/menu/index.js +62 -0
- package/lib/module/menu/index.js.map +1 -0
- package/lib/module/menu/style/index.js +27 -0
- package/lib/module/menu/style/index.js.map +1 -0
- package/lib/module/popover/index.js +5 -2
- package/lib/module/popover/index.js.map +1 -1
- package/lib/module/popover/style/index.js +3 -4
- package/lib/module/popover/style/index.js.map +1 -1
- package/lib/module/text/index.js +8 -3
- package/lib/module/text/index.js.map +1 -1
- package/lib/module/text/style/index.js +12 -14
- package/lib/module/text/style/index.js.map +1 -1
- package/lib/module/theme/context.js +33 -0
- package/lib/module/theme/context.js.map +1 -0
- package/lib/module/theme/tokens.js +3 -6
- package/lib/module/theme/tokens.js.map +1 -1
- package/lib/typescript/{jest.setup.d.ts.map → commonjs/jest.setup.d.ts.map} +1 -1
- package/lib/typescript/commonjs/package.json +1 -0
- package/lib/typescript/commonjs/src/action-sheet/index.d.ts.map +1 -0
- package/lib/typescript/{src → commonjs/src}/action-sheet/style/index.d.ts +2 -1
- package/lib/typescript/commonjs/src/action-sheet/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/avatar/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/avatar/style/index.d.ts +8 -0
- package/lib/typescript/commonjs/src/avatar/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/button/index.d.ts.map +1 -0
- package/lib/typescript/{src → commonjs/src}/button/style/index.d.ts +2 -1
- package/lib/typescript/commonjs/src/button/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/center/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/center/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/chip/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/chip/style/index.d.ts +11 -0
- package/lib/typescript/commonjs/src/chip/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/column/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/column/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/divider/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/divider/style/index.d.ts +10 -0
- package/lib/typescript/commonjs/src/divider/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/hooks/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/hooks/useMergeStyles.d.ts.map +1 -0
- package/lib/typescript/{src → commonjs/src}/index.d.ts +6 -3
- package/lib/typescript/commonjs/src/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/input/index.d.ts.map +1 -0
- package/lib/typescript/{src → commonjs/src}/input/style/index.d.ts +2 -1
- package/lib/typescript/commonjs/src/input/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/list-item/index.d.ts.map +1 -0
- package/lib/typescript/{src → commonjs/src}/list-item/style/index.d.ts +2 -1
- package/lib/typescript/commonjs/src/list-item/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/menu/index.d.ts +36 -0
- package/lib/typescript/commonjs/src/menu/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/menu/style/index.d.ts +32 -0
- package/lib/typescript/commonjs/src/menu/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/popover/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/popover/style/index.d.ts +8 -0
- package/lib/typescript/commonjs/src/popover/style/index.d.ts.map +1 -0
- package/lib/typescript/{src/column → commonjs/src/row}/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/src/row/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/space/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/space/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/text/index.d.ts.map +1 -0
- package/lib/typescript/{src → commonjs/src}/text/style/index.d.ts +5 -4
- package/lib/typescript/commonjs/src/text/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/theme/context.d.ts +17 -0
- package/lib/typescript/commonjs/src/theme/context.d.ts.map +1 -0
- package/lib/typescript/{src → commonjs/src}/theme/tokens.d.ts +4 -3
- package/lib/typescript/commonjs/src/theme/tokens.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/touchable/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/touchable/style/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/wave-animation/index.d.ts.map +1 -0
- package/lib/typescript/module/jest.setup.d.ts +1 -0
- package/lib/typescript/module/jest.setup.d.ts.map +1 -0
- package/lib/typescript/module/src/action-sheet/index.d.ts +22 -0
- package/lib/typescript/module/src/action-sheet/index.d.ts.map +1 -0
- package/lib/typescript/module/src/action-sheet/style/index.d.ts +17 -0
- package/lib/typescript/module/src/action-sheet/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/avatar/index.d.ts +19 -0
- package/lib/typescript/module/src/avatar/index.d.ts.map +1 -0
- package/lib/typescript/module/src/avatar/style/index.d.ts +8 -0
- package/lib/typescript/module/src/avatar/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/button/index.d.ts +24 -0
- package/lib/typescript/module/src/button/index.d.ts.map +1 -0
- package/lib/typescript/module/src/button/style/index.d.ts +17 -0
- package/lib/typescript/module/src/button/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/center/index.d.ts +11 -0
- package/lib/typescript/module/src/center/index.d.ts.map +1 -0
- package/lib/typescript/module/src/center/style/index.d.ts +5 -0
- package/lib/typescript/module/src/center/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/chip/index.d.ts +22 -0
- package/lib/typescript/module/src/chip/index.d.ts.map +1 -0
- package/lib/typescript/module/src/chip/style/index.d.ts +11 -0
- package/lib/typescript/module/src/chip/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/column/index.d.ts +20 -0
- package/lib/typescript/module/src/column/index.d.ts.map +1 -0
- package/lib/typescript/module/src/column/style/index.d.ts +4 -0
- package/lib/typescript/module/src/column/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/divider/index.d.ts +13 -0
- package/lib/typescript/module/src/divider/index.d.ts.map +1 -0
- package/lib/typescript/module/src/divider/style/index.d.ts +10 -0
- package/lib/typescript/module/src/divider/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/hooks/index.d.ts +2 -0
- package/lib/typescript/module/src/hooks/index.d.ts.map +1 -0
- package/lib/typescript/module/src/hooks/useMergeStyles.d.ts +13 -0
- package/lib/typescript/module/src/hooks/useMergeStyles.d.ts.map +1 -0
- package/lib/typescript/module/src/index.d.ts +42 -0
- package/lib/typescript/module/src/index.d.ts.map +1 -0
- package/lib/typescript/module/src/input/index.d.ts +29 -0
- package/lib/typescript/module/src/input/index.d.ts.map +1 -0
- package/lib/typescript/module/src/input/style/index.d.ts +9 -0
- package/lib/typescript/module/src/input/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/list-item/index.d.ts +25 -0
- package/lib/typescript/module/src/list-item/index.d.ts.map +1 -0
- package/lib/typescript/module/src/list-item/style/index.d.ts +18 -0
- package/lib/typescript/module/src/list-item/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/menu/index.d.ts +36 -0
- package/lib/typescript/module/src/menu/index.d.ts.map +1 -0
- package/lib/typescript/module/src/menu/style/index.d.ts +32 -0
- package/lib/typescript/module/src/menu/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/popover/index.d.ts +27 -0
- package/lib/typescript/module/src/popover/index.d.ts.map +1 -0
- package/lib/typescript/module/src/popover/style/index.d.ts +8 -0
- package/lib/typescript/module/src/popover/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/row/index.d.ts +22 -0
- package/lib/typescript/module/src/row/index.d.ts.map +1 -0
- package/lib/typescript/module/src/row/style/index.d.ts +8 -0
- package/lib/typescript/module/src/row/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/space/index.d.ts +15 -0
- package/lib/typescript/module/src/space/index.d.ts.map +1 -0
- package/lib/typescript/module/src/space/style/index.d.ts +7 -0
- package/lib/typescript/module/src/space/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/text/index.d.ts +18 -0
- package/lib/typescript/module/src/text/index.d.ts.map +1 -0
- package/lib/typescript/module/src/text/style/index.d.ts +36 -0
- package/lib/typescript/module/src/text/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/theme/context.d.ts +17 -0
- package/lib/typescript/module/src/theme/context.d.ts.map +1 -0
- package/lib/typescript/module/src/theme/tokens.d.ts +62 -0
- package/lib/typescript/module/src/theme/tokens.d.ts.map +1 -0
- package/lib/typescript/module/src/touchable/index.d.ts +19 -0
- package/lib/typescript/module/src/touchable/index.d.ts.map +1 -0
- package/lib/typescript/module/src/touchable/style/index.d.ts +4 -0
- package/lib/typescript/module/src/touchable/style/index.d.ts.map +1 -0
- package/lib/typescript/module/src/wave-animation/index.d.ts +20 -0
- package/lib/typescript/module/src/wave-animation/index.d.ts.map +1 -0
- package/package.json +16 -5
- package/src/action-sheet/index.tsx +7 -3
- package/src/action-sheet/style/index.tsx +10 -8
- package/src/avatar/index.tsx +7 -3
- package/src/avatar/style/index.tsx +5 -5
- package/src/button/index.tsx +7 -3
- package/src/button/style/index.tsx +11 -9
- package/src/chip/index.tsx +16 -5
- package/src/chip/style/index.tsx +15 -13
- package/src/divider/index.tsx +18 -11
- package/src/divider/style/index.tsx +12 -10
- package/src/index.tsx +7 -4
- package/src/input/index.tsx +6 -4
- package/src/input/style/index.tsx +9 -9
- package/src/list-item/index.tsx +11 -6
- package/src/list-item/style/index.tsx +6 -6
- package/src/menu/index.tsx +99 -0
- package/src/menu/style/index.tsx +34 -0
- package/src/popover/index.tsx +7 -3
- package/src/popover/style/index.tsx +4 -4
- package/src/text/index.tsx +9 -3
- package/src/text/style/index.tsx +16 -12
- package/src/theme/context.tsx +38 -0
- package/src/theme/tokens.ts +5 -7
- package/lib/module/theme/config.js +0 -27
- package/lib/module/theme/config.js.map +0 -1
- package/lib/typescript/src/action-sheet/index.d.ts.map +0 -1
- package/lib/typescript/src/action-sheet/style/index.d.ts.map +0 -1
- package/lib/typescript/src/avatar/index.d.ts.map +0 -1
- package/lib/typescript/src/avatar/style/index.d.ts +0 -7
- package/lib/typescript/src/avatar/style/index.d.ts.map +0 -1
- package/lib/typescript/src/button/index.d.ts.map +0 -1
- package/lib/typescript/src/button/style/index.d.ts.map +0 -1
- package/lib/typescript/src/center/index.d.ts.map +0 -1
- package/lib/typescript/src/center/style/index.d.ts.map +0 -1
- package/lib/typescript/src/chip/index.d.ts.map +0 -1
- package/lib/typescript/src/chip/style/index.d.ts +0 -10
- package/lib/typescript/src/chip/style/index.d.ts.map +0 -1
- package/lib/typescript/src/column/style/index.d.ts.map +0 -1
- package/lib/typescript/src/divider/index.d.ts.map +0 -1
- package/lib/typescript/src/divider/style/index.d.ts +0 -9
- package/lib/typescript/src/divider/style/index.d.ts.map +0 -1
- package/lib/typescript/src/hooks/index.d.ts.map +0 -1
- package/lib/typescript/src/hooks/useMergeStyles.d.ts.map +0 -1
- package/lib/typescript/src/index.d.ts.map +0 -1
- package/lib/typescript/src/input/index.d.ts.map +0 -1
- package/lib/typescript/src/input/style/index.d.ts.map +0 -1
- package/lib/typescript/src/list-item/index.d.ts.map +0 -1
- package/lib/typescript/src/list-item/style/index.d.ts.map +0 -1
- package/lib/typescript/src/popover/index.d.ts.map +0 -1
- package/lib/typescript/src/popover/style/index.d.ts +0 -7
- package/lib/typescript/src/popover/style/index.d.ts.map +0 -1
- package/lib/typescript/src/row/index.d.ts.map +0 -1
- package/lib/typescript/src/row/style/index.d.ts.map +0 -1
- package/lib/typescript/src/space/index.d.ts.map +0 -1
- package/lib/typescript/src/space/style/index.d.ts.map +0 -1
- package/lib/typescript/src/text/index.d.ts.map +0 -1
- package/lib/typescript/src/text/style/index.d.ts.map +0 -1
- package/lib/typescript/src/theme/config.d.ts +0 -18
- package/lib/typescript/src/theme/config.d.ts.map +0 -1
- package/lib/typescript/src/theme/tokens.d.ts.map +0 -1
- package/lib/typescript/src/touchable/index.d.ts.map +0 -1
- package/lib/typescript/src/touchable/style/index.d.ts.map +0 -1
- package/lib/typescript/src/wave-animation/index.d.ts.map +0 -1
- package/lib/typescript/tests/component/component.coverage.test.d.ts +0 -2
- package/lib/typescript/tests/component/component.coverage.test.d.ts.map +0 -1
- package/lib/typescript/tests/component/component.interaction.test.d.ts +0 -2
- package/lib/typescript/tests/component/component.interaction.test.d.ts.map +0 -1
- package/lib/typescript/tests/component/component.snapshot.test.d.ts +0 -2
- package/lib/typescript/tests/component/component.snapshot.test.d.ts.map +0 -1
- package/lib/typescript/tests/e2e/app.e2e.test.d.ts +0 -2
- package/lib/typescript/tests/e2e/app.e2e.test.d.ts.map +0 -1
- package/lib/typescript/tests/integration/ui.integration.test.d.ts +0 -2
- package/lib/typescript/tests/integration/ui.integration.test.d.ts.map +0 -1
- package/lib/typescript/tests/unit/mergeStyles.unit.test.d.ts +0 -2
- package/lib/typescript/tests/unit/mergeStyles.unit.test.d.ts.map +0 -1
- package/lib/typescript/tests/unit/public-api.unit.test.d.ts +0 -2
- package/lib/typescript/tests/unit/public-api.unit.test.d.ts.map +0 -1
- package/lib/typescript/tests/unit/theme-config.unit.test.d.ts +0 -2
- package/lib/typescript/tests/unit/theme-config.unit.test.d.ts.map +0 -1
- package/src/theme/config.ts +0 -26
- /package/lib/typescript/{jest.setup.d.ts → commonjs/jest.setup.d.ts} +0 -0
- /package/lib/typescript/{src → commonjs/src}/action-sheet/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/avatar/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/button/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/center/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/center/style/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/chip/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/column/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/column/style/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/divider/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/hooks/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/hooks/useMergeStyles.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/input/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/list-item/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/popover/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/row/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/row/style/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/space/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/space/style/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/text/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/touchable/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/touchable/style/index.d.ts +0 -0
- /package/lib/typescript/{src → commonjs/src}/wave-animation/index.d.ts +0 -0
- /package/lib/typescript/{package.json → module/package.json} +0 -0
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
# Hooks
|
|
2
|
+
|
|
3
|
+
基础组件库的工具 hooks。
|
|
4
|
+
|
|
5
|
+
## mergeStyles
|
|
6
|
+
|
|
7
|
+
按 slot 维度合并多来源样式的纯函数。借鉴 antd v6 `useMergeSemantic`(`components/_util/hooks/useMergeSemantic.ts:69-80`)。
|
|
8
|
+
|
|
9
|
+
### 何时使用
|
|
10
|
+
|
|
11
|
+
- 组件内部合并默认样式 + 变体样式 + 用户传入的 `styles` 语义插槽
|
|
12
|
+
- 构建支持 Semantic Styles 的自定义组件时
|
|
13
|
+
|
|
14
|
+
### 代码演示
|
|
15
|
+
|
|
16
|
+
```tsx
|
|
17
|
+
import {mergeStyles} from '../hooks';
|
|
18
|
+
|
|
19
|
+
type MySemanticStyles = {
|
|
20
|
+
root?: ViewStyle;
|
|
21
|
+
content?: TextStyle;
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
const DEFAULT: MySemanticStyles = {
|
|
25
|
+
root: {padding: 16},
|
|
26
|
+
content: {fontSize: 14, color: tokens.colorText},
|
|
27
|
+
};
|
|
28
|
+
|
|
29
|
+
const MyComponent = ({styles: userStyles}: {styles?: Partial<MySemanticStyles>}) => {
|
|
30
|
+
// ✅ 配合 useMemo,仅 userStyles 变化时重算
|
|
31
|
+
const s = useMemo(
|
|
32
|
+
() => mergeStyles(DEFAULT, userStyles),
|
|
33
|
+
[userStyles],
|
|
34
|
+
);
|
|
35
|
+
|
|
36
|
+
return (
|
|
37
|
+
<View style={s.root}>
|
|
38
|
+
<Text style={s.content}>...</Text>
|
|
39
|
+
</View>
|
|
40
|
+
);
|
|
41
|
+
};
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
### API
|
|
45
|
+
|
|
46
|
+
```ts
|
|
47
|
+
function mergeStyles<T extends Record<string, StyleValue | undefined>>(
|
|
48
|
+
...sources: (Partial<T> | undefined)[]
|
|
49
|
+
): T
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
| 参数 | 说明 | 类型 |
|
|
53
|
+
|------|------|------|
|
|
54
|
+
| sources | 多个样式源,按顺序合并 | `(Partial<T> \| undefined)[]` |
|
|
55
|
+
|
|
56
|
+
### 合并规则
|
|
57
|
+
|
|
58
|
+
- 按 slot key 维度合并(`root`、`content` 等分别合并)
|
|
59
|
+
- 同一 slot 内使用对象展开(`{...prev, ...next}`),后传入的覆盖先传入的
|
|
60
|
+
- `undefined` 源自动跳过
|
|
61
|
+
- 纯函数,不包含 `useMemo`,调用方自行控制缓存
|
|
62
|
+
|
|
63
|
+
### 与 antd v6 对比
|
|
64
|
+
|
|
65
|
+
| 特性 | antd v6 `mergeStyles` | RN 版 `mergeStyles` |
|
|
66
|
+
|------|----------------------|---------------------|
|
|
67
|
+
| classNames 合并 | ✅ | ❌(RN 无 CSS 类名) |
|
|
68
|
+
| schema 嵌套 | ✅ | ❌(当前不需要) |
|
|
69
|
+
| 函数形式 style | ✅ | ❌(不需要动态计算) |
|
|
70
|
+
| slot 展开合并 | ✅ | ✅(核心逻辑一致) |
|
|
71
|
+
| 纯函数 | ✅ | ✅ |
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.mergeStyles = mergeStyles;
|
|
7
|
+
/**
|
|
8
|
+
* 语义样式合并
|
|
9
|
+
*
|
|
10
|
+
* 纯函数版本,调用方通过 useMemo 控制缓存策略。
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* 按 slot 维度合并多来源样式。
|
|
15
|
+
*/
|
|
16
|
+
function mergeStyles(...sources) {
|
|
17
|
+
const merged = {};
|
|
18
|
+
for (const source of sources) {
|
|
19
|
+
if (!source) {
|
|
20
|
+
continue;
|
|
21
|
+
}
|
|
22
|
+
for (const key of Object.keys(source)) {
|
|
23
|
+
merged[key] = {
|
|
24
|
+
...merged[key],
|
|
25
|
+
...source[key]
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
return merged;
|
|
30
|
+
}
|
|
31
|
+
//# sourceMappingURL=useMergeStyles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["mergeStyles","sources","merged","source","key","Object","keys"],"sourceRoot":"../../../src","sources":["hooks/useMergeStyles.ts"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;;AAMA;AACA;AACA;AACO,SAASA,WAAWA,CACzB,GAAGC,OAAmC,EACnC;EACH,MAAMC,MAAM,GAAG,CAAC,CAA+B;EAC/C,KAAK,MAAMC,MAAM,IAAIF,OAAO,EAAE;IAC5B,IAAI,CAACE,MAAM,EAAE;MACX;IACF;IACA,KAAK,MAAMC,GAAG,IAAIC,MAAM,CAACC,IAAI,CAACH,MAAM,CAAC,EAAE;MACrCD,MAAM,CAACE,GAAG,CAAC,GAAG;QAAE,GAAIF,MAAM,CAACE,GAAG,CAAY;QAAE,GAAID,MAAM,CAACC,GAAG;MAAa,CAAC;IAC1E;EACF;EACA,OAAOF,MAAM;AACf","ignoreList":[]}
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "ActionSheet", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _actionSheet.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "Avatar", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _avatar.default;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
Object.defineProperty(exports, "Button", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () {
|
|
21
|
+
return _button.default;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
Object.defineProperty(exports, "Center", {
|
|
25
|
+
enumerable: true,
|
|
26
|
+
get: function () {
|
|
27
|
+
return _center.default;
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
Object.defineProperty(exports, "Chip", {
|
|
31
|
+
enumerable: true,
|
|
32
|
+
get: function () {
|
|
33
|
+
return _chip.default;
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
Object.defineProperty(exports, "Column", {
|
|
37
|
+
enumerable: true,
|
|
38
|
+
get: function () {
|
|
39
|
+
return _column.default;
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
Object.defineProperty(exports, "ConfigProvider", {
|
|
43
|
+
enumerable: true,
|
|
44
|
+
get: function () {
|
|
45
|
+
return _context.ConfigProvider;
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
Object.defineProperty(exports, "Divider", {
|
|
49
|
+
enumerable: true,
|
|
50
|
+
get: function () {
|
|
51
|
+
return _divider.default;
|
|
52
|
+
}
|
|
53
|
+
});
|
|
54
|
+
Object.defineProperty(exports, "Input", {
|
|
55
|
+
enumerable: true,
|
|
56
|
+
get: function () {
|
|
57
|
+
return _input.default;
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
Object.defineProperty(exports, "ListItem", {
|
|
61
|
+
enumerable: true,
|
|
62
|
+
get: function () {
|
|
63
|
+
return _listItem.default;
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
Object.defineProperty(exports, "Menu", {
|
|
67
|
+
enumerable: true,
|
|
68
|
+
get: function () {
|
|
69
|
+
return _menu.default;
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
Object.defineProperty(exports, "Popover", {
|
|
73
|
+
enumerable: true,
|
|
74
|
+
get: function () {
|
|
75
|
+
return _popover.default;
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
Object.defineProperty(exports, "Row", {
|
|
79
|
+
enumerable: true,
|
|
80
|
+
get: function () {
|
|
81
|
+
return _row.default;
|
|
82
|
+
}
|
|
83
|
+
});
|
|
84
|
+
Object.defineProperty(exports, "Space", {
|
|
85
|
+
enumerable: true,
|
|
86
|
+
get: function () {
|
|
87
|
+
return _space.default;
|
|
88
|
+
}
|
|
89
|
+
});
|
|
90
|
+
Object.defineProperty(exports, "Text", {
|
|
91
|
+
enumerable: true,
|
|
92
|
+
get: function () {
|
|
93
|
+
return _text.default;
|
|
94
|
+
}
|
|
95
|
+
});
|
|
96
|
+
Object.defineProperty(exports, "Touchable", {
|
|
97
|
+
enumerable: true,
|
|
98
|
+
get: function () {
|
|
99
|
+
return _touchable.default;
|
|
100
|
+
}
|
|
101
|
+
});
|
|
102
|
+
Object.defineProperty(exports, "WaveAnimation", {
|
|
103
|
+
enumerable: true,
|
|
104
|
+
get: function () {
|
|
105
|
+
return _waveAnimation.default;
|
|
106
|
+
}
|
|
107
|
+
});
|
|
108
|
+
Object.defineProperty(exports, "defaultTokens", {
|
|
109
|
+
enumerable: true,
|
|
110
|
+
get: function () {
|
|
111
|
+
return _tokens.defaultTokens;
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
Object.defineProperty(exports, "mergeStyles", {
|
|
115
|
+
enumerable: true,
|
|
116
|
+
get: function () {
|
|
117
|
+
return _hooks.mergeStyles;
|
|
118
|
+
}
|
|
119
|
+
});
|
|
120
|
+
Object.defineProperty(exports, "useTokens", {
|
|
121
|
+
enumerable: true,
|
|
122
|
+
get: function () {
|
|
123
|
+
return _context.useTokens;
|
|
124
|
+
}
|
|
125
|
+
});
|
|
126
|
+
var _context = require("./theme/context");
|
|
127
|
+
var _tokens = require("./theme/tokens");
|
|
128
|
+
var _hooks = require("./hooks");
|
|
129
|
+
var _row = _interopRequireDefault(require("./row"));
|
|
130
|
+
var _column = _interopRequireDefault(require("./column"));
|
|
131
|
+
var _center = _interopRequireDefault(require("./center"));
|
|
132
|
+
var _space = _interopRequireDefault(require("./space"));
|
|
133
|
+
var _text = _interopRequireDefault(require("./text"));
|
|
134
|
+
var _button = _interopRequireDefault(require("./button"));
|
|
135
|
+
var _divider = _interopRequireDefault(require("./divider"));
|
|
136
|
+
var _listItem = _interopRequireDefault(require("./list-item"));
|
|
137
|
+
var _touchable = _interopRequireDefault(require("./touchable"));
|
|
138
|
+
var _avatar = _interopRequireDefault(require("./avatar"));
|
|
139
|
+
var _waveAnimation = _interopRequireDefault(require("./wave-animation"));
|
|
140
|
+
var _input = _interopRequireDefault(require("./input"));
|
|
141
|
+
var _chip = _interopRequireDefault(require("./chip"));
|
|
142
|
+
var _actionSheet = _interopRequireDefault(require("./action-sheet"));
|
|
143
|
+
var _popover = _interopRequireDefault(require("./popover"));
|
|
144
|
+
var _menu = _interopRequireDefault(require("./menu"));
|
|
145
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
146
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_context","require","_tokens","_hooks","_row","_interopRequireDefault","_column","_center","_space","_text","_button","_divider","_listItem","_touchable","_avatar","_waveAnimation","_input","_chip","_actionSheet","_popover","_menu","e","__esModule","default"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,IAAAA,QAAA,GAAAC,OAAA;AAEA,IAAAC,OAAA,GAAAD,OAAA;AAIA,IAAAE,MAAA,GAAAF,OAAA;AAGA,IAAAG,IAAA,GAAAC,sBAAA,CAAAJ,OAAA;AAEA,IAAAK,OAAA,GAAAD,sBAAA,CAAAJ,OAAA;AAEA,IAAAM,OAAA,GAAAF,sBAAA,CAAAJ,OAAA;AAEA,IAAAO,MAAA,GAAAH,sBAAA,CAAAJ,OAAA;AAIA,IAAAQ,KAAA,GAAAJ,sBAAA,CAAAJ,OAAA;AAEA,IAAAS,OAAA,GAAAL,sBAAA,CAAAJ,OAAA;AAGA,IAAAU,QAAA,GAAAN,sBAAA,CAAAJ,OAAA;AACA,IAAAW,SAAA,GAAAP,sBAAA,CAAAJ,OAAA;AACA,IAAAY,UAAA,GAAAR,sBAAA,CAAAJ,OAAA;AAIA,IAAAa,OAAA,GAAAT,sBAAA,CAAAJ,OAAA;AAGA,IAAAc,cAAA,GAAAV,sBAAA,CAAAJ,OAAA;AAIA,IAAAe,MAAA,GAAAX,sBAAA,CAAAJ,OAAA;AAGA,IAAAgB,KAAA,GAAAZ,sBAAA,CAAAJ,OAAA;AAGA,IAAAiB,YAAA,GAAAb,sBAAA,CAAAJ,OAAA;AAGA,IAAAkB,QAAA,GAAAd,sBAAA,CAAAJ,OAAA;AAGA,IAAAmB,KAAA,GAAAf,sBAAA,CAAAJ,OAAA;AAAyC,SAAAI,uBAAAgB,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA","ignoreList":[]}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _hooks = require("../hooks");
|
|
10
|
+
var _context = require("../theme/context");
|
|
11
|
+
var _style = require("./style");
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
14
|
+
/**
|
|
15
|
+
* Input 基础组件
|
|
16
|
+
*
|
|
17
|
+
* TextInput 容器,支持多行、工具栏插槽、自动聚焦。
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
const Input = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
21
|
+
value,
|
|
22
|
+
onChangeText,
|
|
23
|
+
placeholder,
|
|
24
|
+
multiline = false,
|
|
25
|
+
maxLength,
|
|
26
|
+
maxHeight,
|
|
27
|
+
autoFocus,
|
|
28
|
+
returnKeyType,
|
|
29
|
+
onSubmitEditing,
|
|
30
|
+
onBlur,
|
|
31
|
+
onFocus,
|
|
32
|
+
disabled,
|
|
33
|
+
toolbar,
|
|
34
|
+
style,
|
|
35
|
+
styles: semanticStyles,
|
|
36
|
+
testID
|
|
37
|
+
}, ref) => {
|
|
38
|
+
const inputRef = (0, _react.useRef)(null);
|
|
39
|
+
const tokens = (0, _context.useTokens)();
|
|
40
|
+
const defaultStyles = (0, _react.useMemo)(() => (0, _style.createDefaultStyles)(tokens), [tokens]);
|
|
41
|
+
_react.default.useImperativeHandle(ref, () => inputRef.current);
|
|
42
|
+
const s = (0, _react.useMemo)(() => (0, _hooks.mergeStyles)(defaultStyles, semanticStyles), [defaultStyles, semanticStyles]);
|
|
43
|
+
(0, _react.useEffect)(() => {
|
|
44
|
+
if (autoFocus) {
|
|
45
|
+
inputRef.current?.focus();
|
|
46
|
+
}
|
|
47
|
+
}, [autoFocus]);
|
|
48
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
49
|
+
style: [s.root, style],
|
|
50
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TextInput, {
|
|
51
|
+
ref: inputRef,
|
|
52
|
+
testID: testID,
|
|
53
|
+
style: [s.input, maxHeight ? {
|
|
54
|
+
maxHeight
|
|
55
|
+
} : undefined],
|
|
56
|
+
value: value,
|
|
57
|
+
onChangeText: onChangeText,
|
|
58
|
+
placeholder: placeholder,
|
|
59
|
+
placeholderTextColor: tokens.colorTextPlaceholder,
|
|
60
|
+
multiline: multiline,
|
|
61
|
+
maxLength: maxLength,
|
|
62
|
+
returnKeyType: returnKeyType,
|
|
63
|
+
onSubmitEditing: onSubmitEditing,
|
|
64
|
+
onBlur: onBlur,
|
|
65
|
+
onFocus: onFocus,
|
|
66
|
+
editable: !disabled,
|
|
67
|
+
blurOnSubmit: false
|
|
68
|
+
}), toolbar && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
69
|
+
style: s.toolbar,
|
|
70
|
+
children: toolbar
|
|
71
|
+
})]
|
|
72
|
+
});
|
|
73
|
+
});
|
|
74
|
+
Input.displayName = 'Input';
|
|
75
|
+
var _default = exports.default = Input;
|
|
76
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_hooks","_context","_style","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Input","forwardRef","value","onChangeText","placeholder","multiline","maxLength","maxHeight","autoFocus","returnKeyType","onSubmitEditing","onBlur","onFocus","disabled","toolbar","style","styles","semanticStyles","testID","ref","inputRef","useRef","tokens","useTokens","defaultStyles","useMemo","createDefaultStyles","React","useImperativeHandle","current","s","mergeStyles","useEffect","focus","jsxs","View","root","children","jsx","TextInput","input","undefined","placeholderTextColor","colorTextPlaceholder","editable","blurOnSubmit","displayName","_default","exports"],"sourceRoot":"../../../src","sources":["input/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: Input
|
|
3
|
+
nav:
|
|
4
|
+
title: 组件
|
|
5
|
+
order: 1
|
|
6
|
+
group:
|
|
7
|
+
title: 基础
|
|
8
|
+
order: 2
|
|
9
|
+
---
|
|
10
|
+
|
|
11
|
+
# Input 输入框
|
|
12
|
+
|
|
13
|
+
TextInput 容器,支持多行输入、底部工具栏和自动聚焦。
|
|
14
|
+
|
|
15
|
+
## 何时使用
|
|
16
|
+
|
|
17
|
+
- 需要文本输入时
|
|
18
|
+
- 需要带工具栏的输入框时
|
|
19
|
+
- 聊天输入场景
|
|
20
|
+
|
|
21
|
+
## 代码演示
|
|
22
|
+
|
|
23
|
+
```tsx
|
|
24
|
+
import { Input, Icon } from '@unif/react-native-ui';
|
|
25
|
+
|
|
26
|
+
// 基本用法
|
|
27
|
+
<Input
|
|
28
|
+
value={text}
|
|
29
|
+
onChangeText={setText}
|
|
30
|
+
placeholder="请输入..."
|
|
31
|
+
/>
|
|
32
|
+
|
|
33
|
+
// 多行 + 工具栏
|
|
34
|
+
<Input
|
|
35
|
+
multiline
|
|
36
|
+
maxHeight={100}
|
|
37
|
+
autoFocus
|
|
38
|
+
toolbar={
|
|
39
|
+
<View style={{ flexDirection: 'row' }}>
|
|
40
|
+
<Icon name="mic-outline" size={24} />
|
|
41
|
+
</View>
|
|
42
|
+
}
|
|
43
|
+
/>
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
## API
|
|
47
|
+
|
|
48
|
+
| 属性 | 说明 | 类型 | 默认值 |
|
|
49
|
+
| --------------- | ---------------- | ---------------------- | ------- |
|
|
50
|
+
| value | 输入值 | `string` | - |
|
|
51
|
+
| onChangeText | 文本变化回调 | `(text: string) => void` | - |
|
|
52
|
+
| placeholder | 占位文本 | `string` | - |
|
|
53
|
+
| multiline | 多行模式 | `boolean` | `false` |
|
|
54
|
+
| maxLength | 最大字符数 | `number` | - |
|
|
55
|
+
| maxHeight | 最大高度 | `number` | - |
|
|
56
|
+
| autoFocus | 自动聚焦 | `boolean` | - |
|
|
57
|
+
| returnKeyType | 回车键类型 | `ReturnKeyTypeOptions` | - |
|
|
58
|
+
| onSubmitEditing | 提交回调 | `() => void` | - |
|
|
59
|
+
| onBlur | 失焦回调 | `() => void` | - |
|
|
60
|
+
| onFocus | 聚焦回调 | `() => void` | - |
|
|
61
|
+
| disabled | 禁用状态 | `boolean` | - |
|
|
62
|
+
| toolbar | 底部工具栏 | `ReactNode` | - |
|
|
63
|
+
| style | 容器样式 | `ViewStyle` | - |
|
|
64
|
+
| styles | 语义样式 | `InputSemanticStyles` | - |
|
|
65
|
+
| testID | 测试标识 | `string` | - |
|
|
66
|
+
|
|
67
|
+
## Semantic Styles
|
|
68
|
+
|
|
69
|
+
| Slot | 说明 |
|
|
70
|
+
| ------- | -------------- |
|
|
71
|
+
| root | 外层容器 |
|
|
72
|
+
| input | TextInput 本身 |
|
|
73
|
+
| toolbar | 工具栏容器 |
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.createDefaultStyles = void 0;
|
|
7
|
+
var _reactNative = require("react-native");
|
|
8
|
+
const createDefaultStyles = t => ({
|
|
9
|
+
root: {
|
|
10
|
+
backgroundColor: t.colorBgElevated,
|
|
11
|
+
borderRadius: t.radiusXl,
|
|
12
|
+
paddingHorizontal: 12,
|
|
13
|
+
paddingTop: 8,
|
|
14
|
+
paddingBottom: 6,
|
|
15
|
+
...t.shadow
|
|
16
|
+
},
|
|
17
|
+
input: {
|
|
18
|
+
fontSize: t.fontSize,
|
|
19
|
+
color: t.colorText,
|
|
20
|
+
lineHeight: t.lineHeight,
|
|
21
|
+
paddingVertical: _reactNative.Platform.OS === 'ios' ? 4 : 2,
|
|
22
|
+
paddingHorizontal: 4
|
|
23
|
+
},
|
|
24
|
+
toolbar: {
|
|
25
|
+
flexDirection: 'row',
|
|
26
|
+
alignItems: 'center',
|
|
27
|
+
paddingTop: 4
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
exports.createDefaultStyles = createDefaultStyles;
|
|
31
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNative","require","createDefaultStyles","t","root","backgroundColor","colorBgElevated","borderRadius","radiusXl","paddingHorizontal","paddingTop","paddingBottom","shadow","input","fontSize","color","colorText","lineHeight","paddingVertical","Platform","OS","toolbar","flexDirection","alignItems","exports"],"sourceRoot":"../../../../src","sources":["input/style/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAUO,MAAMC,mBAAmB,GAAIC,CAAS,KAA2B;EACtEC,IAAI,EAAE;IACJC,eAAe,EAAEF,CAAC,CAACG,eAAe;IAClCC,YAAY,EAAEJ,CAAC,CAACK,QAAQ;IACxBC,iBAAiB,EAAE,EAAE;IACrBC,UAAU,EAAE,CAAC;IACbC,aAAa,EAAE,CAAC;IAChB,GAAGR,CAAC,CAACS;EACP,CAAC;EACDC,KAAK,EAAE;IACLC,QAAQ,EAAEX,CAAC,CAACW,QAAQ;IACpBC,KAAK,EAAEZ,CAAC,CAACa,SAAS;IAClBC,UAAU,EAAEd,CAAC,CAACc,UAAU;IACxBC,eAAe,EAAEC,qBAAQ,CAACC,EAAE,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC;IAC9CX,iBAAiB,EAAE;EACrB,CAAC;EACDY,OAAO,EAAE;IACPC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBb,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAACc,OAAA,CAAAtB,mBAAA,GAAAA,mBAAA","ignoreList":[]}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _hooks = require("../hooks");
|
|
10
|
+
var _context = require("../theme/context");
|
|
11
|
+
var _style = require("./style");
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
14
|
+
/**
|
|
15
|
+
* 列表行组件
|
|
16
|
+
*
|
|
17
|
+
* 语义 slot:root / content / description / extra。
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
const ListItem = ({
|
|
21
|
+
thumb,
|
|
22
|
+
title,
|
|
23
|
+
description,
|
|
24
|
+
extra,
|
|
25
|
+
arrow,
|
|
26
|
+
arrowIcon,
|
|
27
|
+
style,
|
|
28
|
+
styles: semanticStyles,
|
|
29
|
+
...props
|
|
30
|
+
}) => {
|
|
31
|
+
const tokens = (0, _context.useTokens)();
|
|
32
|
+
const defaultStyles = (0, _react.useMemo)(() => (0, _style.createDefaultStyles)(tokens), [tokens]);
|
|
33
|
+
const defaultArrowStyle = (0, _react.useMemo)(() => ({
|
|
34
|
+
fontSize: 18,
|
|
35
|
+
color: tokens.colorTextSecondary
|
|
36
|
+
}), [tokens]);
|
|
37
|
+
const s = (0, _react.useMemo)(() => (0, _hooks.mergeStyles)(defaultStyles, semanticStyles), [defaultStyles, semanticStyles]);
|
|
38
|
+
const content = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
39
|
+
style: [s.root, style],
|
|
40
|
+
children: [thumb, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
41
|
+
style: _style.lineStyle,
|
|
42
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
43
|
+
style: _style.contentWrapStyle,
|
|
44
|
+
children: [typeof title === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
45
|
+
style: s.content,
|
|
46
|
+
children: title
|
|
47
|
+
}) : title, description != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
48
|
+
style: s.description,
|
|
49
|
+
numberOfLines: 1,
|
|
50
|
+
children: description
|
|
51
|
+
})]
|
|
52
|
+
}), extra != null && (typeof extra === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
53
|
+
style: s.extra,
|
|
54
|
+
children: extra
|
|
55
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
56
|
+
style: s.extra,
|
|
57
|
+
children: extra
|
|
58
|
+
})), arrow && (arrowIcon ?? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
59
|
+
style: defaultArrowStyle,
|
|
60
|
+
children: "\u203A"
|
|
61
|
+
}))]
|
|
62
|
+
})]
|
|
63
|
+
});
|
|
64
|
+
if (props.onPress) {
|
|
65
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
|
|
66
|
+
onPress: props.onPress,
|
|
67
|
+
onLongPress: props.onLongPress,
|
|
68
|
+
disabled: props.disabled,
|
|
69
|
+
testID: props.testID,
|
|
70
|
+
children: content
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
return content;
|
|
74
|
+
};
|
|
75
|
+
var _default = exports.default = ListItem;
|
|
76
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_hooks","_context","_style","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItem","thumb","title","description","extra","arrow","arrowIcon","style","styles","semanticStyles","props","tokens","useTokens","defaultStyles","useMemo","createDefaultStyles","defaultArrowStyle","fontSize","color","colorTextSecondary","s","mergeStyles","content","jsxs","View","root","children","lineStyle","contentWrapStyle","jsx","Text","numberOfLines","onPress","Pressable","onLongPress","disabled","testID","_default","exports"],"sourceRoot":"../../../src","sources":["list-item/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
# ListItem 列表行
|
|
2
|
+
|
|
3
|
+
4 个语义 slot(root / content / description / extra),支持 `styles` 精确覆盖。
|
|
4
|
+
|
|
5
|
+
## 何时使用
|
|
6
|
+
|
|
7
|
+
- 替代 `<TouchableOpacity>` + icon + text + arrow 的手写列表行
|
|
8
|
+
- 统一列表行样式:设置菜单、选择列表、会话列表等
|
|
9
|
+
|
|
10
|
+
## 代码演示
|
|
11
|
+
|
|
12
|
+
```tsx
|
|
13
|
+
// 基础 — 带箭头
|
|
14
|
+
<ListItem title="关于" arrow onPress={handleAbout} />
|
|
15
|
+
|
|
16
|
+
// 带右侧额外信息
|
|
17
|
+
<ListItem title="关于" extra="v1.0.0" onPress={handleAbout} />
|
|
18
|
+
|
|
19
|
+
// 带左侧图标
|
|
20
|
+
<ListItem
|
|
21
|
+
thumb={<Icon name="information-circle-outline" size={22} color={tokens.colorTextSecondary} />}
|
|
22
|
+
title="关于"
|
|
23
|
+
extra="v1.0.0"
|
|
24
|
+
onPress={handleAbout}
|
|
25
|
+
/>
|
|
26
|
+
|
|
27
|
+
// 带描述文字(双行)
|
|
28
|
+
<ListItem
|
|
29
|
+
thumb={<Icon name="chatbubble-outline" size={16} />}
|
|
30
|
+
title="今天的会话"
|
|
31
|
+
description="最后一条消息预览..."
|
|
32
|
+
onPress={handleSelect}
|
|
33
|
+
onLongPress={handleDelete}
|
|
34
|
+
/>
|
|
35
|
+
|
|
36
|
+
// 语义插槽覆盖 — 选中态
|
|
37
|
+
<ListItem
|
|
38
|
+
title={model.name}
|
|
39
|
+
description={model.desc}
|
|
40
|
+
extra={isSelected ? <Icon name="checkmark-circle" size={22} color={tokens.colorPrimary} /> : undefined}
|
|
41
|
+
onPress={() => handleSelect(model.id)}
|
|
42
|
+
styles={isSelected ? {
|
|
43
|
+
root: {backgroundColor: '#FFF7F0'},
|
|
44
|
+
content: {color: tokens.colorPrimary},
|
|
45
|
+
} : undefined}
|
|
46
|
+
/>
|
|
47
|
+
|
|
48
|
+
// 语义插槽覆盖 — 危险操作
|
|
49
|
+
<ListItem
|
|
50
|
+
thumb={<Icon name="log-out-outline" size={22} color={tokens.colorError} />}
|
|
51
|
+
title="退出登录"
|
|
52
|
+
onPress={handleLogout}
|
|
53
|
+
styles={{content: {color: tokens.colorError}}}
|
|
54
|
+
/>
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
## API
|
|
58
|
+
|
|
59
|
+
| 属性 | 说明 | 类型 | 默认值 |
|
|
60
|
+
|------|------|------|--------|
|
|
61
|
+
| thumb | 左侧缩略(图标、头像等) | `ReactNode` | - |
|
|
62
|
+
| title | 主标题 | `string` \| `ReactNode` | **必填** |
|
|
63
|
+
| description | 描述文字(单行截断) | `string` | - |
|
|
64
|
+
| extra | 右侧额外内容 | `ReactNode` \| `string` | - |
|
|
65
|
+
| arrow | 显示右箭头 | `boolean` | `false` |
|
|
66
|
+
| onPress | 点击回调(有值时渲染为 Pressable) | `() => void` | - |
|
|
67
|
+
| onLongPress | 长按回调 | `() => void` | - |
|
|
68
|
+
| disabled | 禁用状态 | `boolean` | `false` |
|
|
69
|
+
| style | 外层容器样式 | `ViewStyle` | - |
|
|
70
|
+
| styles | 语义插槽样式 | `Partial<ListItemSemanticStyles>` | - |
|
|
71
|
+
| testID | 测试标识 | `string` | - |
|
|
72
|
+
|
|
73
|
+
## Semantic Styles
|
|
74
|
+
|
|
75
|
+
通过 `styles` prop 精确覆盖组件内部各 slot 的样式。
|
|
76
|
+
|
|
77
|
+
| 插槽 | 类型 | 说明 |
|
|
78
|
+
|------|------|------|
|
|
79
|
+
| root | `ViewStyle` | 整行容器(padding、背景等) |
|
|
80
|
+
| content | `TextStyle` | 主标题文字(字号、颜色、flex 等) |
|
|
81
|
+
| description | `TextStyle` | 描述文字(字号、颜色等) |
|
|
82
|
+
| extra | `ViewStyle & TextStyle` | 右侧额外内容区域 |
|
|
83
|
+
|
|
84
|
+
## 内部布局
|
|
85
|
+
|
|
86
|
+
```
|
|
87
|
+
┌─ root ──────────────────────────────────┐
|
|
88
|
+
│ [thumb] ┌─ line ─────────────────────┐ │
|
|
89
|
+
│ │ ┌─ contentWrap ──────────┐ │ │
|
|
90
|
+
│ │ │ [content] │ │ │
|
|
91
|
+
│ │ │ [description] │ │ │
|
|
92
|
+
│ │ └────────────────────────┘ │ │
|
|
93
|
+
│ │ [extra] [arrow] │ │
|
|
94
|
+
│ └────────────────────────────┘ │
|
|
95
|
+
└─────────────────────────────────────────┘
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
## 交互行为
|
|
99
|
+
|
|
100
|
+
- 有 `onPress` 时自动包裹 `Pressable`,无 `onPress` 时渲染为纯 `View`
|
|
101
|
+
- `onLongPress` 仅在有 `onPress` 时生效
|