@xoong/cli 0.0.36 → 0.0.39

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xoong/cli",
-  "version": "0.0.36",
+  "version": "0.0.39",
   "description": "The xoong command line: sync (OpenAPI to typed operations), doctor, check (lint screens), dev, build (strict-CSP static output), render and i18n.",
   "type": "module",
   "bin": {
@@ -17,9 +17,9 @@
   "dependencies": {
     "parse5": "^8.1.0",
     "yaml": "^2.8.0",
-    "@xoong/server": "0.0.36",
-    "@xoong/core": "0.0.36",
-    "@xoong/i18n": "0.0.36"
+    "@xoong/server": "0.0.39",
+    "@xoong/core": "0.0.39",
+    "@xoong/i18n": "0.0.39"
   },
   "files": [
     "src"

package/src/check.js

@@ -11,6 +11,7 @@
  *   XO222 <form xo-submit> outside an <xo-view> (it never binds)
  *   XO221 empty xo-each / xo-if / xo-body expression
  *   XO230 unknown xo-* attribute or element (with the closest match)
+ *   XO242 <xo-image> without an alt attribute (alt="" is a decorative image)
  *   XO240 button/link triggered by xo-click has no accessible name
  *   XO241 xo-click on a non-interactive element (not reachable by keyboard)
  *   XO250 <xo-table sortable|page-size> but the view's operation lacks the query parameters (sort | limit, offset)
@@ -108,6 +109,7 @@ export function checkHtml(source, table, file = '<input>') {
           }
         }
       }
+      if (tag === 'xo-image' && attr(node, 'alt') === undefined) report('warn', 'XO242', node, undefined, '<xo-image> has no alt attribute', 'Describe the image in alt, or write alt="" when it is decorative');
       if (tag === 'xo-table') {
         const op = view && attr(view, 'get') ? ops.get((v => (v.startsWith('/') ? `GET ${v}` : v.replace(/\s+/g, ' ')))(attr(view, 'get').value.trim())) : undefined;
         if (!view || !attr(view, 'get')) report('error', 'XO251', node, undefined, '<xo-table> is not inside an <xo-view get="...">', 'Wrap it: <xo-view get="/things"><xo-table ...></xo-table></xo-view>');

package/src/html-data.js

@@ -24,6 +24,7 @@ export const ATTRIBUTE_DOCS = {
   'xo-with': 'On xo-click/xo-submit: fixed fields added to the request body, `field=value,other={path}` (typed from the request schema).',
   'xo-confirm': 'On xo-click/xo-submit: ask before running, with a native dialog. `{path}` names the item: `xo-confirm="Delete {title}?"`.',
   'xo-notice': 'On xo-click/xo-submit: after success, show this message in <xo-toast> (`{path}` and `{$selectedCount}` work).',
+  'xo-then': 'On xo-click/xo-submit: after success, go to this path; `{id}` comes from the result (a created record), then from the item acted on: `xo-then="/articles/{id}"`, or `xo-then="/articles"` after a delete. <xo-router> navigates.',
   'xo-guard': 'On a <form xo-submit>: with unsaved changes the router asks before the page is left. `xo-guard="off"` disables it; any other text is the question to ask.',
   'xo-route': 'On a <template> inside <xo-router>: the path this route answers, for example `/users/:id`; `*` is the not-found route. The content is inert until the route matches.',
   'xo-layout': 'On a <template> inside <xo-router>: a layout (shell) that routes use with `layout="name"`. It must contain one element with xo-outlet.',
@@ -56,6 +57,7 @@ export const ELEMENT_DOCS = {
   'xo-stepper': ['A number with minus and plus buttons (@xoong/controls); arrows change by step, Page by ten steps, the value is clamped.', [['name', 'Form field path.'], ['label', 'Accessible name.'], ['min', 'Lowest value.'], ['max', 'Highest value.'], ['step', 'Step (default 1).']]],
   'xo-password': ['A password field with a show/hide button (@xoong/controls).', [['name', 'Form field path.'], ['label', 'Accessible name.'], ['autocomplete', '`new-password` or `current-password`, for password managers.'], ['placeholder', 'Hint text of the empty field.']]],
   'xo-copy': ['A read-only value with a Copy button (@xoong/controls); fires `copied`.', [['value', 'The text to show and copy.'], ['label', 'Accessible name of the field.']]],
+  'xo-image': ['An image that loads lazily, keeps its space (no layout jump), shows a placeholder while loading and a fallback on error (@xoong/controls). `data-state`: empty, loading, loaded, error.', [['src', 'The image URL (in an xo-view: `src="{cover.url}"`).'], ['alt', 'Required: the text for the image, or `alt=""` when it is decorative.'], ['width', 'Intrinsic width, reserves the space with height.'], ['height', 'Intrinsic height.'], ['ratio', 'Aspect ratio to reserve instead of width/height: `16/9`, `1.5`.'], ['fit', '`cover` (default) or `contain`.'], ['position', 'object-position, e.g. `top`.'], ['srcset', 'Responsive sources, passed to the img.'], ['sizes', 'Display sizes for srcset.'], ['priority', 'The image above the fold: loads at once with high priority (not lazy).'], ['loading', '`lazy` (default) or `eager`.'], ['fallback', 'A src to use once when the image fails.']]],
   'xo-dialog': ['A modal on the native <dialog>. Open it with xo-open, close it with xo-close or by submitting a form inside.', []],
 };