structra-ui 0.1.46 → 0.1.48

package/fesm2022/structra-ui.mjs

@@ -4958,12 +4958,23 @@ 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). */
+/**
+ * Eixo principal do flex em `app-layout-stack` (equivalente a `flex-direction` em CSS).
+ *
+ * - **`Row`** — `flex-direction: row`: filhos **lado a lado** na horizontal (é o que se costuma
+ *   querer para “várias colunas” no ecrã ou `form-row` + `form-col` na mesma linha).
+ * - **`Column`** — `flex-direction: column`: filhos **uns por baixo dos outros** (pilha vertical).
+ *   **Não** é “colunas de grelha” ao lado uma da outra; para isso use **`Row`**.
+ */
 var LayoutStackDirection;
 (function (LayoutStackDirection) {
     LayoutStackDirection["Row"] = "row";
     LayoutStackDirection["Column"] = "column";
 })(LayoutStackDirection || (LayoutStackDirection = {}));
+/** Alias legível: blocos lado a lado (= `LayoutStackDirection.Row`). */
+const LAYOUT_STACK_SIDE_BY_SIDE = LayoutStackDirection.Row;
+/** Alias legível: pilha vertical (= `LayoutStackDirection.Column`). */
+const LAYOUT_STACK_STACKED = LayoutStackDirection.Column;
 /** Alinhamento no eixo cruzado (`align-items` em `row`; largura/centragem em `column`). */
 var LayoutStackItemAlign;
 (function (LayoutStackItemAlign) {
@@ -4986,7 +4997,10 @@ var FormActionsAlign;
  *
  * - `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).
+ * - `direction` — igual a `flex-direction` em CSS:
+ *   - **`Row`** = filhos **na horizontal** (lado a lado). Use para “colunas” no ecrã ou `form-row` + `form-col` na mesma linha.
+ *   - **`Column`** = filhos **empilhados** (um por baixo do outro). **Não** coloca “colunas” lado a lado; para isso use **`Row`**.
+ *   Constantes: `LAYOUT_STACK_SIDE_BY_SIDE` e `LAYOUT_STACK_STACKED` no barrel `form-layout`.
  * - `itemAlign` — eixo cruzado (`align-items` em `row`: topo/meio/baixo; em `column`: alinhamento horizontal dos blocos).
  */
 class LayoutStackComponent {
@@ -4994,7 +5008,7 @@ class LayoutStackComponent {
         /** 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`).
+         * `Row` = lado a lado (horizontal). `Column` = pilha vertical (um por baixo do outro), **não** “várias colunas” no ecrã.
          */
         this.direction = LayoutStackDirection.Row;
         /**
@@ -5010,8 +5024,9 @@ class LayoutStackComponent {
         /** Linha separadora acima da faixa. Nome explícito para evitar colisão com o esquema DOM em templates aninhados. */
         this.stackDivider = false;
         /**
-         * Quando `true` (por defeito), os filhos repartem a largura da faixa (ex.: um botão a 100%;
-         * vários com `flex` igual). Use `false` para faixas compactas (largura intrínseca).
+         * Quando `true` (por defeito), em **`Row`** os filhos repartem a **largura** (`flex: 1`).
+         * Em **`Column`**, o preenchimento é só **largura total** (empilhamento natural de altura);
+         * não se usa `flex-grow` na vertical para evitar colapso / sobreposição.
          */
         this.stackFill = true;
     }
@@ -5036,11 +5051,11 @@ 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", 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 }); }
+    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>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;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 }); }
 }
 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--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"] }]
+            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>*{flex:0 0 auto;min-height:min-content;min-width:0;width:100%;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"] }]
         }], propDecorators: { align: [{
                 type: Input
             }], direction: [{
@@ -9059,5 +9074,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, 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 };
+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, LAYOUT_STACK_SIDE_BY_SIDE, LAYOUT_STACK_STACKED, 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