@foxeltech/angular-ui 0.7.124 → 0.7.133

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@foxeltech/angular-ui",
-  "version": "0.7.124",
+  "version": "0.7.133",
   "license": "MIT",
   "publishConfig": {
     "access": "public"

package/src/lib/styles/components.css

@@ -361,11 +361,12 @@ input[type='password'] {
     inset 0 0 0 1px rgb(0 0 0 / 0.08),
     0 1px 2px rgb(0 0 0 / 0.12);
 }
-/* Icon-only button (no label): square h-8 × w-8, no side padding, so the
-   glyph sits dead-centre (anh Tú 04/09). Consumers may still size it with
-   utilities (`w-9 h-9`) — those win in the utilities layer. */
+/* Icon-only button (no label): square, no side padding, so the glyph sits
+   dead-centre (anh Tú 04/09). The width tracks `btn-common`'s height — 27px
+   since 17/09 — so it stays square; consumers may still size it with
+   utilities (`w-9 h-9`), which win in the utilities layer. */
 .fx-btn--icon {
-  width: 2rem;
+  width: 27px;
   padding-left: 0;
   padding-right: 0;
 }

package/src/lib/styles/utilities.css

@@ -8,10 +8,15 @@
 }
 
 @utility btn-common {
-  /* Compact size (anh Tú 29/08): h-8 + 13px label — the pre-V2 h-10 read too
-     large against the V2 density. leading-none: arbitrary text-[13px] inherits
-     lh 1.5 and Archivo's uneven leading floats the ink ~1px above center. */
-  @apply flex text-[13px] leading-none h-8 font-semibold px-large py-small items-center justify-center rounded-lg shadow-sm transition-all duration-200 disabled:opacity-50 disabled:pointer-events-none disabled:cursor-not-allowed;
+  /* The demo's `.og-button--sm` (anh Tú 17/09: compact như New Analysis) —
+     27px tall, 11.5px at weight 400, 12px sides, 7px radius. MEASURED off the
+     reference's own `.og-button--sm.bi-newbtn`, which is the topbar CTA: it
+     wore this shape through `!` overrides because the shared button was a size
+     above it. The h-8 / 13px / 600 this replaces was itself a step down from
+     pre-V2 h-10 (29/08); against V2 panel density it still read one notch
+     heavy. leading-none: an arbitrary font-size inherits lh 1.5 and Archivo's
+     uneven leading floats the ink ~1px above centre. */
+  @apply flex text-[length:var(--og-fs-xs)] leading-none h-[27px] font-normal px-[12px] py-[4px] items-center justify-center rounded-control shadow-sm transition-all duration-200 disabled:opacity-50 disabled:pointer-events-none disabled:cursor-not-allowed;
 }
 
 @utility btn-menu-common {

package/src/lib/ui/components/button/button.component.html

@@ -14,229 +14,41 @@
   [disabled]="disabled() || loading()"
   (click)="onClick()"
 >
-  @if (loading()) {
-    <div class="flex w-full items-center justify-center" aria-hidden="true">
-      <svg
-        [attr.fill]="
-          buttonVariant() !== 'alternative' ? 'rgb(var(--text-primary))' : 'rgb(var(--primary))'
-        "
-        width="16"
-        height="16"
-        viewBox="0 0 24 24"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <circle cx="4" cy="12" r="0">
-          <animate
-            begin="0;spinner_z0Or.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="0;3"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_OLMs.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="4;12"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_UHR2.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="12;20"
-            fill="freeze"
-          />
-          <animate
-            id="spinner_lo66"
-            begin="spinner_Aguh.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="3;0"
-            fill="freeze"
-          />
-          <animate
-            id="spinner_z0Or"
-            begin="spinner_lo66.end"
-            attributeName="cx"
-            dur="0.001s"
-            values="20;4"
-            fill="freeze"
-          />
-        </circle>
-        <circle cx="4" cy="12" r="3">
-          <animate
-            begin="0;spinner_z0Or.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="4;12"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_OLMs.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="12;20"
-            fill="freeze"
-          />
-          <animate
-            id="spinner_JsnR"
-            begin="spinner_UHR2.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="3;0"
-            fill="freeze"
-          />
-          <animate
-            id="spinner_Aguh"
-            begin="spinner_JsnR.end"
-            attributeName="cx"
-            dur="0.001s"
-            values="20;4"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_Aguh.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="0;3"
-            fill="freeze"
-          />
-        </circle>
-        <circle cx="12" cy="12" r="3">
-          <animate
-            begin="0;spinner_z0Or.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="12;20"
-            fill="freeze"
-          />
-          <animate
-            id="spinner_hSjk"
-            begin="spinner_OLMs.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="3;0"
-            fill="freeze"
-          />
-          <animate
-            id="spinner_UHR2"
-            begin="spinner_hSjk.end"
-            attributeName="cx"
-            dur="0.001s"
-            values="20;4"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_UHR2.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="0;3"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_Aguh.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="4;12"
-            fill="freeze"
-          />
-        </circle>
-        <circle cx="20" cy="12" r="3">
-          <animate
-            id="spinner_4v5M"
-            begin="0;spinner_z0Or.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="3;0"
-            fill="freeze"
-          />
-          <animate
-            id="spinner_OLMs"
-            begin="spinner_4v5M.end"
-            attributeName="cx"
-            dur="0.001s"
-            values="20;4"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_OLMs.end"
-            attributeName="r"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="0;3"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_UHR2.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="4;12"
-            fill="freeze"
-          />
-          <animate
-            begin="spinner_Aguh.end"
-            attributeName="cx"
-            calcMode="spline"
-            dur="0.5s"
-            keySplines=".36,.6,.31,1"
-            values="12;20"
-            fill="freeze"
-          />
-        </circle>
-      </svg>
-    </div>
-  } @else {
-    <ng-container>
-      <div class="flex items-center justify-center gap-small">
-        @if (icon) {
-          <fx-ui-hero-icon
-            [icon]="icon"
-            [size]="16"
-            class="flex"
-            [ngClass]="{
-              'text-text-inverse': buttonVariant() === 'default',
-              'text-text-primary': buttonVariant() === 'alternative',
-              'text-accent-contrast': buttonVariant() === 'primary',
-              'text-surface': buttonVariant() === 'success',
-              'text-white': buttonVariant() === 'cta',
-            }"
-          ></fx-ui-hero-icon>
-        }
-        @if (label) {
-          <!-- text-box: optical centering — Archivo's leading floats ink up otherwise -->
-          <div class="[text-box:trim-both_cap_alphabetic]">{{ label }}</div>
-        }
-      </div>
-    </ng-container>
-  }
+  <!-- Loading keeps the LABEL, as the sign-in button does: a button that
+       swaps its text for a spinner collapses to a stub, and the row jumps.
+       The ring is that button's `.li-spin`, in the foreground the variant
+       already uses for its icon so it reads on a coloured ground. -->
+  <!-- 6px, the reference button's own gap; `gap-small` is 4px. -->
+  <div class="flex items-center justify-center gap-[6px]">
+    @if (loading()) {
+      <span
+        class="fx-btn__spin"
+        aria-hidden="true"
+        [ngClass]="{
+          'text-text-inverse': buttonVariant() === 'default',
+          'text-text-primary': buttonVariant() === 'alternative',
+          'text-accent-contrast': buttonVariant() === 'primary',
+          'text-surface': buttonVariant() === 'success',
+          'text-white': buttonVariant() === 'cta',
+        }"
+      ></span>
+    } @else if (icon) {
+      <fx-ui-hero-icon
+        [icon]="icon"
+        [size]="13"
+        class="flex"
+        [ngClass]="{
+          'text-text-inverse': buttonVariant() === 'default',
+          'text-text-primary': buttonVariant() === 'alternative',
+          'text-accent-contrast': buttonVariant() === 'primary',
+          'text-surface': buttonVariant() === 'success',
+          'text-white': buttonVariant() === 'cta',
+        }"
+      ></fx-ui-hero-icon>
+    }
+    @if (label) {
+      <!-- text-box: optical centering — Archivo's leading floats ink up otherwise -->
+      <div class="[text-box:trim-both_cap_alphabetic]">{{ label }}</div>
+    }
+  </div>
 </button>

