release: WRNexusJS 0.2.27
This commit is contained in:
@@ -1,114 +1,196 @@
|
||||
{
|
||||
"Page": {
|
||||
"prefix": "page",
|
||||
"WRN page": {
|
||||
"prefix": ["wrn-page", "page"],
|
||||
"description": "Create a WRN page",
|
||||
"body": [
|
||||
"page ${1:Home} {",
|
||||
" layout = \"${2:public}\"",
|
||||
"page ${1:PageName} {",
|
||||
" layout = \"${2:default}\"",
|
||||
"",
|
||||
" seo {",
|
||||
" title = \"${3:Home}\"",
|
||||
" description = \"${4:A WrNexus page.}\"",
|
||||
" }",
|
||||
" seo {",
|
||||
" title = \"${3:Page title}\"",
|
||||
" description = \"${4:Page description}\"",
|
||||
" }",
|
||||
"",
|
||||
" view {",
|
||||
" <h1>$5</h1>",
|
||||
" }",
|
||||
"}",
|
||||
""
|
||||
],
|
||||
"description": "A WrNexus page (a route) with layout, seo and view."
|
||||
},
|
||||
"Component": {
|
||||
"prefix": "component",
|
||||
"body": [
|
||||
"component ${1:Counter} {",
|
||||
" props {",
|
||||
" ${2:start} = ${3:0}",
|
||||
" }",
|
||||
"",
|
||||
" state ${4:count} = ${2:start}",
|
||||
"",
|
||||
" view {",
|
||||
" <button @click=\"${4:count}++\">{${4:count}}</button>",
|
||||
" }",
|
||||
"}",
|
||||
""
|
||||
],
|
||||
"description": "A reusable, prop-driven component."
|
||||
},
|
||||
"View block": {
|
||||
"prefix": "view",
|
||||
"body": ["view {", " $0", "}"],
|
||||
"description": "The server-rendered HTML view block."
|
||||
},
|
||||
"State declaration": {
|
||||
"prefix": "state",
|
||||
"body": ["state ${1:count} = ${2:0}"],
|
||||
"description": "Reactive state seeded into the scope."
|
||||
},
|
||||
"Props block": {
|
||||
"prefix": "props",
|
||||
"body": ["props {", " ${1:label} = ${2:\"Label\"}", "}"],
|
||||
"description": "Component props with typed defaults."
|
||||
},
|
||||
"SEO block": {
|
||||
"prefix": "seo",
|
||||
"body": ["seo {", " title = \"${1:Title}\"", " description = \"${2:Description}\"", "}"],
|
||||
"description": "Per-page SEO metadata."
|
||||
},
|
||||
"API route": {
|
||||
"prefix": "api",
|
||||
"body": [
|
||||
"api ${1|GET,POST,PUT,PATCH,DELETE|} ${2:/path} {",
|
||||
" $0",
|
||||
" return Response.json({ ok: true });",
|
||||
" view {",
|
||||
" <main>",
|
||||
" <h1>${5:Page heading}</h1>",
|
||||
" </main>",
|
||||
" }",
|
||||
"}"
|
||||
],
|
||||
"description": "A colocated API route handler."
|
||||
]
|
||||
},
|
||||
"Functions block": {
|
||||
"prefix": "functions",
|
||||
"body": ["functions {", " $0", "}"],
|
||||
"description": "Shared helper functions for this file."
|
||||
|
||||
"WRN dynamic page": {
|
||||
"prefix": ["wrn-dynamic-page", "dynamic-page"],
|
||||
"description": "Create a WRN page with a route parameter",
|
||||
"body": [
|
||||
"page ${1:DynamicPage} {",
|
||||
" layout = \"${2:default}\"",
|
||||
"",
|
||||
" state ${3:id} = ctx.params.${3:id}",
|
||||
"",
|
||||
" view {",
|
||||
" <main>",
|
||||
" <h1>{${3:id}}</h1>",
|
||||
" </main>",
|
||||
" }",
|
||||
"}"
|
||||
]
|
||||
},
|
||||
"Style block": {
|
||||
"prefix": "style",
|
||||
"body": ["style {", " .${1:box} {", " $0", " }", "}"],
|
||||
"description": "Scoped CSS inlined with the page."
|
||||
|
||||
"WRN component": {
|
||||
"prefix": ["wrn-component", "component"],
|
||||
"description": "Create a WRN component",
|
||||
"body": [
|
||||
"component ${1:ComponentName} {",
|
||||
" props {",
|
||||
" ${2:title} = \"${3:Title}\"",
|
||||
" }",
|
||||
"",
|
||||
" view {",
|
||||
" <div>",
|
||||
" <h2>{${2:title}}</h2>",
|
||||
" </div>",
|
||||
" }",
|
||||
"}"
|
||||
]
|
||||
},
|
||||
"SSR data block": {
|
||||
"prefix": "ssr",
|
||||
"body": ["ssr {", " api ${1:load} ${2|GET,POST|} ${3:/api/data} {", " $0", " }", "}"],
|
||||
"description": "Server-side data fetching block."
|
||||
|
||||
"WRN state": {
|
||||
"prefix": ["wrn-state", "state"],
|
||||
"description": "Create reactive state",
|
||||
"body": ["state ${1:name} = ${2:\"value\"}"]
|
||||
},
|
||||
"Client data block": {
|
||||
"prefix": "client",
|
||||
"body": ["client {", " api ${1:load} ${2|GET,POST|} ${3:/api/data} {", " $0", " }", "}"],
|
||||
"description": "Client-side data fetching block."
|
||||
|
||||
"WRN SEO block": {
|
||||
"prefix": ["wrn-seo", "seo"],
|
||||
"description": "Create SEO metadata",
|
||||
"body": [
|
||||
"seo {",
|
||||
" title = \"${1:Page title}\"",
|
||||
" description = \"${2:Page description}\"",
|
||||
"}"
|
||||
]
|
||||
},
|
||||
"Realtime block": {
|
||||
"prefix": "realtime",
|
||||
"body": ["realtime ${1:chat} {", " on ${2:message}(${3:data}) {", " $0", " }", "}"],
|
||||
"description": "A realtime channel with event handlers."
|
||||
|
||||
"WRN form": {
|
||||
"prefix": ["wrn-form", "form"],
|
||||
"description": "Create a POST form",
|
||||
"body": [
|
||||
"<form",
|
||||
" method=\"post\"",
|
||||
" action=\"${1:/api/action}\"",
|
||||
">",
|
||||
" ${2}",
|
||||
"",
|
||||
" <button type=\"submit\">",
|
||||
" ${3:Submit}",
|
||||
" </button>",
|
||||
"</form>"
|
||||
]
|
||||
},
|
||||
"Component mount": {
|
||||
"prefix": "mount",
|
||||
"body": ["<div data-component=\"${1:counter}\" ${2:start=\"0\"}></div>"],
|
||||
"description": "Mount a component in a view."
|
||||
|
||||
"WRN input": {
|
||||
"prefix": ["wrn-input", "input"],
|
||||
"description": "Create a labeled input",
|
||||
"body": [
|
||||
"<label>",
|
||||
" <span>${1:Label}</span>",
|
||||
"",
|
||||
" <input",
|
||||
" type=\"${2|text,email,password,tel,url,number,date|}\"",
|
||||
" name=\"${3:name}\"",
|
||||
" value=\"${4}\"",
|
||||
" ${5:required}",
|
||||
" />",
|
||||
"</label>"
|
||||
]
|
||||
},
|
||||
"List rendering (data-for)": {
|
||||
"prefix": "for",
|
||||
"body": ["<${1:li} data-for=\"${2:item} in ${3:items}\" data-text=\"${2:item}\"></${1:li}>"],
|
||||
"description": "Repeat an element for each item."
|
||||
|
||||
"WRN conditional class": {
|
||||
"prefix": ["wrn-class-if", "class-if"],
|
||||
"description": "Add a conditional class directive",
|
||||
"body": ["class:${1:border-indigo-500}=\"${2:condition}\""]
|
||||
},
|
||||
"Conditional (data-show)": {
|
||||
"prefix": "show",
|
||||
"body": ["<div data-show=\"${1:condition}\">$0</div>"],
|
||||
"description": "Toggle visibility reactively."
|
||||
|
||||
"WRN click event": {
|
||||
"prefix": ["wrn-click", "click"],
|
||||
"description": "Add a click handler",
|
||||
"body": ["@click=\"${1:handler()}\""]
|
||||
},
|
||||
"Translation": {
|
||||
"prefix": "t",
|
||||
"body": ["{t:${1:key}}"],
|
||||
"description": "Localized text via the i18n dictionary."
|
||||
|
||||
"WRN show directive": {
|
||||
"prefix": ["wrn-show", "show"],
|
||||
"description": "Conditionally show an element",
|
||||
"body": ["data-show=\"${1:condition}\""]
|
||||
},
|
||||
|
||||
"WRN loop": {
|
||||
"prefix": ["wrn-for", "for"],
|
||||
"description": "Create a reactive list loop",
|
||||
"body": ["<div data-for=\"${1:item} in ${2:items}\">", " <span>{${1:item}}</span>", "</div>"]
|
||||
},
|
||||
|
||||
"WRN dynamic link": {
|
||||
"prefix": ["wrn-route-link", "route-link"],
|
||||
"description": "Create a link using route state",
|
||||
"body": ["<a href=\"/${1:resource}/{${2:id}}\">", " ${3:Open}", "</a>"]
|
||||
},
|
||||
|
||||
"WRN API GET": {
|
||||
"prefix": ["wrn-api-get", "api-get"],
|
||||
"description": "Create a GET API route",
|
||||
"body": [
|
||||
"api GET ${1:/api/resource} {",
|
||||
" return Response.json({",
|
||||
" ${2:success}: true",
|
||||
" });",
|
||||
"}"
|
||||
]
|
||||
},
|
||||
|
||||
"WRN API POST": {
|
||||
"prefix": ["wrn-api-post", "api-post"],
|
||||
"description": "Create a POST API route",
|
||||
"body": [
|
||||
"api POST ${1:/api/resource} {",
|
||||
" const body = await ctx.request.json();",
|
||||
"",
|
||||
" return Response.json({",
|
||||
" success: true,",
|
||||
" data: body",
|
||||
" });",
|
||||
"}"
|
||||
]
|
||||
},
|
||||
|
||||
"WRN middleware": {
|
||||
"prefix": ["wrn-middleware", "middleware"],
|
||||
"description": "Create middleware",
|
||||
"body": [
|
||||
"middleware ${1:auth} {",
|
||||
" async function handle(ctx, next) {",
|
||||
" ${2}",
|
||||
" return await next();",
|
||||
" }",
|
||||
"}"
|
||||
]
|
||||
},
|
||||
|
||||
"WRN loading state": {
|
||||
"prefix": ["wrn-loading", "loading-state"],
|
||||
"description": "Create loading state and button",
|
||||
"body": [
|
||||
"state loading = false",
|
||||
"",
|
||||
"<button",
|
||||
" type=\"submit\"",
|
||||
" class:opacity-50=\"loading\"",
|
||||
" class:cursor-not-allowed=\"loading\"",
|
||||
" disabled=\"{loading}\"",
|
||||
">",
|
||||
" {loading ? \"Loading...\" : \"${1:Submit}\"}",
|
||||
"</button>"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user