@situaction/traquiste-mobile 1.0.0 → 1.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/README.md +61 -90
- package/build/components/AssociationTag/AssociationTag.d.ts +19 -0
- package/build/components/AssociationTag/AssociationTag.d.ts.map +1 -0
- package/build/components/AssociationTag/AssociationTag.js +29 -0
- package/build/components/AssociationTag/AssociationTag.js.map +1 -0
- package/build/components/AssociationTag/AssociationTag.styles.d.ts +21 -0
- package/build/components/AssociationTag/AssociationTag.styles.d.ts.map +1 -0
- package/build/components/AssociationTag/AssociationTag.styles.js +26 -0
- package/build/components/AssociationTag/AssociationTag.styles.js.map +1 -0
- package/build/components/AssociationTag/index.d.ts +3 -0
- package/build/components/AssociationTag/index.d.ts.map +1 -0
- package/build/components/AssociationTag/index.js +2 -0
- package/build/components/AssociationTag/index.js.map +1 -0
- package/build/components/BottomSheet/BottomSheet.d.ts +36 -0
- package/build/components/BottomSheet/BottomSheet.d.ts.map +1 -0
- package/build/components/BottomSheet/BottomSheet.js +76 -0
- package/build/components/BottomSheet/BottomSheet.js.map +1 -0
- package/build/components/BottomSheet/BottomSheet.styles.d.ts +32 -0
- package/build/components/BottomSheet/BottomSheet.styles.d.ts.map +1 -0
- package/build/components/BottomSheet/BottomSheet.styles.js +31 -0
- package/build/components/BottomSheet/BottomSheet.styles.js.map +1 -0
- package/build/components/BottomSheet/index.d.ts +3 -0
- package/build/components/BottomSheet/index.d.ts.map +1 -0
- package/build/components/BottomSheet/index.js +2 -0
- package/build/components/BottomSheet/index.js.map +1 -0
- package/build/components/Button/Button.d.ts +5 -1
- package/build/components/Button/Button.d.ts.map +1 -1
- package/build/components/Button/Button.js +12 -6
- package/build/components/Button/Button.js.map +1 -1
- package/build/components/ButtonAction/ButtonAction.d.ts +5 -1
- package/build/components/ButtonAction/ButtonAction.d.ts.map +1 -1
- package/build/components/ButtonAction/ButtonAction.js +2 -2
- package/build/components/ButtonAction/ButtonAction.js.map +1 -1
- package/build/components/ButtonMap/ButtonMap.d.ts +5 -1
- package/build/components/ButtonMap/ButtonMap.d.ts.map +1 -1
- package/build/components/ButtonMap/ButtonMap.js +11 -9
- package/build/components/ButtonMap/ButtonMap.js.map +1 -1
- package/build/components/ButtonMenu/ButtonMenu.d.ts +5 -1
- package/build/components/ButtonMenu/ButtonMenu.d.ts.map +1 -1
- package/build/components/ButtonMenu/ButtonMenu.js +17 -17
- package/build/components/ButtonMenu/ButtonMenu.js.map +1 -1
- package/build/components/Calendar/Calendar.d.ts +4 -0
- package/build/components/Calendar/Calendar.d.ts.map +1 -0
- package/build/components/Calendar/Calendar.i18n.d.ts +34 -0
- package/build/components/Calendar/Calendar.i18n.d.ts.map +1 -0
- package/build/components/Calendar/Calendar.i18n.js +34 -0
- package/build/components/Calendar/Calendar.i18n.js.map +1 -0
- package/build/components/Calendar/Calendar.js +172 -0
- package/build/components/Calendar/Calendar.js.map +1 -0
- package/build/components/Calendar/Calendar.styles.d.ts +257 -0
- package/build/components/Calendar/Calendar.styles.d.ts.map +1 -0
- package/build/components/Calendar/Calendar.styles.js +234 -0
- package/build/components/Calendar/Calendar.styles.js.map +1 -0
- package/build/components/Calendar/Calendar.types.d.ts +62 -0
- package/build/components/Calendar/Calendar.types.d.ts.map +1 -0
- package/build/components/Calendar/Calendar.types.js +2 -0
- package/build/components/Calendar/Calendar.types.js.map +1 -0
- package/build/components/Calendar/CalendarDay.d.ts +4 -0
- package/build/components/Calendar/CalendarDay.d.ts.map +1 -0
- package/build/components/Calendar/CalendarDay.js +52 -0
- package/build/components/Calendar/CalendarDay.js.map +1 -0
- package/build/components/Calendar/CalendarHeader.d.ts +4 -0
- package/build/components/Calendar/CalendarHeader.d.ts.map +1 -0
- package/build/components/Calendar/CalendarHeader.js +16 -0
- package/build/components/Calendar/CalendarHeader.js.map +1 -0
- package/build/components/Calendar/CalendarLegend.d.ts +3 -0
- package/build/components/Calendar/CalendarLegend.d.ts.map +1 -0
- package/build/components/Calendar/CalendarLegend.js +38 -0
- package/build/components/Calendar/CalendarLegend.js.map +1 -0
- package/build/components/Calendar/CalendarYearPicker.d.ts +19 -0
- package/build/components/Calendar/CalendarYearPicker.d.ts.map +1 -0
- package/build/components/Calendar/CalendarYearPicker.js +158 -0
- package/build/components/Calendar/CalendarYearPicker.js.map +1 -0
- package/build/components/Calendar/index.d.ts +5 -0
- package/build/components/Calendar/index.d.ts.map +1 -0
- package/build/components/Calendar/index.js +3 -0
- package/build/components/Calendar/index.js.map +1 -0
- package/build/components/Card/Card.d.ts +25 -0
- package/build/components/Card/Card.d.ts.map +1 -0
- package/build/components/Card/Card.js +31 -0
- package/build/components/Card/Card.js.map +1 -0
- package/build/components/Card/Card.styles.d.ts +15 -0
- package/build/components/Card/Card.styles.d.ts.map +1 -0
- package/build/components/Card/Card.styles.js +18 -0
- package/build/components/Card/Card.styles.js.map +1 -0
- package/build/components/Card/index.d.ts +3 -0
- package/build/components/Card/index.d.ts.map +1 -0
- package/build/components/Card/index.js +2 -0
- package/build/components/Card/index.js.map +1 -0
- package/build/components/CardEquip/CardEquip.d.ts +60 -0
- package/build/components/CardEquip/CardEquip.d.ts.map +1 -0
- package/build/components/CardEquip/CardEquip.js +106 -0
- package/build/components/CardEquip/CardEquip.js.map +1 -0
- package/build/components/CardEquip/CardEquip.styles.d.ts +125 -0
- package/build/components/CardEquip/CardEquip.styles.d.ts.map +1 -0
- package/build/components/CardEquip/CardEquip.styles.js +139 -0
- package/build/components/CardEquip/CardEquip.styles.js.map +1 -0
- package/build/components/CardEquip/index.d.ts +3 -0
- package/build/components/CardEquip/index.d.ts.map +1 -0
- package/build/components/CardEquip/index.js +2 -0
- package/build/components/CardEquip/index.js.map +1 -0
- package/build/components/CardProfile/CardProfile.d.ts +55 -0
- package/build/components/CardProfile/CardProfile.d.ts.map +1 -0
- package/build/components/CardProfile/CardProfile.js +74 -0
- package/build/components/CardProfile/CardProfile.js.map +1 -0
- package/build/components/CardProfile/CardProfile.styles.d.ts +62 -0
- package/build/components/CardProfile/CardProfile.styles.d.ts.map +1 -0
- package/build/components/CardProfile/CardProfile.styles.js +65 -0
- package/build/components/CardProfile/CardProfile.styles.js.map +1 -0
- package/build/components/CardProfile/index.d.ts +3 -0
- package/build/components/CardProfile/index.d.ts.map +1 -0
- package/build/components/CardProfile/index.js +2 -0
- package/build/components/CardProfile/index.js.map +1 -0
- package/build/components/Checkbox/Checkbox.d.ts +28 -0
- package/build/components/Checkbox/Checkbox.d.ts.map +1 -0
- package/build/components/Checkbox/Checkbox.js +77 -0
- package/build/components/Checkbox/Checkbox.js.map +1 -0
- package/build/components/Checkbox/Checkbox.styles.d.ts +34 -0
- package/build/components/Checkbox/Checkbox.styles.d.ts.map +1 -0
- package/build/components/Checkbox/Checkbox.styles.js +39 -0
- package/build/components/Checkbox/Checkbox.styles.js.map +1 -0
- package/build/components/Checkbox/Checkbox.types.d.ts +25 -0
- package/build/components/Checkbox/Checkbox.types.d.ts.map +1 -0
- package/build/components/Checkbox/Checkbox.types.js +5 -0
- package/build/components/Checkbox/Checkbox.types.js.map +1 -0
- package/build/components/Checkbox/index.d.ts +3 -0
- package/build/components/Checkbox/index.d.ts.map +1 -0
- package/build/components/Checkbox/index.js +2 -0
- package/build/components/Checkbox/index.js.map +1 -0
- package/build/components/Cluster/Cluster.d.ts +23 -0
- package/build/components/Cluster/Cluster.d.ts.map +1 -0
- package/build/components/Cluster/Cluster.js +34 -0
- package/build/components/Cluster/Cluster.js.map +1 -0
- package/build/components/Cluster/Cluster.styles.d.ts +33 -0
- package/build/components/Cluster/Cluster.styles.d.ts.map +1 -0
- package/build/components/Cluster/Cluster.styles.js +34 -0
- package/build/components/Cluster/Cluster.styles.js.map +1 -0
- package/build/components/Cluster/index.d.ts +3 -0
- package/build/components/Cluster/index.d.ts.map +1 -0
- package/build/components/Cluster/index.js +2 -0
- package/build/components/Cluster/index.js.map +1 -0
- package/build/components/ColorPicker/ColorPicker.d.ts +20 -0
- package/build/components/ColorPicker/ColorPicker.d.ts.map +1 -0
- package/build/components/ColorPicker/ColorPicker.js +17 -0
- package/build/components/ColorPicker/ColorPicker.js.map +1 -0
- package/build/components/ColorPicker/ColorPicker.styles.d.ts +10 -0
- package/build/components/ColorPicker/ColorPicker.styles.d.ts.map +1 -0
- package/build/components/ColorPicker/ColorPicker.styles.js +11 -0
- package/build/components/ColorPicker/ColorPicker.styles.js.map +1 -0
- package/build/components/ColorPicker/index.d.ts +3 -0
- package/build/components/ColorPicker/index.d.ts.map +1 -0
- package/build/components/ColorPicker/index.js +2 -0
- package/build/components/ColorPicker/index.js.map +1 -0
- package/build/components/ColorSwatch/ColorSwatch.d.ts +20 -0
- package/build/components/ColorSwatch/ColorSwatch.d.ts.map +1 -0
- package/build/components/ColorSwatch/ColorSwatch.js +35 -0
- package/build/components/ColorSwatch/ColorSwatch.js.map +1 -0
- package/build/components/ColorSwatch/ColorSwatch.styles.d.ts +16 -0
- package/build/components/ColorSwatch/ColorSwatch.styles.d.ts.map +1 -0
- package/build/components/ColorSwatch/ColorSwatch.styles.js +19 -0
- package/build/components/ColorSwatch/ColorSwatch.styles.js.map +1 -0
- package/build/components/ColorSwatch/index.d.ts +3 -0
- package/build/components/ColorSwatch/index.d.ts.map +1 -0
- package/build/components/ColorSwatch/index.js +2 -0
- package/build/components/ColorSwatch/index.js.map +1 -0
- package/build/components/FileCard/FileCard.d.ts +29 -0
- package/build/components/FileCard/FileCard.d.ts.map +1 -0
- package/build/components/FileCard/FileCard.js +66 -0
- package/build/components/FileCard/FileCard.js.map +1 -0
- package/build/components/FileCard/FileCard.styles.d.ts +54 -0
- package/build/components/FileCard/FileCard.styles.d.ts.map +1 -0
- package/build/components/FileCard/FileCard.styles.js +56 -0
- package/build/components/FileCard/FileCard.styles.js.map +1 -0
- package/build/components/FileCard/index.d.ts +3 -0
- package/build/components/FileCard/index.d.ts.map +1 -0
- package/build/components/FileCard/index.js +2 -0
- package/build/components/FileCard/index.js.map +1 -0
- package/build/components/FilterChip/FilterChip.d.ts +5 -1
- package/build/components/FilterChip/FilterChip.d.ts.map +1 -1
- package/build/components/FilterChip/FilterChip.js +55 -25
- package/build/components/FilterChip/FilterChip.js.map +1 -1
- package/build/components/FilterNav/FilterNav.d.ts +53 -0
- package/build/components/FilterNav/FilterNav.d.ts.map +1 -0
- package/build/components/FilterNav/FilterNav.js +39 -0
- package/build/components/FilterNav/FilterNav.js.map +1 -0
- package/build/components/FilterNav/FilterNav.styles.d.ts +10 -0
- package/build/components/FilterNav/FilterNav.styles.d.ts.map +1 -0
- package/build/components/FilterNav/FilterNav.styles.js +11 -0
- package/build/components/FilterNav/FilterNav.styles.js.map +1 -0
- package/build/components/FilterNav/index.d.ts +3 -0
- package/build/components/FilterNav/index.d.ts.map +1 -0
- package/build/components/FilterNav/index.js +2 -0
- package/build/components/FilterNav/index.js.map +1 -0
- package/build/components/ImgPicker/ImgPicker.d.ts +47 -0
- package/build/components/ImgPicker/ImgPicker.d.ts.map +1 -0
- package/build/components/ImgPicker/ImgPicker.js +49 -0
- package/build/components/ImgPicker/ImgPicker.js.map +1 -0
- package/build/components/ImgPicker/ImgPicker.styles.d.ts +18 -0
- package/build/components/ImgPicker/ImgPicker.styles.d.ts.map +1 -0
- package/build/components/ImgPicker/ImgPicker.styles.js +19 -0
- package/build/components/ImgPicker/ImgPicker.styles.js.map +1 -0
- package/build/components/ImgPicker/index.d.ts +3 -0
- package/build/components/ImgPicker/index.d.ts.map +1 -0
- package/build/components/ImgPicker/index.js +2 -0
- package/build/components/ImgPicker/index.js.map +1 -0
- package/build/components/InlineInfo/InlineInfo.d.ts +60 -0
- package/build/components/InlineInfo/InlineInfo.d.ts.map +1 -0
- package/build/components/InlineInfo/InlineInfo.js +115 -0
- package/build/components/InlineInfo/InlineInfo.js.map +1 -0
- package/build/components/InlineInfo/InlineInfo.styles.d.ts +42 -0
- package/build/components/InlineInfo/InlineInfo.styles.d.ts.map +1 -0
- package/build/components/InlineInfo/InlineInfo.styles.js +50 -0
- package/build/components/InlineInfo/InlineInfo.styles.js.map +1 -0
- package/build/components/InlineInfo/index.d.ts +3 -0
- package/build/components/InlineInfo/index.d.ts.map +1 -0
- package/build/components/InlineInfo/index.js +2 -0
- package/build/components/InlineInfo/index.js.map +1 -0
- package/build/components/Input/Input.d.ts +57 -0
- package/build/components/Input/Input.d.ts.map +1 -0
- package/build/components/Input/Input.js +103 -0
- package/build/components/Input/Input.js.map +1 -0
- package/build/components/Input/Input.styles.d.ts +39 -0
- package/build/components/Input/Input.styles.d.ts.map +1 -0
- package/build/components/Input/Input.styles.js +40 -0
- package/build/components/Input/Input.styles.js.map +1 -0
- package/build/components/Input/index.d.ts +3 -0
- package/build/components/Input/index.d.ts.map +1 -0
- package/build/components/Input/index.js +2 -0
- package/build/components/Input/index.js.map +1 -0
- package/build/components/ListGroup/ListGroup.d.ts +24 -0
- package/build/components/ListGroup/ListGroup.d.ts.map +1 -0
- package/build/components/ListGroup/ListGroup.js +44 -0
- package/build/components/ListGroup/ListGroup.js.map +1 -0
- package/build/components/ListGroup/index.d.ts +3 -0
- package/build/components/ListGroup/index.d.ts.map +1 -0
- package/build/components/ListGroup/index.js +2 -0
- package/build/components/ListGroup/index.js.map +1 -0
- package/build/components/ListItem/ListItem.d.ts +44 -0
- package/build/components/ListItem/ListItem.d.ts.map +1 -0
- package/build/components/ListItem/ListItem.js +69 -0
- package/build/components/ListItem/ListItem.js.map +1 -0
- package/build/components/ListItem/ListItem.styles.d.ts +66 -0
- package/build/components/ListItem/ListItem.styles.d.ts.map +1 -0
- package/build/components/ListItem/ListItem.styles.js +70 -0
- package/build/components/ListItem/ListItem.styles.js.map +1 -0
- package/build/components/ListItem/index.d.ts +3 -0
- package/build/components/ListItem/index.d.ts.map +1 -0
- package/build/components/ListItem/index.js +2 -0
- package/build/components/ListItem/index.js.map +1 -0
- package/build/components/MapPin/MapPin.d.ts +61 -0
- package/build/components/MapPin/MapPin.d.ts.map +1 -0
- package/build/components/MapPin/MapPin.js +118 -0
- package/build/components/MapPin/MapPin.js.map +1 -0
- package/build/components/MapPin/MapPin.styles.d.ts +93 -0
- package/build/components/MapPin/MapPin.styles.d.ts.map +1 -0
- package/build/components/MapPin/MapPin.styles.js +101 -0
- package/build/components/MapPin/MapPin.styles.js.map +1 -0
- package/build/components/MapPin/index.d.ts +3 -0
- package/build/components/MapPin/index.d.ts.map +1 -0
- package/build/components/MapPin/index.js +2 -0
- package/build/components/MapPin/index.js.map +1 -0
- package/build/components/MediaPicker/MediaPicker.d.ts +74 -0
- package/build/components/MediaPicker/MediaPicker.d.ts.map +1 -0
- package/build/components/MediaPicker/MediaPicker.js +43 -0
- package/build/components/MediaPicker/MediaPicker.js.map +1 -0
- package/build/components/MediaPicker/MediaPicker.styles.d.ts +30 -0
- package/build/components/MediaPicker/MediaPicker.styles.d.ts.map +1 -0
- package/build/components/MediaPicker/MediaPicker.styles.js +31 -0
- package/build/components/MediaPicker/MediaPicker.styles.js.map +1 -0
- package/build/components/MediaPicker/index.d.ts +3 -0
- package/build/components/MediaPicker/index.d.ts.map +1 -0
- package/build/components/MediaPicker/index.js +2 -0
- package/build/components/MediaPicker/index.js.map +1 -0
- package/build/components/PhotoCard/PhotoCard.d.ts +28 -0
- package/build/components/PhotoCard/PhotoCard.d.ts.map +1 -0
- package/build/components/PhotoCard/PhotoCard.js +53 -0
- package/build/components/PhotoCard/PhotoCard.js.map +1 -0
- package/build/components/PhotoCard/PhotoCard.styles.d.ts +47 -0
- package/build/components/PhotoCard/PhotoCard.styles.d.ts.map +1 -0
- package/build/components/PhotoCard/PhotoCard.styles.js +45 -0
- package/build/components/PhotoCard/PhotoCard.styles.js.map +1 -0
- package/build/components/PhotoCard/index.d.ts +3 -0
- package/build/components/PhotoCard/index.d.ts.map +1 -0
- package/build/components/PhotoCard/index.js +2 -0
- package/build/components/PhotoCard/index.js.map +1 -0
- package/build/components/ProgressStep/ProgressStep.d.ts +9 -0
- package/build/components/ProgressStep/ProgressStep.d.ts.map +1 -0
- package/build/components/ProgressStep/ProgressStep.js +23 -0
- package/build/components/ProgressStep/ProgressStep.js.map +1 -0
- package/build/components/ProgressStep/ProgressStep.styles.d.ts +12 -0
- package/build/components/ProgressStep/ProgressStep.styles.d.ts.map +1 -0
- package/build/components/ProgressStep/ProgressStep.styles.js +13 -0
- package/build/components/ProgressStep/ProgressStep.styles.js.map +1 -0
- package/build/components/ProgressStep/index.d.ts +3 -0
- package/build/components/ProgressStep/index.d.ts.map +1 -0
- package/build/components/ProgressStep/index.js +2 -0
- package/build/components/ProgressStep/index.js.map +1 -0
- package/build/components/RadioButton/RadioButton.d.ts +29 -0
- package/build/components/RadioButton/RadioButton.d.ts.map +1 -0
- package/build/components/RadioButton/RadioButton.js +71 -0
- package/build/components/RadioButton/RadioButton.js.map +1 -0
- package/build/components/RadioButton/RadioButton.styles.d.ts +27 -0
- package/build/components/RadioButton/RadioButton.styles.d.ts.map +1 -0
- package/build/components/RadioButton/RadioButton.styles.js +30 -0
- package/build/components/RadioButton/RadioButton.styles.js.map +1 -0
- package/build/components/RadioButton/index.d.ts +3 -0
- package/build/components/RadioButton/index.d.ts.map +1 -0
- package/build/components/RadioButton/index.js +2 -0
- package/build/components/RadioButton/index.js.map +1 -0
- package/build/components/SearchBar/SearchBar.d.ts +33 -0
- package/build/components/SearchBar/SearchBar.d.ts.map +1 -0
- package/build/components/SearchBar/SearchBar.js +83 -0
- package/build/components/SearchBar/SearchBar.js.map +1 -0
- package/build/components/SearchBar/SearchBar.styles.d.ts +19 -0
- package/build/components/SearchBar/SearchBar.styles.d.ts.map +1 -0
- package/build/components/SearchBar/SearchBar.styles.js +21 -0
- package/build/components/SearchBar/SearchBar.styles.js.map +1 -0
- package/build/components/SearchBar/index.d.ts +3 -0
- package/build/components/SearchBar/index.d.ts.map +1 -0
- package/build/components/SearchBar/index.js +2 -0
- package/build/components/SearchBar/index.js.map +1 -0
- package/build/components/Spinner/Spinner.d.ts +12 -0
- package/build/components/Spinner/Spinner.d.ts.map +1 -0
- package/build/components/Spinner/Spinner.js +80 -0
- package/build/components/Spinner/Spinner.js.map +1 -0
- package/build/components/Spinner/Spinner.styles.d.ts +21 -0
- package/build/components/Spinner/Spinner.styles.d.ts.map +1 -0
- package/build/components/Spinner/Spinner.styles.js +22 -0
- package/build/components/Spinner/Spinner.styles.js.map +1 -0
- package/build/components/Spinner/index.d.ts +3 -0
- package/build/components/Spinner/index.d.ts.map +1 -0
- package/build/components/Spinner/index.js +2 -0
- package/build/components/Spinner/index.js.map +1 -0
- package/build/components/StepSheet/StepSheet.d.ts +77 -0
- package/build/components/StepSheet/StepSheet.d.ts.map +1 -0
- package/build/components/StepSheet/StepSheet.js +30 -0
- package/build/components/StepSheet/StepSheet.js.map +1 -0
- package/build/components/StepSheet/StepSheet.styles.d.ts +6 -0
- package/build/components/StepSheet/StepSheet.styles.d.ts.map +1 -0
- package/build/components/StepSheet/StepSheet.styles.js +7 -0
- package/build/components/StepSheet/StepSheet.styles.js.map +1 -0
- package/build/components/StepSheet/index.d.ts +3 -0
- package/build/components/StepSheet/index.d.ts.map +1 -0
- package/build/components/StepSheet/index.js +2 -0
- package/build/components/StepSheet/index.js.map +1 -0
- package/build/components/Stepper/Stepper.d.ts +50 -0
- package/build/components/Stepper/Stepper.d.ts.map +1 -0
- package/build/components/Stepper/Stepper.js +48 -0
- package/build/components/Stepper/Stepper.js.map +1 -0
- package/build/components/Stepper/Stepper.styles.d.ts +27 -0
- package/build/components/Stepper/Stepper.styles.d.ts.map +1 -0
- package/build/components/Stepper/Stepper.styles.js +28 -0
- package/build/components/Stepper/Stepper.styles.js.map +1 -0
- package/build/components/Stepper/index.d.ts +3 -0
- package/build/components/Stepper/index.d.ts.map +1 -0
- package/build/components/Stepper/index.js +2 -0
- package/build/components/Stepper/index.js.map +1 -0
- package/build/components/Switch/Switch.d.ts +29 -0
- package/build/components/Switch/Switch.d.ts.map +1 -0
- package/build/components/Switch/Switch.js +89 -0
- package/build/components/Switch/Switch.js.map +1 -0
- package/build/components/Switch/Switch.styles.d.ts +29 -0
- package/build/components/Switch/Switch.styles.d.ts.map +1 -0
- package/build/components/Switch/Switch.styles.js +26 -0
- package/build/components/Switch/Switch.styles.js.map +1 -0
- package/build/components/Switch/index.d.ts +3 -0
- package/build/components/Switch/index.d.ts.map +1 -0
- package/build/components/Switch/index.js +2 -0
- package/build/components/Switch/index.js.map +1 -0
- package/build/components/Tab/Tab.d.ts +52 -0
- package/build/components/Tab/Tab.d.ts.map +1 -0
- package/build/components/Tab/Tab.js +121 -0
- package/build/components/Tab/Tab.js.map +1 -0
- package/build/components/Tab/Tab.styles.d.ts +55 -0
- package/build/components/Tab/Tab.styles.d.ts.map +1 -0
- package/build/components/Tab/Tab.styles.js +60 -0
- package/build/components/Tab/Tab.styles.js.map +1 -0
- package/build/components/Tab/index.d.ts +3 -0
- package/build/components/Tab/index.d.ts.map +1 -0
- package/build/components/Tab/index.js +2 -0
- package/build/components/Tab/index.js.map +1 -0
- package/build/components/Tag/Tag.d.ts +4 -0
- package/build/components/Tag/Tag.d.ts.map +1 -0
- package/build/components/Tag/Tag.js +40 -0
- package/build/components/Tag/Tag.js.map +1 -0
- package/build/components/Tag/Tag.styles.d.ts +35 -0
- package/build/components/Tag/Tag.styles.d.ts.map +1 -0
- package/build/components/Tag/Tag.styles.js +43 -0
- package/build/components/Tag/Tag.styles.js.map +1 -0
- package/build/components/Tag/Tag.types.d.ts +23 -0
- package/build/components/Tag/Tag.types.d.ts.map +1 -0
- package/build/components/Tag/Tag.types.js +2 -0
- package/build/components/Tag/Tag.types.js.map +1 -0
- package/build/components/Tag/index.d.ts +3 -0
- package/build/components/Tag/index.d.ts.map +1 -0
- package/build/components/Tag/index.js +2 -0
- package/build/components/Tag/index.js.map +1 -0
- package/build/components/navigation/GeneralNav/GeneralNav.d.ts +21 -0
- package/build/components/navigation/GeneralNav/GeneralNav.d.ts.map +1 -0
- package/build/components/navigation/GeneralNav/GeneralNav.js +25 -0
- package/build/components/navigation/GeneralNav/GeneralNav.js.map +1 -0
- package/build/components/navigation/GeneralNav/GeneralNav.styles.d.ts +33 -0
- package/build/components/navigation/GeneralNav/GeneralNav.styles.d.ts.map +1 -0
- package/build/components/navigation/GeneralNav/GeneralNav.styles.js +35 -0
- package/build/components/navigation/GeneralNav/GeneralNav.styles.js.map +1 -0
- package/build/components/navigation/GeneralNav/index.d.ts +3 -0
- package/build/components/navigation/GeneralNav/index.d.ts.map +1 -0
- package/build/components/navigation/GeneralNav/index.js +2 -0
- package/build/components/navigation/GeneralNav/index.js.map +1 -0
- package/build/components/navigation/MobileCanva/MobileCanva.d.ts +11 -0
- package/build/components/navigation/MobileCanva/MobileCanva.d.ts.map +1 -0
- package/build/components/navigation/MobileCanva/MobileCanva.js +45 -0
- package/build/components/navigation/MobileCanva/MobileCanva.js.map +1 -0
- package/build/components/navigation/MobileCanva/MobileCanva.styles.d.ts +93 -0
- package/build/components/navigation/MobileCanva/MobileCanva.styles.d.ts.map +1 -0
- package/build/components/navigation/MobileCanva/MobileCanva.styles.js +94 -0
- package/build/components/navigation/MobileCanva/MobileCanva.styles.js.map +1 -0
- package/build/components/navigation/MobileCanva/MobileCanva.types.d.ts +21 -0
- package/build/components/navigation/MobileCanva/MobileCanva.types.d.ts.map +1 -0
- package/build/components/navigation/MobileCanva/MobileCanva.types.js +2 -0
- package/build/components/navigation/MobileCanva/MobileCanva.types.js.map +1 -0
- package/build/components/navigation/MobileCanva/index.d.ts +3 -0
- package/build/components/navigation/MobileCanva/index.d.ts.map +1 -0
- package/build/components/navigation/MobileCanva/index.js +2 -0
- package/build/components/navigation/MobileCanva/index.js.map +1 -0
- package/build/components/navigation/PageNav/PageNav.d.ts +46 -0
- package/build/components/navigation/PageNav/PageNav.d.ts.map +1 -0
- package/build/components/navigation/PageNav/PageNav.js +48 -0
- package/build/components/navigation/PageNav/PageNav.js.map +1 -0
- package/build/components/navigation/PageNav/PageNav.styles.d.ts +60 -0
- package/build/components/navigation/PageNav/PageNav.styles.d.ts.map +1 -0
- package/build/components/navigation/PageNav/PageNav.styles.js +60 -0
- package/build/components/navigation/PageNav/PageNav.styles.js.map +1 -0
- package/build/components/navigation/PageNav/index.d.ts +3 -0
- package/build/components/navigation/PageNav/index.d.ts.map +1 -0
- package/build/components/navigation/PageNav/index.js +2 -0
- package/build/components/navigation/PageNav/index.js.map +1 -0
- package/build/components/navigation/TabBar/TabBar.d.ts +22 -0
- package/build/components/navigation/TabBar/TabBar.d.ts.map +1 -0
- package/build/components/navigation/TabBar/TabBar.js +13 -0
- package/build/components/navigation/TabBar/TabBar.js.map +1 -0
- package/build/components/navigation/TabBar/TabBar.styles.d.ts +14 -0
- package/build/components/navigation/TabBar/TabBar.styles.d.ts.map +1 -0
- package/build/components/navigation/TabBar/TabBar.styles.js +16 -0
- package/build/components/navigation/TabBar/TabBar.styles.js.map +1 -0
- package/build/components/navigation/TabBar/index.d.ts +3 -0
- package/build/components/navigation/TabBar/index.d.ts.map +1 -0
- package/build/components/navigation/TabBar/index.js +2 -0
- package/build/components/navigation/TabBar/index.js.map +1 -0
- package/build/context/BottomSheetContext.d.ts +42 -0
- package/build/context/BottomSheetContext.d.ts.map +1 -0
- package/build/context/BottomSheetContext.js +51 -0
- package/build/context/BottomSheetContext.js.map +1 -0
- package/build/context/ThemeContext.d.ts +5 -1
- package/build/context/ThemeContext.d.ts.map +1 -1
- package/build/context/ThemeContext.js +4 -2
- package/build/context/ThemeContext.js.map +1 -1
- package/build/index.d.ts +77 -1
- package/build/index.d.ts.map +1 -1
- package/build/index.js +38 -0
- package/build/index.js.map +1 -1
- package/build/theme/tokens/dark.d.ts.map +1 -1
- package/build/theme/tokens/dark.js +263 -10
- package/build/theme/tokens/dark.js.map +1 -1
- package/build/theme/tokens/light.d.ts.map +1 -1
- package/build/theme/tokens/light.js +252 -7
- package/build/theme/tokens/light.js.map +1 -1
- package/build/theme/type.d.ts +398 -0
- package/build/theme/type.d.ts.map +1 -1
- package/build/theme/type.js.map +1 -1
- package/package.json +8 -5
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ProgressStep.js","sourceRoot":"","sources":["../../../src/components/ProgressStep/ProgressStep.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAS/C,MAAM,UAAU,YAAY,CAAC,EAAE,UAAU,EAAE,WAAW,EAAqB;IACzE,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE9B,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,iBAAiB,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,UAAU,GAAG,CAAC,EAAE,GAAG,EAAE,WAAW,EAAE,CAAC,CAC7H;MAAA,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAChD,CAAC,IAAI,CACH,GAAG,CAAC,CAAC,KAAK,CAAC,CACX,KAAK,CAAC,CAAC;gBACL,MAAM,CAAC,OAAO;gBACd;oBACE,IAAI,EAAE,CAAC;oBACP,eAAe,EACb,KAAK,GAAG,WAAW,CAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;wBACjD,KAAK,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;4BACpD,MAAM,CAAC,YAAY,CAAC,OAAO;iBAC9B;aACF,CAAC,EACF,CACH,CAAC,CACJ;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC;AAED,eAAe,YAAY,CAAC","sourcesContent":["/**\n * ProgressStep — horizontal step progress indicator.\n * Renders a row of segments: completed/active segments are filled, future ones are dimmed.\n */\nimport { View } from 'react-native';\nimport { useTheme } from '../../context/ThemeContext';\nimport { styles } from './ProgressStep.styles';\n\nexport interface ProgressStepProps {\n /** Total number of steps */\n totalSteps: number;\n /** Index of the current active step (0-based) */\n currentStep: number;\n}\n\nexport function ProgressStep({ totalSteps, currentStep }: ProgressStepProps) {\n const { colors } = useTheme();\n\n return (\n <View style={styles.row} accessibilityRole=\"progressbar\" accessibilityValue={{ min: 0, max: totalSteps - 1, now: currentStep }}>\n {Array.from({ length: totalSteps }, (_, index) => (\n <View\n key={index}\n style={[\n styles.segment,\n {\n flex: 1,\n backgroundColor:\n index < currentStep ? colors.progressStep.done :\n index === currentStep ? colors.progressStep.active :\n colors.progressStep.default,\n },\n ]}\n />\n ))}\n </View>\n );\n}\n\nexport default ProgressStep;\n\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ProgressStep.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ProgressStep/ProgressStep.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM;;;;;;;;;;CAUjB,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { StyleSheet } from 'react-native';
|
|
2
|
+
export const styles = StyleSheet.create({
|
|
3
|
+
row: {
|
|
4
|
+
flexDirection: 'row',
|
|
5
|
+
gap: 6,
|
|
6
|
+
width: '100%',
|
|
7
|
+
},
|
|
8
|
+
segment: {
|
|
9
|
+
height: 4,
|
|
10
|
+
borderRadius: 9999,
|
|
11
|
+
},
|
|
12
|
+
});
|
|
13
|
+
//# sourceMappingURL=ProgressStep.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ProgressStep.styles.js","sourceRoot":"","sources":["../../../src/components/ProgressStep/ProgressStep.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IACtC,GAAG,EAAE;QACH,aAAa,EAAE,KAAK;QACpB,GAAG,EAAE,CAAC;QACN,KAAK,EAAE,MAAM;KACd;IACD,OAAO,EAAE;QACP,MAAM,EAAE,CAAC;QACT,YAAY,EAAE,IAAI;KACnB;CACF,CAAC,CAAC","sourcesContent":["import { StyleSheet } from 'react-native';\n\nexport const styles = StyleSheet.create({\n row: {\n flexDirection: 'row',\n gap: 6,\n width: '100%',\n },\n segment: {\n height: 4,\n borderRadius: 9999,\n },\n});\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ProgressStep/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ProgressStep/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC","sourcesContent":["export { ProgressStep } from './ProgressStep';\nexport type { ProgressStepProps } from './ProgressStep';"]}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* RadioButton — controlled radio button.
|
|
3
|
+
* Renders a circular ring with an optional center dot (selected state),
|
|
4
|
+
* optional content to the right and an optional helper text below.
|
|
5
|
+
* Two sizes: m (24px ring, 44px touch target) and xl (32px ring).
|
|
6
|
+
*/
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import type { StyleProp, ViewStyle } from 'react-native';
|
|
9
|
+
export type RadioButtonSize = 'm' | 'xl';
|
|
10
|
+
export interface RadioButtonProps {
|
|
11
|
+
/** Whether this radio button is selected — required (controlled) */
|
|
12
|
+
selected: boolean;
|
|
13
|
+
/** Press handler */
|
|
14
|
+
onPress: () => void;
|
|
15
|
+
/** Content displayed to the right of the circle — use Text, tags, links, etc. */
|
|
16
|
+
children?: React.ReactNode;
|
|
17
|
+
/** Helper or description text displayed below the children */
|
|
18
|
+
helperText?: string;
|
|
19
|
+
/** Disabled state */
|
|
20
|
+
disabled?: boolean;
|
|
21
|
+
/** Circle size — m: 24px ring / xl: 32px ring (both have a 44px touch target) */
|
|
22
|
+
size?: RadioButtonSize;
|
|
23
|
+
/** Additional wrapper styles */
|
|
24
|
+
style?: StyleProp<ViewStyle>;
|
|
25
|
+
/** Test ID for automated testing */
|
|
26
|
+
testID?: string;
|
|
27
|
+
}
|
|
28
|
+
export declare function RadioButton({ selected, onPress, children, helperText, disabled, size, style, testID, }: RadioButtonProps): React.JSX.Element;
|
|
29
|
+
//# sourceMappingURL=RadioButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButton.d.ts","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAQzD,MAAM,MAAM,eAAe,GAAG,GAAG,GAAG,IAAI,CAAC;AAEzC,MAAM,WAAW,gBAAgB;IAC/B,oEAAoE;IACpE,QAAQ,EAAE,OAAO,CAAC;IAClB,oBAAoB;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,iFAAiF;IACjF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iFAAiF;IACjF,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,gCAAgC;IAChC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAiBD,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,UAAU,EACV,QAAgB,EAChB,IAAU,EACV,KAAK,EACL,MAAM,GACP,EAAE,gBAAgB,qBAuElB"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* RadioButton — controlled radio button.
|
|
3
|
+
* Renders a circular ring with an optional center dot (selected state),
|
|
4
|
+
* optional content to the right and an optional helper text below.
|
|
5
|
+
* Two sizes: m (24px ring, 44px touch target) and xl (32px ring).
|
|
6
|
+
*/
|
|
7
|
+
import React, { useState } from 'react';
|
|
8
|
+
import { Pressable, Text, View } from 'react-native';
|
|
9
|
+
import { useTheme } from '../../context/ThemeContext';
|
|
10
|
+
import { styles } from './RadioButton.styles';
|
|
11
|
+
// ---------------------------------------------------------------------------
|
|
12
|
+
// Size config
|
|
13
|
+
// ---------------------------------------------------------------------------
|
|
14
|
+
const RING_BORDER_WIDTH = 1.5;
|
|
15
|
+
const SIZE_CONFIG = {
|
|
16
|
+
m: { ring: 24, dot: 10, touchTarget: 44 },
|
|
17
|
+
xl: { ring: 32, dot: 14, touchTarget: 44 },
|
|
18
|
+
};
|
|
19
|
+
// ---------------------------------------------------------------------------
|
|
20
|
+
// Component
|
|
21
|
+
// ---------------------------------------------------------------------------
|
|
22
|
+
export function RadioButton({ selected, onPress, children, helperText, disabled = false, size = 'm', style, testID, }) {
|
|
23
|
+
const [pressed, setPressed] = useState(false);
|
|
24
|
+
const { colors, fontFamily } = useTheme();
|
|
25
|
+
const t = colors.radio;
|
|
26
|
+
const cfg = SIZE_CONFIG[size];
|
|
27
|
+
const variantTokens = selected ? t.selected : t.unselected;
|
|
28
|
+
const stateKey = disabled ? 'disabled' : pressed ? 'pressed' : 'default';
|
|
29
|
+
const tokens = variantTokens[stateKey];
|
|
30
|
+
return (<Pressable accessibilityRole="radio" accessibilityState={{ selected, disabled }} onPressIn={() => { if (!disabled)
|
|
31
|
+
setPressed(true); }} onPressOut={() => setPressed(false)} onPress={disabled ? undefined : onPress} style={[styles.wrapper, style]} testID={testID}>
|
|
32
|
+
{/* Touch target + ring */}
|
|
33
|
+
<View style={[
|
|
34
|
+
styles.touchTarget,
|
|
35
|
+
{
|
|
36
|
+
width: cfg.touchTarget,
|
|
37
|
+
height: cfg.touchTarget,
|
|
38
|
+
},
|
|
39
|
+
]}>
|
|
40
|
+
<View style={[
|
|
41
|
+
styles.ring,
|
|
42
|
+
{
|
|
43
|
+
width: cfg.ring,
|
|
44
|
+
height: cfg.ring,
|
|
45
|
+
borderRadius: cfg.ring / 2,
|
|
46
|
+
backgroundColor: tokens.fill,
|
|
47
|
+
borderColor: tokens.ring,
|
|
48
|
+
borderWidth: RING_BORDER_WIDTH,
|
|
49
|
+
},
|
|
50
|
+
]}>
|
|
51
|
+
{/* Center dot — visible when selected */}
|
|
52
|
+
{selected && (<View style={[
|
|
53
|
+
styles.dot,
|
|
54
|
+
{
|
|
55
|
+
width: cfg.dot,
|
|
56
|
+
height: cfg.dot,
|
|
57
|
+
borderRadius: cfg.dot / 2,
|
|
58
|
+
backgroundColor: tokens.dot,
|
|
59
|
+
},
|
|
60
|
+
]}/>)}
|
|
61
|
+
</View>
|
|
62
|
+
</View>
|
|
63
|
+
|
|
64
|
+
{/* Content + helper text */}
|
|
65
|
+
{(children != null || helperText != null) && (<View style={styles.textContainer}>
|
|
66
|
+
{children}
|
|
67
|
+
{helperText != null && (<Text style={[styles.helper, { color: t.helper, fontFamily }]}>{helperText}</Text>)}
|
|
68
|
+
</View>)}
|
|
69
|
+
</Pressable>);
|
|
70
|
+
}
|
|
71
|
+
//# sourceMappingURL=RadioButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButton.js","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * RadioButton — controlled radio button.\n * Renders a circular ring with an optional center dot (selected state),\n * optional content to the right and an optional helper text below.\n * Two sizes: m (24px ring, 44px touch target) and xl (32px ring).\n */\nimport React, { useState } from 'react';\nimport { Pressable, Text, View } from 'react-native';\nimport type { StyleProp, ViewStyle } from 'react-native';\nimport { useTheme } from '../../context/ThemeContext';\nimport { styles } from './RadioButton.styles';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\nexport type RadioButtonSize = 'm' | 'xl';\n\nexport interface RadioButtonProps {\n /** Whether this radio button is selected — required (controlled) */\n selected: boolean;\n /** Press handler */\n onPress: () => void;\n /** Content displayed to the right of the circle — use Text, tags, links, etc. */\n children?: React.ReactNode;\n /** Helper or description text displayed below the children */\n helperText?: string;\n /** Disabled state */\n disabled?: boolean;\n /** Circle size — m: 24px ring / xl: 32px ring (both have a 44px touch target) */\n size?: RadioButtonSize;\n /** Additional wrapper styles */\n style?: StyleProp<ViewStyle>;\n /** Test ID for automated testing */\n testID?: string;\n}\n\n// ---------------------------------------------------------------------------\n// Size config\n// ---------------------------------------------------------------------------\n\nconst RING_BORDER_WIDTH = 1.5;\n\nconst SIZE_CONFIG: Record<RadioButtonSize, { ring: number; dot: number; touchTarget: number }> = {\n m: { ring: 24, dot: 10, touchTarget: 44 },\n xl: { ring: 32, dot: 14, touchTarget: 44 },\n};\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport function RadioButton({\n selected,\n onPress,\n children,\n helperText,\n disabled = false,\n size = 'm',\n style,\n testID,\n}: RadioButtonProps) {\n const [pressed, setPressed] = useState(false);\n const { colors, fontFamily } = useTheme();\n const t = colors.radio;\n const cfg = SIZE_CONFIG[size];\n\n const variantTokens = selected ? t.selected : t.unselected;\n const stateKey = disabled ? 'disabled' : pressed ? 'pressed' : 'default';\n const tokens = variantTokens[stateKey];\n\n return (\n <Pressable\n accessibilityRole=\"radio\"\n accessibilityState={{ selected, disabled }}\n onPressIn={() => { if (!disabled) setPressed(true); }}\n onPressOut={() => setPressed(false)}\n onPress={disabled ? undefined : onPress}\n style={[styles.wrapper, style]}\n testID={testID}\n >\n {/* Touch target + ring */}\n <View\n style={[\n styles.touchTarget,\n {\n width: cfg.touchTarget,\n height: cfg.touchTarget,\n },\n ]}\n >\n <View\n style={[\n styles.ring,\n {\n width: cfg.ring,\n height: cfg.ring,\n borderRadius: cfg.ring / 2,\n backgroundColor: tokens.fill,\n borderColor: tokens.ring,\n borderWidth: RING_BORDER_WIDTH,\n },\n ]}\n >\n {/* Center dot — visible when selected */}\n {selected && (\n <View\n style={[\n styles.dot,\n {\n width: cfg.dot,\n height: cfg.dot,\n borderRadius: cfg.dot / 2,\n backgroundColor: tokens.dot,\n },\n ]}\n />\n )}\n </View>\n </View>\n\n {/* Content + helper text */}\n {(children != null || helperText != null) && (\n <View style={styles.textContainer}>\n {children}\n {helperText != null && (\n <Text style={[styles.helper, { color: t.helper, fontFamily }]}>{helperText}</Text>\n )}\n </View>\n )}\n </Pressable>\n );\n}\n\n"]}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export declare const styles: {
|
|
2
|
+
wrapper: {
|
|
3
|
+
flexDirection: "row";
|
|
4
|
+
alignItems: "center";
|
|
5
|
+
gap: number;
|
|
6
|
+
};
|
|
7
|
+
touchTarget: {
|
|
8
|
+
alignItems: "center";
|
|
9
|
+
justifyContent: "center";
|
|
10
|
+
flexShrink: number;
|
|
11
|
+
};
|
|
12
|
+
ring: {
|
|
13
|
+
alignItems: "center";
|
|
14
|
+
justifyContent: "center";
|
|
15
|
+
};
|
|
16
|
+
dot: {};
|
|
17
|
+
textContainer: {
|
|
18
|
+
flex: number;
|
|
19
|
+
gap: number;
|
|
20
|
+
};
|
|
21
|
+
helper: {
|
|
22
|
+
fontSize: number;
|
|
23
|
+
lineHeight: number;
|
|
24
|
+
fontWeight: "400";
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=RadioButton.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButton.styles.d.ts","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;CA2BjB,CAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { StyleSheet } from 'react-native';
|
|
2
|
+
export const styles = StyleSheet.create({
|
|
3
|
+
wrapper: {
|
|
4
|
+
flexDirection: 'row',
|
|
5
|
+
alignItems: 'center',
|
|
6
|
+
gap: 8,
|
|
7
|
+
},
|
|
8
|
+
touchTarget: {
|
|
9
|
+
alignItems: 'center',
|
|
10
|
+
justifyContent: 'center',
|
|
11
|
+
flexShrink: 0,
|
|
12
|
+
},
|
|
13
|
+
ring: {
|
|
14
|
+
alignItems: 'center',
|
|
15
|
+
justifyContent: 'center',
|
|
16
|
+
},
|
|
17
|
+
dot: {
|
|
18
|
+
// positioned in center by parent's alignItems/justifyContent
|
|
19
|
+
},
|
|
20
|
+
textContainer: {
|
|
21
|
+
flex: 1,
|
|
22
|
+
gap: 2,
|
|
23
|
+
},
|
|
24
|
+
helper: {
|
|
25
|
+
fontSize: 12,
|
|
26
|
+
lineHeight: 16,
|
|
27
|
+
fontWeight: '400',
|
|
28
|
+
},
|
|
29
|
+
});
|
|
30
|
+
//# sourceMappingURL=RadioButton.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioButton.styles.js","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IACtC,OAAO,EAAE;QACP,aAAa,EAAE,KAAK;QACpB,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,CAAC;KACP;IACD,WAAW,EAAE;QACX,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,CAAC;KACd;IACD,IAAI,EAAE;QACJ,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;KACzB;IACD,GAAG,EAAE;IACH,6DAA6D;KAC9D;IACD,aAAa,EAAE;QACb,IAAI,EAAE,CAAC;QACP,GAAG,EAAE,CAAC;KACP;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;CACF,CAAC,CAAC","sourcesContent":["import { StyleSheet } from 'react-native';\n\nexport const styles = StyleSheet.create({\n wrapper: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: 8,\n },\n touchTarget: {\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n },\n ring: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n dot: {\n // positioned in center by parent's alignItems/justifyContent\n },\n textContainer: {\n flex: 1,\n gap: 2,\n },\n helper: {\n fontSize: 12,\n lineHeight: 16,\n fontWeight: '400',\n },\n});\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/RadioButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/RadioButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC","sourcesContent":["export { RadioButton } from './RadioButton';\nexport type { RadioButtonProps, RadioButtonSize } from './RadioButton';\n"]}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import type { StyleProp, ViewStyle } from 'react-native';
|
|
2
|
+
export interface SearchBarProps {
|
|
3
|
+
/** Controlled value */
|
|
4
|
+
value: string;
|
|
5
|
+
/** Text change handler */
|
|
6
|
+
onChangeText: (text: string) => void;
|
|
7
|
+
/** Placeholder — defaults to "Rechercher..." */
|
|
8
|
+
placeholder?: string;
|
|
9
|
+
/** Called when the X clear button is pressed */
|
|
10
|
+
onClear?: () => void;
|
|
11
|
+
/** Called on keyboard search/submit action */
|
|
12
|
+
onSubmitEditing?: () => void;
|
|
13
|
+
/** Called when the input gains focus */
|
|
14
|
+
onFocus?: () => void;
|
|
15
|
+
/** Called when the input loses focus */
|
|
16
|
+
onBlur?: () => void;
|
|
17
|
+
/** Show a spinner at the right instead of the clear button */
|
|
18
|
+
loading?: boolean;
|
|
19
|
+
/** Disabled — no interaction, muted colors */
|
|
20
|
+
disabled?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* default: always shows the full bar.
|
|
23
|
+
* icon: shows only the magnifying glass; expands to full bar on press,
|
|
24
|
+
* collapses back to icon on blur when value is empty.
|
|
25
|
+
*/
|
|
26
|
+
variant?: 'default' | 'icon';
|
|
27
|
+
/** Additional styles on the outer container */
|
|
28
|
+
style?: StyleProp<ViewStyle>;
|
|
29
|
+
/** Test ID for automated testing */
|
|
30
|
+
testID?: string;
|
|
31
|
+
}
|
|
32
|
+
export declare const SearchBar: ({ value, onChangeText, placeholder, onClear, onSubmitEditing, onFocus, onBlur, loading, disabled, variant, style, testID, }: SearchBarProps) => import("react").JSX.Element;
|
|
33
|
+
//# sourceMappingURL=SearchBar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SearchBar.d.ts","sourceRoot":"","sources":["../../../src/components/SearchBar/SearchBar.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAWzD,MAAM,WAAW,cAAc;IAC7B,uBAAuB;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,0BAA0B;IAC1B,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,8CAA8C;IAC9C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,wCAAwC;IACxC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,8DAA8D;IAC9D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC7B,+CAA+C;IAC/C,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAMD,eAAO,MAAM,SAAS,GAAI,6HAavB,cAAc,gCA2GhB,CAAC"}
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* SearchBar — controlled search input.
|
|
3
|
+
* MagnifyingGlass icon (duotone) left, flex:1 TextInput, X clear button when non-empty.
|
|
4
|
+
* 4 visual states: default · focused · typing · disabled.
|
|
5
|
+
* variant="icon": renders as icon-only button, expands to full bar on press, collapses on blur when empty.
|
|
6
|
+
* The "Annuler" button is positioned by the parent (outside this component).
|
|
7
|
+
*/
|
|
8
|
+
import { useRef, useState } from 'react';
|
|
9
|
+
import { Pressable, TextInput, View } from 'react-native';
|
|
10
|
+
import { MagnifyingGlass, X } from 'phosphor-react-native';
|
|
11
|
+
import { useTheme } from '../../context/ThemeContext';
|
|
12
|
+
import { Spinner } from '../Spinner';
|
|
13
|
+
import { Button } from '../Button';
|
|
14
|
+
import { styles } from './SearchBar.styles';
|
|
15
|
+
// ---------------------------------------------------------------------------
|
|
16
|
+
// Component
|
|
17
|
+
// ---------------------------------------------------------------------------
|
|
18
|
+
export const SearchBar = ({ value, onChangeText, placeholder = 'Rechercher...', onClear, onSubmitEditing, onFocus, onBlur, loading = false, disabled = false, variant = 'default', style, testID, }) => {
|
|
19
|
+
const [focused, setFocused] = useState(false);
|
|
20
|
+
const [expanded, setExpanded] = useState(false);
|
|
21
|
+
const { colors, fontFamily } = useTheme();
|
|
22
|
+
const inputRef = useRef(null);
|
|
23
|
+
const t = disabled
|
|
24
|
+
? colors.searchBar.disabled
|
|
25
|
+
: focused
|
|
26
|
+
? colors.searchBar.focused
|
|
27
|
+
: colors.searchBar.default;
|
|
28
|
+
const showClear = value.length > 0 && !loading && !disabled;
|
|
29
|
+
const showLoading = loading && !disabled;
|
|
30
|
+
const handleFocus = () => {
|
|
31
|
+
setFocused(true);
|
|
32
|
+
onFocus?.();
|
|
33
|
+
};
|
|
34
|
+
const handleBlur = () => {
|
|
35
|
+
setFocused(false);
|
|
36
|
+
if (variant === 'icon' && value.length === 0) {
|
|
37
|
+
setExpanded(false);
|
|
38
|
+
}
|
|
39
|
+
onBlur?.();
|
|
40
|
+
};
|
|
41
|
+
const handleClear = () => {
|
|
42
|
+
onChangeText('');
|
|
43
|
+
onClear?.();
|
|
44
|
+
if (variant === 'icon') {
|
|
45
|
+
setExpanded(false);
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
const handleIconPress = () => {
|
|
49
|
+
setExpanded(true);
|
|
50
|
+
// Focus after state update
|
|
51
|
+
setTimeout(() => inputRef.current?.focus(), 0);
|
|
52
|
+
};
|
|
53
|
+
// Icon-only collapsed state
|
|
54
|
+
if (variant === 'icon' && !expanded) {
|
|
55
|
+
return (<Button variant="tertiary" size="M" content="icon-only-rounded" iconLeft={<MagnifyingGlass weight="duotone"/>} onPress={handleIconPress} style={style}/>);
|
|
56
|
+
}
|
|
57
|
+
return (<View style={[
|
|
58
|
+
styles.container,
|
|
59
|
+
{
|
|
60
|
+
backgroundColor: t.background,
|
|
61
|
+
borderColor: t.border,
|
|
62
|
+
},
|
|
63
|
+
style,
|
|
64
|
+
]} testID={testID}>
|
|
65
|
+
{/* Loupe icon — always present */}
|
|
66
|
+
<MagnifyingGlass size={20} weight="duotone" color={t.icon}/>
|
|
67
|
+
|
|
68
|
+
{/* Text input */}
|
|
69
|
+
<TextInput ref={inputRef} value={value} onChangeText={disabled ? undefined : onChangeText} onFocus={disabled ? undefined : handleFocus} onBlur={disabled ? undefined : handleBlur} onSubmitEditing={onSubmitEditing} placeholder={placeholder} placeholderTextColor={t.placeholder} editable={!disabled} returnKeyType="search" autoCorrect={false} autoCapitalize="none" style={[
|
|
70
|
+
styles.input,
|
|
71
|
+
{ color: t.text, fontFamily },
|
|
72
|
+
]}/>
|
|
73
|
+
|
|
74
|
+
{/* X clear button — visible when value non-empty */}
|
|
75
|
+
{showClear && (<Pressable onPress={handleClear} hitSlop={8} accessibilityRole="button" accessibilityLabel="Effacer la recherche">
|
|
76
|
+
<X size={16} weight="bold" color={colors.searchBar.clearIcon}/>
|
|
77
|
+
</Pressable>)}
|
|
78
|
+
|
|
79
|
+
{/* Loading spinner — replaces clear when loading */}
|
|
80
|
+
{showLoading && <Spinner mode="loading" size="s"/>}
|
|
81
|
+
</View>);
|
|
82
|
+
};
|
|
83
|
+
//# sourceMappingURL=SearchBar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../src/components/SearchBar/SearchBar.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * SearchBar — controlled search input.\n * MagnifyingGlass icon (duotone) left, flex:1 TextInput, X clear button when non-empty.\n * 4 visual states: default · focused · typing · disabled.\n * variant=\"icon\": renders as icon-only button, expands to full bar on press, collapses on blur when empty.\n * The \"Annuler\" button is positioned by the parent (outside this component).\n */\nimport { useRef, useState } from 'react';\nimport { Pressable, TextInput, View } from 'react-native';\nimport type { StyleProp, ViewStyle } from 'react-native';\nimport { MagnifyingGlass, X } from 'phosphor-react-native';\nimport { useTheme } from '../../context/ThemeContext';\nimport { Spinner } from '../Spinner';\nimport { Button } from '../Button';\nimport { styles } from './SearchBar.styles';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\nexport interface SearchBarProps {\n /** Controlled value */\n value: string;\n /** Text change handler */\n onChangeText: (text: string) => void;\n /** Placeholder — defaults to \"Rechercher...\" */\n placeholder?: string;\n /** Called when the X clear button is pressed */\n onClear?: () => void;\n /** Called on keyboard search/submit action */\n onSubmitEditing?: () => void;\n /** Called when the input gains focus */\n onFocus?: () => void;\n /** Called when the input loses focus */\n onBlur?: () => void;\n /** Show a spinner at the right instead of the clear button */\n loading?: boolean;\n /** Disabled — no interaction, muted colors */\n disabled?: boolean;\n /**\n * default: always shows the full bar.\n * icon: shows only the magnifying glass; expands to full bar on press,\n * collapses back to icon on blur when value is empty.\n */\n variant?: 'default' | 'icon';\n /** Additional styles on the outer container */\n style?: StyleProp<ViewStyle>;\n /** Test ID for automated testing */\n testID?: string;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport const SearchBar = ({\n value,\n onChangeText,\n placeholder = 'Rechercher...',\n onClear,\n onSubmitEditing,\n onFocus,\n onBlur,\n loading = false,\n disabled = false,\n variant = 'default',\n style,\n testID,\n}: SearchBarProps) => {\n const [focused, setFocused] = useState(false);\n const [expanded, setExpanded] = useState(false);\n const { colors, fontFamily } = useTheme();\n const inputRef = useRef<TextInput>(null);\n\n const t = disabled\n ? colors.searchBar.disabled\n : focused\n ? colors.searchBar.focused\n : colors.searchBar.default;\n\n const showClear = value.length > 0 && !loading && !disabled;\n const showLoading = loading && !disabled;\n\n const handleFocus = () => {\n setFocused(true);\n onFocus?.();\n };\n\n const handleBlur = () => {\n setFocused(false);\n if (variant === 'icon' && value.length === 0) {\n setExpanded(false);\n }\n onBlur?.();\n };\n\n const handleClear = () => {\n onChangeText('');\n onClear?.();\n if (variant === 'icon') {\n setExpanded(false);\n }\n };\n\n const handleIconPress = () => {\n setExpanded(true);\n // Focus after state update\n setTimeout(() => inputRef.current?.focus(), 0);\n };\n\n // Icon-only collapsed state\n if (variant === 'icon' && !expanded) {\n return (\n <Button\n variant=\"tertiary\"\n size=\"M\"\n content=\"icon-only-rounded\"\n iconLeft={<MagnifyingGlass weight=\"duotone\" />}\n onPress={handleIconPress}\n style={style}\n />\n );\n }\n\n return (\n <View\n style={[\n styles.container,\n {\n backgroundColor: t.background,\n borderColor: t.border,\n },\n style,\n ]}\n testID={testID}\n >\n {/* Loupe icon — always present */}\n <MagnifyingGlass size={20} weight=\"duotone\" color={t.icon} />\n\n {/* Text input */}\n <TextInput\n ref={inputRef}\n value={value}\n onChangeText={disabled ? undefined : onChangeText}\n onFocus={disabled ? undefined : handleFocus}\n onBlur={disabled ? undefined : handleBlur}\n onSubmitEditing={onSubmitEditing}\n placeholder={placeholder}\n placeholderTextColor={t.placeholder}\n editable={!disabled}\n returnKeyType=\"search\"\n autoCorrect={false}\n autoCapitalize=\"none\"\n style={[\n styles.input,\n { color: t.text, fontFamily },\n ]}\n />\n\n {/* X clear button — visible when value non-empty */}\n {showClear && (\n <Pressable\n onPress={handleClear}\n hitSlop={8}\n accessibilityRole=\"button\"\n accessibilityLabel=\"Effacer la recherche\"\n >\n <X size={16} weight=\"bold\" color={colors.searchBar.clearIcon} />\n </Pressable>\n )}\n\n {/* Loading spinner — replaces clear when loading */}\n {showLoading && <Spinner mode=\"loading\" size=\"s\" />}\n </View>\n );\n};\n\n"]}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare const styles: {
|
|
2
|
+
container: {
|
|
3
|
+
flexDirection: "row";
|
|
4
|
+
alignItems: "center";
|
|
5
|
+
borderWidth: number;
|
|
6
|
+
borderRadius: number;
|
|
7
|
+
paddingHorizontal: number;
|
|
8
|
+
paddingVertical: number;
|
|
9
|
+
gap: number;
|
|
10
|
+
};
|
|
11
|
+
input: {
|
|
12
|
+
flex: number;
|
|
13
|
+
fontSize: number;
|
|
14
|
+
fontWeight: "500";
|
|
15
|
+
padding: number;
|
|
16
|
+
margin: number;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
//# sourceMappingURL=SearchBar.styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SearchBar.styles.d.ts","sourceRoot":"","sources":["../../../src/components/SearchBar/SearchBar.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;CAkBjB,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { StyleSheet } from 'react-native';
|
|
2
|
+
export const styles = StyleSheet.create({
|
|
3
|
+
container: {
|
|
4
|
+
flexDirection: 'row',
|
|
5
|
+
alignItems: 'center',
|
|
6
|
+
borderWidth: 1,
|
|
7
|
+
borderRadius: 9999,
|
|
8
|
+
paddingHorizontal: 10,
|
|
9
|
+
paddingVertical: 10,
|
|
10
|
+
gap: 8,
|
|
11
|
+
},
|
|
12
|
+
input: {
|
|
13
|
+
flex: 1,
|
|
14
|
+
fontSize: 14,
|
|
15
|
+
fontWeight: '500',
|
|
16
|
+
// Remove default RN padding so the container controls spacing
|
|
17
|
+
padding: 0,
|
|
18
|
+
margin: 0,
|
|
19
|
+
},
|
|
20
|
+
});
|
|
21
|
+
//# sourceMappingURL=SearchBar.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SearchBar.styles.js","sourceRoot":"","sources":["../../../src/components/SearchBar/SearchBar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IACtC,SAAS,EAAE;QACT,aAAa,EAAE,KAAK;QACpB,UAAU,EAAE,QAAQ;QACpB,WAAW,EAAE,CAAC;QACd,YAAY,EAAE,IAAI;QAClB,iBAAiB,EAAE,EAAE;QACrB,eAAe,EAAE,EAAE;QACnB,GAAG,EAAE,CAAC;KACP;IACD,KAAK,EAAE;QACL,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;QACjB,8DAA8D;QAC9D,OAAO,EAAE,CAAC;QACV,MAAM,EAAE,CAAC;KACV;CACF,CAAC,CAAC","sourcesContent":["import { StyleSheet } from 'react-native';\n\nexport const styles = StyleSheet.create({\n container: {\n flexDirection: 'row',\n alignItems: 'center',\n borderWidth: 1,\n borderRadius: 9999,\n paddingHorizontal: 10,\n paddingVertical: 10,\n gap: 8,\n },\n input: {\n flex: 1,\n fontSize: 14,\n fontWeight: '500',\n // Remove default RN padding so the container controls spacing\n padding: 0,\n margin: 0,\n },\n});\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SearchBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SearchBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC","sourcesContent":["export { SearchBar } from './SearchBar';\nexport type { SearchBarProps } from './SearchBar';\n"]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export type SpinnerSize = 's' | 'm' | 'l' | 'xl';
|
|
2
|
+
export type SpinnerMode = 'idle' | 'loading' | 'finish';
|
|
3
|
+
export interface SpinnerProps {
|
|
4
|
+
/** Display mode — idle: full ring, loading: animated arc, finish: colored ring + check */
|
|
5
|
+
mode?: SpinnerMode;
|
|
6
|
+
/** Box size — s: 16px, m: 20px, l: 24px, xl: 28px (circle is 4px smaller) */
|
|
7
|
+
size?: SpinnerSize;
|
|
8
|
+
/** Test ID for automated testing */
|
|
9
|
+
testID?: string;
|
|
10
|
+
}
|
|
11
|
+
export declare const Spinner: ({ mode, size, testID, }: SpinnerProps) => import("react").JSX.Element;
|
|
12
|
+
//# sourceMappingURL=Spinner.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAeA,MAAM,MAAM,WAAW,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AACjD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;AAExD,MAAM,WAAW,YAAY;IAC3B,0FAA0F;IAC1F,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAmBD,eAAO,MAAM,OAAO,GAAI,yBAIrB,YAAY,gCA4Ed,CAAC"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Spinner — animated loading indicator with three modes.
|
|
3
|
+
* idle: full track ring. loading: animated arc. finish: colored ring + check icon.
|
|
4
|
+
* Four sizes (s/m/l/xl).
|
|
5
|
+
*/
|
|
6
|
+
import { useEffect, useRef } from 'react';
|
|
7
|
+
import { Animated, Easing, View } from 'react-native';
|
|
8
|
+
import { Check } from 'phosphor-react-native';
|
|
9
|
+
import { useTheme } from '../../context/ThemeContext';
|
|
10
|
+
import { styles } from './Spinner.styles';
|
|
11
|
+
// ---------------------------------------------------------------------------
|
|
12
|
+
// Size config
|
|
13
|
+
// ---------------------------------------------------------------------------
|
|
14
|
+
const SIZE_CONFIG = {
|
|
15
|
+
s: { box: 16, circle: 12, strokeWidth: 2, iconSize: 8 },
|
|
16
|
+
m: { box: 20, circle: 16, strokeWidth: 2, iconSize: 12 },
|
|
17
|
+
l: { box: 24, circle: 20, strokeWidth: 2, iconSize: 14 },
|
|
18
|
+
xl: { box: 28, circle: 24, strokeWidth: 2, iconSize: 16 },
|
|
19
|
+
};
|
|
20
|
+
const ANIMATION_DURATION = 900;
|
|
21
|
+
// ---------------------------------------------------------------------------
|
|
22
|
+
// Component
|
|
23
|
+
// ---------------------------------------------------------------------------
|
|
24
|
+
export const Spinner = ({ mode = 'loading', size = 'm', testID, }) => {
|
|
25
|
+
const { colors } = useTheme();
|
|
26
|
+
const cfg = SIZE_CONFIG[size];
|
|
27
|
+
const spinAnim = useRef(new Animated.Value(0)).current;
|
|
28
|
+
useEffect(() => {
|
|
29
|
+
const anim = Animated.loop(Animated.timing(spinAnim, {
|
|
30
|
+
toValue: 1,
|
|
31
|
+
duration: ANIMATION_DURATION,
|
|
32
|
+
easing: Easing.linear,
|
|
33
|
+
useNativeDriver: true,
|
|
34
|
+
}));
|
|
35
|
+
anim.start();
|
|
36
|
+
return () => anim.stop();
|
|
37
|
+
}, [spinAnim]);
|
|
38
|
+
const rotate = spinAnim.interpolate({
|
|
39
|
+
inputRange: [0, 1],
|
|
40
|
+
outputRange: ['0deg', '360deg'],
|
|
41
|
+
});
|
|
42
|
+
const ringBase = {
|
|
43
|
+
width: cfg.circle,
|
|
44
|
+
height: cfg.circle,
|
|
45
|
+
borderRadius: cfg.circle / 2,
|
|
46
|
+
borderWidth: cfg.strokeWidth,
|
|
47
|
+
};
|
|
48
|
+
return (<View style={styles.wrapper} accessibilityRole="progressbar" accessibilityLiveRegion="polite" testID={testID}>
|
|
49
|
+
{/* Box — centers the circle container */}
|
|
50
|
+
<View style={{ width: cfg.box, height: cfg.box, alignItems: 'center', justifyContent: 'center' }}>
|
|
51
|
+
{/* Circle container — rings are absolute within this */}
|
|
52
|
+
<View style={{ width: cfg.circle, height: cfg.circle }}>
|
|
53
|
+
{/* Track ring — always visible in idle and loading */}
|
|
54
|
+
{mode !== 'finish' && (<View style={[styles.ring, { ...ringBase, borderColor: colors.spinner.track }]}/>)}
|
|
55
|
+
|
|
56
|
+
{mode === 'loading' && (<Animated.View style={[
|
|
57
|
+
styles.ring,
|
|
58
|
+
{
|
|
59
|
+
...ringBase,
|
|
60
|
+
borderTopColor: colors.spinner.arc,
|
|
61
|
+
borderRightColor: colors.spinner.arc,
|
|
62
|
+
borderBottomColor: 'transparent',
|
|
63
|
+
borderLeftColor: 'transparent',
|
|
64
|
+
transform: [{ rotate }],
|
|
65
|
+
},
|
|
66
|
+
]}/>)}
|
|
67
|
+
|
|
68
|
+
{mode === 'finish' && (<>
|
|
69
|
+
{/* Full arc-colored ring */}
|
|
70
|
+
<View style={[styles.ring, { ...ringBase, borderColor: colors.spinner.arc }]}/>
|
|
71
|
+
{/* Check icon — centered absolutely */}
|
|
72
|
+
<View style={styles.iconCenter}>
|
|
73
|
+
<Check size={cfg.iconSize} weight="bold" color={colors.spinner.arc}/>
|
|
74
|
+
</View>
|
|
75
|
+
</>)}
|
|
76
|
+
</View>
|
|
77
|
+
</View>
|
|
78
|
+
</View>);
|
|
79
|
+
};
|
|
80
|
+
//# sourceMappingURL=Spinner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Spinner — animated loading indicator with three modes.\n * idle: full track ring. loading: animated arc. finish: colored ring + check icon.\n * Four sizes (s/m/l/xl).\n */\nimport { useEffect, useRef } from 'react';\nimport { Animated, Easing, View } from 'react-native';\nimport { Check } from 'phosphor-react-native';\nimport { useTheme } from '../../context/ThemeContext';\nimport { styles } from './Spinner.styles';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\nexport type SpinnerSize = 's' | 'm' | 'l' | 'xl';\nexport type SpinnerMode = 'idle' | 'loading' | 'finish';\n\nexport interface SpinnerProps {\n /** Display mode — idle: full ring, loading: animated arc, finish: colored ring + check */\n mode?: SpinnerMode;\n /** Box size — s: 16px, m: 20px, l: 24px, xl: 28px (circle is 4px smaller) */\n size?: SpinnerSize;\n /** Test ID for automated testing */\n testID?: string;\n}\n\n// ---------------------------------------------------------------------------\n// Size config\n// ---------------------------------------------------------------------------\n\nconst SIZE_CONFIG: Record<SpinnerSize, { box: number; circle: number; strokeWidth: number; iconSize: number }> = {\n s: { box: 16, circle: 12, strokeWidth: 2, iconSize: 8 },\n m: { box: 20, circle: 16, strokeWidth: 2, iconSize: 12 },\n l: { box: 24, circle: 20, strokeWidth: 2, iconSize: 14 },\n xl: { box: 28, circle: 24, strokeWidth: 2, iconSize: 16 },\n};\n\nconst ANIMATION_DURATION = 900;\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport const Spinner = ({\n mode = 'loading',\n size = 'm',\n testID,\n}: SpinnerProps) => {\n const { colors } = useTheme();\n const cfg = SIZE_CONFIG[size];\n const spinAnim = useRef(new Animated.Value(0)).current;\n\n useEffect(() => {\n const anim = Animated.loop(\n Animated.timing(spinAnim, {\n toValue: 1,\n duration: ANIMATION_DURATION,\n easing: Easing.linear,\n useNativeDriver: true,\n }),\n );\n anim.start();\n return () => anim.stop();\n }, [spinAnim]);\n\n const rotate = spinAnim.interpolate({\n inputRange: [0, 1],\n outputRange: ['0deg', '360deg'],\n });\n\n const ringBase = {\n width: cfg.circle,\n height: cfg.circle,\n borderRadius: cfg.circle / 2,\n borderWidth: cfg.strokeWidth,\n };\n\n return (\n <View\n style={styles.wrapper}\n accessibilityRole=\"progressbar\"\n accessibilityLiveRegion=\"polite\"\n testID={testID}\n >\n {/* Box — centers the circle container */}\n <View style={{ width: cfg.box, height: cfg.box, alignItems: 'center', justifyContent: 'center' }}>\n {/* Circle container — rings are absolute within this */}\n <View style={{ width: cfg.circle, height: cfg.circle }}>\n {/* Track ring — always visible in idle and loading */}\n {mode !== 'finish' && (\n <View style={[styles.ring, { ...ringBase, borderColor: colors.spinner.track }]} />\n )}\n\n {mode === 'loading' && (\n <Animated.View\n style={[\n styles.ring,\n {\n ...ringBase,\n borderTopColor: colors.spinner.arc,\n borderRightColor: colors.spinner.arc,\n borderBottomColor: 'transparent',\n borderLeftColor: 'transparent',\n transform: [{ rotate }],\n },\n ]}\n />\n )}\n\n {mode === 'finish' && (\n <>\n {/* Full arc-colored ring */}\n <View style={[styles.ring, { ...ringBase, borderColor: colors.spinner.arc }]} />\n {/* Check icon — centered absolutely */}\n <View style={styles.iconCenter}>\n <Check size={cfg.iconSize} weight=\"bold\" color={colors.spinner.arc} />\n </View>\n </>\n )}\n </View>\n </View>\n </View>\n );\n};\n\n"]}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export declare const styles: {
|
|
2
|
+
wrapper: {
|
|
3
|
+
alignItems: "center";
|
|
4
|
+
justifyContent: "center";
|
|
5
|
+
};
|
|
6
|
+
ring: {
|
|
7
|
+
position: "absolute";
|
|
8
|
+
top: number;
|
|
9
|
+
left: number;
|
|
10
|
+
};
|
|
11
|
+
iconCenter: {
|
|
12
|
+
position: "absolute";
|
|
13
|
+
top: number;
|
|
14
|
+
left: number;
|
|
15
|
+
right: number;
|
|
16
|
+
bottom: number;
|
|
17
|
+
alignItems: "center";
|
|
18
|
+
justifyContent: "center";
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=Spinner.styles.d.ts.map
|