package/src/lib/ui/components/button/button.component.scss

@@ -0,0 +1,30 @@
+
+
+/* Loading ring — the sign-in button's `.li-spin`, sized to sit beside a label.
+   `currentColor` so the variant's own foreground class colours it. */
+.fx-btn__spin {
+  display: inline-block;
+  /* 12px, matching the button's 13px icon — 14 crowded the 27px box. */
+  width: 12px;
+  height: 12px;
+  flex: 0 0 auto;
+  border-radius: 50%;
+  border: 2px solid currentColor;
+  border-top-color: transparent;
+  opacity: 0.9;
+  animation: fx-btn-spin 0.8s linear infinite;
+}
+
+@keyframes fx-btn-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* A ring that has stopped still marks the button as busy, and `aria-busy`
+   carries the state regardless. */
+@media (prefers-reduced-motion: reduce) {
+  .fx-btn__spin {
+    animation: none;
+  }
+}

package/src/lib/ui/components/drawer/drawer.component.html

@@ -105,12 +105,12 @@
           @if (item.iconData) {
             <lucide-icon
               [img]="item.iconData"
-              [size]="isExpanded ? 13 : 18"
+              [size]="isExpanded ? 15 : 20"
               class="item-icon"
               [class.item-icon--solid]="item.iconSolid"
             />
           } @else {
-            <fx-ui-hero-icon [icon]="item.icon" [size]="isExpanded ? 13 : 18" class="item-icon"></fx-ui-hero-icon>
+            <fx-ui-hero-icon [icon]="item.icon" [size]="isExpanded ? 15 : 20" class="item-icon"></fx-ui-hero-icon>
           }
           @if (isExpanded) {
             <span class="item-label">{{ item.label }}</span>
@@ -136,12 +136,12 @@
           @if (item.iconData) {
             <lucide-icon
               [img]="item.iconData"
-              [size]="isExpanded ? 13 : 18"
+              [size]="isExpanded ? 15 : 20"
               class="item-icon"
               [class.item-icon--solid]="item.iconSolid"
             />
           } @else {
-            <fx-ui-hero-icon [icon]="item.icon" [size]="isExpanded ? 13 : 18" class="item-icon"></fx-ui-hero-icon>
+            <fx-ui-hero-icon [icon]="item.icon" [size]="isExpanded ? 15 : 20" class="item-icon"></fx-ui-hero-icon>
           }
           @if (isExpanded) {
             <span class="item-label">{{ item.label }}</span>

package/src/lib/ui/components/drawer/drawer.component.scss

@@ -184,7 +184,9 @@
 .drawer-section-label {
   /* Demo (.og-sidebar__section sau override): 10.5px, text-faint, giãn chữ
      .08em và KHÔNG viết hoa — override đặt `text-transform: none`. */
-  @apply px-large pt-4 pb-1 text-[10.5px]/[1.4] font-semibold text-faint select-none;
+  /* 11.5px since 17/09, up from the demo's 10.5 — it moves with the rows it
+     captions, or the caption reads as a different scale from the nav. */
+  @apply px-large pt-4 pb-1 text-[length:var(--og-fs-xs)]/[1.4] font-semibold text-faint select-none;
   letter-spacing: var(--og-tracking-label);
 }
 
@@ -204,9 +206,13 @@
      8px in, not 16. */
   @apply flex items-center w-full border-none bg-transparent cursor-pointer no-underline relative;
   margin-top: 1px;
-  min-height: 30px;
-  padding: 6px 8px;
-  font-size: var(--og-fs-sm);
+  /* +12% on the reference's 12.5px/30px row (anh Tú 17/09: bump the font size
+     of the sidebar a bit like 10-20%). The row has to grow with the text or
+     the 20px leading exceeds `min-height` and the declared height stops being
+     the shipped one — the mistake the 0.7.107 note below records. */
+  min-height: 34px;
+  padding: 7px 8px;
+  font-size: 14px;
   color: rgb(var(--og-text-body));
   border-radius: var(--og-radius-control);
   transition: background-color 130ms ease, color 130ms ease;
@@ -268,8 +274,8 @@
    carries the row on its own and goes back up to 18px (anh Tú 16/09). Expanded
    it stays at the reference's 13px mark. */
 .drawer-item.is-collapsed .item-icon {
-  width: 18px;
-  height: 18px;
+  width: 20px;
+  height: 20px;
   margin-right: 0;
 }
 
@@ -297,21 +303,22 @@
 .item-icon {
   @apply flex-shrink-0;
   color: inherit;
-  /* The reference's mark is a 12.5px glyph sitting in an 18px slot, so the
-     ICON is 13px and the 5px below restores the slot: 13 + 5 + the container's
-     9px gap = 27px from the icon's left edge to the label, exactly as in the
-     design. Sizing the icon itself 18px drew it half again too large. */
-  width: 13px;
-  height: 13px;
-  margin-right: 5px;
+  /* The reference's mark is a 12.5px glyph in an 18px slot — icon 13px plus
+     5px to restore the slot, i.e. 13 + 5 + the container's 9px gap = 27px from
+     the icon's left edge to the label. Scaled with the 14px label (17/09):
+     15px + 6px keeps the same proportion at 30px. Sizing the icon itself 18px
+     drew it half again too large. */
+  width: 15px;
+  height: 15px;
+  margin-right: 6px;
 }
 
 .item-label {
-  /* Size comes from .drawer-item (12.5px, 0.7.107) — no second scale here.
-     Leading is 18px, not `leading-5`'s 20px: the label is the tallest thing in
-     the row, so 20 + 6 + 6 padding made every row 32px and the declared
-     `min-height: 30px` never applied. The reference's row is 30. */
-  @apply flex-1 whitespace-nowrap overflow-hidden text-ellipsis leading-[18px] text-left;
+  /* Size comes from .drawer-item (14px since 17/09) — no second scale here.
+     Leading tracks it: 20px, and the row's 7px padding either side makes 34,
+     which is what `min-height` now declares. Raising one without the other is
+     how the row's stated height stopped matching the shipped one before. */
+  @apply flex-1 whitespace-nowrap overflow-hidden text-ellipsis leading-[20px] text-left;
   font-size: inherit;
 }
 
@@ -329,7 +336,7 @@
 }
 
 .drawer-version {
-  @apply flex items-center justify-center py-3 px-4 text-text-placeholder text-[11px] border-t border-border-default select-none;
+  @apply flex items-center justify-center py-3 px-4 text-text-placeholder text-[12px] border-t border-border-default select-none;
   font-family: var(--og-font-mono);
 }
 

package/src/lib/ui/components/master-detail/master-detail.component.css

@@ -73,9 +73,21 @@
     min-height: 420px;
   }
 
