@akcelik/strct 4.23.0 → 4.25.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 +774 -41
- package/fesm2022/akcelik-strct.mjs.map +1 -1
- package/package.json +1 -1
- package/types/akcelik-strct.d.ts +111 -4
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@akcelik/strct",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.25.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
|
@@ -583,8 +583,27 @@ declare class StrctLogin {
|
|
|
583
583
|
readonly maxWidth: _angular_core.InputSignal<number>;
|
|
584
584
|
/** Enable two-panel split layout. */
|
|
585
585
|
readonly split: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
586
|
+
/**
|
|
587
|
+
* The aside's built-in art: `network` is the node diagram over the glow and
|
|
588
|
+
* dot grid; `grid` is the glow and grid alone. Palette tokens only, so it
|
|
589
|
+
* follows every scheme, and it is decorative — hidden from assistive tech.
|
|
590
|
+
*/
|
|
591
|
+
readonly art: _angular_core.InputSignal<"grid" | "network" | "none">;
|
|
592
|
+
/** An icon tile beside the product name. */
|
|
593
|
+
readonly brandIcon: _angular_core.InputSignal<string>;
|
|
594
|
+
/** The product name, in the aside's brand row. */
|
|
595
|
+
readonly brandName: _angular_core.InputSignal<string>;
|
|
596
|
+
/** The kicker line above the aside's content. */
|
|
597
|
+
readonly tagline: _angular_core.InputSignal<string>;
|
|
598
|
+
/** The network's nodes: x, y, radius and which pulse phase they follow. */
|
|
599
|
+
protected readonly NODES: {
|
|
600
|
+
x: number;
|
|
601
|
+
y: number;
|
|
602
|
+
r: number;
|
|
603
|
+
phase: number;
|
|
604
|
+
}[];
|
|
586
605
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctLogin, never>;
|
|
587
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctLogin, "strct-login", never, { "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "split": { "alias": "split"; "required": false; "isSignal": true; }; }, {}, never, ["[strctLoginAside]", "[strctLoginMain]", "*"], true, never>;
|
|
606
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctLogin, "strct-login", never, { "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "split": { "alias": "split"; "required": false; "isSignal": true; }; "art": { "alias": "art"; "required": false; "isSignal": true; }; "brandIcon": { "alias": "brandIcon"; "required": false; "isSignal": true; }; "brandName": { "alias": "brandName"; "required": false; "isSignal": true; }; "tagline": { "alias": "tagline"; "required": false; "isSignal": true; }; }, {}, never, ["[strctLoginAside]", "[strctLoginStatus]", "[strctLoginMain]", "*"], true, never>;
|
|
588
607
|
}
|
|
589
608
|
|
|
590
609
|
/** Marks the breadcrumb row projected above the title. */
|
|
@@ -782,6 +801,8 @@ declare class StrctButtonGroup {
|
|
|
782
801
|
type StrctBadgeStatus = 'neutral' | 'accent' | 'success' | 'warning' | 'critical';
|
|
783
802
|
/** Small inline status pill: `<strct-badge status="success">Active</strct-badge>`. */
|
|
784
803
|
declare class StrctBadge {
|
|
804
|
+
private readonly hostEl;
|
|
805
|
+
constructor();
|
|
785
806
|
/** Visual status color. */
|
|
786
807
|
readonly status: _angular_core.InputSignal<StrctBadgeStatus>;
|
|
787
808
|
/** Opt-in filled style instead of the default outlined style. */
|
|
@@ -802,6 +823,8 @@ type StrctTagStatus = 'neutral' | 'accent' | 'success' | 'warning' | 'critical';
|
|
|
802
823
|
* <strct-tag status="accent" removable (removed)="drop()">Frontend</strct-tag>
|
|
803
824
|
*/
|
|
804
825
|
declare class StrctTag {
|
|
826
|
+
private readonly hostEl;
|
|
827
|
+
constructor();
|
|
805
828
|
/** Visual status color. */
|
|
806
829
|
readonly status: _angular_core.InputSignal<StrctTagStatus>;
|
|
807
830
|
/** Show a remove button. */
|
|
@@ -2606,7 +2629,7 @@ declare class StrctField {
|
|
|
2606
2629
|
*/
|
|
2607
2630
|
declare class StrctInput {
|
|
2608
2631
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctInput, never>;
|
|
2609
|
-
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StrctInput, "input[strctInput], textarea[strctInput], select[strctInput]", never, {}, {}, never, never, true, never>;
|
|
2632
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StrctInput, "input[strctInput], textarea[strctInput], select[strctInput], input[strct-input], textarea[strct-input], select[strct-input]", never, {}, {}, never, never, true, never>;
|
|
2610
2633
|
}
|
|
2611
2634
|
|
|
2612
2635
|
/**
|
|
@@ -5076,6 +5099,8 @@ declare class StrctHero {
|
|
|
5076
5099
|
type StrctAlertType = 'info' | 'success' | 'warning' | 'critical';
|
|
5077
5100
|
/** Inline contextual banner. `<strct-alert type="warning">…</strct-alert>`. */
|
|
5078
5101
|
declare class StrctAlert {
|
|
5102
|
+
private readonly hostEl;
|
|
5103
|
+
constructor();
|
|
5079
5104
|
/** Visual type / variant. */
|
|
5080
5105
|
readonly type: _angular_core.InputSignal<StrctAlertType>;
|
|
5081
5106
|
/** Show a dismiss button. */
|
|
@@ -6174,6 +6199,8 @@ type StrctStatusDotSize = 'sm' | 'md';
|
|
|
6174
6199
|
* <strct-status-dot status="critical" size="sm" label="Node unreachable" />
|
|
6175
6200
|
*/
|
|
6176
6201
|
declare class StrctStatusDot {
|
|
6202
|
+
private readonly hostEl;
|
|
6203
|
+
constructor();
|
|
6177
6204
|
/** Status tone (canonical vocabulary: OK = 'success', info = 'accent'). */
|
|
6178
6205
|
readonly status: _angular_core.InputSignal<StrctStatus>;
|
|
6179
6206
|
/**
|
|
@@ -6596,6 +6623,70 @@ declare class StrctChatComposer {
|
|
|
6596
6623
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctChatComposer, "strct-chat-composer", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "maxRows": { "alias": "maxRows"; "required": false; "isSignal": true; }; "sendLabel": { "alias": "sendLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "send": "send"; }, never, never, true, never>;
|
|
6597
6624
|
}
|
|
6598
6625
|
|
|
6626
|
+
/**
|
|
6627
|
+
* A small, dependency-free QR encoder: byte mode, versions 1–10, the four error
|
|
6628
|
+
* correction levels. Enough for an `otpauth://` URI, which is what the library
|
|
6629
|
+
* needs it for — and nothing more, so it stays readable.
|
|
6630
|
+
*
|
|
6631
|
+
* The maths is the standard one (ISO/IEC 18004): the data is split into
|
|
6632
|
+
* codewords, Reed–Solomon parity is appended per block, the result is laid into
|
|
6633
|
+
* the matrix around the function patterns, and each of the eight masks is
|
|
6634
|
+
* scored so the best one is chosen.
|
|
6635
|
+
*/
|
|
6636
|
+
/** Error correction level: L ≈ 7%, M ≈ 15%, Q ≈ 25%, H ≈ 30% of codewords recoverable. */
|
|
6637
|
+
type StrctQrEcc = 'L' | 'M' | 'Q' | 'H';
|
|
6638
|
+
/** Reed–Solomon parity for one block. */
|
|
6639
|
+
declare function remainder(data: number[], degree: number): number[];
|
|
6640
|
+
/** The data codewords: mode, length, the bytes, a terminator, then padding. */
|
|
6641
|
+
declare function dataCodewords(bytes: Uint8Array, version: number, ecc: StrctQrEcc): number[];
|
|
6642
|
+
/**
|
|
6643
|
+
* Encode `value` as a QR matrix of booleans (true = dark module), without the
|
|
6644
|
+
* quiet zone — the renderer adds that.
|
|
6645
|
+
*/
|
|
6646
|
+
declare function strctQrMatrix(value: string, ecc?: StrctQrEcc): boolean[][];
|
|
6647
|
+
/** Internals, exported for the vector tests only. */
|
|
6648
|
+
declare const __qrInternals: {
|
|
6649
|
+
dataCodewords: typeof dataCodewords;
|
|
6650
|
+
remainder: typeof remainder;
|
|
6651
|
+
};
|
|
6652
|
+
|
|
6653
|
+
/**
|
|
6654
|
+
* A QR code the library draws, with the quiet zone and contrast a scanner needs
|
|
6655
|
+
* in every theme — not an image the consumer frames on white by hand.
|
|
6656
|
+
*
|
|
6657
|
+
* <strct-qr [value]="otpauthUri" label="Scan with your authenticator app" />
|
|
6658
|
+
*
|
|
6659
|
+
* **Dark modules on a light quiet zone, in every scheme.** That is a deliberate
|
|
6660
|
+
* exception to "tokens only": a themed QR code is an unscannable one. Show the
|
|
6661
|
+
* secret as text beside it, so enrolment works without a camera.
|
|
6662
|
+
*/
|
|
6663
|
+
declare class StrctQr {
|
|
6664
|
+
/** What the code carries — an `otpauth://` URI, a URL, any text. */
|
|
6665
|
+
readonly value: _angular_core.InputSignal<string>;
|
|
6666
|
+
/** Rendered size in px (the code is square). */
|
|
6667
|
+
readonly size: _angular_core.InputSignal<number>;
|
|
6668
|
+
/** The code's accessible name. */
|
|
6669
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
6670
|
+
/** How much of the code a scanner may lose and still read it. */
|
|
6671
|
+
readonly errorCorrection: _angular_core.InputSignal<StrctQrEcc>;
|
|
6672
|
+
/** The quiet zone, in modules. Four is what the spec asks for. */
|
|
6673
|
+
readonly quietZone: _angular_core.InputSignal<number>;
|
|
6674
|
+
private readonly matrix;
|
|
6675
|
+
/** The whole drawing's span in modules: the code plus its quiet zone. */
|
|
6676
|
+
protected readonly span: _angular_core.Signal<number>;
|
|
6677
|
+
protected readonly viewBox: _angular_core.Signal<string>;
|
|
6678
|
+
/** Dark modules merged into horizontal runs — far fewer rects to paint. */
|
|
6679
|
+
protected readonly rows: _angular_core.Signal<{
|
|
6680
|
+
y: number;
|
|
6681
|
+
runs: {
|
|
6682
|
+
x: number;
|
|
6683
|
+
width: number;
|
|
6684
|
+
}[];
|
|
6685
|
+
}[]>;
|
|
6686
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctQr, never>;
|
|
6687
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctQr, "strct-qr", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "errorCorrection": { "alias": "errorCorrection"; "required": false; "isSignal": true; }; "quietZone": { "alias": "quietZone"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
6688
|
+
}
|
|
6689
|
+
|
|
6599
6690
|
/**
|
|
6600
6691
|
* A value change, as one phrase: "v10.27 → v10.28". The old value is muted, the
|
|
6601
6692
|
* arrow is the library's, the new one is emphasised — and assistive tech hears
|
|
@@ -7233,5 +7324,21 @@ declare class StrctHeatmap {
|
|
|
7233
7324
|
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; }; "colLabelEvery": { "alias": "colLabelEvery"; "required": false; "isSignal": true; }; "colLabel": { "alias": "colLabel"; "required": false; "isSignal": true; }; "valueFormat": { "alias": "valueFormat"; "required": false; "isSignal": true; }; "thresholds": { "alias": "thresholds"; "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>;
|
|
7234
7325
|
}
|
|
7235
7326
|
|
|
7236
|
-
|
|
7237
|
-
|
|
7327
|
+
/**
|
|
7328
|
+
* Warn about a borrowed input name the component does not have.
|
|
7329
|
+
*
|
|
7330
|
+
* @param host the component's own element
|
|
7331
|
+
* @param selector what to call it in the message, e.g. `strct-alert`
|
|
7332
|
+
* @param owns the component's inputs from that list: name → its values,
|
|
7333
|
+
* used to suggest the right one
|
|
7334
|
+
*/
|
|
7335
|
+
declare function strctCheckHostInputs(host: HTMLElement, selector: string, owns: Record<string, string>): void;
|
|
7336
|
+
/**
|
|
7337
|
+
* Warn when a consumer's `display` overrides the one the component's layout
|
|
7338
|
+
* depends on — the usual way to give a custom element margins, and the usual
|
|
7339
|
+
* way to break a flex host.
|
|
7340
|
+
*/
|
|
7341
|
+
declare function strctCheckHostDisplay(host: HTMLElement, selector: string, expected: string): void;
|
|
7342
|
+
|
|
7343
|
+
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, StrctCardHeaderActions, StrctCardHeaderMeta, StrctCardHeaderNote, StrctCascadeColumn, StrctCascadeHost, StrctCascadeSelect, StrctCellDef, StrctCellStatus, StrctChange, StrctChart, StrctChatAttachment, StrctChatComposer, StrctChatMessage, StrctChatThread, StrctCheckbox, StrctChips, StrctCode, StrctCodeInline, StrctColorPicker, StrctCombobox, StrctCommandPalette, StrctConfirmOutlet, StrctConfirmService, StrctContextMenu, StrctContextMenuTrigger, StrctControlDescription, StrctCopy, StrctDatagrid, StrctDatagridActionBar, StrctDatagridActionBarCaption, StrctDatepicker, StrctDatetimePicker, StrctDesc, StrctDescriptionList, StrctDiff, StrctDivider, StrctDonut, StrctDrawer, StrctDrawerFooter, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctDropdownItemAction, StrctDropdownTrigger, StrctDurationPipe, StrctEmptyState, StrctField, StrctFieldGroup, StrctFieldHint, StrctFieldPrefix, StrctFieldSuffix, StrctFile, StrctFilterBar, StrctFlow, StrctFlowNodeTemplate, StrctFooter, StrctGauge, StrctHeader, StrctHeatmap, StrctHero, StrctHotkeysHelp, StrctHotkeysService, StrctIcon, StrctInlineEdit, StrctInput, StrctInputMask, StrctInputOtp, StrctKbd, StrctKnob, StrctLegend, StrctList, StrctListItem, StrctListItemDescription, StrctListItemLeading, StrctListItemMeta, StrctListItemTrailing, StrctLiveIndicator, StrctLogViewer, StrctLogin, StrctMediaFrame, StrctMenuPanel, StrctMenuService, StrctMenubar, StrctMetricTile, StrctModal, StrctModalContent, StrctNav, StrctNavItem, StrctNotificationCenter, StrctNumber, StrctOverlay, StrctPageHeader, StrctPageHeaderActions, StrctPageHeaderCrumbs, StrctPageHeaderTitleMeta, StrctPagination, StrctPassword, StrctPopover, StrctPopoverTrigger, StrctProgress, StrctQr, StrctRadio, StrctRadioGroup, StrctRail, StrctRange, StrctRatePipe, StrctRating, StrctReorder, StrctReorderGroup, StrctReorderHandle, StrctReorderItem, StrctResizeHandle, StrctRowDetailDef, StrctSearchbox, StrctSectionHeader, StrctSectionHeaderActions, StrctSectionHeaderMeta, StrctSectionMenu, StrctSegmented, StrctSelect, StrctShell, StrctShellService, StrctSiPipe, StrctSignpost, StrctSignpostTrigger, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctSplitButton, StrctSplitter, StrctStack, StrctStackItem, StrctStatusDot, StrctStep, StrctStepAction, StrctSteps, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctTagLeading, StrctThemeService, StrctThemeSwitcher, StrctTimeRangePicker, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctToolbar, StrctToolbarCaption, StrctToolbarSpacer, StrctTooltip, StrctTour, StrctTransfer, StrctTree, StrctTreeNode, StrctTreeSelect, StrctVerticalNav, StrctWatermark, StrctWindow, StrctWindowDock, StrctWindowService, StrctWizard, StrctWizardAside, __qrInternals, focusFirstIn, keepTabInside, lockBodyScroll, parseAnsi, provideStrctWizardDefaults, registerStrctIcon, restoreFocus, saveFocusedElement, strctCheckHostDisplay, strctCheckHostInputs, strctComputeDiff, strctDpPad, strctFormatBytes, strctFormatDuration, strctFormatRate, strctFormatSi, strctQrMatrix, strctValidationIcon, strctValidationTone, unlockBodyScroll };
|
|
7344
|
+
export type { StrctAlertType, StrctAvatarSize, StrctAvatarStatus, StrctBadgeStatus, StrctButtonSize, StrctButtonVariant, StrctCascadeOption, StrctCellContext, StrctChartAnnotation, StrctChartColor, StrctChartCurve, StrctChartSeries, StrctChartSlot, StrctChartStatus, StrctChartSummaryInfo, StrctChartThreshold, StrctChartType, StrctChatAuthor, StrctColumn, StrctCommandItem, StrctConfirmOptions, StrctConfirmTone, StrctDatagridColumn, StrctDatagridColumnState, StrctDatagridFilters, StrctDatagridLabels, StrctDatagridLazyState, StrctDescAlign, StrctDescItem, StrctDiffRow, StrctDonutSegment, StrctDrawerSide, StrctDrawerSize, StrctEmptyVariant, StrctFilterChip, StrctFlowDirection, StrctFlowEdge, StrctFlowNode, StrctFlowOrientation, StrctHeatmapCell, StrctHeatmapSummaryInfo, StrctHotkey, StrctIconBadge, StrctIconName, StrctKnobStatus, StrctLegendItem, StrctLiveLabels, StrctLiveState, StrctLogLine, StrctMediaState, StrctMenuItem, StrctMenuLink, StrctMenuOpenOptions, StrctMenuPlacement, StrctMenuSection, StrctMenubarItem, StrctMetricStatus, StrctModalSize, StrctMode, StrctNotification, StrctOption, StrctOverlayPlacement, StrctPalette, StrctPaletteInfo, StrctProgressSegment, StrctProgressStatus, StrctQrEcc, StrctRailItem, StrctRailStatus, StrctReorderEvent, StrctReorderMoveEvent, StrctRow, StrctRowId, StrctSegmentedOption, StrctSegmentedSize, StrctSignpostPosition, StrctSpeedDialDirection, StrctSpinnerSize, StrctStatus, StrctStatusDotSize, StrctStepPhase, StrctStepState, StrctStepsLabels, StrctTagStatus, StrctThresholds, StrctTimeRange, StrctTimeRangePreset, StrctTimelineState, StrctToast, StrctToastOptions, StrctToastType, StrctTooltipPosition, StrctTourStep, StrctTransferItem, StrctTreeDropEvent, StrctTreeMenuEvent, StrctTreeNodeData, StrctTreeNodeMenuFn, StrctValidationState, StrctValidationStatus, StrctWindowBounds, StrctWindowLabels, StrctWizardDefaults };
|