npm - @akcelik/strct - Versions diffs - 0.2.0 → 0.3.0 - Mend

@@ -454,6 +454,8 @@ declare class StrctModal {
     protected readonly titleId: string;
     /** Element that had focus before the dialog opened, restored on close. */
     private previousActive;
+    /** Whether this instance currently holds a scroll lock. */
+    private locked;
     constructor();
     close(): void;
     protected onBackdrop(): void;
@@ -527,19 +529,24 @@ declare class StrctContextMenu {
 }
 /**
- * A nested fly-out inside a `strct-context-menu` or `strct-dropdown`. Reuse
- * `strct-dropdown-item` for the nested entries.
+ * A nested fly-out inside a `strct-context-menu` or `strct-dropdown`. Opens on
+ * hover, click/tap, or the keyboard (Enter / Space / →), and flips to the left
+ * near the right edge of the viewport. Reuse `strct-dropdown-item` for entries.
  *   <strct-submenu label="Power">
  *     <strct-dropdown-item>Power on</strct-dropdown-item>
  *     <strct-dropdown-item>Power off</strct-dropdown-item>
  *   </strct-submenu>
  */
 declare class StrctSubmenu {
+    private readonly host;
     readonly label: _angular_core.InputSignal<string>;
     /** Optional leading icon; when omitted the icon column is still reserved so
      *  the label stays aligned with sibling items that do have icons. */
     readonly icon: _angular_core.InputSignal<string>;
     readonly open: _angular_core.WritableSignal<boolean>;
+    /** Open to the left when the fly-out would overflow the right edge. */
+    protected readonly flip: _angular_core.WritableSignal<boolean>;
+    protected setOpen(value: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctSubmenu, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctSubmenu, "strct-submenu", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, ["[strctSubmenuLabel]", "*"], true, never>;
 }
@@ -697,6 +704,35 @@ declare class StrctPagination {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctPagination, "strct-pagination", never, { "total": { "alias": "total"; "required": true; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; }, { "page": "pageChange"; }, never, never, true, never>;
 }
+/**
+ * Form-field wrapper: a label (with optional required marker), the projected
+ * control, and a hint or error message. It auto-links the control via
+ * `aria-describedby` and sets `aria-invalid` when an error is present.
+ *
+ *   <strct-field label="Email" required hint="We never share it." [error]="emailError()">
+ *     <input strctInput type="email" [(ngModel)]="email" />
+ *   </strct-field>
+ */
+declare class StrctField {
+    readonly label: _angular_core.InputSignal<string>;
+    readonly required: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly hint: _angular_core.InputSignal<string>;
+    /** Error message (string or first-of array); falsy clears the error state. */
+    readonly error: _angular_core.InputSignal<string | string[] | null | undefined>;
+    private readonly host;
+    private readonly n;
+    protected readonly hintId: string;
+    protected readonly errorId: string;
+    protected readonly controlId: _angular_core.WritableSignal<string>;
+    protected readonly errorText: _angular_core.Signal<string>;
+    constructor();
+    private control;
+    private link;
+    private applyAria;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctField, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctField, "strct-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
 /**
  * Applies the shared `.strct-control` look to a native input / textarea / select.
  *   <input strctInput placeholder="Name" />
@@ -1546,5 +1582,5 @@ declare class StrctToastOutlet {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctToastOutlet, "strct-toast-outlet", never, {}, {}, never, never, true, never>;
 }
-export { STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_MASKS, STRCT_PALETTES, STRCT_RAW_ICONS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCascadeHost, StrctCascadeNode, StrctCascadeSelect, StrctCellDef, StrctChart, StrctCheckbox, StrctChips, StrctColorPicker, StrctCombobox, StrctContextMenu, StrctContextMenuTrigger, StrctDatagrid, StrctDatagridActionBar, StrctDatepicker, StrctDivider, StrctDonut, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctFile, StrctFooter, StrctGauge, StrctHeader, StrctIcon, StrctInput, StrctInputMask, StrctInputOtp, StrctKnob, StrctLogin, StrctMenuPanel, StrctModal, StrctNav, StrctNavItem, StrctOverlay, StrctPagination, StrctPassword, StrctProgress, StrctRadio, StrctRadioGroup, StrctRange, StrctRating, StrctRowDetailDef, StrctShell, StrctSignpost, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctStack, StrctStackItem, StrctStep, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctThemeService, StrctThemeSwitcher, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctTooltip, StrctTree, StrctTreeNode, StrctVerticalNav, StrctWizard, registerStrctIcon };
+export { STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_MASKS, STRCT_PALETTES, STRCT_RAW_ICONS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCascadeHost, StrctCascadeNode, StrctCascadeSelect, StrctCellDef, StrctChart, StrctCheckbox, StrctChips, StrctColorPicker, StrctCombobox, StrctContextMenu, StrctContextMenuTrigger, StrctDatagrid, StrctDatagridActionBar, StrctDatepicker, StrctDivider, StrctDonut, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctField, StrctFile, StrctFooter, StrctGauge, StrctHeader, StrctIcon, StrctInput, StrctInputMask, StrctInputOtp, StrctKnob, StrctLogin, StrctMenuPanel, StrctModal, StrctNav, StrctNavItem, StrctOverlay, StrctPagination, StrctPassword, StrctProgress, StrctRadio, StrctRadioGroup, StrctRange, StrctRating, StrctRowDetailDef, StrctShell, StrctSignpost, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctStack, StrctStackItem, StrctStep, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctThemeService, StrctThemeSwitcher, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctTooltip, StrctTree, StrctTreeNode, StrctVerticalNav, StrctWizard, registerStrctIcon };
 export type { StrctAlertType, StrctAvatarSize, StrctAvatarStatus, StrctBadgeStatus, StrctButtonSize, StrctButtonVariant, StrctCascadeOption, StrctCellContext, StrctChartStatus, StrctChartType, StrctColumn, StrctDatagridColumn, StrctDonutSegment, StrctIconBadge, StrctKnobStatus, StrctMenuItem, StrctModalSize, StrctMode, StrctOption, StrctOverlayPlacement, StrctPalette, StrctPaletteInfo, StrctProgressStatus, StrctRow, StrctRowId, StrctSignpostPosition, StrctSpeedDialDirection, StrctSpinnerSize, StrctTagStatus, StrctTimelineState, StrctToast, StrctToastOptions, StrctToastType, StrctTooltipPosition, StrctTreeNodeData };

@@ -1,6 +1,6 @@
 {
   "name": "@akcelik/strct",
-  "version": "0.2.0",
+  "version": "0.3.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",

@@ -0,0 +1,49 @@
+// Self-hosted fonts bundled with the library so it renders in its intended
+// typography without any external request. Both are OFL-licensed:
+//   DM Sans        — https://fonts.google.com/specimen/DM+Sans  (OFL)
+//   JetBrains Mono — https://www.jetbrains.com/lp/mono/          (OFL)
+// Imported by theme.scss; the woff2 files ship under `styles/fonts/`.
+@font-face {
+  font-family: 'DM Sans';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('./fonts/dm-sans-400.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'DM Sans';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('./fonts/dm-sans-500.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'DM Sans';
+  font-style: normal;
+  font-weight: 600;
+  font-display: swap;
+  src: url('./fonts/dm-sans-600.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'DM Sans';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url('./fonts/dm-sans-700.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'JetBrains Mono';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url('./fonts/jetbrains-mono-400.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'JetBrains Mono';
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url('./fonts/jetbrains-mono-500.woff2') format('woff2');
+}

@@ -5,6 +5,7 @@
 // `data-theme` ('dark' | 'light') on the <html> element (StrctThemeService
 // does this for you).
+@use 'fonts';
 @use 'tokens';
 @use 'base';
 @use 'forms';

@akcelik/strct 0.2.0 → 0.3.0