-  /* Panes CO GIÃN: facets/list nhường chỗ để cụm detail luôn có sàn 400px.
-     `--fx-md-list-width` (input `listWidth`) giờ là bề rộng MONG MUỐN kiêm
-     tối đa của cụm list, không còn là con số cứng. */
+  /* Track widths are the DESIGN'S own: every three-column screen in the demo
+     bundle is `204px minmax(0,1fr) 340px` — measured on Results, License and
+     Relationships, 17/09. So the rail and the DETAIL are the fixed tracks and
+     the LIST takes what is left.
+
+     It used to be the other way round: the list was capped at 420px and the
+     detail was `flex: 1 1 360px`, so every pixel of a wide window went to the
+     reading pane — ~930px of it at 1920, against a list that never grew past
+     420 (anh Tú 17/09: kéo rộng cột list ra và thu nhỏ cột detail lại).
+
+     All three still SHRINK below their track (`flex-basis` + a floor, not a
+     hard width): with the rail open the three floors add up past the 720px
+     where this query starts, and a pane that refuses to give way would push
+     the frame into a horizontal scrollbar instead. Collapsed, the rail is
+     40px and 40 + 260 + 300 fits. */
   /* Hairline to the RIGHT of rail and list instead of below. */
   .fx-md-facets,
   .fx-md-list {
@@ -91,10 +103,10 @@
     max-width: 40px;
   }
   .fx-md-facets--open {
-    flex: 0 1 230px;
+    flex: 0 1 204px;
     width: auto;
-    min-width: 200px;
-    max-width: 260px;
+    min-width: 180px;
+    max-width: 204px;
   }
   .fx-md-rail-toggle {
     height: 100%;
@@ -109,14 +121,30 @@
 
   .fx-md-list {
     width: auto;
-    flex: 0 1 var(--fx-md-list-width, 420px);
+    flex: 1 1 0;
     min-width: 260px;
-    max-width: var(--fx-md-list-width, 420px);
+    /* Uncapped unless a caller asks for one — see the `listWidth` input. */
+    max-width: var(--fx-md-list-width, none);
   }
 
   .fx-md-detail {
+    width: auto;
+    flex: 0 1 var(--fx-md-detail-width, 340px);
+    min-width: 300px;
+    max-width: var(--fx-md-detail-width, 340px);
+  }
+
+  /* `detailWidth="auto"`: the pre-0.7.130 split, kept for the panes that need
+     the room (Binaries, Remediation — anh Tú 17/09). The detail takes the
+     spare width and the LIST goes back to being the capped one. */
+  .fx-md-row--detail-fluid .fx-md-list {
+    flex: 0 1 var(--fx-md-list-width, 420px);
+    max-width: var(--fx-md-list-width, 420px);
+  }
+  .fx-md-row--detail-fluid .fx-md-detail {
     flex: 1 1 360px;
     min-width: 360px;
+    max-width: none;
   }
 }
 

