move petite-vue-related shortcodes to pv directory; start input-..., display

assets/js/tsconfig.json

@@ -5,6 +5,7 @@
 	"compilerOptions": {
 		"noEmit": true,
 		"module": "es2022",
+		"moduleResolution": "node",
 		"lib": ["es2017", "dom"],
 		"paths": {
 			"@params": ["./params-tsc.ts"]

exampleSite/config.yaml

@@ -25,12 +25,22 @@ taxonomies:
   domain: domains
   topic: topics
 
+frontmatter:
+  _merge: shallow
+
+related:
+  _merge: shallow
+
+taxonomies:
+  domain: domains
+  topic: topics
+
 menu:
   main:
   - identifier: home
     name: Home
     title: Home
-    url: /posts
+    url: /app
     weight: 10
   - identifier: topics
     name: Topics

exampleSite/content/_index.md

@@ -14,10 +14,10 @@ jsModule: main.ts
 
 cyberscopes example site - use petite-vue in Hugo-generated sites.
 
-{{< pv-count >}}
+{{< pv/count >}}
 
-{{< pv-count init="7" expr="count--" label="dec" >}}
+{{< pv/count init="7" expr="count--" label="dec" >}}
 
-{{< pv-count init="99" expr="save()" label="log" >}}
+{{< pv/count init="99" expr="save()" label="log" >}}
 
-{{< input >}}
+{{< pv/explore >}}

exampleSite/content/app/test1.md

@@ -0,0 +1,20 @@
+---
+title:  "example"
+summary: ""
+img:
+pageid: test1
+domains: []
+topics: []
+date:   2023-02-28
+author: helmutm
+draft:  false
+weight: 10
+jsModule: main.ts
+---
+
+cyberscopes example site - use petite-vue in Hugo-generated sites.
+
+{{< pv/input-textline name="firstname" >}}
+{{< pv/input-textline name="lastname" >}}
+
+{{< pv/display name="firstname" >}}

layouts/shortcodes/pv/display.html

@@ -0,0 +1,12 @@
+<div v-scope @vue:mounted="mounted('data')">
+  <pre v-text="data"></pre>
+</div>
+
+<div v-scope @vue:mounted="mounted('output')">
+  <pre v-text="output"></pre>
+</div>
+
+<div v-scope>
+  <div>id = {| conf.itemid |}</div>
+</div>
+

layouts/shortcodes/pv/input-textline.html

@@ -0,0 +1,7 @@
+{{- $name := default "textline" (.Get "name") }}
+<div v-scope>
+	<input type="text" name="{{ $name }}" autofocus
+					   v-model="data.{{ $name }}"
+		 @vue:mounted="$el.value = ''"
+ 		 @change="save($el.value)" />
+</div>