react-embed-gist
TypeScript icon, indicating that this package has built-in type declarations

1.0.29 • Public • Published

React Embed Gist

NPM Weekly Downloads GitHub license GitHub last-commit GitHub issues-raw

Simple react component which can embed gist in your React application

How to use

Just import as dependency in your file and pass gist as parameter, for example:

import ReactEmbedGist from 'react-embed-gist';

// Only required attribute is gist
  <ReactEmbedGist
     gist="msaracevic/5d757e2fc72482a9a4a439969500c2eb"
     wrapperClass="gist__bash"
     loadingClass="loading__screen"
     titleClass="gist__title"
     errorClass="gist__error"
     contentClass="gist__content"
     file=".bash_profile.sh"
     LoadingFallback={<Loading />}
   />

Attributes

  • gist - gist you want to display, in a form of :USERNAME/:GIST_ID
  • file - optional, if you want to show just a single file from the gist, you can specify it here
  • wrapperClass - optional, if you want to pass your own class to article wrapping the gist
  • titleClass - optional, if you want to pass your own class to h2 title of the gist
  • contentClass - optional, if you want to pass your own class to section wrapping the content
  • errorClass - optional, if you want to pass your own class to article wrapping the error message
  • loadingClass - optional, if you want to pass your own class to article wrapper which is displayed during loading time
  • LoadingFallback - optional, if you want to pass custom loading component which is displayed during loading time

Breaking changes

  • Before version 1.0.24 used loadingFallback as prop name for React node to render while waiting for download. After and including version 1.0.24 should use LoadingFallback

Changelog

  • 1.0.29 - Set LoadingFallback as state to allow next.js to actually work for a change...
  • 1.0.28 - Add this changelog
  • 1.0.27 - Update typescript definitions
  • 1.0.26 - Update to React v19, rewrite 7 years old code with useState instead of old lifecycle methods
  • 1.0.25 - We pretend this doesn't exist
  • 1.0.24 - We pretend this doesn't exist
  • 1.0.22 - 1.0.23 - Update dependencies
  • 1.0.21 - Remove UUID from state
  • 1.0.14 - Build as UMD module
  • 1.0.12 - 1.0.20 - Update dependencies
  • 1.0.11 - Add loading fallback component
  • 1.0.10 - Add error messages
  • 1.0.09 - Reload the component if gist prop changes dynamically
  • 1.0.0 - 1.0.08 - Over 5 years ago, don't remember :)

Versions

Current Tags

VersionDownloads (Last 7 Days)Tag
1.0.29123latest

Version History

VersionDownloads (Last 7 Days)Published
1.0.29123
1.0.282
1.0.271
1.0.262
1.0.251
1.0.242
1.0.231
1.0.220
1.0.210
1.0.205
1.0.190
1.0.171
1.0.160
1.0.151
1.0.142
1.0.131
1.0.120
1.0.1110
1.0.101
1.0.91
1.0.81
1.0.70
1.0.60
1.0.50
1.0.40
1.0.31
1.0.20
1.0.10
1.0.01

Package Sidebar

Install

npm i react-embed-gist

Weekly Downloads

157

Version

1.0.29

License

MIT

Unpacked Size

29.9 kB

Total Files

9

Last publish

Collaborators

  • msaracevic