Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

amp-react-components

Package Overview
Dependencies
Maintainers
1
Versions
11
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

amp-react-components - npm Package Compare versions

Comparing version 1.2.0 to 1.3.0

type/components/util/AmpAnimation.d.ts

6

CHANGELOG.md

@@ -0,1 +1,7 @@

## 1.3.0 (2019-10-15)
* fix: corrent import path ([7e9e0bd](https://github.com/danhuang1202/amp-react-components/commit/7e9e0bd))
* feat: update directory name ([3423917](https://github.com/danhuang1202/amp-react-components/commit/3423917))
* docs: update readme ([cf8e9a4](https://github.com/danhuang1202/amp-react-components/commit/cf8e9a4))
## 1.2.0 (2019-10-14)

@@ -2,0 +8,0 @@

12

config/rollup.config.js

@@ -34,6 +34,6 @@ import commonjs from 'rollup-plugin-commonjs'

const codegenPath = path.join(__dirname, '../src/components/codegen/')
fs.readdirSync(codegenPath).forEach(filename => {
const viewPath = path.join(__dirname, '../src/components/view/')
fs.readdirSync(viewPath).forEach(filename => {
entries.push({
input: `src/components/codegen/${filename}`,
input: `src/components/view/${filename}`,
output: [

@@ -52,6 +52,6 @@ {

const scriptPath = path.join(__dirname, '../src/components/script/')
fs.readdirSync(scriptPath).forEach(filename => {
const utilPath = path.join(__dirname, '../src/components/util/')
fs.readdirSync(utilPath).forEach(filename => {
entries.push({
input: `src/components/script/${filename}`,
input: `src/components/util/${filename}`,
output: [

@@ -58,0 +58,0 @@ {

{
"name": "amp-react-components",
"version": "1.2.0",
"version": "1.3.0",
"description": "Render AMP components with React",

@@ -5,0 +5,0 @@ "main": "lib/index.js",

@@ -6,5 +6,5 @@ # amp-react-components

Render AMP components with React.
1. Support <a href="https://www.styled-components.com/docs/advanced#existing-css">styled-components</a> by passed-in `className` prop,
and attaches `className` prop to `class` prop of AMP HTML tag duo to React does't support <a href="https://github.com/facebook/react/issues/11347#issuecomment-339830484">custom element attributes</a> now.
2. Render script tag with JSON object inside to support <a href="https://amp.dev/documentation/components/amp-animation/?format=websites">amp-animation</a> and <a href="https://amp.dev/documentation/components/amp-bind/?format=websites">amp-bind</a>
1. Support <a href="https://www.styled-components.com/docs/advanced#existing-css">styled-components</a> by passed-in `className` prop.
2. Attaches `className` prop to `class` prop of AMP elements for supporting HTML class attribute. Now React does't support <a href="https://github.com/facebook/react/issues/11347#issuecomment-339830484">custom element attributes</a>, so the `<amp-img className="img" />` will be rendered as `<amp-img classname="img" />`
3. Render script tag with `type=application/json` to support AMP components, such as <a href="https://amp.dev/documentation/components/amp-animation/?format=websites">amp-animation</a> and <a href="https://amp.dev/documentation/components/amp-bind/?format=websites">amp-bind</a>

@@ -11,0 +11,0 @@ ## Installation

@@ -51,3 +51,3 @@ const fs = require('fs-extra')

const content = generateReactComponent(tag, component)
const filename = path.resolve(__dirname, `../src/components/codegen/${component}.tsx`)
const filename = path.resolve(__dirname, `../src/components/view/${component}.tsx`)
try {

@@ -61,13 +61,13 @@ fs.writeFileSync(filename, content)

function generateIndex() {
const codegenPath = path.join(__dirname, '../src/components/codegen')
const codegenFilenames = fs.readdirSync(codegenPath).map(filename => filename.split('.')[0])
const scriptPath = path.join(__dirname, '../src/components/script')
const scriptFilenames = fs.readdirSync(scriptPath).map(filename => filename.split('.')[0])
const viewPath = path.join(__dirname, '../src/components/view')
const viewFilenames = fs.readdirSync(viewPath).map(filename => filename.split('.')[0])
const utilPath = path.join(__dirname, '../src/components/util')
const utilFilenames = fs.readdirSync(utilPath).map(filename => filename.split('.')[0])
return `${codegenFilenames.map(name => `import ${name} from './components/codegen/${name}'
`).join('')}${scriptFilenames.map(name => `import ${name} from './components/script/${name}'
return `${viewFilenames.map(name => `import ${name} from './components/view/${name}'
`).join('')}${utilFilenames.map(name => `import ${name} from './components/util/${name}'
`).join('')}
export {${codegenFilenames.map(name => `
${name},`).join('')}${scriptFilenames.map(name => `
export {${viewFilenames.map(name => `
${name},`).join('')}${utilFilenames.map(name => `
${name}`).join(',')}

@@ -74,0 +74,0 @@ }

@@ -1,127 +0,127 @@

import Amp3dGltf from './components/codegen/Amp3dGltf';
import Amp3qPlayer from './components/codegen/Amp3qPlayer';
import AmpAccess from './components/codegen/AmpAccess';
import AmpAccessLaterpay from './components/codegen/AmpAccessLaterpay';
import AmpAccessPoool from './components/codegen/AmpAccessPoool';
import AmpAccordion from './components/codegen/AmpAccordion';
import AmpActionMacro from './components/codegen/AmpActionMacro';
import AmpAd from './components/codegen/AmpAd';
import AmpAdExit from './components/codegen/AmpAdExit';
import AmpAddthis from './components/codegen/AmpAddthis';
import AmpAnalytics from './components/codegen/AmpAnalytics';
import AmpAnim from './components/codegen/AmpAnim';
import AmpApesterMedia from './components/codegen/AmpApesterMedia';
import AmpAppBanner from './components/codegen/AmpAppBanner';
import AmpAudio from './components/codegen/AmpAudio';
import AmpAutoAds from './components/codegen/AmpAutoAds';
import AmpAutocomplete from './components/codegen/AmpAutocomplete';
import AmpBaseCarousel from './components/codegen/AmpBaseCarousel';
import AmpBeopinion from './components/codegen/AmpBeopinion';
import AmpBodymovinAnimation from './components/codegen/AmpBodymovinAnimation';
import AmpBridPlayer from './components/codegen/AmpBridPlayer';
import AmpBrightcove from './components/codegen/AmpBrightcove';
import AmpBysideContent from './components/codegen/AmpBysideContent';
import AmpCallTracking from './components/codegen/AmpCallTracking';
import AmpCarousel from './components/codegen/AmpCarousel';
import AmpConnatixPlayer from './components/codegen/AmpConnatixPlayer';
import AmpConsent from './components/codegen/AmpConsent';
import AmpDailymotion from './components/codegen/AmpDailymotion';
import AmpDateCountdown from './components/codegen/AmpDateCountdown';
import AmpDateDisplay from './components/codegen/AmpDateDisplay';
import AmpDatePicker from './components/codegen/AmpDatePicker';
import AmpDelightPlayer from './components/codegen/AmpDelightPlayer';
import AmpDynamicCssClasses from './components/codegen/AmpDynamicCssClasses';
import AmpEmbedlyCard from './components/codegen/AmpEmbedlyCard';
import AmpExperiment from './components/codegen/AmpExperiment';
import AmpFacebook from './components/codegen/AmpFacebook';
import AmpFacebookComments from './components/codegen/AmpFacebookComments';
import AmpFacebookLike from './components/codegen/AmpFacebookLike';
import AmpFacebookPage from './components/codegen/AmpFacebookPage';
import AmpFitText from './components/codegen/AmpFitText';
import AmpFont from './components/codegen/AmpFont';
import AmpForm from './components/codegen/AmpForm';
import AmpFxCollection from './components/codegen/AmpFxCollection';
import AmpFxFlyingCarpet from './components/codegen/AmpFxFlyingCarpet';
import AmpGeo from './components/codegen/AmpGeo';
import AmpGfycat from './components/codegen/AmpGfycat';
import AmpGist from './components/codegen/AmpGist';
import AmpGoogleDocumentEmbed from './components/codegen/AmpGoogleDocumentEmbed';
import AmpGoogleVrviewImage from './components/codegen/AmpGoogleVrviewImage';
import AmpHulu from './components/codegen/AmpHulu';
import AmpIframe from './components/codegen/AmpIframe';
import AmpImaVideo from './components/codegen/AmpImaVideo';
import AmpImageLightbox from './components/codegen/AmpImageLightbox';
import AmpImageSlider from './components/codegen/AmpImageSlider';
import AmpImg from './components/codegen/AmpImg';
import AmpImgur from './components/codegen/AmpImgur';
import AmpInputmask from './components/codegen/AmpInputmask';
import AmpInstagram from './components/codegen/AmpInstagram';
import AmpInstallServiceworker from './components/codegen/AmpInstallServiceworker';
import AmpIzlesene from './components/codegen/AmpIzlesene';
import AmpJwplayer from './components/codegen/AmpJwplayer';
import AmpKalturaPlayer from './components/codegen/AmpKalturaPlayer';
import AmpLightbox from './components/codegen/AmpLightbox';
import AmpLightboxGallery from './components/codegen/AmpLightboxGallery';
import AmpLinkRewriter from './components/codegen/AmpLinkRewriter';
import AmpList from './components/codegen/AmpList';
import AmpLiveList from './components/codegen/AmpLiveList';
import AmpMathml from './components/codegen/AmpMathml';
import AmpMegaphone from './components/codegen/AmpMegaphone';
import AmpMinuteMediaPlayer from './components/codegen/AmpMinuteMediaPlayer';
import AmpMowplayer from './components/codegen/AmpMowplayer';
import AmpMustache from './components/codegen/AmpMustache';
import AmpNextPage from './components/codegen/AmpNextPage';
import AmpNexxtvPlayer from './components/codegen/AmpNexxtvPlayer';
import AmpO2Player from './components/codegen/AmpO2Player';
import AmpOoyalaPlayer from './components/codegen/AmpOoyalaPlayer';
import AmpOrientationObserver from './components/codegen/AmpOrientationObserver';
import AmpPanZoom from './components/codegen/AmpPanZoom';
import AmpPinterest from './components/codegen/AmpPinterest';
import AmpPixel from './components/codegen/AmpPixel';
import AmpPlaybuzz from './components/codegen/AmpPlaybuzz';
import AmpPositionObserver from './components/codegen/AmpPositionObserver';
import AmpPowrPlayer from './components/codegen/AmpPowrPlayer';
import AmpReachPlayer from './components/codegen/AmpReachPlayer';
import AmpRecaptchaInput from './components/codegen/AmpRecaptchaInput';
import AmpReddit from './components/codegen/AmpReddit';
import AmpRiddleQuiz from './components/codegen/AmpRiddleQuiz';
import AmpScript from './components/codegen/AmpScript';
import AmpSelector from './components/codegen/AmpSelector';
import AmpShareTracking from './components/codegen/AmpShareTracking';
import AmpSidebar from './components/codegen/AmpSidebar';
import AmpSkimlinks from './components/codegen/AmpSkimlinks';
import AmpSmartlinks from './components/codegen/AmpSmartlinks';
import AmpSocialShare from './components/codegen/AmpSocialShare';
import AmpSoundcloud from './components/codegen/AmpSoundcloud';
import AmpSpringboardPlayer from './components/codegen/AmpSpringboardPlayer';
import AmpStickyAd from './components/codegen/AmpStickyAd';
import AmpStory from './components/codegen/AmpStory';
import AmpStoryAutoAds from './components/codegen/AmpStoryAutoAds';
import AmpStoryBookend from './components/codegen/AmpStoryBookend';
import AmpStoryCtaLayer from './components/codegen/AmpStoryCtaLayer';
import AmpStoryGridLayer from './components/codegen/AmpStoryGridLayer';
import AmpStoryPage from './components/codegen/AmpStoryPage';
import AmpStoryPageAttachment from './components/codegen/AmpStoryPageAttachment';
import AmpSubscriptions from './components/codegen/AmpSubscriptions';
import AmpSubscriptionsGoogle from './components/codegen/AmpSubscriptionsGoogle';
import AmpTimeago from './components/codegen/AmpTimeago';
import AmpTruncateText from './components/codegen/AmpTruncateText';
import AmpTwitter from './components/codegen/AmpTwitter';
import AmpUserLocation from './components/codegen/AmpUserLocation';
import AmpUserNotification from './components/codegen/AmpUserNotification';
import AmpVideo from './components/codegen/AmpVideo';
import AmpVideoDocking from './components/codegen/AmpVideoDocking';
import AmpVideoIframe from './components/codegen/AmpVideoIframe';
import AmpVimeo from './components/codegen/AmpVimeo';
import AmpVine from './components/codegen/AmpVine';
import AmpViqeoPlayer from './components/codegen/AmpViqeoPlayer';
import AmpVizVega from './components/codegen/AmpVizVega';
import AmpVk from './components/codegen/AmpVk';
import AmpWebPush from './components/codegen/AmpWebPush';
import AmpWistiaPlayer from './components/codegen/AmpWistiaPlayer';
import AmpYotpo from './components/codegen/AmpYotpo';
import AmpYoutube from './components/codegen/AmpYoutube';
import AmpAnimation from './components/script/AmpAnimation';
import AmpState from './components/script/AmpState';
import ComponentScript from './components/script/ComponentScript';
import Amp3dGltf from './components/view/Amp3dGltf';
import Amp3qPlayer from './components/view/Amp3qPlayer';
import AmpAccess from './components/view/AmpAccess';
import AmpAccessLaterpay from './components/view/AmpAccessLaterpay';
import AmpAccessPoool from './components/view/AmpAccessPoool';
import AmpAccordion from './components/view/AmpAccordion';
import AmpActionMacro from './components/view/AmpActionMacro';
import AmpAd from './components/view/AmpAd';
import AmpAdExit from './components/view/AmpAdExit';
import AmpAddthis from './components/view/AmpAddthis';
import AmpAnalytics from './components/view/AmpAnalytics';
import AmpAnim from './components/view/AmpAnim';
import AmpApesterMedia from './components/view/AmpApesterMedia';
import AmpAppBanner from './components/view/AmpAppBanner';
import AmpAudio from './components/view/AmpAudio';
import AmpAutoAds from './components/view/AmpAutoAds';
import AmpAutocomplete from './components/view/AmpAutocomplete';
import AmpBaseCarousel from './components/view/AmpBaseCarousel';
import AmpBeopinion from './components/view/AmpBeopinion';
import AmpBodymovinAnimation from './components/view/AmpBodymovinAnimation';
import AmpBridPlayer from './components/view/AmpBridPlayer';
import AmpBrightcove from './components/view/AmpBrightcove';
import AmpBysideContent from './components/view/AmpBysideContent';
import AmpCallTracking from './components/view/AmpCallTracking';
import AmpCarousel from './components/view/AmpCarousel';
import AmpConnatixPlayer from './components/view/AmpConnatixPlayer';
import AmpConsent from './components/view/AmpConsent';
import AmpDailymotion from './components/view/AmpDailymotion';
import AmpDateCountdown from './components/view/AmpDateCountdown';
import AmpDateDisplay from './components/view/AmpDateDisplay';
import AmpDatePicker from './components/view/AmpDatePicker';
import AmpDelightPlayer from './components/view/AmpDelightPlayer';
import AmpDynamicCssClasses from './components/view/AmpDynamicCssClasses';
import AmpEmbedlyCard from './components/view/AmpEmbedlyCard';
import AmpExperiment from './components/view/AmpExperiment';
import AmpFacebook from './components/view/AmpFacebook';
import AmpFacebookComments from './components/view/AmpFacebookComments';
import AmpFacebookLike from './components/view/AmpFacebookLike';
import AmpFacebookPage from './components/view/AmpFacebookPage';
import AmpFitText from './components/view/AmpFitText';
import AmpFont from './components/view/AmpFont';
import AmpForm from './components/view/AmpForm';
import AmpFxCollection from './components/view/AmpFxCollection';
import AmpFxFlyingCarpet from './components/view/AmpFxFlyingCarpet';
import AmpGeo from './components/view/AmpGeo';
import AmpGfycat from './components/view/AmpGfycat';
import AmpGist from './components/view/AmpGist';
import AmpGoogleDocumentEmbed from './components/view/AmpGoogleDocumentEmbed';
import AmpGoogleVrviewImage from './components/view/AmpGoogleVrviewImage';
import AmpHulu from './components/view/AmpHulu';
import AmpIframe from './components/view/AmpIframe';
import AmpImaVideo from './components/view/AmpImaVideo';
import AmpImageLightbox from './components/view/AmpImageLightbox';
import AmpImageSlider from './components/view/AmpImageSlider';
import AmpImg from './components/view/AmpImg';
import AmpImgur from './components/view/AmpImgur';
import AmpInputmask from './components/view/AmpInputmask';
import AmpInstagram from './components/view/AmpInstagram';
import AmpInstallServiceworker from './components/view/AmpInstallServiceworker';
import AmpIzlesene from './components/view/AmpIzlesene';
import AmpJwplayer from './components/view/AmpJwplayer';
import AmpKalturaPlayer from './components/view/AmpKalturaPlayer';
import AmpLightbox from './components/view/AmpLightbox';
import AmpLightboxGallery from './components/view/AmpLightboxGallery';
import AmpLinkRewriter from './components/view/AmpLinkRewriter';
import AmpList from './components/view/AmpList';
import AmpLiveList from './components/view/AmpLiveList';
import AmpMathml from './components/view/AmpMathml';
import AmpMegaphone from './components/view/AmpMegaphone';
import AmpMinuteMediaPlayer from './components/view/AmpMinuteMediaPlayer';
import AmpMowplayer from './components/view/AmpMowplayer';
import AmpMustache from './components/view/AmpMustache';
import AmpNextPage from './components/view/AmpNextPage';
import AmpNexxtvPlayer from './components/view/AmpNexxtvPlayer';
import AmpO2Player from './components/view/AmpO2Player';
import AmpOoyalaPlayer from './components/view/AmpOoyalaPlayer';
import AmpOrientationObserver from './components/view/AmpOrientationObserver';
import AmpPanZoom from './components/view/AmpPanZoom';
import AmpPinterest from './components/view/AmpPinterest';
import AmpPixel from './components/view/AmpPixel';
import AmpPlaybuzz from './components/view/AmpPlaybuzz';
import AmpPositionObserver from './components/view/AmpPositionObserver';
import AmpPowrPlayer from './components/view/AmpPowrPlayer';
import AmpReachPlayer from './components/view/AmpReachPlayer';
import AmpRecaptchaInput from './components/view/AmpRecaptchaInput';
import AmpReddit from './components/view/AmpReddit';
import AmpRiddleQuiz from './components/view/AmpRiddleQuiz';
import AmpScript from './components/view/AmpScript';
import AmpSelector from './components/view/AmpSelector';
import AmpShareTracking from './components/view/AmpShareTracking';
import AmpSidebar from './components/view/AmpSidebar';
import AmpSkimlinks from './components/view/AmpSkimlinks';
import AmpSmartlinks from './components/view/AmpSmartlinks';
import AmpSocialShare from './components/view/AmpSocialShare';
import AmpSoundcloud from './components/view/AmpSoundcloud';
import AmpSpringboardPlayer from './components/view/AmpSpringboardPlayer';
import AmpStickyAd from './components/view/AmpStickyAd';
import AmpStory from './components/view/AmpStory';
import AmpStoryAutoAds from './components/view/AmpStoryAutoAds';
import AmpStoryBookend from './components/view/AmpStoryBookend';
import AmpStoryCtaLayer from './components/view/AmpStoryCtaLayer';
import AmpStoryGridLayer from './components/view/AmpStoryGridLayer';
import AmpStoryPage from './components/view/AmpStoryPage';
import AmpStoryPageAttachment from './components/view/AmpStoryPageAttachment';
import AmpSubscriptions from './components/view/AmpSubscriptions';
import AmpSubscriptionsGoogle from './components/view/AmpSubscriptionsGoogle';
import AmpTimeago from './components/view/AmpTimeago';
import AmpTruncateText from './components/view/AmpTruncateText';
import AmpTwitter from './components/view/AmpTwitter';
import AmpUserLocation from './components/view/AmpUserLocation';
import AmpUserNotification from './components/view/AmpUserNotification';
import AmpVideo from './components/view/AmpVideo';
import AmpVideoDocking from './components/view/AmpVideoDocking';
import AmpVideoIframe from './components/view/AmpVideoIframe';
import AmpVimeo from './components/view/AmpVimeo';
import AmpVine from './components/view/AmpVine';
import AmpViqeoPlayer from './components/view/AmpViqeoPlayer';
import AmpVizVega from './components/view/AmpVizVega';
import AmpVk from './components/view/AmpVk';
import AmpWebPush from './components/view/AmpWebPush';
import AmpWistiaPlayer from './components/view/AmpWistiaPlayer';
import AmpYotpo from './components/view/AmpYotpo';
import AmpYoutube from './components/view/AmpYoutube';
import AmpAnimation from './components/util/AmpAnimation';
import AmpState from './components/util/AmpState';
import ComponentScript from './components/util/ComponentScript';
export { Amp3dGltf, Amp3qPlayer, AmpAccess, AmpAccessLaterpay, AmpAccessPoool, AmpAccordion, AmpActionMacro, AmpAd, AmpAdExit, AmpAddthis, AmpAnalytics, AmpAnim, AmpApesterMedia, AmpAppBanner, AmpAudio, AmpAutoAds, AmpAutocomplete, AmpBaseCarousel, AmpBeopinion, AmpBodymovinAnimation, AmpBridPlayer, AmpBrightcove, AmpBysideContent, AmpCallTracking, AmpCarousel, AmpConnatixPlayer, AmpConsent, AmpDailymotion, AmpDateCountdown, AmpDateDisplay, AmpDatePicker, AmpDelightPlayer, AmpDynamicCssClasses, AmpEmbedlyCard, AmpExperiment, AmpFacebook, AmpFacebookComments, AmpFacebookLike, AmpFacebookPage, AmpFitText, AmpFont, AmpForm, AmpFxCollection, AmpFxFlyingCarpet, AmpGeo, AmpGfycat, AmpGist, AmpGoogleDocumentEmbed, AmpGoogleVrviewImage, AmpHulu, AmpIframe, AmpImaVideo, AmpImageLightbox, AmpImageSlider, AmpImg, AmpImgur, AmpInputmask, AmpInstagram, AmpInstallServiceworker, AmpIzlesene, AmpJwplayer, AmpKalturaPlayer, AmpLightbox, AmpLightboxGallery, AmpLinkRewriter, AmpList, AmpLiveList, AmpMathml, AmpMegaphone, AmpMinuteMediaPlayer, AmpMowplayer, AmpMustache, AmpNextPage, AmpNexxtvPlayer, AmpO2Player, AmpOoyalaPlayer, AmpOrientationObserver, AmpPanZoom, AmpPinterest, AmpPixel, AmpPlaybuzz, AmpPositionObserver, AmpPowrPlayer, AmpReachPlayer, AmpRecaptchaInput, AmpReddit, AmpRiddleQuiz, AmpScript, AmpSelector, AmpShareTracking, AmpSidebar, AmpSkimlinks, AmpSmartlinks, AmpSocialShare, AmpSoundcloud, AmpSpringboardPlayer, AmpStickyAd, AmpStory, AmpStoryAutoAds, AmpStoryBookend, AmpStoryCtaLayer, AmpStoryGridLayer, AmpStoryPage, AmpStoryPageAttachment, AmpSubscriptions, AmpSubscriptionsGoogle, AmpTimeago, AmpTruncateText, AmpTwitter, AmpUserLocation, AmpUserNotification, AmpVideo, AmpVideoDocking, AmpVideoIframe, AmpVimeo, AmpVine, AmpViqeoPlayer, AmpVizVega, AmpVk, AmpWebPush, AmpWistiaPlayer, AmpYotpo, AmpYoutube, AmpAnimation, AmpState, ComponentScript };
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc