@demlanide/react-lucky-components 0.1.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/README.md +184 -0
- package/dist/Alert/Alert.d.ts +3 -0
- package/dist/Alert/Alert.d.ts.map +1 -0
- package/dist/Alert/Alert.js +7 -0
- package/dist/Alert/constants.d.ts +38 -0
- package/dist/Alert/constants.d.ts.map +1 -0
- package/dist/Alert/constants.js +34 -0
- package/dist/Alert/index.d.ts +3 -0
- package/dist/Alert/index.d.ts.map +1 -0
- package/dist/Alert/index.js +1 -0
- package/dist/Alert/styles.d.ts +11 -0
- package/dist/Alert/styles.d.ts.map +1 -0
- package/dist/Alert/styles.js +49 -0
- package/dist/Alert/types.d.ts +20 -0
- package/dist/Alert/types.d.ts.map +1 -0
- package/dist/Alert/types.js +1 -0
- package/dist/Avatar/Avatar.d.ts +3 -0
- package/dist/Avatar/Avatar.d.ts.map +1 -0
- package/dist/Avatar/Avatar.js +33 -0
- package/dist/Avatar/Shapes/.map.json +42 -0
- package/dist/Avatar/Shapes/romb.png +0 -0
- package/dist/Avatar/consts.d.ts +21 -0
- package/dist/Avatar/consts.d.ts.map +1 -0
- package/dist/Avatar/consts.js +20 -0
- package/dist/Avatar/index.d.ts +3 -0
- package/dist/Avatar/index.d.ts.map +1 -0
- package/dist/Avatar/index.js +1 -0
- package/dist/Avatar/styles.d.ts +27 -0
- package/dist/Avatar/styles.d.ts.map +1 -0
- package/dist/Avatar/styles.js +83 -0
- package/dist/Avatar/types.d.ts +31 -0
- package/dist/Avatar/types.d.ts.map +1 -0
- package/dist/Avatar/types.js +1 -0
- package/dist/Avatar/utilities.d.ts +8 -0
- package/dist/Avatar/utilities.d.ts.map +1 -0
- package/dist/Avatar/utilities.js +66 -0
- package/dist/Badge/Badge.d.ts +3 -0
- package/dist/Badge/Badge.d.ts.map +1 -0
- package/dist/Badge/Badge.js +8 -0
- package/dist/Badge/constants.d.ts +20 -0
- package/dist/Badge/constants.d.ts.map +1 -0
- package/dist/Badge/constants.js +32 -0
- package/dist/Badge/index.d.ts +3 -0
- package/dist/Badge/index.d.ts.map +1 -0
- package/dist/Badge/index.js +1 -0
- package/dist/Badge/styles.d.ts +10 -0
- package/dist/Badge/styles.d.ts.map +1 -0
- package/dist/Badge/styles.js +28 -0
- package/dist/Badge/types.d.ts +18 -0
- package/dist/Badge/types.d.ts.map +1 -0
- package/dist/Badge/types.js +1 -0
- package/dist/BigInput/BigInput.d.ts +3 -0
- package/dist/BigInput/BigInput.d.ts.map +1 -0
- package/dist/BigInput/BigInput.js +46 -0
- package/dist/BigInput/constants.d.ts +32 -0
- package/dist/BigInput/constants.d.ts.map +1 -0
- package/dist/BigInput/constants.js +31 -0
- package/dist/BigInput/index.d.ts +3 -0
- package/dist/BigInput/index.d.ts.map +1 -0
- package/dist/BigInput/index.js +1 -0
- package/dist/BigInput/styles.d.ts +14 -0
- package/dist/BigInput/styles.d.ts.map +1 -0
- package/dist/BigInput/styles.js +80 -0
- package/dist/BigInput/types.d.ts +23 -0
- package/dist/BigInput/types.d.ts.map +1 -0
- package/dist/BigInput/types.js +1 -0
- package/dist/Button/Button.d.ts +3 -0
- package/dist/Button/Button.d.ts.map +1 -0
- package/dist/Button/Button.js +7 -0
- package/dist/Button/constants.d.ts +23 -0
- package/dist/Button/constants.d.ts.map +1 -0
- package/dist/Button/constants.js +28 -0
- package/dist/Button/index.d.ts +3 -0
- package/dist/Button/index.d.ts.map +1 -0
- package/dist/Button/index.js +1 -0
- package/dist/Button/styles.d.ts +13 -0
- package/dist/Button/styles.d.ts.map +1 -0
- package/dist/Button/styles.js +34 -0
- package/dist/Button/types.d.ts +20 -0
- package/dist/Button/types.d.ts.map +1 -0
- package/dist/Button/types.js +1 -0
- package/dist/CardStack/BehindCard.d.ts +12 -0
- package/dist/CardStack/BehindCard.d.ts.map +1 -0
- package/dist/CardStack/BehindCard.js +18 -0
- package/dist/CardStack/CardStack.d.ts +3 -0
- package/dist/CardStack/CardStack.d.ts.map +1 -0
- package/dist/CardStack/CardStack.js +77 -0
- package/dist/CardStack/CardStackDots.d.ts +3 -0
- package/dist/CardStack/CardStackDots.d.ts.map +1 -0
- package/dist/CardStack/CardStackDots.js +121 -0
- package/dist/CardStack/StackCard.d.ts +27 -0
- package/dist/CardStack/StackCard.d.ts.map +1 -0
- package/dist/CardStack/StackCard.js +45 -0
- package/dist/CardStack/constants.d.ts +32 -0
- package/dist/CardStack/constants.d.ts.map +1 -0
- package/dist/CardStack/constants.js +31 -0
- package/dist/CardStack/index.d.ts +4 -0
- package/dist/CardStack/index.d.ts.map +1 -0
- package/dist/CardStack/index.js +2 -0
- package/dist/CardStack/types.d.ts +39 -0
- package/dist/CardStack/types.d.ts.map +1 -0
- package/dist/CardStack/types.js +1 -0
- package/dist/CardStack/useSwipeGesture.d.ts +18 -0
- package/dist/CardStack/useSwipeGesture.d.ts.map +1 -0
- package/dist/CardStack/useSwipeGesture.js +70 -0
- package/dist/DatePicker/CalendarModal.d.ts +15 -0
- package/dist/DatePicker/CalendarModal.d.ts.map +1 -0
- package/dist/DatePicker/CalendarModal.js +129 -0
- package/dist/DatePicker/DatePicker.d.ts +3 -0
- package/dist/DatePicker/DatePicker.d.ts.map +1 -0
- package/dist/DatePicker/DatePicker.js +57 -0
- package/dist/DatePicker/DayCell.d.ts +14 -0
- package/dist/DatePicker/DayCell.d.ts.map +1 -0
- package/dist/DatePicker/DayCell.js +16 -0
- package/dist/DatePicker/constants.d.ts +46 -0
- package/dist/DatePicker/constants.d.ts.map +1 -0
- package/dist/DatePicker/constants.js +51 -0
- package/dist/DatePicker/icons.d.ts +4 -0
- package/dist/DatePicker/icons.d.ts.map +1 -0
- package/dist/DatePicker/icons.js +12 -0
- package/dist/DatePicker/index.d.ts +3 -0
- package/dist/DatePicker/index.d.ts.map +1 -0
- package/dist/DatePicker/index.js +1 -0
- package/dist/DatePicker/styles.d.ts +40 -0
- package/dist/DatePicker/styles.d.ts.map +1 -0
- package/dist/DatePicker/styles.js +134 -0
- package/dist/DatePicker/types.d.ts +39 -0
- package/dist/DatePicker/types.d.ts.map +1 -0
- package/dist/DatePicker/types.js +1 -0
- package/dist/DatePicker/utils.d.ts +15 -0
- package/dist/DatePicker/utils.d.ts.map +1 -0
- package/dist/DatePicker/utils.js +133 -0
- package/dist/DimmedScrollView/DimmedScrollView.d.ts +5 -0
- package/dist/DimmedScrollView/DimmedScrollView.d.ts.map +1 -0
- package/dist/DimmedScrollView/DimmedScrollView.js +18 -0
- package/dist/DimmedScrollView/index.d.ts +3 -0
- package/dist/DimmedScrollView/index.d.ts.map +1 -0
- package/dist/DimmedScrollView/index.js +1 -0
- package/dist/DimmedScrollView/styles.d.ts +15 -0
- package/dist/DimmedScrollView/styles.d.ts.map +1 -0
- package/dist/DimmedScrollView/styles.js +32 -0
- package/dist/DimmedScrollView/types.d.ts +20 -0
- package/dist/DimmedScrollView/types.d.ts.map +1 -0
- package/dist/DimmedScrollView/types.js +1 -0
- package/dist/FadingEdge/FadingEdge.d.ts +3 -0
- package/dist/FadingEdge/FadingEdge.d.ts.map +1 -0
- package/dist/FadingEdge/FadingEdge.js +30 -0
- package/dist/FadingEdge/index.d.ts +3 -0
- package/dist/FadingEdge/index.d.ts.map +1 -0
- package/dist/FadingEdge/index.js +1 -0
- package/dist/FadingEdge/types.d.ts +14 -0
- package/dist/FadingEdge/types.d.ts.map +1 -0
- package/dist/FadingEdge/types.js +1 -0
- package/dist/Icon/Icon.d.ts +6 -0
- package/dist/Icon/Icon.d.ts.map +1 -0
- package/dist/Icon/Icon.js +16 -0
- package/dist/Icon/defaults.d.ts +7 -0
- package/dist/Icon/defaults.d.ts.map +1 -0
- package/dist/Icon/defaults.js +80 -0
- package/dist/Icon/icons/navigation.d.ts +10 -0
- package/dist/Icon/icons/navigation.d.ts.map +1 -0
- package/dist/Icon/icons/navigation.js +10 -0
- package/dist/Icon/icons/system.d.ts +29 -0
- package/dist/Icon/icons/system.d.ts.map +1 -0
- package/dist/Icon/icons/system.js +29 -0
- package/dist/Icon/icons/tabs.d.ts +6 -0
- package/dist/Icon/icons/tabs.d.ts.map +1 -0
- package/dist/Icon/icons/tabs.js +6 -0
- package/dist/Icon/index.d.ts +3 -0
- package/dist/Icon/index.d.ts.map +1 -0
- package/dist/Icon/index.js +1 -0
- package/dist/Icon/registry.d.ts +3 -0
- package/dist/Icon/registry.d.ts.map +1 -0
- package/dist/Icon/registry.js +43 -0
- package/dist/Icon/types.d.ts +20 -0
- package/dist/Icon/types.d.ts.map +1 -0
- package/dist/Icon/types.js +40 -0
- package/dist/Input/Input.d.ts +5 -0
- package/dist/Input/Input.d.ts.map +1 -0
- package/dist/Input/Input.js +64 -0
- package/dist/Input/constants.d.ts +56 -0
- package/dist/Input/constants.d.ts.map +1 -0
- package/dist/Input/constants.js +61 -0
- package/dist/Input/index.d.ts +3 -0
- package/dist/Input/index.d.ts.map +1 -0
- package/dist/Input/index.js +1 -0
- package/dist/Input/styles.d.ts +23 -0
- package/dist/Input/styles.d.ts.map +1 -0
- package/dist/Input/styles.js +99 -0
- package/dist/Input/types.d.ts +21 -0
- package/dist/Input/types.d.ts.map +1 -0
- package/dist/Input/types.js +1 -0
- package/dist/ListCell/CheckMark.d.ts +10 -0
- package/dist/ListCell/CheckMark.d.ts.map +1 -0
- package/dist/ListCell/CheckMark.js +12 -0
- package/dist/ListCell/Chevron.d.ts +14 -0
- package/dist/ListCell/Chevron.d.ts.map +1 -0
- package/dist/ListCell/Chevron.js +22 -0
- package/dist/ListCell/ListCell.d.ts +3 -0
- package/dist/ListCell/ListCell.d.ts.map +1 -0
- package/dist/ListCell/ListCell.js +120 -0
- package/dist/ListCell/PickerModal.d.ts +13 -0
- package/dist/ListCell/PickerModal.d.ts.map +1 -0
- package/dist/ListCell/PickerModal.js +8 -0
- package/dist/ListCell/RadioButton.d.ts +10 -0
- package/dist/ListCell/RadioButton.d.ts.map +1 -0
- package/dist/ListCell/RadioButton.js +12 -0
- package/dist/ListCell/SwitchTrack.d.ts +19 -0
- package/dist/ListCell/SwitchTrack.d.ts.map +1 -0
- package/dist/ListCell/SwitchTrack.js +8 -0
- package/dist/ListCell/constants.d.ts +30 -0
- package/dist/ListCell/constants.d.ts.map +1 -0
- package/dist/ListCell/constants.js +35 -0
- package/dist/ListCell/index.d.ts +3 -0
- package/dist/ListCell/index.d.ts.map +1 -0
- package/dist/ListCell/index.js +1 -0
- package/dist/ListCell/styles.d.ts +28 -0
- package/dist/ListCell/styles.d.ts.map +1 -0
- package/dist/ListCell/styles.js +111 -0
- package/dist/ListCell/types.d.ts +68 -0
- package/dist/ListCell/types.d.ts.map +1 -0
- package/dist/ListCell/types.js +1 -0
- package/dist/ListCell/useSwitchAnimation.d.ts +12 -0
- package/dist/ListCell/useSwitchAnimation.d.ts.map +1 -0
- package/dist/ListCell/useSwitchAnimation.js +31 -0
- package/dist/ListCell/utilities.d.ts +24 -0
- package/dist/ListCell/utilities.d.ts.map +1 -0
- package/dist/ListCell/utilities.js +29 -0
- package/dist/Picker/Picker.d.ts +3 -0
- package/dist/Picker/Picker.d.ts.map +1 -0
- package/dist/Picker/Picker.js +76 -0
- package/dist/Picker/PickerHeader.d.ts +7 -0
- package/dist/Picker/PickerHeader.d.ts.map +1 -0
- package/dist/Picker/PickerHeader.js +6 -0
- package/dist/Picker/PickerRow.d.ts +9 -0
- package/dist/Picker/PickerRow.d.ts.map +1 -0
- package/dist/Picker/PickerRow.js +9 -0
- package/dist/Picker/SearchField.d.ts +8 -0
- package/dist/Picker/SearchField.d.ts.map +1 -0
- package/dist/Picker/SearchField.js +8 -0
- package/dist/Picker/constants.d.ts +24 -0
- package/dist/Picker/constants.d.ts.map +1 -0
- package/dist/Picker/constants.js +29 -0
- package/dist/Picker/icons.d.ts +3 -0
- package/dist/Picker/icons.d.ts.map +1 -0
- package/dist/Picker/icons.js +9 -0
- package/dist/Picker/index.d.ts +3 -0
- package/dist/Picker/index.d.ts.map +1 -0
- package/dist/Picker/index.js +1 -0
- package/dist/Picker/styles.d.ts +34 -0
- package/dist/Picker/styles.d.ts.map +1 -0
- package/dist/Picker/styles.js +192 -0
- package/dist/Picker/types.d.ts +40 -0
- package/dist/Picker/types.d.ts.map +1 -0
- package/dist/Picker/types.js +1 -0
- package/dist/Picker/useFilteredItems.d.ts +3 -0
- package/dist/Picker/useFilteredItems.d.ts.map +1 -0
- package/dist/Picker/useFilteredItems.js +18 -0
- package/dist/SegmentedTabs/SegmentedTabs.d.ts +3 -0
- package/dist/SegmentedTabs/SegmentedTabs.d.ts.map +1 -0
- package/dist/SegmentedTabs/SegmentedTabs.js +70 -0
- package/dist/SegmentedTabs/index.d.ts +3 -0
- package/dist/SegmentedTabs/index.d.ts.map +1 -0
- package/dist/SegmentedTabs/index.js +1 -0
- package/dist/SegmentedTabs/types.d.ts +10 -0
- package/dist/SegmentedTabs/types.d.ts.map +1 -0
- package/dist/SegmentedTabs/types.js +1 -0
- package/dist/Select/Select.d.ts +3 -0
- package/dist/Select/Select.d.ts.map +1 -0
- package/dist/Select/Select.js +60 -0
- package/dist/Select/index.d.ts +3 -0
- package/dist/Select/index.d.ts.map +1 -0
- package/dist/Select/index.js +1 -0
- package/dist/Select/styles.d.ts +8 -0
- package/dist/Select/styles.d.ts.map +1 -0
- package/dist/Select/styles.js +36 -0
- package/dist/Select/types.d.ts +37 -0
- package/dist/Select/types.d.ts.map +1 -0
- package/dist/Select/types.js +1 -0
- package/dist/Tabs/FloatingTabBar.d.ts +9 -0
- package/dist/Tabs/FloatingTabBar.d.ts.map +1 -0
- package/dist/Tabs/FloatingTabBar.js +55 -0
- package/dist/Tabs/Tabs.d.ts +21 -0
- package/dist/Tabs/Tabs.d.ts.map +1 -0
- package/dist/Tabs/Tabs.js +29 -0
- package/dist/Tabs/constants.d.ts +35 -0
- package/dist/Tabs/constants.d.ts.map +1 -0
- package/dist/Tabs/constants.js +36 -0
- package/dist/Tabs/icons.d.ts +16 -0
- package/dist/Tabs/icons.d.ts.map +1 -0
- package/dist/Tabs/icons.js +8 -0
- package/dist/Tabs/index.d.ts +6 -0
- package/dist/Tabs/index.d.ts.map +1 -0
- package/dist/Tabs/index.js +4 -0
- package/dist/Tabs/styles.d.ts +224 -0
- package/dist/Tabs/styles.d.ts.map +1 -0
- package/dist/Tabs/styles.js +121 -0
- package/dist/Tabs/types.d.ts +61 -0
- package/dist/Tabs/types.d.ts.map +1 -0
- package/dist/Tabs/types.js +4 -0
- package/dist/Tabs/useFloatingTabBarScrollPadding.d.ts +7 -0
- package/dist/Tabs/useFloatingTabBarScrollPadding.d.ts.map +1 -0
- package/dist/Tabs/useFloatingTabBarScrollPadding.js +11 -0
- package/dist/Tabs/utilities.d.ts +7 -0
- package/dist/Tabs/utilities.d.ts.map +1 -0
- package/dist/Tabs/utilities.js +18 -0
- package/dist/ToggleSection/ToggleSection.d.ts +3 -0
- package/dist/ToggleSection/ToggleSection.d.ts.map +1 -0
- package/dist/ToggleSection/ToggleSection.js +18 -0
- package/dist/ToggleSection/index.d.ts +3 -0
- package/dist/ToggleSection/index.d.ts.map +1 -0
- package/dist/ToggleSection/index.js +1 -0
- package/dist/ToggleSection/styles.d.ts +15 -0
- package/dist/ToggleSection/styles.d.ts.map +1 -0
- package/dist/ToggleSection/styles.js +49 -0
- package/dist/ToggleSection/types.d.ts +36 -0
- package/dist/ToggleSection/types.d.ts.map +1 -0
- package/dist/ToggleSection/types.js +1 -0
- package/dist/assets/fonts/.map.json +51 -0
- package/dist/assets/fonts/SB Sans Text.ttf +0 -0
- package/dist/assets/fonts/sf-pro-display/.map.json +114 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYBLACKITALIC.OTF +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYBOLD.OTF +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYHEAVYITALIC.OTF +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYLIGHTITALIC.OTF +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYMEDIUM.OTF +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYREGULAR.otf +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYSEMIBOLDITALIC.OTF +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYTHINITALIC.OTF +0 -0
- package/dist/assets/fonts/sf-pro-display/SFPRODISPLAYULTRALIGHTITALIC.OTF +0 -0
- package/dist/fonts.d.ts +6 -0
- package/dist/fonts.d.ts.map +1 -0
- package/dist/fonts.js +8 -0
- package/dist/index.d.ts +38 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +20 -0
- package/dist/theme.d.ts +19 -0
- package/dist/theme.d.ts.map +1 -0
- package/dist/theme.js +18 -0
- package/package.json +76 -0
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import Svg, { Circle, Path, Rect } from 'react-native-svg';
|
|
3
|
+
export const searchIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 17 17", fill: "none", ...svgProps, children: [_jsx(Circle, { cx: 7.5, cy: 7.5, r: 5.75, stroke: color, strokeWidth: strokeWidth ?? 1.5 }), _jsx(Path, { d: "M11.5 11.5L15 15", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round" })] }));
|
|
4
|
+
export const calendarIcon = ({ width, height, color, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M14 22H10C6.229 22 4.343 22 3.172 20.828C2.001 19.656 2 17.771 2 14V12C2 8.229 2 6.343 3.172 5.172C4.344 4.001 6.229 4 10 4H14C17.771 4 19.657 4 20.828 5.172C21.999 6.344 22 8.229 22 12V14C22 17.771 22 19.657 20.828 20.828C20.175 21.482 19.3 21.771 18 21.898M7 4V2.5M17 4V2.5M21.5 9H10.75M2 9H5.875", stroke: color, strokeWidth: 1.5, strokeLinecap: "round" }), _jsx(Path, { d: "M18 13C18 13.2652 17.8946 13.5196 17.7071 13.7071C17.5196 13.8946 17.2652 14 17 14C16.7348 14 16.4804 13.8946 16.2929 13.7071C16.1054 13.5196 16 13.2652 16 13C16 12.7348 16.1054 12.4804 16.2929 12.2929C16.4804 12.1054 16.7348 12 17 12C17.2652 12 17.5196 12.1054 17.7071 12.2929C17.8946 12.4804 18 12.7348 18 13ZM13 17C13 17.2652 12.8946 17.5196 12.7071 17.7071C12.5196 17.8946 12.2652 18 12 18C11.7348 18 11.4804 17.8946 11.2929 17.7071C11.1054 17.5196 11 17.2652 11 17C11 16.7348 11.1054 16.4804 11.2929 16.2929C11.4804 16.1054 11.7348 16 12 16C12.2652 16 12.5196 16.1054 12.7071 16.2929C12.8946 16.4804 13 16.7348 13 17ZM13 13C13 13.2652 12.8946 13.5196 12.7071 13.7071C12.5196 13.8946 12.2652 14 12 14C11.7348 14 11.4804 13.8946 11.2929 13.7071C11.1054 13.5196 11 13.2652 11 13C11 12.7348 11.1054 12.4804 11.2929 12.2929C11.4804 12.1054 11.7348 12 12 12C12.2652 12 12.5196 12.1054 12.7071 12.2929C12.8946 12.4804 13 12.7348 13 13ZM8 17C8 17.2652 7.89464 17.5196 7.70711 17.7071C7.51957 17.8946 7.26522 18 7 18C6.73478 18 6.48043 17.8946 6.29289 17.7071C6.10536 17.5196 6 17.2652 6 17C6 16.7348 6.10536 16.4804 6.29289 16.2929C6.48043 16.1054 6.73478 16 7 16C7.26522 16 7.51957 16.1054 7.70711 16.2929C7.89464 16.4804 8 16.7348 8 17ZM8 13C8 13.2652 7.89464 13.5196 7.70711 13.7071C7.51957 13.8946 7.26522 14 7 14C6.73478 14 6.48043 13.8946 6.29289 13.7071C6.10536 13.5196 6 13.2652 6 13C6 12.7348 6.10536 12.4804 6.29289 12.2929C6.48043 12.1054 6.73478 12 7 12C7.26522 12 7.51957 12.1054 7.70711 12.2929C7.89464 12.4804 8 12.7348 8 13Z", fill: color })] }));
|
|
5
|
+
export const plusIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M6 12H12M12 12H18M12 12V6M12 12V18", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
6
|
+
export const percentIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M19 5L5 19M17 19C16.4696 19 15.9609 18.7893 15.5858 18.4142C15.2107 18.0391 15 17.5304 15 17C15 16.4696 15.2107 15.9609 15.5858 15.5858C15.9609 15.2107 16.4696 15 17 15C17.5304 15 18.0391 15.2107 18.4142 15.5858C18.7893 15.9609 19 16.4696 19 17C19 17.5304 18.7893 18.0391 18.4142 18.4142C18.0391 18.7893 17.5304 19 17 19ZM7 9C6.46957 9 5.96086 8.78929 5.58579 8.41421C5.21071 8.03914 5 7.53043 5 7C5 6.46957 5.21071 5.96086 5.58579 5.58579C5.96086 5.21071 6.46957 5 7 5C7.53043 5 8.03914 5.21071 8.41421 5.58579C8.78929 5.96086 9 6.46957 9 7C9 7.53043 8.78929 8.03914 8.41421 8.41421C8.03914 8.78929 7.53043 9 7 9Z", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
7
|
+
export const accountOutlineIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M3 16V8C3 6.67392 3.52678 5.40215 4.46447 4.46447C5.40215 3.52678 6.67392 3 8 3H16C17.3261 3 18.5979 3.52678 19.5355 4.46447C20.4732 5.40215 21 6.67392 21 8V16C21 17.3261 20.4732 18.5979 19.5355 19.5355C18.5979 20.4732 17.3261 21 16 21H8C6.67392 21 5.40215 20.4732 4.46447 19.5355C3.52678 18.5979 3 17.3261 3 16Z", stroke: color, strokeWidth: strokeWidth ?? 1.5 }), _jsx(Path, { d: "M16.5 14.5C16.5 14.5 15 16.5 12 16.5C9 16.5 7.5 14.5 7.5 14.5", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M8.5 10C8.36739 10 8.24021 9.94732 8.14645 9.85355C8.05268 9.75979 8 9.63261 8 9.5C8 9.36739 8.05268 9.24021 8.14645 9.14645C8.24021 9.05268 8.36739 9 8.5 9C8.63261 9 8.75979 9.05268 8.85355 9.14645C8.94732 9.24021 9 9.36739 9 9.5C9 9.63261 8.94732 9.75979 8.85355 9.85355C8.75979 9.94732 8.63261 10 8.5 10ZM15.5 10C15.3674 10 15.2402 9.94732 15.1464 9.85355C15.0527 9.75979 15 9.63261 15 9.5C15 9.36739 15.0527 9.24021 15.1464 9.14645C15.2402 9.05268 15.3674 9 15.5 9C15.6326 9 15.7598 9.05268 15.8536 9.14645C15.9473 9.24021 16 9.36739 16 9.5C16 9.63261 15.9473 9.75979 15.8536 9.85355C15.7598 9.94732 15.6326 10 15.5 10Z", fill: color, stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" })] }));
|
|
8
|
+
export const linkIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M14 11.998C14 9.506 11.683 7 8.857 7H7.143C4.303 7 2 9.238 2 11.998C2 14.376 3.71 16.366 6 16.871C6.37538 16.9537 6.75863 16.9952 7.143 16.995", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M10 11.998C10 14.489 12.317 16.995 15.143 16.995H16.857C19.697 16.995 22 14.758 22 11.998C22 9.619 20.29 7.628 18 7.124C17.6246 7.04134 17.2414 6.99977 16.857 7", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" })] }));
|
|
9
|
+
export const editIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M14.44 6.06607L15.92 4.58607C16.1057 4.40027 16.3262 4.25288 16.5689 4.15232C16.8116 4.05176 17.0717 4 17.3345 4C17.5972 4 17.8573 4.05176 18.1 4.15232C18.3427 4.25288 18.5632 4.40027 18.749 4.58607L20.163 6.00007C20.5379 6.37513 20.7485 6.88374 20.7485 7.41407C20.7485 7.9444 20.5379 8.45302 20.163 8.82807L18.683 10.3081M14.44 6.06607L4.82396 15.6811C4.49194 16.0131 4.28733 16.4514 4.24596 16.9191L4.00396 19.6591C3.99096 19.8047 4.01007 19.9515 4.05993 20.0889C4.1098 20.2264 4.18921 20.3513 4.29257 20.4547C4.39593 20.5582 4.52071 20.6377 4.65814 20.6877C4.79557 20.7377 4.94229 20.7569 5.08796 20.7441L7.82796 20.5021C8.29638 20.4612 8.73542 20.2565 9.06796 19.9241L18.683 10.3081M14.44 6.06607L18.683 10.3081", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
10
|
+
export const moreIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M14 18C14 18.5304 13.7893 19.0391 13.4142 19.4142C13.0391 19.7893 12.5304 20 12 20C11.4696 20 10.9609 19.7893 10.5858 19.4142C10.2107 19.0391 10 18.5304 10 18C10 17.4696 10.2107 16.9609 10.5858 16.5858C10.9609 16.2107 11.4696 16 12 16C12.5304 16 13.0391 16.2107 13.4142 16.5858C13.7893 16.9609 14 17.4696 14 18ZM14 12C14 12.5304 13.7893 13.0391 13.4142 13.4142C13.0391 13.7893 12.5304 14 12 14C11.4696 14 10.9609 13.7893 10.5858 13.4142C10.2107 13.0391 10 12.5304 10 12C10 11.4696 10.2107 10.9609 10.5858 10.5858C10.9609 10.2107 11.4696 10 12 10C12.5304 10 13.0391 10.2107 13.4142 10.5858C13.7893 10.9609 14 11.4696 14 12ZM12 8C12.5304 8 13.0391 7.78929 13.4142 7.41421C13.7893 7.03914 14 6.53043 14 6C14 5.46957 13.7893 4.96086 13.4142 4.58579C13.0391 4.21071 12.5304 4 12 4C11.4696 4 10.9609 4.21071 10.5858 4.58579C10.2107 4.96086 10 5.46957 10 6C10 6.53043 10.2107 7.03914 10.5858 7.41421C10.9609 7.78929 11.4696 8 12 8Z", fill: color }) }));
|
|
11
|
+
export const billIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M16.755 2H7.245C6.086 2 5.507 2 5.039 2.163C4.59793 2.31972 4.19885 2.57586 3.87267 2.91158C3.54649 3.24731 3.30195 3.6536 3.158 4.099C3 4.581 3 5.177 3 6.37V20.374C3 21.232 3.985 21.688 4.608 21.118C4.78279 20.9565 5.01202 20.8668 5.25 20.8668C5.48798 20.8668 5.71721 20.9565 5.892 21.118L6.375 21.56C6.68121 21.8432 7.08293 22.0004 7.5 22.0004C7.91707 22.0004 8.31879 21.8432 8.625 21.56C8.93121 21.2768 9.33293 21.1196 9.75 21.1196C10.1671 21.1196 10.5688 21.2768 10.875 21.56C11.1812 21.8432 11.5829 22.0004 12 22.0004C12.4171 22.0004 12.8188 21.8432 13.125 21.56C13.4312 21.2768 13.8329 21.1196 14.25 21.1196C14.6671 21.1196 15.0688 21.2768 15.375 21.56C15.6812 21.8432 16.0829 22.0004 16.5 22.0004C16.9171 22.0004 17.3188 21.8432 17.625 21.56L18.108 21.118C18.2828 20.9565 18.512 20.8668 18.75 20.8668C18.988 20.8668 19.2172 20.9565 19.392 21.118C20.015 21.688 21 21.232 21 20.374V6.37C21 5.177 21 4.58 20.842 4.1C20.6982 3.65441 20.4537 3.24792 20.1275 2.91202C19.8013 2.57612 19.4022 2.31982 18.961 2.163C18.493 2 17.914 2 16.755 2Z", stroke: color, strokeWidth: strokeWidth ?? 1.5 }), _jsx(Path, { d: "M10.5 11H17M7 11H7.5M7 7.5H7.5M7 14.5H7.5M10.5 7.5H17M10.5 14.5H17", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round" })] }));
|
|
12
|
+
export const locationIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M18.9099 18C19.8249 19.368 20.2109 20.203 19.8869 20.9C19.8469 20.9853 19.8002 21.0677 19.7469 21.147C19.1719 22 17.6869 22 14.7169 22H9.28289C6.31289 22 4.82889 22 4.25389 21.147C4.20143 21.0681 4.15464 20.9855 4.11389 20.9C3.78989 20.203 4.17589 19.368 5.08989 18", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M15 9.5C15 10.2956 14.6839 11.0587 14.1213 11.6213C13.5587 12.1839 12.7956 12.5 12 12.5C11.2044 12.5 10.4413 12.1839 9.87868 11.6213C9.31607 11.0587 9 10.2956 9 9.5C9 8.70435 9.31607 7.94129 9.87868 7.37868C10.4413 6.81607 11.2044 6.5 12 6.5C12.7956 6.5 13.5587 6.81607 14.1213 7.37868C14.6839 7.94129 15 8.70435 15 9.5Z", stroke: color, strokeWidth: strokeWidth ?? 1.5 }), _jsx(Path, { d: "M12 2C16.059 2 19.5 5.428 19.5 9.587C19.5 13.812 16.003 16.777 12.773 18.793C12.5378 18.9283 12.2713 18.9995 12 18.9995C11.7287 18.9995 11.4622 18.9283 11.227 18.793C8.003 16.757 4.5 13.827 4.5 9.587C4.5 5.428 7.941 2 12 2Z", stroke: color, strokeWidth: strokeWidth ?? 1.5 })] }));
|
|
13
|
+
export const attachmentLineIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M21.4383 11.6622L12.2483 20.8522C11.1225 21.9781 9.59552 22.6106 8.00334 22.6106C6.41115 22.6106 4.88418 21.9781 3.75834 20.8522C2.63249 19.7264 2 18.1994 2 16.6072C2 15.015 2.63249 13.4881 3.75834 12.3622L12.9483 3.17222C13.6989 2.42166 14.7169 2 15.7783 2C16.8398 2 17.8578 2.42166 18.6083 3.17222C19.3589 3.92279 19.7806 4.94077 19.7806 6.00222C19.7806 7.06368 19.3589 8.08166 18.6083 8.83222L9.40834 18.0222C9.22252 18.208 9.00192 18.3554 8.75913 18.456C8.51634 18.5566 8.25613 18.6083 7.99334 18.6083C7.73055 18.6083 7.47033 18.5566 7.22754 18.456C6.98476 18.3554 6.76416 18.208 6.57834 18.0222C6.39252 17.8364 6.24512 17.6158 6.14455 17.373C6.04398 17.1302 5.99222 16.87 5.99222 16.6072C5.99222 16.3444 6.04398 16.0842 6.14455 15.8414C6.24512 15.5986 6.39252 15.378 6.57834 15.1922L15.0683 6.71222", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
14
|
+
export const sendFillIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M3.46458 8.45161C3.34918 8.47672 3.24394 8.53622 3.16251 8.62239C3.08108 8.70855 3.02722 8.81741 3.00792 8.93482C2.98862 9.05223 3.00478 9.17278 3.05429 9.28082C3.1038 9.38885 3.18438 9.4794 3.28557 9.54069L8.40207 12.6393L13.2854 9.19244C13.3488 9.14774 13.4202 9.11607 13.4957 9.09922C13.5712 9.08237 13.6493 9.08067 13.7254 9.09423C13.8016 9.10779 13.8743 9.13634 13.9395 9.17825C14.0047 9.22015 14.0611 9.27459 14.1054 9.33846C14.1498 9.40233 14.1812 9.47438 14.1979 9.55049C14.2146 9.62661 14.2163 9.70529 14.2028 9.78206C14.1894 9.85883 14.1611 9.93217 14.1195 9.9979C14.0779 10.0636 14.0239 10.1205 13.9606 10.1652L9.07726 13.6121L10.2157 19.5189C10.2381 19.6359 10.2949 19.7434 10.3787 19.8274C10.4626 19.9114 10.5696 19.9681 10.6858 19.9899C10.802 20.0118 10.9221 19.9979 11.0303 19.95C11.1386 19.9021 11.2301 19.8225 11.2928 19.7215L19.9093 5.91016C19.9711 5.81127 20.0026 5.69617 19.9998 5.5793C19.997 5.46243 19.9601 5.349 19.8936 5.25323C19.8271 5.15745 19.734 5.0836 19.6261 5.04094C19.5181 4.99828 19.4 4.9887 19.2867 5.01341L3.46458 8.45161Z", fill: color }) }));
|
|
15
|
+
export const stopFilledIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 21 21", fill: "none", ...svgProps, children: _jsx(Path, { d: "M5 14.5286V4.47143C5 4.3464 5.05268 4.22649 5.14645 4.13808C5.24021 4.04967 5.36739 4 5.5 4H7.83333C7.96594 4 8.09312 4.04967 8.18689 4.13808C8.28066 4.22649 8.33333 4.3464 8.33333 4.47143V14.5286C8.33333 14.6536 8.28066 14.7735 8.18689 14.8619C8.09312 14.9503 7.96594 15 7.83333 15H5.5C5.36739 15 5.24021 14.9503 5.14645 14.8619C5.05268 14.7735 5 14.6536 5 14.5286ZM11.6667 14.5286V4.47143C11.6667 4.3464 11.7193 4.22649 11.8131 4.13808C11.9069 4.04967 12.0341 4 12.1667 4H14.5C14.6326 4 14.7598 4.04967 14.8536 4.13808C14.9473 4.22649 15 4.3464 15 4.47143V14.5286C15 14.6536 14.9473 14.7735 14.8536 14.8619C14.7598 14.9503 14.6326 15 14.5 15H12.1667C12.0341 15 11.9069 14.9503 11.8131 14.8619C11.7193 14.7735 11.6667 14.6536 11.6667 14.5286Z", fill: color, stroke: color, strokeWidth: strokeWidth ?? 1.5 }) }));
|
|
16
|
+
export const expandIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M7.182 7.51901C7.37595 7.69979 7.49017 7.95019 7.49955 8.21516C7.50892 8.48013 7.41269 8.73798 7.232 8.93201L5.301 11H10C10.2652 11 10.5196 11.1054 10.7071 11.2929C10.8946 11.4804 11 11.7348 11 12C11 12.2652 10.8946 12.5196 10.7071 12.7071C10.5196 12.8947 10.2652 13 10 13H5.301L7.231 15.068C7.40486 15.2631 7.49548 15.5184 7.48346 15.7794C7.47144 16.0404 7.35775 16.2864 7.1667 16.4646C6.97565 16.6428 6.72242 16.7392 6.46121 16.7331C6.19999 16.7271 5.95153 16.619 5.769 16.432L2.27 12.685C2.09616 12.4993 1.99961 12.2544 2 12C1.99986 11.746 2.09639 11.5014 2.27 11.316L5.77 7.56801C5.95091 7.3742 6.20139 7.26016 6.46636 7.25098C6.73132 7.24179 6.9881 7.3382 7.182 7.51901ZM16.819 7.51901C16.6251 7.69979 16.5108 7.95019 16.5015 8.21516C16.4921 8.48013 16.5883 8.73798 16.769 8.93201L18.699 11H14C13.7348 11 13.4804 11.1054 13.2929 11.2929C13.1054 11.4804 13 11.7348 13 12C13 12.2652 13.1054 12.5196 13.2929 12.7071C13.4804 12.8947 13.7348 13 14 13H18.699L16.769 15.068C16.5951 15.2631 16.5045 15.5184 16.5165 15.7794C16.5286 16.0404 16.6423 16.2864 16.8333 16.4646C17.0244 16.6428 17.2776 16.7392 17.5388 16.7331C17.8 16.7271 18.0485 16.619 18.231 16.432L21.729 12.685C21.7872 12.6233 21.8372 12.5544 21.878 12.48C21.9789 12.2953 22.0189 12.0834 21.9923 11.8745C21.9657 11.6657 21.8739 11.4706 21.73 11.317L18.231 7.56701C18.05 7.37334 17.7994 7.25949 17.5344 7.25049C17.2695 7.24148 17.0128 7.33807 16.819 7.51901Z", fill: color }) }));
|
|
17
|
+
export const locationPinIcon = ({ width, height, color, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M11 9.86V16L12 18L13 16V9.86C14.72 9.41 16 7.86 16 6C16 3.79 14.21 2 12 2C9.79 2 8 3.79 8 6C8 7.86 9.28 9.41 11 9.86ZM12 4C13.1 4 14 4.9 14 6C14 7.1 13.1 8 12 8C10.9 8 10 7.1 10 6C10 4.9 10.9 4 12 4Z", fill: color }), _jsx(Path, { d: "M15 14.17V16.18C18.29 16.59 20 17.59 20 18C20 18.51 17.25 20 12 20C6.75 20 4 18.51 4 18C4 17.6 5.71 16.59 9 16.18V14.17C5.25 14.59 2 15.83 2 18C2 20.75 7.18 22 12 22C16.82 22 22 20.75 22 18C22 15.82 18.75 14.59 15 14.17Z", fill: color })] }));
|
|
18
|
+
export const checkIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M5 13L9 17L19 7", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
19
|
+
export const greenDotIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 12 12", fill: "none", ...svgProps, children: _jsx(Circle, { cx: "6", cy: "6", r: "6", fill: color }) }));
|
|
20
|
+
export const settingsIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M12.0001 14.4C12.6366 14.4 13.2471 14.1472 13.6972 13.6971C14.1472 13.247 14.4001 12.6365 14.4001 12C14.4001 11.3635 14.1472 10.753 13.6972 10.3029C13.2471 9.85286 12.6366 9.60001 12.0001 9.60001C11.3636 9.60001 10.7531 9.85286 10.303 10.3029C9.85295 10.753 9.6001 11.3635 9.6001 12C9.6001 12.6365 9.85295 13.247 10.303 13.6971C10.7531 14.1472 11.3636 14.4 12.0001 14.4Z", stroke: color, strokeWidth: strokeWidth ?? 1.35, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M18.0976 10.716L17.22 8.596L18.4 7.2L16.8 5.6L15.412 6.7864L13.2464 5.896L12.748 4H11.1848L10.6792 5.9208L8.5632 6.8128L7.2 5.6L5.6 7.2L6.7624 8.6312L5.8984 10.7568L4 11.2V12.8L5.9208 13.3248L6.8128 15.44L5.6 16.8L7.2 18.4L8.6328 17.232L10.7176 18.0896L11.2 20H12.8L13.2832 18.0904L15.404 17.212C15.7576 17.4656 16.8 18.4 16.8 18.4L18.4 16.8L17.2128 15.4L18.0912 13.2784L20 12.7824V11.2L18.0976 10.716Z", stroke: color, strokeWidth: strokeWidth ?? 1.35, strokeLinecap: "round", strokeLinejoin: "round" })] }));
|
|
21
|
+
export const gearIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1Z", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" })] }));
|
|
22
|
+
export const qrIcon = ({ width, height, color, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 18 18", fill: "none", ...svgProps, children: [_jsx(Rect, { x: 1, y: 1, width: 5, height: 5, stroke: color, strokeWidth: 1.5 }), _jsx(Rect, { x: 12, y: 1, width: 5, height: 5, stroke: color, strokeWidth: 1.5 }), _jsx(Rect, { x: 1, y: 12, width: 5, height: 5, stroke: color, strokeWidth: 1.5 }), _jsx(Rect, { x: 9, y: 9, width: 2, height: 2, fill: color }), _jsx(Rect, { x: 13, y: 10, width: 1.5, height: 1.5, fill: color }), _jsx(Rect, { x: 10, y: 13, width: 1.5, height: 1.5, fill: color }), _jsx(Rect, { x: 14, y: 14, width: 2, height: 2, fill: color })] }));
|
|
23
|
+
export const qrCodeIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M6 12H9M15 12V15M12 18H15M12 12.011L12.01 12M18 12.011L18.01 12M12 15.011L12.01 15M18 15.011L18.01 15M18 18.011L18.01 18M12 9.011L12.01 9M12 6.011L12.01 6M18 3H21V6M18 21H21V18M6 3H3V6M6 21H3V18M9 6.6V8.4C9 8.55913 8.93679 8.71174 8.82426 8.82426C8.71174 8.93679 8.55913 9 8.4 9H6.6C6.44087 9 6.28826 8.93679 6.17574 8.82426C6.06321 8.71174 6 8.55913 6 8.4V6.6C6 6.44087 6.06321 6.28826 6.17574 6.17574C6.28826 6.06321 6.44087 6 6.6 6H8.4C8.55913 6 8.71174 6.06321 8.82426 6.17574C8.93679 6.28826 9 6.44087 9 6.6ZM9 15.6V17.4C9 17.5591 8.93679 17.7117 8.82426 17.8243C8.71174 17.9368 8.55913 18 8.4 18H6.6C6.44087 18 6.28826 17.9368 6.17574 17.8243C6.06321 17.7117 6 17.5591 6 17.4V15.6C6 15.4409 6.06321 15.2883 6.17574 15.1757C6.28826 15.0632 6.44087 15 6.6 15H8.4C8.55913 15 8.71174 15.0632 8.82426 15.1757C8.93679 15.2883 9 15.4409 9 15.6ZM18 6.6V8.4C18 8.55913 17.9368 8.71174 17.8243 8.82426C17.7117 8.93679 17.5591 9 17.4 9H15.6C15.4409 9 15.2883 8.93679 15.1757 8.82426C15.0632 8.71174 15 8.55913 15 8.4V6.6C15 6.44087 15.0632 6.28826 15.1757 6.17574C15.2883 6.06321 15.4409 6 15.6 6H17.4C17.5591 6 17.7117 6.06321 17.8243 6.17574C17.9368 6.28826 18 6.44087 18 6.6Z", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
24
|
+
export const photoIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M13 21H3.6C3.44087 21 3.28826 20.9368 3.17574 20.8243C3.06321 20.7117 3 20.5591 3 20.4V3.6C3 3.44087 3.06321 3.28826 3.17574 3.17574C3.28826 3.06321 3.44087 3 3.6 3H20.4C20.5591 3 20.7117 3.06321 20.8243 3.17574C20.9368 3.28826 21 3.44087 21 3.6V13", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M3 16L10 13L15.5 15.5M16 19H19M19 19H22M19 19V16M19 19V22M16 10C15.4696 10 14.9609 9.78929 14.5858 9.41421C14.2107 9.03914 14 8.53043 14 8C14 7.46957 14.2107 6.96086 14.5858 6.58579C14.9609 6.21071 15.4696 6 16 6C16.5304 6 17.0391 6.21071 17.4142 6.58579C17.7893 6.96086 18 7.46957 18 8C18 8.53043 17.7893 9.03914 17.4142 9.41421C17.0391 9.78929 16.5304 10 16 10Z", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" })] }));
|
|
25
|
+
export const removeIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M20 9L18.005 20.346C17.9236 20.8094 17.6815 21.2292 17.3212 21.5317C16.9609 21.8342 16.5055 22 16.035 22H7.965C7.49454 22 7.03913 21.8342 6.67882 21.5317C6.31852 21.2292 6.07639 20.8094 5.995 20.346L4 9M21 6H15.375M15.375 6V4C15.375 3.46957 15.1643 2.96086 14.7892 2.58579C14.4141 2.21071 13.9054 2 13.375 2H10.625C10.0946 2 9.58586 2.21071 9.21079 2.58579C8.83571 2.96086 8.625 3.46957 8.625 4V6M15.375 6H8.625M3 6H8.625", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
26
|
+
export const editPhotoIcon = ({ width, height, color, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M6 3.5V7M4.25 5.25H7.75", stroke: color, strokeWidth: 1.8, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M4.25 9.5C4.25 8.95 4.7 8.5 5.25 8.5H8L9.2 6.75H14.8L16 8.5H18.75C19.3 8.5 19.75 8.95 19.75 9.5V17.25C19.75 17.8 19.3 18.25 18.75 18.25H5.25C4.7 18.25 4.25 17.8 4.25 17.25V9.5Z", stroke: color, strokeWidth: 1.8, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M12 15.25C13.38 15.25 14.5 14.13 14.5 12.75C14.5 11.37 13.38 10.25 12 10.25C10.62 10.25 9.5 11.37 9.5 12.75C9.5 14.13 10.62 15.25 12 15.25Z", stroke: color, strokeWidth: 1.8, strokeLinecap: "round", strokeLinejoin: "round" })] }));
|
|
27
|
+
export const enterIcon = ({ width, height, color, strokeWidth, ...svgProps }) => (_jsxs(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: [_jsx(Path, { d: "M10 12H20M20 12L17 9M20 12L17 15", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round", strokeLinejoin: "round" }), _jsx(Path, { d: "M4 12C4 9.87827 4.84285 7.84344 6.34315 6.34315C7.84344 4.84285 9.87827 4 12 4M12 20C10.8006 20.0007 9.61651 19.7314 8.53542 19.2121C7.45434 18.6928 6.50404 17.9367 5.755 17", stroke: color, strokeWidth: strokeWidth ?? 1.5, strokeLinecap: "round" })] }));
|
|
28
|
+
export const restoreIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 16 16", fill: "none", ...svgProps, children: _jsx(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M8 16C3.91775 16 0.549667 12.9424 0.0609582 8.99237L1.82517 8.77183C2.20529 11.8441 4.82492 14.2222 8 14.2222C11.4365 14.2222 14.2222 11.4365 14.2222 8C14.2222 4.56354 11.4365 1.77779 8 1.77779C5.88554 1.77779 4.01746 2.83246 2.89304 4.44446H6.22221V6.22221H0V0H1.77779V2.97125C3.24442 1.15883 5.48688 0 8 0C12.4183 0 16 3.58171 16 8C16 12.4183 12.4183 16 8 16Z", fill: color }) }));
|
|
29
|
+
export const lockIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M18 8H17V6C17 3.24 14.76 1 12 1C9.24 1 7 3.24 7 6V8H6C4.9 8 4 8.9 4 10V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V10C20 8.9 19.1 8 18 8ZM12 17C10.9 17 10 16.1 10 15C10 13.9 10.9 13 12 13C13.1 13 14 13.9 14 15C14 16.1 13.1 17 12 17ZM15.1 8H8.9V6C8.9 4.29 10.29 2.9 12 2.9C13.71 2.9 15.1 4.29 15.1 6V8Z", fill: color }) }));
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { IconRenderer } from '../types';
|
|
2
|
+
export declare const tabGroupIcon: IconRenderer;
|
|
3
|
+
export declare const tabActivityIcon: IconRenderer;
|
|
4
|
+
export declare const tabAccountIcon: IconRenderer;
|
|
5
|
+
export declare const tabFriendsIcon: IconRenderer;
|
|
6
|
+
//# sourceMappingURL=tabs.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/Icon/icons/tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,eAAO,MAAM,YAAY,EAAE,YAO1B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,YAI7B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,YAO5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,YAI5B,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import Svg, { Circle, Path } from 'react-native-svg';
|
|
3
|
+
export const tabGroupIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M2 12L9.17 4.83Q12 2 14.83 4.83L19.17 9.17Q22 12 19.17 14.83L14.83 19.17Q12 22 9.17 19.17L4.83 14.83Q2 12 4.83 9.17L2 12Z", fill: color }) }));
|
|
4
|
+
export const tabActivityIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Circle, { cx: "12", cy: "12", r: "10", fill: color }) }));
|
|
5
|
+
export const tabAccountIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Path, { d: "M13.73 5.84L21.27 18.16Q23 21 19.5 21H4.5Q1 21 2.73 18.16L10.27 5.84Q12 3 13.73 5.84Z", fill: color }) }));
|
|
6
|
+
export const tabFriendsIcon = ({ width, height, color, ...svgProps }) => (_jsx(Svg, { width: width, height: height, viewBox: "0 0 24 24", fill: "none", ...svgProps, children: _jsx(Circle, { cx: "12", cy: "12", r: "10", fill: color }) }));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzC,YAAY,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Icon, iconNames } from './Icon';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/Icon/registry.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAyCtD,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,QAAQ,EAAE,YAAY,CAuCxD,CAAC"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { chevronDownIcon, chevronLeftIcon, chevronSolidDownIcon, chevronUpIcon, chevronRightIcon, closeIcon, openIcon, } from './icons/navigation';
|
|
2
|
+
import { accountOutlineIcon, attachmentLineIcon, billIcon, calendarIcon, checkIcon, editPhotoIcon, editIcon, expandIcon, gearIcon, greenDotIcon, linkIcon, locationIcon, locationPinIcon, moreIcon, percentIcon, photoIcon, plusIcon, qrCodeIcon, qrIcon, removeIcon, searchIcon, sendFillIcon, settingsIcon, stopFilledIcon, restoreIcon, enterIcon, lockIcon, } from './icons/system';
|
|
3
|
+
import { tabAccountIcon, tabActivityIcon, tabFriendsIcon, tabGroupIcon } from './icons/tabs';
|
|
4
|
+
export const ICON_REGISTRY = {
|
|
5
|
+
'tab-group': tabGroupIcon,
|
|
6
|
+
'tab-activity': tabActivityIcon,
|
|
7
|
+
'tab-account': tabAccountIcon,
|
|
8
|
+
'tab-friends': tabFriendsIcon,
|
|
9
|
+
'account-outline': accountOutlineIcon,
|
|
10
|
+
'attachment-line': attachmentLineIcon,
|
|
11
|
+
bill: billIcon,
|
|
12
|
+
check: checkIcon,
|
|
13
|
+
close: closeIcon,
|
|
14
|
+
edit: editIcon,
|
|
15
|
+
'edit-photo': editPhotoIcon,
|
|
16
|
+
expand: expandIcon,
|
|
17
|
+
'green-dot': greenDotIcon,
|
|
18
|
+
'chevron-left': chevronLeftIcon,
|
|
19
|
+
'chevron-up': chevronUpIcon,
|
|
20
|
+
'chevron-right': chevronRightIcon,
|
|
21
|
+
'chevron-down': chevronDownIcon,
|
|
22
|
+
'chevron-solid-down': chevronSolidDownIcon,
|
|
23
|
+
link: linkIcon,
|
|
24
|
+
location: locationIcon,
|
|
25
|
+
'location-pin': locationPinIcon,
|
|
26
|
+
more: moreIcon,
|
|
27
|
+
open: openIcon,
|
|
28
|
+
percent: percentIcon,
|
|
29
|
+
photo: photoIcon,
|
|
30
|
+
plus: plusIcon,
|
|
31
|
+
qr: qrIcon,
|
|
32
|
+
'qr-code': qrCodeIcon,
|
|
33
|
+
remove: removeIcon,
|
|
34
|
+
search: searchIcon,
|
|
35
|
+
'send-fill': sendFillIcon,
|
|
36
|
+
settings: settingsIcon,
|
|
37
|
+
'stop-filled': stopFilledIcon,
|
|
38
|
+
calendar: calendarIcon,
|
|
39
|
+
gear: gearIcon,
|
|
40
|
+
restore: restoreIcon,
|
|
41
|
+
enter: enterIcon,
|
|
42
|
+
lock: lockIcon,
|
|
43
|
+
};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { SvgProps } from 'react-native-svg';
|
|
3
|
+
export declare const iconNames: readonly ["tab-group", "tab-activity", "tab-account", "tab-friends", "account-outline", "attachment-line", "bill", "check", "close", "edit", "edit-photo", "expand", "green-dot", "chevron-left", "chevron-up", "chevron-right", "chevron-down", "chevron-solid-down", "link", "location", "location-pin", "more", "open", "percent", "photo", "plus", "qr", "qr-code", "remove", "search", "send-fill", "settings", "stop-filled", "calendar", "gear", "restore", "enter", "lock"];
|
|
4
|
+
export type IconName = (typeof iconNames)[number];
|
|
5
|
+
export type IconRendererProps = {
|
|
6
|
+
width: number;
|
|
7
|
+
height: number;
|
|
8
|
+
color: string;
|
|
9
|
+
strokeWidth?: number | string;
|
|
10
|
+
} & Omit<SvgProps, 'width' | 'height' | 'color' | 'strokeWidth'>;
|
|
11
|
+
export type IconRenderer = (props: IconRendererProps) => JSX.Element;
|
|
12
|
+
export interface IconProps extends Omit<SvgProps, 'width' | 'height' | 'color' | 'strokeWidth'> {
|
|
13
|
+
name: IconName;
|
|
14
|
+
color?: string;
|
|
15
|
+
size?: number;
|
|
16
|
+
width?: number;
|
|
17
|
+
height?: number;
|
|
18
|
+
strokeWidth?: number | string;
|
|
19
|
+
}
|
|
20
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Icon/types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEjD,eAAO,MAAM,SAAS,qdAuCZ,CAAC;AAEX,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;AAElD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC/B,GAAG,IAAI,CAAC,QAAQ,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,aAAa,CAAC,CAAC;AAEjE,MAAM,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,iBAAiB,KAAK,GAAG,CAAC,OAAO,CAAC;AAErE,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,QAAQ,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,aAAa,CAAC;IACpE,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC/B"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
export const iconNames = [
|
|
2
|
+
'tab-group',
|
|
3
|
+
'tab-activity',
|
|
4
|
+
'tab-account',
|
|
5
|
+
'tab-friends',
|
|
6
|
+
'account-outline',
|
|
7
|
+
'attachment-line',
|
|
8
|
+
'bill',
|
|
9
|
+
'check',
|
|
10
|
+
'close',
|
|
11
|
+
'edit',
|
|
12
|
+
'edit-photo',
|
|
13
|
+
'expand',
|
|
14
|
+
'green-dot',
|
|
15
|
+
'chevron-left',
|
|
16
|
+
'chevron-up',
|
|
17
|
+
'chevron-right',
|
|
18
|
+
'chevron-down',
|
|
19
|
+
'chevron-solid-down',
|
|
20
|
+
'link',
|
|
21
|
+
'location',
|
|
22
|
+
'location-pin',
|
|
23
|
+
'more',
|
|
24
|
+
'open',
|
|
25
|
+
'percent',
|
|
26
|
+
'photo',
|
|
27
|
+
'plus',
|
|
28
|
+
'qr',
|
|
29
|
+
'qr-code',
|
|
30
|
+
'remove',
|
|
31
|
+
'search',
|
|
32
|
+
'send-fill',
|
|
33
|
+
'settings',
|
|
34
|
+
'stop-filled',
|
|
35
|
+
'calendar',
|
|
36
|
+
'gear',
|
|
37
|
+
'restore',
|
|
38
|
+
'enter',
|
|
39
|
+
'lock',
|
|
40
|
+
];
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TextInput } from 'react-native';
|
|
3
|
+
import type { InputProps } from './types';
|
|
4
|
+
export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<TextInput>>;
|
|
5
|
+
//# sourceMappingURL=Input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/Input/Input.tsx"],"names":[],"mappings":";AACA,OAAO,EAAY,SAAS,EAA2D,MAAM,cAAc,CAAC;AAe5G,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAO1C,eAAO,MAAM,KAAK,kGAoIhB,CAAC"}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
|
|
3
|
+
import { Animated } from 'react-native';
|
|
4
|
+
import { AnimatedPlaceholderWrap, Container, FloatingPlaceholderText, FloatingRequiredAsterisk, InputRow, InputWrapper, PlaceholderText, RequiredAsterisk, RightIconWrap, StyledInput, SupportingText, } from './styles';
|
|
5
|
+
import { INPUT_TOKENS } from './constants';
|
|
6
|
+
const ANIM_DURATION = 180;
|
|
7
|
+
const EMPTY_Y = (INPUT_TOKENS.wrapperHeight - INPUT_TOKENS.input.lineHeight) / 2;
|
|
8
|
+
const FLOAT_Y = INPUT_TOKENS.wrapperPaddingTop;
|
|
9
|
+
export const Input = forwardRef(function Input({ placeholder, required = false, value, defaultValue, helperText, errorText, editable = true, disabled = false, rightIcon, onFocus, onBlur, placeholderTextColor, containerStyle, inputWrapperStyle, inputStyle, ...textInputProps }, ref) {
|
|
10
|
+
const [isFocused, setIsFocused] = useState(false);
|
|
11
|
+
const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue ?? '');
|
|
12
|
+
const isControlled = value !== undefined;
|
|
13
|
+
const currentValue = isControlled ? (value ?? '') : uncontrolledValue;
|
|
14
|
+
const hasError = errorText != null && errorText.length > 0;
|
|
15
|
+
const hasPlaceholder = placeholder != null && placeholder.length > 0;
|
|
16
|
+
const hasValue = currentValue.toString().trim().length > 0;
|
|
17
|
+
const shouldFloat = hasValue || isFocused;
|
|
18
|
+
const nativeInputRef = useRef(null);
|
|
19
|
+
useImperativeHandle(ref, () => nativeInputRef.current, []);
|
|
20
|
+
// styled-components omits `ref` from its generated prop types; cast once here
|
|
21
|
+
const NativeInput = StyledInput;
|
|
22
|
+
const anim = useRef(new Animated.Value(shouldFloat ? 1 : 0)).current;
|
|
23
|
+
useEffect(() => {
|
|
24
|
+
Animated.timing(anim, {
|
|
25
|
+
toValue: shouldFloat ? 1 : 0,
|
|
26
|
+
duration: ANIM_DURATION,
|
|
27
|
+
useNativeDriver: true,
|
|
28
|
+
}).start();
|
|
29
|
+
}, [shouldFloat, anim]);
|
|
30
|
+
const translateY = anim.interpolate({
|
|
31
|
+
inputRange: [0, 1],
|
|
32
|
+
outputRange: [EMPTY_Y, FLOAT_Y],
|
|
33
|
+
});
|
|
34
|
+
const emptyOpacity = anim.interpolate({
|
|
35
|
+
inputRange: [0, 1],
|
|
36
|
+
outputRange: [1, 0],
|
|
37
|
+
});
|
|
38
|
+
const floatOpacity = anim.interpolate({
|
|
39
|
+
inputRange: [0, 1],
|
|
40
|
+
outputRange: [0, 1],
|
|
41
|
+
});
|
|
42
|
+
const wrapperState = useMemo(() => {
|
|
43
|
+
if (hasError)
|
|
44
|
+
return 'error';
|
|
45
|
+
if (isFocused)
|
|
46
|
+
return 'focused';
|
|
47
|
+
return 'default';
|
|
48
|
+
}, [hasError, isFocused]);
|
|
49
|
+
const handleFocus = useCallback((event) => {
|
|
50
|
+
setIsFocused(true);
|
|
51
|
+
onFocus?.(event);
|
|
52
|
+
}, [onFocus]);
|
|
53
|
+
const handleBlur = useCallback((event) => {
|
|
54
|
+
setIsFocused(false);
|
|
55
|
+
onBlur?.(event);
|
|
56
|
+
}, [onBlur]);
|
|
57
|
+
const handleChangeText = useCallback((text) => {
|
|
58
|
+
if (!isControlled)
|
|
59
|
+
setUncontrolledValue(text);
|
|
60
|
+
textInputProps.onChangeText?.(text);
|
|
61
|
+
}, [isControlled, textInputProps.onChangeText]);
|
|
62
|
+
const supportingText = hasError ? errorText : helperText;
|
|
63
|
+
return (_jsxs(Container, { style: containerStyle, children: [_jsxs(InputWrapper, { "$state": wrapperState, "$isDisabled": disabled, style: inputWrapperStyle, children: [hasPlaceholder && (_jsxs(AnimatedPlaceholderWrap, { style: { transform: [{ translateY }] }, pointerEvents: "none", children: [_jsxs(Animated.View, { style: { flexDirection: 'row', position: 'absolute', opacity: emptyOpacity }, children: [_jsx(PlaceholderText, { children: placeholder }), required && _jsx(RequiredAsterisk, { children: "*" })] }), _jsxs(Animated.View, { style: { flexDirection: 'row', opacity: floatOpacity }, children: [_jsx(FloatingPlaceholderText, { children: placeholder }), required && _jsx(FloatingRequiredAsterisk, { children: "*" })] })] })), _jsx(InputRow, { children: _jsx(NativeInput, { ref: nativeInputRef, ...textInputProps, value: isControlled ? value : undefined, defaultValue: isControlled ? undefined : defaultValue, onChangeText: handleChangeText, editable: editable, onFocus: handleFocus, onBlur: handleBlur, placeholderTextColor: placeholderTextColor ?? INPUT_TOKENS.input.placeholderColor, style: [{ flex: 1 }, inputStyle] }) }), rightIcon != null && _jsx(RightIconWrap, { children: rightIcon })] }), supportingText != null && supportingText.length > 0 && (_jsx(SupportingText, { "$isError": hasError, children: supportingText }))] }));
|
|
64
|
+
});
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Input design tokens — align with Figma DS (node 120-4768).
|
|
3
|
+
*/
|
|
4
|
+
export declare const INPUT_TOKENS: {
|
|
5
|
+
readonly borderWidth: 1;
|
|
6
|
+
readonly borderRadius: 12;
|
|
7
|
+
readonly borderColor: {
|
|
8
|
+
readonly default: "#EFF4F7";
|
|
9
|
+
readonly focused: "#007AFF";
|
|
10
|
+
readonly error: "#FF3B30";
|
|
11
|
+
readonly disabled: "#D1D1D6";
|
|
12
|
+
};
|
|
13
|
+
readonly backgroundColor: {
|
|
14
|
+
readonly default: "#EFF4F7";
|
|
15
|
+
readonly disabled: "#F2F2F7";
|
|
16
|
+
};
|
|
17
|
+
readonly floatingPlaceholder: {
|
|
18
|
+
readonly fontFamily: "SB Sans Text";
|
|
19
|
+
readonly fontSize: 12;
|
|
20
|
+
readonly fontWeight: "500";
|
|
21
|
+
readonly lineHeight: 16;
|
|
22
|
+
readonly letterSpacing: -0.32;
|
|
23
|
+
readonly letterBigSpacing: 0.2;
|
|
24
|
+
readonly color: "#8E8E93";
|
|
25
|
+
};
|
|
26
|
+
readonly requiredAsteriskColor: "#FF3B30";
|
|
27
|
+
readonly input: {
|
|
28
|
+
readonly fontFamily: "SB Sans Text";
|
|
29
|
+
readonly supportingFontFamily: "SF Pro Display Regular";
|
|
30
|
+
readonly fontSize: 16;
|
|
31
|
+
readonly fontWeight: "500";
|
|
32
|
+
readonly lineHeight: 20;
|
|
33
|
+
readonly letterSpacing: 0;
|
|
34
|
+
readonly color: "#1C1C1E";
|
|
35
|
+
readonly placeholderColor: "#8E8E93";
|
|
36
|
+
};
|
|
37
|
+
readonly supporting: {
|
|
38
|
+
readonly fontFamily: "SB Sans Text";
|
|
39
|
+
readonly fontSize: 16;
|
|
40
|
+
readonly fontWeight: "500";
|
|
41
|
+
readonly lineHeight: 20;
|
|
42
|
+
readonly letterSpacing: -0.32;
|
|
43
|
+
readonly color: {
|
|
44
|
+
readonly helper: "#636366";
|
|
45
|
+
readonly error: "#FF5C16";
|
|
46
|
+
};
|
|
47
|
+
};
|
|
48
|
+
readonly containerGap: 0;
|
|
49
|
+
readonly wrapperHeight: 56;
|
|
50
|
+
readonly wrapperPaddingTop: 8;
|
|
51
|
+
readonly inputPaddingTop: 26;
|
|
52
|
+
readonly paddingHorizontal: 16;
|
|
53
|
+
readonly paddingVertical: 6;
|
|
54
|
+
readonly disabledOpacity: 0.7;
|
|
55
|
+
};
|
|
56
|
+
//# sourceMappingURL=constants.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/Input/constants.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8Df,CAAC"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Input design tokens — align with Figma DS (node 120-4768).
|
|
3
|
+
*/
|
|
4
|
+
export const INPUT_TOKENS = {
|
|
5
|
+
// Border
|
|
6
|
+
borderWidth: 1,
|
|
7
|
+
borderRadius: 12,
|
|
8
|
+
borderColor: {
|
|
9
|
+
default: '#EFF4F7',
|
|
10
|
+
focused: '#007AFF',
|
|
11
|
+
error: '#FF3B30',
|
|
12
|
+
disabled: '#D1D1D6',
|
|
13
|
+
},
|
|
14
|
+
// Background — filled field look (Figma 120-4768)
|
|
15
|
+
backgroundColor: {
|
|
16
|
+
default: '#EFF4F7',
|
|
17
|
+
disabled: '#F2F2F7',
|
|
18
|
+
},
|
|
19
|
+
// Floating placeholder (small text always on top)
|
|
20
|
+
floatingPlaceholder: {
|
|
21
|
+
fontFamily: 'SB Sans Text',
|
|
22
|
+
fontSize: 12,
|
|
23
|
+
fontWeight: '500',
|
|
24
|
+
lineHeight: 16,
|
|
25
|
+
letterSpacing: -0.32,
|
|
26
|
+
letterBigSpacing: 0.2,
|
|
27
|
+
color: '#8E8E93',
|
|
28
|
+
},
|
|
29
|
+
requiredAsteriskColor: '#FF3B30',
|
|
30
|
+
// Typography — input (SB Sans Text, filled field)
|
|
31
|
+
input: {
|
|
32
|
+
fontFamily: 'SB Sans Text',
|
|
33
|
+
supportingFontFamily: 'SF Pro Display Regular',
|
|
34
|
+
fontSize: 16,
|
|
35
|
+
fontWeight: '500',
|
|
36
|
+
lineHeight: 20,
|
|
37
|
+
letterSpacing: 0,
|
|
38
|
+
color: '#1C1C1E',
|
|
39
|
+
placeholderColor: '#8E8E93',
|
|
40
|
+
},
|
|
41
|
+
// Typography — supporting (helper / error)
|
|
42
|
+
supporting: {
|
|
43
|
+
fontFamily: 'SB Sans Text',
|
|
44
|
+
fontSize: 16,
|
|
45
|
+
fontWeight: '500',
|
|
46
|
+
lineHeight: 20,
|
|
47
|
+
letterSpacing: -0.32,
|
|
48
|
+
color: {
|
|
49
|
+
helper: '#636366',
|
|
50
|
+
error: '#FF5C16',
|
|
51
|
+
},
|
|
52
|
+
},
|
|
53
|
+
// Layout
|
|
54
|
+
containerGap: 0,
|
|
55
|
+
wrapperHeight: 56,
|
|
56
|
+
wrapperPaddingTop: 8,
|
|
57
|
+
inputPaddingTop: 26,
|
|
58
|
+
paddingHorizontal: 16,
|
|
59
|
+
paddingVertical: 6,
|
|
60
|
+
disabledOpacity: 0.7,
|
|
61
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Input } from './Input';
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { Animated } from 'react-native';
|
|
3
|
+
export type InputState = 'default' | 'focused' | 'error';
|
|
4
|
+
export declare const Container: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").ViewProps, never>>;
|
|
5
|
+
export declare const InputWrapper: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").Substitute<import("react-native").ViewProps, {
|
|
6
|
+
$state: InputState;
|
|
7
|
+
$isDisabled: boolean;
|
|
8
|
+
}>>;
|
|
9
|
+
/** Animated wrapper — moves vertically between centered and floated position */
|
|
10
|
+
export declare const AnimatedPlaceholderWrap: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").View>>, never>>;
|
|
11
|
+
/** Inline placeholder text (input font size) — visible when empty */
|
|
12
|
+
export declare const PlaceholderText: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").TextProps, never>>;
|
|
13
|
+
export declare const RequiredAsterisk: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").TextProps, never>>;
|
|
14
|
+
/** Floating placeholder text (smaller) — visible when field has value or focus */
|
|
15
|
+
export declare const FloatingPlaceholderText: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").TextProps, never>>;
|
|
16
|
+
export declare const FloatingRequiredAsterisk: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").TextProps, never>>;
|
|
17
|
+
export declare const InputRow: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").ViewProps, never>>;
|
|
18
|
+
export declare const RightIconWrap: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").ViewProps, never>>;
|
|
19
|
+
export declare const StyledInput: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").FastOmit<import("react-native").TextInputProps, never>>;
|
|
20
|
+
export declare const SupportingText: import("styled-components/native/dist/types").IStyledComponentBase<"native", import("styled-components/native/dist/types").Substitute<import("react-native").TextProps, {
|
|
21
|
+
$isError: boolean;
|
|
22
|
+
}>>;
|
|
23
|
+
//# sourceMappingURL=styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Input/styles.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAIxC,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAQzD,eAAO,MAAM,SAAS,+KAGrB,CAAC;AAEF,eAAO,MAAM,YAAY;YACf,UAAU;iBACL,OAAO;GAcrB,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,uBAAuB,oQAKnC,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,eAAe,+KAO3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,+KAQ5B,CAAC;AAEF,kFAAkF;AAClF,eAAO,MAAM,uBAAuB,+KAOnC,CAAC;AAEF,eAAO,MAAM,wBAAwB,+KAQpC,CAAC;AAEF,eAAO,MAAM,QAAQ,+KAGpB,CAAC;AAEF,eAAO,MAAM,aAAa,+KAQzB,CAAC;AAEF,eAAO,MAAM,WAAW,oLASvB,CAAC;AAEF,eAAO,MAAM,cAAc;cAA2B,OAAO;GAQ5D,CAAC"}
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
import { Animated } from 'react-native';
|
|
2
|
+
import styled from 'styled-components/native';
|
|
3
|
+
import { INPUT_TOKENS } from './constants';
|
|
4
|
+
const BORDER_COLOR_BY_STATE = {
|
|
5
|
+
default: INPUT_TOKENS.borderColor.default,
|
|
6
|
+
focused: INPUT_TOKENS.borderColor.focused,
|
|
7
|
+
error: INPUT_TOKENS.borderColor.error,
|
|
8
|
+
};
|
|
9
|
+
export const Container = styled.View `
|
|
10
|
+
width: 100%;
|
|
11
|
+
gap: ${INPUT_TOKENS.containerGap}px;
|
|
12
|
+
`;
|
|
13
|
+
export const InputWrapper = styled.View `
|
|
14
|
+
height: ${INPUT_TOKENS.wrapperHeight}px;
|
|
15
|
+
border-width: ${INPUT_TOKENS.borderWidth}px;
|
|
16
|
+
border-radius: ${INPUT_TOKENS.borderRadius}px;
|
|
17
|
+
border-color: ${INPUT_TOKENS.borderColor.default};
|
|
18
|
+
background-color: ${({ $isDisabled }) => $isDisabled ? INPUT_TOKENS.backgroundColor.disabled : INPUT_TOKENS.backgroundColor.default};
|
|
19
|
+
opacity: ${({ $isDisabled }) => ($isDisabled ? INPUT_TOKENS.disabledOpacity : 1)};
|
|
20
|
+
padding-horizontal: ${INPUT_TOKENS.paddingHorizontal}px;
|
|
21
|
+
padding-vertical: ${INPUT_TOKENS.paddingVertical}px;
|
|
22
|
+
position: relative;
|
|
23
|
+
justify-content: flex-end;
|
|
24
|
+
padding-bottom: 8px;
|
|
25
|
+
`;
|
|
26
|
+
/** Animated wrapper — moves vertically between centered and floated position */
|
|
27
|
+
export const AnimatedPlaceholderWrap = styled(Animated.View) `
|
|
28
|
+
position: absolute;
|
|
29
|
+
left: ${INPUT_TOKENS.paddingHorizontal}px;
|
|
30
|
+
right: ${INPUT_TOKENS.paddingHorizontal}px;
|
|
31
|
+
top: 0;
|
|
32
|
+
`;
|
|
33
|
+
/** Inline placeholder text (input font size) — visible when empty */
|
|
34
|
+
export const PlaceholderText = styled.Text `
|
|
35
|
+
font-family: ${INPUT_TOKENS.input.fontFamily};
|
|
36
|
+
font-size: ${INPUT_TOKENS.input.fontSize}px;
|
|
37
|
+
font-weight: ${INPUT_TOKENS.input.fontWeight};
|
|
38
|
+
line-height: ${INPUT_TOKENS.input.lineHeight}px;
|
|
39
|
+
letter-spacing: ${INPUT_TOKENS.input.letterSpacing}px;
|
|
40
|
+
color: ${INPUT_TOKENS.input.placeholderColor};
|
|
41
|
+
`;
|
|
42
|
+
export const RequiredAsterisk = styled.Text `
|
|
43
|
+
font-family: ${INPUT_TOKENS.input.fontFamily};
|
|
44
|
+
font-size: ${INPUT_TOKENS.input.fontSize}px;
|
|
45
|
+
font-weight: ${INPUT_TOKENS.input.fontWeight};
|
|
46
|
+
line-height: ${INPUT_TOKENS.input.lineHeight}px;
|
|
47
|
+
letter-spacing: ${INPUT_TOKENS.input.letterSpacing}px;
|
|
48
|
+
color: ${INPUT_TOKENS.requiredAsteriskColor};
|
|
49
|
+
margin-left: 2px;
|
|
50
|
+
`;
|
|
51
|
+
/** Floating placeholder text (smaller) — visible when field has value or focus */
|
|
52
|
+
export const FloatingPlaceholderText = styled.Text `
|
|
53
|
+
font-family: ${INPUT_TOKENS.input.supportingFontFamily};
|
|
54
|
+
font-size: ${INPUT_TOKENS.floatingPlaceholder.fontSize}px;
|
|
55
|
+
font-weight: ${INPUT_TOKENS.floatingPlaceholder.fontWeight};
|
|
56
|
+
line-height: ${INPUT_TOKENS.floatingPlaceholder.lineHeight}px;
|
|
57
|
+
letter-spacing: ${INPUT_TOKENS.floatingPlaceholder.letterBigSpacing}px;
|
|
58
|
+
color: ${INPUT_TOKENS.floatingPlaceholder.color};
|
|
59
|
+
`;
|
|
60
|
+
export const FloatingRequiredAsterisk = styled.Text `
|
|
61
|
+
font-family: ${INPUT_TOKENS.floatingPlaceholder.fontFamily};
|
|
62
|
+
font-size: ${INPUT_TOKENS.floatingPlaceholder.fontSize}px;
|
|
63
|
+
font-weight: ${INPUT_TOKENS.floatingPlaceholder.fontWeight};
|
|
64
|
+
line-height: ${INPUT_TOKENS.floatingPlaceholder.lineHeight}px;
|
|
65
|
+
letter-spacing: ${INPUT_TOKENS.floatingPlaceholder.letterSpacing}px;
|
|
66
|
+
color: ${INPUT_TOKENS.requiredAsteriskColor};
|
|
67
|
+
margin-left: 2px;
|
|
68
|
+
`;
|
|
69
|
+
export const InputRow = styled.View `
|
|
70
|
+
flex-direction: row;
|
|
71
|
+
align-items: center;
|
|
72
|
+
`;
|
|
73
|
+
export const RightIconWrap = styled.View `
|
|
74
|
+
position: absolute;
|
|
75
|
+
right: ${INPUT_TOKENS.paddingHorizontal}px;
|
|
76
|
+
top: 0;
|
|
77
|
+
bottom: 0;
|
|
78
|
+
width: 24px;
|
|
79
|
+
align-items: center;
|
|
80
|
+
justify-content: center;
|
|
81
|
+
`;
|
|
82
|
+
export const StyledInput = styled.TextInput `
|
|
83
|
+
font-family: ${INPUT_TOKENS.input.fontFamily};
|
|
84
|
+
font-size: ${INPUT_TOKENS.input.fontSize}px;
|
|
85
|
+
font-weight: ${INPUT_TOKENS.input.fontWeight};
|
|
86
|
+
line-height: ${INPUT_TOKENS.input.lineHeight}px;
|
|
87
|
+
letter-spacing: ${INPUT_TOKENS.input.letterSpacing}px;
|
|
88
|
+
color: ${INPUT_TOKENS.input.color};
|
|
89
|
+
padding: 0;
|
|
90
|
+
margin: 0;
|
|
91
|
+
`;
|
|
92
|
+
export const SupportingText = styled.Text `
|
|
93
|
+
font-family: ${INPUT_TOKENS.supporting.fontFamily};
|
|
94
|
+
font-size: ${INPUT_TOKENS.supporting.fontSize}px;
|
|
95
|
+
font-weight: ${INPUT_TOKENS.supporting.fontWeight};
|
|
96
|
+
line-height: ${INPUT_TOKENS.supporting.lineHeight}px;
|
|
97
|
+
letter-spacing: ${INPUT_TOKENS.supporting.letterSpacing}px;
|
|
98
|
+
color: ${({ $isError }) => $isError ? INPUT_TOKENS.supporting.color.error : INPUT_TOKENS.supporting.color.helper};
|
|
99
|
+
`;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import type { StyleProp, TextInputProps, TextStyle, ViewStyle } from 'react-native';
|
|
3
|
+
export interface InputProps extends Omit<TextInputProps, 'style'> {
|
|
4
|
+
/** When true, a red asterisk is shown after the placeholder (in floating placeholder) */
|
|
5
|
+
required?: boolean;
|
|
6
|
+
/** Helper text shown below the field when there is no error */
|
|
7
|
+
helperText?: string;
|
|
8
|
+
/** Error text shown below the field and highlights the border in red */
|
|
9
|
+
errorText?: string;
|
|
10
|
+
/** Element rendered on the right side of the input (e.g. chevron icon) */
|
|
11
|
+
rightIcon?: ReactNode;
|
|
12
|
+
/** Style for the outer container */
|
|
13
|
+
containerStyle?: StyleProp<ViewStyle>;
|
|
14
|
+
/** Style for the input shell (border + background) */
|
|
15
|
+
inputWrapperStyle?: StyleProp<ViewStyle>;
|
|
16
|
+
/** Style for the native TextInput */
|
|
17
|
+
inputStyle?: StyleProp<TextStyle>;
|
|
18
|
+
/** Disabled state */
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
}
|
|
21
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Input/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpF,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC;IAC/D,yFAAyF;IACzF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,oCAAoC;IACpC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,sDAAsD;IACtD,iBAAiB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACzC,qCAAqC;IACrC,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export interface CheckMarkProps {
|
|
2
|
+
selected?: boolean;
|
|
3
|
+
/** Fill colour when selected. @default '#B2F549' */
|
|
4
|
+
color?: string;
|
|
5
|
+
/** Border colour when unselected. @default '#C7C7CC' */
|
|
6
|
+
inactiveColor?: string;
|
|
7
|
+
size?: number;
|
|
8
|
+
}
|
|
9
|
+
export declare function CheckMark({ selected, color, inactiveColor, size, }: CheckMarkProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
//# sourceMappingURL=CheckMark.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CheckMark.d.ts","sourceRoot":"","sources":["../../src/ListCell/CheckMark.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,SAAS,CAAC,EACxB,QAAgB,EAChB,KAAiB,EACjB,aAAyB,EACzB,IAA0B,GAC3B,EAAE,cAAc,2CA0ChB"}
|