Closes outline/issues#888
Added native lazy loading in prep for Chrome release
This commit is contained in:
Tom Moor
2019-04-10 21:06:53 -07:00
parent c1256c61aa
commit 0c1bf1586d
3 changed files with 71 additions and 66 deletions

View File

@@ -39,7 +39,7 @@ class Frame extends React.Component<Props> {
forwardedRef,
...rest
} = this.props;
const Component = border ? Iframe : 'iframe';
const Component = border ? StyledIframe : 'iframe';
return (
<Rounded width={width} height={height}>
@@ -52,6 +52,7 @@ class Frame extends React.Component<Props> {
type="text/html"
frameBorder="0"
title="embed"
loading="lazy"
allowFullScreen
{...rest}
/>
@@ -68,7 +69,11 @@ const Rounded = styled.div`
height: ${props => props.height};
`;
const Iframe = styled.iframe`
// This wrapper allows us to pass non-standard HTML attributes through to the DOM element
// https://www.styled-components.com/docs/basics#passed-props
const Iframe = props => <iframe {...props} />;
const StyledIframe = styled(Iframe)`
border: 1px solid;
border-color: ${props => props.theme.embedBorder};
border-radius: 3px;

View File

@@ -129,9 +129,9 @@
"query-string": "^4.3.4",
"randomstring": "1.1.5",
"raw-loader": "^0.5.1",
"react": "^16.6.0",
"react": "^16.8.6",
"react-avatar-editor": "^10.3.0",
"react-dom": "^16.6.0",
"react-dom": "^16.8.6",
"react-dropzone": "4.2.1",
"react-helmet": "^5.2.0",
"react-keydown": "^1.7.3",
@@ -142,7 +142,7 @@
"react-waypoint": "^7.3.1",
"redis": "^2.6.2",
"redis-lock": "^0.1.0",
"rich-markdown-editor": "^9.1.2",
"rich-markdown-editor": "^9.2.1-0",
"safestart": "1.1.0",
"sequelize": "4.28.6",
"sequelize-cli": "^5.4.0",
@@ -150,7 +150,7 @@
"slug": "^1.0.0",
"string-replace-to-array": "^1.0.3",
"style-loader": "^0.18.2",
"styled-components": "^4.1.3",
"styled-components": "^4.2.0",
"styled-components-breakpoint": "^2.1.1",
"styled-components-grid": "^2.2.1",
"styled-normalize": "^8.0.4",

120
yarn.lock
View File

@@ -5693,6 +5693,10 @@ memoize-one@^4.0.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-4.1.0.tgz#a2387c58c03fff27ca390c31b764a79addf3f906"
memoize-one@^5.0.0:
version "5.0.4"
resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.0.4.tgz#005928aced5c43d890a4dfab18ca908b0ec92cbc"
memoizee@^0.4.14:
version "0.4.14"
resolved "https://registry.yarnpkg.com/memoizee/-/memoizee-0.4.14.tgz#07a00f204699f9a95c2d9e77218271c7cd610d57"
@@ -6974,9 +6978,9 @@ pretty-format@^22.4.0, pretty-format@^22.4.3:
ansi-regex "^3.0.0"
ansi-styles "^3.2.0"
prismjs@^1.15.0:
version "1.15.0"
resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.15.0.tgz#8801d332e472091ba8def94976c8877ad60398d9"
prismjs@^1.16.0:
version "1.16.0"
resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.16.0.tgz#406eb2c8aacb0f5f0f1167930cb83835d10a4308"
optionalDependencies:
clipboard "^2.0.0"
@@ -7210,14 +7214,14 @@ react-deep-force-update@^1.0.0:
version "1.1.2"
resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.1.2.tgz#3d2ae45c2c9040cbb1772be52f8ea1ade6ca2ee1"
react-dom@^16.6.0:
version "16.8.3"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.3.tgz#ae236029e66210783ac81999d3015dfc475b9c32"
react-dom@^16.8.6:
version "16.8.6"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.6.tgz#71d6303f631e8b0097f56165ef608f051ff6e10f"
dependencies:
loose-envify "^1.1.0"
object-assign "^4.1.1"
prop-types "^15.6.2"
scheduler "^0.13.3"
scheduler "^0.13.6"
react-dropzone@4.2.1:
version "4.2.1"
@@ -7338,14 +7342,14 @@ react-waypoint@^7.3.1:
consolidated-events "^1.1.0"
prop-types "^15.0.0"
react@^16.6.0:
version "16.8.3"
resolved "https://registry.yarnpkg.com/react/-/react-16.8.3.tgz#c6f988a2ce895375de216edcfaedd6b9a76451d9"
react@^16.8.6:
version "16.8.6"
resolved "https://registry.yarnpkg.com/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"
dependencies:
loose-envify "^1.1.0"
object-assign "^4.1.1"
prop-types "^15.6.2"
scheduler "^0.13.3"
scheduler "^0.13.6"
read-pkg-up@^1.0.1:
version "1.0.1"
@@ -7735,10 +7739,9 @@ retry-axios@0.3.2, retry-axios@^0.3.2:
version "0.3.2"
resolved "https://registry.yarnpkg.com/retry-axios/-/retry-axios-0.3.2.tgz#5757c80f585b4cc4c4986aa2ffd47a60c6d35e13"
rich-markdown-editor@^9.1.2:
version "9.1.2"
resolved "https://registry.yarnpkg.com/rich-markdown-editor/-/rich-markdown-editor-9.1.2.tgz#869d2a66d93b84ae6878ad3917dd3a012cffb721"
integrity sha512-Sv9svBpH+rVktpNjD/73IpVTVE3atKVLt+Kdcx+o/DRkvJPdXwJkMYXM2jE8IIBRafgdGS/X6JZImVlsX5uHxQ==
rich-markdown-editor@^9.2.1-0:
version "9.2.1-0"
resolved "https://registry.yarnpkg.com/rich-markdown-editor/-/rich-markdown-editor-9.2.1-0.tgz#98417a65f1b3d4cdd5781414f4d9fba97b336443"
dependencies:
"@tommoor/slate-edit-list" "0.19.0-0"
"@wikifactory/slate-edit-blockquote" "^0.7.1"
@@ -7751,25 +7754,22 @@ rich-markdown-editor@^9.1.2:
eslint-plugin-flowtype "^2.46.1"
eslint-plugin-prettier "^2.6.0"
golery-slate-prism "0.6.0-golery.2"
immutable "^3.8.2"
lodash "^4.17.11"
outline-icons "^1.6.0"
prismjs "^1.15.0"
react "^16.6.0"
prismjs "^1.16.0"
react-autosize-textarea "^6.0.0"
react-dom "^16.6.0"
react-keydown "^1.9.7"
react-medium-image-zoom "^3.0.10"
react-portal "^4.1.4"
slate "^0.44.10"
slate "^0.45.0"
slate-collapse-on-escape "^0.8.1"
slate-drop-or-paste-images "^0.9.1"
slate-md-serializer "^5.3.1"
slate-paste-linkify "^0.7.0"
slate-react "^0.21.15"
slate-react "^0.21.20"
slate-schema-violations "^0.1.39"
slugify "^1.3.0"
styled-components "^4.1.3"
styled-components "^4.2.0"
right-align@^0.1.1:
version "0.1.3"
@@ -7878,9 +7878,9 @@ sax@>=0.6.0, sax@^1.2.4, sax@~1.2.1:
version "1.2.4"
resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
scheduler@^0.13.3:
version "0.13.3"
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.3.tgz#bed3c5850f62ea9c716a4d781f9daeb9b2a58896"
scheduler@^0.13.6:
version "0.13.6"
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.6.tgz#466a4ec332467b31a91b9bf74e5347072e4cd889"
dependencies:
loose-envify "^1.1.0"
object-assign "^4.1.1"
@@ -8049,9 +8049,9 @@ slash@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
slate-base64-serializer@^0.2.95:
version "0.2.95"
resolved "https://registry.yarnpkg.com/slate-base64-serializer/-/slate-base64-serializer-0.2.95.tgz#018ccf749f0f0f62fc2d5f4722fd770d359cf76b"
slate-base64-serializer@^0.2.99:
version "0.2.99"
resolved "https://registry.yarnpkg.com/slate-base64-serializer/-/slate-base64-serializer-0.2.99.tgz#22f7208850ceb4f5fee0d5f2a4c1442c13082150"
dependencies:
isomorphic-base64 "^1.0.2"
@@ -8061,9 +8061,9 @@ slate-collapse-on-escape@^0.8.1:
dependencies:
to-pascal-case "^1.0.0"
slate-dev-environment@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/slate-dev-environment/-/slate-dev-environment-0.2.1.tgz#760f500f18af0dc61bcae39eec4160c420fea537"
slate-dev-environment@^0.2.2:
version "0.2.2"
resolved "https://registry.yarnpkg.com/slate-dev-environment/-/slate-dev-environment-0.2.2.tgz#bd8946e1fe4cf5447060c84a362a1d026ed8b77f"
dependencies:
is-in-browser "^1.1.3"
@@ -8082,12 +8082,12 @@ slate-drop-or-paste-images@^0.9.1:
is-url "^1.2.2"
slate-dev-logger "^0.1.0"
slate-hotkeys@^0.2.8:
version "0.2.8"
resolved "https://registry.yarnpkg.com/slate-hotkeys/-/slate-hotkeys-0.2.8.tgz#7fecf732c512c860113f3f1a6dc1015df9d130a7"
slate-hotkeys@^0.2.9:
version "0.2.9"
resolved "https://registry.yarnpkg.com/slate-hotkeys/-/slate-hotkeys-0.2.9.tgz#0cc9eb750a49ab9ef11601305b7c82b5402348e3"
dependencies:
is-hotkey "0.1.4"
slate-dev-environment "^0.2.1"
slate-dev-environment "^0.2.2"
slate-md-serializer@^5.3.1:
version "5.3.1"
@@ -8101,21 +8101,21 @@ slate-paste-linkify@^0.7.0:
dependencies:
is-url "^1.2.2"
slate-plain-serializer@^0.6.34:
version "0.6.34"
resolved "https://registry.yarnpkg.com/slate-plain-serializer/-/slate-plain-serializer-0.6.34.tgz#8775edc1190d5fe3c7196eb0ad665607d0547a87"
slate-plain-serializer@^0.6.38:
version "0.6.38"
resolved "https://registry.yarnpkg.com/slate-plain-serializer/-/slate-plain-serializer-0.6.38.tgz#d4d8840ee6229f75941982fcd3df1345b67f44ec"
slate-prop-types@^0.5.25:
version "0.5.25"
resolved "https://registry.yarnpkg.com/slate-prop-types/-/slate-prop-types-0.5.25.tgz#bbee28fec3eacb51209bc48eea1962374b8a44b5"
slate-prop-types@^0.5.29:
version "0.5.29"
resolved "https://registry.yarnpkg.com/slate-prop-types/-/slate-prop-types-0.5.29.tgz#1a976ce51c6ab750f35b22b84697eb16423b9482"
slate-react-placeholder@^0.1.13:
version "0.1.13"
resolved "https://registry.yarnpkg.com/slate-react-placeholder/-/slate-react-placeholder-0.1.13.tgz#2e442d88b189bff203bdac454a05ce2637a19000"
slate-react-placeholder@^0.1.17:
version "0.1.17"
resolved "https://registry.yarnpkg.com/slate-react-placeholder/-/slate-react-placeholder-0.1.17.tgz#e09ac09c2f3f855f1652426c33ce0bf623da1a3e"
slate-react@^0.21.15:
version "0.21.16"
resolved "https://registry.yarnpkg.com/slate-react/-/slate-react-0.21.16.tgz#fa13b2228ffa6f4d9325bb61995d0231a62ff7b5"
slate-react@^0.21.20:
version "0.21.20"
resolved "https://registry.yarnpkg.com/slate-react/-/slate-react-0.21.20.tgz#b953bc26db2b13f1791976ffae64a1d7e662cf3f"
dependencies:
debug "^3.1.0"
get-window "^1.1.1"
@@ -8125,12 +8125,12 @@ slate-react@^0.21.15:
prop-types "^15.5.8"
react-immutable-proptypes "^2.1.0"
selection-is-backward "^1.0.0"
slate-base64-serializer "^0.2.95"
slate-dev-environment "^0.2.1"
slate-hotkeys "^0.2.8"
slate-plain-serializer "^0.6.34"
slate-prop-types "^0.5.25"
slate-react-placeholder "^0.1.13"
slate-base64-serializer "^0.2.99"
slate-dev-environment "^0.2.2"
slate-hotkeys "^0.2.9"
slate-plain-serializer "^0.6.38"
slate-prop-types "^0.5.29"
slate-react-placeholder "^0.1.17"
tiny-invariant "^1.0.1"
tiny-warning "^0.0.3"
@@ -8138,9 +8138,9 @@ slate-schema-violations@^0.1.39:
version "0.1.39"
resolved "https://registry.yarnpkg.com/slate-schema-violations/-/slate-schema-violations-0.1.39.tgz#854ab5624136419cef4c803b1823acabe11f1c15"
slate@^0.44.10:
version "0.44.10"
resolved "https://registry.yarnpkg.com/slate/-/slate-0.44.10.tgz#ac7c3e3cf85570a8723a64a8a7807c881ddbfa8a"
slate@^0.45.0:
version "0.45.0"
resolved "https://registry.yarnpkg.com/slate/-/slate-0.45.0.tgz#2fec8151c2d311ff475cb1ff655c76827b2bf0e0"
dependencies:
debug "^3.1.0"
direction "^0.1.5"
@@ -8516,16 +8516,16 @@ styled-components-grid@^2.2.1:
react-create-component-from-tag-prop "^1.4.0"
styled-components-breakpoint "^2.0.2"
styled-components@^4.1.3:
version "4.1.3"
resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-4.1.3.tgz#4472447208e618b57e84deaaeb6acd34a5e0fe9b"
styled-components@^4.2.0:
version "4.2.0"
resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-4.2.0.tgz#811fbbec4d64c7189f6c7482b9eb6fefa7fefef7"
dependencies:
"@babel/helper-module-imports" "^7.0.0"
"@emotion/is-prop-valid" "^0.7.3"
"@emotion/unitless" "^0.7.0"
babel-plugin-styled-components ">= 1"
css-to-react-native "^2.2.2"
memoize-one "^4.0.0"
memoize-one "^5.0.0"
prop-types "^15.5.4"
react-is "^16.6.0"
stylis "^3.5.0"