@texaryn/angular 0.0.0-stage → 0.2.0

package/dist/widgets/field.js

@@ -0,0 +1,256 @@
+import { ChangeDetectionStrategy, Component, computed, input, } from '@angular/core';
+import { useFieldWidget } from '../use-field-widget.js';
+import * as i0 from "@angular/core";
+export class FieldWidgetComponent {
+    node = input.required(...(ngDevMode ? [{ debugName: "node" }] : []));
+    field = useFieldWidget(this.node);
+    requiredIndicator = computed(() => this.field.messages().requiredIndicator(), ...(ngDevMode ? [{ debugName: "requiredIndicator" }] : []));
+    enumOptions = computed(() => (this.field.node().enumValues ?? []).map((option, index) => ({
+        token: `texaryn-enum-${index}`,
+        value: option.value,
+        label: option.title ?? this.stringify(option.value),
+    })), ...(ngDevMode ? [{ debugName: "enumOptions" }] : []));
+    enumValueToken = computed(() => this.enumOptions().find((option) => sameJsonValue(option.value, this.field.value()))?.token ?? '', ...(ngDevMode ? [{ debugName: "enumValueToken" }] : []));
+    stringify = (value) => {
+        if (typeof value === 'string')
+            return value;
+        return JSON.stringify(value) ?? String(value);
+    };
+    onSelectChange(event) {
+        const control = event.target;
+        const option = this.enumOptions().find((candidate) => candidate.token === control.value);
+        this.field.setValue(option ? option.value : '');
+        if (this.field.node().readOnly)
+            control.value = this.enumValueToken();
+    }
+    onCheckboxChange(event) {
+        const control = event.target;
+        this.field.setValue(control.checked);
+        if (this.field.node().readOnly)
+            control.checked = Boolean(this.field.value());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.33", ngImport: i0, type: FieldWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.33", type: FieldWidgetComponent, isStandalone: true, selector: "texaryn-field-widget", inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
+    <div>
+      <label [id]="field.labelFor() + '-label'" [attr.for]="field.labelFor()">@if (field.aria()['aria-required'] && requiredIndicator().placement === 'before') {<span aria-hidden="true">{{ requiredIndicator().text }} </span>}<span>{{ field.label() }}</span>@if (field.aria()['aria-required'] && requiredIndicator().placement === 'after') {<span aria-hidden="true"> {{ requiredIndicator().text }}</span>}</label>
+      @switch (field.kind()) {
+        @case ('enum') {
+          <select
+            [id]="field.aria().id"
+            [name]="field.aria().name"
+            [disabled]="field.aria().disabled"
+            [attr.aria-readonly]="field.aria()['aria-readonly'] ? 'true' : null"
+            [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+            [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+            [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+            (change)="onSelectChange($event)"
+            (blur)="field.onBlur()"
+          >
+            <option value="" [selected]="enumValueToken() === ''"></option>
+            @for (option of enumOptions(); track option.token) {
+              <option [value]="option.token" [selected]="enumValueToken() === option.token">
+                {{ option.label }}
+              </option>
+            }
+          </select>
+        }
+        @case ('boolean') {
+          <input
+            [id]="field.aria().id"
+            [name]="field.aria().name"
+            type="checkbox"
+            [checked]="!!field.value()"
+            [disabled]="field.aria().disabled"
+            [attr.aria-readonly]="field.aria()['aria-readonly'] ? 'true' : null"
+            [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+            [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+            [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+            (change)="onCheckboxChange($event)"
+            (blur)="field.onBlur()"
+          />
+        }
+        @case ('number') {
+          <input
+            [id]="field.aria().id"
+            [name]="field.aria().name"
+            type="number"
+            [value]="field.display()"
+            [disabled]="field.aria().disabled"
+            [readOnly]="field.node().readOnly"
+            [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+            [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+            [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+            [attr.placeholder]="field.aria().placeholder ?? null"
+            (input)="field.setRaw($any($event.target).value)"
+            (blur)="field.onBlur()"
+          />
+        }
+        @default {
+          @if (field.node().widget === 'textarea') {
+            <textarea
+              [id]="field.aria().id"
+              [name]="field.aria().name"
+              [value]="field.display()"
+              [disabled]="field.aria().disabled"
+              [readOnly]="field.node().readOnly"
+              [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+              [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+              [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+              [attr.placeholder]="field.aria().placeholder ?? null"
+              (input)="field.setRaw($any($event.target).value)"
+              (blur)="field.onBlur()"
+            ></textarea>
+          } @else {
+            <input
+              [id]="field.aria().id"
+              [name]="field.aria().name"
+              type="text"
+              [value]="field.display()"
+              [disabled]="field.aria().disabled"
+              [readOnly]="field.node().readOnly"
+              [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+              [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+              [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+              [attr.placeholder]="field.aria().placeholder ?? null"
+              (input)="field.setRaw($any($event.target).value)"
+              (blur)="field.onBlur()"
+            />
+          }
+        }
+      }
+      @if (field.description(); as description) {
+        <div [id]="field.descriptionId()">{{ description }}</div>
+      }
+      <div [id]="field.errorId()" aria-live="polite" aria-atomic="true">
+        @for (error of field.errors(); track $index) {
+          <div>{{ error.message ?? error.keyword }}</div>
+        }
+      </div>
+    </div>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImport: i0, type: FieldWidgetComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'texaryn-field-widget',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    <div>
+      <label [id]="field.labelFor() + '-label'" [attr.for]="field.labelFor()">@if (field.aria()['aria-required'] && requiredIndicator().placement === 'before') {<span aria-hidden="true">{{ requiredIndicator().text }} </span>}<span>{{ field.label() }}</span>@if (field.aria()['aria-required'] && requiredIndicator().placement === 'after') {<span aria-hidden="true"> {{ requiredIndicator().text }}</span>}</label>
+      @switch (field.kind()) {
+        @case ('enum') {
+          <select
+            [id]="field.aria().id"
+            [name]="field.aria().name"
+            [disabled]="field.aria().disabled"
+            [attr.aria-readonly]="field.aria()['aria-readonly'] ? 'true' : null"
+            [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+            [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+            [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+            (change)="onSelectChange($event)"
+            (blur)="field.onBlur()"
+          >
+            <option value="" [selected]="enumValueToken() === ''"></option>
+            @for (option of enumOptions(); track option.token) {
+              <option [value]="option.token" [selected]="enumValueToken() === option.token">
+                {{ option.label }}
+              </option>
+            }
+          </select>
+        }
+        @case ('boolean') {
+          <input
+            [id]="field.aria().id"
+            [name]="field.aria().name"
+            type="checkbox"
+            [checked]="!!field.value()"
+            [disabled]="field.aria().disabled"
+            [attr.aria-readonly]="field.aria()['aria-readonly'] ? 'true' : null"
+            [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+            [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+            [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+            (change)="onCheckboxChange($event)"
+            (blur)="field.onBlur()"
+          />
+        }
+        @case ('number') {
+          <input
+            [id]="field.aria().id"
+            [name]="field.aria().name"
+            type="number"
+            [value]="field.display()"
+            [disabled]="field.aria().disabled"
+            [readOnly]="field.node().readOnly"
+            [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+            [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+            [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+            [attr.placeholder]="field.aria().placeholder ?? null"
+            (input)="field.setRaw($any($event.target).value)"
+            (blur)="field.onBlur()"
+          />
+        }
+        @default {
+          @if (field.node().widget === 'textarea') {
+            <textarea
+              [id]="field.aria().id"
+              [name]="field.aria().name"
+              [value]="field.display()"
+              [disabled]="field.aria().disabled"
+              [readOnly]="field.node().readOnly"
+              [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+              [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+              [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+              [attr.placeholder]="field.aria().placeholder ?? null"
+              (input)="field.setRaw($any($event.target).value)"
+              (blur)="field.onBlur()"
+            ></textarea>
+          } @else {
+            <input
+              [id]="field.aria().id"
+              [name]="field.aria().name"
+              type="text"
+              [value]="field.display()"
+              [disabled]="field.aria().disabled"
+              [readOnly]="field.node().readOnly"
+              [attr.aria-required]="field.aria()['aria-required'] ? 'true' : null"
+              [attr.aria-invalid]="field.aria()['aria-invalid'] ? 'true' : null"
+              [attr.aria-describedby]="field.aria()['aria-describedby'] ?? null"
+              [attr.placeholder]="field.aria().placeholder ?? null"
+              (input)="field.setRaw($any($event.target).value)"
+              (blur)="field.onBlur()"
+            />
+          }
+        }
+      }
+      @if (field.description(); as description) {
+        <div [id]="field.descriptionId()">{{ description }}</div>
+      }
+      <div [id]="field.errorId()" aria-live="polite" aria-atomic="true">
+        @for (error of field.errors(); track $index) {
+          <div>{{ error.message ?? error.keyword }}</div>
+        }
+      </div>
+    </div>
+  `,
+                }]
+        }], propDecorators: { node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: true }] }] } });
+function sameJsonValue(left, right) {
+    if (left === right)
+        return true;
+    if (left === null || right === null || typeof left !== 'object' || typeof right !== 'object') {
+        return false;
+    }
+    if (Array.isArray(left) !== Array.isArray(right))
+        return false;
+    if (Array.isArray(left) && Array.isArray(right)) {
+        return left.length === right.length && left.every((value, index) => sameJsonValue(value, right[index]));
+    }
+    const leftRecord = left;
+    const rightRecord = right;
+    const leftKeys = Object.keys(leftRecord);
+    const rightKeys = Object.keys(rightRecord);
+    return leftKeys.length === rightKeys.length
+        && leftKeys.every((key) => Object.hasOwn(rightRecord, key) && sameJsonValue(leftRecord[key], rightRecord[key]));
+}
+//# sourceMappingURL=field.js.map

package/dist/widgets/field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field.js","sourceRoot":"","sources":["../../src/widgets/field.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,KAAK,GACN,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;;AAyGvD,MAAM,OAAO,oBAAoB;IACtB,IAAI,GAAG,KAAK,CAAC,QAAQ,+CAAU,CAAA;IAC/B,KAAK,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IACjC,iBAAiB,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,iBAAiB,EAAE,6DAAC,CAAA;IAC7E,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,CACnC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,UAAU,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;QAC3D,KAAK,EAAE,gBAAgB,KAAK,EAAE;QAC9B,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC;KACpD,CAAC,CAAC,uDACJ,CAAA;IACQ,cAAc,GAAG,QAAQ,CAAC,GAAG,EAAE,CACtC,IAAI,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,aAAa,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,KAAK,IAAI,EAAE,0DAClG,CAAA;IACQ,SAAS,GAAG,CAAC,KAAc,EAAU,EAAE;QAC9C,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,OAAO,KAAK,CAAA;QAC3C,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,CAAA;IAC/C,CAAC,CAAA;IAED,cAAc,CAAC,KAAY;QACzB,MAAM,OAAO,GAAG,KAAK,CAAC,MAA2B,CAAA;QACjD,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,CAAA;QACxF,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA;QAC/C,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,QAAQ;YAAE,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAA;IACvE,CAAC;IAED,gBAAgB,CAAC,KAAY;QAC3B,MAAM,OAAO,GAAG,KAAK,CAAC,MAA0B,CAAA;QAChD,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;QACpC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,QAAQ;YAAE,OAAO,CAAC,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAA;IAC/E,CAAC;wGA9BU,oBAAoB;4FAApB,oBAAoB,gNAnGrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiGT;;4FAEU,oBAAoB;kBAvGhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,sBAAsB;oBAChC,UAAU,EAAE,IAAI;oBAChB,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiGT;iBACF;;AAkCD,SAAS,aAAa,CAAC,IAAa,EAAE,KAAc;IAClD,IAAI,IAAI,KAAK,KAAK;QAAE,OAAO,IAAI,CAAA;IAC/B,IAAI,IAAI,KAAK,IAAI,IAAI,KAAK,KAAK,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QAC7F,OAAO,KAAK,CAAA;IACd,CAAC;IACD,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;QAAE,OAAO,KAAK,CAAA;IAC9D,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QAChD,OAAO,IAAI,CAAC,MAAM,KAAK,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,aAAa,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;IACzG,CAAC;IACD,MAAM,UAAU,GAAG,IAA+B,CAAA;IAClD,MAAM,WAAW,GAAG,KAAgC,CAAA;IACpD,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;IACxC,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA;IAC1C,OAAO,QAAQ,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM;WACtC,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,WAAW,EAAE,GAAG,CAAC,IAAI,aAAa,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,CAAA;AACnH,CAAC"}

package/dist/widgets/object-layout.d.ts

@@ -0,0 +1,18 @@
+import { objectChildKey } from '@texaryn/core';
+import type { ContainerNode, UINode } from '@texaryn/core';
+import * as i0 from "@angular/core";
+export declare class ObjectLayout {
+    readonly node: import("@angular/core").InputSignal<UINode>;
+    private readonly context;
+    readonly currentNode: import("@angular/core").Signal<ContainerNode>;
+    readonly children: import("@angular/core").Signal<UINode[]>;
+    readonly expandActions: import("@angular/core").Signal<{
+        target: import("@texaryn/core").ProjectionBoundaryTarget;
+        message: import("@texaryn/core").ActionMessage;
+    }[]>;
+    readonly childKey: typeof objectChildKey;
+    expand(targetToken: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ObjectLayout, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ObjectLayout, "texaryn-object-layout", never, { "node": { "alias": "node"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+//# sourceMappingURL=object-layout.d.ts.map

package/dist/widgets/object-layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"object-layout.d.ts","sourceRoot":"","sources":["../../src/widgets/object-layout.ts"],"names":[],"mappings":"AAEA,OAAO,EAAmB,cAAc,EAAE,MAAM,eAAe,CAAA;AAC/D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;;AAI1D,qBAmCa,YAAY;IACvB,QAAQ,CAAC,IAAI,8CAA2B;IACxC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAmB;IAC3C,QAAQ,CAAC,WAAW,gDAGlB;IACF,QAAQ,CAAC,QAAQ,2CAKf;IACF,QAAQ,CAAC,aAAa;;;SAgBpB;IACF,QAAQ,CAAC,QAAQ,wBAAiB;IAElC,MAAM,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI;yCAhCtB,YAAY;2CAAZ,YAAY;CAuCxB"}

package/dist/widgets/object-layout.js

@@ -0,0 +1,115 @@
+import { NgTemplateOutlet } from '@angular/common';
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { englishMessages, objectChildKey } from '@texaryn/core';
+import { useFormContext } from '../context.js';
+import { NodeRenderer } from '../components/node-renderer.js';
+import * as i0 from "@angular/core";
+export class ObjectLayout {
+    node = input.required(...(ngDevMode ? [{ debugName: "node" }] : []));
+    context = useFormContext();
+    currentNode = computed(() => {
+        const node = this.node();
+        return (this.context.form().document().nodes[node.id] ?? node);
+    }, ...(ngDevMode ? [{ debugName: "currentNode" }] : []));
+    children = computed(() => {
+        const document = this.context.form().document();
+        return this.currentNode().children
+            .map((id) => document.nodes[id])
+            .filter((child) => child !== undefined);
+    }, ...(ngDevMode ? [{ debugName: "children" }] : []));
+    expandActions = computed(() => {
+        const current = this.currentNode();
+        const messages = this.context.messages() ?? englishMessages;
+        const firstByReason = new Map();
+        for (const target of current.boundaryTargets ?? []) {
+            if (!firstByReason.has(target.reason))
+                firstByReason.set(target.reason, target);
+        }
+        return [...firstByReason.values()].map((target) => ({
+            target,
+            message: (messages.expandBoundary ?? englishMessages.expandBoundary)({
+                boundary: target.reason,
+                containerTitle: current.annotations.title,
+                position: 1,
+                count: 1,
+            }),
+        }));
+    }, ...(ngDevMode ? [{ debugName: "expandActions" }] : []));
+    childKey = objectChildKey;
+    expand(targetToken) {
+        this.context.form().dispatch({
+            type: 'ExpandBoundary',
+            containerId: this.currentNode().id,
+            targetToken,
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.33", ngImport: i0, type: ObjectLayout, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.33", type: ObjectLayout, isStandalone: true, selector: "texaryn-object-layout", inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
+    @let current = currentNode();
+    @if (current.parentId === null) {
+      <div>
+        <ng-container *ngTemplateOutlet="content" />
+      </div>
+    } @else {
+      <fieldset [attr.role]="current.annotations.title === undefined ? 'none' : null">
+        @if (current.annotations.title !== undefined) {
+          <legend>{{ current.annotations.title }}</legend>
+        }
+        <div>
+          <ng-container *ngTemplateOutlet="content" />
+        </div>
+      </fieldset>
+    }
+    <ng-template #content>
+      @for (child of children(); track childKey(child)) {
+        <texaryn-node-renderer [node]="child" />
+      }
+      @for (action of expandActions(); track action.target.reason) {
+        <button
+          type="button"
+          [attr.aria-label]="action.message.accessibleName"
+          (click)="expand(action.target.token)"
+        >{{ action.message.label }}</button>
+      }
+    </ng-template>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NodeRenderer, selector: "texaryn-node-renderer", inputs: ["node"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImport: i0, type: ObjectLayout, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'texaryn-object-layout',
+                    standalone: true,
+                    imports: [NgTemplateOutlet, NodeRenderer],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: `
+    @let current = currentNode();
+    @if (current.parentId === null) {
+      <div>
+        <ng-container *ngTemplateOutlet="content" />
+      </div>
+    } @else {
+      <fieldset [attr.role]="current.annotations.title === undefined ? 'none' : null">
+        @if (current.annotations.title !== undefined) {
+          <legend>{{ current.annotations.title }}</legend>
+        }
+        <div>
+          <ng-container *ngTemplateOutlet="content" />
+        </div>
+      </fieldset>
+    }
+    <ng-template #content>
+      @for (child of children(); track childKey(child)) {
+        <texaryn-node-renderer [node]="child" />
+      }
+      @for (action of expandActions(); track action.target.reason) {
+        <button
+          type="button"
+          [attr.aria-label]="action.message.accessibleName"
+          (click)="expand(action.target.token)"
+        >{{ action.message.label }}</button>
+      }
+    </ng-template>
+  `,
+                }]
+        }], propDecorators: { node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: true }] }] } });
+//# sourceMappingURL=object-layout.js.map

package/dist/widgets/object-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"object-layout.js","sourceRoot":"","sources":["../../src/widgets/object-layout.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,68 @@
 {
   "name": "@texaryn/angular",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.2.0",
+  "description": "Angular signal bindings and default widgets for Texaryn",
+  "keywords": [
+    "angular",
+    "json-schema",
+    "forms",
+    "form-builder",
+    "schema-driven",
+    "headless",
+    "angular-forms",
+    "dynamic-forms",
+    "typescript"
+  ],
+  "type": "module",
+  "license": "Apache-2.0",
+  "funding": {
+    "type": "github",
+    "url": "https://github.com/sponsors/hamzahamidi"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/texaryn/texaryn.git",
+    "directory": "packages/angular"
+  },
+  "homepage": "https://texaryn.github.io/texaryn/",
+  "bugs": {
+    "url": "https://github.com/texaryn/texaryn/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "CHANGELOG.md"
+  ],
+  "dependencies": {
+    "@texaryn/core": "^0.15.0"
+  },
+  "peerDependencies": {
+    "@angular/common": ">=20.0.0",
+    "@angular/core": ">=20.0.0"
+  },
+  "devDependencies": {
+    "@angular/common": "20.3.33",
+    "@angular/compiler": "20.3.33",
+    "@angular/compiler-cli": "20.3.33",
+    "@angular/core": "20.3.33",
+    "@angular/platform-browser": "20.3.33",
+    "jsdom": "^25.0.0",
+    "rxjs": "^7.8.2",
+    "typescript": "~5.8.0",
+    "@texaryn/schema-json": "0.8.3"
+  },
+  "scripts": {
+    "build": "pnpm --filter @texaryn/core build && ngc -p tsconfig.json",
+    "typecheck": "pnpm --filter @texaryn/core build && ngc --noEmit -p tsconfig.typecheck.json"
+  }
 }