https://github.com/innei/shiro-remote-components
https://github.com/innei/shiro-remote-components
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/innei/shiro-remote-components
- Owner: Innei
- Created: 2024-02-09T14:58:52.000Z (over 2 years ago)
- Default Branch: v2
- Last Pushed: 2024-11-03T15:30:02.000Z (over 1 year ago)
- Last Synced: 2025-05-15T13:09:53.762Z (about 1 year ago)
- Language: TypeScript
- Size: 885 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Shiro Remote React Components
This repository is used to store my embedded React components for the [Shiro](https://github.com/Innei/Shiro) Markdown format.
Similar to how MDX can render a React component in Markdown, the following format can render a remote React component if in Shiro Flavored Markdown.
````markdown
```component
import=https://cdn.jsdelivr.net/npm/@innei/react-cdn-components@0.0.7/dist/components/Firework.js
name=MDX.Firework
height=25
```
````
## Excalidraw
Copy `https://cdn.jsdelivr.net/gh/innei/shiro-remote-components@main/excalidraw/`
## Props
`import=` is similar to importing a js code
`name=` Get the location of the component for this js scope.
You need to package the js in iife or umd format. They can both be retrieved directly from the window object.
For example, your js umd exists on the window `window.YourComponent` is a legal React component.
YourComponent` is a legitimate React component:
````markdown
```component
import=your script location
name=YourComponent
```
````