All Projects → xAlien95 → shortcut-preview

xAlien95 / shortcut-preview

Licence: MIT license
A React component to preview iOS Shortcuts

Programming Languages

typescript
32286 projects
CSS
56736 projects

Projects that are alternatives of or similar to shortcut-preview

react-example-paginated-list-infinite-scroll
Follow a React tutorial series with three parts to build a powerful component in React.
Stars: ✭ 43 (+115%)
Mutual labels:  react-component
StadiaIcons
A set of icons for games based on the Google Stadia logo.
Stars: ✭ 20 (+0%)
Mutual labels:  shortcuts
OnlySwitch
⚙️ All-in-One menu bar app, hide 💻MacBook Pro's notch, dark mode, AirPods, Shortcuts
Stars: ✭ 1,288 (+6340%)
Mutual labels:  shortcuts
react-touch-ripple
Create ripple effect from Material Design with React
Stars: ✭ 27 (+35%)
Mutual labels:  react-component
react-native-nested-listview
A UI component for React Native for representing nested arrays of N levels
Stars: ✭ 163 (+715%)
Mutual labels:  react-component
react-form-base
Base React component for generic forms
Stars: ✭ 18 (-10%)
Mutual labels:  react-component
react-compare-slider
A slider component to compare any two React components in landscape or portrait orientation. It supports custom images, videos... and everything else.
Stars: ✭ 78 (+290%)
Mutual labels:  react-component
pymolshortcuts
The repository pymolschortucts contains the a collection of shortcuts that are loaded on startup of PyMOL. These shortcuts enable websearches from within PyMOL as well as many other convienent functions that make work in PyMOL more productive..
Stars: ✭ 34 (+70%)
Mutual labels:  shortcuts
executor
A powerful "short-cutter" to your console to you and your team!
Stars: ✭ 21 (+5%)
Mutual labels:  shortcuts
font-picker-react
✏️ Font selector component for Google Fonts
Stars: ✭ 126 (+530%)
Mutual labels:  react-component
react-instagram-authless-feed
React component to provide a token-less Instagram feed.
Stars: ✭ 50 (+150%)
Mutual labels:  react-component
markdown-navbar
Best markdown navigation bar for React.
Stars: ✭ 122 (+510%)
Mutual labels:  react-component
hyperkeys
Unleash you keyboard shorcuts
Stars: ✭ 35 (+75%)
Mutual labels:  shortcuts
react-carousel-minimal
React.js Responsive Minimal Carousel
Stars: ✭ 76 (+280%)
Mutual labels:  react-component
anyshortcut-cli
CLI (Commnad line interface) version of Anyshortcut
Stars: ✭ 82 (+310%)
Mutual labels:  shortcuts
react-windows-ui
Build Windows fluent UI apps using ReactJS. Provides a set of accessible, reusable, and composable React components that make it super easy to create websites and apps.
Stars: ✭ 383 (+1815%)
Mutual labels:  react-component
mighty-input
Text input for modern web
Stars: ✭ 20 (+0%)
Mutual labels:  react-component
candy mobile
No description or website provided.
Stars: ✭ 16 (-20%)
Mutual labels:  react-component
react-quick-pinch-zoom
A react component that providing multi-touch gestures for zooming and dragging on any DOM element.
Stars: ✭ 124 (+520%)
Mutual labels:  react-component
react-liff
A react context provider for LIFF (LINE Front-end Framework)
Stars: ✭ 22 (+10%)
Mutual labels:  react-component

Shortcut Preview

npm version npm

A React component to preview iOS Shortcuts.

Screenshot

See the component in action on xalien95.github.io/shortcut-preview.

Installation

You can install this component using npm:

npm i shortcut-preview

Usage

import React from 'react';
import ShortcutPreview from 'shortcut-preview';

// JSON file containing a Shortcut converted using 'pblist-parser'
import shortcutData from './shortcut-data.json';

export default class App extends React.Component {
  render() {
    return <ShortcutPreview data={shortcutData} />;
  }
}

You can optionally add a debug property: each action block will then show a LOG button to console.log the contents stored in its state.

export default class App extends React.Component {
  render() {
    return <ShortcutPreview debug data={shortcutData} />;
  }
}

Similar Projects

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].