https://github.com/techwithty/teleprompter-modal
Teleprompter recording modal for React/Next.js: script scrolling, microphone capture, and themeable UI via design tokens. Keyboard accessible.
https://github.com/techwithty/teleprompter-modal
a11y accessibility design-system media modal nextjs react recording tailwind teleprompter typescript ui
Last synced: 1 day ago
JSON representation
Teleprompter recording modal for React/Next.js: script scrolling, microphone capture, and themeable UI via design tokens. Keyboard accessible.
- Host: GitHub
- URL: https://github.com/techwithty/teleprompter-modal
- Owner: TechWithTy
- Created: 2025-08-30T15:07:36.000Z (7 months ago)
- Default Branch: master
- Last Pushed: 2025-09-19T17:14:26.000Z (7 months ago)
- Last Synced: 2025-10-22T09:28:06.883Z (6 months ago)
- Topics: a11y, accessibility, design-system, media, modal, nextjs, react, recording, tailwind, teleprompter, typescript, ui
- Language: TypeScript
- Homepage: https://www.cybershoptech.com
- Size: 9.77 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Teleprompter Modal
Teleprompter recording modal for React/Next.js: script scrolling, microphone capture, and themeable UI via design tokens. Keyboard accessible.
Website: https://www.cybershoptech.com
## Exports
```ts
import { CloneModal, Teleprompter, VoiceRecorderCore } from "@/external/teleprompter-modal";
```
## Usage
```tsx
import { useState } from "react";
import { CloneModal } from "@/external/teleprompter-modal";
export default function Example() {
const [open, setOpen] = useState(false);
return (
setOpen(true)} className="rounded bg-primary px-3 py-2 text-primary-foreground">
Open Teleprompter
setOpen(false)}
onSave={(blob) => {
console.log("saved", blob);
setOpen(false);
}}
/>
);
}
```
## Theming
Aligns with `_docs/features/ui/theming.md` using tokens like `bg-card`, `border-border`, `ring-ring`.
## License
MIT