@ashwamegh/react-link-preview
Advanced tools
Comparing version 0.3.0 to 1.0.0
@@ -40,4 +40,4 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } | ||
onClick = props.onClick, | ||
render = props.render; | ||
var api = 'https://lpdg.up.railway.app/parse/link'; | ||
render = props.render, | ||
customDomain = props.customDomain; | ||
var style = { | ||
@@ -61,3 +61,3 @@ width: width, | ||
setLoading(true); | ||
return Promise.resolve(fetch(api, { | ||
return Promise.resolve(fetch(customDomain, { | ||
method: 'POST', | ||
@@ -145,5 +145,6 @@ headers: { | ||
marginRight: 'auto', | ||
marginLeft: 'auto' | ||
marginLeft: 'auto', | ||
customDomain: 'https://lpdg-server.azurewebsites.net/parse/link' | ||
}; | ||
LinkPreview.propTyps = { | ||
LinkPreview.propType = { | ||
url: isValidUrlProp, | ||
@@ -157,3 +158,4 @@ onClick: PropTypes.func, | ||
marginRight: PropTypes.string, | ||
marginLeft: PropTypes.string | ||
marginLeft: PropTypes.string, | ||
customDomain: PropTypes.string | ||
}; | ||
@@ -160,0 +162,0 @@ |
@@ -37,4 +37,4 @@ import React, { useState, useEffect } from 'react'; | ||
onClick = props.onClick, | ||
render = props.render; | ||
var api = 'https://lpdg.up.railway.app/parse/link'; | ||
render = props.render, | ||
customDomain = props.customDomain; | ||
var style = { | ||
@@ -58,3 +58,3 @@ width: width, | ||
setLoading(true); | ||
return Promise.resolve(fetch(api, { | ||
return Promise.resolve(fetch(customDomain, { | ||
method: 'POST', | ||
@@ -142,5 +142,6 @@ headers: { | ||
marginRight: 'auto', | ||
marginLeft: 'auto' | ||
marginLeft: 'auto', | ||
customDomain: 'https://lpdg-server.azurewebsites.net/parse/link' | ||
}; | ||
LinkPreview.propTyps = { | ||
LinkPreview.propType = { | ||
url: isValidUrlProp, | ||
@@ -154,3 +155,4 @@ onClick: PropTypes.func, | ||
marginRight: PropTypes.string, | ||
marginLeft: PropTypes.string | ||
marginLeft: PropTypes.string, | ||
customDomain: PropTypes.string | ||
}; | ||
@@ -157,0 +159,0 @@ |
{ | ||
"name": "@ashwamegh/react-link-preview", | ||
"version": "0.3.0", | ||
"version": "1.0.0", | ||
"private": false, | ||
@@ -28,3 +28,3 @@ "description": "A component package which helps you render the preview of any link", | ||
"type": "git", | ||
"url": "git://github.com/ashwamegh/react-link-preview" | ||
"url": "git://github.com/ashwamegh/react-link-preview.git" | ||
}, | ||
@@ -44,4 +44,4 @@ "homepage": "https://github.com/ashwamegh/react-link-preview#readme", | ||
"peerDependencies": { | ||
"prop-types": "^15.5.4", | ||
"react": "^16.8.0" | ||
"prop-types": "^15.8.1", | ||
"react": "^18.2.0" | ||
}, | ||
@@ -51,24 +51,25 @@ "devDependencies": { | ||
"cross-env": "^7.0.2", | ||
"eslint": "^6.8.0", | ||
"eslint-config-prettier": "^6.7.0", | ||
"eslint-config-standard": "^14.1.0", | ||
"eslint-config-standard-react": "^9.2.0", | ||
"eslint-plugin-import": "^2.18.2", | ||
"eslint": "^8.56.0", | ||
"eslint-config-prettier": "^9.1.0", | ||
"eslint-config-standard": "^17.1.0", | ||
"eslint-config-standard-react": "^13.0.0", | ||
"eslint-plugin-import": "^2.29.1", | ||
"eslint-plugin-node": "^11.0.0", | ||
"eslint-plugin-prettier": "^3.1.1", | ||
"eslint-plugin-promise": "^4.2.1", | ||
"eslint-plugin-react": "^7.17.0", | ||
"eslint-plugin-standard": "^4.0.1", | ||
"gh-pages": "^2.2.0", | ||
"microbundle-crl": "^0.13.10", | ||
"eslint-plugin-prettier": "^5.1.1", | ||
"eslint-plugin-promise": "^6.1.1", | ||
"eslint-plugin-react": "^7.33.2", | ||
"eslint-plugin-standard": "^5.0.0", | ||
"gh-pages": "^6.1.1", | ||
"microbundle-crl": "^0.13.11", | ||
"npm-run-all": "^4.1.5", | ||
"prettier": "^2.0.4", | ||
"prop-types": "^15.7.2", | ||
"react": "^16.13.1", | ||
"react-dom": "^16.13.1", | ||
"react-scripts": "^3.4.1" | ||
"prettier": "^3.1.1", | ||
"prop-types": "^15.8.1", | ||
"react": "^18.2.0", | ||
"react-dom": "^18.2.0", | ||
"react-scripts": "^5.0.1" | ||
}, | ||
"files": [ | ||
"dist" | ||
] | ||
], | ||
"dependencies": {} | ||
} |
@@ -16,2 +16,4 @@ <p align="left"> | ||
> **<ins>NOTE: This utilizes https://github.com/ashwamegh/link-preview-generator-server server deployed on Azure, a free web server which can run 30 minutes in a day.</ins> If you want to use it in a PRODUCTION app, I would recommend you to use your own server (You can use the [`Dockerfile`](https://github.com/ashwamegh/link-preview-generator-server/blob/master/Dockerfile) or the [Docker hub image](https://hub.docker.com/repository/docker/ashwamegh/lpdg-server) for deploying [link-preview-generator-server](https://github.com/ashwamegh/link-preview-generator-server)) and provide the custom link of the API for `customDomain` in the Component Props** | ||
## Demo | ||
@@ -83,3 +85,9 @@ | ||
function App() { | ||
return <LinkPreview url='https://reactjs.org' render={CustomComponent} /> | ||
return ( | ||
<LinkPreview | ||
url='https://reactjs.org' | ||
customDomain='https://lpdg-server.azurewebsites.net/parse/link' | ||
render={CustomComponent} | ||
/> | ||
) | ||
} | ||
@@ -92,13 +100,14 @@ | ||
| Property | Type | Default | Description | Required | | ||
| -------------- | ---------- | ------- | ------------------------------------------------------------------------- | -------- | | ||
| `url` | `string` | | URL to get preview data | true | | ||
| `onClick` | `function` | | onClick handler for the card | false | | ||
| `render` | `function` | | function which can be called with preview data to render custom component | false | | ||
| `width` | `string` | `90%` | Width of the card preview | false | | ||
| `maxWidth` | `string` | `700px` | Max Width of the card preview | false | | ||
| `marginTop` | `string` | `18px` | Margin top for the card | false | | ||
| `marginBottom` | `string` | `18px` | Margin bottom for the card | false | | ||
| `marginRight` | `string` | `auto` | Margin right for the card | false | | ||
| `marginLeft` | `string` | `auto` | Margin left for the card | false | | ||
| Property | Type | Default | Description | Required | | ||
| -------------- | ---------- | -------------------------------------------------- | ------------------------------------------------------------------------- | -------- | | ||
| `url` | `string` | | URL to get preview data | true | | ||
| `onClick` | `function` | | onClick handler for the card | false | | ||
| `customDomain` | `string` | `https://lpdg-server.azurewebsites.net/parse/link` | Custom Server API link which can parse the metadata of the page | false | | ||
| `render` | `function` | | function which can be called with preview data to render custom component | false | | ||
| `width` | `string` | `90%` | Width of the card preview | false | | ||
| `maxWidth` | `string` | `700px` | Max Width of the card preview | false | | ||
| `marginTop` | `string` | `18px` | Margin top for the card | false | | ||
| `marginBottom` | `string` | `18px` | Margin bottom for the card | false | | ||
| `marginRight` | `string` | `auto` | Margin right for the card | false | | ||
| `marginLeft` | `string` | `auto` | Margin left for the card | false | | ||
@@ -105,0 +114,0 @@ ## Contribute |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
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
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
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
42492
412
0
137