structra-ui 0.1.44 → 0.1.46

package/fesm2022/structra-ui.mjs

@@ -4958,6 +4958,20 @@ var LayoutStackAlign;
     LayoutStackAlign["End"] = "end";
     LayoutStackAlign["SpaceBetween"] = "space-between";
 })(LayoutStackAlign || (LayoutStackAlign = {}));
+/** Disposição dos filhos: em fila (lado a lado) ou em coluna (um por baixo do outro). */
+var LayoutStackDirection;
+(function (LayoutStackDirection) {
+    LayoutStackDirection["Row"] = "row";
+    LayoutStackDirection["Column"] = "column";
+})(LayoutStackDirection || (LayoutStackDirection = {}));
+/** Alinhamento no eixo cruzado (`align-items` em `row`; largura/centragem em `column`). */
+var LayoutStackItemAlign;
+(function (LayoutStackItemAlign) {
+    LayoutStackItemAlign["Stretch"] = "stretch";
+    LayoutStackItemAlign["Start"] = "start";
+    LayoutStackItemAlign["Center"] = "center";
+    LayoutStackItemAlign["End"] = "end";
+})(LayoutStackItemAlign || (LayoutStackItemAlign = {}));
 /** Alinhamento em `app-form-actions` (barra de ações de formulário). */
 var FormActionsAlign;
 (function (FormActionsAlign) {
@@ -4967,11 +4981,27 @@ var FormActionsAlign;
     FormActionsAlign["SpaceBetween"] = "space-between";
 })(FormActionsAlign || (FormActionsAlign = {}));
 