package/src/lib/ui/components/master-detail/master-detail.component.html

@@ -6,6 +6,8 @@
   class="fx-md-row flex flex-col items-stretch"
   [class.fx-md-row--rail-open]="railOpen()"
   [style.--fx-md-list-width]="listWidth()"
+  [class.fx-md-row--detail-fluid]="detailFluid()"
+  [style.--fx-md-detail-width]="detailFluid() ? null : detailWidth()"
   [style.--fx-md-pane-h]="paneHeight()"
 >
   <!-- Facets rail — collapsible (» / «), collapsed = 40px strip with the label
@@ -108,7 +110,7 @@
         <div class="flex gap-small">
           <button
             type="button"
-            class="btn-alternative !h-8 !px-semi text-sm"
+            class="btn-alternative"
             [disabled]="!paginator().hasPreviousPage()"
             (click)="paginator().previousPage()"
           >
@@ -116,7 +118,7 @@
           </button>
           <button
             type="button"
-            class="btn-alternative !h-8 !px-semi text-sm"
+            class="btn-alternative"
             [disabled]="!paginator().hasNextPage()"
             (click)="paginator().nextPage()"
           >

package/src/lib/ui/components/stat-cards/stat-cards.component.css

@@ -58,6 +58,24 @@
   margin-top: 6px;
 }
 
