react-insta-stories
Advanced tools
react-insta-stories - npm Package Compare versions
Comparing version 2.1.3 to 2.2.0
| import * as React from 'react'; | ||
| export interface ReactInstaStoriesProps { | ||
| stories: Story[]; | ||
| width?: number; | ||
| height?: number; | ||
| width?: NumberOrString; | ||
| height?: NumberOrString; | ||
| loader?: JSX.Element; | ||
| header?: Function; | ||
| storyContainerStyles?: Record<string, any>; | ||
| storyStyles?: Object; | ||
@@ -23,6 +24,7 @@ loop?: boolean; | ||
| export interface GlobalCtx { | ||
| width?: number; | ||
| height?: number; | ||
| width?: NumberOrString; | ||
| height?: NumberOrString; | ||
| loader?: JSX.Element; | ||
| header?: Function; | ||
| storyContainerStyles?: Record<string, any>; | ||
| storyStyles?: Object; | ||
@@ -42,2 +44,3 @@ loop?: boolean; | ||
| } | ||
| declare type NumberOrString = number | string; | ||
| export interface StoriesContext { | ||
@@ -58,4 +61,4 @@ stories: Story[]; | ||
| config: { | ||
| width?: number; | ||
| height?: number; | ||
| width?: NumberOrString; | ||
| height?: NumberOrString; | ||
| loader?: JSX.Element; | ||
@@ -139,1 +142,2 @@ header?: Function; | ||
| } | ||
| export {}; |
| { | ||
| "name": "react-insta-stories", | ||
| "version": "2.1.3", | ||
| "version": "2.2.0", | ||
| "description": "A React component for Instagram like stories", | ||
@@ -5,0 +5,0 @@ "main": "dist/index.js", |
@@ -48,20 +48,21 @@  | ||
| | Property | Type | Default | Description | | ||
| | -------------------- | --------------- | ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| | `stories` | [String/Object] | `required` | An array of image urls or array of story objects (options described below) | | ||
| | `renderers` ⚡️ | [Object] | `[]` | An array of renderer objects (options described below) | | ||
| | `defaultInterval` | Number | 1200 | Milliseconds duration for which a story persists | | ||
| | `loader` | Component | Ripple loader | A loader component as a fallback until image loads from url | | ||
| | `header` | Component | Default header as in demo | A header component which sits at the top of each story. It receives the `header` object from the `story` object. Data for header to be sent with each story object. | | ||
| | `width` | Number | 360 | Width of the component in pixels | | ||
| | `height` | Number | 640 | Height of the component in pixels | | ||
| | `storyStyles` | Object | none | Override the default story styles mentioned below. | | ||
| | `loop` | Boolean | false | The last story loop to the first one and restart the stories. | | ||
| | **New props** | ⭐️ | ⭐️ | ⭐️ | | ||
| | `isPaused` | Boolean | false | Toggle story playing state | | ||
| | `currentIndex` | Number | undefined | Set the current story index | | ||
| | `onStoryStart` | Function | - | Callback when a story starts | | ||
| | `onStoryEnd` | Function | - | Callback when a story ends | | ||
| | `onAllStoriesEnd` | Function | - | Callback when all stories in the array have ended | | ||
| | `keyboardNavigation` | Boolean | false | Attaches arrow key listeners to navigate between stories if true. Also adds up arrow key listener for opening See More and Escape/down arrow for closing it | | ||
| | Property | Type | Default | Description | | ||
| | ---------------------- | --------------- | ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| | `stories` | [String/Object] | `required` | An array of image urls or array of story objects (options described below) | | ||
| | `renderers` ⚡️ | [Object] | `[]` | An array of renderer objects (options described below) | | ||
| | `defaultInterval` | Number | 1200 | Milliseconds duration for which a story persists | | ||
| | `loader` | Component | Ripple loader | A loader component as a fallback until image loads from url | | ||
| | `header` | Component | Default header as in demo | A header component which sits at the top of each story. It receives the `header` object from the `story` object. Data for header to be sent with each story object. | | ||
| | `storyContainerStyles` | Object | `{}` | Styles object for the outer container | | ||
| | `width` | Number/String | 360 | Width of the component, e.g. 600 or '100vw' or 'inherit' | | ||
| | `height` | Number/String | 640 | Height of the component, e.g. 1000 or '100%' or 'inherit' | | ||
| | `storyStyles` | Object | none | Override the default story styles mentioned below. | | ||
| | `loop` | Boolean | false | The last story loop to the first one and restart the stories. | | ||
| | **New props** | ⭐️ | ⭐️ | ⭐️ | | ||
| | `isPaused` | Boolean | false | Toggle story playing state | | ||
| | `currentIndex` | Number | undefined | Set the current story index | | ||
| | `onStoryStart` | Function | - | Callback when a story starts | | ||
| | `onStoryEnd` | Function | - | Callback when a story ends | | ||
| | `onAllStoriesEnd` | Function | - | Callback when all stories in the array have ended | | ||
| | `keyboardNavigation` | Boolean | false | Attaches arrow key listeners to navigate between stories if true. Also adds up arrow key listener for opening See More and Escape/down arrow for closing it | | ||
@@ -68,0 +69,0 @@ ### Story object |
Sorry, the diff of this file is too big to display
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.55%
157389
- Lines of code
- increased by1%
405
- Number of lines in readme file
- increased by0.24%
412
- Number of medium supply chain risk alerts
- decreased by-100%
0
No dependency changes