wip: simpler component model

.changeset/beige-grapes-knock.md

@@ -1,5 +1,5 @@
 ---
-"@hydrofoil/shaperone-core": minor
+"@shaperone/core": minor
 ---
 
 Fixed typo in exported type (`MiminalEnvironment` => `MinimalEnvironment`)

.changeset/brave-grapes-kneel.md

@@ -0,0 +1,5 @@
+---
+"@shaperone/hydra": patch
+---
+
+Update `alcaeus` to v3.0.2

.changeset/chilled-feet-hide.md

@@ -1,5 +1,5 @@
 ---
-"@hydrofoil/shaperone-wc": minor
+"shaperone": minor
 ---
 
 Removed the `window.Shaperone.DEBUG` flag in favor of component `debug` property

.changeset/dry-shoes-cover.md

@@ -1,5 +1,5 @@
 ---
-"@hydrofoil/shaperone-core": patch
+"@shaperone/core": patch
 ---
 
 Fixes setting shapes from dataset

.changeset/dull-baboons-suffer.md

@@ -1,6 +1,5 @@
 ---
-"@hydrofoil/shaperone-wc-material": patch
-"@hydrofoil/shaperone-wc-vaadin": patch
+"@shaperone/vaadin": patch
 ---
 
 Updated core package

.changeset/few-clouds-care.md

@@ -1,7 +1,6 @@
 ---
-"@hydrofoil/shaperone-wc": patch
-"@hydrofoil/shaperone-wc-material": patch
-"@hydrofoil/shaperone-wc-vaadin": patch
+"shaperone": patch
+"@shaperone/vaadin": patch
 ---
 
 Updated `lit` to v3

.changeset/friendly-rings-repair.md

@@ -1,7 +1,6 @@
 ---
-"@hydrofoil/shaperone-wc": patch
-"@hydrofoil/shaperone-wc-material": patch
-"@hydrofoil/shaperone-wc-vaadin": patch
+"shaperone": patch
+"@shaperone/vaadin": patch
 ---
 
 Replace directive `spread` with one from `@open-wc/lit-helpers`

.changeset/hip-lamps-dress.md

@@ -0,0 +1,5 @@
+---
+"@shaperone/rdf-validate-shacl": patch
+---
+
+Updated `rdf-validate-shacl`

.changeset/hungry-guests-boil.md

@@ -1,6 +1,6 @@
 ---
-"@hydrofoil/shaperone-core": patch
-"@hydrofoil/shaperone-wc": patch
+"@shaperone/core": patch
+"shaperone": patch
 ---
 
 Native components: `xsd:decimal` would not accept decimal point as a valid input. 

.changeset/ninety-kiwis-kiss.md

@@ -1,5 +1,5 @@
 ---
-"@hydrofoil/shaperone-wc": patch
+"shaperone": patch
 ---
 
 Native templates: The ability to add and remove property values

.changeset/quiet-fireants-join.md

@@ -1,6 +1,6 @@
 ---
-"@hydrofoil/shaperone-core": patch
-"@hydrofoil/shaperone-wc": patch
+"@shaperone/core": patch
+"shaperone": patch
 ---
 
 Improved state management by separating the state of each element instance

.changeset/seven-monkeys-beam.md

@@ -1,6 +1,6 @@
 ---
-"@hydrofoil/shaperone-core": patch
-"@hydrofoil/shaperone-wc": minor
+"@shaperone/core": patch
+"shaperone": minor
 ---
 
 `configure` is now async and required to register the element

.changeset/silver-dots-pay.md

@@ -0,0 +1,5 @@
+---
+"@shaperone/vaadin": minor
+---
+
+Updated to vaadin 23

.changeset/six-islands-thank.md

@@ -1,5 +1,5 @@
 ---
-"@hydrofoil/shaperone-core": patch
+"@shaperone/core": patch
 ---
 
 When no shape is selected and only one `sh:NodeShape` exists in graph, that shape will be used

.changeset/sixty-toys-approve.md

