{"id":19040130,"url":"https://github.com/logisticinfotech/react-native-animated-alert","last_synced_at":"2025-04-23T21:07:26.744Z","repository":{"id":47648576,"uuid":"201441241","full_name":"logisticinfotech/react-native-animated-alert","owner":"logisticinfotech","description":"React Native Animated Alert library","archived":false,"fork":false,"pushed_at":"2021-08-19T19:06:38.000Z","size":1623,"stargazers_count":5,"open_issues_count":1,"forks_count":1,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-23T21:07:21.541Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/logisticinfotech.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-08-09T09:56:54.000Z","updated_at":"2021-11-09T10:16:03.000Z","dependencies_parsed_at":"2022-09-07T05:22:49.819Z","dependency_job_id":null,"html_url":"https://github.com/logisticinfotech/react-native-animated-alert","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-animated-alert","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-animated-alert/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-animated-alert/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-animated-alert/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/logisticinfotech","download_url":"https://codeload.github.com/logisticinfotech/react-native-animated-alert/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250514784,"owners_count":21443209,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-08T22:20:42.632Z","updated_at":"2025-04-23T21:07:26.703Z","avatar_url":"https://github.com/logisticinfotech.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"left\"\u003e\n    \u003ca href=\"https://www.npmjs.com/package/@logisticinfotech/react-native-animated-alert\"\u003e\u003cimg alt=\"npm version\" src=\"https://img.shields.io/badge/npm-v1.0.11-green.svg\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/@logisticinfotech/react-native-animated-alert\"\u003e\u003cimg src=\"https://img.shields.io/badge/downloads-%3E1K-yellow.svg\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/@logisticinfotech/react-native-animated-alert\"\u003c\u003e\u003cimg src=\"https://img.shields.io/badge/license-MIT-orange.svg\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n# react-native-animated-alert\n\n### Installation and Usage\n\nPlease check this blog for detail usage [this link](https://www.logisticinfotech.com/blog/react-native-animated-alert-library/)\n\n#### Simple Usage\n\n`import Alert from '@logisticinfotech/react-native-animated-alert';`\n\nBelow code will show and hide alert the simple alert.\n\n```\nonPressShow = () =\u003e {\n    Alert.showAlert();\n}\n\n...\n\nonPressHide = () =\u003e {\n    Alert.hideAlert();\n}\n\n...\n\nonAlertShow = () =\u003e {\n    console.log(‘Alert is visible’)\n}\n\nonAlertHide = () =\u003e {\n    console.log(‘Alert is hidden’)\n}\n\n...\n\nrender(){\n    return(\n        \u003cView\u003e\n        ...\n            \u003cAlert\n                alertTitle=\"Title\"\n                alertMessage=\"Message\"\n                onAlertShow={this.onAlertShow}\n                onAlertHide={this.onAlertHide}\n            /\u003e\n        ...\n        \u003c/View\u003e\n    )\n}\n```\n\n![](RNAnimatedAlertIOS.gif)\n![](RNAnimatedAlterAndroid.gif)\n\n### Basic Properties\n\n| Prop                      | Default   | Type                                                      | Description                                                                                                                 |\n| ------------------------- | --------- | --------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------- |\n| alertBGContainerStyle     | {}        | `style`                                                   | Alert main container style.                                                                                                 |\n| alertBGColor              | '#A9A9A9' | `string`                                                  | Alert background color.                                                                                                     |\n| alertIconVisible          | true      | `bool`                                                    | Display or hide alert icon side to title.                                                                                   |\n| alertLoadingVisible       | true      | `bool`                                                    | Show loading type alter.                                                                                                    |\n| alertIconSource           | bellIcon  | `source`                                                  | Change the default bell icon. This will be not display id loading is visible.                                               |\n| alertIconSize             | 24        | `number`                                                  | size of the alter icon.                                                                                                     |\n| alertIconTintColor        | ''        | `string`                                                  | color of the icon if source has transparent pixel.                                                                          |\n| alertIconResizeMode       | 'center'  | `enum of ['center','contain','cover','repeat','stretch']` | Image resize mode.                                                                                                          |\n| alertAnimatedIcon         | true      | `bool`                                                    | Icon of alert will be show animated.                                                                                        |\n| alertAnimatedIconDuration | 200       | `number`                                                  | Animation time duration of alert icon.                                                                                      |\n| alertTitle                | ''        | `string`                                                  | Display title of the alter.                                                                                                 |\n| alertTitleStyle           | InLibrary | `style`                                                   | Style of alter title display.                                                                                               |\n| alertMessage              | ''        | `string`                                                  | Display message of the alter.                                                                                               |\n| alertMessageStyle         | InLibrary | `style`                                                   | Style of alter message display.                                                                                             |\n| alertButtonTitle          | []        | `array(string)`                                           | Display the alert button. max is 2 buttons. This will be not display id loading is visible.                                 |\n| alertButtonPosition       | 'end'     | `enum of ['start','center','end']`                        | Style of the non selected date or time.                                                                                     |\n| alertButtonStyle          | InLibrary | `style`                                                   | Style of the alert buttons.                                                                                                 |\n| alertButtonTextStyle      | InLibrary | `style`                                                   | Style of text of the alert buttons .                                                                                        |\n| alertAutoHide             | true      | `bool`                                                    | Auto hide alter. This will be not display id loading is visible or button is visible                                        |\n| alertAutoHideDuration     | 2000      | `number`                                                  | Time in millisecond after alter auto hide if it enable. This will be not display id loading is visible or button is visible |\n| alertTapToDismiss         | false     | `bool`                                                    | Hide alert on tap on it. This will be not display id loading is visible.                                                    |\n| onPressAlert              | () =\u003e {}  | `function`                                                | Call when click on the alter.                                                                                               |\n| onPressButtonOne          | () =\u003e {}  | `function`                                                | Call when button one(left button) is press.                                                                                 |\n| onPressButtonTwo          | () =\u003e {}  | `function`                                                | Call when button two(right button) is press if has two buttons.                                                             |\n| onAlertShow               | () =\u003e {}  | `function`                                                | Call when alert is visible.                                                                                                 |\n| onAlertHide               | () =\u003e {}  | `function`                                                | Call when alert is hide.                                                                                                    |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flogisticinfotech%2Freact-native-animated-alert","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flogisticinfotech%2Freact-native-animated-alert","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flogisticinfotech%2Freact-native-animated-alert/lists"}