@akcelik/strct 3.1.1 → 4.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akcelik/strct",
-  "version": "3.1.1",
+  "version": "4.1.0",
   "description": "UIStruct — a standalone Angular component library with a tokenised, multi-palette theme system, built for datacenter / infrastructure management UIs.",
   "author": "Serkan Akcelik <serkan.akcelik@gmail.com>",
   "license": "MIT",

package/types/akcelik-strct.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { OnDestroy, ElementRef, InjectionToken, Provider, TemplateRef, PipeTransform } from '@angular/core';
+import { OnDestroy, TemplateRef, ElementRef, InjectionToken, Provider, PipeTransform } from '@angular/core';
 import { SafeHtml, SafeStyle } from '@angular/platform-browser';
 import { ControlValueAccessor } from '@angular/forms';
 import * as _akcelik_strct from '@akcelik/strct';
@@ -1179,6 +1179,23 @@ declare class StrctTree {
 
 /** Fixed modal width presets: sm 480 · md 640 · lg 860 · xl 1080 (px). */
 type StrctModalSize = 'sm' | 'md' | 'lg' | 'xl';
+/**
+ * Lazily rendered modal body. Plain projected content is created by the PARENT
+ * with the parent's own view, so it is instantiated — and costs — even while
+ * the modal is closed. Content inside this template is created only while the
+ * modal is open, and destroyed when it closes (state does not survive a close):
+ *
+ *   <strct-modal [(open)]="show" title="Import hosts">
+ *     <ng-template strctModalContent>
+ *       <strct-datagrid [rows]="hosts" … />
+ *     </ng-template>
+ *   </strct-modal>
+ */
+declare class StrctModalContent {
+    readonly template: TemplateRef<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctModalContent, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StrctModalContent, "[strctModalContent]", never, {}, {}, never, never, true, never>;
+}
 /**
  * Overlay dialog with two-way `open`:
  *   <strct-modal [(open)]="show" title="Confirm">
@@ -1195,7 +1212,8 @@ declare class StrctModal {
     readonly open: _angular_core.ModelSignal<boolean>;
     /** Dialog title. */
     readonly title: _angular_core.InputSignal<string>;
-    /** Size variant (fixed scale; defaults to `sm` = 480px). */
+    /** Size variant (fixed scale; defaults to `sm` = 480px). Ignored by
+     *  `chromeless`, which sizes from the wizard it hosts. */
     readonly size: _angular_core.InputSignal<StrctModalSize>;
     /** Hide the footer slot. */
     readonly hideFooter: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -1204,6 +1222,11 @@ declare class StrctModal {
      * content (a `flush` vertical wizard) is the dialog surface. `title` still
      * names the dialog for assistive tech; backdrop/Escape dismissal follow
      * `dismissible` as usual.
+     *
+     * The dialog's width comes from the wizard's geometry, not from `size`:
+     * rail + `--strct-wiz-content-min` (default 864px) [+ aside]. To change it,
+     * set that variable on this `strct-modal` or an ancestor — the dialog reads
+     * it on itself, so setting it on the `strct-wizard` inside does not reach it.
      */
     readonly chromeless: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Accessible label of the X close button (localizable). */
@@ -1225,6 +1248,9 @@ declare class StrctModal {
     readonly variant: _angular_core.InputSignal<"solid" | "glass">;
     /** Emitted when the alert is dismissed. */
     readonly closed: _angular_core.OutputEmitterRef<void>;
+    /** Lazily rendered body, if one is provided (see {@link StrctModalContent}). */
+    protected readonly lazyContent: _angular_core.Signal<StrctModalContent | undefined>;
+    private readonly sizeDiagnostic;
     protected readonly titleId: string;
     /** Element that had focus before the dialog opened, restored on close. */
     private previousActive;
@@ -1248,7 +1274,7 @@ declare class StrctModal {
     private focusable;
     private focusInitial;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctModal, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctModal, "strct-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hideFooter": { "alias": "hideFooter"; "required": false; "isSignal": true; }; "chromeless": { "alias": "chromeless"; "required": false; "isSignal": true; }; "closeLabel": { "alias": "closeLabel"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "draggable": { "alias": "draggable"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "backdropClass": { "alias": "backdropClass"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, never, ["*", "[strctModalFooter]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctModal, "strct-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hideFooter": { "alias": "hideFooter"; "required": false; "isSignal": true; }; "chromeless": { "alias": "chromeless"; "required": false; "isSignal": true; }; "closeLabel": { "alias": "closeLabel"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "draggable": { "alias": "draggable"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "backdropClass": { "alias": "backdropClass"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, ["lazyContent"], ["*", "[strctModalFooter]"], true, never>;
 }
 
 /** Marks the drawer's footer action area: `<ng-container strctDrawerFooter>…`. */
@@ -1556,7 +1582,10 @@ declare class StrctWizard {
      * ~720px of component width — it never flips horizontal.
      *
      * The default can be flipped app-wide via `provideStrctWizardDefaults`;
-     * this input always wins when bound.
+     * this input always wins when bound. **Tests:** a spec that renders a
+     * component using `strct-wizard` must provide the same defaults the app
+     * does, or it renders the horizontal layout — a different DOM, no rail,
+     * no title.
      */
     readonly vertical: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
@@ -1566,7 +1595,8 @@ declare class StrctWizard {
      * Size the host with width/height only; do not override its `display`.
      */
     readonly flush: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    /** Rail heading shown above the progress bar (vertical mode). */
+    /** Rail heading shown above the progress bar. Vertical mode only — the
+     *  horizontal layout has no title band (a dev-mode warning says so). */
     readonly title: _angular_core.InputSignal<string>;
     /**
      * Name the content pane after the active step (vertical mode): the step's
@@ -1605,6 +1635,8 @@ declare class StrctWizard {
     /** Whether the current step permits advancing (its `canAdvance`). */
     protected readonly canAdvance: _angular_core.Signal<boolean>;
     constructor();
+    /** Dev-mode warnings for inputs the current layout silently ignores. */
+    private diagnose;
     next(): void;
     back(): void;
     /** Jump to a visited step (rail click). Forward moves still go through Next. */
@@ -3004,8 +3036,12 @@ interface StrctColumn {
 type StrctRow = Record<string, unknown>;
 /** Context passed to a per-column cell template. */
 interface StrctCellContext {
-    /** The row object. */
+    /** The row object — `let-row`. */
     $implicit: StrctRow;
+    /** The row object again, by name — so `let-row="row"` works too. Without it
+     *  that spelling bound `undefined` silently, because `value` and `column`
+     *  ARE named properties and `row` looked like one of them. */
+    row: StrctRow;
     /** The raw value for this column (`row[column.key]`). */
     value: unknown;
     /** The column definition. */
@@ -3015,7 +3051,7 @@ interface StrctCellContext {
  * Per-column cell template for `strct-table` / `strct-datagrid`. The column key
  * is the directive value; the row, value and column are the template context:
  *
- *   <ng-template strctCell="status" let-row let-value="value">
+ *   <ng-template strctCell="status" let-row let-value="value">   (let-row="row" also works)
  *     <strct-badge [status]="row['success'] ? 'success' : 'critical'">{{ value }}</strct-badge>
  *   </ng-template>
  */
@@ -3142,7 +3178,7 @@ interface DgItem {
 }
 /**
  * Marks the expandable-row detail template. The row is the template's implicit
- * context: `<ng-template strctRowDetail let-row> … {{ row['name'] }} … </ng-template>`.
+ * context (`let-row`, or `let-row="row"`): `<ng-template strctRowDetail let-row> … {{ row['name'] }} … </ng-template>`.
  */
 declare class StrctRowDetailDef {
     readonly template: TemplateRef<any>;
@@ -3470,6 +3506,8 @@ declare class StrctDatagrid {
     private readonly selectionRows;
     protected readonly allPageSelected: _angular_core.Signal<boolean>;
     protected readonly somePageSelected: _angular_core.Signal<boolean>;
+    /** Dev-mode check that row identities can do their job (see util/dev-warn). */
+    private diagnoseIdentity;
     /** Resolve a row's stable identity: its `rowId` value, or the row object
      *  itself when there is no `rowId` or it resolves to null/undefined. */
     private idOf;
@@ -5786,5 +5824,5 @@ declare class StrctHeatmap {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctHeatmap, "strct-heatmap", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "cols": { "alias": "cols"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "summaryFormat": { "alias": "summaryFormat"; "required": false; "isSignal": true; }; "cellHeight": { "alias": "cellHeight"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "rowLabelWidth": { "alias": "rowLabelWidth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-export { FOCUSABLE_SELECTOR, STRCT_DP_DOW, STRCT_DP_DOW_FULL, STRCT_DP_MONTHS, STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_ICON_NAMES, STRCT_MASKS, STRCT_NOTIFICATION_HISTORY_LIMIT, STRCT_PALETTES, STRCT_RAW_ICONS, STRCT_TIME_RANGE_PRESETS, STRCT_WIZARD_DEFAULTS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAnnouncer, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctBytesPipe, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCascadeColumn, StrctCascadeHost, StrctCascadeSelect, StrctCellDef, StrctCellStatus, StrctChart, StrctCheckbox, StrctChips, StrctCode, StrctColorPicker, StrctCombobox, StrctCommandPalette, StrctConfirmOutlet, StrctConfirmService, StrctContextMenu, StrctContextMenuTrigger, StrctCopy, StrctDatagrid, StrctDatagridActionBar, StrctDatepicker, StrctDatetimePicker, StrctDesc, StrctDescriptionList, StrctDiff, StrctDivider, StrctDonut, StrctDrawer, StrctDrawerFooter, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctDropdownTrigger, StrctDurationPipe, StrctEmptyState, StrctField, StrctFile, StrctFilterBar, StrctFlow, StrctFooter, StrctGauge, StrctHeader, StrctHeatmap, StrctHero, StrctHotkeysHelp, StrctHotkeysService, StrctIcon, StrctInlineEdit, StrctInput, StrctInputMask, StrctInputOtp, StrctKbd, StrctKnob, StrctLogViewer, StrctLogin, StrctMenuPanel, StrctMenuService, StrctMenubar, StrctMetricTile, StrctModal, StrctNav, StrctNavItem, StrctNotificationCenter, StrctNumber, StrctOverlay, StrctPageHeader, StrctPageHeaderActions, StrctPageHeaderCrumbs, StrctPagination, StrctPassword, StrctPopover, StrctPopoverTrigger, StrctProgress, StrctRadio, StrctRadioGroup, StrctRail, StrctRange, StrctRatePipe, StrctRating, StrctReorder, StrctReorderItem, StrctRowDetailDef, StrctSearchbox, StrctSectionMenu, StrctSegmented, StrctSelect, StrctShell, StrctShellService, StrctSiPipe, StrctSignpost, StrctSignpostTrigger, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctSplitButton, StrctSplitter, StrctStack, StrctStackItem, StrctStatusDot, StrctStep, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctThemeService, StrctThemeSwitcher, StrctTimeRangePicker, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctToolbar, StrctToolbarSpacer, StrctTooltip, StrctTour, StrctTransfer, StrctTree, StrctTreeNode, StrctTreeSelect, StrctVerticalNav, StrctWatermark, StrctWizard, StrctWizardAside, focusFirstIn, keepTabInside, lockBodyScroll, parseAnsi, provideStrctWizardDefaults, registerStrctIcon, restoreFocus, saveFocusedElement, strctComputeDiff, strctDpPad, strctFormatBytes, strctFormatDuration, strctFormatRate, strctFormatSi, strctValidationIcon, strctValidationTone, unlockBodyScroll };
+export { FOCUSABLE_SELECTOR, STRCT_DP_DOW, STRCT_DP_DOW_FULL, STRCT_DP_MONTHS, STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_ICON_NAMES, STRCT_MASKS, STRCT_NOTIFICATION_HISTORY_LIMIT, STRCT_PALETTES, STRCT_RAW_ICONS, STRCT_TIME_RANGE_PRESETS, STRCT_WIZARD_DEFAULTS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAnnouncer, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctBytesPipe, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCascadeColumn, StrctCascadeHost, StrctCascadeSelect, StrctCellDef, StrctCellStatus, StrctChart, StrctCheckbox, StrctChips, StrctCode, StrctColorPicker, StrctCombobox, StrctCommandPalette, StrctConfirmOutlet, StrctConfirmService, StrctContextMenu, StrctContextMenuTrigger, StrctCopy, StrctDatagrid, StrctDatagridActionBar, StrctDatepicker, StrctDatetimePicker, StrctDesc, StrctDescriptionList, StrctDiff, StrctDivider, StrctDonut, StrctDrawer, StrctDrawerFooter, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctDropdownTrigger, StrctDurationPipe, StrctEmptyState, StrctField, StrctFile, StrctFilterBar, StrctFlow, StrctFooter, StrctGauge, StrctHeader, StrctHeatmap, StrctHero, StrctHotkeysHelp, StrctHotkeysService, StrctIcon, StrctInlineEdit, StrctInput, StrctInputMask, StrctInputOtp, StrctKbd, StrctKnob, StrctLogViewer, StrctLogin, StrctMenuPanel, StrctMenuService, StrctMenubar, StrctMetricTile, StrctModal, StrctModalContent, StrctNav, StrctNavItem, StrctNotificationCenter, StrctNumber, StrctOverlay, StrctPageHeader, StrctPageHeaderActions, StrctPageHeaderCrumbs, StrctPagination, StrctPassword, StrctPopover, StrctPopoverTrigger, StrctProgress, StrctRadio, StrctRadioGroup, StrctRail, StrctRange, StrctRatePipe, StrctRating, StrctReorder, StrctReorderItem, StrctRowDetailDef, StrctSearchbox, StrctSectionMenu, StrctSegmented, StrctSelect, StrctShell, StrctShellService, StrctSiPipe, StrctSignpost, StrctSignpostTrigger, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctSplitButton, StrctSplitter, StrctStack, StrctStackItem, StrctStatusDot, StrctStep, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctThemeService, StrctThemeSwitcher, StrctTimeRangePicker, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctToolbar, StrctToolbarSpacer, StrctTooltip, StrctTour, StrctTransfer, StrctTree, StrctTreeNode, StrctTreeSelect, StrctVerticalNav, StrctWatermark, StrctWizard, StrctWizardAside, focusFirstIn, keepTabInside, lockBodyScroll, parseAnsi, provideStrctWizardDefaults, registerStrctIcon, restoreFocus, saveFocusedElement, strctComputeDiff, strctDpPad, strctFormatBytes, strctFormatDuration, strctFormatRate, strctFormatSi, strctValidationIcon, strctValidationTone, unlockBodyScroll };
 export type { StrctAlertType, StrctAvatarSize, StrctAvatarStatus, StrctBadgeStatus, StrctButtonSize, StrctButtonVariant, StrctCascadeOption, StrctCellContext, StrctChartAnnotation, StrctChartColor, StrctChartCurve, StrctChartSeries, StrctChartSlot, StrctChartStatus, StrctChartSummaryInfo, StrctChartThreshold, StrctChartType, StrctColumn, StrctCommandItem, StrctConfirmOptions, StrctConfirmTone, StrctDatagridColumn, StrctDatagridColumnState, StrctDatagridFilters, StrctDatagridLabels, StrctDatagridLazyState, StrctDescAlign, StrctDescItem, StrctDiffRow, StrctDonutSegment, StrctDrawerSide, StrctDrawerSize, StrctEmptyVariant, StrctFilterChip, StrctFlowDirection, StrctFlowNode, StrctFlowOrientation, StrctHeatmapCell, StrctHeatmapSummaryInfo, StrctHotkey, StrctIconBadge, StrctIconName, StrctKnobStatus, StrctLogLine, StrctMenuItem, StrctMenuLink, StrctMenuOpenOptions, StrctMenuSection, StrctMenubarItem, StrctMetricStatus, StrctModalSize, StrctMode, StrctNotification, StrctOption, StrctOverlayPlacement, StrctPalette, StrctPaletteInfo, StrctProgressStatus, StrctRailItem, StrctRailStatus, StrctReorderEvent, StrctRow, StrctRowId, StrctSegmentedOption, StrctSegmentedSize, StrctSignpostPosition, StrctSpeedDialDirection, StrctSpinnerSize, StrctStatus, StrctStatusDotSize, StrctTagStatus, StrctThresholds, StrctTimeRange, StrctTimeRangePreset, StrctTimelineState, StrctToast, StrctToastOptions, StrctToastType, StrctTooltipPosition, StrctTourStep, StrctTransferItem, StrctTreeMenuEvent, StrctTreeNodeData, StrctTreeNodeMenuFn, StrctValidationState, StrctValidationStatus, StrctWizardDefaults };