@@ -0,0 +1,14 @@
+---
+"@shaperone/playground-examples": patch
+"shaperone-stories": patch
+"@shaperone/core": patch
+"@shaperone/core-tests": patch
+"@shaperone/hydra": patch
+"@shaperone/rdf-validate-shacl": patch
+"@shaperone/testing": patch
+"shaperone": patch
+"@shaperone/shoelace": patch
+"@shaperone/vaadin": patch
+---
+
+Package renamed

.changeset/tasty-hounds-hope.md

@@ -0,0 +1,6 @@
+---
+"@shaperone/core": major
+"shaperone": major
+---
+
+Refactored the whole component model

.changeset/wild-icons-prove.md

@@ -1,11 +1,11 @@
 ---
-"@hydrofoil/shaperone-wc": minor
+"shaperone": minor
 ---
 
 Big change how elements are configured. Global config can be set using the `configure.js` module. 
 
 ```js
-import { configure } from '@hydrofoil/shaperone-wc'
+import { configure } from 'shaperone'
 
 await configure(({ components, editors, renderer, validation }) => {
 
@@ -18,7 +18,7 @@ Additionally, each component can be customised further by providing calling `con
 <shaperone-form></shaperone-form>
 
 <script type="module">
-  import { configure } from '@hydrofoil/shaperone-wc'
+  import { configure } from 'shaperone'
 
   // global configuration must always be invoked 
   configure()

.changeset/wise-pumas-eat.md

@@ -1,5 +1,5 @@
 ---
-"@hydrofoil/shaperone-wc": minor
+"shaperone": minor
 ---
 
 Fixes an issue that the form would not render when the node was `<>` (empty string URI)

.eslintignore

@@ -3,3 +3,4 @@ node_modules/
 dist/
 *.snap.js
 packages/rdx/
+demos/lit-html/

.eslintrc.json

