Roblox Typescript React Snippets

typescriptreact.json

{
	"Class Component": {
		"prefix": "component",
		"body": [
			"import Roact from \"@rbxts/roact\";",
			"",
			"interface ${1:App}State {}",
			"interface ${1:App}Props {}",
			"",
			"export class ${1:App} extends Roact.Component<${1:App}Props, ${1:App}State> {",
				"\tconstructor(props: ${1:App}Props) {",
					"\t\tsuper(props);",
				"\t}",
			"",
				"\trender() {",
					"\t\treturn <frame />;",
				"\t}",
			"}",
			""
		],
		"description": "Create a handy class component"
	},
	"Story Template": {
		"prefix": "story",
		"body": [
			"import Roact from \"@rbxts/roact\";",
			"import { ${1:Component} } from \"../${2:Path}\";",
			"",
			"export = (target: Frame): (() => void) => {",
				"\tconst app = <${1:Component} />;",
				"\tconst mount = Roact.mount(app, target);",
			"",
				"\treturn () => {",
					"\t\tRoact.unmount(mount);",
				"\t};",
			"};",
			"",
		],
		"description": "Create a default story template"
	}
}