+/* The figure follows the BOX, not just the grid (anh Tú 18/09: show all the
+   stats numbers much smaller on the mobile screen). The 32px reference figure
+   is sized for a quarter of a desktop page; on a phone the strip is already
+   2-up, so each cell is ~175px and a six-digit count like 52,311 filled it
+   edge to edge. Same two thresholds the columns use, so the type steps down
+   with the layout rather than at some other width. */
+@container (width < 720px) {
+  .fx-stat-cell__figure {
+    font-size: 22px;
+    margin-top: 4px;
+  }
+}
+@container (width < 360px) {
+  .fx-stat-cell__figure {
+    font-size: 20px;
+  }
+}
+
 .fx-stat-cell__sub {
   font-size: var(--og-fs-xs);
   font-weight: 400;

package/types/foxeltech-angular-ui-flow.d.ts

@@ -51,14 +51,36 @@ declare class FlowCanvasComponent {
     readonly height: _angular_core.InputSignal<string>;
     /** Caller-translated hint shown when the graph is empty. */
     readonly emptyText: _angular_core.InputSignal<string>;
+    /**
+     * Work is running against this chain — validation, typically.
+     *
+     * The edges become a travelling dashed line ("marching ants") so the canvas
+     * says something is in flight without a spinner sitting on top of the graph.
+     * Purely presentational: the caller owns what "busy" means and when it ends.
+     */
+    readonly busy: _angular_core.InputSignal<boolean>;
     readonly nodeClick: _angular_core.OutputEmitterRef<string>;
     private readonly flow;
     private readonly host;
     private readonly destroyRef;
     constructor();
     private fitHandle;
-    /** Coalesces fit requests into one frame after vflow has measured its nodes. */
+    /**
+     * Coalesces fit requests, then fits TWICE — one frame apart.
+     *
+     * vflow frames the graph from `getNodesBounds`, which sums each node's
+     * `point()` and its `size()`. For an html-template node that size is the
+     * MEASURED box and is still 0 on the frame the nodes are created, so the
+     * first fit sees a bounds box running origin-to-origin: five 176px cards
+     * measured 864px instead of 1040px, and the graph was framed 88px — half a
+     * card — too far right, clipping the last one (MEASURED 16/09).
+     *
+     * The second pass runs once the cards have been laid out and measured, and
+     * is what actually frames them. The first is kept so a slow frame still
+     * shows something sensible rather than the graph pinned top-left.
+     */
     private scheduleFit;
+    private fit;
     /** Column index per node: pinned value, else longest path from a source. */
     private readonly columns;
     /** ngx-vflow nodes: html-template cards positioned by the derived layout. */
@@ -86,7 +108,7 @@ declare class FlowCanvasComponent {
     isEdgeActive(edge: Edge): boolean;
     isEdgeDimmed(edge: Edge): boolean;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FlowCanvasComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FlowCanvasComponent, "fx-ui-flow-canvas", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "edges": { "alias": "edges"; "required": false; "isSignal": true; }; "activeId": { "alias": "activeId"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; }, { "nodeClick": "nodeClick"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FlowCanvasComponent, "fx-ui-flow-canvas", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "edges": { "alias": "edges"; "required": false; "isSignal": true; }; "activeId": { "alias": "activeId"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "busy": { "alias": "busy"; "required": false; "isSignal": true; }; }, { "nodeClick": "nodeClick"; }, never, never, true, never>;
 }
 
 declare class FlowConnection {