bank20baht-ui 0.2.3 → 0.2.4

package/README.md

@@ -53,6 +53,13 @@ the user can only fix what they see), but `getData()` still returns the full for
 server (`bank20baht-validator`) always validates the complete schema. In a workflow, set
 `view: 'summary'` on a step's form to pin the view that step renders.
 
+### Read-only display
+
+`<baht-form readonly>` shows a submission instead of editing it: values as text, option
+labels instead of keys, chips for multi-picks, Yes/No, no help text, "Not provided" for
+blanks. Same grid, same widths. `displayValue(field, value)` from `bank20baht-ui/engine`
+gives you the same formatting for tables.
+
 ### Repeater — line items / repeating rows
 
 ```js
@@ -284,6 +291,11 @@ React 19+ sets non-string JSX props as DOM properties, so object props (`form`,
 @Component({ schemas: [CUSTOM_ELEMENTS_SCHEMA], /* … */ })
 ```
 
+Bind `readonly` as an attribute (`[attr.readonly]="x ? '' : null"`), not a property — Angular
+rewrites `[readonly]` to the native `readOnly`. Zoneless Angular may connect an element before
+binding its props; since 0.2.3 every field primitive renders empty until `field` arrives. Full
+list of gotchas: [docs/frameworks/angular.md](./docs/frameworks/angular.md#gotchas).
+
 **Vue 3** — `vite.config.ts`:
 
 ```ts

package/dist/components/baht-form.d.ts

@@ -79,6 +79,7 @@ export declare class BahtForm extends BahtElement {
      * `renderField`/`.baht-error`). No-op for 'change'/'submit' modes. */
     private onFieldBlur;
     private renderField;
+    private renderReadonlyField;
     protected render(): TemplateResult;
 }
 declare global {

package/dist/core/display.d.ts

@@ -0,0 +1,23 @@
+import { FieldDescriptor, FieldOption } from './types.js';
+export type DisplayValue = {
+    kind: 'empty';
+} | {
+    kind: 'text';
+    text: string;
+} | {
+    kind: 'chips';
+    items: string[];
+}
+/** Repeater rows: one entry per row, each a list of `label: value` pairs. */
+ | {
+    kind: 'rows';
+    rows: Array<Array<{
+        label: string;
+        text: string;
+    }>>;
+};
+/**
+ * The read-only rendering of one field's value. `options` overrides the
+ * descriptor's own list when they were resolved dynamically (`optionsFrom`).
+ */
+export declare function displayValue(field: FieldDescriptor, value: unknown, options?: FieldOption[] | undefined): DisplayValue;

package/dist/core/i18n.d.ts

@@ -37,6 +37,8 @@ export interface MessageCatalog {
     yes: string;
     no: string;
     emptyValue: string;
+    /** Placeholder option of a dropdown. */
+    choose: string;
     rowCount: string;
 }
 export type MessageKey = keyof MessageCatalog;

package/dist/core/index.d.ts

@@ -10,3 +10,4 @@ export { evaluate } from './engine/evaluate.js';
 export { resolveNext, walkPath } from './engine/graph.js';
 export { evalCondition, readRef } from './engine/conditions.js';
 export { evalValueExpr } from './engine/expressions.js';
+export { displayValue, type DisplayValue } from './display.js';

package/dist/custom-elements.json

@@ -348,6 +348,36 @@
                   }
                 }
               ]
+            },
+            {
+              "kind": "method",
+              "name": "renderReadonlyField",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "TemplateResult"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "field",
+                  "type": {
+                    "text": "FieldDescriptor"
+                  }
+                },
+                {
+                  "name": "width",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "visible",
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ]
             }
           ],
           "events": [