@akcelik/strct 4.15.0 → 4.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/akcelik-strct.mjs +162 -86
- package/fesm2022/akcelik-strct.mjs.map +1 -1
- package/package.json +1 -1
- package/types/akcelik-strct.d.ts +35 -6
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@akcelik/strct",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.16.0",
|
|
4
4
|
"description": "UIStruct — a standalone Angular component library with a tokenised, multi-palette theme system, built for datacenter / infrastructure management UIs.",
|
|
5
5
|
"author": "Serkan Akcelik <serkan.akcelik@gmail.com>",
|
|
6
6
|
"license": "MIT",
|
package/types/akcelik-strct.d.ts
CHANGED
|
@@ -824,6 +824,17 @@ type StrctAvatarStatus = 'none' | 'online' | 'busy' | 'offline';
|
|
|
824
824
|
* <strct-avatar name="Ada Lovelace" status="online" />
|
|
825
825
|
*/
|
|
826
826
|
declare class StrctAvatar {
|
|
827
|
+
/**
|
|
828
|
+
* An icon instead of initials — a group, an assistant, a brand mark. An
|
|
829
|
+
* `src` image still wins.
|
|
830
|
+
*/
|
|
831
|
+
readonly icon: _angular_core.InputSignal<string>;
|
|
832
|
+
/** `square` for a thing rather than a person (a group, an app). */
|
|
833
|
+
readonly shape: _angular_core.InputSignal<"circle" | "square">;
|
|
834
|
+
/** Surface tone. `neutral` keeps the default grey tile. */
|
|
835
|
+
readonly tone: _angular_core.InputSignal<StrctStatus | "accent-soft">;
|
|
836
|
+
/** The icon scales with the avatar. */
|
|
837
|
+
protected readonly iconSize: _angular_core.Signal<22 | 13 | 17>;
|
|
827
838
|
/** Image URL. */
|
|
828
839
|
readonly src: _angular_core.InputSignal<string>;
|
|
829
840
|
/** Display name (used for initials when src is absent). */
|
|
@@ -834,7 +845,7 @@ declare class StrctAvatar {
|
|
|
834
845
|
readonly status: _angular_core.InputSignal<StrctAvatarStatus>;
|
|
835
846
|
protected readonly initials: _angular_core.Signal<string>;
|
|
836
847
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctAvatar, never>;
|
|
837
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctAvatar, "strct-avatar", never, { "src": { "alias": "src"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
848
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctAvatar, "strct-avatar", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "src": { "alias": "src"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
838
849
|
}
|
|
839
850
|
|
|
840
851
|
/** Progress bar color variants. `neutral` is the quiet one: queued, idle, unknown. */
|
|
@@ -1402,6 +1413,10 @@ declare class StrctTree {
|
|
|
1402
1413
|
* with taller rows for touch-friendly or low-density consoles.
|
|
1403
1414
|
*/
|
|
1404
1415
|
readonly density: _angular_core.InputSignal<"compact" | "comfortable">;
|
|
1416
|
+
/** A bordered surface around the tree — for a picker inside a dialog. */
|
|
1417
|
+
readonly framed: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1418
|
+
/** Caps the height in px; the tree scrolls inside its frame. */
|
|
1419
|
+
readonly maxHeight: _angular_core.InputSignal<number | null>;
|
|
1405
1420
|
/** Per-node right-click menu resolver. */
|
|
1406
1421
|
readonly nodeMenu: _angular_core.InputSignal<StrctTreeNodeMenuFn | null>;
|
|
1407
1422
|
/**
|
|
@@ -1521,7 +1536,7 @@ declare class StrctTree {
|
|
|
1521
1536
|
/** Toggle a node's expansion, updating state and emitting outputs. */
|
|
1522
1537
|
toggleNode(node: StrctTreeNodeData): void;
|
|
1523
1538
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctTree, never>;
|
|
1524
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTree, "strct-tree", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "density": { "alias": "density"; "required": false; "isSignal": true; }; "nodeMenu": { "alias": "nodeMenu"; "required": false; "isSignal": true; }; "canDrag": { "alias": "canDrag"; "required": false; "isSignal": true; }; "canDrop": { "alias": "canDrop"; "required": false; "isSignal": true; }; "dragExpandDelay": { "alias": "dragExpandDelay"; "required": false; "isSignal": true; }; "chevronAriaLabel": { "alias": "chevronAriaLabel"; "required": false; "isSignal": true; }; "expandedIds": { "alias": "expandedIds"; "required": false; "isSignal": true; }; }, { "nodeDrop": "nodeDrop"; "nodeActivated": "nodeActivated"; "nodeMenuSelect": "nodeMenuSelect"; "expandedIds": "expandedIdsChange"; "expandedChange": "expandedChange"; "nodeToggled": "nodeToggled"; }, ["projectedNodes"], ["*"], true, never>;
|
|
1539
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTree, "strct-tree", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "density": { "alias": "density"; "required": false; "isSignal": true; }; "framed": { "alias": "framed"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "nodeMenu": { "alias": "nodeMenu"; "required": false; "isSignal": true; }; "canDrag": { "alias": "canDrag"; "required": false; "isSignal": true; }; "canDrop": { "alias": "canDrop"; "required": false; "isSignal": true; }; "dragExpandDelay": { "alias": "dragExpandDelay"; "required": false; "isSignal": true; }; "chevronAriaLabel": { "alias": "chevronAriaLabel"; "required": false; "isSignal": true; }; "expandedIds": { "alias": "expandedIds"; "required": false; "isSignal": true; }; }, { "nodeDrop": "nodeDrop"; "nodeActivated": "nodeActivated"; "nodeMenuSelect": "nodeMenuSelect"; "expandedIds": "expandedIdsChange"; "expandedChange": "expandedChange"; "nodeToggled": "nodeToggled"; }, ["projectedNodes"], ["*"], true, never>;
|
|
1525
1540
|
}
|
|
1526
1541
|
|
|
1527
1542
|
/** Fixed modal width presets: sm 480 · md 640 · lg 860 · xl 1080 (px). */
|
|
@@ -3517,8 +3532,12 @@ interface StrctDescItem {
|
|
|
3517
3532
|
/** Dim the value (secondary information). */
|
|
3518
3533
|
muted?: boolean;
|
|
3519
3534
|
}
|
|
3520
|
-
/**
|
|
3521
|
-
|
|
3535
|
+
/**
|
|
3536
|
+
* Value alignment for the stacked (non-inline) layout. `grid` gives the list
|
|
3537
|
+
* one label column sized to its longest label, so every value starts on the
|
|
3538
|
+
* same vertical line — what a hand-built `auto 1fr` grid is usually for.
|
|
3539
|
+
*/
|
|
3540
|
+
type StrctDescAlign = 'between' | 'start' | 'grid';
|
|
3522
3541
|
/**
|
|
3523
3542
|
* Compact definition list: aligned `label : value` rows with an optional trailing
|
|
3524
3543
|
* slot. The `inline` variant is the horizontal "stat strip" (label-value pairs in
|
|
@@ -3541,8 +3560,10 @@ declare class StrctDescriptionList {
|
|
|
3541
3560
|
readonly inline: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3542
3561
|
/** Value alignment in stacked mode. */
|
|
3543
3562
|
readonly align: _angular_core.InputSignal<StrctDescAlign>;
|
|
3563
|
+
/** Fixes the label column of `align="grid"` (e.g. `'160px'`). */
|
|
3564
|
+
readonly labelWidth: _angular_core.InputSignal<string | null>;
|
|
3544
3565
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDescriptionList, never>;
|
|
3545
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDescriptionList, "strct-description-list", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
3566
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDescriptionList, "strct-description-list", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "labelWidth": { "alias": "labelWidth"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
3546
3567
|
}
|
|
3547
3568
|
/**
|
|
3548
3569
|
* One projected `label → value` row inside a `<strct-description-list>`. The
|
|
@@ -3555,8 +3576,16 @@ declare class StrctDesc {
|
|
|
3555
3576
|
readonly mono: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3556
3577
|
/** Dim the projected value. */
|
|
3557
3578
|
readonly muted: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
3579
|
+
/** A status dot before the label — "Agent · connected". */
|
|
3580
|
+
readonly status: _angular_core.InputSignal<StrctStatus | null>;
|
|
3581
|
+
/** Accessible text for that dot; empty falls back to the per-status default. */
|
|
3582
|
+
readonly statusLabel: _angular_core.InputSignal<string>;
|
|
3583
|
+
/** A leading icon before the label. */
|
|
3584
|
+
readonly icon: _angular_core.InputSignal<string>;
|
|
3585
|
+
/** A quiet second line under the value — "last seen 12 s ago". */
|
|
3586
|
+
readonly note: _angular_core.InputSignal<string>;
|
|
3558
3587
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDesc, never>;
|
|
3559
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDesc, "strct-desc", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "mono": { "alias": "mono"; "required": false; "isSignal": true; }; "muted": { "alias": "muted"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
3588
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDesc, "strct-desc", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "mono": { "alias": "mono"; "required": false; "isSignal": true; }; "muted": { "alias": "muted"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "statusLabel": { "alias": "statusLabel"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "note": { "alias": "note"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
3560
3589
|
}
|
|
3561
3590
|
|
|
3562
3591
|
/** Column definition for the table. */
|