-/** Faixa flexível com projeção de conteúdo (ex.: botões alinhados). */
+/**
+ * Faixa flexível com projeção de conteúdo.
+ *
+ * - `align` — eixo principal (`justify-content`: start / center / end / space-between).
+ *   Com `stackFill` activo, o `align` deixa de ser sobrescrito (antes era forçado `flex-start`).
+ * - `direction` — `row` (lado a lado) ou `column` (empilhado).
+ * - `itemAlign` — eixo cruzado (`align-items` em `row`: topo/meio/baixo; em `column`: alinhamento horizontal dos blocos).
+ */
 class LayoutStackComponent {
     constructor() {
-        /** Distribuição horizontal dos filhos (`justify-content`). */
+        /** Distribuição no eixo principal do contentor flex (`justify-content`). */
         this.align = LayoutStackAlign.End;
+        /**
+         * `row` = fila horizontal; `column` = empilhamento vertical (ex.: `app-form-row` por cima de `app-form-col`).
+         */
+        this.direction = LayoutStackDirection.Row;
+        /**
+         * Eixo cruzado: em `row` alinha no vertical (ex.: `start` = topo); em `column` alinha no horizontal.
+         * Se não for definido, mantém o comportamento anterior (compacto sem `fill` = centrado; com `fill` = stretch).
+         */
+        this.itemAlign = null;
         /**
          * Em ecrãs estreitos, aplica ajustes leves (ex.: `gap`) mantendo fila + `wrap`.
          * Por defeito `true`; não é necessário passar no template na maioria dos casos.
@@ -4986,7 +5016,14 @@ class LayoutStackComponent {
         this.stackFill = true;
     }
     get hostClass() {
-        const parts = ['layout-stack', `layout-stack--align-${this.align}`];
+        const parts = [
+            'layout-stack',
+            `layout-stack--align-${this.align}`,
+            `layout-stack--dir-${this.direction}`,
+        ];
+        if (this.itemAlign != null) {
+            parts.push(`layout-stack--items-${this.itemAlign}`);
+        }
         if (this.stackOnMobile) {
             parts.push('layout-stack--stack-mobile');
         }
@@ -4999,13 +5036,17 @@ class LayoutStackComponent {
         return parts.join(' ');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutStackComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: LayoutStackComponent, isStandalone: true, selector: "app-layout-stack", inputs: { align: "align", stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute], stackDivider: ["stackDivider", "stackDivider", booleanAttribute], stackFill: ["stackFill", "stackFill", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:stretch;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%;align-self:center}:host(.layout-stack--fill):not(.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap;justify-content:flex-start}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;align-self:stretch}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{gap:.45rem .6rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: LayoutStackComponent, isStandalone: true, selector: "app-layout-stack", inputs: { align: "align", direction: "direction", itemAlign: "itemAlign", stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute], stackDivider: ["stackDivider", "stackDivider", booleanAttribute], stackFill: ["stackFill", "stackFill", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:stretch;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--dir-column) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%}:host(.layout-stack--items-stretch) .layout-stack__track{align-items:stretch}:host(.layout-stack--items-start) .layout-stack__track{align-items:flex-start}:host(.layout-stack--items-center) .layout-stack__track{align-items:center}:host(.layout-stack--items-end) .layout-stack__track{align-items:flex-end}:host(.layout-stack--fill:not(.layout-stack--align-space-between)) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;min-height:0;align-self:auto}:host(.layout-stack--fill.layout-stack--dir-column) ::ng-deep .layout-stack__track>*{width:100%}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{gap:.45rem .6rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutStackComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-layout-stack', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:stretch;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%;align-self:center}:host(.layout-stack--fill):not(.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap;justify-content:flex-start}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;align-self:stretch}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{gap:.45rem .6rem}}\n"] }]
+            args: [{ selector: 'app-layout-stack', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-stack__track\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.layout-stack__track{display:flex;flex-wrap:wrap;width:100%;min-width:0;box-sizing:border-box;align-items:stretch;gap:.5rem .75rem;padding-top:.25rem}:host(.layout-stack--dir-column) .layout-stack__track{flex-direction:column;flex-wrap:nowrap;align-items:stretch}:host(.layout-stack--align-start) .layout-stack__track{justify-content:flex-start}:host(.layout-stack--align-center) .layout-stack__track{justify-content:center}:host(.layout-stack--align-end) .layout-stack__track{justify-content:flex-end}:host(.layout-stack--align-space-between) .layout-stack__track{justify-content:space-between}:host(.layout-stack--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-layout-stack-divider-color, #e8eaed)}:host:not(.layout-stack--fill) .layout-stack__track{align-items:center}:host:not(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:0 0 auto;min-width:0;max-width:100%}:host(.layout-stack--items-stretch) .layout-stack__track{align-items:stretch}:host(.layout-stack--items-start) .layout-stack__track{align-items:flex-start}:host(.layout-stack--items-center) .layout-stack__track{align-items:center}:host(.layout-stack--items-end) .layout-stack__track{align-items:flex-end}:host(.layout-stack--fill:not(.layout-stack--align-space-between)) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill.layout-stack--align-space-between) .layout-stack__track{flex-wrap:nowrap}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>*{flex:1 1 0;min-width:0;max-width:100%;min-height:0;align-self:auto}:host(.layout-stack--fill.layout-stack--dir-column) ::ng-deep .layout-stack__track>*{width:100%}:host(.layout-stack--fill) ::ng-deep .layout-stack__track>.base-button:not(.base-button--full-width){flex:0 0 auto;align-self:center}@media(max-width:39.98rem){:host(.layout-stack--stack-mobile) .layout-stack__track{gap:.45rem .6rem}}\n"] }]
         }], propDecorators: { align: [{
                 type: Input
+            }], direction: [{
+                type: Input
+            }], itemAlign: [{
+                type: Input
             }], stackOnMobile: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -5050,7 +5091,7 @@ class FormActionsComponent {
         return parts.join(' ');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: FormActionsComponent, isStandalone: true, selector: "app-form-actions", inputs: { align: "align", stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute], fill: ["fill", "fill", booleanAttribute], divider: ["divider", "divider", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<app-layout-stack\n  class=\"form-actions__stack\"\n  [align]=\"layoutAlign\"\n  [stackOnMobile]=\"stackOnMobile\"\n  [stackFill]=\"fill\"\n  [stackDivider]=\"false\"\n>\n  <ng-content />\n</app-layout-stack>\n", styles: [":host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-actions__stack{display:block;width:100%;min-width:0;box-sizing:border-box}:host(.form-actions--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-form-actions-divider-color, #e8eaed)}\n"], dependencies: [{ kind: "component", type: LayoutStackComponent, selector: "app-layout-stack", inputs: ["align", "stackOnMobile", "stackDivider", "stackFill"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: FormActionsComponent, isStandalone: true, selector: "app-form-actions", inputs: { align: "align", stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute], fill: ["fill", "fill", booleanAttribute], divider: ["divider", "divider", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<app-layout-stack\n  class=\"form-actions__stack\"\n  [align]=\"layoutAlign\"\n  [stackOnMobile]=\"stackOnMobile\"\n  [stackFill]=\"fill\"\n  [stackDivider]=\"false\"\n>\n  <ng-content />\n</app-layout-stack>\n", styles: [":host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-actions__stack{display:block;width:100%;min-width:0;box-sizing:border-box}:host(.form-actions--divider){margin-top:.25rem;padding-top:1rem;border-top:1px solid var(--ui-form-actions-divider-color, #e8eaed)}\n"], dependencies: [{ kind: "component", type: LayoutStackComponent, selector: "app-layout-stack", inputs: ["align", "direction", "itemAlign", "stackOnMobile", "stackDivider", "stackFill"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormActionsComponent, decorators: [{
             type: Component,
@@ -5652,12 +5693,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 args: ['class']
             }] } });
 
+/**
+ * Grelha de formulário: com `app-form-col` usa 12 trilhos; **sem** `app-form-col`, os filhos
+ * directos repartem a largura em colunas iguais (comportamento por omissão).
+ */
 class FormRowComponent {
     constructor() {
         this.gap = FormLayoutGap.Md;
         this.align = FormRowAlign.Stretch;
         this.justify = FormRowJustify.Start;
-        /** Filhos sem `app-form-col` ocupam a linha inteira; `app-form-col` com `[grow]` preenche o espaço restante na grelha. */
+        /**
+         * Quando `true`, cada filho que **não** é `app-form-col` ocupa uma linha inteira da grelha
+         * (`grid-column: 1 / -1`). Sem `grow`, campos soltos já dividem a linha em partes iguais.
+         */
         this.grow = false;
         this.wrap = true;
         this.stackOnMobile = true;
@@ -5681,11 +5729,11 @@ class FormRowComponent {
         return parts.join(' ');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: FormRowComponent, isStandalone: true, selector: "app-form-row", inputs: { gap: "gap", align: "align", justify: "justify", grow: ["grow", "grow", booleanAttribute], wrap: ["wrap", "wrap", booleanAttribute], stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"form-row__grid\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-row__grid{display:grid;width:100%;min-width:0;box-sizing:border-box;grid-template-columns:repeat(12,minmax(0,1fr));align-items:stretch}:host(.form-row--gap-xs) .form-row__grid{gap:.35rem .5rem}:host(.form-row--gap-sm) .form-row__grid{gap:.5rem .75rem}:host(.form-row--gap-md) .form-row__grid{gap:.75rem 1.25rem}:host(.form-row--gap-lg) .form-row__grid{gap:1rem 1.5rem}:host(.form-row--grow) .form-row__grid>:not(app-form-col){min-width:0;grid-column:1/-1}:host(.form-row--align-start) .form-row__grid{align-items:start}:host(.form-row--align-center) .form-row__grid{align-items:center}:host(.form-row--align-end) .form-row__grid{align-items:end}:host(.form-row--align-stretch) .form-row__grid{align-items:stretch}:host(.form-row--justify-start) .form-row__grid{justify-items:stretch;justify-content:start}:host(.form-row--justify-center) .form-row__grid{justify-content:center}:host(.form-row--justify-end) .form-row__grid{justify-content:end}:host(.form-row--justify-between) .form-row__grid{justify-content:space-between}@media(max-width:39.98rem){:host(.form-row--stack-mobile) .form-row__grid{grid-template-columns:1fr}:host(.form-row--stack-mobile) .form-row__grid ::ng-deep>app-form-col{grid-column:1/-1!important}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.2.9", type: FormRowComponent, isStandalone: true, selector: "app-form-row", inputs: { gap: "gap", align: "align", justify: "justify", grow: ["grow", "grow", booleanAttribute], wrap: ["wrap", "wrap", booleanAttribute], stackOnMobile: ["stackOnMobile", "stackOnMobile", booleanAttribute] }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<div class=\"form-row__grid\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-row__grid{display:grid;width:100%;min-width:0;box-sizing:border-box;grid-template-columns:repeat(12,minmax(0,1fr));align-items:stretch}.form-row__grid:not(:has(>app-form-col)){grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.form-row__grid:not(:has(>app-form-col))>*{min-width:0}:host(.form-row--gap-xs) .form-row__grid{gap:.35rem .5rem}:host(.form-row--gap-sm) .form-row__grid{gap:.5rem .75rem}:host(.form-row--gap-md) .form-row__grid{gap:.75rem 1.25rem}:host(.form-row--gap-lg) .form-row__grid{gap:1rem 1.5rem}:host(.form-row--grow) .form-row__grid>:not(app-form-col){min-width:0;grid-column:1/-1}:host(.form-row--align-start) .form-row__grid{align-items:start}:host(.form-row--align-center) .form-row__grid{align-items:center}:host(.form-row--align-end) .form-row__grid{align-items:end}:host(.form-row--align-stretch) .form-row__grid{align-items:stretch}:host(.form-row--justify-start) .form-row__grid{justify-items:stretch;justify-content:start}:host(.form-row--justify-center) .form-row__grid{justify-content:center}:host(.form-row--justify-end) .form-row__grid{justify-content:end}:host(.form-row--justify-between) .form-row__grid{justify-content:space-between}@media(max-width:39.98rem){:host(.form-row--stack-mobile) .form-row__grid{grid-template-columns:1fr}:host(.form-row--stack-mobile) .form-row__grid ::ng-deep>app-form-col{grid-column:1/-1!important}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: FormRowComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-form-row', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-row__grid\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-row__grid{display:grid;width:100%;min-width:0;box-sizing:border-box;grid-template-columns:repeat(12,minmax(0,1fr));align-items:stretch}:host(.form-row--gap-xs) .form-row__grid{gap:.35rem .5rem}:host(.form-row--gap-sm) .form-row__grid{gap:.5rem .75rem}:host(.form-row--gap-md) .form-row__grid{gap:.75rem 1.25rem}:host(.form-row--gap-lg) .form-row__grid{gap:1rem 1.5rem}:host(.form-row--grow) .form-row__grid>:not(app-form-col){min-width:0;grid-column:1/-1}:host(.form-row--align-start) .form-row__grid{align-items:start}:host(.form-row--align-center) .form-row__grid{align-items:center}:host(.form-row--align-end) .form-row__grid{align-items:end}:host(.form-row--align-stretch) .form-row__grid{align-items:stretch}:host(.form-row--justify-start) .form-row__grid{justify-items:stretch;justify-content:start}:host(.form-row--justify-center) .form-row__grid{justify-content:center}:host(.form-row--justify-end) .form-row__grid{justify-content:end}:host(.form-row--justify-between) .form-row__grid{justify-content:space-between}@media(max-width:39.98rem){:host(.form-row--stack-mobile) .form-row__grid{grid-template-columns:1fr}:host(.form-row--stack-mobile) .form-row__grid ::ng-deep>app-form-col{grid-column:1/-1!important}}\n"] }]
+            args: [{ selector: 'app-form-row', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-row__grid\">\r\n  <ng-content />\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block;width:100%;min-width:0;box-sizing:border-box}.form-row__grid{display:grid;width:100%;min-width:0;box-sizing:border-box;grid-template-columns:repeat(12,minmax(0,1fr));align-items:stretch}.form-row__grid:not(:has(>app-form-col)){grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.form-row__grid:not(:has(>app-form-col))>*{min-width:0}:host(.form-row--gap-xs) .form-row__grid{gap:.35rem .5rem}:host(.form-row--gap-sm) .form-row__grid{gap:.5rem .75rem}:host(.form-row--gap-md) .form-row__grid{gap:.75rem 1.25rem}:host(.form-row--gap-lg) .form-row__grid{gap:1rem 1.5rem}:host(.form-row--grow) .form-row__grid>:not(app-form-col){min-width:0;grid-column:1/-1}:host(.form-row--align-start) .form-row__grid{align-items:start}:host(.form-row--align-center) .form-row__grid{align-items:center}:host(.form-row--align-end) .form-row__grid{align-items:end}:host(.form-row--align-stretch) .form-row__grid{align-items:stretch}:host(.form-row--justify-start) .form-row__grid{justify-items:stretch;justify-content:start}:host(.form-row--justify-center) .form-row__grid{justify-content:center}:host(.form-row--justify-end) .form-row__grid{justify-content:end}:host(.form-row--justify-between) .form-row__grid{justify-content:space-between}@media(max-width:39.98rem){:host(.form-row--stack-mobile) .form-row__grid{grid-template-columns:1fr}:host(.form-row--stack-mobile) .form-row__grid ::ng-deep>app-form-col{grid-column:1/-1!important}}\n"] }]
         }], propDecorators: { gap: [{
                 type: Input
             }], align: [{
@@ -9011,5 +9059,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ADAPTIVE_DATA_VIEW_MOBILE_QUERY, APP_SIDEBAR_LABEL_REVEAL_LAG_MS, APP_SIDEBAR_LAYOUT_DURATION_MS, APP_SIDEBAR_NAV_REVEAL_TOTAL_MS, APP_THEME_IDS, ActionMenuComponent, AdaptiveDataViewComponent, AnchoredOverlayComponent, AppBreadcrumbComponent, AppDialogComponent, AppLibLightBlockScrollStrategy, AppShellComponent, AppShellSidebarTemplateDirective, AppShellSidebarToggleComponent, AppSidebarComponent, AppSidebarToolbarDirective, AppThemeService, AppTopbarComponent, AppUserMenuComponent, BR_ESTADOS_NOME_SIGLA, BaseButtonComponent, BaseButtonType, BaseButtonVariant, BaseFieldComponent, BaseFieldDirective, BooleanFieldDirective, CardListComponent, CepFieldComponent, CheckboxFieldComponent, ConfirmDialogComponent, ConfirmDialogService, ContextMenuComponent, CpfCnpjFieldComponent, DashboardSectionComponent, DataCardComponent, DataGridComponent, DataListComponent, DataToolbarComponent, DateFieldComponent, DecimalFieldComponent, DetailsFieldComponent, DetailsViewComponent, DialogFooterDirective, DrawerComponent, DrawerSide, DrawerSize, DropdownBaseComponent, DropdownMenuComponent, DropdownMultiOptionFieldBase, DropdownOptionFieldBase, DropdownSearchFieldComponent, EmptyStateComponent, FormActionsAlign, FormActionsComponent, FormColComponent, FormGroupComponent, FormGroupVariant, FormLayoutGap, FormRowAlign, FormRowComponent, FormRowJustify, FormSectionComponent, FormTabComponent, FormTabsComponent, InputMaskFieldComponent, IntegerFieldComponent, LayoutStackAlign, LayoutStackComponent, LibDialogSize, ListItemComponent, LoadingDialogComponent, LoadingDialogService, MaskedTextFieldBase, MenuDividerComponent, MenuDropdownPlacement, MenuGroupComponent, MenuListComponent, MultiselectFieldComponent, NgControlFieldDirective, OverlayPlacement, PasswordFieldComponent, PhoneFieldComponent, PopoverBodyTemplateDirective, PopoverComponent, PopoverFooterTemplateDirective, PopoverTriggerDirective, STRUCTRA_UI, SelectFieldComponent, SkeletonBlockComponent, SkeletonCardComponent, SkeletonFieldShellComponent, SkeletonListComponent, SkeletonTableComponent, SkeletonTextComponent, StatCardComponent, StatusBadgeComponent, SwitchFieldComponent, TableEmptyStateComponent, TableToolbarComponent, TextFieldComponent, TextareaFieldComponent, ToastHostComponent, ToastService, TooltipComponent, TooltipPanelTemplateDirective, ValidationSummaryComponent, anchoredOverlayPositions, applyPickedCalendarDate, buildDecimalBrDisplay, buildDecimalBrParseString, buildEmptyStateOverlayHtml, caretIndexFromIntegerDigitCount, caretIndexFromSemantic, cepMaskCompleteValidator, cpfCnpjMaskCompleteValidator, escapeHtml, extractDecimalBrParts, fixedDigitsMaskCompleteValidator, formatDateTimePtBr, formatDecimalBr, formatIntegerThousandsBr, formatMaskDigits, formatUiFieldDateValue, libDialogPanelClasses, mapEstadosToOptions, maskDigitCount, normalizeFormDateValue, parseDecimalBr, parseIntegerString, parseUiFieldDateValue, phoneBrMaskCompleteValidator, resolveControlAtPath, sanitizeDecimalBrInput, sanitizeIntegerDigits, sectionHasVisibleInvalid, semanticCaretAt, semanticIntegerDigitCountLeft, stripToDigits, subscribeMarkForCheckOnInvalidUiRefresh, subtreeHasVisibleInvalid };
+export { ADAPTIVE_DATA_VIEW_MOBILE_QUERY, APP_SIDEBAR_LABEL_REVEAL_LAG_MS, APP_SIDEBAR_LAYOUT_DURATION_MS, APP_SIDEBAR_NAV_REVEAL_TOTAL_MS, APP_THEME_IDS, ActionMenuComponent, AdaptiveDataViewComponent, AnchoredOverlayComponent, AppBreadcrumbComponent, AppDialogComponent, AppLibLightBlockScrollStrategy, AppShellComponent, AppShellSidebarTemplateDirective, AppShellSidebarToggleComponent, AppSidebarComponent, AppSidebarToolbarDirective, AppThemeService, AppTopbarComponent, AppUserMenuComponent, BR_ESTADOS_NOME_SIGLA, BaseButtonComponent, BaseButtonType, BaseButtonVariant, BaseFieldComponent, BaseFieldDirective, BooleanFieldDirective, CardListComponent, CepFieldComponent, CheckboxFieldComponent, ConfirmDialogComponent, ConfirmDialogService, ContextMenuComponent, CpfCnpjFieldComponent, DashboardSectionComponent, DataCardComponent, DataGridComponent, DataListComponent, DataToolbarComponent, DateFieldComponent, DecimalFieldComponent, DetailsFieldComponent, DetailsViewComponent, DialogFooterDirective, DrawerComponent, DrawerSide, DrawerSize, DropdownBaseComponent, DropdownMenuComponent, DropdownMultiOptionFieldBase, DropdownOptionFieldBase, DropdownSearchFieldComponent, EmptyStateComponent, FormActionsAlign, FormActionsComponent, FormColComponent, FormGroupComponent, FormGroupVariant, FormLayoutGap, FormRowAlign, FormRowComponent, FormRowJustify, FormSectionComponent, FormTabComponent, FormTabsComponent, InputMaskFieldComponent, IntegerFieldComponent, LayoutStackAlign, LayoutStackComponent, LayoutStackDirection, LayoutStackItemAlign, LibDialogSize, ListItemComponent, LoadingDialogComponent, LoadingDialogService, MaskedTextFieldBase, MenuDividerComponent, MenuDropdownPlacement, MenuGroupComponent, MenuListComponent, MultiselectFieldComponent, NgControlFieldDirective, OverlayPlacement, PasswordFieldComponent, PhoneFieldComponent, PopoverBodyTemplateDirective, PopoverComponent, PopoverFooterTemplateDirective, PopoverTriggerDirective, STRUCTRA_UI, SelectFieldComponent, SkeletonBlockComponent, SkeletonCardComponent, SkeletonFieldShellComponent, SkeletonListComponent, SkeletonTableComponent, SkeletonTextComponent, StatCardComponent, StatusBadgeComponent, SwitchFieldComponent, TableEmptyStateComponent, TableToolbarComponent, TextFieldComponent, TextareaFieldComponent, ToastHostComponent, ToastService, TooltipComponent, TooltipPanelTemplateDirective, ValidationSummaryComponent, anchoredOverlayPositions, applyPickedCalendarDate, buildDecimalBrDisplay, buildDecimalBrParseString, buildEmptyStateOverlayHtml, caretIndexFromIntegerDigitCount, caretIndexFromSemantic, cepMaskCompleteValidator, cpfCnpjMaskCompleteValidator, escapeHtml, extractDecimalBrParts, fixedDigitsMaskCompleteValidator, formatDateTimePtBr, formatDecimalBr, formatIntegerThousandsBr, formatMaskDigits, formatUiFieldDateValue, libDialogPanelClasses, mapEstadosToOptions, maskDigitCount, normalizeFormDateValue, parseDecimalBr, parseIntegerString, parseUiFieldDateValue, phoneBrMaskCompleteValidator, resolveControlAtPath, sanitizeDecimalBrInput, sanitizeIntegerDigits, sectionHasVisibleInvalid, semanticCaretAt, semanticIntegerDigitCountLeft, stripToDigits, subscribeMarkForCheckOnInvalidUiRefresh, subtreeHasVisibleInvalid };
 //# sourceMappingURL=structra-ui.mjs.map