Security News
Introducing the Socket Python SDK
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
electron-only
Advanced tools
React component for rendering component for Electron based clients only
react-for-electron-only
React component for rendering component for Electron based clients only.
<ForElectronOnly>
would render children in case when react application runs in Electron Desktop client, else would render nothing(null) .
Considering any isomorphic app which is distributed on ElectronJS and also over Web with same react codebase, say for eg. slack (which renders same UI on electron desktop client and web), there are use cases when you want to render particular DOM node/components on Electron Only and not on browser or vice versa.
There are set of APIs from electron that would give native UI feel eg, dialog
module.
For instance, one may have folder/file path as input text on browser while on electron one may use dialog.showOpenDialog
functionality via a button.
Use of such APIs also eliminate some validation errors.
$ npm install electron-only --save
or
yarn add electron-only
<ForElectronOnly>
import ForElectronOnly from 'electron-only';
...
render(){
return (
<ForElectronOnly>
<div className="electron-ui">
This will only get rendered on Electron
</div>
</ForElectronOnly>
)
}
...
This is render div.electron-ui
on electron and nothing on normal browsers.
<ForElectronOnly>
with fallbackComponent
option
import ForElectronOnly from 'electron-only';
...
render(){
return (
<ForElectronOnly
fallbackComponent={<div className="browser-ui"> This will only get rendered in Browser </div>}>
<div className="electron-ui">
This will only get rendered on Electron
</div>
</ForElectronOnly>
)
}
...
This is render div.electron-ui
on electron and div.browser-ui
on browser.
ForNonElectronOnly
(supports fallbackComponent prop)
import {ForNonElectronOnly} from 'electron-only';
...
render(){
return (
<ForNonElectronOnly
fallbackComponent={<div className="electron-ui"> This will only get rendered in Electron </div>}>
<div className="browser-ui">
This will only get rendered on Browser
</div>
</ForNonElectronOnly>
)
}
...
ForNonElectronOnly
is exactly opposite of ForElectronOnly
, ie,
it will render div.electron-ui
on electron and div.browser-ui
on browser.
ForElectronOnly
Componentimport ForElectronOnly from 'electron-only'
prop | type | description | default value |
---|---|---|---|
children (default) | node | Component to be render for electron | null |
fallbackComponent | node | Component/Node to be rendered for browser | null |
ForNonElectronOnly
Componentimport {ForNonElectronOnly} from 'electron-only'
prop | type | description | default value |
---|---|---|---|
children (default) | node | Component to be render for browser | null |
fallbackComponent | node | Component/Node to be rendered for electron | null |
isElectron
functionimport {isElectron} from 'electron-only'
//or import ElectronOnly from 'electron-only';
// and then ElectronOnly.isElectron function can be used
value | description | comment |
---|---|---|
true | if code is executed on Electron | |
false | if code is not executed on Electron | implies both browser and server execution |
refer LICENSE
file in this repository.
FAQs
React component for rendering component for Electron based clients only
The npm package electron-only receives a total of 7 weekly downloads. As such, electron-only popularity was classified as not popular.
We found that electron-only demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
Security News
Floating dependency ranges in npm can introduce instability and security risks into your project by allowing unverified or incompatible versions to be installed automatically, leading to unpredictable behavior and potential conflicts.
Security News
A new Rust RFC proposes "Trusted Publishing" for Crates.io, introducing short-lived access tokens via OIDC to improve security and reduce risks associated with long-lived API tokens.