@@ -31,7 +31,8 @@
     "rules": {
       "no-unused-expressions": "warn",
       "babel/no-unused-expressions": "off",
-      "lit-a11y/accessible-name": "off"
+      "lit-a11y/accessible-name": "off",
+      "prefer-arrow-callback": "off"
     }
   },{
     "files": "packages/core-tests/**/*.ts",

.github/workflows/build.yml

@@ -47,9 +47,18 @@ jobs:
         uses: codecov/codecov-action@v4
         with:
           token: ${{ secrets.CODECOV_TOKEN }}
+          flags: core
 
   wtr-tests:
     runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        group:
+          - shaperone
+          - shoelace
+          - hydra
+          - vaadin
     steps:
       - uses: actions/checkout@v4
         with:
@@ -58,8 +67,9 @@ jobs:
         with:
           node-version: 18
       - run: npm ci
-      - run: yarn test:web --puppeteer
+      - run: npx wtr --group ${{ matrix.group }}
       - name: Codecov
         uses: codecov/codecov-action@v4
         with:
           token: ${{ secrets.CODECOV_TOKEN }}
+          flags: ${{ matrix.group }}

.gitignore

@@ -10,7 +10,7 @@ coverage/
 dist/api/
 dist/playground/
 dist/shaperone-form/
-dist/storybook/
+dist/docs/
 !types/**/*.d.ts
 *.log
 !*.snap.js

demos/examples/CHANGELOG.md

@@ -1,4 +1,4 @@
-# @hydrofoil/shaperone-playground-examples
+# @shaperone/playground-examples
 
 ## 0.3.1
 

demos/examples/DescriptionTooltip.ts

@@ -1,6 +1,6 @@
 import type { TemplateResult } from 'lit'
-import { html } from '@hydrofoil/shaperone-wc'
-import type { ComponentDecorator } from '@hydrofoil/shaperone-core/models/components'
+import { html } from 'shaperone'
+import type { ComponentDecorator } from '@shaperone/core/models/components'
 import type { PropertyShape } from '@rdfine/shacl'
 
 function wrap(shape: PropertyShape, result: TemplateResult) {
@@ -15,14 +15,14 @@
   applicableTo() {
     return true
   },
   decorate(component) {
     if ('lazyRender' in component) {
       return {
         ...component,
         lazyRender: async () => {
           const render = await component.lazyRender()
           return function (params, actions) {
             return wrap(params.property.shape, render.call(this, params, actions))
           }
         },
       }
@@ -30,7 +30,7 @@
 
     return {
       ...component,
       render(params, actions) {
         return wrap(params.property.shape, component.render(params, actions))
       },
     }

demos/examples/ErrorSummary/index.ts

@@ -1,6 +1,6 @@
-import type { FocusNodeTemplate } from '@hydrofoil/shaperone-wc/templates.js'
-import { decorate } from '@hydrofoil/shaperone-wc/templates.js'
-import { html } from '@hydrofoil/shaperone-wc'
+import type { FocusNodeTemplate } from 'shaperone/templates.js'
+import { decorate } from 'shaperone/templates.js'
+import { html } from 'shaperone'
 import type { ValidationResult } from '@rdfine/shacl'
 import { shrink } from '@zazuko/prefixes/shrink'
 import rdf from '@zazuko/env/web.js'

demos/examples/InlineNestedShapes/index.ts

@@ -1,5 +1,5 @@
-import type { SingleEditorComponent } from '@hydrofoil/shaperone-wc'
-import { html } from '@hydrofoil/shaperone-wc'
+import type { SingleEditorComponent } from 'shaperone'
+import { html } from 'shaperone'
 import { dash } from '@tpluscode/rdf-ns-builders'
 import { isResource } from 'is-graph-pointer'
 

demos/examples/LanguageMultiSelect/index.ts

@@ -1,11 +1,11 @@
-import type { MultiEditorComponent } from '@hydrofoil/shaperone-wc'
-import { html } from '@hydrofoil/shaperone-wc'
+import type { MultiEditorComponent } from 'shaperone'
+import { html } from 'shaperone'
 import $rdf from '@zazuko/env/web.js'
-import type { MultiEditor, Lazy } from '@hydrofoil/shaperone-core'
+import type { MultiEditor, Lazy } from '@shaperone/core'
 import { vcard, rdfs } from '@tpluscode/rdf-ns-builders'
 import { getLocalizedLabel } from '@rdfjs-elements/lit-helpers'
-import { sort } from '@hydrofoil/shaperone-core/lib/components.js'
-import type { ShaperoneEnvironment } from '@hydrofoil/shaperone-core/env.js'
+import { sort } from '@shaperone/core/lib/components.js'
+import type { ShaperoneEnvironment } from '@shaperone/core/env.js'
 
 const editor = $rdf.namedNode('http://example.com/LanguageMultiSelect')
 
@@ -13,9 +13,9 @@
   editor,
   async lazyRender() {
     if (theme === 'material') {
       await import(/* @vite-ignore */'multiselect-combo-box/theme/material/multiselect-combo-box.js')
     } else {
       await import(/* @vite-ignore */'multiselect-combo-box/theme/lumo/multiselect-combo-box.js')
     }
 
     return ({ property }, { update }) => {

demos/examples/NestedShapesIndividually/components.ts

@@ -1,6 +1,6 @@
 import { dash, rdfs, schema } from '@tpluscode/rdf-ns-builders'
-import type { SingleEditorComponent } from '@hydrofoil/shaperone-wc'
-import { html } from '@hydrofoil/shaperone-wc'
+import type { SingleEditorComponent } from 'shaperone'
+import { html } from 'shaperone'
 import type { GraphPointer } from 'clownface'
 
 function label(object?: GraphPointer) {

demos/examples/NestedShapesIndividually/renderer.ts

@@ -1,6 +1,6 @@
-import type { FormTemplate } from '@hydrofoil/shaperone-wc/templates.js'
-import { decorate } from '@hydrofoil/shaperone-wc/templates.js'
-import { html, css } from '@hydrofoil/shaperone-wc'
+import type { FormTemplate } from 'shaperone/templates.js'
+import { decorate } from 'shaperone/templates.js'
+import { html, css } from 'shaperone'
 
 export const topmostFocusNodeFormRenderer = decorate((form: FormTemplate): FormTemplate => {
   const formTemplate: FormTemplate = (renderer) => {

demos/examples/StarRating/index.ts

@@ -1,12 +1,12 @@
 import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 import type { IconName } from '@fortawesome/fontawesome-svg-core'
-import type { SingleEditor, Lazy, SingleEditorComponent } from '@hydrofoil/shaperone-wc'
-import { html } from '@hydrofoil/shaperone-wc'
-import type { UpdateComponentState } from '@hydrofoil/shaperone-core/models/components'
+import type { SingleEditor, Lazy, SingleEditorComponent } from 'shaperone'
+import { html } from 'shaperone'
+import type { UpdateComponentState } from '@shaperone/core/models/components'
 import { schema, xsd } from '@tpluscode/rdf-ns-builders'
 import { dash } from '@tpluscode/rdf-ns-builders/loose'
 import type { PropertyShape } from '@rdfine/shacl'
-import type { ShaperoneEnvironment } from '@hydrofoil/shaperone-core/env.js'
+import type { ShaperoneEnvironment } from '@shaperone/core/env.js'
 import rdf from '@zazuko/env/web.js'
 
 export interface StarRating {

demos/examples/StarRating/star-rating.ts

@@ -1,7 +1,7 @@
 /* eslint-disable lit-a11y/click-events-have-key-events */
 import { css, LitElement } from 'lit'
 import { customElement, property } from 'lit/decorators.js'
-import { html } from '@hydrofoil/shaperone-wc'
+import { html } from 'shaperone'
 import { repeat } from 'lit/directives/repeat.js'
 import { icon } from '@fortawesome/fontawesome-svg-core'
 import { faStar } from '@fortawesome/free-solid-svg-icons'

demos/examples/XoneRenderer/index.ts

@@ -1,7 +1,7 @@
-import type { FocusNodeTemplate } from '@hydrofoil/shaperone-wc/templates.js'
-import { decorate } from '@hydrofoil/shaperone-wc/templates.js'
-import { html } from '@hydrofoil/shaperone-wc'
-import type { LogicalConstraint } from '@hydrofoil/shaperone-core/models/forms'
+import type { FocusNodeTemplate } from 'shaperone/templates.js'
+import { decorate } from 'shaperone/templates.js'
+import { html } from 'shaperone'
+import type { LogicalConstraint } from '@shaperone/core/models/forms'
 import type { Shape } from '@rdfine/shacl'
 import type { Term } from '@rdfjs/types'
 import { localizedLabel } from '@rdfjs-elements/lit-helpers/localizedLabel.js'

demos/examples/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@hydrofoil/shaperone-playground-examples",
+  "name": "@shaperone/playground-examples",
   "version": "0.3.1",
   "main": "index.js",
   "repository": "https://github.com/hypermedia-app/shaperone",
@@ -8,16 +8,15 @@
   "type": "module",
   "private": true,
   "dependencies": {
-    "@tpluscode/rdf-ns-builders": "^4.3.0",
+    "@tpluscode/rdf-ns-builders": "^5",
     "@fortawesome/fontawesome-svg-core": "^1.2.32",
     "@fortawesome/free-solid-svg-icons": "^5.15.1",
-    "@hydrofoil/shaperone-core": "0.12.1",
-    "@hydrofoil/shaperone-wc": "0.8.1",
-    "@zazuko/env": "^2.1.0",
-    "@rdfjs-elements/lit-helpers": "^0.3.7",
+    "@shaperone/core": "0.12.1",
+    "shaperone": "0.8.1",
+    "@zazuko/env": "^3",
+    "@rdfjs-elements/lit-helpers": "^0.3.11",
     "@zazuko/prefixes": "^2.2.0",
     "is-graph-pointer": "^2",
-    "lit": "^2.0.0",
-    "multiselect-combo-box": "^3.0.0-alpha.2"
+    "lit": "^2.0.0"
   }
 }

demos/lit-html/index.html

@@ -18,7 +18,7 @@
       background-color: #ededed;
     }
   </style>
-  <title>@hydrofoil/shaperone lit-html playground</title>
+  <title>shaperone playground</title>
   <script type="module">
     import process from "process";
     import { Buffer } from "buffer";